diff --git a/src/views/sponeScreen/Echarts/AssessmentEcharts.vue b/src/views/sponeScreen/Echarts/AssessmentEcharts.vue
index 6d2b132..ebb6c62 100644
--- a/src/views/sponeScreen/Echarts/AssessmentEcharts.vue
+++ b/src/views/sponeScreen/Echarts/AssessmentEcharts.vue
@@ -41,7 +41,7 @@
           right: 80,
         },
         legend: {
-          data: ['降雨量(mm)', '流量(m³/h)', 'ss(mg/L)'],
+          data: ['降雨量(mm)', '流速(m/s)', 'ss(mg/L)'],
           textStyle: {
             color: '#fff',
           },
@@ -155,7 +155,7 @@
           },
           {
             // smooth: true, //变为曲线 默认false折线
-            name: '流量(m³/h)',
+            name: '流速(m/s)',
             type: 'line',
             data: props.data.yAxis2,
             yAxisIndex: 1,

diff --git a/src/views/sponeScreen/Echarts/AssessmentEcharts.vue b/src/views/sponeScreen/Echarts/AssessmentEcharts.vue
index 6d2b132..ebb6c62 100644
--- a/src/views/sponeScreen/Echarts/AssessmentEcharts.vue
+++ b/src/views/sponeScreen/Echarts/AssessmentEcharts.vue
@@ -41,7 +41,7 @@
           right: 80,
         },
         legend: {
-          data: ['降雨量(mm)', '流量(m³/h)', 'ss(mg/L)'],
+          data: ['降雨量(mm)', '流速(m/s)', 'ss(mg/L)'],
           textStyle: {
             color: '#fff',
           },
@@ -155,7 +155,7 @@
           },
           {
             // smooth: true, //变为曲线 默认false折线
-            name: '流量(m³/h)',
+            name: '流速(m/s)',
             type: 'line',
             data: props.data.yAxis2,
             yAxisIndex: 1,
diff --git a/src/views/sponeScreen/HaiMianScreen/index.vue b/src/views/sponeScreen/HaiMianScreen/index.vue
index aa9e1af..c8eb408 100644
--- a/src/views/sponeScreen/HaiMianScreen/index.vue
+++ b/src/views/sponeScreen/HaiMianScreen/index.vue
@@ -121,12 +121,12 @@
 
     <!-- 典型项目效果 -->
     <el-dialog v-model="showProjectDX" title="典型项目分析" style="width: 1650px" append-to-body>
-      <ProjectFX :projectParams="projectParams"></ProjectFX>
+      <ProjectFX :projectParams="projectParams" v-if="showProjectDX"></ProjectFX>
     </el-dialog>
 
     <!-- 典型项目设施效果 -->
     <el-dialog v-model="showProjectSSDX" title="典型项目设施分析" style="width: 1430px" append-to-body>
-      <ProjectSSDX :projectParams="projectParamsSS"></ProjectSSDX>
+      <ProjectSSDX :projectParams="projectParamsSS" v-if="showProjectSSDX"></ProjectSSDX>
     </el-dialog>
   </div>
 </template>
@@ -179,7 +179,7 @@
   { name: '排水防涝', id: 4 },
   { name: '长效运维', id: 5 },
 ]);
-const menuIndex = ref(2);
+const menuIndex = ref(1);
 const showPanel = ref(false);
 const showLegend = ref(false);
 const showPipe = ref(false);

diff --git a/src/views/sponeScreen/Echarts/AssessmentEcharts.vue b/src/views/sponeScreen/Echarts/AssessmentEcharts.vue
index 6d2b132..ebb6c62 100644
--- a/src/views/sponeScreen/Echarts/AssessmentEcharts.vue
+++ b/src/views/sponeScreen/Echarts/AssessmentEcharts.vue
@@ -41,7 +41,7 @@
           right: 80,
         },
         legend: {
-          data: ['降雨量(mm)', '流量(m³/h)', 'ss(mg/L)'],
+          data: ['降雨量(mm)', '流速(m/s)', 'ss(mg/L)'],
           textStyle: {
             color: '#fff',
           },
@@ -155,7 +155,7 @@
           },
           {
             // smooth: true, //变为曲线 默认false折线
-            name: '流量(m³/h)',
+            name: '流速(m/s)',
             type: 'line',
             data: props.data.yAxis2,
             yAxisIndex: 1,
diff --git a/src/views/sponeScreen/HaiMianScreen/index.vue b/src/views/sponeScreen/HaiMianScreen/index.vue
index aa9e1af..c8eb408 100644
--- a/src/views/sponeScreen/HaiMianScreen/index.vue
+++ b/src/views/sponeScreen/HaiMianScreen/index.vue
@@ -121,12 +121,12 @@
 
     <!-- 典型项目效果 -->
     <el-dialog v-model="showProjectDX" title="典型项目分析" style="width: 1650px" append-to-body>
-      <ProjectFX :projectParams="projectParams"></ProjectFX>
+      <ProjectFX :projectParams="projectParams" v-if="showProjectDX"></ProjectFX>
     </el-dialog>
 
     <!-- 典型项目设施效果 -->
     <el-dialog v-model="showProjectSSDX" title="典型项目设施分析" style="width: 1430px" append-to-body>
-      <ProjectSSDX :projectParams="projectParamsSS"></ProjectSSDX>
+      <ProjectSSDX :projectParams="projectParamsSS" v-if="showProjectSSDX"></ProjectSSDX>
     </el-dialog>
   </div>
 </template>
@@ -179,7 +179,7 @@
   { name: '排水防涝', id: 4 },
   { name: '长效运维', id: 5 },
 ]);
-const menuIndex = ref(2);
+const menuIndex = ref(1);
 const showPanel = ref(false);
 const showLegend = ref(false);
 const showPipe = ref(false);
diff --git a/src/views/sponeScreen/projectHM/ProjectEvaluation.vue b/src/views/sponeScreen/projectHM/ProjectEvaluation.vue
index f4a0ef3..0b6a3ba 100644
--- a/src/views/sponeScreen/projectHM/ProjectEvaluation.vue
+++ b/src/views/sponeScreen/projectHM/ProjectEvaluation.vue
@@ -145,7 +145,7 @@
   if (res && res.code == 200) {
     let datas = res.data;
     chartDataSS.value.xAxis = datas.propertyMonitorXList;
-    chartDataSS.value.yAxis = datas.propertyMonitorList[0] ? datas.propertyMonitorList[0].ylist : [];
+    chartDataSS.value.yAxis = nameToData(datas.propertyMonitorList, '5分钟时段降水量');
   }
 
   // 获取监测值
@@ -157,8 +157,8 @@
   let res2 = await graphicReport(params2);
   if (res2 && res2.code == 200) {
     let datas = res2.data;
-    chartDataSS.value.yAxis2 = datas.propertyMonitorList[3] ? datas.propertyMonitorList[3].ylist : []; //小时流量
-    chartDataSS.value.yAxis3 = datas.propertyMonitorList[2] ? datas.propertyMonitorList[2].ylist : []; //ss
+    chartDataSS.value.yAxis2 = nameToData(datas.propertyMonitorList, '流速'); //流速
+    chartDataSS.value.yAxis3 = nameToData(datas.propertyMonitorList, 'SS'); //ss
   }
   chartDataSS.value.refresh = Math.random();
   loadingSS.value = false;
@@ -194,7 +194,7 @@
   if (res && res.code == 200) {
     let datas = res.data;
     chartDataJSD.value.xAxis = datas.propertyMonitorXList;
-    chartDataJSD.value.yAxis = datas.propertyMonitorList[0] ? datas.propertyMonitorList[0].ylist : [];
+    chartDataJSD.value.yAxis = nameToData(datas.propertyMonitorList, '5分钟时段降水量');
   }
 
   // 获取监测值
@@ -206,9 +206,8 @@
   let res2 = await graphicReport(params2);
   if (res2 && res2.code == 200) {
     let datas = res2.data;
-    chartDataJSD.value.yAxis2 = datas.propertyMonitorList[0] ? datas.propertyMonitorList[0].ylist : [];
+    chartDataJSD.value.yAxis2 = nameToData(datas.propertyMonitorList, '水位');
   }
-
   chartDataJSD.value.refresh = Math.random();
   loadingJSD.value = false;
 }
@@ -221,6 +220,12 @@
   });
 }
 
