diff --git a/src/views/oneMap/components/ZHHM_JSPG.vue b/src/views/oneMap/components/ZHHM_JSPG.vue
new file mode 100644
index 0000000..308d2bd
--- /dev/null
+++ b/src/views/oneMap/components/ZHHM_JSPG.vue
@@ -0,0 +1,119 @@
+<template>
+  <!-- 海绵建设评估 -->
+  <div id="ZHHM_JSPG">
+    <div :class="['LeftBox', 'animate__animated', showPanel ? 'animate__fadeOutLeft' : 'animate__fadeInLeft']">
+      <div class="ComBox">
+        <!-- 降雨日历统计 -->
+        <div class="Box_header">降雨日历统计</div>
+
+        <!-- 内涝积水分析 -->
+        <div class="Box_header">内涝积水分析</div>
+      </div>
+    </div>
+    <div :class="['RightBox', 'animate__animated', showPanel ? 'animate__fadeOutRight' : 'animate__fadeInRight']">
+      <div class="ComBox">
+        <!-- 典型项目分析 -->
+        <div class="Box_header">典型项目分析</div>
+
+        <!-- 关键管网分析 -->
+        <div class="Box_header">关键管网分析</div>
+      </div>
+    </div>
+    <!-- 中部资金绩效 -->
+    <div class="centerSuggest"></div>
+  </div>
+</template>
+
+<script setup name="ZHHM_JSPG">
+import { ref, reactive, toRefs, onMounted, defineProps, defineEmits } from 'vue';
+import monitorCalender from './monitorCalender.vue';
+import chartLogging from './chartLogging'; //内涝积水点
+import projectDX from './projectDX'; //典型项目分析
+import pipeFX from './pipeFX'; //管网分析
+
+const showPanel = ref(true); //面板展开收起
+
+// 面板内容展开收起控制
+const props = defineProps({
+  showPanel: {
+    type: Boolean,
+  },
+});
+watch(
+  () => props.showPanel,
+  () => {
+    showPanel.value = props.showPanel;
+  },
+  { immediate: true }
+);
+
+// 日历点击获取相应日期
+const getChangeDate = date => {
+  console.log(date);
+};
+
+onMounted(() => {});
+</script>
+
+<style lang="scss" scoped>
+#ZHHM_JSPG {
+  width: 100%;
+  height: 100%;
+  .centerSuggest {
+    position: absolute;
+    left: 480px;
+    top: 110px;
+    z-index: 90;
+    background: linear-gradient(0deg, rgba(0, 43, 67, 0.8) 0%, rgba(0, 69, 108, 0.8) 100%);
+    border-radius: 6px;
+    border: 1px solid #15d2fd;
+    padding: 15px;
+    width: calc(100vw - 1000px);
+    box-shadow: inset 0 0 10px 10px #47eef38a;
+  }
+  .LeftBox {
+    width: 450px;
+    height: calc(100% - 98px);
+    position: absolute;
+    left: 10px;
+    top: 70px;
+    background: linear-gradient(0deg, rgba(0, 43, 67, 0.8) 0%, rgba(0, 69, 108, 0.8) 100%);
+    border-radius: 6px;
+    border: 1px solid #47eef3;
+    box-sizing: border-box;
+    padding: 10px;
+    box-shadow: inset 0 0 5px 5px #47eef38a;
+  }
+  .RightBox {
+    width: 450px;
+    height: calc(100% - 98px);
+    position: absolute;
+    right: 10px;
+    top: 70px;
+    background: linear-gradient(0deg, rgba(0, 43, 67, 0.8) 0%, rgba(0, 69, 108, 0.8) 100%);
+    border-radius: 6px;
+    border: 1px solid #47eef3;
+    box-sizing: border-box;
+    padding: 10px;
+    box-shadow: inset 0 0 5px 5px #47eef38a;
+  }
+  .ComBox {
+    width: 100%;
+    box-sizing: border-box;
+
+    .Box_header {
+      width: 100%;
+      height: 43px;
+      background: url('@/assets/images/Sponge_screen/Box_HeaderBackground.png') no-repeat center;
+      background-size: cover;
+      font-family: PangMenZhengDao;
+      font-weight: 400;
+      font-size: 23px;
+      color: #ebfeff;
+      line-height: 43px;
+      box-sizing: border-box;
+      padding-left: 35px;
+    }
+  }
+}
+</style>

