fix(mes): 修复生产工单前端 TODO，搜索增强、条件显隐、BOM 拆分

- index.vue：新增产品/客户搜索，补充父工单/来源单据/客户编码列，"来源类型"改"工单来源"
- WorkOrderForm.vue：工单编码生成按钮，来源单据编号/供应商条件显隐，"生产数量"改"工单数量"
- WorkOrderBom 拆分为 WorkOrderBomList + WorkOrderBomForm
- constants.ts 新增 MesProWorkOrderTypeEnum、MesProWorkOrderSourceTypeEnum

src/api/mes/pro/workorder/index.ts

@@ -19,12 +19,14 @@ export interface ProWorkOrderVO {
   quantityChanged: number // 调整数量
   quantityScheduled: number // 已排产数量
   clientId: number // 客户编号
+  clientCode: string // 客户编码
   clientName: string // 客户名称
   vendorId: number // 供应商编号
   vendorName: string // 供应商名称
   batchCode: string // 批次号
   requestDate: Date // 需求日期
   parentId: number // 父工单编号
+  parentCode: string // 父工单编码
   finishDate: Date // 完成时间
   cancelDate: Date // 取消时间
   status: number // 工单状态

src/views/mes/pro/workorder/WorkOrderBomForm.vue

@@ -0,0 +1,119 @@
+<!-- MES 生产工单 BOM 表单弹窗 -->
+<!-- TODO @AI：参考别的模块，应该融合到 List 里； -->
+<template>
+  <Dialog :title="dialogTitle" v-model="dialogVisible" width="600px">
+    <el-form
+      ref="formRef"
+      :model="formData"
+      :rules="formRules"
+      label-width="100px"
+      v-loading="formLoading"
+    >
+      <el-form-item label="物料" prop="itemId">
+        <MdItemSelect v-model="formData.itemId" @change="handleItemChange" />
+      </el-form-item>
+      <el-form-item label="单位" prop="unitMeasureId">
+        <MdUnitMeasureSelect v-model="formData.unitMeasureId" />
+      </el-form-item>
+      <el-form-item label="预计使用量" prop="quantity">
+        <el-input-number
+          v-model="formData.quantity"
+          :min="0"
+          :precision="2"
+          class="!w-1/1"
+        />
+      </el-form-item>
+      <el-form-item label="备注" prop="remark">
+        <el-input type="textarea" v-model="formData.remark" placeholder="请输入备注" />
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
+      <el-button @click="dialogVisible = false">取 消</el-button>
+    </template>
+  </Dialog>
+</template>
+
+<script setup lang="ts">
+import { ProWorkOrderBomApi, ProWorkOrderBomVO } from '@/api/mes/pro/workorder/bom'
+import { MdItemVO } from '@/api/mes/md/item'
+import MdItemSelect from '@/views/mes/md/item/components/MdItemSelect.vue'
+import MdUnitMeasureSelect from '@/views/mes/md/unitmeasure/components/MdUnitMeasureSelect.vue'
+
+defineOptions({ name: 'WorkOrderBomForm' })
+
+const props = defineProps<{
+  workOrderId: number
+}>()
+
+const { t } = useI18n()
+const message = useMessage()
+
+const dialogVisible = ref(false)
+const dialogTitle = ref('')
+const formLoading = ref(false)
+const formType = ref('')
+const formData = ref({
+  id: undefined,
+  workOrderId: undefined as number | undefined,
+  itemId: undefined,
+  unitMeasureId: undefined,
+  quantity: undefined,
+  remark: undefined
+})
+const formRules = reactive({
+  itemId: [{ required: true, message: '物料不能为空', trigger: 'change' }],
+  unitMeasureId: [{ required: true, message: '单位不能为空', trigger: 'change' }],
+  quantity: [{ required: true, message: '预计使用量不能为空', trigger: 'blur' }]
+})
+const formRef = ref()
+
+/** 打开弹窗 */
+const open = async (type: string, row?: any) => {
+  dialogVisible.value = true
+  dialogTitle.value = type === 'create' ? '添加物料' : '编辑物料'
+  formType.value = type
+  // 重置表单
+  formData.value = {
+    id: undefined,
+    workOrderId: props.workOrderId,
+    itemId: undefined,
+    unitMeasureId: undefined,
+    quantity: undefined,
+    remark: undefined
+  }
+  // 编辑时设置数据
+  if (row) {
+    formData.value = { ...row }
+  }
+}
+defineExpose({ open })
+
+/** 物料变更：自动填充单位 */
+const handleItemChange = (item: MdItemVO | undefined) => {
+  if (item?.unitMeasureId) {
+    formData.value.unitMeasureId = item.unitMeasureId
+  }
+}
+
+/** 提交表单 */
+const emit = defineEmits(['success'])
+const submitForm = async () => {
+  await formRef.value.validate()
+  formLoading.value = true
+  try {
+    const data = formData.value as unknown as ProWorkOrderBomVO
+    if (formType.value === 'create') {
+      await ProWorkOrderBomApi.createWorkOrderBom(data)
+      message.success(t('common.createSuccess'))
+    } else {
+      await ProWorkOrderBomApi.updateWorkOrderBom(data)
+      message.success(t('common.updateSuccess'))
+    }
+    dialogVisible.value = false
+    emit('success')
+  } finally {
+    formLoading.value = false
+  }
+}
+</script>

src/views/mes/pro/workorder/WorkOrderBomList.vue

@@ -0,0 +1,99 @@
+<!-- MES 生产工单 BOM 列表子组件 -->
+<!-- TODO @芋艿：这块暂时还没测试和 review； -->
+<template>
+  <div>
+    <!-- 操作栏 -->
+    <!-- TODO @AI：貌似没新增操作？在确认下 -->
+    <el-row class="mb-10px" v-if="!disabled">
+      <el-button type="primary" plain @click="openBomForm('create')">
+        <Icon icon="ep:plus" class="mr-5px" /> 添加物料
+      </el-button>
+    </el-row>
+    <!-- BOM 列表 -->
+    <el-table v-loading="loading" :data="bomList" :stripe="true" :show-overflow-tooltip="true">
+      <el-table-column label="BOM 物料编码" align="center" prop="itemCode" width="120" />
+      <el-table-column label="BOM 物料名称" align="center" prop="itemName" min-width="150" />
+      <el-table-column label="规格型号" align="center" prop="itemSpec" width="120" />
+      <el-table-column label="单位" align="center" prop="unitMeasureName" width="80" />
+      <el-table-column label="预计使用量" align="center" prop="quantity" width="120" />
+      <el-table-column label="备注" align="center" prop="remark" min-width="120" />
+      <el-table-column label="操作" align="center" width="130" v-if="!disabled">
+        <template #default="scope">
+          <el-button link type="primary" @click="openBomForm('update', scope.row)">编辑</el-button>
+          <el-button link type="danger" @click="handleDeleteBom(scope.row.id)">删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 分页 -->
+    <Pagination
+      :total="bomTotal"
+      v-model:page="bomQueryParams.pageNo"
+      v-model:limit="bomQueryParams.pageSize"
+      @pagination="getBomList"
+    />
+
+    <!-- BOM 表单弹窗 -->
+    <WorkOrderBomForm ref="bomFormRef" :work-order-id="workOrderId" @success="getBomList" />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ProWorkOrderBomApi, ProWorkOrderBomVO } from '@/api/mes/pro/workorder/bom'
+import WorkOrderBomForm from './WorkOrderBomForm.vue'
+
+defineOptions({ name: 'WorkOrderBomList' })
+
+const props = defineProps<{
+  workOrderId: number
+  disabled?: boolean
+}>()
+
+const message = useMessage()
+const { t } = useI18n()
+
+// ==================== BOM 列表 ====================
+const loading = ref(false)
+const bomList = ref<ProWorkOrderBomVO[]>([])
+const bomTotal = ref(0)
+const bomQueryParams = reactive({
+  pageNo: 1,
+  pageSize: 10,
+  workOrderId: undefined as number | undefined
+})
+
+/** 查询 BOM 列表 */
+const getBomList = async () => {
+  loading.value = true
+  try {
+    bomQueryParams.workOrderId = props.workOrderId
+    const data = await ProWorkOrderBomApi.getWorkOrderBomPage(bomQueryParams)
+    bomList.value = data.list
+    bomTotal.value = data.total
+  } finally {
+    loading.value = false
+  }
+}
+
+/** 删除 BOM */
+const handleDeleteBom = async (id: number) => {
+  try {
+    await message.delConfirm()
+    await ProWorkOrderBomApi.deleteWorkOrderBom(id)
+    message.success(t('common.delSuccess'))
+    await getBomList()
+  } catch {}
+}
+
+// ==================== BOM 表单 ====================
+const bomFormRef = ref()
+
+/** 打开 BOM 表单弹窗 */
+const openBomForm = (type: string, row?: any) => {
+  bomFormRef.value.open(type, row)
+}
+
+// ==================== 初始化 ====================
+onMounted(async () => {
+  await getBomList()
+})
+</script>

