改变点击事件弹出层

src/views/monitor/videos/index.vue

@@ -66,12 +66,16 @@
                   <div class="jingicon  shipin_zhengchang" :style="{ top: item.topPosition, left: item.leftPosition }"
                     v-if="showShipinjiankong_zhengchang">
                     <div class="myiconfont jingicon  bluezibg" v-if="showShipinjiankong_zhengchang" @mouseover="enter"
-                      @mouseleave="leave" @click.stop="openshipinShipinjiankong(index)">&#xe644;</div>
-                    <div class="seencons shipin_out noneDiv2" v-if="active == index">
+                      @mouseleave="leave" @click.stop="openshipinShipinjiankong(item, index)">&#xe644;</div>
+                    <div class="seencons shipin_out noneDiv2" style="top:-90px" v-if="active == index && topFlag">
                       <p @click="getVedioPcLive(item.id)">实时视频</p>
                       <p @click="getVedioPcRec(item.id)">回放视频</p>
                     </div>
-                    <div class="seenconsc shipin_out noneDiv">
+                    <div class="seencons shipin_out noneDiv2" v-if="active == index && buttonFlag">
+                      <p @click="getVedioPcLive(item.id)">实时视频</p>
+                      <p @click="getVedioPcRec(item.id)">回放视频</p>
+                    </div>
+                    <div class="seenconsc shipin_out noneDiv" style="top:0px;left:-250px">
                       <p>设备名称：{{ item.name }}</p>
                       <p>设备通道：{{ item.channelNo }}</p>
                     </div>
@@ -240,6 +244,8 @@ export default {
   },
   data() {
     return {
+      buttonFlag: false,
+      topFlag: false,
       checkList: ['选中且禁用', '复选框 A'],
       btnRuqinbaojing: [],
       btnShipinjiankong: [],
@@ -427,7 +433,15 @@ export default {
     openshipinRuqinbaojing() {
       this.seenshipinRuqinbaojing = !this.seenshipinRuqinbaojing
     },
-    openshipinShipinjiankong(index) {
+    openshipinShipinjiankong(item, index) {
+      this.topFlag = false;
+      this.buttonFlag = false;
+      var showTopButton = item.topPosition.slice(0, item.topPosition.lastIndexOf("%"))
+      if (showTopButton >= 80) {
+        this.topFlag = true;
+      } else {
+        this.buttonFlag = true;
+      }
       this.active = index
       this.seenshipinShipinjiankong = !this.seenshipinShipinjiankong
     },

src/views/zhiwujiance/zhiwujianceInfo.vue

@@ -93,8 +93,8 @@ export default {
       // tableKey: 0,
       // index: 0,
       viewTitle: '',
-      // fileUrl: 'http://8.130.39.13:7003/upload/monitor/',
-      fileUrl: 'http://huirong.ybkjyl.com/imagesDownload/',
+      fileUrl: 'http://8.130.39.13:7003/upload/monitor/',
+      // fileUrl: 'http://huirong.ybkjyl.com/imagesDownload/',
       supplierType_list: [
         { title: '摄像头', id: '1' },
       ],