diff --git a/src/views/oneMap/components/ZHHM_JSPG.vue b/src/views/oneMap/components/ZHHM_JSPG.vue
new file mode 100644
index 0000000..308d2bd
--- /dev/null
+++ b/src/views/oneMap/components/ZHHM_JSPG.vue
@@ -0,0 +1,119 @@
+<template>
+  <!-- 海绵建设评估 -->
+  <div id="ZHHM_JSPG">
+    <div :class="['LeftBox', 'animate__animated', showPanel ? 'animate__fadeOutLeft' : 'animate__fadeInLeft']">
+      <div class="ComBox">
+        <!-- 降雨日历统计 -->
+        <div class="Box_header">降雨日历统计</div>
+
+        <!-- 内涝积水分析 -->
+        <div class="Box_header">内涝积水分析</div>
+      </div>
+    </div>
+    <div :class="['RightBox', 'animate__animated', showPanel ? 'animate__fadeOutRight' : 'animate__fadeInRight']">
+      <div class="ComBox">
+        <!-- 典型项目分析 -->
+        <div class="Box_header">典型项目分析</div>
+
+        <!-- 关键管网分析 -->
+        <div class="Box_header">关键管网分析</div>
+      </div>
+    </div>
+    <!-- 中部资金绩效 -->
+    <div class="centerSuggest"></div>
+  </div>
+</template>
+
+<script setup name="ZHHM_JSPG">
+import { ref, reactive, toRefs, onMounted, defineProps, defineEmits } from 'vue';
+import monitorCalender from './monitorCalender.vue';
+import chartLogging from './chartLogging'; //内涝积水点
+import projectDX from './projectDX'; //典型项目分析
+import pipeFX from './pipeFX'; //管网分析
+
+const showPanel = ref(true); //面板展开收起
+
+// 面板内容展开收起控制
+const props = defineProps({
+  showPanel: {
+    type: Boolean,
+  },
+});
+watch(
+  () => props.showPanel,
+  () => {
+    showPanel.value = props.showPanel;
+  },
+  { immediate: true }
+);
+
+// 日历点击获取相应日期
+const getChangeDate = date => {
+  console.log(date);
+};
+
+onMounted(() => {});
+</script>
+
+<style lang="scss" scoped>
+#ZHHM_JSPG {
+  width: 100%;
+  height: 100%;
+  .centerSuggest {
+    position: absolute;
+    left: 480px;
+    top: 110px;
+    z-index: 90;
+    background: linear-gradient(0deg, rgba(0, 43, 67, 0.8) 0%, rgba(0, 69, 108, 0.8) 100%);
+    border-radius: 6px;
+    border: 1px solid #15d2fd;
+    padding: 15px;
+    width: calc(100vw - 1000px);
+    box-shadow: inset 0 0 10px 10px #47eef38a;
+  }
+  .LeftBox {
+    width: 450px;
+    height: calc(100% - 98px);
+    position: absolute;
+    left: 10px;
+    top: 70px;
+    background: linear-gradient(0deg, rgba(0, 43, 67, 0.8) 0%, rgba(0, 69, 108, 0.8) 100%);
+    border-radius: 6px;
+    border: 1px solid #47eef3;
+    box-sizing: border-box;
+    padding: 10px;
+    box-shadow: inset 0 0 5px 5px #47eef38a;
+  }
+  .RightBox {
+    width: 450px;
+    height: calc(100% - 98px);
+    position: absolute;
+    right: 10px;
+    top: 70px;
+    background: linear-gradient(0deg, rgba(0, 43, 67, 0.8) 0%, rgba(0, 69, 108, 0.8) 100%);
+    border-radius: 6px;
+    border: 1px solid #47eef3;
+    box-sizing: border-box;
+    padding: 10px;
+    box-shadow: inset 0 0 5px 5px #47eef38a;
+  }
+  .ComBox {
+    width: 100%;
+    box-sizing: border-box;
+
+    .Box_header {
+      width: 100%;
+      height: 43px;
+      background: url('@/assets/images/Sponge_screen/Box_HeaderBackground.png') no-repeat center;
+      background-size: cover;
+      font-family: PangMenZhengDao;
+      font-weight: 400;
+      font-size: 23px;
+      color: #ebfeff;
+      line-height: 43px;
+      box-sizing: border-box;
+      padding-left: 35px;
+    }
+  }
+}
+</style>
diff --git a/src/views/oneMap/components/monitorCalender.vue b/src/views/oneMap/components/monitorCalender.vue
index bde327b..a34aa71 100644
--- a/src/views/oneMap/components/monitorCalender.vue
+++ b/src/views/oneMap/components/monitorCalender.vue
@@ -168,6 +168,7 @@
 
 onMounted(() => {
   getRainTimeDayData();
+  changepeople('2024-08-07'); //默认选中一天
 });
 </script>
 

