diff --git a/apps/web-antd/src/api/mes/md/autocode/part/index.ts b/apps/web-antd/src/api/mes/md/autocode/part/index.ts
new file mode 100644
index 000000000..2962ae55e
--- /dev/null
+++ b/apps/web-antd/src/api/mes/md/autocode/part/index.ts
@@ -0,0 +1,53 @@
+import { requestClient } from '#/api/request';
+
+export namespace MesMdAutoCodePartApi {
+  /** MES 编码规则分段 */
+  export interface AutoCodePart {
+    id?: number; // 分段编号
+    ruleId?: number; // 规则编号
+    sort?: number; // 排序
+    type?: number; // 分段类型
+    length?: number; // 长度
+    dateFormat?: string; // 日期格式
+    fixCharacter?: string; // 固定字符
+    serialStartNo?: number; // 流水号起始值
+    serialStep?: number; // 流水号步长
+    cycleFlag?: boolean; // 是否循环
+    cycleMethod?: number; // 循环方式
+    remark?: string; // 备注
+  }
+}
+
+/** 查询编码规则分段详情 */
+export function getAutoCodePart(id: number) {
+  return requestClient.get<MesMdAutoCodePartApi.AutoCodePart>(
+    `/mes/md/auto-code-part/get?id=${id}`,
+  );
+}
+
+/** 查询编码规则分段列表 */
+export function getAutoCodePartListByRuleId(ruleId: number) {
+  return requestClient.get<MesMdAutoCodePartApi.AutoCodePart[]>(
+    '/mes/md/auto-code-part/list-by-rule-id',
+    { params: { ruleId } },
+  );
+}
+
+/** 新增编码规则分段 */
+export function createAutoCodePart(
+  data: MesMdAutoCodePartApi.AutoCodePart,
+) {
+  return requestClient.post('/mes/md/auto-code-part/create', data);
+}
+
+/** 修改编码规则分段 */
+export function updateAutoCodePart(
+  data: MesMdAutoCodePartApi.AutoCodePart,
+) {
+  return requestClient.put('/mes/md/auto-code-part/update', data);
+}
+
+/** 删除编码规则分段 */
+export function deleteAutoCodePart(id: number) {
+  return requestClient.delete(`/mes/md/auto-code-part/delete?id=${id}`);
+}
diff --git a/apps/web-antd/src/api/mes/md/autocode/rule/index.ts b/apps/web-antd/src/api/mes/md/autocode/rule/index.ts
new file mode 100644
index 000000000..be4d81f2f
--- /dev/null
+++ b/apps/web-antd/src/api/mes/md/autocode/rule/index.ts
@@ -0,0 +1,60 @@
+import type { PageParam, PageResult } from '@vben/request';
+
+import { requestClient } from '#/api/request';
+
+export namespace MesMdAutoCodeRuleApi {
+  /** MES 编码规则 */
+  export interface AutoCodeRule {
+    id?: number; // 规则编号
+    code?: string; // 规则编码
+    name?: string; // 规则名称
+    description?: string; // 规则描述
+    maxLength?: number; // 最大长度
+    padded?: boolean; // 是否补齐
+    paddedChar?: string; // 补齐字符
+    paddedMethod?: number; // 补齐方式
+    status?: number; // 状态
+    remark?: string; // 备注
+    createTime?: Date; // 创建时间
+  }
+}
+
+/** 查询编码规则分页 */
+export function getAutoCodeRulePage(params: PageParam) {
+  return requestClient.get<
+    PageResult<MesMdAutoCodeRuleApi.AutoCodeRule>
+  >('/mes/md/auto-code-rule/page', { params });
+}
+
+/** 查询编码规则详情 */
+export function getAutoCodeRule(id: number) {
+  return requestClient.get<MesMdAutoCodeRuleApi.AutoCodeRule>(
+    `/mes/md/auto-code-rule/get?id=${id}`,
+  );
+}
+
+/** 新增编码规则 */
+export function createAutoCodeRule(
+  data: MesMdAutoCodeRuleApi.AutoCodeRule,
+) {
+  return requestClient.post('/mes/md/auto-code-rule/create', data);
+}
+
+/** 修改编码规则 */
+export function updateAutoCodeRule(
+  data: MesMdAutoCodeRuleApi.AutoCodeRule,
+) {
+  return requestClient.put('/mes/md/auto-code-rule/update', data);
+}
+
+/** 删除编码规则 */
+export function deleteAutoCodeRule(id: number) {
+  return requestClient.delete(`/mes/md/auto-code-rule/delete?id=${id}`);
+}
+
+/** 导出编码规则 */
+export function exportAutoCodeRule(params: PageParam) {
+  return requestClient.download('/mes/md/auto-code-rule/export-excel', {
+    params,
+  });
+}
diff --git a/apps/web-antd/src/api/mes/wm/itemreceipt/index.ts b/apps/web-antd/src/api/mes/wm/itemreceipt/index.ts
new file mode 100644
index 000000000..d7086de99
--- /dev/null
+++ b/apps/web-antd/src/api/mes/wm/itemreceipt/index.ts
@@ -0,0 +1,34 @@
+import { requestClient } from '#/api/request';
+
+export namespace MesWmItemReceiptApi {
+  /** MES 采购入库单 */
+  export interface ItemReceipt {
+    id?: number; // 入库单编号
+    code?: string; // 入库单编码
+    name?: string; // 入库单名称
+    iqcId?: number; // 来料检验单编号
+    iqcCode?: string; // 来料检验单编码
+    noticeId?: number; // 到货通知单编号
+    noticeCode?: string; // 到货通知单编码
+    purchaseOrderCode?: string; // 采购订单号
+    vendorId?: number; // 供应商编号
+    vendorName?: string; // 供应商名称
+    warehouseId?: number; // 仓库编号
+    warehouseName?: string; // 仓库名称
+    locationId?: number; // 库区编号
+    locationName?: string; // 库区名称
+    areaId?: number; // 库位编号
+    areaName?: string; // 库位名称
+    receiptDate?: Date | number | string; // 入库日期
+    status?: number; // 状态
+    remark?: string; // 备注
+    createTime?: Date; // 创建时间
+  }
+}
+
+/** 查询采购入库单详情 */
+export function getItemReceipt(id: number) {
+  return requestClient.get<MesWmItemReceiptApi.ItemReceipt>(
+    `/mes/wm/item-receipt/get?id=${id}`,
+  );
+}
diff --git a/apps/web-antd/src/views/mes/md/autocode/data.ts b/apps/web-antd/src/views/mes/md/autocode/data.ts
new file mode 100644
index 000000000..ce59ec37d
--- /dev/null
+++ b/apps/web-antd/src/views/mes/md/autocode/data.ts
@@ -0,0 +1,472 @@
+import type { VbenFormSchema } from '#/adapter/form';
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesMdAutoCodePartApi } from '#/api/mes/md/autocode/part';
+import type { MesMdAutoCodeRuleApi } from '#/api/mes/md/autocode/rule';
+
+import { CommonStatusEnum, DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
+import { z } from '#/adapter/form';
+import { MesAutoCodePartTypeEnum } from '#/views/mes/utils/constants';
+
+/** 新增/修改编码规则的表单 */
+export function useFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'code',
+      label: '规则编码',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入规则编码',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'name',
+      label: '规则名称',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入规则名称',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'description',
+      label: '规则描述',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入规则描述',
+      },
+    },
+    {
+      fieldName: 'maxLength',
+      label: '最大长度',
+      component: 'InputNumber',
+      componentProps: {
+        class: '!w-full',
+        max: 100,
+        min: 1,
+        precision: 0,
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'padded',
+      label: '是否补齐',
+      component: 'RadioGroup',
+      componentProps: {
+        buttonStyle: 'solid',
+        optionType: 'button',
+        options: getDictOptions(DICT_TYPE.INFRA_BOOLEAN_STRING, 'boolean'),
+      },
+      rules: z.boolean().default(false),
+    },
+    {
+      fieldName: 'paddedChar',
+      label: '补齐字符',
+      component: 'Input',
+      componentProps: {
+        maxLength: 1,
+        placeholder: '请输入补齐字符',
+      },
+      dependencies: {
+        triggerFields: ['padded'],
+        show: (values) => values.padded === true,
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'paddedMethod',
+      label: '补齐方式',
+      component: 'RadioGroup',
+      componentProps: {
+        buttonStyle: 'solid',
+        optionType: 'button',
+        options: getDictOptions(
+          DICT_TYPE.MES_MD_AUTO_CODE_PADDED_METHOD,
+          'number',
+        ),
+      },
+      dependencies: {
+        triggerFields: ['padded'],
+        show: (values) => values.padded === true,
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'status',
+      label: '状态',
+      component: 'RadioGroup',
+      componentProps: {
+        buttonStyle: 'solid',
+        optionType: 'button',
+        options: getDictOptions(DICT_TYPE.COMMON_STATUS, 'number'),
+      },
+      rules: z.number().default(CommonStatusEnum.ENABLE),
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入备注',
+        rows: 3,
+      },
+    },
+  ];
+}
+
+/** 列表的搜索表单 */
+export function useGridFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'code',
+      label: '规则编码',
+      component: 'Input',
+      componentProps: {
+        allowClear: true,
+        placeholder: '请输入规则编码',
+      },
+    },
+    {
+      fieldName: 'name',
+      label: '规则名称',
+      component: 'Input',
+      componentProps: {
+        allowClear: true,
+        placeholder: '请输入规则名称',
+      },
+    },
+    {
+      fieldName: 'status',
+      label: '状态',
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: getDictOptions(DICT_TYPE.COMMON_STATUS, 'number'),
+        placeholder: '请选择状态',
+      },
+    },
+  ];
+}
+
+/** 列表的字段 */
+export function useGridColumns(): VxeTableGridOptions<MesMdAutoCodeRuleApi.AutoCodeRule>['columns'] {
+  return [
+    {
+      field: 'code',
+      title: '规则编码',
+      width: 150,
+    },
+    {
+      field: 'name',
+      title: '规则名称',
+      width: 200,
+    },
+    {
+      field: 'description',
+      title: '规则描述',
+      minWidth: 180,
+    },
+    {
+      field: 'maxLength',
+      title: '最大长度',
+      width: 100,
+      align: 'center',
+    },
+    {
+      field: 'padded',
+      title: '是否补齐',
+      width: 100,
+      align: 'center',
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.INFRA_BOOLEAN_STRING },
+      },
+    },
+    {
+      field: 'status',
+      title: '状态',
+      width: 100,
+      align: 'center',
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.COMMON_STATUS },
+      },
+    },
+    {
+      field: 'remark',
+      title: '备注',
+      minWidth: 160,
+    },
+    {
+      field: 'createTime',
+      title: '创建时间',
+      width: 180,
+      formatter: 'formatDateTime',
+    },
+    {
+      title: '操作',
+      width: 150,
+      fixed: 'right',
+      slots: { default: 'actions' },
+    },
+  ];
+}
+
+/** 新增/修改编码规则分段的表单 */
+export function usePartFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'ruleId',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'sort',
+      label: '分段排序',
+      component: 'InputNumber',
+      componentProps: {
+        class: '!w-full',
+        min: 1,
+        precision: 0,
+      },
+      rules: z.number().default(1),
+    },
+    {
+      fieldName: 'length',
+      label: '分段长度',
+      component: 'InputNumber',
+      componentProps: {
+        class: '!w-full',
+        max: 50,
+        min: 1,
+        precision: 0,
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'type',
+      label: '分段类型',
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: getDictOptions(
+          DICT_TYPE.MES_MD_AUTO_CODE_PART_TYPE,
+          'number',
+        ),
+        placeholder: '请选择分段类型',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'dateFormat',
+      label: '日期格式',
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: [
+          { label: 'yyyy', value: 'yyyy' },
+          { label: 'yyyyMM', value: 'yyyyMM' },
+          { label: 'yyyyMMdd', value: 'yyyyMMdd' },
+          { label: 'yyyyMMddHH', value: 'yyyyMMddHH' },
+          { label: 'yyyyMMddHHmm', value: 'yyyyMMddHHmm' },
+        ],
+        placeholder: '请选择日期格式',
+      },
+      dependencies: {
+        triggerFields: ['type'],
+        show: (values) => values.type === MesAutoCodePartTypeEnum.DATE,
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'fixCharacter',
+      label: '固定字符',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入固定字符',
+      },
+      dependencies: {
+        triggerFields: ['type'],
+        show: (values) => values.type === MesAutoCodePartTypeEnum.FIX,
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'serialStartNo',
+      label: '流水号起始值',
+      component: 'InputNumber',
+      componentProps: {
+        class: '!w-full',
+        min: 1,
+        precision: 0,
+      },
+      dependencies: {
+        triggerFields: ['type'],
+        show: (values) => values.type === MesAutoCodePartTypeEnum.SERIAL,
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'serialStep',
+      label: '流水号步长',
+      component: 'InputNumber',
+      componentProps: {
+        class: '!w-full',
+        min: 1,
+        precision: 0,
+      },
+      dependencies: {
+        triggerFields: ['type'],
+        show: (values) => values.type === MesAutoCodePartTypeEnum.SERIAL,
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'cycleFlag',
+      label: '是否循环',
+      component: 'Switch',
+      componentProps: {
+        checkedChildren: '是',
+        unCheckedChildren: '否',
+      },
+      dependencies: {
+        triggerFields: ['type'],
+        show: (values) => values.type === MesAutoCodePartTypeEnum.SERIAL,
+      },
+      rules: z.boolean().default(false),
+    },
+    {
+      fieldName: 'cycleMethod',
+      label: '循环方式',
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: getDictOptions(
+          DICT_TYPE.MES_MD_AUTO_CODE_CYCLE_METHOD,
+          'number',
+        ),
+        placeholder: '请选择循环方式',
+      },
+      dependencies: {
+        triggerFields: ['type', 'cycleFlag'],
+        show: (values) =>
+          values.type === MesAutoCodePartTypeEnum.SERIAL &&
+          values.cycleFlag === true,
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入备注',
+        rows: 3,
+      },
+    },
+  ];
+}
+
+/** 编码规则分段的字段 */
+export function usePartGridColumns(): VxeTableGridOptions<MesMdAutoCodePartApi.AutoCodePart>['columns'] {
+  return [
+    {
+      field: 'sort',
+      title: '分段排序',
+      width: 90,
+      align: 'center',
+    },
+    {
+      field: 'type',
+      title: '分段类型',
+      width: 120,
+      align: 'center',
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_MD_AUTO_CODE_PART_TYPE },
+      },
+    },
+    {
+      field: 'length',
+      title: '分段长度',
+      width: 90,
+      align: 'center',
+    },
+    {
+      field: 'dateFormat',
+      title: '日期格式',
+      width: 150,
+      align: 'center',
+    },
+    {
+      field: 'fixCharacter',
+      title: '固定字符',
+      width: 120,
+      align: 'center',
+    },
+    {
+      field: 'serialStartNo',
+      title: '流水号起始',
+      width: 110,
+      align: 'center',
+    },
+    {
+      field: 'serialStep',
+      title: '流水号步长',
+      width: 110,
+      align: 'center',
+    },
+    {
+      field: 'cycleFlag',
+      title: '是否循环',
+      width: 100,
+      align: 'center',
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.INFRA_BOOLEAN_STRING },
+      },
+    },
+    {
+      field: 'cycleMethod',
+      title: '循环方式',
+      width: 120,
+      align: 'center',
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_MD_AUTO_CODE_CYCLE_METHOD },
+      },
+    },
+    {
+      field: 'remark',
+      title: '备注',
+      minWidth: 160,
+    },
+    {
+      title: '操作',
+      width: 130,
+      fixed: 'right',
+      slots: { default: 'actions' },
+    },
+  ];
+}
diff --git a/apps/web-antd/src/views/mes/md/autocode/index.vue b/apps/web-antd/src/views/mes/md/autocode/index.vue
new file mode 100644
index 000000000..1eeefc0b0
--- /dev/null
+++ b/apps/web-antd/src/views/mes/md/autocode/index.vue
@@ -0,0 +1,150 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesMdAutoCodeRuleApi } from '#/api/mes/md/autocode/rule';
+
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
+import { downloadFileFromBlobPart } from '@vben/utils';
+
+import { message } from 'ant-design-vue';
+
+import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import {
+  deleteAutoCodeRule,
+  exportAutoCodeRule,
+  getAutoCodeRulePage,
+} from '#/api/mes/md/autocode/rule';
+import { $t } from '#/locales';
+
+import { useGridColumns, useGridFormSchema } from './data';
+import Form from './modules/form.vue';
+
+const [FormModal, formModalApi] = useVbenModal({
+  connectedComponent: Form,
+  destroyOnClose: true,
+});
+
+/** 刷新表格 */
+function handleRefresh() {
+  gridApi.query();
+}
+
+/** 创建编码规则 */
+function handleCreate() {
+  formModalApi.setData(null).open();
+}
+
+/** 编辑编码规则 */
+function handleEdit(row: MesMdAutoCodeRuleApi.AutoCodeRule) {
+  formModalApi.setData(row).open();
+}
+
+/** 删除编码规则 */
+async function handleDelete(row: MesMdAutoCodeRuleApi.AutoCodeRule) {
+  const hideLoading = message.loading({
+    content: $t('ui.actionMessage.deleting', [row.name]),
+    duration: 0,
+  });
+  try {
+    await deleteAutoCodeRule(row.id!);
+    message.success($t('ui.actionMessage.deleteSuccess', [row.name]));
+    handleRefresh();
+  } finally {
+    hideLoading();
+  }
+}
+
+/** 导出编码规则 */
+async function handleExport() {
+  const data = await exportAutoCodeRule(await gridApi.formApi.getValues());
+  downloadFileFromBlobPart({ fileName: '编码规则.xls', source: data });
+}
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  formOptions: {
+    schema: useGridFormSchema(),
+  },
+  gridOptions: {
+    columns: useGridColumns(),
+    height: 'auto',
+    keepSource: true,
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }, formValues) => {
+          return await getAutoCodeRulePage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            ...formValues,
+          });
+        },
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+  } as VxeTableGridOptions<MesMdAutoCodeRuleApi.AutoCodeRule>,
+});
+</script>
+
+<template>
+  <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【基础】编码规则"
+        url="https://doc.iocoder.cn/mes/md/autocode/"
+      />
+    </template>
+
+    <FormModal @success="handleRefresh" />
+    <Grid table-title="编码规则列表">
+      <template #toolbar-tools>
+        <TableAction
+          :actions="[
+            {
+              label: $t('ui.actionTitle.create', ['编码规则']),
+              type: 'primary',
+              icon: ACTION_ICON.ADD,
+              auth: ['mes:auto-code-rule:create'],
+              onClick: handleCreate,
+            },
+            {
+              label: $t('ui.actionTitle.export'),
+              type: 'primary',
+              icon: ACTION_ICON.DOWNLOAD,
+              auth: ['mes:auto-code-rule:export'],
+              onClick: handleExport,
+            },
+          ]"
+        />
+      </template>
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: $t('common.edit'),
+              type: 'link',
+              icon: ACTION_ICON.EDIT,
+              auth: ['mes:auto-code-rule:update'],
+              onClick: handleEdit.bind(null, row),
+            },
+            {
+              label: $t('common.delete'),
+              type: 'link',
+              danger: true,
+              icon: ACTION_ICON.DELETE,
+              auth: ['mes:auto-code-rule:delete'],
+              popConfirm: {
+                title: $t('ui.actionMessage.deleteConfirm', [row.name]),
+                confirm: handleDelete.bind(null, row),
+              },
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+  </Page>
+</template>
diff --git a/apps/web-antd/src/views/mes/md/autocode/modules/form.vue b/apps/web-antd/src/views/mes/md/autocode/modules/form.vue
new file mode 100644
index 000000000..b1ba5fdf2
--- /dev/null
+++ b/apps/web-antd/src/views/mes/md/autocode/modules/form.vue
@@ -0,0 +1,102 @@
+<script lang="ts" setup>
+import type { MesMdAutoCodeRuleApi } from '#/api/mes/md/autocode/rule';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { message } from 'ant-design-vue';
+
+import { useVbenForm } from '#/adapter/form';
+import {
+  createAutoCodeRule,
+  getAutoCodeRule,
+  updateAutoCodeRule,
+} from '#/api/mes/md/autocode/rule';
+import { $t } from '#/locales';
+
+import { useFormSchema } from '../data';
+import PartList from './part-list.vue';
+
+const emit = defineEmits(['success']);
+const formData = ref<MesMdAutoCodeRuleApi.AutoCodeRule>();
+const getTitle = computed(() => {
+  return formData.value?.id
+    ? $t('ui.actionTitle.edit', ['编码规则'])
+    : $t('ui.actionTitle.create', ['编码规则']);
+});
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-2',
+    labelWidth: 120,
+  },
+  layout: 'horizontal',
+  schema: useFormSchema(),
+  showDefaultActions: false,
+});
+
+/** 清理未启用补齐时的补齐字段 */
+function normalizeRuleData(data: MesMdAutoCodeRuleApi.AutoCodeRule) {
+  if (!data.padded) {
+    data.paddedChar = undefined;
+    data.paddedMethod = undefined;
+  }
+  return data;
+}
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    const data = normalizeRuleData(
+      (await formApi.getValues()) as MesMdAutoCodeRuleApi.AutoCodeRule,
+    );
+    try {
+      await (formData.value?.id
+        ? updateAutoCodeRule(data)
+        : createAutoCodeRule(data));
+      await modalApi.close();
+      emit('success');
+      message.success($t('ui.actionMessage.operationSuccess'));
+    } finally {
+      modalApi.unlock();
+    }
+  },
+  async onOpenChange(isOpen: boolean) {
+    if (!isOpen) {
+      formData.value = undefined;
+      return;
+    }
+    await formApi.resetForm();
+    const data = modalApi.getData<MesMdAutoCodeRuleApi.AutoCodeRule>();
+    if (!data?.id) {
+      return;
+    }
+    modalApi.lock();
+    try {
+      formData.value = await getAutoCodeRule(data.id);
+      await formApi.setValues(formData.value);
+    } finally {
+      modalApi.unlock();
+    }
+  },
+});
+</script>
+
+<template>
+  <Modal :title="getTitle" class="w-3/5">
+    <Form class="mx-4" />
+    <template v-if="formData?.id">
+      <div class="mx-4 mt-4">
+        <PartList :rule-id="formData.id" />
+      </div>
+    </template>
+  </Modal>
+</template>
diff --git a/apps/web-antd/src/views/mes/md/autocode/modules/part-form.vue b/apps/web-antd/src/views/mes/md/autocode/modules/part-form.vue
new file mode 100644
index 000000000..538f594cc
--- /dev/null
+++ b/apps/web-antd/src/views/mes/md/autocode/modules/part-form.vue
@@ -0,0 +1,115 @@
+<script lang="ts" setup>
+import type { MesMdAutoCodePartApi } from '#/api/mes/md/autocode/part';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { message } from 'ant-design-vue';
+
+import { useVbenForm } from '#/adapter/form';
+import {
+  createAutoCodePart,
+  getAutoCodePart,
+  updateAutoCodePart,
+} from '#/api/mes/md/autocode/part';
+import { $t } from '#/locales';
+import { MesAutoCodePartTypeEnum } from '#/views/mes/utils/constants';
+
+import { usePartFormSchema } from '../data';
+
+const emit = defineEmits(['success']);
+const formData = ref<MesMdAutoCodePartApi.AutoCodePart>();
+const getTitle = computed(() => {
+  return formData.value?.id
+    ? $t('ui.actionTitle.edit', ['规则分段'])
+    : $t('ui.actionTitle.create', ['规则分段']);
+});
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-2',
+    labelWidth: 120,
+  },
+  layout: 'horizontal',
+  schema: usePartFormSchema(),
+  showDefaultActions: false,
+});
+
+/** 清理当前分段类型不需要的字段 */
+function normalizePartData(data: MesMdAutoCodePartApi.AutoCodePart) {
+  if (data.type !== MesAutoCodePartTypeEnum.DATE) {
+    data.dateFormat = undefined;
+  }
+  if (data.type !== MesAutoCodePartTypeEnum.FIX) {
+    data.fixCharacter = undefined;
+  }
+  if (data.type !== MesAutoCodePartTypeEnum.SERIAL) {
+    data.serialStartNo = undefined;
+    data.serialStep = undefined;
+    data.cycleFlag = false;
+    data.cycleMethod = undefined;
+  } else if (!data.cycleFlag) {
+    data.cycleMethod = undefined;
+  }
+  return data;
+}
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    const data = normalizePartData(
+      (await formApi.getValues()) as MesMdAutoCodePartApi.AutoCodePart,
+    );
+    try {
+      await (formData.value?.id
+        ? updateAutoCodePart(data)
+        : createAutoCodePart(data));
+      await modalApi.close();
+      emit('success');
+      message.success($t('ui.actionMessage.operationSuccess'));
+    } finally {
+      modalApi.unlock();
+    }
+  },
+  async onOpenChange(isOpen: boolean) {
+    if (!isOpen) {
+      formData.value = undefined;
+      return;
+    }
+    await formApi.resetForm();
+    const data = modalApi.getData<{
+      id?: number;
+      maxSort?: number;
+      ruleId: number;
+    }>();
+    if (!data?.id) {
+      await formApi.setValues({
+        ruleId: data.ruleId,
+        sort: (data.maxSort || 0) + 1,
+      });
+      return;
+    }
+    modalApi.lock();
+    try {
+      formData.value = await getAutoCodePart(data.id);
+      await formApi.setValues(formData.value);
+    } finally {
+      modalApi.unlock();
+    }
+  },
+});
+</script>
+
+<template>
+  <Modal :title="getTitle" class="w-1/3">
+    <Form class="mx-4" />
+  </Modal>
+</template>
diff --git a/apps/web-antd/src/views/mes/md/autocode/modules/part-list.vue b/apps/web-antd/src/views/mes/md/autocode/modules/part-list.vue
new file mode 100644
index 000000000..8107f808b
--- /dev/null
+++ b/apps/web-antd/src/views/mes/md/autocode/modules/part-list.vue
@@ -0,0 +1,131 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesMdAutoCodePartApi } from '#/api/mes/md/autocode/part';
+
+import { ref, watch } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { message } from 'ant-design-vue';
+
+import { TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import {
+  deleteAutoCodePart,
+  getAutoCodePartListByRuleId,
+} from '#/api/mes/md/autocode/part';
+import { $t } from '#/locales';
+
+import { usePartGridColumns } from '../data';
+import PartForm from './part-form.vue';
+
+const props = defineProps<{
+  ruleId: number;
+}>();
+
+const list = ref<MesMdAutoCodePartApi.AutoCodePart[]>([]);
+
+const [PartFormModal, partFormModalApi] = useVbenModal({
+  connectedComponent: PartForm,
+  destroyOnClose: true,
+});
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    autoResize: true,
+    border: true,
+    columns: usePartGridColumns(),
+    data: list.value,
+    minHeight: 240,
+    pagerConfig: {
+      enabled: false,
+    },
+    rowConfig: {
+      isHover: true,
+      keyField: 'id',
+    },
+    showOverflow: true,
+    toolbarConfig: {
+      enabled: false,
+    },
+  } as VxeTableGridOptions<MesMdAutoCodePartApi.AutoCodePart>,
+});
+
+/** 加载编码规则分段 */
+async function getList() {
+  gridApi.setLoading(true);
+  try {
+    list.value = await getAutoCodePartListByRuleId(props.ruleId);
+    gridApi.setGridOptions({ data: list.value });
+  } finally {
+    gridApi.setLoading(false);
+  }
+}
+
+/** 创建编码规则分段 */
+function handleCreate() {
+  const maxSort =
+    list.value.length > 0
+      ? Math.max(...list.value.map((item) => item.sort || 0))
+      : 0;
+  partFormModalApi.setData({ maxSort, ruleId: props.ruleId }).open();
+}
+
+/** 编辑编码规则分段 */
+function handleEdit(row: MesMdAutoCodePartApi.AutoCodePart) {
+  partFormModalApi.setData({ id: row.id, ruleId: props.ruleId }).open();
+}
+
+/** 删除编码规则分段 */
+async function handleDelete(row: MesMdAutoCodePartApi.AutoCodePart) {
+  await deleteAutoCodePart(row.id!);
+  message.success($t('ui.actionMessage.deleteSuccess', ['编码规则分段']));
+  await getList();
+}
+
+watch(
+  () => props.ruleId,
+  (value) => {
+    if (value) {
+      getList();
+    }
+  },
+  { immediate: true },
+);
+</script>
+
+<template>
+  <PartFormModal @success="getList" />
+  <div class="mb-3 flex items-center justify-start">
+    <TableAction
+      :actions="[
+        {
+          label: $t('ui.actionTitle.create', ['分段']),
+          type: 'primary',
+          onClick: handleCreate,
+        },
+      ]"
+    />
+  </div>
+  <Grid class="w-full" table-title="规则组成">
+    <template #actions="{ row }">
+      <TableAction
+        :actions="[
+          {
+            label: $t('common.edit'),
+            type: 'link',
+            onClick: handleEdit.bind(null, row),
+          },
+          {
+            label: $t('common.delete'),
+            type: 'link',
+            danger: true,
+            popConfirm: {
+              title: $t('ui.actionMessage.deleteConfirm', ['编码规则分段']),
+              confirm: handleDelete.bind(null, row),
+            },
+          },
+        ]"
+      />
+    </template>
+  </Grid>
+</template>
diff --git a/apps/web-antd/src/views/mes/md/item/components/index.ts b/apps/web-antd/src/views/mes/md/item/components/index.ts
index e5aa3ce08..348ae8798 100644
--- a/apps/web-antd/src/views/mes/md/item/components/index.ts
+++ b/apps/web-antd/src/views/mes/md/item/components/index.ts
@@ -1,2 +1,4 @@
 export { default as MdItemSelectDialog } from './md-item-select-dialog.vue';
 export { default as MdItemSelect } from './md-item-select.vue';
