diff --git a/src/views/sponeScreen/Echarts/echartBar3D.vue b/src/views/sponeScreen/Echarts/echartBar3D.vue
index 3d23886..038626c 100644
--- a/src/views/sponeScreen/Echarts/echartBar3D.vue
+++ b/src/views/sponeScreen/Echarts/echartBar3D.vue
@@ -65,14 +65,14 @@
             lineStyle: {
               color: '#384267',
             },
-            show: true,
+            show: false,
           },
           splitLine: {
             show: false,
           },
           axisLine: {
             lineStyle: {
-              color: '#384267',
+              color: '#005CBA',
               width: 1,
               type: 'dashed',
             },
@@ -91,7 +91,7 @@
               color: '#005CBA',
               width: 1,
             },
-            show: true,
+            show: false,
           },
           splitLine: {
             show: true,
@@ -214,7 +214,9 @@
     );
 
     onMounted(() => {
-      init();
+      setTimeout(() => {
+        init();
+      }, 0);
       window.addEventListener('resize', resizeTheChart);
     });
     return {

diff --git a/src/views/sponeScreen/Echarts/echartBar3D.vue b/src/views/sponeScreen/Echarts/echartBar3D.vue
index 3d23886..038626c 100644
--- a/src/views/sponeScreen/Echarts/echartBar3D.vue
+++ b/src/views/sponeScreen/Echarts/echartBar3D.vue
@@ -65,14 +65,14 @@
             lineStyle: {
               color: '#384267',
             },
-            show: true,
+            show: false,
           },
           splitLine: {
             show: false,
           },
           axisLine: {
             lineStyle: {
-              color: '#384267',
+              color: '#005CBA',
               width: 1,
               type: 'dashed',
             },
@@ -91,7 +91,7 @@
               color: '#005CBA',
               width: 1,
             },
-            show: true,
+            show: false,
           },
           splitLine: {
             show: true,
@@ -214,7 +214,9 @@
     );
 
     onMounted(() => {
-      init();
+      setTimeout(() => {
+        init();
+      }, 0);
       window.addEventListener('resize', resizeTheChart);
     });
     return {
diff --git a/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue b/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
index 37c3002..3075239 100644
--- a/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
+++ b/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
@@ -1 +1,65 @@
-<template><div>年径流污染削减率管理信息</div></template>
+<template>
+  <!-- 年径流污染削减率 -->
+  <div class="publicContainer">
+    <!-- gis地图 -->
+    <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
+
+    <!-- 海绵设施监测详情 -->
+    <el-dialog v-model="dialogShow" title="海绵设施监测点位详情" :modal-append-to-body="false" width="600px">
+      <el-form :inline="true">
+        <el-form-item label="日期" prop="date">
+          <el-date-picker type="daterange" v-model="dateSearch" value-format="YYYY-MM-DD" placeholder="请选择"></el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+        </el-form-item>
+      </el-form>
+      <div id="chartHMXJ" style="width: 100%; height: 300px"></div>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import MapBox from '@/views/gisMapPage/gisMapBox1'; //gis地图
+import optionChart from './chartOption.js';
+
+const { proxy } = getCurrentInstance();
+const dialogShow = ref(true);
+const charts = ref(null);
+const dateSearch = ref([proxy.moment(new Date()).subtract(60, 'days').format('YYYY-MM-DD'), proxy.moment().format('YYYY-MM-DD')]);
+
+// 历史数据搜索
+function handleQuery() {
+  setTimeout(() => {
+    initChart();
+  });
+}
+
+// echarts初始化
+function initChart() {
+  charts.value && charts.value.dispose();
+  charts.value = proxy.echarts.init(document.getElementById('chartHMXJ'));
+  optionChart.option.xAxis.data = ['2024-06-12 00:00:00', '2024-06-12 00:10:00', '2024-06-12 00:20:00'];
+  optionChart.option.yAxis[1].name = 'SS(mg/L)';
+  optionChart.option.series[0].data = [12, 9, 20]; //降雨量
+  optionChart.option.series[1].name = '进口SS';
+  optionChart.option.series[1].data = [230, 190, 132]; //进口SS
+  optionChart.option.series[2].name = '出口SS';
+  optionChart.option.series[2].data = [110, 90, 103]; //出口SS
+  // 设置鼠标滚轮放大缩小展示数据区间
+  optionChart.option.dataZoom = [{ type: 'inside', startValue: optionChart.option.xAxis.data[optionChart.option.xAxis.data.length / 2] }];
+  if (optionChart.option.xAxis.data.length > 0) {
+    optionChart.option.graphic.invisible = true; //暂无数据
+  } else {
+    optionChart.option.graphic.invisible = false; //暂无数据
+  }
+  charts.value.clear();
+  charts.value.setOption(optionChart.option);
+}
+
+onMounted(() => {
+  handleQuery();
+});
+</script>
+
+<style lang="scss" scoped></style>

diff --git a/src/views/sponeScreen/Echarts/echartBar3D.vue b/src/views/sponeScreen/Echarts/echartBar3D.vue
index 3d23886..038626c 100644
--- a/src/views/sponeScreen/Echarts/echartBar3D.vue
+++ b/src/views/sponeScreen/Echarts/echartBar3D.vue
@@ -65,14 +65,14 @@
             lineStyle: {
               color: '#384267',
             },
-            show: true,
+            show: false,
           },
           splitLine: {
             show: false,
           },
           axisLine: {
             lineStyle: {
-              color: '#384267',
+              color: '#005CBA',
               width: 1,
               type: 'dashed',
             },
@@ -91,7 +91,7 @@
               color: '#005CBA',
               width: 1,
             },
-            show: true,
+            show: false,
           },
           splitLine: {
             show: true,
@@ -214,7 +214,9 @@
     );
 
     onMounted(() => {
-      init();
+      setTimeout(() => {
+        init();
+      }, 0);
       window.addEventListener('resize', resizeTheChart);
     });
     return {
diff --git a/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue b/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
index 37c3002..3075239 100644
--- a/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
+++ b/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
@@ -1 +1,65 @@
-<template><div>年径流污染削减率管理信息</div></template>
+<template>
+  <!-- 年径流污染削减率 -->
+  <div class="publicContainer">
+    <!-- gis地图 -->
+    <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
+
+    <!-- 海绵设施监测详情 -->
+    <el-dialog v-model="dialogShow" title="海绵设施监测点位详情" :modal-append-to-body="false" width="600px">
+      <el-form :inline="true">
+        <el-form-item label="日期" prop="date">
+          <el-date-picker type="daterange" v-model="dateSearch" value-format="YYYY-MM-DD" placeholder="请选择"></el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+        </el-form-item>
+      </el-form>
+      <div id="chartHMXJ" style="width: 100%; height: 300px"></div>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import MapBox from '@/views/gisMapPage/gisMapBox1'; //gis地图
+import optionChart from './chartOption.js';
+
+const { proxy } = getCurrentInstance();
+const dialogShow = ref(true);
+const charts = ref(null);
+const dateSearch = ref([proxy.moment(new Date()).subtract(60, 'days').format('YYYY-MM-DD'), proxy.moment().format('YYYY-MM-DD')]);
+
+// 历史数据搜索
+function handleQuery() {
+  setTimeout(() => {
+    initChart();
+  });
+}
+
+// echarts初始化
+function initChart() {
+  charts.value && charts.value.dispose();
+  charts.value = proxy.echarts.init(document.getElementById('chartHMXJ'));
+  optionChart.option.xAxis.data = ['2024-06-12 00:00:00', '2024-06-12 00:10:00', '2024-06-12 00:20:00'];
+  optionChart.option.yAxis[1].name = 'SS(mg/L)';
+  optionChart.option.series[0].data = [12, 9, 20]; //降雨量
+  optionChart.option.series[1].name = '进口SS';
+  optionChart.option.series[1].data = [230, 190, 132]; //进口SS
+  optionChart.option.series[2].name = '出口SS';
+  optionChart.option.series[2].data = [110, 90, 103]; //出口SS
+  // 设置鼠标滚轮放大缩小展示数据区间
+  optionChart.option.dataZoom = [{ type: 'inside', startValue: optionChart.option.xAxis.data[optionChart.option.xAxis.data.length / 2] }];
+  if (optionChart.option.xAxis.data.length > 0) {
+    optionChart.option.graphic.invisible = true; //暂无数据
+  } else {
+    optionChart.option.graphic.invisible = false; //暂无数据
+  }
+  charts.value.clear();
+  charts.value.setOption(optionChart.option);
+}
+
+onMounted(() => {
+  handleQuery();
+});
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue b/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
index c06a3dc..35608fb 100644
--- a/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
+++ b/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
@@ -1,3 +1,62 @@
 <template>
-  <div>年径流总量控制率管理信息</div>
+  <!-- 年径流总量控制率 -->
+  <div class="publicContainer">
+    <!-- gis地图 -->
+    <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
+
+    <!-- 海绵设施监测详情 -->
+    <el-dialog v-model="dialogShow" title="海绵设施监测点位详情" :modal-append-to-body="false" width="600px">
+      <el-form :inline="true">
+        <el-form-item label="日期" prop="date">
+          <el-date-picker type="daterange" v-model="dateSearch" value-format="YYYY-MM-DD" placeholder="请选择"></el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+        </el-form-item>
+      </el-form>
+      <div id="chartHMJC" style="width: 100%; height: 300px"></div>
+    </el-dialog>
+  </div>
 </template>
+
+<script setup>
+import MapBox from '@/views/gisMapPage/gisMapBox1'; //gis地图
+import optionChart from './chartOption.js';
+
+const { proxy } = getCurrentInstance();
+const dialogShow = ref(true);
+const charts = ref(null);
+const dateSearch = ref([proxy.moment(new Date()).subtract(60, 'days').format('YYYY-MM-DD'), proxy.moment().format('YYYY-MM-DD')]);
+
+// 历史数据搜索
+function handleQuery() {
+  setTimeout(() => {
+    initChart();
+  });
+}
+
+// echarts初始化
+function initChart() {
+  charts.value && charts.value.dispose();
+  charts.value = proxy.echarts.init(document.getElementById('chartHMJC'));
+  optionChart.option.xAxis.data = ['2024-06-12 00:00:00', '2024-06-12 00:10:00', '2024-06-12 00:20:00'];
+  optionChart.option.series[0].data = [12, 9, 20]; //降雨量
+  optionChart.option.series[1].data = [2.3, 1.9, 3.2]; //进口流量
+  optionChart.option.series[2].data = [1.1, 0.9, 1.3]; //出口流量
+  // 设置鼠标滚轮放大缩小展示数据区间
+  optionChart.option.dataZoom = [{ type: 'inside', startValue: optionChart.option.xAxis.data[optionChart.option.xAxis.data.length / 2] }];
+  if (optionChart.option.xAxis.data.length > 0) {
+    optionChart.option.graphic.invisible = true; //暂无数据
+  } else {
+    optionChart.option.graphic.invisible = false; //暂无数据
+  }
+  charts.value.clear();
+  charts.value.setOption(optionChart.option);
+}
+
+onMounted(() => {
+  handleQuery();
+});
+</script>
+
+<style lang="scss" scoped></style>

diff --git a/src/views/sponeScreen/Echarts/echartBar3D.vue b/src/views/sponeScreen/Echarts/echartBar3D.vue
index 3d23886..038626c 100644
--- a/src/views/sponeScreen/Echarts/echartBar3D.vue
+++ b/src/views/sponeScreen/Echarts/echartBar3D.vue
@@ -65,14 +65,14 @@
             lineStyle: {
               color: '#384267',
             },
-            show: true,
+            show: false,
           },
           splitLine: {
             show: false,
           },
           axisLine: {
             lineStyle: {
-              color: '#384267',
+              color: '#005CBA',
               width: 1,
               type: 'dashed',
             },
@@ -91,7 +91,7 @@
               color: '#005CBA',
               width: 1,
             },
-            show: true,
+            show: false,
           },
           splitLine: {
             show: true,
@@ -214,7 +214,9 @@
     );
 
     onMounted(() => {
-      init();
+      setTimeout(() => {
+        init();
+      }, 0);
       window.addEventListener('resize', resizeTheChart);
     });
     return {
diff --git a/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue b/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
index 37c3002..3075239 100644
--- a/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
+++ b/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
@@ -1 +1,65 @@
-<template><div>年径流污染削减率管理信息</div></template>
+<template>
+  <!-- 年径流污染削减率 -->
+  <div class="publicContainer">
+    <!-- gis地图 -->
+    <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
+
+    <!-- 海绵设施监测详情 -->
+    <el-dialog v-model="dialogShow" title="海绵设施监测点位详情" :modal-append-to-body="false" width="600px">
+      <el-form :inline="true">
+        <el-form-item label="日期" prop="date">
+          <el-date-picker type="daterange" v-model="dateSearch" value-format="YYYY-MM-DD" placeholder="请选择"></el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+        </el-form-item>
+      </el-form>
+      <div id="chartHMXJ" style="width: 100%; height: 300px"></div>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import MapBox from '@/views/gisMapPage/gisMapBox1'; //gis地图
+import optionChart from './chartOption.js';
+
+const { proxy } = getCurrentInstance();
+const dialogShow = ref(true);
+const charts = ref(null);
+const dateSearch = ref([proxy.moment(new Date()).subtract(60, 'days').format('YYYY-MM-DD'), proxy.moment().format('YYYY-MM-DD')]);
+
+// 历史数据搜索
+function handleQuery() {
+  setTimeout(() => {
+    initChart();
+  });
+}
+
+// echarts初始化
+function initChart() {
+  charts.value && charts.value.dispose();
+  charts.value = proxy.echarts.init(document.getElementById('chartHMXJ'));
+  optionChart.option.xAxis.data = ['2024-06-12 00:00:00', '2024-06-12 00:10:00', '2024-06-12 00:20:00'];
+  optionChart.option.yAxis[1].name = 'SS(mg/L)';
+  optionChart.option.series[0].data = [12, 9, 20]; //降雨量
+  optionChart.option.series[1].name = '进口SS';
+  optionChart.option.series[1].data = [230, 190, 132]; //进口SS
+  optionChart.option.series[2].name = '出口SS';
+  optionChart.option.series[2].data = [110, 90, 103]; //出口SS
+  // 设置鼠标滚轮放大缩小展示数据区间
+  optionChart.option.dataZoom = [{ type: 'inside', startValue: optionChart.option.xAxis.data[optionChart.option.xAxis.data.length / 2] }];
+  if (optionChart.option.xAxis.data.length > 0) {
+    optionChart.option.graphic.invisible = true; //暂无数据
+  } else {
+    optionChart.option.graphic.invisible = false; //暂无数据
+  }
+  charts.value.clear();
+  charts.value.setOption(optionChart.option);
+}
+
+onMounted(() => {
+  handleQuery();
+});
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue b/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
index c06a3dc..35608fb 100644
--- a/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
+++ b/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
@@ -1,3 +1,62 @@
 <template>
-  <div>年径流总量控制率管理信息</div>
+  <!-- 年径流总量控制率 -->
+  <div class="publicContainer">
+    <!-- gis地图 -->
+    <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
+
+    <!-- 海绵设施监测详情 -->
+    <el-dialog v-model="dialogShow" title="海绵设施监测点位详情" :modal-append-to-body="false" width="600px">
+      <el-form :inline="true">
+        <el-form-item label="日期" prop="date">
+          <el-date-picker type="daterange" v-model="dateSearch" value-format="YYYY-MM-DD" placeholder="请选择"></el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+        </el-form-item>
+      </el-form>
+      <div id="chartHMJC" style="width: 100%; height: 300px"></div>
+    </el-dialog>
+  </div>
 </template>
+
+<script setup>
+import MapBox from '@/views/gisMapPage/gisMapBox1'; //gis地图
+import optionChart from './chartOption.js';
+
+const { proxy } = getCurrentInstance();
+const dialogShow = ref(true);
+const charts = ref(null);
+const dateSearch = ref([proxy.moment(new Date()).subtract(60, 'days').format('YYYY-MM-DD'), proxy.moment().format('YYYY-MM-DD')]);
+
+// 历史数据搜索
+function handleQuery() {
+  setTimeout(() => {
+    initChart();
+  });
+}
+
+// echarts初始化
+function initChart() {
+  charts.value && charts.value.dispose();
+  charts.value = proxy.echarts.init(document.getElementById('chartHMJC'));
+  optionChart.option.xAxis.data = ['2024-06-12 00:00:00', '2024-06-12 00:10:00', '2024-06-12 00:20:00'];
+  optionChart.option.series[0].data = [12, 9, 20]; //降雨量
+  optionChart.option.series[1].data = [2.3, 1.9, 3.2]; //进口流量
+  optionChart.option.series[2].data = [1.1, 0.9, 1.3]; //出口流量
+  // 设置鼠标滚轮放大缩小展示数据区间
+  optionChart.option.dataZoom = [{ type: 'inside', startValue: optionChart.option.xAxis.data[optionChart.option.xAxis.data.length / 2] }];
+  if (optionChart.option.xAxis.data.length > 0) {
+    optionChart.option.graphic.invisible = true; //暂无数据
+  } else {
+    optionChart.option.graphic.invisible = false; //暂无数据
+  }
+  charts.value.clear();
+  charts.value.setOption(optionChart.option);
+}
+
+onMounted(() => {
+  handleQuery();
+});
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue b/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue
index d49fc2a..b86ad5d 100644
--- a/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue
+++ b/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue
@@ -1,4 +1,5 @@
 <template>
+  <!-- 污水处理厂进水BOD -->
   <div class="publicContainer">
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
       <el-form-item label="统计年份" prop="date">
@@ -13,7 +14,6 @@
 
       <el-form-item>
         <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
-        <el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button>
         <el-button icon="Refresh" @click="resetQuery">重置</el-button>
       </el-form-item>
     </el-form>
@@ -21,23 +21,17 @@
     <!-- 表格 -->
     <el-table :data="dataList" v-loading="loading" stripe :max-height="580">
       <el-table-column type="index" width="55" label="序号" />
-      <el-table-column label="统计年份" prop="q" />
       <el-table-column label="日期" prop="w" />
-      <el-table-column label="进水BOD平均浓度（mg/L）">
+      <el-table-column label="进水BOD平均浓度(mg/L)">
         <el-table-column prop="monthPlan1" label="西区污水处理厂" />
         <el-table-column prop="monthPlan2" label="东区污水处理厂" />
-        <el-table-column prop="monthPlan3" label="马家河污水厂" />
+        <el-table-column prop="monthPlan3" label="马家河污水处理厂" />
+        <el-table-column prop="monthPlan4" label="包公湖污水处理厂" />
+        <el-table-column prop="monthPlan5" label="祥符区污水处理厂" />
       </el-table-column>
       <el-table-column label="均值" prop="p" />
       <el-table-column label="年度绩效指标" prop="a" />
-      <el-table-column label="评价结论" prop="a" />
-      <el-table-column label="操作" width="240">
-        <template #default="scope">
-          <el-button link icon="View" type="primary" @click="handleDetail(scope.row, 'view')">查看</el-button>
-          <el-button link type="warning" icon="Edit" @click="handleUpdate(scope.row, 'view')">修改</el-button>
-          <el-button link type="danger" icon="Delete" @click="handleDelete(scope.row, 'view')">删除</el-button>
-        </template>
-      </el-table-column>
+      <el-table-column label="年度达标情况" prop="b" />
     </el-table>
     <!-- 分页 -->
     <pagination
@@ -47,117 +41,23 @@
       v-model:limit="queryParams.pageSize"
       @pagination="getList"
     />
-    <!-- 新增弹窗 -->
-    <el-dialog :title="title" v-model="open" width="800px" append-to-body :close-on-click-modal="false">
-      <el-form ref="roleRef" :model="form" :rules="rules" label-width="130px" :disabled="multiple">
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="统计年份:" prop="w">
-              <el-date-picker
-                type="year"
-                v-model="queryParams.date"
-                value-format="YYYY"
-                placeholder="请选择统计年份"
-                style="width: 100%"
-              ></el-date-picker>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="日期:" prop="w">
-              <el-date-picker
-                type="month"
-                v-model="queryParams.date"
-                value-format="YYYY-MM"
-                placeholder="请选择日期"
-                style="width: 100%"
-              ></el-date-picker>
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="西区污水处理厂:" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入西区污水处理厂" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="东区污水处理厂:" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入东区污水处理厂" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="马家河污水厂:" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入马家河污水厂" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="均值:" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入均值" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="年度绩效指标" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入年度绩效指标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="评价结论" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入评价结论标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-      </el-form>
-      <template #footer>
-        <div class="dialog-footer">
-          <el-button type="primary" @click="submitForm">确 定</el-button>
-          <el-button @click="cancel">取 消</el-button>
-        </div>
-      </template>
-    </el-dialog>
   </div>
 </template>
 <script setup name="WaterSupplyWaterPlants">
 const { proxy } = getCurrentInstance();
-const open = ref(false);
-const multiple = ref(false);
 const showSearch = ref(true);
-const Xcfrequency = ref([
-  {
-    value: 'tian',
-    label: '天',
-  },
-  {
-    value: 'zhou',
-    label: '周',
-  },
-]);
 const loading = ref(true);
 const total = ref(0);
-const title = ref('');
 const dataList = ref([]);
 const AllData = reactive({
   id: '',
-  form: {},
   queryParams: {
     pageNum: 1,
     pageSize: 10,
-    caseType: 1,
-    handleStatus: '',
-    searchContent: '',
-  },
-  rules: {
-    id: [{ required: true, message: '请输入', trigger: 'blur' }],
-    eventDescription: [{ required: true, message: '请输入', trigger: 'blur' }],
+    date: null,
   },
 });
-const { queryParams, form, rules } = toRefs(AllData);
+const { queryParams } = toRefs(AllData);
 //搜索
 function handleQuery() {
   getList();
@@ -167,39 +67,6 @@
   proxy.resetForm('queryRef');
   handleQuery();
 }
-// 新增
-function handleAdd() {
-  title.value = '新增水厂供水';
-  open.value = true;
-  form.value = {};
-  multiple.value = false;
-  form.value.fileTag = Xcfrequency.value[0].value;
-}
-// 新增中取消事件
-function cancel() {
-  open.value = false;
-  proxy.resetForm('roleRef');
-}
-
-// 巡查频率下拉框点击事件
-function changeStation(value) {
-  // console.log(value, 'value');
-}
-
-//查看详情操作
-function handleDetail(row) {
-  open.value = true;
-  title.value = '查看水厂供水';
-  multiple.value = true;
-  form.value = row;
-}
-// 修改按钮操作
-function handleUpdate(row) {
-  open.value = true;
-  title.value = '修改水厂供水';
-  multiple.value = false;
-  form.value = { ...row };
-}
 
 /** 查询列表 */
 const getList = async () => {
@@ -211,12 +78,4 @@
   getList();
 });
 </script>
-<style scoped lang="scss">
-.dituclass {
-  width: 100%;
-  height: 300px;
-  // background: red;
-  margin-bottom: 10px;
-  border: 1px solid #004565;
-}
-</style>
+<style scoped lang="scss"></style>

diff --git a/src/views/sponeScreen/Echarts/echartBar3D.vue b/src/views/sponeScreen/Echarts/echartBar3D.vue
index 3d23886..038626c 100644
--- a/src/views/sponeScreen/Echarts/echartBar3D.vue
+++ b/src/views/sponeScreen/Echarts/echartBar3D.vue
@@ -65,14 +65,14 @@
             lineStyle: {
               color: '#384267',
             },
-            show: true,
+            show: false,
           },
           splitLine: {
             show: false,
           },
           axisLine: {
             lineStyle: {
-              color: '#384267',
+              color: '#005CBA',
               width: 1,
               type: 'dashed',
             },
@@ -91,7 +91,7 @@
               color: '#005CBA',
               width: 1,
             },
-            show: true,
+            show: false,
           },
           splitLine: {
             show: true,
@@ -214,7 +214,9 @@
     );
 
     onMounted(() => {
-      init();
+      setTimeout(() => {
+        init();
+      }, 0);
       window.addEventListener('resize', resizeTheChart);
     });
     return {
diff --git a/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue b/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
index 37c3002..3075239 100644
--- a/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
+++ b/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
@@ -1 +1,65 @@
-<template><div>年径流污染削减率管理信息</div></template>
+<template>
+  <!-- 年径流污染削减率 -->
+  <div class="publicContainer">
+    <!-- gis地图 -->
+    <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
+
+    <!-- 海绵设施监测详情 -->
+    <el-dialog v-model="dialogShow" title="海绵设施监测点位详情" :modal-append-to-body="false" width="600px">
+      <el-form :inline="true">
+        <el-form-item label="日期" prop="date">
+          <el-date-picker type="daterange" v-model="dateSearch" value-format="YYYY-MM-DD" placeholder="请选择"></el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+        </el-form-item>
+      </el-form>
+      <div id="chartHMXJ" style="width: 100%; height: 300px"></div>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import MapBox from '@/views/gisMapPage/gisMapBox1'; //gis地图
+import optionChart from './chartOption.js';
+
+const { proxy } = getCurrentInstance();
+const dialogShow = ref(true);
+const charts = ref(null);
+const dateSearch = ref([proxy.moment(new Date()).subtract(60, 'days').format('YYYY-MM-DD'), proxy.moment().format('YYYY-MM-DD')]);
+
+// 历史数据搜索
+function handleQuery() {
+  setTimeout(() => {
+    initChart();
+  });
+}
+
+// echarts初始化
+function initChart() {
+  charts.value && charts.value.dispose();
+  charts.value = proxy.echarts.init(document.getElementById('chartHMXJ'));
+  optionChart.option.xAxis.data = ['2024-06-12 00:00:00', '2024-06-12 00:10:00', '2024-06-12 00:20:00'];
+  optionChart.option.yAxis[1].name = 'SS(mg/L)';
+  optionChart.option.series[0].data = [12, 9, 20]; //降雨量
+  optionChart.option.series[1].name = '进口SS';
+  optionChart.option.series[1].data = [230, 190, 132]; //进口SS
+  optionChart.option.series[2].name = '出口SS';
+  optionChart.option.series[2].data = [110, 90, 103]; //出口SS
+  // 设置鼠标滚轮放大缩小展示数据区间
+  optionChart.option.dataZoom = [{ type: 'inside', startValue: optionChart.option.xAxis.data[optionChart.option.xAxis.data.length / 2] }];
+  if (optionChart.option.xAxis.data.length > 0) {
+    optionChart.option.graphic.invisible = true; //暂无数据
+  } else {
+    optionChart.option.graphic.invisible = false; //暂无数据
+  }
+  charts.value.clear();
+  charts.value.setOption(optionChart.option);
+}
+
+onMounted(() => {
+  handleQuery();
+});
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue b/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
index c06a3dc..35608fb 100644
--- a/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
+++ b/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
@@ -1,3 +1,62 @@
 <template>
-  <div>年径流总量控制率管理信息</div>
+  <!-- 年径流总量控制率 -->
+  <div class="publicContainer">
+    <!-- gis地图 -->
+    <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
+
+    <!-- 海绵设施监测详情 -->
+    <el-dialog v-model="dialogShow" title="海绵设施监测点位详情" :modal-append-to-body="false" width="600px">
+      <el-form :inline="true">
+        <el-form-item label="日期" prop="date">
+          <el-date-picker type="daterange" v-model="dateSearch" value-format="YYYY-MM-DD" placeholder="请选择"></el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+        </el-form-item>
+      </el-form>
+      <div id="chartHMJC" style="width: 100%; height: 300px"></div>
+    </el-dialog>
+  </div>
 </template>
+
+<script setup>
+import MapBox from '@/views/gisMapPage/gisMapBox1'; //gis地图
+import optionChart from './chartOption.js';
+
+const { proxy } = getCurrentInstance();
+const dialogShow = ref(true);
+const charts = ref(null);
+const dateSearch = ref([proxy.moment(new Date()).subtract(60, 'days').format('YYYY-MM-DD'), proxy.moment().format('YYYY-MM-DD')]);
+
+// 历史数据搜索
+function handleQuery() {
+  setTimeout(() => {
+    initChart();
+  });
+}
+
+// echarts初始化
+function initChart() {
+  charts.value && charts.value.dispose();
+  charts.value = proxy.echarts.init(document.getElementById('chartHMJC'));
+  optionChart.option.xAxis.data = ['2024-06-12 00:00:00', '2024-06-12 00:10:00', '2024-06-12 00:20:00'];
+  optionChart.option.series[0].data = [12, 9, 20]; //降雨量
+  optionChart.option.series[1].data = [2.3, 1.9, 3.2]; //进口流量
+  optionChart.option.series[2].data = [1.1, 0.9, 1.3]; //出口流量
+  // 设置鼠标滚轮放大缩小展示数据区间
+  optionChart.option.dataZoom = [{ type: 'inside', startValue: optionChart.option.xAxis.data[optionChart.option.xAxis.data.length / 2] }];
+  if (optionChart.option.xAxis.data.length > 0) {
+    optionChart.option.graphic.invisible = true; //暂无数据
+  } else {
+    optionChart.option.graphic.invisible = false; //暂无数据
+  }
+  charts.value.clear();
+  charts.value.setOption(optionChart.option);
+}
+
+onMounted(() => {
+  handleQuery();
+});
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue b/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue
index d49fc2a..b86ad5d 100644
--- a/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue
+++ b/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue
@@ -1,4 +1,5 @@
 <template>
+  <!-- 污水处理厂进水BOD -->
   <div class="publicContainer">
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
       <el-form-item label="统计年份" prop="date">
@@ -13,7 +14,6 @@
 
       <el-form-item>
         <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
-        <el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button>
         <el-button icon="Refresh" @click="resetQuery">重置</el-button>
       </el-form-item>
     </el-form>
@@ -21,23 +21,17 @@
     <!-- 表格 -->
     <el-table :data="dataList" v-loading="loading" stripe :max-height="580">
       <el-table-column type="index" width="55" label="序号" />
-      <el-table-column label="统计年份" prop="q" />
       <el-table-column label="日期" prop="w" />
-      <el-table-column label="进水BOD平均浓度（mg/L）">
+      <el-table-column label="进水BOD平均浓度(mg/L)">
         <el-table-column prop="monthPlan1" label="西区污水处理厂" />
         <el-table-column prop="monthPlan2" label="东区污水处理厂" />
-        <el-table-column prop="monthPlan3" label="马家河污水厂" />
+        <el-table-column prop="monthPlan3" label="马家河污水处理厂" />
+        <el-table-column prop="monthPlan4" label="包公湖污水处理厂" />
+        <el-table-column prop="monthPlan5" label="祥符区污水处理厂" />
       </el-table-column>
       <el-table-column label="均值" prop="p" />
       <el-table-column label="年度绩效指标" prop="a" />
-      <el-table-column label="评价结论" prop="a" />
-      <el-table-column label="操作" width="240">
-        <template #default="scope">
-          <el-button link icon="View" type="primary" @click="handleDetail(scope.row, 'view')">查看</el-button>
-          <el-button link type="warning" icon="Edit" @click="handleUpdate(scope.row, 'view')">修改</el-button>
-          <el-button link type="danger" icon="Delete" @click="handleDelete(scope.row, 'view')">删除</el-button>
-        </template>
-      </el-table-column>
+      <el-table-column label="年度达标情况" prop="b" />
     </el-table>
     <!-- 分页 -->
     <pagination
@@ -47,117 +41,23 @@
       v-model:limit="queryParams.pageSize"
       @pagination="getList"
     />
-    <!-- 新增弹窗 -->
-    <el-dialog :title="title" v-model="open" width="800px" append-to-body :close-on-click-modal="false">
-      <el-form ref="roleRef" :model="form" :rules="rules" label-width="130px" :disabled="multiple">
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="统计年份:" prop="w">
-              <el-date-picker
-                type="year"
-                v-model="queryParams.date"
-                value-format="YYYY"
-                placeholder="请选择统计年份"
-                style="width: 100%"
-              ></el-date-picker>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="日期:" prop="w">
-              <el-date-picker
-                type="month"
-                v-model="queryParams.date"
-                value-format="YYYY-MM"
-                placeholder="请选择日期"
-                style="width: 100%"
-              ></el-date-picker>
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="西区污水处理厂:" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入西区污水处理厂" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="东区污水处理厂:" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入东区污水处理厂" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="马家河污水厂:" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入马家河污水厂" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="均值:" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入均值" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="年度绩效指标" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入年度绩效指标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="评价结论" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入评价结论标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-      </el-form>
-      <template #footer>
-        <div class="dialog-footer">
-          <el-button type="primary" @click="submitForm">确 定</el-button>
-          <el-button @click="cancel">取 消</el-button>
-        </div>
-      </template>
-    </el-dialog>
   </div>
 </template>
 <script setup name="WaterSupplyWaterPlants">
 const { proxy } = getCurrentInstance();
-const open = ref(false);
-const multiple = ref(false);
 const showSearch = ref(true);
-const Xcfrequency = ref([
-  {
-    value: 'tian',
-    label: '天',
-  },
-  {
-    value: 'zhou',
-    label: '周',
-  },
-]);
 const loading = ref(true);
 const total = ref(0);
-const title = ref('');
 const dataList = ref([]);
 const AllData = reactive({
   id: '',
-  form: {},
   queryParams: {
     pageNum: 1,
     pageSize: 10,
-    caseType: 1,
-    handleStatus: '',
-    searchContent: '',
-  },
-  rules: {
-    id: [{ required: true, message: '请输入', trigger: 'blur' }],
-    eventDescription: [{ required: true, message: '请输入', trigger: 'blur' }],
+    date: null,
   },
 });
-const { queryParams, form, rules } = toRefs(AllData);
+const { queryParams } = toRefs(AllData);
 //搜索
 function handleQuery() {
   getList();
@@ -167,39 +67,6 @@
   proxy.resetForm('queryRef');
   handleQuery();
 }
-// 新增
-function handleAdd() {
-  title.value = '新增水厂供水';
-  open.value = true;
-  form.value = {};
-  multiple.value = false;
-  form.value.fileTag = Xcfrequency.value[0].value;
-}
-// 新增中取消事件
-function cancel() {
-  open.value = false;
-  proxy.resetForm('roleRef');
-}
-
-// 巡查频率下拉框点击事件
-function changeStation(value) {
-  // console.log(value, 'value');
-}
-
-//查看详情操作
-function handleDetail(row) {
-  open.value = true;
-  title.value = '查看水厂供水';
-  multiple.value = true;
-  form.value = row;
-}
-// 修改按钮操作
-function handleUpdate(row) {
-  open.value = true;
-  title.value = '修改水厂供水';
-  multiple.value = false;
-  form.value = { ...row };
-}
 
 /** 查询列表 */
 const getList = async () => {
@@ -211,12 +78,4 @@
   getList();
 });
 </script>
-<style scoped lang="scss">
-.dituclass {
-  width: 100%;
-  height: 300px;
-  // background: red;
-  margin-bottom: 10px;
-  border: 1px solid #004565;
-}
-</style>
+<style scoped lang="scss"></style>
diff --git a/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue b/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue
index 6ce3f37..94c365b 100644
--- a/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue
+++ b/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue
@@ -1,34 +1,31 @@
 <template>
+  <!-- 城市生活污水集中收集率 -->
   <div class="publicContainer">
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
-      <el-form-item label="污水厂名称:" prop="searchContent">
-        <el-input v-model="queryParams.searchContent" placeholder="请输入污水厂名称" clearable style="width: 180px" />
-      </el-form-item>
       <el-form-item label="统计年份" prop="date">
         <el-date-picker type="year" v-model="queryParams.date" value-format="YYYY" placeholder="请选择统计年份"></el-date-picker>
       </el-form-item>
 
       <el-form-item>
         <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
-        <el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button>
         <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+        <el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button>
       </el-form-item>
     </el-form>
 
     <!-- 表格 -->
     <el-table :data="dataList" v-loading="loading" stripe :max-height="580">
       <el-table-column type="index" width="55" label="序号" />
-      <el-table-column label="污水厂名称" prop="q" />
-      <el-table-column label="编码" prop="w" />
       <el-table-column label="统计年份" prop="o" />
-      <el-table-column label="年度绩效指标" prop="p" />
+      <el-table-column label="污水厂名称" prop="q" />
       <el-table-column label="累计处理水量(万t)" prop="e" />
       <el-table-column label="进水BOD平均浓度(mg/L)" prop="r" />
       <el-table-column label="BOD 削减量(g)" prop="t" />
       <el-table-column label="城区用水人口(万人)" prop="y" />
       <el-table-column label="人均日生活污染排放量(g/人·d)" prop="u" />
-      <el-table-column label="城市生活污水集中收集率(%)" prop="i" />
-      <el-table-column label="评价结论" prop="a" />
+      <el-table-column label="目标收集率(%)" prop="p" />
+      <el-table-column label="实际收集率(%)" prop="i" />
+      <el-table-column label="达标情况" prop="a" />
       <el-table-column label="操作" width="240">
         <template #default="scope">
           <el-button link icon="View" type="primary" @click="handleDetail(scope.row, 'view')">查看</el-button>
@@ -46,93 +43,46 @@
       @pagination="getList"
     />
     <!-- 新增弹窗 -->
-    <el-dialog :title="title" v-model="open" width="1100px" append-to-body :close-on-click-modal="false">
+    <el-dialog :title="title" v-model="open" width="600px" append-to-body :close-on-click-modal="false">
       <el-form ref="roleRef" :model="form" :rules="rules" label-width="220px" :disabled="multiple">
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="污水厂名称:" prop="w">
-              <el-input v-model="form.w" placeholder="请输入污水厂名称" clearable style="width: 100%" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="编码:" prop="w">
-              <el-input v-model="form.w" placeholder="请输入编码" clearable style="width: 100%" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="累计处理水量(万t):" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入累计处理水量(万t)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="进水BOD平均浓度(mg/L):" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入进水BOD平均浓度(mg/L)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="BOD 削减量(g):" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入BOD 削减量(g)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="城区用水人口(万人):" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入城区用水人口(万人)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="人均日生活污染排放量(g/人·d):" prop="lon">
-              <el-input-number
-                v-model="form.lon"
-                placeholder="请输入人均日生活污染排放量(g/人·d)"
-                style="width: 100%"
-                controls-position="right"
-              />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="城市生活污水集中收集率(%):" prop="lat">
-              <el-input-number
-                v-model="form.lat"
-                placeholder="请输入城市生活污水集中收集率(%)"
-                style="width: 100%"
-                controls-position="right"
-              />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="统计年份" prop="date">
-              <el-date-picker
-                type="year"
-                v-model="queryParams.date"
-                value-format="YYYY"
-                placeholder="请选择统计年份"
-                style="width: 100%"
-              ></el-date-picker>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="年度绩效指标" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入年度绩效指标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="评价结论" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入评价结论标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-        </el-row>
+        <el-form-item label="统计年份" prop="date">
+          <el-date-picker
+            type="year"
+            v-model="queryParams.date"
+            value-format="YYYY"
+            placeholder="请选择统计年份"
+            style="width: 100%"
+          ></el-date-picker>
+        </el-form-item>
+        <el-form-item label="污水厂名称:" prop="w">
+          <el-input v-model="form.w" placeholder="请输入污水厂名称" clearable style="width: 100%" />
+        </el-form-item>
+        <el-form-item label="累计处理水量(万t):" prop="lon">
+          <el-input-number v-model="form.lon" placeholder="请输入累计处理水量(万t)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="进水BOD平均浓度(mg/L):" prop="lat">
+          <el-input-number v-model="form.lat" placeholder="请输入进水BOD平均浓度(mg/L)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="BOD 削减量(g):" prop="lon">
+          <el-input-number v-model="form.lon" placeholder="请输入BOD 削减量(g)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="城区用水人口(万人):" prop="lat">
+          <el-input-number v-model="form.lat" placeholder="请输入城区用水人口(万人)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="人均日生活污染排放量(g/人·d):" prop="lon">
+          <el-input-number
+            v-model="form.lon"
+            placeholder="请输入人均日生活污染排放量(g/人·d)"
+            style="width: 100%"
+            controls-position="right"
+          />
+        </el-form-item>
+        <el-form-item label="目标收集率(%):" prop="date">
+          <el-input-number v-model="form.lon" placeholder="请输入目标收集率" style="width: 100%" />
+        </el-form-item>
+        <el-form-item label="实际收集率(%):" prop="lat">
+          <el-input-number v-model="form.lat" placeholder="请输入实际收集率(%)" style="width: 100%" controls-position="right" />
+        </el-form-item>
       </el-form>
       <template #footer>
         <div class="dialog-footer">
@@ -170,7 +120,6 @@
     pageSize: 10,
     caseType: 1,
     handleStatus: '',
-    searchContent: '',
   },
   rules: {
     id: [{ required: true, message: '请输入', trigger: 'blur' }],

diff --git a/src/views/sponeScreen/Echarts/echartBar3D.vue b/src/views/sponeScreen/Echarts/echartBar3D.vue
index 3d23886..038626c 100644
--- a/src/views/sponeScreen/Echarts/echartBar3D.vue
+++ b/src/views/sponeScreen/Echarts/echartBar3D.vue
@@ -65,14 +65,14 @@
             lineStyle: {
               color: '#384267',
             },
-            show: true,
+            show: false,
           },
           splitLine: {
             show: false,
           },
           axisLine: {
             lineStyle: {
-              color: '#384267',
+              color: '#005CBA',
               width: 1,
               type: 'dashed',
             },
@@ -91,7 +91,7 @@
               color: '#005CBA',
               width: 1,
             },
-            show: true,
+            show: false,
           },
           splitLine: {
             show: true,
@@ -214,7 +214,9 @@
     );
 
     onMounted(() => {
-      init();
+      setTimeout(() => {
+        init();
+      }, 0);
       window.addEventListener('resize', resizeTheChart);
     });
     return {
diff --git a/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue b/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
index 37c3002..3075239 100644
--- a/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
+++ b/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
@@ -1 +1,65 @@
-<template><div>年径流污染削减率管理信息</div></template>
+<template>
+  <!-- 年径流污染削减率 -->
+  <div class="publicContainer">
+    <!-- gis地图 -->
+    <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
+
+    <!-- 海绵设施监测详情 -->
+    <el-dialog v-model="dialogShow" title="海绵设施监测点位详情" :modal-append-to-body="false" width="600px">
+      <el-form :inline="true">
+        <el-form-item label="日期" prop="date">
+          <el-date-picker type="daterange" v-model="dateSearch" value-format="YYYY-MM-DD" placeholder="请选择"></el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+        </el-form-item>
+      </el-form>
+      <div id="chartHMXJ" style="width: 100%; height: 300px"></div>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import MapBox from '@/views/gisMapPage/gisMapBox1'; //gis地图
+import optionChart from './chartOption.js';
+
+const { proxy } = getCurrentInstance();
+const dialogShow = ref(true);
+const charts = ref(null);
+const dateSearch = ref([proxy.moment(new Date()).subtract(60, 'days').format('YYYY-MM-DD'), proxy.moment().format('YYYY-MM-DD')]);
+
+// 历史数据搜索
+function handleQuery() {
+  setTimeout(() => {
+    initChart();
+  });
+}
+
+// echarts初始化
+function initChart() {
+  charts.value && charts.value.dispose();
+  charts.value = proxy.echarts.init(document.getElementById('chartHMXJ'));
+  optionChart.option.xAxis.data = ['2024-06-12 00:00:00', '2024-06-12 00:10:00', '2024-06-12 00:20:00'];
+  optionChart.option.yAxis[1].name = 'SS(mg/L)';
+  optionChart.option.series[0].data = [12, 9, 20]; //降雨量
+  optionChart.option.series[1].name = '进口SS';
+  optionChart.option.series[1].data = [230, 190, 132]; //进口SS
+  optionChart.option.series[2].name = '出口SS';
+  optionChart.option.series[2].data = [110, 90, 103]; //出口SS
+  // 设置鼠标滚轮放大缩小展示数据区间
+  optionChart.option.dataZoom = [{ type: 'inside', startValue: optionChart.option.xAxis.data[optionChart.option.xAxis.data.length / 2] }];
+  if (optionChart.option.xAxis.data.length > 0) {
+    optionChart.option.graphic.invisible = true; //暂无数据
+  } else {
+    optionChart.option.graphic.invisible = false; //暂无数据
+  }
+  charts.value.clear();
+  charts.value.setOption(optionChart.option);
+}
+
+onMounted(() => {
+  handleQuery();
+});
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue b/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
index c06a3dc..35608fb 100644
--- a/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
+++ b/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
@@ -1,3 +1,62 @@
 <template>
-  <div>年径流总量控制率管理信息</div>
+  <!-- 年径流总量控制率 -->
+  <div class="publicContainer">
+    <!-- gis地图 -->
+    <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
+
+    <!-- 海绵设施监测详情 -->
+    <el-dialog v-model="dialogShow" title="海绵设施监测点位详情" :modal-append-to-body="false" width="600px">
+      <el-form :inline="true">
+        <el-form-item label="日期" prop="date">
+          <el-date-picker type="daterange" v-model="dateSearch" value-format="YYYY-MM-DD" placeholder="请选择"></el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+        </el-form-item>
+      </el-form>
+      <div id="chartHMJC" style="width: 100%; height: 300px"></div>
+    </el-dialog>
+  </div>
 </template>
+
+<script setup>
+import MapBox from '@/views/gisMapPage/gisMapBox1'; //gis地图
+import optionChart from './chartOption.js';
+
+const { proxy } = getCurrentInstance();
+const dialogShow = ref(true);
+const charts = ref(null);
+const dateSearch = ref([proxy.moment(new Date()).subtract(60, 'days').format('YYYY-MM-DD'), proxy.moment().format('YYYY-MM-DD')]);
+
+// 历史数据搜索
+function handleQuery() {
+  setTimeout(() => {
+    initChart();
+  });
+}
+
+// echarts初始化
+function initChart() {
+  charts.value && charts.value.dispose();
+  charts.value = proxy.echarts.init(document.getElementById('chartHMJC'));
+  optionChart.option.xAxis.data = ['2024-06-12 00:00:00', '2024-06-12 00:10:00', '2024-06-12 00:20:00'];
+  optionChart.option.series[0].data = [12, 9, 20]; //降雨量
+  optionChart.option.series[1].data = [2.3, 1.9, 3.2]; //进口流量
+  optionChart.option.series[2].data = [1.1, 0.9, 1.3]; //出口流量
+  // 设置鼠标滚轮放大缩小展示数据区间
+  optionChart.option.dataZoom = [{ type: 'inside', startValue: optionChart.option.xAxis.data[optionChart.option.xAxis.data.length / 2] }];
+  if (optionChart.option.xAxis.data.length > 0) {
+    optionChart.option.graphic.invisible = true; //暂无数据
+  } else {
+    optionChart.option.graphic.invisible = false; //暂无数据
+  }
+  charts.value.clear();
+  charts.value.setOption(optionChart.option);
+}
+
+onMounted(() => {
+  handleQuery();
+});
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue b/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue
index d49fc2a..b86ad5d 100644
--- a/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue
+++ b/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue
@@ -1,4 +1,5 @@
 <template>
+  <!-- 污水处理厂进水BOD -->
   <div class="publicContainer">
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
       <el-form-item label="统计年份" prop="date">
@@ -13,7 +14,6 @@
 
       <el-form-item>
         <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
-        <el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button>
         <el-button icon="Refresh" @click="resetQuery">重置</el-button>
       </el-form-item>
     </el-form>
@@ -21,23 +21,17 @@
     <!-- 表格 -->
     <el-table :data="dataList" v-loading="loading" stripe :max-height="580">
       <el-table-column type="index" width="55" label="序号" />
-      <el-table-column label="统计年份" prop="q" />
       <el-table-column label="日期" prop="w" />
-      <el-table-column label="进水BOD平均浓度（mg/L）">
+      <el-table-column label="进水BOD平均浓度(mg/L)">
         <el-table-column prop="monthPlan1" label="西区污水处理厂" />
         <el-table-column prop="monthPlan2" label="东区污水处理厂" />
-        <el-table-column prop="monthPlan3" label="马家河污水厂" />
+        <el-table-column prop="monthPlan3" label="马家河污水处理厂" />
+        <el-table-column prop="monthPlan4" label="包公湖污水处理厂" />
+        <el-table-column prop="monthPlan5" label="祥符区污水处理厂" />
       </el-table-column>
       <el-table-column label="均值" prop="p" />
       <el-table-column label="年度绩效指标" prop="a" />
-      <el-table-column label="评价结论" prop="a" />
-      <el-table-column label="操作" width="240">
-        <template #default="scope">
-          <el-button link icon="View" type="primary" @click="handleDetail(scope.row, 'view')">查看</el-button>
-          <el-button link type="warning" icon="Edit" @click="handleUpdate(scope.row, 'view')">修改</el-button>
-          <el-button link type="danger" icon="Delete" @click="handleDelete(scope.row, 'view')">删除</el-button>
-        </template>
-      </el-table-column>
+      <el-table-column label="年度达标情况" prop="b" />
     </el-table>
     <!-- 分页 -->
     <pagination
@@ -47,117 +41,23 @@
       v-model:limit="queryParams.pageSize"
       @pagination="getList"
     />
-    <!-- 新增弹窗 -->
-    <el-dialog :title="title" v-model="open" width="800px" append-to-body :close-on-click-modal="false">
-      <el-form ref="roleRef" :model="form" :rules="rules" label-width="130px" :disabled="multiple">
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="统计年份:" prop="w">
-              <el-date-picker
-                type="year"
-                v-model="queryParams.date"
-                value-format="YYYY"
-                placeholder="请选择统计年份"
-                style="width: 100%"
-              ></el-date-picker>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="日期:" prop="w">
-              <el-date-picker
-                type="month"
-                v-model="queryParams.date"
-                value-format="YYYY-MM"
-                placeholder="请选择日期"
-                style="width: 100%"
-              ></el-date-picker>
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="西区污水处理厂:" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入西区污水处理厂" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="东区污水处理厂:" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入东区污水处理厂" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="马家河污水厂:" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入马家河污水厂" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="均值:" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入均值" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="年度绩效指标" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入年度绩效指标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="评价结论" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入评价结论标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-      </el-form>
-      <template #footer>
-        <div class="dialog-footer">
-          <el-button type="primary" @click="submitForm">确 定</el-button>
-          <el-button @click="cancel">取 消</el-button>
-        </div>
-      </template>
-    </el-dialog>
   </div>
 </template>
 <script setup name="WaterSupplyWaterPlants">
 const { proxy } = getCurrentInstance();
-const open = ref(false);
-const multiple = ref(false);
 const showSearch = ref(true);
-const Xcfrequency = ref([
-  {
-    value: 'tian',
-    label: '天',
-  },
-  {
-    value: 'zhou',
-    label: '周',
-  },
-]);
 const loading = ref(true);
 const total = ref(0);
-const title = ref('');
 const dataList = ref([]);
 const AllData = reactive({
   id: '',
-  form: {},
   queryParams: {
     pageNum: 1,
     pageSize: 10,
-    caseType: 1,
-    handleStatus: '',
-    searchContent: '',
-  },
-  rules: {
-    id: [{ required: true, message: '请输入', trigger: 'blur' }],
-    eventDescription: [{ required: true, message: '请输入', trigger: 'blur' }],
+    date: null,
   },
 });
-const { queryParams, form, rules } = toRefs(AllData);
+const { queryParams } = toRefs(AllData);
 //搜索
 function handleQuery() {
   getList();
@@ -167,39 +67,6 @@
   proxy.resetForm('queryRef');
   handleQuery();
 }
-// 新增
-function handleAdd() {
-  title.value = '新增水厂供水';
-  open.value = true;
-  form.value = {};
-  multiple.value = false;
-  form.value.fileTag = Xcfrequency.value[0].value;
-}
-// 新增中取消事件
-function cancel() {
-  open.value = false;
-  proxy.resetForm('roleRef');
-}
-
-// 巡查频率下拉框点击事件
-function changeStation(value) {
-  // console.log(value, 'value');
-}
-
-//查看详情操作
-function handleDetail(row) {
-  open.value = true;
-  title.value = '查看水厂供水';
-  multiple.value = true;
-  form.value = row;
-}
-// 修改按钮操作
-function handleUpdate(row) {
-  open.value = true;
-  title.value = '修改水厂供水';
-  multiple.value = false;
-  form.value = { ...row };
-}
 
 /** 查询列表 */
 const getList = async () => {
@@ -211,12 +78,4 @@
   getList();
 });
 </script>
-<style scoped lang="scss">
-.dituclass {
-  width: 100%;
-  height: 300px;
-  // background: red;
-  margin-bottom: 10px;
-  border: 1px solid #004565;
-}
-</style>
+<style scoped lang="scss"></style>
diff --git a/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue b/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue
index 6ce3f37..94c365b 100644
--- a/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue
+++ b/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue
@@ -1,34 +1,31 @@
 <template>
+  <!-- 城市生活污水集中收集率 -->
   <div class="publicContainer">
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
-      <el-form-item label="污水厂名称:" prop="searchContent">
-        <el-input v-model="queryParams.searchContent" placeholder="请输入污水厂名称" clearable style="width: 180px" />
-      </el-form-item>
       <el-form-item label="统计年份" prop="date">
         <el-date-picker type="year" v-model="queryParams.date" value-format="YYYY" placeholder="请选择统计年份"></el-date-picker>
       </el-form-item>
 
       <el-form-item>
         <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
-        <el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button>
         <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+        <el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button>
       </el-form-item>
     </el-form>
 
     <!-- 表格 -->
     <el-table :data="dataList" v-loading="loading" stripe :max-height="580">
       <el-table-column type="index" width="55" label="序号" />
-      <el-table-column label="污水厂名称" prop="q" />
-      <el-table-column label="编码" prop="w" />
       <el-table-column label="统计年份" prop="o" />
-      <el-table-column label="年度绩效指标" prop="p" />
+      <el-table-column label="污水厂名称" prop="q" />
       <el-table-column label="累计处理水量(万t)" prop="e" />
       <el-table-column label="进水BOD平均浓度(mg/L)" prop="r" />
       <el-table-column label="BOD 削减量(g)" prop="t" />
       <el-table-column label="城区用水人口(万人)" prop="y" />
       <el-table-column label="人均日生活污染排放量(g/人·d)" prop="u" />
-      <el-table-column label="城市生活污水集中收集率(%)" prop="i" />
-      <el-table-column label="评价结论" prop="a" />
+      <el-table-column label="目标收集率(%)" prop="p" />
+      <el-table-column label="实际收集率(%)" prop="i" />
+      <el-table-column label="达标情况" prop="a" />
       <el-table-column label="操作" width="240">
         <template #default="scope">
           <el-button link icon="View" type="primary" @click="handleDetail(scope.row, 'view')">查看</el-button>
@@ -46,93 +43,46 @@
       @pagination="getList"
     />
     <!-- 新增弹窗 -->
-    <el-dialog :title="title" v-model="open" width="1100px" append-to-body :close-on-click-modal="false">
+    <el-dialog :title="title" v-model="open" width="600px" append-to-body :close-on-click-modal="false">
       <el-form ref="roleRef" :model="form" :rules="rules" label-width="220px" :disabled="multiple">
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="污水厂名称:" prop="w">
-              <el-input v-model="form.w" placeholder="请输入污水厂名称" clearable style="width: 100%" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="编码:" prop="w">
-              <el-input v-model="form.w" placeholder="请输入编码" clearable style="width: 100%" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="累计处理水量(万t):" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入累计处理水量(万t)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="进水BOD平均浓度(mg/L):" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入进水BOD平均浓度(mg/L)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="BOD 削减量(g):" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入BOD 削减量(g)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="城区用水人口(万人):" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入城区用水人口(万人)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="人均日生活污染排放量(g/人·d):" prop="lon">
-              <el-input-number
-                v-model="form.lon"
-                placeholder="请输入人均日生活污染排放量(g/人·d)"
-                style="width: 100%"
-                controls-position="right"
-              />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="城市生活污水集中收集率(%):" prop="lat">
-              <el-input-number
-                v-model="form.lat"
-                placeholder="请输入城市生活污水集中收集率(%)"
-                style="width: 100%"
-                controls-position="right"
-              />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="统计年份" prop="date">
-              <el-date-picker
-                type="year"
-                v-model="queryParams.date"
-                value-format="YYYY"
-                placeholder="请选择统计年份"
-                style="width: 100%"
-              ></el-date-picker>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="年度绩效指标" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入年度绩效指标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="评价结论" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入评价结论标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-        </el-row>
+        <el-form-item label="统计年份" prop="date">
+          <el-date-picker
+            type="year"
+            v-model="queryParams.date"
+            value-format="YYYY"
+            placeholder="请选择统计年份"
+            style="width: 100%"
+          ></el-date-picker>
+        </el-form-item>
+        <el-form-item label="污水厂名称:" prop="w">
+          <el-input v-model="form.w" placeholder="请输入污水厂名称" clearable style="width: 100%" />
+        </el-form-item>
+        <el-form-item label="累计处理水量(万t):" prop="lon">
+          <el-input-number v-model="form.lon" placeholder="请输入累计处理水量(万t)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="进水BOD平均浓度(mg/L):" prop="lat">
+          <el-input-number v-model="form.lat" placeholder="请输入进水BOD平均浓度(mg/L)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="BOD 削减量(g):" prop="lon">
+          <el-input-number v-model="form.lon" placeholder="请输入BOD 削减量(g)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="城区用水人口(万人):" prop="lat">
+          <el-input-number v-model="form.lat" placeholder="请输入城区用水人口(万人)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="人均日生活污染排放量(g/人·d):" prop="lon">
+          <el-input-number
+            v-model="form.lon"
+            placeholder="请输入人均日生活污染排放量(g/人·d)"
+            style="width: 100%"
+            controls-position="right"
+          />
+        </el-form-item>
+        <el-form-item label="目标收集率(%):" prop="date">
+          <el-input-number v-model="form.lon" placeholder="请输入目标收集率" style="width: 100%" />
+        </el-form-item>
+        <el-form-item label="实际收集率(%):" prop="lat">
+          <el-input-number v-model="form.lat" placeholder="请输入实际收集率(%)" style="width: 100%" controls-position="right" />
+        </el-form-item>
       </el-form>
       <template #footer>
         <div class="dialog-footer">
@@ -170,7 +120,6 @@
     pageSize: 10,
     caseType: 1,
     handleStatus: '',
-    searchContent: '',
   },
   rules: {
     id: [{ required: true, message: '请输入', trigger: 'blur' }],
diff --git a/src/views/spongePerformance/OutputPerformance/chartOption.js b/src/views/spongePerformance/OutputPerformance/chartOption.js
new file mode 100644
index 0000000..c0e300f
--- /dev/null
+++ b/src/views/spongePerformance/OutputPerformance/chartOption.js
@@ -0,0 +1,137 @@
+import useUserStore from '@/store/modules/user';
+import * as echarts from 'echarts';
+const pinias = useUserStore();
+
+let optionChart = {
+  // 柱状图+折线图
+  option: {
+    color: pinias.$state.chartColor,
+    // 显示暂无数据
+    graphic: {
+      type: 'text', // 类型：文本
+      left: 'center',
+      top: 'middle',
+      silent: true, // 不响应事件
+      invisible: false, // 有数据就隐藏
+      style: {
+        fill: '#c6c6c6',
+        fontWeight: 'bold',
+        text: '暂无数据',
+        fontFamily: 'Microsoft YaHei',
+        fontSize: '18px',
+      },
+    },
+    tooltip: {
+      trigger: 'axis',
+      confine: true, //是否将 tooltip 框限制在图表的区域内
+    },
+    title: {
+      left: 'left',
+      text: '',
+      top: 10,
+      bottom: 10,
+      left: 10,
+      textStyle: {
+        color: '#545E75', //字体颜色
+        fontSize: 16, //字体大小
+      },
+    },
+    grid: {
+      left: '3%',
+      right: '5%',
+      top: '20%',
+      bottom: '3%',
+      containLabel: true,
+    },
+    legend: {
+      top: '2%',
+      orient: 'horizontal', //horizontal
+      left: 'center', //left ,center
+      textStyle: {
+        color: 'inherit',
+      },
+    },
+    xAxis: {
+      type: 'category',
+      position: 'bottom',
+      data: ['2023', '2024', '2025'],
+      axisLabel: {
+        color: '#c6c6c6',
+      },
+      axisLine: {
+        lineStyle: {
+          color: '#066592',
+        },
+      },
+    },
+    yAxis: [
+      {
+        name: '降雨量(mm)',
+        type: 'value',
+        inverse: true, //翻转
+        nameLocation: 'start', // 坐标轴名称显示位置
+        nameGap: 15, // 坐标轴名称与轴线之间的距离
+        nameTextStyle: {
+          color: '#c6c6c6', //字体颜色
+          fontSize: 12, //字体大小
+          align: 'center', // 文字水平对齐方式，默认自动（'left'，'center'，'right'）
+        },
+        splitLine: {
+          lineStyle: {
+            type: 'dashed',
+            color: '#066592',
+          },
+        },
+        axisLabel: {
+          color: '#c6c6c6',
+        },
+      },
+      {
+        name: '流量(m³/h)',
+        type: 'value',
+        nameLocation: 'end', // 坐标轴名称显示位置
+        nameGap: 15, // 坐标轴名称与轴线之间的距离
+        nameTextStyle: {
+          color: '#c6c6c6', //字体颜色
+          fontSize: 12, //字体大小
+          align: 'center', // 文字水平对齐方式，默认自动（'left'，'center'，'right'）
+        },
+        axisLabel: {
+          color: '#c6c6c6',
+        },
+        splitLine: {
+          lineStyle: {
+            type: 'dashed',
+            color: '#066592',
+          },
+        },
+      },
+    ],
+    series: [
+      {
+        name: '降雨量',
+        type: 'bar',
+        barWidth: 10,
+        yAxisIndex: 0,
+        data: [24, 12, 9],
+      },
+      {
+        name: '进口流量',
+        type: 'line',
+        smooth: true,
+        yAxisIndex: 1,
+        symbolSize: 8,
+        data: [14, 8, 5],
+      },
+      {
+        name: '出口流量',
+        type: 'line',
+        smooth: true,
+        yAxisIndex: 1,
+        symbolSize: 8,
+        data: [4, 2, 1],
+      },
+    ],
+  },
+};
+export default optionChart;

diff --git a/src/views/sponeScreen/Echarts/echartBar3D.vue b/src/views/sponeScreen/Echarts/echartBar3D.vue
index 3d23886..038626c 100644
--- a/src/views/sponeScreen/Echarts/echartBar3D.vue
+++ b/src/views/sponeScreen/Echarts/echartBar3D.vue
@@ -65,14 +65,14 @@
             lineStyle: {
               color: '#384267',
             },
-            show: true,
+            show: false,
           },
           splitLine: {
             show: false,
           },
           axisLine: {
             lineStyle: {
-              color: '#384267',
+              color: '#005CBA',
               width: 1,
               type: 'dashed',
             },
@@ -91,7 +91,7 @@
               color: '#005CBA',
               width: 1,
             },
-            show: true,
+            show: false,
           },
           splitLine: {
             show: true,
@@ -214,7 +214,9 @@
     );
 
     onMounted(() => {
-      init();
+      setTimeout(() => {
+        init();
+      }, 0);
       window.addEventListener('resize', resizeTheChart);
     });
     return {
diff --git a/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue b/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
index 37c3002..3075239 100644
--- a/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
+++ b/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
@@ -1 +1,65 @@
-<template><div>年径流污染削减率管理信息</div></template>
+<template>
+  <!-- 年径流污染削减率 -->
+  <div class="publicContainer">
+    <!-- gis地图 -->
+    <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
+
+    <!-- 海绵设施监测详情 -->
+    <el-dialog v-model="dialogShow" title="海绵设施监测点位详情" :modal-append-to-body="false" width="600px">
+      <el-form :inline="true">
+        <el-form-item label="日期" prop="date">
+          <el-date-picker type="daterange" v-model="dateSearch" value-format="YYYY-MM-DD" placeholder="请选择"></el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+        </el-form-item>
+      </el-form>
+      <div id="chartHMXJ" style="width: 100%; height: 300px"></div>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import MapBox from '@/views/gisMapPage/gisMapBox1'; //gis地图
+import optionChart from './chartOption.js';
+
+const { proxy } = getCurrentInstance();
+const dialogShow = ref(true);
+const charts = ref(null);
+const dateSearch = ref([proxy.moment(new Date()).subtract(60, 'days').format('YYYY-MM-DD'), proxy.moment().format('YYYY-MM-DD')]);
+
+// 历史数据搜索
+function handleQuery() {
+  setTimeout(() => {
+    initChart();
+  });
+}
+
+// echarts初始化
+function initChart() {
+  charts.value && charts.value.dispose();
+  charts.value = proxy.echarts.init(document.getElementById('chartHMXJ'));
+  optionChart.option.xAxis.data = ['2024-06-12 00:00:00', '2024-06-12 00:10:00', '2024-06-12 00:20:00'];
+  optionChart.option.yAxis[1].name = 'SS(mg/L)';
+  optionChart.option.series[0].data = [12, 9, 20]; //降雨量
+  optionChart.option.series[1].name = '进口SS';
+  optionChart.option.series[1].data = [230, 190, 132]; //进口SS
+  optionChart.option.series[2].name = '出口SS';
+  optionChart.option.series[2].data = [110, 90, 103]; //出口SS
+  // 设置鼠标滚轮放大缩小展示数据区间
+  optionChart.option.dataZoom = [{ type: 'inside', startValue: optionChart.option.xAxis.data[optionChart.option.xAxis.data.length / 2] }];
+  if (optionChart.option.xAxis.data.length > 0) {
+    optionChart.option.graphic.invisible = true; //暂无数据
+  } else {
+    optionChart.option.graphic.invisible = false; //暂无数据
+  }
+  charts.value.clear();
+  charts.value.setOption(optionChart.option);
+}
+
+onMounted(() => {
+  handleQuery();
+});
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue b/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
index c06a3dc..35608fb 100644
--- a/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
+++ b/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
@@ -1,3 +1,62 @@
 <template>
-  <div>年径流总量控制率管理信息</div>
+  <!-- 年径流总量控制率 -->
+  <div class="publicContainer">
+    <!-- gis地图 -->
+    <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
+
+    <!-- 海绵设施监测详情 -->
+    <el-dialog v-model="dialogShow" title="海绵设施监测点位详情" :modal-append-to-body="false" width="600px">
+      <el-form :inline="true">
+        <el-form-item label="日期" prop="date">
+          <el-date-picker type="daterange" v-model="dateSearch" value-format="YYYY-MM-DD" placeholder="请选择"></el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+        </el-form-item>
+      </el-form>
+      <div id="chartHMJC" style="width: 100%; height: 300px"></div>
+    </el-dialog>
+  </div>
 </template>
+
+<script setup>
+import MapBox from '@/views/gisMapPage/gisMapBox1'; //gis地图
+import optionChart from './chartOption.js';
+
+const { proxy } = getCurrentInstance();
+const dialogShow = ref(true);
+const charts = ref(null);
+const dateSearch = ref([proxy.moment(new Date()).subtract(60, 'days').format('YYYY-MM-DD'), proxy.moment().format('YYYY-MM-DD')]);
+
+// 历史数据搜索
+function handleQuery() {
+  setTimeout(() => {
+    initChart();
+  });
+}
+
+// echarts初始化
+function initChart() {
+  charts.value && charts.value.dispose();
+  charts.value = proxy.echarts.init(document.getElementById('chartHMJC'));
+  optionChart.option.xAxis.data = ['2024-06-12 00:00:00', '2024-06-12 00:10:00', '2024-06-12 00:20:00'];
+  optionChart.option.series[0].data = [12, 9, 20]; //降雨量
+  optionChart.option.series[1].data = [2.3, 1.9, 3.2]; //进口流量
+  optionChart.option.series[2].data = [1.1, 0.9, 1.3]; //出口流量
+  // 设置鼠标滚轮放大缩小展示数据区间
+  optionChart.option.dataZoom = [{ type: 'inside', startValue: optionChart.option.xAxis.data[optionChart.option.xAxis.data.length / 2] }];
+  if (optionChart.option.xAxis.data.length > 0) {
+    optionChart.option.graphic.invisible = true; //暂无数据
+  } else {
+    optionChart.option.graphic.invisible = false; //暂无数据
+  }
+  charts.value.clear();
+  charts.value.setOption(optionChart.option);
+}
+
+onMounted(() => {
+  handleQuery();
+});
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue b/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue
index d49fc2a..b86ad5d 100644
--- a/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue
+++ b/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue
@@ -1,4 +1,5 @@
 <template>
+  <!-- 污水处理厂进水BOD -->
   <div class="publicContainer">
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
       <el-form-item label="统计年份" prop="date">
@@ -13,7 +14,6 @@
 
       <el-form-item>
         <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
-        <el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button>
         <el-button icon="Refresh" @click="resetQuery">重置</el-button>
       </el-form-item>
     </el-form>
@@ -21,23 +21,17 @@
     <!-- 表格 -->
     <el-table :data="dataList" v-loading="loading" stripe :max-height="580">
       <el-table-column type="index" width="55" label="序号" />
-      <el-table-column label="统计年份" prop="q" />
       <el-table-column label="日期" prop="w" />
-      <el-table-column label="进水BOD平均浓度（mg/L）">
+      <el-table-column label="进水BOD平均浓度(mg/L)">
         <el-table-column prop="monthPlan1" label="西区污水处理厂" />
         <el-table-column prop="monthPlan2" label="东区污水处理厂" />
-        <el-table-column prop="monthPlan3" label="马家河污水厂" />
+        <el-table-column prop="monthPlan3" label="马家河污水处理厂" />
+        <el-table-column prop="monthPlan4" label="包公湖污水处理厂" />
+        <el-table-column prop="monthPlan5" label="祥符区污水处理厂" />
       </el-table-column>
       <el-table-column label="均值" prop="p" />
       <el-table-column label="年度绩效指标" prop="a" />
-      <el-table-column label="评价结论" prop="a" />
-      <el-table-column label="操作" width="240">
-        <template #default="scope">
-          <el-button link icon="View" type="primary" @click="handleDetail(scope.row, 'view')">查看</el-button>
-          <el-button link type="warning" icon="Edit" @click="handleUpdate(scope.row, 'view')">修改</el-button>
-          <el-button link type="danger" icon="Delete" @click="handleDelete(scope.row, 'view')">删除</el-button>
-        </template>
-      </el-table-column>
+      <el-table-column label="年度达标情况" prop="b" />
     </el-table>
     <!-- 分页 -->
     <pagination
@@ -47,117 +41,23 @@
       v-model:limit="queryParams.pageSize"
       @pagination="getList"
     />
-    <!-- 新增弹窗 -->
-    <el-dialog :title="title" v-model="open" width="800px" append-to-body :close-on-click-modal="false">
-      <el-form ref="roleRef" :model="form" :rules="rules" label-width="130px" :disabled="multiple">
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="统计年份:" prop="w">
-              <el-date-picker
-                type="year"
-                v-model="queryParams.date"
-                value-format="YYYY"
-                placeholder="请选择统计年份"
-                style="width: 100%"
-              ></el-date-picker>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="日期:" prop="w">
-              <el-date-picker
-                type="month"
-                v-model="queryParams.date"
-                value-format="YYYY-MM"
-                placeholder="请选择日期"
-                style="width: 100%"
-              ></el-date-picker>
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="西区污水处理厂:" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入西区污水处理厂" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="东区污水处理厂:" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入东区污水处理厂" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="马家河污水厂:" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入马家河污水厂" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="均值:" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入均值" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="年度绩效指标" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入年度绩效指标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="评价结论" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入评价结论标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-      </el-form>
-      <template #footer>
-        <div class="dialog-footer">
-          <el-button type="primary" @click="submitForm">确 定</el-button>
-          <el-button @click="cancel">取 消</el-button>
-        </div>
-      </template>
-    </el-dialog>
   </div>
 </template>
 <script setup name="WaterSupplyWaterPlants">
 const { proxy } = getCurrentInstance();
-const open = ref(false);
-const multiple = ref(false);
 const showSearch = ref(true);
-const Xcfrequency = ref([
-  {
-    value: 'tian',
-    label: '天',
-  },
-  {
-    value: 'zhou',
-    label: '周',
-  },
-]);
 const loading = ref(true);
 const total = ref(0);
-const title = ref('');
 const dataList = ref([]);
 const AllData = reactive({
   id: '',
-  form: {},
   queryParams: {
     pageNum: 1,
     pageSize: 10,
-    caseType: 1,
-    handleStatus: '',
-    searchContent: '',
-  },
-  rules: {
-    id: [{ required: true, message: '请输入', trigger: 'blur' }],
-    eventDescription: [{ required: true, message: '请输入', trigger: 'blur' }],
+    date: null,
   },
 });
-const { queryParams, form, rules } = toRefs(AllData);
+const { queryParams } = toRefs(AllData);
 //搜索
 function handleQuery() {
   getList();
@@ -167,39 +67,6 @@
   proxy.resetForm('queryRef');
   handleQuery();
 }
-// 新增
-function handleAdd() {
-  title.value = '新增水厂供水';
-  open.value = true;
-  form.value = {};
-  multiple.value = false;
-  form.value.fileTag = Xcfrequency.value[0].value;
-}
-// 新增中取消事件
-function cancel() {
-  open.value = false;
-  proxy.resetForm('roleRef');
-}
-
-// 巡查频率下拉框点击事件
-function changeStation(value) {
-  // console.log(value, 'value');
-}
-
-//查看详情操作
-function handleDetail(row) {
-  open.value = true;
-  title.value = '查看水厂供水';
-  multiple.value = true;
-  form.value = row;
-}
-// 修改按钮操作
-function handleUpdate(row) {
-  open.value = true;
-  title.value = '修改水厂供水';
-  multiple.value = false;
-  form.value = { ...row };
-}
 
 /** 查询列表 */
 const getList = async () => {
@@ -211,12 +78,4 @@
   getList();
 });
 </script>
-<style scoped lang="scss">
-.dituclass {
-  width: 100%;
-  height: 300px;
-  // background: red;
-  margin-bottom: 10px;
-  border: 1px solid #004565;
-}
-</style>
+<style scoped lang="scss"></style>
diff --git a/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue b/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue
index 6ce3f37..94c365b 100644
--- a/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue
+++ b/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue
@@ -1,34 +1,31 @@
 <template>
+  <!-- 城市生活污水集中收集率 -->
   <div class="publicContainer">
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
-      <el-form-item label="污水厂名称:" prop="searchContent">
-        <el-input v-model="queryParams.searchContent" placeholder="请输入污水厂名称" clearable style="width: 180px" />
-      </el-form-item>
       <el-form-item label="统计年份" prop="date">
         <el-date-picker type="year" v-model="queryParams.date" value-format="YYYY" placeholder="请选择统计年份"></el-date-picker>
       </el-form-item>
 
       <el-form-item>
         <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
-        <el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button>
         <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+        <el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button>
       </el-form-item>
     </el-form>
 
     <!-- 表格 -->
     <el-table :data="dataList" v-loading="loading" stripe :max-height="580">
       <el-table-column type="index" width="55" label="序号" />
-      <el-table-column label="污水厂名称" prop="q" />
-      <el-table-column label="编码" prop="w" />
       <el-table-column label="统计年份" prop="o" />
-      <el-table-column label="年度绩效指标" prop="p" />
+      <el-table-column label="污水厂名称" prop="q" />
       <el-table-column label="累计处理水量(万t)" prop="e" />
       <el-table-column label="进水BOD平均浓度(mg/L)" prop="r" />
       <el-table-column label="BOD 削减量(g)" prop="t" />
       <el-table-column label="城区用水人口(万人)" prop="y" />
       <el-table-column label="人均日生活污染排放量(g/人·d)" prop="u" />
-      <el-table-column label="城市生活污水集中收集率(%)" prop="i" />
-      <el-table-column label="评价结论" prop="a" />
+      <el-table-column label="目标收集率(%)" prop="p" />
+      <el-table-column label="实际收集率(%)" prop="i" />
+      <el-table-column label="达标情况" prop="a" />
       <el-table-column label="操作" width="240">
         <template #default="scope">
           <el-button link icon="View" type="primary" @click="handleDetail(scope.row, 'view')">查看</el-button>
@@ -46,93 +43,46 @@
       @pagination="getList"
     />
     <!-- 新增弹窗 -->
-    <el-dialog :title="title" v-model="open" width="1100px" append-to-body :close-on-click-modal="false">
+    <el-dialog :title="title" v-model="open" width="600px" append-to-body :close-on-click-modal="false">
       <el-form ref="roleRef" :model="form" :rules="rules" label-width="220px" :disabled="multiple">
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="污水厂名称:" prop="w">
-              <el-input v-model="form.w" placeholder="请输入污水厂名称" clearable style="width: 100%" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="编码:" prop="w">
-              <el-input v-model="form.w" placeholder="请输入编码" clearable style="width: 100%" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="累计处理水量(万t):" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入累计处理水量(万t)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="进水BOD平均浓度(mg/L):" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入进水BOD平均浓度(mg/L)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="BOD 削减量(g):" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入BOD 削减量(g)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="城区用水人口(万人):" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入城区用水人口(万人)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="人均日生活污染排放量(g/人·d):" prop="lon">
-              <el-input-number
-                v-model="form.lon"
-                placeholder="请输入人均日生活污染排放量(g/人·d)"
-                style="width: 100%"
-                controls-position="right"
-              />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="城市生活污水集中收集率(%):" prop="lat">
-              <el-input-number
-                v-model="form.lat"
-                placeholder="请输入城市生活污水集中收集率(%)"
-                style="width: 100%"
-                controls-position="right"
-              />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="统计年份" prop="date">
-              <el-date-picker
-                type="year"
-                v-model="queryParams.date"
-                value-format="YYYY"
-                placeholder="请选择统计年份"
-                style="width: 100%"
-              ></el-date-picker>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="年度绩效指标" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入年度绩效指标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="评价结论" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入评价结论标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-        </el-row>
+        <el-form-item label="统计年份" prop="date">
+          <el-date-picker
+            type="year"
+            v-model="queryParams.date"
+            value-format="YYYY"
+            placeholder="请选择统计年份"
+            style="width: 100%"
+          ></el-date-picker>
+        </el-form-item>
+        <el-form-item label="污水厂名称:" prop="w">
+          <el-input v-model="form.w" placeholder="请输入污水厂名称" clearable style="width: 100%" />
+        </el-form-item>
+        <el-form-item label="累计处理水量(万t):" prop="lon">
+          <el-input-number v-model="form.lon" placeholder="请输入累计处理水量(万t)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="进水BOD平均浓度(mg/L):" prop="lat">
+          <el-input-number v-model="form.lat" placeholder="请输入进水BOD平均浓度(mg/L)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="BOD 削减量(g):" prop="lon">
+          <el-input-number v-model="form.lon" placeholder="请输入BOD 削减量(g)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="城区用水人口(万人):" prop="lat">
+          <el-input-number v-model="form.lat" placeholder="请输入城区用水人口(万人)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="人均日生活污染排放量(g/人·d):" prop="lon">
+          <el-input-number
+            v-model="form.lon"
+            placeholder="请输入人均日生活污染排放量(g/人·d)"
+            style="width: 100%"
+            controls-position="right"
+          />
+        </el-form-item>
+        <el-form-item label="目标收集率(%):" prop="date">
+          <el-input-number v-model="form.lon" placeholder="请输入目标收集率" style="width: 100%" />
+        </el-form-item>
+        <el-form-item label="实际收集率(%):" prop="lat">
+          <el-input-number v-model="form.lat" placeholder="请输入实际收集率(%)" style="width: 100%" controls-position="right" />
+        </el-form-item>
       </el-form>
       <template #footer>
         <div class="dialog-footer">
@@ -170,7 +120,6 @@
     pageSize: 10,
     caseType: 1,
     handleStatus: '',
-    searchContent: '',
   },
   rules: {
     id: [{ required: true, message: '请输入', trigger: 'blur' }],
diff --git a/src/views/spongePerformance/OutputPerformance/chartOption.js b/src/views/spongePerformance/OutputPerformance/chartOption.js
new file mode 100644
index 0000000..c0e300f
--- /dev/null
+++ b/src/views/spongePerformance/OutputPerformance/chartOption.js
@@ -0,0 +1,137 @@
+import useUserStore from '@/store/modules/user';
+import * as echarts from 'echarts';
+const pinias = useUserStore();
+
+let optionChart = {
+  // 柱状图+折线图
+  option: {
+    color: pinias.$state.chartColor,
+    // 显示暂无数据
+    graphic: {
+      type: 'text', // 类型：文本
+      left: 'center',
+      top: 'middle',
+      silent: true, // 不响应事件
+      invisible: false, // 有数据就隐藏
+      style: {
+        fill: '#c6c6c6',
+        fontWeight: 'bold',
+        text: '暂无数据',
+        fontFamily: 'Microsoft YaHei',
+        fontSize: '18px',
+      },
+    },
+    tooltip: {
+      trigger: 'axis',
+      confine: true, //是否将 tooltip 框限制在图表的区域内
+    },
+    title: {
+      left: 'left',
+      text: '',
+      top: 10,
+      bottom: 10,
+      left: 10,
+      textStyle: {
+        color: '#545E75', //字体颜色
+        fontSize: 16, //字体大小
+      },
+    },
+    grid: {
+      left: '3%',
+      right: '5%',
+      top: '20%',
+      bottom: '3%',
+      containLabel: true,
+    },
+    legend: {
+      top: '2%',
+      orient: 'horizontal', //horizontal
+      left: 'center', //left ,center
+      textStyle: {
+        color: 'inherit',
+      },
+    },
+    xAxis: {
+      type: 'category',
+      position: 'bottom',
+      data: ['2023', '2024', '2025'],
+      axisLabel: {
+        color: '#c6c6c6',
+      },
+      axisLine: {
+        lineStyle: {
+          color: '#066592',
+        },
+      },
+    },
+    yAxis: [
+      {
+        name: '降雨量(mm)',
+        type: 'value',
+        inverse: true, //翻转
+        nameLocation: 'start', // 坐标轴名称显示位置
+        nameGap: 15, // 坐标轴名称与轴线之间的距离
+        nameTextStyle: {
+          color: '#c6c6c6', //字体颜色
+          fontSize: 12, //字体大小
+          align: 'center', // 文字水平对齐方式，默认自动（'left'，'center'，'right'）
+        },
+        splitLine: {
+          lineStyle: {
+            type: 'dashed',
+            color: '#066592',
+          },
+        },
+        axisLabel: {
+          color: '#c6c6c6',
+        },
+      },
+      {
+        name: '流量(m³/h)',
+        type: 'value',
+        nameLocation: 'end', // 坐标轴名称显示位置
+        nameGap: 15, // 坐标轴名称与轴线之间的距离
+        nameTextStyle: {
+          color: '#c6c6c6', //字体颜色
+          fontSize: 12, //字体大小
+          align: 'center', // 文字水平对齐方式，默认自动（'left'，'center'，'right'）
+        },
+        axisLabel: {
+          color: '#c6c6c6',
+        },
+        splitLine: {
+          lineStyle: {
+            type: 'dashed',
+            color: '#066592',
+          },
+        },
+      },
+    ],
+    series: [
+      {
+        name: '降雨量',
+        type: 'bar',
+        barWidth: 10,
+        yAxisIndex: 0,
+        data: [24, 12, 9],
+      },
+      {
+        name: '进口流量',
+        type: 'line',
+        smooth: true,
+        yAxisIndex: 1,
+        symbolSize: 8,
+        data: [14, 8, 5],
+      },
+      {
+        name: '出口流量',
+        type: 'line',
+        smooth: true,
+        yAxisIndex: 1,
+        symbolSize: 8,
+        data: [4, 2, 1],
+      },
+    ],
+  },
+};
+export default optionChart;
diff --git a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/index.vue b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/index.vue
deleted file mode 100644
index bc19015..0000000
--- a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/index.vue
+++ /dev/null
@@ -1,367 +0,0 @@
-<template>
-  <!-- 地表水体水质达标 -->
-  <div class="publicContainer" v-if="back">
-    <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
-      <el-form-item label="考核水体:" prop="riverId">
-        <el-select clearable v-model="queryParams.riverId" class="m-2" placeholder="请选择" size="mini">
-          <el-option v-for="item in responseAA" :key="item.id" :label="item.riverName" :value="Number(item.id)" />
-        </el-select>
-      </el-form-item>
-
-      <el-form-item label="采样年份:" prop="sampleYear">
-        <el-date-picker
-          v-model="queryParams.sampleYear"
-          type="year"
-          placeholder="请选择"
-          format="YYYY"
-          value-format="YYYY"
-          @change="change"
-        />
-      </el-form-item>
-
-      <el-form-item label="评价结果:" prop="blackOdor">
-        <el-select clearable v-model="queryParams.blackOdor" class="m-2" placeholder="请选择" size="mini">
-          <el-option v-for="item in black_odor_level" :key="item.value" :label="item.label" :value="item.value" />
-        </el-select>
-      </el-form-item>
-      <el-form-item>
-        <el-button type="primary" icon="Search" @click="searchData">搜索</el-button>
-        <el-button icon="Refresh" @click="resetData">重置</el-button>
-        <el-button icon="CaretLeft" @click="resect" class="zbBtn"> 返回</el-button>
-        <el-button icon="Plus" type="success" @click="addData">新增</el-button>
-      </el-form-item>
-    </el-form>
-    <!-- 表格 -->
-    <el-table :data="tableData" v-loading="tableLoading" :max-height="650">
-      <el-table-column type="index" width="55" label="序号" />
-      <el-table-column v-for="item in informationDate" :label="item.value" :prop="item.key">
-        <template #default="scope" v-if="item.key == 'blackOdorName'">
-          <span
-            :style="{
-              color:
-                scope.row.blackOdorName == '无黑臭'
-                  ? 'greenyellow'
-                  : scope.row.blackOdorName == '轻度黑臭'
-                  ? ' #419fff'
-                  : scope.row.blackOdorName == '中度黑臭'
-                  ? 'orange'
-                  : scope.row.blackOdorName == '重度黑臭'
-                  ? 'red'
-                  : '',
-            }"
-          >
-            {{
-              scope.row.blackOdorName == '无黑臭'
-                ? '无黑臭'
-                : scope.row.blackOdorName == '轻度黑臭'
-                ? '轻度黑臭'
-                : scope.row.blackOdorName == '中度黑臭'
-                ? '中度黑臭'
-                : scope.row.blackOdorName == '重度黑臭'
-                ? '重度黑臭'
-                : ''
-            }}
-          </span>
-        </template>
-      </el-table-column>
-      <el-table-column label="操作" show-overflow-tooltip width="200">
-        <template #default="{ row }">
-          <el-button type="primary" link @click="checkDetail(row)">详情</el-button>
-          <el-button type="primary" link @click="editData(row)">修改</el-button>
-          <el-button type="danger" link @click="deleteData(row)">删除</el-button>
-        </template>
-      </el-table-column>
-    </el-table>
-    <!-- 分页 -->
-    <pagination
-      v-show="total > 0"
-      :total="total"
-      v-model:page="queryParams.pageNum"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getDataList"
-    />
-    <!-- 添加 修改 查看彈框 -->
-    <el-dialog :title="dialogTitle" v-model="showDialog" width="70%" :close-on-click-modal="false">
-      <el-form ref="ruleForm" :model="formData" :rules="formRules" label-width="auto" :disabled="isDisab">
-        <el-row>
-          <el-form-item label="考核水体:" prop="riverId" style="width: 45%">
-            <el-select clearable v-model="formData.riverId" class="m-2" placeholder="请选择" size="mini" style="width: 100%">
-              <el-option v-for="item in responseAA" :key="item.id" :label="item.riverName" :value="Number(item.id)" />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="采样时间:" prop="sampleTime" style="width: 45%">
-            <el-date-picker
-              style="width: 100%"
-              clearable
-              format="YYYY-MM-DD"
-              value-format="YYYY-MM-DD"
-              v-model="formData.sampleTime"
-              type="date"
-            />
-          </el-form-item>
-          <el-form-item label="采样点:" prop="sampleLocation" style="width: 45%">
-            <el-input v-model="formData.sampleLocation" placeholder="请输入" style="width: 100%" clearable />
-          </el-form-item>
-
-          <el-form-item v-for="item in Dbssz" :label="item.sampleFactorName" :prop="item.sampleFactor" style="width: 45%">
-            <el-input-number
-              v-model="formData[item.sampleFactor]"
-              placeholder="请输入"
-              clearable
-              controls-position="right"
-              style="width: 400px"
-            />
-          </el-form-item>
-
-          <el-form-item label="黑臭程度:" prop="blackOdorName" style="width: 45%" v-if="hiddentext">
-            <div
-              :style="{
-                color:
-                  formData.blackOdorName == '无黑臭'
-                    ? 'greenyellow'
-                    : formData.blackOdorName == '轻度黑臭'
-                    ? ' #419fff'
-                    : formData.blackOdorName == '中度黑臭'
-                    ? 'orange'
-                    : formData.blackOdorName == '重度黑臭'
-                    ? 'red'
-                    : '',
-              }"
-            >
-              {{
-                formData.blackOdorName == '无黑臭'
-                  ? '无黑臭'
-                  : formData.blackOdorName == '轻度黑臭'
-                  ? '轻度黑臭'
-                  : formData.blackOdorName == '中度黑臭'
-                  ? '中度黑臭'
-                  : formData.blackOdorName == '重度黑臭'
-                  ? '重度黑臭'
-                  : ''
-              }}
-            </div>
-          </el-form-item>
-        </el-row>
-      </el-form>
-      <template #footer>
-        <div class="dialog-footer">
-          <el-button type="primary" @click="submitForm" v-show="!isDisab">保 存</el-button>
-          <el-button @click="cancel">关闭</el-button>
-        </div>
-      </template>
-    </el-dialog>
-  </div>
-  <waterquality v-else />
-</template>
-<script setup>
-import {
-  blackOdorUserId,
-  riverInfoWater,
-  blackOdorAdd,
-  blackOdorDelete,
-  sampleConfigconfiguration,
-  blackOdorinformation,
-  blackOdorpaging,
-  blackOdorEdit,
-} from '@/api/spongePerformance/surfaceWater';
-const { proxy } = getCurrentInstance();
-const { hc_sample_factor, sample_type, black_odor_level } = proxy.useDict('hc_sample_factor', 'sample_type', 'black_odor_level');
-import { defineEmits } from 'vue';
-const isDisab = ref(false);
-const isDisatext = ref(false);
-const showDialog = ref(false);
-const showSearch = ref(true);
-const tableLoading = ref(true);
-const hiddentext = ref(false);
-const back = ref(true);
-const responseAA = ref([]);
-const total = ref(0);
-const dialogTitle = ref('');
-const tableData = ref([]);
-const Dbssz = ref([]);
-const informationDate = ref([]);
-const emits = defineEmits();
-const { paramsData } = defineProps(['paramsData']);
-const AllData = reactive({
-  formData: {
-    configs: [],
-  },
-  queryParams: {
-    pageNum: 1,
-    pageSize: 10,
-    sampleTime: '',
-    riverId: '',
-    blackOdor: '',
-    sampleYear: '',
-    sampleLocation: '',
-  },
-  formRules: {
-    riverId: [{ required: true, message: '请选择', trigger: 'blur' }],
-    sampleTime: [{ required: true, message: '请选择', trigger: 'blur' }],
-  },
-});
-const { queryParams, formData, formRules } = toRefs(AllData);
-
-/** 表单重置 */
-function resetForm() {
-  formData.value = {
-    riverId: undefined,
-    sampleYear: undefined,
-    sampleTime: undefined,
-    blackOdor: undefined,
-    sampleLocation: undefined,
-    riverType: 'black_odor',
-  };
-  proxy.resetForm('ruleForm');
-}
-function resect() {
-  emits('searchClick', 0);
-}
-/** 新增按钮操作 */
-function addData() {
-  resetForm();
-  hiddentext.value = false;
-  isDisab.value = false;
-  showDialog.value = true;
-  dialogTitle.value = '新增检测记录';
-}
-
-//搜索
-function searchData() {
-  queryParams.value.pageNum = 1;
-  getDataList();
-}
-//重置
-function resetData() {
-  proxy.resetForm('queryRef');
-  searchData();
-}
-// 获取下拉框数据
-const getSelData = async () => {
-  let params = {
-    riverType: 'black_odor',
-  };
-  riverInfoWater(params).then(response => {
-    if (response.code == 200) {
-      responseAA.value = response.data;
-    }
-  });
-};
-// 新增中的 动态数据
-const Dbsszconfiguration = async () => {
-  let params = {
-    sampleType: 'hcst',
-  };
-  sampleConfigconfiguration(params).then(response => {
-    if (response.code == 200) {
-      Dbssz.value = response.data;
-      Dbssz.value.forEach(item => {
-        formRules.value[item.sampleFactor] = [{ required: true, message: '请输入', trigger: 'blur', type: 'number' }];
-      });
-      console.log(formRules.value);
-    }
-  });
-};
-//地水质采样信息动态表头
-const information = async () => {
-  blackOdorinformation().then(res => {
-    if (res.code == 200) {
-      informationDate.value = res.data;
-    }
-  });
-};
-
-/** 查询列表 */
-const getDataList = async () => {
-  tableLoading.value = true;
-  const res = await blackOdorpaging(queryParams.value);
-  tableData.value = res.data.records;
-  total.value = res.data.total || 0;
-  tableLoading.value = false;
-};
-/** 新增弹框 修改弹框 提交按钮 */
-async function submitForm() {
-  proxy.$refs['ruleForm'].validate(valid => {
-    if (valid) {
-      formData.value.configs = [];
-      let obj = [];
-      Dbssz.value.forEach(k => {
-        obj.push(k.sampleFactor);
-      });
-      obj.forEach(element => {
-        formData.value.configs.push({
-          factor: element,
-          value: formData.value[element],
-        });
-        delete formData.value[element];
-      });
-      console.log(formData.value, 'formData.value.configs');
-
-      if (formData.value.id != undefined) {
-        blackOdorEdit(formData.value).then(() => {
-          console.log(formData.value, 'formData.value');
-          proxy.$modal.msgSuccess('修改成功');
-          showDialog.value = false;
-          getDataList();
-        });
-      } else {
-        blackOdorAdd(formData.value).then(() => {
-          console.log(formData.value, 'formData.valueformData.valueformData.value');
-          proxy.$modal.msgSuccess('新增成功');
-          showDialog.value = false;
-          getDataList();
-        });
-      }
-    }
-  });
-}
-//表格修改
-function editData(row) {
-  formData.value = { ...row };
-  isDisab.value = false;
-  isDisatext.value = true;
-  showDialog.value = true;
-  dialogTitle.value = '修改检测记录';
-  hiddentext.value = true;
-  console.log(row, 'row');
-}
-// 表格删除
-function deleteData(row) {
-  proxy.$modal
-    .confirm('是否确认删除？')
-    .then(async () => {
-      const res = await blackOdorDelete(row.id);
-      if (res?.code !== 200) return;
-      proxy.$modal.msgSuccess('操作成功！');
-      getDataList();
-    })
-    .catch(() => {});
-}
-//详情按钮
-function checkDetail(row) {
-  dialogTitle.value = '查看检测记录';
-  isDisab.value = true;
-  showDialog.value = true;
-  isDisatext.value = true;
-  hiddentext.value = true;
-  formData.value = { ...row };
-}
-
-/** 取消按钮 */
-function cancel() {
-  showDialog.value = false;
-  resetForm();
-}
-function change(val) {
-  console.log(val, 'val');
-  queryParams.value.sampleYear = val;
-}
-onMounted(() => {
-  queryParams.value.sampleYear = paramsData?.examineYear || '';
-  getDataList();
-  getSelData();
-  Dbsszconfiguration();
-  information();
-});
-</script>
-<style scoped lang="scss"></style>

diff --git a/src/views/sponeScreen/Echarts/echartBar3D.vue b/src/views/sponeScreen/Echarts/echartBar3D.vue
index 3d23886..038626c 100644
--- a/src/views/sponeScreen/Echarts/echartBar3D.vue
+++ b/src/views/sponeScreen/Echarts/echartBar3D.vue
@@ -65,14 +65,14 @@
             lineStyle: {
               color: '#384267',
             },
-            show: true,
+            show: false,
           },
           splitLine: {
             show: false,
           },
           axisLine: {
             lineStyle: {
-              color: '#384267',
+              color: '#005CBA',
               width: 1,
               type: 'dashed',
             },
@@ -91,7 +91,7 @@
               color: '#005CBA',
               width: 1,
             },
-            show: true,
+            show: false,
           },
           splitLine: {
             show: true,
@@ -214,7 +214,9 @@
     );
 
     onMounted(() => {
-      init();
+      setTimeout(() => {
+        init();
+      }, 0);
       window.addEventListener('resize', resizeTheChart);
     });
     return {
diff --git a/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue b/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
index 37c3002..3075239 100644
--- a/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
+++ b/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
@@ -1 +1,65 @@
-<template><div>年径流污染削减率管理信息</div></template>
+<template>
+  <!-- 年径流污染削减率 -->
+  <div class="publicContainer">
+    <!-- gis地图 -->
+    <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
+
+    <!-- 海绵设施监测详情 -->
+    <el-dialog v-model="dialogShow" title="海绵设施监测点位详情" :modal-append-to-body="false" width="600px">
+      <el-form :inline="true">
+        <el-form-item label="日期" prop="date">
+          <el-date-picker type="daterange" v-model="dateSearch" value-format="YYYY-MM-DD" placeholder="请选择"></el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+        </el-form-item>
+      </el-form>
+      <div id="chartHMXJ" style="width: 100%; height: 300px"></div>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import MapBox from '@/views/gisMapPage/gisMapBox1'; //gis地图
+import optionChart from './chartOption.js';
+
+const { proxy } = getCurrentInstance();
+const dialogShow = ref(true);
+const charts = ref(null);
+const dateSearch = ref([proxy.moment(new Date()).subtract(60, 'days').format('YYYY-MM-DD'), proxy.moment().format('YYYY-MM-DD')]);
+
+// 历史数据搜索
+function handleQuery() {
+  setTimeout(() => {
+    initChart();
+  });
+}
+
+// echarts初始化
+function initChart() {
+  charts.value && charts.value.dispose();
+  charts.value = proxy.echarts.init(document.getElementById('chartHMXJ'));
+  optionChart.option.xAxis.data = ['2024-06-12 00:00:00', '2024-06-12 00:10:00', '2024-06-12 00:20:00'];
+  optionChart.option.yAxis[1].name = 'SS(mg/L)';
+  optionChart.option.series[0].data = [12, 9, 20]; //降雨量
+  optionChart.option.series[1].name = '进口SS';
+  optionChart.option.series[1].data = [230, 190, 132]; //进口SS
+  optionChart.option.series[2].name = '出口SS';
+  optionChart.option.series[2].data = [110, 90, 103]; //出口SS
+  // 设置鼠标滚轮放大缩小展示数据区间
+  optionChart.option.dataZoom = [{ type: 'inside', startValue: optionChart.option.xAxis.data[optionChart.option.xAxis.data.length / 2] }];
+  if (optionChart.option.xAxis.data.length > 0) {
+    optionChart.option.graphic.invisible = true; //暂无数据
+  } else {
+    optionChart.option.graphic.invisible = false; //暂无数据
+  }
+  charts.value.clear();
+  charts.value.setOption(optionChart.option);
+}
+
+onMounted(() => {
+  handleQuery();
+});
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue b/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
index c06a3dc..35608fb 100644
--- a/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
+++ b/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
@@ -1,3 +1,62 @@
 <template>
-  <div>年径流总量控制率管理信息</div>
+  <!-- 年径流总量控制率 -->
+  <div class="publicContainer">
+    <!-- gis地图 -->
+    <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
+
+    <!-- 海绵设施监测详情 -->
+    <el-dialog v-model="dialogShow" title="海绵设施监测点位详情" :modal-append-to-body="false" width="600px">
+      <el-form :inline="true">
+        <el-form-item label="日期" prop="date">
+          <el-date-picker type="daterange" v-model="dateSearch" value-format="YYYY-MM-DD" placeholder="请选择"></el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+        </el-form-item>
+      </el-form>
+      <div id="chartHMJC" style="width: 100%; height: 300px"></div>
+    </el-dialog>
+  </div>
 </template>
+
+<script setup>
+import MapBox from '@/views/gisMapPage/gisMapBox1'; //gis地图
+import optionChart from './chartOption.js';
+
+const { proxy } = getCurrentInstance();
+const dialogShow = ref(true);
+const charts = ref(null);
+const dateSearch = ref([proxy.moment(new Date()).subtract(60, 'days').format('YYYY-MM-DD'), proxy.moment().format('YYYY-MM-DD')]);
+
+// 历史数据搜索
+function handleQuery() {
+  setTimeout(() => {
+    initChart();
+  });
+}
+
+// echarts初始化
+function initChart() {
+  charts.value && charts.value.dispose();
+  charts.value = proxy.echarts.init(document.getElementById('chartHMJC'));
+  optionChart.option.xAxis.data = ['2024-06-12 00:00:00', '2024-06-12 00:10:00', '2024-06-12 00:20:00'];
+  optionChart.option.series[0].data = [12, 9, 20]; //降雨量
+  optionChart.option.series[1].data = [2.3, 1.9, 3.2]; //进口流量
+  optionChart.option.series[2].data = [1.1, 0.9, 1.3]; //出口流量
+  // 设置鼠标滚轮放大缩小展示数据区间
+  optionChart.option.dataZoom = [{ type: 'inside', startValue: optionChart.option.xAxis.data[optionChart.option.xAxis.data.length / 2] }];
+  if (optionChart.option.xAxis.data.length > 0) {
+    optionChart.option.graphic.invisible = true; //暂无数据
+  } else {
+    optionChart.option.graphic.invisible = false; //暂无数据
+  }
+  charts.value.clear();
+  charts.value.setOption(optionChart.option);
+}
+
+onMounted(() => {
+  handleQuery();
+});
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue b/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue
index d49fc2a..b86ad5d 100644
--- a/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue
+++ b/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue
@@ -1,4 +1,5 @@
 <template>
+  <!-- 污水处理厂进水BOD -->
   <div class="publicContainer">
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
       <el-form-item label="统计年份" prop="date">
@@ -13,7 +14,6 @@
 
       <el-form-item>
         <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
-        <el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button>
         <el-button icon="Refresh" @click="resetQuery">重置</el-button>
       </el-form-item>
     </el-form>
@@ -21,23 +21,17 @@
     <!-- 表格 -->
     <el-table :data="dataList" v-loading="loading" stripe :max-height="580">
       <el-table-column type="index" width="55" label="序号" />
-      <el-table-column label="统计年份" prop="q" />
       <el-table-column label="日期" prop="w" />
-      <el-table-column label="进水BOD平均浓度（mg/L）">
+      <el-table-column label="进水BOD平均浓度(mg/L)">
         <el-table-column prop="monthPlan1" label="西区污水处理厂" />
         <el-table-column prop="monthPlan2" label="东区污水处理厂" />
-        <el-table-column prop="monthPlan3" label="马家河污水厂" />
+        <el-table-column prop="monthPlan3" label="马家河污水处理厂" />
+        <el-table-column prop="monthPlan4" label="包公湖污水处理厂" />
+        <el-table-column prop="monthPlan5" label="祥符区污水处理厂" />
       </el-table-column>
       <el-table-column label="均值" prop="p" />
       <el-table-column label="年度绩效指标" prop="a" />
-      <el-table-column label="评价结论" prop="a" />
-      <el-table-column label="操作" width="240">
-        <template #default="scope">
-          <el-button link icon="View" type="primary" @click="handleDetail(scope.row, 'view')">查看</el-button>
-          <el-button link type="warning" icon="Edit" @click="handleUpdate(scope.row, 'view')">修改</el-button>
-          <el-button link type="danger" icon="Delete" @click="handleDelete(scope.row, 'view')">删除</el-button>
-        </template>
-      </el-table-column>
+      <el-table-column label="年度达标情况" prop="b" />
     </el-table>
     <!-- 分页 -->
     <pagination
@@ -47,117 +41,23 @@
       v-model:limit="queryParams.pageSize"
       @pagination="getList"
     />
-    <!-- 新增弹窗 -->
-    <el-dialog :title="title" v-model="open" width="800px" append-to-body :close-on-click-modal="false">
-      <el-form ref="roleRef" :model="form" :rules="rules" label-width="130px" :disabled="multiple">
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="统计年份:" prop="w">
-              <el-date-picker
-                type="year"
-                v-model="queryParams.date"
-                value-format="YYYY"
-                placeholder="请选择统计年份"
-                style="width: 100%"
-              ></el-date-picker>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="日期:" prop="w">
-              <el-date-picker
-                type="month"
-                v-model="queryParams.date"
-                value-format="YYYY-MM"
-                placeholder="请选择日期"
-                style="width: 100%"
-              ></el-date-picker>
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="西区污水处理厂:" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入西区污水处理厂" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="东区污水处理厂:" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入东区污水处理厂" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="马家河污水厂:" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入马家河污水厂" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="均值:" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入均值" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="年度绩效指标" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入年度绩效指标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="评价结论" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入评价结论标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-      </el-form>
-      <template #footer>
-        <div class="dialog-footer">
-          <el-button type="primary" @click="submitForm">确 定</el-button>
-          <el-button @click="cancel">取 消</el-button>
-        </div>
-      </template>
-    </el-dialog>
   </div>
 </template>
 <script setup name="WaterSupplyWaterPlants">
 const { proxy } = getCurrentInstance();
-const open = ref(false);
-const multiple = ref(false);
 const showSearch = ref(true);
-const Xcfrequency = ref([
-  {
-    value: 'tian',
-    label: '天',
-  },
-  {
-    value: 'zhou',
-    label: '周',
-  },
-]);
 const loading = ref(true);
 const total = ref(0);
-const title = ref('');
 const dataList = ref([]);
 const AllData = reactive({
   id: '',
-  form: {},
   queryParams: {
     pageNum: 1,
     pageSize: 10,
-    caseType: 1,
-    handleStatus: '',
-    searchContent: '',
-  },
-  rules: {
-    id: [{ required: true, message: '请输入', trigger: 'blur' }],
-    eventDescription: [{ required: true, message: '请输入', trigger: 'blur' }],
+    date: null,
   },
 });
-const { queryParams, form, rules } = toRefs(AllData);
+const { queryParams } = toRefs(AllData);
 //搜索
 function handleQuery() {
   getList();
@@ -167,39 +67,6 @@
   proxy.resetForm('queryRef');
   handleQuery();
 }
-// 新增
-function handleAdd() {
-  title.value = '新增水厂供水';
-  open.value = true;
-  form.value = {};
-  multiple.value = false;
-  form.value.fileTag = Xcfrequency.value[0].value;
-}
-// 新增中取消事件
-function cancel() {
-  open.value = false;
-  proxy.resetForm('roleRef');
-}
-
-// 巡查频率下拉框点击事件
-function changeStation(value) {
-  // console.log(value, 'value');
-}
-
-//查看详情操作
-function handleDetail(row) {
-  open.value = true;
-  title.value = '查看水厂供水';
-  multiple.value = true;
-  form.value = row;
-}
-// 修改按钮操作
-function handleUpdate(row) {
-  open.value = true;
-  title.value = '修改水厂供水';
-  multiple.value = false;
-  form.value = { ...row };
-}
 
 /** 查询列表 */
 const getList = async () => {
@@ -211,12 +78,4 @@
   getList();
 });
 </script>
-<style scoped lang="scss">
-.dituclass {
-  width: 100%;
-  height: 300px;
-  // background: red;
-  margin-bottom: 10px;
-  border: 1px solid #004565;
-}
-</style>
+<style scoped lang="scss"></style>
diff --git a/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue b/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue
index 6ce3f37..94c365b 100644
--- a/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue
+++ b/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue
@@ -1,34 +1,31 @@
 <template>
+  <!-- 城市生活污水集中收集率 -->
   <div class="publicContainer">
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
-      <el-form-item label="污水厂名称:" prop="searchContent">
-        <el-input v-model="queryParams.searchContent" placeholder="请输入污水厂名称" clearable style="width: 180px" />
-      </el-form-item>
       <el-form-item label="统计年份" prop="date">
         <el-date-picker type="year" v-model="queryParams.date" value-format="YYYY" placeholder="请选择统计年份"></el-date-picker>
       </el-form-item>
 
       <el-form-item>
         <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
-        <el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button>
         <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+        <el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button>
       </el-form-item>
     </el-form>
 
     <!-- 表格 -->
     <el-table :data="dataList" v-loading="loading" stripe :max-height="580">
       <el-table-column type="index" width="55" label="序号" />
-      <el-table-column label="污水厂名称" prop="q" />
-      <el-table-column label="编码" prop="w" />
       <el-table-column label="统计年份" prop="o" />
-      <el-table-column label="年度绩效指标" prop="p" />
+      <el-table-column label="污水厂名称" prop="q" />
       <el-table-column label="累计处理水量(万t)" prop="e" />
       <el-table-column label="进水BOD平均浓度(mg/L)" prop="r" />
       <el-table-column label="BOD 削减量(g)" prop="t" />
       <el-table-column label="城区用水人口(万人)" prop="y" />
       <el-table-column label="人均日生活污染排放量(g/人·d)" prop="u" />
-      <el-table-column label="城市生活污水集中收集率(%)" prop="i" />
-      <el-table-column label="评价结论" prop="a" />
+      <el-table-column label="目标收集率(%)" prop="p" />
+      <el-table-column label="实际收集率(%)" prop="i" />
+      <el-table-column label="达标情况" prop="a" />
       <el-table-column label="操作" width="240">
         <template #default="scope">
           <el-button link icon="View" type="primary" @click="handleDetail(scope.row, 'view')">查看</el-button>
@@ -46,93 +43,46 @@
       @pagination="getList"
     />
     <!-- 新增弹窗 -->
-    <el-dialog :title="title" v-model="open" width="1100px" append-to-body :close-on-click-modal="false">
+    <el-dialog :title="title" v-model="open" width="600px" append-to-body :close-on-click-modal="false">
       <el-form ref="roleRef" :model="form" :rules="rules" label-width="220px" :disabled="multiple">
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="污水厂名称:" prop="w">
-              <el-input v-model="form.w" placeholder="请输入污水厂名称" clearable style="width: 100%" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="编码:" prop="w">
-              <el-input v-model="form.w" placeholder="请输入编码" clearable style="width: 100%" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="累计处理水量(万t):" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入累计处理水量(万t)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="进水BOD平均浓度(mg/L):" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入进水BOD平均浓度(mg/L)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="BOD 削减量(g):" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入BOD 削减量(g)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="城区用水人口(万人):" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入城区用水人口(万人)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="人均日生活污染排放量(g/人·d):" prop="lon">
-              <el-input-number
-                v-model="form.lon"
-                placeholder="请输入人均日生活污染排放量(g/人·d)"
-                style="width: 100%"
-                controls-position="right"
-              />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="城市生活污水集中收集率(%):" prop="lat">
-              <el-input-number
-                v-model="form.lat"
-                placeholder="请输入城市生活污水集中收集率(%)"
-                style="width: 100%"
-                controls-position="right"
-              />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="统计年份" prop="date">
-              <el-date-picker
-                type="year"
-                v-model="queryParams.date"
-                value-format="YYYY"
-                placeholder="请选择统计年份"
-                style="width: 100%"
-              ></el-date-picker>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="年度绩效指标" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入年度绩效指标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="评价结论" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入评价结论标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-        </el-row>
+        <el-form-item label="统计年份" prop="date">
+          <el-date-picker
+            type="year"
+            v-model="queryParams.date"
+            value-format="YYYY"
+            placeholder="请选择统计年份"
+            style="width: 100%"
+          ></el-date-picker>
+        </el-form-item>
+        <el-form-item label="污水厂名称:" prop="w">
+          <el-input v-model="form.w" placeholder="请输入污水厂名称" clearable style="width: 100%" />
+        </el-form-item>
+        <el-form-item label="累计处理水量(万t):" prop="lon">
+          <el-input-number v-model="form.lon" placeholder="请输入累计处理水量(万t)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="进水BOD平均浓度(mg/L):" prop="lat">
+          <el-input-number v-model="form.lat" placeholder="请输入进水BOD平均浓度(mg/L)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="BOD 削减量(g):" prop="lon">
+          <el-input-number v-model="form.lon" placeholder="请输入BOD 削减量(g)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="城区用水人口(万人):" prop="lat">
+          <el-input-number v-model="form.lat" placeholder="请输入城区用水人口(万人)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="人均日生活污染排放量(g/人·d):" prop="lon">
+          <el-input-number
+            v-model="form.lon"
+            placeholder="请输入人均日生活污染排放量(g/人·d)"
+            style="width: 100%"
+            controls-position="right"
+          />
+        </el-form-item>
+        <el-form-item label="目标收集率(%):" prop="date">
+          <el-input-number v-model="form.lon" placeholder="请输入目标收集率" style="width: 100%" />
+        </el-form-item>
+        <el-form-item label="实际收集率(%):" prop="lat">
+          <el-input-number v-model="form.lat" placeholder="请输入实际收集率(%)" style="width: 100%" controls-position="right" />
+        </el-form-item>
       </el-form>
       <template #footer>
         <div class="dialog-footer">
@@ -170,7 +120,6 @@
     pageSize: 10,
     caseType: 1,
     handleStatus: '',
-    searchContent: '',
   },
   rules: {
     id: [{ required: true, message: '请输入', trigger: 'blur' }],
diff --git a/src/views/spongePerformance/OutputPerformance/chartOption.js b/src/views/spongePerformance/OutputPerformance/chartOption.js
new file mode 100644
index 0000000..c0e300f
--- /dev/null
+++ b/src/views/spongePerformance/OutputPerformance/chartOption.js
@@ -0,0 +1,137 @@
+import useUserStore from '@/store/modules/user';
+import * as echarts from 'echarts';
+const pinias = useUserStore();
+
+let optionChart = {
+  // 柱状图+折线图
+  option: {
+    color: pinias.$state.chartColor,
+    // 显示暂无数据
+    graphic: {
+      type: 'text', // 类型：文本
+      left: 'center',
+      top: 'middle',
+      silent: true, // 不响应事件
+      invisible: false, // 有数据就隐藏
+      style: {
+        fill: '#c6c6c6',
+        fontWeight: 'bold',
+        text: '暂无数据',
+        fontFamily: 'Microsoft YaHei',
+        fontSize: '18px',
+      },
+    },
+    tooltip: {
+      trigger: 'axis',
+      confine: true, //是否将 tooltip 框限制在图表的区域内
+    },
+    title: {
+      left: 'left',
+      text: '',
+      top: 10,
+      bottom: 10,
+      left: 10,
+      textStyle: {
+        color: '#545E75', //字体颜色
+        fontSize: 16, //字体大小
+      },
+    },
+    grid: {
+      left: '3%',
+      right: '5%',
+      top: '20%',
+      bottom: '3%',
+      containLabel: true,
+    },
+    legend: {
+      top: '2%',
+      orient: 'horizontal', //horizontal
+      left: 'center', //left ,center
+      textStyle: {
+        color: 'inherit',
+      },
+    },
+    xAxis: {
+      type: 'category',
+      position: 'bottom',
+      data: ['2023', '2024', '2025'],
+      axisLabel: {
+        color: '#c6c6c6',
+      },
+      axisLine: {
+        lineStyle: {
+          color: '#066592',
+        },
+      },
+    },
+    yAxis: [
+      {
+        name: '降雨量(mm)',
+        type: 'value',
+        inverse: true, //翻转
+        nameLocation: 'start', // 坐标轴名称显示位置
+        nameGap: 15, // 坐标轴名称与轴线之间的距离
+        nameTextStyle: {
+          color: '#c6c6c6', //字体颜色
+          fontSize: 12, //字体大小
+          align: 'center', // 文字水平对齐方式，默认自动（'left'，'center'，'right'）
+        },
+        splitLine: {
+          lineStyle: {
+            type: 'dashed',
+            color: '#066592',
+          },
+        },
+        axisLabel: {
+          color: '#c6c6c6',
+        },
+      },
+      {
+        name: '流量(m³/h)',
+        type: 'value',
+        nameLocation: 'end', // 坐标轴名称显示位置
+        nameGap: 15, // 坐标轴名称与轴线之间的距离
+        nameTextStyle: {
+          color: '#c6c6c6', //字体颜色
+          fontSize: 12, //字体大小
+          align: 'center', // 文字水平对齐方式，默认自动（'left'，'center'，'right'）
+        },
+        axisLabel: {
+          color: '#c6c6c6',
+        },
+        splitLine: {
+          lineStyle: {
+            type: 'dashed',
+            color: '#066592',
+          },
+        },
+      },
+    ],
+    series: [
+      {
+        name: '降雨量',
+        type: 'bar',
+        barWidth: 10,
+        yAxisIndex: 0,
+        data: [24, 12, 9],
+      },
+      {
+        name: '进口流量',
+        type: 'line',
+        smooth: true,
+        yAxisIndex: 1,
+        symbolSize: 8,
+        data: [14, 8, 5],
+      },
+      {
+        name: '出口流量',
+        type: 'line',
+        smooth: true,
+        yAxisIndex: 1,
+        symbolSize: 8,
+        data: [4, 2, 1],
+      },
+    ],
+  },
+};
+export default optionChart;
diff --git a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/index.vue b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/index.vue
deleted file mode 100644
index bc19015..0000000
--- a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/index.vue
+++ /dev/null
@@ -1,367 +0,0 @@
-<template>
-  <!-- 地表水体水质达标 -->
-  <div class="publicContainer" v-if="back">
-    <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
-      <el-form-item label="考核水体:" prop="riverId">
-        <el-select clearable v-model="queryParams.riverId" class="m-2" placeholder="请选择" size="mini">
-          <el-option v-for="item in responseAA" :key="item.id" :label="item.riverName" :value="Number(item.id)" />
-        </el-select>
-      </el-form-item>
-
-      <el-form-item label="采样年份:" prop="sampleYear">
-        <el-date-picker
-          v-model="queryParams.sampleYear"
-          type="year"
-          placeholder="请选择"
-          format="YYYY"
-          value-format="YYYY"
-          @change="change"
-        />
-      </el-form-item>
-
-      <el-form-item label="评价结果:" prop="blackOdor">
-        <el-select clearable v-model="queryParams.blackOdor" class="m-2" placeholder="请选择" size="mini">
-          <el-option v-for="item in black_odor_level" :key="item.value" :label="item.label" :value="item.value" />
-        </el-select>
-      </el-form-item>
-      <el-form-item>
-        <el-button type="primary" icon="Search" @click="searchData">搜索</el-button>
-        <el-button icon="Refresh" @click="resetData">重置</el-button>
-        <el-button icon="CaretLeft" @click="resect" class="zbBtn"> 返回</el-button>
-        <el-button icon="Plus" type="success" @click="addData">新增</el-button>
-      </el-form-item>
-    </el-form>
-    <!-- 表格 -->
-    <el-table :data="tableData" v-loading="tableLoading" :max-height="650">
-      <el-table-column type="index" width="55" label="序号" />
-      <el-table-column v-for="item in informationDate" :label="item.value" :prop="item.key">
-        <template #default="scope" v-if="item.key == 'blackOdorName'">
-          <span
-            :style="{
-              color:
-                scope.row.blackOdorName == '无黑臭'
-                  ? 'greenyellow'
-                  : scope.row.blackOdorName == '轻度黑臭'
-                  ? ' #419fff'
-                  : scope.row.blackOdorName == '中度黑臭'
-                  ? 'orange'
-                  : scope.row.blackOdorName == '重度黑臭'
-                  ? 'red'
-                  : '',
-            }"
-          >
-            {{
-              scope.row.blackOdorName == '无黑臭'
-                ? '无黑臭'
-                : scope.row.blackOdorName == '轻度黑臭'
-                ? '轻度黑臭'
-                : scope.row.blackOdorName == '中度黑臭'
-                ? '中度黑臭'
-                : scope.row.blackOdorName == '重度黑臭'
-                ? '重度黑臭'
-                : ''
-            }}
-          </span>
-        </template>
-      </el-table-column>
-      <el-table-column label="操作" show-overflow-tooltip width="200">
-        <template #default="{ row }">
-          <el-button type="primary" link @click="checkDetail(row)">详情</el-button>
-          <el-button type="primary" link @click="editData(row)">修改</el-button>
-          <el-button type="danger" link @click="deleteData(row)">删除</el-button>
-        </template>
-      </el-table-column>
-    </el-table>
-    <!-- 分页 -->
-    <pagination
-      v-show="total > 0"
-      :total="total"
-      v-model:page="queryParams.pageNum"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getDataList"
-    />
-    <!-- 添加 修改 查看彈框 -->
-    <el-dialog :title="dialogTitle" v-model="showDialog" width="70%" :close-on-click-modal="false">
-      <el-form ref="ruleForm" :model="formData" :rules="formRules" label-width="auto" :disabled="isDisab">
-        <el-row>
-          <el-form-item label="考核水体:" prop="riverId" style="width: 45%">
-            <el-select clearable v-model="formData.riverId" class="m-2" placeholder="请选择" size="mini" style="width: 100%">
-              <el-option v-for="item in responseAA" :key="item.id" :label="item.riverName" :value="Number(item.id)" />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="采样时间:" prop="sampleTime" style="width: 45%">
-            <el-date-picker
-              style="width: 100%"
-              clearable
-              format="YYYY-MM-DD"
-              value-format="YYYY-MM-DD"
-              v-model="formData.sampleTime"
-              type="date"
-            />
-          </el-form-item>
-          <el-form-item label="采样点:" prop="sampleLocation" style="width: 45%">
-            <el-input v-model="formData.sampleLocation" placeholder="请输入" style="width: 100%" clearable />
-          </el-form-item>
-
-          <el-form-item v-for="item in Dbssz" :label="item.sampleFactorName" :prop="item.sampleFactor" style="width: 45%">
-            <el-input-number
-              v-model="formData[item.sampleFactor]"
-              placeholder="请输入"
-              clearable
-              controls-position="right"
-              style="width: 400px"
-            />
-          </el-form-item>
-
-          <el-form-item label="黑臭程度:" prop="blackOdorName" style="width: 45%" v-if="hiddentext">
-            <div
-              :style="{
-                color:
-                  formData.blackOdorName == '无黑臭'
-                    ? 'greenyellow'
-                    : formData.blackOdorName == '轻度黑臭'
-                    ? ' #419fff'
-                    : formData.blackOdorName == '中度黑臭'
-                    ? 'orange'
-                    : formData.blackOdorName == '重度黑臭'
-                    ? 'red'
-                    : '',
-              }"
-            >
-              {{
-                formData.blackOdorName == '无黑臭'
-                  ? '无黑臭'
-                  : formData.blackOdorName == '轻度黑臭'
-                  ? '轻度黑臭'
-                  : formData.blackOdorName == '中度黑臭'
-                  ? '中度黑臭'
-                  : formData.blackOdorName == '重度黑臭'
-                  ? '重度黑臭'
-                  : ''
-              }}
-            </div>
-          </el-form-item>
-        </el-row>
-      </el-form>
-      <template #footer>
-        <div class="dialog-footer">
-          <el-button type="primary" @click="submitForm" v-show="!isDisab">保 存</el-button>
-          <el-button @click="cancel">关闭</el-button>
-        </div>
-      </template>
-    </el-dialog>
-  </div>
-  <waterquality v-else />
-</template>
-<script setup>
-import {
-  blackOdorUserId,
-  riverInfoWater,
-  blackOdorAdd,
-  blackOdorDelete,
-  sampleConfigconfiguration,
-  blackOdorinformation,
-  blackOdorpaging,
-  blackOdorEdit,
-} from '@/api/spongePerformance/surfaceWater';
-const { proxy } = getCurrentInstance();
-const { hc_sample_factor, sample_type, black_odor_level } = proxy.useDict('hc_sample_factor', 'sample_type', 'black_odor_level');
-import { defineEmits } from 'vue';
-const isDisab = ref(false);
-const isDisatext = ref(false);
-const showDialog = ref(false);
-const showSearch = ref(true);
-const tableLoading = ref(true);
-const hiddentext = ref(false);
-const back = ref(true);
-const responseAA = ref([]);
-const total = ref(0);
-const dialogTitle = ref('');
-const tableData = ref([]);
-const Dbssz = ref([]);
-const informationDate = ref([]);
-const emits = defineEmits();
-const { paramsData } = defineProps(['paramsData']);
-const AllData = reactive({
-  formData: {
-    configs: [],
-  },
-  queryParams: {
-    pageNum: 1,
-    pageSize: 10,
-    sampleTime: '',
-    riverId: '',
-    blackOdor: '',
-    sampleYear: '',
-    sampleLocation: '',
-  },
-  formRules: {
-    riverId: [{ required: true, message: '请选择', trigger: 'blur' }],
-    sampleTime: [{ required: true, message: '请选择', trigger: 'blur' }],
-  },
-});
-const { queryParams, formData, formRules } = toRefs(AllData);
-
-/** 表单重置 */
-function resetForm() {
-  formData.value = {
-    riverId: undefined,
-    sampleYear: undefined,
-    sampleTime: undefined,
-    blackOdor: undefined,
-    sampleLocation: undefined,
-    riverType: 'black_odor',
-  };
-  proxy.resetForm('ruleForm');
-}
-function resect() {
-  emits('searchClick', 0);
-}
-/** 新增按钮操作 */
-function addData() {
-  resetForm();
-  hiddentext.value = false;
-  isDisab.value = false;
-  showDialog.value = true;
-  dialogTitle.value = '新增检测记录';
-}
-
-//搜索
-function searchData() {
-  queryParams.value.pageNum = 1;
-  getDataList();
-}
-//重置
-function resetData() {
-  proxy.resetForm('queryRef');
-  searchData();
-}
-// 获取下拉框数据
-const getSelData = async () => {
-  let params = {
-    riverType: 'black_odor',
-  };
-  riverInfoWater(params).then(response => {
-    if (response.code == 200) {
-      responseAA.value = response.data;
-    }
-  });
-};
-// 新增中的 动态数据
-const Dbsszconfiguration = async () => {
-  let params = {
-    sampleType: 'hcst',
-  };
-  sampleConfigconfiguration(params).then(response => {
-    if (response.code == 200) {
-      Dbssz.value = response.data;
-      Dbssz.value.forEach(item => {
-        formRules.value[item.sampleFactor] = [{ required: true, message: '请输入', trigger: 'blur', type: 'number' }];
-      });
-      console.log(formRules.value);
-    }
-  });
-};
-//地水质采样信息动态表头
-const information = async () => {
-  blackOdorinformation().then(res => {
-    if (res.code == 200) {
-      informationDate.value = res.data;
-    }
-  });
-};
-
-/** 查询列表 */
-const getDataList = async () => {
-  tableLoading.value = true;
-  const res = await blackOdorpaging(queryParams.value);
-  tableData.value = res.data.records;
-  total.value = res.data.total || 0;
-  tableLoading.value = false;
-};
-/** 新增弹框 修改弹框 提交按钮 */
-async function submitForm() {
-  proxy.$refs['ruleForm'].validate(valid => {
-    if (valid) {
-      formData.value.configs = [];
-      let obj = [];
-      Dbssz.value.forEach(k => {
-        obj.push(k.sampleFactor);
-      });
-      obj.forEach(element => {
-        formData.value.configs.push({
-          factor: element,
-          value: formData.value[element],
-        });
-        delete formData.value[element];
-      });
-      console.log(formData.value, 'formData.value.configs');
-
-      if (formData.value.id != undefined) {
-        blackOdorEdit(formData.value).then(() => {
-          console.log(formData.value, 'formData.value');
-          proxy.$modal.msgSuccess('修改成功');
-          showDialog.value = false;
-          getDataList();
-        });
-      } else {
-        blackOdorAdd(formData.value).then(() => {
-          console.log(formData.value, 'formData.valueformData.valueformData.value');
-          proxy.$modal.msgSuccess('新增成功');
-          showDialog.value = false;
-          getDataList();
-        });
-      }
-    }
-  });
-}
-//表格修改
-function editData(row) {
-  formData.value = { ...row };
-  isDisab.value = false;
-  isDisatext.value = true;
-  showDialog.value = true;
-  dialogTitle.value = '修改检测记录';
-  hiddentext.value = true;
-  console.log(row, 'row');
-}
-// 表格删除
-function deleteData(row) {
-  proxy.$modal
-    .confirm('是否确认删除？')
-    .then(async () => {
-      const res = await blackOdorDelete(row.id);
-      if (res?.code !== 200) return;
-      proxy.$modal.msgSuccess('操作成功！');
-      getDataList();
-    })
-    .catch(() => {});
-}
-//详情按钮
-function checkDetail(row) {
-  dialogTitle.value = '查看检测记录';
-  isDisab.value = true;
-  showDialog.value = true;
-  isDisatext.value = true;
-  hiddentext.value = true;
-  formData.value = { ...row };
-}
-
-/** 取消按钮 */
-function cancel() {
-  showDialog.value = false;
-  resetForm();
-}
-function change(val) {
-  console.log(val, 'val');
-  queryParams.value.sampleYear = val;
-}
-onMounted(() => {
-  queryParams.value.sampleYear = paramsData?.examineYear || '';
-  getDataList();
-  getSelData();
-  Dbsszconfiguration();
-  information();
-});
-</script>
-<style scoped lang="scss"></style>
diff --git a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/tableDalgo.vue b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/tableDalgo.vue
deleted file mode 100644
index 7a01aeb..0000000
--- a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/tableDalgo.vue
+++ /dev/null
@@ -1,155 +0,0 @@
-<template>
-  <div class="water-analysis-page">
-    <div class="top">
-      <el-form label-width="auto" :rules="projectEstimateRules" inline ref="ruleForm" :model="FormList" :disabled="typeList.type == 1">
-        <div v-for="i in typeList.monitorDynamicTableTitleList" style="display: flex; flex-direction: column">
-          <el-form-item
-            v-if="i.key == 'real' || i.key == 'target'"
-            v-for="k in i.titleGroup"
-            :label="i.key == 'real' ? '实际' + k.value + ':' : '目标' + k.value + ':'"
-            :prop="k.key"
-            :disabled="typeList.type == 1 || typeList.type == 2"
-          >
-            <el-input
-              :disabled="i.key != 'real'"
-              v-model="FormList[k.key]"
-              :placeholder="k.placeholder"
-              @change="ChangeClick(k.key, FormList[k.key])"
-            >
-            </el-input>
-          </el-form-item>
-          <el-form-item v-else :label="i.value + ':'" :prop="i.key" :disabled="typeList.type == 1 || typeList.type == 2">
-            <el-upload
-              v-if="i.key == 'attachFileList'"
-              v-model:file-list="fileList1"
-              class="upload-demo"
-              action="/system/upload"
-              :headers="uploadHeader"
-              multiple
-              :on-preview="handlePreview"
-              :before-remove="beforeRemove"
-              style="width: 100vh"
-            >
-              <el-button type="primary">选择文件</el-button>
-            </el-upload>
-            <div
-              v-else-if="i.key == 'standardFlag' && typeList.iSstandardFlag"
-              :style="{ color: typeList.iSstandardFlag ? '#108ee9' : 'red' }"
-            >
-              {{ typeList.iSstandardFlag ? '达标' : '未达标' }}
-            </div>
-            <div
-              v-else-if="i.key == 'standardFlag' && !typeList.iSstandardFlag"
-              :style="{ color: IsStandFlag1 > 0 && IsStandFlag2 > 0 ? '#108ee9' : 'red' }"
-            >
-              <span v-show="false">{{ IsStandFlag1 > 0 && IsStandFlag2 > 0 ? (IsStandText = 1) : (IsStandText = 0) }}</span>
-              {{ IsStandFlag1 > 0 && IsStandFlag2 > 0 ? '达标' : '未达标' }}
-            </div>
-            <div v-else>
-              {{ FormList[i.key] }}
-            </div>
-          </el-form-item>
-        </div>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script setup>
-import { projectInfoEdit } from '@/api/spongePerformance/prevention';
-import { getToken } from '@/utils/auth';
-import { projectEstimateRules } from '@/utils/rules';
-import { ElMessage, ElMessageBox } from 'element-plus';
-const { proxy } = getCurrentInstance();
-const { fund_source } = proxy.useDict('fund_source');
-const uploadHeader = ref({
-  Authorization: 'Bearer ' + getToken(),
-});
-const { typeList } = defineProps(['typeList']);
-const emits = defineEmits();
-defineExpose({ submit, closed, resetFiled });
-const IsStandFlag1 = ref(0);
-const IsStandFlag2 = ref(0);
-const IsStandText = ref('');
-let FormList = ref({ projectNo: '', fileSaveRequestList: [] });
-function ChangeClick(v, m) {
-  console.log('v', v);
-  console.log('m', m);
-  typeList.iSstandardFlag = null;
-  if (v == 'realCXQ') {
-    console.log('object1', m * 1 - FormList.value.targetCXQ * 1);
-    IsStandFlag1.value = m * 1 - FormList.value.targetCXQ * 1;
-  } else {
-    console.log('object2', m * 1 - FormList.value.targetDBMJZJCQMJ * 1);
-    IsStandFlag2.value = m * 1 - FormList.value.targetCXQ * 1;
-  }
-}
-const fileList1 = ref([]);
-function handlePreview(file) {
-  return ElMessageBox.confirm(`下载此文件: ${file.name}？`).then(
-    () => window.open(file.url),
-    () => false
-  );
-}
-function beforeRemove(file) {
-  return true;
-}
-function submit() {
-  proxy.$refs.ruleForm.validate(valid => {
-    if (valid) {
-      const fileSaveRequestList = [];
-      fileList1.value.forEach(element => {
-        if (element.hasOwnProperty('response')) {
-          element.response.data.refType = 'proProjectBudget';
-          fileSaveRequestList.push(element.response.data);
-        } else {
-          fileSaveRequestList.push(element);
-        }
-      });
-      const itemUpdateFieldRequestList = [
-        { id: typeList.data['CXQ-id'], realValue: FormList.value.realCXQ, standardFlag: IsStandFlag1.value > 0 ? 1 : 0 },
-        {
-          id: typeList.data['DBMJZJCQMJ-id' || 0],
-          realValue: FormList.value.realDBMJZJCQMJ,
-          standardFlag: IsStandFlag2.value > 0 ? 1 : 0,
-        },
-      ];
-      FormList.value = {
-        itemDataType: typeList.itemDataType,
-        standardFlag: typeList.iSstandardFlag || IsStandText.value,
-        itemUpdateFieldRequestList,
-        fileSaveRequestList,
-        performanceEvaluateId: typeList.data.performanceEvaluateId,
-      };
-      console.log('FormList.value', FormList.value);
-      projectInfoEdit(FormList.value).then(({ code }) => {
-        if (code == 200) {
-          emits('onModalClose');
-        }
-      });
-    }
-    // }
-  });
-}
-function loadProjerctListData() {
-  console.log('typeListtypeList', typeList);
-  FormList.value = typeList.data;
-  fileList1.value = typeList.fileList1;
-  proxy.$refs.ruleForm.resetFields();
-}
-function resetFiled() {
-  proxy.$refs.ruleForm.resetFields();
-  fileList1.value = [];
-}
-
-function closed() {
-  emits('onModalClose');
-}
-onMounted(() => {
-  loadProjerctListData();
-});
-</script>
-<style lang="scss" scoped>
-.water-analysis-page {
-  padding: 20px;
-}
-</style>

diff --git a/src/views/sponeScreen/Echarts/echartBar3D.vue b/src/views/sponeScreen/Echarts/echartBar3D.vue
index 3d23886..038626c 100644
--- a/src/views/sponeScreen/Echarts/echartBar3D.vue
+++ b/src/views/sponeScreen/Echarts/echartBar3D.vue
@@ -65,14 +65,14 @@
             lineStyle: {
               color: '#384267',
             },
-            show: true,
+            show: false,
           },
           splitLine: {
             show: false,
           },
           axisLine: {
             lineStyle: {
-              color: '#384267',
+              color: '#005CBA',
               width: 1,
               type: 'dashed',
             },
@@ -91,7 +91,7 @@
               color: '#005CBA',
               width: 1,
             },
-            show: true,
+            show: false,
           },
           splitLine: {
             show: true,
@@ -214,7 +214,9 @@
     );
 
     onMounted(() => {
-      init();
+      setTimeout(() => {
+        init();
+      }, 0);
       window.addEventListener('resize', resizeTheChart);
     });
     return {
diff --git a/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue b/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
index 37c3002..3075239 100644
--- a/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
+++ b/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
@@ -1 +1,65 @@
-<template><div>年径流污染削减率管理信息</div></template>
+<template>
+  <!-- 年径流污染削减率 -->
+  <div class="publicContainer">
+    <!-- gis地图 -->
+    <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
+
+    <!-- 海绵设施监测详情 -->
+    <el-dialog v-model="dialogShow" title="海绵设施监测点位详情" :modal-append-to-body="false" width="600px">
+      <el-form :inline="true">
+        <el-form-item label="日期" prop="date">
+          <el-date-picker type="daterange" v-model="dateSearch" value-format="YYYY-MM-DD" placeholder="请选择"></el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+        </el-form-item>
+      </el-form>
+      <div id="chartHMXJ" style="width: 100%; height: 300px"></div>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import MapBox from '@/views/gisMapPage/gisMapBox1'; //gis地图
+import optionChart from './chartOption.js';
+
+const { proxy } = getCurrentInstance();
+const dialogShow = ref(true);
+const charts = ref(null);
+const dateSearch = ref([proxy.moment(new Date()).subtract(60, 'days').format('YYYY-MM-DD'), proxy.moment().format('YYYY-MM-DD')]);
+
+// 历史数据搜索
+function handleQuery() {
+  setTimeout(() => {
+    initChart();
+  });
+}
+
+// echarts初始化
+function initChart() {
+  charts.value && charts.value.dispose();
+  charts.value = proxy.echarts.init(document.getElementById('chartHMXJ'));
+  optionChart.option.xAxis.data = ['2024-06-12 00:00:00', '2024-06-12 00:10:00', '2024-06-12 00:20:00'];
+  optionChart.option.yAxis[1].name = 'SS(mg/L)';
+  optionChart.option.series[0].data = [12, 9, 20]; //降雨量
+  optionChart.option.series[1].name = '进口SS';
+  optionChart.option.series[1].data = [230, 190, 132]; //进口SS
+  optionChart.option.series[2].name = '出口SS';
+  optionChart.option.series[2].data = [110, 90, 103]; //出口SS
+  // 设置鼠标滚轮放大缩小展示数据区间
+  optionChart.option.dataZoom = [{ type: 'inside', startValue: optionChart.option.xAxis.data[optionChart.option.xAxis.data.length / 2] }];
+  if (optionChart.option.xAxis.data.length > 0) {
+    optionChart.option.graphic.invisible = true; //暂无数据
+  } else {
+    optionChart.option.graphic.invisible = false; //暂无数据
+  }
+  charts.value.clear();
+  charts.value.setOption(optionChart.option);
+}
+
+onMounted(() => {
+  handleQuery();
+});
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue b/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
index c06a3dc..35608fb 100644
--- a/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
+++ b/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
@@ -1,3 +1,62 @@
 <template>
-  <div>年径流总量控制率管理信息</div>
+  <!-- 年径流总量控制率 -->
+  <div class="publicContainer">
+    <!-- gis地图 -->
+    <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
+
+    <!-- 海绵设施监测详情 -->
+    <el-dialog v-model="dialogShow" title="海绵设施监测点位详情" :modal-append-to-body="false" width="600px">
+      <el-form :inline="true">
+        <el-form-item label="日期" prop="date">
+          <el-date-picker type="daterange" v-model="dateSearch" value-format="YYYY-MM-DD" placeholder="请选择"></el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+        </el-form-item>
+      </el-form>
+      <div id="chartHMJC" style="width: 100%; height: 300px"></div>
+    </el-dialog>
+  </div>
 </template>
+
+<script setup>
+import MapBox from '@/views/gisMapPage/gisMapBox1'; //gis地图
+import optionChart from './chartOption.js';
+
+const { proxy } = getCurrentInstance();
+const dialogShow = ref(true);
+const charts = ref(null);
+const dateSearch = ref([proxy.moment(new Date()).subtract(60, 'days').format('YYYY-MM-DD'), proxy.moment().format('YYYY-MM-DD')]);
+
+// 历史数据搜索
+function handleQuery() {
+  setTimeout(() => {
+    initChart();
+  });
+}
+
+// echarts初始化
+function initChart() {
+  charts.value && charts.value.dispose();
+  charts.value = proxy.echarts.init(document.getElementById('chartHMJC'));
+  optionChart.option.xAxis.data = ['2024-06-12 00:00:00', '2024-06-12 00:10:00', '2024-06-12 00:20:00'];
+  optionChart.option.series[0].data = [12, 9, 20]; //降雨量
+  optionChart.option.series[1].data = [2.3, 1.9, 3.2]; //进口流量
+  optionChart.option.series[2].data = [1.1, 0.9, 1.3]; //出口流量
+  // 设置鼠标滚轮放大缩小展示数据区间
+  optionChart.option.dataZoom = [{ type: 'inside', startValue: optionChart.option.xAxis.data[optionChart.option.xAxis.data.length / 2] }];
+  if (optionChart.option.xAxis.data.length > 0) {
+    optionChart.option.graphic.invisible = true; //暂无数据
+  } else {
+    optionChart.option.graphic.invisible = false; //暂无数据
+  }
+  charts.value.clear();
+  charts.value.setOption(optionChart.option);
+}
+
+onMounted(() => {
+  handleQuery();
+});
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue b/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue
index d49fc2a..b86ad5d 100644
--- a/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue
+++ b/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue
@@ -1,4 +1,5 @@
 <template>
+  <!-- 污水处理厂进水BOD -->
   <div class="publicContainer">
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
       <el-form-item label="统计年份" prop="date">
@@ -13,7 +14,6 @@
 
       <el-form-item>
         <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
-        <el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button>
         <el-button icon="Refresh" @click="resetQuery">重置</el-button>
       </el-form-item>
     </el-form>
@@ -21,23 +21,17 @@
     <!-- 表格 -->
     <el-table :data="dataList" v-loading="loading" stripe :max-height="580">
       <el-table-column type="index" width="55" label="序号" />
-      <el-table-column label="统计年份" prop="q" />
       <el-table-column label="日期" prop="w" />
-      <el-table-column label="进水BOD平均浓度（mg/L）">
+      <el-table-column label="进水BOD平均浓度(mg/L)">
         <el-table-column prop="monthPlan1" label="西区污水处理厂" />
         <el-table-column prop="monthPlan2" label="东区污水处理厂" />
-        <el-table-column prop="monthPlan3" label="马家河污水厂" />
+        <el-table-column prop="monthPlan3" label="马家河污水处理厂" />
+        <el-table-column prop="monthPlan4" label="包公湖污水处理厂" />
+        <el-table-column prop="monthPlan5" label="祥符区污水处理厂" />
       </el-table-column>
       <el-table-column label="均值" prop="p" />
       <el-table-column label="年度绩效指标" prop="a" />
-      <el-table-column label="评价结论" prop="a" />
-      <el-table-column label="操作" width="240">
-        <template #default="scope">
-          <el-button link icon="View" type="primary" @click="handleDetail(scope.row, 'view')">查看</el-button>
-          <el-button link type="warning" icon="Edit" @click="handleUpdate(scope.row, 'view')">修改</el-button>
-          <el-button link type="danger" icon="Delete" @click="handleDelete(scope.row, 'view')">删除</el-button>
-        </template>
-      </el-table-column>
+      <el-table-column label="年度达标情况" prop="b" />
     </el-table>
     <!-- 分页 -->
     <pagination
@@ -47,117 +41,23 @@
       v-model:limit="queryParams.pageSize"
       @pagination="getList"
     />
-    <!-- 新增弹窗 -->
-    <el-dialog :title="title" v-model="open" width="800px" append-to-body :close-on-click-modal="false">
-      <el-form ref="roleRef" :model="form" :rules="rules" label-width="130px" :disabled="multiple">
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="统计年份:" prop="w">
-              <el-date-picker
-                type="year"
-                v-model="queryParams.date"
-                value-format="YYYY"
-                placeholder="请选择统计年份"
-                style="width: 100%"
-              ></el-date-picker>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="日期:" prop="w">
-              <el-date-picker
-                type="month"
-                v-model="queryParams.date"
-                value-format="YYYY-MM"
-                placeholder="请选择日期"
-                style="width: 100%"
-              ></el-date-picker>
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="西区污水处理厂:" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入西区污水处理厂" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="东区污水处理厂:" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入东区污水处理厂" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="马家河污水厂:" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入马家河污水厂" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="均值:" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入均值" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="年度绩效指标" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入年度绩效指标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="评价结论" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入评价结论标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-      </el-form>
-      <template #footer>
-        <div class="dialog-footer">
-          <el-button type="primary" @click="submitForm">确 定</el-button>
-          <el-button @click="cancel">取 消</el-button>
-        </div>
-      </template>
-    </el-dialog>
   </div>
 </template>
 <script setup name="WaterSupplyWaterPlants">
 const { proxy } = getCurrentInstance();
-const open = ref(false);
-const multiple = ref(false);
 const showSearch = ref(true);
-const Xcfrequency = ref([
-  {
-    value: 'tian',
-    label: '天',
-  },
-  {
-    value: 'zhou',
-    label: '周',
-  },
-]);
 const loading = ref(true);
 const total = ref(0);
-const title = ref('');
 const dataList = ref([]);
 const AllData = reactive({
   id: '',
-  form: {},
   queryParams: {
     pageNum: 1,
     pageSize: 10,
-    caseType: 1,
-    handleStatus: '',
-    searchContent: '',
-  },
-  rules: {
-    id: [{ required: true, message: '请输入', trigger: 'blur' }],
-    eventDescription: [{ required: true, message: '请输入', trigger: 'blur' }],
+    date: null,
   },
 });
-const { queryParams, form, rules } = toRefs(AllData);
+const { queryParams } = toRefs(AllData);
 //搜索
 function handleQuery() {
   getList();
@@ -167,39 +67,6 @@
   proxy.resetForm('queryRef');
   handleQuery();
 }
-// 新增
-function handleAdd() {
-  title.value = '新增水厂供水';
-  open.value = true;
-  form.value = {};
-  multiple.value = false;
-  form.value.fileTag = Xcfrequency.value[0].value;
-}
-// 新增中取消事件
-function cancel() {
-  open.value = false;
-  proxy.resetForm('roleRef');
-}
-
-// 巡查频率下拉框点击事件
-function changeStation(value) {
-  // console.log(value, 'value');
-}
-
-//查看详情操作
-function handleDetail(row) {
-  open.value = true;
-  title.value = '查看水厂供水';
-  multiple.value = true;
-  form.value = row;
-}
-// 修改按钮操作
-function handleUpdate(row) {
-  open.value = true;
-  title.value = '修改水厂供水';
-  multiple.value = false;
-  form.value = { ...row };
-}
 
 /** 查询列表 */
 const getList = async () => {
@@ -211,12 +78,4 @@
   getList();
 });
 </script>
-<style scoped lang="scss">
-.dituclass {
-  width: 100%;
-  height: 300px;
-  // background: red;
-  margin-bottom: 10px;
-  border: 1px solid #004565;
-}
-</style>
+<style scoped lang="scss"></style>
diff --git a/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue b/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue
index 6ce3f37..94c365b 100644
--- a/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue
+++ b/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue
@@ -1,34 +1,31 @@
 <template>
+  <!-- 城市生活污水集中收集率 -->
   <div class="publicContainer">
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
-      <el-form-item label="污水厂名称:" prop="searchContent">
-        <el-input v-model="queryParams.searchContent" placeholder="请输入污水厂名称" clearable style="width: 180px" />
-      </el-form-item>
       <el-form-item label="统计年份" prop="date">
         <el-date-picker type="year" v-model="queryParams.date" value-format="YYYY" placeholder="请选择统计年份"></el-date-picker>
       </el-form-item>
 
       <el-form-item>
         <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
-        <el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button>
         <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+        <el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button>
       </el-form-item>
     </el-form>
 
     <!-- 表格 -->
     <el-table :data="dataList" v-loading="loading" stripe :max-height="580">
       <el-table-column type="index" width="55" label="序号" />
-      <el-table-column label="污水厂名称" prop="q" />
-      <el-table-column label="编码" prop="w" />
       <el-table-column label="统计年份" prop="o" />
-      <el-table-column label="年度绩效指标" prop="p" />
+      <el-table-column label="污水厂名称" prop="q" />
       <el-table-column label="累计处理水量(万t)" prop="e" />
       <el-table-column label="进水BOD平均浓度(mg/L)" prop="r" />
       <el-table-column label="BOD 削减量(g)" prop="t" />
       <el-table-column label="城区用水人口(万人)" prop="y" />
       <el-table-column label="人均日生活污染排放量(g/人·d)" prop="u" />
-      <el-table-column label="城市生活污水集中收集率(%)" prop="i" />
-      <el-table-column label="评价结论" prop="a" />
+      <el-table-column label="目标收集率(%)" prop="p" />
+      <el-table-column label="实际收集率(%)" prop="i" />
+      <el-table-column label="达标情况" prop="a" />
       <el-table-column label="操作" width="240">
         <template #default="scope">
           <el-button link icon="View" type="primary" @click="handleDetail(scope.row, 'view')">查看</el-button>
@@ -46,93 +43,46 @@
       @pagination="getList"
     />
     <!-- 新增弹窗 -->
-    <el-dialog :title="title" v-model="open" width="1100px" append-to-body :close-on-click-modal="false">
+    <el-dialog :title="title" v-model="open" width="600px" append-to-body :close-on-click-modal="false">
       <el-form ref="roleRef" :model="form" :rules="rules" label-width="220px" :disabled="multiple">
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="污水厂名称:" prop="w">
-              <el-input v-model="form.w" placeholder="请输入污水厂名称" clearable style="width: 100%" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="编码:" prop="w">
-              <el-input v-model="form.w" placeholder="请输入编码" clearable style="width: 100%" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="累计处理水量(万t):" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入累计处理水量(万t)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="进水BOD平均浓度(mg/L):" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入进水BOD平均浓度(mg/L)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="BOD 削减量(g):" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入BOD 削减量(g)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="城区用水人口(万人):" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入城区用水人口(万人)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="人均日生活污染排放量(g/人·d):" prop="lon">
-              <el-input-number
-                v-model="form.lon"
-                placeholder="请输入人均日生活污染排放量(g/人·d)"
-                style="width: 100%"
-                controls-position="right"
-              />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="城市生活污水集中收集率(%):" prop="lat">
-              <el-input-number
-                v-model="form.lat"
-                placeholder="请输入城市生活污水集中收集率(%)"
-                style="width: 100%"
-                controls-position="right"
-              />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="统计年份" prop="date">
-              <el-date-picker
-                type="year"
-                v-model="queryParams.date"
-                value-format="YYYY"
-                placeholder="请选择统计年份"
-                style="width: 100%"
-              ></el-date-picker>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="年度绩效指标" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入年度绩效指标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="评价结论" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入评价结论标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-        </el-row>
+        <el-form-item label="统计年份" prop="date">
+          <el-date-picker
+            type="year"
+            v-model="queryParams.date"
+            value-format="YYYY"
+            placeholder="请选择统计年份"
+            style="width: 100%"
+          ></el-date-picker>
+        </el-form-item>
+        <el-form-item label="污水厂名称:" prop="w">
+          <el-input v-model="form.w" placeholder="请输入污水厂名称" clearable style="width: 100%" />
+        </el-form-item>
+        <el-form-item label="累计处理水量(万t):" prop="lon">
+          <el-input-number v-model="form.lon" placeholder="请输入累计处理水量(万t)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="进水BOD平均浓度(mg/L):" prop="lat">
+          <el-input-number v-model="form.lat" placeholder="请输入进水BOD平均浓度(mg/L)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="BOD 削减量(g):" prop="lon">
+          <el-input-number v-model="form.lon" placeholder="请输入BOD 削减量(g)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="城区用水人口(万人):" prop="lat">
+          <el-input-number v-model="form.lat" placeholder="请输入城区用水人口(万人)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="人均日生活污染排放量(g/人·d):" prop="lon">
+          <el-input-number
+            v-model="form.lon"
+            placeholder="请输入人均日生活污染排放量(g/人·d)"
+            style="width: 100%"
+            controls-position="right"
+          />
+        </el-form-item>
+        <el-form-item label="目标收集率(%):" prop="date">
+          <el-input-number v-model="form.lon" placeholder="请输入目标收集率" style="width: 100%" />
+        </el-form-item>
+        <el-form-item label="实际收集率(%):" prop="lat">
+          <el-input-number v-model="form.lat" placeholder="请输入实际收集率(%)" style="width: 100%" controls-position="right" />
+        </el-form-item>
       </el-form>
       <template #footer>
         <div class="dialog-footer">
@@ -170,7 +120,6 @@
     pageSize: 10,
     caseType: 1,
     handleStatus: '',
-    searchContent: '',
   },
   rules: {
     id: [{ required: true, message: '请输入', trigger: 'blur' }],
diff --git a/src/views/spongePerformance/OutputPerformance/chartOption.js b/src/views/spongePerformance/OutputPerformance/chartOption.js
new file mode 100644
index 0000000..c0e300f
--- /dev/null
+++ b/src/views/spongePerformance/OutputPerformance/chartOption.js
@@ -0,0 +1,137 @@
+import useUserStore from '@/store/modules/user';
+import * as echarts from 'echarts';
+const pinias = useUserStore();
+
+let optionChart = {
+  // 柱状图+折线图
+  option: {
+    color: pinias.$state.chartColor,
+    // 显示暂无数据
+    graphic: {
+      type: 'text', // 类型：文本
+      left: 'center',
+      top: 'middle',
+      silent: true, // 不响应事件
+      invisible: false, // 有数据就隐藏
+      style: {
+        fill: '#c6c6c6',
+        fontWeight: 'bold',
+        text: '暂无数据',
+        fontFamily: 'Microsoft YaHei',
+        fontSize: '18px',
+      },
+    },
+    tooltip: {
+      trigger: 'axis',
+      confine: true, //是否将 tooltip 框限制在图表的区域内
+    },
+    title: {
+      left: 'left',
+      text: '',
+      top: 10,
+      bottom: 10,
+      left: 10,
+      textStyle: {
+        color: '#545E75', //字体颜色
+        fontSize: 16, //字体大小
+      },
+    },
+    grid: {
+      left: '3%',
+      right: '5%',
+      top: '20%',
+      bottom: '3%',
+      containLabel: true,
+    },
+    legend: {
+      top: '2%',
+      orient: 'horizontal', //horizontal
+      left: 'center', //left ,center
+      textStyle: {
+        color: 'inherit',
+      },
+    },
+    xAxis: {
+      type: 'category',
+      position: 'bottom',
+      data: ['2023', '2024', '2025'],
+      axisLabel: {
+        color: '#c6c6c6',
+      },
+      axisLine: {
+        lineStyle: {
+          color: '#066592',
+        },
+      },
+    },
+    yAxis: [
+      {
+        name: '降雨量(mm)',
+        type: 'value',
+        inverse: true, //翻转
+        nameLocation: 'start', // 坐标轴名称显示位置
+        nameGap: 15, // 坐标轴名称与轴线之间的距离
+        nameTextStyle: {
+          color: '#c6c6c6', //字体颜色
+          fontSize: 12, //字体大小
+          align: 'center', // 文字水平对齐方式，默认自动（'left'，'center'，'right'）
+        },
+        splitLine: {
+          lineStyle: {
+            type: 'dashed',
+            color: '#066592',
+          },
+        },
+        axisLabel: {
+          color: '#c6c6c6',
+        },
+      },
+      {
+        name: '流量(m³/h)',
+        type: 'value',
+        nameLocation: 'end', // 坐标轴名称显示位置
+        nameGap: 15, // 坐标轴名称与轴线之间的距离
+        nameTextStyle: {
+          color: '#c6c6c6', //字体颜色
+          fontSize: 12, //字体大小
+          align: 'center', // 文字水平对齐方式，默认自动（'left'，'center'，'right'）
+        },
+        axisLabel: {
+          color: '#c6c6c6',
+        },
+        splitLine: {
+          lineStyle: {
+            type: 'dashed',
+            color: '#066592',
+          },
+        },
+      },
+    ],
+    series: [
+      {
+        name: '降雨量',
+        type: 'bar',
+        barWidth: 10,
+        yAxisIndex: 0,
+        data: [24, 12, 9],
+      },
+      {
+        name: '进口流量',
+        type: 'line',
+        smooth: true,
+        yAxisIndex: 1,
+        symbolSize: 8,
+        data: [14, 8, 5],
+      },
+      {
+        name: '出口流量',
+        type: 'line',
+        smooth: true,
+        yAxisIndex: 1,
+        symbolSize: 8,
+        data: [4, 2, 1],
+      },
+    ],
+  },
+};
+export default optionChart;
diff --git a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/index.vue b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/index.vue
deleted file mode 100644
index bc19015..0000000
--- a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/index.vue
+++ /dev/null
@@ -1,367 +0,0 @@
-<template>
-  <!-- 地表水体水质达标 -->
-  <div class="publicContainer" v-if="back">
-    <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
-      <el-form-item label="考核水体:" prop="riverId">
-        <el-select clearable v-model="queryParams.riverId" class="m-2" placeholder="请选择" size="mini">
-          <el-option v-for="item in responseAA" :key="item.id" :label="item.riverName" :value="Number(item.id)" />
-        </el-select>
-      </el-form-item>
-
-      <el-form-item label="采样年份:" prop="sampleYear">
-        <el-date-picker
-          v-model="queryParams.sampleYear"
-          type="year"
-          placeholder="请选择"
-          format="YYYY"
-          value-format="YYYY"
-          @change="change"
-        />
-      </el-form-item>
-
-      <el-form-item label="评价结果:" prop="blackOdor">
-        <el-select clearable v-model="queryParams.blackOdor" class="m-2" placeholder="请选择" size="mini">
-          <el-option v-for="item in black_odor_level" :key="item.value" :label="item.label" :value="item.value" />
-        </el-select>
-      </el-form-item>
-      <el-form-item>
-        <el-button type="primary" icon="Search" @click="searchData">搜索</el-button>
-        <el-button icon="Refresh" @click="resetData">重置</el-button>
-        <el-button icon="CaretLeft" @click="resect" class="zbBtn"> 返回</el-button>
-        <el-button icon="Plus" type="success" @click="addData">新增</el-button>
-      </el-form-item>
-    </el-form>
-    <!-- 表格 -->
-    <el-table :data="tableData" v-loading="tableLoading" :max-height="650">
-      <el-table-column type="index" width="55" label="序号" />
-      <el-table-column v-for="item in informationDate" :label="item.value" :prop="item.key">
-        <template #default="scope" v-if="item.key == 'blackOdorName'">
-          <span
-            :style="{
-              color:
-                scope.row.blackOdorName == '无黑臭'
-                  ? 'greenyellow'
-                  : scope.row.blackOdorName == '轻度黑臭'
-                  ? ' #419fff'
-                  : scope.row.blackOdorName == '中度黑臭'
-                  ? 'orange'
-                  : scope.row.blackOdorName == '重度黑臭'
-                  ? 'red'
-                  : '',
-            }"
-          >
-            {{
-              scope.row.blackOdorName == '无黑臭'
-                ? '无黑臭'
-                : scope.row.blackOdorName == '轻度黑臭'
-                ? '轻度黑臭'
-                : scope.row.blackOdorName == '中度黑臭'
-                ? '中度黑臭'
-                : scope.row.blackOdorName == '重度黑臭'
-                ? '重度黑臭'
-                : ''
-            }}
-          </span>
-        </template>
-      </el-table-column>
-      <el-table-column label="操作" show-overflow-tooltip width="200">
-        <template #default="{ row }">
-          <el-button type="primary" link @click="checkDetail(row)">详情</el-button>
-          <el-button type="primary" link @click="editData(row)">修改</el-button>
-          <el-button type="danger" link @click="deleteData(row)">删除</el-button>
-        </template>
-      </el-table-column>
-    </el-table>
-    <!-- 分页 -->
-    <pagination
-      v-show="total > 0"
-      :total="total"
-      v-model:page="queryParams.pageNum"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getDataList"
-    />
-    <!-- 添加 修改 查看彈框 -->
-    <el-dialog :title="dialogTitle" v-model="showDialog" width="70%" :close-on-click-modal="false">
-      <el-form ref="ruleForm" :model="formData" :rules="formRules" label-width="auto" :disabled="isDisab">
-        <el-row>
-          <el-form-item label="考核水体:" prop="riverId" style="width: 45%">
-            <el-select clearable v-model="formData.riverId" class="m-2" placeholder="请选择" size="mini" style="width: 100%">
-              <el-option v-for="item in responseAA" :key="item.id" :label="item.riverName" :value="Number(item.id)" />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="采样时间:" prop="sampleTime" style="width: 45%">
-            <el-date-picker
-              style="width: 100%"
-              clearable
-              format="YYYY-MM-DD"
-              value-format="YYYY-MM-DD"
-              v-model="formData.sampleTime"
-              type="date"
-            />
-          </el-form-item>
-          <el-form-item label="采样点:" prop="sampleLocation" style="width: 45%">
-            <el-input v-model="formData.sampleLocation" placeholder="请输入" style="width: 100%" clearable />
-          </el-form-item>
-
-          <el-form-item v-for="item in Dbssz" :label="item.sampleFactorName" :prop="item.sampleFactor" style="width: 45%">
-            <el-input-number
-              v-model="formData[item.sampleFactor]"
-              placeholder="请输入"
-              clearable
-              controls-position="right"
-              style="width: 400px"
-            />
-          </el-form-item>
-
-          <el-form-item label="黑臭程度:" prop="blackOdorName" style="width: 45%" v-if="hiddentext">
-            <div
-              :style="{
-                color:
-                  formData.blackOdorName == '无黑臭'
-                    ? 'greenyellow'
-                    : formData.blackOdorName == '轻度黑臭'
-                    ? ' #419fff'
-                    : formData.blackOdorName == '中度黑臭'
-                    ? 'orange'
-                    : formData.blackOdorName == '重度黑臭'
-                    ? 'red'
-                    : '',
-              }"
-            >
-              {{
-                formData.blackOdorName == '无黑臭'
-                  ? '无黑臭'
-                  : formData.blackOdorName == '轻度黑臭'
-                  ? '轻度黑臭'
-                  : formData.blackOdorName == '中度黑臭'
-                  ? '中度黑臭'
-                  : formData.blackOdorName == '重度黑臭'
-                  ? '重度黑臭'
-                  : ''
-              }}
-            </div>
-          </el-form-item>
-        </el-row>
-      </el-form>
-      <template #footer>
-        <div class="dialog-footer">
-          <el-button type="primary" @click="submitForm" v-show="!isDisab">保 存</el-button>
-          <el-button @click="cancel">关闭</el-button>
-        </div>
-      </template>
-    </el-dialog>
-  </div>
-  <waterquality v-else />
-</template>
-<script setup>
-import {
-  blackOdorUserId,
-  riverInfoWater,
-  blackOdorAdd,
-  blackOdorDelete,
-  sampleConfigconfiguration,
-  blackOdorinformation,
-  blackOdorpaging,
-  blackOdorEdit,
-} from '@/api/spongePerformance/surfaceWater';
-const { proxy } = getCurrentInstance();
-const { hc_sample_factor, sample_type, black_odor_level } = proxy.useDict('hc_sample_factor', 'sample_type', 'black_odor_level');
-import { defineEmits } from 'vue';
-const isDisab = ref(false);
-const isDisatext = ref(false);
-const showDialog = ref(false);
-const showSearch = ref(true);
-const tableLoading = ref(true);
-const hiddentext = ref(false);
-const back = ref(true);
-const responseAA = ref([]);
-const total = ref(0);
-const dialogTitle = ref('');
-const tableData = ref([]);
-const Dbssz = ref([]);
-const informationDate = ref([]);
-const emits = defineEmits();
-const { paramsData } = defineProps(['paramsData']);
-const AllData = reactive({
-  formData: {
-    configs: [],
-  },
-  queryParams: {
-    pageNum: 1,
-    pageSize: 10,
-    sampleTime: '',
-    riverId: '',
-    blackOdor: '',
-    sampleYear: '',
-    sampleLocation: '',
-  },
-  formRules: {
-    riverId: [{ required: true, message: '请选择', trigger: 'blur' }],
-    sampleTime: [{ required: true, message: '请选择', trigger: 'blur' }],
-  },
-});
-const { queryParams, formData, formRules } = toRefs(AllData);
-
-/** 表单重置 */
-function resetForm() {
-  formData.value = {
-    riverId: undefined,
-    sampleYear: undefined,
-    sampleTime: undefined,
-    blackOdor: undefined,
-    sampleLocation: undefined,
-    riverType: 'black_odor',
-  };
-  proxy.resetForm('ruleForm');
-}
-function resect() {
-  emits('searchClick', 0);
-}
-/** 新增按钮操作 */
-function addData() {
-  resetForm();
-  hiddentext.value = false;
-  isDisab.value = false;
-  showDialog.value = true;
-  dialogTitle.value = '新增检测记录';
-}
-
-//搜索
-function searchData() {
-  queryParams.value.pageNum = 1;
-  getDataList();
-}
-//重置
-function resetData() {
-  proxy.resetForm('queryRef');
-  searchData();
-}
-// 获取下拉框数据
-const getSelData = async () => {
-  let params = {
-    riverType: 'black_odor',
-  };
-  riverInfoWater(params).then(response => {
-    if (response.code == 200) {
-      responseAA.value = response.data;
-    }
-  });
-};
-// 新增中的 动态数据
-const Dbsszconfiguration = async () => {
-  let params = {
-    sampleType: 'hcst',
-  };
-  sampleConfigconfiguration(params).then(response => {
-    if (response.code == 200) {
-      Dbssz.value = response.data;
-      Dbssz.value.forEach(item => {
-        formRules.value[item.sampleFactor] = [{ required: true, message: '请输入', trigger: 'blur', type: 'number' }];
-      });
-      console.log(formRules.value);
-    }
-  });
-};
-//地水质采样信息动态表头
-const information = async () => {
-  blackOdorinformation().then(res => {
-    if (res.code == 200) {
-      informationDate.value = res.data;
-    }
-  });
-};
-
-/** 查询列表 */
-const getDataList = async () => {
-  tableLoading.value = true;
-  const res = await blackOdorpaging(queryParams.value);
-  tableData.value = res.data.records;
-  total.value = res.data.total || 0;
-  tableLoading.value = false;
-};
-/** 新增弹框 修改弹框 提交按钮 */
-async function submitForm() {
-  proxy.$refs['ruleForm'].validate(valid => {
-    if (valid) {
-      formData.value.configs = [];
-      let obj = [];
-      Dbssz.value.forEach(k => {
-        obj.push(k.sampleFactor);
-      });
-      obj.forEach(element => {
-        formData.value.configs.push({
-          factor: element,
-          value: formData.value[element],
-        });
-        delete formData.value[element];
-      });
-      console.log(formData.value, 'formData.value.configs');
-
-      if (formData.value.id != undefined) {
-        blackOdorEdit(formData.value).then(() => {
-          console.log(formData.value, 'formData.value');
-          proxy.$modal.msgSuccess('修改成功');
-          showDialog.value = false;
-          getDataList();
-        });
-      } else {
-        blackOdorAdd(formData.value).then(() => {
-          console.log(formData.value, 'formData.valueformData.valueformData.value');
-          proxy.$modal.msgSuccess('新增成功');
-          showDialog.value = false;
-          getDataList();
-        });
-      }
-    }
-  });
-}
-//表格修改
-function editData(row) {
-  formData.value = { ...row };
-  isDisab.value = false;
-  isDisatext.value = true;
-  showDialog.value = true;
-  dialogTitle.value = '修改检测记录';
-  hiddentext.value = true;
-  console.log(row, 'row');
-}
-// 表格删除
-function deleteData(row) {
-  proxy.$modal
-    .confirm('是否确认删除？')
-    .then(async () => {
-      const res = await blackOdorDelete(row.id);
-      if (res?.code !== 200) return;
-      proxy.$modal.msgSuccess('操作成功！');
-      getDataList();
-    })
-    .catch(() => {});
-}
-//详情按钮
-function checkDetail(row) {
-  dialogTitle.value = '查看检测记录';
-  isDisab.value = true;
-  showDialog.value = true;
-  isDisatext.value = true;
-  hiddentext.value = true;
-  formData.value = { ...row };
-}
-
-/** 取消按钮 */
-function cancel() {
-  showDialog.value = false;
-  resetForm();
-}
-function change(val) {
-  console.log(val, 'val');
-  queryParams.value.sampleYear = val;
-}
-onMounted(() => {
-  queryParams.value.sampleYear = paramsData?.examineYear || '';
-  getDataList();
-  getSelData();
-  Dbsszconfiguration();
-  information();
-});
-</script>
-<style scoped lang="scss"></style>
diff --git a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/tableDalgo.vue b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/tableDalgo.vue
deleted file mode 100644
index 7a01aeb..0000000
--- a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/tableDalgo.vue
+++ /dev/null
@@ -1,155 +0,0 @@
-<template>
-  <div class="water-analysis-page">
-    <div class="top">
-      <el-form label-width="auto" :rules="projectEstimateRules" inline ref="ruleForm" :model="FormList" :disabled="typeList.type == 1">
-        <div v-for="i in typeList.monitorDynamicTableTitleList" style="display: flex; flex-direction: column">
-          <el-form-item
-            v-if="i.key == 'real' || i.key == 'target'"
-            v-for="k in i.titleGroup"
-            :label="i.key == 'real' ? '实际' + k.value + ':' : '目标' + k.value + ':'"
-            :prop="k.key"
-            :disabled="typeList.type == 1 || typeList.type == 2"
-          >
-            <el-input
-              :disabled="i.key != 'real'"
-              v-model="FormList[k.key]"
-              :placeholder="k.placeholder"
-              @change="ChangeClick(k.key, FormList[k.key])"
-            >
-            </el-input>
-          </el-form-item>
-          <el-form-item v-else :label="i.value + ':'" :prop="i.key" :disabled="typeList.type == 1 || typeList.type == 2">
-            <el-upload
-              v-if="i.key == 'attachFileList'"
-              v-model:file-list="fileList1"
-              class="upload-demo"
-              action="/system/upload"
-              :headers="uploadHeader"
-              multiple
-              :on-preview="handlePreview"
-              :before-remove="beforeRemove"
-              style="width: 100vh"
-            >
-              <el-button type="primary">选择文件</el-button>
-            </el-upload>
-            <div
-              v-else-if="i.key == 'standardFlag' && typeList.iSstandardFlag"
-              :style="{ color: typeList.iSstandardFlag ? '#108ee9' : 'red' }"
-            >
-              {{ typeList.iSstandardFlag ? '达标' : '未达标' }}
-            </div>
-            <div
-              v-else-if="i.key == 'standardFlag' && !typeList.iSstandardFlag"
-              :style="{ color: IsStandFlag1 > 0 && IsStandFlag2 > 0 ? '#108ee9' : 'red' }"
-            >
-              <span v-show="false">{{ IsStandFlag1 > 0 && IsStandFlag2 > 0 ? (IsStandText = 1) : (IsStandText = 0) }}</span>
-              {{ IsStandFlag1 > 0 && IsStandFlag2 > 0 ? '达标' : '未达标' }}
-            </div>
-            <div v-else>
-              {{ FormList[i.key] }}
-            </div>
-          </el-form-item>
-        </div>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script setup>
-import { projectInfoEdit } from '@/api/spongePerformance/prevention';
-import { getToken } from '@/utils/auth';
-import { projectEstimateRules } from '@/utils/rules';
-import { ElMessage, ElMessageBox } from 'element-plus';
-const { proxy } = getCurrentInstance();
-const { fund_source } = proxy.useDict('fund_source');
-const uploadHeader = ref({
-  Authorization: 'Bearer ' + getToken(),
-});
-const { typeList } = defineProps(['typeList']);
-const emits = defineEmits();
-defineExpose({ submit, closed, resetFiled });
-const IsStandFlag1 = ref(0);
-const IsStandFlag2 = ref(0);
-const IsStandText = ref('');
-let FormList = ref({ projectNo: '', fileSaveRequestList: [] });
-function ChangeClick(v, m) {
-  console.log('v', v);
-  console.log('m', m);
-  typeList.iSstandardFlag = null;
-  if (v == 'realCXQ') {
-    console.log('object1', m * 1 - FormList.value.targetCXQ * 1);
-    IsStandFlag1.value = m * 1 - FormList.value.targetCXQ * 1;
-  } else {
-    console.log('object2', m * 1 - FormList.value.targetDBMJZJCQMJ * 1);
-    IsStandFlag2.value = m * 1 - FormList.value.targetCXQ * 1;
-  }
-}
-const fileList1 = ref([]);
-function handlePreview(file) {
-  return ElMessageBox.confirm(`下载此文件: ${file.name}？`).then(
-    () => window.open(file.url),
-    () => false
-  );
-}
-function beforeRemove(file) {
-  return true;
-}
-function submit() {
-  proxy.$refs.ruleForm.validate(valid => {
-    if (valid) {
-      const fileSaveRequestList = [];
-      fileList1.value.forEach(element => {
-        if (element.hasOwnProperty('response')) {
-          element.response.data.refType = 'proProjectBudget';
-          fileSaveRequestList.push(element.response.data);
-        } else {
-          fileSaveRequestList.push(element);
-        }
-      });
-      const itemUpdateFieldRequestList = [
-        { id: typeList.data['CXQ-id'], realValue: FormList.value.realCXQ, standardFlag: IsStandFlag1.value > 0 ? 1 : 0 },
-        {
-          id: typeList.data['DBMJZJCQMJ-id' || 0],
-          realValue: FormList.value.realDBMJZJCQMJ,
-          standardFlag: IsStandFlag2.value > 0 ? 1 : 0,
-        },
-      ];
-      FormList.value = {
-        itemDataType: typeList.itemDataType,
-        standardFlag: typeList.iSstandardFlag || IsStandText.value,
-        itemUpdateFieldRequestList,
-        fileSaveRequestList,
-        performanceEvaluateId: typeList.data.performanceEvaluateId,
-      };
-      console.log('FormList.value', FormList.value);
-      projectInfoEdit(FormList.value).then(({ code }) => {
-        if (code == 200) {
-          emits('onModalClose');
-        }
-      });
-    }
-    // }
-  });
-}
-function loadProjerctListData() {
-  console.log('typeListtypeList', typeList);
-  FormList.value = typeList.data;
-  fileList1.value = typeList.fileList1;
-  proxy.$refs.ruleForm.resetFields();
-}
-function resetFiled() {
-  proxy.$refs.ruleForm.resetFields();
-  fileList1.value = [];
-}
-
-function closed() {
-  emits('onModalClose');
-}
-onMounted(() => {
-  loadProjerctListData();
-});
-</script>
-<style lang="scss" scoped>
-.water-analysis-page {
-  padding: 20px;
-}
-</style>
diff --git a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/todoDon.vue b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/todoDon.vue
deleted file mode 100644
index b3e573b..0000000
--- a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/todoDon.vue
+++ /dev/null
@@ -1,156 +0,0 @@
-<template>
-  <div class="water-analysis-page">
-    <el-table :key="isFlag" :data="tableData" max-height="500" v-loading="tableLoading">
-      <el-table-column type="index" width="55" label="序号" />
-      <el-table-column :label="i.value" :prop="i.key" show-overflow-tooltip v-for="i in cloums">
-        <el-table-column v-for="item in i.titleGroup" :label="item.value" :prop="item.key" width="200"> </el-table-column>
-        <template #default="{ row }" v-if="i.key == 'standardFlag'">
-          <span :style="{ color: isDb(row.realCXQ, row.targetCXQ, row.realDBMJZJCQMJ, row.targetDBMJZJCQMJ) ? '#108ee9' : 'red' }">
-            <el-tag :type="isDb(row.realCXQ, row.targetCXQ, row.realDBMJZJCQMJ, row.targetDBMJZJCQMJ) ? 'success' : 'error'">{{
-              isDb(row.realCXQ, row.targetCXQ, row.realDBMJZJCQMJ, row.targetDBMJZJCQMJ) ? '达标' : '未达标'
-            }}</el-tag>
-          </span>
-        </template>
-        <template #default="{ row }" v-if="i.key == 'attachFileList'">
-          <span style="color: #108ee9" v-for="i in row?.attachFileList" @click="handlePreview(i)">{{ i.name }} </span>
-        </template>
-        <template #default="{ row }" v-if="i.key == 'year'">
-          {{ row.year }}
-        </template>
-        <template #default="{ row }" v-if="i.key == 'updateBy'">
-          {{ row.updateBy }}
-        </template>
-        <template #default="{ row }" v-if="i.key == 'updateTime'">
-          {{ row.updateTime }}
-        </template>
-      </el-table-column>
-      <el-table-column label="操作" width="250">
-        <template #default="{ row }">
-          <el-button link type="primary" icon="View" @click="onCheck(row, 1, '详情')">详情</el-button>
-          <el-button link icon="Edit" type="warning" @click="onCheck(row, 2, '修改')">修改</el-button>
-          <el-button link icon="Delete" type="danger" @click="onCheck(row, 3)">删除</el-button>
-        </template>
-      </el-table-column>
-    </el-table>
-  </div>
-  <pagination
-    v-show="totals > 0"
-    :total="totals"
-    v-model:page="FormList.pageNum"
-    v-model:limit="FormList.pageSize"
-    @pagination="dynamic_page_data_typeM(FormList)"
-  />
-  <el-dialog
-    v-model="visible"
-    :title="'内涝防治标准' + FormList.title"
-    :modal-append-to-body="false"
-    :close-on-click-modal="false"
-    width="51%"
-  >
-    <tableDalgo ref="tableDalgoRef" v-if="visible" @onModalClose="onModalClose" :typeList="typeList" :key="isFlag"> </tableDalgo>
-    <template #footer>
-      <div class="dialog-footer">
-        <el-button v-show="typeList.type == '2'" @click="open2" type="primary">保存</el-button>
-        <el-button @click="visible = false">关闭</el-button>
-      </div>
-    </template>
-  </el-dialog>
-</template>
-<script setup>
-import { projectInfoDelete, dynamic_page_data_type } from '@/api/spongePerformance/prevention';
-import { FileSystemList } from '@/api/project/tenderReview';
-import tableDalgo from './tableDalgo.vue';
-import { ElMessage, ElMessageBox } from 'element-plus';
-const { proxy } = getCurrentInstance();
-import { reactive } from 'vue';
-let visible = ref(false);
-let isFlag = ref(1);
-const cloums = ref([]);
-const tableDalgoRef = ref();
-const { params } = defineProps(['params']);
-const FormList = ref({
-  pageNum: 1,
-  pageSize: 10,
-  title: '',
-});
-const totals = ref(0);
-//动态组件
-let dataForm = reactive({
-  tableData: '',
-  tableDateTwo: '',
-  tableLoading: true,
-});
-let { date, tableData, tableDateTwo, tableLoading } = toRefs(dataForm);
-//获取列表数据
-//搜索
-const search = p => {
-  FormList.value.pageNum = 1;
-  dynamic_page_data_typeM(p);
-  isFlag.value++;
-};
-defineExpose({ search });
-// 查看上报数据
-let typeList = ref({});
-const onCheck = (row, ty, t) => {
-  FormList.value.title = t;
-  if (ty == 1 || ty == 2) {
-    typeList.value = {
-      ...params,
-      data: row,
-      type: ty,
-      monitorDynamicTableTitleList: cloums.value,
-      iSstandardFlag: isDb(row.realCXQ, row.targetCXQ, row.realDBMJZJCQMJ, row.targetDBMJZJCQMJ),
-    };
-    FileSystemList({
-      refId: row.performanceEvaluateId,
-      refType: 'proProjectBudget',
-    }).then(({ data }) => {
-      typeList.value.fileList1 = data;
-      visible.value = true;
-    });
-    // 获取文件列表
-  } else if (ty == 3) {
-    proxy.$modal
-      .confirm(`是否确认删除?`)
-      .then(async () => {
-        projectInfoDeleteM(row.performanceEvaluateId);
-        getTableData();
-      })
-      .catch(() => {});
-  }
-};
-//删除
-const projectInfoDeleteM = async id => {
-  let { code } = await projectInfoDelete(id);
-  search(p);
-};
-const dynamic_page_data_typeM = async id => {
-  let { code, data, monitorDynamicTableTitleList, total } = await dynamic_page_data_type(id);
-  tableData.value = data;
-  totals.value = total;
-  cloums.value = monitorDynamicTableTitleList;
-  tableLoading.value = false;
-};
-function onModalClose() {
-  visible.value = false;
-  // dynamic_page_data_typeM();
-  dynamic_page_data_typeM(params);
-}
-
-function open2() {
-  tableDalgoRef.value.submit();
-}
-function handlePreview(file) {
-  return ElMessageBox.confirm(`下载此文件: ${file.name}？`).then(
-    () => window.open(file.url),
-    () => false
-  );
-}
-function isDb(v, m, n, f) {
-  return v * 1 - m * 1 > 0 && n * 1 - f * 1 > 0;
-}
-onMounted(() => {
-  dynamic_page_data_typeM(params);
-});
-</script>
-<style lang="scss" scoped></style>

diff --git a/src/views/sponeScreen/Echarts/echartBar3D.vue b/src/views/sponeScreen/Echarts/echartBar3D.vue
index 3d23886..038626c 100644
--- a/src/views/sponeScreen/Echarts/echartBar3D.vue
+++ b/src/views/sponeScreen/Echarts/echartBar3D.vue
@@ -65,14 +65,14 @@
             lineStyle: {
               color: '#384267',
             },
-            show: true,
+            show: false,
           },
           splitLine: {
             show: false,
           },
           axisLine: {
             lineStyle: {
-              color: '#384267',
+              color: '#005CBA',
               width: 1,
               type: 'dashed',
             },
@@ -91,7 +91,7 @@
               color: '#005CBA',
               width: 1,
             },
-            show: true,
+            show: false,
           },
           splitLine: {
             show: true,
@@ -214,7 +214,9 @@
     );
 
     onMounted(() => {
-      init();
+      setTimeout(() => {
+        init();
+      }, 0);
       window.addEventListener('resize', resizeTheChart);
     });
     return {
diff --git a/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue b/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
index 37c3002..3075239 100644
--- a/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
+++ b/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
@@ -1 +1,65 @@
-<template><div>年径流污染削减率管理信息</div></template>
+<template>
+  <!-- 年径流污染削减率 -->
+  <div class="publicContainer">
+    <!-- gis地图 -->
+    <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
+
+    <!-- 海绵设施监测详情 -->
+    <el-dialog v-model="dialogShow" title="海绵设施监测点位详情" :modal-append-to-body="false" width="600px">
+      <el-form :inline="true">
+        <el-form-item label="日期" prop="date">
+          <el-date-picker type="daterange" v-model="dateSearch" value-format="YYYY-MM-DD" placeholder="请选择"></el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+        </el-form-item>
+      </el-form>
+      <div id="chartHMXJ" style="width: 100%; height: 300px"></div>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import MapBox from '@/views/gisMapPage/gisMapBox1'; //gis地图
+import optionChart from './chartOption.js';
+
+const { proxy } = getCurrentInstance();
+const dialogShow = ref(true);
+const charts = ref(null);
+const dateSearch = ref([proxy.moment(new Date()).subtract(60, 'days').format('YYYY-MM-DD'), proxy.moment().format('YYYY-MM-DD')]);
+
+// 历史数据搜索
+function handleQuery() {
+  setTimeout(() => {
+    initChart();
+  });
+}
+
+// echarts初始化
+function initChart() {
+  charts.value && charts.value.dispose();
+  charts.value = proxy.echarts.init(document.getElementById('chartHMXJ'));
+  optionChart.option.xAxis.data = ['2024-06-12 00:00:00', '2024-06-12 00:10:00', '2024-06-12 00:20:00'];
+  optionChart.option.yAxis[1].name = 'SS(mg/L)';
+  optionChart.option.series[0].data = [12, 9, 20]; //降雨量
+  optionChart.option.series[1].name = '进口SS';
+  optionChart.option.series[1].data = [230, 190, 132]; //进口SS
+  optionChart.option.series[2].name = '出口SS';
+  optionChart.option.series[2].data = [110, 90, 103]; //出口SS
+  // 设置鼠标滚轮放大缩小展示数据区间
+  optionChart.option.dataZoom = [{ type: 'inside', startValue: optionChart.option.xAxis.data[optionChart.option.xAxis.data.length / 2] }];
+  if (optionChart.option.xAxis.data.length > 0) {
+    optionChart.option.graphic.invisible = true; //暂无数据
+  } else {
+    optionChart.option.graphic.invisible = false; //暂无数据
+  }
+  charts.value.clear();
+  charts.value.setOption(optionChart.option);
+}
+
+onMounted(() => {
+  handleQuery();
+});
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue b/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
index c06a3dc..35608fb 100644
--- a/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
+++ b/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
@@ -1,3 +1,62 @@
 <template>
-  <div>年径流总量控制率管理信息</div>
+  <!-- 年径流总量控制率 -->
+  <div class="publicContainer">
+    <!-- gis地图 -->
+    <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
+
+    <!-- 海绵设施监测详情 -->
+    <el-dialog v-model="dialogShow" title="海绵设施监测点位详情" :modal-append-to-body="false" width="600px">
+      <el-form :inline="true">
+        <el-form-item label="日期" prop="date">
+          <el-date-picker type="daterange" v-model="dateSearch" value-format="YYYY-MM-DD" placeholder="请选择"></el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+        </el-form-item>
+      </el-form>
+      <div id="chartHMJC" style="width: 100%; height: 300px"></div>
+    </el-dialog>
+  </div>
 </template>
+
+<script setup>
+import MapBox from '@/views/gisMapPage/gisMapBox1'; //gis地图
+import optionChart from './chartOption.js';
+
+const { proxy } = getCurrentInstance();
+const dialogShow = ref(true);
+const charts = ref(null);
+const dateSearch = ref([proxy.moment(new Date()).subtract(60, 'days').format('YYYY-MM-DD'), proxy.moment().format('YYYY-MM-DD')]);
+
+// 历史数据搜索
+function handleQuery() {
+  setTimeout(() => {
+    initChart();
+  });
+}
+
+// echarts初始化
+function initChart() {
+  charts.value && charts.value.dispose();
+  charts.value = proxy.echarts.init(document.getElementById('chartHMJC'));
+  optionChart.option.xAxis.data = ['2024-06-12 00:00:00', '2024-06-12 00:10:00', '2024-06-12 00:20:00'];
+  optionChart.option.series[0].data = [12, 9, 20]; //降雨量
+  optionChart.option.series[1].data = [2.3, 1.9, 3.2]; //进口流量
+  optionChart.option.series[2].data = [1.1, 0.9, 1.3]; //出口流量
+  // 设置鼠标滚轮放大缩小展示数据区间
+  optionChart.option.dataZoom = [{ type: 'inside', startValue: optionChart.option.xAxis.data[optionChart.option.xAxis.data.length / 2] }];
+  if (optionChart.option.xAxis.data.length > 0) {
+    optionChart.option.graphic.invisible = true; //暂无数据
+  } else {
+    optionChart.option.graphic.invisible = false; //暂无数据
+  }
+  charts.value.clear();
+  charts.value.setOption(optionChart.option);
+}
+
+onMounted(() => {
+  handleQuery();
+});
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue b/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue
index d49fc2a..b86ad5d 100644
--- a/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue
+++ b/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue
@@ -1,4 +1,5 @@
 <template>
+  <!-- 污水处理厂进水BOD -->
   <div class="publicContainer">
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
       <el-form-item label="统计年份" prop="date">
@@ -13,7 +14,6 @@
 
       <el-form-item>
         <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
-        <el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button>
         <el-button icon="Refresh" @click="resetQuery">重置</el-button>
       </el-form-item>
     </el-form>
@@ -21,23 +21,17 @@
     <!-- 表格 -->
     <el-table :data="dataList" v-loading="loading" stripe :max-height="580">
       <el-table-column type="index" width="55" label="序号" />
-      <el-table-column label="统计年份" prop="q" />
       <el-table-column label="日期" prop="w" />
-      <el-table-column label="进水BOD平均浓度（mg/L）">
+      <el-table-column label="进水BOD平均浓度(mg/L)">
         <el-table-column prop="monthPlan1" label="西区污水处理厂" />
         <el-table-column prop="monthPlan2" label="东区污水处理厂" />
-        <el-table-column prop="monthPlan3" label="马家河污水厂" />
+        <el-table-column prop="monthPlan3" label="马家河污水处理厂" />
+        <el-table-column prop="monthPlan4" label="包公湖污水处理厂" />
+        <el-table-column prop="monthPlan5" label="祥符区污水处理厂" />
       </el-table-column>
       <el-table-column label="均值" prop="p" />
       <el-table-column label="年度绩效指标" prop="a" />
-      <el-table-column label="评价结论" prop="a" />
-      <el-table-column label="操作" width="240">
-        <template #default="scope">
-          <el-button link icon="View" type="primary" @click="handleDetail(scope.row, 'view')">查看</el-button>
-          <el-button link type="warning" icon="Edit" @click="handleUpdate(scope.row, 'view')">修改</el-button>
-          <el-button link type="danger" icon="Delete" @click="handleDelete(scope.row, 'view')">删除</el-button>
-        </template>
-      </el-table-column>
+      <el-table-column label="年度达标情况" prop="b" />
     </el-table>
     <!-- 分页 -->
     <pagination
@@ -47,117 +41,23 @@
       v-model:limit="queryParams.pageSize"
       @pagination="getList"
     />
-    <!-- 新增弹窗 -->
-    <el-dialog :title="title" v-model="open" width="800px" append-to-body :close-on-click-modal="false">
-      <el-form ref="roleRef" :model="form" :rules="rules" label-width="130px" :disabled="multiple">
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="统计年份:" prop="w">
-              <el-date-picker
-                type="year"
-                v-model="queryParams.date"
-                value-format="YYYY"
-                placeholder="请选择统计年份"
-                style="width: 100%"
-              ></el-date-picker>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="日期:" prop="w">
-              <el-date-picker
-                type="month"
-                v-model="queryParams.date"
-                value-format="YYYY-MM"
-                placeholder="请选择日期"
-                style="width: 100%"
-              ></el-date-picker>
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="西区污水处理厂:" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入西区污水处理厂" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="东区污水处理厂:" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入东区污水处理厂" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="马家河污水厂:" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入马家河污水厂" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="均值:" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入均值" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="年度绩效指标" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入年度绩效指标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="评价结论" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入评价结论标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-      </el-form>
-      <template #footer>
-        <div class="dialog-footer">
-          <el-button type="primary" @click="submitForm">确 定</el-button>
-          <el-button @click="cancel">取 消</el-button>
-        </div>
-      </template>
-    </el-dialog>
   </div>
 </template>
 <script setup name="WaterSupplyWaterPlants">
 const { proxy } = getCurrentInstance();
-const open = ref(false);
-const multiple = ref(false);
 const showSearch = ref(true);
-const Xcfrequency = ref([
-  {
-    value: 'tian',
-    label: '天',
-  },
-  {
-    value: 'zhou',
-    label: '周',
-  },
-]);
 const loading = ref(true);
 const total = ref(0);
-const title = ref('');
 const dataList = ref([]);
 const AllData = reactive({
   id: '',
-  form: {},
   queryParams: {
     pageNum: 1,
     pageSize: 10,
-    caseType: 1,
-    handleStatus: '',
-    searchContent: '',
-  },
-  rules: {
-    id: [{ required: true, message: '请输入', trigger: 'blur' }],
-    eventDescription: [{ required: true, message: '请输入', trigger: 'blur' }],
+    date: null,
   },
 });
-const { queryParams, form, rules } = toRefs(AllData);
+const { queryParams } = toRefs(AllData);
 //搜索
 function handleQuery() {
   getList();
@@ -167,39 +67,6 @@
   proxy.resetForm('queryRef');
   handleQuery();
 }
-// 新增
-function handleAdd() {
-  title.value = '新增水厂供水';
-  open.value = true;
-  form.value = {};
-  multiple.value = false;
-  form.value.fileTag = Xcfrequency.value[0].value;
-}
-// 新增中取消事件
-function cancel() {
-  open.value = false;
-  proxy.resetForm('roleRef');
-}
-
-// 巡查频率下拉框点击事件
-function changeStation(value) {
-  // console.log(value, 'value');
-}
-
-//查看详情操作
-function handleDetail(row) {
-  open.value = true;
-  title.value = '查看水厂供水';
-  multiple.value = true;
-  form.value = row;
-}
-// 修改按钮操作
-function handleUpdate(row) {
-  open.value = true;
-  title.value = '修改水厂供水';
-  multiple.value = false;
-  form.value = { ...row };
-}
 
 /** 查询列表 */
 const getList = async () => {
@@ -211,12 +78,4 @@
   getList();
 });
 </script>
-<style scoped lang="scss">
-.dituclass {
-  width: 100%;
-  height: 300px;
-  // background: red;
-  margin-bottom: 10px;
-  border: 1px solid #004565;
-}
-</style>
+<style scoped lang="scss"></style>
diff --git a/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue b/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue
index 6ce3f37..94c365b 100644
--- a/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue
+++ b/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue
@@ -1,34 +1,31 @@
 <template>
+  <!-- 城市生活污水集中收集率 -->
   <div class="publicContainer">
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
-      <el-form-item label="污水厂名称:" prop="searchContent">
-        <el-input v-model="queryParams.searchContent" placeholder="请输入污水厂名称" clearable style="width: 180px" />
-      </el-form-item>
       <el-form-item label="统计年份" prop="date">
         <el-date-picker type="year" v-model="queryParams.date" value-format="YYYY" placeholder="请选择统计年份"></el-date-picker>
       </el-form-item>
 
       <el-form-item>
         <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
-        <el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button>
         <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+        <el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button>
       </el-form-item>
     </el-form>
 
     <!-- 表格 -->
     <el-table :data="dataList" v-loading="loading" stripe :max-height="580">
       <el-table-column type="index" width="55" label="序号" />
-      <el-table-column label="污水厂名称" prop="q" />
-      <el-table-column label="编码" prop="w" />
       <el-table-column label="统计年份" prop="o" />
-      <el-table-column label="年度绩效指标" prop="p" />
+      <el-table-column label="污水厂名称" prop="q" />
       <el-table-column label="累计处理水量(万t)" prop="e" />
       <el-table-column label="进水BOD平均浓度(mg/L)" prop="r" />
       <el-table-column label="BOD 削减量(g)" prop="t" />
       <el-table-column label="城区用水人口(万人)" prop="y" />
       <el-table-column label="人均日生活污染排放量(g/人·d)" prop="u" />
-      <el-table-column label="城市生活污水集中收集率(%)" prop="i" />
-      <el-table-column label="评价结论" prop="a" />
+      <el-table-column label="目标收集率(%)" prop="p" />
+      <el-table-column label="实际收集率(%)" prop="i" />
+      <el-table-column label="达标情况" prop="a" />
       <el-table-column label="操作" width="240">
         <template #default="scope">
           <el-button link icon="View" type="primary" @click="handleDetail(scope.row, 'view')">查看</el-button>
@@ -46,93 +43,46 @@
       @pagination="getList"
     />
     <!-- 新增弹窗 -->
-    <el-dialog :title="title" v-model="open" width="1100px" append-to-body :close-on-click-modal="false">
+    <el-dialog :title="title" v-model="open" width="600px" append-to-body :close-on-click-modal="false">
       <el-form ref="roleRef" :model="form" :rules="rules" label-width="220px" :disabled="multiple">
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="污水厂名称:" prop="w">
-              <el-input v-model="form.w" placeholder="请输入污水厂名称" clearable style="width: 100%" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="编码:" prop="w">
-              <el-input v-model="form.w" placeholder="请输入编码" clearable style="width: 100%" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="累计处理水量(万t):" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入累计处理水量(万t)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="进水BOD平均浓度(mg/L):" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入进水BOD平均浓度(mg/L)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="BOD 削减量(g):" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入BOD 削减量(g)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="城区用水人口(万人):" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入城区用水人口(万人)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="人均日生活污染排放量(g/人·d):" prop="lon">
-              <el-input-number
-                v-model="form.lon"
-                placeholder="请输入人均日生活污染排放量(g/人·d)"
-                style="width: 100%"
-                controls-position="right"
-              />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="城市生活污水集中收集率(%):" prop="lat">
-              <el-input-number
-                v-model="form.lat"
-                placeholder="请输入城市生活污水集中收集率(%)"
-                style="width: 100%"
-                controls-position="right"
-              />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="统计年份" prop="date">
-              <el-date-picker
-                type="year"
-                v-model="queryParams.date"
-                value-format="YYYY"
-                placeholder="请选择统计年份"
-                style="width: 100%"
-              ></el-date-picker>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="年度绩效指标" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入年度绩效指标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="评价结论" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入评价结论标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-        </el-row>
+        <el-form-item label="统计年份" prop="date">
+          <el-date-picker
+            type="year"
+            v-model="queryParams.date"
+            value-format="YYYY"
+            placeholder="请选择统计年份"
+            style="width: 100%"
+          ></el-date-picker>
+        </el-form-item>
+        <el-form-item label="污水厂名称:" prop="w">
+          <el-input v-model="form.w" placeholder="请输入污水厂名称" clearable style="width: 100%" />
+        </el-form-item>
+        <el-form-item label="累计处理水量(万t):" prop="lon">
+          <el-input-number v-model="form.lon" placeholder="请输入累计处理水量(万t)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="进水BOD平均浓度(mg/L):" prop="lat">
+          <el-input-number v-model="form.lat" placeholder="请输入进水BOD平均浓度(mg/L)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="BOD 削减量(g):" prop="lon">
+          <el-input-number v-model="form.lon" placeholder="请输入BOD 削减量(g)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="城区用水人口(万人):" prop="lat">
+          <el-input-number v-model="form.lat" placeholder="请输入城区用水人口(万人)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="人均日生活污染排放量(g/人·d):" prop="lon">
+          <el-input-number
+            v-model="form.lon"
+            placeholder="请输入人均日生活污染排放量(g/人·d)"
+            style="width: 100%"
+            controls-position="right"
+          />
+        </el-form-item>
+        <el-form-item label="目标收集率(%):" prop="date">
+          <el-input-number v-model="form.lon" placeholder="请输入目标收集率" style="width: 100%" />
+        </el-form-item>
+        <el-form-item label="实际收集率(%):" prop="lat">
+          <el-input-number v-model="form.lat" placeholder="请输入实际收集率(%)" style="width: 100%" controls-position="right" />
+        </el-form-item>
       </el-form>
       <template #footer>
         <div class="dialog-footer">
@@ -170,7 +120,6 @@
     pageSize: 10,
     caseType: 1,
     handleStatus: '',
-    searchContent: '',
   },
   rules: {
     id: [{ required: true, message: '请输入', trigger: 'blur' }],
diff --git a/src/views/spongePerformance/OutputPerformance/chartOption.js b/src/views/spongePerformance/OutputPerformance/chartOption.js
new file mode 100644
index 0000000..c0e300f
--- /dev/null
+++ b/src/views/spongePerformance/OutputPerformance/chartOption.js
@@ -0,0 +1,137 @@
+import useUserStore from '@/store/modules/user';
+import * as echarts from 'echarts';
+const pinias = useUserStore();
+
+let optionChart = {
+  // 柱状图+折线图
+  option: {
+    color: pinias.$state.chartColor,
+    // 显示暂无数据
+    graphic: {
+      type: 'text', // 类型：文本
+      left: 'center',
+      top: 'middle',
+      silent: true, // 不响应事件
+      invisible: false, // 有数据就隐藏
+      style: {
+        fill: '#c6c6c6',
+        fontWeight: 'bold',
+        text: '暂无数据',
+        fontFamily: 'Microsoft YaHei',
+        fontSize: '18px',
+      },
+    },
+    tooltip: {
+      trigger: 'axis',
+      confine: true, //是否将 tooltip 框限制在图表的区域内
+    },
+    title: {
+      left: 'left',
+      text: '',
+      top: 10,
+      bottom: 10,
+      left: 10,
+      textStyle: {
+        color: '#545E75', //字体颜色
+        fontSize: 16, //字体大小
+      },
+    },
+    grid: {
+      left: '3%',
+      right: '5%',
+      top: '20%',
+      bottom: '3%',
+      containLabel: true,
+    },
+    legend: {
+      top: '2%',
+      orient: 'horizontal', //horizontal
+      left: 'center', //left ,center
+      textStyle: {
+        color: 'inherit',
+      },
+    },
+    xAxis: {
+      type: 'category',
+      position: 'bottom',
+      data: ['2023', '2024', '2025'],
+      axisLabel: {
+        color: '#c6c6c6',
+      },
+      axisLine: {
+        lineStyle: {
+          color: '#066592',
+        },
+      },
+    },
+    yAxis: [
+      {
+        name: '降雨量(mm)',
+        type: 'value',
+        inverse: true, //翻转
+        nameLocation: 'start', // 坐标轴名称显示位置
+        nameGap: 15, // 坐标轴名称与轴线之间的距离
+        nameTextStyle: {
+          color: '#c6c6c6', //字体颜色
+          fontSize: 12, //字体大小
+          align: 'center', // 文字水平对齐方式，默认自动（'left'，'center'，'right'）
+        },
+        splitLine: {
+          lineStyle: {
+            type: 'dashed',
+            color: '#066592',
+          },
+        },
+        axisLabel: {
+          color: '#c6c6c6',
+        },
+      },
+      {
+        name: '流量(m³/h)',
+        type: 'value',
+        nameLocation: 'end', // 坐标轴名称显示位置
+        nameGap: 15, // 坐标轴名称与轴线之间的距离
+        nameTextStyle: {
+          color: '#c6c6c6', //字体颜色
+          fontSize: 12, //字体大小
+          align: 'center', // 文字水平对齐方式，默认自动（'left'，'center'，'right'）
+        },
+        axisLabel: {
+          color: '#c6c6c6',
+        },
+        splitLine: {
+          lineStyle: {
+            type: 'dashed',
+            color: '#066592',
+          },
+        },
+      },
+    ],
+    series: [
+      {
+        name: '降雨量',
+        type: 'bar',
+        barWidth: 10,
+        yAxisIndex: 0,
+        data: [24, 12, 9],
+      },
+      {
+        name: '进口流量',
+        type: 'line',
+        smooth: true,
+        yAxisIndex: 1,
+        symbolSize: 8,
+        data: [14, 8, 5],
+      },
+      {
+        name: '出口流量',
+        type: 'line',
+        smooth: true,
+        yAxisIndex: 1,
+        symbolSize: 8,
+        data: [4, 2, 1],
+      },
+    ],
+  },
+};
+export default optionChart;
diff --git a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/index.vue b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/index.vue
deleted file mode 100644
index bc19015..0000000
--- a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/index.vue
+++ /dev/null
@@ -1,367 +0,0 @@
-<template>
-  <!-- 地表水体水质达标 -->
-  <div class="publicContainer" v-if="back">
-    <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
-      <el-form-item label="考核水体:" prop="riverId">
-        <el-select clearable v-model="queryParams.riverId" class="m-2" placeholder="请选择" size="mini">
-          <el-option v-for="item in responseAA" :key="item.id" :label="item.riverName" :value="Number(item.id)" />
-        </el-select>
-      </el-form-item>
-
-      <el-form-item label="采样年份:" prop="sampleYear">
-        <el-date-picker
-          v-model="queryParams.sampleYear"
-          type="year"
-          placeholder="请选择"
-          format="YYYY"
-          value-format="YYYY"
-          @change="change"
-        />
-      </el-form-item>
-
-      <el-form-item label="评价结果:" prop="blackOdor">
-        <el-select clearable v-model="queryParams.blackOdor" class="m-2" placeholder="请选择" size="mini">
-          <el-option v-for="item in black_odor_level" :key="item.value" :label="item.label" :value="item.value" />
-        </el-select>
-      </el-form-item>
-      <el-form-item>
-        <el-button type="primary" icon="Search" @click="searchData">搜索</el-button>
-        <el-button icon="Refresh" @click="resetData">重置</el-button>
-        <el-button icon="CaretLeft" @click="resect" class="zbBtn"> 返回</el-button>
-        <el-button icon="Plus" type="success" @click="addData">新增</el-button>
-      </el-form-item>
-    </el-form>
-    <!-- 表格 -->
-    <el-table :data="tableData" v-loading="tableLoading" :max-height="650">
-      <el-table-column type="index" width="55" label="序号" />
-      <el-table-column v-for="item in informationDate" :label="item.value" :prop="item.key">
-        <template #default="scope" v-if="item.key == 'blackOdorName'">
-          <span
-            :style="{
-              color:
-                scope.row.blackOdorName == '无黑臭'
-                  ? 'greenyellow'
-                  : scope.row.blackOdorName == '轻度黑臭'
-                  ? ' #419fff'
-                  : scope.row.blackOdorName == '中度黑臭'
-                  ? 'orange'
-                  : scope.row.blackOdorName == '重度黑臭'
-                  ? 'red'
-                  : '',
-            }"
-          >
-            {{
-              scope.row.blackOdorName == '无黑臭'
-                ? '无黑臭'
-                : scope.row.blackOdorName == '轻度黑臭'
-                ? '轻度黑臭'
-                : scope.row.blackOdorName == '中度黑臭'
-                ? '中度黑臭'
-                : scope.row.blackOdorName == '重度黑臭'
-                ? '重度黑臭'
-                : ''
-            }}
-          </span>
-        </template>
-      </el-table-column>
-      <el-table-column label="操作" show-overflow-tooltip width="200">
-        <template #default="{ row }">
-          <el-button type="primary" link @click="checkDetail(row)">详情</el-button>
-          <el-button type="primary" link @click="editData(row)">修改</el-button>
-          <el-button type="danger" link @click="deleteData(row)">删除</el-button>
-        </template>
-      </el-table-column>
-    </el-table>
-    <!-- 分页 -->
-    <pagination
-      v-show="total > 0"
-      :total="total"
-      v-model:page="queryParams.pageNum"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getDataList"
-    />
-    <!-- 添加 修改 查看彈框 -->
-    <el-dialog :title="dialogTitle" v-model="showDialog" width="70%" :close-on-click-modal="false">
-      <el-form ref="ruleForm" :model="formData" :rules="formRules" label-width="auto" :disabled="isDisab">
-        <el-row>
-          <el-form-item label="考核水体:" prop="riverId" style="width: 45%">
-            <el-select clearable v-model="formData.riverId" class="m-2" placeholder="请选择" size="mini" style="width: 100%">
-              <el-option v-for="item in responseAA" :key="item.id" :label="item.riverName" :value="Number(item.id)" />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="采样时间:" prop="sampleTime" style="width: 45%">
-            <el-date-picker
-              style="width: 100%"
-              clearable
-              format="YYYY-MM-DD"
-              value-format="YYYY-MM-DD"
-              v-model="formData.sampleTime"
-              type="date"
-            />
-          </el-form-item>
-          <el-form-item label="采样点:" prop="sampleLocation" style="width: 45%">
-            <el-input v-model="formData.sampleLocation" placeholder="请输入" style="width: 100%" clearable />
-          </el-form-item>
-
-          <el-form-item v-for="item in Dbssz" :label="item.sampleFactorName" :prop="item.sampleFactor" style="width: 45%">
-            <el-input-number
-              v-model="formData[item.sampleFactor]"
-              placeholder="请输入"
-              clearable
-              controls-position="right"
-              style="width: 400px"
-            />
-          </el-form-item>
-
-          <el-form-item label="黑臭程度:" prop="blackOdorName" style="width: 45%" v-if="hiddentext">
-            <div
-              :style="{
-                color:
-                  formData.blackOdorName == '无黑臭'
-                    ? 'greenyellow'
-                    : formData.blackOdorName == '轻度黑臭'
-                    ? ' #419fff'
-                    : formData.blackOdorName == '中度黑臭'
-                    ? 'orange'
-                    : formData.blackOdorName == '重度黑臭'
-                    ? 'red'
-                    : '',
-              }"
-            >
-              {{
-                formData.blackOdorName == '无黑臭'
-                  ? '无黑臭'
-                  : formData.blackOdorName == '轻度黑臭'
-                  ? '轻度黑臭'
-                  : formData.blackOdorName == '中度黑臭'
-                  ? '中度黑臭'
-                  : formData.blackOdorName == '重度黑臭'
-                  ? '重度黑臭'
-                  : ''
-              }}
-            </div>
-          </el-form-item>
-        </el-row>
-      </el-form>
-      <template #footer>
-        <div class="dialog-footer">
-          <el-button type="primary" @click="submitForm" v-show="!isDisab">保 存</el-button>
-          <el-button @click="cancel">关闭</el-button>
-        </div>
-      </template>
-    </el-dialog>
-  </div>
-  <waterquality v-else />
-</template>
-<script setup>
-import {
-  blackOdorUserId,
-  riverInfoWater,
-  blackOdorAdd,
-  blackOdorDelete,
-  sampleConfigconfiguration,
-  blackOdorinformation,
-  blackOdorpaging,
-  blackOdorEdit,
-} from '@/api/spongePerformance/surfaceWater';
-const { proxy } = getCurrentInstance();
-const { hc_sample_factor, sample_type, black_odor_level } = proxy.useDict('hc_sample_factor', 'sample_type', 'black_odor_level');
-import { defineEmits } from 'vue';
-const isDisab = ref(false);
-const isDisatext = ref(false);
-const showDialog = ref(false);
-const showSearch = ref(true);
-const tableLoading = ref(true);
-const hiddentext = ref(false);
-const back = ref(true);
-const responseAA = ref([]);
-const total = ref(0);
-const dialogTitle = ref('');
-const tableData = ref([]);
-const Dbssz = ref([]);
-const informationDate = ref([]);
-const emits = defineEmits();
-const { paramsData } = defineProps(['paramsData']);
-const AllData = reactive({
-  formData: {
-    configs: [],
-  },
-  queryParams: {
-    pageNum: 1,
-    pageSize: 10,
-    sampleTime: '',
-    riverId: '',
-    blackOdor: '',
-    sampleYear: '',
-    sampleLocation: '',
-  },
-  formRules: {
-    riverId: [{ required: true, message: '请选择', trigger: 'blur' }],
-    sampleTime: [{ required: true, message: '请选择', trigger: 'blur' }],
-  },
-});
-const { queryParams, formData, formRules } = toRefs(AllData);
-
-/** 表单重置 */
-function resetForm() {
-  formData.value = {
-    riverId: undefined,
-    sampleYear: undefined,
-    sampleTime: undefined,
-    blackOdor: undefined,
-    sampleLocation: undefined,
-    riverType: 'black_odor',
-  };
-  proxy.resetForm('ruleForm');
-}
-function resect() {
-  emits('searchClick', 0);
-}
-/** 新增按钮操作 */
-function addData() {
-  resetForm();
-  hiddentext.value = false;
-  isDisab.value = false;
-  showDialog.value = true;
-  dialogTitle.value = '新增检测记录';
-}
-
-//搜索
-function searchData() {
-  queryParams.value.pageNum = 1;
-  getDataList();
-}
-//重置
-function resetData() {
-  proxy.resetForm('queryRef');
-  searchData();
-}
-// 获取下拉框数据
-const getSelData = async () => {
-  let params = {
-    riverType: 'black_odor',
-  };
-  riverInfoWater(params).then(response => {
-    if (response.code == 200) {
-      responseAA.value = response.data;
-    }
-  });
-};
-// 新增中的 动态数据
-const Dbsszconfiguration = async () => {
-  let params = {
-    sampleType: 'hcst',
-  };
-  sampleConfigconfiguration(params).then(response => {
-    if (response.code == 200) {
-      Dbssz.value = response.data;
-      Dbssz.value.forEach(item => {
-        formRules.value[item.sampleFactor] = [{ required: true, message: '请输入', trigger: 'blur', type: 'number' }];
-      });
-      console.log(formRules.value);
-    }
-  });
-};
-//地水质采样信息动态表头
-const information = async () => {
-  blackOdorinformation().then(res => {
-    if (res.code == 200) {
-      informationDate.value = res.data;
-    }
-  });
-};
-
-/** 查询列表 */
-const getDataList = async () => {
-  tableLoading.value = true;
-  const res = await blackOdorpaging(queryParams.value);
-  tableData.value = res.data.records;
-  total.value = res.data.total || 0;
-  tableLoading.value = false;
-};
-/** 新增弹框 修改弹框 提交按钮 */
-async function submitForm() {
-  proxy.$refs['ruleForm'].validate(valid => {
-    if (valid) {
-      formData.value.configs = [];
-      let obj = [];
-      Dbssz.value.forEach(k => {
-        obj.push(k.sampleFactor);
-      });
-      obj.forEach(element => {
-        formData.value.configs.push({
-          factor: element,
-          value: formData.value[element],
-        });
-        delete formData.value[element];
-      });
-      console.log(formData.value, 'formData.value.configs');
-
-      if (formData.value.id != undefined) {
-        blackOdorEdit(formData.value).then(() => {
-          console.log(formData.value, 'formData.value');
-          proxy.$modal.msgSuccess('修改成功');
-          showDialog.value = false;
-          getDataList();
-        });
-      } else {
-        blackOdorAdd(formData.value).then(() => {
-          console.log(formData.value, 'formData.valueformData.valueformData.value');
-          proxy.$modal.msgSuccess('新增成功');
-          showDialog.value = false;
-          getDataList();
-        });
-      }
-    }
-  });
-}
-//表格修改
-function editData(row) {
-  formData.value = { ...row };
-  isDisab.value = false;
-  isDisatext.value = true;
-  showDialog.value = true;
-  dialogTitle.value = '修改检测记录';
-  hiddentext.value = true;
-  console.log(row, 'row');
-}
-// 表格删除
-function deleteData(row) {
-  proxy.$modal
-    .confirm('是否确认删除？')
-    .then(async () => {
-      const res = await blackOdorDelete(row.id);
-      if (res?.code !== 200) return;
-      proxy.$modal.msgSuccess('操作成功！');
-      getDataList();
-    })
-    .catch(() => {});
-}
-//详情按钮
-function checkDetail(row) {
-  dialogTitle.value = '查看检测记录';
-  isDisab.value = true;
-  showDialog.value = true;
-  isDisatext.value = true;
-  hiddentext.value = true;
-  formData.value = { ...row };
-}
-
-/** 取消按钮 */
-function cancel() {
-  showDialog.value = false;
-  resetForm();
-}
-function change(val) {
-  console.log(val, 'val');
-  queryParams.value.sampleYear = val;
-}
-onMounted(() => {
-  queryParams.value.sampleYear = paramsData?.examineYear || '';
-  getDataList();
-  getSelData();
-  Dbsszconfiguration();
-  information();
-});
-</script>
-<style scoped lang="scss"></style>
diff --git a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/tableDalgo.vue b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/tableDalgo.vue
deleted file mode 100644
index 7a01aeb..0000000
--- a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/tableDalgo.vue
+++ /dev/null
@@ -1,155 +0,0 @@
-<template>
-  <div class="water-analysis-page">
-    <div class="top">
-      <el-form label-width="auto" :rules="projectEstimateRules" inline ref="ruleForm" :model="FormList" :disabled="typeList.type == 1">
-        <div v-for="i in typeList.monitorDynamicTableTitleList" style="display: flex; flex-direction: column">
-          <el-form-item
-            v-if="i.key == 'real' || i.key == 'target'"
-            v-for="k in i.titleGroup"
-            :label="i.key == 'real' ? '实际' + k.value + ':' : '目标' + k.value + ':'"
-            :prop="k.key"
-            :disabled="typeList.type == 1 || typeList.type == 2"
-          >
-            <el-input
-              :disabled="i.key != 'real'"
-              v-model="FormList[k.key]"
-              :placeholder="k.placeholder"
-              @change="ChangeClick(k.key, FormList[k.key])"
-            >
-            </el-input>
-          </el-form-item>
-          <el-form-item v-else :label="i.value + ':'" :prop="i.key" :disabled="typeList.type == 1 || typeList.type == 2">
-            <el-upload
-              v-if="i.key == 'attachFileList'"
-              v-model:file-list="fileList1"
-              class="upload-demo"
-              action="/system/upload"
-              :headers="uploadHeader"
-              multiple
-              :on-preview="handlePreview"
-              :before-remove="beforeRemove"
-              style="width: 100vh"
-            >
-              <el-button type="primary">选择文件</el-button>
-            </el-upload>
-            <div
-              v-else-if="i.key == 'standardFlag' && typeList.iSstandardFlag"
-              :style="{ color: typeList.iSstandardFlag ? '#108ee9' : 'red' }"
-            >
-              {{ typeList.iSstandardFlag ? '达标' : '未达标' }}
-            </div>
-            <div
-              v-else-if="i.key == 'standardFlag' && !typeList.iSstandardFlag"
-              :style="{ color: IsStandFlag1 > 0 && IsStandFlag2 > 0 ? '#108ee9' : 'red' }"
-            >
-              <span v-show="false">{{ IsStandFlag1 > 0 && IsStandFlag2 > 0 ? (IsStandText = 1) : (IsStandText = 0) }}</span>
-              {{ IsStandFlag1 > 0 && IsStandFlag2 > 0 ? '达标' : '未达标' }}
-            </div>
-            <div v-else>
-              {{ FormList[i.key] }}
-            </div>
-          </el-form-item>
-        </div>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script setup>
-import { projectInfoEdit } from '@/api/spongePerformance/prevention';
-import { getToken } from '@/utils/auth';
-import { projectEstimateRules } from '@/utils/rules';
-import { ElMessage, ElMessageBox } from 'element-plus';
-const { proxy } = getCurrentInstance();
-const { fund_source } = proxy.useDict('fund_source');
-const uploadHeader = ref({
-  Authorization: 'Bearer ' + getToken(),
-});
-const { typeList } = defineProps(['typeList']);
-const emits = defineEmits();
-defineExpose({ submit, closed, resetFiled });
-const IsStandFlag1 = ref(0);
-const IsStandFlag2 = ref(0);
-const IsStandText = ref('');
-let FormList = ref({ projectNo: '', fileSaveRequestList: [] });
-function ChangeClick(v, m) {
-  console.log('v', v);
-  console.log('m', m);
-  typeList.iSstandardFlag = null;
-  if (v == 'realCXQ') {
-    console.log('object1', m * 1 - FormList.value.targetCXQ * 1);
-    IsStandFlag1.value = m * 1 - FormList.value.targetCXQ * 1;
-  } else {
-    console.log('object2', m * 1 - FormList.value.targetDBMJZJCQMJ * 1);
-    IsStandFlag2.value = m * 1 - FormList.value.targetCXQ * 1;
-  }
-}
-const fileList1 = ref([]);
-function handlePreview(file) {
-  return ElMessageBox.confirm(`下载此文件: ${file.name}？`).then(
-    () => window.open(file.url),
-    () => false
-  );
-}
-function beforeRemove(file) {
-  return true;
-}
-function submit() {
-  proxy.$refs.ruleForm.validate(valid => {
-    if (valid) {
-      const fileSaveRequestList = [];
-      fileList1.value.forEach(element => {
-        if (element.hasOwnProperty('response')) {
-          element.response.data.refType = 'proProjectBudget';
-          fileSaveRequestList.push(element.response.data);
-        } else {
-          fileSaveRequestList.push(element);
-        }
-      });
-      const itemUpdateFieldRequestList = [
-        { id: typeList.data['CXQ-id'], realValue: FormList.value.realCXQ, standardFlag: IsStandFlag1.value > 0 ? 1 : 0 },
-        {
-          id: typeList.data['DBMJZJCQMJ-id' || 0],
-          realValue: FormList.value.realDBMJZJCQMJ,
-          standardFlag: IsStandFlag2.value > 0 ? 1 : 0,
-        },
-      ];
-      FormList.value = {
-        itemDataType: typeList.itemDataType,
-        standardFlag: typeList.iSstandardFlag || IsStandText.value,
-        itemUpdateFieldRequestList,
-        fileSaveRequestList,
-        performanceEvaluateId: typeList.data.performanceEvaluateId,
-      };
-      console.log('FormList.value', FormList.value);
-      projectInfoEdit(FormList.value).then(({ code }) => {
-        if (code == 200) {
-          emits('onModalClose');
-        }
-      });
-    }
-    // }
-  });
-}
-function loadProjerctListData() {
-  console.log('typeListtypeList', typeList);
-  FormList.value = typeList.data;
-  fileList1.value = typeList.fileList1;
-  proxy.$refs.ruleForm.resetFields();
-}
-function resetFiled() {
-  proxy.$refs.ruleForm.resetFields();
-  fileList1.value = [];
-}
-
-function closed() {
-  emits('onModalClose');
-}
-onMounted(() => {
-  loadProjerctListData();
-});
-</script>
-<style lang="scss" scoped>
-.water-analysis-page {
-  padding: 20px;
-}
-</style>
diff --git a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/todoDon.vue b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/todoDon.vue
deleted file mode 100644
index b3e573b..0000000
--- a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/todoDon.vue
+++ /dev/null
@@ -1,156 +0,0 @@
-<template>
-  <div class="water-analysis-page">
-    <el-table :key="isFlag" :data="tableData" max-height="500" v-loading="tableLoading">
-      <el-table-column type="index" width="55" label="序号" />
-      <el-table-column :label="i.value" :prop="i.key" show-overflow-tooltip v-for="i in cloums">
-        <el-table-column v-for="item in i.titleGroup" :label="item.value" :prop="item.key" width="200"> </el-table-column>
-        <template #default="{ row }" v-if="i.key == 'standardFlag'">
-          <span :style="{ color: isDb(row.realCXQ, row.targetCXQ, row.realDBMJZJCQMJ, row.targetDBMJZJCQMJ) ? '#108ee9' : 'red' }">
-            <el-tag :type="isDb(row.realCXQ, row.targetCXQ, row.realDBMJZJCQMJ, row.targetDBMJZJCQMJ) ? 'success' : 'error'">{{
-              isDb(row.realCXQ, row.targetCXQ, row.realDBMJZJCQMJ, row.targetDBMJZJCQMJ) ? '达标' : '未达标'
-            }}</el-tag>
-          </span>
-        </template>
-        <template #default="{ row }" v-if="i.key == 'attachFileList'">
-          <span style="color: #108ee9" v-for="i in row?.attachFileList" @click="handlePreview(i)">{{ i.name }} </span>
-        </template>
-        <template #default="{ row }" v-if="i.key == 'year'">
-          {{ row.year }}
-        </template>
-        <template #default="{ row }" v-if="i.key == 'updateBy'">
-          {{ row.updateBy }}
-        </template>
-        <template #default="{ row }" v-if="i.key == 'updateTime'">
-          {{ row.updateTime }}
-        </template>
-      </el-table-column>
-      <el-table-column label="操作" width="250">
-        <template #default="{ row }">
-          <el-button link type="primary" icon="View" @click="onCheck(row, 1, '详情')">详情</el-button>
-          <el-button link icon="Edit" type="warning" @click="onCheck(row, 2, '修改')">修改</el-button>
-          <el-button link icon="Delete" type="danger" @click="onCheck(row, 3)">删除</el-button>
-        </template>
-      </el-table-column>
-    </el-table>
-  </div>
-  <pagination
-    v-show="totals > 0"
-    :total="totals"
-    v-model:page="FormList.pageNum"
-    v-model:limit="FormList.pageSize"
-    @pagination="dynamic_page_data_typeM(FormList)"
-  />
-  <el-dialog
-    v-model="visible"
-    :title="'内涝防治标准' + FormList.title"
-    :modal-append-to-body="false"
-    :close-on-click-modal="false"
-    width="51%"
-  >
-    <tableDalgo ref="tableDalgoRef" v-if="visible" @onModalClose="onModalClose" :typeList="typeList" :key="isFlag"> </tableDalgo>
-    <template #footer>
-      <div class="dialog-footer">
-        <el-button v-show="typeList.type == '2'" @click="open2" type="primary">保存</el-button>
-        <el-button @click="visible = false">关闭</el-button>
-      </div>
-    </template>
-  </el-dialog>
-</template>
-<script setup>
-import { projectInfoDelete, dynamic_page_data_type } from '@/api/spongePerformance/prevention';
-import { FileSystemList } from '@/api/project/tenderReview';
-import tableDalgo from './tableDalgo.vue';
-import { ElMessage, ElMessageBox } from 'element-plus';
-const { proxy } = getCurrentInstance();
-import { reactive } from 'vue';
-let visible = ref(false);
-let isFlag = ref(1);
-const cloums = ref([]);
-const tableDalgoRef = ref();
-const { params } = defineProps(['params']);
-const FormList = ref({
-  pageNum: 1,
-  pageSize: 10,
-  title: '',
-});
-const totals = ref(0);
-//动态组件
-let dataForm = reactive({
-  tableData: '',
-  tableDateTwo: '',
-  tableLoading: true,
-});
-let { date, tableData, tableDateTwo, tableLoading } = toRefs(dataForm);
-//获取列表数据
-//搜索
-const search = p => {
-  FormList.value.pageNum = 1;
-  dynamic_page_data_typeM(p);
-  isFlag.value++;
-};
-defineExpose({ search });
-// 查看上报数据
-let typeList = ref({});
-const onCheck = (row, ty, t) => {
-  FormList.value.title = t;
-  if (ty == 1 || ty == 2) {
-    typeList.value = {
-      ...params,
-      data: row,
-      type: ty,
-      monitorDynamicTableTitleList: cloums.value,
-      iSstandardFlag: isDb(row.realCXQ, row.targetCXQ, row.realDBMJZJCQMJ, row.targetDBMJZJCQMJ),
-    };
-    FileSystemList({
-      refId: row.performanceEvaluateId,
-      refType: 'proProjectBudget',
-    }).then(({ data }) => {
-      typeList.value.fileList1 = data;
-      visible.value = true;
-    });
-    // 获取文件列表
-  } else if (ty == 3) {
-    proxy.$modal
-      .confirm(`是否确认删除?`)
-      .then(async () => {
-        projectInfoDeleteM(row.performanceEvaluateId);
-        getTableData();
-      })
-      .catch(() => {});
-  }
-};
-//删除
-const projectInfoDeleteM = async id => {
-  let { code } = await projectInfoDelete(id);
-  search(p);
-};
-const dynamic_page_data_typeM = async id => {
-  let { code, data, monitorDynamicTableTitleList, total } = await dynamic_page_data_type(id);
-  tableData.value = data;
-  totals.value = total;
-  cloums.value = monitorDynamicTableTitleList;
-  tableLoading.value = false;
-};
-function onModalClose() {
-  visible.value = false;
-  // dynamic_page_data_typeM();
-  dynamic_page_data_typeM(params);
-}
-
-function open2() {
-  tableDalgoRef.value.submit();
-}
-function handlePreview(file) {
-  return ElMessageBox.confirm(`下载此文件: ${file.name}？`).then(
-    () => window.open(file.url),
-    () => false
-  );
-}
-function isDb(v, m, n, f) {
-  return v * 1 - m * 1 > 0 && n * 1 - f * 1 > 0;
-}
-onMounted(() => {
-  dynamic_page_data_typeM(params);
-});
-</script>
-<style lang="scss" scoped></style>
diff --git a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/index.vue b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/index.vue
index ed206ea..83e8850 100644
--- a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/index.vue
+++ b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/index.vue
@@ -1,106 +1,77 @@
 <template>
+  <!-- 黑臭水体消除比例 -->
   <div class="water-analysis-page">
-    <div class="top">
-      <div class="top" v-if="!isComponent">
-        <div class="icon">
-          <!-- <div class="tittle">黑臭水体年度考核统计表</div> -->
-          <todoDon ref="todoDonRef" :params="tableData" @searchClick="searchClick" @clicksWaterBodies="clicksWaterBodies"></todoDon>
-        </div>
-        <div class="tuli">
-          <div style="margin: 10px; font-size: 18px">图例</div>
-          <div v-for="i in tuliList" class="tuli_img">
-            <img :src="i.icon" alt="" />
-            <div>{{ i.label }}</div>
-          </div>
-        </div>
-        <!-- gis地图 -->
-        <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
-      </div>
-      <detial v-else-if="isComponent == 1" @searchClick="searchClick" :paramsData="params"> </detial>
+    <div class="icon">
+      <todoDon ref="todoDonRef" :params="tableData" @searchClick="searchClick" @clicksWaterBodies="clicksWaterBodies"></todoDon>
     </div>
-    <div class="PopupWaterlogging" id="PopupWaterlogging" v-if="pipePopupShow">
-      <div class="titleTop">
-        <el-tabs class="PopupWaterloggingtabs">
-          <el-tab-pane label="水质化验记录">
-            <el-table
-              ref="tableModal"
-              :data="tableData2"
-              max-height="320"
-              v-loading="tableLoading"
-              @row-click="clickModal"
-              highlight-current-row
-            >
-              <el-table-column type="index" width="55" label="序号" />
-              <el-table-column label="采样时间" prop="sampleTime" />
-              <el-table-column label="采样点" prop="sampleLocation" />
-              <el-table-column label="透明度（cm）" prop="CLA" />
-              <el-table-column label="溶解氧mg/L" prop="DOX" />
-              <el-table-column label="黑臭程度" prop="blackOdorName">
-                <template #default="scope">
-                  <span
-                    :style="{
-                      color:
-                        scope.row.blackOdorName == '无黑臭'
-                          ? 'greenyellow'
-                          : scope.row.blackOdorName == '轻度黑臭'
-                          ? ' #419fff'
-                          : scope.row.blackOdorName == '中度黑臭'
-                          ? 'orange'
-                          : scope.row.blackOdorName == '重度黑臭'
-                          ? 'red'
-                          : '',
-                    }"
-                  >
-                    {{
-                      scope.row.blackOdorName == '无黑臭'
-                        ? '无黑臭'
-                        : scope.row.blackOdorName == '轻度黑臭'
-                        ? '轻度黑臭'
-                        : scope.row.blackOdorName == '中度黑臭'
-                        ? '中度黑臭'
-                        : scope.row.blackOdorName == '重度黑臭'
-                        ? '重度黑臭'
-                        : ''
-                    }}
-                  </span>
-                </template>
-              </el-table-column>
-            </el-table>
-          </el-tab-pane>
-          <el-tab-pane label="工程治理" class="proimageList">
-            <div style="margin-top: 10px">黑臭水体治理工法： {{ popsdata.treatmentMethod }}</div>
-            <div style="margin-top: 10px">治理前/后照片：</div>
-            <el-image
-              style="width: 150px; margin-top: 10px"
-              v-for="i in popsdata.imageList"
-              :src="i.url"
-              :zoom-rate="1"
-              :initial-index="4"
-              :preview-src-list="[i.url]"
-            />
-          </el-tab-pane>
-        </el-tabs>
-      </div>
-      <div class="closePopup">
-        <el-icon :size="18" @click="closePopup"><Close /></el-icon>
+    <div class="tuli">
+      <div style="margin: 10px; font-size: 18px">图例</div>
+      <div v-for="i in tuliList" class="tuli_img">
+        <img :src="i.icon" alt="" />
+        <div>{{ i.label }}</div>
       </div>
     </div>
+    <!-- gis地图 -->
+    <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
   </div>
+  <!-- 地图水体点击弹窗 -->
+  <el-dialog v-model="dialogShow" title="2022黄汴河水质监测详情" :modal-append-to-body="false" width="900px">
+    <div class="hcstDialog">
+      <div class="part">
+        <div class="title">透明度(cm)</div>
+        <ChartBar3D :refresh="refresh1" :echartData="echartData1" class="chart"></ChartBar3D>
+      </div>
+      <div class="part">
+        <div class="title">氨氮(mg/L)</div>
+        <ChartBar3D :refresh="refresh2" :echartData="echartData2" class="chart"></ChartBar3D>
+      </div>
+      <div class="part">
+        <div class="title">溶解氧(mg/L)</div>
+        <ChartBar3D :refresh="refresh3" :echartData="echartData3" class="chart"></ChartBar3D>
+      </div>
+      <div class="part">
+        <div class="title">氧化还原电位(mV)</div>
+        <ChartBar3D :refresh="refresh4" :echartData="echartData4" class="chart"></ChartBar3D>
+      </div>
+    </div>
+  </el-dialog>
 </template>
 <script setup>
 import { blackOdorpaging, blackOdorpagingriverInfo } from '@/api/spongePerformance/surfaceWater';
-import detial from './detial/index';
 import MapBox from '@/views/gisMapPage/gisMapBox1'; //gis地图
 import todoDon from './todoDon.vue';
+import ChartBar3D from '@/views/sponeScreen/Echarts/echartBar3D.vue';
+
 const { proxy } = getCurrentInstance();
+const dialogShow = ref(true);
+const refresh1 = ref(1);
+const refresh2 = ref(1);
+const refresh3 = ref(1);
+const refresh4 = ref(1);
+const echartData1 = ref({
+  xAxis: ['3月', '4月', '9月', '11月'],
+  seriesData: [52, 35, 69, 86, 22],
+});
+const echartData2 = ref({
+  xAxis: ['3月', '4月', '9月', '11月'],
+  seriesData: [0.8, 0.35, 1.12, 0.9, 0.98],
+});
+const echartData3 = ref({
+  xAxis: ['3月', '4月', '9月', '11月'],
+  seriesData: [5.4, 13, 9.2, 10.4, 8.9],
+});
+const echartData4 = ref({
+  xAxis: ['3月', '4月', '9月', '11月'],
+  seriesData: [126, 162, 119, 86, 113],
+});
 const todoDonRef = ref(null);
 const pipePopupShow = ref(false);
 const popsdata = ref('');
 
 let isComponent = ref(0);
 let tuliList = ref([
-  { label: '未消除', id: 0, icon: '/images/1.1.jpg' },
-  { label: '已消除', id: 1, icon: '/images/1.2.jpg' },
+  { label: '未考核', id: 0, icon: '/images/1.1.jpg' },
+  { label: '已考核', id: 1, icon: '/images/1.2.jpg' },
 ]);
 const tableData2 = ref([]);
 //动态组件
@@ -140,9 +111,6 @@
   }
 };
 
-const closePopup = () => {
-  pipePopupShow.value = false;
-};
 const clicksWaterBodies = row => {
   let ids = '';
   if (row.riverId) {
@@ -155,101 +123,68 @@
 };
 onMounted(() => {});
 </script>
-<style lang="scss" scoped>
-@import '@/assets/styles/variables.module.scss';
-#map {
-  width: 100%;
-  height: 100%;
-}
-.form {
-  left: 10px;
-  top: 10px;
-  z-index: 111;
-  position: absolute;
-  width: 20%;
-}
-.top {
-  position: relative;
-  height: 86vh;
-}
-.icon {
-  right: 0;
-  top: 0;
-  z-index: 111;
-  position: absolute;
-  width: 70%;
-}
-.tuli {
-  left: 20px;
-  bottom: 30px;
-  padding: 10px;
-  z-index: 111;
-  position: absolute;
-  background: $mainColor1;
-  // display: flex;
+<style lang="scss">
+.hcstDialog {
+  display: flex;
   flex-wrap: wrap;
-  align-items: center;
-  text-align: center;
-  color: #fff;
-  .tuli_img {
-    display: flex;
-    width: 100px;
-    align-items: center;
-    margin-top: 8px;
-    img {
-      margin-right: 10px;
-      width: 25px;
+  .part {
+    width: 48%;
+    margin-right: 2%;
+    .title {
+      font-size: 18px;
+      font-weight: bold;
+      color: #fff;
+    }
+    .chart {
+      height: 300px !important;
     }
   }
 }
-.tittle {
-  font-size: 16px;
-  font-weight: bold;
-  width: 200px;
-  height: 40px;
-  line-height: 40px;
-  text-align: center;
-  margin: 5px 0;
-  color: #fff;
-}
-.tittle1 {
-  background: transparent;
-}
+@import '@/assets/styles/variables.module.scss';
+
 .water-analysis-page {
   padding: 20px;
-  overflow-y: hidden;
-}
-
-#PopupWaterlogging {
-  position: fixed;
-  left: 52%;
-  top: 54%;
-  transform: translate(-50%, -50%);
-  width: 700px;
-  height: 410px;
-  background: #021534;
-  border: 1px solid #114f89;
-  z-index: 2000;
-  display: flex;
-
-  .titleTop {
-    width: 95%;
-    display: flex;
-    padding-top: 8px;
-    margin-left: 20px;
-  }
-  .closePopup {
-    width: 5%;
-    margin: 15px;
-    cursor: pointer;
-  }
-  .PopupWaterloggingtabs {
+  height: 100%;
+  position: relative;
+  #map {
     width: 100%;
     height: 100%;
   }
-}
-.proimageList {
-  height: 300px;
-  overflow-y: auto;
+  .form {
+    left: 10px;
+    top: 10px;
+    z-index: 111;
+    position: absolute;
+    width: 20%;
+  }
+  .icon {
+    right: 0;
+    top: 0;
+    z-index: 111;
+    position: absolute;
+    width: 800px;
+  }
+  .tuli {
+    left: 20px;
+    bottom: 30px;
+    padding: 10px;
+    z-index: 111;
+    position: absolute;
+    background: $mainColor1;
+    flex-wrap: wrap;
+    align-items: center;
+    text-align: center;
+    color: #fff;
+    .tuli_img {
+      display: flex;
+      width: 100px;
+      align-items: center;
+      margin-top: 8px;
+      img {
+        margin-right: 10px;
+        width: 25px;
+      }
+    }
+  }
 }
 </style>

diff --git a/src/views/sponeScreen/Echarts/echartBar3D.vue b/src/views/sponeScreen/Echarts/echartBar3D.vue
index 3d23886..038626c 100644
--- a/src/views/sponeScreen/Echarts/echartBar3D.vue
+++ b/src/views/sponeScreen/Echarts/echartBar3D.vue
@@ -65,14 +65,14 @@
             lineStyle: {
               color: '#384267',
             },
-            show: true,
+            show: false,
           },
           splitLine: {
             show: false,
           },
           axisLine: {
             lineStyle: {
-              color: '#384267',
+              color: '#005CBA',
               width: 1,
               type: 'dashed',
             },
@@ -91,7 +91,7 @@
               color: '#005CBA',
               width: 1,
             },
-            show: true,
+            show: false,
           },
           splitLine: {
             show: true,
@@ -214,7 +214,9 @@
     );
 
     onMounted(() => {
-      init();
+      setTimeout(() => {
+        init();
+      }, 0);
       window.addEventListener('resize', resizeTheChart);
     });
     return {
diff --git a/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue b/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
index 37c3002..3075239 100644
--- a/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
+++ b/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
@@ -1 +1,65 @@
-<template><div>年径流污染削减率管理信息</div></template>
+<template>
+  <!-- 年径流污染削减率 -->
+  <div class="publicContainer">
+    <!-- gis地图 -->
+    <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
+
+    <!-- 海绵设施监测详情 -->
+    <el-dialog v-model="dialogShow" title="海绵设施监测点位详情" :modal-append-to-body="false" width="600px">
+      <el-form :inline="true">
+        <el-form-item label="日期" prop="date">
+          <el-date-picker type="daterange" v-model="dateSearch" value-format="YYYY-MM-DD" placeholder="请选择"></el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+        </el-form-item>
+      </el-form>
+      <div id="chartHMXJ" style="width: 100%; height: 300px"></div>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import MapBox from '@/views/gisMapPage/gisMapBox1'; //gis地图
+import optionChart from './chartOption.js';
+
+const { proxy } = getCurrentInstance();
+const dialogShow = ref(true);
+const charts = ref(null);
+const dateSearch = ref([proxy.moment(new Date()).subtract(60, 'days').format('YYYY-MM-DD'), proxy.moment().format('YYYY-MM-DD')]);
+
+// 历史数据搜索
+function handleQuery() {
+  setTimeout(() => {
+    initChart();
+  });
+}
+
+// echarts初始化
+function initChart() {
+  charts.value && charts.value.dispose();
+  charts.value = proxy.echarts.init(document.getElementById('chartHMXJ'));
+  optionChart.option.xAxis.data = ['2024-06-12 00:00:00', '2024-06-12 00:10:00', '2024-06-12 00:20:00'];
+  optionChart.option.yAxis[1].name = 'SS(mg/L)';
+  optionChart.option.series[0].data = [12, 9, 20]; //降雨量
+  optionChart.option.series[1].name = '进口SS';
+  optionChart.option.series[1].data = [230, 190, 132]; //进口SS
+  optionChart.option.series[2].name = '出口SS';
+  optionChart.option.series[2].data = [110, 90, 103]; //出口SS
+  // 设置鼠标滚轮放大缩小展示数据区间
+  optionChart.option.dataZoom = [{ type: 'inside', startValue: optionChart.option.xAxis.data[optionChart.option.xAxis.data.length / 2] }];
+  if (optionChart.option.xAxis.data.length > 0) {
+    optionChart.option.graphic.invisible = true; //暂无数据
+  } else {
+    optionChart.option.graphic.invisible = false; //暂无数据
+  }
+  charts.value.clear();
+  charts.value.setOption(optionChart.option);
+}
+
+onMounted(() => {
+  handleQuery();
+});
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue b/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
index c06a3dc..35608fb 100644
--- a/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
+++ b/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
@@ -1,3 +1,62 @@
 <template>
-  <div>年径流总量控制率管理信息</div>
+  <!-- 年径流总量控制率 -->
+  <div class="publicContainer">
+    <!-- gis地图 -->
+    <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
+
+    <!-- 海绵设施监测详情 -->
+    <el-dialog v-model="dialogShow" title="海绵设施监测点位详情" :modal-append-to-body="false" width="600px">
+      <el-form :inline="true">
+        <el-form-item label="日期" prop="date">
+          <el-date-picker type="daterange" v-model="dateSearch" value-format="YYYY-MM-DD" placeholder="请选择"></el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+        </el-form-item>
+      </el-form>
+      <div id="chartHMJC" style="width: 100%; height: 300px"></div>
+    </el-dialog>
+  </div>
 </template>
+
+<script setup>
+import MapBox from '@/views/gisMapPage/gisMapBox1'; //gis地图
+import optionChart from './chartOption.js';
+
+const { proxy } = getCurrentInstance();
+const dialogShow = ref(true);
+const charts = ref(null);
+const dateSearch = ref([proxy.moment(new Date()).subtract(60, 'days').format('YYYY-MM-DD'), proxy.moment().format('YYYY-MM-DD')]);
+
+// 历史数据搜索
+function handleQuery() {
+  setTimeout(() => {
+    initChart();
+  });
+}
+
+// echarts初始化
+function initChart() {
+  charts.value && charts.value.dispose();
+  charts.value = proxy.echarts.init(document.getElementById('chartHMJC'));
+  optionChart.option.xAxis.data = ['2024-06-12 00:00:00', '2024-06-12 00:10:00', '2024-06-12 00:20:00'];
+  optionChart.option.series[0].data = [12, 9, 20]; //降雨量
+  optionChart.option.series[1].data = [2.3, 1.9, 3.2]; //进口流量
+  optionChart.option.series[2].data = [1.1, 0.9, 1.3]; //出口流量
+  // 设置鼠标滚轮放大缩小展示数据区间
+  optionChart.option.dataZoom = [{ type: 'inside', startValue: optionChart.option.xAxis.data[optionChart.option.xAxis.data.length / 2] }];
+  if (optionChart.option.xAxis.data.length > 0) {
+    optionChart.option.graphic.invisible = true; //暂无数据
+  } else {
+    optionChart.option.graphic.invisible = false; //暂无数据
+  }
+  charts.value.clear();
+  charts.value.setOption(optionChart.option);
+}
+
+onMounted(() => {
+  handleQuery();
+});
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue b/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue
index d49fc2a..b86ad5d 100644
--- a/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue
+++ b/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue
@@ -1,4 +1,5 @@
 <template>
+  <!-- 污水处理厂进水BOD -->
   <div class="publicContainer">
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
       <el-form-item label="统计年份" prop="date">
@@ -13,7 +14,6 @@
 
       <el-form-item>
         <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
-        <el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button>
         <el-button icon="Refresh" @click="resetQuery">重置</el-button>
       </el-form-item>
     </el-form>
@@ -21,23 +21,17 @@
     <!-- 表格 -->
     <el-table :data="dataList" v-loading="loading" stripe :max-height="580">
       <el-table-column type="index" width="55" label="序号" />
-      <el-table-column label="统计年份" prop="q" />
       <el-table-column label="日期" prop="w" />
-      <el-table-column label="进水BOD平均浓度（mg/L）">
+      <el-table-column label="进水BOD平均浓度(mg/L)">
         <el-table-column prop="monthPlan1" label="西区污水处理厂" />
         <el-table-column prop="monthPlan2" label="东区污水处理厂" />
-        <el-table-column prop="monthPlan3" label="马家河污水厂" />
+        <el-table-column prop="monthPlan3" label="马家河污水处理厂" />
+        <el-table-column prop="monthPlan4" label="包公湖污水处理厂" />
+        <el-table-column prop="monthPlan5" label="祥符区污水处理厂" />
       </el-table-column>
       <el-table-column label="均值" prop="p" />
       <el-table-column label="年度绩效指标" prop="a" />
-      <el-table-column label="评价结论" prop="a" />
-      <el-table-column label="操作" width="240">
-        <template #default="scope">
-          <el-button link icon="View" type="primary" @click="handleDetail(scope.row, 'view')">查看</el-button>
-          <el-button link type="warning" icon="Edit" @click="handleUpdate(scope.row, 'view')">修改</el-button>
-          <el-button link type="danger" icon="Delete" @click="handleDelete(scope.row, 'view')">删除</el-button>
-        </template>
-      </el-table-column>
+      <el-table-column label="年度达标情况" prop="b" />
     </el-table>
     <!-- 分页 -->
     <pagination
@@ -47,117 +41,23 @@
       v-model:limit="queryParams.pageSize"
       @pagination="getList"
     />
-    <!-- 新增弹窗 -->
-    <el-dialog :title="title" v-model="open" width="800px" append-to-body :close-on-click-modal="false">
-      <el-form ref="roleRef" :model="form" :rules="rules" label-width="130px" :disabled="multiple">
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="统计年份:" prop="w">
-              <el-date-picker
-                type="year"
-                v-model="queryParams.date"
-                value-format="YYYY"
-                placeholder="请选择统计年份"
-                style="width: 100%"
-              ></el-date-picker>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="日期:" prop="w">
-              <el-date-picker
-                type="month"
-                v-model="queryParams.date"
-                value-format="YYYY-MM"
-                placeholder="请选择日期"
-                style="width: 100%"
-              ></el-date-picker>
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="西区污水处理厂:" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入西区污水处理厂" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="东区污水处理厂:" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入东区污水处理厂" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="马家河污水厂:" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入马家河污水厂" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="均值:" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入均值" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="年度绩效指标" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入年度绩效指标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="评价结论" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入评价结论标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-      </el-form>
-      <template #footer>
-        <div class="dialog-footer">
-          <el-button type="primary" @click="submitForm">确 定</el-button>
-          <el-button @click="cancel">取 消</el-button>
-        </div>
-      </template>
-    </el-dialog>
   </div>
 </template>
 <script setup name="WaterSupplyWaterPlants">
 const { proxy } = getCurrentInstance();
-const open = ref(false);
-const multiple = ref(false);
 const showSearch = ref(true);
-const Xcfrequency = ref([
-  {
-    value: 'tian',
-    label: '天',
-  },
-  {
-    value: 'zhou',
-    label: '周',
-  },
-]);
 const loading = ref(true);
 const total = ref(0);
-const title = ref('');
 const dataList = ref([]);
 const AllData = reactive({
   id: '',
-  form: {},
   queryParams: {
     pageNum: 1,
     pageSize: 10,
-    caseType: 1,
-    handleStatus: '',
-    searchContent: '',
-  },
-  rules: {
-    id: [{ required: true, message: '请输入', trigger: 'blur' }],
-    eventDescription: [{ required: true, message: '请输入', trigger: 'blur' }],
+    date: null,
   },
 });
-const { queryParams, form, rules } = toRefs(AllData);
+const { queryParams } = toRefs(AllData);
 //搜索
 function handleQuery() {
   getList();
@@ -167,39 +67,6 @@
   proxy.resetForm('queryRef');
   handleQuery();
 }
-// 新增
-function handleAdd() {
-  title.value = '新增水厂供水';
-  open.value = true;
-  form.value = {};
-  multiple.value = false;
-  form.value.fileTag = Xcfrequency.value[0].value;
-}
-// 新增中取消事件
-function cancel() {
-  open.value = false;
-  proxy.resetForm('roleRef');
-}
-
-// 巡查频率下拉框点击事件
-function changeStation(value) {
-  // console.log(value, 'value');
-}
-
-//查看详情操作
-function handleDetail(row) {
-  open.value = true;
-  title.value = '查看水厂供水';
-  multiple.value = true;
-  form.value = row;
-}
-// 修改按钮操作
-function handleUpdate(row) {
-  open.value = true;
-  title.value = '修改水厂供水';
-  multiple.value = false;
-  form.value = { ...row };
-}
 
 /** 查询列表 */
 const getList = async () => {
@@ -211,12 +78,4 @@
   getList();
 });
 </script>
-<style scoped lang="scss">
-.dituclass {
-  width: 100%;
-  height: 300px;
-  // background: red;
-  margin-bottom: 10px;
-  border: 1px solid #004565;
-}
-</style>
+<style scoped lang="scss"></style>
diff --git a/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue b/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue
index 6ce3f37..94c365b 100644
--- a/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue
+++ b/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue
@@ -1,34 +1,31 @@
 <template>
+  <!-- 城市生活污水集中收集率 -->
   <div class="publicContainer">
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
-      <el-form-item label="污水厂名称:" prop="searchContent">
-        <el-input v-model="queryParams.searchContent" placeholder="请输入污水厂名称" clearable style="width: 180px" />
-      </el-form-item>
       <el-form-item label="统计年份" prop="date">
         <el-date-picker type="year" v-model="queryParams.date" value-format="YYYY" placeholder="请选择统计年份"></el-date-picker>
       </el-form-item>
 
       <el-form-item>
         <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
-        <el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button>
         <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+        <el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button>
       </el-form-item>
     </el-form>
 
     <!-- 表格 -->
     <el-table :data="dataList" v-loading="loading" stripe :max-height="580">
       <el-table-column type="index" width="55" label="序号" />
-      <el-table-column label="污水厂名称" prop="q" />
-      <el-table-column label="编码" prop="w" />
       <el-table-column label="统计年份" prop="o" />
-      <el-table-column label="年度绩效指标" prop="p" />
+      <el-table-column label="污水厂名称" prop="q" />
       <el-table-column label="累计处理水量(万t)" prop="e" />
       <el-table-column label="进水BOD平均浓度(mg/L)" prop="r" />
       <el-table-column label="BOD 削减量(g)" prop="t" />
       <el-table-column label="城区用水人口(万人)" prop="y" />
       <el-table-column label="人均日生活污染排放量(g/人·d)" prop="u" />
-      <el-table-column label="城市生活污水集中收集率(%)" prop="i" />
-      <el-table-column label="评价结论" prop="a" />
+      <el-table-column label="目标收集率(%)" prop="p" />
+      <el-table-column label="实际收集率(%)" prop="i" />
+      <el-table-column label="达标情况" prop="a" />
       <el-table-column label="操作" width="240">
         <template #default="scope">
           <el-button link icon="View" type="primary" @click="handleDetail(scope.row, 'view')">查看</el-button>
@@ -46,93 +43,46 @@
       @pagination="getList"
     />
     <!-- 新增弹窗 -->
-    <el-dialog :title="title" v-model="open" width="1100px" append-to-body :close-on-click-modal="false">
+    <el-dialog :title="title" v-model="open" width="600px" append-to-body :close-on-click-modal="false">
       <el-form ref="roleRef" :model="form" :rules="rules" label-width="220px" :disabled="multiple">
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="污水厂名称:" prop="w">
-              <el-input v-model="form.w" placeholder="请输入污水厂名称" clearable style="width: 100%" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="编码:" prop="w">
-              <el-input v-model="form.w" placeholder="请输入编码" clearable style="width: 100%" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="累计处理水量(万t):" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入累计处理水量(万t)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="进水BOD平均浓度(mg/L):" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入进水BOD平均浓度(mg/L)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="BOD 削减量(g):" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入BOD 削减量(g)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="城区用水人口(万人):" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入城区用水人口(万人)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="人均日生活污染排放量(g/人·d):" prop="lon">
-              <el-input-number
-                v-model="form.lon"
-                placeholder="请输入人均日生活污染排放量(g/人·d)"
-                style="width: 100%"
-                controls-position="right"
-              />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="城市生活污水集中收集率(%):" prop="lat">
-              <el-input-number
-                v-model="form.lat"
-                placeholder="请输入城市生活污水集中收集率(%)"
-                style="width: 100%"
-                controls-position="right"
-              />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="统计年份" prop="date">
-              <el-date-picker
-                type="year"
-                v-model="queryParams.date"
-                value-format="YYYY"
-                placeholder="请选择统计年份"
-                style="width: 100%"
-              ></el-date-picker>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="年度绩效指标" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入年度绩效指标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="评价结论" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入评价结论标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-        </el-row>
+        <el-form-item label="统计年份" prop="date">
+          <el-date-picker
+            type="year"
+            v-model="queryParams.date"
+            value-format="YYYY"
+            placeholder="请选择统计年份"
+            style="width: 100%"
+          ></el-date-picker>
+        </el-form-item>
+        <el-form-item label="污水厂名称:" prop="w">
+          <el-input v-model="form.w" placeholder="请输入污水厂名称" clearable style="width: 100%" />
+        </el-form-item>
+        <el-form-item label="累计处理水量(万t):" prop="lon">
+          <el-input-number v-model="form.lon" placeholder="请输入累计处理水量(万t)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="进水BOD平均浓度(mg/L):" prop="lat">
+          <el-input-number v-model="form.lat" placeholder="请输入进水BOD平均浓度(mg/L)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="BOD 削减量(g):" prop="lon">
+          <el-input-number v-model="form.lon" placeholder="请输入BOD 削减量(g)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="城区用水人口(万人):" prop="lat">
+          <el-input-number v-model="form.lat" placeholder="请输入城区用水人口(万人)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="人均日生活污染排放量(g/人·d):" prop="lon">
+          <el-input-number
+            v-model="form.lon"
+            placeholder="请输入人均日生活污染排放量(g/人·d)"
+            style="width: 100%"
+            controls-position="right"
+          />
+        </el-form-item>
+        <el-form-item label="目标收集率(%):" prop="date">
+          <el-input-number v-model="form.lon" placeholder="请输入目标收集率" style="width: 100%" />
+        </el-form-item>
+        <el-form-item label="实际收集率(%):" prop="lat">
+          <el-input-number v-model="form.lat" placeholder="请输入实际收集率(%)" style="width: 100%" controls-position="right" />
+        </el-form-item>
       </el-form>
       <template #footer>
         <div class="dialog-footer">
@@ -170,7 +120,6 @@
     pageSize: 10,
     caseType: 1,
     handleStatus: '',
-    searchContent: '',
   },
   rules: {
     id: [{ required: true, message: '请输入', trigger: 'blur' }],
diff --git a/src/views/spongePerformance/OutputPerformance/chartOption.js b/src/views/spongePerformance/OutputPerformance/chartOption.js
new file mode 100644
index 0000000..c0e300f
--- /dev/null
+++ b/src/views/spongePerformance/OutputPerformance/chartOption.js
@@ -0,0 +1,137 @@
+import useUserStore from '@/store/modules/user';
+import * as echarts from 'echarts';
+const pinias = useUserStore();
+
+let optionChart = {
+  // 柱状图+折线图
+  option: {
+    color: pinias.$state.chartColor,
+    // 显示暂无数据
+    graphic: {
+      type: 'text', // 类型：文本
+      left: 'center',
+      top: 'middle',
+      silent: true, // 不响应事件
+      invisible: false, // 有数据就隐藏
+      style: {
+        fill: '#c6c6c6',
+        fontWeight: 'bold',
+        text: '暂无数据',
+        fontFamily: 'Microsoft YaHei',
+        fontSize: '18px',
+      },
+    },
+    tooltip: {
+      trigger: 'axis',
+      confine: true, //是否将 tooltip 框限制在图表的区域内
+    },
+    title: {
+      left: 'left',
+      text: '',
+      top: 10,
+      bottom: 10,
+      left: 10,
+      textStyle: {
+        color: '#545E75', //字体颜色
+        fontSize: 16, //字体大小
+      },
+    },
+    grid: {
+      left: '3%',
+      right: '5%',
+      top: '20%',
+      bottom: '3%',
+      containLabel: true,
+    },
+    legend: {
+      top: '2%',
+      orient: 'horizontal', //horizontal
+      left: 'center', //left ,center
+      textStyle: {
+        color: 'inherit',
+      },
+    },
+    xAxis: {
+      type: 'category',
+      position: 'bottom',
+      data: ['2023', '2024', '2025'],
+      axisLabel: {
+        color: '#c6c6c6',
+      },
+      axisLine: {
+        lineStyle: {
+          color: '#066592',
+        },
+      },
+    },
+    yAxis: [
+      {
+        name: '降雨量(mm)',
+        type: 'value',
+        inverse: true, //翻转
+        nameLocation: 'start', // 坐标轴名称显示位置
+        nameGap: 15, // 坐标轴名称与轴线之间的距离
+        nameTextStyle: {
+          color: '#c6c6c6', //字体颜色
+          fontSize: 12, //字体大小
+          align: 'center', // 文字水平对齐方式，默认自动（'left'，'center'，'right'）
+        },
+        splitLine: {
+          lineStyle: {
+            type: 'dashed',
+            color: '#066592',
+          },
+        },
+        axisLabel: {
+          color: '#c6c6c6',
+        },
+      },
+      {
+        name: '流量(m³/h)',
+        type: 'value',
+        nameLocation: 'end', // 坐标轴名称显示位置
+        nameGap: 15, // 坐标轴名称与轴线之间的距离
+        nameTextStyle: {
+          color: '#c6c6c6', //字体颜色
+          fontSize: 12, //字体大小
+          align: 'center', // 文字水平对齐方式，默认自动（'left'，'center'，'right'）
+        },
+        axisLabel: {
+          color: '#c6c6c6',
+        },
+        splitLine: {
+          lineStyle: {
+            type: 'dashed',
+            color: '#066592',
+          },
+        },
+      },
+    ],
+    series: [
+      {
+        name: '降雨量',
+        type: 'bar',
+        barWidth: 10,
+        yAxisIndex: 0,
+        data: [24, 12, 9],
+      },
+      {
+        name: '进口流量',
+        type: 'line',
+        smooth: true,
+        yAxisIndex: 1,
+        symbolSize: 8,
+        data: [14, 8, 5],
+      },
+      {
+        name: '出口流量',
+        type: 'line',
+        smooth: true,
+        yAxisIndex: 1,
+        symbolSize: 8,
+        data: [4, 2, 1],
+      },
+    ],
+  },
+};
+export default optionChart;
diff --git a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/index.vue b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/index.vue
deleted file mode 100644
index bc19015..0000000
--- a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/index.vue
+++ /dev/null
@@ -1,367 +0,0 @@
-<template>
-  <!-- 地表水体水质达标 -->
-  <div class="publicContainer" v-if="back">
-    <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
-      <el-form-item label="考核水体:" prop="riverId">
-        <el-select clearable v-model="queryParams.riverId" class="m-2" placeholder="请选择" size="mini">
-          <el-option v-for="item in responseAA" :key="item.id" :label="item.riverName" :value="Number(item.id)" />
-        </el-select>
-      </el-form-item>
-
-      <el-form-item label="采样年份:" prop="sampleYear">
-        <el-date-picker
-          v-model="queryParams.sampleYear"
-          type="year"
-          placeholder="请选择"
-          format="YYYY"
-          value-format="YYYY"
-          @change="change"
-        />
-      </el-form-item>
-
-      <el-form-item label="评价结果:" prop="blackOdor">
-        <el-select clearable v-model="queryParams.blackOdor" class="m-2" placeholder="请选择" size="mini">
-          <el-option v-for="item in black_odor_level" :key="item.value" :label="item.label" :value="item.value" />
-        </el-select>
-      </el-form-item>
-      <el-form-item>
-        <el-button type="primary" icon="Search" @click="searchData">搜索</el-button>
-        <el-button icon="Refresh" @click="resetData">重置</el-button>
-        <el-button icon="CaretLeft" @click="resect" class="zbBtn"> 返回</el-button>
-        <el-button icon="Plus" type="success" @click="addData">新增</el-button>
-      </el-form-item>
-    </el-form>
-    <!-- 表格 -->
-    <el-table :data="tableData" v-loading="tableLoading" :max-height="650">
-      <el-table-column type="index" width="55" label="序号" />
-      <el-table-column v-for="item in informationDate" :label="item.value" :prop="item.key">
-        <template #default="scope" v-if="item.key == 'blackOdorName'">
-          <span
-            :style="{
-              color:
-                scope.row.blackOdorName == '无黑臭'
-                  ? 'greenyellow'
-                  : scope.row.blackOdorName == '轻度黑臭'
-                  ? ' #419fff'
-                  : scope.row.blackOdorName == '中度黑臭'
-                  ? 'orange'
-                  : scope.row.blackOdorName == '重度黑臭'
-                  ? 'red'
-                  : '',
-            }"
-          >
-            {{
-              scope.row.blackOdorName == '无黑臭'
-                ? '无黑臭'
-                : scope.row.blackOdorName == '轻度黑臭'
-                ? '轻度黑臭'
-                : scope.row.blackOdorName == '中度黑臭'
-                ? '中度黑臭'
-                : scope.row.blackOdorName == '重度黑臭'
-                ? '重度黑臭'
-                : ''
-            }}
-          </span>
-        </template>
-      </el-table-column>
-      <el-table-column label="操作" show-overflow-tooltip width="200">
-        <template #default="{ row }">
-          <el-button type="primary" link @click="checkDetail(row)">详情</el-button>
-          <el-button type="primary" link @click="editData(row)">修改</el-button>
-          <el-button type="danger" link @click="deleteData(row)">删除</el-button>
-        </template>
-      </el-table-column>
-    </el-table>
-    <!-- 分页 -->
-    <pagination
-      v-show="total > 0"
-      :total="total"
-      v-model:page="queryParams.pageNum"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getDataList"
-    />
-    <!-- 添加 修改 查看彈框 -->
-    <el-dialog :title="dialogTitle" v-model="showDialog" width="70%" :close-on-click-modal="false">
-      <el-form ref="ruleForm" :model="formData" :rules="formRules" label-width="auto" :disabled="isDisab">
-        <el-row>
-          <el-form-item label="考核水体:" prop="riverId" style="width: 45%">
-            <el-select clearable v-model="formData.riverId" class="m-2" placeholder="请选择" size="mini" style="width: 100%">
-              <el-option v-for="item in responseAA" :key="item.id" :label="item.riverName" :value="Number(item.id)" />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="采样时间:" prop="sampleTime" style="width: 45%">
-            <el-date-picker
-              style="width: 100%"
-              clearable
-              format="YYYY-MM-DD"
-              value-format="YYYY-MM-DD"
-              v-model="formData.sampleTime"
-              type="date"
-            />
-          </el-form-item>
-          <el-form-item label="采样点:" prop="sampleLocation" style="width: 45%">
-            <el-input v-model="formData.sampleLocation" placeholder="请输入" style="width: 100%" clearable />
-          </el-form-item>
-
-          <el-form-item v-for="item in Dbssz" :label="item.sampleFactorName" :prop="item.sampleFactor" style="width: 45%">
-            <el-input-number
-              v-model="formData[item.sampleFactor]"
-              placeholder="请输入"
-              clearable
-              controls-position="right"
-              style="width: 400px"
-            />
-          </el-form-item>
-
-          <el-form-item label="黑臭程度:" prop="blackOdorName" style="width: 45%" v-if="hiddentext">
-            <div
-              :style="{
-                color:
-                  formData.blackOdorName == '无黑臭'
-                    ? 'greenyellow'
-                    : formData.blackOdorName == '轻度黑臭'
-                    ? ' #419fff'
-                    : formData.blackOdorName == '中度黑臭'
-                    ? 'orange'
-                    : formData.blackOdorName == '重度黑臭'
-                    ? 'red'
-                    : '',
-              }"
-            >
-              {{
-                formData.blackOdorName == '无黑臭'
-                  ? '无黑臭'
-                  : formData.blackOdorName == '轻度黑臭'
-                  ? '轻度黑臭'
-                  : formData.blackOdorName == '中度黑臭'
-                  ? '中度黑臭'
-                  : formData.blackOdorName == '重度黑臭'
-                  ? '重度黑臭'
-                  : ''
-              }}
-            </div>
-          </el-form-item>
-        </el-row>
-      </el-form>
-      <template #footer>
-        <div class="dialog-footer">
-          <el-button type="primary" @click="submitForm" v-show="!isDisab">保 存</el-button>
-          <el-button @click="cancel">关闭</el-button>
-        </div>
-      </template>
-    </el-dialog>
-  </div>
-  <waterquality v-else />
-</template>
-<script setup>
-import {
-  blackOdorUserId,
-  riverInfoWater,
-  blackOdorAdd,
-  blackOdorDelete,
-  sampleConfigconfiguration,
-  blackOdorinformation,
-  blackOdorpaging,
-  blackOdorEdit,
-} from '@/api/spongePerformance/surfaceWater';
-const { proxy } = getCurrentInstance();
-const { hc_sample_factor, sample_type, black_odor_level } = proxy.useDict('hc_sample_factor', 'sample_type', 'black_odor_level');
-import { defineEmits } from 'vue';
-const isDisab = ref(false);
-const isDisatext = ref(false);
-const showDialog = ref(false);
-const showSearch = ref(true);
-const tableLoading = ref(true);
-const hiddentext = ref(false);
-const back = ref(true);
-const responseAA = ref([]);
-const total = ref(0);
-const dialogTitle = ref('');
-const tableData = ref([]);
-const Dbssz = ref([]);
-const informationDate = ref([]);
-const emits = defineEmits();
-const { paramsData } = defineProps(['paramsData']);
-const AllData = reactive({
-  formData: {
-    configs: [],
-  },
-  queryParams: {
-    pageNum: 1,
-    pageSize: 10,
-    sampleTime: '',
-    riverId: '',
-    blackOdor: '',
-    sampleYear: '',
-    sampleLocation: '',
-  },
-  formRules: {
-    riverId: [{ required: true, message: '请选择', trigger: 'blur' }],
-    sampleTime: [{ required: true, message: '请选择', trigger: 'blur' }],
-  },
-});
-const { queryParams, formData, formRules } = toRefs(AllData);
-
-/** 表单重置 */
-function resetForm() {
-  formData.value = {
-    riverId: undefined,
-    sampleYear: undefined,
-    sampleTime: undefined,
-    blackOdor: undefined,
-    sampleLocation: undefined,
-    riverType: 'black_odor',
-  };
-  proxy.resetForm('ruleForm');
-}
-function resect() {
-  emits('searchClick', 0);
-}
-/** 新增按钮操作 */
-function addData() {
-  resetForm();
-  hiddentext.value = false;
-  isDisab.value = false;
-  showDialog.value = true;
-  dialogTitle.value = '新增检测记录';
-}
-
-//搜索
-function searchData() {
-  queryParams.value.pageNum = 1;
-  getDataList();
-}
-//重置
-function resetData() {
-  proxy.resetForm('queryRef');
-  searchData();
-}
-// 获取下拉框数据
-const getSelData = async () => {
-  let params = {
-    riverType: 'black_odor',
-  };
-  riverInfoWater(params).then(response => {
-    if (response.code == 200) {
-      responseAA.value = response.data;
-    }
-  });
-};
-// 新增中的 动态数据
-const Dbsszconfiguration = async () => {
-  let params = {
-    sampleType: 'hcst',
-  };
-  sampleConfigconfiguration(params).then(response => {
-    if (response.code == 200) {
-      Dbssz.value = response.data;
-      Dbssz.value.forEach(item => {
-        formRules.value[item.sampleFactor] = [{ required: true, message: '请输入', trigger: 'blur', type: 'number' }];
-      });
-      console.log(formRules.value);
-    }
-  });
-};
-//地水质采样信息动态表头
-const information = async () => {
-  blackOdorinformation().then(res => {
-    if (res.code == 200) {
-      informationDate.value = res.data;
-    }
-  });
-};
-
-/** 查询列表 */
-const getDataList = async () => {
-  tableLoading.value = true;
-  const res = await blackOdorpaging(queryParams.value);
-  tableData.value = res.data.records;
-  total.value = res.data.total || 0;
-  tableLoading.value = false;
-};
-/** 新增弹框 修改弹框 提交按钮 */
-async function submitForm() {
-  proxy.$refs['ruleForm'].validate(valid => {
-    if (valid) {
-      formData.value.configs = [];
-      let obj = [];
-      Dbssz.value.forEach(k => {
-        obj.push(k.sampleFactor);
-      });
-      obj.forEach(element => {
-        formData.value.configs.push({
-          factor: element,
-          value: formData.value[element],
-        });
-        delete formData.value[element];
-      });
-      console.log(formData.value, 'formData.value.configs');
-
-      if (formData.value.id != undefined) {
-        blackOdorEdit(formData.value).then(() => {
-          console.log(formData.value, 'formData.value');
-          proxy.$modal.msgSuccess('修改成功');
-          showDialog.value = false;
-          getDataList();
-        });
-      } else {
-        blackOdorAdd(formData.value).then(() => {
-          console.log(formData.value, 'formData.valueformData.valueformData.value');
-          proxy.$modal.msgSuccess('新增成功');
-          showDialog.value = false;
-          getDataList();
-        });
-      }
-    }
-  });
-}
-//表格修改
-function editData(row) {
-  formData.value = { ...row };
-  isDisab.value = false;
-  isDisatext.value = true;
-  showDialog.value = true;
-  dialogTitle.value = '修改检测记录';
-  hiddentext.value = true;
-  console.log(row, 'row');
-}
-// 表格删除
-function deleteData(row) {
-  proxy.$modal
-    .confirm('是否确认删除？')
-    .then(async () => {
-      const res = await blackOdorDelete(row.id);
-      if (res?.code !== 200) return;
-      proxy.$modal.msgSuccess('操作成功！');
-      getDataList();
-    })
-    .catch(() => {});
-}
-//详情按钮
-function checkDetail(row) {
-  dialogTitle.value = '查看检测记录';
-  isDisab.value = true;
-  showDialog.value = true;
-  isDisatext.value = true;
-  hiddentext.value = true;
-  formData.value = { ...row };
-}
-
-/** 取消按钮 */
-function cancel() {
-  showDialog.value = false;
-  resetForm();
-}
-function change(val) {
-  console.log(val, 'val');
-  queryParams.value.sampleYear = val;
-}
-onMounted(() => {
-  queryParams.value.sampleYear = paramsData?.examineYear || '';
-  getDataList();
-  getSelData();
-  Dbsszconfiguration();
-  information();
-});
-</script>
-<style scoped lang="scss"></style>
diff --git a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/tableDalgo.vue b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/tableDalgo.vue
deleted file mode 100644
index 7a01aeb..0000000
--- a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/tableDalgo.vue
+++ /dev/null
@@ -1,155 +0,0 @@
-<template>
-  <div class="water-analysis-page">
-    <div class="top">
-      <el-form label-width="auto" :rules="projectEstimateRules" inline ref="ruleForm" :model="FormList" :disabled="typeList.type == 1">
-        <div v-for="i in typeList.monitorDynamicTableTitleList" style="display: flex; flex-direction: column">
-          <el-form-item
-            v-if="i.key == 'real' || i.key == 'target'"
-            v-for="k in i.titleGroup"
-            :label="i.key == 'real' ? '实际' + k.value + ':' : '目标' + k.value + ':'"
-            :prop="k.key"
-            :disabled="typeList.type == 1 || typeList.type == 2"
-          >
-            <el-input
-              :disabled="i.key != 'real'"
-              v-model="FormList[k.key]"
-              :placeholder="k.placeholder"
-              @change="ChangeClick(k.key, FormList[k.key])"
-            >
-            </el-input>
-          </el-form-item>
-          <el-form-item v-else :label="i.value + ':'" :prop="i.key" :disabled="typeList.type == 1 || typeList.type == 2">
-            <el-upload
-              v-if="i.key == 'attachFileList'"
-              v-model:file-list="fileList1"
-              class="upload-demo"
-              action="/system/upload"
-              :headers="uploadHeader"
-              multiple
-              :on-preview="handlePreview"
-              :before-remove="beforeRemove"
-              style="width: 100vh"
-            >
-              <el-button type="primary">选择文件</el-button>
-            </el-upload>
-            <div
-              v-else-if="i.key == 'standardFlag' && typeList.iSstandardFlag"
-              :style="{ color: typeList.iSstandardFlag ? '#108ee9' : 'red' }"
-            >
-              {{ typeList.iSstandardFlag ? '达标' : '未达标' }}
-            </div>
-            <div
-              v-else-if="i.key == 'standardFlag' && !typeList.iSstandardFlag"
-              :style="{ color: IsStandFlag1 > 0 && IsStandFlag2 > 0 ? '#108ee9' : 'red' }"
-            >
-              <span v-show="false">{{ IsStandFlag1 > 0 && IsStandFlag2 > 0 ? (IsStandText = 1) : (IsStandText = 0) }}</span>
-              {{ IsStandFlag1 > 0 && IsStandFlag2 > 0 ? '达标' : '未达标' }}
-            </div>
-            <div v-else>
-              {{ FormList[i.key] }}
-            </div>
-          </el-form-item>
-        </div>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script setup>
-import { projectInfoEdit } from '@/api/spongePerformance/prevention';
-import { getToken } from '@/utils/auth';
-import { projectEstimateRules } from '@/utils/rules';
-import { ElMessage, ElMessageBox } from 'element-plus';
-const { proxy } = getCurrentInstance();
-const { fund_source } = proxy.useDict('fund_source');
-const uploadHeader = ref({
-  Authorization: 'Bearer ' + getToken(),
-});
-const { typeList } = defineProps(['typeList']);
-const emits = defineEmits();
-defineExpose({ submit, closed, resetFiled });
-const IsStandFlag1 = ref(0);
-const IsStandFlag2 = ref(0);
-const IsStandText = ref('');
-let FormList = ref({ projectNo: '', fileSaveRequestList: [] });
-function ChangeClick(v, m) {
-  console.log('v', v);
-  console.log('m', m);
-  typeList.iSstandardFlag = null;
-  if (v == 'realCXQ') {
-    console.log('object1', m * 1 - FormList.value.targetCXQ * 1);
-    IsStandFlag1.value = m * 1 - FormList.value.targetCXQ * 1;
-  } else {
-    console.log('object2', m * 1 - FormList.value.targetDBMJZJCQMJ * 1);
-    IsStandFlag2.value = m * 1 - FormList.value.targetCXQ * 1;
-  }
-}
-const fileList1 = ref([]);
-function handlePreview(file) {
-  return ElMessageBox.confirm(`下载此文件: ${file.name}？`).then(
-    () => window.open(file.url),
-    () => false
-  );
-}
-function beforeRemove(file) {
-  return true;
-}
-function submit() {
-  proxy.$refs.ruleForm.validate(valid => {
-    if (valid) {
-      const fileSaveRequestList = [];
-      fileList1.value.forEach(element => {
-        if (element.hasOwnProperty('response')) {
-          element.response.data.refType = 'proProjectBudget';
-          fileSaveRequestList.push(element.response.data);
-        } else {
-          fileSaveRequestList.push(element);
-        }
-      });
-      const itemUpdateFieldRequestList = [
-        { id: typeList.data['CXQ-id'], realValue: FormList.value.realCXQ, standardFlag: IsStandFlag1.value > 0 ? 1 : 0 },
-        {
-          id: typeList.data['DBMJZJCQMJ-id' || 0],
-          realValue: FormList.value.realDBMJZJCQMJ,
-          standardFlag: IsStandFlag2.value > 0 ? 1 : 0,
-        },
-      ];
-      FormList.value = {
-        itemDataType: typeList.itemDataType,
-        standardFlag: typeList.iSstandardFlag || IsStandText.value,
-        itemUpdateFieldRequestList,
-        fileSaveRequestList,
-        performanceEvaluateId: typeList.data.performanceEvaluateId,
-      };
-      console.log('FormList.value', FormList.value);
-      projectInfoEdit(FormList.value).then(({ code }) => {
-        if (code == 200) {
-          emits('onModalClose');
-        }
-      });
-    }
-    // }
-  });
-}
-function loadProjerctListData() {
-  console.log('typeListtypeList', typeList);
-  FormList.value = typeList.data;
-  fileList1.value = typeList.fileList1;
-  proxy.$refs.ruleForm.resetFields();
-}
-function resetFiled() {
-  proxy.$refs.ruleForm.resetFields();
-  fileList1.value = [];
-}
-
-function closed() {
-  emits('onModalClose');
-}
-onMounted(() => {
-  loadProjerctListData();
-});
-</script>
-<style lang="scss" scoped>
-.water-analysis-page {
-  padding: 20px;
-}
-</style>
diff --git a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/todoDon.vue b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/todoDon.vue
deleted file mode 100644
index b3e573b..0000000
--- a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/todoDon.vue
+++ /dev/null
@@ -1,156 +0,0 @@
-<template>
-  <div class="water-analysis-page">
-    <el-table :key="isFlag" :data="tableData" max-height="500" v-loading="tableLoading">
-      <el-table-column type="index" width="55" label="序号" />
-      <el-table-column :label="i.value" :prop="i.key" show-overflow-tooltip v-for="i in cloums">
-        <el-table-column v-for="item in i.titleGroup" :label="item.value" :prop="item.key" width="200"> </el-table-column>
-        <template #default="{ row }" v-if="i.key == 'standardFlag'">
-          <span :style="{ color: isDb(row.realCXQ, row.targetCXQ, row.realDBMJZJCQMJ, row.targetDBMJZJCQMJ) ? '#108ee9' : 'red' }">
-            <el-tag :type="isDb(row.realCXQ, row.targetCXQ, row.realDBMJZJCQMJ, row.targetDBMJZJCQMJ) ? 'success' : 'error'">{{
-              isDb(row.realCXQ, row.targetCXQ, row.realDBMJZJCQMJ, row.targetDBMJZJCQMJ) ? '达标' : '未达标'
-            }}</el-tag>
-          </span>
-        </template>
-        <template #default="{ row }" v-if="i.key == 'attachFileList'">
-          <span style="color: #108ee9" v-for="i in row?.attachFileList" @click="handlePreview(i)">{{ i.name }} </span>
-        </template>
-        <template #default="{ row }" v-if="i.key == 'year'">
-          {{ row.year }}
-        </template>
-        <template #default="{ row }" v-if="i.key == 'updateBy'">
-          {{ row.updateBy }}
-        </template>
-        <template #default="{ row }" v-if="i.key == 'updateTime'">
-          {{ row.updateTime }}
-        </template>
-      </el-table-column>
-      <el-table-column label="操作" width="250">
-        <template #default="{ row }">
-          <el-button link type="primary" icon="View" @click="onCheck(row, 1, '详情')">详情</el-button>
-          <el-button link icon="Edit" type="warning" @click="onCheck(row, 2, '修改')">修改</el-button>
-          <el-button link icon="Delete" type="danger" @click="onCheck(row, 3)">删除</el-button>
-        </template>
-      </el-table-column>
-    </el-table>
-  </div>
-  <pagination
-    v-show="totals > 0"
-    :total="totals"
-    v-model:page="FormList.pageNum"
-    v-model:limit="FormList.pageSize"
-    @pagination="dynamic_page_data_typeM(FormList)"
-  />
-  <el-dialog
-    v-model="visible"
-    :title="'内涝防治标准' + FormList.title"
-    :modal-append-to-body="false"
-    :close-on-click-modal="false"
-    width="51%"
-  >
-    <tableDalgo ref="tableDalgoRef" v-if="visible" @onModalClose="onModalClose" :typeList="typeList" :key="isFlag"> </tableDalgo>
-    <template #footer>
-      <div class="dialog-footer">
-        <el-button v-show="typeList.type == '2'" @click="open2" type="primary">保存</el-button>
-        <el-button @click="visible = false">关闭</el-button>
-      </div>
-    </template>
-  </el-dialog>
-</template>
-<script setup>
-import { projectInfoDelete, dynamic_page_data_type } from '@/api/spongePerformance/prevention';
-import { FileSystemList } from '@/api/project/tenderReview';
-import tableDalgo from './tableDalgo.vue';
-import { ElMessage, ElMessageBox } from 'element-plus';
-const { proxy } = getCurrentInstance();
-import { reactive } from 'vue';
-let visible = ref(false);
-let isFlag = ref(1);
-const cloums = ref([]);
-const tableDalgoRef = ref();
-const { params } = defineProps(['params']);
-const FormList = ref({
-  pageNum: 1,
-  pageSize: 10,
-  title: '',
-});
-const totals = ref(0);
-//动态组件
-let dataForm = reactive({
-  tableData: '',
-  tableDateTwo: '',
-  tableLoading: true,
-});
-let { date, tableData, tableDateTwo, tableLoading } = toRefs(dataForm);
-//获取列表数据
-//搜索
-const search = p => {
-  FormList.value.pageNum = 1;
-  dynamic_page_data_typeM(p);
-  isFlag.value++;
-};
-defineExpose({ search });
-// 查看上报数据
-let typeList = ref({});
-const onCheck = (row, ty, t) => {
-  FormList.value.title = t;
-  if (ty == 1 || ty == 2) {
-    typeList.value = {
-      ...params,
-      data: row,
-      type: ty,
-      monitorDynamicTableTitleList: cloums.value,
-      iSstandardFlag: isDb(row.realCXQ, row.targetCXQ, row.realDBMJZJCQMJ, row.targetDBMJZJCQMJ),
-    };
-    FileSystemList({
-      refId: row.performanceEvaluateId,
-      refType: 'proProjectBudget',
-    }).then(({ data }) => {
-      typeList.value.fileList1 = data;
-      visible.value = true;
-    });
-    // 获取文件列表
-  } else if (ty == 3) {
-    proxy.$modal
-      .confirm(`是否确认删除?`)
-      .then(async () => {
-        projectInfoDeleteM(row.performanceEvaluateId);
-        getTableData();
-      })
-      .catch(() => {});
-  }
-};
-//删除
-const projectInfoDeleteM = async id => {
-  let { code } = await projectInfoDelete(id);
-  search(p);
-};
-const dynamic_page_data_typeM = async id => {
-  let { code, data, monitorDynamicTableTitleList, total } = await dynamic_page_data_type(id);
-  tableData.value = data;
-  totals.value = total;
-  cloums.value = monitorDynamicTableTitleList;
-  tableLoading.value = false;
-};
-function onModalClose() {
-  visible.value = false;
-  // dynamic_page_data_typeM();
-  dynamic_page_data_typeM(params);
-}
-
-function open2() {
-  tableDalgoRef.value.submit();
-}
-function handlePreview(file) {
-  return ElMessageBox.confirm(`下载此文件: ${file.name}？`).then(
-    () => window.open(file.url),
-    () => false
-  );
-}
-function isDb(v, m, n, f) {
-  return v * 1 - m * 1 > 0 && n * 1 - f * 1 > 0;
-}
-onMounted(() => {
-  dynamic_page_data_typeM(params);
-});
-</script>
-<style lang="scss" scoped></style>
diff --git a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/index.vue b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/index.vue
index ed206ea..83e8850 100644
--- a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/index.vue
+++ b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/index.vue
@@ -1,106 +1,77 @@
 <template>
+  <!-- 黑臭水体消除比例 -->
   <div class="water-analysis-page">
-    <div class="top">
-      <div class="top" v-if="!isComponent">
-        <div class="icon">
-          <!-- <div class="tittle">黑臭水体年度考核统计表</div> -->
-          <todoDon ref="todoDonRef" :params="tableData" @searchClick="searchClick" @clicksWaterBodies="clicksWaterBodies"></todoDon>
-        </div>
-        <div class="tuli">
-          <div style="margin: 10px; font-size: 18px">图例</div>
-          <div v-for="i in tuliList" class="tuli_img">
-            <img :src="i.icon" alt="" />
-            <div>{{ i.label }}</div>
-          </div>
-        </div>
-        <!-- gis地图 -->
-        <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
-      </div>
-      <detial v-else-if="isComponent == 1" @searchClick="searchClick" :paramsData="params"> </detial>
+    <div class="icon">
+      <todoDon ref="todoDonRef" :params="tableData" @searchClick="searchClick" @clicksWaterBodies="clicksWaterBodies"></todoDon>
     </div>
-    <div class="PopupWaterlogging" id="PopupWaterlogging" v-if="pipePopupShow">
-      <div class="titleTop">
-        <el-tabs class="PopupWaterloggingtabs">
-          <el-tab-pane label="水质化验记录">
-            <el-table
-              ref="tableModal"
-              :data="tableData2"
-              max-height="320"
-              v-loading="tableLoading"
-              @row-click="clickModal"
-              highlight-current-row
-            >
-              <el-table-column type="index" width="55" label="序号" />
-              <el-table-column label="采样时间" prop="sampleTime" />
-              <el-table-column label="采样点" prop="sampleLocation" />
-              <el-table-column label="透明度（cm）" prop="CLA" />
-              <el-table-column label="溶解氧mg/L" prop="DOX" />
-              <el-table-column label="黑臭程度" prop="blackOdorName">
-                <template #default="scope">
-                  <span
-                    :style="{
-                      color:
-                        scope.row.blackOdorName == '无黑臭'
-                          ? 'greenyellow'
-                          : scope.row.blackOdorName == '轻度黑臭'
-                          ? ' #419fff'
-                          : scope.row.blackOdorName == '中度黑臭'
-                          ? 'orange'
-                          : scope.row.blackOdorName == '重度黑臭'
-                          ? 'red'
-                          : '',
-                    }"
-                  >
-                    {{
-                      scope.row.blackOdorName == '无黑臭'
-                        ? '无黑臭'
-                        : scope.row.blackOdorName == '轻度黑臭'
-                        ? '轻度黑臭'
-                        : scope.row.blackOdorName == '中度黑臭'
-                        ? '中度黑臭'
-                        : scope.row.blackOdorName == '重度黑臭'
-                        ? '重度黑臭'
-                        : ''
-                    }}
-                  </span>
-                </template>
-              </el-table-column>
-            </el-table>
-          </el-tab-pane>
-          <el-tab-pane label="工程治理" class="proimageList">
-            <div style="margin-top: 10px">黑臭水体治理工法： {{ popsdata.treatmentMethod }}</div>
-            <div style="margin-top: 10px">治理前/后照片：</div>
-            <el-image
-              style="width: 150px; margin-top: 10px"
-              v-for="i in popsdata.imageList"
-              :src="i.url"
-              :zoom-rate="1"
-              :initial-index="4"
-              :preview-src-list="[i.url]"
-            />
-          </el-tab-pane>
-        </el-tabs>
-      </div>
-      <div class="closePopup">
-        <el-icon :size="18" @click="closePopup"><Close /></el-icon>
+    <div class="tuli">
+      <div style="margin: 10px; font-size: 18px">图例</div>
+      <div v-for="i in tuliList" class="tuli_img">
+        <img :src="i.icon" alt="" />
+        <div>{{ i.label }}</div>
       </div>
     </div>
+    <!-- gis地图 -->
+    <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
   </div>
+  <!-- 地图水体点击弹窗 -->
+  <el-dialog v-model="dialogShow" title="2022黄汴河水质监测详情" :modal-append-to-body="false" width="900px">
+    <div class="hcstDialog">
+      <div class="part">
+        <div class="title">透明度(cm)</div>
+        <ChartBar3D :refresh="refresh1" :echartData="echartData1" class="chart"></ChartBar3D>
+      </div>
+      <div class="part">
+        <div class="title">氨氮(mg/L)</div>
+        <ChartBar3D :refresh="refresh2" :echartData="echartData2" class="chart"></ChartBar3D>
+      </div>
+      <div class="part">
+        <div class="title">溶解氧(mg/L)</div>
+        <ChartBar3D :refresh="refresh3" :echartData="echartData3" class="chart"></ChartBar3D>
+      </div>
+      <div class="part">
+        <div class="title">氧化还原电位(mV)</div>
+        <ChartBar3D :refresh="refresh4" :echartData="echartData4" class="chart"></ChartBar3D>
+      </div>
+    </div>
+  </el-dialog>
 </template>
 <script setup>
 import { blackOdorpaging, blackOdorpagingriverInfo } from '@/api/spongePerformance/surfaceWater';
-import detial from './detial/index';
 import MapBox from '@/views/gisMapPage/gisMapBox1'; //gis地图
 import todoDon from './todoDon.vue';
+import ChartBar3D from '@/views/sponeScreen/Echarts/echartBar3D.vue';
+
 const { proxy } = getCurrentInstance();
+const dialogShow = ref(true);
+const refresh1 = ref(1);
+const refresh2 = ref(1);
+const refresh3 = ref(1);
+const refresh4 = ref(1);
+const echartData1 = ref({
+  xAxis: ['3月', '4月', '9月', '11月'],
+  seriesData: [52, 35, 69, 86, 22],
+});
+const echartData2 = ref({
+  xAxis: ['3月', '4月', '9月', '11月'],
+  seriesData: [0.8, 0.35, 1.12, 0.9, 0.98],
+});
+const echartData3 = ref({
+  xAxis: ['3月', '4月', '9月', '11月'],
+  seriesData: [5.4, 13, 9.2, 10.4, 8.9],
+});
+const echartData4 = ref({
+  xAxis: ['3月', '4月', '9月', '11月'],
+  seriesData: [126, 162, 119, 86, 113],
+});
 const todoDonRef = ref(null);
 const pipePopupShow = ref(false);
 const popsdata = ref('');
 
 let isComponent = ref(0);
 let tuliList = ref([
-  { label: '未消除', id: 0, icon: '/images/1.1.jpg' },
-  { label: '已消除', id: 1, icon: '/images/1.2.jpg' },
+  { label: '未考核', id: 0, icon: '/images/1.1.jpg' },
+  { label: '已考核', id: 1, icon: '/images/1.2.jpg' },
 ]);
 const tableData2 = ref([]);
 //动态组件
@@ -140,9 +111,6 @@
   }
 };
 
-const closePopup = () => {
-  pipePopupShow.value = false;
-};
 const clicksWaterBodies = row => {
   let ids = '';
   if (row.riverId) {
@@ -155,101 +123,68 @@
 };
 onMounted(() => {});
 </script>
-<style lang="scss" scoped>
-@import '@/assets/styles/variables.module.scss';
-#map {
-  width: 100%;
-  height: 100%;
-}
-.form {
-  left: 10px;
-  top: 10px;
-  z-index: 111;
-  position: absolute;
-  width: 20%;
-}
-.top {
-  position: relative;
-  height: 86vh;
-}
-.icon {
-  right: 0;
-  top: 0;
-  z-index: 111;
-  position: absolute;
-  width: 70%;
-}
-.tuli {
-  left: 20px;
-  bottom: 30px;
-  padding: 10px;
-  z-index: 111;
-  position: absolute;
-  background: $mainColor1;
-  // display: flex;
+<style lang="scss">
+.hcstDialog {
+  display: flex;
   flex-wrap: wrap;
-  align-items: center;
-  text-align: center;
-  color: #fff;
-  .tuli_img {
-    display: flex;
-    width: 100px;
-    align-items: center;
-    margin-top: 8px;
-    img {
-      margin-right: 10px;
-      width: 25px;
+  .part {
+    width: 48%;
+    margin-right: 2%;
+    .title {
+      font-size: 18px;
+      font-weight: bold;
+      color: #fff;
+    }
+    .chart {
+      height: 300px !important;
     }
   }
 }
-.tittle {
-  font-size: 16px;
-  font-weight: bold;
-  width: 200px;
-  height: 40px;
-  line-height: 40px;
-  text-align: center;
-  margin: 5px 0;
-  color: #fff;
-}
-.tittle1 {
-  background: transparent;
-}
+@import '@/assets/styles/variables.module.scss';
+
 .water-analysis-page {
   padding: 20px;
-  overflow-y: hidden;
-}
-
-#PopupWaterlogging {
-  position: fixed;
-  left: 52%;
-  top: 54%;
-  transform: translate(-50%, -50%);
-  width: 700px;
-  height: 410px;
-  background: #021534;
-  border: 1px solid #114f89;
-  z-index: 2000;
-  display: flex;
-
-  .titleTop {
-    width: 95%;
-    display: flex;
-    padding-top: 8px;
-    margin-left: 20px;
-  }
-  .closePopup {
-    width: 5%;
-    margin: 15px;
-    cursor: pointer;
-  }
-  .PopupWaterloggingtabs {
+  height: 100%;
+  position: relative;
+  #map {
     width: 100%;
     height: 100%;
   }
-}
-.proimageList {
-  height: 300px;
-  overflow-y: auto;
+  .form {
+    left: 10px;
+    top: 10px;
+    z-index: 111;
+    position: absolute;
+    width: 20%;
+  }
+  .icon {
+    right: 0;
+    top: 0;
+    z-index: 111;
+    position: absolute;
+    width: 800px;
+  }
+  .tuli {
+    left: 20px;
+    bottom: 30px;
+    padding: 10px;
+    z-index: 111;
+    position: absolute;
+    background: $mainColor1;
+    flex-wrap: wrap;
+    align-items: center;
+    text-align: center;
+    color: #fff;
+    .tuli_img {
+      display: flex;
+      width: 100px;
+      align-items: center;
+      margin-top: 8px;
+      img {
+        margin-right: 10px;
+        width: 25px;
+      }
+    }
+  }
 }
 </style>
diff --git a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/todoDon.vue b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/todoDon.vue
index 9b374ea..d09779a 100644
--- a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/todoDon.vue
+++ b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/todoDon.vue
@@ -1,17 +1,17 @@
 <template>
   <div class="water-analysis-page">
-    <el-table :data="tableData" max-height="500" ref="tableRef" v-loading="tableLoading" @row-click="clickTableRow" highlight-current-row>
+    <el-table :data="tableData" ref="tableRef" v-loading="tableLoading" @row-click="clickTableRow" highlight-current-row>
       <el-table-column label="年度" prop="examineYear" />
       <el-table-column label="黑臭水体/个" prop="unRemoveNum" />
       <el-table-column label="考核水体数/个" prop="totalNum" />
-      <el-table-column label="消除比%" prop="actualPercent">
+      <el-table-column label="目标消除比%" prop="targetPercent" />
+      <el-table-column label="实际消除比%" prop="actualPercent">
         <template #default="{ row }">
           <span style="color: lime">
             {{ row.actualPercent }}
           </span>
         </template>
       </el-table-column>
-      <el-table-column label="目标消除比%" prop="targetPercent" />
       <el-table-column label="达标情况" prop="reachStandard">
         <template #default="scope">
           <span
@@ -26,11 +26,6 @@
           </span>
         </template>
       </el-table-column>
-      <el-table-column label="水体检测记录">
-        <template #default="{ row }">
-          <el-button link type="primary" icon="View" @click="onCheck(row)">查看</el-button>
-        </template>
-      </el-table-column>
     </el-table>
   </div>
 </template>
@@ -58,10 +53,7 @@
     clickTableRow(tableData.value[0]); //默认渲染第一行gis地图
   }
 };
-//查看点击事件
-const onCheck = row => {
-  emits('searchClick', { ...row, type: 1 });
-};
+
 // 表格点击，查看对应的项目情况
 function clickTableRow(row) {
   row.blackOdorSampleInfos &&
@@ -106,36 +98,6 @@
     });
     let geojson1 = turf.featureCollection(coverflowFeature);
     addWaterloggingLayer(geojson1, 'odorousWaterBodies');
-
-    // bus.emit('getGeojsonByType', {
-    //   type: key,
-    //   callback: geojson => {
-    //     setTimeout(() => {
-    //       bus.emit('removeMapDatas', [key]);
-    //       if (!!!geojson.features.length) bus.emit('setGeoJSON', { json: geojson1, key });
-    //       bus.emit('setLayerVisible', { layername: key, isCheck: true });
-    //     }, 2000);
-    //   },
-    // });
-    geojson1.features.forEach(feature => {
-      return newfiberMapbox.addPopup(
-        new mapboxL7.Popup({
-          title: '',
-          html: `
-          <div class='popupMapPoint successPopup'  style=" background-color: rgba(247, 189, 15, 0.5); border: 2px solid #f7bd0f;"><div class='titles' style="padding-left:10px; font-size:16px">${feature.properties.riverName}</div>
-          <div class='part'>黑臭程度：${feature.properties.blackOdorName}</div>
-          <div class='part'>是否达标：${feature.properties.reachStandard}</div>
-          </div>`,
-          lngLat: {
-            lng: feature.geometry.coordinates[0],
-            lat: feature.geometry.coordinates[1],
-          },
-          anchor: 'center',
-          offsets: [0, 60],
-          autoClose: false,
-        })
-      );
-    });
   });
 }
 //地图渲染内涝点

diff --git a/src/views/sponeScreen/Echarts/echartBar3D.vue b/src/views/sponeScreen/Echarts/echartBar3D.vue
index 3d23886..038626c 100644
--- a/src/views/sponeScreen/Echarts/echartBar3D.vue
+++ b/src/views/sponeScreen/Echarts/echartBar3D.vue
@@ -65,14 +65,14 @@
             lineStyle: {
               color: '#384267',
             },
-            show: true,
+            show: false,
           },
           splitLine: {
             show: false,
           },
           axisLine: {
             lineStyle: {
-              color: '#384267',
+              color: '#005CBA',
               width: 1,
               type: 'dashed',
             },
@@ -91,7 +91,7 @@
               color: '#005CBA',
               width: 1,
             },
-            show: true,
+            show: false,
           },
           splitLine: {
             show: true,
@@ -214,7 +214,9 @@
     );
 
     onMounted(() => {
-      init();
+      setTimeout(() => {
+        init();
+      }, 0);
       window.addEventListener('resize', resizeTheChart);
     });
     return {
diff --git a/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue b/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
index 37c3002..3075239 100644
--- a/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
+++ b/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
@@ -1 +1,65 @@
-<template><div>年径流污染削减率管理信息</div></template>
+<template>
+  <!-- 年径流污染削减率 -->
+  <div class="publicContainer">
+    <!-- gis地图 -->
+    <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
+
+    <!-- 海绵设施监测详情 -->
+    <el-dialog v-model="dialogShow" title="海绵设施监测点位详情" :modal-append-to-body="false" width="600px">
+      <el-form :inline="true">
+        <el-form-item label="日期" prop="date">
+          <el-date-picker type="daterange" v-model="dateSearch" value-format="YYYY-MM-DD" placeholder="请选择"></el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+        </el-form-item>
+      </el-form>
+      <div id="chartHMXJ" style="width: 100%; height: 300px"></div>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import MapBox from '@/views/gisMapPage/gisMapBox1'; //gis地图
+import optionChart from './chartOption.js';
+
+const { proxy } = getCurrentInstance();
+const dialogShow = ref(true);
+const charts = ref(null);
+const dateSearch = ref([proxy.moment(new Date()).subtract(60, 'days').format('YYYY-MM-DD'), proxy.moment().format('YYYY-MM-DD')]);
+
+// 历史数据搜索
+function handleQuery() {
+  setTimeout(() => {
+    initChart();
+  });
+}
+
+// echarts初始化
+function initChart() {
+  charts.value && charts.value.dispose();
+  charts.value = proxy.echarts.init(document.getElementById('chartHMXJ'));
+  optionChart.option.xAxis.data = ['2024-06-12 00:00:00', '2024-06-12 00:10:00', '2024-06-12 00:20:00'];
+  optionChart.option.yAxis[1].name = 'SS(mg/L)';
+  optionChart.option.series[0].data = [12, 9, 20]; //降雨量
+  optionChart.option.series[1].name = '进口SS';
+  optionChart.option.series[1].data = [230, 190, 132]; //进口SS
+  optionChart.option.series[2].name = '出口SS';
+  optionChart.option.series[2].data = [110, 90, 103]; //出口SS
+  // 设置鼠标滚轮放大缩小展示数据区间
+  optionChart.option.dataZoom = [{ type: 'inside', startValue: optionChart.option.xAxis.data[optionChart.option.xAxis.data.length / 2] }];
+  if (optionChart.option.xAxis.data.length > 0) {
+    optionChart.option.graphic.invisible = true; //暂无数据
+  } else {
+    optionChart.option.graphic.invisible = false; //暂无数据
+  }
+  charts.value.clear();
+  charts.value.setOption(optionChart.option);
+}
+
+onMounted(() => {
+  handleQuery();
+});
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue b/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
index c06a3dc..35608fb 100644
--- a/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
+++ b/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
@@ -1,3 +1,62 @@
 <template>
-  <div>年径流总量控制率管理信息</div>
+  <!-- 年径流总量控制率 -->
+  <div class="publicContainer">
+    <!-- gis地图 -->
+    <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
+
+    <!-- 海绵设施监测详情 -->
+    <el-dialog v-model="dialogShow" title="海绵设施监测点位详情" :modal-append-to-body="false" width="600px">
+      <el-form :inline="true">
+        <el-form-item label="日期" prop="date">
+          <el-date-picker type="daterange" v-model="dateSearch" value-format="YYYY-MM-DD" placeholder="请选择"></el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+        </el-form-item>
+      </el-form>
+      <div id="chartHMJC" style="width: 100%; height: 300px"></div>
+    </el-dialog>
+  </div>
 </template>
+
+<script setup>
+import MapBox from '@/views/gisMapPage/gisMapBox1'; //gis地图
+import optionChart from './chartOption.js';
+
+const { proxy } = getCurrentInstance();
+const dialogShow = ref(true);
+const charts = ref(null);
+const dateSearch = ref([proxy.moment(new Date()).subtract(60, 'days').format('YYYY-MM-DD'), proxy.moment().format('YYYY-MM-DD')]);
+
+// 历史数据搜索
+function handleQuery() {
+  setTimeout(() => {
+    initChart();
+  });
+}
+
+// echarts初始化
+function initChart() {
+  charts.value && charts.value.dispose();
+  charts.value = proxy.echarts.init(document.getElementById('chartHMJC'));
+  optionChart.option.xAxis.data = ['2024-06-12 00:00:00', '2024-06-12 00:10:00', '2024-06-12 00:20:00'];
+  optionChart.option.series[0].data = [12, 9, 20]; //降雨量
+  optionChart.option.series[1].data = [2.3, 1.9, 3.2]; //进口流量
+  optionChart.option.series[2].data = [1.1, 0.9, 1.3]; //出口流量
+  // 设置鼠标滚轮放大缩小展示数据区间
+  optionChart.option.dataZoom = [{ type: 'inside', startValue: optionChart.option.xAxis.data[optionChart.option.xAxis.data.length / 2] }];
+  if (optionChart.option.xAxis.data.length > 0) {
+    optionChart.option.graphic.invisible = true; //暂无数据
+  } else {
+    optionChart.option.graphic.invisible = false; //暂无数据
+  }
+  charts.value.clear();
+  charts.value.setOption(optionChart.option);
+}
+
+onMounted(() => {
+  handleQuery();
+});
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue b/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue
index d49fc2a..b86ad5d 100644
--- a/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue
+++ b/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue
@@ -1,4 +1,5 @@
 <template>
+  <!-- 污水处理厂进水BOD -->
   <div class="publicContainer">
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
       <el-form-item label="统计年份" prop="date">
@@ -13,7 +14,6 @@
 
       <el-form-item>
         <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
-        <el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button>
         <el-button icon="Refresh" @click="resetQuery">重置</el-button>
       </el-form-item>
     </el-form>
@@ -21,23 +21,17 @@
     <!-- 表格 -->
     <el-table :data="dataList" v-loading="loading" stripe :max-height="580">
       <el-table-column type="index" width="55" label="序号" />
-      <el-table-column label="统计年份" prop="q" />
       <el-table-column label="日期" prop="w" />
-      <el-table-column label="进水BOD平均浓度（mg/L）">
+      <el-table-column label="进水BOD平均浓度(mg/L)">
         <el-table-column prop="monthPlan1" label="西区污水处理厂" />
         <el-table-column prop="monthPlan2" label="东区污水处理厂" />
-        <el-table-column prop="monthPlan3" label="马家河污水厂" />
+        <el-table-column prop="monthPlan3" label="马家河污水处理厂" />
+        <el-table-column prop="monthPlan4" label="包公湖污水处理厂" />
+        <el-table-column prop="monthPlan5" label="祥符区污水处理厂" />
       </el-table-column>
       <el-table-column label="均值" prop="p" />
       <el-table-column label="年度绩效指标" prop="a" />
-      <el-table-column label="评价结论" prop="a" />
-      <el-table-column label="操作" width="240">
-        <template #default="scope">
-          <el-button link icon="View" type="primary" @click="handleDetail(scope.row, 'view')">查看</el-button>
-          <el-button link type="warning" icon="Edit" @click="handleUpdate(scope.row, 'view')">修改</el-button>
-          <el-button link type="danger" icon="Delete" @click="handleDelete(scope.row, 'view')">删除</el-button>
-        </template>
-      </el-table-column>
+      <el-table-column label="年度达标情况" prop="b" />
     </el-table>
     <!-- 分页 -->
     <pagination
@@ -47,117 +41,23 @@
       v-model:limit="queryParams.pageSize"
       @pagination="getList"
     />
-    <!-- 新增弹窗 -->
-    <el-dialog :title="title" v-model="open" width="800px" append-to-body :close-on-click-modal="false">
-      <el-form ref="roleRef" :model="form" :rules="rules" label-width="130px" :disabled="multiple">
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="统计年份:" prop="w">
-              <el-date-picker
-                type="year"
-                v-model="queryParams.date"
-                value-format="YYYY"
-                placeholder="请选择统计年份"
-                style="width: 100%"
-              ></el-date-picker>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="日期:" prop="w">
-              <el-date-picker
-                type="month"
-                v-model="queryParams.date"
-                value-format="YYYY-MM"
-                placeholder="请选择日期"
-                style="width: 100%"
-              ></el-date-picker>
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="西区污水处理厂:" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入西区污水处理厂" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="东区污水处理厂:" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入东区污水处理厂" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="马家河污水厂:" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入马家河污水厂" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="均值:" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入均值" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="年度绩效指标" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入年度绩效指标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="评价结论" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入评价结论标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-      </el-form>
-      <template #footer>
-        <div class="dialog-footer">
-          <el-button type="primary" @click="submitForm">确 定</el-button>
-          <el-button @click="cancel">取 消</el-button>
-        </div>
-      </template>
-    </el-dialog>
   </div>
 </template>
 <script setup name="WaterSupplyWaterPlants">
 const { proxy } = getCurrentInstance();
-const open = ref(false);
-const multiple = ref(false);
 const showSearch = ref(true);
-const Xcfrequency = ref([
-  {
-    value: 'tian',
-    label: '天',
-  },
-  {
-    value: 'zhou',
-    label: '周',
-  },
-]);
 const loading = ref(true);
 const total = ref(0);
-const title = ref('');
 const dataList = ref([]);
 const AllData = reactive({
   id: '',
-  form: {},
   queryParams: {
     pageNum: 1,
     pageSize: 10,
-    caseType: 1,
-    handleStatus: '',
-    searchContent: '',
-  },
-  rules: {
-    id: [{ required: true, message: '请输入', trigger: 'blur' }],
-    eventDescription: [{ required: true, message: '请输入', trigger: 'blur' }],
+    date: null,
   },
 });
-const { queryParams, form, rules } = toRefs(AllData);
+const { queryParams } = toRefs(AllData);
 //搜索
 function handleQuery() {
   getList();
@@ -167,39 +67,6 @@
   proxy.resetForm('queryRef');
   handleQuery();
 }
-// 新增
-function handleAdd() {
-  title.value = '新增水厂供水';
-  open.value = true;
-  form.value = {};
-  multiple.value = false;
-  form.value.fileTag = Xcfrequency.value[0].value;
-}
-// 新增中取消事件
-function cancel() {
-  open.value = false;
-  proxy.resetForm('roleRef');
-}
-
-// 巡查频率下拉框点击事件
-function changeStation(value) {
-  // console.log(value, 'value');
-}
-
-//查看详情操作
-function handleDetail(row) {
-  open.value = true;
-  title.value = '查看水厂供水';
-  multiple.value = true;
-  form.value = row;
-}
-// 修改按钮操作
-function handleUpdate(row) {
-  open.value = true;
-  title.value = '修改水厂供水';
-  multiple.value = false;
-  form.value = { ...row };
-}
 
 /** 查询列表 */
 const getList = async () => {
@@ -211,12 +78,4 @@
   getList();
 });
 </script>
-<style scoped lang="scss">
-.dituclass {
-  width: 100%;
-  height: 300px;
-  // background: red;
-  margin-bottom: 10px;
-  border: 1px solid #004565;
-}
-</style>
+<style scoped lang="scss"></style>
diff --git a/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue b/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue
index 6ce3f37..94c365b 100644
--- a/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue
+++ b/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue
@@ -1,34 +1,31 @@
 <template>
+  <!-- 城市生活污水集中收集率 -->
   <div class="publicContainer">
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
-      <el-form-item label="污水厂名称:" prop="searchContent">
-        <el-input v-model="queryParams.searchContent" placeholder="请输入污水厂名称" clearable style="width: 180px" />
-      </el-form-item>
       <el-form-item label="统计年份" prop="date">
         <el-date-picker type="year" v-model="queryParams.date" value-format="YYYY" placeholder="请选择统计年份"></el-date-picker>
       </el-form-item>
 
       <el-form-item>
         <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
-        <el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button>
         <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+        <el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button>
       </el-form-item>
     </el-form>
 
     <!-- 表格 -->
     <el-table :data="dataList" v-loading="loading" stripe :max-height="580">
       <el-table-column type="index" width="55" label="序号" />
-      <el-table-column label="污水厂名称" prop="q" />
-      <el-table-column label="编码" prop="w" />
       <el-table-column label="统计年份" prop="o" />
-      <el-table-column label="年度绩效指标" prop="p" />
+      <el-table-column label="污水厂名称" prop="q" />
       <el-table-column label="累计处理水量(万t)" prop="e" />
       <el-table-column label="进水BOD平均浓度(mg/L)" prop="r" />
       <el-table-column label="BOD 削减量(g)" prop="t" />
       <el-table-column label="城区用水人口(万人)" prop="y" />
       <el-table-column label="人均日生活污染排放量(g/人·d)" prop="u" />
-      <el-table-column label="城市生活污水集中收集率(%)" prop="i" />
-      <el-table-column label="评价结论" prop="a" />
+      <el-table-column label="目标收集率(%)" prop="p" />
+      <el-table-column label="实际收集率(%)" prop="i" />
+      <el-table-column label="达标情况" prop="a" />
       <el-table-column label="操作" width="240">
         <template #default="scope">
           <el-button link icon="View" type="primary" @click="handleDetail(scope.row, 'view')">查看</el-button>
@@ -46,93 +43,46 @@
       @pagination="getList"
     />
     <!-- 新增弹窗 -->
-    <el-dialog :title="title" v-model="open" width="1100px" append-to-body :close-on-click-modal="false">
+    <el-dialog :title="title" v-model="open" width="600px" append-to-body :close-on-click-modal="false">
       <el-form ref="roleRef" :model="form" :rules="rules" label-width="220px" :disabled="multiple">
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="污水厂名称:" prop="w">
-              <el-input v-model="form.w" placeholder="请输入污水厂名称" clearable style="width: 100%" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="编码:" prop="w">
-              <el-input v-model="form.w" placeholder="请输入编码" clearable style="width: 100%" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="累计处理水量(万t):" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入累计处理水量(万t)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="进水BOD平均浓度(mg/L):" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入进水BOD平均浓度(mg/L)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="BOD 削减量(g):" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入BOD 削减量(g)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="城区用水人口(万人):" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入城区用水人口(万人)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="人均日生活污染排放量(g/人·d):" prop="lon">
-              <el-input-number
-                v-model="form.lon"
-                placeholder="请输入人均日生活污染排放量(g/人·d)"
-                style="width: 100%"
-                controls-position="right"
-              />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="城市生活污水集中收集率(%):" prop="lat">
-              <el-input-number
-                v-model="form.lat"
-                placeholder="请输入城市生活污水集中收集率(%)"
-                style="width: 100%"
-                controls-position="right"
-              />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="统计年份" prop="date">
-              <el-date-picker
-                type="year"
-                v-model="queryParams.date"
-                value-format="YYYY"
-                placeholder="请选择统计年份"
-                style="width: 100%"
-              ></el-date-picker>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="年度绩效指标" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入年度绩效指标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="评价结论" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入评价结论标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-        </el-row>
+        <el-form-item label="统计年份" prop="date">
+          <el-date-picker
+            type="year"
+            v-model="queryParams.date"
+            value-format="YYYY"
+            placeholder="请选择统计年份"
+            style="width: 100%"
+          ></el-date-picker>
+        </el-form-item>
+        <el-form-item label="污水厂名称:" prop="w">
+          <el-input v-model="form.w" placeholder="请输入污水厂名称" clearable style="width: 100%" />
+        </el-form-item>
+        <el-form-item label="累计处理水量(万t):" prop="lon">
+          <el-input-number v-model="form.lon" placeholder="请输入累计处理水量(万t)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="进水BOD平均浓度(mg/L):" prop="lat">
+          <el-input-number v-model="form.lat" placeholder="请输入进水BOD平均浓度(mg/L)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="BOD 削减量(g):" prop="lon">
+          <el-input-number v-model="form.lon" placeholder="请输入BOD 削减量(g)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="城区用水人口(万人):" prop="lat">
+          <el-input-number v-model="form.lat" placeholder="请输入城区用水人口(万人)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="人均日生活污染排放量(g/人·d):" prop="lon">
+          <el-input-number
+            v-model="form.lon"
+            placeholder="请输入人均日生活污染排放量(g/人·d)"
+            style="width: 100%"
+            controls-position="right"
+          />
+        </el-form-item>
+        <el-form-item label="目标收集率(%):" prop="date">
+          <el-input-number v-model="form.lon" placeholder="请输入目标收集率" style="width: 100%" />
+        </el-form-item>
+        <el-form-item label="实际收集率(%):" prop="lat">
+          <el-input-number v-model="form.lat" placeholder="请输入实际收集率(%)" style="width: 100%" controls-position="right" />
+        </el-form-item>
       </el-form>
       <template #footer>
         <div class="dialog-footer">
@@ -170,7 +120,6 @@
     pageSize: 10,
     caseType: 1,
     handleStatus: '',
-    searchContent: '',
   },
   rules: {
     id: [{ required: true, message: '请输入', trigger: 'blur' }],
diff --git a/src/views/spongePerformance/OutputPerformance/chartOption.js b/src/views/spongePerformance/OutputPerformance/chartOption.js
new file mode 100644
index 0000000..c0e300f
--- /dev/null
+++ b/src/views/spongePerformance/OutputPerformance/chartOption.js
@@ -0,0 +1,137 @@
+import useUserStore from '@/store/modules/user';
+import * as echarts from 'echarts';
+const pinias = useUserStore();
+
+let optionChart = {
+  // 柱状图+折线图
+  option: {
+    color: pinias.$state.chartColor,
+    // 显示暂无数据
+    graphic: {
+      type: 'text', // 类型：文本
+      left: 'center',
+      top: 'middle',
+      silent: true, // 不响应事件
+      invisible: false, // 有数据就隐藏
+      style: {
+        fill: '#c6c6c6',
+        fontWeight: 'bold',
+        text: '暂无数据',
+        fontFamily: 'Microsoft YaHei',
+        fontSize: '18px',
+      },
+    },
+    tooltip: {
+      trigger: 'axis',
+      confine: true, //是否将 tooltip 框限制在图表的区域内
+    },
+    title: {
+      left: 'left',
+      text: '',
+      top: 10,
+      bottom: 10,
+      left: 10,
+      textStyle: {
+        color: '#545E75', //字体颜色
+        fontSize: 16, //字体大小
+      },
+    },
+    grid: {
+      left: '3%',
+      right: '5%',
+      top: '20%',
+      bottom: '3%',
+      containLabel: true,
+    },
+    legend: {
+      top: '2%',
+      orient: 'horizontal', //horizontal
+      left: 'center', //left ,center
+      textStyle: {
+        color: 'inherit',
+      },
+    },
+    xAxis: {
+      type: 'category',
+      position: 'bottom',
+      data: ['2023', '2024', '2025'],
+      axisLabel: {
+        color: '#c6c6c6',
+      },
+      axisLine: {
+        lineStyle: {
+          color: '#066592',
+        },
+      },
+    },
+    yAxis: [
+      {
+        name: '降雨量(mm)',
+        type: 'value',
+        inverse: true, //翻转
+        nameLocation: 'start', // 坐标轴名称显示位置
+        nameGap: 15, // 坐标轴名称与轴线之间的距离
+        nameTextStyle: {
+          color: '#c6c6c6', //字体颜色
+          fontSize: 12, //字体大小
+          align: 'center', // 文字水平对齐方式，默认自动（'left'，'center'，'right'）
+        },
+        splitLine: {
+          lineStyle: {
+            type: 'dashed',
+            color: '#066592',
+          },
+        },
+        axisLabel: {
+          color: '#c6c6c6',
+        },
+      },
+      {
+        name: '流量(m³/h)',
+        type: 'value',
+        nameLocation: 'end', // 坐标轴名称显示位置
+        nameGap: 15, // 坐标轴名称与轴线之间的距离
+        nameTextStyle: {
+          color: '#c6c6c6', //字体颜色
+          fontSize: 12, //字体大小
+          align: 'center', // 文字水平对齐方式，默认自动（'left'，'center'，'right'）
+        },
+        axisLabel: {
+          color: '#c6c6c6',
+        },
+        splitLine: {
+          lineStyle: {
+            type: 'dashed',
+            color: '#066592',
+          },
+        },
+      },
+    ],
+    series: [
+      {
+        name: '降雨量',
+        type: 'bar',
+        barWidth: 10,
+        yAxisIndex: 0,
+        data: [24, 12, 9],
+      },
+      {
+        name: '进口流量',
+        type: 'line',
+        smooth: true,
+        yAxisIndex: 1,
+        symbolSize: 8,
+        data: [14, 8, 5],
+      },
+      {
+        name: '出口流量',
+        type: 'line',
+        smooth: true,
+        yAxisIndex: 1,
+        symbolSize: 8,
+        data: [4, 2, 1],
+      },
+    ],
+  },
+};
+export default optionChart;
diff --git a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/index.vue b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/index.vue
deleted file mode 100644
index bc19015..0000000
--- a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/index.vue
+++ /dev/null
@@ -1,367 +0,0 @@
-<template>
-  <!-- 地表水体水质达标 -->
-  <div class="publicContainer" v-if="back">
-    <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
-      <el-form-item label="考核水体:" prop="riverId">
-        <el-select clearable v-model="queryParams.riverId" class="m-2" placeholder="请选择" size="mini">
-          <el-option v-for="item in responseAA" :key="item.id" :label="item.riverName" :value="Number(item.id)" />
-        </el-select>
-      </el-form-item>
-
-      <el-form-item label="采样年份:" prop="sampleYear">
-        <el-date-picker
-          v-model="queryParams.sampleYear"
-          type="year"
-          placeholder="请选择"
-          format="YYYY"
-          value-format="YYYY"
-          @change="change"
-        />
-      </el-form-item>
-
-      <el-form-item label="评价结果:" prop="blackOdor">
-        <el-select clearable v-model="queryParams.blackOdor" class="m-2" placeholder="请选择" size="mini">
-          <el-option v-for="item in black_odor_level" :key="item.value" :label="item.label" :value="item.value" />
-        </el-select>
-      </el-form-item>
-      <el-form-item>
-        <el-button type="primary" icon="Search" @click="searchData">搜索</el-button>
-        <el-button icon="Refresh" @click="resetData">重置</el-button>
-        <el-button icon="CaretLeft" @click="resect" class="zbBtn"> 返回</el-button>
-        <el-button icon="Plus" type="success" @click="addData">新增</el-button>
-      </el-form-item>
-    </el-form>
-    <!-- 表格 -->
-    <el-table :data="tableData" v-loading="tableLoading" :max-height="650">
-      <el-table-column type="index" width="55" label="序号" />
-      <el-table-column v-for="item in informationDate" :label="item.value" :prop="item.key">
-        <template #default="scope" v-if="item.key == 'blackOdorName'">
-          <span
-            :style="{
-              color:
-                scope.row.blackOdorName == '无黑臭'
-                  ? 'greenyellow'
-                  : scope.row.blackOdorName == '轻度黑臭'
-                  ? ' #419fff'
-                  : scope.row.blackOdorName == '中度黑臭'
-                  ? 'orange'
-                  : scope.row.blackOdorName == '重度黑臭'
-                  ? 'red'
-                  : '',
-            }"
-          >
-            {{
-              scope.row.blackOdorName == '无黑臭'
-                ? '无黑臭'
-                : scope.row.blackOdorName == '轻度黑臭'
-                ? '轻度黑臭'
-                : scope.row.blackOdorName == '中度黑臭'
-                ? '中度黑臭'
-                : scope.row.blackOdorName == '重度黑臭'
-                ? '重度黑臭'
-                : ''
-            }}
-          </span>
-        </template>
-      </el-table-column>
-      <el-table-column label="操作" show-overflow-tooltip width="200">
-        <template #default="{ row }">
-          <el-button type="primary" link @click="checkDetail(row)">详情</el-button>
-          <el-button type="primary" link @click="editData(row)">修改</el-button>
-          <el-button type="danger" link @click="deleteData(row)">删除</el-button>
-        </template>
-      </el-table-column>
-    </el-table>
-    <!-- 分页 -->
-    <pagination
-      v-show="total > 0"
-      :total="total"
-      v-model:page="queryParams.pageNum"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getDataList"
-    />
-    <!-- 添加 修改 查看彈框 -->
-    <el-dialog :title="dialogTitle" v-model="showDialog" width="70%" :close-on-click-modal="false">
-      <el-form ref="ruleForm" :model="formData" :rules="formRules" label-width="auto" :disabled="isDisab">
-        <el-row>
-          <el-form-item label="考核水体:" prop="riverId" style="width: 45%">
-            <el-select clearable v-model="formData.riverId" class="m-2" placeholder="请选择" size="mini" style="width: 100%">
-              <el-option v-for="item in responseAA" :key="item.id" :label="item.riverName" :value="Number(item.id)" />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="采样时间:" prop="sampleTime" style="width: 45%">
-            <el-date-picker
-              style="width: 100%"
-              clearable
-              format="YYYY-MM-DD"
-              value-format="YYYY-MM-DD"
-              v-model="formData.sampleTime"
-              type="date"
-            />
-          </el-form-item>
-          <el-form-item label="采样点:" prop="sampleLocation" style="width: 45%">
-            <el-input v-model="formData.sampleLocation" placeholder="请输入" style="width: 100%" clearable />
-          </el-form-item>
-
-          <el-form-item v-for="item in Dbssz" :label="item.sampleFactorName" :prop="item.sampleFactor" style="width: 45%">
-            <el-input-number
-              v-model="formData[item.sampleFactor]"
-              placeholder="请输入"
-              clearable
-              controls-position="right"
-              style="width: 400px"
-            />
-          </el-form-item>
-
-          <el-form-item label="黑臭程度:" prop="blackOdorName" style="width: 45%" v-if="hiddentext">
-            <div
-              :style="{
-                color:
-                  formData.blackOdorName == '无黑臭'
-                    ? 'greenyellow'
-                    : formData.blackOdorName == '轻度黑臭'
-                    ? ' #419fff'
-                    : formData.blackOdorName == '中度黑臭'
-                    ? 'orange'
-                    : formData.blackOdorName == '重度黑臭'
-                    ? 'red'
-                    : '',
-              }"
-            >
-              {{
-                formData.blackOdorName == '无黑臭'
-                  ? '无黑臭'
-                  : formData.blackOdorName == '轻度黑臭'
-                  ? '轻度黑臭'
-                  : formData.blackOdorName == '中度黑臭'
-                  ? '中度黑臭'
-                  : formData.blackOdorName == '重度黑臭'
-                  ? '重度黑臭'
-                  : ''
-              }}
-            </div>
-          </el-form-item>
-        </el-row>
-      </el-form>
-      <template #footer>
-        <div class="dialog-footer">
-          <el-button type="primary" @click="submitForm" v-show="!isDisab">保 存</el-button>
-          <el-button @click="cancel">关闭</el-button>
-        </div>
-      </template>
-    </el-dialog>
-  </div>
-  <waterquality v-else />
-</template>
-<script setup>
-import {
-  blackOdorUserId,
-  riverInfoWater,
-  blackOdorAdd,
-  blackOdorDelete,
-  sampleConfigconfiguration,
-  blackOdorinformation,
-  blackOdorpaging,
-  blackOdorEdit,
-} from '@/api/spongePerformance/surfaceWater';
-const { proxy } = getCurrentInstance();
-const { hc_sample_factor, sample_type, black_odor_level } = proxy.useDict('hc_sample_factor', 'sample_type', 'black_odor_level');
-import { defineEmits } from 'vue';
-const isDisab = ref(false);
-const isDisatext = ref(false);
-const showDialog = ref(false);
-const showSearch = ref(true);
-const tableLoading = ref(true);
-const hiddentext = ref(false);
-const back = ref(true);
-const responseAA = ref([]);
-const total = ref(0);
-const dialogTitle = ref('');
-const tableData = ref([]);
-const Dbssz = ref([]);
-const informationDate = ref([]);
-const emits = defineEmits();
-const { paramsData } = defineProps(['paramsData']);
-const AllData = reactive({
-  formData: {
-    configs: [],
-  },
-  queryParams: {
-    pageNum: 1,
-    pageSize: 10,
-    sampleTime: '',
-    riverId: '',
-    blackOdor: '',
-    sampleYear: '',
-    sampleLocation: '',
-  },
-  formRules: {
-    riverId: [{ required: true, message: '请选择', trigger: 'blur' }],
-    sampleTime: [{ required: true, message: '请选择', trigger: 'blur' }],
-  },
-});
-const { queryParams, formData, formRules } = toRefs(AllData);
-
-/** 表单重置 */
-function resetForm() {
-  formData.value = {
-    riverId: undefined,
-    sampleYear: undefined,
-    sampleTime: undefined,
-    blackOdor: undefined,
-    sampleLocation: undefined,
-    riverType: 'black_odor',
-  };
-  proxy.resetForm('ruleForm');
-}
-function resect() {
-  emits('searchClick', 0);
-}
-/** 新增按钮操作 */
-function addData() {
-  resetForm();
-  hiddentext.value = false;
-  isDisab.value = false;
-  showDialog.value = true;
-  dialogTitle.value = '新增检测记录';
-}
-
-//搜索
-function searchData() {
-  queryParams.value.pageNum = 1;
-  getDataList();
-}
-//重置
-function resetData() {
-  proxy.resetForm('queryRef');
-  searchData();
-}
-// 获取下拉框数据
-const getSelData = async () => {
-  let params = {
-    riverType: 'black_odor',
-  };
-  riverInfoWater(params).then(response => {
-    if (response.code == 200) {
-      responseAA.value = response.data;
-    }
-  });
-};
-// 新增中的 动态数据
-const Dbsszconfiguration = async () => {
-  let params = {
-    sampleType: 'hcst',
-  };
-  sampleConfigconfiguration(params).then(response => {
-    if (response.code == 200) {
-      Dbssz.value = response.data;
-      Dbssz.value.forEach(item => {
-        formRules.value[item.sampleFactor] = [{ required: true, message: '请输入', trigger: 'blur', type: 'number' }];
-      });
-      console.log(formRules.value);
-    }
-  });
-};
-//地水质采样信息动态表头
-const information = async () => {
-  blackOdorinformation().then(res => {
-    if (res.code == 200) {
-      informationDate.value = res.data;
-    }
-  });
-};
-
-/** 查询列表 */
-const getDataList = async () => {
-  tableLoading.value = true;
-  const res = await blackOdorpaging(queryParams.value);
-  tableData.value = res.data.records;
-  total.value = res.data.total || 0;
-  tableLoading.value = false;
-};
-/** 新增弹框 修改弹框 提交按钮 */
-async function submitForm() {
-  proxy.$refs['ruleForm'].validate(valid => {
-    if (valid) {
-      formData.value.configs = [];
-      let obj = [];
-      Dbssz.value.forEach(k => {
-        obj.push(k.sampleFactor);
-      });
-      obj.forEach(element => {
-        formData.value.configs.push({
-          factor: element,
-          value: formData.value[element],
-        });
-        delete formData.value[element];
-      });
-      console.log(formData.value, 'formData.value.configs');
-
-      if (formData.value.id != undefined) {
-        blackOdorEdit(formData.value).then(() => {
-          console.log(formData.value, 'formData.value');
-          proxy.$modal.msgSuccess('修改成功');
-          showDialog.value = false;
-          getDataList();
-        });
-      } else {
-        blackOdorAdd(formData.value).then(() => {
-          console.log(formData.value, 'formData.valueformData.valueformData.value');
-          proxy.$modal.msgSuccess('新增成功');
-          showDialog.value = false;
-          getDataList();
-        });
-      }
-    }
-  });
-}
-//表格修改
-function editData(row) {
-  formData.value = { ...row };
-  isDisab.value = false;
-  isDisatext.value = true;
-  showDialog.value = true;
-  dialogTitle.value = '修改检测记录';
-  hiddentext.value = true;
-  console.log(row, 'row');
-}
-// 表格删除
-function deleteData(row) {
-  proxy.$modal
-    .confirm('是否确认删除？')
-    .then(async () => {
-      const res = await blackOdorDelete(row.id);
-      if (res?.code !== 200) return;
-      proxy.$modal.msgSuccess('操作成功！');
-      getDataList();
-    })
-    .catch(() => {});
-}
-//详情按钮
-function checkDetail(row) {
-  dialogTitle.value = '查看检测记录';
-  isDisab.value = true;
-  showDialog.value = true;
-  isDisatext.value = true;
-  hiddentext.value = true;
-  formData.value = { ...row };
-}
-
-/** 取消按钮 */
-function cancel() {
-  showDialog.value = false;
-  resetForm();
-}
-function change(val) {
-  console.log(val, 'val');
-  queryParams.value.sampleYear = val;
-}
-onMounted(() => {
-  queryParams.value.sampleYear = paramsData?.examineYear || '';
-  getDataList();
-  getSelData();
-  Dbsszconfiguration();
-  information();
-});
-</script>
-<style scoped lang="scss"></style>
diff --git a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/tableDalgo.vue b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/tableDalgo.vue
deleted file mode 100644
index 7a01aeb..0000000
--- a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/tableDalgo.vue
+++ /dev/null
@@ -1,155 +0,0 @@
-<template>
-  <div class="water-analysis-page">
-    <div class="top">
-      <el-form label-width="auto" :rules="projectEstimateRules" inline ref="ruleForm" :model="FormList" :disabled="typeList.type == 1">
-        <div v-for="i in typeList.monitorDynamicTableTitleList" style="display: flex; flex-direction: column">
-          <el-form-item
-            v-if="i.key == 'real' || i.key == 'target'"
-            v-for="k in i.titleGroup"
-            :label="i.key == 'real' ? '实际' + k.value + ':' : '目标' + k.value + ':'"
-            :prop="k.key"
-            :disabled="typeList.type == 1 || typeList.type == 2"
-          >
-            <el-input
-              :disabled="i.key != 'real'"
-              v-model="FormList[k.key]"
-              :placeholder="k.placeholder"
-              @change="ChangeClick(k.key, FormList[k.key])"
-            >
-            </el-input>
-          </el-form-item>
-          <el-form-item v-else :label="i.value + ':'" :prop="i.key" :disabled="typeList.type == 1 || typeList.type == 2">
-            <el-upload
-              v-if="i.key == 'attachFileList'"
-              v-model:file-list="fileList1"
-              class="upload-demo"
-              action="/system/upload"
-              :headers="uploadHeader"
-              multiple
-              :on-preview="handlePreview"
-              :before-remove="beforeRemove"
-              style="width: 100vh"
-            >
-              <el-button type="primary">选择文件</el-button>
-            </el-upload>
-            <div
-              v-else-if="i.key == 'standardFlag' && typeList.iSstandardFlag"
-              :style="{ color: typeList.iSstandardFlag ? '#108ee9' : 'red' }"
-            >
-              {{ typeList.iSstandardFlag ? '达标' : '未达标' }}
-            </div>
-            <div
-              v-else-if="i.key == 'standardFlag' && !typeList.iSstandardFlag"
-              :style="{ color: IsStandFlag1 > 0 && IsStandFlag2 > 0 ? '#108ee9' : 'red' }"
-            >
-              <span v-show="false">{{ IsStandFlag1 > 0 && IsStandFlag2 > 0 ? (IsStandText = 1) : (IsStandText = 0) }}</span>
-              {{ IsStandFlag1 > 0 && IsStandFlag2 > 0 ? '达标' : '未达标' }}
-            </div>
-            <div v-else>
-              {{ FormList[i.key] }}
-            </div>
-          </el-form-item>
-        </div>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script setup>
-import { projectInfoEdit } from '@/api/spongePerformance/prevention';
-import { getToken } from '@/utils/auth';
-import { projectEstimateRules } from '@/utils/rules';
-import { ElMessage, ElMessageBox } from 'element-plus';
-const { proxy } = getCurrentInstance();
-const { fund_source } = proxy.useDict('fund_source');
-const uploadHeader = ref({
-  Authorization: 'Bearer ' + getToken(),
-});
-const { typeList } = defineProps(['typeList']);
-const emits = defineEmits();
-defineExpose({ submit, closed, resetFiled });
-const IsStandFlag1 = ref(0);
-const IsStandFlag2 = ref(0);
-const IsStandText = ref('');
-let FormList = ref({ projectNo: '', fileSaveRequestList: [] });
-function ChangeClick(v, m) {
-  console.log('v', v);
-  console.log('m', m);
-  typeList.iSstandardFlag = null;
-  if (v == 'realCXQ') {
-    console.log('object1', m * 1 - FormList.value.targetCXQ * 1);
-    IsStandFlag1.value = m * 1 - FormList.value.targetCXQ * 1;
-  } else {
-    console.log('object2', m * 1 - FormList.value.targetDBMJZJCQMJ * 1);
-    IsStandFlag2.value = m * 1 - FormList.value.targetCXQ * 1;
-  }
-}
-const fileList1 = ref([]);
-function handlePreview(file) {
-  return ElMessageBox.confirm(`下载此文件: ${file.name}？`).then(
-    () => window.open(file.url),
-    () => false
-  );
-}
-function beforeRemove(file) {
-  return true;
-}
-function submit() {
-  proxy.$refs.ruleForm.validate(valid => {
-    if (valid) {
-      const fileSaveRequestList = [];
-      fileList1.value.forEach(element => {
-        if (element.hasOwnProperty('response')) {
-          element.response.data.refType = 'proProjectBudget';
-          fileSaveRequestList.push(element.response.data);
-        } else {
-          fileSaveRequestList.push(element);
-        }
-      });
-      const itemUpdateFieldRequestList = [
-        { id: typeList.data['CXQ-id'], realValue: FormList.value.realCXQ, standardFlag: IsStandFlag1.value > 0 ? 1 : 0 },
-        {
-          id: typeList.data['DBMJZJCQMJ-id' || 0],
-          realValue: FormList.value.realDBMJZJCQMJ,
-          standardFlag: IsStandFlag2.value > 0 ? 1 : 0,
-        },
-      ];
-      FormList.value = {
-        itemDataType: typeList.itemDataType,
-        standardFlag: typeList.iSstandardFlag || IsStandText.value,
-        itemUpdateFieldRequestList,
-        fileSaveRequestList,
-        performanceEvaluateId: typeList.data.performanceEvaluateId,
-      };
-      console.log('FormList.value', FormList.value);
-      projectInfoEdit(FormList.value).then(({ code }) => {
-        if (code == 200) {
-          emits('onModalClose');
-        }
-      });
-    }
-    // }
-  });
-}
-function loadProjerctListData() {
-  console.log('typeListtypeList', typeList);
-  FormList.value = typeList.data;
-  fileList1.value = typeList.fileList1;
-  proxy.$refs.ruleForm.resetFields();
-}
-function resetFiled() {
-  proxy.$refs.ruleForm.resetFields();
-  fileList1.value = [];
-}
-
-function closed() {
-  emits('onModalClose');
-}
-onMounted(() => {
-  loadProjerctListData();
-});
-</script>
-<style lang="scss" scoped>
-.water-analysis-page {
-  padding: 20px;
-}
-</style>
diff --git a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/todoDon.vue b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/todoDon.vue
deleted file mode 100644
index b3e573b..0000000
--- a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/todoDon.vue
+++ /dev/null
@@ -1,156 +0,0 @@
-<template>
-  <div class="water-analysis-page">
-    <el-table :key="isFlag" :data="tableData" max-height="500" v-loading="tableLoading">
-      <el-table-column type="index" width="55" label="序号" />
-      <el-table-column :label="i.value" :prop="i.key" show-overflow-tooltip v-for="i in cloums">
-        <el-table-column v-for="item in i.titleGroup" :label="item.value" :prop="item.key" width="200"> </el-table-column>
-        <template #default="{ row }" v-if="i.key == 'standardFlag'">
-          <span :style="{ color: isDb(row.realCXQ, row.targetCXQ, row.realDBMJZJCQMJ, row.targetDBMJZJCQMJ) ? '#108ee9' : 'red' }">
-            <el-tag :type="isDb(row.realCXQ, row.targetCXQ, row.realDBMJZJCQMJ, row.targetDBMJZJCQMJ) ? 'success' : 'error'">{{
-              isDb(row.realCXQ, row.targetCXQ, row.realDBMJZJCQMJ, row.targetDBMJZJCQMJ) ? '达标' : '未达标'
-            }}</el-tag>
-          </span>
-        </template>
-        <template #default="{ row }" v-if="i.key == 'attachFileList'">
-          <span style="color: #108ee9" v-for="i in row?.attachFileList" @click="handlePreview(i)">{{ i.name }} </span>
-        </template>
-        <template #default="{ row }" v-if="i.key == 'year'">
-          {{ row.year }}
-        </template>
-        <template #default="{ row }" v-if="i.key == 'updateBy'">
-          {{ row.updateBy }}
-        </template>
-        <template #default="{ row }" v-if="i.key == 'updateTime'">
-          {{ row.updateTime }}
-        </template>
-      </el-table-column>
-      <el-table-column label="操作" width="250">
-        <template #default="{ row }">
-          <el-button link type="primary" icon="View" @click="onCheck(row, 1, '详情')">详情</el-button>
-          <el-button link icon="Edit" type="warning" @click="onCheck(row, 2, '修改')">修改</el-button>
-          <el-button link icon="Delete" type="danger" @click="onCheck(row, 3)">删除</el-button>
-        </template>
-      </el-table-column>
-    </el-table>
-  </div>
-  <pagination
-    v-show="totals > 0"
-    :total="totals"
-    v-model:page="FormList.pageNum"
-    v-model:limit="FormList.pageSize"
-    @pagination="dynamic_page_data_typeM(FormList)"
-  />
-  <el-dialog
-    v-model="visible"
-    :title="'内涝防治标准' + FormList.title"
-    :modal-append-to-body="false"
-    :close-on-click-modal="false"
-    width="51%"
-  >
-    <tableDalgo ref="tableDalgoRef" v-if="visible" @onModalClose="onModalClose" :typeList="typeList" :key="isFlag"> </tableDalgo>
-    <template #footer>
-      <div class="dialog-footer">
-        <el-button v-show="typeList.type == '2'" @click="open2" type="primary">保存</el-button>
-        <el-button @click="visible = false">关闭</el-button>
-      </div>
-    </template>
-  </el-dialog>
-</template>
-<script setup>
-import { projectInfoDelete, dynamic_page_data_type } from '@/api/spongePerformance/prevention';
-import { FileSystemList } from '@/api/project/tenderReview';
-import tableDalgo from './tableDalgo.vue';
-import { ElMessage, ElMessageBox } from 'element-plus';
-const { proxy } = getCurrentInstance();
-import { reactive } from 'vue';
-let visible = ref(false);
-let isFlag = ref(1);
-const cloums = ref([]);
-const tableDalgoRef = ref();
-const { params } = defineProps(['params']);
-const FormList = ref({
-  pageNum: 1,
-  pageSize: 10,
-  title: '',
-});
-const totals = ref(0);
-//动态组件
-let dataForm = reactive({
-  tableData: '',
-  tableDateTwo: '',
-  tableLoading: true,
-});
-let { date, tableData, tableDateTwo, tableLoading } = toRefs(dataForm);
-//获取列表数据
-//搜索
-const search = p => {
-  FormList.value.pageNum = 1;
-  dynamic_page_data_typeM(p);
-  isFlag.value++;
-};
-defineExpose({ search });
-// 查看上报数据
-let typeList = ref({});
-const onCheck = (row, ty, t) => {
-  FormList.value.title = t;
-  if (ty == 1 || ty == 2) {
-    typeList.value = {
-      ...params,
-      data: row,
-      type: ty,
-      monitorDynamicTableTitleList: cloums.value,
-      iSstandardFlag: isDb(row.realCXQ, row.targetCXQ, row.realDBMJZJCQMJ, row.targetDBMJZJCQMJ),
-    };
-    FileSystemList({
-      refId: row.performanceEvaluateId,
-      refType: 'proProjectBudget',
-    }).then(({ data }) => {
-      typeList.value.fileList1 = data;
-      visible.value = true;
-    });
-    // 获取文件列表
-  } else if (ty == 3) {
-    proxy.$modal
-      .confirm(`是否确认删除?`)
-      .then(async () => {
-        projectInfoDeleteM(row.performanceEvaluateId);
-        getTableData();
-      })
-      .catch(() => {});
-  }
-};
-//删除
-const projectInfoDeleteM = async id => {
-  let { code } = await projectInfoDelete(id);
-  search(p);
-};
-const dynamic_page_data_typeM = async id => {
-  let { code, data, monitorDynamicTableTitleList, total } = await dynamic_page_data_type(id);
-  tableData.value = data;
-  totals.value = total;
-  cloums.value = monitorDynamicTableTitleList;
-  tableLoading.value = false;
-};
-function onModalClose() {
-  visible.value = false;
-  // dynamic_page_data_typeM();
-  dynamic_page_data_typeM(params);
-}
-
-function open2() {
-  tableDalgoRef.value.submit();
-}
-function handlePreview(file) {
-  return ElMessageBox.confirm(`下载此文件: ${file.name}？`).then(
-    () => window.open(file.url),
-    () => false
-  );
-}
-function isDb(v, m, n, f) {
-  return v * 1 - m * 1 > 0 && n * 1 - f * 1 > 0;
-}
-onMounted(() => {
-  dynamic_page_data_typeM(params);
-});
-</script>
-<style lang="scss" scoped></style>
diff --git a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/index.vue b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/index.vue
index ed206ea..83e8850 100644
--- a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/index.vue
+++ b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/index.vue
@@ -1,106 +1,77 @@
 <template>
+  <!-- 黑臭水体消除比例 -->
   <div class="water-analysis-page">
-    <div class="top">
-      <div class="top" v-if="!isComponent">
-        <div class="icon">
-          <!-- <div class="tittle">黑臭水体年度考核统计表</div> -->
-          <todoDon ref="todoDonRef" :params="tableData" @searchClick="searchClick" @clicksWaterBodies="clicksWaterBodies"></todoDon>
-        </div>
-        <div class="tuli">
-          <div style="margin: 10px; font-size: 18px">图例</div>
-          <div v-for="i in tuliList" class="tuli_img">
-            <img :src="i.icon" alt="" />
-            <div>{{ i.label }}</div>
-          </div>
-        </div>
-        <!-- gis地图 -->
-        <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
-      </div>
-      <detial v-else-if="isComponent == 1" @searchClick="searchClick" :paramsData="params"> </detial>
+    <div class="icon">
+      <todoDon ref="todoDonRef" :params="tableData" @searchClick="searchClick" @clicksWaterBodies="clicksWaterBodies"></todoDon>
     </div>
-    <div class="PopupWaterlogging" id="PopupWaterlogging" v-if="pipePopupShow">
-      <div class="titleTop">
-        <el-tabs class="PopupWaterloggingtabs">
-          <el-tab-pane label="水质化验记录">
-            <el-table
-              ref="tableModal"
-              :data="tableData2"
-              max-height="320"
-              v-loading="tableLoading"
-              @row-click="clickModal"
-              highlight-current-row
-            >
-              <el-table-column type="index" width="55" label="序号" />
-              <el-table-column label="采样时间" prop="sampleTime" />
-              <el-table-column label="采样点" prop="sampleLocation" />
-              <el-table-column label="透明度（cm）" prop="CLA" />
-              <el-table-column label="溶解氧mg/L" prop="DOX" />
-              <el-table-column label="黑臭程度" prop="blackOdorName">
-                <template #default="scope">
-                  <span
-                    :style="{
-                      color:
-                        scope.row.blackOdorName == '无黑臭'
-                          ? 'greenyellow'
-                          : scope.row.blackOdorName == '轻度黑臭'
-                          ? ' #419fff'
-                          : scope.row.blackOdorName == '中度黑臭'
-                          ? 'orange'
-                          : scope.row.blackOdorName == '重度黑臭'
-                          ? 'red'
-                          : '',
-                    }"
-                  >
-                    {{
-                      scope.row.blackOdorName == '无黑臭'
-                        ? '无黑臭'
-                        : scope.row.blackOdorName == '轻度黑臭'
-                        ? '轻度黑臭'
-                        : scope.row.blackOdorName == '中度黑臭'
-                        ? '中度黑臭'
-                        : scope.row.blackOdorName == '重度黑臭'
-                        ? '重度黑臭'
-                        : ''
-                    }}
-                  </span>
-                </template>
-              </el-table-column>
-            </el-table>
-          </el-tab-pane>
-          <el-tab-pane label="工程治理" class="proimageList">
-            <div style="margin-top: 10px">黑臭水体治理工法： {{ popsdata.treatmentMethod }}</div>
-            <div style="margin-top: 10px">治理前/后照片：</div>
-            <el-image
-              style="width: 150px; margin-top: 10px"
-              v-for="i in popsdata.imageList"
-              :src="i.url"
-              :zoom-rate="1"
-              :initial-index="4"
-              :preview-src-list="[i.url]"
-            />
-          </el-tab-pane>
-        </el-tabs>
-      </div>
-      <div class="closePopup">
-        <el-icon :size="18" @click="closePopup"><Close /></el-icon>
+    <div class="tuli">
+      <div style="margin: 10px; font-size: 18px">图例</div>
+      <div v-for="i in tuliList" class="tuli_img">
+        <img :src="i.icon" alt="" />
+        <div>{{ i.label }}</div>
       </div>
     </div>
+    <!-- gis地图 -->
+    <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
   </div>
+  <!-- 地图水体点击弹窗 -->
+  <el-dialog v-model="dialogShow" title="2022黄汴河水质监测详情" :modal-append-to-body="false" width="900px">
+    <div class="hcstDialog">
+      <div class="part">
+        <div class="title">透明度(cm)</div>
+        <ChartBar3D :refresh="refresh1" :echartData="echartData1" class="chart"></ChartBar3D>
+      </div>
+      <div class="part">
+        <div class="title">氨氮(mg/L)</div>
+        <ChartBar3D :refresh="refresh2" :echartData="echartData2" class="chart"></ChartBar3D>
+      </div>
+      <div class="part">
+        <div class="title">溶解氧(mg/L)</div>
+        <ChartBar3D :refresh="refresh3" :echartData="echartData3" class="chart"></ChartBar3D>
+      </div>
+      <div class="part">
+        <div class="title">氧化还原电位(mV)</div>
+        <ChartBar3D :refresh="refresh4" :echartData="echartData4" class="chart"></ChartBar3D>
+      </div>
+    </div>
+  </el-dialog>
 </template>
 <script setup>
 import { blackOdorpaging, blackOdorpagingriverInfo } from '@/api/spongePerformance/surfaceWater';
-import detial from './detial/index';
 import MapBox from '@/views/gisMapPage/gisMapBox1'; //gis地图
 import todoDon from './todoDon.vue';
+import ChartBar3D from '@/views/sponeScreen/Echarts/echartBar3D.vue';
+
 const { proxy } = getCurrentInstance();
+const dialogShow = ref(true);
+const refresh1 = ref(1);
+const refresh2 = ref(1);
+const refresh3 = ref(1);
+const refresh4 = ref(1);
+const echartData1 = ref({
+  xAxis: ['3月', '4月', '9月', '11月'],
+  seriesData: [52, 35, 69, 86, 22],
+});
+const echartData2 = ref({
+  xAxis: ['3月', '4月', '9月', '11月'],
+  seriesData: [0.8, 0.35, 1.12, 0.9, 0.98],
+});
+const echartData3 = ref({
+  xAxis: ['3月', '4月', '9月', '11月'],
+  seriesData: [5.4, 13, 9.2, 10.4, 8.9],
+});
+const echartData4 = ref({
+  xAxis: ['3月', '4月', '9月', '11月'],
+  seriesData: [126, 162, 119, 86, 113],
+});
 const todoDonRef = ref(null);
 const pipePopupShow = ref(false);
 const popsdata = ref('');
 
 let isComponent = ref(0);
 let tuliList = ref([
-  { label: '未消除', id: 0, icon: '/images/1.1.jpg' },
-  { label: '已消除', id: 1, icon: '/images/1.2.jpg' },
+  { label: '未考核', id: 0, icon: '/images/1.1.jpg' },
+  { label: '已考核', id: 1, icon: '/images/1.2.jpg' },
 ]);
 const tableData2 = ref([]);
 //动态组件
@@ -140,9 +111,6 @@
   }
 };
 
-const closePopup = () => {
-  pipePopupShow.value = false;
-};
 const clicksWaterBodies = row => {
   let ids = '';
   if (row.riverId) {
@@ -155,101 +123,68 @@
 };
 onMounted(() => {});
 </script>
-<style lang="scss" scoped>
-@import '@/assets/styles/variables.module.scss';
-#map {
-  width: 100%;
-  height: 100%;
-}
-.form {
-  left: 10px;
-  top: 10px;
-  z-index: 111;
-  position: absolute;
-  width: 20%;
-}
-.top {
-  position: relative;
-  height: 86vh;
-}
-.icon {
-  right: 0;
-  top: 0;
-  z-index: 111;
-  position: absolute;
-  width: 70%;
-}
-.tuli {
-  left: 20px;
-  bottom: 30px;
-  padding: 10px;
-  z-index: 111;
-  position: absolute;
-  background: $mainColor1;
-  // display: flex;
+<style lang="scss">
+.hcstDialog {
+  display: flex;
   flex-wrap: wrap;
-  align-items: center;
-  text-align: center;
-  color: #fff;
-  .tuli_img {
-    display: flex;
-    width: 100px;
-    align-items: center;
-    margin-top: 8px;
-    img {
-      margin-right: 10px;
-      width: 25px;
+  .part {
+    width: 48%;
+    margin-right: 2%;
+    .title {
+      font-size: 18px;
+      font-weight: bold;
+      color: #fff;
+    }
+    .chart {
+      height: 300px !important;
     }
   }
 }
-.tittle {
-  font-size: 16px;
-  font-weight: bold;
-  width: 200px;
-  height: 40px;
-  line-height: 40px;
-  text-align: center;
-  margin: 5px 0;
-  color: #fff;
-}
-.tittle1 {
-  background: transparent;
-}
+@import '@/assets/styles/variables.module.scss';
+
 .water-analysis-page {
   padding: 20px;
-  overflow-y: hidden;
-}
-
-#PopupWaterlogging {
-  position: fixed;
-  left: 52%;
-  top: 54%;
-  transform: translate(-50%, -50%);
-  width: 700px;
-  height: 410px;
-  background: #021534;
-  border: 1px solid #114f89;
-  z-index: 2000;
-  display: flex;
-
-  .titleTop {
-    width: 95%;
-    display: flex;
-    padding-top: 8px;
-    margin-left: 20px;
-  }
-  .closePopup {
-    width: 5%;
-    margin: 15px;
-    cursor: pointer;
-  }
-  .PopupWaterloggingtabs {
+  height: 100%;
+  position: relative;
+  #map {
     width: 100%;
     height: 100%;
   }
-}
-.proimageList {
-  height: 300px;
-  overflow-y: auto;
+  .form {
+    left: 10px;
+    top: 10px;
+    z-index: 111;
+    position: absolute;
+    width: 20%;
+  }
+  .icon {
+    right: 0;
+    top: 0;
+    z-index: 111;
+    position: absolute;
+    width: 800px;
+  }
+  .tuli {
+    left: 20px;
+    bottom: 30px;
+    padding: 10px;
+    z-index: 111;
+    position: absolute;
+    background: $mainColor1;
+    flex-wrap: wrap;
+    align-items: center;
+    text-align: center;
+    color: #fff;
+    .tuli_img {
+      display: flex;
+      width: 100px;
+      align-items: center;
+      margin-top: 8px;
+      img {
+        margin-right: 10px;
+        width: 25px;
+      }
+    }
+  }
 }
 </style>
diff --git a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/todoDon.vue b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/todoDon.vue
index 9b374ea..d09779a 100644
--- a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/todoDon.vue
+++ b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/todoDon.vue
@@ -1,17 +1,17 @@
 <template>
   <div class="water-analysis-page">
-    <el-table :data="tableData" max-height="500" ref="tableRef" v-loading="tableLoading" @row-click="clickTableRow" highlight-current-row>
+    <el-table :data="tableData" ref="tableRef" v-loading="tableLoading" @row-click="clickTableRow" highlight-current-row>
       <el-table-column label="年度" prop="examineYear" />
       <el-table-column label="黑臭水体/个" prop="unRemoveNum" />
       <el-table-column label="考核水体数/个" prop="totalNum" />
-      <el-table-column label="消除比%" prop="actualPercent">
+      <el-table-column label="目标消除比%" prop="targetPercent" />
+      <el-table-column label="实际消除比%" prop="actualPercent">
         <template #default="{ row }">
           <span style="color: lime">
             {{ row.actualPercent }}
           </span>
         </template>
       </el-table-column>
-      <el-table-column label="目标消除比%" prop="targetPercent" />
       <el-table-column label="达标情况" prop="reachStandard">
         <template #default="scope">
           <span
@@ -26,11 +26,6 @@
           </span>
         </template>
       </el-table-column>
-      <el-table-column label="水体检测记录">
-        <template #default="{ row }">
-          <el-button link type="primary" icon="View" @click="onCheck(row)">查看</el-button>
-        </template>
-      </el-table-column>
     </el-table>
   </div>
 </template>
@@ -58,10 +53,7 @@
     clickTableRow(tableData.value[0]); //默认渲染第一行gis地图
   }
 };
-//查看点击事件
-const onCheck = row => {
-  emits('searchClick', { ...row, type: 1 });
-};
+
 // 表格点击，查看对应的项目情况
 function clickTableRow(row) {
   row.blackOdorSampleInfos &&
@@ -106,36 +98,6 @@
     });
     let geojson1 = turf.featureCollection(coverflowFeature);
     addWaterloggingLayer(geojson1, 'odorousWaterBodies');
-
-    // bus.emit('getGeojsonByType', {
-    //   type: key,
-    //   callback: geojson => {
-    //     setTimeout(() => {
-    //       bus.emit('removeMapDatas', [key]);
-    //       if (!!!geojson.features.length) bus.emit('setGeoJSON', { json: geojson1, key });
-    //       bus.emit('setLayerVisible', { layername: key, isCheck: true });
-    //     }, 2000);
-    //   },
-    // });
-    geojson1.features.forEach(feature => {
-      return newfiberMapbox.addPopup(
-        new mapboxL7.Popup({
-          title: '',
-          html: `
-          <div class='popupMapPoint successPopup'  style=" background-color: rgba(247, 189, 15, 0.5); border: 2px solid #f7bd0f;"><div class='titles' style="padding-left:10px; font-size:16px">${feature.properties.riverName}</div>
-          <div class='part'>黑臭程度：${feature.properties.blackOdorName}</div>
-          <div class='part'>是否达标：${feature.properties.reachStandard}</div>
-          </div>`,
-          lngLat: {
-            lng: feature.geometry.coordinates[0],
-            lat: feature.geometry.coordinates[1],
-          },
-          anchor: 'center',
-          offsets: [0, 60],
-          autoClose: false,
-        })
-      );
-    });
   });
 }
 //地图渲染内涝点
diff --git a/src/views/spongePerformance/waterlogging/floodControlStandard/tableDalgo.vue b/src/views/spongePerformance/waterlogging/floodControlStandard/tableDalgo.vue
index 856dd6b..654afc3 100644
--- a/src/views/spongePerformance/waterlogging/floodControlStandard/tableDalgo.vue
+++ b/src/views/spongePerformance/waterlogging/floodControlStandard/tableDalgo.vue
@@ -41,25 +41,37 @@
         <div class="csfhbzM"></div>
       </el-form>
     </div>
+
+    <!-- 地图标记点点击查看历史水位数据 -->
+    <el-dialog v-model="dialogShow" title="河道历史水位" :modal-append-to-body="false" width="600px">
+      <div style="margin-bottom: 20px">
+        <el-form inline>
+          <el-form-item label="日期:" prop="hisDate">
+            <el-date-picker v-model="hisDate" type="daterange" value-format="YYYY-MM-DD" placeholder="请选择" />
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary" icon="Search" @click="searchData">查询</el-button>
+          </el-form-item>
+        </el-form>
+        <div id="chartHistoryR" style="width: 100%; height: 300px"></div>
+      </div>
+    </el-dialog>
   </div>
 </template>
 <script setup>
-import { projectInfoAdd, projectInfoEdit } from '@/api/spongePerformance/prevention';
-import { getToken } from '@/utils/auth';
+import { projectInfoEdit } from '@/api/spongePerformance/prevention';
 import { projectEstimateRules } from '@/utils/rules';
-import { ElMessage, ElMessageBox } from 'element-plus';
+import chartOption from '@/components/Echarts/pieChart_1.js';
+import * as echarts from 'echarts';
 
 const { proxy } = getCurrentInstance();
-const { fund_source } = proxy.useDict('fund_source');
-const uploadHeader = ref({
-  Authorization: 'Bearer ' + getToken(),
-});
+const dialogShow = ref(false);
+const hisDate = ref([proxy.moment(new Date()).subtract(60, 'days').format('YYYY-MM-DD'), proxy.moment().format('YYYY-MM-DD')]);
 const { typeList } = defineProps(['typeList']);
 const emits = defineEmits();
 defineExpose({ submit, closed, resetFiled });
 const IsStandFlag1 = ref(0);
 const fileSaveRequestList = ref([]);
-const IsStandText = ref('');
 let FormList = ref({ projectNo: '', fileSaveRequestList: [] });
 function ChangeClick(v, m) {
   typeList.iSstandardFlag = null;
@@ -107,8 +119,49 @@
 function closed() {
   emits('onModalClose');
 }
+
+// 历史水位查询
+function searchData() {
+  setTimeout(() => {
+    getRiverData();
+  }, 0);
+}
+
+// 河道echarts
+let chartRiver = null;
+async function getRiverData() {
+  if (!!chartRiver) chartRiver.dispose();
+  chartRiver = echarts.init(document.getElementById('chartHistoryR'));
+  // echarts赋值
+  let arrs = [
+    {
+      riverX: [0, 10, 17, 25, 34, 55],
+      riverY: [25, 20, 15, 8, 10, 28],
+      sfZ: 23.5,
+      z: 22,
+    },
+  ];
+  chartOption.floodOneMapFXYP.xAxis[0].data = arrs[0].riverX;
+  chartOption.floodOneMapFXYP.series[1].data = arrs[0].riverY;
+  chartOption.floodOneMapFXYP.series[1].markLine.data[0].yAxis = arrs[0].sfZ;
+  chartOption.floodOneMapFXYP.series[1].markLine.data[0].label.formatter = '设防水位 ' + arrs[0].sfZ + 'm';
+  let arrs2 = [];
+  arrs[0].riverX.map(item => {
+    arrs2.push(arrs[0].z);
+  });
+  chartOption.floodOneMapFXYP.series[0].data = arrs2;
+  if (arrs[0].riverX.length == 0) {
+    chartOption.floodOneMapFXYP.graphic.invisible = false; //暂无数据
+  } else {
+    chartOption.floodOneMapFXYP.graphic.invisible = true; //暂无数据
+  }
+  chartRiver.clear();
+  chartRiver.setOption(chartOption.floodOneMapFXYP);
+}
+
 onMounted(() => {
   loadProjerctListData();
+  searchData(); //搜索
 });
 </script>
 <style lang="scss" scoped>

diff --git a/src/views/sponeScreen/Echarts/echartBar3D.vue b/src/views/sponeScreen/Echarts/echartBar3D.vue
index 3d23886..038626c 100644
--- a/src/views/sponeScreen/Echarts/echartBar3D.vue
+++ b/src/views/sponeScreen/Echarts/echartBar3D.vue
@@ -65,14 +65,14 @@
             lineStyle: {
               color: '#384267',
             },
-            show: true,
+            show: false,
           },
           splitLine: {
             show: false,
           },
           axisLine: {
             lineStyle: {
-              color: '#384267',
+              color: '#005CBA',
               width: 1,
               type: 'dashed',
             },
@@ -91,7 +91,7 @@
               color: '#005CBA',
               width: 1,
             },
-            show: true,
+            show: false,
           },
           splitLine: {
             show: true,
@@ -214,7 +214,9 @@
     );
 
     onMounted(() => {
-      init();
+      setTimeout(() => {
+        init();
+      }, 0);
       window.addEventListener('resize', resizeTheChart);
     });
     return {
diff --git a/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue b/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
index 37c3002..3075239 100644
--- a/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
+++ b/src/views/spongePerformance/OutputPerformance/AnnualRunoffPollution.vue
@@ -1 +1,65 @@
-<template><div>年径流污染削减率管理信息</div></template>
+<template>
+  <!-- 年径流污染削减率 -->
+  <div class="publicContainer">
+    <!-- gis地图 -->
+    <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
+
+    <!-- 海绵设施监测详情 -->
+    <el-dialog v-model="dialogShow" title="海绵设施监测点位详情" :modal-append-to-body="false" width="600px">
+      <el-form :inline="true">
+        <el-form-item label="日期" prop="date">
+          <el-date-picker type="daterange" v-model="dateSearch" value-format="YYYY-MM-DD" placeholder="请选择"></el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+        </el-form-item>
+      </el-form>
+      <div id="chartHMXJ" style="width: 100%; height: 300px"></div>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import MapBox from '@/views/gisMapPage/gisMapBox1'; //gis地图
+import optionChart from './chartOption.js';
+
+const { proxy } = getCurrentInstance();
+const dialogShow = ref(true);
+const charts = ref(null);
+const dateSearch = ref([proxy.moment(new Date()).subtract(60, 'days').format('YYYY-MM-DD'), proxy.moment().format('YYYY-MM-DD')]);
+
+// 历史数据搜索
+function handleQuery() {
+  setTimeout(() => {
+    initChart();
+  });
+}
+
+// echarts初始化
+function initChart() {
+  charts.value && charts.value.dispose();
+  charts.value = proxy.echarts.init(document.getElementById('chartHMXJ'));
+  optionChart.option.xAxis.data = ['2024-06-12 00:00:00', '2024-06-12 00:10:00', '2024-06-12 00:20:00'];
+  optionChart.option.yAxis[1].name = 'SS(mg/L)';
+  optionChart.option.series[0].data = [12, 9, 20]; //降雨量
+  optionChart.option.series[1].name = '进口SS';
+  optionChart.option.series[1].data = [230, 190, 132]; //进口SS
+  optionChart.option.series[2].name = '出口SS';
+  optionChart.option.series[2].data = [110, 90, 103]; //出口SS
+  // 设置鼠标滚轮放大缩小展示数据区间
+  optionChart.option.dataZoom = [{ type: 'inside', startValue: optionChart.option.xAxis.data[optionChart.option.xAxis.data.length / 2] }];
+  if (optionChart.option.xAxis.data.length > 0) {
+    optionChart.option.graphic.invisible = true; //暂无数据
+  } else {
+    optionChart.option.graphic.invisible = false; //暂无数据
+  }
+  charts.value.clear();
+  charts.value.setOption(optionChart.option);
+}
+
+onMounted(() => {
+  handleQuery();
+});
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue b/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
index c06a3dc..35608fb 100644
--- a/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
+++ b/src/views/spongePerformance/OutputPerformance/AnnualTotalRunoff.vue
@@ -1,3 +1,62 @@
 <template>
-  <div>年径流总量控制率管理信息</div>
+  <!-- 年径流总量控制率 -->
+  <div class="publicContainer">
+    <!-- gis地图 -->
+    <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
+
+    <!-- 海绵设施监测详情 -->
+    <el-dialog v-model="dialogShow" title="海绵设施监测点位详情" :modal-append-to-body="false" width="600px">
+      <el-form :inline="true">
+        <el-form-item label="日期" prop="date">
+          <el-date-picker type="daterange" v-model="dateSearch" value-format="YYYY-MM-DD" placeholder="请选择"></el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+        </el-form-item>
+      </el-form>
+      <div id="chartHMJC" style="width: 100%; height: 300px"></div>
+    </el-dialog>
+  </div>
 </template>
+
+<script setup>
+import MapBox from '@/views/gisMapPage/gisMapBox1'; //gis地图
+import optionChart from './chartOption.js';
+
+const { proxy } = getCurrentInstance();
+const dialogShow = ref(true);
+const charts = ref(null);
+const dateSearch = ref([proxy.moment(new Date()).subtract(60, 'days').format('YYYY-MM-DD'), proxy.moment().format('YYYY-MM-DD')]);
+
+// 历史数据搜索
+function handleQuery() {
+  setTimeout(() => {
+    initChart();
+  });
+}
+
+// echarts初始化
+function initChart() {
+  charts.value && charts.value.dispose();
+  charts.value = proxy.echarts.init(document.getElementById('chartHMJC'));
+  optionChart.option.xAxis.data = ['2024-06-12 00:00:00', '2024-06-12 00:10:00', '2024-06-12 00:20:00'];
+  optionChart.option.series[0].data = [12, 9, 20]; //降雨量
+  optionChart.option.series[1].data = [2.3, 1.9, 3.2]; //进口流量
+  optionChart.option.series[2].data = [1.1, 0.9, 1.3]; //出口流量
+  // 设置鼠标滚轮放大缩小展示数据区间
+  optionChart.option.dataZoom = [{ type: 'inside', startValue: optionChart.option.xAxis.data[optionChart.option.xAxis.data.length / 2] }];
+  if (optionChart.option.xAxis.data.length > 0) {
+    optionChart.option.graphic.invisible = true; //暂无数据
+  } else {
+    optionChart.option.graphic.invisible = false; //暂无数据
+  }
+  charts.value.clear();
+  charts.value.setOption(optionChart.option);
+}
+
+onMounted(() => {
+  handleQuery();
+});
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue b/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue
index d49fc2a..b86ad5d 100644
--- a/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue
+++ b/src/views/spongePerformance/OutputPerformance/SewageTreatment.vue
@@ -1,4 +1,5 @@
 <template>
+  <!-- 污水处理厂进水BOD -->
   <div class="publicContainer">
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
       <el-form-item label="统计年份" prop="date">
@@ -13,7 +14,6 @@
 
       <el-form-item>
         <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
-        <el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button>
         <el-button icon="Refresh" @click="resetQuery">重置</el-button>
       </el-form-item>
     </el-form>
@@ -21,23 +21,17 @@
     <!-- 表格 -->
     <el-table :data="dataList" v-loading="loading" stripe :max-height="580">
       <el-table-column type="index" width="55" label="序号" />
-      <el-table-column label="统计年份" prop="q" />
       <el-table-column label="日期" prop="w" />
-      <el-table-column label="进水BOD平均浓度（mg/L）">
+      <el-table-column label="进水BOD平均浓度(mg/L)">
         <el-table-column prop="monthPlan1" label="西区污水处理厂" />
         <el-table-column prop="monthPlan2" label="东区污水处理厂" />
-        <el-table-column prop="monthPlan3" label="马家河污水厂" />
+        <el-table-column prop="monthPlan3" label="马家河污水处理厂" />
+        <el-table-column prop="monthPlan4" label="包公湖污水处理厂" />
+        <el-table-column prop="monthPlan5" label="祥符区污水处理厂" />
       </el-table-column>
       <el-table-column label="均值" prop="p" />
       <el-table-column label="年度绩效指标" prop="a" />
-      <el-table-column label="评价结论" prop="a" />
-      <el-table-column label="操作" width="240">
-        <template #default="scope">
-          <el-button link icon="View" type="primary" @click="handleDetail(scope.row, 'view')">查看</el-button>
-          <el-button link type="warning" icon="Edit" @click="handleUpdate(scope.row, 'view')">修改</el-button>
-          <el-button link type="danger" icon="Delete" @click="handleDelete(scope.row, 'view')">删除</el-button>
-        </template>
-      </el-table-column>
+      <el-table-column label="年度达标情况" prop="b" />
     </el-table>
     <!-- 分页 -->
     <pagination
@@ -47,117 +41,23 @@
       v-model:limit="queryParams.pageSize"
       @pagination="getList"
     />
-    <!-- 新增弹窗 -->
-    <el-dialog :title="title" v-model="open" width="800px" append-to-body :close-on-click-modal="false">
-      <el-form ref="roleRef" :model="form" :rules="rules" label-width="130px" :disabled="multiple">
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="统计年份:" prop="w">
-              <el-date-picker
-                type="year"
-                v-model="queryParams.date"
-                value-format="YYYY"
-                placeholder="请选择统计年份"
-                style="width: 100%"
-              ></el-date-picker>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="日期:" prop="w">
-              <el-date-picker
-                type="month"
-                v-model="queryParams.date"
-                value-format="YYYY-MM"
-                placeholder="请选择日期"
-                style="width: 100%"
-              ></el-date-picker>
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="西区污水处理厂:" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入西区污水处理厂" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="东区污水处理厂:" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入东区污水处理厂" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="马家河污水厂:" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入马家河污水厂" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="均值:" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入均值" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="年度绩效指标" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入年度绩效指标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="评价结论" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入评价结论标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-      </el-form>
-      <template #footer>
-        <div class="dialog-footer">
-          <el-button type="primary" @click="submitForm">确 定</el-button>
-          <el-button @click="cancel">取 消</el-button>
-        </div>
-      </template>
-    </el-dialog>
   </div>
 </template>
 <script setup name="WaterSupplyWaterPlants">
 const { proxy } = getCurrentInstance();
-const open = ref(false);
-const multiple = ref(false);
 const showSearch = ref(true);
-const Xcfrequency = ref([
-  {
-    value: 'tian',
-    label: '天',
-  },
-  {
-    value: 'zhou',
-    label: '周',
-  },
-]);
 const loading = ref(true);
 const total = ref(0);
-const title = ref('');
 const dataList = ref([]);
 const AllData = reactive({
   id: '',
-  form: {},
   queryParams: {
     pageNum: 1,
     pageSize: 10,
-    caseType: 1,
-    handleStatus: '',
-    searchContent: '',
-  },
-  rules: {
-    id: [{ required: true, message: '请输入', trigger: 'blur' }],
-    eventDescription: [{ required: true, message: '请输入', trigger: 'blur' }],
+    date: null,
   },
 });
-const { queryParams, form, rules } = toRefs(AllData);
+const { queryParams } = toRefs(AllData);
 //搜索
 function handleQuery() {
   getList();
@@ -167,39 +67,6 @@
   proxy.resetForm('queryRef');
   handleQuery();
 }
-// 新增
-function handleAdd() {
-  title.value = '新增水厂供水';
-  open.value = true;
-  form.value = {};
-  multiple.value = false;
-  form.value.fileTag = Xcfrequency.value[0].value;
-}
-// 新增中取消事件
-function cancel() {
-  open.value = false;
-  proxy.resetForm('roleRef');
-}
-
-// 巡查频率下拉框点击事件
-function changeStation(value) {
-  // console.log(value, 'value');
-}
-
-//查看详情操作
-function handleDetail(row) {
-  open.value = true;
-  title.value = '查看水厂供水';
-  multiple.value = true;
-  form.value = row;
-}
-// 修改按钮操作
-function handleUpdate(row) {
-  open.value = true;
-  title.value = '修改水厂供水';
-  multiple.value = false;
-  form.value = { ...row };
-}
 
 /** 查询列表 */
 const getList = async () => {
@@ -211,12 +78,4 @@
   getList();
 });
 </script>
-<style scoped lang="scss">
-.dituclass {
-  width: 100%;
-  height: 300px;
-  // background: red;
-  margin-bottom: 10px;
-  border: 1px solid #004565;
-}
-</style>
+<style scoped lang="scss"></style>
diff --git a/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue b/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue
index 6ce3f37..94c365b 100644
--- a/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue
+++ b/src/views/spongePerformance/OutputPerformance/UrbanDomesticSewage.vue
@@ -1,34 +1,31 @@
 <template>
+  <!-- 城市生活污水集中收集率 -->
   <div class="publicContainer">
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
-      <el-form-item label="污水厂名称:" prop="searchContent">
-        <el-input v-model="queryParams.searchContent" placeholder="请输入污水厂名称" clearable style="width: 180px" />
-      </el-form-item>
       <el-form-item label="统计年份" prop="date">
         <el-date-picker type="year" v-model="queryParams.date" value-format="YYYY" placeholder="请选择统计年份"></el-date-picker>
       </el-form-item>
 
       <el-form-item>
         <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
-        <el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button>
         <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+        <el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button>
       </el-form-item>
     </el-form>
 
     <!-- 表格 -->
     <el-table :data="dataList" v-loading="loading" stripe :max-height="580">
       <el-table-column type="index" width="55" label="序号" />
-      <el-table-column label="污水厂名称" prop="q" />
-      <el-table-column label="编码" prop="w" />
       <el-table-column label="统计年份" prop="o" />
-      <el-table-column label="年度绩效指标" prop="p" />
+      <el-table-column label="污水厂名称" prop="q" />
       <el-table-column label="累计处理水量(万t)" prop="e" />
       <el-table-column label="进水BOD平均浓度(mg/L)" prop="r" />
       <el-table-column label="BOD 削减量(g)" prop="t" />
       <el-table-column label="城区用水人口(万人)" prop="y" />
       <el-table-column label="人均日生活污染排放量(g/人·d)" prop="u" />
-      <el-table-column label="城市生活污水集中收集率(%)" prop="i" />
-      <el-table-column label="评价结论" prop="a" />
+      <el-table-column label="目标收集率(%)" prop="p" />
+      <el-table-column label="实际收集率(%)" prop="i" />
+      <el-table-column label="达标情况" prop="a" />
       <el-table-column label="操作" width="240">
         <template #default="scope">
           <el-button link icon="View" type="primary" @click="handleDetail(scope.row, 'view')">查看</el-button>
@@ -46,93 +43,46 @@
       @pagination="getList"
     />
     <!-- 新增弹窗 -->
-    <el-dialog :title="title" v-model="open" width="1100px" append-to-body :close-on-click-modal="false">
+    <el-dialog :title="title" v-model="open" width="600px" append-to-body :close-on-click-modal="false">
       <el-form ref="roleRef" :model="form" :rules="rules" label-width="220px" :disabled="multiple">
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="污水厂名称:" prop="w">
-              <el-input v-model="form.w" placeholder="请输入污水厂名称" clearable style="width: 100%" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="编码:" prop="w">
-              <el-input v-model="form.w" placeholder="请输入编码" clearable style="width: 100%" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="累计处理水量(万t):" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入累计处理水量(万t)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="进水BOD平均浓度(mg/L):" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入进水BOD平均浓度(mg/L)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="BOD 削减量(g):" prop="lon">
-              <el-input-number v-model="form.lon" placeholder="请输入BOD 削减量(g)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="城区用水人口(万人):" prop="lat">
-              <el-input-number v-model="form.lat" placeholder="请输入城区用水人口(万人)" style="width: 100%" controls-position="right" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="人均日生活污染排放量(g/人·d):" prop="lon">
-              <el-input-number
-                v-model="form.lon"
-                placeholder="请输入人均日生活污染排放量(g/人·d)"
-                style="width: 100%"
-                controls-position="right"
-              />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="城市生活污水集中收集率(%):" prop="lat">
-              <el-input-number
-                v-model="form.lat"
-                placeholder="请输入城市生活污水集中收集率(%)"
-                style="width: 100%"
-                controls-position="right"
-              />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="统计年份" prop="date">
-              <el-date-picker
-                type="year"
-                v-model="queryParams.date"
-                value-format="YYYY"
-                placeholder="请选择统计年份"
-                style="width: 100%"
-              ></el-date-picker>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="年度绩效指标" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入年度绩效指标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="评价结论" prop="date">
-              <el-input type="textarea" v-model="form.lon" placeholder="请输入评价结论标" style="width: 100%" />
-            </el-form-item>
-          </el-col>
-        </el-row>
+        <el-form-item label="统计年份" prop="date">
+          <el-date-picker
+            type="year"
+            v-model="queryParams.date"
+            value-format="YYYY"
+            placeholder="请选择统计年份"
+            style="width: 100%"
+          ></el-date-picker>
+        </el-form-item>
+        <el-form-item label="污水厂名称:" prop="w">
+          <el-input v-model="form.w" placeholder="请输入污水厂名称" clearable style="width: 100%" />
+        </el-form-item>
+        <el-form-item label="累计处理水量(万t):" prop="lon">
+          <el-input-number v-model="form.lon" placeholder="请输入累计处理水量(万t)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="进水BOD平均浓度(mg/L):" prop="lat">
+          <el-input-number v-model="form.lat" placeholder="请输入进水BOD平均浓度(mg/L)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="BOD 削减量(g):" prop="lon">
+          <el-input-number v-model="form.lon" placeholder="请输入BOD 削减量(g)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="城区用水人口(万人):" prop="lat">
+          <el-input-number v-model="form.lat" placeholder="请输入城区用水人口(万人)" style="width: 100%" controls-position="right" />
+        </el-form-item>
+        <el-form-item label="人均日生活污染排放量(g/人·d):" prop="lon">
+          <el-input-number
+            v-model="form.lon"
+            placeholder="请输入人均日生活污染排放量(g/人·d)"
+            style="width: 100%"
+            controls-position="right"
+          />
+        </el-form-item>
+        <el-form-item label="目标收集率(%):" prop="date">
+          <el-input-number v-model="form.lon" placeholder="请输入目标收集率" style="width: 100%" />
+        </el-form-item>
+        <el-form-item label="实际收集率(%):" prop="lat">
+          <el-input-number v-model="form.lat" placeholder="请输入实际收集率(%)" style="width: 100%" controls-position="right" />
+        </el-form-item>
       </el-form>
       <template #footer>
         <div class="dialog-footer">
@@ -170,7 +120,6 @@
     pageSize: 10,
     caseType: 1,
     handleStatus: '',
-    searchContent: '',
   },
   rules: {
     id: [{ required: true, message: '请输入', trigger: 'blur' }],
diff --git a/src/views/spongePerformance/OutputPerformance/chartOption.js b/src/views/spongePerformance/OutputPerformance/chartOption.js
new file mode 100644
index 0000000..c0e300f
--- /dev/null
+++ b/src/views/spongePerformance/OutputPerformance/chartOption.js
@@ -0,0 +1,137 @@
+import useUserStore from '@/store/modules/user';
+import * as echarts from 'echarts';
+const pinias = useUserStore();
+
+let optionChart = {
+  // 柱状图+折线图
+  option: {
+    color: pinias.$state.chartColor,
+    // 显示暂无数据
+    graphic: {
+      type: 'text', // 类型：文本
+      left: 'center',
+      top: 'middle',
+      silent: true, // 不响应事件
+      invisible: false, // 有数据就隐藏
+      style: {
+        fill: '#c6c6c6',
+        fontWeight: 'bold',
+        text: '暂无数据',
+        fontFamily: 'Microsoft YaHei',
+        fontSize: '18px',
+      },
+    },
+    tooltip: {
+      trigger: 'axis',
+      confine: true, //是否将 tooltip 框限制在图表的区域内
+    },
+    title: {
+      left: 'left',
+      text: '',
+      top: 10,
+      bottom: 10,
+      left: 10,
+      textStyle: {
+        color: '#545E75', //字体颜色
+        fontSize: 16, //字体大小
+      },
+    },
+    grid: {
+      left: '3%',
+      right: '5%',
+      top: '20%',
+      bottom: '3%',
+      containLabel: true,
+    },
+    legend: {
+      top: '2%',
+      orient: 'horizontal', //horizontal
+      left: 'center', //left ,center
+      textStyle: {
+        color: 'inherit',
+      },
+    },
+    xAxis: {
+      type: 'category',
+      position: 'bottom',
+      data: ['2023', '2024', '2025'],
+      axisLabel: {
+        color: '#c6c6c6',
+      },
+      axisLine: {
+        lineStyle: {
+          color: '#066592',
+        },
+      },
+    },
+    yAxis: [
+      {
+        name: '降雨量(mm)',
+        type: 'value',
+        inverse: true, //翻转
+        nameLocation: 'start', // 坐标轴名称显示位置
+        nameGap: 15, // 坐标轴名称与轴线之间的距离
+        nameTextStyle: {
+          color: '#c6c6c6', //字体颜色
+          fontSize: 12, //字体大小
+          align: 'center', // 文字水平对齐方式，默认自动（'left'，'center'，'right'）
+        },
+        splitLine: {
+          lineStyle: {
+            type: 'dashed',
+            color: '#066592',
+          },
+        },
+        axisLabel: {
+          color: '#c6c6c6',
+        },
+      },
+      {
+        name: '流量(m³/h)',
+        type: 'value',
+        nameLocation: 'end', // 坐标轴名称显示位置
+        nameGap: 15, // 坐标轴名称与轴线之间的距离
+        nameTextStyle: {
+          color: '#c6c6c6', //字体颜色
+          fontSize: 12, //字体大小
+          align: 'center', // 文字水平对齐方式，默认自动（'left'，'center'，'right'）
+        },
+        axisLabel: {
+          color: '#c6c6c6',
+        },
+        splitLine: {
+          lineStyle: {
+            type: 'dashed',
+            color: '#066592',
+          },
+        },
+      },
+    ],
+    series: [
+      {
+        name: '降雨量',
+        type: 'bar',
+        barWidth: 10,
+        yAxisIndex: 0,
+        data: [24, 12, 9],
+      },
+      {
+        name: '进口流量',
+        type: 'line',
+        smooth: true,
+        yAxisIndex: 1,
+        symbolSize: 8,
+        data: [14, 8, 5],
+      },
+      {
+        name: '出口流量',
+        type: 'line',
+        smooth: true,
+        yAxisIndex: 1,
+        symbolSize: 8,
+        data: [4, 2, 1],
+      },
+    ],
+  },
+};
+export default optionChart;
diff --git a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/index.vue b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/index.vue
deleted file mode 100644
index bc19015..0000000
--- a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/index.vue
+++ /dev/null
@@ -1,367 +0,0 @@
-<template>
-  <!-- 地表水体水质达标 -->
-  <div class="publicContainer" v-if="back">
-    <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
-      <el-form-item label="考核水体:" prop="riverId">
-        <el-select clearable v-model="queryParams.riverId" class="m-2" placeholder="请选择" size="mini">
-          <el-option v-for="item in responseAA" :key="item.id" :label="item.riverName" :value="Number(item.id)" />
-        </el-select>
-      </el-form-item>
-
-      <el-form-item label="采样年份:" prop="sampleYear">
-        <el-date-picker
-          v-model="queryParams.sampleYear"
-          type="year"
-          placeholder="请选择"
-          format="YYYY"
-          value-format="YYYY"
-          @change="change"
-        />
-      </el-form-item>
-
-      <el-form-item label="评价结果:" prop="blackOdor">
-        <el-select clearable v-model="queryParams.blackOdor" class="m-2" placeholder="请选择" size="mini">
-          <el-option v-for="item in black_odor_level" :key="item.value" :label="item.label" :value="item.value" />
-        </el-select>
-      </el-form-item>
-      <el-form-item>
-        <el-button type="primary" icon="Search" @click="searchData">搜索</el-button>
-        <el-button icon="Refresh" @click="resetData">重置</el-button>
-        <el-button icon="CaretLeft" @click="resect" class="zbBtn"> 返回</el-button>
-        <el-button icon="Plus" type="success" @click="addData">新增</el-button>
-      </el-form-item>
-    </el-form>
-    <!-- 表格 -->
-    <el-table :data="tableData" v-loading="tableLoading" :max-height="650">
-      <el-table-column type="index" width="55" label="序号" />
-      <el-table-column v-for="item in informationDate" :label="item.value" :prop="item.key">
-        <template #default="scope" v-if="item.key == 'blackOdorName'">
-          <span
-            :style="{
-              color:
-                scope.row.blackOdorName == '无黑臭'
-                  ? 'greenyellow'
-                  : scope.row.blackOdorName == '轻度黑臭'
-                  ? ' #419fff'
-                  : scope.row.blackOdorName == '中度黑臭'
-                  ? 'orange'
-                  : scope.row.blackOdorName == '重度黑臭'
-                  ? 'red'
-                  : '',
-            }"
-          >
-            {{
-              scope.row.blackOdorName == '无黑臭'
-                ? '无黑臭'
-                : scope.row.blackOdorName == '轻度黑臭'
-                ? '轻度黑臭'
-                : scope.row.blackOdorName == '中度黑臭'
-                ? '中度黑臭'
-                : scope.row.blackOdorName == '重度黑臭'
-                ? '重度黑臭'
-                : ''
-            }}
-          </span>
-        </template>
-      </el-table-column>
-      <el-table-column label="操作" show-overflow-tooltip width="200">
-        <template #default="{ row }">
-          <el-button type="primary" link @click="checkDetail(row)">详情</el-button>
-          <el-button type="primary" link @click="editData(row)">修改</el-button>
-          <el-button type="danger" link @click="deleteData(row)">删除</el-button>
-        </template>
-      </el-table-column>
-    </el-table>
-    <!-- 分页 -->
-    <pagination
-      v-show="total > 0"
-      :total="total"
-      v-model:page="queryParams.pageNum"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getDataList"
-    />
-    <!-- 添加 修改 查看彈框 -->
-    <el-dialog :title="dialogTitle" v-model="showDialog" width="70%" :close-on-click-modal="false">
-      <el-form ref="ruleForm" :model="formData" :rules="formRules" label-width="auto" :disabled="isDisab">
-        <el-row>
-          <el-form-item label="考核水体:" prop="riverId" style="width: 45%">
-            <el-select clearable v-model="formData.riverId" class="m-2" placeholder="请选择" size="mini" style="width: 100%">
-              <el-option v-for="item in responseAA" :key="item.id" :label="item.riverName" :value="Number(item.id)" />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="采样时间:" prop="sampleTime" style="width: 45%">
-            <el-date-picker
-              style="width: 100%"
-              clearable
-              format="YYYY-MM-DD"
-              value-format="YYYY-MM-DD"
-              v-model="formData.sampleTime"
-              type="date"
-            />
-          </el-form-item>
-          <el-form-item label="采样点:" prop="sampleLocation" style="width: 45%">
-            <el-input v-model="formData.sampleLocation" placeholder="请输入" style="width: 100%" clearable />
-          </el-form-item>
-
-          <el-form-item v-for="item in Dbssz" :label="item.sampleFactorName" :prop="item.sampleFactor" style="width: 45%">
-            <el-input-number
-              v-model="formData[item.sampleFactor]"
-              placeholder="请输入"
-              clearable
-              controls-position="right"
-              style="width: 400px"
-            />
-          </el-form-item>
-
-          <el-form-item label="黑臭程度:" prop="blackOdorName" style="width: 45%" v-if="hiddentext">
-            <div
-              :style="{
-                color:
-                  formData.blackOdorName == '无黑臭'
-                    ? 'greenyellow'
-                    : formData.blackOdorName == '轻度黑臭'
-                    ? ' #419fff'
-                    : formData.blackOdorName == '中度黑臭'
-                    ? 'orange'
-                    : formData.blackOdorName == '重度黑臭'
-                    ? 'red'
-                    : '',
-              }"
-            >
-              {{
-                formData.blackOdorName == '无黑臭'
-                  ? '无黑臭'
-                  : formData.blackOdorName == '轻度黑臭'
-                  ? '轻度黑臭'
-                  : formData.blackOdorName == '中度黑臭'
-                  ? '中度黑臭'
-                  : formData.blackOdorName == '重度黑臭'
-                  ? '重度黑臭'
-                  : ''
-              }}
-            </div>
-          </el-form-item>
-        </el-row>
-      </el-form>
-      <template #footer>
-        <div class="dialog-footer">
-          <el-button type="primary" @click="submitForm" v-show="!isDisab">保 存</el-button>
-          <el-button @click="cancel">关闭</el-button>
-        </div>
-      </template>
-    </el-dialog>
-  </div>
-  <waterquality v-else />
-</template>
-<script setup>
-import {
-  blackOdorUserId,
-  riverInfoWater,
-  blackOdorAdd,
-  blackOdorDelete,
-  sampleConfigconfiguration,
-  blackOdorinformation,
-  blackOdorpaging,
-  blackOdorEdit,
-} from '@/api/spongePerformance/surfaceWater';
-const { proxy } = getCurrentInstance();
-const { hc_sample_factor, sample_type, black_odor_level } = proxy.useDict('hc_sample_factor', 'sample_type', 'black_odor_level');
-import { defineEmits } from 'vue';
-const isDisab = ref(false);
-const isDisatext = ref(false);
-const showDialog = ref(false);
-const showSearch = ref(true);
-const tableLoading = ref(true);
-const hiddentext = ref(false);
-const back = ref(true);
-const responseAA = ref([]);
-const total = ref(0);
-const dialogTitle = ref('');
-const tableData = ref([]);
-const Dbssz = ref([]);
-const informationDate = ref([]);
-const emits = defineEmits();
-const { paramsData } = defineProps(['paramsData']);
-const AllData = reactive({
-  formData: {
-    configs: [],
-  },
-  queryParams: {
-    pageNum: 1,
-    pageSize: 10,
-    sampleTime: '',
-    riverId: '',
-    blackOdor: '',
-    sampleYear: '',
-    sampleLocation: '',
-  },
-  formRules: {
-    riverId: [{ required: true, message: '请选择', trigger: 'blur' }],
-    sampleTime: [{ required: true, message: '请选择', trigger: 'blur' }],
-  },
-});
-const { queryParams, formData, formRules } = toRefs(AllData);
-
-/** 表单重置 */
-function resetForm() {
-  formData.value = {
-    riverId: undefined,
-    sampleYear: undefined,
-    sampleTime: undefined,
-    blackOdor: undefined,
-    sampleLocation: undefined,
-    riverType: 'black_odor',
-  };
-  proxy.resetForm('ruleForm');
-}
-function resect() {
-  emits('searchClick', 0);
-}
-/** 新增按钮操作 */
-function addData() {
-  resetForm();
-  hiddentext.value = false;
-  isDisab.value = false;
-  showDialog.value = true;
-  dialogTitle.value = '新增检测记录';
-}
-
-//搜索
-function searchData() {
-  queryParams.value.pageNum = 1;
-  getDataList();
-}
-//重置
-function resetData() {
-  proxy.resetForm('queryRef');
-  searchData();
-}
-// 获取下拉框数据
-const getSelData = async () => {
-  let params = {
-    riverType: 'black_odor',
-  };
-  riverInfoWater(params).then(response => {
-    if (response.code == 200) {
-      responseAA.value = response.data;
-    }
-  });
-};
-// 新增中的 动态数据
-const Dbsszconfiguration = async () => {
-  let params = {
-    sampleType: 'hcst',
-  };
-  sampleConfigconfiguration(params).then(response => {
-    if (response.code == 200) {
-      Dbssz.value = response.data;
-      Dbssz.value.forEach(item => {
-        formRules.value[item.sampleFactor] = [{ required: true, message: '请输入', trigger: 'blur', type: 'number' }];
-      });
-      console.log(formRules.value);
-    }
-  });
-};
-//地水质采样信息动态表头
-const information = async () => {
-  blackOdorinformation().then(res => {
-    if (res.code == 200) {
-      informationDate.value = res.data;
-    }
-  });
-};
-
-/** 查询列表 */
-const getDataList = async () => {
-  tableLoading.value = true;
-  const res = await blackOdorpaging(queryParams.value);
-  tableData.value = res.data.records;
-  total.value = res.data.total || 0;
-  tableLoading.value = false;
-};
-/** 新增弹框 修改弹框 提交按钮 */
-async function submitForm() {
-  proxy.$refs['ruleForm'].validate(valid => {
-    if (valid) {
-      formData.value.configs = [];
-      let obj = [];
-      Dbssz.value.forEach(k => {
-        obj.push(k.sampleFactor);
-      });
-      obj.forEach(element => {
-        formData.value.configs.push({
-          factor: element,
-          value: formData.value[element],
-        });
-        delete formData.value[element];
-      });
-      console.log(formData.value, 'formData.value.configs');
-
-      if (formData.value.id != undefined) {
-        blackOdorEdit(formData.value).then(() => {
-          console.log(formData.value, 'formData.value');
-          proxy.$modal.msgSuccess('修改成功');
-          showDialog.value = false;
-          getDataList();
-        });
-      } else {
-        blackOdorAdd(formData.value).then(() => {
-          console.log(formData.value, 'formData.valueformData.valueformData.value');
-          proxy.$modal.msgSuccess('新增成功');
-          showDialog.value = false;
-          getDataList();
-        });
-      }
-    }
-  });
-}
-//表格修改
-function editData(row) {
-  formData.value = { ...row };
-  isDisab.value = false;
-  isDisatext.value = true;
-  showDialog.value = true;
-  dialogTitle.value = '修改检测记录';
-  hiddentext.value = true;
-  console.log(row, 'row');
-}
-// 表格删除
-function deleteData(row) {
-  proxy.$modal
-    .confirm('是否确认删除？')
-    .then(async () => {
-      const res = await blackOdorDelete(row.id);
-      if (res?.code !== 200) return;
-      proxy.$modal.msgSuccess('操作成功！');
-      getDataList();
-    })
-    .catch(() => {});
-}
-//详情按钮
-function checkDetail(row) {
-  dialogTitle.value = '查看检测记录';
-  isDisab.value = true;
-  showDialog.value = true;
-  isDisatext.value = true;
-  hiddentext.value = true;
-  formData.value = { ...row };
-}
-
-/** 取消按钮 */
-function cancel() {
-  showDialog.value = false;
-  resetForm();
-}
-function change(val) {
-  console.log(val, 'val');
-  queryParams.value.sampleYear = val;
-}
-onMounted(() => {
-  queryParams.value.sampleYear = paramsData?.examineYear || '';
-  getDataList();
-  getSelData();
-  Dbsszconfiguration();
-  information();
-});
-</script>
-<style scoped lang="scss"></style>
diff --git a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/tableDalgo.vue b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/tableDalgo.vue
deleted file mode 100644
index 7a01aeb..0000000
--- a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/tableDalgo.vue
+++ /dev/null
@@ -1,155 +0,0 @@
-<template>
-  <div class="water-analysis-page">
-    <div class="top">
-      <el-form label-width="auto" :rules="projectEstimateRules" inline ref="ruleForm" :model="FormList" :disabled="typeList.type == 1">
-        <div v-for="i in typeList.monitorDynamicTableTitleList" style="display: flex; flex-direction: column">
-          <el-form-item
-            v-if="i.key == 'real' || i.key == 'target'"
-            v-for="k in i.titleGroup"
-            :label="i.key == 'real' ? '实际' + k.value + ':' : '目标' + k.value + ':'"
-            :prop="k.key"
-            :disabled="typeList.type == 1 || typeList.type == 2"
-          >
-            <el-input
-              :disabled="i.key != 'real'"
-              v-model="FormList[k.key]"
-              :placeholder="k.placeholder"
-              @change="ChangeClick(k.key, FormList[k.key])"
-            >
-            </el-input>
-          </el-form-item>
-          <el-form-item v-else :label="i.value + ':'" :prop="i.key" :disabled="typeList.type == 1 || typeList.type == 2">
-            <el-upload
-              v-if="i.key == 'attachFileList'"
-              v-model:file-list="fileList1"
-              class="upload-demo"
-              action="/system/upload"
-              :headers="uploadHeader"
-              multiple
-              :on-preview="handlePreview"
-              :before-remove="beforeRemove"
-              style="width: 100vh"
-            >
-              <el-button type="primary">选择文件</el-button>
-            </el-upload>
-            <div
-              v-else-if="i.key == 'standardFlag' && typeList.iSstandardFlag"
-              :style="{ color: typeList.iSstandardFlag ? '#108ee9' : 'red' }"
-            >
-              {{ typeList.iSstandardFlag ? '达标' : '未达标' }}
-            </div>
-            <div
-              v-else-if="i.key == 'standardFlag' && !typeList.iSstandardFlag"
-              :style="{ color: IsStandFlag1 > 0 && IsStandFlag2 > 0 ? '#108ee9' : 'red' }"
-            >
-              <span v-show="false">{{ IsStandFlag1 > 0 && IsStandFlag2 > 0 ? (IsStandText = 1) : (IsStandText = 0) }}</span>
-              {{ IsStandFlag1 > 0 && IsStandFlag2 > 0 ? '达标' : '未达标' }}
-            </div>
-            <div v-else>
-              {{ FormList[i.key] }}
-            </div>
-          </el-form-item>
-        </div>
-      </el-form>
-    </div>
-  </div>
-</template>
-<script setup>
-import { projectInfoEdit } from '@/api/spongePerformance/prevention';
-import { getToken } from '@/utils/auth';
-import { projectEstimateRules } from '@/utils/rules';
-import { ElMessage, ElMessageBox } from 'element-plus';
-const { proxy } = getCurrentInstance();
-const { fund_source } = proxy.useDict('fund_source');
-const uploadHeader = ref({
-  Authorization: 'Bearer ' + getToken(),
-});
-const { typeList } = defineProps(['typeList']);
-const emits = defineEmits();
-defineExpose({ submit, closed, resetFiled });
-const IsStandFlag1 = ref(0);
-const IsStandFlag2 = ref(0);
-const IsStandText = ref('');
-let FormList = ref({ projectNo: '', fileSaveRequestList: [] });
-function ChangeClick(v, m) {
-  console.log('v', v);
-  console.log('m', m);
-  typeList.iSstandardFlag = null;
-  if (v == 'realCXQ') {
-    console.log('object1', m * 1 - FormList.value.targetCXQ * 1);
-    IsStandFlag1.value = m * 1 - FormList.value.targetCXQ * 1;
-  } else {
-    console.log('object2', m * 1 - FormList.value.targetDBMJZJCQMJ * 1);
-    IsStandFlag2.value = m * 1 - FormList.value.targetCXQ * 1;
-  }
-}
-const fileList1 = ref([]);
-function handlePreview(file) {
-  return ElMessageBox.confirm(`下载此文件: ${file.name}？`).then(
-    () => window.open(file.url),
-    () => false
-  );
-}
-function beforeRemove(file) {
-  return true;
-}
-function submit() {
-  proxy.$refs.ruleForm.validate(valid => {
-    if (valid) {
-      const fileSaveRequestList = [];
-      fileList1.value.forEach(element => {
-        if (element.hasOwnProperty('response')) {
-          element.response.data.refType = 'proProjectBudget';
-          fileSaveRequestList.push(element.response.data);
-        } else {
-          fileSaveRequestList.push(element);
-        }
-      });
-      const itemUpdateFieldRequestList = [
-        { id: typeList.data['CXQ-id'], realValue: FormList.value.realCXQ, standardFlag: IsStandFlag1.value > 0 ? 1 : 0 },
-        {
-          id: typeList.data['DBMJZJCQMJ-id' || 0],
-          realValue: FormList.value.realDBMJZJCQMJ,
-          standardFlag: IsStandFlag2.value > 0 ? 1 : 0,
-        },
-      ];
-      FormList.value = {
-        itemDataType: typeList.itemDataType,
-        standardFlag: typeList.iSstandardFlag || IsStandText.value,
-        itemUpdateFieldRequestList,
-        fileSaveRequestList,
-        performanceEvaluateId: typeList.data.performanceEvaluateId,
-      };
-      console.log('FormList.value', FormList.value);
-      projectInfoEdit(FormList.value).then(({ code }) => {
-        if (code == 200) {
-          emits('onModalClose');
-        }
-      });
-    }
-    // }
-  });
-}
-function loadProjerctListData() {
-  console.log('typeListtypeList', typeList);
-  FormList.value = typeList.data;
-  fileList1.value = typeList.fileList1;
-  proxy.$refs.ruleForm.resetFields();
-}
-function resetFiled() {
-  proxy.$refs.ruleForm.resetFields();
-  fileList1.value = [];
-}
-
-function closed() {
-  emits('onModalClose');
-}
-onMounted(() => {
-  loadProjerctListData();
-});
-</script>
-<style lang="scss" scoped>
-.water-analysis-page {
-  padding: 20px;
-}
-</style>
diff --git a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/todoDon.vue b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/todoDon.vue
deleted file mode 100644
index b3e573b..0000000
--- a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/detial/todoDon.vue
+++ /dev/null
@@ -1,156 +0,0 @@
-<template>
-  <div class="water-analysis-page">
-    <el-table :key="isFlag" :data="tableData" max-height="500" v-loading="tableLoading">
-      <el-table-column type="index" width="55" label="序号" />
-      <el-table-column :label="i.value" :prop="i.key" show-overflow-tooltip v-for="i in cloums">
-        <el-table-column v-for="item in i.titleGroup" :label="item.value" :prop="item.key" width="200"> </el-table-column>
-        <template #default="{ row }" v-if="i.key == 'standardFlag'">
-          <span :style="{ color: isDb(row.realCXQ, row.targetCXQ, row.realDBMJZJCQMJ, row.targetDBMJZJCQMJ) ? '#108ee9' : 'red' }">
-            <el-tag :type="isDb(row.realCXQ, row.targetCXQ, row.realDBMJZJCQMJ, row.targetDBMJZJCQMJ) ? 'success' : 'error'">{{
-              isDb(row.realCXQ, row.targetCXQ, row.realDBMJZJCQMJ, row.targetDBMJZJCQMJ) ? '达标' : '未达标'
-            }}</el-tag>
-          </span>
-        </template>
-        <template #default="{ row }" v-if="i.key == 'attachFileList'">
-          <span style="color: #108ee9" v-for="i in row?.attachFileList" @click="handlePreview(i)">{{ i.name }} </span>
-        </template>
-        <template #default="{ row }" v-if="i.key == 'year'">
-          {{ row.year }}
-        </template>
-        <template #default="{ row }" v-if="i.key == 'updateBy'">
-          {{ row.updateBy }}
-        </template>
-        <template #default="{ row }" v-if="i.key == 'updateTime'">
-          {{ row.updateTime }}
-        </template>
-      </el-table-column>
-      <el-table-column label="操作" width="250">
-        <template #default="{ row }">
-          <el-button link type="primary" icon="View" @click="onCheck(row, 1, '详情')">详情</el-button>
-          <el-button link icon="Edit" type="warning" @click="onCheck(row, 2, '修改')">修改</el-button>
-          <el-button link icon="Delete" type="danger" @click="onCheck(row, 3)">删除</el-button>
-        </template>
-      </el-table-column>
-    </el-table>
-  </div>
-  <pagination
-    v-show="totals > 0"
-    :total="totals"
-    v-model:page="FormList.pageNum"
-    v-model:limit="FormList.pageSize"
-    @pagination="dynamic_page_data_typeM(FormList)"
-  />
-  <el-dialog
-    v-model="visible"
-    :title="'内涝防治标准' + FormList.title"
-    :modal-append-to-body="false"
-    :close-on-click-modal="false"
-    width="51%"
-  >
-    <tableDalgo ref="tableDalgoRef" v-if="visible" @onModalClose="onModalClose" :typeList="typeList" :key="isFlag"> </tableDalgo>
-    <template #footer>
-      <div class="dialog-footer">
-        <el-button v-show="typeList.type == '2'" @click="open2" type="primary">保存</el-button>
-        <el-button @click="visible = false">关闭</el-button>
-      </div>
-    </template>
-  </el-dialog>
-</template>
-<script setup>
-import { projectInfoDelete, dynamic_page_data_type } from '@/api/spongePerformance/prevention';
-import { FileSystemList } from '@/api/project/tenderReview';
-import tableDalgo from './tableDalgo.vue';
-import { ElMessage, ElMessageBox } from 'element-plus';
-const { proxy } = getCurrentInstance();
-import { reactive } from 'vue';
-let visible = ref(false);
-let isFlag = ref(1);
-const cloums = ref([]);
-const tableDalgoRef = ref();
-const { params } = defineProps(['params']);
-const FormList = ref({
-  pageNum: 1,
-  pageSize: 10,
-  title: '',
-});
-const totals = ref(0);
-//动态组件
-let dataForm = reactive({
-  tableData: '',
-  tableDateTwo: '',
-  tableLoading: true,
-});
-let { date, tableData, tableDateTwo, tableLoading } = toRefs(dataForm);
-//获取列表数据
-//搜索
-const search = p => {
-  FormList.value.pageNum = 1;
-  dynamic_page_data_typeM(p);
-  isFlag.value++;
-};
-defineExpose({ search });
-// 查看上报数据
-let typeList = ref({});
-const onCheck = (row, ty, t) => {
-  FormList.value.title = t;
-  if (ty == 1 || ty == 2) {
-    typeList.value = {
-      ...params,
-      data: row,
-      type: ty,
-      monitorDynamicTableTitleList: cloums.value,
-      iSstandardFlag: isDb(row.realCXQ, row.targetCXQ, row.realDBMJZJCQMJ, row.targetDBMJZJCQMJ),
-    };
-    FileSystemList({
-      refId: row.performanceEvaluateId,
-      refType: 'proProjectBudget',
-    }).then(({ data }) => {
-      typeList.value.fileList1 = data;
-      visible.value = true;
-    });
-    // 获取文件列表
-  } else if (ty == 3) {
-    proxy.$modal
-      .confirm(`是否确认删除?`)
-      .then(async () => {
-        projectInfoDeleteM(row.performanceEvaluateId);
-        getTableData();
-      })
-      .catch(() => {});
-  }
-};
-//删除
-const projectInfoDeleteM = async id => {
-  let { code } = await projectInfoDelete(id);
-  search(p);
-};
-const dynamic_page_data_typeM = async id => {
-  let { code, data, monitorDynamicTableTitleList, total } = await dynamic_page_data_type(id);
-  tableData.value = data;
-  totals.value = total;
-  cloums.value = monitorDynamicTableTitleList;
-  tableLoading.value = false;
-};
-function onModalClose() {
-  visible.value = false;
-  // dynamic_page_data_typeM();
-  dynamic_page_data_typeM(params);
-}
-
-function open2() {
-  tableDalgoRef.value.submit();
-}
-function handlePreview(file) {
-  return ElMessageBox.confirm(`下载此文件: ${file.name}？`).then(
-    () => window.open(file.url),
-    () => false
-  );
-}
-function isDb(v, m, n, f) {
-  return v * 1 - m * 1 > 0 && n * 1 - f * 1 > 0;
-}
-onMounted(() => {
-  dynamic_page_data_typeM(params);
-});
-</script>
-<style lang="scss" scoped></style>
diff --git a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/index.vue b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/index.vue
index ed206ea..83e8850 100644
--- a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/index.vue
+++ b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/index.vue
@@ -1,106 +1,77 @@
 <template>
+  <!-- 黑臭水体消除比例 -->
   <div class="water-analysis-page">
-    <div class="top">
-      <div class="top" v-if="!isComponent">
-        <div class="icon">
-          <!-- <div class="tittle">黑臭水体年度考核统计表</div> -->
-          <todoDon ref="todoDonRef" :params="tableData" @searchClick="searchClick" @clicksWaterBodies="clicksWaterBodies"></todoDon>
-        </div>
-        <div class="tuli">
-          <div style="margin: 10px; font-size: 18px">图例</div>
-          <div v-for="i in tuliList" class="tuli_img">
-            <img :src="i.icon" alt="" />
-            <div>{{ i.label }}</div>
-          </div>
-        </div>
-        <!-- gis地图 -->
-        <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
-      </div>
-      <detial v-else-if="isComponent == 1" @searchClick="searchClick" :paramsData="params"> </detial>
+    <div class="icon">
+      <todoDon ref="todoDonRef" :params="tableData" @searchClick="searchClick" @clicksWaterBodies="clicksWaterBodies"></todoDon>
     </div>
-    <div class="PopupWaterlogging" id="PopupWaterlogging" v-if="pipePopupShow">
-      <div class="titleTop">
-        <el-tabs class="PopupWaterloggingtabs">
-          <el-tab-pane label="水质化验记录">
-            <el-table
-              ref="tableModal"
-              :data="tableData2"
-              max-height="320"
-              v-loading="tableLoading"
-              @row-click="clickModal"
-              highlight-current-row
-            >
-              <el-table-column type="index" width="55" label="序号" />
-              <el-table-column label="采样时间" prop="sampleTime" />
-              <el-table-column label="采样点" prop="sampleLocation" />
-              <el-table-column label="透明度（cm）" prop="CLA" />
-              <el-table-column label="溶解氧mg/L" prop="DOX" />
-              <el-table-column label="黑臭程度" prop="blackOdorName">
-                <template #default="scope">
-                  <span
-                    :style="{
-                      color:
-                        scope.row.blackOdorName == '无黑臭'
-                          ? 'greenyellow'
-                          : scope.row.blackOdorName == '轻度黑臭'
-                          ? ' #419fff'
-                          : scope.row.blackOdorName == '中度黑臭'
-                          ? 'orange'
-                          : scope.row.blackOdorName == '重度黑臭'
-                          ? 'red'
-                          : '',
-                    }"
-                  >
-                    {{
-                      scope.row.blackOdorName == '无黑臭'
-                        ? '无黑臭'
-                        : scope.row.blackOdorName == '轻度黑臭'
-                        ? '轻度黑臭'
-                        : scope.row.blackOdorName == '中度黑臭'
-                        ? '中度黑臭'
-                        : scope.row.blackOdorName == '重度黑臭'
-                        ? '重度黑臭'
-                        : ''
-                    }}
-                  </span>
-                </template>
-              </el-table-column>
-            </el-table>
-          </el-tab-pane>
-          <el-tab-pane label="工程治理" class="proimageList">
-            <div style="margin-top: 10px">黑臭水体治理工法： {{ popsdata.treatmentMethod }}</div>
-            <div style="margin-top: 10px">治理前/后照片：</div>
-            <el-image
-              style="width: 150px; margin-top: 10px"
-              v-for="i in popsdata.imageList"
-              :src="i.url"
-              :zoom-rate="1"
-              :initial-index="4"
-              :preview-src-list="[i.url]"
-            />
-          </el-tab-pane>
-        </el-tabs>
-      </div>
-      <div class="closePopup">
-        <el-icon :size="18" @click="closePopup"><Close /></el-icon>
+    <div class="tuli">
+      <div style="margin: 10px; font-size: 18px">图例</div>
+      <div v-for="i in tuliList" class="tuli_img">
+        <img :src="i.icon" alt="" />
+        <div>{{ i.label }}</div>
       </div>
     </div>
+    <!-- gis地图 -->
+    <MapBox :initJson="`/static/libs/mapbox/style/preventionCX.json`"></MapBox>
   </div>
+  <!-- 地图水体点击弹窗 -->
+  <el-dialog v-model="dialogShow" title="2022黄汴河水质监测详情" :modal-append-to-body="false" width="900px">
+    <div class="hcstDialog">
+      <div class="part">
+        <div class="title">透明度(cm)</div>
+        <ChartBar3D :refresh="refresh1" :echartData="echartData1" class="chart"></ChartBar3D>
+      </div>
+      <div class="part">
+        <div class="title">氨氮(mg/L)</div>
+        <ChartBar3D :refresh="refresh2" :echartData="echartData2" class="chart"></ChartBar3D>
+      </div>
+      <div class="part">
+        <div class="title">溶解氧(mg/L)</div>
+        <ChartBar3D :refresh="refresh3" :echartData="echartData3" class="chart"></ChartBar3D>
+      </div>
+      <div class="part">
+        <div class="title">氧化还原电位(mV)</div>
+        <ChartBar3D :refresh="refresh4" :echartData="echartData4" class="chart"></ChartBar3D>
+      </div>
+    </div>
+  </el-dialog>
 </template>
 <script setup>
 import { blackOdorpaging, blackOdorpagingriverInfo } from '@/api/spongePerformance/surfaceWater';
-import detial from './detial/index';
 import MapBox from '@/views/gisMapPage/gisMapBox1'; //gis地图
 import todoDon from './todoDon.vue';
+import ChartBar3D from '@/views/sponeScreen/Echarts/echartBar3D.vue';
+
 const { proxy } = getCurrentInstance();
+const dialogShow = ref(true);
+const refresh1 = ref(1);
+const refresh2 = ref(1);
+const refresh3 = ref(1);
+const refresh4 = ref(1);
+const echartData1 = ref({
+  xAxis: ['3月', '4月', '9月', '11月'],
+  seriesData: [52, 35, 69, 86, 22],
+});
+const echartData2 = ref({
+  xAxis: ['3月', '4月', '9月', '11月'],
+  seriesData: [0.8, 0.35, 1.12, 0.9, 0.98],
+});
+const echartData3 = ref({
+  xAxis: ['3月', '4月', '9月', '11月'],
+  seriesData: [5.4, 13, 9.2, 10.4, 8.9],
+});
+const echartData4 = ref({
+  xAxis: ['3月', '4月', '9月', '11月'],
+  seriesData: [126, 162, 119, 86, 113],
+});
 const todoDonRef = ref(null);
 const pipePopupShow = ref(false);
 const popsdata = ref('');
 
 let isComponent = ref(0);
 let tuliList = ref([
-  { label: '未消除', id: 0, icon: '/images/1.1.jpg' },
-  { label: '已消除', id: 1, icon: '/images/1.2.jpg' },
+  { label: '未考核', id: 0, icon: '/images/1.1.jpg' },
+  { label: '已考核', id: 1, icon: '/images/1.2.jpg' },
 ]);
 const tableData2 = ref([]);
 //动态组件
@@ -140,9 +111,6 @@
   }
 };
 
-const closePopup = () => {
-  pipePopupShow.value = false;
-};
 const clicksWaterBodies = row => {
   let ids = '';
   if (row.riverId) {
@@ -155,101 +123,68 @@
 };
 onMounted(() => {});
 </script>
-<style lang="scss" scoped>
-@import '@/assets/styles/variables.module.scss';
-#map {
-  width: 100%;
-  height: 100%;
-}
-.form {
-  left: 10px;
-  top: 10px;
-  z-index: 111;
-  position: absolute;
-  width: 20%;
-}
-.top {
-  position: relative;
-  height: 86vh;
-}
-.icon {
-  right: 0;
-  top: 0;
-  z-index: 111;
-  position: absolute;
-  width: 70%;
-}
-.tuli {
-  left: 20px;
-  bottom: 30px;
-  padding: 10px;
-  z-index: 111;
-  position: absolute;
-  background: $mainColor1;
-  // display: flex;
+<style lang="scss">
+.hcstDialog {
+  display: flex;
   flex-wrap: wrap;
-  align-items: center;
-  text-align: center;
-  color: #fff;
-  .tuli_img {
-    display: flex;
-    width: 100px;
-    align-items: center;
-    margin-top: 8px;
-    img {
-      margin-right: 10px;
-      width: 25px;
+  .part {
+    width: 48%;
+    margin-right: 2%;
+    .title {
+      font-size: 18px;
+      font-weight: bold;
+      color: #fff;
+    }
+    .chart {
+      height: 300px !important;
     }
   }
 }
-.tittle {
-  font-size: 16px;
-  font-weight: bold;
-  width: 200px;
-  height: 40px;
-  line-height: 40px;
-  text-align: center;
-  margin: 5px 0;
-  color: #fff;
-}
-.tittle1 {
-  background: transparent;
-}
+@import '@/assets/styles/variables.module.scss';
+
 .water-analysis-page {
   padding: 20px;
-  overflow-y: hidden;
-}
-
-#PopupWaterlogging {
-  position: fixed;
-  left: 52%;
-  top: 54%;
-  transform: translate(-50%, -50%);
-  width: 700px;
-  height: 410px;
-  background: #021534;
-  border: 1px solid #114f89;
-  z-index: 2000;
-  display: flex;
-
-  .titleTop {
-    width: 95%;
-    display: flex;
-    padding-top: 8px;
-    margin-left: 20px;
-  }
-  .closePopup {
-    width: 5%;
-    margin: 15px;
-    cursor: pointer;
-  }
-  .PopupWaterloggingtabs {
+  height: 100%;
+  position: relative;
+  #map {
     width: 100%;
     height: 100%;
   }
-}
-.proimageList {
-  height: 300px;
-  overflow-y: auto;
+  .form {
+    left: 10px;
+    top: 10px;
+    z-index: 111;
+    position: absolute;
+    width: 20%;
+  }
+  .icon {
+    right: 0;
+    top: 0;
+    z-index: 111;
+    position: absolute;
+    width: 800px;
+  }
+  .tuli {
+    left: 20px;
+    bottom: 30px;
+    padding: 10px;
+    z-index: 111;
+    position: absolute;
+    background: $mainColor1;
+    flex-wrap: wrap;
+    align-items: center;
+    text-align: center;
+    color: #fff;
+    .tuli_img {
+      display: flex;
+      width: 100px;
+      align-items: center;
+      margin-top: 8px;
+      img {
+        margin-right: 10px;
+        width: 25px;
+      }
+    }
+  }
 }
 </style>
diff --git a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/todoDon.vue b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/todoDon.vue
index 9b374ea..d09779a 100644
--- a/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/todoDon.vue
+++ b/src/views/spongePerformance/waterUtilizationRate/odorousWaterBodies/todoDon.vue
@@ -1,17 +1,17 @@
 <template>
   <div class="water-analysis-page">
-    <el-table :data="tableData" max-height="500" ref="tableRef" v-loading="tableLoading" @row-click="clickTableRow" highlight-current-row>
+    <el-table :data="tableData" ref="tableRef" v-loading="tableLoading" @row-click="clickTableRow" highlight-current-row>
       <el-table-column label="年度" prop="examineYear" />
       <el-table-column label="黑臭水体/个" prop="unRemoveNum" />
       <el-table-column label="考核水体数/个" prop="totalNum" />
-      <el-table-column label="消除比%" prop="actualPercent">
+      <el-table-column label="目标消除比%" prop="targetPercent" />
+      <el-table-column label="实际消除比%" prop="actualPercent">
         <template #default="{ row }">
           <span style="color: lime">
             {{ row.actualPercent }}
           </span>
         </template>
       </el-table-column>
-      <el-table-column label="目标消除比%" prop="targetPercent" />
       <el-table-column label="达标情况" prop="reachStandard">
         <template #default="scope">
           <span
@@ -26,11 +26,6 @@
           </span>
         </template>
       </el-table-column>
-      <el-table-column label="水体检测记录">
-        <template #default="{ row }">
-          <el-button link type="primary" icon="View" @click="onCheck(row)">查看</el-button>
-        </template>
-      </el-table-column>
     </el-table>
   </div>
 </template>
@@ -58,10 +53,7 @@
     clickTableRow(tableData.value[0]); //默认渲染第一行gis地图
   }
 };
-//查看点击事件
-const onCheck = row => {
-  emits('searchClick', { ...row, type: 1 });
-};
+
 // 表格点击，查看对应的项目情况
 function clickTableRow(row) {
   row.blackOdorSampleInfos &&
@@ -106,36 +98,6 @@
     });
     let geojson1 = turf.featureCollection(coverflowFeature);
     addWaterloggingLayer(geojson1, 'odorousWaterBodies');
-
-    // bus.emit('getGeojsonByType', {
-    //   type: key,
-    //   callback: geojson => {
-    //     setTimeout(() => {
-    //       bus.emit('removeMapDatas', [key]);
-    //       if (!!!geojson.features.length) bus.emit('setGeoJSON', { json: geojson1, key });
-    //       bus.emit('setLayerVisible', { layername: key, isCheck: true });
-    //     }, 2000);
-    //   },
-    // });
-    geojson1.features.forEach(feature => {
-      return newfiberMapbox.addPopup(
-        new mapboxL7.Popup({
-          title: '',
-          html: `
-          <div class='popupMapPoint successPopup'  style=" background-color: rgba(247, 189, 15, 0.5); border: 2px solid #f7bd0f;"><div class='titles' style="padding-left:10px; font-size:16px">${feature.properties.riverName}</div>
-          <div class='part'>黑臭程度：${feature.properties.blackOdorName}</div>
-          <div class='part'>是否达标：${feature.properties.reachStandard}</div>
-          </div>`,
-          lngLat: {
-            lng: feature.geometry.coordinates[0],
-            lat: feature.geometry.coordinates[1],
-          },
-          anchor: 'center',
-          offsets: [0, 60],
-          autoClose: false,
-        })
-      );
-    });
   });
 }
 //地图渲染内涝点
diff --git a/src/views/spongePerformance/waterlogging/floodControlStandard/tableDalgo.vue b/src/views/spongePerformance/waterlogging/floodControlStandard/tableDalgo.vue
index 856dd6b..654afc3 100644
--- a/src/views/spongePerformance/waterlogging/floodControlStandard/tableDalgo.vue
+++ b/src/views/spongePerformance/waterlogging/floodControlStandard/tableDalgo.vue
@@ -41,25 +41,37 @@
         <div class="csfhbzM"></div>
       </el-form>
     </div>
+
+    <!-- 地图标记点点击查看历史水位数据 -->
+    <el-dialog v-model="dialogShow" title="河道历史水位" :modal-append-to-body="false" width="600px">
+      <div style="margin-bottom: 20px">
+        <el-form inline>
+          <el-form-item label="日期:" prop="hisDate">
+            <el-date-picker v-model="hisDate" type="daterange" value-format="YYYY-MM-DD" placeholder="请选择" />
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary" icon="Search" @click="searchData">查询</el-button>
+          </el-form-item>
+        </el-form>
+        <div id="chartHistoryR" style="width: 100%; height: 300px"></div>
+      </div>
+    </el-dialog>
   </div>
 </template>
 <script setup>
-import { projectInfoAdd, projectInfoEdit } from '@/api/spongePerformance/prevention';
-import { getToken } from '@/utils/auth';
+import { projectInfoEdit } from '@/api/spongePerformance/prevention';
 import { projectEstimateRules } from '@/utils/rules';
-import { ElMessage, ElMessageBox } from 'element-plus';
+import chartOption from '@/components/Echarts/pieChart_1.js';
+import * as echarts from 'echarts';
 
 const { proxy } = getCurrentInstance();
-const { fund_source } = proxy.useDict('fund_source');
-const uploadHeader = ref({
-  Authorization: 'Bearer ' + getToken(),
-});
+const dialogShow = ref(false);
+const hisDate = ref([proxy.moment(new Date()).subtract(60, 'days').format('YYYY-MM-DD'), proxy.moment().format('YYYY-MM-DD')]);
 const { typeList } = defineProps(['typeList']);
 const emits = defineEmits();
 defineExpose({ submit, closed, resetFiled });
 const IsStandFlag1 = ref(0);
 const fileSaveRequestList = ref([]);
-const IsStandText = ref('');
 let FormList = ref({ projectNo: '', fileSaveRequestList: [] });
 function ChangeClick(v, m) {
   typeList.iSstandardFlag = null;
@@ -107,8 +119,49 @@
 function closed() {
   emits('onModalClose');
 }
+
+// 历史水位查询
+function searchData() {
+  setTimeout(() => {
+    getRiverData();
+  }, 0);
+}
+
+// 河道echarts
+let chartRiver = null;
+async function getRiverData() {
+  if (!!chartRiver) chartRiver.dispose();
+  chartRiver = echarts.init(document.getElementById('chartHistoryR'));
+  // echarts赋值
+  let arrs = [
+    {
+      riverX: [0, 10, 17, 25, 34, 55],
+      riverY: [25, 20, 15, 8, 10, 28],
+      sfZ: 23.5,
+      z: 22,
+    },
+  ];
+  chartOption.floodOneMapFXYP.xAxis[0].data = arrs[0].riverX;
+  chartOption.floodOneMapFXYP.series[1].data = arrs[0].riverY;
+  chartOption.floodOneMapFXYP.series[1].markLine.data[0].yAxis = arrs[0].sfZ;
+  chartOption.floodOneMapFXYP.series[1].markLine.data[0].label.formatter = '设防水位 ' + arrs[0].sfZ + 'm';
+  let arrs2 = [];
+  arrs[0].riverX.map(item => {
+    arrs2.push(arrs[0].z);
+  });
+  chartOption.floodOneMapFXYP.series[0].data = arrs2;
+  if (arrs[0].riverX.length == 0) {
+    chartOption.floodOneMapFXYP.graphic.invisible = false; //暂无数据
+  } else {
+    chartOption.floodOneMapFXYP.graphic.invisible = true; //暂无数据
+  }
+  chartRiver.clear();
+  chartRiver.setOption(chartOption.floodOneMapFXYP);
+}
+
 onMounted(() => {
   loadProjerctListData();
+  searchData(); //搜索
 });
 </script>
 <style lang="scss" scoped>
diff --git a/vite.config.js b/vite.config.js
index 24dcf41..ea36ec6 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -7,8 +7,8 @@
 const Timestamp = new Date().getTime(); //随机时间戳
 
 // const targetUrl = 'http://192.168.16.254:7200'; //孙逢时
-const targetUrl = 'http://192.168.20.52:7300'; //杨辉
-// const targetUrl = 'https://server2.wh-nf.cn:8082/prod-api'; //线上
+// const targetUrl = 'http://192.168.20.52:7300'; //杨辉
+const targetUrl = 'https://server2.wh-nf.cn:8082/prod-api'; //线上
 
 // https://vitejs.dev/config/
 export default defineConfig(({ mode, command }) => {