修改POPUP框关闭样式

README.md

@@ -284,4 +284,5 @@ Internal use only.
 3、 对接标书生成进度查询接口 `getTenderProgress`，获取标书按 `c_ai_sczt`（完成/失败/生成中）分流处理
 4、 生成中刷新页面不再误回退到「生成标书」；失败仅在主动「获取标书」或进度失败时回退并清空状态
 5、 续标创建时，在管项目历史标书为 docx 则写入投续标参考标书字段 `c_ckbs`
-6、 修复投标结果页组件导入路径大小写，保证 Windows 下 `vue-tsc` 构建通过
+6、 修复投标结果页组件导入路径大小写，保证 Windows 下 `vue-tsc` 构建通过
+7、 增加项目详情页的地图展示，支持点击面展示相关信息，如有员工可查看员工相关数据

src/components/map/ProMap.vue

@@ -278,6 +278,9 @@ const mapClickValue = (e:any)  => {
     }
 
     const popupContent = `
+    <div class="popup-header">
+        <span class="popup-close-btn" id="popup-close-btn">×</span>
+    </div>
     <div style="font-size:14px;line-height:1.6;padding:10px;">
         <h4 style="margin:0 0 6px 0;color:#222;"><span>内容信息</span><span style="display: ${fet.properties.c_xmygrs>0 ? 'block' : 'none'};" class="more" id="popup-more-btn">员工信息>></span></h4>
         ${str}
@@ -286,9 +289,10 @@ const mapClickValue = (e:any)  => {
 
     if (popup.value) popup.value.remove();
     popup.value = new mapboxgl.Popup({
-        closeButton: true,
+        closeButton: false,
         className: 'custom-popup',
-        maxWidth: '500px'
+        maxWidth: '500px',
+        offset: 12
     })
     .setLngLat(e.lngLat)
     .setHTML(popupContent)
@@ -296,12 +300,18 @@ const mapClickValue = (e:any)  => {
 
     setTimeout(() => {
         const moreBtn = document.getElementById('popup-more-btn');
+        const closeBtn = document.getElementById('popup-close-btn');
         if (moreBtn) {
-        moreBtn.addEventListener('click', () => {
-            tableSearchText.value = "";
-            guid.value = fet.properties.c_guid;
-            handleMoreClick(guid.value,"",0);
-        });
+            moreBtn.addEventListener('click', () => {
+                tableSearchText.value = "";
+                guid.value = fet.properties.c_guid;
+                handleMoreClick(guid.value,"",0);
+            });
+        }
+        if (closeBtn) {
+            closeBtn.addEventListener('click', () => {
+                if (popup.value) popup.value.remove();
+            });
         }
     }, 0);
       
@@ -567,6 +577,23 @@ defineExpose({
 /*节点标签样式 */
 .custom-popup {
   z-index: 9;
+  .popup-header {
+    position: absolute;
+    right: 0px;
+    top: 0px;
+    padding: 0px 6px;
+    height: 20px;
+  }
+  .popup-close-btn{
+    cursor:pointer;
+    width:24px;
+    height:24px;
+    text-align:center;
+    line-height:24px;
+  }
+  .popup-header:hover{
+    background:#e5e5e5;
+  }
 }
 .more{
   float:right;
@@ -574,6 +601,6 @@ defineExpose({
   transition: color 0.2s;
 }
 .more:hover {
-  color: #00A8FF;
+  color: var(--el-color-primary);
 }
 </style>