|
|
|
@@ -0,0 +1,428 @@ |
|
|
|
<template> |
|
|
|
<div class="problem-stay"> |
|
|
|
<el-form :inline="true" :model="searchParam" class="demo-form-inline"> |
|
|
|
<el-form-item label="问题单号"> |
|
|
|
<el-input |
|
|
|
clearable |
|
|
|
v-model="searchParam.questionNo" |
|
|
|
size="small" |
|
|
|
placeholder="请输入问题单号" |
|
|
|
style="width: 150px" |
|
|
|
/> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="区划"> |
|
|
|
<driverAreaSelect v-model="searchParam.driverArea"></driverAreaSelect> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="河湖名称"> |
|
|
|
<el-input |
|
|
|
clearable |
|
|
|
v-model="searchParam.driverName" |
|
|
|
size="small" |
|
|
|
placeholder="请输入河道名称" |
|
|
|
style="width: 150px" |
|
|
|
/> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="日期"> |
|
|
|
<el-date-picker |
|
|
|
style="width: 220px" |
|
|
|
placeholder="日期" |
|
|
|
clearable |
|
|
|
size="small" |
|
|
|
value-format="yyyy-MM-dd" |
|
|
|
v-model="searchParam.inspectTime" |
|
|
|
type="daterange" |
|
|
|
range-separator="至" |
|
|
|
start-placeholder="开始日期" |
|
|
|
end-placeholder="结束日期" |
|
|
|
></el-date-picker> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item> |
|
|
|
<el-button |
|
|
|
:loading="tableLoading" |
|
|
|
@click="search" |
|
|
|
size="small" |
|
|
|
icon="el-icon-search" |
|
|
|
type="primary" |
|
|
|
>搜索 |
|
|
|
</el-button> |
|
|
|
<el-button |
|
|
|
@click="initSearchParam();search()" |
|
|
|
icon="el-icon-refresh-right" |
|
|
|
type="primary" |
|
|
|
size="small" |
|
|
|
style="background-color: #fff; border: 1px solid #ccc ; color: #666" |
|
|
|
>清空 |
|
|
|
</el-button> |
|
|
|
</el-form-item> |
|
|
|
</el-form> |
|
|
|
<div> |
|
|
|
<el-button @click="signList" v-if="btnRule.inspectquestion_finished" |
|
|
|
:disabled="multipleSelection.length>0?false:true" size="small" type="success">批量标记完成 |
|
|
|
</el-button> |
|
|
|
</div> |
|
|
|
<el-table |
|
|
|
style="margin-top: 15px" |
|
|
|
stripe |
|
|
|
@selection-change="handleSelectionChange" |
|
|
|
ref="table" |
|
|
|
:height="tableHeight" |
|
|
|
v-loading="tableLoading" |
|
|
|
:data="dataList" |
|
|
|
size="medium" |
|
|
|
border |
|
|
|
> |
|
|
|
<el-table-column |
|
|
|
:selectable="filterSelectable" |
|
|
|
type="selection" |
|
|
|
width="55"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column :index="indexMethod" label="序号" type="index" width="80" align="center"/> |
|
|
|
<el-table-column |
|
|
|
show-overflow-tooltip |
|
|
|
prop="source" |
|
|
|
label="问题来源" |
|
|
|
align="center" |
|
|
|
min-width="100" |
|
|
|
/> |
|
|
|
<el-table-column |
|
|
|
show-overflow-tooltip |
|
|
|
prop="name" |
|
|
|
label="问题单号" |
|
|
|
align="center" |
|
|
|
min-width="120" |
|
|
|
> |
|
|
|
<template slot-scope="scoped"> |
|
|
|
<a |
|
|
|
v-if="btnRule.inspectquestion_detail" |
|
|
|
href="javascript:void(0);" |
|
|
|
@click="handleEdit(scoped.row,1)" |
|
|
|
>{{scoped.row.questionNo}}</a> |
|
|
|
<span v-else>{{scoped.row.questionNo}}</span> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column show-overflow-tooltip label="问题图片" align="center" min-width="80"> |
|
|
|
<template slot-scope="{row}"> |
|
|
|
<img style="width:20px;height:20px" :src="row.fileSrc"/> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
show-overflow-tooltip |
|
|
|
prop="driverAreaName" |
|
|
|
label="区划" |
|
|
|
align="center" |
|
|
|
min-width="80" |
|
|
|
/> |
|
|
|
<el-table-column |
|
|
|
show-overflow-tooltip |
|
|
|
prop="driverName" |
|
|
|
label="河湖名称" |
|
|
|
align="center" |
|
|
|
min-width="100" |
|
|
|
></el-table-column> |
|
|
|
<el-table-column |
|
|
|
show-overflow-tooltip |
|
|
|
prop="inspectTime" |
|
|
|
label="巡检时间" |
|
|
|
min-width="120" |
|
|
|
align="center" |
|
|
|
> |
|
|
|
<template slot-scope="{row}"> |
|
|
|
<span v-if="row.inspectTime">{{row.inspectTime.split(' ')[0]}}</span> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column show-overflow-tooltip prop="questionType" label="问题类型" align="center"/> |
|
|
|
<el-table-column show-overflow-tooltip prop="statusName" label="问题状态" align="center"/> |
|
|
|
<el-table-column show-overflow-tooltip prop="assignUserName" min-width="100" label="处理人" align="center"/> |
|
|
|
<el-table-column label="操作" align="left" width="180"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<el-button v-if="btnRule.inspectquestion_dealWith&&scope.row.assignUser==info.id" |
|
|
|
type="primary" size="mini" |
|
|
|
icon="el-icon-monitor" @click="handle(scope.row)">处理 |
|
|
|
</el-button> |
|
|
|
<el-button v-if="btnRule.inspectquestion_finished" type="success" |
|
|
|
size="mini" icon="el-icon-finished" @click="sign(scope.row)">标记完成 |
|
|
|
</el-button> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
</el-table> |
|
|
|
<!-- 分页 --> |
|
|
|
<div class="page-current"> |
|
|
|
<el-pagination |
|
|
|
background |
|
|
|
:current-page="currentPage" |
|
|
|
:page-size="pageSize" |
|
|
|
prev-text="上一页" |
|
|
|
next-text="下一页" |
|
|
|
layout="total, prev, pager, next, jumper" |
|
|
|
style="display: inline-block;" |
|
|
|
@current-change="handleCurrentChange" |
|
|
|
:total="count" |
|
|
|
/> |
|
|
|
</div> |
|
|
|
<el-drawer |
|
|
|
class="detail-diaog" |
|
|
|
title="问题详情" |
|
|
|
:visible.sync="visible" |
|
|
|
:direction="direction" |
|
|
|
:size="drawerWidth" |
|
|
|
:before-close="beforeClose" |
|
|
|
> |
|
|
|
<detailDialog @handleClose="visible=false" :visible="visible" v-if="visible" :id="id"></detailDialog> |
|
|
|
<div style="width: 100%;text-align: center;margin-top: 20px;margin-bottom: 20px"> |
|
|
|
<el-button size="medium" icon="el-icon-back" @click="visible=false">返回</el-button> |
|
|
|
</div> |
|
|
|
</el-drawer> |
|
|
|
<el-dialog v-if="signVisible" :close-on-press-escape="false" :close-on-click-modal="false" ref="signDialog" |
|
|
|
top="5vh" center title="标记完成" |
|
|
|
class="sign-dialog" :visible.sync="signVisible"> |
|
|
|
<el-form ref="ruleForm" :model="ruleForm" size="small" label-width="100px" |
|
|
|
class="form"> |
|
|
|
<div style="display: flex;align-items: center;margin-left: 100px;margin-bottom: 30px;font-size: 20px"> |
|
|
|
<i style="font-size:28px;margin-right:10px;color: #FFAA15" class="el-icon-warning-outline"></i>确定手动标记完成？ |
|
|
|
</div> |
|
|
|
<el-form-item label="备注" prop="note"> |
|
|
|
<el-input |
|
|
|
rows="4" |
|
|
|
type="textarea" |
|
|
|
placeholder="备注" |
|
|
|
v-model="ruleForm.note" |
|
|
|
maxlength="99" |
|
|
|
show-word-limit |
|
|
|
> |
|
|
|
</el-input> |
|
|
|
</el-form-item> |
|
|
|
</el-form> |
|
|
|
<span slot="footer" class="dialog-footer no-print"> |
|
|
|
<el-button :loading="submitLoading" @click="signSubmit('ruleForm')" type="primary" size="medium" |
|
|
|
icon="el-icon-printer">提交</el-button> |
|
|
|
<el-button size="medium" icon="el-icon-back" |
|
|
|
@click="signVisible = false">返回 |
|
|
|
</el-button> |
|
|
|
</span> |
|
|
|
</el-dialog> |
|
|
|
<el-dialog v-if="handleVisible" :close-on-press-escape="false" :close-on-click-modal="false" ref="handleDialog" |
|
|
|
top="5vh" center title="问题处理" |
|
|
|
class="handle-dialog" :visible.sync="handleVisible"> |
|
|
|
<el-form ref="ruleForm" :model="ruleForm" size="small" label-width="120px" |
|
|
|
class="form"> |
|
|
|
<el-form-item label="上传处理后图片" prop="handlerImage"> |
|
|
|
<uploadImage v-model="ruleForm.handlerImage"></uploadImage> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="处理情况" prop="handlerResult"> |
|
|
|
<el-input |
|
|
|
rows="4" |
|
|
|
type="textarea" |
|
|
|
placeholder="备注" |
|
|
|
v-model="ruleForm.handlerResult" |
|
|
|
maxlength="99" |
|
|
|
show-word-limit |
|
|
|
> |
|
|
|
</el-input> |
|
|
|
</el-form-item> |
|
|
|
</el-form> |
|
|
|
<span slot="footer" class="dialog-footer no-print"> |
|
|
|
<el-button :loading="submitLoading" @click="handleSubmit('ruleForm')" type="primary" size="medium" |
|
|
|
icon="el-icon-printer">提交</el-button> |
|
|
|
<el-button size="medium" icon="el-icon-back" |
|
|
|
@click="handleVisible = false">返回 |
|
|
|
</el-button> |
|
|
|
</span> |
|
|
|
</el-dialog> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
import api from "@/api/question/list"; |
|
|
|
import driverAreaSelect from "@/components/driverAreaSelect"; |
|
|
|
import detailDialog from "./detailDialog"; |
|
|
|
import {mapGetters} from "vuex"; |
|
|
|
import uploadImage from '@/components/uploadImage' |
|
|
|
|
|
|
|
export default { |
|
|
|
name: "problem-stay", |
|
|
|
data() { |
|
|
|
return { |
|
|
|
handleVisible: false, |
|
|
|
signVisible: false, |
|
|
|
submitLoading: false, |
|
|
|
drawerWidth: document.body.clientWidth - 190 + "px", |
|
|
|
direction: "rtl", |
|
|
|
id: "", |
|
|
|
visible: false, |
|
|
|
searchParam: { |
|
|
|
questionNo: "", |
|
|
|
driverName: "", |
|
|
|
inspectTime: "", |
|
|
|
driverArea: "" |
|
|
|
}, |
|
|
|
ruleForm: {}, |
|
|
|
dataList: [], |
|
|
|
currentPage: 1, |
|
|
|
pageSize: parseInt((document.body.clientHeight - 295 - 43) / 47), |
|
|
|
count: 0, |
|
|
|
tableLoading: false, |
|
|
|
tableHeight: document.body.clientHeight - 295, |
|
|
|
multipleSelection: [], |
|
|
|
userList: [], |
|
|
|
ids: '' |
|
|
|
}; |
|
|
|
}, |
|
|
|
components: {driverAreaSelect, detailDialog, uploadImage}, |
|
|
|
computed: { |
|
|
|
...mapGetters(["btnRule", "info"]) |
|
|
|
}, |
|
|
|
mounted() { |
|
|
|
this.tableLoading = true; |
|
|
|
let me = this; |
|
|
|
me.getAllList(); |
|
|
|
}, |
|
|
|
watch: {}, |
|
|
|
methods: { |
|
|
|
handle(row) { |
|
|
|
this.ruleForm = { |
|
|
|
id: row.id + '', |
|
|
|
handlerImage: [], |
|
|
|
handlerResult: '' |
|
|
|
} |
|
|
|
this.handleVisible = true |
|
|
|
}, |
|
|
|
handleSubmit(formName) { |
|
|
|
this.$refs[formName].validate((valid) => { |
|
|
|
if (valid) { |
|
|
|
this.submitLoading = true |
|
|
|
api.dealWith(this.ruleForm).then(res => { |
|
|
|
this.$message({ |
|
|
|
type: 'success', |
|
|
|
message: '处理成功！' |
|
|
|
}) |
|
|
|
this.submitLoading = false |
|
|
|
this.handleVisible = false |
|
|
|
this.getAllList() |
|
|
|
}).catch(err => { |
|
|
|
this.submitLoading = false |
|
|
|
}); |
|
|
|
} |
|
|
|
}) |
|
|
|
}, |
|
|
|
signSubmit(formName) { |
|
|
|
this.$refs[formName].validate((valid) => { |
|
|
|
if (valid) { |
|
|
|
this.submitLoading = true |
|
|
|
api.finished(this.ruleForm).then(res => { |
|
|
|
this.$message({ |
|
|
|
type: 'success', |
|
|
|
message: '标记完成成功！' |
|
|
|
}) |
|
|
|
this.submitLoading = false |
|
|
|
this.signVisible = false |
|
|
|
this.getAllList() |
|
|
|
}).catch(err => { |
|
|
|
this.submitLoading = false |
|
|
|
}); |
|
|
|
} |
|
|
|
}) |
|
|
|
}, |
|
|
|
signList() { |
|
|
|
let ids = [] |
|
|
|
this.multipleSelection.map(item => { |
|
|
|
ids.push(item.id) |
|
|
|
}) |
|
|
|
this.ruleForm = { |
|
|
|
id: ids.join(','), |
|
|
|
note: '', |
|
|
|
} |
|
|
|
this.signVisible = true |
|
|
|
}, |
|
|
|
sign(row) { |
|
|
|
this.ruleForm = { |
|
|
|
id: row.id + '', |
|
|
|
note: '' |
|
|
|
} |
|
|
|
this.signVisible = true |
|
|
|
}, |
|
|
|
handleSelectionChange(val) { |
|
|
|
this.multipleSelection = val; |
|
|
|
}, |
|
|
|
filterSelectable(row, index) { |
|
|
|
return true |
|
|
|
}, |
|
|
|
beforeClose() { |
|
|
|
this.visible = false |
|
|
|
}, |
|
|
|
handleEdit(row) { |
|
|
|
this.id = row.id; |
|
|
|
this.visible = true; |
|
|
|
}, |
|
|
|
indexMethod(index) { |
|
|
|
return index + 1 + (this.currentPage - 1) * this.pageSize; |
|
|
|
}, |
|
|
|
getAllList() { |
|
|
|
let searchParam = JSON.parse(JSON.stringify(this.searchParam)); |
|
|
|
searchParam.page = this.currentPage; |
|
|
|
searchParam.pageSize = this.pageSize; |
|
|
|
if (searchParam.inspectTime && searchParam.inspectTime.length > 0) { |
|
|
|
searchParam.inspectTime = searchParam.inspectTime[0] + '~' + searchParam.inspectTime[1]; |
|
|
|
} else { |
|
|
|
searchParam.inspectTime = '' |
|
|
|
} |
|
|
|
this.$refs.table.clearSelection(); |
|
|
|
this.multipleSelection = [] |
|
|
|
this.tableLoading = true |
|
|
|
api.getStayList(searchParam).then(res => { |
|
|
|
this.count = res.data.total; |
|
|
|
this.dataList = res.data.records; |
|
|
|
this.tableLoading = false; |
|
|
|
}).catch(err => { |
|
|
|
this.dataList = []; |
|
|
|
this.tableLoading = false; |
|
|
|
}); |
|
|
|
}, |
|
|
|
search() { |
|
|
|
this.currentPage = 1; |
|
|
|
this.tableLoading = true; |
|
|
|
this.$refs.table.bodyWrapper.scrollTop = 0; |
|
|
|
this.getAllList(); |
|
|
|
}, |
|
|
|
handleCurrentChange(val) { |
|
|
|
this.currentPage = val; |
|
|
|
this.tableLoading = true; |
|
|
|
this.$refs.table.bodyWrapper.scrollTop = 0; |
|
|
|
this.getAllList(); |
|
|
|
}, |
|
|
|
initSearchParam() { |
|
|
|
this.searchParam = { |
|
|
|
questionNo: "", |
|
|
|
driverName: "", |
|
|
|
inspectTime: "", |
|
|
|
driverArea: "" |
|
|
|
}; |
|
|
|
} |
|
|
|
} |
|
|
|
}; |
|
|
|
</script> |
|
|
|
|
|
|
|
<style lang="less"> |
|
|
|
.problem-stay { |
|
|
|
height: fit-content; |
|
|
|
background-color: #fff; |
|
|
|
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .12), 0 0 6px 0 rgba(0, 0, 0, .04); |
|
|
|
padding: 15px; |
|
|
|
|
|
|
|
.el-input.is-disabled .el-input__inner { |
|
|
|
background-color: #fff !important; |
|
|
|
color: #333 !important; |
|
|
|
} |
|
|
|
|
|
|
|
.sign-dialog { |
|
|
|
.el-dialog { |
|
|
|
width: 500px !important; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.handle-dialog { |
|
|
|
.el-dialog { |
|
|
|
width: 60% !important; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
</style> |
huxinglu
4 years ago