升压站缩略图排序；增加大数据样本库iframe；增加静音和锁屏图标；

.env.development

@@ -1,5 +1,5 @@
-VUE_APP_API=http://192.168.10.18:8099
-VUE_APP_SHARDINGURL=http://192.168.10.18:8075
-VUE_APP_ADAPTERURL=http://192.168.10.18:8011
-VUE_APP_APIS=192.168.10.18:8099
-VUE_APP_ADAPTERURLS=192.168.10.18:8011
+VUE_APP_API=http://18.6.30.63:8099
+VUE_APP_SHARDINGURL=http://18.6.30.63:8075
+VUE_APP_ADAPTERURL=http://18.6.30.63:8011
+VUE_APP_APIS=18.6.30.63:8099
+VUE_APP_ADAPTERURLS=18.6.30.63:8011

src/App.vue

@@ -3,8 +3,8 @@
     <div v-if="lockMaskDisplay" class="lockMask"></div>
     <!-- <div class="warningMask"></div> -->
     <TitleBar class="titleBar" />
-    <div class="left">
-      <Menu :lockMaskDisplay="lockMaskDisplay" :temperatureNum="temperatureNum" @handleChange="handleChange"
+    <div class="left" v-if="!webMisc">
+      <Menu :lockMaskDisplay="lockMaskDisplay" :voiceCV="voiceCV" :temperatureNum="temperatureNum" @handleChange="handleChange"
         @handleSearch="handleSearch" />
     </div>
     <div class="right">
@@ -34,6 +34,7 @@
     <AllMatrices v-model="matricesDisplay" />
     <SYZDetails v-model="syzDialogShow" :activeTabStation="activeTabStation"></SYZDetails>
     <AGCDetails v-model="agcDisplay"></AGCDetails>
+    <WebMisc v-model="webMisc"></WebMisc>
     <TemperatureMatrix v-model="temperatureDisplay" />
     <Fault v-model="faultDisplay" />
     <Warning v-model="warningDisplay" />
@@ -58,6 +59,7 @@ import api from "api/index";
 import boxSelect from "components/boxSelect.vue";
 import AGCDetails from "components/focus/agcDetails.vue";
 import SYZDetails from "components/focus/syzDetails.vue";
+import WebMisc from "components/webMisc.vue";
 import AllMatrices from "components/allMatrices.vue";
 import Setting from "components/setting.vue";
 import TemperatureMatrix from "components/temperatureMatrix.vue";
