增加头部数据，增加首页的手动页面

src/components/control/controlAllArea.vue

@@ -32,21 +32,19 @@
           <div class="scoll"> -->
         <div class="matrix" v-if="showList.length > 0">
           <box-select node=".box" @selectList="selectList">
-            
-                <!-- v-if="showWh(showList[0])" -->
+            <!-- v-if="showWh(showList[0])" -->
             <MatrixBlock
-                v-if="showWh(showList[0])"
-                @choose-click="handleClick"
-                @on-click="handleDetails"
-                :dataList="showList"
+              @choose-click="handleClick"
+              @on-click="handleDetails"
+              :dataList="showList"
             >
             </MatrixBlock>
-            <MatrixBlockPv
-                v-else
+            <!-- <MatrixBlockPv
+              v-else
               @on-click="handleDetialPv"
               :dataList="showList"
             >
-            </MatrixBlockPv>
+            </MatrixBlockPv> -->
           </box-select>
         </div>
         <!-- </div>
@@ -60,7 +58,11 @@
       @close="handleClose"
       :windturbine="currentWindturbine"
     ></WindturbineDetailPages>
-    <PvDetailPages v-model="dialogPvDia" @close="handleClose" :windturbine="currentWindturbinePv">
+    <PvDetailPages
+      v-model="dialogPvDia"
+      @close="handleClose"
+      :windturbine="currentWindturbinePv"
+    >
     </PvDetailPages>
     <ParametersContrast
       :chooseList="chooseList"
@@ -80,6 +82,8 @@ import api from "api/index";
 import boxSelect from "components/boxSelect.vue";
 import ParametersContrast from "./parametersContrast.vue";
 import MessageBridge from "utils/MessageBridge";
