刘嘉炜
3 years ago
2 changed files with 144 additions and 0 deletions
@ -0,0 +1,138 @@ |
|||||
|
<template> |
||||
|
<view class="ym-confirm"> |
||||
|
<view class="yc-header"> |
||||
|
<view class="yh-stadium">欧轩智能羽毛球馆(永泰店)</view> |
||||
|
<view class="yh-info"> |
||||
|
<view>今天剩余可使用:2次</view> |
||||
|
<view>进场状态:<text>进场</text></view> |
||||
|
<view>进场时间:2021-09-24 15:06:45</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="yc-user-info"> |
||||
|
<view class="yui-tit">持卡人信息</view> |
||||
|
<view class="yui-line">手机号码:18316567789</view> |
||||
|
<view class="yui-line">用户昵称:yiming</view> |
||||
|
</view> |
||||
|
<view class="yc-photo"> |
||||
|
<view>照片</view> |
||||
|
<image></image> |
||||
|
</view> |
||||
|
|
||||
|
<view class="yc-card-mes"> |
||||
|
<view class="ycm-tit">年月卡信息</view> |
||||
|
<view class="ycm-line">年月卡名称:年卡</view> |
||||
|
<view class="ycm-line">年月卡卡号:564566</view> |
||||
|
<view class="ycm-line">验证码:12235 51234</view> |
||||
|
<view class="ycm-line">生成时间:2021-09-24 15:06:45</view> |
||||
|
<view class="ycm-line">失效时间:2021-09-25 00:00:00</view> |
||||
|
</view> |
||||
|
<view class="yc-btns"> |
||||
|
<view class="green">确认核销且开门</view> |
||||
|
<view>仅核销</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
|
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss"> |
||||
|
@import '~style/public.scss'; |
||||
|
page{ |
||||
|
background-color: #fff; |
||||
|
} |
||||
|
.ym-confirm{ |
||||
|
padding-bottom: 24upx; |
||||
|
padding-bottom: calc( 24upx + constant(safe-area-inset-bottom)); /* 兼容 iOS < 11.2 */ |
||||
|
padding-bottom: calc( 24upx + env(safe-area-inset-bottom)); /* 兼容 iOS >= 11.2 */ |
||||
|
.yc-header{ |
||||
|
padding: 0 30upx; |
||||
|
border-bottom: 2upx solid #f2f2f7; |
||||
|
.yh-stadium{ |
||||
|
padding: 30upx 0; |
||||
|
border-bottom: 2upx solid #E5E5E5; |
||||
|
} |
||||
|
.yh-info{ |
||||
|
padding: 20upx 0; |
||||
|
>view{ |
||||
|
margin-bottom: 10upx; |
||||
|
font-size: 28upx; |
||||
|
line-height: 52upx; |
||||
|
color: #333333; |
||||
|
@include textHide(1); |
||||
|
>text{ |
||||
|
color: $themeColor; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.yc-user-info{ |
||||
|
padding: 30upx; |
||||
|
border-bottom: 2upx solid #f2f2f7; |
||||
|
.yui-tit{ |
||||
|
margin-bottom: 20upx; |
||||
|
font-size: 28upx; |
||||
|
line-height: 52upx; |
||||
|
color: #9C9C9F; |
||||
|
} |
||||
|
.yui-line{ |
||||
|
font-size: 28upx; |
||||
|
line-height: 52upx; |
||||
|
color: #333; |
||||
|
@include textHide(1); |
||||
|
} |
||||
|
} |
||||
|
.yc-photo{ |
||||
|
display: flex; |
||||
|
padding: 30upx; |
||||
|
border-bottom: 2upx solid #f2f2f7; |
||||
|
>view{ |
||||
|
margin-right: 50upx; |
||||
|
font-size: 28upx; |
||||
|
line-height: 52upx; |
||||
|
color: #9c9c9f; |
||||
|
} |
||||
|
>image{ |
||||
|
flex-shrink: 0; |
||||
|
width: 218upx; |
||||
|
height: 218upx; |
||||
|
background-color: skyblue; |
||||
|
border-radius: 10upx; |
||||
|
} |
||||
|
} |
||||
|
.yc-card-mes{ |
||||
|
padding: 30upx 30upx 0; |
||||
|
.ycm-tit{ |
||||
|
margin-bottom: 20upx; |
||||
|
line-height: 52upx; |
||||
|
color: #9c9c9f; |
||||
|
} |
||||
|
.ycm-line{ |
||||
|
line-height: 52upx; |
||||
|
font-size: 28upx; |
||||
|
color: #333; |
||||
|
@include textHide(1); |
||||
|
} |
||||
|
} |
||||
|
.yc-btns{ |
||||
|
padding: 152upx 64upx 24upx; |
||||
|
>view{ |
||||
|
margin-bottom: 24upx; |
||||
|
line-height: 108upx; |
||||
|
text-align: center; |
||||
|
border-radius: 10upx; |
||||
|
border: 2upx solid $themeColor; |
||||
|
font-size: 32upx; |
||||
|
color: $themeColor; |
||||
|
&.green{ |
||||
|
background-color: $themeColor; |
||||
|
color: #fff; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
</style> |
Write
Preview
Loading…
Cancel
Save
Reference in new issue