soc_web/src/views/iot/videoChannelPlan/channelPlanTimeDialog.vue

<template>
  <div class="edu-training-edit">
    <DialogCom title="通道前端录像配置详情" :visible.sync="isShow" width="1200px" >
      <div class="page-body">
        <div class="extend_mod" style="max-height: 500px;">
          <el-table :data="formData" border style="width: 100%;max-height: 700px;overflow-y: auto;">
            <el-table-column
              type="week"
              label="星期"
              align="center"
            >
              <template slot-scope="scope">
                {{ getWeekDesc(scope.row.week)}}
              </template>
            </el-table-column>
            <el-table-column
              prop="type"
              label="计划类型"
              align="center"
            >
              <template slot-scope="scope">
                {{ getTypeDesc(scope.row.type)}}
              </template>
            </el-table-column>
            <el-table-column
              prop="startTime"
              label="起始时间"
              align="center"
            >
            </el-table-column>
            <el-table-column
              align="center"
              prop="endTime"
              label="结束时间"
            >
            </el-table-column>
          </el-table>
        </div>
      </div>

      <div slot="footer" class="dialog-footer">
        <el-button @click="onHide">关闭</el-button>
      </div>
    </DialogCom>
  </div>
</template>

<script>
import {
  channelPlanTimeList
} from "@/api/iot/videoChannelPlan";

export default {
  name: "IotVideoChannelPlanTime",
  components: {},
  dicts: [],
  data() {
    return {
      isShow: false,
      formData: this.reset(),
    };
  },
  props: {},
  watch: {},
  computed: {
  },
  methods: {
    reset() {
      return {
        week: null,
        type: null,
        startTime: null,
        endTime: null,
      };
    },
    getWeekDesc(val){
      switch (val){
        case 1:
          return "星期一";
        case 2:
          return "星期二";
        case 3:
          return "星期三";
        case 4:
          return "星期四";
        case 5:
          return "星期五";
        case 6:
          return "星期六";
        case 7:
          return "星期日";
      }
    },
    getTypeDesc(val){
      //0-定时录像，1-移动侦测录像，2-报警录像，3-移动侦测或报警录像，4-移动侦测和报警录像）
      switch (val){
        case 0:
          return "定时录像";
        case 1:
          return "移动侦测录像";
        case 2:
          return "报警录像";
        case 3:
          return "移动侦测或报警录像";
        case 4:
          return "移动侦测和报警录像";
      }
    },
    async refresh(deviceId) {
      let query = {
        deviceId: deviceId,
        week: -1
      };
      console.log("11111")
      console.log("11111:"+query)
      channelPlanTimeList(query).then(response => {
        this.formData = response.data;
        this.loading = false;
      })
    },
    async show(deviceId) {
      await this.refresh(deviceId);
      this.isShow = true;
    },
    // 事件
    onHide() {
      this.isShow = false;
      this.formData = this.reset();
    },
  },
  mounted() {
  },
};
</script>
<style lang="scss">
</style>