饮用水框架页面

src/api/ecology/new-drinking-water.js

@@ -22,6 +22,12 @@ export const getWaterCount = function (data) {
     return axios.post(pageanalyseListUrl,data)
 }
 
+//市级—超标评价
+export const overStandardtUrl = '/drinkingWater/drinkingWater/AnalysePage';
+export const overStandardCount = function (data) {
+    return axios.post(overStandardtUrl,data)
+}
+
 
 //市级—水质类别
 export const waterQualityUrl = '/drinkingWater/drinkingWater/AnalysePage';
@@ -55,3 +61,23 @@ export const countyPageBsaeListUrl = '/drinkingWater/drinkingWater/CountyAnalyse
 export const countyPageBsaeData = function (data) {
     return axios.post(countyPageBsaeListUrl,data)
 }
+
+//报送情况说明表
+export const countyDescripFormUrl = '/drinkingWater/drinkingWater/getCountyDescripForm';
+export const countyDescripFormData = function (data) {
+    return axios.post(countyDescripFormUrl,data)
+}
+
+//县级—超标评价
+export const countyOverStandardtUrl = '/drinkingWater/drinkingWater/AnalysePage';
+export const countyOverStandardCount = function (data) {
+    return axios.post(countyOverStandardtUrl,data)
+}
+
+
+
+// 农村
+export const villageAnalysePageUrl = '/drinkingWaterVillage/drinkingWaterVillage/VillageAnalysePage';
+export const villageAnalysePageData = function (data) {
+    return axios.post(villageAnalysePageUrl,data)
+}

src/views/water/drinking-water/statistic/city/base.vue

@@ -25,7 +25,7 @@
       >
       <template #footer>
         <div class="footer">
-          饮用水源水质监测累积月份统计样品数：10个
+          饮用水源水质监测累积月份统计样品数：{{count}}个
         </div>
       </template>
 
@@ -66,7 +66,7 @@ import {
 } from "@/api/ecology/new-drinking-water";
 import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
 import { tableColumns } from "./../colums/base";
