168 lines
3.6 KiB
Vue
168 lines
3.6 KiB
Vue
<!-- 商城支付成功 -->
|
|
<template>
|
|
<view class="pay-success-page">
|
|
<HeaderCom></HeaderCom>
|
|
<view class="status">
|
|
<image src="@/static/pay/success.png" class="status-icon" mode=""></image>
|
|
<view class="status-txt">{{type === 'record' ? '提取成功' : '支付成功'}}</view>
|
|
</view>
|
|
<view class="opc">
|
|
<view class="btn" @click="goShop">再去逛逛</view>
|
|
<view class="btn" @click="goDetail">查看订单</view>
|
|
</view>
|
|
<view class="main">
|
|
<view class="item">
|
|
<view class="label">用户信息</view>
|
|
<view class="value">{{nickname}}</view>
|
|
</view>
|
|
<view class="item">
|
|
<view class="label">商品名称</view>
|
|
<view class="value">{{productName}}</view>
|
|
</view>
|
|
<view class="item">
|
|
<view class="label">商品数量</view>
|
|
<view class="value">{{quantity}}</view>
|
|
</view>
|
|
<view class="item">
|
|
<view class="label">实付积分</view>
|
|
<view class="value">{{point}}</view>
|
|
</view>
|
|
<view class="item">
|
|
<view class="label">实付金额</view>
|
|
<view class="value">¥ {{price}}</view>
|
|
</view>
|
|
</view>
|
|
<!-- 所有页面的弹框 -->
|
|
<page-popup page="/pages/shop/paySuccess"></page-popup>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { myMixins } from "@/mixins/mixins.js";
|
|
import HeaderCom from '@/pages/components/header.vue'
|
|
export default{
|
|
mixins: [myMixins],
|
|
data(){
|
|
return{
|
|
id:"",
|
|
no:"",
|
|
price:"",
|
|
point:"",
|
|
payType:"",
|
|
productName:'',
|
|
quantity:'',
|
|
nickname:uni.getStorageSync('box-nickname'),
|
|
type:''
|
|
}
|
|
},
|
|
components:{HeaderCom},
|
|
onLoad(opation) {
|
|
this.type = opation.type ? opation.type : 0
|
|
this.price = opation.price ? Number(opation.price) : 0
|
|
this.point = opation.point ? Number(opation.point) : 0
|
|
this.payType = opation.payType ? opation.payType : 'NONE'
|
|
this.productName = opation.productName
|
|
this.quantity = opation.quantity
|
|
this.id = opation.id
|
|
this.no = opation.no
|
|
},
|
|
methods:{
|
|
|
|
copy(no) {
|
|
uni.setClipboardData({
|
|
data: no,
|
|
})
|
|
},
|
|
goShop(){
|
|
uni.reLaunch({
|
|
url:`/pages/shop/index`
|
|
})
|
|
},
|
|
goDetail(){
|
|
if(this.type === 'record'){
|
|
uni.redirectTo({
|
|
url:`/pages/order/index`
|
|
})
|
|
}else{
|
|
uni.redirectTo({
|
|
url:`/pages/mine/orderStatusDetail?no=${this.no}`
|
|
})
|
|
}
|
|
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
page{
|
|
background-color: #f5f5f5;
|
|
}
|
|
.pay-success-page{
|
|
padding: 112rpx 32rpx 0 32rpx;
|
|
.status{
|
|
height: 312rpx;
|
|
width: 100%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
// justify-content: center;
|
|
padding-top: 80rpx;
|
|
.status-icon{
|
|
width: 144rpx;
|
|
height: 144rpx;
|
|
}
|
|
.status-txt{
|
|
font-weight: bold;
|
|
font-size: 40rpx;
|
|
color: #333333;
|
|
// margin-top: 16rpx;
|
|
}
|
|
}
|
|
.opc{
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
.btn{
|
|
width: 332rpx;
|
|
height: 96rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 16rpx;
|
|
border: 2rpx solid #EBEBEB;
|
|
font-weight: 500;
|
|
font-size: 32rpx;
|
|
color: #666666;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
}
|
|
.main{
|
|
margin-top: 24rpx;
|
|
width: 686rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 24rpx;
|
|
.item{
|
|
height: 80rpx;
|
|
padding: 0 24rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
.label{
|
|
font-size: 28rpx;
|
|
color: #666666;
|
|
}
|
|
.value{
|
|
font-weight: 500;
|
|
font-size: 28rpx;
|
|
color: #000000;
|
|
width: 300rpx;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
text-align: right;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style> |