+export { default as MdProductBomSelectDialog } from './md-product-bom-select-dialog.vue';
+export { default as MdProductBomSelect } from './md-product-bom-select.vue';
diff --git a/apps/web-antd/src/views/mes/md/item/components/md-product-bom-select-dialog.vue b/apps/web-antd/src/views/mes/md/item/components/md-product-bom-select-dialog.vue
new file mode 100644
index 000000000..90ae85a32
--- /dev/null
+++ b/apps/web-antd/src/views/mes/md/item/components/md-product-bom-select-dialog.vue
@@ -0,0 +1,116 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesMdProductBomApi } from '#/api/mes/md/item/productBom';
+
+import { nextTick, ref } from 'vue';
+
+import { message, Modal } from 'ant-design-vue';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { getProductBomListByItemId } from '#/api/mes/md/item/productBom';
+
+import { useProductBomGridColumns } from '../data';
+
+defineOptions({ name: 'MdProductBomSelectDialog' });
+
+const emit = defineEmits<{
+  selected: [row: MesMdProductBomApi.ProductBom];
+}>();
+
+const open = ref(false); // 弹窗是否打开
+const list = ref<MesMdProductBomApi.ProductBom[]>([]); // BOM 子物料列表
+const selectedRow = ref<MesMdProductBomApi.ProductBom>(); // 当前选中的 BOM 行
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    border: true,
+    columns: [
+      { type: 'radio', width: 55, align: 'center' },
+      ...(useProductBomGridColumns(true) || []),
+    ],
+    data: list.value,
+    height: 500,
+    keepSource: true,
+    pagerConfig: {
+      enabled: false,
+    },
+    radioConfig: {
+      highlight: true,
+      trigger: 'row',
+    },
+    rowConfig: {
+      keyField: 'bomItemId',
+      isHover: true,
+    },
+    showOverflow: true,
+    toolbarConfig: {
+      enabled: false,
+    },
+  } as VxeTableGridOptions<MesMdProductBomApi.ProductBom>,
+  gridEvents: {
+    cellDblclick: ({ row }: { row: MesMdProductBomApi.ProductBom }) => {
+      selectedRow.value = row;
+      gridApi.grid.setRadioRow(row);
+      handleConfirm();
+    },
+    radioChange: ({ row }: { row: MesMdProductBomApi.ProductBom }) => {
+      selectedRow.value = row;
+    },
+  },
+});
+
+/** 打开 BOM 物料选择弹窗 */
+async function openModal(itemId: number, selectedBomItemId?: number) {
+  open.value = true;
+  selectedRow.value = undefined;
+  gridApi.setLoading(true);
+  try {
+    list.value = await getProductBomListByItemId(itemId);
+    gridApi.setGridOptions({ data: list.value });
+    await nextTick();
+    if (selectedBomItemId != null) {
+      const match = list.value.find(
+        (row) => row.bomItemId === selectedBomItemId,
+      );
+      if (match) {
+        selectedRow.value = match;
+        gridApi.grid.setRadioRow(match);
+      }
+    }
+  } finally {
+    gridApi.setLoading(false);
+  }
+}
+
+/** 关闭 BOM 物料选择弹窗 */
+async function closeModal() {
+  open.value = false;
+  selectedRow.value = undefined;
+  await gridApi.grid.clearRadioRow();
+}
+
+/** 确认选择 BOM 物料 */
+function handleConfirm() {
+  if (!selectedRow.value) {
+    message.warning('请选择一条数据');
+    return;
+  }
+  emit('selected', selectedRow.value);
+  open.value = false;
+}
+
+defineExpose({ open: openModal });
+</script>
+
+<template>
+  <Modal
+    v-model:open="open"
+    title="产品 BOM 物料选择"
+    width="800px"
+    :destroy-on-close="true"
+    @ok="handleConfirm"
+    @cancel="closeModal"
+  >
+    <Grid table-title="BOM 子物料列表" />
+  </Modal>
+</template>
diff --git a/apps/web-antd/src/views/mes/md/item/components/md-product-bom-select.vue b/apps/web-antd/src/views/mes/md/item/components/md-product-bom-select.vue
new file mode 100644
index 000000000..12d7185aa
--- /dev/null
+++ b/apps/web-antd/src/views/mes/md/item/components/md-product-bom-select.vue
@@ -0,0 +1,148 @@
+<script lang="ts" setup>
+import type { MesMdProductBomApi } from '#/api/mes/md/item/productBom';
+
+import { computed, ref, useAttrs, watch } from 'vue';
+
+import { IconifyIcon } from '@vben/icons';
+
+import { Input, Tooltip } from 'ant-design-vue';
+
+import { getProductBomListByItemId } from '#/api/mes/md/item/productBom';
+
+import MdProductBomSelectDialog from './md-product-bom-select-dialog.vue';
+
+defineOptions({ name: 'MdProductBomSelect', inheritAttrs: false });
+
+const props = withDefaults(
+  defineProps<{
+    allowClear?: boolean;
+    disabled?: boolean;
+    itemId?: number;
+    modelValue?: number;
+    placeholder?: string;
+  }>(),
+  {
+    allowClear: true,
+    disabled: false,
+    itemId: undefined,
+    modelValue: undefined,
+    placeholder: '请选择 BOM 物料',
+  },
+);
+const emit = defineEmits<{
+  change: [bom: MesMdProductBomApi.ProductBom | undefined];
+  'update:modelValue': [value: number | undefined];
+}>();
+const attrs = useAttrs(); // 透传属性
+const dialogRef = ref<InstanceType<typeof MdProductBomSelectDialog>>(); // BOM 物料选择弹窗
+const hovering = ref(false); // 是否悬停
+const selectedBom = ref<MesMdProductBomApi.ProductBom>(); // 当前选中的 BOM 物料
+
+const displayLabel = computed(() => selectedBom.value?.bomItemName ?? ''); // 选择器展示名称
+const showClear = computed( // 是否显示清空图标
+  () =>
+    props.allowClear &&
+    !props.disabled &&
+    hovering.value &&
+    props.modelValue != null,
+);
+
+/** 根据 BOM 子物料编号回显选择器 */
+async function resolveBomById(bomItemId: number | undefined) {
+  if (bomItemId == null || props.itemId == null) {
+    selectedBom.value = undefined;
+    return;
+  }
+  if (selectedBom.value?.bomItemId === bomItemId) {
+    return;
+  }
+  try {
+    const list = await getProductBomListByItemId(props.itemId);
+    selectedBom.value = list.find((item) => item.bomItemId === bomItemId);
+  } catch (error) {
+    console.error('[MdProductBomSelect] resolveBomById failed:', error);
+  }
+}
+
+watch(
+  () => props.modelValue,
+  (value) => {
+    resolveBomById(value);
+  },
+  { immediate: true },
+);
+
+watch(
+  () => props.itemId,
+  () => {
+    selectedBom.value = undefined;
+    emit('update:modelValue', undefined);
+    emit('change', undefined);
+  },
+);
+
+/** 清空已选 BOM 物料 */
+function clearSelected() {
+  selectedBom.value = undefined;
+  emit('update:modelValue', undefined);
+  emit('change', undefined);
+}
+
+/** 打开 BOM 物料选择弹窗 */
+function handleClick(event: MouseEvent) {
+  if (props.disabled || props.itemId == null) {
+    return;
+  }
+  const target = event.target as HTMLElement;
+  if (showClear.value && target.closest('.ant-input-suffix')) {
+    event.stopPropagation();
+    clearSelected();
+    return;
+  }
+  dialogRef.value?.open(props.itemId, props.modelValue);
+}
+
+/** 回填选中的 BOM 物料 */
+function handleSelected(row: MesMdProductBomApi.ProductBom) {
+  selectedBom.value = row;
+  emit('update:modelValue', row.bomItemId);
+  emit('change', row);
+}
+</script>
+
+<template>
+  <div
+    v-bind="attrs"
+    class="w-full"
+    :class="disabled ? 'cursor-not-allowed' : 'cursor-pointer'"
+    @click="handleClick"
+    @mouseenter="hovering = true"
+    @mouseleave="hovering = false"
+  >
+    <Tooltip :mouse-enter-delay="0.5" :open="selectedBom ? undefined : false">
+      <template #title>
+        <div v-if="selectedBom" class="leading-6">
+          <div>编码：{{ selectedBom.bomItemCode || '-' }}</div>
+          <div>名称：{{ selectedBom.bomItemName || '-' }}</div>
+          <div>规格：{{ selectedBom.bomItemSpecification || '-' }}</div>
+          <div>单位：{{ selectedBom.unitMeasureName || '-' }}</div>
+          <div>用量比例：{{ selectedBom.quantity ?? '-' }}</div>
+        </div>
+      </template>
+      <Input
+        :disabled="disabled"
+        :placeholder="placeholder"
+        :value="displayLabel"
+        readonly
+      >
+        <template #suffix>
+          <IconifyIcon
+            class="size-4"
+            :icon="showClear ? 'lucide:circle-x' : 'lucide:search'"
+          />
+        </template>
+      </Input>
+    </Tooltip>
+  </div>
+  <MdProductBomSelectDialog ref="dialogRef" @selected="handleSelected" />
+</template>
diff --git a/apps/web-antd/src/views/mes/md/vendor/modules/item-receipt-detail.vue b/apps/web-antd/src/views/mes/md/vendor/modules/item-receipt-detail.vue
new file mode 100644
index 000000000..e9cd9f261
--- /dev/null
+++ b/apps/web-antd/src/views/mes/md/vendor/modules/item-receipt-detail.vue
@@ -0,0 +1,138 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesWmItemReceiptApi } from '#/api/mes/wm/itemreceipt';
+import type { MesWmItemReceiptLineApi } from '#/api/mes/wm/itemreceipt/line';
+
+import { nextTick, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+import { formatDateTime } from '@vben/utils';
+
+import { Descriptions, Spin } from 'ant-design-vue';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { getItemReceipt } from '#/api/mes/wm/itemreceipt';
+import { getItemReceiptLinePage } from '#/api/mes/wm/itemreceipt/line';
+
+const loading = ref(false); // 详情加载状态
+const receiptId = ref<number>(); // 当前采购入库单编号
+const receipt = ref<MesWmItemReceiptApi.ItemReceipt>(); // 当前采购入库单详情
+
+/** 格式化空值 */
+function formatEmpty(value: null | number | string | undefined) {
+  return value ?? '-';
+}
+
+/** 格式化日期 */
+function formatDate(value: Date | number | string | undefined) {
+  return value ? (formatDateTime(value) as string) : '-';
+}
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    columns: [
+      { field: 'itemCode', title: '物料编码', width: 140 },
+      { field: 'itemName', title: '物料名称', minWidth: 150 },
+      { field: 'specification', title: '规格型号', minWidth: 140 },
+      { field: 'unitMeasureName', title: '单位', width: 100 },
+      { field: 'receivedQuantity', title: '入库数量', width: 120 },
+      { field: 'batchCode', title: '批次号', minWidth: 140 },
+    ],
+    height: 280,
+    keepSource: true,
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }) => {
+          if (!receiptId.value) {
+            return { list: [], total: 0 };
+          }
+          return await getItemReceiptLinePage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            receiptId: receiptId.value,
+          });
+        },
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+    },
+  } as VxeTableGridOptions<MesWmItemReceiptLineApi.ItemReceiptLine>,
+});
+
+const [Modal, modalApi] = useVbenModal({
+  async onOpenChange(isOpen: boolean) {
+    if (!isOpen) {
+      receiptId.value = undefined;
+      receipt.value = undefined;
+      return;
+    }
+    const data = modalApi.getData<{ id?: number }>();
+    if (!data?.id) {
+      return;
+    }
+    receiptId.value = data.id;
+    loading.value = true;
+    modalApi.lock();
+    try {
+      receipt.value = await getItemReceipt(data.id);
+      await nextTick();
+      await gridApi.query();
+    } finally {
+      loading.value = false;
+      modalApi.unlock();
+    }
+  },
+});
+</script>
+
+<template>
+  <Modal
+    title="采购入库单详情"
+    class="w-[900px]"
+    :show-cancel-button="false"
+    :show-confirm-button="false"
+  >
+    <Spin :spinning="loading">
+      <Descriptions bordered size="small" :column="3">
+        <Descriptions.Item label="入库单编号">
+          {{ formatEmpty(receipt?.code) }}
+        </Descriptions.Item>
+        <Descriptions.Item label="入库单名称">
+          {{ formatEmpty(receipt?.name) }}
+        </Descriptions.Item>
+        <Descriptions.Item label="入库日期">
+          {{ formatDate(receipt?.receiptDate) }}
+        </Descriptions.Item>
+        <Descriptions.Item label="到货通知单">
+          {{ formatEmpty(receipt?.noticeCode) }}
+        </Descriptions.Item>
+        <Descriptions.Item label="供应商">
+          {{ formatEmpty(receipt?.vendorName) }}
+        </Descriptions.Item>
+        <Descriptions.Item label="采购订单号">
+          {{ formatEmpty(receipt?.purchaseOrderCode) }}
+        </Descriptions.Item>
+        <Descriptions.Item label="仓库">
+          {{ formatEmpty(receipt?.warehouseName) }}
+        </Descriptions.Item>
+        <Descriptions.Item label="库区">
+          {{ formatEmpty(receipt?.locationName) }}
+        </Descriptions.Item>
+        <Descriptions.Item label="库位">
+          {{ formatEmpty(receipt?.areaName) }}
+        </Descriptions.Item>
+        <Descriptions.Item label="备注" :span="3">
+          {{ formatEmpty(receipt?.remark) }}
+        </Descriptions.Item>
+      </Descriptions>
+      <div class="mt-4">
+        <Grid table-title="入库物料" />
+      </div>
+    </Spin>
+  </Modal>
+</template>
diff --git a/apps/web-antd/src/views/mes/md/vendor/modules/item-receipt-list.vue b/apps/web-antd/src/views/mes/md/vendor/modules/item-receipt-list.vue
index 86635ab07..579b4db05 100644
--- a/apps/web-antd/src/views/mes/md/vendor/modules/item-receipt-list.vue
+++ b/apps/web-antd/src/views/mes/md/vendor/modules/item-receipt-list.vue
@@ -2,17 +2,40 @@
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
 import type { MesWmItemReceiptLineApi } from '#/api/mes/wm/itemreceipt/line';
 