src/views/mes/pro/workorder/WorkorderBom.vue

@@ -1,192 +0,0 @@
-<!-- MES 生产工单 BOM 子组件 -->
-<template>
-  <div>
-    <!-- 操作栏 -->
-    <el-row class="mb-10px" v-if="!disabled">
-      <el-button type="primary" plain @click="openBomForm('create')">
-        <Icon icon="ep:plus" class="mr-5px" /> 添加物料
-      </el-button>
-    </el-row>
-    <!-- BOM 列表 -->
-    <el-table v-loading="loading" :data="bomList" :stripe="true" :show-overflow-tooltip="true">
-      <el-table-column label="BOM 物料编码" align="center" prop="itemCode" width="120" />
-      <el-table-column label="BOM 物料名称" align="center" prop="itemName" min-width="150" />
-      <el-table-column label="规格型号" align="center" prop="itemSpec" width="120" />
-      <el-table-column label="单位" align="center" prop="unitMeasureName" width="80" />
-      <!-- TODO @AI：物料/名称，增加该类； -->
-      <el-table-column label="预计使用量" align="center" prop="quantity" width="120" />
-      <el-table-column label="备注" align="center" prop="remark" min-width="120" />
-      <el-table-column label="操作" align="center" width="130" v-if="!disabled">
-        <template #default="scope">
-          <el-button link type="primary" @click="openBomForm('update', scope.row)">编辑</el-button>
-          <el-button link type="danger" @click="handleDeleteBom(scope.row.id)">删除</el-button>
-          <!-- TODO @AI：生成订单 -->
-        </template>
-      </el-table-column>
-    </el-table>
-    <!-- 分页 -->
-    <Pagination
-      :total="bomTotal"
-      v-model:page="bomQueryParams.pageNo"
-      v-model:limit="bomQueryParams.pageSize"
-      @pagination="getBomList"
-    />
-
-    <!-- BOM 表单弹窗 -->
-    <!-- TODO @AI：拆成 List 和 Form 两个 -->
-    <!-- TODO @芋艿：这块暂时还没测试和 review； -->
-    <Dialog :title="bomDialogTitle" v-model="bomDialogVisible" width="600px">
-      <el-form
-        ref="bomFormRef"
-        :model="bomFormData"
-        :rules="bomFormRules"
-        label-width="100px"
-        v-loading="bomFormLoading"
-      >
-        <el-form-item label="物料" prop="itemId">
-          <MdItemSelect v-model="bomFormData.itemId" @change="handleBomItemChange" />
-        </el-form-item>
-        <el-form-item label="单位" prop="unitMeasureId">
-          <MdUnitMeasureSelect v-model="bomFormData.unitMeasureId" />
-        </el-form-item>
-        <el-form-item label="预计使用量" prop="quantity">
-          <el-input-number
-            v-model="bomFormData.quantity"
-            :min="0"
-            :precision="2"
-            class="!w-1/1"
-          />
-        </el-form-item>
-        <el-form-item label="备注" prop="remark">
-          <el-input type="textarea" v-model="bomFormData.remark" placeholder="请输入备注" />
-        </el-form-item>
-      </el-form>
-      <template #footer>
-        <el-button @click="submitBomForm" type="primary" :disabled="bomFormLoading">确 定</el-button>
-        <el-button @click="bomDialogVisible = false">取 消</el-button>
-      </template>
-    </Dialog>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ProWorkOrderBomApi, ProWorkOrderBomVO } from '@/api/mes/pro/workorder/bom'
-import { MdItemVO } from '@/api/mes/md/item'
-import MdItemSelect from '@/views/mes/md/item/components/MdItemSelect.vue'
-import MdUnitMeasureSelect from '@/views/mes/md/unitmeasure/components/MdUnitMeasureSelect.vue'
-
-defineOptions({ name: 'WorkOrderBom' })
-
-const props = defineProps<{
-  workOrderId: number
-  disabled?: boolean
-}>()
-
-const message = useMessage()
-const { t } = useI18n()
-
-// ==================== BOM 列表 ====================
-const loading = ref(false)
-const bomList = ref<ProWorkOrderBomVO[]>([])
-const bomTotal = ref(0)
-const bomQueryParams = reactive({
-  pageNo: 1,
-  pageSize: 10,
-  workOrderId: undefined as number | undefined
-})
-
-/** 查询 BOM 列表 */
-const getBomList = async () => {
-  loading.value = true
-  try {
-    bomQueryParams.workOrderId = props.workOrderId
-    const data = await ProWorkOrderBomApi.getWorkOrderBomPage(bomQueryParams)
-    bomList.value = data.list
-    bomTotal.value = data.total
-  } finally {
-    loading.value = false
-  }
-}
-
-/** 删除 BOM */
-const handleDeleteBom = async (id: number) => {
-  try {
-    await message.delConfirm()
-    await ProWorkOrderBomApi.deleteWorkOrderBom(id)
-    message.success(t('common.delSuccess'))
-    await getBomList()
-  } catch {}
-}
-
-// ==================== BOM 表单 ====================
-const bomDialogVisible = ref(false)
-const bomDialogTitle = ref('')
-const bomFormLoading = ref(false)
-const bomFormType = ref('')
-const bomFormData = ref({
-  id: undefined,
-  workOrderId: undefined as number | undefined,
-  itemId: undefined,
-  unitMeasureId: undefined,
-  quantity: undefined,
-  remark: undefined
-})
-const bomFormRules = reactive({
-  itemId: [{ required: true, message: '物料不能为空', trigger: 'change' }],
-  unitMeasureId: [{ required: true, message: '单位不能为空', trigger: 'change' }],
-  quantity: [{ required: true, message: '预计使用量不能为空', trigger: 'blur' }]
-})
-const bomFormRef = ref()
-
-/** 打开 BOM 表单弹窗 */
-const openBomForm = async (type: string, row?: any) => {
-  bomDialogVisible.value = true
-  bomDialogTitle.value = type === 'create' ? '添加物料' : '编辑物料'
-  bomFormType.value = type
-  // 重置表单
-  bomFormData.value = {
-    id: undefined,
-    workOrderId: props.workOrderId,
-    itemId: undefined,
-    unitMeasureId: undefined,
-    quantity: undefined,
-    remark: undefined
-  }
-  // 编辑时设置数据
-  if (row) {
-    bomFormData.value = { ...row }
-  }
-}
-
-/** 物料变更：自动填充单位 */
-const handleBomItemChange = (item: MdItemVO | undefined) => {
-  if (item?.unitMeasureId) {
-    bomFormData.value.unitMeasureId = item.unitMeasureId
-  }
-}
-
-/** 提交 BOM 表单 */
-const submitBomForm = async () => {
-  await bomFormRef.value.validate()
-  bomFormLoading.value = true
-  try {
-    const data = bomFormData.value as unknown as ProWorkOrderBomVO
-    if (bomFormType.value === 'create') {
-      await ProWorkOrderBomApi.createWorkOrderBom(data)
-      message.success(t('common.createSuccess'))
-    } else {
-      await ProWorkOrderBomApi.updateWorkOrderBom(data)
-      message.success(t('common.updateSuccess'))
-    }
-    bomDialogVisible.value = false
-    await getBomList()
-  } finally {
-    bomFormLoading.value = false
-  }
-}
-
-// ==================== 初始化 ====================
-onMounted(async () => {
-  await getBomList()
-})
-</script>

