6 changed files with 223 additions and 6 deletions
-
45src/components/order_list/ym_card/ym_card.vue
-
6src/pages.json
-
10src/pages/order_list/order_list.vue
-
3src/subpackage/order/pages/order_manage/order_manage.vue
-
165src/subpackage/order/pages/ym_card/detail/detail.vue
-
BINsrc/subpackage/order/static/images/order_manage/order_18.png
@ -0,0 +1,45 @@ |
|||
<template> |
|||
<view class="ym-card-container" @click="toInfo"> |
|||
<a-header :source="'nnnnaaaaammmmeeee' || '-'" :status="'ssttaattuuss'"></a-header> |
|||
<view class="ycc-info"> |
|||
<a-line :value="'年卡' || '-'"> |
|||
<block slot="name">卡名称：</block> |
|||
</a-line> |
|||
<a-line :value="'20195171564566' || '-'"> |
|||
<block slot="name">年月卡号：</block> |
|||
</a-line> |
|||
<a-line :value="'18316553478' || '-'"> |
|||
<block slot="name">手机号码：</block> |
|||
</a-line> |
|||
<a-line :value="'至2022.08.28' || '-'"> |
|||
<block slot="name">有效期：</block> |
|||
</a-line> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import util from '../../../utils/util'; |
|||
import a_header from '../a_header/a_header.vue'; |
|||
import a_line from '../a_line/a_line.vue'; |
|||
export default { |
|||
components: { |
|||
'a-header': a_header, |
|||
'a-line': a_line, |
|||
}, |
|||
methods: { |
|||
toInfo(){ |
|||
util.routeTo(`/subpackage/order/pages/ym_card/detail/detail`, 'nT'); |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
@import '~style/public.scss'; |
|||
.ym-card-container{ |
|||
background-color: #fff; |
|||
padding: 0 20upx 20upx; |
|||
border-radius: 10upx; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,165 @@ |
|||
<template> |
|||
<view class="ym-card-info"> |
|||
<view class="yci-main"> |
|||
<view class="yci-box ym-card-info"> |
|||
<view class="yci-stadium-name">欧轩智能场馆(羽毛球永泰店)</view> |
|||
<view class="yci-line"> |
|||
<view>年月卡名称：年卡</view> |
|||
<view>年月卡卡号：124646</view> |
|||
<view>有效期：至2022.08.28</view> |
|||
</view> |
|||
<view class="yci-btn"> |
|||
<view>使用记录</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="yci-box ym-user"> |
|||
<view class="yci-tit">持卡人信息</view> |
|||
<a-line :value="'18316567789' || '-'"> |
|||
<block slot="name">手机号码：</block> |
|||
</a-line> |
|||
<a-line :value="'yiming' || '-'"> |
|||
<block slot="name">用户昵称：</block> |
|||
</a-line> |
|||
<view class="yu-line">照片：<text>更改照片</text></view> |
|||
<image class="yu-img"></image> |
|||
</view> |
|||
|
|||
<view class="yci-box yci-buy-info"> |
|||
<view class="yci-tit">购卡信息</view> |
|||
<view class="ybi-name">年月卡名称：年卡</view> |
|||
<s-line :keyname="'金额小计'" :value="'￥' + (orderInfo.coupons_amount || '0')"></s-line> |
|||
<s-line :keyname="'积分抵扣'" :value="'￥' + (orderInfo.coupons_amount || '0')"></s-line> |
|||
<s-line :keyname="'折扣金额'" :value="'￥' + (orderInfo.coupons_amount || '0')"></s-line> |
|||
<s-line :keyname="'优惠券优惠'" :value="'￥' + (orderInfo.coupons_amount || '0')"></s-line> |
|||
<view class="ybi-total"><text>合计支付：</text>￥5</view> |
|||
</view> |
|||
|
|||
<view class="yci-pay-info"> |
|||
<view class="yci-tit">支付信息</view> |
|||
<p-line :keyname="'订单编号：'" :value="orderInfo.created_at || '-'" ></p-line> |
|||
<p-line :keyname="'支付方式：'" :value="orderInfo.created_at || '-'" ></p-line> |
|||
<p-line :keyname="'支付时间：'" :value="orderInfo.created_at || '-'" ></p-line> |
|||
<p-line :keyname="'微信交易号：'" :value="orderInfo.created_at || '-'" ></p-line> |
|||
<p-line :keyname="'创建途径：'" :value="orderInfo.created_at || '-'" ></p-line> |
|||
</view> |
|||
|
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import a_line from '../../../../../components/order_list/a_line/a_line.vue'; |
|||
import s_line from '../../../components/s_line/s_line.vue'; |
|||
import p_line from '../../../components/p_line/p_line.vue'; |
|||
export default { |
|||
components: { |
|||
'a-line': a_line, |
|||
's-line': s_line, |
|||
'p-line': p_line, |
|||
|
|||
}, |
|||
data(){ |
|||
return { |
|||
orderInfo: {} |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
@import '~style/public.scss'; |
|||
.ym-card-info{ |
|||
|
|||
} |
|||
.yci-box{ |
|||
padding: 30upx; |
|||
margin-bottom: 24upx; |
|||
border-radius: 10upx; |
|||
background-color: #fff; |
|||
} |
|||
.yci-tit{ |
|||
margin-bottom: 20upx; |
|||
line-height: 40upx; |
|||
font-size: 28upx; |
|||
color: #9C9C9F; |
|||
} |
|||
.yci-main{ |
|||
padding: 24upx; |
|||
.ym-card-info{ |
|||
.yci-stadium-name{ |
|||
margin-bottom: 22upx; |
|||
padding-bottom: 26upx; |
|||
line-height: 40upx; |
|||
font-size: 28upx; |
|||
font-weight: 500; |
|||
border-bottom: 2upx solid #D8D8D8; |
|||
@include textHide(1); |
|||
} |
|||
.yci-line{ |
|||
margin-bottom: 32upx; |
|||
>view{ |
|||
line-height: 48upx; |
|||
font-size: 28upx; |
|||
color: #333; |
|||
@include textHide(1); |
|||
} |
|||
} |
|||
.yci-btn{ |
|||
@include centerFlex(flex-end); |
|||
>view{ |
|||
width: 176upx; |
|||
line-height: 80upx; |
|||
text-align: center; |
|||
border-radius: 10upx; |
|||
border: 2upx solid #9A9A9D; |
|||
font-size: 32upx; |
|||
color: #9A9A9D; |
|||
} |
|||
} |
|||
} |
|||
.ym-user{ |
|||
.yu-line{ |
|||
margin-bottom: 16upx; |
|||
font-size: 28upx; |
|||
line-height: 52upx; |
|||
color: #9a9a9d; |
|||
>text{ |
|||
color: $themeColor; |
|||
text-decoration: underline; |
|||
} |
|||
} |
|||
.yu-img{ |
|||
display: block; |
|||
width: 218upx; |
|||
height: 218upx; |
|||
border-radius: 10upx; |
|||
background-color: skyblue; |
|||
|
|||
} |
|||
} |
|||
.yci-buy-info{ |
|||
.ybi-name{ |
|||
margin-bottom: 22upx; |
|||
padding-bottom: 30upx; |
|||
font-size: 28upx; |
|||
line-height: 40upx; |
|||
color: #1a1a1a; |
|||
border-bottom: 2upx solid #D8D8D8; |
|||
|
|||
} |
|||
.ybi-total{ |
|||
text-align: right; |
|||
font-size: 28upx; |
|||
font-weight: 500; |
|||
line-height: 40upx; |
|||
color: #333; |
|||
@include textHide(1); |
|||
>text{ |
|||
color: #9A9A9D; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
</style> |
|||
|
After Width: 60 | Height: 60 | Size: 409 B |
Write
Preview
Loading…
Cancel
Save
Reference in new issue