diff --git a/src/views/oneMap/components/ZHHM_JSPG.vue b/src/views/oneMap/components/ZHHM_JSPG.vue
new file mode 100644
index 0000000..308d2bd
--- /dev/null
+++ b/src/views/oneMap/components/ZHHM_JSPG.vue
@@ -0,0 +1,119 @@
+<template>
+  <!-- 海绵建设评估 -->
+  <div id="ZHHM_JSPG">
+    <div :class="['LeftBox', 'animate__animated', showPanel ? 'animate__fadeOutLeft' : 'animate__fadeInLeft']">
+      <div class="ComBox">
+        <!-- 降雨日历统计 -->
+        <div class="Box_header">降雨日历统计</div>
+
+        <!-- 内涝积水分析 -->
+        <div class="Box_header">内涝积水分析</div>
+      </div>
+    </div>
+    <div :class="['RightBox', 'animate__animated', showPanel ? 'animate__fadeOutRight' : 'animate__fadeInRight']">
+      <div class="ComBox">
+        <!-- 典型项目分析 -->
+        <div class="Box_header">典型项目分析</div>
+
+        <!-- 关键管网分析 -->
+        <div class="Box_header">关键管网分析</div>
+      </div>
+    </div>
+    <!-- 中部资金绩效 -->
+    <div class="centerSuggest"></div>
+  </div>
+</template>
+
+<script setup name="ZHHM_JSPG">
+import { ref, reactive, toRefs, onMounted, defineProps, defineEmits } from 'vue';
+import monitorCalender from './monitorCalender.vue';
+import chartLogging from './chartLogging'; //内涝积水点
+import projectDX from './projectDX'; //典型项目分析
+import pipeFX from './pipeFX'; //管网分析
+
+const showPanel = ref(true); //面板展开收起
+
+// 面板内容展开收起控制
+const props = defineProps({
+  showPanel: {
+    type: Boolean,
+  },
+});
+watch(
+  () => props.showPanel,
+  () => {
+    showPanel.value = props.showPanel;
+  },
+  { immediate: true }
+);
+
+// 日历点击获取相应日期
+const getChangeDate = date => {
+  console.log(date);
+};
+
+onMounted(() => {});
+</script>
+
+<style lang="scss" scoped>
+#ZHHM_JSPG {
+  width: 100%;
+  height: 100%;
+  .centerSuggest {
+    position: absolute;
+    left: 480px;
+    top: 110px;
+    z-index: 90;
+    background: linear-gradient(0deg, rgba(0, 43, 67, 0.8) 0%, rgba(0, 69, 108, 0.8) 100%);
+    border-radius: 6px;
+    border: 1px solid #15d2fd;
+    padding: 15px;
+    width: calc(100vw - 1000px);
+    box-shadow: inset 0 0 10px 10px #47eef38a;
+  }
+  .LeftBox {
+    width: 450px;
+    height: calc(100% - 98px);
+    position: absolute;
+    left: 10px;
+    top: 70px;
+    background: linear-gradient(0deg, rgba(0, 43, 67, 0.8) 0%, rgba(0, 69, 108, 0.8) 100%);
+    border-radius: 6px;
+    border: 1px solid #47eef3;
+    box-sizing: border-box;
+    padding: 10px;
+    box-shadow: inset 0 0 5px 5px #47eef38a;
+  }
+  .RightBox {
+    width: 450px;
+    height: calc(100% - 98px);
+    position: absolute;
+    right: 10px;
+    top: 70px;
+    background: linear-gradient(0deg, rgba(0, 43, 67, 0.8) 0%, rgba(0, 69, 108, 0.8) 100%);
+    border-radius: 6px;
+    border: 1px solid #47eef3;
+    box-sizing: border-box;
+    padding: 10px;
+    box-shadow: inset 0 0 5px 5px #47eef38a;
+  }
+  .ComBox {
+    width: 100%;
+    box-sizing: border-box;
+
+    .Box_header {
+      width: 100%;
+      height: 43px;
+      background: url('@/assets/images/Sponge_screen/Box_HeaderBackground.png') no-repeat center;
+      background-size: cover;
+      font-family: PangMenZhengDao;
+      font-weight: 400;
+      font-size: 23px;
+      color: #ebfeff;
+      line-height: 43px;
+      box-sizing: border-box;
+      padding-left: 35px;
+    }
+  }
+}
+</style>
diff --git a/src/views/oneMap/components/monitorCalender.vue b/src/views/oneMap/components/monitorCalender.vue
index bde327b..a34aa71 100644
--- a/src/views/oneMap/components/monitorCalender.vue
+++ b/src/views/oneMap/components/monitorCalender.vue
@@ -168,6 +168,7 @@
 
 onMounted(() => {
   getRainTimeDayData();
+  changepeople('2024-08-07'); //默认选中一天
 });
 </script>
 
