From 15dd4dce76eee9e39ac82bf7d638821f209b9a94 Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Mon, 16 Feb 2026 01:28:10 +0800
Subject: [PATCH] =?UTF-8?q?feat(mes):=20=E6=96=B0=E5=A2=9E=E7=89=A9?=
 =?UTF-8?q?=E6=96=99=E6=89=B9=E6=AC=A1=E5=B1=9E=E6=80=A7=E9=85=8D=E7=BD=AE?=
 =?UTF-8?q?=E5=89=8D=E7=AB=AF=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

1. 新增 MdItemBatchConfigForm 组件，根据 itemOrProduct 区分 ITEM/PRODUCT 展示不同 checkbox
2. 嵌入 MdItemForm 的"批次属性"tab，仅 batchFlag 开启时显示
3. API 文件放置于 batchConfig/index.ts 子目录
4. 使用 MesItemOrProductEnum 常量替代硬编码字符串
5. MdItemForm 变量名语义优化：itemTypeList → itemTypeTree，itemTypeFlatList → itemTypeList
6. 布局优化：采用 CSS Grid 一行 5 个，checkbox label 模式（☑ 文字）
---
 src/api/mes/md/item/batchConfig/index.ts      |  34 +++++
 .../mes/md/item/MdItemBatchConfigForm.vue     | 122 ++++++++++++++++++
 src/views/mes/md/item/MdItemForm.vue          |  24 +++-
 3 files changed, 173 insertions(+), 7 deletions(-)
 create mode 100644 src/api/mes/md/item/batchConfig/index.ts
 create mode 100644 src/views/mes/md/item/MdItemBatchConfigForm.vue