src/views/mes/pro/workorder/WorkorderForm.vue

@@ -10,9 +10,14 @@
     >
       <el-row>
         <el-col :span="12">
-          <!-- TODO @AI：生成 -->
           <el-form-item label="工单编码" prop="code">
-            <el-input v-model="formData.code" placeholder="请输入工单编码" :disabled="isDetail" />
+            <el-input v-model="formData.code" placeholder="请输入工单编码" :disabled="isDetail">
+              <template #append>
+                <el-button @click="generateCode" :disabled="formType === 'update' || isDetail">
+                  生成
+                </el-button>
+              </template>
+            </el-input>
           </el-form-item>
         </el-col>
         <el-col :span="12">
@@ -23,10 +28,10 @@
       </el-row>
       <el-row>
         <el-col :span="8">
-          <el-form-item label="来源类型" prop="orderSourceType">
+          <el-form-item label="工单来源" prop="orderSourceType">
             <el-select
               v-model="formData.orderSourceType"
-              placeholder="请选择来源类型"
+              placeholder="请选择工单来源"
               class="!w-1/1"
               :disabled="isDetail"
             >
@@ -39,8 +44,7 @@
             </el-select>
           </el-form-item>
         </el-col>
-        <!-- TODO @AI：应该只有【客户订单】时，才展示这个表单项。 -->
+        <el-col :span="8" v-if="formData.orderSourceType === MesProWorkOrderSourceTypeEnum.ORDER">
-        <el-col :span="8">
           <el-form-item label="来源单据编号" prop="orderSourceCode">
             <el-input
               v-model="formData.orderSourceCode"
