Merge remote-tracking branch 'origin/master'

src/api/ecology/river-statis.js

@@ -0,0 +1,46 @@
+import axios from 'axios';
+// -------------------江河--水功能数据统计列表-----------------------
+const autonomyWaterFunctionTotalUrl = '/waterFunctionArea/riverStatic/autoPage';
+const nationalWaterFunctionTotalUrl = '/waterFunctionArea/riverStatic/nationalPage';
+//国家级水功能统计
+const nationalWaterFunctionTotal = function (data) {
+    return axios.get("/waterFunctionArea/riverStatic/nationalPage",data)
+}
+// /自治区水功能统计
+const autonomyWaterFunctionTotal = function (data) {
+    return axios.get("/waterFunctionArea/riverStatic/autoPage",data)
+}
+
+
+// -------------------江河--水站数据统计列表--------------
+//水站同比环比统计
+const listWaterSiteYoy = function (data) {
+    return axios.post("/waterFunctionArea/riverStatic/waterSiteYoy",data)
+}
+// 水站日均值统计
+const listWaterSiteMonthTotal = function (data) {
+    return axios.post("/waterFunctionArea/riverStatic/waterSiteMonthTotal",data)
+}
+
+//水质达标统计
+const listMonthWaterQualitySandard = function (data) {
+    return axios.post("/waterFunctionArea/riverStatic/monthWaterQualitySandard",data)
+}
+
+//水质综合指数统计
+const listMonthCompositeIndex = function (data) {
+    return axios.post("/waterFunctionArea/riverStatic/monthCompositeIndex",data)
+}
+
+
+export {
+    autonomyWaterFunctionTotalUrl,
+    nationalWaterFunctionTotalUrl,
+    nationalWaterFunctionTotal,
+    autonomyWaterFunctionTotal,
+    listWaterSiteYoy,
+    listWaterSiteMonthTotal,
+    listMonthWaterQualitySandard,
+    listMonthCompositeIndex
+
+}

src/api/ecology/water/river-water.js

