显示效果优化

648540858
1 parent dbe6ece6
Showing 6 changed files with 49 additions and 11 deletions
web_src/src/components/DeviceList.vue
web_src/src/components/channelList.vue
web_src/src/components/control.vue
web_src/src/components/dialog/deviceEdit.vue
web_src/src/components/map.vue
web_src/src/components/service/DeviceService.js
@@ -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>
@@ -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 @@ export default {
   },
   data() {
     return {
+      deviceService: new DeviceService(),
+      device: null,
       deviceId: this.$route.params.deviceId,
       parentChannelId: this.$route.params.parentChannelId,
       deviceChannelList: [],
@@ -141,7 +145,17 @@ export default {
   },
  
   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');
@@ -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>
@@ -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" >
@@ -266,7 +266,20 @@ export default {
         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 () {
@@ -21,6 +21,19 @@ class DeviceService{
       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;