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

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

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

@@ -9,14 +9,16 @@
         </div>
       </header>
       <el-table :data="mappingRows" border size="small" class="mapping-table">
-        <el-table-column label="产品ID">
+        <el-table-column label="产品">
           <template slot-scope="scope">
-            <el-input v-model="scope.row.productId" placeholder="产品ID" />
+            <!-- <el-input v-model="scope.row.productId" placeholder="产品ID" /> -->
+            <ProductSelect v-model="scope.row.productId" placeholder="选择产品" />
           </template>
         </el-table-column>
-        <el-table-column label="原料ID">
+        <el-table-column label="原料">
           <template slot-scope="scope">
-            <el-input v-model="scope.row.rawMaterialId" placeholder="原料ID" />
+            <!-- <el-input v-model="scope.row.rawMaterialId" placeholder="原料ID" /> -->
+            <RawMaterialSelect v-model="scope.row.rawMaterialId" placeholder="选择原料" />
           </template>
         </el-table-column>
         <el-table-column label="转换率">
@@ -82,9 +84,15 @@
 
 <script>
 import { analyzePurchaseRequirement } from '@/api/erp/purchase'
+import RawMaterialSelect from '@/components/KLPService/RawMaterialSelect'
+import ProductSelect from '@/components/KLPService/ProductSelect'
 
 export default {
   name: 'ErpPurchaseRequirement',
+  components: {
+    RawMaterialSelect,
+    ProductSelect
+  },
   data() {
     return {
       mappingRows: [{ productId: '', rawMaterialId: '', conversionRate: 1 }],