This commit is contained in:
liuye
2023-07-12 10:49:37 +08:00
parent 2e69a79bce
commit 56a9b9871c
3 changed files with 161 additions and 138 deletions

View File

@@ -1,29 +1,29 @@
<template>
<div class="page">
<div class="credit-points">
<div class="bg-blue"></div>
<div class="header-content">
<div class="title">家庭地址</div>
<div class="address">
<img src="https://cdn.cunwuyun.cn/img/location-blue.svg" alt="">
<p>{{ info.resident.currentAreaName || '' }}{{ info.resident.currentAddress || '' }}</p>
<div class="user-list">
<div class="item">
<div class="item-left">
<img src="https://cdn.cunwuyun.cn/wxmp/mine/wodejiating.png" alt="">
<div class="user-info">
<h3>代玲昌</h3>
<p>积玉桥社区</p>
</div>
</div>
<div class="item-right">
<div @click="toTransfer">转积分</div>
</div>
</div>
<div class="list-content">
<div class="title">家庭成员</div>
<div class="item" v-for="(item, index) in info.family" :key="index">
<img src="https://cdn.cunwuyun.cn/dvcp/myFamily/1.png" alt="" class="banner-top" v-if="item.sex == 1">
<img src="https://cdn.cunwuyun.cn/dvcp/myFamily/2.png" alt="" class="banner-top" v-else>
<div class="user-img">
<img v-if="item.photo" :src="item.photo" alt=""/>
<img v-else src="https://cdn.cunwuyun.cn/dvcp/myFamily/tx.png" alt=""/>
</div>
<div class="item">
<div class="item-left">
<img src="https://cdn.cunwuyun.cn/wxmp/mine/wodejiating.png" alt="">
<div class="user-info">
<p>{{ item.name }}</p>
<div v-if="item.householdName == 1" class="color-5AAD6A">户主</div>
<div v-else>{{ $dict.getLabel('householdRelation', item.householdRelation) }}</div>
<h3>代玲昌</h3>
<p>积玉桥社区</p>
</div>
</div>
<div class="item-right">
<div>转积分</div>
</div>
</div>
</div>
</div>
@@ -50,11 +50,14 @@ export default {
},
methods: {
getUser() {
this.$instance.post(`/app/appresident/detailForWx?id=${this.user.residentId}`).then(res => {
if (res.code === 0) {
this.info = res.data
}
})
// this.$instance.post(`/app/appresident/detailForWx?id=${this.user.residentId}`).then(res => {
// if (res.code === 0) {
// this.info = res.data
// }
// })
},
toTransfer() {
uni.navigateTo({url: `./transferIntrgral`})
}
}
}
@@ -66,112 +69,52 @@ export default {
width: 100%;
background-color: #f3f6f9;
.credit-points {
.bg-blue {
width: 100%;
height: 112px;
background-color: #197DF0;
}
.header-content {
width: 690px;
background: #FFF;
border-radius: 16px;
margin: -80px 0 32px 30px;
padding: 0 30px 80px;
box-sizing: border-box;
box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.02);
.address {
font-size: 32px;
color: #666;
overflow: hidden;
.user-list {
padding: 32px 32px 0;
.item {
padding: 26px;
background-color: #fff;
display: flex;
margin-bottom: 24px;
.item-left {
width: calc(100% - 150px);
display: flex;
img {
width: 34px;
height: 38px;
margin-right: 14px;
vertical-align: middle;
width: 108px;
height: 108px;
border-radius: 54px;
}
p {
line-height: 44px;
width: 580px;
word-break: break-all;
float: right;
.user-info {
margin-left: 20px;
h3 {
line-height: 42px;
font-family: PingFangSC-Regular;
font-weight: 400;
font-size: 32px;
color: #333;
margin-bottom: 10px;
}
p {
font-family: PingFangSC-Regular;
font-size: 24px;
color: #999;
line-height: 40px;
}
}
}
}
.title {
font-size: 32px;
font-weight: 500;
color: #333;
line-height: 120px;
}
.list-content {
width: 690px;
background: #FFF;
border-radius: 16px;
padding: 0 30px 110px;
box-sizing: border-box;
margin-left: 30px;
box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.02);
.item {
width: 630px;
height: 192px;
background: #FFF;
box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.08);
border-radius: 16px;
padding-left: 30px;
box-sizing: border-box;
margin-bottom: 32px;
overflow: hidden;
.banner-top {
width: 100%;
height: 72px;
}
.user-img {
width: 104px;
height: 104px;
margin: -16px 34px 0 0;
border-radius: 50%;
float: left;
img {
width: 100%;
height: 100%;
border-radius: 50%;
}
}
.user-info {
margin-top: -16px;
width: calc(100% - 138px);
float: right;
p {
font-size: 32px;
font-weight: 600;
color: #333;
line-height: 44px;
margin-bottom: 8px;
}
div {
font-size: 26px;
font-weight: 400;
color: #666;
line-height: 36px;
}
.color-5AAD6A {
color: #5AAD6A;
}
.item-right {
width: 150px;
div {
width: 126px;
height: 56px;
line-height: 56px;
text-align: center;
background: #2D7DFF;
border-radius: 30px;
font-family: PingFangSC-Regular;
font-size: 26px;
color: #FFF;
margin-top: 26px;
}
}
}