yanzhu-bigscreen/src/views/bim/videoDialog.vue

@@ -1,63 +0,0 @@
-<template>
-  <MyDialog v-if="show" v-model="show" width="960px" height="650px" class="bim-video-dialog">
-    <template slot="title">{{ title }}</template>
-    <iframe frameborder="0" :src="iframeSrc" style="width: 100%; height: 100%" allowfullscreen></iframe>
-  </MyDialog>
-</template>
-
-<script>
-import MyDialog from "@/components/MyDialog";
-export default {
-  components: {
-    MyDialog,
-  },
-  name: "BimVideoDialog",
-
-  data() {
-    return {
-      show: false,
-      title: "",
-      itemData: null,
-      iframeSrc: "",
-      videoInfo: null,
-      accessToken: "",
-    };
-  },
-
-  mounted() {},
-
-  methods: {
-    showDialog(data, videoInfo) {
-      this.itemData = data;
-      this.title = data.name;
-      this.videoInfo = videoInfo;
-
-      console.log(data);
-      this.show = true;
-      this.loadVideo(videoInfo);
-    },
-    loadVideo(it) {
-      this.$api.videoMonitor.getYsToken(it.id).then((d) => {
-        this.accessToken = d.msg;
-        this.iframeSrc = "https://open.ys7.com/ezopen/h5/iframe?url=" + it.url + "&autoplay=1&accessToken=" + d.msg + "&t=" + +new Date();
-      });
-    },
-  },
-};
-</script>
-
-<style lang="less">
-.bim-video-dialog {
-  .popup-project-introduction-con {
-    height: 100%;
-    .popup-project-introduction-details {
-      height: calc(100% - 60px);
-      padding: 0px;
-      .quality-table.special-table {
-        height: 100%;
-        padding: 0px;
-      }
-    }
-  }
-}
-</style>

yanzhu-bigscreen/src/views/bimManage.vue

@@ -82,60 +82,24 @@
       </div>
     </div>
     <div class="test-box">
-      <div class="tag-box box-type-3">
-        <div class="tag-txt">
-          <div class="data-item"><span class="data-label">高度：</span><span class="data-value">15m</span></div>
-          <div class="data-item"><span class="data-label">高度：</span><span class="data-value">15m</span></div>
-          <div class="data-item"><span class="data-label">高度：</span><span class="data-value">15m</span></div>
-          <div class="data-item"><span class="data-label">高度：</span><span class="data-value">15m</span></div>
-          <div class="data-item"><span class="data-label">高度：</span><span class="data-value">15m</span></div>
-          <div class="data-item"><span class="data-label">高度：</span><span class="data-value">15m</span></div>
-          <div class="data-item"><span class="data-label">高度：</span><span class="data-value">15m</span></div>
-          <div class="data-item"><span class="data-label">高度：</span><span class="data-value">15m</span></div>
-          <div class="data-item"><span class="data-label">高度：</span><span class="data-value">15m</span></div>
-        </div>
-        <img src="bimImages/4.png" alt="" class="tag-bg-img" />
-        <img src="bimImages/towerMonitor.png" class="tag-img" />
-      </div>
-    </div>
-
-    <div class="test-box" style="left:400px">
       <div class='tag-box box-type-3'>
           
           <div class='tag-txt' >
-            <table class="tb-power">
+            <div class='data-item'><span class='data-label'>高度：</span><span class='data-value'>15m</span></div>
-           <tr>
+            <div class='data-item'><span class='data-label'>高度：</span><span class='data-value'>15m</span></div>
-            <td></td>
+            <div class='data-item'><span class='data-label'>高度：</span><span class='data-value'>15m</span></div>
-            <td width="150">电压</td>
+            <div class='data-item'><span class='data-label'>高度：</span><span class='data-value'>15m</span></div>
-            <td width="150">电流</td>
+            <div class='data-item'><span class='data-label'>高度：</span><span class='data-value'>15m</span></div>
-            <td width="150">功率</td>
+            <div class='data-item'><span class='data-label'>高度：</span><span class='data-value'>15m</span></div>
-           </tr>
+            <div class='data-item'><span class='data-label'>高度：</span><span class='data-value'>15m</span></div>
-            <tr>
+            <div class='data-item'><span class='data-label'>高度：</span><span class='data-value'>15m</span></div>
-              <td>A向</td>
+            <div class='data-item'><span class='data-label'>高度：</span><span class='data-value'>15m</span></div>
-              <td>1</td>
-              <td>2</td>
-              <td>3</td>
-            </tr>
-            <tr>
-              <td>A向</td>
-              <td>1</td>
-              <td>2</td>
-              <td>3</td>
-            </tr>
-             <tr>
-              <td>A向</td>
-              <td>1</td>
-              <td>2</td>
-              <td>3</td>
-            </tr>
-           </table> 
             
           </div>
           <img src='bimImages/4.png' alt='' class="tag-bg-img">
             <img src='bimImages/towerMonitor.png' class="tag-img">
         </div>
     </div>
