|
@@ -8,7 +8,7 @@
|
|
|
<Clock />
|
|
<Clock />
|
|
|
</el-icon>
|
|
</el-icon>
|
|
|
</div>
|
|
</div>
|
|
|
- <div class="header-title">申请售后</div>
|
|
|
|
|
|
|
+ <div class="header-title">{{ viewMode ? '售后详情' : '申请售后' }}</div>
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
<div class="header-center">
|
|
<div class="header-center">
|
|
@@ -34,7 +34,7 @@
|
|
|
<div class="panel">
|
|
<div class="panel">
|
|
|
<div class="panel-title">选择服务类型:</div>
|
|
<div class="panel-title">选择服务类型:</div>
|
|
|
<div class="service-type">
|
|
<div class="service-type">
|
|
|
- <el-radio-group v-model="form.serviceType" size="large">
|
|
|
|
|
|
|
+ <el-radio-group v-model="form.serviceType" size="large" :disabled="viewMode">
|
|
|
<el-radio-button label="1">退换货</el-radio-button>
|
|
<el-radio-button label="1">退换货</el-radio-button>
|
|
|
<el-radio-button label="3">维修</el-radio-button>
|
|
<el-radio-button label="3">维修</el-radio-button>
|
|
|
</el-radio-group>
|
|
</el-radio-group>
|
|
@@ -111,12 +111,12 @@
|
|
|
<div class="panel-title">售后服务单信息:</div>
|
|
<div class="panel-title">售后服务单信息:</div>
|
|
|
<el-form ref="formRef" :model="form" :rules="rules" label-width="80px" class="after-form">
|
|
<el-form ref="formRef" :model="form" :rules="rules" label-width="80px" class="after-form">
|
|
|
<el-form-item label="退货原因" prop="returnReasonId">
|
|
<el-form-item label="退货原因" prop="returnReasonId">
|
|
|
- <el-select v-model="form.returnReasonId" placeholder="请选择" style="width: 200px" @change="handleReturnReasonChange">
|
|
|
|
|
|
|
+ <el-select v-model="form.returnReasonId" placeholder="请选择" style="width: 200px" @change="handleReturnReasonChange" :disabled="viewMode">
|
|
|
<el-option v-for="r in reasonOptions" :key="r.id" :label="r.returnReasonName" :value="r.id" />
|
|
<el-option v-for="r in reasonOptions" :key="r.id" :label="r.returnReasonName" :value="r.id" />
|
|
|
</el-select>
|
|
</el-select>
|
|
|
</el-form-item>
|
|
</el-form-item>
|
|
|
<el-form-item label="问题描述" prop="problemDescription">
|
|
<el-form-item label="问题描述" prop="problemDescription">
|
|
|
- <el-input v-model="form.problemDescription" type="textarea" :rows="5" placeholder="请输入问题描述" />
|
|
|
|
|
|
|
+ <el-input v-model="form.problemDescription" type="textarea" :rows="5" placeholder="请输入问题描述" :disabled="viewMode" />
|
|
|
</el-form-item>
|
|
</el-form-item>
|
|
|
<!-- <el-form-item label="凭证图片">
|
|
<!-- <el-form-item label="凭证图片">
|
|
|
<el-upload v-model:file-list="form.voucherPhotoArray" list-type="picture-card" :action="action" :auto-upload="false" :limit="5">
|
|
<el-upload v-model:file-list="form.voucherPhotoArray" list-type="picture-card" :action="action" :auto-upload="false" :limit="5">
|
|
@@ -129,11 +129,12 @@
|
|
|
<img class="upload-img" :src="item" />
|
|
<img class="upload-img" :src="item" />
|
|
|
<div class="upload-box">
|
|
<div class="upload-box">
|
|
|
<el-icon @click="previewImage(item)" color="#ffffff" size="20" class="mr-[20px] icons"><Search /></el-icon>
|
|
<el-icon @click="previewImage(item)" color="#ffffff" size="20" class="mr-[20px] icons"><Search /></el-icon>
|
|
|
- <el-icon @click="onDel(index)" color="#ffffff" size="20" class="icons"><Delete /></el-icon>
|
|
|
|
|
|
|
+ <el-icon @click="!viewMode && onDel(index)" color="#ffffff" size="20" class="icons"><Delete /></el-icon>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
<el-upload
|
|
<el-upload
|
|
|
|
|
+ v-if="!viewMode"
|
|
|
class="avatar-uploader"
|
|
class="avatar-uploader"
|
|
|
:action="action"
|
|
:action="action"
|
|
|
:limit="5"
|
|
:limit="5"
|
|
@@ -149,7 +150,7 @@
|
|
|
</el-form>
|
|
</el-form>
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
- <div class="panel">
|
|
|
|
|
|
|
+ <!-- <div class="panel">
|
|
|
<div class="panel-title">选择取件方式:</div>
|
|
<div class="panel-title">选择取件方式:</div>
|
|
|
<el-radio-group v-model="form.returnMethod" class="pickup-type">
|
|
<el-radio-group v-model="form.returnMethod" class="pickup-type">
|
|
|
<el-radio label="1">上门取件</el-radio>
|
|
<el-radio label="1">上门取件</el-radio>
|
|
@@ -188,9 +189,9 @@
|
|
|
<div class="pickup-row hint">提交服务单后,售后专员可能与您电话沟通,请保持手机畅通</div>
|
|
<div class="pickup-row hint">提交服务单后,售后专员可能与您电话沟通,请保持手机畅通</div>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
- </div>
|
|
|
|
|
|
|
+ </div> -->
|
|
|
|
|
|
|
|
- <div class="footer">
|
|
|
|
|
|
|
+ <div class="footer" v-if="!viewMode">
|
|
|
<el-button type="danger" class="submit-btn" @click="handleSubmit">提交</el-button>
|
|
<el-button type="danger" class="submit-btn" @click="handleSubmit">提交</el-button>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
@@ -251,6 +252,8 @@ const router = useRouter();
|
|
|
const route = useRoute();
|
|
const route = useRoute();
|
|
|
const loading = ref(false);
|
|
const loading = ref(false);
|
|
|
const orderId = ref<any>(0);
|
|
const orderId = ref<any>(0);
|
|
|
|
|
+const viewMode = ref(false); // 查看详情模式
|
|
|
|
|
+const returnId = ref<any>(0); // 售后单ID
|
|
|
|
|
|
|
|
const addressDialogVisible = ref(false);
|
|
const addressDialogVisible = ref(false);
|
|
|
const addressLoading = ref(false);
|
|
const addressLoading = ref(false);
|
|
@@ -493,7 +496,59 @@ const handleBuyAgain = () => {
|
|
|
ElMessage.info('再次购买');
|
|
ElMessage.info('再次购买');
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
-// 加载订单详情
|
|
|
|
|
|
|
+// 加载售后详情(查看详情模式)
|
|
|
|
|
+const loadReturnDetail = async () => {
|
|
|
|
|
+ try {
|
|
|
|
|
+ loading.value = true;
|
|
|
|
|
+ const res = await getOrderReturnInfo(returnId.value);
|
|
|
|
|
+ if (res.code === 200 && res.data) {
|
|
|
|
|
+ const data = res.data;
|
|
|
|
|
+ // 映射售后信息
|
|
|
|
|
+ orderInfo.orderId = data.orderId;
|
|
|
|
|
+ orderInfo.orderNo = data.orderNo;
|
|
|
|
|
+ form.orderId = data.orderId;
|
|
|
|
|
+ form.orderNo = data.orderNo;
|
|
|
|
|
+ form.orderAmount = data.orderAmount || '0.00';
|
|
|
|
|
+ orderInfo.orderTime = data.returnTime;
|
|
|
|
|
+ orderInfo.freight = '0.00';
|
|
|
|
|
+ orderInfo.totalAmount = data.afterSaleAmount || '0.00';
|
|
|
|
|
+ form.customerNo = data.customerNo;
|
|
|
|
|
+ form.serviceType = data.serviceType;
|
|
|
|
|
+ form.returnReasonId = data.returnReasonId;
|
|
|
|
|
+ form.returnReason = data.returnReason;
|
|
|
|
|
+ form.problemDescription = data.problemDescription;
|
|
|
|
|
+ form.voucherPhoto = data.voucherPhoto || '';
|
|
|
|
|
+
|
|
|
|
|
+ // 映射商品信息
|
|
|
|
|
+ if (data.orderReturnItemList && data.orderReturnItemList.length > 0) {
|
|
|
|
|
+ selectedProducts.value = data.orderReturnItemList.map((p: any) => {
|
|
|
|
|
+ return {
|
|
|
|
|
+ productId: p.productId,
|
|
|
|
|
+ productNo: p.productNo,
|
|
|
|
|
+ productUnit: p.productUnit || '',
|
|
|
|
|
+ productImage: p.productImage || '',
|
|
|
|
|
+ name: p.productName || '',
|
|
|
|
|
+ spec: `${p.productUnit || ''} ${p.productNo || ''}`.trim(),
|
|
|
|
|
+ unitPrice: Number(p.returnPrice) || Number(p.orderPrice) || 0,
|
|
|
|
|
+ soldQty: Number(p.returnQuantity) || 0,
|
|
|
|
|
+ availableQty: Number(p.returnQuantity) || 0,
|
|
|
|
|
+ returnQuantity: Number(p.returnQuantity) || 0,
|
|
|
|
|
+ orderProductId: p.orderProductId,
|
|
|
|
|
+ productName: p.productName,
|
|
|
|
|
+ reasonDetail: data.returnReason
|
|
|
|
|
+ } as ApplyProduct;
|
|
|
|
|
+ });
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ } catch (error) {
|
|
|
|
|
+ console.error('加载售后详情失败:', error);
|
|
|
|
|
+ ElMessage.error('加载售后详情失败');
|
|
|
|
|
+ } finally {
|
|
|
|
|
+ loading.value = false;
|
|
|
|
|
+ }
|
|
|
|
|
+};
|
|
|
|
|
+
|
|
|
|
|
+// 加载订单详情(申请模式)
|
|
|
const loadOrderDetail = async () => {
|
|
const loadOrderDetail = async () => {
|
|
|
try {
|
|
try {
|
|
|
loading.value = true;
|
|
loading.value = true;
|
|
@@ -558,14 +613,23 @@ const handleReturnReasonChange = (value: string) => {
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
onMounted(() => {
|
|
onMounted(() => {
|
|
|
- const paramId = route.query.orderId;
|
|
|
|
|
-
|
|
|
|
|
- // 直接使用字符串,不转换为数字,避免精度丢失
|
|
|
|
|
- orderId.value = paramId as string;
|
|
|
|
|
- if (orderId.value) {
|
|
|
|
|
|
|
+ const paramOrderId = route.query.orderId;
|
|
|
|
|
+ const paramReturnId = route.query.returnId;
|
|
|
|
|
+ const paramViewMode = route.query.viewMode;
|
|
|
|
|
+
|
|
|
|
|
+ // 判断是否为查看详情模式
|
|
|
|
|
+ viewMode.value = paramViewMode === 'true';
|
|
|
|
|
+
|
|
|
|
|
+ if (viewMode.value && paramReturnId) {
|
|
|
|
|
+ // 查看详情模式:加载售后详情
|
|
|
|
|
+ returnId.value = paramReturnId as string;
|
|
|
|
|
+ loadReturnDetail();
|
|
|
|
|
+ } else if (paramOrderId) {
|
|
|
|
|
+ // 申请模式:加载订单详情
|
|
|
|
|
+ orderId.value = paramOrderId as string;
|
|
|
loadOrderDetail();
|
|
loadOrderDetail();
|
|
|
} else {
|
|
} else {
|
|
|
- console.error('订单ID无效,无法加载订单详情');
|
|
|
|
|
|
|
+ console.error('订单ID或售后ID无效,无法加载详情');
|
|
|
}
|
|
}
|
|
|
loadReturnReason();
|
|
loadReturnReason();
|
|
|
loadEnterpriseInfo();
|
|
loadEnterpriseInfo();
|