diff --git a/src/api/mes/md/item/batchConfig/index.ts b/src/api/mes/md/item/batchConfig/index.ts
new file mode 100644
index 000000000..8a36e96bd
--- /dev/null
+++ b/src/api/mes/md/item/batchConfig/index.ts
@@ -0,0 +1,34 @@
+import request from '@/config/axios'
+
+// MES 物料批次属性配置 VO
+export interface MdItemBatchConfigVO {
+  id?: number // 编号
+  itemId: number // 物料编号
+  produceDateFlag: boolean // 批次属性-生产日期
+  expireDateFlag: boolean // 批次属性-有效期
+  receiptDateFlag: boolean // 批次属性-入库日期
+  vendorFlag: boolean // 批次属性-供应商
+  clientFlag: boolean // 批次属性-客户
+  salesOrderCodeFlag: boolean // 批次属性-销售订单编号
+  purchaseOrderCodeFlag: boolean // 批次属性-采购订单编号
+  workorderFlag: boolean // 批次属性-生产工单
+  taskFlag: boolean // 批次属性-生产任务
+  workstationFlag: boolean // 批次属性-工位
+  toolFlag: boolean // 批次属性-工具
+  moldFlag: boolean // 批次属性-模具
+  lotNumberFlag: boolean // 批次属性-生产批号
+  qualityStatusFlag: boolean // 批次属性-质量状态
+}
+
+// MES 物料批次属性配置 API
+export const MdItemBatchConfigApi = {
+  // 根据物料编号获取批次属性配置
+  getBatchConfigByItemId: async (itemId: number) => {
+    return await request.get({ url: `/mes/md/item-batch-config/get-by-item-id?itemId=` + itemId })
+  },
+
+  // 保存批次属性配置（新增或更新）
+  saveBatchConfig: async (data: MdItemBatchConfigVO) => {
+    return await request.post({ url: `/mes/md/item-batch-config/save`, data })
+  }
+}
diff --git a/src/views/mes/md/item/MdItemBatchConfigForm.vue b/src/views/mes/md/item/MdItemBatchConfigForm.vue
new file mode 100644
index 000000000..f534374e0
--- /dev/null
+++ b/src/views/mes/md/item/MdItemBatchConfigForm.vue
@@ -0,0 +1,122 @@
+<!-- MES 物料批次属性配置 -->
+<template>
+  <el-form ref="formRef" :model="formData" v-loading="loading">
+    <div class="flex justify-end mb-10px">
+      <el-button type="primary" size="small" @click="handleSave" :loading="loading">保存批次属性</el-button>
+    </div>
+    <div class="batch-config-grid">
+      <!-- 通用属性（ITEM 和 PRODUCT 都可见） -->
+      <el-checkbox v-model="formData.produceDateFlag">生产日期</el-checkbox>
+      <el-checkbox v-model="formData.qualityStatusFlag">质量状态</el-checkbox>
+
+      <!-- ITEM（原材料）特有属性 -->
+      <template v-if="itemOrProduct === MesItemOrProductEnum.ITEM.value">
+        <el-checkbox v-model="formData.vendorFlag">供应商</el-checkbox>
+        <el-checkbox v-model="formData.purchaseOrderCodeFlag">采购订单编号</el-checkbox>
+        <el-checkbox v-model="formData.lotNumberFlag">生产批号</el-checkbox>
+        <el-checkbox v-model="formData.expireDateFlag">有效期</el-checkbox>
+        <el-checkbox v-model="formData.receiptDateFlag">入库日期</el-checkbox>
+      </template>
+
+      <!-- PRODUCT（产品）特有属性 -->
+      <template v-if="itemOrProduct === MesItemOrProductEnum.PRODUCT.value">
+        <el-checkbox v-model="formData.clientFlag">客户</el-checkbox>
+        <el-checkbox v-model="formData.salesOrderCodeFlag">销售订单编号</el-checkbox>
+        <el-checkbox v-model="formData.workorderFlag">生产工单</el-checkbox>
+        <el-checkbox v-model="formData.taskFlag">生产任务</el-checkbox>
+        <el-checkbox v-model="formData.workstationFlag">工位</el-checkbox>
+        <el-checkbox v-model="formData.toolFlag">工具</el-checkbox>
+        <el-checkbox v-model="formData.moldFlag">模具</el-checkbox>
+      </template>
+    </div>
+  </el-form>
+</template>
+
+<script setup lang="ts">
+import { MdItemBatchConfigApi, MdItemBatchConfigVO } from '@/api/mes/md/item/batchConfig'
+import { MesItemOrProductEnum } from '@/views/mes/utils/constants'
+
+defineOptions({ name: 'MdItemBatchConfigForm' })
+
+const props = defineProps<{
+  itemId: number
+  itemOrProduct: string // 'ITEM' | 'PRODUCT'
+}>()
+
+const message = useMessage()
+const loading = ref(false)
+const formRef = ref()
+const formData = ref<MdItemBatchConfigVO>({
+  itemId: props.itemId,
+  produceDateFlag: false,
+  expireDateFlag: false,
+  receiptDateFlag: false,
+  vendorFlag: false,
+  clientFlag: false,
+  salesOrderCodeFlag: false,
+  purchaseOrderCodeFlag: false,
+  workorderFlag: false,
+  taskFlag: false,
+  workstationFlag: false,
+  toolFlag: false,
+  moldFlag: false,
+  lotNumberFlag: false,
+  qualityStatusFlag: false
+})
+
+/** 加载已有配置 */
+const loadData = async () => {
+  loading.value = true
+  try {
+    const data = await MdItemBatchConfigApi.getBatchConfigByItemId(props.itemId)
+    if (data) {
+      formData.value = { ...formData.value, ...data }
+    }
+  } finally {
+    loading.value = false
+  }
+}
+
+/** 保存 */
+const handleSave = async () => {
+  // 校验至少选中一个属性
+  const hasAny =
+    formData.value.produceDateFlag ||
+    formData.value.expireDateFlag ||
+    formData.value.receiptDateFlag ||
+    formData.value.vendorFlag ||
+    formData.value.clientFlag ||
+    formData.value.salesOrderCodeFlag ||
+    formData.value.purchaseOrderCodeFlag ||
+    formData.value.workorderFlag ||
+    formData.value.taskFlag ||
+    formData.value.workstationFlag ||
+    formData.value.toolFlag ||
+    formData.value.moldFlag ||
+    formData.value.lotNumberFlag ||
+    formData.value.qualityStatusFlag
+  if (!hasAny) {
+    message.warning('至少选择一个批次属性')
+    return
+  }
+
+  loading.value = true
+  try {
+    formData.value.itemId = props.itemId
+    await MdItemBatchConfigApi.saveBatchConfig(formData.value)
+    message.success('保存成功')
+  } finally {
+    loading.value = false
+  }
+}
+
+onMounted(() => loadData())
+</script>
+
+<style lang="scss" scoped>
+.batch-config-grid {
+  display: grid;
+  grid-template-columns: repeat(5, 1fr);
+  gap: 0 20px;
+}
+</style>
diff --git a/src/views/mes/md/item/MdItemForm.vue b/src/views/mes/md/item/MdItemForm.vue
index 41a2f38e9..0ed263799 100644
--- a/src/views/mes/md/item/MdItemForm.vue
+++ b/src/views/mes/md/item/MdItemForm.vue
@@ -46,7 +46,7 @@
           <el-form-item label="物料分类" prop="itemTypeId">
             <el-tree-select
               v-model="formData.itemTypeId"
