监测对象界面完成

This commit is contained in:
aixianling
2022-03-24 18:22:55 +08:00
parent 8abfcb0e55
commit 40efa96ba1
4 changed files with 604 additions and 0 deletions

View File

@@ -0,0 +1,57 @@
<template>
<section class="AppHelpedResident">
<component :is="currentComponent" :instance="instance" :dict="dict" :permissions="permissions"/>
</section>
</template>
<script>
import HrAdd from "./hrAdd";
import HrDetail from "./hrDetail";
import HrList from "./hrList";
export default {
name: "AppHelpedResident",
components: {HrList, HrDetail, HrAdd},
label: "监测对象(防返贫帮扶对象)",
props: {
instance: Function,
dict: Object,
permissions: Function
},
computed: {
currentComponent() {
return this.$route.hash == "#add" ? HrAdd :
this.$route.query.id ? HrDetail : HrList
}
},
created() {
this.dict.load('residentType', "sex", "faithType", "fileStatus",
"legality",
"education",
"maritalStatus",
"politicsStatus",
"householdName",
"nation",
"liveReason",
"certificateType",
"job",
"militaryStatus",
"householdRelation",
"logoutReason",
"nation",
"registerStatus",
"residentTipType",
"liveCategory",
"livePeriod",
"language",
"nationality")
}
}
</script>
<style lang="scss" scoped>
.AppHelpedResident {
height: 100%;
}
</style>

View File

@@ -0,0 +1,213 @@
<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/>
</el-form-item>
<el-form-item label="身份证号" prop="idNumber">
<el-input v-model="form.idNumber" placeholder="请输入身份证号" :maxlength="18"
@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="birthday">
<el-date-picker disabled value-format="yyyy-MM-dd HH:mm:ss" format="yyyy-MM-dd"
v-model="form.birthday" 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('education')"/>
</el-form-item>
<el-form-item label="民族" prop="nation">
<ai-select v-model="form.nation" :selectList="dict.getDict('nation')"/>
</el-form-item>
<el-form-item label="政治面貌" prop="politicsStatus">
<ai-select v-model="form.politicsStatus" :selectList="dict.getDict('politicsStatus')"/>
</el-form-item>
<el-form-item label="在校生状况" prop="job">
<ai-select v-model="form.job" :selectList="dict.getDict('job')"/>
</el-form-item>
<el-form-item label="健康状况" prop="faithType">
<ai-select v-model="form.faithType" :selectList="dict.getDict('faithType')"/>
</el-form-item>
<el-form-item label="务工时间(月)" prop="idNumber">
<el-input v-model="form.idNumber" placeholder="请输入" clearable/>
</el-form-item>
<el-form-item label="劳动技能" prop="maritalStatus">
<ai-select v-model="form.maritalStatus" :selectList="dict.getDict('maritalStatus')"/>
</el-form-item>
<el-form-item label="务工区域" prop="idNumber">
<el-input v-model="form.idNumber" placeholder="请输入" clearable maxlength="30" show-word-limit/>
</el-form-item>
<el-form-item label="是否参加大病保险" prop="militaryStatus">
<ai-select v-model="form.militaryStatus" :selectList="dict.getDict('yesOrNo')"/>
</el-form-item>
<el-form-item label="是否参加基本医保" prop="militaryStatus">
<ai-select v-model="form.militaryStatus" :selectList="dict.getDict('yesOrNo')"/>
</el-form-item>
<el-form-item label="是否参加基本医保" prop="militaryStatus">
<ai-select v-model="form.militaryStatus" :selectList="dict.getDict('militaryStatus')"/>
</el-form-item>
<el-form-item label="享受最低生活保障" prop="militaryStatus">
<ai-select v-model="form.militaryStatus" :selectList="dict.getDict('militaryStatus')"/>
</el-form-item>
<el-form-item label="是否参加养老保险" prop="militaryStatus">
<ai-select v-model="form.militaryStatus" :selectList="dict.getDict('militaryStatus')"/>
</el-form-item>
<el-form-item label="是否特困供养" prop="militaryStatus">
<ai-select v-model="form.militaryStatus" :selectList="dict.getDict('militaryStatus')"/>
</el-form-item>
</div>
</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-select :instance="instance" v-model="form.currentAreaId"/>
<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="householdName">
<ai-select v-model="form.householdName" :selectList="dict.getDict('householdName')"
@change="form.householdRelation=null"/>
</el-form-item>
<template v-if="form.householdName==1">
<el-form-item label="监测对象类型" prop="militaryStatus">
<ai-select v-model="form.militaryStatus" :selectList="dict.getDict('militaryStatus')"/>
</el-form-item>
<el-form-item label="是否危房" prop="militaryStatus">
<ai-select v-model="form.militaryStatus" :selectList="dict.getDict('militaryStatus')"/>
</el-form-item>
<el-form-item label="是否饮用水安全" prop="militaryStatus">
<ai-select v-model="form.militaryStatus" :selectList="dict.getDict('militaryStatus')"/>
</el-form-item>
<el-form-item label="是否搬迁" prop="militaryStatus">
<ai-select v-model="form.militaryStatus" :selectList="dict.getDict('militaryStatus')"/>
</el-form-item>
</template>
<template v-if="form.householdName==0">
<el-form-item label="与户主关系" prop="householdRelation">
<ai-select v-model="form.householdRelation" :selectList="dict.getDict('householdRelation')"/>
</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>
</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>
export default {
name: "hrAdd",
props: {
instance: Function,
dict: Object,
permissions: Function
},
computed: {
addTitle() {
return !!this.$route.query.id ? "编辑检测对象" : "添加检测对象"
},
rules() {
return {
idNumber: [{required: true, message: "请输入身份证号"}],
name: [{required: true, message: "请输入姓名"}],
sex: [{required: true, message: "请选择性别"}],
currentAreaId: [{required: true, message: "请选择户籍地"}],
householdName: [{required: true, message: "请选择是否户主"}],
}
}
},
data() {
return {
form: {}
}
},
methods: {
back() {
this.$router.push({})
},
getDetail() {
let {id} = this.$route.query
id && this.instance.post("/appportaluserenterprise/queryDetailById", null, {
params: {id}
}).then(res => {
if (res?.data) {
this.form = res.data
}
})
},
handleIdNumberAutocomplete(v) {
let {birthday, sex} = this.idCardNoUtil.getIdCardInfo(v)
this.form = {...this.form, birthday, sex}
},
submit() {
this.$refs.ruleForm.validate(v => {
if (v) {
}
})
}
},
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%;
}
}
</style>

