驾驶舱模块上传

src/views/About.vue

@@ -8,7 +8,7 @@
 
 <script>
 // import ListBarChart from "../components/chart/bar/list-bar-chart.vue";
-import HealthReport from "@com/other/healthReport";
+import HealthReport from "@com/other/healthReport/index.vue";
 // 导入header.vue文件
 export default {
   data () {

src/views/Home/Home.vue

@@ -25,7 +25,7 @@
       </Row>
       </Col>
       <Col :span="12">
-      <Map></Map>
+      <Map :wpId="wpId" :day="String(jczbmap.aqts || '---')" :data="fcmap" @mapClick="changeShowType"></Map>
       </Col>
       <Col :span="6">
       <Row type="flex">
@@ -143,12 +143,12 @@
         <com-panel>
           <table class="table-card">
             <tr class="">
-              <td class="text gray">mttr</td>
+              <td class="text gray">MTTR</td>
               <td class="value green">{{jczbmap.mttr}}</td>
               <td class="unit gray">小时</td>
             </tr>
             <tr class="">
-              <td class="text gray">mtbf</td>
+              <td class="text gray">MTBF</td>
               <td class="value green">{{jczbmap.mtbf}}</td>
               <td class="unit gray">小时</td>
             </tr>
@@ -168,9 +168,9 @@
               <td class="unit gray gray">%</td>
             </tr>
             <tr class="">
-              <td class="text gray">年等效科利用系数</td>
-              <td class="value green">{{gxkmap.ndxkyss}}</td>
-              <td class="unit gray">%</td>
+              <td class="text gray">{{wpId === "0" ? "节约二氧化碳" : "年等效科利用系数"}}</td>
+              <td class="value green">{{wpId === "0" ? jczbmap.jpeyht : gxkmap.ndxkyss}}</td>
+              <td class="unit gray">{{wpId === "0" ? "万吨" : "%"}}</td>
             </tr>
           </table>
         </com-panel>
@@ -204,9 +204,9 @@
               <td class="unit gray">万kwh</td>
             </tr>
             <tr class="">
-              <td class="text gray">年待机小时</td>
-              <td class="value green">{{gxkmap.ndjxs}}</td>
-              <td class="unit gray">小时</td>
+              <td class="text gray">{{wpId === "0" ? "节约标煤" : "年待机小时"}}</td>
+              <td class="value green">{{wpId === "0" ? jczbmap.jybm : gxkmap.ndjxs}}</td>
+              <td class="unit gray">{{wpId === "0" ? "万吨" : "小时"}}</td>
             </tr>
           </table>
         </com-panel>
@@ -240,9 +240,9 @@
               <td class="unit gray">万kwh</td>
             </tr>
             <tr class="">
-              <td class="text gray">年运行小时</td>
-              <td class="value green">{{gxkmap.nyxxs}}</td>
-              <td class="unit gray">小时</td>
+              <td class="text gray">{{wpId === "0" ? "节约二氧化硫" : "年运行小时"}}</td>
+              <td class="value green">{{wpId === "0" ? jczbmap.jpeyhl : gxkmap.nyxxs}}</td>
+              <td class="unit gray">{{wpId === "0" ? "万吨" : "小时"}}</td>
             </tr>
           </table>
         </com-panel>
@@ -276,9 +276,9 @@
               <td class="unit gray">万kwh</td>
             </tr>
             <tr class="">
-              <td class="text gray">年故障小时</td>
-              <td class="value green">{{gxkmap.ngzxs}}</td>
-              <td class="unit gray">小时</td>
+              <td class="text gray">{{wpId === "0" ? "节约用水" : "年故障小时"}}</td>
+              <td class="value green">{{wpId === "0" ? jczbmap.jys : gxkmap.ngzxs}}</td>
+              <td class="unit gray">{{wpId === "0" ? "万吨" : "小时"}}</td>
             </tr>
           </table>
         </com-panel>
@@ -465,6 +465,8 @@ export default {
       mxztmap: {},
       planData: {},
       powerData: {},
+      wpId: "0",
+      fcmap:{},
       // 预测电量
       ForecastPower: [
         {
@@ -520,9 +522,10 @@ export default {
         method: "POST",
         subUrl: "genreset/findBasicDataInfo",
         data: {
-          id: "MHS_FDC",
+          id: that.wpId,
         },
         success (res) {
+          // console.log(123123,res);
           let glvos = [];
 
           let rdlKey = ["value1", "value2", "value3"];
@@ -613,6 +616,7 @@ export default {
           that.wxssmap = res.data.wxssmap;
           that.gxkmap = res.data.gxkmap;
           that.mxztmap = res.data.mxztmap;
+          that.fcmap = res.data.fcmap;
           that.planData = {
             yfdl: res.data.jczbmap.yfdl,
             nfdl: res.data.jczbmap.nfdl,
@@ -624,6 +628,12 @@ export default {
         },
       });
     },
+
+    // 点击地图展示类型
+    changeShowType(wpId){
+      this.wpId = wpId;
+      this.requestData(false);
+    }
   },
 
   created () {

src/views/Home/components/map.vue

@@ -1,15 +1,15 @@
 <template>
   <div class="map">
     <div class="back"></div>
-    <div class="security-days">
+    <div class="security-days" v-if="fcId === '0'">
       <div class="text">安全天数:</div>
       <div class="num">
-        <span class="font-num">1,945</span>
+        <span class="font-num">{{safeDay}}</span>
         <span class="unit">天</span>
       </div>
     </div>
     <div class="tab-box">
-      <div class="tab-item" v-for="(tab, index) of tabs" :key="index" :class="{ active: activeTab == index }" @click="selectTab(index)">
+      <div class="tab-item" v-for="(tab, index) of tabs" :key="index" :class="{ active: activeTab == index }" @click.stop="selectTab(index, tab.show)">
         <span class="svg-icon svg-icon-sm" :class="activeTab == index ? 'svg-icon-green' : 'svg-icon-write'">
           <SvgIcon :svgid="tab.icon"></SvgIcon>
         </span>
@@ -83,7 +83,7 @@
     </div>
     <div class="map-img">
       <SvgMap v-if="!nxmap"></SvgMap>
-      <SvgMapNX v-if="nxmap" @clickLabel="clickLabel"></SvgMapNX>
+      <SvgMapNX v-if="nxmap" :show="showType" :data="sourceMap" @clickLabel="clickLabel"></SvgMapNX>
     </div>
   </div>
 </template>
@@ -102,34 +102,65 @@ export default {
     SvgMapNX,
     SvgIcon,
   },
+  props:{
+    wpId:{
+      type:String,
+      default:"0"
+    },
+    day:{
+      type:String,
+      default:"---"
+    },
+    data:{
+      type:Object,
+      default:() => {}
+    }
+  },
+
+  mounted(){
+    this.fcId = this.wpId;
+    this.safeDay = this.day;
+    this.sourceMap = this.data;
+  },
   // 数据
   data() {
     return {
+      fcId:"",
+      safeDay:"",
+      showType: "all",
+      sourceMap:{},
       tabs: [
         {
           icon: "svg-all",
           text: "全部",
+          show: "all"
         },
         {
           icon: "svg-wind-site",
           text: "风场",
+          show: "fc"
         },
         {
           icon: "svg-photovoltaic",
           text: "电站",
+          show: "gf"
         },
       ],
       compassIcon: compassIcon,
       activeTab: 0,
       img: require("@assets/map/map-nx.png"),
       nxSvgFile: require("@assets/map/map-nx.svg"),
-      nxmap: false,
+      nxmap: true,
     };
   },
   // 函数
   methods: {
-    selectTab: function(index) {
+    selectTab(index, showType) {
       this.activeTab = index;
+      this.showType = showType;
+      let wpId = (showType === "all" ? "0" : showType === "fc" ? "-1" : "-2");
+      this.safeDay = "---";
+      this.$emit("mapClick", wpId);
     },
     backMap: function() {
       this.nxmap = true;
@@ -138,25 +169,17 @@ export default {
       this.nxmap = false;
     },
   },
-  // 生命周期钩子
-  beforeCreate() {
-    // 创建前
-  },
-  created() {
-    // 创建后
-  },
-  beforeMount() {
-    // 渲染前
-  },
-  mounted() {
-    // 渲染后
-  },
-  beforeUpdate() {
-    // 数据更新前
-  },
-  updated() {
-    // 数据更新后
-  },
+  watch:{
+    wpId(res){
+      this.fcId = res;
+    },
+    day(res){
+      this.safeDay = res;
+    },
+    data(res){
+      this.sourceMap = res;
+    }
+  }
 };
 </script>
 

src/views/Home/components/map/svg-map-nx.vue

@@ -70,7 +70,7 @@
                 transform="matrix(1 0 0 1 -113 60.6679)"
             ></image>
 
-            <g>
+            <g v-if="showType === 'all' || showType === 'fc'">
                 <use xlink:href="#nx-map-line-1" x="150" y="195" />
                 <use xlink:href="#nx-map-circle-1" x="150" y="195" />
                 <!-- +25 -5 -->
@@ -83,14 +83,14 @@
                     fill="#000000"
                     opacity="0.8"
                     class="item-label"
-                    @click="clickLabel"
+                    @click.stop="clickLabel"
                 />
                 <!-- +5 +12| -->
-                <text x="180" y="207" fill="#919697" font-size="14">光伏</text>
+                <text x="180" y="207" fill="#919697" font-size="14">香山</text>
                 <!-- +70 0 -->
-                <text x="245" y="207" fill="#05bb4c" font-size="14">126台</text>
+                <text x="245" y="207" fill="#05bb4c" font-size="14">{{sourceMap.XS_FDC_zjts}}台</text>
             </g>
-            <g>
+            <g v-if="showType === 'all' || showType === 'gf'">
                 <use xlink:href="#nx-map-line-1" x="280" y="40" />
                 <use xlink:href="#nx-map-circle-1" x="280" y="40" />
                 <!-- +25 -5 -->
@@ -103,14 +103,14 @@
                     fill="#000000"
                     opacity="0.8"
                     class="item-label"
-                    @click="clickLabel"
+                    @click.stop="clickLabel"
                 />
                 <!-- +5 +12| -->
-                <text x="310" y="52" fill="#919697" font-size="14">风场</text>
+                <text x="310" y="52" fill="#919697" font-size="14">马场湖</text>
                 <!-- +70 0 -->
-                <text x="375" y="52" fill="#05bb4c" font-size="14">66MW</text>
+                <text x="375" y="52" fill="#05bb4c" font-size="14">{{sourceMap.MCH_GDC_zjts}}台</text>
             </g>
-            <g>
+            <g v-if="showType === 'all' || showType === 'gf'">
                 <use xlink:href="#nx-map-line-1" x="290" y="80" />
                 <use xlink:href="#nx-map-circle-1" x="290" y="80" />
                 <!-- +25 -5 -->
@@ -123,14 +123,14 @@
                     fill="#000000"
                     opacity="0.8"
                     class="item-label"
-                    @click="clickLabel"
+                    @click.stop="clickLabel"
                 />
                 <!-- +5 +12| -->
-                <text x="320" y="92" fill="#919697" font-size="14">风场</text>
+                <text x="320" y="92" fill="#919697" font-size="14">宣和</text>
                 <!-- +70 0 -->
-                <text x="385" y="92" fill="#05bb4c" font-size="14">66MW</text>
+                <text x="385" y="92" fill="#05bb4c" font-size="14">{{sourceMap.XH_GDC_zjts}}台</text>
             </g>
-            <g>
+            <g v-if="showType === 'all' || showType === 'fc'">
                 <use xlink:href="#nx-map-line-1" x="410" y="65" />
                 <use xlink:href="#nx-map-circle-1" x="410" y="65" />
                 <!-- +25 -5 -->
@@ -143,14 +143,14 @@
                     fill="#000000"
                     opacity="0.8"
                     class="item-label"
-                    @click="clickLabel"
+                    @click.stop="clickLabel"
                 />
                 <!-- +5 +12| -->
-                <text x="440" y="77" fill="#919697" font-size="14">风场</text>
+                <text x="440" y="77" fill="#919697" font-size="14">牛首山</text>
                 <!-- +70 0 -->
                 <text x="505" y="77" fill="#05bb4c" font-size="14">126台</text>
             </g>
-            <g>
+            <g v-if="showType === 'all' || showType === 'gf'">
                 <use xlink:href="#nx-map-line-1" x="570" y="5" />
                 <use xlink:href="#nx-map-circle-1" x="570" y="5" />
                 <!-- +25 -5 -->
@@ -163,14 +163,14 @@
                     fill="#000000"
                     opacity="0.8"
                     class="item-label"
-                    @click="clickLabel"
+                    @click.stop="clickLabel"
                 />
                 <!-- +5 +12| -->
-                <text x="600" y="17" fill="#919697" font-size="14">光伏</text>
+                <text x="600" y="17" fill="#919697" font-size="14">大武口</text>
                 <!-- +70 0 -->
-                <text x="665" y="17" fill="#05bb4c" font-size="14">66MW</text>
+                <text x="665" y="17" fill="#05bb4c" font-size="14">{{sourceMap.DWK_GDC_zjts}}台</text>
             </g>
-            <g>
+            <g v-if="showType === 'all' || showType === 'gf'">
                 <use xlink:href="#nx-map-line-1" x="590" y="30" />
                 <use xlink:href="#nx-map-circle-1" x="590" y="30" />
                 <!-- +25 -5 -->
@@ -183,14 +183,14 @@
                     fill="#000000"
                     opacity="0.8"
                     class="item-label"
-                    @click="clickLabel"
+                    @click.stop="clickLabel"
                 />
                 <!-- +5 +12| -->
-                <text x="620" y="42" fill="#919697" font-size="14">光伏</text>
+                <text x="620" y="42" fill="#919697" font-size="14">平罗</text>
                 <!-- +70 0 -->
-                <text x="685" y="42" fill="#05bb4c" font-size="14">66MW</text>
+                <text x="685" y="42" fill="#05bb4c" font-size="14">{{sourceMap.PL_GDC_zjts}}台</text>
             </g>
-            <g>
+            <g v-if="showType === 'all' || showType === 'fc'">
                 <use xlink:href="#nx-map-line-1" x="380" y="125" />
                 <use xlink:href="#nx-map-circle-1" x="380" y="125" />
                 <!-- +25 -5 -->
@@ -203,14 +203,14 @@
                     fill="#000000"
                     opacity="0.8"
                     class="item-label"
-                    @click="clickLabel"
+                    @click.stop="clickLabel"
                 />
                 <!-- +5 +12| -->
-                <text x="410" y="137" fill="#919697" font-size="14">风场</text>
+                <text x="410" y="137" fill="#919697" font-size="14">石板泉</text>
                 <!-- +70 0 -->
-                <text x="475" y="137" fill="#05bb4c" font-size="14">126台</text>
+                <text x="475" y="137" fill="#05bb4c" font-size="14">{{sourceMap.SBQ_FDC_zjts}}台</text>
             </g>
-            <g>
+            <g v-if="showType === 'all' || showType === 'fc'">
                 <use xlink:href="#nx-map-line-1" x="390" y="155" />
                 <use xlink:href="#nx-map-circle-1" x="390" y="155" />
                 <!-- +25 -5 -->
@@ -223,14 +223,14 @@
                     fill="#000000"
                     opacity="0.8"
                     class="item-label"
-                    @click="clickLabel"
+                    @click.stop="clickLabel"
                 />
                 <!-- +5 +12| -->
-                <text x="420" y="167" fill="#919697" font-size="14">风场</text>
+                <text x="420" y="167" fill="#919697" font-size="14">麻黄山</text>
                 <!-- +70 0 -->
-                <text x="485" y="167" fill="#05bb4c" font-size="14">126台</text>
+                <text x="485" y="167" fill="#05bb4c" font-size="14">{{sourceMap.MHS_FDC_zjts}}台</text>
             </g>
-            <g>
+            <g v-if="showType === 'all' || showType === 'fc'">
                 <use xlink:href="#nx-map-line-1" x="430" y="180" />
                 <use xlink:href="#nx-map-circle-1" x="430" y="180" />
                 <!-- +25 -5 -->
@@ -243,12 +243,12 @@
                     fill="#000000"
                     opacity="0.8"
                     class="item-label"
-                    @click="clickLabel"
+                    @click.stop="clickLabel"
                 />
                 <!-- +5 +12| -->
-                <text x="460" y="192" fill="#919697" font-size="14">光伏</text>
+                <text x="460" y="192" fill="#919697" font-size="14">青山</text>
                 <!-- +70 0 -->
-                <text x="525" y="192" fill="#05bb4c" font-size="14">126台</text>
+                <text x="525" y="192" fill="#05bb4c" font-size="14">{{sourceMap.QS_FDC_zjts}}台</text>
             </g>
         </svg>
     </div>
@@ -261,7 +261,16 @@ export default {
     // 使用组件
     components: {},
     // 传入参数
-    props: {},
+    props: {
+      show:{
+        type:String,
+        default:"all"
+      },
+      data:{
+        type:Object,
+        default:() => {}
+      }
+    },
     // 自定义事件
     emits: {
         clickLabel: null,
@@ -269,6 +278,8 @@ export default {
     // 数据
     data() {
         return {
+            showType:"",
+            sourceMap:{},
             c1: false,
             c2: false,
         };
@@ -293,18 +304,20 @@ export default {
             }, 500);
         }, 2000);
     },
-    beforeMount() {
-        // 渲染前
-    },
+    
     mounted() {
-        // 渲染后
-    },
-    beforeUpdate() {
-        // 数据更新前
-    },
-    updated() {
-        // 数据更新后
+        this.showType = this.show;
+        this.sourceMap = this.data;
     },
+    
+    watch:{
+      show(res){
+        this.showType = res;
+      },
+      data(res){
+        this.sourceMap = res;
+      }
+    }
 };
 </script>
 

src/views/LightMatrix2/LightMatrix2.vue

@@ -54,7 +54,7 @@
                 <div class="tag">{{ cItem.wtnum }}</div>
               </div>
               <div class="card-right">
-                <div class="num">{{ cItem.gl }}&nbsp;Kw</div>
+                <div class="num">{{ cItem.gl }}&nbsp;kw</div>
                 <div class="num">{{ cItem.fs }}&nbsp;m/s</div>
               </div>
             </div>