feat: 优化合同选择组件与钢卷修正页面功能

1. 重构ContractSelect组件，新增all模式支持远程搜索
2. 修正钢卷修正弹窗布局为两列排版，扩大弹窗宽度
3. 为钢卷修正页面添加合同绑定功能，支持新增/更新合同关联关系

klp-ui/src/components/KLPService/ContractSelect/index.vue

@@ -1,7 +1,14 @@
 <template>
     <div>
         <div style="display: flex; align-items: center; margin-bottom: 0px;">
-            <el-select v-model="selectedValue" placeholder="请选择合同" style="width: 100%" clearable>
+            <!-- all模式：远程搜索 -->
+            <el-select v-if="mode == 'all'" v-model="selectedValue" placeholder="请选择合同" style="width: 100%" clearable
+              filterable remote :remote-method="handleRemoteSearch" :loading="selectLoading">
+                <el-option v-for="item in contractList" :key="item.orderId" :value="item.orderId"
+                  :label="item.contractCode" />
+            </el-select>
+            <!-- today模式：本地 -->
+            <el-select v-else v-model="selectedValue" placeholder="请选择合同" style="width: 100%" clearable filterable>
                 <el-option v-for="item in contractList" :key="item.orderId" :value="item.orderId"
                   :label="item.contractCode" />
             </el-select>
@@ -133,6 +140,8 @@ export default {
             allPageNum: 1,
             allPageSize: 20,
             allTotal: 0,
+            selectLoading: false,
+            selectTimer: null,
         }
     },
     computed: {
@@ -152,7 +161,7 @@ export default {
         if (this.mode == "today") {
             this.loadFromLocalStorage();
         } else {
-            this.loadContractList();
+            this.handleRemoteSearch('');
         }
     },
     methods: {
@@ -182,36 +191,26 @@ export default {
             }
         },
 
-        // 加载合同列表
-        async loadContractList(keyword) {
-            if (this.mode == "all") {
-                const res = await listOrder({
-                    pageNum: 1,
-                    pageSize: 1000,
-                    keyword: keyword || undefined,
-                });
-                this.contractList = res.rows || [];
-            }
-            else if (this.mode == "today") {
-                const res = await listTodayOrder();
-                // 获取现有手动添加的合同
-                const existingManualContracts = this.contractList.filter(item => item.isManual);
-                // 将接口返回的合同标记为非手动添加
-                const apiContracts = (res.data || []).map(item => ({
-                    ...item,
-                    isManual: false
-                }));
-                // 合并合同列表，保留手动添加的合同
-                this.contractList = [...apiContracts, ...existingManualContracts];
-                // 去重，避免重复合同
-                this.contractList = this.contractList.filter((item, index, self) =>
-                    index === self.findIndex(t => t.orderId === item.orderId)
-                );
-                // 上一次选择的合同放在列表第一位
-                this.sortLastSelectedToFirst();
-                // 保存到localStorage
-                this.saveToLocalStorage();
-            }
+        // 加载合同列表（today模式）
+        async loadContractList() {
+            const res = await listTodayOrder();
+            // 获取现有手动添加的合同
+            const existingManualContracts = this.contractList.filter(item => item.isManual);
+            // 将接口返回的合同标记为非手动添加
+            const apiContracts = (res.data || []).map(item => ({
+                ...item,
+                isManual: false
+            }));
+            // 合并合同列表，保留手动添加的合同
+            this.contractList = [...apiContracts, ...existingManualContracts];
+            // 去重，避免重复合同
+            this.contractList = this.contractList.filter((item, index, self) =>
+                index === self.findIndex(t => t.orderId === item.orderId)
+            );
+            // 上一次选择的合同放在列表第一位
+            this.sortLastSelectedToFirst();
+            // 保存到localStorage
+            this.saveToLocalStorage();
         },
 
         // 将上一次选择的合同排到列表第一位
@@ -282,7 +281,54 @@ export default {
 
         // 刷新合同列表
         handleRefresh() {
-            this.loadContractList();
+            if (this.mode == 'all') {
+                this.handleRemoteSearch('');
+            } else {
+                this.loadContractList();
+            }
+        },
+
+        // all模式远程搜索
+        handleRemoteSearch(query) {
+            if (this.selectTimer) {
+                clearTimeout(this.selectTimer);
+            }
+            if (!query) {
+                this.selectTimer = null;
+                this.doRemoteSearch('');
+                return;
+            }
+            this.selectLoading = true;
+            this.selectTimer = setTimeout(() => {
+                this.doRemoteSearch(query);
+            }, 300);
+        },
+
+        async doRemoteSearch(query) {
+            try {
+                const res = await listOrder({
+                    pageNum: 1,
+                    pageSize: 100,
+                    keyword: query || undefined,
+                });
+                this.contractList = res.rows || [];
+                // 初始加载时，确保已选中的合同在列表中
+                if (!query && this.value && !this.contractList.some(item => String(item.orderId) === String(this.value))) {
+                    const res2 = await listOrder({
+                        pageNum: 1,
+                        pageSize: 100,
+                        keyword: this.value,
+                    });
+                    const found = (res2.rows || []).find(item => String(item.orderId) === String(this.value));
+                    if (found) {
+                        this.contractList.unshift(found);
+                    }
+                }
+            } catch (error) {
+                console.error('Failed to search contracts:', error);
+            } finally {
+                this.selectLoading = false;
+            }
         },
     }
 }