|
|
<template>
|
|
|
<div>
|
|
|
<xy-dialog ref="dialog" :is-show.sync="isShow" type="form" :title="type === 'add' ? '新增检查' : '编辑检查'" :form="form"
|
|
|
:rules="rules" @submit="submit">
|
|
|
<template v-slot:mission_id>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;"></span>任务专题：
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-select v-model="form.mission_id" filterable clearable placeholder="请选择任务专题" style="width: 400px;">
|
|
|
<el-option v-for="item in unitList" :key="item.id" :label="item.name" :value="item.id">
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:date>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;">*</span>检查日期：
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-date-picker style="width: 400px;" v-model="form.date" format="yyyy-MM-dd HH:mm" value-format="yyyy-MM-dd HH:mm" type="datetime"
|
|
|
placeholder="选择检查日期">
|
|
|
</el-date-picker>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:siteName>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;">*</span>检查地点：
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-select @change="changeSite" v-model="form.siteName" filterable clearable placeholder="请选择检查地点" style="width: 400px;">
|
|
|
<el-option v-for="item in siteList" :key="-1" label="选择地图位置" :value="-1">
|
|
|
</el-option>
|
|
|
<el-option v-for="item in siteList" :key="item.id" :label="item.name" :value="item.id">
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:ask_id>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;">*</span>问题类型：
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-select v-model="form.ask_id" filterable clearable placeholder="请选择问题类型" style="width: 400px;">
|
|
|
<el-option v-for="item in askList" :key="item.id" :label="item.value" :value="item.id">
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:ask_department>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;"></span>建议科室：
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-input v-model="form.ask_department" type='text' placeholder="请输入建议科室" clearable
|
|
|
style="width: 400px;"></el-input>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:ask_introduce>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;">*</span>问题描述：
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-input v-model="form.ask_introduce" :rows='5' type='textarea' placeholder="请输入问题描述" clearable
|
|
|
style="width: 400px;"></el-input>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:tips>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;"></span>整改建议：
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-input v-model="form.tips" :rows='5' type='textarea' placeholder="请输入整改建议" clearable
|
|
|
style="width: 400px;"></el-input>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<template v-slot:file_ids>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;"></span>附件：
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-upload :action="action" class='upload-demo' list-type="picture-card" :file-list="pictureList"
|
|
|
ref="pictureUpload" style="width:600px" :auto-upload="true" :data="uploadOther"
|
|
|
:on-preview="handlePictureCardPreview" :on-success="handlesuccess" :on-remove="handleRemove">
|
|
|
<i class="el-icon-plus"></i>
|
|
|
</el-upload>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
</xy-dialog>
|
|
|
<el-dialog :visible.sync="showPic">
|
|
|
<img width="100%" :src="showPicUrl" alt="">
|
|
|
</el-dialog>
|
|
|
<avue-input-map ref="maps" :params="mapparams" placeholder="请选择地图" v-model="mapform"></avue-input-map>
|
|
|
|
|
|
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import {
|
|
|
Message
|
|
|
} from 'element-ui'
|
|
|
import {
|
|
|
getparameteritem
|
|
|
} from "@/api/system/dictionary.js";
|
|
|
import {
|
|
|
save,
|
|
|
get
|
|
|
} from "@/api/task/patrol.js";
|
|
|
import {
|
|
|
listunit
|
|
|
} from "@/api/task/unit.js";
|
|
|
import {
|
|
|
listaddress
|
|
|
} from '@/api/address'
|
|
|
import {
|
|
|
listdept
|
|
|
} from "@/api/system/department.js"
|
|
|
import {
|
|
|
listCommonuser
|
|
|
} from "@/api/common.js"
|
|
|
import {
|
|
|
getToken
|
|
|
} from '@/utils/auth'
|
|
|
export default {
|
|
|
components: {
|
|
|
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
isShow: false,
|
|
|
type: 'add',
|
|
|
id: '',
|
|
|
uploadOther: {
|
|
|
token: ""
|
|
|
},
|
|
|
action: `${process.env.VUE_APP_BASE_API}api/admin/upload-file`,
|
|
|
pictureList: [],
|
|
|
showPic: false,
|
|
|
showPicUrl: '',
|
|
|
unitList: [],
|
|
|
siteList: [],
|
|
|
askList: [],
|
|
|
mission_id:'',
|
|
|
mapparams: {
|
|
|
zoom: 11,
|
|
|
},
|
|
|
mapform: [],
|
|
|
form: {
|
|
|
mission_id: '',
|
|
|
date: '',
|
|
|
site_id: '',
|
|
|
siteName:'',
|
|
|
address:'',
|
|
|
lat:'',
|
|
|
lon:'',
|
|
|
ask_id: '',
|
|
|
ask_department:'',
|
|
|
ask_introduce: '',
|
|
|
tips: '',
|
|
|
file_ids: [],
|
|
|
},
|
|
|
|
|
|
rules: {
|
|
|
// mission_id: [{
|
|
|
// required: true,
|
|
|
// message: '请选择任务专题'
|
|
|
// }],
|
|
|
date: [{
|
|
|
required: true,
|
|
|
message: '请选择检查日期'
|
|
|
}],
|
|
|
siteName: [{
|
|
|
required: true,
|
|
|
message: '请选择检查地点'
|
|
|
}],
|
|
|
ask_id: [{
|
|
|
required: true,
|
|
|
message: '请选择问题类型'
|
|
|
}],
|
|
|
ask_introduce: [{
|
|
|
required: true,
|
|
|
message: '请输入问题描述'
|
|
|
}]
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
|
this.uploadOther.token = getToken();
|
|
|
this.getUnit()
|
|
|
this.getAddress()
|
|
|
this.getAsk()
|
|
|
// this.loadDeptOptions()
|
|
|
// this.loadUser()
|
|
|
},
|
|
|
methods: {
|
|
|
// 获取 专项任务
|
|
|
async getUnit() {
|
|
|
const res = await listunit({
|
|
|
page: 1,
|
|
|
page_size: 9999
|
|
|
})
|
|
|
|
|
|
this.unitList = res.data
|
|
|
},
|
|
|
changeSite(e){
|
|
|
console.log(e)
|
|
|
if(e==-1){
|
|
|
this.form.site_id = ''
|
|
|
this.form.address = ''
|
|
|
this.form.lat = ''
|
|
|
this.form.lon = ''
|
|
|
this.form.siteName = ''
|
|
|
this.$refs.maps.box = true
|
|
|
}else{
|
|
|
this.siteList.map(item=>{
|
|
|
if(item.id==e){
|
|
|
this.form.site_id = item.id
|
|
|
this.form.address = item.address
|
|
|
this.form.lat = item.lat
|
|
|
this.form.lon = item.lon
|
|
|
this.form.siteName = item.name
|
|
|
}
|
|
|
})
|
|
|
}
|
|
|
},
|
|
|
async getAddress() {
|
|
|
const res = await listaddress({
|
|
|
page: 1,
|
|
|
page_size: 9999
|
|
|
})
|
|
|
this.siteList = res.data
|
|
|
},
|
|
|
async getAsk(label) {
|
|
|
const res = await getparameteritem('askList')
|
|
|
this.askList = res.detail
|
|
|
},
|
|
|
handleRemove(file, fileList) {
|
|
|
this.pictureList = fileList
|
|
|
},
|
|
|
handlesuccess(response, file, fileList) {
|
|
|
this.pictureList = fileList
|
|
|
},
|
|
|
handlePictureCardPreview(file) {
|
|
|
this.showPicUrl = file.url;
|
|
|
this.showPic = true;
|
|
|
},
|
|
|
async getDetail() {
|
|
|
const res = await get(this.id)
|
|
|
this.form = {
|
|
|
mission_id: res?.mission_id,
|
|
|
date: res?.date,
|
|
|
site_id: res?.site_id,
|
|
|
siteName:'',
|
|
|
address:res?.address,
|
|
|
lat:res?.lat,
|
|
|
lon:res?.lon,
|
|
|
ask_id: res?.ask_id,
|
|
|
ask_department:res?.ask_department,
|
|
|
ask_introduce: res?.ask_introduce,
|
|
|
tips: res?.tips,
|
|
|
file_ids: res?.file_ids,
|
|
|
}
|
|
|
this.mapform = [res.lon, res.lat, res.address]
|
|
|
for (var f of res.files) {
|
|
|
this.pictureList.push({
|
|
|
id: f.id,
|
|
|
url: f.url,
|
|
|
name: f.original_name
|
|
|
})
|
|
|
}
|
|
|
// res.guide_upload ? this.guidePictureList.push(res.guide_upload) : ''
|
|
|
},
|
|
|
submit() {
|
|
|
let _files = []
|
|
|
if (this.pictureList.length > 0) {
|
|
|
for (var h of this.pictureList) {
|
|
|
if (h.response) {
|
|
|
_files.push(h.response.id)
|
|
|
} else {
|
|
|
_files.push(h.id)
|
|
|
}
|
|
|
}
|
|
|
this.form.file_ids = _files
|
|
|
} else {
|
|
|
this.form.file_ids = []
|
|
|
}
|
|
|
console.log(this.form)
|
|
|
// return
|
|
|
if (this.type === 'add') {
|
|
|
save({
|
|
|
...this.form
|
|
|
}).then(res => {
|
|
|
Message({
|
|
|
type: 'success',
|
|
|
message: '新增检查成功'
|
|
|
})
|
|
|
this.isShow = false
|
|
|
this.$emit('refresh')
|
|
|
})
|
|
|
return
|
|
|
}
|
|
|
if (this.type === 'editor') {
|
|
|
save({
|
|
|
id: this.id,
|
|
|
...this.form
|
|
|
}).then(res => {
|
|
|
Message({
|
|
|
type: 'success',
|
|
|
message: '编辑检查成功'
|
|
|
})
|
|
|
this.isShow = false
|
|
|
this.$emit('refresh')
|
|
|
})
|
|
|
}
|
|
|
},
|
|
|
},
|
|
|
watch: {
|
|
|
isShow(newVal) {
|
|
|
if (newVal) {
|
|
|
if (this.type === 'editor') {
|
|
|
this.getDetail()
|
|
|
}
|
|
|
if(this.type==='add'){
|
|
|
for(var k of this.unitList){
|
|
|
console.log("adddd",k.name)
|
|
|
if(k.name=='日常巡查'){
|
|
|
this.form.mission_id = k.id
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
} else {
|
|
|
this.id = ''
|
|
|
this.pictureList = []
|
|
|
this.mission_id = ''
|
|
|
this.mapform=[]
|
|
|
this.$refs['dialog'].reset()
|
|
|
}
|
|
|
},
|
|
|
mission_id(newval){
|
|
|
console.log("newval",newval)
|
|
|
if(newval){
|
|
|
this.form.mission_id = this.mission_id
|
|
|
}
|
|
|
},
|
|
|
mapform(newVal, oldVal) {
|
|
|
this.form.lon = newVal[0];
|
|
|
this.form.lat = newVal[1];
|
|
|
this.form.address = newVal[2];
|
|
|
this.form.siteName = newVal[2]
|
|
|
}
|
|
|
}
|
|
|
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
// .xy-table-item-label {
|
|
|
// width: 160px;
|
|
|
// }
|
|
|
::v-deep .ask_department{
|
|
|
flex-basis: 100%;
|
|
|
}
|
|
|
::v-deep .avue-input-map{
|
|
|
display: none;
|
|
|
}
|
|
|
::v-deep .site_id,::v-deep .address,::v-deep .lat,::v-deep .lon{
|
|
|
display: none;
|
|
|
}
|
|
|
.img__delete {
|
|
|
transform: scale(0.8, 0.8);
|
|
|
|
|
|
position: absolute;
|
|
|
top: 4px;
|
|
|
right: 4px;
|
|
|
}
|
|
|
|
|
|
::v-deep .avatar-uploader .el-upload {
|
|
|
border: 1px dashed #d9d9d9;
|
|
|
border-radius: 6px;
|
|
|
cursor: pointer;
|
|
|
position: relative;
|
|
|
overflow: hidden;
|
|
|
}
|
|
|
|
|
|
::v-deep .avatar-uploader .el-upload:hover {
|
|
|
border-color: #409EFF;
|
|
|
}
|
|
|
|
|
|
::v-deep .el-upload--picture-card {
|
|
|
font-size: 28px;
|
|
|
color: #8c939d;
|
|
|
width: 146px !important;
|
|
|
height: 146px !important;
|
|
|
line-height: 146px !important;
|
|
|
text-align: center;
|
|
|
}
|
|
|
|
|
|
::v-deep .avatar-uploader-icon {
|
|
|
font-size: 28px;
|
|
|
color: #8c939d;
|
|
|
width: 146px !important;
|
|
|
height: 146px !important;
|
|
|
line-height: 146px !important;
|
|
|
text-align: center;
|
|
|
}
|
|
|
|
|
|
::v-deep .avatar {
|
|
|
width: 80px !important;
|
|
|
display: block;
|
|
|
border-radius: 6px;
|
|
|
}
|
|
|
|
|
|
// ::v-deep .xy-table-item-label {
|
|
|
// width: 160px !important;
|
|
|
// }
|
|
|
|
|
|
::v-deep .el-date-editor .el-range-separator {
|
|
|
width: auto !important;
|
|
|
}
|
|
|
|
|
|
::v-deep .el-input-number .el-input__inner {
|
|
|
text-align: left !important;
|
|
|
}
|
|
|
|
|
|
.searchCompanys {
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
margin-bottom: 16px;
|
|
|
|
|
|
.el-input {
|
|
|
width: 80%
|
|
|
}
|
|
|
}
|
|
|
</style>
|