+// 公共方法，根据监测名称来匹配对应的数值
+function nameToData(data, name) {
+  let arr = data.filter(item => item.monitorPropertyName == name);
+  return arr[0] ? arr[0].ylist : [];
+}
+
 // 片区分析点击
 function changeArea(val) {
   // bus.emit('checkProjectArea', areaList.value[val]);
@@ -233,7 +238,7 @@
 
 // 典型项目点击
 function changeProject(val) {
-  bus.emit('checkProjectFX', { project: XmList.value[val], date: dateRain.value });
+  bus.emit('checkProjectFX', { project: XmList.value[val] });
   newfiberMapbox.map.easeTo({
     center: [114.381601, 34.793947],
     zoom: 15.5,
@@ -245,7 +250,7 @@
 
 // 项目设施分析点击
 function changeSSFX(val) {
-  bus.emit('checkSSFX', { project: XmList.value[val], date: dateRain.value });
+  bus.emit('checkSSFX', { project: XmList.value[val] });
   newfiberMapbox.map.easeTo({
     center: [114.381601, 34.793947],
     zoom: 15.9,
@@ -254,18 +259,16 @@
 }
 
 onMounted(() => {
-  getJSDList(); //获取积水点数据
   hmssVal.value = hmssList.value[0].value; //默认第一个监测点
-  // 获取降雨日历的日期来加载对应数据
-  bus.on('setRainDate', date => {
-    console.log('降雨日历的日期----', date);
-    dateRain.value = date;
+  getJSDList(); //获取积水点数据
+  bus.on('changeRainDate', val => {
+    dateRain.value = val;
     changeHmss(); //海绵设施数据加载
     changeJSD(); //积水点数据加载
   });
 });
 onBeforeUnmount(() => {
-  bus.off('setRainDate');
+  bus.off('changeRainDate');
 });
 </script>
 

diff --git a/src/views/sponeScreen/Echarts/AssessmentEcharts.vue b/src/views/sponeScreen/Echarts/AssessmentEcharts.vue
index 6d2b132..ebb6c62 100644
--- a/src/views/sponeScreen/Echarts/AssessmentEcharts.vue
+++ b/src/views/sponeScreen/Echarts/AssessmentEcharts.vue
@@ -41,7 +41,7 @@
           right: 80,
         },
         legend: {
-          data: ['降雨量(mm)', '流量(m³/h)', 'ss(mg/L)'],
+          data: ['降雨量(mm)', '流速(m/s)', 'ss(mg/L)'],
           textStyle: {
             color: '#fff',
           },
@@ -155,7 +155,7 @@
           },
           {
             // smooth: true, //变为曲线 默认false折线
-            name: '流量(m³/h)',
+            name: '流速(m/s)',
             type: 'line',
             data: props.data.yAxis2,
             yAxisIndex: 1,
diff --git a/src/views/sponeScreen/HaiMianScreen/index.vue b/src/views/sponeScreen/HaiMianScreen/index.vue
index aa9e1af..c8eb408 100644
--- a/src/views/sponeScreen/HaiMianScreen/index.vue
+++ b/src/views/sponeScreen/HaiMianScreen/index.vue
@@ -121,12 +121,12 @@
 
     <!-- 典型项目效果 -->
     <el-dialog v-model="showProjectDX" title="典型项目分析" style="width: 1650px" append-to-body>
-      <ProjectFX :projectParams="projectParams"></ProjectFX>
+      <ProjectFX :projectParams="projectParams" v-if="showProjectDX"></ProjectFX>
     </el-dialog>
 
     <!-- 典型项目设施效果 -->
     <el-dialog v-model="showProjectSSDX" title="典型项目设施分析" style="width: 1430px" append-to-body>
-      <ProjectSSDX :projectParams="projectParamsSS"></ProjectSSDX>
+      <ProjectSSDX :projectParams="projectParamsSS" v-if="showProjectSSDX"></ProjectSSDX>
     </el-dialog>
   </div>
 </template>
@@ -179,7 +179,7 @@
   { name: '排水防涝', id: 4 },
   { name: '长效运维', id: 5 },
 ]);
-const menuIndex = ref(2);
+const menuIndex = ref(1);
 const showPanel = ref(false);
 const showLegend = ref(false);
 const showPipe = ref(false);
diff --git a/src/views/sponeScreen/projectHM/ProjectEvaluation.vue b/src/views/sponeScreen/projectHM/ProjectEvaluation.vue
index f4a0ef3..0b6a3ba 100644
--- a/src/views/sponeScreen/projectHM/ProjectEvaluation.vue
+++ b/src/views/sponeScreen/projectHM/ProjectEvaluation.vue
@@ -145,7 +145,7 @@
   if (res && res.code == 200) {
     let datas = res.data;
     chartDataSS.value.xAxis = datas.propertyMonitorXList;
-    chartDataSS.value.yAxis = datas.propertyMonitorList[0] ? datas.propertyMonitorList[0].ylist : [];
+    chartDataSS.value.yAxis = nameToData(datas.propertyMonitorList, '5分钟时段降水量');
   }
 
   // 获取监测值
@@ -157,8 +157,8 @@
   let res2 = await graphicReport(params2);
   if (res2 && res2.code == 200) {
     let datas = res2.data;
-    chartDataSS.value.yAxis2 = datas.propertyMonitorList[3] ? datas.propertyMonitorList[3].ylist : []; //小时流量
-    chartDataSS.value.yAxis3 = datas.propertyMonitorList[2] ? datas.propertyMonitorList[2].ylist : []; //ss
+    chartDataSS.value.yAxis2 = nameToData(datas.propertyMonitorList, '流速'); //流速
+    chartDataSS.value.yAxis3 = nameToData(datas.propertyMonitorList, 'SS'); //ss
   }
   chartDataSS.value.refresh = Math.random();
   loadingSS.value = false;
@@ -194,7 +194,7 @@
   if (res && res.code == 200) {
     let datas = res.data;
     chartDataJSD.value.xAxis = datas.propertyMonitorXList;
-    chartDataJSD.value.yAxis = datas.propertyMonitorList[0] ? datas.propertyMonitorList[0].ylist : [];
+    chartDataJSD.value.yAxis = nameToData(datas.propertyMonitorList, '5分钟时段降水量');
   }
 
   // 获取监测值
@@ -206,9 +206,8 @@
   let res2 = await graphicReport(params2);
   if (res2 && res2.code == 200) {
     let datas = res2.data;
-    chartDataJSD.value.yAxis2 = datas.propertyMonitorList[0] ? datas.propertyMonitorList[0].ylist : [];
+    chartDataJSD.value.yAxis2 = nameToData(datas.propertyMonitorList, '水位');
   }
-
   chartDataJSD.value.refresh = Math.random();
   loadingJSD.value = false;
 }
@@ -221,6 +220,12 @@
   });
 }
 
+// 公共方法，根据监测名称来匹配对应的数值
+function nameToData(data, name) {
+  let arr = data.filter(item => item.monitorPropertyName == name);
+  return arr[0] ? arr[0].ylist : [];
+}
+
 // 片区分析点击
 function changeArea(val) {
   // bus.emit('checkProjectArea', areaList.value[val]);
@@ -233,7 +238,7 @@
 
 // 典型项目点击
 function changeProject(val) {
-  bus.emit('checkProjectFX', { project: XmList.value[val], date: dateRain.value });
+  bus.emit('checkProjectFX', { project: XmList.value[val] });
   newfiberMapbox.map.easeTo({
     center: [114.381601, 34.793947],
     zoom: 15.5,
@@ -245,7 +250,7 @@
 
 // 项目设施分析点击
 function changeSSFX(val) {
-  bus.emit('checkSSFX', { project: XmList.value[val], date: dateRain.value });
+  bus.emit('checkSSFX', { project: XmList.value[val] });
   newfiberMapbox.map.easeTo({
     center: [114.381601, 34.793947],
     zoom: 15.9,
@@ -254,18 +259,16 @@
 }
 
 onMounted(() => {
-  getJSDList(); //获取积水点数据
   hmssVal.value = hmssList.value[0].value; //默认第一个监测点
-  // 获取降雨日历的日期来加载对应数据
-  bus.on('setRainDate', date => {
-    console.log('降雨日历的日期----', date);
-    dateRain.value = date;
+  getJSDList(); //获取积水点数据
+  bus.on('changeRainDate', val => {
+    dateRain.value = val;
     changeHmss(); //海绵设施数据加载
     changeJSD(); //积水点数据加载
   });
 });
 onBeforeUnmount(() => {
-  bus.off('setRainDate');
+  bus.off('changeRainDate');
 });
 </script>
 
diff --git a/src/views/sponeScreen/projectHM/gongchenkanbani_comp/qipao.vue b/src/views/sponeScreen/projectHM/gongchenkanbani_comp/qipao.vue
index a7f76a0..452c89f 100644
--- a/src/views/sponeScreen/projectHM/gongchenkanbani_comp/qipao.vue
+++ b/src/views/sponeScreen/projectHM/gongchenkanbani_comp/qipao.vue
@@ -23,7 +23,9 @@
             </div>
           </div>
           <div>
-            <el-button @click="qitxiangq" class="timage qtxq">其他详情 </el-button>
+            <el-button @click="qitxiangq" class="timage qtxq">其他详情</el-button>
+            <!-- bus.emit('checkProjectFX', { project: XmList.value[val], date: dateRain.value }); -->
+            <el-button type="success" @click="checkDX" class="timage qtxq">查看效果</el-button>
           </div>
         </div>
         <div class="right_content">
@@ -70,6 +72,7 @@
 
 const emnits = defineEmits();
 const allDate = ref({});
+const dateRain = ref('');
 const BoxList = ref([]);
 const daLigoShow = ref(false);
 const editableTabsValue = ref('xxxx');
@@ -99,6 +102,9 @@
   daLigoShow.value = true;
   projectInfoNew(allDate.value.id);
 }
+function checkDX() {
+  bus.emit('checkProjectFX', { project: BoxList.value });
+}
 
 // 获取项目详情
 async function projectInfoNew(p) {
@@ -152,6 +158,9 @@
     }, 200);
   });
 });
+onBeforeUnmount(() => {
+  bus.off('mapClick');
+});
 </script>
 <style lang="scss">
 .pmpSitNewDialogw {

diff --git a/src/views/sponeScreen/Echarts/AssessmentEcharts.vue b/src/views/sponeScreen/Echarts/AssessmentEcharts.vue
index 6d2b132..ebb6c62 100644
--- a/src/views/sponeScreen/Echarts/AssessmentEcharts.vue
+++ b/src/views/sponeScreen/Echarts/AssessmentEcharts.vue
@@ -41,7 +41,7 @@
           right: 80,
         },
         legend: {
-          data: ['降雨量(mm)', '流量(m³/h)', 'ss(mg/L)'],
+          data: ['降雨量(mm)', '流速(m/s)', 'ss(mg/L)'],
           textStyle: {
             color: '#fff',
           },
@@ -155,7 +155,7 @@
           },
           {
             // smooth: true, //变为曲线 默认false折线
-            name: '流量(m³/h)',
+            name: '流速(m/s)',
             type: 'line',
             data: props.data.yAxis2,
             yAxisIndex: 1,
diff --git a/src/views/sponeScreen/HaiMianScreen/index.vue b/src/views/sponeScreen/HaiMianScreen/index.vue
index aa9e1af..c8eb408 100644
--- a/src/views/sponeScreen/HaiMianScreen/index.vue
+++ b/src/views/sponeScreen/HaiMianScreen/index.vue
@@ -121,12 +121,12 @@
 
     <!-- 典型项目效果 -->
     <el-dialog v-model="showProjectDX" title="典型项目分析" style="width: 1650px" append-to-body>
-      <ProjectFX :projectParams="projectParams"></ProjectFX>
+      <ProjectFX :projectParams="projectParams" v-if="showProjectDX"></ProjectFX>
     </el-dialog>
 
     <!-- 典型项目设施效果 -->
     <el-dialog v-model="showProjectSSDX" title="典型项目设施分析" style="width: 1430px" append-to-body>
-      <ProjectSSDX :projectParams="projectParamsSS"></ProjectSSDX>
+      <ProjectSSDX :projectParams="projectParamsSS" v-if="showProjectSSDX"></ProjectSSDX>
     </el-dialog>
   </div>
 </template>
@@ -179,7 +179,7 @@
   { name: '排水防涝', id: 4 },
   { name: '长效运维', id: 5 },
 ]);
-const menuIndex = ref(2);
+const menuIndex = ref(1);
 const showPanel = ref(false);
 const showLegend = ref(false);
 const showPipe = ref(false);
diff --git a/src/views/sponeScreen/projectHM/ProjectEvaluation.vue b/src/views/sponeScreen/projectHM/ProjectEvaluation.vue
index f4a0ef3..0b6a3ba 100644
--- a/src/views/sponeScreen/projectHM/ProjectEvaluation.vue
+++ b/src/views/sponeScreen/projectHM/ProjectEvaluation.vue
@@ -145,7 +145,7 @@
   if (res && res.code == 200) {
     let datas = res.data;
     chartDataSS.value.xAxis = datas.propertyMonitorXList;
-    chartDataSS.value.yAxis = datas.propertyMonitorList[0] ? datas.propertyMonitorList[0].ylist : [];
+    chartDataSS.value.yAxis = nameToData(datas.propertyMonitorList, '5分钟时段降水量');
   }
 
   // 获取监测值
@@ -157,8 +157,8 @@
   let res2 = await graphicReport(params2);
   if (res2 && res2.code == 200) {
     let datas = res2.data;
-    chartDataSS.value.yAxis2 = datas.propertyMonitorList[3] ? datas.propertyMonitorList[3].ylist : []; //小时流量
-    chartDataSS.value.yAxis3 = datas.propertyMonitorList[2] ? datas.propertyMonitorList[2].ylist : []; //ss
+    chartDataSS.value.yAxis2 = nameToData(datas.propertyMonitorList, '流速'); //流速
+    chartDataSS.value.yAxis3 = nameToData(datas.propertyMonitorList, 'SS'); //ss
   }
   chartDataSS.value.refresh = Math.random();
   loadingSS.value = false;
@@ -194,7 +194,7 @@
   if (res && res.code == 200) {
     let datas = res.data;
     chartDataJSD.value.xAxis = datas.propertyMonitorXList;
-    chartDataJSD.value.yAxis = datas.propertyMonitorList[0] ? datas.propertyMonitorList[0].ylist : [];
+    chartDataJSD.value.yAxis = nameToData(datas.propertyMonitorList, '5分钟时段降水量');
   }
 
   // 获取监测值
@@ -206,9 +206,8 @@
   let res2 = await graphicReport(params2);
   if (res2 && res2.code == 200) {
     let datas = res2.data;
-    chartDataJSD.value.yAxis2 = datas.propertyMonitorList[0] ? datas.propertyMonitorList[0].ylist : [];
+    chartDataJSD.value.yAxis2 = nameToData(datas.propertyMonitorList, '水位');
   }
-
   chartDataJSD.value.refresh = Math.random();
   loadingJSD.value = false;
 }
@@ -221,6 +220,12 @@
   });
 }
 
