首页，全景监视部分页面模拟数据，蓝色样式

src/assets/styles/blueStyle/dialog.less

@@ -45,14 +45,14 @@
 
     .el-button:first-child {
         width: 108px;
-        background-color: rgba(84, 183, 90, 0.16) !important;
+        background-color: rgba(84, 135, 183, 0.16) !important;
         color: #b3b3b3;
         border-color: transparent;
     }
 
     .el-button:last-of-type {
-        background-color: rgba(5, 187, 76, 0.3);
-        border: 1px solid #3b6c53;
+        background-color: rgba(5, 90, 187, 0.3);
+        border: 1px solid #3b506c;
         color: #b3b3b3;
         font-size: 14px;
         border: none;
@@ -290,8 +290,8 @@
 
     .el-dialog {
         &:not(.cDialog) {
-            background: #081410;
-            border: 1px solid #083d22;
+            background: #080d14;
+            border: 1px solid #08213d;
             border-top: 0px;
             box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.35);
             border-radius: 12px 12px 6px 6px;

src/components/lightDetial/dataJson.json

@@ -0,0 +1,30 @@
+{
+    "code": 200,
+    "otherInfo": {
+        "manufacturer": "测试信号123",
+        "model": 253,
+        "squareid": "JZ"
+    },
+    "currentPartD": [
+        [
+            {
+                "name": "遥测数据1",
+                "value": 1
+            },
+            {
+                "name": "遥测数据1",
+                "value": 1
+            }
+        ],
+        [
+            {
+                "name": "遥测数据1",
+                "value": 1
+            },
+            {
+                "name": "遥测数据1",
+                "value": 1
+            }
+        ]
+    ]
+}

src/components/lightDetial/index.vue

@@ -112,6 +112,7 @@ import { GetWtPoints, GetPointsData } from "@/api/points/index.js";
 import svgIcon from "@/components/coms/icon/svg-icon.vue";
 import powerAndSpeed from "@/components/powerAndSpeedSearch/index.vue";
 import alarmDialog from "@/components/alarm";
+import dataJson from './dataJson.json'
 export default {
   name: "lightDetail",
   components: { svgIcon, alarmDialog, powerAndSpeed },
@@ -176,9 +177,13 @@ export default {
     };
   },
   mounted() {
-    this.timer = setInterval(async () => {
-      this.getPointsData();
-    }, 5000);
+    // this.timer = setInterval(async () => {
+    //   this.getPointsData();
+    // }, 5000);
+    this.otherInfo = dataJson.otherInfo
+    this.currentPartD = dataJson.currentPartD
+    this.currentPartA = dataJson.currentPartD
+
   },
   unmounted() {
     clearInterval(this.timer);

src/components/qushi/lineCharts.vue

@@ -169,13 +169,13 @@ export default {
         this.newlist = newValue;
         this.$nextTick(() => {
           this.newlist = this.list;
-          this.initChart();
+        //   this.initChart();
         });
       },
       deep: true,
     },
-    "$store.state.themeName"() {
-      this.initChart();
+    "$store.state.moreSty"() {
+    //   this.initChart();
     },
   },
   computed: {
@@ -355,7 +355,7 @@ export default {
     },
     changDateVisible(option) {
       this.seletedData = option;
-      this.initChart();
+    //   this.initChart();
     },
     resize() {},
     initChart() {
@@ -456,10 +456,11 @@ export default {
     },
   },
   created() {
-    this.$nextTick(() => {
-      this.id = "pie-chart-" + util.newGUID();
-    });
-    this.newlist = this.list;
+        this.$nextTick(() => {
+        this.id = "pie-chart-" + util.newGUID();
+        });
+        this.newlist = this.list;
+        
   },
   mounted() {
     this.$nextTick(() => {
@@ -470,7 +471,7 @@ export default {
   },
   updated() {
     this.$nextTick(() => {
-      this.initChart();
+    //   this.initChart();
     });
   },
   unmounted() {

src/components/windDetail/index.vue

@@ -130,7 +130,7 @@
     </div>
     <div class="parts">
       <div class="part-top">
-        <div class="part-title">
+        <div class="part-title"  :data-type="$store.state.moreSty">
           <div
             class="title-item part-left"
             :class="{ active: current === 'fdj' }"
@@ -183,55 +183,118 @@
           </div>
         </div>
         <div class="part-imgs" v-if="otherInfo?.model == 'XE100-2000'">
-          <img
-            class="wind-part"
-            :style="{ width: flag ? '450px' : '500px' }"
-            src="@assets/imgs/zqfj.png"
-          />
+            <img
+                v-if="$store.state.moreSty === 'greenSty'"
+                class="wind-part"
+                :style="{ width: flag ? '450px' : '500px' }"
+                src="@assets/imgs/zqfj.png"
+            />
+            <img
+                v-else
+                class="wind-part"
+                :style="{ width: flag ? '450px' : '500px' }"
+                src="@assets/imgs/zqfj_b.png"
+            />
         </div>
         <div class="part-imgs" v-else>
-          <img
-            v-if="current === 'fdj'"
-            class="wind-part"
-            :style="{ width: flag ? '650px' : '800px' }"
-            src="@assets/imgs/fdj.png"
-          />
-          <img
-            v-if="current === 'clx'"
-            class="wind-part"
-            :style="{ width: flag ? '650px' : '800px' }"
-            src="@assets/imgs/clx.png"
-          />
-          <img
-            v-if="current === 'bj'"
-            class="wind-part"
-            :style="{ width: flag ? '650px' : '800px' }"
-            src="@assets/imgs/bj.png"
-          />
-          <img
-            v-if="current === 'ph'"
-            class="wind-part"
-            :style="{ width: flag ? '650px' : '800px' }"
-            src="@assets/imgs/ph.png"
-          />
-          <img
-            v-if="current === 'yy'"
-            class="wind-part"
-            :style="{ width: flag ? '650px' : '800px' }"
-            src="@assets/imgs/yy.png"
-          />
-          <img
-            v-if="current === 'jc'"
-            class="wind-part"
-            :style="{ width: flag ? '650px' : '800px' }"
-            src="@assets/imgs/jc.png"
-          />
-          <img
-            v-if="current === 'qt'"
-            class="wind-part"
-            :style="{ width: flag ? '650px' : '800px' }"
-            src="@assets/imgs/qt.png"
-          />
+            <div v-if="current === 'fdj'">
+                <img
+                    v-if="$store.state.moreSty === 'greenSty'"
+                    class="wind-part"
+                    :style="{ width: flag ? '650px' : '800px' }"
+                    src="@assets/imgs/fdj.png"
+                />
+                <img
+                    v-else
+                    class="wind-part"
+                    :style="{ width: flag ? '650px' : '800px' }"
+                    src="@assets/imgs/fdj_b.png"
+                />
+            </div>
+            <div v-if="current === 'clx'">
+                <img
+                    v-if="$store.state.moreSty === 'greenSty'"
+                    class="wind-part"
+                    :style="{ width: flag ? '650px' : '800px' }"
+                    src="@assets/imgs/clx.png"
+                />
+                <img
+                    v-else
+                    class="wind-part"
+                    :style="{ width: flag ? '650px' : '800px' }"
+                    src="@assets/imgs/clx_b.png"
+                />
+            </div>
+            <div v-if="current === 'bj'">
+                <img
+                    v-if="$store.state.moreSty === 'greenSty'"
+                    class="wind-part"
+                    :style="{ width: flag ? '650px' : '800px' }"
+                    src="@assets/imgs/bj.png"
+                />
+                <img
+                    v-else
+                    class="wind-part"
+                    :style="{ width: flag ? '650px' : '800px' }"
+                    src="@assets/imgs/bj_b.png"
+                />
+            </div>
+            <div v-if="current === 'ph'">
+                <img
+                    v-if="$store.state.moreSty === 'greenSty'"
+                    class="wind-part"
+                    :style="{ width: flag ? '650px' : '800px' }"
+                    src="@assets/imgs/ph.png"
+                />
+                <img
+                    v-else
+                    class="wind-part"
+                    :style="{ width: flag ? '650px' : '800px' }"
+                    src="@assets/imgs/ph_b.png"
+                />
+            </div>
+            <div v-if="current === 'yy'">
+                <img
+                    v-if="$store.state.moreSty === 'greenSty'"
+                    class="wind-part"
+                    :style="{ width: flag ? '650px' : '800px' }"
+                    src="@assets/imgs/yy.png"
+                />
+                <img
+                    v-else
+                    class="wind-part"
+                    :style="{ width: flag ? '650px' : '800px' }"
+                    src="@assets/imgs/yy_b.png"
+                />
+            </div>
+            <div v-if="current === 'jc'">
+                <img
+                    v-if="$store.state.moreSty === 'greenSty'"
+                    class="wind-part"
+                    :style="{ width: flag ? '650px' : '800px' }"
+                    src="@assets/imgs/jc.png"
+                />
+                <img
+                    v-else
+                    class="wind-part"
+                    :style="{ width: flag ? '650px' : '800px' }"
+                    src="@assets/imgs/jc_b.png"
+                />
+            </div>
+            <div v-if="current === 'qt'">
+                <img
+                    v-if="$store.state.moreSty === 'greenSty'"
+                    class="wind-part"
+                    :style="{ width: flag ? '650px' : '800px' }"
+                    src="@assets/imgs/qt.png"
+                />
+                <img
+                    v-else
+                    class="wind-part"
+                    :style="{ width: flag ? '650px' : '800px' }"
+                    src="@assets/imgs/qt_b.png"
+                />
+            </div>
         </div>
       </div>
       <div class="part-info">
@@ -871,6 +934,33 @@ export default {
       width: 100%;
       text-align: center;
     }
+
+    .part-title[data-type~="greenSty"] {
+        .title-item {
+            border-left: 1px solid #3b6c53;
+            border-top: 1px solid #3b6c53;
+            border-bottom: 1px solid #3b6c53;
+            &.part-right {
+                border-right: 1px solid #3b6c53;
+            }
+            &.active {
+                background-color: rgba(0, 199, 19, 0.4);
+            }
+        }
+    }
+    .part-title[data-type~="blueSty"] {
+        .title-item {
+            border-left: 1px solid #3b586c;
+            border-top: 1px solid #3b586c;
+            border-bottom: 1px solid #3b586c;
+            &.part-right {
+                border-right: 1px solid #3b4f6c;
+            }
+            &.active {
+                background-color: rgba(0, 109, 199, 0.4);
+            }
+        }
+    }
     .part-title {
       width: 100%;
       height: 30px;
@@ -887,22 +977,16 @@ export default {
         justify-content: center;
         // background: rgba(67, 81, 107, 0.2);
         background: rgba(96, 103, 105, 0.2);
-        border-left: 1px solid #3b6c53;
-        border-top: 1px solid #3b6c53;
-        border-bottom: 1px solid #3b6c53;
 
         &.part-left {
           border-radius: 15px 0px 0px 15px;
         }
 
         &.part-right {
-          border-right: 1px solid #3b6c53;
           border-radius: 0px 15px 15px 0px;
         }
 
         &.active {
-          //   background-color: rgba(0, 70, 199, 0.4);
-          background-color: rgba(0, 199, 19, 0.4);
           color: #ffffff;
         }
       }

src/components/zbDialog/index.vue

@@ -42,7 +42,7 @@
         v-if="text == 'single' && type == -1"
         style="height: calc(100% - 72px)"
       >
-        <div class="targetNav">
+        <div class="targetNav" :data-type="$store.state.moreSty">
           <ul>
             <li
               :class="{ active: headerIndex == -1, 'li-left': true }"
@@ -143,7 +143,11 @@ export default {
       showIt: true,
     };
   },
-  created() {},
+  created() {
+    this.moreTargetData = new Array(50).fill({
+        name: "指标测试名称"
+    })
+  },
   methods: {
     // 初始化弹窗数据
     openDialog(type, text, station) {
@@ -291,6 +295,39 @@ export default {
 .el-checkbox {
   width: 180px;
 }
+
+.targetNav[data-type~="greenSty"] {
+    ul {
+        li {
+            border-left: 1px solid #3b6c53;
+            border-top: 1px solid #3b6c53;
+            border-bottom: 1px solid #3b6c53;
+            &.li-right {
+                border-right: 1px solid #3b6c53;
+            }
+
+            &.active {
+                background-color: rgba(0, 199, 19, 0.4);
+            }
+        }
+    }
+}
+.targetNav[data-type~="blueSty"] {
+    ul {
+        li {
+            border-left: 1px solid #3b526c;
+            border-top: 1px solid #3b526c;
+            border-bottom: 1px solid #3b526c;
+            &.li-right {
+                border-right: 1px solid #3b526c;
+            }
+
+            &.active {
+                background-color: rgba(0, 86, 199, 0.4);
+            }
+        }
+    }   
+}
 .targetNav {
   margin-bottom: 16px;
 
@@ -305,21 +342,16 @@ export default {
       color: #b3bdc0;
       // background: rgba(67, 81, 107, 0.2);
       background: rgba(96, 103, 105, 0.2);
-      border-left: 1px solid #3b6c53;
-      border-top: 1px solid #3b6c53;
-      border-bottom: 1px solid #3b6c53;
 
       &.li-left {
         border-radius: 15px 0px 0px 15px;
       }
 
       &.li-right {
-        border-right: 1px solid #3b6c53;
         border-radius: 0px 15px 15px 0px;
       }
 
       &.active {
-        background-color: rgba(0, 199, 19, 0.4);
         color: #ffffff;
       }
     }

src/router/index.js

@@ -1833,8 +1833,7 @@ export const asyncRoutes = [
   // 智能报表
   {
     path: "/report",
-      name: "report",
-      redirect: "/report/fdxnyrb",
+    redirect: "report/report/fdxnyrb",
     meta: {
       title: "智能报表",
       icon: "",

src/views/stateMonitor/factoryMonitor/components/saliderBar.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="sliderBar">
+  <div class="sliderBar" :data-type="$store.state.moreSty">
     <ul>
       <li
         v-for="(item, index) in routerData"
@@ -89,6 +89,21 @@ ul,
 ul li {
   list-style: none;
 }
+
+.sliderBar[data-type~="greenSty"] {
+    ul {
+        li{
+            border: 1px solid #05bb4c;
+        }
+    }
+}
+.sliderBar[data-type~="blueSty"] {
+    ul {
+        li{
+            border: 1px solid #1a93cf;
+        }
+    }
+}
 .sliderBar {
   ul {
     display: flex;
@@ -113,7 +128,7 @@ ul li {
     width: 36px;
     height: 36px;
     // border-radius: 50%;
-    border: 1px solid #05bb4c;
+    
     margin-top: 16px;
     cursor: pointer;
     .alarm-icon {

src/views/stateMonitor/factoryMonitor/photovoltaic/components/navList.vue

@@ -4,6 +4,7 @@
     <div class="menuList">
       <div
         class="menu"
+        :data-type="$store.state.moreSty"
         :class="{ active: menuIndex == index }"
         v-for="(nemu, index) in list"
         :key="index"
@@ -91,6 +92,18 @@ export default {
       immediate: true,
     },
   },
+  mounted() {
+    this.list = new Array(5).fill({
+        pjname: "测试数据",
+        lns: new Array(5).fill({
+            lnname: "测试Lns数据",
+            wts: new Array(5).fill({
+                status: "blue",
+                wtname: "测试w数据"
+            })
+        })
+    })
+  },
   methods: {
     handleClick(val) {
       if (this.menuIndex === val) {
@@ -395,17 +408,117 @@ export default {
     height: 3px;
   }
 }
+
+.menu[data-type~="greenSty"] {
+    .box-text{
+        border: 1px solid #3b6c53;
+        background: rgba(39, 62, 48, 0.6);
+    }
+    .dot {
+        border: 1px solid #05bb4c;
+        box-shadow: 0 0 7px rgb(42 255 28);
+    }
+    &.active {
+        .box-text {
+            color: #05bb4c;
+        }
+        .second-menu{
+            .box-text1 {
+                color: #05bb4c;
+            }
+            &.active {
+                .box-text1 {
+                    color: #05bb4c;
+
+                    .dot {
+                        background-color: #3b6c53;
+                    }
+
+                    &::after {
+                        border-left: 1px dashed rgba(5, 187, 76, 0.5);
+                    }
+                }
+
+                .box-text2 {
+                    border: 1px solid rgba(7, 122, 52, 0.8);
+                    background-color: rgba(7, 122, 52, 0.2);
+                }
+
+                .wind-item {
+                    border-left: 1px dashed rgba(5, 187, 76, 0.5);
+                    &::after {
+                        border-top: 1px dashed rgba(5, 187, 76, 0.5);
+                    }
+                    &.active {
+                        .box-text2 {
+                            background-color: rgba(7, 122, 52, 0.4);
+                        }
+                    }
+                }
+            }
+        }
+    }
+}
+.menu[data-type~="blueSty"] {
+    .box-text{
+        border: 1px solid #3b546c;
+        background: rgba(39, 50, 62, 0.6);
+    }
+    .dot {
+        border: 1px solid #055abb;
+        box-shadow: 0 0 7px rgb(28, 164, 255);
+    }
+    &.active {
+        .box-text {
+            color: #1a93cf;
+        }
+        .second-menu{
+            .box-text1 {
+                color: #1a93cf;
+            }
+            &.active {
+                .box-text1 {
+                    color: #1a93cf;
+
+                    .dot {
+                        background-color: #3b566c;
+                    }
+
+                    &::after {
+                        border-left: 1px dashed rgba(5, 105, 187, 0.5);
+                    }
+                }
+
+                .box-text2 {
+                    border: 1px solid rgba(7, 70, 122, 0.8);
+                    background-color: rgba(7, 70, 122, 0.2);
+                }
+
+                .wind-item {
+                    border-left: 1px dashed rgba(5, 105, 187, 0.5);
+                    &::after {
+                        border-top: 1px dashed rgba(5, 105, 187, 0.5);
+                    }
+                    &.active {
+                        .box-text2 {
+                            background-color: rgba(7, 70, 122, 0.4);
+                        }
+                    }
+                }
+            }
+        }
+    }
+}
+
 .menu {
   margin-bottom: 3px;
   .box-text {
     width: 100%;
-    border: 1px solid #3b6c53;
     border-radius: 2px;
     height: 32px;
     line-height: 32px;
     font-size: 14px;
     color: #b3b3b3;
-    background: rgba(39, 62, 48, 0.6);
     text-align: center;
     display: flex;
     align-items: center;
@@ -427,8 +540,6 @@ export default {
     width: 7px;
     height: 7px;
     border-radius: 50%;
-    border: 1px solid #05bb4c;
-    box-shadow: 0 0 7px rgb(42 255 28);
     margin-right: 7px;
     margin-left: 5px;
     background-color: RGBA(10, 13, 17, 1);
@@ -445,7 +556,6 @@ export default {
 
   &.active {
     .box-text {
-      color: #05bb4c;
     }
 
     .second-menu {
@@ -461,7 +571,6 @@ export default {
         height: 30px;
         line-height: 30px;
         border-bottom: 1px solid rgba(23, 27, 33, 1);
-        color: #05bb4c;
         align-items: center;
         justify-content: space-between;
         cursor: pointer;
@@ -476,10 +585,8 @@ export default {
 
       &.active {
         .box-text1 {
-          color: #05bb4c;
 
           .dot {
-            background-color: #3b6c53;
             z-index: 99;
           }
 
@@ -488,7 +595,6 @@ export default {
             display: block;
             width: 12px;
             height: 12px;
-            border-left: 1px dashed rgba(5, 187, 76, 0.5);
             position: absolute;
             left: 8px;
             top: 17px;
@@ -502,7 +608,6 @@ export default {
           line-height: 26px;
           color: #959595;
           margin: 0 10px 0 18px;
-          border-left: 1px dashed rgba(5, 187, 76, 0.5);
 
           .text {
             width: 100%;
@@ -545,11 +650,9 @@ export default {
               width: 84px;
               height: 22px;
               line-height: 22px;
-              border: 1px solid rgba(7, 122, 52, 0.8);
               padding: 0 12px;
               color: #959595;
               font-size: 12px;
-              background-color: rgba(7, 122, 52, 0.2);
               cursor: pointer;
             }
 
@@ -600,7 +703,6 @@ export default {
             display: block;
             width: 15px;
             height: 18px;
-            border-top: 1px dashed rgba(5, 187, 76, 0.5);
             position: absolute;
             left: -1px;
             top: 13px;
@@ -608,7 +710,6 @@ export default {
 
           &.active {
             .box-text2 {
-              background-color: rgba(7, 122, 52, 0.4);
               color: #fff;
             }
           }

src/views/stateMonitor/factoryMonitor/photovoltaic/lightDataTarget/index.vue

@@ -3,7 +3,7 @@
     <headerButton :type="stationType" @renderData="renderData" />
     <div class="systemData bodys">
       <div class="line">
-        <div class="leftContent"><span>数据指标</span></div>
+        <div class="leftContent" :data-type="$store.state.moreSty"><span>数据指标</span></div>
         <div class="rightContent">
           <div class="more" @click="addTargets"><i>+</i>更多指标</div>
         </div>
@@ -164,7 +164,7 @@ export default {
     };
   },
   created() {
-    this.loading = true;
+    // this.loading = true;
     // let localLightTargets = window.localStorage.getItem("lightlocalData");
     // if (
     //   localLightTargets != null &&
@@ -245,7 +245,7 @@ export default {
       {
         name: "逆变器直流电压",
         valueUnit: "V",
-        uniformCode: "AIG062",
+        uniformCode: "AIG061",
         width: "150",
       },
     ];
@@ -254,11 +254,21 @@ export default {
     //     JSON.stringify(this.uniformDetial)
     //   );
     // }
+
+    this.stationData = new Array(20).fill({
+        SBAMC: "测试设备",
+        SBXH: 10000,
+        AI121: "15",
+        AIG095: "152",
+        AI114: 14523,
+        AIG061: 25,
+        AIG061: 85,
+    })
   },
   mounted() {
-    this.timer = setInterval(() => {
-      this.GetWtTargetsList();
-    }, 5000);
+    // this.timer = setInterval(() => {
+    //   this.GetWtTargetsList();
+    // }, 5000);
   },
   unmounted() {
     clearInterval(this.timer);
@@ -563,12 +573,18 @@ ul li {
   width: 100%;
   margin-bottom: 5px;
 
+
+    .leftContent[data-type~="greenSty"] {
+      background: url("~@/assets/imgs/title_left_bg1.png") no-repeat;
+    }
+    .leftContent[data-type~="blueSty"] {
+        background: url("~@/assets/imgs/title_left_bg.png") no-repeat;
+    }
   .leftContent {
     width: 242px;
     height: 41px;
     display: flex;
     align-items: center;
-    background: url("~@/assets/imgs/title_left_bg1.png") no-repeat;
 
     span {
       font-size: 16px;

src/views/stateMonitor/factoryMonitor/photovoltaic/lightMatrix/dataJson.json

@@ -0,0 +1,34 @@
+{
+    "code": 0,
+    "sourceMapData": {
+        "czmc": 25,
+        "zjsl": 21,
+        "gf_djnum": 15,
+        "gf_dfnum": 38,
+        "gf_sdtjnum": 15,
+        "gf_yxnum": 17,
+        "gf_zcfdnum": 29,
+        "gf_jclyxnum": 38,
+        "gf_gznum": 15,
+        "gf_gzcnslnum": 38,
+        "gf_gztjnum": 15,
+        "gf_jxnum": 17,
+        "gf_jxtjnum": 29,
+        "gf_jxclslnum": 38,
+        "gf_xdnum": 25,
+        "gf_xdjclnum": 25,
+        "gf_tjnum": 25,
+        "gf_slnum": 25,
+        "gf_slhjnum": 25,
+        "gf_sldwnum": 25,
+        "gf_lxnum": 25,
+        "gf_lxyznum": 25,
+        "gf_wznum": 25,
+
+        "gzqd": 20,
+        "ycgl": 1256,
+        "bzgl": 2541,
+        "sjgl": 2054
+    },
+    "showMatrixListdata": []
+}

src/views/stateMonitor/factoryMonitor/photovoltaic/lightMatrix/index.vue

@@ -236,7 +236,7 @@
         :key="indexe"
       >
         <div class="line_all">
-          <div class="line-namebox">
+          <div class="line-namebox" :data-type="$store.state.moreSty">
             <div class="line-name" v-if="indexe && indexe.length >= 5">
               <div>{{ indexe.substring(0, indexe.indexOf("方阵")) }}</div>
               <div>方阵</div>
@@ -337,7 +337,7 @@
         </div>
       </div>
     </div>
-    <div
+    <!-- <div
       v-else
       style="
         height: calc(100% - 78px);
@@ -361,7 +361,7 @@
           <span></span>
         </template>
       </el-empty>
-    </div>
+    </div> -->
   </div>
   <el-dialog
     class="dialogs"
@@ -392,6 +392,7 @@ import LightDetail from "@/components/lightDetial/index.vue";
 import api from "@/api/cockpit/matrix/index.js";
 import dayjs from "dayjs";
 import { deepClone, findUpColor } from "@/utills/func.js";
+import dataJson from "./dataJson.json"
 export default {
   name: "lightMatrix",
   components: {
@@ -680,7 +681,7 @@ export default {
       ],
       glStsee: [],
       singleMatrixInfo: {}, //阵区矩阵数据
-      tab: "", //集中式 组串式
+      tab: "JZ", //集中式 组串式
       matrixState: {}, //矩阵状态数据
       matrixOther: {}, //矩阵其他数据
     };
@@ -688,9 +689,20 @@ export default {
 
   created() {},
   mounted() {
-    this.timer = setInterval(() => {
-      this.getSingleMatrix();
-    }, 5000);
+    // this.timer = setInterval(() => {
+    //   this.getSingleMatrix();
+    // }, 5000);
+    this.matrixState = dataJson.sourceMapData
+    this.matrixOther = dataJson.sourceMapData
+    for(let i =0; i<40; i++) {
+        this.showMatrixList.push(
+            dataJson.showMatrixListdata = new Array(2).fill({
+                name: "测试1",
+                yxzt: 3
+            })
+        )
+    }
+    
   },
   unmounted() {
     clearInterval(this.timer);
@@ -1514,6 +1526,28 @@ p {
       display: flex;
       align-items: center;
       margin-top: 5px;
+      .line-namebox[data-type~="greenSty"] {
+            border-image: linear-gradient(
+                321deg,
+                rgba(5, 187, 76, 0.2),
+                rgba(5, 187, 76, 0.1),
+                rgba(67, 81, 107, 0.1),
+                rgba(67, 81, 107, 0),
+                rgba(5, 187, 76, 0.5)
+            )
+            1 1;
+        }
+        .line-namebox[data-type~="blueSty"] {
+            border-image: linear-gradient(
+                321deg,
+                rgba(5, 99, 187, 0.2),
+                rgba(5, 120, 187, 0.1),
+                rgba(67, 81, 107, 0.1),
+                rgba(67, 81, 107, 0),
+                rgba(5, 114, 187, 0.5)
+            )
+            1 1;     
+        }
       .line-namebox {
         padding: 0 10px;
         min-height: 66px;
@@ -1526,15 +1560,6 @@ p {
         justify-content: center;
         border-radius: 5px;
         border: 1px solid;
-        border-image: linear-gradient(
-            321deg,
-            rgba(5, 187, 76, 0.2),
-            rgba(5, 187, 76, 0.1),
-            rgba(67, 81, 107, 0.1),
-            rgba(67, 81, 107, 0),
-            rgba(5, 187, 76, 0.5)
-          )
-          1 1;
       }
 
       .line-list {

src/views/stateMonitor/factoryMonitor/photovoltaic/lightMatrixMonitor/dataJson.json

@@ -0,0 +1,126 @@
+{
+    "code": 0,
+    "sourceMapData": {
+        "jrts": 25,
+        "djts": 21,
+        "bwts": 15,
+        "gzts": 38,
+        "jxts": 15,
+        "xdts": 17,
+        "slts": 29,
+        "lxts": 38,
+
+        "dfts": 25,
+        "zcyx": 25,
+        "gztj": 25,
+        "jxtj": 25,
+        "xdjcl": 25,
+        "dwsl": 25,
+        "lx": 25,
+
+        "sdtj": 25,
+        "jclyx": 25,
+        "gzsl": 25,
+        "jxsl": 25,
+        "xdtj": 25,
+        "hjsl": 25,
+        "wz": 25,
+
+        "speed": 20,
+        "ycgl": 1256,
+        "bzgl": 2541,
+        "sjgl": 2054
+    },
+    "showMatrixListdata": [
+        {
+            "wpname": "测试1",
+            "czlx": "-1",
+            "jrts": 25,
+            "djts": 21,
+            "bwts": 15,
+            "gzts": 38,
+            "jxts": 15,
+            "xdts": 17,
+            "slts": 29,
+            "lxts": 38,
+            "spped": 14,
+            "ycgl": 21556,
+            "bzgl": 1254,
+            "llgl": 125445,
+            "sjgl": 1254,
+            "lineVos": []
+        },
+        {
+            "wpname": "测试2",
+            "czlx": "-1",
+            "jrts": 25,
+            "djts": 21,
+            "bwts": 15,
+            "gzts": 38,
+            "jxts": 15,
+            "xdts": 17,
+            "slts": 29,
+            "lxts": 38,
+            "spped": 14,
+            "ycgl": 21556,
+            "bzgl": 1254,
+            "llgl": 125445,
+            "sjgl": 1254,
+            "lineVos": []
+        },
+        {
+            "wpname": "测试3",
+            "czlx": "-1",
+            "jrts": 25,
+            "djts": 21,
+            "bwts": 15,
+            "gzts": 38,
+            "jxts": 15,
+            "xdts": 17,
+            "slts": 29,
+            "lxts": 38,
+            "spped": 14,
+            "ycgl": 21556,
+            "bzgl": 1254,
+            "llgl": 125445,
+            "sjgl": 1254,
+            "lineVos": []
+        },
+        {
+            "wpname": "测试4",
+            "czlx": "-1",
+            "jrts": 25,
+            "djts": 21,
+            "bwts": 15,
+            "gzts": 38,
+            "jxts": 15,
+            "xdts": 17,
+            "slts": 29,
+            "lxts": 38,
+            "spped": 14,
+            "ycgl": 21556,
+            "bzgl": 1254,
+            "llgl": 125445,
+            "sjgl": 1254,
+            "lineVos": []
+        },
+        {
+            "wpname": "测试5",
+            "czlx": "-1",
+            "jrts": 25,
+            "djts": 21,
+            "bwts": 15,
+            "gzts": 38,
+            "jxts": 15,
+            "xdts": 17,
+            "slts": 29,
+            "lxts": 38,
+            "spped": 14,
+            "ycgl": 21556,
+            "bzgl": 1254,
+            "llgl": 125445,
+            "sjgl": 1254,
+            "lineVos": []
+        }
+    ]
+}

src/views/stateMonitor/factoryMonitor/photovoltaic/lightMatrixMonitor/index.vue

@@ -94,6 +94,7 @@
       </div>
       <div
         class="unpaid"
+        :data-type="$store.state.moreSty"
         @click="handleStationCurveClick(singleMatrixInfo.wpid)"
       >
         <div class="unpaid-list">
@@ -174,7 +175,7 @@
           v-for="(mes, index) in value?.lineVos"
           :key="index"
         >
-          <div class="line-namebox">
+          <div class="line-namebox" :data-type="$store.state.moreSty">
             <div class="line-name">
               {{ mes.name }}
             </div>
@@ -317,6 +318,7 @@ import LightDetail from "@/components/lightDetial/index.vue";
 import api from "@/api/cockpit/matrix/index.js";
 import dayjs from "dayjs";
 import { deepClone, findUpColor } from "@/utills/func.js";
+import dataJson from "./dataJson.json"
 export default {
   name: "lightMatrixMonitor",
   components: {
@@ -678,9 +680,29 @@ export default {
 
   created() {},
   mounted() {
-    this.timer = setInterval(() => {
-      this.getSingleMatrix();
-    }, 5000);
+    // this.timer = setInterval(() => {
+    //   this.getSingleMatrix();
+    // }, 5000);
+    this.singleMatrixInfo = dataJson.sourceMapData
+    this.showMatrixList = dataJson.showMatrixListdata
+    dataJson.showMatrixListdata.forEach((it, index) =>{
+        it.lineVos = new Array(5).fill({
+            name: "测试数据1",
+            wtDataList: new Array(13).fill({
+                wtname: it.wpname,
+                status: index === 4 ? 6 : index,
+                czlx: -1,
+                wtid: 5,
+                power: 2514,
+                speed: 13,
+                current: 251,
+                transfer: 21,
+                voltage: 25,
+                rate: 395,
+                ssqfzt: 1
+            })
+        })
+    })
   },
   unmounted() {
     clearInterval(this.timer);
@@ -1479,13 +1501,22 @@ p {
       }
     }
 
+    .unpaid[data-type~="greenSty"] {
+        background: #081410;
+        border: 1px solid #083d22;
+    }
+    .unpaid[data-type~="blueSty"] {
+        background: #080e14;
+        border: 1px solid #08283d;
+    }
+
     .unpaid {
       display: flex;
       flex-direction: row;
       align-items: center;
       height: 65px;
-      background: rgba(0, 70, 199, 0.08);
-      border: 1px solid #1e386a;
+    //   background: rgba(0, 70, 199, 0.08);
+    //   border: 1px solid #1e386a;
       position: relative;
       flex: 1 0 auto;
       margin-left: 10px;
@@ -1579,6 +1610,29 @@ p {
       display: flex;
       align-items: center;
       margin-top: 5px;
+
+      .line-namebox[data-type~="greenSty"] {
+            border-image: linear-gradient(
+                321deg,
+                rgba(5, 187, 76, 0.2),
+                rgba(5, 187, 76, 0.1),
+                rgba(67, 81, 107, 0.1),
+                rgba(67, 81, 107, 0),
+                rgba(5, 187, 76, 0.5)
+            )
+            1 1;
+        }
+        .line-namebox[data-type~="blueSty"] {
+            border-image: linear-gradient(
+                321deg,
+                rgba(5, 99, 187, 0.2),
+                rgba(5, 120, 187, 0.1),
+                rgba(67, 81, 107, 0.1),
+                rgba(67, 81, 107, 0),
+                rgba(5, 114, 187, 0.5)
+            )
+            1 1;     
+        }
       .line-namebox {
         padding: 0 10px;
         min-height: 66px;
@@ -1590,15 +1644,6 @@ p {
         align-items: center;
         border-radius: 5px;
         border: 1px solid;
-        border-image: linear-gradient(
-            321deg,
-            rgba(5, 187, 76, 0.2),
-            rgba(5, 187, 76, 0.1),
-            rgba(67, 81, 107, 0.1),
-            rgba(67, 81, 107, 0),
-            rgba(5, 187, 76, 0.5)
-          )
-          1 1;
       }
 
       .line-list {

src/views/stateMonitor/factoryMonitor/windPowerPlant/DataTarget/index.vue

@@ -1,9 +1,10 @@
 <template>
   <div class="DataTarget">
-    <headerButton :type="stationType" @renderData="renderData" />
+     <!-- @renderData="renderData" -->
+    <headerButton :type="stationType" />
     <div class="systemData bodys">
       <div class="line">
-        <div class="leftContent"><span>数据指标</span></div>
+        <div class="leftContent"  :data-type="$store.state.moreSty"><span>数据指标</span></div>
         <div class="rightContent">
           <div class="more" @click="addTargets"><i>+</i>更多指标</div>
         </div>
@@ -30,12 +31,13 @@
           width="58"
         >
         </el-table-column>
+         <!-- :align="index < 1 ? 'center' : 'right'" -->
         <el-table-column
           v-for="(item, index) in uniformDetial"
           :key="index"
           :prop="item.uniformCode"
           sortable
-         :align="index < 1 ? 'center' : 'right'"
+          align="center"
           header-align="center"
           :resizable="true"
           :min-width="item.width"
@@ -163,7 +165,7 @@ export default {
     };
   },
   async created() {
-    this.loading = true;
+    // this.loading = true;
     // let localWindTargets = window.localStorage.getItem("windlocalData");
     // if (localWindTargets != null && JSON.stringify(localWindTargets) != "{}") {
     //   localWindTargets = JSON.parse(localWindTargets);
@@ -238,6 +240,16 @@ export default {
         width: "150",
       },
     ];
+
+    this.stationData = new Array(20).fill({
+        SBAMC: "测试设备",
+        SBXH: 10000,
+        AI066: "15",
+        AI067: "152",
+        AI114: 14523,
+        AI074: 25,
+        AI060: 85,
+    })
     //   window.localStorage.setItem(
     //     "windlocalData",
     //     JSON.stringify(this.uniformDetial)
@@ -245,9 +257,9 @@ export default {
     // }
   },
   mounted() {
-    this.timer = setInterval(() => {
-      this.GetWtTargetsList();
-    }, 5000);
+    // this.timer = setInterval(() => {
+    //   this.GetWtTargetsList();
+    // }, 5000);
   },
   unmounted() {
     clearInterval(this.timer);
@@ -557,12 +569,18 @@ ul li {
   width: 100%;
   margin-bottom: 5px;
 
+  .leftContent[data-type~="greenSty"] {
+      background: url("~@/assets/imgs/title_left_bg1.png") no-repeat;
+    }
+    .leftContent[data-type~="blueSty"] {
+        background: url("~@/assets/imgs/title_left_bg.png") no-repeat;
+    }
+
   .leftContent {
     width: 242px;
     height: 41px;
     display: flex;
     align-items: center;
-    background: url("~@/assets/imgs/title_left_bg1.png") no-repeat;
 
     span {
       font-size: 16px;

src/views/stateMonitor/factoryMonitor/windPowerPlant/boosterStation/index.vue

@@ -6,6 +6,8 @@
   />
   <div style="height: calc(100% - 57px)">
     <!-- 风场 *************** -->
+    <!-- 测试   用于展示 -->
+    <TEST class="booster-station-body"/>
     <!-- 高家堰 -->
     <GJY class="booster-station-body" v-if="wpId === 'SXJ_KGDL_GJY_FDC_STA'" />
     <!-- 败虎堡 -->
@@ -119,7 +121,8 @@
 import headerButton from "@/views/stateMonitor/factoryMonitor/components/headerButton.vue";
 // import sbsAlarm from "@/components/sbsAlarm/index.vue";
 import { ElMessageBox } from "element-plus";
-// 风场
+// 风场TEST
+import TEST from "./components/TEST.vue";
 import GJY from "./components/GJY.vue";
 import BHB from "./components/BHB.vue";
 import BHBSQ from "./components/BHBSQ.vue";
@@ -141,6 +144,7 @@ export default {
   components: {
     headerButton,
     // sbsAlarm,
+    TEST,
     GJY,
     BHB,
     BHBSQ,

src/views/stateMonitor/factoryMonitor/windPowerPlant/components/collapse-list.vue

@@ -4,6 +4,7 @@
     <div class="menuList">
       <div
         class="menu"
+         :data-type="$store.state.moreSty"
         :class="{ active: menuIndex == index }"
         v-for="(nemu, index) in list"
         :key="index"
@@ -92,6 +93,18 @@ export default {
       immediate: true,
     },
   },
+  mounted() {
+    this.list = new Array(5).fill({
+        pjname: "测试数据",
+        lns: new Array(5).fill({
+            lnname: "测试Lns数据",
+            wts: new Array(5).fill({
+                status: "blue",
+                wtname: "测试w数据"
+            })
+        })
+    })
+  },
   methods: {
     handleClick(val) {
       if (this.menuIndex === val) {
@@ -143,17 +156,116 @@ export default {
     height: 3px;
   }
 }
+
+.menu[data-type~="greenSty"] {
+    .box-text{
+        border: 1px solid #3b6c53;
+        background: rgba(39, 62, 48, 0.6);
+    }
+    .dot {
+        border: 1px solid #05bb4c;
+        box-shadow: 0 0 7px rgb(42 255 28);
+    }
+    &.active {
+        .box-text {
+            color: #05bb4c;
+        }
+        .second-menu{
+            .box-text1 {
+                color: #05bb4c;
+            }
+            &.active {
+                .box-text1 {
+                    color: #05bb4c;
+
+                    .dot {
+                        background-color: #3b6c53;
+                    }
+
+                    &::after {
+                        border-left: 1px dashed rgba(5, 187, 76, 0.5);
+                    }
+                }
+
+                .box-text2 {
+                    border: 1px solid rgba(7, 122, 52, 0.8);
+                    background-color: rgba(7, 122, 52, 0.2);
+                }
+
+                .wind-item {
+                    border-left: 1px dashed rgba(5, 187, 76, 0.5);
+                    &::after {
+                        border-top: 1px dashed rgba(5, 187, 76, 0.5);
+                    }
+                    &.active {
+                        .box-text2 {
+                            background-color: rgba(7, 122, 52, 0.4);
+                        }
+                    }
+                }
+            }
+        }
+    }
+}
+.menu[data-type~="blueSty"] {
+    .box-text{
+        border: 1px solid #3b546c;
+        background: rgba(39, 50, 62, 0.6);
+    }
+    .dot {
+        border: 1px solid #055abb;
+        box-shadow: 0 0 7px rgb(28, 164, 255);
+    }
+    &.active {
+        .box-text {
+            color: #1a93cf;
+        }
+        .second-menu{
+            .box-text1 {
+                color: #1a93cf;
+            }
+            &.active {
+                .box-text1 {
+                    color: #1a93cf;
+
+                    .dot {
+                        background-color: #3b566c;
+                    }
+
+                    &::after {
+                        border-left: 1px dashed rgba(5, 105, 187, 0.5);
+                    }
+                }
+
+                .box-text2 {
+                    border: 1px solid rgba(7, 70, 122, 0.8);
+                    background-color: rgba(7, 70, 122, 0.2);
+                }
+
+                .wind-item {
+                    border-left: 1px dashed rgba(5, 105, 187, 0.5);
+                    &::after {
+                        border-top: 1px dashed rgba(5, 105, 187, 0.5);
+                    }
+                    &.active {
+                        .box-text2 {
+                            background-color: rgba(7, 70, 122, 0.4);
+                        }
+                    }
+                }
+            }
+        }
+    }
+}
 .menu {
   margin-bottom: 3px;
   .box-text {
     width: 100%;
-    border: 1px solid #3b6c53;
     border-radius: 2px;
     height: 32px;
     line-height: 32px;
     font-size: 14px;
     color: #b3b3b3;
-    background: rgba(39, 62, 48, 0.6);
     text-align: center;
     display: flex;
     align-items: center;
@@ -175,11 +287,9 @@ export default {
     width: 7px;
     height: 7px;
     border-radius: 50%;
-    border: 1px solid #05bb4c;
-    box-shadow: 0 0 7px rgb(42 255 28);
     margin-right: 7px;
     margin-left: 5px;
-    background-color: RGBA(10, 13, 17, 1);
+    background-color: rgba(10, 13, 17, 1);
     z-index: 99;
   }
 
@@ -192,9 +302,6 @@ export default {
   }
 
   &.active {
-    .box-text {
-      color: #05bb4c;
-    }
 
     .second-menu {
       display: block;
@@ -209,7 +316,6 @@ export default {
         height: 30px;
         line-height: 30px;
         border-bottom: 1px solid rgba(23, 27, 33, 1);
-        color: #05bb4c;
         align-items: center;
         justify-content: space-between;
         cursor: pointer;
@@ -224,10 +330,8 @@ export default {
 
       &.active {
         .box-text1 {
-          color: #05bb4c;
 
           .dot {
-            background-color: #3b6c53;
             z-index: 99;
           }
 
@@ -236,7 +340,6 @@ export default {
             display: block;
             width: 12px;
             height: 12px;
-            border-left: 1px dashed rgba(5, 187, 76, 0.5);
             position: absolute;
             left: 8px;
             top: 17px;
@@ -250,7 +353,6 @@ export default {
           line-height: 26px;
           color: #959595;
           margin: 0 10px 0 18px;
-          border-left: 1px dashed rgba(5, 187, 76, 0.5);
 
           .text {
             width: 100%;
@@ -259,14 +361,15 @@ export default {
             align-items: center;
             height: 26px;
             line-height: 26px;
-            &.green .dot {
-              background-color: rgba(5, 187, 76, 0.7);
-              border-color: #05bb4c;
-            }
             &.blue .dot {
               background-color: rgba(28, 153, 255, 0.7);
               border-color: #1c99ff;
             }
+            
+            &.green .dot {
+              background-color: rgba(5, 187, 76, 0.7);
+              border-color: #05bb4c;
+            }
             &.pink .dot {
               background-color: rgba(197, 48, 200, 0.7);
               border-color: #c530c8;
@@ -293,11 +396,9 @@ export default {
               width: 84px;
               height: 22px;
               line-height: 22px;
-              border: 1px solid rgba(7, 122, 52, 0.8);
               padding: 0 12px;
               color: #959595;
               font-size: 12px;
-              background-color: rgba(7, 122, 52, 0.2);
               cursor: pointer;
             }
 
@@ -348,7 +449,6 @@ export default {
             display: block;
             width: 15px;
             height: 18px;
-            border-top: 1px dashed rgba(5, 187, 76, 0.5);
             position: absolute;
             left: -1px;
             top: 13px;
@@ -356,7 +456,6 @@ export default {
 
           &.active {
             .box-text2 {
-              background-color: rgba(7, 122, 52, 0.4);
               color: #fff;
             }
           }
@@ -365,4 +464,4 @@ export default {
     }
   }
 }
-</style>
+</style>

src/views/stateMonitor/factoryMonitor/windPowerPlant/geomorphologicMap/components/test-map.vue

@@ -0,0 +1,616 @@
+<template>
+  <div class="svg-map">
+    <svg
+      version="1.1"
+      xmlns="http://www.w3.org/2000/svg"
+      xmlns:xlink="http://www.w3.org/1999/xlink"
+      x="0px"
+      y="0px"
+      viewBox="0 0 1955 940"
+      :style="
+        'enable-background: new 0 0 866 359; left: ' +
+        svgLeft +
+        '; top: ' +
+        svgTop +
+        ';'
+      "
+      xml:space="preserve"
+      :width="svgWidth"
+      :height="svgHeight"
+    >
+      <defs>
+        <g id="nx-map-line">
+          <line
+            class="nx-map-line"
+            x1="25"
+            y1="25"
+            x2="25"
+            y2="80"
+            stroke="#edbf03"
+            stroke-width="1"
+          />
+          <circle
+            class="nx-map-up-circle"
+            cx="25"
+            cy="25"
+            r="2"
+            fill="#edbf03"
+          />
+        </g>
+        <g id="nx-map-circle">
+          <circle
+            class="nx-map-down-circle-1"
+            cx="25"
+            cy="80"
+            r="3"
+            fill="#edbf03"
+          />
+          <circle
+            class="nx-map-down-circle-2"
+            :class="{ 'nx-map-down-circle-loop': c1 }"
+            cx="25"
+            cy="80"
+            r="9"
+            stroke="#edbf03"
+            stroke-width="1"
+            fill="none"
+          />
+          <circle
+            class="nx-map-down-circle-3"
+            :class="{ 'nx-map-down-circle-loop': c2 }"
+            cx="25"
+            cy="80"
+            r="16"
+            opacity="0.6"
+            stroke="#edbf03"
+            stroke-width="1"
+            fill="none"
+          />
+        </g>
+      </defs>
+      <g>
+        <image
+          style="overflow: visible"
+          width="2050"
+          height="1110"
+          class="map-base"
+          xlink:href="./img/dmt_yty.png"
+          transform="matrix(1 0 0 1 0 -100)"
+        ></image>
+        <g
+          class="item-label-hover"
+          v-for="(item, index) in dataList"
+          :key="index"
+        >
+          <svg
+            data-v-28794fe1=""
+            version="1.1"
+            xmlns="http://www.w3.org/2000/svg"
+            xmlns:xlink="http://www.w3.org/1999/xlink"
+            :x="String(Number(item.x) - 45)"
+            :y="String(Number(item.y) - 60)"
+            width="150"
+            height="150"
+            viewBox="0 0 220 392"
+            enable-background="new 0 0 220 392"
+            xml:space="preserve"
+            class="windmill"
+          >
+            <image
+              v-if="item.name != '升压站'"
+              data-v-28794fe1=""
+              width="147"
+              height="345"
+              x="58"
+              y="78"
+              xlink:href="@/assets/map/fan/yz.png"
+              class="pillar"
+            ></image>
+            <!-- 运行 -->
+            <image
+              v-if="item.type === 2 || item.type === 3"
+              data-v-28794fe1=""
+              width="200"
+              height="460"
+              xlink:href="@/assets/map/fan/yp_green.png"
+              class="turnCircle"
+            ></image>
+            <!-- 受累 -->
+            <image
+              v-if="item.type === 10 || item.type === 11"
+              data-v-28794fe1=""
+              width="200"
+              height="460"
+              xlink:href="@/assets/map/fan/yp_white.png"
+            ></image>
+            <!-- 限电 -->
+            <image
+              v-if="item.type === 8 || item.type === 9"
+              data-v-28794fe1=""
+              width="200"
+              height="460"
+              xlink:href="@/assets/map/fan/yp_purple.png"
+              class="turnCircle-slow"
+            ></image>
+            <!-- 离线 -->
+            <image
+              v-if="item.type === 12 || item.type === 13"
+              data-v-28794fe1=""
+              width="200"
+              height="460"
+              xlink:href="@/assets/map/fan/yp_black.png"
+            ></image>
+            <!-- 待机 -->
+            <image
+              v-if="item.type === 0 || item.type === 1"
+              data-v-28794fe1=""
+              width="200"
+              height="460"
+              xlink:href="@/assets/map/fan/yp_blue.png"
+            ></image>
+            <!-- 故障 -->
+            <image
+              v-if="item.type === 4 || item.type === 5"
+              data-v-28794fe1=""
+              width="200"
+              height="460"
+              xlink:href="@/assets/map/fan/yp_red.png"
+            ></image>
+            <!-- 检修 -->
+            <image
+              v-if="item.type === 6 || item.type === 7"
+              data-v-28794fe1=""
+              width="200"
+              height="460"
+              xlink:href="@/assets/map/fan/yp_orange.png"
+            ></image>
+            <!-- 升压站 -->
+            <image
+              v-if="item.name == '升压站'"
+              data-v-28794fe1=""
+              width="200"
+              height="460"
+              xlink:href="@/assets/png/booster-station.png"
+            ></image>
+          </svg>
+          <text
+            v-if="item.name != '升压站'"
+            class="mapKey"
+            :x="Number(item.x) + 25"
+            :y="Number(item.y) + 90"
+            fill="#ffffff"
+            font-size="14"
+          >
+            {{ item.name }}
+          </text>
+          <text
+            v-else
+            class="mapKey"
+            :x="Number(item.x) + 10"
+            :y="Number(item.y) + 80"
+            fill="#ffffff"
+            font-size="14"
+          >
+            {{ item.name }}
+          </text>
+          <g class="isshow" v-show="item.name != '升压站'">
+            <rect
+              :x="Number(item.x) + 55"
+              :y="Number(item.y) + 20"
+              width="90"
+              height="50"
+              stroke="#46C55A35"
+              fill="#000000"
+              opacity="0.8"
+            />
+            <text
+              :x="Number(item.x) + 60"
+              :y="Number(item.y) + 40"
+              fill="#ffffff"
+              font-size="14"
+            >
+              {{ item.fs }}m/s
+            </text>
+            <text
+              :x="Number(item.x) + 60"
+              :y="Number(item.y) + 60"
+              fill="#ffffff"
+              font-size="14"
+            >
+              {{ item.gl }}kW
+            </text>
+          </g>
+        </g>
+      </g>
+      <g>
+        <svg
+          :x="-20"
+          :y="770"
+          data-v-28794fe1=""
+          version="1.1"
+          xmlns="http://www.w3.org/2000/svg"
+          xmlns:xlink="http://www.w3.org/1999/xlink"
+          width="150"
+          height="150"
+          viewBox="0 0 220 392"
+          enable-background="new 0 0 220 392"
+          xml:space="preserve"
+          class="windmill"
+        >
+          <image
+            data-v-28794fe1=""
+            width="147"
+            height="345"
+            x="58"
+            y="78"
+            xlink:href="@/assets/map/fan/yz.png"
+            class="pillar"
+          ></image>
+          <image
+            data-v-28794fe1=""
+            width="200"
+            height="460"
+            xlink:href="@/assets/map/fan/yp_green.png"
+          ></image>
+        </svg>
+        <text :x="43" :y="920" fill="#ffffff" font-size="14">运行</text>
+        <svg
+          :x="40"
+          :y="770"
+          data-v-28794fe1=""
+          version="1.1"
+          xmlns="http://www.w3.org/2000/svg"
+          xmlns:xlink="http://www.w3.org/1999/xlink"
+          width="150"
+          height="150"
+          viewBox="0 0 220 392"
+          enable-background="new 0 0 220 392"
+          xml:space="preserve"
+          class="windmill"
+        >
+          <image
+            data-v-28794fe1=""
+            width="147"
+            height="345"
+            x="58"
+            y="78"
+            xlink:href="@/assets/map/fan/yz.png"
+            class="pillar"
+          ></image>
+          <image
+            data-v-28794fe1=""
+            width="200"
+            height="460"
+            xlink:href="@/assets/map/fan/yp_white.png"
+          ></image>
+        </svg>
+        <text :x="107" :y="920" fill="#ffffff" font-size="14">受累</text>
+        <svg
+          :x="100"
+          :y="770"
+          data-v-28794fe1=""
+          version="1.1"
+          xmlns="http://www.w3.org/2000/svg"
+          xmlns:xlink="http://www.w3.org/1999/xlink"
+          width="150"
+          height="150"
+          viewBox="0 0 220 392"
+          enable-background="new 0 0 220 392"
+          xml:space="preserve"
+          class="windmill"
+        >
+          <image
+            data-v-28794fe1=""
+            width="147"
+            height="345"
+            x="58"
+            y="78"
+            xlink:href="@/assets/map/fan/yz.png"
+            class="pillar"
+          ></image>
+          <image
+            data-v-28794fe1=""
+            width="200"
+            height="460"
+            xlink:href="@/assets/map/fan/yp_purple.png"
+          ></image>
+        </svg>
+        <text :x="165" :y="920" fill="#ffffff" font-size="14">限电</text>
+        <svg
+          :x="160"
+          :y="770"
+          data-v-28794fe1=""
+          version="1.1"
+          xmlns="http://www.w3.org/2000/svg"
+          xmlns:xlink="http://www.w3.org/1999/xlink"
+          width="150"
+          height="150"
+          viewBox="0 0 220 392"
+          enable-background="new 0 0 220 392"
+          xml:space="preserve"
+          class="windmill"
+        >
+          <image
+            data-v-28794fe1=""
+            width="147"
+            height="345"
+            x="58"
+            y="78"
+            xlink:href="@/assets/map/fan/yz.png"
+            class="pillar"
+          ></image>
+          <image
+            data-v-28794fe1=""
+            width="200"
+            height="460"
+            xlink:href="@/assets/map/fan/yp_black.png"
+          ></image>
+        </svg>
+        <text :x="229" :y="920" fill="#ffffff" font-size="14">离线</text>
+        <svg
+          :x="220"
+          :y="770"
+          data-v-28794fe1=""
+          version="1.1"
+          xmlns="http://www.w3.org/2000/svg"
+          xmlns:xlink="http://www.w3.org/1999/xlink"
+          width="150"
+          height="150"
+          viewBox="0 0 220 392"
+          enable-background="new 0 0 220 392"
+          xml:space="preserve"
+          class="windmill"
+        >
+          <image
+            data-v-28794fe1=""
+            width="147"
+            height="345"
+            x="58"
+            y="78"
+            xlink:href="@/assets/map/fan/yz.png"
+            class="pillar"
+          ></image>
+          <image
+            data-v-28794fe1=""
+            width="200"
+            height="460"
+            xlink:href="@/assets/map/fan/yp_blue.png"
+          ></image>
+        </svg>
+        <text :x="288" :y="920" fill="#ffffff" font-size="14">待机</text>
+        <svg
+          :x="280"
+          :y="770"
+          data-v-28794fe1=""
+          version="1.1"
+          xmlns="http://www.w3.org/2000/svg"
+          xmlns:xlink="http://www.w3.org/1999/xlink"
+          width="150"
+          height="150"
+          viewBox="0 0 220 392"
+          enable-background="new 0 0 220 392"
+          xml:space="preserve"
+          class="windmill"
+        >
+          <image
+            data-v-28794fe1=""
+            width="147"
+            height="345"
+            x="58"
+            y="78"
+            xlink:href="@/assets/map/fan/yz.png"
+            class="pillar"
+          ></image>
+          <image
+            data-v-28794fe1=""
+            width="200"
+            height="460"
+            xlink:href="@/assets/map/fan/yp_red.png"
+          ></image>
+        </svg>
+        <text :x="347" :y="920" fill="#ffffff" font-size="14">故障</text>
+        <svg
+          :x="340"
+          :y="770"
+          data-v-28794fe1=""
+          version="1.1"
+          xmlns="http://www.w3.org/2000/svg"
+          xmlns:xlink="http://www.w3.org/1999/xlink"
+          width="150"
+          height="150"
+          viewBox="0 0 220 392"
+          enable-background="new 0 0 220 392"
+          xml:space="preserve"
+          class="windmill"
+        >
+          <image
+            data-v-28794fe1=""
+            width="147"
+            height="345"
+            x="58"
+            y="78"
+            xlink:href="@/assets/map/fan/yz.png"
+            class="pillar"
+          ></image>
+          <image
+            data-v-28794fe1=""
+            width="200"
+            height="460"
+            xlink:href="@/assets/map/fan/yp_orange.png"
+          ></image>
+        </svg>
+        <text :x="410" :y="920" fill="#ffffff" font-size="14">检修</text>
+      </g>
+    </svg>
+  </div>
+</template>
+<script>
+export default {
+  props: {
+    windturbineList: {
+      type: Array,
+      required: true,
+    },
+  },
+  data() {
+    return {
+      dataList: [
+        {
+          name: "升压站",
+          x: "1420",
+          y: "535",
+        },
+        {
+          name: "#18",
+          x: "1720",
+          y: "570",
+          type: 3,
+        },
+        {
+          name: "#17",
+          x: "1660",
+          y: "640",
+          type: 3,
+        },
+        {
+          name: "#19",
+          x: "1655",
+          y: "500",
+          type: 3,
+        },
+        {
+          name: "#20",
+          x: "1505",
+          y: "415",
+          type: 3,
+        },
+        {
+          name: "#16",
+          x: "1105",
+          y: "550",
+          type: 3,
+        },
+        {
+          name: "#15",
+          x: "1090",
+          y: "515",
+          type: 3,
+        },
+        {
+          name: "#14",
+          x: "1020",
+          y: "440",
+          type: 3,
+        },
+        {
+          name: "#12",
+          x: "845",
+          y: "315",
+          type: 3,
+        },
+        {
+          name: "#13",
+          x: "825",
+          y: "395",
+          type: 3,
+        },
+        {
+          name: "#11",
+          x: "760",
+          y: "275",
+          type: 3,
+        },
+        {
+          name: "#10",
+          x: "705",
+          y: "250",
+          type: 3,
+        },
+        {
+          name: "#9",
+          x: "595",
+          y: "200",
+          type: 3,
+        },
+        {
+          name: "#8",
+          x: "550",
+          y: "160",
+          type: 3,
+        },
+        {
+          name: "#7",
+          x: "470",
+          y: "170",
+          type: 3,
+        },
+        {
+          name: "#6",
+          x: "385",
+          y: "170",
+          type: 3,
+        },
+        {
+          name: "#5",
+          x: "360",
+          y: "140",
+          type: 3,
+        },
+        {
+          name: "#4",
+          x: "355",
+          y: "100",
+          type: 3,
+        },
+        {
+          name: "#3",
+          x: "265",
+          y: "90",
+          type: 3,
+        },
+        {
+          name: "#2",
+          x: "205",
+          y: "90",
+          type: 3,
+        },
+        {
+          name: "#1",
+          x: "110",
+          y: "85",
+          type: 3,
+        },
+      ],
+      list: this.windturbineList || [],
+    };
+  },
+  created() {
+    this.$nextTick(() => {
+      this.getData();
+    });
+  },
+  methods: {
+    getData() {
+      this.dataList.forEach((item) => {
+        this.list.forEach((i, num) => {
+          if (item.name == i.wtname) {
+            item["fs"] = i.speed + " ";
+            item["gl"] = i.power + " ";
+            item["type"] = i.status;
+          }
+        });
+      });
+    },
+  },
+};
+</script>
+<style lang="less" scoped>
+.item-label-hover:hover .isshow {
+  display: flex;
+}
+
+.isshow {
+  display: none;
+  color: #ffffff;
+}
+</style>

src/views/stateMonitor/factoryMonitor/windPowerPlant/geomorphologicMap/index.vue

@@ -1,6 +1,10 @@
 <template>
   <headerButton :showType="true" :type="stationType" @renderData="renderData" />
   <div>
+    <testMap
+      :windturbineList="windturbineList"
+      ref="maps"
+    ></testMap>
     <!-- 羊头崖 -->
     <ytyMap
       v-if="project === 'SXJ_KGDL_YTYF01_EG'"
@@ -117,6 +121,7 @@
   </div>
 </template>
 <script>
+import testMap from "./components/test-map.vue";
 import headerButton from "@/views/stateMonitor/factoryMonitor/components/headerButton.vue";
 import gjyMap from "./components/gjy-map.vue";
 import gjyMap2 from "./components/gjy-map2.vue";
@@ -141,6 +146,7 @@ export default {
   name: "geomorphologicMap",
   components: {
     headerButton,
+    testMap,
     mljMap,
     zkyqMap,
     pldhbMap,

src/views/stateMonitor/factoryMonitor/windPowerPlant/index.vue

@@ -26,7 +26,6 @@
         methods: {},
         computed: {
             routerData() {
-                debugger
                 let currData = [];
                 // let stateRoutes = this.$store.state.routes.routes;
                 let stateRoutes = this.$router.options.routes

src/views/stateMonitor/factoryMonitor/windPowerPlant/matrixMonitor/dataJson.json

@@ -0,0 +1,126 @@
+{
+    "code": 0,
+    "sourceMapData": {
+        "jrts": 25,
+        "djts": 21,
+        "bwts": 15,
+        "gzts": 38,
+        "jxts": 15,
+        "xdts": 17,
+        "slts": 29,
+        "lxts": 38,
+
+        "dfts": 25,
+        "zcyx": 25,
+        "gztj": 25,
+        "jxtj": 25,
+        "xdjcl": 25,
+        "dwsl": 25,
+        "lx": 25,
+
+        "sdtj": 25,
+        "jclyx": 25,
+        "gzsl": 25,
+        "jxsl": 25,
+        "xdtj": 25,
+        "hjsl": 25,
+        "wz": 25,
+
+        "speed": 20,
+        "ycgl": 1256,
+        "bzgl": 2541,
+        "sjgl": 2054
+    },
+    "showMatrixListdata": [
+        {
+            "wpname": "测试1",
+            "czlx": "-1",
+            "jrts": 25,
+            "djts": 21,
+            "bwts": 15,
+            "gzts": 38,
+            "jxts": 15,
+            "xdts": 17,
+            "slts": 29,
+            "lxts": 38,
+            "spped": 14,
+            "ycgl": 21556,
+            "bzgl": 1254,
+            "llgl": 125445,
+            "sjgl": 1254,
+            "lineVos": []
+        },
+        {
+            "wpname": "测试2",
+            "czlx": "-1",
+            "jrts": 25,
+            "djts": 21,
+            "bwts": 15,
+            "gzts": 38,
+            "jxts": 15,
+            "xdts": 17,
+            "slts": 29,
+            "lxts": 38,
+            "spped": 14,
+            "ycgl": 21556,
+            "bzgl": 1254,
+            "llgl": 125445,
+            "sjgl": 1254,
+            "lineVos": []
+        },
+        {
+            "wpname": "测试3",
+            "czlx": "-1",
+            "jrts": 25,
+            "djts": 21,
+            "bwts": 15,
+            "gzts": 38,
+            "jxts": 15,
+            "xdts": 17,
+            "slts": 29,
+            "lxts": 38,
+            "spped": 14,
+            "ycgl": 21556,
+            "bzgl": 1254,
+            "llgl": 125445,
+            "sjgl": 1254,
+            "lineVos": []
+        },
+        {
+            "wpname": "测试4",
+            "czlx": "-1",
+            "jrts": 25,
+            "djts": 21,
+            "bwts": 15,
+            "gzts": 38,
+            "jxts": 15,
+            "xdts": 17,
+            "slts": 29,
+            "lxts": 38,
+            "spped": 14,
+            "ycgl": 21556,
+            "bzgl": 1254,
+            "llgl": 125445,
+            "sjgl": 1254,
+            "lineVos": []
+        },
+        {
+            "wpname": "测试5",
+            "czlx": "-1",
+            "jrts": 25,
+            "djts": 21,
+            "bwts": 15,
+            "gzts": 38,
+            "jxts": 15,
+            "xdts": 17,
+            "slts": 29,
+            "lxts": 38,
+            "spped": 14,
+            "ycgl": 21556,
+            "bzgl": 1254,
+            "llgl": 125445,
+            "sjgl": 1254,
+            "lineVos": []
+        }
+    ]
+}

src/views/stateMonitor/factoryMonitor/windPowerPlant/matrixMonitor/index.vue

@@ -94,6 +94,7 @@
       </div>
       <div
         class="unpaid"
+         :data-type="$store.state.moreSty"
         @click="handleStationCurveClick(singleMatrixInfo.wpid)"
       >
         <div class="unpaid-list">
@@ -174,7 +175,7 @@
           v-for="(mes, index) in value?.lineVos"
           :key="index"
         >
-          <div class="line-namebox">
+          <div class="line-namebox"  :data-type="$store.state.moreSty">
             <div class="line-name">
               {{ mes.name }}
             </div>
@@ -317,6 +318,8 @@ import windDetail from "@/components/windDetail/index";
 import api from "@/api/cockpit/matrix/index.js";
 
 import { deepClone, findUpColor } from "@/utills/func.js";
+
+import dataJson from "./dataJson.json"
 export default {
   name: "matrixMatrix",
   components: {
@@ -689,9 +692,29 @@ export default {
 
   created() {},
   mounted() {
-    this.timer = setInterval(() => {
-      this.getSingleMatrix();
-    }, 5000);
+    // this.timer = setInterval(() => {
+    //   this.getSingleMatrix();
+    // }, 5000);
+    this.singleMatrixInfo = dataJson.sourceMapData
+    this.showMatrixList = dataJson.showMatrixListdata
+    dataJson.showMatrixListdata.forEach((it, index) =>{
+        it.lineVos = new Array(5).fill({
+            name: "测试数据1",
+            wtDataList: new Array(13).fill({
+                wtname: it.wpname,
+                status: index === 4 ? 6 : index,
+                czlx: -1,
+                wtid: 5,
+                power: 2514,
+                speed: 13,
+                current: 251,
+                transfer: 21,
+                voltage: 25,
+                rate: 395,
+                ssqfzt: 1
+            })
+        })
+    })
   },
   unmounted() {
     clearInterval(this.timer);
@@ -1484,13 +1507,20 @@ p {
       }
     }
 
+    .unpaid[data-type~="greenSty"] {
+        background: #081410;
+        border: 1px solid #083d22;
+    }
+    .unpaid[data-type~="blueSty"] {
+        background: #080e14;
+        border: 1px solid #08283d;
+    }
+
     .unpaid {
       display: flex;
       flex-direction: row;
       align-items: center;
       height: 65px;
-      background: #081410;
-      border: 1px solid #083d22;
       position: relative;
       flex: 1 0 auto;
       margin-left: 10px;
@@ -1584,6 +1614,29 @@ p {
       display: flex;
       align-items: center;
       margin-top: 5px;
+
+        .line-namebox[data-type~="greenSty"] {
+            border-image: linear-gradient(
+                321deg,
+                rgba(5, 187, 76, 0.2),
+                rgba(5, 187, 76, 0.1),
+                rgba(67, 81, 107, 0.1),
+                rgba(67, 81, 107, 0),
+                rgba(5, 187, 76, 0.5)
+            )
+            1 1;
+        }
+        .line-namebox[data-type~="blueSty"] {
+            border-image: linear-gradient(
+                321deg,
+                rgba(5, 99, 187, 0.2),
+                rgba(5, 120, 187, 0.1),
+                rgba(67, 81, 107, 0.1),
+                rgba(67, 81, 107, 0),
+                rgba(5, 114, 187, 0.5)
+            )
+            1 1;     
+        }
       .line-namebox {
         padding: 0 10px;
         min-height: 66px;
@@ -1595,15 +1648,6 @@ p {
         align-items: center;
         border-radius: 5px;
         border: 1px solid;
-        border-image: linear-gradient(
-            321deg,
-            rgba(5, 187, 76, 0.2),
-            rgba(5, 187, 76, 0.1),
-            rgba(67, 81, 107, 0.1),
-            rgba(67, 81, 107, 0),
-            rgba(5, 187, 76, 0.5)
-          )
-          1 1;
       }
 
       .line-list {

src/views/stateMonitor/factoryMonitor/windPowerPlant/millivolt/index.vue

@@ -6,6 +6,8 @@
   />
   <div style="height: calc(100% - 57px)">
     <!-- 风场 *************** -->
+    <!-- 测试   用于展示 -->
+    <TEST class="booster-station-body"/>
     <!-- 高家堰 -->
     <GJY class="booster-station-body" v-if="wpId === 'SXJ_KGDL_GJY_FDC_STA'" />
     <!-- 败虎堡 -->
@@ -118,7 +120,8 @@
 import headerButton from "@/views/stateMonitor/factoryMonitor/components/headerButton.vue";
 // import sbsAlarm from "@/components/sbsAlarm/index.vue";
 import { ElMessageBox } from "element-plus";
-// 风场
+// 风场TEST
+import TEST from "./components/TEST.vue";
 import GJY from "./components/GJY.vue";
 import BHB from "./components/BHB.vue";
 import BHBSQ from "./components/BHBSQ.vue";
@@ -140,6 +143,7 @@ export default {
   components: {
     headerButton,
     // sbsAlarm,
+    TEST,
     GJY,
     BHB,
     BHBSQ,

src/views/stateMonitor/factoryMonitor/windPowerPlant/windPower/components/thermometer.vue

@@ -157,13 +157,13 @@ export default {
                         lineHeight: 50,
                         fontSize: 16,
                         fontFamily: "digifacewide",
-                        color: "#05bb4c",
+                        color: this.$store.state.moreSty === "greenSty" ? "#057131" : "#4b55ae",
                       },
                       unit: {
                         fontFamily: "微软雅黑",
                         fontSize: 16,
                         lineHeight: 50,
-                        color: "#05bb4c",
+                        color: this.$store.state.moreSty === "greenSty" ? "#057131" : "#4b55ae",
                       },
                     },
                   },
@@ -174,7 +174,7 @@ export default {
             barWidth: 7,
             itemStyle: {
               normal: {
-                color: "#057131",
+                color: this.$store.state.moreSty === "greenSty" ? "#057131" : "#4b55ae",
                 borderRadius: [5, 5, 0, 0],
               },
             },
@@ -219,7 +219,7 @@ export default {
             symbolSize: 18,
             itemStyle: {
               normal: {
-                color: "#057131",
+                color: this.$store.state.moreSty === "greenSty" ? "#057131" : "#4b55ae",
                 opacity: 1,
               },
             },

src/views/stateMonitor/factoryMonitor/windPowerPlant/windPower/components/wave.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="wave"></div>
+  <div class="wave" :data-type="$store.state.moreSty"></div>
 </template>
 
 <script>
@@ -67,9 +67,10 @@ export default {
       const material = new THREE.ShaderMaterial({
         uniforms: {
           color: {
-            value: new THREE.Color(
-              this.$store.state.themeName === "dark" ? 0x05bb4c : 0x36348e
-            ),
+            // value: new THREE.Color(
+            //   this.$store.state.moreSty === "greenSty" ? 0x05bb4c : 0x1a93cf
+            // ),
+            value: this.$store.state.moreSty === "greenSty" ? new THREE.Color(0x05bb4c) : new THREE.Color(0x1a93cf)
           },
         },
         vertexShader: `attribute float scale;
@@ -178,7 +179,7 @@ export default {
   },
 
   watch: {
-    "$store.state.themeName"() {
+    "$store.state.moreSty"() {
       $(".wave").empty();
       renderer.setAnimationLoop(null);
       this.init();
@@ -188,13 +189,18 @@ export default {
 </script>
 
 <style lang="less">
+.wave[data-type~="greenSty"] {
+    z-index: -1;
+}
+.wave[data-type~="blueSty"] {
+    z-index: 0;
+}
 .wave {
   position: absolute;
   left: 42px;
   top: 0;
   width: 94%;
   height: 60%;
-  z-index: -1;
   margin-top: 150px;
   overflow: hidden;
 }

src/views/stateMonitor/factoryMonitor/windPowerPlant/windPower/dataJson.json

@@ -0,0 +1,342 @@
+{
+    "code": 0,
+    "Powertrend": {
+        "units": ["(万KWh)", ""],
+        "value": [
+          {
+            "title": "预测功率",
+            "smooth": true,
+            "value": [
+                {
+                    "dateTime": "00:00",
+                    "value": 0.5
+                },
+                {
+                    "dateTime": "01:00",
+                    "value": 2.2
+                },
+                {
+                    "dateTime": "02:00",
+                    "value": 0.8
+                },
+                {
+                    "dateTime": "03:00",
+                    "value": 2.2
+                },
+                {
+                    "dateTime": "04:00",
+                    "value": 1.5
+                },
+                {
+                    "dateTime": "05:00",
+                    "value": 1.8
+                },
+                {
+                    "dateTime": "06:00",
+                    "value": 1.7
+                },
+                {
+                    "dateTime": "07:00",
+                    "value": 2.2
+                },
+                {
+                    "dateTime": "08:00",
+                    "value": 1.5
+                },
+                {
+                    "dateTime": "09:00",
+                    "value": 1.8
+                },
+                {
+                    "dateTime": "10:00",
+                    "value": 1.7
+                },
+                {
+                    "dateTime": "11:00",
+                    "value": 2.2
+                },
+                {
+                    "dateTime": "12:00",
+                    "value": 1.5
+                },
+                {
+                    "dateTime": "13:00",
+                    "value": 1.8
+                },
+                {
+                    "dateTime": "14:00",
+                    "value": 1.7
+                },
+                {
+                    "dateTime": "15:00",
+                    "value": 1.5
+                },
+                {
+                    "dateTime": "16:00",
+                    "value": 1.8
+                },
+                {
+                    "dateTime": "17:00",
+                    "value": 1.7
+                },
+                {
+                    "dateTime": "18:00",
+                    "value": 2.2
+                },
+                {
+                    "dateTime": "19:00",
+                    "value": 1.5
+                },
+                {
+                    "dateTime": "20:00",
+                    "value": 1.8
+                },
+                {
+                    "dateTime": "21:00",
+                    "value": 1.7
+                },
+                {
+                    "dateTime": "22:00",
+                    "value": 1.8
+                },
+                {
+                    "dateTime": "23:00",
+                    "value": 1.7
+                }
+            ]
+          },
+          {
+            "title": "理论功率",
+            "smooth": true,
+            "value": [
+                {
+                    "dateTime": "00:00",
+                    "value": 0.8
+                },
+                {
+                    "dateTime": "01:00",
+                    "value": 2.2
+                },
+                {
+                    "dateTime": "02:00",
+                    "value": 0.9
+                },
+                {
+                    "dateTime": "03:00",
+                    "value": 2.2
+                },
+                {
+                    "dateTime": "04:00",
+                    "value": 1.7
+                },
+                {
+                    "dateTime": "05:00",
+                    "value": 1.8
+                },
+                {
+                    "dateTime": "06:00",
+                    "value": 1.2
+                },
+                {
+                    "dateTime": "07:00",
+                    "value": 2.8
+                },
+                {
+                    "dateTime": "08:00",
+                    "value": 1.4
+                },
+                {
+                    "dateTime": "09:00",
+                    "value": 1.9
+                },
+                {
+                    "dateTime": "10:00",
+                    "value": 1.7
+                },
+                {
+                    "dateTime": "11:00",
+                    "value": 2.2
+                },
+                {
+                    "dateTime": "12:00",
+                    "value": 1.6
+                },
+                {
+                    "dateTime": "13:00",
+                    "value": 1.8
+                },
+                {
+                    "dateTime": "14:00",
+                    "value": 1.7
+                },
+                {
+                    "dateTime": "15:00",
+                    "value": 1.8
+                },
+                {
+                    "dateTime": "16:00",
+                    "value": 1.8
+                },
+                {
+                    "dateTime": "17:00",
+                    "value": 1.7
+                },
+                {
+                    "dateTime": "18:00",
+                    "value": 2.9
+                },
+                {
+                    "dateTime": "19:00",
+                    "value": 1.5
+                },
+                {
+                    "dateTime": "20:00",
+                    "value": 1.8
+                },
+                {
+                    "dateTime": "21:00",
+                    "value": 1.9
+                },
+                {
+                    "dateTime": "22:00",
+                    "value": 1.8
+                },
+                {
+                    "dateTime": "23:00",
+                    "value": 1.2
+                }
+            ]
+          },
+          {
+            "title": "实际功率",
+            "smooth": true,
+            "value": [
+                {
+                    "dateTime": "00:00",
+                    "value": 0.5
+                },
+                {
+                    "dateTime": "01:00",
+                    "value": 2.2
+                },
+                {
+                    "dateTime": "02:00",
+                    "value": 0.8
+                },
+                {
+                    "dateTime": "03:00",
+                    "value": 2.2
+                },
+                {
+                    "dateTime": "04:00",
+                    "value": 1.5
+                },
+                {
+                    "dateTime": "05:00",
+                    "value": 1.8
+                },
+                {
+                    "dateTime": "06:00",
+                    "value": 1.2
+                },
+                {
+                    "dateTime": "07:00",
+                    "value": 1.2
+                },
+                {
+                    "dateTime": "08:00",
+                    "value": 2.5
+                },
+                {
+                    "dateTime": "09:00",
+                    "value": 1.8
+                },
+                {
+                    "dateTime": "10:00",
+                    "value": 2.7
+                },
+                {
+                    "dateTime": "11:00",
+                    "value": 2.2
+                },
+                {
+                    "dateTime": "12:00",
+                    "value": 1.5
+                },
+                {
+                    "dateTime": "13:00",
+                    "value": 1.8
+                },
+                {
+                    "dateTime": "14:00",
+                    "value": 2.7
+                },
+                {
+                    "dateTime": "15:00",
+                    "value": 1.5
+                },
+                {
+                    "dateTime": "16:00",
+                    "value": 1.8
+                },
+                {
+                    "dateTime": "17:00",
+                    "value": 1.7
+                },
+                {
+                    "dateTime": "18:00",
+                    "value": 1.2
+                },
+                {
+                    "dateTime": "19:00",
+                    "value": 1.5
+                },
+                {
+                    "dateTime": "20:00",
+                    "value": 2.8
+                },
+                {
+                    "dateTime": "21:00",
+                    "value": 1.7
+                },
+                {
+                    "dateTime": "22:00",
+                    "value": 2.8
+                },
+                {
+                    "dateTime": "23:00",
+                    "value": 1.7
+                }
+            ]
+          }
+        ]
+    },
+    "powerDataHome": [
+        {
+          "title": "空气密度",
+          "value": 200.25,
+          "dialogTitle": "空气密度",
+          "max": 3000,
+          "unit": "kg/m³"
+        },
+        {
+          "title": "压强",
+          "value": 365.21,
+          "dialogTitle": "压强",
+          "max": 3000,
+          "unit": "Pa"
+        }
+    ],
+    "towerInfo": {
+        "wd": 22,
+        "sd": 56.25,
+        "fs70": 25,
+        "fs50": 15,
+        "fs30": 18,
+        "fs10": 26,
+        "fx70": "东南",
+        "fx50": "南",
+        "fx30": "东北",
+        "fx10": "西"
+    }
+}

src/views/stateMonitor/factoryMonitor/windPowerPlant/windPower/index.vue

@@ -19,11 +19,13 @@
         </div>
       </div>
       <div class="wind_pow">
-        <img src="@assets/imgs/windPow1.png" />
+        <img src="@assets/imgs/windPow1.png" v-if="$store.state.moreSty === 'greenSty'" />
+        <img src="@assets/imgs/windPow2.png" v-else />
         <div class="wind_count">
           <div class="wind_fs">
             <div
               :class="item.num ? 'fs' : 'fs_none'"
+               :data-type="$store.state.moreSty"
               v-for="(item, index) in fengSu"
               :key="index"
             >
@@ -36,6 +38,7 @@
           <div class="wind_fx">
             <div
               :class="item.num ? 'fs' : 'fs_none'"
+               :data-type="$store.state.moreSty"
               v-for="(item, index) in fengSx"
               :key="index"
             >
@@ -130,6 +133,7 @@ import WindEchart from "./components/windEchart.vue";
 import Wave from "./components/wave.vue";
 import dayjs from "dayjs";
 import powerReviewHome from "./components/power-review-home.vue";
+import dataJson from "./dataJson.json"
 export default {
   name: "windPower", //风电场站
   components: {
@@ -264,6 +268,9 @@ export default {
       //   this.getCurveValues();
       //   this.getWindPowerDatasBySubStationCode();
     }, 5 * 60 * 1000);
+    this.CurveValues = dataJson.Powertrend.value;
+    this.powerDataHome = dataJson.powerDataHome;
+    this.towerInfo = dataJson.towerInfo;
   },
   methods: {
     renderData(company, stationCode, stationName) {
@@ -638,10 +645,22 @@ img {
     height: 27px;
     margin-bottom: 50px;
   }
+
+    .fs[data-type~="greenSty"] {
+        border: 1px solid #2a682f;
+        .heights {
+            background: #2a682f;
+        }
+    }
+    .fs[data-type~="blueSty"] {
+        border: 1px solid #2a4768;
+        .heights {
+            background: #2a4768;
+        }
+    }
   .fs {
     width: 167px;
     height: 27px;
-    border: 1px solid #2a682f;
     display: flex;
     margin-bottom: 50px;
 
@@ -664,7 +683,6 @@ img {
       width: 85px;
       height: 25px;
       line-height: 25px;
-      background: #2a682f;
       font-size: 14px;
       font-family: SimSun;
       color: #ffffff;