Files
dvcp_v2_webapp/packages/jianping/AppHelpedResident/hrDetail.vue
2022-04-25 08:58:10 +08:00

874 lines
32 KiB
Vue

<template>
<section class="hrDetail">
<ai-detail>
<ai-title
slot="title"
title="监测对象详情"
isShowBottomBorder
isShowBack
@onBackClick="back"
>
<template #rightBtn>
<template v-if="/0/.test(detail.status) && isGridAdmin">
<el-button type="primary" @click="handleAccept(1)"
>纳入监测</el-button
>
<el-button type="primary" @click="handleAccept(0)"
>驳回申请</el-button
>
</template>
<template v-if="/1/.test(detail.status)">
<el-button
type="primary"
@click="handleRelieve(1)"
v-if="isGridAdmin"
>解除风险</el-button
>
<el-button type="primary" @click="handleRelieve()" v-else
>申请解除风险</el-button
>
<el-button type="primary" icon="iconfont iconEdit" @click="gotoEdit"
>编辑</el-button
>
<el-button
v-if="isGridAdmin"
icon="iconfont iconDelete"
@click="handleDelete(detail.id)"
>删除</el-button
>
</template>
<template v-if="/2/.test(detail.status) && isGridAdmin">
<el-button type="primary" @click="handleRelieve(1)"
>解除风险</el-button
>
<el-button type="primary" @click="handleRelieve(0)"
>继续监测</el-button
>
</template>
<template v-if="/3/.test(detail.status) && isGridAdmin">
<el-button type="primary" @click="handleAccept(1)"
>纳入监测</el-button
>
<el-button
v-if="isGridAdmin"
icon="iconfont iconDelete"
@click="handleDelete(detail.id)"
>删除</el-button
>
</template>
<template v-if="/5/.test(detail.status)">
<el-button
v-if="isGridAdmin"
type="primary"
@click="handleAccept(1)"
>纳入监测</el-button
>
<el-button v-else type="primary" @click="handleAccept()"
>申请纳入监测</el-button
>
<el-button
v-if="isGridAdmin"
icon="iconfont iconDelete"
@click="handleDelete(detail.id)"
>删除</el-button
>
</template>
<el-button
v-if="/4/g.test(detail.status)"
icon="iconfont iconDelete"
@click="handleDelete(detail.id)"
>
删除
</el-button>
</template>
</ai-title>
<template #content>
<el-form
:model="detail"
label-width="130px"
label-position="right"
size="small"
>
<el-tabs tabPosition="left" v-model="currentTab">
<el-tab-pane label="基本信息" lazy>
<ai-card :title="detail.name || '无名氏'">
<template #content>
<div flex class="flex-start">
<div flex class="half wrap fill">
<el-form-item label="身份证号" prop="name">{{
detail.idNumber
}}</el-form-item>
<el-form-item label="性别" prop="sex">{{
dict.getLabel("sex", detail.sex)
}}</el-form-item>
<el-form-item label="出生日期">{{
detail.birthDate
}}</el-form-item>
<el-form-item label="年龄" prop="age">{{
detail.age
}}</el-form-item>
<el-form-item label="文化程度">{{
dict.getLabel("fpEducation", detail.education)
}}</el-form-item>
<el-form-item label="民族">{{
dict.getLabel("fpNation", detail.nation)
}}</el-form-item>
<el-form-item label="政治面貌"
>{{
dict.getLabel(
"fpPoliticalOutlook",
detail.politicsStatus
)
}}
</el-form-item>
<el-form-item label="在校生状况"
>{{
dict.getLabel(
"fpStudentsInSchool",
detail.schoolStatus
)
}}
</el-form-item>
<!-- <el-form-item label="健康状况">{{ dict.getLabel('fpHealth', detail.healthyStatus) }}</el-form-item> -->
<el-form-item label="务工时间(月)" prop="idNumber">{{
detail.workeMonths
}}</el-form-item>
<el-form-item label="劳动技能"
>{{
dict.getLabel("fpLaborSkills", detail.labourStatus)
}}
</el-form-item>
<el-form-item label="务工区域" prop="idNumber">{{
detail.workArea
}}</el-form-item>
<el-form-item label="是否参加大病保险"
>{{
dict.getLabel(
"fpYesOrNo",
detail.seriousIllnessInsurance
)
}}
</el-form-item>
<el-form-item label="是否参加基本医保"
>{{
dict.getLabel(
"fpYesOrNo",
detail.basicMedicalTreatment
)
}}
</el-form-item>
<el-form-item label="享受最低生活保障"
>{{
dict.getLabel(
"fpYesOrNo",
detail.subsistenceAllowance
)
}}
</el-form-item>
<el-form-item label="是否参加养老保险"
>{{
dict.getLabel("fpYesOrNo", detail.endowmentInsurance)
}}
</el-form-item>
<el-form-item label="是否特困供养"
>{{
dict.getLabel(
"fpYesOrNo",
detail.specialPovertySupport
)
}}
</el-form-item>
</div>
<ai-avatar
:instance="instance"
v-model="detail.photo"
:editable="false"
/>
</div>
<el-form-item label="健康状况">{{
dict.getLabel("fpHealth", detail.healthyStatus)
}}</el-form-item>
</template>
</ai-card>
<ai-card title="联络信息">
<template slot="content">
<el-form-item label="联系方式" prop="phone">{{
detail.phone
}}</el-form-item>
<el-form-item label="现住址">{{
currentFullAddress
}}</el-form-item>
</template>
</ai-card>
<ai-card title="家庭情况">
<template slot="content">
<div flex class="half wrap">
<el-form-item label="档案状态">{{
dict.getLabel("fpType", detail.objectType)
}}</el-form-item>
<el-form-item label="监测对象类型">{{
dict.getLabel("fpType", detail.objectType)
}}</el-form-item>
<el-form-item label="是否危房">
{{
dict.getLabel("fpYesOrNo", detail.dilapidatedHousehold)
}}
</el-form-item>
<el-form-item label="是否饮用水安全">
{{
dict.getLabel("fpYesOrNo", detail.drinkingWaterSafety)
}}
</el-form-item>
<el-form-item label="是否搬迁">{{
dict.getLabel("fpYesOrNo", detail.move)
}}</el-form-item>
<el-form-item label="风险因素">{{
dict.getLabel("fpYesOrNo", detail.move)
}}</el-form-item>
<el-form-item label="风险消除方式">{{
dict.getLabel("fpYesOrNo", detail.move)
}}</el-form-item>
</div>
</template>
</ai-card>
<template>
<!-- v-if="/[123]/.test(detail.status)" -->
<ai-card title="收入情况(单位:元)">
<template slot="content">
<div flex class="half wrap">
<el-form-item label="工资收入">{{
detail.income1
}}</el-form-item>
<el-form-item label="生产经营收入">{{
detail.income2
}}</el-form-item>
<el-form-item label="财产性收入">{{
detail.income3
}}</el-form-item>
<el-form-item label="转移性收入">{{
detail.income4
}}</el-form-item>
<el-form-item label="理赔收入">{{
detail.income5
}}</el-form-item>
<el-form-item label="生产经营支出">{{
detail.income6
}}</el-form-item>
<el-form-item label="合规自然支出">{{
detail.income7
}}</el-form-item>
<el-form-item label="家庭人均纯收入">{{
detail.income8
}}</el-form-item>
</div>
</template>
</ai-card>
<!-- <ai-card title="帮扶情况">
<template slot="content">
<div flex class="half wrap">
<el-form-item label="产业帮扶">{{
dict.getLabel('fpIndustrialAssistance', detail.industrialAssistance)
}}
</el-form-item>
<el-form-item label="健康帮扶">{{
dict.getLabel('fpHealthAssistance', detail.healthAssistance)
}}
</el-form-item>
<el-form-item label="就业帮扶">{{
dict.getLabel('fpEmploymentAssistance', detail.employmentAssistance)
}}
</el-form-item>
<el-form-item label="教育帮扶">
{{ dict.getLabel('fpEducationalAssistance', detail.educationalAssistance) }}
</el-form-item>
<el-form-item label="金融帮扶">{{
dict.getLabel('fpFnancialAssistance', detail.financialAssistance)
}}
</el-form-item>
<el-form-item label="社会帮扶">{{
dict.getLabel('fpSocialAssistance', detail.socialAssistance)
}}
</el-form-item>
<el-form-item label="公益岗帮扶">
{{ dict.getLabel('fpPublicWelfarePostAssistance', detail.publicWelfarePostAssistance) }}
</el-form-item>
<el-form-item label="是否风险消除">{{
dict.getLabel('fpYesOrNo', detail.riskEliminated)
}}
</el-form-item>
<el-form-item label="风险消除日期">{{ detail.riskEliminatedTime }}</el-form-item>
</div>
</template>
</ai-card> -->
<ai-card title="家庭成员">
<template #right>
<span
style="
color: #2266ff;
margin-left: 16px;
cursor: pointer;
font-size: 12px;
"
@click="addFamily()"
>添加</span
>
</template>
<template #content>
<ai-table
:tableData="detail.family"
:colConfigs="colConfigs"
:dict="dict"
:isShowPagination="false"
>
<el-table-column
slot="options"
label="操作"
align="center"
width="200px"
>
<template slot-scope="{ row }">
<el-button type="text" @click="viewFamily(row)"
>详情</el-button
>
<el-button type="text" @click="addFamily(row)"
>编辑</el-button
>
<el-button type="text" @click="delFamily(row)"
>删除</el-button
>
</template>
</el-table-column>
</ai-table>
</template>
</ai-card>
</template>
</el-tab-pane>
<el-tab-pane label="走访日志" lazy name="HrLog">
<hr-log
v-if="currentTab == 'HrLog'"
:instance="instance"
:dict="dict"
:permissions="permissions"
/>
</el-tab-pane>
<el-tab-pane label="帮扶措施" lazy name="HrMeasure">
<hr-measure
v-if="currentTab == 'HrMeasure'"
:instance="instance"
:dict="dict"
:permissions="permissions"
/>
</el-tab-pane>
</el-tabs>
</el-form>
<ai-dialog
:visible.sync="isShowAdd"
width="1000px"
height="500px"
title="添加家庭成员"
@close="onClose"
@onConfirm="onConfirm"
>
<el-form
:model="form"
ref="ruleForm"
:rules="rules"
label-width="130px"
label-position="right"
size="small"
>
<div flex class="half wrap">
<div flex class="column">
<el-form-item label="姓名" prop="name">
<el-input
size="small"
class="user-selecter"
v-model="form.name"
placeholder="请输入姓名"
clearable
:disabled="isEdit"
>
<template slot="append">
<ai-person-select
:instance="instance"
@selectPerson="checkName"
>
</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"
@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="phone">
<el-input
v-model="form.phone"
placeholder="请输入联系方式"
:maxlength="11"
show-word-limit
/>
</el-form-item>
<el-form-item label="与户主关系" prop="householdRelation">
<ai-select
v-model="form.householdRelation"
:selectList="dict.getDict('fpRelationship')"
/>
</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="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>
</el-form>
</ai-dialog>
<ai-dialog
:visible.sync="isShowDetail"
width="1000px"
height="500px"
title="家庭成员详情"
>
<el-form
:model="detail"
label-width="130px"
label-position="right"
size="small"
>
<div flex class="flex-start">
<div flex class="half wrap fill">
<el-form-item label="身份证号" prop="name">{{
detail.idNumber
}}</el-form-item>
<el-form-item label="性别" prop="sex">{{
dict.getLabel("sex", detail.sex)
}}</el-form-item>
<el-form-item label="出生日期">{{
detail.birthDate
}}</el-form-item>
<el-form-item label="年龄" prop="age">{{
detail.age
}}</el-form-item>
<el-form-item label="联系方式">{{detail.phone}}</el-form-item>
<el-form-item label="与户主关系">{{
dict.getLabel("fpRelationship", detail.householdRelation)
}}</el-form-item>
<el-form-item label="文化程度">{{
dict.getLabel("fpEducation", detail.education)
}}</el-form-item>
<el-form-item label="民族">{{
dict.getLabel("fpNation", detail.nation)
}}</el-form-item>
<el-form-item label="政治面貌"
>{{
dict.getLabel("fpPoliticalOutlook", detail.politicsStatus)
}}
</el-form-item>
<el-form-item label="在校生状况"
>{{ dict.getLabel("fpStudentsInSchool", detail.schoolStatus) }}
</el-form-item>
<el-form-item label="务工时间(月)" prop="idNumber">{{
detail.workeMonths
}}</el-form-item>
<el-form-item label="劳动技能"
>{{ dict.getLabel("fpLaborSkills", detail.labourStatus) }}
</el-form-item>
<el-form-item label="务工区域" prop="idNumber">{{
detail.workArea
}}</el-form-item>
<el-form-item label="是否参加大病保险"
>{{
dict.getLabel("fpYesOrNo", detail.seriousIllnessInsurance)
}}
</el-form-item>
<el-form-item label="是否参加基本医保"
>{{ dict.getLabel("fpYesOrNo", detail.basicMedicalTreatment) }}
</el-form-item>
<el-form-item label="享受最低生活保障"
>{{ dict.getLabel("fpYesOrNo", detail.subsistenceAllowance) }}
</el-form-item>
<el-form-item label="是否参加养老保险"
>{{ dict.getLabel("fpYesOrNo", detail.endowmentInsurance) }}
</el-form-item>
<el-form-item label="是否特困供养"
>{{ dict.getLabel("fpYesOrNo", detail.specialPovertySupport) }}
</el-form-item>
</div>
<ai-avatar
:instance="instance"
v-model="detail.photo"
:editable="false"
/>
</div>
<el-form-item label="现住址">{{
currentFullAddress
}}</el-form-item>
<el-form-item label="健康状况">{{
currentFullAddress
}}</el-form-item>
</el-form>
</ai-dialog>
</template>
</ai-detail>
</section>
</template>
<script>
import { mapState } from "vuex";
import HrMeasure from "./detail/hrMeasure";
import HrLog from "./detail/hrLog";
export default {
name: "hrDetail",
components: { HrLog, HrMeasure },
props: {
instance: Function,
dict: Object,
permissions: Function,
},
computed: {
...mapState(["user"]),
colConfigs() {
return [
{
label: "与户主关系",
prop: "householdRelation",
dict: "fpRelationship",
},
{ label: "姓名", prop: "name" },
{ label: "性别", prop: "sex", dict: "sex" },
{ label: "年龄", prop: "age" },
{
label: "身份证号",
render: (h, { row }) =>
h("p", null, this.idCardNoUtil.hideId(row.idNumber)),
},
{ slot: "options" },
];
},
isGridAdmin() {
return this.user.info.girdCheckType == 2;
},
currentFullAddress() {
let { countyName, townName, villageName, currentAddress } = this.detail;
return [countyName, townName, villageName, currentAddress].join("");
},
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: "请选择户主身份证号" }],
};
},
rootArea() {
return this.user.info?.areaId?.replace(/(\d{6})\d+/g, '$1' + Array(7).join("0")) || ""
}
},
data() {
return {
detail: {},
currentTab: "",
isShowAdd: false,
form: {},
isEdit: false,
isShowDetail: false,
familyInfo: {}
};
},
methods: {
checkName(e) {
// this.formData.name = e.name
// this.formData.idNumber = e.idNumber
// this.formData.phone = e.phone
// this.formData.areaId = e.householdAreaId
},
addFamily(row) {
this.form = { ...row }
this.isShowAdd = true
},
viewFamily(row) {
this.familyInfo = {...row}
this.isShowDetail = true
},
delFamily() {},
handleIdNumberAutocomplete(v) {
let { birthday: birthDate, sex } = this.idCardNoUtil.getIdCardInfo(v);
this.form = { ...this.form, birthDate, sex, age: this.$calcAge(v) };
},
onConfirm() {
this.$refs.ruleForm.validate((v) => {
if (v) {
// if (this.form.isHousehold == 1) {
// this.form.householdIdNumber = this.form.idNumber
// }
// this.instance.post(`/app/apppreventionreturntopoverty/addOrUpdate`, this.form).then(res => {
// if (res.code == 0) {
// this.$message.success('提交成功!');
// this.back()
// }
// })
}
});
},
onClose() {
this.isShow = false;
},
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) {
this.detail = res.data;
this.detail.family?.map((e) => {
e.householdRelation = e.householdRelation || "户主";
});
}
});
},
gotoEdit() {
let { query } = this.$route;
this.$router.push({ query, hash: "#add" });
},
handleDelete(ids) {
this.$confirm("是否要删除监测对象")
.then(() => {
this.instance
.post("/app/apppreventionreturntopoverty/delete", null, {
params: { ids: ids?.toString() },
})
.then((res) => {
if (res?.code == 0) {
this.$message.success("删除成功!");
this.back();
}
});
})
.catch(() => 0);
},
handleAccept(pass) {
let msg =
pass == 0
? "是否驳回纳入监测对象申请?"
: `是否${isNaN(pass) ? "(申请)" : ""}纳入监测对象?`,
{ id } = this.detail;
this.$confirm(msg)
.then(() => {
this.instance
.post("/app/apppreventionreturntopoverty/examine", null, {
params: { pass, id },
})
.then((res) => {
if (res?.code == 0) {
this.$message.success("审批提交成功!");
this.back();
}
});
})
.catch(() => 0);
},
handleRelieve(pass) {
let { id } = this.detail,
msg =
pass == 0
? `是否继续监测对象`
: `是否${isNaN(pass) ? "(申请)" : ""}解除监测对象`;
this.$confirm(msg)
.then(() => {
this.instance
.post("/app/apppreventionreturntopoverty/relieve", null, {
params: { pass, id },
})
.then((res) => {
if (res?.code == 0) {
this.$message.success("审批提交成功!");
this.back();
}
});
})
.catch(() => 0);
},
},
created() {
this.getDetail();
},
};
</script>
<style lang="scss" scoped>
.hrDetail {
height: 100%;
.flex-start {
align-items: flex-start;
.AiAvatar {
margin-left: 20px;
}
}
.half {
align-items: flex-start;
& > .el-form-item,
& > div {
width: 50%;
.el-form-item {
width: 100%;
}
}
}
::v-deep.el-tabs__content {
max-height: calc(100vh - 136px);
overflow-y: auto;
}
}
</style>