✨ feat(mes): 优化生产工单选择对话框的搜索功能和布局

src/views/mes/pro/workorder/components/ProWorkOrderSelectDialog.vue

@@ -10,14 +10,16 @@
 -->
 <template>
   <Dialog title="生产工单选择" v-model="dialogVisible" width="80%">
-    <!-- 搜索表单 -->
+    <!-- 搜索 -->
-    <el-form :inline="true" :model="queryParams" class="mb-10px" label-width="80px">
+    <ContentWrap>
+      <el-form :inline="true" :model="queryParams" label-width="80px">
         <el-form-item label="工单编码">
           <el-input
             v-model="queryParams.code"
             placeholder="请输入工单编码"
             clearable
             @keyup.enter="handleQuery"
+            class="!w-240px"
           />
         </el-form-item>
         <el-form-item label="工单名称">
@@ -26,32 +28,29 @@
             placeholder="请输入工单名称"
             clearable
             @keyup.enter="handleQuery"
+            class="!w-240px"
           />
         </el-form-item>
-      <!-- DONE @AI：筛选增加：产品、客户的 select； -->
         <el-form-item label="产品">
-        <MdItemSelect v-model="queryParams.productId" placeholder="请选择产品" class="!w-200px" />
+          <MdItemSelect v-model="queryParams.productId" placeholder="请选择产品" class="!w-240px" />
         </el-form-item>
         <el-form-item label="客户">
-        <MdClientSelect v-model="queryParams.clientId" placeholder="请选择客户" class="!w-200px" />
+          <MdClientSelect v-model="queryParams.clientId" placeholder="请选择客户" class="!w-240px" />
         </el-form-item>
         <el-form-item>
-        <el-button type="primary" @click="handleQuery">
+          <el-button @click="handleQuery"><Icon icon="ep:search" />搜索</el-button>
-          <Icon icon="ep:search" class="mr-5px" /> 搜索
+          <el-button @click="resetQuery"><Icon icon="ep:refresh" />重置</el-button>
-        </el-button>
-        <el-button @click="resetQuery">
-          <Icon icon="ep:refresh" class="mr-5px" /> 重置
-        </el-button>
         </el-form-item>
       </el-form>
-    <!-- 数据表格：单选 radio / 多选 checkbox 统一在一个 table 内 -->
+    </ContentWrap>
+    <!-- 列表 -->
+    <ContentWrap>
       <el-table
         ref="tableRef"
         v-loading="loading"
         :data="list"
         :stripe="true"
         :show-overflow-tooltip="true"
-      border
         row-key="id"
         :highlight-current-row="!multiple"
         @selection-change="handleSelectionChange"
@@ -77,7 +76,6 @@
             />
           </template>
         </el-table-column>
-      <!-- DONE @AI：字段对齐：/Users/yunai/Java/ktg-mes-delete-new/ktg-mes-ui/src/components/workorderSelect/single.vue -->
         <el-table-column label="工单编码" align="center" prop="code" width="180" />
         <el-table-column label="工单名称" align="center" prop="name" min-width="200" />
         <el-table-column label="工单来源" align="center" prop="orderSourceType" width="100">
@@ -101,14 +99,13 @@
           width="120"
         />
       </el-table>
-    <div class="overflow-hidden">
       <Pagination
         :total="total"
         v-model:page="queryParams.pageNo"
         v-model:limit="queryParams.pageSize"
         @pagination="getList"
       />
-    </div>
+    </ContentWrap>
     <template #footer>
       <el-button type="primary" @click="confirmSelect">确 定</el-button>
       <el-button @click="dialogVisible = false">取 消</el-button>