View File

@@ -0,0 +1,136 @@
<template>
<section class="hrDetail">
<ai-detail>
<ai-title slot="title" title="监测对象详情" isShowBottomBorder isShowBack @onBackClick="back"/>
<template #content>
<el-form :model="detail" label-width="130px" label-position="right" size="small">
<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="出生日期" prop="birthday">{{ detail.birthday }}</el-form-item>
<el-form-item label="年龄" prop="age">{{ detail.age }}</el-form-item>
<el-form-item label="文化程度">{{ dict.getLabel('education', detail.education) }}</el-form-item>
<el-form-item label="民族">{{ dict.getLabel('nation', detail.nation) }}</el-form-item>
<el-form-item label="政治面貌">{{ dict.getLabel('politicsStatus', detail.politicsStatus) }}</el-form-item>
<el-form-item label="在校生状况">{{ dict.getLabel('education', detail.education) }}</el-form-item>
<el-form-item label="健康状况">{{ dict.getLabel('education', detail.education) }}</el-form-item>
<el-form-item label="务工时间(月)" prop="idNumber">{{ detail.education }}</el-form-item>
<el-form-item label="劳动技能">{{ dict.getLabel('education', detail.education) }}</el-form-item>
<el-form-item label="务工区域" prop="idNumber">{{ detail.education }}</el-form-item>
<el-form-item label="是否参加大病保险">{{ dict.getLabel('yesOrNo', detail.education) }}</el-form-item>
<el-form-item label="是否参加基本医保">{{ dict.getLabel('yesOrNo', detail.education) }}</el-form-item>
<el-form-item label="享受最低生活保障">{{ dict.getLabel('yesOrNo', detail.education) }}</el-form-item>
<el-form-item label="是否参加养老保险">{{ dict.getLabel('yesOrNo', detail.education) }}</el-form-item>
<el-form-item label="是否特困供养">{{ dict.getLabel('yesOrNo', detail.education) }}</el-form-item>
</div>
<ai-avatar :instance="instance" v-model="detail.photo" :editable="false"/>
</div>
</template>
</ai-card>
<ai-card title="联络信息">
<template slot="content">
<el-form-item label="联系方式" prop="phone">{{ detail.phone }}</el-form-item>
<el-form-item label="现住址">{{ detail.currentAreaName }}{{ detail.currentAddress }}</el-form-item>
</template>
</ai-card>
<ai-card title="家庭情况">
<template slot="content">
<div flex class="half wrap">
<el-form-item label="是否户主" prop="householdName">
{{ dict.getLabel('householdName', detail.householdName) }}
</el-form-item>
<template v-if="detail.householdName==1">
<el-form-item label="监测对象类型" prop="militaryStatus">
{{ dict.getLabel('householdName', detail.householdName) }}
</el-form-item>
<el-form-item label="是否危房" prop="militaryStatus">
{{ dict.getLabel('yesOrNo', detail.householdName) }}
</el-form-item>
<el-form-item label="是否饮用水安全" prop="militaryStatus">
{{ dict.getLabel('yesOrNo', detail.householdName) }}
</el-form-item>
<el-form-item label="是否搬迁" prop="militaryStatus">
{{ dict.getLabel('yesOrNo', detail.householdName) }}
</el-form-item>
</template>
<template v-if="detail.householdName==0">
<el-form-item label="与户主关系">
{{ dict.getLabel('householdRelation', detail.householdRelation) }}
</el-form-item>
<el-form-item label="户主身份证号">{{ detail.householdIdNumber }}</el-form-item>
</template>
</div>
</template>
</ai-card>
</el-form>
</template>
</ai-detail>
</section>
</template>
<script>
export default {
name: "hrDetail",
props: {
instance: Function,
dict: Object,
permissions: Function
},
data() {
return {
detail: {}
}
},
methods: {
back() {
this.$router.push({})
},
getDetail() {
let {id} = this.$route.query
id && this.instance.post("/appportaluserenterprise/queryDetailById", null, {
params: {id}
}).then(res => {
if (res?.data) {
this.detail = res.data
}
})
},
},
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%;
}
}
}
.el-date-editor {
width: 100%;
}
}
</style>

