diff --git a/src/views/sponeScreen/longYW/SewageBOD.vue b/src/views/sponeScreen/longYW/SewageBOD.vue
index c66b916..0b56f1a 100644
--- a/src/views/sponeScreen/longYW/SewageBOD.vue
+++ b/src/views/sponeScreen/longYW/SewageBOD.vue
@@ -3,25 +3,27 @@
     <div class="partTitleHM">
       污水厂进口BOD
       <div class="head-right" style="">
-        <el-form-item prop="BODName" style="width: 55%">
-          <el-select clearable v-model="queryParams.BODName" size="small">
-            <el-option v-for="item in ListBod" :key="item.value" :label="item.name" :value="item.value" />
+        <el-form-item prop="sewageCode" style="width: 55%">
+          <el-select :clearable="false" v-model="queryParams.sewageCode" size="small" @change="changeSewage">
+            <el-option v-for="item in ListBod" :key="item.sewageCode" :label="item.sewageName" :value="item.sewageCode" />
           </el-select>
         </el-form-item>
         <el-form-item style="width: 41%; margin-left: 10px">
           <el-date-picker
             type="year"
-            v-model="dateYear"
+            v-model="queryParams.dataTime"
             value-format="YYYY"
             placeholder="请选择年"
             style="width: 100%"
             size="small"
+            @change="changeDataTime"
+            :clearable="false"
           ></el-date-picker>
         </el-form-item>
       </div>
     </div>
     <div class="ConstrucClass">
-      <SewageBODEchaer :data="chartData3" :refresh1="chartData3.refresh1"></SewageBODEchaer>
+      <SewageBODEchaer :data="chartData3" :key="refresh1"></SewageBODEchaer>
     </div>
   </div>
 </template>
@@ -29,28 +31,73 @@
 <script setup>
 import { ref, nextTick, onMounted, reactive } from 'vue';
 import SewageBODEchaer from '@/views/sponeScreen/Echarts/SewageBODEchaer.vue';
+import { sewageBodPage, facilitySewagelist } from '@/api/publicService/index';
 const { proxy } = getCurrentInstance();
-
-const dateYear = ref(proxy.moment(new Date()).format('YYYY'));
-const ListBod = ref([
-  { name: '东区污水厂', value: '1' },
-  { name: '西区污水厂', value: '2' },
-  { name: '老马家污水厂', value: '3' },
-  { name: '包公湖污水厂', value: '4' },
-]);
+const ListBod = ref([]);
 
 const refresh1 = ref(1);
 const chartData3 = ref({
-  XName: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
-  data1: [200, 150, 200, 220, 240, 110, 135, 140, 130, 240, 180, 150],
-  controlMarkLine: [{ typeName: '考核达标', value: '135', Opacity: 1, color: '#e15a6b' }],
-  refresh1: 1,
+  XName: [],
+  data1: [],
+  controlMarkLine: [],
 });
 const AllData = reactive({
-  queryParams: { BODName: '1' },
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10000,
+    sewageCode: undefined,
+    dataTime: undefined,
+  },
 });
 const { queryParams } = toRefs(AllData);
-onMounted(() => {});
+
+//下拉框列表
+function getUserList() {
+  facilitySewagelist().then(res => {
+    ListBod.value = res.data || [];
+    queryParams.value.sewageCode = res.data[2].sewageCode;
+  });
+}
+/** 获取搜索数据列表 */
+function getDataList() {
+  sewageBodPage(queryParams.value).then(response => {
+    if (queryParams.value.dataTime == '2022') {
+      chartData3.value.controlMarkLine = [{ typeName: '考核达标', value: '130', Opacity: 1, color: '#e15a6b' }];
+    } else if (queryParams.value.dataTime == '2023') {
+      chartData3.value.controlMarkLine = [{ typeName: '考核达标', value: '132', Opacity: 1, color: '#e15a6b' }];
+    } else {
+      chartData3.value.controlMarkLine = [{ typeName: '考核达标', value: '135', Opacity: 1, color: '#e15a6b' }];
+    }
+    let SewageList = [];
+    let SewageTime = [];
+    response.data.forEach(element => {
+      SewageList.push(Number(element.bod));
+      SewageTime.push(element.dataTime);
+    });
+    chartData3.value.data1 = SewageList;
+    chartData3.value.XName = SewageTime;
+    refresh1.value++;
+  });
+}
+// 下拉框事件
+function changeSewage(val) {
+  queryParams.value.sewageCode = val;
+  getDataList(queryParams.value);
+}
+
+// 年份事件
+function changeDataTime(val) {
+  queryParams.value.dataTime = val;
+  getDataList(queryParams.value);
+}
+
+onMounted(() => {
+  queryParams.value.dataTime = '2023';
+  getUserList();
+  setTimeout(() => {
+    getDataList();
+  }, 350);
+});
 </script>
 
 <style lang="scss" scoped>

diff --git a/src/views/sponeScreen/longYW/SewageBOD.vue b/src/views/sponeScreen/longYW/SewageBOD.vue
index c66b916..0b56f1a 100644
--- a/src/views/sponeScreen/longYW/SewageBOD.vue
+++ b/src/views/sponeScreen/longYW/SewageBOD.vue
@@ -3,25 +3,27 @@
     <div class="partTitleHM">
       污水厂进口BOD
       <div class="head-right" style="">