@@ -78,8 +82,7 @@
           </el-form-item>
         </el-col>
         <el-col :span="8">
-          <!-- TODO @ai：工单数量； -->
+          <el-form-item label="工单数量" prop="quantity">
-          <el-form-item label="生产数量" prop="quantity">
             <el-input-number
               v-model="formData.quantity"
               :min="0"
@@ -96,14 +99,18 @@
             <MdClientSelect v-model="formData.clientId" :disabled="isDetail" />
           </el-form-item>
         </el-col>
-        <el-col :span="8">
+        <el-col
-          <!-- TODO @AI：只有外协、外购，才有供应商 -->
+          :span="8"
+          v-if="
+            formData.type === MesProWorkOrderTypeEnum.OUTSOURCE ||
+            formData.type === MesProWorkOrderTypeEnum.PURCHASE
+          "
+        >
           <el-form-item label="供应商" prop="vendorId">
             <MdVendorSelect v-model="formData.vendorId" :disabled="isDetail" />
           </el-form-item>
         </el-col>
         <el-col :span="8">
-          <!-- TODO @AI：这个字段，是必须的么？在调研确认下； -->
           <el-form-item label="批次号" prop="batchCode">
             <el-input
               v-model="formData.batchCode"
@@ -148,9 +155,9 @@
     <!-- BOM Tab：编辑/详情时显示 -->
     <el-tabs v-if="formType !== 'create'" v-model="activeTab" class="mt-15px">
       <el-tab-pane label="工单 BOM" name="bom">
