增加产业字段筛选

src/router/index.js

@@ -53,7 +53,7 @@ const routes = [
 ]
 
 let baseUrl  = process.env.BASE_URL;
-console.log("baseUrl====="+baseUrl);
+// console.log("baseUrl====="+baseUrl);
 
 const router = createRouter({
   // history: createWebHistory(process.env.BASE_URL),

src/views/leaflet.vue

@@ -148,6 +148,7 @@
           <span class="measure-text">测距</span>
         </button>
         <button
+          v-if="URLParams.type == 3 || URLParams.type == undefined"
           :class="isDraw == true ? 'measure-button active' : 'measure-button'"
           style="margin-top: 20px;"
           @click="toggleDraw"
@@ -159,12 +160,12 @@
         
         <!-- 新增图层控制复选框 -->
         <div class="layer-toggle-controls">
-          <label class="layer-checkbox">
+          <label class="layer-checkbox" v-if="URLParams.type == 2 || URLParams.type == undefined">
             <input type="checkbox" v-model="showPlotLayer" />
             <span class="custom-checkbox"></span>
             <span class="checkbox-label" style="color: #409eff">地块</span>
           </label>
-          <label class="layer-checkbox">
+          <label class="layer-checkbox" v-if="URLParams.type == 1 || URLParams.type == undefined">
             <input type="checkbox" v-model="showBuildingLayer" />
             <span class="custom-checkbox"></span>
             <span class="checkbox-label" style="color: #67c23a">楼宇</span>
@@ -215,6 +216,12 @@ export default {
         dkDataFlag:false,
         lyDataFlag:false
       },
+      URLParams:{
+        type:'',
+        code:'',
+        center:'',
+        industry:''
+      },
 
       //   15分钟生活圈数据集合
       lifeDatas: {},
@@ -304,86 +311,56 @@ export default {
   methods: {
     initIframeInfo (){
       let that = this;
-      let URL = window.location.href.split('#');
-      let type = '';
-      let code = '';
-      let center = '';
-      if(URL.length>1){
-        const paramsStr = URL[1].split('?')[1];
-        const params = {};
-        if (paramsStr) {
-          paramsStr.split('&').forEach(pair => {
-            const [key, value] = pair.split('=');
-            params[key] = decodeURIComponent(value);
-          });
-        }
-        type = params.type;
-        code = params.code;
-        center = params.center;
-      }else{
-        const params = new URLSearchParams(window.location.search);
-        type = params.get('type');
-        code = params.get('code');
-        center = params.get('center');
-      }
-      // console.log("type======"+type); // 输出参数值
-      // console.log("code======"+code); // 输出参数值
-      // console.log("center===="+center); // 输出参数值
-
-      if(type == null || center == null) return
+      if(that.URLParams.type == undefined || that.URLParams.center == undefined) return
       let zoom = 18;
-      if(type == 3){
+      if(that.URLParams.type == 3){
         zoom = 14;
       }
-      const geometry = JSON.parse(center)
-      const latlnt = {lat:geometry[1],lng:geometry[0]}
+      const geometry = JSON.parse(that.URLParams.center)
+      let latlnt = L.latLng(
+        geometry[1],
+        geometry[0]
+      );
       map2DViewer.map.flyTo(latlnt, zoom, {
           duration: 1, // 动画持续时间（秒）
           easeLinearity: 0.25, // 动画缓动效果
       });
-      let curTimer = undefined;
-      curTimer = setInterval(() => {
-           if(this.initShow.lifeDataFlag == true && this.initShow.dkDataFlag == true && this.initShow.lyDataFlag == true){
-              clearInterval(curTimer)
-              let feature = undefined;
-              // type= 1、楼宇 2、地块 3、十五分钟圈
-              Object.entries(this.landDatas).forEach(([key, item]) => {
-                  if(type == 1 && item.properties.c_park_code == code){
-                      feature = item
-                      return
-                  }else if(type == 2 && item.properties.c_parcel_number == code){
-                      feature = item
-                      return
-                  }else if(type == 3){
-                      // that.drawCircle({latlng:latlnt})
-                      return
-                  } 
-              })
-              if(type != 3){
-                  this.BuildingInformationShow = true;
-                  if(feature){
-                    // 创建弹窗内容
-                    const properties = feature.properties;
-                    if(properties.column_name == '楼宇表'){
-                      this.isDataTypeFlag = 1
-                    }else{
-                      this.isDataTypeFlag = 2
-                    }
-                    properties.cy_lable = '';
-                    if(properties.c_industry_direction !=  undefined){
-                      properties.cy_lable = properties.c_industry_direction
-                    }
-                    if(properties.content !=  undefined){
-                      properties.cy_lable = properties.content
-                    }
-                    this.BuildingInformationProperties = properties;
-                  }
-                  
-              }else{
-                  this.BuildingInformationShow = false;
-              }
-           }
-      }, 500);
+    
+      let feature = undefined;
+      // type= 1、楼宇 2、地块 3、十五分钟圈
+      Object.entries(this.landDatas).forEach(([key, item]) => {
+          if(that.URLParams.type == 1 && item.properties.c_park_code == that.URLParams.code){
+              feature = item
+              return
+          }else if(that.URLParams.type == 2 && item.properties.c_parcel_number == that.URLParams.code){
+              feature = item
+              return
+          }
+      })
+      if(that.URLParams.type != 3){
+          // this.BuildingInformationShow = true;
+          // if(feature){
+          //   // 创建弹窗内容
+          //   const properties = feature.properties;
+          //   if(properties.column_name == '楼宇表'){
+          //     this.isDataTypeFlag = 1
+          //   }else{
+          //     this.isDataTypeFlag = 2
+          //   }
+          //   properties.cy_lable = '';
+          //   if(properties.c_industry_direction !=  undefined){
+          //     properties.cy_lable = properties.c_industry_direction
+          //   }
+          //   if(properties.content !=  undefined){
+          //     properties.cy_lable = properties.content
+          //   }
+          //   this.BuildingInformationProperties = properties;
+          // }
+          
+      }else{
+          this.BuildingInformationShow = false;
+          that.drawCircle({latlng:latlnt})
+      }
     },
     colseWin(){
       this.BuildingInformationShow = false;
@@ -417,9 +394,32 @@ export default {
       //     that.oauthToken = data.message;
       //     that.initMap();
       //   });
+
+      let URLStr = window.location.href.split('#');
+      if(URLStr.length>1){
+        const paramsStr = URLStr[1].split('?')[1];
+        const params = {};
+        if (paramsStr) {
+          paramsStr.split('&').forEach(pair => {
+            const [key, value] = pair.split('=');
+            params[key] = decodeURIComponent(value);
+          });
+        }
+        that.URLParams.type = params.type;
+        that.URLParams.code = params.code;
+        that.URLParams.center = params.center;
+        that.URLParams.industry = params.industry;
+      }else{
+        const params = new URLSearchParams(window.location.search);
+        that.URLParams.type = params.get('type');
+        that.URLParams.code = params.get('code');
+        that.URLParams.center = params.get('center');
+        that.URLParams.industry = params.get('industry');
+      }
       that.initMap();
     },
     initMap() {
+      let that = this;
       map2DViewer.map = L.map("map2DViewer", {
         minZoom: 10,
         maxZoom: 19,
@@ -427,7 +427,7 @@ export default {
         zoomControl: false,
         renderer: L.canvas(),
         doubleClickZoom: false,
-      }).setView([31.17665808878003, 121.27975386938489], 18);
+      }).setView([31.182190465827375, 121.25394898932429], 14);
 
       // this.layer = this.addTiledMapLayer(
       //   "internalMap?servertype=shmap_base_web&proxyToken=" + this.oauthToken
@@ -463,11 +463,21 @@ export default {
       this.lifeDatas = {};
       this.landDatas = {};
       //   加载静态文件渲染geojson数据
-      this.getJSonDataToMap();
-      this.getJSonDataToMap2();
-      this.getJSonDataToMap3();
-
-      this.initIframeInfo(); // 第三方URL引进此工程获取的参数
+      if(that.URLParams.type == 1 || that.URLParams.type == undefined){
+        this.getJSonDataToMap3();// 楼宇数据
+      }
+      if(that.URLParams.type == 2 || that.URLParams.type == undefined){
+        this.getJSonDataToMap2();// 地块数据
+      }
+      if(that.URLParams.type == 3 || that.URLParams.type == undefined){
+        this.getJSonDataToMap();// 十五分钟数据
+      }
+      let curTimer = setInterval(() => {
+           if((this.initShow.lifeDataFlag == true && (that.URLParams.type == 3 || that.URLParams.type == undefined)) || (this.initShow.dkDataFlag == true && (that.URLParams.type == 2 || that.URLParams.type == undefined)) || (this.initShow.lyDataFlag == true && (that.URLParams.type == 1 || that.URLParams.type == undefined))){
+              clearInterval(curTimer)
+              this.initIframeInfo(); // 第三方URL引进此工程获取的参数
+           }
+      })
     },
 
     drawCircle(e){
@@ -734,12 +744,43 @@ export default {
           feature.geometry.coordinates = newCorrectCoordArr;
           let configKey = dkModelColChName;
           if (feature.properties) {
-            const markerName =
-              feature.properties.c_parcel_name ||
-              "未命名区域";
-            this.landDatas[markerName] = feature;
+            let flag = false
+            if(that.URLParams.industry == undefined){
+              flag = true
+            }else{
+               if(that.URLParams.industry){
+                  let strArr = feature.properties.content.split("、")
+                  let checkArr = that.URLParams.industry.split(',');
+                  for(let i=0; i<checkArr.length; i++){
+                      let str = checkArr[i];
+                      if(strArr.includes(str) == true){
+                        flag = true
+                        break
+                      }
+                  }
+               }
+              
+            }
+            
+            if(flag == true){
+              if(that.URLParams.code){
+                if(feature.properties.c_parcel_number == that.URLParams.code){
+                  const markerName =
+                    feature.properties.c_parcel_name ||
+                    "未命名区域";
+                  this.landDatas[markerName] = feature;
+                  this.addPolygon(feature, "#409EFF", configKey, "dkModelColChName");
+                }
+              }else{
+                const markerName =
+                  feature.properties.c_parcel_name ||
+                  "未命名区域";
+                this.landDatas[markerName] = feature;
+                this.addPolygon(feature, "#409EFF", configKey, "dkModelColChName");
+              }
+              
+            }
           }
-          this.addPolygon(feature, "#409EFF", configKey, "dkModelColChName");
         });
         that.initShow.dkDataFlag = true
       });
@@ -761,12 +802,38 @@ export default {
           feature.geometry.coordinates = newCorrectCoordArr;
           let configKey = lyModelColChName;
           if (feature.properties) {
-            const markerName =
-              feature.properties.c_resource_name ||
-              "未命名区域";
-            this.landDatas[markerName] = feature;
+            let flag = false
+            if(that.URLParams.industry == undefined){
+              flag = true
+            }else{
+              let strArr = feature.properties.c_industry_direction.split("、")
+              let checkArr = that.URLParams.industry.split(',');
+              for(let i=0; i<checkArr.length; i++){
+                  let str = checkArr[i];
+                  if(strArr.includes(str) == true){
+                    flag = true
+                    break
+                  }
+              }
+            }
+            if(flag == true){
+              if(that.URLParams.code){
+                if(feature.properties.c_park_code == that.URLParams.code){
+                  const markerName =
+                  feature.properties.c_resource_name ||
+                  "未命名区域";
+                this.landDatas[markerName] = feature;
+                this.addPolygon(feature, "#67C23A", configKey, "lyModelColChName");
+                }
+              }else{
+                const markerName =
+                  feature.properties.c_resource_name ||
+                  "未命名区域";
+                this.landDatas[markerName] = feature;
+                this.addPolygon(feature, "#67C23A", configKey, "lyModelColChName");
+              }
+            }
           }
-          this.addPolygon(feature, "#67C23A", configKey, "lyModelColChName");
         });
         that.initShow.lyDataFlag = true
       });