+// 公共方法，根据监测名称来匹配对应的数值
+function nameToData(data, name) {
+  let arr = data.filter(item => item.monitorPropertyName == name);
+  return arr[0] ? arr[0].ylist : [];
+}
+
 // 片区分析点击
 function changeArea(val) {
   // bus.emit('checkProjectArea', areaList.value[val]);
@@ -233,7 +238,7 @@
 
 // 典型项目点击
 function changeProject(val) {
-  bus.emit('checkProjectFX', { project: XmList.value[val], date: dateRain.value });
+  bus.emit('checkProjectFX', { project: XmList.value[val] });
   newfiberMapbox.map.easeTo({
     center: [114.381601, 34.793947],
     zoom: 15.5,
@@ -245,7 +250,7 @@
 
 // 项目设施分析点击
 function changeSSFX(val) {
-  bus.emit('checkSSFX', { project: XmList.value[val], date: dateRain.value });
+  bus.emit('checkSSFX', { project: XmList.value[val] });
   newfiberMapbox.map.easeTo({
     center: [114.381601, 34.793947],
     zoom: 15.9,
@@ -254,18 +259,16 @@
 }
 
 onMounted(() => {
-  getJSDList(); //获取积水点数据
   hmssVal.value = hmssList.value[0].value; //默认第一个监测点
-  // 获取降雨日历的日期来加载对应数据
-  bus.on('setRainDate', date => {
-    console.log('降雨日历的日期----', date);
-    dateRain.value = date;
+  getJSDList(); //获取积水点数据
+  bus.on('changeRainDate', val => {
+    dateRain.value = val;
     changeHmss(); //海绵设施数据加载
     changeJSD(); //积水点数据加载
   });
 });
 onBeforeUnmount(() => {
-  bus.off('setRainDate');
+  bus.off('changeRainDate');
 });
 </script>
 
diff --git a/src/views/sponeScreen/projectHM/gongchenkanbani_comp/qipao.vue b/src/views/sponeScreen/projectHM/gongchenkanbani_comp/qipao.vue
index a7f76a0..452c89f 100644
--- a/src/views/sponeScreen/projectHM/gongchenkanbani_comp/qipao.vue
+++ b/src/views/sponeScreen/projectHM/gongchenkanbani_comp/qipao.vue
@@ -23,7 +23,9 @@
             </div>
           </div>
           <div>
-            <el-button @click="qitxiangq" class="timage qtxq">其他详情 </el-button>
+            <el-button @click="qitxiangq" class="timage qtxq">其他详情</el-button>
+            <!-- bus.emit('checkProjectFX', { project: XmList.value[val], date: dateRain.value }); -->
+            <el-button type="success" @click="checkDX" class="timage qtxq">查看效果</el-button>
           </div>
         </div>
         <div class="right_content">
@@ -70,6 +72,7 @@
 
 const emnits = defineEmits();
 const allDate = ref({});
+const dateRain = ref('');
 const BoxList = ref([]);
 const daLigoShow = ref(false);
 const editableTabsValue = ref('xxxx');
@@ -99,6 +102,9 @@
   daLigoShow.value = true;
   projectInfoNew(allDate.value.id);
 }
+function checkDX() {
+  bus.emit('checkProjectFX', { project: BoxList.value });
+}
 
 // 获取项目详情
 async function projectInfoNew(p) {
@@ -152,6 +158,9 @@
     }, 200);
   });
 });
+onBeforeUnmount(() => {
+  bus.off('mapClick');
+});
 </script>
 <style lang="scss">
 .pmpSitNewDialogw {
diff --git a/src/views/sponeScreen/projectHM/projectFX.vue b/src/views/sponeScreen/projectHM/projectFX.vue
index d018791..37a26ca 100644
--- a/src/views/sponeScreen/projectHM/projectFX.vue
+++ b/src/views/sponeScreen/projectHM/projectFX.vue
@@ -3,9 +3,7 @@
   <div class="projectFXPage">
     <!-- 分析结果建议 -->
     <div class="suggest">
-      <div class="center">
-        {{ props.projectParams.date }} 降雨起止时间1:15-3:45，24小时累计降雨量20.4mm，降雨等级 <span class="green">中雨</span>
-      </div>
+      <div class="center">{{ rainDate }} 降雨起止时间1:15-3:45，24小时累计降雨量20.4mm，降雨等级 <span class="green">中雨</span></div>
       <div class="cont">
         <span class="numBg">1</span>
         项目设计最大控制容积 <span class="green">3796.52m³</span>
@@ -29,50 +27,50 @@
       src="@/assets/newImgs/pumpGY/water.png"
       alt="左"
       class="waterFlow"
-      :style="{ height: (120 * station1.z) / 1.1 + 'px', left: '73px', width: '846px' }"
+      :style="{ height: (120 * (nameToData(station1.propertyMonitorList, '水位')[0] || 0.2)) / 1.1 + 'px', left: '73px', width: '846px' }"
     />
     <img
       src="@/assets/newImgs/pumpGY/water.png"
       alt="右"
       class="waterFlow"
-      :style="{ height: (120 * station5.z) / 1.8 + 'px', right: '75px', width: '555px' }"
+      :style="{ height: (120 * (nameToData(station5.propertyMonitorList, '水位')[0] || 0.2)) / 1.8 + 'px', right: '75px', width: '555px' }"
     />
 
     <!-- 实时数据 -->
     <div class="realData">
-      <p style="left: 290px; bottom: 175px">实时水深：{{ station1.z }}米</p>
-      <p style="right: 260px; bottom: 175px">实时水深：{{ station5.z }}米</p>
+      <p style="left: 290px; bottom: 175px">实时水深：{{ nameToData(station1.propertyMonitorList, '水位')[0] || '--' }}米</p>
+      <p style="right: 260px; bottom: 175px">实时水深：{{ nameToData(station5.propertyMonitorList, '水位')[0] || '--' }}米</p>
     </div>
 
     <!-- 监测数据 -->
     <div style="left: 170px; bottom: 335px" class="tipsM">
-      <span>水深：{{ station1.z }} m</span>
-      <span>流速：{{ station1.va }} m/s</span>
-      <span>SS：{{ station1.turb }} mg/L</span>
+      <span>水深：{{ nameToData(station1.propertyMonitorList, '水位')[0] || '--' }} m</span>
+      <span>流速：{{ nameToData(station1.propertyMonitorList, '流速')[0] || '--' }} m/s</span>
+      <span>SS：{{ nameToData(station1.propertyMonitorList, 'SS')[0] || '--' }} mg/L</span>
       <span>管径：2.4*1.1m</span>
     </div>
     <div style="left: 600px; bottom: 335px" class="tipsM">
-      <span>水深：{{ station2.z }} m</span>
-      <span>流速：{{ station2.va }} m/s</span>
-      <span>SS：{{ station2.turb }} mg/L</span>
+      <span>水深：{{ nameToData(station2.propertyMonitorList, '水位')[0] || '--' }} m</span>
+      <span>流速：{{ nameToData(station2.propertyMonitorList, '流速')[0] || '--' }} m/s</span>
+      <span>SS：{{ nameToData(station2.propertyMonitorList, 'SS')[0] || '--' }} mg/L</span>
       <span>管径：2.4*1.1m</span>
     </div>
     <div style="left: 800px; bottom: 335px" class="tipsM">
-      <span>水深：{{ station3.z }} m</span>
-      <span>流速：{{ station3.va }} m/s</span>
-      <span>SS：{{ station3.turb }} mg/L</span>
+      <span>水深：{{ nameToData(station3.propertyMonitorList, '水位')[0] || '--' }} m</span>
+      <span>流速：{{ nameToData(station3.propertyMonitorList, '流速')[0] || '--' }} m/s</span>
+      <span>SS：{{ nameToData(station3.propertyMonitorList, 'SS')[0] || '--' }} mg/L</span>
       <span>管径：DN500</span>
     </div>
     <div style="left: 960px; bottom: 335px" class="tipsM">
-      <span>水深：{{ station4.z || '--' }} m</span>
-      <span>流速：{{ station4.va || '--' }} m/s</span>
-      <span>SS：{{ station4.turb || '--' }} mg/L</span>
+      <span>水深：{{ '--' }} m</span>
+      <span>流速：{{ '--' }} m/s</span>
+      <span>SS：{{ '--' }} mg/L</span>
       <span>管径：3*1.8m</span>
     </div>
     <div style="right: 140px; bottom: 335px" class="tipsM">
-      <span>水深：{{ station5.z }} m</span>
-      <span>流速：{{ station5.va }} m/s</span>
-      <span>SS：{{ station5.turb }} mg/L</span>
+      <span>水深：{{ nameToData(station5.propertyMonitorList, '水位')[0] || '--' }} m</span>
+      <span>流速：{{ nameToData(station5.propertyMonitorList, '流速')[0] || '--' }} m/s</span>
+      <span>SS：{{ nameToData(station5.propertyMonitorList, 'SS')[0] || '--' }} mg/L</span>
       <span>管径：3*1.8m</span>
     </div>
 
@@ -114,46 +112,69 @@
 <script setup>
 import CanvasRainP from '@/views/sponeScreen/projectHM/canvasRainP.vue';
 import bus from '@/bus';
-import { realtimeDataLatest } from '@/api/dataAnalysis/syntherticData';
+import { graphicReport } from '@/api/dataAnalysis/syntherticData';
 
-const props = defineProps({
-  projectParams: {
-    type: Object,
-  },
-});
+const rainDate = ref('');
 const { proxy } = getCurrentInstance();
 const timer = ref(null);
-const station1 = ref({});
-const station2 = ref({});
-const station3 = ref({});
-const station4 = ref({});
-const station5 = ref({});
+const station1 = ref({ propertyMonitorList: [{ ylist: [] }, { ylist: [] }, { ylist: [] }] });
+const station2 = ref({ propertyMonitorList: [{ ylist: [] }, { ylist: [] }, { ylist: [] }] });
+const station3 = ref({ propertyMonitorList: [{ ylist: [] }, { ylist: [] }, { ylist: [] }] });
+const station4 = ref({ propertyMonitorList: [{ ylist: [] }, { ylist: [] }, { ylist: [] }] });
+const station5 = ref({ propertyMonitorList: [{ ylist: [] }, { ylist: [] }, { ylist: [] }] });
 
 // 获取实时数据
 function getRealData() {
   // 从左到右，共5个
-  realtimeDataLatest('0371000037').then(res => {
-    station1.value = res.data;
+  let params = {
+    startTime: localStorage.getItem('setRainDateKF'),
+    endTime: localStorage.getItem('setRainDateKF'),
+    stCode: '',
+  };
+  params.stCode = '0371000037';
+  graphicReport(params).then(res => {
+    if (res.data.propertyMonitorList.length > 0) {
+      station1.value = res.data;
+    }
   });
-  realtimeDataLatest('0371000038').then(res => {
-    station2.value = res.data;
+
+  params.stCode = '0371000038';
+  graphicReport(params).then(res => {
+    if (res.data.propertyMonitorList.length > 0) {
+      station2.value = res.data;
+    }
   });
-  realtimeDataLatest('0371000039').then(res => {
-    station3.value = res.data;
+
+  params.stCode = '0371000039';
+  graphicReport(params).then(res => {
+    if (res.data.propertyMonitorList.length > 0) {
+      station3.value = res.data;
+    }
   });
+
   station4.value = {}; //暂未安装，无数据
-  realtimeDataLatest('0371000044').then(res => {
-    station5.value = res.data;
+
+  params.stCode = '0371000044';
+  graphicReport(params).then(res => {
+    if (res.data.propertyMonitorList.length > 0) {
+      station5.value = res.data;
+    }
   });
 }
 
+// 公共方法，根据监测名称来匹配对应的数值
+function nameToData(data, name) {
+  let arr = data.filter(item => item.monitorPropertyName == name);
+  return arr[0] ? arr[0].ylist : [];
+}
+
 // 海绵设施点击
 function checkHmSS() {
   bus.emit('checkSSFX', {});
 }
 
 onMounted(() => {
-  console.log('典型项目接收参数--', props.projectParams);
+  rainDate.value = localStorage.getItem('setRainDateKF');
   getRealData();
   // 5分钟刷新一次数据
   timer.value = setInterval(() => {

diff --git a/src/views/sponeScreen/Echarts/AssessmentEcharts.vue b/src/views/sponeScreen/Echarts/AssessmentEcharts.vue
index 6d2b132..ebb6c62 100644
--- a/src/views/sponeScreen/Echarts/AssessmentEcharts.vue
+++ b/src/views/sponeScreen/Echarts/AssessmentEcharts.vue
@@ -41,7 +41,7 @@
           right: 80,
         },
         legend: {
-          data: ['降雨量(mm)', '流量(m³/h)', 'ss(mg/L)'],
+          data: ['降雨量(mm)', '流速(m/s)', 'ss(mg/L)'],
           textStyle: {
             color: '#fff',
           },
@@ -155,7 +155,7 @@
           },
           {
             // smooth: true, //变为曲线 默认false折线
-            name: '流量(m³/h)',
+            name: '流速(m/s)',
             type: 'line',
             data: props.data.yAxis2,
             yAxisIndex: 1,
diff --git a/src/views/sponeScreen/HaiMianScreen/index.vue b/src/views/sponeScreen/HaiMianScreen/index.vue
index aa9e1af..c8eb408 100644
--- a/src/views/sponeScreen/HaiMianScreen/index.vue
+++ b/src/views/sponeScreen/HaiMianScreen/index.vue
@@ -121,12 +121,12 @@
 
     <!-- 典型项目效果 -->
     <el-dialog v-model="showProjectDX" title="典型项目分析" style="width: 1650px" append-to-body>
-      <ProjectFX :projectParams="projectParams"></ProjectFX>
+      <ProjectFX :projectParams="projectParams" v-if="showProjectDX"></ProjectFX>
     </el-dialog>
 
     <!-- 典型项目设施效果 -->
     <el-dialog v-model="showProjectSSDX" title="典型项目设施分析" style="width: 1430px" append-to-body>
-      <ProjectSSDX :projectParams="projectParamsSS"></ProjectSSDX>
+      <ProjectSSDX :projectParams="projectParamsSS" v-if="showProjectSSDX"></ProjectSSDX>
     </el-dialog>
   </div>
 </template>
@@ -179,7 +179,7 @@
   { name: '排水防涝', id: 4 },
   { name: '长效运维', id: 5 },
 ]);
-const menuIndex = ref(2);
+const menuIndex = ref(1);
 const showPanel = ref(false);
 const showLegend = ref(false);
 const showPipe = ref(false);
diff --git a/src/views/sponeScreen/projectHM/ProjectEvaluation.vue b/src/views/sponeScreen/projectHM/ProjectEvaluation.vue
index f4a0ef3..0b6a3ba 100644
--- a/src/views/sponeScreen/projectHM/ProjectEvaluation.vue
+++ b/src/views/sponeScreen/projectHM/ProjectEvaluation.vue
@@ -145,7 +145,7 @@
   if (res && res.code == 200) {
     let datas = res.data;
     chartDataSS.value.xAxis = datas.propertyMonitorXList;
-    chartDataSS.value.yAxis = datas.propertyMonitorList[0] ? datas.propertyMonitorList[0].ylist : [];
+    chartDataSS.value.yAxis = nameToData(datas.propertyMonitorList, '5分钟时段降水量');
   }
 
   // 获取监测值
@@ -157,8 +157,8 @@
   let res2 = await graphicReport(params2);
   if (res2 && res2.code == 200) {
     let datas = res2.data;
-    chartDataSS.value.yAxis2 = datas.propertyMonitorList[3] ? datas.propertyMonitorList[3].ylist : []; //小时流量
-    chartDataSS.value.yAxis3 = datas.propertyMonitorList[2] ? datas.propertyMonitorList[2].ylist : []; //ss
+    chartDataSS.value.yAxis2 = nameToData(datas.propertyMonitorList, '流速'); //流速
+    chartDataSS.value.yAxis3 = nameToData(datas.propertyMonitorList, 'SS'); //ss
   }
   chartDataSS.value.refresh = Math.random();
   loadingSS.value = false;
@@ -194,7 +194,7 @@
   if (res && res.code == 200) {
     let datas = res.data;
     chartDataJSD.value.xAxis = datas.propertyMonitorXList;
-    chartDataJSD.value.yAxis = datas.propertyMonitorList[0] ? datas.propertyMonitorList[0].ylist : [];
+    chartDataJSD.value.yAxis = nameToData(datas.propertyMonitorList, '5分钟时段降水量');
   }
 
   // 获取监测值
@@ -206,9 +206,8 @@
   let res2 = await graphicReport(params2);
   if (res2 && res2.code == 200) {
     let datas = res2.data;
-    chartDataJSD.value.yAxis2 = datas.propertyMonitorList[0] ? datas.propertyMonitorList[0].ylist : [];
+    chartDataJSD.value.yAxis2 = nameToData(datas.propertyMonitorList, '水位');
   }
-
   chartDataJSD.value.refresh = Math.random();
   loadingJSD.value = false;
 }
@@ -221,6 +220,12 @@
   });
 }
 
+// 公共方法，根据监测名称来匹配对应的数值
+function nameToData(data, name) {
+  let arr = data.filter(item => item.monitorPropertyName == name);
+  return arr[0] ? arr[0].ylist : [];
+}
+
 // 片区分析点击
 function changeArea(val) {
   // bus.emit('checkProjectArea', areaList.value[val]);
@@ -233,7 +238,7 @@
 
 // 典型项目点击
 function changeProject(val) {
-  bus.emit('checkProjectFX', { project: XmList.value[val], date: dateRain.value });
+  bus.emit('checkProjectFX', { project: XmList.value[val] });
   newfiberMapbox.map.easeTo({
     center: [114.381601, 34.793947],
     zoom: 15.5,
@@ -245,7 +250,7 @@
 
 // 项目设施分析点击
 function changeSSFX(val) {
-  bus.emit('checkSSFX', { project: XmList.value[val], date: dateRain.value });
+  bus.emit('checkSSFX', { project: XmList.value[val] });
   newfiberMapbox.map.easeTo({
     center: [114.381601, 34.793947],
     zoom: 15.9,
@@ -254,18 +259,16 @@
 }
 
 onMounted(() => {
-  getJSDList(); //获取积水点数据
   hmssVal.value = hmssList.value[0].value; //默认第一个监测点
-  // 获取降雨日历的日期来加载对应数据
-  bus.on('setRainDate', date => {
-    console.log('降雨日历的日期----', date);
-    dateRain.value = date;
+  getJSDList(); //获取积水点数据
+  bus.on('changeRainDate', val => {
+    dateRain.value = val;
     changeHmss(); //海绵设施数据加载
     changeJSD(); //积水点数据加载
   });
 });
 onBeforeUnmount(() => {
-  bus.off('setRainDate');
+  bus.off('changeRainDate');
 });
 </script>
 
diff --git a/src/views/sponeScreen/projectHM/gongchenkanbani_comp/qipao.vue b/src/views/sponeScreen/projectHM/gongchenkanbani_comp/qipao.vue
index a7f76a0..452c89f 100644
--- a/src/views/sponeScreen/projectHM/gongchenkanbani_comp/qipao.vue
+++ b/src/views/sponeScreen/projectHM/gongchenkanbani_comp/qipao.vue
@@ -23,7 +23,9 @@
             </div>
           </div>
           <div>
-            <el-button @click="qitxiangq" class="timage qtxq">其他详情 </el-button>
+            <el-button @click="qitxiangq" class="timage qtxq">其他详情</el-button>
+            <!-- bus.emit('checkProjectFX', { project: XmList.value[val], date: dateRain.value }); -->
+            <el-button type="success" @click="checkDX" class="timage qtxq">查看效果</el-button>
           </div>
         </div>
         <div class="right_content">
@@ -70,6 +72,7 @@
 
 const emnits = defineEmits();
 const allDate = ref({});
+const dateRain = ref('');
 const BoxList = ref([]);
 const daLigoShow = ref(false);
 const editableTabsValue = ref('xxxx');
@@ -99,6 +102,9 @@
   daLigoShow.value = true;
   projectInfoNew(allDate.value.id);
 }
+function checkDX() {
+  bus.emit('checkProjectFX', { project: BoxList.value });
+}
 
 // 获取项目详情
 async function projectInfoNew(p) {
@@ -152,6 +158,9 @@
     }, 200);
   });
 });
+onBeforeUnmount(() => {
+  bus.off('mapClick');
+});
 </script>
 <style lang="scss">
 .pmpSitNewDialogw {
diff --git a/src/views/sponeScreen/projectHM/projectFX.vue b/src/views/sponeScreen/projectHM/projectFX.vue
index d018791..37a26ca 100644
--- a/src/views/sponeScreen/projectHM/projectFX.vue
+++ b/src/views/sponeScreen/projectHM/projectFX.vue
@@ -3,9 +3,7 @@
   <div class="projectFXPage">
     <!-- 分析结果建议 -->
     <div class="suggest">
-      <div class="center">
-        {{ props.projectParams.date }} 降雨起止时间1:15-3:45，24小时累计降雨量20.4mm，降雨等级 <span class="green">中雨</span>
-      </div>
+      <div class="center">{{ rainDate }} 降雨起止时间1:15-3:45，24小时累计降雨量20.4mm，降雨等级 <span class="green">中雨</span></div>
       <div class="cont">
         <span class="numBg">1</span>
         项目设计最大控制容积 <span class="green">3796.52m³</span>
@@ -29,50 +27,50 @@
       src="@/assets/newImgs/pumpGY/water.png"
       alt="左"
       class="waterFlow"
-      :style="{ height: (120 * station1.z) / 1.1 + 'px', left: '73px', width: '846px' }"
+      :style="{ height: (120 * (nameToData(station1.propertyMonitorList, '水位')[0] || 0.2)) / 1.1 + 'px', left: '73px', width: '846px' }"
     />
     <img
       src="@/assets/newImgs/pumpGY/water.png"
       alt="右"
       class="waterFlow"
-      :style="{ height: (120 * station5.z) / 1.8 + 'px', right: '75px', width: '555px' }"
+      :style="{ height: (120 * (nameToData(station5.propertyMonitorList, '水位')[0] || 0.2)) / 1.8 + 'px', right: '75px', width: '555px' }"
     />
 
     <!-- 实时数据 -->
     <div class="realData">
-      <p style="left: 290px; bottom: 175px">实时水深：{{ station1.z }}米</p>
-      <p style="right: 260px; bottom: 175px">实时水深：{{ station5.z }}米</p>
+      <p style="left: 290px; bottom: 175px">实时水深：{{ nameToData(station1.propertyMonitorList, '水位')[0] || '--' }}米</p>
+      <p style="right: 260px; bottom: 175px">实时水深：{{ nameToData(station5.propertyMonitorList, '水位')[0] || '--' }}米</p>
     </div>
 
     <!-- 监测数据 -->
     <div style="left: 170px; bottom: 335px" class="tipsM">
-      <span>水深：{{ station1.z }} m</span>
-      <span>流速：{{ station1.va }} m/s</span>
-      <span>SS：{{ station1.turb }} mg/L</span>
+      <span>水深：{{ nameToData(station1.propertyMonitorList, '水位')[0] || '--' }} m</span>
+      <span>流速：{{ nameToData(station1.propertyMonitorList, '流速')[0] || '--' }} m/s</span>
+      <span>SS：{{ nameToData(station1.propertyMonitorList, 'SS')[0] || '--' }} mg/L</span>
       <span>管径：2.4*1.1m</span>
     </div>
     <div style="left: 600px; bottom: 335px" class="tipsM">
-      <span>水深：{{ station2.z }} m</span>
-      <span>流速：{{ station2.va }} m/s</span>
-      <span>SS：{{ station2.turb }} mg/L</span>
+      <span>水深：{{ nameToData(station2.propertyMonitorList, '水位')[0] || '--' }} m</span>
+      <span>流速：{{ nameToData(station2.propertyMonitorList, '流速')[0] || '--' }} m/s</span>
+      <span>SS：{{ nameToData(station2.propertyMonitorList, 'SS')[0] || '--' }} mg/L</span>
       <span>管径：2.4*1.1m</span>
     </div>
     <div style="left: 800px; bottom: 335px" class="tipsM">
-      <span>水深：{{ station3.z }} m</span>
-      <span>流速：{{ station3.va }} m/s</span>
-      <span>SS：{{ station3.turb }} mg/L</span>
+      <span>水深：{{ nameToData(station3.propertyMonitorList, '水位')[0] || '--' }} m</span>
+      <span>流速：{{ nameToData(station3.propertyMonitorList, '流速')[0] || '--' }} m/s</span>
+      <span>SS：{{ nameToData(station3.propertyMonitorList, 'SS')[0] || '--' }} mg/L</span>
       <span>管径：DN500</span>
     </div>
     <div style="left: 960px; bottom: 335px" class="tipsM">
-      <span>水深：{{ station4.z || '--' }} m</span>
-      <span>流速：{{ station4.va || '--' }} m/s</span>
-      <span>SS：{{ station4.turb || '--' }} mg/L</span>
+      <span>水深：{{ '--' }} m</span>
+      <span>流速：{{ '--' }} m/s</span>
+      <span>SS：{{ '--' }} mg/L</span>
       <span>管径：3*1.8m</span>
     </div>
     <div style="right: 140px; bottom: 335px" class="tipsM">
-      <span>水深：{{ station5.z }} m</span>
-      <span>流速：{{ station5.va }} m/s</span>
-      <span>SS：{{ station5.turb }} mg/L</span>
+      <span>水深：{{ nameToData(station5.propertyMonitorList, '水位')[0] || '--' }} m</span>
+      <span>流速：{{ nameToData(station5.propertyMonitorList, '流速')[0] || '--' }} m/s</span>
+      <span>SS：{{ nameToData(station5.propertyMonitorList, 'SS')[0] || '--' }} mg/L</span>
       <span>管径：3*1.8m</span>
     </div>
 
@@ -114,46 +112,69 @@
 <script setup>
 import CanvasRainP from '@/views/sponeScreen/projectHM/canvasRainP.vue';
 import bus from '@/bus';
-import { realtimeDataLatest } from '@/api/dataAnalysis/syntherticData';
+import { graphicReport } from '@/api/dataAnalysis/syntherticData';
 
-const props = defineProps({
-  projectParams: {
-    type: Object,
-  },
-});
+const rainDate = ref('');
 const { proxy } = getCurrentInstance();
 const timer = ref(null);
-const station1 = ref({});
-const station2 = ref({});
-const station3 = ref({});
-const station4 = ref({});
-const station5 = ref({});
+const station1 = ref({ propertyMonitorList: [{ ylist: [] }, { ylist: [] }, { ylist: [] }] });
+const station2 = ref({ propertyMonitorList: [{ ylist: [] }, { ylist: [] }, { ylist: [] }] });
+const station3 = ref({ propertyMonitorList: [{ ylist: [] }, { ylist: [] }, { ylist: [] }] });
+const station4 = ref({ propertyMonitorList: [{ ylist: [] }, { ylist: [] }, { ylist: [] }] });
+const station5 = ref({ propertyMonitorList: [{ ylist: [] }, { ylist: [] }, { ylist: [] }] });
 
 // 获取实时数据
 function getRealData() {
   // 从左到右，共5个
-  realtimeDataLatest('0371000037').then(res => {
-    station1.value = res.data;
+  let params = {
+    startTime: localStorage.getItem('setRainDateKF'),
+    endTime: localStorage.getItem('setRainDateKF'),
+    stCode: '',
+  };
+  params.stCode = '0371000037';
+  graphicReport(params).then(res => {
+    if (res.data.propertyMonitorList.length > 0) {
+      station1.value = res.data;
+    }
   });
-  realtimeDataLatest('0371000038').then(res => {
-    station2.value = res.data;
+
+  params.stCode = '0371000038';
+  graphicReport(params).then(res => {
+    if (res.data.propertyMonitorList.length > 0) {
+      station2.value = res.data;
+    }
   });
-  realtimeDataLatest('0371000039').then(res => {
-    station3.value = res.data;
+
+  params.stCode = '0371000039';
+  graphicReport(params).then(res => {
+    if (res.data.propertyMonitorList.length > 0) {
+      station3.value = res.data;
+    }
   });
+
   station4.value = {}; //暂未安装，无数据
-  realtimeDataLatest('0371000044').then(res => {
-    station5.value = res.data;
+
+  params.stCode = '0371000044';
+  graphicReport(params).then(res => {
+    if (res.data.propertyMonitorList.length > 0) {
+      station5.value = res.data;
+    }
   });
 }
 
+// 公共方法，根据监测名称来匹配对应的数值
+function nameToData(data, name) {
+  let arr = data.filter(item => item.monitorPropertyName == name);
+  return arr[0] ? arr[0].ylist : [];
+}
+
 // 海绵设施点击
 function checkHmSS() {
   bus.emit('checkSSFX', {});
 }
 
 onMounted(() => {
-  console.log('典型项目接收参数--', props.projectParams);
+  rainDate.value = localStorage.getItem('setRainDateKF');
   getRealData();
   // 5分钟刷新一次数据
   timer.value = setInterval(() => {
diff --git a/src/views/sponeScreen/projectHM/projectSSDX.vue b/src/views/sponeScreen/projectHM/projectSSDX.vue
index 19fd74d..cb59e6a 100644
--- a/src/views/sponeScreen/projectHM/projectSSDX.vue
+++ b/src/views/sponeScreen/projectHM/projectSSDX.vue
@@ -6,7 +6,7 @@
       <el-icon class="iconSug" title="查看过程线" @mouseover="showProgress = true" @mouseout="showProgress = false">
         <InfoFilled />
       </el-icon>
-      <div class="center">2024-08-26 降雨起止时间1:15-3:45，24小时累计降雨量20.4mm，降雨等级 <span class="green">中雨</span></div>
+      <div class="center">{{ rainDate }} 降雨起止时间1:15-3:45，24小时累计降雨量20.4mm，降雨等级 <span class="green">中雨</span></div>
       <!-- <p>1,项目设计最大控制容积 <span class="green">3796.52m³</span></p> -->
       <div class="cont">
         <span class="numBg">1</span>
@@ -30,16 +30,21 @@
     <CanvasRainSS :width="1382" :height="800"></CanvasRainSS>
 
     <!-- 水位 水流 -->
-    <img src="@/assets/newImgs/pumpGY/water.png" alt="" class="waterFlow" :style="{ height: 30 + 'px' }" />
+    <img
+      src="@/assets/newImgs/pumpGY/water.png"
+      alt=""
+      class="waterFlow"
+      :style="{ height: (80 * (nameToData(station1.propertyMonitorList, '水位')[0] || 0.2)) / 1.1 + 'px' }"
+    />
 
     <!-- 实时数据 -->
     <div class="realData">
-      <p style="left: 500px; bottom: 95px">管径：1.4 x 1.0米</p>
-      <p style="left: 700px; bottom: 95px">实时水深：0.3米</p>
-      <p style="right: 230px; bottom: 65px">进口流量：0.1m/s</p>
-      <p style="right: 230px; bottom: 25px">进口SS：85mg/L</p>
-      <p style="left: 60px; bottom: 65px">出口流量：0.23m/s</p>
-      <p style="left: 60px; bottom: 25px">出口SS：66mg/L</p>
+      <p style="left: 700px; bottom: 95px">管径：2.4 x 1.1米</p>
+      <p style="left: 500px; bottom: 95px">实时水深：{{ nameToData(station1.propertyMonitorList, '水位')[0] || '--' }} 米</p>
+      <p style="right: 230px; bottom: 65px">进口流速：{{ nameToData(station1.propertyMonitorList, '流速')[0] }} m/s</p>
+      <p style="right: 230px; bottom: 25px">进口SS：{{ nameToData(station1.propertyMonitorList, 'SS')[0] || '--' }} mg/L</p>
+      <p style="left: 60px; bottom: 65px">出口流速：{{ nameToData(station2.propertyMonitorList, '流速')[0] || '--' }} m/s</p>
+      <p style="left: 60px; bottom: 25px">出口SS：{{ nameToData(station2.propertyMonitorList, 'SS')[0] || '--' }} mg/L</p>
     </div>
 
     <!-- 监测设备 -->
@@ -66,10 +71,54 @@
 
 <script setup>
 import CanvasRainSS from '@/views/sponeScreen/projectHM/canvasRainSS.vue';
+import { graphicReport } from '@/api/dataAnalysis/syntherticData';
+
+const rainDate = ref('');
 const { proxy } = getCurrentInstance();
+const timer = ref(null);
+const station1 = ref({ propertyMonitorList: [{ ylist: [] }, { ylist: [] }, { ylist: [] }] });
+const station2 = ref({ propertyMonitorList: [{ ylist: [] }, { ylist: [] }, { ylist: [] }] });
 const showProgress = ref(false);
 
-onMounted(() => {});
+// 获取实时数据
+function getRealData() {
+  let params = {
+    startTime: localStorage.getItem('setRainDateKF'),
+    endTime: localStorage.getItem('setRainDateKF'),
+    stCode: '',
+  };
+  params.stCode = '0371000037';
+  graphicReport(params).then(res => {
+    if (res.data.propertyMonitorList.length > 0) {
+      station1.value = res.data;
+    }
+  });
+
+  params.stCode = '0371000038';
+  graphicReport(params).then(res => {
+    if (res.data.propertyMonitorList.length > 0) {
+      station2.value = res.data;
+    }
+  });
+}
+
+// 公共方法，根据监测名称来匹配对应的数值
+function nameToData(data, name) {
+  let arr = data.filter(item => item.monitorPropertyName == name);
+  return arr[0] ? arr[0].ylist : [];
+}
+
+onMounted(() => {
+  rainDate.value = localStorage.getItem('setRainDateKF');
+  getRealData();
+  // 5分钟刷新一次数据
+  timer.value = setInterval(() => {
+    getRealData();
+  }, 5 * 60 * 1000);
+});
+onBeforeUnmount(() => {
+  if (timer.value) clearInterval(timer.value);
+});
 </script>
 
 <style lang="scss">

diff --git a/src/views/sponeScreen/Echarts/AssessmentEcharts.vue b/src/views/sponeScreen/Echarts/AssessmentEcharts.vue
index 6d2b132..ebb6c62 100644
--- a/src/views/sponeScreen/Echarts/AssessmentEcharts.vue
+++ b/src/views/sponeScreen/Echarts/AssessmentEcharts.vue
@@ -41,7 +41,7 @@
           right: 80,
         },
         legend: {
-          data: ['降雨量(mm)', '流量(m³/h)', 'ss(mg/L)'],
+          data: ['降雨量(mm)', '流速(m/s)', 'ss(mg/L)'],
           textStyle: {
             color: '#fff',
           },
@@ -155,7 +155,7 @@
           },
           {
             // smooth: true, //变为曲线 默认false折线
-            name: '流量(m³/h)',
+            name: '流速(m/s)',
             type: 'line',
             data: props.data.yAxis2,
             yAxisIndex: 1,
diff --git a/src/views/sponeScreen/HaiMianScreen/index.vue b/src/views/sponeScreen/HaiMianScreen/index.vue
index aa9e1af..c8eb408 100644
--- a/src/views/sponeScreen/HaiMianScreen/index.vue
+++ b/src/views/sponeScreen/HaiMianScreen/index.vue
@@ -121,12 +121,12 @@
 
     <!-- 典型项目效果 -->
     <el-dialog v-model="showProjectDX" title="典型项目分析" style="width: 1650px" append-to-body>
-      <ProjectFX :projectParams="projectParams"></ProjectFX>
+      <ProjectFX :projectParams="projectParams" v-if="showProjectDX"></ProjectFX>
     </el-dialog>
 
     <!-- 典型项目设施效果 -->
     <el-dialog v-model="showProjectSSDX" title="典型项目设施分析" style="width: 1430px" append-to-body>
-      <ProjectSSDX :projectParams="projectParamsSS"></ProjectSSDX>
+      <ProjectSSDX :projectParams="projectParamsSS" v-if="showProjectSSDX"></ProjectSSDX>
     </el-dialog>
   </div>
 </template>
@@ -179,7 +179,7 @@
   { name: '排水防涝', id: 4 },
   { name: '长效运维', id: 5 },
 ]);
-const menuIndex = ref(2);
+const menuIndex = ref(1);
 const showPanel = ref(false);
 const showLegend = ref(false);
 const showPipe = ref(false);
diff --git a/src/views/sponeScreen/projectHM/ProjectEvaluation.vue b/src/views/sponeScreen/projectHM/ProjectEvaluation.vue
index f4a0ef3..0b6a3ba 100644
--- a/src/views/sponeScreen/projectHM/ProjectEvaluation.vue
+++ b/src/views/sponeScreen/projectHM/ProjectEvaluation.vue
@@ -145,7 +145,7 @@
   if (res && res.code == 200) {
     let datas = res.data;
     chartDataSS.value.xAxis = datas.propertyMonitorXList;
-    chartDataSS.value.yAxis = datas.propertyMonitorList[0] ? datas.propertyMonitorList[0].ylist : [];
+    chartDataSS.value.yAxis = nameToData(datas.propertyMonitorList, '5分钟时段降水量');
   }
 
   // 获取监测值
@@ -157,8 +157,8 @@
   let res2 = await graphicReport(params2);
   if (res2 && res2.code == 200) {
     let datas = res2.data;
-    chartDataSS.value.yAxis2 = datas.propertyMonitorList[3] ? datas.propertyMonitorList[3].ylist : []; //小时流量
-    chartDataSS.value.yAxis3 = datas.propertyMonitorList[2] ? datas.propertyMonitorList[2].ylist : []; //ss
+    chartDataSS.value.yAxis2 = nameToData(datas.propertyMonitorList, '流速'); //流速
+    chartDataSS.value.yAxis3 = nameToData(datas.propertyMonitorList, 'SS'); //ss
   }
   chartDataSS.value.refresh = Math.random();
   loadingSS.value = false;
@@ -194,7 +194,7 @@
   if (res && res.code == 200) {
     let datas = res.data;
     chartDataJSD.value.xAxis = datas.propertyMonitorXList;
-    chartDataJSD.value.yAxis = datas.propertyMonitorList[0] ? datas.propertyMonitorList[0].ylist : [];
+    chartDataJSD.value.yAxis = nameToData(datas.propertyMonitorList, '5分钟时段降水量');
   }
 
   // 获取监测值
@@ -206,9 +206,8 @@
   let res2 = await graphicReport(params2);
   if (res2 && res2.code == 200) {
     let datas = res2.data;
-    chartDataJSD.value.yAxis2 = datas.propertyMonitorList[0] ? datas.propertyMonitorList[0].ylist : [];
+    chartDataJSD.value.yAxis2 = nameToData(datas.propertyMonitorList, '水位');
   }
-
   chartDataJSD.value.refresh = Math.random();
   loadingJSD.value = false;
 }
@@ -221,6 +220,12 @@
   });
 }
 
+// 公共方法，根据监测名称来匹配对应的数值
+function nameToData(data, name) {
+  let arr = data.filter(item => item.monitorPropertyName == name);
+  return arr[0] ? arr[0].ylist : [];
+}
+
 // 片区分析点击
 function changeArea(val) {
   // bus.emit('checkProjectArea', areaList.value[val]);
@@ -233,7 +238,7 @@
 
 // 典型项目点击
 function changeProject(val) {
-  bus.emit('checkProjectFX', { project: XmList.value[val], date: dateRain.value });
+  bus.emit('checkProjectFX', { project: XmList.value[val] });
   newfiberMapbox.map.easeTo({
     center: [114.381601, 34.793947],
     zoom: 15.5,
@@ -245,7 +250,7 @@
 
 // 项目设施分析点击
 function changeSSFX(val) {
-  bus.emit('checkSSFX', { project: XmList.value[val], date: dateRain.value });
+  bus.emit('checkSSFX', { project: XmList.value[val] });
   newfiberMapbox.map.easeTo({
     center: [114.381601, 34.793947],
     zoom: 15.9,
@@ -254,18 +259,16 @@
 }
 
 onMounted(() => {
-  getJSDList(); //获取积水点数据
   hmssVal.value = hmssList.value[0].value; //默认第一个监测点
-  // 获取降雨日历的日期来加载对应数据
-  bus.on('setRainDate', date => {
-    console.log('降雨日历的日期----', date);
-    dateRain.value = date;
+  getJSDList(); //获取积水点数据
+  bus.on('changeRainDate', val => {
+    dateRain.value = val;
     changeHmss(); //海绵设施数据加载
     changeJSD(); //积水点数据加载
   });
 });
 onBeforeUnmount(() => {
-  bus.off('setRainDate');
+  bus.off('changeRainDate');
 });
 </script>
 
diff --git a/src/views/sponeScreen/projectHM/gongchenkanbani_comp/qipao.vue b/src/views/sponeScreen/projectHM/gongchenkanbani_comp/qipao.vue
index a7f76a0..452c89f 100644
--- a/src/views/sponeScreen/projectHM/gongchenkanbani_comp/qipao.vue
+++ b/src/views/sponeScreen/projectHM/gongchenkanbani_comp/qipao.vue
@@ -23,7 +23,9 @@
             </div>
           </div>
           <div>
-            <el-button @click="qitxiangq" class="timage qtxq">其他详情 </el-button>
+            <el-button @click="qitxiangq" class="timage qtxq">其他详情</el-button>
+            <!-- bus.emit('checkProjectFX', { project: XmList.value[val], date: dateRain.value }); -->
+            <el-button type="success" @click="checkDX" class="timage qtxq">查看效果</el-button>
           </div>
         </div>
         <div class="right_content">
@@ -70,6 +72,7 @@
 
 const emnits = defineEmits();
 const allDate = ref({});
+const dateRain = ref('');
 const BoxList = ref([]);
 const daLigoShow = ref(false);
 const editableTabsValue = ref('xxxx');
@@ -99,6 +102,9 @@
   daLigoShow.value = true;
   projectInfoNew(allDate.value.id);
 }
+function checkDX() {
+  bus.emit('checkProjectFX', { project: BoxList.value });
+}
 
 // 获取项目详情
 async function projectInfoNew(p) {
@@ -152,6 +158,9 @@
     }, 200);
   });
 });
+onBeforeUnmount(() => {
+  bus.off('mapClick');
+});
 </script>
 <style lang="scss">
 .pmpSitNewDialogw {
diff --git a/src/views/sponeScreen/projectHM/projectFX.vue b/src/views/sponeScreen/projectHM/projectFX.vue
index d018791..37a26ca 100644
--- a/src/views/sponeScreen/projectHM/projectFX.vue
+++ b/src/views/sponeScreen/projectHM/projectFX.vue
@@ -3,9 +3,7 @@
   <div class="projectFXPage">
     <!-- 分析结果建议 -->
     <div class="suggest">
-      <div class="center">
-        {{ props.projectParams.date }} 降雨起止时间1:15-3:45，24小时累计降雨量20.4mm，降雨等级 <span class="green">中雨</span>
-      </div>
+      <div class="center">{{ rainDate }} 降雨起止时间1:15-3:45，24小时累计降雨量20.4mm，降雨等级 <span class="green">中雨</span></div>
       <div class="cont">
         <span class="numBg">1</span>
         项目设计最大控制容积 <span class="green">3796.52m³</span>
@@ -29,50 +27,50 @@
       src="@/assets/newImgs/pumpGY/water.png"
       alt="左"
       class="waterFlow"
-      :style="{ height: (120 * station1.z) / 1.1 + 'px', left: '73px', width: '846px' }"
+      :style="{ height: (120 * (nameToData(station1.propertyMonitorList, '水位')[0] || 0.2)) / 1.1 + 'px', left: '73px', width: '846px' }"
     />
     <img
       src="@/assets/newImgs/pumpGY/water.png"
       alt="右"
       class="waterFlow"
-      :style="{ height: (120 * station5.z) / 1.8 + 'px', right: '75px', width: '555px' }"
+      :style="{ height: (120 * (nameToData(station5.propertyMonitorList, '水位')[0] || 0.2)) / 1.8 + 'px', right: '75px', width: '555px' }"
     />
 
     <!-- 实时数据 -->
     <div class="realData">
-      <p style="left: 290px; bottom: 175px">实时水深：{{ station1.z }}米</p>
-      <p style="right: 260px; bottom: 175px">实时水深：{{ station5.z }}米</p>
+      <p style="left: 290px; bottom: 175px">实时水深：{{ nameToData(station1.propertyMonitorList, '水位')[0] || '--' }}米</p>
+      <p style="right: 260px; bottom: 175px">实时水深：{{ nameToData(station5.propertyMonitorList, '水位')[0] || '--' }}米</p>
     </div>
 
     <!-- 监测数据 -->
     <div style="left: 170px; bottom: 335px" class="tipsM">
-      <span>水深：{{ station1.z }} m</span>
-      <span>流速：{{ station1.va }} m/s</span>
-      <span>SS：{{ station1.turb }} mg/L</span>
+      <span>水深：{{ nameToData(station1.propertyMonitorList, '水位')[0] || '--' }} m</span>
+      <span>流速：{{ nameToData(station1.propertyMonitorList, '流速')[0] || '--' }} m/s</span>
+      <span>SS：{{ nameToData(station1.propertyMonitorList, 'SS')[0] || '--' }} mg/L</span>
       <span>管径：2.4*1.1m</span>
     </div>
     <div style="left: 600px; bottom: 335px" class="tipsM">
-      <span>水深：{{ station2.z }} m</span>
-      <span>流速：{{ station2.va }} m/s</span>
-      <span>SS：{{ station2.turb }} mg/L</span>
+      <span>水深：{{ nameToData(station2.propertyMonitorList, '水位')[0] || '--' }} m</span>
+      <span>流速：{{ nameToData(station2.propertyMonitorList, '流速')[0] || '--' }} m/s</span>
+      <span>SS：{{ nameToData(station2.propertyMonitorList, 'SS')[0] || '--' }} mg/L</span>
       <span>管径：2.4*1.1m</span>
     </div>
     <div style="left: 800px; bottom: 335px" class="tipsM">
-      <span>水深：{{ station3.z }} m</span>
-      <span>流速：{{ station3.va }} m/s</span>
-      <span>SS：{{ station3.turb }} mg/L</span>
+      <span>水深：{{ nameToData(station3.propertyMonitorList, '水位')[0] || '--' }} m</span>
+      <span>流速：{{ nameToData(station3.propertyMonitorList, '流速')[0] || '--' }} m/s</span>
+      <span>SS：{{ nameToData(station3.propertyMonitorList, 'SS')[0] || '--' }} mg/L</span>
       <span>管径：DN500</span>
     </div>
     <div style="left: 960px; bottom: 335px" class="tipsM">
-      <span>水深：{{ station4.z || '--' }} m</span>
-      <span>流速：{{ station4.va || '--' }} m/s</span>
-      <span>SS：{{ station4.turb || '--' }} mg/L</span>
+      <span>水深：{{ '--' }} m</span>
+      <span>流速：{{ '--' }} m/s</span>
+      <span>SS：{{ '--' }} mg/L</span>
       <span>管径：3*1.8m</span>
     </div>
     <div style="right: 140px; bottom: 335px" class="tipsM">
-      <span>水深：{{ station5.z }} m</span>
-      <span>流速：{{ station5.va }} m/s</span>
-      <span>SS：{{ station5.turb }} mg/L</span>
+      <span>水深：{{ nameToData(station5.propertyMonitorList, '水位')[0] || '--' }} m</span>
+      <span>流速：{{ nameToData(station5.propertyMonitorList, '流速')[0] || '--' }} m/s</span>
+      <span>SS：{{ nameToData(station5.propertyMonitorList, 'SS')[0] || '--' }} mg/L</span>
       <span>管径：3*1.8m</span>
     </div>
 
@@ -114,46 +112,69 @@
 <script setup>
 import CanvasRainP from '@/views/sponeScreen/projectHM/canvasRainP.vue';
 import bus from '@/bus';
-import { realtimeDataLatest } from '@/api/dataAnalysis/syntherticData';
+import { graphicReport } from '@/api/dataAnalysis/syntherticData';
 
-const props = defineProps({
-  projectParams: {
-    type: Object,
-  },
-});
+const rainDate = ref('');
 const { proxy } = getCurrentInstance();
 const timer = ref(null);
-const station1 = ref({});
-const station2 = ref({});
-const station3 = ref({});
-const station4 = ref({});
-const station5 = ref({});
+const station1 = ref({ propertyMonitorList: [{ ylist: [] }, { ylist: [] }, { ylist: [] }] });
+const station2 = ref({ propertyMonitorList: [{ ylist: [] }, { ylist: [] }, { ylist: [] }] });
+const station3 = ref({ propertyMonitorList: [{ ylist: [] }, { ylist: [] }, { ylist: [] }] });
+const station4 = ref({ propertyMonitorList: [{ ylist: [] }, { ylist: [] }, { ylist: [] }] });
+const station5 = ref({ propertyMonitorList: [{ ylist: [] }, { ylist: [] }, { ylist: [] }] });
 
 // 获取实时数据
 function getRealData() {
   // 从左到右，共5个
-  realtimeDataLatest('0371000037').then(res => {
-    station1.value = res.data;
+  let params = {
+    startTime: localStorage.getItem('setRainDateKF'),
+    endTime: localStorage.getItem('setRainDateKF'),
+    stCode: '',
+  };
+  params.stCode = '0371000037';
+  graphicReport(params).then(res => {
+    if (res.data.propertyMonitorList.length > 0) {
+      station1.value = res.data;
+    }
   });
-  realtimeDataLatest('0371000038').then(res => {
-    station2.value = res.data;
+
+  params.stCode = '0371000038';
+  graphicReport(params).then(res => {
+    if (res.data.propertyMonitorList.length > 0) {
+      station2.value = res.data;
+    }
   });
-  realtimeDataLatest('0371000039').then(res => {
-    station3.value = res.data;
+
+  params.stCode = '0371000039';
+  graphicReport(params).then(res => {
+    if (res.data.propertyMonitorList.length > 0) {
+      station3.value = res.data;
+    }
   });
+
   station4.value = {}; //暂未安装，无数据
-  realtimeDataLatest('0371000044').then(res => {
-    station5.value = res.data;
+
+  params.stCode = '0371000044';
+  graphicReport(params).then(res => {
+    if (res.data.propertyMonitorList.length > 0) {
+      station5.value = res.data;
+    }
   });
 }
 
+// 公共方法，根据监测名称来匹配对应的数值
+function nameToData(data, name) {
+  let arr = data.filter(item => item.monitorPropertyName == name);
+  return arr[0] ? arr[0].ylist : [];
+}
+
 // 海绵设施点击
 function checkHmSS() {
   bus.emit('checkSSFX', {});
 }
 
 onMounted(() => {
-  console.log('典型项目接收参数--', props.projectParams);
+  rainDate.value = localStorage.getItem('setRainDateKF');
   getRealData();
   // 5分钟刷新一次数据
   timer.value = setInterval(() => {
diff --git a/src/views/sponeScreen/projectHM/projectSSDX.vue b/src/views/sponeScreen/projectHM/projectSSDX.vue
index 19fd74d..cb59e6a 100644
--- a/src/views/sponeScreen/projectHM/projectSSDX.vue
+++ b/src/views/sponeScreen/projectHM/projectSSDX.vue
@@ -6,7 +6,7 @@
       <el-icon class="iconSug" title="查看过程线" @mouseover="showProgress = true" @mouseout="showProgress = false">
         <InfoFilled />
       </el-icon>
-      <div class="center">2024-08-26 降雨起止时间1:15-3:45，24小时累计降雨量20.4mm，降雨等级 <span class="green">中雨</span></div>
+      <div class="center">{{ rainDate }} 降雨起止时间1:15-3:45，24小时累计降雨量20.4mm，降雨等级 <span class="green">中雨</span></div>
       <!-- <p>1,项目设计最大控制容积 <span class="green">3796.52m³</span></p> -->
       <div class="cont">
         <span class="numBg">1</span>
@@ -30,16 +30,21 @@
     <CanvasRainSS :width="1382" :height="800"></CanvasRainSS>
 
     <!-- 水位 水流 -->
-    <img src="@/assets/newImgs/pumpGY/water.png" alt="" class="waterFlow" :style="{ height: 30 + 'px' }" />
+    <img
+      src="@/assets/newImgs/pumpGY/water.png"
+      alt=""
+      class="waterFlow"
+      :style="{ height: (80 * (nameToData(station1.propertyMonitorList, '水位')[0] || 0.2)) / 1.1 + 'px' }"
+    />
 
     <!-- 实时数据 -->
     <div class="realData">
-      <p style="left: 500px; bottom: 95px">管径：1.4 x 1.0米</p>
-      <p style="left: 700px; bottom: 95px">实时水深：0.3米</p>
-      <p style="right: 230px; bottom: 65px">进口流量：0.1m/s</p>
-      <p style="right: 230px; bottom: 25px">进口SS：85mg/L</p>
-      <p style="left: 60px; bottom: 65px">出口流量：0.23m/s</p>
-      <p style="left: 60px; bottom: 25px">出口SS：66mg/L</p>
+      <p style="left: 700px; bottom: 95px">管径：2.4 x 1.1米</p>
+      <p style="left: 500px; bottom: 95px">实时水深：{{ nameToData(station1.propertyMonitorList, '水位')[0] || '--' }} 米</p>
+      <p style="right: 230px; bottom: 65px">进口流速：{{ nameToData(station1.propertyMonitorList, '流速')[0] }} m/s</p>
+      <p style="right: 230px; bottom: 25px">进口SS：{{ nameToData(station1.propertyMonitorList, 'SS')[0] || '--' }} mg/L</p>
+      <p style="left: 60px; bottom: 65px">出口流速：{{ nameToData(station2.propertyMonitorList, '流速')[0] || '--' }} m/s</p>
+      <p style="left: 60px; bottom: 25px">出口SS：{{ nameToData(station2.propertyMonitorList, 'SS')[0] || '--' }} mg/L</p>
     </div>
 
     <!-- 监测设备 -->
@@ -66,10 +71,54 @@
 
 <script setup>
 import CanvasRainSS from '@/views/sponeScreen/projectHM/canvasRainSS.vue';
+import { graphicReport } from '@/api/dataAnalysis/syntherticData';
+
+const rainDate = ref('');
 const { proxy } = getCurrentInstance();
+const timer = ref(null);
+const station1 = ref({ propertyMonitorList: [{ ylist: [] }, { ylist: [] }, { ylist: [] }] });
+const station2 = ref({ propertyMonitorList: [{ ylist: [] }, { ylist: [] }, { ylist: [] }] });
 const showProgress = ref(false);
 
-onMounted(() => {});
+// 获取实时数据
+function getRealData() {
+  let params = {
+    startTime: localStorage.getItem('setRainDateKF'),
+    endTime: localStorage.getItem('setRainDateKF'),
+    stCode: '',
+  };
+  params.stCode = '0371000037';
+  graphicReport(params).then(res => {
+    if (res.data.propertyMonitorList.length > 0) {
+      station1.value = res.data;
+    }
+  });
+
+  params.stCode = '0371000038';
+  graphicReport(params).then(res => {
+    if (res.data.propertyMonitorList.length > 0) {
+      station2.value = res.data;
+    }
+  });
+}
+
+// 公共方法，根据监测名称来匹配对应的数值
+function nameToData(data, name) {
+  let arr = data.filter(item => item.monitorPropertyName == name);
+  return arr[0] ? arr[0].ylist : [];
+}
+
+onMounted(() => {
+  rainDate.value = localStorage.getItem('setRainDateKF');
+  getRealData();
+  // 5分钟刷新一次数据
+  timer.value = setInterval(() => {
+    getRealData();
+  }, 5 * 60 * 1000);
+});
+onBeforeUnmount(() => {
+  if (timer.value) clearInterval(timer.value);
+});
 </script>
 
 <style lang="scss">
diff --git a/src/views/sponeScreen/waterFlood/rainCaldar.vue b/src/views/sponeScreen/waterFlood/rainCaldar.vue
index 82b24b4..50e466e 100644
--- a/src/views/sponeScreen/waterFlood/rainCaldar.vue
+++ b/src/views/sponeScreen/waterFlood/rainCaldar.vue
@@ -122,13 +122,13 @@
 // 点击切换
 function changeDate(val) {
   dateIndex.value = val;
-  console.log(dateIndex.value, 'dateIndex.value');
   let valueFormat =
     dateIndex.value == 'day' ? 'YYYY-MM-DD' : dateIndex.value == 'month' ? 'YYYY-MM' : dateIndex.value == 'year' ? 'YYYY' : '';
   rangeTime.value = proxy.moment().format(valueFormat);
   currentType.value = '';
   // 传递给项目监测分析
-  bus.emit('setRainDate', rangeTime.value);
+  bus.emit('changeRainDate', rangeTime.value);
+  localStorage.setItem('setRainDateKF', rangeTime.value);
   getBasRainTimeSectionListFn();
 }
 
@@ -152,7 +152,6 @@
 };
 //选择降雨时间
 const datePickerChange = val => {
-  console.log(val);
   currentType.value = 'time';
   if (dateIndex.value == 'day') {
     handelData();
@@ -183,7 +182,8 @@
   AllData.curDate = proxy.moment(rangeTime.value).format('MM-DD');
   AllData.curYear = proxy.moment(rangeTime.value).format('YYYY');
   // 传递给项目监测分析
-  bus.emit('setRainDate', rangeTime.value);
+  bus.emit('changeRainDate', rangeTime.value);
+  localStorage.setItem('setRainDateKF', rangeTime.value);
 };
 
 onMounted(() => {