Merge branch 'wvp-28181-2.0' into main-dev

648540858

2024-02-07 2e7c9a7341670d78f5a1ce061ac225b02d6f606f

 web_src/src/components/channelList.vue

@@ -44,12 +44,24 @@
      <DeviceTree ref="deviceTree" :device="device" :onlyCatalog="true" :clickEvent="treeNodeClickEvent" ></DeviceTree>
    </el-aside>
    <el-main style="padding: 5px;">
      <el-table ref="channelListTable" :data="deviceChannelList" :height="winHeight" style="width: 100%" header-row-class-name="table-header">
        <el-table ref="channelListTable" :data="deviceChannelList" :height="winHeight" style="width: 100%"
                  header-row-class-name="table-header">
        <el-table-column prop="channelId" label="通道编号" min-width="200">
        </el-table-column>
        <el-table-column prop="deviceId" label="设备编号" min-width="200">
        </el-table-column>
        <el-table-column prop="name" label="通道名称" min-width="200">
            <template v-slot:default="scope">
              <el-input
                v-show="scope.row.edit"
                v-model="scope.row.name"
                placeholder="通道名称"
                :maxlength="255"
                show-word-limit
                clearable
              />
              <span v-show="!scope.row.edit">{{ scope.row.name }}</span>
            </template>
        </el-table-column>
        <el-table-column label="快照" min-width="120">
          <template v-slot:default="scope">
@@ -70,12 +82,32 @@
        <el-table-column prop="manufacture" label="厂家" min-width="120">
        </el-table-column>
        <el-table-column label="位置信息"  min-width="200">
          <template slot-scope="scope">
            <span v-if="scope.row.longitude*scope.row.latitude > 0">{{ scope.row.longitude }},<br>{{ scope.row.latitude }}</span>
            <span v-if="scope.row.longitude*scope.row.latitude === 0">无</span>
            <template v-slot:default="scope">
              <el-input
                v-show="scope.row.edit"
                v-model="scope.row.location"
                placeholder="例：117.234,36.378"
                :maxlength="30"
                show-word-limit
                clearable
              />
              <span v-show="!scope.row.edit">{{ scope.row.location }}</span>
          </template>
        </el-table-column>
        <el-table-column prop="PTZTypeText" label="云台类型" min-width="120"/>
          <el-table-column prop="PTZType" label="云台类型" min-width="120">
            <template v-slot:default="scope">
              <el-select v-show="scope.row.edit" v-model="scope.row.PTZType"
                         placeholder="云台类型" filterable>
                <el-option
                  v-for="(value, key) in ptzTypes"
                  :key="key"
                  :label="value"
                  :value="key"
                />
              </el-select>
              <div v-show="!scope.row.edit">{{ scope.row.PTZTypeText }}</div>
            </template>
          </el-table-column>
        <el-table-column label="开启音频" min-width="120">
          <template slot-scope="scope">
            <el-switch @change="updateChannel(scope.row)" v-model="scope.row.hasAudio" active-color="#409EFF">
@@ -92,18 +124,44 @@
        </el-table-column>


        <el-table-column label="操作" min-width="280" fixed="right">
          <el-table-column label="操作" min-width="340" fixed="right">
          <template slot-scope="scope">
            <el-button size="medium" v-bind:disabled="device == null || device.online === 0" icon="el-icon-video-play" type="text" @click="sendDevicePush(scope.row)">播放</el-button>
            <el-button size="medium" v-bind:disabled="device == null || device.online === 0" icon="el-icon-switch-button" type="text"  style="color: #f56c6c" v-if="!!scope.row.streamId"
              <el-button size="medium" v-bind:disabled="device == null || device.online === 0" icon="el-icon-video-play"
                         type="text" @click="sendDevicePush(scope.row)">播放
              </el-button>
              <el-button size="medium" v-bind:disabled="device == null || device.online === 0"
                         icon="el-icon-switch-button"
                         type="text" style="color: #f56c6c" v-if="!!scope.row.streamId"
                       @click="stopDevicePush(scope.row)">停止
            </el-button>
            <el-divider direction="vertical"></el-divider>
            <el-button size="medium" icon="el-icon-s-open" type="text" v-if="scope.row.subCount > 0 || scope.row.parental === 1"
              <el-button
                v-if="scope.row.edit"
                size="medium"
                type="text"
                icon="el-icon-edit-outline"
                @click="handleSave(scope.row)"
              >
                保存
              </el-button>
              <el-button
                v-else
                size="medium"
                type="text"
                icon="el-icon-edit"
                @click="handleEdit(scope.row)"
              >
                编辑
              </el-button>
              <el-divider direction="vertical"></el-divider>
              <el-button size="medium" icon="el-icon-s-open" type="text"
                         v-if="scope.row.subCount > 0 || scope.row.parental === 1"
                       @click="changeSubchannel(scope.row)">查看
            </el-button>
            <el-divider v-if="scope.row.subCount > 0 || scope.row.parental === 1" direction="vertical"></el-divider>
            <el-button size="medium" v-bind:disabled="device == null || device.online === 0" icon="el-icon-video-camera" type="text" @click="queryRecords(scope.row)">设备录像
              <el-button size="medium" v-bind:disabled="device == null || device.online === 0"
                         icon="el-icon-video-camera"
                         type="text" @click="queryRecords(scope.row)">设备录像
            </el-button>
            <el-button size="medium" v-bind:disabled="device == null || device.online === 0" icon="el-icon-cloudy"
                       type="text" @click="queryCloudRecords(scope.row)">云端录像