-        <WorkOrderBom v-if="formData.id" :work-order-id="formData.id" :disabled="isDetail" />
+        <WorkOrderBomList v-if="formData.id" :work-order-id="formData.id" :disabled="isDetail" />
       </el-tab-pane>
-      <!-- TODO @AI：物料需求，是不是缺的？ -->
+      <!-- TODO @AI：物料需求缺少； -->
     </el-tabs>
     <template #footer v-if="!isDetail">
       <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
@@ -163,10 +170,15 @@
 import { getIntDictOptions, DICT_TYPE } from '@/utils/dict'
 import { ProWorkOrderApi, ProWorkOrderVO } from '@/api/mes/pro/workorder'
 import { MdItemVO } from '@/api/mes/md/item'
+import { generateRandomStr } from '@/utils'
 import MdItemSelect from '@/views/mes/md/item/components/MdItemSelect.vue'
 import MdClientSelect from '@/views/mes/md/client/components/MdClientSelect.vue'
 import MdVendorSelect from '@/views/mes/md/vendor/components/MdVendorSelect.vue'
-import WorkOrderBom from './WorkOrderBom.vue'
+import WorkOrderBomList from './WorkOrderBomList.vue'
+import {
+  MesProWorkOrderSourceTypeEnum,
+  MesProWorkOrderTypeEnum
+} from '@/views/mes/utils/constants'
 
 defineOptions({ name: 'WorkOrderForm' })
 
