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

饮用水前端页面更新（参数和接口需要修改）

Browse Source
This commit is contained in:
710356044
2021-11-30 14:45:46 +08:00
parent c96991618b
commit 72d9573629
17 changed files with 1612 additions and 293 deletions
Download Patch File Download Diff File Expand all files Collapse all files

163
src/views/water/drinking-water/statistic/city-avg-index.vue Normal file
View File

@@ -0,0 +1,163 @@
<!-- 江河水查看数据页面-->
<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-form-item label="断面名称">
<a-select v-model:value="where.name" allowClear showSearch>
<a-select-option v-for="item in sectionInfo" :key="item.sectionName">{{ item.sectionName }}
</a-select-option>
</a-select>
</a-form-item>
<a-form-item label="开始时间:">
<a-month-picker v-model:value="where.startTime" :disabled-date="disabledDate" />
</a-form-item>
<a-form-item label="结束时间:">
<a-month-picker v-model:value="where.endTime" :disabled-date="disabledDate" />
</a-form-item>
<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>
<!-- 表格 -->
<a-spin :spinning="loading">
<ele-pro-table ref="table" :datasource="momData" :columns="columns" :where="where" :scroll="{ x: 'max-content' }"
@done="(d) => (data = d.data)">
</ele-pro-table>
</a-spin>
</a-card>
</div>
<!-- 编辑弹窗 -->
</template>
<script>
import {
listMonthCompositeIndex
} from "@/api/ecology/river-statis";
import {
listInfo
} from "@/api/ecology/water/river-plcae";
import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
import XLSX from "xlsx";
export default {
name: "RiverCollectWater",
components: {},
data() {
return {
data: [],
momData: [],
datasource: {},
columns: [{
title: '断面名称',
dataIndex: 'sectionName',
key: 'sectionName',
},
{
title: '水质综合指数排名',
dataIndex: 'orderBy',
key: 'orderBy',
},
{
title: "水质综合指数",
children: [{
title: "本月综合指数",
dataIndex: "baseIndex"
},
{
title: "上月综合指数",
dataIndex: "momIndex"
},
{
title: "上年同期指数",
dataIndex: "yoyIndex"
},
]
},
{
title: "水质综合指数变化率",
children: [{
title: "上月",
dataIndex: "momRateChange"
},
{
title: "上年同期",
dataIndex: "yoyRateChange"
},
]
},
],
locale,
bill: {},
selection: [],
where: {},
sectionInfo: {},
loading: false,
rules: {},
};
},
created() {
listInfo().then((res) => {
if (res.data.code == 0) {
console.log(res.data.data)
this.visibleWater = true;
this.sectionInfo = res.data.data
} else {
this.$message.error(res.data.msg);
}
})
},
methods: {
/* 刷新表格 */
reload() {
this.loading=true;
this.momData = [];
listMonthCompositeIndex(this.where).then((res) => {
console.log(res.data.data);
if (res.data.code == 0) {
this.$message.success(res.data.msg);
res.data.data.forEach((m) => {
this.momData.push(m);
})
} else {
this.$message.error(res.data.msg);
}
this.loading=false;
});
},
/* 重置搜索 */
reset() {
this.where = {};
this.reload();
},
/* 导出 */
exportFile() {
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>

168
src/views/water/drinking-water/statistic/city-base-standard.vue Normal file
View File

@@ -0,0 +1,168 @@
<!-- 当月水质目标-->
<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-form-item label="断面名称">
<a-select v-model:value="where.name" allowClear showSearch>
<a-select-option v-for="item in sectionInfo" :key="item.sectionName">{{ item.sectionName }}
</a-select-option>
</a-select>
</a-form-item>
<!-- <a-form-item label="年份:">
<a-date-picker valueFormat="YYYY" v-model:value="where.year"></a-date-picker>
</a-form-item>
<a-form-item label="月份:">
<a-date-picker valueFormat="MM" v-model:value="where.month"></a-date-picker>
</a-form-item> -->
<a-form-item label="查询时间:">
<a-month-picker v-model:value="where.startTime" :disabled-date="disabledDate" />
</a-form-item>
<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>
<!-- 表格 -->
<a-spin :spinning="loading">
<ele-pro-table ref="table" :datasource="momData" :columns="columns" :where="where"
:scroll="{ x: 'max-content' }" @done="(d) => (data = d.data)">
</ele-pro-table>
</a-spin>
</a-card>
</div>
<!-- 编辑弹窗 -->
</template>
<script>
import {
listMonthWaterQualitySandard
} from "@/api/ecology/river-statis";
import {
listInfo
} from "@/api/ecology/water/river-plcae";
import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
import XLSX from "xlsx";
export default {
name: "RiverCollectWater",
components: {},
data() {
return {
data: [],
momData: [],
datasource: {},
columns: [{
title: '断面类型',
dataIndex: 'sectionType',
key: 'sectionType',
},
{
title: '断面名称',
dataIndex: 'sectionName',
key: 'sectionName',
},
{
title: '考核城市',
dataIndex: 'city',
key: 'city',
},
{
title: '考核目标',
dataIndex: 'waterTarget',
key: 'waterTarget',
},
{
title: '水质类别',
dataIndex: 'waterQualityCategory',
key: 'waterQualityCategory',
},
{
title: '水质评价',
dataIndex: 'waterQualityEvaluate',
key: 'waterQualityEvaluate',
},
{
title: '上期水质类别',
dataIndex: 'waterQualityCategoryMom',
key: 'waterQualityCategoryMom',
},
{
title: '去年同期水质类别',
dataIndex: 'waterQualityCategoryYoy',
key: 'waterQualityCategoryYoy',
},
],
locale,
bill: {},
selection: [],
where: {},
sectionInfo: {},
loading: false,
rules: {},
};
},
created() {
listInfo().then((res) => {
if (res.data.code == 0) {
console.log(res.data.data)
this.visibleWater = true;
this.sectionInfo = res.data.data
} else {
this.$message.error(res.data.msg);
}
})
},
methods: {
/* 刷新表格 */
reload() {
this.loading = true;
this.momData = [];
listMonthWaterQualitySandard(this.where).then((res) => {
console.log(res.data.data);
if (res.data.code == 0) {
this.$message.success(res.data.msg);
res.data.data.forEach((m) => {
this.momData.push(m);
})
} else {
this.$message.error(res.data.msg);
}
this.loading = false;
});
},
/* 重置搜索 */
reset() {
this.where = {};
this.reload();
},
/* 导出 */
exportFile() {
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>

45
src/views/water/drinking-water/statistic/cityAppraise.vue
View File

@@ -8,50 +8,7 @@
: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.regionLevel" allowClear showSearch>
<a-select-option
v-for="(item) in regionLevelOptions"
: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 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 label="路段:">
<a-select v-model:value="where.road" allowClear showSearch>
<a-select-option
v-for="(item) in roadOptions"
: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 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>

103
src/views/water/drinking-water/statistic/cityDate.vue
View File

@@ -9,49 +9,59 @@
>
<a-row>
<a-col :lg="6" :md="12" :sm="24" :xs="24">
<a-form-item label="区域等级:">
<a-select v-model:value="where.regionLevel" allowClear showSearch>
<a-select-option
v-for="(item) in regionLevelOptions"
:key="item.value"
>{{ item.label }}</a-select-option
>
<a-form-item label="水源类型:">
<a-select v-model:value="where.waterSourceType" allowClear showSearch>
<a-select-option :value="'地表水'">地表水</a-select-option>
<a-select-option :value="'地下水'">地下水</a-select-option>
</a-select>
</a-form-item>
</a-col>
<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-form-item label="水源状态:">
<a-select v-model:value="where.waterSourceType" allowClear showSearch>
<a-select-option :value="'在用'">在用</a-select-option>
<a-select-option :value="'备用'">备用</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-form-item label="上报时间:">
<a-range-picker separator="~" v-model:value="reportTimeScope" />
</a-form-item>
<a-col :lg="6" :md="12" :sm="24" :xs="24">
<a-form-item label="路段:">
<a-select v-model:value="where.road" allowClear showSearch>
<a-select-option
v-for="(item) in roadOptions"
:key="item.value"
>{{ item.label }}</a-select-option
>
<a-form-item label="市级名称:">
<a-select v-model:value="where.city" allowClear showSearch>
<a-select-option :value="'1'">1</a-select-option>
<a-select-option :value="'2'">2</a-select-option>
</a-select>
</a-form-item>
</a-col>
<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-form-item label="县级名称:">
<a-select
mode="tags"
:size="size"
placeholder="选择县级名称 "
style="width: 200px"
@change="handleChange"
v-model:value="where.county"
>
<!-- <a-select-option
v-for="item in sourceWaterName"
:key="item.value"
>{{ item.label }}
</a-select-option> -->
<a-select-option :value="'1'">1</a-select-option>
<a-select-option :value="'2'">2</a-select-option>
<a-select-option :value="'3'">3</a-select-option>
<a-select-option :value="'4'">4</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>
@@ -75,17 +85,26 @@
@done="(d) => (data = d.data)"
>
<template #waterCode="{ text, record }">
<span>
{{
record.reportTime==null?text="":
record.reportTime.substr(5,2)=="01" || record.reportTime.substr(5,2) == "02" ||record.reportTime.substr(5,2) == "03" ||record.reportTime.substr(5,2)=="12"
? text="K":
record.reportTime.substr(5,2)=="04" || record.reportTime.substr(5,2) == "05" ||record.reportTime.substr(5,2)=="10"||record.reportTime.substr(5,2)=="11"
? text="P":
record.reportTime.substr(5,2)=="06" || record.reportTime.substr(5,2) == "07" ||record.reportTime.substr(5,2)=="08"||record.reportTime.substr(5,2)=="09"
? text="F":text="无采样时间"
record.reportTime == null
? (text = "")
: record.reportTime.substr(5, 2) == "01" ||
record.reportTime.substr(5, 2) == "02" ||
record.reportTime.substr(5, 2) == "03" ||
record.reportTime.substr(5, 2) == "12"
? (text = "K")
: record.reportTime.substr(5, 2) == "04" ||
record.reportTime.substr(5, 2) == "05" ||
record.reportTime.substr(5, 2) == "10" ||
record.reportTime.substr(5, 2) == "11"
? (text = "P")
: record.reportTime.substr(5, 2) == "06" ||
record.reportTime.substr(5, 2) == "07" ||
record.reportTime.substr(5, 2) == "08" ||
record.reportTime.substr(5, 2) == "09"
? (text = "F")
: (text = "无采样时间")
}}
</span>
</template>
@@ -102,7 +121,6 @@ import XLSX from "xlsx";
import {
pageDrinkingWaterStatisticUrl,
// getColumnOptions
} from "@/api/ecology/drinking-water";
// import pageDictUrl from "@/api/ecology/drinking-water-dict"
import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
@@ -114,7 +132,6 @@ export default {
name: "DrinkingWaterBase",
components: {},
data() {
return {
data: [],
@@ -133,9 +150,6 @@ export default {
...tableColumns,
],
// 表格列配置
// palceOptions: [],
@@ -155,7 +169,7 @@ export default {
},
methods: {
JumpFieldClick(record, column) {
console.log(column.dataIndex)
console.log(column.dataIndex);
},
/**获取下来框数据 */
@@ -195,7 +209,6 @@ export default {
// },
/* 刷新表格 */
reload() {
this.$refs.table.reload({
where: this.where,
});
@@ -208,9 +221,7 @@ export default {
this.reload();
},
exportFile() {
const columns = [
...tableColumns,
];
const columns = [...tableColumns];
const arr = [];
const th = columns.map((item) => item.title);
arr.push(th);

50
src/views/water/drinking-water/statistic/cityWaterQuality.vue
View File

@@ -8,50 +8,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.regionLevel" allowClear showSearch>
<a-select-option
v-for="(item) in regionLevelOptions"
:key="item.value"
>{{ item.label }}</a-select-option
<a-form-item label="水源类型:">
<a-select
v-model:value="where.waterSourceType"
allowClear
showSearch
>
<a-select-option :value="'地表水'">地表水</a-select-option>
<a-select-option :value="'地下水'">地下水</a-select-option>
</a-select>
</a-form-item>
</a-col>
<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 label="上报时间:">
<a-range-picker separator="~" v-model:value="reportTimeScope" />
</a-form-item>
</a-col>
<a-col :lg="6" :md="12" :sm="24" :xs="24">
<a-form-item label="路段:">
<a-select v-model:value="where.road" allowClear showSearch>
<a-select-option
v-for="(item) in roadOptions"
: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 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>

185
src/views/water/drinking-water/statistic/cityWaterWithdrawal.vue Normal file
View File

@@ -0,0 +1,185 @@
<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-form-item label="时间:">
<a-range-picker separator="~" v-model:value="reportTimeScope" />
</a-form-item>
<a-col :lg="6" :md="12" :sm="24" :xs="24">
<a-form-item label="水源名称:">
<a-select
mode="tags"
:size="size"
placeholder="未选择"
style="width: 200px"
@change="handleChange"
v-model:value="where.sourceWaterName"
>
<!-- <a-select-option
v-for="item in sourceWaterName"
:key="item.value"
>{{ item.label }}
</a-select-option> -->
<a-select-option :value="'1'">1</a-select-option>
<a-select-option :value="'2'">2</a-select-option>
<a-select-option :value="'3'">3</a-select-option>
<a-select-option :value="'4'">4</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="drinkingWaterId"
:datasource="url"
:columns="columns"
:where="where"
:scroll="{ x: 'max-content' }"
@done="(d) => (data = d.data)"
>
</ele-pro-table>
</a-card>
</div>
<!-- 编辑弹窗 -->
</template>
<script>
// import _ from "lodash";
import XLSX from "xlsx";
// import { pageRoadNoiseUrl, getColumnOptions } from "@/api/ecology/noise/road-sound";
import {
pageDrinkingWaterStatisticUrl,
// getColumnOptions
} from "@/api/ecology/drinking-water";
// import pageDictUrl from "@/api/ecology/drinking-water-dict"
import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
import { tableColumns } from "./colums";
// import moment from "moment";
// import utils from "./utils";
// const columns =tableColumns;
export default {
name: "DrinkingWaterBase",
components: {},
data() {
return {
data: [],
locale,
bill: {},
// 表格数据接口
url: pageDrinkingWaterStatisticUrl,
selection: [],
columns: [
{title: "水源名称",dataIndex: "sourceWaterName",sorter: true,},
{title: "取水量",dataIndex: "waterWithdrawal",sorter: true,},
],
// 表格列配置
// palceOptions: [],
// areaOptions: [],
// roadOptions: [],
regionLevelOptions: [],
// 表格搜索条件
where: {
checked: 1,
},
// 表格选中数据
selectionList: [],
};
},
mounted() {
// this.loadOptionData();
},
methods: {
JumpFieldClick(record, column) {
console.log(column.dataIndex);
},
/**获取下来框数据 */
// loadOptionData() {
// getColumnOptions("place").then((res) => {
// this.palceOptions = res.data.data.map((item) => {
// return {
// label: item,
// value: item,
// };
// });
// });
// getColumnOptions("area").then((res) => {
// this.areaOptions = res.data.data.map((item) => {
// return {
// label: item,
// value: item,
// };
// });
// });
// getColumnOptions("road").then((res) => {
// this.roadOptions = res.data.data.map((item) => {
// return {
// label: item,
// value: item,
// };
// });
// });
// getColumnOptions("region_level").then((res) => {
// this.regionLevelOptions = 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 = [...tableColumns];
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>

163
src/views/water/drinking-water/statistic/county-avg-index.vue Normal file
View File

@@ -0,0 +1,163 @@
<!-- 江河水查看数据页面-->
<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-form-item label="断面名称">
<a-select v-model:value="where.name" allowClear showSearch>
<a-select-option v-for="item in sectionInfo" :key="item.sectionName">{{ item.sectionName }}
</a-select-option>
</a-select>
</a-form-item>
<a-form-item label="开始时间:">
<a-month-picker v-model:value="where.startTime" :disabled-date="disabledDate" />
</a-form-item>
<a-form-item label="结束时间:">
<a-month-picker v-model:value="where.endTime" :disabled-date="disabledDate" />
</a-form-item>
<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>
<!-- 表格 -->
<a-spin :spinning="loading">
<ele-pro-table ref="table" :datasource="momData" :columns="columns" :where="where" :scroll="{ x: 'max-content' }"
@done="(d) => (data = d.data)">
</ele-pro-table>
</a-spin>
</a-card>
</div>
<!-- 编辑弹窗 -->
</template>
<script>
import {
listMonthCompositeIndex
} from "@/api/ecology/river-statis";
import {
listInfo
} from "@/api/ecology/water/river-plcae";
import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
import XLSX from "xlsx";
export default {
name: "RiverCollectWater",
components: {},
data() {
return {
data: [],
momData: [],
datasource: {},
columns: [{
title: '断面名称',
dataIndex: 'sectionName',
key: 'sectionName',
},
{
title: '水质综合指数排名',
dataIndex: 'orderBy',
key: 'orderBy',
},
{
title: "水质综合指数",
children: [{
title: "本月综合指数",
dataIndex: "baseIndex"
},
{
title: "上月综合指数",
dataIndex: "momIndex"
},
{
title: "上年同期指数",
dataIndex: "yoyIndex"
},
]
},
{
title: "水质综合指数变化率",
children: [{
title: "上月",
dataIndex: "momRateChange"
},
{
title: "上年同期",
dataIndex: "yoyRateChange"
},
]
},
],
locale,
bill: {},
selection: [],
where: {},
sectionInfo: {},
loading: false,
rules: {},
};
},
created() {
listInfo().then((res) => {
if (res.data.code == 0) {
console.log(res.data.data)
this.visibleWater = true;
this.sectionInfo = res.data.data
} else {
this.$message.error(res.data.msg);
}
})
},
methods: {
/* 刷新表格 */
reload() {
this.loading=true;
this.momData = [];
listMonthCompositeIndex(this.where).then((res) => {
console.log(res.data.data);
if (res.data.code == 0) {
this.$message.success(res.data.msg);
res.data.data.forEach((m) => {
this.momData.push(m);
})
} else {
this.$message.error(res.data.msg);
}
this.loading=false;
});
},
/* 重置搜索 */
reset() {
this.where = {};
this.reload();
},
/* 导出 */
exportFile() {
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>

168
src/views/water/drinking-water/statistic/county-base-standard.vue Normal file
View File

@@ -0,0 +1,168 @@
<!-- 当月水质目标-->
<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-form-item label="断面名称">
<a-select v-model:value="where.name" allowClear showSearch>
<a-select-option v-for="item in sectionInfo" :key="item.sectionName">{{ item.sectionName }}
</a-select-option>
</a-select>
</a-form-item>
<!-- <a-form-item label="年份:">
<a-date-picker valueFormat="YYYY" v-model:value="where.year"></a-date-picker>
</a-form-item>
<a-form-item label="月份:">
<a-date-picker valueFormat="MM" v-model:value="where.month"></a-date-picker>
</a-form-item> -->
<a-form-item label="查询时间:">
<a-month-picker v-model:value="where.startTime" :disabled-date="disabledDate" />
</a-form-item>
<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>
<!-- 表格 -->
<a-spin :spinning="loading">
<ele-pro-table ref="table" :datasource="momData" :columns="columns" :where="where"
:scroll="{ x: 'max-content' }" @done="(d) => (data = d.data)">
</ele-pro-table>
</a-spin>
</a-card>
</div>
<!-- 编辑弹窗 -->
</template>
<script>
import {
listMonthWaterQualitySandard
} from "@/api/ecology/river-statis";
import {
listInfo
} from "@/api/ecology/water/river-plcae";
import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
import XLSX from "xlsx";
export default {
name: "RiverCollectWater",
components: {},
data() {
return {
data: [],
momData: [],
datasource: {},
columns: [{
title: '断面类型',
dataIndex: 'sectionType',
key: 'sectionType',
},
{
title: '断面名称',
dataIndex: 'sectionName',
key: 'sectionName',
},
{
title: '考核城市',
dataIndex: 'city',
key: 'city',
},
{
title: '考核目标',
dataIndex: 'waterTarget',
key: 'waterTarget',
},
{
title: '水质类别',
dataIndex: 'waterQualityCategory',
key: 'waterQualityCategory',
},
{
title: '水质评价',
dataIndex: 'waterQualityEvaluate',
key: 'waterQualityEvaluate',
},
{
title: '上期水质类别',
dataIndex: 'waterQualityCategoryMom',
key: 'waterQualityCategoryMom',
},
{
title: '去年同期水质类别',
dataIndex: 'waterQualityCategoryYoy',
key: 'waterQualityCategoryYoy',
},
],
locale,
bill: {},
selection: [],
where: {},
sectionInfo: {},
loading: false,
rules: {},
};
},
created() {
listInfo().then((res) => {
if (res.data.code == 0) {
console.log(res.data.data)
this.visibleWater = true;
this.sectionInfo = res.data.data
} else {
this.$message.error(res.data.msg);
}
})
},
methods: {
/* 刷新表格 */
reload() {
this.loading = true;
this.momData = [];
listMonthWaterQualitySandard(this.where).then((res) => {
console.log(res.data.data);
if (res.data.code == 0) {
this.$message.success(res.data.msg);
res.data.data.forEach((m) => {
this.momData.push(m);
})
} else {
this.$message.error(res.data.msg);
}
this.loading = false;
});
},
/* 重置搜索 */
reset() {
this.where = {};
this.reload();
},
/* 导出 */
exportFile() {
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>

67
src/views/water/drinking-water/statistic/countyData.vue
View File

@@ -8,50 +8,59 @@
: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.regionLevel" allowClear showSearch>
<a-select-option
v-for="(item) in regionLevelOptions"
:key="item.value"
>{{ item.label }}</a-select-option
>
<a-col :lg="6" :md="12" :sm="24" :xs="24">
<a-form-item label="水源类型:">
<a-select v-model:value="where.waterSourceType" allowClear showSearch>
<a-select-option :value="'地表水'">地表水</a-select-option>
<a-select-option :value="'地下水'">地下水</a-select-option>
</a-select>
</a-form-item>
</a-col>
<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-form-item label="水源状态:">
<a-select v-model:value="where.waterSourceType" allowClear showSearch>
<a-select-option :value="'在用'">在用</a-select-option>
<a-select-option :value="'备用'">备用</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-form-item label="上报时间:">
<a-range-picker separator="~" v-model:value="reportTimeScope" />
</a-form-item>
<a-col :lg="6" :md="12" :sm="24" :xs="24">
<a-form-item label="路段:">
<a-select v-model:value="where.road" allowClear showSearch>
<a-select-option
v-for="(item) in roadOptions"
:key="item.value"
>{{ item.label }}</a-select-option
>
<a-form-item label="市级名称:">
<a-select v-model:value="where.city" allowClear showSearch>
<a-select-option :value="'1'">1</a-select-option>
<a-select-option :value="'2'">2</a-select-option>
</a-select>
</a-form-item>
</a-col>
<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-form-item label="县级名称:">
<a-select
mode="tags"
:size="size"
placeholder="选择县级名称 "
style="width: 200px"
@change="handleChange"
v-model:value="where.county"
>
<!-- <a-select-option
v-for="item in sourceWaterName"
:key="item.value"
>{{ item.label }}
</a-select-option> -->
<a-select-option :value="'1'">1</a-select-option>
<a-select-option :value="'2'">2</a-select-option>
<a-select-option :value="'3'">3</a-select-option>
<a-select-option :value="'4'">4</a-select-option>
</a-select>
</a-form-item>
</a-col> -->
</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>

50
src/views/water/drinking-water/statistic/countyWaterQuality.vue
View File

@@ -8,50 +8,22 @@
: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.regionLevel" allowClear showSearch>
<a-select-option
v-for="(item) in regionLevelOptions"
:key="item.value"
>{{ item.label }}</a-select-option
<a-col :lg="6" :md="12" :sm="24" :xs="24">
<a-form-item label="水源类型:">
<a-select
v-model:value="where.waterSourceType"
allowClear
showSearch
>
<a-select-option :value="'地表水'">地表水</a-select-option>
<a-select-option :value="'地下水'">地下水</a-select-option>
</a-select>
</a-form-item>
</a-col>
<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 label="上报时间:">
<a-range-picker separator="~" v-model:value="reportTimeScope" />
</a-form-item>
</a-col>
<a-col :lg="6" :md="12" :sm="24" :xs="24">
<a-form-item label="路段:">
<a-select v-model:value="where.road" allowClear showSearch>
<a-select-option
v-for="(item) in roadOptions"
: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 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>

185
src/views/water/drinking-water/statistic/countyWaterWithdrawal.vue Normal file
View File

@@ -0,0 +1,185 @@
<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-form-item label="时间:">
<a-range-picker separator="~" v-model:value="reportTimeScope" />
</a-form-item>
<a-col :lg="6" :md="12" :sm="24" :xs="24">
<a-form-item label="水源名称:">
<a-select
mode="tags"
:size="size"
placeholder="未选择"
style="width: 200px"
@change="handleChange"
v-model:value="where.sourceWaterName"
>
<!-- <a-select-option
v-for="item in sourceWaterName"
:key="item.value"
>{{ item.label }}
</a-select-option> -->
<a-select-option :value="'1'">1</a-select-option>
<a-select-option :value="'2'">2</a-select-option>
<a-select-option :value="'3'">3</a-select-option>
<a-select-option :value="'4'">4</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="drinkingWaterId"
:datasource="url"
:columns="columns"
:where="where"
:scroll="{ x: 'max-content' }"
@done="(d) => (data = d.data)"
>
</ele-pro-table>
</a-card>
</div>
<!-- 编辑弹窗 -->
</template>
<script>
// import _ from "lodash";
import XLSX from "xlsx";
// import { pageRoadNoiseUrl, getColumnOptions } from "@/api/ecology/noise/road-sound";
import {
pageDrinkingWaterStatisticUrl,
// getColumnOptions
} from "@/api/ecology/drinking-water";
// import pageDictUrl from "@/api/ecology/drinking-water-dict"
import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
import { tableColumns } from "./colums";
// import moment from "moment";
// import utils from "./utils";
// const columns =tableColumns;
export default {
name: "DrinkingWaterBase",
components: {},
data() {
return {
data: [],
locale,
bill: {},
// 表格数据接口
url: pageDrinkingWaterStatisticUrl,
selection: [],
columns: [
{title: "水源名称",dataIndex: "sourceWaterName",sorter: true,},
{title: "取水量",dataIndex: "waterWithdrawal",sorter: true,},
],
// 表格列配置
// palceOptions: [],
// areaOptions: [],
// roadOptions: [],
regionLevelOptions: [],
// 表格搜索条件
where: {
checked: 1,
},
// 表格选中数据
selectionList: [],
};
},
mounted() {
// this.loadOptionData();
},
methods: {
JumpFieldClick(record, column) {
console.log(column.dataIndex);
},
/**获取下来框数据 */
// loadOptionData() {
// getColumnOptions("place").then((res) => {
// this.palceOptions = res.data.data.map((item) => {
// return {
// label: item,
// value: item,
// };
// });
// });
// getColumnOptions("area").then((res) => {
// this.areaOptions = res.data.data.map((item) => {
// return {
// label: item,
// value: item,
// };
// });
// });
// getColumnOptions("road").then((res) => {
// this.roadOptions = res.data.data.map((item) => {
// return {
// label: item,
// value: item,
// };
// });
// });
// getColumnOptions("region_level").then((res) => {
// this.regionLevelOptions = 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 = [...tableColumns];
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>

69
src/views/water/drinking-water/statistic/index.vue
View File

@@ -8,17 +8,24 @@
<base-statistic></base-statistic>
</a-tab-pane>
<a-tab-pane tab="报送情况说明表" key="base1">
<!-- <function-bill ref="functionWater"></function-bill> -->
<city-appraise></city-appraise>
</a-tab-pane>
<!-- <a-tab-pane tab="水质类别" key="base2">
<city-water-quality></city-water-quality>
</a-tab-pane> -->
<a-tab-pane tab="取水量统计" key="base3">
<!-- <city-water-quality></city-water-quality> -->
<city-water-withdrawal></city-water-withdrawal>
</a-tab-pane>
<a-tab-pane tab="水质类别" key="base2">
<city-water-quality></city-water-quality>
</a-tab-pane>
<a-tab-pane tab="达标率" key="base6">
<city-month-standard></city-month-standard>
</a-tab-pane>
<a-tab-pane tab="综合指数" key="base5">
<city-avg-index></city-avg-index>
</a-tab-pane>
</a-tabs>
</a-tab-pane>
<a-tab-pane key="county" tab="县级">
<a-tabs v-model:active="activeCounty">
<a-tab-pane tab="监测数据报送表" key="County">
@@ -27,14 +34,21 @@
<a-tab-pane tab="报送情况说明表" key="base1">
<county-appraise></county-appraise>
</a-tab-pane>
<!-- <a-tab-pane tab="水质类别" key="base2">
<a-tab-pane tab="取水量统计" key="base3">
<county-water-withdrawal></county-water-withdrawal>
</a-tab-pane>
<a-tab-pane tab="水质类别" key="base2">
<county-water-quality></county-water-quality>
</a-tab-pane> -->
</a-tab-pane>
<a-tab-pane tab="达标率" key="base6">
<county-month-standard></county-month-standard>
</a-tab-pane>
<a-tab-pane tab="综合指数" key="base5">
<county-avg-index></county-avg-index>
</a-tab-pane>
</a-tabs>
</a-tab-pane>
<!-- <a-tab-pane key="quarter" tab="季度报告">
<quarter-statistic></quarter-statistic>
</a-tab-pane> -->
<a-tab-pane key="village" tab="农村">
<a-tabs v-model:active="activeVillage">
<a-tab-pane tab="数据总览" key="village">
@@ -46,6 +60,12 @@
<a-tab-pane tab="水质类别" key="base2">
<village-water-quality></village-water-quality>
</a-tab-pane>
<a-tab-pane tab="达标率" key="base6">
<village-month-standard></village-month-standard>
</a-tab-pane>
<a-tab-pane tab="综合指数" key="base5">
<village-avg-index></village-avg-index>
</a-tab-pane>
</a-tabs>
</a-tab-pane>
</a-tabs>
@@ -59,15 +79,24 @@
*
*
*/
import BaseStatistic from "./cityDate.vue";
import BaseStatistic from "./cityDate.vue"
import countyData from "./countyData.vue"
import village from "./villageData.vue"
import cityAppraise from "./cityAppraise.vue"
import countyAppraise from "./countyAppraise.vue"
import villageAppraise from "./villageAppraise.vue"
// import cityWaterQuality from "./cityWaterQuality.vue"
// import countyWaterQuality from "./countyWaterQuality.vue"
import cityWaterQuality from "./cityWaterQuality.vue"
import countyWaterQuality from "./countyWaterQuality.vue"
import villageWaterQuality from "./villageWaterQuality.vue"
import cityAvgIndex from "./city-avg-index.vue"
import countyAvgIndex from "./county-avg-index.vue"
import villageAvgIndex from "./village-avg-index.vue"
import cityMonthStandard from "./city-base-standard.vue"
import countyMonthStandard from "./county-base-standard.vue"
import villageMonthStandard from "./village-base-standard.vue"
import cityWaterWithdrawal from "./cityWaterWithdrawal.vue"
import countyWaterWithdrawal from "./countyWaterWithdrawal.vue"
// import QuarterStatistic from "./quarter.vue";
// import Compare from "./compare.vue"
// import AverageStatistic from "./average.vue"
@@ -81,9 +110,17 @@
cityAppraise,
countyAppraise,
villageAppraise,
// cityWaterQuality,
// countyWaterQuality,
villageWaterQuality
cityWaterQuality,
countyWaterQuality,
villageWaterQuality,
cityAvgIndex,
countyAvgIndex,
villageAvgIndex,
cityMonthStandard,
countyMonthStandard,
villageMonthStandard,
cityWaterWithdrawal,
countyWaterWithdrawal
// QuarterStatistic,
// Compare,
// AverageStatistic

163
src/views/water/drinking-water/statistic/village-avg-index.vue Normal file
View File

@@ -0,0 +1,163 @@
<!-- 江河水查看数据页面-->
<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-form-item label="断面名称">
<a-select v-model:value="where.name" allowClear showSearch>
<a-select-option v-for="item in sectionInfo" :key="item.sectionName">{{ item.sectionName }}
</a-select-option>
</a-select>
</a-form-item>
<a-form-item label="开始时间:">
<a-month-picker v-model:value="where.startTime" :disabled-date="disabledDate" />
</a-form-item>
<a-form-item label="结束时间:">
<a-month-picker v-model:value="where.endTime" :disabled-date="disabledDate" />
</a-form-item>
<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>
<!-- 表格 -->
<a-spin :spinning="loading">
<ele-pro-table ref="table" :datasource="momData" :columns="columns" :where="where" :scroll="{ x: 'max-content' }"
@done="(d) => (data = d.data)">
</ele-pro-table>
</a-spin>
</a-card>
</div>
<!-- 编辑弹窗 -->
</template>
<script>
import {
listMonthCompositeIndex
} from "@/api/ecology/river-statis";
import {
listInfo
} from "@/api/ecology/water/river-plcae";
import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
import XLSX from "xlsx";
export default {
name: "RiverCollectWater",
components: {},
data() {
return {
data: [],
momData: [],
datasource: {},
columns: [{
title: '断面名称',
dataIndex: 'sectionName',
key: 'sectionName',
},
{
title: '水质综合指数排名',
dataIndex: 'orderBy',
key: 'orderBy',
},
{
title: "水质综合指数",
children: [{
title: "本月综合指数",
dataIndex: "baseIndex"
},
{
title: "上月综合指数",
dataIndex: "momIndex"
},
{
title: "上年同期指数",
dataIndex: "yoyIndex"
},
]
},
{
title: "水质综合指数变化率",
children: [{
title: "上月",
dataIndex: "momRateChange"
},
{
title: "上年同期",
dataIndex: "yoyRateChange"
},
]
},
],
locale,
bill: {},
selection: [],
where: {},
sectionInfo: {},
loading: false,
rules: {},
};
},
created() {
listInfo().then((res) => {
if (res.data.code == 0) {
console.log(res.data.data)
this.visibleWater = true;
this.sectionInfo = res.data.data
} else {
this.$message.error(res.data.msg);
}
})
},
methods: {
/* 刷新表格 */
reload() {
this.loading=true;
this.momData = [];
listMonthCompositeIndex(this.where).then((res) => {
console.log(res.data.data);
if (res.data.code == 0) {
this.$message.success(res.data.msg);
res.data.data.forEach((m) => {
this.momData.push(m);
})
} else {
this.$message.error(res.data.msg);
}
this.loading=false;
});
},
/* 重置搜索 */
reset() {
this.where = {};
this.reload();
},
/* 导出 */
exportFile() {
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>

168
src/views/water/drinking-water/statistic/village-base-standard.vue Normal file
View File

@@ -0,0 +1,168 @@
<!-- 当月水质目标-->
<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-form-item label="断面名称">
<a-select v-model:value="where.name" allowClear showSearch>
<a-select-option v-for="item in sectionInfo" :key="item.sectionName">{{ item.sectionName }}
</a-select-option>
</a-select>
</a-form-item>
<!-- <a-form-item label="年份:">
<a-date-picker valueFormat="YYYY" v-model:value="where.year"></a-date-picker>
</a-form-item>
<a-form-item label="月份:">
<a-date-picker valueFormat="MM" v-model:value="where.month"></a-date-picker>
</a-form-item> -->
<a-form-item label="查询时间:">
<a-month-picker v-model:value="where.startTime" :disabled-date="disabledDate" />
</a-form-item>
<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>
<!-- 表格 -->
<a-spin :spinning="loading">
<ele-pro-table ref="table" :datasource="momData" :columns="columns" :where="where"
:scroll="{ x: 'max-content' }" @done="(d) => (data = d.data)">
</ele-pro-table>
</a-spin>
</a-card>
</div>
<!-- 编辑弹窗 -->
</template>
<script>
import {
listMonthWaterQualitySandard
} from "@/api/ecology/river-statis";
import {
listInfo
} from "@/api/ecology/water/river-plcae";
import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
import XLSX from "xlsx";
export default {
name: "RiverCollectWater",
components: {},
data() {
return {
data: [],
momData: [],
datasource: {},
columns: [{
title: '断面类型',
dataIndex: 'sectionType',
key: 'sectionType',
},
{
title: '断面名称',
dataIndex: 'sectionName',
key: 'sectionName',
},
{
title: '考核城市',
dataIndex: 'city',
key: 'city',
},
{
title: '考核目标',
dataIndex: 'waterTarget',
key: 'waterTarget',
},
{
title: '水质类别',
dataIndex: 'waterQualityCategory',
key: 'waterQualityCategory',
},
{
title: '水质评价',
dataIndex: 'waterQualityEvaluate',
key: 'waterQualityEvaluate',
},
{
title: '上期水质类别',
dataIndex: 'waterQualityCategoryMom',
key: 'waterQualityCategoryMom',
},
{
title: '去年同期水质类别',
dataIndex: 'waterQualityCategoryYoy',
key: 'waterQualityCategoryYoy',
},
],
locale,
bill: {},
selection: [],
where: {},
sectionInfo: {},
loading: false,
rules: {},
};
},
created() {
listInfo().then((res) => {
if (res.data.code == 0) {
console.log(res.data.data)
this.visibleWater = true;
this.sectionInfo = res.data.data
} else {
this.$message.error(res.data.msg);
}
})
},
methods: {
/* 刷新表格 */
reload() {
this.loading = true;
this.momData = [];
listMonthWaterQualitySandard(this.where).then((res) => {
console.log(res.data.data);
if (res.data.code == 0) {
this.$message.success(res.data.msg);
res.data.data.forEach((m) => {
this.momData.push(m);
})
} else {
this.$message.error(res.data.msg);
}
this.loading = false;
});
},
/* 重置搜索 */
reset() {
this.where = {};
this.reload();
},
/* 导出 */
exportFile() {
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>

45
src/views/water/drinking-water/statistic/villageAppraise.vue
View File

@@ -52,6 +52,24 @@
</a-select>
</a-form-item>
</a-col> -->
<a-col :lg="6" :md="12" :sm="24" :xs="24">
<a-form-item label="水源类型:">
<a-select
v-model:value="where.waterSourceType"
allowClear
showSearch
>
<a-select-option :value="'地表水'">地表水</a-select-option>
<a-select-option :value="'地下水'">地下水</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-form-item label="上报时间:">
<a-range-picker separator="~" v-model:value="reportTimeScope" />
</a-form-item>
<a-col :lg="6" :md="12" :sm="24" :xs="24">
<a-form-item class="ele-text-right" :wrapper-col="{ span: 24 }">
<a-space>
@@ -74,7 +92,6 @@
:scroll="{ x: 'max-content' }"
@done="(d) => (data = d.data)"
>
</ele-pro-table>
</a-card>
</div>
@@ -88,7 +105,6 @@ import XLSX from "xlsx";
import {
pageDrinkingWaterVillageStatisticUrl,
// getColumnOptions
} from "@/api/ecology/drinking-water-village";
// import pageDictUrl from "@/api/ecology/drinking-water-dict"
import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
@@ -100,7 +116,6 @@ export default {
name: "DrinkingWaterBase",
components: {},
data() {
return {
data: [],
@@ -110,23 +125,22 @@ export default {
url: pageDrinkingWaterVillageStatisticUrl,
selection: [],
columns: [
{title:"城市名称",dataIndex:"city",},
{title:"水源地名称",dataIndex:"place",},
{title:"取水量（万m3）",dataIndex:"waterWithdrawal",},
{title:"超标水源地取水量",dataIndex:"",},
{title:"超标项目",dataIndex:"",},
{title:"水源地性质",dataIndex:"waterSourceProperty",},
{ title: "城市名称", dataIndex: "city" },
{ title: "水源地名称", dataIndex: "place" },
{ title: "取水量（万m3）", dataIndex: "waterWithdrawal" },
{ title: "超标水源地取水量", dataIndex: "" },
{ title: "超标项目", dataIndex: "" },
{ title: "水源地性质", dataIndex: "waterSourceProperty" },
],
// 表格列配置
// palceOptions: [],
// areaOptions: [],
// roadOptions: [],
regionLevelOptions: [],
reportTimeScope: [],
// 表格搜索条件
where: {
checked: 1,
@@ -140,7 +154,7 @@ export default {
},
methods: {
JumpFieldClick(record, column) {
console.log(column.dataIndex)
console.log(column.dataIndex);
},
/**获取下来框数据 */
@@ -180,7 +194,6 @@ export default {
// },
/* 刷新表格 */
reload() {
this.$refs.table.reload({
where: this.where,
});
@@ -193,9 +206,7 @@ export default {
this.reload();
},
exportFile() {
const columns = [
...tableColumns3,
];
const columns = [...tableColumns3];
const arr = [];
const th = columns.map((item) => item.title);
arr.push(th);

15
src/views/water/drinking-water/statistic/villageData.vue
View File

@@ -52,6 +52,19 @@
</a-select>
</a-form-item>
</a-col> -->
<a-col :lg="6" :md="12" :sm="24" :xs="24">
<a-form-item label="水源类型:">
<a-select v-model:value="where.waterSourceType" allowClear showSearch>
<a-select-option :value="'地表水'">地表水</a-select-option>
<a-select-option :value="'地下水'">地下水</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-form-item label="上报时间:">
<a-range-picker separator="~" v-model:value="reportTimeScope" />
</a-form-item>
<a-col :lg="6" :md="12" :sm="24" :xs="24">
<a-form-item class="ele-text-right" :wrapper-col="{ span: 24 }">
<a-space>
@@ -133,7 +146,7 @@ export default {
],
reportTimeScope: [],
// 表格列配置

50
src/views/water/drinking-water/statistic/villageWaterQuality.vue
View File

@@ -8,50 +8,22 @@
: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.regionLevel" allowClear showSearch>
<a-select-option
v-for="(item) in regionLevelOptions"
:key="item.value"
>{{ item.label }}</a-select-option
<a-col :lg="6" :md="12" :sm="24" :xs="24">
<a-form-item label="水源类型:">
<a-select
v-model:value="where.waterSourceType"
allowClear
showSearch
>
<a-select-option :value="'地表水'">地表水</a-select-option>
<a-select-option :value="'地下水'">地下水</a-select-option>
</a-select>
</a-form-item>
</a-col>
<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 label="监测时间:">
<a-range-picker separator="~" v-model:value="reportTimeScope" />
</a-form-item>
</a-col>
<a-col :lg="6" :md="12" :sm="24" :xs="24">
<a-form-item label="路段:">
<a-select v-model:value="where.road" allowClear showSearch>
<a-select-option
v-for="(item) in roadOptions"
: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 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>