diff --git a/src/views/oneMap/index.vue b/src/views/oneMap/index.vue
index ef69bb1..a4d70f6 100644
--- a/src/views/oneMap/index.vue
+++ b/src/views/oneMap/index.vue
@@ -96,6 +96,12 @@
         :isActive="AllData.ComShowID == 61 ? true : false"
         :showPanel="showPanel"
       ></ZHHMJCFX>
+       <!-- 智慧海绵-建设评估 -->
+       <ZHHMJSPG
+        v-if="AllData.ComShowID == 62"
+        :isActive="AllData.ComShowID == 62 ? true : false"
+        :showPanel="showPanel"
+      ></ZHHMJSPG>
       <!-- 7:防洪排涝 -->
       <ComFHPL
         v-if="AllData.ComShowID == 7"
@@ -216,6 +222,7 @@
 import ComZHHM from "./components/ZHHM.vue"; //智慧海绵
 import ComFHPL from "./components/FHPL.vue"; //防洪排涝
 import ZHHMJCFX from "./components/ZHHM_JCFX.vue"; //智慧海绵-监测分析
+import ZHHMJSPG from './components/ZHHM_JSPG.vue'; //智慧海绵-建设评估
 import PopupInfo from "@/views/oneMap/components/mapboxPopup.vue"; //地图标注点弹窗
 // 降雨效果
 import CanvasRain from "@/views/oneMap/cityGK/canvasRain.vue"; //降雨效果
@@ -271,6 +278,10 @@
           name: "监测分析",
           id: 61,
         },
+        {
+          name: "建设评估",
+          id: 62,
+        },
       ],
     },
     {