Merge branch 'jzl'

zh-baseversion-web/src/components/bigWindow/Cz.vue

 <!--
  * @Author: your name
  * @Date: 2022-01-26 20:07:52
- * @LastEditTime: 2022-03-23 15:19:40
- * @LastEditors: Please set LastEditors
+ * @LastEditTime: 2024-07-25 17:39:36
+ * @LastEditors: 纪泽龙 jizelong@qq.com
  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 
  * @FilePath: /test/hello-world/src/views/components/deviceA.vue
@@ -16,15 +16,17 @@
     </div>
     <div class="close" @click="close">
       <!-- <img src="@/assets/mapImages/closeBtn.png" alt="" /> -->
-      <i class="el-icon-close" style="font-size:20px;color:#5dfefe;"></i>
+      <i class="el-icon-close" style="font-size: 20px; color: #5dfefe"></i>
     </div>
-    <p style="background-image: linear-gradient(to right, #5dfefe, #071738); width:100%;height:1px;"></p>
+    <div class="line"></div>
     <div>
       <div class="top flex">
         <div class="top-left">
           <div class="group">
             <div class="left">所属公司：</div>
-          <div class="right zzz">{{ companyType[deviceData.companyType] }}</div>
+            <div class="right zzz">
+              {{ companyType[deviceData.companyType] }}
+            </div>
           </div>
 
           <div class="group">
@@ -64,11 +66,11 @@
             v-if="deviceData.pictureAddress"
             style="width: 80px; height: 50px"
             :src="deviceData.pictureAddress"
-          :preview-src-list="[deviceData.pictureAddress ]"
+            :preview-src-list="[deviceData.pictureAddress]"
             :z-index="999999"
           >
           </el-image>
-        <div class="imgtext" v-else>暂无图片</div>
+          <div class="imgtext" v-else>无</div>
         </div>
       </div>
 
@@ -114,13 +116,27 @@
       </div>
     </div>
 
-    <div style="width:100%;display: flex;" v-if="list.length > 0">
+    <div style="width: 100%; display: flex" v-if="list.length > 0">
       <div class="btn">
         <div>感知设备</div>
       </div>
-      <p style="width:83%;height:10px;background-color: #022346;margin-top: 22px;margin-left: -10px;"></p>
+      <p
+        style="
+          width: 83%;
+          height: 10px;
+          background-color: #022346;
+          margin-top: 22px;
+          margin-left: -10px;
+        "
+      ></p>
       <div @click="btnClick">
-        <img  @click="flag = !flag" src="../../assets/second/box-down.png" :class="{ 'arrowTransform': !flag, 'arrowTransformReturn': flag}" alt="" style="width:30px;height:30px;margin-top: 12px;cursor: pointer;">
+        <img
+          @click="flag = !flag"
+          src="../../assets/second/box-down.png"
+          :class="{ arrowTransform: !flag, arrowTransformReturn: flag }"
+          alt=""
+          style="width: 30px; height: 30px; margin-top: 12px; cursor: pointer"
+        />
       </div>
     </div>
     <OtherCenter
@@ -137,9 +153,7 @@
 </template>
 
 <script>
-import {
-  getTcqDevice,
-} from "@/api/bigWindow/getDevice";
+import { getTcqDevice } from "@/api/bigWindow/getDevice";
 import { companyType, deviceType } from "@/utils/mapClass/config.js";
 import { getCzDevice } from "@/api/bigWindow/getDevice.js";
 import OtherCenter from "@/components/bigWindow/OtherCenter.vue";
@@ -151,7 +165,7 @@ export default {
   data() {
     return {
       flag: true,
-      isShow: true ,
+      isShow: true,
       centerTitle: "",
       companyType,
       deviceType,
@@ -214,10 +228,8 @@ export default {
         this.companyType[item.conpanyId] = item.companyName;
       });
     }
-    this.myHttp()
+    this.myHttp();
     console.log(this.deviceData);
-
-
   },
   methods: {
     // 调压箱，阀门，场站睇下的设备
@@ -241,7 +253,6 @@ export default {
         //   }
         // 传递回去
         return res.code;
-
       });
     },
     close() {
@@ -255,14 +266,21 @@ export default {
         : this.deviceData.stationName;
 
       this.getTcqDevice(
-        { devId: this.deviceData.siteStationId, relationDeviceType: 2,pageNum: 1, pageSize: 5, },
+        {
+          devId: this.deviceData.siteStationId,
+          relationDeviceType: 2,
+          pageNum: 1,
+          pageSize: 5,
+        },
         title
       );
     },
     myHttp() {
       getCzDevice({ deviceId: this.deviceData.siteStationId }).then((res) => {
-        this.list = res.data[0].subordinateEquipmentList.filter(item=>item.numberPressureGauges>0);
-        console.log("resresres222222222",this.list)
+        this.list = res.data[0].subordinateEquipmentList.filter(
+          (item) => item.numberPressureGauges > 0
+        );
+        console.log("resresres222222222", this.list);
       });
     },
   },
@@ -271,8 +289,9 @@ export default {
 
 <style lang="scss" scoped>
 .devicea-wrapper {
-  box-shadow: 0px 0px 10px #54e0ef inset;
-  background-color: #071738;
+  background: rgba(2, 26, 51, 0.9);
+  border: 1px solid #127bd1;
+  box-shadow: inset 0px 0px 10px 0px #164db2;
   padding: 10px;
   position: relative;
   width: 670px;
@@ -283,6 +302,20 @@ export default {
     font-size: 14px;
     line-height: 14px;
     color: #ffffff;
+    padding-left: 5px;
+  }
+  .line {
+    width: 50%;
+    height: 2px;
+    margin-top: 10px;
+    background: linear-gradient(
+      90deg,
+      rgba(29, 33, 41, 0) 0%,
+      #568ef6 38%,
+      #19d1ed 49%,
+      rgba(29, 33, 41, 0) 109%
+    );
+    // border: 2px solid;
   }
   .close {
     position: absolute;
@@ -318,7 +351,7 @@ export default {
           text-align: right;
         }
         .right {
-          flex:2;
+          flex: 2;
         }
       }
     }
@@ -345,7 +378,7 @@ export default {
           text-align: right;
         }
         .right {
-          flex:2;
+          flex: 2;
         }
       }
     }
