江河水模块代码提交

This commit is contained in:
shixiaoman
2021-11-18 17:11:38 +08:00
parent f58090ad06
commit 3d7b525650
30 changed files with 3168 additions and 309 deletions

View File

@@ -0,0 +1,75 @@
import axios from 'axios';
// -------------------江河--水站水功能区数据列表-----------------------
const pageBillUrl = '/surfaceWaterSection/waterSiteBill/page';
// 添加
const saveRiverSiteBill = function (data) {
return axios.post("/surfaceWaterSection/waterSiteBill/importBatch",data)
}
// 删除
const removeRiverStationBill = function (id) {
return axios.delete(`/surfaceWaterSection/waterSiteBill/${id}`,)
}
// 批量删除
const removeBatchRiverStationBill = function (ids) {
return axios.delete("/surfaceWaterSection/waterSiteBill/batch",{data:ids})
}
// 修改
const updateRiverStationBill = function (data) {
return axios.put("/surfaceWaterSection/waterSiteBill",data)
}
// 审核
const verifyRiverStationBill = function (data) {
return axios.put("/surfaceWaterSection/waterSiteBill/verify",data);
}
const getRiverStationBill = function (id) {
return axios.get(`/surfaceWaterSection/waterSiteBill/${id}`)
}
// -------------------------数据---------------------
const pageRiverStationUrl = '/surfaceWaterSection/waterSite/page';
const listAll = function(data){
return axios.get("/surfaceWaterSection/waterSite",{params:data})
}
// 添加
const saveRiverStation = function (data) {
return axios.post("/surfaceWaterSection/waterSite",data)
}
// 删除
const removeRiverStation = function (id) {
return axios.delete(`/surfaceWaterSection/waterSite/${id}`,)
}
// 批量删除
const removeBatchRiverStation = function (ids) {
return axios.delete("/surfaceWaterSection/waterSite/batch",{data:ids})
}
// 修改
const updateRiverStation = function (data) {
return axios.put("/surfaceWaterSection/waterSite",data)
}
const getColumnOptions = function(column){
return axios.get("/waterFunctionArea/waterStationWaterFunctionArea/options",{params:{column}})
}
export {
pageBillUrl,
saveRiverSiteBill,
removeRiverStationBill,
updateRiverStationBill,
removeBatchRiverStationBill,
verifyRiverStationBill,
getRiverStationBill,
pageRiverStationUrl,
saveRiverStation,
removeRiverStation,
updateRiverStation,
removeBatchRiverStation,
getColumnOptions,
listAll
}

View File

