130 lines
4.1 KiB
Vue
130 lines
4.1 KiB
Vue
<template>
|
|
<section class="document">
|
|
<div class="card">
|
|
<div class="info">
|
|
<u-image border-radius="4" :src="top.detail.avatar" width="118" height="118" />
|
|
<div class="fill">
|
|
<b>{{ top.detail.realName || top.detail.name }}</b>
|
|
<u-row>
|
|
<span class="idNumber" v-html="IDObj.id" />
|
|
<a @tap="showID = !showID">{{ IDObj.btn }}</a>
|
|
</u-row>
|
|
</div>
|
|
</div>
|
|
<AiCell label="性别">{{ $dict.getLabel('sex', resident.sex) || '-' }}</AiCell>
|
|
<AiCell label="出生日期">{{ resident.birthDate }}</AiCell>
|
|
<AiCell label="年龄">{{ resident.age }}</AiCell>
|
|
<AiCell label="籍贯">{{ resident.birthplaceAreaName }}</AiCell>
|
|
<AiCell label="民族">{{ $dict.getLabel('nation', resident.nation) || '-' }}</AiCell>
|
|
<AiCell label="文化程度">{{ $dict.getLabel('education', resident.education) || '-' }}</AiCell>
|
|
<AiCell label="兵役状况">{{ $dict.getLabel('militaryStatus', resident.militaryStatus) || '-' }}</AiCell>
|
|
<AiCell label="政治面貌">{{ $dict.getLabel('politicsStatus', resident.politicsStatus) || '-' }}</AiCell>
|
|
<AiCell label="职业">{{ $dict.getLabel('job', resident.job) || '-' }}</AiCell>
|
|
<AiCell label="宗教信仰">{{ $dict.getLabel('faithType', resident.faithType) || '-' }}</AiCell>
|
|
</div>
|
|
<div class="card">
|
|
<AiCell title label="联络信息" />
|
|
<AiCell label="联系方式">{{ resident.phone }}</AiCell>
|
|
<AiCell label="现住址">{{ resident.currentAreaName + resident.currentAddress }}</AiCell>
|
|
</div>
|
|
<div class="card">
|
|
<AiCell title label="家庭信息" />
|
|
<AiCell label="是否户主">{{ $dict.getLabel('householdName', resident.householdName) || '-' }}</AiCell>
|
|
<AiCell label="与户主关系">{{ $dict.getLabel('householdRelation', resident.householdRelation) || '-' }}</AiCell>
|
|
<AiCell label="现住址">{{ resident.householdAreaName + resident.householdAddress }}</AiCell>
|
|
</div>
|
|
<div class="card">
|
|
<AiCell title label="家庭成员" />
|
|
<AiTable :data="family" :colConfigs="colConfigs" />
|
|
</div>
|
|
</section>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'document',
|
|
inject: ['top'],
|
|
computed: {
|
|
IDObj() {
|
|
return this.showID
|
|
? {
|
|
id: this.resident?.idNumber,
|
|
btn: '隐藏',
|
|
}
|
|
: {
|
|
id: this.resident?.idNumber?.replace(/(\d{10}).+/g, '$1******'),
|
|
btn: '显示',
|
|
}
|
|
},
|
|
colConfigs() {
|
|
return [
|
|
{ label: '与户主关系', prop: 'householdRelation', width: '160rpx', dict: 'householdRelation' },
|
|
{ label: '姓名', prop: 'name', width: '120rpx' },
|
|
{ label: '性别', prop: 'sex', dict: 'sex' },
|
|
{ label: '年龄', prop: 'age' },
|
|
{ label: '身份证号', prop: 'idNumber', width: '320rpx' },
|
|
]
|
|
},
|
|
resident() {
|
|
let obj = {}
|
|
Object.keys(this.top.detail?.residentInfo?.resident || {}).map((e) => {
|
|
obj[e] = this.top.detail?.residentInfo?.resident[e] || ''
|
|
})
|
|
return obj
|
|
},
|
|
family() {
|
|
return this.top.detail?.residentInfo?.family?.map((e) => ({ ...e, householdRelation: e.householdRelation || '户主' }))
|
|
},
|
|
},
|
|
data() {
|
|
return {
|
|
showID: false,
|
|
familyList: [],
|
|
}
|
|
},
|
|
onLoad() {
|
|
uni.setNavigationBarTitle({ title: '居民详情' })
|
|
this.$dict.load('sex', 'nation', 'education', 'job', 'faithType', 'politicsStatus', 'militaryStatus', 'householdRelation', 'householdName')
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.document {
|
|
overflow-y: auto;
|
|
background: #f5f5f5;
|
|
|
|
.info {
|
|
height: 186px;
|
|
width: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.fill {
|
|
color: #3c7fc8;
|
|
margin-left: 24px;
|
|
font-size: 28px;
|
|
line-height: 40px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
|
|
b {
|
|
font-size: 36px;
|
|
color: #333;
|
|
margin-bottom: 8px;
|
|
line-height: 50px;
|
|
}
|
|
|
|
a {
|
|
cursor: pointer;
|
|
}
|
|
|
|
.idNumber {
|
|
margin-right: 16px;
|
|
color: #999;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|