init
This commit is contained in:
@@ -0,0 +1,46 @@
|
||||
Component({
|
||||
externalClasses: ['wr-class'],
|
||||
properties: {
|
||||
addressData: {
|
||||
type: Object,
|
||||
value: {},
|
||||
observer: function(newVal, oldVal) {
|
||||
// 确保数据正确传递到模板
|
||||
if (newVal && Object.keys(newVal).length > 0) {
|
||||
const processedAddress = {
|
||||
...newVal,
|
||||
// 确保区域信息字段存在
|
||||
provinceName: newVal.provinceName || '',
|
||||
cityName: newVal.cityName || '',
|
||||
districtName: newVal.districtName || '',
|
||||
detailAddress: newVal.detailAddress || '',
|
||||
name: newVal.name || '',
|
||||
phone: newVal.phone || '',
|
||||
addressTag: newVal.addressTag || ''
|
||||
};
|
||||
|
||||
// 直接设置到组件的data中,确保模板能访问
|
||||
this.setData({
|
||||
currentAddress: processedAddress
|
||||
});
|
||||
} else {
|
||||
// 如果没有地址数据,设置为空对象而不是null,这样模板的条件判断能正确工作
|
||||
this.setData({
|
||||
currentAddress: {}
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
data: {
|
||||
currentAddress: {}
|
||||
},
|
||||
methods: {
|
||||
onAddressTap() {
|
||||
this.triggerEvent('addressclick');
|
||||
},
|
||||
onAddTap() {
|
||||
this.triggerEvent('addclick');
|
||||
},
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,7 @@
|
||||
{
|
||||
"component": true,
|
||||
"usingComponents": {
|
||||
"t-cell": "tdesign-miniprogram/cell/cell",
|
||||
"t-icon": "tdesign-miniprogram/icon/icon"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,51 @@
|
||||
<wxs module="utils">
|
||||
var hidePhoneNum = function(array) {
|
||||
if (!array) return;
|
||||
var mphone = array.substring(0, 3) + '****' + array.substring(7);
|
||||
return mphone;
|
||||
}
|
||||
module.exports = {
|
||||
hidePhoneNum:hidePhoneNum
|
||||
}
|
||||
</wxs>
|
||||
|
||||
<view class="address-card wr-class">
|
||||
<t-cell wx:if="{{currentAddress && (currentAddress.detailAddress || currentAddress.name)}}" bindtap="onAddressTap" hover>
|
||||
<view class="order-address" slot="title">
|
||||
<t-icon name="location" color="#333333" size="40rpx" />
|
||||
<view class="address-content">
|
||||
<view class="title">
|
||||
<view class="address-tag" wx:if="{{currentAddress.addressTag}}">
|
||||
{{currentAddress.addressTag}}
|
||||
</view>
|
||||
<view style="margin-top: 10rpx;">
|
||||
<text wx:if="{{currentAddress.provinceName}}">{{currentAddress.provinceName}}</text>
|
||||
<text wx:if="{{currentAddress.cityName}}"> {{currentAddress.cityName}}</text>
|
||||
<text wx:if="{{currentAddress.districtName}}"> {{currentAddress.districtName}}</text>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view class="detail">{{currentAddress.detailAddress}}</view>
|
||||
<view class="info">
|
||||
{{currentAddress.name}} {{utils.hidePhoneNum(currentAddress.phone)}}
|
||||
</view>
|
||||
</view>
|
||||
<t-icon
|
||||
class="address__right"
|
||||
name="chevron-right"
|
||||
color="#BBBBBB"
|
||||
size="40rpx"
|
||||
/>
|
||||
</view>
|
||||
</t-cell>
|
||||
<t-cell
|
||||
wx:else
|
||||
bindtap="onAddTap"
|
||||
title="添加收货地址"
|
||||
hover
|
||||
>
|
||||
<t-icon name="add-circle" slot="left-icon" size="40rpx" />
|
||||
</t-cell>
|
||||
<view class="top-line" />
|
||||
</view>
|
||||
|
||||
@@ -0,0 +1,66 @@
|
||||
.address-card {
|
||||
background: #fff;
|
||||
margin: 0rpx 0rpx 24rpx;
|
||||
}
|
||||
.address-card .wr-cell__title {
|
||||
color: #999;
|
||||
margin-left: 6rpx;
|
||||
}
|
||||
.address-card .order-address {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
}
|
||||
.address-card .order-address .address-content {
|
||||
flex: 1;
|
||||
}
|
||||
.order-address .address__right {
|
||||
align-self: center;
|
||||
}
|
||||
.address-card .order-address .title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 40rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: normal;
|
||||
color: #999999;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
.address-card .order-address .title .address-tag {
|
||||
width: 52rpx;
|
||||
height: 29rpx;
|
||||
border: 1rpx solid #0091ff;
|
||||
background-color: rgba(122, 167, 251, 0.1);
|
||||
text-align: center;
|
||||
line-height: 29rpx;
|
||||
border-radius: 8rpx;
|
||||
color: #0091ff;
|
||||
font-size: 20rpx;
|
||||
margin-right: 12rpx;
|
||||
}
|
||||
.address-card .order-address .detail {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
line-height: 48rpx;
|
||||
margin: 8rpx 0;
|
||||
}
|
||||
.address-card .order-address .info {
|
||||
height: 40rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: normal;
|
||||
color: #333333;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
.address-card .top-line {
|
||||
width: 100%;
|
||||
height: 6rpx;
|
||||
background-color: #fff;
|
||||
background-image: url(https://tdesign.gtimg.com/miniprogram/template/retail/order/stripe.png);
|
||||
background-repeat: repeat-x;
|
||||
display: block;
|
||||
}
|
||||
11
miniprogram/pages/order/order-confirm/getNotes.wxs
Normal file
11
miniprogram/pages/order/order-confirm/getNotes.wxs
Normal file
@@ -0,0 +1,11 @@
|
||||
var getNotes = function (storeInfoList, storeIndex) {
|
||||
if (!storeInfoList || typeof storeInfoList !== 'object' || typeof storeInfoList.length !== 'number' || storeIndex < 0 || storeIndex >= storeInfoList.length) {
|
||||
return '';
|
||||
}
|
||||
var storeInfo = storeInfoList[storeIndex];
|
||||
if (!storeInfo) {
|
||||
return '';
|
||||
}
|
||||
return storeInfo.remark || '';
|
||||
};
|
||||
module.exports = getNotes;
|
||||
11
miniprogram/pages/order/order-confirm/handleInvoice.wxs
Normal file
11
miniprogram/pages/order/order-confirm/handleInvoice.wxs
Normal file
@@ -0,0 +1,11 @@
|
||||
var handleInvoice = function (invoiceData) {
|
||||
if (!invoiceData || invoiceData.invoiceType == 0) {
|
||||
return '暂不开发票';
|
||||
}
|
||||
var title = invoiceData.titleType == 2 ? '公司' : '个人';
|
||||
var content = invoiceData.contentType == 2 ? '商品类别' : '商品明细';
|
||||
return invoiceData.email
|
||||
? '电子普通发票 (' + content + ' - ' + title + ')'
|
||||
: '暂不开发票';
|
||||
};
|
||||
module.exports = handleInvoice;
|
||||
1154
miniprogram/pages/order/order-confirm/index.js
Normal file
1154
miniprogram/pages/order/order-confirm/index.js
Normal file
File diff suppressed because it is too large
Load Diff
16
miniprogram/pages/order/order-confirm/index.json
Normal file
16
miniprogram/pages/order/order-confirm/index.json
Normal file
@@ -0,0 +1,16 @@
|
||||
{
|
||||
"navigationBarTitleText": "订单确认",
|
||||
"usingComponents": {
|
||||
"t-popup": "tdesign-miniprogram/popup/popup",
|
||||
"t-toast": "tdesign-miniprogram/toast/toast",
|
||||
"t-icon": "tdesign-miniprogram/icon/icon",
|
||||
"t-cell": "tdesign-miniprogram/cell/cell",
|
||||
"t-dialog": "tdesign-miniprogram/dialog/dialog",
|
||||
"t-textarea": "tdesign-miniprogram/textarea/textarea",
|
||||
"price": "/components/price/index",
|
||||
"select-coupons": "../components/selectCoupons/selectCoupons",
|
||||
"no-goods": "../components/noGoods/noGoods",
|
||||
"t-image": "/components/webp-image/index",
|
||||
"address-card": "./components/address-card/index"
|
||||
}
|
||||
}
|
||||
150
miniprogram/pages/order/order-confirm/index.wxml
Normal file
150
miniprogram/pages/order/order-confirm/index.wxml
Normal file
@@ -0,0 +1,150 @@
|
||||
<wxs module="order" src="./order.wxs" />
|
||||
|
||||
<wxs module="handleInvoice" src="./handleInvoice.wxs" />
|
||||
<wxs module="getNotes" src="./getNotes.wxs" />
|
||||
<view class="order-sure" wx:if="{{!loading}}">
|
||||
<address-card addressData="{{userAddress}}" bind:addclick="onGotoAddress" bind:addressclick="onGotoAddress" />
|
||||
<view
|
||||
class="order-wrapper"
|
||||
wx:for="{{settleDetailData.storeGoodsList}}"
|
||||
wx:for-item="stores"
|
||||
wx:for-index="storeIndex"
|
||||
wx:key="storeIndex"
|
||||
>
|
||||
<view class="store-wrapper">
|
||||
<t-icon prefix="wr" size="40rpx" color="#333333" name="store" class="store-logo" />
|
||||
{{stores.storeName}}
|
||||
</view>
|
||||
<view
|
||||
wx:if="{{orderCardList[storeIndex] && orderCardList[storeIndex].goodsList && orderCardList[storeIndex].goodsList.length > 0}}"
|
||||
wx:for="{{orderCardList[storeIndex] && orderCardList[storeIndex].goodsList || []}}"
|
||||
wx:for-item="goods"
|
||||
wx:for-index="gIndex"
|
||||
wx:key="id"
|
||||
class="goods-wrapper"
|
||||
>
|
||||
<t-image src="{{goods.thumb}}" t-class="goods-image" mode="aspectFill" bind:error="handleImageError" />
|
||||
<view class="goods-content">
|
||||
<view class="goods-title">{{goods.title}}</view>
|
||||
<view>{{goods.specs}}</view>
|
||||
</view>
|
||||
<view class="goods-right">
|
||||
<price wr-class="goods-price" priceUnit="fen" price="{{goods.price}}" fill="{{true}}" decimalSmaller />
|
||||
<view class="goods-num">x{{goods.num}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="pay-detail">
|
||||
<view class="pay-item">
|
||||
<text>商品总额</text>
|
||||
<price
|
||||
fill
|
||||
decimalSmaller
|
||||
priceUnit="fen"
|
||||
wr-class="pay-item__right font-bold"
|
||||
price="{{settleDetailData.totalSalePrice || '0'}}"
|
||||
/>
|
||||
</view>
|
||||
<view class="pay-item">
|
||||
<text>运费</text>
|
||||
<view class="pay-item__right font-bold">
|
||||
<block wx:if="{{settleDetailData.totalDeliveryFee && settleDetailData.totalDeliveryFee != 0}}">
|
||||
+
|
||||
<price fill decimalSmaller priceUnit="fen" price="{{settleDetailData.totalDeliveryFee}}" />
|
||||
</block>
|
||||
<text wx:else>免运费</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="pay-item">
|
||||
<text>活动优惠</text>
|
||||
<view class="pay-item__right primary font-bold">
|
||||
-
|
||||
<price fill priceUnit="fen" price="{{settleDetailData.totalPromotionAmount || 0}}" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="pay-item">
|
||||
<text>优惠券</text>
|
||||
<view
|
||||
class="pay-item__right"
|
||||
data-storeid="{{settleDetailData.storeGoodsList && settleDetailData.storeGoodsList[0] && settleDetailData.storeGoodsList[0].storeId || ''}}"
|
||||
catchtap="onOpenCoupons"
|
||||
>
|
||||
<block wx:if="{{settleDetailData.totalCouponAmount && settleDetailData.totalCouponAmount !== '0'}}">
|
||||
-<price fill decimalSmaller priceUnit="fen" price="{{settleDetailData.totalCouponAmount}}" />
|
||||
</block>
|
||||
<text wx:else>选择优惠券</text>
|
||||
<t-icon name="chevron-right" size="32rpx" color="#BBBBBB" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="pay-item" wx:if="{{settleDetailData.invoiceSupport}}">
|
||||
<text>发票</text>
|
||||
<view class="pay-item__right" catchtap="onReceipt">
|
||||
<text>{{handleInvoice(invoiceData)}}</text>
|
||||
<t-icon name="chevron-right" size="32rpx" color="#BBBBBB" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="pay-item">
|
||||
<text>订单备注</text>
|
||||
<view class="pay-item__right" data-storenoteindex="{{0}}" catchtap="onNotes">
|
||||
<text class="pay-remark"
|
||||
>{{getNotes(storeInfoList, 0) ? getNotes(storeInfoList, 0) :'选填,建议先和商家沟通确认'}}</text
|
||||
>
|
||||
<t-icon name="chevron-right" size="32rpx" color="#BBBBBB" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="amount-wrapper">
|
||||
<view class="pay-amount">
|
||||
<text class="order-num">共{{settleDetailData.totalGoodsCount}}件</text>
|
||||
<text>小计</text>
|
||||
<price class="total-price" priceUnit="fen" price="{{settleDetailData.totalPayAmount}}" fill="{{false}}" decimalSmaller />
|
||||
</view>
|
||||
</view>
|
||||
<view class="wx-pay-cover">
|
||||
<view class="wx-pay">
|
||||
<price decimalSmaller fill priceUnit="fen" class="price" price="{{settleDetailData.totalPayAmount || '0'}}" />
|
||||
<view class="submit-btn {{ !payLock && settleDetailData.totalAmount > 0 ? '':'btn-gray'}}" bindtap="submitOrder">
|
||||
{{payLock ? '提交中...' : '提交订单'}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<t-dialog
|
||||
t-class="add-notes"
|
||||
title="填写备注信息"
|
||||
visible="{{dialogShow}}"
|
||||
confirm-btn="确认"
|
||||
cancel-btn="取消"
|
||||
t-class-content="add-notes__content"
|
||||
t-class-confirm="dialog__button-confirm"
|
||||
t-class-cancel="dialog__button-cancel"
|
||||
bindconfirm="onNoteConfirm"
|
||||
bindcancel="onNoteCancel"
|
||||
>
|
||||
<t-textarea
|
||||
slot="content"
|
||||
focus="{{dialogShow}}"
|
||||
class="notes"
|
||||
t-class="add-notes__textarea"
|
||||
value="{{storeInfoList[storeNoteIndex] && storeInfoList[storeNoteIndex].remark}}"
|
||||
placeholder="备注信息"
|
||||
t-class-textarea="add-notes__textarea__font"
|
||||
bindfocus="onFocus"
|
||||
bindblur="onBlur"
|
||||
bindchange="onInput"
|
||||
maxlength="{{50}}"
|
||||
/>
|
||||
</t-dialog>
|
||||
<t-popup visible="{{popupShow}}" placement="bottom" bind:visible-change="onPopupChange">
|
||||
<no-goods slot="content" bind:change="onSureCommit" settleDetailData="{{settleDetailData}}" />
|
||||
</t-popup>
|
||||
<select-coupons
|
||||
bind:sure="onCoupons"
|
||||
bind:close="onCouponsClose"
|
||||
storeId="{{currentStoreId}}"
|
||||
orderSureCouponList="{{couponList}}"
|
||||
promotionGoodsList="{{promotionGoodsList}}"
|
||||
couponsShow="{{couponsShow}}"
|
||||
/>
|
||||
</view>
|
||||
<t-toast id="t-toast" />
|
||||
<t-dialog id="t-dialog" />
|
||||
221
miniprogram/pages/order/order-confirm/index.wxss
Normal file
221
miniprogram/pages/order/order-confirm/index.wxss
Normal file
@@ -0,0 +1,221 @@
|
||||
.order-sure {
|
||||
box-sizing: border-box;
|
||||
background: #f6f6f6;
|
||||
padding: 24rpx 0 calc(env(safe-area-inset-bottom) + 136rpx);
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.order-sure .wx-pay-cover {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
z-index: 10;
|
||||
background: #fff;
|
||||
height: 112rpx;
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
}
|
||||
.order-sure .wx-pay-cover .wx-pay {
|
||||
width: 100%;
|
||||
height: 100rpx;
|
||||
box-sizing: border-box;
|
||||
padding: 0rpx 32rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
.order-sure .wx-pay-cover .wx-pay .price {
|
||||
color: #fa4126;
|
||||
font-weight: bold;
|
||||
font-size: 63rpx;
|
||||
line-height: 88rpx;
|
||||
}
|
||||
|
||||
.order-sure .wx-pay-cover .wx-pay .submit-btn {
|
||||
height: 80rpx;
|
||||
width: 240rpx;
|
||||
border-radius: 40rpx;
|
||||
background-color: #fa4126;
|
||||
color: #ffffff;
|
||||
line-height: 80rpx;
|
||||
font-weight: bold;
|
||||
font-size: 28rpx;
|
||||
text-align: center;
|
||||
}
|
||||
.order-sure .wx-pay-cover .wx-pay .btn-gray {
|
||||
background: #cccccc;
|
||||
}
|
||||
|
||||
.order-wrapper .store-wrapper {
|
||||
width: 100%;
|
||||
height: 96rpx;
|
||||
box-sizing: border-box;
|
||||
padding: 0 32rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
color: #333333;
|
||||
background-color: #ffffff;
|
||||
}
|
||||
.order-wrapper .store-wrapper .store-logo {
|
||||
margin-right: 16rpx;
|
||||
}
|
||||
.order-wrapper .goods-wrapper {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 16rpx 32rpx;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
font-size: 24rpx;
|
||||
line-height: 32rpx;
|
||||
color: #999999;
|
||||
background-color: #ffffff;
|
||||
}
|
||||
.goods-wrapper .goods-image {
|
||||
width: 176rpx;
|
||||
height: 176rpx;
|
||||
border-radius: 8rpx;
|
||||
overflow: hidden;
|
||||
margin-right: 16rpx;
|
||||
}
|
||||
.goods-wrapper .goods-content {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.goods-wrapper .goods-content .goods-title {
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
margin-bottom: 12rpx;
|
||||
color: #333333;
|
||||
margin-right: 16rpx;
|
||||
}
|
||||
|
||||
.goods-wrapper .goods-right {
|
||||
min-width: 128rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.goods-right .goods-price {
|
||||
color: #333333;
|
||||
font-size: 32rpx;
|
||||
line-height: 48rpx;
|
||||
font-weight: bold;
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
|
||||
.goods-right .goods-num {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.order-sure .pay-detail {
|
||||
background-color: #ffffff;
|
||||
padding: 16rpx 32rpx;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.order-sure .pay-detail .pay-item {
|
||||
width: 100%;
|
||||
height: 72rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-size: 26rpx;
|
||||
line-height: 36rpx;
|
||||
color: #666666;
|
||||
}
|
||||
.order-sure .pay-detail .pay-item .pay-item__right {
|
||||
color: #333333;
|
||||
font-size: 24rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
max-width: 400rpx;
|
||||
}
|
||||
.order-sure .pay-detail .pay-item .pay-item__right .pay-remark {
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
max-width: 400rpx;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
}
|
||||
.order-sure .pay-detail .pay-item .font-bold {
|
||||
font-weight: bold;
|
||||
}
|
||||
.order-sure .pay-detail .pay-item .primary {
|
||||
color: #fa4126;
|
||||
}
|
||||
|
||||
.add-notes .add-notes__content {
|
||||
--td-textarea-background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
.add-notes .t-textarea__placeholder {
|
||||
color: #aeb3b7;
|
||||
}
|
||||
|
||||
.add-notes .add-notes__textarea__font {
|
||||
font-size: 26rpx;
|
||||
}
|
||||
.add-notes .add-notes__textarea {
|
||||
margin-top: 32rpx;
|
||||
}
|
||||
|
||||
.order-sure .add-notes .dialog__message {
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
|
||||
.order-sure .add-notes .dialog__button-cancel::after {
|
||||
border-right: 0;
|
||||
}
|
||||
|
||||
.order-sure .amount-wrapper {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
background-color: #ffffff;
|
||||
padding: 0rpx 32rpx;
|
||||
height: 96rpx;
|
||||
}
|
||||
|
||||
.order-sure .pay-amount {
|
||||
width: 100%;
|
||||
height: 96rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
position: relative;
|
||||
}
|
||||
.order-sure .pay-amount::after {
|
||||
position: absolute;
|
||||
content: ' ';
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 200%;
|
||||
height: 200%;
|
||||
transform: scale(0.5);
|
||||
transform-origin: 0 0;
|
||||
border-top: 2rpx solid #f5f5f5;
|
||||
}
|
||||
.order-sure .pay-amount .order-num {
|
||||
color: #999999;
|
||||
padding-right: 8rpx;
|
||||
}
|
||||
|
||||
.order-sure .pay-amount .total-price {
|
||||
font-size: 36rpx;
|
||||
color: #fa4126;
|
||||
font-weight: bold;
|
||||
padding-left: 8rpx;
|
||||
}
|
||||
8
miniprogram/pages/order/order-confirm/order.wxs
Normal file
8
miniprogram/pages/order/order-confirm/order.wxs
Normal file
@@ -0,0 +1,8 @@
|
||||
var toHide = function (array) {
|
||||
if (!array) return;
|
||||
var mphone = array.substring(0, 3) + '****' + array.substring(7);
|
||||
return mphone;
|
||||
};
|
||||
module.exports = {
|
||||
toHide: toHide,
|
||||
};
|
||||
253
miniprogram/pages/order/order-confirm/pay.js
Normal file
253
miniprogram/pages/order/order-confirm/pay.js
Normal file
@@ -0,0 +1,253 @@
|
||||
import Dialog from 'tdesign-miniprogram/dialog/index';
|
||||
import Toast from 'tdesign-miniprogram/toast/index';
|
||||
|
||||
import { dispatchCommitPay } from '../../../services/order/orderConfirm';
|
||||
import { config } from '../../../config/index';
|
||||
|
||||
// 真实的提交支付
|
||||
export const commitPay = (params) => {
|
||||
console.log('=== pay.js commitPay 调试 ===');
|
||||
console.log('接收到的params:', params);
|
||||
console.log('params.couponList:', params.couponList);
|
||||
if (params.couponList && params.couponList.length > 0) {
|
||||
console.log('第一张优惠券详情:', params.couponList[0]);
|
||||
console.log('优惠券ID字段检查:', {
|
||||
id: params.couponList[0].id,
|
||||
couponId: params.couponList[0].couponId,
|
||||
userCouponId: params.couponList[0].userCouponId,
|
||||
allFields: Object.keys(params.couponList[0])
|
||||
});
|
||||
}
|
||||
|
||||
return dispatchCommitPay({
|
||||
goodsRequestList: params.goodsRequestList, // 待结算的商品集合
|
||||
invoiceRequest: params.invoiceRequest, // 发票信息
|
||||
// isIgnore: params.isIgnore || false, // 删掉 是否忽视库存不足和商品失效,继续结算,true=继续结算 购物车请赋值false
|
||||
userAddressReq: params.userAddressReq, // 地址信息(用户在购物选择更换地址)
|
||||
currency: params.currency || 'CNY', // 支付货币: 人民币=CNY,美元=USD
|
||||
logisticsType: params.logisticsType || 1, // 配送方式 0=无需配送 1=快递 2=商家 3=同城 4=自提
|
||||
// orderMark: params.orderMark, // 下单备注
|
||||
orderType: params.orderType || 0, // 订单类型 0=普通订单 1=虚拟订单
|
||||
payType: params.payType || 1, // 支付类型(0=线上、1=线下)
|
||||
totalAmount: params.totalAmount, // 新增字段"totalAmount"总的支付金额
|
||||
userName: params.userName, // 用户名
|
||||
payWay: 1,
|
||||
authorizationCode: '', //loginCode, // 登录凭证
|
||||
storeInfoList: params.storeInfoList, //备注信息列表
|
||||
couponList: params.couponList,
|
||||
groupInfo: params.groupInfo,
|
||||
});
|
||||
};
|
||||
|
||||
export const paySuccess = (payOrderInfo, pageContext = null) => {
|
||||
const { payAmt, tradeNo, groupId, promotionId } = payOrderInfo;
|
||||
// 支付成功
|
||||
console.log('支付成功,准备跳转到支付结果页面', payOrderInfo);
|
||||
|
||||
// 显示成功提示,如果有页面上下文则使用,否则使用全局提示
|
||||
if (pageContext) {
|
||||
Toast({
|
||||
context: pageContext,
|
||||
selector: '#t-toast',
|
||||
message: '支付成功',
|
||||
duration: 1500,
|
||||
icon: 'check-circle',
|
||||
});
|
||||
} else {
|
||||
wx.showToast({
|
||||
title: '支付成功',
|
||||
icon: 'success',
|
||||
duration: 1500
|
||||
});
|
||||
}
|
||||
|
||||
const params = {
|
||||
totalPaid: payAmt,
|
||||
orderNo: tradeNo,
|
||||
};
|
||||
if (groupId) {
|
||||
params.groupId = groupId;
|
||||
}
|
||||
if (promotionId) {
|
||||
params.promotionId = promotionId;
|
||||
}
|
||||
const paramsStr = Object.keys(params)
|
||||
.map((k) => `${k}=${params[k]}`)
|
||||
.join('&');
|
||||
|
||||
// 确保提示显示完成后再跳转
|
||||
setTimeout(() => {
|
||||
console.log('准备跳转到支付结果页面', `/pages/order/pay-result/index?${paramsStr}`);
|
||||
|
||||
// 直接使用redirectTo进行页面跳转
|
||||
wx.redirectTo({
|
||||
url: `/pages/order/pay-result/index?${paramsStr}`,
|
||||
success: () => {
|
||||
console.log('跳转到支付结果页面成功');
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error('跳转到支付结果页面失败', err);
|
||||
// 如果redirectTo失败,尝试使用navigateTo
|
||||
wx.navigateTo({
|
||||
url: `/pages/order/pay-result/index?${paramsStr}`,
|
||||
fail: (navErr) => {
|
||||
console.error('navigateTo也失败了', navErr);
|
||||
// 最后尝试使用reLaunch
|
||||
wx.reLaunch({
|
||||
url: `/pages/order/pay-result/index?${paramsStr}`,
|
||||
fail: (relaunchErr) => {
|
||||
console.error('所有跳转方式都失败了', relaunchErr);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}, 1600); // 延迟1.6秒后跳转,确保Toast显示完成
|
||||
};
|
||||
|
||||
export const payFail = (payOrderInfo, resultMsg) => {
|
||||
if (resultMsg === 'requestPayment:fail cancel') {
|
||||
if (payOrderInfo.dialogOnCancel) {
|
||||
//结算页,取消付款,dialog提示
|
||||
Dialog.confirm({
|
||||
title: '是否放弃付款',
|
||||
content: '商品可能很快就会被抢空哦,是否放弃付款?',
|
||||
confirmBtn: '放弃',
|
||||
cancelBtn: '继续付款',
|
||||
}).then(() => {
|
||||
wx.redirectTo({ url: '/pages/order/order-list/index' });
|
||||
});
|
||||
} else {
|
||||
//订单列表页,订单详情页,取消付款,toast提示
|
||||
Toast({
|
||||
context: this,
|
||||
selector: '#t-toast',
|
||||
message: '支付取消',
|
||||
duration: 2000,
|
||||
icon: 'close-circle',
|
||||
});
|
||||
}
|
||||
} else {
|
||||
Toast({
|
||||
context: this,
|
||||
selector: '#t-toast',
|
||||
message: `支付失败:${resultMsg}`,
|
||||
duration: 2000,
|
||||
icon: 'close-circle',
|
||||
});
|
||||
setTimeout(() => {
|
||||
wx.redirectTo({ url: '/pages/order/order-list/index' });
|
||||
}, 2000);
|
||||
}
|
||||
};
|
||||
|
||||
// 微信支付方式
|
||||
export const wechatPayOrder = (payOrderInfo, pageContext = null) => {
|
||||
console.log('开始微信支付流程', payOrderInfo);
|
||||
|
||||
return new Promise((resolve, reject) => {
|
||||
// 获取token
|
||||
const token = wx.getStorageSync('token');
|
||||
if (!token) {
|
||||
wx.showModal({
|
||||
title: '提示',
|
||||
content: '请先登录后再进行支付',
|
||||
showCancel: true,
|
||||
cancelText: '取消',
|
||||
confirmText: '去登录',
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
wx.navigateTo({
|
||||
url: '/pages/login/index'
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
reject(new Error('未登录'));
|
||||
return;
|
||||
}
|
||||
|
||||
// 显示支付中提示
|
||||
wx.showLoading({ title: '创建支付订单...' });
|
||||
|
||||
// 调用后端创建支付订单API
|
||||
wx.request({
|
||||
url: `${config.apiBase}/payment/create`,
|
||||
method: 'POST',
|
||||
header: {
|
||||
'Authorization': `Bearer ${token}`,
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
data: {
|
||||
orderNo: payOrderInfo.tradeNo,
|
||||
paymentMethod: 'wechat'
|
||||
},
|
||||
success: (res) => {
|
||||
console.log('创建支付订单API响应:', res);
|
||||
|
||||
if (res.statusCode === 200 && res.data.code === 200) {
|
||||
const paymentData = res.data.data;
|
||||
|
||||
// 如果返回了微信支付参数,调用微信支付SDK
|
||||
if (paymentData && paymentData.payInfo) {
|
||||
wx.hideLoading();
|
||||
wx.showLoading({ title: '调起微信支付...' });
|
||||
|
||||
try {
|
||||
const payInfo = typeof paymentData.payInfo === 'string'
|
||||
? JSON.parse(paymentData.payInfo)
|
||||
: paymentData.payInfo;
|
||||
|
||||
console.log('微信支付参数:', payInfo);
|
||||
|
||||
wx.requestPayment({
|
||||
timeStamp: payInfo.timeStamp,
|
||||
nonceStr: payInfo.nonceStr,
|
||||
package: payInfo.package,
|
||||
signType: payInfo.signType || 'RSA',
|
||||
paySign: payInfo.paySign,
|
||||
success: function (payRes) {
|
||||
wx.hideLoading();
|
||||
console.log('微信支付成功:', payRes);
|
||||
paySuccess(payOrderInfo, pageContext);
|
||||
resolve();
|
||||
},
|
||||
fail: function (payErr) {
|
||||
wx.hideLoading();
|
||||
console.error('微信支付失败:', payErr);
|
||||
payFail(payOrderInfo, payErr.errMsg);
|
||||
reject(payErr);
|
||||
}
|
||||
});
|
||||
} catch (parseErr) {
|
||||
wx.hideLoading();
|
||||
console.error('解析支付参数失败:', parseErr);
|
||||
payFail(payOrderInfo, '支付参数解析失败');
|
||||
reject(parseErr);
|
||||
}
|
||||
} else {
|
||||
// 如果没有返回微信支付参数,可能是模拟支付成功
|
||||
wx.hideLoading();
|
||||
console.log('支付处理完成,调用支付成功回调');
|
||||
paySuccess(payOrderInfo, pageContext);
|
||||
resolve();
|
||||
}
|
||||
} else {
|
||||
wx.hideLoading();
|
||||
console.error('创建支付订单失败:', res.data.message);
|
||||
const errorMsg = res.data.message || '创建支付订单失败';
|
||||
payFail(payOrderInfo, errorMsg);
|
||||
reject(new Error(errorMsg));
|
||||
}
|
||||
},
|
||||
fail: (err) => {
|
||||
wx.hideLoading();
|
||||
console.error('创建支付订单请求失败:', err);
|
||||
const errorMsg = '网络错误,支付失败';
|
||||
payFail(payOrderInfo, errorMsg);
|
||||
reject(err);
|
||||
}
|
||||
});
|
||||
});
|
||||
};
|
||||
Reference in New Issue
Block a user