刘嘉炜
3 years ago
16 changed files with 825 additions and 9 deletions
-
63src/components/order_list/ym_card/ym_card.vue
-
5src/js/api.js
-
2src/js/once_name.js
-
24src/pages.json
-
17src/pages/order_list/order_list.vue
-
6src/pages/write_off/operate/operate.vue
-
127src/pages/write_off/ym_card_gated/ym_card_gated.vue
-
192src/pages/write_off/ym_confirm/ym_confirm.vue
-
4src/subpackage/order/js/api.js
-
3src/subpackage/order/pages/order_manage/order_manage.vue
-
279src/subpackage/order/pages/ym_card/detail/detail.vue
-
112src/subpackage/order/pages/ym_card/use_record/use_record.vue
-
BINsrc/subpackage/order/static/images/order_manage/order_19.png
-
BINsrc/subpackage/order/static/images/ym_card/status_1.png
-
BINsrc/subpackage/order/static/images/ym_card/status_2.png
-
BINsrc/subpackage/order/static/images/ym_card/status_3.png
@ -0,0 +1,63 @@ |
|||
<template> |
|||
<view class="ym-card-container" @click="toInfo"> |
|||
<a-header :source="orderInfo.extension.name || '-'" :status="statusTxt(orderInfo.status)"></a-header> |
|||
<view class="ycc-info"> |
|||
<a-line :value="orderInfo.card_info.name || '-'"> |
|||
<block slot="name">卡名称:</block> |
|||
</a-line> |
|||
<a-line :value="orderInfo.card_no || '-'"> |
|||
<block slot="name">年月卡号:</block> |
|||
</a-line> |
|||
<a-line :value="orderInfo.mobile || '-'"> |
|||
<block slot="name">手机号码:</block> |
|||
</a-line> |
|||
<a-line :value="'至' + (orderInfo.expired_at || '-')"> |
|||
<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, |
|||
}, |
|||
props: { |
|||
orderInfo: { |
|||
default: { |
|||
card_info: {}, |
|||
extension: {} |
|||
}, |
|||
} |
|||
}, |
|||
methods: { |
|||
toInfo(){ |
|||
let { orderInfo } = this; |
|||
util.routeTo(`/subpackage/order/pages/ym_card/detail/detail?id=${orderInfo.id}&card_no=${orderInfo.card_no}`, 'nT'); |
|||
}, |
|||
statusTxt(status){ |
|||
let _obj = { |
|||
0: '待激活', |
|||
1: '使用中', |
|||
2: '已失效', |
|||
3: '已退卡', |
|||
} |
|||
return _obj[status] || '-' |
|||
} |
|||
} |
|||
} |
|||
</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,127 @@ |
|||
<template> |
|||
<view class="ym-card-gated"> |
|||
<view class="ycg-stadium">{{ pageInfo.orderInfo.extension.stadium_name || '-' }}</view> |
|||
<view class="ycg-suc-tip">核销成功</view> |
|||
<view class="ycg-back-btn" @click="backBtn">返回继续核销</view> |
|||
<view class="ycg-open-tip" v-if="pageInfo.gates&&pageInfo.gates.length">如需开门,请点击</view> |
|||
<view class="ycg-btn-ls"> |
|||
<view class="ybl-item" v-for="(e, i) in pageInfo.gates" :key="i"> |
|||
<view class="yi-name">{{ e.hardware_name || '-' }}</view> |
|||
<view class="yi-btn" @click="openBtn(e.id)">开门</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import { API } from '../../../js/api'; |
|||
import { servers } from '../../../js/server'; |
|||
import { WRITE_OFF_YM_ORDER_INFO } from '../../../js/once_name'; |
|||
import util from '../../../utils/util'; |
|||
export default { |
|||
data(){ |
|||
return { |
|||
pageInfo: { |
|||
orderInfo: { extension: {} }, |
|||
gates: [], |
|||
} |
|||
} |
|||
}, |
|||
onLoad(options){ |
|||
util.$_once(WRITE_OFF_YM_ORDER_INFO, data => { |
|||
console.warn(data) |
|||
this.pageInfo = data; |
|||
}) |
|||
}, |
|||
methods: { |
|||
backBtn(){ |
|||
util.routeTo(); |
|||
}, |
|||
openBtn: util.debounce(function(id){ |
|||
let { pageInfo } = this; |
|||
util.showLoad(); |
|||
servers.get({ |
|||
url: API.writeOff.userMonthlyCardOpenGate, |
|||
data: { gate_id: id, card_no: pageInfo.orderInfo.card_no }, |
|||
isDefaultGet: false |
|||
}) |
|||
.then(res=>{ |
|||
util.hideLoad(); |
|||
if(res.data.code == 0){ |
|||
util.showNone(res.data.message || '操作成功!'); |
|||
}else{ |
|||
util.showNone(res.data.message || '操作失败!'); |
|||
} |
|||
}) |
|||
.catch(util.hideLoad) |
|||
}, 300, true) |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
@import '~style/public.scss'; |
|||
page{ |
|||
background-color: #fff; |
|||
} |
|||
.ym-card-gated{ |
|||
padding: 0 30upx; |
|||
.ycg-stadium{ |
|||
padding: 30upx 0; |
|||
font-size: 32upx; |
|||
color: #1a1a1a; |
|||
border-bottom: 2upx solid #E5E5E5; |
|||
} |
|||
.ycg-suc-tip{ |
|||
padding: 100upx 0 200upx; |
|||
text-align: center; |
|||
line-height: 60upx; |
|||
font-size: 50upx; |
|||
color: #333; |
|||
} |
|||
.ycg-back-btn{ |
|||
margin: 0 auto 50upx; |
|||
width: 250upx; |
|||
height: 88upx; |
|||
line-height: 88upx; |
|||
text-align: center; |
|||
font-size: 32upx; |
|||
color: $themeColor; |
|||
border: 2upx solid $themeColor; |
|||
border-radius: 6upx; |
|||
} |
|||
.ycg-open-tip{ |
|||
margin-bottom: 50upx; |
|||
font-size: 24upx; |
|||
line-height: 32upx; |
|||
color: #9a9a9d; |
|||
} |
|||
.ycg-btn-ls{ |
|||
padding: 0 24upx; |
|||
.ybl-item{ |
|||
border-bottom: 2upx solid #f2f2f7; |
|||
padding: 30upx 0; |
|||
@include centerFlex(space-between); |
|||
.yi-name{ |
|||
flex-grow: 1; |
|||
font-size: 28upx; |
|||
line-height: 32upx; |
|||
color: #333; |
|||
@include textHide(1); |
|||
} |
|||
.yi-btn{ |
|||
flex-shrink: 0; |
|||
margin-left: 20upx; |
|||
width: 128upx; |
|||
height: 66upx; |
|||
line-height: 66upx; |
|||
font-size: 32upx; |
|||
text-align: center; |
|||
border-radius: 10upx; |
|||
background-color: $themeColor; |
|||
color: #fff; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</style> |
@ -0,0 +1,192 @@ |
|||
<template> |
|||
<view class="ym-confirm"> |
|||
<view class="yc-header"> |
|||
<view class="yh-stadium">{{ orderInfo.extension.stadium_name || '-' }}</view> |
|||
<view class="yh-info"> |
|||
<view>今天剩余可使用:{{ orderInfo.extension.rest_number || '0' }}次</view> |
|||
<view>进场状态:<text>{{ orderInfo.enter_status == 0?'离场':orderInfo.enter_status == 1?'进场':'' }}</text></view> |
|||
<view v-if="orderInfo.enter_status == 1">进场时间:{{ orderInfo.latest_enter_time || '-' }}</view> |
|||
</view> |
|||
</view> |
|||
<view class="yc-user-info"> |
|||
<view class="yui-tit">持卡人信息</view> |
|||
<view class="yui-line">手机号码:{{ orderInfo.mobile || '-' }}</view> |
|||
<view class="yui-line">用户昵称:{{ orderInfo.nickname || '-' }}</view> |
|||
</view> |
|||
<view class="yc-photo" v-if="!!orderInfo.user_face"> |
|||
<view>照片</view> |
|||
<image mode="aspectFit" @click="previewImg(orderInfo.user_face)" :src="orderInfo.user_face"></image> |
|||
</view> |
|||
|
|||
<view class="yc-card-mes"> |
|||
<view class="ycm-tit">年月卡信息</view> |
|||
<view class="ycm-line">年月卡名称:{{ orderInfo.card_info.name || '-' }}</view> |
|||
<view class="ycm-line">年月卡卡号:{{ orderInfo.card_no || '-' }}</view> |
|||
<view class="ycm-line">验证码:{{ orderInfo.verify_code || '-' }}</view> |
|||
<view class="ycm-line">生成时间:{{ orderInfo.created_at || '-' }}</view> |
|||
<view class="ycm-line">失效时间:{{ orderInfo.expired_at || '-' }}</view> |
|||
</view> |
|||
<view class="yc-btns"> |
|||
<view class="green" @click="confirmBtn">确认核销</view> |
|||
<!-- <view>仅核销</view> --> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import util from '../../../utils/util'; |
|||
import { API } from '../../../js/api'; |
|||
import { servers } from '../../../js/server'; |
|||
import { WRITE_OFF_YM_ORDER_INFO, WRITE_OFF_ORDER_INFO } from '../../../js/once_name'; |
|||
export default { |
|||
data(){ |
|||
return { |
|||
type: '', // verify_code -> 5: 验证码核销(商家助手) | decrypt_text -> 6: 扫码核销(商家助手) |
|||
orderInfo: { |
|||
extension: {}, |
|||
card_info: {} |
|||
} |
|||
} |
|||
}, |
|||
onLoad(options){ |
|||
if(options.type)this.type = options.type || ''; |
|||
util.$_once(WRITE_OFF_ORDER_INFO, data => { |
|||
console.warn(data) |
|||
this.orderInfo = data; |
|||
}) |
|||
}, |
|||
methods: { |
|||
previewImg(url){ |
|||
uni.previewImage({ urls: [ url ] }); |
|||
}, |
|||
confirmBtn: util.debounce(function(){ |
|||
let { orderInfo, type } = this; |
|||
servers.post({ |
|||
url: API.writeOff.userMonthlyCardVerify, |
|||
data: { |
|||
brand_id: orderInfo.brand_id, |
|||
card_no: orderInfo.card_no, |
|||
stadium_id: orderInfo.stadium_id, |
|||
type: type == 'verify_code'? 5 : 6, |
|||
}, |
|||
isDefaultGet: false, |
|||
}) |
|||
.then(res=>{ |
|||
if(res.data.code == 0){ |
|||
util.showNone(res.data.message || '操作成功!'); |
|||
let { orderInfo } = this; |
|||
let _ls = res.data.data&&res.data.data.gates || []; |
|||
setTimeout(_=>{ |
|||
util.$_emit(WRITE_OFF_YM_ORDER_INFO, { |
|||
orderInfo, |
|||
gates: _ls |
|||
}); |
|||
util.routeTo(`/pages/write_off/ym_card_gated/ym_card_gated`, 'nT'); |
|||
}, 1200); |
|||
}else{ |
|||
util.showNone(res.data.message || '操作失败!'); |
|||
} |
|||
}) |
|||
}, 300, true) |
|||
} |
|||
} |
|||
</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; |
|||
font-size: 32upx; |
|||
color: #1a1a1a; |
|||
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; |
|||
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> |
@ -0,0 +1,279 @@ |
|||
<template> |
|||
<view class="ym-card-info"> |
|||
<view class="yci-main"> |
|||
<view class="yci-box ym-card-info"> |
|||
<view class="yci-stadium-name">{{ orderInfo.extension.name || '-' }}</view> |
|||
<view class="yci-line"> |
|||
<view>年月卡名称:{{ orderInfo.card_info.name || '-' }}</view> |
|||
<view>年月卡卡号:{{ orderInfo.card_no || '-' }}</view> |
|||
<view>有效期:至{{ orderInfo.expired_at || '-' }}</view> |
|||
</view> |
|||
<view class="yci-btn"> |
|||
<view @click="toRecord">使用记录</view> |
|||
</view> |
|||
<view class="yci-status-tag"> |
|||
<image mode="aspectFit" :src="getTagImgPath(orderInfo.status)"></image> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="yci-box ym-user"> |
|||
<view class="yci-tit">持卡人信息</view> |
|||
<a-line :value="orderInfo.mobile || '-'"> |
|||
<block slot="name">手机号码:</block> |
|||
</a-line> |
|||
<a-line :value="orderInfo.nickname || '-'"> |
|||
<block slot="name">用户昵称:</block> |
|||
</a-line> |
|||
<view class="yu-line">照片:<text @click="changeFaceImgBtn">更改照片</text></view> |
|||
<image class="yu-img" mode="aspectFit" :src="orderInfo.user_face"></image> |
|||
</view> |
|||
|
|||
<view class="yci-box yci-buy-info" v-if="orderInfo.status == 1 || orderInfo.status == 2 || orderInfo.status == 3"> |
|||
<view class="yci-tit">购卡信息</view> |
|||
<view class="ybi-name">年月卡名称:{{ orderInfo.card_info.name || '-' }}</view> |
|||
<s-line :keyname="'金额小计'" :value="'¥' + (orderInfo.extension.amount || '0')"></s-line> |
|||
<s-line :keyname="'积分抵扣'" :value="'¥' + (orderInfo.extension.deduction_amount|| '0')"></s-line> |
|||
<s-line :keyname="'折扣金额'" :value="'¥' + (orderInfo.extension.discount_amount || '0')"></s-line> |
|||
<s-line :keyname="'优惠券优惠'" :value="'¥' + (orderInfo.extension.coupons_amount || '0')"></s-line> |
|||
<view class="ybi-total"><text>合计支付:</text>¥ {{ orderInfo.extension.pay_amount || '0' }}</view> |
|||
</view> |
|||
|
|||
<view class="yci-box yci-pay-info" v-if="orderInfo.status == 1 || orderInfo.status == 2 || orderInfo.status == 3"> |
|||
<view class="yci-tit">支付信息</view> |
|||
<p-line :keyname="'订单编号'" :value="orderInfo.order_no || '-'" ></p-line> |
|||
<p-line :keyname="'支付方式'" :value="orderInfo.extension.pay_type_text || '-'" ></p-line> |
|||
<p-line :keyname="'支付时间'" :value="orderInfo.extension.pay_time || '-'" ></p-line> |
|||
<p-line :keyname="'微信交易号'" :value="orderInfo.extension.trade_no || '-'" ></p-line> |
|||
<p-line :keyname="'创建途径'" :value="orderInfo.source || '-'" ></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'; |
|||
import util from '../../../../../utils/util'; |
|||
import { ORDER_API } from '../../../js/api'; |
|||
import server from '../../../js/server'; |
|||
export default { |
|||
components: { |
|||
'a-line': a_line, |
|||
's-line': s_line, |
|||
'p-line': p_line, |
|||
|
|||
}, |
|||
data(){ |
|||
return { |
|||
orderInfo: { |
|||
card_info: {}, |
|||
extension: {} |
|||
}, |
|||
optionsQuery: {}, |
|||
} |
|||
}, |
|||
onLoad(options){ |
|||
this.getCardInfo({ |
|||
id: options.id, |
|||
card_no: options.card_no |
|||
}); |
|||
this.optionsQuery = options || {}; |
|||
}, |
|||
methods: { |
|||
changeFaceImgBtn(){ |
|||
uni.chooseImage({ |
|||
count: 1, |
|||
success: imgRes =>{ |
|||
this.upLoadImg(imgRes || {}); |
|||
}, |
|||
failMsg: imgErr => { |
|||
console.warn('chooseImage err --->' , imgErr); |
|||
util.showNone('选择图片失败!'); |
|||
} |
|||
}) |
|||
}, |
|||
upLoadImg(imgRes){ |
|||
util.showLoad(); |
|||
server.uploadFile({ |
|||
url: ORDER_API.ymCardInfoFace, |
|||
filePath: imgRes.tempFilePaths[0] || '', |
|||
}) |
|||
.then(e=>{ |
|||
util.hideLoad(); |
|||
let _res = util.jsonPar(e.data); |
|||
if(_res.code == 0){ |
|||
let _url = _res.data.url || ''; |
|||
this.saveFaceImg(_url); |
|||
}else{ |
|||
console.error('上传图片失败--->',_res); |
|||
util.showNone(_res.message || '上传图片失败,请重试!') |
|||
} |
|||
}) |
|||
.catch(err=>{ |
|||
util.hideLoad(); |
|||
console.error('上传图片失败--->',err); |
|||
util.showNone('上传图片失败,稍后重试!') |
|||
}) |
|||
}, |
|||
saveFaceImg(faceUrl){ |
|||
let { optionsQuery } = this; |
|||
util.showLoad(); |
|||
server.post({ |
|||
url: ORDER_API.ymCardInfoFaceSave, |
|||
data: { |
|||
card_no: optionsQuery.card_no, |
|||
face: faceUrl, |
|||
}, |
|||
isDefaultGet: false, |
|||
}) |
|||
.then(res=>{ |
|||
util.hideLoad(); |
|||
if(res.data.code == 0){ |
|||
util.showNone(res.data.message || '操作成功!'); |
|||
let { optionsQuery } = this; |
|||
setTimeout(_=>{ |
|||
this.getCardInfo({ |
|||
id: optionsQuery.id, |
|||
card_no: optionsQuery.card_no |
|||
}); |
|||
}, 1200); |
|||
}else{ |
|||
util.showNone(res.data.message || '操作失败!'); |
|||
} |
|||
}) |
|||
}, |
|||
getTagImgPath(status){ |
|||
if(!status)return '' |
|||
return `/subpackage/order/static/images/ym_card/status_${status}.png` |
|||
}, |
|||
getCardInfo({id, card_no}){ |
|||
util.showLoad(); |
|||
server.get({ |
|||
url: ORDER_API.userMonthlyCardInfo, |
|||
data: { id, card_no }, |
|||
failMsg: '加载失败!' |
|||
}) |
|||
.then(res=>{ |
|||
util.hideLoad(); |
|||
this.orderInfo = res || {}; |
|||
}) |
|||
}, |
|||
toRecord(){ |
|||
let { optionsQuery } = this; |
|||
util.routeTo(`/subpackage/order/pages/ym_card/use_record/use_record?card_no=${optionsQuery.card_no}`, 'nT'); |
|||
}, |
|||
} |
|||
} |
|||
</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{ |
|||
position: relative; |
|||
.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; |
|||
} |
|||
} |
|||
.yci-status-tag{ |
|||
position: absolute; |
|||
right: 0; |
|||
top: 0; |
|||
width: 132upx; |
|||
height: 132upx; |
|||
overflow: hidden; |
|||
border-top-right-radius: 10upx; |
|||
>image{ |
|||
width: 100%; |
|||
height: 100%; |
|||
} |
|||
} |
|||
} |
|||
.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; |
|||
|
|||
} |
|||
} |
|||
.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> |
@ -0,0 +1,112 @@ |
|||
<template> |
|||
<view class="use-record"> |
|||
<view class="ur-list"> |
|||
<view class="ul-item" v-for="(e, i) in recordLs" :key="i"> |
|||
<view class="ui-header"> |
|||
<image class="uh-img" mode="aspectFit" :src="e.stadium_logo"></image> |
|||
<view>{{ e.stadium_name || '-' }}</view> |
|||
</view> |
|||
<view class="uh-lines"> |
|||
<view><text>验证方式:</text>{{ e.verify_type || '-' }}</view> |
|||
<view><text>核销时间:</text>{{ e.verify_time || '-' }}</view> |
|||
<view><text>离场时间:</text>{{ e.leave_time || '-' }}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import util from '../../../../../utils/util'; |
|||
import { ORDER_API } from '../../../js/api'; |
|||
import server from '../../../js/server'; |
|||
export default { |
|||
data(){ |
|||
return { |
|||
recordLs: [], |
|||
page: 1, |
|||
card_no: '', |
|||
} |
|||
}, |
|||
onLoad(options){ |
|||
this.card_no = options.card_no || ''; |
|||
this.getRecordLs({ |
|||
card_no: options.card_no, |
|||
}); |
|||
}, |
|||
onReachBottom(){ |
|||
let { card_no, page } = this; |
|||
this.getRecordLs({ |
|||
card_no: card_no, |
|||
page: ++page, |
|||
}) |
|||
}, |
|||
methods: { |
|||
getRecordLs({ |
|||
card_no, |
|||
page = 1, |
|||
page_size = 15 |
|||
}){ |
|||
util.showLoad(); |
|||
server.get({ |
|||
url: ORDER_API.ymCardUsage, |
|||
data: { card_no, page_size, page }, |
|||
failMsg: '加载失败!' |
|||
}) |
|||
.then(res=>{ |
|||
util.hideLoad(); |
|||
let _ls = res.list || []; |
|||
if(page == 1)return this.recordLs = _ls; |
|||
if(!_ls.length)return util.showNone('没有更多!'); |
|||
this.page = page; |
|||
this.recordLs = [...this.recordLs, ..._ls]; |
|||
}) |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
@import '~style/public.scss'; |
|||
.use-record{ |
|||
.ur-list{ |
|||
.ul-item{ |
|||
margin-bottom: 24upx; |
|||
padding: 30upx; |
|||
background-color: #fff; |
|||
.ui-header{ |
|||
height: 100upx; |
|||
border-bottom: 2upx solid #f2f2f7; |
|||
@include centerFlex(space-between); |
|||
.uh-img{ |
|||
flex-shrink: 0; |
|||
flex-grow: 0; |
|||
margin-right: 10upx; |
|||
width: 30upx; |
|||
height: 30upx; |
|||
} |
|||
>view{ |
|||
flex-grow: 1; |
|||
line-height: 44upx; |
|||
font-size: 32upx; |
|||
color: #333; |
|||
@include textHide(1); |
|||
} |
|||
} |
|||
.uh-lines{ |
|||
padding: 14upx 16upx 10upx; |
|||
>view{ |
|||
font-size: 28upx; |
|||
line-height: 50upx; |
|||
color: #333; |
|||
@include textHide(1); |
|||
>text{ |
|||
color: #9A9A9D; |
|||
} |
|||
} |
|||
} |
|||
|
|||
} |
|||
} |
|||
} |
|||
</style> |
After Width: 120 | Height: 120 | Size: 811 B |
After Width: 132 | Height: 132 | Size: 13 KiB |
After Width: 132 | Height: 132 | Size: 2.0 KiB |
After Width: 132 | Height: 132 | Size: 2.1 KiB |
Write
Preview
Loading…
Cancel
Save
Reference in new issue