对普通用户隐藏图片和视频下载.

zhangzengfei

2022-10-14 c868f26356ee88f88a316c72e5aa17ef8060822e

 src/views/dataPush/components/point.vue

@@ -3,7 +3,7 @@
    <div class="search">
      <div class="left">
        <div class="id">
          点位名称
          点位名称/企业编码/场景
          <el-input v-model="inputText" placeholder="请输入" clearable></el-input>
        </div>
      </div>
@@ -17,42 +17,39 @@
        <span class="iconfont">&#xe614;</span>
        <span>添加点位</span>
      </div>
      <!-- <div class="switchBox">
        总点位开关
        <el-switch
          v-model="value1"
          width="60"
          active-color="#13ce66"
          inactive-color="#f0f3f5"
          @change="changeAll($event)"
        >
        </el-switch>
      </div> -->
    </div>

    <div class="switchBox">
      <span style="margin-right:10px">开启上报</span>
      <el-switch v-model="value1" active-color="#0065ff" @change="changeAll($event)"> </el-switch>
    </div>
    <div class="table-area">
      <el-table
        id="multipleTable"
        ref="multipleTable"
        v-loading="tbLoading"
        id="pointTable"
        ref="pointTable"
        :data="dataList"
        :fit="true"
        :default-sort="{ prop: 'createTime', order: 'descending' }"
        :default-sort="{ prop: 'companyCode', order: 'ascending' }"
      >
        <el-table-column prop="cameraName" label="点位名称" width="130px" show-overflow-tooltip></el-table-column>
        <el-table-column prop="channelCode" label="报警通道编码" show-overflow-tooltip></el-table-column>
        <el-table-column prop="companyCode" label="企业编码" width="130px" show-overflow-tooltip></el-table-column>
        <el-table-column prop="scenes" label="推送场景" show-overflow-tooltip></el-table-column>
        <el-table-column
          prop="channelCode"
          label="报警通道编码"
          min-width="250px"
          show-overflow-tooltip
        ></el-table-column>
        <el-table-column prop="companyCode" label="企业编码" width="150px" show-overflow-tooltip>
          <template slot-scope="scope">
            {{ scope.row.companyCode | fillCompanyCode(companyCodeOptions) }}
          </template>
        </el-table-column>
        <el-table-column prop="scenes" label="推送场景" min-width="100px" show-overflow-tooltip></el-table-column>
        <el-table-column prop="updatedAt" label="推送时间" width="100px" show-overflow-tooltip>
          <template slot-scope="scope">{{ scope.row.startTime }}-{{ scope.row.endTime }}</template>
        </el-table-column>
        <el-table-column prop="Enable" label="开关" width="70px" show-overflow-tooltip>
        <el-table-column prop="Enable" label="开关" width="60px" show-overflow-tooltip>
          <template slot-scope="scope">
            <el-switch
              v-model="scope.row.enable"
              @change="changeSwitch($event, scope.row)"
              active-color="#13ce66"
              inactive-color="#f0f3f5"
            >
            <el-switch v-model="scope.row.enable" @change="changeSwitch($event, scope.row)" active-color="#0065ff">
            </el-switch>
          </template>
        </el-table-column>
@@ -97,7 +94,10 @@
        <el-input v-model="ruleForm.ChannelCode" placeholder="请输入报警通道编码" style="width: 350px"></el-input>
      </el-form-item>
      <el-form-item label="企业编码" prop="CompanyCode">
        <el-input v-model="ruleForm.CompanyCode" placeholder="请输入企业编码" style="width: 350px"></el-input>
        <el-select style="width: 350px" v-model="ruleForm.CompanyCode" placeholder="请选择">
          <el-option v-for="item in companyCodeOptions" :key="item.value" :label="item.label" :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="推送场景" prop="Sceneslist">
        <el-select multiple style="width: 350px" v-model="ruleForm.Sceneslist" filterable placeholder="请选择">
@@ -156,8 +156,15 @@
import "./point/point.scss"

export default {
  filters: {
    fillCompanyCode(key, opts) {
      let obj = opts.find((t) => t.value == key)
      return obj ? obj.label : key
    }
  },
  data() {
    return {
      tbLoading: false,
      activeColor: "",
      inactiveColor: "#f0f3f5",
      value1: false,
@@ -238,24 +245,28 @@
        EndTime: [{ type: "string", required: true, message: "请选择结束时间", trigger: "change" }]
      },
      page: 1,
      size: 10, //分页相关
      total: 0 //总数,
      size: 20, //分页相关
      total: 0, //总数
      companyCodeOptions: [
        {
          value: "370300010",
          label: "370300010/汇丰"
        },
        {
          value: "370300450",
          label: "370300450/海益"
        },
        {
          value: "370300440",
          label: "370300440/金汇丰"
        },
        {
          value: "370300480",
          label: "370300480/中汇"
        }
      ]
    }
  },
  // computed: {
  //   // activeColor() {
  //   //   return this.value1 ? "#13ce66" : "#f0f3f5"
  //   // }
  // },
  // watch: {
  //   value1: {
  //     handler(newVal, oldVal) {
  //       console.log(newVal, oldVal, "newVal, oldVal")
  //       newVal ? (this.activeColor = "#13ce66") : (this.activeColor = "#f0f3f5")
  //     },
  //     deep: true
  //   }
  // },
  async created() {
    let query = { pageIndex: this.page, pageSize: this.size, keyword: this.inputText }
    this.query = query
@@ -275,7 +286,7 @@
          type: "success",
          message: "成功!"
        })
        this.checkCamerasList()
        // this.checkCamerasList()
      }
    },
    changeSwitch(val, row) {
@@ -407,12 +418,12 @@
    },
    handleSizeChange(size) {
      this.size = size
      this.checkCamerasList()
      this.checkCamerasList(1)
    },
    //分页功能
    refrash(page) {
      this.page = page
      this.checkCamerasList()
      this.checkCamerasList(1)
    },
    delCameras(row) {
      this.$confirm("确认要删除该点位吗, 是否继续?", "提示", {
@@ -431,6 +442,7 @@
      })
    },
    async checkCamerasList(val) {
      this.tbLoading = true
      if (val === 1) {
        let query = { pageIndex: this.page, pageSize: this.size, keyword: this.inputText }
        this.query = query
@@ -442,6 +454,10 @@
        this.dataList = res.data
        this.total = res.total
      }

      setTimeout(() => {
        this.tbLoading = false
      }, 300)
    },
    resetUser() {
      // this.ruleForm. = {
@@ -459,7 +475,6 @@
}
</script>

<style scoped lang="scss"></style>
<style scoped lang="scss">
.sub-account {
  padding: 20px;
@@ -625,10 +640,7 @@
    margin: 20px 0;
    text-align: center;
    justify-content: space-between;
    .switchBox {
      display: flex;
      align-items: center;
    }

    .add {
      margin-right: 20px;
      width: 126px;
@@ -655,7 +667,15 @@
      }
    }
  }

  .switchBox {
    display: flex;
    align-items: center;
    float: right;
    position: absolute;
    right: 20px;
    top: 130px;
    font-size: 14px;
  }
  .el-table ::v-deep {
    background-color: rgb(233, 235, 238);
    padding: 1px;
@@ -779,4 +799,17 @@
  color: #0065ff;
  border-color: #0065ff;
}

/* .el-switch__core {
  width: 40px !important;
  height: 20px;
}
.el-switch__core::after {
  width: 16px;
  height: 16px;
  margin-top: -1px;
}
.el-switch.is-checked .el-switch__core::after {
  margin-left: -17px;
} */
</style>