|
|
@@ -1,23 +1,24 @@
|
|
|
<template>
|
|
|
- <view class="container cashier">
|
|
|
- <view class="container-cash clearfix" :style="{ marginTop: CustomBar + 'px' }">
|
|
|
- <view class="container-wrapper">
|
|
|
- <view class="cash-icon"><image :src="StaticUrl + 'icon-pay-success.png'" mode=""></image></view>
|
|
|
- <view class="cash-text">
|
|
|
- <text>{{ successText }}</text>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="container-money">
|
|
|
- <view class="label">支付金额</view>
|
|
|
- <view class="money">￥{{ orderInfo.payableAmount | formatPrice }}</view>
|
|
|
- </view>
|
|
|
- <view class="container-button">
|
|
|
- <view class="btn btn-pay" @click="goHome">继续购买</view>
|
|
|
- <view class="btn btn-open" @click="searchOrder">查看订单</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <cm-loading :visible="isSubLoading" :text="loadingText"></cm-loading>
|
|
|
- </view>
|
|
|
+ <view class="container cashier">
|
|
|
+ <view class="container-cash clearfix" :style="{ marginTop: CustomBar + 'px' }">
|
|
|
+ <view class="container-wrapper">
|
|
|
+ <view class="cash-icon"><image :src="StaticUrl + 'icon-pay-success.png'" mode=""></image></view>
|
|
|
+ <view class="cash-text">
|
|
|
+ <text>{{ successText }}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="container-money">
|
|
|
+ <view class="label">支付金额</view>
|
|
|
+ <view class="money">￥{{ orderInfo.payableAmount | formatPrice }}</view>
|
|
|
+ </view>
|
|
|
+ <view class="container-button">
|
|
|
+ <view class="btn btn-pay" @click="goHome" v-if="!hasOtherSplitOrder">继续购买</view>
|
|
|
+ <view class="btn btn-pay" @click="onPayOnce" v-else>继续支付</view>
|
|
|
+ <view class="btn btn-open" @click="searchOrder">查看订单</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <cm-loading :visible="isSubLoading" :text="loadingText"></cm-loading>
|
|
|
+ </view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
@@ -26,124 +27,144 @@ import CmLoading from '@/components/cm-module/cm-loading/cm-loading.vue'
|
|
|
import wechatPay from './mixins/wechatPay.js'
|
|
|
import { mapGetters } from 'vuex'
|
|
|
export default {
|
|
|
- components: {
|
|
|
- CmLoading
|
|
|
- },
|
|
|
- // 混入支付
|
|
|
- mixins: [wechatPay],
|
|
|
- data() {
|
|
|
- return {
|
|
|
- StaticUrl: this.$Static,
|
|
|
- orderId: '',
|
|
|
- successText: '订单支付成功',
|
|
|
- orderInfo: {}
|
|
|
- }
|
|
|
- },
|
|
|
- onLoad() {
|
|
|
- this.initOrderInfo()
|
|
|
- },
|
|
|
- computed: {
|
|
|
- ...mapGetters(['isIphoneX']),
|
|
|
- hanldOrder() {
|
|
|
- return {
|
|
|
- order: this.orderInfo
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- methods: {
|
|
|
- initOrderInfo() {
|
|
|
- this.orderInfo = uni.getStorageSync('orderInfo')
|
|
|
- uni.removeStorageSync('orderInfo')
|
|
|
- },
|
|
|
- // 回到首页
|
|
|
- goHome() {
|
|
|
- uni.reLaunch({ url: '/pages/tabBar/index/index' })
|
|
|
- },
|
|
|
- // 查看订单
|
|
|
- searchOrder() {
|
|
|
- this.$api.redirectTo('/pages/order/order-detail?type=confim&orderId=' + this.orderInfo.orderId)
|
|
|
- }
|
|
|
- }
|
|
|
+ components: {
|
|
|
+ CmLoading
|
|
|
+ },
|
|
|
+ // 混入支付
|
|
|
+ mixins: [wechatPay],
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ StaticUrl: this.$Static,
|
|
|
+ orderId: '',
|
|
|
+ successText: '订单支付成功',
|
|
|
+ orderInfo: {},
|
|
|
+ orderDetail: {},
|
|
|
+ mapStateArr: [11, 12, 13, 21, 22, 23, 111]
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad() {
|
|
|
+ this.initOrderInfo()
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapGetters(['isIphoneX']),
|
|
|
+ hanldOrder() {
|
|
|
+ return {
|
|
|
+ order: this.orderInfo
|
|
|
+ }
|
|
|
+ },
|
|
|
+ hasOtherSplitOrder() {
|
|
|
+ return this.mapStateArr.includes(parseInt(this.orderDetail.status))
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ initOrderInfo() {
|
|
|
+ this.orderInfo = uni.getStorageSync('orderInfo')
|
|
|
+ uni.removeStorageSync('orderInfo')
|
|
|
+ this.getOrderDetail()
|
|
|
+ },
|
|
|
+ // 回到首页
|
|
|
+ goHome() {
|
|
|
+ uni.reLaunch({ url: '/pages/tabBar/index/index' })
|
|
|
+ },
|
|
|
+ // 查看订单
|
|
|
+ searchOrder() {
|
|
|
+ this.$api.redirectTo('/pages/order/order-detail?type=confim&orderId=' + this.orderInfo.orderId)
|
|
|
+ },
|
|
|
+ getOrderDetail() {
|
|
|
+ this.OrderService.QueryOrderDetails({ orderId: this.orderInfo.orderId })
|
|
|
+ .then(res => {
|
|
|
+ this.orderDetail = res.data.order
|
|
|
+ })
|
|
|
+ .catch(err => {
|
|
|
+ this.$util.modal('提示', '订单查询失败，请稍后重试~', '确定', '', false, () => {
|
|
|
+ this.$api.switchTabTo('/pages/tabBar/index/index')
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ onPayOnce() {
|
|
|
+ this.$api.navigateTo('/pages/order/order-pay?orderId=' + this.orderInfo.orderId)
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
page {
|
|
|
- background-color: #f7f7f7;
|
|
|
- height: auto !important;
|
|
|
+ background-color: #f7f7f7;
|
|
|
+ height: auto !important;
|
|
|
}
|
|
|
.container-cash {
|
|
|
- width: 100%;
|
|
|
- .container-wrapper {
|
|
|
- width: 100%;
|
|
|
- margin: 0 auto;
|
|
|
- margin-top: 120rpx;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- align-items: center;
|
|
|
- background-color: #ffffff;
|
|
|
- .cash-icon {
|
|
|
- width: 210rpx;
|
|
|
- height: 210rpx;
|
|
|
- margin-top: 112rpx;
|
|
|
- image {
|
|
|
- width: 210rpx;
|
|
|
- height: 210rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- .cash-text {
|
|
|
- font-size: $font-size-28;
|
|
|
- color: #666666;
|
|
|
- line-height: 104rpx;
|
|
|
- font-weight: bold;
|
|
|
- }
|
|
|
- }
|
|
|
- .container-money {
|
|
|
- width: 100%;
|
|
|
- height: 90rpx;
|
|
|
- float: left;
|
|
|
- line-height: 90rpx;
|
|
|
- font-size: $font-size-28;
|
|
|
- box-sizing: border-box;
|
|
|
- padding: 0 24rpx;
|
|
|
- margin-top: 20rpx;
|
|
|
- background-color: #ffffff;
|
|
|
- .label {
|
|
|
- float: left;
|
|
|
- color: #333333;
|
|
|
- }
|
|
|
- .money {
|
|
|
- float: right;
|
|
|
- color: #666666;
|
|
|
- }
|
|
|
- }
|
|
|
- .container-button {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- float: left;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- align-items: center;
|
|
|
- margin-top: 160rpx;
|
|
|
- .btn {
|
|
|
- width: 600rpx;
|
|
|
- height: 90rpx;
|
|
|
- border-radius: 45rpx;
|
|
|
- line-height: 90rpx;
|
|
|
- text-align: center;
|
|
|
- font-size: $font-size-26;
|
|
|
- color: #ffffff;
|
|
|
- box-sizing: border-box;
|
|
|
- border: 1px solid $color-system;
|
|
|
- margin-bottom: 24rpx;
|
|
|
- &.btn-open {
|
|
|
- color: $color-system;
|
|
|
- }
|
|
|
- &.btn-pay {
|
|
|
- border-color: $color-system;
|
|
|
- background: $btn-confirm;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
+ width: 100%;
|
|
|
+ .container-wrapper {
|
|
|
+ width: 100%;
|
|
|
+ margin: 0 auto;
|
|
|
+ margin-top: 120rpx;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ background-color: #ffffff;
|
|
|
+ .cash-icon {
|
|
|
+ width: 210rpx;
|
|
|
+ height: 210rpx;
|
|
|
+ margin-top: 112rpx;
|
|
|
+ image {
|
|
|
+ width: 210rpx;
|
|
|
+ height: 210rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .cash-text {
|
|
|
+ font-size: $font-size-28;
|
|
|
+ color: #666666;
|
|
|
+ line-height: 104rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .container-money {
|
|
|
+ width: 100%;
|
|
|
+ height: 90rpx;
|
|
|
+ float: left;
|
|
|
+ line-height: 90rpx;
|
|
|
+ font-size: $font-size-28;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 0 24rpx;
|
|
|
+ margin-top: 20rpx;
|
|
|
+ background-color: #ffffff;
|
|
|
+ .label {
|
|
|
+ float: left;
|
|
|
+ color: #333333;
|
|
|
+ }
|
|
|
+ .money {
|
|
|
+ float: right;
|
|
|
+ color: #666666;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .container-button {
|
|
|
+ width: 100%;
|
|
|
+ height: auto;
|
|
|
+ float: left;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ margin-top: 160rpx;
|
|
|
+ .btn {
|
|
|
+ width: 600rpx;
|
|
|
+ height: 90rpx;
|
|
|
+ border-radius: 45rpx;
|
|
|
+ line-height: 90rpx;
|
|
|
+ text-align: center;
|
|
|
+ font-size: $font-size-26;
|
|
|
+ color: #ffffff;
|
|
|
+ box-sizing: border-box;
|
|
|
+ border: 1px solid $color-system;
|
|
|
+ margin-bottom: 24rpx;
|
|
|
+ &.btn-open {
|
|
|
+ color: $color-system;
|
|
|
+ }
|
|
|
+ &.btn-pay {
|
|
|
+ border-color: $color-system;
|
|
|
+ background: $btn-confirm;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
</style>
|
yuwenjun1997