Files
dvcp_v2_webapp/packages/jianping/AppHelpedResident/hrAdd.vue
2022-04-26 14:00:40 +08:00

369 lines
17 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<section class="hrAdd">
<ai-detail>
<ai-title slot="title" :title="addTitle" isShowBottomBorder isShowBack @onBackClick="back"/>
<template #content>
<el-form :model="form" ref="ruleForm" :rules="rules" label-width="130px" label-position="right" size="small">
<ai-card title="基本信息">
<template #content>
<div flex class="half wrap">
<div flex class="column">
<el-form-item label="户主姓名" prop="name">
<!-- <el-input v-model="form.name" placeholder="请输入姓名" maxlength="20" show-word-limit
:disabled="isEdit"/> -->
<el-input size="small" class="user-selecter" v-model="form.name" placeholder="请输入姓名" clearable :disabled="isEdit || isSelectUser">
<template slot="append">
<ai-person-select :instance="instance" @selectPerson="checkName" :url="'/app/appresident/list?auditStatus=1&householdName=1&areaId='+user.info.areaId"></ai-person-select>
</template>
</el-input>
</el-form-item>
<el-form-item label="身份证号" prop="idNumber">
<el-input v-model="form.idNumber" placeholder="请输入身份证号" :maxlength="18" :disabled="isEdit || isSelectUser"
@change="handleIdNumberAutocomplete"/>
</el-form-item>
<el-form-item label="性别" prop="sex">
<ai-select v-model="form.sex" :selectList="dict.getDict('sex')" disabled/>
</el-form-item>
</div>
<el-form-item label="个人照片" prop="photo">
<ai-avatar :instance="instance" v-model="form.photo"/>
</el-form-item>
<el-form-item label="出生日期" prop="birthDate">
<el-date-picker disabled value-format="yyyy-MM-dd HH:mm:ss" format="yyyy-MM-dd"
v-model="form.birthDate" type="date" placeholder="选择日期"/>
</el-form-item>
<el-form-item label="年龄" prop="age">
<el-input disabled v-model="form.age" placeholder="请输入年龄" type="number"/>
</el-form-item>
<el-form-item label="文化程度" prop="education">
<ai-select v-model="form.education" :selectList="dict.getDict('fpEducation')"/>
</el-form-item>
<el-form-item label="民族" prop="nation">
<ai-select v-model="form.nation" :selectList="dict.getDict('fpNation')"/>
</el-form-item>
<el-form-item label="政治面貌" prop="politicsStatus">
<ai-select v-model="form.politicsStatus" :selectList="dict.getDict('fpPoliticalOutlook')"/>
</el-form-item>
<el-form-item label="在校生状况" prop="schoolStatus">
<ai-select v-model="form.schoolStatus" :selectList="dict.getDict('fpStudentsInSchool')"/>
</el-form-item>
<el-form-item label="务工时间(月)" prop="workeMonths">
<el-input v-model="form.workeMonths" placeholder="请输入" clearable/>
</el-form-item>
<el-form-item label="劳动技能" prop="labourStatus">
<ai-select v-model="form.labourStatus" :selectList="dict.getDict('fpLaborSkills')"/>
</el-form-item>
<el-form-item label="务工区域" prop="workArea">
<el-input v-model="form.workArea" placeholder="请输入" clearable maxlength="30" show-word-limit/>
</el-form-item>
<el-form-item label="是否参加大病保险" prop="seriousIllnessInsurance">
<ai-select v-model="form.seriousIllnessInsurance" :selectList="dict.getDict('fpYesOrNo')"/>
</el-form-item>
<el-form-item label="是否参加基本医保" prop="basicMedicalTreatment">
<ai-select v-model="form.basicMedicalTreatment" :selectList="dict.getDict('fpYesOrNo')"/>
</el-form-item>
<el-form-item label="享受最低生活保障" prop="subsistenceAllowance">
<ai-select v-model="form.subsistenceAllowance" :selectList="dict.getDict('fpYesOrNo')"/>
</el-form-item>
<el-form-item label="是否参加养老保险" prop="endowmentInsurance">
<ai-select v-model="form.endowmentInsurance" :selectList="dict.getDict('fpYesOrNo')"/>
</el-form-item>
<el-form-item label="是否特困供养" prop="specialPovertySupport">
<ai-select v-model="form.specialPovertySupport" :selectList="dict.getDict('fpYesOrNo')"/>
</el-form-item>
</div>
<el-form-item label="健康状况" prop="healthyStatusList">
<el-checkbox-group v-model="form.healthyStatusList">
<el-checkbox :label="item.dictValue" v-for="(item, index) in dict.getDict('fpHealth')" :key="index">{{item.dictName}}</el-checkbox>
</el-checkbox-group>
</el-form-item>
</template>
</ai-card>
<ai-card title="联络信息">
<template slot="content">
<el-form-item label="联系方式" prop="phone">
<el-input v-model="form.phone" placeholder="请输入联系方式" :maxlength="11" show-word-limit/>
</el-form-item>
<el-form-item label="现住址" prop="currentAreaId">
<ai-area-get :instance="instance" v-model="form.currentAreaId" :root="rootArea" valueLevel="5"/>
<el-form-item prop="currentAddress">
<el-input v-model="form.currentAddress" placeholder="详细地址" maxlength="30" show-word-limit clearable/>
</el-form-item>
</el-form-item>
</template>
</ai-card>
<ai-card title="户籍信息">
<template slot="content">
<div flex class="half wrap">
<!-- <el-form-item label="是否户主" prop="isHousehold">
<ai-select v-model="form.isHousehold" :selectList="dict.getDict('yesOrNo')"
@change="form.householdRelation=null"/>
</el-form-item> -->
<el-form-item label="监测对象类型" prop="objectType">
<ai-select v-model="form.objectType" :selectList="dict.getDict('fpType')"/>
</el-form-item>
<el-form-item label="是否危房" prop="dilapidatedHousehold">
<ai-select v-model="form.dilapidatedHousehold" :selectList="dict.getDict('fpYesOrNo')"/>
</el-form-item>
<el-form-item label="是否饮用水安全" prop="drinkingWaterSafety">
<ai-select v-model="form.drinkingWaterSafety" :selectList="dict.getDict('fpYesOrNo')"/>
</el-form-item>
<el-form-item label="是否搬迁" prop="move">
<ai-select v-model="form.move" :selectList="dict.getDict('fpYesOrNo')"/>
</el-form-item>
<!-- <template v-if="form.isHousehold==0">
<el-form-item label="与户主关系" prop="householdRelation">
<ai-select v-model="form.householdRelation" :selectList="dict.getDict('fpRelationship')"/>
</el-form-item>
<el-form-item label="户主身份证号" prop="householdIdNumber">
<el-input v-model="form.householdIdNumber" placeholder="请输入户主身份证号" :maxlength="18" clearable/>
</el-form-item>
</template> -->
</div>
</template>
</ai-card>
<ai-card title="情况描述">
<template slot="content">
<el-form-item label="风险因素" prop="riskType">
<ai-select v-model="form.riskType" :selectList="dict.getDict('fpRiskType')"/>
</el-form-item>
<el-form-item label="备注说明">
<el-form-item>
<el-input v-model="form.detail" placeholder="备注说明" maxlength="500" show-word-limit clearable type="textarea" />
</el-form-item>
</el-form-item>
<el-form-item label="图片最多9张" >
<ai-uploader
:isShowTip="true"
:instance="instance"
v-model="form.files"
fileType="img"
acceptType=".png,.jpg,.jpeg"
:limit="9">
<template slot="tips">最多上传9张图片,单张图片最大10MB<br/>支持.png,.jpg,.jpeg格式</template>
</ai-uploader>
</el-form-item>
</template>
</ai-card>
<template v-if="/[123]/.test(form.status)">
<ai-card title="收入情况(单位:元)">
<template slot="content">
<div flex class="half wrap">
<el-form-item label="工资收入">
<el-input v-model="form.income1" placeholder="请输入" clearable/>
</el-form-item>
<el-form-item label="生产经营收入">
<el-input v-model="form.income2" placeholder="请输入" clearable/>
</el-form-item>
<el-form-item label="财产性收入">
<el-input v-model="form.income3" placeholder="请输入" clearable/>
</el-form-item>
<el-form-item label="转移性收入">
<el-input v-model="form.income4" placeholder="请输入" clearable/>
</el-form-item>
<el-form-item label="理赔收入">
<el-input v-model="form.income5" placeholder="请输入" clearable/>
</el-form-item>
<el-form-item label="生产经营支出">
<el-input v-model="form.income6" placeholder="请输入" clearable/>
</el-form-item>
<el-form-item label="合规自然支出">
<el-input v-model="form.income7" placeholder="请输入" clearable/>
</el-form-item>
<el-form-item label="家庭人均纯收入">
<el-input v-model="form.income8" placeholder="请输入" clearable/>
</el-form-item>
</div>
</template>
</ai-card>
<ai-card title="帮扶情况">
<template slot="content">
<div flex class="half wrap">
<el-form-item label="产业帮扶">
<ai-select v-model="form.industrialAssistance"
:selectList="dict.getDict('fpIndustrialAssistance')"/>
</el-form-item>
<el-form-item label="健康帮扶">
<ai-select v-model="form.healthAssistance" :selectList="dict.getDict('fpHealthAssistance')"/>
</el-form-item>
<el-form-item label="就业帮扶">
<ai-select v-model="form.employmentAssistance"
:selectList="dict.getDict('fpEmploymentAssistance')"/>
</el-form-item>
<el-form-item label="教育帮扶">
<ai-select v-model="form.educationalAssistance"
:selectList="dict.getDict('fpEducationalAssistance')"/>
</el-form-item>
<el-form-item label="金融帮扶">
<ai-select v-model="form.financialAssistance" :selectList="dict.getDict('fpFnancialAssistance')"/>
</el-form-item>
<el-form-item label="社会帮扶">
<ai-select v-model="form.socialAssistance" :selectList="dict.getDict('fpSocialAssistance')"/>
</el-form-item>
<el-form-item label="公益岗帮扶">
<ai-select v-model="form.publicWelfarePostAssistance"
:selectList="dict.getDict('fpPublicWelfarePostAssistance')"/>
</el-form-item>
<el-form-item label="是否风险消除">
<ai-select disabled v-model="form.riskEliminated" :selectList="dict.getDict('fpYesOrNo')"/>
</el-form-item>
<el-form-item label="风险消除日期">{{ form.riskEliminatedTime }}</el-form-item>
</div>
</template>
</ai-card>
</template>
</el-form>
</template>
<template #footer>
<el-button @click="back">取消</el-button>
<el-button type="primary" @click="submit">提交</el-button>
</template>
</ai-detail>
</section>
</template>
<script>
import {mapState} from "vuex";
export default {
name: "hrAdd",
props: {
instance: Function,
dict: Object,
permissions: Function
},
computed: {
...mapState(['user']),
isEdit() {
return !!this.$route.query.id
},
addTitle() {
return this.isEdit ? "编辑监测对象" : "添加监测对象"
},
rules() {
return {
idNumber: [{required: true, message: "请输入身份证号"}],
name: [{required: true, message: "请输入姓名"}],
sex: [{required: true, message: "请选择性别"}],
phone: [{required: true, message: "请输入联系方式"}],
currentAreaId: [
{required: true, message: "请选择现住址"},
{pattern: /[^0]0{0,2}$/, message: "请选择到村/社区"},
],
isHousehold: [{required: true, message: "请选择是否户主"}],
householdRelation: [{required: true, message: "请选择与户主关系"}],
householdIdNumber: [{required: true, message: "请选择户主身份证号"}],
riskType: [{required: true, message: "请选择风险因素"}],
}
},
rootArea() {
return this.user.info?.areaId?.replace(/(\d{6})\d+/g, '$1' + Array(7).join("0")) || ""
}
},
data() {
return {
form: {
householdRelation: "",
healthyStatus: '',
healthyStatusList: [],
file: [],
},
isSelectUser: false, //是否选择人员
}
},
methods: {
checkName(e) {
if(!e) {
this.isSelectUser = false
this.form.name = ''
this.form.idNumber = ''
this.form.phone =''
this.form.currentAreaId = ''
this.form.currentAddress = ''
this.form.birthDate = ''
this.form.sex = ''
this.form.age = ''
return
}
this.form.name = e.name
this.form.idNumber = e.idNumber
this.form.phone = e.phone
this.form.currentAreaId = e.currentAreaId
this.form.currentAddress = e.currentAddress
this.handleIdNumberAutocomplete(e.idNumber)
this.isSelectUser = true
},
back() {
this.$router.push({})
},
getDetail() {
let {id} = this.$route.query
id && this.instance.post("/app/apppreventionreturntopoverty/queryDetailById", null, {
params: {id}
}).then(res => {
if (res?.data) {
res.data.healthyStatusList = []
if(res.data.healthyStatus) {
res.data.healthyStatusList = res.data.healthyStatus.split(',')
}
this.form = {...res.data}
}
})
},
handleIdNumberAutocomplete(v) {
let {birthday: birthDate, sex} = this.idCardNoUtil.getIdCardInfo(v)
this.form = {...this.form, birthDate, sex, age: this.$calcAge(v)}
},
submit() {
this.$refs.ruleForm.validate(v => {
if (v) {
this.form.isHousehold = 1
this.form.householdIdNumber = this.form.idNumber
if (this.form.healthyStatusList.length) {
this.form.healthyStatus = this.form.healthyStatusList.join(',')
}
this.instance.post(`/app/apppreventionreturntopoverty/addOrUpdate`, this.form).then(res => {
if (res.code == 0) {
this.$message.success('提交成功!');
this.back()
}
})
}
})
}
},
created() {
this.getDetail()
}
}
</script>
<style lang="scss" scoped>
.hrAdd {
height: 100%;
.half {
align-items: flex-start;
& > .el-form-item, & > div {
width: 50%;
.el-form-item {
width: 100%;
}
}
}
.el-date-editor {
width: 100%;
}
::v-deep .AiPersonSelect .el-button {
color: #fff;
}
}
</style>