@@ -362,8 +395,13 @@ export default {
         }
       }
       .imgtext {
-        color: #ffffff;
-        font-size: 10px;
+        color: #0055AE;
+        font-size: 20px;
+        box-sizing: border-box;
+        border: 1px solid #0055ae;
+        display: flex;
+        justify-content: center;
+        align-items: center;
       }
     }
   }
@@ -379,7 +417,7 @@ export default {
   .foot {
     font-size: 14px;
     color: #ffffff;
-    background: url('../../assets/second/box-bg.png');
+    background: url("../../assets/second/box-bg.png");
     background-size: 100% 100%;
     background-repeat: no-repeat;
     padding: 1px;
@@ -415,7 +453,7 @@ export default {
     div {
       font-size: 14px;
       color: #ffffff;
-      background: url('../../assets/second/boxbtn-bg.png');
+      background: url("../../assets/second/boxbtn-bg.png");
       background-size: 100% 100%;
       background-repeat: no-repeat;
       padding: 7px 15px;

zh-baseversion-web/src/components/bigWindow/Device.vue

 <!--
  * @Author: your name
  * @Date: 2022-01-26 20:07:52
- * @LastEditTime: 2022-03-23 15:23:34
- * @LastEditors: Please set LastEditors
+ * @LastEditTime: 2024-07-25 17:13:32
+ * @LastEditors: 纪泽龙 jizelong@qq.com
  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 
  * @FilePath: /test/hello-world/src/views/components/deviceA.vue
@@ -16,15 +16,17 @@
     </div>
     <div class="close" @click="close">
       <!-- <img src="@/assets/mapImages/closeBtn.png" alt="" /> -->
-      <i class="el-icon-close" style="font-size:20px;color:#5dfefe;"></i>
+      <i class="el-icon-close" style="font-size: 20px; color: #49d8ff"></i>
     </div>
-    <p style="background-image: linear-gradient(to right, #5dfefe, #071738); width:100%;height:1px;"></p>
+    <div class="line"></div>
     <div>
       <div class="top flex">
         <div class="top-left">
           <div class="group">
             <div class="left">所属公司：</div>
-            <div class="right zzz">{{ companyType[deviceData.companyType] }}</div>
+            <div class="right zzz">
+              {{ companyType[deviceData.companyType] }}
+            </div>
           </div>
 
           <div class="group">
@@ -64,11 +66,11 @@
             v-if="deviceData.iconUrl"
             style="width: 80px; height: 50px"
             :src="deviceData.iconUrl"
-            :preview-src-list="[deviceData.iconUrl ]"
+            :preview-src-list="[deviceData.iconUrl]"
             :z-index="999999"
           >
           </el-image>
-          <div class="imgtext" v-else>暂无图片</div>
+          <div class="imgtext" v-else>无</div>
         </div>
       </div>
 
@@ -114,13 +116,27 @@
       </div>
     </div>
 
-    <div style="width:100%;display: flex;">
+    <div style="width: 100%; display: flex" v-if="detcetorList.length > 0">
       <div class="btn" v-if="list.length > 0">
         <div>感知设备</div>
       </div>
-      <p style="width:83%;height:10px;background-color: #022346;margin-top: 22px;margin-left: -10px;"></p>
+      <p
+        style="
+          width: 97%;
+          height: 10px;
+          background-color: #022346;
+          margin-top: 22px;
+          margin-left: -10px;
+        "
+      ></p>
       <div @click="btnClick">
-        <img  @click="flag = !flag" src="../../assets/second/box-down.png" :class="{ 'arrowTransform': !flag, 'arrowTransformReturn': flag}" alt="" style="width:30px;height:30px;margin-top: 12px;cursor: pointer;">
+        <img
+          @click="flag = !flag"
+          src="../../assets/second/box-down.png"
+          :class="{ arrowTransform: !flag, arrowTransformReturn: flag }"
+          alt=""
+          style="width: 30px; height: 30px; margin-top: 12px; cursor: pointer"
+        />
       </div>
     </div>
 
@@ -138,20 +154,18 @@
 </template>
 
 <script>
-  import {
-    getTcqDevice,
-  } from "@/api/bigWindow/getDevice";
-  import { companyType, deviceType } from "@/utils/mapClass/config.js";
-  import { getTyxDevice, getFmDevice } from "@/api/bigWindow/getDevice.js";
-  import OtherCenter from "@/components/bigWindow/OtherCenter.vue";
-  export default {
+import { getTcqDevice } from "@/api/bigWindow/getDevice";
+import { companyType, deviceType } from "@/utils/mapClass/config.js";
+import { getTyxDevice, getFmDevice } from "@/api/bigWindow/getDevice.js";
+import OtherCenter from "@/components/bigWindow/OtherCenter.vue";
+export default {
   components: {
     OtherCenter,
   },
   data() {
     return {
       flag: true,
-        isShow: true ,
+      isShow: true,
       centerTitle: "",
       otherCenterShow: false,
       alarmTimer: null,
@@ -241,7 +255,6 @@
         //   }
         // 传递回去
         return res.code;
-
       });
     },
     close() {
@@ -255,7 +268,12 @@
         : this.deviceData.stationName;
 
       this.getTcqDevice(
-          { devId: this.deviceData.deviceId, relationDeviceType: 1,pageNum: 1, pageSize: 5, },
+        {
+          devId: this.deviceData.deviceId,
+          relationDeviceType: 1,
+          pageNum: 1,
+          pageSize: 5,
+        },
         title
       );
     },
@@ -268,7 +286,7 @@
           this.list = res.data[0].subordinateEquipmentList.filter(
             (item) => item.numberPressureGauges > 0
           );
-          console.log("this.list333333333",this.list);
+          console.log("this.list333333333", this.list);
         });
       } else {
         getFmDevice({ deviceId: this.deviceData.deviceId }).then((res) => {
@@ -280,24 +298,16 @@
       }
     },
   },
-  };
+};
 </script>
 
 <style lang="scss" scoped>
