39 changed files with 1611 additions and 247 deletions
@ -0,0 +1,37 @@
@@ -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 @@
@@ -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 @@
@@ -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 @@
@@ -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