驾驶舱模块顶部地图传参增加弹窗所用参数

src/views/Home/Home.vue

@@ -25,7 +25,7 @@
       </Row>
       </Col>
       <Col :span="12">
-      <Map :wpId="wpId" :day="String(jczbmap.aqts || '---')" :data="fcmap" @mapClick="changeShowType"></Map>
+      <Map :wpId="wpId" :day="String(jczbmap.aqts || '---')" :data="fcmap" :xtData="xtmap" @mapClick="changeShowType"></Map>
       </Col>
       <Col :span="6">
         <Row type="flex">
@@ -504,6 +504,7 @@ export default {
       dialogType: null,
       wpId: "0",
       fcmap:{},
+      xtmap:{},
       dialogShow: false,
       dialogTitle: "",
       dialogData:{},
@@ -660,6 +661,7 @@ export default {
           that.gxkmap = res.data.gxkmap;
           that.mxztmap = res.data.mxztmap;
           that.fcmap = res.data.fcmap;
+          that.xtmap = res.data.xtmap;
           that.tqmap = res.data.tqmap;
 
           that.ForecastPower = [{

src/views/Home/components/map.vue

@@ -83,7 +83,7 @@
     </div>
     <div class="map-img">
       <!-- 宁夏地图总览 -->
-      <SvgMapNX v-if="mapName === 'nx'" :show="showType" :data="sourceMap" @clickLabel="clickLabel"></SvgMapNX>
+      <SvgMapNX v-if="mapName === 'nx'" :show="showType" :data="sourceMap" :xtData="xtMap" @clickLabel="clickLabel"></SvgMapNX>
       <!-- 麻黄山风电场 -->
       <MHSFDC v-if="mapName === 'MHS_FDC'" :data="sourceMap" @clickFj="clickFj"></MHSFDC>
     </div>
@@ -120,6 +120,10 @@ export default {
     data:{
       type:Object,
       default:() => {}
+    },
+    xtData:{
+      type:Object,
+      default:() => {}
     }
   },
 
@@ -127,6 +131,7 @@ export default {
     this.fcId = this.wpId;
     this.safeDay = this.day;
     this.sourceMap = this.data;
+    this.xtMap = this.xtData;
   },
   // 数据
   data() {
@@ -194,6 +199,9 @@ export default {
     },
     data(res){
       this.sourceMap = res;
+    },
+    xtData(res){
+      this.xtMap = res;
     }
   }
 };

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

@@ -257,128 +257,128 @@
                 <g v-show="popup[0]">
                     <!-- +5 (+10+50, +20)+25 -->
                     <use xlink:href="#popup-box-svg" x="290" y="190" />
-                    <text x="300" y="210" fill="#919697" font-size="14">经度</text>
-                    <text x="350" y="210" fill="#05bb4c" font-size="14">37.43</text>
+                    <text x="300" y="210" fill="#919697" font-size="14">经度1</text>
+                    <text x="350" y="210" fill="#05bb4c" font-size="14">{{xtMap.QS_FDC && xtMap.XS_FDC.jd}}</text>
                     <text x="300" y="235" fill="#919697" font-size="14">纬度</text>
-                    <text x="350" y="235" fill="#05bb4c" font-size="14">105.59</text>
+                    <text x="350" y="235" fill="#05bb4c" font-size="14">{{xtMap.QS_FDC && xtMap.XS_FDC.wd}}</text>
                     <text x="300" y="260" fill="#919697" font-size="14">海拔</text>
-                    <text x="350" y="260" fill="#05bb4c" font-size="14">1810</text>
+                    <text x="350" y="260" fill="#05bb4c" font-size="14">{{xtMap.QS_FDC && xtMap.XS_FDC.hb}}</text>
                     <text x="300" y="285" fill="#919697" font-size="14">功率</text>
-                    <text x="350" y="285" fill="#05bb4c" font-size="14">55</text>
+                    <text x="350" y="285" fill="#05bb4c" font-size="14">{{xtMap.QS_FDC && xtMap.XS_FDC.gl}}</text>
                     <text x="300" y="310" fill="#919697" font-size="14">风速</text>
-                    <text x="350" y="310" fill="#05bb4c" font-size="14">2</text>
+                    <text x="350" y="310" fill="#05bb4c" font-size="14">{{xtMap.QS_FDC && xtMap.XS_FDC.ssfs}}</text>
                 </g>
                 <g v-show="popup[1]">
                     <!-- +5 (+10+50, +20)+25 -->
                     <use xlink:href="#popup-box-svg" x="420" y="35" />
-                    <text x="430" y="55" fill="#919697" font-size="14">经度</text>
-                    <text x="480" y="55" fill="#05bb4c" font-size="14">37.43</text>
+                    <text x="430" y="55" fill="#919697" font-size="14">经度2</text>
+                    <text x="480" y="55" fill="#05bb4c" font-size="14">{{xtMap.MCH_GDC && xtMap.MCH_GDC.jd}}</text>
                     <text x="430" y="80" fill="#919697" font-size="14">纬度</text>
-                    <text x="480" y="80" fill="#05bb4c" font-size="14">105.59</text>
+                    <text x="480" y="80" fill="#05bb4c" font-size="14">{{xtMap.MCH_GDC && xtMap.MCH_GDC.wd}}</text>
                     <text x="430" y="105" fill="#919697" font-size="14">海拔</text>
-                    <text x="480" y="105" fill="#05bb4c" font-size="14">1810</text>
+                    <text x="480" y="105" fill="#05bb4c" font-size="14">{{xtMap.MCH_GDC && xtMap.MCH_GDC.hb}}</text>
                     <text x="430" y="130" fill="#919697" font-size="14">功率</text>
-                    <text x="480" y="130" fill="#05bb4c" font-size="14">55</text>
+                    <text x="480" y="130" fill="#05bb4c" font-size="14">{{xtMap.MCH_GDC && xtMap.MCH_GDC.gl}}</text>
                     <text x="430" y="155" fill="#919697" font-size="14">风速</text>
-                    <text x="480" y="155" fill="#05bb4c" font-size="14">2</text>
+                    <text x="480" y="155" fill="#05bb4c" font-size="14">{{xtMap.MCH_GDC && xtMap.MCH_GDC.ssfs}}</text>
                 </g>
                 <g v-show="popup[2]">
                     <!-- +5 (+10+50, +20)+25 -->
                     <use xlink:href="#popup-box-svg" x="430" y="75" />
-                    <text x="440" y="95" fill="#919697" font-size="14">经度</text>
-                    <text x="490" y="95" fill="#05bb4c" font-size="14">37.43</text>
+                    <text x="440" y="95" fill="#919697" font-size="14">经度3</text>
+                    <text x="490" y="95" fill="#05bb4c" font-size="14">{{xtMap.XH_GDC && xtMap.XH_GDC.jd}}</text>
                     <text x="440" y="120" fill="#919697" font-size="14">纬度</text>
-                    <text x="490" y="120" fill="#05bb4c" font-size="14">105.59</text>
+                    <text x="490" y="120" fill="#05bb4c" font-size="14">{{xtMap.XH_GDC && xtMap.XH_GDC.wd}}</text>
                     <text x="440" y="145" fill="#919697" font-size="14">海拔</text>
-                    <text x="490" y="145" fill="#05bb4c" font-size="14">1810</text>
+                    <text x="490" y="145" fill="#05bb4c" font-size="14">{{xtMap.XH_GDC && xtMap.XH_GDC.hb}}</text>
                     <text x="440" y="170" fill="#919697" font-size="14">功率</text>
-                    <text x="490" y="170" fill="#05bb4c" font-size="14">55</text>
+                    <text x="490" y="170" fill="#05bb4c" font-size="14">{{xtMap.XH_GDC && xtMap.XH_GDC.gl}}</text>
                     <text x="440" y="195" fill="#919697" font-size="14">风速</text>
-                    <text x="490" y="195" fill="#05bb4c" font-size="14">2</text>
+                    <text x="490" y="195" fill="#05bb4c" font-size="14">{{xtMap.XH_GDC && xtMap.XH_GDC.ssfs}}</text>
                 </g>
                 <g v-show="popup[3]">
                     <!-- +5 (+10+50, +20)+25 -->
                     <use xlink:href="#popup-box-svg" x="550" y="60" />
-                    <text x="560" y="80" fill="#919697" font-size="14">经度</text>
-                    <text x="610" y="80" fill="#05bb4c" font-size="14">37.43</text>
+                    <text x="560" y="80" fill="#919697" font-size="14">经度4</text>
+                    <text x="610" y="80" fill="#05bb4c" font-size="14">{{xtMap.NSS_FDC && xtMap.NSS_FDC.jd}}</text>
                     <text x="560" y="105" fill="#919697" font-size="14">纬度</text>
-                    <text x="610" y="105" fill="#05bb4c" font-size="14">105.59</text>
+                    <text x="610" y="105" fill="#05bb4c" font-size="14">{{xtMap.NSS_FDC && xtMap.NSS_FDC.wd}}</text>
                     <text x="560" y="130" fill="#919697" font-size="14">海拔</text>
-                    <text x="610" y="130" fill="#05bb4c" font-size="14">1810</text>
+                    <text x="610" y="130" fill="#05bb4c" font-size="14">{{xtMap.NSS_FDC && xtMap.NSS_FDC.hb}}</text>
                     <text x="560" y="155" fill="#919697" font-size="14">功率</text>
-                    <text x="610" y="155" fill="#05bb4c" font-size="14">55</text>
+                    <text x="610" y="155" fill="#05bb4c" font-size="14">{{xtMap.NSS_FDC && xtMap.NSS_FDC.gl}}</text>
                     <text x="560" y="180" fill="#919697" font-size="14">风速</text>
-                    <text x="610" y="180" fill="#05bb4c" font-size="14">2</text>
+                    <text x="610" y="180" fill="#05bb4c" font-size="14">{{xtMap.NSS_FDC && xtMap.NSS_FDC.ssfs}}</text>
                 </g>
                 <g v-show="popup[4]">
                     <!-- +5 (+10+50, +20)+25 -->
                     <use xlink:href="#popup-box-svg" x="480" y="0" />
-                    <text x="490" y="20" fill="#919697" font-size="14">经度</text>
-                    <text x="540" y="20" fill="#05bb4c" font-size="14">37.43</text>
+                    <text x="490" y="20" fill="#919697" font-size="14">经度5</text>
+                    <text x="540" y="20" fill="#05bb4c" font-size="14">{{xtMap.DWK_GDC && xtMap.DWK_GDC.jd}}</text>
                     <text x="490" y="45" fill="#919697" font-size="14">纬度</text>
-                    <text x="540" y="45" fill="#05bb4c" font-size="14">105.59</text>
+                    <text x="540" y="45" fill="#05bb4c" font-size="14">{{xtMap.DWK_GDC && xtMap.DWK_GDC.wd}}</text>
                     <text x="490" y="70" fill="#919697" font-size="14">海拔</text>
-                    <text x="540" y="70" fill="#05bb4c" font-size="14">1810</text>
+                    <text x="540" y="70" fill="#05bb4c" font-size="14">{{xtMap.DWK_GDC && xtMap.DWK_GDC.hb}}</text>
                     <text x="490" y="95" fill="#919697" font-size="14">功率</text>
-                    <text x="540" y="95" fill="#05bb4c" font-size="14">55</text>
+                    <text x="540" y="95" fill="#05bb4c" font-size="14">{{xtMap.DWK_GDC && xtMap.DWK_GDC.gl}}</text>
                     <text x="490" y="120" fill="#919697" font-size="14">风速</text>
-                    <text x="540" y="120" fill="#05bb4c" font-size="14">2</text>
+                    <text x="540" y="120" fill="#05bb4c" font-size="14">{{xtMap.DWK_GDC && xtMap.DWK_GDC.ssfs}}</text>
                 </g>
                 <g v-show="popup[5]">
                     <!-- +5 (+10+50, +20)+25 -->
                     <use xlink:href="#popup-box-svg" x="500" y="25" />
-                    <text x="510" y="45" fill="#919697" font-size="14">经度</text>
-                    <text x="560" y="45" fill="#05bb4c" font-size="14">37.43</text>
+                    <text x="510" y="45" fill="#919697" font-size="14">经度6</text>
+                    <text x="560" y="45" fill="#05bb4c" font-size="14">{{xtMap.PL_GDC && xtMap.PL_GDC.jd}}</text>
                     <text x="510" y="70" fill="#919697" font-size="14">纬度</text>
-                    <text x="560" y="70" fill="#05bb4c" font-size="14">105.59</text>
+                    <text x="560" y="70" fill="#05bb4c" font-size="14">{{xtMap.PL_GDC && xtMap.PL_GDC.wd}}</text>
                     <text x="510" y="95" fill="#919697" font-size="14">海拔</text>
-                    <text x="560" y="95" fill="#05bb4c" font-size="14">1810</text>
+                    <text x="560" y="95" fill="#05bb4c" font-size="14">{{xtMap.PL_GDC && xtMap.PL_GDC.hb}}</text>
                     <text x="510" y="120" fill="#919697" font-size="14">功率</text>
-                    <text x="560" y="120" fill="#05bb4c" font-size="14">55</text>
+                    <text x="560" y="120" fill="#05bb4c" font-size="14">{{xtMap.PL_GDC && xtMap.PL_GDC.gl}}</text>
                     <text x="510" y="145" fill="#919697" font-size="14">风速</text>
-                    <text x="560" y="145" fill="#05bb4c" font-size="14">2</text>
+                    <text x="560" y="145" fill="#05bb4c" font-size="14">{{xtMap.PL_GDC && xtMap.PL_GDC.ssfs}}</text>
                 </g>
                 <g v-show="popup[6]">
                     <!-- +5 (+10+50, +20)+25 -->
                     <use xlink:href="#popup-box-svg" x="520" y="120" />
-                    <text x="530" y="140" fill="#919697" font-size="14">经度</text>
-                    <text x="580" y="140" fill="#05bb4c" font-size="14">37.43</text>
+                    <text x="530" y="140" fill="#919697" font-size="14">经度7</text>
+                    <text x="580" y="140" fill="#05bb4c" font-size="14">{{xtMap.SBQ_FDC && xtMap.SBQ_FDC.jd}}</text>
                     <text x="530" y="165" fill="#919697" font-size="14">纬度</text>
-                    <text x="580" y="165" fill="#05bb4c" font-size="14">105.59</text>
+                    <text x="580" y="165" fill="#05bb4c" font-size="14">{{xtMap.SBQ_FDC && xtMap.SBQ_FDC.wd}}</text>
                     <text x="530" y="190" fill="#919697" font-size="14">海拔</text>
-                    <text x="580" y="190" fill="#05bb4c" font-size="14">1810</text>
+                    <text x="580" y="190" fill="#05bb4c" font-size="14">{{xtMap.SBQ_FDC && xtMap.SBQ_FDC.hb}}</text>
                     <text x="530" y="215" fill="#919697" font-size="14">功率</text>
-                    <text x="580" y="215" fill="#05bb4c" font-size="14">55</text>
+                    <text x="580" y="215" fill="#05bb4c" font-size="14">{{xtMap.SBQ_FDC && xtMap.SBQ_FDC.gl}}</text>
                     <text x="530" y="240" fill="#919697" font-size="14">风速</text>
-                    <text x="580" y="240" fill="#05bb4c" font-size="14">2</text>
+                    <text x="580" y="240" fill="#05bb4c" font-size="14">{{xtMap.SBQ_FDC && xtMap.SBQ_FDC.ssfs}}</text>
                 </g>
                 <g v-show="popup[7]">
                     <!-- +5 (+10+50, +20)+25 -->
                     <use xlink:href="#popup-box-svg" x="530" y="150" />
-                    <text x="540" y="170" fill="#919697" font-size="14">经度</text>
-                    <text x="590" y="170" fill="#05bb4c" font-size="14">37.43</text>
+                    <text x="540" y="170" fill="#919697" font-size="14">经度8</text>
+                    <text x="590" y="170" fill="#05bb4c" font-size="14">{{xtMap.MHS_FDC && xtMap.MHS_FDC.jd}}</text>
                     <text x="540" y="195" fill="#919697" font-size="14">纬度</text>
-                    <text x="590" y="195" fill="#05bb4c" font-size="14">105.59</text>
+                    <text x="590" y="195" fill="#05bb4c" font-size="14">{{xtMap.MHS_FDC && xtMap.MHS_FDC.wd}}</text>
                     <text x="540" y="220" fill="#919697" font-size="14">海拔</text>
-                    <text x="590" y="220" fill="#05bb4c" font-size="14">1810</text>
+                    <text x="590" y="220" fill="#05bb4c" font-size="14">{{xtMap.MHS_FDC && xtMap.MHS_FDC.hb}}</text>
                     <text x="540" y="245" fill="#919697" font-size="14">功率</text>
-                    <text x="590" y="245" fill="#05bb4c" font-size="14">55</text>
+                    <text x="590" y="245" fill="#05bb4c" font-size="14">{{xtMap.MHS_FDC && xtMap.MHS_FDC.gl}}</text>
                     <text x="540" y="270" fill="#919697" font-size="14">风速</text>
-                    <text x="590" y="270" fill="#05bb4c" font-size="14">2</text>
+                    <text x="590" y="270" fill="#05bb4c" font-size="14">{{xtMap.MHS_FDC && xtMap.MHS_FDC.ssfs}}</text>
                 </g>
                 <g v-show="popup[8]">
                     <!-- +5 (+10+50, +20)+25 -->
                     <use xlink:href="#popup-box-svg" x="570" y="175" />
-                    <text x="580" y="195" fill="#919697" font-size="14">经度</text>
-                    <text x="630" y="195" fill="#05bb4c" font-size="14">37.43</text>
+                    <text x="580" y="195" fill="#919697" font-size="14">经度9</text>
+                    <text x="630" y="195" fill="#05bb4c" font-size="14">{{xtMap.QS_FDC && xtMap.QS_FDC.jd}}</text>
                     <text x="580" y="220" fill="#919697" font-size="14">纬度</text>
-                    <text x="630" y="220" fill="#05bb4c" font-size="14">105.59</text>
+                    <text x="630" y="220" fill="#05bb4c" font-size="14">{{xtMap.QS_FDC && xtMap.QS_FDC.wd}}</text>
                     <text x="580" y="245" fill="#919697" font-size="14">海拔</text>
-                    <text x="630" y="245" fill="#05bb4c" font-size="14">1810</text>
+                    <text x="630" y="245" fill="#05bb4c" font-size="14">{{xtMap.QS_FDC && xtMap.QS_FDC.hb}}</text>
                     <text x="580" y="270" fill="#919697" font-size="14">功率</text>
-                    <text x="630" y="270" fill="#05bb4c" font-size="14">55</text>
+                    <text x="630" y="270" fill="#05bb4c" font-size="14">{{xtMap.QS_FDC && xtMap.QS_FDC.gl}}</text>
                     <text x="580" y="295" fill="#919697" font-size="14">风速</text>
-                    <text x="630" y="295" fill="#05bb4c" font-size="14">2</text>
+                    <text x="630" y="295" fill="#05bb4c" font-size="14">{{xtMap.QS_FDC && xtMap.QS_FDC.ssfs}}</text>
                 </g>
             </g>
         </svg>
@@ -400,6 +400,10 @@ export default {
       data:{
         type:Object,
         default:() => {}
+      },
+      xtData:{
+        type:Object,
+        default:() => {}
       }
     },
     // 自定义事件
@@ -412,6 +416,7 @@ export default {
             popup: [false, false, false, false, false, false, false, false, false],
             showType:"",
             sourceMap:{},
+            xtMap:{},
             c1: false,
             c2: false,
             svgWidth: "791px",
@@ -456,6 +461,7 @@ export default {
         this.svgHeight = this.$el.scrollHeight.toFixed(0) + "px";
         this.showType = this.show;
         this.sourceMap = this.data;
+        this.xtMap = this.xtData;
     },
     
     watch:{
@@ -464,6 +470,9 @@ export default {
       },
       data(res){
         this.sourceMap = res;
+      },
+      xtData(res){
+        this.xtMap = res;
       }
     }
 };