39 changed files with 1611 additions and 247 deletions
@ -0,0 +1,37 @@ |
|||||||
|
import request from '@/utils/request' |
||||||
|
|
||||||
|
|
||||||
|
export default { |
||||||
|
getRainTableList(searchModel) { |
||||||
|
return request({ |
||||||
|
url: "/actualSurvey/getFlowResult", |
||||||
|
method: 'get', |
||||||
|
params: { |
||||||
|
pageNum: searchModel.pageNum, |
||||||
|
pageSize: searchModel.pageSize, |
||||||
|
stcdIds: searchModel.stcdIds, |
||||||
|
startTime: searchModel.startTime, |
||||||
|
endTime: searchModel.endTime, |
||||||
|
stcd:searchModel.stcd, |
||||||
|
stnm:searchModel.stnm |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
// exportRainDataList(){
|
||||||
|
// return request({
|
||||||
|
// url: "/export/exportMonthRainList",
|
||||||
|
// method: 'get',
|
||||||
|
// responseType: 'blob'
|
||||||
|
// })
|
||||||
|
// },
|
||||||
|
// importDateToSoft(from){
|
||||||
|
// return request({
|
||||||
|
// url: "/month/import/importMonthRainList",
|
||||||
|
// method: 'post',
|
||||||
|
// params: {
|
||||||
|
// startTime: from.startTime,
|
||||||
|
// endTime: from.endTime,
|
||||||
|
// }
|
||||||
|
// })
|
||||||
|
// }
|
||||||
|
} |
@ -0,0 +1,367 @@ |
|||||||
|
<template> |
||||||
|
<div class="app-container"> |
||||||
|
<el-form :inline="true" class="demo-form-inline"> |
||||||
|
<el-form-item label="起年月"> |
||||||
|
<el-date-picker |
||||||
|
v-model="searchModel.startTime" |
||||||
|
type="month" |
||||||
|
placeholder="选择日期"> |
||||||
|
</el-date-picker> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="截止年月"> |
||||||
|
<el-date-picker |
||||||
|
v-model="searchModel.endTime" |
||||||
|
type="month" |
||||||
|
placeholder="选择日期"> |
||||||
|
</el-date-picker> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="站点"> |
||||||
|
<SelectStaion |
||||||
|
v-if="isComponentReady" |
||||||
|
ref="selectStaionRef" |
||||||
|
:startTime="this.formatDateToYearMonth(this.searchModel.startTime)" |
||||||
|
:endTime="this.formatDateToYearMonth(this.searchModel.endTime)" |
||||||
|
:type="this.type" |
||||||
|
@count-update="handleCountUpdate" |
||||||
|
> |
||||||
|
</SelectStaion> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="站点数量:"> |
||||||
|
{{this.stationNum}} |
||||||
|
</el-form-item> |
||||||
|
<el-form-item> |
||||||
|
<el-button type="primary" @click="getMonthRainList">查询</el-button> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item> |
||||||
|
<el-button type="primary" @click="exportDate">导出</el-button> |
||||||
|
</el-form-item> |
||||||
|
<!-- <el-form-item>--> |
||||||
|
<!-- <el-button--> |
||||||
|
<!-- type="primary"--> |
||||||
|
<!-- @click="importSoft"--> |
||||||
|
<!-- >导入南方片--> |
||||||
|
<!-- </el-button>--> |
||||||
|
<!-- </el-form-item>--> |
||||||
|
</el-form> |
||||||
|
|
||||||
|
<div class="main-content"> |
||||||
|
<div class="main-title"> |
||||||
|
<div class="table-title">实测流量成果表</div> |
||||||
|
<div class="table-header"> |
||||||
|
<div class="table-time">年份:{{ new Date().getFullYear() }}</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<el-table |
||||||
|
:data="tableData" |
||||||
|
height="500" |
||||||
|
border |
||||||
|
style="width: 100%"> |
||||||
|
<el-table-column label="序号" align="center"> |
||||||
|
<template slot-scope="scope"> |
||||||
|
{{ scope.$index + 1 }} |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column |
||||||
|
align="center" |
||||||
|
prop="stcd" |
||||||
|
width="100px" |
||||||
|
label="站码" |
||||||
|
> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column |
||||||
|
align="center" |
||||||
|
prop="stnm" |
||||||
|
label="站名" |
||||||
|
> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column |
||||||
|
align="center" |
||||||
|
prop="addvcd" |
||||||
|
label="行政区划码"> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column |
||||||
|
align="center" |
||||||
|
prop="yr" |
||||||
|
label="年"> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column align="center" prop="mnth" label="月份"></el-table-column> |
||||||
|
<el-table-column align="center" prop="qobno" label="流量施测号数"></el-table-column> |
||||||
|
<el-table-column width="170px" align="center" prop="msqbgtm" label="测流起时间"> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column width="170px" align="center" prop="msqedtm" label="测流止时间"> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column width="100px" align="center" prop="xsqlc" label="测流断面位置"></el-table-column> |
||||||
|
<el-table-column width="150px" align="center" prop="msqmt" label="测流方法"></el-table-column> |
||||||
|
<el-table-column align="center" prop="bsggz" label="基本水尺水位"></el-table-column> |
||||||
|
<el-table-column align="center" prop="q" label="流量"></el-table-column> |
||||||
|
<el-table-column align="center" prop="qrcd" label="流量注解码"></el-table-column> |
||||||
|
<el-table-column align="center" prop="xstta" label="断面总面积"></el-table-column> |
||||||
|
<el-table-column align="center" prop="xsa" label="断面过水面积"></el-table-column> |
||||||
|
<el-table-column align="center" prop="xsarcd" label="断面面积注解码"></el-table-column> |
||||||
|
<el-table-column align="center" prop="xsavv" label="断面平均流速"></el-table-column> |
||||||
|
<el-table-column align="center" prop="xsmxv" label="断面最大流速"></el-table-column> |
||||||
|
<el-table-column align="center" prop="tpwd" label="水面宽"></el-table-column> |
||||||
|
<el-table-column align="center" prop="xsavdp" label="断面平均水深"></el-table-column> |
||||||
|
<el-table-column align="center" prop="xsmxdp" label="断面最大水深"></el-table-column> |
||||||
|
<el-table-column align="center" prop="ibwd" label="水浸冰底宽度"></el-table-column> |
||||||
|
<el-table-column align="center" prop="ibavdp" label="水浸冰底平均水深"></el-table-column> |
||||||
|
<el-table-column align="center" prop="ibmxdp" label="水浸冰底最大水深"></el-table-column> |
||||||
|
<el-table-column align="center" prop="rvsfsl" label="水面比降"></el-table-column> |
||||||
|
<el-table-column align="center" prop="n" label="糙率"></el-table-column> |
||||||
|
<el-table-column align="center" prop="obnont" label="测次说明"></el-table-column> |
||||||
|
</el-table> |
||||||
|
<el-pagination |
||||||
|
@size-change="handleSizeChange" |
||||||
|
@current-change="handleCurrentChange" |
||||||
|
:current-page="searchModel.pageNum" |
||||||
|
:page-sizes="[15, 30, 50,100]" |
||||||
|
:page-size="searchModel.pageSize" |
||||||
|
layout="total, sizes, prev, pager, next, jumper" |
||||||
|
style="padding: 30px 0; text-align: center;" |
||||||
|
:total="total" |
||||||
|
> |
||||||
|
</el-pagination> |
||||||
|
</div> |
||||||
|
<el-dialog :title="title" :visible.sync="softOpen" width="400px" append-to-body> |
||||||
|
<el-form ref="form" :model="form" :rules="rules" label-width="100px"> |
||||||
|
<el-form-item label="起年"> |
||||||
|
<el-date-picker |
||||||
|
v-model="form.startTime" |
||||||
|
type="month" |
||||||
|
placeholder="选择日期" |
||||||
|
> |
||||||
|
</el-date-picker> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="截止年"> |
||||||
|
<el-date-picker |
||||||
|
v-model="form.endTime" |
||||||
|
type="month" |
||||||
|
placeholder="选择日期" |
||||||
|
> |
||||||
|
</el-date-picker> |
||||||
|
</el-form-item> |
||||||
|
</el-form> |
||||||
|
<div slot="footer" class="dialog-footer"> |
||||||
|
<el-button type="primary" @click="submitForm">确 定</el-button> |
||||||
|
<el-button @click="cancel">取 消</el-button> |
||||||
|
</div> |
||||||
|
</el-dialog> |
||||||
|
|
||||||
|
|
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
|
||||||
|
<script> |
||||||
|
import measuredFlowResultApi from "@/api/actualSurvey/measuredFlowResults"; |
||||||
|
import yearRainApi from "@/api/year/yearRain"; |
||||||
|
import SelectStaion from "@/components/SelectStaion/index.vue"; |
||||||
|
export default { |
||||||
|
name: "hourMaxRain", |
||||||
|
components: {SelectStaion}, |
||||||
|
data() { |
||||||
|
return { |
||||||
|
stationNum:'', |
||||||
|
tableData: [], |
||||||
|
uploadData: {}, |
||||||
|
uploadUrl: '/year/importHourMaxRainData', |
||||||
|
total: 0, |
||||||
|
searchModel: { |
||||||
|
startTime: '', |
||||||
|
endTime: '', |
||||||
|
stcd: '', |
||||||
|
stnm: '', |
||||||
|
pageNum: 1, |
||||||
|
pageSize: 15 |
||||||
|
}, |
||||||
|
upload: { |
||||||
|
title: '导入数据', |
||||||
|
open: false |
||||||
|
}, |
||||||
|
|
||||||
|
softOpen:false, |
||||||
|
title:'', |
||||||
|
form:{ |
||||||
|
startTime:'', |
||||||
|
endTime:'' |
||||||
|
}, |
||||||
|
// 表单校验 |
||||||
|
rules: { |
||||||
|
startTime: [ |
||||||
|
{ required: true, message: '开始时间不能为空', trigger: 'blur' } |
||||||
|
], |
||||||
|
endTime: [ |
||||||
|
{ required: true, message: '结束时间不能为空', trigger: 'blur' } |
||||||
|
] |
||||||
|
}, |
||||||
|
isComponentReady: false, |
||||||
|
type:"MthRain", |
||||||
|
} |
||||||
|
}, |
||||||
|
created() { |
||||||
|
this.getMonthRainList() |
||||||
|
|
||||||
|
}, |
||||||
|
mounted() { |
||||||
|
this.$nextTick(() => { |
||||||
|
this.isComponentReady = true; |
||||||
|
}); |
||||||
|
this.$nextTick(() => { |
||||||
|
if (this.$refs.selectStaionRef) { |
||||||
|
this.searchModel.stcd = this.$refs.selectStaionRef.stcds; |
||||||
|
} |
||||||
|
}); |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
handleCountUpdate(count) { |
||||||
|
this.stationNum = count; // 更新父组件的stationNum |
||||||
|
}, |
||||||
|
formatDateToYearMonth(date) { |
||||||
|
if (date == null){ |
||||||
|
return ''; |
||||||
|
} |
||||||
|
const d = new Date(date); |
||||||
|
if (isNaN(d.getTime())) { |
||||||
|
return ''; |
||||||
|
} |
||||||
|
const year = d.getFullYear(); |
||||||
|
const month = (d.getMonth() + 1).toString().padStart(2, '0'); |
||||||
|
return `${year}${month}`; |
||||||
|
}, |
||||||
|
async getMonthRainList() { |
||||||
|
this.searchModel.stcd = this.$refs.selectStaionRef?.stcds || ''; |
||||||
|
const startYearAndMonth= this.formatDateToYearMonth(this.searchModel.startTime) |
||||||
|
const endYearAndMonth= this.formatDateToYearMonth(this.searchModel.endTime) |
||||||
|
const param = { |
||||||
|
pageNum: this.searchModel.pageNum, |
||||||
|
pageSize: this.searchModel.pageSize, |
||||||
|
startTime: startYearAndMonth, |
||||||
|
endTime: endYearAndMonth, |
||||||
|
stcd: this.searchModel.stcd, |
||||||
|
stnm: this.searchModel.stnm |
||||||
|
} |
||||||
|
const res = await measuredFlowResultApi.getRainTableList(param) |
||||||
|
this.tableData = res.data; |
||||||
|
this.total = res.count; |
||||||
|
}, |
||||||
|
handleImport() { |
||||||
|
this.upload.title = "数据导入"; |
||||||
|
this.upload.open = true; |
||||||
|
}, |
||||||
|
handleSizeChange(pageSize) { |
||||||
|
this.searchModel.pageSize = pageSize |
||||||
|
this.getMonthRainList() |
||||||
|
}, |
||||||
|
handleCurrentChange(pageNum) { |
||||||
|
this.searchModel.pageNum = pageNum |
||||||
|
this.getMonthRainList() |
||||||
|
}, |
||||||
|
async exportDate() { |
||||||
|
const startYearAndMonth= this.formatDateToYearMonth(this.searchModel.startTime) |
||||||
|
const endYearAndMonth= this.formatDateToYearMonth(this.searchModel.endTime) |
||||||
|
const stcd = this.searchModel.stcd || ''; // 处理undefined |
||||||
|
const stnm = this.searchModel.stnm || ''; // 处理undefined |
||||||
|
|
||||||
|
const res = await this.$axiosPost('/report/flowResult?startTime=' + |
||||||
|
startYearAndMonth + '&endTime=' + endYearAndMonth + |
||||||
|
'&stcd=' + stcd + '&stnm=' + stnm); |
||||||
|
if (res.code === 0) { |
||||||
|
this.$modal.msgSuccess(res.msg) |
||||||
|
} |
||||||
|
}, |
||||||
|
importSoft(){ |
||||||
|
this.reset(); |
||||||
|
this.softOpen = true; |
||||||
|
this.title = "导入数据到南方片"; |
||||||
|
}, |
||||||
|
reset(){ |
||||||
|
this.form={ |
||||||
|
startTime: '', |
||||||
|
endTime: '' |
||||||
|
} |
||||||
|
this.resetForm("form"); |
||||||
|
}, |
||||||
|
/** 提交按钮 */ |
||||||
|
submitForm() { |
||||||
|
const startYear= this.formatDateToYearMonth(this.form.startTime) |
||||||
|
const endYear= this.formatDateToYearMonth(this.form.endTime) |
||||||
|
const param={ |
||||||
|
startTime: startYear, |
||||||
|
endTime: endYear, |
||||||
|
} |
||||||
|
this.$refs["form"].validate(valid => { |
||||||
|
if (valid) { |
||||||
|
monthRainApi.importDateToSoft(param).then(res => { |
||||||
|
if (res.code === 0) { |
||||||
|
this.$modal.msgSuccess(res.msg) |
||||||
|
this.softOpen = false; |
||||||
|
} |
||||||
|
}) |
||||||
|
} |
||||||
|
}); |
||||||
|
}, |
||||||
|
cancel() { |
||||||
|
this.softOpen = false; |
||||||
|
this.reset(); |
||||||
|
}, |
||||||
|
}, |
||||||
|
} |
||||||
|
</script> |
||||||
|
<style scoped lang="scss"> |
||||||
|
.app-container { |
||||||
|
padding: 20px; |
||||||
|
background: #F2F2F2; |
||||||
|
height: calc(100vh - 100px); |
||||||
|
|
||||||
|
.el-form { |
||||||
|
background: #fff; |
||||||
|
padding: 10px; |
||||||
|
height: 6vh; |
||||||
|
border-radius: 4px; |
||||||
|
box-shadow: 0 0 10px 1px rgba(123, 123, 123, 0.4); |
||||||
|
} |
||||||
|
|
||||||
|
.main-content { |
||||||
|
height: calc(100vh - 150px); |
||||||
|
background: #fff; |
||||||
|
margin-top: 20px; |
||||||
|
padding: 5px; |
||||||
|
border-radius: 4px; |
||||||
|
box-shadow: 0 0 10px 1px rgba(123, 123, 123, 0.4); |
||||||
|
|
||||||
|
.main-title { |
||||||
|
height: 90px; |
||||||
|
|
||||||
|
.table-title { |
||||||
|
font-size: 25px; |
||||||
|
font-weight: bold; |
||||||
|
width: 100%; |
||||||
|
height: 60px; |
||||||
|
text-align: center; |
||||||
|
} |
||||||
|
|
||||||
|
.table-header { |
||||||
|
width: 100%; |
||||||
|
height: 30px; |
||||||
|
line-height: 30px; |
||||||
|
display: inline; |
||||||
|
padding: 0 20px; |
||||||
|
font-size: 14px; |
||||||
|
|
||||||
|
.table-time { |
||||||
|
display: inline; |
||||||
|
float: left; |
||||||
|
margin-left: 20px; |
||||||
|
font-size: 14px; |
||||||
|
color: #606266; |
||||||
|
font-weight: 700; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
:hover::-webkit-scrollbar { |
||||||
|
width: 0; /* 鼠标 hover 时显示滚动条 */ |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
@ -0,0 +1,367 @@ |
|||||||
|
<template> |
||||||
|
<div class="app-container"> |
||||||
|
<el-form :inline="true" class="demo-form-inline"> |
||||||
|
<el-form-item label="起年月"> |
||||||
|
<el-date-picker |
||||||
|
v-model="searchModel.startTime" |
||||||
|
type="month" |
||||||
|
placeholder="选择日期"> |
||||||
|
</el-date-picker> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="截止年月"> |
||||||
|
<el-date-picker |
||||||
|
v-model="searchModel.endTime" |
||||||
|
type="month" |
||||||
|
placeholder="选择日期"> |
||||||
|
</el-date-picker> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="站点"> |
||||||
|
<SelectStaion |
||||||
|
v-if="isComponentReady" |
||||||
|
ref="selectStaionRef" |
||||||
|
:startTime="this.formatDateToYearMonth(this.searchModel.startTime)" |
||||||
|
:endTime="this.formatDateToYearMonth(this.searchModel.endTime)" |
||||||
|
:type="this.type" |
||||||
|
@count-update="handleCountUpdate" |
||||||
|
> |
||||||
|
</SelectStaion> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="站点数量:"> |
||||||
|
{{this.stationNum}} |
||||||
|
</el-form-item> |
||||||
|
<el-form-item> |
||||||
|
<el-button type="primary" @click="getMonthRainList">查询</el-button> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item> |
||||||
|
<el-button type="primary" @click="exportDate">导出</el-button> |
||||||
|
</el-form-item> |
||||||
|
<!-- <el-form-item>--> |
||||||
|
<!-- <el-button--> |
||||||
|
<!-- type="primary"--> |
||||||
|
<!-- @click="importSoft"--> |
||||||
|
<!-- >导入南方片--> |
||||||
|
<!-- </el-button>--> |
||||||
|
<!-- </el-form-item>--> |
||||||
|
</el-form> |
||||||
|
|
||||||
|
<div class="main-content"> |
||||||
|
<div class="main-title"> |
||||||
|
<div class="table-title">实测流量成果表</div> |
||||||
|
<div class="table-header"> |
||||||
|
<div class="table-time">年份:{{ new Date().getFullYear() }}</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<el-table |
||||||
|
:data="tableData" |
||||||
|
height="500" |
||||||
|
border |
||||||
|
style="width: 100%"> |
||||||
|
<el-table-column label="序号" align="center"> |
||||||
|
<template slot-scope="scope"> |
||||||
|
{{ scope.$index + 1 }} |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column |
||||||
|
align="center" |
||||||
|
prop="stcd" |
||||||
|
width="100px" |
||||||
|
label="站码" |
||||||
|
> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column |
||||||
|
align="center" |
||||||
|
prop="stnm" |
||||||
|
label="站名" |
||||||
|
> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column |
||||||
|
align="center" |
||||||
|
prop="addvcd" |
||||||
|
label="行政区划码"> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column |
||||||
|
align="center" |
||||||
|
prop="yr" |
||||||
|
label="年"> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column align="center" prop="mnth" label="月份"></el-table-column> |
||||||
|
<el-table-column align="center" prop="qobno" label="流量施测号数"></el-table-column> |
||||||
|
<el-table-column width="170px" align="center" prop="msqbgtm" label="测流起时间"> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column width="170px" align="center" prop="msqedtm" label="测流止时间"> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column width="100px" align="center" prop="xsqlc" label="测流断面位置"></el-table-column> |
||||||
|
<el-table-column width="150px" align="center" prop="msqmt" label="测流方法"></el-table-column> |
||||||
|
<el-table-column align="center" prop="bsggz" label="基本水尺水位"></el-table-column> |
||||||
|
<el-table-column align="center" prop="q" label="流量"></el-table-column> |
||||||
|
<el-table-column align="center" prop="qrcd" label="流量注解码"></el-table-column> |
||||||
|
<el-table-column align="center" prop="xstta" label="断面总面积"></el-table-column> |
||||||
|
<el-table-column align="center" prop="xsa" label="断面过水面积"></el-table-column> |
||||||
|
<el-table-column align="center" prop="xsarcd" label="断面面积注解码"></el-table-column> |
||||||
|
<el-table-column align="center" prop="xsavv" label="断面平均流速"></el-table-column> |
||||||
|
<el-table-column align="center" prop="xsmxv" label="断面最大流速"></el-table-column> |
||||||
|
<el-table-column align="center" prop="tpwd" label="水面宽"></el-table-column> |
||||||
|
<el-table-column align="center" prop="xsavdp" label="断面平均水深"></el-table-column> |
||||||
|
<el-table-column align="center" prop="xsmxdp" label="断面最大水深"></el-table-column> |
||||||
|
<el-table-column align="center" prop="ibwd" label="水浸冰底宽度"></el-table-column> |
||||||
|
<el-table-column align="center" prop="ibavdp" label="水浸冰底平均水深"></el-table-column> |
||||||
|
<el-table-column align="center" prop="ibmxdp" label="水浸冰底最大水深"></el-table-column> |
||||||
|
<el-table-column align="center" prop="rvsfsl" label="水面比降"></el-table-column> |
||||||
|
<el-table-column align="center" prop="n" label="糙率"></el-table-column> |
||||||
|
<el-table-column align="center" prop="obnont" label="测次说明"></el-table-column> |
||||||
|
</el-table> |
||||||
|
<el-pagination |
||||||
|
@size-change="handleSizeChange" |
||||||
|
@current-change="handleCurrentChange" |
||||||
|
:current-page="searchModel.pageNum" |
||||||
|
:page-sizes="[15, 30, 50,100]" |
||||||
|
:page-size="searchModel.pageSize" |
||||||
|
layout="total, sizes, prev, pager, next, jumper" |
||||||
|
style="padding: 30px 0; text-align: center;" |
||||||
|
:total="total" |
||||||
|
> |
||||||
|
</el-pagination> |
||||||
|
</div> |
||||||
|
<el-dialog :title="title" :visible.sync="softOpen" width="400px" append-to-body> |
||||||
|
<el-form ref="form" :model="form" :rules="rules" label-width="100px"> |
||||||
|
<el-form-item label="起年"> |
||||||
|
<el-date-picker |
||||||
|
v-model="form.startTime" |
||||||
|
type="month" |
||||||
|
placeholder="选择日期" |
||||||
|
> |
||||||
|
</el-date-picker> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="截止年"> |
||||||
|
<el-date-picker |
||||||
|
v-model="form.endTime" |
||||||
|
type="month" |
||||||
|
placeholder="选择日期" |
||||||
|
> |
||||||
|
</el-date-picker> |
||||||
|
</el-form-item> |
||||||
|
</el-form> |
||||||
|
<div slot="footer" class="dialog-footer"> |
||||||
|
<el-button type="primary" @click="submitForm">确 定</el-button> |
||||||
|
<el-button @click="cancel">取 消</el-button> |
||||||
|
</div> |
||||||
|
</el-dialog> |
||||||
|
|
||||||
|
|
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
|
||||||
|
<script> |
||||||
|
import measuredFlowResultApi from "@/api/actualSurvey/measuredFlowResults"; |
||||||
|
import yearRainApi from "@/api/year/yearRain"; |
||||||
|
import SelectStaion from "@/components/SelectStaion/index.vue"; |
||||||
|
export default { |
||||||
|
name: "hourMaxRain", |
||||||
|
components: {SelectStaion}, |
||||||
|
data() { |
||||||
|
return { |
||||||
|
stationNum:'', |
||||||
|
tableData: [], |
||||||
|
uploadData: {}, |
||||||
|
uploadUrl: '/year/importHourMaxRainData', |
||||||
|
total: 0, |
||||||
|
searchModel: { |
||||||
|
startTime: '', |
||||||
|
endTime: '', |
||||||
|
stcd: '', |
||||||
|
stnm: '', |
||||||
|
pageNum: 1, |
||||||
|
pageSize: 15 |
||||||
|
}, |
||||||
|
upload: { |
||||||
|
title: '导入数据', |
||||||
|
open: false |
||||||
|
}, |
||||||
|
|
||||||
|
softOpen:false, |
||||||
|
title:'', |
||||||
|
form:{ |
||||||
|
startTime:'', |
||||||
|
endTime:'' |
||||||
|
}, |
||||||
|
// 表单校验 |
||||||
|
rules: { |
||||||
|
startTime: [ |
||||||
|
{ required: true, message: '开始时间不能为空', trigger: 'blur' } |
||||||
|
], |
||||||
|
endTime: [ |
||||||
|
{ required: true, message: '结束时间不能为空', trigger: 'blur' } |
||||||
|
] |
||||||
|
}, |
||||||
|
isComponentReady: false, |
||||||
|
type:"MthRain", |
||||||
|
} |
||||||
|
}, |
||||||
|
created() { |
||||||
|
this.getMonthRainList() |
||||||
|
|
||||||
|
}, |
||||||
|
mounted() { |
||||||
|
this.$nextTick(() => { |
||||||
|
this.isComponentReady = true; |
||||||
|
}); |
||||||
|
this.$nextTick(() => { |
||||||
|
if (this.$refs.selectStaionRef) { |
||||||
|
this.searchModel.stcd = this.$refs.selectStaionRef.stcds; |
||||||
|
} |
||||||
|
}); |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
handleCountUpdate(count) { |
||||||
|
this.stationNum = count; // 更新父组件的stationNum |
||||||
|
}, |
||||||
|
formatDateToYearMonth(date) { |
||||||
|
if (date == null){ |
||||||
|
return ''; |
||||||
|
} |
||||||
|
const d = new Date(date); |
||||||
|
if (isNaN(d.getTime())) { |
||||||
|
return ''; |
||||||
|
} |
||||||
|
const year = d.getFullYear(); |
||||||
|
const month = (d.getMonth() + 1).toString().padStart(2, '0'); |
||||||
|
return `${year}${month}`; |
||||||
|
}, |
||||||
|
async getMonthRainList() { |
||||||
|
this.searchModel.stcd = this.$refs.selectStaionRef?.stcds || ''; |
||||||
|
const startYearAndMonth= this.formatDateToYearMonth(this.searchModel.startTime) |
||||||
|
const endYearAndMonth= this.formatDateToYearMonth(this.searchModel.endTime) |
||||||
|
const param = { |
||||||
|
pageNum: this.searchModel.pageNum, |
||||||
|
pageSize: this.searchModel.pageSize, |
||||||
|
startTime: startYearAndMonth, |
||||||
|
endTime: endYearAndMonth, |
||||||
|
stcd: this.searchModel.stcd, |
||||||
|
stnm: this.searchModel.stnm |
||||||
|
} |
||||||
|
const res = await measuredFlowResultApi.getRainTableList(param) |
||||||
|
this.tableData = res.data; |
||||||
|
this.total = res.count; |
||||||
|
}, |
||||||
|
handleImport() { |
||||||
|
this.upload.title = "数据导入"; |
||||||
|
this.upload.open = true; |
||||||
|
}, |
||||||
|
handleSizeChange(pageSize) { |
||||||
|
this.searchModel.pageSize = pageSize |
||||||
|
this.getMonthRainList() |
||||||
|
}, |
||||||
|
handleCurrentChange(pageNum) { |
||||||
|
this.searchModel.pageNum = pageNum |
||||||
|
this.getMonthRainList() |
||||||
|
}, |
||||||
|
async exportDate() { |
||||||
|
const startYearAndMonth= this.formatDateToYearMonth(this.searchModel.startTime) |
||||||
|
const endYearAndMonth= this.formatDateToYearMonth(this.searchModel.endTime) |
||||||
|
const stcd = this.searchModel.stcd || ''; // 处理undefined |
||||||
|
const stnm = this.searchModel.stnm || ''; // 处理undefined |
||||||
|
|
||||||
|
const res = await this.$axiosPost('/report/flowResult?startTime=' + |
||||||
|
startYearAndMonth + '&endTime=' + endYearAndMonth + |
||||||
|
'&stcd=' + stcd + '&stnm=' + stnm); |
||||||
|
if (res.code === 0) { |
||||||
|
this.$modal.msgSuccess(res.msg) |
||||||
|
} |
||||||
|
}, |
||||||
|
importSoft(){ |
||||||
|
this.reset(); |
||||||
|
this.softOpen = true; |
||||||
|
this.title = "导入数据到南方片"; |
||||||
|
}, |
||||||
|
reset(){ |
||||||
|
this.form={ |
||||||
|
startTime: '', |
||||||
|
endTime: '' |
||||||
|
} |
||||||
|
this.resetForm("form"); |
||||||
|
}, |
||||||
|
/** 提交按钮 */ |
||||||
|
submitForm() { |
||||||
|
const startYear= this.formatDateToYearMonth(this.form.startTime) |
||||||
|
const endYear= this.formatDateToYearMonth(this.form.endTime) |
||||||
|
const param={ |
||||||
|
startTime: startYear, |
||||||
|
endTime: endYear, |
||||||
|
} |
||||||
|
this.$refs["form"].validate(valid => { |
||||||
|
if (valid) { |
||||||
|
monthRainApi.importDateToSoft(param).then(res => { |
||||||
|
if (res.code === 0) { |
||||||
|
this.$modal.msgSuccess(res.msg) |
||||||
|
this.softOpen = false; |
||||||
|
} |
||||||
|
}) |
||||||
|
} |
||||||
|
}); |
||||||
|
}, |
||||||
|
cancel() { |
||||||
|
this.softOpen = false; |
||||||
|
this.reset(); |
||||||
|
}, |
||||||
|
}, |
||||||
|
} |
||||||
|
</script> |
||||||
|
<style scoped lang="scss"> |
||||||
|
.app-container { |
||||||
|
padding: 20px; |
||||||
|
background: #F2F2F2; |
||||||
|
height: calc(100vh - 100px); |
||||||
|
|
||||||
|
.el-form { |
||||||
|
background: #fff; |
||||||
|
padding: 10px; |
||||||
|
height: 6vh; |
||||||
|
border-radius: 4px; |
||||||
|
box-shadow: 0 0 10px 1px rgba(123, 123, 123, 0.4); |
||||||
|
} |
||||||
|
|
||||||
|
.main-content { |
||||||
|
height: calc(100vh - 150px); |
||||||
|
background: #fff; |
||||||
|
margin-top: 20px; |
||||||
|
padding: 5px; |
||||||
|
border-radius: 4px; |
||||||
|
box-shadow: 0 0 10px 1px rgba(123, 123, 123, 0.4); |
||||||
|
|
||||||
|
.main-title { |
||||||
|
height: 90px; |
||||||
|
|
||||||
|
.table-title { |
||||||
|
font-size: 25px; |
||||||
|
font-weight: bold; |
||||||
|
width: 100%; |
||||||
|
height: 60px; |
||||||
|
text-align: center; |
||||||
|
} |
||||||
|
|
||||||
|
.table-header { |
||||||
|
width: 100%; |
||||||
|
height: 30px; |
||||||
|
line-height: 30px; |
||||||
|
display: inline; |
||||||
|
padding: 0 20px; |
||||||
|
font-size: 14px; |
||||||
|
|
||||||
|
.table-time { |
||||||
|
display: inline; |
||||||
|
float: left; |
||||||
|
margin-left: 20px; |
||||||
|
font-size: 14px; |
||||||
|
color: #606266; |
||||||
|
font-weight: 700; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
:hover::-webkit-scrollbar { |
||||||
|
width: 0; /* 鼠标 hover 时显示滚动条 */ |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
@ -0,0 +1,282 @@ |
|||||||
|
<template> |
||||||
|
<div class="app-container"> |
||||||
|
<div class="el-header"> |
||||||
|
<el-form :inline="true" class="demo-form-inline"> |
||||||
|
<el-form-item label="起年"> |
||||||
|
<el-date-picker |
||||||
|
v-model="searchModel.startTime" |
||||||
|
type="year" |
||||||
|
placeholder="选择日期"> |
||||||
|
</el-date-picker> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="截止年"> |
||||||
|
<el-date-picker |
||||||
|
v-model="searchModel.endTime" |
||||||
|
type="year" |
||||||
|
placeholder="选择日期"> |
||||||
|
</el-date-picker> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="站点"> |
||||||
|
<SelectStaion |
||||||
|
v-if="isComponentReady" |
||||||
|
ref="selectStaionRef" |
||||||
|
:startTime="this.formatDateToYear(this.searchModel.startTime)" |
||||||
|
:endTime="this.formatDateToYear(this.searchModel.endTime)" |
||||||
|
:type="this.type" |
||||||
|
@count-update="handleCountUpdate" |
||||||
|
> |
||||||
|
</SelectStaion> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="站点数量:"> |
||||||
|
{{this.stationNum}} |
||||||
|
</el-form-item> |
||||||
|
<el-form-item> |
||||||
|
<el-button type="primary" @click="getList">查询</el-button> |
||||||
|
</el-form-item> |
||||||
|
<!-- <el-form-item>--> |
||||||
|
<!-- <el-button--> |
||||||
|
<!-- type="primary"--> |
||||||
|
<!-- @click="importSoft"--> |
||||||
|
<!-- >导入南方片--> |
||||||
|
<!-- </el-button>--> |
||||||
|
<!-- </el-form-item>--> |
||||||
|
</el-form> |
||||||
|
</div> |
||||||
|
<div class="el-main"> |
||||||
|
<el-table border :span-method="arraySpanMethod" v-loading="loading" :data="cgtaskList" @selection-change="handleSelectionChange"> |
||||||
|
<el-table-column label="站码" width="100px" align="center" prop="stcd" /> |
||||||
|
<el-table-column label="站名" width="200px" align="center" prop="stnm" /> |
||||||
|
<el-table-column label="成果类型" width="200px" align="center" prop="resType" /> |
||||||
|
<el-table-column label="成果表" width="300px" align="center" prop="resTable"/> |
||||||
|
<el-table-column label="年份" align="center" prop="statYear"/> |
||||||
|
</el-table> |
||||||
|
|
||||||
|
<pagination |
||||||
|
v-show="total>0" |
||||||
|
:total="total" |
||||||
|
:page.sync="searchModel.page" |
||||||
|
:limit.sync="searchModel.limit" |
||||||
|
@pagination="getList" |
||||||
|
/> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import {treeselect} from "@/api/system/dept"; |
||||||
|
import Treeselect from "@riophae/vue-treeselect"; |
||||||
|
import "@riophae/vue-treeselect/dist/vue-treeselect.css"; |
||||||
|
import SelectStaion from "@/components/SelectStaion/index.vue"; |
||||||
|
|
||||||
|
|
||||||
|
export default { |
||||||
|
name: "Cgtask", |
||||||
|
components: {SelectStaion, Treeselect}, |
||||||
|
data() { |
||||||
|
return { |
||||||
|
// 遮罩层 |
||||||
|
loading: true, |
||||||
|
// 选中数组 |
||||||
|
ids: [], |
||||||
|
// 非单个禁用 |
||||||
|
single: true, |
||||||
|
// 非多个禁用 |
||||||
|
multiple: true, |
||||||
|
// 显示搜索条件 |
||||||
|
showSearch: true, |
||||||
|
// 总条数 |
||||||
|
total: 0, |
||||||
|
// 整编成果下载任务表格数据 |
||||||
|
cgtaskList: [], |
||||||
|
// 弹出层标题 |
||||||
|
title: "", |
||||||
|
// 是否显示弹出层 |
||||||
|
open: false, |
||||||
|
searchModel: { |
||||||
|
startTime: '', |
||||||
|
endTime: '', |
||||||
|
stcdIds: '', |
||||||
|
page: 1, |
||||||
|
limit: 15 |
||||||
|
}, |
||||||
|
|
||||||
|
// 表单参数 |
||||||
|
form: {}, |
||||||
|
// 表单校验 |
||||||
|
rules: {}, |
||||||
|
dateYear: [], |
||||||
|
deptOptions: undefined, |
||||||
|
isComponentReady: false, |
||||||
|
type:"YcStat", |
||||||
|
stationNum:'' |
||||||
|
}; |
||||||
|
}, |
||||||
|
created() { |
||||||
|
this.getList(); |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
handleCountUpdate(count) { |
||||||
|
this.stationNum = count; // 更新父组件的stationNum |
||||||
|
}, |
||||||
|
formatDateToYear(date) { |
||||||
|
if (!date) return null; // 允许空值传递 |
||||||
|
const d = new Date(date); |
||||||
|
return isNaN(d.getTime()) ? null : `${d.getFullYear()}`; |
||||||
|
} , |
||||||
|
/** 获取数据类型 */ |
||||||
|
getType(val) { |
||||||
|
for (var i = 0; i < this.sTypes.length; i++) { |
||||||
|
if (val == this.sTypes[i].key) { |
||||||
|
return this.sTypes[i].label |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
// arraySpanMethod({ row, column, rowIndex, columnIndex }) { |
||||||
|
// const props = ['name', 'areaName', 'typeName', 'resType']; |
||||||
|
// if (columnIndex < 4 ) { // 只对前4列进行合并 |
||||||
|
// const prop = props[columnIndex]; |
||||||
|
// if (rowIndex === 0 || row[prop] !== this.cgtaskList[rowIndex - 1][prop] || this.cgtaskList[rowIndex].name !== this.cgtaskList[rowIndex - 1].name) { |
||||||
|
// let rowspan = 1; |
||||||
|
// for (let i = rowIndex + 1; i < this.cgtaskList.length; i++) { |
||||||
|
// if (this.cgtaskList[i][prop] === row[prop] && this.cgtaskList[i].name === this.cgtaskList[rowIndex].name) { |
||||||
|
// rowspan++; |
||||||
|
// } else { |
||||||
|
// break; |
||||||
|
// } |
||||||
|
// } |
||||||
|
// return { rowspan, colspan: 1 }; |
||||||
|
// } else { |
||||||
|
// return { rowspan: 0, colspan: 0 }; |
||||||
|
// } |
||||||
|
// } |
||||||
|
// // 默认不合并 |
||||||
|
// return { rowspan: 1, colspan: 1 }; |
||||||
|
// }, |
||||||
|
arraySpanMethod({ row, column, rowIndex, columnIndex }) { |
||||||
|
const props = ['stcd','stnm','resType']; |
||||||
|
if (columnIndex < 3 ) { // 只对前4列进行合并 |
||||||
|
const prop = props[columnIndex]; |
||||||
|
if (rowIndex === 0 || row[prop] !== this.cgtaskList[rowIndex - 1][prop] || this.cgtaskList[rowIndex].stcd !== this.cgtaskList[rowIndex - 1].stcd) { |
||||||
|
let rowspan = 1; |
||||||
|
for (let i = rowIndex + 1; i < this.cgtaskList.length; i++) { |
||||||
|
if (this.cgtaskList[i][prop] === row[prop] && this.cgtaskList[i].stcd === this.cgtaskList[rowIndex].stcd) { |
||||||
|
rowspan++; |
||||||
|
} else { |
||||||
|
break; |
||||||
|
} |
||||||
|
} |
||||||
|
return { rowspan, colspan: 1 }; |
||||||
|
} else { |
||||||
|
return { rowspan: 0, colspan: 0 }; |
||||||
|
} |
||||||
|
} |
||||||
|
// 默认不合并 |
||||||
|
return { rowspan: 1, colspan: 1 }; |
||||||
|
}, |
||||||
|
/** 查询整编成果下载任务列表 */ |
||||||
|
async getList() { |
||||||
|
this.loading = true; |
||||||
|
this.searchModel.stcd = this.$refs.selectStaionRef?.stcds || ''; |
||||||
|
let res = await this.$axiosGet('/basic/getStatInfo', this.searchModel); |
||||||
|
if (res.code === 0) { |
||||||
|
this.cgtaskList = res.data; |
||||||
|
this.total = res.count; |
||||||
|
} |
||||||
|
this.loading = false; |
||||||
|
}, |
||||||
|
// 取消按钮 |
||||||
|
cancel() { |
||||||
|
this.open = false; |
||||||
|
this.reset(); |
||||||
|
}, |
||||||
|
// 表单重置 |
||||||
|
reset() { |
||||||
|
this.form = { |
||||||
|
id: null, |
||||||
|
type: null, |
||||||
|
status: 0, |
||||||
|
startTime: null, |
||||||
|
startYear: null, |
||||||
|
endYear: null, |
||||||
|
deptId: null |
||||||
|
}; |
||||||
|
this.resetForm("form"); |
||||||
|
}, |
||||||
|
/** 搜索按钮操作 */ |
||||||
|
handleQuery() { |
||||||
|
this.queryParams.page = 1; |
||||||
|
this.getList(); |
||||||
|
}, |
||||||
|
/** 重置按钮操作 */ |
||||||
|
resetQuery() { |
||||||
|
this.resetForm("queryForm"); |
||||||
|
this.handleQuery(); |
||||||
|
}, |
||||||
|
// 多选框选中数据 |
||||||
|
handleSelectionChange(selection) { |
||||||
|
this.ids = selection.map(item => item.id) |
||||||
|
this.single = selection.length !== 1 |
||||||
|
this.multiple = !selection.length |
||||||
|
}, |
||||||
|
/** 删除按钮操作 */ |
||||||
|
async handleDelete(row) { |
||||||
|
const ids = row.id || this.ids; |
||||||
|
this.$confirm('您确定要删除这个任务吗?', '确认删除', { |
||||||
|
confirmButtonText: '删除', |
||||||
|
cancelButtonText: '取消', |
||||||
|
type: 'warning' |
||||||
|
}).then(async () => { |
||||||
|
let res = await this.$axiosDelete('/basic/cgtask/delete/' + ids); |
||||||
|
if (res.code === 0) { |
||||||
|
this.$modal.msgSuccess("删除成功"); |
||||||
|
await this.getList(); |
||||||
|
} |
||||||
|
}).catch(() => { |
||||||
|
this.$modal.msg("取消删除"); |
||||||
|
}); |
||||||
|
}, |
||||||
|
/** 导出按钮操作 */ |
||||||
|
handleExport() { |
||||||
|
this.download('report/cgtask/export', { |
||||||
|
...this.queryParams |
||||||
|
}, `cgtask_${new Date().getTime()}.xls`) |
||||||
|
} |
||||||
|
}, |
||||||
|
mounted() { |
||||||
|
this.$nextTick(() => { |
||||||
|
this.isComponentReady = true; |
||||||
|
}); |
||||||
|
this.$nextTick(() => { |
||||||
|
if (this.$refs.selectStaionRef) { |
||||||
|
this.searchModel.stcd = this.$refs.selectStaionRef.stcds; |
||||||
|
} |
||||||
|
}); |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
||||||
|
<style scoped lang="scss"> |
||||||
|
.app-container { |
||||||
|
background: #F2F2F2; |
||||||
|
|
||||||
|
.el-header { |
||||||
|
border-radius: 4px; |
||||||
|
background: #FFFFFF; |
||||||
|
color: #333; |
||||||
|
padding: 10px; |
||||||
|
height: 55px; |
||||||
|
box-shadow: 0 0 10px 1px rgba(123, 123, 123, 0.4); |
||||||
|
} |
||||||
|
|
||||||
|
.el-main { |
||||||
|
border-radius: 4px; |
||||||
|
color: #333; |
||||||
|
background: #FFFFFF; |
||||||
|
text-align: center; |
||||||
|
height: calc(95vh - 115px); |
||||||
|
padding: 5px !important; |
||||||
|
margin-top: 10px; |
||||||
|
padding-bottom: 15px !important; |
||||||
|
box-shadow: 0 0 10px 1px rgba(123, 123, 123, 0.4); |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
Loading…
Reference in new issue