@@ -1,5 +1,5 @@
import axios from 'axios';
// ----------------------列表-----------------------
// -------------------区控水站水功能区数据列表-----------------------
const pageBillUrl = '/waterFunctionArea/waterStationWaterFunctionAreaBill/page';
// 添加
const saveRiverStationBill = function (data) {

View File

@@ -0,0 +1,41 @@
import axios from 'axios';
const baseUri = "waterFunctionArea/nationalLevelWaterFunctionAreaPoint";
const listAllUrl = baseUri + "";
// 添加
const saveAqiRelate = function (data) {
return axios.post("waterFunctionArea/nationalLevelWaterFunctionAreaPoint",data)
}
// 删除
const removeAqiRelate = function (id) {
return axios.delete(`waterFunctionArea/nationalLevelWaterFunctionAreaPoint/${id}`,)
}
// 批量删除
const removeBatchAqiRelate = function (ids) {
return axios.delete("waterFunctionArea/nationalLevelWaterFunctionAreaPoint/batch",{data:ids})
}
// 修改
const updateAqiRelate = function (data) {
return axios.put("waterFunctionArea/nationalLevelWaterFunctionAreaPoint",data)
}
const copyBatchAqiRelate = function (data){
return axios.post("waterFunctionArea/nationalLevelWaterFunctionAreaPoint/copyBatch",data)
}
const getColumnOptions = function(column){
return axios.get("waterFunctionArea/nationalLevelWaterFunctionAreaPoint/options",{params:{column}})
}
export {
listAllUrl,
saveAqiRelate,
updateAqiRelate,
removeBatchAqiRelate,
removeAqiRelate,
copyBatchAqiRelate,
getColumnOptions
}

View File

@@ -0,0 +1,40 @@
import axios from 'axios';
const baseUri = "waterFunctionArea/autonomousWaterFunctionAreaPoint";
const listAllUrl = baseUri + "";
// 添加
const saveStandard = function (data) {
return axios.post("waterFunctionArea/autonomousWaterFunctionAreaPoint",data)
}
// 删除
const removeStandard = function (id) {
return axios.delete(`waterFunctionArea/autonomousWaterFunctionAreaPoint/${id}`,)
}
// 批量删除
const removeBatchStandard = function (ids) {
return axios.delete("waterFunctionArea/autonomousWaterFunctionAreaPoint/batch",{data:ids})
}
// 修改
const updateStandard = function (data) {
return axios.put("waterFunctionArea/autonomousWaterFunctionAreaPoint",data)
}
const copyBatchStandard = function (data){
return axios.post("waterFunctionArea/autonomousWaterFunctionAreaPoint/copyBatch",data)
}
const getColumnOptions = function(column){
return axios.get("waterFunctionArea/autonomousWaterFunctionAreaPoint/options",{params:{column}})
}
export {
listAllUrl,
saveStandard,
updateStandard,
removeBatchStandard,
removeStandard,
copyBatchStandard,
getColumnOptions
}

View File

@@ -0,0 +1,39 @@
import axios from 'axios';
const baseUri = "/waterFunctionArea/surfaceWaterPoint";
const listAllUrl = baseUri + "";
// 添加
const savePlace = function (data) {
return axios.post("/waterFunctionArea/surfaceWaterPoint",data)
}
// 删除
const removePlace = function (id) {
return axios.delete(`/waterFunctionArea/surfaceWaterPoint/${id}`,)
}
// 批量删除
const removeBatchPlace = function (ids) {
return axios.delete("/waterFunctionArea/surfaceWaterPoint/batch",{data:ids})
}
// 修改
const updatePlace = function (data) {
return axios.put("/waterFunctionArea/surfaceWaterPoint",data)
}
const copyBatchPlace = function (data){
return axios.post("/waterFunctionArea/surfaceWaterPoint/copyBatch",data)
}
const getColumnOptions = function(column){
return axios.get("/waterFunctionArea/surfaceWaterPoint/options",{params:{column}})
}
export {
listAllUrl,
savePlace,
updatePlace,
removeBatchPlace,
removePlace,
copyBatchPlace,
getColumnOptions
}

View File

@@ -0,0 +1,44 @@
import axios from 'axios';
const baseUri = "/waterFunctionArea/WaterStationPoint";
const listAllUrl = baseUri + "";
// 添加
const savePlace = function (data) {
return axios.post("/waterFunctionArea/WaterStationPoint",data)
}
// 删除
const removePlace = function (id) {
return axios.delete(`/waterFunctionArea/WaterStationPoint/${id}`,)
}
// 批量删除
const removeBatchPlace = function (ids) {
return axios.delete("/waterFunctionArea/WaterStationPoint/batch",{data:ids})
}
// 修改
const updatePlace = function (data) {
return axios.put("/waterFunctionArea/WaterStationPoint",data)
}
const copyBatchPlace = function (data){
return axios.post("/waterFunctionArea/WaterStationPoint/copyBatch",data)
}
const getColumnOptions = function(column){
return axios.get("/waterFunctionArea/WaterStationPoint/options",{params:{column}})
}
const listInfo = function(data){
return axios.get("/waterFunctionArea/WaterStationPoint",{params:data})
}
export {
listInfo,
listAllUrl,
savePlace,
updatePlace,
removeBatchPlace,
removePlace,
copyBatchPlace,
getColumnOptions
}

View File

@@ -1,10 +1,9 @@
const tableColumns = [
{title: "城区", dataIndex: "area", sorter: true,},
{title: "县", dataIndex: "county", sorter: true,},
{title: "所在流域", dataIndex: "watershed", sorter: true,},
{title: "所在河流", dataIndex: "river", sorter: true,},
{title: "站点名称", dataIndex: "place", sorter: true,},
{title: "本期水质", dataIndex: "periodWaterQuality", sorter: true,},
// {title: "城区", dataIndex: "area", sorter: true,},
// {title: "县", dataIndex: "county", sorter: true,},
{title: "河流名称", dataIndex: "riverName", sorter: true,},
{title: "站点名称", dataIndex: "stationName", sorter: true,},
{title: "水质目标", dataIndex: "waterTarget", sorter: true,},
{title: "水温", dataIndex: "waterTemperature", sorter: true,},
{title: "pH值", dataIndex: "ph", sorter: true,},
{title: "溶解氧", dataIndex: "dissolvedOxygen", sorter: true,},
@@ -14,8 +13,10 @@ const tableColumns = [
{title: "氨氮", dataIndex: "ammonia", sorter: true,},
{title: "总磷", dataIndex: "totalPhosphorus", sorter: true,},
{title: "总氮", dataIndex: "totalNitrogen", sorter: true,},
{title: "主要污染指标(超标倍数)", dataIndex: "mainPollutionIndicators", sorter: true,},
{title: "备注", dataIndex: "remark", sorter: true,},
{title: "叶绿素α(mg/L)", dataIndex: "chlorophyll", sorter: true,},
{title: "藻密度(cells/L)", dataIndex: "algalDensity", sorter: true,},
{title: "水质类别", dataIndex: "waterQualityType", sorter: true,},
{title: "污染指标", dataIndex: "mainPollutionIndicators", sorter: true,},
];
export {tableColumns}

View File

@@ -1,3 +1,4 @@
<!-- 江河水站导入excel表页面 -->
<template>
<div>
<!-- 表格 -->
@@ -100,12 +101,11 @@
import { Modal } from 'ant-design-vue';
import {
pageBillUrl,
// saveRiverStationBill,
removeRiverStationBill,
removeBatchRiverStationBill,
updateRiverStationBill,
verifyRiverStationBill
} from "@/api/ecology/river-station";
} from "@/api/ecology/river-site";
import moment from "moment";
export default {
name: 'DrinkingCollectWaterBill',
@@ -144,30 +144,6 @@
sorter: true,
},
// {
// title: '菜单名称',
// dataIndex: 'title',
// sorter: true
// },
// {
// title: '监测时间',
// dataIndex: 'reportTime',
// sorter: true,
// slots: {
// customRender: 'reportTime',
// },
// // customRender: ({
// // text
// // }) => this.$util.toDateString(text)
// },
// {
// title: '导入时间',
// dataIndex: 'createTime',
// sorter: true,
// customRender: ({
// text
// }) => this.$util.toDateString(text)
// },
{
title: '导入时间',
dataIndex: 'createTime',
@@ -242,18 +218,18 @@
},
detail(record) {
this.$router.replace({
path: "/water/river/station/collect/water/" + record.waterStationWaterFunctionAreaBillId
path: "/water/river/station/collect/water/" + record.waterSiteBillId
})
},
edit(record) {
this.editableData[record.waterStationWaterFunctionAreaBillId] = _.cloneDeep(record);
this.editableData[record.waterStationWaterFunctionAreaBillId].reportTime = moment(this.editableData[record.waterStationWaterFunctionAreaBillId]
this.editableData[record.waterSiteBillId] = _.cloneDeep(record);
this.editableData[record.waterSiteBillId].reportTime = moment(this.editableData[record.waterSiteBillId]
.reportTime)
},
verify(record,checked) {
const hide = this.$message.loading('请求中..', 0);
verifyRiverStationBill({
waterStationWaterFunctionAreaBillId: record.waterStationWaterFunctionAreaBillId,
waterSiteBillId: record.waterSiteBillId,
checked
}).then(res => {
if (res.data.code == 0) {
@@ -277,11 +253,11 @@
save(record) {
let {
waterStationWaterFunctionAreaBillId,
waterSiteBillId,
billName,
reportTime
} = this.editableData[record.waterStationWaterFunctionAreaBillId];
if (!waterStationWaterFunctionAreaBillId || !reportTime) {
} = this.editableData[record.waterSiteBillId];
if (!waterSiteBillId || !reportTime) {
this.$message.error('请填写完整信息再提交')
return
}
@@ -289,7 +265,7 @@
reportTime = reportTime.format("x")
reportTime = Number(reportTime)
updateRiverStationBill({
waterStationWaterFunctionAreaBillId,
waterSiteBillId,
billName,
reportTime
}).then(res => {
@@ -304,7 +280,7 @@
console.log(e);
this.$message.error(e.message);
}).finally(() => {
delete this.editableData[record.waterStationWaterFunctionAreaBillId]
delete this.editableData[record.waterSiteBillId]
hide()
})
@@ -312,7 +288,7 @@
/* 删除单个 */
remove(row) {
const hide = this.$message.loading('请求中..', 0);
removeRiverStationBill(row.waterStationWaterFunctionAreaBillId).then(res => {
removeRiverStationBill(row.waterSiteBillId).then(res => {
if (res.data.code === 0) {
this.$message.success(res.data.msg);
this.reload();
@@ -324,7 +300,7 @@
}).finally(() => hide());
},
removeBatch() {
const ids = this.selectionList.map(item => item.waterStationWaterFunctionAreaBillId);
const ids = this.selectionList.map(item => item.waterSiteBillId);
const hide = this.$message.loading('请求中..', 0);
removeBatchRiverStationBill(ids).then(res => {
if (res.data.code === 0) {

View File

@@ -1,3 +1,4 @@
<!-- 江河水站导入数据列表页面 -->
<template>
<div class="ele-body">
<a-card :bordered="false">
@@ -31,7 +32,7 @@
</a-form>
<a-modal
v-model:visible="showEdit"
:title="form.waterStationRiverStationId !== undefined ? '修改记录' : '添加记录'"
:title="form.waterSiteId !== undefined ? '修改记录' : '添加记录'"
:confirm-loading="loading"
:width="1000"
:body-style="{ paddingBottom: '8px' }"
@@ -48,9 +49,9 @@
>
<a-row gutter="12" >
<a-col :md="12" :sm="24">
<a-form-item label="采样时间" name="monitorDate">
<a-form-item label="采样时间" name="samplingTime">
<a-date-picker
v-model:value="form.monitorDate"
v-model:value="form.samplingTime"
:locale="locale"
/>
</a-form-item>
@@ -95,7 +96,7 @@
<ele-pro-table
v-model:selection="selectionList"
ref="table"
row-key="waterStationRiverStationId"
row-key="waterSiteId"
:datasource="url"
:columns="columns"
:where="where"
@@ -157,8 +158,7 @@ import {
removeBatchRiverStation,
updateRiverStation,
getRiverStationBill,
// getColumnOptions,
} from "@/api/ecology/river-station";
} from "@/api/ecology/river-site";
import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
import moment from "moment";
import { tableColumns } from "./colums";
@@ -196,9 +196,9 @@ export default {
},
],
// 表格搜索条件
nationalLevelRiverStationBillId: billId,
waterSiteBillId: billId,
where: {
nationalLevelRiverStationBillId: billId,
waterSiteBillId: billId,
},
// 表格选中数据
selectionList: [],
@@ -234,7 +234,7 @@ export default {
/* 重置搜索 */
reset() {
this.where = {
nationalLevelRiverStationBillId: this.nationalLevelRiverStationBillId,
waterSiteBillId: this.waterSiteBillId,
};
this.reload();
},
@@ -257,21 +257,7 @@ export default {
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.samplingTime = 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"];
delete form["monitorTime"];
if (form.waterStationRiverStationId) {
if (form.waterSiteId) {
updateRiverStation(form)
.then((res) => {
if (res.data.code == 0) {
@@ -290,7 +276,8 @@ export default {
hide();
});
} else {
form.nationalLevelRiverStationBillId = this.nationalLevelRiverStationBillId;
form.waterSiteBillId = this.waterSiteBillId;
form.userId = this.$store.state.user.user.userId
saveRiverStation(form)
.then((res) => {
if (res.data.code == 0) {
@@ -312,7 +299,7 @@ export default {
/* 删除单个 */
remove(row) {
const hide = this.$message.loading("请求中..", 0);
removeRiverStation(row.waterStationRiverStationId)
removeRiverStation(row.waterSiteId)
.then((res) => {
if (res.data.code === 0) {
this.$message.success(res.data.msg);
@@ -327,7 +314,7 @@ export default {
.finally(() => hide());
},
removeBatch() {
const ids = this.selectionList.map((item) => item.waterStationRiverStationId);
const ids = this.selectionList.map((item) => item.waterSiteId);
const hide = this.$message.loading("请求中..", 0);
removeBatchRiverStation(ids)
.then((res) => {

View File

@@ -2,29 +2,75 @@
<div class="ele-body">
<a-card style="width: 100%" :bordered="false">
<template #title>
<a-space>
<a-upload
:before-upload="importFileCity"
:showUploadList="false"
accept=".xls,.xlsx,.csv"
>
<div>
<a-space>
<a-upload
:before-upload="importFileCity"
:showUploadList="false"
accept=".xls,.xlsx,.csv"
>
<a-button>江河导入</a-button>
</a-upload>
<a-upload
:before-upload="importFileFunctionArea"
:showUploadList="false"
accept=".xls,.xlsx,.csv"
>
<a-button>水功能区导入</a-button>
</a-upload>
<a-upload
:before-upload="importFileStation"
:showUploadList="false"
accept=".xls,.xlsx,.csv"
>
<a-button>水站导入</a-button>
</a-upload>
</a-upload>
<a-button @click="showModal" >水功能区导入</a-button>
<a-modal v-model:visible="visible" title="水功能区导入" :footer="null">
<a-select allowClear placeholder="请选择行政级别" @change="currentVal" style="width:150px">
<a-select-option :value="'1'">国家级水功能</a-select-option>
<a-select-option :value="'2'">区控水站水功能</a-select-option>
</a-select>
<a-upload
:before-upload="importFileFunctionArea"
:showUploadList="false"
accept=".xls,.xlsx,.csv">
<a-button key="submit" type="primary" :loading="loading">导入</a-button>
</a-upload>
</a-modal>
<a-button @click="showModalWater" >水站导入</a-button>
<a-modal v-model:visible="visibleWater" title="水站导入" :footer="null">
<a-select allowClear placeholder="请选择站名" @change="currentSel" style="width:150px">
<a-select-option
v-for="item in form"
:key="item.waterStationPointId"
:label="item.stationName" :value="item"
>{{item.stationName}}</a-select-option
>
</a-select>
<a-upload
:before-upload="importFileStation"
:showUploadList="false"
accept=".xls,.xlsx,.csv">
<a-button key="submit" type="primary" :loading="loading">导入</a-button>
</a-upload>
</a-modal>
<a-button @click="templateExp" >模板下载</a-button>
<a-modal v-model:visible="visibleTemplate" title="模板下载" :footer="null">
<div>
<a-button @click="downloadRiver">江河模板下载</a-button>
</div>
<div>
<a-button @click="downloadNational">国家级水功能模板下载</a-button>
<a-button @click="downloadWater">区控水功能模板下载</a-button>
</div>
<div>
<a-button @click="downloadState">国家水站模板下载</a-button>
<a-button @click="downloadCity">广西水站模板下载</a-button>
</div>
</a-modal>
</a-space>
</div>
<!-- <div>
<a-space align="center" style="margin-top: 10px;">
<a-button @click="downloadRiver">江河模板下载</a-button>
<a-button @click="downloadNational">国家级水功能模板下载</a-button>
<a-button @click="downloadState">国家水站模板下载</a-button>
</a-space>
</div>
<div>
<a-space align="center" style="margin-top: 10px;">
<a-button > </a-button>
<a-button @click="downloadWater" style="margin-left:85px">区控水功能模板下载</a-button>
<a-button @click="downloadCity" style="margin-left:13px">广西水站模板下载</a-button>
</a-space>
</div> -->
</template>
<a-tabs v-model:activeKey="activeKey">
<a-tab-pane tab="江河信息" key="water">
@@ -52,8 +98,14 @@ import {saveWaterFunctionAreaBill} from "@/api/ecology/water-function-area"
import {saveRiverBill} from "@/api/ecology/river";
import {saveRiverStationBill} from "@/api/ecology/river-station";
import {listInfo} from "@/api/ecology/water/river-water";
import {saveRiverSiteBill} from "@/api/ecology/river-site";
import {downloadTemplate} from "@/utils/excel-util";
export default {
name: "RiverCollectIndex",
components: {
WaterBill,
FunctionBill,
@@ -62,9 +114,63 @@ export default {
data() {
return {
activeKey: "functionWater",
visible: false,
exportType:String,
visibleWater:false,
visibleTemplate:false,
form:{},
param:{}
};
},
methods: {
//模板下载
downloadRiver() {
let filename = "江河"
(filename)
},
downloadNational() {
let filename = "国家级水功能区"
downloadTemplate(filename)
},
downloadWater() {
let filename = "区控水功能区"
downloadTemplate(filename)
},
downloadState() {
let filename = "国家水站"
downloadTemplate(filename)
},
downloadCity() {
let filename = "广西水站"
downloadTemplate(filename)
},
currentSel(selVal) {
this.param.waterStationPointId = selVal.waterStationPointId;
this.param.riverName = selVal.riverName;
this.param.stationName = selVal.stationName;
this.param.system = selVal.system;
this.param.waterTarget = selVal.waterTarget;
},
currentVal(val) {
this.exportType = val;
},
showModal(){
this.visible = true;
},
templateExp(){
this.visibleTemplate = true;
},
showModalWater(){
listInfo().then((res) => {
if (res.data.code == 0) {
console.log(res.data.data)
this.visibleWater = true;
this.form = res.data.data
} else {
this.$message.error(res.data.msg);
}
})
},
/* 导入本地excel文件 */
importFileCity(file) {
const hide = this.$message.loading("导入中..", 0);
@@ -174,13 +280,25 @@ export default {
});
const riverList = aoa.filter(
(item) => {
console.log(item[8])
return item.length >= 30 && item[8] && item[8] != "水体类型"
console.log("export"+this.exportType)
if(this.exportType == "1"){ //国家级水功能
return item.length >= 30 && item[8] && item[8] != "水体类型"
}else{ //区控水站水功能模板
return item[6] && item[6] != "站点名称"
}
}
);
console.log(riverList)
// 解析成对象数组
const billName = file.name;
const billData = utils.toNationalLevelDataObj(riverList);
var billData;
if(this.exportType == "1"){
billData = utils.toNationalLevelDataObj(riverList);
}else{
billData = utils.towaterStationDataObj(riverList);
}
if (!billData || billData.length == 0) {
hide()
Modal.error({
@@ -191,15 +309,27 @@ export default {
}
const tasks = [];
if (billData.length > 0) {
tasks.push(
saveWaterFunctionAreaBill({
billName: billName,
nationalLevelWaterFunctionAreaList: billData,
})
);
if(this.exportType == "1"){
tasks.push(
saveWaterFunctionAreaBill({
billName: billName,
regionLevel:this.exportType,
nationalLevelWaterFunctionAreaList: billData,
})
);
}else{
tasks.push(
saveRiverStationBill({
billName: billName,
regionLevel:this.exportType,
waterStationWaterFunctionAreaList: billData,
})
);
}
}
// 上传到服务器
console.log(tasks);
Promise.all(tasks)
.then((res) => {
if (res[0].data.code == 0) {
@@ -207,11 +337,12 @@ export default {
title: "导入成功",
content: `成功导入${billData.length}条数据`,
});
this.visible=false;
this.$refs.functionWater && this.$refs.functionWater.reload();
} else {
Modal.error({
title: "导入失败",
content: "数据上传出错",
content: res[0].data.msg,
});
}
@@ -247,6 +378,7 @@ export default {
let data = new Uint8Array(e.target.result);
let workbook = XLSX.read(data, {
type: "array",
cellDates:true
});
let sheetNames = workbook.SheetNames;
// 解析成二维数组
@@ -255,12 +387,25 @@ export default {
});
const riverList = aoa.filter(
(item) => {
return item.length >= 15 && item[0] && item[0] != "序号"
if(this.param.system == "1"){
return item[1] && item[1] != "时间"
}else{
return item[2] && item[2] != "时间" && item[2] != "三类标准"&& item[2] != "平均值"&& item[2] != "最大值"&& item[2] != "最小值"&& item[2] != "有效数据个数"&& item[2] != "总数据个数"
}
}
);
console.log(riverList)
// 解析成对象数组
const billName = file.name;
const billData = utils.toRiverStationObjData(riverList);
var billData;
if(this.param.system == "1"){ //国家系统
billData = utils.toRiverStationObjData(riverList,this.param);
}else{
billData = utils.toCityStationObjData(riverList,this.param);
}
if (!billData || billData.length == 0) {
hide()
Modal.error({
@@ -272,9 +417,10 @@ export default {
const tasks = [];
if (billData.length > 0) {
tasks.push(
saveRiverStationBill({
saveRiverSiteBill({
billName: billName,
waterStationWaterFunctionAreaList: billData,
systemType:this.param.system,
waterSiteList: billData,
})
);
}
@@ -287,6 +433,7 @@ export default {
title: "导入成功",
content: `成功导入${billData.length}条数据`,
});
this.visibleWater=false;
this.$refs.station && this.$refs.station.reload();
} else {
Modal.error({

View File

@@ -1,4 +1,4 @@
import moment from "moment";
// import moment from "moment";
export default {
toObjData(excelData) {
@@ -60,28 +60,53 @@ export default {
})
},
// 水站均值数据 水功能区
toRiverStationObjData(excelData) {
// 江河水站(国家系统)均值数据
toRiverStationObjData(excelData,form) {
return excelData.map(item => {
console.log("时间"+item[1])
const row = {
area: item[1].includes("区") ? item[1] : null,
county: item[1].includes("县") ? item[1] : null,
watershed: item[2],
river: item[3],
place: item[4],
periodWaterQuality: item[5],
waterTemperature: item[6],
ph: item[7],
dissolvedOxygen: item[8],
conductivity: item[9],
turbidity: item[10],
permanganateIndex: item[11],
ammonia: item[12],
totalPhosphorus: item[13],
totalNitrogen: item[14],
mainPollutionIndicators: item[15],
remark: item[15],
// dissolvedOxygen: item[16],
riverName:form.riverName,
stationName:form.stationName,
waterTarget:form.waterTarget,
samplingTime: item[1],
waterTemperature: item[2],
ph: item[3],
dissolvedOxygen: item[4],
conductivity: item[5],
turbidity: item[6],
permanganateIndex: item[7],
ammonia: item[8],
totalPhosphorus: item[9],
totalNitrogen: item[10],
chlorophyll: item[11],
algalDensity: item[12],
waterQualityType: item[13],
mainPollutionIndicators: item[14],
}
return row;
})
},
// 江河水站(广西系统)均值数据
toCityStationObjData(excelData,form) {
return excelData.map(item => {
console.log("时间"+item[2])
var reg = RegExp("--")
const row = {
riverName:form.riverName,
stationName:form.stationName,
waterTarget:form.waterTarget,
samplingTime: item[2],
waterQualityType: item[3],
waterTemperature:item[4],
ph: reg.test(item[5])?null:item[5],
dissolvedOxygen: item[6],
conductivity: item[7],
turbidity: item[8],
permanganateIndex: reg.test(item[9])?null:item[9],
ammonia: item[10],
totalPhosphorus: item[11],
totalNitrogen: item[12],
}
return row;
})
@@ -90,58 +115,99 @@ export default {
// 国家级水功能区上报数据
toNationalLevelDataObj(excelData) {
return excelData.map(item => {
let date = new Date();
let year = date.getFullYear(); // 年
var time;
var samplingTime="";
if(item[14]){
time = item[14].replace('月','-').replace('日','').trim();
samplingTime = year+"-"+time;
}
const row = {
waterBodyType: item[8],
provinceRegionCode: item[0],
waterResourcesFirstLevelZoneName: item[10],
waterQualityGoal: item[11],
dataSources: item[12],
sectionName: item[13],
samplingTime: item[14] ? moment(item[14], "Y年M月D日").valueOf() : null,
wTemp: item[15],
ph: item[16],
dissolvedOxygen: item[17],
permanganateIndex: item[18],
cod: item[19],
fiveDayBod: item[20],
ammonia: item[21],
pTotal: item[22],
cu: item[23],
zn: item[24],
f: item[25],
se: item[26],
as: item[27],
hg: item[28],
cd: item[29],
cr6: item[30],
pb: item[31],
cyanide: item[32],
vPhen: item[33],
oils: item[34],
anSaa: item[35],
s: item[36],
coloOrg: item[37],
so4: item[38],
cl: item[39],
nitrateNitrogen: item[40],
fe: item[41],
mn: item[42],
nTotal: item[43],
transp: item[44],
chla: item[45],
ffeWaterFunctionAreaWaterQualityCategory: item[46],
ffeCompliantEvaluationConclusion: item[47],
ffeMajorOverStandardItemsMultiples: item[48],
lprlWaterFunctionAreaWaterQualityCategory: item[49],
lprlCompliantEvaluationConclusion: item[50],
lprlMajorOverStandardItemsMultiples: item[51],
remark: item[52],
systemCode: item[53],
waterSystem:item[1],
riverLakeLibrary:item[2],
city:item[3],
firstLevelWaterFunctionZoneName:item[4],
secondLevelWaterFunctionZoneName:item[5],
waterFunctionalIndexCode:item[6],
waterFunctionalAreaType:item[7],
waterBodyType:item[8],
provinceRegionCode:item[9],
waterResourcesFirstLevelZoneName:item[10],
waterQualityGoal:item[11],
dataSources:item[12],
sectionName:item[13],
samplingTime:samplingTime,
wTemp:item[15],
ph:item[16],
dissolvedOxygen:item[17],
permanganateIndex:item[18],
cod:item[19],
fiveDayBod:item[20],
ammonia:item[21],
totalPhosphorus:item[22],
cu:item[23],
zn:item[24],
f:item[25],
se:item[26],
as:item[27],
hg:item[28],
cd:item[29],
cr6:item[30],
pb:item[31],
cyanide:item[32],
vPhen:item[33],
oils:item[34],
anSaa:item[35],
s:item[36],
coloOrg:item[37],
so4:item[38],
cl:item[39],
nitrateNitrogen:item[40],
fe:item[41],
mn:item[42],
nTotal:item[43],
transp:item[44],
chla:item[45],
ffeWaterFunctionAreaWaterQualityCategory:item[46],
ffeCompliantEvaluationConclusion:item[47],
ffeMajorOverStandardItemsMultiples:item[48],
lprlWaterFunctionAreaWaterQualityCategory:item[49],
lprlCompliantEvaluationConclusion:item[50],
lprlMajorOverStandardItemsMultiples:item[51],
remark:item[52],
systemCode:item[53],
}
return row;
})
},
// 区控水站水功能区上报数据
towaterStationDataObj(excelData) {
return excelData.map(item => {
const row = {
area: item[1].includes("区") ? item[1] : null,
county: item[1].includes("县") ? item[1] : null,
watershed:item[2],
river:item[3],
sectionName:item[4],
monitorTime:item[5],
place:item[6],
periodWaterQuality:item[7],
waterTemperature:item[8],
ph:item[9],
dissolvedOxygen:item[10],
conductivity:item[11],
turbidity:item[12],
permanganateIndex:item[13],
ammonia:item[14],
totalPhosphorus:item[15],
totalNitrogen:item[16],
mainPollutionIndicators:item[17],
}
return row;
})
},
}

View File

@@ -1,3 +1,4 @@
<!-- 江河水导入Excel列表页面-->
<template>
<div>
<!-- 表格 -->

View File

@@ -1,3 +1,4 @@
<!-- 江河水查看数据页面-->
<template>
<div class="ele-body">
<a-card :bordered="false">
@@ -31,7 +32,7 @@
</a-form>
<a-modal
v-model:visible="showEdit"
:title="form.drinkingWaterVillageId !== undefined ? '修改记录' : '添加记录'"
:title="form.surfaceWaterSectionId !== undefined ? '修改记录' : '添加记录'"
:confirm-loading="loading"
:width="1000"
:body-style="{ paddingBottom: '8px' }"
@@ -54,9 +55,9 @@
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
<a-form-item label="时间" name="monitorTime">
<a-form-item label="时间" name="samplingTime">
<a-time-picker
v-model:value="form.monitorTime"
v-model:value="form.samplingTime"
format="HH:mm"
/>
</a-form-item>
@@ -77,7 +78,7 @@
<ele-pro-table
v-model:selection="selectionList"
ref="table"
row-key="drinkingWaterVillageId"
row-key="surfaceWaterSectionId"
:datasource="url"
:columns="columns"
:where="where"
@@ -193,6 +194,7 @@ export default {
},
mounted() {
const { billId } = this.$route.params;
console.log(billId,'billId');
getRiverBill(billId).then((res) => {
this.bill = res.data.data;
if (res.data.data.checked == 1) {
@@ -250,14 +252,17 @@ export default {
form.monitorHour = date.getHours();
form.monitorMinute = date.getMinutes();
delete form["monitorDate"];
if (form.drinkingWaterVillageId) {
console.log(form,'form');
const { billId } = this.$route.params;
form.surfaceWaterSectionBillId = billId;
if (form.surfaceWaterSectionId) {
updateRiver(form)
.then((res) => {
if (res.data.code == 0) {
this.showEdit = false;
this.$message.success(res.data.msg);
this.reload();
} else {
} else {
this.$message.error(res.data.msg);
}
})
@@ -269,7 +274,8 @@ export default {
hide();
});
} else {
form.surfaceWaterSectionBillId = this.surfaceWaterSectionId;
console.log(this.$store.state.user.user.userId);
form.userId = this.$store.state.user.user.userId
saveRiver(form)
.then((res) => {
if (res.data.code == 0) {
@@ -291,7 +297,7 @@ export default {
/* 删除单个 */
remove(row) {
const hide = this.$message.loading("请求中..", 0);
removeRiver(row.drinkingWaterVillageId)
removeRiver(row.surfaceWaterSectionId)
.then((res) => {
if (res.data.code === 0) {
this.$message.success(res.data.msg);
@@ -306,7 +312,7 @@ export default {
.finally(() => hide());
},
removeBatch() {
const ids = this.selectionList.map((item) => item.drinkingWaterVillageId);
const ids = this.selectionList.map((item) => item.surfaceWaterSectionId);
const hide = this.$message.loading("请求中..", 0);
removeBatchRiver(ids)
.then((res) => {

View File

@@ -0,0 +1,506 @@
<template>
<div class="ele-body">
<a-card :bordered="false">
<a-form
:model="where"
:wrapper-col="{ md: { span: 18 }, sm: { span: 24 } }"
>
<a-row>
<a-col :lg="6" :md="12" :sm="24" :xs="24">
<a-form-item label="年份:">
<a-select v-model:value="where.year" allow-clear show-search>
<a-select-option
v-for="(item) in yearOptions"
:key="item.value"
>{{ item.label }}
</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col :lg="6" :md="12" :sm="24" :xs="24">
<a-space>
<a-button type="primary" @click="reload">查询</a-button>
<a-button @click="reset">重置</a-button>
</a-space>
</a-col>
</a-row>
<a-row>
</a-row>
</a-form>
<a-modal
v-model:visible="showNYear"
:title="'批量复制'"
:confirm-loading="loading"
:body-style="{ paddingBottom: '8px' }"
@ok="copyBatch"
>
<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-form-item label="新年份" name="nYear">
<a-input-number id="inputNumber" v-model:value="nYear" :min="1970" :max="2050" />
</a-form-item>
</a-form>
</a-modal>
<a-modal
v-model:visible="showEdit"
:title="form.nationalLevelWaterFunctionAreaPointId !== undefined ? '修改' : '添加'"
:confirm-loading="loading"
:width="500"
: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-form-item label="年份" name="year">
<a-input-number v-model:value="form.year" :min="1970" :max="2050" />
</a-form-item>
<a-form-item label="水系" name="riverSystem">
<a-input v-model:value="form.riverSystem" placeholder="请输入水系" allow-clear />
</a-form-item>
<a-form-item label="河流、湖库名称" name="riverLakeLibrary">
<a-input v-model:value="form.riverLakeLibrary" placeholder="请输入河流、湖库名称" allow-clear />
</a-form-item>
<a-form-item label="所在地级行政区" name="cityRegionName">
<a-input v-model:value="form.cityRegionName" placeholder="请输入所在地级行政区" allow-clear />
</a-form-item>
<a-form-item label="国家重要水功能区索引码" name="waterFunctionalIndexCode">
<a-input v-model:value="form.waterFunctionalIndexCode" placeholder="请输入国家重要水功能区索引码" allow-clear />
</a-form-item>
<a-form-item label="水功能区类型" name="waterFunctionalAreaType">
<a-input v-model:value="form.waterFunctionalAreaType" placeholder="请输入水功能区类型" allow-clear />
</a-form-item>
<a-form-item label="水体类型" name="waterBodyType">
<a-input v-model:value="form.waterBodyType" placeholder="请输入水体类型" allow-clear />
</a-form-item>
<a-form-item label="省级行政区名称" name="provinceRegionName">
<a-input v-model:value="form.provinceRegionName" placeholder="请输入省级行政区名称" allow-clear />
</a-form-item>
<!-- -->
<a-form-item label="水资源一级区名称" name="waterResourcesFirstLevelZoneName">
<a-input v-model:value="form.waterResourcesFirstLevelZoneName" placeholder="请输入水资源一级区名称" allow-clear />
</a-form-item>
<a-form-item label="一级水功能区名称" name="firstLevelWaterFunctionZoneName">
<a-input v-model:value="form.firstLevelWaterFunctionZoneName" placeholder="请输入一级水功能区名称" allow-clear />
</a-form-item>
<a-form-item label="二级水功能区名称" name="secondLevelWaterFunctionZoneName">
<a-input v-model:value="form.secondLevelWaterFunctionZoneName" placeholder="请输入二级水功能区名称" allow-clear />
</a-form-item>
<a-form-item label="水质目标" name="waterQualityGoal">
<a-input v-model:value="form.waterQualityGoal" placeholder="请输入水质目标" allow-clear />
</a-form-item>
<a-form-item label="数据来源" name="dataSources">
<a-input v-model:value="form.dataSources" placeholder="请输入数据来源" allow-clear />
</a-form-item>
<a-form-item label="断面名称" name="sectionName">
<a-input v-model:value="form.sectionName" placeholder="请输入断面名称" allow-clear />
</a-form-item>
<a-form-item label="备注" name="remark">
<a-input v-model:value="form.remark" placeholder="请输入备注" allow-clear />
</a-form-item>
</a-form>
</a-modal>
<!-- 表格 -->
<ele-pro-table
v-model:selection="selectionList"
ref="table"
row-key="nationalLevelWaterFunctionAreaPointId"
:datasource="url"
:columns="columns"
:where="where"
:scroll="{ x: 'max-content' }"
@done="(d) => (data = d.data)"
>
<template #toolbar>
<a-space>
<a-button @click="openEdit" type="primary">新增</a-button>
<a-dropdown>
<template #overlay>
<a-menu @click="setCYear">
<a-menu-item v-for="item in yearOptions" :key="item.value">
{{ item.label }}
</a-menu-item>
</a-menu>
</template>
<a-button>
批量复制
<DownOutlined/>
</a-button>
</a-dropdown>
<a-popconfirm
:disabled="selectionList.length == 0"
:title="`确认删除${selectionList.length}条数据吗?`"
ok-text="Yes"
cancel-text="No"
@confirm="removeBatch"
>
<a-button
:disabled="selectionList.length == 0"
type="primary"
ghost
danger
>删除
</a-button>
</a-popconfirm>
<a-button @click="exportData" type="primary">导出</a-button>
</a-space>
</template>
<template #action="{ record }">
<a-space>
<a-button
@click="openEdit(record)"
type="primary"
shape="round"
size="small"
>修改</a-button
>
<a-popconfirm
:title="`确认删除这条数据吗?`"
ok-text="Yes"
cancel-text="No"
@confirm="remove(record)"
>
<a-button type="primary" danger shape="round" size="small"
>删除</a-button
>
</a-popconfirm>
</a-space>
</template>
</ele-pro-table>
</a-card>
</div>
<!-- 编辑弹窗 -->
</template>
<script>
// import _ from "lodash";
import {
listAllUrl,
saveAqiRelate,
updateAqiRelate,
removeAqiRelate,
removeBatchAqiRelate,
copyBatchAqiRelate,
getColumnOptions
} from "@/api/ecology/water/river-api-relate";
import {DownOutlined} from '@ant-design/icons-vue';
import XLSX from "xlsx";
// import moment from "moment";
export default {
name: "AirAqiRelate",
components: {DownOutlined},
data() {
return {
data: [],
// 表格数据接口
url: listAllUrl,
selection: [],
// 表格列配置
columns: [
{
title: "年份",
dataIndex: "year",
},
{
title: "水系",
dataIndex: "riverSystem",
},
{
title: "河流、湖库名称",
dataIndex: "riverLakeLibrary",
},
{
title: "所在地级行政区",
dataIndex: "cityRegionName",
},
{
title: "国家重要水功能区索引码",
dataIndex: "waterFunctionalIndexCode",
},
{
title: "水功能区类型",
dataIndex: "waterFunctionalAreaType",
},
{
title: "水体类型",
dataIndex: "waterBodyType",
},
{
title: "省级行政区名称",
dataIndex: "provinceRegionName",
},
{
title: "水资源一级区名称",
dataIndex: "waterResourcesFirstLevelZoneName",
},
{
title: "一级水功能区名称",
dataIndex: "firstLevelWaterFunctionZoneName",
},
{
title: "二级水功能区名称",
dataIndex: "secondLevelWaterFunctionZoneName",
},
{
title: "水质目标",
dataIndex: "waterQualityGoal",
},
{
title: "水体类型",
dataIndex: "waterBodyType",
},
{
title: "数据来源",
dataIndex: "dataSources",
},
{
title: "断面名称",
dataIndex: "sectionName",
},
{
title: "水体类型",
dataIndex: "waterBodyType",
},
{
title: "数据来源",
dataIndex: "dataSources",
},
{
title: "备注",
dataIndex: "remark",
},
{
title: "操作",
key: "action",
width: 150,
align: "center",
fixed: "right",
slots: {
customRender: "action",
},
},
],
// 表格搜索条件
where: {},
// 表格选中数据
selectionList: [],
// 是否显示编辑弹窗
showEdit: false,
// 表单数据
form: {},
loading: false,
rules: {
year: [{required: true, message: '请输入年份'}],
riverSystem:[{required: true, message: '请输入水系'
}],
riverLakeLibrary:[{required: true, message: '请输入河流、湖库名称'
}],
cityRegionName:[{required: true, message: '请输入所在地级行政区'
}],
waterFunctionalIndexCode:[{required: true, message: '请输入国家重要水功能区索引码' },],
waterFunctionalAreaType:[{required: true, message: '请输入水功能区类型'
}],
waterBodyType:[{required: true, message: '请输入水体类型'
}],
provinceRegionName:[{required: true, message: '请输入省级行政区名称'
}],
waterResourcesFirstLevelZoneName:[{required: true, message: '请输入水资源一级区名称'
}],
firstLevelWaterFunctionZoneName:[{required: true, message: '请输入一级水功能区名称'
}],
secondLevelWaterFunctionZoneName:[{required: true, message: '请输入二级水功能区名称'
}],
waterQualityGoal:[{required: true, message: '请输入水质目标'
}],
sectionName:[{required: true, message: '请输入断面名称'
}],
dataSources:[{required: true, message: '请输入数据来源'
}],
remark:[{required: true, message: '请输入备注'
}],
},
yearOptions: [],
showNYear:false,
cYear: undefined,
nYear:undefined,
};
},
mounted() {
this.getOptions();
},
methods: {
minLeqChange(e){
console.log(e)
},
/* 刷新表格 */
reload() {
this.$refs.table.reload({
where: this.where,
});
},
/* 重置搜索 */
reset() {
this.where = {};
this.reload();
},
/* 打开编辑弹窗 */
openEdit(row) {
// cloneRecord.mi
this.form = Object.assign({}, row);
this.showEdit = true;
this.$nextTick(() => {
this.$refs.form.clearValidate(); // 清除表单验证信息
});
},
async save() {
await this.$refs.form.validate();
// const {minLeq,maxLeq } = this.form;
// if(minLeq == undefined && maxLeq == undefined ){
// message.error("最小值和最大值请至少填写一项!")
// return;
// }
const hide = this.$message.loading('请求中..', 0);
const form = this.form;
console.log(form,'form');
if (form.nationalLevelWaterFunctionAreaPointId) {
updateAqiRelate(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();
});
} else {
saveAqiRelate(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);
removeAqiRelate(row.nationalLevelWaterFunctionAreaPointId).then((res) => {
hide();
if (res.data.code === 0) {
this.$message.success(res.data.msg);
this.reload();
} else {
this.$message.error(res.data.msg);
}
}).catch(e => {
hide();
this.$message.error(e.message);
})
},
/* 批量删除 */
removeBatch() {
const hide = this.$message.loading('请求中..', 0);
const ids = this.selectionList.map((item) => item.nationalLevelWaterFunctionAreaPointId);
removeBatchAqiRelate(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.message);
}).finally(() => {
hide();
})
},
getOptions(){
getColumnOptions("year").then(res => {
console.log(res)
if (res.data.code == 0) {
this.yearOptions = res.data.data.map(item => {
return {
label: item,
value: item
}
})
}
})
},
setCYear(e){
this.cYear = e.key;
this.showNYear = true;
},
copyBatch(){
const hide = this.$message.loading('请求中..', 0);
copyBatchAqiRelate({cyear:Number(this.cYear),nyear:this.nYear}).then(res=>{
if (res.data.code === 0) {
this.$message.success(res.data.msg);
this.reload();
this.getOptions();
} else {
this.$message.error(res.data.msg);
}
this.showNYear = false;
}).catch(e => {
this.$message.error(e.message);
}).finally(() => {
hide();
})
},
exportData(){
const columns = this.columns.filter(item=>item.dataIndex);
const arr = [];
const th = columns.map((item) => item.title);
arr.push(th);
this.data.forEach((d) => {
const td = columns.map((item) => d[item.dataIndex]);
arr.push(td);
});
let sheet = XLSX.utils.aoa_to_sheet(arr);
this.$util.exportSheet(XLSX, sheet, new Date().getTime().toString());
}
},
};
</script>
<style scoped lang="less">
</style>

View File

@@ -0,0 +1,525 @@
<template>
<div class="ele-body">
<a-card :bordered="false">
<a-form
:model="where"
:wrapper-col="{ md: { span: 18 }, sm: { span: 24 } }"
>
<a-row>
<a-col :lg="6" :md="12" :sm="24" :xs="24">
<a-form-item label="年份:">
<a-select v-model:value="where.year" allow-clear show-search>
<a-select-option
v-for="(item) in yearOptions"
:key="item.value"
>{{ item.label }}
</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col :lg="6" :md="12" :sm="24" :xs="24">
<a-space>
<a-button type="primary" @click="reload">查询</a-button>
<a-button @click="reset">重置</a-button>
</a-space>
</a-col>
</a-row>
<a-row>
</a-row>
</a-form>
<a-modal
v-model:visible="showNYear"
:title="'批量复制'"
:confirm-loading="loading"
:body-style="{ paddingBottom: '8px' }"
@ok="copyBatch"
>
<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-form-item label="新年份" name="nYear">
<a-input-number autonomousWaterFunctionAreaPointId="inputNumber" v-model:value="nYear" :min="1970" :max="2050" />
</a-form-item>
</a-form>
</a-modal>
<a-modal
v-model:visible="showEdit"
:title="form.autonomousWaterFunctionAreaPointId !== undefined ? '修改' : '添加'"
:confirm-loading="loading"
:width="500"
: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-form-item label="年份" name="year">
<a-input-number v-model:value="form.year" :min="1970" :max="2050" />
</a-form-item>
<a-form-item label="考核城市" name="assessmentCity">
<a-input v-model:value="form.assessmentCity" placeholder="请输入考核城市" allow-clear />
</a-form-item>
<a-form-item label="水资源一级区名称" name="waterResourcesFirstLevelZoneName">
<a-input v-model:value="form.waterResourcesFirstLevelZoneName" placeholder="请输入水资源一级区名称" allow-clear />
</a-form-item>
<a-form-item label="水资源二级区名称" name="waterResourcesTwoLevelZoneName" >
<a-input v-model:value="form.waterResourcesTwoLevelZoneName" placeholder="请输入水资源二级区名称" allow-clear />
</a-form-item>
<a-form-item label="水资源三级区名称" name="waterResourcesThreeLevelZoneName">
<a-input v-model:value="form.waterResourcesThreeLevelZoneName" placeholder="请输入水资源三级区名称" allow-clear />
</a-form-item>
<a-form-item label="河流、湖库名称" name="riverLakeLibrary">
<a-input v-model:value="form.riverLakeLibrary" placeholder="请输入河流、湖库名称" allow-clear />
</a-form-item>
<a-form-item label="二级水功能区名称" name="secondLevelWaterFunctionZoneName" >
<a-input v-model:value="form.secondLevelWaterFunctionZoneName" placeholder="请输入二级水功能区名称" allow-clear />
</a-form-item>
<a-form-item label="水功能区编码" name="waterFunctionalAreaCode">
<a-input v-model:value="form.waterFunctionalAreaCode" placeholder="请输入水功能区编码" allow-clear />
</a-form-item>
<a-form-item label="水功能区等级" name="waterFunctionalAreaLevel">
<a-input v-model:value="form.waterFunctionalAreaLevel" placeholder="请输入水功能区等级" allow-clear />
</a-form-item>
<a-form-item label="水功能区类型" name="waterFunctionalAreaType">
<a-input v-model:value="form.waterFunctionalAreaType" placeholder="请输入水功能区类型" allow-clear />
</a-form-item>
<a-form-item label="水域类型" name="basinType">
<a-input v-model:value="form.basinType" placeholder="请输入水域类型" allow-clear />
</a-form-item>
<a-form-item label="断面名称" name="sectionName">
<a-input v-model:value="form.sectionName" placeholder="请输入断面名称" allow-clear />
</a-form-item>
<a-form-item label="水质目标" name="waterQualityGoal">
<a-input v-model:value="form.waterQualityGoal" placeholder="请输入水质目标" allow-clear />
</a-form-item>
<a-form-item label="河流长度Km" name="riverLength">
<a-input v-model:value="form.riverLength" placeholder="请输入河流长度" allow-clear />
</a-form-item>
<a-form-item label="湖泊面积km2" name="lakeArea">
<a-input v-model:value="form.lakeArea" placeholder="请输入湖泊面积km2" allow-clear />
</a-form-item>
<a-form-item label="备注" name="remark">
<a-input
v-model:value="form.remark"
placeholder="备注"
allow-clear
/>
</a-form-item>
<!-- <a-form-item label="排序" name="sortNumber">-->
<!-- <a-input-number :step="1" :precision="0" v-model:value="form.sortNumber" />-->
<!-- </a-form-item>-->
</a-form>
</a-modal>
<!-- 表格 -->
<ele-pro-table
v-model:selection="selectionList"
ref="table"
row-key="autonomousWaterFunctionAreaPointId"
:datasource="url"
:columns="columns"
:where="where"
:scroll="{ x: 'max-content' }"
@done="(d) => (data = d.data)"
>
<template #toolbar>
<a-space>
<a-button @click="openEdit" type="primary">新增</a-button>
<a-dropdown>
<template #overlay>
<a-menu @click="setCYear">
<a-menu-item v-for="item in yearOptions" :key="item.value">
{{ item.label }}
</a-menu-item>
</a-menu>
</template>
<a-button>
批量复制
<DownOutlined/>
</a-button>
</a-dropdown>
<a-popconfirm
:disabled="selectionList.length == 0"
:title="`确认删除${selectionList.length}条数据吗?`"
ok-text="Yes"
cancel-text="No"
@confirm="removeBatch"
>
<a-button
:disabled="selectionList.length == 0"
type="primary"
ghost
danger
>删除
</a-button>
</a-popconfirm>
<a-button @click="exportData" type="primary">导出</a-button>
</a-space>
</template>
<template #action="{ record }">
<a-space>
<a-button
@click="openEdit(record)"
type="primary"
shape="round"
size="small"
>修改</a-button
>
<a-popconfirm
:title="`确认删除这条数据吗?`"
ok-text="Yes"
cancel-text="No"
@confirm="remove(record)"
>
<a-button type="primary" danger shape="round" size="small"
>删除</a-button
>
</a-popconfirm>
</a-space>
</template>
</ele-pro-table>
</a-card>
</div>
<!-- 编辑弹窗 -->
</template>
<script>
// import _ from "lodash";
import {
listAllUrl,
saveStandard,
updateStandard,
removeStandard,
removeBatchStandard,
copyBatchStandard,
getColumnOptions
} from "@/api/ecology/water/river-autonomous";
import {DownOutlined} from '@ant-design/icons-vue';
import XLSX from "xlsx";
// import { message } from 'ant-design-vue';
// import moment from "moment";
export default {
name: "autonomous",
components: {DownOutlined},
data() {
return {
data: [],
// 表格数据接口
url: listAllUrl,
selection: [],
// 表格列配置
columns: [
{title: "年份", dataIndex: "year",sorter: true,},
{
title: "考核城市",
dataIndex: "assessmentCity",
},
{
title: "水资源一级区名称",
dataIndex: "waterResourcesFirstLevelZoneName",
},
{
title: "水资源二级级区名称",
dataIndex: "waterResourcesTwoLevelZoneName",
},
{
title: "水资源三级区名称",
dataIndex: "waterResourcesThreeLevelZoneName",
// customRender: ({text})=>{
// return text!=undefined? text.toFixed(1):undefined
// }
},
{
title: "河流、湖库名称",
dataIndex: "riverLakeLibrary",
},
{
title: "二级水功能区名称",
dataIndex: "secondLevelWaterFunctionZoneName",
},
{
title: "水功能区编码",
dataIndex: "waterFunctionalAreaCode",
},
{
title: "水功能区等级",
dataIndex: "waterFunctionalAreaLevel",
},
{
title: "水功能区类型",
dataIndex: "waterFunctionalAreaType",
},
{
title: "水域类型",
dataIndex: "basinType",
},
{
title: "断面名称",
dataIndex: "sectionName",
},
{
title: "水质目标",
dataIndex: "waterQualityGoal",
},
{
title: "河流长度Km",
dataIndex: "riverLength",
},
{
title: "湖泊面积km2",
dataIndex: "lakeArea",
},
{
title: "备注",
dataIndex: "remark",
},
{
title: "操作",
key: "action",
width: 150,
align: "center",
fixed: "right",
slots: {
customRender: "action",
},
},
],
// 表格搜索条件
where: {},
// 表格选中数据
selectionList: [],
// 是否显示编辑弹窗
showEdit: false,
// 表单数据
form: {},
loading: false,
rules: {
year: [{required: true, message: '请输入年份'}],
assessmentCity:[{ required:true,message: "请输入考核城市"}],
waterResourcesFirstLevelZoneName:[{required:true,message: "请输入水资源一级区名称"}],
waterResourcesTwoLevelZoneName:[{
required:true,message: "请输入水资源二级级区名称",
}],
waterResourcesThreeLevelZoneName:[{
required:true,message: "请输入水资源三级区名称",
}],
riverLakeLibrary:[{
required:true,message: "请输入河流、湖库名称",
}],
secondLevelWaterFunctionZoneName:[{
required:true,message: "请输入二级水功能区名称",
}],
waterFunctionalAreaCode:[{
required:true,message: "请输入水功能区编码",
}],
waterFunctionalAreaLevel:[{
required:true,message: "请输入水功能区等级",
}],
waterFunctionalAreaType:[{
required:true,message: "请输入水功能区类型",
}],
basinType:[{
required:true,message: "请输入水域类型",
}],
sectionName:[{
required:true,message: "请输入断面名称",
}],
waterQualityGoal:[ {
required:true,message: "请输入水质目标",
}],
riverLength:[{
required:true,message: "请输入河流长度Km",
}],
lakeArea:[{
required:true,message: "请输入湖泊面积km2",
}],
remark:[{
required:true,message: "请输入备注",
}]
},
yearOptions: [],
showNYear:false,
cYear: undefined,
nYear:undefined,
};
},
mounted() {
this.getOptions();
},
methods: {
minLeqChange(e){
console.log(e)
},
/* 刷新表格 */
reload() {
this.$refs.table.reload({
where: this.where,
});
},
/* 重置搜索 */
reset() {
this.where = {};
this.reload();
},
/* 打开编辑弹窗 */
openEdit(row) {
// cloneRecord.mi
this.form = Object.assign({}, row);
this.showEdit = true;
this.$nextTick(() => {
this.$refs.form.clearValidate(); // 清除表单验证信息
});
},
async save() {
await this.$refs.form.validate();
// const {minLeq,maxLeq } = this.form;
// if(minLeq == undefined && maxLeq == undefined ){
// message.error("最小值和最大值请至少填写一项!")
// return;
// }
const hide = this.$message.loading('请求中..', 0);
const form = this.form;
if (form.autonomousWaterFunctionAreaPointId) {
updateStandard(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();
});
} else {
saveStandard(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);
removeStandard(row.autonomousWaterFunctionAreaPointId).then((res) => {
hide();
if (res.data.code === 0) {
this.$message.success(res.data.msg);
this.reload();
} else {
this.$message.error(res.data.msg);
}
}).catch(e => {
hide();
this.$message.error(e.message);
})
},
/* 批量删除 */
removeBatch() {
const hide = this.$message.loading('请求中..', 0);
const ids = this.selectionList.map((item) => item.autonomousWaterFunctionAreaPointId);
removeBatchStandard(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.message);
}).finally(() => {
hide();
})
},
getOptions(){
getColumnOptions("year").then(res => {
console.log(res)
if (res.data.code == 0) {
this.yearOptions = res.data.data.map(item => {
return {
label: item,
value: item
}
})
}
})
},
setCYear(e){
this.cYear = e.key;
this.showNYear = true;
},
copyBatch(){
const hide = this.$message.loading('请求中..', 0);
copyBatchStandard({cyear:Number(this.cYear),nyear:this.nYear}).then(res=>{
if (res.data.code === 0) {
this.$message.success(res.data.msg);
this.reload();
this.getOptions();
} else {
this.$message.error(res.data.msg);
}
this.showNYear = false;
}).catch(e => {
this.$message.error(e.message);
}).finally(() => {
hide();
})
},
exportData(){
const columns = this.columns.filter(item=>item.dataIndex);
const arr = [];
const th = columns.map((item) => item.title);
arr.push(th);
this.data.forEach((d) => {
const td = columns.map((item) => d[item.dataIndex]);
arr.push(td);
});
let sheet = XLSX.utils.aoa_to_sheet(arr);
this.$util.exportSheet(XLSX, sheet, new Date().getTime().toString());
}
},
};
</script>
<style scoped lang="less">
</style>

View File

@@ -0,0 +1,51 @@
<template>
<div class="ele-body">
<a-card :bordered="false">
<a-tabs v-model:activeKey="activeKey">
<a-tab-pane key="place" tab="江河水点位信息">
<place></place>
</a-tab-pane>
<a-tab-pane key="evaluation" tab="自治区级水功能区点位信息">
<autonomous></autonomous>
</a-tab-pane>
<a-tab-pane key="aqi" tab="国家级水功能区点位信息">
<aqi-relate></aqi-relate>
</a-tab-pane>
<a-tab-pane key="water" tab="水站点位信息">
<water></water>
</a-tab-pane>
</a-tabs>
</a-card>
</div>
</template>
<script>
import autonomous from "./autonomous"
import AqiRelate from "./api-relate"
import Place from "./place"
import Water from "./water"
export default {
name: 'waterDictIndex',
components: {
autonomous,
Place,
AqiRelate,
Water
},
data() {
return {
activeKey: 'place'
};
},
methods: {}
}
</script>
<style scoped>
</style>

View File

@@ -0,0 +1,428 @@
<template>
<div class="ele-body">
<a-card :bordered="false">
<a-form
:model="where"
:wrapper-col="{ md: { span: 18 }, sm: { span: 24 } }"
>
<a-row>
<a-col :lg="6" :md="12" :sm="24" :xs="24">
<a-form-item label="年份:">
<a-select v-model:value="where.year" allow-clear show-search>
<a-select-option
v-for="(item) in yearOptions"
:key="item.value"
>{{ item.label }}
</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col :lg="6" :md="12" :sm="24" :xs="24">
<a-space>
<a-button type="primary" @click="reload">查询</a-button>
<a-button @click="reset">重置</a-button>
</a-space>
</a-col>
</a-row>
<a-row>
</a-row>
</a-form>
<a-modal
v-model:visible="showNYear"
:title="'批量复制'"
:confirm-loading="loading"
:body-style="{ paddingBottom: '8px' }"
@ok="copyBatch"
>
<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-form-item label="新年份" name="nYear">
<a-input-number id="inputNumber" v-model:value="nYear" :min="1970" :max="2050" />
</a-form-item>
</a-form>
</a-modal>
<a-modal
v-model:visible="showEdit"
:title="form.surfaceWaterPointId !== undefined ? '修改' : '添加'"
:confirm-loading="loading"
:width="800"
: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-form-item label="年份" name="year">
<a-input-number v-model:value="form.year" :min="1970" :max="2050" />
</a-form-item>
<a-form-item label="断面编码" name="sectionCode">
<a-input v-model:value="form.sectionCode" placeholder="请输入断面编码" allow-clear />
</a-form-item>
<a-form-item label="断面名称" name="sectionName">
<a-input v-model:value="form.sectionName" placeholder="请输入断面名称" allow-clear />
</a-form-item>
<a-form-item label="所属省份" name="province">
<a-input v-model:value="form.province" placeholder="请输入所属省份" allow-clear />
</a-form-item>
<a-form-item label="所属城市" name="city">
<a-input v-model:value="form.city" placeholder="请输入所属城市" allow-clear />
</a-form-item>
<a-form-item label="考核省份" name="assessmentProvince">
<a-input v-model:value="form.assessmentProvince" placeholder="请输入考核省份" allow-clear />
</a-form-item>
<a-form-item label="断面类型" name="sectionType">
<a-input v-model:value="form.sectionType" placeholder="请输入断面类型" allow-clear />
</a-form-item>
<a-form-item label="断面属性" name="sectionAttribute">
<a-input v-model:value="form.sectionAttribute" placeholder="请输入断面属性" allow-clear />
</a-form-item>
<a-form-item label="水质目标" name="waterTarget">
<a-input v-model:value="form.waterTarget" placeholder="请输入水质目标" allow-clear />
</a-form-item>
<a-form-item label="流域" name="basin">
<a-input v-model:value="form.basin" placeholder="请输入流域" allow-clear />
</a-form-item>
<a-form-item label="水系" name="riverSystem">
<a-input v-model:value="form.riverSystem" placeholder="请输入水系" allow-clear />
</a-form-item>
<a-form-item label="所在水体" name="waterBody">
<a-input v-model:value="form.waterBody" placeholder="请输入所在水体" allow-clear />
</a-form-item>
<a-form-item label="汇入水体" name="importWaterBody">
<a-input v-model:value="form.importWaterBody" placeholder="请输入汇入水体" allow-clear />
</a-form-item>
<a-form-item label="河流级别" name="riverLevel">
<a-input v-model:value="form.riverLevel" placeholder="请输入河流级别" allow-clear />
</a-form-item>
</a-form>
</a-modal>
<!-- 表格 -->
<ele-pro-table
v-model:selection="selectionList"
ref="table"
row-key="surfaceWaterPointId"
:datasource="url"
:columns="columns"
:where="where"
:scroll="{ x: 'max-content' }"
@done="(d) => (data = d.data)"
>
<template #toolbar>
<a-space>
<a-button @click="openEdit" type="primary">新增</a-button>
<a-dropdown>
<template #overlay>
<a-menu @click="setCYear">
<a-menu-item v-for="item in yearOptions" :key="item.value">
{{ item.label }}
</a-menu-item>
</a-menu>
</template>
<a-button>
批量复制
<DownOutlined/>
</a-button>
</a-dropdown>
<a-popconfirm
:disabled="selectionList.length == 0"
:title="`确认删除${selectionList.length}条数据吗?`"
ok-text="Yes"
cancel-text="No"
@confirm="removeBatch"
>
<a-button
:disabled="selectionList.length == 0"
type="primary"
ghost
danger
>删除
</a-button>
</a-popconfirm>
<a-button @click="exportData" type="primary">导出</a-button>
</a-space>
</template>
<template #action="{ record }">
<a-space>
<a-button
@click="openEdit(record)"
type="primary"
shape="round"
size="small"
>修改</a-button
>
<a-popconfirm
:title="`确认删除这条数据吗?`"
ok-text="Yes"
cancel-text="No"
@confirm="remove(record)"
>
<a-button type="primary" danger shape="round" size="small"
>删除</a-button
>
</a-popconfirm>
</a-space>
</template>
</ele-pro-table>
</a-card>
</div>
<!-- 编辑弹窗 -->
</template>
<script>
// import _ from "lodash";
import {
listAllUrl,
savePlace,
updatePlace,
removePlace,
removeBatchPlace,
copyBatchPlace,
getColumnOptions
} from "@/api/ecology/water/river-plcae";
import XLSX from "xlsx";
import {DownOutlined} from '@ant-design/icons-vue';
// import moment from "moment";
export default {
name: "WaterPlace",
components: {DownOutlined},
data() {
return {
data: [],
// 表格数据接口
url: listAllUrl,
selection: [],
// 表格列配置
columns: [
{title: "年份", dataIndex: "year",sorter: true,},
{title: "断面编码",dataIndex: "sectionCode",sorter: true,},
{title: "断面名称",dataIndex: "sectionName",sorter: true,},
{title: "所属省份",dataIndex: "province",sorter: true,},
{title: "所属城市",dataIndex: "city",sorter: true,},
{
title: "考核省份",
dataIndex: "assessmentProvince",
sorter: true,
},
{
title: "断面类型",
dataIndex: "sectionType",
sorter: true,
},
{title: "断面属性",dataIndex: "sectionAttribute",sorter: true,},
{
title: "水质目标",
dataIndex: "waterTarget",
},
{title: "流域",dataIndex: "basin",sorter: true,},
{title: "水系",dataIndex: "riverSystem",sorter: true,},
{title: "所在水体",dataIndex: "waterBody",sorter: true,},
{title: "汇入水体",dataIndex: "importWaterBody",sorter: true,},
{title: "河流级别",dataIndex: "riverLevel",sorter: true,},
{
title: "操作",
key: "action",
width: 150,
align: "center",
fixed: "right",
slots: {
customRender: "action",
},
},
],
// 表格搜索条件
where: {},
// 表格选中数据
selectionList: [],
// 是否显示编辑弹窗
showEdit: false,
// 表单数据
form: {},
loading: false,
rules: {
year: [{required: true, message: '请输入年份'}],
sectionCode:[{required: true,message: '请输入断面编码'}],
sectionName:[{required: true,message: '请输入断面名称'}],
province: [{required: true,message: '请输入所属省份',},],
city: [{required: true,message: '请输入所属城市',},],
assessmentProvince:[{required: true,message: '请输入考核省份'}],
sectionType: [{required: true,message: '请输入断面类型',},],
sectionAttribute: [{required: true,message: '请输入断面属性',},],
waterTarget: [{required: true,message: '请输入水质目标',},],
basin: [{required: true,message: '请输入流域',},],
riverSystem:[{required: true,message: '请输入水系'}],
waterBody: [{required: true,message: '请输入所在水体',},],
importWaterBody: [{required: true,message: '请输入汇入水体',},],
riverLevel: [{required: true,message: '请输入河流级别',},],
},
yearOptions: [],
showNYear:false,
cYear: undefined,
nYear:undefined,
};
},
mounted() {
this.getOptions();
},
methods: {
/* 刷新表格 */
reload() {
this.$refs.table.reload({
where: this.where,
});
},
/* 重置搜索 */
reset() {
this.where = {};
this.reload();
},
/* 打开编辑弹窗 */
openEdit(row) {
// cloneRecord.mi
this.form = Object.assign({}, row);
this.showEdit = true;
this.$nextTick(() => {
this.$refs.form.clearValidate(); // 清除表单验证信息
});
},
async save() {
await this.$refs.form.validate();
const hide = this.$message.loading('请求中..', 0);
const form = this.form;
console.log(form,'form');
if (form.surfaceWaterPointId) {
updatePlace(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();
});
} else {
savePlace(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);
removePlace(row.surfaceWaterPointId).then((res) => {
hide();
if (res.data.code === 0) {
this.$message.success(res.data.msg);
this.reload();
} else {
this.$message.error(res.data.msg);
}
}).catch(e => {
hide();
this.$message.error(e.message);
})
},
/* 批量删除 */
removeBatch() {
const hide = this.$message.loading('请求中..', 0);
const ids = this.selectionList.map((item) => item.surfaceWaterPointId);
removeBatchPlace(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.message);
}).finally(() => {
hide();
})
},
getOptions(){
getColumnOptions("year").then(res => {
console.log(res)
if (res.data.code == 0) {
this.yearOptions = res.data.data.map(item => {
return {
label: item,
value: item
}
})
}
})
},
setCYear(e){
this.cYear = e.key;
this.showNYear = true;
},
copyBatch(){
const hide = this.$message.loading('请求中..', 0);
copyBatchPlace({cyear:Number(this.cYear),nyear:this.nYear}).then(res=>{
if (res.data.code === 0) {
this.$message.success(res.data.msg);
this.reload();
this.getOptions();
} else {
this.$message.error(res.data.msg);
}
this.showNYear = false;
}).catch(e => {
this.$message.error(e.message);
}).finally(() => {
hide();
})
},
exportData(){
const columns = this.columns.filter(item=>item.dataIndex);
const arr = [];
const th = columns.map((item) => item.title);
arr.push(th);
this.data.forEach((d) => {
const td = columns.map((item) => d[item.dataIndex]);
arr.push(td);
});
let sheet = XLSX.utils.aoa_to_sheet(arr);
this.$util.exportSheet(XLSX, sheet, new Date().getTime().toString());
}
},
};
</script>
<style scoped lang="less">
</style>

View File

@@ -0,0 +1,377 @@
<template>
<div class="ele-body">
<a-card :bordered="false">
<a-form
:model="where"
:wrapper-col="{ md: { span: 18 }, sm: { span: 24 } }"
>
<a-row>
<a-col :lg="6" :md="12" :sm="24" :xs="24">
<a-form-item label="年份:">
<a-select v-model:value="where.year" allow-clear show-search>
<a-select-option
v-for="(item) in yearOptions"
:key="item.value"
>{{ item.label }}
</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col :lg="6" :md="12" :sm="24" :xs="24">
<a-space>
<a-button type="primary" @click="reload">查询</a-button>
<a-button @click="reset">重置</a-button>
</a-space>
</a-col>
</a-row>
<a-row>
</a-row>
</a-form>
<a-modal
v-model:visible="showNYear"
:title="'批量复制'"
:confirm-loading="loading"
:body-style="{ paddingBottom: '8px' }"
@ok="copyBatch"
>
<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-form-item label="新年份" name="nYear">
<a-input-number id="inputNumber" v-model:value="nYear" :min="1970" :max="2050" />
</a-form-item>
</a-form>
</a-modal>
<a-modal
v-model:visible="showEdit"
:title="form.waterStationPointId !== undefined ? '修改' : '添加'"
:confirm-loading="loading"
:width="800"
: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-form-item label="年份" name="year">
<a-input-number v-model:value="form.year" :min="1970" :max="2050" />
</a-form-item>
<a-form-item label="所在河流名称" name="riverName">
<a-input v-model:value="form.riverName" placeholder="请输入所在河流名称" allow-clear />
</a-form-item>
<a-form-item label="自动站名称" name="stationName">
<a-input v-model:value="form.stationName" placeholder="请输入自动站名称" allow-clear />
</a-form-item>
<a-form-item label="所属系统" name="system">
<a-select v-model:value="form.system" allowClear placeholder="未选择">
<a-select-option :value="'1'">国家水站</a-select-option>
<a-select-option :value="'2'">广西水系统</a-select-option>
</a-select>
</a-form-item>
<a-form-item label="水质目标" name="waterTarget">
<a-input v-model:value="form.waterTarget" placeholder="请输入水质目标" allow-clear />
</a-form-item>
</a-form>
</a-modal>
<!-- 表格 -->
<ele-pro-table
v-model:selection="selectionList"
ref="table"
row-key="waterStationPointId"
:datasource="url"
:columns="columns"
:where="where"
:scroll="{ x: 'max-content' }"
@done="(d) => (data = d.data)"
>
<template #toolbar>
<a-space>
<a-button @click="openEdit" type="primary">新增</a-button>
<a-dropdown>
<template #overlay>
<a-menu @click="setCYear">
<a-menu-item v-for="item in yearOptions" :key="item.value">
{{ item.label }}
</a-menu-item>
</a-menu>
</template>
<a-button>
批量复制
<DownOutlined/>
</a-button>
</a-dropdown>
<a-popconfirm
:disabled="selectionList.length == 0"
:title="`确认删除${selectionList.length}条数据吗?`"
ok-text="Yes"
cancel-text="No"
@confirm="removeBatch"
>
<a-button
:disabled="selectionList.length == 0"
type="primary"
ghost
danger
>删除
</a-button>
</a-popconfirm>
<a-button @click="exportData" type="primary">导出</a-button>
</a-space>
</template>
<template #action="{ record }">
<a-space>
<a-button
@click="openEdit(record)"
type="primary"
shape="round"
size="small"
>修改</a-button
>
<a-popconfirm
:title="`确认删除这条数据吗?`"
ok-text="Yes"
cancel-text="No"
@confirm="remove(record)"
>
<a-button type="primary" danger shape="round" size="small"
>删除</a-button
>
</a-popconfirm>
</a-space>
</template>
</ele-pro-table>
</a-card>
</div>
<!-- 编辑弹窗 -->
</template>
<script>
// import _ from "lodash";
import {
listAllUrl,
savePlace,
updatePlace,
removePlace,
removeBatchPlace,
copyBatchPlace,
getColumnOptions
} from "@/api/ecology/water/river-water";
import XLSX from "xlsx";
import {DownOutlined} from '@ant-design/icons-vue';
// import moment from "moment";
export default {
name: "water",
components: {DownOutlined},
data() {
return {
data: [],
// 表格数据接口
url: listAllUrl,
selection: [],
// 表格列配置
columns: [
{title: "年份", dataIndex: "year",sorter: true,},
{title: "所在河流名称",dataIndex: "riverName",sorter: true,},
{title: "自动站名称",dataIndex: "stationName",sorter: true,},
{title: "所属系统",dataIndex: "system",sorter: true,customRender:({text})=> text == "1"?"国家水站":"广西水系统"},
{
title: "水质目标",
dataIndex: "waterTarget",
},
{
title: "操作",
key: "action",
width: 150,
align: "center",
fixed: "right",
slots: {
customRender: "action",
},
},
],
// 表格搜索条件
where: {},
// 表格选中数据
selectionList: [],
// 是否显示编辑弹窗
showEdit: false,
// 表单数据
form: {},
loading: false,
rules: {
year: [{required: true, message: '请输入年份'}],
riverName:[{required: true,message: '请输入所在河流名称'}],
stationName:[{required: true,message: '请输入自动站名称'}],
system: [{required: true,message: '请输入所属系统',},],
waterTarget: [{required: true,message: '请输入水质目标',},],
},
yearOptions: [],
showNYear:false,
cYear: undefined,
nYear:undefined,
};
},
mounted() {
this.getOptions();
},
methods: {
/* 刷新表格 */
reload() {
this.$refs.table.reload({
where: this.where,
});
},
/* 重置搜索 */
reset() {
this.where = {};
this.reload();
},
/* 打开编辑弹窗 */
openEdit(row) {
// cloneRecord.mi
this.form = Object.assign({}, row);
this.showEdit = true;
this.$nextTick(() => {
this.$refs.form.clearValidate(); // 清除表单验证信息
});
},
async save() {
await this.$refs.form.validate();
const hide = this.$message.loading('请求中..', 0);
const form = this.form;
console.log(form,'form');
if (form.waterStationPointId) {
updatePlace(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();
});
} else {
savePlace(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);
removePlace(row.waterStationPointId).then((res) => {
hide();
if (res.data.code === 0) {
this.$message.success(res.data.msg);
this.reload();
} else {
this.$message.error(res.data.msg);
}
}).catch(e => {
hide();
this.$message.error(e.message);
})
},
/* 批量删除 */
removeBatch() {
const hide = this.$message.loading('请求中..', 0);
const ids = this.selectionList.map((item) => item.waterStationPointId);
removeBatchPlace(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.message);
}).finally(() => {
hide();
})
},
getOptions(){
getColumnOptions("year").then(res => {
console.log(res)
if (res.data.code == 0) {
this.yearOptions = res.data.data.map(item => {
return {
label: item,
value: item
}
})
}
})
},
setCYear(e){
this.cYear = e.key;
this.showNYear = true;
},
copyBatch(){
const hide = this.$message.loading('请求中..', 0);
copyBatchPlace({cyear:Number(this.cYear),nyear:this.nYear}).then(res=>{
if (res.data.code === 0) {
this.$message.success(res.data.msg);
this.reload();
this.getOptions();
} else {
this.$message.error(res.data.msg);
}
this.showNYear = false;
}).catch(e => {
this.$message.error(e.message);
}).finally(() => {
hide();
})
},
exportData(){
const columns = this.columns.filter(item=>item.dataIndex);
const arr = [];
const th = columns.map((item) => item.title);
arr.push(th);
this.data.forEach((d) => {
const td = columns.map((item) => d[item.dataIndex]);
arr.push(td);
});
let sheet = XLSX.utils.aoa_to_sheet(arr);
this.$util.exportSheet(XLSX, sheet, new Date().getTime().toString());
}
},
};
</script>
<style scoped lang="less">
</style>

View File

@@ -1,128 +1,301 @@
<template>
<div class="ele-body">
<a-card :bordered="false">
<!-- 搜索表单 -->
<a-form
:model="where"
:label-col="{ md: { span: 6 }, sm: { span: 24 } }"
:wrapper-col="{ md: { span: 18 }, sm: { span: 24 } }"
>
<a-row>
<a-col :lg="6" :md="12" :sm="24" :xs="24">
<a-form-item label="测点名称:">
<a-select v-model:value="where.place" allowClear showSearch>
<a-select-option
v-for="(item) in palceOptions"
:key="item.value"
>{{ item.label }}</a-select-option
>
</a-select>
</a-form-item>
</a-col>
<a-col :lg="6" :md="12" :sm="24" :xs="24">
<a-form-item class="ele-text-right" :wrapper-col="{ span: 24 }">
<a-space>
<a-button type="primary" @click="reload">查询</a-button>
<a-button @click="reset">重置</a-button>
<a-button @click="exportFile">导出Excel</a-button>
</a-space>
</a-form-item>
</a-col>
</a-row>
</a-form>
<!-- 表格 -->
<ele-pro-table
v-model:selection="selectionList"
ref="table"
row-key="zoneNoiseId"
:datasource="url"
:columns="columns"
:where="where"
:scroll="{ x: 'max-content' }"
@done="(d) => (data = d.data)"
>
<div class="ele-body">
<a-card :bordered="false">
<!-- 搜索表单 -->
<a-form
:model="where"
layout="inline"
>
<a-form-item label="起始日期:">
<a-date-picker valueFormat="YYYY-MM-DD 00:00:00" v-model:value="where.timeStart"></a-date-picker>
</a-form-item>
<a-form-item label="结束日期:">
<a-date-picker valueFormat="YYYY-MM-DD 23:59:59" v-model:value="where.timeEnd"></a-date-picker>
</a-form-item>
<a-form-item label="区域等级:">
<a-select v-model:value="where.regionLevel" placeholder="选择区域等级" allowClear showSearch>
<a-select-option
v-for="(item) in regionLevelOptions"
:key="item.value"
>{{ item.label }}
</a-select-option>
</a-select>
</a-form-item>
<a-form-item label="监测点:">
<a-select v-model:value="where.place" placeholder="选择监测点" allowClear showSearch>
<a-select-option
v-for="(item) in placeOptions"
:key="item.value"
>{{ item.label }}
</a-select-option
>
</a-select>
</a-form-item>
</ele-pro-table>
</a-card>
</div>
<!-- 编辑弹窗 -->
<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>
<!-- 表格 -->
<ele-pro-table
v-model:selection="selectionList"
ref="table"
row-key="ambientAirId"
:datasource="url"
:columns="columns"
:where="where"
:scroll="{ x: 'max-content' }"
@done="(d) => (data = d.data)"
:init-load="false"
>
</ele-pro-table>
</a-card>
</div>
<!-- 编辑弹窗 -->
</template>
<script>
// import _ from "lodash";
import XLSX from "xlsx";
import { pageZoneNoiseUrl, getColumnOptions } from "@/api/ecology/river";
import {pageAirUrl, getColumnOptions, listAllAir} from "@/api/ecology/atmosphere/air";
import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
// import moment from "moment";
import moment from "moment";
// import utils from "./utils";
export default {
name: "StatisticRiverIndex",
components: {},
data() {
return {
data: [],
locale,
bill: {},
// 表格数据接口
url: pageZoneNoiseUrl,
selection: [],
// 表格列配置
columns: [
name: "StatisticAirBase",
components: {},
data() {
const year = new Date().getFullYear();
return {
data: [],
locale,
bill: {},
// 表格数据接口
url: pageAirUrl,
selection: [],
// 表格列配置
columns: [
{
title: "监测日期",
dataIndex: "monitorTime",
sorter: true,
customRender: ({text}) => moment(text).format("YYYY-MM-DD")
},
{
title: "城市",
dataIndex: "city",
sorter: true,
},
{
title: "测点名称",
dataIndex: "place",
sorter: true,
},
{
title: "SO2/(μg/m3)",
dataIndex: "so2",
sorter: true,
},
{
title: "NO2/(μg/m3)",
dataIndex: "no2",
sorter: true,
},
{
title: "PM10/(μg/m3)",
dataIndex: "pm10",
sorter: true,
},
{
title: "CO/(mg/m3)",
dataIndex: "co",
sorter: true,
},
{
title: "臭氧O3最大8小时滑动平均浓度/(μg/m3)",
dataIndex: "o3",
sorter: true,
},
{
title: "PM2.5",
dataIndex: "pm25",
sorter: true,
},
{
title: "空气质量指数AQI",
dataIndex: "aqi",
sorter: true,
},
{
title: "首要污染物",
dataIndex: "primaryPollutant",
sorter: true,
},
{
title: "空气质量指数级别",
dataIndex: "aqiLevel",
sorter: true,
},
{
title: "空气质量状况",
dataIndex: "airQualityStatus",
sorter: true,
},
{
title: "备注",
dataIndex: "remark",
sorter: true,
},
{
title: "创建人",
dataIndex: "username",
sorter: true,
}
],
regionLevelOptions: [
{label: "市区", value: "city"},
{label: "城区", value: "area"},
{label: "县区", value: "county"},
{label: "站点", value: "place"},
],
placeOptions:[],
time:[],
// 表格搜索条件
where: {
checked: 1,
timeStart: moment(`${year}-01-01 00:00:00`).format("YYYY-MM-DD 00:00:00"),
timeEnd: moment().format("YYYY-MM-DD 23:59:59")
},
// 表格选中数据
selectionList: [],
};
},
mounted() {
this.loadOptionData();
this.reload();
},
methods: {
/**获取下来框数据 */
loadOptionData() {
getColumnOptions("place").then((res) => {
this.placeOptions = res.data.data.map((item) => {
return {
label: item,
value: item,
};
});
});
},
/* 刷新表格 */
reload() {
this.$refs.table.reload({
where: this.where,
});
},
/* 重置搜索 */
reset() {
this.where = {
checked: 1,
};
this.reload();
},
exportFile() {
],
palceOptions: [],
// 表格搜索条件
where: {
checked: 1,
},
// 表格选中数据
selectionList: [],
};
},
mounted() {
this.loadOptionData();
},
methods: {
/**获取下来框数据 */
loadOptionData() {
getColumnOptions("place").then((res) => {
this.palceOptions = res.data.data.map((item) => {
return {
label: item,
value: item,
};
});
});
},
/* 刷新表格 */
reload() {
this.$refs.table.reload({
where: this.where,
});
},
/* 重置搜索 */
reset() {
this.where = {
checked: 1,
};
this.reload();
},
exportFile() {
const columns = [];
const columns = [
{
title: "监测日期",
dataIndex: "monitorTime",
sorter: true,
customRender: ({text}) => moment(text).format("YYYY-MM-DD HH:mm")
},
{
title: "城市",
dataIndex: "city",
sorter: true,
},
{
title: "测点名称",
dataIndex: "place",
sorter: true,
},
{
title: "SO2/(μg/m3)",
dataIndex: "so2",
sorter: true,
},
{
title: "NO2/(μg/m3)",
dataIndex: "no2",
sorter: true,
},
{
title: "PM10/(μg/m3)",
dataIndex: "pm10",
sorter: true,
},
{
title: "CO/(mg/m3)",
dataIndex: "co",
sorter: true,
},
{
title: "臭氧O3最大8小时滑动平均浓度/(μg/m3)",
dataIndex: "o3",
sorter: true,
},
{
title: "PM2.5",
dataIndex: "pm25",
sorter: true,
},
{
title: "空气质量指数AQI",
dataIndex: "aqi",
sorter: true,
},
{
title: "首要污染物",
dataIndex: "primaryPollutant",
sorter: true,
},
{
title: "空气质量指数级别",
dataIndex: "aqiLevel",
sorter: true,
},
{
title: "空气质量状况",
dataIndex: "airQualityStatus",
sorter: true,
},
{
title: "备注",
dataIndex: "remark",
sorter: true,
},
];
const arr = [];
const th = columns.map((item) => item.title);
arr.push(th);
listAllAir(this.where).then(res => {
if (res.data.code == 0) {
res.data.data.forEach((d) => {
const td = columns.map((item) => d[item.dataIndex]);
arr.push(td);
});
let sheet = XLSX.utils.aoa_to_sheet(arr);
this.$util.exportSheet(XLSX, sheet, moment(this.where.timeStart).format("YYYY年MM月DD日") + "至" + moment(this.where.timeEnd).format("YYYY年MM月DD日") + "基础数据");
const arr = [];
const th = columns.map((item) => item.title);
arr.push(th);
this.data.forEach((d) => {
const td = columns.map((item) => d[item.dataIndex]);
arr.push(td);
});
let sheet = XLSX.utils.aoa_to_sheet(arr);
this.$util.exportSheet(XLSX, sheet, new Date().getTime().toString());
}
})
},
},
},
};
</script>
<style scoped lang="less">
</style>
</style>

View File

@@ -5,6 +5,18 @@
<a-tab-pane key="base" tab="数据总览">
<base-statistic></base-statistic>
</a-tab-pane>
<!-- <a-tab-pane v-show="false" key="avg" tab="均值、百分位">-->
<!-- <avg-statistic></avg-statistic>-->
<!-- </a-tab-pane>-->
<a-tab-pane key="ccp" tab="市、县、站点统计">
<city-county-place></city-county-place>
</a-tab-pane>
<a-tab-pane key="area" tab="城区分担浓度统计">
<area-base></area-base>
</a-tab-pane>
<!-- <a-tab-pane key="avg" tab="均值、百分位">-->
<!-- <avg-statistic></avg-statistic>-->
<!-- </a-tab-pane>-->
</a-tabs>
</a-card>
</div>
@@ -17,17 +29,19 @@
*
*/
import BaseStatistic from "./base.vue";
import AvgStatistic from "./avg";
import CityCountyPlace from "./city-county-place";
import AreaBase from "./area-base";
export default {
name: 'StatisticSoundZone',
name: 'StatisticAirIndex',
components: {
BaseStatistic,
// eslint-disable-next-line vue/no-unused-components
BaseStatistic,AvgStatistic,CityCountyPlace,AreaBase
},
data() {
return {
activeKey: 'base'
activeKey: 'ccp'
};
},

View File

@@ -53,4 +53,25 @@ const tableColumns = [
];
export {tableColumns}
const tableCityColumns = [
{title: "城区", dataIndex: "area", sorter: true,},
{title: "县", dataIndex: "county", sorter: true,},
{title: "所在流域", dataIndex: "watershed", sorter: true,},
{title: "所在河流", dataIndex: "river", sorter: true,},
{title: "断面名称", dataIndex: "sectionName", sorter: true,},
{title: "站点名称", dataIndex: "place", sorter: true,},
{title: "本期水质", dataIndex: "periodWaterQuality", sorter: true,},
{title: "水温", dataIndex: "waterTemperature", sorter: true,},
{title: "pH值", dataIndex: "ph", sorter: true,},
{title: "溶解氧", dataIndex: "dissolvedOxygen", sorter: true,},
{title: "电导率", dataIndex: "conductivity", sorter: true,},
{title: "浊度", dataIndex: "turbidity", sorter: true,},
{title: "高锰酸盐指数", dataIndex: "permanganateIndex", sorter: true,},
{title: "氨氮", dataIndex: "ammonia", sorter: true,},
{title: "总磷", dataIndex: "totalPhosphorus", sorter: true,},
{title: "总氮", dataIndex: "totalNitrogen", sorter: true,},
{title: "主要污染指标(超标倍数)", dataIndex: "mainPollutionIndicators", sorter: true,},
];
export {tableColumns,tableCityColumns}

View File

@@ -133,6 +133,12 @@
customRender: 'billName',
},
},
{
title: '行政类型',
dataIndex: 'regionLevel',
sorter: true,
},
{
title: '条目',
@@ -221,9 +227,15 @@
this.reload();
},
detail(record) {
this.$router.replace({
path: "/water/river/acid/collect/water/" + record.nationalLevelWaterFunctionAreaBillId
})
if(record.regionLevel == "1"){ //国家级
this.$router.push({
path: "/water/river/function/collect/water/" + record.nationalLevelWaterFunctionAreaBillId
})
}else{
this.$router.push({
path: "/water/river/function/city/collect/water/" + record.nationalLevelWaterFunctionAreaBillId
})
}
},
edit(record) {
this.editableData[record.nationalLevelWaterFunctionAreaBillId] = _.cloneDeep(record);

View File

@@ -0,0 +1,325 @@
<!-- 江河水站导入数据列表页面 -->
<template>
<div class="ele-body">
<a-card :bordered="false">
<!-- 搜索表单 -->
<a-form
:model="where"
:label-col="{ md: { span: 8 }, sm: { span: 24 } }"
:wrapper-col="{ md: { span: 16 }, sm: { span: 24 } }"
>
<a-row>
<!-- <a-col :lg="6" :md="12" :sm="24" :xs="24">
<a-form-item label="城区">
<a-select v-model:value="where.area" allowClear showSearch>
<a-select-option
v-for="item in areaOptions"
:key="item.value"
>{{ item.label }}</a-select-option
>
</a-select>
</a-form-item>
</a-col> -->
<a-col :lg="6" :md="12" :sm="24" :xs="24">
<a-form-item class="ele-text-right" :wrapper-col="{ span: 24 }">
<a-space>
<a-button type="primary" @click="reload">查询</a-button>
<a-button @click="reset">重置</a-button>
</a-space>
</a-form-item>
</a-col>
</a-row>
</a-form>
<a-modal
v-model:visible="showEdit"
:title="form.waterStationWaterFunctionAreaId !== undefined ? '修改记录' : '添加记录'"
:confirm-loading="loading"
:width="1000"
:body-style="{ paddingBottom: '8px' }"
@ok="save"
>
<a-form
ref="form"
:model="form"
:rules="rules"
:label-col="{ md: { span: 24 }, sm: { span: 24 } }"
:wrapper-col="{ md: { span: 24 }, sm: { span: 24 } }"
layout="vertical"
labelAlign="left"
>
<a-row gutter="12" >
<a-col :md="12" :sm="24">
<a-form-item label="采样时间" name="monitorTime">
<a-date-picker
v-model:value="form.monitorTime"
:locale="locale"
/>
</a-form-item>
</a-col>
<a-col :md="12" :sm="24">
</a-col>
<template v-for="(item,index) in tableCityColumns" :key="index">
<template v-if="item.children">
<a-col v-for="(citem,cindex) in item.children" :key="cindex" :md="12" :sm="24">
<a-form-item :label="item.title + '-' + citem.title" :name="citem.dataIndex">
<a-input
v-model:value="form[citem.dataIndex]"
:placeholder="'请输入' +item.title + '-' + citem.title"
allow-clear
/>
</a-form-item>
</a-col>
</template>
<template v-else>
<a-col :md="12" :sm="24">
<a-form-item :label="item.title" :name="item.dataIndex">
<a-input
v-model:value="form[item.dataIndex]"
:placeholder="'请输入' + item.title"
allow-clear
/>
</a-form-item>
</a-col>
</template>
</template>
</a-row>
</a-form>
</a-modal>
<!-- 表格 -->
<ele-pro-table
v-model:selection="selectionList"
ref="table"
row-key="waterStationWaterFunctionAreaId"
:datasource="url"
:columns="columns"
:where="where"
:scroll="{ x: 'max-content' }"
>
<template v-if="bill.checked != 1" #toolbar>
<a-space>
<a-button @click="openEdit" type="primary">新增</a-button>
<a-popconfirm
:disabled="selectionList.length == 0"
:title="`确认删除${selectionList.length}条数据吗?`"
ok-text="Yes"
cancel-text="No"
@confirm="removeBatch"
>
<a-button
:disabled="selectionList.length == 0"
type="primary"
ghost
danger
>删除</a-button
>
</a-popconfirm>
</a-space>
</template>
<template #action="{ record }">
<a-space>
<a-button
@click="openEdit(record)"
type="primary"
shape="round"
size="small"
>修改</a-button
>
<a-popconfirm
:title="`确认删除这条数据吗?`"
ok-text="Yes"
cancel-text="No"
@confirm="remove(record)"
>
<a-button type="primary" danger shape="round" size="small"
>删除</a-button
>
</a-popconfirm>
</a-space>
</template>
</ele-pro-table>
</a-card>
</div>
<!-- 编辑弹窗 -->
</template>
<script>
import _ from "lodash";
import {
pageRiverStationUrl,
saveRiverStation,
removeRiverStation,
removeBatchRiverStation,
updateRiverStation,
getRiverStationBill,
} from "@/api/ecology/river-station";
import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
import { tableCityColumns } from "./colums";
// import utils from "./utils";
export default {
name: "RiverStationCollectWater",
components: {},
data() {
const { billId } = this.$route.params;
return {
locale,
bill: {},
// 表格数据接口
url: pageRiverStationUrl,
selection: [],
tableCityColumns,
// 表格列配置
columns: [
...tableCityColumns,
{
title: "创建人",
dataIndex: "userName",
sorter: true,
},
{
title: "操作",
key: "action",
width: 150,
align: "center",
fixed: "right",
slots: {
customRender: "action",
},
},
],
// 表格搜索条件
waterStationWaterFunctionAreaBillId: billId,
where: {
waterStationWaterFunctionAreaBillId: billId,
},
// 表格选中数据
selectionList: [],
// 是否显示编辑弹窗
showEdit: false,
// 表单数据
form: {},
loading: false,
rules: {},
};
},
mounted() {
const { billId } = this.$route.params;
getRiverStationBill(billId).then((res) => {
this.bill = res.data.data;
if (res.data.data.checked == 1) {
this.columns.splice(this.columns.length - 1, 1);
}
});
this.loadOptionData();
},
methods: {
/**获取下来框数据 */
loadOptionData() {},
/* 刷新表格 */
reload() {
console.log("--------------------------")
console.log(this.url);
this.$refs.table.reload({
where: this.where,
});
},
/* 重置搜索 */
reset() {
this.where = {
waterStationWaterFunctionAreaBillId: this.waterStationWaterFunctionAreaBillId,
};
this.reload();
},
/* 显示编辑 */
openEdit(record) {
const cloneRecord = _.cloneDeep(record);
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);
if (form.waterStationWaterFunctionAreaId) {
updateRiverStation(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.waterStationWaterFunctionAreaBillId = this.waterStationWaterFunctionAreaBillId;
form.userId = this.$store.state.user.user.userId
saveRiverStation(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);
removeRiverStation(row.waterStationWaterFunctionAreaId)
.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.waterStationWaterFunctionAreaId);
const hide = this.$message.loading("请求中..", 0);
removeBatchRiverStation(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>

View File

@@ -255,14 +255,13 @@ export default {
},
save() {
console.log("save开始"+this.form)
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.samplingTime = date.getTime();
// form.monitorYear = date.getFullYear();
// form.monitorMonth = date.getMonth() + 1;
@@ -272,6 +271,7 @@ export default {
delete form["monitorDate"];
delete form["monitorTime"];
if (form.nationalLevelWaterFunctionAreaId) {
console.log("编辑开始"+form)
updateWaterFunctionArea(form)
.then((res) => {
if (res.data.code == 0) {
@@ -290,7 +290,9 @@ export default {
hide();
});
} else {
console.log("保存开始"+form);
form.nationalLevelWaterFunctionAreaBillId = this.nationalLevelWaterFunctionAreaBillId;
form.userId = this.$store.state.user.user.userId
saveWaterFunctionArea(form)
.then((res) => {
if (res.data.code == 0) {