-    <video-dialog ref="videoDlg"></video-dialog>
   </div>
 </template>
 
@@ -187,25 +151,13 @@ const css = `<style>
         margin-left:-10px;
     }
     .box-type-1{
-        height:80px;
+        height:60px;
         width:60px;
         display:block;
     }
-    .tb-power{
-      border-collapse: collapse;
-    }
-    .tb-power td{
-      border:solid 1px #75fbfd33;
-      padding:4px 8px;
-      text-align:center;
-    }
     </style>`;
 import debounce from "lodash.debounce";
-import videoDialog from './bim/videoDialog.vue'
 export default {
-  components: {
-    videoDialog
-  },
   data() {
     return {
       dpi: "",
@@ -222,7 +174,7 @@ export default {
       leftSrc: "./bimImages/arrow_left_retract.png",
       rightSrc: "./bimImages/arrow_right_retract.png",
       leftShow: true,
-      towerWarning: [],
+      towerWarning:[],
     };
   },
   beforeDestroy() {
@@ -248,7 +200,8 @@ export default {
     console.log("----mount--->");
     document.body.classList.add("is-sapi");
     this.initEngine();
-    this.$api.dict("device_tower_warning").then((d) => {
+    this.$api.dict("device_tower_warning").then(d => {
+      debugger
       this.towerWarning = d;
     });
   },
@@ -330,11 +283,6 @@ export default {
       this.addLabels.push(item.elId);
     },
     deviceClick(item, opt) {
-      if(item.deviceType==1){
-        let obj=this.videoData.find(d=>d.id==item.deviceId)
-        this.$refs.videoDlg.showDialog(item,obj)
-        return;
-      }
       console.log(item, opt);
     },
     addDeviceLabel() {
@@ -503,89 +451,44 @@ export default {
       this.loadDevDatatimeOut = setTimeout(this.loadDeviceData, 60 * 1000);
     },
     getTowerHtml(item) {
-      let txtHtml = "";
+      let warning=item.warnings;
-      if (item.elId) {
+      if(warning){
-        txtHtml = ``;
+        let tmps=this.towerWarning.filter(d=>d.value==item.warnings);
-      } else {
+        warning=tmps.length>0?tmps[0].label:'';
-        let warning = item.warnings;
-        if (warning) {
-          let tmps = this.towerWarning.filter((d) => d.value == item.warnings);
-          warning = tmps.length > 0 ? tmps[0].label : "";
-        }
-        let warningHtml = warning ? `<div class='data-item red'><span class='data-label'>警报：</span><span class='data-value'>${warning}</span></div>` : "";
-
-        txtHtml = `${warningHtml}
-            <div class='data-item'><span class='data-label'>高度：</span><span class='data-value'>${item.height}</span></div>
-            <div class='data-item'><span class='data-label'>吊重：</span><span class='data-value'>${item.load}</span></div>
-            <div class='data-item'><span class='data-label'>回转：</span><span class='data-value'>${item.rotation}</span></div>
-            <div class='data-item'><span class='data-label'>幅度：</span><span class='data-value'>${item.range}</span></div>
-            <div class='data-item'><span class='data-label'>风速：</span><span class='data-value'>${item.windSpeed}</span></div>
-            <div class='data-item'><span class='data-label'>水平倾角：</span><span class='data-value'>${item.leanAngleX}</span></div>
-            <div class='data-item'><span class='data-label'>垂直倾角：</span><span class='data-value'>${item.leanAngleY}</span></div>
-         `;
       }
+      let warningHtml=warning? `<div class='data-item red'><span class='data-label'>警报：</span><span class='data-value'>${warning}</span></div>`:'';
       return (
         css +
         `
         <div class='tag-box box-type-3'>
           <div class='tag-txt'>
-          ${txtHtml}
+            ${warningHtml}
-             </div>
+            <div class='data-item'><span class='data-label'>高度：</span><span class='data-value'>15m</span></div>
+            <div class='data-item'><span class='data-label'>吊重：</span><span class='data-value'>15m</span></div>
+            <div class='data-item'><span class='data-label'>回转：</span><span class='data-value'>15m</span></div>
+            <div class='data-item'><span class='data-label'>幅度：</span><span class='data-value'>15m</span></div>
+            <div class='data-item'><span class='data-label'>风速：</span><span class='data-value'>15m</span></div>
+            <div class='data-item'><span class='data-label'>水平倾角：</span><span class='data-value'>15m</span></div>
+            <div class='data-item'><span class='data-label'>垂直倾角：</span><span class='data-value'>15m</span></div>
+          </div>
           <img src='bimImages/4.png' alt='' class="tag-bg-img">
             <img src='bimImages/towerMonitor.png' class="tag-img">
         </div>`
       );
     },
-    fmtData(item){
-      if(item){
-        return (item*1).toFixed(2)
-      }
-      return ""
-    },
     getIotHtml(item) {
-      let txtHtml = "";
+      let bg = "4.png";
-      if (item.elId) {
+      let img = "power";
-        txtHtml = ``;
-      } else {
 
-        txtHtml = `
-           <table class="tb-power">
-           <tr>
-            <td></td>
-            <td width="60">电压</td>
-            <td width="60">电流</td>
-            <td width="60">功率</td>
-           </tr>
-            <tr>
-              <td>A向</td>
-              <td>${this.fmtData(item?.voltageA)}</td>
-              <td>${this.fmtData(item?.currentA)}</td>
-              <td>${this.fmtData(item?.powerA)}</td>
-            </tr>
-            <tr>
-              <td>B向</td>
-            <td>${this.fmtData(item?.voltageB)}</td>
-              <td>${this.fmtData(item?.currentB)}</td>
-              <td>${this.fmtData(item?.powerB)}</td>
-            </tr>
-            <tr>
-              <td>C向</td>
-            <td>${this.fmtData(item?.voltageC)}</td>
-              <td>${this.fmtData(item?.currentC)}</td>
-              <td>${this.fmtData(item?.powerC)}</td>
-            </tr>
-           </table> 
-         `;
-      }
       return (
         css +
         `
         <div class='tag-box box-type-4'>
-          <div class='tag-txt'>
+          <img src='bimImages/${bg}' alt='' class="tag-bg-img">
-          ${txtHtml}
+          <img src='bimImages/${img}.png' class="tag-img">
-             </div>
+          <span class='tag-txt' style='color:#ffffff;font-size:14px'>
-          <img src='bimImages/4.png' alt='' class="tag-bg-img">
+            
-            <img src='bimImages/power.png' class="tag-img">
+          </span>
         </div>`
       );
     },
@@ -730,7 +633,6 @@ export default {
     position: absolute;
     top: 10px;
     left: 10px;
-    display: none;
     .tag-box {
       position: relative;
       display: flex;
@@ -749,24 +651,13 @@ export default {
       width: 16px;
       height: 80px;
     }
-    .tag-bg-img {
-      width: 16px;
-      height: 80px;
-    }
     .tag-txt {
-      box-shadow: #1a9047 0px 4px 16px, rgba(10, 31, 68, 0.06) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px;
+      box-shadow: #1a9047 0px 4px 16px, rgba(10, 31, 68, .06) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px;
       color: #75fbfd;
       font-size: 12px;
       padding: 10px;
       background: #097fca63;
-      border: solid 1px #75fbfdaa;
+      border:solid 1px #75fbfdaa;
-    }
-    .tb-power{
-      border-collapse: collapse;
-    }
-    .tb-power td{
-      border:solid 1px #75fbfd33;
-      padding:4px 8px;
     }
   }
 }