feat(采购模块): 实现订单选择组件并优化UI交互

refactor(采购管理): 替换输入框为选择组件提升用户体验
style(表格样式): 调整表格边框和间距优化视觉效果

klp-ui/src/views/erp/receipt/index.vue

@@ -6,8 +6,10 @@
         <el-button type="primary" size="small" @click="openDialog()">新增收货</el-button>
       </header>
       <div class="inline-filter">
-        <el-input v-model="query.orderId" placeholder="订单ID" size="small" clearable />
-        <el-input v-model="query.itemId" placeholder="订单明细ID" size="small" clearable />
+        <!-- <el-input v-model="query.orderId" placeholder="订单ID" size="small" clearable /> -->
+        <OrderSelect v-model="query.orderId" placeholder="订单号" size="small" />
+        <!-- <el-input v-model="query.itemId" placeholder="订单明细ID" size="small" clearable /> -->
+        <OrderDetailSelect :orderId="query.orderId" v-model="query.itemId"></OrderDetailSelect>
         <el-select v-model="query.quality" placeholder="质检结果" size="small" clearable>
           <el-option label="合格" value="OK" />
           <el-option label="不合格" value="NG" />
@@ -62,10 +64,12 @@
     <el-dialog :title="dialog.title" :visible.sync="dialog.visible" width="480px">
       <el-form :model="dialog.form" :rules="rules" ref="form" label-width="100px" size="small">
         <el-form-item label="订单ID" prop="orderId">
-          <el-input v-model="dialog.form.orderId" />
+          <!-- <el-input v-model="dialog.form.orderId" /> -->
+          <OrderSelect v-model="dialog.form.orderId" placeholder="订单号" size="small" />
         </el-form-item>
         <el-form-item label="明细ID" prop="itemId">
-          <el-input v-model="dialog.form.itemId" />
+          <!-- <el-input v-model="dialog.form.itemId" /> -->
+          <OrderDetailSelect :orderId="dialog.form.orderId" v-model="dialog.form.itemId"></OrderDetailSelect>
         </el-form-item>
         <el-form-item label="收货数量" prop="receivedQty">
           <el-input-number v-model="dialog.form.receivedQty" :min="0" :precision="3" />
@@ -98,9 +102,15 @@ import {
   updatePurchaseReceipt,
   delPurchaseReceipt
 } from '@/api/erp/purchase'
+import OrderSelect from '@/components/KLPService/OrderSelect'
+import OrderDetailSelect from '@/components/KLPService/OrderDetailSelect'
 
 export default {
   name: 'ErpPurchaseReceipt',
+  components: {
+    OrderSelect,
+    OrderDetailSelect
+  },
   data() {
     return {
       query: { pageNum: 1, pageSize: 10, orderId: null, itemId: null },