筛选、导出、弹框优化
This commit is contained in:
weicw
@@ -25,7 +25,7 @@
|
||||
import utils from "./utils";
|
||||
import NoiseBill from "./noise-bill.vue";
|
||||
import PlaceBill from "./place-bill.vue";
|
||||
|
||||
import _ from "lodash";
|
||||
import {
|
||||
saveFunctionNoiseBill,
|
||||
} from "@/api/ecology/function-sound";
|
||||
@@ -47,7 +47,7 @@
|
||||
methods: {
|
||||
/* 导入本地excel文件 */
|
||||
importFile(file) {
|
||||
|
||||
console.log(_._uniqueId("road_noise"));
|
||||
let reader = new FileReader();
|
||||
reader.onload = (e) => {
|
||||
let data = new Uint8Array(e.target.result);
|
||||
@@ -63,7 +63,7 @@
|
||||
let aoa2 = XLSX.utils.sheet_to_json(workbook.Sheets[sheetNames[1]], {
|
||||
header: 1,
|
||||
});
|
||||
|
||||
|
||||
const reportDate = aoa[1][0].replace(/[^\d]+/g, "-")
|
||||
const reportDate2 = new Date();
|
||||
|
||||
|
||||
@@ -12,7 +12,7 @@
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24" :xs="24">
|
||||
<a-form-item label="功能区类别:">
|
||||
<a-select v-model:value="where.functionType" placeholder="选择功能区类型">
|
||||
<a-select v-model:value="where.functionType" placeholder="功能区类别">
|
||||
<a-select-option value="1">1</a-select-option>
|
||||
<a-select-option value="2">2</a-select-option>
|
||||
<a-select-option value="4">3</a-select-option>
|
||||
@@ -177,27 +177,6 @@
|
||||
dataIndex: 'functionType',
|
||||
sorter: true
|
||||
},
|
||||
|
||||
// {
|
||||
// title: '月',
|
||||
// dataIndex: 'monitorMonth',
|
||||
// sorter: true
|
||||
// },
|
||||
// {
|
||||
// title: '日',
|
||||
// dataIndex: 'monitorDay',
|
||||
// sorter: true
|
||||
// },
|
||||
// {
|
||||
// title: '时',
|
||||
// dataIndex: 'monitorHour',
|
||||
// sorter: true
|
||||
// },
|
||||
// {
|
||||
// title: '分',
|
||||
// dataIndex: 'monitorMinute',
|
||||
// sorter: true
|
||||
// },
|
||||
{
|
||||
title: 'LeqdB(A)',
|
||||
dataIndex: 'indexLeq',
|
||||
|
||||
354
src/views/sound/function/statistic/average.vue
Normal file
354
src/views/sound/function/statistic/average.vue
Normal file
@@ -0,0 +1,354 @@
|
||||
<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="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-button @click="exportFile">导出excel</a-button>
|
||||
</a-space>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
<!-- <a-space>
|
||||
|
||||
</a-space> -->
|
||||
</template>
|
||||
</ele-pro-table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import _ from "lodash";
|
||||
import XLSX from 'xlsx';
|
||||
import {
|
||||
pageFunctionNoiseStatisticUrl
|
||||
} from "@/api/ecology/function-sound"
|
||||
const columns = [{
|
||||
title: '点位名称',
|
||||
dataIndex: 'place',
|
||||
|
||||
},
|
||||
{
|
||||
title: "点位编码",
|
||||
dataIndex: "placeCode"
|
||||
},
|
||||
{
|
||||
title: '功能区类别',
|
||||
dataIndex: 'functionType',
|
||||
|
||||
},
|
||||
// {
|
||||
// title: '城区',
|
||||
// dataIndex: 'area',
|
||||
// },
|
||||
// {
|
||||
// title: '市',
|
||||
// dataIndex: 'city',
|
||||
// },
|
||||
{
|
||||
title: 'LeqdB(A)',
|
||||
children: [{
|
||||
title: '平均',
|
||||
dataIndex: 'avgLeq',
|
||||
customRender: ({
|
||||
text
|
||||
}) => Number(text).toFixed(2)
|
||||
},
|
||||
{
|
||||
title: '最大',
|
||||
dataIndex: 'maxLeq',
|
||||
customRender: ({
|
||||
text
|
||||
}) => Number(text).toFixed(2)
|
||||
},
|
||||
{
|
||||
title: '最小',
|
||||
dataIndex: 'minLeq',
|
||||
customRender: ({
|
||||
text
|
||||
}) => Number(text).toFixed(2)
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "SDdB(A)",
|
||||
children: [{
|
||||
title: '平均',
|
||||
dataIndex: 'avgSD',
|
||||
customRender: ({
|
||||
text
|
||||
}) => Number(text).toFixed(2)
|
||||
},
|
||||
{
|
||||
title: '最大',
|
||||
dataIndex: 'maxSD',
|
||||
customRender: ({
|
||||
text
|
||||
}) => Number(text).toFixed(2)
|
||||
},
|
||||
{
|
||||
title: '最小',
|
||||
dataIndex: 'minSD',
|
||||
customRender: ({
|
||||
text
|
||||
}) => Number(text).toFixed(2)
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "L10dB(A)",
|
||||
children: [
|
||||
|
||||
{
|
||||
title: '平均',
|
||||
dataIndex: 'avgL10',
|
||||
customRender: ({
|
||||
text
|
||||
}) => Number(text).toFixed(2)
|
||||
},
|
||||
{
|
||||
title: '最大',
|
||||
dataIndex: 'maxL10',
|
||||
customRender: ({
|
||||
text
|
||||
}) => Number(text).toFixed(2)
|
||||
},
|
||||
{
|
||||
title: '最小',
|
||||
dataIndex: 'minL10',
|
||||
customRender: ({
|
||||
text
|
||||
}) => Number(text).toFixed(2)
|
||||
},
|
||||
]
|
||||
}, {
|
||||
title: 'L50dB(A)',
|
||||
children: [{
|
||||
title: '平均',
|
||||
dataIndex: 'avgL50',
|
||||
customRender: ({
|
||||
text
|
||||
}) => Number(text).toFixed(2)
|
||||
},
|
||||
{
|
||||
title: '最大',
|
||||
dataIndex: 'maxL50',
|
||||
customRender: ({
|
||||
text
|
||||
}) => Number(text).toFixed(2)
|
||||
},
|
||||
{
|
||||
title: '最小',
|
||||
dataIndex: 'minL50',
|
||||
customRender: ({
|
||||
text
|
||||
}) => Number(text).toFixed(2)
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "L90dB(A)",
|
||||
children: [
|
||||
|
||||
{
|
||||
title: '平均',
|
||||
dataIndex: 'avgL90',
|
||||
customRender: ({
|
||||
text
|
||||
}) => Number(text).toFixed(2)
|
||||
},
|
||||
{
|
||||
title: '最大',
|
||||
dataIndex: 'maxL90',
|
||||
customRender: ({
|
||||
text
|
||||
}) => Number(text).toFixed(2)
|
||||
},
|
||||
{
|
||||
title: '最小',
|
||||
dataIndex: 'minL90',
|
||||
customRender: ({
|
||||
text
|
||||
}) => Number(text).toFixed(2)
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "LmindB(A)",
|
||||
children: [{
|
||||
title: '平均',
|
||||
dataIndex: 'avgLmin',
|
||||
customRender: ({
|
||||
text
|
||||
}) => Number(text).toFixed(2)
|
||||
},
|
||||
{
|
||||
title: '最大',
|
||||
dataIndex: 'maxLmin',
|
||||
customRender: ({
|
||||
text
|
||||
}) => Number(text).toFixed(2)
|
||||
},
|
||||
{
|
||||
title: '最小',
|
||||
dataIndex: 'minLmin',
|
||||
customRender: ({
|
||||
text
|
||||
}) => Number(text).toFixed(2)
|
||||
},
|
||||
]
|
||||
}, {
|
||||
title: 'LmaxdB(A)',
|
||||
children: [{
|
||||
title: '平均',
|
||||
dataIndex: 'avgLmax',
|
||||
customRender: ({
|
||||
text
|
||||
}) => Number(text).toFixed(2)
|
||||
},
|
||||
{
|
||||
title: '最大',
|
||||
dataIndex: 'maxLmax',
|
||||
customRender: ({
|
||||
text
|
||||
}) => Number(text).toFixed(2)
|
||||
},
|
||||
{
|
||||
title: '最小',
|
||||
dataIndex: 'minLmax',
|
||||
customRender: ({
|
||||
text
|
||||
}) => Number(text).toFixed(2)
|
||||
},
|
||||
]
|
||||
},
|
||||
|
||||
|
||||
|
||||
]
|
||||
export default {
|
||||
name: 'StatisticSoundFunctionAverage',
|
||||
components: {
|
||||
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
url: pageFunctionNoiseStatisticUrl,
|
||||
data: [],
|
||||
where: {
|
||||
model: "place"
|
||||
},
|
||||
timeScope: [],
|
||||
columns,
|
||||
modelOptions: [{
|
||||
value: "place",
|
||||
label: "测点",
|
||||
}, {
|
||||
value: "function_type",
|
||||
label: "功能区类别",
|
||||
},
|
||||
// {
|
||||
// value: "area",
|
||||
// label: "城区",
|
||||
// },
|
||||
// {
|
||||
// value: "city",
|
||||
// label: "市"
|
||||
// }
|
||||
],
|
||||
timeSlotOptions: [{
|
||||
value: "昼",
|
||||
label: "昼"
|
||||
}, {
|
||||
value: "夜",
|
||||
label: "夜"
|
||||
}]
|
||||
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
/* 刷新表格 */
|
||||
reload() {
|
||||
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
|
||||
}
|
||||
});
|
||||
let cloneColumns = _.cloneDeep(columns);
|
||||
if (this.where.model == "area") {
|
||||
this.columns = cloneColumns.filter(item => {
|
||||
return item.dataIndex != "place" && item.dataIndex != "function";
|
||||
})
|
||||
} else if (this.where.model == "function_type") {
|
||||
this.columns = cloneColumns.filter(item => {
|
||||
return item.dataIndex != "place" && item.dataIndex != "placeCode"
|
||||
})
|
||||
}else if(this.where.model == "city"){
|
||||
this.columns = cloneColumns.filter(item => {
|
||||
return item.dataIndex != "place" && item.dataIndex != "function" && item.dataIndex != "area";
|
||||
})
|
||||
}
|
||||
},
|
||||
/* 重置搜索 */
|
||||
reset() {
|
||||
this.where = {
|
||||
model: "place",
|
||||
timeSlot: "昼"
|
||||
};
|
||||
this.this.timeScope = []
|
||||
|
||||
this.reload();
|
||||
},
|
||||
exportFile() {
|
||||
let array = [
|
||||
['测点', '路段', '城区', '路长', '路宽', '平均Leq', '平均SD']
|
||||
];
|
||||
this.data.forEach(d => {
|
||||
array.push([d.place, d.function, d.area, d.functionLength, d.functionWidth, d.avgLeq, d.avgSD]);
|
||||
});
|
||||
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, '道路交通噪声统计表');
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
376
src/views/sound/function/statistic/base.vue
Normal file
376
src/views/sound/function/statistic/base.vue
Normal file
@@ -0,0 +1,376 @@
|
||||
<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-input v-model:value.trim="where.place" placeholder="请输入测点名称" allow-clear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="6" :md="12" :sm="24" :xs="24">
|
||||
<a-form-item label="功能区类别:">
|
||||
<a-input v-model:value.trim="where.functionType" placeholder="请输入功能区类别" allow-clear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<!-- <a-col :lg="6" :md="12" :sm="24" :xs="24">
|
||||
<a-form-item label="时段">
|
||||
<a-input v-model:value.trim="where.timeSlot" placeholder="请输入时段" allow-clear />
|
||||
</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-space>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
<a-modal v-model:visible="showEdit" :title="form.functionNoiseId!==undefined?'修改用户':'添加用户'" :confirm-loading="loading"
|
||||
:width="1000" :body-style="{paddingBottom: '8px'}" @ok="save">
|
||||
<a-form ref="form" :model="form" :rules="rules" :label-col="{md: {span: 6}, sm: {span: 24}}"
|
||||
:wrapper-col="{md: {span: 18}, sm: {span: 24}}">
|
||||
<a-row>
|
||||
<a-col :md="12" :sm="24">
|
||||
<a-form-item label="日期" name="monitorDate">
|
||||
<a-date-picker v-model:value="form.monitorDate" :locale="locale" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="12" :sm="24">
|
||||
<a-form-item label="时间" name="monitorTime">
|
||||
<a-time-picker v-model:value="form.monitorTime" format="HH:mm" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="12" :sm="24">
|
||||
<a-form-item label="时段" name="timeSlot">
|
||||
<a-select v-model:value="form.timeSlot">
|
||||
<a-select-option value="昼">昼</a-select-option>
|
||||
<a-select-option value="夜">夜</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :md="12" :sm="24">
|
||||
<a-form-item label="测点名称" name="place">
|
||||
<a-input v-model:value="form.place" placeholder="请输入测点名称" allow-clear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="12" :sm="24">
|
||||
<a-form-item label="点号" name="placeCode">
|
||||
<a-input v-model:value="form.placeCode" placeholder="请输入点号" allow-clear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :md="12" :sm="24">
|
||||
<a-form-item label="所属路段" name="function">
|
||||
<a-input v-model:value="form.function" placeholder="请输入测点名称" allow-clear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="12" :sm="24">
|
||||
<a-form-item label="所属城区" name="area">
|
||||
<a-input v-model:value="form.area" placeholder="请输入点号" allow-clear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :md="12" :sm="24">
|
||||
<a-form-item label="路长" name="functionLength">
|
||||
<a-input v-model:value="form.functionLength" placeholder="请输入路长（米）" allow-clear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="12" :sm="24">
|
||||
<a-form-item label="总路宽" name="functionWidth">
|
||||
<a-input v-model:value="form.functionWidth" placeholder="请输入总路宽（米）" allow-clear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="12" :sm="24">
|
||||
<a-form-item label="中小型车流量" name="smallTrafficFlow">
|
||||
<a-input type="number" v-model:value="form.smallTrafficFlow" placeholder="请输入中小型车流量（辆/20分钟）"
|
||||
allow-clear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="12" :sm="24">
|
||||
<a-form-item label="大型车流量" name="largeTrafficFlow">
|
||||
<a-input type="number" v-model:value="form.largeTrafficFlow" placeholder="请输入大型车流量（辆/20分钟）"
|
||||
allow-clear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="12" :sm="24">
|
||||
<a-form-item label="LeqdB(A)" name="indexLeq">
|
||||
<a-input type="number" v-model:value="form.indexLeq" placeholder="请输入LeqdB(A)" allow-clear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="12" :sm="24">
|
||||
<a-form-item label="SDdB(A)" name="indexSd">
|
||||
<a-input type="number" v-model:value="form.indexSd" placeholder="请输入大SDdB(A)" allow-clear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="12" :sm="24">
|
||||
<a-form-item label="L10dB(A)" name="indexL10">
|
||||
<a-input type="number" v-model:value="form.indexL10" placeholder="请输入L10dB(A)" allow-clear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="12" :sm="24">
|
||||
<a-form-item label="L50dB(A)" name="indexL50">
|
||||
<a-input type="number" v-model:value="form.indexL50" placeholder="请输入L50dB(A)" allow-clear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="12" :sm="24">
|
||||
<a-form-item label="L90dB(A)" name="indexL90">
|
||||
<a-input type="number" v-model:value="form.indexL90" placeholder="请输入L90dB(A)" allow-clear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="12" :sm="24">
|
||||
<a-form-item label="LmindB(A)" name="indexLmin">
|
||||
<a-input type="number" v-model:value="form.indexLmin" placeholder="请输入LmindB(A)" allow-clear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="12" :sm="24">
|
||||
<a-form-item label="LmaxdB(A)" name="indexLmax">
|
||||
<a-input type="number" v-model:value="form.indexLmax" placeholder="请输入LmaxdB(A)" allow-clear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
||||
</a-form>
|
||||
|
||||
</a-modal>
|
||||
<!-- 表格 -->
|
||||
<ele-pro-table v-model:selection="selectionList" ref="table" row-key="functionNoiseId" :datasource="url"
|
||||
:columns="columns" :where="where" :scroll="{x: 'max-content'}">
|
||||
</ele-pro-table>
|
||||
</a-card>
|
||||
</div>
|
||||
<!-- 编辑弹窗 -->
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import _ from "lodash"
|
||||
import {
|
||||
pageFunctionNoiseUrl,
|
||||
saveFunctionNoise,
|
||||
removeFunctionNoise,
|
||||
removeBatchFunctionNoise,
|
||||
updateFunctionNoise,
|
||||
} from "@/api/ecology/function-sound";
|
||||
import locale from 'ant-design-vue/es/date-picker/locale/zh_CN';
|
||||
import moment from 'moment';
|
||||
// import utils from "./utils";
|
||||
export default {
|
||||
name: 'StatisticSoundFunctionBase',
|
||||
components: {},
|
||||
data() {
|
||||
|
||||
return {
|
||||
locale,
|
||||
bill:{},
|
||||
// 表格数据接口
|
||||
url: pageFunctionNoiseUrl,
|
||||
selection: [],
|
||||
// 表格列配置
|
||||
columns: [
|
||||
{
|
||||
title: '监测日期',
|
||||
dataIndex: 'monitorTime',
|
||||
sorter: true
|
||||
},
|
||||
{
|
||||
title: '点位名称',
|
||||
dataIndex: 'place',
|
||||
sorter: true
|
||||
},
|
||||
{
|
||||
title: '点位编码',
|
||||
dataIndex: 'placeCode',
|
||||
sorter: true
|
||||
},
|
||||
{
|
||||
title: '功能区类别',
|
||||
dataIndex: 'functionType',
|
||||
sorter: true
|
||||
},
|
||||
{
|
||||
title: '时段',
|
||||
dataIndex: 'timeSlot',
|
||||
sorter: true
|
||||
},
|
||||
{
|
||||
title: 'LeqdB(A)',
|
||||
dataIndex: 'indexLeq',
|
||||
sorter: true
|
||||
},
|
||||
{
|
||||
title: 'SDdB(A)',
|
||||
dataIndex: 'indexSd',
|
||||
sorter: true
|
||||
},
|
||||
{
|
||||
title: 'L10dB(A)',
|
||||
dataIndex: 'indexL10',
|
||||
sorter: true
|
||||
},
|
||||
{
|
||||
title: 'L50dB(A)',
|
||||
dataIndex: 'indexL50',
|
||||
sorter: true
|
||||
},
|
||||
{
|
||||
title: 'L90dB(A)',
|
||||
dataIndex: 'indexL90',
|
||||
sorter: true
|
||||
},
|
||||
{
|
||||
title: 'LmindB(A)',
|
||||
dataIndex: 'indexLmin',
|
||||
sorter: true
|
||||
},
|
||||
{
|
||||
title: 'LmaxdB(A)',
|
||||
dataIndex: 'indexLmax',
|
||||
sorter: true
|
||||
},
|
||||
{
|
||||
title: '创建人',
|
||||
dataIndex: 'username',
|
||||
sorter: true
|
||||
},
|
||||
],
|
||||
// 表格搜索条件
|
||||
where: {
|
||||
checked: 1
|
||||
},
|
||||
// 表格选中数据
|
||||
selectionList: [],
|
||||
// 是否显示编辑弹窗
|
||||
showEdit: false,
|
||||
// 表单数据
|
||||
form: {},
|
||||
loading: false,
|
||||
rules: {}
|
||||
|
||||
};
|
||||
},
|
||||
mounted(){
|
||||
|
||||
},
|
||||
methods: {
|
||||
/* 刷新表格 */
|
||||
reload() {
|
||||
|
||||
this.$refs.table.reload({
|
||||
where: this.where
|
||||
});
|
||||
},
|
||||
/* 重置搜索 */
|
||||
reset() {
|
||||
this.where = {
|
||||
checked: 1
|
||||
};
|
||||
this.reload();
|
||||
},
|
||||
/* 显示编辑 */
|
||||
openEdit(record) {
|
||||
const cloneRecord = _.cloneDeep(record)
|
||||
if (record && cloneRecord.monitorTime) {
|
||||
console.log(moment(cloneRecord.monitorTime).format('YYYY MM DD'));
|
||||
cloneRecord.monitorDate = moment(cloneRecord.monitorTime);
|
||||
cloneRecord.monitorTime = moment(cloneRecord.monitorTime);
|
||||
}
|
||||
// cloneRecord.mi
|
||||
this.form = Object.assign({}, cloneRecord);
|
||||
this.showEdit = true;
|
||||
this.$nextTick(() => {
|
||||
this.$refs.form.clearValidate(); // 清除表单验证信息
|
||||
});
|
||||
},
|
||||
|
||||
save() {
|
||||
const hide = this.$message.loading('请求中..', 0);
|
||||
const form = _.cloneDeep(this.form);
|
||||
const date = new Date();
|
||||
date.setFullYear(form.monitorDate.year());
|
||||
date.setMonth(form.monitorDate.month());
|
||||
date.setDate(form.monitorDate.date());
|
||||
date.setHours(form.monitorTime.hour());
|
||||
date.setMinutes(form.monitorTime.minutes());
|
||||
form.monitorTime = date.getTime();
|
||||
form.monitorYear = date.getFullYear();
|
||||
form.monitorMonth = date.getMonth() + 1;
|
||||
form.monitorDay = date.getDate();
|
||||
form.monitorHour = date.getHours();
|
||||
form.monitorMinute = date.getMinutes();
|
||||
delete form['monitorDate']
|
||||
if (form.functionNoiseId) {
|
||||
updateFunctionNoise(form).then(res => {
|
||||
if (res.data.code == 0) {
|
||||
this.showEdit = false;
|
||||
this.$message.success(res.data.msg);
|
||||
this.reload();
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
}).catch((error)=>{
|
||||
this.$message.error(error.message);
|
||||
}).finally(()=>{
|
||||
console.log("finallyfinallyfinallyfinally");
|
||||
hide();
|
||||
})
|
||||
}else{
|
||||
form.functionNoiseBillId = this.functionNoiseBillId;
|
||||
saveFunctionNoise(form).then(res => {
|
||||
if (res.data.code == 0) {
|
||||
this.showEdit = false;
|
||||
this.$message.success(res.data.msg);
|
||||
this.reload();
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
}).catch((error)=>{
|
||||
this.$message.error(error.message);
|
||||
}).finally(()=>{
|
||||
hide();
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
},
|
||||
/* 删除单个 */
|
||||
remove(row) {
|
||||
const hide = this.$message.loading('请求中..', 0);
|
||||
removeFunctionNoise(row.functionNoiseId).then(res => {
|
||||
if (res.data.code === 0) {
|
||||
this.$message.success(res.data.msg);
|
||||
this.reload();
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
}).catch(e => {
|
||||
this.$message.error(e.msg);
|
||||
}).finally(() => hide());
|
||||
},
|
||||
removeBatch() {
|
||||
const ids = this.selectionList.map(item => item.functionNoiseId);
|
||||
const hide = this.$message.loading('请求中..', 0);
|
||||
removeBatchFunctionNoise(ids).then(res => {
|
||||
if (res.data.code === 0) {
|
||||
this.$message.success(res.data.msg);
|
||||
this.reload();
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
}).catch(e => {
|
||||
|
||||
this.$message.error(e.msg);
|
||||
}).finally(() => hide());
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
|
||||
</style>
|
||||
476
src/views/sound/function/statistic/compare.vue
Normal file
476
src/views/sound/function/statistic/compare.vue
Normal file
@@ -0,0 +1,476 @@
|
||||
<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 {
|
||||
pageFunctionNoiseCompare,
|
||||
getHistoryyears,
|
||||
} from "@/api/ecology/function-sound";
|
||||
export default {
|
||||
name: "StatisticSoundFunctionCompare",
|
||||
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: pageFunctionNoiseCompare,
|
||||
data: [],
|
||||
where: {
|
||||
groupModel: "area",
|
||||
groupTimeLength: "monitor_year",
|
||||
reportTimeScope: [],
|
||||
valueType: ["index_Leq"],
|
||||
timeRange: [],
|
||||
},
|
||||
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 = {
|
||||
model: "place",
|
||||
};
|
||||
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",
|
||||
});
|
||||
columns.push({
|
||||
title: item + "年第二季度Leq",
|
||||
dataIndex: item + "2" + "Leq",
|
||||
});
|
||||
columns.push({
|
||||
title: item + "年第三季度Leq",
|
||||
dataIndex: item + "3" + "Leq",
|
||||
});
|
||||
columns.push({
|
||||
title: item + "年第四季度Leq",
|
||||
dataIndex: item + "4" + "Leq",
|
||||
});
|
||||
columns.push({
|
||||
title: item + "年第一季度SD",
|
||||
dataIndex: item + "1" + "Sd",
|
||||
});
|
||||
columns.push({
|
||||
title: item + "年第二季度SD",
|
||||
dataIndex: item + "2" + "Sd",
|
||||
});
|
||||
columns.push({
|
||||
title: item + "年第三季度SD",
|
||||
dataIndex: item + "3" + "Sd",
|
||||
});
|
||||
columns.push({
|
||||
title: item + "年第四季度SD",
|
||||
dataIndex: item + "4" + "Sd",
|
||||
});
|
||||
columns.push({
|
||||
title: item + "年第一季度L10",
|
||||
dataIndex: item + "1" + "L10",
|
||||
});
|
||||
columns.push({
|
||||
title: item + "年第二季度L10",
|
||||
dataIndex: item + "2" + "L10",
|
||||
});
|
||||
columns.push({
|
||||
title: item + "年第三季度L10",
|
||||
dataIndex: item + "3" + "L10",
|
||||
});
|
||||
columns.push({
|
||||
title: item + "年第四季度L10",
|
||||
dataIndex: item + "4" + "L10",
|
||||
});
|
||||
columns.push({
|
||||
title: item + "年第一季度L50",
|
||||
dataIndex: item + "1" + "L50",
|
||||
});
|
||||
columns.push({
|
||||
title: item + "年第二季度L50",
|
||||
dataIndex: item + "2" + "L50",
|
||||
});
|
||||
columns.push({
|
||||
title: item + "年第三季度L50",
|
||||
dataIndex: item + "3" + "L50",
|
||||
});
|
||||
columns.push({
|
||||
title: item + "年第四季度L50",
|
||||
dataIndex: item + "4" + "L50",
|
||||
});
|
||||
columns.push({
|
||||
title: item + "年第一季度L90",
|
||||
dataIndex: item + "1" + "L90",
|
||||
});
|
||||
columns.push({
|
||||
title: item + "年第二季度L90",
|
||||
dataIndex: item + "2" + "L90",
|
||||
});
|
||||
columns.push({
|
||||
title: item + "年第三季度L90",
|
||||
dataIndex: item + "3" + "L90",
|
||||
});
|
||||
columns.push({
|
||||
title: item + "年第四季度L90",
|
||||
dataIndex: item + "4" + "L90",
|
||||
});
|
||||
columns.push({
|
||||
title: item + "年第一季度Lmin",
|
||||
dataIndex: item + "1" + "Lmin",
|
||||
});
|
||||
columns.push({
|
||||
title: item + "年第二季度Lmin",
|
||||
dataIndex: item + "2" + "Lmin",
|
||||
});
|
||||
columns.push({
|
||||
title: item + "年第三季度Lmin",
|
||||
dataIndex: item + "3" + "Lmin",
|
||||
});
|
||||
columns.push({
|
||||
title: item + "年第四季度Lmin",
|
||||
dataIndex: item + "4" + "Lmin",
|
||||
});
|
||||
columns.push({
|
||||
title: item + "年第一季度Lmax",
|
||||
dataIndex: item + "1" + "Lmax",
|
||||
});
|
||||
columns.push({
|
||||
title: item + "年第二季度Lmax",
|
||||
dataIndex: item + "2" + "Lmax",
|
||||
});
|
||||
columns.push({
|
||||
title: item + "年第三季度Lmax",
|
||||
dataIndex: item + "3" + "Lmax",
|
||||
});
|
||||
columns.push({
|
||||
title: item + "年第四季度Lmax",
|
||||
dataIndex: item + "4" + "Lmax",
|
||||
});
|
||||
} else {
|
||||
if (this.where.valueType.includes("index_Leq")) {
|
||||
columns.push({
|
||||
title: item + "年Leq",
|
||||
dataIndex: item + "Leq",
|
||||
customRender: ({ text }) => {
|
||||
const val = text ? Number(text).toFixed(2) : "";
|
||||
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) : "";
|
||||
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) : "";
|
||||
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) : "";
|
||||
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) : "";
|
||||
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) : "";
|
||||
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) : "";
|
||||
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>
|
||||
56
src/views/sound/function/statistic/index.vue
Normal file
56
src/views/sound/function/statistic/index.vue
Normal file
@@ -0,0 +1,56 @@
|
||||
<template>
|
||||
<div class="ele-body">
|
||||
<a-card :bordered="false">
|
||||
<a-tabs v-model:activeKey="activeKey">
|
||||
<a-tab-pane key="base" tab="总览">
|
||||
<base-statistic></base-statistic>
|
||||
</a-tab-pane>
|
||||
<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> -->
|
||||
</a-tabs>
|
||||
</a-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/**
|
||||
*
|
||||
*
|
||||
*
|
||||
*/
|
||||
import BaseStatistic from "./base.vue";
|
||||
// import QuarterStatistic from "./quarter.vue";
|
||||
// import Compare from "./compare.vue"
|
||||
import AverageStatistic from "./average.vue"
|
||||
|
||||
export default {
|
||||
name: 'StatisticSoundFunction',
|
||||
components: {
|
||||
BaseStatistic,
|
||||
// QuarterStatistic,
|
||||
// Compare,
|
||||
AverageStatistic
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
activeKey: 'year-compare'
|
||||
};
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
Reference in New Issue
Block a user