fix：大屏修改

src/views/big-screen/index.vue

@@ -2,7 +2,7 @@
  * @Author: SunTao 328867980@qq.com
  * @Date: 2024-10-17 11:34:00
  * @LastEditors: SunTao 328867980@qq.com
- * @LastEditTime: 2024-11-15 10:52:41
+ * @LastEditTime: 2024-11-15 17:40:06
  * @FilePath: \znxjxt-ui\src\views\big-screen\index.vue
  * @Description: 大屏首页
 -->
@@ -377,12 +377,10 @@ export default {
             {
               value: "shejiyuanze",
               label: "设计原则",
-              
             },
             {
               value: "daohang",
               label: "导航",
-              
             },
           ],
         },
@@ -393,7 +391,6 @@ export default {
             {
               value: "basic",
               label: "Basic",
-              
             },
             {
               value: "form",
@@ -715,8 +712,8 @@ export default {
 
     /* 获取图片背景下坐标数据 */
     getMapCare(value) {
-      console.log(value, "获取图片背景下坐标数据");
-      comppanyImg({ type: this.mapCareSelect }).then(({ code, data }) => {
+      console.log(value,this.mapCareSelect, "获取图片背景下坐标数据");
+      comppanyImg({ type: value }).then(({ code, data }) => {
         if (code === 200) {
           this.mapCareList = data;
         }
@@ -933,7 +930,7 @@ export default {
             }),
             // 边线颜色
             stroke: new Stroke({
-              color: "#0ABE67",
+              color: this.getLineColor(element.pci),
               width: 5,
             }),
             // 形状
@@ -962,6 +959,21 @@ export default {
       });
     },
 
+    /* 地图线段颜色区分 */
+    getLineColor(value) {
+      if (value > 92) {
+        return "#0ABE67";
+      } else if (92 >= value > 80) {
+        return "#03BDE7";
+      } else if (80 >= value > 70) {
+        return "#E7CA03";
+      } else if (70 >= value > 60) {
+        return "#D47F07";
+      } else {
+        return "#E64548";
+      }
+    },
+
     /* 地图下方4图标类别切换点击事件 */
     changeIconType(value) {
       if (this.bottomTipClick !== value) {
@@ -973,9 +985,8 @@ export default {
 
     /* 获取icon多选数据 */
     getIconType() {
-      const type = this.elementDiv === "RoadScreen" ? "" : this.bottomTipClick;
       this.mapLogeList = {};
-      getItemTypes({ classType: type }).then(({ code, data }) => {
+      getItemTypes({ classType: this.bottomTipClick,type:this.elementDiv }).then(({ code, data }) => {
         if (code === 200) {
           this.iconTypeList = data;
           this.iconType = data.map((item) => {
@@ -991,23 +1002,6 @@ export default {
     /* 传回来的地图图层 */
     getZoom(zoom) {
       this.mapZoom = zoom;
-      // if (zoom === "11" && this.mapZoom !== zoom) {
-      //   this.mapZoom = zoom;
-      //   this.$nextTick(() => {
-      //     const map = this.$refs.roadMap.instance.get("map");
-      //     map.removeLayer(this.markLayerLines);
-      //     this.markLayerLines = null;
-      //   });
-      //   this.getLinePoint();
-      // } else if (zoom === "10" && this.mapZoom !== zoom) {
-      //   this.mapZoom = zoom;
-      //   this.$nextTick(() => {
-      //     const map = this.$refs.roadMap.instance.get("map");
-      //     map.removeLayer(this.markLayerLines);
-      //     this.markLayerLines = null;
-      //   });
-      //   this.getLinePoint();
-      // }
       if (this.clusters && zoom * 1 > 15) {
         this.clusters.getSource().setDistance(0);
       } else if (this.clusters && zoom * 1 <= 15) {
@@ -1015,15 +1009,6 @@ export default {
       }
     },
 
-    /* 地图缩放完成事件 */
-    // mapMoveend(zoom) {
-    //   if (this.clusters && zoom * 1 > 15) {
-    //     this.clusters.getSource().setDistance(0);
-    //   } else if (this.clusters && zoom * 1 <= 15) {
-    //     this.clusters.getSource().setDistance(100);
-    //   }
-    // },
-
     /* 地图选中feature事件 */
     featureSelect(e) {
       const map = this.$refs.roadMap.instance.get("map");
@@ -1738,19 +1723,19 @@ export default {
 .screen-index-cascader {
   background-color: #102649;
   border-color: #08204f;
-  
+
   .el-cascader-node__label {
     color: #aaabb8;
   }
-  
+
   .el-cascader-node:hover {
     background-color: #2b4c7e;
   }
-  
+
   .el-cascader-node:active {
     background-color: #2b4c7e;
   }
-  
+
   .el-cascader-node:focus {
     background-color: #2b4c7e;
   }