更新

src/views/sound/road/statistic/compare.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="">
-    <ele-pro-table ref="table" row-key="id" :datasource="url" :columns="columns" :where="where" :needPage="false"
-      @done="stableDone" :scroll="{x: 'max-content'}">
+    <ele-pro-table v-if="hisYears.length > 0" ref="table" row-key="id" :datasource="url" :columns="columns"
+      :where="where" :needPage="false" @done="stableDone" :scroll="{x: 'max-content'}" :method="'POST'">
       <template #toolbar>
         <!-- 搜索表单 -->
         <a-form :model="where" layout="inline" :labelCol="{ offset: 1}">
@@ -24,7 +24,14 @@
                 </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 v-model:value="where.valueType" :options="valueTypeOptions" mode="multiple"
+                  placeholder="Please select" style="width: 600px">
+                </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>
@@ -32,7 +39,7 @@
                     </template>
                 </a-range-picker>
               </a-form-item>
-            </a-col>
+            </a-col> -->
 
 
             <a-col :lg="4" :md="12" :sm="24" :xs="24">
@@ -56,52 +63,59 @@
 
 <script>
   // import _ from "lodash";
+  import {
+    ref
+  } from 'vue';
   import XLSX from 'xlsx';
   import {
-    pageRoadNoiseCompare
+    pageRoadNoiseCompare,
+    getHistoryyears
   } from "@/api/ecology/road-sound"
-  const columns = [{
-      title: '测点',
-      dataIndex: 'place',
-
-    },
-    {
-      title: '路段',
-      dataIndex: 'road',
-
-    },
-    {
-      title: '城区',
-      dataIndex: 'area',
-    },
-    {
-      title: '市',
-      dataIndex: 'city',
-    },
-  ]
   export default {
     name: 'StatisticSoundRoadCompare',
-    components: {
-    },
+    components: {},
     data() {
-      const groupModelOptions = [{
-        label: "测点",
-        value: "place"
-      },{
-        label: "城区",
-        value: "area"
-      },{
-        label: "市",
-        value: "city"
-      }];
+      const groupModelOptions = [];
       const groupTimeLengthOptions = [{
-        label: "年",
-        value: "monitor_year"
-      },
-      {
-        label: "季度",
-        value: "quarter"
-      }]
+          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'
+        },
+      ]
       return {
         url: pageRoadNoiseCompare,
         data: [],
@@ -109,12 +123,15 @@
           groupModel: "area",
           groupTimeLength: "monitor_year",
           timeSlot: '昼',
-          reportTimeScope: []
+          reportTimeScope: [],
+          valueType: ['index_Leq']
         },
+        hisYears: [],
         timeScope: [],
-        columns,
+        columns:[],
         groupModelOptions,
         groupTimeLengthOptions,
+        valueTypeOptions: ref(valueTypeOptions),
         timeSlotOptions: [{
           value: "昼",
           label: "昼"
@@ -125,6 +142,11 @@
 
       };
     },
+    mounted() {
+      getHistoryyears().then(res => {
+        this.hisYears = res.data.data
+      })
+    },
     methods: {
       /* 刷新表格 */
       reload() {
@@ -143,42 +165,39 @@
 
         this.reload();
       },
-      reportTimeScopeChange(d,dstr){
-        console.log(d,dstr);
+      reportTimeScopeChange(d, dstr) {
+        console.log(d, dstr);
       },
-      stableDone(){
+      stableDone() {
         const columns = [];
-        if(this.where.groupModel == "area"){
+        if (this.where.groupModel == "area") {
           columns.push({
-            title : "城区",
+            title: "城区",
             dataIndex: "area",
             sorter: true
           })
-        }else if(this.where.groupModel == "place"){
-            columns.push({
-            title : "测点",
+        } else if (this.where.groupModel == "place") {
+          columns.push({
+            title: "测点",
             dataIndex: "area",
             sorter: true
           })
-        }else if(this.where.groupModel == "city"){
-            columns.push({
-            title : "城市",
+        } else if (this.where.groupModel == "city") {
+          columns.push({
+            title: "城市",
             dataIndex: "area",
             sorter: true
           })
         }
-        columns.push({
-            title : "年份",
-            dataIndex: "year",
-            sorter: true
-          })
 
-       if(this.where.groupTimeLength == 'quarter'){
+        if (this.where.groupTimeLength == 'quarter') {
           columns.push({
-            title : "季度",
+            title: "季度",
             dataIndex: "quarter",
             sorter: true,
-            customRender: ({text}) =>{
+            customRender: ({
+              text
+            }) => {
               switch (text) {
                 case 1:
                   return "第一季度";
@@ -196,13 +215,117 @@
           })
         }
 
-        // if(this.where.groupTimeLength == 'monitor_year'){
-          columns.push({
-            title : "Leq",
-            dataIndex: "value",
-            customRender: ({text}) => Number(text).toFixed(2)
 
-          })
+        this.hisYears.forEach(item => {
+          console.log(this.where.valueType)
+          if (this.where.valueType.includes("index_Leq")) {
+            columns.push({
+              title: item + "年Leq",
+              dataIndex: item + "Leq",
+              customRender: ({
+                text
+              }) => {
+                const val = text ? Number(text).toFixed(2) : ''
+                console.log(val)
+                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(2) : ''
+                console.log(val)
+                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(2) : ''
+                console.log(val)
+                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(2) : ''
+                console.log(val)
+                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(2) : ''
+                console.log(val)
+                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(2) : ''
+                console.log(val)
+                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(2) : ''
+                console.log(val)
+                return val;
+              }
+
+            })
+          }
+
+
+
+
+
+
+
+        })
+
         // }
         this.columns = columns;
       },

src/views/sound/road/statistic/index.vue

@@ -43,7 +43,7 @@
     },
     data() {
       return {
-        activeKey: 'base'
+        activeKey: 'year-compare'
       };
         
     },