@@ -199,9 +211,9 @@ const formRules = reactive({
   code: [{ required: true, message: '工单编码不能为空', trigger: 'blur' }],
   name: [{ required: true, message: '工单名称不能为空', trigger: 'blur' }],
   type: [{ required: true, message: '工单类型不能为空', trigger: 'change' }],
-  orderSourceType: [{ required: true, message: '来源类型不能为空', trigger: 'change' }],
+  orderSourceType: [{ required: true, message: '工单来源不能为空', trigger: 'change' }],
   productId: [{ required: true, message: '产品不能为空', trigger: 'change' }],
-  quantity: [{ required: true, message: '生产数量不能为空', trigger: 'blur' }],
+  quantity: [{ required: true, message: '工单数量不能为空', trigger: 'blur' }],
   requestDate: [{ required: true, message: '需求日期不能为空', trigger: 'change' }]
 })
 const formRef = ref() // 表单 Ref
@@ -209,6 +221,11 @@ const formRef = ref() // 表单 Ref
 /** 是否为详情模式 */
 const isDetail = computed(() => formType.value === 'detail')
 
+/** 生成工单编码 */
+const generateCode = () => {
+  formData.value.code = 'MO' + generateRandomStr(10)
+}
+
 /** 打开弹窗 */
 const open = async (type: string, id?: number) => {
   dialogVisible.value = true
@@ -235,6 +252,26 @@ const handleProductChange = (product: MdItemVO) => {
   }
 }
 
