From c903f1ec6f9d1d4868218cb25aa59632e529665e Mon Sep 17 00:00:00 2001
From: weicw <594098497@qq.com>
Date: Thu, 26 Aug 2021 16:32:25 +0800
Subject: [PATCH] =?UTF-8?q?=E5=B8=82=E5=90=8C=E6=AF=94=E4=B8=8E=E5=B9=B4?=
 =?UTF-8?q?=E5=90=8C=E6=AF=94?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/ecology/zone-sound.js              |   4 +-
 src/views/sound/road/statistic/compare.vue |   4 +-
 src/views/sound/zone/statistic/average.vue | 383 +++++++---------
 src/views/sound/zone/statistic/compare.vue | 508 ---------------------
 src/views/sound/zone/statistic/index.vue   |  18 +-
 src/views/sound/zone/statistic/year.vue    | 224 +++++++++
 6 files changed, 408 insertions(+), 733 deletions(-)
 delete mode 100644 src/views/sound/zone/statistic/compare.vue
 create mode 100644 src/views/sound/zone/statistic/year.vue

diff --git a/src/api/ecology/zone-sound.js b/src/api/ecology/zone-sound.js
index 0107142..1b63912 100644
--- a/src/api/ecology/zone-sound.js
+++ b/src/api/ecology/zone-sound.js
@@ -50,6 +50,7 @@ const updateZoneNoise = function (data) {
 // -------------------------统计---------------------
 const pageZoneNoiseStatisticUrl = '/sound/zone/noise/statistic';
 const statisticSourceUrl = '/sound/zone/noise/statistic/source';
+const statisticYearUrl = '/sound/zone/noise/statistic/year';
 const getHistoryyears = function () {
     return axios.get("/sound/zone/noise/history-year")
 }
@@ -73,6 +74,7 @@ export {
     pageZoneNoiseStatisticUrl,
     getHistoryyears,
     getColumnOptions,
-    statisticSourceUrl
+    statisticSourceUrl,
+    statisticYearUrl
   
 }
diff --git a/src/views/sound/road/statistic/compare.vue b/src/views/sound/road/statistic/compare.vue
index bc922a6..733daea 100644
--- a/src/views/sound/road/statistic/compare.vue
+++ b/src/views/sound/road/statistic/compare.vue
@@ -12,7 +12,7 @@
             </a-select>
           </a-form-item>
         </a-col> -->
-        <a-col :lg="6" :md="12" :sm="24" :xs="24">
+        <!-- <a-col :lg="6" :md="12" :sm="24" :xs="24">
           <a-form-item label="时间细度:">
             <a-select
               :options="groupTimeLengthOptions"
@@ -21,7 +21,7 @@
             >
             </a-select>
           </a-form-item>
-        </a-col>
+        </a-col> -->
         <a-col :lg="6" :md="12" :sm="24" :xs="24">
           <a-form-item name="timeRange" label="时间范围:">
             <a-range-picker
diff --git a/src/views/sound/zone/statistic/average.vue b/src/views/sound/zone/statistic/average.vue
index 8a56a81..3abe54f 100644
--- a/src/views/sound/zone/statistic/average.vue
+++ b/src/views/sound/zone/statistic/average.vue
@@ -1,258 +1,213 @@
 <template>
-  <div class="">
-    <ele-pro-table
-      ref="table"
-      row-key="id"
-      :datasource="url"
-      :columns="columns"
-      :where="where"
-      :needPage="false"
-      @done="(d) => (data = d.data)"
-      :scroll="{ x: 'max-content' }"
-    >
-      <template #toolbar>
-        <!-- 搜索表单 -->
-        <a-form :model="where" layout="inline" :labelCol="{ offset: 1 }">
-          <a-row>
-            <a-col :lg="6" :md="12" :sm="24" :xs="24">
-              <a-form-item label="昼夜:">
-                <a-select
-                  :options="timeSlotOptions"
-                  v-model:value="where.timeSlot"
-                  placeholder="昼夜"
+  <div class="ele-body">
+    <a-card :bordered="false">
+      <!-- 搜索表单 -->
+      <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.year" allowClear showSearch>
+                <a-select-option
+                  v-for="item in yearOptions"
+                  :key="item.value"
+                  >{{ item.label }}</a-select-option
                 >
-                </a-select>
-              </a-form-item>
-            </a-col>
-            <a-col :lg="8" :md="12" :sm="24" :xs="24">
-              <a-form-item label="时间范围:">
-                <!-- <a-month-picker v-model:value="timeScope" placeholder="起始" /> -->
-                <a-range-picker v-model:value="timeScope" format="YYYY-MM-DD" />
-              </a-form-item>
-            </a-col>
-
-            <a-col :lg="4" :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-space>
-            
-          </a-space> -->
-      </template>
-      <template #Leq="{ text, record }">
-        <a-tag
-          v-if="
-            (where.timeSlot == '昼' && text <= 68) ||
-            (where.timeSlot == '夜' && text <= 58)
-          "
-          color="green"
-          >{{ text }}</a-tag
-        >
-        <a-tag
-          v-else-if="
-            (record.timeSlot == '昼' && text > 68 && text <= 70) ||
-            (record.timeSlot == '夜' && text > 58 && text <= 60)
-          "
-          color="blue"
-          >{{ text }}</a-tag
-        >
-        <a-tag
-          v-else-if="
-            (record.timeSlot == '昼' && text > 70 && text <= 72) ||
-            (record.timeSlot == '夜' && text > 60 && text <= 62)
-          "
-          color="red"
-          >{{ text }}</a-tag
-        >
-        <a-tag
-          v-else-if="
-            (record.timeSlot == '昼' && text > 62 && text <= 74) ||
-            (record.timeSlot == '夜' && text > 62 && text <= 64)
-          "
-          color="red"
-          >{{ text }}</a-tag
-        >
-        <a-tag
-          v-else-if="
-            (record.timeSlot == '昼' && text > 74) ||
-            (record.timeSlot == '夜' && text > 64)
-          "
-          color="red"
-          >{{ text }}</a-tag
-        >
-        <template v-else color="#FFF">{{ text }}</template>
-      </template>
-    </ele-pro-table>
+              </a-select>
+            </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="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>
+      <!-- 表格 -->
+      <ele-pro-table
+        v-model:selection="selectionList"
+        ref="table"
+        row-key="area"
+        :datasource="url"
+        :columns="columns"
+        :where="where"
+        :needPage="false"
+        :initLoad="false"
+        :scroll="{ x: 'max-content' }"
+        @done="(d) => (data = d.data)"
+      >
+      </ele-pro-table>
+    </a-card>
   </div>
+  <!-- 编辑弹窗 -->
 </template>
 
 <script>
-import _ from "lodash";
+// import _ from "lodash";
 import XLSX from "xlsx";
-import { pageZoneNoiseStatisticUrl } from "@/api/ecology/zone-sound";
-const columns = [
-  {
-    title: "城区",
-    dataIndex: "area",
-  },
-
-  {
-    title: "市",
-    dataIndex: "city",
-  },
-  {
-    title: "路长",
-    dataIndex: "zoneLength",
-  },
-  {
-    title: "路宽",
-    dataIndex: "zoneWidth",
-  },
-  {
-    title: "LeqdB(A)",
-    dataIndex: "avgLeq",
-    slots: { customRender: "Leq" },
-    sorter: true,
-  },
-  {
-    title: "SDdB(A)",
-    dataIndex: "avgSD",
-  },
-  {
-    title: "L10dB(A)",
-    dataIndex: "avgL10",
-  },
-  {
-    title: "L50dB(A)",
-    dataIndex: "avgL50",
-  },
-  {
-    title: "L90dB(A)",
-    dataIndex: "avgL90",
-  },
-];
+import { pageZoneNoiseStatisticUrl, getColumnOptions } from "@/api/ecology/zone-sound";
+import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
+//   import utils from "./utils";
 export default {
   name: "StatisticSoundZoneAverage",
   components: {},
   data() {
     return {
-      url: pageZoneNoiseStatisticUrl,
       data: [],
-      where: {
-        model: "area",
-        timeSlot: "昼"
-      },
-      timeScope: [],
-      columns,
-      modelOptions: [
+      locale,
+      bill: {},
+      // 表格数据接口
+      url: pageZoneNoiseStatisticUrl,
+      selection: [],
+      // 表格列配置
+      columns: [
         {
-          value: "place",
-          label: "测点",
+          title: "噪声源分类",
+          dataIndex: "source",
         },
         {
-          value: "zone",
-          label: "路段",
+          title: "测点数（个）",
+          dataIndex: "count",
         },
         {
-          value: "area",
-          label: "城区",
+          title: "声源占比（%）",
+          dataIndex: "rate",
         },
         {
-          value: "city",
-          label: "市",
-        },
-      ],
-      timeSlotOptions: [
-        {
-          value: "昼",
-          label: "昼",
-        },
-        {
-          value: "夜",
-          label: "夜",
+          title: "时段",
+          dataIndex: "timeSlot",
+        },
+        {
+          title: "监测结果",
+          children: [
+            {
+              title: "Leq",
+              dataIndex: "leq",
+            },
+            {
+              title: "L10",
+              dataIndex: "l10",
+            },
+            {
+              title: "L50",
+              dataIndex: "l50",
+            },
+            {
+              title: "L90",
+              dataIndex: "l90",
+            },
+          ],
         },
       ],
+      // 表格搜索条件
+      where: {},
+      yearOptions: [],
+      // 表格选中数据
+      selectionList: [],
     };
   },
+  mounted() {
+    this.loadOptionData();
+  },
   methods: {
+    /**获取下来框数据 */
+    loadOptionData() {
+      getColumnOptions("monitor_year").then((res) => {
+        this.yearOptions = res.data.data.map((item) => {
+          return {
+            label: item,
+            value: item,
+          };
+        });
+        this.reload();
+      });
+    },
     /* 刷新表格 */
     reload() {
+      const columns = [
+        {
+          title: "城区",
+          dataIndex: "area"
+        }
+      ]
+      this.yearOptions.forEach(item=>{
+        const {startYear,endYear} = this.where;
+        if((startYear&& Number(startYear)>Number(item.value))|| (endYear&&Number(endYear)<Number(item.value))){
+          console.log("");
+        }else{
+          columns.push({
+          title: item.value + "年噪声值",
+          dataIndex: item.value + "Leq"
+        })
+        }
+       
+      })
+      this.columns = columns;
+     
       this.$refs.table.reload({
-        where: {
-          model: this.where.model,
-          timeStart:
-            this.timeScope.length == 2
-              ? this.timeScope[0].format("Y-M-D")
-              : null,
-          timeEnd:
-            this.timeScope.length == 2
-              ? this.timeScope[1].format("Y-M-D")
-              : null,
-          timeSlot: this.where.timeSlot,
-        },
+        where: this.where,
       });
-      let cloneColumns = _.cloneDeep(columns);
-      if (this.where.model == "area") {
-        this.columns = cloneColumns.filter((item) => {
-          return item.dataIndex != "place" && item.dataIndex != "zone";
-        });
-      } else if (this.where.model == "zone") {
-        this.columns = cloneColumns.filter((item) => {
-          return item.dataIndex != "place";
-        });
-      } else if (this.where.model == "city") {
-        this.columns = cloneColumns.filter((item) => {
-          return (
-            item.dataIndex != "place" &&
-            item.dataIndex != "zone" &&
-            item.dataIndex != "area"
-          );
-        });
-      }
     },
     /* 重置搜索 */
     reset() {
-      this.where = {
-        model: "area",
-        timeSlot: "昼",
-      };
-      this.this.timeScope = [];
-
       this.reload();
     },
     exportFile() {
-      let array = [
-        ["测点", "路段", "城区", "路长", "路宽", "平均Leq", "平均SD"],
+      const columns = [
+        {
+          title: "噪声源分类",
+          dataIndex: "source",
+        },
+        {
+          title: "测点数（个）",
+          dataIndex: "count",
+        },
+        {
+          title: "声源占比（%）",
+          dataIndex: "rate",
+        },
+        {
+          title: "时段",
+          dataIndex: "timeSlot",
+        },
+
+        {
+          title: "Leq",
+          dataIndex: "leq",
+        },
+        {
+          title: "L10",
+          dataIndex: "l10",
+        },
+        {
+          title: "L50",
+          dataIndex: "l50",
+        },
+        {
+          title: "L90",
+          dataIndex: "l90",
+        },
       ];
+      const arr = [];
+      const th = columns.map((item) => item.title);
+      arr.push(th);
       this.data.forEach((d) => {
-        array.push([
-          d.place,
-          d.zone,
-          d.area,
-          d.zoneLength,
-          d.zoneWidth,
-          d.avgLeq,
-          d.avgSD,
-        ]);
+        const td = columns.map((item) => d[item.dataIndex]);
+        arr.push(td);
       });
-      let sheet = XLSX.utils.aoa_to_sheet(array);
-      // sheet['!merges'] = [
-      //   {s: {r: 0, c: 1}, e: {r: 0, c: 5}},  // 合并第0行第1列到第0行第5列
-      //   {s: {r: 0, c: 0}, e: {r: 1, c: 0}},  // 合并第0行第0列到第1行第0列
-      //   {s: {r: 0, c: 6}, e: {r: 1, c: 6}}  // 合并第0行第6列到第1行第6列
-      // ];
-      this.$util.exportSheet(XLSX, sheet, "道路交通噪声统计表");
+      let sheet = XLSX.utils.aoa_to_sheet(arr);
+      this.$util.exportSheet(XLSX, sheet, new Date().getTime().toString());
     },
   },
 };
 </script>
 
-<style scoped>
+<style scoped lang="less">
 </style>
\ No newline at end of file
diff --git a/src/views/sound/zone/statistic/compare.vue b/src/views/sound/zone/statistic/compare.vue
deleted file mode 100644
index e4c574e..0000000
--- a/src/views/sound/zone/statistic/compare.vue
+++ /dev/null
@@ -1,508 +0,0 @@
-<template>
-  <div class="">
-    <a-form :model="where" :rules="whereRules" :labelCol="{ offset: 1 }">
-      <a-row>
-        <!-- <a-col :lg="6" :md="12" :sm="24" :xs="24">
-          <a-form-item label="统计模块:">
-            <a-select
-              :options="groupModelOptions"
-              v-model:value="where.groupModel"
-              placeholder="统计模块"
-            >
-            </a-select>
-          </a-form-item>
-        </a-col> -->
-        <a-col :lg="6" :md="12" :sm="24" :xs="24">
-          <a-form-item label="时间细度:">
-            <a-select
-              :options="groupTimeLengthOptions"
-              v-model:value="where.groupTimeLength"
-              placeholder=""
-            >
-            </a-select>
-          </a-form-item>
-        </a-col>
-        <a-col :lg="6" :md="12" :sm="24" :xs="24">
-          <a-form-item name="timeRange" label="时间范围:">
-            <a-range-picker
-              @panelChange="timeRangePanelChange"
-              v-model:value="timeRange"
-              format="YYYY"
-              :mode="['year', 'year']"
-            />
-          </a-form-item>
-        </a-col>
-        <a-col :lg="6" :md="12" :sm="24" :xs="24">
-          <a-form-item label="昼夜:">
-            <a-select
-              :options="timeSlotOptions"
-              v-model:value="where.timeSlot"
-              placeholder="昼夜"
-            >
-            </a-select>
-          </a-form-item>
-        </a-col>
-
-        <a-col :lg="12" :md="12" :sm="24" :xs="24">
-          <a-form-item label="类型:">
-            <a-select
-              v-model:value="where.valueType"
-              :options="valueTypeOptions"
-              mode="multiple"
-              placeholder="至少选择一项"
-            >
-            </a-select>
-          </a-form-item>
-        </a-col>
-        <!-- <a-col :lg="6" :md="12" :sm="24" :xs="24">
-              <a-form-item label="时间范围:">
-                <a-range-picker @change="reportTimeScopeChange" :mode="['year','year']" separator="~" v-model:value="where.reportTimeScope" ><a-range-picker>
-                   <template #renderExtraFooter>
-                      extra footer
-                    </template>
-                </a-range-picker>
-              </a-form-item>
-            </a-col> -->
-
-        <a-col :lg="12" :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>
-    <ele-pro-table
-      v-if="hisYears.length > 0"
-      ref="table"
-      row-key="id"
-      :datasource="url"
-      :columns="columns"
-      :where="where"
-      :needPage="false"
-      :initLoad="false"
-      :scroll="{ x: 'max-content' }"
-      :method="'POST'"
-      @done="(d) => (data = d.data)"
-    >
-      <template #toolbar>
-        <!-- 搜索表单 -->
-
-        <!-- <a-space>
-            
-        </a-space> -->
-      </template>
-    </ele-pro-table>
-  </div>
-</template>
-
-<script>
-// import _ from "lodash";
-import { ref } from "vue";
-import XLSX from "xlsx";
-import {
-  pageZoneNoiseCompare,
-  getHistoryyears,
-} from "@/api/ecology/zone-sound";
-export default {
-  name: "StatisticSoundZoneCompare",
-  components: {},
-  data() {
-    const groupModelOptions = [
-      { label: "测点", value: "place" },
-      { label: "城区", value: "area" },
-      { label: "市", value: "city" },
-    ];
-    const groupTimeLengthOptions = [
-      {
-        label: "年",
-        value: "monitor_year",
-      },
-      {
-        label: "季度",
-        value: "quarter",
-      },
-    ];
-
-    // const valueTypeOptions = ['Leq','SD','L10','L50','L90','Lmin','Lmax'];
-    const valueTypeOptions = [
-      {
-        label: "Leq",
-        value: "index_Leq",
-      },
-      {
-        label: "SD",
-        value: "index_SD",
-      },
-      {
-        label: "L10",
-        value: "index_L10",
-      },
-      {
-        label: "L50",
-        value: "index_L50",
-      },
-      {
-        label: "L90",
-        value: "index_L90",
-      },
-      {
-        label: "Lmin",
-        value: "index_Lmin",
-      },
-      {
-        label: "Lmax",
-        value: "index_Lmax",
-      },
-    ];
-
-    const whereRules = {};
-    return {
-      url: pageZoneNoiseCompare,
-      data: [],
-      where: {
-        groupModel: "area",
-        groupTimeLength: "monitor_year",
-        reportTimeScope: [],
-        valueType: ["index_Leq"],
-        timeRange: [],
-        regionLevel: "市级"
-      },
-      timeRange: [],
-      whereRules,
-      hisYears: [],
-      timeScope: [],
-      columns: [{ title: "年", dataIndex: "year" }],
-      groupModelOptions,
-      groupTimeLengthOptions,
-      valueTypeOptions: ref(valueTypeOptions),
-      timeSlotOptions: [
-        {
-          value: "昼",
-          label: "昼",
-        },
-        {
-          value: "夜",
-          label: "夜",
-        },
-      ],
-    };
-  },
-  mounted() {
-    getHistoryyears().then((res) => {
-      this.hisYears = res.data.data;
-      this.$nextTick(() => {
-        this.reload();
-      });
-    });
-  },
-  methods: {
-    /* 刷新表格 */
-    reload() {
-      if (this.where.valueType.length == 0) {
-        this.$message.error("请至少选择一个类型");
-        return;
-      }
-
-      // 结束时间必须大于开始时间
-      if (this.where.timeRange && this.where.timeRange.length == 2) {
-        if (this.where.timeRange[0] > this.where.timeRange[1]) {
-          this.$message.error("结束时间必须大于起始时间");
-          return;
-        }
-        this.where.startYear = this.where.timeRange[0];
-        this.where.endYear = this.where.timeRange[1];
-      }
-      this.stableDone();
-      this.$refs.table.reload({
-        where: this.where,
-      });
-    },
-    /* 重置搜索 */
-    reset() {
-      this.where = {
-        groupModel: "area",
-        groupTimeLength: "monitor_year",
-        reportTimeScope: [],
-        valueType: ["index_Leq"],
-        timeRange: [],
-        regionLevel: "市级"
-      };
-      this.this.timeScope = [];
-      this.reload();
-    },
-    reportTimeScopeChange(d, dstr) {
-      console.log(d, dstr);
-    },
-    timeRangePanelChange(val) {
-      val[0] && (this.where.timeRange[0] = val[0].year());
-      val[1] && (this.where.timeRange[1] = val[1].year());
-      this.timeRange = val;
-    },
-    // 数据加载完成
-    stableDone() {
-      const columns = [];
-      if (this.where.groupModel == "area") {
-        columns.push({
-          title: "城区",
-          dataIndex: "area",
-          sorter: true,
-        });
-      } else if (this.where.groupModel == "place") {
-        columns.push({
-          title: "测点",
-          dataIndex: "area",
-          sorter: true,
-        });
-      } else if (this.where.groupModel == "city") {
-        columns.push({
-          title: "城市",
-          dataIndex: "area",
-          sorter: true,
-        });
-      }
-
-      this.hisYears.forEach((item) => {
-        if (
-          (!this.where.timeRange[0] || this.where.timeRange[0] <= item) &&
-          (!this.where.timeRange[1] || this.where.timeRange[1] >= item)
-        ) {
-          if (this.where.groupTimeLength == "quarter") {
-            columns.push({
-              title: item + "年第一季度Leq",
-              dataIndex: item + "1" + "Leq",
-              customRender: ({ text }) =>text? Number(text).toFixed(1):"",
-            });
-            columns.push({
-              title: item + "年第二季度Leq",
-              dataIndex: item + "2" + "Leq",
-              customRender: ({ text }) =>text? Number(text).toFixed(1):"",
-            });
-            columns.push({
-              title: item + "年第三季度Leq",
-              dataIndex: item + "3" + "Leq",
-              customRender: ({ text }) =>text? Number(text).toFixed(1):"",
-            });
-            columns.push({
-              title: item + "年第四季度Leq",
-              dataIndex: item + "4" + "Leq",
-              customRender: ({ text }) =>text? Number(text).toFixed(1):"",
-            });
-            columns.push({
-              title: item + "年第一季度SD",
-              dataIndex: item + "1" + "Sd",
-              customRender: ({ text }) =>text? Number(text).toFixed(1):"",
-            });
-            columns.push({
-              title: item + "年第二季度SD",
-              dataIndex: item + "2" + "Sd",
-              customRender: ({ text }) =>text? Number(text).toFixed(1):"",
-            });
-            columns.push({
-              title: item + "年第三季度SD",
-              dataIndex: item + "3" + "Sd",
-              customRender: ({ text }) =>text? Number(text).toFixed(1):"",
-            });
-            columns.push({
-              title: item + "年第四季度SD",
-              dataIndex: item + "4" + "Sd",
-              customRender: ({ text }) =>text? Number(text).toFixed(1):"",
-            });
-            columns.push({
-              title: item + "年第一季度L10",
-              dataIndex: item + "1" + "L10",
-              customRender: ({ text }) =>text? Number(text).toFixed(1):"",
-            });
-            columns.push({
-              title: item + "年第二季度L10",
-              dataIndex: item + "2" + "L10",
-              customRender: ({ text }) =>text? Number(text).toFixed(1):"",
-            });
-            columns.push({
-              title: item + "年第三季度L10",
-              dataIndex: item + "3" + "L10",
-              customRender: ({ text }) =>text? Number(text).toFixed(1):"",
-            });
-            columns.push({
-              title: item + "年第四季度L10",
-              dataIndex: item + "4" + "L10",
-              customRender: ({ text }) =>text? Number(text).toFixed(1):"",
-            });
-            columns.push({
-              title: item + "年第一季度L50",
-              dataIndex: item + "1" + "L50",
-              customRender: ({ text }) =>text? Number(text).toFixed(1):"",
-            });
-            columns.push({
-              title: item + "年第二季度L50",
-              dataIndex: item + "2" + "L50",
-              customRender: ({ text }) =>text? Number(text).toFixed(1):"",
-            });
-            columns.push({
-              title: item + "年第三季度L50",
-              dataIndex: item + "3" + "L50",
-              customRender: ({ text }) =>text? Number(text).toFixed(1):"",
-            });
-            columns.push({
-              title: item + "年第四季度L50",
-              dataIndex: item + "4" + "L50",
-              customRender: ({ text }) =>text? Number(text).toFixed(1):"",
-            });
-            columns.push({
-              title: item + "年第一季度L90",
-              dataIndex: item + "1" + "L90",
-              customRender: ({ text }) =>text? Number(text).toFixed(1):"",
-            });
-            columns.push({
-              title: item + "年第二季度L90",
-              dataIndex: item + "2" + "L90",
-              customRender: ({ text }) =>text? Number(text).toFixed(1):"",
-            });
-            columns.push({
-              title: item + "年第三季度L90",
-              dataIndex: item + "3" + "L90",
-              customRender: ({ text }) =>text? Number(text).toFixed(1):"",
-            });
-            columns.push({
-              title: item + "年第四季度L90",
-              dataIndex: item + "4" + "L90",
-              customRender: ({ text }) =>text? Number(text).toFixed(1):"",
-            });
-            columns.push({
-              title: item + "年第一季度Lmin",
-              dataIndex: item + "1" + "Lmin",
-              customRender: ({ text }) =>text? Number(text).toFixed(1):"",
-            });
-            columns.push({
-              title: item + "年第二季度Lmin",
-              dataIndex: item + "2" + "Lmin",
-              customRender: ({ text }) =>text? Number(text).toFixed(1):"",
-            });
-            columns.push({
-              title: item + "年第三季度Lmin",
-              dataIndex: item + "3" + "Lmin",
-              customRender: ({ text }) =>text? Number(text).toFixed(1):"",
-            });
-            columns.push({
-              title: item + "年第四季度Lmin",
-              dataIndex: item + "4" + "Lmin",
-              customRender: ({ text }) =>text? Number(text).toFixed(1):"",
-            });
-            columns.push({
-              title: item + "年第一季度Lmax",
-              dataIndex: item + "1" + "Lmax",
-              customRender: ({ text }) =>text? Number(text).toFixed(1):"",
-            });
-            columns.push({
-              title: item + "年第二季度Lmax",
-              dataIndex: item + "2" + "Lmax",
-              customRender: ({ text }) =>text? Number(text).toFixed(1):"",
-            });
-            columns.push({
-              title: item + "年第三季度Lmax",
-              dataIndex: item + "3" + "Lmax",
-              customRender: ({ text }) =>text? Number(text).toFixed(1):"",
-            });
-            columns.push({
-              title: item + "年第四季度Lmax",
-              dataIndex: item + "4" + "Lmax",
-              customRender: ({ text }) =>text? Number(text).toFixed(1):"",
-            });
-          } else {
-            if (this.where.valueType.includes("index_Leq")) {
-              columns.push({
-                title: item + "年Leq",
-                dataIndex: item + "Leq",
-                customRender: ({ text }) => {
-                  const val = text ? Number(text).toFixed(1) : "";
-                  return val;
-                },
-              });
-            }
-            if (this.where.valueType.includes("index_SD")) {
-              columns.push({
-                title: item + "年SD",
-                dataIndex: item + "Sd",
-                customRender: ({ text }) => {
-                  const val = text ? Number(text).toFixed(1) : "";
-                  return val;
-                },
-              });
-            }
-            if (this.where.valueType.includes("index_L10")) {
-              columns.push({
-                title: item + "年L10",
-                dataIndex: item + "L10",
-                customRender: ({ text }) => {
-                  const val = text ? Number(text).toFixed(1) : "";
-                  return val;
-                },
-              });
-            }
-
-            if (this.where.valueType.includes("index_L50")) {
-              columns.push({
-                title: item + "年L50",
-                dataIndex: item + "L50",
-                customRender: ({ text }) => {
-                  const val = text ? Number(text).toFixed(1) : "";
-                  return val;
-                },
-              });
-            }
-            if (this.where.valueType.includes("index_L90")) {
-              columns.push({
-                title: item + "年L90",
-                dataIndex: item + "L90",
-                customRender: ({ text }) => {
-                  const val = text ? Number(text).toFixed(1) : "";
-                  return val;
-                },
-              });
-            }
-            if (this.where.valueType.includes("index_Lmin")) {
-              columns.push({
-                title: item + "年Lmin",
-                dataIndex: item + "Lmin",
-                customRender: ({ text }) => {
-                  const val = text ? Number(text).toFixed(1) : "";
-                  return val;
-                },
-              });
-            }
-            if (this.where.valueType.includes("index_Lmax")) {
-              columns.push({
-                title: item + "年Lmax",
-                dataIndex: item + "Lmax",
-                customRender: ({ text }) => {
-                  const val = text ? Number(text).toFixed(1) : "";
-                  return val;
-                },
-              });
-            }
-          }
-        }
-      });
-      //
-      this.columns = columns;
-    },
-    exportFile() {
-      const arr = [];
-      const th = this.columns.map((item) => item.title);
-      arr.push(th);
-      this.data.forEach((d) => {
-        const td = this.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>
-</style>
\ No newline at end of file
diff --git a/src/views/sound/zone/statistic/index.vue b/src/views/sound/zone/statistic/index.vue
index 9ca9104..a7a8b60 100644
--- a/src/views/sound/zone/statistic/index.vue
+++ b/src/views/sound/zone/statistic/index.vue
@@ -8,14 +8,14 @@
         <a-tab-pane key="source-statistic" tab="声源">
           <source-statistic></source-statistic>
         </a-tab-pane>
-        <a-tab-pane key="average" tab="平均">
+        <a-tab-pane key="average" tab="城区">
           <average-statistic></average-statistic>
         </a-tab-pane>
         <!-- <a-tab-pane key="quarter" tab="季度报告">
          <quarter-statistic></quarter-statistic>
         </a-tab-pane> -->
-        <a-tab-pane key="year-compare" tab="同比">
-         <compare></compare>
+        <a-tab-pane key="year-compare" tab="市">
+         <year-statistic></year-statistic>
         </a-tab-pane>
       </a-tabs>
     </a-card>
@@ -30,17 +30,19 @@
    */
   import BaseStatistic from "./base.vue";
   // import QuarterStatistic from "./quarter.vue";
-  import Compare from "./compare.vue"
-  import AverageStatistic from "./average.vue"
-  import SourceStatistic from "./source.vue"
+  // import Compare from "./compare.vue";
+  import AverageStatistic from "./average.vue";
+  import SourceStatistic from "./source.vue";
+  import YearStatistic from "./year.vue";
 
   export default {
     name: 'StatisticSoundZone',
     components: {
       BaseStatistic,
       SourceStatistic,
-      Compare,
-      AverageStatistic
+      // Compare,
+      AverageStatistic,
+      YearStatistic
     },
     data() {
       return {
diff --git a/src/views/sound/zone/statistic/year.vue b/src/views/sound/zone/statistic/year.vue
new file mode 100644
index 0000000..2d4b011
--- /dev/null
+++ b/src/views/sound/zone/statistic/year.vue
@@ -0,0 +1,224 @@
+<template>
+  <div class="ele-body">
+    <a-card :bordered="false">
+      <!-- 搜索表单 -->
+      <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.startYear" allowClear showSearch>
+                <a-select-option
+                  v-for="item in yearOptions"
+                  :disabled="item.value > where.endYear"
+                  :key="item.value"
+                  >{{ item.label }}</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.endYear" allowClear showSearch>
+                <a-select-option
+                  v-for="item in yearOptions"
+                  :disabled="item.value < where.startYear"
+                  :key="item.value"
+                  >{{ item.label }}</a-select-option
+                >
+              </a-select>
+            </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="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>
+      <!-- 表格 -->
+      <ele-pro-table
+        v-model:selection="selectionList"
+        ref="table"
+        :row-key="(record) => record.source + record.timeSlot"
+        :datasource="url"
+        :columns="columns"
+        :where="where"
+        :needPage="false"
+        :initLoad="false"
+        :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 { statisticYearUrl, getColumnOptions } from "@/api/ecology/zone-sound";
+import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
+//   import utils from "./utils";
+export default {
+  name: "StatisticSoundZoneSource",
+  components: {},
+  data() {
+    return {
+      data: [],
+      locale,
+      bill: {},
+      // 表格数据接口
+      url: statisticYearUrl,
+      selection: [],
+      // 表格列配置
+      columns: [
+        {
+          title: "年份",
+          dataIndex: "year",
+        },
+        {
+          title: "网格长（米）",
+          dataIndex: "gridLength",
+        },
+        {
+          title: "网格宽（米）",
+          dataIndex: "gridWidth",
+        },
+        {
+          title: "网格总数",
+          dataIndex: "gridCount",
+        },
+        {
+          title: "时段",
+          dataIndex: "timeSlot",
+        },
+        {
+          title: "监测结果",
+          children: [
+            {
+              title: "Leq",
+              dataIndex: "leq",
+            },
+            {
+              title: "L10",
+              dataIndex: "l10",
+            },
+            {
+              title: "L50",
+              dataIndex: "l50",
+            },
+            {
+              title: "L90",
+              dataIndex: "l90",
+            },
+          ],
+        },
+        {
+          title: "质量等级",
+          dataIndex: "level",
+        },
+      ],
+      // 表格搜索条件
+      where: {},
+      yearOptions: [],
+      // 表格选中数据
+      selectionList: [],
+    };
+  },
+  mounted() {
+    this.loadOptionData();
+  },
+  methods: {
+    /**获取下来框数据 */
+    loadOptionData() {
+      getColumnOptions("monitor_year").then((res) => {
+        this.yearOptions = res.data.data.map((item) => {
+          return {
+            label: item,
+            value: item,
+          };
+        });
+        this.reload();
+      });
+    },
+    /* 刷新表格 */
+    reload() {
+      this.$refs.table.reload({
+        where: this.where,
+      });
+    },
+    /* 重置搜索 */
+    reset() {
+      this.reload();
+    },
+    exportFile() {
+      const columns = [
+        {
+          title: "年份",
+          dataIndex: "year",
+        },
+        {
+          title: "网格长（米）",
+          dataIndex: "gridLength",
+        },
+        {
+          title: "网格宽（米）",
+          dataIndex: "gridWidth",
+        },
+        {
+          title: "网格总数",
+          dataIndex: "gridCount",
+        },
+        {
+          title: "时段",
+          dataIndex: "timeSlot",
+        },
+
+        {
+          title: "Leq",
+          dataIndex: "leq",
+        },
+        {
+          title: "L10",
+          dataIndex: "l10",
+        },
+        {
+          title: "L50",
+          dataIndex: "l50",
+        },
+        {
+          title: "L90",
+          dataIndex: "l90",
+        },
+
+        {
+          title: "质量等级",
+          dataIndex: "level",
+        },
+      ];
+
+      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>
\ No newline at end of file