+
+import dataJson from "./controlJson.json";
 export default {
   name: "ProblemArea",
   components: {
@@ -160,21 +164,26 @@ export default {
   },
   computed: {},
   created: function () {
-    this.initData();
-    this.handleWindturbineChange();
-    this.controls();
-    this.getLocks();
-    this.intervals = setInterval(() =>{
-        this.handleWindturbineChange
-    }, 3000);
+    // this.initData();
+    // this.handleWindturbineChange();
+    // this.controls();
+    // this.getLocks();
+    // this.intervals = setInterval(() =>{
+    //     this.handleWindturbineChange
+    // }, 3000);
+  },
+  mounted() {
+    this.$nextTick(() => {
+      this.showList = dataJson.showList;
+    });
   },
   methods: {
     showWh(item) {
-        let show = false
-        if (item.stationId) {
-            show = true
-        }
-        return show
+      let show = false;
+      if (item.stationId) {
+        show = true;
+      }
+      return show;
     },
     selectList(val) {
       val.forEach((item) => {
@@ -182,124 +191,135 @@ export default {
       });
     },
     controls() {
-        this.options = [
-            {
-            value: "0",
-            label: "问题设备",
-            },
-            {
-            value: "1",
-            label: "故障",
-            },
-            {
-            value: "2",
-            label: "维护",
-            },
-            {
-            value: "3",
-            label: "离线",
-            },
-            {
-            value: "4",
-            label: "挂牌",
-            },
-        ];
-        let stationList = this.$store.state.stationList;
-        stationList.forEach((item, index) => {
-            if (item.id.indexOf("FDC") != -1 || item.id.indexOf("GDC") != -1) {
-                let obj = {};
-                obj.value = String(index + 6);
-                obj.label = item.name;
-                obj.stationId = item.code || item.id;
-                this.options.push(obj);
-            }
-        });
-        // let json = this.$store.state.windturbinelist;
-        let wswind = JSON.parse(window.sessionStorage.getItem('windSbq'))
-        let pv = JSON.parse(window.sessionStorage.getItem('pvSbq'))
-        let json = {}
-        if (wswind && pv) {
-            json = {...wswind, ...pv}
-            this.dataList = [];
-            const showList = [];
-            let arr = Object.keys(json).sort();
-            for (let id of arr) {
-                let val = json[id];
-                this.chooseList.forEach((item) => {
-                if (item.windturbineId === val.windturbineId) {
-                    val.active = true;
-                }
-                });
-                this.dataList.push(val);
-                switch (Number(this.selectValue)) {
-                case 0:
-                    if (
-                    val.status === 5 ||
-                    val.status === 6 ||
-                    val.status === 7 ||
-                    val.lockValue > 0
-                    ) {
-                    showList.push(val);
-                    }
-                    break;
-                case 1:
-                    val.status === 5 ? showList.push(val) : "";
-                    break;
-                case 2:
-                    val.status === 6 ? showList.push(val) : "";
-                    break;
-                case 3:
-                    val.status === 7 ? showList.push(val) : "";
-                    break;
-                case 4:
-                    val.lockValue > 0 ? showList.push(val) : "";
-                    break;
-                default:
-                    if (
-                    val.stationId ===
-                    this.options.filter((ops) => ops?.value === this.selectValue)[0]
-                        .stationId
-                    ) {
-                    showList.push(val);
-                    }
-                    break;
-                }
+      this.options = [
+        {
+          value: "0",
+          label: "问题设备",
+        },
+        {
+          value: "1",
+          label: "故障",
+        },
+        {
+          value: "2",
+          label: "维护",
+        },
+        {
+          value: "3",
+          label: "离线",
+        },
+        {
+          value: "4",
+          label: "挂牌",
+        },
+      ];
+      let stationList = this.$store.state.stationList;
+      stationList.forEach((item, index) => {
+        if (item.id.indexOf("FDC") != -1 || item.id.indexOf("GDC") != -1) {
+          let obj = {};
+          obj.value = String(index + 6);
+          obj.label = item.name;
+          obj.stationId = item.code || item.id;
+          this.options.push(obj);
+        }
+      });
+      // let json = this.$store.state.windturbinelist;
+      let wswind = JSON.parse(window.sessionStorage.getItem("windSbq"));
+      let pv = JSON.parse(window.sessionStorage.getItem("pvSbq"));
+      let json = {};
+      if (wswind && pv) {
+        json = { ...wswind, ...pv };
+        this.dataList = [];
+        const showList = [];
+        let arr = Object.keys(json).sort();
+        for (let id of arr) {
+          let val = json[id];
+          this.chooseList.forEach((item) => {
+            if (item.windturbineId === val.windturbineId) {
+              val.active = true;
             }
-            let checkoutList = BackgroundData.getInstance().checkouts;
-            checkoutList.forEach((item) => {
-                let showIndex = null;
-                showList.forEach((param, index) => {
-                if (item.windturbineId === param.windturbineId) {
-                    showIndex = index;
-                }
-                });
-                showList.splice(showIndex, 1);
-            });
-            showList.sort((a,b)=>{
-              let aSubString = '0', bSubString = '0'
-              let aStation = '1', bStation = '2'
-              if(a.windturbineId && b.windturbineId){
-                aSubString = a.windturbineId.substring(a.windturbineId.lastIndexOf('_')+1)
-                bSubString = b.windturbineId.substring(b.windturbineId.lastIndexOf('_')+1)
-
-                aStation = a.windturbineId.substring(0, a.windturbineId.lastIndexOf('_'))
-                bStation = b.windturbineId.substring(0, b.windturbineId.lastIndexOf('_'))
-
-              }else if(a.id && b.id){
-                aSubString = a.id.substring(a.id.lastIndexOf('_')+1)
-                bSubString = b.id.substring(b.id.lastIndexOf('_')+1)
-
-                aStation = a.id.substring(0, a.id.lastIndexOf('_'))
-                bStation = b.id.substring(0, b.id.lastIndexOf('_'))
+          });
+          this.dataList.push(val);
+          switch (Number(this.selectValue)) {
+            case 0:
+              if (
+                val.status === 5 ||
+                val.status === 6 ||
+                val.status === 7 ||
+                val.lockValue > 0
+              ) {
+                showList.push(val);
               }
-              if(aStation === bStation){
-                return parseInt(aSubString) - parseInt(bSubString)
-              }else{
-                return 0
+              break;
+            case 1:
+              val.status === 5 ? showList.push(val) : "";
+              break;
+            case 2:
+              val.status === 6 ? showList.push(val) : "";
+              break;
+            case 3:
+              val.status === 7 ? showList.push(val) : "";
+              break;
+            case 4:
+              val.lockValue > 0 ? showList.push(val) : "";
+              break;
+            default:
+              if (
+                val.stationId ===
+                this.options.filter((ops) => ops?.value === this.selectValue)[0]
+                  .stationId
+              ) {
+                showList.push(val);
               }
-            })
-            this.showList = showList
+              break;
+          }
         }
+        let checkoutList = BackgroundData.getInstance().checkouts;
+        checkoutList.forEach((item) => {
+          let showIndex = null;
+          showList.forEach((param, index) => {
+            if (item.windturbineId === param.windturbineId) {
+              showIndex = index;
+            }
+          });
+          showList.splice(showIndex, 1);
+        });
+        showList.sort((a, b) => {
+          let aSubString = "0",
+            bSubString = "0";
+          let aStation = "1",
+            bStation = "2";
+          if (a.windturbineId && b.windturbineId) {
+            aSubString = a.windturbineId.substring(
+              a.windturbineId.lastIndexOf("_") + 1
+            );
+            bSubString = b.windturbineId.substring(
+              b.windturbineId.lastIndexOf("_") + 1
+            );
+
+            aStation = a.windturbineId.substring(
+              0,
+              a.windturbineId.lastIndexOf("_")
+            );
+            bStation = b.windturbineId.substring(
+              0,
+              b.windturbineId.lastIndexOf("_")
+            );
+          } else if (a.id && b.id) {
+            aSubString = a.id.substring(a.id.lastIndexOf("_") + 1);
+            bSubString = b.id.substring(b.id.lastIndexOf("_") + 1);
+
+            aStation = a.id.substring(0, a.id.lastIndexOf("_"));
+            bStation = b.id.substring(0, b.id.lastIndexOf("_"));
+          }
+          if (aStation === bStation) {
+            return parseInt(aSubString) - parseInt(bSubString);
+          } else {
+            return 0;
+          }
+        });
+        this.showList = showList;
+      }
     },
     getLocks() {
       api.getCustomerLock().then((res) => {
@@ -309,11 +329,11 @@ export default {
       });
     },
     initData: function () {
-        let mb = MessageBridge.getInstance();
-        let vss = [
-            { key: "/topic/voice-control", action: this.windturbineMessage },
-        ];
-        mb.register(vss);
+      let mb = MessageBridge.getInstance();
+      let vss = [
+        { key: "/topic/voice-control", action: this.windturbineMessage },
+      ];
+      mb.register(vss);
     },
     windturbineMessage(msg) {
       if (this.$store.state.current === 2) {
@@ -331,7 +351,7 @@ export default {
           this.dialogVisible = true;
         } else if (arr[0] === "CLOSE") {
           this.dialogVisible = false;
-        }  else if (
+        } else if (
           arr[0] === "CONTROL_START" ||
           arr[0] === "CONTROL_STOP" ||
           arr[0] === "CONTROL_MAINTAIN"
@@ -764,57 +784,68 @@ export default {
             break;
           default:
             if (Number(this.selectValue) < 12) {
-                if (
-                  val.stationId ===
-                  this.options.filter((ops) => ops?.value === this.selectValue)[0]
-                    .stationId
-                ) {
-                  showList.push(val);
-                }
+              if (
+                val.stationId ===
+                this.options.filter((ops) => ops?.value === this.selectValue)[0]
+                  .stationId
+              ) {
+                showList.push(val);
+              }
             } else {
-                if (
-                  val.station ===
-                  this.options.filter((ops) => ops?.value === this.selectValue)[0]
-                    .stationId
-                ) {
-                  showList.push(val);
-                }
+              if (
+                val.station ===
+                this.options.filter((ops) => ops?.value === this.selectValue)[0]
+                  .stationId
+              ) {
+                showList.push(val);
+              }
             }
             break;
         }
       });
-      showList.sort((a,b)=>{
-        let aSubString = '0', bSubString = '0'
-        let aStation = '1', bStation = '2'
-        if(a.windturbineId && b.windturbineId){
-          aSubString = a.windturbineId.substring(a.windturbineId.lastIndexOf('_')+1)
-          bSubString = b.windturbineId.substring(b.windturbineId.lastIndexOf('_')+1)
+      showList.sort((a, b) => {
+        let aSubString = "0",
+          bSubString = "0";
+        let aStation = "1",
+          bStation = "2";
+        if (a.windturbineId && b.windturbineId) {
+          aSubString = a.windturbineId.substring(
+            a.windturbineId.lastIndexOf("_") + 1
+          );
+          bSubString = b.windturbineId.substring(
+            b.windturbineId.lastIndexOf("_") + 1
+          );
 
-          aStation = a.windturbineId.substring(0, a.windturbineId.lastIndexOf('_'))
-          bStation = b.windturbineId.substring(0, b.windturbineId.lastIndexOf('_'))
+          aStation = a.windturbineId.substring(
+            0,
+            a.windturbineId.lastIndexOf("_")
+          );
+          bStation = b.windturbineId.substring(
+            0,
+            b.windturbineId.lastIndexOf("_")
+          );
+        } else if (a.id && b.id) {
+          aSubString = a.id.substring(a.id.lastIndexOf("_") + 1);
+          bSubString = b.id.substring(b.id.lastIndexOf("_") + 1);
 
-        }else if(a.id && b.id){
-          aSubString = a.id.substring(a.id.lastIndexOf('_')+1)
-          bSubString = b.id.substring(b.id.lastIndexOf('_')+1)
-
-          aStation = a.id.substring(0, a.id.lastIndexOf('_'))
-          bStation = b.id.substring(0, b.id.lastIndexOf('_'))
+          aStation = a.id.substring(0, a.id.lastIndexOf("_"));
+          bStation = b.id.substring(0, b.id.lastIndexOf("_"));
         }
-        if(aStation === bStation){
-          return parseInt(aSubString) - parseInt(bSubString)
-        }else{
-          return 0
+        if (aStation === bStation) {
+          return parseInt(aSubString) - parseInt(bSubString);
+        } else {
+          return 0;
         }
-      })
-      this.showList = showList
+      });
+      this.showList = showList;
     },
     handleDetails(itm) {
       this.dialogVisible = true;
       this.currentWindturbine = itm;
     },
     handleDetialPv(item) {
-        this.dialogPvDia = true;
-        this.currentWindturbinePv = item;
+      this.dialogPvDia = true;
+      this.currentWindturbinePv = item;
     },
     handleClose() {
       this.dialogVisible = false;
@@ -827,150 +858,158 @@ export default {
       }
     },
     handleWindturbineChange() {
-        let ws = MessageBridge.getInstance();
-        let wind = [
-            { key: "/topic/windturbine", action: this.getWindMsg },
-        ];
-        let guangfu = [
-            { key: "/topic/pv", action: this.getPvMsg },
-        ];
-        ws.register(wind);
-        ws.register(guangfu);
+      let ws = MessageBridge.getInstance();
+      let wind = [{ key: "/topic/windturbine", action: this.getWindMsg }];
+      let guangfu = [{ key: "/topic/pv", action: this.getPvMsg }];
+      ws.register(wind);
+      ws.register(guangfu);
     },
     getPvMsg(msg) {
-        window.sessionStorage.removeItem('pvSbq')
-        // let jsonMsg = JSON.parse(msg)
-        window.sessionStorage.setItem('pvSbq', msg)
-        this.changeData()
+      window.sessionStorage.removeItem("pvSbq");
+      // let jsonMsg = JSON.parse(msg)
+      window.sessionStorage.setItem("pvSbq", msg);
+      this.changeData();
     },
     getWindMsg(msg) {
-        window.sessionStorage.removeItem('windSbq')
-        // let jsonMsg = JSON.parse(msg)
-        window.sessionStorage.setItem('windSbq', msg)
-        this.changeData()
+      window.sessionStorage.removeItem("windSbq");
+      // let jsonMsg = JSON.parse(msg)
+      window.sessionStorage.setItem("windSbq", msg);
+      this.changeData();
     },
     changeData() {
-        let wswind = JSON.parse(window.sessionStorage.getItem('windSbq'))
-        let pv = JSON.parse(window.sessionStorage.getItem('pvSbq'))
-        let msg = {}
-        if (wswind || pv) {
-            msg = {...wswind}
-            if(pv){
-              msg = {...msg, ...pv}
+      let wswind = JSON.parse(window.sessionStorage.getItem("windSbq"));
+      let pv = JSON.parse(window.sessionStorage.getItem("pvSbq"));
+      let msg = {};
+      if (wswind || pv) {
+        msg = { ...wswind };
+        if (pv) {
+          msg = { ...msg, ...pv };
+        }
+        this.windturbinelist = msg;
+        this.$store.commit("windturbinelist", msg);
+        this.dataList = [];
+        const showList = [];
+        let arr = Object.keys(msg).sort();
+        let newArr = [];
+        for (let id of arr) {
+          let val = msg[id];
+          newArr.push(val);
+          this.chooseList.forEach((item) => {
+            if (item.windturbineId === val.windturbineId) {
+              val.active = true;
             }
-            this.windturbinelist = msg;
-            this.$store.commit("windturbinelist", msg);
-            this.dataList = [];
-            const showList = [];
-            let arr = Object.keys(msg).sort();
-            let newArr = [];
-            for (let id of arr) {
-                let val = msg[id];
-                newArr.push(val);
-                this.chooseList.forEach((item) => {
-                if (item.windturbineId === val.windturbineId) {
-                    val.active = true;
-                }
-                });
-                if (val.lockValue === 9) {
-                val.lockValues = this.lockValues.filter(
-                    (item) => val.windturbineId === item.windturbineID
-                )[0]?.value;
-                }
-                this.dataList.push(val);
-                switch (Number(this.selectValue)) {
-                case 0:
-                    if (
-                    val.status === 5 ||
-                    val.status === 6 ||
-                    val.status === 7 ||
-                    val.lockValue > 0
-                    ) {
-                    showList.push(val);
-                    }
-                    break;
-                case 1:
-                    val.status === 5 ? showList.push(val) : "";
-                    break;
-                case 2:
-                    val.status === 6 ? showList.push(val) : "";
-                    break;
-                case 3:
-                    val.status === 7 ? showList.push(val) : "";
-                    break;
-                case 4:
-                    val.lockValue > 0 ? showList.push(val) : "";
-                    break;
+          });
+          if (val.lockValue === 9) {
+            val.lockValues = this.lockValues.filter(
+              (item) => val.windturbineId === item.windturbineID
+            )[0]?.value;
+          }
+          this.dataList.push(val);
+          switch (Number(this.selectValue)) {
+            case 0:
+              if (
+                val.status === 5 ||
+                val.status === 6 ||
+                val.status === 7 ||
+                val.lockValue > 0
+              ) {
+                showList.push(val);
+              }
+              break;
+            case 1:
+              val.status === 5 ? showList.push(val) : "";
+              break;
+            case 2:
+              val.status === 6 ? showList.push(val) : "";
+              break;
+            case 3:
+              val.status === 7 ? showList.push(val) : "";
+              break;
+            case 4:
+              val.lockValue > 0 ? showList.push(val) : "";
+              break;
 
-                default:
-                    // if (
-                    // val.stationId ===
-                    // this.options.filter(
-                    //     (ops) => ops?.value === this.selectValue
-                    // )[0].stationId
-                    // ) {
-                    // this.showList.push(val);
-                    // }
-                    if (Number(this.selectValue) < 12) {
-                        if (
-                        val.stationId ===
-                        this.options.filter((ops) => ops?.value === this.selectValue)[0]
-                            .stationId
-                        ) {
-                        showList.push(val);
-                        }
-                    } else {
-                        if (
-                        val.station ===
-                        this.options.filter((ops) => ops?.value === this.selectValue)[0]
-                            .stationId
-                        ) {
-                        showList.push(val);
-                        }
-                    }
-                    break;
+            default:
+              // if (
+              // val.stationId ===
+              // this.options.filter(
+              //     (ops) => ops?.value === this.selectValue
+              // )[0].stationId
+              // ) {
+              // this.showList.push(val);
+              // }
+              if (Number(this.selectValue) < 12) {
+                if (
+                  val.stationId ===
+                  this.options.filter(
+                    (ops) => ops?.value === this.selectValue
+                  )[0].stationId
+                ) {
+                  showList.push(val);
+                }
+              } else {
+                if (
+                  val.station ===
+                  this.options.filter(
+                    (ops) => ops?.value === this.selectValue
+                  )[0].stationId
+                ) {
+                  showList.push(val);
                 }
-            }
-            // console.log('showList', this.showList)
-            let checkoutList = BackgroundData.getInstance().checkouts;
-            if (checkoutList.length>0) {
-                checkoutList.forEach((item) => {
-                    let showIndex = null;
-                    showList.forEach((param, index) => {
-                    if (item.windturbineId === param.windturbineId) {
-                        showIndex = index;
-                    }
-                    });
-                    showList.splice(showIndex, 1);
-                });
-            }
-            showList.sort((a,b)=>{
-              let aSubString = '0', bSubString = '0'
-              let aStation = '1', bStation = '2'
-              if(a.windturbineId && b.windturbineId){
-                aSubString = a.windturbineId.substring(a.windturbineId.lastIndexOf('_')+1)
-                bSubString = b.windturbineId.substring(b.windturbineId.lastIndexOf('_')+1)
-
-                aStation = a.windturbineId.substring(0, a.windturbineId.lastIndexOf('_'))
-                bStation = b.windturbineId.substring(0, b.windturbineId.lastIndexOf('_'))
-
-              }else if(a.id && b.id){
-                aSubString = a.id.substring(a.id.lastIndexOf('_')+1)
-                bSubString = b.id.substring(b.id.lastIndexOf('_')+1)
-
-                aStation = a.id.substring(0, a.id.lastIndexOf('_'))
-                bStation = b.id.substring(0, b.id.lastIndexOf('_'))
               }
-              if(aStation === bStation){
-                return parseInt(aSubString) - parseInt(bSubString)
-              }else{
-                return 0
+              break;
+          }
+        }
+        // console.log('showList', this.showList)
+        let checkoutList = BackgroundData.getInstance().checkouts;
+        if (checkoutList.length > 0) {
+          checkoutList.forEach((item) => {
+            let showIndex = null;
+            showList.forEach((param, index) => {
+              if (item.windturbineId === param.windturbineId) {
+                showIndex = index;
               }
-            })
-            this.showList = showList
-            
+            });
+            showList.splice(showIndex, 1);
+          });
         }
-    }
+        showList.sort((a, b) => {
+          let aSubString = "0",
+            bSubString = "0";
+          let aStation = "1",
+            bStation = "2";
+          if (a.windturbineId && b.windturbineId) {
+            aSubString = a.windturbineId.substring(
+              a.windturbineId.lastIndexOf("_") + 1
+            );
+            bSubString = b.windturbineId.substring(
+              b.windturbineId.lastIndexOf("_") + 1
+            );
+
+            aStation = a.windturbineId.substring(
+              0,
+              a.windturbineId.lastIndexOf("_")
+            );
+            bStation = b.windturbineId.substring(
+              0,
+              b.windturbineId.lastIndexOf("_")
+            );
+          } else if (a.id && b.id) {
+            aSubString = a.id.substring(a.id.lastIndexOf("_") + 1);
+            bSubString = b.id.substring(b.id.lastIndexOf("_") + 1);
+
+            aStation = a.id.substring(0, a.id.lastIndexOf("_"));
+            bStation = b.id.substring(0, b.id.lastIndexOf("_"));
+          }
+          if (aStation === bStation) {
+            return parseInt(aSubString) - parseInt(bSubString);
+          } else {
+            return 0;
+          }
+        });
+        this.showList = showList;
+      }
+    },
   },
   unmounted() {
     clearInterval(this.intervals);

src/components/control/controlJson.json

@@ -0,0 +1,168 @@
+{
+    "showList": [
+        {
+            "status": 3,
+            "windSpeed": 12,
+            "stationId": 0,
+            "power": 34212,
+            "rollSpeed": 15,
+            "windturbineId": "风场_A01",
+            "modelId": "12342431543"
+        },
+        {
+            "status": 5,
+            "windSpeed": 12,
+            "power": 34212,
+            "rollSpeed": 15,
+            "windturbineId": "风场_A02",
+            "modelId": "12342431543"
+        },
+        {
+            "status": 1,
+            "windSpeed": 12,
+            "power": 34212,
+            "rollSpeed": 15,
+            "windturbineId": "风场_A03",
+            "modelId": "12342431543"
+        },
+        {
+            "status": 3,
+            "windSpeed": 12,
+            "power": 34212,
+            "rollSpeed": 15,
+            "windturbineId": "风场_A04",
+            "modelId": "12342431543"
+        },
+        {
+            "status": 3,
+            "windSpeed": 12,
+            "power": 34212,
+            "rollSpeed": 15,
+            "windturbineId": "风场_A05",
+            "modelId": "12342431543"
+        },
+        {
+            "status": 3,
+            "windSpeed": 12,
+            "stationId": 0,
+            "power": 34212,
+            "rollSpeed": 15,
+            "windturbineId": "风场_A01",
+            "modelId": "12342431543"
+        },
+        {
+            "status": 5,
+            "windSpeed": 12,
+            "power": 34212,
+            "rollSpeed": 15,
+            "windturbineId": "风场_A02",
+            "modelId": "12342431543"
+        },
+        {
+            "status": 1,
+            "windSpeed": 12,
+            "power": 34212,
+            "rollSpeed": 15,
+            "windturbineId": "风场_A03",
+            "modelId": "12342431543"
+        },
+        {
+            "status": 3,
+            "windSpeed": 12,
+            "power": 34212,
+            "rollSpeed": 15,
+            "windturbineId": "风场_A04",
+            "modelId": "12342431543"
+        },
+        {
+            "status": 3,
+            "windSpeed": 12,
+            "power": 34212,
+            "rollSpeed": 15,
+            "windturbineId": "风场_A05",
+            "modelId": "12342431543"
+        },
+        {
+            "status": 3,
+            "windSpeed": 12,
+            "stationId": 0,
+            "power": 34212,
+            "rollSpeed": 15,
+            "windturbineId": "风场_A01",
+            "modelId": "12342431543"
+        },
+        {
+            "status": 5,
+            "windSpeed": 12,
+            "power": 34212,
+            "rollSpeed": 15,
+            "windturbineId": "风场_A02",
+            "modelId": "12342431543"
+        },
+        {
+            "status": 1,
+            "windSpeed": 12,
+            "power": 34212,
+            "rollSpeed": 15,
+            "windturbineId": "风场_A03",
+            "modelId": "12342431543"
+        },
+        {
+            "status": 3,
+            "windSpeed": 12,
+            "power": 34212,
+            "rollSpeed": 15,
+            "windturbineId": "风场_A04",
+            "modelId": "12342431543"
+        },
+        {
+            "status": 3,
+            "windSpeed": 12,
+            "power": 34212,
+            "rollSpeed": 15,
+            "windturbineId": "风场_A05",
+            "modelId": "12342431543"
+        },
+        {
+            "status": 3,
+            "windSpeed": 12,
+            "stationId": 0,
+            "power": 34212,
+            "rollSpeed": 15,
+            "windturbineId": "风场_A01",
+            "modelId": "12342431543"
+        },
+        {
+            "status": 5,
+            "windSpeed": 12,
+            "power": 34212,
+            "rollSpeed": 15,
+            "windturbineId": "风场_A02",
+            "modelId": "12342431543"
+        },
+        {
+            "status": 1,
+            "windSpeed": 12,
+            "power": 34212,
+            "rollSpeed": 15,
+            "windturbineId": "风场_A03",
+            "modelId": "12342431543"
+        },
+        {
+            "status": 3,
+            "windSpeed": 12,
+            "power": 34212,
+            "rollSpeed": 15,
+            "windturbineId": "风场_A04",
+            "modelId": "12342431543"
+        },
+        {
+            "status": 3,
+            "windSpeed": 12,
+            "power": 34212,
+            "rollSpeed": 15,
+            "windturbineId": "风场_A05",
+            "modelId": "12342431543"
+        }
+    ]
+}

src/components/modeControl/modeControl.vue

@@ -458,19 +458,20 @@ export default {
       myChart.setOption(option, true);
     },
     ChangeBar(values) {
-      let bd = BackgroundData.getInstance();
+      //   let bd = BackgroundData.getInstance();
       this.$router.push(`/?current=${values}`);
-      if (!bd.LoginUser) {
-        this.$notify({
-          title: "请登录",
-          message: "切换模式需要先登录！",
-          type: "warning",
-          position: "bottom-right",
-          offset: 60,
-          duration: 3000,
-        });
-        return;
-      }
+      //   if (!bd.LoginUser) {
+      //     this.$notify({
+      //       title: "请登录",
+      //       message: "切换模式需要先登录！",
+      //       type: "warning",
+      //       position: "bottom-right",
+      //       offset: 60,
+      //       duration: 3000,
+      //     });
+      //     return;
+      //   }
+      this.current = values;
       if (this.current !== values) {
         this.$store.commit("current", Number(values));
         if (values === 2) {

src/views/ManualPage.vue

@@ -14,23 +14,23 @@
             </el-col>
           </el-row>
         </el-col>
-        <!-- <el-col :span="8">
-                    <el-row>
-                        <el-col :span="23">
-                            <ModeControl :current="current"></ModeControl>
-                        </el-col>
-                    </el-row>
-                    <el-row>
-                        <el-col :span="23">
-                            <FocusArea />
-                        </el-col>
-                    </el-row>
-                    <el-row>
-                        <el-col :span="23">
-                            <WarningArea></WarningArea>
-                        </el-col>
-                    </el-row>
-                </el-col> -->
+        <el-col :span="8">
+          <el-row>
+            <el-col :span="23">
+              <ModeControl :current="current"></ModeControl>
+            </el-col>
+          </el-row>
+          <el-row>
+            <el-col :span="23">
+              <FocusArea />
+            </el-col>
+          </el-row>
+          <el-row>
+            <el-col :span="23">
+              <WarningArea></WarningArea>
+            </el-col>
+          </el-row>
+        </el-col>
       </el-row>
       <!-- <WindturbineDetailPages v-model="dialogVisible"></WindturbineDetailPages> -->
     </div>

src/views/TitleBar.vue

@@ -1,226 +1,247 @@
 /* 标题栏 */
 <template>
-    <div class="title-bar" onselectstart="return false">
-        <el-row>
-            <el-col :span="3">
-                <img
-                class="logo"
-                src="../assets/img/main_window/logo.png"
-                sytle="align-items"
-                />
-            </el-col>
-            <el-col :span="0.1">
-                <div>
-                <el-dialog
-                    title="用户登录"
-                    v-model="dialogVisible"
-                    width="21%"
-                    :before-close="handleClose"
-                    :show-close="false"
+  <div class="title-bar" onselectstart="return false">
+    <el-row>
+      <el-col :span="3">
+        <img
+          class="logo"
+          src="../assets/img/main_window/logo.png"
+          sytle="align-items"
+        />
+      </el-col>
+      <el-col :span="0.1">
+        <div>
+          <el-dialog
+            title="用户登录"
+            v-model="dialogVisible"
+            width="21%"
+            :before-close="handleClose"
+            :show-close="false"
+          >
+            <el-form :model="form">
+              <el-form-item :label="loginMessage"> </el-form-item>
+              <el-form-item label="用户名：" :label-width="formLabelWidth">
+                <el-input
+                  v-model="form.name"
+                  autocomplete="off"
+                  type="text"
+                  placeholder="用户名"
+                  style="width: 80%"
                 >
-                    <el-form :model="form">
-                    <el-form-item :label="loginMessage"> </el-form-item>
-                    <el-form-item label="用户名：" :label-width="formLabelWidth">
-                        <el-input
-                        v-model="form.name"
-                        autocomplete="off"
-                        type="text"
-                        placeholder="用户名"
-                        style="width: 80%"
-                        >
-                        </el-input>
-                    </el-form-item>
-                    <el-form-item label="密&emsp;码：" :label-width="formLabelWidth">
-                        <el-input
-                        v-model="form.psd"
-                        autocomplete="off"
-                        type="text"
-                        placeholder="密&emsp;码"
-                        style="width: 80%"
-                        show-password
-                        ></el-input>
-                    </el-form-item>
-                    <el-form-item
-                        label="验证码："
-                        :label-width="formLabelWidth"
-                        style="display: none"
-                    >
-                        <el-input
-                        v-model="form.name"
-                        autocomplete="off"
-                        type="text"
-                        placeholder="验证码"
-                        style="width: 80%"
-                        >
-                        <template #append
-                            ><img src="" style="width: 50px; height: 20px"
-                        /></template>
-                        </el-input>
-                    </el-form-item>
-                    </el-form>
-                    <template #footer>
-                    <span class="dialog-footer">
-                        <el-button
-                        @click="dialogVisible = false"
-                        style="
-                            background-color: rgb(100, 100, 100);
-                            color: rgb(220, 220, 220);
-                        "
-                        >取 消</el-button
-                        >
-                        <el-button type="primary" @click="login">登 录</el-button>
-                    </span>
-                    </template>
-                </el-dialog>
-                </div>
-            </el-col>
-            <el-col :span="19" style="margin-left: 90px">
-                <div class="titleinfoall">
-                    <div class="titleinfo" @dblclick="dbClicks(titleInfo.dailyPowerGeneration, '日发电量')">
-                        <span class="showTitle fontSty1">日发电量:</span>
-                        <span class="showvalue">{{
-                            titleInfo.dailyPowerGeneration?.value?.toFixed(2)
-                        }}</span>
-                        <span class="showTitle fontSty">万kW/h</span>
-                    </div>
-                    <div class="titleinfo" @dblclick="dbClicks(titleInfo.powerLossFault, '故障损失')" >
-                        <span class="showTitle fontSty1">故障损失:</span>
-                        <span
-                        :class="
-                            titleInfo.powerLossFault
-                            ? titleInfo.powerLossFault.trend === 'Counterpoise'
-                                ? 'showvalue'
-                                : titleInfo.powerLossFault.trend === 'Rise'
-                                ? 'showvalue-up'
-                                : 'showvalue-down'
-                            : ''
-                        "
-                        >{{ titleInfo.powerLossFault?.value.toFixed(2) }}</span
-                        >
-                        <span class="showTitle fontSty">万kW/h</span>
-                    </div>
-                    <div class="titleinfo" @dblclick="dbClicks(titleInfo.powerLossRestrictions, '限电损失')" >
-                        <span class="showTitle fontSty1">限电损失:</span>
-                        <span
-                        :class="
-                            titleInfo.powerLossRestrictions
-                            ? titleInfo.powerLossRestrictions.trend === 'Counterpoise'
-                                ? 'showvalue'
-                                : titleInfo.powerLossRestrictions.trend === 'Rise'
-                                ? 'showvalue-up'
-                                : 'showvalue-down'
-                            : ''
-                        "
-                        >{{ titleInfo.powerLossRestrictions?.value.toFixed(2) }}</span
-                        >
-                        <span class="showTitle fontSty">万kW/h</span>
-                    </div>
-                    <div class="titleinfo" @dblclick="dbClicks(titleInfo.powerLossInspection, '检修损失')" >
-                        <span class="showTitle fontSty1">检修损失:</span>
-                        <span
-                        :class="
-                            titleInfo.powerLossInspection
-                            ? titleInfo.powerLossInspection.trend === 'Counterpoise'
-                                ? 'showvalue'
-                                : titleInfo.powerLossInspection.trend === 'Rise'
-                                ? 'showvalue-up'
-                                : 'showvalue-down'
-                            : ''
-                        "
-                        >{{ titleInfo.powerLossInspection?.value.toFixed(2) }}</span
-                        >
-                        <span class="showTitle fontSty">万kW/h</span>
-                    </div>
-                    <div class="titleinfo" @dblclick="dbClicks(titleInfo.powerLossBurden, '受累损失')" >
-                        <span class="showTitle fontSty1">受累损失:</span>
-                        <span
-                        :class="
-                            titleInfo.powerLossBurden
-                            ? titleInfo.powerLossBurden.trend === 'Counterpoise'
-                                ? 'showvalue'
-                                : titleInfo.powerLossBurden.trend === 'Rise'
-                                ? 'showvalue-up'
-                                : 'showvalue-down'
-                            : ''
-                        "
-                        >{{ titleInfo.powerLossBurden?.value.toFixed(2) }}</span
-                        >
-                        <span class="showTitle fontSty">万kW/h</span>
-                    </div>
-                    <div class="titleinfo" @dblclick="dbClicks(titleInfo.powerLossPerformance, '性能损失')" >
-                        <span class="showTitle fontSty1">性能损失:</span>
-                        <span
-                            :class="
-                            titleInfo.powerLossPerformance
-                                ? titleInfo.powerLossPerformance.trend === 'Counterpoise'
-                                ? 'showvalue'
-                                : titleInfo.powerLossPerformance.trend === 'Rise'
-                                ? 'showvalue-up'
-                                : 'showvalue-down'
-                                : ''
-                            "
-                            >{{ titleInfo.powerLossPerformance?.value.toFixed(2) }}</span
-                        >
-                        <span class="showTitle fontSty">万kW/h</span>
-                    </div>
-                    <div class="titleinfo"  @dblclick="dbClicks(titleInfo.fieldElectricity, '场用电量')">
-                        <span class="showTitle fontSty1">场用电量:</span>
-                        <span class="showvalue">{{
-                        titleInfo.fieldElectricity?.value.toFixed(2)
-                        }}</span>
-                        <span class="showTitle fontSty">万kW/h</span>
-                    </div>
-                </div>
-            </el-col>
-            <el-col :span="1">
-                <el-popover
-                placement="bottom"
-                :width="150"
-                trigger="hover"
-                :show-arrow="false"
+                </el-input>
+              </el-form-item>
+              <el-form-item label="密&emsp;码：" :label-width="formLabelWidth">
+                <el-input
+                  v-model="form.psd"
+                  autocomplete="off"
+                  type="text"
+                  placeholder="密&emsp;码"
+                  style="width: 80%"
+                  show-password
+                ></el-input>
+              </el-form-item>
+              <el-form-item
+                label="验证码："
+                :label-width="formLabelWidth"
+                style="display: none"
+              >
+                <el-input
+                  v-model="form.name"
+                  autocomplete="off"
+                  type="text"
+                  placeholder="验证码"
+                  style="width: 80%"
                 >
-                <template #reference>
-                    <el-button
-                    @click="userClick"
-                    style="
-                        top: 10px;
-                        right: 70px;
-                        color: #ffffff;
-                        position: absolute;
-                        background-color: black;
-                        border: none;
-                        font-size: 16px;
-                    "
-                    >
-                    {{ usreName }}</el-button
-                    >
-                </template>
-                <div style="background-color: #363636">
-                    <!-- <el-button class="loginoption">编&emsp;辑</el-button> -->
-                    <el-button v-if="!isLogin" class="loginoption" @click="userClick"
-                    >登&emsp;录</el-button
-                    >
-                    <br v-if="!isLogin" />
-                    <el-button v-if="isLogin" class="loginoption" @click="logout"
-                    >注&emsp;销</el-button
-                    >
-                </div>
-                </el-popover>
-                <div style="top: 7px; position: absolute; right: 10px">
-                    <button class="closeButton" v-on:click="mainClose">×</button>
-                </div>
-            </el-col>
-        </el-row>
-        <DataDetails
-        @closed="closeds()"
-        v-model="display"
-        :datas="titleDetails"
-        :partsName="partsName"
-        echartsId="titleEcharts"
-        @search-data="search"
-        @original-data="originalData"
-        ></DataDetails>
-    </div>
+                  <template #append
+                    ><img src="" style="width: 50px; height: 20px"
+                  /></template>
+                </el-input>
+              </el-form-item>
+            </el-form>
+            <template #footer>
+              <span class="dialog-footer">
+                <el-button
+                  @click="dialogVisible = false"
+                  style="
+                    background-color: rgb(100, 100, 100);
+                    color: rgb(220, 220, 220);
+                  "
+                  >取 消</el-button
+                >
+                <el-button type="primary" @click="login">登 录</el-button>
+              </span>
+            </template>
+          </el-dialog>
+        </div>
+      </el-col>
+      <el-col :span="19" style="margin-left: 90px">
+        <div class="titleinfoall">
+          <div
+            class="titleinfo"
+            @dblclick="dbClicks(titleInfo.dailyPowerGeneration, '日发电量')"
+          >
+            <span class="showTitle fontSty1">日发电量:</span>
+            <span class="showvalue">{{
+              titleInfo.dailyPowerGeneration?.value?.toFixed(2)
+            }}</span>
+            <span class="showTitle fontSty">万kW/h</span>
+          </div>
+          <div
+            class="titleinfo"
+            @dblclick="dbClicks(titleInfo.powerLossFault, '故障损失')"
+          >
+            <span class="showTitle fontSty1">故障损失:</span>
+            <span
+              :class="
+                titleInfo.powerLossFault
+                  ? titleInfo.powerLossFault.trend === 'Counterpoise'
+                    ? 'showvalue'
+                    : titleInfo.powerLossFault.trend === 'Rise'
+                    ? 'showvalue-up'
+                    : 'showvalue-down'
+                  : ''
+              "
+              >{{ titleInfo.powerLossFault?.value.toFixed(2) }}</span
+            >
+            <span class="showTitle fontSty">万kW/h</span>
+          </div>
+          <div
+            class="titleinfo"
+            @dblclick="dbClicks(titleInfo.powerLossRestrictions, '限电损失')"
+          >
+            <span class="showTitle fontSty1">限电损失:</span>
+            <span
+              :class="
+                titleInfo.powerLossRestrictions
+                  ? titleInfo.powerLossRestrictions.trend === 'Counterpoise'
+                    ? 'showvalue'
+                    : titleInfo.powerLossRestrictions.trend === 'Rise'
+                    ? 'showvalue-up'
+                    : 'showvalue-down'
+                  : ''
+              "
+              >{{ titleInfo.powerLossRestrictions?.value.toFixed(2) }}</span
+            >
+            <span class="showTitle fontSty">万kW/h</span>
+          </div>
+          <div
+            class="titleinfo"
+            @dblclick="dbClicks(titleInfo.powerLossInspection, '检修损失')"
+          >
+            <span class="showTitle fontSty1">检修损失:</span>
+            <span
+              :class="
+                titleInfo.powerLossInspection
+                  ? titleInfo.powerLossInspection.trend === 'Counterpoise'
+                    ? 'showvalue'
+                    : titleInfo.powerLossInspection.trend === 'Rise'
+                    ? 'showvalue-up'
+                    : 'showvalue-down'
+                  : ''
+              "
+              >{{ titleInfo.powerLossInspection?.value.toFixed(2) }}</span
+            >
+            <span class="showTitle fontSty">万kW/h</span>
+          </div>
+          <div
+            class="titleinfo"
+            @dblclick="dbClicks(titleInfo.powerLossBurden, '受累损失')"
+          >
+            <span class="showTitle fontSty1">受累损失:</span>
+            <span
+              :class="
+                titleInfo.powerLossBurden
+                  ? titleInfo.powerLossBurden.trend === 'Counterpoise'
+                    ? 'showvalue'
+                    : titleInfo.powerLossBurden.trend === 'Rise'
+                    ? 'showvalue-up'
+                    : 'showvalue-down'
+                  : ''
+              "
+              >{{ titleInfo.powerLossBurden?.value.toFixed(2) }}</span
+            >
+            <span class="showTitle fontSty">万kW/h</span>
+          </div>
+          <div
+            class="titleinfo"
+            @dblclick="dbClicks(titleInfo.powerLossPerformance, '性能损失')"
+          >
+            <span class="showTitle fontSty1">性能损失:</span>
+            <span
+              :class="
+                titleInfo.powerLossPerformance
+                  ? titleInfo.powerLossPerformance.trend === 'Counterpoise'
+                    ? 'showvalue'
+                    : titleInfo.powerLossPerformance.trend === 'Rise'
+                    ? 'showvalue-up'
+                    : 'showvalue-down'
+                  : ''
+              "
+              >{{ titleInfo.powerLossPerformance?.value.toFixed(2) }}</span
+            >
+            <span class="showTitle fontSty">万kW/h</span>
+          </div>
+          <div
+            class="titleinfo"
+            @dblclick="dbClicks(titleInfo.fieldElectricity, '场用电量')"
+          >
+            <span class="showTitle fontSty1">场用电量:</span>
+            <span class="showvalue">{{
+              titleInfo.fieldElectricity?.value.toFixed(2)
+            }}</span>
+            <span class="showTitle fontSty">万kW/h</span>
+          </div>
+        </div>
+      </el-col>
+      <el-col :span="1">
+        <el-popover
+          placement="bottom"
+          :width="150"
+          trigger="hover"
+          :show-arrow="false"
+        >
+          <template #reference>
+            <el-button
+              @click="userClick"
+              style="
+                top: 10px;
+                right: 70px;
+                color: #ffffff;
+                position: absolute;
+                background-color: black;
+                border: none;
+                font-size: 16px;
+              "
+            >
+              {{ usreName }}</el-button
+            >
+          </template>
+          <div style="background-color: #363636">
+            <!-- <el-button class="loginoption">编&emsp;辑</el-button> -->
+            <el-button v-if="!isLogin" class="loginoption" @click="userClick"
+              >登&emsp;录</el-button
+            >
+            <br v-if="!isLogin" />
+            <el-button v-if="isLogin" class="loginoption" @click="logout"
+              >注&emsp;销</el-button
+            >
+          </div>
+        </el-popover>
+        <div style="top: 7px; position: absolute; right: 10px">
+          <button class="closeButton" v-on:click="mainClose">×</button>
+        </div>
+      </el-col>
+    </el-row>
+    <DataDetails
+      @closed="closeds()"
+      v-model="display"
+      :datas="titleDetails"
+      :partsName="partsName"
+      echartsId="titleEcharts"
+      @search-data="search"
+      @original-data="originalData"
+    ></DataDetails>
+  </div>
 </template>
 
 <script>
@@ -229,6 +250,8 @@ import MessageBridge from "utils/MessageBridge";
 import DataDetails from "components/basicDataDetails.vue";
 import api from "api/index";
 import dayjs from "dayjs";
+
+import dataJson from "./titleBarJson.json";
 export default {
   name: "TitleBar",
   components: {
@@ -290,6 +313,9 @@ export default {
     this.titleInfos();
     this.intervals = setInterval(this.titleInfos, 10000);
   },
+  mounted() {
+    this.titleInfo = dataJson.titleInfo;
+  },
   methods: {
     titleInfos() {
       api.stationOverview().then((res) => {
@@ -499,11 +525,11 @@ export default {
   color: #ffffff;
   margin-right: 10px;
 }
-.fontSty{
-    font-size: 12px;
+.fontSty {
+  font-size: 12px;
 }
-.fontSty1{
-    font-weight: bold;;
+.fontSty1 {
+  font-weight: bold;
 }
 
 .showvalue {

src/views/titleBarJson.json

@@ -0,0 +1,25 @@
+{
+    "titleInfo": {
+        "dailyPowerGeneration": {
+            "value": 1000
+        },
+        "powerLossFault": {
+            "value": 100
+        },
+        "powerLossRestrictions": {
+            "value": 500
+        },
+        "powerLossInspection": {
+            "value": 500
+        },
+        "powerLossBurden": {
+            "value": 500
+        },
+        "powerLossPerformance": {
+            "value": 500
+        },
+        "fieldElectricity": {
+            "value": 500
+        }
+    }
+}