mark
2022-10-09 bf399dc65aa67c4355b0fdc516f8da5ca7234c82
src/views/dataPush/components/point.vue
@@ -3,14 +3,13 @@
    <div class="search">
      <div class="left">
        <div class="id">
          点位名称
          点位名称/企业编码/场景
          <el-input v-model="inputText" placeholder="请输入" clearable></el-input>
        </div>
      </div>
      <div class="right">
        <div class="button searchBtn" @click="checkCamerasList(1)">搜索</div>
        <!-- <div class="button resetBtn" @click="reset">重置</div> -->
      </div>
    </div>
    <div class="btns">
@@ -18,25 +17,20 @@
        <span class="iconfont">&#xe614;</span>
        <span>添加点位</span>
      </div>
      <div class="switchBox">
        <el-switch
          v-model="value1"
          width="60"
          @change="changeAll($event)"
          active-text="总点位开"
          inactive-text="总点位关"
        >
        </el-switch>
      </div>
    </div>
    <div class="switchBox">
      开启上报
      <el-table-column prop="Enable" label="开关" width="70px" show-overflow-tooltip>
        <el-switch v-model="value1" active-color="#0065ff" @change="changeAll($event)"> </el-switch>
      </el-table-column>
    </div>
    <div class="table-area">
      <el-table
        id="multipleTable"
        ref="multipleTable"
        :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>
@@ -47,12 +41,7 @@
        </el-table-column>
        <el-table-column prop="Enable" label="开关" width="70px" 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>
@@ -89,7 +78,7 @@
      class="add-ruleForm"
    >
      <el-form-item label="点位名称" prop="CameraName">
        <el-select style="width: 350px" v-model="ruleForm.CameraName" placeholder="请选择">
        <el-select filterable style="width: 350px" v-model="ruleForm.CameraName" placeholder="请选择">
          <el-option v-for="item in cameraOptions" :key="item.id" :label="item.name" :value="item.name"> </el-option>
        </el-select>
      </el-form-item>
@@ -115,7 +104,7 @@
              :picker-options="{
                start: '00:00',
                step: '00:30',
                end: ruleForm.EndTime ? ruleForm.EndTime : '23:30',
                end: ruleForm.EndTime ? ruleForm.EndTime : '24:00',
                maxTime: ruleForm.EndTime
              }"
            >
@@ -131,7 +120,7 @@
              :picker-options="{
                start: ruleForm.StartTime ? ruleForm.StartTime : '00:00',
                step: '00:30',
                end: '23:30',
                end: '24:00',
                minTime: ruleForm.StartTime
              }"
            >
@@ -150,13 +139,16 @@
<script>
import { getLocalCameraTree } from "@/api/area"
import { traverse } from "./point"
import { getClusterDevList } from "@/api/clusterManage"
import { camerasList, camerasCreate, camerasConfig, camerasSwitch, camerasUpdate, camerasDelete } from "@/api/report"
import "./point.scss"
import { traverse } from "./point/point"
import "./point/point.scss"
export default {
  data() {
    return {
      activeColor: "",
      inactiveColor: "#f0f3f5",
      value1: false,
      query: {},
      inputText: "", //输入框内容
@@ -227,7 +219,7 @@
      dataList: [],
      tip: 1, // 区分保存还是编辑 但是现在没有编辑
      rules: {
        CameraName: [{ required: true, message: "请选择设备名称", trigger: "change" }],
        CameraName: [{ required: true, message: "请选择点位名称", trigger: "change" }],
        ChannelCode: [{ required: true, message: "请输入报警通道编码", trigger: "blur" }],
        CompanyCode: [{ required: true, message: "请输入企业编码", trigger: "blur" }],
        Sceneslist: [{ type: "array", required: true, message: "请选择推送场景", trigger: "change" }],
@@ -239,6 +231,20 @@
      total: 0 //总数,
    }
  },
  // 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
@@ -250,7 +256,6 @@
  methods: {
    async changeAll(val) {
      console.log(val)
      let enable
      val ? (enable = 1) : (enable = 0)
      let rsp = await camerasSwitch({ enable: enable })
@@ -263,7 +268,6 @@
      }
    },
    changeSwitch(val, row) {
      console.log(val, row, "val, rowval, row")
      let params = {
        CameraName: row.cameraName,
        ChannelCode: row.channelCode,
@@ -279,7 +283,6 @@
        id: row.id
      }
      camerasUpdate(params).then((res) => {
        console.log(res, "res")
        if (res && res.success) {
          this.$message({
            type: "success",
@@ -289,7 +292,6 @@
      })
    },
    editCameras(row) {
      console.log(row, "row")
      this.tip = 2
      this.isShowAdd = true
      this.resetUser()
@@ -312,7 +314,6 @@
      // 总开关
      if (res && res.success) {
        res.data.enable === 0 ? (this.value1 = false) : (this.value1 = true)
        console.log(this.value1)
      }
      let clusterId = ""
      let clusterReq = await getClusterDevList()
@@ -322,7 +323,6 @@
          clusterId = clusterReq.data.clusterList[0].cluster_id
        }
      }
      console.log(clusterId)
      let camereReq = await getLocalCameraTree({ clusterId: clusterId })
      // 这个是 添加时的点位 是从摄像机页面 来的
      let array = []
@@ -339,7 +339,6 @@
          if (this.tip !== 1) {
            // tip1 是添加 其他是编辑
            let obj = this.cameraOptions.find((item) => item.name === this.ruleForm.CameraName)
            console.log(obj, "dddddddd")
            let params = {
              CameraName: this.ruleForm.CameraName,
              ChannelCode: this.ruleForm.ChannelCode,
@@ -354,8 +353,8 @@
              updatedAt: this.ruleForm.updatedAt,
              id: this.ruleForm.id
            }
            //  编辑
            camerasUpdate(params).then((res) => {
              console.log(res, "res")
              if (res && res.success) {
                this.$message({
                  type: "success",
@@ -367,7 +366,6 @@
            })
          } else {
            let obj = this.cameraOptions.find((item) => item.name === this.ruleForm.CameraName)
            console.log(obj, "dddddddd")
            let params = {
              CameraName: this.ruleForm.CameraName,
              ChannelCode: this.ruleForm.ChannelCode,
@@ -379,9 +377,8 @@
              Level: this.ruleForm.Level,
              Enable: this.ruleForm.Enable
            }
            console.log(params, "paramsv")
            // 新建
            camerasCreate(params).then((res) => {
              console.log(res, "res")
              if (res && res.success) {
                this.$message({
                  type: "success",
@@ -443,15 +440,6 @@
      this.ruleForm.Sceneslist = []
      this.ruleForm.StartTime = ""
      this.ruleForm.EndTime = ""
      //   Scenes: "",
      //   CameraId: "", // 摄像机id
      //   Level: "",
      //   Enable: false,
      //   createdAt: "",
      //   updatedAt: "",
      //   id: ""
      // }
    },
    goback() {
      this.isShowAdd = false
@@ -460,10 +448,6 @@
}
</script>
//
<style scoped lang="scss">
//
</style>
<style scoped lang="scss">
.sub-account {
  padding: 20px;
@@ -629,10 +613,7 @@
    margin: 20px 0;
    text-align: center;
    justify-content: space-between;
    .switchBox {
      display: flex;
      align-items: center;
    }
    .add {
      margin-right: 20px;
      width: 126px;
@@ -659,7 +640,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;
@@ -783,4 +772,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>