两清三化移动端地图修改

src/api/plotPremisesMobile/index.js

@@ -15,3 +15,11 @@ export function getUserGeoList(query) {
     method: 'get'
   })
 }
+
+//查询当前部门
+export function getDept(id) {
+  return request({
+    url: '/home/mobile/get/current/' + id,
+    method: 'get'
+  })
+}

src/views/plotPremisesMobile/index.vue

@@ -76,11 +76,11 @@
             </van-row>
             <van-row type="flex" justify="space-between">
               <van-col>咨询代表：</van-col>
-              <van-col>张村委</van-col>
+              <van-col>{{ deptInfo.leader }}</van-col>
             </van-row>
             <van-row type="flex" justify="space-between">
               <van-col>咨询电话：</van-col>
-              <van-col class="num">13306310631</van-col>
+              <van-col class="num">{{ deptInfo.phone }}</van-col>
             </van-row>
           </div>
 
@@ -115,11 +115,11 @@
             </van-row>
             <van-row type="flex" justify="space-between">
               <van-col>咨询代表：</van-col>
-              <van-col>张村委</van-col>
+              <van-col>{{ deptInfo.leader }}</van-col>
             </van-row>
             <van-row type="flex" justify="space-between">
               <van-col>咨询电话：</van-col>
-              <van-col class="num">13306310631</van-col>
+              <van-col class="num">{{ deptInfo.phone }}</van-col>
             </van-row>
           </div>
 
@@ -168,6 +168,7 @@
 import $ from "jquery";
 import { getConfigKey } from "@/utils/data";
 import { treeselect } from "@/api/agriculturalTrusteeship";
+import { getDept } from "@/api/plotPremisesMobile";
 
 export default {
   data() {
@@ -225,6 +226,13 @@ export default {
       countyBorderLayerName: "",                        // 区县边界图层名称
       townBorderLayerName: "",                          // 乡镇边界图层名称
       villageBorderLayerName: "",                       // 村边界图层名称
+
+      landLayer: "",                                    // 地块图层
+      homesteadLayer: "",                               // 宅基地图层
+      deptInfo: {
+        leader: null,                                   // 联系人
+        phone: null                                     // 电话
+      }
     };
   },
   created() {
@@ -430,12 +438,18 @@ export default {
               this.map.removeLayer(this.deptLayer);
               this.deptLayer = '';
               this.addDeptLayer(depts);
+              this.addLandLayer(deptId);
+              this.addHomesteadLayer(deptId);
               this.map.getView().animate({
                 center: ol.proj.fromLonLat([lng, lat]), // 中心点
                 zoom: 17, // 缩放级别
                 rotation: undefined, // 缩放完成view视图旋转弧度
                 duration: 1000, // 缩放持续时间，默认不需要设置
               });
+              getDept(deptId).then(res => {
+                this.deptInfo.leader = res.data.leader;
+                this.deptInfo.phone = res.data.phone;
+              });
             }
           }
         }
@@ -458,6 +472,13 @@ export default {
             if (deptNode && deptNode.children) {
               this.addDeptLayer(deptNode.children);
             }
+
+            this.map.removeLayer(this.landLayer);
+            this.landLayer = "";
+            this.map.removeLayer(this.homesteadLayer);
+            this.homesteadLayer = "";
+            this.deptInfo.leader = null;
+            this.deptInfo.phone = null;
           } else if (this.currentDeptLevel === '3' && zoom < 11) {
             this.currentDeptLevel = '4';
             this.map.removeLayer(this.borderLayer);
@@ -497,6 +518,13 @@ export default {
             if (deptNode && deptNode.children) {
               this.addDeptLayer(deptNode.children);
             }
+
+            this.map.removeLayer(this.landLayer);
+            this.landLayer = "";
+            this.map.removeLayer(this.homesteadLayer);
+            this.homesteadLayer = "";
+            this.deptInfo.leader = null;
+            this.deptInfo.phone = null;
           } else if (this.currentDeptLevel === '3' && zoom < 11) {
             this.currentDeptLevel = '4';
             this.map.removeLayer(this.borderLayer);
@@ -630,6 +658,78 @@ export default {
       // this.map.addLayer(this.deptLayer);
       this.map.getLayers().insertAt(3, this.deptLayer);
     },
+    // 添加地块图层
+    addLandLayer(deptId) {
+      /* let params = {};
+      if (this.street === '全部' && this.cun === '全部') {
+        params = {
+          LAYERS: this.homesteadLayerName,
+          SRID: 3857,
+        };
+      } else if (this.street !== '全部' && this.cun === '全部') {
+        let villageDeptIds = this.houseCunship.map(item => item.deptId);
+        params = {
+          LAYERS: this.homesteadLayerName,
+          cql_filter: "dept_id in (" + villageDeptIds + ")",
+          SRID: 3857,
+        };
+      } else if (this.street !== '全部' && this.cun !== '全部') {
+        params = {
+          LAYERS: "zjd_dc:t_sys_dk",                                 // 测试用的图层，正式使用时要换成自己发布的图层
+          cql_filter: "dept_id = '" + this.deptId + "'",
+          SRID: 3857,
+        };
+      } */
+      this.landLayer = new ol.layer.Image({
+        source: new ol.source.ImageWMS({
+          url: "http://218.59.175.43:8090/geoserver/zjd_dc/wms",     // 测试用的geoserver服务器链接，正式使用时需要换掉
+          params: {
+            LAYERS: "zjd_dc:t_sys_dk_mobile",                        // 测试用的图层，正式使用时要换成自己发布的图层
+            cql_filter: "dept_id = '" + deptId + "'",
+            SRID: 3857,
+          }
+        }),
+        name: 'landLayer'
+      });
+      this.map.addLayer(this.landLayer);
+      // this.map.getLayers().insertAt(3, this.landLayer);
+    },
+    // 添加宅基地图层
+    addHomesteadLayer(deptId) {
+      /* let params = {};
+      if (this.street === '全部' && this.cun === '全部') {
+        params = {
+          LAYERS: this.homesteadLayerName,
+          SRID: 3857,
+        };
+      } else if (this.street !== '全部' && this.cun === '全部') {
+        let villageDeptIds = this.houseCunship.map(item => item.deptId);
+        params = {
+          LAYERS: this.homesteadLayerName,
+          cql_filter: "dept_id in (" + villageDeptIds + ")",
+          SRID: 3857,
+        };
+      } else if (this.street !== '全部' && this.cun !== '全部') {
+        params = {
+          LAYERS: "zjd_dc:t_sys_dk",                                 // 测试用的图层，正式使用时要换成自己发布的图层
+          cql_filter: "dept_id = '" + this.deptId + "'",
+          SRID: 3857,
+        };
+      } */
+      this.homesteadLayer = new ol.layer.Image({
+        source: new ol.source.ImageWMS({
+          url: "http://218.59.175.43:8090/geoserver/zjd_dc/wms",     // 测试用的geoserver服务器链接，正式使用时需要换掉
+          params: {
+            LAYERS: "zjd_dc:t_homestead_zjdzdxx_mobile",             // 测试用的图层，正式使用时要换成自己发布的图层
+            cql_filter: "dept_id = '" + deptId + "'",
+            SRID: 3857,
+          }
+        }),
+        name: 'homesteadLayer'
+      });
+      this.map.addLayer(this.homesteadLayer);
+      // this.map.getLayers().insertAt(3, this.homesteadLayer);
+    },
   },
 };
 </script>