+import { useVbenModal } from '@vben/common-ui';
+
+import { Button } from 'ant-design-vue';
+
 import { useVbenVxeGrid } from '#/adapter/vxe-table';
 import { getItemReceiptLinePage } from '#/api/mes/wm/itemreceipt/line';
 
+import ItemReceiptDetail from './item-receipt-detail.vue';
+
 const props = defineProps<{
   vendorId: number;
 }>();
 
+const [DetailModal, detailModalApi] = useVbenModal({
+  connectedComponent: ItemReceiptDetail,
+  destroyOnClose: true,
+});
+
+/** 查看采购入库单详情 */
+function handleViewReceipt(row: MesWmItemReceiptLineApi.ItemReceiptLine) {
+  if (row.receiptId) {
+    detailModalApi.setData({ id: row.receiptId }).open();
+  }
+}
+
 const [Grid] = useVbenVxeGrid({
   gridOptions: {
     columns: [
-      { field: 'receiptCode', title: '入库单编号', minWidth: 160 },
+      {
+        field: 'receiptCode',
+        title: '入库单编号',
+        minWidth: 160,
+        slots: { default: 'receiptCode' },
+      },
       { field: 'purchaseOrderCode', title: '采购订单号', minWidth: 150 },
       { field: 'itemCode', title: '物料编码', width: 140 },
       { field: 'itemName', title: '物料名称', minWidth: 150 },
@@ -45,5 +68,12 @@ const [Grid] = useVbenVxeGrid({
 </script>
 
 <template>
-  <Grid table-title="采购记录" />
+  <DetailModal />
+  <Grid table-title="采购记录">
+    <template #receiptCode="{ row }">
+      <Button type="link" @click="handleViewReceipt(row)">
+        {{ row.receiptCode }}
+      </Button>
+    </template>
+  </Grid>
 </template>
diff --git a/apps/web-ele/src/api/mes/md/autocode/part/index.ts b/apps/web-ele/src/api/mes/md/autocode/part/index.ts
new file mode 100644
index 000000000..c64684c9b
--- /dev/null
+++ b/apps/web-ele/src/api/mes/md/autocode/part/index.ts
@@ -0,0 +1,49 @@
+import { requestClient } from '#/api/request';
+
+export namespace MesMdAutoCodePartApi {
+  /** MES 编码规则分段 */
+  export interface AutoCodePart {
+    id?: number; // 分段编号
+    ruleId?: number; // 规则编号
+    sort?: number; // 排序
+    type?: number; // 分段类型
+    length?: number; // 长度
+    dateFormat?: string; // 日期格式
+    fixCharacter?: string; // 固定字符
+    serialStartNo?: number; // 流水号起始值
+    serialStep?: number; // 流水号步长
+    cycleFlag?: boolean; // 是否循环
+    cycleMethod?: number; // 循环方式
+    remark?: string; // 备注
+  }
+}
+
+/** 查询编码规则分段详情 */
+export function getAutoCodePart(id: number) {
+  return requestClient.get<MesMdAutoCodePartApi.AutoCodePart>(
+    `/mes/md/auto-code-part/get?id=${id}`,
+  );
+}
+
+/** 查询编码规则分段列表 */
+export function getAutoCodePartListByRuleId(ruleId: number) {
+  return requestClient.get<MesMdAutoCodePartApi.AutoCodePart[]>(
+    '/mes/md/auto-code-part/list-by-rule-id',
+    { params: { ruleId } },
+  );
+}
+
+/** 新增编码规则分段 */
+export function createAutoCodePart(data: MesMdAutoCodePartApi.AutoCodePart) {
+  return requestClient.post('/mes/md/auto-code-part/create', data);
+}
+
+/** 修改编码规则分段 */
+export function updateAutoCodePart(data: MesMdAutoCodePartApi.AutoCodePart) {
+  return requestClient.put('/mes/md/auto-code-part/update', data);
+}
+
+/** 删除编码规则分段 */
+export function deleteAutoCodePart(id: number) {
+  return requestClient.delete(`/mes/md/auto-code-part/delete?id=${id}`);
+}
diff --git a/apps/web-ele/src/api/mes/md/autocode/rule/index.ts b/apps/web-ele/src/api/mes/md/autocode/rule/index.ts
new file mode 100644
index 000000000..d33e6e0fc
--- /dev/null
+++ b/apps/web-ele/src/api/mes/md/autocode/rule/index.ts
@@ -0,0 +1,57 @@
+import type { PageParam, PageResult } from '@vben/request';
+
+import { requestClient } from '#/api/request';
+
+export namespace MesMdAutoCodeRuleApi {
+  /** MES 编码规则 */
+  export interface AutoCodeRule {
+    id?: number; // 规则编号
+    code?: string; // 规则编码
+    name?: string; // 规则名称
+    description?: string; // 规则描述
+    maxLength?: number; // 最大长度
+    padded?: boolean; // 是否补齐
+    paddedChar?: string; // 补齐字符
+    paddedMethod?: number; // 补齐方式
+    status?: number; // 状态
+    remark?: string; // 备注
+    createTime?: Date; // 创建时间
+  }
+}
+
+/** 查询编码规则分页 */
+export function getAutoCodeRulePage(params: PageParam) {
+  return requestClient.get<PageResult<MesMdAutoCodeRuleApi.AutoCodeRule>>(
+    '/mes/md/auto-code-rule/page',
+    { params },
+  );
+}
+
+/** 查询编码规则详情 */
+export function getAutoCodeRule(id: number) {
+  return requestClient.get<MesMdAutoCodeRuleApi.AutoCodeRule>(
+    `/mes/md/auto-code-rule/get?id=${id}`,
+  );
+}
+
+/** 新增编码规则 */
+export function createAutoCodeRule(data: MesMdAutoCodeRuleApi.AutoCodeRule) {
+  return requestClient.post('/mes/md/auto-code-rule/create', data);
+}
+
+/** 修改编码规则 */
+export function updateAutoCodeRule(data: MesMdAutoCodeRuleApi.AutoCodeRule) {
+  return requestClient.put('/mes/md/auto-code-rule/update', data);
+}
+
+/** 删除编码规则 */
+export function deleteAutoCodeRule(id: number) {
+  return requestClient.delete(`/mes/md/auto-code-rule/delete?id=${id}`);
+}
+
+/** 导出编码规则 */
+export function exportAutoCodeRule(params: PageParam) {
+  return requestClient.download('/mes/md/auto-code-rule/export-excel', {
+    params,
+  });
+}
diff --git a/apps/web-ele/src/api/mes/wm/itemreceipt/index.ts b/apps/web-ele/src/api/mes/wm/itemreceipt/index.ts
new file mode 100644
index 000000000..d7086de99
--- /dev/null
+++ b/apps/web-ele/src/api/mes/wm/itemreceipt/index.ts
@@ -0,0 +1,34 @@
+import { requestClient } from '#/api/request';
+
+export namespace MesWmItemReceiptApi {
+  /** MES 采购入库单 */
+  export interface ItemReceipt {
+    id?: number; // 入库单编号
+    code?: string; // 入库单编码
+    name?: string; // 入库单名称
+    iqcId?: number; // 来料检验单编号
+    iqcCode?: string; // 来料检验单编码
+    noticeId?: number; // 到货通知单编号
+    noticeCode?: string; // 到货通知单编码
+    purchaseOrderCode?: string; // 采购订单号
+    vendorId?: number; // 供应商编号
+    vendorName?: string; // 供应商名称
+    warehouseId?: number; // 仓库编号
+    warehouseName?: string; // 仓库名称
+    locationId?: number; // 库区编号
+    locationName?: string; // 库区名称
+    areaId?: number; // 库位编号
+    areaName?: string; // 库位名称
+    receiptDate?: Date | number | string; // 入库日期
+    status?: number; // 状态
+    remark?: string; // 备注
+    createTime?: Date; // 创建时间
+  }
+}
+
+/** 查询采购入库单详情 */
+export function getItemReceipt(id: number) {
+  return requestClient.get<MesWmItemReceiptApi.ItemReceipt>(
+    `/mes/wm/item-receipt/get?id=${id}`,
+  );
+}
diff --git a/apps/web-ele/src/views/iot/ota/firmware/data.ts b/apps/web-ele/src/views/iot/ota/firmware/data.ts
index c3a854768..63f95018e 100644
--- a/apps/web-ele/src/views/iot/ota/firmware/data.ts
+++ b/apps/web-ele/src/views/iot/ota/firmware/data.ts
@@ -12,6 +12,14 @@ import { getRangePickerDefaultProps } from '#/utils';
 let productList: IotProductApi.Product[] = [];
 getSimpleProductList().then((data) => (productList = data));
 
+/** 根据产品 ID 取产品名称 */
+export function getProductName(productId?: number): string {
+  if (!productId) {
+    return '-';
+  }
+  return productList.find((p) => p.id === productId)?.name || '-';
+}
+
 /** 固件详情的描述字段 */
 export function useDetailSchema(): DescriptionItemSchema[] {
   return [
@@ -58,6 +66,10 @@ export function useFormSchema(): VbenFormSchema[] {
         placeholder: '请选择产品',
       },
       rules: 'required',
+      dependencies: {
+        triggerFields: ['id'],
+        show: (values) => !values.id,
+      },
     },
     {
       fieldName: 'version',
@@ -67,6 +79,10 @@ export function useFormSchema(): VbenFormSchema[] {
         placeholder: '请输入版本号',
       },
       rules: 'required',
+      dependencies: {
+        triggerFields: ['id'],
+        show: (values) => !values.id,
+      },
     },
     {
       fieldName: 'description',
@@ -88,6 +104,10 @@ export function useFormSchema(): VbenFormSchema[] {
         helpText: '支持上传 .bin、.hex、.zip 格式的固件文件，最大 50MB',
       },
       rules: 'required',
+      dependencies: {
+        triggerFields: ['id'],
+        show: (values) => !values.id,
+      },
     },
   ];
 }
@@ -131,7 +151,6 @@ export function useGridFormSchema(): VbenFormSchema[] {
 /** 列表的字段 */
 export function useGridColumns(): VxeTableGridOptions['columns'] {
   return [
-    { type: 'checkbox', width: 40 },
     {
       field: 'id',
       title: '固件编号',
@@ -156,8 +175,7 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
       field: 'productId',
       title: '所属产品',
       minWidth: 150,
-      formatter: ({ cellValue }) =>
-        productList.find((p) => p.id === cellValue)?.name || '-',
+      slots: { default: 'productName' },
     },
     {
       field: 'fileUrl',
diff --git a/apps/web-ele/src/views/iot/ota/firmware/index.vue b/apps/web-ele/src/views/iot/ota/firmware/index.vue
index e3479cfc1..8b98ae31b 100644
--- a/apps/web-ele/src/views/iot/ota/firmware/index.vue
+++ b/apps/web-ele/src/views/iot/ota/firmware/index.vue
@@ -13,7 +13,7 @@ import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
 import { deleteOtaFirmware, getOtaFirmwarePage } from '#/api/iot/ota/firmware';
 import { $t } from '#/locales';
 
-import { useGridColumns, useGridFormSchema } from './data';
+import { getProductName, useGridColumns, useGridFormSchema } from './data';
 import OtaFirmwareForm from './modules/form.vue';
 
 const { push } = useRouter();
@@ -57,6 +57,11 @@ function handleDetail(row: IoTOtaFirmwareApi.Firmware) {
   push({ name: 'IoTOtaFirmwareDetail', params: { id: row.id } });
 }
 
+/** 跳转到产品详情 */
+function handleOpenProductDetail(productId: number) {
+  push({ name: 'IoTProductDetail', params: { id: productId } });
+}
+
 const [Grid, gridApi] = useVbenVxeGrid({
   formOptions: {
     schema: useGridFormSchema(),
@@ -105,6 +110,17 @@ const [Grid, gridApi] = useVbenVxeGrid({
           ]"
         />
       </template>
+      <!-- 所属产品列：点击跳产品详情 -->
+      <template #productName="{ row }">
+        <a
+          v-if="row.productId"
+          class="cursor-pointer text-primary hover:underline"
+          @click="handleOpenProductDetail(row.productId)"
+        >
+          {{ getProductName(row.productId) }}
+        </a>
+        <span v-else class="text-gray-400">-</span>
+      </template>
       <!-- 固件文件列 -->
       <template #fileUrl="{ row }">
         <div
diff --git a/apps/web-ele/src/views/iot/ota/firmware/modules/form.vue b/apps/web-ele/src/views/iot/ota/firmware/modules/form.vue
index 1d09ff7cc..d4b14fee1 100644
--- a/apps/web-ele/src/views/iot/ota/firmware/modules/form.vue
+++ b/apps/web-ele/src/views/iot/ota/firmware/modules/form.vue
@@ -47,8 +47,15 @@ const [Modal, modalApi] = useVbenModal({
       return;
     }
     modalApi.lock();
-    // 提交表单
-    const data = (await formApi.getValues()) as IoTOtaFirmwareApi.Firmware;
+    // 提交表单：编辑态只提交 id / name / description，其它字段固定不变
+    const values = (await formApi.getValues()) as IoTOtaFirmwareApi.Firmware;
+    const data: IoTOtaFirmwareApi.Firmware = formData.value?.id
+      ? {
+          id: formData.value.id,
+          name: values.name,
+          description: values.description,
+        }
+      : values;
     try {
       await (formData.value?.id
         ? updateOtaFirmware(data)
diff --git a/apps/web-ele/src/views/mes/md/autocode/data.ts b/apps/web-ele/src/views/mes/md/autocode/data.ts
new file mode 100644
index 000000000..50eb09b59
--- /dev/null
+++ b/apps/web-ele/src/views/mes/md/autocode/data.ts
@@ -0,0 +1,472 @@
+import type { VbenFormSchema } from '#/adapter/form';
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesMdAutoCodePartApi } from '#/api/mes/md/autocode/part';
+import type { MesMdAutoCodeRuleApi } from '#/api/mes/md/autocode/rule';
+
+import { CommonStatusEnum, DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
+import { z } from '#/adapter/form';
+import { MesAutoCodePartTypeEnum } from '#/views/mes/utils/constants';
+
+/** 新增/修改编码规则的表单 */
+export function useFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'code',
+      label: '规则编码',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入规则编码',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'name',
+      label: '规则名称',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入规则名称',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'description',
+      label: '规则描述',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入规则描述',
+      },
+    },
+    {
+      fieldName: 'maxLength',
+      label: '最大长度',
+      component: 'InputNumber',
+      componentProps: {
+        class: '!w-full',
+        controlsPosition: 'right',
+        max: 100,
+        min: 1,
+        precision: 0,
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'padded',
+      label: '是否补齐',
+      component: 'RadioGroup',
+      componentProps: {
+        options: getDictOptions(DICT_TYPE.INFRA_BOOLEAN_STRING, 'boolean'),
+      },
+      rules: z.boolean().default(false),
+    },
+    {
+      fieldName: 'paddedChar',
+      label: '补齐字符',
+      component: 'Input',
+      componentProps: {
+        maxLength: 1,
+        placeholder: '请输入补齐字符',
+      },
+      dependencies: {
+        triggerFields: ['padded'],
+        show: (values) => values.padded === true,
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'paddedMethod',
+      label: '补齐方式',
+      component: 'RadioGroup',
+      componentProps: {
+        options: getDictOptions(
+          DICT_TYPE.MES_MD_AUTO_CODE_PADDED_METHOD,
+          'number',
+        ),
+      },
+      dependencies: {
+        triggerFields: ['padded'],
+        show: (values) => values.padded === true,
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'status',
+      label: '状态',
+      component: 'RadioGroup',
+      componentProps: {
+        options: getDictOptions(DICT_TYPE.COMMON_STATUS, 'number'),
+      },
+      rules: z.number().default(CommonStatusEnum.ENABLE),
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入备注',
+        rows: 3,
+      },
+    },
+  ];
+}
+
+/** 列表的搜索表单 */
+export function useGridFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'code',
+      label: '规则编码',
+      component: 'Input',
+      componentProps: {
+        clearable: true,
+        placeholder: '请输入规则编码',
+      },
+    },
+    {
+      fieldName: 'name',
+      label: '规则名称',
+      component: 'Input',
+      componentProps: {
+        clearable: true,
+        placeholder: '请输入规则名称',
+      },
+    },
+    {
+      fieldName: 'status',
+      label: '状态',
+      component: 'Select',
+      componentProps: {
+        clearable: true,
+        options: getDictOptions(DICT_TYPE.COMMON_STATUS, 'number'),
+        placeholder: '请选择状态',
+      },
+    },
+  ];
+}
+
+/** 列表的字段 */
+export function useGridColumns(): VxeTableGridOptions<MesMdAutoCodeRuleApi.AutoCodeRule>['columns'] {
+  return [
+    {
+      field: 'code',
+      title: '规则编码',
+      width: 150,
+    },
+    {
+      field: 'name',
+      title: '规则名称',
+      width: 200,
+    },
+    {
+      field: 'description',
+      title: '规则描述',
+      minWidth: 180,
+    },
+    {
+      field: 'maxLength',
+      title: '最大长度',
+      width: 100,
+      align: 'center',
+    },
+    {
+      field: 'padded',
+      title: '是否补齐',
+      width: 100,
+      align: 'center',
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.INFRA_BOOLEAN_STRING },
+      },
+    },
+    {
+      field: 'status',
+      title: '状态',
+      width: 100,
+      align: 'center',
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.COMMON_STATUS },
+      },
+    },
+    {
+      field: 'remark',
+      title: '备注',
+      minWidth: 160,
+    },
+    {
+      field: 'createTime',
+      title: '创建时间',
+      width: 180,
+      formatter: 'formatDateTime',
+    },
+    {
+      title: '操作',
+      width: 150,
+      fixed: 'right',
+      slots: { default: 'actions' },
+    },
+  ];
+}
+
+/** 新增/修改编码规则分段的表单 */
+export function usePartFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'ruleId',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'sort',
+      label: '分段排序',
+      component: 'InputNumber',
+      componentProps: {
+        class: '!w-full',
+        controlsPosition: 'right',
+        min: 1,
+        precision: 0,
+      },
+      rules: z.number().default(1),
+    },
+    {
+      fieldName: 'length',
+      label: '分段长度',
+      component: 'InputNumber',
+      componentProps: {
+        class: '!w-full',
+        controlsPosition: 'right',
+        max: 50,
+        min: 1,
+        precision: 0,
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'type',
+      label: '分段类型',
+      component: 'Select',
+      componentProps: {
+        clearable: true,
+        options: getDictOptions(
+          DICT_TYPE.MES_MD_AUTO_CODE_PART_TYPE,
+          'number',
+        ),
+        placeholder: '请选择分段类型',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'dateFormat',
+      label: '日期格式',
+      component: 'Select',
+      componentProps: {
+        clearable: true,
+        options: [
+          { label: 'yyyy', value: 'yyyy' },
+          { label: 'yyyyMM', value: 'yyyyMM' },
+          { label: 'yyyyMMdd', value: 'yyyyMMdd' },
+          { label: 'yyyyMMddHH', value: 'yyyyMMddHH' },
+          { label: 'yyyyMMddHHmm', value: 'yyyyMMddHHmm' },
+        ],
+        placeholder: '请选择日期格式',
+      },
+      dependencies: {
+        triggerFields: ['type'],
+        show: (values) => values.type === MesAutoCodePartTypeEnum.DATE,
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'fixCharacter',
+      label: '固定字符',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入固定字符',
+      },
+      dependencies: {
+        triggerFields: ['type'],
+        show: (values) => values.type === MesAutoCodePartTypeEnum.FIX,
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'serialStartNo',
+      label: '流水号起始值',
+      component: 'InputNumber',
+      componentProps: {
+        class: '!w-full',
+        controlsPosition: 'right',
+        min: 1,
+        precision: 0,
+      },
+      dependencies: {
+        triggerFields: ['type'],
+        show: (values) => values.type === MesAutoCodePartTypeEnum.SERIAL,
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'serialStep',
+      label: '流水号步长',
+      component: 'InputNumber',
+      componentProps: {
+        class: '!w-full',
+        controlsPosition: 'right',
+        min: 1,
+        precision: 0,
+      },
+      dependencies: {
+        triggerFields: ['type'],
+        show: (values) => values.type === MesAutoCodePartTypeEnum.SERIAL,
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'cycleFlag',
+      label: '是否循环',
+      component: 'Switch',
+      componentProps: {
+        activeText: '是',
+        inactiveText: '否',
+        inlinePrompt: true,
+      },
+      dependencies: {
+        triggerFields: ['type'],
+        show: (values) => values.type === MesAutoCodePartTypeEnum.SERIAL,
+      },
+      rules: z.boolean().default(false),
+    },
+    {
+      fieldName: 'cycleMethod',
+      label: '循环方式',
+      component: 'Select',
+      componentProps: {
+        clearable: true,
+        options: getDictOptions(
+          DICT_TYPE.MES_MD_AUTO_CODE_CYCLE_METHOD,
+          'number',
+        ),
+        placeholder: '请选择循环方式',
+      },
+      dependencies: {
+        triggerFields: ['type', 'cycleFlag'],
+        show: (values) =>
+          values.type === MesAutoCodePartTypeEnum.SERIAL &&
+          values.cycleFlag === true,
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入备注',
+        rows: 3,
+      },
+    },
+  ];
+}
+
+/** 编码规则分段的字段 */
+export function usePartGridColumns(): VxeTableGridOptions<MesMdAutoCodePartApi.AutoCodePart>['columns'] {
+  return [
+    {
+      field: 'sort',
+      title: '分段排序',
+      width: 90,
+      align: 'center',
+    },
+    {
+      field: 'type',
+      title: '分段类型',
+      width: 120,
+      align: 'center',
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_MD_AUTO_CODE_PART_TYPE },
+      },
+    },
+    {
+      field: 'length',
+      title: '分段长度',
+      width: 90,
+      align: 'center',
+    },
+    {
+      field: 'dateFormat',
+      title: '日期格式',
+      width: 150,
+      align: 'center',
+    },
+    {
+      field: 'fixCharacter',
+      title: '固定字符',
+      width: 120,
+      align: 'center',
+    },
+    {
+      field: 'serialStartNo',
+      title: '流水号起始',
+      width: 110,
+      align: 'center',
+    },
+    {
+      field: 'serialStep',
+      title: '流水号步长',
+      width: 110,
+      align: 'center',
+    },
+    {
+      field: 'cycleFlag',
+      title: '是否循环',
+      width: 100,
+      align: 'center',
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.INFRA_BOOLEAN_STRING },
+      },
+    },
+    {
+      field: 'cycleMethod',
+      title: '循环方式',
+      width: 120,
+      align: 'center',
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_MD_AUTO_CODE_CYCLE_METHOD },
+      },
+    },
+    {
+      field: 'remark',
+      title: '备注',
+      minWidth: 160,
+    },
+    {
+      title: '操作',
+      width: 130,
+      fixed: 'right',
+      slots: { default: 'actions' },
+    },
+  ];
+}
diff --git a/apps/web-ele/src/views/mes/md/autocode/index.vue b/apps/web-ele/src/views/mes/md/autocode/index.vue
new file mode 100644
index 000000000..abf27be5a
--- /dev/null
+++ b/apps/web-ele/src/views/mes/md/autocode/index.vue
@@ -0,0 +1,150 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesMdAutoCodeRuleApi } from '#/api/mes/md/autocode/rule';
+
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
+import { downloadFileFromBlobPart } from '@vben/utils';
+
+import { ElLoading, ElMessage } from 'element-plus';
+
+import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import {
+  deleteAutoCodeRule,
+  exportAutoCodeRule,
+  getAutoCodeRulePage,
+} from '#/api/mes/md/autocode/rule';
+import { $t } from '#/locales';
+
+import { useGridColumns, useGridFormSchema } from './data';
+import Form from './modules/form.vue';
+
+const [FormModal, formModalApi] = useVbenModal({
+  connectedComponent: Form,
+  destroyOnClose: true,
+});
+
+/** 刷新表格 */
+function handleRefresh() {
+  gridApi.query();
+}
+
+/** 创建编码规则 */
+function handleCreate() {
+  formModalApi.setData(null).open();
+}
+
+/** 编辑编码规则 */
+function handleEdit(row: MesMdAutoCodeRuleApi.AutoCodeRule) {
+  formModalApi.setData(row).open();
+}
+
+/** 删除编码规则 */
+async function handleDelete(row: MesMdAutoCodeRuleApi.AutoCodeRule) {
+  const loadingInstance = ElLoading.service({
+    text: $t('ui.actionMessage.deleting', [row.name]),
+  });
+  try {
+    await deleteAutoCodeRule(row.id!);
+    ElMessage.success($t('ui.actionMessage.deleteSuccess', [row.name]));
+    handleRefresh();
+  } finally {
+    loadingInstance.close();
+  }
+}
+
+/** 导出编码规则 */
+async function handleExport() {
+  const data = await exportAutoCodeRule(await gridApi.formApi.getValues());
+  downloadFileFromBlobPart({ fileName: '编码规则.xls', source: data });
+}
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  formOptions: {
+    schema: useGridFormSchema(),
+  },
+  gridOptions: {
+    columns: useGridColumns(),
+    height: 'auto',
+    keepSource: true,
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }, formValues) => {
+          return await getAutoCodeRulePage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            ...formValues,
+          });
+        },
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+  } as VxeTableGridOptions<MesMdAutoCodeRuleApi.AutoCodeRule>,
+});
+</script>
+
+<template>
+  <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【基础】编码规则"
+        url="https://doc.iocoder.cn/mes/md/autocode/"
+      />
+    </template>
+
+    <FormModal @success="handleRefresh" />
+    <Grid table-title="编码规则列表">
+      <template #toolbar-tools>
+        <TableAction
+          :actions="[
+            {
+              label: $t('ui.actionTitle.create', ['编码规则']),
+              type: 'primary',
+              icon: ACTION_ICON.ADD,
+              auth: ['mes:auto-code-rule:create'],
+              onClick: handleCreate,
+            },
+            {
+              label: $t('ui.actionTitle.export'),
+              type: 'primary',
+              icon: ACTION_ICON.DOWNLOAD,
+              auth: ['mes:auto-code-rule:export'],
+              onClick: handleExport,
+            },
+          ]"
+        />
+      </template>
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: $t('common.edit'),
+              type: 'primary',
+              link: true,
+              icon: ACTION_ICON.EDIT,
+              auth: ['mes:auto-code-rule:update'],
+              onClick: handleEdit.bind(null, row),
+            },
+            {
+              label: $t('common.delete'),
+              type: 'danger',
+              link: true,
+              icon: ACTION_ICON.DELETE,
+              auth: ['mes:auto-code-rule:delete'],
+              popConfirm: {
+                title: $t('ui.actionMessage.deleteConfirm', [row.name]),
+                confirm: handleDelete.bind(null, row),
+              },
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+  </Page>
+</template>
diff --git a/apps/web-ele/src/views/mes/md/autocode/modules/form.vue b/apps/web-ele/src/views/mes/md/autocode/modules/form.vue
new file mode 100644
index 000000000..e99f2b3ee
--- /dev/null
+++ b/apps/web-ele/src/views/mes/md/autocode/modules/form.vue
@@ -0,0 +1,102 @@
+<script lang="ts" setup>
+import type { MesMdAutoCodeRuleApi } from '#/api/mes/md/autocode/rule';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { ElMessage } from 'element-plus';
+
+import { useVbenForm } from '#/adapter/form';
+import {
+  createAutoCodeRule,
+  getAutoCodeRule,
+  updateAutoCodeRule,
+} from '#/api/mes/md/autocode/rule';
+import { $t } from '#/locales';
+
+import { useFormSchema } from '../data';
+import PartList from './part-list.vue';
+
+const emit = defineEmits(['success']);
+const formData = ref<MesMdAutoCodeRuleApi.AutoCodeRule>();
+const getTitle = computed(() => {
+  return formData.value?.id
+    ? $t('ui.actionTitle.edit', ['编码规则'])
+    : $t('ui.actionTitle.create', ['编码规则']);
+});
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-2',
+    labelWidth: 120,
+  },
+  layout: 'horizontal',
+  schema: useFormSchema(),
+  showDefaultActions: false,
+});
+
+/** 清理未启用补齐时的补齐字段 */
+function normalizeRuleData(data: MesMdAutoCodeRuleApi.AutoCodeRule) {
+  if (!data.padded) {
+    data.paddedChar = undefined;
+    data.paddedMethod = undefined;
+  }
+  return data;
+}
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    const data = normalizeRuleData(
+      (await formApi.getValues()) as MesMdAutoCodeRuleApi.AutoCodeRule,
+    );
+    try {
+      await (formData.value?.id
+        ? updateAutoCodeRule(data)
+        : createAutoCodeRule(data));
+      await modalApi.close();
+      emit('success');
+      ElMessage.success($t('ui.actionMessage.operationSuccess'));
+    } finally {
+      modalApi.unlock();
+    }
+  },
+  async onOpenChange(isOpen: boolean) {
+    if (!isOpen) {
+      formData.value = undefined;
+      return;
+    }
+    await formApi.resetForm();
+    const data = modalApi.getData<MesMdAutoCodeRuleApi.AutoCodeRule>();
+    if (!data?.id) {
+      return;
+    }
+    modalApi.lock();
+    try {
+      formData.value = await getAutoCodeRule(data.id);
+      await formApi.setValues(formData.value);
+    } finally {
+      modalApi.unlock();
+    }
+  },
+});
+</script>
+
+<template>
+  <Modal :title="getTitle" class="w-3/5">
+    <Form class="mx-4" />
+    <template v-if="formData?.id">
+      <div class="mx-4 mt-4">
+        <PartList :rule-id="formData.id" />
+      </div>
+    </template>
+  </Modal>
+</template>
diff --git a/apps/web-ele/src/views/mes/md/autocode/modules/part-form.vue b/apps/web-ele/src/views/mes/md/autocode/modules/part-form.vue
new file mode 100644
index 000000000..87da800ba
--- /dev/null
+++ b/apps/web-ele/src/views/mes/md/autocode/modules/part-form.vue
@@ -0,0 +1,115 @@
+<script lang="ts" setup>
+import type { MesMdAutoCodePartApi } from '#/api/mes/md/autocode/part';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { ElMessage } from 'element-plus';
+
+import { useVbenForm } from '#/adapter/form';
+import {
+  createAutoCodePart,
+  getAutoCodePart,
+  updateAutoCodePart,
+} from '#/api/mes/md/autocode/part';
+import { $t } from '#/locales';
+import { MesAutoCodePartTypeEnum } from '#/views/mes/utils/constants';
+
+import { usePartFormSchema } from '../data';
+
+const emit = defineEmits(['success']);
+const formData = ref<MesMdAutoCodePartApi.AutoCodePart>();
+const getTitle = computed(() => {
+  return formData.value?.id
+    ? $t('ui.actionTitle.edit', ['规则分段'])
+    : $t('ui.actionTitle.create', ['规则分段']);
+});
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-2',
+    labelWidth: 120,
+  },
+  layout: 'horizontal',
+  schema: usePartFormSchema(),
+  showDefaultActions: false,
+});
+
+/** 清理当前分段类型不需要的字段 */
+function normalizePartData(data: MesMdAutoCodePartApi.AutoCodePart) {
+  if (data.type !== MesAutoCodePartTypeEnum.DATE) {
+    data.dateFormat = undefined;
+  }
+  if (data.type !== MesAutoCodePartTypeEnum.FIX) {
+    data.fixCharacter = undefined;
+  }
+  if (data.type !== MesAutoCodePartTypeEnum.SERIAL) {
+    data.serialStartNo = undefined;
+    data.serialStep = undefined;
+    data.cycleFlag = false;
+    data.cycleMethod = undefined;
+  } else if (!data.cycleFlag) {
+    data.cycleMethod = undefined;
+  }
+  return data;
+}
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    const data = normalizePartData(
+      (await formApi.getValues()) as MesMdAutoCodePartApi.AutoCodePart,
+    );
+    try {
+      await (formData.value?.id
+        ? updateAutoCodePart(data)
+        : createAutoCodePart(data));
+      await modalApi.close();
+      emit('success');
+      ElMessage.success($t('ui.actionMessage.operationSuccess'));
+    } finally {
+      modalApi.unlock();
+    }
+  },
+  async onOpenChange(isOpen: boolean) {
+    if (!isOpen) {
+      formData.value = undefined;
+      return;
+    }
+    await formApi.resetForm();
+    const data = modalApi.getData<{
+      id?: number;
+      maxSort?: number;
+      ruleId: number;
+    }>();
+    if (!data?.id) {
+      await formApi.setValues({
+        ruleId: data.ruleId,
+        sort: (data.maxSort || 0) + 1,
+      });
+      return;
+    }
+    modalApi.lock();
+    try {
+      formData.value = await getAutoCodePart(data.id);
+      await formApi.setValues(formData.value);
+    } finally {
+      modalApi.unlock();
+    }
+  },
+});
+</script>
+
+<template>
+  <Modal :title="getTitle" class="w-1/3">
+    <Form class="mx-4" />
+  </Modal>
+</template>
diff --git a/apps/web-ele/src/views/mes/md/autocode/modules/part-list.vue b/apps/web-ele/src/views/mes/md/autocode/modules/part-list.vue
new file mode 100644
index 000000000..87775ec2a
--- /dev/null
+++ b/apps/web-ele/src/views/mes/md/autocode/modules/part-list.vue
@@ -0,0 +1,132 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesMdAutoCodePartApi } from '#/api/mes/md/autocode/part';
+
+import { ref, watch } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { ElMessage } from 'element-plus';
+
+import { TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import {
+  deleteAutoCodePart,
+  getAutoCodePartListByRuleId,
+} from '#/api/mes/md/autocode/part';
+import { $t } from '#/locales';
+
+import { usePartGridColumns } from '../data';
+import PartForm from './part-form.vue';
+
+const props = defineProps<{
+  ruleId: number;
+}>();
+
+const list = ref<MesMdAutoCodePartApi.AutoCodePart[]>([]);
+
+const [PartFormModal, partFormModalApi] = useVbenModal({
+  connectedComponent: PartForm,
+  destroyOnClose: true,
+});
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    autoResize: true,
+    border: true,
+    columns: usePartGridColumns(),
+    data: list.value,
+    minHeight: 240,
+    pagerConfig: {
+      enabled: false,
+    },
+    rowConfig: {
+      isHover: true,
+      keyField: 'id',
+    },
+    showOverflow: true,
+    toolbarConfig: {
+      enabled: false,
+    },
+  } as VxeTableGridOptions<MesMdAutoCodePartApi.AutoCodePart>,
+});
+
+/** 加载编码规则分段 */
+async function getList() {
+  gridApi.setLoading(true);
+  try {
+    list.value = await getAutoCodePartListByRuleId(props.ruleId);
+    gridApi.setGridOptions({ data: list.value });
+  } finally {
+    gridApi.setLoading(false);
+  }
+}
+
+/** 创建编码规则分段 */
+function handleCreate() {
+  const maxSort =
+    list.value.length > 0
+      ? Math.max(...list.value.map((item) => item.sort || 0))
+      : 0;
+  partFormModalApi.setData({ maxSort, ruleId: props.ruleId }).open();
+}
+
+/** 编辑编码规则分段 */
+function handleEdit(row: MesMdAutoCodePartApi.AutoCodePart) {
+  partFormModalApi.setData({ id: row.id, ruleId: props.ruleId }).open();
+}
+
+/** 删除编码规则分段 */
+async function handleDelete(row: MesMdAutoCodePartApi.AutoCodePart) {
+  await deleteAutoCodePart(row.id!);
+  ElMessage.success($t('ui.actionMessage.deleteSuccess', ['编码规则分段']));
+  await getList();
+}
+
+watch(
+  () => props.ruleId,
+  (value) => {
+    if (value) {
+      getList();
+    }
+  },
+  { immediate: true },
+);
+</script>
+
+<template>
+  <PartFormModal @success="getList" />
+  <div class="mb-3 flex items-center justify-start">
+    <TableAction
+      :actions="[
+        {
+          label: $t('ui.actionTitle.create', ['分段']),
+          type: 'primary',
+          onClick: handleCreate,
+        },
+      ]"
+    />
+  </div>
+  <Grid class="w-full" table-title="规则组成">
+    <template #actions="{ row }">
+      <TableAction
+        :actions="[
+          {
+            label: $t('common.edit'),
+            type: 'primary',
+            link: true,
+            onClick: handleEdit.bind(null, row),
+          },
+          {
+            label: $t('common.delete'),
+            type: 'danger',
+            link: true,
+            popConfirm: {
+              title: $t('ui.actionMessage.deleteConfirm', ['编码规则分段']),
+              confirm: handleDelete.bind(null, row),
+            },
+          },
+        ]"
+      />
+    </template>
+  </Grid>
+</template>
diff --git a/apps/web-ele/src/views/mes/md/item/components/index.ts b/apps/web-ele/src/views/mes/md/item/components/index.ts
index e5aa3ce08..348ae8798 100644
--- a/apps/web-ele/src/views/mes/md/item/components/index.ts
+++ b/apps/web-ele/src/views/mes/md/item/components/index.ts
@@ -1,2 +1,4 @@
 export { default as MdItemSelectDialog } from './md-item-select-dialog.vue';
 export { default as MdItemSelect } from './md-item-select.vue';