-  .arrowTransform {
-    transition: 0s;
-    transform-origin: center;
-    transform: rotateZ(180deg);
-  }
-
-  .arrowTransformReturn {
-    transition: 0s;
-    transform-origin: center;
-    transform: rotateZ(0deg);
-  }
-  .devicea-wrapper {
-    box-shadow: 0px 0px 10px #54e0ef inset;
-    background-color: #071738;
+.devicea-wrapper {
+  // box-shadow: 0px 0px 10px #54e0ef inset;
+  // background-color: #071738;
+  background: rgba(2, 26, 51, 0.9);
+  border: 1px solid #127bd1;
+  box-shadow: inset 0px 0px 10px 0px #164db2;
   padding: 10px;
   position: relative;
   width: 670px;
@@ -308,6 +318,21 @@
     font-size: 14px;
     line-height: 14px;
     color: #ffffff;
+    padding-left:10px;
+  }
+  .line {
+    width: 50%;
+    height: 2px;
+
+    margin-top:10px;
+    background: linear-gradient(
+      90deg,
+      rgba(29, 33, 41, 0) 0%,
+      #568ef6 38%,
+      #19d1ed 49%,
+      rgba(29, 33, 41, 0) 109%
+    );
+    // border: 2px solid;
   }
   .close {
     position: absolute;
@@ -343,7 +368,7 @@
           text-align: right;
         }
         .right {
-            flex:2;
+          flex: 2;
         }
       }
     }
@@ -370,7 +395,7 @@
           text-align: right;
         }
         .right {
-            flex:2;
+          flex: 2;
         }
       }
     }
@@ -378,6 +403,8 @@
       flex: 1;
       display: flex;
       justify-content: center;
+      box-sizing: border-box;
+      padding-top: 5px;
       div {
         width: 50px;
         font-size: 14px;
@@ -387,8 +414,13 @@
         }
       }
        .imgtext {
-          color: #ffffff;
-          font-size: 30px;
+        color: #0055AE;
+        font-size: 20px;
+        box-sizing: border-box;
+        border: 1px solid #0055ae;
+        display: flex;
+        justify-content: center;
+        align-items: center;
       }
     }
   }
@@ -404,7 +436,7 @@
   .foot {
     font-size: 14px;
     color: #ffffff;
-      background: url('../../assets/second/box-bg.png');
+    background: url("../../assets/second/box-bg.png");
     background-size: 100% 100%;
     background-repeat: no-repeat;
     padding: 1px;
@@ -440,7 +472,7 @@
     div {
       font-size: 14px;
       color: #ffffff;
-        background: url('../../assets/second/boxbtn-bg.png');
+      background: url("../../assets/second/boxbtn-bg.png");
       background-size: 100% 100%;
       background-repeat: no-repeat;
       padding: 7px 15px;
@@ -450,5 +482,16 @@
     display: flex;
     justify-content: space-between;
   }
-  }
+}
+.arrowTransform {
+  transition: 0s;
+  transform-origin: center;
+  transform: rotateZ(180deg);
+}
+
+.arrowTransformReturn {
+  transition: 0s;
+  transform-origin: center;
+  transform: rotateZ(0deg);
+}
 </style>

zh-baseversion-web/src/components/bigWindow/Line.vue

 <!--
  * @Author: your name
  * @Date: 2022-01-27 14:25:45
- * @LastEditTime: 2022-02-28 11:35:31
- * @LastEditors: Please set LastEditors
+ * @LastEditTime: 2024-07-25 17:13:31
+ * @LastEditors: 纪泽龙 jizelong@qq.com
  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  * @FilePath: /hello-world/src/views/components/User.vue
 -->
@@ -11,15 +11,16 @@
     <div class="title">{{ companyType[deviceData.companyType] }}</div>
     <div class="close" @click="close">
       <!-- <img src="@/assets/mapImages/closeBtn.png" alt="" /> -->
-      <i class="el-icon-close" style="font-size:20px;color:#5dfefe;"></i>
+      <i class="el-icon-close" style="font-size: 20px; color: #49d8ff"></i>
     </div>
+    <div class="line"></div>
 
     <div class="group flex first">
       <div class="first once left">管道名称：</div>
       <div class="right pipeAddr right zzz">{{ deviceData.pipeName }}</div>
     </div>
 
-    <div class="group flex ">
+    <div class="group flex">
       <div class="left first">管道长度：</div>
       <div class="right zzz">{{ deviceData.pipeLength }}米</div>
       <div class="left">管径：</div>
@@ -48,7 +49,9 @@
 
     <div class="group flex">
       <div class="left first">管道走向：</div>
-      <div class="right zzz" :title="deviceData.pipeTrend">{{ deviceData.pipeTrend }}</div>
+      <div class="right zzz" :title="deviceData.pipeTrend">
+        {{ deviceData.pipeTrend }}
+      </div>
       <div class="left">权属单位：</div>
       <div :title="deviceData.powerCompany" class="right last zzz">
         {{ deviceData.powerCompany }}
@@ -58,7 +61,9 @@
       <div class="first left">建设年代：</div>
       <div class="right">{{ deviceData.buildyear }}</div>
       <div class="left">建设单位：</div>
-      <div class="last right zzz" :title="deviceData.buildCompany">{{ deviceData.buildCompany }}</div>
+      <div class="last right zzz" :title="deviceData.buildCompany">
+        {{ deviceData.buildCompany }}
+      </div>
     </div>
 
     <div class="group flex">
@@ -83,22 +88,21 @@ export default {
       pipePressure,
     };
   },