-        <el-form-item prop="BODName" style="width: 55%">
-          <el-select clearable v-model="queryParams.BODName" size="small">
-            <el-option v-for="item in ListBod" :key="item.value" :label="item.name" :value="item.value" />
+        <el-form-item prop="sewageCode" style="width: 55%">
+          <el-select :clearable="false" v-model="queryParams.sewageCode" size="small" @change="changeSewage">
+            <el-option v-for="item in ListBod" :key="item.sewageCode" :label="item.sewageName" :value="item.sewageCode" />
           </el-select>
         </el-form-item>
         <el-form-item style="width: 41%; margin-left: 10px">
           <el-date-picker
             type="year"
-            v-model="dateYear"
+            v-model="queryParams.dataTime"
             value-format="YYYY"
             placeholder="请选择年"
             style="width: 100%"
             size="small"
+            @change="changeDataTime"
+            :clearable="false"
           ></el-date-picker>
         </el-form-item>
       </div>
     </div>
     <div class="ConstrucClass">
-      <SewageBODEchaer :data="chartData3" :refresh1="chartData3.refresh1"></SewageBODEchaer>
+      <SewageBODEchaer :data="chartData3" :key="refresh1"></SewageBODEchaer>
     </div>
   </div>
 </template>
@@ -29,28 +31,73 @@
 <script setup>
 import { ref, nextTick, onMounted, reactive } from 'vue';
 import SewageBODEchaer from '@/views/sponeScreen/Echarts/SewageBODEchaer.vue';
+import { sewageBodPage, facilitySewagelist } from '@/api/publicService/index';
 const { proxy } = getCurrentInstance();
-
-const dateYear = ref(proxy.moment(new Date()).format('YYYY'));
-const ListBod = ref([
-  { name: '东区污水厂', value: '1' },
-  { name: '西区污水厂', value: '2' },
-  { name: '老马家污水厂', value: '3' },
-  { name: '包公湖污水厂', value: '4' },
-]);
+const ListBod = ref([]);
 
 const refresh1 = ref(1);
 const chartData3 = ref({
-  XName: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
-  data1: [200, 150, 200, 220, 240, 110, 135, 140, 130, 240, 180, 150],
-  controlMarkLine: [{ typeName: '考核达标', value: '135', Opacity: 1, color: '#e15a6b' }],
-  refresh1: 1,
+  XName: [],
+  data1: [],
+  controlMarkLine: [],
 });
 const AllData = reactive({
-  queryParams: { BODName: '1' },
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10000,
+    sewageCode: undefined,
+    dataTime: undefined,
+  },
 });
 const { queryParams } = toRefs(AllData);
-onMounted(() => {});
+
+//下拉框列表
+function getUserList() {
+  facilitySewagelist().then(res => {
+    ListBod.value = res.data || [];
+    queryParams.value.sewageCode = res.data[2].sewageCode;
+  });
+}
+/** 获取搜索数据列表 */
+function getDataList() {
+  sewageBodPage(queryParams.value).then(response => {
+    if (queryParams.value.dataTime == '2022') {
+      chartData3.value.controlMarkLine = [{ typeName: '考核达标', value: '130', Opacity: 1, color: '#e15a6b' }];
+    } else if (queryParams.value.dataTime == '2023') {
+      chartData3.value.controlMarkLine = [{ typeName: '考核达标', value: '132', Opacity: 1, color: '#e15a6b' }];
+    } else {
+      chartData3.value.controlMarkLine = [{ typeName: '考核达标', value: '135', Opacity: 1, color: '#e15a6b' }];
+    }
+    let SewageList = [];
+    let SewageTime = [];
+    response.data.forEach(element => {
+      SewageList.push(Number(element.bod));
+      SewageTime.push(element.dataTime);
+    });
+    chartData3.value.data1 = SewageList;
+    chartData3.value.XName = SewageTime;
+    refresh1.value++;
+  });
+}
+// 下拉框事件
+function changeSewage(val) {
+  queryParams.value.sewageCode = val;
+  getDataList(queryParams.value);
+}
+
+// 年份事件
+function changeDataTime(val) {
+  queryParams.value.dataTime = val;
+  getDataList(queryParams.value);
+}
+
+onMounted(() => {
+  queryParams.value.dataTime = '2023';
+  getUserList();
+  setTimeout(() => {
+    getDataList();
+  }, 350);
+});
 </script>
 
 <style lang="scss" scoped>
diff --git a/src/views/spongePerformance/longTerm/permeableGroundAreaCX.vue b/src/views/spongePerformance/longTerm/permeableGroundAreaCX.vue
index 25a10cb..488f33d 100644
--- a/src/views/spongePerformance/longTerm/permeableGroundAreaCX.vue
+++ b/src/views/spongePerformance/longTerm/permeableGroundAreaCX.vue
@@ -15,7 +15,7 @@
           <el-option label="2024年" value="2024"></el-option>
           <el-option label="2025年" value="2025"></el-option>
         </el-select> -->
-        <div class="titleEnd">建成区面积：{{ areaData }}k㎡</div>
+        <div class="titleEnd">建成区面积:{{ areaData }}公顷</div>
       </div>
       <div id="chartAreaST" class="chartHeight"></div>