战立标
2 years ago
13 changed files with 2189 additions and 1576 deletions
|
Before Width: | Height: | Size: 35 KiB After Width: | Height: | Size: 91 KiB |
@ -1,7 +1,8 @@ |
|||
{ |
|||
"usingComponents": { |
|||
"wux-select": "../../../../components/dist/select", |
|||
"DynamicForms": "../../../../components/DynamicForms/DynamicForms" |
|||
"DynamicForms": "../../../../components/DynamicForms/DynamicForms", |
|||
"van-icon": "@vant/weapp/icon/index" |
|||
}, |
|||
"navigationStyle": "custom" |
|||
} |
|||
|
After Width: | Height: | Size: 12 KiB |
|
After Width: | Height: | Size: 15 KiB |
@ -0,0 +1,71 @@ |
|||
import { |
|||
getFamilyRelationshipList, getPersonalFeature, |
|||
getPersonalFile, potentialSatisfactionForResident, queryResidentFollowRecord |
|||
} from "../../../../utils/statisticsApi"; |
|||
|
|||
Page({ |
|||
data: { |
|||
id: 0, |
|||
userInfo: {}, |
|||
relationship: {}, |
|||
unSolvedNum: 0, |
|||
unFinishNum: 0, |
|||
noServiceNum: 0, |
|||
event12345Num: 0, |
|||
provinceSatisfactionNum: 0, |
|||
selfInspectNum: 0, |
|||
logList: [], |
|||
tags: {} |
|||
}, |
|||
|
|||
onLoad(options) { |
|||
this.setData({ |
|||
id: options.id |
|||
}) |
|||
this.getUser() |
|||
this.getNum() |
|||
this.getlog() |
|||
}, |
|||
getUser() { |
|||
getPersonalFile({resid: this.data.id}).then(({data}) => { |
|||
this.setData({ |
|||
userInfo: data |
|||
}) |
|||
}) |
|||
getFamilyRelationshipList({resid: this.data.id, type: 0}).then(({data}) => { |
|||
this.setData({ |
|||
relationship: data |
|||
}) |
|||
}) |
|||
getPersonalFeature({resid: this.data.id}).then(({data}) => { |
|||
this.setData({ |
|||
tags: data |
|||
}) |
|||
}) |
|||
}, |
|||
getNum() { |
|||
let params = { |
|||
resiId: this.data.id, |
|||
}; |
|||
potentialSatisfactionForResident(params).then(({data}) => { |
|||
this.setData({ |
|||
unSolvedNum: data.unSolvedNum, |
|||
unFinishNum: data.unFinishNum, |
|||
noServiceNum: data.noServiceNum, |
|||
event12345Num: data.event12345Num, |
|||
provinceSatisfactionNum: data.provinceSatisfactionNum, |
|||
selfInspectNum: data.selfInspectNum |
|||
}) |
|||
}); |
|||
}, |
|||
getlog() { |
|||
let params = { |
|||
resiId: this.data.id, |
|||
}; |
|||
queryResidentFollowRecord(params).then(({data}) => { |
|||
this.setData({ |
|||
logList: data |
|||
}) |
|||
}) |
|||
} |
|||
}) |
|||
@ -0,0 +1,4 @@ |
|||
{ |
|||
"navigationBarTitleText": "居民画像", |
|||
"usingComponents": {} |
|||
} |
|||
@ -0,0 +1,164 @@ |
|||
<view class="resident-container"> |
|||
<view class="card"> |
|||
<view class="title">居民档案</view> |
|||
<view class="user-info"> |
|||
<image src="../../images/woman.png" class="img" mode="widthFix" /> |
|||
<view class="name"> |
|||
张三 125468745410 |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="user-infos"> |
|||
<view class="label"> |
|||
居住地址： |
|||
</view> |
|||
<view class="value"> |
|||
四季景园1号楼1单元101 |
|||
</view> |
|||
</view> |
|||
<view class="user-infos"> |
|||
<view class="label"> |
|||
所属网格： |
|||
</view> |
|||
<view class="value"> |
|||
第三网格 |
|||
</view> |
|||
</view> |
|||
<view class="user-infos"> |
|||
<view class="label"> |
|||
入户状况： |
|||
</view> |
|||
<view class="value"> |
|||
入户一致 |
|||
</view> |
|||
</view> |
|||
<view class="user-infos"> |
|||
<view class="label"> |
|||
居住类型： |
|||
</view> |
|||
<view class="value"> |
|||
与子女同住 |
|||
</view> |
|||
</view> |
|||
<view class="user-infos"> |
|||
<view class="label"> |
|||
家庭预警： |
|||
</view> |
|||
<view class="value"> |
|||
满意度风险家庭 |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
<view class="table"> |
|||
<view class="tr"> |
|||
<view class="th">姓名</view> |
|||
<view class="th" style="flex:2">与本人关系</view> |
|||
<view class="th">性别</view> |
|||
<view class="th">年龄</view> |
|||
</view> |
|||
<view class="tr" wx:for="{{relationship}}" wx:key="{{index}}"> |
|||
<view class="td">{{item.name}}</view> |
|||
<view class="td" style="flex:2">{{item.houseHolderRel ? item.houseHolderRel : ''}}</view> |
|||
<view class="td">{{item.gender == 2?'男':item.gender == 1?'女':item.gender === '0'?'未知':''}}</view> |
|||
<view class="td">{{item.age}} |
|||
<image mode="widthFix" class="table-right-icon" src="../../images/right2.png" /> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view class="card"> |
|||
<view class="title">居民画像</view> |
|||
|
|||
<view class="portrait"> |
|||
<view class="bg"> |
|||
<image src="../../images/jmhx_center.png" mode="widthFix" /> |
|||
</view> |
|||
|
|||
<view class="tags"> |
|||
<view class="tag" wx-if="{{tags.age}}"> |
|||
<view class="text">{{tags.age}}岁</view> |
|||
</view> |
|||
<view class="tag" wx-if="{{tags.category1}}"> |
|||
<view class="text">{{tags.category1}}</view> |
|||
</view> |
|||
<view class="tag" wx-if="{{tags.category2}}"> |
|||
<view class="text">{{tags.category2}}</view> |
|||
</view> |
|||
<view class="tag" wx-if="{{tags.monthIncomeLevel}}"> |
|||
<view class="text">{{tags.monthIncomeLevel}}</view> |
|||
</view> |
|||
<view class="tag" wx-if="{{tags.cultureLevel}}"> |
|||
<view class="text">{{tags.cultureLevel}}</view> |
|||
</view> |
|||
<view class="tag" wx-if="{{tags.marriage}}"> |
|||
<view class="text">{{tags.marriage}}</view> |
|||
</view> |
|||
<view class="tag" wx-if="{{tags.gender || tags.gender === '0'}}"> |
|||
<view class="text">{{tags.gender == 2?'男':tags.gender == 1?'女':tags.gender === '0'?'未知':''}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="card"> |
|||
<view class="title">历史及潜在不满意事项</view> |
|||
<view class="num-list"> |
|||
<view class="num-item"> |
|||
<view class="txt"> |
|||
<text>12345投诉</text> |
|||
</view> |
|||
<view class="num">{{event12345Num}}</view> |
|||
</view> |
|||
<view class="num-item"> |
|||
<view class="txt"> |
|||
<text>省满意度调查</text> |
|||
</view> |
|||
<view class="num">{{provinceSatisfactionNum}}</view> |
|||
</view> |
|||
<view class="num-item"> |
|||
<view class="txt"> |
|||
<text>社区满意度自查</text> |
|||
</view> |
|||
<view class="num">{{selfInspectNum}}</view> |
|||
</view> |
|||
<view class="num-item"> |
|||
<view class="txt"> |
|||
<text>事件未解决 |
|||
的次数</text> |
|||
</view> |
|||
<view class="num">{{unSolvedNum}}</view> |
|||
</view> |
|||
<view class="num-item"> |
|||
<view class="txt"> |
|||
<text>需求未满足 |
|||
的次数</text> |
|||
</view> |
|||
<view class="num">{{unFinishNum}}</view> |
|||
</view> |
|||
<view class="num-item"> |
|||
<view class="txt"> |
|||
<text>应享未享服务 |
|||
的次数</text> |
|||
</view> |
|||
<view class="num">{{noServiceNum}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="card"> |
|||
<view class="title">回访记录</view> |
|||
<view class="log-list"> |
|||
<view class="log-item" wx:for="{{logList}}" wx:key="{{index}}"> |
|||
<view> |
|||
<view class="user"> |
|||
<view class="tag blue">{{item.followUpWay}}</view> |
|||
<view class="name">{{item.followPersonName}}（{{item.roleNames}}）</view> |
|||
</view> |
|||
<view class="date">{{item.followTime}}</view> |
|||
</view> |
|||
<image src="../../../images/right.png" mode="widthFix" class="icon" /> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
@ -0,0 +1,299 @@ |
|||
|
|||
.resident-container { |
|||
padding: 20rpx; |
|||
} |
|||
|
|||
page { |
|||
background-color: #f7f7f7; |
|||
} |
|||
|
|||
.card { |
|||
background: #fff; |
|||
border-radius: 20rpx; |
|||
padding: 30rpx; |
|||
margin-top: 20rpx; |
|||
} |
|||
|
|||
.card .title { |
|||
font-size: 34rpx; |
|||
font-weight: bold; |
|||
color: #333333; |
|||
display: flex; |
|||
align-items: center; |
|||
margin-left: -30rpx; |
|||
margin-bottom: 39rpx; |
|||
position: relative; |
|||
} |
|||
|
|||
.card .title:before { |
|||
content: ''; |
|||
display: block; |
|||
width: 10rpx; |
|||
height: 28rpx; |
|||
background: #3A80E7; |
|||
border-radius: 4rpx; |
|||
margin-right: 20rpx; |
|||
} |
|||
|
|||
.user-info .name { |
|||
font-size: 32rpx; |
|||
font-weight: bold; |
|||
color: #333333; |
|||
margin-bottom: 30rpx; |
|||
} |
|||
|
|||
.user-info .address { |
|||
font-size: 28rpx; |
|||
font-weight: 400; |
|||
color: #666666; |
|||
padding-bottom: 30rpx; |
|||
} |
|||
|
|||
.table .tr { |
|||
display: flex; |
|||
padding: 0 20rpx; |
|||
} |
|||
|
|||
.table .tr .th { |
|||
font-size: 32rpx; |
|||
font-weight: bold; |
|||
color: #333333; |
|||
} |
|||
.table .tr .td { |
|||
font-size: 30rpx; |
|||
font-weight: 500; |
|||
color: #666666; |
|||
} |
|||
.table .tr .th, |
|||
.table .tr .td { |
|||
flex: 1; |
|||
position: relative; |
|||
height: 100rpx; |
|||
line-height: 100rpx; |
|||
} |
|||
.table .tr:nth-of-type(2n) { |
|||
background: rgba(58, 128, 231, 0.08); |
|||
} |
|||
|
|||
.table-right-icon { |
|||
width: 24rpx; |
|||
height: 24rpx; |
|||
position: absolute; |
|||
right: 0; |
|||
top: calc(50% - 12rpx); |
|||
} |
|||
|
|||
|
|||
|
|||
.portrait { |
|||
position: relative; |
|||
width: 633rpx; |
|||
height: 542rpx; |
|||
font-size: 30rpx; |
|||
font-weight: bold; |
|||
color: #3A80E7; |
|||
line-height: 36rpx; |
|||
} |
|||
|
|||
.portrait .tag { |
|||
position: absolute; |
|||
background: #f4f8fe; |
|||
padding: 30rpx; |
|||
width: 129rpx; |
|||
height: 129rpx; |
|||
border-radius: 50%; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
box-sizing: border-box; |
|||
text-align: center; |
|||
} |
|||
|
|||
.portrait .tag:after { |
|||
content: ""; |
|||
display: block; |
|||
width: calc(100% - 28rpx); |
|||
height: calc(100% - 28rpx); |
|||
position: absolute; |
|||
left: 14rpx; |
|||
top: 14rpx; |
|||
background: #d3e3fa; |
|||
border-radius: 50%; |
|||
} |
|||
.portrait .tag .text { |
|||
position: relative; |
|||
z-index: 2; |
|||
} |
|||
.portrait .tag:nth-of-type(1) { |
|||
padding: 38rpx; |
|||
width: 163rpx; |
|||
height: 163rpx; |
|||
left: 227rpx; |
|||
top: 0; |
|||
} |
|||
.portrait .tag:nth-of-type(2) { |
|||
padding: 24rpx; |
|||
width: 121rpx; |
|||
height: 121rpx; |
|||
right: 58rpx; |
|||
top: 101rpx; |
|||
} |
|||
.portrait .tag:nth-of-type(3) { |
|||
width: 145rpx; |
|||
height: 145rpx; |
|||
right: 0rpx; |
|||
top: 249rpx; |
|||
} |
|||
.portrait .tag:nth-of-type(4) { |
|||
width: 163rpx; |
|||
height: 163rpx; |
|||
right: 100rpx; |
|||
bottom: 0; |
|||
} |
|||
.portrait .tag:nth-of-type(5) { |
|||
left: 99rpx; |
|||
bottom: 10rpx; |
|||
} |
|||
.portrait .tag:nth-of-type(6) { |
|||
left: 0rpx; |
|||
top: 251rpx; |
|||
} |
|||
.portrait .tag:nth-of-type(7) { |
|||
left: 53rpx; |
|||
top: 101rpx; |
|||
} |
|||
|
|||
.bg { |
|||
width: 238rpx; |
|||
height: 238rpx; |
|||
position: absolute; |
|||
left: calc(50% - 119rpx); |
|||
top: calc(50% - 100rpx); |
|||
} |
|||
.bg image { |
|||
width: 100%; |
|||
height: 100%; |
|||
} |
|||
|
|||
.num-list { |
|||
display: flex; |
|||
width: 100%; |
|||
justify-content: space-between; |
|||
position: relative; |
|||
flex-wrap: wrap; |
|||
} |
|||
|
|||
.num-list .num-item { |
|||
flex: 0 0 33.333333%; |
|||
position: relative; |
|||
margin-bottom: 20rpx; |
|||
} |
|||
|
|||
.num-list .num-item:after { |
|||
content: ''; |
|||
display: block; |
|||
position: absolute; |
|||
right: 25rpx; |
|||
top: calc(50% - 45rpx); |
|||
width: 1rpx; |
|||
height: 90rpx; |
|||
background: #C1C1C1; |
|||
opacity: 0.66; |
|||
} |
|||
|
|||
.num-list .num-item:nth-of-type(3n):after { |
|||
display: none; |
|||
} |
|||
|
|||
.num-list .num-item:last-child:after { |
|||
display: none; |
|||
} |
|||
|
|||
.num-list .num-item .txt { |
|||
font-size: 28rpx; |
|||
font-weight: 500; |
|||
color: #999999; |
|||
margin-bottom: 10rpx; |
|||
} |
|||
|
|||
.num-list .num-item .num { |
|||
font-size: 42rpx; |
|||
font-weight: bold; |
|||
color: #333333; |
|||
} |
|||
|
|||
.tag { |
|||
display: inline-block; |
|||
line-height: 40rpx; |
|||
height: 40rpx; |
|||
border-radius: 20rpx; |
|||
font-size: 26rpx; |
|||
font-weight: 500; |
|||
padding: 0 20rpx; |
|||
margin-right: 30rpx; |
|||
} |
|||
|
|||
.blue { |
|||
background: rgba(79, 148, 255, 0.14); |
|||
color: #4F94FF; |
|||
} |
|||
|
|||
.orange { |
|||
background: rgba(255, 120, 60, 0.14); |
|||
color: #FF783C; |
|||
} |
|||
|
|||
.green { |
|||
background: rgba(4, 184, 173, 0.14); |
|||
color: #04B8AD; |
|||
} |
|||
|
|||
.red { |
|||
color: #FA1919; |
|||
background: rgba(255, 48, 27, 0.14); |
|||
} |
|||
|
|||
.log-item { |
|||
border-bottom: 1px solid #EAEAEA; |
|||
padding: 30rpx 0; |
|||
} |
|||
|
|||
.log-item .user { |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
|
|||
.log-item .tag { |
|||
margin-right: 17px; |
|||
} |
|||
|
|||
.log-item .icon { |
|||
width: 48rpx; |
|||
height: 48rpx; |
|||
} |
|||
|
|||
.log-item .name { |
|||
font-size: 32rpx; |
|||
font-weight: 500; |
|||
color: #333333; |
|||
} |
|||
|
|||
.log-item .date { |
|||
font-size: 28rpx; |
|||
font-weight: 500; |
|||
color: #C1C1C1; |
|||
margin-top: 17rpx; |
|||
} |
|||
|
|||
.log-item { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
} |
|||
.img { |
|||
width: 128rpx; |
|||
height: 128rpx |
|||
} |
|||
.user-info { |
|||
display: flex; |
|||
} |
|||
Loading…
Reference in new issue