✨ feat: 退款管理

gear-ui3/src/views/oms/order/panels/orderPage.vue

@@ -5,17 +5,14 @@
       <!-- 左侧：使用klp-list组件（占6列） -->
       <el-col :span="6" style="display: table-cell;">
         <!-- 搜索表单 - 精简搜索项 -->
-        <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px"
-          class="mb-4">
-          <el-row :gutter="10">
-            <el-col :span="16">
-              <el-input v-model="queryParams.orderCode" placeholder="请输入订单编号" clearable @change="handleQuery" />
-            </el-col>
-            <el-col :span="8">
-              <el-button type="primary" plain icon="Plus" size="small" @click="handleAdd" class="w-full">新增订单</el-button>
-            </el-col>
-          </el-row>
-        </el-form>
+        <el-row :gutter="10">
+          <el-col :span="16">
+            <el-input v-model="queryParams.orderCode" placeholder="请输入订单编号" clearable @change="handleQuery" />
+          </el-col>
+          <el-col :span="8">
+            <el-button type="primary" plain icon="Plus" size="small" @click="handleAdd" class="w-full">新增订单</el-button>
+          </el-col>
+        </el-row>
 
         <!-- klp-list组件 -->
         <klp-list :list-data="orderList" :model-value="selectedIds" title-field="orderCode" list-key="orderId"
@@ -105,7 +102,7 @@
               </el-tab-pane>
 
               <el-tab-pane label="退换货" name="returnExchange">
-                <div class="mt-4"> 
+                <div class="mt-4">
                   <ReturnExchange :orderId="selectedOrderId" />
                 </div>
               </el-tab-pane>

gear-ui3/src/views/oms/order/panels/return.vue

@@ -67,8 +67,12 @@
     <!-- 添加或修改退换货管理对话框 -->
     <el-dialog :title="title" v-model="open" width="500px" append-to-body>
       <el-form ref="returnExchangeRef" :model="form" :rules="rules" label-width="80px">
-        <el-form-item label="关联订单明细ID" prop="orderDetailId">
-          <el-input v-model="form.orderDetailId" placeholder="请输入关联订单明细ID" />
+        <el-form-item label="订单明细" prop="orderDetailId">
+          <el-select v-model="form.orderDetailId" placeholder="请选择订单明细">
+            <el-option v-for="item in orderDetailList" :key="item.detailId" :value="item.detailId">
+              <ProductInfo :productId="item.productId" />
+            </el-option>
+          </el-select>
         </el-form-item>
         <el-form-item label="客户ID" prop="customerId">
           <CustomerSelect v-model="form.customerId" />
@@ -95,7 +99,9 @@
 
 <script setup name="ReturnExchange">
 import { listReturnExchange, getReturnExchange, delReturnExchange, addReturnExchange, updateReturnExchange } from "@/api/oa/returnExchange";
+import { listOrderDetail } from "@/api/oms/orderDetail";
 import CustomerSelect from '@/components/CustomerSelect/index.vue';
+import ProductInfo from '@/components/Renderer/ProductInfo.vue';
 
 const { proxy } = getCurrentInstance();
 
@@ -140,6 +146,11 @@ const data = reactive({
 
 const { queryParams, form, rules } = toRefs(data);
 
+watch(() => props.orderId, () => {
+  getOrderDetailList();
+  getList();
+}, { immediate: true });
+
 /** 查询退换货管理列表 */
 function getList() {
   loading.value = true;
@@ -150,6 +161,15 @@ function getList() {
   });
 }
 
+const orderDetailList = ref([]);
+function getOrderDetailList() {
+  listOrderDetail({
+    orderId: props.orderId,
+  }).then(response => {
+    orderDetailList.value = response.rows;
+  });
+}
+
 // 取消按钮
 function cancel() {
   open.value = false;