7 changed files with 136 additions and 43 deletions
After Width: | Height: | Size: 47 KiB |
@ -1,50 +1,81 @@ |
|||
<view class="f-container"> |
|||
|
|||
<view class="f-top"> |
|||
<view class="f-card"> |
|||
<view class="card-left"> |
|||
<view class="card-title">金色海岸3号楼2单元501户</view> |
|||
<view class="card-num"> |
|||
<text >No.370252***00125</text> |
|||
<image /> |
|||
<block wx:if="{{info.houseCode}}"> |
|||
<view class="f-top"> |
|||
<view class="f-card"> |
|||
<view class="flex-view"> |
|||
<view class="card-left"> |
|||
<view class="card-title">{{ info.houseName }}</view> |
|||
<view wx:if="{{info.houseCode.length <= 24}}" class="card-num"> |
|||
<text>No.{{ info.houseCode }}</text> |
|||
<!-- <text >No.6666666666666666666666</text> --> |
|||
<image /> |
|||
</view> |
|||
</view> |
|||
<view class="card-right"> |
|||
<view class="card-qr {{ info.houseCode.length > 24 && 'card-qr-long'}}" bind:tap="handlePreview"> |
|||
<!-- <image src="{{ info.qrCodeUrl }}" /> --> |
|||
<image mode="widthFix" src="../../images/family-qr.png" /> |
|||
</view> |
|||
<view wx:if="{{info.houseCode.length <= 24}}" class="card-qr-name">我的“e家码”</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="card-right"> |
|||
<view class="card-qr"> |
|||
<image /> |
|||
<view wx:if="{{info.houseCode.length > 24}}" class="card-num mt16"> |
|||
<text>No.{{ info.houseCode }}</text> |
|||
<!-- <text >No.666666666666666666666666666666666666</text> --> |
|||
<image /> |
|||
</view> |
|||
<view class="card-qr-name">我的“e家码”</view> |
|||
|
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="f-wr"> |
|||
<view class="title-wr"> |
|||
<view class="title-label">家庭成员</view> |
|||
<view class="title-right"> |
|||
<view class="title-right-label">明细</view> |
|||
<image class="right-icon" src="../../images/arrow-right.png" /> |
|||
<view class="f-wr"> |
|||
<view class="title-wr"> |
|||
<view class="title-label">家庭成员</view> |
|||
<view class="title-right"> |
|||
<!-- <view class="title-right-label">明细</view> --> |
|||
<image class="right-icon" src="../../images/arrow-right.png" /> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="f-table mt40"> |
|||
<view class="table-cell table-header"> |
|||
<view class="table-col">姓名</view> |
|||
<view class="table-col">成员关系</view> |
|||
<view class="table-col">手机号</view> |
|||
<view class="table-col">明细</view> |
|||
<view class="f-table mt40"> |
|||
<view class="table-cell table-header"> |
|||
<view class="table-col">姓名</view> |
|||
<view class="table-col">成员关系</view> |
|||
<view class="table-col">手机号</view> |
|||
<view class="table-col">明细</view> |
|||
</view> |
|||
<block wx:if="{{list.length > 0}}"> |
|||
<view class="table-cell" wx:for="{{6}}"> |
|||
<view class="table-col">张三李四</view> |
|||
<view class="table-col">户主</view> |
|||
<view class="table-col">13388990099</view> |
|||
<view class="table-col table-col-4" bind:tap="toFamilyInfo">查看</view> |
|||
</view> |
|||
</block> |
|||
<view wx:else class="no-data">暂无成员</view> |
|||
</view> |
|||
<view class="table-cell" wx:for="{{6}}"> |
|||
<view class="table-col">张三李四</view> |
|||
<view class="table-col">户主</view> |
|||
<view class="table-col">13388990099</view> |
|||
<view class="table-col table-col-4" bind:tap="toFamilyInfo">查看</view> |
|||
<view class="f-btns" data-type="add" data-id="{{ info.icResiUserId }}" bind:tap="handleTo"> |
|||
<view class="f-btns-icon">+</view> |
|||
<view class="f-btns-label">添加家庭成员</view> |
|||
</view> |
|||
</view> |
|||
</block> |
|||
<view wx:else class="no-data">暂无家庭信息</view> |
|||
</view> |
|||
|
|||
|
|||
<view class="m-fm" hidden="{{ showQr }}"> |
|||
<view class="fm"> |
|||
<view class="btn-close" bind:tap="cancel"> |
|||
<image mode="aspectFill" src="../../images/close.png"></image> |
|||
<!-- <image mode="aspectFill" |
|||
src="/assets/images/common/close.png"></image> --> |
|||
</view> |
|||
<view class="fm-header">我的e家码</view> |
|||
<view class="fm-qr"> |
|||
<!-- <image src="../../images/qr1.png" mode="aspectFill" /> --> |
|||
<image src="{{ info.qrCodeUrl }}" mode="aspectFill" /> |
|||
</view> |
|||
<view class="fm-btn" bind:tap="comfirmSave">保存到相册</view> |
|||
<!-- <view class="operate"> |
|||
<view class="btn" bind:tap="confirm">保存到相册</view> |
|||
</view> --> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
</view> |
@ -1,2 +1,4 @@ |
|||
<!--subpages/family/pages/noAccess/noAccess.wxml--> |
|||
<text>subpages/family/pages/noAccess/noAccess.wxml</text> |
|||
<view class="no-family"> |
|||
<image src="../../images/no-family.png" mode="widthFix" /> |
|||
<view class="no-btn" bind:tap="handleHome">返回首页</view> |
|||
</view> |
@ -1 +1,23 @@ |
|||
/* subpages/family/pages/noAccess/noAccess.wxss */ |
|||
.no-family { |
|||
padding-top: 200rpx; |
|||
} |
|||
.no-family image { |
|||
display: block; |
|||
width: 506rpx; |
|||
margin: 0 auto; |
|||
} |
|||
.no-family .no-btn { |
|||
width: 220rpx; |
|||
height: 66rpx; |
|||
margin: 60rpx auto 0; |
|||
font-size: 32rpx; |
|||
color: #fff; |
|||
text-align: center; |
|||
line-height: 66rpx; |
|||
background-image: linear-gradient(90deg, #ca151d 0%, #e11c13 100%); |
|||
border-radius: 30rpx; |
|||
-webkit-border-radius: 30rpx; |
|||
-moz-border-radius: 30rpx; |
|||
-ms-border-radius: 30rpx; |
|||
-o-border-radius: 30rpx; |
|||
} |
File diff suppressed because one or more lines are too long
@ -1 +1 @@ |
|||
page{background:#fff}.f-top{position:relative;width:100%;height:200rpx;background:#e3271c;border-radius:0 0 30rpx 30rpx;-webkit-border-radius:0 0 30rpx 30rpx;-moz-border-radius:0 0 30rpx 30rpx;-ms-border-radius:0 0 30rpx 30rpx;-o-border-radius:0 0 30rpx 30rpx}.f-top .f-card{position:absolute;left:50%;bottom:-64rpx;display:flex;justify-content:space-between;align-items:center;width:690rpx;height:200rpx;margin-left:-345rpx;box-sizing:border-box;padding:28rpx 30rpx 18rpx;background-color:#fff;box-shadow:0 5rpx 32rpx 0 rgba(184,184,184,.25);border-radius:14rpx;-moz-border-radius:14rpx;-ms-border-radius:14rpx;-o-border-radius:14rpx;-webkit-border-radius:14rpx}.f-top .f-card .card-right{flex-shrink:0;margin-left:30rpx}.f-top .f-card .card-title{height:96rpx;font-family:PingFang-SC-Bold;font-size:34rpx;letter-spacing:1rpx;color:#020202;overflow:hidden}.f-top .f-card .card-num{display:flex;align-items:center;font-family:PingFang-SC-Medium;font-size:28rpx;letter-spacing:1rpx;color:#333}.f-top .f-card .card-num image{width:32rpx;height:18rpx}.f-top .f-card .card-qr{width:120rpx;height:120rpx;border:1rpx solid #eee}.f-top .f-card .card-qr image{display:block;width:100%;height:100%}.f-top .f-card .card-qr-name{margin-top:10rpx;font-family:PingFang-SC-Regular;font-size:22rpx;font-weight:400;font-stretch:normal;letter-spacing:1rpx;color:#333}.f-wr{width:100%;box-sizing:border-box;padding:100rpx 20rpx 0}.title-right,.title-wr{display:flex;align-items:center}.title-wr{justify-content:space-between;padding:28rpx 0;border-bottom:1rpx solid #e7eeee}.title-wr .title-label{position:relative;padding-left:25rpx;font-family:PingFang-SC-Bold;font-size:34rpx;font-weight:400;font-stretch:normal;letter-spacing:0;color:#333}.title-wr .title-label::after{content:'';position:absolute;top:50%;left:0;width:6rpx;height:30rpx;margin-top:-15rpx;background-color:#e60000;border-radius:3rpx;-webkit-border-radius:3rpx;-moz-border-radius:3rpx;-ms-border-radius:3rpx;-o-border-radius:3rpx}.title-wr .title-right-label{font-family:PingFang-SC-Light;font-size:26rpx;font-weight:400;font-stretch:normal;color:#999}.title-wr .right-icon{width:30rpx;height:30rpx}.f-table{background-color:#fbfbfb}.f-table .table-cell{display:flex;align-items:center;padding:26rpx 0;border:solid 1rpx #e3e3e3;border-top:0;font-family:PingFang-SC-Regular;font-size:30rpx;color:#000003}.f-table .table-cell .table-col{flex:1;text-align:center;line-height:1}.f-table .table-cell .table-col-4{color:#dd2a2a}.f-table .table-header{background:#f1f1f1;border:0;font-family:PingFang-SC-Regular;font-size:28rpx;color:#666}.mt40{margin-top:40rpx} |
|||
page{background:#fff;box-sizing:border-box}.f-container{width:100%;box-sizing:border-box}.f-top{position:relative;width:100%;height:200rpx;background:#e3271c;border-radius:0 0 30rpx 30rpx;-webkit-border-radius:0 0 30rpx 30rpx;-moz-border-radius:0 0 30rpx 30rpx;-ms-border-radius:0 0 30rpx 30rpx;-o-border-radius:0 0 30rpx 30rpx}.f-top .flex-view{display:flex;justify-content:space-between}.f-top .f-card{position:absolute;left:50%;bottom:-64rpx;width:690rpx;height:200rpx;margin-left:-345rpx;box-sizing:border-box;padding:28rpx 30rpx 18rpx;background-color:#fff;box-shadow:0 5rpx 32rpx 0 rgba(184,184,184,.25);overflow:hidden;border-radius:14rpx;-moz-border-radius:14rpx;-ms-border-radius:14rpx;-o-border-radius:14rpx;-webkit-border-radius:14rpx}.f-top .f-card .card-right{flex-shrink:0;margin-left:30rpx}.f-top .f-card .card-title{height:96rpx;font-family:PingFang-SC-Bold;font-size:34rpx;letter-spacing:1rpx;color:#020202;overflow:hidden}.f-top .f-card .card-num{display:flex;align-items:center;font-family:PingFang-SC-Medium;font-size:28rpx;letter-spacing:1rpx;color:#333;overflow:hidden}.f-top .f-card .card-num image{flex-shrink:0;width:32rpx;height:18rpx}.f-top .f-card .card-qr{width:120rpx;height:120rpx;border:1rpx solid #eee}.f-top .f-card .card-qr image{display:block;width:100%;height:100%}.f-top .f-card .card-qr-long{width:100rpx;height:100rpx}.f-top .f-card .card-qr-name{font-family:PingFang-SC-Regular;font-size:22rpx;font-weight:400;font-stretch:normal;letter-spacing:1rpx;color:#333}.f-wr{width:100%;box-sizing:border-box;padding:100rpx 20rpx 0}.title-right,.title-wr{display:flex;align-items:center}.title-wr{justify-content:space-between;padding:28rpx 0;border-bottom:1rpx solid #e7eeee}.title-wr .title-label{position:relative;padding-left:25rpx;font-family:PingFang-SC-Bold;font-size:34rpx;font-weight:400;font-stretch:normal;letter-spacing:0;color:#333}.title-wr .title-label::after{content:'';position:absolute;top:50%;left:0;width:6rpx;height:30rpx;margin-top:-15rpx;background-color:#e60000;border-radius:3rpx;-webkit-border-radius:3rpx;-moz-border-radius:3rpx;-ms-border-radius:3rpx;-o-border-radius:3rpx}.title-wr .title-right-label{font-family:PingFang-SC-Light;font-size:26rpx;font-weight:400;font-stretch:normal;color:#999}.title-wr .right-icon{width:30rpx;height:30rpx}.f-table{background-color:#fbfbfb}.f-table .table-cell{display:flex;align-items:center;padding:26rpx 0;border:solid 1rpx #e3e3e3;border-top:0;font-family:PingFang-SC-Regular;font-size:30rpx;color:#000003}.f-table .table-cell .table-col{flex:1;text-align:center;line-height:1}.f-table .table-cell .table-col-4{color:#dd2a2a}.f-table .table-header{background:#f1f1f1;border:0;font-family:PingFang-SC-Regular;font-size:28rpx;color:#666}.f-btns{display:flex;align-items:center;padding:30rpx 0}.f-btns .f-btns-icon{width:30rpx;height:30rpx;font-size:28rpx;color:#dd2a2a;text-align:center;line-height:30rpx;border:1rpx solid #dd2a2a;border-radius:50%;-webkit-border-radius:50%;-moz-border-radius:50%;-ms-border-radius:50%;-o-border-radius:50%}.f-btns .f-btns-label{margin-left:10rpx;font-size:28rpx;color:#dd2a2a}.mt40{margin-top:40rpx}.mt16{margin-top:16rpx}.no-data{font-size:28rpx;color:#999;text-align:center;line-height:300rpx}.m-fm .fm{top:500rpx;width:600rpx;padding:0 0 40rpx 0;background:#fff;overflow:hidden}.m-fm .fm .btn-close{top:27rpx;padding:0 30rpx;font-size:36rpx;color:#fff;line-height:90rpx}.m-fm .fm .btn-close image{display:block;width:36rpx;height:36rpx}.m-fm .fm .fm-btn{width:240rpx;height:54rpx;margin:20rpx auto 0;font-family:PingFang-SC-Medium;font-size:28rpx;font-weight:400;font-stretch:normal;letter-spacing:0;color:#999;text-align:center;line-height:54rpx;border-radius:27rpx;border:solid 1rpx #eee;-webkit-border-radius:27rpx;-moz-border-radius:27rpx;-ms-border-radius:27rpx;-o-border-radius:27rpx}.m-fm .fm-header{width:100%;height:90rpx;margin-bottom:20rpx;text-align:center;line-height:90rpx;font-family:PingFang-SC-Bold;font-size:32rpx;color:#fff;background-image:linear-gradient(90deg,#ca151d 0,#e11c13 100%)}.m-fm .fm-qr{width:400rpx;height:400rpx;box-sizing:border-box;margin:0 auto}.m-fm .fm-qr image{display:block;width:100%;height:100%}.no-family{padding-top:200rpx}.no-family image{display:block;width:506rpx;margin:0 auto}.no-family .no-btn{width:220rpx;height:66rpx;margin:60rpx auto 0;font-size:32rpx;color:#fff;text-align:center;line-height:66rpx;background-image:linear-gradient(90deg,#ca151d 0,#e11c13 100%);border-radius:30rpx;-webkit-border-radius:30rpx;-moz-border-radius:30rpx;-ms-border-radius:30rpx;-o-border-radius:30rpx} |
Loading…
Reference in new issue