5 Commits
a27123878c
...
5b0f63063f
Author | SHA1 | Message | Date |
---|---|---|---|
郑锦全 | 5b0f63063f |
增加订单管理权限
|
4 years ago |
郑锦全 | 3cee378484 |
Merge branch 'iteration' of https://git.ouxuan.net/APP/ox_zhiNengZhuShou into iteration
|
4 years ago |
郑锦全 | 20f470cdfb |
add api order
|
4 years ago |
郑锦全 | 72e393c32c |
Merge branch 'iteration' of https://git.ouxuan.net/APP/ox_zhiNengZhuShou into iteration
|
4 years ago |
郑锦全 | ae34e825b7 |
fix style
|
4 years ago |
17 changed files with 1683 additions and 1183 deletions
-
66src/components/reservation_order/reservation_order.vue
-
28src/components/timing_order/timing_order.vue
-
5src/js/api.js
-
10src/pages.json
-
8src/pages/index/index.vue
-
27src/pages/order_list/order_list.vue
-
1src/store/index.js
-
546src/subpackage/device/components/order/reservation_people/reservation_people.vue
-
828src/subpackage/device/components/order/reservation_people_detail/reservation_people_detail.vue
-
103src/subpackage/device/components/order/reservation_site_detail/reservation_site_detail.vue
-
110src/subpackage/device/components/order/timing_detail/timing_detail.vue
-
12src/subpackage/device/js/device_api.js
-
98src/subpackage/device/pages/order_details/order_details.vue
-
32src/subpackage/device/pages/order_details/reservation_details/reservation_details.vue
-
2src/subpackage/device/pages/order_manage/order_manage.vue
@ -1,546 +0,0 @@ |
|||||
<template> |
|
||||
<view class="reservation-people"> |
|
||||
<view class="rp-head"> |
|
||||
<view class="rh-store"> |
|
||||
<image></image> |
|
||||
<view>欧轩智能场馆(羽毛球永泰店)</view> |
|
||||
</view> |
|
||||
<view class="rh-line"> |
|
||||
<view>订单编号:<text>2352534645764747</text></view> |
|
||||
<view><text :class="[true?'rl-active':'']">待使用</text></view> |
|
||||
</view> |
|
||||
<view class="rh-line"> |
|
||||
<view>创建时间:<text>2019-06-06 12:00:06</text></view> |
|
||||
</view> |
|
||||
<view class="rh-line"> |
|
||||
<view>用户昵称:<text>i术生</text></view> |
|
||||
</view> |
|
||||
<view class="rh-line"> |
|
||||
<view>创建时间:<text>2019-06-06 12:00:06</text></view> |
|
||||
</view> |
|
||||
<!-- 待使用 已绑定ic卡 --> |
|
||||
<block v-if="false"> |
|
||||
<view class="rh-line"> |
|
||||
<view>已绑定IC卡:<text>000000000213</text></view> |
|
||||
</view> |
|
||||
<view class="rh-line"> |
|
||||
<view>绑定时间:<text>2019-07-06 12:06:03</text></view> |
|
||||
</view> |
|
||||
</block> |
|
||||
|
|
||||
<!-- 待使用 未绑定ic卡 --> |
|
||||
<view :class="['rh-ic', false?'rh-ic-untie':'']" @click="isShowBindIC = !isShowBindIC">{{ false?'解绑IC卡':'绑定IC卡' }}</view> |
|
||||
</view> |
|
||||
<view class="rp-box"> |
|
||||
<view class="rb-title">验证信息<text>(1张可用)</text></view> |
|
||||
<!-- 人次+随时用 --> |
|
||||
<view class="rb-time" v-if="true"> |
|
||||
<view>有效期至:</view> |
|
||||
<text>2019年6月18日 10:30:40 </text> |
|
||||
</view> |
|
||||
<!-- 人次+指定日期 --> |
|
||||
<view class="rb-time" v-if="false"> |
|
||||
<view>使用日期:</view> |
|
||||
<text>2020-12-25(周五) 上午场</text> |
|
||||
</view> |
|
||||
<view class="rb-code"> |
|
||||
<view class="rc-item" v-for="i in 2" :key="i"> |
|
||||
<view class="ri-tit">验证码{{i+1}}:</view> |
|
||||
<view class="ri-section"> |
|
||||
<view class="rs-view">1223 5512 4534 (已使用)</view> |
|
||||
<view class="rs-view">核销方式:扫码核销</view> |
|
||||
<view class="rs-view">核销时间:2019-06-01 13:20</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
<view class="rp-box"> |
|
||||
<view class="rb-title">预订信息</view> |
|
||||
<view class="rb-name"> |
|
||||
<view>单人羽毛球次卡<text>(可随时使用)</text></view> |
|
||||
</view> |
|
||||
<view class="rb-line"> |
|
||||
<view>数量:<text>3</text></view> |
|
||||
</view> |
|
||||
<view class="rb-line"> |
|
||||
<view>类型:<text>平日+上午场</text></view> |
|
||||
</view> |
|
||||
<view class="rb-section"> |
|
||||
<view class="rs-line"> |
|
||||
<view>金额小计</view> |
|
||||
<view>¥6</view> |
|
||||
</view> |
|
||||
<view class="rs-line"> |
|
||||
<view>积分抵扣</view> |
|
||||
<view>-¥6</view> |
|
||||
</view> |
|
||||
<view class="rs-line"> |
|
||||
<view>折扣金额</view> |
|
||||
<view>-¥0</view> |
|
||||
</view> |
|
||||
<view class="rs-line"> |
|
||||
<view>优惠券优惠</view> |
|
||||
<view>-¥1</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
<view class="rb-total"> |
|
||||
<view>合计支付:<text>¥</text><text>5</text></view> |
|
||||
</view> |
|
||||
</view> |
|
||||
<view class="rp-box"> |
|
||||
<view class="rb-title">支付信息</view> |
|
||||
<view class="rb-line"> |
|
||||
<view>支付方式:<text>微信支付</text></view> |
|
||||
</view> |
|
||||
<view class="rb-line"> |
|
||||
<view>支付时间:<text>2019年6月18日 10:30:40</text></view> |
|
||||
</view> |
|
||||
<view class="rb-line"> |
|
||||
<view>微信交易号:<text>424736746998493847989434</text></view> |
|
||||
</view> |
|
||||
</view> |
|
||||
|
|
||||
<!-- 弹框 绑定ic卡 --> |
|
||||
<view class="ox-dark-mask" v-if="isShowBindIC" @touchmove.stop.prevent="moveHandle"> |
|
||||
<view class="odm-ic-modal"> |
|
||||
<view class="oim-close"> |
|
||||
<image src="/static/images/icon/x_close.png" @click="isShowBindIC = !isShowBindIC"></image> |
|
||||
</view> |
|
||||
<view class="oim-tit">绑定IC卡</view> |
|
||||
<view class="oim-card"> |
|
||||
<view class="oc-sign">*</view> |
|
||||
<view class="oc-depot">仓</view> |
|
||||
<input type="number" placeholder="请输入卡号" v-model="icNumber" /> |
|
||||
<image class="oc-icon" src="/subpackage/device/static/images/scan_code.png"></image> |
|
||||
</view> |
|
||||
<view class="oim-tips">可直接输入卡号、扫描条码或在已选择仓库下选择卡号</view> |
|
||||
<view class="oim-ipt"> |
|
||||
<input type="text" placeholder="单价" v-model="icPrice" /> |
|
||||
</view> |
|
||||
<view class="oim-ipt"> |
|
||||
<input type="text" placeholder="其他费用(选填)" v-model="icOtherFee" /> |
|
||||
</view> |
|
||||
<view class="oim-ipt"> |
|
||||
<input type="text" placeholder="备注说明(选填)" v-model="icRemarks" /> |
|
||||
</view> |
|
||||
<view class="oim-btn" hover-class="hover-active" @click="modalBtn(1)">确认</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
<!-- 弹框 选择ic卡 --> |
|
||||
<view class="ox-dark-mask" v-if="isShowSelectIC" @touchmove.stop.prevent="moveHandle"> |
|
||||
<view class="odm-select-modal"> |
|
||||
<view class="osm-close"> |
|
||||
<image src="/static/images/icon/x_close.png" @click="isShowSelectIC = !isShowSelectIC"></image> |
|
||||
</view> |
|
||||
<view class="osm-tit">筛选卡号</view> |
|
||||
<view class="osm-ipt"> |
|
||||
<input type="text" placeholder="请选择仓库" v-model="icRemarks" /> |
|
||||
<image src="/subpackage/device/static/images/arrow_b2.png"></image> |
|
||||
</view> |
|
||||
<view class="osm-ipt"> |
|
||||
<input type="text" placeholder="请输入卡号" v-model="icRemarks" /> |
|
||||
</view> |
|
||||
<view class="osm-btn" hover-class="hover-active" @click="modalBtn(2)">确认</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
<!-- 弹框 ic卡绑定成功 --> |
|
||||
<view class="ox-dark-mask" v-if="isShowSuccessIC" @touchmove.stop.prevent="moveHandle"> |
|
||||
<view class="odm-select-modal"> |
|
||||
<view class="osm-title">绑定成功</view> |
|
||||
<view class="osm-line"> |
|
||||
<view>卡号:0000023</view> |
|
||||
<view>关联订单号:yy202101294566</view> |
|
||||
<view>门店名称:广州欧轩智能场馆(永泰店)</view> |
|
||||
</view> |
|
||||
<view class="osm-line"> |
|
||||
<view>订单类型:预约订单</view> |
|
||||
<view>项目名称:开业优惠卡(10次)</view> |
|
||||
<view>购买者昵称:yiming</view> |
|
||||
</view> |
|
||||
<view class="osm-btn" hover-class="hover-active" @click="isShowSuccessIC = !isShowSuccessIC">好的</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
export default { |
|
||||
data() { |
|
||||
return { |
|
||||
isShowBindIC: false, |
|
||||
isShowSelectIC: false, |
|
||||
isShowSuccessIC: false, |
|
||||
icNumber: '', |
|
||||
icPrice: '', |
|
||||
icOtherFee: '', |
|
||||
icRemarks: '', |
|
||||
}; |
|
||||
}, |
|
||||
methods:{ |
|
||||
moveHandle(){}, |
|
||||
modalBtn(type){ |
|
||||
if(type == 1){ |
|
||||
this.isShowBindIC = false |
|
||||
this.isShowSelectIC = true; |
|
||||
return; |
|
||||
} |
|
||||
if(type == 2){ |
|
||||
this.isShowSelectIC = false; |
|
||||
this.isShowSuccessIC = true; |
|
||||
return; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
<style lang="scss" > |
|
||||
@import '~style/public.scss'; |
|
||||
.reservation-people{ |
|
||||
margin-bottom: 24rpx; |
|
||||
.rp-head{ |
|
||||
margin: 24rpx 24rpx 0rpx; |
|
||||
padding: 30rpx; |
|
||||
background-color: #FFF; |
|
||||
border-radius: 10rpx 10rpx 0px 0px; |
|
||||
.rh-store{ |
|
||||
padding-bottom: 26rpx; |
|
||||
margin-bottom: 18rpx; |
|
||||
border-bottom: 2rpx solid #D8D8D8; |
|
||||
display: flex; |
|
||||
justify-content: flex-start; |
|
||||
>image{ |
|
||||
flex-shrink: 0; |
|
||||
width: 40rpx; |
|
||||
height: 40rpx; |
|
||||
background-color: skyblue; |
|
||||
|
|
||||
} |
|
||||
>view{ |
|
||||
flex-grow: 1; |
|
||||
margin-left: 14rpx; |
|
||||
color: #333333; |
|
||||
font-size: 28rpx; |
|
||||
} |
|
||||
} |
|
||||
.rh-line{ |
|
||||
margin-top: 8rpx; |
|
||||
@include centerFlex(space-between); |
|
||||
>view{ |
|
||||
line-height: 40rpx; |
|
||||
font-size: 28rpx; |
|
||||
&:first-child{ |
|
||||
color: #9A9A9D; |
|
||||
>text{ |
|
||||
color: #333333; |
|
||||
} |
|
||||
} |
|
||||
&:nth-child(2){ |
|
||||
>text{ |
|
||||
color: #9A9A9D; |
|
||||
} |
|
||||
.rl-active{ |
|
||||
color: #009874; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
.rh-ic{ |
|
||||
margin-top: 40rpx; |
|
||||
border-radius: 10rpx; |
|
||||
background-color: #009874; |
|
||||
color: #FFFFFF; |
|
||||
font-size: 32rpx; |
|
||||
text-align: center; |
|
||||
width: 500rpx; |
|
||||
// height: 112rpx; |
|
||||
// line-height: 112rpx; |
|
||||
padding: 34rpx 0rpx; |
|
||||
margin-left: 71rpx; |
|
||||
} |
|
||||
.rh-ic-untie{ |
|
||||
padding: 32rpx 0rpx; |
|
||||
color: #009874; |
|
||||
border: 2rpx solid #009874; |
|
||||
background-color: #fff; |
|
||||
} |
|
||||
} |
|
||||
.rp-box{ |
|
||||
margin: 24rpx 24rpx 0rpx; |
|
||||
padding: 30rpx; |
|
||||
background-color: #FFF; |
|
||||
border-radius: 10rpx; |
|
||||
.rb-title{ |
|
||||
color: #9A9A9D; |
|
||||
font-size: 28rpx; |
|
||||
margin-bottom: 20rpx; |
|
||||
>text{ |
|
||||
color: #333333; |
|
||||
font-size: 28rpx; |
|
||||
margin-left: 28rpx; |
|
||||
} |
|
||||
} |
|
||||
.rb-time{ |
|
||||
line-height: 48rpx; |
|
||||
display: flex; |
|
||||
justify-content: flex-start; |
|
||||
>view{ |
|
||||
color: #9A9A9D; |
|
||||
font-size: 28rpx; |
|
||||
} |
|
||||
>text{ |
|
||||
color: #333333; |
|
||||
font-size: 28rpx; |
|
||||
} |
|
||||
} |
|
||||
.rb-code{ |
|
||||
.rc-item{ |
|
||||
display: flex; |
|
||||
justify-content: flex-start; |
|
||||
margin-top: 24rpx; |
|
||||
.ri-tit{ |
|
||||
color: #9A9A9D; |
|
||||
font-size: 28rpx; |
|
||||
line-height: 46rpx; |
|
||||
} |
|
||||
.ri-section{ |
|
||||
.rs-view{ |
|
||||
color: #333333; |
|
||||
font-size: 28rpx; |
|
||||
line-height: 46rpx; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
.rb-name{ |
|
||||
margin-bottom: 8rpx; |
|
||||
color: #333333; |
|
||||
>view{ |
|
||||
font-size: 28rpx; |
|
||||
} |
|
||||
>text{ |
|
||||
font-size: 24rpx; |
|
||||
} |
|
||||
} |
|
||||
.rb-line{ |
|
||||
>view{ |
|
||||
line-height: 52rpx; |
|
||||
font-size: 28rpx; |
|
||||
color: #9A9A9D; |
|
||||
>text{ |
|
||||
color: #333333; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
} |
|
||||
.rb-section{ |
|
||||
margin: 30rpx 0rpx 24rpx; |
|
||||
border-top: 2rpx solid #D8D8D8; |
|
||||
.rs-line{ |
|
||||
margin-top: 26rpx; |
|
||||
@include centerFlex(space-between); |
|
||||
>view{ |
|
||||
color: #333333; |
|
||||
&:first-child{ |
|
||||
font-size: 28rpx; |
|
||||
} |
|
||||
&:nth-child(2){ |
|
||||
font-size: 24rpx; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
.rb-total{ |
|
||||
@include centerFlex(flex-end); |
|
||||
>view{ |
|
||||
color: #333333; |
|
||||
font-size: 28rpx; |
|
||||
>text{ |
|
||||
color: #FF873D; |
|
||||
&:first-child{ |
|
||||
font-size: 28rpx; |
|
||||
} |
|
||||
&:nth-child(2){ |
|
||||
font-size: 36rpx; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
.odm-ic-modal { |
|
||||
position: absolute; |
|
||||
left: 65rpx; |
|
||||
top: 10%; |
|
||||
background-color: #fff; |
|
||||
width: 620rpx; |
|
||||
padding: 30rpx 0rpx 80rpx; |
|
||||
border-radius: 10rpx; |
|
||||
display: flex; |
|
||||
flex-direction: column; |
|
||||
align-items: center; |
|
||||
justify-content: center; |
|
||||
.oim-close{ |
|
||||
width: 100%; |
|
||||
@include centerFlex(flex-end); |
|
||||
>image{ |
|
||||
width: 32rpx; |
|
||||
height: 32rpx; |
|
||||
margin-right: 30rpx; |
|
||||
} |
|
||||
} |
|
||||
.oim-tit { |
|
||||
color: #333; |
|
||||
font-size: 32rpx; |
|
||||
font-weight: 700; |
|
||||
margin-top: 16rpx; |
|
||||
} |
|
||||
.oim-card{ |
|
||||
width: 538rpx; |
|
||||
position: relative; |
|
||||
padding: 20rpx 0rpx; |
|
||||
margin-top: 38rpx; |
|
||||
border-radius: 10rpx; |
|
||||
border: 2rpx solid #D8D8D8; |
|
||||
@include centerFlex(flex-start); |
|
||||
.oc-sign{ |
|
||||
position: absolute; |
|
||||
color: #EA5061; |
|
||||
font-size: 28rpx; |
|
||||
margin-left: -20rpx; |
|
||||
} |
|
||||
.oc-depot{ |
|
||||
width: 40rpx; |
|
||||
height: 40rpx; |
|
||||
color: #fff; |
|
||||
font-size: 28rpx; |
|
||||
text-align: center; |
|
||||
border-radius: 6rpx; |
|
||||
background-color: #333333; |
|
||||
margin: 0rpx 20rpx; |
|
||||
} |
|
||||
& input { |
|
||||
height: 48rpx; |
|
||||
padding: 0rpx 20rpx; |
|
||||
font-size: 28rpx; |
|
||||
color: #333; |
|
||||
flex-grow: 1; |
|
||||
border-left: 2rpx solid #D8D8D8; |
|
||||
} |
|
||||
.oc-icon{ |
|
||||
flex-shrink: 0; |
|
||||
width: 48rpx; |
|
||||
height: 48rpx; |
|
||||
margin-right: 20rpx; |
|
||||
} |
|
||||
} |
|
||||
.oim-tips{ |
|
||||
width: 518rpx; |
|
||||
color: #9A9A9D; |
|
||||
font-size: 24rpx; |
|
||||
margin: 12rpx 0rpx 20rpx; |
|
||||
} |
|
||||
.oim-ipt{ |
|
||||
width: 538rpx; |
|
||||
padding: 20rpx 0rpx; |
|
||||
border: 2rpx solid #D8D8D8; |
|
||||
border-radius: 10rpx; |
|
||||
margin-bottom: 36rpx; |
|
||||
& input { |
|
||||
flex-grow: 1; |
|
||||
height: 48rpx; |
|
||||
color: #333; |
|
||||
font-size: 28rpx; |
|
||||
padding: 0rpx 20rpx; |
|
||||
} |
|
||||
} |
|
||||
.oim-btn{ |
|
||||
width: 240rpx; |
|
||||
height: 88rpx; |
|
||||
margin-top: 44rpx; |
|
||||
border-radius: 10rpx; |
|
||||
background-color: #009874; |
|
||||
color: #FFFFFF; |
|
||||
font-size: 32rpx; |
|
||||
line-height: 88rpx; |
|
||||
text-align: center; |
|
||||
} |
|
||||
} |
|
||||
.odm-select-modal{ |
|
||||
position: absolute; |
|
||||
left: 65rpx; |
|
||||
top: 16%; |
|
||||
background-color: #fff; |
|
||||
width: 620rpx; |
|
||||
padding: 30rpx 0rpx 80rpx; |
|
||||
border-radius: 10rpx; |
|
||||
display: flex; |
|
||||
flex-direction: column; |
|
||||
align-items: center; |
|
||||
justify-content: center; |
|
||||
.osm-close{ |
|
||||
width: 100%; |
|
||||
@include centerFlex(flex-end); |
|
||||
>image{ |
|
||||
width: 32rpx; |
|
||||
height: 32rpx; |
|
||||
margin-right: 30rpx; |
|
||||
} |
|
||||
} |
|
||||
.osm-tit { |
|
||||
color: #333; |
|
||||
font-size: 32rpx; |
|
||||
font-weight: 700; |
|
||||
margin: 16rpx 0rpx 38rpx; |
|
||||
} |
|
||||
.osm-ipt{ |
|
||||
width: 538rpx; |
|
||||
padding: 20rpx 0rpx; |
|
||||
border: 2rpx solid #D8D8D8; |
|
||||
border-radius: 10rpx; |
|
||||
margin-bottom: 36rpx; |
|
||||
@include centerFlex(flex-start); |
|
||||
& input { |
|
||||
flex-grow: 1; |
|
||||
height: 48rpx; |
|
||||
color: #333; |
|
||||
font-size: 28rpx; |
|
||||
padding: 0rpx 20rpx; |
|
||||
} |
|
||||
>image{ |
|
||||
flex-shrink: 0; |
|
||||
width: 32rpx; |
|
||||
height: 32rpx; |
|
||||
margin-right: 22rpx; |
|
||||
} |
|
||||
} |
|
||||
.osm-btn{ |
|
||||
width: 240rpx; |
|
||||
height: 88rpx; |
|
||||
margin-top: 44rpx; |
|
||||
border-radius: 10rpx; |
|
||||
background-color: #009874; |
|
||||
color: #FFFFFF; |
|
||||
font-size: 32rpx; |
|
||||
line-height: 88rpx; |
|
||||
text-align: center; |
|
||||
} |
|
||||
.osm-title{ |
|
||||
margin: 48rpx 0rpx 34rpx; |
|
||||
color: #333; |
|
||||
font-size: 32rpx; |
|
||||
font-weight: 700; |
|
||||
} |
|
||||
.osm-line{ |
|
||||
width: 504rpx; |
|
||||
margin-bottom: 26rpx; |
|
||||
>view{ |
|
||||
color: #333333; |
|
||||
font-size: 28rpx; |
|
||||
line-height: 48rpx; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
} |
|
||||
</style> |
|
@ -0,0 +1,828 @@ |
|||||
|
<template> |
||||
|
<view class="reservation-people"> |
||||
|
<view class="rp-head"> |
||||
|
<view class="rh-store"> |
||||
|
<image :src="orderInfo.stadium_logo || '' "></image> |
||||
|
<view>{{orderInfo.stadium_name || '-'}}</view> |
||||
|
</view> |
||||
|
<view class="rh-line"> |
||||
|
<view>订单编号:<text>{{orderInfo.order_no || ''}}</text></view> |
||||
|
<view><text :class="[orderInfo.pay_status==1?'rl-active':'']">{{zh_pay_status(orderInfo.pay_status)}}</text></view> |
||||
|
</view> |
||||
|
<view class="rh-line"> |
||||
|
<view>创建时间:<text>{{orderInfo.created_at || '-'}}</text></view> |
||||
|
</view> |
||||
|
<view class="rh-line"> |
||||
|
<view>用户昵称:<text>{{orderInfo.nickname || '-'}}</text></view> |
||||
|
</view> |
||||
|
<!-- 门店是否开启ic卡 --> |
||||
|
<block v-if="orderInfo.stadium_has_iccard && orderInfo.pay_status==1"> |
||||
|
<!-- 待使用 已绑定ic卡 卡id,>0就是绑定了--> |
||||
|
<block v-if="orderInfo.bind_iccard_info.id > 0"> |
||||
|
<view class="rh-line"> |
||||
|
<view>已绑定IC卡:<text>{{orderInfo.bind_iccard_info.erp_iccard_no || '-'}}</text></view> |
||||
|
</view> |
||||
|
<view class="rh-line"> |
||||
|
<view>绑定时间:<text>{{orderInfo.bind_iccard_info.bind_order_at || '-'}}</text></view> |
||||
|
</view> |
||||
|
</block> |
||||
|
<!-- 待使用 未绑定ic卡 --> |
||||
|
<view :class="['rh-ic', orderInfo.bind_iccard_info.id > 0?'rh-ic-untie':'']" @click="orderInfo.bind_iccard_info.id > 0?bindICCardChange(1):bindICCardChange(2)">{{ orderInfo.bind_iccard_info.id > 0?'解绑IC卡':'绑定IC卡' }}</view> |
||||
|
</block> |
||||
|
</view> |
||||
|
<view class="rp-box"> |
||||
|
<view class="rb-title">验证信息<text>({{orderInfo.available_num || 0}}张可用)</text></view> |
||||
|
<!-- 人次+随时用 --> |
||||
|
<view class="rb-time" v-if="orderInfo.person_number_rule.order_method==1"> |
||||
|
<view>有效期至:</view> |
||||
|
<text>{{orderInfo.end_time || '-'}}</text> |
||||
|
</view> |
||||
|
<!-- 人次+指定日期 --> |
||||
|
<view class="rb-time" v-if="orderInfo.person_number_rule.order_method==2"> |
||||
|
<view>使用日期:</view> |
||||
|
<text>{{orderInfo.date || '-'}}</text> |
||||
|
</view> |
||||
|
<view class="rb-code"> |
||||
|
<view class="rc-item" v-for="(e,i) in orderInfo.sessions" :key="i"> |
||||
|
<view class="ri-tit">验证码{{i+1}}:</view> |
||||
|
<view class="ri-section"> |
||||
|
<view class="rs-view">{{e.verify_code || '-'}} ({{zh_verify_status(e.status)}})</view> |
||||
|
<block v-if="e.status==2"> |
||||
|
<view class="rs-view">核销方式:{{zh_verify_type(e.verify_type)}}</view> |
||||
|
<view class="rs-view">核销时间:{{e.verify_time || '-'}}</view> |
||||
|
</block> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="rp-box"> |
||||
|
<view class="rb-title">预订信息</view> |
||||
|
<view class="rb-name"> |
||||
|
<view>{{orderInfo.person_number_rule_name || ''}} <text> {{orderInfo.person_number_rule.order_method==1?'(可随时使用)':'(固定日期)'}}</text></view> |
||||
|
</view> |
||||
|
<view class="rb-line"> |
||||
|
<view>数量:<text>{{orderInfo.number || 0}}</text></view> |
||||
|
</view> |
||||
|
<view class="rb-line"> |
||||
|
<view>类型:{{ zh_spec_names }}</view> |
||||
|
</view> |
||||
|
<view class="rb-section"> |
||||
|
<view class="rs-line"> |
||||
|
<view>金额小计</view> |
||||
|
<view>¥{{orderInfo.amount || 0}}</view> |
||||
|
</view> |
||||
|
<view class="rs-line"> |
||||
|
<view>积分抵扣</view> |
||||
|
<view>-¥{{orderInfo.deduction_amount || 0}}</view> |
||||
|
</view> |
||||
|
<view class="rs-line"> |
||||
|
<view>折扣金额</view> |
||||
|
<view>-¥{{orderInfo.deduction_amount || 0}}</view> |
||||
|
</view> |
||||
|
<view class="rs-line"> |
||||
|
<view>优惠券优惠</view> |
||||
|
<view>-¥{{orderInfo.coupons_amount || 0}}</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="rb-total"> |
||||
|
<view>合计支付:<text>¥</text><text>{{orderInfo.pay_amount || 0}}</text></view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="rp-box"> |
||||
|
<view class="rb-title">支付信息</view> |
||||
|
<view class="rb-line"> |
||||
|
<view>支付方式:<text>{{zh_pay_type(orderInfo.pay_type)}}</text></view> |
||||
|
</view> |
||||
|
<view class="rb-line"> |
||||
|
<view>支付时间:<text>{{orderInfo.pay_time || '-'}}</text></view> |
||||
|
</view> |
||||
|
<view class="rb-line"> |
||||
|
<view>微信交易号:<text>{{orderInfo.trade_no || ''}}</text></view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<!-- 弹框 绑定ic卡 --> |
||||
|
<view class="ox-dark-mask" v-if="isShowBindIC" @touchmove.stop.prevent="moveHandle"> |
||||
|
<view class="odm-ic-modal"> |
||||
|
<view class="oim-close"> |
||||
|
<image src="/static/images/icon/x_close.png" @click="isShowBindIC = !isShowBindIC"></image> |
||||
|
</view> |
||||
|
<view class="oim-tit">绑定IC卡</view> |
||||
|
<view class="oim-card"> |
||||
|
<view class="oc-sign">*</view> |
||||
|
<view class="oc-depot" @click="depotChange">仓</view> |
||||
|
<input type="number" placeholder="请输入卡号" v-model=" bindInfo.iccard_no" /> |
||||
|
<image class="oc-icon" src="/subpackage/device/static/images/scan_code.png" @click="scanChange"></image> |
||||
|
</view> |
||||
|
<view class="oim-tips">可直接输入卡号、扫描条码或在已选择仓库下选择卡号</view> |
||||
|
<view class="oim-ipt"> |
||||
|
<input type="digit" placeholder="单价" v-model="bindInfo.iccard_price" /> |
||||
|
</view> |
||||
|
<view class="oim-ipt"> |
||||
|
<input type="text" placeholder="其他费用(选填)" v-model="bindInfo.iccard_otherfee" /> |
||||
|
</view> |
||||
|
<view class="oim-ipt"> |
||||
|
<input type="text" placeholder="备注说明(选填)" v-model="bindInfo.iccard_remarks" /> |
||||
|
</view> |
||||
|
<view class="oim-btn" hover-class="hover-active" @click="modalBtn(1)">确认</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<!-- 弹框 仓库选择ic卡 --> |
||||
|
<view class="ox-dark-mask" v-if="isShowSelectIC" @touchmove.stop.prevent="moveHandle"> |
||||
|
<view class="odm-select-modal"> |
||||
|
<view class="osm-close"> |
||||
|
<image src="/static/images/icon/x_close.png" @click="isShowSelectIC = !isShowSelectIC"></image> |
||||
|
</view> |
||||
|
<view class="osm-tit">筛选卡号</view> |
||||
|
<picker class="osm-picker" :range="depotList" @change="pickerChange"> |
||||
|
<view class="osm-ipt"> |
||||
|
<input type="text" placeholder="请选择仓库" v-model="depotInfo.ic_name" /> |
||||
|
<image src="/subpackage/device/static/images/arrow_b2.png"></image> |
||||
|
</view> |
||||
|
</picker> |
||||
|
|
||||
|
<view class="osm-ipt"> |
||||
|
<input type="text" placeholder="请输入卡号" v-model="depotInfo.ic_no" @change="inputChange"/> |
||||
|
</view> |
||||
|
<view class="osm-btn-box"> |
||||
|
<picker class="osm-check" :range="iccardList" @change="checkPickerChange"> |
||||
|
<view class="oc-btn" hover-class="hover-active">查询卡号</view> |
||||
|
</picker> |
||||
|
<view class="osm-btn" hover-class="hover-active" @click="modalBtn(2)">确认</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<!-- 弹框 ic卡绑定成功 --> |
||||
|
<view class="ox-dark-mask" v-if="isShowSuccessIC" @touchmove.stop.prevent="moveHandle"> |
||||
|
<view class="odm-select-modal"> |
||||
|
<view class="osm-title">绑定成功</view> |
||||
|
<view class="osm-line"> |
||||
|
<view>卡号:{{sucInfo.iccard.erp_iccard_no || '-'}}</view> |
||||
|
<view>关联订单号:{{sucInfo.order_no || ''}}</view> |
||||
|
<view>门店名称:{{sucInfo.stadium_name || '-'}}</view> |
||||
|
</view> |
||||
|
<view class="osm-line"> |
||||
|
<view>订单类型:{{zh_order_type(sucInfo.order_type)}}</view> |
||||
|
<view>项目名称:{{sucInfo.project || '-'}}</view> |
||||
|
<view>购买者昵称:{{sucInfo.nickname || '-'}}</view> |
||||
|
</view> |
||||
|
<view class="osm-btn" hover-class="hover-active" @click="okChange">好的</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import util from '@/utils/util'; |
||||
|
import deviceServer from '../../../js/device_server'; |
||||
|
import deviceApi from '../../../js/device_api'; |
||||
|
import { mapState } from 'vuex'; |
||||
|
export default { |
||||
|
props: { |
||||
|
orderInfo: { |
||||
|
type: Object, |
||||
|
default: ()=>({}) |
||||
|
} |
||||
|
}, |
||||
|
computed: { |
||||
|
...mapState(['brandInfo']), |
||||
|
zh_pay_status(){ |
||||
|
// 订单状态 1已支付待使用2已使用3已失效4已退款 |
||||
|
return status =>{ |
||||
|
const _obj = { |
||||
|
'0': '未付款', |
||||
|
'1': '待使用', |
||||
|
'2': '已使用', |
||||
|
'3': '已失效', |
||||
|
'4': '已退款', |
||||
|
} |
||||
|
return _obj[`${status}`] || '-' |
||||
|
} |
||||
|
}, |
||||
|
zh_verify_type(){ |
||||
|
// 核销方式 1/2/3/4 核销码核销/人脸核销/扫码核销/商家扫码 |
||||
|
return status =>{ |
||||
|
const _obj = { |
||||
|
'0': '未核销', |
||||
|
'1': '核销码核销', |
||||
|
'2': '人脸核销', |
||||
|
'3': '扫码核销', |
||||
|
'4': '商家扫码', |
||||
|
} |
||||
|
return _obj[`${status}`] || '-' |
||||
|
} |
||||
|
}, |
||||
|
zh_verify_status(){ |
||||
|
// 核销状态 0/1/2/3/4 无效/待使用/已核销/已失效/已退款 |
||||
|
return status =>{ |
||||
|
const _obj = { |
||||
|
'0': '无效', |
||||
|
'1': '待使用', |
||||
|
'2': '已使用', |
||||
|
'3': '已失效', |
||||
|
'4': '已退款', |
||||
|
} |
||||
|
return _obj[`${status}`] || '-' |
||||
|
} |
||||
|
}, |
||||
|
zh_pay_type(){ |
||||
|
// 支付类型 0微信支付1支付宝支付2储值卡支付 |
||||
|
return status =>{ |
||||
|
const _obj = { |
||||
|
'0': '微信支付', |
||||
|
'1': '支付宝支付', |
||||
|
'2': '储值卡支付', |
||||
|
} |
||||
|
return _obj[`${status}`] || '-' |
||||
|
} |
||||
|
}, |
||||
|
zh_spec_names(){ |
||||
|
let { orderInfo } = this |
||||
|
if(!orderInfo.person_number_spec_names)return ''; |
||||
|
let spec = orderInfo.person_number_spec_names.join('+') |
||||
|
return spec; |
||||
|
}, |
||||
|
zh_order_type(){ |
||||
|
//订单类型 0预约订单 1课程订单 |
||||
|
return status =>{ |
||||
|
const _obj = { |
||||
|
'0': '预约订单', |
||||
|
'1': '课程订单', |
||||
|
} |
||||
|
return _obj[`${status}`] || '-' |
||||
|
} |
||||
|
}, |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
isShowBindIC: false, //绑定ic卡弹框 |
||||
|
isShowSelectIC: false, //仓库选择ic卡弹框 |
||||
|
isShowSuccessIC: false,//ic卡绑定成功弹框 |
||||
|
bindInfo: { //绑定ic卡所需参数 |
||||
|
iccard_no: '', //卡号 |
||||
|
iccard_price: '', //单价 |
||||
|
iccard_otherfee: '', //其他费用 |
||||
|
iccard_remarks: '', //备注说明 |
||||
|
}, |
||||
|
depotInfo: { |
||||
|
ic_name: '', //仓库名称 |
||||
|
ic_no: '', //仓库下卡号 |
||||
|
}, |
||||
|
depotList: [], //picker仓库名字列表 |
||||
|
curIdx: -1, |
||||
|
storehouseList: [], //仓库列表 |
||||
|
iccardList: [], //ic卡列表 |
||||
|
sucInfo: {}, //绑定IC卡成功信息 |
||||
|
}; |
||||
|
}, |
||||
|
methods:{ |
||||
|
moveHandle(){}, |
||||
|
modalBtn(type){ |
||||
|
// type: 1绑定ic卡弹框确认按钮 2仓库选择ic卡弹框确认按钮 |
||||
|
let { bindInfo, depotInfo } = this |
||||
|
if(type == 1){ |
||||
|
if(bindInfo.iccard_no == '')return util.showNone('请输入ic卡卡号'); |
||||
|
if(bindInfo.iccard_price == '')return util.showNone('请输入单价'); |
||||
|
return this.getCheckIccard(); |
||||
|
} |
||||
|
if(type == 2){ |
||||
|
if(depotInfo.ic_name == '')return util.showNone('请选择仓库'); |
||||
|
if(depotInfo.ic_no == '')return util.showNone('请输入ic卡卡号'); |
||||
|
this.isShowModal() |
||||
|
this.bindInfo.iccard_no = depotInfo.ic_no |
||||
|
return; |
||||
|
} |
||||
|
}, |
||||
|
isShowModal(){ |
||||
|
this.isShowBindIC = !this.isShowBindIC; |
||||
|
this.isShowSelectIC = !this.isShowSelectIC; |
||||
|
}, |
||||
|
// 仓库按钮 |
||||
|
depotChange(){ |
||||
|
this.isShowModal(); |
||||
|
this.getStoreHouseList() |
||||
|
}, |
||||
|
// 选择仓库 |
||||
|
pickerChange(e){ |
||||
|
console.log(e); |
||||
|
this.curIdx = e.detail.value |
||||
|
let _list = this.depotList || []; |
||||
|
this.depotInfo.ic_name = _list[e.detail.value] || '' |
||||
|
}, |
||||
|
// 仓库列表 |
||||
|
getStoreHouseList(){ |
||||
|
let { brandInfo } = this |
||||
|
util.showLoad(); |
||||
|
deviceServer.get({ |
||||
|
url: deviceApi.storeHouseList, |
||||
|
data: { |
||||
|
brand_id: brandInfo.brand.id, |
||||
|
}, |
||||
|
failMsg: '加载失败!' |
||||
|
}) |
||||
|
.then(res=>{ |
||||
|
util.hideLoad() |
||||
|
// setTimeout(()=>uni.navigateBack(),1200); |
||||
|
let _list = res.list || [] |
||||
|
this.storehouseList = _list |
||||
|
for(var i in _list){ |
||||
|
this.depotList.push(_list[i].storehouse_name) |
||||
|
} |
||||
|
}) |
||||
|
}, |
||||
|
inputChange(e){ |
||||
|
if(this.depotInfo.ic_name == '')return; |
||||
|
this.getICCardList({ |
||||
|
key: e.detail.value, |
||||
|
}) |
||||
|
}, |
||||
|
// 选择ic卡 |
||||
|
checkPickerChange(e){ |
||||
|
console.log(e); |
||||
|
let _list = this.iccardList || []; |
||||
|
this.depotInfo.ic_no = _list[e.detail.value] || '' |
||||
|
}, |
||||
|
// ic卡列表 |
||||
|
getICCardList({key=''}){ |
||||
|
let { brandInfo, curIdx, storehouseList } = this |
||||
|
util.showLoad(); |
||||
|
deviceServer.get({ |
||||
|
url: deviceApi.iccardList, |
||||
|
data: { |
||||
|
brand_id: brandInfo.brand.id, |
||||
|
store_house_id: storehouseList[curIdx].id, |
||||
|
store_house_type: storehouseList[curIdx].store_house_type, |
||||
|
key, |
||||
|
}, |
||||
|
failMsg: '加载失败!' |
||||
|
}) |
||||
|
.then(res=>{ |
||||
|
util.hideLoad() |
||||
|
this.iccardList = res.list || [] |
||||
|
}) |
||||
|
}, |
||||
|
// 校验ic卡 |
||||
|
getCheckIccard(){ |
||||
|
let { brandInfo, bindInfo } = this |
||||
|
util.showLoad(); |
||||
|
deviceServer.get({ |
||||
|
url: deviceApi.checkIccard, |
||||
|
data: { |
||||
|
brand_id: brandInfo.brand.id, |
||||
|
erp_iccard_no: bindInfo.iccard_no, |
||||
|
}, |
||||
|
failMsg: '请求失败!' |
||||
|
}) |
||||
|
.then(res=>{ |
||||
|
util.hideLoad() |
||||
|
this.getBindIcCard() |
||||
|
}) |
||||
|
}, |
||||
|
// 绑定ic卡 |
||||
|
getBindIcCard(){ |
||||
|
let { brandInfo, bindInfo, orderInfo } = this |
||||
|
util.showLoad(); |
||||
|
deviceServer.get({ |
||||
|
url: deviceApi.bindIcCard, |
||||
|
data: { |
||||
|
brand_id: brandInfo.brand.id, |
||||
|
price: bindInfo.iccard_price, //单价 |
||||
|
iccard_no: bindInfo.iccard_no, //IC卡卡号 |
||||
|
delivery_expenses: bindInfo.iccard_otherfee, //其他费用 |
||||
|
delivery_order_number: orderInfo.order_no, //关联单号 |
||||
|
delivery_desc: bindInfo.iccard_otherfee, //备注 |
||||
|
}, |
||||
|
failMsg: '请求失败!' |
||||
|
}) |
||||
|
.then(res=>{ |
||||
|
util.hideLoad() |
||||
|
this.sucInfo = res || {}; |
||||
|
this.isShowBindIC = false; |
||||
|
this.isShowSuccessIC = true; |
||||
|
}) |
||||
|
}, |
||||
|
bindICCardChange: util.debounce(function(type){ |
||||
|
// type: 1解绑ic卡 2绑定ic卡 |
||||
|
let { brandInfo, orderInfo } = this |
||||
|
if(type == 1){ |
||||
|
util.showModal({ |
||||
|
title: '提示', |
||||
|
content: '确认解绑ic卡吗?', |
||||
|
showCancel: true, |
||||
|
success: modalRes => { |
||||
|
if (modalRes.confirm) { |
||||
|
util.showLoad(); |
||||
|
deviceServer.get({ |
||||
|
url: deviceApi.unbindIccard, |
||||
|
data: { |
||||
|
brand_id: brandInfo.brand.id, |
||||
|
order_no: orderInfo.order_no, |
||||
|
iccard_no: orderInfo.bind_iccard_info.erp_iccard_no, |
||||
|
}, |
||||
|
failMsg: '请求失败!' |
||||
|
}) |
||||
|
.then(res=>{ |
||||
|
util.hideLoad() |
||||
|
util.showNone('操作成功!'); |
||||
|
}) |
||||
|
} |
||||
|
} |
||||
|
}); |
||||
|
return; |
||||
|
} |
||||
|
if(type == 2){ |
||||
|
this.isShowBindIC = !this.isShowBindIC |
||||
|
} |
||||
|
},300,300), |
||||
|
// 扫描条形码 |
||||
|
scanChange(){ |
||||
|
let that = this; |
||||
|
// 允许从相机和相册扫码 |
||||
|
uni.scanCode({ |
||||
|
success: function(res) { |
||||
|
that.bindInfo.iccard_no = res.result; |
||||
|
console.log('条码类型:' + res.scanType); |
||||
|
console.log('条码内容:' + res.result); |
||||
|
} |
||||
|
}); |
||||
|
}, |
||||
|
okChange(){ |
||||
|
this.isShowSuccessIC = !this.isShowSuccessIC |
||||
|
this.$emit('okChange'); |
||||
|
}, |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" > |
||||
|
@import '~style/public.scss'; |
||||
|
.reservation-people{ |
||||
|
margin-bottom: 24rpx; |
||||
|
.rp-head{ |
||||
|
margin: 24rpx 24rpx 0rpx; |
||||
|
padding: 30rpx; |
||||
|
background-color: #FFF; |
||||
|
border-radius: 10rpx 10rpx 0px 0px; |
||||
|
.rh-store{ |
||||
|
padding-bottom: 26rpx; |
||||
|
margin-bottom: 18rpx; |
||||
|
border-bottom: 2rpx solid #D8D8D8; |
||||
|
display: flex; |
||||
|
justify-content: flex-start; |
||||
|
>image{ |
||||
|
flex-shrink: 0; |
||||
|
width: 40rpx; |
||||
|
height: 40rpx; |
||||
|
background-color: skyblue; |
||||
|
|
||||
|
} |
||||
|
>view{ |
||||
|
flex-grow: 1; |
||||
|
margin-left: 14rpx; |
||||
|
color: #333333; |
||||
|
font-size: 28rpx; |
||||
|
} |
||||
|
} |
||||
|
.rh-line{ |
||||
|
margin-top: 8rpx; |
||||
|
@include centerFlex(space-between); |
||||
|
>view{ |
||||
|
line-height: 40rpx; |
||||
|
font-size: 28rpx; |
||||
|
&:first-child{ |
||||
|
color: #9A9A9D; |
||||
|
>text{ |
||||
|
color: #333333; |
||||
|
} |
||||
|
} |
||||
|
&:nth-child(2){ |
||||
|
>text{ |
||||
|
color: #9A9A9D; |
||||
|
} |
||||
|
.rl-active{ |
||||
|
color: #009874; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.rh-ic{ |
||||
|
margin-top: 40rpx; |
||||
|
border-radius: 10rpx; |
||||
|
background-color: #009874; |
||||
|
color: #FFFFFF; |
||||
|
font-size: 32rpx; |
||||
|
text-align: center; |
||||
|
width: 500rpx; |
||||
|
// height: 112rpx; |
||||
|
// line-height: 112rpx; |
||||
|
padding: 34rpx 0rpx; |
||||
|
margin-left: 71rpx; |
||||
|
} |
||||
|
.rh-ic-untie{ |
||||
|
padding: 32rpx 0rpx; |
||||
|
color: #009874; |
||||
|
border: 2rpx solid #009874; |
||||
|
background-color: #fff; |
||||
|
} |
||||
|
} |
||||
|
.rp-box{ |
||||
|
margin: 24rpx 24rpx 0rpx; |
||||
|
padding: 30rpx; |
||||
|
background-color: #FFF; |
||||
|
border-radius: 10rpx; |
||||
|
.rb-title{ |
||||
|
color: #9A9A9D; |
||||
|
font-size: 28rpx; |
||||
|
margin-bottom: 20rpx; |
||||
|
>text{ |
||||
|
color: #333333; |
||||
|
font-size: 28rpx; |
||||
|
margin-left: 28rpx; |
||||
|
} |
||||
|
} |
||||
|
.rb-time{ |
||||
|
line-height: 48rpx; |
||||
|
display: flex; |
||||
|
justify-content: flex-start; |
||||
|
>view{ |
||||
|
color: #9A9A9D; |
||||
|
font-size: 28rpx; |
||||
|
} |
||||
|
>text{ |
||||
|
color: #333333; |
||||
|
font-size: 28rpx; |
||||
|
} |
||||
|
} |
||||
|
.rb-code{ |
||||
|
.rc-item{ |
||||
|
display: flex; |
||||
|
justify-content: flex-start; |
||||
|
margin-top: 24rpx; |
||||
|
.ri-tit{ |
||||
|
color: #9A9A9D; |
||||
|
font-size: 28rpx; |
||||
|
line-height: 46rpx; |
||||
|
} |
||||
|
.ri-section{ |
||||
|
.rs-view{ |
||||
|
color: #333333; |
||||
|
font-size: 28rpx; |
||||
|
line-height: 46rpx; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.rb-name{ |
||||
|
margin-bottom: 8rpx; |
||||
|
color: #333333; |
||||
|
>view{ |
||||
|
font-size: 28rpx; |
||||
|
} |
||||
|
>text{ |
||||
|
font-size: 24rpx; |
||||
|
} |
||||
|
} |
||||
|
.rb-line{ |
||||
|
>view{ |
||||
|
line-height: 52rpx; |
||||
|
font-size: 28rpx; |
||||
|
color: #9A9A9D; |
||||
|
>text{ |
||||
|
color: #333333; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
.rb-section{ |
||||
|
margin: 30rpx 0rpx 24rpx; |
||||
|
border-top: 2rpx solid #D8D8D8; |
||||
|
.rs-line{ |
||||
|
margin-top: 26rpx; |
||||
|
@include centerFlex(space-between); |
||||
|
>view{ |
||||
|
color: #333333; |
||||
|
&:first-child{ |
||||
|
font-size: 28rpx; |
||||
|
} |
||||
|
&:nth-child(2){ |
||||
|
font-size: 24rpx; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.rb-total{ |
||||
|
@include centerFlex(flex-end); |
||||
|
>view{ |
||||
|
color: #333333; |
||||
|
font-size: 28rpx; |
||||
|
>text{ |
||||
|
color: #FF873D; |
||||
|
&:first-child{ |
||||
|
font-size: 28rpx; |
||||
|
} |
||||
|
&:nth-child(2){ |
||||
|
font-size: 36rpx; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.odm-ic-modal { |
||||
|
position: absolute; |
||||
|
left: 65rpx; |
||||
|
top: 10%; |
||||
|
background-color: #fff; |
||||
|
width: 620rpx; |
||||
|
padding: 30rpx 0rpx 80rpx; |
||||
|
border-radius: 10rpx; |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
.oim-close{ |
||||
|
width: 100%; |
||||
|
@include centerFlex(flex-end); |
||||
|
>image{ |
||||
|
width: 32rpx; |
||||
|
height: 32rpx; |
||||
|
margin-right: 30rpx; |
||||
|
} |
||||
|
} |
||||
|
.oim-tit { |
||||
|
color: #333; |
||||
|
font-size: 32rpx; |
||||
|
font-weight: 700; |
||||
|
margin-top: 16rpx; |
||||
|
} |
||||
|
.oim-card{ |
||||
|
width: 538rpx; |
||||
|
position: relative; |
||||
|
padding: 20rpx 0rpx; |
||||
|
margin-top: 38rpx; |
||||
|
border-radius: 10rpx; |
||||
|
border: 2rpx solid #D8D8D8; |
||||
|
@include centerFlex(flex-start); |
||||
|
.oc-sign{ |
||||
|
position: absolute; |
||||
|
color: #EA5061; |
||||
|
font-size: 28rpx; |
||||
|
margin-left: -20rpx; |
||||
|
} |
||||
|
.oc-depot{ |
||||
|
width: 40rpx; |
||||
|
height: 40rpx; |
||||
|
color: #fff; |
||||
|
font-size: 28rpx; |
||||
|
text-align: center; |
||||
|
border-radius: 6rpx; |
||||
|
background-color: #333333; |
||||
|
margin: 0rpx 20rpx; |
||||
|
} |
||||
|
& input { |
||||
|
height: 48rpx; |
||||
|
padding: 0rpx 20rpx; |
||||
|
font-size: 28rpx; |
||||
|
color: #333; |
||||
|
flex-grow: 1; |
||||
|
border-left: 2rpx solid #D8D8D8; |
||||
|
} |
||||
|
.oc-icon{ |
||||
|
flex-shrink: 0; |
||||
|
width: 48rpx; |
||||
|
height: 48rpx; |
||||
|
margin-right: 20rpx; |
||||
|
} |
||||
|
} |
||||
|
.oim-tips{ |
||||
|
width: 518rpx; |
||||
|
color: #9A9A9D; |
||||
|
font-size: 24rpx; |
||||
|
margin: 12rpx 0rpx 20rpx; |
||||
|
} |
||||
|
.oim-ipt{ |
||||
|
width: 538rpx; |
||||
|
padding: 20rpx 0rpx; |
||||
|
border: 2rpx solid #D8D8D8; |
||||
|
border-radius: 10rpx; |
||||
|
margin-bottom: 36rpx; |
||||
|
& input { |
||||
|
flex-grow: 1; |
||||
|
height: 48rpx; |
||||
|
color: #333; |
||||
|
font-size: 28rpx; |
||||
|
padding: 0rpx 20rpx; |
||||
|
} |
||||
|
} |
||||
|
.oim-btn{ |
||||
|
width: 240rpx; |
||||
|
height: 88rpx; |
||||
|
margin-top: 44rpx; |
||||
|
border-radius: 10rpx; |
||||
|
background-color: #009874; |
||||
|
color: #FFFFFF; |
||||
|
font-size: 32rpx; |
||||
|
line-height: 88rpx; |
||||
|
text-align: center; |
||||
|
} |
||||
|
} |
||||
|
.odm-select-modal{ |
||||
|
position: absolute; |
||||
|
left: 65rpx; |
||||
|
top: 16%; |
||||
|
background-color: #fff; |
||||
|
width: 620rpx; |
||||
|
padding: 30rpx 0rpx 80rpx; |
||||
|
border-radius: 10rpx; |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
.osm-close{ |
||||
|
width: 100%; |
||||
|
@include centerFlex(flex-end); |
||||
|
>image{ |
||||
|
width: 32rpx; |
||||
|
height: 32rpx; |
||||
|
margin-right: 30rpx; |
||||
|
} |
||||
|
} |
||||
|
.osm-tit { |
||||
|
color: #333; |
||||
|
font-size: 32rpx; |
||||
|
font-weight: 700; |
||||
|
margin: 16rpx 0rpx 38rpx; |
||||
|
} |
||||
|
.osm-picker{ |
||||
|
width: 538rpx; |
||||
|
} |
||||
|
.osm-ipt{ |
||||
|
width: 538rpx; |
||||
|
padding: 20rpx 0rpx; |
||||
|
border: 2rpx solid #D8D8D8; |
||||
|
border-radius: 10rpx; |
||||
|
margin-bottom: 36rpx; |
||||
|
@include centerFlex(flex-start); |
||||
|
& input { |
||||
|
flex-grow: 1; |
||||
|
height: 48rpx; |
||||
|
color: #333; |
||||
|
font-size: 28rpx; |
||||
|
padding: 0rpx 20rpx; |
||||
|
} |
||||
|
>image{ |
||||
|
flex-shrink: 0; |
||||
|
width: 32rpx; |
||||
|
height: 32rpx; |
||||
|
margin-right: 22rpx; |
||||
|
} |
||||
|
} |
||||
|
.osm-btn-box{ |
||||
|
width: 100%; |
||||
|
padding: 0rpx 40rpx; |
||||
|
@include centerFlex(space-between); |
||||
|
} |
||||
|
.osm-btn{ |
||||
|
width: 240rpx; |
||||
|
height: 88rpx; |
||||
|
margin-top: 44rpx; |
||||
|
border-radius: 10rpx; |
||||
|
background-color: #009874; |
||||
|
color: #FFFFFF; |
||||
|
font-size: 32rpx; |
||||
|
line-height: 88rpx; |
||||
|
text-align: center; |
||||
|
} |
||||
|
.osm-check{ |
||||
|
width: 240rpx; |
||||
|
.oc-btn{ |
||||
|
width: 240rpx; |
||||
|
height: 88rpx; |
||||
|
margin-top: 44rpx; |
||||
|
border-radius: 10rpx; |
||||
|
border: 2rpx solid #009874; |
||||
|
color: #009874; |
||||
|
font-size: 32rpx; |
||||
|
line-height: 88rpx; |
||||
|
text-align: center; |
||||
|
} |
||||
|
} |
||||
|
.osm-title{ |
||||
|
margin: 48rpx 0rpx 34rpx; |
||||
|
color: #333; |
||||
|
font-size: 32rpx; |
||||
|
font-weight: 700; |
||||
|
} |
||||
|
.osm-line{ |
||||
|
width: 504rpx; |
||||
|
margin-bottom: 26rpx; |
||||
|
>view{ |
||||
|
color: #333333; |
||||
|
font-size: 28rpx; |
||||
|
line-height: 48rpx; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
</style> |
@ -0,0 +1,98 @@ |
|||||
|
<template> |
||||
|
<view class="order-details"> |
||||
|
<block v-if="optionsQuery.order_type==3"> |
||||
|
<reservation-site-detail :orderInfo="pageInfo" v-if="pageInfo.order_type == 0"></reservation-site-detail> |
||||
|
<reservation-people-detail :orderInfo="pageInfo" v-if="pageInfo.order_type == 1" @okChange="okChange"></reservation-people-detail> |
||||
|
</block> |
||||
|
<timing-detail :orderInfo="pageInfo" v-if="optionsQuery.order_type==1"></timing-detail> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import timingDetail from '../../components/order/timing_detail/timing_detail.vue' |
||||
|
import reservationSiteDetail from '../../components/order/reservation_site_detail/reservation_site_detail.vue'; |
||||
|
import reservationPeopleDetail from '../../components/order/reservation_people_detail/reservation_people_detail.vue'; |
||||
|
import util from '@/utils/util'; |
||||
|
import deviceServer from '../../js/device_server'; |
||||
|
import deviceApi from '../../js/device_api'; |
||||
|
import { mapState } from 'vuex'; |
||||
|
export default { |
||||
|
components: { |
||||
|
'timing-detail': timingDetail, |
||||
|
'reservation-site-detail': reservationSiteDetail, |
||||
|
'reservation-people-detail': reservationPeopleDetail, |
||||
|
}, |
||||
|
computed:{ |
||||
|
titleName(){ |
||||
|
let { optionsQuery } = this; |
||||
|
if(optionsQuery.order_type == 1)return '计时订单详情'; //PM: 2021/4/19 已做 |
||||
|
if(optionsQuery.order_type == 3)return '预约订单详情'; //PM: 2021/4/19 已做 |
||||
|
if(optionsQuery.order_type == 4)return '储值卡订单详情'; |
||||
|
if(optionsQuery.order_type == 5)return '积分商城订单详情'; |
||||
|
return '订单详情' |
||||
|
}, |
||||
|
...mapState(['brandInfo']), |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
optionsQuery: { |
||||
|
stadium_id: '', |
||||
|
order_type: -1, |
||||
|
}, |
||||
|
pageInfo: {}, |
||||
|
} |
||||
|
}, |
||||
|
onLoad(options) { |
||||
|
let _query = util.jsonPar(options.query); |
||||
|
this.optionsQuery = _query |
||||
|
this.$nextTick(_=>{ |
||||
|
uni.setNavigationBarTitle({ |
||||
|
title: this.titleName |
||||
|
}) |
||||
|
}) |
||||
|
this.getPageInfo({ |
||||
|
orderType: _query.order_type, |
||||
|
stadium_id: _query.stadium_id, |
||||
|
order_no: _query.order_no, |
||||
|
}) |
||||
|
}, |
||||
|
methods: { |
||||
|
getApiUrl(type){ |
||||
|
if(type == 1)return deviceApi.timeOrderDetail; |
||||
|
if(type == 3)return deviceApi.reservationDetail; |
||||
|
}, |
||||
|
getPageInfo({orderType, stadium_id, order_no}){ |
||||
|
util.showLoad(); |
||||
|
deviceServer.get({ |
||||
|
url: this.getApiUrl(orderType), |
||||
|
data: { |
||||
|
stadium_id, |
||||
|
order_no, |
||||
|
}, |
||||
|
failMsg: '加载失败!' |
||||
|
}) |
||||
|
.then(res=>{ |
||||
|
util.hideLoad() |
||||
|
this.pageInfo = res |
||||
|
}) |
||||
|
.catch(util.hideLoad) |
||||
|
}, |
||||
|
okChange(){ |
||||
|
console.log("有了吗") |
||||
|
let { optionsQuery } = this |
||||
|
this.getPageInfo({ |
||||
|
orderType: optionsQuery.order_type, |
||||
|
stadium_id: optionsQuery.stadium_id, |
||||
|
order_no: optionsQuery.order_no, |
||||
|
}) |
||||
|
}, |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" > |
||||
|
@import '~style/public.scss'; |
||||
|
.order-details{ |
||||
|
|
||||
|
} |
||||
|
</style> |
@ -1,32 +0,0 @@ |
|||||
<template> |
|
||||
<view class="reservation-details"> |
|
||||
<reservation-site v-if="false"></reservation-site> |
|
||||
<reservation-people v-if="true"></reservation-people> |
|
||||
</view> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
import reservation_site from '../../../components/order/reservation_site/reservation_site.vue' |
|
||||
import reservation_people from '../../../components/order/reservation_people/reservation_people.vue' |
|
||||
export default { |
|
||||
components: { |
|
||||
'reservation-site': reservation_site, |
|
||||
'reservation-people': reservation_people, |
|
||||
}, |
|
||||
data() { |
|
||||
return { |
|
||||
|
|
||||
} |
|
||||
}, |
|
||||
methods: { |
|
||||
|
|
||||
} |
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
<style lang="scss" > |
|
||||
@import '~style/public.scss'; |
|
||||
.reservation-details{ |
|
||||
|
|
||||
} |
|
||||
</style> |
|
Write
Preview
Loading…
Cancel
Save
Reference in new issue