|
@@ -13,8 +13,22 @@
|
|
|
</template>
|
|
</template>
|
|
|
<template v-else>
|
|
<template v-else>
|
|
|
<view class="status-title">{{ getStatusText(orderInfo.status) }}</view>
|
|
<view class="status-title">{{ getStatusText(orderInfo.status) }}</view>
|
|
|
|
|
+ <!-- 协商UI -->
|
|
|
|
|
+ <view class="negotiation-card" v-if="orderInfo.status == '2'">
|
|
|
|
|
+ <view class="negotiation-content">
|
|
|
|
|
+ <u-icon name="file-text-fill" color="#FF6600" size="40" class="negotiation-icon"></u-icon>
|
|
|
|
|
+ <view class="negotiation-text">
|
|
|
|
|
+ <view class="negotiation-title">协商修改退款金额为{{ orderInfo.refundMoney }}元</view>
|
|
|
|
|
+ <view class="negotiation-desc">我们愿意支持退款,若您接受修改金额,我们将立刻退款给您</view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="negotiation-actions">
|
|
|
|
|
+ <u-button size="mini" :custom-style="rejectBtnStyle" @click="handleNegotiation(false)">拒绝协商</u-button>
|
|
|
|
|
+ <u-button size="mini" :custom-style="acceptBtnStyle" @click="handleNegotiation(true)">接受协商</u-button>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
<!-- 退款成功金额展示 -->
|
|
<!-- 退款成功金额展示 -->
|
|
|
- <view class="refund-amount-box" v-if="orderInfo.status == '6' || orderInfo.status == '2'">
|
|
|
|
|
|
|
+ <view class="refund-amount-box" v-if="orderInfo.status == '8'">
|
|
|
<view class="amount-row">
|
|
<view class="amount-row">
|
|
|
<text class="label">退回余额</text>
|
|
<text class="label">退回余额</text>
|
|
|
<text class="value">¥{{ orderInfo.refundMoney }}</text>
|
|
<text class="value">¥{{ orderInfo.refundMoney }}</text>
|
|
@@ -23,6 +37,42 @@
|
|
|
</template>
|
|
</template>
|
|
|
</view>
|
|
</view>
|
|
|
|
|
|
|
|
|
|
+ <!-- 退货方式 (状态为4时显示) -->
|
|
|
|
|
+ <view class="info-card return-method-card" v-if="orderInfo.status == '4'">
|
|
|
|
|
+ <view class="card-title">请选择退货方式</view>
|
|
|
|
|
+ <!-- 这里可以加倒计时,类似:1天11时57分后未寄出平台将自动撤销退货申请,需根据接口返回字段 -->
|
|
|
|
|
+
|
|
|
|
|
+ <view class="method-tabs">
|
|
|
|
|
+ <view class="tab-item disabled">
|
|
|
|
|
+ <view class="tab-name">上门取件</view>
|
|
|
|
|
+ <view class="tab-desc">(快递员上门取包裹)</view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="tab-item disabled">
|
|
|
|
|
+ <view class="tab-name">驿站自寄</view>
|
|
|
|
|
+ <view class="tab-desc">(随到随退)</view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="tab-item active">
|
|
|
|
|
+ <view class="tab-name">自行寄回</view>
|
|
|
|
|
+ <view class="tab-desc">(需填写单号)</view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+
|
|
|
|
|
+ <view class="warning-box">
|
|
|
|
|
+ 需您自行联系快递公司退回,请不要邮寄到付
|
|
|
|
|
+ </view>
|
|
|
|
|
+
|
|
|
|
|
+ <view class="address-box">
|
|
|
|
|
+ <view class="address-label">平台地址</view>
|
|
|
|
|
+ <view class="address-content">
|
|
|
|
|
+ <view class="name">{{ orderInfo.platformReceiveName || '张三' }}</view>
|
|
|
|
|
+ <view class="detail">{{ orderInfo.platformReceiveAddress || '河南省鹤壁市浚县即可获得发货单收到单方事故师范号到' }} <image src="/pages-mine/static/copy.png" class="copy-icon" @click="copyAddress"></image></view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <u-icon name="arrow-right" color="#ccc" size="28"></u-icon>
|
|
|
|
|
+ </view>
|
|
|
|
|
+
|
|
|
|
|
+ <u-button type="success" shape="circle" :custom-style="fillBtnStyle" @click="goToFillLogistics">填写单号</u-button>
|
|
|
|
|
+ </view>
|
|
|
|
|
+
|
|
|
<!-- 商品列表 -->
|
|
<!-- 商品列表 -->
|
|
|
<view class="info-card goods-card">
|
|
<view class="info-card goods-card">
|
|
|
<view class="goods-item" v-for="(goods, index) in orderInfo.detailList" :key="index">
|
|
<view class="goods-item" v-for="(goods, index) in orderInfo.detailList" :key="index">
|
|
@@ -165,6 +215,34 @@
|
|
|
backgroundColor: '#38C148',
|
|
backgroundColor: '#38C148',
|
|
|
color: '#fff',
|
|
color: '#fff',
|
|
|
border: 'none'
|
|
border: 'none'
|
|
|
|
|
+ },
|
|
|
|
|
+ rejectBtnStyle: {
|
|
|
|
|
+ color: '#333',
|
|
|
|
|
+ backgroundColor: '#fff',
|
|
|
|
|
+ border: '1rpx solid #ccc',
|
|
|
|
|
+ minWidth: '160rpx',
|
|
|
|
|
+ height: '60rpx',
|
|
|
|
|
+ lineHeight: '60rpx',
|
|
|
|
|
+ fontSize: '26rpx',
|
|
|
|
|
+ margin: '0 20rpx 0 0'
|
|
|
|
|
+ },
|
|
|
|
|
+ acceptBtnStyle: {
|
|
|
|
|
+ color: '#fff',
|
|
|
|
|
+ backgroundColor: '#FF6600',
|
|
|
|
|
+ border: 'none',
|
|
|
|
|
+ minWidth: '160rpx',
|
|
|
|
|
+ height: '60rpx',
|
|
|
|
|
+ lineHeight: '60rpx',
|
|
|
|
|
+ fontSize: '26rpx',
|
|
|
|
|
+ margin: '0'
|
|
|
|
|
+ },
|
|
|
|
|
+ fillBtnStyle: {
|
|
|
|
|
+ backgroundColor: '#38C148',
|
|
|
|
|
+ color: '#fff',
|
|
|
|
|
+ height: '80rpx',
|
|
|
|
|
+ fontSize: '30rpx',
|
|
|
|
|
+ marginTop: '30rpx',
|
|
|
|
|
+ width: '100%'
|
|
|
}
|
|
}
|
|
|
};
|
|
};
|
|
|
},
|
|
},
|
|
@@ -198,16 +276,33 @@
|
|
|
},
|
|
},
|
|
|
getStatusText(status) {
|
|
getStatusText(status) {
|
|
|
// 状态 1-申请退款 2-审核通过 3-审核驳回 4-超时关闭 5-卖家已发货 6-已完成
|
|
// 状态 1-申请退款 2-审核通过 3-审核驳回 4-超时关闭 5-卖家已发货 6-已完成
|
|
|
|
|
+ // 状态 1-申请退款 2-协商中待用户确认 3-协商中待商家确认 4-审核通过 5-审核驳回 6-超时关闭 7-卖家已发货 8-已完成
|
|
|
const map = {
|
|
const map = {
|
|
|
'1': '待卖家处理',
|
|
'1': '待卖家处理',
|
|
|
- '2': '审核通过',
|
|
|
|
|
- '3': '审核驳回',
|
|
|
|
|
- '4': '退款关闭', // 超时关闭
|
|
|
|
|
- '5': '卖家已发货', // 可能是换货场景
|
|
|
|
|
- '6': '退款成功'
|
|
|
|
|
|
|
+ '2': '协商中待用户确认',
|
|
|
|
|
+ '3': '协商中待商家确认',
|
|
|
|
|
+ '4': '审核已通过,请您把书籍自行寄回',
|
|
|
|
|
+ '5': '审核已驳回',
|
|
|
|
|
+ '6': '退款关闭', // 超时关闭
|
|
|
|
|
+ '7': '卖家已发货', // 可能是换货场景
|
|
|
|
|
+ '8': '退款成功'
|
|
|
};
|
|
};
|
|
|
return map[status] || '处理中';
|
|
return map[status] || '处理中';
|
|
|
},
|
|
},
|
|
|
|
|
+ copyAddress() {
|
|
|
|
|
+ const address = (this.orderInfo.platformReceiveName || '张三') + ' ' + (this.orderInfo.platformReceiveAddress || '河南省鹤壁市浚县即可获得发货单收到单方事故师范号到');
|
|
|
|
|
+ uni.setClipboardData({
|
|
|
|
|
+ data: address,
|
|
|
|
|
+ success: () => {
|
|
|
|
|
+ uni.showToast({ title: '地址复制成功', icon: 'none' });
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
|
|
+ goToFillLogistics() {
|
|
|
|
|
+ uni.navigateTo({
|
|
|
|
|
+ url: `/pages-car/pages/fill-logistics?refundOrderId=${this.refundOrderId}`
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
copyOrderNo() {
|
|
copyOrderNo() {
|
|
|
uni.setClipboardData({
|
|
uni.setClipboardData({
|
|
|
data: String(this.orderInfo.refundOrderId || ''),
|
|
data: String(this.orderInfo.refundOrderId || ''),
|
|
@@ -230,6 +325,32 @@
|
|
|
handlePositionChange(position) {
|
|
handlePositionChange(position) {
|
|
|
this.servicePosition = position;
|
|
this.servicePosition = position;
|
|
|
},
|
|
},
|
|
|
|
|
+ handleNegotiation(accept) {
|
|
|
|
|
+ const title = accept ? '确认接受协商金额?' : '确认拒绝协商?';
|
|
|
|
|
+ uni.showModal({
|
|
|
|
|
+ title: '提示',
|
|
|
|
|
+ content: title,
|
|
|
|
|
+ success: (res) => {
|
|
|
|
|
+ if (res.confirm) {
|
|
|
|
|
+ // TODO: Call API
|
|
|
|
|
+ // const api = accept ? this.$u.api.refundNegotiateAgreeAjax : this.$u.api.refundNegotiateRefuseAjax;
|
|
|
|
|
+ // api(...)
|
|
|
|
|
+
|
|
|
|
|
+ // 模拟成功
|
|
|
|
|
+ uni.showLoading({ title: '处理中' });
|
|
|
|
|
+ setTimeout(() => {
|
|
|
|
|
+ uni.hideLoading();
|
|
|
|
|
+ uni.showToast({
|
|
|
|
|
+ title: accept ? '已接受协商' : '已拒绝协商',
|
|
|
|
|
+ icon: 'success'
|
|
|
|
|
+ });
|
|
|
|
|
+ // 刷新详情
|
|
|
|
|
+ this.getDetail();
|
|
|
|
|
+ }, 1000);
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
handleAction(type) {
|
|
handleAction(type) {
|
|
|
switch (type) {
|
|
switch (type) {
|
|
|
case 'cancel':
|
|
case 'cancel':
|
|
@@ -320,6 +441,44 @@
|
|
|
color: #999;
|
|
color: #999;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
+ .negotiation-card {
|
|
|
|
|
+ margin-top: 30rpx;
|
|
|
|
|
+ text-align: left;
|
|
|
|
|
+
|
|
|
|
|
+ .negotiation-content {
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ align-items: flex-start;
|
|
|
|
|
+ margin-bottom: 30rpx;
|
|
|
|
|
+
|
|
|
|
|
+ .negotiation-icon {
|
|
|
|
|
+ margin-right: 20rpx;
|
|
|
|
|
+ margin-top: 6rpx;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .negotiation-text {
|
|
|
|
|
+ flex: 1;
|
|
|
|
|
+
|
|
|
|
|
+ .negotiation-title {
|
|
|
|
|
+ font-size: 30rpx;
|
|
|
|
|
+ font-weight: bold;
|
|
|
|
|
+ color: #333;
|
|
|
|
|
+ margin-bottom: 10rpx;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .negotiation-desc {
|
|
|
|
|
+ font-size: 26rpx;
|
|
|
|
|
+ color: #999;
|
|
|
|
|
+ line-height: 1.4;
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .negotiation-actions {
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ justify-content: flex-end;
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
.refund-amount-box {
|
|
.refund-amount-box {
|
|
|
margin-top: 30rpx;
|
|
margin-top: 30rpx;
|
|
|
padding-top: 30rpx;
|
|
padding-top: 30rpx;
|
|
@@ -347,6 +506,108 @@
|
|
|
margin: 20rpx;
|
|
margin: 20rpx;
|
|
|
border-radius: 16rpx;
|
|
border-radius: 16rpx;
|
|
|
padding: 30rpx;
|
|
padding: 30rpx;
|
|
|
|
|
+
|
|
|
|
|
+ &.return-method-card {
|
|
|
|
|
+ .card-title {
|
|
|
|
|
+ font-size: 32rpx;
|
|
|
|
|
+ font-weight: bold;
|
|
|
|
|
+ color: #333;
|
|
|
|
|
+ text-align: center;
|
|
|
|
|
+ margin-bottom: 30rpx;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .method-tabs {
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ justify-content: space-between;
|
|
|
|
|
+ margin-bottom: 30rpx;
|
|
|
|
|
+
|
|
|
|
|
+ .tab-item {
|
|
|
|
|
+ flex: 1;
|
|
|
|
|
+ background-color: #F8F8F8;
|
|
|
|
|
+ border-radius: 12rpx;
|
|
|
|
|
+ padding: 20rpx 0;
|
|
|
|
|
+ text-align: center;
|
|
|
|
|
+ margin-right: 20rpx;
|
|
|
|
|
+ border: 2rpx solid transparent;
|
|
|
|
|
+
|
|
|
|
|
+ &:last-child {
|
|
|
|
|
+ margin-right: 0;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ &.active {
|
|
|
|
|
+ background-color: #F0F9F1;
|
|
|
|
|
+ border-color: #38C148;
|
|
|
|
|
+ .tab-name { color: #38C148; }
|
|
|
|
|
+ .tab-desc { color: #38C148; opacity: 0.8; }
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ &.disabled {
|
|
|
|
|
+ opacity: 0.5;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .tab-name {
|
|
|
|
|
+ font-size: 30rpx;
|
|
|
|
|
+ font-weight: bold;
|
|
|
|
|
+ color: #333;
|
|
|
|
|
+ margin-bottom: 6rpx;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .tab-desc {
|
|
|
|
|
+ font-size: 22rpx;
|
|
|
|
|
+ color: #999;
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .warning-box {
|
|
|
|
|
+ background-color: #E8F5E9;
|
|
|
|
|
+ color: #38C148;
|
|
|
|
|
+ font-size: 26rpx;
|
|
|
|
|
+ padding: 16rpx;
|
|
|
|
|
+ border-radius: 8rpx;
|
|
|
|
|
+ text-align: center;
|
|
|
|
|
+ margin-bottom: 30rpx;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .address-box {
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ align-items: center;
|
|
|
|
|
+ padding: 20rpx 0;
|
|
|
|
|
+ border-top: 1rpx solid #F5F5F5;
|
|
|
|
|
+
|
|
|
|
|
+ .address-label {
|
|
|
|
|
+ width: 140rpx;
|
|
|
|
|
+ font-size: 28rpx;
|
|
|
|
|
+ color: #333;
|
|
|
|
|
+ font-weight: bold;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .address-content {
|
|
|
|
|
+ flex: 1;
|
|
|
|
|
+ padding-right: 20rpx;
|
|
|
|
|
+
|
|
|
|
|
+ .name {
|
|
|
|
|
+ font-size: 30rpx;
|
|
|
|
|
+ font-weight: bold;
|
|
|
|
|
+ color: #333;
|
|
|
|
|
+ margin-bottom: 10rpx;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .detail {
|
|
|
|
|
+ font-size: 26rpx;
|
|
|
|
|
+ color: #666;
|
|
|
|
|
+ line-height: 1.4;
|
|
|
|
|
+
|
|
|
|
|
+ .copy-icon {
|
|
|
|
|
+ width: 28rpx;
|
|
|
|
|
+ height: 28rpx;
|
|
|
|
|
+ vertical-align: middle;
|
|
|
|
|
+ margin-left: 10rpx;
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
|
|
|
&.goods-card {
|
|
&.goods-card {
|
|
|
.goods-item {
|
|
.goods-item {
|