+/** 工单来源变更：非客户订单时清空来源单据编号 */
+watch(
+  () => formData.value.orderSourceType,
+  (val) => {
+    if (val !== MesProWorkOrderSourceTypeEnum.ORDER) {
+      formData.value.orderSourceCode = undefined
+    }
+  }
+)
+
+/** 工单类型变更：非代工/采购时清空供应商 */
+watch(
+  () => formData.value.type,
+  (val) => {
+    if (val !== MesProWorkOrderTypeEnum.OUTSOURCE && val !== MesProWorkOrderTypeEnum.PURCHASE) {
+      formData.value.vendorId = undefined
+    }
+  }
+)
+
 /** 提交表单 */
 const emit = defineEmits(['success'])
 const submitForm = async () => {

src/views/mes/pro/workorder/index.vue

@@ -2,8 +2,6 @@
 <template>
   <ContentWrap>
     <!-- 搜索工作栏 -->
-    <!-- TODO @AI：产品编号、产品名称 -->
-    <!-- TODO @AI：客户编号、客户名称 -->
     <el-form
       class="-mb-15px"
       :model="queryParams"
@@ -29,6 +27,12 @@
           class="!w-240px"
         />
       </el-form-item>
+      <el-form-item label="产品" prop="productId">
+        <MdItemSelect v-model="queryParams.productId" placeholder="请选择产品" class="!w-240px" />
+      </el-form-item>
+      <el-form-item label="客户" prop="clientId">
+        <MdClientSelect v-model="queryParams.clientId" placeholder="请选择客户" class="!w-240px" />
+      </el-form-item>
       <el-form-item label="工单类型" prop="type">
         <el-select
           v-model="queryParams.type"
@@ -44,11 +48,10 @@
           />
         </el-select>
       </el-form-item>
-      <!-- TODO @AI：来源类型 改成 工单来源 -->
+      <el-form-item label="工单来源" prop="orderSourceType">
-      <el-form-item label="来源类型" prop="orderSourceType">
         <el-select
           v-model="queryParams.orderSourceType"
-          placeholder="请选择来源类型"
+          placeholder="请选择工单来源"
           clearable
           class="!w-240px"
         >
@@ -115,13 +118,21 @@
     <!-- TODO @AI：生产工单，是父子结构； -->
     <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
       <el-table-column label="工单编码" align="center" prop="code" width="140" />
+      <el-table-column label="父工单" align="center" prop="parentCode" width="140">
+        <template #default="scope">
+          <span v-if="scope.row.parentId && scope.row.parentId !== 0">
+            {{ scope.row.parentCode }}
+          </span>
+          <span v-else>-</span>
+        </template>
+      </el-table-column>
       <el-table-column label="工单名称" align="center" prop="name" min-width="150" />
       <el-table-column label="工单类型" align="center" prop="type" width="100">
         <template #default="scope">
           <dict-tag :type="DICT_TYPE.MES_PRO_WORK_ORDER_TYPE" :value="scope.row.type" />
         </template>
       </el-table-column>
-      <el-table-column label="来源类型" align="center" prop="orderSourceType" width="100">
+      <el-table-column label="工单来源" align="center" prop="orderSourceType" width="100">
         <template #default="scope">
           <dict-tag
             :type="DICT_TYPE.MES_PRO_WORK_ORDER_SOURCE_TYPE"
@@ -129,16 +140,16 @@
           />
         </template>
       </el-table-column>
-      <!-- TODO @AI：订单编号 -->
+      <el-table-column label="来源单据编号" align="center" prop="orderSourceCode" width="140" />
       <el-table-column label="产品编码" align="center" prop="productCode" width="120" />
       <el-table-column label="产品名称" align="center" prop="productName" min-width="120" />
       <el-table-column label="规格型号" align="center" prop="productSpec" width="120" />
       <el-table-column label="单位" align="center" prop="unitMeasureName" width="80" />
       <el-table-column label="工单数量" align="center" prop="quantity" width="100" />
-      <el-table-column label="已生产数量" align="center" prop="quantityProduced" width="80" />
+      <el-table-column label="已生产数量" align="center" prop="quantityProduced" width="100" />
-      <!-- TODO @AI：客户编码 -->
+      <!-- TODO @AI：客户编码未展示，是不是后端没查询？！ -->
-      <!-- TODO @AI：客户名称 -->
+      <el-table-column label="客户编码" align="center" prop="clientCode" width="120" />
-      <el-table-column label="客户" align="center" prop="clientName" width="120" />
+      <el-table-column label="客户名称" align="center" prop="clientName" width="120" />
       <el-table-column
         label="需求日期"
         align="center"
@@ -146,7 +157,6 @@
         :formatter="dateFormatter"
         width="180"
       />
-      <!-- TODO @AI：单据状态 -->
       <el-table-column label="工单状态" align="center" prop="status" width="100">
         <template #default="scope">
           <dict-tag :type="DICT_TYPE.MES_PRO_WORK_ORDER_STATUS" :value="scope.row.status" />
@@ -161,7 +171,7 @@
       />
       <el-table-column label="操作" align="center" width="200" fixed="right">
         <template #default="scope">
-          <!-- TODO @AI：新增、完成、取消、预览 -->
+          <!-- TODO @AI：新增操作；对齐下； -->
           <!-- 草稿状态：编辑、删除 -->
           <template v-if="scope.row.status === MesProWorkOrderStatusEnum.PREPARE">
             <el-button
@@ -232,6 +242,8 @@ import { ProWorkOrderApi, ProWorkOrderVO } from '@/api/mes/pro/workorder'
 import WorkOrderForm from './WorkOrderForm.vue'
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import { MesProWorkOrderStatusEnum } from '@/views/mes/utils/constants'
+import MdItemSelect from '@/views/mes/md/item/components/MdItemSelect.vue'
+import MdClientSelect from '@/views/mes/md/client/components/MdClientSelect.vue'
 
 defineOptions({ name: 'MesProWorkOrder' })
 
@@ -246,6 +258,8 @@ const queryParams = reactive({
   pageSize: 10,
   code: undefined,
   name: undefined,
+  productId: undefined,
+  clientId: undefined,
   type: undefined,
   orderSourceType: undefined,
   status: undefined,

src/views/mes/utils/constants.ts

@@ -66,6 +66,19 @@ export const MesProWorkOrderStatusEnum = {
   CANCELED: 3 // 已取消
 }
 
+/** MES 工单类型枚举 */
+export const MesProWorkOrderTypeEnum = {
+  SELF: 1, // 自行生产
+  OUTSOURCE: 2, // 代工
+  PURCHASE: 3 // 采购
+}
+
+/** MES 工单来源类型枚举 */
+export const MesProWorkOrderSourceTypeEnum = {
+  ORDER: 1, // 客户订单
+  STORE: 2 // 库存备货
+}
+
 /** 获取物料/产品标识的标签 */
 export const getItemOrProductLabel = (value: string): string => {
   for (const item of Object.values(MesItemOrProductEnum)) {