@@ -29,7 +29,7 @@ const getColumnOptions = function(column){
     return axios.get("/waterFunctionArea/WaterStationPoint/options",{params:{column}})
 }
 const listInfo = function(){
-    return axios.post("/waterFunctionArea/autonomousWaterFunctionAreaPoint/listInfo",{})
+    return axios.post("/waterFunctionArea/WaterStationPoint/listInfo",{})
 }
 export {
     listInfo,

src/views/water/river-station/statistic/site-day-avg.vue

@@ -35,9 +35,11 @@
         </a-row>
       </a-form>
       <!-- 表格 -->
+      <a-spin :spinning="loading">
       <ele-pro-table ref="table" :datasource="datasource" :columns="columns" :where="where"
         :scroll="{ x: 'max-content' }" @done="(d) => (data = d.data)">
       </ele-pro-table>
+    </a-spin>
     </a-card>
   </div>
   <!-- 编辑弹窗 -->
@@ -147,9 +149,7 @@
     methods: {
       /* 刷新表格 */
       reload() {
-        // this.$refs.table.reload({
-        //   where: this.where,
-        // });
+       this.loading = true;
         listWaterSiteMonthTotal(this.where).then((res) => {
           if (res.data.code == 0) {
             this.$message.success(res.data.msg);
@@ -157,6 +157,7 @@
           } else {
             this.$message.error(res.data.msg);
           }
+          this.loading = false;
         });
       },
       /* 重置搜索 */

src/views/water/river-station/statistic/site.vue

@@ -43,6 +43,7 @@
         </a-row>
       </a-form>
       <!-- 表格 -->
+      <a-spin :spinning="loading">
       <ele-pro-table ref="table" :datasource="momData" :columns="columnsMom" :where="where"
         :scroll="{ x: 'max-content' }" @done="(d) => (data = d.data)">
       </ele-pro-table>
@@ -50,6 +51,7 @@
       <ele-pro-table ref="table" :datasource="yoyData" :columns="columnsYoy" :where="where"
         :scroll="{ x: 'max-content' }" @done="(d) => (data = d.data)">
       </ele-pro-table>
+    </a-spin>
     </a-card>
   </div>
   <!-- 编辑弹窗 -->
@@ -186,6 +188,7 @@
     methods: {
       /* 刷新表格 */
       reload() {
+        this.loading = true;
         listWaterSiteYoy(this.where).then((res) => {
           console.log(res.data.data);
           if (res.data.code == 0) {
@@ -199,6 +202,7 @@
             } else {
               this.$message.error(res.data.msg);
             }
+            this.loading = false;
         });
       },
       /* 重置搜索 */

src/views/water/river/statistic/avg-index.vue

@@ -0,0 +1,162 @@
+<!-- 江河水查看数据页面-->
+<template>
+  <div class="ele-body">
+    <a-card :bordered="false">
+      <!-- 搜索表单 -->
+      <a-form :model="where" :label-col="{ md: { span: 8 }, sm: { span: 24 } }"
+        :wrapper-col="{ md: { span: 16 }, sm: { span: 24 } }">
+        <a-row>
+          <a-form-item label="断面名称">
+            <a-select v-model:value="where.sectionName" allowClear showSearch>
+              <a-select-option v-for="item in sectionInfo" :key="item.sectionName">{{ item.sectionName }}
+              </a-select-option>
+            </a-select>
+          </a-form-item>
+          <a-form-item label="开始时间:">
+            <a-month-picker v-model:value="where.startTime" :disabled-date="disabledDate" />
+          </a-form-item>
+          <a-form-item label="结束时间:">
+            <a-month-picker v-model:value="where.endTime" :disabled-date="disabledDate" />
+          </a-form-item>
+          <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="reload">查询</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-form>
+      <!-- 表格 -->
+      <a-spin :spinning="loading">
+      <ele-pro-table ref="table" :datasource="momData" :columns="columns" :where="where" :scroll="{ x: 'max-content' }"
+        @done="(d) => (data = d.data)">
+      </ele-pro-table>
+    </a-spin>
+    </a-card>
+  </div>
+  <!-- 编辑弹窗 -->
+</template>
+
+<script>
+  import {
+    listMonthCompositeIndex
+  } from "@/api/ecology/river-statis";
+  import {
+    listInfo
+  } from "@/api/ecology/water/river-plcae";
+  import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
+  import XLSX from "xlsx";
+  export default {
+    name: "RiverCollectWater",
+    components: {},
+    data() {
+      return {
+        data: [],
+        momData: [],
+        datasource: {},
+        columns: [{
+            title: '断面名称',
+            dataIndex: 'sectionName',
+            key: 'sectionName',
+          },
+          {
+            title: '水质综合指数排名',
+            dataIndex: 'orderBy',
+            key: 'orderBy',
+          },
+          {
+            title: "水质综合指数",
+            children: [{
+                title: "本月综合指数",
+                dataIndex: "baseIndex"
+              },
+              {
+                title: "上月综合指数",
+                dataIndex: "momIndex"
+              },
+              {
+                title: "上年同期指数",
+                dataIndex: "yoyIndex"
+              },
+            ]
+          },
+          {
+            title: "水质综合指数变化率",
+            children: [{
+                title: "上月",
+                dataIndex: "momRateChange"
+              },
+              {
+                title: "上年同期",
+                dataIndex: "yoyRateChange"
+              },
+            ]
+          },
+        ],
+        locale,
+        bill: {},
+        selection: [],
+        where: {},
+        sectionInfo: {},
+        loading: false,
+        rules: {},
+      };
+    },
+    created() {
+      listInfo().then((res) => {
+        if (res.data.code == 0) {
+          console.log(res.data.data)
+          this.visibleWater = true;
+          this.sectionInfo = res.data.data
+        } else {
+          this.$message.error(res.data.msg);
+        }
+      })
+    },
+    methods: {
+      /* 刷新表格 */
+      reload() {
+        this.loading=true;
+        listMonthCompositeIndex(this.where).then((res) => {
+          console.log(res.data.data);
+          if (res.data.code == 0) {
+            this.$message.success(res.data.msg);
+            res.data.data.forEach((m) => {
+              this.momData.push(m);
+            })
+          } else {
+            this.$message.error(res.data.msg);
+          }
+          this.loading=false;
+        });
+      },
+      /* 重置搜索 */
+      reset() {
+        this.where = {};
+        this.reload();
+      },
+      /* 导出 */
+      exportFile() {
+        const columns = this.columns.filter(item => item.dataIndex);
+        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/river/statistic/avg-standard.vue

@@ -0,0 +1,172 @@
+<!-- 江河水查看数据页面-->
+<template>
+  <div class="ele-body">
+    <a-card :bordered="false">
+      <!-- 搜索表单 -->
+      <a-form :model="where" :label-col="{ md: { span: 8 }, sm: { span: 24 } }"
+        :wrapper-col="{ md: { span: 16 }, sm: { span: 24 } }">
+        <a-row>
+          <a-form-item label="断面名称">
+            <a-select v-model:value="where.sectionName" allowClear showSearch>
+              <a-select-option v-for="item in sectionInfo" :key="item.sectionName">{{ item.sectionName }}
+              </a-select-option>
+            </a-select>
+          </a-form-item>
+          <!-- <a-form-item label="年份:">
+            <a-date-picker valueFormat="YYYY" v-model:value="where.year"></a-date-picker>
+          </a-form-item>
+          <a-form-item label="月份:">
+            <a-date-picker valueFormat="MM" v-model:value="where.month"></a-date-picker>
+          </a-form-item> -->
+          <a-form-item label="开始时间:">
+            <a-month-picker v-model:value="where.startTime" :disabled-date="disabledDate" />
+          </a-form-item>
+          <a-form-item label="结束时间:">
+            <a-month-picker v-model:value="where.endTime" :disabled-date="disabledDate" />
+          </a-form-item>
+          <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="reload">查询</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-form>
+      <!-- 表格 -->
+      <a-spin :spinning="loading">
+        <ele-pro-table ref="table" :datasource="momData" :columns="columns" :where="where"
+          :scroll="{ x: 'max-content' }" @done="(d) => (data = d.data)">
+        </ele-pro-table>
+      </a-spin>
+    </a-card>
+  </div>
+  <!-- 编辑弹窗 -->
+</template>
+
+<script>
+  import {
+    listMonthWaterQualitySandard
+  } from "@/api/ecology/river-statis";
+  import {
+    listInfo
+  } from "@/api/ecology/water/river-plcae";
+  import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
+  import XLSX from "xlsx";
+  export default {
+    name: "RiverCollectWater",
+    components: {},
+    data() {
+      return {
+        data: [],
+        momData: [],
+        yoyData: [],
+        datasource: {},
+        columns: [{
+            title: '断面类型',
+            dataIndex: 'sectionType',
+            key: 'sectionType',
+          },
+          {
+            title: '断面名称',
+            dataIndex: 'sectionName',
+            key: 'sectionName',
+          },
+          {
+            title: '考核城市',
+            dataIndex: 'city',
+            key: 'city',
+          },
+          {
+            title: '水质考核目标',
+            dataIndex: 'waterTarget',
+            key: 'waterTarget',
+          },
+          {
+            title: '平均水质类别',
+            dataIndex: 'waterQualityCategoryAvg',
+            key: 'waterQualityCategoryAvg',
+          },
+          {
+            title: '水质评价',
+            dataIndex: 'waterQualityEvaluate',
+            key: 'waterQualityEvaluate',
+          },
+          {
+            title: '超标项目',
+            dataIndex: 'transnormalItem',
+            key: 'transnormalItem',
+          },
+          {
+            title: '去年同期水质类别',
+            dataIndex: 'waterQualityCategoryYoy',
+            key: 'waterQualityCategoryYoy',
+          },
+        ],
+        locale,
+        bill: {},
+        selection: [],
+        where: {},
+        sectionInfo: {},
+        loading: false,
+        rules: {},
+      };
+    },
+    created() {
+      listInfo().then((res) => {
+        if (res.data.code == 0) {
+          console.log(res.data.data)
+          this.visibleWater = true;
+          this.sectionInfo = res.data.data
+        } else {
+          this.$message.error(res.data.msg);
+        }
+      })
+    },
+    methods: {
+      /* 刷新表格 */
+      reload() {
+        this.loading = true;
+        listMonthWaterQualitySandard(this.where).then((res) => {
+          console.log(res.data.data);
+          if (res.data.code == 0) {
+            this.$message.success(res.data.msg);
+            res.data.data.forEach((m) => {
+              m.transnormalItem = "--"
+              this.momData.push(m);
+            })
+          } else {
+            this.$message.error(res.data.msg);
+          }
+          this.loading = false;
+        });
+      },
+      /* 重置搜索 */
+      reset() {
+        this.where = {};
+        this.reload();
+      },
+      /* 导出 */
+      exportFile() {
+        const columns = this.columns.filter(item => item.dataIndex);
+        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/river/statistic/base-index.vue

@@ -0,0 +1,166 @@
+<!-- 江河水查看数据页面-->
+<template>
+  <div class="ele-body">
+    <a-card :bordered="false">
+      <!-- 搜索表单 -->
+      <a-form :model="where" :label-col="{ md: { span: 8 }, sm: { span: 24 } }"
+        :wrapper-col="{ md: { span: 16 }, sm: { span: 24 } }">
+        <a-row>
+          <a-form-item label="断面名称">
+            <a-select v-model:value="where.sectionName" allowClear showSearch>
+              <a-select-option v-for="item in sectionInfo" :key="item.sectionName">{{ item.sectionName }}
+              </a-select-option>
+            </a-select>
+          </a-form-item>
+          <!-- <a-form-item label="年份:">
+            <a-date-picker valueFormat="YYYY" v-model:value="where.year"></a-date-picker>
+          </a-form-item>
+          <a-form-item label="月份:">
+            <a-date-picker valueFormat="MM" v-model:value="where.month"></a-date-picker>
+          </a-form-item> -->
+          <a-form-item label="查询时间:">
+            <a-month-picker v-model:value="where.startTime" :disabled-date="disabledDate" />
+          </a-form-item>
+          <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="reload">查询</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-form>
+      <!-- 表格 -->
+      <a-spin :spinning="loading">
+        <ele-pro-table ref="table" :datasource="momData" :columns="columns" :where="where"
+          :scroll="{ x: 'max-content' }" @done="(d) => (data = d.data)">
+        </ele-pro-table>
+      </a-spin>
+    </a-card>
+  </div>
+  <!-- 编辑弹窗 -->
+</template>
+
+<script>
+  import {
+    listMonthCompositeIndex
+  } from "@/api/ecology/river-statis";
+  import {
+    listInfo
+  } from "@/api/ecology/water/river-plcae";
+  import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
+  import XLSX from "xlsx";
+  export default {
+    name: "RiverCollectWater",
+    components: {},
+    data() {
+      return {
+        data: [],
+        momData: [],
+        yoyData: [],
+        datasource: {},
+        columns: [{
+            title: '断面名称',
+            dataIndex: 'sectionName',
+            key: 'sectionName',
+          },
+          {
+            title: '水质综合指数排名',
+            dataIndex: 'orderBy',
+            key: 'orderBy',
+          },
+          {
+            title: "水质综合指数",
+            children: [{
+                title: "本月综合指数",
+                dataIndex: "baseIndex"
+              },
+              {
+                title: "上月综合指数",
+                dataIndex: "momIndex"
+              },
+              {
+                title: "上年同期指数",
+                dataIndex: "yoyIndex"
+              },
+            ]
+          },
+          {
+            title: "水质综合指数变化率",
+            children: [{
+                title: "上月",
+                dataIndex: "momRateChange"
+              },
+              {
+                title: "上年同期",
+                dataIndex: "yoyRateChange"
+              },
+            ]
+          },
+        ],
+        locale,
+        bill: {},
+        selection: [],
+        where: {},
+        sectionInfo: {},
+        loading: false,
+        rules: {},
+      };
+    },
+    created() {
+      listInfo().then((res) => {
+        if (res.data.code == 0) {
+          console.log(res.data.data)
+          this.visibleWater = true;
+          this.sectionInfo = res.data.data
+        } else {
+          this.$message.error(res.data.msg);
+        }
+      })
+    },
+    methods: {
+      /* 刷新表格 */
+      reload() {
+        this.loading = true;
+        listMonthCompositeIndex(this.where).then((res) => {
+          console.log(res.data.data);
+          if (res.data.code == 0) {
+            this.$message.success(res.data.msg);
+            res.data.data.forEach((m) => {
+              this.momData.push(m);
+            })
+          } else {
+            this.$message.error(res.data.msg);
+          }
+          this.loading = false;
+        });
+      },
+      /* 重置搜索 */
+      reset() {
+        this.where = {};
+        this.reload();
+      },
+      /* 导出 */
+      exportFile() {
+        const columns = this.columns.filter(item => item.dataIndex);
+        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/river/statistic/base-standard.vue

@@ -0,0 +1,167 @@
+<!-- 当月水质目标-->
+<template>
+  <div class="ele-body">
+    <a-card :bordered="false">
+      <!-- 搜索表单 -->
+      <a-form :model="where" :label-col="{ md: { span: 8 }, sm: { span: 24 } }"
+        :wrapper-col="{ md: { span: 16 }, sm: { span: 24 } }">
+        <a-row>
+          <a-form-item label="断面名称">
+            <a-select v-model:value="where.sectionName" allowClear showSearch>
+              <a-select-option v-for="item in sectionInfo" :key="item.sectionName">{{ item.sectionName }}
+              </a-select-option>
+            </a-select>
+          </a-form-item>
+          <!-- <a-form-item label="年份:">
+            <a-date-picker valueFormat="YYYY" v-model:value="where.year"></a-date-picker>
+          </a-form-item>
+          <a-form-item label="月份:">
+            <a-date-picker valueFormat="MM" v-model:value="where.month"></a-date-picker>
+          </a-form-item> -->
+          <a-form-item label="查询时间:">
+            <a-month-picker v-model:value="where.startTime" :disabled-date="disabledDate" />
+          </a-form-item>
+          <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="reload">查询</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-form>
+      <!-- 表格 -->
+      <a-spin :spinning="loading">
+        <ele-pro-table ref="table" :datasource="momData" :columns="columns" :where="where"
+          :scroll="{ x: 'max-content' }" @done="(d) => (data = d.data)">
+        </ele-pro-table>
+      </a-spin>
+    </a-card>
+  </div>
+  <!-- 编辑弹窗 -->
+</template>
+
+<script>
+  import {
+    listMonthWaterQualitySandard
+  } from "@/api/ecology/river-statis";
+  import {
+    listInfo
+  } from "@/api/ecology/water/river-plcae";
+  import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
+  import XLSX from "xlsx";
+  export default {
+    name: "RiverCollectWater",
+    components: {},
+    data() {
+      return {
+        data: [],
+        momData: [],
+        datasource: {},
+        columns: [{
+            title: '断面类型',
+            dataIndex: 'sectionType',
+            key: 'sectionType',
+          },
+          {
+            title: '断面名称',
+            dataIndex: 'sectionName',
+            key: 'sectionName',
+          },
+          {
+            title: '考核城市',
+            dataIndex: 'city',
+            key: 'city',
+          },
+          {
+            title: '考核目标',
+            dataIndex: 'waterTarget',
+            key: 'waterTarget',
+          },
+          {
+            title: '水质类别',
+            dataIndex: 'waterQualityCategory',
+            key: 'waterQualityCategory',
+          },
+          {
+            title: '水质评价',
+            dataIndex: 'waterQualityEvaluate',
+            key: 'waterQualityEvaluate',
+          },
+          {
+            title: '上期水质类别',
+            dataIndex: 'waterQualityCategoryMom',
+            key: 'waterQualityCategoryMom',
+          },
+          {
+            title: '去年同期水质类别',
+            dataIndex: 'waterQualityCategoryYoy',
+            key: 'waterQualityCategoryYoy',
+          },
+        ],
+        locale,
+        bill: {},
+        selection: [],
+        where: {},
+        sectionInfo: {},
+        loading: false,
+        rules: {},
+      };
+    },
+    created() {
+      listInfo().then((res) => {
+        if (res.data.code == 0) {
+          console.log(res.data.data)
+          this.visibleWater = true;
+          this.sectionInfo = res.data.data
+        } else {
+          this.$message.error(res.data.msg);
+        }
+      })
+    },
+    methods: {
+      /* 刷新表格 */
+      reload() {
+        this.loading = true;
+        listMonthWaterQualitySandard(this.where).then((res) => {
+          console.log(res.data.data);
+          if (res.data.code == 0) {
+            this.$message.success(res.data.msg);
+            res.data.data.forEach((m) => {
+              this.momData.push(m);
+            })
+          } else {
+            this.$message.error(res.data.msg);
+          }
+          this.loading = false;
+        });
+      },
+      /* 重置搜索 */
+      reset() {
+        this.where = {};
+        this.reload();
+      },
+      /* 导出 */
+      exportFile() {
+        const columns = this.columns.filter(item => item.dataIndex);
+        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/river/statistic/index.vue

@@ -8,16 +8,16 @@
               <base-statistic></base-statistic>
             </a-tab-pane>
             <a-tab-pane tab="当月水质达标" key="base1">
-              <function-bill ></function-bill>
+              <month-standard ></month-standard>
             </a-tab-pane>
             <a-tab-pane tab="平均水质达标" key="base2">
-              <function-bill></function-bill>
+              <avg-standard></avg-standard>
             </a-tab-pane>
             <a-tab-pane tab="当月综合指数" key="base3">
-              <function-bill></function-bill>
+              <month-index ></month-index>
             </a-tab-pane>
             <a-tab-pane tab="平均水质指数" key="base4">
-              <function-bill ></function-bill>
+              <avg-index ></avg-index>
             </a-tab-pane>
           </a-tabs>
         </a-tab-pane>
@@ -52,6 +52,11 @@
   import NationalStatis from "../../water-function-area/statistic/national.vue";
   import SiteStatis from "../../river-station/statistic/site.vue";
   import SiteDayStatis from "../../river-station/statistic/site-day-avg.vue";
+
+  import MonthStandard from "./base-standard.vue";
+  import AvgStandard from "./avg-standard.vue";
+  import MonthIndex from "./base-index.vue";
+  import AvgIndex from "./avg-index.vue";
   export default {
     name: 'StatisticAirIndex',
     components: {
@@ -59,7 +64,11 @@
       AutoStatis,
       NationalStatis,
       SiteStatis,
-      SiteDayStatis
+      SiteDayStatis,
+      MonthStandard,
+      AvgStandard,
+      MonthIndex,
+      AvgIndex,
     },
     data() {
       return {

src/views/water/water-function-area/statistic/auto.vue

@@ -31,9 +31,11 @@
         </a-row>
       </a-form>
       <!-- 表格 -->
-      <ele-pro-table ref="table"  :datasource="datasource" :columns="columns" :where="where"
+      <a-spin :spinning="loading">
+      <ele-pro-table ref="table" :datasource="datasource" :columns="columns" :where="where"
         :scroll="{ x: 'max-content' }" @done="(d) => (data = d.data)">
       </ele-pro-table>
+    </a-spin>
     </a-card>
   </div>
   <!-- 编辑弹窗 -->
@@ -60,7 +62,7 @@
         data: [],
         locale,
         datasource: {},
-         // 表格数据接口
+        // 表格数据接口
         // url: autonomyWaterFunctionTotalUrl,
         selection: [],
         tableColumns,
@@ -107,8 +109,8 @@
           e.nTotal = "-1";
           e.transp = "-1";
           e.chla = "-1";
-          e.ffeMajorOverStandardItemsMultiples =  "-1";
-          e.lprlMajorOverStandardItemsMultiples =  "-1";
+          e.ffeMajorOverStandardItemsMultiples = "-1";
+          e.lprlMajorOverStandardItemsMultiples = "-1";
         })
         this.datasource = res.data.data;
       });
@@ -127,45 +129,44 @@
     methods: {
       /* 刷新表格 */
       reload() {
-        // this.$refs.table.reload({
-        //   where: this.where,
-        // });
+        this.loading = true;
         autonomyWaterFunctionTotal().then((res) => {
-        res.data.data.forEach((e) => {
-          e.wTemp = "-1";
-          e.ph = "-1";
-          e.dissolvedOxygen = "-1";
-          e.cod = "-1";
-          e.fiveDayBod = "-1";
-          e.ammonia = "-1";
-          e.cu = "-1";
-          e.zn = "-1";
-          e.f = "-1";
-          e.se = "-1";
-          e.as = "-1";
-          e.hg = "-1";
-          e.cd = "-1";
-          e.cr6 = "-1";
-          e.pb = "-1";
-          e.cyanide = "-1";
-          e.vPhen = "-1";
-          e.oils = "-1";
-          e.anSaa = "-1";
-          e.s = "-1";
-          e.coloOrg = "-1";
-          e.so4 = "-1";
-          e.cl = "-1";
-          e.nitrateNitrogen = "-1";
-          e.fe = "-1";
-          e.mn = "-1";
-          e.nTotal = "-1";
-          e.transp = "-1";
-          e.chla = "-1";
-          e.ffeMajorOverStandardItemsMultiples =  "-1";
-          e.lprlMajorOverStandardItemsMultiples =  "-1";
-        })
-        this.datasource = res.data.data;
-      });
+          res.data.data.forEach((e) => {
+            e.wTemp = "-1";
+            e.ph = "-1";
+            e.dissolvedOxygen = "-1";
+            e.cod = "-1";
+            e.fiveDayBod = "-1";
+            e.ammonia = "-1";
+            e.cu = "-1";
+            e.zn = "-1";
+            e.f = "-1";
+            e.se = "-1";
+            e.as = "-1";
+            e.hg = "-1";
+            e.cd = "-1";
+            e.cr6 = "-1";
+            e.pb = "-1";
+            e.cyanide = "-1";
+            e.vPhen = "-1";
+            e.oils = "-1";
+            e.anSaa = "-1";
+            e.s = "-1";
+            e.coloOrg = "-1";
+            e.so4 = "-1";
+            e.cl = "-1";
+            e.nitrateNitrogen = "-1";
+            e.fe = "-1";
+            e.mn = "-1";
+            e.nTotal = "-1";
+            e.transp = "-1";
+            e.chla = "-1";
+            e.ffeMajorOverStandardItemsMultiples = "-1";
+            e.lprlMajorOverStandardItemsMultiples = "-1";
+          })
+          this.datasource = res.data.data;
+          this.loading = false;
+        });
       },
       /* 重置搜索 */
       reset() {

src/views/water/water-function-area/statistic/national.vue

@@ -31,9 +31,11 @@
         </a-row>
       </a-form>
       <!-- 表格 -->
+      <a-spin :spinning="loading">
       <ele-pro-table ref="table" :datasource="datasource" :columns="columns" :where="where"
         :scroll="{ x: 'max-content' }" @done="(d) => (data = d.data)">
       </ele-pro-table>
+    </a-spin>
     </a-card>
   </div>
   <!-- 编辑弹窗 -->
@@ -107,6 +109,7 @@
       };
     },
     mounted() {
+      this.loading = true;
       nationalWaterFunctionTotal().then((res) => {
         res.data.data.forEach((e) => {
           e.wTemp = "-1";
@@ -142,6 +145,7 @@
           e.lprlMajorOverStandardItemsMultiples =  "-1";
         })
         this.datasource = res.data.data;
+        this.loading = false;
       });
     },
     created() {