改变结构

添加权限指令

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

@@ -0,0 +1,218 @@
+<template>
+  <div class="ele-body">
+    <a-card :bordered="false">
+      <!-- 搜索表单 -->
+      <a-form :model="where" :labelCol="{ offset: 1}">
+        <a-row>
+          <a-col :lg="6" :md="12" :sm="24" :xs="24">
+            <a-form-item label="统计模块:">
+              <a-select :options="modelOptions" v-model:value="where.model" 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="timeSlotOptions" v-model:value="where.timeSlot" placeholder="昼夜">
+              </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-space>
+            </a-form-item>
+          </a-col>
+
+        </a-row>
+      </a-form>
+      <ele-pro-table ref="table" row-key="id" :datasource="url" :columns="columns" :where="where"
+        :scroll="{x: 'max-content'}">
+      </ele-pro-table>
+    </a-card>
+
+
+  </div>
+</template>
+
+<script>
+  import _ from "lodash";
+  import {pageRoadNoiseStatisticUrl} from "@/api/ecology/road-sound"
+  const columns = [{
+      title: '测点',
+      dataIndex: 'place',
+
+    },
+    {
+      title: '路段',
+      dataIndex: 'road',
+
+    },
+    {
+      title: '城区',
+      dataIndex: 'area',
+    },
+    {
+      title: '路长',
+      dataIndex: 'roadLength',
+      customRender: ({
+        text
+      }) => Math.round(text)
+
+    },
+    {
+      title: '路宽',
+      dataIndex: 'roadWidth',
+      customRender: ({
+        text
+      }) => Math.round(text)
+    },
+    {
+      title: '中小型车流量(辆/20分钟)',
+      dataIndex: 'smallTrafficFlow',
+      customRender: ({
+        text
+      }) => Math.round(text)
+    },
+    {
+      title: '大型车流量(辆/20分钟)',
+      dataIndex: 'largeTrafficFlow',
+      customRender: ({
+        text
+      }) => Math.round(text)
+    },
+    {
+      title: 'Leq',
+      dataIndex: 'leq',
+      customRender: ({
+        text
+      }) => Number(text).toFixed(2)
+    },
+    {
+      title: 'L10',
+      dataIndex: 'l10',
+      customRender: ({
+        text
+      }) => Number(text).toFixed(2)
+    },
+    {
+      title: 'L50',
+      dataIndex: 'l50',
+      customRender: ({
+        text
+      }) => Number(text).toFixed(2)
+    },
+    {
+      title: 'L90',
+      dataIndex: 'l90',
+      customRender: ({
+        text
+      }) => Number(text).toFixed(2)
+    },
+    {
+      title: 'SD',
+      dataIndex: 'sd',
+      customRender: ({
+        text
+      }) => Number(text).toFixed(2)
+    },
+    {
+      title: 'Lmin',
+      dataIndex: 'lmin',
+      customRender: ({
+        text
+      }) => Number(text).toFixed(2)
+    },
+    {
+      title: 'Lmax',
+      dataIndex: 'lmax',
+      customRender: ({
+        text
+      }) => Number(text).toFixed(2)
+    },
+  ]
+  export default {
+    name: 'StatisticSoundRoad',
+    components: {
+
+    },
+    data() {
+      return {
+        url: pageRoadNoiseStatisticUrl,
+        where: {
+          model: "place"
+        },
+        timeScope: [],
+        columns,
+        modelOptions: [{
+          value: "place",
+          label: "测点",
+        }, {
+          value: "road",
+          label: "路段",
+        }, {
+          value: "area",
+          label: "城区",
+        }],
+        timeSlotOptions: [{
+          value: "昼",
+          label: "昼"
+        }, {
+          value: "夜",
+          label: "夜"
+        }]
+
+      };
+    },
+    methods: {
+      /* 刷新表格 */
+      reload() {
+        console.log(this.timeScope[0].format("Y-M-D H:m:s"));
+        this.$refs.table.reload({
+          where: {
+            model: this.where.model,
+            timeStart: this.timeScope ? this.timeScope[0].format("Y-M-D") : null,
+            timeEnd: this.timeScope ? this.timeScope[1].format("Y-M-D") : null,
+            timeSlot: this.where.timeSlot
+          }
+        });
+        let cloneColumns = _.cloneDeep(columns);
+        if (this.where.model == "area") {
+          this.columns = cloneColumns.filter(item => {
+            return item.dataIndex != "place" && item.dataIndex != "road";
+          })
+        } else if (this.where.model == "road") {
+          this.columns = cloneColumns.filter(item => {
+            return item.dataIndex != "place"
+          })
+        }
+      },
+      /* 重置搜索 */
+      reset() {
+        this.where = {
+          model: "place",
+          timeSlot: "昼"
+        };
+        this.this.timeScope = []
+
+        this.reload();
+      },
+    }
+
+  }
+</script>
+
+<style scoped>
+
+</style>