-  computed:{
-    prodTest(){
-      return this.vueRoot.$store.state.user.systemSetting.prod_test
+  computed: {
+    prodTest() {
+      return this.vueRoot.$store.state.user.systemSetting.prod_test;
     },
-    company(){
+    company() {
       return this.vueRoot.$store.state.bigWindowCompany.company;
-    }
-
     },
-  mounted(){
+  },
+  mounted() {
     // 如果不是测试，而是真数据，就要用帧数据的东西
-    if(this.prodTest !="test"){
-      this.companyType={};
-      this.company.forEach(item=>{
+    if (this.prodTest != "test") {
+      this.companyType = {};
+      this.company.forEach((item) => {
         this.companyType[item.conpanyId] = item.companyName;
-      })
+      });
     }
   },
   methods: {
@@ -111,17 +115,35 @@ export default {
 
 <style lang="scss" scoped>
 .user-wrapper {
-  box-shadow: 0px 0px 10px #54e0ef inset;
-  background-color: #071738;
+  // box-shadow: 0px 0px 10px #54e0ef inset;
+  // background-color: #071738;
+  background: rgba(2, 26, 51, 0.9);
+  border: 1px solid #127bd1;
+  box-shadow: inset 0px 0px 10px 0px #164db2;
   padding: 10px;
   position: relative;
   width: 500px;
   border-radius: 7px;
   .title {
+    padding-left: 5px;
     font-size: 14px;
     line-height: 14px;
     color: #ffffff;
   }
+  .line {
+    width: 50%;
+    height: 2px;
+
+    margin-top: 10px;
+    background: linear-gradient(
+      90deg,
+      rgba(29, 33, 41, 0) 0%,
+      #568ef6 38%,
+      #19d1ed 49%,
+      rgba(29, 33, 41, 0) 109%
+    );
+    // border: 2px solid;
+  }
   .close {
     position: absolute;
     right: 10px;

zh-baseversion-web/src/components/bigWindow/MediumPressureLine.vue

 <!--
  * @Author: your name
  * @Date: 2022-01-27 14:25:45
- * @LastEditTime: 2022-02-28 11:35:31
- * @LastEditors: Please set LastEditors
+ * @LastEditTime: 2024-07-25 17:04:48
+ * @LastEditors: 纪泽龙 jizelong@qq.com
  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  * @FilePath: /hello-world/src/views/components/User.vue
 -->
@@ -11,8 +11,10 @@
     <div class="title">{{ companyType[deviceData.companyType] }}</div>
     <div class="close" @click="close">
       <!-- <img src="@/assets/mapImages/closeBtn.png" alt="" /> -->
-      <i class="el-icon-close" style="font-size:20px;color:#5dfefe;"></i>
+      <i class="el-icon-close" style="font-size: 20px; color: #49d8ff"></i>
+
     </div>
+    <div class="line"></div>
 
     <div class="group flex first">
       <div class="first once left">管道名称：</div>
@@ -36,7 +38,9 @@
         {{ deviceData.pipePressure }}
       </div>
       <div class="left">所属公司：</div>
-      <div class="right last zzz">{{ companyType[deviceData.companyType] }}</div>
+      <div class="right last zzz">
+        {{ companyType[deviceData.companyType] }}
+      </div>
     </div>
 
     <div class="group flex">
@@ -48,7 +52,9 @@
 
     <div class="group flex">
       <div class="left first">管道走向：</div>
-      <div class="right zzz" :title="deviceData.pipeTrend">{{ deviceData.pipeTrend }}</div>
+      <div class="right zzz" :title="deviceData.pipeTrend">
+        {{ deviceData.pipeTrend }}
+      </div>
       <div class="left">权属单位：</div>
       <div :title="deviceData.powerCompany" class="right last zzz">
         {{ deviceData.powerCompany }}
@@ -58,7 +64,9 @@
       <div class="first left">建设年代：</div>
       <div class="right">{{ deviceData.buildyear }}</div>
       <div class="left">建设单位：</div>
-      <div class="last right zzz" :title="deviceData.buildCompany">{{ deviceData.buildCompany }}</div>
+      <div class="last right zzz" :title="deviceData.buildCompany">
+        {{ deviceData.buildCompany }}
+      </div>
     </div>
 
     <div class="group flex">
@@ -84,7 +92,6 @@
       <div class="right last zzz">{{ deviceData.indRegAuthPer }}</div>
     </div>
 
-
     <div class="group flex" v-show="isVisibleMethod">
       <div class="first left">主管负责电话：</div>
       <div class="right zzz">{{ deviceData.indRegAuthPerCon }}</div>
@@ -92,7 +99,6 @@
       <div class="right last zzz">{{ deviceData.keyAreasGasUsage }}</div>
     </div>
 
-
     <div class="group flex" v-show="isVisibleMethod">
       <div class="first left">燃气公司：</div>
       <div class="right zzz">{{ deviceData.affGasCom }}</div>
@@ -123,25 +129,24 @@ export default {
     return {
       companyType,
       pipePressure,
-      isClose: false
+      isClose: false,
     };
   },
-  computed:{
-    prodTest(){
-      return this.vueRoot.$store.state.user.systemSetting.prod_test
+  computed: {
+    prodTest() {
+      return this.vueRoot.$store.state.user.systemSetting.prod_test;
     },
-    company(){
+    company() {
       return this.vueRoot.$store.state.bigWindowCompany.company;
-    }
-
     },
-  mounted(){
+  },
+  mounted() {
     // 如果不是测试，而是真数据，就要用帧数据的东西
-    if(this.prodTest !="test"){
-      this.companyType={};
-      this.company.forEach(item=>{
+    if (this.prodTest != "test") {
+      this.companyType = {};
+      this.company.forEach((item) => {
         this.companyType[item.conpanyId] = item.companyName;
-      })
+      });
     }
   },
   methods: {
@@ -149,17 +154,20 @@ export default {
       // 关闭前先把颜色改回来
       this.mapClass.infowindowClose();
     },
-    isVisibleMethod(){
-      return deviceData.pipePressure == "中压"
-    }
+    isVisibleMethod() {
+      return deviceData.pipePressure == "中压";
+    },
   },
 };
 </script>
 
 <style lang="scss" scoped>
 .user-wrapper {
-  box-shadow: 0px 0px 10px #54e0ef inset;
-  background-color: #071738;
+  // box-shadow: 0px 0px 10px #54e0ef inset;
+  // background-color: #071738;
+  background: rgba(2, 26, 51, 0.9);
+  border: 1px solid #127bd1;
+  box-shadow: inset 0px 0px 10px 0px #164db2;
   padding: 10px;
   position: relative;
   width: 500px;
@@ -168,6 +176,20 @@ export default {
     font-size: 14px;
     line-height: 14px;
     color: #ffffff;
+    padding-left: 5px;
+  }
+  .line {
+    width: 50%;
+    height: 1px;
+    margin-top: 10px;
+    background: linear-gradient(
+      90deg,
+      rgba(29, 33, 41, 0) 0%,
+      #568ef6 38%,
+      #19d1ed 49%,
+      rgba(29, 33, 41, 0) 109%
+    );
+    // border: 2px solid;
   }
   .close {
     position: absolute;

zh-baseversion-web/src/components/bigWindow/PipeColor.vue

 <!--
  * @Author: your name
  * @Date: 2022-01-26 10:52:10
- * @LastEditTime: 2022-02-17 10:11:35
- * @LastEditors: Please set LastEditors
+ * @LastEditTime: 2024-07-25 17:33:10
+ * @LastEditors: 纪泽龙 jizelong@qq.com
  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  * @FilePath: /test/hello-world/src/components/PipeColor.vue
 -->
 <template>
   <div>
     <!-- <div class="pipePressure"> -->
-<!-- 
+    <!-- 
       <div style="float: left;margin-right: 5px;">
         <div class="hasColorBox">
           <img src="../../assets/image/bigtyx.svg" alt="">
@@ -66,7 +66,7 @@ export default {
     downIcon: true;
     return {
       pipeColor,
-        mapStyle:true,
+      mapStyle: true,
     };
   },
   methods: {
@@ -108,32 +108,47 @@ export default {
     }
   }
 }
-.hasColorBox>img{
+.hasColorBox > img {
   width: 14px;
 }
 .mapChange {
   left: 10px;
-  top: 55px;
+  top: 50px;
   color: #fff;
   padding: 5px;
   position: absolute;
   display: flex;
   z-index: 9999;
   div {
-    border: 1px solid #339CC9;
-    padding: 3px 6px;
+    width: 128px;
+    height: 32px;
+    text-align: center;
+    line-height: 3px;
+    background: url("~@/assets/firstimage/btm-item.png") no-repeat bottom center;
+    line-height: 34px;
+    // background-color: #053b6a;
+
+    // border: 1px solid #339CC9;
+    // padding: 3px 6px;
     margin-left: 8px;
-    color: #339CC9;
+    color: #ffffff;
     cursor: pointer;
     font-size: 14px;
-    &.active,
-    &:hover
-    {
-      background-color: #053B6A ;
-      color: #2CD5DB;
+    transition: all 0.2s linear;
+    &.active {
+      background: url("~@/assets/firstimage/btm-item-active.png") no-repeat
+        bottom center;
+      &:hover {
+        background: url("~@/assets/firstimage/btm-item-active.png") no-repeat
+          bottom center;
+        opacity: 1;
+      }
+    }
+    &:hover {
+      background: url("~@/assets/firstimage/btm-item-active.png") no-repeat
+        bottom center;
+      opacity: 0.7;
     }
   }
 }
-
-
 </style>

zh-baseversion-web/src/components/bigWindow/User.vue

 <!--
  * @Author: your name
  * @Date: 2022-01-26 20:07:52
- * @LastEditTime: 2022-03-17 09:05:30
- * @LastEditors: Please set LastEditors
+ * @LastEditTime: 2024-07-25 17:13:33
+ * @LastEditors: 纪泽龙 jizelong@qq.com
  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 
  * @FilePath: /test/hello-world/src/views/components/deviceA.vue
@@ -14,22 +14,23 @@
     </div>
     <div class="close" @click="close">
       <!-- <img src="@/assets/mapImages/closeBtn.png" alt="" /> -->
-      <i class="el-icon-close" style="font-size:20px;color:#5dfefe;"></i>
+      <i class="el-icon-close" style="font-size: 20px; color: #49d8ff"></i>
     </div>
-    <p style="background-image: linear-gradient(to right, #5dfefe, #071738); width:100%;height:1px;"></p>
+    <div class="line"></div>
+
     <div>
       <div class="top flex top-top">
-      <div class="group" style="width:20%">
+        <div class="group" style="width: 20%">
           <div class="left">联系人：</div>
           <div class="right zzz">{{ deviceData.linkman }}</div>
         </div>
-      <div class="group" style="width:30%">
+        <div class="group" style="width: 30%">
           <div class="left">联系电话:</div>
           <div v-unValue class="right zzz">
             {{ deviceData.phone }}
           </div>
         </div>
-      <div class="group" style="width:30%">
+        <div class="group" style="width: 30%">
           <div class="left">联系地址：</div>
           <div :title="deviceData.address" class="right last zzz">
             {{ deviceData.address || "-" }}
@@ -84,14 +85,27 @@
       </template>
     </div>
 
-
-    <div style="width:100%;display: flex;">
+    <div style="width: 100%; display: flex" v-if="detcetorList>0">
       <div class="btn">
         <div>感知设备</div>
       </div>
-      <p style="width:85%;height:10px;background-color: #022346;margin-top: 22px;margin-left: -10px;"></p>
+      <p
+        style="
+          width: 85%;
+          height: 10px;
+          background-color: #022346;
+          margin-top: 22px;
+          margin-left: -10px;
+        "
+      ></p>
       <div @click="btnClick">
-        <img  @click="flag = !flag" src="../../assets/second/box-down.png" :class="{ 'arrowTransform': !flag, 'arrowTransformReturn': flag}" alt="" style="width:30px;height:30px;margin-top: 12px;cursor: pointer;">
+        <img
+          @click="flag = !flag"
+          src="../../assets/second/box-down.png"
+          :class="{ arrowTransform: !flag, arrowTransformReturn: flag }"
+          alt=""
+          style="width: 30px; height: 30px; margin-top: 12px; cursor: pointer"
+        />
       </div>
     </div>
     <UserCenter
@@ -104,14 +118,11 @@
       :pageSize="5"
       v-show="!isShow"
     />
-    
   </div>
 </template>
 
 <script>
-import {
-  getUser,
-} from "@/api/bigWindow/getDevice";
+import { getUser } from "@/api/bigWindow/getDevice";
 import { companyType, deviceType } from "@/utils/mapClass/config.js";
 import { listDetectorInfo } from "@/api/detector/detectorInfo";
 import { detectorUserList } from "@/api/detector/detectorUser";
@@ -124,7 +135,7 @@ export default {
   data() {
     return {
       flag: true,
-      isShow: true ,
+      isShow: true,
       companyType,
       deviceType,
       centerTitle: "",
@@ -181,7 +192,7 @@ export default {
       // this.vueRoot.centerDataFunc(this.deviceData.pressureFlows);
       this.getDetectorInfoList(
         listDetectorInfo,
-        { userId: this.deviceData.userId,pageNum: 1, pageSize: 5, },
+        { userId: this.deviceData.userId, pageNum: 1, pageSize: 5 },
         this.deviceData.nickName
       );
     },
@@ -204,16 +215,17 @@ export default {
   transition: 0s;
   transform-origin: center;
   transform: rotateZ(180deg);
-    }
+}
 
-    .arrowTransformReturn {
+.arrowTransformReturn {
   transition: 0s;
   transform-origin: center;
   transform: rotateZ(0deg);
-    }
+}
 .devicea-wrapper {
-  box-shadow: 0px 0px 10px #54e0ef inset;
-  background-color: #071738;
+    background: rgba(2, 26, 51, 0.9);
+  border: 1px solid #127bd1;
+  box-shadow: inset 0px 0px 10px 0px #164db2;
   padding: 10px;
   position: relative;
   width: 740px;
@@ -223,6 +235,21 @@ export default {
     font-size: 14px;
     line-height: 14px;
     color: #ffffff;
+    padding-left: 5px;
+  }
+  .line {
+    width: 50%;
+    height: 2px;
+
+    margin-top: 10px;
+    background: linear-gradient(
+      90deg,
+      rgba(29, 33, 41, 0) 0%,
+      #568ef6 38%,
+      #19d1ed 49%,
+      rgba(29, 33, 41, 0) 109%
+    );
+    // border: 2px solid;
   }
   .close {
     position: absolute;
@@ -285,7 +312,7 @@ export default {
   .foot {
     font-size: 14px;
     color: #ffffff;
-    background: url('../../assets/second/box-bg.png');
+    background: url("../../assets/second/box-bg.png");
     background-size: 100% 100%;
     background-repeat: no-repeat;
     padding: 1px;
@@ -321,7 +348,7 @@ export default {
     div {
       font-size: 14px;
       color: #ffffff;
-      background: url('../../assets/second/boxbtn-bg.png');
+      background: url("../../assets/second/boxbtn-bg.png");
       background-size: 100% 100%;
       background-repeat: no-repeat;
       padding: 7px 15px;

zh-baseversion-web/src/components/bigWindow/VideoView.vue

 <!--
  * @Author: your name
  * @Date: 2022-01-26 22:44:02
- * @LastEditTime: 2022-01-27 10:12:46
- * @LastEditors: Please set LastEditors
+ * @LastEditTime: 2024-07-25 17:07:09
+ * @LastEditors: 纪泽龙 jizelong@qq.com
  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  * @FilePath: /test/hello-world/src/views/components/videoView.vue
 -->
@@ -11,10 +11,13 @@
     <div class="title">{{ deviceData.videoName }}</div>
     <div class="close" @click="close">
       <!-- <img src="@/assets/mapImages/closeBtn.png" alt="" /> -->
-      <i class="el-icon-close" style="font-size:20px;color:#5dfefe;"></i>
+      <i class="el-icon-close" style="font-size: 20px; color: #49d8ff"></i>
     </div>
+    <div class="line"></div>
+
+
     <div class="box videoBox">
-      <div id="player" ></div>
+      <div id="player"></div>
     </div>
     <span slot="footer" class="dialog-footer">
       <!-- <el-button type="primary" @click="dialogVisible = false"
@@ -26,37 +29,36 @@
 </template>
 <script>
 import WasmPlayer from "@easydarwin/easywasmplayer"; //导入WasmPlayer.js
-import { getPreviewURLs } from "@/api/video/artemis"
+import { getPreviewURLs } from "@/api/video/artemis";
 //const IS_MOVE_DEVICE = document.body.clientWidth < 992 // 是否移动设备
 const IS_MOVE_DEVICE = true;
-const MSE_IS_SUPPORT = !!window.MediaSource // 是否支持mse
+const MSE_IS_SUPPORT = !!window.MediaSource; // 是否支持mse
 export default {
   data() {
     return {
       // dialogVisible: true,
       // AfterClose: true,
       queryParam: {
-        cameraIndexCode: ""
+        cameraIndexCode: "",
       },
       player: null,
       videoOpenNum: -1,
       queryParam: {
-        cameraIndexCode: ""
+        cameraIndexCode: "",
       },
     };
   },
   watch: {},
   mounted() {
     this.$nextTick(() => {
-      if(!window.JSPlugin){
-        this.loadScript("/h5player/h5player.min.js").then(() =>{
+      if (!window.JSPlugin) {
+        this.loadScript("/h5player/h5player.min.js").then(() => {
           this.createPlayer();
-        this.init()
-      })
-
-      }else{
+          this.init();
+        });
+      } else {
         this.createPlayer();
-        this.init()
+        this.init();
       }
     });
     // setTimeout(() => {
@@ -77,48 +79,53 @@ export default {
     // },
     init() {
       // 设置播放容器的宽高并监听窗口大小变化
-      window.addEventListener('resize', () => {
-        this.player.JS_Resize()
-    })
+      window.addEventListener("resize", () => {
+        this.player.JS_Resize();
+      });
     },
     createPlayer() {
       this.player = new window.JSPlugin({
-        szId: 'player',
+        szId: "player",
         szBasePath: "/h5player",
         iMaxSplit: 4,
         iCurrentSplit: IS_MOVE_DEVICE ? 1 : 2,
         openDebug: true,
         oStyle: {
-          borderSelect: IS_MOVE_DEVICE ? '#000' : '#FFCC00',
-        }
-      })
+          borderSelect: IS_MOVE_DEVICE ? "#000" : "#FFCC00",
+        },
+      });
       this.open();
     },
-    open(){
+    open() {
       this.queryParam.cameraIndexCode = this.deviceData.resourceId;
-      getPreviewURLs(this.queryParam).then(response =>{
-          if(response.data.code == '0'){
+      getPreviewURLs(this.queryParam).then((response) => {
+        if (response.data.code == "0") {
           this.videoOpenNum++;
           let url = response.data.data.url;
           //let index = this.player.currentWindowIndex;
-            this.player.JS_Play(url,{playURL: url, mode:"0" }, this.videoOpenNum%4).then(() => {
-                console.log('realplay success')
+          this.player
+            .JS_Play(url, { playURL: url, mode: "0" }, this.videoOpenNum % 4)
+            .then(
+              () => {
+                console.log("realplay success");
               },
-              e => { console.error(e) }
-              )
+              (e) => {
+                console.error(e);
+              }
+            );
         }
       });
     },
-    loadScript(src){
-      return new Promise(reslove =>{
+    loadScript(src) {
+      return new Promise((reslove) => {
         let scpritE1 = document.createElement("script");
         scpritE1.type = "text/javascript";
         scpritE1.src = src;
         scpritE1.onload = () => {
           reslove();
-      }
+        };
         document.body.appendChild(scpritE1);
-    })
+      });
     },
     callBack() {},
     close() {
@@ -130,12 +137,15 @@ export default {
 </script>
 
 <style lang="scss">
-  .sub-wnd{
+.sub-wnd {
   text-align: center !important;
-  }
+}
 .box-wrapper {
-  box-shadow: 0px 0px 10px #54e0ef inset;
-  background-color: #071738;
+  // box-shadow: 0px 0px 10px #54e0ef inset;
+  // background-color: #071738;
+  background: rgba(2, 26, 51, 0.9);
+  border: 1px solid #127bd1;
+  box-shadow: inset 0px 0px 10px 0px #164db2;
   padding: 10px;
   position: relative;
   // width: 670px;
@@ -145,6 +155,19 @@ export default {
     font-size: 14px;
     line-height: 14px;
     color: #ffffff;
+  }
+    .line {
+    width: 50%;
+    height: 1px;
+    margin-top: 10px;
+    background: linear-gradient(
+      90deg,
+      rgba(29, 33, 41, 0) 0%,
+      #568ef6 38%,
+      #19d1ed 49%,
+      rgba(29, 33, 41, 0) 109%
+    );
+    // border: 2px solid;
   }
   .close {
     position: absolute;
@@ -163,4 +186,3 @@ export default {
   }
 }
 </style>
-

zh-baseversion-web/src/components/bigWindow/yhqUser.vue

 <!--
  * @Author: your name
  * @Date: 2022-01-26 20:07:52
- * @LastEditTime: 2022-03-17 09:05:30
- * @LastEditors: Please set LastEditors
+ * @LastEditTime: 2024-07-25 17:11:56
+ * @LastEditors: 纪泽龙 jizelong@qq.com
  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 
  * @FilePath: /test/hello-world/src/views/components/deviceA.vue
@@ -14,9 +14,10 @@
     </div>
     <div class="close" @click="close">
       <!-- <img src="@/assets/mapImages/closeBtn.png" alt="" /> -->
-      <i class="el-icon-close" style="font-size:20px;color:#5dfefe;"></i>
+      <i class="el-icon-close" style="font-size: 20px; color: #5dfefe"></i>
     </div>
-    <p style="background-image: linear-gradient(to right, #5dfefe, #071738); width:100%;height:1px;"></p>
+    <div class="line"></div>
+  
     <div>
       <!--<div class="top flex top-top">-->
       <!--<div class="group" style="width:20%">-->
@@ -84,14 +85,27 @@
       </template>
     </div>
 
-
-    <div style="width:100%;display: flex;">
+    <div style="width: 100%; display: flex">
       <div class="btn">
         <div>感知设备</div>
       </div>
-      <p style="width:85%;height:10px;background-color: #022346;margin-top: 22px;margin-left: -10px;"></p>
+      <p
+        style="
+          width: 85%;
+          height: 10px;
+          background-color: #022346;
+          margin-top: 22px;
+          margin-left: -10px;
+        "
+      ></p>
       <div @click="btnClick">
-        <img  @click="flag = !flag" src="../../assets/second/box-down.png" :class="{ 'arrowTransform': !flag, 'arrowTransformReturn': flag}" alt="" style="width:30px;height:30px;margin-top: 12px;cursor: pointer;">
+        <img
+          @click="flag = !flag"
+          src="../../assets/second/box-down.png"
+          :class="{ arrowTransform: !flag, arrowTransformReturn: flag }"
+          alt=""
+          style="width: 30px; height: 30px; margin-top: 12px; cursor: pointer"
+        />
       </div>
     </div>
     <yhqUserCenter
@@ -104,7 +118,6 @@
       :pageSize="5"
       v-show="!isShow"
     />
-
   </div>
 </template>
 
@@ -113,7 +126,7 @@ import {
   getYhq,
   getyhqUser,
   deviceUser,
-  deviceUserList
+  deviceUserList,
 } from "@/api/bigWindow/getDevice";
 import { companyType, deviceType } from "@/utils/mapClass/config.js";
 import { yhqlistDetectorInfo } from "@/api/detector/detectorInfo";
@@ -127,7 +140,7 @@ export default {
   data() {
     return {
       flag: true,
-      isShow: true ,
+      isShow: true,
       companyType,
       deviceType,
       centerTitle: "",
@@ -155,7 +168,7 @@ export default {
     }
     //this.myHttp();
     // console.log(this.deviceData);
-    this.btnClick()
+    this.btnClick();
   },
   methods: {
     //用户的设备center
@@ -185,7 +198,7 @@ export default {
       // this.vueRoot.centerDataFunc(this.deviceData.pressureFlows);
       this.getDetectorInfoList(
         deviceUserList,
-        { township: this.deviceData.township,pageNum: 1, pageSize: 5, },
+        { township: this.deviceData.township, pageNum: 1, pageSize: 5 },
         this.deviceData.nickName
       );
     },
@@ -208,16 +221,17 @@ export default {
   transition: 0s;
   transform-origin: center;
   transform: rotateZ(180deg);
-    }
+}
 
-    .arrowTransformReturn {
+.arrowTransformReturn {
   transition: 0s;
   transform-origin: center;
   transform: rotateZ(0deg);
-    }
+}
 .devicea-wrapper {
-  box-shadow: 0px 0px 10px #54e0ef inset;
-  background-color: #071738;
+  background: rgba(2, 26, 51, 0.9);
+  border: 1px solid #127bd1;
+  box-shadow: inset 0px 0px 10px 0px #164db2;
   padding: 10px;
   position: relative;
   width: 740px;
@@ -227,6 +241,20 @@ export default {
     font-size: 14px;
     line-height: 14px;
     color: #ffffff;
+    padding-left:5px;
+  }
+   .line {
+    width: 50%;
+    height: 2px;
+    margin-top: 10px;
+    background: linear-gradient(
+      90deg,
+      rgba(29, 33, 41, 0) 0%,
+      #568ef6 38%,
+      #19d1ed 49%,
+      rgba(29, 33, 41, 0) 109%
+    );
+    // border: 2px solid;
   }
   .close {
     position: absolute;
@@ -289,7 +317,7 @@ export default {
   .foot {
     font-size: 14px;
     color: #ffffff;
-    background: url('../../assets/second/box-bg.png');
+    background: url("../../assets/second/box-bg.png");
     background-size: 100% 100%;
     background-repeat: no-repeat;
     padding: 1px;
@@ -325,7 +353,7 @@ export default {
     div {
       font-size: 14px;
       color: #ffffff;
-      background: url('../../assets/second/boxbtn-bg.png');
+      background: url("../../assets/second/boxbtn-bg.png");
       background-size: 100% 100%;
       background-repeat: no-repeat;
       padding: 7px 15px;

zh-baseversion-web/src/utils/mapClass/map.js

 /*
  * @Author: your name
  * @Date: 2022-01-11 13:45:12
- * @LastEditTime: 2024-07-19 14:59:20
+ * @LastEditTime: 2024-07-25 16:20:02
  * @LastEditors: 纪泽龙 jizelong@qq.com
  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  * @FilePath: /test/hello-world/src/utils/mapClass.js
@@ -589,7 +589,7 @@ export class EditorMap {
   }
 
   filterSelectPipe(id, mediumComponent, lng, lat) {
-    this.pipeArr[6].forEach((pipe) => {
+    this.pipeArr[1].forEach((pipe) => {
       const deviceExtData = pipe.getExtData();
       if (deviceExtData.pipeId === id) {
         //设置颜色
@@ -1349,7 +1349,7 @@ export class EditorMap {
 
     const color = pipeColor[pipePressure];
 
-    this.pipeArr[6].forEach((pipe) => {
+    this.pipeArr[1].forEach((pipe) => {
       const deviceExtData = pipe.getExtData();
       if (deviceExtData.pipeId === id) {
         //设置颜色
@@ -1364,10 +1364,13 @@ export class EditorMap {
   }
   // 设备以及公司过滤
   allfilter(companyArr, typeArr) {
+    console.log(typeArr,this.pipeArr)
     for (let pipeItem in this.pipeArr) {
       this.pipeArr[pipeItem].forEach((pipe) => {
         const data = pipe.getExtData();
-        if (companyArr.indexOf(data.companyType + "") >= 0) {
+        console.log(typeArr.indexOf(1))
+        if (companyArr.indexOf(data.companyType + "") >= 0 && typeArr.indexOf(1)>=0 ) {
+
           pipe.show();
         } else {
           pipe.hide();

zh-baseversion-web/src/views/bigWindow/components/Top.vue

@@ -66,7 +66,7 @@ export default {
   name: "",
   data() {
     return {
-      selarr1: [],
+      selarr1: [1],
       searchShow: false,
       searchItemShow: false,
       searchVal: "",
@@ -83,12 +83,6 @@ export default {
         9: "管道 :",
       },
       arr: [
-        {
-          val: 2,
-          ischeck: false,
-          imgurl: require("@/assets/firstimage/tiaoyaxiang.png"),
-          name: "调压箱",
-        },
         {
           val: 3,
           ischeck: false,
@@ -102,16 +96,16 @@ export default {
           name: "场 站",
         },
         {
-          val: 6,
+          val: 2,
           ischeck: false,
-          imgurl: require("@/assets/firstimage/user.png"),
-          name: "居民用户",
+          imgurl: require("@/assets/firstimage/tiaoyaxiang.png"),
+          name: "调压箱",
         },
         {
-          val: 61,
+          val: 1,
           ischeck: false,
-          imgurl: require("@/assets/firstimage/syUser.png"),
-          name: "商业用户",
+          imgurl: require("@/assets/firstimage/guandao.png"),
+          name: "管道",
         },
         {
           val: 5,
@@ -119,11 +113,23 @@ export default {
           imgurl: require("@/assets/firstimage/jiankong.png"),
           name: "监 控",
         },
+        {
+          val: 6,
+          ischeck: false,
+          imgurl: require("@/assets/firstimage/user.png"),
+          name: "居民用户",
+        },
+        {
+          val: 61,
+          ischeck: false,
+          imgurl: require("@/assets/firstimage/syUser.png"),
+          name: "商业用户",
+        },
         {
           val: 18,
           ischeck: false,
           imgurl: require("@/assets/firstimage/yhq.png"),
-          name: "餐饮单位液化气用户",
+          name: "餐饮用户",
         },
       ],
     };
@@ -150,7 +156,7 @@ export default {
       searchDeviceDetail({ type: item.type, id: item.id }).then((res) => {
         if (res.code == 200) {
           let dataArr = null;
-          console.log(res)
+          console.log(res);
           // 1.阀井
           // 2.调压箱
           // 3.场站
@@ -192,13 +198,13 @@ export default {
 <style lang="scss" scoped>
 .typelist-div {
   transition: all 0.2s linear;
-  width: 800px;
+  width: 840px;
   // height: 96px;
   // height: 56px;
   z-index: 9999;
   position: fixed;
   top: 90px;
-  margin-left: calc((100% - 755px) / 2);
+  margin-left: calc((100% - 840px) / 2);
   background: rgba(2, 41, 81, 0.25);
   border: 1px solid #275275;
   box-sizing: border-box;
@@ -254,12 +260,12 @@ export default {
       height: 20px;
     }
     .device-btn-wrapper {
-      width: 755px;
+      width: 780px;
       margin-right: 5px;
       flex-wrap: wrap;
     }
     .search {
-      width: 755px;
+      width: 785px;
       position: absolute;
       top: 40px;
       .input-wrapper {

zh-baseversion-web/src/views/bigWindow/index.vue

 <!--
  * @Author: your name
  * @Date: 2022-01-11 13:44:17
- * @LastEditTime: 2024-07-19 16:18:43
+ * @LastEditTime: 2024-07-25 17:36:25
  * @LastEditors: 纪泽龙 jizelong@qq.com
  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  * @FilePath: /test/hello-world/src/views/Home.vue
@@ -502,7 +502,7 @@ export default {
         console.log("管道", res.data);
         if (res.data && !res.data[0].iconType) {
           res.data.forEach((item) => {
-            item.iconType = 6;
+            item.iconType = 1;
           });
         }
         // 根据数据格式不同，赋值不同，如果是个数组，就用res，如果不是就用res.data
@@ -765,14 +765,21 @@ export default {
   top: 50px;
   right: 20px;
   font-size: 14px;
-  color: #3cc4ff;
+  color: #ffffff;
   cursor: pointer;
-  padding: 3px 10px;
-  border: 1px solid rgb(57, 68, 124);
-  background: #12268e33;
-  /* &:hover {
-    color: #00ffff;
-  } */
+  // background: #12268e33;
+  background: url("~@/assets/firstimage/btm-item.png") no-repeat bottom center;
+  width: 128px;
+  height: 28px;
+  line-height: 28px;
+  text-align: center;
+    transition: all 0.2s linear;
+
+  &:hover {
+    background: url("~@/assets/firstimage/btm-item-active.png") no-repeat bottom
+      center;
+    opacity: 0.7;
+  }
 }
 #map {
   position: absolute;