视频监控优化

project/shandong10086/apps/shandong/monitor/AppMonitorManage/AppMonitorManage.vue

@@ -4,7 +4,7 @@
                    :render-item="renderTreeItem" ref="DeviceSlider"/>
     <div class="monitorPane">
       <div class="headerBar">
-        <el-select default-first-option size="small" v-model="splitScreen">
+        <el-select default-first-option size="small" v-model="splitScreen" @change="onChange">
           <i slot="prefix" class="iconfont iconjdq_led_Led1"/>
           <el-option v-for="(op,i) in splitOps" :key="i" v-bind="op"/>
         </el-select>
@@ -14,11 +14,11 @@
         <div
           class="videoBox"
           v-for="(m,i) in monitors"
-          :key="i"
+          :key="m.id"
           @mouseenter.stop="m.isShowPlayBtn = true"
           @mouseleave.stop="m.isShowPlayBtn = false"
           :style="currentSplitStyle">
-          <AiMonitor :src="m.url" type="slw"></AiMonitor>
+            <AiMonitor :src="m.url" type="slw"></AiMonitor>
           <span>{{ m.name }}</span>
           <i class="el-icon-circle-close" v-if="m.isShowPlayBtn" title="关闭" @click="removeMonitor(i)"></i>
         </div>
@@ -98,6 +98,8 @@
         this.$fullscreen(this.fullscreen)
       },
       handleSelectMonitor(monitor) {
+        if (monitor.type !== '1') return
+
         let {id} = monitor,
             index = this.monitors.findIndex(e => e.id == id)
         if (index > -1) {
@@ -109,6 +111,12 @@
         }
       },
 
+      onChange (e) {
+        if (e === 1 && this.monitors.length) {
+          this.monitors = [this.monitors[0]]
+        }
+      },
+
       removeMonitor (i) {
         this.monitors.splice(i, 1)
       },