@@ -163,7 +221,14 @@
      beforeUrl: "/deviceList",
      isLoging: false,
      showTree: false,
      loadSnap: {}
      loadSnap: {},
      ptzTypes: {
        0: "未知",
        1: "球机",
        2: "半球",
        3: "固定枪机",
        4: "遥控枪机"
      }
    };
  },

@@ -227,6 +292,14 @@
        if (res.data.code === 0) {
          that.total = res.data.data.total;
          that.deviceChannelList = res.data.data.list;
          that.deviceChannelList.forEach(e => {
            e.PTZType = e.PTZType + "";
            that.$set(e, "edit", false);
            that.$set(e, "location", "");
            if (e.longitude && e.latitude) {
              that.$set(e, "location", e.longitude + "," + e.latitude);
            }
          });
          // 防止出现表格错位
          that.$nextTick(() => {
            that.$refs.channelListTable.doLayout();
@@ -367,6 +440,14 @@
          if (res.data.code === 0) {
            this.total = res.data.data.total;
            this.deviceChannelList = res.data.data.list;
            this.deviceChannelList.forEach(e => {
              e.PTZType = e.PTZType + "";
              this.$set(e, "edit", false);
              this.$set(e, "location", "");
              if (e.longitude && e.latitude) {
                this.$set(e, "location", e.longitude + "," + e.latitude);
              }
            });
            // 防止出现表格错位
            this.$nextTick(() => {
              this.$refs.channelListTable.doLayout();
@@ -439,8 +520,66 @@
        this.parentChannelId = data.channelId;
      }
      this.initData();
    },
    // 保存
    handleSave(row) {
      if (row.location) {
        const segements = row.location.split(",");
        if (segements.length !== 2) {
          this.$message.warning("位置信息格式有误，例：117.234,36.378");
          return;
        } else {
          row.longitude = parseFloat(segements[0]);
          row.latitude = parseFloat(segements[1]);
          if (!(row.longitude && row.latitude)) {
            this.$message.warning("位置信息格式有误，例：117.234,36.378");
            return;
    }
        }
      } else {
        delete row.longitude;
        delete row.latitude;
      }
      Object.keys(row).forEach(key => {
        const value = row[key];
        if (value === null || value === undefined || (typeof value === "string" && value.trim() === "")) {
          delete row[key];
        }
      });
      this.$axios({
        method: 'post',
        url: `/api/device/query/channel/update/${this.deviceId}`,
        params: row
      }).then(response => {
        if (response.data.code === 0) {
          this.$message.success("修改成功！");
          this.initData();
        } else {
          this.$message.error("修改失败！");
        }
      }).catch(_ => {
        this.$message.error("修改失败！");
      })
    },
    // 是否正在编辑
    isEdit() {
      let editing = false;
      this.deviceChannelList.forEach(e => {
        if (e.edit) {
          editing = true;
        }
      });

      return editing;
    },
    // 编辑
    handleEdit(row) {
      if (this.isEdit()) {
        this.$message.warning('请保存当前编辑项！');
      } else {
        row.edit = true;
      }
    }
  }
};
</script>