diff --git a/src/layout/components/HeaderSys/index.vue b/src/layout/components/HeaderSys/index.vue
index 98e2d87..ede66d6 100644
--- a/src/layout/components/HeaderSys/index.vue
+++ b/src/layout/components/HeaderSys/index.vue
@@ -111,7 +111,7 @@
 
 function withdraw() {
   router.push({ path: '/chengguanweiScreen' });
-  localStorage.setItem('routerPartXG', 'FloodSys');
+  localStorage.setItem('routerPartXG', 'FloodSys'); //默认加载排水首页
 }
 
 onMounted(() => {

diff --git a/src/layout/components/HeaderSys/index.vue b/src/layout/components/HeaderSys/index.vue
index 98e2d87..ede66d6 100644
--- a/src/layout/components/HeaderSys/index.vue
+++ b/src/layout/components/HeaderSys/index.vue
@@ -111,7 +111,7 @@
 
 function withdraw() {
   router.push({ path: '/chengguanweiScreen' });
-  localStorage.setItem('routerPartXG', 'FloodSys');
+  localStorage.setItem('routerPartXG', 'FloodSys'); //默认加载排水首页
 }
 
 onMounted(() => {
diff --git a/src/views/login.vue b/src/views/login.vue
index 0846e56..8a414d8 100644
--- a/src/views/login.vue
+++ b/src/views/login.vue
@@ -129,6 +129,7 @@
           // 登录成功之后都加载对应路由
           permissionStore.generateRoutes();
           router.push({ path: '/chengguanweiScreen' });
+          localStorage.setItem('routerPartXG', 'FloodSys'); //默认加载排水首页
           loginLoading.value = false;
         })
         .catch(err => {

diff --git a/src/layout/components/HeaderSys/index.vue b/src/layout/components/HeaderSys/index.vue
index 98e2d87..ede66d6 100644
--- a/src/layout/components/HeaderSys/index.vue
+++ b/src/layout/components/HeaderSys/index.vue
@@ -111,7 +111,7 @@
 
 function withdraw() {
   router.push({ path: '/chengguanweiScreen' });
-  localStorage.setItem('routerPartXG', 'FloodSys');
+  localStorage.setItem('routerPartXG', 'FloodSys'); //默认加载排水首页
 }
 
 onMounted(() => {
diff --git a/src/views/login.vue b/src/views/login.vue
index 0846e56..8a414d8 100644
--- a/src/views/login.vue
+++ b/src/views/login.vue
@@ -129,6 +129,7 @@
           // 登录成功之后都加载对应路由
           permissionStore.generateRoutes();
           router.push({ path: '/chengguanweiScreen' });
+          localStorage.setItem('routerPartXG', 'FloodSys'); //默认加载排水首页
           loginLoading.value = false;
         })
         .catch(err => {
diff --git a/src/views/sponeScreen/HaiMianScreen/index.vue b/src/views/sponeScreen/HaiMianScreen/index.vue
index 238c4eb..117d57f 100644
--- a/src/views/sponeScreen/HaiMianScreen/index.vue
+++ b/src/views/sponeScreen/HaiMianScreen/index.vue
@@ -3,13 +3,13 @@
   <div class="hmMainPage">
     海绵综合一张图首页1920
 
-    <!-- 地图 -->
-    <!-- <GisMapMF></GisMapMF> -->
+    <!-- 图例 -->
+    <Legend></Legend>
   </div>
 </template>
 
 <script setup>
-import GisMapMF from '@/views/sponeScreen/gisMF/map.vue';
+import Legend from '@/views/sponeScreen/gisMF/legendKF.vue';
 import bus from '@/bus';
 
 onMounted(() => {});
@@ -19,6 +19,8 @@
 .hmMainPage {
   width: 100%;
   height: 100%;
+  background: #010e22;
   position: relative;
+  z-index: 210;
 }
 </style>

diff --git a/src/layout/components/HeaderSys/index.vue b/src/layout/components/HeaderSys/index.vue
index 98e2d87..ede66d6 100644
--- a/src/layout/components/HeaderSys/index.vue
+++ b/src/layout/components/HeaderSys/index.vue
@@ -111,7 +111,7 @@
 
 function withdraw() {
   router.push({ path: '/chengguanweiScreen' });
-  localStorage.setItem('routerPartXG', 'FloodSys');
+  localStorage.setItem('routerPartXG', 'FloodSys'); //默认加载排水首页
 }
 
 onMounted(() => {
diff --git a/src/views/login.vue b/src/views/login.vue
index 0846e56..8a414d8 100644
--- a/src/views/login.vue
+++ b/src/views/login.vue
@@ -129,6 +129,7 @@
           // 登录成功之后都加载对应路由
           permissionStore.generateRoutes();
           router.push({ path: '/chengguanweiScreen' });
+          localStorage.setItem('routerPartXG', 'FloodSys'); //默认加载排水首页
           loginLoading.value = false;
         })
         .catch(err => {
diff --git a/src/views/sponeScreen/HaiMianScreen/index.vue b/src/views/sponeScreen/HaiMianScreen/index.vue
index 238c4eb..117d57f 100644
--- a/src/views/sponeScreen/HaiMianScreen/index.vue
+++ b/src/views/sponeScreen/HaiMianScreen/index.vue
@@ -3,13 +3,13 @@
   <div class="hmMainPage">
     海绵综合一张图首页1920
 
-    <!-- 地图 -->
-    <!-- <GisMapMF></GisMapMF> -->
+    <!-- 图例 -->
+    <Legend></Legend>
   </div>
 </template>
 
 <script setup>
-import GisMapMF from '@/views/sponeScreen/gisMF/map.vue';
+import Legend from '@/views/sponeScreen/gisMF/legendKF.vue';
 import bus from '@/bus';
 
 onMounted(() => {});
@@ -19,6 +19,8 @@
 .hmMainPage {
   width: 100%;
   height: 100%;
+  background: #010e22;
   position: relative;
+  z-index: 210;
 }
 </style>
diff --git a/src/views/sponeScreen/chengguanweiScreen/index.vue b/src/views/sponeScreen/chengguanweiScreen/index.vue
index 4436d78..12fd18c 100644
--- a/src/views/sponeScreen/chengguanweiScreen/index.vue
+++ b/src/views/sponeScreen/chengguanweiScreen/index.vue
@@ -1,31 +1,49 @@
 <template>
   <!-- 海绵综合一张图首页 -->
-  <div class="hmMainPage">
-    海绵综合一张图首页4k分辨率
+  <div class="hmzhOnemap">
+    <!-- 3800*866 -->
+    <MainPageFive v-if="ifCGW"></MainPageFive>
 
-    <el-button type="primary" @click="zxt">跳转子系统</el-button>
+    <!-- 1920*1080 -->
+    <MainPage v-if="!ifCGW"></MainPage>
+
     <!-- 地图 -->
-    <!-- <GisMapMF></GisMapMF> -->
-    <legend></legend>
+    <GisMapMF></GisMapMF>
   </div>
 </template>
 
 <script setup>
 import bus from '@/bus';
 import GisMapMF from '@/views/sponeScreen/gisMF/cesiumMap.vue';
-import legend from '@/views/sponeScreen/gisMF/legend.vue';
+import MainPage from '@/views/sponeScreen/HaiMianScreen/index.vue'; //1920
+import MainPageFive from '@/views/sponeScreen/chengguanweiScreen/mainIndex.vue'; //3800
+
 const router = useRouter();
+const ifCGW = ref(false);
 function zxt() {
   router.push({ path: '/index' });
 }
-onMounted(() => {});
+
+// 兼容城管委15楼大屏3800*866和1920*1080
+function setScreenType() {
+  let widths = window.innerWidth;
+  console.log('widths---', widths);
+  if (widths > 3500) {
+    ifCGW.value = true;
+  } else {
+    ifCGW.value = false;
+  }
+}
+
+onMounted(() => {
+  setScreenType(); //兼容城管委15楼大屏3800*866和1920*1080
+});
 </script>
 
 <style scoped lang="scss">
-.hmMainPage {
+.hmzhOnemap {
   width: 100%;
   height: 100%;
-  background: #010e22;
-  position: relative;
+  overflow: hidden;
 }
 </style>

diff --git a/src/layout/components/HeaderSys/index.vue b/src/layout/components/HeaderSys/index.vue
index 98e2d87..ede66d6 100644
--- a/src/layout/components/HeaderSys/index.vue
+++ b/src/layout/components/HeaderSys/index.vue
@@ -111,7 +111,7 @@
 
 function withdraw() {
   router.push({ path: '/chengguanweiScreen' });
-  localStorage.setItem('routerPartXG', 'FloodSys');
+  localStorage.setItem('routerPartXG', 'FloodSys'); //默认加载排水首页
 }
 
 onMounted(() => {
diff --git a/src/views/login.vue b/src/views/login.vue
index 0846e56..8a414d8 100644
--- a/src/views/login.vue
+++ b/src/views/login.vue
@@ -129,6 +129,7 @@
           // 登录成功之后都加载对应路由
           permissionStore.generateRoutes();
           router.push({ path: '/chengguanweiScreen' });
+          localStorage.setItem('routerPartXG', 'FloodSys'); //默认加载排水首页
           loginLoading.value = false;
         })
         .catch(err => {
diff --git a/src/views/sponeScreen/HaiMianScreen/index.vue b/src/views/sponeScreen/HaiMianScreen/index.vue
index 238c4eb..117d57f 100644
--- a/src/views/sponeScreen/HaiMianScreen/index.vue
+++ b/src/views/sponeScreen/HaiMianScreen/index.vue
@@ -3,13 +3,13 @@
   <div class="hmMainPage">
     海绵综合一张图首页1920
 
-    <!-- 地图 -->
-    <!-- <GisMapMF></GisMapMF> -->
+    <!-- 图例 -->
+    <Legend></Legend>
   </div>
 </template>
 
 <script setup>
-import GisMapMF from '@/views/sponeScreen/gisMF/map.vue';
+import Legend from '@/views/sponeScreen/gisMF/legendKF.vue';
 import bus from '@/bus';
 
 onMounted(() => {});
@@ -19,6 +19,8 @@
 .hmMainPage {
   width: 100%;
   height: 100%;
+  background: #010e22;
   position: relative;
+  z-index: 210;
 }
 </style>
diff --git a/src/views/sponeScreen/chengguanweiScreen/index.vue b/src/views/sponeScreen/chengguanweiScreen/index.vue
index 4436d78..12fd18c 100644
--- a/src/views/sponeScreen/chengguanweiScreen/index.vue
+++ b/src/views/sponeScreen/chengguanweiScreen/index.vue
@@ -1,31 +1,49 @@
 <template>
   <!-- 海绵综合一张图首页 -->
-  <div class="hmMainPage">
-    海绵综合一张图首页4k分辨率
+  <div class="hmzhOnemap">
+    <!-- 3800*866 -->
+    <MainPageFive v-if="ifCGW"></MainPageFive>
 
-    <el-button type="primary" @click="zxt">跳转子系统</el-button>
+    <!-- 1920*1080 -->
+    <MainPage v-if="!ifCGW"></MainPage>
+
     <!-- 地图 -->
-    <!-- <GisMapMF></GisMapMF> -->
-    <legend></legend>
+    <GisMapMF></GisMapMF>
   </div>
 </template>
 
 <script setup>
 import bus from '@/bus';
 import GisMapMF from '@/views/sponeScreen/gisMF/cesiumMap.vue';
-import legend from '@/views/sponeScreen/gisMF/legend.vue';
+import MainPage from '@/views/sponeScreen/HaiMianScreen/index.vue'; //1920
+import MainPageFive from '@/views/sponeScreen/chengguanweiScreen/mainIndex.vue'; //3800
+
 const router = useRouter();
+const ifCGW = ref(false);
 function zxt() {
   router.push({ path: '/index' });
 }
-onMounted(() => {});
+
+// 兼容城管委15楼大屏3800*866和1920*1080
+function setScreenType() {
+  let widths = window.innerWidth;
+  console.log('widths---', widths);
+  if (widths > 3500) {
+    ifCGW.value = true;
+  } else {
+    ifCGW.value = false;
+  }
+}
+
+onMounted(() => {
+  setScreenType(); //兼容城管委15楼大屏3800*866和1920*1080
+});
 </script>
 
 <style scoped lang="scss">
-.hmMainPage {
+.hmzhOnemap {
   width: 100%;
   height: 100%;
-  background: #010e22;
-  position: relative;
+  overflow: hidden;
 }
 </style>
diff --git a/src/views/sponeScreen/chengguanweiScreen/mainIndex.vue b/src/views/sponeScreen/chengguanweiScreen/mainIndex.vue
new file mode 100644
index 0000000..3aad0fd
--- /dev/null
+++ b/src/views/sponeScreen/chengguanweiScreen/mainIndex.vue
@@ -0,0 +1,21 @@
+<template>
+  <!-- 3800*866 城管委-->
+  <div class="cgwFivthScreen">3800*866 城管委</div>
+</template>
+
+<script setup>
+const { proxy } = getCurrentInstance();
+
+onMounted(() => {});
+</script>
+
+<style lang="scss" scoped>
+.cgwFivthScreen {
+  // prettier-ignore
+  width:3800PX;
+  height: 866px;
+  background: #010e22;
+  overflow: auto;
+  position: relative;
+}
+</style>

diff --git a/src/layout/components/HeaderSys/index.vue b/src/layout/components/HeaderSys/index.vue
index 98e2d87..ede66d6 100644
--- a/src/layout/components/HeaderSys/index.vue
+++ b/src/layout/components/HeaderSys/index.vue
@@ -111,7 +111,7 @@
 
 function withdraw() {
   router.push({ path: '/chengguanweiScreen' });
-  localStorage.setItem('routerPartXG', 'FloodSys');
+  localStorage.setItem('routerPartXG', 'FloodSys'); //默认加载排水首页
 }
 
 onMounted(() => {
diff --git a/src/views/login.vue b/src/views/login.vue
index 0846e56..8a414d8 100644
--- a/src/views/login.vue
+++ b/src/views/login.vue
@@ -129,6 +129,7 @@
           // 登录成功之后都加载对应路由
           permissionStore.generateRoutes();
           router.push({ path: '/chengguanweiScreen' });
+          localStorage.setItem('routerPartXG', 'FloodSys'); //默认加载排水首页
           loginLoading.value = false;
         })
         .catch(err => {
diff --git a/src/views/sponeScreen/HaiMianScreen/index.vue b/src/views/sponeScreen/HaiMianScreen/index.vue
index 238c4eb..117d57f 100644
--- a/src/views/sponeScreen/HaiMianScreen/index.vue
+++ b/src/views/sponeScreen/HaiMianScreen/index.vue
@@ -3,13 +3,13 @@
   <div class="hmMainPage">
     海绵综合一张图首页1920
 
-    <!-- 地图 -->
-    <!-- <GisMapMF></GisMapMF> -->
+    <!-- 图例 -->
+    <Legend></Legend>
   </div>
 </template>
 
 <script setup>
-import GisMapMF from '@/views/sponeScreen/gisMF/map.vue';
+import Legend from '@/views/sponeScreen/gisMF/legendKF.vue';
 import bus from '@/bus';
 
 onMounted(() => {});
@@ -19,6 +19,8 @@
 .hmMainPage {
   width: 100%;
   height: 100%;
+  background: #010e22;
   position: relative;
+  z-index: 210;
 }
 </style>
diff --git a/src/views/sponeScreen/chengguanweiScreen/index.vue b/src/views/sponeScreen/chengguanweiScreen/index.vue
index 4436d78..12fd18c 100644
--- a/src/views/sponeScreen/chengguanweiScreen/index.vue
+++ b/src/views/sponeScreen/chengguanweiScreen/index.vue
@@ -1,31 +1,49 @@
 <template>
   <!-- 海绵综合一张图首页 -->
-  <div class="hmMainPage">
-    海绵综合一张图首页4k分辨率
+  <div class="hmzhOnemap">
+    <!-- 3800*866 -->
+    <MainPageFive v-if="ifCGW"></MainPageFive>
 
-    <el-button type="primary" @click="zxt">跳转子系统</el-button>
+    <!-- 1920*1080 -->
+    <MainPage v-if="!ifCGW"></MainPage>
+
     <!-- 地图 -->
-    <!-- <GisMapMF></GisMapMF> -->
-    <legend></legend>
+    <GisMapMF></GisMapMF>
   </div>
 </template>
 
 <script setup>
 import bus from '@/bus';
 import GisMapMF from '@/views/sponeScreen/gisMF/cesiumMap.vue';
-import legend from '@/views/sponeScreen/gisMF/legend.vue';
+import MainPage from '@/views/sponeScreen/HaiMianScreen/index.vue'; //1920
+import MainPageFive from '@/views/sponeScreen/chengguanweiScreen/mainIndex.vue'; //3800
+
 const router = useRouter();
+const ifCGW = ref(false);
 function zxt() {
   router.push({ path: '/index' });
 }
-onMounted(() => {});
+
+// 兼容城管委15楼大屏3800*866和1920*1080
+function setScreenType() {
+  let widths = window.innerWidth;
+  console.log('widths---', widths);
+  if (widths > 3500) {
+    ifCGW.value = true;
+  } else {
+    ifCGW.value = false;
+  }
+}
+
+onMounted(() => {
+  setScreenType(); //兼容城管委15楼大屏3800*866和1920*1080
+});
 </script>
 
 <style scoped lang="scss">
-.hmMainPage {
+.hmzhOnemap {
   width: 100%;
   height: 100%;
-  background: #010e22;
-  position: relative;
+  overflow: hidden;
 }
 </style>
diff --git a/src/views/sponeScreen/chengguanweiScreen/mainIndex.vue b/src/views/sponeScreen/chengguanweiScreen/mainIndex.vue
new file mode 100644
index 0000000..3aad0fd
--- /dev/null
+++ b/src/views/sponeScreen/chengguanweiScreen/mainIndex.vue
@@ -0,0 +1,21 @@
+<template>
+  <!-- 3800*866 城管委-->
+  <div class="cgwFivthScreen">3800*866 城管委</div>
+</template>
+
+<script setup>
+const { proxy } = getCurrentInstance();
+
+onMounted(() => {});
+</script>
+
+<style lang="scss" scoped>
+.cgwFivthScreen {
+  // prettier-ignore
+  width:3800PX;
+  height: 866px;
+  background: #010e22;
+  overflow: auto;
+  position: relative;
+}
+</style>
diff --git a/src/views/sponeScreen/gisMF/cesiumMap.vue b/src/views/sponeScreen/gisMF/cesiumMap.vue
index 0c72c08..45a3e8a 100644
--- a/src/views/sponeScreen/gisMF/cesiumMap.vue
+++ b/src/views/sponeScreen/gisMF/cesiumMap.vue
@@ -37,5 +37,9 @@
 .mapContainerMF {
   width: 100%;
   height: 100%;
+  position: absolute;
+  top: 0px;
+  left: 0px;
+  z-index: 100;
 }
 </style>

diff --git a/src/layout/components/HeaderSys/index.vue b/src/layout/components/HeaderSys/index.vue
index 98e2d87..ede66d6 100644
--- a/src/layout/components/HeaderSys/index.vue
+++ b/src/layout/components/HeaderSys/index.vue
@@ -111,7 +111,7 @@
 
 function withdraw() {
   router.push({ path: '/chengguanweiScreen' });
-  localStorage.setItem('routerPartXG', 'FloodSys');
+  localStorage.setItem('routerPartXG', 'FloodSys'); //默认加载排水首页
 }
 
 onMounted(() => {
diff --git a/src/views/login.vue b/src/views/login.vue
index 0846e56..8a414d8 100644
--- a/src/views/login.vue
+++ b/src/views/login.vue
@@ -129,6 +129,7 @@
           // 登录成功之后都加载对应路由
           permissionStore.generateRoutes();
           router.push({ path: '/chengguanweiScreen' });
+          localStorage.setItem('routerPartXG', 'FloodSys'); //默认加载排水首页
           loginLoading.value = false;
         })
         .catch(err => {
diff --git a/src/views/sponeScreen/HaiMianScreen/index.vue b/src/views/sponeScreen/HaiMianScreen/index.vue
index 238c4eb..117d57f 100644
--- a/src/views/sponeScreen/HaiMianScreen/index.vue
+++ b/src/views/sponeScreen/HaiMianScreen/index.vue
@@ -3,13 +3,13 @@
   <div class="hmMainPage">
     海绵综合一张图首页1920
 
-    <!-- 地图 -->
-    <!-- <GisMapMF></GisMapMF> -->
+    <!-- 图例 -->
+    <Legend></Legend>
   </div>
 </template>
 
 <script setup>
-import GisMapMF from '@/views/sponeScreen/gisMF/map.vue';
+import Legend from '@/views/sponeScreen/gisMF/legendKF.vue';
 import bus from '@/bus';
 
 onMounted(() => {});
@@ -19,6 +19,8 @@
 .hmMainPage {
   width: 100%;
   height: 100%;
+  background: #010e22;
   position: relative;
+  z-index: 210;
 }
 </style>
diff --git a/src/views/sponeScreen/chengguanweiScreen/index.vue b/src/views/sponeScreen/chengguanweiScreen/index.vue
index 4436d78..12fd18c 100644
--- a/src/views/sponeScreen/chengguanweiScreen/index.vue
+++ b/src/views/sponeScreen/chengguanweiScreen/index.vue
@@ -1,31 +1,49 @@
 <template>
   <!-- 海绵综合一张图首页 -->
-  <div class="hmMainPage">
-    海绵综合一张图首页4k分辨率
+  <div class="hmzhOnemap">
+    <!-- 3800*866 -->
+    <MainPageFive v-if="ifCGW"></MainPageFive>
 
-    <el-button type="primary" @click="zxt">跳转子系统</el-button>
+    <!-- 1920*1080 -->
+    <MainPage v-if="!ifCGW"></MainPage>
+
     <!-- 地图 -->
-    <!-- <GisMapMF></GisMapMF> -->
-    <legend></legend>
+    <GisMapMF></GisMapMF>
   </div>
 </template>
 
 <script setup>
 import bus from '@/bus';
 import GisMapMF from '@/views/sponeScreen/gisMF/cesiumMap.vue';
-import legend from '@/views/sponeScreen/gisMF/legend.vue';
+import MainPage from '@/views/sponeScreen/HaiMianScreen/index.vue'; //1920
+import MainPageFive from '@/views/sponeScreen/chengguanweiScreen/mainIndex.vue'; //3800
+
 const router = useRouter();
+const ifCGW = ref(false);
 function zxt() {
   router.push({ path: '/index' });
 }
-onMounted(() => {});
+
+// 兼容城管委15楼大屏3800*866和1920*1080
+function setScreenType() {
+  let widths = window.innerWidth;
+  console.log('widths---', widths);
+  if (widths > 3500) {
+    ifCGW.value = true;
+  } else {
+    ifCGW.value = false;
+  }
+}
+
+onMounted(() => {
+  setScreenType(); //兼容城管委15楼大屏3800*866和1920*1080
+});
 </script>
 
 <style scoped lang="scss">
-.hmMainPage {
+.hmzhOnemap {
   width: 100%;
   height: 100%;
-  background: #010e22;
-  position: relative;
+  overflow: hidden;
 }
 </style>
diff --git a/src/views/sponeScreen/chengguanweiScreen/mainIndex.vue b/src/views/sponeScreen/chengguanweiScreen/mainIndex.vue
new file mode 100644
index 0000000..3aad0fd
--- /dev/null
+++ b/src/views/sponeScreen/chengguanweiScreen/mainIndex.vue
@@ -0,0 +1,21 @@
+<template>
+  <!-- 3800*866 城管委-->
+  <div class="cgwFivthScreen">3800*866 城管委</div>
+</template>
+
+<script setup>
+const { proxy } = getCurrentInstance();
+
+onMounted(() => {});
+</script>
+
+<style lang="scss" scoped>
+.cgwFivthScreen {
+  // prettier-ignore
+  width:3800PX;
+  height: 866px;
+  background: #010e22;
+  overflow: auto;
+  position: relative;
+}
+</style>
diff --git a/src/views/sponeScreen/gisMF/cesiumMap.vue b/src/views/sponeScreen/gisMF/cesiumMap.vue
index 0c72c08..45a3e8a 100644
--- a/src/views/sponeScreen/gisMF/cesiumMap.vue
+++ b/src/views/sponeScreen/gisMF/cesiumMap.vue
@@ -37,5 +37,9 @@
 .mapContainerMF {
   width: 100%;
   height: 100%;
+  position: absolute;
+  top: 0px;
+  left: 0px;
+  z-index: 100;
 }
 </style>
diff --git a/src/views/sponeScreen/gisMF/legend.vue b/src/views/sponeScreen/gisMF/legend.vue
deleted file mode 100644
index c65cd3e..0000000
--- a/src/views/sponeScreen/gisMF/legend.vue
+++ /dev/null
@@ -1,131 +0,0 @@
-<template>
-  <div class="lengendPage">
-    <!-- 展开收起 -->
-    <div :class="['zksqImg', 'animate__animated', ifExpand ? 'animate__fadeInLeft' : 'goLeft']" title="展开收起" @click="changeZhan"></div>
-    <!-- 图例框 -->
-    <div :class="['publicLegend', 'animate__animated', ifExpand ? 'animate__fadeInLeft' : 'animate__fadeOutLeft']">
-      <div v-for="item in legendList" :key="item.layername">
-        <div class="titleB" @click="changeAllLegend(item)">
-          {{ item.title }}
-          <div class="iconImg">
-            <el-icon v-if="item.isCheck" size="22">
-              <Check />
-            </el-icon>
-          </div>
-        </div>
-        <div class="part" v-for="item2 in item.children" @click="changeLegend(item2)" :key="item2.layername">
-          <img :src="getImageUrl(item2.url, 'newImgs/layerIcon')" class="img" />
-          <p class="title">{{ item2.name }}</p>
-          <div class="iconImg">
-            <el-icon v-if="item2.isCheck" size="22">
-              <Check />
-            </el-icon>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script setup>
-import { getImageUrl } from '@/utils/ruoyi';
-import cesiumMapLegend from './cesiumMapLegend.js';
-const { proxy } = getCurrentInstance();
-const legendList = ref([]);
-const ifExpand = ref(true);
-// 展开收起
-const changeZhan = () => {
-  ifExpand.value = !ifExpand.value;
-};
-
-onMounted(() => {
-  console.log('1111111111');
-  legendList.value = cesiumMapLegend;
-  console.log('legendList.value---', legendList.value);
-});
-</script>
-
-<style lang="scss">
-.lengendPage {
-  .zksqImg {
-    width: 13px;
-    height: 130px;
-    background: url('@/assets/newImgs/down.png');
-    background-size: 100% 100%;
-    border-radius: 10px 10px 0px 0px;
-    position: absolute;
-    top: 40%;
-    left: 243px;
-    z-index: 115;
-    cursor: pointer;
-  }
-  .goLeft {
-    left: 2px;
-  }
-  .publicLegend {
-    background: #00314e;
-    border: 1px solid #094065;
-    box-shadow: 0px 0px 14px 0px rgba(0, 0, 0, 0.68);
-    opacity: 0.7;
-    border-radius: 10px;
-    position: absolute;
-    top: 10%;
-    left: 5px;
-    z-index: 110;
-    height: 750px;
-    width: 240px;
-    overflow: auto;
-    .titleB {
-      display: flex;
-      height: 35px;
-      line-height: 35px;
-      background: #094065;
-      font-size: 16px;
-      padding-left: 10px;
-      .iconImg {
-        margin-left: 125px;
-        margin-top: 5px;
-        height: 20px;
-        .el-icon {
-          font-weight: bold;
-          &.active {
-            color: #00ee6f;
-          }
-        }
-      }
-    }
-    .part {
-      display: flex;
-      height: 40px;
-      align-items: center;
-      cursor: pointer;
-      &:hover {
-        background: #08596a;
-      }
-      .img {
-        width: 12px;
-        height: 12px;
-        margin-left: 15px;
-        margin-right: 5px;
-      }
-      .title {
-        margin-left: 5px;
-        font-size: 14px;
-        height: 30px;
-        line-height: 30px;
-        width: 155px;
-      }
-      .iconImg {
-        width: 20px;
-        height: 20px;
-        .el-icon {
-          font-weight: bold;
-          &.active {
-            color: #00ee6f;
-          }
-        }
-      }
-    }
-  }
-}
-</style>

diff --git a/src/layout/components/HeaderSys/index.vue b/src/layout/components/HeaderSys/index.vue
index 98e2d87..ede66d6 100644
--- a/src/layout/components/HeaderSys/index.vue
+++ b/src/layout/components/HeaderSys/index.vue
@@ -111,7 +111,7 @@
 
 function withdraw() {
   router.push({ path: '/chengguanweiScreen' });
-  localStorage.setItem('routerPartXG', 'FloodSys');
+  localStorage.setItem('routerPartXG', 'FloodSys'); //默认加载排水首页
 }
 
 onMounted(() => {
diff --git a/src/views/login.vue b/src/views/login.vue
index 0846e56..8a414d8 100644
--- a/src/views/login.vue
+++ b/src/views/login.vue
@@ -129,6 +129,7 @@
           // 登录成功之后都加载对应路由
           permissionStore.generateRoutes();
           router.push({ path: '/chengguanweiScreen' });
+          localStorage.setItem('routerPartXG', 'FloodSys'); //默认加载排水首页
           loginLoading.value = false;
         })
         .catch(err => {
diff --git a/src/views/sponeScreen/HaiMianScreen/index.vue b/src/views/sponeScreen/HaiMianScreen/index.vue
index 238c4eb..117d57f 100644
--- a/src/views/sponeScreen/HaiMianScreen/index.vue
+++ b/src/views/sponeScreen/HaiMianScreen/index.vue
@@ -3,13 +3,13 @@
   <div class="hmMainPage">
     海绵综合一张图首页1920
 
-    <!-- 地图 -->
-    <!-- <GisMapMF></GisMapMF> -->
+    <!-- 图例 -->
+    <Legend></Legend>
   </div>
 </template>
 
 <script setup>
-import GisMapMF from '@/views/sponeScreen/gisMF/map.vue';
+import Legend from '@/views/sponeScreen/gisMF/legendKF.vue';
 import bus from '@/bus';
 
 onMounted(() => {});
@@ -19,6 +19,8 @@
 .hmMainPage {
   width: 100%;
   height: 100%;
+  background: #010e22;
   position: relative;
+  z-index: 210;
 }
 </style>
diff --git a/src/views/sponeScreen/chengguanweiScreen/index.vue b/src/views/sponeScreen/chengguanweiScreen/index.vue
index 4436d78..12fd18c 100644
--- a/src/views/sponeScreen/chengguanweiScreen/index.vue
+++ b/src/views/sponeScreen/chengguanweiScreen/index.vue
@@ -1,31 +1,49 @@
 <template>
   <!-- 海绵综合一张图首页 -->
-  <div class="hmMainPage">
-    海绵综合一张图首页4k分辨率
+  <div class="hmzhOnemap">
+    <!-- 3800*866 -->
+    <MainPageFive v-if="ifCGW"></MainPageFive>
 
-    <el-button type="primary" @click="zxt">跳转子系统</el-button>
+    <!-- 1920*1080 -->
+    <MainPage v-if="!ifCGW"></MainPage>
+
     <!-- 地图 -->
-    <!-- <GisMapMF></GisMapMF> -->
-    <legend></legend>
+    <GisMapMF></GisMapMF>
   </div>
 </template>
 
 <script setup>
 import bus from '@/bus';
 import GisMapMF from '@/views/sponeScreen/gisMF/cesiumMap.vue';
-import legend from '@/views/sponeScreen/gisMF/legend.vue';
+import MainPage from '@/views/sponeScreen/HaiMianScreen/index.vue'; //1920
+import MainPageFive from '@/views/sponeScreen/chengguanweiScreen/mainIndex.vue'; //3800
+
 const router = useRouter();
+const ifCGW = ref(false);
 function zxt() {
   router.push({ path: '/index' });
 }
-onMounted(() => {});
+
+// 兼容城管委15楼大屏3800*866和1920*1080
+function setScreenType() {
+  let widths = window.innerWidth;
+  console.log('widths---', widths);
+  if (widths > 3500) {
+    ifCGW.value = true;
+  } else {
+    ifCGW.value = false;
+  }
+}
+
+onMounted(() => {
+  setScreenType(); //兼容城管委15楼大屏3800*866和1920*1080
+});
 </script>
 
 <style scoped lang="scss">
-.hmMainPage {
+.hmzhOnemap {
   width: 100%;
   height: 100%;
-  background: #010e22;
-  position: relative;
+  overflow: hidden;
 }
 </style>
diff --git a/src/views/sponeScreen/chengguanweiScreen/mainIndex.vue b/src/views/sponeScreen/chengguanweiScreen/mainIndex.vue
new file mode 100644
index 0000000..3aad0fd
--- /dev/null
+++ b/src/views/sponeScreen/chengguanweiScreen/mainIndex.vue
@@ -0,0 +1,21 @@
+<template>
+  <!-- 3800*866 城管委-->
+  <div class="cgwFivthScreen">3800*866 城管委</div>
+</template>
+
+<script setup>
+const { proxy } = getCurrentInstance();
+
+onMounted(() => {});
+</script>
+
+<style lang="scss" scoped>
+.cgwFivthScreen {
+  // prettier-ignore
+  width:3800PX;
+  height: 866px;
+  background: #010e22;
+  overflow: auto;
+  position: relative;
+}
+</style>
diff --git a/src/views/sponeScreen/gisMF/cesiumMap.vue b/src/views/sponeScreen/gisMF/cesiumMap.vue
index 0c72c08..45a3e8a 100644
--- a/src/views/sponeScreen/gisMF/cesiumMap.vue
+++ b/src/views/sponeScreen/gisMF/cesiumMap.vue
@@ -37,5 +37,9 @@
 .mapContainerMF {
   width: 100%;
   height: 100%;
+  position: absolute;
+  top: 0px;
+  left: 0px;
+  z-index: 100;
 }
 </style>
diff --git a/src/views/sponeScreen/gisMF/legend.vue b/src/views/sponeScreen/gisMF/legend.vue
deleted file mode 100644
index c65cd3e..0000000
--- a/src/views/sponeScreen/gisMF/legend.vue
+++ /dev/null
@@ -1,131 +0,0 @@
-<template>
-  <div class="lengendPage">
-    <!-- 展开收起 -->
-    <div :class="['zksqImg', 'animate__animated', ifExpand ? 'animate__fadeInLeft' : 'goLeft']" title="展开收起" @click="changeZhan"></div>
-    <!-- 图例框 -->
-    <div :class="['publicLegend', 'animate__animated', ifExpand ? 'animate__fadeInLeft' : 'animate__fadeOutLeft']">
-      <div v-for="item in legendList" :key="item.layername">
-        <div class="titleB" @click="changeAllLegend(item)">
-          {{ item.title }}
-          <div class="iconImg">
-            <el-icon v-if="item.isCheck" size="22">
-              <Check />
-            </el-icon>
-          </div>
-        </div>
-        <div class="part" v-for="item2 in item.children" @click="changeLegend(item2)" :key="item2.layername">
-          <img :src="getImageUrl(item2.url, 'newImgs/layerIcon')" class="img" />
-          <p class="title">{{ item2.name }}</p>
-          <div class="iconImg">
-            <el-icon v-if="item2.isCheck" size="22">
-              <Check />
-            </el-icon>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script setup>
-import { getImageUrl } from '@/utils/ruoyi';
-import cesiumMapLegend from './cesiumMapLegend.js';
-const { proxy } = getCurrentInstance();
-const legendList = ref([]);
-const ifExpand = ref(true);
-// 展开收起
-const changeZhan = () => {
-  ifExpand.value = !ifExpand.value;
-};
-
-onMounted(() => {
-  console.log('1111111111');
-  legendList.value = cesiumMapLegend;
-  console.log('legendList.value---', legendList.value);
-});
-</script>
-
-<style lang="scss">
-.lengendPage {
-  .zksqImg {
-    width: 13px;
-    height: 130px;
-    background: url('@/assets/newImgs/down.png');
-    background-size: 100% 100%;
-    border-radius: 10px 10px 0px 0px;
-    position: absolute;
-    top: 40%;
-    left: 243px;
-    z-index: 115;
-    cursor: pointer;
-  }
-  .goLeft {
-    left: 2px;
-  }
-  .publicLegend {
-    background: #00314e;
-    border: 1px solid #094065;
-    box-shadow: 0px 0px 14px 0px rgba(0, 0, 0, 0.68);
-    opacity: 0.7;
-    border-radius: 10px;
-    position: absolute;
-    top: 10%;
-    left: 5px;
-    z-index: 110;
-    height: 750px;
-    width: 240px;
-    overflow: auto;
-    .titleB {
-      display: flex;
-      height: 35px;
-      line-height: 35px;
-      background: #094065;
-      font-size: 16px;
-      padding-left: 10px;
-      .iconImg {
-        margin-left: 125px;
-        margin-top: 5px;
-        height: 20px;
-        .el-icon {
-          font-weight: bold;
-          &.active {
-            color: #00ee6f;
-          }
-        }
-      }
-    }
-    .part {
-      display: flex;
-      height: 40px;
-      align-items: center;
-      cursor: pointer;
-      &:hover {
-        background: #08596a;
-      }
-      .img {
-        width: 12px;
-        height: 12px;
-        margin-left: 15px;
-        margin-right: 5px;
-      }
-      .title {
-        margin-left: 5px;
-        font-size: 14px;
-        height: 30px;
-        line-height: 30px;
-        width: 155px;
-      }
-      .iconImg {
-        width: 20px;
-        height: 20px;
-        .el-icon {
-          font-weight: bold;
-          &.active {
-            color: #00ee6f;
-          }
-        }
-      }
-    }
-  }
-}
-</style>
diff --git a/src/views/sponeScreen/gisMF/legendKF.vue b/src/views/sponeScreen/gisMF/legendKF.vue
new file mode 100644
index 0000000..584904c
--- /dev/null
+++ b/src/views/sponeScreen/gisMF/legendKF.vue
@@ -0,0 +1,132 @@
+<template>
+  <!-- 海绵综合一张图图例 -->
+  <div class="lengendPage">
+    <!-- 展开收起 -->
+    <div :class="['zksqImg', 'animate__animated', ifExpand ? 'animate__fadeInLeft' : 'goLeft']" title="展开收起" @click="changeZhan"></div>
+    <!-- 图例框 -->
+    <div :class="['publicLegend', 'animate__animated', ifExpand ? 'animate__fadeInLeft' : 'animate__fadeOutLeft']">
+      <div v-for="item in legendList" :key="item.layername">
+        <div class="titleB" @click="changeAllLegend(item)">
+          {{ item.title }}
+          <div class="iconImg">
+            <el-icon v-if="item.isCheck" size="22">
+              <Check />
+            </el-icon>
+          </div>
+        </div>
+        <div class="part" v-for="item2 in item.children" @click="changeLegend(item2)" :key="item2.layername">
+          <img :src="getImageUrl(item2.url, 'newImgs/layerIcon')" class="img" />
+          <p class="title">{{ item2.name }}</p>
+          <div class="iconImg">
+            <el-icon v-if="item2.isCheck" size="22">
+              <Check />
+            </el-icon>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { getImageUrl } from '@/utils/ruoyi';
+import cesiumMapLegend from './cesiumMapLegend.js';
+const { proxy } = getCurrentInstance();
+const legendList = ref([]);
+const ifExpand = ref(true);
+// 展开收起
+const changeZhan = () => {
+  ifExpand.value = !ifExpand.value;
+};
+
+onMounted(() => {
+  console.log('1111111111');
+  legendList.value = cesiumMapLegend;
+  console.log('legendList.value---', legendList.value);
+});
+</script>
+
+<style lang="scss">
+.lengendPage {
+  position: absolute;
+  left: 600px;
+  bottom: 100px;
+  z-index: 205;
+  .zksqImg {
+    width: 13px;
+    height: 130px;
+    background: url('@/assets/newImgs/down.png');
+    background-size: 100% 100%;
+    border-radius: 10px 10px 0px 0px;
+    position: absolute;
+    top: 40%;
+    left: 243px;
+    z-index: 115;
+    cursor: pointer;
+  }
+  .goLeft {
+    left: 2px;
+  }
+  .publicLegend {
+    background: #00314e;
+    border: 1px solid #094065;
+    box-shadow: 0px 0px 14px 0px rgba(0, 0, 0, 0.68);
+    opacity: 0.7;
+    border-radius: 10px;
+    height: 750px;
+    width: 240px;
+    overflow: auto;
+    .titleB {
+      display: flex;
+      height: 35px;
+      line-height: 35px;
+      background: #094065;
+      font-size: 16px;
+      padding-left: 10px;
+      .iconImg {
+        margin-left: 125px;
+        margin-top: 5px;
+        height: 20px;
+        .el-icon {
+          font-weight: bold;
+          &.active {
+            color: #00ee6f;
+          }
+        }
+      }
+    }
+    .part {
+      display: flex;
+      height: 40px;
+      align-items: center;
+      cursor: pointer;
+      &:hover {
+        background: #08596a;
+      }
+      .img {
+        width: 12px;
+        height: 12px;
+        margin-left: 15px;
+        margin-right: 5px;
+      }
+      .title {
+        margin-left: 5px;
+        font-size: 14px;
+        height: 30px;
+        line-height: 30px;
+        width: 155px;
+      }
+      .iconImg {
+        width: 20px;
+        height: 20px;
+        .el-icon {
+          font-weight: bold;
+          &.active {
+            color: #00ee6f;
+          }
+        }
+      }
+    }
+  }
+}
+</style>