fix: 对接省份级联

src/api/modules/species.js

@@ -5,4 +5,19 @@ export default {
         url: config.one_map_url + "species/botany_type/list",
         type: "get",
     },
+    // 省级列表
+    provinceList: {
+        url: config.one_map_url + "province/list",
+        type: "get",
+    },
+    // 市级列表
+    cityList: {
+        url: config.one_map_url + "city/list/{provCode}",
+        type: "get",
+    },
+    // 区级列表
+    districtList: {
+        url: config.one_map_url + "district/listByCityCode/{cityCode}",
+        type: "get",
+    },
 }

src/views/warningHome/index.vue

@@ -11,7 +11,6 @@
                                 :show-all-levels="false"
                                 v-model="areaVal"
                                 :props="props1"
-                                :options="areaListOptions"
                                 @change="toggleArea"
                                 popper-class="area-cascader"
                             />
@@ -795,14 +794,72 @@ const getDistributionData = async (speciesId) => {
 };
 const props1 = {
     checkStrictly: true,
+    lazy: true,
+    lazyLoad(node, resolve) {
+        const { level } = node;
+        
+        if (level === 0) {
+            // 第一级：获取省级列表
+            VE_API.species.provinceList().then((res) => {
+                if (res.code === 0 && res.data) {
+                    const nodes = res.data.map((item) => ({
+                        value: item.provCode || item.code || item.id,
+                        label: item.provName || item.name,
+                        leaf: false, // 省级不是叶子节点
+                    }));
+                    resolve(nodes);
+                } else {
+                    resolve([]);
+                }
+            }).catch(() => {
+                resolve([]);
+            });
+        } else if (level === 1) {
+            // 第二级：获取市级列表，参数 provCode
+            const provCode = node.value;
+            VE_API.species.cityList({ provCode }).then((res) => {
+                if (res.code === 0 && res.data) {
+                    const nodes = res.data.map((item) => ({
+                        value: item.cityCode || item.code || item.id,
+                        label: item.cityName || item.name,
+                        leaf: false, // 市级不是叶子节点
+                    }));
+                    resolve(nodes);
+                } else {
+                    resolve([]);
+                }
+            }).catch(() => {
+                resolve([]);
+            });
+        } else if (level === 2) {
+            // 第三级：获取区级列表，参数 cityCode
+            const cityCode = node.value;
+            VE_API.species.districtList({ cityCode }).then((res) => {
+                if (res.code === 0 && res.data) {
+                    const nodes = res.data.map((item) => ({
+                        value: item.districtCode || item.code || item.id,
+                        label: item.districtName || item.name,
+                        leaf: true, // 区级是叶子节点
+                    }));
+                    resolve(nodes);
+                } else {
+                    resolve([]);
+                }
+            }).catch(() => {
+                resolve([]);
+            });
+        } else {
+            resolve([]);
+        }
+    },
 };
 
 const toggleArea = (v) => {
     activeBoxName.value = null;
-    const val = v[v.length - 1];
-    if (val === "3" || val === "3186") {
-        eventBus.emit("warningHome:toggleArea", val);
-    }
+    // const val = v[v.length - 1];
+    // if (val === "3" || val === "3186") {
+    //     eventBus.emit("warningHome:toggleArea", val);
+    // }
 };
 
 const activeBoxName = ref(null);
@@ -1148,6 +1205,9 @@ const getTreeChecks = async (nodeData, data) => {
                             font-family: "PangMenZhengDao";
                             text-align: center;
                         }
+                        .el-input__suffix {
+                            color: #f7be5a;
+                        }
                     }
                     .el-select__wrapper {
                         background: rgba(29, 29, 29, 0.54);
@@ -1318,6 +1378,9 @@ const getTreeChecks = async (nodeData, data) => {
         background-color: rgba(255, 212, 137, 0.3);
         border-color: rgba(255, 212, 137, 0.6);
     }
+    .el-radio__inner::after {
+        background: #000;
+    }
     &.el-popper.is-light .el-popper__arrow:before {
         background: #232323;
         border-color: rgba(255, 212, 137, 0.3);

src/views/warningHome/map/distributionLayer.js

@@ -20,7 +20,7 @@ class DistributionLayer {
                 return [style2]
             }
         });
-        // this.kmap.addLayer(this.distributionLayer.layer)
+        this.kmap.addLayer(this.distributionLayer.layer)
 
         this.distributionPointLayer = new KMap.VectorLayer("distributionPointLayer", 99, {
             source: new VectorSource({}),
@@ -147,11 +147,11 @@ class DistributionLayer {
 
         for (let item of data) {
             // 面数据（区域多边形）
-            // if (item.geom) {
-            //     item.color = item.color || "#2199F8";
-            //     item.fillColor = item.fillColor || "rgba(0, 69, 4, 0.5)";
-            //     this.distributionLayer.source.addFeature(newPolymerFeature(item));
-            // }
+            if (item.geom) {
+                item.color = item.color || "#2199F8";
+                item.fillColor = item.fillColor || "rgba(0, 69, 4, 0.5)";
+                this.distributionLayer.source.addFeature(newPolymerFeature(item));
+            }
             if (item.centerPoint) {
                 item.color = item.color || "#2199F8";
                 item.wkt = item.centerPoint;