@@ -82,6 +84,8 @@ export default {
       statusDisplay: false, //查询-状态时间查询
       actionDisplay: false, //查询-动作查询
       lockMaskDisplay: false, //锁屏
+      voiceCV: false,
+      webMisc: false,//样本库
       syzDialogShow: false,
       settingDisplay: false,
       recordDisplay: false, //查询-推荐记录
@@ -101,6 +105,7 @@ export default {
     boxSelect,
     AGCDetails,
     SYZDetails,
+    WebMisc,
     AllMatrices,
     TemperatureMatrix,
     Fault,
@@ -189,7 +194,7 @@ export default {
       });
     },
     handleChange(val) {
-      if (val !== 9) {
+      if (val !== 10) {
         this.matricesDisplay = false;
         this.syzDialogShow = false;
         // this.$store.commit("syzDialogShow", false);
@@ -219,12 +224,18 @@ export default {
           this.agcDisplay = true;
           break;
         case 7:
+          this.webMisc = true;
+          break;
+        case 8:
           this.lockMaskDisplay = !this.lockMaskDisplay;
           break;
         case 9:
-          this.toImage();
+          this.voiceCV = !this.voiceCV;
           break;
         case 10:
+          this.toImage();
+          break;
+        case 11:
           this.settingDisplay = true;
           break;
         default:

src/components/PvDetailPages.vue

@@ -12,6 +12,9 @@
                 </div>
                 <div class="commonSty titleFont">
                     <span>逆变器状态</span>
+                    <div>
+                        <img :src="statusArr[windturbine.status]" alt="">
+                    </div>
                 </div>
                 <div v-for="(item, index) in nbqData" :key="index" class="commonSty arrSty">
                     <div class="arrName">
@@ -73,6 +76,14 @@
 <script>
 import api from "api/index";
 import * as echarts from "echarts";
+
+import img0 from '../assets/img/PV/pv_state_gre.png'
+import img1 from '../assets/img/PV/pv_state_blue.png'
+import img2 from '../assets/img/PV/pv_state_red.png'
+import img3 from '../assets/img/PV/pv_state_grey.png'
+import img4 from '../assets/img/PV/pv_state_org.png'
+import img5 from '../assets/img/PV/pv_state_vio.png'
+import img6 from '../assets/img/PV/pv_state_un.png'
 export default {
     props: {
         windturbine: {
@@ -98,7 +109,8 @@ export default {
             pvTitle: [],
             startTimer: null,
             echartTimer: null,
-            loading: false
+            loading: false,
+            statusArr: []
         };
     },
     computed: {
@@ -109,6 +121,7 @@ export default {
         }
     },
     created() {
+        this.statusArr = [img0, img1, img2, img3, img4, img5, img6]
     },
 
     methods: {
@@ -320,10 +333,17 @@ export default {
             margin-top: 10px;
             span{
                 color: #fff;
+                display: inline-block;
                 position: relative;
                 top: 8px;
                 left: 16px;
             }
+            img{
+                width: 20px;
+                height: 20px;
+                position: relative;
+                top: 10px;
+            }
         }
         .titleFont{
             width: calc(100% - 20px);

src/components/allMatrices.vue

@@ -431,7 +431,7 @@ export default {
         if (values.active) {
             let showIndex = null;
             this.chooseList.forEach((item, index) => {
-            if (item.windturbineId === values.windturbineId) {
+            if (item.id === values.id) {
                 showIndex = index;
             }
             });
@@ -740,9 +740,9 @@ export default {
                     )[0]?.value;
                     }
                     this.chooseList.forEach((item) => {
-                    if (item.windturbineId === val.windturbineId) {
-                        val.active = true;
-                    }
+                        if (item.windturbineId === val.windturbineId) {
+                            val.active = true;
+                        }
                     });
                     if (this.current === "all") {
                     this.stationObj[val.stationId]?.push(val);
@@ -761,6 +761,11 @@ export default {
                         this.stationObj[val.station]?.push(val);
                     }
                     }
+                    this.chooseList.forEach((item) => {
+                        if (item.id === val.id) {
+                            val.active = true;
+                        }
+                    });
                 }
             }
             this.current === "all" &&

src/components/focus/syzDetails.vue

@@ -151,7 +151,8 @@ export default {
             allHeight: 'D',
             allWarnData: [],
             starTimerWarn: null,
-            numm: 0
+            numm: 0,
+            stationSort: []
         };
     },
     computed: {
@@ -258,12 +259,16 @@ export default {
                         this.allSvgMsgData = []
                         allMsg.forEach(it =>{
                             if (it.id !== 'all') {
+                                this.stationSort.push(it.name)
                                 this.getallSvgDataFn(it.id, it.name)
                             }
                         })
                         // window.sessionStorage.setItem('allSvgData', [])
                         console.log('allSvgMsgData', this.allSvgMsgData)
+                        console.log('stationSort', this.stationSort)
+                        console.log('allMsg', allMsg)
                     }
+                    
                     // this.getSvgDataFn(res.data[0].id)
                 }
             })
@@ -283,6 +288,17 @@ export default {
                     msg: str
                 }
                 this.allSvgMsgData.push(obj)
+                if (this.allSvgMsgData.length === this.stationSort.length) {
+                    let sortArr = []
+                    this.stationSort.forEach(itc =>{
+                        this.allSvgMsgData.forEach(itb =>{
+                            if (itc === itb.name) {
+                                sortArr.push(itb)
+                            }
+                        })
+                    })
+                    this.allSvgMsgData = sortArr
+                }
             })
         },
         // 获取升压站数据
@@ -587,9 +603,45 @@ export default {
             this.$store.commit("activeTab", res.props.name);
             this.renderAlarm(res.props.name, false);
             if (res.props.name !== 'all') {
-                this.getSvgDataFn(res.props.name)
+                this.debounce(this.getSvgDataFn(res.props.name), 200)
+                // this.getSvgDataFn(res.props.name)
             }
         },
+        debounce(fn, delay) {
+            var delay = delay || 200;
+            var timer;
+            return function () {
+                var th = this;
+                var args = arguments;
+                if (timer) {
+                    clearTimeout(timer);
+                }
+                timer = setTimeout(function () {
+                    timer = null;
+                    fn.apply(th, args);
+                }, delay);
+            };
+        },
+        throttle(fn, interval) {
+            var last;
+            var timer;
+            var interval = interval || 200;
+            return function () {
+                var th = this;
+                var args = arguments;
+                var now = +new Date();
+                if (last && now - last < interval) {
+                    clearTimeout(timer);
+                    timer = setTimeout(function () {
+                        last = now;
+                        fn.apply(th, args);
+                    }, interval);
+                } else {
+                    last = now;
+                    fn.apply(th, args);
+                }
+            }
+        }
     },
     watch: {
         "$store.state.syzArray"(res) {

src/components/webMisc.vue

@@ -0,0 +1,111 @@
+<template>
+  <el-dialog
+    width="90%"
+    @open="opened"
+    @closed="closed"
+    :fullscreen="true"
+    :show-close="true"
+    custom-class="webMiscdialogs"
+  >
+    <template #title>
+      <div class="showTitles currentShowTitles">
+        <div class="titles">大数据训练样本库</div>
+      </div>
+    </template>
+    <div class="bodyy" :style="pageHeight">
+        <iframe src="http://18.6.30.66:8082/#/" class="iframeSty" frameborder="0" width="100%" height="98%"></iframe>
+    </div>
+  </el-dialog>
+</template>
+<script>
+export default {
+    data() {
+        return {}
+    },
+    computed: {
+        pageHeight() {
+            return {
+                'height': document.documentElement.clientHeight-70 + 'px'
+            }
+        }
+    },
+    methods: {}
+};
+</script>
+
+<style lang="less" scoped>
+.bodyy {
+    width: 100%;
+}
+</style>
+<style lang="less">
+.webMiscdialogs{
+    .el-dialog__header{
+        z-index: 11111111111;
+        position: relative;
+        background: rgb(50, 65, 87);
+    }
+    .el-dialog__body{
+        padding: 0 ;
+        .iframeSty{
+            position: absolute;
+            top: 5px;
+        }
+    }
+}
+</style>
+<style lang="less">
+.bodyy {
+  .pop-up-main,
+  .paln-box {
+    width: 100%;
+    height: 90vh;
+    overflow: hidden;
+    position: relative;
+  }
+  .movableItem {
+    // width: 1920PX !important;
+    // height: 800PX !important;
+
+    .svg {
+    //   width: 100%;
+    //   height: 92%;
+      margin-left: 0;
+      margin-top: 8%;
+    }
+  }
+
+  .el-badge__content.is-fixed.is-dot {
+    right: 0;
+    top: 10px;
+    background: #f25656;
+    animation: twinkle 0.75s infinite;
+    border-color: transparent;
+  }
+
+  @keyframes twinkle {
+    0% {
+      opacity: 0;
+    }
+    50% {
+      opacity: 1;
+    }
+    100% {
+      opacity: 0;
+    }
+  }
+}
+
+.currentShowTitles {
+  width: 100%;
+  position: relative;
+  .alarIcon {
+    position: absolute;
+    right: 50px;
+    top: 5;
+    font-size: 20px;
+    cursor: pointer;
+  }
+}
+
+</style>

src/views/Menu.vue

@@ -1,16 +1,17 @@
 <template>
   <div class="menu">
     <div
-      :class="item.id === 7 ? !lockMaskDisplay?'menu-item' :'menu-onItem': item.id === current?'menu-onItem': 'menu-item'"
+      :class="showmenuSty(item)"
       v-for="(item, index) in menuList"
       :key="index"
       @click="handleChange(item.id)"
       @mouseleave="leave(item.id)"
       @mouseenter="hovers(item.id)"
     >
+    <!-- :src="item.src" -->
       <img
-        :class="item.id !== 7 ? 'muen-icon' : 'muen-lock'"
-        :src="item.src"
+        :class="item.id !== 8 ? 'muen-icon' : 'muen-lock'"
+        :src="showIcon(item)"
         alt=""
       />
       <div v-if="item.id === 3" class="num">{{ temperatureNum }}</div>
@@ -49,8 +50,11 @@ import matrix from "../assets/img/menu/matrix.png";
 import booster from "../assets/img/menu/booster.png";
 import agc from "../assets/img/menu/agc.png";
 import search from "../assets/img/menu/search.png";
+import webMisc from "../assets/img/menu/webMisc.png";
 import lock from "../assets/img/menu/lock.png";
+import unlock from "../assets/img/menu/unlock.png";
 import voice from "../assets/img/menu/voice.png";
+import unvoice from "../assets/img/menu/unvoice.png";
 import screenshot from "../assets/img/menu/screenshot.png";
 import set from "../assets/img/menu/set.png";
 
@@ -64,6 +68,10 @@ export default {
       type: Boolean,
       default: false,
     },
+    voiceCV: {
+      type: Boolean,
+      default: false,
+    },
   },
   components: {
     // AGCDetails,
@@ -101,27 +109,84 @@ export default {
         },
         {
           id: 7,
-          src: lock,
+          src: webMisc,
         },
         {
           id: 8,
-          src: voice,
+          src: lock,
+          src1: unlock,
         },
         {
           id: 9,
-          src: screenshot,
+          src: voice,
+          src1: unvoice,
         },
         {
           id: 10,
+          src: screenshot,
+        },
+        {
+          id: 11,
           src: set,
         },
       ],
     };
   },
   methods: {
+    showmenuSty(item) {
+        let str = ''
+        if (item.id === this.current) {
+            str = 'menu-onItem'
+            if (item.id === 8) {
+                if (!this.lockMaskDisplay) {
+                    str = 'menu-item'
+                } else {
+                    str = 'menu-onItem'
+                }
+            }
+            if (item.id === 9) {
+                if (!this.voiceCV) {
+                    str = 'menu-item'
+                } else {
+                    str = 'menu-onItem'
+                }
+            }
+        } else {
+            str = 'menu-item'
+        }
+        // item.id === 8 ? !lockMaskDisplay?'menu-item' :'menu-onItem': item.id === current?'menu-onItem': 'menu-item'
+        return str
+    },
+    showIcon(item) {
+        let show = null
+        if (item.id === this.current) {
+            if (item.id === 8) {
+                if (this.lockMaskDisplay) {
+                    show = item.src
+                } else {
+                    show = item.src1
+                }
+            } else if (item.id === 9) {
+                if (this.voiceCV) {
+                    show = item.src1
+                } else {
+                    show = item.src
+                }
+            } else {
+                show = item.src
+            }
+        } else {
+            if (item.id === 8) {
+                show = item.src1
+            } else {
+                show = item.src
+            }
+        }
+        return show
+    },
     handleChange(val) {
-      if (!this.lockMaskDisplay || val === 7) {
-        if(val === 9){
+      if (!this.lockMaskDisplay || val === 8) {
+        if(val === 10){
           this.$emit("handleChange", val);
         }else if (val !== 6) {
           this.current = val;
@@ -134,7 +199,7 @@ export default {
       this.$emit("handleSearch", msg);
     },
     hovers(id) {
-      if (!this.lockMaskDisplay || id === 7) {
+      if (!this.lockMaskDisplay || id === 8) {
         if (id === 6) {
           this.display = true;
         } else {