显示效果优化

648540858

2022-06-15 c2faa8c3ce858a5c5cbb0712eda4ac2df0d60693

显示效果优化

 web_src/src/components/DeviceList.vue

@@ -56,7 +56,7 @@
                     @mouseover="getTooltipContent(scope.row.deviceId)">刷新
          </el-button>
          <el-divider direction="vertical"></el-divider>
          <el-button type="text" size="medium" icon="el-icon-video-camera-solid" v-bind:disabled="scope.row.online==0"
          <el-button type="text" size="medium" icon="el-icon-video-camera" v-bind:disabled="scope.row.online==0"
                     @click="showChannelList(scope.row)">通道
          </el-button>
          <el-divider direction="vertical"></el-divider>

 web_src/src/components/channelList.vue

@@ -38,11 +38,11 @@
    <el-table-column prop="name" label="通道名称" min-width="200">
    </el-table-column>
    <el-table-column label="快照" min-width="120">
      <template slot-scope="scope">
      <template v-slot:default="scope">
        <el-image
          :src="getSnap(scope.row)"
          :preview-src-list="getBigSnap(scope.row)"
          @error="getSnapErrorEvent(scope.row.deviceId, cope.row.channelId)"
          @error="getSnapErrorEvent(scope.row.deviceId, scope.row.channelId)"
          :fit="'contain'"
          style="width: 60px">
          <div slot="error" class="image-slot">
@@ -71,8 +71,8 @@
    <el-table-column label="状态" min-width="120">
      <template slot-scope="scope">
        <div slot="reference" class="name-wrapper">
          <el-tag size="medium" v-if="scope.row.status == 1">在线</el-tag>
          <el-tag size="medium" type="info" v-if="scope.row.status == 0">离线</el-tag>
          <el-tag size="medium" v-if="scope.row.status === 1">在线</el-tag>
          <el-tag size="medium" type="info" v-if="scope.row.status === 0">离线</el-tag>
        </div>
      </template>
    </el-table-column>
@@ -112,6 +112,8 @@
import devicePlayer from './dialog/devicePlayer.vue'
import uiHeader from '../layout/UiHeader.vue'
import moment from "moment";
import DviceService from "./service/DeviceService";
import DeviceService from "./service/DeviceService";

export default {
  name: 'channelList',
@@ -121,6 +123,8 @@
  },
  data() {
    return {
      deviceService: new DeviceService(),
      device: null,
      deviceId: this.$route.params.deviceId,
      parentChannelId: this.$route.params.parentChannelId,
      deviceChannelList: [],
@@ -141,7 +145,17 @@
  },

  mounted() {
    if (this.deviceId) {
      this.deviceService.getDevice(this.deviceId, (result)=>{
          this.device = result;

      }, (error)=>{
        console.log("获取设备信息失败")
        console.error(error)
      })
    }
    this.initData();

  },
  destroyed() {
    this.$destroy('videojs');

 web_src/src/components/control.vue

@@ -235,10 +235,8 @@
      <el-table-column prop="local_ip" label="本地"></el-table-column>
      <el-table-column prop="typeid" label="类型"></el-table-column>
      <el-table-column align="right">
        <template slot="header" slot-scope="scope">
          <el-button icon="el-icon-refresh-right" circle @click="getAllSession()"></el-button>
        </template>
        <template slot-scope="scope">
        <template v-slot:default="scope">
          <el-button size="mini" icon="el-icon-refresh-right" circle @click="getAllSession()"></el-button>
          <el-button @click.native.prevent="deleteRow(scope.$index, allSessionData)" type="text" size="small">移除
          </el-button>
        </template>

 web_src/src/components/dialog/deviceEdit.vue

@@ -38,8 +38,8 @@
          </el-form-item>
          <el-form-item label="地理坐标系" prop="geoCoordSys" >
            <el-select v-model="form.geoCoordSys" style="float: left; width: 100%" >
              <el-option key="GCJ02" label="GCJ02" value="GCJ02"></el-option>
              <el-option key="WGS84" label="WGS84" value="WGS84"></el-option>
              <el-option key="GCJ02" label="GCJ02" value="GCJ02"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="目录订阅" title="0为取消订阅" prop="subscribeCycleForCatalog" >

 web_src/src/components/map.vue

@@ -266,7 +266,20 @@
        this.channel = channels[0]
      }
      this.$nextTick(() => {
        this.infoBoxId = this.$refs.map.openInfoBox([this.channel.longitude, this.channel.latitude], this.$refs.infobox, [0, -50])
        let longitudeStr;
        let latitudeStr;
        if (window.mapParam.coordinateSystem == "GCJ-02") {
          longitudeStr = "longitudeGcj02";
          latitudeStr = "latitudeGcj02";
        }else if (window.mapParam.coordinateSystem == "WGS84") {
          longitudeStr = "longitudeWgs84";
          latitudeStr = "latitudeWgs84";
        }else {
          longitudeStr = "longitude";
          latitudeStr = "latitude";
        }
        let position = [this.channel[longitudeStr], this.channel[latitudeStr]];
        this.infoBoxId = this.$refs.map.openInfoBox(position, this.$refs.infobox, [0, -50])
      })
    },
    closeInfoBox: function () {

 web_src/src/components/service/DeviceService.js

@@ -21,6 +21,19 @@
      if (typeof (errorCallback) == "function") errorCallback(error)
    });
  }

  getDevice(deviceId, callback, errorCallback){
    this.$axios({
      method: 'get',
      url:`/api/device/query/devices/${deviceId}`,
    }).then((res) => {
      if (typeof (callback) == "function") callback(res.data)
    }).catch((error) => {
      console.log(error);
      if (typeof (errorCallback) == "function") errorCallback(error)
    });
  }

  getAllDeviceList(callback,endCallback, errorCallback) {
    let currentPage = 1;
    let count = 100;