diff --git a/src/views/modules/visual/communityGovern/cpt/project-info.vue b/src/views/modules/visual/communityGovern/cpt/project-info.vue
index 30e768c6..c1ae0326 100644
--- a/src/views/modules/visual/communityGovern/cpt/project-info.vue
+++ b/src/views/modules/visual/communityGovern/cpt/project-info.vue
@@ -581,7 +581,7 @@ export default {
       const { data, code, msg } = await requestPost(url, {
         categoryCodeList: this.categoryCodes,
         userId: this.userId,
-
+        projectId: this.projectIdCopy
       });
 
       if (code === 0) {
diff --git a/src/views/modules/visual/components/screen-map/index.vue b/src/views/modules/visual/components/screen-map/index.vue
index 3e593ed5..eba9be98 100644
--- a/src/views/modules/visual/components/screen-map/index.vue
+++ b/src/views/modules/visual/components/screen-map/index.vue
@@ -3,8 +3,15 @@
     <div class="div_map"
          id="map"
          ref="map">
-      <!-- <div id="map"
-             class="map"></div> -->
+    </div>
+    <div id="popup"
+         style="display: none;"
+         class="ol-popup">
+      <a href="#"
+         id="popup-closer"
+         class="ol-popup-closer"></a>
+      <div id="popup-content"
+           class="popup-content"></div>
     </div>
   </div>
 </template>
@@ -28,6 +35,7 @@ import { getDistance } from 'ol/sphere';
 
 import { mapGetters } from "vuex";
 import { Loading } from 'element-ui'; //引入Loading服务
+
 import { requestPost } from "@/js/dai/request";
 
 
@@ -81,7 +89,8 @@ const vueGis = {
       centerPoint: [],//中心点位置
       zoom: 14,//缩放范围：区14
       minZoom: 1,//最小缩放
-
+      overlay: null,
+      showPopup: false,
       mapInfo: {
 
       },
@@ -172,6 +181,13 @@ const vueGis = {
         this.loadIcon()
       }
 
+      if (this.isAddOpenlay) {
+        //初始化icon图层
+        this.addOverlay()
+      }
+
+
+      this.addMapClick()
 
     },
 
@@ -365,8 +381,6 @@ const vueGis = {
       return (distance < max || distance === max)
 
 
-
-
       // debugger
       //   return 
       // var wgs84Sphere = new ol.Sphere(6378137); 
@@ -405,21 +419,8 @@ const vueGis = {
         //目标加载到map中
       })
 
-      let that = this
-      map.on('singleclick', function (e) {
-        const feature = map.forEachFeatureAtPixel(e.pixel, function (feature) {
-          return feature;
-        });
-        if (feature) {
-          console.log(feature)
-          that.$emit('clickFeature', feature)
-
-        }
 
 
-
-      })
-
       //去除双击放大效果
       const dblClickInteraction = map
         .getInteractions()
@@ -454,7 +455,6 @@ const vueGis = {
 
     },
 
-
     //初始化多边形标注图层
     initPolygonLayer () {
       polygonSource = new VectorSource({
@@ -542,6 +542,83 @@ const vueGis = {
       // });
     },
 
+    //添加覆盖层
+    addOverlay () {
+      // 使用变量存储弹窗所需的 DOM 对象
+      var container = document.getElementById("popup");
+      var closer = document.getElementById("popup-closer");
+      var content = document.getElementById("popup-content");
+
+      // 创建一个弹窗 Overlay 对象
+      this.overlay = new Overlay({
+        element: container, //绑定 Overlay 对象和 DOM 对象的
+        autoPan: true, // 定义弹出窗口在边缘点击时候可能不完整 设置自动平移效果
+        autoPanAnimation: {
+          duration: 250 //自动平移效果的动画时间 9毫秒
+        },
+        zIndex: 100
+      });
+      // 将弹窗添加到 map 地图中
+      map.addOverlay(this.overlay);
+      let _that = this;
+
+      /**
+       * 为弹窗添加一个响应关闭的函数
+       */
+      closer.onclick = function () {
+        _that.overlay.setPosition(undefined);
+        closer.blur();
+        return false;
+      };
+    },
+
+    //注册地图点击事件
+    addMapClick () {
+      let _that = this
+
+
+      map.on("click", function (evt) {
+        const feature = map.forEachFeatureAtPixel(evt.pixel, function (feature) {
+          return feature;
+        });
+        if (feature) {
+          console.log(feature)
+          if (_that.clickType === 'back') {
+
+            _that.$emit('clickFeature', feature)
+
+
+          } else if (_that.clickType === 'popup') {
+            _that.$emit('clickFeature', feature)
+            // _that.overlay.getElement().parentNode.style.display = 'block'
+            // _that.overlay.getElement().parentNode.parentNode.style.display = 'block'
+
+            // content.innerHTML = `
+            //     <p>你点击了这里：</p>
+            //     <p>经纬度：<p><code> </code> <p>
+            //     <p>坐标：</p>X：&nbsp;&nbsp; Y: `;
+            // _that.overlay.setPosition(evt.coordinate); //把 overlay 显示到指定的 x,y坐标
+
+
+          } else {
+            console.log('此处没有标注')
+          }
+
+        }
+
+      });
+    },
+
+    handleShowPopup (showData, coordinate) {
+      console.log(this.overlay.getElement())
+      this.overlay.getElement().style.display = 'block'
+      this.overlay.getElement().parentNode.style.display = 'block'
+      this.overlay.getElement().parentNode.parentNode.style.display = 'block'
+      var content = document.getElementById("popup-content");
+
+      content.innerHTML = showData;
+      this.overlay.setPosition(coordinate); //把 overlay 显示到指定的 x,y坐标
+    },
 
     //取随机数
     getRndBetween (lowerLimit, upperLimit) {
@@ -582,6 +659,17 @@ const vueGis = {
     showIconLayer: {
       type: Boolean,
       default: false
+    },
+    //是否添加弹出框图层
+    isAddOpenlay: {
+      type: Boolean,
+      default: false
+    },
+
+    //点击地图事件类型,back:返回，popup:弹出层
+    clickType: {
+      type: String,
+      default: 'back'
     }
 
   },
@@ -623,4 +711,51 @@ export default vueGis;
 .ol-overlaycontainer-stopevent {
   display: none;
 }
+.ol-popup {
+  position: absolute;
+  background-color: #1257c9;
+  -webkit-filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.2));
+  filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.2));
+  padding: 15px;
+  border-radius: 10px;
+  border: 1px solid #1257c9;
+  bottom: 12px;
+  left: -50px;
+  text-align: left;
+}
+.ol-popup:after,
+.ol-popup:before {
+  top: 100%;
+  border: solid transparent;
+  content: " ";
+  height: 0;
+  width: 0;
+  position: absolute;
+  pointer-events: none;
+}
+.ol-popup:after {
+  border-top-color: 1257c9;
+  border-width: 10px;
+  left: 48px;
+  margin-left: -10px;
+}
+.ol-popup:before {
+  border-top-color: #1257c9;
+  border-width: 11px;
+  left: 48px;
+  margin-left: -11px;
+}
+.ol-popup-closer {
+  text-decoration: none;
+  position: absolute;
+  top: 2px;
+  right: 8px;
+}
+.popup-content {
+  width: 300px;
+}
+.ol-popup-closer:after {
+  content: "✖";
+  color: rgba(1, 17, 104, 1);
+}
 </style>   
\ No newline at end of file
diff --git a/src/views/modules/visual/measure/volunteer.vue b/src/views/modules/visual/measure/volunteer.vue
index 233525b1..2075ccde 100644
--- a/src/views/modules/visual/measure/volunteer.vue
+++ b/src/views/modules/visual/measure/volunteer.vue
@@ -74,8 +74,10 @@
       <div class="card-map">
         <screen-map class="map"
                     ref="map"
-                    @clickFeature="clickProject"
-                    :showIconLayer="true"></screen-map>
+                    @clickFeature="clickMapVolunteer"
+                    :showIconLayer="true"
+                    :clickType="'popup'"
+                    :isAddOpenlay="true"></screen-map>
       </div>
       <div class="map-tips">
 
@@ -293,34 +295,34 @@ export default {
       if (code === 0) {
         console.log('data-ddd', data)
         this.vInfo = data
-        const arr = [{ 
+        const arr = [{
           name: '党员数量',
           value: data.partyTotal,
           itemStyle: {
             color: 'rgba(26, 178, 255, 1)'
           }
-        }, { 
+        }, {
           name: '居民数量',
           value: data.resiTotal,
           itemStyle: {
             color: 'rgba(250, 193, 38, 1)'
           }
         }]
-        const arr1 = [{ 
+        const arr1 = [{
           name: '党员数量',
           value: data.partyServiceTotal,
           itemStyle: {
             color: 'rgba(26, 178, 255, 1)'
           }
-        }, { 
+        }, {
           name: '居民数量',
           value: data.resiServiceTotal,
           temStyle: {
             color: 'rgba(250, 193, 38, 1)'
           }
         }]
-        this.vPersonal = [ ...arr ]
-        this.vCount = [ ...arr1 ]
+        this.vPersonal = [...arr]
+        this.vCount = [...arr1]
         this.vpTotal = data.volunteerTotal
         this.vcTotal = data.serviceTotal
         this.initCharts(data.volunteerTotal, arr)
@@ -438,8 +440,88 @@ export default {
     },
 
     //点击项目
-    clickProject (feature) {
+    async clickMapVolunteer (feature) {
       console.log('标注信息', feature.values_.properties)
+      if (!feature.values_.properties.info.icResiUserId) {
+        return false
+      }
+      const info = feature.values_.properties.info
+      const url = "/epmetuser/icresiuser/resi-brief/" + info.icResiUserId
+      // const url = "http://yapi.elinkservice.cn/mock/245/heart/icpartyunit/distribution"
+
+      let params = {}
+
+      const { data, code, msg } = await requestPost(url, params)
+
+      if (code === 0) {
+        let coordinate = [info.longitude, info.latitude]
+        data.gridName = data.gridName ? data.gridName : '--'
+        data.villageName = data.villageName ? data.villageName : '--'
+        data.icUserName = data.icUserName ? data.icUserName : '--'
+        data.mobile = data.mobile ? data.mobile : '--'
+        data.idCard = data.idCard ? data.idCard : '--'
+        data.birthday = data.birthday ? data.birthday : '--'
+        data.contacts = data.contacts ? data.contacts : '--'
+        data.contactsMobile = data.contactsMobile ? data.contactsMobile : '--'
+
+        data.isBdhjShow = data.isBdhj ? data.isBdhj === '0' ? '否' : '是' : '--'
+        data.genderShow = data.gender ? data.gender === '0' ? '女' : '男' : '--'
+        let categoriesArray = []
+
+        for (let key in data.volunteerCategories) {
+          categoriesArray.push(data.volunteerCategories[key])
+
+        }
+
+
+        if (categoriesArray.length > 0) {
+          data.categories = categoriesArray.join(',')
+        } else {
+          data.categories = '--'
+        }
+
+        let showData = `
+                <div style='font-size:16px; color:#FFFFFF;'>居民信息</div>
+                <div style='font-size:12px; color:#FFFFFF;margin-top:10px'>所属网格：
+                  <span>`+ data.gridName + `</span>
+                </div>
+                <div style='font-size:12px; color:#FFFFFF;margin-top:5px'>所属小区：
+                  <span>`+ data.villageName + `</span>
+                </div>
+                <div style='font-size:12px; color:#FFFFFF;margin-top:5px'>本地户籍：
+                  <span>`+ data.isBdhjShow + `</span>
+                </div>
+                <div style='font-size:12px; color:#FFFFFF;margin-top:5px'>姓名：
+                  <span>`+ data.icUserName + `</span>
+                </div> 
+                <div style='font-size:12px; color:#FFFFFF;margin-top:5px'>手机：
+                  <span>`+ data.mobile + `</span>
+                </div> 
+                <div style='font-size:12px; color:#FFFFFF;margin-top:5px'>性别：
+                  <span>`+ data.genderShow + `</span>
+                </div> 
+                <div style='font-size:12px; color:#FFFFFF;margin-top:5px'>身份证号：
+                  <span>`+ data.idCard + `</span>
+                </div> 
+                <div style='font-size:12px; color:#FFFFFF;margin-top:5px'>出生日期：
+                  <span>`+ data.birthday + `</span>
+                </div> 
+                <div style='font-size:12px; color:#FFFFFF;margin-top:5px'>联系人：
+                  <span>`+ data.contacts + `</span>
+                </div> 
+                <div style='font-size:12px; color:#FFFFFF;margin-top:5px'>联系人手机：
+                  <span>`+ data.contactsMobile + `</span>
+                </div> 
+                <div style='font-size:12px; color:#FFFFFF;margin-top:5px'>志愿者类别：
+                  <span>`+ data.categories + `</span>
+                </div> 
+                `
+        // console.log(showData)
+        this.$refs.map.handleShowPopup(showData, coordinate)
+
+      } else {
+        this.$message.error(msg)
+      }
     },
   },
 };
@@ -596,7 +678,7 @@ export default {
 }
 
 .card-wr-map {
-  height: calc(100vh - 150px);
+  height: calc(100vh - 120px);
   text-align: center;
 
   .card-map {