jiangyy
4 years ago
8 changed files with 21 additions and 1475 deletions
@ -1,467 +0,0 @@ |
|||||
<template> |
|
||||
<div> |
|
||||
<el-card shadow="never" |
|
||||
class="aui-card--fill"> |
|
||||
<div class="mod-demo__demo}"> |
|
||||
<el-form :inline="true" |
|
||||
:model="tableParams" |
|
||||
@keyup.enter.native="loadTable()"> |
|
||||
|
|
||||
<div> |
|
||||
<el-form-item style="margin-left:10px"> |
|
||||
<el-button @click="handleBack()" |
|
||||
size="mini" |
|
||||
icon="el-icon-back" |
|
||||
type="warning" |
|
||||
plain>返回</el-button> |
|
||||
</el-form-item> |
|
||||
|
|
||||
<el-form-item label="所属组织" |
|
||||
:label-width="labelWidth"> |
|
||||
<el-cascader ref="myCascader" |
|
||||
v-model="agencyIdArray" |
|
||||
style="width:480px" |
|
||||
:key="iscascaderShow" |
|
||||
:options="casOptions" |
|
||||
:props="optionProps" |
|
||||
@change="handleChange"></el-cascader> |
|
||||
</el-form-item> |
|
||||
|
|
||||
<div> |
|
||||
<el-form-item label="统计类型" |
|
||||
:label-width="labelWidth"> |
|
||||
<el-radio v-model="staticType" |
|
||||
label="end">截止累计值</el-radio> |
|
||||
<el-radio v-model="staticType" |
|
||||
label="Interval">区间新增值</el-radio> |
|
||||
|
|
||||
<el-date-picker style="margin-left:30px" |
|
||||
v-if="staticType==='Interval'" |
|
||||
v-model="timeArray" |
|
||||
type="daterange" |
|
||||
range-separator="至" |
|
||||
@change="handleTimeChange" |
|
||||
format="yyyy-MM-dd" |
|
||||
:picker-options="pickerOptions" |
|
||||
start-placeholder="开始日期" |
|
||||
end-placeholder="结束日期"> |
|
||||
</el-date-picker> |
|
||||
|
|
||||
<el-date-picker style="margin-left:30px" |
|
||||
v-if="staticType==='end'" |
|
||||
v-model="endTimeModel" |
|
||||
@change="handleEndTimeChange" |
|
||||
:picker-options="pickerOptions" |
|
||||
type="date" |
|
||||
placeholder="选择日期"> |
|
||||
</el-date-picker> |
|
||||
</el-form-item> |
|
||||
<el-form-item style="margin-left:10px"> |
|
||||
<el-button @click="loadTable()" |
|
||||
type="primary">查询</el-button> |
|
||||
</el-form-item> |
|
||||
<el-form-item style="margin-left:10px"> |
|
||||
<el-button @click="loadOutTableData()" |
|
||||
type="primary">导出</el-button> |
|
||||
</el-form-item> |
|
||||
</div> |
|
||||
|
|
||||
</div> |
|
||||
</el-form> |
|
||||
|
|
||||
<el-table :data="tableData" |
|
||||
border |
|
||||
v-loading="tableLoading" |
|
||||
:height="tableHeight" |
|
||||
style="width: 100%"> |
|
||||
<el-table-column prop="staffName" |
|
||||
label="网格员" |
|
||||
align="center" |
|
||||
min-width="80"> |
|
||||
</el-table-column> |
|
||||
<el-table-column prop="gridName" |
|
||||
label="所属网格" |
|
||||
align="center" |
|
||||
min-width="200"> |
|
||||
</el-table-column> |
|
||||
<el-table-column prop="statusName" |
|
||||
label="巡查状态" |
|
||||
align="center" |
|
||||
min-width="150"> |
|
||||
</el-table-column> |
|
||||
|
|
||||
<el-table-column prop="patrolStartTime" |
|
||||
label="巡查开始时间" |
|
||||
align="center" |
|
||||
min-width="140"> |
|
||||
</el-table-column> |
|
||||
<el-table-column prop="patrolEndTime" |
|
||||
label="巡查结束时间" |
|
||||
align="center" |
|
||||
min-width="140"> |
|
||||
</el-table-column> |
|
||||
<el-table-column prop="totalTime" |
|
||||
label="巡查时长" |
|
||||
align="center" |
|
||||
min-width="130px"> |
|
||||
</el-table-column> |
|
||||
|
|
||||
</el-table> |
|
||||
<div> |
|
||||
<el-pagination @size-change="handleSizeChange" |
|
||||
@current-change="handleCurrentChange" |
|
||||
:current-page.sync="tableParams.pageNo" |
|
||||
:page-sizes="[20, 30, 50]" |
|
||||
:page-size="tableParams.pageSize" |
|
||||
layout="sizes, prev, pager, next, total" |
|
||||
:total="total"> |
|
||||
</el-pagination> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
</el-card> |
|
||||
|
|
||||
</div> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
import util from '@js/util.js'; |
|
||||
import { mapGetters } from 'vuex' |
|
||||
import { Loading } from 'element-ui' // 引入Loading服务 |
|
||||
import { requestPost } from '@/js/dai/request' |
|
||||
|
|
||||
let loading // 加载动画 |
|
||||
|
|
||||
export default { |
|
||||
data () { |
|
||||
return { |
|
||||
tableData: [], |
|
||||
tableLoading: false, |
|
||||
|
|
||||
downloadLoading: false, |
|
||||
|
|
||||
//查询条件标题宽度 |
|
||||
labelWidth: '70px', |
|
||||
casOptions: [], |
|
||||
selAgencyObj: {}, |
|
||||
agencyIdArray: [], |
|
||||
|
|
||||
iscascaderShow: 0, |
|
||||
|
|
||||
optionProps: { |
|
||||
multiple: false, |
|
||||
value: 'agencyId', |
|
||||
label: 'agencyName', |
|
||||
children: 'subAgencyList', |
|
||||
checkStrictly: true |
|
||||
}, |
|
||||
|
|
||||
pickerOptions: { //控制时间范围 |
|
||||
disabledDate (time) { |
|
||||
return time.getTime() > (Date.now() - (24 * 60 * 60 * 1000)) |
|
||||
} |
|
||||
}, |
|
||||
staticType: 'end', |
|
||||
|
|
||||
|
|
||||
tableParams: { |
|
||||
staffId: '', //巡查工作人员ID |
|
||||
orgId: '', //组织ID |
|
||||
orgType: '', //组织类型 组织：agency，网格：grid |
|
||||
pageSize: 20, |
|
||||
pageNo: 1, |
|
||||
startTime: '', //开始时间【yyyymmdd】 ,截止累计值 |
|
||||
endTime: '', //结束时间【yyyymmdd】, |
|
||||
}, |
|
||||
total: 0, |
|
||||
timeArray: ['', ''], |
|
||||
|
|
||||
agencyName: '', |
|
||||
startTimeShow: '',//导出表格标题处显示的内容 |
|
||||
endTimeShow: '', //导出表格标题处显示的内容 |
|
||||
endTimeModel: new Date() - 60 * 60 * 24 * 2, |
|
||||
|
|
||||
//弹出详情相关 |
|
||||
diaShow: false, |
|
||||
|
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
mounted () { |
|
||||
|
|
||||
}, |
|
||||
|
|
||||
methods: { |
|
||||
//初始化数据 |
|
||||
loadDate (selAgencyObj, tableParams, staticType, timeArray, endTimeModel, startTimeShow, endTimeShow) { |
|
||||
debugger |
|
||||
//初始化日期 |
|
||||
this.initDate() |
|
||||
this.selAgencyObj = JSON.parse(JSON.stringify(selAgencyObj)) |
|
||||
let params = JSON.parse(JSON.stringify(tableParams)) |
|
||||
Object.assign(this.tableParams, params) |
|
||||
this.staticType = staticType |
|
||||
|
|
||||
this.timeArray = JSON.parse(JSON.stringify(timeArray)) |
|
||||
this.endTimeModel = JSON.parse(JSON.stringify(endTimeModel)) |
|
||||
this.startTimeShow = startTimeShow |
|
||||
this.endTimeShow = endTimeShow |
|
||||
|
|
||||
}, |
|
||||
async initTable (agencyIdArray, row, casOptions, agencyName) { |
|
||||
this.startLoading() |
|
||||
|
|
||||
//初始化组织数据 |
|
||||
this.initAgencyList(casOptions) |
|
||||
this.tableParams.staffId = row.staffId |
|
||||
this.agencyIdArray = agencyIdArray |
|
||||
this.agencyName = agencyName |
|
||||
|
|
||||
await this.loadTable()//获取组织级联列表 |
|
||||
|
|
||||
this.endLoading() |
|
||||
}, |
|
||||
|
|
||||
initAgencyList (casOptions) { |
|
||||
++this.iscascaderShow |
|
||||
this.casOptions = [] |
|
||||
this.agencyIdArray = [] |
|
||||
if (casOptions) { |
|
||||
this.casOptions = casOptions |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
async loadTable () { |
|
||||
if (this.validate()) { |
|
||||
const url = '/epmetuser/staffpatrol/pcwork/record-list' |
|
||||
// const url = 'http://yapi.elinkservice.cn/mock/102/epmetuser/staffpatrol/pcwork/record-list' |
|
||||
|
|
||||
if (this.staticType === 'end') { |
|
||||
this.tableParams.startTime = '' |
|
||||
} |
|
||||
this.tableLoading = true |
|
||||
const { data, code, msg } = await requestPost(url, this.tableParams) |
|
||||
this.tableLoading = false |
|
||||
if (code === 0) { |
|
||||
this.total = 0 |
|
||||
this.tableData = [] |
|
||||
if (data) { |
|
||||
if (data.total) { |
|
||||
this.total = data.total |
|
||||
} |
|
||||
|
|
||||
if (data.list) { |
|
||||
this.tableData = data.list |
|
||||
} |
|
||||
|
|
||||
|
|
||||
} |
|
||||
|
|
||||
|
|
||||
} else { |
|
||||
this.$message.error(msg) |
|
||||
} |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
handleChange (value) { |
|
||||
|
|
||||
if (value && value.length > 0) { |
|
||||
this.selAgencyObj = this.$refs["myCascader"].getCheckedNodes()[0].data |
|
||||
|
|
||||
} else { |
|
||||
this.selAgencyObj = {} |
|
||||
|
|
||||
} |
|
||||
|
|
||||
}, |
|
||||
|
|
||||
initDate () { |
|
||||
//设置默认结束日期为前一天 |
|
||||
const date = new Date() |
|
||||
const month = date.getMonth() + 1 > 9 ? (date.getMonth() + 1) : '0' + (date.getMonth() + 1) |
|
||||
const day = date.getDate() - 1 > 9 ? (date.getDate() - 1) : '0' + (date.getDate() - 1) |
|
||||
const yesterday = date.getFullYear() + '-' + month + '-' + day |
|
||||
this.timeArray = ['', yesterday] |
|
||||
this.endTimeModel = yesterday |
|
||||
|
|
||||
let yesterdayArray = yesterday.split('-') |
|
||||
this.tableParams.endTime = yesterdayArray[0] + yesterdayArray[1] + yesterdayArray[2] |
|
||||
this.endTimeShow = yesterdayArray[0] + '年' + yesterdayArray[1] + '月' + yesterdayArray[2] + '日' |
|
||||
}, |
|
||||
|
|
||||
|
|
||||
handleEndTimeChange (item) { |
|
||||
if (item) { |
|
||||
const endTimeArray = util.dateFormatter(item, 'date').split('-') |
|
||||
this.tableParams.endTime = endTimeArray[0] + endTimeArray[1] + endTimeArray[2] |
|
||||
this.endTime = endTimeArray[0] + '年' + endTimeArray[1] + '月' + endTimeArray[2] + '日' |
|
||||
} else { |
|
||||
this.tableParams.endTime = '' |
|
||||
this.endTimeShow = '' |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
handleTimeChange (time) { |
|
||||
if (time) { |
|
||||
const startTimeArray = util.dateFormatter(time[0], 'date').split('-') |
|
||||
const endTimeArray = util.dateFormatter(time[1], 'date').split('-') |
|
||||
|
|
||||
this.tableParams.startTime = startTimeArray[0] + startTimeArray[1] + startTimeArray[2] |
|
||||
this.tableParams.endTime = endTimeArray[0] + endTimeArray[1] + endTimeArray[2] |
|
||||
|
|
||||
this.startTimeShow = startTimeArray[0] + '年' + startTimeArray[1] + '月' + startTimeArray[2] + '日' |
|
||||
this.endTimeShow = endTimeArray[0] + '年' + endTimeArray[1] + '月' + endTimeArray[2] + '日' |
|
||||
} else { |
|
||||
this.tableParams.startTime = '' |
|
||||
this.tableParams.endTime = '' |
|
||||
this.startTimeShow = '' |
|
||||
this.endTimeShow = '' |
|
||||
} |
|
||||
|
|
||||
}, |
|
||||
|
|
||||
handleSizeChange (val) { |
|
||||
this.tableParams.pageSize = val |
|
||||
this.tableParams.pageNo = 1 |
|
||||
this.loadTable() |
|
||||
}, |
|
||||
handleCurrentChange (val) { |
|
||||
this.tableParams.pageNo = val |
|
||||
this.loadTable() |
|
||||
}, |
|
||||
handleBack () { |
|
||||
this.$emit('back') |
|
||||
}, |
|
||||
validate () { |
|
||||
if (this.staticType === 'Interval' && (!this.tableParams.endTime || !this.tableParams.startTime)) { |
|
||||
this.$message.info("请选择起止日期") |
|
||||
return false |
|
||||
} |
|
||||
if (this.staticType === 'end' && !this.tableParams.endTime) { |
|
||||
this.$message.info("请选择结束日期") |
|
||||
return false |
|
||||
} |
|
||||
|
|
||||
if (this.selAgencyObj) { |
|
||||
this.agencyName = this.selAgencyObj.agencyName |
|
||||
this.tableParams.orgId = this.selAgencyObj.agencyId |
|
||||
this.tableParams.orgType = this.selAgencyObj.level === 'grid' ? 'grid' : 'agency' |
|
||||
} else { |
|
||||
this.tableParams.orgId = '' |
|
||||
this.tableParams.orgType = '' |
|
||||
} |
|
||||
|
|
||||
return true |
|
||||
}, |
|
||||
|
|
||||
//导出表格 |
|
||||
async loadOutTableData () { |
|
||||
if (!this.validate()) { |
|
||||
return false |
|
||||
} |
|
||||
let title = this.agencyName |
|
||||
|
|
||||
if (this.staticType === 'Interval') { |
|
||||
title = title + ' 项目 ' + this.startTimeShow + '-' + this.endTimeShow + '区间增长值' |
|
||||
} else { |
|
||||
title = title + ' 项目 截止至' + this.endTimeShow + '累计值' |
|
||||
} |
|
||||
console.log(title) |
|
||||
|
|
||||
const url = "/epmetuser/staffpatrol/pcwork/record-list/export" |
|
||||
|
|
||||
app.ajax.exportFilePost( |
|
||||
url, |
|
||||
this.tableParams, |
|
||||
(data, rspMsg) => { |
|
||||
|
|
||||
this.download(data, title + '.xls') |
|
||||
}, |
|
||||
(rspMsg, data) => { |
|
||||
this.$message.error(rspMsg); |
|
||||
} |
|
||||
); |
|
||||
|
|
||||
}, |
|
||||
|
|
||||
// 下载文件 |
|
||||
download (data, fileName) { |
|
||||
if (!data) { |
|
||||
return |
|
||||
} |
|
||||
|
|
||||
var csvData = new Blob([data]) |
|
||||
|
|
||||
if (window.navigator && window.navigator.msSaveOrOpenBlob) { |
|
||||
window.navigator.msSaveOrOpenBlob(csvData, fileName); |
|
||||
} |
|
||||
// for Non-IE (chrome, firefox etc.) |
|
||||
else { |
|
||||
var a = document.createElement('a'); |
|
||||
document.body.appendChild(a); |
|
||||
a.style = 'display: none'; |
|
||||
var url = window.URL.createObjectURL(csvData); |
|
||||
a.href = url; |
|
||||
a.download = fileName; |
|
||||
a.click(); |
|
||||
a.remove(); |
|
||||
window.URL.revokeObjectURL(url); |
|
||||
} |
|
||||
|
|
||||
}, |
|
||||
|
|
||||
// 开启加载动画 |
|
||||
startLoading () { |
|
||||
loading = Loading.service({ |
|
||||
lock: true, // 是否锁定 |
|
||||
text: '正在加载……', // 加载中需要显示的文字 |
|
||||
background: 'rgba(0,0,0,.7)' // 背景颜色 |
|
||||
}) |
|
||||
}, |
|
||||
// 结束加载动画 |
|
||||
endLoading () { |
|
||||
// clearTimeout(timer); |
|
||||
if (loading) { |
|
||||
loading.close() |
|
||||
} |
|
||||
} |
|
||||
}, |
|
||||
computed: { |
|
||||
tableHeight () { |
|
||||
return this.clientHeight - 60 - 80 - 80 - 100 |
|
||||
}, |
|
||||
|
|
||||
...mapGetters(['clientHeight']) |
|
||||
}, |
|
||||
components: { |
|
||||
|
|
||||
}, |
|
||||
activated () { |
|
||||
this.$nextTick(() => { |
|
||||
this.$refs.ref_table.doLayout() // 解决表格错位 |
|
||||
}) |
|
||||
}, |
|
||||
} |
|
||||
</script> |
|
||||
<style lang="css" scoped> |
|
||||
.myNote { |
|
||||
display: -webkit-box; |
|
||||
text-overflow: ellipsis; |
|
||||
overflow: hidden; |
|
||||
-webkit-line-clamp: 3; |
|
||||
-webkit-box-orient: vertical; |
|
||||
} |
|
||||
/* .register .el-table .el-table__header-wrapper { |
|
||||
position: absolute; |
|
||||
top: 0; |
|
||||
left: 0; |
|
||||
}*/ |
|
||||
/* |
|
||||
.register .el-table .el-table__fixed-body-wrapper { |
|
||||
height: calc(100% - 44px); |
|
||||
margin-top: 44px; |
|
||||
overflow-y: auto !important; |
|
||||
} */ |
|
||||
</style> |
|
||||
|
|
||||
@ -1,493 +0,0 @@ |
|||||
<template> |
|
||||
<div> |
|
||||
<el-card shadow="never" |
|
||||
class="aui-card--fill"> |
|
||||
<div class="mod-demo__demo}"> |
|
||||
<el-form :inline="true" |
|
||||
:model="tableParams" |
|
||||
@keyup.enter.native="loadTable()"> |
|
||||
|
|
||||
<div> |
|
||||
<el-form-item style="margin-left:10px"> |
|
||||
<el-button @click="handleBack()" |
|
||||
size="mini" |
|
||||
icon="el-icon-back" |
|
||||
type="warning" |
|
||||
plain>返回</el-button> |
|
||||
</el-form-item> |
|
||||
|
|
||||
<el-form-item label="所属组织" |
|
||||
:label-width="labelWidth"> |
|
||||
<el-cascader ref="myCascader" |
|
||||
v-model="agencyIdArray" |
|
||||
style="width:480px" |
|
||||
:key="iscascaderShow" |
|
||||
:options="casOptions" |
|
||||
:props="optionProps" |
|
||||
@change="handleChange"></el-cascader> |
|
||||
</el-form-item> |
|
||||
|
|
||||
<div> |
|
||||
<el-form-item label="统计类型" |
|
||||
:label-width="labelWidth"> |
|
||||
<el-radio v-model="staticType" |
|
||||
label="end">截止累计值</el-radio> |
|
||||
<el-radio v-model="staticType" |
|
||||
label="Interval">区间新增值</el-radio> |
|
||||
|
|
||||
<el-date-picker style="margin-left:30px" |
|
||||
v-if="staticType==='Interval'" |
|
||||
v-model="timeArray" |
|
||||
type="daterange" |
|
||||
range-separator="至" |
|
||||
@change="handleTimeChange" |
|
||||
format="yyyy-MM-dd" |
|
||||
:picker-options="pickerOptions" |
|
||||
start-placeholder="开始日期" |
|
||||
end-placeholder="结束日期"> |
|
||||
</el-date-picker> |
|
||||
|
|
||||
<el-date-picker style="margin-left:30px" |
|
||||
v-if="staticType==='end'" |
|
||||
v-model="endTimeModel" |
|
||||
@change="handleEndTimeChange" |
|
||||
:picker-options="pickerOptions" |
|
||||
type="date" |
|
||||
placeholder="选择日期"> |
|
||||
</el-date-picker> |
|
||||
</el-form-item> |
|
||||
<el-form-item style="margin-left:10px"> |
|
||||
<el-button @click="loadTable()" |
|
||||
type="primary">查询</el-button> |
|
||||
</el-form-item> |
|
||||
<el-form-item style="margin-left:10px"> |
|
||||
<el-button @click="loadOutTableData()" |
|
||||
type="primary">导出</el-button> |
|
||||
</el-form-item> |
|
||||
</div> |
|
||||
|
|
||||
</div> |
|
||||
</el-form> |
|
||||
|
|
||||
<el-table :data="tableData" |
|
||||
border |
|
||||
style="width: 100%"> |
|
||||
<el-table-column prop="title" |
|
||||
label="项目事件标题" |
|
||||
align="center" |
|
||||
min-width="280"> |
|
||||
</el-table-column> |
|
||||
<el-table-column prop="projectCategory" |
|
||||
label="项目事件类别" |
|
||||
align="center" |
|
||||
min-width="200"> |
|
||||
</el-table-column> |
|
||||
<el-table-column prop="locateAddress" |
|
||||
label="发生地点" |
|
||||
align="center" |
|
||||
min-width="120"> |
|
||||
</el-table-column> |
|
||||
<el-table-column prop="happenTime" |
|
||||
label="发生日期" |
|
||||
align="center" |
|
||||
min-width="120"> |
|
||||
</el-table-column> |
|
||||
<el-table-column prop="staffName" |
|
||||
label="网格员" |
|
||||
align="center" |
|
||||
min-width="80"> |
|
||||
</el-table-column> |
|
||||
<el-table-column prop="gridName" |
|
||||
label="所属网格" |
|
||||
align="center" |
|
||||
min-width="150"> |
|
||||
</el-table-column> |
|
||||
|
|
||||
<el-table-column prop="createdTime" |
|
||||
label="提交日期" |
|
||||
align="center" |
|
||||
min-width="140"> |
|
||||
</el-table-column> |
|
||||
<el-table-column label="操作" |
|
||||
fixed="right" |
|
||||
width="140" |
|
||||
header-align="center" |
|
||||
align="center" |
|
||||
class="operate"> |
|
||||
<template slot-scope="scope"> |
|
||||
|
|
||||
<el-button type="text" |
|
||||
style="color:#D51010;" |
|
||||
size="small" |
|
||||
@click="handleDetail(scope.row)">查看详情</el-button> |
|
||||
|
|
||||
</template> |
|
||||
</el-table-column> |
|
||||
</el-table> |
|
||||
<div> |
|
||||
<el-pagination @size-change="handleSizeChange" |
|
||||
@current-change="handleCurrentChange" |
|
||||
:current-page.sync="tableParams.pageNo" |
|
||||
:page-sizes="[20, 30, 50]" |
|
||||
:page-size="tableParams.pageSize" |
|
||||
layout="sizes, prev, pager, next, total" |
|
||||
:total="total"> |
|
||||
</el-pagination> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
</el-card> |
|
||||
|
|
||||
<!-- 修改弹出框 --> |
|
||||
<el-dialog :visible.sync="diaShow" |
|
||||
:close-on-click-modal="false" |
|
||||
:close-on-press-escape="false" |
|
||||
:title="'项目详情'" |
|
||||
top="5vh" |
|
||||
width="50%" |
|
||||
@closed="diaClose"> |
|
||||
<project-Detail ref="ref_projectDetail"> |
|
||||
|
|
||||
</project-Detail> |
|
||||
</el-dialog> |
|
||||
|
|
||||
</div> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
import util from '@js/util.js'; |
|
||||
import ProjectDetail from "./projectDetail" |
|
||||
import { mapGetters } from 'vuex' |
|
||||
import { Loading } from 'element-ui' // 引入Loading服务 |
|
||||
import { requestPost } from '@/js/dai/request' |
|
||||
|
|
||||
let loading // 加载动画 |
|
||||
|
|
||||
export default { |
|
||||
data () { |
|
||||
return { |
|
||||
tableData: [], |
|
||||
|
|
||||
downloadLoading: false, |
|
||||
|
|
||||
//查询条件标题宽度 |
|
||||
labelWidth: '70px', |
|
||||
casOptions: [], |
|
||||
agencyIdArray: [], |
|
||||
|
|
||||
iscascaderShow: 0, |
|
||||
|
|
||||
optionProps: { |
|
||||
multiple: false, |
|
||||
value: 'agencyId', |
|
||||
label: 'agencyName', |
|
||||
children: 'subAgencyList', |
|
||||
checkStrictly: true |
|
||||
}, |
|
||||
|
|
||||
pickerOptions: { //控制时间范围 |
|
||||
disabledDate (time) { |
|
||||
return time.getTime() > (Date.now() - (24 * 60 * 60 * 1000)) |
|
||||
} |
|
||||
}, |
|
||||
staticType: 'end', |
|
||||
|
|
||||
|
|
||||
tableParams: { |
|
||||
staffId: '', //员工id |
|
||||
agencyId: '', //组织ID |
|
||||
pageSize: 20, |
|
||||
pageNo: 1, |
|
||||
startTime: '', //开始时间【yyyymmdd】 ,截止累计值 |
|
||||
endTime: '', //结束时间【yyyymmdd】, |
|
||||
}, |
|
||||
total: 0, |
|
||||
timeArray: ['', ''], |
|
||||
|
|
||||
agencyName: '', |
|
||||
startTimeShow: '',//导出表格标题处显示的内容 |
|
||||
endTimeShow: '', //导出表格标题处显示的内容 |
|
||||
endTimeModel: new Date() - 60 * 60 * 24 * 2, |
|
||||
|
|
||||
//弹出详情相关 |
|
||||
diaShow: false, |
|
||||
|
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
mounted () { |
|
||||
this.customerId = localStorage.getItem('customerId') |
|
||||
}, |
|
||||
|
|
||||
methods: { |
|
||||
//初始化日期 |
|
||||
loadDate (tableParams, staticType, timeArray, endTimeModel, startTimeShow, endTimeShow) { |
|
||||
//初始化日期 |
|
||||
this.initDate() |
|
||||
let params = JSON.parse(JSON.stringify(tableParams)) |
|
||||
Object.assign(this.tableParams, params) |
|
||||
this.timeArray = JSON.parse(JSON.stringify(timeArray)) |
|
||||
this.endTimeModel = JSON.parse(JSON.stringify(endTimeModel)) |
|
||||
this.startTimeShow = startTimeShow |
|
||||
this.endTimeShow = endTimeShow |
|
||||
this.staticType = staticType |
|
||||
|
|
||||
}, |
|
||||
async initTable (agencyIdArray, row, casOptions, agencyName) { |
|
||||
this.startLoading() |
|
||||
|
|
||||
//初始化组织数据 |
|
||||
this.initAgencyList(casOptions) |
|
||||
|
|
||||
this.tableParams.staffId = row.staffId |
|
||||
this.agencyIdArray = agencyIdArray |
|
||||
this.agencyName = agencyName |
|
||||
|
|
||||
|
|
||||
await this.loadTable()//获取组织级联列表 |
|
||||
|
|
||||
this.endLoading() |
|
||||
}, |
|
||||
|
|
||||
initAgencyList (casOptions) { |
|
||||
++this.iscascaderShow |
|
||||
this.casOptions = [] |
|
||||
this.agencyIdArray = [] |
|
||||
if (casOptions) { |
|
||||
this.casOptions = casOptions |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
async loadTable () { |
|
||||
if (this.validate()) { |
|
||||
// const url = '/gov/project/trace/pcwork/approvaled-list' |
|
||||
const url = 'http://yapi.elinkservice.cn/mock/102/gov/project/trace/pcwork/approvaled-list' |
|
||||
|
|
||||
if (this.staticType === 'end') { |
|
||||
this.tableParams.startTime = '' |
|
||||
} |
|
||||
const { data, code, msg } = await requestPost(url, this.tableParams) |
|
||||
if (code === 0) { |
|
||||
this.total = data.total |
|
||||
this.tableData = data.list |
|
||||
|
|
||||
|
|
||||
} else { |
|
||||
this.$message.error(msg) |
|
||||
} |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
//跳转到项目列表页面 |
|
||||
handleDetail (row) { |
|
||||
this.diaShow = true |
|
||||
this.$nextTick(() => { |
|
||||
this.$refs.ref_projectDetail.initData(row.projectId) |
|
||||
}) |
|
||||
}, |
|
||||
|
|
||||
//关闭详情 |
|
||||
diaClose () { |
|
||||
this.$refs.ref_projectDetail.setShowDetail() |
|
||||
this.diaShow = false |
|
||||
}, |
|
||||
|
|
||||
handleChange (value) { |
|
||||
if (value && value.length > 0) { |
|
||||
let agencyObj = this.$refs["myCascader"].getCheckedNodes()[0].data |
|
||||
this.tableParams.agencyId = agencyObj.agencyId |
|
||||
this.agencyName = agencyObj.agencyName |
|
||||
} else { |
|
||||
|
|
||||
this.tableParams.agencyId = '' |
|
||||
this.agencyName = '' |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
initDate () { |
|
||||
//设置默认结束日期为前一天 |
|
||||
const date = new Date() |
|
||||
const month = date.getMonth() + 1 > 9 ? (date.getMonth() + 1) : '0' + (date.getMonth() + 1) |
|
||||
const day = date.getDate() - 1 > 9 ? (date.getDate() - 1) : '0' + (date.getDate() - 1) |
|
||||
const yesterday = date.getFullYear() + '-' + month + '-' + day |
|
||||
this.timeArray = ['', yesterday] |
|
||||
this.endTimeModel = yesterday |
|
||||
|
|
||||
let yesterdayArray = yesterday.split('-') |
|
||||
this.tableParams.endTime = yesterdayArray[0] + yesterdayArray[1] + yesterdayArray[2] |
|
||||
this.endTimeShow = yesterdayArray[0] + '年' + yesterdayArray[1] + '月' + yesterdayArray[2] + '日' |
|
||||
}, |
|
||||
|
|
||||
|
|
||||
handleEndTimeChange (item) { |
|
||||
if (item) { |
|
||||
const endTimeArray = util.dateFormatter(item, 'date').split('-') |
|
||||
this.tableParams.endTime = endTimeArray[0] + endTimeArray[1] + endTimeArray[2] |
|
||||
this.endTime = endTimeArray[0] + '年' + endTimeArray[1] + '月' + endTimeArray[2] + '日' |
|
||||
} else { |
|
||||
this.tableParams.endTime = '' |
|
||||
this.endTimeShow = '' |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
handleTimeChange (time) { |
|
||||
if (time) { |
|
||||
const startTimeArray = util.dateFormatter(time[0], 'date').split('-') |
|
||||
const endTimeArray = util.dateFormatter(time[1], 'date').split('-') |
|
||||
|
|
||||
this.tableParams.startTime = startTimeArray[0] + startTimeArray[1] + startTimeArray[2] |
|
||||
this.tableParams.endTime = endTimeArray[0] + endTimeArray[1] + endTimeArray[2] |
|
||||
|
|
||||
this.startTimeShow = startTimeArray[0] + '年' + startTimeArray[1] + '月' + startTimeArray[2] + '日' |
|
||||
this.endTimeShow = endTimeArray[0] + '年' + endTimeArray[1] + '月' + endTimeArray[2] + '日' |
|
||||
} else { |
|
||||
this.tableParams.startTime = '' |
|
||||
this.tableParams.endTime = '' |
|
||||
this.startTimeShow = '' |
|
||||
this.endTimeShow = '' |
|
||||
} |
|
||||
|
|
||||
}, |
|
||||
|
|
||||
handleSizeChange (val) { |
|
||||
this.tableParams.pageSize = val |
|
||||
this.tableParams.pageNo = 1 |
|
||||
this.loadTable() |
|
||||
}, |
|
||||
handleCurrentChange (val) { |
|
||||
this.tableParams.pageNo = val |
|
||||
this.loadTable() |
|
||||
}, |
|
||||
handleBack () { |
|
||||
this.$emit('back') |
|
||||
}, |
|
||||
validate () { |
|
||||
if (this.staticType === 'Interval' && (!this.tableParams.endTime || !this.tableParams.startTime)) { |
|
||||
this.$message.info("请选择起止日期") |
|
||||
return false |
|
||||
} |
|
||||
if (this.staticType === 'end' && !this.tableParams.endTime) { |
|
||||
this.$message.info("请选择结束日期") |
|
||||
return false |
|
||||
} |
|
||||
|
|
||||
return true |
|
||||
}, |
|
||||
|
|
||||
//导出表格 |
|
||||
async loadOutTableData () { |
|
||||
if (!this.validate()) { |
|
||||
return false |
|
||||
} |
|
||||
let title = this.agencyName |
|
||||
|
|
||||
if (this.staticType === 'Interval') { |
|
||||
title = title + ' 项目 ' + this.startTimeShow + '-' + this.endTimeShow + '区间增长值' |
|
||||
} else { |
|
||||
title = title + ' 项目 截止至' + this.endTimeShow + '累计值' |
|
||||
} |
|
||||
console.log(title) |
|
||||
const params = { |
|
||||
staffId: this.tableParams.staffId, |
|
||||
agencyId: this.tableParams.agencyId, |
|
||||
startTime: this.tableParams.startTime, |
|
||||
endTime: this.tableParams.endTime, |
|
||||
orgName: this.agencyName |
|
||||
} |
|
||||
|
|
||||
const url = "/data/report/screen/project/selectcategoryprojectlist/export" |
|
||||
|
|
||||
app.ajax.exportFilePost( |
|
||||
url, |
|
||||
params, |
|
||||
(data, rspMsg) => { |
|
||||
|
|
||||
this.download(data, title + '.xls') |
|
||||
}, |
|
||||
(rspMsg, data) => { |
|
||||
this.$message.error(rspMsg); |
|
||||
} |
|
||||
); |
|
||||
|
|
||||
}, |
|
||||
|
|
||||
// 下载文件 |
|
||||
download (data, fileName) { |
|
||||
if (!data) { |
|
||||
return |
|
||||
} |
|
||||
|
|
||||
var csvData = new Blob([data]) |
|
||||
|
|
||||
if (window.navigator && window.navigator.msSaveOrOpenBlob) { |
|
||||
window.navigator.msSaveOrOpenBlob(csvData, fileName); |
|
||||
} |
|
||||
// for Non-IE (chrome, firefox etc.) |
|
||||
else { |
|
||||
var a = document.createElement('a'); |
|
||||
document.body.appendChild(a); |
|
||||
a.style = 'display: none'; |
|
||||
var url = window.URL.createObjectURL(csvData); |
|
||||
a.href = url; |
|
||||
a.download = fileName; |
|
||||
a.click(); |
|
||||
a.remove(); |
|
||||
window.URL.revokeObjectURL(url); |
|
||||
} |
|
||||
|
|
||||
}, |
|
||||
|
|
||||
// 开启加载动画 |
|
||||
startLoading () { |
|
||||
loading = Loading.service({ |
|
||||
lock: true, // 是否锁定 |
|
||||
text: '正在加载……', // 加载中需要显示的文字 |
|
||||
background: 'rgba(0,0,0,.7)' // 背景颜色 |
|
||||
}) |
|
||||
}, |
|
||||
// 结束加载动画 |
|
||||
endLoading () { |
|
||||
// clearTimeout(timer); |
|
||||
if (loading) { |
|
||||
loading.close() |
|
||||
} |
|
||||
} |
|
||||
}, |
|
||||
computed: { |
|
||||
tableHeight () { |
|
||||
return this.clientHeight - 60 - 80 - 80 - 100 |
|
||||
}, |
|
||||
|
|
||||
...mapGetters(['clientHeight', 'env']) |
|
||||
}, |
|
||||
components: { |
|
||||
ProjectDetail |
|
||||
}, |
|
||||
activated () { |
|
||||
this.$nextTick(() => { |
|
||||
this.$refs.ref_table.doLayout() // 解决表格错位 |
|
||||
}) |
|
||||
}, |
|
||||
} |
|
||||
</script> |
|
||||
<style lang="css" scoped> |
|
||||
.myNote { |
|
||||
display: -webkit-box; |
|
||||
text-overflow: ellipsis; |
|
||||
overflow: hidden; |
|
||||
-webkit-line-clamp: 3; |
|
||||
-webkit-box-orient: vertical; |
|
||||
} |
|
||||
/* .register .el-table .el-table__header-wrapper { |
|
||||
position: absolute; |
|
||||
top: 0; |
|
||||
left: 0; |
|
||||
}*/ |
|
||||
/* |
|
||||
.register .el-table .el-table__fixed-body-wrapper { |
|
||||
height: calc(100% - 44px); |
|
||||
margin-top: 44px; |
|
||||
overflow-y: auto !important; |
|
||||
} */ |
|
||||
</style> |
|
||||
|
|
||||
@ -1,505 +0,0 @@ |
|||||
<template> |
|
||||
<div> |
|
||||
<el-card shadow="never" |
|
||||
class="aui-card--fill"> |
|
||||
<div class="mod-demo__demo}"> |
|
||||
<el-form :inline="true" |
|
||||
:model="tableParams" |
|
||||
@keyup.enter.native="loadTable()"> |
|
||||
|
|
||||
<div> |
|
||||
<el-form-item style="margin-left:10px"> |
|
||||
<el-button @click="handleBack()" |
|
||||
size="mini" |
|
||||
icon="el-icon-back" |
|
||||
type="warning" |
|
||||
plain>返回</el-button> |
|
||||
</el-form-item> |
|
||||
|
|
||||
<el-form-item label="所属组织" |
|
||||
:label-width="labelWidth"> |
|
||||
<el-cascader ref="myCascader" |
|
||||
v-model="agencyIdArray" |
|
||||
style="width:480px" |
|
||||
:key="iscascaderShow" |
|
||||
:options="casOptions" |
|
||||
:props="optionProps" |
|
||||
@change="handleChange"></el-cascader> |
|
||||
</el-form-item> |
|
||||
|
|
||||
<div> |
|
||||
<el-form-item label="统计类型" |
|
||||
:label-width="labelWidth"> |
|
||||
<el-radio v-model="staticType" |
|
||||
label="end">截止累计值</el-radio> |
|
||||
<el-radio v-model="staticType" |
|
||||
label="Interval">区间新增值</el-radio> |
|
||||
|
|
||||
<el-date-picker style="margin-left:30px" |
|
||||
v-if="staticType==='Interval'" |
|
||||
v-model="timeArray" |
|
||||
type="daterange" |
|
||||
range-separator="至" |
|
||||
@change="handleTimeChange" |
|
||||
format="yyyy-MM-dd" |
|
||||
:picker-options="pickerOptions" |
|
||||
start-placeholder="开始日期" |
|
||||
end-placeholder="结束日期"> |
|
||||
</el-date-picker> |
|
||||
|
|
||||
<el-date-picker style="margin-left:30px" |
|
||||
v-if="staticType==='end'" |
|
||||
v-model="endTimeModel" |
|
||||
@change="handleEndTimeChange" |
|
||||
:picker-options="pickerOptions" |
|
||||
type="date" |
|
||||
placeholder="选择日期"> |
|
||||
</el-date-picker> |
|
||||
</el-form-item> |
|
||||
<el-form-item style="margin-left:10px"> |
|
||||
<el-button @click="loadTable()" |
|
||||
type="primary">查询</el-button> |
|
||||
</el-form-item> |
|
||||
<el-form-item style="margin-left:10px"> |
|
||||
<el-button @click="loadOutTableData()" |
|
||||
type="primary">导出</el-button> |
|
||||
</el-form-item> |
|
||||
</div> |
|
||||
|
|
||||
</div> |
|
||||
</el-form> |
|
||||
|
|
||||
<el-table :data="tableData" |
|
||||
border |
|
||||
style="width: 100%"> |
|
||||
<el-table-column prop="title" |
|
||||
label="事件名称" |
|
||||
align="center" |
|
||||
min-width="480"> |
|
||||
</el-table-column> |
|
||||
<el-table-column prop="workTypeName" |
|
||||
label="事件类别" |
|
||||
align="center" |
|
||||
min-width="200"> |
|
||||
</el-table-column> |
|
||||
<el-table-column prop="isNormalShow" |
|
||||
label="有无异常" |
|
||||
align="center" |
|
||||
min-width="80"> |
|
||||
</el-table-column> |
|
||||
<el-table-column prop="happenAddress" |
|
||||
label="发生地点" |
|
||||
align="center" |
|
||||
min-width="120"> |
|
||||
</el-table-column> |
|
||||
<el-table-column prop="happenTime" |
|
||||
label="发生日期" |
|
||||
align="center" |
|
||||
min-width="140px"> |
|
||||
</el-table-column> |
|
||||
<el-table-column prop="staffName" |
|
||||
label="网格员" |
|
||||
align="center" |
|
||||
min-width="80px"> |
|
||||
</el-table-column> |
|
||||
<el-table-column prop="gridName" |
|
||||
label="所属网格" |
|
||||
align="center" |
|
||||
min-width="190px"> |
|
||||
</el-table-column> |
|
||||
<el-table-column prop="createdTime" |
|
||||
label="提交日期" |
|
||||
align="center" |
|
||||
min-width="140px"> |
|
||||
</el-table-column> |
|
||||
|
|
||||
<el-table-column label="操作" |
|
||||
fixed="right" |
|
||||
width="140" |
|
||||
header-align="center" |
|
||||
align="center" |
|
||||
class="operate"> |
|
||||
<template slot-scope="scope"> |
|
||||
|
|
||||
<el-button type="text" |
|
||||
style="color:#D51010;" |
|
||||
size="small" |
|
||||
@click="handleDetail(scope.row)">查看详情</el-button> |
|
||||
|
|
||||
</template> |
|
||||
</el-table-column> |
|
||||
</el-table> |
|
||||
<div> |
|
||||
<el-pagination @size-change="handleSizeChange" |
|
||||
@current-change="handleCurrentChange" |
|
||||
:current-page.sync="tableParams.pageNo" |
|
||||
:page-sizes="[20, 30, 50]" |
|
||||
:page-size="tableParams.pageSize" |
|
||||
layout="sizes, prev, pager, next, total" |
|
||||
:total="total"> |
|
||||
</el-pagination> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
</el-card> |
|
||||
|
|
||||
<!-- 修改弹出框 --> |
|
||||
<el-dialog :visible.sync="diaShow" |
|
||||
:close-on-click-modal="false" |
|
||||
:close-on-press-escape="false" |
|
||||
:title="'例行工作详情'" |
|
||||
top="5vh" |
|
||||
width="50%" |
|
||||
@closed="diaClose"> |
|
||||
<work-Detail ref="ref_workDetail"> |
|
||||
|
|
||||
</work-Detail> |
|
||||
</el-dialog> |
|
||||
|
|
||||
</div> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
import util from '@js/util.js'; |
|
||||
import WorkDetail from "./workDetail" |
|
||||
import { mapGetters } from 'vuex' |
|
||||
import { Loading } from 'element-ui' // 引入Loading服务 |
|
||||
import { requestPost } from '@/js/dai/request' |
|
||||
|
|
||||
let loading // 加载动画 |
|
||||
|
|
||||
export default { |
|
||||
data () { |
|
||||
return { |
|
||||
tableData: [], |
|
||||
|
|
||||
downloadLoading: false, |
|
||||
|
|
||||
//查询条件标题宽度 |
|
||||
labelWidth: '70px', |
|
||||
casOptions: [], |
|
||||
agencyIdArray: [], |
|
||||
|
|
||||
iscascaderShow: 0, |
|
||||
|
|
||||
optionProps: { |
|
||||
multiple: false, |
|
||||
value: 'agencyId', |
|
||||
label: 'agencyName', |
|
||||
children: 'subAgencyList', |
|
||||
checkStrictly: true |
|
||||
}, |
|
||||
|
|
||||
pickerOptions: { //控制时间范围 |
|
||||
disabledDate (time) { |
|
||||
return time.getTime() > (Date.now() - (24 * 60 * 60 * 1000)) |
|
||||
} |
|
||||
}, |
|
||||
staticType: 'end', |
|
||||
|
|
||||
categoryName: '', |
|
||||
parentCategoryName: '', |
|
||||
tableParams: { |
|
||||
staffId: '', //人员id |
|
||||
agencyId: '', //组织ID |
|
||||
pageSize: 20, |
|
||||
pageNo: 1, |
|
||||
startTime: '', //开始时间【yyyymmdd】 ,截止累计值 |
|
||||
endTime: '', //结束时间【yyyymmdd】, |
|
||||
}, |
|
||||
total: 0, |
|
||||
timeArray: ['', ''], |
|
||||
|
|
||||
agencyName: '', |
|
||||
startTimeShow: '',//导出表格标题处显示的内容 |
|
||||
endTimeShow: '', //导出表格标题处显示的内容 |
|
||||
endTimeModel: new Date() - 60 * 60 * 24 * 2, |
|
||||
|
|
||||
//弹出详情相关 |
|
||||
diaShow: false, |
|
||||
|
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
mounted () { |
|
||||
|
|
||||
}, |
|
||||
|
|
||||
methods: { |
|
||||
//初始化日期 |
|
||||
loadDate (tableParams, staticType, timeArray, endTimeModel, startTimeShow, endTimeShow) { |
|
||||
//初始化日期 |
|
||||
this.initDate() |
|
||||
let params = JSON.parse(JSON.stringify(tableParams)) |
|
||||
Object.assign(this.tableParams, params) |
|
||||
this.timeArray = JSON.parse(JSON.stringify(timeArray)) |
|
||||
this.endTimeModel = JSON.parse(JSON.stringify(endTimeModel)) |
|
||||
this.startTimeShow = startTimeShow |
|
||||
this.endTimeShow = endTimeShow |
|
||||
this.staticType = staticType |
|
||||
|
|
||||
}, |
|
||||
async initTable (agencyIdArray, row, casOptions, agencyName) { |
|
||||
this.startLoading() |
|
||||
|
|
||||
//初始化组织数据 |
|
||||
this.initAgencyList(casOptions) |
|
||||
this.tableParams.staffId = row.staffId |
|
||||
this.agencyIdArray = agencyIdArray |
|
||||
this.agencyName = agencyName |
|
||||
|
|
||||
|
|
||||
await this.loadTable()//获取组织级联列表 |
|
||||
|
|
||||
this.endLoading() |
|
||||
}, |
|
||||
|
|
||||
initAgencyList (casOptions) { |
|
||||
++this.iscascaderShow |
|
||||
this.casOptions = [] |
|
||||
this.agencyIdArray = [] |
|
||||
if (casOptions) { |
|
||||
this.casOptions = casOptions |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
async loadTable () { |
|
||||
if (this.validate()) { |
|
||||
// const url = '/epmetuser/patrolroutinework/pcwork/list' |
|
||||
const url = 'http://yapi.elinkservice.cn/mock/102/epmetuser/patrolroutinework/pcwork/list' |
|
||||
|
|
||||
if (this.staticType === 'end') { |
|
||||
this.tableParams.startTime = '' |
|
||||
} |
|
||||
const { data, code, msg } = await requestPost(url, this.tableParams) |
|
||||
if (code === 0) { |
|
||||
this.total = data.total |
|
||||
this.tableData = data.list |
|
||||
this.tableData.forEach(element => { |
|
||||
if (element.isNormal) { |
|
||||
element.isNormalShow = '有' |
|
||||
} else { |
|
||||
element.isNormalShow = '无' |
|
||||
} |
|
||||
}); |
|
||||
|
|
||||
|
|
||||
} else { |
|
||||
this.$message.error(msg) |
|
||||
} |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
//跳转到项目列表页面 |
|
||||
handleDetail (row) { |
|
||||
this.diaShow = true |
|
||||
this.$nextTick(() => { |
|
||||
this.$refs.ref_workDetail.initData(row) |
|
||||
}) |
|
||||
}, |
|
||||
|
|
||||
//关闭详情 |
|
||||
diaClose () { |
|
||||
this.$refs.ref_workDetail.setShowDetail() |
|
||||
this.diaShow = false |
|
||||
}, |
|
||||
|
|
||||
handleChange (value) { |
|
||||
if (value && value.length > 0) { |
|
||||
let agencyObj = this.$refs["myCascader"].getCheckedNodes()[0].data |
|
||||
this.tableParams.agencyId = agencyObj.agencyId |
|
||||
this.agencyName = agencyObj.agencyName |
|
||||
} else { |
|
||||
|
|
||||
this.tableParams.agencyId = '' |
|
||||
this.agencyName = '' |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
initDate () { |
|
||||
//设置默认结束日期为前一天 |
|
||||
const date = new Date() |
|
||||
const month = date.getMonth() + 1 > 9 ? (date.getMonth() + 1) : '0' + (date.getMonth() + 1) |
|
||||
const day = date.getDate() - 1 > 9 ? (date.getDate() - 1) : '0' + (date.getDate() - 1) |
|
||||
const yesterday = date.getFullYear() + '-' + month + '-' + day |
|
||||
this.timeArray = ['', yesterday] |
|
||||
this.endTimeModel = yesterday |
|
||||
|
|
||||
let yesterdayArray = yesterday.split('-') |
|
||||
this.tableParams.endTime = yesterdayArray[0] + yesterdayArray[1] + yesterdayArray[2] |
|
||||
this.endTimeShow = yesterdayArray[0] + '年' + yesterdayArray[1] + '月' + yesterdayArray[2] + '日' |
|
||||
}, |
|
||||
|
|
||||
|
|
||||
handleEndTimeChange (item) { |
|
||||
if (item) { |
|
||||
const endTimeArray = util.dateFormatter(item, 'date').split('-') |
|
||||
this.tableParams.endTime = endTimeArray[0] + endTimeArray[1] + endTimeArray[2] |
|
||||
this.endTime = endTimeArray[0] + '年' + endTimeArray[1] + '月' + endTimeArray[2] + '日' |
|
||||
} else { |
|
||||
this.tableParams.endTime = '' |
|
||||
this.endTimeShow = '' |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
handleTimeChange (time) { |
|
||||
if (time) { |
|
||||
const startTimeArray = util.dateFormatter(time[0], 'date').split('-') |
|
||||
const endTimeArray = util.dateFormatter(time[1], 'date').split('-') |
|
||||
|
|
||||
this.tableParams.startTime = startTimeArray[0] + startTimeArray[1] + startTimeArray[2] |
|
||||
this.tableParams.endTime = endTimeArray[0] + endTimeArray[1] + endTimeArray[2] |
|
||||
|
|
||||
this.startTimeShow = startTimeArray[0] + '年' + startTimeArray[1] + '月' + startTimeArray[2] + '日' |
|
||||
this.endTimeShow = endTimeArray[0] + '年' + endTimeArray[1] + '月' + endTimeArray[2] + '日' |
|
||||
} else { |
|
||||
this.tableParams.startTime = '' |
|
||||
this.tableParams.endTime = '' |
|
||||
this.startTimeShow = '' |
|
||||
this.endTimeShow = '' |
|
||||
} |
|
||||
|
|
||||
}, |
|
||||
|
|
||||
handleSizeChange (val) { |
|
||||
this.tableParams.pageSize = val |
|
||||
this.tableParams.pageNo = 1 |
|
||||
this.loadTable() |
|
||||
}, |
|
||||
handleCurrentChange (val) { |
|
||||
this.tableParams.pageNo = val |
|
||||
this.loadTable() |
|
||||
}, |
|
||||
handleBack () { |
|
||||
this.$emit('back') |
|
||||
}, |
|
||||
validate () { |
|
||||
if (this.staticType === 'Interval' && (!this.tableParams.endTime || !this.tableParams.startTime)) { |
|
||||
this.$message.info("请选择起止日期") |
|
||||
return false |
|
||||
} |
|
||||
if (this.staticType === 'end' && !this.tableParams.endTime) { |
|
||||
this.$message.info("请选择结束日期") |
|
||||
return false |
|
||||
} |
|
||||
|
|
||||
return true |
|
||||
}, |
|
||||
|
|
||||
//导出表格 |
|
||||
async loadOutTableData () { |
|
||||
if (!this.validate()) { |
|
||||
return false |
|
||||
} |
|
||||
let title = this.agencyName |
|
||||
|
|
||||
if (this.staticType === 'Interval') { |
|
||||
title = title + ' 项目 ' + this.startTimeShow + '-' + this.endTimeShow + '区间增长值' |
|
||||
} else { |
|
||||
title = title + ' 项目 截止至' + this.endTimeShow + '累计值' |
|
||||
} |
|
||||
console.log(title) |
|
||||
const params = { |
|
||||
staffId: this.tableParams.staffId, |
|
||||
agencyId: this.tableParams.agencyId, |
|
||||
startTime: this.tableParams.startTime, |
|
||||
endTime: this.tableParams.endTime, |
|
||||
orgName: this.agencyName |
|
||||
} |
|
||||
|
|
||||
const url = "/data/report/screen/project/selectcategoryprojectlist/export" |
|
||||
|
|
||||
app.ajax.exportFilePost( |
|
||||
url, |
|
||||
params, |
|
||||
(data, rspMsg) => { |
|
||||
|
|
||||
this.download(data, title + '.xls') |
|
||||
}, |
|
||||
(rspMsg, data) => { |
|
||||
this.$message.error(rspMsg); |
|
||||
} |
|
||||
); |
|
||||
|
|
||||
}, |
|
||||
|
|
||||
// 下载文件 |
|
||||
download (data, fileName) { |
|
||||
if (!data) { |
|
||||
return |
|
||||
} |
|
||||
|
|
||||
var csvData = new Blob([data]) |
|
||||
|
|
||||
if (window.navigator && window.navigator.msSaveOrOpenBlob) { |
|
||||
window.navigator.msSaveOrOpenBlob(csvData, fileName); |
|
||||
} |
|
||||
// for Non-IE (chrome, firefox etc.) |
|
||||
else { |
|
||||
var a = document.createElement('a'); |
|
||||
document.body.appendChild(a); |
|
||||
a.style = 'display: none'; |
|
||||
var url = window.URL.createObjectURL(csvData); |
|
||||
a.href = url; |
|
||||
a.download = fileName; |
|
||||
a.click(); |
|
||||
a.remove(); |
|
||||
window.URL.revokeObjectURL(url); |
|
||||
} |
|
||||
|
|
||||
}, |
|
||||
|
|
||||
// 开启加载动画 |
|
||||
startLoading () { |
|
||||
loading = Loading.service({ |
|
||||
lock: true, // 是否锁定 |
|
||||
text: '正在加载……', // 加载中需要显示的文字 |
|
||||
background: 'rgba(0,0,0,.7)' // 背景颜色 |
|
||||
}) |
|
||||
}, |
|
||||
// 结束加载动画 |
|
||||
endLoading () { |
|
||||
// clearTimeout(timer); |
|
||||
if (loading) { |
|
||||
loading.close() |
|
||||
} |
|
||||
} |
|
||||
}, |
|
||||
computed: { |
|
||||
tableHeight () { |
|
||||
return this.clientHeight - 60 - 80 - 80 - 100 |
|
||||
}, |
|
||||
|
|
||||
...mapGetters(['clientHeight']) |
|
||||
}, |
|
||||
components: { |
|
||||
WorkDetail |
|
||||
}, |
|
||||
activated () { |
|
||||
this.$nextTick(() => { |
|
||||
this.$refs.ref_table.doLayout() // 解决表格错位 |
|
||||
}) |
|
||||
}, |
|
||||
} |
|
||||
</script> |
|
||||
<style lang="css" scoped> |
|
||||
.myNote { |
|
||||
display: -webkit-box; |
|
||||
text-overflow: ellipsis; |
|
||||
overflow: hidden; |
|
||||
-webkit-line-clamp: 3; |
|
||||
-webkit-box-orient: vertical; |
|
||||
} |
|
||||
/* .register .el-table .el-table__header-wrapper { |
|
||||
position: absolute; |
|
||||
top: 0; |
|
||||
left: 0; |
|
||||
}*/ |
|
||||
/* |
|
||||
.register .el-table .el-table__fixed-body-wrapper { |
|
||||
height: calc(100% - 44px); |
|
||||
margin-top: 44px; |
|
||||
overflow-y: auto !important; |
|
||||
} */ |
|
||||
</style> |
|
||||
|
|
||||
Loading…
Reference in new issue