|
|
@@ -1,5 +1,5 @@
|
|
|
<script>
|
|
|
-import {getPointOrderInfo} from '@/api/pointOrder'
|
|
|
+import {getPointOrderInfo,confirmReceipt,cancelReturn,orderLogisticsNo} from '@/api/pointOrder'
|
|
|
import ImageItem from "@/components/swiper/components/image.vue";
|
|
|
export default {
|
|
|
name: "orderDetails",
|
|
|
@@ -9,6 +9,7 @@ export default {
|
|
|
orderInfo: {},
|
|
|
afterSaleInfo:{},
|
|
|
productInfo:{},
|
|
|
+ refundType:'',
|
|
|
// 图片加载状态
|
|
|
imageErrorMap: {},
|
|
|
// 设备信息
|
|
|
@@ -82,26 +83,53 @@ export default {
|
|
|
this.orderInfo = orderInfo;
|
|
|
},
|
|
|
orderTitle(info){
|
|
|
- return info.orderStatusName || '--'
|
|
|
+ let orderTitleName = ''
|
|
|
+ if(this.orderInfo.orderStatus == 4){
|
|
|
+ orderTitleName = this.afterSaleInfo.afterSaleStatusName
|
|
|
+ }else{
|
|
|
+ orderTitleName = this.orderInfo.orderStatusName
|
|
|
+ }
|
|
|
+ return orderTitleName
|
|
|
},
|
|
|
// 处理退货操作
|
|
|
- handleRefund() {
|
|
|
- this.title = '确认收货';
|
|
|
- this.content = '为了保障您的权益,请收到商品确认无误后再确认收货'
|
|
|
+ handleRefund(val) {
|
|
|
+ this.refundType = val;
|
|
|
+ if(val === 'receipt'){
|
|
|
+ this.title = '确认收货';
|
|
|
+ this.content = '为了保障您的权益,请收到商品确认无误后再确认收货'
|
|
|
+ }
|
|
|
+ if(val === 'cancel'){
|
|
|
+ this.title = '取消申请';
|
|
|
+ this.content = '您确认取消发出的申请么'
|
|
|
+ }
|
|
|
this.show = true;
|
|
|
},
|
|
|
- // 确认收货
|
|
|
+ // 确认收货 取消申请接口对接
|
|
|
confirmReceive() {
|
|
|
- console.log('确认收货')
|
|
|
- // 这里可以调用确认收货API
|
|
|
- this.show = false;
|
|
|
+ var _this = this;
|
|
|
+ let apiUrl = this.refundType === 'receipt' ? confirmReceipt : this.refundType === 'cancel' ? cancelReturn : '';
|
|
|
+ apiUrl({
|
|
|
+ orderId:_this.orderInfo.id
|
|
|
+ }).then(res => {
|
|
|
+ if(res.code == 200){
|
|
|
+ _this.show = false;
|
|
|
+ _this.getOrderInfo();
|
|
|
+ }
|
|
|
+ })
|
|
|
},
|
|
|
// 提交物流单号
|
|
|
submitLogistics() {
|
|
|
- console.log('提交物流单号:', this.logisticsNumber)
|
|
|
- // 这里可以调用提交物流单号API
|
|
|
- this.showLogistics = false;
|
|
|
- this.logisticsNumber = '';
|
|
|
+ var _this = this;
|
|
|
+ orderLogisticsNo({
|
|
|
+ orderId: _this.orderInfo.id,
|
|
|
+ logisticsNo: _this.logisticsNumber
|
|
|
+ }).then(res => {
|
|
|
+ if(res.code == 200){
|
|
|
+ _this.showLogistics = false;
|
|
|
+ _this.logisticsNumber = '';
|
|
|
+ _this.getOrderInfo();
|
|
|
+ }
|
|
|
+ })
|
|
|
},
|
|
|
// 填写物流单号
|
|
|
handleLogistics() {
|
|
|
@@ -139,7 +167,19 @@ export default {
|
|
|
uni.navigateTo({
|
|
|
url: `/points/productDetails/applyRefund?receivedStatus=${receivedStatus}&tab=${tab}&orderNo=${this.orderInfo.orderNo}&orderId=${this.orderInfo.id}`
|
|
|
});
|
|
|
- }
|
|
|
+ },
|
|
|
+ //获取售后时间
|
|
|
+ getafterTime(){
|
|
|
+ let date = new Date("2026-04-22 09:38:54");
|
|
|
+ date.setDate(date.getDate() + 10); // 直接在“日期”上加10
|
|
|
+ return this.formatDate(date);
|
|
|
+ },
|
|
|
+ formatDate(date) {
|
|
|
+ const y = date.getFullYear();
|
|
|
+ const m = (date.getMonth() + 1).toString().padStart(2, '0');
|
|
|
+ const d = date.getDate().toString().padStart(2, '0');
|
|
|
+ return `${y}-${m}-${d}`;
|
|
|
+ },
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
@@ -148,7 +188,7 @@ export default {
|
|
|
<view class="order-details">
|
|
|
<!-- 顶部标题 -->
|
|
|
<view class="header">
|
|
|
- <text class="header-title">{{ orderTitle(orderInfo) }}</text>
|
|
|
+ <text class="header-title">{{ orderTitle() }}</text>
|
|
|
</view>
|
|
|
<!-- 商品信息 -->
|
|
|
<view class="product-info">
|
|
|
@@ -206,27 +246,88 @@ export default {
|
|
|
</view>
|
|
|
|
|
|
<!-- 退货信息 -->
|
|
|
-<!-- <view class="refund-info">-->
|
|
|
-<!-- <view class="info-item">-->
|
|
|
-<!-- <text class="info-label">退货原因</text>-->
|
|
|
-<!-- <text class="info-value">{{ orderInfo.refund.reason }}</text>-->
|
|
|
-<!-- </view>-->
|
|
|
-<!-- <view class="info-item">-->
|
|
|
-<!-- <text class="info-label">申请时间</text>-->
|
|
|
-<!-- <text class="info-value">{{ orderInfo.refund.applyTime }}</text>-->
|
|
|
-<!-- </view>-->
|
|
|
-<!-- </view>-->
|
|
|
+ <view class="refund-info" v-if="afterSaleInfo !== null && afterSaleInfo.afterSaleType == 1">
|
|
|
+ <view class="info-item">
|
|
|
+ <text class="info-label">退货原因</text>
|
|
|
+ <text class="info-value">{{ afterSaleInfo.applyReason }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="info-item" v-if="[0,2,3].includes(afterSaleInfo.afterSaleStatus)">
|
|
|
+ <text class="info-label">申请时间</text>
|
|
|
+ <text class="info-value">{{ afterSaleInfo.createTime }}</text>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="info-item" v-if="afterSaleInfo.afterSaleStatus == 1">
|
|
|
+ <text class="info-label">退款时间</text>
|
|
|
+ <text class="info-value">{{ afterSaleInfo.refund_time }}</text>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="info-item" v-if="[1,3].includes(afterSaleInfo.afterSaleStatus)">
|
|
|
+ <text class="info-label">物流单号</text>
|
|
|
+ <text class="info-value">{{ afterSaleInfo.logisticsNo }}</text>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="info-item" v-if="afterSaleInfo.afterSaleStatus == 1">
|
|
|
+ <text class="info-label">退款成功</text>
|
|
|
+ <text class="info-value" v-if="productInfo.paymentType == 1">{{ orderInfo.pointsUsed }}积分</text>
|
|
|
+ <text class="info-value" v-if="productInfo.paymentType == 2">¥{{ orderInfo.totalAmount }}</text>
|
|
|
+ <text class="info-value" v-if="productInfo.paymentType == 3">¥{{ orderInfo.totalAmount }}+{{ orderInfo.pointsUsed }}积分</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 换货信息 -->
|
|
|
+ <view class="refund-info" v-if="afterSaleInfo !== null && afterSaleInfo.afterSaleType == 2">
|
|
|
+ <view class="info-item">
|
|
|
+ <text class="info-label">退货原因</text>
|
|
|
+ <text class="info-value">{{ afterSaleInfo.applyReason }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="info-item" v-if="[0,2,3,4].includes(afterSaleInfo.afterSaleStatus)">
|
|
|
+ <text class="info-label">申请时间</text>
|
|
|
+ <text class="info-value">{{ afterSaleInfo.createTime }}</text>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="info-item" v-if="[3].includes(afterSaleInfo.afterSaleStatus)">
|
|
|
+ <text class="info-label">物流单号</text>
|
|
|
+ <text class="info-value">{{ afterSaleInfo.logisticsNo }}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 未收到货 -->
|
|
|
+ <view class="refund-info" v-if="afterSaleInfo !== null && afterSaleInfo.afterSaleType == 3">
|
|
|
+ <view class="info-item">
|
|
|
+ <text class="info-label">退货原因</text>
|
|
|
+ <text class="info-value">{{ afterSaleInfo.applyReason }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="info-item" v-if="afterSaleInfo.afterSaleStatus == 0">
|
|
|
+ <text class="info-label">申请时间</text>
|
|
|
+ <text class="info-value">{{ afterSaleInfo.createTime }}</text>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="info-item" v-if="afterSaleInfo.afterSaleStatus == 1">
|
|
|
+ <text class="info-label">退款时间</text>
|
|
|
+ <text class="info-value">{{ afterSaleInfo.refund_time }}</text>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="info-item" v-if="afterSaleInfo.afterSaleStatus == 1">
|
|
|
+ <text class="info-label">退款成功</text>
|
|
|
+ <text class="info-value" v-if="productInfo.paymentType == 1">{{ orderInfo.pointsUsed }}积分</text>
|
|
|
+ <text class="info-value" v-if="productInfo.paymentType == 2">¥{{ orderInfo.totalAmount }}</text>
|
|
|
+ <text class="info-value" v-if="productInfo.paymentType == 3">¥{{ orderInfo.totalAmount }}+{{ orderInfo.pointsUsed }}积分</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
|
|
|
<!-- 操作按钮 -->
|
|
|
- <view class="action-buttons" :class="{ 'safe-area': hasSafeArea }">
|
|
|
- <button class="detail-button" @click="handleAfterSales">退款\售后</button>
|
|
|
- <button class="action-button" @click="handleRefund">同意退货</button>
|
|
|
- <button class="action-button" @click="handleLogistics">填写物流单号</button>
|
|
|
+ <view class="action-buttons" :class="{ 'safe-area': hasSafeArea }" v-if="orderInfo.orderStatus == 2">
|
|
|
+ <button class="detail-button" @click="handleAfterSales" v-if="afterSaleInfo == null">退款\售后</button>
|
|
|
+ <button class="action-button" @click="handleRefund('receipt')">确认收货</button>
|
|
|
+ </view>
|
|
|
+ <view class="action-buttons" :class="{ 'safe-area': hasSafeArea }" v-if="orderInfo.orderStatus == 4 && ([0,2].includes(afterSaleInfo.afterSaleStatus))">
|
|
|
+ <button class="action-button" @click="handleRefund('cancel')">取消申请</button>
|
|
|
+ <button class="action-button" @click="handleLogistics" v-if="afterSaleInfo.afterSaleStatus == 2">填写物流单号</button>
|
|
|
</view>
|
|
|
<!-- 弹出层 -->
|
|
|
<u-modal :show="show" :title="title" :content='content' :show-cancel="false">
|
|
|
<view slot="default" class="modal-content">
|
|
|
- <text class="modal-text">为了保障您的权益,请收到商品确认无误后再确认收货</text>
|
|
|
+ <text class="modal-text">{{content}}</text>
|
|
|
</view>
|
|
|
<view slot="confirmButton" class="modal-footer">
|
|
|
<button class="modal-cancel" @click="show = false">取消</button>
|
|
|
@@ -302,21 +403,30 @@ export default {
|
|
|
</view>
|
|
|
|
|
|
<!-- 商品选择 -->
|
|
|
-<!-- <view class="popup-section">-->
|
|
|
-<!-- <text class="section-title">-->
|
|
|
-<!-- 请选择商品-->
|
|
|
-<!-- <text v-if="receiptStatus === 'received'" class="time-limit">(2026-4-1 24时之前可申请)</text>-->
|
|
|
-<!-- </text>-->
|
|
|
-<!-- <view class="product-item">-->
|
|
|
-<!-- <view class="product-image">-->
|
|
|
-<!-- <image :src="orderInfo.product.image" mode="aspectFill"></image>-->
|
|
|
-<!-- </view>-->
|
|
|
-<!-- <view class="product-details">-->
|
|
|
-<!-- <text class="product-name">{{ orderInfo.product.name }}</text>-->
|
|
|
-<!-- <text class="product-spec">已选: {{ orderInfo.product.spec }}</text>-->
|
|
|
-<!-- </view>-->
|
|
|
-<!-- </view>-->
|
|
|
-<!-- </view>-->
|
|
|
+ <view class="popup-section">
|
|
|
+ <text class="section-title">
|
|
|
+ 请选择商品
|
|
|
+ <text v-if="receiptStatus === 'received'" class="time-limit">({{ getafterTime() }} 24时之前可申请)</text>
|
|
|
+ </text>
|
|
|
+ <view class="product-item">
|
|
|
+ <view class="product-image">
|
|
|
+ <view v-if="!imageErrorMap[productInfo.productId]" class="product-image">
|
|
|
+ <ImageItem
|
|
|
+ :src="getImageUrl(productInfo.skuImage)"
|
|
|
+ @image-error="handleImageError(productInfo.productId)"
|
|
|
+ />
|
|
|
+ </view>
|
|
|
+ <view v-else style="display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100rpx; background-color: #f5f5f5; border-radius: 8rpx;">
|
|
|
+ <uni-icons type="image" size="44rpx" color="#999" @click="resetImageError(productInfo.productId)"></uni-icons>
|
|
|
+ <text style="font-size: 20rpx; color: #999; margin-top: 3rpx;">加载失败</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="product-details">
|
|
|
+ <text class="product-name">{{ productInfo.productName }}</text>
|
|
|
+ <text class="product-spec">已选: {{ productInfo.skuSpec }}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
|
|
|
<!-- 下一步按钮 -->
|
|
|
<view class="popup-footer">
|