+export { default as MdProductBomSelectDialog } from './md-product-bom-select-dialog.vue';
+export { default as MdProductBomSelect } from './md-product-bom-select.vue';
diff --git a/apps/web-ele/src/views/mes/md/item/components/md-product-bom-select-dialog.vue b/apps/web-ele/src/views/mes/md/item/components/md-product-bom-select-dialog.vue
new file mode 100644
index 000000000..0938dc898
--- /dev/null
+++ b/apps/web-ele/src/views/mes/md/item/components/md-product-bom-select-dialog.vue
@@ -0,0 +1,119 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesMdProductBomApi } from '#/api/mes/md/item/productBom';
+
+import { nextTick, ref } from 'vue';
+
+import { ElButton, ElDialog, ElMessage } from 'element-plus';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { getProductBomListByItemId } from '#/api/mes/md/item/productBom';
+
+import { useProductBomGridColumns } from '../data';
+
+defineOptions({ name: 'MdProductBomSelectDialog' });
+
+const emit = defineEmits<{
+  selected: [row: MesMdProductBomApi.ProductBom];
+}>();
+
+const open = ref(false); // 弹窗是否打开
+const list = ref<MesMdProductBomApi.ProductBom[]>([]); // BOM 子物料列表
+const selectedRow = ref<MesMdProductBomApi.ProductBom>(); // 当前选中的 BOM 行
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    border: true,
+    columns: [
+      { type: 'radio', width: 55, align: 'center' },
+      ...(useProductBomGridColumns(true) || []),
+    ],
+    data: list.value,
+    height: 500,
+    keepSource: true,
+    pagerConfig: {
+      enabled: false,
+    },
+    radioConfig: {
+      highlight: true,
+      trigger: 'row',
+    },
+    rowConfig: {
+      keyField: 'bomItemId',
+      isHover: true,
+    },
+    showOverflow: true,
+    toolbarConfig: {
+      enabled: false,
+    },
+  } as VxeTableGridOptions<MesMdProductBomApi.ProductBom>,
+  gridEvents: {
+    cellDblclick: ({ row }: { row: MesMdProductBomApi.ProductBom }) => {
+      selectedRow.value = row;
+      gridApi.grid.setRadioRow(row);
+      handleConfirm();
+    },
+    radioChange: ({ row }: { row: MesMdProductBomApi.ProductBom }) => {
+      selectedRow.value = row;
+    },
+  },
+});
+
+/** 打开 BOM 物料选择弹窗 */
+async function openModal(itemId: number, selectedBomItemId?: number) {
+  open.value = true;
+  selectedRow.value = undefined;
+  gridApi.setLoading(true);
+  try {
+    list.value = await getProductBomListByItemId(itemId);
+    gridApi.setGridOptions({ data: list.value });
+    await nextTick();
+    if (selectedBomItemId != null) {
+      const match = list.value.find(
+        (row) => row.bomItemId === selectedBomItemId,
+      );
+      if (match) {
+        selectedRow.value = match;
+        gridApi.grid.setRadioRow(match);
+      }
+    }
+  } finally {
+    gridApi.setLoading(false);
+  }
+}
+
+/** 关闭 BOM 物料选择弹窗 */
+async function closeModal() {
+  open.value = false;
+  selectedRow.value = undefined;
+  await gridApi.grid.clearRadioRow();
+}
+
+/** 确认选择 BOM 物料 */
+function handleConfirm() {
+  if (!selectedRow.value) {
+    ElMessage.warning('请选择一条数据');
+    return;
+  }
+  emit('selected', selectedRow.value);
+  open.value = false;
+}
+
+defineExpose({ open: openModal });
+</script>
+
+<template>
+  <ElDialog
+    v-model="open"
+    title="产品 BOM 物料选择"
+    width="800px"
+    destroy-on-close
+    @close="closeModal"
+  >
+    <Grid table-title="BOM 子物料列表" />
+    <template #footer>
+      <ElButton @click="closeModal">取消</ElButton>
+      <ElButton type="primary" @click="handleConfirm">确定</ElButton>
+    </template>
+  </ElDialog>
+</template>
diff --git a/apps/web-ele/src/views/mes/md/item/components/md-product-bom-select.vue b/apps/web-ele/src/views/mes/md/item/components/md-product-bom-select.vue
new file mode 100644
index 000000000..c400b15b2
--- /dev/null
+++ b/apps/web-ele/src/views/mes/md/item/components/md-product-bom-select.vue
@@ -0,0 +1,146 @@
+<script lang="ts" setup>
+import type { MesMdProductBomApi } from '#/api/mes/md/item/productBom';
+
+import { computed, ref, useAttrs, watch } from 'vue';
+
+import { CircleX, Search } from '@vben/icons';
+
+import { ElInput, ElTooltip } from 'element-plus';
+
+import { getProductBomListByItemId } from '#/api/mes/md/item/productBom';
+
+import MdProductBomSelectDialog from './md-product-bom-select-dialog.vue';
+
+defineOptions({ name: 'MdProductBomSelect', inheritAttrs: false });
+
+const props = withDefaults(
+  defineProps<{
+    clearable?: boolean;
+    disabled?: boolean;
+    itemId?: number;
+    modelValue?: number;
+    placeholder?: string;
+  }>(),
+  {
+    clearable: true,
+    disabled: false,
+    itemId: undefined,
+    modelValue: undefined,
+    placeholder: '请选择 BOM 物料',
+  },
+);
+const emit = defineEmits<{
+  change: [bom: MesMdProductBomApi.ProductBom | undefined];
+  'update:modelValue': [value: number | undefined];
+}>();
+const attrs = useAttrs(); // 透传属性
+const dialogRef = ref<InstanceType<typeof MdProductBomSelectDialog>>(); // BOM 物料选择弹窗
+const hovering = ref(false); // 是否悬停
+const selectedBom = ref<MesMdProductBomApi.ProductBom>(); // 当前选中的 BOM 物料
+
+const displayLabel = computed(() => selectedBom.value?.bomItemName ?? ''); // 选择器展示名称
+const showClear = computed( // 是否显示清空图标
+  () =>
+    props.clearable &&
+    !props.disabled &&
+    hovering.value &&
+    props.modelValue != null,
+);
+
+/** 根据 BOM 子物料编号回显选择器 */
+async function resolveBomById(bomItemId: number | undefined) {
+  if (bomItemId == null || props.itemId == null) {
+    selectedBom.value = undefined;
+    return;
+  }
+  if (selectedBom.value?.bomItemId === bomItemId) {
+    return;
+  }
+  try {
+    const list = await getProductBomListByItemId(props.itemId);
+    selectedBom.value = list.find((item) => item.bomItemId === bomItemId);
+  } catch (error) {
+    console.error('[MdProductBomSelect] resolveBomById failed:', error);
+  }
+}
+
+watch(
+  () => props.modelValue,
+  (value) => {
+    resolveBomById(value);
+  },
+  { immediate: true },
+);
+
+watch(
+  () => props.itemId,
+  () => {
+    selectedBom.value = undefined;
+    emit('update:modelValue', undefined);
+    emit('change', undefined);
+  },
+);
+
+/** 清空已选 BOM 物料 */
+function clearSelected() {
+  selectedBom.value = undefined;
+  emit('update:modelValue', undefined);
+  emit('change', undefined);
+}
+
+/** 打开 BOM 物料选择弹窗 */
+function handleClick(event: MouseEvent) {
+  if (props.disabled || props.itemId == null) {
+    return;
+  }
+  const target = event.target as HTMLElement;
+  if (showClear.value && target.closest('.el-input__suffix')) {
+    event.stopPropagation();
+    clearSelected();
+    return;
+  }
+  dialogRef.value?.open(props.itemId, props.modelValue);
+}
+
+/** 回填选中的 BOM 物料 */
+function handleSelected(row: MesMdProductBomApi.ProductBom) {
+  selectedBom.value = row;
+  emit('update:modelValue', row.bomItemId);
+  emit('change', row);
+}
+</script>
+
+<template>
+  <div
+    v-bind="attrs"
+    class="w-full"
+    :class="disabled ? 'cursor-not-allowed' : 'cursor-pointer'"
+    @click="handleClick"
+    @mouseenter="hovering = true"
+    @mouseleave="hovering = false"
+  >
+    <ElTooltip :disabled="!selectedBom" placement="top" :show-after="500">
+      <template #content>
+        <div v-if="selectedBom" class="leading-6">
+          <div>编码：{{ selectedBom.bomItemCode || '-' }}</div>
+          <div>名称：{{ selectedBom.bomItemName || '-' }}</div>
+          <div>规格：{{ selectedBom.bomItemSpecification || '-' }}</div>
+          <div>单位：{{ selectedBom.unitMeasureName || '-' }}</div>
+          <div>用量比例：{{ selectedBom.quantity ?? '-' }}</div>
+        </div>
+      </template>
+      <ElInput
+        :disabled="disabled"
+        :model-value="displayLabel"
+        :placeholder="placeholder"
+        readonly
+      >
+        <template #suffix>
+          <CircleX v-if="showClear" class="size-4" />
+          <Search v-else class="size-4" />
+        </template>
+      </ElInput>
+    </ElTooltip>
+  </div>
+  <MdProductBomSelectDialog ref="dialogRef" @selected="handleSelected" />
+</template>
diff --git a/apps/web-ele/src/views/mes/md/vendor/modules/item-receipt-detail.vue b/apps/web-ele/src/views/mes/md/vendor/modules/item-receipt-detail.vue
new file mode 100644
index 000000000..8b06d863a
--- /dev/null
+++ b/apps/web-ele/src/views/mes/md/vendor/modules/item-receipt-detail.vue
@@ -0,0 +1,141 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesWmItemReceiptApi } from '#/api/mes/wm/itemreceipt';
+import type { MesWmItemReceiptLineApi } from '#/api/mes/wm/itemreceipt/line';
+
+import { nextTick, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+import { formatDateTime } from '@vben/utils';
+
+import {
+  ElDescriptions,
+  ElDescriptionsItem,
+} from 'element-plus';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { getItemReceipt } from '#/api/mes/wm/itemreceipt';
+import { getItemReceiptLinePage } from '#/api/mes/wm/itemreceipt/line';
+
+const loading = ref(false); // 详情加载状态
+const receiptId = ref<number>(); // 当前采购入库单编号
+const receipt = ref<MesWmItemReceiptApi.ItemReceipt>(); // 当前采购入库单详情
+
+/** 格式化空值 */
+function formatEmpty(value: null | number | string | undefined) {
+  return value ?? '-';
+}
+
+/** 格式化日期 */
+function formatDate(value: Date | number | string | undefined) {
+  return value ? (formatDateTime(value) as string) : '-';
+}
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    columns: [
+      { field: 'itemCode', title: '物料编码', width: 140 },
+      { field: 'itemName', title: '物料名称', minWidth: 150 },
+      { field: 'specification', title: '规格型号', minWidth: 140 },
+      { field: 'unitMeasureName', title: '单位', width: 100 },
+      { field: 'receivedQuantity', title: '入库数量', width: 120 },
+      { field: 'batchCode', title: '批次号', minWidth: 140 },
+    ],
+    height: 280,
+    keepSource: true,
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }) => {
+          if (!receiptId.value) {
+            return { list: [], total: 0 };
+          }
+          return await getItemReceiptLinePage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            receiptId: receiptId.value,
+          });
+        },
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+    },
+  } as VxeTableGridOptions<MesWmItemReceiptLineApi.ItemReceiptLine>,
+});
+
+const [Modal, modalApi] = useVbenModal({
+  async onOpenChange(isOpen: boolean) {
+    if (!isOpen) {
+      receiptId.value = undefined;
+      receipt.value = undefined;
+      return;
+    }
+    const data = modalApi.getData<{ id?: number }>();
+    if (!data?.id) {
+      return;
+    }
+    receiptId.value = data.id;
+    loading.value = true;
+    modalApi.lock();
+    try {
+      receipt.value = await getItemReceipt(data.id);
+      await nextTick();
+      await gridApi.query();
+    } finally {
+      loading.value = false;
+      modalApi.unlock();
+    }
+  },
+});
+</script>
+
+<template>
+  <Modal
+    title="采购入库单详情"
+    class="w-[900px]"
+    :show-cancel-button="false"
+    :show-confirm-button="false"
+  >
+    <div v-loading="loading">
+      <ElDescriptions border size="small" :column="3">
+        <ElDescriptionsItem label="入库单编号">
+          {{ formatEmpty(receipt?.code) }}
+        </ElDescriptionsItem>
+        <ElDescriptionsItem label="入库单名称">
+          {{ formatEmpty(receipt?.name) }}
+        </ElDescriptionsItem>
+        <ElDescriptionsItem label="入库日期">
+          {{ formatDate(receipt?.receiptDate) }}
+        </ElDescriptionsItem>
+        <ElDescriptionsItem label="到货通知单">
+          {{ formatEmpty(receipt?.noticeCode) }}
+        </ElDescriptionsItem>
+        <ElDescriptionsItem label="供应商">
+          {{ formatEmpty(receipt?.vendorName) }}
+        </ElDescriptionsItem>
+        <ElDescriptionsItem label="采购订单号">
+          {{ formatEmpty(receipt?.purchaseOrderCode) }}
+        </ElDescriptionsItem>
+        <ElDescriptionsItem label="仓库">
+          {{ formatEmpty(receipt?.warehouseName) }}
+        </ElDescriptionsItem>
+        <ElDescriptionsItem label="库区">
+          {{ formatEmpty(receipt?.locationName) }}
+        </ElDescriptionsItem>
+        <ElDescriptionsItem label="库位">
+          {{ formatEmpty(receipt?.areaName) }}
+        </ElDescriptionsItem>
+        <ElDescriptionsItem label="备注" :span="3">
+          {{ formatEmpty(receipt?.remark) }}
+        </ElDescriptionsItem>
+      </ElDescriptions>
+      <div class="mt-4">
+        <Grid table-title="入库物料" />
+      </div>
+    </div>
+  </Modal>
+</template>
diff --git a/apps/web-ele/src/views/mes/md/vendor/modules/item-receipt-list.vue b/apps/web-ele/src/views/mes/md/vendor/modules/item-receipt-list.vue
index 86635ab07..fbc40045f 100644
--- a/apps/web-ele/src/views/mes/md/vendor/modules/item-receipt-list.vue
+++ b/apps/web-ele/src/views/mes/md/vendor/modules/item-receipt-list.vue
@@ -2,17 +2,40 @@
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
 import type { MesWmItemReceiptLineApi } from '#/api/mes/wm/itemreceipt/line';
 