View File

@@ -0,0 +1,198 @@
<template>
<section class="hrList">
<ai-list>
<ai-title slot="title" title="监测对象" isShowBottomBorder isShowArea v-model="search.areaId" :instance="instance"
@change="page.current=1,getTableData()">
<template #rightBtn>
<el-button type="primary" icon="iconfont iconSetting" @click="dialog=true">预警规则</el-button>
</template>
</ai-title>
<template #content>
<ai-search-bar>
<template #left>
<ai-select placeholder="档案状态" v-model="search.fileStatus"
:selectList="dict.getDict('fileStatus')"
@change="page.current=1,getTableData()"/>
<ai-select placeholder="性别" v-model="search.sex"
:selectList="dict.getDict('sex')"
@change="page.current=1,getTableData()"/>
<ai-select placeholder="文化程度" v-model="search.education"
:selectList="dict.getDict('education')"
@change="page.current=1,getTableData()"/>
<ai-select placeholder="民族" v-model="search.nation"
:selectList="dict.getDict('nation')"
@change="page.current=1,getTableData()"/>
<el-date-picker
value-format="yyyy-MM-dd HH:mm:ss"
v-model="search.birthStart"
type="date"
size="small"
unlink-panels
placeholder="选择出生开始日期"
@change="page.current=1,getTableData()"
/>
<el-date-picker
value-format="yyyy-MM-dd HH:mm:ss"
v-model="search.birthEnd"
type="date"
size="small"
placeholder="选择出生结束日期"
unlink-panels
@change="page.current=1,getTableData()"
/>
<ai-select placeholder="政治面貌" v-model="search.politicsStatus" :selectList="dict.getDict('politicsStatus')"
@change="page.current=1,getTableData()"/>
<ai-select placeholder="是否户主" v-model="search.householdName"
:selectList="dict.getDict('householdName')"
@change="page.current=1,getTableData()"/>
</template>
<template #right>
<el-input size="small" placeholder="姓名/身份证/联系方式" v-model="search.con" clearable
@change="page.current=1,getTableData()"/>
</template>
</ai-search-bar>
<ai-search-bar>
<template #left>
<el-button type="primary" icon="iconfont iconAdd" @click="showEdit()">添加</el-button>
<el-button icon="iconfont iconDelete" :disabled="!ids.length" @click="handleDelete(ids)">删除</el-button>
</template>
<template #right>
<ai-import :instance="instance" name="核酸检测信息" title="导入核酸检测信息"
suffixName="xlsx"
url="/app/appnucleicacidperson/downloadTemplate"
importUrl="/app/appnucleicacidperson/import"
@onSuccess="page.current=1,search={},getTableData()"/>
<ai-download url="/app/appnucleicacidperson/export" :params="{...search,ids:ids.toString()}"
:instance="instance" fileName="核酸检测信息导出文件"/>
</template>
</ai-search-bar>
<ai-table :tableData="tableData" :total="page.total" :current.sync="page.current" :size.sync="page.size"
@getList="getTableData" :col-configs="colConfigs" :dict="dict"
@selection-change="v=>ids=v.map(e=>e.id)">
<el-table-column slot="idNumber" label="身份证号" show-overflow-tooltip align="center">
<template slot-scope="{row}">
<ai-id mode="show" v-model="row.idNumber" :showEyes="false"/>
</template>
</el-table-column>
<el-table-column slot="fileStatus" label="档案状态" show-overflow-tooltip align="center">
<template slot-scope="scope">
<span v-if="scope.row.fileStatus==0" style="color:rgba(46,162,34,1);">正常</span>
<span v-if="scope.row.fileStatus==1" style="color:rgba(153,153,153,1);">已注销</span>
</template>
</el-table-column>
<el-table-column slot="options" label="操作" fixed="right" align="center">
<template slot-scope="{row}">
<el-button type="text" @click="showDetail(row.id)">详情</el-button>
<el-button type="text" @click="handleDelete(row.id)">删除</el-button>
</template>
</el-table-column>
</ai-table>
</template>
</ai-list>
<ai-dialog :visible.sync="dialog" title="预警规则设置" @closed="form={}" @onConfirm="submitDialog" width="600px">
<el-form :model="form" :rules="rules" ref="DialogForm" size="small" label-width="160px">
<el-form-item label="家庭纯收入标准" prop="type0">
<el-input v-model.number="form.type0" placeholder="请输入" maxlength="8" show-word-limit/>
</el-form-item>
<el-form-item label="家庭人均纯收入标准" prop="type1">
<el-input v-model.number="form.type1" placeholder="请输入" maxlength="8" show-word-limit/>
</el-form-item>
</el-form>
</ai-dialog>
</section>
</template>
<script>
import {mapState} from "vuex";
export default {
name: "hrList",
props: {
instance: Function,
dict: Object,
permissions: Function
},
computed: {
...mapState(['user'])
},
data() {
return {
search: {name: ""},
page: {current: 1, size: 10, total: 0},
tableData: [],
colConfigs: [
{type: 'selection'},
{label: "姓名", prop: "name", align: "center"},
{label: "性别", prop: "sex", dict: 'sex', align: "center"},
{slot: "idNumber"},
{label: "年龄", prop: "age", align: "center"},
{label: "民族", prop: "nation", align: "center", dict: "nation"},
{label: "文化程度", prop: "education", align: "center", dict: "education"},
{label: "政治面貌", prop: "politicsStatus", align: "center", dict: "politicsStatus"},
{slot: "fileStatus"},
{slot: "options"}
],
ids: [],
dialog: false,
form: {},
rules: {
type0: [{required: true, message: "请输入家庭纯收入标准", trigger: "change"}],
type1: [{required: true, message: "请输入家庭人均纯收入标准", trigger: "change"}],
}
}
},
methods: {
getTableData() {
this.instance.post("/appportaluserenterprise/list", null, {
params: {...this.page, ...this.search, status: 1}
}).then(res => {
if (res?.data) {
this.tableData = res.data?.records
this.page.total = res.data.total
}
})
},
showEdit(id) {
this.$router.push({query: {id}, hash: "#add"})
},
showDetail(id) {
this.$router.push({query: {id}})
},
handleDelete(ids) {
this.$confirm("是否要删除监测对象").then(() => {
this.instance.post("/app/appnucleicacidperson/delete", null, {
params: {ids: ids?.toString()}
}).then(res => {
if (res?.code == 0) {
this.$message.success("删除成功!")
this.getTableData()
}
})
}).catch(() => 0)
},
submitDialog() {
this.$refs.DialogForm.validate(v => {
if (v) {
this.instance.post(`/app/apppreventionreturntopovertyalarmconfig/addOrUpdate`, this.form).then(res => {
if (res.code == 0) {
this.$message.success('预警规则设置成功');
this.getTableData()
this.dialog = false
}
})
}
})
}
},
created() {
this.search.areaId = this.user.info.areaId
this.getTableData()
}
}
</script>
<style lang="scss" scoped>
.hrList {
height: 100%;
}
</style>