-import Search from "./../components/search.vue";
+import Search from "./../components/citySearch.vue";
 
 export default {
   name: "DrinkingWaterBase",
@@ -93,6 +93,7 @@ export default {
   },
   data() {
     return {
+      count:0, //样品数
       current:0,
       data: [],
       locale,
@@ -110,7 +111,7 @@ export default {
       },
       // 表格选中数据
       selectionList: [],
-      loading:false
+      loading:false,
     };
   },
   watch: {
@@ -131,8 +132,10 @@ export default {
                 if(res.data.code){
                     this.$message.error(res.data.msg);
                     this.datasource = []
+                    this.count = 0
                 }else{
                     this.datasource = res.data.data
+                    this.count = res.data.count
                 }
             }).catch(()=>{
                  this.loading = false;

src/views/water/drinking-water/statistic/city/overStandard.vue

@@ -15,7 +15,8 @@
         v-model:selection="selectionList"
         ref="table"
         row-key="drinkingWaterId"
-        :datasource="url"
+        :datasource="datasource"
+        :loading="loading"
         :columns="columns"
         :where="where"
         :scroll="{ x: 'max-content' }"
@@ -31,11 +32,10 @@
 <script>
 // import _ from "lodash";
 import XLSX from "xlsx";
-import Search from "./../components/search.vue";
+import Search from "./../components/citySearch.vue";
 import {
-  pageDrinkingWaterStatisticUrl,
+  overStandardCount
-  // getColumnOptions
+} from "@/api/ecology/new-drinking-water";
-} from "@/api/ecology/drinking-water";
 import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
 // import { tableColumns } from "./colums";
 
@@ -65,7 +65,7 @@ export default {
       locale,
       bill: {},
       // 表格数据接口
-      url: pageDrinkingWaterStatisticUrl,
+      datasource:[],
       selection: [],
       columns: [
        {title: "城市名称",dataIndex: "sourceWaterName",sorter: true,},
@@ -84,12 +84,30 @@ export default {
       },
       // 表格选中数据
       selectionList: [],
+      loading:false
     };
   },
   mounted() {
     // this.loadOptionData();
   },
   methods: {
+
+    // 获取列表数据
+    getPageData(){
+          this.loading = true;
+        overStandardCount(this.where).then(res=>{
+              this.loading = false;
+            if(res.data.code){
+                this.$message.error(res.data.msg);
+                this.datasource = []
+            }else{
+                this.datasource = res.data.data
+            }
+        }).catch(()=>{
+              this.loading = false;
+        })
+    },
+
     JumpFieldClick(record, column) {
       console.log(column.dataIndex);
     },
@@ -107,9 +125,10 @@ export default {
 
     /* 刷新表格 */
     reload() {
-      this.$refs.table.reload({
+      this.getPageData()
-        where: this.where,
+      // this.$refs.table.reload({
-      });
+      //   where: this.where,
+      // });
     },
     /* 重置搜索 */
     reset() {

src/views/water/drinking-water/statistic/city/situation.vue

@@ -89,7 +89,7 @@ import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
 // import { tableColumns } from "./colums";
 // import moment from "moment";
 
-import Search from "./../components/search.vue";
+import Search from "./../components/citySearch.vue";
 import { CheckOutlined, EditOutlined } from '@ant-design/icons-vue';
 export default {
   name: "DrinkingWaterBase",

src/views/water/drinking-water/statistic/city/waterCount.vue

@@ -32,7 +32,7 @@
 <script>
 // import _ from "lodash";
 import XLSX from "xlsx";
-import Search from "./../components/search.vue";
+import Search from "./../components/citySearch.vue";
 
 import {
   getWaterCount

src/views/water/drinking-water/statistic/city/waterNutritional.vue

@@ -37,7 +37,7 @@ import {
 
 import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
 
-import Search from "./../components/search.vue";
+import Search from "./../components/citySearch.vue";
 
 export default {
   name: "waterQuality",

src/views/water/drinking-water/statistic/city/waterQuality.vue

@@ -37,7 +37,7 @@ import {
 
 import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
 
-import Search from "./../components/search.vue";
+import Search from "./../components/citySearch.vue";
 
 export default {
   name: "waterQuality",

src/views/water/drinking-water/statistic/city/waterQualityCount.vue

@@ -38,7 +38,7 @@ import {
 
 import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
 
-import Search from "./../components/search.vue";
+import Search from "./../components/citySearch.vue";
 
 export default {
   name: "waterQualityCount",

src/views/water/drinking-water/statistic/city/waterQualityUp.vue

@@ -37,7 +37,7 @@ import {
 
 import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
 
-import Search from "./../components/search.vue";
+import Search from "./../components/citySearch.vue";
 
 export default {
   name: "waterQuality",

src/views/water/drinking-water/statistic/components/citySearch.vue

@@ -48,7 +48,7 @@
     <a-row>
       <a-col :lg="6" :md="12" :sm="24" :xs="24">
       <a-form-item label="断面名称:">
-          <a-select v-model:value="where.drinkingWaterAnalyse.sectionName" mode="multiple" allowClear showSearch>
+          <a-select v-model:value="where.drinkingWaterAnalyse.sectionNames" mode="multiple" allowClear showSearch>
             <a-select-option v-for="item in sectionInfo" :key="item.sectionName">{{ item.sectionName }}
               </a-select-option>
           </a-select>

src/views/water/drinking-water/statistic/components/countySearch.vue

@@ -0,0 +1,314 @@
+<template>
+  <a-form
+    :model="where"
+    :label-col="{ md: { span: 6 }, sm: { span: 24 } }"
+    :wrapper-col="{ md: { span: 18 }, sm: { span: 24 } }"
+  >
+    <a-row>
+      <a-col :lg="6" :md="12" :sm="24" :xs="24">
+            <a-form-item label="水源类型:">
+              <a-select v-model:value="where.drinkingWaterCountyAnalyse.waterSourceType" allowClear showSearch>
+                <a-select-option :value="'1'">地表水</a-select-option>
+                <a-select-option :value="'2'">地下水</a-select-option>
+              </a-select>
+            </a-form-item>
+      </a-col>
+      <a-col :lg="6" :md="12" :sm="24" :xs="24">
+        <a-form-item label="水源状态:">
+            <a-select v-model:value="where.drinkingWaterCountyAnalyse.drinkingWaterType" allowClear showSearch>
+            <a-select-option :value="'1'">在用</a-select-option>
+            <a-select-option :value="'2'">备用</a-select-option>
+            </a-select>
+        </a-form-item>
+      </a-col>
+      <a-col :lg="6" :md="12" :sm="24" :xs="24">
+        <a-form-item label="起始时间:" name="monitorStartTime" >
+          <a-month-picker
+            v-model:value="where.monitorStartTime"
+            valueFormat="YYYY-MM"
+            :locale="locale"
+            placeholder="请输入起始时间"
+            allow-clear
+          />
+        </a-form-item>
+      </a-col>
+      <a-col :lg="6" :md="12" :sm="24" :xs="24">
+        <a-form-item label="结束时间:" name="monitorEndTime">
+          <a-month-picker
+            v-model:value="where.monitorEndTime"
+            valueFormat="YYYY-MM"
+            :locale="locale"
+            placeholder="请输入结束时间"
+            allow-clear
+          />
+        </a-form-item>
+      </a-col>
+  
+    </a-row>
+    <a-row>
+      <a-col :lg="6" :md="12" :sm="24" :xs="24">
+      <a-form-item label="断面名称:">
+          <a-select v-model:value="where.drinkingWaterCountyAnalyse.sectionNames" mode="multiple" allowClear showSearch>
+            <a-select-option v-for="item in sectionInfo" :key="item.sectionName">{{ item.sectionName }}
+              </a-select-option>
+          </a-select>
+        </a-form-item>
+      </a-col>
+      <a-col :lg="6" :md="12" :sm="24" :xs="24">
+        <a-form-item label="监测指标:">
+          <div class="input-item" @click="showModal">
+            <a-checkbox
+                :checked="checkAll"
+                :indeterminate="indeterminate"
+            >
+            全选
+        </a-checkbox>
+              </div>
+        </a-form-item>
+      </a-col>
+          <a-col :lg="6" :md="12" :sm="24" :xs="24">
+        <a-form-item class="ele-text-right" :wrapper-col="{ span: 24 }">
+          <a-space>
+            <a-button type="primary" @click="searchData">查询</a-button>
+            <a-button @click="reset">重置</a-button>
+            <a-button @click="exportFile">导出Excel</a-button>
+          </a-space>
+        </a-form-item>
+      </a-col>
+    </a-row>
+
+    <a-modal v-model:visible="visible" width="760px" title="监测指标" @ok="handleOk" @cancel="handleCancel">
+        <div :style="{ borderBottom: '1px solid #E9E9E9', marginBottom: '5px', paddingBottom: '5px' }">
+            <a-checkbox
+            v-model:checked="checkAll"
+            :indeterminate="indeterminate"
+            @change="onCheckAllChange"
+            >
+            全选
+        </a-checkbox>
+        </div>
+
+        <a-checkbox-group
+          style="width: 100%"
+          @change="handleChange"
+          v-model:value="filter"
+        >
+          <a-row>
+            <a-col
+              :span="8"
+              v-for="item in filterColumns"
+              :key="item.dataIndex"
+            >
+              <a-checkbox :value="item.dataIndex">{{ item.title }}</a-checkbox>
+            </a-col>
+          </a-row>
+        </a-checkbox-group>
+
+    </a-modal>
+  </a-form>
+</template>
+
+<script>
+import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
+import { filterColumns } from "./../colums/base";
+import { listInfo } from "@/api/ecology/water/river-plcae";
+export default {
+  name: "city-search",
+  props: {
+    // 表格搜索条件
+    searchForm: {
+      typeof: Object,
+      default: function () {
+        return {};
+      },
+    },
+    filterKeys:{
+        typeof: Object,
+            default: function () {
+                return [];
+            },
+    },
+    visiable:{
+        typeof:Boolean
+    }
+  },
+  data() {
+    return {
+    indeterminate:false,
+      checkAll: true,
+      where: {
+        drinkingWaterCountyAnalyse:{}
+      },
+      filter:[],
+      columnsKey:[],
+      locale,
+      visible: false,
+      filterColumns: filterColumns,
+      newCloumns:[],
+      oldCloumns:[],
+      filterItem:[],
+      sectionInfo:[]
+    };
+  },
+  watch: {
+    searchForm(newV) {
+      this.where = newV;
+    },
+    filterKeys(newKeys){
+        this.initFilter(newKeys)
+    },
+    // 监控修改全选框图标状态
+    filter(newV){
+        if(newV.length !== this.filterColumns.length){
+            this.checkAll = false
+            this.indeterminate = false
+            if(newV.length){
+                this.indeterminate = true
+            }
+        }else{
+            this.checkAll = true
+            this.indeterminate = false
+        }
+    },
+    // 监听组件显示
+    visiable(val){
+      console.log('change',val)
+      this.emitData(val)
+    }
+  },
+
+  created(){
+      listInfo().then((res) => {
+      if (res.data.code == 0) {
+        this.visibleWater = true;
+        this.sectionInfo = res.data.data
+      } else {
+        this.$message.error(res.data.msg);
+      }
+    })
+  },
+
+  mounted() {
+    this.where = this.searchForm;
+    this.filter = filterColumns.map((item) => item.dataIndex);
+    this.columnsKey = [...this.filter]
+    // 生成复选框
+    this.newCloumns = [...filterColumns];
+    // 缓存复选框
+    this.oldCloumns = [...filterColumns];
+    // this.$emit("buildColumns", filterColumns);
+    // 根据父级传回来需要去掉勾的值映射到复选框
+    this.initFilter(this.filterKeys);
+    // 将父级回传的搜索条件上传父级进行页面搜索
+    this.emitData(true)
+
+  },
+  methods: {
+
+    emitData(val){
+      // if(val && this.where.startTime && this.where.endTime){
+        if(val){
+          this.searchData();
+      }
+    },
+
+      // 初始化选择
+      initFilter(newKeys){
+                let filterIndex =this.filterColumns.map(item=>(item.dataIndex))
+        const newList = filterIndex.filter((item) => {
+            return newKeys.indexOf(item) == -1
+        })
+        this.filter = newList;
+      },
+
+    onCheckAllChange (e) {
+        this.filter =  e.target.checked ? filterColumns.map((item) => item.dataIndex) : []
+  
+    },
+
+    handleChange(e) {
+      let newCloumns = [];
+      filterColumns.forEach((item) => {
+        const index = e.indexOf(item.dataIndex);
+        if (index > -1) {
+          newCloumns.push(item);
+        }
+      });
+      this.newCloumns = newCloumns;
+    },
+    reset() {
+      this.where = {
+        checked: 1,
+        limit: 10,
+        page: 1,
+        drinkingWaterCountyAnalyse:{
+          regionLevel: this.where.drinkingWaterCountyAnalyse.regionLevel
+        }
+      }
+      this.searchData();
+    },
+    searchData() {
+      this.where.filter = [...this.filter]
+      this.$emit("search", this.where);
+    },
+    exportFile() {
+      this.$emit("exportFile");
+    },
+    showModal() {
+      this.visible = true;
+    },
+    handleCancel(){
+        this.visible = false;
+        // 如果是取消，则还原上次勾选项
+        this.filter = this.oldCloumns.map(item=>item.dataIndex)
+    },
+    handleOk() {
+      this.visible = false;
+       this.oldCloumns = [...this.newCloumns];
+        // 选中的所有项
+        // console.log(this.columnsKey)
+
+        // 得到没有选中的项，然后在表头将没选中项去除
+        let filterKey = []
+        this.columnsKey.forEach(key=>{
+            if(this.filter.indexOf(key) == -1){
+                filterKey.push(key)
+            }
+        })
+
+      this.$emit("filterColumns", filterKey);
+
+      // this.$emit("selectKeys", this.columnsKey);
+    },
+  },
+};
+</script>
+
+<style scoped>
+.ant-calendar-picker {
+  width: 100%;
+}
+.input-item {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  font-variant: tabular-nums;
+  list-style: none;
+  font-feature-settings: "tnum";
+  position: relative;
+  display: inline-block;
+  width: 100%;
+  padding: 4px 11px;
+  color: rgba(0, 0, 0, 0.85);
+  font-size: 14px;
+  line-height: 1.5715;
+  background-color: #fff;
+  background-image: none;
+  border: 1px solid #d9d9d9;
+  border-radius: 2px;
+  transition: all 0.3s;
+  overflow: hidden;
+  cursor: pointer;
+  height: 32px;
+}
+</style>

src/views/water/drinking-water/statistic/components/countySideSeatch.vue

@@ -0,0 +1,314 @@
+<template>
+  <a-form
+    :model="where"
+    :label-col="{ md: { span: 6 }, sm: { span: 24 } }"
+    :wrapper-col="{ md: { span: 18 }, sm: { span: 24 } }"
+  >
+    <a-row>
+      <a-col :lg="6" :md="12" :sm="24" :xs="24">
+            <a-form-item label="水源类型:">
+              <a-select v-model:value="where.drinkingWaterVillageAnalyse.waterSourceType" allowClear showSearch>
+                <a-select-option :value="'1'">地表水</a-select-option>
+                <a-select-option :value="'2'">地下水</a-select-option>
+              </a-select>
+            </a-form-item>
+      </a-col>
+      <a-col :lg="6" :md="12" :sm="24" :xs="24">
+        <a-form-item label="水源状态:">
+            <a-select v-model:value="where.drinkingWaterVillageAnalyse.drinkingWaterType" allowClear showSearch>
+            <a-select-option :value="'1'">在用</a-select-option>
+            <a-select-option :value="'2'">备用</a-select-option>
+            </a-select>
+        </a-form-item>
+      </a-col>
+      <a-col :lg="6" :md="12" :sm="24" :xs="24">
+        <a-form-item label="起始时间:" name="monitorStartTime" >
+          <a-month-picker
+            v-model:value="where.monitorStartTime"
+            valueFormat="YYYY-MM"
+            :locale="locale"
+            placeholder="请输入起始时间"
+            allow-clear
+          />
+        </a-form-item>
+      </a-col>
+      <a-col :lg="6" :md="12" :sm="24" :xs="24">
+        <a-form-item label="结束时间:" name="monitorEndTime">
+          <a-month-picker
+            v-model:value="where.monitorEndTime"
+            valueFormat="YYYY-MM"
+            :locale="locale"
+            placeholder="请输入结束时间"
+            allow-clear
+          />
+        </a-form-item>
+      </a-col>
+  
+    </a-row>
+    <a-row>
+      <a-col :lg="6" :md="12" :sm="24" :xs="24">
+      <a-form-item label="断面名称:">
+          <a-select v-model:value="where.drinkingWaterVillageAnalyse.sectionNames" mode="multiple" allowClear showSearch>
+            <a-select-option v-for="item in sectionInfo" :key="item.sectionName">{{ item.sectionName }}
+              </a-select-option>
+          </a-select>
+        </a-form-item>
+      </a-col>
+      <a-col :lg="6" :md="12" :sm="24" :xs="24">
+        <a-form-item label="监测指标:">
+          <div class="input-item" @click="showModal">
+            <a-checkbox
+                :checked="checkAll"
+                :indeterminate="indeterminate"
+            >
+            全选
+        </a-checkbox>
+              </div>
+        </a-form-item>
+      </a-col>
+          <a-col :lg="6" :md="12" :sm="24" :xs="24">
+        <a-form-item class="ele-text-right" :wrapper-col="{ span: 24 }">
+          <a-space>
+            <a-button type="primary" @click="searchData">查询</a-button>
+            <a-button @click="reset">重置</a-button>
+            <a-button @click="exportFile">导出Excel</a-button>
+          </a-space>
+        </a-form-item>
+      </a-col>
+    </a-row>
+
+    <a-modal v-model:visible="visible" width="760px" title="监测指标" @ok="handleOk" @cancel="handleCancel">
+        <div :style="{ borderBottom: '1px solid #E9E9E9', marginBottom: '5px', paddingBottom: '5px' }">
+            <a-checkbox
+            v-model:checked="checkAll"
+            :indeterminate="indeterminate"
+            @change="onCheckAllChange"
+            >
+            全选
+        </a-checkbox>
+        </div>
+
+        <a-checkbox-group
+          style="width: 100%"
+          @change="handleChange"
+          v-model:value="filter"
+        >
+          <a-row>
+            <a-col
+              :span="8"
+              v-for="item in filterColumns"
+              :key="item.dataIndex"
+            >
+              <a-checkbox :value="item.dataIndex">{{ item.title }}</a-checkbox>
+            </a-col>
+          </a-row>
+        </a-checkbox-group>
+
+    </a-modal>
+  </a-form>
+</template>
+
+<script>
+import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
+import { filterColumns } from "./../colums/base";
+import { listInfo } from "@/api/ecology/water/river-plcae";
+export default {
+  name: "city-search",
+  props: {
+    // 表格搜索条件
+    searchForm: {
+      typeof: Object,
+      default: function () {
+        return {};
+      },
+    },
+    filterKeys:{
+        typeof: Object,
+            default: function () {
+                return [];
+            },
+    },
+    visiable:{
+        typeof:Boolean
+    }
+  },
+  data() {
+    return {
+    indeterminate:false,
+      checkAll: true,
+      where: {
+        drinkingWaterVillageAnalyse:{}
+      },
+      filter:[],
+      columnsKey:[],
+      locale,
+      visible: false,
+      filterColumns: filterColumns,
+      newCloumns:[],
+      oldCloumns:[],
+      filterItem:[],
+      sectionInfo:[]
+    };
+  },
+  watch: {
+    searchForm(newV) {
+      this.where = newV;
+    },
+    filterKeys(newKeys){
+        this.initFilter(newKeys)
+    },
+    // 监控修改全选框图标状态
+    filter(newV){
+        if(newV.length !== this.filterColumns.length){
+            this.checkAll = false
+            this.indeterminate = false
+            if(newV.length){
+                this.indeterminate = true
+            }
+        }else{
+            this.checkAll = true
+            this.indeterminate = false
+        }
+    },
+    // 监听组件显示
+    visiable(val){
+      console.log('change',val)
+      this.emitData(val)
+    }
+  },
+
+  created(){
+      listInfo().then((res) => {
+      if (res.data.code == 0) {
+        this.visibleWater = true;
+        this.sectionInfo = res.data.data
+      } else {
+        this.$message.error(res.data.msg);
+      }
+    })
+  },
+
+  mounted() {
+    this.where = this.searchForm;
+    this.filter = filterColumns.map((item) => item.dataIndex);
+    this.columnsKey = [...this.filter]
+    // 生成复选框
+    this.newCloumns = [...filterColumns];
+    // 缓存复选框
+    this.oldCloumns = [...filterColumns];
+    // this.$emit("buildColumns", filterColumns);
+    // 根据父级传回来需要去掉勾的值映射到复选框
+    this.initFilter(this.filterKeys);
+    // 将父级回传的搜索条件上传父级进行页面搜索
+    this.emitData(true)
+
+  },
+  methods: {
+
+    emitData(val){
+      // if(val && this.where.startTime && this.where.endTime){
+        if(val){
+          this.searchData();
+      }
+    },
+
+      // 初始化选择
+      initFilter(newKeys){
+                let filterIndex =this.filterColumns.map(item=>(item.dataIndex))
+        const newList = filterIndex.filter((item) => {
+            return newKeys.indexOf(item) == -1
+        })
+        this.filter = newList;
+      },
+
+    onCheckAllChange (e) {
+        this.filter =  e.target.checked ? filterColumns.map((item) => item.dataIndex) : []
+  
+    },
+
+    handleChange(e) {
+      let newCloumns = [];
+      filterColumns.forEach((item) => {
+        const index = e.indexOf(item.dataIndex);
+        if (index > -1) {
+          newCloumns.push(item);
+        }
+      });
+      this.newCloumns = newCloumns;
+    },
+    reset() {
+      this.where = {
+        checked: 1,
+        limit: 10,
+        page: 1,
+        drinkingWaterVillageAnalyse:{
+          regionLevel: this.where.drinkingWaterVillageAnalyse.regionLevel
+        }
+      }
+      this.searchData();
+    },
+    searchData() {
+      this.where.filter = [...this.filter]
+      this.$emit("search", this.where);
+    },
+    exportFile() {
+      this.$emit("exportFile");
+    },
+    showModal() {
+      this.visible = true;
+    },
+    handleCancel(){
+        this.visible = false;
+        // 如果是取消，则还原上次勾选项
+        this.filter = this.oldCloumns.map(item=>item.dataIndex)
+    },
+    handleOk() {
+      this.visible = false;
+       this.oldCloumns = [...this.newCloumns];
+        // 选中的所有项
+        // console.log(this.columnsKey)
+
+        // 得到没有选中的项，然后在表头将没选中项去除
+        let filterKey = []
+        this.columnsKey.forEach(key=>{
+            if(this.filter.indexOf(key) == -1){
+                filterKey.push(key)
+            }
+        })
+
+      this.$emit("filterColumns", filterKey);
+
+      // this.$emit("selectKeys", this.columnsKey);
+    },
+  },
+};
+</script>
+
+<style scoped>
+.ant-calendar-picker {
+  width: 100%;
+}
+.input-item {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  font-variant: tabular-nums;
+  list-style: none;
+  font-feature-settings: "tnum";
+  position: relative;
+  display: inline-block;
+  width: 100%;
+  padding: 4px 11px;
+  color: rgba(0, 0, 0, 0.85);
+  font-size: 14px;
+  line-height: 1.5715;
+  background-color: #fff;
+  background-image: none;
+  border: 1px solid #d9d9d9;
+  border-radius: 2px;
+  transition: all 0.3s;
+  overflow: hidden;
+  cursor: pointer;
+  height: 32px;
+}
+</style>

src/views/water/drinking-water/statistic/countryside/base.vue

@@ -0,0 +1,214 @@
+<!--农村 检测数据报送表-->
+<template>
+  <div class="ele-body">
+    <a-card :bordered="false">
+      <!-- 搜索表单 -->
+      <search
+        :searchForm="searchForm"
+        :filterKeys="filterKeys"
+        @search="searchData"
+        @exportFile="exportFile"
+        @filterColumns="changeFilter"
+        :visiable="visiable"
+        :loading="loading"
+      />
+      <!-- 表格 -->
+      <ele-pro-table
+        v-model:selection="selectionList"
+        ref="table"
+        row-key="drinkingWaterId"
+        :datasource="datasource"
+        :columns="columns"
+        :where="where"
+        :scroll="{ x: 'max-content' }"
+        @done="(d) => (data = d.data)"
+      >
+      <template #footer>
+        <div class="footer">
+          饮用水源水质监测累积月份统计样品数：{{count}}个
+        </div>
+      </template>
+
+        <template #waterCode="{ text, record }">
+          <span>
+            {{
+              record.reportTime == null
+                ? (text = "")
+                : record.reportTime.substr(5, 2) == "01" ||
+                  record.reportTime.substr(5, 2) == "02" ||
+                  record.reportTime.substr(5, 2) == "03" ||
+                  record.reportTime.substr(5, 2) == "12"
+                ? (text = "K")
+                : record.reportTime.substr(5, 2) == "04" ||
+                  record.reportTime.substr(5, 2) == "05" ||
+                  record.reportTime.substr(5, 2) == "10" ||
+                  record.reportTime.substr(5, 2) == "11"
+                ? (text = "P")
+                : record.reportTime.substr(5, 2) == "06" ||
+                  record.reportTime.substr(5, 2) == "07" ||
+                  record.reportTime.substr(5, 2) == "08" ||
+                  record.reportTime.substr(5, 2) == "09"
+                ? (text = "F")
+                : (text = "无采样时间")
+            }}
+          </span>
+        </template>
+      </ele-pro-table>
+    </a-card>
+  </div>
+  <!-- 编辑弹窗 -->
+</template>
+
+<script>
+import XLSX from "xlsx";
+import {
+  villageAnalysePageData
+} from "@/api/ecology/new-drinking-water";
+import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
+import { tableColumns } from "./../colums/base";
+import Search from "./../components/countySideSeatch.vue";
+
+export default {
+  name: "DrinkingWaterBase",
+  components: {
+    Search,
+  },
+  props: {
+    // 表格搜索条件
+    searchForm: {
+      typeof: Object,
+      default: function () {
+        return {};
+      },
+    },
+    filterKeys: {
+      typeof: Object,
+      default: function () {
+        return [];
+      },
+    },
+    visiable:{
+        typeof:Boolean
+    }
+  },
+  data() {
+    return {
+      count:0,
+      current:0,
+      data: [],
+      locale,
+      bill: {},
+      // 表格数据接口
+      datasource: [],
+      selection: [],
+      columns: [...tableColumns],
+
+      // 表格列配置
+      regionLevelOptions: [],
+      // 表格搜索条件
+      where: {
+        
+      },
+      // 表格选中数据
+      selectionList: [],
+      loading:false
+    };
+  },
+  watch: {
+    filterKeys(newKeys) {
+      this.filterColumns(newKeys);
+    },
+  },
+  mounted() {
+    // this.loadOptionData();
+  },
+  methods: {
+
+        // 获取列表数据
+        getPageData(){
+            this.loading = true;
+            villageAnalysePageData(this.where).then(res=>{
+                 this.loading = false;
+                if(res.data.code){
+                    this.$message.error(res.data.msg);
+                    this.datasource = []
+                    this.count = 0
+                }else{
+                    this.datasource = res.data.data
+                    this.count = res.data.data
+                }
+            }).catch(()=>{
+                 this.loading = false;
+            })
+        },
+
+    JumpFieldClick(record, column) {
+      console.log(column.dataIndex);
+    },
+    // 传上父级
+    changeFilter(data) {
+      this.$emit("changeFilter", data);
+    },
+    //动态修改表头
+    filterColumns(keys) {
+      if (!Array.isArray(keys)) {
+        return;
+      }
+
+      let newCloumns = [...tableColumns];
+
+      let filterIndex = [];
+      newCloumns.forEach((item, index) => {
+        if (keys.indexOf(item.dataIndex) > -1) {
+          filterIndex.push(index);
+        }
+      });
+
+      const newList = newCloumns.filter((item, index) => {
+        return filterIndex.indexOf(index) == -1;
+      });
+      this.columns = newList;
+    },
+
+    // 执行搜索
+    searchData(data) {
+      this.where = data;
+      this.$emit("search", this.where);
+      this.reload();
+    },
+    /* 刷新表格 */
+    reload() {
+      this.getPageData()
+      // this.$refs.table.reload({
+      //   where: this.where,
+      // });
+    },
+    /* 重置搜索 */
+    reset() {
+      this.where = {
+        checked: 1,
+      };
+      this.reload();
+    },
+
+    exportFile() {
+      const columns = [...tableColumns];
+      const arr = [];
+      const th = columns.map((item) => item.title);
+      arr.push(th);
+      this.data.forEach((d) => {
+        const td = columns.map((item) => d[item.dataIndex]);
+        arr.push(td);
+      });
+      let sheet = XLSX.utils.aoa_to_sheet(arr);
+      this.$util.exportSheet(XLSX, sheet, new Date().getTime().toString());
+    },
+  },
+};
+</script>
+
+<style scoped lang="less">
+.footer{
+  text-align: right;
+}
+</style>

src/views/water/drinking-water/statistic/countryside/index.vue

@@ -0,0 +1,99 @@
+<template>
+    <div>
+        <a-tabs v-model:activeKey="activeKey">
+            <a-tab-pane tab="监测数据报送表" key="base" >
+              <base-statistic :searchForm="searchForm" :filterKeys="filterKeys" @search="changeSearch" @changeFilter="changeFilter" :visiable="activeKey=='base'"></base-statistic>
+            </a-tab-pane>
+            <!-- <a-tab-pane tab="报送情况说明表" key="base1">
+              <county-appraise  :searchForm="searchForm" :filterKeys="filterKeys" @search="changeSearch" @changeFilter="changeFilter" :visiable="activeKey=='base1'"></county-appraise>
+            </a-tab-pane>
+             <a-tab-pane tab="取水量统计" key="base3">
+              <county-water-withdrawal  :searchForm="searchForm" :filterKeys="filterKeys" @search="changeSearch" @changeFilter="changeFilter" :visiable="activeKey=='base3'"></county-water-withdrawal>
+            </a-tab-pane>
+            <a-tab-pane tab="超标评价" key="base4">
+              <county-over-standard  :searchForm="searchForm" :filterKeys="filterKeys" @search="changeSearch" @changeFilter="changeFilter" :visiable="activeKey=='base4'"></county-over-standard>
+            </a-tab-pane> -->
+            <!--<a-tab-pane tab="水质类别" key="base2" >
+              <city-water-quality :searchForm="searchForm" :filterKeys="filterKeys" @search="changeSearch" @changeFilter="changeFilter" :visiable="activeKey=='base2'"></city-water-quality>
+            </a-tab-pane>
+
+            <a-tab-pane tab="水质统计" key="base7" >
+              <water-quality-count :searchForm="searchForm" :filterKeys="filterKeys" @search="changeSearch" @changeFilter="changeFilter" :visiable="activeKey=='base7'"></water-quality-count>
+            </a-tab-pane>
+            <a-tab-pane tab="水质达标情况" key="base8" >
+              <water-quality-up :searchForm="searchForm" :filterKeys="filterKeys" @search="changeSearch" @changeFilter="changeFilter" :visiable="activeKey=='base8'"></water-quality-up>
+            </a-tab-pane>
+            <a-tab-pane tab="备用水源营养指数" key="base5">
+              <water-nutritional :searchForm="searchForm" :filterKeys="filterKeys" @search="changeSearch" @changeFilter="changeFilter" :visiable="activeKey=='base5'"></water-nutritional>
+            </a-tab-pane> -->
+          </a-tabs>
+    </div>
+</template>
+
+
+<script>
+  /**
+   *
+   *
+   *
+   */
+  //市级监测数据报表
+  import BaseStatistic from "./base.vue"
+  // 报送情况说明
+  // import countyAppraise from "./situation.vue"
+  // // 取水量
+  // import countyWaterWithdrawal from "./waterCount.vue"
+  // // 超标评价
+  // import countyOverStandard from './overStandard.vue'
+//   // 水质类别
+//   import cityWaterQuality from "./waterQuality.vue"
+//   // 水质统计
+//   import waterQualityCount from "./waterQualityCount.vue";
+//   // 水质达标情况
+//   import waterQualityUp from "./waterQualityUp.vue";
+//   //综合营养指数
+
+//   import waterNutritional from "./waterNutritional.vue"
+
+
+
+
+
+  export default {
+    name: 'city-com',
+    components: {
+      BaseStatistic,
+      // countyAppraise,
+    //   cityWaterQuality,
+    //   waterQualityCount,
+    //   waterQualityUp,
+    //   waterNutritional,
+      // countyWaterWithdrawal,
+      // countyOverStandard
+    },
+    data() {
+      return {
+        activeKey:'base',
+        searchForm:{
+            checked: 1,
+            page:1,
+            limit:10,
+            drinkingWaterVillageAnalyse:{
+                regionLevel:"农村"
+            },
+        },
+        filterKeys:[]
+      };
+
+    },
+    methods: {
+      changeSearch(data){
+          this.searchForm = data
+      },
+      changeFilter(data){
+          this.filterKeys = data
+      }
+    }
+
+  }
+</script>

src/views/water/drinking-water/statistic/county/base.vue

@@ -25,7 +25,7 @@
       >
       <template #footer>
         <div class="footer">
-          饮用水源水质监测累积月份统计样品数：10个
+          饮用水源水质监测累积月份统计样品数：{{count}}个
         </div>
       </template>
 
@@ -66,7 +66,7 @@ import {
 } from "@/api/ecology/new-drinking-water";
 import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
 import { tableColumns } from "./../colums/base";
-import Search from "./../components/search.vue";
+import Search from "./../components/countySearch.vue";
 
 export default {
   name: "DrinkingWaterBase",
@@ -93,6 +93,7 @@ export default {
   },
   data() {
     return {
+      count:0, //样品数
       current:0,
       data: [],
       locale,
@@ -131,8 +132,10 @@ export default {
                 if(res.data.code){
                     this.$message.error(res.data.msg);
                     this.datasource = []
+                    this.count = 0
                 }else{
                     this.datasource = res.data.data
+                    this.count = res.data.count
                 }
             }).catch(()=>{
                  this.loading = false;

src/views/water/drinking-water/statistic/county/index.vue

@@ -4,16 +4,16 @@
             <a-tab-pane tab="监测数据报送表" key="base" >
               <base-statistic :searchForm="searchForm" :filterKeys="filterKeys" @search="changeSearch" @changeFilter="changeFilter" :visiable="activeKey=='base'"></base-statistic>
             </a-tab-pane>
-            <!-- <a-tab-pane tab="报送情况说明表" key="base1">
+            <a-tab-pane tab="报送情况说明表" key="base1">
-              <city-appraise  :searchForm="searchForm" :filterKeys="filterKeys" @search="changeSearch" @changeFilter="changeFilter" :visiable="activeKey=='base1'"></city-appraise>
+              <county-appraise  :searchForm="searchForm" :filterKeys="filterKeys" @search="changeSearch" @changeFilter="changeFilter" :visiable="activeKey=='base1'"></county-appraise>
             </a-tab-pane>
              <a-tab-pane tab="取水量统计" key="base3">
-              <city-water-withdrawal  :searchForm="searchForm" :filterKeys="filterKeys" @search="changeSearch" @changeFilter="changeFilter" :visiable="activeKey=='base3'"></city-water-withdrawal>
+              <county-water-withdrawal  :searchForm="searchForm" :filterKeys="filterKeys" @search="changeSearch" @changeFilter="changeFilter" :visiable="activeKey=='base3'"></county-water-withdrawal>
             </a-tab-pane>
             <a-tab-pane tab="超标评价" key="base4">
-              <city-over-standard  :searchForm="searchForm" :filterKeys="filterKeys" @search="changeSearch" @changeFilter="changeFilter" :visiable="activeKey=='base4'"></city-over-standard>
+              <county-over-standard  :searchForm="searchForm" :filterKeys="filterKeys" @search="changeSearch" @changeFilter="changeFilter" :visiable="activeKey=='base4'"></county-over-standard>
             </a-tab-pane>
-            <a-tab-pane tab="水质类别" key="base2" >
+            <!--<a-tab-pane tab="水质类别" key="base2" >
               <city-water-quality :searchForm="searchForm" :filterKeys="filterKeys" @search="changeSearch" @changeFilter="changeFilter" :visiable="activeKey=='base2'"></city-water-quality>
             </a-tab-pane>
 
@@ -40,11 +40,11 @@
   //市级监测数据报表
   import BaseStatistic from "./base.vue"
   // 报送情况说明
-//   import cityAppraise from "./situation.vue"
+  import countyAppraise from "./situation.vue"
-//   // 取水量
+  // 取水量
-//   import cityWaterWithdrawal from "./waterCount.vue"
+  import countyWaterWithdrawal from "./waterCount.vue"
-//   // 超标评价
+  // 超标评价
-//   import cityOverStandard from './overStandard.vue'
+  import countyOverStandard from './overStandard.vue'
 //   // 水质类别
 //   import cityWaterQuality from "./waterQuality.vue"
 //   // 水质统计
@@ -63,13 +63,13 @@
     name: 'city-com',
     components: {
       BaseStatistic,
-    //   cityAppraise,
+      countyAppraise,
     //   cityWaterQuality,
     //   waterQualityCount,
     //   waterQualityUp,
     //   waterNutritional,
-    //   cityWaterWithdrawal,
+      countyWaterWithdrawal,
-    //   cityOverStandard
+      countyOverStandard
     },
     data() {
       return {
@@ -78,7 +78,7 @@
             checked: 1,
             page:1,
             limit:10,
-            drinkingWaterAnalyse:{
+            drinkingWaterCountyAnalyse:{
                 regionLevel:"县级"
             },
         },

src/views/water/drinking-water/statistic/county/overStandard.vue

@@ -0,0 +1,157 @@
+<!--超标评价-->
+<template>
+  <div class="ele-body">
+    <a-card :bordered="false">
+      <!-- 搜索表单 -->
+        <search
+        :searchForm="searchForm"
+        :filterKeys="filterKeys"
+        @search="searchData"
+        @exportFile="exportFile"
+        @filterColumns="changeFilter"
+      />
+      <!-- 表格 -->
+      <ele-pro-table
+        v-model:selection="selectionList"
+        ref="table"
+        row-key="drinkingWaterId"
+        :datasource="datasource"
+        :loading="loading"
+        :columns="columns"
+        :where="where"
+        :scroll="{ x: 'max-content' }"
+        @done="(d) => (data = d.data)"
+      >
+       
+      </ele-pro-table>
+    </a-card>
+  </div>
+  <!-- 编辑弹窗 -->
+</template>
+
+<script>
+// import _ from "lodash";
+import XLSX from "xlsx";
+import Search from "./../components/citySearch.vue";
+import {
+  countyOverStandardCount
+} from "@/api/ecology/new-drinking-water";
+import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
+// import { tableColumns } from "./colums";
+
+export default {
+  name: "DrinkingWaterBase",
+  components: {
+      Search
+  },
+    props:{
+        // 表格搜索条件
+        searchForm:{
+            typeof:Object,
+            default: function () {
+                return {}
+            },
+        },
+        filterKeys:{
+            typeof:Object,
+            default: function () {
+                return []
+            },
+        }
+    },
+  data() {
+    return {
+      data: [],
+      locale,
+      bill: {},
+      // 表格数据接口
+      datasource:[],
+      selection: [],
+      columns: [
+       {title: "城市名称",dataIndex: "sourceWaterName",sorter: true,},
+       {title: "水源地名称",dataIndex: "waterWithdrawal",sorter: true,},
+       {title: "取水量（万m3）",dataIndex: "waterWithdrawal",sorter: true,},
+       {title: "超标水源取水量",dataIndex: "waterWithdrawal",sorter: true,},
+       {title: "超标项目",dataIndex: "waterWithdrawal",sorter: true,},
+       {title: "水源性质",dataIndex: "waterWithdrawal",sorter: true,},
+      ],
+
+      // 表格列配置
+      regionLevelOptions: [],
+      // 表格搜索条件
+      where: {
+        checked: 1,
+      },
+      // 表格选中数据
+      selectionList: [],
+      loading:false
+    };
+  },
+  mounted() {
+    // this.loadOptionData();
+  },
+  methods: {
+
+    // 获取列表数据
+    getPageData(){
+          this.loading = true;
+        countyOverStandardCount(this.where).then(res=>{
+              this.loading = false;
+            if(res.data.code){
+                this.$message.error(res.data.msg);
+                this.datasource = []
+            }else{
+                this.datasource = res.data.data
+            }
+        }).catch(()=>{
+              this.loading = false;
+        })
+    },
+
+    JumpFieldClick(record, column) {
+      console.log(column.dataIndex);
+    },
+
+        // 传上父级
+    changeFilter(data){
+        this.$emit('changeFilter',data)
+    },
+    // 执行搜索
+    searchData(data){
+        this.where = data;
+        this.$emit("search", this.where);
+        this.reload();
+    },
+
+    /* 刷新表格 */
+    reload() {
+      this.getPageData()
+      // this.$refs.table.reload({
+      //   where: this.where,
+      // });
+    },
+    /* 重置搜索 */
+    reset() {
+      this.where = {
+        checked: 1,
+      };
+      this.reload();
+    },
+    exportFile() {
+      const columns = [...this.columns];
+      const arr = [];
+      const th = columns.map((item) => item.title);
+      arr.push(th);
+      this.data.forEach((d) => {
+        const td = columns.map((item) => d[item.dataIndex]);
+        arr.push(td);
+      });
+      let sheet = XLSX.utils.aoa_to_sheet(arr);
+      this.$util.exportSheet(XLSX, sheet, new Date().getTime().toString());
+    },
+  },
+};
+</script>
+
+<style scoped lang="less">
+</style>

src/views/water/drinking-water/statistic/county/situation.vue

@@ -0,0 +1,298 @@
+<!--情况说明-->
+<template>
+  <div class="ele-body">
+    <a-card :bordered="false">
+        <!-- 搜索表单 -->
+      <search
+        :searchForm="searchForm"
+        :filterKeys="filterKeys"
+        @search="searchData"
+        @exportFile="exportFile"
+        @filterColumns="changeFilter"
+        :visiable="visiable"
+        :loading="loading"
+      />
+      
+      <ele-pro-table ref="table" row-key="drinkingWaterId" :datasource="datasource" :columns="columns" :where="where"
+        :scroll="{ x: 'max-content' }" @done="(d) => (data = d.data)">
+          <template #county="{text}">
+            {{text="市区"}}
+          </template>
+
+        <template #enumber="{ text, record ,index }">
+            <div class="editable-cell">
+                <div v-if="editableData[index] && editableData[index].edable=='index3'" class="editable-cell-input-wrapper">
+                  <a-input class="edit-input" v-model:value="editableData[index]['index3']" @pressEnter="save(index)" />
+                  <check-outlined class="editable-cell-icon-check" @click="save(index)" />
+                </div>
+                <div v-else class="editable-cell-text-wrapper">
+                    {{ text || ' ' }}
+                    <edit-outlined class="editable-cell-icon" @click="edit(record,index,'index3')" />
+                </div>
+            </div>
+        </template>
+
+        <template #wnumber="{ text, record ,index }">
+            <div class="editable-cell">
+                <div v-if="editableData[index] && editableData[index].edable=='index4'" class="editable-cell-input-wrapper">
+                  <a-input class="edit-input" v-model:value="editableData[index]['index4']" @pressEnter="save(index)" />
+                  <check-outlined class="editable-cell-icon-check" @click="save(index)" />
+                </div>
+                <div v-else class="editable-cell-text-wrapper">
+                {{ text || ' ' }}
+                <edit-outlined class="editable-cell-icon" @click="edit(record,index,'index4')" />
+                </div>
+            </div>
+        </template>
+
+        <template #desc="{ text, record ,index }">
+            <div class="editable-cell">
+                <div v-if="editableData[index] && editableData[index].edable=='index6'" class="editable-cell-input-wrapper">
+                  <a-input class="edit-input" v-model:value="editableData[index]['index6']" @pressEnter="save(index)" />
+                  <check-outlined class="editable-cell-icon-check" @click="save(index)" />
+                </div>
+                <div v-else class="editable-cell-text-wrapper">
+                {{ text || ' ' }}
+                <edit-outlined class="editable-cell-icon" @click="edit(record,index,'index6')" />
+                </div>
+            </div>
+        </template>
+
+        <template #remark="{ text, record ,index }">
+            <div class="editable-cell">
+                <div v-if="editableData[index] && editableData[index].edable=='remark'" class="editable-cell-input-wrapper">
+                  <a-textarea class="edit-input" v-model:value="editableData[index]['remark']" @pressEnter="save(index)" />
+                  <check-outlined class="editable-cell-icon-check" @click="save(index)" />
+                </div>
+                <div v-else class="editable-cell-text-wrapper">
+                {{ text || ' ' }}
+                <edit-outlined class="editable-cell-icon" @click="edit(record,index,'remark')" />
+                </div>
+            </div>
+        </template>
+
+
+      </ele-pro-table>
+
+    </a-card>
+  </div>
+  <!-- 编辑弹窗 -->
+</template>
+
+<script>
+import XLSX from "xlsx";
+import {
+  countyDescripFormData
+} from "@/api/ecology/new-drinking-water";
+
+import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
+// import { tableColumns } from "./colums";
+// import moment from "moment";
+
+import Search from "./../components/countySearch.vue";
+import { CheckOutlined, EditOutlined } from '@ant-design/icons-vue';
+export default {
+  name: "DrinkingWaterBase",
+  components: {
+      Search,
+      CheckOutlined,
+      EditOutlined,
+  },
+    props:{
+        // 表格搜索条件
+        searchForm:{
+            typeof:Object,
+            default: function () {
+                return {}
+            },
+        },
+        filterKeys:{
+            typeof:Object,
+            default: function () {
+                return []
+            },
+        },
+      visiable:{
+          typeof:Boolean
+      }
+    },
+  
+  data() {
+    return {
+      data: [],
+      locale,
+      bill: {},
+      editableData:[],
+      // 表格数据接口
+      datasource:{},
+      selection: [],
+      columns:[
+        {key: "index",title:"序号",dataIndex: "index",width: 48,align: "center",customRender: ({ index }) => index + 1,},
+        {title:"城市",dataIndex:"city",},
+        {title:"县城",dataIndex:"county",slots:{customRender:'county'}},
+        {title:"水源地名称",dataIndex:"sourceWaterName",},
+        {title:"类型",dataIndex:"waterSourceProperty",},
+        {title:"监测时间",dataIndex:"reportTime"},
+        //  {title:"监测时间",dataIndex:"reportTime",customRender: ({text}) => moment(text, "YYYY/MM/DD HH:mm:ss").format("YYYY/MM/DD")},
+        {title:"应当监测项目个数",dataIndex:'index1'},
+        {title:"未测个数",dataIndex:"index2",},
+        {title:"独立分析项目个数",dataIndex:"index3",
+         slots: {
+          customRender: 'enumber',
+            },
+        },
+        {title:"外送分析项目个数",dataIndex:"index4",  slots: {
+          customRender: 'wnumber',
+            },},
+        {title:"超标项目",dataIndex:"index5",},
+        {title:"情况说明或原因",dataIndex:"index6", slots: {
+          customRender: 'desc',
+            }},
+        {title:"备注",dataIndex:"remark",slots: {
+          customRender: 'remark',
+            },},
+      ],
+        
+        
+      // 表格搜索条件
+      where: {
+        checked: 1,
+        page:1,
+        limit:10
+      },
+      // 表格选中数据
+      selectionList: [],
+      loading:false
+    };
+  },
+  mounted() {
+  },
+  methods: {
+
+    // 获取列表数据
+    getPageData(){
+            this.loading = true;
+        countyDescripFormData(this.where).then(res=>{
+                this.loading = false;
+            if(res.data.code){
+                this.$message.error(res.data.msg);
+                this.datasource = []
+            }else{
+                this.datasource = res.data.data
+            }
+        }).catch(()=>{
+                this.loading = false;
+        })
+    },
+
+      //编辑单元格
+    edit(item,index,key){
+        this.editableData[index] = item
+        this.editableData[index].edable=key
+    },
+
+    save(index){
+//         console.log('item',this.editableData[index]['index3'])
+// // console.log('item.remark', item.remark)
+        this.datasource[index] = {...this.editableData[index]}
+        this.editableData = []
+
+    },
+
+    JumpFieldClick(record, column) {
+        console.log(column.dataIndex)
+      },
+    // 传上父级
+    changeFilter(data){
+        this.$emit('changeFilter',data)
+    },
+    // 执行搜索
+    searchData(data){
+        this.where = data;
+        this.$emit("search", this.where);
+        this.reload();
+    },
+    /* 刷新表格 */
+    reload() {
+      this.getPageData()
+      
+        this.columns[6].filters = []
+        if(this.where.drinkingWaterCountyAnalyse.waterSourceType ==1 ){
+          // 地表水
+          this.columns[6].filters =  [
+            {
+                text: '61',
+                value: '61',
+            },
+                {
+                text: '63',
+                value: '63',
+            },
+                {
+                text: '64',
+                value: '64',
+            },
+        ]
+      }
+      if(this.where.drinkingWaterCountyAnalyse.waterSourceType ==2 ){
+          // 地下水
+           this.columns[6].filters =  [
+            {
+                text: '39',
+                value: '39',
+            },
+                {
+                text: '94',
+                value: '94',
+            }
+        ]
+      }
+
+      // this.$refs.table.reload({
+      //   where: this.where,
+      // });
+    },
+
+
+
+    /* 重置搜索 */
+    reset() {
+      this.where = {
+        checked: 1,
+      };
+      this.reload();
+    },
+    exportFile() {
+      const columns = [
+         ...this.columns,
+      ];
+      const arr = [];
+      const th = columns.map((item) => item.title);
+      arr.push(th);
+      this.datasource.forEach((d) => {
+        const td = columns.map((item) => d[item.dataIndex]);
+        arr.push(td);
+      });
+      let sheet = XLSX.utils.aoa_to_sheet(arr);
+      this.$util.exportSheet(XLSX, sheet, new Date().getTime().toString());
+    },
+  },
+};
+</script>
+
+<style scoped lang="less">
+.editable-cell-input-wrapper{
+    display: flex;
+    align-items: center;
+
+    .edit-input{
+        margin-right: 5px;
+        width: 200px;
+    }
+}
+.editable-cell-text-wrapper{
+    display: flex;
+    align-items: center;
+
+}
+</style>

src/views/water/drinking-water/statistic/county/waterCount.vue

@@ -0,0 +1,159 @@
+<!--取水量统计-->
+<template>
+  <div class="ele-body">
+    <a-card :bordered="false">
+      <!-- 搜索表单 -->
+        <search
+        :searchForm="searchForm"
+        :filterKeys="filterKeys"
+        @search="searchData"
+        @exportFile="exportFile"
+        @filterColumns="changeFilter"
+      />
+      <!-- 表格 -->
+      <ele-pro-table
+        v-model:selection="selectionList"
+        ref="table"
+        row-key="drinkingWaterId"
+        :datasource="datasource"
+        :loading="loading"
+        :columns="columns"
+        :where="where"
+        :scroll="{ x: 'max-content' }"
+        @done="(d) => (data = d.data)"
+      >
+       
+      </ele-pro-table>
+    </a-card>
+  </div>
+  <!-- 编辑弹窗 -->
+</template>
+
+<script>
+// import _ from "lodash";
+import XLSX from "xlsx";
+import Search from "./../components/countySearch.vue";
+
+import {
+  getWaterCount
+} from "@/api/ecology/new-drinking-water";
+
+
+import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
+// import { tableColumns } from "./colums";
+
+export default {
+  name: "DrinkingWaterBase",
+  components: {
+      Search
+  },
+    props:{
+        // 表格搜索条件
+        searchForm:{
+            typeof:Object,
+            default: function () {
+                return {}
+            },
+        },
+        filterKeys:{
+            typeof:Object,
+            default: function () {
+                return []
+            },
+        }
+    },
+  data() {
+    return {
+      data: [],
+      locale,
+      bill: {},
+      // 表格数据接口
+      selection: [],
+      columns: [
+       {title: "水源名称",dataIndex: "sourceWaterName",sorter: true,},
+       {title: "取水量",dataIndex: "waterWithdrawal",sorter: true,},
+      ],
+
+      // 表格列配置
+
+      // palceOptions: [],
+      // areaOptions: [],
+      // roadOptions: [],
+      regionLevelOptions: [],
+      // 表格搜索条件
+      where: {
+        checked: 1,
+      },
+      // 表格选中数据
+      selectionList: [],
+      loading: false
+    };
+  },
+  mounted() {
+    // this.loadOptionData();
+  },
+  methods: {
+
+                    // 获取列表数据
+    getPageData(){
+          this.loading = true;
+        getWaterCount(this.where).then(res=>{
+              this.loading = false;
+            if(res.data.code){
+                this.$message.error(res.data.msg);
+                this.datasource = []
+            }else{
+                this.datasource = res.data.data
+            }
+        }).catch(()=>{
+              this.loading = false;
+        })
+    },
+    
+    JumpFieldClick(record, column) {
+      console.log(column.dataIndex);
+    },
+
+        // 传上父级
+    changeFilter(data){
+        this.$emit('changeFilter',data)
+    },
+    // 执行搜索
+    searchData(data){
+        this.where = data;
+        this.$emit("search", this.where);
+        this.reload();
+    },
+
+    /* 刷新表格 */
+    reload() {
+      this.getPageData()
+      // this.$refs.table.reload({
+      //   where: this.where,
+      // });
+    },
+    /* 重置搜索 */
+    reset() {
+      this.where = {
+        checked: 1,
+      };
+      this.reload();
+    },
+    exportFile() {
+      const columns = [...this.columns];
+      const arr = [];
+      const th = columns.map((item) => item.title);
+      arr.push(th);
+      this.data.forEach((d) => {
+        const td = columns.map((item) => d[item.dataIndex]);
+        arr.push(td);
+      });
+      let sheet = XLSX.utils.aoa_to_sheet(arr);
+      this.$util.exportSheet(XLSX, sheet, new Date().getTime().toString());
+    },
+  },
+};
+</script>
+
+<style scoped lang="less">
+</style>

src/views/water/drinking-water/statistic/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="ele-body">
     <a-card :bordered="false">
-      <a-tabs v-model:activeKey="activeKey">
+      <a-tabs v-model:activeKey="activeWrapKey">
         <a-tab-pane key="city" tab="市级">
           <City />
         </a-tab-pane>
@@ -31,7 +31,8 @@
         </a-tab-pane>
 
         <a-tab-pane key="village" tab="农村">
-         <a-tabs v-model:active="activeVillage">
+          <Countryside />
+         <!-- <a-tabs v-model:active="activeVillage">
             <a-tab-pane tab="数据总览" key="village">
               <village></village>
             </a-tab-pane>
@@ -47,7 +48,7 @@
              <a-tab-pane tab="综合指数" key="base5">
               <village-avg-index></village-avg-index>
             </a-tab-pane>
-          </a-tabs>
+          </a-tabs> -->
         </a-tab-pane>
       </a-tabs>
     </a-card>
@@ -58,7 +59,7 @@
 
 import City from './city/index.vue'
 import County from './county/index.vue'
-
+import Countryside from './countryside/index.vue'
   /**
    *
    *
@@ -69,16 +70,16 @@ import County from './county/index.vue'
   // import countyData from "./countyData.vue"
   // import countyData from "./county/base.vue"
 
-  import village from "./villageData.vue"
+  // import village from "./villageData.vue"
 
   // import countyAppraise from "./countyAppraise.vue"
-  import villageAppraise from "./villageAppraise.vue"
+  // import villageAppraise from "./villageAppraise.vue"
   // import countyWaterQuality from "./countyWaterQuality.vue"
-  import villageWaterQuality from "./villageWaterQuality.vue"
+  // import villageWaterQuality from "./villageWaterQuality.vue"
   // import countyAvgIndex from "./county-avg-index.vue"
-  import villageAvgIndex from "./village-avg-index.vue"
+  // import villageAvgIndex from "./village-avg-index.vue"
   // import countyMonthStandard from "./county-base-standard.vue"
-  import villageMonthStandard from "./village-base-standard.vue"
+  // import villageMonthStandard from "./village-base-standard.vue"
   // import countyWaterWithdrawal from "./countyWaterWithdrawal.vue"
 
 
@@ -87,37 +88,27 @@ import County from './county/index.vue'
     components: {
       City,
       County,
+      Countryside,
       // countyData,
-      village,
+      // village,
       // countyAppraise,
-      villageAppraise,
+      // villageAppraise,
       // countyWaterQuality,
-      villageWaterQuality,
+      // villageWaterQuality,
       // countyAvgIndex,
-      villageAvgIndex,
+      // villageAvgIndex,
       // countyMonthStandard,
-      villageMonthStandard,
+      // villageMonthStandard,
       // countyWaterWithdrawal,
       
     },
     data() {
       return {
-        activeKey: 'city',
+        activeWrapKey: 'city',
-        activeCity:'city',
-        activeCounty:'county',
-        activeVillage:'village', 
-        searchForm:{},
-        filterKeys:[]
       };
 
     },
     methods: {
-      changeSearch(data){
-          this.searchForm = data
-      },
-      changeFilter(data){
-          this.filterKeys = data
-      }
     }
 
   }