You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

573 lines
20 KiB

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<div class="container">
<div style="padding: 0px 20px">
<div ref="lxHeader">
<LxHeader icon="md-apps" text="线索处办" style="margin-bottom: 10px; border: 0px; margin-top: 15px">
<div slot="content"></div>
<slot>
<div>
<Input style="width: 200px; margin-right: 10px" v-model="searchFields.KeyWord" placeholder="关键字搜索" />
<Button type="primary" @click="load" style="margin-left: 10px">查询</Button>
<!-- <Button type="primary" @click="edit()" style="margin-left: 10px">新增</Button> -->
</div>
</slot>
</LxHeader>
</div>
<div ref="lxTable">
<el-table :data="tableData" :height="tableHeight" style="width: 100%">
<el-table-column type="index" width="50" label="序号" align="center"> </el-table-column>
<el-table-column :prop="column.field" :align="column.align" v-for="(column,index) in columns"
:label="column.title" :width="column.width">
<template slot-scope="scope">
<div v-if="column.type=='opt'">
<Button ghost size="small" @click="edit(scope.row)" type="primary"
style="margin-left: 10px;">编辑</Button>
<Button ghost size="small" @click="del(scope.row)" type="error" style="margin-left: 10px;">删除</Button>
</div>
<div v-else>{{scope.row[column.field]}}</div>
</template>
</el-table-column>
</el-table>
<div class="pagination">
<el-pagination @current-change="handleCurrentChange" :current-page="paginations.page"
:page-size="paginations.page_size" background layout="prev, pager, next" :total="paginations.total">
</el-pagination>
</div>
</div>
<el-dialog title="线索编辑" :visible.sync="dialogFormVisible" width="60%">
<div class="dialogConcent">
<el-scrollbar style="flex: 1">
<el-form :model="form" :rules="rules" ref="form" label-position="right" :label-width="formLabelWidth">
<el-row>
<el-col :span="24">
<el-form-item label="线索来源" prop="type">
<el-select style="width:100%" v-model="form.type" placeholder="">
<el-option
v-for="item in selects.fromList"
:key="item.id"
:label="item.value"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="巡查日期" prop="accept_date">
<el-date-picker
style="width:100%"
v-model="form.accept_date"
type="date"
placeholder="选择日期"
value-format="yyyy-MM-dd"
>
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="巡查片区" prop="area_id">
<el-select style="width:100%" v-model="form.area_id" placeholder="请选择巡查片区">
<el-option
v-for="item in selects.areaList"
:key="item.id"
:label="item.name"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="巡查记录" prop="remark">
<el-input type="textarea" v-model="form.remark" placeholder="请填写巡查记录" autocomplete="off"></el-input>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="现场照片" prop="remark">
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="定位" prop="remark">
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="初审" prop="jurisdictionStatus">
<!-- <el-radio v-model="jurisdictionStatus" :label="0">未确认</el-radio> -->
<el-radio v-model="jurisdictionStatus" :label="1">非管辖</el-radio>
<el-radio v-model="jurisdictionStatus" :label="2">管辖</el-radio>
<el-select v-if="jurisdictionStatus==2" v-model="form.jurisdiction_question" placeholder="请选择">
<el-option key="2" label="无问题" :value="2"></el-option>
<el-option key="3" label="需整改" :value="3"></el-option>
</el-select>
</el-form-item>
</el-col>
<div v-if="form.jurisdiction_question==2">
<el-col :span="24">
<el-form-item label="审核记录" prop="approve_content">
<el-input type="textarea" v-model="form.approve_content" placeholder="请填写审核记录" autocomplete="off"></el-input>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="判断依据" prop="files_list">
<el-upload class="upload-demo" :on-success="handlesuccess" :data="uploadOther"
action="/api/admin/upload-file" :on-remove="handleRemove" :before-remove="beforeRemove"
:on-exceed="handleExceed" :file-list="filesList">
<el-button size="small" type="primary">点击上传</el-button>
</el-upload>
</el-form-item>
</el-col>
</div>
<div v-if="form.jurisdiction_question==3">
<el-col :span="24">
<el-form-item label="问题类型" prop="question_type">
<el-select style="width:100%" v-model="form.question_type" placeholder="">
<el-option
v-for="item in selects.questionList"
:key="item.id"
:label="item.value"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="责任单位" prop="responsible_unit">
<el-select style="width:100%" v-model="form.responsible_unit" placeholder="">
<el-option
v-for="item in selects.responsibleList"
:key="item.id"
:label="item.value"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="整改记录" prop="rectify_content">
<el-input type="textarea" v-model="form.rectify_content" placeholder="请填写整改记录" autocomplete="off"></el-input>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="完工照片" prop="files_list">
<el-upload action="/api/admin/upload-file" list-type="picture-card" :file-list="filesList" ref="pictureUpload"
:auto-upload="true" :data="uploadOther"
:on-success="handlesuccess">
<i slot="default" class="el-icon-plus"></i>
<div slot="file" slot-scope="{file}">
<img class="el-upload-list__item-thumbnail" :src="file.url" alt="">
<span class="el-upload-list__item-actions">
<span class="el-upload-list__item-preview" @click="handlePictureCardPreview(file)">
<i class="el-icon-zoom-in"></i>
</span>
<span v-if="!disabled" class="el-upload-list__item-delete" @click="handleRemove(file)">
<i class="el-icon-delete"></i>
</span>
</span>
</div>
</el-upload>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="复核" prop="again_approve">
<el-radio v-model="form.again_approve" :label="0">等待审核</el-radio>
<el-radio v-model="form.again_approve" :label="1">通过</el-radio>
<el-radio v-model="form.again_approve" :label="2">不通过</el-radio>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="分管领导确认" prop="sure_approve">
<el-radio v-model="form.sure_approve" :label="0">等待审核</el-radio>
<el-radio v-model="form.sure_approve" :label="1">通过</el-radio>
<el-radio v-model="form.sure_approve" :label="2"></el-radio>
</el-form-item>
</el-col>
</div>
</el-row>
</el-form>
</el-scrollbar>
</div>
<div slot="footer" class="dialog-footer">
<el-button @click="resetForm('form')"> </el-button>
<el-button type="primary" v-if="jurisdictionStatus==1" v-preventReClick @click="submitForm('form')">退回</el-button>
<el-button type="primary" v-if="jurisdictionStatus==2" v-preventReClick @click="submitForm('form')">办结</el-button>
</div>
</el-dialog>
<el-dialog :visible.sync="dialogVisible">
<img width="100%" :src="dialogImageUrl" alt="">
</el-dialog>
</div>
</div>
</template>
<script>
import {
getToken
} from '@/utils/auth'
import {
listclue,
get,
save,
del
} from '../../api/assess/clue.js'
import {
listarea
} from '../../api/basic/area.js'
import { getparameteritem } from '../../api/system/dictionary.js'
import LxHeader from "@/components/LxHeader/index.vue";
export default {
components: {
LxHeader
},
data() {
return {
tableHeight: 0,
dialogFormVisible: false,
dialogImageUrl:"",
dialogVisible: false,
formLabelWidth: "120px",
tableData: [],
tableHeight: 0,
searchFields: {
KeyWord: ""
},
paginations: {
page: 1,
page_size: 15,
total: 0
},
selects:{
areaList:[],
questionList:[],
fromList:[{
id:1,
value:"通用巡查"
},{
id:2,
value:"工单"
},{
id:3,
value:"日常巡查"
},{
id:4,
value:"其他线索"
}],
jurisdictionList:[{
id:0,
value:"未确认"
},{
id:1,
value:"非管辖"
},{
id:2,
value:"管辖无问题"
},{
id:3,
value:"管辖有问题"
}],
responsibleList:[{
id:1,
value:"雨管科"
},{
id:2,
value:"供排水处"
},{
id:3,
value:"无责任主体(雨管科)"
},{
id:4,
value:"建设单位"
}]
},
jurisdictionStatus:1,
form: {
type:"",
jurisdiction_question:"",
approve_content:"",
question_type:"",
responsible_unit:"",
rectify_content:"",
again_approve:0,
files_list:"",
sure_approve:1
},
filesList:[],
disabled:false,
uploadOther:{
token:""
},
rules: {
name:[{
required: true,
message: '请填写名称',
trigger: 'blur',
}]
},
columns: [{
field: "typeName",
title: "来源",
type: "string",
align: "left"
},{
field: "jurisdictionName",
title: "是否管辖",
type: "string",
align: "center"
},
{
field: "created_at",
title: "提交时间",
type: "string",
align: "center"
},
{
field: "操作",
title: "操作",
width: 220,
type: "opt",
}
],
}
},
created() {
this.uploadOther.token = getToken();
this.initLoad();
this.load();
},
watch:{
jurisdictionStatus(val){
if(val==2){
this.form.jurisdiction_question = 2
}
}
},
methods: {
initLoad() {
var that = this;
var clientHeight = document.documentElement.clientHeight
var lxHeader_height = 96.5; //查询 头部
var paginationHeight = 37; //分页的高度
var topHeight = 50; //页面 头部
let tableHeight = clientHeight - lxHeader_height - topHeight - paginationHeight - 20;
that.tableHeight = tableHeight;
listarea({
page: 1,
page_size: 999,
}).then(response => {
that.selects.areaList = response.data;
}).catch(error => {
console.log(error)
reject(error)
});
getparameteritem('question-type').then(res => {
that.selects.questionList = res.detail
})
},
handleCurrentChange(page) {
this.paginations.page = page;
this.load();
},
load() {
listclue({
page: this.paginations.page,
page_size: this.paginations.page_size,
keyword: this.searchFields.KeyWord
}).then(response => {
for(var m of response.data){
for(var k of this.selects.fromList){
if(m.type==k.id){
m.typeName = k.value
}
}
for(var l of this.selects.jurisdictionList){
if(m.type==l.id){
m.jurisdictionName = l.value
}
}
}
this.tableData = response.data;
this.paginations.total = response.total;
}).catch(error => {
console.log(error)
reject(error)
});
},
show(obj) {
// this.clientHeight = document.documentElement.clientHeight - 84 - 110;
this.dialogViewVisible = false;
this.info(obj);
},
info(obj) {
var that = this;
get(obj.id).then(res => {
let result = Object.assign(that.form, res);
// this.$set(that.form,res);
that.form = result;
that.jurisdictionStatus = result.jurisdiction_question
if(result.jurisdiction_question==0){
that.jurisdictionStatus = 1
}else if(result.jurisdiction_question==3){
that.jurisdictionStatus = 2
}
let _files = [];
for (var mod of result.clue_files) {
let m = Object.assign({}, mod);
m.url = mod.files.url;
m.id = mod.files.id;
_files.push(m);
}
that.filesList = _files;
}).catch(error => {
//reject(error)
})
},
edit(obj) {
this.form = this.$options.data().form
if (obj) {
var that = this;
that.info(obj);
}else{
}
this.dialogFormVisible = true;
},
del(obj) {
var that = this;
if (obj) {
this.$Modal.confirm({
title: '确认要删除数据?',
onOk: () => {
del(obj.id).then(response => {
this.$Message.success('操作成功');
that.load();
}).catch(error => {
console.log(error)
reject(error)
})
},
onCancel: () => {
//this.$Message.info('Clicked cancel');
}
});
}
},
submitForm(formName) {
var that = this;
if(this.jurisdictionStatus==1){
that.form.jurisdiction_question = this.jurisdictionStatus;
}
var listUrlbefore=[]
for (var m of this.filesList) {
if (m.response)
listUrlbefore.push({
"upload_id": m.response.id
});
else
listUrlbefore.push({
"upload_id": m.id
});
}
this.form.files_list = listUrlbefore;
// console.log(that.form);
// return;
this.$refs[formName].validate((valid) => {
if (valid) {
if (that.form.id) {
save(that.form).then(response => {
this.$Message.success('操作成功');
that.load();
that.dialogFormVisible = false;
}).catch(error => {
//reject(error)
})
} else {
store(that.form).then(response => {
this.$Message.success('操作成功');
that.load();
that.dialogFormVisible = false;
}).catch(error => {
//reject(error)
})
}
} else {
this.$Message.error('数据校验失败');
console.log('error submit!!');
return false;
}
});
},
resetForm(formName) {
var that = this;
that.dealFilesList = [];
that.filesList = [];
this.$refs[formName].resetFields();
that.dialogFormVisible = false;
},
handleRemove(file, fileList) {
console.log(fileList);
for (var i = 0; i < this.filesList.length; i++) {
if (this.filesList[i].url == file.url) {
this.filesList.splice(i, 1)
}
}
},
handleExceed(files, fileList) {},
beforeRemove(file, fileList) {
return this.$confirm(`确定移除 ${ file.name }`);
},
handlesuccess(response, file, fileList) {
this.filesList = fileList;
},
handlePictureCardPreview(file) {
this.dialogImageUrl = file.url;
this.dialogVisible = true;
},
}
}
</script>
<style>
.dialogConcent {
overflow-y: auto;
}
.width100{
width:100%;
}
</style>