kubbo/dvcp_v2_wxcp_app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

居民档案

Browse Source
This commit is contained in:
yanran200730
2022-08-09 10:59:46 +08:00
parent 0d1999e553
commit 8f6d53fa7d
2 changed files with 381 additions and 112 deletions
Download Patch File Download Diff File Expand all files Collapse all files

160
src/project/saas/AppResidentDocument/DetailPeople.vue
View File

@@ -1,6 +1,27 @@
<template>
<div class="DetailPeople" v-if="pageShow">
<div class="top">
<image src="./components/img/4.png" />
<div class="top-right">
<div class="top-right__top">
<div class="left">
<h2>卓作旺</h2>
<i>已注销</i>
</div>
<span>户主</span>
</div>
<div class="top-right__bottom">
<span>退役军人</span>
<span>退役军人</span>
<span>退役军人</span>
<span>退役军人</span>
<span>退役军人</span>
<span>退役军人</span>
<span>退役军人</span>
</div>
</div>
</div>
<!-- <div class="top">
<div class="photos">
<img :src="data.resident.photo" alt="" v-if="data.resident && data.resident.photo" />
<img src="./components/img/44.png" alt="" v-else />
@@ -17,7 +38,7 @@
<div class="rightBottom" v-if="data.resident && data.resident.phone">{{ data.resident.phone }}</div>
</div>
</div>
</div> -->
<div class="line"></div>
<div class="middle">
<div class="hint">个人基本信息</div>
@@ -134,48 +155,67 @@
background: #fff;
.top {
display: flex;
padding: 48px 32px 32px 32px;
.photos {
img {
width: 112px;
height: 112px;
border-radius: 50%;
}
align-items: center;
padding: 48px 32px 32px;
background: #fff;
& > image {
width: 112px;
height: 112px;
margin-right: 24px;
border-radius: 50%;
}
.right {
display: flex;
flex-direction: column;
width: 100%;
margin-left: 24px;
.rightTop {
.top-right {
flex: 1;
.top-right__bottom {
display: flex;
justify-content: space-between;
.fileStatuss {
display: inline-block;
margin-left: 30px;
color: #ff4466;
background: #ffecef;
border-radius: 8px;
width: 120px;
height: 40px;
line-height: 40px;
text-align: center;
font-weight: 400;
font-size: 28px;
}
.names {
font-size: 32px;
font-weight: 600;
}
.householdNames {
margin-left: 30px;
font-size: 26px;
font-weight: 500;
color: #5aad6a;
align-items: center;
flex-wrap: wrap;
color: #999999;
font-size: 28px;
span {
line-height: 1.4;
margin-right: 16px;
}
}
.rightBottom {
margin-top: 16px;
.top-right__top {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 16px;
& > span {
color: #5AAD6A;
font-size: 32px;
}
.left {
display: flex;
align-items: center;
h2 {
margin-right: 16px;
color: #333;
font-size: 36px;
font-weight: 700;
}
i {
width: 88px;
height: 40px;
line-height: 40px;
text-align: center;
background: #FFECEF;
border-radius: 8px;
color: #FF4466;
font-size: 24px;
font-style: normal;
}
}
}
}
}
@@ -190,30 +230,38 @@
padding: 0 32px;
.hint {
padding: 32px 0;
height: 108px;
line-height: 108px;
font-weight: 700;
font-size: 32px;
color: #333333;
}
.contents {
.item {
display: flex;
justify-content: space-between;
padding: 14px 0;
.item {
display: flex;
line-height: 1.3;
padding: 14px 0;
font-size: 32px;
.phones {
color: #3d94fb;
}
.phones {
color: #3d94fb;
}
span {
width: 180px;
margin-right: 20rpx;
}
span {
width: 190px;
flex-shrink: 1;
color: #999;
}
i {
flex: 1;
text-align: right;
font-style: normal;
i {
flex: 1;
margin-left: 16px;
text-align: right;
color: #333;
font-style: normal;
}
}
}
}
}