-              :data="itemTypeList"
+              :data="itemTypeTree"
               :props="defaultProps"
               check-strictly
               default-expand-all
@@ -118,9 +118,8 @@
       <el-tab-pane label="BOM 组成" name="bom" lazy>
         <el-empty description="BOM 组成（待实现）" />
       </el-tab-pane>
-      <!-- TODO @芋艿：批次属性，等批次模块实现后对接 -->
-      <el-tab-pane label="批次属性" name="batch" lazy>
-        <el-empty description="批次属性（待实现）" />
+      <el-tab-pane label="批次属性" name="batch" lazy v-if="formData.batchFlag">
+        <MdItemBatchConfigForm :itemId="formData.id!" :itemOrProduct="currentItemOrProduct" />
       </el-tab-pane>
       <!-- TODO @芋艿：替代品，等替代品模块实现后对接 -->
       <el-tab-pane label="替代品" name="substitute" lazy>
@@ -145,6 +144,7 @@ import { getIntDictOptions, DICT_TYPE } from '@/utils/dict'
 import { generateRandomStr } from '@/utils'
 import { MdItemApi, MdItemVO } from '@/api/mes/md/item'
 import { MdItemTypeApi, MdItemTypeVO } from '@/api/mes/md/item/type'
+import MdItemBatchConfigForm from './MdItemBatchConfigForm.vue'
 import { MdUnitMeasureApi, MdUnitMeasureVO } from '@/api/mes/md/unitmeasure'
 import { CommonStatusEnum } from '@/utils/constants'
 import { defaultProps, handleTree } from '@/utils/tree'
@@ -183,9 +183,19 @@ const formRules = reactive({
   status: [{ required: true, message: '状态不能为空', trigger: 'blur' }]
 })
 const formRef = ref() // 表单 Ref
-const itemTypeList = ref<MdItemTypeVO[]>([]) // 物料分类列表
+const itemTypeTree = ref<MdItemTypeVO[]>([]) // 物料分类树
+const itemTypeList = ref<MdItemTypeVO[]>([]) // 物料分类列表（扁平）
 const unitMeasureList = ref<MdUnitMeasureVO[]>([]) // 计量单位列表
 
+/** 当前物料的「物料/产品」标识 */
+const currentItemOrProduct = computed(() => {
+  if (!formData.value.itemTypeId) {
+    return ''
+  }
+  const itemType = itemTypeList.value.find((t) => t.id === formData.value.itemTypeId)
+  return itemType?.itemOrProduct || ''
+})
+
 /** 生成物料编码 */
 const generateCode = () => {
   // TODO @芋艿：后续对接后端编码生成接口
@@ -209,8 +219,8 @@ const open = async (type: string, id?: number) => {
     }
   }
   // 物料分类
-  const categoryData = await MdItemTypeApi.getItemTypeSimpleList()
-  itemTypeList.value = handleTree(categoryData, 'id', 'parentId')
+  itemTypeList.value = await MdItemTypeApi.getItemTypeSimpleList()
+  itemTypeTree.value = handleTree(itemTypeList.value)
   // 计量单位
   unitMeasureList.value = await MdUnitMeasureApi.getUnitMeasureSimpleList()
 }