+import { useVbenModal } from '@vben/common-ui';
+
+import { ElButton } from 'element-plus';
+
 import { useVbenVxeGrid } from '#/adapter/vxe-table';
 import { getItemReceiptLinePage } from '#/api/mes/wm/itemreceipt/line';
 
+import ItemReceiptDetail from './item-receipt-detail.vue';
+
 const props = defineProps<{
   vendorId: number;
 }>();
 
+const [DetailModal, detailModalApi] = useVbenModal({
+  connectedComponent: ItemReceiptDetail,
+  destroyOnClose: true,
+});
+
+/** 查看采购入库单详情 */
+function handleViewReceipt(row: MesWmItemReceiptLineApi.ItemReceiptLine) {
+  if (row.receiptId) {
+    detailModalApi.setData({ id: row.receiptId }).open();
+  }
+}
+
 const [Grid] = useVbenVxeGrid({
   gridOptions: {
     columns: [
-      { field: 'receiptCode', title: '入库单编号', minWidth: 160 },
+      {
+        field: 'receiptCode',
+        title: '入库单编号',
+        minWidth: 160,
+        slots: { default: 'receiptCode' },
+      },
       { field: 'purchaseOrderCode', title: '采购订单号', minWidth: 150 },
       { field: 'itemCode', title: '物料编码', width: 140 },
       { field: 'itemName', title: '物料名称', minWidth: 150 },
@@ -45,5 +68,12 @@ const [Grid] = useVbenVxeGrid({
 </script>
 
 <template>
-  <Grid table-title="采购记录" />
+  <DetailModal />
+  <Grid table-title="采购记录">
+    <template #receiptCode="{ row }">
+      <ElButton link type="primary" @click="handleViewReceipt(row)">
+        {{ row.receiptCode }}
+      </ElButton>
+    </template>
+  </Grid>
 </template>