Merge branch 'dev_shequzhili'

src/assets/scss/modules/visual/search_1.scss

@@ -81,6 +81,30 @@
       }
     }
   }
+  .range-data2 {
+    ::v-deep .el-date-editor {
+      width: 360px;
+      position: relative;
+   
+      .el-range-input {
+        color: #fff;
+        background: #06186d;
+        margin-left: 10px;
+      }
+      .el-range-separator {
+        color: #fff;
+      }
+      .el-range__icon {
+        position: absolute;
+        right: 5px;
+        // float: right;
+      }
+      .el-input__prefix {
+        left: unset;
+        right: 5px;
+      }
+    }
+  }
 
   .one-date{
     ::v-deep .el-date-editor {

src/views/modules/visual/basicinfo/personCategory/index.vue

@@ -22,29 +22,31 @@
           <img src="@/assets/img/shuju/title-tip.png" />
           <span>人员类别分析</span>
 
-          <div class="second-select cascader">
+          <div class="search">
-
+            <div class="second-select cascader">
-            <el-cascader class="customer_cascader"
+
-                         ref="myCascader"
+              <el-cascader class="customer_cascader"
-                         v-model="agencyIdArray"
+                           ref="myCascader"
-                         :key="iscascaderShow"
+                           v-model="agencyIdArray"
-                         :options="casOptions"
+                           :key="iscascaderShow"
-                         :props="optionProps"
+                           :options="casOptions"
-                         :show-all-levels="false"
+                           :props="optionProps"
-                         @change="handleChangeAgency"></el-cascader>
+                           :show-all-levels="false"
-          </div>
+                           @change="handleChangeAgency"></el-cascader>
-          <div class="second-select ">
+            </div>
-
+            <div class="second-select range-data2">
-            <el-date-picker v-model="dateIdShow"
+
-                            type="date"
+              <el-date-picker v-model="dateIdShow"
-                            :clearable="false"
+                              type="date"
-                            @change="handleChangeDate"
+                              :clearable="false"
-                            :picker-options="pickerOptions"
+                              @change="handleChangeDate"
-                            prefix-icon="el-icon-caret-bottom"
+                              :picker-options="pickerOptions"
-                            placeholder="选择日期"
+                              prefix-icon="el-icon-caret-bottom"
-                            value-format="yyyy-MM-dd">
+                              placeholder="选择日期"
-            </el-date-picker>
+                              value-format="yyyy-MM-dd">
+              </el-date-picker>
 
+            </div>
           </div>
         </div>
         <el-scrollbar style="width: 100%">
@@ -255,7 +257,7 @@ export default {
 
     async handleChangeAgency (value) {
       let arr = this.$refs["myCascader"].getCheckedNodes();
-      if(!Array.isArray(arr) || arr.length==0) return;
+      if (!Array.isArray(arr) || arr.length == 0) return;
       let selAgency = arr[0].data
       // this.agencyName = this.$refs["myCascader"].getCheckedNodes()[0].label
       this.agencyName = selAgency.name
@@ -268,7 +270,7 @@ export default {
 
     //下钻到下一级 type点击的类型:polygon 点击多边形（分为点击组织/小区）    people 点击详情
     async toSubAgency (userId) {
-      
+
       return this.$router.push({ path: `/main-shuju/visual-basicinfo-people/${userId}` });
       // this.selUserId = userId
       // this.orgLevel = 'people'
@@ -308,3 +310,10 @@ export default {
   scoped
 ></style>
 
+<style
+  lang="scss"
+  src="@/assets/scss/modules/visual/search_1.scss"
+  scoped
+></style>
+
+

src/views/modules/visual/communityGovern/duoyuanfuwu/duoyuanfuwufenxi.vue

@@ -36,11 +36,11 @@
             </div>
             <div class="m-pagination">
               <el-pagination :current-page="demand.pageNo"
-                            :page-size="demand.pageSize"
+                             :page-size="demand.pageSize"
-                            :total="demand.total"
+                             :total="demand.total"
-                            background
+                             background
-                            layout="prev, pager, next,total"
+                             layout="prev, pager, next,total"
-                            @current-change="handlePageNoChange_demand">
+                             @current-change="handlePageNoChange_demand">
               </el-pagination>
             </div>
           </div>
@@ -82,8 +82,8 @@
       </div>
     </div>
     <duoyuan-dialog v-if="showInfoDialog"
-                 :orgId="orgId"
+                    :orgId="orgId"
-                 @close="showInfoDialog = false" />
+                    @close="showInfoDialog = false" />
   </cpt-card>
 </template>
 
@@ -103,8 +103,8 @@ import { pieOption } from './pieOption.js'
 import nextTick from 'dai-js/tools/nextTick'
 
 const transparent = 'rgba(2, 2, 2, 0)'
-const polygonColorArray = [ '#f59701', '#0067b6', '#e70014', '#8fc41e', '#00a1be' ]
+const polygonColorArray = ['#f59701', '#0067b6', '#e70014', '#8fc41e', '#00a1be']
-const colorArray = [ '#1B51FF', '#00E5ED', '#7800FF', '#16D783', '#FF7800', '#FFBA00', '#FFD685', '#2A00FF', '#C600FF', '#FF2A00']
+const colorArray = ['#1B51FF', '#00E5ED', '#7800FF', '#16D783', '#FF7800', '#FFBA00', '#FFD685', '#2A00FF', '#C600FF', '#FF2A00']
 const legendList = [
   { name: '#e70014', icon: require('../../../../../assets/img/shuju/volunteer4.png') },
   { name: '#f59701', icon: require('../../../../../assets/img/shuju/volunteer5.png') },
@@ -349,7 +349,7 @@ export default {
         return item.name == name
       })
     },
-    async loadOrgData (level='', orgId='') {
+    async loadOrgData (level = '', orgId = '') {
       const url = "/gov/org/agency/maporg"
       let params = {
         orgId: orgId,
@@ -363,7 +363,7 @@ export default {
             if (!this.isRepeatItem(item.name)) {
               let colorIndex = index < polygonColorArray.length ? index : 0
               item.fillColor = transparent,
-              item.color = polygonColorArray[colorIndex]
+                item.color = polygonColorArray[colorIndex]
               subPolygonList.push(item)
             }
           }
@@ -375,7 +375,7 @@ export default {
         //   color: polygonColorArray[1]
         // }
         // polygonList.push(polygonData)
-        this.polygonList = [ ...this.polygonList, ...subPolygonList ]
+        this.polygonList = [...this.polygonList, ...subPolygonList]
       } else {
         this.$message.error(msg)
       }
@@ -447,11 +447,11 @@ export default {
     //加载地图数据
     loadMap () {
       if (this.isfirstInit) {
-        this.agencyInfo.level = 'agency'
+        // this.agencyInfo.level = 'agency'
         //mapInfo, polygonArray, polIconUrlArray, iconArrays, iconUrlArray
         this.$refs.map.loadMap(this.agencyInfo, this.polygonList, null, this.distributionsList, this.iconUrlArray, null)
       } else {
-        this.$refs.map.refreshMap(this.polygonList, this.distributionsList)
+        this.$refs.map.refreshMap(this.agencyInfo, this.polygonList, this.distributionsList, false)
       }
     },
 
@@ -478,7 +478,7 @@ export default {
         data.organizationPersonnel.forEach(item => {
           organizationPersonnel = `${organizationPersonnel}${item.personName}(${item.personPhone})、`
         })
-        organizationPersonnel = organizationPersonnel.substring(0, organizationPersonnel.length-1)
+        organizationPersonnel = organizationPersonnel.substring(0, organizationPersonnel.length - 1)
       } else {
         organizationPersonnel = '--'
       }
@@ -540,18 +540,18 @@ export default {
 
     //     data.isBdhjShow = data.isBdhj ? data.isBdhj === '0' ? '否' : '是' : '--'
     //     data.genderShow = data.gender ? data.gender === '0' ? '女' : '男' : '--'
-        // let categoriesArray = []
+    // let categoriesArray = []
 
-        // for (let key in data.volunteerCategories) {
+    // for (let key in data.volunteerCategories) {
-        //   categoriesArray.push(data.volunteerCategories[key])
+    //   categoriesArray.push(data.volunteerCategories[key])
 
-        // }
+    // }
 
-        // if (categoriesArray.length > 0) {
+    // if (categoriesArray.length > 0) {
-        //   data.categories = categoriesArray.join(',')
+    //   data.categories = categoriesArray.join(',')
-        // } else {
+    // } else {
-        //   data.categories = '--'
+    //   data.categories = '--'
-        // }
+    // }
 
     //     let showData = `
     //             <div style='font-size:16px; color:#FFFFFF;'>居民信息</div>
@@ -613,6 +613,9 @@ export default {
         if (!this.agencyInfo.level) {
           this.agencyInfo.level = 'street'
         }
+        if (!this.agencyInfo.agencyLevel) {
+          this.agencyInfo.agencyLevel = 'street'
+        }
       } else {
         this.$message.error(msg);
       }
@@ -705,7 +708,7 @@ export default {
   color: #fff;
 }
 .card-left-title::after {
-  content: '';
+  content: "";
   position: absolute;
   top: 50%;
   left: 20px;
@@ -713,7 +716,7 @@ export default {
   height: 12px;
   box-sizing: border-box;
   margin-top: -6px;
-  background: #2865FA;
+  background: #2865fa;
   border-radius: 50%;
 }
 .card-wr-map {

src/views/modules/visual/communityGovern/shijianchuli/shijianchulifenxi.vue

@@ -635,11 +635,10 @@ export default {
             }
 
           };
-          element.selected = !element.selected
+          // element.selected = !element.selected
-          isSelected = element.selected
+          // isSelected = element.selected
         } else {
 
-
           element.selected = false
           element.label = {
             show: false,

src/views/modules/visual/components/screen-map/index.vue

@@ -32,7 +32,7 @@
          class="ol-popup-closer"></a>
       <div id="popup-content"
            class="popup-content"></div>
-      <a href="#" 
+      <a href="#"
          id="popup-goMore"
          class="popup-goMore">更多>>>></a>
     </div>
@@ -107,9 +107,9 @@ let polygonColorArray = [
   'rgba(183, 185, 0, 0.16)'
 ];
 
- //icon文字样式
+//icon文字样式
 let createTextStyle = function (feature) {
-  
+
   if (iconTextsStyle) {
     let iconTextsStyles = { ...iconTextsStyle }
     iconTextsStyles.text = feature.values_ && feature.values_.name || feature.name
@@ -200,7 +200,9 @@ const vueGis = {
       distanceMax: null,//显示的坐标距离中心点的范围                                                    
 
       input_lat: null,
-      input_lon: null
+      input_lon: null,
+
+      isChangeCenter: true,//是否根据多边形改变数组
     }
   },
   async mounted () {
@@ -224,11 +226,10 @@ const vueGis = {
       // iconArrays.forEach(item => {
       //   console.log(item.type, item.urlIndex, item.latitude, item.longitude)
       // });
-      
+
 
       //初始化地图
       this.initMap()
-      
       if (this.showPolIconLayer) {
         console.log('showPolIconLayer++++++++++++++++++++++', this.showPolIconLayer)
         //初始化多边形标注图层
@@ -242,7 +243,7 @@ const vueGis = {
         //加载当前园区的标注
         this.loadPolygon()
       }
-      
+
 
       if (this.showIconLayer) {
         //初始化icon图层
@@ -259,17 +260,24 @@ const vueGis = {
 
     },
 
-    //刷新地图
+    //刷新地图:地图信息，多边形数组，标注数组，是否根据多边形改变中心点
-    async refreshMap (mapInfo, polygonArray, iconArrays) {
+    async refreshMap (mapInfo, polygonArray, iconArrays, isChangeCenter) {
       this.mapInfo = mapInfo
-      this.polygonArray  = []
+      this.polygonArray = []
       this.polygonArray = polygonArray
       this.iconArrays = iconArrays
-      iconSource.clear()
+      this.isChangeCenter = isChangeCenter
-      polygonSource.clear()
+      if (iconSource) {
-      polIconSource.clear()
+        iconSource.clear()
+      }
+      if (polygonSource) {
+        polygonSource.clear()
+      }
+      if (polIconSource) {
+        polIconSource.clear()
+      }
       this.initPolIconLayer()
-      
+
       if (this.showPolygonLayer) {
         this.initPolygonLayer()
         //加载当前园区的标注
@@ -287,7 +295,6 @@ const vueGis = {
       }
       this.setMapLocation()
       // gaodeMapLayer.getSource().changed()
-      
     },
 
     //加载区域多边形
@@ -305,7 +312,7 @@ const vueGis = {
 
             oneData = {
               type: 'Feature',
-        
+
               properties: { ...polygonItem },
               geometry: {
                 type: 'Polygon',
@@ -345,7 +352,7 @@ const vueGis = {
         if (this.showPolIconLayer) {
           this.loadPolIcon(feature)
         }
-        
+
 
       }
 
@@ -530,6 +537,53 @@ const vueGis = {
         this.centerPoint = centerPointGlobal
         this.centerFlag = 'point'
       }
+      // debugger
+      if (this.centerFlag === 'flag_parent') {
+        let parentFeatures = parentLayer.getSource().getFeatures()[0]
+        let polygon = parentFeatures.getGeometry();
+        map.getView().fit(polygon, map.getSize());
+        this.zoom = map.getView().getZoom() - 1
+
+      } else if (this.centerFlag === 'flag_polygon') {
+        let polygonFeatures = polygonLayer.getSource().getFeatures()[0]
+        let polygon = polygonFeatures.getGeometry();
+        map.getView().fit(polygon, map.getSize());
+        this.zoom = map.getView().getZoom() - 1
+
+      } else {
+        mapView.setCenter(this.centerPoint);
+      }
+
+      if (!this.isChangeCenter) {
+        return false
+      }
+      // debugger
+      if (!this.zoom) {
+        this.setZoom(this.mapInfo.agencyLevel)
+      }
+      this.centerPoint = []
+
+      //如果存在中心点（返回时赋值）
+      if (this.center && this.center.length > 0) {
+        this.centerPoint = this.center
+        this.centerFlag = 'point'
+        this.center = []
+
+      } else if (polygonLayer.getSource().getFeatures()[0]) {//如果是初次进入,存在下级组织
+        this.centerFlag = 'flag_polygon'
+        this.centerPoint.push(this.mapInfo.longitude)
+        this.centerPoint.push(this.mapInfo.latitude)
+
+      } else if (this.mapInfo.longitude && this.mapInfo.latitude) {
+        this.centerPoint.push(this.mapInfo.longitude)
+        this.centerPoint.push(this.mapInfo.latitude)
+        this.centerFlag = 'point'
+
+      } else {
+        this.centerPoint = centerPointGlobal
+        this.centerFlag = 'point'
+      }
+
       // debugger
       if (this.centerFlag === 'flag_parent') {
         let parentFeatures = parentLayer.getSource().getFeatures()[0]
@@ -549,9 +603,8 @@ const vueGis = {
       }
       mapView.setZoom(this.zoom);
 
-      
     },
-    firstCentermap() {
+    firstCentermap () {
       if (this.mapInfo.longitude && this.mapInfo.latitude) {
         this.centerPoint = []
         this.centerPoint.push(this.mapInfo.longitude)
@@ -608,7 +661,7 @@ const vueGis = {
               })
             }),
             new Style({
-              // text: createTextStyle(feature) // 报错 暂时注掉 zty 2022.05.19
+              // text: createTextStyle(feature) // 报错 暂时注掉 zhaotongyao 2022.05.19
             })
           ];
           styles['MultiPolygon'] = styles['Polygon'];
@@ -616,13 +669,13 @@ const vueGis = {
         };
       })();
 
-      select = new Select({
+      // select = new Select({
-        style: overlayStyle
+      //   style: overlayStyle
-      });
+      // });
-
+      // 有BUG 加入多边形选中样式时，如果同时存在icon层和多边形层，点击icon会使icon消失 ---zhaotongyao 2022.06.01
 
       map.addLayer(polygonLayer)
-      map.addInteraction(select);
+      // map.addInteraction(select);
 
 
     },
@@ -743,14 +796,14 @@ const vueGis = {
       this.overlay.getElement().parentNode.parentNode.style.display = 'block'
       content.innerHTML = showData;
       this.overlay.setPosition(coordinate);
-       //把 overlay 显示到指定的 x,y坐标
+      //把 overlay 显示到指定的 x,y坐标
-      
+
     },
     // 关闭弹窗
-    handleClosePopup() {
+    handleClosePopup () {
-        this.overlay.setPosition(undefined);
+      this.overlay.setPosition(undefined);
-        document.getElementById("popup-closer").blur();
+      document.getElementById("popup-closer").blur();
-        return false;
+      return false;
     },
 
     //取随机数
@@ -895,7 +948,7 @@ export default vueGis;
 .popup-content {
   width: 300px;
 }
-.popup-goMore{
+.popup-goMore {
   margin: 20px 0;
 }
 .ol-popup-closer:after {