gxwebsoft/jczxw-java
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

gis,酸雨

Browse Source
This commit is contained in:
weicw
2021-09-01 04:58:49 +08:00
parent ab71482bae
commit cb8fc96527
20 changed files with 37128 additions and 1312 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3434
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

1
package.json
View File

@@ -11,6 +11,7 @@
},
"dependencies": {
"@antv/l7": "^2.5.8",
"@antv/l7-district": "^2.3.11",
"@antv/l7-maps": "^2.5.8",
"@tinymce/tinymce-vue": "~4.0.4",
"ant-design-vue": "~2.2.2",

78
src/api/ecology/acid.js
View File

@@ -1,77 +1,77 @@
import axios from 'axios';
// ----------------------列表-----------------------
const pageBillUrl = '/acidRain/acidBill/page';
const pageBillUrl = '/acidRain/acidRainBill/page';
// 添加
const saveAcidBill = function (data) {
return axios.post("/acidRain/acidBill",data)
const saveAcidRainBill = function (data) {
return axios.post("/acidRain/acidRainBill/batch",data)
}
// 删除
const removeAcidBill = function (id) {
return axios.delete(`/acidRain/acidBill/${id}`,)
const removeAcidRainBill = function (id) {
return axios.delete(`/acidRain/acidRainBill/${id}`,)
}
// 批量删除
const removeBatchAcidBill = function (ids) {
return axios.delete("/acidRain/acidBill/batch",{data:ids})
const removeBatchAcidRainBill = function (ids) {
return axios.delete("/acidRain/acidRainBill/batch",{data:ids})
}
// 修改
const updateAcidBill = function (data) {
return axios.put("/acidRain/acidBill",data)
const updateAcidRainBill = function (data) {
return axios.put("/acidRain/acidRainBill",data)
}
// 审核
const verifyAcidBill = function (data) {
return axios.put("/acidRain/acidBill/verify",data);
const verifyAcidRainBill = function (data) {
return axios.put("/acidRain/acidRainBill/verify",data);
}
const getAcidBill = function (id) {
return axios.get(`/acidRain/acidBill/${id}`)
const getAcidRainBill = function (id) {
return axios.get(`/acidRain/acidRainBill/${id}`)
}
// -------------------------数据---------------------
const pageAcidUrl = '/acidRain/acid/page';
const pageAcidRainUrl = '/acidRain/acidRain/page';
// 添加
const saveAcid = function (data) {
return axios.post("/acidRain/acid",data)
const saveAcidRain = function (data) {
return axios.post("/acidRain/acidRain",data)
}
// 删除
const removeAcid = function (id) {
return axios.delete(`/acidRain/acid/${id}`,)
const removeAcidRain = function (id) {
return axios.delete(`/acidRain/acidRain/${id}`,)
}
// 批量删除
const removeBatchAcid = function (ids) {
return axios.delete("/acidRain/acid/batch",{data:ids})
const removeBatchAcidRain = function (ids) {
return axios.delete("/acidRain/acidRain/batch",{data:ids})
}
// 修改
const updateAcid = function (data) {
return axios.put("/acidRain/acid",data)
const updateAcidRain = function (data) {
return axios.put("/acidRain/acidRain",data)
}
// -------------------------统计---------------------
const pageAcidStatisticUrl = '/acidRain/acid/statistic';
const statisticSourceUrl = '/acidRain/acid/statistic/source';
const statisticYearUrl = '/acidRain/acid/statistic/year';
const pageAcidRainStatisticUrl = '/acidRain/acidRain/statistic';
const statisticSourceUrl = '/acidRain/acidRain/statistic/source';
const statisticYearUrl = '/acidRain/acidRain/statistic/year';
const getHistoryyears = function () {
return axios.get("/acidRain/acid/history-year")
return axios.get("/acidRain/acidRain/history-year")
}
const getColumnOptions = function(column){
return axios.get("/acidRain/acid/options",{params:{column}})
return axios.get("/acidRain/acidRain/options",{params:{column}})
}
export {
pageBillUrl,
saveAcidBill,
removeAcidBill,
updateAcidBill,
removeBatchAcidBill,
verifyAcidBill,
getAcidBill,
pageAcidUrl,
saveAcid,
removeAcid,
updateAcid,
removeBatchAcid,
pageAcidStatisticUrl,
saveAcidRainBill,
removeAcidRainBill,
updateAcidRainBill,
removeBatchAcidRainBill,
verifyAcidRainBill,
getAcidRainBill,
pageAcidRainUrl,
saveAcidRain,
removeAcidRain,
updateAcidRain,
removeBatchAcidRain,
pageAcidRainStatisticUrl,
getHistoryyears,
getColumnOptions,
statisticSourceUrl,

11
src/api/ecology/function-sound.js
View File

@@ -55,6 +55,13 @@ const getHistoryyears = function () {
const getColumnOptions = function(column){
return axios.get("/sound/function/noise/options",{params:{column}})
}
const getGisBase = function(data){
return axios.get("/sound/function/noise/gis",{params:data})
}
const getGisArea = function(data){
return axios.get("/sound/function/noise/gis/area",{params:data})
}
export {
pageBillUrl,
saveFunctionNoiseBill,
@@ -70,6 +77,8 @@ export {
removeBatchFunctionNoise,
pageFunctionNoiseStatisticUrl,
getHistoryyears,
getColumnOptions
getColumnOptions,
getGisBase,
getGisArea
}

12
src/api/ecology/road-sound.js
View File

@@ -62,6 +62,14 @@ const getHistoryyears = function () {
const getColumnOptions = function(column){
return axios.get("/sound/road/noise/options",{params:{column}})
}
const getGisBase = function(data){
return axios.get("/sound/road/noise/gis",{params:data})
}
const getGisArea = function(data){
return axios.get("/sound/road/noise/gis/area",{params:data})
}
export {
pageBillUrl,
saveRoadNoiseBill,
@@ -79,6 +87,8 @@ export {
getHistoryyears,
pageRoadNoiseCompare,
getColumnOptions,
listAll
listAll,
getGisBase,
getGisArea
}

16353
src/assets/450100.js Normal file
View File

File diff suppressed because it is too large Load Diff

16353
src/utils/450100.js Normal file
View File

File diff suppressed because it is too large Load Diff

117
src/views/atmosphere/acid-rain/collect/index.vue
View File

@@ -8,7 +8,7 @@
:showUploadList="false"
accept=".xls,.xlsx,.csv"
>
<a-button>市级导入</a-button>
<a-button>数据导入</a-button>
</a-upload>
<!-- <a-upload
:before-upload="importFileArea"
@@ -20,8 +20,8 @@
</a-space>
</template>
<a-tabs v-model:activeKey="activeKey">
<a-tab-pane tab="噪声信息" key="noise">
<noise-bill ref="noise"></noise-bill>
<a-tab-pane tab="降水信息" key="rain">
<rain-bill ref="rain"></rain-bill>
</a-tab-pane>
</a-tabs>
</a-card>
@@ -32,16 +32,16 @@
import XLSX from "xlsx";
import utils from "./utils";
import { Modal } from "ant-design-vue";
import NoiseBill from "./noise-bill.vue";
import { saveAcidBill } from "@/api/ecology/acid";
import RainBill from "./rain-bill.vue";
import { saveAcidRainBill } from "@/api/ecology/acid";
export default {
name: "ZoneCollectIndex",
name: "RainCollectIndex",
components: {
NoiseBill,
RainBill,
},
data() {
return {
activeKey: "noise",
activeKey: "rain",
};
},
methods: {
@@ -62,32 +62,31 @@ export default {
let aoa = XLSX.utils.sheet_to_json(workbook.Sheets[sheetNames[0]], {
header: 1,
});
let aoa2 = XLSX.utils.sheet_to_json(workbook.Sheets[sheetNames[1]], {
header: 1,
// let aoa2 = XLSX.utils.sheet_to_json(workbook.Sheets[sheetNames[1]], {
// header: 1,
// });
// const reportDate = aoa[2][0].replace(/[^\d]+/g, "-");
// const reportDate2 = aoa2[1][0].replace(/[^\d]+/g, "-");
const acidList = aoa.filter((item) => {
return item.length >= 23 && typeof item[0] == "number";
});
const reportDate = aoa[1][0].replace(/[^\d]+/g, "-");
const reportDate2 = aoa2[1][0].replace(/[^\d]+/g, "-");
const acidList = aoa.filter(
(item) => {
return item.length >= 26 && typeof item[0] == "number"}
);
const acidList2 = aoa2.filter(
(item) => item.length >= 26 && typeof item[0] == "number"
);
// const acidList2 = aoa2.filter(
// (item) => item.length >= 26 && typeof item[0] == "number"
// );
// 解析成对象数组
const billName = aoa[0][0];
const billName = aoa[0][0] + aoa[1][0];
const billData = utils.toObjData(acidList);
const billName2 = aoa2[0][0];
const billData2 = utils.toObjData(acidList2);
// const billName2 = aoa2[0][0];
// const billData2 = utils.toObjData(acidList2);
if (
(!billData || billData.length == 0) &&
(!billData2 || billData2.length == 0)
!billData ||
billData.length == 0
// (!billData2 || billData2.length == 0)
) {
hide()
hide();
Modal.error({
title: "导入失败",
content: "找不到数据",
@@ -98,35 +97,42 @@ export default {
const tasks = [];
if (billData.length > 0) {
tasks.push(
saveAcidBill({
reportTime: new Date(reportDate).getTime(),
saveAcidRainBill({
// reportTime: new Date(reportDate).getTime(),
billName: billName,
regionLevel: "市级",
acidList: billData,
acidRainList: billData,
})
);
}
if (billData2.length > 0) {
tasks.push(
saveAcidBill({
reportTime: new Date(reportDate2).getTime(),
billName: billName2,
regionLevel: "市级",
acidList: billData2,
})
);
}
// if (billData2.length > 0) {
// tasks.push(
// saveAcidRainBill({
// reportTime: new Date(reportDate2).getTime(),
// billName: billName2,
// regionLevel: "市级",
// acidList: billData2,
// })
// );
// }
// 上传到服务器
Promise.all(tasks)
.then(() => {
Modal.success({
title: "导入成功",
content: `成功导入${billData.length + billData2.length}条数据`,
});
this.$refs.noise && this.$refs.noise.reload();
.then((res) => {
if (res[0].data.code == 0) {
Modal.success({
title: "导入成功",
content: `成功导入${billData.length}条数据`,
});
this.$refs.rain && this.$refs.rain.reload();
} else {
Modal.error({
title: "导入失败",
content: "数据上传出错",
});
}
})
.catch(() => {
Modal.error({
@@ -169,12 +175,9 @@ export default {
});
const reportDate = aoa[1][0].replace(/[^\d]+/g, "-");
const acidList = aoa.filter(
(item) => {
return item.length >= 35 && item[0] != "行政区划代码"
}
);
const acidList = aoa.filter((item) => {
return item.length >= 35 && item[0] != "行政区划代码";
});
// 解析成对象数组
const billName = aoa[0][0];
@@ -192,7 +195,7 @@ export default {
if (billData.length > 0) {
// 上传到服务器
saveAcidBill({
saveAcidRainBill({
reportTime: new Date(reportDate).getTime(),
billName: billName,
regionLevel: "县级",
@@ -202,11 +205,9 @@ export default {
if (res.data.code == 0) {
Modal.success({
title: "导入成功",
content: `成功导入${
billData.length
}条数据`,
content: `成功导入${billData.length}条数据`,
});
this.$refs.noise && this.$refs.noise.reload();
this.$refs.rain && this.$refs.rain.reload();
} else {
Modal.error({
title: "导入失败",

88
src/views/atmosphere/acid-rain/collect/noise-bill.vue → src/views/atmosphere/acid-rain/collect/rain-bill.vue
View File

@@ -1,7 +1,7 @@
<template>
<div>
<!-- 表格 -->
<ele-pro-table v-model:selection="selectionList" ref="table" row-key="zoneNoiseBillId" :datasource="url"
<ele-pro-table v-model:selection="selectionList" ref="table" row-key="acidRainBillId" :datasource="url"
:columns="columns" :where="where" :scroll="{x: 'max-content'}">
<template #toolbar>
@@ -44,8 +44,8 @@
</template>
<template #billName="{ text, record }">
<div class="editable-cell">
<div v-if="editableData[record.zoneNoiseBillId]" class="editable-cell-input-wrapper">
<a-input v-model:value="editableData[record.zoneNoiseBillId].billName" @pressEnter="save(record)" />
<div v-if="editableData[record.acidRainBillId]" class="editable-cell-input-wrapper">
<a-input v-model:value="editableData[record.acidRainBillId].billName" @pressEnter="save(record)" />
<check-outlined class="editable-cell-icon-check" @click="save(record)" />
</div>
<div v-else class="editable-cell-text-wrapper">
@@ -56,9 +56,9 @@
</template>
<template #reportTime="{ text, record }">
<div class="editable-cell">
<div v-if="editableData[record.zoneNoiseBillId]" class="editable-cell-input-wrapper">
<a-date-picker v-model:value="editableData[record.zoneNoiseBillId].reportTime"></a-date-picker>
<!-- <a-input v-model:value="editableData[record.zoneNoiseBillId].reportTime" @pressEnter="save(record)" /> -->
<div v-if="editableData[record.acidRainBillId]" class="editable-cell-input-wrapper">
<a-date-picker v-model:value="editableData[record.acidRainBillId].reportTime"></a-date-picker>
<!-- <a-input v-model:value="editableData[record.acidRainBillId].reportTime" @pressEnter="save(record)" /> -->
<check-outlined class="editable-cell-icon-check" @click="save(record)" />
</div>
<div v-else class="editable-cell-text-wrapper">
@@ -106,15 +106,15 @@
import { Modal } from 'ant-design-vue';
import {
pageBillUrl,
// saveZoneNoiseBill,
removeZoneNoiseBill,
removeBatchZoneNoiseBill,
updateZoneNoiseBill,
verifyZoneNoiseBill
} from "@/api/ecology/zone-sound";
// saveRainBill,
removeAcidRainBill,
removeBatchAcidRainBill,
updateAcidRainBill,
verifyAcidRainBill
} from "@/api/ecology/acid";
import moment from "moment";
export default {
name: 'ZoneCollectNoiseBill',
name: 'RainCollectNoiseBill',
components: {
CheckOutlined,
EditOutlined
@@ -144,11 +144,11 @@
},
},
{
title: '区域等级',
dataIndex: 'regionLevel',
sorter: true,
},
// {
// title: '区域等级',
// dataIndex: 'regionLevel',
// sorter: true,
// },
{
title: '条目',
dataIndex: 'recordSize',
@@ -160,17 +160,17 @@
// dataIndex: 'title',
// sorter: true
// },
{
title: '上报时间',
dataIndex: 'reportTime',
sorter: true,
slots: {
customRender: 'reportTime',
},
// customRender: ({
// text
// }) => this.$util.toDateString(text)
},
// {
// title: '上报时间',
// dataIndex: 'reportTime',
// sorter: true,
// slots: {
// customRender: 'reportTime',
// },
// // customRender: ({
// // text
// // }) => this.$util.toDateString(text)
// },
{
title: '导入时间',
dataIndex: 'createTime',
@@ -190,7 +190,7 @@
},
{
title: '创建人',
dataIndex: 'username',
dataIndex: 'userName',
sorter: true,
},
@@ -245,18 +245,18 @@
},
detail(record) {
this.$router.replace({
path: "/sound/zone/collect/noise/" + record.zoneNoiseBillId
path: "/atmosphere/acid-rain/collect/rain/" + record.acidRainBillId
})
},
edit(record) {
this.editableData[record.zoneNoiseBillId] = _.cloneDeep(record);
this.editableData[record.zoneNoiseBillId].reportTime = moment(this.editableData[record.zoneNoiseBillId]
this.editableData[record.acidRainBillId] = _.cloneDeep(record);
this.editableData[record.acidRainBillId].reportTime = moment(this.editableData[record.acidRainBillId]
.reportTime)
},
verify(record,checked) {
const hide = this.$message.loading('请求中..', 0);
verifyZoneNoiseBill({
zoneNoiseBillId: record.zoneNoiseBillId,
verifyAcidRainBill({
acidRainBillId: record.acidRainBillId,
checked
}).then(res => {
if (res.data.code == 0) {
@@ -280,19 +280,19 @@
save(record) {
let {
zoneNoiseBillId,
acidRainBillId,
billName,
reportTime
} = this.editableData[record.zoneNoiseBillId];
if (!zoneNoiseBillId || !reportTime) {
} = this.editableData[record.acidRainBillId];
if (!acidRainBillId || !reportTime) {
this.$message.error('请填写完整信息再提交')
return
}
const hide = this.$message.loading('请求中..', 0);
reportTime = reportTime.format("x")
reportTime = Number(reportTime)
updateZoneNoiseBill({
zoneNoiseBillId,
updateAcidRainBill({
acidRainBillId,
billName,
reportTime
}).then(res => {
@@ -307,7 +307,7 @@
console.log(e);
this.$message.error(e.message);
}).finally(() => {
delete this.editableData[record.zoneNoiseBillId]
delete this.editableData[record.acidRainBillId]
hide()
})
@@ -315,7 +315,7 @@
/* 删除单个 */
remove(row) {
const hide = this.$message.loading('请求中..', 0);
removeZoneNoiseBill(row.zoneNoiseBillId).then(res => {
removeAcidRainBill(row.acidRainBillId).then(res => {
if (res.data.code === 0) {
this.$message.success(res.data.msg);
this.reload();
@@ -327,9 +327,9 @@
}).finally(() => hide());
},
removeBatch() {
const ids = this.selectionList.map(item => item.zoneNoiseBillId);
const ids = this.selectionList.map(item => item.acidRainBillId);
const hide = this.$message.loading('请求中..', 0);
removeBatchZoneNoiseBill(ids).then(res => {
removeBatchAcidRainBill(ids).then(res => {
if (res.data.code === 0) {
this.$message.success(res.data.msg);
this.reload();

382
src/views/atmosphere/acid-rain/collect/noise.vue → src/views/atmosphere/acid-rain/collect/rain.vue
View File

@@ -42,7 +42,7 @@
</a-form>
<a-modal
v-model:visible="showEdit"
:title="form.zoneNoiseId !== undefined ? '修改记录' : '添加记录'"
:title="form.acidRainId !== undefined ? '修改记录' : '添加记录'"
:confirm-loading="loading"
:width="1000"
:body-style="{ paddingBottom: '8px' }"
@@ -81,176 +81,6 @@
/>
</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="zoneLength">
<a-input
v-model:value="form.gridLength"
placeholder="请输入网格长（米）"
allow-clear
/>
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-item label="网格宽" name="zoneWidth">
<a-input
v-model:value="form.gridWidth"
placeholder="请输入网格宽（米）"
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-col :md="12" :sm="24">
<a-form-item label="监测站名" name="station">
<a-input
v-model:value="form.station"
placeholder="请输入监测站名"
allow-clear
/>
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-item label="监测仪器型号" name="monitorInstrumentModel">
<a-input
v-model:value="form.monitorInstrumentModel"
placeholder="请输入监测仪器型号"
allow-clear
/>
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-item label="监测仪器编号" name="monitorInstrumentCode">
<a-input
v-model:value="form.monitorInstrumentCode"
placeholder="请输入监测仪器编号"
allow-clear
/>
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-item label="监测前校准值" name="beforeMonitorValue">
<a-input
v-model:value="form.beforeMonitorValue"
placeholder="请输入监测前校准值"
allow-clear
/>
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-item label="监测后校准值" name="afterMonitorValue">
<a-input
v-model:value="form.afterMonitorValue"
placeholder="请输入监测后校准值"
allow-clear
/>
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-item label="声校准器测量声压值" name="soundPressureValue">
<a-input
v-model:value="form.soundPressureValue"
placeholder="请输入声校准器测量声压值"
allow-clear
/>
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-item label="声校准仪器型号" name="soundInstrumentModel">
<a-input
v-model:value="form.soundInstrumentModel"
placeholder="请输入声校准仪器型号"
allow-clear
/>
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-item label="声校准仪器编号" name="soundInstrumentCode">
<a-input
v-model:value="form.soundInstrumentCode"
placeholder="请输入声校准仪器编号"
allow-clear
/>
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-item label="备注" name="remark">
<a-input
@@ -267,7 +97,7 @@
<ele-pro-table
v-model:selection="selectionList"
ref="table"
row-key="zoneNoiseId"
row-key="acidRainId"
:datasource="url"
:columns="columns"
:where="where"
@@ -294,13 +124,8 @@
</a-space>
</template>
<template #Leq="{ text,record }">
<a-tag v-if="(record.timeSlot == '昼' && text <= 68) || (record.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 #Address="{ record }">
{{record.area?record.area:record.county?record.county:record.city}}
</template>
<template #action="{ record }">
@@ -333,14 +158,14 @@
<script>
import _ from "lodash";
import {
pageZoneNoiseUrl,
saveZoneNoise,
removeZoneNoise,
removeBatchZoneNoise,
updateZoneNoise,
getZoneNoiseBill,
pageAcidRainUrl,
saveAcidRain,
removeAcidRain,
removeBatchAcidRain,
updateAcidRain,
getAcidRainBill,
getColumnOptions,
} from "@/api/ecology/zone-sound";
} from "@/api/ecology/acid";
import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
import moment from "moment";
// import utils from "./utils";
@@ -354,147 +179,112 @@ export default {
locale,
bill: {},
// 表格数据接口
url: pageZoneNoiseUrl,
url: pageAcidRainUrl,
selection: [],
// 表格列配置
columns: [
{
title: "监测日期",
dataIndex: "monitorTime",
title: "采样开始时间",
dataIndex: "monitorStartTime",
sorter: true,
customRender: ({text})=> moment(text,"YYYY/MM/DD HH:mm:ss").format("YYYY-MM-DD HH:mm")
},
{
title: "采样结束时间",
dataIndex: "monitorEndTime",
sorter: true,
customRender: ({text})=> moment(text,"YYYY/MM/DD HH:mm:ss").format("YYYY-MM-DD HH:mm")
},
{
title: "行政代码",
dataIndex: "regionCode",
sorter: true,
},
{
title: "测点名称",
title: "市(县，区)",
slots: {customRender: "Address"},
},
{
title: "采样点",
dataIndex: "place",
sorter: true,
},
{
title: "所属城区",
dataIndex: "area",
sorter: true,
},
{
title: "网格长（米）",
dataIndex: "gridLength",
sorter: true,
},
{
title: "网格宽（米）",
dataIndex: "gridWidth",
{
title: "点位类型",
dataIndex: "placeType",
sorter: true,
},
{
title: "网格点号",
dataIndex: "gridNo",
title: "降水类型",
dataIndex: "precipitationType",
sorter: true,
},
{
title: "主要声源",
dataIndex: "source",
{
title: "降水量",
dataIndex: "precipitation",
sorter: true,
},
{
title: "时段",
dataIndex: "timeSlot",
{
title: "pH",
dataIndex: "ph",
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",
slots: {customRender: "Leq"},
{
title: "电导率",
dataIndex: "conductivity",
sorter: true,
},
{
title: "SDdB(A)",
dataIndex: "indexSd",
{
title: "SO42",
dataIndex: "so42",
sorter: true,
},
{
title: "L10dB(A)",
dataIndex: "indexL10",
{
title: "NO3",
dataIndex: "no3",
sorter: true,
},
{
title: "L50dB(A)",
dataIndex: "indexL50",
{
title: "F",
dataIndex: "f",
sorter: true,
},
{
title: "L90dB(A)",
dataIndex: "indexL90",
{
title: "CL",
dataIndex: "cl",
sorter: true,
},
{
title: "LmindB(A)",
dataIndex: "indexLmin",
{
title: "NH4",
dataIndex: "nh4",
sorter: true,
},
{
title: "LmaxdB(A)",
dataIndex: "indexLmax",
{
title: "Ca2",
dataIndex: "ca2",
sorter: true,
},
{
title: "监测站名",
dataIndex: "station",
{
title: "Mg2",
dataIndex: "mg2",
sorter: true,
},
{
title: "监测仪器型号",
dataIndex: "monitorInstrumentModel",
{
title: "Na",
dataIndex: "na",
sorter: true,
},
{
title: "监测仪器编号",
dataIndex: "monitorInstrumentCode",
{
title: "K",
dataIndex: "k",
sorter: true,
},
{
title: "监测前校准值",
dataIndex: "beforeMonitorValue",
sorter: true,
},
{
title: "声校准器测量声压值",
dataIndex: "soundPressureValue",
sorter: true,
},
{
title: "声校准仪器型号",
dataIndex: "soundInstrumentModel",
sorter: true,
},
{
title: "声校准仪器编号",
dataIndex: "soundInstrumentCode",
sorter: true,
},
{
title: "区域等级",
dataIndex: "regionLevel",
{
title: "系统编码",
dataIndex: "systemCode",
sorter: true,
},
{
title: "备注",
dataIndex: "remark",
@@ -517,11 +307,11 @@ export default {
},
],
// 表格搜索条件
zoneNoiseBillId: billId,
acidRainBillId: billId,
palceOptions: [],
areaOptions: [],
where: {
zoneNoiseBillId: billId,
acidRainBillId: billId,
},
// 表格选中数据
selectionList: [],
@@ -535,7 +325,7 @@ export default {
},
mounted() {
const { billId } = this.$route.params;
getZoneNoiseBill(billId).then((res) => {
getAcidRainBill(billId).then((res) => {
this.bill = res.data.data;
if (res.data.data.checked == 1) {
this.columns.splice(this.columns.length - 1, 1);
@@ -574,7 +364,7 @@ export default {
/* 重置搜索 */
reset() {
this.where = {
zoneNoiseBillId: this.zoneNoiseBillId,
acidRainBillId: this.acidRainBillId,
};
this.reload();
},
@@ -610,8 +400,8 @@ export default {
form.monitorHour = date.getHours();
form.monitorMinute = date.getMinutes();
delete form["monitorDate"];
if (form.zoneNoiseId) {
updateZoneNoise(form)
if (form.acidRainId) {
updateAcidRain(form)
.then((res) => {
if (res.data.code == 0) {
this.showEdit = false;
@@ -629,8 +419,8 @@ export default {
hide();
});
} else {
form.zoneNoiseBillId = this.zoneNoiseBillId;
saveZoneNoise(form)
form.acidRainBillId = this.acidRainBillId;
saveAcidRain(form)
.then((res) => {
if (res.data.code == 0) {
this.showEdit = false;
@@ -651,7 +441,7 @@ export default {
/* 删除单个 */
remove(row) {
const hide = this.$message.loading("请求中..", 0);
removeZoneNoise(row.zoneNoiseId)
removeAcidRain(row.acidRainId)
.then((res) => {
if (res.data.code === 0) {
this.$message.success(res.data.msg);
@@ -666,9 +456,9 @@ export default {
.finally(() => hide());
},
removeBatch() {
const ids = this.selectionList.map((item) => item.zoneNoiseId);
const ids = this.selectionList.map((item) => item.acidRainId);
const hide = this.$message.loading("请求中..", 0);
removeBatchZoneNoise(ids)
removeBatchAcidRain(ids)
.then((res) => {
if (res.data.code === 0) {
this.$message.success(res.data.msg);

97
src/views/atmosphere/acid-rain/collect/utils.js
View File

@@ -1,14 +1,21 @@
export default {
toObjData(excelData) {
return excelData.map(item => {
const monitorTime = new Date();
monitorTime.setFullYear(item[0]);
monitorTime.setMonth(item[7] - 1);
monitorTime.setDate(item[8]);
monitorTime.setHours(item[9]);
monitorTime.setMinutes(item[10]);
const monitorStartTime = new Date();
monitorStartTime.setFullYear(item[4]);
monitorStartTime.setMonth(item[5] - 1);
monitorStartTime.setDate(item[6]);
monitorStartTime.setHours(item[7]);
monitorStartTime.setMinutes(item[8]);
const monitorEndTime = new Date();
monitorEndTime.setFullYear(item[9]);
monitorEndTime.setMonth(item[10] - 1);
monitorEndTime.setDate(item[11]);
monitorEndTime.setHours(item[12]);
monitorEndTime.setMinutes(item[13]);
let quarter = 1;
const month = item[7]
const month = item[10]
if (month < 4) {
quarter = 1
} else if (month < 7) {
@@ -18,48 +25,34 @@ export default {
} else {
quarter = 4
}
console.log(item);
const row = {
regionCode: "450100",
monitorYear: item[0],
gridLength: item[1],
gridWidth: item[2],
place: item[3],
gridNo: item[4],
area: item[5],
source: item[6],
monitorMonth: item[7],
monitorDay: item[8],
monitorHour: item[9],
monitorMinute: item[10],
indexLeq: item[11],
indexSd: item[12],
indexL10: item[13],
indexL50: item[14],
indexL90: item[15],
indexLmax: item[16],
indexLmin: item[17],
station: item[18],
monitorInstrumentModel: item[19],
monitorInstrumentCode: item[20],
beforeMonitorValue: item[21],
afterMonitorValue: item[22],
soundPressureValue: item[23],
soundInstrumentModel: item[24],
soundInstrumentCode: item[25],
city: '南宁',
regionCode: item[0],
city: item[1].includes("市")?item[1]:"南宁市",
area: item[1].includes("区")?item[1]:"",
county: item[1].includes("县")?item[1]:"",
place: item[2],
placeType: item[3],
precipitationType: item[14],
precipitation: item[15],
ph: item[16],
conductivity: item[17],
so42: item[18],
no3: item[19],
f: Number(item[20])?Number(item[20]):null,
cl: item[21],
nh4: item[22],
ca2: item[23],
mg2: item[24],
na: item[25],
k: Number(item[26])?Number(item[26]):null,
systemCode: item[27],
regionLevel: "市级",
monitorTime: monitorTime.getTime(),
monitorStartTime: monitorStartTime.getTime(),
monitorEndTime: monitorEndTime.getTime(),
monitorTime: monitorEndTime.getTime(),
quarter
}
if (row.monitorHour >= 6 && row.monitorHour < 22) {
row.timeSlot = "昼"
}else{
row.timeSlot = "夜"
}
if (row.indexL10 < row.indexL50 || row.indexL50 < row.indexL90) {
throw new Error(row.place + "数值有误")
}
return row;
})
@@ -91,12 +84,12 @@ export default {
// 解析县级数据
toAreaObjData(excelData) {
return excelData.map(item => {
const monitorTime = new Date();
monitorTime.setFullYear(item[1]);
monitorTime.setMonth(item[14] - 1);
monitorTime.setDate(item[15]);
monitorTime.setHours(item[16]);
monitorTime.setMinutes(item[17]);
const monitorStartTime = new Date();
monitorStartTime.setFullYear(item[1]);
monitorStartTime.setMonth(item[14] - 1);
monitorStartTime.setDate(item[15]);
monitorStartTime.setHours(item[16]);
monitorStartTime.setMinutes(item[17]);
let quarter = 1;
const month = item[14]
if (month < 4) {
@@ -152,7 +145,7 @@ export default {
remark: item[35],
city: '南宁',
timeSlot,
monitorTime: monitorTime.getTime(),
monitorStartTime: monitorStartTime.getTime(),
quarter
}

394
src/views/atmosphere/acid-rain/statistic/base.vue
View File

@@ -57,20 +57,15 @@
<ele-pro-table
v-model:selection="selectionList"
ref="table"
row-key="zoneNoiseId"
row-key="acidRainId"
:datasource="url"
:columns="columns"
:where="where"
:scroll="{ x: 'max-content' }"
@done="(d) => (data = d.data)"
>
<template #Leq="{ text,record }">
<a-tag v-if="(record.timeSlot == '昼' && text <= 68) || (record.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 #Address="{ record }">
{{record.area?record.area:record.county?record.county:record.city}}
</template>
</ele-pro-table>
</a-card>
@@ -81,7 +76,7 @@
<script>
// import _ from "lodash";
import XLSX from "xlsx";
import { pageZoneNoiseUrl, getColumnOptions } from "@/api/ecology/zone-sound";
import { pageAcidRainUrl, getColumnOptions } from "@/api/ecology/acid";
import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
import moment from "moment";
// import utils from "./utils";
@@ -94,147 +89,112 @@ export default {
locale,
bill: {},
// 表格数据接口
url: pageZoneNoiseUrl,
url: pageAcidRainUrl,
selection: [],
// 表格列配置
columns: [
{
title: "监测日期",
dataIndex: "monitorTime",
title: "采样开始时间",
dataIndex: "monitorStartTime",
sorter: true,
customRender: ({text})=> moment(text,"YYYY/MM/DD HH:mm:ss").format("YYYY-MM-DD HH:mm")
},
{
title: "采样结束时间",
dataIndex: "monitorEndTime",
sorter: true,
customRender: ({text})=> moment(text,"YYYY/MM/DD HH:mm:ss").format("YYYY-MM-DD HH:mm")
},
{
title: "行政代码",
dataIndex: "regionCode",
sorter: true,
},
{
title: "测点名称",
title: "市(县，区)",
slots: {customRender: "Address"},
},
{
title: "采样点",
dataIndex: "place",
sorter: true,
},
{
title: "所属城区",
dataIndex: "area",
sorter: true,
},
{
title: "网格长（米）",
dataIndex: "gridLength",
sorter: true,
},
{
title: "网格宽（米）",
dataIndex: "gridWidth",
{
title: "点位类型",
dataIndex: "placeType",
sorter: true,
},
{
title: "网格点号",
dataIndex: "gridNo",
title: "降水类型",
dataIndex: "precipitationType",
sorter: true,
},
{
title: "主要声源",
dataIndex: "source",
{
title: "降水量",
dataIndex: "precipitation",
sorter: true,
},
{
title: "时段",
dataIndex: "timeSlot",
{
title: "pH",
dataIndex: "ph",
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",
slots: {customRender: "Leq"},
{
title: "电导率",
dataIndex: "conductivity",
sorter: true,
},
{
title: "SDdB(A)",
dataIndex: "indexSd",
{
title: "SO42",
dataIndex: "so42",
sorter: true,
},
{
title: "L10dB(A)",
dataIndex: "indexL10",
{
title: "NO3",
dataIndex: "no3",
sorter: true,
},
{
title: "L50dB(A)",
dataIndex: "indexL50",
{
title: "F",
dataIndex: "f",
sorter: true,
},
{
title: "L90dB(A)",
dataIndex: "indexL90",
{
title: "CL",
dataIndex: "cl",
sorter: true,
},
{
title: "LmindB(A)",
dataIndex: "indexLmin",
{
title: "NH4",
dataIndex: "nh4",
sorter: true,
},
{
title: "LmaxdB(A)",
dataIndex: "indexLmax",
{
title: "Ca2",
dataIndex: "ca2",
sorter: true,
},
{
title: "监测站名",
dataIndex: "station",
{
title: "Mg2",
dataIndex: "mg2",
sorter: true,
},
{
title: "监测仪器型号",
dataIndex: "monitorInstrumentModel",
{
title: "Na",
dataIndex: "na",
sorter: true,
},
{
title: "监测仪器编号",
dataIndex: "monitorInstrumentCode",
{
title: "K",
dataIndex: "k",
sorter: true,
},
{
title: "监测前校准值",
dataIndex: "beforeMonitorValue",
sorter: true,
},
{
title: "声校准器测量声压值",
dataIndex: "soundPressureValue",
sorter: true,
},
{
title: "声校准仪器型号",
dataIndex: "soundInstrumentModel",
sorter: true,
},
{
title: "声校准仪器编号",
dataIndex: "soundInstrumentCode",
sorter: true,
},
{
title: "区域等级",
dataIndex: "regionLevel",
{
title: "系统编码",
dataIndex: "systemCode",
sorter: true,
},
{
title: "备注",
dataIndex: "remark",
@@ -244,7 +204,7 @@ export default {
title: "创建人",
dataIndex: "username",
sorter: true,
},
}
],
palceOptions: [],
areaOptions: [],
@@ -305,157 +265,106 @@ export default {
},
exportFile() {
const columns = [
{
title: "采样开始时间",
dataIndex: "monitorStartTime",
sorter: true,
customRender: ({text})=> moment(text,"YYYY/MM/DD HH:mm:ss").format("YYYY-MM-DD HH:mm")
},
{
title: "行政区划代码",
title: "采样结束时间",
dataIndex: "monitorEndTime",
sorter: true,
customRender: ({text})=> moment(text,"YYYY/MM/DD HH:mm:ss").format("YYYY-MM-DD HH:mm")
},
{
title: "行政代码",
dataIndex: "regionCode",
sorter: true,
},
{
title: "监测年度",
dataIndex: "monitorYear",
sorter: true,
title: "市(县，区)",
dataIndex: "address",
slots: {customRender: "Address"},
},
{
title: "点位编码",
dataIndex: "placeCode",
sorter: true,
},
{
title: "测点名称",
{
title: "采样点",
dataIndex: "place",
sorter: true,
},
{
title: "测点经度",
dataIndex: "placeLng",
sorter: true,
},
{
title: "测点纬度",
dataIndex: "placeLat",
sorter: true,
},
{
title: "测点参照物",
dataIndex: "refObj",
{
title: "点位类型",
dataIndex: "placeType",
sorter: true,
},
{
title: "网格边长",
dataIndex: "gridLength",
sorter: true,
},
{
title: "网格覆盖人口（万）",
dataIndex: "people",
title: "降水类型",
dataIndex: "precipitationType",
sorter: true,
},
{
title: "功能区代码",
dataIndex: "functionCode",
sorter: true,
},
{
title: "月",
dataIndex: "monitorMonth",
sorter: true,
},
{
title: "日",
dataIndex: "monitorDay",
sorter: true,
},
{
title: "时",
dataIndex: "monitorHour",
sorter: true,
},
{
title: "分",
dataIndex: "monitorMinute",
sorter: true,
},
{
title: "Leq",
dataIndex: "indexLeq",
sorter: true,
},
{
title: "L10",
dataIndex: "indexL10",
sorter: true,
},
{
title: "L50",
dataIndex: "indexL50",
sorter: true,
},
{
title: "L90",
dataIndex: "indexL90",
sorter: true,
},
{
title: "最大值",
dataIndex: "indexLmax",
title: "降水量",
dataIndex: "precipitation",
sorter: true,
},
{
title: "最小值",
dataIndex: "indexLmin",
sorter: true,
},
{
title: "标准差(SD)",
dataIndex: "indexSd",
sorter: true,
},
{
title: "监测站名",
dataIndex: "station",
sorter: true,
},
{
title: "监测仪器型号",
dataIndex: "monitorInstrumentModel",
sorter: true,
},
{
title: "监测仪器编号",
dataIndex: "monitorInstrumentCode",
sorter: true,
},
{
title: "监测前校准值",
dataIndex: "beforeMonitorValue",
sorter: true,
},
{
title: "声校准器测量声压值",
dataIndex: "soundPressureValue",
sorter: true,
},
{
title: "声校准仪器型号",
dataIndex: "soundInstrumentModel",
sorter: true,
},
{
title: "声校准仪器编号",
dataIndex: "soundInstrumentCode",
sorter: true,
},
{
title: "区域等级",
dataIndex: "regionLevel",
title: "pH",
dataIndex: "ph",
sorter: true,
},
{
title: "备注",
dataIndex: "remark",
title: "电导率",
dataIndex: "conductivity",
sorter: true,
},
{
title: "SO42",
dataIndex: "so42",
sorter: true,
},
{
title: "NO3",
dataIndex: "no3",
sorter: true,
},
{
title: "F",
dataIndex: "f",
sorter: true,
},
{
title: "CL",
dataIndex: "cl",
sorter: true,
},
{
title: "NH4",
dataIndex: "nh4",
sorter: true,
},
{
title: "Ca2",
dataIndex: "ca2",
sorter: true,
},
{
title: "Mg2",
dataIndex: "mg2",
sorter: true,
},
{
title: "Na",
dataIndex: "na",
sorter: true,
},
{
title: "K",
dataIndex: "k",
sorter: true,
},
{
title: "系统编码",
dataIndex: "systemCode",
sorter: true,
},
];
@@ -463,7 +372,12 @@ export default {
const th = columns.map((item) => item.title);
arr.push(th);
this.data.forEach((d) => {
const td = columns.map((item) => d[item.dataIndex]);
const td = columns.map((item) => {
if(item.dataIndex == "address"){
return d.area?d.area:d.county?d.county:d.city
}
return d[item.dataIndex];
});
arr.push(td);
});
let sheet = XLSX.utils.aoa_to_sheet(arr);

2
src/views/atmosphere/acid-rain/statistic/index.vue
View File

@@ -36,7 +36,7 @@
import YearStatistic from "./year.vue";
export default {
name: 'StatisticSoundZone',
name: 'StatisticAcidRain',
components: {
BaseStatistic,
SourceStatistic,

2
src/views/atmosphere/air/collect/air-bill.vue
View File

@@ -190,7 +190,7 @@
},
{
title: '创建人',
dataIndex: 'username',
dataIndex: 'userName',
sorter: true,
},

305
src/views/atmosphere/air/collect/air.vue
View File

@@ -52,8 +52,8 @@
ref="form"
:model="form"
:rules="rules"
:label-col="{ md: { span: 6 }, sm: { span: 24 } }"
:wrapper-col="{ md: { span: 18 }, sm: { span: 24 } }"
:label-col="{ md: { span: 8 }, sm: { span: 24 } }"
:wrapper-col="{ md: { span: 16 }, sm: { span: 24 } }"
>
<a-row>
<a-col :md="12" :sm="24">
@@ -82,171 +82,91 @@
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-item label="所属城区" name="area">
<a-form-item label="SO2" name="so2">
<a-input
v-model:value="form.area"
placeholder="请输入城区"
v-model:value="form.so2"
placeholder="请输入二氧化硫浓度/(μg/m3)"
allow-clear
/>
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-item label="网格长" name="airLength">
<a-form-item label="NO2" name="no2">
<a-input
v-model:value="form.gridLength"
placeholder="请输入网格长（米）"
v-model:value="form.no2"
placeholder="请输入二氧化氮浓度/(μg/m3)"
allow-clear
/>
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-item label="网格宽" name="airWidth">
<a-form-item label="PM10" name="pm10">
<a-input
v-model:value="form.gridWidth"
placeholder="请输入网格宽（米）"
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)"
v-model:value="form.pm10"
placeholder="请输入可吸入颗粒物浓度/(μg/m3)"
allow-clear
/>
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-item label="SDdB(A)" name="indexSd">
<a-form-item label="CO" name="co">
<a-input
type="number"
v-model:value="form.indexSd"
placeholder="请输入大SDdB(A)"
v-model:value="form.co"
placeholder="请输入一氧化碳 浓度/(mg/m3)"
allow-clear
/>
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-item label="L10dB(A)" name="indexL10">
<a-form-item label="O3" name="o3">
<a-input
type="number"
v-model:value="form.indexL10"
placeholder="请输入L10dB(A)"
v-model:value="form.o3"
placeholder="请输入臭氧（O3）最大8小时滑动平均浓度/(μg/m3)"
allow-clear
/>
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-item label="L50dB(A)" name="indexL50">
<a-form-item label="PM2.5" name="pm25">
<a-input
type="number"
v-model:value="form.indexL50"
placeholder="请输入L50dB(A)"
v-model:value="form.pm25"
placeholder="请输入细颗粒物浓度/(μg/m3)"
allow-clear
/>
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-item label="L90dB(A)" name="indexL90">
<a-form-item label="空气质量指数AQI" name="aqi">
<a-input
type="number"
v-model:value="form.indexL90"
placeholder="请输入L90dB(A)"
v-model:value="form.aqi"
placeholder="请输入空气质量指数AQI"
allow-clear
/>
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-item label="LmindB(A)" name="indexLmin">
<a-col :md="12" :sm="24">
<a-form-item label="首要污染物" name="primaryPollutant">
<a-input
type="number"
v-model:value="form.indexLmin"
placeholder="请输入LmindB(A)"
v-model:value="form.primaryPollutant"
placeholder="请输入首要污染物"
allow-clear
/>
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-item label="LmaxdB(A)" name="indexLmax">
<a-col :md="12" :sm="24">
<a-form-item label="空气质量指数级别" name="aqiLevel">
<a-input
type="number"
v-model:value="form.indexLmax"
placeholder="请输入LmaxdB(A)"
v-model:value="form.aqiLevel"
placeholder="请输入空气质量指数级别"
allow-clear
/>
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-item label="监测站名" name="station">
<a-col :md="12" :sm="24">
<a-form-item label="空气质量状况" name="airQualityStatus">
<a-input
v-model:value="form.station"
placeholder="请输入监测站名"
allow-clear
/>
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-item label="监测仪器型号" name="monitorInstrumentModel">
<a-input
v-model:value="form.monitorInstrumentModel"
placeholder="请输入监测仪器型号"
allow-clear
/>
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-item label="监测仪器编号" name="monitorInstrumentCode">
<a-input
v-model:value="form.monitorInstrumentCode"
placeholder="请输入监测仪器编号"
allow-clear
/>
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-item label="监测前校准值" name="beforeMonitorValue">
<a-input
v-model:value="form.beforeMonitorValue"
placeholder="请输入监测前校准值"
allow-clear
/>
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-item label="监测后校准值" name="afterMonitorValue">
<a-input
v-model:value="form.afterMonitorValue"
placeholder="请输入监测后校准值"
allow-clear
/>
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-item label="声校准器测量声压值" name="soundPressureValue">
<a-input
v-model:value="form.soundPressureValue"
placeholder="请输入声校准器测量声压值"
allow-clear
/>
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-item label="声校准仪器型号" name="soundInstrumentModel">
<a-input
v-model:value="form.soundInstrumentModel"
placeholder="请输入声校准仪器型号"
allow-clear
/>
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-item label="声校准仪器编号" name="soundInstrumentCode">
<a-input
v-model:value="form.soundInstrumentCode"
placeholder="请输入声校准仪器编号"
v-model:value="form.airQualityStatus"
placeholder="请输入空气质量状况"
allow-clear
/>
</a-form-item>
@@ -267,7 +187,7 @@
<ele-pro-table
v-model:selection="selectionList"
ref="table"
row-key="airId"
row-key="ambientAirId"
:datasource="url"
:columns="columns"
:where="where"
@@ -293,16 +213,6 @@
</a-popconfirm>
</a-space>
</template>
<template #Leq="{ text,record }">
<a-tag v-if="(record.timeSlot == '昼' && text <= 68) || (record.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>
<template #action="{ record }">
<a-space>
<a-button
@@ -362,140 +272,69 @@ export default {
title: "监测日期",
dataIndex: "monitorTime",
sorter: true,
customRender: ({text})=> moment(text,"YYYY/MM/DD HH:mm:ss").format("YYYY-MM-DD HH:mm")
customRender: ({text})=> moment(text).format("YYYY-MM-DD HH:mm")
},
{
title: "城市",
dataIndex: "city",
sorter: true,
},
{
title: "测点名称",
dataIndex: "place",
sorter: true,
},
{
title: "所属城区",
dataIndex: "area",
sorter: true,
},
{
title: "网格长（米）",
dataIndex: "gridLength",
sorter: true,
},
{
title: "网格宽（米）",
dataIndex: "gridWidth",
{
title: "SO2/(μg/m3)",
dataIndex: "so2",
sorter: true,
},
{
title: "网格点号",
dataIndex: "gridNo",
title: "NO2/(μg/m3)",
dataIndex: "no2",
sorter: true,
},
{
title: "主要声源",
dataIndex: "source",
{
title: "PM10/(μg/m3)",
dataIndex: "pm10",
sorter: true,
},
{
title: "时段",
dataIndex: "timeSlot",
{
title: "CO/(mg/m3)",
dataIndex: "co",
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",
slots: {customRender: "Leq"},
{
title: "臭氧（O3）最大8小时滑动平均浓度/(μg/m3)",
dataIndex: "o3",
sorter: true,
},
{
title: "SDdB(A)",
dataIndex: "indexSd",
{
title: "PM2.5",
dataIndex: "pm25",
sorter: true,
},
{
title: "L10dB(A)",
dataIndex: "indexL10",
{
title: "空气质量指数AQI",
dataIndex: "aqi",
sorter: true,
},
{
title: "L50dB(A)",
dataIndex: "indexL50",
{
title: "首要污染物",
dataIndex: "primaryPollutant",
sorter: true,
},
{
title: "L90dB(A)",
dataIndex: "indexL90",
{
title: "空气质量指数级别",
dataIndex: "aqiLevel",
sorter: true,
},
{
title: "LmindB(A)",
dataIndex: "indexLmin",
{
title: "空气质量状况",
dataIndex: "airQualityStatus",
sorter: true,
},
{
title: "LmaxdB(A)",
dataIndex: "indexLmax",
sorter: true,
},
{
title: "监测站名",
dataIndex: "station",
sorter: true,
},
{
title: "监测仪器型号",
dataIndex: "monitorInstrumentModel",
sorter: true,
},
{
title: "监测仪器编号",
dataIndex: "monitorInstrumentCode",
sorter: true,
},
{
title: "监测前校准值",
dataIndex: "beforeMonitorValue",
sorter: true,
},
{
title: "声校准器测量声压值",
dataIndex: "soundPressureValue",
sorter: true,
},
{
title: "声校准仪器型号",
dataIndex: "soundInstrumentModel",
sorter: true,
},
{
title: "声校准仪器编号",
dataIndex: "soundInstrumentCode",
sorter: true,
},
{
title: "区域等级",
dataIndex: "regionLevel",
sorter: true,
},
{
{
title: "备注",
dataIndex: "remark",
sorter: true,

315
src/views/atmosphere/air/statistic/base.vue
View File

@@ -57,21 +57,14 @@
<ele-pro-table
v-model:selection="selectionList"
ref="table"
row-key="zoneNoiseId"
row-key="airId"
:datasource="url"
:columns="columns"
:where="where"
:scroll="{ x: 'max-content' }"
@done="(d) => (data = d.data)"
>
<template #Leq="{ text,record }">
<a-tag v-if="(record.timeSlot == '昼' && text <= 68) || (record.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-card>
</div>
@@ -81,12 +74,12 @@
<script>
// import _ from "lodash";
import XLSX from "xlsx";
import { pageZoneNoiseUrl, getColumnOptions } from "@/api/ecology/zone-sound";
import { pageAirUrl, getColumnOptions } from "@/api/ecology/air";
import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
import moment from "moment";
// import utils from "./utils";
export default {
name: "StatisticSoundZoneBase",
name: "StatisticAirBase",
components: {},
data() {
return {
@@ -94,7 +87,7 @@ export default {
locale,
bill: {},
// 表格数据接口
url: pageZoneNoiseUrl,
url: pageAirUrl,
selection: [],
// 表格列配置
columns: [
@@ -102,140 +95,69 @@ export default {
title: "监测日期",
dataIndex: "monitorTime",
sorter: true,
customRender: ({text})=> moment(text,"YYYY/MM/DD HH:mm:ss").format("YYYY-MM-DD HH:mm")
customRender: ({text})=> moment(text).format("YYYY-MM-DD HH:mm")
},
{
title: "城市",
dataIndex: "city",
sorter: true,
},
{
title: "测点名称",
dataIndex: "place",
sorter: true,
},
{
title: "所属城区",
dataIndex: "area",
sorter: true,
},
{
title: "网格长（米）",
dataIndex: "gridLength",
sorter: true,
},
{
title: "网格宽（米）",
dataIndex: "gridWidth",
{
title: "SO2/(μg/m3)",
dataIndex: "so2",
sorter: true,
},
{
title: "网格点号",
dataIndex: "gridNo",
title: "NO2/(μg/m3)",
dataIndex: "no2",
sorter: true,
},
{
title: "主要声源",
dataIndex: "source",
{
title: "PM10/(μg/m3)",
dataIndex: "pm10",
sorter: true,
},
{
title: "时段",
dataIndex: "timeSlot",
{
title: "CO/(mg/m3)",
dataIndex: "co",
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",
slots: {customRender: "Leq"},
{
title: "臭氧（O3）最大8小时滑动平均浓度/(μg/m3)",
dataIndex: "o3",
sorter: true,
},
{
title: "SDdB(A)",
dataIndex: "indexSd",
{
title: "PM2.5",
dataIndex: "pm25",
sorter: true,
},
{
title: "L10dB(A)",
dataIndex: "indexL10",
{
title: "空气质量指数AQI",
dataIndex: "aqi",
sorter: true,
},
{
title: "L50dB(A)",
dataIndex: "indexL50",
{
title: "首要污染物",
dataIndex: "primaryPollutant",
sorter: true,
},
{
title: "L90dB(A)",
dataIndex: "indexL90",
{
title: "空气质量指数级别",
dataIndex: "aqiLevel",
sorter: true,
},
{
title: "LmindB(A)",
dataIndex: "indexLmin",
{
title: "空气质量状况",
dataIndex: "airQualityStatus",
sorter: true,
},
{
title: "LmaxdB(A)",
dataIndex: "indexLmax",
sorter: true,
},
{
title: "监测站名",
dataIndex: "station",
sorter: true,
},
{
title: "监测仪器型号",
dataIndex: "monitorInstrumentModel",
sorter: true,
},
{
title: "监测仪器编号",
dataIndex: "monitorInstrumentCode",
sorter: true,
},
{
title: "监测前校准值",
dataIndex: "beforeMonitorValue",
sorter: true,
},
{
title: "声校准器测量声压值",
dataIndex: "soundPressureValue",
sorter: true,
},
{
title: "声校准仪器型号",
dataIndex: "soundInstrumentModel",
sorter: true,
},
{
title: "声校准仪器编号",
dataIndex: "soundInstrumentCode",
sorter: true,
},
{
title: "区域等级",
dataIndex: "regionLevel",
sorter: true,
},
{
{
title: "备注",
dataIndex: "remark",
sorter: true,
@@ -244,7 +166,7 @@ export default {
title: "创建人",
dataIndex: "username",
sorter: true,
},
}
],
palceOptions: [],
areaOptions: [],
@@ -305,19 +227,15 @@ export default {
},
exportFile() {
const columns = [
{
title: "行政区划代码",
dataIndex: "regionCode",
{
title: "监测日期",
dataIndex: "monitorTime",
sorter: true,
customRender: ({text})=> moment(text).format("YYYY-MM-DD HH:mm")
},
{
title: "监测年度",
dataIndex: "monitorYear",
sorter: true,
},
{
title: "点位编码",
dataIndex: "placeCode",
title: "城市",
dataIndex: "city",
sorter: true,
},
{
@@ -325,132 +243,54 @@ export default {
dataIndex: "place",
sorter: true,
},
{
title: "测点经度",
dataIndex: "placeLng",
sorter: true,
},
{
title: "测点纬度",
dataIndex: "placeLat",
sorter: true,
},
{
title: "测点参照物",
dataIndex: "refObj",
{
title: "SO2/(μg/m3)",
dataIndex: "so2",
sorter: true,
},
{
title: "网格边长",
dataIndex: "gridLength",
sorter: true,
},
{
title: "网格覆盖人口（万）",
dataIndex: "people",
title: "NO2/(μg/m3)",
dataIndex: "no2",
sorter: true,
},
{
title: "功能区代码",
dataIndex: "functionCode",
sorter: true,
},
{
title: "月",
dataIndex: "monitorMonth",
sorter: true,
},
{
title: "日",
dataIndex: "monitorDay",
sorter: true,
},
{
title: "时",
dataIndex: "monitorHour",
sorter: true,
},
{
title: "分",
dataIndex: "monitorMinute",
sorter: true,
},
{
title: "Leq",
dataIndex: "indexLeq",
sorter: true,
},
{
title: "L10",
dataIndex: "indexL10",
sorter: true,
},
{
title: "L50",
dataIndex: "indexL50",
sorter: true,
},
{
title: "L90",
dataIndex: "indexL90",
sorter: true,
},
{
title: "最大值",
dataIndex: "indexLmax",
title: "PM10/(μg/m3)",
dataIndex: "pm10",
sorter: true,
},
{
title: "最小值",
dataIndex: "indexLmin",
title: "CO/(mg/m3)",
dataIndex: "co",
sorter: true,
},
{
title: "标准差(SD)",
dataIndex: "indexSd",
{
title: "臭氧（O3）最大8小时滑动平均浓度/(μg/m3)",
dataIndex: "o3",
sorter: true,
},
{
title: "监测站名",
dataIndex: "station",
{
title: "PM2.5",
dataIndex: "pm25",
sorter: true,
},
{
title: "监测仪器型号",
dataIndex: "monitorInstrumentModel",
{
title: "空气质量指数AQI",
dataIndex: "aqi",
sorter: true,
},
{
title: "监测仪器编号",
dataIndex: "monitorInstrumentCode",
{
title: "首要污染物",
dataIndex: "primaryPollutant",
sorter: true,
},
{
title: "监测前校准值",
dataIndex: "beforeMonitorValue",
{
title: "空气质量指数级别",
dataIndex: "aqiLevel",
sorter: true,
},
{
title: "声校准器测量声压值",
dataIndex: "soundPressureValue",
sorter: true,
},
{
title: "声校准仪器型号",
dataIndex: "soundInstrumentModel",
sorter: true,
},
{
title: "声校准仪器编号",
dataIndex: "soundInstrumentCode",
sorter: true,
},
{
title: "区域等级",
dataIndex: "regionLevel",
{
title: "空气质量状况",
dataIndex: "airQualityStatus",
sorter: true,
},
{
@@ -458,6 +298,11 @@ export default {
dataIndex: "remark",
sorter: true,
},
{
title: "创建人",
dataIndex: "username",
sorter: true,
},
];
const arr = [];
const th = columns.map((item) => item.title);

30
src/views/login/login.vue
View File

@@ -66,14 +66,14 @@
</a-button>
</a-form-item>
<div class="ele-text-center" style="padding-bottom: 32px;">
<qq-outlined class="login-oauth-icon" style="background: #3492ed;"/>
<!-- <qq-outlined class="login-oauth-icon" style="background: #3492ed;"/>
<wechat-outlined class="login-oauth-icon" style="background: #4daf29;"/>
<weibo-outlined class="login-oauth-icon" style="background: #CF1900;"/>
<weibo-outlined class="login-oauth-icon" style="background: #CF1900;"/> -->
</div>
</a-form>
<div class="login-copyright">copyright © 2021 eleadmin.com all rights reserved.</div>
<!-- <div class="login-copyright">copyright © 2021 eleadmin.com all rights reserved.</div> -->
<!-- 多语言切换 -->
<div style="position: absolute;right: 30px;top: 20px;z-index: 999;">
<!-- <div style="position: absolute;right: 30px;top: 20px;z-index: 999;">
<a-dropdown placement="bottomLeft" :overlay-style="{minWidth: '120px'}">
<global-outlined style="font-size: 18px;color: #fff;"/>
<template #overlay>
@@ -84,15 +84,15 @@
</a-menu>
</template>
</a-dropdown>
</div>
</div> -->
<!-- 实际项目去掉这段 -->
<div style="position: absolute;left: 30px;top: 20px;z-index: 999;">
<!-- <div style="position: absolute;left: 30px;top: 20px;z-index: 999;">
<a-radio-group v-model:value="direction" size="small">
<a-radio-button :value="2">居左</a-radio-button>
<a-radio-button :value="0">居中</a-radio-button>
<a-radio-button :value="1">居右</a-radio-button>
</a-radio-group>
</div>
</div> -->
</div>
</template>
@@ -101,10 +101,10 @@ import {
UserOutlined,
LockOutlined,
SafetyCertificateOutlined,
QqOutlined,
WechatOutlined,
WeiboOutlined,
GlobalOutlined
// QqOutlined,
// WechatOutlined,
// WeiboOutlined,
// GlobalOutlined
} from '@ant-design/icons-vue';
import setting from '@/config/setting';
@@ -114,10 +114,10 @@ export default {
UserOutlined,
LockOutlined,
SafetyCertificateOutlined,
QqOutlined,
WechatOutlined,
WeiboOutlined,
GlobalOutlined
// QqOutlined,
// WechatOutlined,
// WeiboOutlined,
// GlobalOutlined
},
data() {
return {

223
src/views/visualiz/sound/function/index.vue Normal file
View File

@@ -0,0 +1,223 @@
<template>
<div class="ele-body">
<a-card class="ele-card" :bordered="false">
<a-space>
<a-select @change="whereChange" v-model:value="where.monitorYear">
<a-select-option v-for="item in yearOptions" :key="item.value">{{
item.label
}}</a-select-option>
</a-select>
<a-radio-group @change="whereChange" v-model:value="where.type">
<a-radio-button value="place"> 点位 </a-radio-button>
<a-radio-button value="area"> 城区 </a-radio-button>
</a-radio-group>
<a-radio-group @change="whereChange" v-model:value="where.timeSlot">
<a-radio-button value="昼">昼</a-radio-button>
<a-radio-button value="夜">夜</a-radio-button>
</a-radio-group>
<!-- <a-button @click="exportMap">导出</a-button> -->
</a-space>
</a-card>
<div id="map"></div>
</div>
</template>
<script>
// import axios from "axios";
import { Scene, PointLayer, Popup } from "@antv/l7";
// import { DrawControl } from '@antv/l7-draw';
import { CityLayer } from "@antv/l7-district";
import { GaodeMap } from "@antv/l7-maps";
import {
getGisBase,
getGisArea,
getColumnOptions,
} from "@/api/ecology/function-sound";
let scene = null;
let pointLayer = null;
let cityLayer = null;
export default {
data() {
return {
yearOptions: [],
where: {
timeSlot: "昼",
type: "area",
monitorYear: "选择年份",
},
};
},
mounted() {
scene = new Scene({
id: "map",
map: new GaodeMap({
style: "light",
center: [108.33, 22.84],
// pitch: 48.62562,
// rotation: -0.76,
zoom: 12,
}),
});
scene.on("loaded", () => {
this.initData();
});
// const control = new DrawControl(scene, {
// });
},
methods: {
initData() {
getColumnOptions("monitor_year").then((res) => {
if (res.data.code == 0) {
this.yearOptions = res.data.data.map((item) => {
return {
label: item,
value: item,
};
});
this.where.monitorYear = res.data.data[res.data.data.length - 1];
this.whereChange();
}
});
},
setPlaceData() {},
whereChange() {
if (this.where.type == "place") {
getGisBase(this.where).then((res) => {
if (res.data.code == 0) {
if(cityLayer){
cityLayer.destroy()
scene.removeLayer(cityLayer)
}
pointLayer = new PointLayer({})
.source(res.data.data, {
parser: {
type: "json",
x: "lng",
y: "lat",
},
})
.shape("cylinder")
.size("leq", function (level) {
return [4, 4, level];
})
.active(true)
.color("leq", (leq) => {
const { timeSlot } = this.where;
const color =
timeSlot == "昼"
? leq > 70
? "#f5222d"
: "#13c2c2"
: leq > 65
? "#f5222d"
: "#13c2c2";
return color;
})
.style({
opacity: 1,
});
pointLayer.on("mousemove", (e) => {
const popup = new Popup({
offsets: [0, 0],
closeButton: false,
})
.setLnglat(e.lngLat)
.setHTML(
`<span>${e.feature.place}: ${e.feature.leq}dB(A)</span>`
);
scene.addPopup(popup);
});
pointLayer.setData(res.data.data);
scene.addLayer(pointLayer);
scene.setZoomAndCenter(12, [108.33, 22.84]);
scene.setPitch(48);
scene.render()
}
});
} else {
getGisArea(this.where).then((res) => {
if (res.data.code == 0) {
if(pointLayer){
pointLayer.destroy()
scene.removeLayer(pointLayer)
}
cityLayer = new CityLayer(scene, {
data: res.data.data,
joinBy: ["adcode", "regionCode"],
adcode: ["450000", "450100"],
depth: 3,
visible: true,
label: {
field: "NAME_CHN",
textAllowOverlap: false,
},
fill: {
color: {
field: "leq",
values: (leq) => {
if(!leq){
return
}
const { timeSlot } = this.where;
const color =
timeSlot == "昼"
? leq > 70
? "#f50"
: "#2db7f5"
: leq > 65
? "#f50"
: "#2db7f5";
return color;
},
},
},
popup: {
enable: true,
triggerEvent: "mousemove",
Html: (props) => {
return `<span>${props.NAME_CHN}:</span><span>${props.leq + "dB(A)" || "无"}</span>`;
},
},
});
scene.setPitch(0);
// scene.setZoomAndCenter(12, [108.33, 22.84]);
}
});
}
},
getAreaData() {},
exportMap(){
console.log("exportMap");
scene.exportMap("png");
}
},
};
</script>
<style scoped>
::-webkit-scrollbar {
display: none;
}
html,
body {
overflow: hidden;
margin: 0;
}
.ele-body {
position: relative;
height: 100%;
padding: 16px 0;
}
.ele-card {
z-index: 10;
margin: 0 16px;
display: inline-block;
}
#map {
position: absolute;
top: 0;
bottom: 0;
width: 100%;
}
</style>

0
src/views/visualiz/sound/road/geojson.json
View File

243
src/views/visualiz/sound/road/index.vue
View File

@@ -1,64 +1,200 @@
<template>
<div>
<div class="ele-body">
<a-card class="ele-card" :bordered="false">
<a-space>
<a-select @change="whereChange" v-model:value="where.monitorYear">
<a-select-option v-for="item in yearOptions" :key="item.value">{{
item.label
}}</a-select-option>
</a-select>
<a-radio-group @change="whereChange" v-model:value="where.type">
<a-radio-button value="place"> 点位 </a-radio-button>
<a-radio-button value="area"> 城区 </a-radio-button>
</a-radio-group>
<a-radio-group @change="whereChange" v-model:value="where.timeSlot">
<a-radio-button value="昼">昼</a-radio-button>
<a-radio-button value="夜">夜</a-radio-button>
</a-radio-group>
<!-- <a-button @click="exportMap">导出</a-button> -->
</a-space>
</a-card>
<div id="map"></div>
</div>
</template>
<script>
import { Scene, PointLayer } from '@antv/l7';
import { GaodeMap } from '@antv/l7-maps';
// import axios from "axios";
import { Scene, PointLayer, Popup } from "@antv/l7";
// import { DrawControl } from '@antv/l7-draw';
import { CityLayer } from "@antv/l7-district";
import { GaodeMap } from "@antv/l7-maps";
import {
getGisBase,
getGisArea,
getColumnOptions,
} from "@/api/ecology/road-sound";
let scene = null;
let pointLayer = null;
let cityLayer = null;
export default {
data() {
return {};
return {
yearOptions: [],
where: {
timeSlot: "昼",
type: "area",
monitorYear: "选择年份",
},
};
},
mounted() {
const scene = new Scene({
id: 'map',
map: new GaodeMap({
pitch: 0,
style: 'light',
center: [ 121.435159, 31.256971 ],
zoom: 14.89,
minZoom: 10
})
});
fetch(
'https://gw.alipayobjects.com/os/basement_prod/893d1d5f-11d9-45f3-8322-ee9140d288ae.json'
)
.then(res => res.json())
.then(data => {
const pointLayer = new PointLayer({})
.source(data, {
parser: {
type: 'json',
x: 'longitude',
y: 'latitude'
scene = new Scene({
id: "map",
map: new GaodeMap({
style: "light",
center: [108.33, 22.84],
// pitch: 48.62562,
// rotation: -0.76,
zoom: 12,
}),
});
scene.on("loaded", () => {
this.initData();
});
// const control = new DrawControl(scene, {
// });
},
methods: {
initData() {
getColumnOptions("monitor_year").then((res) => {
if (res.data.code == 0) {
this.yearOptions = res.data.data.map((item) => {
return {
label: item,
value: item,
};
});
this.where.monitorYear = res.data.data[res.data.data.length - 1];
this.whereChange();
}
})
.shape('name', [
'circle',
'triangle',
'square',
'pentagon',
'hexagon',
'octogon',
'hexagram',
'rhombus',
'vesica'
])
.size('unit_price', [ 10, 25 ])
.color('name', [ '#5B8FF9', '#5CCEA1', '#5D7092', '#F6BD16', '#E86452' ])
.style({
opacity: 0.3,
strokeWidth: 2
});
scene.addLayer(pointLayer);
});
}
},
setPlaceData() {},
whereChange() {
if (this.where.type == "place") {
getGisBase(this.where).then((res) => {
if (res.data.code == 0) {
if(cityLayer){
cityLayer.destroy()
scene.removeLayer(cityLayer)
}
pointLayer = new PointLayer({})
.source(res.data.data, {
parser: {
type: "json",
x: "lng",
y: "lat",
},
})
.shape("cylinder")
.size("leq", function (level) {
return [4, 4, level];
})
.active(true)
.color("leq", (leq) => {
const { timeSlot } = this.where;
const color =
timeSlot == "昼"
? leq > 70
? "#f5222d"
: "#13c2c2"
: leq > 65
? "#f5222d"
: "#13c2c2";
return color;
})
.style({
opacity: 1,
});
pointLayer.on("mousemove", (e) => {
const popup = new Popup({
offsets: [0, 0],
closeButton: false,
})
.setLnglat(e.lngLat)
.setHTML(
`<span>${e.feature.place}: ${e.feature.leq}dB(A)</span>`
);
scene.addPopup(popup);
});
pointLayer.setData(res.data.data);
scene.addLayer(pointLayer);
scene.setZoomAndCenter(12, [108.33, 22.84]);
scene.setPitch(48);
scene.render()
}
});
} else {
getGisArea(this.where).then((res) => {
if (res.data.code == 0) {
if(pointLayer){
pointLayer.destroy()
scene.removeLayer(pointLayer)
}
cityLayer = new CityLayer(scene, {
data: res.data.data,
joinBy: ["adcode", "regionCode"],
adcode: ["450000", "450100"],
depth: 3,
visible: true,
label: {
field: "NAME_CHN",
textAllowOverlap: false,
},
fill: {
color: {
field: "leq",
values: (leq) => {
if(!leq){
return
}
const { timeSlot } = this.where;
const color =
timeSlot == "昼"
? leq > 70
? "#f50"
: "#2db7f5"
: leq > 65
? "#f50"
: "#2db7f5";
return color;
},
},
},
popup: {
enable: true,
triggerEvent: "mousemove",
Html: (props) => {
return `<span>${props.NAME_CHN}:</span><span>${props.leq + "dB(A)" || "无"}</span>`;
},
},
});
scene.setPitch(0);
// scene.setZoomAndCenter(12, [108.33, 22.84]);
}
});
}
},
getAreaData() {},
exportMap(){
console.log("exportMap");
scene.exportMap("png");
}
},
};
</script>
<style>
<style scoped>
::-webkit-scrollbar {
display: none;
}
@@ -68,7 +204,16 @@ body {
overflow: hidden;
margin: 0;
}
.ele-body {
position: relative;
height: 100%;
padding: 16px 0;
}
.ele-card {
z-index: 10;
margin: 0 16px;
display: inline-block;
}
#map {
position: absolute;
top: 0;