首页详情隐藏地图修改

src/views/sys/exception/Converge.vue

@@ -64,7 +64,7 @@
       <template #title>
         <div ref="modalTitleRef" style="width: 100%; cursor: move; user-select: none;padding: 16px;display: flex;align-items: center;">
           详情
-          <Icon icon="gis:proj-geo" :size="20" style="margin-left: 20px;cursor: pointer;" @click="hiddenInfoMap = !hiddenInfoMap"/>
+           <div :class="`hidden-show-icon ${hiddenInfoMap? 'show-icon': 'hidden-icon'}`" @click="showOrHiddenInfoMap"></div>
         </div>
       </template>
       <template template #modalRender="{ originVNode }">
@@ -458,6 +458,16 @@ watchEffect(() => {
   const getContainer = () => {
     return document.getElementById('bg-pan')
   }
+  const showOrHiddenInfoMap = () => {
+    hiddenInfoMap.value = !hiddenInfoMap.value
+    if(hiddenInfoMap.value){
+      transformX.value = window.innerWidth * 0.45
+      transformY.value = 0
+    }else{
+      transformX.value = 0
+      transformY.value = 0
+    }
+  }
 </script>
 
 <style lang="less" scoped>
@@ -472,8 +482,20 @@ watchEffect(() => {
     }
     :deep(.dragModal){
       margin: 0 !important;
+      .hidden-show-icon{
+        width: 28px;
+        height: 28px;
+        background-size: 100% 100%;
+        margin-left: 20px;
+        cursor: pointer;
+      }
+      .hidden-icon{
+        background-image: url('/public/iocn/map_hidden.png');
+      }
+      .show-icon{
+        background-image: url('/public/iocn/map_show.png');
+      }
     }
-  
   }
   .button-item {
     width: 96px;