申请退款

src/pages/order/afterSales.vue

@@ -3,7 +3,7 @@
     <Header title="售后详情"></Header>
 
     <view class="content">
-      <view class="box box1">
+      <view class="box box1" v-if="afterSaleDetail">
         <view class="money">
           <view class="money_l">退款金额</view>
           <view class="money_r">￥{{ afterSaleDetail.refundPrice }}</view>
@@ -20,11 +20,11 @@
           </view>
         </view>
       </view>
-      <view class="box">
+      <view class="box" v-if="orderItems">
         <view class="goods">
           <view class="g1">退款信息</view>
           <view class="g2" v-for="(item, index) in orderItems" :key="index">
-            <img :src="fileDomain + item.pic" />
+            <img :src="fileDomain + item.pic" mode="aspectFill" />
             <view class="g2_item">
               <view class="g2_info">
                 <view class="g2_name">{{ item.prodName }}</view>
@@ -68,8 +68,8 @@ const getAterSaleDetail = async (id) => {
   orderItems.value = res.data[0].orderItems;
 };
 onLoad((options) => {
-  // orderNumber.value = options.orderNumber;
-  getAterSaleDetail('NEONO-2024080113095213631');
+  orderNumber.value = options.orderNumber;
+  getAterSaleDetail(orderNumber.value);
 });
 </script>
 

src/pages/order/order.vue

@@ -123,12 +123,15 @@ import { getOrderDic } from '@/utils/orderDic';
 const fileDomain = import.meta.env.VITE_APP_IMG_URL;
 
 const stateList = ref();
-onLoad(() => {
+onLoad((options) => {
   const orderDic = getOrderDic();
   stateList.value = orderDic.reduce((obj, item) => {
     obj[item.baseStatus] = item;
     return obj;
   }, {});
+  if (options.status) {
+    tab.value = options.status;
+  }
   getList();
 });
 
@@ -158,7 +161,7 @@ const tabs = ref([
     value: 'after_sales',
   },
 ]);
-const tab = ref('0');
+const tab = ref('all');
 
 onShow(() => {
   if (pendingPaymentOrder.value) {
@@ -236,6 +239,9 @@ const getList = async () => {
   state.value = 'finished';
 };
 
+/**
+ * 切换状态栏
+ */
 const handleChange = (e) => {
   tab.value = e.name;
   initDataList();

src/pages/order/refund.vue

@@ -47,13 +47,14 @@
         <view class="content-between" @tap="showPop = true">
           <text>退款原因</text>
           <view class="rightbox">
-            <text>选择退款原因</text>
+            <text v-if="selectType">{{ reasonList[selectType].name }}</text>
+            <text v-else>选择退款原因</text>
             <wd-icon name="arrow-right" size="22px"></wd-icon>
           </view>
         </view>
       </view>
 
-      <view class="btn">提交</view>
+      <view class="btn" @tap="submit">提交</view>
     </view>
   </view>
   <wd-popup
@@ -88,7 +89,7 @@
           placeholder-style="font-size:28rpx;color: #c0c4cc;"
         ></textarea>
       </radio-group>
-      <view class="btn">确认</view>
+      <view class="btn" @tap="chooseReason">确认</view>
     </view>
   </wd-popup>
 </template>
@@ -121,7 +122,7 @@ function handleChange({ fileList: files }) {
 }
 
 const showPop = ref(false);
-const selectType = ref(0);
+const selectType = ref(null);
 const reasonList = ref([
   {
     id: '0',
@@ -149,6 +150,59 @@ function radioChange(evt) {
   const { value } = evt.detail;
   selectType.value = value;
 }
+
+const submit = async () => {
+  if (!selectType.value) {
+    return xma.showToast({
+      title: '请选择退款原因',
+      icon: 'none',
+    });
+  }
+  if (selectType.value === '4' && !otherReason.value) {
+    return xma.showToast({
+      title: '请输入其他原因',
+      icon: 'none',
+    });
+  }
+  xma.showLoading({
+    title: '提交中',
+    mask: true,
+  });
+  await applyForARefundApi({
+    orderNumber: orderNumber.value,
+    refundMemo:
+      selectType.value === 4 ? otherReason.value : reasonList.value[selectType.value].name,
+    imgs: fileList.value.map((item) => item.url),
+  });
+  setTimeout(() => {
+    xma.hideLoading();
+    setTimeout(() => {
+      xma.showToast({
+        title: '提交成功',
+        icon: 'success',
+      });
+    }, 500);
+    xma.redirectTo({
+      url: `/pages/order/order?status=after_sales`,
+    });
+  }, 1500);
+};
+
+const chooseReason = () => {
+  if (!selectType.value) {
+    return xma.showToast({
+      title: '请选择退款原因',
+      icon: 'none',
+    });
+  }
+  if (selectType.value === '4' && !otherReason.value) {
+    return xma.showToast({
+      title: '请输入其他原因',
+      icon: 'none',
+    });
+  }
+  showPop.value = false;
+};
 </script>
 
 <style lang="scss" scoped>

src/utils/request.js

@@ -26,6 +26,7 @@ export const request = ({ url, data = {}, header, method = 'GET' }) => {
             duration: 1000,
             icon: 'none',
           });
+          return;
         }
         resolve(res.data);
       },