diff --git a/apps/web-antd/src/api/infra/autocode/gencode/index.ts b/apps/web-antd/src/api/infra/autocode/gencode/index.ts
new file mode 100644
index 0000000000000000000000000000000000000000..0cac7672731fb5a197e886e9be110a879cf30027
--- /dev/null
+++ b/apps/web-antd/src/api/infra/autocode/gencode/index.ts
@@ -0,0 +1,18 @@
+import { requestClient } from '#/api/request';
+
+/**
+ * 自动生成编码规则 API
+ */
+export function genCodeApi() {
+  async function getAutoCode(
+    ruleCode: string,
+    inputCharacter?: string,
+  ): Promise<string> {
+    const url = inputCharacter
+      ? `/infra/auto-code/get/${ruleCode}/${inputCharacter}`
+      : `/infra/auto-code/get/${ruleCode}`;
+    return requestClient.get<string>(url);
+  }
+
+  return { getAutoCode };
+}
diff --git a/apps/web-antd/src/api/infra/autocode/part/index.ts b/apps/web-antd/src/api/infra/autocode/part/index.ts
new file mode 100644
index 0000000000000000000000000000000000000000..b1c7a783a6ede232b87f155784685b4f53edc8e3
--- /dev/null
+++ b/apps/web-antd/src/api/infra/autocode/part/index.ts
@@ -0,0 +1,67 @@
+import type { PageParam, PageResult } from '@vben/request';
+
+import { requestClient } from '#/api/request';
+
+export namespace AutoCodePartApi {
+  /** 编码生成规则组成信息 */
+  export interface AutoCodePart {
+    partId: number; // 分段ID
+    ruleId?: number; // 规则ID
+    partIndex?: number; // 分段序号
+    partType?: string; // 分段类型，INPUTCHAR：输入字符，NOWDATE：当前日期时间，FIXCHAR：固定字符，SERIALNO：流水号
+    partCode: string; // 分段编号
+    partName: string; // 分段名称
+    partLength?: number; // 分段长度
+    dateFormat: string; // 日期格式化
+    inputCharacter: string; // 输入字符
+    fixCharacter: string; // 固定字符
+    serialStartNo: number; // 流水号起始值
+    serialStep: number; // 流水号步长
+    serialNowNo: number; // 流水号当前值
+    cycleFlag: number; // 流水号是否循环
+    cycleMethod: string; // 循环方式，YEAR：按年，MONTH：按月，DAY：按天，HOUR：按小时，MINUTE：按分钟，OTHER：按传入字符变
+    remark: string; // 备注
+  }
+}
+
+/** 查询编码生成规则组成分页 */
+export function getAutoCodePartPage(params: PageParam) {
+  return requestClient.get<PageResult<AutoCodePartApi.AutoCodePart>>(
+    '/infra/auto-code-part/page',
+    { params },
+  );
+}
+
+/** 查询编码生成规则组成详情 */
+export function getAutoCodePart(partId: number) {
+  return requestClient.get<AutoCodePartApi.AutoCodePart>(
+    `/infra/auto-code-part/get?partId=${partId}`,
+  );
+}
+
+/** 新增编码生成规则组成 */
+export function createAutoCodePart(data: AutoCodePartApi.AutoCodePart) {
+  return requestClient.post('/infra/auto-code-part/create', data);
+}
+
+/** 修改编码生成规则组成 */
+export function updateAutoCodePart(data: AutoCodePartApi.AutoCodePart) {
+  return requestClient.put('/infra/auto-code-part/update', data);
+}
+
+/** 删除编码生成规则组成 */
+export function deleteAutoCodePart(partId: number) {
+  return requestClient.delete(`/infra/auto-code-part/delete?partId=${partId}`);
+}
+
+/** 批量删除编码生成规则组成 */
+export function deleteAutoCodePartList(ids: number[]) {
+  return requestClient.delete(
+    `/infra/auto-code-part/delete-list?ids=${ids.join(',')}`,
+  );
+}
+
+/** 导出编码生成规则组成 */
+export function exportAutoCodePart(params: any) {
+  return requestClient.download('/infra/auto-code-part/export-excel', params);
+}
diff --git a/apps/web-antd/src/api/infra/autocode/rule/index.ts b/apps/web-antd/src/api/infra/autocode/rule/index.ts
new file mode 100644
index 0000000000000000000000000000000000000000..67242dbabbda7a7fb3cc9d9813ea59ef133e1f62
--- /dev/null
+++ b/apps/web-antd/src/api/infra/autocode/rule/index.ts
@@ -0,0 +1,66 @@
+import type { PageParam, PageResult } from '@vben/request';
+
+import { requestClient } from '#/api/request';
+
+export namespace AutoCodeRuleApi {
+  /** 编码生成规则信息 */
+  export interface AutoCodeRule {
+    ruleId: number; // 规则ID
+    ruleCode?: string; // 规则编码
+    ruleName?: string; // 规则名称
+    ruleDesc: string; // 描述
+    maxLength: number; // 最大长度
+    isPadded?: string; // 是否补齐
+    paddedChar: string; // 补齐字符
+    paddedMethod: string; // 补齐方式
+    status?: number; // 是否启用
+    remark: string; // 备注
+  }
+}
+
+/** 查询编码生成规则分页 */
+export function getAutoCodeRulePage(params: PageParam) {
+  return requestClient.get<PageResult<AutoCodeRuleApi.AutoCodeRule>>(
+    '/infra/auto-code-rule/page',
+    { params },
+  );
+}
+
+/** 查询编码生成规则详情 */
+export function getAutoCodeRule(ruleId: number) {
+  return requestClient.get<AutoCodeRuleApi.AutoCodeRule>(
+    `/infra/auto-code-rule/get?ruleId=${ruleId}`,
+  );
+}
+
+/** 新增编码生成规则 */
+export function createAutoCodeRule(data: AutoCodeRuleApi.AutoCodeRule) {
+  return requestClient.post('/infra/auto-code-rule/create', data);
+}
+
+/** 修改编码生成规则 */
+export function updateAutoCodeRule(data: AutoCodeRuleApi.AutoCodeRule) {
+  return requestClient.put('/infra/auto-code-rule/update', data);
+}
+
+/** 删除编码生成规则 */
+export function deleteAutoCodeRule(ruleId: number) {
+  return requestClient.delete(`/infra/auto-code-rule/delete?ruleId=${ruleId}`);
+}
+
+/** 批量删除编码生成规则 */
+export function deleteAutoCodeRuleList(ids: number[]) {
+  return requestClient.delete(
+    `/infra/auto-code-rule/delete-list?ids=${ids.join(',')}`,
+  );
+}
+
+/** 查询规则（精简)列表 */
+export function getSimpleRuleList() {
+  return requestClient.get('/infra/auto-code-rule/list-all-simple');
+}
+
+/** 导出编码生成规则 */
+export function exportAutoCodeRule(params: any) {
+  return requestClient.download('/infra/auto-code-rule/export-excel', params);
+}
diff --git a/apps/web-antd/src/utils/dict.ts b/apps/web-antd/src/utils/dict.ts
index bcfc9e214923414fb5a8346cb4d0495daa5cd03e..a6cfe5b60b390631274ec638cf62705d6e8f9106 100644
--- a/apps/web-antd/src/utils/dict.ts
+++ b/apps/web-antd/src/utils/dict.ts
@@ -234,6 +234,8 @@ enum DICT_TYPE {
   EXPRESS_CHARGE_MODE = 'trade_delivery_express_charge_mode', // 快递的计费方式
   INFRA_API_ERROR_LOG_PROCESS_STATUS = 'infra_api_error_log_process_status',
   // ========== INFRA 模块 ==========
+  INFRA_AUTOCODE_CYCLEMETHOD = 'infra_autocode_cyclemethod',
+  INFRA_AUTOCODE_PARTTYPE = 'infra_autocode_parttype',
   INFRA_BOOLEAN_STRING = 'infra_boolean_string',
   INFRA_CODEGEN_FRONT_TYPE = 'infra_codegen_front_type',
   INFRA_CODEGEN_SCENE = 'infra_codegen_scene',
diff --git a/apps/web-antd/src/views/infra/autocode/data.ts b/apps/web-antd/src/views/infra/autocode/data.ts
new file mode 100644
index 0000000000000000000000000000000000000000..b12a0437b11da76de22b7efc5d9b9f47cdc8c39a
--- /dev/null
+++ b/apps/web-antd/src/views/infra/autocode/data.ts
@@ -0,0 +1,533 @@
+import type { VbenFormSchema } from '#/adapter/form';
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+
+import { z } from '#/adapter/form';
+import {
+  CommonStatusEnum,
+  DICT_TYPE,
+  getDictOptions,
+  getRangePickerDefaultProps,
+} from '#/utils';
+
+// ============================== 生成规则 ==============================
+
+/** 新增/修改的表单 */
+export function useRuleFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'ruleId',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'ruleCode',
+      label: '规则编码',
+      rules: 'required',
+      component: 'Input',
+      componentProps: (values) => {
+        return {
+          placeholder: '请输入规则编码',
+          disabled: !!values.ruleId,
+        };
+      },
+      dependencies: {
+        triggerFields: [''],
+      },
+    },
+    {
+      fieldName: 'ruleName',
+      label: '规则名称',
+      rules: 'required',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入规则名称',
+      },
+    },
+    {
+      fieldName: 'ruleDesc',
+      label: '描述',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入描述',
+      },
+    },
+    {
+      fieldName: 'maxLength',
+      label: '最大长度',
+      component: 'InputNumber',
+      componentProps: {
+        placeholder: '请输入最大长度',
+        min: 0,
+        precision: 0,
+      },
+    },
+    {
+      fieldName: 'isPadded',
+      label: '是否补齐',
+      component: 'RadioGroup',
+      componentProps: {
+        options: getDictOptions(DICT_TYPE.COMMON_STATUS, 'number'),
+        buttonStyle: 'solid',
+        optionType: 'button',
+      },
+      rules: z.number().default(CommonStatusEnum.DISABLE),
+    },
+    {
+      fieldName: 'paddedChar',
+      label: '补齐字符',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入补齐字符',
+      },
+      dependencies: {
+        triggerFields: ['isPadded'],
+        show: (values) => values.isPadded === CommonStatusEnum.ENABLE,
+      },
+    },
+    {
+      fieldName: 'paddedMethod',
+      label: '补齐方式',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入补齐方式',
+      },
+      dependencies: {
+        triggerFields: ['isPadded'],
+        show: (values) => values.isPadded === CommonStatusEnum.ENABLE,
+      },
+    },
+    {
+      fieldName: 'status',
+      label: '是否启用',
+      component: 'RadioGroup',
+      componentProps: {
+        options: getDictOptions(DICT_TYPE.COMMON_STATUS, 'number'),
+        buttonStyle: 'solid',
+        optionType: 'button',
+      },
+      rules: z.number().default(CommonStatusEnum.ENABLE),
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入备注',
+      },
+    },
+  ];
+}
+
+/** 列表的搜索表单 */
+export function useRuleGridFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'ruleCode',
+      label: '规则编码',
+      component: 'Input',
+      componentProps: {
+        allowClear: true,
+        placeholder: '请输入规则编码',
+      },
+    },
+    {
+      fieldName: 'ruleName',
+      label: '规则名称',
+      component: 'Input',
+      componentProps: {
+        allowClear: true,
+        placeholder: '请输入规则名称',
+      },
+    },
+    {
+      fieldName: 'status',
+      label: '是否启用',
+      component: 'Select',
+      componentProps: {
+        options: getDictOptions(DICT_TYPE.COMMON_STATUS, 'number'),
+        placeholder: '请选择是否启用',
+        clearable: true,
+      },
+    },
+    {
+      fieldName: 'createTime',
+      label: '创建时间',
+      component: 'RangePicker',
+      componentProps: {
+        ...getRangePickerDefaultProps(),
+        allowClear: true,
+      },
+    },
+  ];
+}
+
+/** 列表的字段 */
+export function useRuleGridColumns(): VxeTableGridOptions['columns'] {
+  return [
+    { type: 'checkbox', width: 40 },
+    {
+      field: 'ruleCode',
+      title: '规则编码',
+    },
+    {
+      field: 'ruleName',
+      title: '规则名称',
+    },
+    {
+      field: 'ruleDesc',
+      title: '描述',
+      visible: false,
+    },
+    {
+      field: 'maxLength',
+      title: '最大长度',
+      visible: false,
+    },
+    {
+      field: 'isPadded',
+      title: '是否补齐',
+      visible: false,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.COMMON_STATUS },
+      },
+    },
+    {
+      field: 'paddedChar',
+      title: '补齐字符',
+      visible: false,
+    },
+    {
+      field: 'paddedMethod',
+      title: '补齐方式',
+      visible: false,
+    },
+    {
+      field: 'status',
+      title: '是否启用',
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.COMMON_STATUS },
+      },
+    },
+    {
+      field: 'remark',
+      title: '备注',
+    },
+    {
+      field: 'createTime',
+      title: '创建时间',
+      formatter: 'formatDateTime',
+    },
+    {
+      title: '操作',
+      fixed: 'right',
+      slots: { default: 'actions' },
+    },
+  ];
+}
+
+// ============================== 规则组成 ==============================
+
+/** 新增/修改的表单 */
+export function usePartFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'partId',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'ruleId',
+      label: '规则ID',
+      rules: 'required',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入规则ID',
+      },
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'partIndex',
+      label: '分段序号',
+      rules: 'required',
+      component: 'InputNumber',
+      componentProps: {
+        placeholder: '请输入分段序号',
+        min: 0,
+        precision: 0,
+      },
+    },
+    {
+      fieldName: 'partType',
+      label: '分段类型',
+      rules: 'required',
+      component: 'Select',
+      componentProps: {
+        options: getDictOptions(DICT_TYPE.INFRA_AUTOCODE_PARTTYPE, 'string'),
+        allowClear: true,
+        placeholder: '请选择分段类型',
+      },
+    },
+    {
+      fieldName: 'partCode',
+      label: '分段编号',
+      rules: 'required',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入分段编号',
+      },
+    },
+    {
+      fieldName: 'partName',
+      label: '分段名称',
+      rules: 'required',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入分段名称',
+      },
+    },
+    {
+      fieldName: 'partLength',
+      label: '分段长度',
+      component: 'InputNumber',
+      componentProps: {
+        placeholder: '请输入分段长度',
+        min: 0,
+        precision: 0,
+      },
+    },
+    {
+      fieldName: 'dateFormat',
+      label: '日期格式化',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入日期格式化',
+      },
+      dependencies: {
+        triggerFields: ['partType'],
+        show: (values) => values.partType === 'NOWDATE',
+      },
+    },
+    {
+      fieldName: 'inputCharacter',
+      label: '输入字符',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入输入字符',
+      },
+      dependencies: {
+        triggerFields: ['partType'],
+        show: (values) => values.partType === 'INPUTCHAR',
+      },
+    },
+    {
+      fieldName: 'fixCharacter',
+      label: '固定字符',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入固定字符',
+      },
+      dependencies: {
+        triggerFields: ['partType'],
+        show: (values) => values.partType === 'FIXCHAR',
+      },
+    },
+    {
+      fieldName: 'serialStartNo',
+      label: '流水号起始值',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入流水号起始值',
+      },
+      dependencies: {
+        triggerFields: ['partType'],
+        show: (values) => values.partType === 'SERIALNO',
+      },
+    },
+    {
+      fieldName: 'serialStep',
+      label: '流水号步长',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入流水号步长',
+      },
+      dependencies: {
+        triggerFields: ['partType'],
+        show: (values) => values.partType === 'SERIALNO',
+      },
+    },
+    {
+      fieldName: 'cycleFlag',
+      label: '流水号是否循环',
+      component: 'Select',
+      componentProps: {
+        options: getDictOptions(DICT_TYPE.COMMON_STATUS, 'number'),
+        allowClear: true,
+        placeholder: '请选择是否循环',
+      },
+      rules: z.number().default(CommonStatusEnum.DISABLE),
+      dependencies: {
+        triggerFields: ['partType'],
+        show: (values) => values.partType === 'SERIALNO',
+      },
+    },
+    {
+      fieldName: 'cycleMethod',
+      label: '循环方式',
+      component: 'Select',
+      componentProps: {
+        options: getDictOptions(DICT_TYPE.INFRA_AUTOCODE_CYCLEMETHOD, 'string'),
+        allowClear: true,
+        placeholder: '请选择循环方式',
+      },
+      dependencies: {
+        triggerFields: ['cycleFlag'],
+        show: (values) => values.cycleFlag === CommonStatusEnum.ENABLE,
+      },
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入备注',
+      },
+    },
+  ];
+}
+
+/** 列表的搜索表单 */
+export function usePartGridFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'partCode',
+      label: '分段编号',
+      component: 'Input',
+      componentProps: {
+        allowClear: true,
+        placeholder: '请输入分段编号',
+      },
+    },
+    {
+      fieldName: 'partName',
+      label: '分段名称',
+      component: 'Input',
+      componentProps: {
+        allowClear: true,
+        placeholder: '请输入分段名称',
+      },
+    },
+    {
+      fieldName: 'createTime',
+      label: '创建时间',
+      component: 'RangePicker',
+      componentProps: {
+        ...getRangePickerDefaultProps(),
+        allowClear: true,
+      },
+    },
+  ];
+}
+
+/** 列表的字段 */
+export function usePartGridColumns(): VxeTableGridOptions['columns'] {
+  return [
+    { type: 'checkbox', width: 40 },
+    {
+      field: 'partCode',
+      title: '分段编号',
+    },
+    {
+      field: 'partName',
+      title: '分段名称',
+    },
+    {
+      field: 'partIndex',
+      title: '分段序号',
+    },
+    {
+      field: 'partType',
+      title: '分段类型',
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.INFRA_AUTOCODE_PARTTYPE },
+      },
+    },
+    {
+      field: 'partLength',
+      title: '分段长度',
+    },
+    {
+      field: 'dateFormat',
+      title: '日期格式化',
+      visible: false,
+    },
+    {
+      field: 'inputCharacter',
+      title: '输入字符',
+      visible: false,
+    },
+    {
+      field: 'fixCharacter',
+      title: '固定字符',
+      visible: false,
+    },
+    {
+      field: 'serialStartNo',
+      title: '流水号起始值',
+      visible: false,
+    },
+    {
+      field: 'serialStep',
+      title: '流水号步长',
+      visible: false,
+    },
+    {
+      field: 'serialNowNo',
+      title: '流水号当前值',
+      visible: false,
+    },
+    {
+      field: 'cycleFlag',
+      title: '流水号是否循环',
+      visible: false,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.COMMON_STATUS },
+      },
+    },
+    {
+      field: 'cycleMethod',
+      title: '循环方式',
+      visible: false,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.INFRA_AUTOCODE_CYCLEMETHOD },
+      },
+    },
+    {
+      field: 'remark',
+      title: '备注',
+    },
+    {
+      field: 'createTime',
+      title: '创建时间',
+      formatter: 'formatDateTime',
+    },
+    {
+      title: '操作',
+      fixed: 'right',
+      slots: { default: 'actions' },
+    },
+  ];
+}
diff --git a/apps/web-antd/src/views/infra/autocode/index.vue b/apps/web-antd/src/views/infra/autocode/index.vue
new file mode 100644
index 0000000000000000000000000000000000000000..f085480a9693dc0461e30b5fa950a17ddc587510
--- /dev/null
+++ b/apps/web-antd/src/views/infra/autocode/index.vue
@@ -0,0 +1,29 @@
+<script lang="ts" setup>
+import { ref } from 'vue';
+
+import { Page } from '@vben/common-ui';
+
+import PartGrid from './modules/part-grid.vue';
+import RuleGrid from './modules/rule-grid.vue';
+
+const searchRule = ref<number>(); // 搜索的生成规则
+
+function handleRuleSelect(ruleId: number) {
+  searchRule.value = ruleId;
+}
+</script>
+
+<template>
+  <Page auto-content-height>
+    <div class="flex h-full">
+      <!-- 左侧生成规则列表 -->
+      <div class="w-1/2 pr-3">
+        <RuleGrid @select="handleRuleSelect" />
+      </div>
+      <!-- 右侧规则组成列表 -->
+      <div class="w-1/2">
+        <PartGrid :rule-id="searchRule" />
+      </div>
+    </div>
+  </Page>
+</template>
diff --git a/apps/web-antd/src/views/infra/autocode/modules/part-form.vue b/apps/web-antd/src/views/infra/autocode/modules/part-form.vue
new file mode 100644
index 0000000000000000000000000000000000000000..baa3bc7e0d809bdafe87db2a522d6f6564f2a0b0
--- /dev/null
+++ b/apps/web-antd/src/views/infra/autocode/modules/part-form.vue
@@ -0,0 +1,101 @@
+<script lang="ts" setup>
+import type { AutoCodePartApi } from '#/api/infra/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/infra/autocode/part';
+import { $t } from '#/locales';
+
+import { usePartFormSchema } from '../data';
+
+defineOptions({ name: 'InfraAutoCodePartForm' });
+
+const emit = defineEmits(['success']);
+const formData = ref<AutoCodePartApi.AutoCodePart>();
+const getTitle = computed(() => {
+  return formData.value?.partId
+    ? $t('ui.actionTitle.edit', ['规则组成'])
+    : $t('ui.actionTitle.create', ['规则组成']);
+});
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-2',
+    labelWidth: 80,
+  },
+  layout: 'horizontal',
+  schema: usePartFormSchema(),
+  showDefaultActions: false,
+});
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    const data = (await formApi.getValues()) as AutoCodePartApi.AutoCodePart;
+    try {
+      await (formData.value?.partId
+        ? 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;
+    }
+    // 加载数据
+    const data = modalApi.getData<
+      AutoCodePartApi.AutoCodePart | { ruleId?: number }
+    >();
+
+    // 如果有ID，表示是编辑
+    if (data && 'partId' in data && data.partId) {
+      modalApi.lock();
+      try {
+        formData.value = await getAutoCodePart(data.partId as number);
+        // 设置到 values
+        if (formData.value) {
+          await formApi.setValues(formData.value);
+        }
+      } finally {
+        modalApi.unlock();
+      }
+    }
+    // 新增时，如果传入了ruleId，则设置到表单
+    if (data && 'ruleId' in data && data.ruleId) {
+      await formApi.setValues({
+        ruleId: data.ruleId,
+      });
+    }
+  },
+});
+</script>
+
+<template>
+  <Modal :title="getTitle">
+    <Form class="mx-4" />
+  </Modal>
+</template>
diff --git a/apps/web-antd/src/views/infra/autocode/modules/part-grid.vue b/apps/web-antd/src/views/infra/autocode/modules/part-grid.vue
new file mode 100644
index 0000000000000000000000000000000000000000..891cee090bc92743d181866d5391c20c9e999f51
--- /dev/null
+++ b/apps/web-antd/src/views/infra/autocode/modules/part-grid.vue
@@ -0,0 +1,207 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { AutoCodePartApi } from '#/api/infra/autocode/part';
+
+import { ref, watch } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+import { downloadFileFromBlobPart, isEmpty } from '@vben/utils';
+
+import { message } from 'ant-design-vue';
+
+import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import {
+  deleteAutoCodePart,
+  deleteAutoCodePartList,
+  exportAutoCodePart,
+  getAutoCodePartPage,
+} from '#/api/infra/autocode/part';
+import { $t } from '#/locales';
+
+import { usePartGridColumns, usePartGridFormSchema } from '../data';
+import PartForm from './part-form.vue';
+
+const props = defineProps({
+  ruleId: {
+    type: Number,
+    default: undefined,
+  },
+});
+
+const [PartFormModal, partFormModalApi] = useVbenModal({
+  connectedComponent: PartForm,
+  destroyOnClose: true,
+});
+
+/** 刷新表格 */
+function onRefresh() {
+  gridApi.query();
+}
+
+/** 导出表格 */
+async function handleExport() {
+  const data = await exportAutoCodePart(await gridApi.formApi.getValues());
+  downloadFileFromBlobPart({ fileName: '规则组成.xls', source: data });
+}
+
+/** 创建规则组成 */
+function handleCreate() {
+  partFormModalApi.setData({ ruleId: props.ruleId }).open();
+}
+
+/** 编辑规则组成 */
+function handleEdit(row: AutoCodePartApi.AutoCodePart) {
+  partFormModalApi.setData(row).open();
+}
+
+/** 删除规则组成 */
+async function handleDelete(row: AutoCodePartApi.AutoCodePart) {
+  const hideLoading = message.loading({
+    content: $t('ui.actionMessage.deleting', [row.partName]),
+    key: 'action_key_msg',
+  });
+  try {
+    await deleteAutoCodePart(row.partId as number);
+    message.success({
+      content: $t('ui.actionMessage.deleteSuccess', [row.partName]),
+      key: 'action_key_msg',
+    });
+    onRefresh();
+  } finally {
+    hideLoading();
+  }
+}
+
+const checkedIds = ref<number[]>([]);
+function handleRowCheckboxChange({
+  records,
+}: {
+  records: AutoCodePartApi.AutoCodePart[];
+}) {
+  checkedIds.value = records.map((item) => item.partId as number);
+}
+
+/** 批量删除规则组成 */
+async function handleDeleteBatch() {
+  const hideLoading = message.loading({
+    content: $t('ui.actionMessage.deleting'),
+    duration: 0,
+    key: 'action_process_msg',
+  });
+  try {
+    await deleteAutoCodePartList(checkedIds.value);
+    checkedIds.value = [];
+    message.success($t('ui.actionMessage.deleteSuccess'));
+    onRefresh();
+  } finally {
+    hideLoading();
+  }
+}
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  formOptions: {
+    schema: usePartGridFormSchema(),
+  },
+  gridOptions: {
+    columns: usePartGridColumns(),
+    height: 'auto',
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }, formValues) => {
+          return await getAutoCodePartPage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            ruleId: props.ruleId,
+            ...formValues,
+          });
+        },
+      },
+    },
+    rowConfig: {
+      keyField: 'partId',
+      isCurrent: true,
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+  } as VxeTableGridOptions<AutoCodePartApi.AutoCodePart>,
+  gridEvents: {
+    checkboxAll: handleRowCheckboxChange,
+    checkboxChange: handleRowCheckboxChange,
+  },
+});
+
+/** 监听 ruleId 变化，重新查询 */
+watch(
+  () => props.ruleId,
+  () => {
+    if (props.ruleId) {
+      onRefresh();
+    }
+  },
+);
+</script>
+
+<template>
+  <div class="h-full">
+    <PartFormModal @success="onRefresh" />
+
+    <Grid table-title="规则组成列表">
+      <template #toolbar-tools>
+        <TableAction
+          :actions="[
+            {
+              label: $t('ui.actionTitle.create', ['规则组成']),
+              type: 'primary',
+              icon: ACTION_ICON.ADD,
+              auth: ['infra:auto-code-part:create'],
+              onClick: handleCreate,
+            },
+            {
+              label: $t('ui.actionTitle.export'),
+              type: 'primary',
+              icon: ACTION_ICON.DOWNLOAD,
+              auth: ['infra:auto-code-part:export'],
+              onClick: handleExport,
+            },
+            {
+              label: '批量删除',
+              type: 'primary',
+              danger: true,
+              disabled: isEmpty(checkedIds),
+              icon: ACTION_ICON.DELETE,
+              auth: ['infra:auto-code-part:delete'],
+              onClick: handleDeleteBatch,
+            },
+          ]"
+        />
+      </template>
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: $t('common.edit'),
+              type: 'link',
+              icon: ACTION_ICON.EDIT,
+              auth: ['infra:auto-code-part:update'],
+              onClick: handleEdit.bind(null, row),
+            },
+            {
+              label: $t('common.delete'),
+              type: 'link',
+              danger: true,
+              icon: ACTION_ICON.DELETE,
+              auth: ['infra:auto-code-part:delete'],
+              popConfirm: {
+                title: $t('ui.actionMessage.deleteConfirm', [row.partName]),
+                confirm: handleDelete.bind(null, row),
+              },
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+  </div>
+</template>
diff --git a/apps/web-antd/src/views/infra/autocode/modules/rule-form.vue b/apps/web-antd/src/views/infra/autocode/modules/rule-form.vue
new file mode 100644
index 0000000000000000000000000000000000000000..3768d808a1a1bd36af5033989fee08d9505c9beb
--- /dev/null
+++ b/apps/web-antd/src/views/infra/autocode/modules/rule-form.vue
@@ -0,0 +1,91 @@
+<script lang="ts" setup>
+import type { AutoCodeRuleApi } from '#/api/infra/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/infra/autocode/rule';
+import { $t } from '#/locales';
+
+import { useRuleFormSchema } from '../data';
+
+const emit = defineEmits(['success']);
+const formData = ref<AutoCodeRuleApi.AutoCodeRule>();
+const getTitle = computed(() => {
+  return formData.value?.ruleId
+    ? $t('ui.actionTitle.edit', ['生成规则'])
+    : $t('ui.actionTitle.create', ['生成规则']);
+});
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-2',
+    labelWidth: 80,
+  },
+  layout: 'horizontal',
+  schema: useRuleFormSchema(),
+  showDefaultActions: false,
+});
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    const data = (await formApi.getValues()) as AutoCodeRuleApi.AutoCodeRule;
+    try {
+      await (formData.value?.ruleId
+        ? 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;
+    }
+    // 加载数据
+    let data = modalApi.getData<AutoCodeRuleApi.AutoCodeRule>();
+    if (!data) {
+      return;
+    }
+    if (data.ruleId) {
+      modalApi.lock();
+      try {
+        data = await getAutoCodeRule(data.ruleId);
+      } finally {
+        modalApi.unlock();
+      }
+    }
+    // 设置到 values
+    formData.value = data;
+    await formApi.setValues(formData.value);
+  },
+});
+</script>
+
+<template>
+  <Modal :title="getTitle">
+    <Form class="mx-4" />
+  </Modal>
+</template>
diff --git a/apps/web-antd/src/views/infra/autocode/modules/rule-grid.vue b/apps/web-antd/src/views/infra/autocode/modules/rule-grid.vue
new file mode 100644
index 0000000000000000000000000000000000000000..f4dc4b0e7c4aa431b3e84fee0ed7691727f505a3
--- /dev/null
+++ b/apps/web-antd/src/views/infra/autocode/modules/rule-grid.vue
@@ -0,0 +1,200 @@
+<script lang="ts" setup>
+import type {
+  VxeGridListeners,
+  VxeTableGridOptions,
+} from '#/adapter/vxe-table';
+import type { AutoCodeRuleApi } from '#/api/infra/autocode/rule';
+
+import { ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+import { downloadFileFromBlobPart, isEmpty } from '@vben/utils';
+
+import { message } from 'ant-design-vue';
+
+import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import {
+  deleteAutoCodeRule,
+  deleteAutoCodeRuleList,
+  exportAutoCodeRule,
+  getAutoCodeRulePage,
+} from '#/api/infra/autocode/rule';
+import { $t } from '#/locales';
+
+import { useRuleGridColumns, useRuleGridFormSchema } from '../data';
+import RuleForm from './rule-form.vue';
+
+const emit = defineEmits(['select']);
+
+const [RuleFormModal, ruleFormModalApi] = useVbenModal({
+  connectedComponent: RuleForm,
+  destroyOnClose: true,
+});
+
+/** 刷新表格 */
+function onRefresh() {
+  gridApi.query();
+}
+
+/** 导出表格 */
+async function handleExport() {
+  const data = await exportAutoCodeRule(await gridApi.formApi.getValues());
+  downloadFileFromBlobPart({ fileName: '生成规则.xls', source: data });
+}
+
+/** 创建生成规则 */
+function handleCreate() {
+  ruleFormModalApi.setData(null).open();
+}
+
+/** 编辑生成规则 */
+function handleEdit(row: any) {
+  ruleFormModalApi.setData(row).open();
+}
+
+/** 删除生成规则 */
+async function handleDelete(row: AutoCodeRuleApi.AutoCodeRule) {
+  const hideLoading = message.loading({
+    content: $t('ui.actionMessage.deleting', [row.ruleName]),
+    key: 'action_key_msg',
+  });
+  try {
+    await deleteAutoCodeRule(row.ruleId as number);
+    message.success({
+      content: $t('ui.actionMessage.deleteSuccess', [row.ruleName]),
+      key: 'action_key_msg',
+    });
+    onRefresh();
+  } finally {
+    hideLoading();
+  }
+}
+
+const checkedIds = ref<number[]>([]);
+function handleRowCheckboxChange({
+  records,
+}: {
+  records: AutoCodeRuleApi.AutoCodeRule[];
+}) {
+  checkedIds.value = records.map((item) => item.ruleId as number);
+}
+
+/** 批量删除生成规则 */
+async function handleDeleteBatch() {
+  const hideLoading = message.loading({
+    content: $t('ui.actionMessage.deleting'),
+    duration: 0,
+    key: 'action_process_msg',
+  });
+  try {
+    await deleteAutoCodeRuleList(checkedIds.value);
+    checkedIds.value = [];
+    message.success($t('ui.actionMessage.deleteSuccess'));
+    onRefresh();
+  } finally {
+    hideLoading();
+  }
+}
+
+/** 表格事件 */
+const gridEvents: VxeGridListeners<AutoCodeRuleApi.AutoCodeRule> = {
+  cellClick: ({ row }) => {
+    emit('select', row.ruleId);
+  },
+  checkboxAll: handleRowCheckboxChange,
+  checkboxChange: handleRowCheckboxChange,
+};
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  formOptions: {
+    schema: useRuleGridFormSchema(),
+  },
+  gridOptions: {
+    columns: useRuleGridColumns(),
+    height: 'auto',
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }, formValues) => {
+          return await getAutoCodeRulePage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            ...formValues,
+          });
+        },
+      },
+    },
+    rowConfig: {
+      keyField: 'ruleId',
+      isCurrent: true,
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+  } as VxeTableGridOptions<AutoCodeRuleApi.AutoCodeRule>,
+  gridEvents,
+});
+</script>
+
+<template>
+  <div class="h-full">
+    <RuleFormModal @success="onRefresh" />
+
+    <Grid table-title="生成规则列表">
+      <template #toolbar-tools>
+        <TableAction
+          :actions="[
+            {
+              label: $t('ui.actionTitle.create', ['生成规则']),
+              type: 'primary',
+              icon: ACTION_ICON.ADD,
+              auth: ['infra:auto-code-rule:create'],
+              onClick: handleCreate,
+            },
+            {
+              label: $t('ui.actionTitle.export'),
+              type: 'primary',
+              icon: ACTION_ICON.DOWNLOAD,
+              auth: ['infra:auto-code-rule:export'],
+              onClick: handleExport,
+            },
+            {
+              label: '批量删除',
+              type: 'primary',
+              danger: true,
+              disabled: isEmpty(checkedIds),
+              icon: ACTION_ICON.DELETE,
+              auth: ['infra:auto-code-rule:delete'],
+              onClick: handleDeleteBatch,
+            },
+          ]"
+        />
+      </template>
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: $t('common.edit'),
+              type: 'link',
+              icon: ACTION_ICON.EDIT,
+              auth: ['infra:auto-code-rule:update'],
+              onClick: handleEdit.bind(null, row),
+            },
+            {
+              label: $t('common.delete'),
+              type: 'link',
+              danger: true,
+              icon: ACTION_ICON.DELETE,
+              auth: ['infra:auto-code-rule:delete'],
+              popConfirm: {
+                title: $t('ui.actionMessage.deleteConfirm', [row.ruleName]),
+                confirm: handleDelete.bind(null, row),
+              },
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+  </div>
+</template>
diff --git a/cspell.json b/cspell.json
index ea6130a7935b38791e080d3040a0249e00249707..f0c69882ef33ed7b677f570e9bf89a66e82d5268 100644
--- a/cspell.json
+++ b/cspell.json
@@ -66,7 +66,8 @@
     "Tinymce",
     "vitest",
     "xingyu",
-    "yudao"
+    "yudao",
+    "SERIALNO"
   ],
   "ignorePaths": [
     "**/node_modules/**",