<template>
|
<div class="record_add">
|
<v-header title="新增"></v-header>
|
<el-form ref="recordform" :model="recordform" :rules="rules" label-width="110px">
|
<el-form-item label="巡查时间" required prop="patrolTime">
|
<el-date-picker
|
v-model="recordform.patrolTime"
|
type="date"
|
:clearable="true"
|
value-format="yyyy-MM-dd"
|
placeholder="选择日期"
|
></el-date-picker>
|
<span class="mr">{{ wea }}</span>
|
</el-form-item>
|
|
<el-form-item label="选择" prop="patrolType">
|
<!-- <el-radio-group v-model="recordform.patrolType">
|
<el-radio
|
v-for="item in patrolTypeCheck"
|
:key="item.value"
|
:label="item.value">{{item.label}}</el-radio>
|
</el-radio-group>-->
|
<el-checkbox-group v-model="recordform.patrolType">
|
<el-checkbox
|
v-for="item in patrolTypeCheck"
|
:key="item.value"
|
:label="item.value"
|
>{{ item.label }}</el-checkbox>
|
</el-checkbox-group>
|
</el-form-item>
|
|
<el-form-item label="巡查领导" prop="patrolLeader">
|
<el-checkbox-group v-model="recordform.patrolLeader">
|
<el-checkbox
|
v-for="item in configpatrolLeader"
|
:key="item.value"
|
:label="item.value"
|
>{{ item.label }}</el-checkbox>
|
</el-checkbox-group>
|
</el-form-item>
|
|
<el-form-item label="巡查人员" prop="patrolPerson">
|
<el-checkbox-group v-model="recordform.patrolPerson">
|
<el-checkbox
|
v-for="item in configpatrolPerson"
|
:key="item.value"
|
:label="item.value"
|
>{{ item.label }}</el-checkbox>
|
</el-checkbox-group>
|
</el-form-item>
|
|
<el-form-item label="巡查地址" prop="address">
|
<el-input
|
class="custom-width-input"
|
v-model="recordform.address"
|
maxlength="50"
|
show-word-limit
|
></el-input>
|
</el-form-item>
|
|
<el-form-item label="巡查记录" prop="recordContent">
|
<el-input
|
type="textarea"
|
cols="20"
|
rows="5"
|
placeholder="巡查的情况描述"
|
maxlength="200"
|
show-word-limit
|
v-model="recordform.recordContent"
|
></el-input>
|
</el-form-item>
|
|
<el-form-item label="发现记录" prop="findRecord">
|
<el-input
|
type="textarea"
|
cols="20"
|
rows="5"
|
maxlength="200"
|
placeholder="是否发现问题或发现新的情况，填写发现的情况或写'无'"
|
show-word-limit
|
v-model="recordform.findRecord"
|
></el-input>
|
</el-form-item>
|
|
<el-form-item label="记录照片">
|
<div class="app_images">
|
<div class="avatar" v-for="(i, j) in recordform.recordPhoto" :key="j + '-ta-img'">
|
<span class="close el-icon-close" @click.stop="onDelImage(i)"></span>
|
<img :src="i" alt @click.stop="appShowImage(i, recordform.recordPhoto)" />
|
</div>
|
<v-upload
|
slots
|
class="avatar"
|
@path="onImageSave"
|
v-if="recordform.recordPhoto.length < 9"
|
>
|
<div class="db">
|
<i class="el-icon-plus"></i>
|
<b>上传</b>
|
</div>
|
</v-upload>
|
</div>
|
</el-form-item>
|
|
<el-form-item label="备注">
|
<el-input
|
type="textarea"
|
cols="20"
|
rows="5"
|
maxlength="200"
|
show-word-limit
|
placeholder="(非必填)"
|
v-model="recordform.remark"
|
></el-input>
|
</el-form-item>
|
|
<el-form-item label="是否存在隐患" label-width="110px" prop="isHiddenDanger">
|
<el-radio-group v-model="recordform.isHiddenDanger">
|
<el-radio
|
v-for="item in isHiddenDangerRadio"
|
:key="item.value"
|
:label="item.value"
|
>{{ item.label }}</el-radio>
|
</el-radio-group>
|
</el-form-item>
|
<!-- 不存在隐患不显示 -->
|
<div v-if="recordform.isHiddenDanger == '1'">
|
<el-form-item label="隐患类型" prop="hiddenDangerType">
|
<el-checkbox-group v-model="recordform.hiddenDangerType">
|
<el-checkbox
|
v-for="item in dangerTypeCheck"
|
:key="item.value"
|
:label="item.value"
|
:disabled="!recordform.patrolType.includes(item.value)"
|
>{{ item.label }}</el-checkbox>
|
</el-checkbox-group>
|
</el-form-item>
|
|
<el-form-item label="隐患名称" prop="dangerName">
|
<el-input
|
class="custom-width-input"
|
v-model="recordform.dangerName"
|
maxlength="20"
|
placeholder="请填写隐患名称"
|
></el-input>
|
</el-form-item>
|
|
<el-form-item label="排查时间" required prop="checkTime">
|
<!-- <el-select
|
class="custom-width-select"
|
size="small"
|
v-model="recordform.checkTime"
|
></el-select>-->
|
<el-date-picker
|
v-model="recordform.checkTime"
|
type="date"
|
value-format="yyyy-MM-dd"
|
placeholder="选择日期"
|
></el-date-picker>
|
</el-form-item>
|
|
<el-form-item label="全称" prop="unitName">
|
<el-input
|
class="custom-width-input"
|
v-model="recordform.unitName"
|
maxlength="20"
|
placeholder="请填写主体部门、单位或个人全称"
|
></el-input>
|
</el-form-item>
|
|
<el-form-item label="隐患简述" prop="dangerDescription">
|
<el-input
|
type="textarea"
|
cols="20"
|
rows="5"
|
placeholder="请填写隐患简述"
|
maxlength="200"
|
show-word-limit
|
v-model="recordform.dangerDescription"
|
></el-input>
|
</el-form-item>
|
|
<el-form-item label="是否立即整改" label-width="110px" prop="isRectifyImmediately">
|
<el-radio-group v-model="recordform.isRectifyImmediately">
|
<el-radio
|
v-for="item in isRectifyImmediatelyRadio"
|
:key="item.value"
|
:label="item.value"
|
>{{ item.label }}</el-radio>
|
</el-radio-group>
|
</el-form-item>
|
|
<!-- 不整改内容不显示 -->
|
<div v-if="recordform.isRectifyImmediately == '1'">
|
<el-form-item label="采取措施" prop="takeSteps">
|
<el-input
|
type="textarea"
|
cols="20"
|
rows="5"
|
placeholder="请填写采取的措施"
|
maxlength="200"
|
show-word-limit
|
v-model="recordform.takeSteps"
|
></el-input>
|
</el-form-item>
|
<el-form-item label="采取措施照片">
|
<div class="app_images">
|
<div class="avatar" v-for="(i, j) in recordform.stepsPhoto" :key="j + '-ta-img'">
|
<span class="close el-icon-close" @click.stop="onDelImage2(i)"></span>
|
<img :src="i" alt @click.stop="appShowImage(i, recordform.stepsPhoto)" />
|
</div>
|
<v-upload
|
slots
|
class="avatar"
|
@path="onImageSave2"
|
v-if="recordform.stepsPhoto.length < 9"
|
>
|
<div class="db">
|
<i class="el-icon-plus"></i>
|
<b>上传</b>
|
</div>
|
</v-upload>
|
</div>
|
</el-form-item>
|
<el-form-item label="整改人员" prop="rectifyPerson">
|
<el-select class="custom-width-select" size="small" v-model="recordform.rectifyPerson">
|
<el-option
|
v-for="item in configrectifyPerson"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
</div>
|
</div>
|
<el-form-item label="接班时间" required prop="successionTime">
|
<el-date-picker
|
v-model="recordform.successionTime"
|
type="date"
|
value-format="yyyy-MM-dd"
|
:clearable="true"
|
@change="chooseDatapatrolLeader(recordform.successionTime)"
|
placeholder="选择日期"
|
></el-date-picker>
|
</el-form-item>
|
|
<el-form-item label="接班领导" prop="successionLeader">
|
<el-checkbox-group v-model="recordform.successionLeader">
|
<el-checkbox
|
v-for="item in configsuccessionLeader"
|
:key="item.value"
|
:label="item.value"
|
>{{ item.label }}</el-checkbox>
|
</el-checkbox-group>
|
</el-form-item>
|
|
<el-form-item label="接班人员" prop="successionPerson">
|
<el-checkbox-group v-model="recordform.successionPerson">
|
<el-checkbox
|
v-for="item in configsuccessionPerson"
|
:key="item.value"
|
:label="item.value"
|
>{{ item.label }}</el-checkbox>
|
</el-checkbox-group>
|
</el-form-item>
|
<!-- 底部按钮 -->
|
<el-form-item>
|
<el-button
|
type="primary"
|
@click="onSubmit('recordform')"
|
:loading="btnLoading"
|
:disabled="btnLoading"
|
>立即创建</el-button>
|
<el-button @click="cancel()">取消</el-button>
|
</el-form-item>
|
</el-form>
|
</div>
|
</template>
|
|
<script>
|
import vUpload from "com/upload/upload1";
|
export default {
|
props: {},
|
components: { vUpload },
|
data() {
|
return {
|
weather: {},
|
a: "",
|
recordform: {
|
patrolTime: "",
|
address: "",
|
checkTime: "",
|
communityId: 0,
|
createBy: 0,
|
dangerDescription: "",
|
dangerName: "",
|
findRecord: "",
|
isHiddenDanger: "1",
|
isRectifyImmediately: "1",
|
patrolLeader: [], //巡查领导id
|
patrolPerson: [], //巡查人员id
|
patrolType: [],
|
hiddenDangerType: [], //隐患类型
|
recordContent: "",
|
rectifyPerson: "",
|
remark: "",
|
successionLeader: [],
|
successionPerson: [],
|
successionTime: "",
|
takeSteps: "",
|
// temperature: "",
|
unitName: "",
|
weather: "",
|
recordPhoto: [], //记录照片
|
stepsPhoto: [], //采取措施照片
|
wind: "",
|
ppersonName: "", //巡查人姓名
|
ppersonPhone: "", //巡查人电话
|
dpersonName: "", //隐患整改人姓名
|
dpersonPhone: "" //隐患整改人电话
|
|
},
|
rules: {
|
patrolTime: [
|
{ required: true, message: '请选择日期', trigger: 'change' },
|
],
|
patrolType: [
|
{ required: true, message: '请选择巡查类型', trigger: 'change' },
|
],
|
hiddenDangerType: [
|
{ required: true, message: '请选择隐患类型', trigger: 'change' },
|
],
|
patrolLeader: [
|
{ required: true, message: '请选择巡查领导', trigger: 'change' },
|
],
|
patrolPerson: [
|
{ required: true, message: '请选择巡查人员', trigger: 'change' },
|
],
|
address: [
|
{ required: true, message: '请输入巡查地址', trigger: 'change' },
|
],
|
recordContent: [
|
{ required: true, message: '请输入巡查记录', trigger: 'change' },
|
],
|
findRecord: [
|
{ required: true, message: '请输入发现记录', trigger: 'change' },
|
],
|
successionTime: [
|
{ required: true, message: '请选择接班时间', trigger: 'change' },
|
],
|
successionLeader: [
|
{ required: true, message: '请选择接班领导', trigger: 'change' },
|
],
|
successionPerson: [
|
{ required: true, message: '请选择接班人员', trigger: 'change' },
|
],
|
isHiddenDanger: [
|
{ required: true, message: '请选择是否存在隐患', trigger: 'change' },
|
],
|
dangerName: [
|
{ required: true, message: '请输入隐患名称', trigger: 'change' },
|
],
|
checkTime: [
|
{ required: true, message: '请选择排查时间', trigger: 'change' },
|
],
|
unitName: [
|
{ required: true, message: '请输入全称', trigger: 'change' },
|
],
|
dangerDescription: [
|
{ required: true, message: '请输入隐患简述', trigger: 'change' },
|
],
|
isRectifyImmediately: [
|
{ required: true, message: '请选择是否立即整改', trigger: 'change' },
|
],
|
takeSteps: [
|
{ required: true, message: '请输入采取的措施', trigger: 'change' },
|
],
|
rectifyPerson: [
|
{ required: true, message: '请选择整改人员', trigger: 'change' },
|
],
|
},
|
configpatrolPerson: [], //巡查人员
|
configpatrolLeader: [], //巡查领导
|
configsuccessionLeader: [],//接班领导
|
configsuccessionPerson: [],//接班人员
|
configrectifyPerson: [],//整改人员
|
choosePersonData: [],//所有人员
|
patrolTypeCheck: [
|
{
|
value: "1",
|
label: "防火巡查"
|
},
|
{
|
value: "2",
|
label: "防汛巡查"
|
},
|
{
|
value: "3",
|
label: "防疫巡查"
|
},
|
],
|
dangerTypeCheck: [
|
{
|
value: "1",
|
label: "火灾隐患"
|
},
|
{
|
value: "2",
|
label: "汛情隐患"
|
},
|
{
|
value: "3",
|
label: "疫情隐患"
|
},
|
],
|
isHiddenDangerRadio: [
|
{
|
value: "1",
|
label: "是"
|
},
|
{
|
value: "0",
|
label: "否"
|
},
|
],
|
isRectifyImmediatelyRadio: [
|
{
|
value: "1",
|
label: "是"
|
},
|
{
|
value: "0",
|
label: "否"
|
},
|
],
|
btnLoading: false,
|
|
};
|
},
|
computed: {
|
wea() {
|
let wea = this.weather;
|
if (!wea.weather) return "";
|
return (
|
wea.weather +
|
wea.temperature +
|
"℃ " +
|
wea.winddirection +
|
"风" +
|
wea.windpower +
|
"级"
|
);
|
},
|
},
|
watch: {},
|
|
inject: ["appShowImage"],
|
|
mounted() {
|
this.$api.mock.getIp((e) => {
|
if (e.adcode) {
|
this.$api.mock.getWeather(510400, (res) => {
|
this.weather = (res.lives || [])[0] || {};
|
});
|
}
|
});
|
|
//获取选择人员
|
this.choosePerson()
|
},
|
|
methods: {
|
choosePerson() {
|
this.$api.post('patrolRecord/getTotlePerson', { param: "" }, e => {
|
this.choosePersonData = e;
|
let newPerson = e.map(d => {
|
return {
|
label: d.name,
|
value: d.id,
|
}
|
});
|
this.configpatrolPerson = newPerson;
|
this.configpatrolLeader = newPerson;
|
this.configrectifyPerson = newPerson
|
|
this.configsuccessionLeader = newPerson;//接班领导
|
this.configsuccessionPerson = newPerson;//接班人员
|
})
|
|
},
|
|
chooseDatapatrolLeader(time) {
|
//根据日期查询接班人员
|
this.recordform.successionPerson = [];
|
this.recordform.successionLeader = [];
|
this.$api.get('patrolRecord/getRotaPersonByDate', { rotaDate: time }, e => {
|
let arr = []
|
e.forEach(item => {
|
arr.push(parseInt(item.id))
|
})
|
this.recordform.successionPerson = arr
|
})
|
|
// //根据日期查询接班领导
|
this.$api.get('patrolRecord/getRotaLeaderByDate', { rotaDate: time }, e => {
|
e.forEach(item => {
|
let arr = []
|
e.forEach(item => {
|
arr.push(parseInt(item.id))
|
})
|
this.recordform.successionLeader = arr
|
})
|
})
|
},
|
|
//记录照片
|
onImageSave(v) {
|
this.recordform.recordPhoto.push(v);
|
},
|
onImageSave2(v) {
|
this.recordform.stepsPhoto.push(v);
|
},
|
|
onDelImage(v) {
|
this.recordform.recordPhoto = this.recordform.recordPhoto.filter((r) => {
|
return r !== v;
|
});
|
},
|
onDelImage2(v) {
|
this.recordform.stepsPhoto = this.recordform.stepsPhoto.filter((r) => {
|
return r !== v;
|
});
|
},
|
|
//采取措施照片
|
onImageSave2(v) {
|
this.recordform.stepsPhoto.push(v);
|
},
|
|
onDelImage2(v) {
|
this.recordform.stepsPhoto = this.recordform.stepsPhoto.filter((r) => {
|
return r !== v;
|
});
|
},
|
|
//新增巡查记录
|
onSubmit(recordform) {
|
this.btnLoading = true;
|
this.$refs[recordform].validate((valid) => {
|
if (valid) {
|
this.choosePersonData.forEach(e => {
|
// 根据巡查人员id,获取姓名，电话
|
if (this.recordform.patrolPerson === e.id) {
|
this.recordform.ppersonName = e.name;
|
this.recordform.ppersonPhone = e.phone;
|
}
|
});
|
|
const newParams = {
|
...this.recordform,
|
patrolType: `${this.recordform.patrolType}`,
|
hiddenDangerType: `${this.recordform.hiddenDangerType}`,
|
patrolLeader: `${this.recordform.patrolLeader}`,
|
patrolPerson: `${this.recordform.patrolPerson}`,
|
successionLeader: `${this.recordform.successionLeader}`,
|
successionPerson: `${this.recordform.successionPerson}`,
|
recordPhoto: this.recordform.recordPhoto.join(","),
|
stepsPhoto: this.recordform.stepsPhoto.join(",")
|
}
|
|
this.$api.post('patrolRecord/addPatrolRecord', newParams, e => {
|
demo.toast("新增成功");
|
setTimeout(() => {
|
this.$router.push({ path: "/sa_ins_record" });
|
this.btnLoading = false;
|
}, 1e3);
|
})
|
} else {
|
demo.toast("验证不通过，请填写完整");
|
this.btnLoading = false;
|
return false;
|
}
|
});
|
},
|
|
//取消
|
cancel() {
|
this.$router.push({ path: "/sa_ins_record" });
|
}
|
},
|
|
};
|
</script>
|
<style lang='less' scoped>
|
.record_add {
|
overflow-y: auto;
|
padding-right: 30px;
|
.mr {
|
padding-left: 20px;
|
color: #606266;
|
}
|
.custom-width-select {
|
width: 215px;
|
}
|
.custom-width-input {
|
width: 315px;
|
}
|
.el-textarea {
|
width: 500px;
|
}
|
}
|
</style>
|
