119 lines
1.9 KiB
Vue
119 lines
1.9 KiB
Vue
<template>
|
||
<view class="app">
|
||
<view class="code">
|
||
<view class="title">
|
||
签约时出示二维码
|
||
</view>
|
||
<!-- <image src="../../static/pagesB/fuli.png" mode=""></image> -->
|
||
</view>
|
||
<view class="item">
|
||
<view class="lefttext">
|
||
姓名：
|
||
</view>
|
||
<view class="righttext">
|
||
张三
|
||
</view>
|
||
</view>
|
||
<view class="item">
|
||
<view class="lefttext">
|
||
手机号：
|
||
</view>
|
||
<view class="righttext">
|
||
178****3647
|
||
</view>
|
||
</view>
|
||
<view class="item">
|
||
<view class="lefttext">
|
||
身份证号：
|
||
</view>
|
||
<view class="righttext">
|
||
3703************76
|
||
</view>
|
||
</view>
|
||
<view class="btn">
|
||
解除绑定家庭成员
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
|
||
};
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
.app {
|
||
background-color: #fff;
|
||
width: 96%;
|
||
margin: 20rpx auto 0;
|
||
height: calc(100vh - 20rpx);
|
||
box-shadow: 0rpx 9rpx 31rpx 9rpx rgba(0, 0, 0, 0.03);
|
||
padding-top: 24rpx;
|
||
|
||
.btn {
|
||
position: fixed;
|
||
bottom: 50rpx;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
width: 500rpx;
|
||
height: 70rpx;
|
||
background: #26A888;
|
||
line-height: 70rpx;
|
||
border-radius: 10rpx;
|
||
font-size: 31rpx;
|
||
font-weight: 500;
|
||
color: #FFFFFF;
|
||
text-align: center;
|
||
}
|
||
|
||
.item {
|
||
width: 94%;
|
||
margin: 0 auto;
|
||
height: 120rpx;
|
||
font-size: 34rpx;
|
||
color: #333333;
|
||
position: relative;
|
||
border-bottom: 2rpx solid #E6E6E6;
|
||
|
||
.lefttext,
|
||
.righttext {
|
||
position: absolute;
|
||
top: 50%;
|
||
left: 4%;
|
||
transform: translateY(-50%);
|
||
}
|
||
|
||
.righttext {
|
||
right: 3% !important;
|
||
text-align: right;
|
||
}
|
||
}
|
||
|
||
.code {
|
||
width: 96%;
|
||
height: 400rpx;
|
||
margin: 0 auto 40rpx;
|
||
border: 2rpx solid #26A888;
|
||
border-radius: 5rpx;
|
||
|
||
.title {
|
||
margin: 50rpx 0 40rpx;
|
||
font-size: 32rpx;
|
||
color: #26A888;
|
||
text-align: center;
|
||
}
|
||
|
||
image {
|
||
margin-left: 50%;
|
||
transform: translateX(-50%);
|
||
width: 220rpx;
|
||
height: 220rpx;
|
||
}
|
||
}
|
||
}
|
||
</style> |