diff --git a/apps/web-antd/package.json b/apps/web-antd/package.json
index 904f69a77..a3ae11913 100644
--- a/apps/web-antd/package.json
+++ b/apps/web-antd/package.json
@@ -60,6 +60,7 @@
     "pinia": "catalog:",
     "steady-xml": "catalog:",
     "tinymce": "catalog:",
+    "tyme4ts": "catalog:",
     "video.js": "catalog:",
     "vue": "catalog:",
     "vue-dompurify-html": "catalog:",
diff --git a/apps/web-antd/src/api/iot/rule/scene/index.ts b/apps/web-antd/src/api/iot/rule/scene/index.ts
index acbfbac42..23549f1ad 100644
--- a/apps/web-antd/src/api/iot/rule/scene/index.ts
+++ b/apps/web-antd/src/api/iot/rule/scene/index.ts
@@ -24,7 +24,7 @@ export namespace RuleSceneApi {
     operator?: string;
     value?: any;
     cronExpression?: string;
-    conditionGroups?: TriggerCondition[][];
+    conditionGroups?: TriggerCondition[][]; // 后端结构：List<List<TriggerCondition>>；外层「或」、组内「且」
   }
 
   /**  场景联动规则的触发条件 */
@@ -80,13 +80,6 @@ export function deleteSceneRule(id: number) {
   return requestClient.delete(`/iot/scene-rule/delete?id=${id}`);
 }
 
-/** 批量删除场景联动规则 */
-export function deleteSceneRuleList(ids: number[]) {
-  return requestClient.delete('/iot/scene-rule/delete-list', {
-    params: { ids: ids.join(',') },
-  });
-}
-
 /** 更新场景联动规则状态 */
 export function updateSceneRuleStatus(id: number, status: number) {
   return requestClient.put(`/iot/scene-rule/update-status`, {
diff --git a/apps/web-antd/src/api/iot/thingmodel/index.ts b/apps/web-antd/src/api/iot/thingmodel/index.ts
index 2fb80be2e..88665ebc9 100644
--- a/apps/web-antd/src/api/iot/thingmodel/index.ts
+++ b/apps/web-antd/src/api/iot/thingmodel/index.ts
@@ -148,8 +148,8 @@ export const ThingModelFormRules: Record<string, Rule[]> = {
   identifier: [
     { required: true, message: '标识符不能为空', trigger: 'blur' },
     {
-      pattern: /^\w{1,50}$/,
-      message: '支持大小写字母、数字和下划线，不超过 50 个字符',
+      pattern: /^[a-zA-Z][a-zA-Z0-9_]{0,31}$/,
+      message: '支持大小写字母、数字和下划线，必须以字母开头，不超过 32 个字符',
       trigger: 'blur',
     },
     {
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
index d33e6e0fc..6955e7304 100644
--- a/apps/web-antd/src/api/mes/md/autocode/rule/index.ts
+++ b/apps/web-antd/src/api/mes/md/autocode/rule/index.ts
@@ -51,7 +51,5 @@ export function deleteAutoCodeRule(id: number) {
 
 /** 导出编码规则 */
 export function exportAutoCodeRule(params: PageParam) {
-  return requestClient.download('/mes/md/auto-code-rule/export-excel', {
-    params,
-  });
+  return requestClient.download('/mes/md/auto-code-rule/export-excel', { params });
 }
diff --git a/apps/web-antd/src/api/mes/md/item/index.ts b/apps/web-antd/src/api/mes/md/item/index.ts
index f2a23c0e6..9d3b107f8 100644
--- a/apps/web-antd/src/api/mes/md/item/index.ts
+++ b/apps/web-antd/src/api/mes/md/item/index.ts
@@ -34,9 +34,7 @@ export namespace MesMdItemApi {
 
 /** 查询物料产品分页 */
 export function getItemPage(params: PageParam) {
-  return requestClient.get<PageResult<MesMdItemApi.Item>>('/mes/md/item/page', {
-    params,
-  });
+  return requestClient.get<PageResult<MesMdItemApi.Item>>('/mes/md/item/page', { params });
 }
 
 /** 查询物料产品详情 */
diff --git a/apps/web-antd/src/api/mes/pro/process/index.ts b/apps/web-antd/src/api/mes/pro/process/index.ts
index 5a3893b18..a4ff1ea64 100644
--- a/apps/web-antd/src/api/mes/pro/process/index.ts
+++ b/apps/web-antd/src/api/mes/pro/process/index.ts
@@ -5,7 +5,7 @@ import { requestClient } from '#/api/request';
 export namespace MesProProcessApi {
   /** MES 生产工序 */
   export interface Process {
-    id: number;
+    id?: number;
     code?: string;
     name?: string;
     attention?: string;
@@ -36,3 +36,23 @@ export function getProcess(id: number) {
     `/mes/pro/process/get?id=${id}`,
   );
 }
+
+/** 新增生产工序 */
+export function createProcess(data: MesProProcessApi.Process) {
+  return requestClient.post('/mes/pro/process/create', data);
+}
+
+/** 修改生产工序 */
+export function updateProcess(data: MesProProcessApi.Process) {
+  return requestClient.put('/mes/pro/process/update', data);
+}
+
+/** 删除生产工序 */
+export function deleteProcess(id: number) {
+  return requestClient.delete(`/mes/pro/process/delete?id=${id}`);
+}
+
+/** 导出生产工序 Excel */
+export function exportProcess(params: any) {
+  return requestClient.download('/mes/pro/process/export-excel', { params });
+}
diff --git a/apps/web-antd/src/assets/imgs/iot/device.png b/apps/web-antd/src/assets/imgs/iot/device.png
new file mode 100644
index 000000000..79339cdf4
Binary files /dev/null and b/apps/web-antd/src/assets/imgs/iot/device.png differ
diff --git a/apps/web-antd/src/assets/svgs/iot/cube.svg b/apps/web-antd/src/assets/svgs/iot/cube.svg
new file mode 100644
index 000000000..200ac1b1c
--- /dev/null
+++ b/apps/web-antd/src/assets/svgs/iot/cube.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" fill="none" viewBox="0 0 12 12"><g clip-path="url(#a)"><path fill="url(#b)" fill-rule="evenodd" d="M6.958.42C6.444.216 5.61.216 5.098.42L1.15 1.975c-.77.304-.77.797 0 1.1l3.947 1.558c.514.202 1.347.202 1.86 0l3.948-1.557c.77-.304.77-.797 0-1.1L6.958.418ZM4.715 11.788a.857.857 0 0 0 .3.056c.383 0 .671-.295.671-.7V6.404c0-.49-.364-1.007-.817-1.177L1.09 3.805a.808.808 0 0 0-.284-.056c-.353 0-.581.275-.581.7V9.19c0 .508.33 1.014.763 1.177l3.726 1.422Zm2.229-.024h-.02l.073.003c.074.004.154.009.227-.019L11 10.367c.45-.168.83-.686.83-1.177V4.45c0-.413-.29-.7-.673-.7a.965.965 0 0 0-.317.055l-3.72 1.422c-.44.165-.75.67-.75 1.177v4.74c0 .42.218.621.575.621Z" clip-rule="evenodd"/></g><defs><linearGradient id="b" x1=".226" x2="11.803" y1=".267" y2="11.871" gradientUnits="userSpaceOnUse"><stop stop-color="#1B3149"/><stop offset="1" stop-color="#717D8A"/></linearGradient><clipPath id="a"><path fill="#fff" d="M0 0h12v12H0z"/></clipPath></defs></svg>
\ No newline at end of file
diff --git a/apps/web-antd/src/components/shortcut-date-range-picker/shortcut-date-range-picker.vue b/apps/web-antd/src/components/shortcut-date-range-picker/shortcut-date-range-picker.vue
index 5a3ce0526..3dc3f15eb 100644
--- a/apps/web-antd/src/components/shortcut-date-range-picker/shortcut-date-range-picker.vue
+++ b/apps/web-antd/src/components/shortcut-date-range-picker/shortcut-date-range-picker.vue
@@ -4,6 +4,7 @@ import type { Dayjs } from 'dayjs';
 import { onMounted, ref } from 'vue';
 
 import { DatePicker, Radio, RadioGroup } from 'ant-design-vue';
+import dayjs from 'dayjs';
 
 import { getRangePickerDefaultProps } from '#/utils/rangePickerProps';
 
@@ -19,8 +20,20 @@ const times = ref<[Dayjs, Dayjs]>(); // 日期范围
 const rangePickerProps = getRangePickerDefaultProps();
 const timeRangeOptions = [
   rangePickerProps.presets[3]!, // 昨天
-  rangePickerProps.presets[1]!, // 最近 7 天
-  rangePickerProps.presets[2]!, // 最近 30 天
+  {
+    label: rangePickerProps.presets[1]!.label,
+    value: [
+      dayjs().subtract(7, 'day').startOf('day'),
+      dayjs().subtract(1, 'day').endOf('day'),
+    ],
+  },
+  {
+    label: rangePickerProps.presets[2]!.label,
+    value: [
+      dayjs().subtract(30, 'day').startOf('day'),
+      dayjs().subtract(1, 'day').endOf('day'),
+    ],
+  },
 ];
 const timeRangeType = ref(timeRangeOptions[1]!.label); // 默认选中第一个选项
 
diff --git a/apps/web-antd/src/components/upload/file-upload.vue b/apps/web-antd/src/components/upload/file-upload.vue
index 3838642ea..85afc3b9d 100644
--- a/apps/web-antd/src/components/upload/file-upload.vue
+++ b/apps/web-antd/src/components/upload/file-upload.vue
@@ -32,6 +32,7 @@ const props = withDefaults(defineProps<FileUploadProps>(), {
   multiple: false,
   api: undefined,
   resultField: '',
+  returnText: false,
   showDescription: false,
 });
 const emit = defineEmits([
@@ -147,9 +148,6 @@ function handleUploadError(error: any) {
  * @returns 是否允许上传
  */
 async function beforeUpload(file: File) {
-  const fileContent = await file.text();
-  emit('returnText', fileContent);
-
   // 检查文件数量限制
   if (fileList.value!.length >= props.maxNumber) {
     message.error($t('ui.upload.maxNumber', [props.maxNumber]));
@@ -176,6 +174,10 @@ async function beforeUpload(file: File) {
 
   // 只有在验证通过后才增加计数器
   uploadNumber.value++;
+  if (props.returnText) {
+    const fileContent = await file.text();
+    emit('returnText', fileContent);
+  }
   return true;
 }
 
diff --git a/apps/web-antd/src/components/upload/input-upload.vue b/apps/web-antd/src/components/upload/input-upload.vue
index 90b2f4f7c..88f00f1cf 100644
--- a/apps/web-antd/src/components/upload/input-upload.vue
+++ b/apps/web-antd/src/components/upload/input-upload.vue
@@ -58,6 +58,7 @@ const textareaProps = computed(() => {
 const fileUploadProps = computed(() => {
   return {
     ...props.fileUploadProps,
+    returnText: true,
   };
 });
 </script>
diff --git a/apps/web-antd/src/components/upload/typing.ts b/apps/web-antd/src/components/upload/typing.ts
index f3c16bc4d..990aa7d8a 100644
--- a/apps/web-antd/src/components/upload/typing.ts
+++ b/apps/web-antd/src/components/upload/typing.ts
@@ -27,6 +27,7 @@ export interface FileUploadProps {
   maxSize?: number; // 文件最大多少MB
   multiple?: boolean; // 是否支持多选
   resultField?: string; // support xxx.xxx.xx
+  returnText?: boolean; // 是否返回文件文本内容
   showDescription?: boolean; // 是否显示下面的描述
   value?: string | string[];
 }
diff --git a/apps/web-antd/src/router/routes/modules/iot.ts b/apps/web-antd/src/router/routes/modules/iot.ts
index 04cf97d35..a1d2203b9 100644
--- a/apps/web-antd/src/router/routes/modules/iot.ts
+++ b/apps/web-antd/src/router/routes/modules/iot.ts
@@ -12,7 +12,7 @@ const routes: RouteRecordRaw[] = [
     },
     children: [
       {
-        path: 'product/detail/:id',
+        path: 'product/product/detail/:id',
         name: 'IoTProductDetail',
         meta: {
           title: '产品详情',
@@ -30,11 +30,11 @@ const routes: RouteRecordRaw[] = [
         component: () => import('#/views/iot/device/device/detail/index.vue'),
       },
       {
-        path: 'ota/firmware/detail/:id',
+        path: 'ota/operation/firmware/detail/:id',
         name: 'IoTOtaFirmwareDetail',
         meta: {
           title: '固件详情',
-          activePath: '/iot/ota',
+          activePath: '/iot/operation/ota/firmware',
         },
         component: () => import('#/views/iot/ota/firmware/detail/index.vue'),
       },
diff --git a/apps/web-antd/src/views/iot/alert/record/data.ts b/apps/web-antd/src/views/iot/alert/record/data.ts
index 0d5e6deb1..2bc0af490 100644
--- a/apps/web-antd/src/views/iot/alert/record/data.ts
+++ b/apps/web-antd/src/views/iot/alert/record/data.ts
@@ -62,13 +62,27 @@ export function useGridFormSchema(): VbenFormSchema[] {
       label: '设备',
       component: 'ApiSelect',
       componentProps: {
-        api: getSimpleDeviceList,
+        api: (params?: { productId?: number }) =>
+          getSimpleDeviceList(undefined, params?.productId),
         labelField: 'deviceName',
         valueField: 'id',
         placeholder: '请选择设备',
         allowClear: true,
         showSearch: true,
       },
+      dependencies: {
+        triggerFields: ['productId'],
+        componentProps: (values) => {
+          return {
+            params: { productId: values.productId },
+          };
+        },
+        trigger: (values, formApi) => {
+          if (values.deviceId !== undefined) {
+            void formApi.setFieldValue('deviceId', undefined);
+          }
+        },
+      },
     },
     {
       fieldName: 'processStatus',
diff --git a/apps/web-antd/src/views/iot/alert/record/index.vue b/apps/web-antd/src/views/iot/alert/record/index.vue
index d3d8f9d17..b5c59a7a8 100644
--- a/apps/web-antd/src/views/iot/alert/record/index.vue
+++ b/apps/web-antd/src/views/iot/alert/record/index.vue
@@ -45,10 +45,6 @@ function handleProcess(row: AlertRecordApi.AlertRecord) {
         }),
       ]),
     async onOk() {
-      if (!processRemark.value) {
-        message.warning('请输入处理原因');
-        throw new Error('请输入处理原因');
-      }
       const hideLoading = message.loading({
         content: '正在处理...',
         duration: 0,
diff --git a/apps/web-antd/src/views/iot/device/device/data.ts b/apps/web-antd/src/views/iot/device/device/data.ts
index 3eb5ebb1b..ea7f0fc9b 100644
--- a/apps/web-antd/src/views/iot/device/device/data.ts
+++ b/apps/web-antd/src/views/iot/device/device/data.ts
@@ -79,10 +79,18 @@ export function useAdvancedFormSchema(): VbenFormSchema[] {
       },
       rules: z
         .string()
-        .min(4, '备注名称长度限制为 4~64 个字符')
-        .max(64, '备注名称长度限制为 4~64 个字符')
-        .regex(
-          /^[\u4E00-\u9FA5\u3040-\u30FF\w]+$/,
+        .refine(
+          (value) => {
+            const length = value.replaceAll(
+              /[\u4E00-\u9FA5\u3040-\u30FF]/g,
+              'aa',
+            ).length;
+            return length >= 4 && length <= 64;
+          },
+          '备注名称长度限制为 4~64 个字符，中文及日文算 2 个字符',
+        )
+        .refine(
+          (value) => /^[\u4E00-\u9FA5\u3040-\u30FF\w]+$/.test(value),
           '备注名称只能包含中文、英文字母、日文、数字和下划线（_）',
         )
         .optional()
@@ -276,6 +284,7 @@ export function useGridColumns(): VxeTableGridOptions<IotDeviceApi.Device>['colu
       field: 'deviceName',
       title: 'DeviceName',
       minWidth: 150,
+      slots: { default: 'deviceName' },
     },
     {
       field: 'nickname',
diff --git a/apps/web-antd/src/views/iot/device/device/detail/index.vue b/apps/web-antd/src/views/iot/device/device/detail/index.vue
index 26457759e..4d7c29889 100644
--- a/apps/web-antd/src/views/iot/device/device/detail/index.vue
+++ b/apps/web-antd/src/views/iot/device/device/detail/index.vue
@@ -97,7 +97,7 @@ onMounted(async () => {
     <Tabs v-model:active-key="activeTab" class="mt-4">
       <Tabs.TabPane key="info" tab="设备信息">
         <DeviceDetailsInfo
-          v-if="activeTab === 'info'"
+          v-if="activeTab === 'info' && device.id"
           :device="device"
           :product="product"
         />
@@ -127,7 +127,7 @@ onMounted(async () => {
       </Tabs.TabPane>
       <Tabs.TabPane key="simulator" tab="模拟设备">
         <DeviceDetailsSimulator
-          v-if="activeTab === 'simulator'"
+          v-if="activeTab === 'simulator' && device.id"
           :device="device"
           :product="product"
           :thing-model-list="thingModelList"
@@ -135,7 +135,7 @@ onMounted(async () => {
       </Tabs.TabPane>
       <Tabs.TabPane key="config" tab="设备配置">
         <DeviceDetailConfig
-          v-if="activeTab === 'config'"
+          v-if="activeTab === 'config' && device.id"
           :device="device"
           @success="() => getDeviceData(id)"
         />
@@ -151,7 +151,7 @@ onMounted(async () => {
         tab="Modbus 配置"
       >
         <DeviceModbusConfig
-          v-if="activeTab === 'modbus'"
+          v-if="activeTab === 'modbus' && device.id"
           :device="device"
           :product="product"
           :thing-model-list="thingModelList"
diff --git a/apps/web-antd/src/views/iot/device/device/detail/modules/info.vue b/apps/web-antd/src/views/iot/device/device/detail/modules/info.vue
index ded227804..234ad1b33 100644
--- a/apps/web-antd/src/views/iot/device/device/detail/modules/info.vue
+++ b/apps/web-antd/src/views/iot/device/device/detail/modules/info.vue
@@ -36,9 +36,9 @@ const authInfo = ref<IotDeviceApi.DeviceAuthInfoRespVO>(
 );
 const mapDialogRef = ref<InstanceType<typeof MapDialog>>();
 
-/** 是否有位置信息 */
+/** 是否有位置信息（合法经纬度 0 不应视为空） */
 const hasLocation = computed(() => {
-  return !!(props.device.longitude && props.device.latitude);
+  return props.device.longitude != null && props.device.latitude != null;
 });
 
 /** 打开地图弹窗 */
diff --git a/apps/web-antd/src/views/iot/device/device/detail/modules/message.vue b/apps/web-antd/src/views/iot/device/device/detail/modules/message.vue
index 965d5eb24..16efec5cf 100644
--- a/apps/web-antd/src/views/iot/device/device/detail/modules/message.vue
+++ b/apps/web-antd/src/views/iot/device/device/detail/modules/message.vue
@@ -31,6 +31,7 @@ const queryParams = reactive({
 
 const autoRefresh = ref(false); // 自动刷新开关
 let autoRefreshTimer: any = null; // 自动刷新定时器
+let refreshTimer: ReturnType<typeof setTimeout> | undefined; // 延迟刷新定时器
 
 /** 消息方法选项 */
 const methodOptions = computed(() => {
@@ -150,6 +151,10 @@ onBeforeUnmount(() => {
     clearInterval(autoRefreshTimer);
     autoRefreshTimer = null;
   }
+  if (refreshTimer) {
+    clearTimeout(refreshTimer);
+    refreshTimer = undefined;
+  }
 });
 
 /** 初始化 */
@@ -161,9 +166,14 @@ onMounted(() => {
 
 /** 刷新消息列表 */
 function refresh(delay = 0) {
+  if (refreshTimer) {
+    clearTimeout(refreshTimer);
+    refreshTimer = undefined;
+  }
   if (delay > 0) {
-    setTimeout(() => {
+    refreshTimer = setTimeout(() => {
       gridApi.query();
+      refreshTimer = undefined;
     }, delay);
   } else {
     gridApi.query();
diff --git a/apps/web-antd/src/views/iot/device/device/detail/modules/modbus-config-form.vue b/apps/web-antd/src/views/iot/device/device/detail/modules/modbus-config-form.vue
index 669b01fbf..fe3a7afdb 100644
--- a/apps/web-antd/src/views/iot/device/device/detail/modules/modbus-config-form.vue
+++ b/apps/web-antd/src/views/iot/device/device/detail/modules/modbus-config-form.vue
@@ -58,11 +58,13 @@ const [Form, formApi] = useVbenForm({
       componentProps: {
         placeholder: '请输入 Modbus 服务器 IP 地址',
       },
+      // Client 模式专有字段：必填；Server 模式不显示也不校验
       dependencies: {
         triggerFields: [''],
-        show: () => isClient.value, // Client 模式专有字段：IP 地址
+        show: () => isClient.value,
+        rules: () =>
+          isClient.value ? z.string().min(1, '请输入 IP 地址') : null,
       },
-      rules: z.string().min(1, '请输入 IP 地址').optional(),
     },
     {
       fieldName: 'port',
@@ -76,9 +78,12 @@ const [Form, formApi] = useVbenForm({
       },
       dependencies: {
         triggerFields: [''],
-        show: () => isClient.value, // Client 模式专有字段：端口
+        show: () => isClient.value,
+        rules: () =>
+          isClient.value
+            ? z.number({ message: '请输入端口' }).min(1).max(65_535)
+            : null,
       },
-      rules: z.number().min(1).max(65_535).optional(),
       defaultValue: 502,
     },
     {
@@ -106,9 +111,12 @@ const [Form, formApi] = useVbenForm({
       },
       dependencies: {
         triggerFields: [''],
-        show: () => isClient.value, // Client 模式专有字段：连接超时
+        show: () => isClient.value,
+        rules: () =>
+          isClient.value
+            ? z.number({ message: '请输入连接超时时间' }).min(1000)
+            : null,
       },
-      rules: z.number().min(1000).optional(),
       defaultValue: 3000,
     },
     {
@@ -123,9 +131,12 @@ const [Form, formApi] = useVbenForm({
       },
       dependencies: {
         triggerFields: [''],
-        show: () => isClient.value, // Client 模式专有字段：重试间隔
+        show: () => isClient.value,
+        rules: () =>
+          isClient.value
+            ? z.number({ message: '请输入重试间隔' }).min(1000)
+            : null,
       },
-      rules: z.number().min(1000).optional(),
       defaultValue: 10_000,
     },
     {
diff --git a/apps/web-antd/src/views/iot/device/device/detail/modules/modbus-config.vue b/apps/web-antd/src/views/iot/device/device/detail/modules/modbus-config.vue
index 672915a01..ce4d907d8 100644
--- a/apps/web-antd/src/views/iot/device/device/detail/modules/modbus-config.vue
+++ b/apps/web-antd/src/views/iot/device/device/detail/modules/modbus-config.vue
@@ -14,7 +14,7 @@ import { computed, h, onMounted, ref } from 'vue';
 import { confirm, useVbenModal } from '@vben/common-ui';
 import { DICT_TYPE, ModbusFunctionCodeOptions } from '@vben/constants';
 
-import { Button, message } from 'ant-design-vue';
+import { message } from 'ant-design-vue';
 
 import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
 import { getModbusConfig } from '#/api/iot/device/modbus/config';
@@ -307,7 +307,16 @@ onMounted(async () => {
     <!-- 连接配置区域 -->
     <ConfigDescriptions :data="modbusConfig" class="mb-4">
       <template #extra>
-        <Button type="primary" @click="handleEditConfig">编辑</Button>
+        <TableAction
+          :actions="[
+            {
+              label: '编辑',
+              type: 'primary',
+              auth: ['iot:device:create'],
+              onClick: handleEditConfig,
+            },
+          ]"
+        />
       </template>
     </ConfigDescriptions>
 
@@ -320,6 +329,7 @@ onMounted(async () => {
               label: '新增点位',
               type: 'primary',
               icon: ACTION_ICON.ADD,
+              auth: ['iot:device:create'],
               onClick: handleAddPoint,
             },
           ]"
@@ -331,12 +341,14 @@ onMounted(async () => {
             {
               label: '编辑',
               type: 'link',
+              auth: ['iot:device:update'],
               onClick: () => handleEditPoint(row),
             },
             {
               label: '删除',
               type: 'link',
               danger: true,
+              auth: ['iot:device:delete'],
               popConfirm: {
                 title: `确定要删除点位【${row.name}】吗？`,
                 confirm: () => handleDeletePoint(row),
diff --git a/apps/web-antd/src/views/iot/device/device/detail/modules/modbus-point-form.vue b/apps/web-antd/src/views/iot/device/device/detail/modules/modbus-point-form.vue
index cce6c75f1..6f91a6973 100644
--- a/apps/web-antd/src/views/iot/device/device/detail/modules/modbus-point-form.vue
+++ b/apps/web-antd/src/views/iot/device/device/detail/modules/modbus-point-form.vue
@@ -246,10 +246,20 @@ const [Form, formApi] = useVbenForm({
         if (option && option.registerCount > 0) {
           await formApi.setFieldValue('registerCount', option.registerCount);
         }
-        // 重置字节序为第一个选项
+        // 字节序：仅在当前值为空或不属于新 rawDataType 时才重置为第一个选项；
+        // 编辑回填时 setValues 会触发本回调，无条件重置会覆盖已保存字节序
         const byteOrderOptions = getByteOrderOptions(rawDataType);
         if (byteOrderOptions.length > 0) {
-          await formApi.setFieldValue('byteOrder', byteOrderOptions[0]!.value);
+          const currentByteOrder = values.byteOrder;
+          const isCurrentValid =
+            !!currentByteOrder &&
+            byteOrderOptions.some((opt) => opt.value === currentByteOrder);
+          if (!isCurrentValid) {
+            await formApi.setFieldValue(
+              'byteOrder',
+              byteOrderOptions[0]!.value,
+            );
+          }
         }
       }
     }
diff --git a/apps/web-antd/src/views/iot/device/device/detail/modules/simulator.vue b/apps/web-antd/src/views/iot/device/device/detail/modules/simulator.vue
index 3af6c6216..8a58ce5f7 100644
--- a/apps/web-antd/src/views/iot/device/device/detail/modules/simulator.vue
+++ b/apps/web-antd/src/views/iot/device/device/detail/modules/simulator.vue
@@ -6,11 +6,12 @@ import type { IotDeviceApi } from '#/api/iot/device/device';
 import type { IotProductApi } from '#/api/iot/product/product';
 import type { ThingModelApi } from '#/api/iot/thingmodel';
 
-import { computed, ref } from 'vue';
+import { computed, ref, watch } from 'vue';
 
 import { ContentWrap } from '@vben/common-ui';
 import {
   DeviceStateEnum,
+  IoTDataSpecsDataTypeEnum,
   IotDeviceMessageMethodEnum,
   IoTThingModelTypeEnum,
 } from '@vben/constants';
@@ -21,8 +22,10 @@ import {
   Card,
   Col,
   Input,
+  InputNumber,
   message,
   Row,
+  Select,
   Table,
   Tabs,
   Textarea,
@@ -51,7 +54,7 @@ const debugCollapsed = ref(false); // 指令调试区域折叠状态
 const messageCollapsed = ref(false); // 设备消息区域折叠状态
 
 // 表单数据：存储用户输入的模拟值
-const formData = ref<Record<string, string>>({});
+const formData = ref<Record<string, any>>({});
 
 // 根据类型过滤物模型数据
 const getFilteredThingModelList = (type: number) => {
@@ -184,21 +187,101 @@ const serviceColumns = [
 
 // 获取表单值
 function getFormValue(identifier: string) {
-  return formData.value[identifier] || '';
+  return formData.value[identifier] ?? '';
 }
 
 // 设置表单值
-function setFormValue(identifier: string, value: string) {
+function setFormValue(identifier: string, value: any) {
   formData.value[identifier] = value;
 }
 
+/** 获取属性数据类型 */
+function getPropertyDataType(row: ThingModelApi.ThingModel) {
+  return row.property?.dataType;
+}
+
+/** 判断属性是否为数值类型 */
+function isNumberProperty(row: ThingModelApi.ThingModel) {
+  return [
+    IoTDataSpecsDataTypeEnum.DOUBLE,
+    IoTDataSpecsDataTypeEnum.FLOAT,
+    IoTDataSpecsDataTypeEnum.INT,
+  ].includes(getPropertyDataType(row) as any);
+}
+
+/** 判断属性是否使用下拉选项 */
+function isSelectProperty(row: ThingModelApi.ThingModel) {
+  return [
+    IoTDataSpecsDataTypeEnum.BOOL,
+    IoTDataSpecsDataTypeEnum.ENUM,
+  ].includes(getPropertyDataType(row) as any);
+}
+
+/** 获取属性选项 */
+function getPropertyOptions(row: ThingModelApi.ThingModel) {
+  const list = row.property?.dataSpecsList || [];
+  if (list.length > 0) {
+    return list.map((item: any) => ({
+      label: item.name || item.label || String(item.value),
+      value: String(item.value),
+    }));
+  }
+  if (getPropertyDataType(row) === IoTDataSpecsDataTypeEnum.BOOL) {
+    return [
+      { label: '真 (true)', value: 'true' },
+      { label: '假 (false)', value: 'false' },
+    ];
+  }
+  return [];
+}
+
+/** 获取物模型选项原始值 */
+function getMatchedPropertyOption(row: ThingModelApi.ThingModel, value: any) {
+  return row.property?.dataSpecsList?.find(
+    (item: any) => String(item.value) === String(value),
+  );
+}
+
+/** 按物模型数据类型转换属性值 */
+function normalizePropertyValue(row: ThingModelApi.ThingModel, value: any) {
+  if (value === undefined || value === null || value === '') {
+    return undefined;
+  }
+  const dataType = getPropertyDataType(row);
+  if (isNumberProperty(row)) {
+    return Number(value);
+  }
+  if (
+    [IoTDataSpecsDataTypeEnum.BOOL, IoTDataSpecsDataTypeEnum.ENUM].includes(
+      dataType as any,
+    )
+  ) {
+    const option = getMatchedPropertyOption(row, value);
+    if (option) {
+      return option.value;
+    }
+  }
+  if (dataType === IoTDataSpecsDataTypeEnum.BOOL) {
+    if (String(value) === 'true') {
+      return true;
+    }
+    if (String(value) === 'false') {
+      return false;
+    }
+  }
+  return value;
+}
+
 // 属性上报
 async function handlePropertyPost() {
   try {
     const params: Record<string, any> = {};
     propertyList.value.forEach((item) => {
-      const value = formData.value[item.identifier!];
-      if (value) {
+      const value = normalizePropertyValue(
+        item,
+        formData.value[item.identifier!],
+      );
+      if (value !== undefined) {
         params[item.identifier!] = value;
       }
     });
@@ -229,13 +312,15 @@ async function handleEventPost(row: ThingModelApi.ThingModel) {
     const valueStr = formData.value[row.identifier!];
     let eventValue: any;
 
-    if (valueStr) {
-      try {
-        eventValue = JSON.parse(valueStr);
-      } catch {
-        message.error('事件参数格式错误，请输入有效的JSON格式');
-        return;
-      }
+    if (valueStr === undefined || valueStr === null || valueStr === '') {
+      message.warning('请输入事件参数');
+      return;
+    }
+    try {
+      eventValue = JSON.parse(valueStr);
+    } catch {
+      message.error('事件参数格式错误，请输入有效的JSON格式');
+      return;
     }
 
     // 与后端 IotDeviceEventPostReqDTO 对齐 ：{ identifier, value, time }
@@ -281,8 +366,11 @@ async function handlePropertySet() {
   try {
     const params: Record<string, any> = {};
     propertyList.value.forEach((item) => {
-      const value = formData.value[item.identifier!];
-      if (value) {
+      const value = normalizePropertyValue(
+        item,
+        formData.value[item.identifier!],
+      );
+      if (value !== undefined) {
         params[item.identifier!] = value;
       }
     });
@@ -313,13 +401,23 @@ async function handleServiceInvoke(row: ThingModelApi.ThingModel) {
     const valueStr = formData.value[row.identifier!];
     let inputParams: any = {};
 
-    if (valueStr) {
-      try {
-        inputParams = JSON.parse(valueStr);
-      } catch {
-        message.error('服务参数格式错误，请输入有效的JSON格式');
-        return;
-      }
+    if (valueStr === undefined || valueStr === null || valueStr === '') {
+      message.warning('请输入服务参数');
+      return;
+    }
+    try {
+      inputParams = JSON.parse(valueStr);
+    } catch {
+      message.error('服务参数格式错误，请输入有效的JSON格式');
+      return;
+    }
+    if (
+      typeof inputParams !== 'object' ||
+      inputParams === null ||
+      Array.isArray(inputParams)
+    ) {
+      message.error('服务参数必须是 JSON 对象');
+      return;
     }
 
     // 与后端 IotDeviceServiceInvokeReqDTO 对齐 ：{ identifier, inputParams }
@@ -340,6 +438,11 @@ async function handleServiceInvoke(row: ThingModelApi.ThingModel) {
     console.error(error);
   }
 }
+
+/** 切换调试方法时清空输入，避免不同方法之间串台提交 */
+watch([activeTab, upstreamTab, downstreamTab], () => {
+  formData.value = {};
+});
 </script>
 
 <template>
@@ -392,7 +495,29 @@ async function handleServiceInvoke(row: ThingModelApi.ThingModel) {
                             <DataDefinition :data="record" />
                           </template>
                           <template v-else-if="column.key === 'value'">
+                            <InputNumber
+                              v-if="isNumberProperty(record)"
+                              :value="getFormValue(record.identifier)"
+                              placeholder="输入值"
+                              size="small"
+                              class="w-full"
+                              @update:value="
+                                setFormValue(record.identifier, $event)
+                              "
+                            />
+                            <Select
+                              v-else-if="isSelectProperty(record)"
+                              :value="getFormValue(record.identifier)"
+                              :options="getPropertyOptions(record)"
+                              placeholder="请选择值"
+                              size="small"
+                              class="w-full"
+                              @update:value="
+                                setFormValue(record.identifier, $event)
+                              "
+                            />
                             <Input
+                              v-else
                               :value="getFormValue(record.identifier)"
                               placeholder="输入值"
                               size="small"
@@ -514,7 +639,29 @@ async function handleServiceInvoke(row: ThingModelApi.ThingModel) {
                             <DataDefinition :data="record" />
                           </template>
                           <template v-else-if="column.key === 'value'">
+                            <InputNumber
+                              v-if="isNumberProperty(record)"
+                              :value="getFormValue(record.identifier)"
+                              placeholder="输入值"
+                              size="small"
+                              class="w-full"
+                              @update:value="
+                                setFormValue(record.identifier, $event)
+                              "
+                            />
+                            <Select
+                              v-else-if="isSelectProperty(record)"
+                              :value="getFormValue(record.identifier)"
+                              :options="getPropertyOptions(record)"
+                              placeholder="请选择值"
+                              size="small"
+                              class="w-full"
+                              @update:value="
+                                setFormValue(record.identifier, $event)
+                              "
+                            />
                             <Input
+                              v-else
                               :value="getFormValue(record.identifier)"
                               placeholder="输入值"
                               size="small"
diff --git a/apps/web-antd/src/views/iot/device/device/detail/modules/sub-device.vue b/apps/web-antd/src/views/iot/device/device/detail/modules/sub-device.vue
index 36d1fc372..8515630fa 100644
--- a/apps/web-antd/src/views/iot/device/device/detail/modules/sub-device.vue
+++ b/apps/web-antd/src/views/iot/device/device/detail/modules/sub-device.vue
@@ -317,6 +317,7 @@ watch(
               label: '添加子设备',
               type: 'primary',
               icon: ACTION_ICON.ADD,
+              auth: ['iot:device:update'],
               onClick: openAddModal,
             },
             {
@@ -324,6 +325,7 @@ watch(
               type: 'primary',
               danger: true,
               icon: ACTION_ICON.DELETE,
+              auth: ['iot:device:update'],
               disabled: isEmpty(checkedIds),
               onClick: handleUnbindBatch,
             },
@@ -342,6 +344,7 @@ watch(
               label: '解绑',
               type: 'link',
               danger: true,
+              auth: ['iot:device:update'],
               onClick: () => handleUnbind(row),
             },
           ]"
diff --git a/apps/web-antd/src/views/iot/device/device/detail/modules/thing-model-event.vue b/apps/web-antd/src/views/iot/device/device/detail/modules/thing-model-event.vue
index 52a175a06..30d1f65a2 100644
--- a/apps/web-antd/src/views/iot/device/device/detail/modules/thing-model-event.vue
+++ b/apps/web-antd/src/views/iot/device/device/detail/modules/thing-model-event.vue
@@ -3,7 +3,7 @@
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
 import type { ThingModelApi } from '#/api/iot/thingmodel';
 
-import { computed, onMounted, reactive, watch } from 'vue';
+import { computed, onBeforeUnmount, onMounted, reactive, watch } from 'vue';
 
 import { Page } from '@vben/common-ui';
 import {
@@ -29,6 +29,7 @@ const queryParams = reactive({
   identifier: '',
   times: undefined as [string, string] | undefined,
 });
+let refreshTimer: ReturnType<typeof setTimeout> | undefined; // 延迟刷新定时器
 
 /** 事件类型的物模型数据 */
 const eventThingModels = computed(() => {
@@ -153,8 +154,15 @@ function parseParams(params: string) {
 
 /** 刷新列表 */
 function refresh(delay = 0) {
+  if (refreshTimer) {
+    clearTimeout(refreshTimer);
+    refreshTimer = undefined;
+  }
   if (delay > 0) {
-    setTimeout(() => gridApi.query(), delay);
+    refreshTimer = setTimeout(() => {
+      gridApi.query();
+      refreshTimer = undefined;
+    }, delay);
   } else {
     gridApi.query();
   }
@@ -177,6 +185,14 @@ onMounted(() => {
   }
 });
 
+/** 组件卸载时清除延迟刷新定时器 */
+onBeforeUnmount(() => {
+  if (refreshTimer) {
+    clearTimeout(refreshTimer);
+    refreshTimer = undefined;
+  }
+});
+
 /** 暴露方法给父组件 */
 defineExpose({
   refresh,
diff --git a/apps/web-antd/src/views/iot/device/device/detail/modules/thing-model-property-history.vue b/apps/web-antd/src/views/iot/device/device/detail/modules/thing-model-property-history.vue
index 73fc51173..1a03e1293 100644
--- a/apps/web-antd/src/views/iot/device/device/detail/modules/thing-model-property-history.vue
+++ b/apps/web-antd/src/views/iot/device/device/detail/modules/thing-model-property-history.vue
@@ -33,7 +33,7 @@ defineProps<{ deviceId: number }>();
 const dialogVisible = ref(false); // 弹窗的是否展示
 const loading = ref(false);
 const viewMode = ref<'chart' | 'list'>('chart'); // 视图模式状态
-const list = ref<IotDeviceApi.DevicePropertyDetail[]>([]); // 列表的数据
+const list = ref<Array<IotDeviceApi.DeviceProperty & { _rowKey: string }>>([]); // 列表的数据
 const total = ref(0); // 总数据量
 const thingModelDataType = ref<string>(''); // 物模型数据类型
 const propertyIdentifier = ref<string>(''); // 属性标识符
@@ -137,23 +137,15 @@ const tableColumns = computed(() => [
   },
 ]); // 表格列配置
 
-const paginationConfig = computed(() => ({
-  current: 1,
-  pageSize: 10,
-  total: total.value,
-  showSizeChanger: true,
-  showQuickJumper: true,
-  pageSizeOptions: ['10', '20', '50', '100'],
-  showTotal: (total: number) => `共 ${total} 条数据`,
-})); // 分页配置
-
 /** 获得设备历史数据 */
 async function getList() {
   loading.value = true;
   try {
-    // 后端直接返回数组
     const data = await getHistoryDevicePropertyList(queryParams);
-    list.value = (data || []) as IotDeviceApi.DevicePropertyDetail[];
+    list.value = (data || []).map((item, idx) => ({
+      ...item,
+      _rowKey: `${item.updateTime ?? ''}-${idx}`, // 后端直接返回数组，仅含 value/updateTime，给每行补 _rowKey 保证唯一
+    }));
     total.value = list.value.length;
 
     // 如果是图表模式且支持图表展示，等待渲染图表
@@ -436,9 +428,9 @@ defineExpose({ open }); // 提供 open 方法，用于打开弹窗
           <Table
             :columns="tableColumns"
             :data-source="list"
-            :pagination="paginationConfig"
+            :pagination="false"
             :scroll="{ y: 500 }"
-            row-key="updateTime"
+            row-key="_rowKey"
             size="small"
           >
             <template #bodyCell="{ column, record }">
diff --git a/apps/web-antd/src/views/iot/device/device/detail/modules/thing-model-property.vue b/apps/web-antd/src/views/iot/device/device/detail/modules/thing-model-property.vue
index c73ebe2d8..e0ce9dc6c 100644
--- a/apps/web-antd/src/views/iot/device/device/detail/modules/thing-model-property.vue
+++ b/apps/web-antd/src/views/iot/device/device/detail/modules/thing-model-property.vue
@@ -207,6 +207,13 @@ function handleQuery() {
   }
 }
 
+/** 搜索关键词变化 */
+function handleKeywordChange(event: Event) {
+  if (!(event.target as HTMLInputElement).value) {
+    handleQuery();
+  }
+}
+
 /** 视图切换 */
 async function handleViewModeChange(mode: 'card' | 'list') {
   if (viewMode.value === mode) {
@@ -281,6 +288,7 @@ onBeforeUnmount(() => {
           allow-clear
           placeholder="请输入属性名称、标识符"
           style="width: 240px"
+          @change="handleKeywordChange"
           @press-enter="handleQuery"
         />
         <Switch
diff --git a/apps/web-antd/src/views/iot/device/device/detail/modules/thing-model-service.vue b/apps/web-antd/src/views/iot/device/device/detail/modules/thing-model-service.vue
index 693b65f9f..cca89e44f 100644
--- a/apps/web-antd/src/views/iot/device/device/detail/modules/thing-model-service.vue
+++ b/apps/web-antd/src/views/iot/device/device/detail/modules/thing-model-service.vue
@@ -3,7 +3,7 @@
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
 import type { ThingModelApi } from '#/api/iot/thingmodel';
 
-import { computed, onMounted, reactive, watch } from 'vue';
+import { computed, onBeforeUnmount, onMounted, reactive, watch } from 'vue';
 
 import { Page } from '@vben/common-ui';
 import {
@@ -29,6 +29,7 @@ const queryParams = reactive({
   identifier: '',
   times: undefined as [string, string] | undefined,
 });
+let refreshTimer: ReturnType<typeof setTimeout> | undefined; // 延迟刷新定时器
 
 /** 服务类型的物模型数据 */
 const serviceThingModels = computed(() => {
@@ -167,8 +168,15 @@ function parseParams(params: string) {
 
 /** 刷新列表 */
 function refresh(delay = 0) {
+  if (refreshTimer) {
+    clearTimeout(refreshTimer);
+    refreshTimer = undefined;
+  }
   if (delay > 0) {
-    setTimeout(() => gridApi.query(), delay);
+    refreshTimer = setTimeout(() => {
+      gridApi.query();
+      refreshTimer = undefined;
+    }, delay);
   } else {
     gridApi.query();
   }
@@ -191,6 +199,14 @@ onMounted(() => {
   }
 });
 
+/** 组件卸载时清除延迟刷新定时器 */
+onBeforeUnmount(() => {
+  if (refreshTimer) {
+    clearTimeout(refreshTimer);
+    refreshTimer = undefined;
+  }
+});
+
 /** 暴露方法给父组件 */
 defineExpose({
   refresh,
diff --git a/apps/web-antd/src/views/iot/device/device/index.vue b/apps/web-antd/src/views/iot/device/device/index.vue
index 4d21ca3bf..37c92caf7 100644
--- a/apps/web-antd/src/views/iot/device/device/index.vue
+++ b/apps/web-antd/src/views/iot/device/device/index.vue
@@ -9,7 +9,7 @@ import type { IotProductApi } from '#/api/iot/product/product';
 import { nextTick, onMounted, ref } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
 
-import { Page, useVbenModal } from '@vben/common-ui';
+import { confirm, Page, useVbenModal } from '@vben/common-ui';
 import { DICT_TYPE } from '@vben/constants';
 import { getDictOptions } from '@vben/hooks';
 import { IconifyIcon } from '@vben/icons';
@@ -169,6 +169,7 @@ async function handleDeleteBatch() {
     message.warning('请选择要删除的设备');
     return;
   }
+  await confirm($t('ui.actionMessage.deleteBatchConfirm'));
   const hideLoading = message.loading({
     content: $t('ui.actionMessage.deletingBatch'),
     duration: 0,
@@ -214,6 +215,9 @@ const [Grid, gridApi] = useVbenVxeGrid({
     columns: useGridColumns(),
     height: 'auto',
     keepSource: true,
+    pagerConfig: {
+      pageSize: 12,
+    },
     proxyConfig: {
       ajax: {
         query: async ({
@@ -429,6 +433,11 @@ onMounted(async () => {
 
     <!-- 列表视图 -->
     <Grid table-title="设备列表" v-show="viewMode === 'list'">
+      <template #deviceName="{ row }">
+        <a class="cursor-pointer text-primary" @click="openDetail(row.id!)">
+          {{ row.deviceName }}
+        </a>
+      </template>
       <template #product="{ row }">
         <a
           class="cursor-pointer text-primary"
@@ -465,7 +474,7 @@ onMounted(async () => {
             {
               label: '日志',
               type: 'link',
-              auth: ['iot:device:message-query'],
+              auth: ['iot:device:query'],
               onClick: openModel.bind(null, row.id!),
             },
             {
diff --git a/apps/web-antd/src/views/iot/device/device/modules/card-view.vue b/apps/web-antd/src/views/iot/device/device/modules/card-view.vue
index f1979dcbc..eab4b9602 100644
--- a/apps/web-antd/src/views/iot/device/device/modules/card-view.vue
+++ b/apps/web-antd/src/views/iot/device/device/modules/card-view.vue
@@ -177,13 +177,16 @@ onMounted(() => {
                 </div>
                 <div class="flex items-center text-[13px]">
                   <span class="mr-2 shrink-0 opacity-65 dark:text-white/65">
-                    Deviceid
+                    备注名称
                   </span>
-                  <Tooltip :title="String(item.id)" placement="top">
+                  <Tooltip
+                    :title="item.nickname || item.deviceName"
+                    placement="top"
+                  >
                     <span
-                      class="inline-block max-w-[150px] cursor-pointer truncate align-middle font-mono text-xs opacity-85 dark:text-white/75"
+                      class="inline-block max-w-[150px] cursor-pointer truncate align-middle text-xs opacity-85 dark:text-white/75"
                     >
-                      {{ item.id }}
+                      {{ item.nickname || item.deviceName }}
                     </span>
                   </Tooltip>
                 </div>
@@ -226,7 +229,7 @@ onMounted(() => {
                 详情
               </Button>
               <Button
-                v-if="hasAccessByCodes(['iot:device:message-query'])"
+                v-if="hasAccessByCodes(['iot:device:query'])"
                 size="small"
                 class="!h-8 min-w-0 flex-1 rounded-md !border-[#fa8c16] !text-[13px] !text-[#fa8c16] transition-all duration-200 hover:!bg-[#fa8c16] hover:!text-white"
                 @click="emit('model', item.id!)"
diff --git a/apps/web-antd/src/views/iot/device/device/modules/import-form.vue b/apps/web-antd/src/views/iot/device/device/modules/import-form.vue
index 7bce20327..6181716f3 100644
--- a/apps/web-antd/src/views/iot/device/device/modules/import-form.vue
+++ b/apps/web-antd/src/views/iot/device/device/modules/import-form.vue
@@ -3,7 +3,7 @@ import type { FileType } from 'ant-design-vue/es/upload/interface';
 
 import type { IotDeviceApi } from '#/api/iot/device/device';
 
-import { useVbenModal } from '@vben/common-ui';
+import { alert, useVbenModal } from '@vben/common-ui';
 import { downloadFileFromBlobPart } from '@vben/utils';
 
 import { Button, message, Upload } from 'ant-design-vue';
@@ -61,7 +61,7 @@ const [Modal, modalApi] = useVbenModal({
             text += `< ${deviceName}: ${importData.failureDeviceNames[deviceName]} >`;
           }
         }
-        message.info(text);
+        await alert(text, '导入结果');
       }
       // 关闭并提示
       await modalApi.close();
@@ -92,18 +92,18 @@ async function handleDownload() {
       <template #file>
         <div class="w-full">
           <Upload
-            :before-upload="beforeUpload"
             :max-count="1"
             accept=".xls,.xlsx"
+            :before-upload="beforeUpload"
           >
-            <Button type="primary"> 选择 Excel 文件</Button>
+            <Button type="primary"> 选择 Excel 文件 </Button>
           </Upload>
         </div>
       </template>
     </Form>
     <template #prepend-footer>
       <div class="flex flex-auto items-center">
-        <Button @click="handleDownload"> 下载导入模板</Button>
+        <Button @click="handleDownload"> 下载导入模板 </Button>
       </div>
     </template>
   </Modal>
diff --git a/apps/web-antd/src/views/iot/device/group/data.ts b/apps/web-antd/src/views/iot/device/group/data.ts
index 1c5b07380..9de20e9d8 100644
--- a/apps/web-antd/src/views/iot/device/group/data.ts
+++ b/apps/web-antd/src/views/iot/device/group/data.ts
@@ -2,7 +2,7 @@ import type { VbenFormSchema } from '#/adapter/form';
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
 import type { IotDeviceGroupApi } from '#/api/iot/device/group';
 
-import { CommonStatusEnum, DICT_TYPE } from '@vben/constants';
+import { DICT_TYPE } from '@vben/constants';
 import { getDictOptions } from '@vben/hooks';
 
 import { z } from '#/adapter/form';
@@ -26,10 +26,7 @@ export function useFormSchema(): VbenFormSchema[] {
       componentProps: {
         placeholder: '请输入分组名称',
       },
-      rules: z
-        .string()
-        .min(1, '分组名称不能为空')
-        .max(64, '分组名称长度不能超过 64 个字符'),
+      rules: z.string().min(1, '分组名称不能为空'),
     },
     {
       fieldName: 'status',
@@ -40,7 +37,7 @@ export function useFormSchema(): VbenFormSchema[] {
         buttonStyle: 'solid',
         optionType: 'button',
       },
-      rules: z.number().default(CommonStatusEnum.ENABLE),
+      rules: 'required',
     },
     {
       fieldName: 'description',
diff --git a/apps/web-antd/src/views/iot/device/group/index.vue b/apps/web-antd/src/views/iot/device/group/index.vue
index 5815ac515..095203830 100644
--- a/apps/web-antd/src/views/iot/device/group/index.vue
+++ b/apps/web-antd/src/views/iot/device/group/index.vue
@@ -35,6 +35,10 @@ function handleEdit(row: IotDeviceGroupApi.DeviceGroup) {
 
 /** 删除设备分组 */
 async function handleDelete(row: IotDeviceGroupApi.DeviceGroup) {
+  if (row.deviceCount && row.deviceCount > 0) {
+    message.warning(`分组「${row.name}」下存在 ${row.deviceCount} 台设备，无法删除`);
+    return;
+  }
   const hideLoading = message.loading({
     content: $t('ui.actionMessage.deleting', [row.name]),
     duration: 0,
diff --git a/apps/web-antd/src/views/iot/home/data.ts b/apps/web-antd/src/views/iot/home/data.ts
index 433db75c7..eaa9159f4 100644
--- a/apps/web-antd/src/views/iot/home/data.ts
+++ b/apps/web-antd/src/views/iot/home/data.ts
@@ -9,12 +9,12 @@ export const defaultStatsData: StatsData = {
   productCount: -1,
   deviceCount: -1,
   deviceMessageCount: -1,
-  productCategoryTodayCount: 0,
-  productTodayCount: 0,
-  deviceTodayCount: 0,
-  deviceMessageTodayCount: 0,
-  deviceOnlineCount: 0,
-  deviceOfflineCount: 0,
-  deviceInactiveCount: 0,
+  productCategoryTodayCount: -1,
+  productTodayCount: -1,
+  deviceTodayCount: -1,
+  deviceMessageTodayCount: -1,
+  deviceOnlineCount: -1,
+  deviceOfflineCount: -1,
+  deviceInactiveCount: -1,
   productCategoryDeviceCounts: {},
 };
diff --git a/apps/web-antd/src/views/iot/home/modules/device-map-card.vue b/apps/web-antd/src/views/iot/home/modules/device-map-card.vue
index 6f82c94da..7989a478e 100644
--- a/apps/web-antd/src/views/iot/home/modules/device-map-card.vue
+++ b/apps/web-antd/src/views/iot/home/modules/device-map-card.vue
@@ -1,11 +1,13 @@
 <script lang="ts" setup>
+import type { NumberDictDataType } from '@vben/hooks';
+
 import type { IotDeviceApi } from '#/api/iot/device/device';
 
 import { computed, nextTick, onMounted, onUnmounted, ref } from 'vue';
 import { useRouter } from 'vue-router';
 
 import { DeviceStateEnum, DICT_TYPE } from '@vben/constants';
-import { getDictLabel } from '@vben/hooks';
+import { getDictLabel, getDictOptions } from '@vben/hooks';
 
 import { Card, Empty, Spin } from 'ant-design-vue';
 
@@ -20,15 +22,20 @@ let mapInstance: any = null; // 百度地图实例
 const loading = ref(true); // 加载状态
 const deviceList = ref<IotDeviceApi.Device[]>([]); // 设备分布列表
 
-/** 是否有数据 */
-const hasData = computed(() => deviceList.value.length > 0);
+const hasData = computed(() => deviceList.value.length > 0); // 是否有数据
+
+const stateOptions = computed(() =>
+  getDictOptions(
+    DICT_TYPE.IOT_DEVICE_STATE,
+    'number',
+  ) as NumberDictDataType[],
+); // 状态图例列表（从字典获取）
 
-/** 设备状态颜色映射 */
 const stateColorMap: Record<number, string> = {
   [DeviceStateEnum.INACTIVE]: '#EAB308', // 待激活 - 黄色
   [DeviceStateEnum.ONLINE]: '#22C55E', // 在线 - 绿色
   [DeviceStateEnum.OFFLINE]: '#9CA3AF', // 离线 - 灰色
-};
+}; // 设备状态颜色映射
 
 /** 获取设备状态配置；名称走字典，颜色用本地映射 */
 function getStateConfig(state: number): { color: string; name: string } {
@@ -111,19 +118,22 @@ function initMap() {
       // 信息窗口打开后绑定链接点击事件
       infoWindow.addEventListener('open', () => {
         setTimeout(() => {
-          const link = document.querySelector('.device-link');
-          if (link) {
-            link.addEventListener('click', (e) => {
-              e.preventDefault();
-              const deviceId = (e.target as HTMLElement).dataset.id;
-              if (deviceId) {
-                router.push({
-                  name: 'IoTDeviceDetail',
-                  params: { id: deviceId },
-                });
-              }
-            });
+          const link = document.querySelector(
+            '.BMap_bubble_content .device-link',
+          );
+          if (!link) {
+            return;
           }
+          link.addEventListener('click', (e) => {
+            e.preventDefault();
+            if (device.id === undefined || device.id === null) {
+              return;
+            }
+            router.push({
+              name: 'IoTDeviceDetail',
+              params: { id: device.id },
+            });
+          });
         }, 100);
       });
 
@@ -174,28 +184,18 @@ onUnmounted(() => {
   <Card class="h-full" title="设备分布地图">
     <template #extra>
       <div class="flex items-center gap-4 text-sm">
-        <span class="flex items-center gap-1">
-          <span
-            class="inline-block h-3 w-3 rounded-full"
-            :style="{ backgroundColor: stateColorMap[DeviceStateEnum.ONLINE] }"
-          ></span>
-          <span class="text-gray-500">在线</span>
-        </span>
-        <span class="flex items-center gap-1">
-          <span
-            class="inline-block h-3 w-3 rounded-full"
-            :style="{ backgroundColor: stateColorMap[DeviceStateEnum.OFFLINE] }"
-          ></span>
-          <span class="text-gray-500">离线</span>
-        </span>
-        <span class="flex items-center gap-1">
+        <span
+          v-for="item in stateOptions"
+          :key="item.value"
+          class="flex items-center gap-1"
+        >
           <span
             class="inline-block h-3 w-3 rounded-full"
             :style="{
-              backgroundColor: stateColorMap[DeviceStateEnum.INACTIVE],
+              backgroundColor: stateColorMap[item.value],
             }"
           ></span>
-          <span class="text-gray-500">待激活</span>
+          <span class="text-gray-500">{{ item.label }}</span>
         </span>
       </div>
     </template>
diff --git a/apps/web-antd/src/views/iot/home/modules/message-trend-card.vue b/apps/web-antd/src/views/iot/home/modules/message-trend-card.vue
index e27d4ce7b..d6696ec6d 100644
--- a/apps/web-antd/src/views/iot/home/modules/message-trend-card.vue
+++ b/apps/web-antd/src/views/iot/home/modules/message-trend-card.vue
@@ -3,7 +3,7 @@ import type { Dayjs } from 'dayjs';
 
 import type { IotStatisticsApi } from '#/api/iot/statistics';
 
-import { computed, nextTick, reactive, ref } from 'vue';
+import { computed, nextTick, onMounted, reactive, ref } from 'vue';
 
 import { DICT_TYPE } from '@vben/constants';
 import { getDictOptions } from '@vben/hooks';
@@ -26,12 +26,13 @@ const loading = ref(false); // 加载状态
 const messageData = ref<IotStatisticsApi.DeviceMessageSummaryByDateRespVO[]>(
   [],
 ); // 消息趋势数据
+const isFirstMount = ref(true); // 首次挂载标记，用于跳过子组件 mount 时的默认 emit
 
 /** 时间范围（仅日期，不包含时分秒） */
 const dateRange = ref<[string, string]>([
-  // 默认显示最近一周的数据（包含今天和前六天）
-  dayjs().subtract(6, 'day').format('YYYY-MM-DD'),
-  dayjs().format('YYYY-MM-DD'),
+  // 默认显示最近一周的数据（截至昨天）
+  dayjs().subtract(7, 'day').format('YYYY-MM-DD'),
+  dayjs().subtract(1, 'day').format('YYYY-MM-DD'),
 ]);
 
 /** 将日期范围转换为带时分秒的格式 */
@@ -74,6 +75,11 @@ function handleDateRangeChange(times?: [Dayjs, Dayjs]) {
   ];
   // 将选择的日期转换为带时分秒的格式（开始日期 00:00:00，结束日期 23:59:59）
   queryParams.times = formatDateRangeWithTime(dateRange.value);
+  if (isFirstMount.value) {
+    // 子组件 ShortcutDateRangePicker mount 时会 emit 一次默认日期范围，跳过 fetch；
+    // 首次请求统一由父组件 onMounted 发起，避免双请求
+    return;
+  }
   handleQuery();
 }
 
@@ -91,6 +97,8 @@ async function fetchMessageData() {
   loading.value = true;
   try {
     messageData.value = await getDeviceMessageSummaryByDate(queryParams);
+  } catch {
+    messageData.value = [];
   } finally {
     loading.value = false;
     await renderChartWhenReady();
@@ -122,6 +130,13 @@ async function renderChartWhenReady() {
   await nextTick();
   initChart();
 }
+// 父组件挂载后统一发起首次请求；
+// 原因：子组件 ShortcutDateRangePicker 早期 emit 触发的请求落在 useEcharts isActiveRef = false 阶段，会被 renderEcharts 静默丢弃；
+// 通过 handleDateRangeChange 在 isFirstMount=true 时跳过 fetch，由这里统一发起一次，避免双请求
+onMounted(() => {
+  fetchMessageData();
+  isFirstMount.value = false;
+});
 </script>
 
 <template>
diff --git a/apps/web-antd/src/views/iot/ota/firmware/data.ts b/apps/web-antd/src/views/iot/ota/firmware/data.ts
index d831616d9..a8d52702f 100644
--- a/apps/web-antd/src/views/iot/ota/firmware/data.ts
+++ b/apps/web-antd/src/views/iot/ota/firmware/data.ts
@@ -24,7 +24,11 @@ export function getProductName(productId?: number): string {
 export function useDetailSchema(): DescriptionItemSchema[] {
   return [
     { field: 'name', label: '固件名称' },
-    { field: 'productName', label: '所属产品' },
+    {
+      field: 'productName',
+      label: '所属产品',
+      render: (val) => val || '-',
+    },
     { field: 'version', label: '固件版本' },
     {
       field: 'createTime',
@@ -65,10 +69,12 @@ export function useFormSchema(): VbenFormSchema[] {
         valueField: 'id',
         placeholder: '请选择产品',
       },
-      rules: 'required',
       dependencies: {
         triggerFields: ['id'],
-        show: (values) => !values.id,
+        componentProps: (values) => ({
+          disabled: !!values.id,
+        }),
+        rules: (values) => (values.id ? null : 'required'),
       },
     },
     {
@@ -78,10 +84,12 @@ export function useFormSchema(): VbenFormSchema[] {
       componentProps: {
         placeholder: '请输入版本号',
       },
-      rules: 'required',
       dependencies: {
         triggerFields: ['id'],
-        show: (values) => !values.id,
+        componentProps: (values) => ({
+          disabled: !!values.id,
+        }),
+        rules: (values) => (values.id ? null : 'required'),
       },
     },
     {
@@ -99,14 +107,16 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'FileUpload',
       componentProps: {
         maxNumber: 1,
-        accept: ['bin', 'hex', 'zip'],
+        accept: ['bin', 'zip', 'pdf'],
         maxSize: 50,
-        helpText: '支持上传 .bin、.hex、.zip 格式的固件文件，最大 50MB',
+        helpText: '支持上传 .bin、.zip、.pdf 格式的固件文件，最大 50MB',
       },
-      rules: 'required',
       dependencies: {
         triggerFields: ['id'],
-        show: (values) => !values.id,
+        componentProps: (values) => ({
+          disabled: !!values.id,
+        }),
+        rules: (values) => (values.id ? null : 'required'),
       },
     },
   ];
diff --git a/apps/web-antd/src/views/iot/ota/firmware/index.vue b/apps/web-antd/src/views/iot/ota/firmware/index.vue
index 912af9c61..36beb27cc 100644
--- a/apps/web-antd/src/views/iot/ota/firmware/index.vue
+++ b/apps/web-antd/src/views/iot/ota/firmware/index.vue
@@ -13,7 +13,11 @@ import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
 import { deleteOtaFirmware, getOtaFirmwarePage } from '#/api/iot/ota/firmware';
 import { $t } from '#/locales';
 
-import { getProductName, useGridColumns, useGridFormSchema } from './data';
+import {
+  getProductName,
+  useGridColumns,
+  useGridFormSchema,
+} from './data';
 import OtaFirmwareForm from './modules/form.vue';
 
 const { push } = useRouter();
@@ -116,7 +120,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
       <!-- 所属产品列：点击跳产品详情 -->
       <template #productName="{ row }">
         <a
-          v-if="row.productId"
+          v-if="row.productId && getProductName(row.productId) !== '-'"
           class="cursor-pointer text-primary hover:underline"
           @click="handleOpenProductDetail(row.productId)"
         >
diff --git a/apps/web-antd/src/views/iot/ota/task/modules/list.vue b/apps/web-antd/src/views/iot/ota/task/modules/list.vue
index b46a4a57f..5dcbd9853 100644
--- a/apps/web-antd/src/views/iot/ota/task/modules/list.vue
+++ b/apps/web-antd/src/views/iot/ota/task/modules/list.vue
@@ -44,7 +44,7 @@ async function handleRefresh() {
 
 /** 按任务名称搜索 */
 async function handleSearch() {
-  await gridApi.query();
+  await gridApi.reload();
 }
 
 /** 新增任务 */
diff --git a/apps/web-antd/src/views/iot/ota/task/record/modules/list.vue b/apps/web-antd/src/views/iot/ota/task/record/modules/list.vue
index 9a702e1f2..3e562d96d 100644
--- a/apps/web-antd/src/views/iot/ota/task/record/modules/list.vue
+++ b/apps/web-antd/src/views/iot/ota/task/record/modules/list.vue
@@ -40,7 +40,7 @@ const statusTabs = computed(() => {
 /** 切换标签 */
 async function handleTabChange(tabKey: number | string) {
   activeTab.value = String(tabKey);
-  await gridApi.query();
+  await gridApi.reload();
 }
 
 /** 取消单条记录的升级 */
@@ -90,7 +90,7 @@ watch(
   async (val) => {
     if (val) {
       activeTab.value = '';
-      await gridApi.query();
+      await gridApi.reload();
     }
   },
 );
diff --git a/apps/web-antd/src/views/iot/product/product/data.ts b/apps/web-antd/src/views/iot/product/product/data.ts
index 4c8e797e6..3abe66307 100644
--- a/apps/web-antd/src/views/iot/product/product/data.ts
+++ b/apps/web-antd/src/views/iot/product/product/data.ts
@@ -110,7 +110,6 @@ export function useBasicFormSchema(
         buttonStyle: 'solid',
         optionType: 'button',
       },
-      defaultValue: DeviceTypeEnum.DEVICE,
       dependencies: {
         triggerFields: ['id'],
         componentProps: (values) => ({
@@ -131,7 +130,10 @@ export function useBasicFormSchema(
       // 网关子设备走网关联网，不需要联网方式
       dependencies: {
         triggerFields: ['deviceType'],
-        show: (values) => values.deviceType !== DeviceTypeEnum.GATEWAY,
+        show: (values) =>
+          [DeviceTypeEnum.DEVICE, DeviceTypeEnum.GATEWAY].includes(
+            values.deviceType,
+          ),
       },
       rules: 'required',
     },
diff --git a/apps/web-antd/src/views/iot/product/product/detail/modules/info.vue b/apps/web-antd/src/views/iot/product/product/detail/modules/info.vue
index 85992aa44..8032cda2d 100644
--- a/apps/web-antd/src/views/iot/product/product/detail/modules/info.vue
+++ b/apps/web-antd/src/views/iot/product/product/detail/modules/info.vue
@@ -84,13 +84,14 @@ async function copyToClipboard(text: string) {
       >
         <DictTag :type="DICT_TYPE.IOT_NET_TYPE" :value="product.netType" />
       </Descriptions.Item>
-      <Descriptions.Item v-if="product.productSecret" label="ProductSecret">
+      <Descriptions.Item label="产品密钥">
         <span v-if="showProductSecret">{{ product.productSecret }}</span>
         <span v-else>********</span>
         <Button class="ml-2" size="small" @click="toggleProductSecretVisible">
           {{ showProductSecret ? '隐藏' : '显示' }}
         </Button>
         <Button
+          v-if="showProductSecret && product.productSecret"
           class="ml-2"
           size="small"
           @click="copyToClipboard(product.productSecret || '')"
diff --git a/apps/web-antd/src/views/iot/product/product/index.vue b/apps/web-antd/src/views/iot/product/product/index.vue
index 959280fbf..fca725565 100644
--- a/apps/web-antd/src/views/iot/product/product/index.vue
+++ b/apps/web-antd/src/views/iot/product/product/index.vue
@@ -79,7 +79,7 @@ async function handleViewModeChange(mode: 'card' | 'list') {
 /** 导出表格 */
 async function handleExport() {
   const data = await exportProduct(queryParams.value);
-  downloadFileFromBlobPart({ fileName: '产品列表.xls', source: data });
+  downloadFileFromBlobPart({ fileName: '物联网产品.xls', source: data });
 }
 
 /** 打开产品详情 */
diff --git a/apps/web-antd/src/views/iot/product/product/modules/card-view.vue b/apps/web-antd/src/views/iot/product/product/modules/card-view.vue
index f248e7200..8a089e53b 100644
--- a/apps/web-antd/src/views/iot/product/product/modules/card-view.vue
+++ b/apps/web-antd/src/views/iot/product/product/modules/card-view.vue
@@ -4,6 +4,7 @@ import { onMounted, ref } from 'vue';
 import { useAccess } from '@vben/access';
 import { DICT_TYPE, ProductStatusEnum } from '@vben/constants';
 import { IconifyIcon } from '@vben/icons';
+import { isHttpUrl } from '@vben/utils';
 
 import {
   Button,
@@ -18,6 +19,8 @@ import {
 } from 'ant-design-vue';
 
 import { getProductPage } from '#/api/iot/product/product';
+import defaultPicUrl from '#/assets/imgs/iot/device.png';
+import defaultIconUrl from '#/assets/svgs/iot/cube.svg';
 import { DictTag } from '#/components/dict-tag';
 
 interface Props {
@@ -49,9 +52,27 @@ const queryParams = ref({
 });
 
 /** 获取分类名称 */
-function getCategoryName(categoryId: number) {
-  const category = props.categoryList.find((c: any) => c.id === categoryId);
-  return category?.name || '未分类';
+function getCategoryName(item: any) {
+  const category = props.categoryList.find((c: any) => c.id === item.categoryId);
+  return item.categoryName || category?.name || '未分类';
+}
+
+/** 是否按图片 URL 渲染产品图标 */
+function isImageIcon(icon?: string) {
+  if (!icon) {
+    return true;
+  }
+  return isHttpUrl(icon);
+}
+
+/** 产品图标 fallback */
+function getProductIcon(icon?: string) {
+  return icon || defaultIconUrl;
+}
+
+/** 产品图片 fallback */
+function getProductPic(picUrl?: string) {
+  return picUrl || defaultPicUrl;
 }
 
 /** 获取产品列表 */
@@ -117,8 +138,15 @@ onMounted(() => {
               <div
                 class="flex size-9 shrink-0 items-center justify-center rounded-lg bg-gradient-to-br from-[#40a9ff] to-[#1890ff] text-white"
               >
+                <img
+                  v-if="isImageIcon(item.icon)"
+                  :src="getProductIcon(item.icon)"
+                  alt=""
+                  class="size-6 object-contain"
+                />
                 <IconifyIcon
-                  :icon="item.icon || 'lucide:box'"
+                  v-else
+                  :icon="item.icon"
                   class="text-xl"
                 />
               </div>
@@ -138,7 +166,7 @@ onMounted(() => {
                     产品分类
                   </span>
                   <span class="truncate font-medium text-primary">
-                    {{ getCategoryName(item.categoryId) }}
+                    {{ getCategoryName(item) }}
                   </span>
                 </div>
                 <div class="mb-2 flex items-center text-[13px]">
@@ -169,16 +197,10 @@ onMounted(() => {
                 class="flex size-20 shrink-0 items-center justify-center rounded-lg bg-gradient-to-br from-[#40a9ff15] to-[#1890ff15] text-[#1890ff] dark:from-[#40a9ff25] dark:to-[#1890ff25] dark:text-[#69c0ff]"
               >
                 <Image
-                  v-if="item.picUrl"
-                  :src="item.picUrl"
+                  :src="getProductPic(item.picUrl)"
                   :preview="true"
                   class="size-full rounded object-cover"
                 />
-                <IconifyIcon
-                  v-else
-                  icon="lucide:image"
-                  class="text-2xl opacity-50"
-                />
               </div>
             </div>
             <!-- 按钮组 -->
diff --git a/apps/web-antd/src/views/iot/rule/data/rule/modules/source-config-form.vue b/apps/web-antd/src/views/iot/rule/data/rule/modules/source-config-form.vue
index 0a4fd54df..3966bc3ff 100644
--- a/apps/web-antd/src/views/iot/rule/data/rule/modules/source-config-form.vue
+++ b/apps/web-antd/src/views/iot/rule/data/rule/modules/source-config-form.vue
@@ -179,9 +179,11 @@ function validate() {
   return Promise.resolve();
 }
 
-/** 取当前所有行的值 */
+/** 取当前所有行的值（剔除 identifierLoading 等仅供 UI 使用的临时字段） */
 function getData() {
-  return formData.value;
+  return formData.value.map(
+    ({ identifierLoading: _identifierLoading, ...rest }) => rest,
+  );
 }
 
 /** 设置初始数据 */
@@ -214,6 +216,7 @@ defineExpose({ validate, getData, setData });
           v-model:value="formData[rowIndex].productId"
           placeholder="请选择产品"
           show-search
+          allow-clear
           :filter-option="
             (input: string, option: any) =>
               option.label.toLowerCase().includes(input.toLowerCase())
@@ -230,6 +233,7 @@ defineExpose({ validate, getData, setData });
           v-model:value="formData[rowIndex].deviceId"
           placeholder="请选择设备"
           show-search
+          allow-clear
           :filter-option="
             (input: string, option: any) =>
               option.label.toLowerCase().includes(input.toLowerCase())
@@ -251,6 +255,7 @@ defineExpose({ validate, getData, setData });
           v-model:value="formData[rowIndex].method"
           placeholder="请选择消息"
           show-search
+          allow-clear
           :filter-option="
             (input: string, option: any) =>
               option.label.toLowerCase().includes(input.toLowerCase())
@@ -271,6 +276,7 @@ defineExpose({ validate, getData, setData });
           v-model:value="formData[rowIndex].identifier"
           placeholder="请选择标识符"
           show-search
+          allow-clear
           :loading="formData[rowIndex].identifierLoading"
           :filter-option="
             (input: string, option: any) =>
diff --git a/apps/web-antd/src/views/iot/rule/data/sink/config/components/key-value-editor.vue b/apps/web-antd/src/views/iot/rule/data/sink/config/components/key-value-editor.vue
index d8d7cdab7..e929aa577 100644
--- a/apps/web-antd/src/views/iot/rule/data/sink/config/components/key-value-editor.vue
+++ b/apps/web-antd/src/views/iot/rule/data/sink/config/components/key-value-editor.vue
@@ -16,15 +16,18 @@ const props = defineProps<{
 const emit = defineEmits(['update:modelValue']);
 
 interface KeyValueItem {
+  _uid: number;
   key: string;
   value: string;
 }
 
+let uidCounter = 0;
 const items = ref<KeyValueItem[]>([]); // 内部 key-value 项列表
 
 /** 添加项目 */
 function addItem() {
-  items.value.push({ key: '', value: '' });
+  uidCounter += 1;
+  items.value.push({ _uid: uidCounter, key: '', value: '' });
   updateModelValue();
 }
 
@@ -54,16 +57,16 @@ watch(
     if (isEmpty(val) || !isEmpty(items.value)) {
       return;
     }
-    items.value = Object.entries(props.modelValue).map(([key, value]) => ({
-      key,
-      value,
-    }));
+    items.value = Object.entries(props.modelValue).map(([key, value]) => {
+      uidCounter += 1;
+      return { _uid: uidCounter, key, value };
+    });
   },
 );
 </script>
 
 <template>
-  <div v-for="(item, index) in items" :key="index" class="mb-2 flex w-full">
+  <div v-for="(item, index) in items" :key="item._uid" class="mb-2 flex w-full">
     <Input v-model:value="item.key" class="mr-2" placeholder="键" />
     <Input v-model:value="item.value" placeholder="值" />
     <Button class="ml-2" type="link" danger @click="removeItem(index)">
diff --git a/apps/web-antd/src/views/iot/rule/data/sink/config/database-config-form.vue b/apps/web-antd/src/views/iot/rule/data/sink/config/database-config-form.vue
index ee99dcc37..3f1860fd4 100644
--- a/apps/web-antd/src/views/iot/rule/data/sink/config/database-config-form.vue
+++ b/apps/web-antd/src/views/iot/rule/data/sink/config/database-config-form.vue
@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { onMounted, ref } from 'vue';
+import { onBeforeUnmount, onMounted, ref } from 'vue';
 
 import { IconifyIcon } from '@vben/icons';
 import { isEmpty } from '@vben/utils';
@@ -30,14 +30,28 @@ const config = useVModel(props, 'modelValue', emit);
 const showSqlTip = ref(false);
 const copied = ref(false);
 const { copy } = useClipboard();
+let copyResetTimer: null | ReturnType<typeof setTimeout> = null;
 
 async function handleCopySql() {
   await copy(TABLE_SQL);
   copied.value = true;
   message.success('建表 SQL 已复制到剪贴板');
-  setTimeout(() => (copied.value = false), 2000);
+  if (copyResetTimer) {
+    clearTimeout(copyResetTimer);
+  }
+  copyResetTimer = setTimeout(() => {
+    copied.value = false;
+    copyResetTimer = null;
+  }, 2000);
 }
 
+onBeforeUnmount(() => {
+  if (copyResetTimer) {
+    clearTimeout(copyResetTimer);
+    copyResetTimer = null;
+  }
+});
+
 onMounted(() => {
   if (!isEmpty(config.value)) {
     return;
diff --git a/apps/web-antd/src/views/iot/rule/data/sink/config/http-config-form.vue b/apps/web-antd/src/views/iot/rule/data/sink/config/http-config-form.vue
index 64e3233d6..5c6ea2c57 100644
--- a/apps/web-antd/src/views/iot/rule/data/sink/config/http-config-form.vue
+++ b/apps/web-antd/src/views/iot/rule/data/sink/config/http-config-form.vue
@@ -21,21 +21,31 @@ const fullUrl = computed(() =>
   urlPath.value ? urlPrefix.value + urlPath.value : '',
 );
 
+function syncUrlFields(url?: string) {
+  if (url?.startsWith('https://')) {
+    urlPrefix.value = 'https://';
+    urlPath.value = url.slice(8);
+  } else if (url?.startsWith('http://')) {
+    urlPrefix.value = 'http://';
+    urlPath.value = url.slice(7);
+  } else {
+    urlPath.value = url ?? '';
+  }
+}
+
 watch([urlPrefix, urlPath], () => {
   config.value.url = fullUrl.value;
 });
 
+watch(
+  () => config.value?.url,
+  (url) => syncUrlFields(url),
+  { immediate: true },
+);
+
 onMounted(() => {
   if (!isEmpty(config.value)) {
-    if (config.value.url?.startsWith('https://')) {
-      urlPrefix.value = 'https://';
-      urlPath.value = config.value.url.slice(8);
-    } else if (config.value.url?.startsWith('http://')) {
-      urlPrefix.value = 'http://';
-      urlPath.value = config.value.url.slice(7);
-    } else {
-      urlPath.value = config.value.url ?? '';
-    }
+    syncUrlFields(config.value.url);
     return;
   }
   config.value = {
diff --git a/apps/web-antd/src/views/iot/rule/data/sink/config/redis-stream-config-form.vue b/apps/web-antd/src/views/iot/rule/data/sink/config/redis-stream-config-form.vue
index e256ce809..d2f1e2cf0 100644
--- a/apps/web-antd/src/views/iot/rule/data/sink/config/redis-stream-config-form.vue
+++ b/apps/web-antd/src/views/iot/rule/data/sink/config/redis-stream-config-form.vue
@@ -12,8 +12,16 @@ const props = defineProps<{ modelValue: any }>();
 const emit = defineEmits(['update:modelValue']);
 const config = useVModel(props, 'modelValue', emit);
 
+/** 移除当前 Redis Stream API 类型未声明的旧扩展字段 */
+function removeUnsupportedFields() {
+  delete config.value.dataStructure;
+  delete config.value.hashField;
+  delete config.value.scoreField;
+}
+
 onMounted(() => {
   if (!isEmpty(config.value)) {
+    removeUnsupportedFields();
     return;
   }
   config.value = {
@@ -60,7 +68,11 @@ onMounted(() => {
       class="w-full"
     />
   </Form.Item>
-  <Form.Item :name="['config', 'password']" label="密码">
+  <Form.Item
+    :name="['config', 'password']"
+    :rules="[{ required: true, message: '密码不能为空', trigger: 'blur' }]"
+    label="密码"
+  >
     <Input.Password v-model:value="config.password" placeholder="请输入密码" />
   </Form.Item>
   <Form.Item
diff --git a/apps/web-antd/src/views/iot/rule/scene/form/configs/current-time-condition-config.vue b/apps/web-antd/src/views/iot/rule/scene/form/configs/current-time-condition-config.vue
index bbe7913c5..df03b53a3 100644
--- a/apps/web-antd/src/views/iot/rule/scene/form/configs/current-time-condition-config.vue
+++ b/apps/web-antd/src/views/iot/rule/scene/form/configs/current-time-condition-config.vue
@@ -1,11 +1,14 @@
 <!-- 当前时间条件配置组件 -->
 <script setup lang="ts">
+import type { Dayjs } from 'dayjs';
+
 import type { RuleSceneApi } from '#/api/iot/rule/scene';
 
 import { computed, watch } from 'vue';
 
 import { IotRuleSceneTriggerTimeOperatorEnum } from '@vben/constants';
 import { IconifyIcon } from '@vben/icons';
+import { formatDayjs } from '@vben/utils';
 
 import { useVModel } from '@vueuse/core';
 import {
@@ -126,11 +129,12 @@ function updateConditionField(field: any, value: any) {
  * 处理第一个时间值变化
  * @param value 时间值
  */
-function handleTimeValueChange(value: string) {
+function handleTimeValueChange(value: Dayjs | null | string) {
+  const normalized = formatDayjs(value);
   const currentParams = condition.value.param
     ? condition.value.param.split(',')
     : [];
-  currentParams[0] = value || '';
+  currentParams[0] = normalized;
 
   // 如果是范围条件，保留第二个值；否则只保留第一个值
   condition.value.param = needsSecondTimeInput.value
@@ -142,11 +146,12 @@ function handleTimeValueChange(value: string) {
  * 处理第二个时间值变化
  * @param value 时间值
  */
-function handleTimeValue2Change(value: string) {
+function handleTimeValue2Change(value: Dayjs | null | string) {
+  const normalized = formatDayjs(value);
   const currentParams = condition.value.param
     ? condition.value.param.split(',')
     : [''];
-  currentParams[1] = value || '';
+  currentParams[1] = normalized;
   condition.value.param = currentParams.slice(0, 2).join(',');
 }
 
@@ -175,8 +180,8 @@ watch(
       <Col :span="8">
         <Form.Item label="时间条件" required>
           <Select
-            :model-value="condition.operator"
-            @update:model-value="
+            :value="condition.operator"
+            @update:value="
               (value: any) => updateConditionField('operator', value)
             "
             placeholder="请选择时间条件"
@@ -207,8 +212,8 @@ watch(
         <Form.Item label="时间值" required>
           <TimePicker
             v-if="needsTimeInput"
-            :model-value="timeValue"
-            @update:model-value="handleTimeValueChange"
+            :value="timeValue"
+            @update:value="handleTimeValueChange"
             placeholder="请选择时间"
             format="HH:mm:ss"
             value-format="HH:mm:ss"
@@ -216,8 +221,8 @@ watch(
           />
           <DatePicker
             v-else-if="needsDateInput"
-            :model-value="timeValue"
-            @update:model-value="handleTimeValueChange"
+            :value="timeValue"
+            @update:value="handleTimeValueChange"
             type="datetime"
             placeholder="请选择日期时间"
             format="YYYY-MM-DD HH:mm:ss"
@@ -233,8 +238,8 @@ watch(
         <Form.Item label="结束时间" required>
           <TimePicker
             v-if="needsTimeInput"
-            :model-value="timeValue2"
-            @update:model-value="handleTimeValue2Change"
+            :value="timeValue2"
+            @update:value="handleTimeValue2Change"
             placeholder="请选择结束时间"
             format="HH:mm:ss"
             value-format="HH:mm:ss"
@@ -242,8 +247,8 @@ watch(
           />
           <DatePicker
             v-else
-            :model-value="timeValue2"
-            @update:model-value="handleTimeValue2Change"
+            :value="timeValue2"
+            @update:value="handleTimeValue2Change"
             type="datetime"
             placeholder="请选择结束日期时间"
             format="YYYY-MM-DD HH:mm:ss"
diff --git a/apps/web-antd/src/views/iot/rule/scene/form/configs/device-control-config.vue b/apps/web-antd/src/views/iot/rule/scene/form/configs/device-control-config.vue
index 506270978..d49d1381f 100644
--- a/apps/web-antd/src/views/iot/rule/scene/form/configs/device-control-config.vue
+++ b/apps/web-antd/src/views/iot/rule/scene/form/configs/device-control-config.vue
@@ -69,18 +69,16 @@ const isServiceInvokeAction = computed(() => {
 /**
  * 处理产品变化事件
  * @param productId 产品 ID
+ *
+ * ProductSelector 只在用户主动切换时 emit change，编辑回填阶段不会触发。
  */
 function handleProductChange(productId?: number) {
-  // 当产品变化时，清空设备选择和参数配置
-  if (action.value.productId !== productId) {
-    action.value.deviceId = undefined;
-    action.value.identifier = undefined; // 清空服务标识符
-    action.value.params = '' as any; // 清空参数，保存为空字符串
-    selectedService.value = null; // 清空选中的服务
-    serviceList.value = []; // 清空服务列表
-  }
+  action.value.deviceId = undefined;
+  action.value.identifier = undefined;
+  action.value.params = '' as any;
+  selectedService.value = null;
+  serviceList.value = [];
 
-  // 加载新产品的物模型属性或服务列表
   if (productId) {
     if (isPropertySetAction.value) {
       loadThingModelProperties(productId);
@@ -94,11 +92,8 @@ function handleProductChange(productId?: number) {
  * 处理设备变化事件
  * @param deviceId 设备 ID
  */
-function handleDeviceChange(deviceId?: number) {
-  // 当设备变化时，清空参数配置
-  if (action.value.deviceId !== deviceId) {
-    action.value.params = '' as any; // 清空参数，保存为空字符串
-  }
+function handleDeviceChange(_deviceId?: number) {
+  action.value.params = '' as any;
 }
 
 /**
@@ -256,14 +251,10 @@ function getDefaultValueForParam(param: any) {
   }
 }
 
-const isInitialized = ref(false); // 防止重复初始化的标志
-
 /**
  * 初始化组件数据
  */
 async function initializeComponent() {
-  if (isInitialized.value) return;
-
   const currentAction = action.value;
   if (!currentAction) return;
 
@@ -281,8 +272,6 @@ async function initializeComponent() {
     // 加载物模型TSL以获取服务信息
     await loadServiceFromTSL(currentAction.productId, currentAction.identifier);
   }
-
-  isInitialized.value = true;
 }
 
 /** 组件初始化 */
@@ -294,9 +283,6 @@ onMounted(() => {
 watch(
   () => [action.value.productId, action.value.type, action.value.identifier],
   async ([newProductId, , newIdentifier], [oldProductId, , oldIdentifier]) => {
-    // 避免初始化时的重复调用
-    if (!isInitialized.value) return;
-
     // 产品变化时重新加载数据
     if (newProductId !== oldProductId) {
       if (newProductId && isPropertySetAction.value) {
diff --git a/apps/web-antd/src/views/iot/rule/scene/form/configs/device-trigger-config.vue b/apps/web-antd/src/views/iot/rule/scene/form/configs/device-trigger-config.vue
index 28e4230ba..819f64cf5 100644
--- a/apps/web-antd/src/views/iot/rule/scene/form/configs/device-trigger-config.vue
+++ b/apps/web-antd/src/views/iot/rule/scene/form/configs/device-trigger-config.vue
@@ -5,6 +5,7 @@ import type { RuleSceneApi } from '#/api/iot/rule/scene';
 import { nextTick } from 'vue';
 
 import { IconifyIcon } from '@vben/icons';
+import { getStableObjectKey } from '@vben/utils';
 
 import { useVModel } from '@vueuse/core';
 import { Button, Tag } from 'ant-design-vue';
@@ -183,7 +184,7 @@ function removeConditionGroup() {
           <div class="relative">
             <div
               v-for="(subGroup, subGroupIndex) in trigger.conditionGroups"
-              :key="`sub-group-${subGroupIndex}`"
+              :key="getStableObjectKey(subGroup)"
               class="relative"
             >
               <!-- 子条件组容器（橙色主题） -->
diff --git a/apps/web-antd/src/views/iot/rule/scene/form/configs/main-condition-inner-config.vue b/apps/web-antd/src/views/iot/rule/scene/form/configs/main-condition-inner-config.vue
index c29b2e84d..4a8fd533f 100644
--- a/apps/web-antd/src/views/iot/rule/scene/form/configs/main-condition-inner-config.vue
+++ b/apps/web-antd/src/views/iot/rule/scene/form/configs/main-condition-inner-config.vue
@@ -12,7 +12,7 @@ import {
 } from '@vben/constants';
 
 import { useVModel } from '@vueuse/core';
-import { Col, Form, Row, Select } from 'ant-design-vue';
+import { Col, Form, Input, Row, Select } from 'ant-design-vue';
 
 import JsonParamsInput from '../inputs/json-params-input.vue';
 import ValueInput from '../inputs/value-input.vue';
@@ -105,22 +105,6 @@ const serviceConfig = computed(() => {
   return undefined;
 });
 
-// 计算属性：事件配置 - 用于 JsonParamsInput
-const eventConfig = computed(() => {
-  if (
-    propertyConfig.value &&
-    props.triggerType === IotRuleSceneTriggerTypeEnum.DEVICE_EVENT_POST
-  ) {
-    return {
-      event: {
-        name: propertyConfig.value.name || '事件',
-        outputParams: propertyConfig.value.outputParams || [],
-      },
-    };
-  }
-  return undefined;
-});
-
 /**
  * 更新条件字段
  * @param field 字段名
@@ -140,15 +124,24 @@ function handleTriggerTypeChange(type: number) {
 
 /** 处理产品变化事件 */
 function handleProductChange() {
-  // 产品变化时清空设备和属性
-  condition.value.deviceId = undefined;
-  condition.value.identifier = '';
+  const trigger = condition.value;
+  trigger.deviceId = undefined;
+  trigger.identifier = '';
+  trigger.operator = undefined;
+  // 主条件比较值字段是 Trigger.value（不是 TriggerCondition.param）
+  trigger.value = '';
+  propertyType.value = '';
+  propertyConfig.value = null;
 }
 
 /** 处理设备变化事件 */
 function handleDeviceChange() {
-  // 设备变化时清空属性
-  condition.value.identifier = '';
+  const trigger = condition.value;
+  trigger.identifier = '';
+  trigger.operator = undefined;
+  trigger.value = '';
+  propertyType.value = '';
+  propertyConfig.value = null;
 }
 
 /**
@@ -266,15 +259,16 @@ function handlePropertyChange(propertyInfo: any) {
               :config="serviceConfig as any"
               placeholder="请输入 JSON 格式的服务参数"
             />
-            <!-- 事件上报参数配置 -->
-            <JsonParamsInput
+            <!-- 事件上报参数配置：源项目允许标量值或留空表示事件发生即匹配 -->
+            <Input
               v-else-if="
                 triggerType === IotRuleSceneTriggerTypeEnum.DEVICE_EVENT_POST
               "
-              v-model="condition.value"
-              type="event"
-              :config="eventConfig as any"
-              placeholder="请输入 JSON 格式的事件参数"
+              :value="condition.value"
+              @update:value="
+                (value) => updateConditionField('value', value)
+              "
+              placeholder="留空则事件发生即匹配"
             />
             <!-- 普通值输入 -->
             <ValueInput
diff --git a/apps/web-antd/src/views/iot/rule/scene/form/configs/sub-condition-group-config.vue b/apps/web-antd/src/views/iot/rule/scene/form/configs/sub-condition-group-config.vue
index 0c9ca2ae5..a23770c8a 100644
--- a/apps/web-antd/src/views/iot/rule/scene/form/configs/sub-condition-group-config.vue
+++ b/apps/web-antd/src/views/iot/rule/scene/form/configs/sub-condition-group-config.vue
@@ -8,6 +8,7 @@ import {
   IotRuleSceneTriggerConditionTypeEnum,
 } from '@vben/constants';
 import { IconifyIcon } from '@vben/icons';
+import { getStableObjectKey } from '@vben/utils';
 
 import { useVModel } from '@vueuse/core';
 import { Button } from 'ant-design-vue';
@@ -105,7 +106,7 @@ function updateCondition(
     <div v-else class="space-y-4">
       <div
         v-for="(condition, conditionIndex) in subGroup"
-        :key="`condition-${conditionIndex}`"
+        :key="getStableObjectKey(condition)"
         class="relative"
       >
         <!-- 条件配置 -->
diff --git a/apps/web-antd/src/views/iot/rule/scene/form/configs/timer-condition-group-config.vue b/apps/web-antd/src/views/iot/rule/scene/form/configs/timer-condition-group-config.vue
index 96477ff42..1d4b0af6b 100644
--- a/apps/web-antd/src/views/iot/rule/scene/form/configs/timer-condition-group-config.vue
+++ b/apps/web-antd/src/views/iot/rule/scene/form/configs/timer-condition-group-config.vue
@@ -5,6 +5,7 @@ import { nextTick } from 'vue';
 
 import { IotRuleSceneTriggerTypeEnum } from '@vben/constants';
 import { IconifyIcon } from '@vben/icons';
+import { getStableObjectKey } from '@vben/utils';
 
 import { useVModel } from '@vueuse/core';
 import { Button, Tag } from 'ant-design-vue';
@@ -96,7 +97,7 @@ function updateConditionGroup(
     >
       <div
         v-for="(group, groupIndex) in conditionGroups"
-        :key="`group-${groupIndex}`"
+        :key="getStableObjectKey(group)"
         class="relative"
       >
         <!-- 条件组容器（橙色主题） -->
diff --git a/apps/web-antd/src/views/iot/rule/scene/form/inputs/json-params-input.vue b/apps/web-antd/src/views/iot/rule/scene/form/inputs/json-params-input.vue
index 1cdfaeab7..c586b3dfd 100644
--- a/apps/web-antd/src/views/iot/rule/scene/form/inputs/json-params-input.vue
+++ b/apps/web-antd/src/views/iot/rule/scene/form/inputs/json-params-input.vue
@@ -12,6 +12,7 @@ import {
   JsonParamsInputTypeEnum,
 } from '@vben/constants';
 import { IconifyIcon } from '@vben/icons';
+import { isEmptyVal } from '@vben/utils';
 
 import { useVModel } from '@vueuse/core';
 import { Button, Input, Popover, Tag } from 'ant-design-vue';
@@ -219,39 +220,40 @@ const emptyMessage = computed(() => {
 
 /**
  * 处理参数变化事件
+ *
+ * 注意：必须在所有校验（合法 JSON / 必须是对象 / 必填参数）通过后再回写
+ * localValue，否则父表单仅校验非空时会先写入非法值再提示错误。
  */
 function handleParamsChange() {
   try {
-    jsonError.value = ''; // 清除之前的错误
+    jsonError.value = '';
 
-    if (paramsJson.value.trim()) {
-      const parsed = JSON.parse(paramsJson.value);
-      localValue.value = paramsJson.value;
-
-      // 额外的参数验证
-      if (typeof parsed !== 'object' || parsed === null) {
-        jsonError.value = JSON_PARAMS_INPUT_CONSTANTS.PARAMS_MUST_BE_OBJECT;
-        return;
-      }
-
-      // 验证必填参数
-      for (const param of paramsList.value) {
-        if (
-          param.required &&
-          (!parsed[param.identifier] || parsed[param.identifier] === '')
-        ) {
-          jsonError.value = JSON_PARAMS_INPUT_CONSTANTS.PARAM_REQUIRED_ERROR(
-            param.name,
-          );
-          return;
-        }
-      }
-    } else {
+    if (!paramsJson.value.trim()) {
       localValue.value = '';
+      return;
     }
 
-    // 验证通过
-    jsonError.value = '';
+    const parsed = JSON.parse(paramsJson.value);
+
+    // 必须是对象
+    if (typeof parsed !== 'object' || parsed === null) {
+      jsonError.value = JSON_PARAMS_INPUT_CONSTANTS.PARAMS_MUST_BE_OBJECT;
+      return;
+    }
+
+    // 必填参数校验
+    for (const param of paramsList.value) {
+      const value = parsed[param.identifier];
+      if (param.required && isEmptyVal(value)) {
+        jsonError.value = JSON_PARAMS_INPUT_CONSTANTS.PARAM_REQUIRED_ERROR(
+          param.name,
+        );
+        return;
+      }
+    }
+
+    // 所有校验通过后才回写到父表单
+    localValue.value = paramsJson.value;
   } catch (error) {
     jsonError.value = JSON_PARAMS_INPUT_CONSTANTS.JSON_FORMAT_ERROR(
       error instanceof Error
@@ -383,6 +385,9 @@ watch(
 
     // 使用 nextTick 确保在下一个 tick 中处理数据
     await nextTick();
+    if ((newValue || '') === paramsJson.value) {
+      return;
+    }
     handleDataDisplay(newValue || '');
   },
   { immediate: true },
diff --git a/apps/web-antd/src/views/iot/rule/scene/form/inputs/value-input.vue b/apps/web-antd/src/views/iot/rule/scene/form/inputs/value-input.vue
index 0769d9e15..8c9eac40d 100644
--- a/apps/web-antd/src/views/iot/rule/scene/form/inputs/value-input.vue
+++ b/apps/web-antd/src/views/iot/rule/scene/form/inputs/value-input.vue
@@ -6,6 +6,7 @@ import {
   IoTDataSpecsDataTypeEnum,
   IotRuleSceneTriggerConditionParameterOperatorEnum,
 } from '@vben/constants';
+import { IconifyIcon } from '@vben/icons';
 
 import { useVModel } from '@vueuse/core';
 import {
@@ -144,10 +145,46 @@ function handleNumberChange(value: any) {
   localValue.value = value === null ? '' : String(value);
 }
 
+/** 根据外部值同步内部输入态 */
+function syncInternalValue(value = '') {
+  const normalized = value;
+  if (
+    props.operator ===
+    IotRuleSceneTriggerConditionParameterOperatorEnum.BETWEEN.value
+  ) {
+    const [start = '', end = ''] = normalized.split(',');
+    rangeStart.value = start;
+    rangeEnd.value = end;
+    numberValue.value = undefined;
+    dateValue.value = '';
+    return;
+  }
+  rangeStart.value = '';
+  rangeEnd.value = '';
+  if (props.propertyType === IoTDataSpecsDataTypeEnum.DATE) {
+    dateValue.value = normalized;
+    numberValue.value = undefined;
+    return;
+  }
+  if (isNumericType()) {
+    const parsed = Number(normalized);
+    numberValue.value =
+      normalized === '' || Number.isNaN(parsed) ? undefined : parsed;
+    dateValue.value = '';
+    return;
+  }
+  numberValue.value = undefined;
+  dateValue.value = '';
+}
+
 /** 监听操作符变化 */
 watch(
   () => props.operator,
-  () => {
+  (_operator, oldOperator) => {
+    if (oldOperator === undefined) {
+      syncInternalValue(props.modelValue);
+      return;
+    }
     localValue.value = '';
     rangeStart.value = '';
     rangeEnd.value = '';
@@ -155,6 +192,12 @@ watch(
     numberValue.value = undefined;
   },
 );
+
+watch(
+  () => [props.modelValue, props.propertyType] as const,
+  ([value]) => syncInternalValue(value),
+  { immediate: true },
+);
 </script>
 
 <template>
@@ -166,8 +209,8 @@ watch(
       placeholder="请选择布尔值"
       class="w-full!"
     >
-      <Select.Option :value="true">真 (true)</Select.Option>
-      <Select.Option :value="false">假 (false)</Select.Option>
+      <Select.Option value="true">真 (true)</Select.Option>
+      <Select.Option value="false">假 (false)</Select.Option>
     </Select>
 
     <!-- 枚举值选择 -->
diff --git a/apps/web-antd/src/views/iot/rule/scene/form/sections/action-section.vue b/apps/web-antd/src/views/iot/rule/scene/form/sections/action-section.vue
index 122c58c17..ba1733ef7 100644
--- a/apps/web-antd/src/views/iot/rule/scene/form/sections/action-section.vue
+++ b/apps/web-antd/src/views/iot/rule/scene/form/sections/action-section.vue
@@ -8,6 +8,7 @@ import {
   IotRuleSceneActionTypeEnum,
 } from '@vben/constants';
 import { IconifyIcon } from '@vben/icons';
+import { getStableObjectKey } from '@vben/utils';
 
 import { useVModel } from '@vueuse/core';
 import { Button, Card, Empty, Form, Select, Tag } from 'ant-design-vue';
@@ -183,7 +184,7 @@ function onActionTypeChange(action: RuleSceneApi.Action, type: number) {
       <div v-else class="space-y-[24px]">
         <div
           v-for="(action, index) in actions"
-          :key="`action-${index}`"
+          :key="getStableObjectKey(action)"
           class="rounded-lg border border-blue-200 bg-blue-50/40 shadow-sm transition-shadow hover:shadow-md dark:border-blue-900/40 dark:bg-blue-950/20"
         >
           <!-- 执行器头部（蓝色主题） -->
diff --git a/apps/web-antd/src/views/iot/rule/scene/form/sections/trigger-section.vue b/apps/web-antd/src/views/iot/rule/scene/form/sections/trigger-section.vue
index dab907631..cfffff34a 100644
--- a/apps/web-antd/src/views/iot/rule/scene/form/sections/trigger-section.vue
+++ b/apps/web-antd/src/views/iot/rule/scene/form/sections/trigger-section.vue
@@ -9,6 +9,7 @@ import {
   isDeviceTrigger,
 } from '@vben/constants';
 import { IconifyIcon } from '@vben/icons';
+import { getStableObjectKey } from '@vben/utils';
 
 import { useVModel } from '@vueuse/core';
 import { Button, Card, Empty, Form, Tag } from 'ant-design-vue';
@@ -133,7 +134,7 @@ onMounted(() => {
       <div v-if="triggers.length > 0" class="space-y-[24px]">
         <div
           v-for="(triggerItem, index) in triggers"
-          :key="`trigger-${index}`"
+          :key="getStableObjectKey(triggerItem)"
           class="rounded-[8px] border border-green-200 bg-green-50/40 shadow-sm transition-shadow hover:shadow-md dark:border-green-900/40 dark:bg-green-950/20"
         >
           <!-- 触发器头部（绿色主题） -->
diff --git a/apps/web-antd/src/views/iot/rule/scene/form/selectors/device-selector.vue b/apps/web-antd/src/views/iot/rule/scene/form/selectors/device-selector.vue
index ceefc0ab0..acd2d6298 100644
--- a/apps/web-antd/src/views/iot/rule/scene/form/selectors/device-selector.vue
+++ b/apps/web-antd/src/views/iot/rule/scene/form/selectors/device-selector.vue
@@ -55,16 +55,26 @@ async function getDeviceList() {
 // 监听产品变化
 watch(
   () => props.productId,
-  (newProductId) => {
-    if (newProductId) {
-      getDeviceList();
-    } else {
+  async (newProductId, oldProductId) => {
+    if (!newProductId) {
       deviceList.value = [];
-      // 清空当前选择的设备
-      if (props.modelValue) {
+      if (props.modelValue !== undefined && props.modelValue !== null) {
         emit('update:modelValue', undefined);
         emit('change', undefined);
       }
+      return;
+    }
+    await getDeviceList();
+    // 切换到新 productId 时，旧 deviceId 不在新列表里则清空
+    if (
+      oldProductId !== undefined &&
+      oldProductId !== newProductId &&
+      props.modelValue !== undefined &&
+      props.modelValue !== null &&
+      !deviceList.value.some((d: any) => d.id === props.modelValue)
+    ) {
+      emit('update:modelValue', undefined);
+      emit('change', undefined);
     }
   },
   { immediate: true },
diff --git a/apps/web-antd/src/views/iot/rule/scene/form/selectors/product-selector.vue b/apps/web-antd/src/views/iot/rule/scene/form/selectors/product-selector.vue
index 0a8977eef..cea808eb0 100644
--- a/apps/web-antd/src/views/iot/rule/scene/form/selectors/product-selector.vue
+++ b/apps/web-antd/src/views/iot/rule/scene/form/selectors/product-selector.vue
@@ -79,7 +79,7 @@ onMounted(() => {
             {{ product.productKey }}
           </div>
         </div>
-        <DictTag :type="DICT_TYPE.COMMON_STATUS" :value="product.status" />
+        <DictTag :type="DICT_TYPE.IOT_PRODUCT_STATUS" :value="product.status" />
       </div>
     </Select.Option>
   </Select>
diff --git a/apps/web-antd/src/views/iot/rule/scene/form/selectors/property-selector.vue b/apps/web-antd/src/views/iot/rule/scene/form/selectors/property-selector.vue
index 594709182..3e2dbf7e2 100644
--- a/apps/web-antd/src/views/iot/rule/scene/form/selectors/property-selector.vue
+++ b/apps/web-antd/src/views/iot/rule/scene/form/selectors/property-selector.vue
@@ -69,6 +69,10 @@ const TRIGGER_TYPE_TO_GROUP: Record<
     label: THING_MODEL_GROUP_LABELS.PROPERTY,
     modelType: IoTThingModelTypeEnum.PROPERTY,
   },
+  [IotRuleSceneTriggerTypeEnum.TIMER]: {
+    label: THING_MODEL_GROUP_LABELS.PROPERTY,
+    modelType: IoTThingModelTypeEnum.PROPERTY,
+  },
   [IotRuleSceneTriggerTypeEnum.DEVICE_EVENT_POST]: {
     label: THING_MODEL_GROUP_LABELS.EVENT,
     modelType: IoTThingModelTypeEnum.EVENT,
diff --git a/apps/web-antd/src/views/iot/rule/scene/index.vue b/apps/web-antd/src/views/iot/rule/scene/index.vue
index 0dabe7e8d..1d50d064c 100644
--- a/apps/web-antd/src/views/iot/rule/scene/index.vue
+++ b/apps/web-antd/src/views/iot/rule/scene/index.vue
@@ -178,10 +178,10 @@ function getNextExecutionTime(row: RuleSceneApi.SceneRule): Date | null {
     : null;
 }
 
-/** 基于当前页列表刷新统计数据 */
-function updateStatistics(rows: RuleSceneApi.SceneRule[]) {
+/** 刷新规则统计卡片数据 */
+function updateStatistics(rows: RuleSceneApi.SceneRule[], total?: number) {
   statistics.value = {
-    total: rows.length,
+    total: total ?? rows.length,
     enabled: rows.filter((item) => item.status === CommonStatusEnum.ENABLE)
       .length,
     disabled: rows.filter((item) => item.status === CommonStatusEnum.DISABLE)
@@ -206,7 +206,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
             pageSize: page.pageSize,
             ...formValues,
           });
-          updateStatistics(result.list || []);
+          updateStatistics(result.list || [], result.total);
           return result;
         },
       },
diff --git a/apps/web-antd/src/views/iot/rule/scene/modules/form.vue b/apps/web-antd/src/views/iot/rule/scene/modules/form.vue
index f7e575811..191e6f4e3 100644
--- a/apps/web-antd/src/views/iot/rule/scene/modules/form.vue
+++ b/apps/web-antd/src/views/iot/rule/scene/modules/form.vue
@@ -7,9 +7,12 @@ import { useVbenDrawer } from '@vben/common-ui';
 import {
   CommonStatusEnum,
   IotRuleSceneActionTypeEnum,
+  IotRuleSceneTriggerConditionTypeEnum,
+  IotRuleSceneTriggerTimeOperatorEnum,
   IotRuleSceneTriggerTypeEnum,
   isDeviceTrigger,
 } from '@vben/constants';
+import { CronUtils } from '@vben/utils';
 
 import { Form, message } from 'ant-design-vue';
 
@@ -101,12 +104,14 @@ function buildEmptyFormData(): RuleSceneApi.SceneRule {
 
 /** 回显时兜底，保证触发器/执行器数组不为空 */
 function normalizeFormData(result: any): RuleSceneApi.SceneRule {
+  const triggers: RuleSceneApi.Trigger[] = result.triggers?.length
+    ? result.triggers
+    : buildEmptyFormData().triggers!;
+  const actions: RuleSceneApi.Action[] = result.actions || [];
   return {
     ...result,
-    triggers: result.triggers?.length
-      ? result.triggers
-      : buildEmptyFormData().triggers,
-    actions: result.actions || [],
+    triggers,
+    actions,
   };
 }
 
@@ -126,11 +131,14 @@ function validateTriggers(_rule: any, value: any, callback: any) {
         callback(new Error(`触发器 ${i + 1}：产品不能为空`));
         return;
       }
-      if (!trigger.deviceId) {
+      // deviceId = 0 表示「全部设备」（DEVICE_SELECTOR_OPTIONS.ALL_DEVICES），是合法值；仅 undefined / null 视为未选
+      if (trigger.deviceId === undefined || trigger.deviceId === null) {
         callback(new Error(`触发器 ${i + 1}：设备不能为空`));
         return;
       }
-      if (!trigger.identifier) {
+      const isStateUpdate =
+        trigger.type === IotRuleSceneTriggerTypeEnum.DEVICE_STATE_UPDATE;
+      if (!isStateUpdate && !trigger.identifier) {
         callback(new Error(`触发器 ${i + 1}：物模型标识符不能为空`));
         return;
       }
@@ -153,12 +161,98 @@ function validateTriggers(_rule: any, value: any, callback: any) {
         }
       }
     }
-    if (
-      trigger.type === IotRuleSceneTriggerTypeEnum.TIMER &&
-      !trigger.cronExpression
-    ) {
-      callback(new Error(`触发器 ${i + 1}：CRON 表达式不能为空`));
-      return;
+    if (trigger.type === IotRuleSceneTriggerTypeEnum.TIMER) {
+      if (!trigger.cronExpression) {
+        callback(new Error(`触发器 ${i + 1}：CRON 表达式不能为空`));
+        return;
+      }
+      if (!CronUtils.validate(trigger.cronExpression)) {
+        callback(new Error(`触发器 ${i + 1}：CRON 表达式格式不正确`));
+        return;
+      }
+    }
+    // 递归校验 conditionGroups（嵌套条件组）
+    if (trigger.conditionGroups?.length) {
+      for (const [gi, group] of trigger.conditionGroups.entries()) {
+        if (!Array.isArray(group) || group.length === 0) {
+          callback(
+            new Error(`触发器 ${i + 1}：条件组 ${gi + 1} 不能为空`),
+          );
+          return;
+        }
+        for (const [ci, condition] of group.entries()) {
+          const prefix = `触发器 ${i + 1} 条件组 ${gi + 1} 条件 ${ci + 1}`;
+          if (!condition.type) {
+            callback(new Error(`${prefix}：条件类型不能为空`));
+            return;
+          }
+          const isDeviceStatus =
+            condition.type ===
+            IotRuleSceneTriggerConditionTypeEnum.DEVICE_STATUS;
+          const isDeviceProperty =
+            condition.type ===
+            IotRuleSceneTriggerConditionTypeEnum.DEVICE_PROPERTY;
+          const isCurrentTime =
+            condition.type ===
+            IotRuleSceneTriggerConditionTypeEnum.CURRENT_TIME;
+          if (isDeviceStatus || isDeviceProperty) {
+            if (!condition.productId) {
+              callback(new Error(`${prefix}：产品不能为空`));
+              return;
+            }
+            // deviceId = 0 表示「全部设备」（DEVICE_SELECTOR_OPTIONS.ALL_DEVICES），是合法值
+            if (
+              condition.deviceId === undefined ||
+              condition.deviceId === null
+            ) {
+              callback(new Error(`${prefix}：设备不能为空`));
+              return;
+            }
+            if (isDeviceProperty && !condition.identifier) {
+              callback(new Error(`${prefix}：物模型标识符不能为空`));
+              return;
+            }
+          }
+          if (!condition.operator) {
+            callback(new Error(`${prefix}：操作符不能为空`));
+            return;
+          }
+          // 设备状态：param 是状态值（必填）；设备属性：param 是比较值（必填）
+          if (
+            (isDeviceStatus || isDeviceProperty) &&
+            (condition.param === undefined ||
+              condition.param === null ||
+              condition.param === '')
+          ) {
+            callback(
+              new Error(
+                `${prefix}：${isDeviceStatus ? '设备状态' : '比较值'}不能为空`,
+              ),
+            );
+            return;
+          }
+          // 当前时间：TODAY 不需要 param；BETWEEN_TIME 需要双段「v1,v2」；其它需要单段
+          if (isCurrentTime) {
+            const op = condition.operator;
+            if (op === IotRuleSceneTriggerTimeOperatorEnum.TODAY.value) {
+              // TODAY 无需 param
+            } else if (
+              op === IotRuleSceneTriggerTimeOperatorEnum.BETWEEN_TIME.value
+            ) {
+              const parts = condition.param
+                ? String(condition.param).split(',')
+                : [];
+              if (parts.length < 2 || !parts[0] || !parts[1]) {
+                callback(new Error(`${prefix}：起止时间不能为空`));
+                return;
+              }
+            } else if (!condition.param) {
+              callback(new Error(`${prefix}：时间值不能为空`));
+              return;
+            }
+          }
+        }
+      }
     }
   }
   callback();
@@ -183,7 +277,10 @@ function validateActions(_rule: any, value: any, callback: any) {
         callback(new Error(`执行器 ${i + 1}：产品不能为空`));
         return;
       }
-      if (!action.deviceId) {
+      // deviceId = 0 表示「全部设备」（DEVICE_SELECTOR_OPTIONS.ALL_DEVICES）；
+      // 后端 IotDevicePropertySetSceneRuleAction / IotDeviceServiceInvokeSceneRuleAction
+      // 均支持广播执行，因此 0 是合法值，仅 undefined / null 视为未选
+      if (action.deviceId === undefined || action.deviceId === null) {
         callback(new Error(`执行器 ${i + 1}：设备不能为空`));
         return;
       }
@@ -199,9 +296,9 @@ function validateActions(_rule: any, value: any, callback: any) {
         return;
       }
     }
+    // 仅恢复告警动作需要选择已有告警配置；触发告警动作不需要预选 alertConfigId
     if (
-      (action.type === IotRuleSceneActionTypeEnum.ALERT_TRIGGER ||
-        action.type === IotRuleSceneActionTypeEnum.ALERT_RECOVER) &&
+      action.type === IotRuleSceneActionTypeEnum.ALERT_RECOVER &&
       !action.alertConfigId
     ) {
       callback(new Error(`执行器 ${i + 1}：告警配置不能为空`));
diff --git a/apps/web-antd/src/views/iot/thingmodel/modules/components/data-definition.vue b/apps/web-antd/src/views/iot/thingmodel/modules/components/data-definition.vue
index 9878e0ec2..19637601b 100644
--- a/apps/web-antd/src/views/iot/thingmodel/modules/components/data-definition.vue
+++ b/apps/web-antd/src/views/iot/thingmodel/modules/components/data-definition.vue
@@ -1,8 +1,6 @@
 <script lang="ts" setup>
 import type { ThingModelApi } from '#/api/iot/thingmodel';
 
-import { computed } from 'vue';
-
 import {
   getEventTypeLabel,
   getThingModelServiceCallTypeLabel,
@@ -10,9 +8,7 @@ import {
   IoTThingModelTypeEnum,
 } from '@vben/constants';
 
-import { Tooltip } from 'ant-design-vue';
-
-const props = defineProps<{ data: ThingModelApi.ThingModel }>();
+defineProps<{ data: ThingModelApi.ThingModel }>();
 const NUMBER_TYPES = new Set<string>([
   IoTDataSpecsDataTypeEnum.DOUBLE,
   IoTDataSpecsDataTypeEnum.FLOAT,
@@ -27,26 +23,6 @@ const LIST_TYPES = new Set<string>([
   IoTDataSpecsDataTypeEnum.BOOL,
   IoTDataSpecsDataTypeEnum.ENUM,
 ]);
-
-const formattedDataSpecsList = computed(() => {
-  if (!props.data.property?.dataSpecsList?.length) {
-    return '';
-  }
-  return props.data.property.dataSpecsList
-    .map((item) => `${item.value}-${item.name}`)
-    .join('、');
-});
-
-const shortText = computed(() => {
-  const list = props.data.property?.dataSpecsList;
-  if (!list?.length) {
-    return '-';
-  }
-  const first = list[0];
-  return list.length > 1
-    ? `${first.value}-${first.name} 等 ${list.length} 项`
-    : `${first.value}-${first.name}`;
-});
 </script>
 
 <template>
@@ -62,17 +38,19 @@ const shortText = computed(() => {
     </div>
     <div v-if="PLACEHOLDER_TYPES.has(data.property?.dataType as any)">-</div>
     <div v-if="LIST_TYPES.has(data.property?.dataType as any)">
-      <Tooltip :title="formattedDataSpecsList" placement="topLeft">
-        <span
-          class="cursor-help border-b border-dashed border-gray-300 hover:border-blue-500 hover:text-blue-500"
-        >
-          {{
-            data.property?.dataType === IoTDataSpecsDataTypeEnum.BOOL
-              ? '布尔值'
-              : '枚举值'
-          }}：{{ shortText }}
-        </span>
-      </Tooltip>
+      <div>
+        {{
+          data.property?.dataType === IoTDataSpecsDataTypeEnum.BOOL
+            ? '布尔值'
+            : '枚举值'
+        }}：
+      </div>
+      <div
+        v-for="item in data.property?.dataSpecsList || []"
+        :key="String(item.value)"
+      >
+        {{ item.name }}-{{ item.value }}
+      </div>
     </div>
   </template>
   <!-- 服务 -->
diff --git a/apps/web-antd/src/views/iot/thingmodel/modules/data-specs/array.vue b/apps/web-antd/src/views/iot/thingmodel/modules/data-specs/array.vue
index 9f507d1d3..ebf146620 100644
--- a/apps/web-antd/src/views/iot/thingmodel/modules/data-specs/array.vue
+++ b/apps/web-antd/src/views/iot/thingmodel/modules/data-specs/array.vue
@@ -25,12 +25,11 @@ const childDataTypeOptions = getDataTypeOptions().filter(
 
 const dataSpecs = useVModel(props, 'modelValue', emits) as Ref<any>;
 
-/** 元素类型切到 struct 时，初始化 dataSpecsList 占位 */
-function handleChange(val: any) {
-  if (val !== IoTDataSpecsDataTypeEnum.STRUCT) {
-    return;
-  }
+/** 元素类型切换时，清理旧子类型的结构体属性配置 */
+function handleChange(e: any) {
+  const val = e?.target?.value ?? e;
   dataSpecs.value.dataSpecsList = [];
+  dataSpecs.value.childDataType = val;
 }
 </script>
 
@@ -65,5 +64,6 @@ function handleChange(val: any) {
   <ThingModelStructDataSpecs
     v-if="dataSpecs.childDataType === IoTDataSpecsDataTypeEnum.STRUCT"
     v-model="dataSpecs.dataSpecsList"
+    :field-path="['property', 'dataSpecs', 'dataSpecsList']"
   />
 </template>
diff --git a/apps/web-antd/src/views/iot/thingmodel/modules/data-specs/enum.vue b/apps/web-antd/src/views/iot/thingmodel/modules/data-specs/enum.vue
index 12d8ce324..f9c104c0a 100644
--- a/apps/web-antd/src/views/iot/thingmodel/modules/data-specs/enum.vue
+++ b/apps/web-antd/src/views/iot/thingmodel/modules/data-specs/enum.vue
@@ -2,6 +2,7 @@
 <script lang="ts" setup>
 import type { Ref } from 'vue';
 
+import { IoTDataSpecsDataTypeEnum } from '@vben/constants';
 import { isEmpty } from '@vben/utils';
 
 import { useVModel } from '@vueuse/core';
@@ -17,7 +18,11 @@ const validateEnumName = buildIdentifierLikeNameValidator('枚举描述');
 
 /** 添加枚举项 */
 function addEnum() {
-  dataSpecsList.value.push({ name: '', value: '' } as any);
+  dataSpecsList.value.push({
+    dataType: IoTDataSpecsDataTypeEnum.ENUM,
+    name: '',
+    value: '',
+  } as any);
 }
 
 /** 删除枚举项 */
diff --git a/apps/web-antd/src/views/iot/thingmodel/modules/data-specs/number.vue b/apps/web-antd/src/views/iot/thingmodel/modules/data-specs/number.vue
index 50cc9063a..bd309a5ed 100644
--- a/apps/web-antd/src/views/iot/thingmodel/modules/data-specs/number.vue
+++ b/apps/web-antd/src/views/iot/thingmodel/modules/data-specs/number.vue
@@ -34,24 +34,99 @@ function unitChange(unitSpecs: any) {
   dataSpecs.value.unitName = unitName;
   dataSpecs.value.unit = unit;
 }
+
+/** 校验最小值 */
+function validateMin(_rule: any, _value: any, callback: any) {
+  const min = Number(dataSpecs.value.min);
+  const max = Number(dataSpecs.value.max);
+  if (Number.isNaN(min)) {
+    callback(new Error('请输入有效的数值'));
+    return;
+  }
+  if (!Number.isNaN(max) && min >= max) {
+    callback(new Error('最小值必须小于最大值'));
+    return;
+  }
+  callback();
+}
+
+/** 校验最大值 */
+function validateMax(_rule: any, _value: any, callback: any) {
+  const min = Number(dataSpecs.value.min);
+  const max = Number(dataSpecs.value.max);
+  if (Number.isNaN(max)) {
+    callback(new Error('请输入有效的数值'));
+    return;
+  }
+  if (!Number.isNaN(min) && max <= min) {
+    callback(new Error('最大值必须大于最小值'));
+    return;
+  }
+  callback();
+}
+
+/** 校验步长 */
+function validateStep(_rule: any, _value: any, callback: any) {
+  const step = Number(dataSpecs.value.step);
+  if (Number.isNaN(step)) {
+    callback(new Error('请输入有效的数值'));
+    return;
+  }
+  if (step <= 0) {
+    callback(new Error('步长必须大于 0'));
+    return;
+  }
+  const min = Number(dataSpecs.value.min);
+  const max = Number(dataSpecs.value.max);
+  if (!Number.isNaN(min) && !Number.isNaN(max) && step > max - min) {
+    callback(new Error('步长不能大于最大值与最小值的差值'));
+    return;
+  }
+  callback();
+}
 </script>
 
 <template>
   <Form.Item label="取值范围">
     <div class="flex items-center justify-between">
-      <div class="flex-1">
+      <Form.Item
+        :name="['property', 'dataSpecs', 'min']"
+        :rules="[
+          { required: true, message: '最小值不能为空', trigger: 'blur' },
+          { validator: validateMin, trigger: 'blur' },
+        ]"
+        class="mb-0 flex-1"
+      >
         <Input v-model:value="dataSpecs.min" placeholder="请输入最小值" />
-      </div>
+      </Form.Item>
       <span class="mx-2">~</span>
-      <div class="flex-1">
+      <Form.Item
+        :name="['property', 'dataSpecs', 'max']"
+        :rules="[
+          { required: true, message: '最大值不能为空', trigger: 'blur' },
+          { validator: validateMax, trigger: 'blur' },
+        ]"
+        class="mb-0 flex-1"
+      >
         <Input v-model:value="dataSpecs.max" placeholder="请输入最大值" />
-      </div>
+      </Form.Item>
     </div>
   </Form.Item>
-  <Form.Item label="步长">
+  <Form.Item
+    :name="['property', 'dataSpecs', 'step']"
+    :rules="[
+      { required: true, message: '步长不能为空', trigger: 'blur' },
+      { validator: validateStep, trigger: 'blur' },
+    ]"
+    label="步长"
+  >
     <Input v-model:value="dataSpecs.step" placeholder="请输入步长" />
   </Form.Item>
-  <Form.Item label="单位">
+  <Form.Item
+    :name="['property', 'dataSpecs', 'unit']"
+    :rules="[{ required: true, message: '请选择单位', trigger: 'change' }]"
+    label="单位"
+  >
     <Select
       :value="dataSpecs.unit ? `${dataSpecs.unitName}-${dataSpecs.unit}` : ''"
       show-search
diff --git a/apps/web-antd/src/views/iot/thingmodel/modules/data-specs/struct.vue b/apps/web-antd/src/views/iot/thingmodel/modules/data-specs/struct.vue
index 675b4e030..ed321b38a 100644
--- a/apps/web-antd/src/views/iot/thingmodel/modules/data-specs/struct.vue
+++ b/apps/web-antd/src/views/iot/thingmodel/modules/data-specs/struct.vue
@@ -5,7 +5,7 @@ import { onMounted, ref } from 'vue';
 
 import { useVbenModal } from '@vben/common-ui';
 import { IoTDataSpecsDataTypeEnum } from '@vben/constants';
-import { isEmpty } from '@vben/utils';
+import { cloneDeep, isEmpty } from '@vben/utils';
 
 import { useVModel } from '@vueuse/core';
 import { Button, Divider, Form, Input } from 'ant-design-vue';
@@ -14,13 +14,33 @@ import { ThingModelFormRules } from '#/api/iot/thingmodel';
 
 import ThingModelProperty from '../property.vue';
 
-const props = defineProps<{ modelValue: any }>();
+const props = withDefaults(
+  defineProps<{
+    /** 父表单中 dataSpecsList 的 name 路径，默认 property.dataSpecsList；
+     * array 嵌套 struct 时父级需传 ['property', 'dataSpecs', 'dataSpecsList']，
+     * 否则父表单 validate() 无法定位该字段，非空校验不会触发。 */
+    fieldPath?: string[];
+    modelValue: any;
+  }>(),
+  {
+    fieldPath: () => ['property', 'dataSpecsList'],
+  },
+);
 const emits = defineEmits(['update:modelValue']);
 const dataSpecsList = useVModel(props, 'modelValue', emits) as Ref<any[]>;
 
 const structFormRef = ref();
 const formData = ref<any>(buildEmptyFormData());
 
+/** 校验结构体属性对象非空 */
+function validateStructSpecsList(_rule: any, _value: any, callback: any) {
+  if (isEmpty(dataSpecsList.value)) {
+    callback(new Error('请至少添加一个结构体属性对象'));
+    return;
+  }
+  callback();
+}
+
 const [Modal, modalApi] = useVbenModal({
   async onConfirm() {
     try {
@@ -64,14 +84,15 @@ const [Modal, modalApi] = useVbenModal({
     if (isEmpty(data)) {
       return;
     }
+    // 编辑回显时 cloneDeep，避免弹窗 v-model 改到原始对象（用户取消时不污染外层 dataSpecsList）
     formData.value = {
       identifier: data.identifier ?? '',
       name: data.name ?? '',
       description: data.description ?? '',
       property: {
         dataType: data.childDataType ?? IoTDataSpecsDataTypeEnum.INT,
-        dataSpecs: data.dataSpecs ?? {},
-        dataSpecsList: data.dataSpecsList ?? [],
+        dataSpecs: data.dataSpecs ? cloneDeep(data.dataSpecs) : {},
+        dataSpecsList: data.dataSpecsList ? cloneDeep(data.dataSpecsList) : [],
       },
     };
   },
@@ -109,7 +130,11 @@ onMounted(() => {
 </script>
 
 <template>
-  <Form.Item label="属性对象">
+  <Form.Item
+    :name="fieldPath"
+    :rules="[{ validator: validateStructSpecsList, trigger: 'change' }]"
+    label="属性对象"
+  >
     <div
       v-for="(item, index) in dataSpecsList"
       :key="index"
diff --git a/apps/web-antd/src/views/iot/thingmodel/modules/form.vue b/apps/web-antd/src/views/iot/thingmodel/modules/form.vue
index 29259092e..03e9e204e 100644
--- a/apps/web-antd/src/views/iot/thingmodel/modules/form.vue
+++ b/apps/web-antd/src/views/iot/thingmodel/modules/form.vue
@@ -148,9 +148,6 @@ function fillExtraAttributes(data: any) {
       data.dataType = data.event.dataType;
       data.event.identifier = data.identifier;
       data.event.name = data.name;
-      if (isEmpty(data.event.outputParams)) {
-        delete data.event.outputParams;
-      }
       delete data.property;
       delete data.service;
 
@@ -171,12 +168,6 @@ function fillExtraAttributes(data: any) {
       data.dataType = data.service.dataType;
       data.service.identifier = data.identifier;
       data.service.name = data.name;
-      if (isEmpty(data.service.inputParams)) {
-        delete data.service.inputParams;
-      }
-      if (isEmpty(data.service.outputParams)) {
-        delete data.service.outputParams;
-      }
       delete data.property;
       delete data.event;
 
@@ -225,7 +216,10 @@ function removeDataSpecs(val: any) {
         label="标识符"
         name="identifier"
       >
-        <Input v-model:value="formData.identifier" placeholder="请输入标识符" />
+        <Input
+          v-model:value="formData.identifier"
+          placeholder="请输入标识符"
+        />
       </Form.Item>
       <!-- 属性配置 -->
       <ThingModelProperty
diff --git a/apps/web-antd/src/views/iot/thingmodel/modules/input-output-param.vue b/apps/web-antd/src/views/iot/thingmodel/modules/input-output-param.vue
index f17538445..b1306df7e 100644
--- a/apps/web-antd/src/views/iot/thingmodel/modules/input-output-param.vue
+++ b/apps/web-antd/src/views/iot/thingmodel/modules/input-output-param.vue
@@ -5,16 +5,20 @@ import { ref } from 'vue';
 
 import { useVbenModal } from '@vben/common-ui';
 import { IoTDataSpecsDataTypeEnum } from '@vben/constants';
-import { isEmpty } from '@vben/utils';
+import { cloneDeep, isEmpty } from '@vben/utils';
 
 import { useVModel } from '@vueuse/core';
-import { Button, Divider, Form, Input } from 'ant-design-vue';
+import { Button, Divider, Form, Input, message } from 'ant-design-vue';
 
 import { ThingModelFormRules } from '#/api/iot/thingmodel';
 
 import ThingModelProperty from './property.vue';
 
-const props = defineProps<{ direction: string; modelValue: any }>();
+const props = defineProps<{
+  direction: string;
+  existingIdentifiers?: string[];
+  modelValue: any;
+}>();
 const emits = defineEmits(['update:modelValue']);
 const thingModelParams = useVModel(props, 'modelValue', emits) as Ref<any[]>;
 
@@ -33,6 +37,13 @@ const [Modal, modalApi] = useVbenModal({
     }
     // 组装表单
     const data = formData.value;
+    if (
+      data.identifier &&
+      props.existingIdentifiers?.includes(data.identifier)
+    ) {
+      message.warning('输入参数和输出参数标识符不能重复');
+      return;
+    }
     const item = {
       identifier: data.identifier,
       name: data.name,
@@ -72,15 +83,15 @@ const [Modal, modalApi] = useVbenModal({
     if (isEmpty(data)) {
       return;
     }
-    // 设置到 values
+    // 编辑回显时 cloneDeep，避免弹窗 v-model 改到原始对象（用户取消时不污染外层 thingModelParams）
     formData.value = {
       identifier: data.identifier ?? '',
       name: data.name ?? '',
       description: data.description ?? '',
       property: {
         dataType: data.dataType ?? IoTDataSpecsDataTypeEnum.INT,
-        dataSpecs: data.dataSpecs ?? {},
-        dataSpecsList: data.dataSpecsList ?? [],
+        dataSpecs: data.dataSpecs ? cloneDeep(data.dataSpecs) : {},
+        dataSpecsList: data.dataSpecsList ? cloneDeep(data.dataSpecsList) : [],
       },
     };
   },
diff --git a/apps/web-antd/src/views/iot/thingmodel/modules/service.vue b/apps/web-antd/src/views/iot/thingmodel/modules/service.vue
index dc0ab038a..c75732587 100644
--- a/apps/web-antd/src/views/iot/thingmodel/modules/service.vue
+++ b/apps/web-antd/src/views/iot/thingmodel/modules/service.vue
@@ -29,6 +29,17 @@ watch(
     (service.value.callType = IoTThingModelServiceCallTypeEnum.ASYNC.value),
   { immediate: true },
 );
+
+/** 提取参数标识符列表，用于输入 / 输出参数跨表去重 */
+function getParamIdentifiers(params?: any[]) {
+  const identifiers: string[] = [];
+  for (const item of params || []) {
+    if (item.identifier) {
+      identifiers.push(item.identifier);
+    }
+  }
+  return identifiers;
+}
 </script>
 
 <template>
@@ -51,12 +62,14 @@ watch(
     <ThingModelInputOutputParam
       v-model="service.inputParams"
       :direction="IoTThingModelParamDirectionEnum.INPUT"
+      :existing-identifiers="getParamIdentifiers(service.outputParams)"
     />
   </Form.Item>
   <Form.Item label="输出参数">
     <ThingModelInputOutputParam
       v-model="service.outputParams"
       :direction="IoTThingModelParamDirectionEnum.OUTPUT"
+      :existing-identifiers="getParamIdentifiers(service.inputParams)"
     />
   </Form.Item>
 </template>
diff --git a/apps/web-antd/src/views/mes/cal/calendar/components/calendar-date-cell.vue b/apps/web-antd/src/views/mes/cal/calendar/components/calendar-date-cell.vue
new file mode 100644
index 000000000..e8d162119
--- /dev/null
+++ b/apps/web-antd/src/views/mes/cal/calendar/components/calendar-date-cell.vue
@@ -0,0 +1,135 @@
+<script lang="ts" setup>
+import type { MesCalCalendarApi } from '#/api/mes/cal/calendar';
+
+import { computed } from 'vue';
+
+import { Tag } from 'ant-design-vue';
+import dayjs from 'dayjs';
+import { SolarDay } from 'tyme4ts';
+
+import { MesCalShiftTypeEnum } from '#/views/mes/utils/constants';
+
+const props = defineProps<{
+  calendarDayMap: Map<string, MesCalCalendarApi.CalendarDay>; // 排班数据
+  day: string; // 日期，格式 yyyy-MM-dd
+  holidaySet: Set<string>; // 节假日集合
+}>();
+
+const dayNumber = computed(() => props.day.split('-')[2] || ''); // 取日期中的"日"部分展示
+const isHoliday = computed(() => props.holidaySet.has(props.day));
+const isWeekend = computed(() => {
+  const weekday = dayjs(props.day).day();
+  return weekday === 0 || weekday === 6; // 0=周日，6=周六
+});
+
+const calDay = computed(() => props.calendarDayMap.get(props.day));
+const teamShifts = computed(() => calDay.value?.teamShifts || []);
+const shiftType = computed(() => calDay.value?.shiftType);
+
+/**
+ * 班次标签展示数据：根据 sort 与 shiftType 推导背景色
+ *
+ * 配色规则（sort 对应轮班方式中的班次顺序）：
+ *   sort=1 白班 → 绿色（#95d475）
+ *   sort=2 中班 → 三班倒用橙色（#f0a020），两班倒用灰色（#909399）
+ *   sort=3 夜班 → 灰色（#909399）
+ */
+const displayShifts = computed(() => {
+  const isThreeShift = shiftType.value === MesCalShiftTypeEnum.THREE;
+  const colorMap: Record<number, string> = {
+    1: 'bg-[#95d475]',
+    2: isThreeShift ? 'bg-[#f0a020]' : 'bg-[#909399]',
+    3: 'bg-[#909399]',
+  };
+  return teamShifts.value
+    .map((item) => {
+      const bgClass = colorMap[item.sort ?? -1];
+      if (!bgClass) {
+        return null;
+      }
+      return {
+        bgClass,
+        key: `${item.teamId}-${item.shiftId}`,
+        label: `${item.shiftName} · ${item.teamName}`,
+      };
+    })
+    .filter((v): v is { bgClass: string; key: string; label: string } => !!v);
+});
+
+/** 解析当天的农历、节气、节日信息 */
+const lunarInfo = computed(() => {
+  const [year, month, date] = props.day.split('-').map(Number);
+  try {
+    const solarDay = SolarDay.fromYmd(year!, month!, date!);
+    const lunarDay = solarDay.getLunarDay();
+    const solarFestival = solarDay.getFestival(); // 公历节日，如 元旦
+    const lunarFestival = lunarDay.getFestival(); // 农历节日，如 春节
+    const termDay = solarDay.getTermDay();
+    const termName =
+      termDay.getDayIndex() === 0 ? termDay.getSolarTerm().getName() : '';
+    const lunarMonthName = lunarDay.getLunarMonth().getName();
+    const lunarDayName = lunarDay.getName();
+    return {
+      lunarFestival: lunarFestival ? lunarFestival.getName() : '',
+      lunarText: lunarMonthName + lunarDayName,
+      solarFestival: solarFestival ? solarFestival.getName() : '',
+      termName,
+    };
+  } catch {
+    return {
+      lunarFestival: '',
+      lunarText: '',
+      solarFestival: '',
+      termName: '',
+    };
+  }
+});
+
+/** 优先级：公历节日 > 农历节日 > 节气 > 农历月日 */
+const lunarDisplay = computed(() => {
+  const info = lunarInfo.value;
+  return (
+    info.solarFestival || info.lunarFestival || info.termName || info.lunarText
+  );
+});
+
+/** 当天是否有节日或节气（用于高亮显示农历文字） */
+const hasFestivalDay = computed(() => {
+  const info = lunarInfo.value;
+  return Boolean(info.solarFestival || info.lunarFestival || info.termName);
+});
+</script>
+
+<template>
+  <div class="flex h-full flex-col overflow-hidden p-1">
+    <!-- 顶部：日期数字 + 上班/休息标签 -->
+    <div class="flex shrink-0 items-center justify-between">
+      <span class="text-base font-medium" :class="{ 'text-red-500': isWeekend }">
+        {{ dayNumber }}
+      </span>
+      <Tag v-if="isHoliday" color="green" class="!m-0"> 休 </Tag>
+      <Tag v-else color="blue" class="!m-0"> 班 </Tag>
+    </div>
+    <!-- 农历 / 节气 / 节日显示 -->
+    <div
+      class="mt-0.5 shrink-0 truncate text-[11px]"
+      :class="hasFestivalDay ? 'text-green-600' : 'text-muted-foreground'"
+    >
+      {{ lunarDisplay }}
+    </div>
+    <!--
+      班次列表：节假日不显示排班
+      配色规则与背景类由 displayShifts 计算
+    -->
+    <div v-if="!isHoliday" class="mt-0.5 flex flex-col gap-px overflow-hidden">
+      <div
+        v-for="shift in displayShifts"
+        :key="shift.key"
+        class="block w-full truncate rounded-sm px-1 py-px text-[11px] leading-normal text-white"
+        :class="shift.bgClass"
+      >
+        {{ shift.label }}
+      </div>
+    </div>
+  </div>
+</template>
diff --git a/apps/web-antd/src/views/mes/cal/calendar/components/calendar-legend.vue b/apps/web-antd/src/views/mes/cal/calendar/components/calendar-legend.vue
new file mode 100644
index 000000000..3c7def7fb
--- /dev/null
+++ b/apps/web-antd/src/views/mes/cal/calendar/components/calendar-legend.vue
@@ -0,0 +1,38 @@
+<script lang="ts" setup>
+import { Tag } from 'ant-design-vue';
+
+/** 配色说明项：色块 + 文案 */
+const legendItems: Array<{ color: string; label: string }> = [
+  { color: 'bg-[#95d475]', label: '白班' },
+  { color: 'bg-[#f0a020]', label: '中班（三班倒）' },
+  { color: 'bg-[#909399]', label: '中班（两班倒）/ 夜班' },
+];
+</script>
+
+<template>
+  <div
+    class="text-muted-foreground flex flex-wrap items-center gap-x-4 gap-y-1 px-1 py-2 text-xs"
+  >
+    <span class="shrink-0">配色说明：</span>
+    <span
+      v-for="item in legendItems"
+      :key="item.label"
+      class="flex items-center gap-1"
+    >
+      <span
+        class="inline-block h-2.5 w-2.5 shrink-0 rounded-sm"
+        :class="item.color"
+      ></span>
+      {{ item.label }}
+    </span>
+    <span class="flex items-center gap-1">
+      <span class="inline-block h-2.5 w-2.5 shrink-0 rounded-sm bg-[#f56c6c] opacity-60"></span>
+      <span class="text-red-500">红色日期</span>
+      = 周末
+    </span>
+    <span class="flex items-center gap-1">
+      <Tag color="green" class="!m-0"> 休 </Tag>
+      = 节假日（不显示排班）
+    </span>
+  </div>
+</template>
diff --git a/apps/web-antd/src/views/mes/cal/calendar/components/calendar-panel.vue b/apps/web-antd/src/views/mes/cal/calendar/components/calendar-panel.vue
new file mode 100644
index 000000000..55fd9049a
--- /dev/null
+++ b/apps/web-antd/src/views/mes/cal/calendar/components/calendar-panel.vue
@@ -0,0 +1,106 @@
+<script lang="ts" setup>
+import type { Dayjs } from 'dayjs';
+
+import type { MesCalCalendarApi } from '#/api/mes/cal/calendar';
+
+import { Button, Calendar, Spin } from 'ant-design-vue';
+import dayjs from 'dayjs';
+
+import CalendarDateCell from './calendar-date-cell.vue';
+import CalendarLegend from './calendar-legend.vue';
+
+defineProps<{
+  calendarDayMap: Map<string, MesCalCalendarApi.CalendarDay>;
+  holidaySet: Set<string>;
+  loading?: boolean;
+}>();
+
+const currentDate = defineModel<Dayjs>('currentDate', { required: true });
+
+/** 切换到上月 */
+function handlePrevMonth() {
+  currentDate.value = currentDate.value.subtract(1, 'month');
+}
+
+/** 切换到下月 */
+function handleNextMonth() {
+  currentDate.value = currentDate.value.add(1, 'month');
+}
+
+/** 切换到今天 */
+function handleToday() {
+  currentDate.value = dayjs();
+}
+</script>
+
+<template>
+  <div>
+    <CalendarLegend />
+    <Spin :spinning="loading" wrapper-class-name="block">
+      <div class="bg-card overflow-hidden rounded-md">
+        <Calendar v-model:value="currentDate" class="mes-calendar-panel">
+          <template #headerRender>
+            <div class="flex items-center justify-between p-3">
+              <div class="text-base font-medium">
+                {{ currentDate.format('YYYY 年 MM 月') }}
+              </div>
+              <div class="flex items-center gap-2">
+                <Button @click="handlePrevMonth">上月</Button>
+                <Button @click="handleToday">今天</Button>
+                <Button @click="handleNextMonth">下月</Button>
+              </div>
+            </div>
+          </template>
+          <template #dateFullCellRender="{ current: date }">
+            <div class="h-[110px] text-left">
+              <CalendarDateCell
+                v-if="date.isSame(currentDate, 'month')"
+                :calendar-day-map="calendarDayMap"
+                :day="date.format('YYYY-MM-DD')"
+                :holiday-set="holidaySet"
+              />
+              <div v-else class="text-muted-foreground/50 p-1 text-base">
+                {{ date.format('DD') }}
+              </div>
+            </div>
+          </template>
+        </Calendar>
+      </div>
+    </Spin>
+  </div>
+</template>
+
+<!--
+  仅保留访问 Ant Design Calendar 内部 DOM 的样式，
+  其余已通过 Tailwind 工具类实现
+-->
+<style lang="scss" scoped>
+.mes-calendar-panel {
+  :deep(.ant-picker-content) {
+    border-top: 1px solid hsl(var(--border));
+    border-left: 1px solid hsl(var(--border));
+
+    th {
+      padding: 8px 12px;
+      text-align: left;
+      background: transparent;
+      border-right: 1px solid hsl(var(--border));
+      border-bottom: 1px solid hsl(var(--border));
+    }
+
+    td {
+      padding: 0;
+      border-right: 1px solid hsl(var(--border));
+      border-bottom: 1px solid hsl(var(--border));
+    }
+  }
+
+  :deep(.ant-picker-cell) {
+    padding: 0;
+
+    &::before {
+      display: none;
+    }
+  }
+}
+</style>
diff --git a/apps/web-antd/src/views/mes/cal/calendar/components/use-calendar.ts b/apps/web-antd/src/views/mes/cal/calendar/components/use-calendar.ts
new file mode 100644
index 000000000..381e7f5bd
--- /dev/null
+++ b/apps/web-antd/src/views/mes/cal/calendar/components/use-calendar.ts
@@ -0,0 +1,99 @@
+import type { Dayjs } from 'dayjs';
+
+import type { MesCalCalendarApi } from '#/api/mes/cal/calendar';
+
+import { ref, watch } from 'vue';
+
+import dayjs from 'dayjs';
+
+import { getCalendarList } from '#/api/mes/cal/calendar';
+import { getHolidayList } from '#/api/mes/cal/holiday';
+import { HolidayType } from '#/views/mes/utils/constants';
+
+/**
+ * 排班日历通用 composable
+ *
+ * 封装日历组件中通用的响应式状态、假期加载、排班查询、月份切换逻辑
+ */
+export function useCalendar() {
+  const loading = ref(false);
+  const currentDate = ref<Dayjs>(dayjs());
+  const calendarDayMap = ref<Map<string, MesCalCalendarApi.CalendarDay>>(
+    new Map(),
+  );
+  const holidaySet = ref(new Set<string>());
+
+  /** 计算当前月份的起止时间 */
+  function getMonthRange() {
+    const startDay = currentDate.value
+      .startOf('month')
+      .format('YYYY-MM-DD 00:00:00');
+    const endDay = currentDate.value
+      .endOf('month')
+      .format('YYYY-MM-DD 23:59:59');
+    return { endDay, startDay };
+  }
+
+  /**
+   * 获取节假日列表，按当前月份范围加载
+   *
+   * 失败（无权限 / 接口异常）时不抛出，仅清空当月假期标记，
+   * 避免阻断使用方的主数据初始化
+   */
+  async function loadHolidays() {
+    const { endDay, startDay } = getMonthRange();
+    const days = new Set<string>();
+    try {
+      const list = await getHolidayList({ endDay, startDay });
+      for (const item of list || []) {
+        const day = item.day ? dayjs(item.day).format('YYYY-MM-DD') : '';
+        if (day && item.type === HolidayType.HOLIDAY) {
+          days.add(day);
+        }
+      }
+    } catch {
+      // 没有 mes:cal-holiday:query 权限或接口异常时，仅忽略假期标记
+    }
+    holidaySet.value = days;
+  }
+
+  /** 查询排班日历，params 由调用方提供 queryType 相关参数 */
+  async function fetchCalendar(params: Record<string, any>) {
+    loading.value = true;
+    try {
+      const { endDay, startDay } = getMonthRange();
+      const list = await getCalendarList({ ...params, endDay, startDay });
+      const map = new Map<string, MesCalCalendarApi.CalendarDay>();
+      for (const item of list || []) {
+        const day = item.day ? dayjs(item.day).format('YYYY-MM-DD') : '';
+        if (day) {
+          map.set(day, { ...item, day });
+        }
+      }
+      calendarDayMap.value = map;
+    } finally {
+      loading.value = false;
+    }
+  }
+
+  /** 监听月份切换，调用回调刷新数据 */
+  function watchMonth(callback: () => void) {
+    watch(
+      () => currentDate.value.format('YYYY-MM'),
+      () => {
+        void loadHolidays();
+        callback();
+      },
+    );
+  }
+
+  return {
+    calendarDayMap,
+    currentDate,
+    fetchCalendar,
+    holidaySet,
+    loadHolidays,
+    loading,
+    watchMonth,
+  };
+}
diff --git a/apps/web-antd/src/views/mes/cal/calendar/index.vue b/apps/web-antd/src/views/mes/cal/calendar/index.vue
new file mode 100644
index 000000000..1b9895b85
--- /dev/null
+++ b/apps/web-antd/src/views/mes/cal/calendar/index.vue
@@ -0,0 +1,42 @@
+<script lang="ts" setup>
+import { ref } from 'vue';
+
+import { DocAlert, Page } from '@vben/common-ui';
+
+import { Tabs } from 'ant-design-vue';
+import dayjs from 'dayjs';
+
+import TeamView from './modules/team-view.vue';
+import TypeView from './modules/type-view.vue';
+import UserView from './modules/user-view.vue';
+
+import 'dayjs/locale/zh-cn';
+
+dayjs.locale('zh-cn');
+
+const activeTab = ref<string>('type');
+</script>
+
+<template>
+  <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【排班】排班计划、排班日历"
+        url="https://doc.iocoder.cn/mes/cal/calendar/"
+      />
+    </template>
+    <div class="bg-card rounded-md p-3">
+      <Tabs v-model:active-key="activeTab" type="card">
+        <Tabs.TabPane key="type" tab="按分类" force-render>
+          <TypeView />
+        </Tabs.TabPane>
+        <Tabs.TabPane key="team" tab="按班组" force-render>
+          <TeamView />
+        </Tabs.TabPane>
+        <Tabs.TabPane key="user" tab="按个人" force-render>
+          <UserView />
+        </Tabs.TabPane>
+      </Tabs>
+    </div>
+  </Page>
+</template>
diff --git a/apps/web-antd/src/views/mes/cal/calendar/modules/team-view.vue b/apps/web-antd/src/views/mes/cal/calendar/modules/team-view.vue
new file mode 100644
index 000000000..7637c755b
--- /dev/null
+++ b/apps/web-antd/src/views/mes/cal/calendar/modules/team-view.vue
@@ -0,0 +1,84 @@
+<script lang="ts" setup>
+import type { MesCalTeamApi } from '#/api/mes/cal/team';
+
+import { onMounted, ref } from 'vue';
+
+import { getTeamList } from '#/api/mes/cal/team';
+
+import CalendarPanel from '../components/calendar-panel.vue';
+import { useCalendar } from '../components/use-calendar';
+
+const {
+  calendarDayMap,
+  currentDate,
+  fetchCalendar,
+  holidaySet,
+  loadHolidays,
+  loading,
+  watchMonth,
+} = useCalendar();
+
+const teamList = ref<MesCalTeamApi.Team[]>([]);
+const selectedTeamId = ref<number>();
+
+/** 查询当前月份的排班日历，按选中班组过滤 */
+function doFetch() {
+  if (!selectedTeamId.value) {
+    return;
+  }
+  fetchCalendar({ queryType: 'TEAM', teamId: selectedTeamId.value });
+}
+
+/** 点击左侧班组后切换并刷新日历 */
+function onSelectTeam(id: number) {
+  selectedTeamId.value = id;
+  doFetch();
+}
+
+/** 监听月份切换，重新加载当月排班 */
+watchMonth(() => {
+  if (selectedTeamId.value) {
+    doFetch();
+  }
+});
+
+onMounted(async () => {
+  // 假期列表与班组列表并行加载，避免假期接口无权限或异常时阻断班组排班查询
+  void loadHolidays();
+  teamList.value = await getTeamList();
+  if (teamList.value.length > 0 && teamList.value[0]?.id) {
+    onSelectTeam(teamList.value[0].id);
+  }
+});
+</script>
+
+<template>
+  <div class="flex">
+    <!-- 左侧：班组列表选择 -->
+    <div class="border-border mr-3 w-[150px] shrink-0 overflow-hidden rounded border">
+      <div
+        v-for="team in teamList"
+        :key="team.id"
+        class="text-foreground border-border hover:bg-muted/50 cursor-pointer border-b px-4 py-2.5 text-sm transition-colors last:border-b-0"
+        :class="
+          selectedTeamId === team.id
+            ? 'bg-primary/10 text-primary font-medium'
+            : ''
+        "
+        @click="onSelectTeam(team.id!)"
+      >
+        {{ team.name }}
+      </div>
+    </div>
+
+    <!-- 右侧：日历 -->
+    <div class="flex-1">
+      <CalendarPanel
+        v-model:current-date="currentDate"
+        :calendar-day-map="calendarDayMap"
+        :holiday-set="holidaySet"
+        :loading="loading"
+      />
+    </div>
+  </div>
+</template>
diff --git a/apps/web-antd/src/views/mes/cal/calendar/modules/type-view.vue b/apps/web-antd/src/views/mes/cal/calendar/modules/type-view.vue
new file mode 100644
index 000000000..2919e0755
--- /dev/null
+++ b/apps/web-antd/src/views/mes/cal/calendar/modules/type-view.vue
@@ -0,0 +1,85 @@
+<script lang="ts" setup>
+import type { DictDataType } from '@vben/hooks';
+
+import { onMounted, ref } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
+import CalendarPanel from '../components/calendar-panel.vue';
+import { useCalendar } from '../components/use-calendar';
+
+const {
+  calendarDayMap,
+  currentDate,
+  fetchCalendar,
+  holidaySet,
+  loadHolidays,
+  loading,
+  watchMonth,
+} = useCalendar();
+
+const typeOptions = ref<DictDataType[]>([]);
+const selectedType = ref<number>();
+
+/** 查询当前月份的排班日历，按选中分类过滤 */
+function doFetch() {
+  if (selectedType.value === undefined) {
+    return;
+  }
+  fetchCalendar({ calendarType: selectedType.value, queryType: 'TYPE' });
+}
+
+/** 点击左侧分类后切换并刷新日历 */
+function onSelectType(value: number) {
+  selectedType.value = value;
+  doFetch();
+}
+
+/** 监听月份切换，重新加载当月排班 */
+watchMonth(() => {
+  if (selectedType.value !== undefined) {
+    doFetch();
+  }
+});
+
+onMounted(() => {
+  // 假期列表与排班主数据并行加载，避免假期接口无权限或异常时阻断分类/排班加载
+  void loadHolidays();
+  typeOptions.value = getDictOptions(DICT_TYPE.MES_CAL_CALENDAR_TYPE, 'number');
+  if (typeOptions.value.length > 0) {
+    onSelectType(typeOptions.value[0]!.value as number);
+  }
+});
+</script>
+
+<template>
+  <div class="flex">
+    <!-- 左侧：班组类型选择 -->
+    <div class="border-border mr-3 w-[150px] shrink-0 overflow-hidden rounded border">
+      <div
+        v-for="item in typeOptions"
+        :key="item.value as number"
+        class="text-foreground border-border hover:bg-muted/50 cursor-pointer border-b px-4 py-2.5 text-sm transition-colors last:border-b-0"
+        :class="
+          selectedType === item.value
+            ? 'bg-primary/10 text-primary font-medium'
+            : ''
+        "
+        @click="onSelectType(item.value as number)"
+      >
+        {{ item.label }}
+      </div>
+    </div>
+
+    <!-- 右侧：日历 -->
+    <div class="flex-1">
+      <CalendarPanel
+        v-model:current-date="currentDate"
+        :calendar-day-map="calendarDayMap"
+        :holiday-set="holidaySet"
+        :loading="loading"
+      />
+    </div>
+  </div>
+</template>
diff --git a/apps/web-antd/src/views/mes/cal/calendar/modules/user-view.vue b/apps/web-antd/src/views/mes/cal/calendar/modules/user-view.vue
new file mode 100644
index 000000000..e42bd2342
--- /dev/null
+++ b/apps/web-antd/src/views/mes/cal/calendar/modules/user-view.vue
@@ -0,0 +1,93 @@
+<script lang="ts" setup>
+import type { SystemUserApi } from '#/api/system/user';
+
+import { onMounted, ref } from 'vue';
+
+import { IconifyIcon } from '@vben/icons';
+
+import { Button, Form, FormItem, Select } from 'ant-design-vue';
+
+import { getSimpleUserList } from '#/api/system/user';
+
+import CalendarPanel from '../components/calendar-panel.vue';
+import { useCalendar } from '../components/use-calendar';
+
+const {
+  calendarDayMap,
+  currentDate,
+  fetchCalendar,
+  holidaySet,
+  loadHolidays,
+  loading,
+  watchMonth,
+} = useCalendar();
+
+const userId = ref<number>();
+const userOptions = ref<SystemUserApi.User[]>([]);
+
+/** 查询当前月份的排班日历，按选中人员过滤 */
+function doFetch() {
+  if (!userId.value) {
+    return;
+  }
+  fetchCalendar({ queryType: 'USER', userId: userId.value });
+}
+
+/** 查询按钮 / 下拉选人后刷新日历 */
+function onUserQuery() {
+  doFetch();
+}
+
+/** 监听月份切换，重新加载当月排班 */
+watchMonth(() => {
+  if (userId.value) {
+    doFetch();
+  }
+});
+
+onMounted(async () => {
+  // 假期列表与人员列表并行加载，避免假期接口无权限或异常时阻断人员排班查询
+  void loadHolidays();
+  userOptions.value = await getSimpleUserList();
+});
+</script>
+
+<template>
+  <div>
+    <!-- 顶部：人员选择 -->
+    <Form layout="inline" class="mb-2.5">
+      <FormItem label="人员">
+        <Select
+          v-model:value="userId"
+          allow-clear
+          show-search
+          placeholder="请输入人员姓名搜索"
+          class="!w-[200px]"
+          :options="userOptions"
+          :field-names="{ label: 'nickname', value: 'id' }"
+          :filter-option="
+            (input: string, option: any) =>
+              (option?.nickname ?? '').includes(input)
+          "
+          @change="onUserQuery"
+        />
+      </FormItem>
+      <FormItem>
+        <Button type="primary" @click="onUserQuery">
+          <template #icon>
+            <IconifyIcon icon="lucide:search" />
+          </template>
+          查询
+        </Button>
+      </FormItem>
+    </Form>
+
+    <!-- 日历 -->
+    <CalendarPanel
+      v-model:current-date="currentDate"
+      :calendar-day-map="calendarDayMap"
+      :holiday-set="holidaySet"
+      :loading="loading"
+    />
+  </div>
+</template>
diff --git a/apps/web-antd/src/views/mes/cal/holiday/data.ts b/apps/web-antd/src/views/mes/cal/holiday/data.ts
new file mode 100644
index 000000000..891aa335a
--- /dev/null
+++ b/apps/web-antd/src/views/mes/cal/holiday/data.ts
@@ -0,0 +1,49 @@
+import type { VbenFormSchema } from '#/adapter/form';
+
+import { DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
+import { z } from '#/adapter/form';
+import { HolidayType } from '#/views/mes/utils/constants';
+
+/** 假期设置表单 */
+export function useHolidayFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'day',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'dayDisplay',
+      label: '日期',
+      component: 'Input',
+      componentProps: {
+        disabled: true,
+      },
+    },
+    {
+      fieldName: 'type',
+      label: '类型',
+      component: 'RadioGroup',
+      componentProps: {
+        buttonStyle: 'solid',
+        optionType: 'button',
+        options: getDictOptions(DICT_TYPE.MES_CAL_HOLIDAY_TYPE, 'number'),
+      },
+      rules: z.number().default(HolidayType.WORKDAY),
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入备注',
+        rows: 3,
+      },
+    },
+  ];
+}
diff --git a/apps/web-antd/src/views/mes/cal/holiday/index.vue b/apps/web-antd/src/views/mes/cal/holiday/index.vue
new file mode 100644
index 000000000..73be66f52
--- /dev/null
+++ b/apps/web-antd/src/views/mes/cal/holiday/index.vue
@@ -0,0 +1,235 @@
+<script lang="ts" setup>
+import type { Dayjs } from 'dayjs';
+
+import { onMounted, ref, watch } from 'vue';
+
+import { useAccess } from '@vben/access';
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
+
+import { Button, Calendar, message, Tag } from 'ant-design-vue';
+import dayjs from 'dayjs';
+import { SolarDay } from 'tyme4ts';
+
+import { getHolidayList } from '#/api/mes/cal/holiday';
+import { HolidayType } from '#/views/mes/utils/constants';
+
+import HolidayForm from './modules/form.vue';
+
+import 'dayjs/locale/zh-cn';
+
+dayjs.locale('zh-cn');
+
+const currentDate = ref<Dayjs>(dayjs()); // 当前日历选中日期
+const holidaySet = ref(new Set<string>()); // 节假日日期集合
+const lastFetchedMonth = ref(''); // 上次加载月份
+const { hasAccessByCodes } = useAccess();
+
+const [HolidayFormModal, holidayFormModalApi] = useVbenModal({
+  connectedComponent: HolidayForm,
+  destroyOnClose: true,
+});
+
+/** 加载假期列表（按当前日历可见范围过滤） */
+async function getList() {
+  const current = currentDate.value;
+  const startDay = current
+    .subtract(1, 'month')
+    .startOf('month')
+    .format('YYYY-MM-DD 00:00:00');
+  const endDay = current
+    .add(1, 'month')
+    .endOf('month')
+    .format('YYYY-MM-DD 23:59:59');
+  const list = await getHolidayList({ startDay, endDay });
+  const days = new Set<string>();
+  for (const item of list || []) {
+    const day = item.day ? dayjs(item.day).format('YYYY-MM-DD') : '';
+    if (day && item.type === HolidayType.HOLIDAY) {
+      days.add(day);
+    }
+  }
+  holidaySet.value = days;
+  lastFetchedMonth.value = current.format('YYYY-MM');
+}
+
+/** 点击日期：打开假期设置弹窗 */
+function handleDayClick(date: Dayjs) {
+  // 非当前月日期，不处理（避免切换月份）
+  if (!date.isSame(currentDate.value, 'month')) {
+    return;
+  }
+  if (!hasAccessByCodes(['mes:cal-holiday:create'])) {
+    message.warning('没有假期设置权限');
+    return;
+  }
+  holidayFormModalApi.setData({ day: date.format('YYYY-MM-DD') }).open();
+}
+
+/** 切换到上月 */
+function handlePrevMonth() {
+  currentDate.value = currentDate.value.subtract(1, 'month');
+}
+
+/** 切换到下月 */
+function handleNextMonth() {
+  currentDate.value = currentDate.value.add(1, 'month');
+}
+
+/** 切换到今天 */
+function handleToday() {
+  currentDate.value = dayjs();
+}
+
+/** 判断是否周末 */
+function isWeekend(day: string) {
+  const weekday = dayjs(day).day();
+  return weekday === 0 || weekday === 6;
+}
+
+/** 获取农历信息 */
+function getLunarInfo(day: string) {
+  const [year, month, date] = day.split('-').map(Number);
+  try {
+    const solarDay = SolarDay.fromYmd(year!, month!, date!);
+    const lunarDay = solarDay.getLunarDay();
+    const solarFestival = solarDay.getFestival();
+    const lunarFestival = lunarDay.getFestival();
+    const termDay = solarDay.getTermDay();
+    const termName =
+      termDay.getDayIndex() === 0 ? termDay.getSolarTerm().getName() : '';
+    return {
+      lunarFestival: lunarFestival ? lunarFestival.getName() : '',
+      lunarText: lunarDay.getLunarMonth().getName() + lunarDay.getName(),
+      solarFestival: solarFestival ? solarFestival.getName() : '',
+      termName,
+    };
+  } catch {
+    return { lunarFestival: '', lunarText: '', solarFestival: '', termName: '' };
+  }
+}
+
+/** 获取农历显示文本 */
+function getLunarDisplay(day: string) {
+  const info = getLunarInfo(day);
+  return (
+    info.solarFestival || info.lunarFestival || info.termName || info.lunarText
+  );
+}
+
+/** 判断是否有节日 */
+function hasFestival(day: string) {
+  const info = getLunarInfo(day);
+  return !!(info.solarFestival || info.lunarFestival || info.termName);
+}
+
+/** 监听月份切换，重新加载可见范围内的数据 */
+watch(currentDate, (newDate) => {
+  const newMonth = newDate.format('YYYY-MM');
+  if (newMonth !== lastFetchedMonth.value) {
+    getList();
+  }
+});
+
+onMounted(getList);
+</script>
+
+<template>
+  <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【排班】班组设置、节假日设置"
+        url="https://doc.iocoder.cn/mes/cal/team/"
+      />
+    </template>
+    <HolidayFormModal @success="getList" />
+    <div class="bg-card overflow-hidden rounded-md">
+      <Calendar v-model:value="currentDate" class="mes-holiday-calendar">
+        <template #headerRender>
+          <div class="flex items-center justify-between p-3">
+            <div class="text-base font-medium">
+              {{ currentDate.format('YYYY 年 MM 月') }}
+            </div>
+            <div class="flex items-center gap-2">
+              <Button @click="handlePrevMonth">上月</Button>
+              <Button @click="handleToday">今天</Button>
+              <Button @click="handleNextMonth">下月</Button>
+            </div>
+          </div>
+        </template>
+        <template #dateFullCellRender="{ current: date }">
+          <div
+            class="hover:bg-muted/50 h-[84px] cursor-pointer p-2 text-left transition"
+            @click.stop="handleDayClick(date)"
+          >
+            <div class="flex items-center justify-between">
+              <span
+                class="text-base font-medium"
+                :class="{
+                  'text-red-500':
+                    isWeekend(date.format('YYYY-MM-DD')) &&
+                    date.isSame(currentDate, 'month'),
+                }"
+              >
+                {{ date.format('DD') }}
+              </span>
+              <Tag
+                v-if="
+                  date.isSame(currentDate, 'month') &&
+                  holidaySet.has(date.format('YYYY-MM-DD'))
+                "
+                color="green"
+              >
+                休
+              </Tag>
+              <Tag v-else-if="date.isSame(currentDate, 'month')" color="blue">
+                班
+              </Tag>
+            </div>
+            <div
+              class="mt-1 text-xs"
+              :class="
+                hasFestival(date.format('YYYY-MM-DD'))
+                  ? 'text-green-600'
+                  : 'text-muted-foreground'
+              "
+            >
+              {{ getLunarDisplay(date.format('YYYY-MM-DD')) }}
+            </div>
+          </div>
+        </template>
+      </Calendar>
+    </div>
+  </Page>
+</template>
+
+<style lang="scss" scoped>
+/* 重置 Ant Design Calendar 的默认对齐和内边距，使用自定义单元格 */
+.mes-holiday-calendar {
+  :deep(.ant-picker-content) {
+    border-top: 1px solid hsl(var(--border));
+    border-left: 1px solid hsl(var(--border));
+
+    th {
+      padding: 8px 12px;
+      text-align: left;
+      background: transparent;
+      border-right: 1px solid hsl(var(--border));
+      border-bottom: 1px solid hsl(var(--border));
+    }
+
+    td {
+      padding: 0;
+      border-right: 1px solid hsl(var(--border));
+      border-bottom: 1px solid hsl(var(--border));
+    }
+  }
+
+  :deep(.ant-picker-cell) {
+    padding: 0;
+
+    &::before {
+      display: none;
+    }
+  }
+}
+</style>
diff --git a/apps/web-antd/src/views/mes/cal/holiday/modules/form.vue b/apps/web-antd/src/views/mes/cal/holiday/modules/form.vue
new file mode 100644
index 000000000..166514c50
--- /dev/null
+++ b/apps/web-antd/src/views/mes/cal/holiday/modules/form.vue
@@ -0,0 +1,85 @@
+<script lang="ts" setup>
+import type { MesCalHolidayApi } from '#/api/mes/cal/holiday';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { message } from 'ant-design-vue';
+import dayjs from 'dayjs';
+
+import { useVbenForm } from '#/adapter/form';
+import { getHolidayByDay, saveHoliday } from '#/api/mes/cal/holiday';
+import { HolidayType } from '#/views/mes/utils/constants';
+
+import { useHolidayFormSchema } from '../data';
+
+const emit = defineEmits(['success']);
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-2',
+    labelWidth: 80,
+  },
+  layout: 'horizontal',
+  schema: useHolidayFormSchema(),
+  showDefaultActions: false,
+});
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    const data = (await formApi.getValues()) as MesCalHolidayApi.Holiday & { dayDisplay?: string };
+    try {
+      await saveHoliday({ day: data.day, type: data.type, remark: data.remark });
+      // 关闭并提示
+      await modalApi.close();
+      emit('success');
+      message.success('设置成功');
+    } finally {
+      modalApi.unlock();
+    }
+  },
+  async onOpenChange(isOpen: boolean) {
+    if (!isOpen) {
+      return;
+    }
+    await formApi.resetForm();
+    const data = modalApi.getData<{ day: string }>();
+    if (!data?.day) {
+      return;
+    }
+    const timestamp = dayjs(data.day + ' 00:00:00').valueOf();
+    await formApi.setValues({
+      day: timestamp,
+      dayDisplay: data.day,
+      type: HolidayType.WORKDAY,
+      remark: '',
+    });
+    modalApi.lock();
+    try {
+      const holiday = await getHolidayByDay(dayjs(timestamp).format('YYYY-MM-DD HH:mm:ss'));
+      if (holiday) {
+        await formApi.setValues({
+          type: holiday.type ?? HolidayType.WORKDAY,
+          remark: holiday.remark ?? '',
+        });
+      }
+    } finally {
+      modalApi.unlock();
+    }
+  },
+});
+</script>
+
+<template>
+  <Modal title="假期设置" class="w-1/3">
+    <Form class="mx-4" />
+  </Modal>
+</template>
diff --git a/apps/web-antd/src/views/mes/cal/plan/data.ts b/apps/web-antd/src/views/mes/cal/plan/data.ts
new file mode 100644
index 000000000..a12ad2e13
--- /dev/null
+++ b/apps/web-antd/src/views/mes/cal/plan/data.ts
@@ -0,0 +1,280 @@
+import type { VbenFormApi, VbenFormSchema } from '#/adapter/form';
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesCalPlanApi } from '#/api/mes/cal/plan';
+
+import { h } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
+import { Button } from 'ant-design-vue';
+
+import { generateAutoCode } from '#/api/mes/md/autocode/record';
+import { getRangePickerDefaultProps } from '#/utils';
+import {
+  MesAutoCodeRuleCode,
+  MesCalPlanStatusEnum,
+  MesCalShiftMethodEnum,
+  MesCalShiftTypeEnum,
+} from '#/views/mes/utils/constants';
+
+/** 新增/修改排班计划的表单 */
+export function useFormSchema(formApi?: VbenFormApi): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'status',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+      defaultValue: MesCalPlanStatusEnum.PREPARE,
+    },
+    {
+      fieldName: 'code',
+      label: '计划编码',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入计划编码',
+      },
+      rules: 'required',
+      suffix: () =>
+        h(
+          Button,
+          {
+            type: 'default',
+            onClick: async () => {
+              try {
+                const code = await generateAutoCode(MesAutoCodeRuleCode.CAL_PLAN_CODE);
+                await formApi?.setFieldValue('code', code);
+              } catch (error) {
+                console.error(error);
+              }
+            },
+          },
+          { default: () => '生成' },
+        ),
+    },
+    {
+      fieldName: 'name',
+      label: '计划名称',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入计划名称',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'calendarType',
+      label: '班组类型',
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: getDictOptions(DICT_TYPE.MES_CAL_CALENDAR_TYPE, 'number'),
+        placeholder: '请选择班组类型',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'startDate',
+      label: '开始日期',
+      component: 'DatePicker',
+      componentProps: {
+        format: 'YYYY-MM-DD',
+        placeholder: '请选择开始日期',
+        valueFormat: 'x',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'endDate',
+      label: '结束日期',
+      component: 'DatePicker',
+      componentProps: {
+        format: 'YYYY-MM-DD',
+        placeholder: '请选择结束日期',
+        valueFormat: 'x',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'shiftType',
+      label: '轮班方式',
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: getDictOptions(DICT_TYPE.MES_CAL_SHIFT_TYPE, 'number'),
+        placeholder: '请选择轮班方式',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'shiftMethod',
+      label: '倒班方式',
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: getDictOptions(DICT_TYPE.MES_CAL_SHIFT_METHOD, 'number'),
+        placeholder: '请选择倒班方式',
+      },
+      dependencies: {
+        triggerFields: ['shiftType'],
+        show: (values) => !!values.shiftType && values.shiftType !== MesCalShiftTypeEnum.SINGLE,
+      },
+    },
+    {
+      fieldName: 'shiftCount',
+      label: '倒班天数',
+      component: 'InputNumber',
+      componentProps: {
+        class: '!w-full',
+        min: 1,
+        precision: 0,
+      },
+      dependencies: {
+        triggerFields: ['shiftMethod'],
+        show: (values) => values.shiftMethod === MesCalShiftMethodEnum.DAY,
+      },
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      formItemClass: 'col-span-3',
+      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: 'startDate',
+      label: '开始日期',
+      component: 'RangePicker',
+      componentProps: {
+        ...getRangePickerDefaultProps(),
+      },
+    },
+    {
+      fieldName: 'endDate',
+      label: '结束日期',
+      component: 'RangePicker',
+      componentProps: {
+        ...getRangePickerDefaultProps(),
+      },
+    },
+    {
+      fieldName: 'shiftType',
+      label: '轮班方式',
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: getDictOptions(DICT_TYPE.MES_CAL_SHIFT_TYPE, 'number'),
+        placeholder: '请选择轮班方式',
+      },
+    },
+    {
+      fieldName: 'status',
+      label: '状态',
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: getDictOptions(DICT_TYPE.MES_CAL_PLAN_STATUS, 'number'),
+        placeholder: '请选择状态',
+      },
+    },
+  ];
+}
+
+/** 列表的字段 */
+export function useGridColumns(): VxeTableGridOptions<MesCalPlanApi.Plan>['columns'] {
+  return [
+    {
+      field: 'code',
+      title: '计划编码',
+      minWidth: 140,
+      slots: {
+        default: 'code',
+      },
+    },
+    { field: 'name', title: '计划名称', minWidth: 150 },
+    {
+      field: 'calendarType',
+      title: '班组类型',
+      width: 120,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_CAL_CALENDAR_TYPE },
+      },
+    },
+    { field: 'startDate', title: '开始日期', width: 150, formatter: 'formatDate' },
+    { field: 'endDate', title: '结束日期', width: 150, formatter: 'formatDate' },
+    {
+      field: 'shiftType',
+      title: '轮班方式',
+      width: 120,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_CAL_SHIFT_TYPE },
+      },
+    },
+    {
+      field: 'shiftMethod',
+      title: '倒班方式',
+      width: 120,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_CAL_SHIFT_METHOD },
+      },
+    },
+    {
+      field: 'status',
+      title: '单据状态',
+      width: 120,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_CAL_PLAN_STATUS },
+      },
+    },
+    { field: 'createTime', title: '创建时间', width: 180, formatter: 'formatDateTime' },
+    {
+      title: '操作',
+      width: 160,
+      fixed: 'right',
+      slots: {
+        default: 'actions',
+      },
+    },
+  ];
+}
diff --git a/apps/web-antd/src/views/mes/cal/plan/index.vue b/apps/web-antd/src/views/mes/cal/plan/index.vue
new file mode 100644
index 000000000..bf6e77dbb
--- /dev/null
+++ b/apps/web-antd/src/views/mes/cal/plan/index.vue
@@ -0,0 +1,150 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesCalPlanApi } from '#/api/mes/cal/plan';
+
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
+import { downloadFileFromBlobPart } from '@vben/utils';
+
+import { Button, message } from 'ant-design-vue';
+
+import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import { deletePlan, exportPlan, getPlanPage } from '#/api/mes/cal/plan';
+import { $t } from '#/locales';
+import { MesCalPlanStatusEnum } from '#/views/mes/utils/constants';
+
+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({ type: 'create' }).open();
+}
+
+/** 查看排班计划 */
+function handleDetail(row: MesCalPlanApi.Plan) {
+  formModalApi.setData({ id: row.id, type: 'detail' }).open();
+}
+
+/** 编辑排班计划 */
+function handleEdit(row: MesCalPlanApi.Plan) {
+  formModalApi.setData({ id: row.id, type: 'update' }).open();
+}
+
+/** 删除排班计划 */
+async function handleDelete(row: MesCalPlanApi.Plan) {
+  const hideLoading = message.loading({
+    content: $t('ui.actionMessage.deleting', [row.name]),
+    duration: 0,
+  });
+  try {
+    await deletePlan(row.id!);
+    message.success($t('ui.actionMessage.deleteSuccess', [row.name]));
+    handleRefresh();
+  } finally {
+    hideLoading();
+  }
+}
+
+/** 导出排班计划 */
+async function handleExport() {
+  const data = await exportPlan(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) =>
+          await getPlanPage({ pageNo: page.currentPage, pageSize: page.pageSize, ...formValues }),
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+  } as VxeTableGridOptions<MesCalPlanApi.Plan>,
+});
+</script>
+
+<template>
+  <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【排班】排班计划、排班日历"
+        url="https://doc.iocoder.cn/mes/cal/calendar/"
+      />
+    </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:cal-plan:create'],
+              onClick: handleCreate,
+            },
+            {
+              label: $t('ui.actionTitle.export'),
+              type: 'primary',
+              icon: ACTION_ICON.DOWNLOAD,
+              auth: ['mes:cal-plan:export'],
+              onClick: handleExport,
+            },
+          ]"
+        />
+      </template>
+      <template #code="{ row }">
+        <Button type="link" @click="handleDetail(row)">{{ row.code }}</Button>
+      </template>
+      <template #actions="{ row }">
+        <TableAction
+          v-if="row.status === MesCalPlanStatusEnum.PREPARE"
+          :actions="[
+            {
+              label: $t('common.edit'),
+              type: 'link',
+              icon: ACTION_ICON.EDIT,
+              auth: ['mes:cal-plan:update'],
+              onClick: handleEdit.bind(null, row),
+            },
+            {
+              label: $t('common.delete'),
+              type: 'link',
+              danger: true,
+              icon: ACTION_ICON.DELETE,
+              auth: ['mes:cal-plan: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/cal/plan/modules/form.vue b/apps/web-antd/src/views/mes/cal/plan/modules/form.vue
new file mode 100644
index 000000000..fb2202b4f
--- /dev/null
+++ b/apps/web-antd/src/views/mes/cal/plan/modules/form.vue
@@ -0,0 +1,158 @@
+<script lang="ts" setup>
+import type { MesCalPlanApi } from '#/api/mes/cal/plan';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { Button, message, Popconfirm, Tabs } from 'ant-design-vue';
+
+import { useVbenForm } from '#/adapter/form';
+import { confirmPlan, createPlan, getPlan, updatePlan } from '#/api/mes/cal/plan';
+import { $t } from '#/locales';
+import { MesCalPlanStatusEnum } from '#/views/mes/utils/constants';
+
+import { useFormSchema } from '../data';
+import ShiftList from './shift-list.vue';
+import PlanTeamList from './team-list.vue';
+
+type FormMode = 'create' | 'detail' | 'update';
+
+const emit = defineEmits(['success']);
+const formMode = ref<FormMode>('create'); // 表单模式
+const subTabsName = ref('shift'); // 当前资源页签
+const formData = ref<MesCalPlanApi.Plan>();
+const isDetail = computed(() => formMode.value === 'detail'); // 是否查看模式
+const canConfirm = computed(
+  () => formMode.value === 'update' && formData.value?.status === MesCalPlanStatusEnum.PREPARE,
+); // 是否可确认计划
+const getTitle = computed(() => {
+  if (formMode.value === 'detail') {
+    return $t('ui.actionTitle.view', ['排班计划']);
+  }
+  return formMode.value === 'update'
+    ? $t('ui.actionTitle.edit', ['排班计划'])
+    : $t('ui.actionTitle.create', ['排班计划']);
+});
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-1',
+    labelWidth: 100,
+  },
+  wrapperClass: 'grid-cols-3',
+  layout: 'horizontal',
+  schema: [],
+  showDefaultActions: false,
+});
+
+/** 表单 schema 需要 formApi 引用，所以通过 setState 设置 schema */
+formApi.setState({ schema: useFormSchema(formApi) });
+
+/** 确认排班计划 */
+async function handleConfirmPlan() {
+  const { valid } = await formApi.validate();
+  if (!valid || !formData.value?.id) {
+    return;
+  }
+
+  modalApi.lock();
+  try {
+    const data = (await formApi.getValues()) as MesCalPlanApi.Plan;
+    await updatePlan(data);
+    await confirmPlan(formData.value.id);
+    await modalApi.close();
+    emit('success');
+    message.success('确认成功');
+  } finally {
+    modalApi.unlock();
+  }
+}
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    if (isDetail.value) {
+      await modalApi.close();
+      return;
+    }
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    const data = (await formApi.getValues()) as MesCalPlanApi.Plan;
+    try {
+      if (formMode.value === 'create') {
+        const id = await createPlan(data);
+        formData.value = { ...data, id: id as number, status: MesCalPlanStatusEnum.PREPARE };
+        await formApi.setFieldValue('id', id);
+        formMode.value = 'update';
+      } else {
+        await updatePlan(data);
+        formData.value = { ...formData.value, ...data };
+      }
+      emit('success');
+      message.success($t('ui.actionMessage.operationSuccess'));
+    } finally {
+      modalApi.unlock();
+    }
+  },
+  async onOpenChange(isOpen: boolean) {
+    if (!isOpen) {
+      formData.value = undefined;
+      return;
+    }
+    await formApi.resetForm();
+    subTabsName.value = 'shift';
+    // 加载数据
+    const data = modalApi.getData<{ id?: number; type?: FormMode }>();
+    formMode.value = data?.type || 'create';
+    formApi.setDisabled(formMode.value === 'detail');
+    modalApi.setState({ showConfirmButton: formMode.value !== 'detail' });
+    if (!data?.id) {
+      return;
+    }
+    modalApi.lock();
+    try {
+      formData.value = await getPlan(data.id);
+      // 设置到 values
+      await formApi.setValues(formData.value);
+    } finally {
+      modalApi.unlock();
+    }
+  },
+});
+</script>
+
+<template>
+  <Modal :title="getTitle" class="w-4/5">
+    <Form class="mx-4" />
+    <Tabs
+      v-if="formMode !== 'create' && formData?.id"
+      v-model:active-key="subTabsName"
+      class="mx-4 mt-4"
+    >
+      <Tabs.TabPane key="shift" tab="班次">
+        <ShiftList :form-type="formMode" :plan-id="formData.id" />
+      </Tabs.TabPane>
+      <Tabs.TabPane key="team" tab="班组">
+        <PlanTeamList :form-type="formMode" :plan-id="formData.id" />
+      </Tabs.TabPane>
+    </Tabs>
+    <template #prepend-footer>
+      <div class="flex flex-auto items-center">
+        <Popconfirm
+          v-if="canConfirm"
+          title="确认该排班计划？确认后将不可修改或删除。"
+          @confirm="handleConfirmPlan"
+        >
+          <Button type="primary">确认计划</Button>
+        </Popconfirm>
+      </div>
+    </template>
+  </Modal>
+</template>
diff --git a/apps/web-antd/src/views/mes/cal/plan/modules/shift-list.vue b/apps/web-antd/src/views/mes/cal/plan/modules/shift-list.vue
new file mode 100644
index 000000000..d2cf20c2c
--- /dev/null
+++ b/apps/web-antd/src/views/mes/cal/plan/modules/shift-list.vue
@@ -0,0 +1,236 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesCalPlanShiftApi } from '#/api/mes/cal/plan/shift';
+
+import { computed, ref, watch } from 'vue';
+
+import { message, Modal } from 'ant-design-vue';
+
+import { useVbenForm, z } from '#/adapter/form';
+import { TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import {
+  createPlanShift,
+  deletePlanShift,
+  getPlanShiftListByPlan,
+  updatePlanShift,
+} from '#/api/mes/cal/plan/shift';
+import { $t } from '#/locales';
+
+const props = withDefaults(defineProps<{ formType?: string; planId: number }>(), {
+  formType: 'update',
+});
+const isEditable = computed(() => props.formType !== 'detail'); // 是否可编辑
+const formOpen = ref(false); // 班次表单是否打开
+const formLoading = ref(false); // 班次表单提交中
+const shiftFormType = ref<'create' | 'update'>('create'); // 班次表单模式
+const formTitle = computed(() => (shiftFormType.value === 'create' ? '添加班次' : '修改班次'));
+const list = ref<MesCalPlanShiftApi.PlanShift[]>([]); // 班次列表
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-2',
+    labelWidth: 80,
+  },
+  layout: 'horizontal',
+  schema: [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'planId',
+      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: 'name',
+      label: '班次名称',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入班次名称',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'startTime',
+      label: '开始时间',
+      component: 'TimePicker',
+      componentProps: {
+        format: 'HH:mm',
+        placeholder: '请选择开始时间',
+        valueFormat: 'HH:mm',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'endTime',
+      label: '结束时间',
+      component: 'TimePicker',
+      componentProps: {
+        format: 'HH:mm',
+        placeholder: '请选择结束时间',
+        valueFormat: 'HH:mm',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入备注',
+        rows: 3,
+      },
+    },
+  ],
+  showDefaultActions: false,
+});
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    autoResize: true,
+    border: true,
+    columns: [
+      { field: 'sort', title: '顺序', width: 80 },
+      { field: 'name', title: '班次名称', minWidth: 120 },
+      { field: 'startTime', title: '开始时间', width: 100 },
+      { field: 'endTime', title: '结束时间', width: 100 },
+      { field: 'remark', title: '备注', minWidth: 150 },
+      {
+        title: '操作',
+        width: 130,
+        fixed: 'right',
+        slots: {
+          default: 'actions',
+        },
+        visible: isEditable.value,
+      },
+    ],
+    data: list.value,
+    minHeight: 240,
+    pagerConfig: {
+      enabled: false,
+    },
+    rowConfig: {
+      isHover: true,
+      keyField: 'id',
+    },
+    showOverflow: true,
+    toolbarConfig: {
+      enabled: false,
+    },
+  } as VxeTableGridOptions<MesCalPlanShiftApi.PlanShift>,
+});
+
+/** 加载班次列表 */
+async function getList() {
+  gridApi.setLoading(true);
+  try {
+    list.value = await getPlanShiftListByPlan(props.planId);
+    gridApi.setGridOptions({ data: list.value });
+  } finally {
+    gridApi.setLoading(false);
+  }
+}
+
+/** 打开班次表单 */
+async function openForm(type: 'create' | 'update', row?: MesCalPlanShiftApi.PlanShift) {
+  formOpen.value = true;
+  shiftFormType.value = type;
+  await formApi.resetForm();
+  await formApi.setValues(row ? { ...row } : { planId: props.planId, sort: 1 });
+}
+
+/** 提交班次表单 */
+async function submitForm() {
+  const { valid } = await formApi.validate();
+  if (!valid) {
+    return;
+  }
+  formLoading.value = true;
+  try {
+    const data = (await formApi.getValues()) as MesCalPlanShiftApi.PlanShift;
+    await (shiftFormType.value === 'create' ? createPlanShift(data) : updatePlanShift(data));
+    formOpen.value = false;
+    message.success($t('ui.actionMessage.operationSuccess'));
+    await getList();
+  } finally {
+    formLoading.value = false;
+  }
+}
+
+/** 删除班次 */
+async function handleDelete(id: number) {
+  await deletePlanShift(id);
+  message.success($t('ui.actionMessage.deleteSuccess', ['班次']));
+  await getList();
+}
+
+watch(
+  () => props.planId,
+  (value) => {
+    if (value) {
+      getList();
+    }
+  },
+  { immediate: true },
+);
+</script>
+
+<template>
+  <div>
+    <div v-if="isEditable" class="mb-3 flex items-center justify-start">
+      <TableAction
+        :actions="[{ label: '添加班次', type: 'primary', onClick: openForm.bind(null, 'create') }]"
+      />
+    </div>
+    <Grid class="w-full">
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            { label: '编辑', type: 'link', onClick: openForm.bind(null, 'update', row) },
+            {
+              label: '删除',
+              type: 'link',
+              danger: true,
+              popConfirm: {
+                title: '确认删除该班次吗？',
+                confirm: handleDelete.bind(null, row.id!),
+              },
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+    <Modal
+      v-model:open="formOpen"
+      :title="formTitle"
+      width="520px"
+      :confirm-loading="formLoading"
+      @ok="submitForm"
+    >
+      <Form class="mx-4" />
+    </Modal>
+  </div>
+</template>
diff --git a/apps/web-antd/src/views/mes/cal/plan/modules/team-list.vue b/apps/web-antd/src/views/mes/cal/plan/modules/team-list.vue
new file mode 100644
index 000000000..cac43c757
--- /dev/null
+++ b/apps/web-antd/src/views/mes/cal/plan/modules/team-list.vue
@@ -0,0 +1,207 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesCalPlanTeamApi } from '#/api/mes/cal/plan/team';
+import type { MesCalTeamApi } from '#/api/mes/cal/team';
+import type { MesCalTeamMemberApi } from '#/api/mes/cal/team/member';
+
+import { computed, ref, watch } from 'vue';
+
+import { Card, message } from 'ant-design-vue';
+
+import { TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import { createPlanTeam, deletePlanTeam, getPlanTeamListByPlan } from '#/api/mes/cal/plan/team';
+import { getTeamMemberListByTeam } from '#/api/mes/cal/team/member';
+import { $t } from '#/locales';
+import { CalTeamSelectDialog } from '#/views/mes/cal/team/components';
+
+const props = withDefaults(defineProps<{ formType?: string; planId: number }>(), {
+  formType: 'update',
+});
+const isEditable = computed(() => props.formType !== 'detail'); // 是否可编辑
+const list = ref<MesCalPlanTeamApi.PlanTeam[]>([]); // 计划班组列表
+const memberList = ref<MesCalTeamMemberApi.TeamMember[]>([]); // 班组成员列表
+const selectedTeamId = ref<number>(); // 选中班组编号
+const selectedTeamName = ref(''); // 选中班组名称
+const teamDialogRef = ref<InstanceType<typeof CalTeamSelectDialog>>(); // 班组选择弹窗
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    autoResize: true,
+    border: true,
+    columns: [
+      { field: 'teamId', title: '班组编号', width: 100 },
+      { field: 'teamCode', title: '班组编码', minWidth: 120 },
+      { field: 'teamName', title: '班组名称', minWidth: 120 },
+      { field: 'remark', title: '备注', minWidth: 150 },
+      {
+        title: '操作',
+        width: 90,
+        fixed: 'right',
+        slots: {
+          default: 'actions',
+        },
+        visible: isEditable.value,
+      },
+    ],
+    data: list.value,
+    minHeight: 260,
+    pagerConfig: {
+      enabled: false,
+    },
+    rowConfig: {
+      isCurrent: true,
+      isHover: true,
+      keyField: 'id',
+    },
+    showOverflow: true,
+    toolbarConfig: {
+      enabled: false,
+    },
+  } as VxeTableGridOptions<MesCalPlanTeamApi.PlanTeam>,
+  gridEvents: {
+    cellClick: ({ row }: { row: MesCalPlanTeamApi.PlanTeam }) => handleTeamSelect(row),
+  },
+});
+
+const [MemberGrid, memberGridApi] = useVbenVxeGrid({
+  gridOptions: {
+    autoResize: true,
+    border: true,
+    columns: [
+      { field: 'nickname', title: '用户昵称', minWidth: 100 },
+      { field: 'telephone', title: '手机号', minWidth: 120 },
+      { field: 'remark', title: '备注', minWidth: 120 },
+    ],
+    data: memberList.value,
+    minHeight: 260,
+    pagerConfig: {
+      enabled: false,
+    },
+    rowConfig: {
+      isHover: true,
+      keyField: 'id',
+    },
+    showOverflow: true,
+    toolbarConfig: {
+      enabled: false,
+    },
+  } as VxeTableGridOptions<MesCalTeamMemberApi.TeamMember>,
+});
+
+/** 加载计划班组列表 */
+async function getList() {
+  gridApi.setLoading(true);
+  try {
+    list.value = await getPlanTeamListByPlan(props.planId);
+    gridApi.setGridOptions({ data: list.value });
+  } finally {
+    gridApi.setLoading(false);
+  }
+}
+
+/** 选择班组后加载成员 */
+async function handleTeamSelect(row?: MesCalPlanTeamApi.PlanTeam) {
+  if (!row?.teamId) {
+    selectedTeamId.value = undefined;
+    selectedTeamName.value = '';
+    memberList.value = [];
+    memberGridApi.setGridOptions({ data: memberList.value });
+    return;
+  }
+  selectedTeamId.value = row.teamId;
+  selectedTeamName.value = row.teamName || '';
+  memberGridApi.setLoading(true);
+  try {
+    memberList.value = await getTeamMemberListByTeam(row.teamId);
+    memberGridApi.setGridOptions({ data: memberList.value });
+  } finally {
+    memberGridApi.setLoading(false);
+  }
+}
+
+/** 打开班组选择弹窗 */
+function openTeamSelect() {
+  teamDialogRef.value?.open(list.value.map((item) => item.teamId!).filter(Boolean));
+}
+
+/** 处理班组选择 */
+async function handleTeamsSelected(rows: MesCalTeamApi.Team[]) {
+  const existingTeamIds = new Set(list.value.map((item) => item.teamId));
+  const newTeams = rows.filter((team) => team.id && !existingTeamIds.has(team.id));
+  if (newTeams.length === 0) {
+    message.warning('所选班组已全部添加过');
+    return;
+  }
+  gridApi.setLoading(true);
+  try {
+    for (const team of newTeams) {
+      await createPlanTeam({ planId: props.planId, teamId: team.id });
+    }
+    message.success('成功添加 ' + newTeams.length + ' 个班组');
+    await getList();
+  } finally {
+    gridApi.setLoading(false);
+  }
+}
+
+/** 删除计划班组 */
+async function handleDelete(row: MesCalPlanTeamApi.PlanTeam) {
+  await deletePlanTeam(row.id!);
+  message.success($t('ui.actionMessage.deleteSuccess', [row.teamName]));
+  if (row.teamId === selectedTeamId.value) {
+    await handleTeamSelect(undefined);
+  }
+  await getList();
+}
+
+watch(
+  () => props.planId,
+  (value) => {
+    if (value) {
+      getList();
+    }
+  },
+  { immediate: true },
+);
+</script>
+
+<template>
+  <div>
+    <div v-if="isEditable" class="mb-3 flex items-center justify-start">
+      <TableAction :actions="[{ label: '添加班组', type: 'primary', onClick: openTeamSelect }]" />
+    </div>
+    <div class="grid grid-cols-5 gap-4">
+      <div class="col-span-3">
+        <Grid class="w-full">
+          <template #actions="{ row }">
+            <TableAction
+              :actions="[
+                {
+                  label: '删除',
+                  type: 'link',
+                  danger: true,
+                  popConfirm: {
+                    title: '确认删除该班组吗？',
+                    confirm: handleDelete.bind(null, row),
+                  },
+                },
+              ]"
+            />
+          </template>
+        </Grid>
+      </div>
+      <div class="col-span-2">
+        <Card class="h-full" size="small">
+          <template #title>
+            {{ selectedTeamName ? `「${selectedTeamName}」班组成员` : '班组成员' }}
+          </template>
+          <div v-if="!selectedTeamId">
+            <div class="py-8 text-center text-gray-400">请点击左侧班组查看成员</div>
+          </div>
+          <MemberGrid v-else class="w-full" />
+        </Card>
+      </div>
+    </div>
+    <CalTeamSelectDialog ref="teamDialogRef" :multiple="true" @selected="handleTeamsSelected" />
+  </div>
+</template>
diff --git a/apps/web-antd/src/views/mes/cal/team/components/cal-team-select-dialog.vue b/apps/web-antd/src/views/mes/cal/team/components/cal-team-select-dialog.vue
new file mode 100644
index 000000000..afad7f188
--- /dev/null
+++ b/apps/web-antd/src/views/mes/cal/team/components/cal-team-select-dialog.vue
@@ -0,0 +1,141 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesCalTeamApi } from '#/api/mes/cal/team';
+
+import { nextTick, ref } from 'vue';
+
+import { message, Modal } from 'ant-design-vue';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { getTeamPage } from '#/api/mes/cal/team';
+
+import { useTeamSelectGridColumns, useTeamSelectGridFormSchema } from '../data';
+
+const emit = defineEmits<{ selected: [rows: MesCalTeamApi.Team[]] }>();
+const open = ref(false); // 弹窗是否打开
+const multiple = ref(true); // 是否多选
+const selectedRows = ref<MesCalTeamApi.Team[]>([]); // 已选班组列表
+const preSelectedIds = ref<number[]>([]); // 预选班组编号列表
+
+/** 处理勾选变化 */
+function handleCheckboxChange({ records }: { records: MesCalTeamApi.Team[] }) {
+  selectedRows.value = records;
+}
+
+/** 处理全选变化 */
+function handleCheckboxAll({ records }: { records: MesCalTeamApi.Team[] }) {
+  selectedRows.value = records;
+}
+
+/** 双击行：多选切换勾选，单选直接确认 */
+function handleCellDblclick({ row }: { row: MesCalTeamApi.Team }) {
+  if (multiple.value) {
+    const records = gridApi.grid.getCheckboxRecords() as MesCalTeamApi.Team[];
+    const checked = records.some((item) => item.id === row.id);
+    gridApi.grid.setCheckboxRow(row, !checked);
+    selectedRows.value = gridApi.grid.getCheckboxRecords() as MesCalTeamApi.Team[];
+    return;
+  }
+  selectedRows.value = [row];
+  handleConfirm();
+}
+
+/** 回显预选班组 */
+function applyPreSelection() {
+  if (preSelectedIds.value.length === 0) {
+    return;
+  }
+  const rows = gridApi.grid.getData() as MesCalTeamApi.Team[];
+  for (const row of rows) {
+    if (row.id && preSelectedIds.value.includes(row.id)) {
+      gridApi.grid.setCheckboxRow(row, true);
+    }
+  }
+  selectedRows.value = gridApi.grid.getCheckboxRecords() as MesCalTeamApi.Team[];
+}
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  formOptions: {
+    schema: useTeamSelectGridFormSchema(),
+  },
+  gridOptions: {
+    columns: useTeamSelectGridColumns(),
+    height: 520,
+    keepSource: true,
+    checkboxConfig: {
+      highlight: true,
+      range: true,
+      reserve: true,
+    },
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }, formValues) =>
+          await getTeamPage({ pageNo: page.currentPage, pageSize: page.pageSize, ...formValues }),
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+  } as VxeTableGridOptions<MesCalTeamApi.Team>,
+  gridEvents: {
+    checkboxAll: handleCheckboxAll,
+    checkboxChange: handleCheckboxChange,
+    cellDblclick: handleCellDblclick,
+  },
+});
+
+/** 重置查询和选择状态 */
+async function resetQueryState() {
+  selectedRows.value = [];
+  await gridApi.grid.clearCheckboxRow();
+  await gridApi.formApi.resetForm();
+}
+
+/** 打开班组选择弹窗 */
+async function openModal(selectedIds?: number[], options?: { multiple?: boolean }) {
+  open.value = true;
+  multiple.value = options?.multiple ?? true;
+  preSelectedIds.value = selectedIds || [];
+  await nextTick();
+  await resetQueryState();
+  await gridApi.query();
+  await nextTick();
+  applyPreSelection();
+}
+
+/** 关闭班组选择弹窗 */
+async function closeModal() {
+  open.value = false;
+  await resetQueryState();
+}
+
+/** 确认选择班组 */
+function handleConfirm() {
+  if (selectedRows.value.length === 0) {
+    message.warning(multiple.value ? '请至少选择一条数据' : '请选择一条数据');
+    return;
+  }
+  emit('selected', multiple.value ? selectedRows.value : [selectedRows.value[0]!]);
+  open.value = false;
+}
+
+defineExpose({ open: openModal });
+</script>
+
+<template>
+  <Modal
+    v-model:open="open"
+    title="班组选择"
+    width="720px"
+    :destroy-on-close="true"
+    @ok="handleConfirm"
+    @cancel="closeModal"
+  >
+    <Grid table-title="班组列表" />
+  </Modal>
+</template>
diff --git a/apps/web-antd/src/views/mes/cal/team/components/cal-team-select.vue b/apps/web-antd/src/views/mes/cal/team/components/cal-team-select.vue
new file mode 100644
index 000000000..73a276e69
--- /dev/null
+++ b/apps/web-antd/src/views/mes/cal/team/components/cal-team-select.vue
@@ -0,0 +1,84 @@
+<script lang="ts" setup>
+import type { SelectValue } from 'ant-design-vue/es/select';
+
+import type { MesCalTeamApi } from '#/api/mes/cal/team';
+
+import { onMounted, ref } from 'vue';
+
+import { Button, Select } from 'ant-design-vue';
+
+import { getTeamList } from '#/api/mes/cal/team';
+
+import CalTeamSelectDialog from './cal-team-select-dialog.vue';
+
+const props = withDefaults(
+  defineProps<{
+    allowClear?: boolean;
+    disabled?: boolean;
+    modelValue?: number;
+    placeholder?: string;
+  }>(),
+  {
+    allowClear: true,
+    disabled: false,
+    modelValue: undefined,
+    placeholder: '请选择班组',
+  },
+);
+const emit = defineEmits<{
+  change: [row?: MesCalTeamApi.Team];
+  'update:modelValue': [value?: number];
+}>();
+const teamList = ref<MesCalTeamApi.Team[]>([]); // 班组选项
+const dialogRef = ref<InstanceType<typeof CalTeamSelectDialog>>(); // 班组选择弹窗
+
+/** 加载班组选项 */
+async function loadTeamList() {
+  teamList.value = await getTeamList();
+}
+
+/** 处理下拉选择变化 */
+function handleChange(value: SelectValue) {
+  const teamId = typeof value === 'number' ? value : undefined;
+  emit('update:modelValue', teamId);
+  emit(
+    'change',
+    teamList.value.find((item) => item.id === teamId),
+  );
+}
+
+/** 打开班组选择弹窗 */
+function openDialog() {
+  if (props.disabled) {
+    return;
+  }
+  dialogRef.value?.open(props.modelValue ? [props.modelValue] : [], { multiple: false });
+}
+
+/** 处理弹窗选择 */
+function handleSelected(rows: MesCalTeamApi.Team[]) {
+  const row = rows[0];
+  emit('update:modelValue', row?.id);
+  emit('change', row);
+}
+
+onMounted(loadTeamList);
+</script>
+
+<template>
+  <div class="flex w-full gap-2">
+    <Select
+      :allow-clear="allowClear"
+      :disabled="disabled"
+      :field-names="{ label: 'name', value: 'id' }"
+      :options="teamList"
+      :placeholder="placeholder"
+      :value="modelValue"
+      class="flex-1"
+      option-filter-prop="name"
+      @change="handleChange"
+    />
+    <Button :disabled="disabled" @click="openDialog">选择</Button>
+    <CalTeamSelectDialog ref="dialogRef" :multiple="false" @selected="handleSelected" />
+  </div>
+</template>
diff --git a/apps/web-antd/src/views/mes/cal/team/components/index.ts b/apps/web-antd/src/views/mes/cal/team/components/index.ts
new file mode 100644
index 000000000..092b24a19
--- /dev/null
+++ b/apps/web-antd/src/views/mes/cal/team/components/index.ts
@@ -0,0 +1,2 @@
+export { default as CalTeamSelectDialog } from './cal-team-select-dialog.vue';
+export { default as CalTeamSelect } from './cal-team-select.vue';
diff --git a/apps/web-antd/src/views/mes/cal/team/data.ts b/apps/web-antd/src/views/mes/cal/team/data.ts
new file mode 100644
index 000000000..3c0f83f96
--- /dev/null
+++ b/apps/web-antd/src/views/mes/cal/team/data.ts
@@ -0,0 +1,188 @@
+import type { VbenFormApi, VbenFormSchema } from '#/adapter/form';
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesCalTeamApi } from '#/api/mes/cal/team';
+
+import { h } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
+import { Button } from 'ant-design-vue';
+
+import { z } from '#/adapter/form';
+import { generateAutoCode } from '#/api/mes/md/autocode/record';
+import { MesAutoCodeRuleCode } from '#/views/mes/utils/constants';
+
+/** 新增/修改班组的表单 */
+export function useFormSchema(formApi?: VbenFormApi): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'code',
+      label: '班组编码',
+      component: 'Input',
+      componentProps: {
+        maxLength: 64,
+        placeholder: '请输入班组编码',
+      },
+      rules: z.string().min(1, '班组编码不能为空').max(64),
+      suffix: () =>
+        h(
+          Button,
+          {
+            type: 'default',
+            onClick: async () => {
+              try {
+                const code = await generateAutoCode(MesAutoCodeRuleCode.CAL_TEAM_CODE);
+                await formApi?.setFieldValue('code', code);
+              } catch (error) {
+                console.error(error);
+              }
+            },
+          },
+          { default: () => '生成' },
+        ),
+    },
+    {
+      fieldName: 'name',
+      label: '班组名称',
+      component: 'Input',
+      componentProps: {
+        maxLength: 100,
+        placeholder: '请输入班组名称',
+      },
+      rules: z.string().min(1, '班组名称不能为空').max(100),
+    },
+    {
+      fieldName: 'calendarType',
+      label: '班组类型',
+      component: 'RadioGroup',
+      componentProps: {
+        buttonStyle: 'solid',
+        optionType: 'button',
+        options: getDictOptions(DICT_TYPE.MES_CAL_CALENDAR_TYPE, 'number'),
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      formItemClass: 'col-span-3',
+      componentProps: {
+        maxLength: 250,
+        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: 'calendarType',
+      label: '班组类型',
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: getDictOptions(DICT_TYPE.MES_CAL_CALENDAR_TYPE, 'number'),
+        placeholder: '请选择班组类型',
+      },
+    },
+  ];
+}
+
+/** 列表的字段 */
+export function useGridColumns(): VxeTableGridOptions<MesCalTeamApi.Team>['columns'] {
+  return [
+    {
+      field: 'code',
+      title: '班组编码',
+      minWidth: 150,
+      slots: {
+        default: 'code',
+      },
+    },
+    { field: 'name', title: '班组名称', minWidth: 150 },
+    {
+      field: 'calendarType',
+      title: '班组类型',
+      width: 140,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_CAL_CALENDAR_TYPE },
+      },
+    },
+    { field: 'remark', title: '备注', minWidth: 180 },
+    { field: 'createTime', title: '创建时间', width: 180, formatter: 'formatDateTime' },
+    {
+      title: '操作',
+      width: 180,
+      fixed: 'right',
+      slots: {
+        default: 'actions',
+      },
+    },
+  ];
+}
+
+/** 班组选择弹窗搜索表单 */
+export function useTeamSelectGridFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'code',
+      label: '班组编码',
+      component: 'Input',
+      componentProps: {
+        allowClear: true,
+        placeholder: '请输入班组编码',
+      },
+    },
+    {
+      fieldName: 'name',
+      label: '班组名称',
+      component: 'Input',
+      componentProps: {
+        allowClear: true,
+        placeholder: '请输入班组名称',
+      },
+    },
+  ];
+}
+
+/** 班组选择弹窗字段 */
+export function useTeamSelectGridColumns(): VxeTableGridOptions<MesCalTeamApi.Team>['columns'] {
+  return [
+    { type: 'checkbox', width: 50 },
+    { field: 'code', title: '班组编码', minWidth: 140 },
+    { field: 'name', title: '班组名称', minWidth: 140 },
+    { field: 'remark', title: '备注', minWidth: 160 },
+  ];
+}
diff --git a/apps/web-antd/src/views/mes/cal/team/index.vue b/apps/web-antd/src/views/mes/cal/team/index.vue
new file mode 100644
index 000000000..d5d10fb95
--- /dev/null
+++ b/apps/web-antd/src/views/mes/cal/team/index.vue
@@ -0,0 +1,153 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesCalTeamApi } from '#/api/mes/cal/team';
+
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
+import { downloadFileFromBlobPart } from '@vben/utils';
+
+import { Button, message } from 'ant-design-vue';
+
+import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import { deleteTeam, exportTeam, getTeamPage } from '#/api/mes/cal/team';
+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({ type: 'create' }).open();
+}
+
+/** 查看班组 */
+function handleDetail(row: MesCalTeamApi.Team) {
+  formModalApi.setData({ id: row.id, type: 'detail' }).open();
+}
+
+/** 编辑班组 */
+function handleEdit(row: MesCalTeamApi.Team) {
+  formModalApi.setData({ id: row.id, type: 'update' }).open();
+}
+
+/** 删除班组 */
+async function handleDelete(row: MesCalTeamApi.Team) {
+  const hideLoading = message.loading({
+    content: $t('ui.actionMessage.deleting', [row.name]),
+    duration: 0,
+  });
+  try {
+    await deleteTeam(row.id!);
+    message.success($t('ui.actionMessage.deleteSuccess', [row.name]));
+    handleRefresh();
+  } finally {
+    hideLoading();
+  }
+}
+
+/** 导出班组 */
+async function handleExport() {
+  const data = await exportTeam(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 getTeamPage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            ...formValues,
+          });
+        },
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+  } as VxeTableGridOptions<MesCalTeamApi.Team>,
+});
+</script>
+
+<template>
+  <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【排班】班组设置、节假日设置"
+        url="https://doc.iocoder.cn/mes/cal/team/"
+      />
+    </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:cal-team:create'],
+              onClick: handleCreate,
+            },
+            {
+              label: $t('ui.actionTitle.export'),
+              type: 'primary',
+              icon: ACTION_ICON.DOWNLOAD,
+              auth: ['mes:cal-team:export'],
+              onClick: handleExport,
+            },
+          ]"
+        />
+      </template>
+      <template #code="{ row }">
+        <Button type="link" @click="handleDetail(row)">{{ row.code }}</Button>
+      </template>
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: $t('common.edit'),
+              type: 'link',
+              icon: ACTION_ICON.EDIT,
+              auth: ['mes:cal-team:update'],
+              onClick: handleEdit.bind(null, row),
+            },
+            {
+              label: $t('common.delete'),
+              type: 'link',
+              danger: true,
+              icon: ACTION_ICON.DELETE,
+              auth: ['mes:cal-team: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/cal/team/modules/form.vue b/apps/web-antd/src/views/mes/cal/team/modules/form.vue
new file mode 100644
index 000000000..91860306b
--- /dev/null
+++ b/apps/web-antd/src/views/mes/cal/team/modules/form.vue
@@ -0,0 +1,120 @@
+<script lang="ts" setup>
+import type { MesCalTeamApi } from '#/api/mes/cal/team';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { message, Tabs } from 'ant-design-vue';
+
+import { useVbenForm } from '#/adapter/form';
+import { createTeam, getTeam, updateTeam } from '#/api/mes/cal/team';
+import { $t } from '#/locales';
+
+import { useFormSchema } from '../data';
+import MemberList from './member-list.vue';
+
+
+type FormMode = 'create' | 'detail' | 'update';
+
+const emit = defineEmits(['success']);
+const formMode = ref<FormMode>('create'); // 表单模式
+const subTabsName = ref('member'); // 当前资源页签
+const formData = ref<MesCalTeamApi.Team>();
+const isDetail = computed(() => formMode.value === 'detail'); // 是否查看模式
+const getTitle = computed(() => {
+  if (formMode.value === 'detail') {
+    return $t('ui.actionTitle.view', ['班组']);
+  }
+  return formMode.value === 'update'
+    ? $t('ui.actionTitle.edit', ['班组'])
+    : $t('ui.actionTitle.create', ['班组']);
+});
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-1',
+    labelWidth: 100,
+  },
+  wrapperClass: 'grid-cols-3',
+  layout: 'horizontal',
+  schema: [],
+  showDefaultActions: false,
+});
+
+/** 表单 schema 需要 formApi 引用，所以通过 setState 设置 schema */
+formApi.setState({ schema: useFormSchema(formApi) });
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    if (isDetail.value) {
+      await modalApi.close();
+      return;
+    }
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    const data = (await formApi.getValues()) as MesCalTeamApi.Team;
+    try {
+      if (formMode.value === 'create') {
+        const id = await createTeam(data);
+        formData.value = { ...data, id: id as number };
+        await formApi.setFieldValue('id', id);
+        formMode.value = 'update';
+      } else {
+        await updateTeam(data);
+        formData.value = { ...formData.value, ...data };
+      }
+      emit('success');
+      message.success($t('ui.actionMessage.operationSuccess'));
+    } finally {
+      modalApi.unlock();
+    }
+  },
+  async onOpenChange(isOpen: boolean) {
+    if (!isOpen) {
+      formData.value = undefined;
+      return;
+    }
+    await formApi.resetForm();
+    subTabsName.value = 'member';
+    // 加载数据
+    const data = modalApi.getData<{ id?: number; type?: FormMode }>();
+    formMode.value = data?.type || 'create';
+    formApi.setDisabled(formMode.value === 'detail');
+    modalApi.setState({ showConfirmButton: formMode.value !== 'detail' });
+    if (!data?.id) {
+      return;
+    }
+    modalApi.lock();
+    try {
+      formData.value = await getTeam(data.id);
+      // 设置到 values
+      await formApi.setValues(formData.value);
+    } finally {
+      modalApi.unlock();
+    }
+  },
+});
+</script>
+
+<template>
+  <Modal :title="getTitle" class="w-4/5">
+    <Form class="mx-4" />
+    <Tabs
+      v-if="formMode !== 'create' && formData?.id"
+      v-model:active-key="subTabsName"
+      class="mx-4 mt-4"
+    >
+      <Tabs.TabPane key="member" tab="班组成员">
+        <MemberList :form-type="formMode" :team-id="formData.id" />
+      </Tabs.TabPane>
+    </Tabs>
+  </Modal>
+</template>
diff --git a/apps/web-antd/src/views/mes/cal/team/modules/member-list.vue b/apps/web-antd/src/views/mes/cal/team/modules/member-list.vue
new file mode 100644
index 000000000..0630dd10d
--- /dev/null
+++ b/apps/web-antd/src/views/mes/cal/team/modules/member-list.vue
@@ -0,0 +1,194 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesCalTeamMemberApi } from '#/api/mes/cal/team/member';
+
+import { computed, ref, watch } from 'vue';
+
+import { message, Modal } from 'ant-design-vue';
+
+import { useVbenForm } from '#/adapter/form';
+import { TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import {
+  createTeamMember,
+  deleteTeamMember,
+  getTeamMemberListByTeam,
+} from '#/api/mes/cal/team/member';
+import { getSimpleUserList } from '#/api/system/user';
+import { $t } from '#/locales';
+
+const props = withDefaults(defineProps<{ formType?: string; teamId: number }>(), {
+  formType: 'update',
+});
+const isEditable = computed(() => ['create', 'update'].includes(props.formType)); // 是否可编辑
+const formOpen = ref(false); // 成员表单是否打开
+const formLoading = ref(false); // 成员表单提交中
+const list = ref<MesCalTeamMemberApi.TeamMember[]>([]); // 成员列表
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-2',
+    labelWidth: 80,
+  },
+  layout: 'horizontal',
+  schema: [
+    {
+      fieldName: 'teamId',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'userId',
+      label: '用户',
+      component: 'ApiSelect',
+      componentProps: {
+        allowClear: true,
+        api: getSimpleUserList,
+        labelField: 'nickname',
+        placeholder: '请选择用户',
+        showSearch: true,
+        valueField: 'id',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入备注',
+        rows: 3,
+      },
+    },
+  ],
+  showDefaultActions: false,
+});
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    autoResize: true,
+    border: true,
+    columns: [
+      { field: 'userId', title: '用户编号', width: 100 },
+      { field: 'nickname', title: '用户昵称', minWidth: 120 },
+      { field: 'telephone', title: '手机号', minWidth: 120 },
+      { field: 'remark', title: '备注', minWidth: 160 },
+      {
+        title: '操作',
+        width: 90,
+        fixed: 'right',
+        slots: {
+          default: 'actions',
+        },
+        visible: isEditable.value,
+      },
+    ],
+    data: list.value,
+    minHeight: 240,
+    pagerConfig: {
+      enabled: false,
+    },
+    rowConfig: {
+      isHover: true,
+      keyField: 'id',
+    },
+    showOverflow: true,
+    toolbarConfig: {
+      enabled: false,
+    },
+  } as VxeTableGridOptions<MesCalTeamMemberApi.TeamMember>,
+});
+
+/** 加载成员列表 */
+async function getList() {
+  gridApi.setLoading(true);
+  try {
+    list.value = await getTeamMemberListByTeam(props.teamId);
+    gridApi.setGridOptions({ data: list.value });
+  } finally {
+    gridApi.setLoading(false);
+  }
+}
+
+/** 打开成员表单 */
+async function openForm() {
+  formOpen.value = true;
+  await formApi.resetForm();
+  await formApi.setValues({ teamId: props.teamId });
+}
+
+/** 提交成员表单 */
+async function submitForm() {
+  const { valid } = await formApi.validate();
+  if (!valid) {
+    return;
+  }
+  formLoading.value = true;
+  try {
+    const data = (await formApi.getValues()) as MesCalTeamMemberApi.TeamMember;
+    await createTeamMember(data);
+    formOpen.value = false;
+    message.success($t('ui.actionMessage.operationSuccess'));
+    await getList();
+  } finally {
+    formLoading.value = false;
+  }
+}
+
+/** 删除成员 */
+async function handleDelete(id: number) {
+  await deleteTeamMember(id);
+  message.success($t('ui.actionMessage.deleteSuccess', ['成员']));
+  await getList();
+}
+
+watch(
+  () => props.teamId,
+  (value) => {
+    if (value) {
+      getList();
+    }
+  },
+  { immediate: true },
+);
+</script>
+
+<template>
+  <div>
+    <div v-if="isEditable" class="mb-3 flex items-center justify-start">
+      <TableAction :actions="[{ label: '添加成员', type: 'primary', onClick: openForm }]" />
+    </div>
+    <Grid class="w-full">
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: '删除',
+              type: 'link',
+              danger: true,
+              popConfirm: {
+                title: '确认删除该成员吗？',
+                confirm: handleDelete.bind(null, row.id!),
+              },
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+
+    <Modal
+      v-model:open="formOpen"
+      title="添加成员"
+      width="520px"
+      :confirm-loading="formLoading"
+      @ok="submitForm"
+    >
+      <Form class="mx-4" />
+    </Modal>
+  </div>
+</template>
diff --git a/apps/web-antd/src/views/mes/dv/checkplan/components/dv-check-plan-select.vue b/apps/web-antd/src/views/mes/dv/checkplan/components/dv-check-plan-select.vue
new file mode 100644
index 000000000..1c3ab50e8
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/checkplan/components/dv-check-plan-select.vue
@@ -0,0 +1,74 @@
+<script lang="ts" setup>
+import type { SelectValue } from 'ant-design-vue/es/select';
+
+import type { MesDvCheckPlanApi } from '#/api/mes/dv/checkplan';
+
+import { onMounted, ref, watch } from 'vue';
+
+import { Select } from 'ant-design-vue';
+
+import { getCheckPlanPage } from '#/api/mes/dv/checkplan';
+
+const props = withDefaults(
+  defineProps<{
+    allowClear?: boolean;
+    disabled?: boolean;
+    modelValue?: number;
+    placeholder?: string;
+    status?: number;
+    type?: number;
+  }>(),
+  {
+    allowClear: true,
+    disabled: false,
+    modelValue: undefined,
+    placeholder: '请选择计划',
+    status: undefined,
+    type: undefined,
+  },
+);
+const emit = defineEmits<{
+  change: [row?: MesDvCheckPlanApi.CheckPlan];
+  'update:modelValue': [value?: number];
+}>();
+const list = ref<MesDvCheckPlanApi.CheckPlan[]>([]); // 点检计划列表
+
+/** 加载点检计划列表 */
+async function getList() {
+  const data = await getCheckPlanPage({
+    pageNo: 1,
+    pageSize: 100,
+    status: props.status,
+    type: props.type,
+  });
+  list.value = data.list || [];
+}
+
+/** 处理点检计划选择变化 */
+function handleChange(value: SelectValue) {
+  const planId = typeof value === 'number' ? value : undefined;
+  emit('update:modelValue', planId);
+  emit(
+    'change',
+    list.value.find((item) => item.id === planId),
+  );
+}
+
+watch(() => [props.status, props.type], getList);
+onMounted(getList);
+</script>
+
+<template>
+  <Select
+    :allow-clear="allowClear"
+    :disabled="disabled"
+    :field-names="{ label: 'name', value: 'id' }"
+    :options="list"
+    :placeholder="placeholder"
+    :value="modelValue"
+    class="w-full"
+    option-filter-prop="name"
+    show-search
+    @change="handleChange"
+  />
+</template>
diff --git a/apps/web-antd/src/views/mes/dv/checkplan/components/index.ts b/apps/web-antd/src/views/mes/dv/checkplan/components/index.ts
new file mode 100644
index 000000000..379957e07
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/checkplan/components/index.ts
@@ -0,0 +1 @@
+export { default as DvCheckPlanSelect } from './dv-check-plan-select.vue';
diff --git a/apps/web-antd/src/views/mes/dv/checkplan/data.ts b/apps/web-antd/src/views/mes/dv/checkplan/data.ts
new file mode 100644
index 000000000..ab9a41f84
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/checkplan/data.ts
@@ -0,0 +1,247 @@
+import type { VbenFormApi, VbenFormSchema } from '#/adapter/form';
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvCheckPlanApi } from '#/api/mes/dv/checkplan';
+
+import { h } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
+import { Button } from 'ant-design-vue';
+
+import { z } from '#/adapter/form';
+import { generateAutoCode } from '#/api/mes/md/autocode/record';
+import { getRangePickerDefaultProps } from '#/utils';
+import {
+  MesAutoCodeRuleCode,
+  MesDvCheckPlanStatusEnum,
+  MesDvSubjectTypeEnum,
+} from '#/views/mes/utils/constants';
+
+/** 新增/修改点检保养方案的表单 */
+export function useFormSchema(formApi?: VbenFormApi): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'status',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+      defaultValue: MesDvCheckPlanStatusEnum.PREPARE,
+    },
+    {
+      fieldName: 'code',
+      label: '方案编码',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入方案编码',
+      },
+      rules: 'required',
+      suffix: () =>
+        h(
+          Button,
+          {
+            type: 'default',
+            onClick: async () => {
+              try {
+                const code = await generateAutoCode(MesAutoCodeRuleCode.DV_CHECK_PLAN_CODE);
+                await formApi?.setFieldValue('code', code);
+              } catch (error) {
+                console.error(error);
+              }
+            },
+          },
+          { default: () => '生成' },
+        ),
+    },
+    {
+      fieldName: 'name',
+      label: '方案名称',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入方案名称',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'type',
+      label: '方案类型',
+      component: 'RadioGroup',
+      componentProps: {
+        buttonStyle: 'solid',
+        optionType: 'button',
+        options: getDictOptions(DICT_TYPE.MES_DV_SUBJECT_TYPE, 'number'),
+      },
+      rules: z.number().default(MesDvSubjectTypeEnum.CHECK),
+    },
+    {
+      fieldName: 'startDate',
+      label: '开始日期',
+      component: 'DatePicker',
+      componentProps: {
+        format: 'YYYY-MM-DD',
+        placeholder: '请选择开始日期',
+        valueFormat: 'x',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'endDate',
+      label: '结束日期',
+      component: 'DatePicker',
+      componentProps: {
+        format: 'YYYY-MM-DD',
+        placeholder: '请选择结束日期',
+        valueFormat: 'x',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'cycleType',
+      label: '周期类型',
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: getDictOptions(DICT_TYPE.MES_DV_CYCLE_TYPE, 'number'),
+        placeholder: '请选择周期类型',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'cycleCount',
+      label: '周期数量',
+      component: 'InputNumber',
+      componentProps: {
+        class: '!w-full',
+        min: 1,
+        precision: 0,
+      },
+      rules: z.number().default(1),
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      formItemClass: 'col-span-3',
+      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: 'type',
+      label: '方案类型',
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: getDictOptions(DICT_TYPE.MES_DV_SUBJECT_TYPE, 'number'),
+        placeholder: '请选择方案类型',
+      },
+    },
+    {
+      fieldName: 'status',
+      label: '状态',
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: getDictOptions(DICT_TYPE.MES_DV_CHECK_PLAN_STATUS, 'number'),
+        placeholder: '请选择状态',
+      },
+    },
+    {
+      fieldName: 'startDate',
+      label: '开始日期',
+      component: 'RangePicker',
+      componentProps: {
+        ...getRangePickerDefaultProps(),
+      },
+    },
+  ];
+}
+
+/** 列表的字段 */
+export function useGridColumns(): VxeTableGridOptions<MesDvCheckPlanApi.CheckPlan>['columns'] {
+  return [
+    {
+      field: 'code',
+      title: '方案编码',
+      minWidth: 140,
+      slots: {
+        default: 'code',
+      },
+    },
+    { field: 'name', title: '方案名称', minWidth: 150 },
+    {
+      field: 'type',
+      title: '方案类型',
+      width: 120,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_DV_SUBJECT_TYPE },
+      },
+    },
+    { field: 'startDate', title: '开始日期', width: 150, formatter: 'formatDate' },
+    { field: 'endDate', title: '结束日期', width: 150, formatter: 'formatDate' },
+    {
+      field: 'cycleType',
+      title: '周期类型',
+      width: 120,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_DV_CYCLE_TYPE },
+      },
+    },
+    { field: 'cycleCount', title: '周期数量', width: 100 },
+    {
+      field: 'status',
+      title: '状态',
+      width: 120,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_DV_CHECK_PLAN_STATUS },
+      },
+    },
+    { field: 'createTime', title: '创建时间', width: 180, formatter: 'formatDateTime' },
+    {
+      title: '操作',
+      width: 240,
+      fixed: 'right',
+      slots: {
+        default: 'actions',
+      },
+    },
+  ];
+}
diff --git a/apps/web-antd/src/views/mes/dv/checkplan/index.vue b/apps/web-antd/src/views/mes/dv/checkplan/index.vue
new file mode 100644
index 000000000..0f9ada592
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/checkplan/index.vue
@@ -0,0 +1,195 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvCheckPlanApi } from '#/api/mes/dv/checkplan';
+import type { ActionItem } from '#/components/table-action/typing';
+
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
+import { downloadFileFromBlobPart } from '@vben/utils';
+
+import { Button, message } from 'ant-design-vue';
+
+import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import {
+  deleteCheckPlan,
+  disableCheckPlan,
+  enableCheckPlan,
+  exportCheckPlan,
+  getCheckPlanPage,
+} from '#/api/mes/dv/checkplan';
+import { $t } from '#/locales';
+import { MesDvCheckPlanStatusEnum } from '#/views/mes/utils/constants';
+
+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({ type: 'create' }).open();
+}
+
+/** 查看点检计划 */
+function handleDetail(row: MesDvCheckPlanApi.CheckPlan) {
+  formModalApi.setData({ id: row.id, type: 'detail' }).open();
+}
+
+/** 编辑点检计划 */
+function handleEdit(row: MesDvCheckPlanApi.CheckPlan) {
+  formModalApi.setData({ id: row.id, type: 'update' }).open();
+}
+
+/** 删除点检计划 */
+async function handleDelete(row: MesDvCheckPlanApi.CheckPlan) {
+  const hideLoading = message.loading({
+    content: $t('ui.actionMessage.deleting', [row.name]),
+    duration: 0,
+  });
+  try {
+    await deleteCheckPlan(row.id!);
+    message.success($t('ui.actionMessage.deleteSuccess', [row.name]));
+    handleRefresh();
+  } finally {
+    hideLoading();
+  }
+}
+
+/** 导出点检计划 */
+async function handleExport() {
+  const data = await exportCheckPlan(await gridApi.formApi.getValues());
+  downloadFileFromBlobPart({ fileName: '点检保养方案.xls', source: data });
+}
+
+/** 启用点检计划 */
+async function handleEnable(row: MesDvCheckPlanApi.CheckPlan) {
+  await enableCheckPlan(row.id!);
+  message.success($t('ui.actionMessage.operationSuccess'));
+  handleRefresh();
+}
+
+/** 停用点检计划 */
+async function handleDisable(row: MesDvCheckPlanApi.CheckPlan) {
+  await disableCheckPlan(row.id!);
+  message.success($t('ui.actionMessage.operationSuccess'));
+  handleRefresh();
+}
+
+/** 获取行操作按钮 */
+function getTableActions(row: MesDvCheckPlanApi.CheckPlan): ActionItem[] {
+  const actions: ActionItem[] = [];
+  if (row.status === MesDvCheckPlanStatusEnum.PREPARE) {
+    actions.push(
+      {
+        label: $t('common.edit'),
+        type: 'link',
+        icon: ACTION_ICON.EDIT,
+        auth: ['mes:dv-check-plan:update'],
+        onClick: handleEdit.bind(null, row),
+      },
+      {
+        label: $t('common.delete'),
+        type: 'link',
+        danger: true,
+        icon: ACTION_ICON.DELETE,
+        auth: ['mes:dv-check-plan:delete'],
+        popConfirm: {
+          title: $t('ui.actionMessage.deleteConfirm', [row.name]),
+          confirm: handleDelete.bind(null, row),
+        },
+      },
+    );
+  }
+  actions.push(
+    row.status === MesDvCheckPlanStatusEnum.PREPARE
+      ? {
+          label: '启用',
+          type: 'link',
+          auth: ['mes:dv-check-plan:update'],
+          onClick: handleEnable.bind(null, row),
+        }
+      : {
+          label: '停用',
+          type: 'link',
+          auth: ['mes:dv-check-plan:update'],
+          onClick: handleDisable.bind(null, row),
+        },
+  );
+  return actions;
+}
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  formOptions: {
+    schema: useGridFormSchema(),
+  },
+  gridOptions: {
+    columns: useGridColumns(),
+    height: 'auto',
+    keepSource: true,
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }, formValues) =>
+          await getCheckPlanPage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            ...formValues,
+          }),
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+  } as VxeTableGridOptions<MesDvCheckPlanApi.CheckPlan>,
+});
+</script>
+<template>
+  <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【设备】点检保养项目、点检保养方案"
+        url="https://doc.iocoder.cn/mes/dv/check-plan/"
+      />
+    </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:dv-check-plan:create'],
+              onClick: handleCreate,
+            },
+            {
+              label: $t('ui.actionTitle.export'),
+              type: 'primary',
+              icon: ACTION_ICON.DOWNLOAD,
+              auth: ['mes:dv-check-plan:export'],
+              onClick: handleExport,
+            },
+          ]"
+        />
+      </template>
+      <template #code="{ row }">
+        <Button type="link" @click="handleDetail(row)">{{ row.code }}</Button>
+      </template>
+      <template #actions="{ row }">
+        <TableAction :actions="getTableActions(row)" />
+      </template>
+    </Grid>
+  </Page>
+</template>
diff --git a/apps/web-antd/src/views/mes/dv/checkplan/modules/form.vue b/apps/web-antd/src/views/mes/dv/checkplan/modules/form.vue
new file mode 100644
index 000000000..516b8a532
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/checkplan/modules/form.vue
@@ -0,0 +1,121 @@
+<script lang="ts" setup>
+import type { MesDvCheckPlanApi } from '#/api/mes/dv/checkplan';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { message, Tabs } from 'ant-design-vue';
+
+import { useVbenForm } from '#/adapter/form';
+import { createCheckPlan, getCheckPlan, updateCheckPlan } from '#/api/mes/dv/checkplan';
+import { $t } from '#/locales';
+import { MesDvCheckPlanStatusEnum } from '#/views/mes/utils/constants';
+
+import { useFormSchema } from '../data';
+import MachineryList from './machinery-list.vue';
+import SubjectList from './subject-list.vue';
+
+type FormMode = 'create' | 'detail' | 'update';
+
+const emit = defineEmits(['success']);
+const formMode = ref<FormMode>('create');
+const subTabsName = ref('machinery');
+const formData = ref<MesDvCheckPlanApi.CheckPlan>();
+const isDetail = computed(() => formMode.value === 'detail');
+const getTitle = computed(() => {
+  if (formMode.value === 'detail') {
+    return '查看点检保养方案';
+  }
+  return formMode.value === 'update' ? '修改点检保养方案' : '新增点检保养方案';
+});
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-1',
+    labelWidth: 110,
+  },
+  wrapperClass: 'grid-cols-3',
+  layout: 'horizontal',
+  schema: [],
+  showDefaultActions: false,
+});
+
+/** 表单 schema 需要 formApi 引用，所以通过 setState 设置 schema */
+formApi.setState({ schema: useFormSchema(formApi) });
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    if (isDetail.value) {
+      await modalApi.close();
+      return;
+    }
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    const data = (await formApi.getValues()) as MesDvCheckPlanApi.CheckPlan;
+    try {
+      if (formMode.value === 'create') {
+        const id = await createCheckPlan(data);
+        formData.value = { ...data, id: id as number, status: MesDvCheckPlanStatusEnum.PREPARE };
+        await formApi.setFieldValue('id', id);
+        formMode.value = 'update';
+      } else {
+        await updateCheckPlan(data);
+        formData.value = { ...formData.value, ...data };
+      }
+      emit('success');
+      message.success($t('ui.actionMessage.operationSuccess'));
+    } finally {
+      modalApi.unlock();
+    }
+  },
+  async onOpenChange(isOpen: boolean) {
+    if (!isOpen) {
+      formData.value = undefined;
+      return;
+    }
+    await formApi.resetForm();
+    subTabsName.value = 'machinery';
+    // 加载数据
+    const data = modalApi.getData<{ id?: number; type?: FormMode }>();
+    formMode.value = data?.type || 'create';
+    formApi.setDisabled(formMode.value === 'detail');
+    modalApi.setState({ showConfirmButton: formMode.value !== 'detail' });
+    if (!data?.id) {
+      return;
+    }
+    modalApi.lock();
+    try {
+      formData.value = await getCheckPlan(data.id);
+      // 设置到 values
+      await formApi.setValues(formData.value);
+    } finally {
+      modalApi.unlock();
+    }
+  },
+});
+</script>
+<template>
+  <Modal :title="getTitle" class="w-4/5">
+    <Form class="mx-4" />
+    <Tabs
+      v-if="formMode !== 'create' && formData?.id"
+      v-model:active-key="subTabsName"
+      class="mx-4 mt-4"
+    >
+      <Tabs.TabPane key="machinery" tab="设备">
+        <MachineryList :form-type="formMode" :plan-id="formData.id" />
+      </Tabs.TabPane>
+      <Tabs.TabPane key="subject" tab="项目">
+        <SubjectList :form-type="formMode" :plan-id="formData.id" :plan-type="formData.type" />
+      </Tabs.TabPane>
+    </Tabs>
+  </Modal>
+</template>
diff --git a/apps/web-antd/src/views/mes/dv/checkplan/modules/machinery-list.vue b/apps/web-antd/src/views/mes/dv/checkplan/modules/machinery-list.vue
new file mode 100644
index 000000000..09ce92880
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/checkplan/modules/machinery-list.vue
@@ -0,0 +1,189 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvCheckPlanMachineryApi } from '#/api/mes/dv/checkplan/machinery';
+
+import { computed, ref, watch } from 'vue';
+
+import { message, Modal } from 'ant-design-vue';
+
+import { useVbenForm } from '#/adapter/form';
+import { TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import {
+  createCheckPlanMachinery,
+  deleteCheckPlanMachinery,
+  getCheckPlanMachineryListByPlan,
+} from '#/api/mes/dv/checkplan/machinery';
+import { $t } from '#/locales';
+import { DvMachinerySelect } from '#/views/mes/dv/machinery/components';
+
+const props = withDefaults(
+  defineProps<{ formType?: string; planId: number; planType?: number }>(),
+  { formType: 'update', planType: undefined },
+);
+const isEditable = computed(() => props.formType !== 'detail');
+const formOpen = ref(false);
+const formLoading = ref(false);
+const list = ref<MesDvCheckPlanMachineryApi.CheckPlanMachinery[]>([]);
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-2',
+    labelWidth: 80,
+  },
+  layout: 'horizontal',
+  schema: [
+    {
+      fieldName: 'planId',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'machineryId',
+      label: '设备',
+      component: DvMachinerySelect,
+      componentProps: {
+        placeholder: '请选择设备',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入备注',
+        rows: 3,
+      },
+    },
+  ],
+  showDefaultActions: false,
+});
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    autoResize: true,
+    border: true,
+    columns: [
+      { field: 'machineryCode', title: '设备编码', minWidth: 140 },
+      { field: 'machineryName', title: '设备名称', minWidth: 150 },
+      { field: 'machineryBrand', title: '品牌', minWidth: 120 },
+      { field: 'machinerySpecification', title: '规格型号', minWidth: 140 },
+      { field: 'remark', title: '备注', minWidth: 140 },
+      {
+        title: '操作',
+        width: 90,
+        fixed: 'right',
+        slots: {
+          default: 'actions',
+        },
+        visible: isEditable.value,
+      },
+    ],
+    data: list.value,
+    minHeight: 240,
+    pagerConfig: {
+      enabled: false,
+    },
+    rowConfig: {
+      isHover: true,
+      keyField: 'id',
+    },
+    showOverflow: true,
+    toolbarConfig: {
+      enabled: false,
+    },
+  } as VxeTableGridOptions<MesDvCheckPlanMachineryApi.CheckPlanMachinery>,
+});
+
+/** 加载点检设备列表 */
+async function getList() {
+  gridApi.setLoading(true);
+  try {
+    list.value = await getCheckPlanMachineryListByPlan(props.planId);
+    gridApi.setGridOptions({ data: list.value });
+  } finally {
+    gridApi.setLoading(false);
+  }
+}
+
+/** 打开点检设备表单 */
+async function openForm() {
+  formOpen.value = true;
+  await formApi.resetForm();
+  await formApi.setValues({ planId: props.planId });
+}
+
+/** 提交点检设备表单 */
+async function submitForm() {
+  const { valid } = await formApi.validate();
+  if (!valid) {
+    return;
+  }
+  formLoading.value = true;
+  try {
+    await createCheckPlanMachinery(
+      (await formApi.getValues()) as MesDvCheckPlanMachineryApi.CheckPlanMachinery,
+    );
+    formOpen.value = false;
+    message.success($t('ui.actionMessage.operationSuccess'));
+    await getList();
+  } finally {
+    formLoading.value = false;
+  }
+}
+
+/** 删除点检设备 */
+async function handleDelete(id: number) {
+  await deleteCheckPlanMachinery(id);
+  message.success($t('ui.actionMessage.deleteSuccess', ['设备']));
+  await getList();
+}
+watch(
+  () => props.planId,
+  (value) => {
+    if (value) {
+      getList();
+    }
+  },
+  { immediate: true },
+);
+</script>
+<template>
+  <div>
+    <div v-if="isEditable" class="mb-3 flex items-center justify-start">
+      <TableAction :actions="[{ label: '添加设备', type: 'primary', onClick: openForm }]" />
+    </div>
+    <Grid class="w-full">
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: '删除',
+              type: 'link',
+              danger: true,
+              popConfirm: {
+                title: '确认删除该设备吗？',
+                confirm: handleDelete.bind(null, row.id!),
+              },
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+    <Modal
+      v-model:open="formOpen"
+      title="添加设备"
+      width="520px"
+      :confirm-loading="formLoading"
+      @ok="submitForm"
+    >
+      <Form class="mx-4" />
+    </Modal>
+  </div>
+</template>
diff --git a/apps/web-antd/src/views/mes/dv/checkplan/modules/subject-list.vue b/apps/web-antd/src/views/mes/dv/checkplan/modules/subject-list.vue
new file mode 100644
index 000000000..7765cdbaf
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/checkplan/modules/subject-list.vue
@@ -0,0 +1,201 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvCheckPlanSubjectApi } from '#/api/mes/dv/checkplan/subject';
+
+import { computed, ref, watch } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+
+import { message, Modal } from 'ant-design-vue';
+
+import { useVbenForm } from '#/adapter/form';
+import { TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import {
+  createCheckPlanSubject,
+  deleteCheckPlanSubject,
+  getCheckPlanSubjectListByPlan,
+} from '#/api/mes/dv/checkplan/subject';
+import { $t } from '#/locales';
+import { DvSubjectSelect } from '#/views/mes/dv/subject/components';
+
+const props = withDefaults(
+  defineProps<{ formType?: string; planId: number; planType?: number }>(),
+  { formType: 'update', planType: undefined },
+);
+const isEditable = computed(() => props.formType !== 'detail');
+const formOpen = ref(false);
+const formLoading = ref(false);
+const list = ref<MesDvCheckPlanSubjectApi.CheckPlanSubject[]>([]);
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-2',
+    labelWidth: 80,
+  },
+  layout: 'horizontal',
+  schema: [
+    {
+      fieldName: 'planId',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'subjectId',
+      label: '项目',
+      component: DvSubjectSelect,
+      componentProps: {
+        type: props.planType,
+        placeholder: '请选择项目',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入备注',
+        rows: 3,
+      },
+    },
+  ],
+  showDefaultActions: false,
+});
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    autoResize: true,
+    border: true,
+    columns: [
+      { field: 'subjectCode', title: '项目编码', minWidth: 140 },
+      { field: 'subjectName', title: '项目名称', minWidth: 150 },
+      {
+        field: 'subjectType',
+        title: '项目类型',
+        width: 120,
+        cellRender: {
+          name: 'CellDict',
+          props: { type: DICT_TYPE.MES_DV_SUBJECT_TYPE },
+        },
+      },
+      { field: 'subjectContent', title: '项目内容', minWidth: 160 },
+      { field: 'subjectStandard', title: '标准', minWidth: 160 },
+      { field: 'remark', title: '备注', minWidth: 140 },
+      {
+        title: '操作',
+        width: 90,
+        fixed: 'right',
+        slots: {
+          default: 'actions',
+        },
+        visible: isEditable.value,
+      },
+    ],
+    data: list.value,
+    minHeight: 240,
+    pagerConfig: {
+      enabled: false,
+    },
+    rowConfig: {
+      isHover: true,
+      keyField: 'id',
+    },
+    showOverflow: true,
+    toolbarConfig: {
+      enabled: false,
+    },
+  } as VxeTableGridOptions<MesDvCheckPlanSubjectApi.CheckPlanSubject>,
+});
+
+/** 加载点检项目列表 */
+async function getList() {
+  gridApi.setLoading(true);
+  try {
+    list.value = await getCheckPlanSubjectListByPlan(props.planId);
+    gridApi.setGridOptions({ data: list.value });
+  } finally {
+    gridApi.setLoading(false);
+  }
+}
+
+/** 打开点检项目表单 */
+async function openForm() {
+  formOpen.value = true;
+  await formApi.resetForm();
+  await formApi.setValues({ planId: props.planId });
+}
+
+/** 提交点检项目表单 */
+async function submitForm() {
+  const { valid } = await formApi.validate();
+  if (!valid) {
+    return;
+  }
+  formLoading.value = true;
+  try {
+    await createCheckPlanSubject(
+      (await formApi.getValues()) as MesDvCheckPlanSubjectApi.CheckPlanSubject,
+    );
+    formOpen.value = false;
+    message.success($t('ui.actionMessage.operationSuccess'));
+    await getList();
+  } finally {
+    formLoading.value = false;
+  }
+}
+
+/** 删除点检项目 */
+async function handleDelete(id: number) {
+  await deleteCheckPlanSubject(id);
+  message.success($t('ui.actionMessage.deleteSuccess', ['项目']));
+  await getList();
+}
+watch(
+  () => props.planId,
+  (value) => {
+    if (value) {
+      getList();
+    }
+  },
+  { immediate: true },
+);
+</script>
+<template>
+  <div>
+    <div v-if="isEditable" class="mb-3 flex items-center justify-start">
+      <TableAction :actions="[{ label: '添加项目', type: 'primary', onClick: openForm }]" />
+    </div>
+    <Grid class="w-full">
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: '删除',
+              type: 'link',
+              danger: true,
+              popConfirm: {
+                title: '确认删除该项目吗？',
+                confirm: handleDelete.bind(null, row.id!),
+              },
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+    <Modal
+      v-model:open="formOpen"
+      title="添加项目"
+      width="520px"
+      :confirm-loading="formLoading"
+      @ok="submitForm"
+    >
+      <Form class="mx-4" />
+    </Modal>
+  </div>
+</template>
diff --git a/apps/web-antd/src/views/mes/dv/checkrecord/data.ts b/apps/web-antd/src/views/mes/dv/checkrecord/data.ts
new file mode 100644
index 000000000..68ffa8567
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/checkrecord/data.ts
@@ -0,0 +1,165 @@
+import type { VbenFormSchema } from '#/adapter/form';
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvCheckRecordApi } from '#/api/mes/dv/checkrecord';
+
+import { markRaw } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
+import { getSimpleUserList } from '#/api/system/user';
+import { getRangePickerDefaultProps } from '#/utils';
+import { DvCheckPlanSelect } from '#/views/mes/dv/checkplan/components';
+import { DvMachinerySelect } from '#/views/mes/dv/machinery/components';
+import {
+  MesDvCheckPlanStatusEnum,
+  MesDvCheckRecordStatusEnum,
+  MesDvSubjectTypeEnum,
+} from '#/views/mes/utils/constants';
+
+/** 新增/修改点检记录的表单 */
+export function useFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'status',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+      defaultValue: MesDvCheckRecordStatusEnum.DRAFT,
+    },
+    {
+      fieldName: 'machineryId',
+      label: '设备',
+      component: markRaw(DvMachinerySelect),
+      componentProps: {
+        placeholder: '请选择设备',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'planId',
+      label: '点检计划',
+      component: markRaw(DvCheckPlanSelect),
+      componentProps: {
+        status: MesDvCheckPlanStatusEnum.ENABLED,
+        type: MesDvSubjectTypeEnum.CHECK,
+        placeholder: '请选择计划',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'userId',
+      label: '点检人',
+      component: 'ApiSelect',
+      componentProps: {
+        allowClear: true,
+        api: getSimpleUserList,
+        labelField: 'nickname',
+        placeholder: '请选择点检人',
+        valueField: 'id',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'checkTime',
+      label: '点检时间',
+      component: 'DatePicker',
+      componentProps: {
+        format: 'YYYY-MM-DD HH:mm:ss',
+        placeholder: '请选择点检时间',
+        showTime: true,
+        valueFormat: 'x',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      formItemClass: 'col-span-3',
+      componentProps: {
+        placeholder: '请输入备注',
+        rows: 3,
+      },
+    },
+  ];
+}
+
+/** 列表的搜索表单 */
+export function useGridFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'machineryName',
+      label: '设备名称',
+      component: 'Input',
+      componentProps: {
+        allowClear: true,
+        placeholder: '请输入设备名称',
+      },
+    },
+    {
+      fieldName: 'checkTime',
+      label: '点检时间',
+      component: 'RangePicker',
+      componentProps: {
+        ...getRangePickerDefaultProps(),
+      },
+    },
+    {
+      fieldName: 'status',
+      label: '状态',
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: getDictOptions(DICT_TYPE.MES_DV_CHECK_RECORD_STATUS, 'number'),
+        placeholder: '请选择状态',
+      },
+    },
+  ];
+}
+
+/** 列表的字段 */
+export function useGridColumns(): VxeTableGridOptions<MesDvCheckRecordApi.CheckRecord>['columns'] {
+  return [
+    { field: 'machineryCode', title: '设备编码', minWidth: 140 },
+    {
+      field: 'machineryName',
+      title: '设备名称',
+      minWidth: 150,
+      slots: {
+        default: 'machineryName',
+      },
+    },
+    { field: 'planName', title: '计划名称', minWidth: 150 },
+    { field: 'checkTime', title: '点检时间', width: 180, formatter: 'formatDateTime' },
+    { field: 'nickname', title: '点检人', minWidth: 120 },
+    {
+      field: 'status',
+      title: '状态',
+      width: 120,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_DV_CHECK_RECORD_STATUS },
+      },
+    },
+    { field: 'createTime', title: '创建时间', width: 180, formatter: 'formatDateTime' },
+    {
+      title: '操作',
+      width: 200,
+      fixed: 'right',
+      slots: {
+        default: 'actions',
+      },
+    },
+  ];
+}
diff --git a/apps/web-antd/src/views/mes/dv/checkrecord/index.vue b/apps/web-antd/src/views/mes/dv/checkrecord/index.vue
new file mode 100644
index 000000000..cc76f8423
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/checkrecord/index.vue
@@ -0,0 +1,161 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvCheckRecordApi } from '#/api/mes/dv/checkrecord';
+
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
+import { downloadFileFromBlobPart } from '@vben/utils';
+
+import { Button, message } from 'ant-design-vue';
+
+import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import { deleteCheckRecord, exportCheckRecord, getCheckRecordPage } from '#/api/mes/dv/checkrecord';
+import { $t } from '#/locales';
+import { MesDvCheckRecordStatusEnum } from '#/views/mes/utils/constants';
+
+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({ type: 'create' }).open();
+}
+
+/** 查看点检记录 */
+function handleDetail(row: MesDvCheckRecordApi.CheckRecord) {
+  formModalApi.setData({ id: row.id, type: 'detail' }).open();
+}
+
+/** 编辑点检记录 */
+function handleEdit(row: MesDvCheckRecordApi.CheckRecord) {
+  formModalApi.setData({ id: row.id, type: 'update' }).open();
+}
+
+/** 删除点检记录 */
+async function handleDelete(row: MesDvCheckRecordApi.CheckRecord) {
+  const hideLoading = message.loading({
+    content: $t('ui.actionMessage.deleting', [row.machineryName]),
+    duration: 0,
+  });
+  try {
+    await deleteCheckRecord(row.id!);
+    message.success($t('ui.actionMessage.deleteSuccess', [row.machineryName]));
+    handleRefresh();
+  } finally {
+    hideLoading();
+  }
+}
+
+/** 导出点检记录 */
+async function handleExport() {
+  const data = await exportCheckRecord(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) =>
+          await getCheckRecordPage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            ...formValues,
+          }),
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+  } as VxeTableGridOptions<MesDvCheckRecordApi.CheckRecord>,
+});
+</script>
+<template>
+  <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【设备】点检记录、保养记录、维修单"
+        url="https://doc.iocoder.cn/mes/dv/check-record/"
+      />
+    </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:dv-check-record:create'],
+              onClick: handleCreate,
+            },
+            {
+              label: $t('ui.actionTitle.export'),
+              type: 'primary',
+              icon: ACTION_ICON.DOWNLOAD,
+              auth: ['mes:dv-check-record:export'],
+              onClick: handleExport,
+            },
+          ]"
+        />
+      </template>
+      <template #machineryName="{ row }">
+        <Button type="link" @click="handleDetail(row)">{{ row.machineryName }}</Button>
+      </template>
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: $t('common.edit'),
+              type: 'link',
+              icon: ACTION_ICON.EDIT,
+              auth: ['mes:dv-check-record:update'],
+              onClick: handleEdit.bind(null, row),
+              ifShow: row.status === MesDvCheckRecordStatusEnum.DRAFT,
+            },
+            {
+              label: $t('common.delete'),
+              type: 'link',
+              danger: true,
+              icon: ACTION_ICON.DELETE,
+              auth: ['mes:dv-check-record:delete'],
+              popConfirm: {
+                title: $t('ui.actionMessage.deleteConfirm', [row.machineryName]),
+                confirm: handleDelete.bind(null, row),
+              },
+              ifShow: row.status === MesDvCheckRecordStatusEnum.DRAFT,
+            },
+            {
+              label: $t('common.detail'),
+              type: 'link',
+              icon: ACTION_ICON.VIEW,
+              auth: ['mes:dv-check-record:query'],
+              onClick: handleDetail.bind(null, row),
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+  </Page>
+</template>
diff --git a/apps/web-antd/src/views/mes/dv/checkrecord/modules/form.vue b/apps/web-antd/src/views/mes/dv/checkrecord/modules/form.vue
new file mode 100644
index 000000000..d8093f428
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/checkrecord/modules/form.vue
@@ -0,0 +1,142 @@
+<script lang="ts" setup>
+import type { MesDvCheckRecordApi } from '#/api/mes/dv/checkrecord';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { Button, message, Popconfirm } from 'ant-design-vue';
+
+import { useVbenForm } from '#/adapter/form';
+import {
+  createCheckRecord,
+  getCheckRecord,
+  submitCheckRecord,
+  updateCheckRecord,
+} from '#/api/mes/dv/checkrecord';
+import { $t } from '#/locales';
+import { MesDvCheckRecordStatusEnum } from '#/views/mes/utils/constants';
+
+import { useFormSchema } from '../data';
+import LineList from './line-list.vue';
+
+type FormMode = 'create' | 'detail' | 'update';
+
+const emit = defineEmits(['success']);
+const formMode = ref<FormMode>('create');
+const formData = ref<MesDvCheckRecordApi.CheckRecord>();
+const isDetail = computed(() => formMode.value === 'detail');
+const canSubmit = computed(
+  () => formMode.value === 'update' && formData.value?.status === MesDvCheckRecordStatusEnum.DRAFT,
+);
+const getTitle = computed(() => {
+  if (formMode.value === 'detail') {
+    return '查看点检记录';
+  }
+  return formMode.value === 'update' ? '修改点检记录' : '新增点检记录';
+});
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-1',
+    labelWidth: 100,
+  },
+  wrapperClass: 'grid-cols-3',
+  layout: 'horizontal',
+  schema: useFormSchema(),
+  showDefaultActions: false,
+});
+
+/** 提交点检记录 */
+async function handleSubmit() {
+  const { valid } = await formApi.validate();
+  if (!valid || !formData.value?.id) {
+    return;
+  }
+
+  modalApi.lock();
+  try {
+    await updateCheckRecord((await formApi.getValues()) as MesDvCheckRecordApi.CheckRecord);
+    await submitCheckRecord(formData.value.id);
+    await modalApi.close();
+    emit('success');
+    message.success('提交成功');
+  } finally {
+    modalApi.unlock();
+  }
+}
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    if (isDetail.value) {
+      await modalApi.close();
+      return;
+    }
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    const data = (await formApi.getValues()) as MesDvCheckRecordApi.CheckRecord;
+    try {
+      if (formMode.value === 'create') {
+        const id = await createCheckRecord(data);
+        formData.value = { ...data, id: id as number, status: MesDvCheckRecordStatusEnum.DRAFT };
+        await formApi.setFieldValue('id', id);
+        formMode.value = 'update';
+      } else {
+        await updateCheckRecord(data);
+        formData.value = { ...formData.value, ...data };
+      }
+      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; type?: FormMode }>();
+    formMode.value = data?.type || 'create';
+    formApi.setDisabled(formMode.value === 'detail');
+    modalApi.setState({ showConfirmButton: formMode.value !== 'detail' });
+    if (!data?.id) {
+      return;
+    }
+    modalApi.lock();
+    try {
+      formData.value = await getCheckRecord(data.id);
+      // 设置到 values
+      await formApi.setValues(formData.value);
+    } finally {
+      modalApi.unlock();
+    }
+  },
+});
+</script>
+<template>
+  <Modal :title="getTitle" class="w-4/5">
+    <Form class="mx-4" />
+    <LineList v-if="formData?.id" :disabled="isDetail" :record-id="formData.id" />
+    <template #prepend-footer>
+      <div class="flex flex-auto items-center">
+        <Popconfirm
+          v-if="canSubmit"
+          title="确认提交该点检记录？提交后将不能修改。"
+          @confirm="handleSubmit"
+        >
+          <Button type="primary">提交</Button>
+        </Popconfirm>
+      </div>
+    </template>
+  </Modal>
+</template>
diff --git a/apps/web-antd/src/views/mes/dv/checkrecord/modules/line-list.vue b/apps/web-antd/src/views/mes/dv/checkrecord/modules/line-list.vue
new file mode 100644
index 000000000..467077d99
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/checkrecord/modules/line-list.vue
@@ -0,0 +1,232 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvCheckRecordLineApi } from '#/api/mes/dv/checkrecord/line';
+
+import { computed, ref, watch } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
+import { message, Modal } from 'ant-design-vue';
+
+import { useVbenForm } from '#/adapter/form';
+import { TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import {
+  createCheckRecordLine,
+  deleteCheckRecordLine,
+  getCheckRecordLine,
+  getCheckRecordLinePage,
+  updateCheckRecordLine,
+} from '#/api/mes/dv/checkrecord/line';
+import { $t } from '#/locales';
+import { DvSubjectSelect } from '#/views/mes/dv/subject/components';
+import { MesDvCheckResultEnum, MesDvSubjectTypeEnum } from '#/views/mes/utils/constants';
+
+const props = defineProps<{ disabled?: boolean; recordId: number }>();
+const formOpen = ref(false);
+const formLoading = ref(false);
+const lineFormType = ref<'create' | 'update'>('create');
+const formTitle = computed(() => (lineFormType.value === 'create' ? '添加明细' : '修改明细'));
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-2',
+    labelWidth: 90,
+  },
+  layout: 'horizontal',
+  schema: [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'recordId',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'subjectId',
+      label: '项目',
+      component: DvSubjectSelect,
+      componentProps: {
+        type: MesDvSubjectTypeEnum.CHECK,
+        placeholder: '请选择项目',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'checkStatus',
+      label: '结果',
+      component: 'RadioGroup',
+      componentProps: {
+        buttonStyle: 'solid',
+        optionType: 'button',
+        options: getDictOptions(DICT_TYPE.MES_DV_CHECK_RESULT, 'number'),
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'checkResult',
+      label: '异常描述',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入异常描述',
+        rows: 3,
+      },
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入备注',
+        rows: 2,
+      },
+    },
+  ],
+  showDefaultActions: false,
+});
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    columns: [
+      { field: 'subjectName', title: '项目名称', minWidth: 150 },
+      { field: 'subjectContent', title: '项目内容', minWidth: 160 },
+      { field: 'subjectStandard', title: '项目标准', minWidth: 160 },
+      {
+        field: 'checkStatus',
+        title: '结果',
+        width: 120,
+        cellRender: {
+          name: 'CellDict',
+          props: { type: DICT_TYPE.MES_DV_CHECK_RESULT },
+        },
+      },
+      { field: 'checkResult', title: '异常描述', minWidth: 160 },
+      {
+        title: '操作',
+        width: 130,
+        fixed: 'right',
+        slots: {
+          default: 'actions',
+        },
+        visible: !props.disabled,
+      },
+    ],
+    height: 320,
+    keepSource: true,
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }) =>
+          await getCheckRecordLinePage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            recordId: props.recordId,
+          }),
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+    },
+  } as VxeTableGridOptions<MesDvCheckRecordLineApi.CheckRecordLine>,
+});
+
+/** 打开点检明细表单 */
+async function openForm(type: 'create' | 'update', row?: MesDvCheckRecordLineApi.CheckRecordLine) {
+  formOpen.value = true;
+  lineFormType.value = type;
+  await formApi.resetForm();
+  await formApi.setValues(
+    row
+      ? await getCheckRecordLine(row.id!)
+      : {
+          recordId: props.recordId,
+          checkStatus: MesDvCheckResultEnum.NORMAL,
+          checkResult: '',
+          remark: '',
+        },
+  );
+}
+
+/** 提交点检明细表单 */
+async function submitForm() {
+  const { valid } = await formApi.validate();
+  if (!valid) {
+    return;
+  }
+  formLoading.value = true;
+  try {
+    const data = (await formApi.getValues()) as MesDvCheckRecordLineApi.CheckRecordLine;
+    await (data.id ? updateCheckRecordLine(data) : createCheckRecordLine(data));
+    formOpen.value = false;
+    message.success($t('ui.actionMessage.operationSuccess'));
+    await gridApi.query();
+  } finally {
+    formLoading.value = false;
+  }
+}
+
+/** 删除点检明细 */
+async function handleDelete(id: number) {
+  await deleteCheckRecordLine(id);
+  message.success($t('ui.actionMessage.deleteSuccess', ['明细']));
+  await gridApi.query();
+}
+watch(
+  () => props.recordId,
+  (value) => {
+    if (value) {
+      gridApi.query();
+    }
+  },
+);
+</script>
+<template>
+  <div class="mx-4 mt-4">
+    <div v-if="!disabled" class="mb-3">
+      <TableAction
+        :actions="[{ label: '添加明细', type: 'primary', onClick: openForm.bind(null, 'create') }]"
+      />
+    </div>
+    <Grid table-title="明细列表">
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            { label: '编辑', type: 'link', onClick: openForm.bind(null, 'update', row) },
+            {
+              label: '删除',
+              type: 'link',
+              danger: true,
+              popConfirm: {
+                title: '确认删除该明细吗？',
+                confirm: handleDelete.bind(null, row.id!),
+              },
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+    <Modal
+      v-model:open="formOpen"
+      :title="formTitle"
+      width="620px"
+      :confirm-loading="formLoading"
+      @ok="submitForm"
+    >
+      <Form class="mx-4" />
+    </Modal>
+  </div>
+</template>
diff --git a/apps/web-antd/src/views/mes/dv/machinery/components/dv-machinery-select.vue b/apps/web-antd/src/views/mes/dv/machinery/components/dv-machinery-select.vue
new file mode 100644
index 000000000..ea9b543c8
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/machinery/components/dv-machinery-select.vue
@@ -0,0 +1,58 @@
+<script lang="ts" setup>
+import type { SelectValue } from 'ant-design-vue/es/select';
+
+import type { MesDvMachineryApi } from '#/api/mes/dv/machinery';
+
+import { onMounted, ref } from 'vue';
+
+import { Select } from 'ant-design-vue';
+
+import { getMachinerySimpleList } from '#/api/mes/dv/machinery';
+
+withDefaults(
+  defineProps<{
+    allowClear?: boolean;
+    disabled?: boolean;
+    modelValue?: number;
+    placeholder?: string;
+  }>(),
+  { allowClear: true, disabled: false, modelValue: undefined, placeholder: '请选择设备' },
+);
+const emit = defineEmits<{
+  change: [row?: MesDvMachineryApi.Machinery];
+  'update:modelValue': [value?: number];
+}>();
+const list = ref<MesDvMachineryApi.Machinery[]>([]); // 设备列表
+
+/** 加载设备列表 */
+async function getList() {
+  list.value = await getMachinerySimpleList();
+}
+
+/** 处理设备选择变化 */
+function handleChange(value: SelectValue) {
+  const machineryId = typeof value === 'number' ? value : undefined;
+  emit('update:modelValue', machineryId);
+  emit(
+    'change',
+    list.value.find((item) => item.id === machineryId),
+  );
+}
+
+onMounted(getList);
+</script>
+
+<template>
+  <Select
+    :allow-clear="allowClear"
+    :disabled="disabled"
+    :field-names="{ label: 'name', value: 'id' }"
+    :options="list"
+    :placeholder="placeholder"
+    :value="modelValue"
+    class="w-full"
+    option-filter-prop="name"
+    show-search
+    @change="handleChange"
+  />
+</template>
diff --git a/apps/web-antd/src/views/mes/dv/machinery/components/index.ts b/apps/web-antd/src/views/mes/dv/machinery/components/index.ts
new file mode 100644
index 000000000..cbe225de1
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/machinery/components/index.ts
@@ -0,0 +1 @@
+export { default as DvMachinerySelect } from './dv-machinery-select.vue';
diff --git a/apps/web-antd/src/views/mes/dv/machinery/data.ts b/apps/web-antd/src/views/mes/dv/machinery/data.ts
new file mode 100644
index 000000000..ad6b99f20
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/machinery/data.ts
@@ -0,0 +1,279 @@
+import type { Ref } from 'vue';
+
+import type { VbenFormApi, VbenFormSchema } from '#/adapter/form';
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvMachineryApi } from '#/api/mes/dv/machinery';
+
+import { h, markRaw } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
+import { Button } from 'ant-design-vue';
+
+import { z } from '#/adapter/form';
+import { generateAutoCode } from '#/api/mes/md/autocode/record';
+import { MdWorkshopSelect } from '#/views/mes/md/workstation/components';
+import { MesAutoCodeRuleCode, MesDvMachineryStatusEnum } from '#/views/mes/utils/constants';
+
+import { DvMachineryTypeSelect } from './type/components';
+
+/** 新增/修改设备的表单 */
+export function useFormSchema(formApi?: VbenFormApi, formMode?: Ref<string>): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'code',
+      label: '设备编码',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入设备编码',
+      },
+      dependencies: {
+        triggerFields: ['id'],
+        componentProps: (values) => ({ disabled: !!values.id }),
+      },
+      rules: 'required',
+      suffix: () =>
+        h(
+          Button,
+          {
+            type: 'default',
+            onClick: async () => {
+              try {
+                const code = await generateAutoCode(MesAutoCodeRuleCode.DV_MACHINERY_CODE);
+                await formApi?.setFieldValue('code', code);
+              } catch (error) {
+                console.error(error);
+              }
+            },
+          },
+          { default: () => '生成' },
+        ),
+    },
+    {
+      fieldName: 'name',
+      label: '设备名称',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入设备名称',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'brand',
+      label: '品牌',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入品牌',
+      },
+    },
+    {
+      fieldName: 'machineryTypeId',
+      label: '设备类型',
+      component: markRaw(DvMachineryTypeSelect),
+      componentProps: {
+        placeholder: '请选择设备类型',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'workshopId',
+      label: '所属车间',
+      component: markRaw(MdWorkshopSelect),
+      componentProps: {
+        placeholder: '请选择所属车间',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'status',
+      label: '设备状态',
+      component: 'RadioGroup',
+      componentProps: {
+        buttonStyle: 'solid',
+        optionType: 'button',
+        options: getDictOptions(DICT_TYPE.MES_DV_MACHINERY_STATUS, 'number'),
+      },
+      rules: z.number().default(MesDvMachineryStatusEnum.STOP),
+    },
+    {
+      fieldName: 'specification',
+      label: '规格型号',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入规格型号',
+      },
+    },
+    {
+      fieldName: 'lastCheckTime',
+      label: '最近点检时间',
+      component: 'DatePicker',
+      componentProps: {
+        class: '!w-full',
+        disabled: true,
+        format: 'YYYY-MM-DD HH:mm:ss',
+        showTime: true,
+        valueFormat: 'x',
+      },
+      dependencies: {
+        triggerFields: ['id'],
+        show: () => formMode?.value === 'detail',
+      },
+    },
+    {
+      fieldName: 'lastMaintenTime',
+      label: '最近保养时间',
+      component: 'DatePicker',
+      componentProps: {
+        class: '!w-full',
+        disabled: true,
+        format: 'YYYY-MM-DD HH:mm:ss',
+        showTime: true,
+        valueFormat: 'x',
+      },
+      dependencies: {
+        triggerFields: ['id'],
+        show: () => formMode?.value === 'detail',
+      },
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      formItemClass: 'col-span-3',
+      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: 'workshopId',
+      label: '所属车间',
+      component: markRaw(MdWorkshopSelect),
+      componentProps: {
+        allowClear: true,
+        placeholder: '请选择所属车间',
+      },
+    },
+    {
+      fieldName: 'status',
+      label: '设备状态',
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: getDictOptions(DICT_TYPE.MES_DV_MACHINERY_STATUS, 'number'),
+        placeholder: '请选择设备状态',
+      },
+    },
+  ];
+}
+
+/** 列表的字段 */
+export function useGridColumns(): VxeTableGridOptions<MesDvMachineryApi.Machinery>['columns'] {
+  return [
+    {
+      field: 'code',
+      title: '设备编码',
+      minWidth: 140,
+      slots: {
+        default: 'code',
+      },
+    },
+    { field: 'name', title: '设备名称', minWidth: 140 },
+    { field: 'brand', title: '品牌', minWidth: 120 },
+    { field: 'specification', title: '规格型号', minWidth: 140 },
+    { field: 'machineryTypeName', title: '设备类型', minWidth: 140 },
+    { field: 'workshopName', title: '所属车间', minWidth: 140 },
+    {
+      field: 'status',
+      title: '设备状态',
+      width: 120,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_DV_MACHINERY_STATUS },
+      },
+    },
+    {
+      field: 'lastCheckTime',
+      title: '最近点检时间',
+      width: 180,
+      formatter: 'formatDateTime',
+    },
+    {
+      field: 'lastMaintenTime',
+      title: '最近保养时间',
+      width: 180,
+      formatter: 'formatDateTime',
+    },
+    {
+      field: 'createTime',
+      title: '创建时间',
+      width: 180,
+      formatter: 'formatDateTime',
+    },
+    {
+      title: '操作',
+      width: 220,
+      fixed: 'right',
+      slots: {
+        default: 'actions',
+      },
+    },
+  ];
+}
+
+/** 导入表单 */
+export function useImportFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'file',
+      label: '设备数据',
+      component: 'Upload',
+      rules: 'required',
+      help: '仅允许导入 xls、xlsx 格式文件',
+    },
+    {
+      fieldName: 'updateSupport',
+      label: '是否覆盖',
+      component: 'Switch',
+      componentProps: {
+        checkedChildren: '是',
+        unCheckedChildren: '否',
+      },
+      rules: z.boolean().default(false),
+      help: '是否更新已经存在的设备数据',
+    },
+  ];
+}
diff --git a/apps/web-antd/src/views/mes/dv/machinery/index.vue b/apps/web-antd/src/views/mes/dv/machinery/index.vue
new file mode 100644
index 000000000..cac7195df
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/machinery/index.vue
@@ -0,0 +1,197 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvMachineryApi } from '#/api/mes/dv/machinery';
+import type { MesDvMachineryTypeApi } from '#/api/mes/dv/machinery/type';
+
+import { ref } from 'vue';
+
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
+import { downloadFileFromBlobPart } from '@vben/utils';
+
+import { Button, message } from 'ant-design-vue';
+
+import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import { deleteMachinery, exportMachinery, getMachineryPage } from '#/api/mes/dv/machinery';
+import { $t } from '#/locales';
+import { MachineryTypeTree } from '#/views/mes/dv/machinery/type/components';
+
+import { useGridColumns, useGridFormSchema } from './data';
+import Form from './modules/form.vue';
+import ImportForm from './modules/import-form.vue';
+
+const selectedMachineryTypeId = ref<number>(); // 选中设备类型编号
+
+const [FormModal, formModalApi] = useVbenModal({
+  connectedComponent: Form,
+  destroyOnClose: true,
+});
+const [ImportModal, importModalApi] = useVbenModal({
+  connectedComponent: ImportForm,
+  destroyOnClose: true,
+});
+
+/** 刷新表格 */
+function handleRefresh() {
+  gridApi.query();
+}
+
+/** 创建设备 */
+function handleCreate() {
+  formModalApi.setData({ type: 'create' }).open();
+}
+
+/** 查看设备 */
+function handleDetail(row: MesDvMachineryApi.Machinery) {
+  formModalApi.setData({ id: row.id, type: 'detail' }).open();
+}
+
+/** 编辑设备 */
+function handleEdit(row: MesDvMachineryApi.Machinery) {
+  formModalApi.setData({ id: row.id, type: 'update' }).open();
+}
+
+/** 删除设备 */
+async function handleDelete(row: MesDvMachineryApi.Machinery) {
+  const hideLoading = message.loading({
+    content: $t('ui.actionMessage.deleting', [row.name]),
+    duration: 0,
+  });
+  try {
+    await deleteMachinery(row.id!);
+    message.success($t('ui.actionMessage.deleteSuccess', [row.name]));
+    handleRefresh();
+  } finally {
+    hideLoading();
+  }
+}
+
+/** 导出设备 */
+async function handleExport() {
+  const data = await exportMachinery(await gridApi.formApi.getValues());
+  downloadFileFromBlobPart({ fileName: '设备台账.xls', source: data });
+}
+
+/** 导入设备 */
+function handleImport() {
+  importModalApi.open();
+}
+
+/** 按设备类型筛选 */
+function handleTypeNodeClick(row: MesDvMachineryTypeApi.MachineryType | undefined) {
+  selectedMachineryTypeId.value = row?.id;
+  handleRefresh();
+}
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  formOptions: {
+    schema: useGridFormSchema(),
+  },
+  gridOptions: {
+    columns: useGridColumns(),
+    height: 'auto',
+    keepSource: true,
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }, formValues) =>
+          await getMachineryPage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            ...formValues,
+            machineryTypeId: selectedMachineryTypeId.value,
+          }),
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+  } as VxeTableGridOptions<MesDvMachineryApi.Machinery>,
+});
+</script>
+
+<template>
+  <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【设备】设备类型、设备台账"
+        url="https://doc.iocoder.cn/mes/dv/device/"
+      />
+    </template>
+    <FormModal @success="handleRefresh" />
+    <ImportModal @success="handleRefresh" />
+    <div class="flex h-full w-full">
+      <div class="mr-4 h-full w-1/6">
+        <MachineryTypeTree @node-click="handleTypeNodeClick" />
+      </div>
+      <div class="w-5/6">
+        <Grid table-title="设备台账列表">
+          <template #toolbar-tools>
+            <TableAction
+              :actions="[
+                {
+                  label: $t('ui.actionTitle.create', ['设备']),
+                  type: 'primary',
+                  icon: ACTION_ICON.ADD,
+                  auth: ['mes:dv-machinery:create'],
+                  onClick: handleCreate,
+                },
+                {
+                  label: $t('ui.actionTitle.import'),
+                  type: 'primary',
+                  icon: ACTION_ICON.UPLOAD,
+                  auth: ['mes:dv-machinery:import'],
+                  onClick: handleImport,
+                },
+                {
+                  label: $t('ui.actionTitle.export'),
+                  type: 'primary',
+                  icon: ACTION_ICON.DOWNLOAD,
+                  auth: ['mes:dv-machinery:export'],
+                  onClick: handleExport,
+                },
+              ]"
+            />
+          </template>
+          <template #code="{ row }">
+            <Button type="link" @click="handleDetail(row)">{{ row.code }}</Button>
+          </template>
+          <template #actions="{ row }">
+            <TableAction
+              :actions="[
+                {
+                  label: $t('common.edit'),
+                  type: 'link',
+                  icon: ACTION_ICON.EDIT,
+                  auth: ['mes:dv-machinery:update'],
+                  onClick: handleEdit.bind(null, row),
+                },
+                {
+                  label: $t('common.delete'),
+                  type: 'link',
+                  danger: true,
+                  icon: ACTION_ICON.DELETE,
+                  auth: ['mes:dv-machinery:delete'],
+                  popConfirm: {
+                    title: $t('ui.actionMessage.deleteConfirm', [row.name]),
+                    confirm: handleDelete.bind(null, row),
+                  },
+                },
+                {
+                  label: $t('common.detail'),
+                  type: 'link',
+                  icon: ACTION_ICON.VIEW,
+                  auth: ['mes:dv-machinery:query'],
+                  onClick: handleDetail.bind(null, row),
+                },
+              ]"
+            />
+          </template>
+        </Grid>
+      </div>
+    </div>
+  </Page>
+</template>
diff --git a/apps/web-antd/src/views/mes/dv/machinery/modules/check-record-list.vue b/apps/web-antd/src/views/mes/dv/machinery/modules/check-record-list.vue
new file mode 100644
index 000000000..aa486cf05
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/machinery/modules/check-record-list.vue
@@ -0,0 +1,73 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvCheckRecordApi } from '#/api/mes/dv/checkrecord';
+
+import { watch } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { getCheckRecordPage } from '#/api/mes/dv/checkrecord';
+
+const props = defineProps<{ machineryId: number }>();
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    columns: [
+      { field: 'planName', title: '计划名称', minWidth: 150 },
+      {
+        field: 'planCycleType',
+        title: '周期类型',
+        width: 120,
+        cellRender: {
+          name: 'CellDict',
+          props: { type: DICT_TYPE.MES_DV_CYCLE_TYPE },
+        },
+      },
+      { field: 'checkTime', title: '点检时间', width: 180, formatter: 'formatDateTime' },
+      { field: 'nickname', title: '操作人', minWidth: 120 },
+      {
+        field: 'status',
+        title: '状态',
+        width: 120,
+        cellRender: {
+          name: 'CellDict',
+          props: { type: DICT_TYPE.MES_DV_CHECK_RECORD_STATUS },
+        },
+      },
+    ],
+    height: 320,
+    keepSource: true,
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }) =>
+          await getCheckRecordPage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            machineryId: props.machineryId,
+          }),
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+    },
+  } as VxeTableGridOptions<MesDvCheckRecordApi.CheckRecord>,
+});
+
+watch(
+  () => props.machineryId,
+  (value) => {
+    if (value) {
+      gridApi.query();
+    }
+  },
+);
+</script>
+
+<template>
+  <Grid table-title="点检记录" />
+</template>
diff --git a/apps/web-antd/src/views/mes/dv/machinery/modules/form.vue b/apps/web-antd/src/views/mes/dv/machinery/modules/form.vue
new file mode 100644
index 000000000..e8f590eed
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/machinery/modules/form.vue
@@ -0,0 +1,143 @@
+<script lang="ts" setup>
+import type { MesDvMachineryApi } from '#/api/mes/dv/machinery';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { Button, message, Tabs } from 'ant-design-vue';
+
+import { useVbenForm } from '#/adapter/form';
+import { createMachinery, getMachinery, updateMachinery } from '#/api/mes/dv/machinery';
+import { $t } from '#/locales';
+import { BarcodeBizTypeEnum } from '#/views/mes/utils/constants';
+import { BarcodeDetail } from '#/views/mes/wm/barcode/components';
+
+import { useFormSchema } from '../data';
+import CheckRecordList from './check-record-list.vue';
+import MaintenRecordList from './mainten-record-list.vue';
+import RepairList from './repair-list.vue';
+
+type FormMode = 'create' | 'detail' | 'update';
+
+const emit = defineEmits(['success']);
+const formMode = ref<FormMode>('create'); // 表单模式
+const subTabsName = ref('check'); // 当前资源页签
+const formData = ref<MesDvMachineryApi.Machinery>();
+const barcodeDetailRef = ref<InstanceType<typeof BarcodeDetail>>(); // 条码详情弹窗
+const isDetail = computed(() => formMode.value === 'detail'); // 是否查看模式
+const getTitle = computed(() => {
+  if (formMode.value === 'detail') {
+    return '查看设备';
+  }
+  return formMode.value === 'update' ? '修改设备' : '新增设备';
+});
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-1',
+    labelWidth: 110,
+  },
+  wrapperClass: 'grid-cols-3',
+  layout: 'horizontal',
+  schema: [],
+  showDefaultActions: false,
+});
+
+/** 表单 schema 需要 formApi 引用，所以通过 setState 设置 schema */
+formApi.setState({ schema: useFormSchema(formApi, formMode) });
+
+/** 查看设备条码 */
+function handleBarcode() {
+  if (!formData.value?.id) {
+    return;
+  }
+  barcodeDetailRef.value?.openByBusiness(
+    formData.value.id,
+    BarcodeBizTypeEnum.MACHINERY,
+    formData.value.code,
+    formData.value.name,
+  );
+}
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    if (isDetail.value) {
+      await modalApi.close();
+      return;
+    }
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    const data = (await formApi.getValues()) as MesDvMachineryApi.Machinery;
+    try {
+      await (data.id ? updateMachinery(data) : createMachinery(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();
+    subTabsName.value = 'check';
+    // 加载数据
+    const data = modalApi.getData<{ id?: number; type?: FormMode }>();
+    formMode.value = data?.type || 'create';
+    formApi.setDisabled(formMode.value === 'detail');
+    modalApi.setState({ showConfirmButton: formMode.value !== 'detail' });
+    if (!data?.id) {
+      return;
+    }
+    modalApi.lock();
+    try {
+      formData.value = await getMachinery(data.id);
+      // 设置到 values
+      await formApi.setValues(formData.value);
+    } finally {
+      modalApi.unlock();
+    }
+  },
+});
+</script>
+
+<template>
+  <Modal :title="getTitle" class="w-4/5">
+    <Form class="mx-4" />
+    <Tabs
+      v-if="formMode !== 'create' && formData?.id"
+      v-model:active-key="subTabsName"
+      class="mx-4 mt-4"
+    >
+      <Tabs.TabPane key="check" tab="点检记录">
+        <CheckRecordList :machinery-id="formData.id" />
+      </Tabs.TabPane>
+      <Tabs.TabPane key="mainten" tab="保养记录">
+        <MaintenRecordList :machinery-id="formData.id" />
+      </Tabs.TabPane>
+      <Tabs.TabPane key="repair" tab="维修记录">
+        <RepairList :machinery-id="formData.id" />
+      </Tabs.TabPane>
+    </Tabs>
+    <template #prepend-footer>
+      <div class="flex flex-auto items-center">
+        <Button v-if="isDetail && formData?.id" type="primary" @click="handleBarcode">
+          查看条码
+        </Button>
+      </div>
+    </template>
+    <BarcodeDetail ref="barcodeDetailRef" />
+  </Modal>
+</template>
diff --git a/apps/web-antd/src/views/mes/dv/machinery/modules/import-form.vue b/apps/web-antd/src/views/mes/dv/machinery/modules/import-form.vue
new file mode 100644
index 000000000..3e9b01e42
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/machinery/modules/import-form.vue
@@ -0,0 +1,88 @@
+<script lang="ts" setup>
+import type { FileType } from 'ant-design-vue/es/upload/interface';
+
+import type { MesDvMachineryApi } from '#/api/mes/dv/machinery';
+
+import { useVbenModal } from '@vben/common-ui';
+import { downloadFileFromBlobPart } from '@vben/utils';
+
+import { Button, message, Upload } from 'ant-design-vue';
+
+import { useVbenForm } from '#/adapter/form';
+import { importMachinery, importMachineryTemplate } from '#/api/mes/dv/machinery';
+import { $t } from '#/locales';
+
+import { useImportFormSchema } from '../data';
+
+const emit = defineEmits(['success']);
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-2',
+    labelWidth: 120,
+  },
+  layout: 'horizontal',
+  schema: useImportFormSchema(),
+  showDefaultActions: false,
+});
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    const data = await formApi.getValues();
+    try {
+      const result = await importMachinery(data.file, data.updateSupport);
+      const importData = result as MesDvMachineryApi.MachineryImportRespVO;
+      let text = `上传成功数量：${importData.createCodes?.length || 0}；`;
+      text += `更新成功数量：${importData.updateCodes?.length || 0}；`;
+      text += `更新失败数量：${Object.keys(importData.failureCodes || {}).length}；`;
+      message.info(text);
+      // 关闭并提示
+      await modalApi.close();
+      emit('success');
+      message.success($t('ui.actionMessage.operationSuccess'));
+    } finally {
+      modalApi.unlock();
+    }
+  },
+});
+
+/** 上传前 */
+function beforeUpload(file: FileType) {
+  formApi.setFieldValue('file', file);
+  return false;
+}
+
+/** 下载模版 */
+async function handleDownload() {
+  const data = await importMachineryTemplate();
+  downloadFileFromBlobPart({ fileName: '设备导入模板.xls', source: data });
+}
+</script>
+
+<template>
+  <Modal :title="$t('ui.actionTitle.import', ['设备'])" class="w-1/3">
+    <Form class="mx-4">
+      <template #file>
+        <div class="w-full">
+          <Upload :before-upload="beforeUpload" :max-count="1" accept=".xls,.xlsx">
+            <Button type="primary">选择 Excel 文件</Button>
+          </Upload>
+        </div>
+      </template>
+    </Form>
+    <template #prepend-footer>
+      <div class="flex flex-auto items-center">
+        <Button @click="handleDownload">下载导入模板</Button>
+      </div>
+    </template>
+  </Modal>
+</template>
diff --git a/apps/web-antd/src/views/mes/dv/machinery/modules/mainten-record-list.vue b/apps/web-antd/src/views/mes/dv/machinery/modules/mainten-record-list.vue
new file mode 100644
index 000000000..3a8f2e656
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/machinery/modules/mainten-record-list.vue
@@ -0,0 +1,73 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvMaintenRecordApi } from '#/api/mes/dv/maintenrecord';
+
+import { watch } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { getMaintenRecordPage } from '#/api/mes/dv/maintenrecord';
+
+const props = defineProps<{ machineryId: number }>();
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    columns: [
+      { field: 'planName', title: '计划名称', minWidth: 150 },
+      {
+        field: 'planCycleType',
+        title: '周期类型',
+        width: 120,
+        cellRender: {
+          name: 'CellDict',
+          props: { type: DICT_TYPE.MES_DV_CYCLE_TYPE },
+        },
+      },
+      { field: 'maintenTime', title: '保养时间', width: 180, formatter: 'formatDateTime' },
+      { field: 'nickname', title: '操作人', minWidth: 120 },
+      {
+        field: 'status',
+        title: '状态',
+        width: 120,
+        cellRender: {
+          name: 'CellDict',
+          props: { type: DICT_TYPE.MES_MAINTEN_RECORD_STATUS },
+        },
+      },
+    ],
+    height: 320,
+    keepSource: true,
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }) =>
+          await getMaintenRecordPage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            machineryId: props.machineryId,
+          }),
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+    },
+  } as VxeTableGridOptions<MesDvMaintenRecordApi.MaintenRecord>,
+});
+
+watch(
+  () => props.machineryId,
+  (value) => {
+    if (value) {
+      gridApi.query();
+    }
+  },
+);
+</script>
+
+<template>
+  <Grid table-title="保养记录" />
+</template>
diff --git a/apps/web-antd/src/views/mes/dv/machinery/modules/repair-list.vue b/apps/web-antd/src/views/mes/dv/machinery/modules/repair-list.vue
new file mode 100644
index 000000000..efed48449
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/machinery/modules/repair-list.vue
@@ -0,0 +1,74 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvRepairApi } from '#/api/mes/dv/repair';
+
+import { watch } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { getRepairPage } from '#/api/mes/dv/repair';
+
+const props = defineProps<{ machineryId: number }>();
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    columns: [
+      { field: 'code', title: '维修单号', minWidth: 140 },
+      { field: 'name', title: '维修单名称', minWidth: 150 },
+      {
+        field: 'result',
+        title: '维修结果',
+        width: 120,
+        cellRender: {
+          name: 'CellDict',
+          props: { type: DICT_TYPE.MES_DV_REPAIR_RESULT },
+        },
+      },
+      { field: 'requireDate', title: '报修日期', width: 180, formatter: 'formatDateTime' },
+      { field: 'nickname', title: '操作人', minWidth: 120 },
+      {
+        field: 'status',
+        title: '状态',
+        width: 120,
+        cellRender: {
+          name: 'CellDict',
+          props: { type: DICT_TYPE.MES_DV_REPAIR_STATUS },
+        },
+      },
+    ],
+    height: 320,
+    keepSource: true,
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }) =>
+          await getRepairPage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            machineryId: props.machineryId,
+          }),
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+    },
+  } as VxeTableGridOptions<MesDvRepairApi.Repair>,
+});
+
+watch(
+  () => props.machineryId,
+  (value) => {
+    if (value) {
+      gridApi.query();
+    }
+  },
+);
+</script>
+
+<template>
+  <Grid table-title="维修记录" />
+</template>
diff --git a/apps/web-antd/src/views/mes/dv/machinery/type/components/dv-machinery-type-select.vue b/apps/web-antd/src/views/mes/dv/machinery/type/components/dv-machinery-type-select.vue
new file mode 100644
index 000000000..2a5208428
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/machinery/type/components/dv-machinery-type-select.vue
@@ -0,0 +1,112 @@
+<script lang="ts" setup>
+import type { MesDvMachineryTypeApi } from '#/api/mes/dv/machinery/type';
+
+import { computed, onMounted, ref, watch } from 'vue';
+
+import { handleTree } from '@vben/utils';
+
+import { Tooltip, TreeSelect } from 'ant-design-vue';
+
+import { getMachineryTypeSimpleList } from '#/api/mes/dv/machinery/type';
+
+const props = withDefaults(
+  defineProps<{
+    allowClear?: boolean;
+    disabled?: boolean;
+    modelValue?: number;
+    placeholder?: string;
+  }>(),
+  {
+    allowClear: true,
+    disabled: false,
+    modelValue: undefined,
+    placeholder: '请选择设备类型',
+  },
+);
+
+const emit = defineEmits<{
+  change: [item: MesDvMachineryTypeApi.MachineryType | undefined];
+  'update:modelValue': [value: number | undefined];
+}>();
+
+type MachineryTypeNode = MesDvMachineryTypeApi.MachineryType & {
+  children?: MachineryTypeNode[];
+  disabled?: boolean;
+};
+
+const allList = ref<MesDvMachineryTypeApi.MachineryType[]>([]); // 设备类型列表
+const machineryTypeTree = ref<MachineryTypeNode[]>([]); // 设备类型树
+const selectedItem = ref<MesDvMachineryTypeApi.MachineryType>(); // 选中设备类型
+
+const selectValue = computed({
+  // 选择器绑定值
+  get: () => props.modelValue,
+  set: (value: number | undefined) => {
+    emit('update:modelValue', value);
+  },
+});
+
+/** 递归将有子节点的分支节点标记为 disabled */
+function markParentsDisabled(nodes: MesDvMachineryTypeApi.MachineryType[]): MachineryTypeNode[] {
+  return nodes.map((node) => {
+    const children = node.children?.length ? markParentsDisabled(node.children) : undefined;
+    return { ...node, children, disabled: Boolean(children?.length) };
+  });
+}
+
+/** 根据当前值同步 tooltip 展示的设备类型详情 */
+function syncSelectedItem(value: number | undefined) {
+  selectedItem.value =
+    value === undefined ? undefined : allList.value.find((item) => item.id === value);
+}
+
+/** 除 v-model 外，额外抛出完整设备类型对象给业务表单使用 */
+function handleChange(value: number | undefined) {
+  syncSelectedItem(value);
+  emit('change', selectedItem.value);
+}
+
+/** 查询设备类型树 */
+async function getMachineryTypeTree() {
+  allList.value = await getMachineryTypeSimpleList();
+  machineryTypeTree.value = markParentsDisabled(handleTree(allList.value));
+  syncSelectedItem(props.modelValue);
+}
+
+watch(
+  () => props.modelValue,
+  (value) => {
+    syncSelectedItem(value);
+  },
+);
+
+onMounted(() => {
+  getMachineryTypeTree();
+});
+</script>
+
+<template>
+  <Tooltip :mouse-enter-delay="0.5" :open="selectedItem ? undefined : false">
+    <template #title>
+      <div v-if="selectedItem" class="leading-6">
+        <div>编码：{{ selectedItem.code || '-' }}</div>
+        <div>名称：{{ selectedItem.name || '-' }}</div>
+        <div>备注：{{ selectedItem.remark || '-' }}</div>
+      </div>
+    </template>
+    <TreeSelect
+      v-bind="$attrs"
+      v-model:value="selectValue"
+      :allow-clear="allowClear"
+      :disabled="disabled"
+      :field-names="{ children: 'children', label: 'name', value: 'id' }"
+      :placeholder="placeholder"
+      :tree-data="machineryTypeTree"
+      class="w-full"
+      show-search
+      tree-default-expand-all
+      tree-node-filter-prop="name"
+      @change="handleChange"
+    />
+  </Tooltip>
+</template>
diff --git a/apps/web-antd/src/views/mes/dv/machinery/type/components/index.ts b/apps/web-antd/src/views/mes/dv/machinery/type/components/index.ts
new file mode 100644
index 000000000..c4cff7c14
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/machinery/type/components/index.ts
@@ -0,0 +1,2 @@
+export { default as DvMachineryTypeSelect } from './dv-machinery-type-select.vue';
+export { default as MachineryTypeTree } from './machinery-type-tree.vue';
diff --git a/apps/web-antd/src/views/mes/dv/machinery/type/components/machinery-type-tree.vue b/apps/web-antd/src/views/mes/dv/machinery/type/components/machinery-type-tree.vue
new file mode 100644
index 000000000..46b8e7f35
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/machinery/type/components/machinery-type-tree.vue
@@ -0,0 +1,94 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvMachineryTypeApi } from '#/api/mes/dv/machinery/type';
+
+import { ref } from 'vue';
+
+import { CommonStatusEnum } from '@vben/constants';
+import { handleTree } from '@vben/utils';
+
+import { Card, Input } from 'ant-design-vue';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { getMachineryTypeList } from '#/api/mes/dv/machinery/type';
+
+const emit = defineEmits<{
+  nodeClick: [row?: MesDvMachineryTypeApi.MachineryType];
+}>();
+const selectedId = ref<number>(); // 选中设备类型编号
+const searchKeyword = ref(''); // 设备类型搜索关键字
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    autoResize: true,
+    border: false,
+    columns: [{ field: 'name', title: '类型名称', treeNode: true }],
+    height: 'auto',
+    pagerConfig: {
+      enabled: false,
+    },
+    proxyConfig: {
+      ajax: {
+        query: async () =>
+          handleTree(
+            await getMachineryTypeList({
+              name: searchKeyword.value || undefined,
+              status: CommonStatusEnum.ENABLE,
+            }),
+          ),
+      },
+    },
+    rowConfig: {
+      isCurrent: true,
+      isHover: true,
+      keyField: 'id',
+    },
+    showHeader: false,
+    toolbarConfig: {
+      enabled: false,
+    },
+    treeConfig: { parentField: 'parentId', rowField: 'id', transform: true },
+  } as VxeTableGridOptions<MesDvMachineryTypeApi.MachineryType>,
+  gridEvents: {
+    cellClick: ({ row }: { row: MesDvMachineryTypeApi.MachineryType }) => {
+      if (selectedId.value === row.id) {
+        selectedId.value = undefined;
+        gridApi.grid.clearCurrentRow();
+        emit('nodeClick', undefined);
+        return;
+      }
+      selectedId.value = row.id;
+      emit('nodeClick', row);
+    },
+  },
+});
+
+/** 重置选中状态 */
+function reset() {
+  selectedId.value = undefined;
+  searchKeyword.value = '';
+  gridApi.grid.clearCurrentRow();
+  emit('nodeClick', undefined);
+  gridApi.query();
+}
+
+/** 搜索设备类型 */
+function handleSearch() {
+  gridApi.query();
+}
+
+defineExpose({ reset });
+</script>
+
+<template>
+  <Card class="h-full" size="small" title="设备类型">
+    <Input
+      v-model:value="searchKeyword"
+      allow-clear
+      class="mb-3"
+      placeholder="搜索设备类型"
+      @change="handleSearch"
+    />
+    <Grid class="h-full" />
+  </Card>
+</template>
diff --git a/apps/web-antd/src/views/mes/dv/machinery/type/data.ts b/apps/web-antd/src/views/mes/dv/machinery/type/data.ts
new file mode 100644
index 000000000..c7342e875
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/machinery/type/data.ts
@@ -0,0 +1,172 @@
+import type { VbenFormApi, VbenFormSchema } from '#/adapter/form';
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvMachineryTypeApi } from '#/api/mes/dv/machinery/type';
+
+import { h } from 'vue';
+
+import { CommonStatusEnum, DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+import { handleTree } from '@vben/utils';
+
+import { Button } from 'ant-design-vue';
+
+import { z } from '#/adapter/form';
+import { getMachineryTypeList } from '#/api/mes/dv/machinery/type';
+import { generateAutoCode } from '#/api/mes/md/autocode/record';
+import { MesAutoCodeRuleCode } from '#/views/mes/utils/constants';
+
+/** 新增/修改设备类型的表单 */
+export function useFormSchema(formApi?: VbenFormApi): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'parentId',
+      label: '上级类型',
+      component: 'ApiTreeSelect',
+      componentProps: {
+        allowClear: true,
+        api: async () => [
+          { id: 0, name: '顶级类型', children: handleTree(await getMachineryTypeList()) },
+        ],
+        childrenField: 'children',
+        labelField: 'name',
+        placeholder: '请选择上级类型',
+        treeDefaultExpandAll: true,
+        treeNodeFilterProp: 'name',
+        valueField: 'id',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'code',
+      label: '类型编码',
+      component: 'Input',
+      componentProps: {
+        maxLength: 64,
+        placeholder: '请输入类型编码',
+      },
+      rules: z.string().min(1, '类型编码不能为空').max(64),
+      suffix: () =>
+        h(
+          Button,
+          {
+            type: 'default',
+            onClick: async () => {
+              try {
+                const code = await generateAutoCode(MesAutoCodeRuleCode.DV_MACHINERY_TYPE_CODE);
+                await formApi?.setFieldValue('code', code);
+              } catch (error) {
+                console.error(error);
+              }
+            },
+          },
+          { default: () => '生成' },
+        ),
+    },
+    {
+      fieldName: 'name',
+      label: '类型名称',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入类型名称',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'sort',
+      label: '显示排序',
+      component: 'InputNumber',
+      componentProps: {
+        class: '!w-full',
+        min: 0,
+        precision: 0,
+      },
+      rules: z.number().default(0),
+    },
+    {
+      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: '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<MesDvMachineryTypeApi.MachineryType>['columns'] {
+  return [
+    { field: 'name', title: '类型名称', minWidth: 200, align: 'left', treeNode: true },
+    { field: 'code', title: '类型编码', width: 160, align: 'center' },
+    { field: 'sort', title: '排序', width: 100, align: 'center' },
+    {
+      field: 'status',
+      title: '状态',
+      width: 120,
+      align: 'center',
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.COMMON_STATUS },
+      },
+    },
+    {
+      field: 'createTime',
+      title: '创建时间',
+      width: 180,
+      formatter: 'formatDateTime',
+    },
+    {
+      title: '操作',
+      width: 260,
+      fixed: 'right',
+      slots: {
+        default: 'actions',
+      },
+    },
+  ];
+}
diff --git a/apps/web-antd/src/views/mes/dv/machinery/type/index.vue b/apps/web-antd/src/views/mes/dv/machinery/type/index.vue
new file mode 100644
index 000000000..bcb0c6d1f
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/machinery/type/index.vue
@@ -0,0 +1,161 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvMachineryTypeApi } from '#/api/mes/dv/machinery/type';
+
+import { ref } from 'vue';
+
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
+import { handleTree } from '@vben/utils';
+
+import { message } from 'ant-design-vue';
+
+import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import { deleteMachineryType, getMachineryTypeList } from '#/api/mes/dv/machinery/type';
+import { $t } from '#/locales';
+
+import { useGridColumns, useGridFormSchema } from './data';
+import Form from './modules/form.vue';
+
+const [FormModal, formModalApi] = useVbenModal({
+  connectedComponent: Form,
+  destroyOnClose: true,
+});
+
+const isExpanded = ref(true); // 树形表格是否展开
+
+/** 切换树形展开/收缩状态 */
+function handleExpand() {
+  isExpanded.value = !isExpanded.value;
+  gridApi.grid.setAllTreeExpand(isExpanded.value);
+}
+
+/** 刷新表格 */
+function handleRefresh() {
+  gridApi.query();
+}
+
+/** 创建设备类型 */
+function handleCreate() {
+  formModalApi.setData(null).open();
+}
+
+/** 添加下级设备类型 */
+function handleAppend(row: MesDvMachineryTypeApi.MachineryType) {
+  formModalApi.setData({ parentId: row.id }).open();
+}
+
+/** 编辑设备类型 */
+function handleEdit(row: MesDvMachineryTypeApi.MachineryType) {
+  formModalApi.setData(row).open();
+}
+
+/** 删除设备类型 */
+async function handleDelete(row: MesDvMachineryTypeApi.MachineryType) {
+  const hideLoading = message.loading({
+    content: $t('ui.actionMessage.deleting', [row.name]),
+    duration: 0,
+  });
+  try {
+    await deleteMachineryType(row.id!);
+    message.success($t('ui.actionMessage.deleteSuccess', [row.name]));
+    handleRefresh();
+  } finally {
+    hideLoading();
+  }
+}
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  formOptions: {
+    schema: useGridFormSchema(),
+  },
+  gridOptions: {
+    columns: useGridColumns(),
+    height: 'auto',
+    keepSource: true,
+    pagerConfig: {
+      enabled: false,
+    },
+    proxyConfig: {
+      ajax: { query: async (_, formValues) => handleTree(await getMachineryTypeList(formValues)) },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+    treeConfig: {
+      parentField: 'parentId',
+      rowField: 'id',
+      transform: true,
+      expandAll: true,
+      reserve: true,
+    },
+  } as VxeTableGridOptions<MesDvMachineryTypeApi.MachineryType>,
+});
+</script>
+
+<template>
+  <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【设备】设备类型、设备台账"
+        url="https://doc.iocoder.cn/mes/dv/device/"
+      />
+    </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:dv-machinery-type:create'],
+              onClick: handleCreate,
+            },
+            {
+              label: isExpanded ? '收缩' : '展开',
+              type: 'primary',
+              onClick: handleExpand,
+            },
+          ]"
+        />
+      </template>
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: $t('ui.actionTitle.create', ['下级']),
+              type: 'link',
+              icon: ACTION_ICON.ADD,
+              auth: ['mes:dv-machinery-type:create'],
+              onClick: handleAppend.bind(null, row),
+            },
+            {
+              label: $t('common.edit'),
+              type: 'link',
+              icon: ACTION_ICON.EDIT,
+              auth: ['mes:dv-machinery-type:update'],
+              onClick: handleEdit.bind(null, row),
+            },
+            {
+              label: $t('common.delete'),
+              type: 'link',
+              danger: true,
+              icon: ACTION_ICON.DELETE,
+              auth: ['mes:dv-machinery-type: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/dv/machinery/type/modules/form.vue b/apps/web-antd/src/views/mes/dv/machinery/type/modules/form.vue
new file mode 100644
index 000000000..bf17aed85
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/machinery/type/modules/form.vue
@@ -0,0 +1,97 @@
+<script lang="ts" setup>
+import type { MesDvMachineryTypeApi } from '#/api/mes/dv/machinery/type';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { message } from 'ant-design-vue';
+
+import { useVbenForm } from '#/adapter/form';
+import {
+  createMachineryType,
+  getMachineryType,
+  updateMachineryType,
+} from '#/api/mes/dv/machinery/type';
+import { $t } from '#/locales';
+
+import { useFormSchema } from '../data';
+
+const emit = defineEmits(['success']);
+const formData = ref<MesDvMachineryTypeApi.MachineryType>();
+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: 100,
+  },
+  layout: 'horizontal',
+  schema: [],
+  showDefaultActions: false,
+});
+
+/** 表单 schema 需要 formApi 引用，所以通过 setState 设置 schema */
+formApi.setState({ schema: useFormSchema(formApi) });
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    const data = (await formApi.getValues()) as MesDvMachineryTypeApi.MachineryType;
+    try {
+      await (formData.value?.id
+        ? updateMachineryType(data)
+        : createMachineryType(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<MesDvMachineryTypeApi.MachineryType>();
+    if (!data || !data.id) {
+      formData.value = data || undefined;
+      if (data) {
+        // 设置上级类型
+        await formApi.setValues(data);
+      }
+      return;
+    }
+    modalApi.lock();
+    try {
+      formData.value = await getMachineryType(data.id);
+      // 设置到 values
+      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/dv/maintenrecord/data.ts b/apps/web-antd/src/views/mes/dv/maintenrecord/data.ts
new file mode 100644
index 000000000..56368a6b4
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/maintenrecord/data.ts
@@ -0,0 +1,165 @@
+import type { VbenFormSchema } from '#/adapter/form';
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvMaintenRecordApi } from '#/api/mes/dv/maintenrecord';
+
+import { markRaw } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
+import { getSimpleUserList } from '#/api/system/user';
+import { getRangePickerDefaultProps } from '#/utils';
+import { DvCheckPlanSelect } from '#/views/mes/dv/checkplan/components';
+import { DvMachinerySelect } from '#/views/mes/dv/machinery/components';
+import {
+  MesDvCheckPlanStatusEnum,
+  MesDvMaintenRecordStatusEnum,
+  MesDvSubjectTypeEnum,
+} from '#/views/mes/utils/constants';
+
+/** 新增/修改保养记录的表单 */
+export function useFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'status',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+      defaultValue: MesDvMaintenRecordStatusEnum.PREPARE,
+    },
+    {
+      fieldName: 'machineryId',
+      label: '设备',
+      component: markRaw(DvMachinerySelect),
+      componentProps: {
+        placeholder: '请选择设备',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'planId',
+      label: '保养计划',
+      component: markRaw(DvCheckPlanSelect),
+      componentProps: {
+        status: MesDvCheckPlanStatusEnum.ENABLED,
+        type: MesDvSubjectTypeEnum.MAINTENANCE,
+        placeholder: '请选择计划',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'userId',
+      label: '保养人',
+      component: 'ApiSelect',
+      componentProps: {
+        allowClear: true,
+        api: getSimpleUserList,
+        labelField: 'nickname',
+        placeholder: '请选择保养人',
+        valueField: 'id',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'maintenTime',
+      label: '保养时间',
+      component: 'DatePicker',
+      componentProps: {
+        format: 'YYYY-MM-DD HH:mm:ss',
+        placeholder: '请选择保养时间',
+        showTime: true,
+        valueFormat: 'x',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      formItemClass: 'col-span-3',
+      componentProps: {
+        placeholder: '请输入备注',
+        rows: 3,
+      },
+    },
+  ];
+}
+
+/** 列表的搜索表单 */
+export function useGridFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'machineryName',
+      label: '设备名称',
+      component: 'Input',
+      componentProps: {
+        allowClear: true,
+        placeholder: '请输入设备名称',
+      },
+    },
+    {
+      fieldName: 'maintenTime',
+      label: '保养时间',
+      component: 'RangePicker',
+      componentProps: {
+        ...getRangePickerDefaultProps(),
+      },
+    },
+    {
+      fieldName: 'status',
+      label: '状态',
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: getDictOptions(DICT_TYPE.MES_MAINTEN_RECORD_STATUS, 'number'),
+        placeholder: '请选择状态',
+      },
+    },
+  ];
+}
+
+/** 列表的字段 */
+export function useGridColumns(): VxeTableGridOptions<MesDvMaintenRecordApi.MaintenRecord>['columns'] {
+  return [
+    { field: 'machineryCode', title: '设备编码', minWidth: 140 },
+    {
+      field: 'machineryName',
+      title: '设备名称',
+      minWidth: 150,
+      slots: {
+        default: 'machineryName',
+      },
+    },
+    { field: 'planName', title: '计划名称', minWidth: 150 },
+    { field: 'maintenTime', title: '保养时间', width: 180, formatter: 'formatDateTime' },
+    { field: 'nickname', title: '保养人', minWidth: 120 },
+    {
+      field: 'status',
+      title: '状态',
+      width: 120,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_MAINTEN_RECORD_STATUS },
+      },
+    },
+    { field: 'createTime', title: '创建时间', width: 180, formatter: 'formatDateTime' },
+    {
+      title: '操作',
+      width: 200,
+      fixed: 'right',
+      slots: {
+        default: 'actions',
+      },
+    },
+  ];
+}
diff --git a/apps/web-antd/src/views/mes/dv/maintenrecord/index.vue b/apps/web-antd/src/views/mes/dv/maintenrecord/index.vue
new file mode 100644
index 000000000..3aa1f4e5f
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/maintenrecord/index.vue
@@ -0,0 +1,165 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvMaintenRecordApi } from '#/api/mes/dv/maintenrecord';
+
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
+import { downloadFileFromBlobPart } from '@vben/utils';
+
+import { Button, message } from 'ant-design-vue';
+
+import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import {
+  deleteMaintenRecord,
+  exportMaintenRecord,
+  getMaintenRecordPage,
+} from '#/api/mes/dv/maintenrecord';
+import { $t } from '#/locales';
+import { MesDvMaintenRecordStatusEnum } from '#/views/mes/utils/constants';
+
+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({ type: 'create' }).open();
+}
+
+/** 查看保养记录 */
+function handleDetail(row: MesDvMaintenRecordApi.MaintenRecord) {
+  formModalApi.setData({ id: row.id, type: 'detail' }).open();
+}
+
+/** 编辑保养记录 */
+function handleEdit(row: MesDvMaintenRecordApi.MaintenRecord) {
+  formModalApi.setData({ id: row.id, type: 'update' }).open();
+}
+
+/** 删除保养记录 */
+async function handleDelete(row: MesDvMaintenRecordApi.MaintenRecord) {
+  const hideLoading = message.loading({
+    content: $t('ui.actionMessage.deleting', [row.machineryName]),
+    duration: 0,
+  });
+  try {
+    await deleteMaintenRecord(row.id!);
+    message.success($t('ui.actionMessage.deleteSuccess', [row.machineryName]));
+    handleRefresh();
+  } finally {
+    hideLoading();
+  }
+}
+
+/** 导出保养记录 */
+async function handleExport() {
+  const data = await exportMaintenRecord(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) =>
+          await getMaintenRecordPage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            ...formValues,
+          }),
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+  } as VxeTableGridOptions<MesDvMaintenRecordApi.MaintenRecord>,
+});
+</script>
+<template>
+  <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【设备】点检记录、保养记录、维修单"
+        url="https://doc.iocoder.cn/mes/dv/check-record/"
+      />
+    </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:dv-mainten-record:create'],
+              onClick: handleCreate,
+            },
+            {
+              label: $t('ui.actionTitle.export'),
+              type: 'primary',
+              icon: ACTION_ICON.DOWNLOAD,
+              auth: ['mes:dv-mainten-record:export'],
+              onClick: handleExport,
+            },
+          ]"
+        />
+      </template>
+      <template #machineryName="{ row }">
+        <Button type="link" @click="handleDetail(row)">{{ row.machineryName }}</Button>
+      </template>
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: $t('common.edit'),
+              type: 'link',
+              icon: ACTION_ICON.EDIT,
+              auth: ['mes:dv-mainten-record:update'],
+              onClick: handleEdit.bind(null, row),
+              ifShow: row.status === MesDvMaintenRecordStatusEnum.PREPARE,
+            },
+            {
+              label: $t('common.delete'),
+              type: 'link',
+              danger: true,
+              icon: ACTION_ICON.DELETE,
+              auth: ['mes:dv-mainten-record:delete'],
+              popConfirm: {
+                title: $t('ui.actionMessage.deleteConfirm', [row.machineryName]),
+                confirm: handleDelete.bind(null, row),
+              },
+              ifShow: row.status === MesDvMaintenRecordStatusEnum.PREPARE,
+            },
+            {
+              label: $t('common.detail'),
+              type: 'link',
+              icon: ACTION_ICON.VIEW,
+              auth: ['mes:dv-mainten-record:query'],
+              onClick: handleDetail.bind(null, row),
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+  </Page>
+</template>
diff --git a/apps/web-antd/src/views/mes/dv/maintenrecord/modules/form.vue b/apps/web-antd/src/views/mes/dv/maintenrecord/modules/form.vue
new file mode 100644
index 000000000..e2f445119
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/maintenrecord/modules/form.vue
@@ -0,0 +1,150 @@
+<script lang="ts" setup>
+import type { MesDvMaintenRecordApi } from '#/api/mes/dv/maintenrecord';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+import { useUserStore } from '@vben/stores';
+
+import { Button, message, Popconfirm } from 'ant-design-vue';
+
+import { useVbenForm } from '#/adapter/form';
+import {
+  createMaintenRecord,
+  getMaintenRecord,
+  submitMaintenRecord,
+  updateMaintenRecord,
+} from '#/api/mes/dv/maintenrecord';
+import { $t } from '#/locales';
+import { MesDvMaintenRecordStatusEnum } from '#/views/mes/utils/constants';
+
+import { useFormSchema } from '../data';
+import LineList from './line-list.vue';
+
+type FormMode = 'create' | 'detail' | 'update';
+
+const emit = defineEmits(['success']);
+const userStore = useUserStore();
+const formMode = ref<FormMode>('create');
+const formData = ref<MesDvMaintenRecordApi.MaintenRecord>();
+const isDetail = computed(() => formMode.value === 'detail');
+const canSubmit = computed(
+  () =>
+    formMode.value === 'update' && formData.value?.status === MesDvMaintenRecordStatusEnum.PREPARE,
+);
+const getTitle = computed(() => {
+  if (formMode.value === 'detail') {
+    return '查看保养记录';
+  }
+  return formMode.value === 'update' ? '修改保养记录' : '新增保养记录';
+});
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-1',
+    labelWidth: 100,
+  },
+  wrapperClass: 'grid-cols-3',
+  layout: 'horizontal',
+  schema: useFormSchema(),
+  showDefaultActions: false,
+});
+
+/** 提交保养记录 */
+async function handleSubmit() {
+  const { valid } = await formApi.validate();
+  if (!valid || !formData.value?.id) {
+    return;
+  }
+
+  modalApi.lock();
+  try {
+    await updateMaintenRecord((await formApi.getValues()) as MesDvMaintenRecordApi.MaintenRecord);
+    await submitMaintenRecord(formData.value.id);
+    await modalApi.close();
+    emit('success');
+    message.success('提交成功');
+  } finally {
+    modalApi.unlock();
+  }
+}
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    if (isDetail.value) {
+      await modalApi.close();
+      return;
+    }
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    const data = (await formApi.getValues()) as MesDvMaintenRecordApi.MaintenRecord;
+    try {
+      if (formMode.value === 'create') {
+        const id = await createMaintenRecord(data);
+        formData.value = {
+          ...data,
+          id: id as number,
+          status: MesDvMaintenRecordStatusEnum.PREPARE,
+        };
+        await formApi.setFieldValue('id', id);
+        formMode.value = 'update';
+      } else {
+        await updateMaintenRecord(data);
+        formData.value = { ...formData.value, ...data };
+      }
+      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; type?: FormMode }>();
+    formMode.value = data?.type || 'create';
+    formApi.setDisabled(formMode.value === 'detail');
+    modalApi.setState({ showConfirmButton: formMode.value !== 'detail' });
+    if (!data?.id) {
+      await formApi.setFieldValue('userId', userStore.userInfo?.id);
+      return;
+    }
+    modalApi.lock();
+    try {
+      formData.value = await getMaintenRecord(data.id);
+      // 设置到 values
+      await formApi.setValues(formData.value);
+    } finally {
+      modalApi.unlock();
+    }
+  },
+});
+</script>
+<template>
+  <Modal :title="getTitle" class="w-4/5">
+    <Form class="mx-4" />
+    <LineList v-if="formData?.id" :disabled="isDetail" :record-id="formData.id" />
+    <template #prepend-footer>
+      <div class="flex flex-auto items-center">
+        <Popconfirm
+          v-if="canSubmit"
+          title="确认提交该保养记录？提交后将不能修改。"
+          @confirm="handleSubmit"
+        >
+          <Button type="primary">提交</Button>
+        </Popconfirm>
+      </div>
+    </template>
+  </Modal>
+</template>
diff --git a/apps/web-antd/src/views/mes/dv/maintenrecord/modules/line-list.vue b/apps/web-antd/src/views/mes/dv/maintenrecord/modules/line-list.vue
new file mode 100644
index 000000000..c8969bcb9
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/maintenrecord/modules/line-list.vue
@@ -0,0 +1,235 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvMaintenRecordLineApi } from '#/api/mes/dv/maintenrecord/line';
+
+import { computed, ref, watch } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
+import { message, Modal } from 'ant-design-vue';
+
+import { useVbenForm } from '#/adapter/form';
+import { TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import {
+  createMaintenRecordLine,
+  deleteMaintenRecordLine,
+  getMaintenRecordLine,
+  getMaintenRecordLinePage,
+  updateMaintenRecordLine,
+} from '#/api/mes/dv/maintenrecord/line';
+import { $t } from '#/locales';
+import { DvSubjectSelect } from '#/views/mes/dv/subject/components';
+import { MesDvMaintenStatusEnum, MesDvSubjectTypeEnum } from '#/views/mes/utils/constants';
+
+const props = defineProps<{ disabled?: boolean; recordId: number }>();
+const formOpen = ref(false);
+const formLoading = ref(false);
+const lineFormType = ref<'create' | 'update'>('create');
+const formTitle = computed(() => (lineFormType.value === 'create' ? '添加明细' : '修改明细'));
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-2',
+    labelWidth: 90,
+  },
+  layout: 'horizontal',
+  schema: [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'recordId',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'subjectId',
+      label: '项目',
+      component: DvSubjectSelect,
+      componentProps: {
+        type: MesDvSubjectTypeEnum.MAINTENANCE,
+        placeholder: '请选择项目',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'status',
+      label: '结果',
+      component: 'RadioGroup',
+      componentProps: {
+        buttonStyle: 'solid',
+        optionType: 'button',
+        options: getDictOptions(DICT_TYPE.MES_MAINTEN_STATUS, 'number'),
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'result',
+      label: '异常描述',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入异常描述',
+        rows: 3,
+      },
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入备注',
+        rows: 2,
+      },
+    },
+  ],
+  showDefaultActions: false,
+});
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    columns: [
+      { field: 'subjectName', title: '项目名称', minWidth: 150 },
+      { field: 'subjectContent', title: '项目内容', minWidth: 160 },
+      { field: 'subjectStandard', title: '项目标准', minWidth: 160 },
+      {
+        field: 'status',
+        title: '结果',
+        width: 120,
+        cellRender: {
+          name: 'CellDict',
+          props: { type: DICT_TYPE.MES_MAINTEN_STATUS },
+        },
+      },
+      { field: 'result', title: '异常描述', minWidth: 160 },
+      {
+        title: '操作',
+        width: 130,
+        fixed: 'right',
+        slots: {
+          default: 'actions',
+        },
+        visible: !props.disabled,
+      },
+    ],
+    height: 320,
+    keepSource: true,
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }) =>
+          await getMaintenRecordLinePage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            recordId: props.recordId,
+          }),
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+    },
+  } as VxeTableGridOptions<MesDvMaintenRecordLineApi.MaintenRecordLine>,
+});
+
+/** 打开保养明细表单 */
+async function openForm(
+  type: 'create' | 'update',
+  row?: MesDvMaintenRecordLineApi.MaintenRecordLine,
+) {
+  formOpen.value = true;
+  lineFormType.value = type;
+  await formApi.resetForm();
+  await formApi.setValues(
+    row
+      ? await getMaintenRecordLine(row.id!)
+      : {
+          recordId: props.recordId,
+          status: MesDvMaintenStatusEnum.NORMAL,
+          result: '',
+          remark: '',
+        },
+  );
+}
+
+/** 提交保养明细表单 */
+async function submitForm() {
+  const { valid } = await formApi.validate();
+  if (!valid) {
+    return;
+  }
+  formLoading.value = true;
+  try {
+    const data = (await formApi.getValues()) as MesDvMaintenRecordLineApi.MaintenRecordLine;
+    await (data.id ? updateMaintenRecordLine(data) : createMaintenRecordLine(data));
+    formOpen.value = false;
+    message.success($t('ui.actionMessage.operationSuccess'));
+    await gridApi.query();
+  } finally {
+    formLoading.value = false;
+  }
+}
+
+/** 删除保养明细 */
+async function handleDelete(id: number) {
+  await deleteMaintenRecordLine(id);
+  message.success($t('ui.actionMessage.deleteSuccess', ['明细']));
+  await gridApi.query();
+}
+watch(
+  () => props.recordId,
+  (value) => {
+    if (value) {
+      gridApi.query();
+    }
+  },
+);
+</script>
+<template>
+  <div class="mx-4 mt-4">
+    <div v-if="!disabled" class="mb-3">
+      <TableAction
+        :actions="[{ label: '添加明细', type: 'primary', onClick: openForm.bind(null, 'create') }]"
+      />
+    </div>
+    <Grid table-title="明细列表">
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            { label: '编辑', type: 'link', onClick: openForm.bind(null, 'update', row) },
+            {
+              label: '删除',
+              type: 'link',
+              danger: true,
+              popConfirm: {
+                title: '确认删除该明细吗？',
+                confirm: handleDelete.bind(null, row.id!),
+              },
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+    <Modal
+      v-model:open="formOpen"
+      :title="formTitle"
+      width="620px"
+      :confirm-loading="formLoading"
+      @ok="submitForm"
+    >
+      <Form class="mx-4" />
+    </Modal>
+  </div>
+</template>
diff --git a/apps/web-antd/src/views/mes/dv/repair/data.ts b/apps/web-antd/src/views/mes/dv/repair/data.ts
new file mode 100644
index 000000000..71029e5a1
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/repair/data.ts
@@ -0,0 +1,267 @@
+import type { VbenFormApi, VbenFormSchema } from '#/adapter/form';
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvRepairApi } from '#/api/mes/dv/repair';
+
+import { h, markRaw } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
+import { Button } from 'ant-design-vue';
+
+import { generateAutoCode } from '#/api/mes/md/autocode/record';
+import { getSimpleUserList } from '#/api/system/user';
+import { getRangePickerDefaultProps } from '#/utils';
+import { DvMachinerySelect } from '#/views/mes/dv/machinery/components';
+import { MesAutoCodeRuleCode, MesDvRepairStatusEnum } from '#/views/mes/utils/constants';
+/** 新增/修改维修工单的表单 */
+export function useFormSchema(formApi?: VbenFormApi): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'status',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+      defaultValue: MesDvRepairStatusEnum.PREPARE,
+    },
+    {
+      fieldName: 'code',
+      label: '维修单编码',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入维修单编码',
+      },
+      dependencies: {
+        triggerFields: ['id'],
+        componentProps: (values) => ({ disabled: !!values.id }),
+      },
+      rules: 'required',
+      suffix: () =>
+        h(
+          Button,
+          {
+            type: 'default',
+            onClick: async () => {
+              try {
+                const code = await generateAutoCode(MesAutoCodeRuleCode.DV_REPAIR_CODE);
+                await formApi?.setFieldValue('code', code);
+              } catch (error) {
+                console.error(error);
+              }
+            },
+          },
+          { default: () => '生成' },
+        ),
+    },
+    {
+      fieldName: 'name',
+      label: '维修单名称',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入维修单名称',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'machineryId',
+      label: '设备',
+      component: markRaw(DvMachinerySelect),
+      componentProps: {
+        placeholder: '请选择设备',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'requireDate',
+      label: '报修日期',
+      component: 'DatePicker',
+      componentProps: {
+        format: 'YYYY-MM-DD HH:mm:ss',
+        placeholder: '请选择报修日期',
+        showTime: true,
+        valueFormat: 'x',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'acceptedUserId',
+      label: '维修人',
+      component: 'ApiSelect',
+      componentProps: {
+        allowClear: true,
+        api: getSimpleUserList,
+        labelField: 'nickname',
+        placeholder: '请选择维修人',
+        valueField: 'id',
+      },
+    },
+    {
+      fieldName: 'finishDate',
+      label: '维修完成日期',
+      component: 'DatePicker',
+      componentProps: {
+        format: 'YYYY-MM-DD HH:mm:ss',
+        placeholder: '请选择完成日期',
+        showTime: true,
+        valueFormat: 'x',
+      },
+    },
+    {
+      fieldName: 'confirmUserId',
+      label: '验收人',
+      component: 'ApiSelect',
+      componentProps: {
+        allowClear: true,
+        api: getSimpleUserList,
+        labelField: 'nickname',
+        placeholder: '请选择验收人',
+        valueField: 'id',
+      },
+    },
+    {
+      fieldName: 'confirmDate',
+      label: '验收日期',
+      component: 'DatePicker',
+      componentProps: {
+        format: 'YYYY-MM-DD HH:mm:ss',
+        placeholder: '请选择验收日期',
+        showTime: true,
+        valueFormat: 'x',
+      },
+    },
+    {
+      fieldName: 'result',
+      label: '维修结果',
+      component: 'RadioGroup',
+      componentProps: {
+        buttonStyle: 'solid',
+        optionType: 'button',
+        options: getDictOptions(DICT_TYPE.MES_DV_REPAIR_RESULT, 'number'),
+      },
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      formItemClass: 'col-span-3',
+      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: 'machineryName',
+      label: '设备名称',
+      component: 'Input',
+      componentProps: {
+        allowClear: true,
+        placeholder: '请输入设备名称',
+      },
+    },
+    {
+      fieldName: 'requireDate',
+      label: '报修日期',
+      component: 'RangePicker',
+      componentProps: {
+        ...getRangePickerDefaultProps(),
+      },
+    },
+    {
+      fieldName: 'result',
+      label: '维修结果',
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: getDictOptions(DICT_TYPE.MES_DV_REPAIR_RESULT, 'number'),
+        placeholder: '请选择维修结果',
+      },
+    },
+    {
+      fieldName: 'status',
+      label: '状态',
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: getDictOptions(DICT_TYPE.MES_DV_REPAIR_STATUS, 'number'),
+        placeholder: '请选择状态',
+      },
+    },
+  ];
+}
+/** 列表的字段 */
+export function useGridColumns(): VxeTableGridOptions<MesDvRepairApi.Repair>['columns'] {
+  return [
+    {
+      field: 'code',
+      title: '维修单编码',
+      minWidth: 140,
+      slots: {
+        default: 'code',
+      },
+    },
+    { field: 'name', title: '维修单名称', minWidth: 150 },
+    { field: 'machineryName', title: '设备名称', minWidth: 150 },
+    { field: 'requireDate', title: '报修日期', width: 180, formatter: 'formatDateTime' },
+    { field: 'finishDate', title: '完成日期', width: 180, formatter: 'formatDateTime' },
+    {
+      field: 'result',
+      title: '维修结果',
+      width: 120,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_DV_REPAIR_RESULT },
+      },
+    },
+    {
+      field: 'status',
+      title: '状态',
+      width: 120,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_DV_REPAIR_STATUS },
+      },
+    },
+    { field: 'createTime', title: '创建时间', width: 180, formatter: 'formatDateTime' },
+    {
+      title: '操作',
+      width: 260,
+      fixed: 'right',
+      slots: {
+        default: 'actions',
+      },
+    },
+  ];
+}
diff --git a/apps/web-antd/src/views/mes/dv/repair/index.vue b/apps/web-antd/src/views/mes/dv/repair/index.vue
new file mode 100644
index 000000000..dc91fa735
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/repair/index.vue
@@ -0,0 +1,181 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvRepairApi } from '#/api/mes/dv/repair';
+
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
+import { downloadFileFromBlobPart } from '@vben/utils';
+
+import { Button, message } from 'ant-design-vue';
+
+import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import { deleteRepair, exportRepair, getRepairPage } from '#/api/mes/dv/repair';
+import { $t } from '#/locales';
+import { MesDvRepairStatusEnum } from '#/views/mes/utils/constants';
+
+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({ type: 'create' }).open();
+}
+
+/** 查看维修工单 */
+function handleDetail(row: MesDvRepairApi.Repair) {
+  formModalApi.setData({ id: row.id, type: 'detail' }).open();
+}
+
+/** 编辑维修工单 */
+function handleEdit(row: MesDvRepairApi.Repair) {
+  formModalApi.setData({ id: row.id, type: 'update' }).open();
+}
+
+/** 完成维修 */
+function handleConfirm(row: MesDvRepairApi.Repair) {
+  formModalApi.setData({ id: row.id, type: 'confirm' }).open();
+}
+
+/** 验收维修 */
+function handleFinish(row: MesDvRepairApi.Repair) {
+  formModalApi.setData({ id: row.id, type: 'finish' }).open();
+}
+
+/** 删除维修工单 */
+async function handleDelete(row: MesDvRepairApi.Repair) {
+  const hideLoading = message.loading({
+    content: $t('ui.actionMessage.deleting', [row.name]),
+    duration: 0,
+  });
+  try {
+    await deleteRepair(row.id!);
+    message.success($t('ui.actionMessage.deleteSuccess', [row.name]));
+    handleRefresh();
+  } finally {
+    hideLoading();
+  }
+}
+
+/** 导出维修工单 */
+async function handleExport() {
+  const data = await exportRepair(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) =>
+          await getRepairPage({ pageNo: page.currentPage, pageSize: page.pageSize, ...formValues }),
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+  } as VxeTableGridOptions<MesDvRepairApi.Repair>,
+});
+</script>
+<template>
+  <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【设备】点检记录、保养记录、维修单"
+        url="https://doc.iocoder.cn/mes/dv/check-record/"
+      />
+    </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:dv-repair:create'],
+              onClick: handleCreate,
+            },
+            {
+              label: $t('ui.actionTitle.export'),
+              type: 'primary',
+              icon: ACTION_ICON.DOWNLOAD,
+              auth: ['mes:dv-repair:export'],
+              onClick: handleExport,
+            },
+          ]"
+        />
+      </template>
+      <template #code="{ row }">
+        <Button type="link" @click="handleDetail(row)">{{ row.code }}</Button>
+      </template>
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: $t('common.edit'),
+              type: 'link',
+              icon: ACTION_ICON.EDIT,
+              auth: ['mes:dv-repair:update'],
+              ifShow: row.status === MesDvRepairStatusEnum.PREPARE,
+              onClick: handleEdit.bind(null, row),
+            },
+            {
+              label: $t('common.delete'),
+              type: 'link',
+              danger: true,
+              icon: ACTION_ICON.DELETE,
+              auth: ['mes:dv-repair:delete'],
+              ifShow: row.status === MesDvRepairStatusEnum.PREPARE,
+              popConfirm: {
+                title: $t('ui.actionMessage.deleteConfirm', [row.name]),
+                confirm: handleDelete.bind(null, row),
+              },
+            },
+            {
+              label: '完成维修',
+              type: 'link',
+              auth: ['mes:dv-repair:update'],
+              ifShow: row.status === MesDvRepairStatusEnum.CONFIRMED,
+              onClick: handleConfirm.bind(null, row),
+            },
+            {
+              label: '验收',
+              type: 'link',
+              auth: ['mes:dv-repair:update'],
+              ifShow: row.status === MesDvRepairStatusEnum.APPROVING,
+              onClick: handleFinish.bind(null, row),
+            },
+            {
+              label: $t('common.detail'),
+              type: 'link',
+              icon: ACTION_ICON.VIEW,
+              auth: ['mes:dv-repair:query'],
+              onClick: handleDetail.bind(null, row),
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+  </Page>
+</template>
diff --git a/apps/web-antd/src/views/mes/dv/repair/modules/form.vue b/apps/web-antd/src/views/mes/dv/repair/modules/form.vue
new file mode 100644
index 000000000..1914e68d2
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/repair/modules/form.vue
@@ -0,0 +1,224 @@
+<script lang="ts" setup>
+import type { MesDvRepairApi } from '#/api/mes/dv/repair';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { Button, message, Popconfirm } from 'ant-design-vue';
+
+import { useVbenForm } from '#/adapter/form';
+import {
+  confirmRepair,
+  createRepair,
+  finishRepair,
+  getRepair,
+  submitRepair,
+  updateRepair,
+} from '#/api/mes/dv/repair';
+import { $t } from '#/locales';
+import { MesDvRepairResultEnum, MesDvRepairStatusEnum } from '#/views/mes/utils/constants';
+
+import { useFormSchema } from '../data';
+import LineList from './line-list.vue';
+
+type FormMode = 'confirm' | 'create' | 'detail' | 'finish' | 'update';
+
+const emit = defineEmits(['success']);
+const formMode = ref<FormMode>('create');
+const formData = ref<MesDvRepairApi.Repair>();
+const isDetail = computed(() => formMode.value === 'detail');
+const isReadonly = computed(() => ['confirm', 'detail', 'finish'].includes(formMode.value));
+const canSubmit = computed(
+  () => formMode.value === 'update' && formData.value?.status === MesDvRepairStatusEnum.PREPARE,
+);
+const getTitle = computed(
+  () =>
+    ({
+      create: '新增维修工单',
+      update: '修改维修工单',
+      confirm: '完成维修',
+      finish: '验收维修',
+      detail: '查看维修工单',
+    })[formMode.value],
+);
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-1',
+    labelWidth: 110,
+  },
+  wrapperClass: 'grid-cols-3',
+  layout: 'horizontal',
+  schema: [],
+  showDefaultActions: false,
+});
+
+/** 表单 schema 需要 formApi 引用，所以通过 setState 设置 schema */
+formApi.setState({ schema: useFormSchema(formApi) });
+
+/** 提交维修工单 */
+async function handleSubmit() {
+  const { valid } = await formApi.validate();
+  if (!valid || !formData.value?.id) {
+    return;
+  }
+  await doSubmit();
+}
+
+/** 执行维修工单提交 */
+async function doSubmit() {
+  modalApi.lock();
+  try {
+    await updateRepair((await formApi.getValues()) as MesDvRepairApi.Repair);
+    await submitRepair(formData.value!.id!);
+    await modalApi.close();
+    emit('success');
+    message.success('提交成功');
+  } finally {
+    modalApi.unlock();
+  }
+}
+
+/** 完成维修 */
+async function handleConfirm() {
+  const { valid } = await formApi.validate();
+  if (!valid || !formData.value?.id) {
+    return;
+  }
+  const values = (await formApi.getValues()) as MesDvRepairApi.Repair;
+  await doConfirm(values);
+}
+
+/** 执行完成维修 */
+async function doConfirm(values: MesDvRepairApi.Repair) {
+  modalApi.lock();
+  try {
+    await confirmRepair({
+      id: formData.value!.id,
+      finishDate: values.finishDate,
+    });
+    await modalApi.close();
+    emit('success');
+    message.success($t('ui.actionMessage.operationSuccess'));
+  } finally {
+    modalApi.unlock();
+  }
+}
+
+/** 验收维修 */
+async function handleFinish(result: number) {
+  if (!formData.value?.id) {
+    return;
+  }
+  await doFinish(result);
+}
+
+/** 执行维修验收 */
+async function doFinish(result: number) {
+  modalApi.lock();
+  try {
+    await finishRepair(formData.value!.id!, result);
+    await modalApi.close();
+    emit('success');
+    message.success($t('ui.actionMessage.operationSuccess'));
+  } finally {
+    modalApi.unlock();
+  }
+}
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    if (isDetail.value || formMode.value === 'confirm' || formMode.value === 'finish') {
+      await modalApi.close();
+      return;
+    }
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    const data = (await formApi.getValues()) as MesDvRepairApi.Repair;
+    try {
+      if (formMode.value === 'create') {
+        const id = await createRepair(data);
+        formData.value = { ...data, id: id as number, status: MesDvRepairStatusEnum.PREPARE };
+        await formApi.setFieldValue('id', id);
+        formMode.value = 'update';
+      } else {
+        await updateRepair(data);
+        formData.value = { ...formData.value, ...data };
+      }
+      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; type?: FormMode }>();
+    formMode.value = data?.type || 'create';
+    formApi.setDisabled(isReadonly.value);
+    modalApi.setState({ showConfirmButton: ['create', 'update'].includes(formMode.value) });
+    if (!data?.id) {
+      return;
+    }
+    modalApi.lock();
+    try {
+      formData.value = await getRepair(data.id);
+      // 设置到 values
+      await formApi.setValues(formData.value);
+    } finally {
+      modalApi.unlock();
+    }
+  },
+});
+</script>
+<template>
+  <Modal :title="getTitle" class="w-4/5">
+    <Form class="mx-4" />
+    <LineList v-if="formData?.id" :disabled="isReadonly" :repair-id="formData.id" />
+    <template #prepend-footer>
+      <div class="flex flex-auto items-center gap-2">
+        <Popconfirm
+          v-if="canSubmit"
+          title="确认提交该维修工单？提交后将不能修改。"
+          @confirm="handleSubmit"
+        >
+          <Button type="primary">提交</Button>
+        </Popconfirm>
+        <Popconfirm
+          v-if="formMode === 'confirm'"
+          title="确认完成维修？完成后进入待验收。"
+          @confirm="handleConfirm"
+        >
+          <Button type="primary">完成维修</Button>
+        </Popconfirm>
+        <Popconfirm
+          v-if="formMode === 'finish'"
+          title="确认完成验收？"
+          @confirm="handleFinish(MesDvRepairResultEnum.PASS)"
+        >
+          <Button type="primary">验收通过</Button>
+        </Popconfirm>
+        <Popconfirm
+          v-if="formMode === 'finish'"
+          title="确认完成验收？"
+          @confirm="handleFinish(MesDvRepairResultEnum.FAIL)"
+        >
+          <Button>不通过</Button>
+        </Popconfirm>
+      </div>
+    </template>
+  </Modal>
+</template>
diff --git a/apps/web-antd/src/views/mes/dv/repair/modules/line-list.vue b/apps/web-antd/src/views/mes/dv/repair/modules/line-list.vue
new file mode 100644
index 000000000..f4a390048
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/repair/modules/line-list.vue
@@ -0,0 +1,233 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvRepairLineApi } from '#/api/mes/dv/repair/line';
+
+import { computed, ref, watch } from 'vue';
+
+import { message, Modal } from 'ant-design-vue';
+
+import { useVbenForm } from '#/adapter/form';
+import { TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import {
+  createRepairLine,
+  deleteRepairLine,
+  getRepairLine,
+  getRepairLinePage,
+  updateRepairLine,
+} from '#/api/mes/dv/repair/line';
+import { $t } from '#/locales';
+import { DvSubjectSelect } from '#/views/mes/dv/subject/components';
+
+const props = defineProps<{ disabled?: boolean; repairId: number }>();
+const formOpen = ref(false);
+const formLoading = ref(false);
+const lineFormType = ref<'create' | 'update'>('create');
+const formTitle = computed(() =>
+  lineFormType.value === 'create' ? '添加维修项目' : '修改维修项目',
+);
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-2',
+    labelWidth: 90,
+  },
+  layout: 'horizontal',
+  schema: [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'repairId',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'subjectId',
+      label: '项目',
+      component: DvSubjectSelect,
+      componentProps: {
+        placeholder: '请选择项目',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'malfunction',
+      label: '故障描述',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入故障描述',
+        rows: 3,
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'malfunctionUrl',
+      label: '故障图片',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入故障图片 URL',
+      },
+    },
+    {
+      fieldName: 'description',
+      label: '维修描述',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入维修描述',
+        rows: 3,
+      },
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入备注',
+        rows: 2,
+      },
+    },
+  ],
+  showDefaultActions: false,
+});
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    columns: [
+      { field: 'subjectName', title: '项目名称', minWidth: 150 },
+      { field: 'subjectContent', title: '项目内容', minWidth: 160 },
+      { field: 'subjectStandard', title: '项目标准', minWidth: 160 },
+      { field: 'malfunction', title: '故障描述', minWidth: 180 },
+      { field: 'malfunctionUrl', title: '故障图片', minWidth: 180 },
+      { field: 'description', title: '维修描述', minWidth: 180 },
+      {
+        title: '操作',
+        width: 130,
+        fixed: 'right',
+        slots: {
+          default: 'actions',
+        },
+        visible: !props.disabled,
+      },
+    ],
+    height: 320,
+    keepSource: true,
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }) =>
+          await getRepairLinePage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            repairId: props.repairId,
+          }),
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+    },
+  } as VxeTableGridOptions<MesDvRepairLineApi.RepairLine>,
+});
+
+/** 打开维修明细表单 */
+async function openForm(type: 'create' | 'update', row?: MesDvRepairLineApi.RepairLine) {
+  formOpen.value = true;
+  lineFormType.value = type;
+  await formApi.resetForm();
+  await formApi.setValues(
+    row
+      ? await getRepairLine(row.id!)
+      : {
+          repairId: props.repairId,
+          malfunction: '',
+          malfunctionUrl: '',
+          description: '',
+          remark: '',
+        },
+  );
+}
+
+/** 提交维修明细表单 */
+async function submitForm() {
+  const { valid } = await formApi.validate();
+  if (!valid) {
+    return;
+  }
+  formLoading.value = true;
+  try {
+    const data = (await formApi.getValues()) as MesDvRepairLineApi.RepairLine;
+    await (data.id ? updateRepairLine(data) : createRepairLine(data));
+    formOpen.value = false;
+    message.success($t('ui.actionMessage.operationSuccess'));
+    await gridApi.query();
+  } finally {
+    formLoading.value = false;
+  }
+}
+
+/** 删除维修明细 */
+async function handleDelete(id: number) {
+  await deleteRepairLine(id);
+  message.success($t('ui.actionMessage.deleteSuccess', ['维修项目']));
+  await gridApi.query();
+}
+watch(
+  () => props.repairId,
+  (value) => {
+    if (value) {
+      gridApi.query();
+    }
+  },
+);
+</script>
+<template>
+  <div class="mx-4 mt-4">
+    <div v-if="!disabled" class="mb-3">
+      <TableAction
+        :actions="[
+          { label: '添加维修项目', type: 'primary', onClick: openForm.bind(null, 'create') },
+        ]"
+      />
+    </div>
+    <Grid table-title="维修项目明细">
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            { label: '编辑', type: 'link', onClick: openForm.bind(null, 'update', row) },
+            {
+              label: '删除',
+              type: 'link',
+              danger: true,
+              popConfirm: {
+                title: '确认删除该维修项目吗？',
+                confirm: handleDelete.bind(null, row.id!),
+              },
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+    <Modal
+      v-model:open="formOpen"
+      :title="formTitle"
+      width="620px"
+      :confirm-loading="formLoading"
+      @ok="submitForm"
+    >
+      <Form class="mx-4" />
+    </Modal>
+  </div>
+</template>
diff --git a/apps/web-antd/src/views/mes/dv/subject/components/dv-subject-select.vue b/apps/web-antd/src/views/mes/dv/subject/components/dv-subject-select.vue
new file mode 100644
index 000000000..f11e16a6b
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/subject/components/dv-subject-select.vue
@@ -0,0 +1,68 @@
+<script lang="ts" setup>
+import type { SelectValue } from 'ant-design-vue/es/select';
+
+import type { MesDvSubjectApi } from '#/api/mes/dv/subject';
+
+import { computed, onMounted, ref } from 'vue';
+
+import { Select } from 'ant-design-vue';
+
+import { getSubjectSimpleList } from '#/api/mes/dv/subject';
+
+const props = withDefaults(
+  defineProps<{
+    allowClear?: boolean;
+    disabled?: boolean;
+    modelValue?: number;
+    placeholder?: string;
+    type?: number;
+  }>(),
+  {
+    allowClear: true,
+    disabled: false,
+    modelValue: undefined,
+    placeholder: '请选择项目',
+    type: undefined,
+  },
+);
+const emit = defineEmits<{
+  change: [row?: MesDvSubjectApi.Subject];
+  'update:modelValue': [value?: number];
+}>();
+const list = ref<MesDvSubjectApi.Subject[]>([]); // 项目列表
+const filteredList = computed( // 筛选后的项目列表
+  () => list.value.filter((item) => !props.type || item.type === props.type),
+);
+
+/** 加载项目列表 */
+async function getList() {
+  list.value = await getSubjectSimpleList();
+}
+
+/** 处理选择变化 */
+function handleChange(value: SelectValue) {
+  const subjectId = typeof value === 'number' ? value : undefined;
+  emit('update:modelValue', subjectId);
+  emit(
+    'change',
+    list.value.find((item) => item.id === subjectId),
+  );
+}
+
+onMounted(getList);
+</script>
+
+<template>
+  <Select
+    :allow-clear="allowClear"
+    :disabled="disabled"
+    :field-names="{ label: 'name', value: 'id' }"
+    :options="filteredList"
+    :placeholder="placeholder"
+    :value="modelValue"
+    class="w-full"
+    option-filter-prop="name"
+    show-search
+    @change="handleChange"
+  />
+</template>
diff --git a/apps/web-antd/src/views/mes/dv/subject/components/index.ts b/apps/web-antd/src/views/mes/dv/subject/components/index.ts
new file mode 100644
index 000000000..a8c12d3be
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/subject/components/index.ts
@@ -0,0 +1 @@
+export { default as DvSubjectSelect } from './dv-subject-select.vue';
diff --git a/apps/web-antd/src/views/mes/dv/subject/data.ts b/apps/web-antd/src/views/mes/dv/subject/data.ts
new file mode 100644
index 000000000..21d51902b
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/subject/data.ts
@@ -0,0 +1,199 @@
+import type { VbenFormApi, VbenFormSchema } from '#/adapter/form';
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvSubjectApi } from '#/api/mes/dv/subject';
+
+import { h } from 'vue';
+
+import { CommonStatusEnum, DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
+import { Button } from 'ant-design-vue';
+
+import { z } from '#/adapter/form';
+import { generateAutoCode } from '#/api/mes/md/autocode/record';
+import { MesAutoCodeRuleCode, MesDvSubjectTypeEnum } from '#/views/mes/utils/constants';
+
+/** 新增/修改点检保养项目的表单 */
+export function useFormSchema(formApi?: VbenFormApi): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'code',
+      label: '项目编码',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入项目编码',
+      },
+      rules: 'required',
+      suffix: () =>
+        h(
+          Button,
+          {
+            type: 'default',
+            onClick: async () => {
+              try {
+                const code = await generateAutoCode(MesAutoCodeRuleCode.DV_SUBJECT_CODE);
+                await formApi?.setFieldValue('code', code);
+              } catch (error) {
+                console.error(error);
+              }
+            },
+          },
+          { default: () => '生成' },
+        ),
+    },
+    {
+      fieldName: 'name',
+      label: '项目名称',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入项目名称',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'type',
+      label: '项目类型',
+      component: 'RadioGroup',
+      componentProps: {
+        buttonStyle: 'solid',
+        optionType: 'button',
+        options: getDictOptions(DICT_TYPE.MES_DV_SUBJECT_TYPE, 'number'),
+      },
+      rules: z.number().default(MesDvSubjectTypeEnum.CHECK),
+    },
+    {
+      fieldName: 'content',
+      label: '项目内容',
+      component: 'Textarea',
+      formItemClass: 'col-span-2',
+      componentProps: {
+        placeholder: '请输入项目内容',
+        rows: 2,
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'standard',
+      label: '标准',
+      component: 'Textarea',
+      formItemClass: 'col-span-2',
+      componentProps: {
+        placeholder: '请输入标准',
+        rows: 2,
+      },
+      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',
+      formItemClass: 'col-span-2',
+      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: 'type',
+      label: '项目类型',
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: getDictOptions(DICT_TYPE.MES_DV_SUBJECT_TYPE, 'number'),
+        placeholder: '请选择项目类型',
+      },
+    },
+  ];
+}
+
+/** 列表的字段 */
+export function useGridColumns(): VxeTableGridOptions<MesDvSubjectApi.Subject>['columns'] {
+  return [
+    {
+      field: 'code',
+      title: '项目编码',
+      minWidth: 140,
+      slots: {
+        default: 'code',
+      },
+    },
+    { field: 'name', title: '项目名称', minWidth: 140 },
+    {
+      field: 'type',
+      title: '项目类型',
+      width: 120,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_DV_SUBJECT_TYPE },
+      },
+    },
+    { field: 'content', title: '项目内容', minWidth: 180 },
+    { field: 'standard', title: '标准', minWidth: 180 },
+    {
+      field: 'status',
+      title: '状态',
+      width: 100,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.COMMON_STATUS },
+      },
+    },
+    {
+      field: 'createTime',
+      title: '创建时间',
+      width: 180,
+      formatter: 'formatDateTime',
+    },
+    {
+      title: '操作',
+      width: 180,
+      fixed: 'right',
+      slots: {
+        default: 'actions',
+      },
+    },
+  ];
+}
diff --git a/apps/web-antd/src/views/mes/dv/subject/index.vue b/apps/web-antd/src/views/mes/dv/subject/index.vue
new file mode 100644
index 000000000..6aabbdeea
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/subject/index.vue
@@ -0,0 +1,152 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvSubjectApi } from '#/api/mes/dv/subject';
+
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
+import { downloadFileFromBlobPart } from '@vben/utils';
+
+import { Button, message } from 'ant-design-vue';
+
+import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import { deleteSubject, exportSubject, getSubjectPage } from '#/api/mes/dv/subject';
+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({ type: 'create' }).open();
+}
+
+/** 查看点检保养项目 */
+function handleDetail(row: MesDvSubjectApi.Subject) {
+  formModalApi.setData({ id: row.id, type: 'detail' }).open();
+}
+
+/** 编辑点检保养项目 */
+function handleEdit(row: MesDvSubjectApi.Subject) {
+  formModalApi.setData({ id: row.id, type: 'update' }).open();
+}
+
+/** 删除点检保养项目 */
+async function handleDelete(row: MesDvSubjectApi.Subject) {
+  const hideLoading = message.loading({
+    content: $t('ui.actionMessage.deleting', [row.name]),
+    duration: 0,
+  });
+  try {
+    await deleteSubject(row.id!);
+    message.success($t('ui.actionMessage.deleteSuccess', [row.name]));
+    handleRefresh();
+  } finally {
+    hideLoading();
+  }
+}
+
+/** 导出点检保养项目 */
+async function handleExport() {
+  const data = await exportSubject(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) =>
+          await getSubjectPage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            ...formValues,
+          }),
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+  } as VxeTableGridOptions<MesDvSubjectApi.Subject>,
+});
+</script>
+
+<template>
+  <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【设备】点检保养项目、点检保养方案"
+        url="https://doc.iocoder.cn/mes/dv/check-plan/"
+      />
+    </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:dv-subject:create'],
+              onClick: handleCreate,
+            },
+            {
+              label: $t('ui.actionTitle.export'),
+              type: 'primary',
+              icon: ACTION_ICON.DOWNLOAD,
+              auth: ['mes:dv-subject:export'],
+              onClick: handleExport,
+            },
+          ]"
+        />
+      </template>
+      <template #code="{ row }">
+        <Button type="link" @click="handleDetail(row)">{{ row.code }}</Button>
+      </template>
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: $t('common.edit'),
+              type: 'link',
+              icon: ACTION_ICON.EDIT,
+              auth: ['mes:dv-subject:update'],
+              onClick: handleEdit.bind(null, row),
+            },
+            {
+              label: $t('common.delete'),
+              type: 'link',
+              danger: true,
+              icon: ACTION_ICON.DELETE,
+              auth: ['mes:dv-subject: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/dv/subject/modules/form.vue b/apps/web-antd/src/views/mes/dv/subject/modules/form.vue
new file mode 100644
index 000000000..6a1fead3a
--- /dev/null
+++ b/apps/web-antd/src/views/mes/dv/subject/modules/form.vue
@@ -0,0 +1,95 @@
+<script lang="ts" setup>
+import type { MesDvSubjectApi } from '#/api/mes/dv/subject';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { message } from 'ant-design-vue';
+
+import { useVbenForm } from '#/adapter/form';
+import { createSubject, getSubject, updateSubject } from '#/api/mes/dv/subject';
+import { $t } from '#/locales';
+
+import { useFormSchema } from '../data';
+
+type FormMode = 'create' | 'detail' | 'update';
+
+const emit = defineEmits(['success']);
+const formMode = ref<FormMode>('create'); // 表单模式
+const isDetail = computed(() => formMode.value === 'detail'); // 是否查看模式
+const getTitle = computed(() => {
+  if (formMode.value === 'detail') {
+    return '查看点检保养项目';
+  }
+  return formMode.value === 'update' ? '修改点检保养项目' : '新增点检保养项目';
+});
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-1',
+    labelWidth: 110,
+  },
+  wrapperClass: 'grid-cols-2',
+  layout: 'horizontal',
+  schema: [],
+  showDefaultActions: false,
+});
+
+/** 表单 schema 需要 formApi 引用，所以通过 setState 设置 schema */
+formApi.setState({ schema: useFormSchema(formApi) });
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    if (isDetail.value) {
+      await modalApi.close();
+      return;
+    }
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    const data = (await formApi.getValues()) as MesDvSubjectApi.Subject;
+    try {
+      await (data.id ? updateSubject(data) : createSubject(data));
+      // 关闭并提示
+      await modalApi.close();
+      emit('success');
+      message.success($t('ui.actionMessage.operationSuccess'));
+    } finally {
+      modalApi.unlock();
+    }
+  },
+  async onOpenChange(isOpen: boolean) {
+    if (!isOpen) {
+      return;
+    }
+    await formApi.resetForm();
+    // 加载数据
+    const data = modalApi.getData<{ id?: number; type?: FormMode }>();
+    formMode.value = data?.type || 'create';
+    formApi.setDisabled(formMode.value === 'detail');
+    modalApi.setState({ showConfirmButton: formMode.value !== 'detail' });
+    if (!data?.id) {
+      return;
+    }
+    modalApi.lock();
+    try {
+      await formApi.setValues(await getSubject(data.id));
+    } finally {
+      modalApi.unlock();
+    }
+  },
+});
+</script>
+
+<template>
+  <Modal :title="getTitle" class="w-2/5">
+    <Form class="mx-4" />
+  </Modal>
+</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
index b1ba5fdf2..04290bf51 100644
--- a/apps/web-antd/src/views/mes/md/autocode/modules/form.vue
+++ b/apps/web-antd/src/views/mes/md/autocode/modules/form.vue
@@ -55,6 +55,7 @@ const [Modal, modalApi] = useVbenModal({
       return;
     }
     modalApi.lock();
+    // 提交表单
     const data = normalizeRuleData(
       (await formApi.getValues()) as MesMdAutoCodeRuleApi.AutoCodeRule,
     );
@@ -62,6 +63,7 @@ const [Modal, modalApi] = useVbenModal({
       await (formData.value?.id
         ? updateAutoCodeRule(data)
         : createAutoCodeRule(data));
+      // 关闭并提示
       await modalApi.close();
       emit('success');
       message.success($t('ui.actionMessage.operationSuccess'));
@@ -75,6 +77,7 @@ const [Modal, modalApi] = useVbenModal({
       return;
     }
     await formApi.resetForm();
+    // 加载数据
     const data = modalApi.getData<MesMdAutoCodeRuleApi.AutoCodeRule>();
     if (!data?.id) {
       return;
@@ -82,6 +85,7 @@ const [Modal, modalApi] = useVbenModal({
     modalApi.lock();
     try {
       formData.value = await getAutoCodeRule(data.id);
+      // 设置到 values
       await formApi.setValues(formData.value);
     } finally {
       modalApi.unlock();
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
index 538f594cc..205a2125b 100644
--- 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
@@ -65,6 +65,7 @@ const [Modal, modalApi] = useVbenModal({
       return;
     }
     modalApi.lock();
+    // 提交表单
     const data = normalizePartData(
       (await formApi.getValues()) as MesMdAutoCodePartApi.AutoCodePart,
     );
@@ -72,6 +73,7 @@ const [Modal, modalApi] = useVbenModal({
       await (formData.value?.id
         ? updateAutoCodePart(data)
         : createAutoCodePart(data));
+      // 关闭并提示
       await modalApi.close();
       emit('success');
       message.success($t('ui.actionMessage.operationSuccess'));
@@ -85,6 +87,7 @@ const [Modal, modalApi] = useVbenModal({
       return;
     }
     await formApi.resetForm();
+    // 加载数据
     const data = modalApi.getData<{
       id?: number;
       maxSort?: number;
@@ -100,6 +103,7 @@ const [Modal, modalApi] = useVbenModal({
     modalApi.lock();
     try {
       formData.value = await getAutoCodePart(data.id);
+      // 设置到 values
       await formApi.setValues(formData.value);
     } finally {
       modalApi.unlock();
diff --git a/apps/web-antd/src/views/mes/md/client/components/md-client-select-dialog.vue b/apps/web-antd/src/views/mes/md/client/components/md-client-select-dialog.vue
index a96be3727..49b652901 100644
--- a/apps/web-antd/src/views/mes/md/client/components/md-client-select-dialog.vue
+++ b/apps/web-antd/src/views/mes/md/client/components/md-client-select-dialog.vue
@@ -69,8 +69,9 @@ function getMultipleSelectedRows() {
     ...(gridApi.grid.getCheckboxRecords?.() ?? []),
   ] as MesMdClientApi.Client[];
   records.forEach((row) => {
-    if (row.id !== null) {
-      selectedMap.set(row.id as number, row);
+    const rowId = row.id;
+    if (rowId !== null && rowId !== undefined) {
+      selectedMap.set(rowId, row);
     }
   });
   return [...selectedMap.values()];
diff --git a/apps/web-antd/src/views/mes/md/client/modules/form.vue b/apps/web-antd/src/views/mes/md/client/modules/form.vue
index 5b4cc4fee..4f4d2dda7 100644
--- a/apps/web-antd/src/views/mes/md/client/modules/form.vue
+++ b/apps/web-antd/src/views/mes/md/client/modules/form.vue
@@ -24,12 +24,10 @@ const formData = ref<MesMdClientApi.Client>();
 
 const isDetail = computed(() => formMode.value === 'detail'); // 是否查看模式
 const getTitle = computed(() => {
-  const titles: Record<FormMode, string> = {
-    create: '新增客户',
-    update: '修改客户',
-    detail: '查看客户',
-  };
-  return titles[formMode.value];
+  if (formMode.value === 'detail') {
+    return '查看客户';
+  }
+  return formMode.value === 'update' ? '修改客户' : '新增客户';
 });
 
 const [Form, formApi] = useVbenForm({
diff --git a/apps/web-antd/src/views/mes/md/item/modules/form.vue b/apps/web-antd/src/views/mes/md/item/modules/form.vue
index 53af2592f..40eeed34b 100644
--- a/apps/web-antd/src/views/mes/md/item/modules/form.vue
+++ b/apps/web-antd/src/views/mes/md/item/modules/form.vue
@@ -29,12 +29,10 @@ const barcodeDetailRef = ref<InstanceType<typeof BarcodeDetail>>(); // 条码详
 
 const isDetail = computed(() => formMode.value === 'detail'); // 是否查看模式
 const getTitle = computed(() => {
-  const titles: Record<FormMode, string> = {
-    create: '新增物料/产品',
-    update: '修改物料/产品',
-    detail: '查看物料/产品',
-  };
-  return titles[formMode.value];
+  if (formMode.value === 'detail') {
+    return '查看物料/产品';
+  }
+  return formMode.value === 'update' ? '修改物料/产品' : '新增物料/产品';
 });
 const currentItemOrProduct = computed(
   () => formData.value?.itemOrProduct || '',
diff --git a/apps/web-antd/src/views/mes/md/item/type/index.vue b/apps/web-antd/src/views/mes/md/item/type/index.vue
index c7f2333b1..ff10b86c4 100644
--- a/apps/web-antd/src/views/mes/md/item/type/index.vue
+++ b/apps/web-antd/src/views/mes/md/item/type/index.vue
@@ -4,7 +4,7 @@ import type { MesMdItemTypeApi } from '#/api/mes/md/item/type';
 
 import { ref } from 'vue';
 
-import { Page, useVbenModal } from '@vben/common-ui';
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
 
 import { message } from 'ant-design-vue';
 
@@ -102,6 +102,12 @@ const [Grid, gridApi] = useVbenVxeGrid({
 
 <template>
   <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【基础】物料产品、分类、计量单位"
+        url="https://doc.iocoder.cn/mes/md/product/"
+      />
+    </template>
     <FormModal @success="handleRefresh" />
     <Grid table-title="物料分类列表">
       <template #toolbar-tools>
diff --git a/apps/web-antd/src/views/mes/md/workstation/data.ts b/apps/web-antd/src/views/mes/md/workstation/data.ts
index 74bdec3c6..2b4848ff5 100644
--- a/apps/web-antd/src/views/mes/md/workstation/data.ts
+++ b/apps/web-antd/src/views/mes/md/workstation/data.ts
@@ -130,10 +130,8 @@ export function useFormSchema(formApi?: VbenFormApi): VbenFormSchema[] {
             onChange: async () => {
               await formApi?.setFieldValue('areaId', undefined);
             },
-            options: list.map((item) => ({
-              label: item.name,
-              value: item.id,
-            })),
+            fieldNames: { label: 'name', value: 'id' },
+            options: list,
             placeholder: '请选择库区',
           };
         },
@@ -152,10 +150,8 @@ export function useFormSchema(formApi?: VbenFormApi): VbenFormSchema[] {
             : [];
           return {
             allowClear: true,
-            options: list.map((item) => ({
-              label: item.name,
-              value: item.id,
-            })),
+            fieldNames: { label: 'name', value: 'id' },
+            options: list,
             placeholder: '请选择库位',
           };
         },
diff --git a/apps/web-antd/src/views/mes/md/workstation/modules/form.vue b/apps/web-antd/src/views/mes/md/workstation/modules/form.vue
index b8983ebd3..e1358c8e6 100644
--- a/apps/web-antd/src/views/mes/md/workstation/modules/form.vue
+++ b/apps/web-antd/src/views/mes/md/workstation/modules/form.vue
@@ -32,12 +32,10 @@ const barcodeDetailRef = ref<InstanceType<typeof BarcodeDetail>>(); // 条码详
 
 const isDetail = computed(() => formMode.value === 'detail'); // 是否查看模式
 const getTitle = computed(() => {
-  const titles: Record<FormMode, string> = {
-    create: '新增工作站',
-    update: '修改工作站',
-    detail: '查看工作站',
-  };
-  return titles[formMode.value];
+  if (formMode.value === 'detail') {
+    return '查看工作站';
+  }
+  return formMode.value === 'update' ? '修改工作站' : '新增工作站';
 });
 
 const [Form, formApi] = useVbenForm({
diff --git a/apps/web-antd/src/views/mes/md/workstation/workshop/modules/form.vue b/apps/web-antd/src/views/mes/md/workstation/workshop/modules/form.vue
index b6c39452f..f09ab589e 100644
--- a/apps/web-antd/src/views/mes/md/workstation/workshop/modules/form.vue
+++ b/apps/web-antd/src/views/mes/md/workstation/workshop/modules/form.vue
@@ -28,12 +28,10 @@ const barcodeDetailRef = ref<InstanceType<typeof BarcodeDetail>>(); // 条码详
 
 const isDetail = computed(() => formMode.value === 'detail'); // 是否查看模式
 const getTitle = computed(() => {
-  const titles: Record<FormMode, string> = {
-    create: '新增车间',
-    update: '修改车间',
-    detail: '查看车间',
-  };
-  return titles[formMode.value];
+  if (formMode.value === 'detail') {
+    return '查看车间';
+  }
+  return formMode.value === 'update' ? '修改车间' : '新增车间';
 });
 
 const [Form, formApi] = useVbenForm({
diff --git a/apps/web-antd/src/views/mes/tm/tool/components/index.ts b/apps/web-antd/src/views/mes/tm/tool/components/index.ts
new file mode 100644
index 000000000..cdddb2cfd
--- /dev/null
+++ b/apps/web-antd/src/views/mes/tm/tool/components/index.ts
@@ -0,0 +1 @@
+export { default as TmToolSelect } from './tm-tool-select.vue';
diff --git a/apps/web-antd/src/views/mes/tm/tool/components/tm-tool-select.vue b/apps/web-antd/src/views/mes/tm/tool/components/tm-tool-select.vue
new file mode 100644
index 000000000..134b947f0
--- /dev/null
+++ b/apps/web-antd/src/views/mes/tm/tool/components/tm-tool-select.vue
@@ -0,0 +1,55 @@
+<script lang="ts" setup>
+import type { SelectValue } from 'ant-design-vue/es/select';
+
+import type { MesTmToolApi } from '#/api/mes/tm/tool';
+
+import { onMounted, ref } from 'vue';
+
+import { Select } from 'ant-design-vue';
+
+import { getToolSimpleList } from '#/api/mes/tm/tool';
+
+withDefaults(
+  defineProps<{
+    allowClear?: boolean;
+    disabled?: boolean;
+    modelValue?: number;
+    placeholder?: string;
+  }>(),
+  { allowClear: true, disabled: false, modelValue: undefined, placeholder: '请选择工具' },
+);
+const emit = defineEmits<{
+  change: [row?: MesTmToolApi.Tool];
+  'update:modelValue': [value?: number];
+}>();
+const list = ref<MesTmToolApi.Tool[]>([]); // 工具列表
+
+/** 加载工具列表 */
+async function getList() {
+  list.value = await getToolSimpleList();
+}
+
+/** 处理工具选择变化 */
+function handleChange(value: SelectValue) {
+  const toolId = typeof value === 'number' ? value : undefined;
+  emit('update:modelValue', toolId);
+  emit('change', list.value.find((item) => item.id === toolId));
+}
+
+onMounted(getList);
+</script>
+
+<template>
+  <Select
+    :allow-clear="allowClear"
+    :disabled="disabled"
+    :field-names="{ label: 'name', value: 'id' }"
+    :options="list"
+    :placeholder="placeholder"
+    :value="modelValue"
+    class="w-full"
+    option-filter-prop="name"
+    show-search
+    @change="handleChange"
+  />
+</template>
diff --git a/apps/web-antd/src/views/mes/tm/tool/data.ts b/apps/web-antd/src/views/mes/tm/tool/data.ts
new file mode 100644
index 000000000..fbff2a1a3
--- /dev/null
+++ b/apps/web-antd/src/views/mes/tm/tool/data.ts
@@ -0,0 +1,305 @@
+import type { VbenFormApi, VbenFormSchema } from '#/adapter/form';
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesTmToolApi } from '#/api/mes/tm/tool';
+
+import { h, markRaw } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+import { formatDateTime } from '@vben/utils';
+
+import { Button } from 'ant-design-vue';
+
+import { z } from '#/adapter/form';
+import { generateAutoCode } from '#/api/mes/md/autocode/record';
+import {
+  MesAutoCodeRuleCode,
+  MesMaintenTypeEnum,
+  MesToolStatusEnum,
+} from '#/views/mes/utils/constants';
+
+import { TmToolTypeSelect } from './type/components';
+
+/** 新增/修改工具的表单 */
+export function useFormSchema(formApi?: VbenFormApi): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'code',
+      label: '工具编码',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入工具编码',
+      },
+      dependencies: {
+        triggerFields: ['id'],
+        componentProps: (values) => ({ disabled: !!values.id }),
+      },
+      rules: 'required',
+      suffix: () =>
+        h(
+          Button,
+          {
+            type: 'default',
+            onClick: async () => {
+              const code = await generateAutoCode(MesAutoCodeRuleCode.TM_TOOL_CODE);
+              await formApi?.setFieldValue('code', code);
+            },
+          },
+          { default: () => '生成' },
+        ),
+    },
+    {
+      fieldName: 'name',
+      label: '工具名称',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入工具名称',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'toolTypeId',
+      label: '工具类型',
+      component: markRaw(TmToolTypeSelect),
+      componentProps: {
+        placeholder: '请选择工具类型',
+        onChange: async (row: any) => {
+          if (row?.codeFlag) {
+            await formApi?.setFieldValue('quantity', 1);
+            await formApi?.setFieldValue('availableQuantity', 1);
+          }
+        },
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'brand',
+      label: '品牌',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入品牌',
+      },
+    },
+    {
+      fieldName: 'specification',
+      label: '型号规格',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入型号规格',
+      },
+    },
+    {
+      fieldName: 'quantity',
+      label: '库存数量',
+      component: 'InputNumber',
+      componentProps: {
+        class: '!w-full',
+        min: 1,
+        onChange: async (value?: number) => {
+          const values = (await formApi?.getValues()) as MesTmToolApi.Tool | undefined;
+          if (!values?.id) {
+            await formApi?.setFieldValue('availableQuantity', value);
+          }
+        },
+        precision: 0,
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'availableQuantity',
+      label: '可用数量',
+      component: 'InputNumber',
+      componentProps: {
+        class: '!w-full',
+        disabled: true,
+        min: 0,
+        precision: 0,
+      },
+      rules: z.number().default(1),
+    },
+    {
+      fieldName: 'status',
+      label: '状态',
+      component: 'Select',
+      componentProps: {
+        disabled: true,
+        options: getDictOptions(DICT_TYPE.MES_TM_TOOL_STATUS, 'number'),
+      },
+      rules: z.number().default(MesToolStatusEnum.STORE),
+    },
+    {
+      fieldName: 'maintenType',
+      label: '保养维护类型',
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: getDictOptions(DICT_TYPE.MES_TM_MAINTEN_TYPE, 'number'),
+        placeholder: '请选择保养维护类型',
+      },
+    },
+    {
+      fieldName: 'nextMaintenDate',
+      label: '下次保养日期',
+      component: 'DatePicker',
+      componentProps: {
+        format: 'YYYY-MM-DD HH:mm:ss',
+        showTime: true,
+        valueFormat: 'x',
+      },
+      dependencies: {
+        triggerFields: ['maintenType'],
+        show: (values) => values.maintenType === MesMaintenTypeEnum.REGULAR,
+      },
+    },
+    {
+      fieldName: 'nextMaintenPeriod',
+      label: '下次保养周期',
+      component: 'InputNumber',
+      componentProps: {
+        class: '!w-full',
+        min: 1,
+        precision: 0,
+      },
+      dependencies: {
+        triggerFields: ['maintenType'],
+        show: (values) => values.maintenType === MesMaintenTypeEnum.USAGE,
+      },
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      formItemClass: 'col-span-3',
+      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: 'brand',
+      label: '品牌',
+      component: 'Input',
+      componentProps: {
+        allowClear: true,
+        placeholder: '请输入品牌',
+      },
+    },
+    {
+      fieldName: 'specification',
+      label: '型号规格',
+      component: 'Input',
+      componentProps: {
+        allowClear: true,
+        placeholder: '请输入型号规格',
+      },
+    },
+    {
+      fieldName: 'status',
+      label: '状态',
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: getDictOptions(DICT_TYPE.MES_TM_TOOL_STATUS, 'number'),
+        placeholder: '请选择状态',
+      },
+    },
+  ];
+}
+
+/** 列表的字段 */
+export function useGridColumns(): VxeTableGridOptions<MesTmToolApi.Tool>['columns'] {
+  return [
+    {
+      field: 'code',
+      title: '工具编码',
+      minWidth: 140,
+      slots: {
+        default: 'code',
+      },
+    },
+    { field: 'name', title: '工具名称', minWidth: 150 },
+    { field: 'toolTypeName', title: '工具类型', minWidth: 140 },
+    { field: 'brand', title: '品牌', minWidth: 120 },
+    { field: 'specification', title: '型号规格', minWidth: 140 },
+    { field: 'quantity', title: '库存数量', width: 100 },
+    { field: 'availableQuantity', title: '可用数量', width: 100 },
+    {
+      field: 'maintenType',
+      title: '保养维护类型',
+      width: 140,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_TM_MAINTEN_TYPE },
+      },
+    },
+    {
+      field: 'nextMaintenDate',
+      title: '下次保养',
+      width: 180,
+      formatter: ({ row }) => {
+        if (row.maintenType === MesMaintenTypeEnum.REGULAR) {
+          return row.nextMaintenDate ? formatDateTime(row.nextMaintenDate) : '-';
+        }
+        if (row.maintenType === MesMaintenTypeEnum.USAGE) {
+          return row.nextMaintenPeriod == null ? '-' : `${row.nextMaintenPeriod} 次`;
+        }
+        return '-';
+      },
+    },
+    {
+      field: 'status',
+      title: '状态',
+      width: 120,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_TM_TOOL_STATUS },
+      },
+    },
+    {
+      field: 'createTime',
+      title: '创建时间',
+      width: 180,
+      formatter: 'formatDateTime',
+    },
+    {
+      title: '操作',
+      width: 180,
+      fixed: 'right',
+      slots: {
+        default: 'actions',
+      },
+    },
+  ];
+}
diff --git a/apps/web-antd/src/views/mes/tm/tool/index.vue b/apps/web-antd/src/views/mes/tm/tool/index.vue
new file mode 100644
index 000000000..9225e52d0
--- /dev/null
+++ b/apps/web-antd/src/views/mes/tm/tool/index.vue
@@ -0,0 +1,174 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesTmToolApi } from '#/api/mes/tm/tool';
+import type { MesTmToolTypeApi } from '#/api/mes/tm/tool/type';
+
+import { ref } from 'vue';
+
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
+import { downloadFileFromBlobPart } from '@vben/utils';
+
+import { Button, Card, message } from 'ant-design-vue';
+
+import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import { deleteTool, exportTool, getToolPage } from '#/api/mes/tm/tool';
+import { $t } from '#/locales';
+import { TmToolTypeList } from '#/views/mes/tm/tool/type/components';
+
+import { useGridColumns, useGridFormSchema } from './data';
+import Form from './modules/form.vue';
+
+const selectedToolTypeId = ref<number>(); // 当前选中的工具类型编号
+
+const [FormModal, formModalApi] = useVbenModal({
+  connectedComponent: Form,
+  destroyOnClose: true,
+});
+
+/** 刷新表格 */
+function handleRefresh() {
+  gridApi.query();
+}
+
+/** 创建工具 */
+function handleCreate() {
+  formModalApi.setData({ type: 'create' }).open();
+}
+
+/** 查看工具 */
+function handleDetail(row: MesTmToolApi.Tool) {
+  formModalApi.setData({ id: row.id, type: 'detail' }).open();
+}
+
+/** 编辑工具 */
+function handleEdit(row: MesTmToolApi.Tool) {
+  formModalApi.setData({ id: row.id, type: 'update' }).open();
+}
+
+/** 删除工具 */
+async function handleDelete(row: MesTmToolApi.Tool) {
+  const hideLoading = message.loading({
+    content: $t('ui.actionMessage.deleting', [row.name]),
+    duration: 0,
+  });
+  try {
+    await deleteTool(row.id!);
+    message.success($t('ui.actionMessage.deleteSuccess', [row.name]));
+    handleRefresh();
+  } finally {
+    hideLoading();
+  }
+}
+
+/** 导出工具 */
+async function handleExport() {
+  const data = await exportTool(await gridApi.formApi.getValues());
+  downloadFileFromBlobPart({ fileName: '工具.xls', source: data });
+}
+
+/** 工具类型选中变化 */
+function handleToolTypeSelect(row: MesTmToolTypeApi.ToolType | undefined) {
+  selectedToolTypeId.value = row?.id;
+  handleRefresh();
+}
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  formOptions: {
+    schema: useGridFormSchema(),
+  },
+  gridOptions: {
+    columns: useGridColumns(),
+    height: 'auto',
+    keepSource: true,
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }, formValues) => {
+          return await getToolPage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            ...formValues,
+            toolTypeId: selectedToolTypeId.value,
+          });
+        },
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+  } as VxeTableGridOptions<MesTmToolApi.Tool>,
+});
+</script>
+
+<template>
+  <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【工具】工具类型、工装夹具台账"
+        url="https://doc.iocoder.cn/mes/tm/tool/"
+      />
+    </template>
+
+    <FormModal @success="handleRefresh" />
+    <div class="flex h-full w-full">
+      <Card class="mr-4 h-full w-1/6">
+        <TmToolTypeList @select="handleToolTypeSelect" />
+      </Card>
+      <div class="w-5/6">
+        <Grid table-title="工具列表">
+          <template #toolbar-tools>
+            <TableAction
+              :actions="[
+                {
+                  label: $t('ui.actionTitle.create', ['工具']),
+                  type: 'primary',
+                  icon: ACTION_ICON.ADD,
+                  auth: ['mes:tm-tool:create'],
+                  onClick: handleCreate,
+                },
+                {
+                  label: $t('ui.actionTitle.export'),
+                  type: 'primary',
+                  icon: ACTION_ICON.DOWNLOAD,
+                  auth: ['mes:tm-tool:export'],
+                  onClick: handleExport,
+                },
+              ]"
+            />
+          </template>
+          <template #code="{ row }">
+            <Button type="link" @click="handleDetail(row)">{{ row.code }}</Button>
+          </template>
+          <template #actions="{ row }">
+            <TableAction
+              :actions="[
+                {
+                  label: $t('common.edit'),
+                  type: 'link',
+                  icon: ACTION_ICON.EDIT,
+                  auth: ['mes:tm-tool:update'],
+                  onClick: handleEdit.bind(null, row),
+                },
+                {
+                  label: $t('common.delete'),
+                  type: 'link',
+                  danger: true,
+                  icon: ACTION_ICON.DELETE,
+                  auth: ['mes:tm-tool:delete'],
+                  popConfirm: {
+                    title: $t('ui.actionMessage.deleteConfirm', [row.name]),
+                    confirm: handleDelete.bind(null, row),
+                  },
+                },
+              ]"
+            />
+          </template>
+        </Grid>
+      </div>
+    </div>
+  </Page>
+</template>
diff --git a/apps/web-antd/src/views/mes/tm/tool/modules/form.vue b/apps/web-antd/src/views/mes/tm/tool/modules/form.vue
new file mode 100644
index 000000000..0e0a26942
--- /dev/null
+++ b/apps/web-antd/src/views/mes/tm/tool/modules/form.vue
@@ -0,0 +1,126 @@
+<script lang="ts" setup>
+import type { MesTmToolApi } from '#/api/mes/tm/tool';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { Button, message } from 'ant-design-vue';
+
+import { useVbenForm } from '#/adapter/form';
+import { createTool, getTool, updateTool } from '#/api/mes/tm/tool';
+import { $t } from '#/locales';
+import { BarcodeBizTypeEnum } from '#/views/mes/utils/constants';
+import { BarcodeDetail } from '#/views/mes/wm/barcode/components';
+
+import { useFormSchema } from '../data';
+
+type FormMode = 'create' | 'detail' | 'update';
+
+const emit = defineEmits(['success']);
+const formMode = ref<FormMode>('create'); // 表单模式
+const formData = ref<MesTmToolApi.Tool>();
+const barcodeDetailRef = ref<InstanceType<typeof BarcodeDetail>>(); // 条码详情弹窗
+
+const isDetail = computed(() => formMode.value === 'detail'); // 是否查看模式
+const getTitle = computed(() => {
+  if (formMode.value === 'detail') {
+    return $t('ui.actionTitle.view', ['工具']);
+  }
+  return formMode.value === 'update'
+    ? $t('ui.actionTitle.edit', ['工具'])
+    : $t('ui.actionTitle.create', ['工具']);
+});
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-1',
+    labelWidth: 110,
+  },
+  wrapperClass: 'grid-cols-3',
+  layout: 'horizontal',
+  schema: [],
+  showDefaultActions: false,
+});
+
+/** 表单 schema 需要 formApi 引用，所以通过 setState 设置 schema */
+formApi.setState({ schema: useFormSchema(formApi) });
+
+/** 查看工具条码 */
+function handleBarcode() {
+  if (!formData.value?.id) {
+    return;
+  }
+  barcodeDetailRef.value?.openByBusiness(
+    formData.value.id,
+    BarcodeBizTypeEnum.TOOL,
+    formData.value.code,
+    formData.value.name,
+  );
+}
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    if (isDetail.value) {
+      await modalApi.close();
+      return;
+    }
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    const data = (await formApi.getValues()) as MesTmToolApi.Tool;
+    try {
+      await (data.id ? updateTool(data) : createTool(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; type?: FormMode }>();
+    formMode.value = data?.type || 'create';
+    formApi.setDisabled(formMode.value === 'detail');
+    modalApi.setState({ showConfirmButton: formMode.value !== 'detail' });
+    if (!data?.id) {
+      return;
+    }
+    modalApi.lock();
+    try {
+      formData.value = await getTool(data.id);
+      // 设置到 values
+      await formApi.setValues(formData.value);
+    } finally {
+      modalApi.unlock();
+    }
+  },
+});
+</script>
+
+<template>
+  <Modal :title="getTitle" class="w-4/5">
+    <Form class="mx-4" />
+    <template #prepend-footer>
+      <div class="flex flex-auto items-center">
+        <Button v-if="isDetail && formData?.id" type="primary" @click="handleBarcode">
+          查看条码
+        </Button>
+      </div>
+    </template>
+    <BarcodeDetail ref="barcodeDetailRef" />
+  </Modal>
+</template>
diff --git a/apps/web-antd/src/views/mes/tm/tool/type/components/index.ts b/apps/web-antd/src/views/mes/tm/tool/type/components/index.ts
new file mode 100644
index 000000000..7d68a5c4d
--- /dev/null
+++ b/apps/web-antd/src/views/mes/tm/tool/type/components/index.ts
@@ -0,0 +1,2 @@
+export { default as TmToolTypeList } from './tm-tool-type-list.vue';
+export { default as TmToolTypeSelect } from './tm-tool-type-select.vue';
diff --git a/apps/web-antd/src/views/mes/tm/tool/type/components/tm-tool-type-list.vue b/apps/web-antd/src/views/mes/tm/tool/type/components/tm-tool-type-list.vue
new file mode 100644
index 000000000..6e6365c0e
--- /dev/null
+++ b/apps/web-antd/src/views/mes/tm/tool/type/components/tm-tool-type-list.vue
@@ -0,0 +1,106 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesTmToolTypeApi } from '#/api/mes/tm/tool/type';
+
+import { computed, onMounted, ref, watch } from 'vue';
+
+import { IconifyIcon } from '@vben/icons';
+
+import { Input } from 'ant-design-vue';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { getToolTypeSimpleList } from '#/api/mes/tm/tool/type';
+
+defineOptions({ name: 'TmToolTypeList' });
+
+const emit = defineEmits<{
+  select: [row?: MesTmToolTypeApi.ToolType];
+}>();
+const selectedId = ref<number>(); // 当前选中工具类型编号
+const filterText = ref(''); // 工具类型搜索关键字
+const toolTypeList = ref<MesTmToolTypeApi.ToolType[]>([]); // 工具类型列表
+const filteredList = computed(() =>
+  filterText.value
+    ? toolTypeList.value.filter((item) => item.name?.includes(filterText.value))
+    : toolTypeList.value,
+);
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    autoResize: true,
+    border: false,
+    columns: [{ field: 'name', title: '类型名称' }],
+    data: [],
+    height: 'auto',
+    pagerConfig: {
+      enabled: false,
+    },
+    rowConfig: {
+      isCurrent: true,
+      isHover: true,
+      keyField: 'id',
+    },
+    showHeader: false,
+    toolbarConfig: {
+      enabled: false,
+    },
+  } as VxeTableGridOptions<MesTmToolTypeApi.ToolType>,
+  gridEvents: {
+    cellClick: ({ row }: { row: MesTmToolTypeApi.ToolType }) => {
+      // 再次点击同一项：取消选中
+      if (selectedId.value === row.id) {
+        selectedId.value = undefined;
+        gridApi.grid.clearCurrentRow();
+        emit('select', undefined);
+        return;
+      }
+      selectedId.value = row.id;
+      emit('select', row);
+    },
+  },
+});
+
+/** 刷新工具类型列表 */
+function refreshGridData() {
+  gridApi.setGridOptions({ data: filteredList.value });
+}
+
+/** 加载工具类型列表 */
+async function loadList() {
+  toolTypeList.value = await getToolTypeSimpleList();
+  refreshGridData();
+}
+
+/** 重置工具类型列表 */
+function reset() {
+  selectedId.value = undefined;
+  filterText.value = '';
+  gridApi.grid.clearCurrentRow();
+  emit('select', undefined);
+  refreshGridData();
+}
+
+watch(filterText, () => {
+  refreshGridData();
+});
+
+onMounted(loadList);
+
+defineExpose({ loadList, reset });
+</script>
+
+<template>
+  <div class="h-full">
+    <Input
+      v-model:value="filterText"
+      allow-clear
+      class="mb-3 w-full"
+      placeholder="搜索工具类型"
+    >
+      <template #prefix>
+        <IconifyIcon class="size-4" icon="lucide:search" />
+      </template>
+    </Input>
+    <Grid class="h-full" />
+  </div>
+</template>
diff --git a/apps/web-antd/src/views/mes/tm/tool/type/components/tm-tool-type-select.vue b/apps/web-antd/src/views/mes/tm/tool/type/components/tm-tool-type-select.vue
new file mode 100644
index 000000000..68425cf39
--- /dev/null
+++ b/apps/web-antd/src/views/mes/tm/tool/type/components/tm-tool-type-select.vue
@@ -0,0 +1,55 @@
+<script lang="ts" setup>
+import type { SelectValue } from 'ant-design-vue/es/select';
+
+import type { MesTmToolTypeApi } from '#/api/mes/tm/tool/type';
+
+import { onMounted, ref } from 'vue';
+
+import { Select } from 'ant-design-vue';
+
+import { getToolTypeSimpleList } from '#/api/mes/tm/tool/type';
+
+withDefaults(
+  defineProps<{
+    allowClear?: boolean;
+    disabled?: boolean;
+    modelValue?: number;
+    placeholder?: string;
+  }>(),
+  { allowClear: true, disabled: false, modelValue: undefined, placeholder: '请选择工具类型' },
+);
+const emit = defineEmits<{
+  change: [row?: MesTmToolTypeApi.ToolType];
+  'update:modelValue': [value?: number];
+}>();
+const list = ref<MesTmToolTypeApi.ToolType[]>([]); // 工具类型列表
+
+/** 加载工具类型列表 */
+async function getList() {
+  list.value = await getToolTypeSimpleList();
+}
+
+/** 处理工具类型选择变化 */
+function handleChange(value: SelectValue) {
+  const toolTypeId = typeof value === 'number' ? value : undefined;
+  emit('update:modelValue', toolTypeId);
+  emit('change', list.value.find((item) => item.id === toolTypeId));
+}
+
+onMounted(getList);
+</script>
+
+<template>
+  <Select
+    :allow-clear="allowClear"
+    :disabled="disabled"
+    :field-names="{ label: 'name', value: 'id' }"
+    :options="list"
+    :placeholder="placeholder"
+    :value="modelValue"
+    class="w-full"
+    option-filter-prop="name"
+    show-search
+    @change="handleChange"
+  />
+</template>
diff --git a/apps/web-antd/src/views/mes/tm/tool/type/data.ts b/apps/web-antd/src/views/mes/tm/tool/type/data.ts
new file mode 100644
index 000000000..b3778f427
--- /dev/null
+++ b/apps/web-antd/src/views/mes/tm/tool/type/data.ts
@@ -0,0 +1,209 @@
+import type { VbenFormApi, VbenFormSchema } from '#/adapter/form';
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesTmToolTypeApi } from '#/api/mes/tm/tool/type';
+
+import { h } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
+import { Button } from 'ant-design-vue';
+
+import { z } from '#/adapter/form';
+import { generateAutoCode } from '#/api/mes/md/autocode/record';
+import { MesAutoCodeRuleCode, MesMaintenTypeEnum } from '#/views/mes/utils/constants';
+
+/** 新增/修改工具类型的表单 */
+export function useFormSchema(formApi?: VbenFormApi): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'code',
+      label: '类型编码',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入类型编码',
+      },
+      rules: 'required',
+      suffix: () =>
+        h(
+          Button,
+          {
+            type: 'default',
+            onClick: async () => {
+              const code = await generateAutoCode(MesAutoCodeRuleCode.TM_TOOL_TYPE_CODE);
+              await formApi?.setFieldValue('code', code);
+            },
+          },
+          { default: () => '生成' },
+        ),
+    },
+    {
+      fieldName: 'name',
+      label: '类型名称',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入类型名称',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'codeFlag',
+      label: '是否编码管理',
+      component: 'RadioGroup',
+      componentProps: {
+        buttonStyle: 'solid',
+        optionType: 'button',
+        options: getDictOptions(DICT_TYPE.INFRA_BOOLEAN_STRING, 'boolean'),
+      },
+      rules: z.boolean().default(true),
+    },
+    {
+      fieldName: 'maintenType',
+      label: '保养维护类型',
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: getDictOptions(DICT_TYPE.MES_TM_MAINTEN_TYPE, 'number'),
+        placeholder: '请选择保养维护类型',
+      },
+      dependencies: {
+        triggerFields: ['codeFlag'],
+        show: (values) => !!values.codeFlag,
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'maintenPeriod',
+      label: '保养周期',
+      component: 'InputNumber',
+      componentProps: {
+        class: '!w-full',
+        min: 1,
+        precision: 0,
+      },
+      dependencies: {
+        triggerFields: ['codeFlag', 'maintenType'],
+        show: (values) =>
+          !!values.codeFlag &&
+          [MesMaintenTypeEnum.REGULAR, MesMaintenTypeEnum.USAGE].includes(values.maintenType),
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      formItemClass: 'col-span-2',
+      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: 'maintenType',
+      label: '保养维护类型',
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: getDictOptions(DICT_TYPE.MES_TM_MAINTEN_TYPE, 'number'),
+        placeholder: '请选择保养维护类型',
+      },
+    },
+  ];
+}
+
+/** 列表的字段 */
+export function useGridColumns(): VxeTableGridOptions<MesTmToolTypeApi.ToolType>['columns'] {
+  return [
+    {
+      field: 'code',
+      title: '类型编码',
+      minWidth: 140,
+      slots: {
+        default: 'code',
+      },
+    },
+    { field: 'name', title: '类型名称', minWidth: 150 },
+    {
+      field: 'codeFlag',
+      title: '编码管理',
+      width: 120,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.INFRA_BOOLEAN_STRING },
+      },
+    },
+    {
+      field: 'maintenType',
+      title: '保养维护类型',
+      width: 140,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_TM_MAINTEN_TYPE },
+      },
+    },
+    {
+      field: 'maintenPeriod',
+      title: '保养周期',
+      width: 100,
+      formatter: ({ row }) => {
+        if (row.maintenPeriod == null) {
+          return '-';
+        }
+        if (row.maintenType === MesMaintenTypeEnum.REGULAR) {
+          return `${row.maintenPeriod} 天`;
+        }
+        if (row.maintenType === MesMaintenTypeEnum.USAGE) {
+          return `${row.maintenPeriod} 次`;
+        }
+        return '-';
+      },
+    },
+    {
+      field: 'createTime',
+      title: '创建时间',
+      width: 180,
+      formatter: 'formatDateTime',
+    },
+    {
+      title: '操作',
+      width: 180,
+      fixed: 'right',
+      slots: {
+        default: 'actions',
+      },
+    },
+  ];
+}
diff --git a/apps/web-antd/src/views/mes/tm/tool/type/index.vue b/apps/web-antd/src/views/mes/tm/tool/type/index.vue
new file mode 100644
index 000000000..4ce0188fc
--- /dev/null
+++ b/apps/web-antd/src/views/mes/tm/tool/type/index.vue
@@ -0,0 +1,153 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesTmToolTypeApi } from '#/api/mes/tm/tool/type';
+
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
+import { downloadFileFromBlobPart } from '@vben/utils';
+
+import { Button, message } from 'ant-design-vue';
+
+import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import { deleteToolType, exportToolType, getToolTypePage } from '#/api/mes/tm/tool/type';
+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({ type: 'create' }).open();
+}
+
+/** 查看工具类型 */
+function handleDetail(row: MesTmToolTypeApi.ToolType) {
+  formModalApi.setData({ id: row.id, type: 'detail' }).open();
+}
+
+/** 编辑工具类型 */
+function handleEdit(row: MesTmToolTypeApi.ToolType) {
+  formModalApi.setData({ id: row.id, type: 'update' }).open();
+}
+
+/** 删除工具类型 */
+async function handleDelete(row: MesTmToolTypeApi.ToolType) {
+  const hideLoading = message.loading({
+    content: $t('ui.actionMessage.deleting', [row.name]),
+    duration: 0,
+  });
+  try {
+    await deleteToolType(row.id!);
+    message.success($t('ui.actionMessage.deleteSuccess', [row.name]));
+    handleRefresh();
+  } finally {
+    hideLoading();
+  }
+}
+
+/** 导出工具类型 */
+async function handleExport() {
+  const data = await exportToolType(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) =>
+          await getToolTypePage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            ...formValues,
+          }),
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+  } as VxeTableGridOptions<MesTmToolTypeApi.ToolType>,
+});
+</script>
+
+<template>
+  <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【工具】工具类型、工装夹具台账"
+        url="https://doc.iocoder.cn/mes/tm/tool/"
+      />
+    </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:tm-tool-type:create'],
+              onClick: handleCreate,
+            },
+            {
+              label: $t('ui.actionTitle.export'),
+              type: 'primary',
+              icon: ACTION_ICON.DOWNLOAD,
+              auth: ['mes:tm-tool-type:export'],
+              onClick: handleExport,
+            },
+          ]"
+        />
+      </template>
+      <template #code="{ row }">
+        <Button type="link" @click="handleDetail(row)">{{ row.code }}</Button>
+      </template>
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: $t('common.edit'),
+              type: 'link',
+              icon: ACTION_ICON.EDIT,
+              auth: ['mes:tm-tool-type:update'],
+              onClick: handleEdit.bind(null, row),
+            },
+            {
+              label: $t('common.delete'),
+              type: 'link',
+              danger: true,
+              icon: ACTION_ICON.DELETE,
+              auth: ['mes:tm-tool-type: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/tm/tool/type/modules/form.vue b/apps/web-antd/src/views/mes/tm/tool/type/modules/form.vue
new file mode 100644
index 000000000..9a4897340
--- /dev/null
+++ b/apps/web-antd/src/views/mes/tm/tool/type/modules/form.vue
@@ -0,0 +1,102 @@
+<script lang="ts" setup>
+import type { MesTmToolTypeApi } from '#/api/mes/tm/tool/type';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { message } from 'ant-design-vue';
+
+import { useVbenForm } from '#/adapter/form';
+import { createToolType, getToolType, updateToolType } from '#/api/mes/tm/tool/type';
+import { $t } from '#/locales';
+
+import { useFormSchema } from '../data';
+
+type FormMode = 'create' | 'detail' | 'update';
+
+const emit = defineEmits(['success']);
+const formMode = ref<FormMode>('create'); // 表单模式
+const formData = ref<MesTmToolTypeApi.ToolType>();
+
+const isDetail = computed(() => formMode.value === 'detail'); // 是否查看模式
+const getTitle = computed(() => {
+  if (formMode.value === 'detail') {
+    return $t('ui.actionTitle.view', ['工具类型']);
+  }
+  return formMode.value === 'update'
+    ? $t('ui.actionTitle.edit', ['工具类型'])
+    : $t('ui.actionTitle.create', ['工具类型']);
+});
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-1',
+    labelWidth: 120,
+  },
+  wrapperClass: 'grid-cols-2',
+  layout: 'horizontal',
+  schema: [],
+  showDefaultActions: false,
+});
+
+/** 表单 schema 需要 formApi 引用，所以通过 setState 设置 schema */
+formApi.setState({ schema: useFormSchema(formApi) });
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    if (isDetail.value) {
+      await modalApi.close();
+      return;
+    }
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    const data = (await formApi.getValues()) as MesTmToolTypeApi.ToolType;
+    try {
+      await (data.id ? updateToolType(data) : createToolType(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; type?: FormMode }>();
+    formMode.value = data?.type || 'create';
+    formApi.setDisabled(formMode.value === 'detail');
+    modalApi.setState({ showConfirmButton: formMode.value !== 'detail' });
+    if (!data?.id) {
+      return;
+    }
+    modalApi.lock();
+    try {
+      formData.value = await getToolType(data.id);
+      // 设置到 values
+      await formApi.setValues(formData.value);
+    } finally {
+      modalApi.unlock();
+    }
+  },
+});
+</script>
+
+<template>
+  <Modal :title="getTitle" class="w-2/5">
+    <Form class="mx-4" />
+  </Modal>
+</template>
diff --git a/apps/web-antd/src/views/mes/utils/constants.ts b/apps/web-antd/src/views/mes/utils/constants.ts
index bc7a2a5fe..a436eabd5 100644
--- a/apps/web-antd/src/views/mes/utils/constants.ts
+++ b/apps/web-antd/src/views/mes/utils/constants.ts
@@ -1,3 +1,13 @@
+/** MES 单据状态常量 */
+export const MesOrderStatusConstants = {
+  DRAFT: 0,
+  CONFIRMED: 1,
+  APPROVING: 2,
+  APPROVED: 3,
+  FINISHED: 4,
+  CANCELLED: 5,
+} as const;
+
 /** MES 物料/产品标识枚举 */
 export const MesItemOrProductEnum = {
   ITEM: {
@@ -10,14 +20,181 @@ export const MesItemOrProductEnum = {
   },
 } as const;
 
+/** MES 工具状态枚举 */
+export const MesToolStatusEnum = {
+  STORE: 1,
+  ISSUE: 2,
+  REPAIR: 3,
+  SCRAP: 4,
+} as const;
+
+/** MES 保养维护类型枚举 */
+export const MesMaintenTypeEnum = {
+  REGULAR: 1,
+  USAGE: 2,
+} as const;
+
+/** MES 设备状态枚举 */
+export const MesDvMachineryStatusEnum = {
+  STOP: 1,
+  PRODUCING: 2,
+  MAINTENANCE: 3,
+} as const;
+
+/** MES 假期类型枚举 */
+export const HolidayType = {
+  WORKDAY: 1,
+  HOLIDAY: 2,
+} as const;
+
+/** MES 排班计划状态枚举 */
+export const MesCalPlanStatusEnum = {
+  PREPARE: 0,
+  CONFIRMED: 1,
+} as const;
+
+/** MES 轮班方式枚举 */
+export const MesCalShiftTypeEnum = {
+  SINGLE: 1,
+  TWO: 2,
+  THREE: 3,
+} as const;
+
+/** MES 倒班方式枚举 */
+export const MesCalShiftMethodEnum = {
+  QUARTER: 1,
+  MONTH: 2,
+  WEEK: 3,
+  DAY: 4,
+} as const;
+
+/** MES 点检保养项目类型枚举 */
+export const MesDvSubjectTypeEnum = {
+  CHECK: 1,
+  MAINTENANCE: 2,
+} as const;
+
+/** MES 点检保养方案状态枚举 */
+export const MesDvCheckPlanStatusEnum = {
+  PREPARE: 0,
+  ENABLED: 1,
+} as const;
+
+/** MES 设备保养记录状态枚举 */
+export const MesDvMaintenRecordStatusEnum = {
+  PREPARE: MesOrderStatusConstants.DRAFT,
+  SUBMITTED: MesOrderStatusConstants.FINISHED,
+} as const;
+
+/** MES 设备保养明细结果枚举 */
+export const MesDvMaintenStatusEnum = {
+  NORMAL: 1,
+  ABNORMAL: 2,
+} as const;
+
+/** MES 设备点检记录状态枚举 */
+export const MesDvCheckRecordStatusEnum = {
+  DRAFT: 10,
+  FINISHED: 20,
+} as const;
+
+/** MES 设备点检结果枚举 */
+export const MesDvCheckResultEnum = {
+  NORMAL: 1,
+  ABNORMAL: 2,
+} as const;
+
+/** MES 维修工单状态枚举 */
+export const MesDvRepairStatusEnum = {
+  PREPARE: MesOrderStatusConstants.DRAFT,
+  CONFIRMED: MesOrderStatusConstants.CONFIRMED,
+  APPROVING: MesOrderStatusConstants.APPROVING,
+  FINISHED: MesOrderStatusConstants.FINISHED,
+} as const;
+
+/** MES 维修结果枚举 */
+export const MesDvRepairResultEnum = {
+  PASS: 1,
+  FAIL: 2,
+} as const;
+
 /** MES 自动编码规则 Code 枚举 */
 export const MesAutoCodeRuleCode = {
+  CAL_PLAN_CODE: 'CAL_PLAN_CODE',
+  CAL_TEAM_CODE: 'CAL_TEAM_CODE',
+  DV_CHECK_PLAN_CODE: 'DV_CHECK_PLAN_CODE',
+  DV_MACHINERY_TYPE_CODE: 'DV_MACHINERY_TYPE_CODE',
+  DV_MACHINERY_CODE: 'DV_MACHINERY_CODE',
+  DV_REPAIR_CODE: 'DV_REPAIR_CODE',
+  DV_SUBJECT_CODE: 'DV_SUBJECT_CODE',
   MD_CLIENT_CODE: 'MD_CLIENT_CODE',
   MD_ITEM_TYPE_CODE: 'MD_ITEM_TYPE_CODE',
   MD_ITEM_CODE: 'MD_ITEM_CODE',
   MD_VENDOR_CODE: 'MD_VENDOR_CODE',
   MD_WORKSTATION_CODE: 'MD_WORKSTATION_CODE',
   MD_WORKSHOP_CODE: 'MD_WORKSHOP_CODE',
+  PRO_CARD_CODE: 'PRO_CARD_CODE',
+  PRO_FEEDBACK_CODE: 'PRO_FEEDBACK_CODE',
+  PRO_PROCESS_CODE: 'PRO_PROCESS_CODE',
+  PRO_ROUTE_CODE: 'PRO_ROUTE_CODE',
+  PRO_TASK_CODE: 'PRO_TASK_CODE',
+  PRO_WORK_ORDER_CODE: 'PRO_WORK_ORDER_CODE',
+  TM_TOOL_TYPE_CODE: 'TM_TOOL_TYPE_CODE',
+  TM_TOOL_CODE: 'TM_TOOL_CODE',
+} as const;
+
+/** MES 生产工单状态枚举 */
+export const MesProWorkOrderStatusEnum = {
+  PREPARE: MesOrderStatusConstants.DRAFT,
+  CONFIRMED: MesOrderStatusConstants.CONFIRMED,
+  APPROVING: MesOrderStatusConstants.APPROVING,
+  PRODUCING: MesOrderStatusConstants.APPROVED,
+  FINISHED: MesOrderStatusConstants.FINISHED,
+  CANCELLED: MesOrderStatusConstants.CANCELLED,
+} as const;
+
+/** MES 生产任务状态枚举 */
+export const MesProTaskStatusEnum = {
+  PREPARE: MesOrderStatusConstants.DRAFT,
+  CONFIRMED: MesOrderStatusConstants.CONFIRMED,
+  APPROVING: MesOrderStatusConstants.APPROVING,
+  PRODUCING: MesOrderStatusConstants.APPROVED,
+  FINISHED: MesOrderStatusConstants.FINISHED,
+  CANCELLED: MesOrderStatusConstants.CANCELLED,
+} as const;
+
+/** MES 生产报工状态枚举 */
+export const MesProFeedbackStatusEnum = {
+  PREPARE: MesOrderStatusConstants.DRAFT,
+  CONFIRMED: MesOrderStatusConstants.CONFIRMED,
+  APPROVING: MesOrderStatusConstants.APPROVING,
+  FINISHED: MesOrderStatusConstants.FINISHED,
+  CANCELLED: MesOrderStatusConstants.CANCELLED,
+} as const;
+
+/** MES 流转卡状态枚举 */
+export const MesProCardStatusEnum = {
+  PREPARE: MesOrderStatusConstants.DRAFT,
+  ISSUED: MesOrderStatusConstants.CONFIRMED,
+  PRODUCING: MesOrderStatusConstants.APPROVED,
+  FINISHED: MesOrderStatusConstants.FINISHED,
+  CANCELLED: MesOrderStatusConstants.CANCELLED,
+} as const;
+
+/** MES 安灯类型枚举 */
+export const MesProAndonTypeEnum = {
+  QUALITY: 1,
+  EQUIPMENT: 2,
+  MATERIAL: 3,
+  PROCESS: 4,
+  OTHER: 9,
+} as const;
+
+/** MES 安灯状态枚举 */
+export const MesProAndonStatusEnum = {
+  TRIGGERED: 1,
+  HANDLING: 2,
+  CLOSED: 3,
 } as const;
 
 /** MES 编码规则分段类型枚举 */
diff --git a/apps/web-ele/package.json b/apps/web-ele/package.json
index d842d8261..93e86be9e 100644
--- a/apps/web-ele/package.json
+++ b/apps/web-ele/package.json
@@ -60,6 +60,7 @@
     "pinia": "catalog:",
     "steady-xml": "catalog:",
     "tinymce": "catalog:",
+    "tyme4ts": "catalog:",
     "video.js": "catalog:",
     "vue": "catalog:",
     "vue-dompurify-html": "catalog:",
diff --git a/apps/web-ele/src/api/iot/rule/scene/index.ts b/apps/web-ele/src/api/iot/rule/scene/index.ts
index f09519f06..23549f1ad 100644
--- a/apps/web-ele/src/api/iot/rule/scene/index.ts
+++ b/apps/web-ele/src/api/iot/rule/scene/index.ts
@@ -24,8 +24,7 @@ export namespace RuleSceneApi {
     operator?: string;
     value?: any;
     cronExpression?: string;
-    // 后端结构：List<List<TriggerCondition>>；外层「或」、组内「且」
-    conditionGroups?: TriggerCondition[][];
+    conditionGroups?: TriggerCondition[][]; // 后端结构：List<List<TriggerCondition>>；外层「或」、组内「且」
   }
 
   /**  场景联动规则的触发条件 */
@@ -81,13 +80,6 @@ export function deleteSceneRule(id: number) {
   return requestClient.delete(`/iot/scene-rule/delete?id=${id}`);
 }
 
-/** 批量删除场景联动规则 */
-export function deleteSceneRuleList(ids: number[]) {
-  return requestClient.delete('/iot/scene-rule/delete-list', {
-    params: { ids: ids.join(',') },
-  });
-}
-
 /** 更新场景联动规则状态 */
 export function updateSceneRuleStatus(id: number, status: number) {
   return requestClient.put(`/iot/scene-rule/update-status`, {
diff --git a/apps/web-ele/src/api/iot/thingmodel/index.ts b/apps/web-ele/src/api/iot/thingmodel/index.ts
index 210e8d08b..d6bcc3f1b 100644
--- a/apps/web-ele/src/api/iot/thingmodel/index.ts
+++ b/apps/web-ele/src/api/iot/thingmodel/index.ts
@@ -148,8 +148,8 @@ export const ThingModelFormRules: Record<string, FormItemRule[]> = {
   identifier: [
     { required: true, message: '标识符不能为空', trigger: 'blur' },
     {
-      pattern: /^\w{1,50}$/,
-      message: '支持大小写字母、数字和下划线，不超过 50 个字符',
+      pattern: /^[a-zA-Z][a-zA-Z0-9_]{0,31}$/,
+      message: '支持大小写字母、数字和下划线，必须以字母开头，不超过 32 个字符',
       trigger: 'blur',
     },
     {
diff --git a/apps/web-ele/src/api/mes/dv/machinery/index.ts b/apps/web-ele/src/api/mes/dv/machinery/index.ts
index e4c02f1c4..07a3190b6 100644
--- a/apps/web-ele/src/api/mes/dv/machinery/index.ts
+++ b/apps/web-ele/src/api/mes/dv/machinery/index.ts
@@ -20,6 +20,13 @@ export namespace MesDvMachineryApi {
     remark?: string; // 备注
     createTime?: Date; // 创建时间
   }
+
+  /** 设备导入结果 */
+  export interface MachineryImportRespVO {
+    createCodes?: string[]; // 新增成功的设备编码
+    failureCodes?: Record<string, string>; // 导入失败的设备编码及原因
+    updateCodes?: string[]; // 更新成功的设备编码
+  }
 }
 
 /** 查询设备分页 */
@@ -43,3 +50,36 @@ export function getMachinery(id: number) {
     `/mes/dv/machinery/get?id=${id}`,
   );
 }
+
+/** 新增设备 */
+export function createMachinery(data: MesDvMachineryApi.Machinery) {
+  return requestClient.post('/mes/dv/machinery/create', data);
+}
+
+/** 修改设备 */
+export function updateMachinery(data: MesDvMachineryApi.Machinery) {
+  return requestClient.put('/mes/dv/machinery/update', data);
+}
+
+/** 删除设备 */
+export function deleteMachinery(id: number) {
+  return requestClient.delete(`/mes/dv/machinery/delete?id=${id}`);
+}
+
+/** 导出设备 */
+export function exportMachinery(params: any) {
+  return requestClient.download('/mes/dv/machinery/export-excel', { params });
+}
+
+/** 下载设备导入模板 */
+export function importMachineryTemplate() {
+  return requestClient.download('/mes/dv/machinery/get-import-template');
+}
+
+/** 导入设备 */
+export function importMachinery(file: File, updateSupport: boolean) {
+  return requestClient.upload<MesDvMachineryApi.MachineryImportRespVO>(
+    `/mes/dv/machinery/import?updateSupport=${updateSupport}`,
+    { file },
+  );
+}
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
index d33e6e0fc..6955e7304 100644
--- a/apps/web-ele/src/api/mes/md/autocode/rule/index.ts
+++ b/apps/web-ele/src/api/mes/md/autocode/rule/index.ts
@@ -51,7 +51,5 @@ export function deleteAutoCodeRule(id: number) {
 
 /** 导出编码规则 */
 export function exportAutoCodeRule(params: PageParam) {
-  return requestClient.download('/mes/md/auto-code-rule/export-excel', {
-    params,
-  });
+  return requestClient.download('/mes/md/auto-code-rule/export-excel', { params });
 }
diff --git a/apps/web-ele/src/api/mes/md/item/index.ts b/apps/web-ele/src/api/mes/md/item/index.ts
index f2a23c0e6..9d3b107f8 100644
--- a/apps/web-ele/src/api/mes/md/item/index.ts
+++ b/apps/web-ele/src/api/mes/md/item/index.ts
@@ -34,9 +34,7 @@ export namespace MesMdItemApi {
 
 /** 查询物料产品分页 */
 export function getItemPage(params: PageParam) {
-  return requestClient.get<PageResult<MesMdItemApi.Item>>('/mes/md/item/page', {
-    params,
-  });
+  return requestClient.get<PageResult<MesMdItemApi.Item>>('/mes/md/item/page', { params });
 }
 
 /** 查询物料产品详情 */
diff --git a/apps/web-ele/src/api/mes/pro/process/index.ts b/apps/web-ele/src/api/mes/pro/process/index.ts
index 5a3893b18..a4ff1ea64 100644
--- a/apps/web-ele/src/api/mes/pro/process/index.ts
+++ b/apps/web-ele/src/api/mes/pro/process/index.ts
@@ -5,7 +5,7 @@ import { requestClient } from '#/api/request';
 export namespace MesProProcessApi {
   /** MES 生产工序 */
   export interface Process {
-    id: number;
+    id?: number;
     code?: string;
     name?: string;
     attention?: string;
@@ -36,3 +36,23 @@ export function getProcess(id: number) {
     `/mes/pro/process/get?id=${id}`,
   );
 }
+
+/** 新增生产工序 */
+export function createProcess(data: MesProProcessApi.Process) {
+  return requestClient.post('/mes/pro/process/create', data);
+}
+
+/** 修改生产工序 */
+export function updateProcess(data: MesProProcessApi.Process) {
+  return requestClient.put('/mes/pro/process/update', data);
+}
+
+/** 删除生产工序 */
+export function deleteProcess(id: number) {
+  return requestClient.delete(`/mes/pro/process/delete?id=${id}`);
+}
+
+/** 导出生产工序 Excel */
+export function exportProcess(params: any) {
+  return requestClient.download('/mes/pro/process/export-excel', { params });
+}
diff --git a/apps/web-ele/src/api/mes/tm/tool/type/index.ts b/apps/web-ele/src/api/mes/tm/tool/type/index.ts
index cced608cc..7ef6b2c59 100644
--- a/apps/web-ele/src/api/mes/tm/tool/type/index.ts
+++ b/apps/web-ele/src/api/mes/tm/tool/type/index.ts
@@ -18,22 +18,35 @@ export namespace MesTmToolTypeApi {
 
 /** 查询工具类型分页 */
 export function getToolTypePage(params: PageParam) {
-  return requestClient.get<PageResult<MesTmToolTypeApi.ToolType>>(
-    '/mes/tm/tool-type/page',
-    { params },
-  );
+  return requestClient.get<PageResult<MesTmToolTypeApi.ToolType>>('/mes/tm/tool-type/page', { params });
 }
 
 /** 查询工具类型精简列表 */
 export function getToolTypeSimpleList() {
-  return requestClient.get<MesTmToolTypeApi.ToolType[]>(
-    '/mes/tm/tool-type/simple-list',
-  );
+  return requestClient.get<MesTmToolTypeApi.ToolType[]>('/mes/tm/tool-type/simple-list');
 }
 
 /** 查询工具类型详情 */
 export function getToolType(id: number) {
-  return requestClient.get<MesTmToolTypeApi.ToolType>(
-    `/mes/tm/tool-type/get?id=${id}`,
-  );
+  return requestClient.get<MesTmToolTypeApi.ToolType>(`/mes/tm/tool-type/get?id=${id}`);
+}
+
+/** 新增工具类型 */
+export function createToolType(data: MesTmToolTypeApi.ToolType) {
+  return requestClient.post('/mes/tm/tool-type/create', data);
+}
+
+/** 修改工具类型 */
+export function updateToolType(data: MesTmToolTypeApi.ToolType) {
+  return requestClient.put('/mes/tm/tool-type/update', data);
+}
+
+/** 删除工具类型 */
+export function deleteToolType(id: number) {
+  return requestClient.delete(`/mes/tm/tool-type/delete?id=${id}`);
+}
+
+/** 导出工具类型 */
+export function exportToolType(params: any) {
+  return requestClient.download('/mes/tm/tool-type/export-excel', { params });
 }
diff --git a/apps/web-ele/src/assets/imgs/iot/device.png b/apps/web-ele/src/assets/imgs/iot/device.png
new file mode 100644
index 000000000..79339cdf4
Binary files /dev/null and b/apps/web-ele/src/assets/imgs/iot/device.png differ
diff --git a/apps/web-ele/src/assets/svgs/iot/cube.svg b/apps/web-ele/src/assets/svgs/iot/cube.svg
new file mode 100644
index 000000000..200ac1b1c
--- /dev/null
+++ b/apps/web-ele/src/assets/svgs/iot/cube.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" fill="none" viewBox="0 0 12 12"><g clip-path="url(#a)"><path fill="url(#b)" fill-rule="evenodd" d="M6.958.42C6.444.216 5.61.216 5.098.42L1.15 1.975c-.77.304-.77.797 0 1.1l3.947 1.558c.514.202 1.347.202 1.86 0l3.948-1.557c.77-.304.77-.797 0-1.1L6.958.418ZM4.715 11.788a.857.857 0 0 0 .3.056c.383 0 .671-.295.671-.7V6.404c0-.49-.364-1.007-.817-1.177L1.09 3.805a.808.808 0 0 0-.284-.056c-.353 0-.581.275-.581.7V9.19c0 .508.33 1.014.763 1.177l3.726 1.422Zm2.229-.024h-.02l.073.003c.074.004.154.009.227-.019L11 10.367c.45-.168.83-.686.83-1.177V4.45c0-.413-.29-.7-.673-.7a.965.965 0 0 0-.317.055l-3.72 1.422c-.44.165-.75.67-.75 1.177v4.74c0 .42.218.621.575.621Z" clip-rule="evenodd"/></g><defs><linearGradient id="b" x1=".226" x2="11.803" y1=".267" y2="11.871" gradientUnits="userSpaceOnUse"><stop stop-color="#1B3149"/><stop offset="1" stop-color="#717D8A"/></linearGradient><clipPath id="a"><path fill="#fff" d="M0 0h12v12H0z"/></clipPath></defs></svg>
\ No newline at end of file
diff --git a/apps/web-ele/src/components/shortcut-date-range-picker/shortcut-date-range-picker.vue b/apps/web-ele/src/components/shortcut-date-range-picker/shortcut-date-range-picker.vue
index fc5028c2c..8b8295b0b 100644
--- a/apps/web-ele/src/components/shortcut-date-range-picker/shortcut-date-range-picker.vue
+++ b/apps/web-ele/src/components/shortcut-date-range-picker/shortcut-date-range-picker.vue
@@ -18,27 +18,23 @@ const emits = defineEmits<{
 const times = ref<[Dayjs, Dayjs]>(); // 日期范围
 
 const rangePickerProps = getRangePickerDefaultProps();
-
 const timeRangeOptions = [
   {
-    label: '昨天',
+    label: rangePickerProps.shortcuts[1]!.text,
+    value: () => rangePickerProps.shortcuts[1]!.value() as [Dayjs, Dayjs],
+  },
+  {
+    label: rangePickerProps.shortcuts[2]!.text,
     value: () => [
-      dayjs().subtract(1, 'day').startOf('day'),
+      dayjs().subtract(7, 'day').startOf('day'),
       dayjs().subtract(1, 'day').endOf('day'),
     ],
   },
   {
-    label: '最近 7 天',
-    value: () => [
-      dayjs().subtract(7, 'day').startOf('day'),
-      dayjs().endOf('day'),
-    ],
-  },
-  {
-    label: '最近 30 天',
+    label: rangePickerProps.shortcuts[3]!.text,
     value: () => [
       dayjs().subtract(30, 'day').startOf('day'),
-      dayjs().endOf('day'),
+      dayjs().subtract(1, 'day').endOf('day'),
     ],
   },
 ];
diff --git a/apps/web-ele/src/components/upload/file-upload.vue b/apps/web-ele/src/components/upload/file-upload.vue
index 5ccb324f3..476027582 100644
--- a/apps/web-ele/src/components/upload/file-upload.vue
+++ b/apps/web-ele/src/components/upload/file-upload.vue
@@ -35,6 +35,7 @@ const props = withDefaults(defineProps<FileUploadProps>(), {
   multiple: false,
   api: undefined,
   resultField: '',
+  returnText: false,
   showDescription: false,
 });
 const emit = defineEmits([
@@ -163,9 +164,6 @@ function handleUploadError(error: any) {
  */
 /* eslint-disable unicorn/no-nested-ternary */
 async function beforeUpload(file: File) {
-  const fileContent = await file.text();
-  emit('returnText', fileContent);
-
   // 检查文件数量限制（使用 getValue 获取实际已上传的文件数量）
   const currentFiles = getValue();
   const currentCount = Array.isArray(currentFiles)
@@ -198,6 +196,10 @@ async function beforeUpload(file: File) {
 
   // 只有在验证通过后才增加计数器
   uploadNumber.value++;
+  if (props.returnText) {
+    const fileContent = await file.text();
+    emit('returnText', fileContent);
+  }
   return true;
 }
 
diff --git a/apps/web-ele/src/components/upload/input-upload.vue b/apps/web-ele/src/components/upload/input-upload.vue
index 3b0e4f9a7..6ae7c85bd 100644
--- a/apps/web-ele/src/components/upload/input-upload.vue
+++ b/apps/web-ele/src/components/upload/input-upload.vue
@@ -58,6 +58,7 @@ const textareaProps = computed(() => {
 const fileUploadProps = computed(() => {
   return {
     ...props.fileUploadProps,
+    returnText: true,
   };
 });
 </script>
diff --git a/apps/web-ele/src/components/upload/typing.ts b/apps/web-ele/src/components/upload/typing.ts
index b8eae713c..ced57443e 100644
--- a/apps/web-ele/src/components/upload/typing.ts
+++ b/apps/web-ele/src/components/upload/typing.ts
@@ -27,6 +27,7 @@ export interface FileUploadProps {
   maxSize?: number; // 文件最大多少 MB
   multiple?: boolean; // 是否支持多选
   resultField?: string; // support xxx.xxx.xx
+  returnText?: boolean; // 是否返回文件文本内容
   showDescription?: boolean; // 是否显示下面的描述
   value?: string | string[];
 }
diff --git a/apps/web-ele/src/router/routes/modules/iot.ts b/apps/web-ele/src/router/routes/modules/iot.ts
index 04cf97d35..a1d2203b9 100644
--- a/apps/web-ele/src/router/routes/modules/iot.ts
+++ b/apps/web-ele/src/router/routes/modules/iot.ts
@@ -12,7 +12,7 @@ const routes: RouteRecordRaw[] = [
     },
     children: [
       {
-        path: 'product/detail/:id',
+        path: 'product/product/detail/:id',
         name: 'IoTProductDetail',
         meta: {
           title: '产品详情',
@@ -30,11 +30,11 @@ const routes: RouteRecordRaw[] = [
         component: () => import('#/views/iot/device/device/detail/index.vue'),
       },
       {
-        path: 'ota/firmware/detail/:id',
+        path: 'ota/operation/firmware/detail/:id',
         name: 'IoTOtaFirmwareDetail',
         meta: {
           title: '固件详情',
-          activePath: '/iot/ota',
+          activePath: '/iot/operation/ota/firmware',
         },
         component: () => import('#/views/iot/ota/firmware/detail/index.vue'),
       },
diff --git a/apps/web-ele/src/views/iot/alert/record/data.ts b/apps/web-ele/src/views/iot/alert/record/data.ts
index 52f373b5d..1171c6412 100644
--- a/apps/web-ele/src/views/iot/alert/record/data.ts
+++ b/apps/web-ele/src/views/iot/alert/record/data.ts
@@ -62,13 +62,27 @@ export function useGridFormSchema(): VbenFormSchema[] {
       label: '设备',
       component: 'ApiSelect',
       componentProps: {
-        api: getSimpleDeviceList,
+        api: (params?: { productId?: number }) =>
+          getSimpleDeviceList(undefined, params?.productId),
         labelField: 'deviceName',
         valueField: 'id',
         placeholder: '请选择设备',
         clearable: true,
         filterable: true,
       },
+      dependencies: {
+        triggerFields: ['productId'],
+        componentProps: (values) => {
+          return {
+            params: { productId: values.productId },
+          };
+        },
+        trigger: (values, formApi) => {
+          if (values.deviceId !== undefined) {
+            void formApi.setFieldValue('deviceId', undefined);
+          }
+        },
+      },
     },
     {
       fieldName: 'processStatus',
diff --git a/apps/web-ele/src/views/iot/alert/record/index.vue b/apps/web-ele/src/views/iot/alert/record/index.vue
index 70f81d3a1..8fac6df84 100644
--- a/apps/web-ele/src/views/iot/alert/record/index.vue
+++ b/apps/web-ele/src/views/iot/alert/record/index.vue
@@ -44,12 +44,6 @@ async function handleProcess(row: AlertRecordApi.AlertRecord) {
         cancelButtonText: '取消',
         inputType: 'textarea',
         inputPlaceholder: '请输入处理原因',
-        inputValidator: (value: string) => {
-          if (!value) {
-            return '请输入处理原因';
-          }
-          return true;
-        },
       },
     );
     const loadingInstance = ElLoading.service({ text: '正在处理...' });
diff --git a/apps/web-ele/src/views/iot/device/device/data.ts b/apps/web-ele/src/views/iot/device/device/data.ts
index a2ee12b7c..8dc739d2f 100644
--- a/apps/web-ele/src/views/iot/device/device/data.ts
+++ b/apps/web-ele/src/views/iot/device/device/data.ts
@@ -79,10 +79,18 @@ export function useAdvancedFormSchema(): VbenFormSchema[] {
       },
       rules: z
         .string()
-        .min(4, '备注名称长度限制为 4~64 个字符')
-        .max(64, '备注名称长度限制为 4~64 个字符')
-        .regex(
-          /^[\u4E00-\u9FA5\u3040-\u30FF\w]+$/,
+        .refine(
+          (value) => {
+            const length = value.replaceAll(
+              /[\u4E00-\u9FA5\u3040-\u30FF]/g,
+              'aa',
+            ).length;
+            return length >= 4 && length <= 64;
+          },
+          '备注名称长度限制为 4~64 个字符，中文及日文算 2 个字符',
+        )
+        .refine(
+          (value) => /^[\u4E00-\u9FA5\u3040-\u30FF\w]+$/.test(value),
           '备注名称只能包含中文、英文字母、日文、数字和下划线（_）',
         )
         .optional()
@@ -276,6 +284,7 @@ export function useGridColumns(): VxeTableGridOptions<IotDeviceApi.Device>['colu
       field: 'deviceName',
       title: 'DeviceName',
       minWidth: 150,
+      slots: { default: 'deviceName' },
     },
     {
       field: 'nickname',
diff --git a/apps/web-ele/src/views/iot/device/device/detail/index.vue b/apps/web-ele/src/views/iot/device/device/detail/index.vue
index 7173de87b..9718f0097 100644
--- a/apps/web-ele/src/views/iot/device/device/detail/index.vue
+++ b/apps/web-ele/src/views/iot/device/device/detail/index.vue
@@ -97,7 +97,7 @@ onMounted(async () => {
     <ElTabs v-model="activeTab" class="mt-4">
       <ElTabPane name="info" label="设备信息">
         <DeviceDetailsInfo
-          v-if="activeTab === 'info'"
+          v-if="activeTab === 'info' && device.id"
           :device="device"
           :product="product"
         />
@@ -127,7 +127,7 @@ onMounted(async () => {
       </ElTabPane>
       <ElTabPane name="simulator" label="模拟设备">
         <DeviceDetailsSimulator
-          v-if="activeTab === 'simulator'"
+          v-if="activeTab === 'simulator' && device.id"
           :device="device"
           :product="product"
           :thing-model-list="thingModelList"
@@ -135,7 +135,7 @@ onMounted(async () => {
       </ElTabPane>
       <ElTabPane name="config" label="设备配置">
         <DeviceDetailConfig
-          v-if="activeTab === 'config'"
+          v-if="activeTab === 'config' && device.id"
           :device="device"
           @success="() => getDeviceData(id)"
         />
@@ -151,7 +151,7 @@ onMounted(async () => {
         label="Modbus 配置"
       >
         <DeviceModbusConfig
-          v-if="activeTab === 'modbus'"
+          v-if="activeTab === 'modbus' && device.id"
           :device="device"
           :product="product"
           :thing-model-list="thingModelList"
diff --git a/apps/web-ele/src/views/iot/device/device/detail/modules/info.vue b/apps/web-ele/src/views/iot/device/device/detail/modules/info.vue
index a4aaed8ac..efea6d5be 100644
--- a/apps/web-ele/src/views/iot/device/device/detail/modules/info.vue
+++ b/apps/web-ele/src/views/iot/device/device/detail/modules/info.vue
@@ -38,9 +38,9 @@ const authInfo = ref<IotDeviceApi.DeviceAuthInfoRespVO>(
 );
 const mapDialogRef = ref<InstanceType<typeof MapDialog>>();
 
-/** 是否有位置信息 */
+/** 是否有位置信息（合法经纬度 0 不应视为空） */
 const hasLocation = computed(() => {
-  return !!(props.device.longitude && props.device.latitude);
+  return props.device.longitude != null && props.device.latitude != null;
 });
 
 /** 打开地图弹窗 */
diff --git a/apps/web-ele/src/views/iot/device/device/detail/modules/message.vue b/apps/web-ele/src/views/iot/device/device/detail/modules/message.vue
index efcc24e8a..333449ca7 100644
--- a/apps/web-ele/src/views/iot/device/device/detail/modules/message.vue
+++ b/apps/web-ele/src/views/iot/device/device/detail/modules/message.vue
@@ -31,6 +31,7 @@ const queryParams = reactive({
 
 const autoRefresh = ref(false); // 自动刷新开关
 let autoRefreshTimer: any = null; // 自动刷新定时器
+let refreshTimer: ReturnType<typeof setTimeout> | undefined; // 延迟刷新定时器
 
 /** 消息方法选项 */
 const methodOptions = computed(() => {
@@ -150,6 +151,10 @@ onBeforeUnmount(() => {
     clearInterval(autoRefreshTimer);
     autoRefreshTimer = null;
   }
+  if (refreshTimer) {
+    clearTimeout(refreshTimer);
+    refreshTimer = undefined;
+  }
 });
 
 /** 初始化 */
@@ -161,9 +166,14 @@ onMounted(() => {
 
 /** 刷新消息列表 */
 function refresh(delay = 0) {
+  if (refreshTimer) {
+    clearTimeout(refreshTimer);
+    refreshTimer = undefined;
+  }
   if (delay > 0) {
-    setTimeout(() => {
+    refreshTimer = setTimeout(() => {
       gridApi.query();
+      refreshTimer = undefined;
     }, delay);
   } else {
     gridApi.query();
diff --git a/apps/web-ele/src/views/iot/device/device/detail/modules/modbus-config-form.vue b/apps/web-ele/src/views/iot/device/device/detail/modules/modbus-config-form.vue
index d060e07b8..ef256d60f 100644
--- a/apps/web-ele/src/views/iot/device/device/detail/modules/modbus-config-form.vue
+++ b/apps/web-ele/src/views/iot/device/device/detail/modules/modbus-config-form.vue
@@ -58,11 +58,13 @@ const [Form, formApi] = useVbenForm({
       componentProps: {
         placeholder: '请输入 Modbus 服务器 IP 地址',
       },
+      // Client 模式专有字段：必填；Server 模式不显示也不校验
       dependencies: {
         triggerFields: [''],
-        show: () => isClient.value, // Client 模式专有字段：IP 地址
+        show: () => isClient.value,
+        rules: () =>
+          isClient.value ? z.string().min(1, '请输入 IP 地址') : null,
       },
-      rules: z.string().min(1, '请输入 IP 地址').optional(),
     },
     {
       fieldName: 'port',
@@ -76,9 +78,12 @@ const [Form, formApi] = useVbenForm({
       },
       dependencies: {
         triggerFields: [''],
-        show: () => isClient.value, // Client 模式专有字段：端口
+        show: () => isClient.value,
+        rules: () =>
+          isClient.value
+            ? z.number({ message: '请输入端口' }).min(1).max(65_535)
+            : null,
       },
-      rules: z.number().min(1).max(65_535).optional(),
       defaultValue: 502,
     },
     {
@@ -106,9 +111,12 @@ const [Form, formApi] = useVbenForm({
       },
       dependencies: {
         triggerFields: [''],
-        show: () => isClient.value, // Client 模式专有字段：连接超时
+        show: () => isClient.value,
+        rules: () =>
+          isClient.value
+            ? z.number({ message: '请输入连接超时时间' }).min(1000)
+            : null,
       },
-      rules: z.number().min(1000).optional(),
       defaultValue: 3000,
     },
     {
@@ -123,9 +131,12 @@ const [Form, formApi] = useVbenForm({
       },
       dependencies: {
         triggerFields: [''],
-        show: () => isClient.value, // Client 模式专有字段：重试间隔
+        show: () => isClient.value,
+        rules: () =>
+          isClient.value
+            ? z.number({ message: '请输入重试间隔' }).min(1000)
+            : null,
       },
-      rules: z.number().min(1000).optional(),
       defaultValue: 10_000,
     },
     {
diff --git a/apps/web-ele/src/views/iot/device/device/detail/modules/modbus-config.vue b/apps/web-ele/src/views/iot/device/device/detail/modules/modbus-config.vue
index 8d6afdd1d..64699dbbe 100644
--- a/apps/web-ele/src/views/iot/device/device/detail/modules/modbus-config.vue
+++ b/apps/web-ele/src/views/iot/device/device/detail/modules/modbus-config.vue
@@ -14,7 +14,7 @@ import { computed, h, onMounted, ref } from 'vue';
 import { confirm, useVbenModal } from '@vben/common-ui';
 import { DICT_TYPE, ModbusFunctionCodeOptions } from '@vben/constants';
 
-import { ElButton, ElMessage } from 'element-plus';
+import { ElMessage } from 'element-plus';
 
 import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
 import { getModbusConfig } from '#/api/iot/device/modbus/config';
@@ -307,7 +307,16 @@ onMounted(async () => {
     <!-- 连接配置区域 -->
     <ConfigDescriptions :data="modbusConfig" class="mb-4">
       <template #extra>
-        <ElButton type="primary" @click="handleEditConfig">编辑</ElButton>
+        <TableAction
+          :actions="[
+            {
+              label: '编辑',
+              type: 'primary',
+              auth: ['iot:device:create'],
+              onClick: handleEditConfig,
+            },
+          ]"
+        />
       </template>
     </ConfigDescriptions>
 
@@ -320,6 +329,7 @@ onMounted(async () => {
               label: '新增点位',
               type: 'primary',
               icon: ACTION_ICON.ADD,
+              auth: ['iot:device:create'],
               onClick: handleAddPoint,
             },
           ]"
@@ -332,12 +342,14 @@ onMounted(async () => {
               label: '编辑',
               type: 'primary',
               link: true,
+              auth: ['iot:device:update'],
               onClick: () => handleEditPoint(row),
             },
             {
               label: '删除',
               type: 'danger',
               link: true,
+              auth: ['iot:device:delete'],
               popConfirm: {
                 title: `确定要删除点位【${row.name}】吗？`,
                 confirm: () => handleDeletePoint(row),
diff --git a/apps/web-ele/src/views/iot/device/device/detail/modules/modbus-point-form.vue b/apps/web-ele/src/views/iot/device/device/detail/modules/modbus-point-form.vue
index c1d5ec35e..493bb8460 100644
--- a/apps/web-ele/src/views/iot/device/device/detail/modules/modbus-point-form.vue
+++ b/apps/web-ele/src/views/iot/device/device/detail/modules/modbus-point-form.vue
@@ -241,10 +241,20 @@ const [Form, formApi] = useVbenForm({
         if (option && option.registerCount > 0) {
           await formApi.setFieldValue('registerCount', option.registerCount);
         }
-        // 重置字节序为第一个选项
+        // 字节序：仅在当前值为空或不属于新 rawDataType 时才重置为第一个选项；
+        // 编辑回填时 setValues 会触发本回调，无条件重置会覆盖已保存字节序
         const byteOrderOptions = getByteOrderOptions(rawDataType);
         if (byteOrderOptions.length > 0) {
-          await formApi.setFieldValue('byteOrder', byteOrderOptions[0]!.value);
+          const currentByteOrder = values.byteOrder;
+          const isCurrentValid =
+            !!currentByteOrder &&
+            byteOrderOptions.some((opt) => opt.value === currentByteOrder);
+          if (!isCurrentValid) {
+            await formApi.setFieldValue(
+              'byteOrder',
+              byteOrderOptions[0]!.value,
+            );
+          }
         }
       }
     }
diff --git a/apps/web-ele/src/views/iot/device/device/detail/modules/simulator.vue b/apps/web-ele/src/views/iot/device/device/detail/modules/simulator.vue
index a377c9bf7..edaf80538 100644
--- a/apps/web-ele/src/views/iot/device/device/detail/modules/simulator.vue
+++ b/apps/web-ele/src/views/iot/device/device/detail/modules/simulator.vue
@@ -4,11 +4,12 @@ import type { IotDeviceApi } from '#/api/iot/device/device';
 import type { IotProductApi } from '#/api/iot/product/product';
 import type { ThingModelApi } from '#/api/iot/thingmodel';
 
-import { computed, ref } from 'vue';
+import { computed, ref, watch } from 'vue';
 
 import { ContentWrap } from '@vben/common-ui';
 import {
   DeviceStateEnum,
+  IoTDataSpecsDataTypeEnum,
   IotDeviceMessageMethodEnum,
   IoTThingModelTypeEnum,
 } from '@vben/constants';
@@ -19,8 +20,11 @@ import {
   ElCard,
   ElCol,
   ElInput,
+  ElInputNumber,
   ElMessage,
+  ElOption,
   ElRow,
+  ElSelect,
   ElTable,
   ElTableColumn,
   ElTabPane,
@@ -50,7 +54,7 @@ const debugCollapsed = ref(false); // 指令调试区域折叠状态
 const messageCollapsed = ref(false); // 设备消息区域折叠状态
 
 // 表单数据：存储用户输入的模拟值
-const formData = ref<Record<string, string>>({});
+const formData = ref<Record<string, any>>({});
 
 // 根据类型过滤物模型数据
 const getFilteredThingModelList = (type: number) => {
@@ -76,21 +80,98 @@ const serviceList = computed(() =>
 
 // 获取表单值
 function getFormValue(identifier: string) {
-  return formData.value[identifier] || '';
+  return formData.value[identifier] ?? '';
 }
 
 // 设置表单值
-function setFormValue(identifier: string, value: string) {
+function setFormValue(identifier: string, value: any) {
   formData.value[identifier] = value;
 }
 
+/** 获取属性数据类型 */
+function getPropertyDataType(row: ThingModelApi.ThingModel) {
+  return row.property?.dataType;
+}
+
+/** 判断属性是否为数值类型 */
+function isNumberProperty(row: ThingModelApi.ThingModel) {
+  return [
+    IoTDataSpecsDataTypeEnum.DOUBLE,
+    IoTDataSpecsDataTypeEnum.FLOAT,
+    IoTDataSpecsDataTypeEnum.INT,
+  ].includes(getPropertyDataType(row) as any);
+}
+
+/** 判断属性是否使用下拉选项 */
+function isSelectProperty(row: ThingModelApi.ThingModel) {
+  return [
+    IoTDataSpecsDataTypeEnum.BOOL,
+    IoTDataSpecsDataTypeEnum.ENUM,
+  ].includes(getPropertyDataType(row) as any);
+}
+
+/** 获取属性选项 */
+function getPropertyOptions(row: ThingModelApi.ThingModel) {
+  const list = row.property?.dataSpecsList || [];
+  if (list.length > 0) {
+    return list.map((item: any) => ({
+      label: item.name || item.label || String(item.value),
+      value: String(item.value),
+    }));
+  }
+  if (getPropertyDataType(row) === IoTDataSpecsDataTypeEnum.BOOL) {
+    return [
+      { label: '真 (true)', value: 'true' },
+      { label: '假 (false)', value: 'false' },
+    ];
+  }
+  return [];
+}
+
+/** 获取物模型选项原始值 */
+function getMatchedPropertyOption(row: ThingModelApi.ThingModel, value: any) {
+  return row.property?.dataSpecsList?.find(
+    (item: any) => String(item.value) === String(value),
+  );
+}
+
+/** 按物模型数据类型转换属性值 */
+function normalizePropertyValue(row: ThingModelApi.ThingModel, value: any) {
+  if (value === undefined || value === null || value === '') {
+    return undefined;
+  }
+  const dataType = getPropertyDataType(row);
+  if (isNumberProperty(row)) {
+    return Number(value);
+  }
+  if (
+    [IoTDataSpecsDataTypeEnum.BOOL, IoTDataSpecsDataTypeEnum.ENUM].includes(
+      dataType as any,
+    )
+  ) {
+    const option = getMatchedPropertyOption(row, value);
+    if (option) {
+      return option.value;
+    }
+  }
+  if (dataType === IoTDataSpecsDataTypeEnum.BOOL) {
+    if (String(value) === 'true') {
+      return true;
+    }
+    if (String(value) === 'false') {
+      return false;
+    }
+  }
+  return value;
+}
+
 // 属性上报
 async function handlePropertyPost() {
   try {
     const params: Record<string, any> = {};
     propertyList.value.forEach((item) => {
-      const value = formData.value[item.identifier!];
-      if (value) {
+      const value = normalizePropertyValue(item, formData.value[item.identifier!]);
+      if (value !== undefined) {
         params[item.identifier!] = value;
       }
     });
@@ -121,13 +202,15 @@ async function handleEventPost(row: ThingModelApi.ThingModel) {
     const valueStr = formData.value[row.identifier!];
     let eventValue: any;
 
-    if (valueStr) {
-      try {
-        eventValue = JSON.parse(valueStr);
-      } catch {
-        ElMessage.error('事件参数格式错误，请输入有效的JSON格式');
-        return;
-      }
+    if (valueStr === undefined || valueStr === null || valueStr === '') {
+      ElMessage.warning('请输入事件参数');
+      return;
+    }
+    try {
+      eventValue = JSON.parse(valueStr);
+    } catch {
+      ElMessage.error('事件参数格式错误，请输入有效的JSON格式');
+      return;
     }
 
     // 与后端 IotDeviceEventPostReqDTO 对齐 ：{ identifier, value, time }
@@ -173,8 +256,8 @@ async function handlePropertySet() {
   try {
     const params: Record<string, any> = {};
     propertyList.value.forEach((item) => {
-      const value = formData.value[item.identifier!];
-      if (value) {
+      const value = normalizePropertyValue(item, formData.value[item.identifier!]);
+      if (value !== undefined) {
         params[item.identifier!] = value;
       }
     });
@@ -205,13 +288,23 @@ async function handleServiceInvoke(row: ThingModelApi.ThingModel) {
     const valueStr = formData.value[row.identifier!];
     let inputParams: any = {};
 
-    if (valueStr) {
-      try {
-        inputParams = JSON.parse(valueStr);
-      } catch {
-        ElMessage.error('服务参数格式错误，请输入有效的JSON格式');
-        return;
-      }
+    if (valueStr === undefined || valueStr === null || valueStr === '') {
+      ElMessage.warning('请输入服务参数');
+      return;
+    }
+    try {
+      inputParams = JSON.parse(valueStr);
+    } catch {
+      ElMessage.error('服务参数格式错误，请输入有效的JSON格式');
+      return;
+    }
+    if (
+      typeof inputParams !== 'object' ||
+      inputParams === null ||
+      Array.isArray(inputParams)
+    ) {
+      ElMessage.error('服务参数必须是 JSON 对象');
+      return;
     }
 
     // 与后端 IotDeviceServiceInvokeReqDTO 对齐 ：{ identifier, inputParams }
@@ -232,6 +325,11 @@ async function handleServiceInvoke(row: ThingModelApi.ThingModel) {
     console.error(error);
   }
 }
+
+/** 切换调试方法时清空输入，避免不同方法之间串台提交 */
+watch([activeTab, upstreamTab, downstreamTab], () => {
+  formData.value = {};
+});
 </script>
 
 <template>
@@ -297,7 +395,35 @@ async function handleServiceInvoke(row: ThingModelApi.ThingModel) {
                         </ElTableColumn>
                         <ElTableColumn label="值" width="180" fixed="right">
                           <template #default="{ row }">
+                            <ElInputNumber
+                              v-if="isNumberProperty(row)"
+                              :model-value="getFormValue(row.identifier)"
+                              placeholder="输入值"
+                              size="small"
+                              class="w-full"
+                              @update:model-value="
+                                setFormValue(row.identifier, $event)
+                              "
+                            />
+                            <ElSelect
+                              v-else-if="isSelectProperty(row)"
+                              :model-value="getFormValue(row.identifier)"
+                              placeholder="请选择值"
+                              size="small"
+                              class="w-full"
+                              @update:model-value="
+                                setFormValue(row.identifier, $event)
+                              "
+                            >
+                              <ElOption
+                                v-for="option in getPropertyOptions(row)"
+                                :key="option.value"
+                                :label="option.label"
+                                :value="option.value"
+                              />
+                            </ElSelect>
                             <ElInput
+                              v-else
                               :model-value="getFormValue(row.identifier)"
                               placeholder="输入值"
                               size="small"
@@ -444,7 +570,35 @@ async function handleServiceInvoke(row: ThingModelApi.ThingModel) {
                         </ElTableColumn>
                         <ElTableColumn label="值" width="180" fixed="right">
                           <template #default="{ row }">
+                            <ElInputNumber
+                              v-if="isNumberProperty(row)"
+                              :model-value="getFormValue(row.identifier)"
+                              placeholder="输入值"
+                              size="small"
+                              class="w-full"
+                              @update:model-value="
+                                setFormValue(row.identifier, $event)
+                              "
+                            />
+                            <ElSelect
+                              v-else-if="isSelectProperty(row)"
+                              :model-value="getFormValue(row.identifier)"
+                              placeholder="请选择值"
+                              size="small"
+                              class="w-full"
+                              @update:model-value="
+                                setFormValue(row.identifier, $event)
+                              "
+                            >
+                              <ElOption
+                                v-for="option in getPropertyOptions(row)"
+                                :key="option.value"
+                                :label="option.label"
+                                :value="option.value"
+                              />
+                            </ElSelect>
                             <ElInput
+                              v-else
                               :model-value="getFormValue(row.identifier)"
                               placeholder="输入值"
                               size="small"
diff --git a/apps/web-ele/src/views/iot/device/device/detail/modules/sub-device.vue b/apps/web-ele/src/views/iot/device/device/detail/modules/sub-device.vue
index e5ab5c716..8a5c32479 100644
--- a/apps/web-ele/src/views/iot/device/device/detail/modules/sub-device.vue
+++ b/apps/web-ele/src/views/iot/device/device/detail/modules/sub-device.vue
@@ -315,12 +315,14 @@ watch(
               label: '添加子设备',
               type: 'primary',
               icon: ACTION_ICON.ADD,
+              auth: ['iot:device:update'],
               onClick: openAddModal,
             },
             {
               label: '批量解绑',
               type: 'danger',
               icon: ACTION_ICON.DELETE,
+              auth: ['iot:device:update'],
               disabled: isEmpty(checkedIds),
               onClick: handleUnbindBatch,
             },
@@ -340,6 +342,7 @@ watch(
               label: '解绑',
               type: 'danger',
               link: true,
+              auth: ['iot:device:update'],
               onClick: () => handleUnbind(row),
             },
           ]"
diff --git a/apps/web-ele/src/views/iot/device/device/detail/modules/thing-model-event.vue b/apps/web-ele/src/views/iot/device/device/detail/modules/thing-model-event.vue
index 37a6a440e..6ce307dfd 100644
--- a/apps/web-ele/src/views/iot/device/device/detail/modules/thing-model-event.vue
+++ b/apps/web-ele/src/views/iot/device/device/detail/modules/thing-model-event.vue
@@ -3,7 +3,7 @@
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
 import type { ThingModelApi } from '#/api/iot/thingmodel';
 
-import { computed, onMounted, reactive, watch } from 'vue';
+import { computed, onBeforeUnmount, onMounted, reactive, watch } from 'vue';
 
 import { Page } from '@vben/common-ui';
 import {
@@ -35,6 +35,7 @@ const queryParams = reactive({
   identifier: '',
   times: undefined as [string, string] | undefined,
 });
+let refreshTimer: ReturnType<typeof setTimeout> | undefined; // 延迟刷新定时器
 
 /** 事件类型的物模型数据 */
 const eventThingModels = computed(() => {
@@ -159,8 +160,15 @@ function parseParams(params: string) {
 
 /** 刷新列表 */
 function refresh(delay = 0) {
+  if (refreshTimer) {
+    clearTimeout(refreshTimer);
+    refreshTimer = undefined;
+  }
   if (delay > 0) {
-    setTimeout(() => gridApi.query(), delay);
+    refreshTimer = setTimeout(() => {
+      gridApi.query();
+      refreshTimer = undefined;
+    }, delay);
   } else {
     gridApi.query();
   }
@@ -183,6 +191,14 @@ onMounted(() => {
   }
 });
 
+/** 组件卸载时清除延迟刷新定时器 */
+onBeforeUnmount(() => {
+  if (refreshTimer) {
+    clearTimeout(refreshTimer);
+    refreshTimer = undefined;
+  }
+});
+
 /** 暴露方法给父组件 */
 defineExpose({
   refresh,
diff --git a/apps/web-ele/src/views/iot/device/device/detail/modules/thing-model-property-history.vue b/apps/web-ele/src/views/iot/device/device/detail/modules/thing-model-property-history.vue
index 256f8bfec..000cf504f 100644
--- a/apps/web-ele/src/views/iot/device/device/detail/modules/thing-model-property-history.vue
+++ b/apps/web-ele/src/views/iot/device/device/detail/modules/thing-model-property-history.vue
@@ -33,7 +33,7 @@ defineProps<{ deviceId: number }>();
 const dialogVisible = ref(false); // 弹窗的是否展示
 const loading = ref(false);
 const viewMode = ref<'chart' | 'list'>('chart'); // 视图模式状态
-const list = ref<IotDeviceApi.DevicePropertyDetail[]>([]); // 列表的数据
+const list = ref<Array<IotDeviceApi.DeviceProperty & { _rowKey: string }>>([]); // 列表的数据
 const total = ref(0); // 总数据量
 const thingModelDataType = ref<string>(''); // 物模型数据类型
 const propertyIdentifier = ref<string>(''); // 属性标识符
@@ -118,9 +118,12 @@ function formatDateRangeWithTime(dates: [string, string]): [string, string] {
 async function getList() {
   loading.value = true;
   try {
-    // 后端直接返回数组
+    // 后端直接返回数组，仅含 value/updateTime，给每行补 _rowKey 保证唯一
     const data = await getHistoryDevicePropertyList(queryParams);
-    list.value = (data || []) as IotDeviceApi.DevicePropertyDetail[];
+    list.value = (data || []).map((item, idx) => ({
+      ...item,
+      _rowKey: `${item.updateTime ?? ''}-${idx}`,
+    }));
     total.value = list.value.length;
 
     // 如果是图表模式且支持图表展示，等待渲染图表
@@ -396,7 +399,7 @@ defineExpose({ open }); // 提供 open 方法，用于打开弹窗
           <ElTable
             :data="list"
             :max-height="500"
-            row-key="updateTime"
+            row-key="_rowKey"
             size="small"
           >
             <ElTableColumn
@@ -435,7 +438,6 @@ defineExpose({ open }); // 提供 open 方法，用于打开弹窗
 </template>
 
 <style lang="scss" scoped>
-/** 同别的地方，将 style 改成 unocss 的诉求。如果不好改，就注释说明； */
 .property-history-container {
   max-height: 70vh;
   overflow: auto;
diff --git a/apps/web-ele/src/views/iot/device/device/detail/modules/thing-model-property.vue b/apps/web-ele/src/views/iot/device/device/detail/modules/thing-model-property.vue
index 26e820f79..04c987c8a 100644
--- a/apps/web-ele/src/views/iot/device/device/detail/modules/thing-model-property.vue
+++ b/apps/web-ele/src/views/iot/device/device/detail/modules/thing-model-property.vue
@@ -282,6 +282,7 @@ onBeforeUnmount(() => {
           clearable
           placeholder="请输入属性名称、标识符"
           style="width: 240px"
+          @clear="handleQuery"
           @keyup.enter="handleQuery"
         />
         <ElSwitch
diff --git a/apps/web-ele/src/views/iot/device/device/detail/modules/thing-model-service.vue b/apps/web-ele/src/views/iot/device/device/detail/modules/thing-model-service.vue
index 160c3ab39..c6e876d24 100644
--- a/apps/web-ele/src/views/iot/device/device/detail/modules/thing-model-service.vue
+++ b/apps/web-ele/src/views/iot/device/device/detail/modules/thing-model-service.vue
@@ -3,7 +3,7 @@
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
 import type { ThingModelApi } from '#/api/iot/thingmodel';
 
-import { computed, onMounted, reactive, watch } from 'vue';
+import { computed, onBeforeUnmount, onMounted, reactive, watch } from 'vue';
 
 import { Page } from '@vben/common-ui';
 import {
@@ -35,6 +35,7 @@ const queryParams = reactive({
   identifier: '',
   times: undefined as [string, string] | undefined,
 });
+let refreshTimer: ReturnType<typeof setTimeout> | undefined; // 延迟刷新定时器
 
 /** 服务类型的物模型数据 */
 const serviceThingModels = computed(() => {
@@ -173,8 +174,15 @@ function parseParams(params: string) {
 
 /** 刷新列表 */
 function refresh(delay = 0) {
+  if (refreshTimer) {
+    clearTimeout(refreshTimer);
+    refreshTimer = undefined;
+  }
   if (delay > 0) {
-    setTimeout(() => gridApi.query(), delay);
+    refreshTimer = setTimeout(() => {
+      gridApi.query();
+      refreshTimer = undefined;
+    }, delay);
   } else {
     gridApi.query();
   }
@@ -197,6 +205,14 @@ onMounted(() => {
   }
 });
 
+/** 组件卸载时清除延迟刷新定时器 */
+onBeforeUnmount(() => {
+  if (refreshTimer) {
+    clearTimeout(refreshTimer);
+    refreshTimer = undefined;
+  }
+});
+
 /** 暴露方法给父组件 */
 defineExpose({
   refresh,
diff --git a/apps/web-ele/src/views/iot/device/device/index.vue b/apps/web-ele/src/views/iot/device/device/index.vue
index 4a9dbf41b..53a0cab7b 100644
--- a/apps/web-ele/src/views/iot/device/device/index.vue
+++ b/apps/web-ele/src/views/iot/device/device/index.vue
@@ -9,7 +9,7 @@ import type { IotProductApi } from '#/api/iot/product/product';
 import { nextTick, onMounted, ref } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
 
-import { Page, useVbenModal } from '@vben/common-ui';
+import { confirm, Page, useVbenModal } from '@vben/common-ui';
 import { DICT_TYPE } from '@vben/constants';
 import { getDictOptions } from '@vben/hooks';
 import { IconifyIcon } from '@vben/icons';
@@ -169,6 +169,7 @@ async function handleDeleteBatch() {
     ElMessage.warning('请选择要删除的设备');
     return;
   }
+  await confirm($t('ui.actionMessage.deleteBatchConfirm'));
   const loadingInstance = ElLoading.service({
     text: $t('ui.actionMessage.deletingBatch'),
   });
@@ -213,6 +214,9 @@ const [Grid, gridApi] = useVbenVxeGrid({
     columns: useGridColumns(),
     height: 'auto',
     keepSource: true,
+    pagerConfig: {
+      pageSize: 12,
+    },
     proxyConfig: {
       ajax: {
         query: async ({
@@ -423,6 +427,11 @@ onMounted(async () => {
 
     <!-- 列表视图 -->
     <Grid table-title="设备列表" v-show="viewMode === 'list'">
+      <template #deviceName="{ row }">
+        <a class="cursor-pointer text-primary" @click="openDetail(row.id!)">
+          {{ row.deviceName }}
+        </a>
+      </template>
       <template #product="{ row }">
         <a
           class="cursor-pointer text-[var(--el-color-primary)]"
@@ -461,7 +470,7 @@ onMounted(async () => {
               label: '日志',
               type: 'primary',
               link: true,
-              auth: ['iot:device:message-query'],
+              auth: ['iot:device:query'],
               onClick: openModel.bind(null, row.id!),
             },
             {
diff --git a/apps/web-ele/src/views/iot/device/device/modules/card-view.vue b/apps/web-ele/src/views/iot/device/device/modules/card-view.vue
index 9e95dd215..6a5b525c5 100644
--- a/apps/web-ele/src/views/iot/device/device/modules/card-view.vue
+++ b/apps/web-ele/src/views/iot/device/device/modules/card-view.vue
@@ -173,13 +173,16 @@ onMounted(() => {
                 </div>
                 <div class="flex items-center text-[13px]">
                   <span class="mr-2 shrink-0 opacity-65 dark:text-white/65">
-                    Deviceid
+                    备注名称
                   </span>
-                  <ElTooltip :content="String(item.id)" placement="top">
+                  <ElTooltip
+                    :content="item.nickname || item.deviceName"
+                    placement="top"
+                  >
                     <span
-                      class="inline-block max-w-[150px] cursor-pointer truncate align-middle font-mono text-xs opacity-85 dark:text-white/75"
+                      class="inline-block max-w-[150px] cursor-pointer truncate align-middle text-xs opacity-85 dark:text-white/75"
                     >
-                      {{ item.id }}
+                      {{ item.nickname || item.deviceName }}
                     </span>
                   </ElTooltip>
                 </div>
@@ -222,7 +225,7 @@ onMounted(() => {
                 详情
               </ElButton>
               <ElButton
-                v-if="hasAccessByCodes(['iot:device:message-query'])"
+                v-if="hasAccessByCodes(['iot:device:query'])"
                 size="small"
                 class="!h-8 min-w-0 flex-1 rounded-md !border-[#fa8c16] !text-[13px] !text-[#fa8c16] transition-all duration-200 hover:!bg-[#fa8c16] hover:!text-white"
                 @click="emit('model', item.id!)"
diff --git a/apps/web-ele/src/views/iot/device/device/modules/import-form.vue b/apps/web-ele/src/views/iot/device/device/modules/import-form.vue
index 82fe188a6..f2f8be704 100644
--- a/apps/web-ele/src/views/iot/device/device/modules/import-form.vue
+++ b/apps/web-ele/src/views/iot/device/device/modules/import-form.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 import type { IotDeviceApi } from '#/api/iot/device/device';
 
-import { useVbenModal } from '@vben/common-ui';
+import { alert, useVbenModal } from '@vben/common-ui';
 import { downloadFileFromBlobPart } from '@vben/utils';
 
 import { ElButton, ElMessage, ElUpload } from 'element-plus';
@@ -59,7 +59,7 @@ const [Modal, modalApi] = useVbenModal({
             text += `< ${deviceName}: ${importData.failureDeviceNames[deviceName]} >`;
           }
         }
-        ElMessage.info(text);
+        await alert(text, '导入结果');
       }
       // 关闭并提示
       await modalApi.close();
@@ -71,10 +71,11 @@ const [Modal, modalApi] = useVbenModal({
   },
 });
 
-/** 上传前 */
-function beforeUpload(file: File) {
-  formApi.setFieldValue('file', file);
-  return false;
+/** 文件改变时 */
+function handleChange(file: any) {
+  if (file.raw) {
+    formApi.setFieldValue('file', file.raw);
+  }
 }
 
 /** 下载模版 */
@@ -90,19 +91,19 @@ async function handleDownload() {
       <template #file>
         <div class="w-full">
           <ElUpload
-            :before-upload="beforeUpload"
             :limit="1"
             accept=".xls,.xlsx"
-            :show-file-list="false"
+            :on-change="handleChange"
+            :auto-upload="false"
           >
-            <ElButton type="primary">选择 Excel 文件</ElButton>
+            <ElButton type="primary"> 选择 Excel 文件 </ElButton>
           </ElUpload>
         </div>
       </template>
     </Form>
     <template #prepend-footer>
       <div class="flex flex-auto items-center">
-        <ElButton @click="handleDownload">下载导入模板</ElButton>
+        <ElButton @click="handleDownload"> 下载导入模板 </ElButton>
       </div>
     </template>
   </Modal>
diff --git a/apps/web-ele/src/views/iot/device/group/data.ts b/apps/web-ele/src/views/iot/device/group/data.ts
index 5463262c9..9f94bd824 100644
--- a/apps/web-ele/src/views/iot/device/group/data.ts
+++ b/apps/web-ele/src/views/iot/device/group/data.ts
@@ -2,7 +2,7 @@ import type { VbenFormSchema } from '#/adapter/form';
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
 import type { IotDeviceGroupApi } from '#/api/iot/device/group';
 
-import { CommonStatusEnum, DICT_TYPE } from '@vben/constants';
+import { DICT_TYPE } from '@vben/constants';
 import { getDictOptions } from '@vben/hooks';
 
 import { z } from '#/adapter/form';
@@ -26,10 +26,7 @@ export function useFormSchema(): VbenFormSchema[] {
       componentProps: {
         placeholder: '请输入分组名称',
       },
-      rules: z
-        .string()
-        .min(1, '分组名称不能为空')
-        .max(64, '分组名称长度不能超过 64 个字符'),
+      rules: z.string().min(1, '分组名称不能为空'),
     },
     {
       fieldName: 'status',
@@ -38,7 +35,7 @@ export function useFormSchema(): VbenFormSchema[] {
       componentProps: {
         options: getDictOptions(DICT_TYPE.COMMON_STATUS, 'number'),
       },
-      rules: z.number().default(CommonStatusEnum.ENABLE),
+      rules: 'required',
     },
     {
       fieldName: 'description',
diff --git a/apps/web-ele/src/views/iot/device/group/index.vue b/apps/web-ele/src/views/iot/device/group/index.vue
index ad64bdad5..60b30663c 100644
--- a/apps/web-ele/src/views/iot/device/group/index.vue
+++ b/apps/web-ele/src/views/iot/device/group/index.vue
@@ -35,6 +35,10 @@ function handleEdit(row: IotDeviceGroupApi.DeviceGroup) {
 
 /** 删除设备分组 */
 async function handleDelete(row: IotDeviceGroupApi.DeviceGroup) {
+  if (row.deviceCount && row.deviceCount > 0) {
+    ElMessage.warning(`分组「${row.name}」下存在 ${row.deviceCount} 台设备，无法删除`);
+    return;
+  }
   const loadingInstance = ElLoading.service({
     text: $t('ui.actionMessage.deleting', [row.name]),
   });
diff --git a/apps/web-ele/src/views/iot/home/data.ts b/apps/web-ele/src/views/iot/home/data.ts
index 433db75c7..eaa9159f4 100644
--- a/apps/web-ele/src/views/iot/home/data.ts
+++ b/apps/web-ele/src/views/iot/home/data.ts
@@ -9,12 +9,12 @@ export const defaultStatsData: StatsData = {
   productCount: -1,
   deviceCount: -1,
   deviceMessageCount: -1,
-  productCategoryTodayCount: 0,
-  productTodayCount: 0,
-  deviceTodayCount: 0,
-  deviceMessageTodayCount: 0,
-  deviceOnlineCount: 0,
-  deviceOfflineCount: 0,
-  deviceInactiveCount: 0,
+  productCategoryTodayCount: -1,
+  productTodayCount: -1,
+  deviceTodayCount: -1,
+  deviceMessageTodayCount: -1,
+  deviceOnlineCount: -1,
+  deviceOfflineCount: -1,
+  deviceInactiveCount: -1,
   productCategoryDeviceCounts: {},
 };
diff --git a/apps/web-ele/src/views/iot/home/modules/device-map-card.vue b/apps/web-ele/src/views/iot/home/modules/device-map-card.vue
index 650557089..0ce5287d5 100644
--- a/apps/web-ele/src/views/iot/home/modules/device-map-card.vue
+++ b/apps/web-ele/src/views/iot/home/modules/device-map-card.vue
@@ -1,11 +1,13 @@
 <script lang="ts" setup>
+import type { NumberDictDataType } from '@vben/hooks';
+
 import type { IotDeviceApi } from '#/api/iot/device/device';
 
 import { computed, nextTick, onMounted, onUnmounted, ref } from 'vue';
 import { useRouter } from 'vue-router';
 
 import { DeviceStateEnum, DICT_TYPE } from '@vben/constants';
-import { getDictLabel } from '@vben/hooks';
+import { getDictLabel, getDictOptions } from '@vben/hooks';
 
 import { ElCard, ElEmpty } from 'element-plus';
 
@@ -20,15 +22,20 @@ let mapInstance: any = null; // 百度地图实例
 const loading = ref(true); // 加载状态
 const deviceList = ref<IotDeviceApi.Device[]>([]); // 设备分布列表
 
-/** 是否有数据 */
-const hasData = computed(() => deviceList.value.length > 0);
+const hasData = computed(() => deviceList.value.length > 0); // 是否有数据
+
+const stateOptions = computed(() =>
+  getDictOptions(
+    DICT_TYPE.IOT_DEVICE_STATE,
+    'number',
+  ) as NumberDictDataType[],
+); // 状态图例列表（从字典获取）
 
-/** 设备状态颜色映射 */
 const stateColorMap: Record<number, string> = {
   [DeviceStateEnum.INACTIVE]: '#EAB308', // 待激活 - 黄色
   [DeviceStateEnum.ONLINE]: '#22C55E', // 在线 - 绿色
   [DeviceStateEnum.OFFLINE]: '#9CA3AF', // 离线 - 灰色
-};
+}; // 设备状态颜色映射
 
 /** 获取设备状态配置；名称走字典，颜色用本地映射 */
 function getStateConfig(state: number): { color: string; name: string } {
@@ -111,19 +118,20 @@ function initMap() {
       // 信息窗口打开后绑定链接点击事件
       infoWindow.addEventListener('open', () => {
         setTimeout(() => {
-          const link = document.querySelector('.device-link');
-          if (link) {
-            link.addEventListener('click', (e) => {
-              e.preventDefault();
-              const deviceId = (e.target as HTMLElement).dataset.id;
-              if (deviceId) {
-                router.push({
-                  name: 'IoTDeviceDetail',
-                  params: { id: deviceId },
-                });
-              }
-            });
+          const link = document.querySelector('.BMap_bubble_content .device-link');
+          if (!link) {
+            return;
           }
+          link.addEventListener('click', (e) => {
+            e.preventDefault();
+            if (device.id === undefined || device.id === null) {
+              return;
+            }
+            router.push({
+              name: 'IoTDeviceDetail',
+              params: { id: device.id },
+            });
+          });
         }, 100);
       });
 
@@ -176,32 +184,18 @@ onUnmounted(() => {
       <div class="flex items-center justify-between">
         <span>设备分布地图</span>
         <div class="flex items-center gap-4 text-sm">
-          <span class="flex items-center gap-1">
+          <span
+            v-for="item in stateOptions"
+            :key="item.value"
+            class="flex items-center gap-1"
+          >
             <span
               class="inline-block h-3 w-3 rounded-full"
               :style="{
-                backgroundColor: stateColorMap[DeviceStateEnum.ONLINE],
+                backgroundColor: stateColorMap[item.value],
               }"
             ></span>
-            <span class="text-gray-500">在线</span>
-          </span>
-          <span class="flex items-center gap-1">
-            <span
-              class="inline-block h-3 w-3 rounded-full"
-              :style="{
-                backgroundColor: stateColorMap[DeviceStateEnum.OFFLINE],
-              }"
-            ></span>
-            <span class="text-gray-500">离线</span>
-          </span>
-          <span class="flex items-center gap-1">
-            <span
-              class="inline-block h-3 w-3 rounded-full"
-              :style="{
-                backgroundColor: stateColorMap[DeviceStateEnum.INACTIVE],
-              }"
-            ></span>
-            <span class="text-gray-500">待激活</span>
+            <span class="text-gray-500">{{ item.label }}</span>
           </span>
         </div>
       </div>
diff --git a/apps/web-ele/src/views/iot/home/modules/message-trend-card.vue b/apps/web-ele/src/views/iot/home/modules/message-trend-card.vue
index af42c3952..7e21fd6d5 100644
--- a/apps/web-ele/src/views/iot/home/modules/message-trend-card.vue
+++ b/apps/web-ele/src/views/iot/home/modules/message-trend-card.vue
@@ -3,7 +3,7 @@ import type { Dayjs } from 'dayjs';
 
 import type { IotStatisticsApi } from '#/api/iot/statistics';
 
-import { computed, nextTick, reactive, ref } from 'vue';
+import { computed, nextTick, onMounted, reactive, ref } from 'vue';
 
 import { DICT_TYPE } from '@vben/constants';
 import { getDictOptions } from '@vben/hooks';
@@ -26,12 +26,13 @@ const loading = ref(false); // 加载状态
 const messageData = ref<IotStatisticsApi.DeviceMessageSummaryByDateRespVO[]>(
   [],
 ); // 消息趋势数据
+const isFirstMount = ref(true); // 首次挂载标记，用于跳过子组件 mount 时的默认 emit
 
 /** 时间范围（仅日期，不包含时分秒） */
 const dateRange = ref<[string, string]>([
-  // 默认显示最近一周的数据（包含今天和前六天）
-  dayjs().subtract(6, 'day').format('YYYY-MM-DD'),
-  dayjs().format('YYYY-MM-DD'),
+  // 默认显示最近一周的数据（截至昨天）
+  dayjs().subtract(7, 'day').format('YYYY-MM-DD'),
+  dayjs().subtract(1, 'day').format('YYYY-MM-DD'),
 ]);
 
 /** 将日期范围转换为带时分秒的格式 */
@@ -74,6 +75,11 @@ function handleDateRangeChange(times?: [Dayjs, Dayjs]) {
   ];
   // 将选择的日期转换为带时分秒的格式（开始日期 00:00:00，结束日期 23:59:59）
   queryParams.times = formatDateRangeWithTime(dateRange.value);
+  if (isFirstMount.value) {
+    // 子组件 ShortcutDateRangePicker mount 时会 emit 一次默认日期范围，跳过 fetch；
+    // 首次请求统一由父组件 onMounted 发起，避免双请求
+    return;
+  }
   handleQuery();
 }
 
@@ -91,6 +97,8 @@ async function fetchMessageData() {
   loading.value = true;
   try {
     messageData.value = await getDeviceMessageSummaryByDate(queryParams);
+  } catch {
+    messageData.value = [];
   } finally {
     loading.value = false;
     await renderChartWhenReady();
@@ -122,6 +130,13 @@ async function renderChartWhenReady() {
   await nextTick();
   initChart();
 }
+// 父组件挂载后统一发起首次请求；
+// 原因：子组件 ShortcutDateRangePicker 早期 emit 触发的请求落在 useEcharts isActiveRef = false 阶段，会被 renderEcharts 静默丢弃；
+// 通过 handleDateRangeChange 在 isFirstMount=true 时跳过 fetch，由这里统一发起一次，避免双请求
+onMounted(() => {
+  fetchMessageData();
+  isFirstMount.value = false;
+});
 </script>
 
 <template>
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 6e06076d5..a7bbbc3f0 100644
--- a/apps/web-ele/src/views/iot/ota/firmware/data.ts
+++ b/apps/web-ele/src/views/iot/ota/firmware/data.ts
@@ -24,7 +24,11 @@ export function getProductName(productId?: number): string {
 export function useDetailSchema(): DescriptionItemSchema[] {
   return [
     { field: 'name', label: '固件名称' },
-    { field: 'productName', label: '所属产品' },
+    {
+      field: 'productName',
+      label: '所属产品',
+      render: (val) => val || '-',
+    },
     { field: 'version', label: '固件版本' },
     {
       field: 'createTime',
@@ -65,10 +69,12 @@ export function useFormSchema(): VbenFormSchema[] {
         valueField: 'id',
         placeholder: '请选择产品',
       },
-      rules: 'required',
       dependencies: {
         triggerFields: ['id'],
-        show: (values) => !values.id,
+        componentProps: (values) => ({
+          disabled: !!values.id,
+        }),
+        rules: (values) => (values.id ? null : 'required'),
       },
     },
     {
@@ -78,10 +84,12 @@ export function useFormSchema(): VbenFormSchema[] {
       componentProps: {
         placeholder: '请输入版本号',
       },
-      rules: 'required',
       dependencies: {
         triggerFields: ['id'],
-        show: (values) => !values.id,
+        componentProps: (values) => ({
+          disabled: !!values.id,
+        }),
+        rules: (values) => (values.id ? null : 'required'),
       },
     },
     {
@@ -99,14 +107,16 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'FileUpload',
       componentProps: {
         maxNumber: 1,
-        accept: ['bin', 'hex', 'zip'],
+        accept: ['bin', 'zip', 'pdf'],
         maxSize: 50,
-        helpText: '支持上传 .bin、.hex、.zip 格式的固件文件，最大 50MB',
+        helpText: '支持上传 .bin、.zip、.pdf 格式的固件文件，最大 50MB',
       },
-      rules: 'required',
       dependencies: {
         triggerFields: ['id'],
-        show: (values) => !values.id,
+        componentProps: (values) => ({
+          disabled: !!values.id,
+        }),
+        rules: (values) => (values.id ? null : 'required'),
       },
     },
   ];
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 a504d4d0f..5ecd79e4d 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,11 @@ import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
 import { deleteOtaFirmware, getOtaFirmwarePage } from '#/api/iot/ota/firmware';
 import { $t } from '#/locales';
 
-import { getProductName, useGridColumns, useGridFormSchema } from './data';
+import {
+  getProductName,
+  useGridColumns,
+  useGridFormSchema,
+} from './data';
 import OtaFirmwareForm from './modules/form.vue';
 
 const { push } = useRouter();
@@ -113,7 +117,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
       <!-- 所属产品列：点击跳产品详情 -->
       <template #productName="{ row }">
         <a
-          v-if="row.productId"
+          v-if="row.productId && getProductName(row.productId) !== '-'"
           class="cursor-pointer text-[var(--el-color-primary)] hover:underline"
           @click="handleOpenProductDetail(row.productId)"
         >
diff --git a/apps/web-ele/src/views/iot/ota/task/modules/list.vue b/apps/web-ele/src/views/iot/ota/task/modules/list.vue
index 9c13079f9..375213851 100644
--- a/apps/web-ele/src/views/iot/ota/task/modules/list.vue
+++ b/apps/web-ele/src/views/iot/ota/task/modules/list.vue
@@ -44,7 +44,7 @@ async function handleRefresh() {
 
 /** 按任务名称搜索 */
 async function handleSearch() {
-  await gridApi.query();
+  await gridApi.reload();
 }
 
 /** 新增任务 */
diff --git a/apps/web-ele/src/views/iot/ota/task/record/modules/list.vue b/apps/web-ele/src/views/iot/ota/task/record/modules/list.vue
index 42ee185dc..59510dfa1 100644
--- a/apps/web-ele/src/views/iot/ota/task/record/modules/list.vue
+++ b/apps/web-ele/src/views/iot/ota/task/record/modules/list.vue
@@ -40,7 +40,7 @@ const statusTabs = computed(() => {
 /** 切换标签 */
 async function handleTabChange(tabKey: number | string) {
   activeTab.value = String(tabKey);
-  await gridApi.query();
+  await gridApi.reload();
 }
 
 /** 取消单条记录的升级 */
@@ -90,7 +90,7 @@ watch(
   async (val) => {
     if (val) {
       activeTab.value = '';
-      await gridApi.query();
+      await gridApi.reload();
     }
   },
 );
diff --git a/apps/web-ele/src/views/iot/product/category/data.ts b/apps/web-ele/src/views/iot/product/category/data.ts
index cb972ae0b..6d64d0296 100644
--- a/apps/web-ele/src/views/iot/product/category/data.ts
+++ b/apps/web-ele/src/views/iot/product/category/data.ts
@@ -37,6 +37,7 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'InputNumber',
       componentProps: {
         class: '!w-full',
+        controlsPosition: 'right',
         placeholder: '请输入分类排序',
         min: 0,
         precision: 0,
diff --git a/apps/web-ele/src/views/iot/product/product/data.ts b/apps/web-ele/src/views/iot/product/product/data.ts
index 52f8b75d2..f108be5f8 100644
--- a/apps/web-ele/src/views/iot/product/product/data.ts
+++ b/apps/web-ele/src/views/iot/product/product/data.ts
@@ -107,7 +107,6 @@ export function useBasicFormSchema(
       componentProps: {
         options: getDictOptions(DICT_TYPE.IOT_PRODUCT_DEVICE_TYPE, 'number'),
       },
-      defaultValue: DeviceTypeEnum.DEVICE,
       dependencies: {
         triggerFields: ['id'],
         componentProps: (values) => ({
@@ -128,7 +127,10 @@ export function useBasicFormSchema(
       // 网关子设备走网关联网，不需要联网方式
       dependencies: {
         triggerFields: ['deviceType'],
-        show: (values) => values.deviceType !== DeviceTypeEnum.GATEWAY,
+        show: (values) =>
+          [DeviceTypeEnum.DEVICE, DeviceTypeEnum.GATEWAY].includes(
+            values.deviceType,
+          ),
       },
       rules: 'required',
     },
diff --git a/apps/web-ele/src/views/iot/product/product/detail/modules/info.vue b/apps/web-ele/src/views/iot/product/product/detail/modules/info.vue
index 1b71ebebe..059a3f92f 100644
--- a/apps/web-ele/src/views/iot/product/product/detail/modules/info.vue
+++ b/apps/web-ele/src/views/iot/product/product/detail/modules/info.vue
@@ -91,13 +91,14 @@ async function copyToClipboard(text: string) {
       >
         <DictTag :type="DICT_TYPE.IOT_NET_TYPE" :value="product.netType" />
       </ElDescriptionsItem>
-      <ElDescriptionsItem v-if="product.productSecret" label="ProductSecret">
+      <ElDescriptionsItem label="产品密钥">
         <span v-if="showProductSecret">{{ product.productSecret }}</span>
         <span v-else>********</span>
         <ElButton class="ml-2" size="small" @click="toggleProductSecretVisible">
           {{ showProductSecret ? '隐藏' : '显示' }}
         </ElButton>
         <ElButton
+          v-if="showProductSecret && product.productSecret"
           class="ml-2"
           size="small"
           @click="copyToClipboard(product.productSecret || '')"
diff --git a/apps/web-ele/src/views/iot/product/product/index.vue b/apps/web-ele/src/views/iot/product/product/index.vue
index d57fb816b..f9f2edebe 100644
--- a/apps/web-ele/src/views/iot/product/product/index.vue
+++ b/apps/web-ele/src/views/iot/product/product/index.vue
@@ -79,7 +79,7 @@ async function handleViewModeChange(mode: 'card' | 'list') {
 /** 导出表格 */
 async function handleExport() {
   const data = await exportProduct(queryParams.value);
-  downloadFileFromBlobPart({ fileName: '产品列表.xls', source: data });
+  downloadFileFromBlobPart({ fileName: '物联网产品.xls', source: data });
 }
 
 /** 打开产品详情 */
diff --git a/apps/web-ele/src/views/iot/product/product/modules/card-view.vue b/apps/web-ele/src/views/iot/product/product/modules/card-view.vue
index 1581da6ef..d73e005fd 100644
--- a/apps/web-ele/src/views/iot/product/product/modules/card-view.vue
+++ b/apps/web-ele/src/views/iot/product/product/modules/card-view.vue
@@ -4,6 +4,7 @@ import { onMounted, ref } from 'vue';
 import { useAccess } from '@vben/access';
 import { DICT_TYPE, ProductStatusEnum } from '@vben/constants';
 import { IconifyIcon } from '@vben/icons';
+import { isHttpUrl } from '@vben/utils';
 
 import {
   ElButton,
@@ -18,6 +19,8 @@ import {
 } from 'element-plus';
 
 import { getProductPage } from '#/api/iot/product/product';
+import defaultPicUrl from '#/assets/imgs/iot/device.png';
+import defaultIconUrl from '#/assets/svgs/iot/cube.svg';
 import { DictTag } from '#/components/dict-tag';
 
 interface Props {
@@ -49,9 +52,27 @@ const queryParams = ref({
 });
 
 /** 获取分类名称 */
-function getCategoryName(categoryId: number) {
-  const category = props.categoryList.find((c: any) => c.id === categoryId);
-  return category?.name || '未分类';
+function getCategoryName(item: any) {
+  const category = props.categoryList.find((c: any) => c.id === item.categoryId);
+  return item.categoryName || category?.name || '未分类';
+}
+
+/** 是否按图片 URL 渲染产品图标 */
+function isImageIcon(icon?: string) {
+  if (!icon) {
+    return true;
+  }
+  return isHttpUrl(icon);
+}
+
+/** 产品图标 fallback */
+function getProductIcon(icon?: string) {
+  return icon || defaultIconUrl;
+}
+
+/** 产品图片 fallback */
+function getProductPic(picUrl?: string) {
+  return picUrl || defaultPicUrl;
 }
 
 /** 获取产品列表 */
@@ -111,8 +132,15 @@ onMounted(() => {
               <div
                 class="flex size-9 shrink-0 items-center justify-center rounded-lg bg-gradient-to-br from-[#40a9ff] to-[#1890ff] text-white"
               >
+                <img
+                  v-if="isImageIcon(item.icon)"
+                  :src="getProductIcon(item.icon)"
+                  alt=""
+                  class="size-6 object-contain"
+                />
                 <IconifyIcon
-                  :icon="item.icon || 'lucide:box'"
+                  v-else
+                  :icon="item.icon"
                   class="text-xl"
                 />
               </div>
@@ -132,7 +160,7 @@ onMounted(() => {
                     产品分类
                   </span>
                   <span class="truncate font-medium text-foreground">
-                    {{ getCategoryName(item.categoryId) }}
+                    {{ getCategoryName(item) }}
                   </span>
                 </div>
                 <div class="mb-2 flex items-center text-[13px]">
@@ -166,16 +194,10 @@ onMounted(() => {
                 class="flex size-20 shrink-0 items-center justify-center rounded-lg bg-gradient-to-br from-[#40a9ff15] to-[#1890ff15] text-[#1890ff] dark:from-[#40a9ff25] dark:to-[#1890ff25] dark:text-[#69c0ff]"
               >
                 <ElImage
-                  v-if="item.picUrl"
-                  :src="item.picUrl"
-                  :preview-src-list="[item.picUrl]"
+                  :src="getProductPic(item.picUrl)"
+                  :preview-src-list="[getProductPic(item.picUrl)]"
                   class="size-full rounded object-cover"
                 />
-                <IconifyIcon
-                  v-else
-                  icon="lucide:image"
-                  class="text-2xl opacity-50"
-                />
               </div>
             </div>
             <!-- 按钮组 -->
@@ -208,6 +230,9 @@ onMounted(() => {
                 物模型
               </ElButton>
               <template v-if="hasAccessByCodes(['iot:product:delete'])">
+                <div
+                  class="h-5 w-px self-center bg-[#dcdfe6] dark:bg-[#3a3a3a]"
+                ></div>
                 <ElTooltip
                   v-if="item.status === ProductStatusEnum.PUBLISHED"
                   content="已发布的产品不能删除"
diff --git a/apps/web-ele/src/views/iot/rule/data/index.vue b/apps/web-ele/src/views/iot/rule/data/index.vue
index 213688717..c0d398613 100644
--- a/apps/web-ele/src/views/iot/rule/data/index.vue
+++ b/apps/web-ele/src/views/iot/rule/data/index.vue
@@ -17,7 +17,7 @@ const activeTabName = ref('rule');
       <ElTabPane name="rule" label="规则">
         <DataRuleList />
       </ElTabPane>
-      <ElTabPane name="sink" label="目的">
+      <ElTabPane name="sink" label="目的" lazy>
         <DataSinkList />
       </ElTabPane>
     </ElTabs>
diff --git a/apps/web-ele/src/views/iot/rule/data/rule/modules/source-config-form.vue b/apps/web-ele/src/views/iot/rule/data/rule/modules/source-config-form.vue
index 3b70f6902..328e3bdb1 100644
--- a/apps/web-ele/src/views/iot/rule/data/rule/modules/source-config-form.vue
+++ b/apps/web-ele/src/views/iot/rule/data/rule/modules/source-config-form.vue
@@ -179,9 +179,11 @@ function validate() {
   return Promise.resolve();
 }
 
-/** 取当前所有行的值 */
+/** 取当前所有行的值（剔除 identifierLoading 等仅供 UI 使用的临时字段） */
 function getData() {
-  return formData.value;
+  return formData.value.map(
+    ({ identifierLoading: _identifierLoading, ...rest }) => rest,
+  );
 }
 
 /** 设置初始数据 */
@@ -214,6 +216,7 @@ defineExpose({ validate, getData, setData });
           v-model="formData[rowIndex].productId"
           placeholder="请选择产品"
           filterable
+          clearable
           class="w-full"
           @change="() => handleProductChange(rowIndex)"
         >
@@ -230,6 +233,7 @@ defineExpose({ validate, getData, setData });
           v-model="formData[rowIndex].deviceId"
           placeholder="请选择设备"
           filterable
+          clearable
           class="w-full"
         >
           <ElOption label="全部设备" :value="0" />
@@ -246,6 +250,7 @@ defineExpose({ validate, getData, setData });
           v-model="formData[rowIndex].method"
           placeholder="请选择消息"
           filterable
+          clearable
           class="w-full"
           @change="() => handleMethodChange(rowIndex)"
         >
@@ -263,6 +268,7 @@ defineExpose({ validate, getData, setData });
           v-model="formData[rowIndex].identifier"
           placeholder="请选择标识符"
           filterable
+          clearable
           :loading="formData[rowIndex].identifierLoading"
           class="w-full"
         >
diff --git a/apps/web-ele/src/views/iot/rule/data/sink/config/components/key-value-editor.vue b/apps/web-ele/src/views/iot/rule/data/sink/config/components/key-value-editor.vue
index 1982a009b..cc7a51748 100644
--- a/apps/web-ele/src/views/iot/rule/data/sink/config/components/key-value-editor.vue
+++ b/apps/web-ele/src/views/iot/rule/data/sink/config/components/key-value-editor.vue
@@ -16,15 +16,18 @@ const props = defineProps<{
 const emit = defineEmits(['update:modelValue']);
 
 interface KeyValueItem {
+  _uid: number;
   key: string;
   value: string;
 }
 
+let uidCounter = 0;
 const items = ref<KeyValueItem[]>([]); // 内部 key-value 项列表
 
 /** 添加项目 */
 function addItem() {
-  items.value.push({ key: '', value: '' });
+  uidCounter += 1;
+  items.value.push({ _uid: uidCounter, key: '', value: '' });
   updateModelValue();
 }
 
@@ -54,16 +57,16 @@ watch(
     if (isEmpty(val) || !isEmpty(items.value)) {
       return;
     }
-    items.value = Object.entries(props.modelValue).map(([key, value]) => ({
-      key,
-      value,
-    }));
+    items.value = Object.entries(props.modelValue).map(([key, value]) => {
+      uidCounter += 1;
+      return { _uid: uidCounter, key, value };
+    });
   },
 );
 </script>
 
 <template>
-  <div v-for="(item, index) in items" :key="index" class="mb-2 flex w-full">
+  <div v-for="(item, index) in items" :key="item._uid" class="mb-2 flex w-full">
     <ElInput v-model="item.key" class="mr-2" placeholder="键" />
     <ElInput v-model="item.value" placeholder="值" />
     <ElButton class="ml-2" type="danger" link @click="removeItem(index)">
diff --git a/apps/web-ele/src/views/iot/rule/data/sink/config/database-config-form.vue b/apps/web-ele/src/views/iot/rule/data/sink/config/database-config-form.vue
index c1bdd928c..81f11a02b 100644
--- a/apps/web-ele/src/views/iot/rule/data/sink/config/database-config-form.vue
+++ b/apps/web-ele/src/views/iot/rule/data/sink/config/database-config-form.vue
@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { onMounted, ref } from 'vue';
+import { onBeforeUnmount, onMounted, ref } from 'vue';
 
 import { IconifyIcon } from '@vben/icons';
 import { isEmpty } from '@vben/utils';
@@ -30,14 +30,28 @@ const config = useVModel(props, 'modelValue', emit);
 const showSqlTip = ref(false);
 const copied = ref(false);
 const { copy } = useClipboard();
+let copyResetTimer: null | ReturnType<typeof setTimeout> = null;
 
 async function handleCopySql() {
   await copy(TABLE_SQL);
   copied.value = true;
   ElMessage.success('建表 SQL 已复制到剪贴板');
-  setTimeout(() => (copied.value = false), 2000);
+  if (copyResetTimer) {
+    clearTimeout(copyResetTimer);
+  }
+  copyResetTimer = setTimeout(() => {
+    copied.value = false;
+    copyResetTimer = null;
+  }, 2000);
 }
 
+onBeforeUnmount(() => {
+  if (copyResetTimer) {
+    clearTimeout(copyResetTimer);
+    copyResetTimer = null;
+  }
+});
+
 onMounted(() => {
   if (!isEmpty(config.value)) {
     return;
diff --git a/apps/web-ele/src/views/iot/rule/data/sink/config/http-config-form.vue b/apps/web-ele/src/views/iot/rule/data/sink/config/http-config-form.vue
index 49bb72c5d..eb438c335 100644
--- a/apps/web-ele/src/views/iot/rule/data/sink/config/http-config-form.vue
+++ b/apps/web-ele/src/views/iot/rule/data/sink/config/http-config-form.vue
@@ -21,21 +21,31 @@ const fullUrl = computed(() =>
   urlPath.value ? urlPrefix.value + urlPath.value : '',
 );
 
+function syncUrlFields(url?: string) {
+  if (url?.startsWith('https://')) {
+    urlPrefix.value = 'https://';
+    urlPath.value = url.slice(8);
+  } else if (url?.startsWith('http://')) {
+    urlPrefix.value = 'http://';
+    urlPath.value = url.slice(7);
+  } else {
+    urlPath.value = url ?? '';
+  }
+}
+
 watch([urlPrefix, urlPath], () => {
   config.value.url = fullUrl.value;
 });
 
+watch(
+  () => config.value?.url,
+  (url) => syncUrlFields(url),
+  { immediate: true },
+);
+
 onMounted(() => {
   if (!isEmpty(config.value)) {
-    if (config.value.url?.startsWith('https://')) {
-      urlPrefix.value = 'https://';
-      urlPath.value = config.value.url.slice(8);
-    } else if (config.value.url?.startsWith('http://')) {
-      urlPrefix.value = 'http://';
-      urlPath.value = config.value.url.slice(7);
-    } else {
-      urlPath.value = config.value.url ?? '';
-    }
+    syncUrlFields(config.value.url);
     return;
   }
   config.value = {
diff --git a/apps/web-ele/src/views/iot/rule/data/sink/config/redis-stream-config-form.vue b/apps/web-ele/src/views/iot/rule/data/sink/config/redis-stream-config-form.vue
index f4621fec4..be0cf439d 100644
--- a/apps/web-ele/src/views/iot/rule/data/sink/config/redis-stream-config-form.vue
+++ b/apps/web-ele/src/views/iot/rule/data/sink/config/redis-stream-config-form.vue
@@ -12,8 +12,16 @@ const props = defineProps<{ modelValue: any }>();
 const emit = defineEmits(['update:modelValue']);
 const config = useVModel(props, 'modelValue', emit);
 
+/** 移除当前 Redis Stream API 类型未声明的旧扩展字段 */
+function removeUnsupportedFields() {
+  delete config.value.dataStructure;
+  delete config.value.hashField;
+  delete config.value.scoreField;
+}
+
 onMounted(() => {
   if (!isEmpty(config.value)) {
+    removeUnsupportedFields();
     return;
   }
   config.value = {
@@ -60,7 +68,11 @@ onMounted(() => {
       class="w-full"
     />
   </ElFormItem>
-  <ElFormItem prop="config.password" label="密码">
+  <ElFormItem
+    prop="config.password"
+    :rules="[{ required: true, message: '密码不能为空', trigger: 'blur' }]"
+    label="密码"
+  >
     <ElInput
       v-model="config.password"
       type="password"
diff --git a/apps/web-ele/src/views/iot/rule/scene/form/configs/device-control-config.vue b/apps/web-ele/src/views/iot/rule/scene/form/configs/device-control-config.vue
index 9963d2a14..a32e14ac0 100644
--- a/apps/web-ele/src/views/iot/rule/scene/form/configs/device-control-config.vue
+++ b/apps/web-ele/src/views/iot/rule/scene/form/configs/device-control-config.vue
@@ -76,18 +76,16 @@ const isServiceInvokeAction = computed(() => {
 /**
  * 处理产品变化事件
  * @param productId 产品 ID
+ *
+ * ProductSelector 只在用户主动切换时 emit change，编辑回填阶段不会触发。
  */
 function handleProductChange(productId?: number) {
-  // 当产品变化时，清空设备选择和参数配置
-  if (action.value.productId !== productId) {
-    action.value.deviceId = undefined;
-    action.value.identifier = undefined; // 清空服务标识符
-    action.value.params = ''; // 清空参数，保存为空字符串
-    selectedService.value = null; // 清空选中的服务
-    serviceList.value = []; // 清空服务列表
-  }
+  action.value.deviceId = undefined;
+  action.value.identifier = undefined;
+  action.value.params = '';
+  selectedService.value = null;
+  serviceList.value = [];
 
-  // 加载新产品的物模型属性或服务列表
   if (productId) {
     if (isPropertySetAction.value) {
       loadThingModelProperties(productId);
@@ -101,11 +99,8 @@ function handleProductChange(productId?: number) {
  * 处理设备变化事件
  * @param deviceId 设备 ID
  */
-function handleDeviceChange(deviceId?: number) {
-  // 当设备变化时，清空参数配置
-  if (action.value.deviceId !== deviceId) {
-    action.value.params = ''; // 清空参数，保存为空字符串
-  }
+function handleDeviceChange(_deviceId?: number) {
+  action.value.params = '';
 }
 
 /**
@@ -269,14 +264,10 @@ function getDefaultValueForParam(param: any) {
   }
 }
 
-const isInitialized = ref(false); // 防止重复初始化的标志
-
 /**
  * 初始化组件数据
  */
 async function initializeComponent() {
-  if (isInitialized.value) return;
-
   const currentAction = action.value;
   if (!currentAction) return;
 
@@ -294,8 +285,6 @@ async function initializeComponent() {
     // 加载物模型TSL以获取服务信息
     await loadServiceFromTSL(currentAction.productId, currentAction.identifier);
   }
-
-  isInitialized.value = true;
 }
 
 /** 组件初始化 */
@@ -307,9 +296,6 @@ onMounted(() => {
 watch(
   () => [action.value.productId, action.value.type, action.value.identifier],
   async ([newProductId, , newIdentifier], [oldProductId, , oldIdentifier]) => {
-    // 避免初始化时的重复调用
-    if (!isInitialized.value) return;
-
     // 产品变化时重新加载数据
     if (newProductId !== oldProductId) {
       if (newProductId && isPropertySetAction.value) {
diff --git a/apps/web-ele/src/views/iot/rule/scene/form/configs/device-trigger-config.vue b/apps/web-ele/src/views/iot/rule/scene/form/configs/device-trigger-config.vue
index 88438b725..939bc8b60 100644
--- a/apps/web-ele/src/views/iot/rule/scene/form/configs/device-trigger-config.vue
+++ b/apps/web-ele/src/views/iot/rule/scene/form/configs/device-trigger-config.vue
@@ -5,6 +5,7 @@ import type { RuleSceneApi } from '#/api/iot/rule/scene';
 import { nextTick } from 'vue';
 
 import { IconifyIcon } from '@vben/icons';
+import { getStableObjectKey } from '@vben/utils';
 
 import { useVModel } from '@vueuse/core';
 import { ElButton, ElTag } from 'element-plus';
@@ -185,7 +186,7 @@ function removeConditionGroup() {
           <div class="relative">
             <div
               v-for="(subGroup, subGroupIndex) in trigger.conditionGroups"
-              :key="`sub-group-${subGroupIndex}`"
+              :key="getStableObjectKey(subGroup)"
               class="relative"
             >
               <!-- 子条件组容器 -->
diff --git a/apps/web-ele/src/views/iot/rule/scene/form/configs/main-condition-inner-config.vue b/apps/web-ele/src/views/iot/rule/scene/form/configs/main-condition-inner-config.vue
index e5db785fd..e68292c50 100644
--- a/apps/web-ele/src/views/iot/rule/scene/form/configs/main-condition-inner-config.vue
+++ b/apps/web-ele/src/views/iot/rule/scene/form/configs/main-condition-inner-config.vue
@@ -12,7 +12,14 @@ import {
 } from '@vben/constants';
 
 import { useVModel } from '@vueuse/core';
-import { ElCol, ElFormItem, ElOption, ElRow, ElSelect } from 'element-plus';
+import {
+  ElCol,
+  ElFormItem,
+  ElInput,
+  ElOption,
+  ElRow,
+  ElSelect,
+} from 'element-plus';
 
 import JsonParamsInput from '../inputs/json-params-input.vue';
 import ValueInput from '../inputs/value-input.vue';
@@ -105,22 +112,6 @@ const serviceConfig = computed(() => {
   return undefined;
 });
 
-// 计算属性：事件配置 - 用于 JsonParamsInput
-const eventConfig = computed(() => {
-  if (
-    propertyConfig.value &&
-    props.triggerType === IotRuleSceneTriggerTypeEnum.DEVICE_EVENT_POST
-  ) {
-    return {
-      event: {
-        name: propertyConfig.value.name || '事件',
-        outputParams: propertyConfig.value.outputParams || [],
-      },
-    };
-  }
-  return undefined;
-});
-
 /**
  * 更新条件字段
  * @param field 字段名
@@ -140,15 +131,24 @@ function handleTriggerTypeChange(type: number) {
 
 /** 处理产品变化事件 */
 function handleProductChange() {
-  // 产品变化时清空设备和属性
-  condition.value.deviceId = undefined;
-  condition.value.identifier = '';
+  const trigger = condition.value;
+  trigger.deviceId = undefined;
+  trigger.identifier = '';
+  trigger.operator = undefined;
+  // 主条件比较值字段是 Trigger.value（不是 TriggerCondition.param）
+  trigger.value = '';
+  propertyType.value = '';
+  propertyConfig.value = null;
 }
 
 /** 处理设备变化事件 */
 function handleDeviceChange() {
-  // 设备变化时清空属性
-  condition.value.identifier = '';
+  const trigger = condition.value;
+  trigger.identifier = '';
+  trigger.operator = undefined;
+  trigger.value = '';
+  propertyType.value = '';
+  propertyConfig.value = null;
 }
 
 /**
@@ -265,15 +265,16 @@ function handlePropertyChange(propertyInfo: any) {
               :config="serviceConfig as any"
               placeholder="请输入 JSON 格式的服务参数"
             />
-            <!-- 事件上报参数配置 -->
-            <JsonParamsInput
+            <!-- 事件上报参数配置：源项目允许标量值或留空表示事件发生即匹配 -->
+            <ElInput
               v-else-if="
                 triggerType === IotRuleSceneTriggerTypeEnum.DEVICE_EVENT_POST
               "
-              v-model="condition.value"
-              type="event"
-              :config="eventConfig as any"
-              placeholder="请输入 JSON 格式的事件参数"
+              :model-value="condition.value"
+              @update:model-value="
+                (value: any) => updateConditionField('value', value)
+              "
+              placeholder="留空则事件发生即匹配"
             />
             <!-- 普通值输入 -->
             <ValueInput
diff --git a/apps/web-ele/src/views/iot/rule/scene/form/configs/sub-condition-group-config.vue b/apps/web-ele/src/views/iot/rule/scene/form/configs/sub-condition-group-config.vue
index 56ed35a02..ff04c1490 100644
--- a/apps/web-ele/src/views/iot/rule/scene/form/configs/sub-condition-group-config.vue
+++ b/apps/web-ele/src/views/iot/rule/scene/form/configs/sub-condition-group-config.vue
@@ -8,6 +8,7 @@ import {
   IotRuleSceneTriggerConditionTypeEnum,
 } from '@vben/constants';
 import { IconifyIcon } from '@vben/icons';
+import { getStableObjectKey } from '@vben/utils';
 
 import { useVModel } from '@vueuse/core';
 import { ElButton } from 'element-plus';
@@ -108,7 +109,7 @@ function updateCondition(
     <div v-else class="space-y-4">
       <div
         v-for="(condition, conditionIndex) in subGroup"
-        :key="`condition-${conditionIndex}`"
+        :key="getStableObjectKey(condition)"
         class="relative"
       >
         <!-- 条件配置 -->
diff --git a/apps/web-ele/src/views/iot/rule/scene/form/configs/timer-condition-group-config.vue b/apps/web-ele/src/views/iot/rule/scene/form/configs/timer-condition-group-config.vue
index f2e0c64d6..30e5dcb28 100644
--- a/apps/web-ele/src/views/iot/rule/scene/form/configs/timer-condition-group-config.vue
+++ b/apps/web-ele/src/views/iot/rule/scene/form/configs/timer-condition-group-config.vue
@@ -5,6 +5,7 @@ import { nextTick } from 'vue';
 
 import { IotRuleSceneTriggerTypeEnum } from '@vben/constants';
 import { IconifyIcon } from '@vben/icons';
+import { getStableObjectKey } from '@vben/utils';
 
 import { useVModel } from '@vueuse/core';
 import { ElButton, ElTag } from 'element-plus';
@@ -96,7 +97,7 @@ function updateConditionGroup(
     >
       <div
         v-for="(group, groupIndex) in conditionGroups"
-        :key="`group-${groupIndex}`"
+        :key="getStableObjectKey(group)"
         class="relative"
       >
         <!-- 条件组容器（橙色主题） -->
diff --git a/apps/web-ele/src/views/iot/rule/scene/form/inputs/json-params-input.vue b/apps/web-ele/src/views/iot/rule/scene/form/inputs/json-params-input.vue
index 38bf6e0fd..f3a99eadb 100644
--- a/apps/web-ele/src/views/iot/rule/scene/form/inputs/json-params-input.vue
+++ b/apps/web-ele/src/views/iot/rule/scene/form/inputs/json-params-input.vue
@@ -12,6 +12,7 @@ import {
   JsonParamsInputTypeEnum,
 } from '@vben/constants';
 import { IconifyIcon } from '@vben/icons';
+import { isEmptyVal } from '@vben/utils';
 
 import { useVModel } from '@vueuse/core';
 import { ElButton, ElInput, ElPopover, ElTag } from 'element-plus';
@@ -219,39 +220,40 @@ const emptyMessage = computed(() => {
 
 /**
  * 处理参数变化事件
+ *
+ * 注意：必须在所有校验（合法 JSON / 必须是对象 / 必填参数）通过后再回写
+ * localValue，否则父表单仅校验非空时会先写入非法值再提示错误。
  */
 function handleParamsChange() {
   try {
-    jsonError.value = ''; // 清除之前的错误
+    jsonError.value = '';
 
-    if (paramsJson.value.trim()) {
-      const parsed = JSON.parse(paramsJson.value);
-      localValue.value = paramsJson.value;
-
-      // 额外的参数验证
-      if (typeof parsed !== 'object' || parsed === null) {
-        jsonError.value = JSON_PARAMS_INPUT_CONSTANTS.PARAMS_MUST_BE_OBJECT;
-        return;
-      }
-
-      // 验证必填参数
-      for (const param of paramsList.value) {
-        if (
-          param.required &&
-          (!parsed[param.identifier] || parsed[param.identifier] === '')
-        ) {
-          jsonError.value = JSON_PARAMS_INPUT_CONSTANTS.PARAM_REQUIRED_ERROR(
-            param.name,
-          );
-          return;
-        }
-      }
-    } else {
+    if (!paramsJson.value.trim()) {
       localValue.value = '';
+      return;
     }
 
-    // 验证通过
-    jsonError.value = '';
+    const parsed = JSON.parse(paramsJson.value);
+
+    // 必须是对象
+    if (typeof parsed !== 'object' || parsed === null) {
+      jsonError.value = JSON_PARAMS_INPUT_CONSTANTS.PARAMS_MUST_BE_OBJECT;
+      return;
+    }
+
+    // 必填参数校验
+    for (const param of paramsList.value) {
+      const value = parsed[param.identifier];
+      if (param.required && isEmptyVal(value)) {
+        jsonError.value = JSON_PARAMS_INPUT_CONSTANTS.PARAM_REQUIRED_ERROR(
+          param.name,
+        );
+        return;
+      }
+    }
+
+    // 所有校验通过后才回写到父表单
+    localValue.value = paramsJson.value;
   } catch (error) {
     jsonError.value = JSON_PARAMS_INPUT_CONSTANTS.JSON_FORMAT_ERROR(
       error instanceof Error
@@ -383,6 +385,9 @@ watch(
 
     // 使用 nextTick 确保在下一个 tick 中处理数据
     await nextTick();
+    if ((newValue || '') === paramsJson.value) {
+      return;
+    }
     handleDataDisplay(newValue || '');
   },
   { immediate: true },
diff --git a/apps/web-ele/src/views/iot/rule/scene/form/inputs/value-input.vue b/apps/web-ele/src/views/iot/rule/scene/form/inputs/value-input.vue
index 803aff25f..a4442a3e2 100644
--- a/apps/web-ele/src/views/iot/rule/scene/form/inputs/value-input.vue
+++ b/apps/web-ele/src/views/iot/rule/scene/form/inputs/value-input.vue
@@ -146,10 +146,46 @@ function handleNumberChange(value: number | undefined) {
   localValue.value = value?.toString() || '';
 }
 
+/** 根据外部值同步内部输入态 */
+function syncInternalValue(value = '') {
+  const normalized = value;
+  if (
+    props.operator ===
+    IotRuleSceneTriggerConditionParameterOperatorEnum.BETWEEN.value
+  ) {
+    const [start = '', end = ''] = normalized.split(',');
+    rangeStart.value = start;
+    rangeEnd.value = end;
+    numberValue.value = undefined;
+    dateValue.value = '';
+    return;
+  }
+  rangeStart.value = '';
+  rangeEnd.value = '';
+  if (props.propertyType === IoTDataSpecsDataTypeEnum.DATE) {
+    dateValue.value = normalized;
+    numberValue.value = undefined;
+    return;
+  }
+  if (isNumericType()) {
+    const parsed = Number(normalized);
+    numberValue.value =
+      normalized === '' || Number.isNaN(parsed) ? undefined : parsed;
+    dateValue.value = '';
+    return;
+  }
+  numberValue.value = undefined;
+  dateValue.value = '';
+}
+
 /** 监听操作符变化 */
 watch(
   () => props.operator,
-  () => {
+  (_operator, oldOperator) => {
+    if (oldOperator === undefined) {
+      syncInternalValue(props.modelValue);
+      return;
+    }
     localValue.value = '';
     rangeStart.value = '';
     rangeEnd.value = '';
@@ -157,6 +193,12 @@ watch(
     numberValue.value = undefined;
   },
 );
+
+watch(
+  () => [props.modelValue, props.propertyType] as const,
+  ([value]) => syncInternalValue(value),
+  { immediate: true },
+);
 </script>
 
 <template>
@@ -168,8 +210,8 @@ watch(
       placeholder="请选择布尔值"
       class="w-full!"
     >
-      <ElOption label="真 (true)" :value="true" />
-      <ElOption label="假 (false)" :value="false" />
+      <ElOption label="真 (true)" value="true" />
+      <ElOption label="假 (false)" value="false" />
     </ElSelect>
 
     <!-- 枚举值选择 -->
diff --git a/apps/web-ele/src/views/iot/rule/scene/form/sections/action-section.vue b/apps/web-ele/src/views/iot/rule/scene/form/sections/action-section.vue
index 6be499945..33ab2fd21 100644
--- a/apps/web-ele/src/views/iot/rule/scene/form/sections/action-section.vue
+++ b/apps/web-ele/src/views/iot/rule/scene/form/sections/action-section.vue
@@ -8,6 +8,7 @@ import {
   IotRuleSceneActionTypeEnum,
 } from '@vben/constants';
 import { IconifyIcon } from '@vben/icons';
+import { getStableObjectKey } from '@vben/utils';
 
 import { useVModel } from '@vueuse/core';
 import {
@@ -201,7 +202,7 @@ function onActionTypeChange(action: RuleSceneApi.Action, type: number) {
       <div v-else class="space-y-[24px]">
         <div
           v-for="(action, index) in actions"
-          :key="`action-${index}`"
+          :key="getStableObjectKey(action)"
           class="rounded-lg border-2 border-blue-200 bg-blue-50 shadow-sm transition-shadow hover:shadow-md"
         >
           <!-- 执行器头部 - 蓝色主题 -->
diff --git a/apps/web-ele/src/views/iot/rule/scene/form/sections/trigger-section.vue b/apps/web-ele/src/views/iot/rule/scene/form/sections/trigger-section.vue
index d4aea6e45..68c711315 100644
--- a/apps/web-ele/src/views/iot/rule/scene/form/sections/trigger-section.vue
+++ b/apps/web-ele/src/views/iot/rule/scene/form/sections/trigger-section.vue
@@ -9,6 +9,7 @@ import {
   isDeviceTrigger,
 } from '@vben/constants';
 import { IconifyIcon } from '@vben/icons';
+import { getStableObjectKey } from '@vben/utils';
 
 import { useVModel } from '@vueuse/core';
 import { ElButton, ElCard, ElEmpty, ElFormItem, ElTag } from 'element-plus';
@@ -166,7 +167,7 @@ onMounted(() => {
       <div v-if="triggers.length > 0" class="space-y-[24px]">
         <div
           v-for="(triggerItem, index) in triggers"
-          :key="`trigger-${index}`"
+          :key="getStableObjectKey(triggerItem)"
           class="rounded-[8px] border-2 border-green-200 bg-green-50 shadow-sm transition-shadow hover:shadow-md"
         >
           <!-- 触发器头部 - 绿色主题 -->
diff --git a/apps/web-ele/src/views/iot/rule/scene/form/selectors/device-selector.vue b/apps/web-ele/src/views/iot/rule/scene/form/selectors/device-selector.vue
index c93b60072..4f0d77dc3 100644
--- a/apps/web-ele/src/views/iot/rule/scene/form/selectors/device-selector.vue
+++ b/apps/web-ele/src/views/iot/rule/scene/form/selectors/device-selector.vue
@@ -58,16 +58,26 @@ async function getDeviceList() {
 // 监听产品变化
 watch(
   () => props.productId,
-  (newProductId) => {
-    if (newProductId) {
-      getDeviceList();
-    } else {
+  async (newProductId, oldProductId) => {
+    if (!newProductId) {
       deviceList.value = [];
-      // 清空当前选择的设备
-      if (props.modelValue) {
+      if (props.modelValue !== undefined && props.modelValue !== null) {
         emit('update:modelValue', undefined);
         emit('change', undefined);
       }
+      return;
+    }
+    await getDeviceList();
+    // 切换到新 productId 时，旧 deviceId 不在新列表里则清空
+    if (
+      oldProductId !== undefined &&
+      oldProductId !== newProductId &&
+      props.modelValue !== undefined &&
+      props.modelValue !== null &&
+      !deviceList.value.some((d: any) => d.id === props.modelValue)
+    ) {
+      emit('update:modelValue', undefined);
+      emit('change', undefined);
     }
   },
   { immediate: true },
diff --git a/apps/web-ele/src/views/iot/rule/scene/form/selectors/product-selector.vue b/apps/web-ele/src/views/iot/rule/scene/form/selectors/product-selector.vue
index 5b81d0e8d..3d89cd191 100644
--- a/apps/web-ele/src/views/iot/rule/scene/form/selectors/product-selector.vue
+++ b/apps/web-ele/src/views/iot/rule/scene/form/selectors/product-selector.vue
@@ -80,7 +80,7 @@ onMounted(() => {
             {{ product.productKey }}
           </div>
         </div>
-        <DictTag :type="DICT_TYPE.COMMON_STATUS" :value="product.status" />
+        <DictTag :type="DICT_TYPE.IOT_PRODUCT_STATUS" :value="product.status" />
       </div>
     </ElOption>
   </ElSelect>
diff --git a/apps/web-ele/src/views/iot/rule/scene/form/selectors/property-selector.vue b/apps/web-ele/src/views/iot/rule/scene/form/selectors/property-selector.vue
index 1846318b2..a823a426d 100644
--- a/apps/web-ele/src/views/iot/rule/scene/form/selectors/property-selector.vue
+++ b/apps/web-ele/src/views/iot/rule/scene/form/selectors/property-selector.vue
@@ -42,7 +42,6 @@ const emit = defineEmits<{
   (e: 'change', value: { config: any; type: string }): void;
 }>();
 
-// TODO 芋艿
 /** 属性选择器内部使用的统一数据结构 */
 interface PropertySelectorItem {
   identifier: string;
@@ -65,86 +64,67 @@ interface PropertySelectorItem {
 
 const localValue = useVModel(props, 'modelValue', emit);
 
-const loading = ref(false); // 加载状态
-const propertyList = ref<PropertySelectorItem[]>([]); // 属性列表
-const thingModelTSL = ref<null | ThingModelApi.ThingModelTSL>(null); // 物模型 TSL 数据
+const loading = ref(false);
+const propertyList = ref<PropertySelectorItem[]>([]);
 
-// 计算属性：属性分组
+/** 触发类型 → 物模型类型 + 分组标签 */
+const TRIGGER_TYPE_TO_GROUP: Record<
+  number,
+  { label: string; modelType: number }
+> = {
+  [IotRuleSceneTriggerTypeEnum.DEVICE_PROPERTY_POST]: {
+    label: THING_MODEL_GROUP_LABELS.PROPERTY,
+    modelType: IoTThingModelTypeEnum.PROPERTY,
+  },
+  [IotRuleSceneTriggerTypeEnum.TIMER]: {
+    label: THING_MODEL_GROUP_LABELS.PROPERTY,
+    modelType: IoTThingModelTypeEnum.PROPERTY,
+  },
+  [IotRuleSceneTriggerTypeEnum.DEVICE_EVENT_POST]: {
+    label: THING_MODEL_GROUP_LABELS.EVENT,
+    modelType: IoTThingModelTypeEnum.EVENT,
+  },
+  [IotRuleSceneTriggerTypeEnum.DEVICE_SERVICE_INVOKE]: {
+    label: THING_MODEL_GROUP_LABELS.SERVICE,
+    modelType: IoTThingModelTypeEnum.SERVICE,
+  },
+};
+
+/** 属性分组：按触发类型筛选属性 / 事件 / 服务 */
 const propertyGroups = computed(() => {
-  const groups: { label: string; options: any[] }[] = [];
-
-  if (props.triggerType === IotRuleSceneTriggerTypeEnum.DEVICE_PROPERTY_POST) {
-    groups.push({
-      label: THING_MODEL_GROUP_LABELS.PROPERTY,
-      options: propertyList.value.filter(
-        (p) => p.type === IoTThingModelTypeEnum.PROPERTY,
-      ),
-    });
-  }
-
-  if (props.triggerType === IotRuleSceneTriggerTypeEnum.DEVICE_EVENT_POST) {
-    groups.push({
-      label: THING_MODEL_GROUP_LABELS.EVENT,
-      options: propertyList.value.filter(
-        (p) => p.type === IoTThingModelTypeEnum.EVENT,
-      ),
-    });
-  }
-
-  if (props.triggerType === IotRuleSceneTriggerTypeEnum.DEVICE_SERVICE_INVOKE) {
-    groups.push({
-      label: THING_MODEL_GROUP_LABELS.SERVICE,
-      options: propertyList.value.filter(
-        (p) => p.type === IoTThingModelTypeEnum.SERVICE,
-      ),
-    });
-  }
-
-  return groups.filter((group) => group.options.length > 0);
-});
-
-// 计算属性：当前选中的属性
-const selectedProperty = computed(() => {
-  return propertyList.value.find(
-    (property) => property.identifier === localValue.value,
+  const config = TRIGGER_TYPE_TO_GROUP[props.triggerType];
+  if (!config) return [];
+  const options = propertyList.value.filter(
+    (item) => item.type === config.modelType,
   );
+  return options.length > 0 ? [{ label: config.label, options }] : [];
 });
 
-/**
- * 处理选择变化事件
- * @param value 选中的属性标识符
- */
+/** 当前选中的属性 */
+const selectedProperty = computed(() =>
+  propertyList.value.find(
+    (property) => property.identifier === localValue.value,
+  ),
+);
+
+/** 处理选择变化事件 */
 function handleChange(value: any) {
   const property = propertyList.value.find((item) => item.identifier === value);
   if (property) {
-    emit('change', {
-      type: property.dataType,
-      config: property,
-    });
+    emit('change', { type: property.dataType, config: property });
   }
 }
 
-/**
- * 获取物模型 TSL 数据
- */
-async function fetchThingModelTSL() {
+/** 获取物模型 TSL 数据 */
+async function loadThingModelTSL() {
   if (!props.productId) {
-    thingModelTSL.value = null;
     propertyList.value = [];
     return;
   }
-
   loading.value = true;
   try {
-    const tslData = await getThingModelTSLByProductId(props.productId);
-
-    if (tslData) {
-      thingModelTSL.value = tslData;
-      parseThingModelData();
-    } else {
-      console.error('获取物模型 TSL 失败 ：返回数据为空');
-      propertyList.value = [];
-    }
+    const tsl = await getThingModelTSLByProductId(props.productId);
+    propertyList.value = parseThingModelData(tsl);
   } catch (error) {
     console.error('获取物模型 TSL 失败 ：', error);
     propertyList.value = [];
@@ -153,104 +133,62 @@ async function fetchThingModelTSL() {
   }
 }
 
-/** 解析物模型 TSL 数据 */
-function parseThingModelData() {
-  const tsl = thingModelTSL.value;
-  const properties: PropertySelectorItem[] = [];
-
-  if (!tsl) {
-    propertyList.value = properties;
-    return;
-  }
-  // 解析属性
-  if (tsl.properties && Array.isArray(tsl.properties)) {
-    tsl.properties.forEach((prop) => {
-      properties.push({
-        identifier: prop.identifier!,
-        name: prop.name!,
-        description: prop.description,
-        dataType: prop.dataType!,
-        type: IoTThingModelTypeEnum.PROPERTY,
-        accessMode: prop.accessMode,
-        required: prop.required,
-        unit: getPropertyUnit(prop),
-        range: getPropertyRange(prop),
-        property: prop,
-      });
-    });
-  }
-
-  // 解析事件
-  if (tsl.events && Array.isArray(tsl.events)) {
-    tsl.events.forEach((event) => {
-      properties.push({
-        identifier: event.identifier!,
-        name: event.name!,
-        description: event.description,
-        dataType: 'struct',
-        type: IoTThingModelTypeEnum.EVENT,
-        eventType: event.type,
-        required: event.required,
-        outputParams: event.outputParams,
-        event,
-      });
-    });
-  }
-
-  // 解析服务
-  if (tsl.services && Array.isArray(tsl.services)) {
-    tsl.services.forEach((service) => {
-      properties.push({
-        identifier: service.identifier!,
-        name: service.name!,
-        description: service.description,
-        dataType: 'struct',
-        type: IoTThingModelTypeEnum.SERVICE,
-        callType: service.callType,
-        required: service.required,
-        inputParams: service.inputParams,
-        outputParams: service.outputParams,
-        service,
-      });
-    });
-  }
-  propertyList.value = properties;
+/** 把 TSL 树展平为 PropertySelectorItem[] */
+function parseThingModelData(
+  tsl?: null | ThingModelApi.ThingModelTSL,
+): PropertySelectorItem[] {
+  if (!tsl) return [];
+  const properties = (tsl.properties ?? []).map<PropertySelectorItem>(
+    (prop) => ({
+      identifier: prop.identifier!,
+      name: prop.name!,
+      description: prop.description,
+      dataType: prop.dataType!,
+      type: IoTThingModelTypeEnum.PROPERTY,
+      accessMode: prop.accessMode,
+      required: prop.required,
+      unit: prop.dataSpecs?.unit,
+      range: getPropertyRange(prop),
+      property: prop,
+    }),
+  );
+  const events = (tsl.events ?? []).map<PropertySelectorItem>((event) => ({
+    identifier: event.identifier!,
+    name: event.name!,
+    description: event.description,
+    dataType: 'struct',
+    type: IoTThingModelTypeEnum.EVENT,
+    eventType: event.type,
+    required: event.required,
+    outputParams: event.outputParams,
+    event,
+  }));
+  const services = (tsl.services ?? []).map<PropertySelectorItem>(
+    (service) => ({
+      identifier: service.identifier!,
+      name: service.name!,
+      description: service.description,
+      dataType: 'struct',
+      type: IoTThingModelTypeEnum.SERVICE,
+      callType: service.callType,
+      required: service.required,
+      inputParams: service.inputParams,
+      outputParams: service.outputParams,
+      service,
+    }),
+  );
+  return [...properties, ...events, ...services];
 }
 
-/**
- * 获取属性单位
- * @param property 属性对象
- * @returns 属性单位
- */
-function getPropertyUnit(property: any) {
-  if (!property) return undefined;
-
-  // 数值型数据的单位
-  if (property.dataSpecs && property.dataSpecs.unit) {
-    return property.dataSpecs.unit;
+/** 获取属性取值范围：数值型给 min~max；枚举 / 布尔给选项列表 */
+function getPropertyRange(
+  property: ThingModelApi.Property,
+): string | undefined {
+  const specs = property.dataSpecs;
+  if (specs && specs.min !== undefined && specs.max !== undefined) {
+    return `${specs.min}~${specs.max}`;
   }
-
-  return undefined;
-}
-
-/**
- * 获取属性范围描述
- * @param property 属性对象
- * @returns 属性范围描述
- */
-function getPropertyRange(property: any) {
-  if (!property) return undefined;
-
-  // 数值型数据的范围
-  if (property.dataSpecs) {
-    const specs = property.dataSpecs;
-    if (specs.min !== undefined && specs.max !== undefined) {
-      return `${specs.min}~${specs.max}`;
-    }
-  }
-
-  // 枚举型和布尔型数据的选项
-  if (property.dataSpecsList && Array.isArray(property.dataSpecsList)) {
+  if (property.dataSpecsList?.length) {
     return property.dataSpecsList
       .map((item: any) => `${item.name}(${item.value})`)
       .join(', ');
@@ -263,7 +201,7 @@ function getPropertyRange(property: any) {
 watch(
   () => props.productId,
   () => {
-    fetchThingModelTSL();
+    loadThingModelTSL();
   },
   { immediate: true },
 );
diff --git a/apps/web-ele/src/views/iot/rule/scene/index.vue b/apps/web-ele/src/views/iot/rule/scene/index.vue
index e96e2a042..a39e48a84 100644
--- a/apps/web-ele/src/views/iot/rule/scene/index.vue
+++ b/apps/web-ele/src/views/iot/rule/scene/index.vue
@@ -181,10 +181,10 @@ function getNextExecutionTime(row: RuleSceneApi.SceneRule): Date | null {
     : null;
 }
 
-/** 基于当前页列表刷新统计数据 */
-function updateStatistics(rows: RuleSceneApi.SceneRule[]) {
+/** 刷新规则统计卡片数据 */
+function updateStatistics(rows: RuleSceneApi.SceneRule[], total?: number) {
   statistics.value = {
-    total: rows.length,
+    total: total ?? rows.length,
     enabled: rows.filter((item) => item.status === CommonStatusEnum.ENABLE)
       .length,
     disabled: rows.filter((item) => item.status === CommonStatusEnum.DISABLE)
@@ -209,7 +209,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
             pageSize: page.pageSize,
             ...formValues,
           });
-          updateStatistics(result.list || []);
+          updateStatistics(result.list || [], result.total);
           return result;
         },
       },
diff --git a/apps/web-ele/src/views/iot/rule/scene/modules/form.vue b/apps/web-ele/src/views/iot/rule/scene/modules/form.vue
index 26dfd1575..98e95c06b 100644
--- a/apps/web-ele/src/views/iot/rule/scene/modules/form.vue
+++ b/apps/web-ele/src/views/iot/rule/scene/modules/form.vue
@@ -7,9 +7,12 @@ import { useVbenDrawer } from '@vben/common-ui';
 import {
   CommonStatusEnum,
   IotRuleSceneActionTypeEnum,
+  IotRuleSceneTriggerConditionTypeEnum,
+  IotRuleSceneTriggerTimeOperatorEnum,
   IotRuleSceneTriggerTypeEnum,
   isDeviceTrigger,
 } from '@vben/constants';
+import { CronUtils } from '@vben/utils';
 
 import { ElForm, ElMessage } from 'element-plus';
 
@@ -101,12 +104,14 @@ function buildEmptyFormData(): RuleSceneApi.SceneRule {
 
 /** 回显时兜底，保证触发器/执行器数组不为空 */
 function normalizeFormData(result: any): RuleSceneApi.SceneRule {
+  const triggers: RuleSceneApi.Trigger[] = result.triggers?.length
+    ? result.triggers
+    : buildEmptyFormData().triggers!;
+  const actions: RuleSceneApi.Action[] = result.actions || [];
   return {
     ...result,
-    triggers: result.triggers?.length
-      ? result.triggers
-      : buildEmptyFormData().triggers,
-    actions: result.actions || [],
+    triggers,
+    actions,
   };
 }
 
@@ -126,11 +131,14 @@ function validateTriggers(_rule: any, value: any, callback: any) {
         callback(new Error(`触发器 ${i + 1}：产品不能为空`));
         return;
       }
-      if (!trigger.deviceId) {
+      // deviceId = 0 表示「全部设备」（DEVICE_SELECTOR_OPTIONS.ALL_DEVICES），是合法值；仅 undefined / null 视为未选
+      if (trigger.deviceId === undefined || trigger.deviceId === null) {
         callback(new Error(`触发器 ${i + 1}：设备不能为空`));
         return;
       }
-      if (!trigger.identifier) {
+      const isStateUpdate =
+        trigger.type === IotRuleSceneTriggerTypeEnum.DEVICE_STATE_UPDATE;
+      if (!isStateUpdate && !trigger.identifier) {
         callback(new Error(`触发器 ${i + 1}：物模型标识符不能为空`));
         return;
       }
@@ -153,12 +161,98 @@ function validateTriggers(_rule: any, value: any, callback: any) {
         }
       }
     }
-    if (
-      trigger.type === IotRuleSceneTriggerTypeEnum.TIMER &&
-      !trigger.cronExpression
-    ) {
-      callback(new Error(`触发器 ${i + 1}：CRON 表达式不能为空`));
-      return;
+    if (trigger.type === IotRuleSceneTriggerTypeEnum.TIMER) {
+      if (!trigger.cronExpression) {
+        callback(new Error(`触发器 ${i + 1}：CRON 表达式不能为空`));
+        return;
+      }
+      if (!CronUtils.validate(trigger.cronExpression)) {
+        callback(new Error(`触发器 ${i + 1}：CRON 表达式格式不正确`));
+        return;
+      }
+    }
+    // 递归校验 conditionGroups（嵌套条件组）
+    if (trigger.conditionGroups?.length) {
+      for (const [gi, group] of trigger.conditionGroups.entries()) {
+        if (!Array.isArray(group) || group.length === 0) {
+          callback(
+            new Error(`触发器 ${i + 1}：条件组 ${gi + 1} 不能为空`),
+          );
+          return;
+        }
+        for (const [ci, condition] of group.entries()) {
+          const prefix = `触发器 ${i + 1} 条件组 ${gi + 1} 条件 ${ci + 1}`;
+          if (!condition.type) {
+            callback(new Error(`${prefix}：条件类型不能为空`));
+            return;
+          }
+          const isDeviceStatus =
+            condition.type ===
+            IotRuleSceneTriggerConditionTypeEnum.DEVICE_STATUS;
+          const isDeviceProperty =
+            condition.type ===
+            IotRuleSceneTriggerConditionTypeEnum.DEVICE_PROPERTY;
+          const isCurrentTime =
+            condition.type ===
+            IotRuleSceneTriggerConditionTypeEnum.CURRENT_TIME;
+          if (isDeviceStatus || isDeviceProperty) {
+            if (!condition.productId) {
+              callback(new Error(`${prefix}：产品不能为空`));
+              return;
+            }
+            // deviceId = 0 表示「全部设备」（DEVICE_SELECTOR_OPTIONS.ALL_DEVICES），是合法值
+            if (
+              condition.deviceId === undefined ||
+              condition.deviceId === null
+            ) {
+              callback(new Error(`${prefix}：设备不能为空`));
+              return;
+            }
+            if (isDeviceProperty && !condition.identifier) {
+              callback(new Error(`${prefix}：物模型标识符不能为空`));
+              return;
+            }
+          }
+          if (!condition.operator) {
+            callback(new Error(`${prefix}：操作符不能为空`));
+            return;
+          }
+          // 设备状态：param 是状态值（必填）；设备属性：param 是比较值（必填）
+          if (
+            (isDeviceStatus || isDeviceProperty) &&
+            (condition.param === undefined ||
+              condition.param === null ||
+              condition.param === '')
+          ) {
+            callback(
+              new Error(
+                `${prefix}：${isDeviceStatus ? '设备状态' : '比较值'}不能为空`,
+              ),
+            );
+            return;
+          }
+          // 当前时间：TODAY 不需要 param；BETWEEN_TIME 需要双段「v1,v2」；其它需要单段
+          if (isCurrentTime) {
+            const op = condition.operator;
+            if (op === IotRuleSceneTriggerTimeOperatorEnum.TODAY.value) {
+              // TODAY 无需 param
+            } else if (
+              op === IotRuleSceneTriggerTimeOperatorEnum.BETWEEN_TIME.value
+            ) {
+              const parts = condition.param
+                ? String(condition.param).split(',')
+                : [];
+              if (parts.length < 2 || !parts[0] || !parts[1]) {
+                callback(new Error(`${prefix}：起止时间不能为空`));
+                return;
+              }
+            } else if (!condition.param) {
+              callback(new Error(`${prefix}：时间值不能为空`));
+              return;
+            }
+          }
+        }
+      }
     }
   }
   callback();
@@ -183,7 +277,10 @@ function validateActions(_rule: any, value: any, callback: any) {
         callback(new Error(`执行器 ${i + 1}：产品不能为空`));
         return;
       }
-      if (!action.deviceId) {
+      // deviceId = 0 表示「全部设备」（DEVICE_SELECTOR_OPTIONS.ALL_DEVICES）；
+      // 后端 IotDevicePropertySetSceneRuleAction / IotDeviceServiceInvokeSceneRuleAction
+      // 均支持广播执行，因此 0 是合法值，仅 undefined / null 视为未选
+      if (action.deviceId === undefined || action.deviceId === null) {
         callback(new Error(`执行器 ${i + 1}：设备不能为空`));
         return;
       }
@@ -199,9 +296,9 @@ function validateActions(_rule: any, value: any, callback: any) {
         return;
       }
     }
+    // 仅恢复告警动作需要选择已有告警配置；触发告警动作不需要预选 alertConfigId
     if (
-      (action.type === IotRuleSceneActionTypeEnum.ALERT_TRIGGER ||
-        action.type === IotRuleSceneActionTypeEnum.ALERT_RECOVER) &&
+      action.type === IotRuleSceneActionTypeEnum.ALERT_RECOVER &&
       !action.alertConfigId
     ) {
       callback(new Error(`执行器 ${i + 1}：告警配置不能为空`));
diff --git a/apps/web-ele/src/views/iot/thingmodel/modules/components/data-definition.vue b/apps/web-ele/src/views/iot/thingmodel/modules/components/data-definition.vue
index e8990dff3..19637601b 100644
--- a/apps/web-ele/src/views/iot/thingmodel/modules/components/data-definition.vue
+++ b/apps/web-ele/src/views/iot/thingmodel/modules/components/data-definition.vue
@@ -1,8 +1,6 @@
 <script lang="ts" setup>
 import type { ThingModelApi } from '#/api/iot/thingmodel';
 
-import { computed } from 'vue';
-
 import {
   getEventTypeLabel,
   getThingModelServiceCallTypeLabel,
@@ -10,9 +8,7 @@ import {
   IoTThingModelTypeEnum,
 } from '@vben/constants';
 
-import { ElTooltip } from 'element-plus';
-
-const props = defineProps<{ data: ThingModelApi.ThingModel }>();
+defineProps<{ data: ThingModelApi.ThingModel }>();
 const NUMBER_TYPES = new Set<string>([
   IoTDataSpecsDataTypeEnum.DOUBLE,
   IoTDataSpecsDataTypeEnum.FLOAT,
@@ -27,26 +23,6 @@ const LIST_TYPES = new Set<string>([
   IoTDataSpecsDataTypeEnum.BOOL,
   IoTDataSpecsDataTypeEnum.ENUM,
 ]);
-
-const formattedDataSpecsList = computed(() => {
-  if (!props.data.property?.dataSpecsList?.length) {
-    return '';
-  }
-  return props.data.property.dataSpecsList
-    .map((item) => `${item.value}-${item.name}`)
-    .join('、');
-});
-
-const shortText = computed(() => {
-  const list = props.data.property?.dataSpecsList;
-  if (!list?.length) {
-    return '-';
-  }
-  const first = list[0];
-  return list.length > 1
-    ? `${first.value}-${first.name} 等 ${list.length} 项`
-    : `${first.value}-${first.name}`;
-});
 </script>
 
 <template>
@@ -62,17 +38,19 @@ const shortText = computed(() => {
     </div>
     <div v-if="PLACEHOLDER_TYPES.has(data.property?.dataType as any)">-</div>
     <div v-if="LIST_TYPES.has(data.property?.dataType as any)">
-      <ElTooltip :content="formattedDataSpecsList" placement="top-start">
-        <span
-          class="cursor-help border-b border-dashed border-gray-300 hover:border-blue-500 hover:text-blue-500"
-        >
-          {{
-            data.property?.dataType === IoTDataSpecsDataTypeEnum.BOOL
-              ? '布尔值'
-              : '枚举值'
-          }}：{{ shortText }}
-        </span>
-      </ElTooltip>
+      <div>
+        {{
+          data.property?.dataType === IoTDataSpecsDataTypeEnum.BOOL
+            ? '布尔值'
+            : '枚举值'
+        }}：
+      </div>
+      <div
+        v-for="item in data.property?.dataSpecsList || []"
+        :key="String(item.value)"
+      >
+        {{ item.name }}-{{ item.value }}
+      </div>
     </div>
   </template>
   <!-- 服务 -->
diff --git a/apps/web-ele/src/views/iot/thingmodel/modules/data-specs/array.vue b/apps/web-ele/src/views/iot/thingmodel/modules/data-specs/array.vue
index b1d465c3f..0b94a7401 100644
--- a/apps/web-ele/src/views/iot/thingmodel/modules/data-specs/array.vue
+++ b/apps/web-ele/src/views/iot/thingmodel/modules/data-specs/array.vue
@@ -25,12 +25,10 @@ const childDataTypeOptions = getDataTypeOptions().filter(
 
 const dataSpecs = useVModel(props, 'modelValue', emits) as Ref<any>;
 
-/** 元素类型切到 struct 时，初始化 dataSpecsList 占位 */
+/** 元素类型切换时，清理旧子类型的结构体属性配置 */
 function handleChange(val: any) {
-  if (val !== IoTDataSpecsDataTypeEnum.STRUCT) {
-    return;
-  }
   dataSpecs.value.dataSpecsList = [];
+  dataSpecs.value.childDataType = val;
 }
 </script>
 
@@ -62,5 +60,6 @@ function handleChange(val: any) {
   <ThingModelStructDataSpecs
     v-if="dataSpecs.childDataType === IoTDataSpecsDataTypeEnum.STRUCT"
     v-model="dataSpecs.dataSpecsList"
+    field-path="property.dataSpecs.dataSpecsList"
   />
 </template>
diff --git a/apps/web-ele/src/views/iot/thingmodel/modules/data-specs/enum.vue b/apps/web-ele/src/views/iot/thingmodel/modules/data-specs/enum.vue
index 4acfd9653..4ef0e0e19 100644
--- a/apps/web-ele/src/views/iot/thingmodel/modules/data-specs/enum.vue
+++ b/apps/web-ele/src/views/iot/thingmodel/modules/data-specs/enum.vue
@@ -2,6 +2,7 @@
 <script lang="ts" setup>
 import type { Ref } from 'vue';
 
+import { IoTDataSpecsDataTypeEnum } from '@vben/constants';
 import { isEmpty } from '@vben/utils';
 
 import { useVModel } from '@vueuse/core';
@@ -17,7 +18,11 @@ const validateEnumName = buildIdentifierLikeNameValidator('枚举描述');
 
 /** 添加枚举项 */
 function addEnum() {
-  dataSpecsList.value.push({ name: '', value: '' } as any);
+  dataSpecsList.value.push({
+    dataType: IoTDataSpecsDataTypeEnum.ENUM,
+    name: '',
+    value: '',
+  } as any);
 }
 
 /** 删除枚举项 */
diff --git a/apps/web-ele/src/views/iot/thingmodel/modules/data-specs/number.vue b/apps/web-ele/src/views/iot/thingmodel/modules/data-specs/number.vue
index 0a8706e69..bbaa29e13 100644
--- a/apps/web-ele/src/views/iot/thingmodel/modules/data-specs/number.vue
+++ b/apps/web-ele/src/views/iot/thingmodel/modules/data-specs/number.vue
@@ -27,24 +27,99 @@ function unitChange(unitSpecs: any) {
   dataSpecs.value.unitName = unitName;
   dataSpecs.value.unit = unit;
 }
+
+/** 校验最小值 */
+function validateMin(_rule: any, _value: any, callback: any) {
+  const min = Number(dataSpecs.value.min);
+  const max = Number(dataSpecs.value.max);
+  if (Number.isNaN(min)) {
+    callback(new Error('请输入有效的数值'));
+    return;
+  }
+  if (!Number.isNaN(max) && min >= max) {
+    callback(new Error('最小值必须小于最大值'));
+    return;
+  }
+  callback();
+}
+
+/** 校验最大值 */
+function validateMax(_rule: any, _value: any, callback: any) {
+  const min = Number(dataSpecs.value.min);
+  const max = Number(dataSpecs.value.max);
+  if (Number.isNaN(max)) {
+    callback(new Error('请输入有效的数值'));
+    return;
+  }
+  if (!Number.isNaN(min) && max <= min) {
+    callback(new Error('最大值必须大于最小值'));
+    return;
+  }
+  callback();
+}
+
+/** 校验步长 */
+function validateStep(_rule: any, _value: any, callback: any) {
+  const step = Number(dataSpecs.value.step);
+  if (Number.isNaN(step)) {
+    callback(new Error('请输入有效的数值'));
+    return;
+  }
+  if (step <= 0) {
+    callback(new Error('步长必须大于 0'));
+    return;
+  }
+  const min = Number(dataSpecs.value.min);
+  const max = Number(dataSpecs.value.max);
+  if (!Number.isNaN(min) && !Number.isNaN(max) && step > max - min) {
+    callback(new Error('步长不能大于最大值与最小值的差值'));
+    return;
+  }
+  callback();
+}
 </script>
 
 <template>
   <ElFormItem label="取值范围">
     <div class="flex items-center justify-between">
-      <div class="flex-1">
+      <ElFormItem
+        :rules="[
+          { required: true, message: '最小值不能为空' },
+          { validator: validateMin, trigger: 'blur' },
+        ]"
+        class="mb-0 flex-1"
+        prop="property.dataSpecs.min"
+      >
         <ElInput v-model="dataSpecs.min" placeholder="请输入最小值" />
-      </div>
+      </ElFormItem>
       <span class="mx-2">~</span>
-      <div class="flex-1">
+      <ElFormItem
+        :rules="[
+          { required: true, message: '最大值不能为空' },
+          { validator: validateMax, trigger: 'blur' },
+        ]"
+        class="mb-0 flex-1"
+        prop="property.dataSpecs.max"
+      >
         <ElInput v-model="dataSpecs.max" placeholder="请输入最大值" />
-      </div>
+      </ElFormItem>
     </div>
   </ElFormItem>
-  <ElFormItem label="步长">
+  <ElFormItem
+    :rules="[
+      { required: true, message: '步长不能为空' },
+      { validator: validateStep, trigger: 'blur' },
+    ]"
+    label="步长"
+    prop="property.dataSpecs.step"
+  >
     <ElInput v-model="dataSpecs.step" placeholder="请输入步长" />
   </ElFormItem>
-  <ElFormItem label="单位">
+  <ElFormItem
+    :rules="[{ required: true, message: '请选择单位' }]"
+    label="单位"
+    prop="property.dataSpecs.unit"
+  >
     <ElSelect
       :model-value="
         dataSpecs.unit ? `${dataSpecs.unitName}-${dataSpecs.unit}` : ''
diff --git a/apps/web-ele/src/views/iot/thingmodel/modules/data-specs/struct.vue b/apps/web-ele/src/views/iot/thingmodel/modules/data-specs/struct.vue
index 89292c09d..424353d50 100644
--- a/apps/web-ele/src/views/iot/thingmodel/modules/data-specs/struct.vue
+++ b/apps/web-ele/src/views/iot/thingmodel/modules/data-specs/struct.vue
@@ -5,7 +5,7 @@ import { onMounted, ref } from 'vue';
 
 import { useVbenModal } from '@vben/common-ui';
 import { IoTDataSpecsDataTypeEnum } from '@vben/constants';
-import { isEmpty } from '@vben/utils';
+import { cloneDeep, isEmpty } from '@vben/utils';
 
 import { useVModel } from '@vueuse/core';
 import { ElButton, ElDivider, ElForm, ElFormItem, ElInput } from 'element-plus';
@@ -14,13 +14,33 @@ import { ThingModelFormRules } from '#/api/iot/thingmodel';
 
 import ThingModelProperty from '../property.vue';
 
-const props = defineProps<{ modelValue: any }>();
+const props = withDefaults(
+  defineProps<{
+    /** 父表单中 dataSpecsList 的 prop 路径（点号分隔），默认 property.dataSpecsList；
+     * array 嵌套 struct 时父级需传 'property.dataSpecs.dataSpecsList'，
+     * 否则父表单 validate() 无法定位该字段，非空校验不会触发。 */
+    fieldPath?: string;
+    modelValue: any;
+  }>(),
+  {
+    fieldPath: 'property.dataSpecsList',
+  },
+);
 const emits = defineEmits(['update:modelValue']);
 const dataSpecsList = useVModel(props, 'modelValue', emits) as Ref<any[]>;
 
 const structFormRef = ref();
 const formData = ref<any>(buildEmptyFormData());
 
+/** 校验结构体属性对象非空 */
+function validateStructSpecsList(_rule: any, _value: any, callback: any) {
+  if (isEmpty(dataSpecsList.value)) {
+    callback(new Error('请至少添加一个结构体属性对象'));
+    return;
+  }
+  callback();
+}
+
 const [Modal, modalApi] = useVbenModal({
   async onConfirm() {
     try {
@@ -64,14 +84,15 @@ const [Modal, modalApi] = useVbenModal({
     if (isEmpty(data)) {
       return;
     }
+    // 编辑回显时 cloneDeep，避免弹窗 v-model 改到原始对象（用户取消时不污染外层 dataSpecsList）
     formData.value = {
       identifier: data.identifier ?? '',
       name: data.name ?? '',
       description: data.description ?? '',
       property: {
         dataType: data.childDataType ?? IoTDataSpecsDataTypeEnum.INT,
-        dataSpecs: data.dataSpecs ?? {},
-        dataSpecsList: data.dataSpecsList ?? [],
+        dataSpecs: data.dataSpecs ? cloneDeep(data.dataSpecs) : {},
+        dataSpecsList: data.dataSpecsList ? cloneDeep(data.dataSpecsList) : [],
       },
     };
   },
@@ -109,7 +130,11 @@ onMounted(() => {
 </script>
 
 <template>
-  <ElFormItem label="属性对象">
+  <ElFormItem
+    :prop="fieldPath"
+    :rules="[{ validator: validateStructSpecsList, trigger: 'change' }]"
+    label="属性对象"
+  >
     <div
       v-for="(item, index) in dataSpecsList"
       :key="index"
diff --git a/apps/web-ele/src/views/iot/thingmodel/modules/form.vue b/apps/web-ele/src/views/iot/thingmodel/modules/form.vue
index cba714356..9044b2703 100644
--- a/apps/web-ele/src/views/iot/thingmodel/modules/form.vue
+++ b/apps/web-ele/src/views/iot/thingmodel/modules/form.vue
@@ -155,9 +155,6 @@ function fillExtraAttributes(data: any) {
       data.dataType = data.event.dataType;
       data.event.identifier = data.identifier;
       data.event.name = data.name;
-      if (isEmpty(data.event.outputParams)) {
-        delete data.event.outputParams;
-      }
       delete data.property;
       delete data.service;
 
@@ -178,12 +175,6 @@ function fillExtraAttributes(data: any) {
       data.dataType = data.service.dataType;
       data.service.identifier = data.identifier;
       data.service.name = data.name;
-      if (isEmpty(data.service.inputParams)) {
-        delete data.service.inputParams;
-      }
-      if (isEmpty(data.service.outputParams)) {
-        delete data.service.outputParams;
-      }
       delete data.property;
       delete data.event;
 
@@ -234,7 +225,10 @@ function removeDataSpecs(val: any) {
         label="标识符"
         prop="identifier"
       >
-        <ElInput v-model="formData.identifier" placeholder="请输入标识符" />
+        <ElInput
+          v-model="formData.identifier"
+          placeholder="请输入标识符"
+        />
       </ElFormItem>
       <!-- 属性配置 -->
       <ThingModelProperty
diff --git a/apps/web-ele/src/views/iot/thingmodel/modules/input-output-param.vue b/apps/web-ele/src/views/iot/thingmodel/modules/input-output-param.vue
index 6035e1028..dbbb97e17 100644
--- a/apps/web-ele/src/views/iot/thingmodel/modules/input-output-param.vue
+++ b/apps/web-ele/src/views/iot/thingmodel/modules/input-output-param.vue
@@ -5,16 +5,27 @@ import { ref } from 'vue';
 
 import { useVbenModal } from '@vben/common-ui';
 import { IoTDataSpecsDataTypeEnum } from '@vben/constants';
-import { isEmpty } from '@vben/utils';
+import { cloneDeep, isEmpty } from '@vben/utils';
 
 import { useVModel } from '@vueuse/core';
-import { ElButton, ElDivider, ElForm, ElFormItem, ElInput } from 'element-plus';
+import {
+  ElButton,
+  ElDivider,
+  ElForm,
+  ElFormItem,
+  ElInput,
+  ElMessage,
+} from 'element-plus';
 
 import { ThingModelFormRules } from '#/api/iot/thingmodel';
 
 import ThingModelProperty from './property.vue';
 
-const props = defineProps<{ direction: string; modelValue: any }>();
+const props = defineProps<{
+  direction: string;
+  existingIdentifiers?: string[];
+  modelValue: any;
+}>();
 const emits = defineEmits(['update:modelValue']);
 const thingModelParams = useVModel(props, 'modelValue', emits) as Ref<any[]>;
 
@@ -33,6 +44,13 @@ const [Modal, modalApi] = useVbenModal({
     }
     // 组装表单
     const data = formData.value;
+    if (
+      data.identifier &&
+      props.existingIdentifiers?.includes(data.identifier)
+    ) {
+      ElMessage.warning('输入参数和输出参数标识符不能重复');
+      return;
+    }
     const item = {
       identifier: data.identifier,
       name: data.name,
@@ -72,15 +90,15 @@ const [Modal, modalApi] = useVbenModal({
     if (isEmpty(data)) {
       return;
     }
-    // 设置到 values
+    // 编辑回显时 cloneDeep，避免弹窗 v-model 改到原始对象（用户取消时不污染外层 thingModelParams）
     formData.value = {
       identifier: data.identifier ?? '',
       name: data.name ?? '',
       description: data.description ?? '',
       property: {
         dataType: data.dataType ?? IoTDataSpecsDataTypeEnum.INT,
-        dataSpecs: data.dataSpecs ?? {},
-        dataSpecsList: data.dataSpecsList ?? [],
+        dataSpecs: data.dataSpecs ? cloneDeep(data.dataSpecs) : {},
+        dataSpecsList: data.dataSpecsList ? cloneDeep(data.dataSpecsList) : [],
       },
     };
   },
diff --git a/apps/web-ele/src/views/iot/thingmodel/modules/service.vue b/apps/web-ele/src/views/iot/thingmodel/modules/service.vue
index 4dd5ec47a..15d261724 100644
--- a/apps/web-ele/src/views/iot/thingmodel/modules/service.vue
+++ b/apps/web-ele/src/views/iot/thingmodel/modules/service.vue
@@ -29,6 +29,17 @@ watch(
     (service.value.callType = IoTThingModelServiceCallTypeEnum.ASYNC.value),
   { immediate: true },
 );
+
+/** 提取参数标识符列表，用于输入 / 输出参数跨表去重 */
+function getParamIdentifiers(params?: any[]) {
+  const identifiers: string[] = [];
+  for (const item of params || []) {
+    if (item.identifier) {
+      identifiers.push(item.identifier);
+    }
+  }
+  return identifiers;
+}
 </script>
 
 <template>
@@ -51,12 +62,14 @@ watch(
     <ThingModelInputOutputParam
       v-model="service.inputParams"
       :direction="IoTThingModelParamDirectionEnum.INPUT"
+      :existing-identifiers="getParamIdentifiers(service.outputParams)"
     />
   </ElFormItem>
   <ElFormItem label="输出参数">
     <ThingModelInputOutputParam
       v-model="service.outputParams"
       :direction="IoTThingModelParamDirectionEnum.OUTPUT"
+      :existing-identifiers="getParamIdentifiers(service.inputParams)"
     />
   </ElFormItem>
 </template>
diff --git a/apps/web-ele/src/views/mes/cal/calendar/components/calendar-date-cell.vue b/apps/web-ele/src/views/mes/cal/calendar/components/calendar-date-cell.vue
new file mode 100644
index 000000000..2b9322bc0
--- /dev/null
+++ b/apps/web-ele/src/views/mes/cal/calendar/components/calendar-date-cell.vue
@@ -0,0 +1,135 @@
+<script lang="ts" setup>
+import type { MesCalCalendarApi } from '#/api/mes/cal/calendar';
+
+import { computed } from 'vue';
+
+import dayjs from 'dayjs';
+import { ElTag } from 'element-plus';
+import { SolarDay } from 'tyme4ts';
+
+import { MesCalShiftTypeEnum } from '#/views/mes/utils/constants';
+
+const props = defineProps<{
+  calendarDayMap: Map<string, MesCalCalendarApi.CalendarDay>; // 排班数据
+  day: string; // 日期，格式 yyyy-MM-dd
+  holidaySet: Set<string>; // 节假日集合
+}>();
+
+const dayNumber = computed(() => props.day.split('-')[2] || '');
+const isHoliday = computed(() => props.holidaySet.has(props.day));
+const isWeekend = computed(() => {
+  const weekday = dayjs(props.day).day();
+  return weekday === 0 || weekday === 6; // 0=周日，6=周六
+});
+
+const calDay = computed(() => props.calendarDayMap.get(props.day));
+const teamShifts = computed(() => calDay.value?.teamShifts || []);
+const shiftType = computed(() => calDay.value?.shiftType);
+
+/**
+ * 班次标签展示数据：根据 sort 与 shiftType 推导背景色
+ *
+ * 配色规则（sort 对应轮班方式中的班次顺序）：
+ *   sort=1 白班 → 绿色（#95d475）
+ *   sort=2 中班 → 三班倒用橙色（#f0a020），两班倒用灰色（#909399）
+ *   sort=3 夜班 → 灰色（#909399）
+ */
+const displayShifts = computed(() => {
+  const isThreeShift = shiftType.value === MesCalShiftTypeEnum.THREE;
+  const colorMap: Record<number, string> = {
+    1: 'bg-[#95d475]',
+    2: isThreeShift ? 'bg-[#f0a020]' : 'bg-[#909399]',
+    3: 'bg-[#909399]',
+  };
+  return teamShifts.value
+    .map((item) => {
+      const bgClass = colorMap[item.sort ?? -1];
+      if (!bgClass) {
+        return null;
+      }
+      return {
+        bgClass,
+        key: `${item.teamId}-${item.shiftId}`,
+        label: `${item.shiftName} · ${item.teamName}`,
+      };
+    })
+    .filter((v): v is { bgClass: string; key: string; label: string } => !!v);
+});
+
+/** 解析当天的农历、节气、节日信息 */
+const lunarInfo = computed(() => {
+  const [year, month, date] = props.day.split('-').map(Number);
+  try {
+    const solarDay = SolarDay.fromYmd(year!, month!, date!);
+    const lunarDay = solarDay.getLunarDay();
+    const solarFestival = solarDay.getFestival();
+    const lunarFestival = lunarDay.getFestival();
+    const termDay = solarDay.getTermDay();
+    const termName =
+      termDay.getDayIndex() === 0 ? termDay.getSolarTerm().getName() : '';
+    const lunarMonthName = lunarDay.getLunarMonth().getName();
+    const lunarDayName = lunarDay.getName();
+    return {
+      lunarFestival: lunarFestival ? lunarFestival.getName() : '',
+      lunarText: lunarMonthName + lunarDayName,
+      solarFestival: solarFestival ? solarFestival.getName() : '',
+      termName,
+    };
+  } catch {
+    return {
+      lunarFestival: '',
+      lunarText: '',
+      solarFestival: '',
+      termName: '',
+    };
+  }
+});
+
+const lunarDisplay = computed(() => {
+  const info = lunarInfo.value;
+  return (
+    info.solarFestival || info.lunarFestival || info.termName || info.lunarText
+  );
+});
+
+const hasFestivalDay = computed(() => {
+  const info = lunarInfo.value;
+  return Boolean(info.solarFestival || info.lunarFestival || info.termName);
+});
+</script>
+
+<template>
+  <div class="flex h-full flex-col overflow-hidden p-1">
+    <!-- 顶部：日期数字 + 上班/休息标签 -->
+    <div class="flex shrink-0 items-center justify-between">
+      <span class="text-base font-medium" :class="{ 'text-red-500': isWeekend }">
+        {{ dayNumber }}
+      </span>
+      <ElTag v-if="isHoliday" effect="dark" size="small" type="success">
+        休
+      </ElTag>
+      <ElTag v-else effect="dark" size="small">班</ElTag>
+    </div>
+    <!-- 农历 / 节气 / 节日显示 -->
+    <div
+      class="mt-0.5 shrink-0 truncate text-[11px]"
+      :class="hasFestivalDay ? 'text-green-600' : 'text-muted-foreground'"
+    >
+      {{ lunarDisplay }}
+    </div>
+    <!--
+      班次列表：节假日不显示排班
+      配色规则与背景类由 displayShifts 计算
+    -->
+    <div v-if="!isHoliday" class="mt-0.5 flex flex-col gap-px overflow-hidden">
+      <div
+        v-for="shift in displayShifts"
+        :key="shift.key"
+        class="block w-full truncate rounded-sm px-1 py-px text-[11px] leading-normal text-white"
+        :class="shift.bgClass"
+      >
+        {{ shift.label }}
+      </div>
+    </div>
+  </div>
+</template>
diff --git a/apps/web-ele/src/views/mes/cal/calendar/components/calendar-legend.vue b/apps/web-ele/src/views/mes/cal/calendar/components/calendar-legend.vue
new file mode 100644
index 000000000..21e32812e
--- /dev/null
+++ b/apps/web-ele/src/views/mes/cal/calendar/components/calendar-legend.vue
@@ -0,0 +1,38 @@
+<script lang="ts" setup>
+import { ElTag } from 'element-plus';
+
+/** 配色说明项：色块 + 文案 */
+const legendItems: Array<{ color: string; label: string }> = [
+  { color: 'bg-[#95d475]', label: '白班' },
+  { color: 'bg-[#f0a020]', label: '中班（三班倒）' },
+  { color: 'bg-[#909399]', label: '中班（两班倒）/ 夜班' },
+];
+</script>
+
+<template>
+  <div
+    class="text-muted-foreground flex flex-wrap items-center gap-x-4 gap-y-1 px-1 py-2 text-xs"
+  >
+    <span class="shrink-0">配色说明：</span>
+    <span
+      v-for="item in legendItems"
+      :key="item.label"
+      class="flex items-center gap-1"
+    >
+      <span
+        class="inline-block h-2.5 w-2.5 shrink-0 rounded-sm"
+        :class="item.color"
+      ></span>
+      {{ item.label }}
+    </span>
+    <span class="flex items-center gap-1">
+      <span class="inline-block h-2.5 w-2.5 shrink-0 rounded-sm bg-[#f56c6c] opacity-60"></span>
+      <span class="text-red-500">红色日期</span>
+      = 周末
+    </span>
+    <span class="flex items-center gap-1">
+      <ElTag effect="dark" size="small" type="success"> 休 </ElTag>
+      = 节假日（不显示排班）
+    </span>
+  </div>
+</template>
diff --git a/apps/web-ele/src/views/mes/cal/calendar/components/calendar-panel.vue b/apps/web-ele/src/views/mes/cal/calendar/components/calendar-panel.vue
new file mode 100644
index 000000000..207061e0e
--- /dev/null
+++ b/apps/web-ele/src/views/mes/cal/calendar/components/calendar-panel.vue
@@ -0,0 +1,60 @@
+<script lang="ts" setup>
+import type { Dayjs } from 'dayjs';
+
+import type { MesCalCalendarApi } from '#/api/mes/cal/calendar';
+
+import { computed } from 'vue';
+
+import dayjs from 'dayjs';
+import { ElCalendar } from 'element-plus';
+
+import CalendarDateCell from './calendar-date-cell.vue';
+import CalendarLegend from './calendar-legend.vue';
+
+defineProps<{
+  calendarDayMap: Map<string, MesCalCalendarApi.CalendarDay>;
+  holidaySet: Set<string>;
+  loading?: boolean;
+}>();
+
+const currentDate = defineModel<Dayjs>('currentDate', { required: true });
+
+/** ElCalendar v-model 桥接：内部用 Dayjs，组件需要 Date */
+const calendarValue = computed({
+  get: () => currentDate.value.toDate(),
+  set: (val: Date) => {
+    currentDate.value = dayjs(val);
+  },
+});
+</script>
+
+<template>
+  <div>
+    <CalendarLegend />
+    <div v-loading="loading" class="bg-card overflow-hidden rounded-md">
+      <ElCalendar v-model="calendarValue" class="mes-calendar-panel">
+        <template #date-cell="{ data }">
+          <CalendarDateCell
+            v-if="data.type === 'current-month'"
+            :calendar-day-map="calendarDayMap"
+            :day="data.day"
+            :holiday-set="holidaySet"
+          />
+          <div v-else class="text-muted-foreground/50 p-1 text-base">
+            {{ data.day.split('-')[2] }}
+          </div>
+        </template>
+      </ElCalendar>
+    </div>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+/* 收紧 ElCalendar 默认日期单元高度，使用自定义单元 */
+.mes-calendar-panel {
+  :deep(.el-calendar-table .el-calendar-day) {
+    height: 110px;
+    padding: 0;
+  }
+}
+</style>
diff --git a/apps/web-ele/src/views/mes/cal/calendar/components/use-calendar.ts b/apps/web-ele/src/views/mes/cal/calendar/components/use-calendar.ts
new file mode 100644
index 000000000..381e7f5bd
--- /dev/null
+++ b/apps/web-ele/src/views/mes/cal/calendar/components/use-calendar.ts
@@ -0,0 +1,99 @@
+import type { Dayjs } from 'dayjs';
+
+import type { MesCalCalendarApi } from '#/api/mes/cal/calendar';
+
+import { ref, watch } from 'vue';
+
+import dayjs from 'dayjs';
+
+import { getCalendarList } from '#/api/mes/cal/calendar';
+import { getHolidayList } from '#/api/mes/cal/holiday';
+import { HolidayType } from '#/views/mes/utils/constants';
+
+/**
+ * 排班日历通用 composable
+ *
+ * 封装日历组件中通用的响应式状态、假期加载、排班查询、月份切换逻辑
+ */
+export function useCalendar() {
+  const loading = ref(false);
+  const currentDate = ref<Dayjs>(dayjs());
+  const calendarDayMap = ref<Map<string, MesCalCalendarApi.CalendarDay>>(
+    new Map(),
+  );
+  const holidaySet = ref(new Set<string>());
+
+  /** 计算当前月份的起止时间 */
+  function getMonthRange() {
+    const startDay = currentDate.value
+      .startOf('month')
+      .format('YYYY-MM-DD 00:00:00');
+    const endDay = currentDate.value
+      .endOf('month')
+      .format('YYYY-MM-DD 23:59:59');
+    return { endDay, startDay };
+  }
+
+  /**
+   * 获取节假日列表，按当前月份范围加载
+   *
+   * 失败（无权限 / 接口异常）时不抛出，仅清空当月假期标记，
+   * 避免阻断使用方的主数据初始化
+   */
+  async function loadHolidays() {
+    const { endDay, startDay } = getMonthRange();
+    const days = new Set<string>();
+    try {
+      const list = await getHolidayList({ endDay, startDay });
+      for (const item of list || []) {
+        const day = item.day ? dayjs(item.day).format('YYYY-MM-DD') : '';
+        if (day && item.type === HolidayType.HOLIDAY) {
+          days.add(day);
+        }
+      }
+    } catch {
+      // 没有 mes:cal-holiday:query 权限或接口异常时，仅忽略假期标记
+    }
+    holidaySet.value = days;
+  }
+
+  /** 查询排班日历，params 由调用方提供 queryType 相关参数 */
+  async function fetchCalendar(params: Record<string, any>) {
+    loading.value = true;
+    try {
+      const { endDay, startDay } = getMonthRange();
+      const list = await getCalendarList({ ...params, endDay, startDay });
+      const map = new Map<string, MesCalCalendarApi.CalendarDay>();
+      for (const item of list || []) {
+        const day = item.day ? dayjs(item.day).format('YYYY-MM-DD') : '';
+        if (day) {
+          map.set(day, { ...item, day });
+        }
+      }
+      calendarDayMap.value = map;
+    } finally {
+      loading.value = false;
+    }
+  }
+
+  /** 监听月份切换，调用回调刷新数据 */
+  function watchMonth(callback: () => void) {
+    watch(
+      () => currentDate.value.format('YYYY-MM'),
+      () => {
+        void loadHolidays();
+        callback();
+      },
+    );
+  }
+
+  return {
+    calendarDayMap,
+    currentDate,
+    fetchCalendar,
+    holidaySet,
+    loadHolidays,
+    loading,
+    watchMonth,
+  };
+}
diff --git a/apps/web-ele/src/views/mes/cal/calendar/index.vue b/apps/web-ele/src/views/mes/cal/calendar/index.vue
new file mode 100644
index 000000000..1330438bf
--- /dev/null
+++ b/apps/web-ele/src/views/mes/cal/calendar/index.vue
@@ -0,0 +1,42 @@
+<script lang="ts" setup>
+import { ref } from 'vue';
+
+import { DocAlert, Page } from '@vben/common-ui';
+
+import dayjs from 'dayjs';
+import { ElTabPane, ElTabs } from 'element-plus';
+
+import TeamView from './modules/team-view.vue';
+import TypeView from './modules/type-view.vue';
+import UserView from './modules/user-view.vue';
+
+import 'dayjs/locale/zh-cn';
+
+dayjs.locale('zh-cn');
+
+const activeTab = ref<string>('type');
+</script>
+
+<template>
+  <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【排班】排班计划、排班日历"
+        url="https://doc.iocoder.cn/mes/cal/calendar/"
+      />
+    </template>
+    <div class="bg-card rounded-md p-3">
+      <ElTabs v-model="activeTab" type="border-card">
+        <ElTabPane label="按分类" name="type" :force-render="true">
+          <TypeView />
+        </ElTabPane>
+        <ElTabPane label="按班组" name="team" :force-render="true">
+          <TeamView />
+        </ElTabPane>
+        <ElTabPane label="按个人" name="user" :force-render="true">
+          <UserView />
+        </ElTabPane>
+      </ElTabs>
+    </div>
+  </Page>
+</template>
diff --git a/apps/web-ele/src/views/mes/cal/calendar/modules/team-view.vue b/apps/web-ele/src/views/mes/cal/calendar/modules/team-view.vue
new file mode 100644
index 000000000..7637c755b
--- /dev/null
+++ b/apps/web-ele/src/views/mes/cal/calendar/modules/team-view.vue
@@ -0,0 +1,84 @@
+<script lang="ts" setup>
+import type { MesCalTeamApi } from '#/api/mes/cal/team';
+
+import { onMounted, ref } from 'vue';
+
+import { getTeamList } from '#/api/mes/cal/team';
+
+import CalendarPanel from '../components/calendar-panel.vue';
+import { useCalendar } from '../components/use-calendar';
+
+const {
+  calendarDayMap,
+  currentDate,
+  fetchCalendar,
+  holidaySet,
+  loadHolidays,
+  loading,
+  watchMonth,
+} = useCalendar();
+
+const teamList = ref<MesCalTeamApi.Team[]>([]);
+const selectedTeamId = ref<number>();
+
+/** 查询当前月份的排班日历，按选中班组过滤 */
+function doFetch() {
+  if (!selectedTeamId.value) {
+    return;
+  }
+  fetchCalendar({ queryType: 'TEAM', teamId: selectedTeamId.value });
+}
+
+/** 点击左侧班组后切换并刷新日历 */
+function onSelectTeam(id: number) {
+  selectedTeamId.value = id;
+  doFetch();
+}
+
+/** 监听月份切换，重新加载当月排班 */
+watchMonth(() => {
+  if (selectedTeamId.value) {
+    doFetch();
+  }
+});
+
+onMounted(async () => {
+  // 假期列表与班组列表并行加载，避免假期接口无权限或异常时阻断班组排班查询
+  void loadHolidays();
+  teamList.value = await getTeamList();
+  if (teamList.value.length > 0 && teamList.value[0]?.id) {
+    onSelectTeam(teamList.value[0].id);
+  }
+});
+</script>
+
+<template>
+  <div class="flex">
+    <!-- 左侧：班组列表选择 -->
+    <div class="border-border mr-3 w-[150px] shrink-0 overflow-hidden rounded border">
+      <div
+        v-for="team in teamList"
+        :key="team.id"
+        class="text-foreground border-border hover:bg-muted/50 cursor-pointer border-b px-4 py-2.5 text-sm transition-colors last:border-b-0"
+        :class="
+          selectedTeamId === team.id
+            ? 'bg-primary/10 text-primary font-medium'
+            : ''
+        "
+        @click="onSelectTeam(team.id!)"
+      >
+        {{ team.name }}
+      </div>
+    </div>
+
+    <!-- 右侧：日历 -->
+    <div class="flex-1">
+      <CalendarPanel
+        v-model:current-date="currentDate"
+        :calendar-day-map="calendarDayMap"
+        :holiday-set="holidaySet"
+        :loading="loading"
+      />
+    </div>
+  </div>
+</template>
diff --git a/apps/web-ele/src/views/mes/cal/calendar/modules/type-view.vue b/apps/web-ele/src/views/mes/cal/calendar/modules/type-view.vue
new file mode 100644
index 000000000..2919e0755
--- /dev/null
+++ b/apps/web-ele/src/views/mes/cal/calendar/modules/type-view.vue
@@ -0,0 +1,85 @@
+<script lang="ts" setup>
+import type { DictDataType } from '@vben/hooks';
+
+import { onMounted, ref } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
+import CalendarPanel from '../components/calendar-panel.vue';
+import { useCalendar } from '../components/use-calendar';
+
+const {
+  calendarDayMap,
+  currentDate,
+  fetchCalendar,
+  holidaySet,
+  loadHolidays,
+  loading,
+  watchMonth,
+} = useCalendar();
+
+const typeOptions = ref<DictDataType[]>([]);
+const selectedType = ref<number>();
+
+/** 查询当前月份的排班日历，按选中分类过滤 */
+function doFetch() {
+  if (selectedType.value === undefined) {
+    return;
+  }
+  fetchCalendar({ calendarType: selectedType.value, queryType: 'TYPE' });
+}
+
+/** 点击左侧分类后切换并刷新日历 */
+function onSelectType(value: number) {
+  selectedType.value = value;
+  doFetch();
+}
+
+/** 监听月份切换，重新加载当月排班 */
+watchMonth(() => {
+  if (selectedType.value !== undefined) {
+    doFetch();
+  }
+});
+
+onMounted(() => {
+  // 假期列表与排班主数据并行加载，避免假期接口无权限或异常时阻断分类/排班加载
+  void loadHolidays();
+  typeOptions.value = getDictOptions(DICT_TYPE.MES_CAL_CALENDAR_TYPE, 'number');
+  if (typeOptions.value.length > 0) {
+    onSelectType(typeOptions.value[0]!.value as number);
+  }
+});
+</script>
+
+<template>
+  <div class="flex">
+    <!-- 左侧：班组类型选择 -->
+    <div class="border-border mr-3 w-[150px] shrink-0 overflow-hidden rounded border">
+      <div
+        v-for="item in typeOptions"
+        :key="item.value as number"
+        class="text-foreground border-border hover:bg-muted/50 cursor-pointer border-b px-4 py-2.5 text-sm transition-colors last:border-b-0"
+        :class="
+          selectedType === item.value
+            ? 'bg-primary/10 text-primary font-medium'
+            : ''
+        "
+        @click="onSelectType(item.value as number)"
+      >
+        {{ item.label }}
+      </div>
+    </div>
+
+    <!-- 右侧：日历 -->
+    <div class="flex-1">
+      <CalendarPanel
+        v-model:current-date="currentDate"
+        :calendar-day-map="calendarDayMap"
+        :holiday-set="holidaySet"
+        :loading="loading"
+      />
+    </div>
+  </div>
+</template>
diff --git a/apps/web-ele/src/views/mes/cal/calendar/modules/user-view.vue b/apps/web-ele/src/views/mes/cal/calendar/modules/user-view.vue
new file mode 100644
index 000000000..556af5fe3
--- /dev/null
+++ b/apps/web-ele/src/views/mes/cal/calendar/modules/user-view.vue
@@ -0,0 +1,98 @@
+<script lang="ts" setup>
+import type { SystemUserApi } from '#/api/system/user';
+
+import { onMounted, ref } from 'vue';
+
+import { IconifyIcon } from '@vben/icons';
+
+import {
+  ElButton,
+  ElForm,
+  ElFormItem,
+  ElOption,
+  ElSelect,
+} from 'element-plus';
+
+import { getSimpleUserList } from '#/api/system/user';
+
+import CalendarPanel from '../components/calendar-panel.vue';
+import { useCalendar } from '../components/use-calendar';
+
+const {
+  calendarDayMap,
+  currentDate,
+  fetchCalendar,
+  holidaySet,
+  loadHolidays,
+  loading,
+  watchMonth,
+} = useCalendar();
+
+const userId = ref<number>();
+const userOptions = ref<SystemUserApi.User[]>([]);
+
+/** 查询当前月份的排班日历，按选中人员过滤 */
+function doFetch() {
+  if (!userId.value) {
+    return;
+  }
+  fetchCalendar({ queryType: 'USER', userId: userId.value });
+}
+
+/** 查询按钮 / 下拉选人后刷新日历 */
+function onUserQuery() {
+  doFetch();
+}
+
+/** 监听月份切换，重新加载当月排班 */
+watchMonth(() => {
+  if (userId.value) {
+    doFetch();
+  }
+});
+
+onMounted(async () => {
+  // 假期列表与人员列表并行加载，避免假期接口无权限或异常时阻断人员排班查询
+  void loadHolidays();
+  userOptions.value = await getSimpleUserList();
+});
+</script>
+
+<template>
+  <div>
+    <!-- 顶部：人员选择 -->
+    <ElForm :inline="true" class="mb-2.5">
+      <ElFormItem label="人员">
+        <ElSelect
+          v-model="userId"
+          clearable
+          filterable
+          placeholder="请输入人员姓名搜索"
+          class="!w-[200px]"
+          @change="onUserQuery"
+        >
+          <ElOption
+            v-for="user in userOptions"
+            :key="user.id"
+            :label="user.nickname"
+            :value="user.id!"
+          />
+        </ElSelect>
+      </ElFormItem>
+      <ElFormItem>
+        <ElButton type="primary" @click="onUserQuery">
+          <IconifyIcon icon="lucide:search" class="mr-1" />
+          查询
+        </ElButton>
+      </ElFormItem>
+    </ElForm>
+
+    <!-- 日历 -->
+    <CalendarPanel
+      v-model:current-date="currentDate"
+      :calendar-day-map="calendarDayMap"
+      :holiday-set="holidaySet"
+      :loading="loading"
+    />
+  </div>
+</template>
diff --git a/apps/web-ele/src/views/mes/cal/holiday/data.ts b/apps/web-ele/src/views/mes/cal/holiday/data.ts
new file mode 100644
index 000000000..a16b76999
--- /dev/null
+++ b/apps/web-ele/src/views/mes/cal/holiday/data.ts
@@ -0,0 +1,47 @@
+import type { VbenFormSchema } from '#/adapter/form';
+
+import { DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
+import { z } from '#/adapter/form';
+import { HolidayType } from '#/views/mes/utils/constants';
+
+/** 假期设置表单 */
+export function useHolidayFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'day',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'dayDisplay',
+      label: '日期',
+      component: 'Input',
+      componentProps: {
+        disabled: true,
+      },
+    },
+    {
+      fieldName: 'type',
+      label: '类型',
+      component: 'RadioGroup',
+      componentProps: {
+        options: getDictOptions(DICT_TYPE.MES_CAL_HOLIDAY_TYPE, 'number'),
+      },
+      rules: z.number().default(HolidayType.WORKDAY),
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入备注',
+        rows: 3,
+      },
+    },
+  ];
+}
diff --git a/apps/web-ele/src/views/mes/cal/holiday/index.vue b/apps/web-ele/src/views/mes/cal/holiday/index.vue
new file mode 100644
index 000000000..5c36d8b77
--- /dev/null
+++ b/apps/web-ele/src/views/mes/cal/holiday/index.vue
@@ -0,0 +1,190 @@
+<script lang="ts" setup>
+import type { Dayjs } from 'dayjs';
+
+import { computed, onMounted, ref, watch } from 'vue';
+
+import { useAccess } from '@vben/access';
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
+
+import dayjs from 'dayjs';
+import { ElCalendar, ElMessage, ElTag } from 'element-plus';
+import { SolarDay } from 'tyme4ts';
+
+import { getHolidayList } from '#/api/mes/cal/holiday';
+import { HolidayType } from '#/views/mes/utils/constants';
+
+import HolidayForm from './modules/form.vue';
+
+import 'dayjs/locale/zh-cn';
+
+dayjs.locale('zh-cn');
+
+const currentDate = ref<Dayjs>(dayjs()); // 当前日历选中日期
+const holidaySet = ref(new Set<string>()); // 节假日日期集合
+const lastFetchedMonth = ref(''); // 上次加载月份
+const { hasAccessByCodes } = useAccess();
+
+/** ElCalendar v-model 桥接：内部用 Dayjs，组件需要 Date */
+const calendarValue = computed({
+  get: () => currentDate.value.toDate(),
+  set: (val: Date) => {
+    currentDate.value = dayjs(val);
+  },
+});
+
+const [HolidayFormModal, holidayFormModalApi] = useVbenModal({
+  connectedComponent: HolidayForm,
+  destroyOnClose: true,
+});
+
+/** 加载假期列表（按当前日历可见范围过滤） */
+async function getList() {
+  const current = currentDate.value;
+  const startDay = current
+    .subtract(1, 'month')
+    .startOf('month')
+    .format('YYYY-MM-DD 00:00:00');
+  const endDay = current
+    .add(1, 'month')
+    .endOf('month')
+    .format('YYYY-MM-DD 23:59:59');
+  const list = await getHolidayList({ startDay, endDay });
+  const days = new Set<string>();
+  for (const item of list || []) {
+    const day = item.day ? dayjs(item.day).format('YYYY-MM-DD') : '';
+    if (day && item.type === HolidayType.HOLIDAY) {
+      days.add(day);
+    }
+  }
+  holidaySet.value = days;
+  lastFetchedMonth.value = current.format('YYYY-MM');
+}
+
+/** 点击日期：打开假期设置弹窗 */
+function handleDayClick(data: { date: Date; day: string; type: string }) {
+  // 非当前月日期，不处理（避免切换月份）
+  if (data.type !== 'current-month') {
+    return;
+  }
+  if (!hasAccessByCodes(['mes:cal-holiday:create'])) {
+    ElMessage.warning('没有假期设置权限');
+    return;
+  }
+  holidayFormModalApi.setData({ day: data.day }).open();
+}
+
+/** 判断是否周末 */
+function isWeekend(day: string) {
+  const weekday = dayjs(day).day();
+  return weekday === 0 || weekday === 6;
+}
+
+/** 获取农历信息 */
+function getLunarInfo(day: string) {
+  const [year, month, date] = day.split('-').map(Number);
+  try {
+    const solarDay = SolarDay.fromYmd(year!, month!, date!);
+    const lunarDay = solarDay.getLunarDay();
+    const solarFestival = solarDay.getFestival();
+    const lunarFestival = lunarDay.getFestival();
+    const termDay = solarDay.getTermDay();
+    const termName =
+      termDay.getDayIndex() === 0 ? termDay.getSolarTerm().getName() : '';
+    return {
+      lunarFestival: lunarFestival ? lunarFestival.getName() : '',
+      lunarText: lunarDay.getLunarMonth().getName() + lunarDay.getName(),
+      solarFestival: solarFestival ? solarFestival.getName() : '',
+      termName,
+    };
+  } catch {
+    return { lunarFestival: '', lunarText: '', solarFestival: '', termName: '' };
+  }
+}
+
+/** 获取农历显示文本 */
+function getLunarDisplay(day: string) {
+  const info = getLunarInfo(day);
+  return (
+    info.solarFestival || info.lunarFestival || info.termName || info.lunarText
+  );
+}
+
+/** 判断是否有节日 */
+function hasFestival(day: string) {
+  const info = getLunarInfo(day);
+  return !!(info.solarFestival || info.lunarFestival || info.termName);
+}
+
+/** 监听月份切换，重新加载可见范围内的数据 */
+watch(currentDate, (newDate) => {
+  const newMonth = newDate.format('YYYY-MM');
+  if (newMonth !== lastFetchedMonth.value) {
+    getList();
+  }
+});
+
+onMounted(getList);
+</script>
+
+<template>
+  <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【排班】班组设置、节假日设置"
+        url="https://doc.iocoder.cn/mes/cal/team/"
+      />
+    </template>
+    <HolidayFormModal @success="getList" />
+    <div class="bg-card overflow-hidden rounded-md">
+      <ElCalendar v-model="calendarValue" class="mes-holiday-calendar">
+        <template #date-cell="{ data }">
+          <div
+            class="hover:bg-muted/50 h-full cursor-pointer p-1 text-left transition"
+            @click.stop="handleDayClick(data)"
+          >
+            <div class="flex items-center justify-between">
+              <span
+                class="text-base font-medium"
+                :class="{
+                  'text-red-500':
+                    isWeekend(data.day) && data.type === 'current-month',
+                }"
+              >
+                {{ data.day.split('-')[2] }}
+              </span>
+              <ElTag
+                v-if="holidaySet.has(data.day)"
+                effect="dark"
+                size="small"
+                type="success"
+              >
+                休
+              </ElTag>
+              <ElTag v-else effect="dark" size="small">班</ElTag>
+            </div>
+            <div
+              class="mt-1 text-xs"
+              :class="
+                hasFestival(data.day)
+                  ? 'text-green-600'
+                  : 'text-muted-foreground'
+              "
+            >
+              {{ getLunarDisplay(data.day) }}
+            </div>
+          </div>
+        </template>
+      </ElCalendar>
+    </div>
+  </Page>
+</template>
+
+<style lang="scss" scoped>
+/* 收紧 ElCalendar 默认日期单元高度 */
+.mes-holiday-calendar {
+  :deep(.el-calendar-table .el-calendar-day) {
+    height: 90px;
+    padding: 4px;
+  }
+}
+</style>
diff --git a/apps/web-ele/src/views/mes/cal/holiday/modules/form.vue b/apps/web-ele/src/views/mes/cal/holiday/modules/form.vue
new file mode 100644
index 000000000..b7d155991
--- /dev/null
+++ b/apps/web-ele/src/views/mes/cal/holiday/modules/form.vue
@@ -0,0 +1,85 @@
+<script lang="ts" setup>
+import type { MesCalHolidayApi } from '#/api/mes/cal/holiday';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import dayjs from 'dayjs';
+import { ElMessage } from 'element-plus';
+
+import { useVbenForm } from '#/adapter/form';
+import { getHolidayByDay, saveHoliday } from '#/api/mes/cal/holiday';
+import { HolidayType } from '#/views/mes/utils/constants';
+
+import { useHolidayFormSchema } from '../data';
+
+const emit = defineEmits(['success']);
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-2',
+    labelWidth: 80,
+  },
+  layout: 'horizontal',
+  schema: useHolidayFormSchema(),
+  showDefaultActions: false,
+});
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    const data = (await formApi.getValues()) as MesCalHolidayApi.Holiday & { dayDisplay?: string };
+    try {
+      await saveHoliday({ day: data.day, type: data.type, remark: data.remark });
+      // 关闭并提示
+      await modalApi.close();
+      emit('success');
+      ElMessage.success('设置成功');
+    } finally {
+      modalApi.unlock();
+    }
+  },
+  async onOpenChange(isOpen: boolean) {
+    if (!isOpen) {
+      return;
+    }
+    await formApi.resetForm();
+    const data = modalApi.getData<{ day: string }>();
+    if (!data?.day) {
+      return;
+    }
+    const timestamp = dayjs(data.day + ' 00:00:00').valueOf();
+    await formApi.setValues({
+      day: timestamp,
+      dayDisplay: data.day,
+      type: HolidayType.WORKDAY,
+      remark: '',
+    });
+    modalApi.lock();
+    try {
+      const holiday = await getHolidayByDay(dayjs(timestamp).format('YYYY-MM-DD HH:mm:ss'));
+      if (holiday) {
+        await formApi.setValues({
+          type: holiday.type ?? HolidayType.WORKDAY,
+          remark: holiday.remark ?? '',
+        });
+      }
+    } finally {
+      modalApi.unlock();
+    }
+  },
+});
+</script>
+
+<template>
+  <Modal title="假期设置" class="w-1/3">
+    <Form class="mx-4" />
+  </Modal>
+</template>
diff --git a/apps/web-ele/src/views/mes/cal/plan/data.ts b/apps/web-ele/src/views/mes/cal/plan/data.ts
new file mode 100644
index 000000000..5c3867160
--- /dev/null
+++ b/apps/web-ele/src/views/mes/cal/plan/data.ts
@@ -0,0 +1,283 @@
+import type { VbenFormApi, VbenFormSchema } from '#/adapter/form';
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesCalPlanApi } from '#/api/mes/cal/plan';
+
+import { h } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
+import { ElButton } from 'element-plus';
+
+import { generateAutoCode } from '#/api/mes/md/autocode/record';
+import { getRangePickerDefaultProps } from '#/utils';
+import {
+  MesAutoCodeRuleCode,
+  MesCalPlanStatusEnum,
+  MesCalShiftMethodEnum,
+  MesCalShiftTypeEnum,
+} from '#/views/mes/utils/constants';
+
+/** 新增/修改排班计划的表单 */
+export function useFormSchema(formApi?: VbenFormApi): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'status',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+      defaultValue: MesCalPlanStatusEnum.PREPARE,
+    },
+    {
+      fieldName: 'code',
+      label: '计划编码',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入计划编码',
+      },
+      rules: 'required',
+      suffix: () =>
+        h(
+          ElButton,
+          {
+            type: 'default',
+            onClick: async () => {
+              try {
+                const code = await generateAutoCode(MesAutoCodeRuleCode.CAL_PLAN_CODE);
+                await formApi?.setFieldValue('code', code);
+              } catch (error) {
+                console.error(error);
+              }
+            },
+          },
+          { default: () => '生成' },
+        ),
+    },
+    {
+      fieldName: 'name',
+      label: '计划名称',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入计划名称',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'calendarType',
+      label: '班组类型',
+      component: 'Select',
+      componentProps: {
+        clearable: true,
+        options: getDictOptions(DICT_TYPE.MES_CAL_CALENDAR_TYPE, 'number'),
+        placeholder: '请选择班组类型',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'startDate',
+      label: '开始日期',
+      component: 'DatePicker',
+      componentProps: {
+        class: '!w-full',
+        format: 'YYYY-MM-DD',
+        placeholder: '请选择开始日期',
+        valueFormat: 'x',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'endDate',
+      label: '结束日期',
+      component: 'DatePicker',
+      componentProps: {
+        class: '!w-full',
+        format: 'YYYY-MM-DD',
+        placeholder: '请选择结束日期',
+        valueFormat: 'x',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'shiftType',
+      label: '轮班方式',
+      component: 'Select',
+      componentProps: {
+        clearable: true,
+        options: getDictOptions(DICT_TYPE.MES_CAL_SHIFT_TYPE, 'number'),
+        placeholder: '请选择轮班方式',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'shiftMethod',
+      label: '倒班方式',
+      component: 'Select',
+      componentProps: {
+        clearable: true,
+        options: getDictOptions(DICT_TYPE.MES_CAL_SHIFT_METHOD, 'number'),
+        placeholder: '请选择倒班方式',
+      },
+      dependencies: {
+        triggerFields: ['shiftType'],
+        show: (values) => !!values.shiftType && values.shiftType !== MesCalShiftTypeEnum.SINGLE,
+      },
+    },
+    {
+      fieldName: 'shiftCount',
+      label: '倒班天数',
+      component: 'InputNumber',
+      componentProps: {
+        class: '!w-full',
+        controlsPosition: 'right',
+        min: 1,
+        precision: 0,
+      },
+      dependencies: {
+        triggerFields: ['shiftMethod'],
+        show: (values) => values.shiftMethod === MesCalShiftMethodEnum.DAY,
+      },
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      formItemClass: 'col-span-3',
+      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: 'startDate',
+      label: '开始日期',
+      component: 'RangePicker',
+      componentProps: {
+        ...getRangePickerDefaultProps(),
+      },
+    },
+    {
+      fieldName: 'endDate',
+      label: '结束日期',
+      component: 'RangePicker',
+      componentProps: {
+        ...getRangePickerDefaultProps(),
+      },
+    },
+    {
+      fieldName: 'shiftType',
+      label: '轮班方式',
+      component: 'Select',
+      componentProps: {
+        clearable: true,
+        options: getDictOptions(DICT_TYPE.MES_CAL_SHIFT_TYPE, 'number'),
+        placeholder: '请选择轮班方式',
+      },
+    },
+    {
+      fieldName: 'status',
+      label: '状态',
+      component: 'Select',
+      componentProps: {
+        clearable: true,
+        options: getDictOptions(DICT_TYPE.MES_CAL_PLAN_STATUS, 'number'),
+        placeholder: '请选择状态',
+      },
+    },
+  ];
+}
+
+/** 列表的字段 */
+export function useGridColumns(): VxeTableGridOptions<MesCalPlanApi.Plan>['columns'] {
+  return [
+    {
+      field: 'code',
+      title: '计划编码',
+      minWidth: 140,
+      slots: {
+        default: 'code',
+      },
+    },
+    { field: 'name', title: '计划名称', minWidth: 150 },
+    {
+      field: 'calendarType',
+      title: '班组类型',
+      width: 120,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_CAL_CALENDAR_TYPE },
+      },
+    },
+    { field: 'startDate', title: '开始日期', width: 150, formatter: 'formatDate' },
+    { field: 'endDate', title: '结束日期', width: 150, formatter: 'formatDate' },
+    {
+      field: 'shiftType',
+      title: '轮班方式',
+      width: 120,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_CAL_SHIFT_TYPE },
+      },
+    },
+    {
+      field: 'shiftMethod',
+      title: '倒班方式',
+      width: 120,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_CAL_SHIFT_METHOD },
+      },
+    },
+    {
+      field: 'status',
+      title: '单据状态',
+      width: 120,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_CAL_PLAN_STATUS },
+      },
+    },
+    { field: 'createTime', title: '创建时间', width: 180, formatter: 'formatDateTime' },
+    {
+      title: '操作',
+      width: 160,
+      fixed: 'right',
+      slots: {
+        default: 'actions',
+      },
+    },
+  ];
+}
diff --git a/apps/web-ele/src/views/mes/cal/plan/index.vue b/apps/web-ele/src/views/mes/cal/plan/index.vue
new file mode 100644
index 000000000..3400ddd5a
--- /dev/null
+++ b/apps/web-ele/src/views/mes/cal/plan/index.vue
@@ -0,0 +1,148 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesCalPlanApi } from '#/api/mes/cal/plan';
+
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
+import { downloadFileFromBlobPart } from '@vben/utils';
+
+import { ElButton, ElLoading, ElMessage } from 'element-plus';
+
+import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import { deletePlan, exportPlan, getPlanPage } from '#/api/mes/cal/plan';
+import { $t } from '#/locales';
+import { MesCalPlanStatusEnum } from '#/views/mes/utils/constants';
+
+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({ type: 'create' }).open();
+}
+
+/** 查看排班计划 */
+function handleDetail(row: MesCalPlanApi.Plan) {
+  formModalApi.setData({ id: row.id, type: 'detail' }).open();
+}
+
+/** 编辑排班计划 */
+function handleEdit(row: MesCalPlanApi.Plan) {
+  formModalApi.setData({ id: row.id, type: 'update' }).open();
+}
+
+/** 删除排班计划 */
+async function handleDelete(row: MesCalPlanApi.Plan) {
+  const hideLoading = ElLoading.service({ text: $t('ui.actionMessage.deleting', [row.name]) });
+  try {
+    await deletePlan(row.id!);
+    ElMessage.success($t('ui.actionMessage.deleteSuccess', [row.name]));
+    handleRefresh();
+  } finally {
+    hideLoading.close();
+  }
+}
+
+/** 导出排班计划 */
+async function handleExport() {
+  const data = await exportPlan(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) =>
+          await getPlanPage({ pageNo: page.currentPage, pageSize: page.pageSize, ...formValues }),
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+  } as VxeTableGridOptions<MesCalPlanApi.Plan>,
+});
+</script>
+
+<template>
+  <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【排班】排班计划、排班日历"
+        url="https://doc.iocoder.cn/mes/cal/calendar/"
+      />
+    </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:cal-plan:create'],
+              onClick: handleCreate,
+            },
+            {
+              label: $t('ui.actionTitle.export'),
+              type: 'primary',
+              icon: ACTION_ICON.DOWNLOAD,
+              auth: ['mes:cal-plan:export'],
+              onClick: handleExport,
+            },
+          ]"
+        />
+      </template>
+      <template #code="{ row }">
+        <ElButton link type="primary" @click="handleDetail(row)">{{ row.code }}</ElButton>
+      </template>
+      <template #actions="{ row }">
+        <TableAction
+          v-if="row.status === MesCalPlanStatusEnum.PREPARE"
+          :actions="[
+            {
+              label: $t('common.edit'),
+              type: 'primary',
+              link: true,
+              icon: ACTION_ICON.EDIT,
+              auth: ['mes:cal-plan:update'],
+              onClick: handleEdit.bind(null, row),
+            },
+            {
+              label: $t('common.delete'),
+              type: 'danger',
+              link: true,
+              icon: ACTION_ICON.DELETE,
+              auth: ['mes:cal-plan: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/cal/plan/modules/form.vue b/apps/web-ele/src/views/mes/cal/plan/modules/form.vue
new file mode 100644
index 000000000..bc88a84a8
--- /dev/null
+++ b/apps/web-ele/src/views/mes/cal/plan/modules/form.vue
@@ -0,0 +1,157 @@
+<script lang="ts" setup>
+import type { MesCalPlanApi } from '#/api/mes/cal/plan';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { ElButton, ElMessage, ElPopconfirm, ElTabPane, ElTabs } from 'element-plus';
+
+import { useVbenForm } from '#/adapter/form';
+import { confirmPlan, createPlan, getPlan, updatePlan } from '#/api/mes/cal/plan';
+import { $t } from '#/locales';
+import { MesCalPlanStatusEnum } from '#/views/mes/utils/constants';
+
+import { useFormSchema } from '../data';
+import ShiftList from './shift-list.vue';
+import PlanTeamList from './team-list.vue';
+
+
+type FormMode = 'create' | 'detail' | 'update';
+
+const emit = defineEmits(['success']);
+const formMode = ref<FormMode>('create'); // 表单模式
+const subTabsName = ref('shift'); // 当前资源页签
+const formData = ref<MesCalPlanApi.Plan>();
+const isDetail = computed(() => formMode.value === 'detail'); // 是否查看模式
+const canConfirm = computed(
+  () => formMode.value === 'update' && formData.value?.status === MesCalPlanStatusEnum.PREPARE,
+); // 是否可确认计划
+const getTitle = computed(() => {
+  if (formMode.value === 'detail') {
+    return $t('ui.actionTitle.view', ['排班计划']);
+  }
+  return formMode.value === 'update'
+    ? $t('ui.actionTitle.edit', ['排班计划'])
+    : $t('ui.actionTitle.create', ['排班计划']);
+});
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-1',
+    labelWidth: 100,
+  },
+  wrapperClass: 'grid-cols-3',
+  layout: 'horizontal',
+  schema: [],
+  showDefaultActions: false,
+});
+
+/** 表单 schema 需要 formApi 引用，所以通过 setState 设置 schema */
+formApi.setState({ schema: useFormSchema(formApi) });
+
+/** 确认排班计划 */
+async function handleConfirmPlan() {
+  const { valid } = await formApi.validate();
+  if (!valid || !formData.value?.id) {
+    return;
+  }
+
+  modalApi.lock();
+  try {
+    const data = (await formApi.getValues()) as MesCalPlanApi.Plan;
+    await updatePlan(data);
+    await confirmPlan(formData.value.id);
+    await modalApi.close();
+    emit('success');
+    ElMessage.success('确认成功');
+  } finally {
+    modalApi.unlock();
+  }
+}
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    if (isDetail.value) {
+      await modalApi.close();
+      return;
+    }
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    const data = (await formApi.getValues()) as MesCalPlanApi.Plan;
+    try {
+      if (formMode.value === 'create') {
+        const id = await createPlan(data);
+        formData.value = { ...data, id: id as number, status: MesCalPlanStatusEnum.PREPARE };
+        await formApi.setFieldValue('id', id);
+        formMode.value = 'update';
+      } else {
+        await updatePlan(data);
+        formData.value = { ...formData.value, ...data };
+      }
+      emit('success');
+      ElMessage.success($t('ui.actionMessage.operationSuccess'));
+    } finally {
+      modalApi.unlock();
+    }
+  },
+  async onOpenChange(isOpen: boolean) {
+    if (!isOpen) {
+      formData.value = undefined;
+      return;
+    }
+    await formApi.resetForm();
+    subTabsName.value = 'shift';
+    // 加载数据
+    const data = modalApi.getData<{ id?: number; type?: FormMode }>();
+    formMode.value = data?.type || 'create';
+    formApi.setDisabled(formMode.value === 'detail');
+    modalApi.setState({ showConfirmButton: formMode.value !== 'detail' });
+    if (!data?.id) {
+      return;
+    }
+    modalApi.lock();
+    try {
+      formData.value = await getPlan(data.id);
+      // 设置到 values
+      await formApi.setValues(formData.value);
+    } finally {
+      modalApi.unlock();
+    }
+  },
+});
+</script>
+
+<template>
+  <Modal :title="getTitle" class="w-4/5">
+    <Form class="mx-4" />
+    <ElTabs v-if="formMode !== 'create' && formData?.id" v-model="subTabsName" class="mx-4 mt-4">
+      <ElTabPane label="班次" name="shift">
+        <ShiftList :form-type="formMode" :plan-id="formData.id" />
+      </ElTabPane>
+      <ElTabPane label="班组" name="team">
+        <PlanTeamList :form-type="formMode" :plan-id="formData.id" />
+      </ElTabPane>
+    </ElTabs>
+    <template #prepend-footer>
+      <div class="flex flex-auto items-center">
+        <ElPopconfirm
+          v-if="canConfirm"
+          title="确认该排班计划？确认后将不可修改或删除。"
+          @confirm="handleConfirmPlan"
+        >
+          <template #reference>
+            <ElButton type="primary">确认计划</ElButton>
+          </template>
+        </ElPopconfirm>
+      </div>
+    </template>
+  </Modal>
+</template>
diff --git a/apps/web-ele/src/views/mes/cal/plan/modules/shift-list.vue b/apps/web-ele/src/views/mes/cal/plan/modules/shift-list.vue
new file mode 100644
index 000000000..3fbf0fdf0
--- /dev/null
+++ b/apps/web-ele/src/views/mes/cal/plan/modules/shift-list.vue
@@ -0,0 +1,240 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesCalPlanShiftApi } from '#/api/mes/cal/plan/shift';
+
+import { computed, ref, watch } from 'vue';
+
+import { ElButton, ElDialog, ElMessage } from 'element-plus';
+
+import { useVbenForm, z } from '#/adapter/form';
+import { TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import {
+  createPlanShift,
+  deletePlanShift,
+  getPlanShiftListByPlan,
+  updatePlanShift,
+} from '#/api/mes/cal/plan/shift';
+import { $t } from '#/locales';
+
+const props = withDefaults(defineProps<{ formType?: string; planId: number }>(), {
+  formType: 'update',
+});
+const isEditable = computed(() => props.formType !== 'detail'); // 是否可编辑
+const formOpen = ref(false); // 班次表单是否打开
+const formLoading = ref(false); // 班次表单提交中
+const shiftFormType = ref<'create' | 'update'>('create'); // 班次表单模式
+const formTitle = computed(() => (shiftFormType.value === 'create' ? '添加班次' : '修改班次'));
+const list = ref<MesCalPlanShiftApi.PlanShift[]>([]); // 班次列表
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-2',
+    labelWidth: 80,
+  },
+  layout: 'horizontal',
+  schema: [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'planId',
+      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: 'name',
+      label: '班次名称',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入班次名称',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'startTime',
+      label: '开始时间',
+      component: 'TimePicker',
+      componentProps: {
+        format: 'HH:mm',
+        placeholder: '请选择开始时间',
+        valueFormat: 'HH:mm',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'endTime',
+      label: '结束时间',
+      component: 'TimePicker',
+      componentProps: {
+        format: 'HH:mm',
+        placeholder: '请选择结束时间',
+        valueFormat: 'HH:mm',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入备注',
+        rows: 3,
+      },
+    },
+  ],
+  showDefaultActions: false,
+});
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    autoResize: true,
+    border: true,
+    columns: [
+      { field: 'sort', title: '顺序', width: 80 },
+      { field: 'name', title: '班次名称', minWidth: 120 },
+      { field: 'startTime', title: '开始时间', width: 100 },
+      { field: 'endTime', title: '结束时间', width: 100 },
+      { field: 'remark', title: '备注', minWidth: 150 },
+      {
+        title: '操作',
+        width: 130,
+        fixed: 'right',
+        slots: {
+          default: 'actions',
+        },
+        visible: isEditable.value,
+      },
+    ],
+    data: list.value,
+    minHeight: 240,
+    pagerConfig: {
+      enabled: false,
+    },
+    rowConfig: {
+      isHover: true,
+      keyField: 'id',
+    },
+    showOverflow: true,
+    toolbarConfig: {
+      enabled: false,
+    },
+  } as VxeTableGridOptions<MesCalPlanShiftApi.PlanShift>,
+});
+
+/** 加载班次列表 */
+async function getList() {
+  gridApi.setLoading(true);
+  try {
+    list.value = await getPlanShiftListByPlan(props.planId);
+    gridApi.setGridOptions({ data: list.value });
+  } finally {
+    gridApi.setLoading(false);
+  }
+}
+
+/** 打开班次表单 */
+async function openForm(type: 'create' | 'update', row?: MesCalPlanShiftApi.PlanShift) {
+  formOpen.value = true;
+  shiftFormType.value = type;
+  await formApi.resetForm();
+  await formApi.setValues(row ? { ...row } : { planId: props.planId, sort: 1 });
+}
+
+/** 提交班次表单 */
+async function submitForm() {
+  const { valid } = await formApi.validate();
+  if (!valid) {
+    return;
+  }
+  formLoading.value = true;
+  try {
+    const data = (await formApi.getValues()) as MesCalPlanShiftApi.PlanShift;
+    await (shiftFormType.value === 'create' ? createPlanShift(data) : updatePlanShift(data));
+    formOpen.value = false;
+    ElMessage.success($t('ui.actionMessage.operationSuccess'));
+    await getList();
+  } finally {
+    formLoading.value = false;
+  }
+}
+
+/** 删除班次 */
+async function handleDelete(id: number) {
+  await deletePlanShift(id);
+  ElMessage.success($t('ui.actionMessage.deleteSuccess', ['班次']));
+  await getList();
+}
+
+watch(
+  () => props.planId,
+  (value) => {
+    if (value) {
+      getList();
+    }
+  },
+  { immediate: true },
+);
+</script>
+
+<template>
+  <div>
+    <div v-if="isEditable" class="mb-3 flex items-center justify-start">
+      <TableAction
+        :actions="[{ label: '添加班次', type: 'primary', onClick: openForm.bind(null, 'create') }]"
+      />
+    </div>
+    <Grid class="w-full">
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: '编辑',
+              type: 'primary',
+              link: true,
+              onClick: openForm.bind(null, 'update', row),
+            },
+            {
+              label: '删除',
+              type: 'danger',
+              link: true,
+              popConfirm: {
+                title: '确认删除该班次吗？',
+                confirm: handleDelete.bind(null, row.id!),
+              },
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+    <ElDialog v-model="formOpen" :title="formTitle" width="520px">
+      <Form class="mx-4" />
+      <template #footer>
+        <ElButton @click="formOpen = false">取消</ElButton>
+        <ElButton type="primary" :loading="formLoading" @click="submitForm">确定</ElButton>
+      </template>
+    </ElDialog>
+  </div>
+</template>
diff --git a/apps/web-ele/src/views/mes/cal/plan/modules/team-list.vue b/apps/web-ele/src/views/mes/cal/plan/modules/team-list.vue
new file mode 100644
index 000000000..cb4e21106
--- /dev/null
+++ b/apps/web-ele/src/views/mes/cal/plan/modules/team-list.vue
@@ -0,0 +1,207 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesCalPlanTeamApi } from '#/api/mes/cal/plan/team';
+import type { MesCalTeamApi } from '#/api/mes/cal/team';
+import type { MesCalTeamMemberApi } from '#/api/mes/cal/team/member';
+
+import { computed, ref, watch } from 'vue';
+
+import { ElCard, ElEmpty, ElMessage } from 'element-plus';
+
+import { TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import { createPlanTeam, deletePlanTeam, getPlanTeamListByPlan } from '#/api/mes/cal/plan/team';
+import { getTeamMemberListByTeam } from '#/api/mes/cal/team/member';
+import { $t } from '#/locales';
+import { CalTeamSelectDialog } from '#/views/mes/cal/team/components';
+
+const props = withDefaults(defineProps<{ formType?: string; planId: number }>(), {
+  formType: 'update',
+});
+const isEditable = computed(() => props.formType !== 'detail'); // 是否可编辑
+const list = ref<MesCalPlanTeamApi.PlanTeam[]>([]); // 计划班组列表
+const memberList = ref<MesCalTeamMemberApi.TeamMember[]>([]); // 班组成员列表
+const selectedTeamId = ref<number>(); // 选中班组编号
+const selectedTeamName = ref(''); // 选中班组名称
+const teamDialogRef = ref<InstanceType<typeof CalTeamSelectDialog>>(); // 班组选择弹窗
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    autoResize: true,
+    border: true,
+    columns: [
+      { field: 'teamId', title: '班组编号', width: 100 },
+      { field: 'teamCode', title: '班组编码', minWidth: 120 },
+      { field: 'teamName', title: '班组名称', minWidth: 120 },
+      { field: 'remark', title: '备注', minWidth: 150 },
+      {
+        title: '操作',
+        width: 90,
+        fixed: 'right',
+        slots: {
+          default: 'actions',
+        },
+        visible: isEditable.value,
+      },
+    ],
+    data: list.value,
+    minHeight: 260,
+    pagerConfig: {
+      enabled: false,
+    },
+    rowConfig: {
+      isCurrent: true,
+      isHover: true,
+      keyField: 'id',
+    },
+    showOverflow: true,
+    toolbarConfig: {
+      enabled: false,
+    },
+  } as VxeTableGridOptions<MesCalPlanTeamApi.PlanTeam>,
+  gridEvents: {
+    cellClick: ({ row }: { row: MesCalPlanTeamApi.PlanTeam }) => handleTeamSelect(row),
+  },
+});
+
+const [MemberGrid, memberGridApi] = useVbenVxeGrid({
+  gridOptions: {
+    autoResize: true,
+    border: true,
+    columns: [
+      { field: 'nickname', title: '用户昵称', minWidth: 100 },
+      { field: 'telephone', title: '手机号', minWidth: 120 },
+      { field: 'remark', title: '备注', minWidth: 120 },
+    ],
+    data: memberList.value,
+    minHeight: 260,
+    pagerConfig: {
+      enabled: false,
+    },
+    rowConfig: {
+      isHover: true,
+      keyField: 'id',
+    },
+    showOverflow: true,
+    toolbarConfig: {
+      enabled: false,
+    },
+  } as VxeTableGridOptions<MesCalTeamMemberApi.TeamMember>,
+});
+
+/** 加载计划班组列表 */
+async function getList() {
+  gridApi.setLoading(true);
+  try {
+    list.value = await getPlanTeamListByPlan(props.planId);
+    gridApi.setGridOptions({ data: list.value });
+  } finally {
+    gridApi.setLoading(false);
+  }
+}
+
+/** 选择班组后加载成员 */
+async function handleTeamSelect(row?: MesCalPlanTeamApi.PlanTeam) {
+  if (!row?.teamId) {
+    selectedTeamId.value = undefined;
+    selectedTeamName.value = '';
+    memberList.value = [];
+    memberGridApi.setGridOptions({ data: memberList.value });
+    return;
+  }
+  selectedTeamId.value = row.teamId;
+  selectedTeamName.value = row.teamName || '';
+  memberGridApi.setLoading(true);
+  try {
+    memberList.value = await getTeamMemberListByTeam(row.teamId);
+    memberGridApi.setGridOptions({ data: memberList.value });
+  } finally {
+    memberGridApi.setLoading(false);
+  }
+}
+
+/** 打开班组选择弹窗 */
+function openTeamSelect() {
+  teamDialogRef.value?.open(list.value.map((item) => item.teamId!).filter(Boolean));
+}
+
+/** 处理班组选择 */
+async function handleTeamsSelected(rows: MesCalTeamApi.Team[]) {
+  const existingTeamIds = new Set(list.value.map((item) => item.teamId));
+  const newTeams = rows.filter((team) => team.id && !existingTeamIds.has(team.id));
+  if (newTeams.length === 0) {
+    ElMessage.warning('所选班组已全部添加过');
+    return;
+  }
+  gridApi.setLoading(true);
+  try {
+    for (const team of newTeams) {
+      await createPlanTeam({ planId: props.planId, teamId: team.id });
+    }
+    ElMessage.success('成功添加 ' + newTeams.length + ' 个班组');
+    await getList();
+  } finally {
+    gridApi.setLoading(false);
+  }
+}
+
+/** 删除计划班组 */
+async function handleDelete(row: MesCalPlanTeamApi.PlanTeam) {
+  await deletePlanTeam(row.id!);
+  ElMessage.success($t('ui.actionMessage.deleteSuccess', [row.teamName]));
+  if (row.teamId === selectedTeamId.value) {
+    await handleTeamSelect(undefined);
+  }
+  await getList();
+}
+
+watch(
+  () => props.planId,
+  (value) => {
+    if (value) {
+      getList();
+    }
+  },
+  { immediate: true },
+);
+</script>
+
+<template>
+  <div>
+    <div v-if="isEditable" class="mb-3 flex items-center justify-start">
+      <TableAction :actions="[{ label: '添加班组', type: 'primary', onClick: openTeamSelect }]" />
+    </div>
+    <div class="grid grid-cols-5 gap-4">
+      <div class="col-span-3">
+        <Grid class="w-full">
+          <template #actions="{ row }">
+            <TableAction
+              :actions="[
+                {
+                  label: '删除',
+                  type: 'danger',
+                  link: true,
+                  popConfirm: {
+                    title: '确认删除该班组吗？',
+                    confirm: handleDelete.bind(null, row),
+                  },
+                },
+              ]"
+            />
+          </template>
+        </Grid>
+      </div>
+      <div class="col-span-2">
+        <ElCard class="h-full" shadow="never">
+          <template #header>
+            {{ selectedTeamName ? `「${selectedTeamName}」班组成员` : '班组成员' }}
+          </template>
+          <div v-if="!selectedTeamId">
+            <ElEmpty description="请点击左侧班组查看成员" :image-size="60" />
+          </div>
+          <MemberGrid v-else class="w-full" />
+        </ElCard>
+      </div>
+    </div>
+    <CalTeamSelectDialog ref="teamDialogRef" :multiple="true" @selected="handleTeamsSelected" />
+  </div>
+</template>
diff --git a/apps/web-ele/src/views/mes/cal/team/components/cal-team-select-dialog.vue b/apps/web-ele/src/views/mes/cal/team/components/cal-team-select-dialog.vue
new file mode 100644
index 000000000..d3c03f7e6
--- /dev/null
+++ b/apps/web-ele/src/views/mes/cal/team/components/cal-team-select-dialog.vue
@@ -0,0 +1,138 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesCalTeamApi } from '#/api/mes/cal/team';
+
+import { nextTick, ref } from 'vue';
+
+import { ElButton, ElDialog, ElMessage } from 'element-plus';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { getTeamPage } from '#/api/mes/cal/team';
+
+import { useTeamSelectGridColumns, useTeamSelectGridFormSchema } from '../data';
+
+const emit = defineEmits<{ selected: [rows: MesCalTeamApi.Team[]] }>();
+const open = ref(false); // 弹窗是否打开
+const multiple = ref(true); // 是否多选
+const selectedRows = ref<MesCalTeamApi.Team[]>([]); // 已选班组列表
+const preSelectedIds = ref<number[]>([]); // 预选班组编号列表
+
+/** 处理勾选变化 */
+function handleCheckboxChange({ records }: { records: MesCalTeamApi.Team[] }) {
+  selectedRows.value = records;
+}
+
+/** 处理全选变化 */
+function handleCheckboxAll({ records }: { records: MesCalTeamApi.Team[] }) {
+  selectedRows.value = records;
+}
+
+/** 双击行：多选切换勾选，单选直接确认 */
+function handleCellDblclick({ row }: { row: MesCalTeamApi.Team }) {
+  if (multiple.value) {
+    const records = gridApi.grid.getCheckboxRecords() as MesCalTeamApi.Team[];
+    const checked = records.some((item) => item.id === row.id);
+    gridApi.grid.setCheckboxRow(row, !checked);
+    selectedRows.value = gridApi.grid.getCheckboxRecords() as MesCalTeamApi.Team[];
+    return;
+  }
+  selectedRows.value = [row];
+  handleConfirm();
+}
+
+/** 回显预选班组 */
+function applyPreSelection() {
+  if (preSelectedIds.value.length === 0) {
+    return;
+  }
+  const rows = gridApi.grid.getData() as MesCalTeamApi.Team[];
+  for (const row of rows) {
+    if (row.id && preSelectedIds.value.includes(row.id)) {
+      gridApi.grid.setCheckboxRow(row, true);
+    }
+  }
+  selectedRows.value = gridApi.grid.getCheckboxRecords() as MesCalTeamApi.Team[];
+}
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  formOptions: {
+    schema: useTeamSelectGridFormSchema(),
+  },
+  gridOptions: {
+    columns: useTeamSelectGridColumns(),
+    height: 520,
+    keepSource: true,
+    checkboxConfig: {
+      highlight: true,
+      range: true,
+      reserve: true,
+    },
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }, formValues) =>
+          await getTeamPage({ pageNo: page.currentPage, pageSize: page.pageSize, ...formValues }),
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+  } as VxeTableGridOptions<MesCalTeamApi.Team>,
+  gridEvents: {
+    checkboxAll: handleCheckboxAll,
+    checkboxChange: handleCheckboxChange,
+    cellDblclick: handleCellDblclick,
+  },
+});
+
+/** 重置查询和选择状态 */
+async function resetQueryState() {
+  selectedRows.value = [];
+  await gridApi.grid.clearCheckboxRow();
+  await gridApi.formApi.resetForm();
+}
+
+/** 打开班组选择弹窗 */
+async function openModal(selectedIds?: number[], options?: { multiple?: boolean }) {
+  open.value = true;
+  multiple.value = options?.multiple ?? true;
+  preSelectedIds.value = selectedIds || [];
+  await nextTick();
+  await resetQueryState();
+  await gridApi.query();
+  await nextTick();
+  applyPreSelection();
+}
+
+/** 关闭班组选择弹窗 */
+async function closeModal() {
+  open.value = false;
+  await resetQueryState();
+}
+
+/** 确认选择班组 */
+function handleConfirm() {
+  if (selectedRows.value.length === 0) {
+    ElMessage.warning(multiple.value ? '请至少选择一条数据' : '请选择一条数据');
+    return;
+  }
+  emit('selected', multiple.value ? selectedRows.value : [selectedRows.value[0]!]);
+  open.value = false;
+}
+
+defineExpose({ open: openModal });
+</script>
+
+<template>
+  <ElDialog v-model="open" title="班组选择" width="720px" destroy-on-close @close="closeModal">
+    <Grid table-title="班组列表" />
+    <template #footer>
+      <ElButton @click="closeModal">取消</ElButton>
+      <ElButton type="primary" @click="handleConfirm">确定</ElButton>
+    </template>
+  </ElDialog>
+</template>
diff --git a/apps/web-ele/src/views/mes/cal/team/components/cal-team-select.vue b/apps/web-ele/src/views/mes/cal/team/components/cal-team-select.vue
new file mode 100644
index 000000000..30a946224
--- /dev/null
+++ b/apps/web-ele/src/views/mes/cal/team/components/cal-team-select.vue
@@ -0,0 +1,81 @@
+<script lang="ts" setup>
+import type { MesCalTeamApi } from '#/api/mes/cal/team';
+
+import { onMounted, ref } from 'vue';
+
+import { ElButton, ElOption, ElSelect } from 'element-plus';
+
+import { getTeamList } from '#/api/mes/cal/team';
+
+import CalTeamSelectDialog from './cal-team-select-dialog.vue';
+
+const props = withDefaults(
+  defineProps<{
+    clearable?: boolean;
+    disabled?: boolean;
+    modelValue?: number;
+    placeholder?: string;
+  }>(),
+  {
+    clearable: true,
+    disabled: false,
+    modelValue: undefined,
+    placeholder: '请选择班组',
+  },
+);
+const emit = defineEmits<{
+  change: [row?: MesCalTeamApi.Team];
+  'update:modelValue': [value?: number];
+}>();
+const teamList = ref<MesCalTeamApi.Team[]>([]); // 班组选项
+const dialogRef = ref<InstanceType<typeof CalTeamSelectDialog>>(); // 班组选择弹窗
+
+/** 加载班组选项 */
+async function loadTeamList() {
+  teamList.value = await getTeamList();
+}
+
+/** 处理下拉选择变化 */
+function handleChange(value: number | string | undefined) {
+  const teamId = typeof value === 'number' ? value : undefined;
+  emit('update:modelValue', teamId);
+  emit(
+    'change',
+    teamList.value.find((item) => item.id === teamId),
+  );
+}
+
+/** 打开班组选择弹窗 */
+function openDialog() {
+  if (props.disabled) {
+    return;
+  }
+  dialogRef.value?.open(props.modelValue ? [props.modelValue] : [], { multiple: false });
+}
+
+/** 处理弹窗选择 */
+function handleSelected(rows: MesCalTeamApi.Team[]) {
+  const row = rows[0];
+  emit('update:modelValue', row?.id);
+  emit('change', row);
+}
+
+onMounted(loadTeamList);
+</script>
+
+<template>
+  <div class="flex w-full gap-2">
+    <ElSelect
+      :clearable="clearable"
+      :disabled="disabled"
+      :model-value="modelValue"
+      :placeholder="placeholder"
+      class="flex-1"
+      @change="handleChange"
+    >
+      <ElOption v-for="item in teamList" :key="item.id" :label="item.name" :value="item.id!" />
+    </ElSelect>
+    <ElButton :disabled="disabled" @click="openDialog">选择</ElButton>
+    <CalTeamSelectDialog ref="dialogRef" :multiple="false" @selected="handleSelected" />
+  </div>
+</template>
diff --git a/apps/web-ele/src/views/mes/cal/team/components/index.ts b/apps/web-ele/src/views/mes/cal/team/components/index.ts
new file mode 100644
index 000000000..092b24a19
--- /dev/null
+++ b/apps/web-ele/src/views/mes/cal/team/components/index.ts
@@ -0,0 +1,2 @@
+export { default as CalTeamSelectDialog } from './cal-team-select-dialog.vue';
+export { default as CalTeamSelect } from './cal-team-select.vue';
diff --git a/apps/web-ele/src/views/mes/cal/team/data.ts b/apps/web-ele/src/views/mes/cal/team/data.ts
new file mode 100644
index 000000000..cf1521481
--- /dev/null
+++ b/apps/web-ele/src/views/mes/cal/team/data.ts
@@ -0,0 +1,186 @@
+import type { VbenFormApi, VbenFormSchema } from '#/adapter/form';
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesCalTeamApi } from '#/api/mes/cal/team';
+
+import { h } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
+import { ElButton } from 'element-plus';
+
+import { z } from '#/adapter/form';
+import { generateAutoCode } from '#/api/mes/md/autocode/record';
+import { MesAutoCodeRuleCode } from '#/views/mes/utils/constants';
+
+/** 新增/修改班组的表单 */
+export function useFormSchema(formApi?: VbenFormApi): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'code',
+      label: '班组编码',
+      component: 'Input',
+      componentProps: {
+        maxLength: 64,
+        placeholder: '请输入班组编码',
+      },
+      rules: z.string().min(1, '班组编码不能为空').max(64),
+      suffix: () =>
+        h(
+          ElButton,
+          {
+            type: 'default',
+            onClick: async () => {
+              try {
+                const code = await generateAutoCode(MesAutoCodeRuleCode.CAL_TEAM_CODE);
+                await formApi?.setFieldValue('code', code);
+              } catch (error) {
+                console.error(error);
+              }
+            },
+          },
+          { default: () => '生成' },
+        ),
+    },
+    {
+      fieldName: 'name',
+      label: '班组名称',
+      component: 'Input',
+      componentProps: {
+        maxLength: 100,
+        placeholder: '请输入班组名称',
+      },
+      rules: z.string().min(1, '班组名称不能为空').max(100),
+    },
+    {
+      fieldName: 'calendarType',
+      label: '班组类型',
+      component: 'RadioGroup',
+      componentProps: {
+        options: getDictOptions(DICT_TYPE.MES_CAL_CALENDAR_TYPE, 'number'),
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      formItemClass: 'col-span-3',
+      componentProps: {
+        maxLength: 250,
+        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: 'calendarType',
+      label: '班组类型',
+      component: 'Select',
+      componentProps: {
+        clearable: true,
+        options: getDictOptions(DICT_TYPE.MES_CAL_CALENDAR_TYPE, 'number'),
+        placeholder: '请选择班组类型',
+      },
+    },
+  ];
+}
+
+/** 列表的字段 */
+export function useGridColumns(): VxeTableGridOptions<MesCalTeamApi.Team>['columns'] {
+  return [
+    {
+      field: 'code',
+      title: '班组编码',
+      minWidth: 150,
+      slots: {
+        default: 'code',
+      },
+    },
+    { field: 'name', title: '班组名称', minWidth: 150 },
+    {
+      field: 'calendarType',
+      title: '班组类型',
+      width: 140,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_CAL_CALENDAR_TYPE },
+      },
+    },
+    { field: 'remark', title: '备注', minWidth: 180 },
+    { field: 'createTime', title: '创建时间', width: 180, formatter: 'formatDateTime' },
+    {
+      title: '操作',
+      width: 180,
+      fixed: 'right',
+      slots: {
+        default: 'actions',
+      },
+    },
+  ];
+}
+
+/** 班组选择弹窗搜索表单 */
+export function useTeamSelectGridFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'code',
+      label: '班组编码',
+      component: 'Input',
+      componentProps: {
+        clearable: true,
+        placeholder: '请输入班组编码',
+      },
+    },
+    {
+      fieldName: 'name',
+      label: '班组名称',
+      component: 'Input',
+      componentProps: {
+        clearable: true,
+        placeholder: '请输入班组名称',
+      },
+    },
+  ];
+}
+
+/** 班组选择弹窗字段 */
+export function useTeamSelectGridColumns(): VxeTableGridOptions<MesCalTeamApi.Team>['columns'] {
+  return [
+    { type: 'checkbox', width: 50 },
+    { field: 'code', title: '班组编码', minWidth: 140 },
+    { field: 'name', title: '班组名称', minWidth: 140 },
+    { field: 'remark', title: '备注', minWidth: 160 },
+  ];
+}
diff --git a/apps/web-ele/src/views/mes/cal/team/index.vue b/apps/web-ele/src/views/mes/cal/team/index.vue
new file mode 100644
index 000000000..723b68782
--- /dev/null
+++ b/apps/web-ele/src/views/mes/cal/team/index.vue
@@ -0,0 +1,151 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesCalTeamApi } from '#/api/mes/cal/team';
+
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
+import { downloadFileFromBlobPart } from '@vben/utils';
+
+import { ElButton, ElLoading, ElMessage } from 'element-plus';
+
+import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import { deleteTeam, exportTeam, getTeamPage } from '#/api/mes/cal/team';
+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({ type: 'create' }).open();
+}
+
+/** 查看班组 */
+function handleDetail(row: MesCalTeamApi.Team) {
+  formModalApi.setData({ id: row.id, type: 'detail' }).open();
+}
+
+/** 编辑班组 */
+function handleEdit(row: MesCalTeamApi.Team) {
+  formModalApi.setData({ id: row.id, type: 'update' }).open();
+}
+
+/** 删除班组 */
+async function handleDelete(row: MesCalTeamApi.Team) {
+  const hideLoading = ElLoading.service({ text: $t('ui.actionMessage.deleting', [row.name]) });
+  try {
+    await deleteTeam(row.id!);
+    ElMessage.success($t('ui.actionMessage.deleteSuccess', [row.name]));
+    handleRefresh();
+  } finally {
+    hideLoading.close();
+  }
+}
+
+/** 导出班组 */
+async function handleExport() {
+  const data = await exportTeam(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 getTeamPage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            ...formValues,
+          });
+        },
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+  } as VxeTableGridOptions<MesCalTeamApi.Team>,
+});
+</script>
+
+<template>
+  <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【排班】班组设置、节假日设置"
+        url="https://doc.iocoder.cn/mes/cal/team/"
+      />
+    </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:cal-team:create'],
+              onClick: handleCreate,
+            },
+            {
+              label: $t('ui.actionTitle.export'),
+              type: 'primary',
+              icon: ACTION_ICON.DOWNLOAD,
+              auth: ['mes:cal-team:export'],
+              onClick: handleExport,
+            },
+          ]"
+        />
+      </template>
+      <template #code="{ row }">
+        <ElButton link type="primary" @click="handleDetail(row)">{{ row.code }}</ElButton>
+      </template>
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: $t('common.edit'),
+              type: 'primary',
+              link: true,
+              icon: ACTION_ICON.EDIT,
+              auth: ['mes:cal-team:update'],
+              onClick: handleEdit.bind(null, row),
+            },
+            {
+              label: $t('common.delete'),
+              type: 'danger',
+              link: true,
+              icon: ACTION_ICON.DELETE,
+              auth: ['mes:cal-team: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/cal/team/modules/form.vue b/apps/web-ele/src/views/mes/cal/team/modules/form.vue
new file mode 100644
index 000000000..8217bbae1
--- /dev/null
+++ b/apps/web-ele/src/views/mes/cal/team/modules/form.vue
@@ -0,0 +1,116 @@
+<script lang="ts" setup>
+import type { MesCalTeamApi } from '#/api/mes/cal/team';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { ElMessage, ElTabPane, ElTabs } from 'element-plus';
+
+import { useVbenForm } from '#/adapter/form';
+import { createTeam, getTeam, updateTeam } from '#/api/mes/cal/team';
+import { $t } from '#/locales';
+
+import { useFormSchema } from '../data';
+import MemberList from './member-list.vue';
+
+
+type FormMode = 'create' | 'detail' | 'update';
+
+const emit = defineEmits(['success']);
+const formMode = ref<FormMode>('create'); // 表单模式
+const subTabsName = ref('member'); // 当前资源页签
+const formData = ref<MesCalTeamApi.Team>();
+const isDetail = computed(() => formMode.value === 'detail'); // 是否查看模式
+const getTitle = computed(() => {
+  if (formMode.value === 'detail') {
+    return $t('ui.actionTitle.view', ['班组']);
+  }
+  return formMode.value === 'update'
+    ? $t('ui.actionTitle.edit', ['班组'])
+    : $t('ui.actionTitle.create', ['班组']);
+});
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-1',
+    labelWidth: 100,
+  },
+  wrapperClass: 'grid-cols-3',
+  layout: 'horizontal',
+  schema: [],
+  showDefaultActions: false,
+});
+
+/** 表单 schema 需要 formApi 引用，所以通过 setState 设置 schema */
+formApi.setState({ schema: useFormSchema(formApi) });
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    if (isDetail.value) {
+      await modalApi.close();
+      return;
+    }
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    const data = (await formApi.getValues()) as MesCalTeamApi.Team;
+    try {
+      if (formMode.value === 'create') {
+        const id = await createTeam(data);
+        formData.value = { ...data, id: id as number };
+        await formApi.setFieldValue('id', id);
+        formMode.value = 'update';
+      } else {
+        await updateTeam(data);
+        formData.value = { ...formData.value, ...data };
+      }
+      emit('success');
+      ElMessage.success($t('ui.actionMessage.operationSuccess'));
+    } finally {
+      modalApi.unlock();
+    }
+  },
+  async onOpenChange(isOpen: boolean) {
+    if (!isOpen) {
+      formData.value = undefined;
+      return;
+    }
+    await formApi.resetForm();
+    subTabsName.value = 'member';
+    // 加载数据
+    const data = modalApi.getData<{ id?: number; type?: FormMode }>();
+    formMode.value = data?.type || 'create';
+    formApi.setDisabled(formMode.value === 'detail');
+    modalApi.setState({ showConfirmButton: formMode.value !== 'detail' });
+    if (!data?.id) {
+      return;
+    }
+    modalApi.lock();
+    try {
+      formData.value = await getTeam(data.id);
+      // 设置到 values
+      await formApi.setValues(formData.value);
+    } finally {
+      modalApi.unlock();
+    }
+  },
+});
+</script>
+
+<template>
+  <Modal :title="getTitle" class="w-4/5">
+    <Form class="mx-4" />
+    <ElTabs v-if="formMode !== 'create' && formData?.id" v-model="subTabsName" class="mx-4 mt-4">
+      <ElTabPane label="班组成员" name="member">
+        <MemberList :form-type="formMode" :team-id="formData.id" />
+      </ElTabPane>
+    </ElTabs>
+  </Modal>
+</template>
diff --git a/apps/web-ele/src/views/mes/cal/team/modules/member-list.vue b/apps/web-ele/src/views/mes/cal/team/modules/member-list.vue
new file mode 100644
index 000000000..8dc4f4200
--- /dev/null
+++ b/apps/web-ele/src/views/mes/cal/team/modules/member-list.vue
@@ -0,0 +1,192 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesCalTeamMemberApi } from '#/api/mes/cal/team/member';
+
+import { computed, ref, watch } from 'vue';
+
+import { ElButton, ElDialog, ElMessage } from 'element-plus';
+
+import { useVbenForm } from '#/adapter/form';
+import { TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import {
+  createTeamMember,
+  deleteTeamMember,
+  getTeamMemberListByTeam,
+} from '#/api/mes/cal/team/member';
+import { getSimpleUserList } from '#/api/system/user';
+import { $t } from '#/locales';
+
+const props = withDefaults(defineProps<{ formType?: string; teamId: number }>(), {
+  formType: 'update',
+});
+const isEditable = computed(() => ['create', 'update'].includes(props.formType)); // 是否可编辑
+const formOpen = ref(false); // 成员表单是否打开
+const formLoading = ref(false); // 成员表单提交中
+const list = ref<MesCalTeamMemberApi.TeamMember[]>([]); // 成员列表
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-2',
+    labelWidth: 80,
+  },
+  layout: 'horizontal',
+  schema: [
+    {
+      fieldName: 'teamId',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'userId',
+      label: '用户',
+      component: 'ApiSelect',
+      componentProps: {
+        clearable: true,
+        api: getSimpleUserList,
+        labelField: 'nickname',
+        placeholder: '请选择用户',
+        showSearch: true,
+        valueField: 'id',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入备注',
+        rows: 3,
+      },
+    },
+  ],
+  showDefaultActions: false,
+});
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    autoResize: true,
+    border: true,
+    columns: [
+      { field: 'userId', title: '用户编号', width: 100 },
+      { field: 'nickname', title: '用户昵称', minWidth: 120 },
+      { field: 'telephone', title: '手机号', minWidth: 120 },
+      { field: 'remark', title: '备注', minWidth: 160 },
+      {
+        title: '操作',
+        width: 90,
+        fixed: 'right',
+        slots: {
+          default: 'actions',
+        },
+        visible: isEditable.value,
+      },
+    ],
+    data: list.value,
+    minHeight: 240,
+    pagerConfig: {
+      enabled: false,
+    },
+    rowConfig: {
+      isHover: true,
+      keyField: 'id',
+    },
+    showOverflow: true,
+    toolbarConfig: {
+      enabled: false,
+    },
+  } as VxeTableGridOptions<MesCalTeamMemberApi.TeamMember>,
+});
+
+/** 加载成员列表 */
+async function getList() {
+  gridApi.setLoading(true);
+  try {
+    list.value = await getTeamMemberListByTeam(props.teamId);
+    gridApi.setGridOptions({ data: list.value });
+  } finally {
+    gridApi.setLoading(false);
+  }
+}
+
+/** 打开成员表单 */
+async function openForm() {
+  formOpen.value = true;
+  await formApi.resetForm();
+  await formApi.setValues({ teamId: props.teamId });
+}
+
+/** 提交成员表单 */
+async function submitForm() {
+  const { valid } = await formApi.validate();
+  if (!valid) {
+    return;
+  }
+  formLoading.value = true;
+  try {
+    const data = (await formApi.getValues()) as MesCalTeamMemberApi.TeamMember;
+    await createTeamMember(data);
+    formOpen.value = false;
+    ElMessage.success($t('ui.actionMessage.operationSuccess'));
+    await getList();
+  } finally {
+    formLoading.value = false;
+  }
+}
+
+/** 删除成员 */
+async function handleDelete(id: number) {
+  await deleteTeamMember(id);
+  ElMessage.success($t('ui.actionMessage.deleteSuccess', ['成员']));
+  await getList();
+}
+
+watch(
+  () => props.teamId,
+  (value) => {
+    if (value) {
+      getList();
+    }
+  },
+  { immediate: true },
+);
+</script>
+
+<template>
+  <div>
+    <div v-if="isEditable" class="mb-3 flex items-center justify-start">
+      <TableAction :actions="[{ label: '添加成员', type: 'primary', onClick: openForm }]" />
+    </div>
+    <Grid class="w-full">
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: '删除',
+              type: 'danger',
+              link: true,
+              popConfirm: {
+                title: '确认删除该成员吗？',
+                confirm: handleDelete.bind(null, row.id!),
+              },
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+
+    <ElDialog v-model="formOpen" title="添加成员" width="520px">
+      <Form class="mx-4" />
+      <template #footer>
+        <ElButton @click="formOpen = false">取消</ElButton>
+        <ElButton type="primary" :loading="formLoading" @click="submitForm">确定</ElButton>
+      </template>
+    </ElDialog>
+  </div>
+</template>
diff --git a/apps/web-ele/src/views/mes/dv/checkplan/components/dv-check-plan-select.vue b/apps/web-ele/src/views/mes/dv/checkplan/components/dv-check-plan-select.vue
new file mode 100644
index 000000000..81d905dc3
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/checkplan/components/dv-check-plan-select.vue
@@ -0,0 +1,71 @@
+<script lang="ts" setup>
+import type { MesDvCheckPlanApi } from '#/api/mes/dv/checkplan';
+
+import { onMounted, ref, watch } from 'vue';
+
+import { ElOption, ElSelect } from 'element-plus';
+
+import { getCheckPlanPage } from '#/api/mes/dv/checkplan';
+
+const props = withDefaults(
+  defineProps<{
+    clearable?: boolean;
+    disabled?: boolean;
+    modelValue?: number;
+    placeholder?: string;
+    status?: number;
+    type?: number;
+  }>(),
+  {
+    clearable: true,
+    disabled: false,
+    modelValue: undefined,
+    placeholder: '请选择计划',
+    status: undefined,
+    type: undefined,
+  },
+);
+const emit = defineEmits<{
+  change: [row?: MesDvCheckPlanApi.CheckPlan];
+  'update:modelValue': [value?: number];
+}>();
+const list = ref<MesDvCheckPlanApi.CheckPlan[]>([]); // 点检计划列表
+
+/** 加载点检计划列表 */
+async function getList() {
+  const data = await getCheckPlanPage({
+    pageNo: 1,
+    pageSize: 100,
+    status: props.status,
+    type: props.type,
+  });
+  list.value = data.list || [];
+}
+
+/** 处理点检计划选择变化 */
+function handleChange(value: number | string | undefined) {
+  const planId = typeof value === 'number' ? value : undefined;
+  emit('update:modelValue', planId);
+  emit(
+    'change',
+    list.value.find((item) => item.id === planId),
+  );
+}
+
+watch(() => [props.status, props.type], getList);
+onMounted(getList);
+</script>
+
+<template>
+  <ElSelect
+    :clearable="clearable"
+    :disabled="disabled"
+    :model-value="modelValue"
+    :placeholder="placeholder"
+    class="w-full"
+    filterable
+    @change="handleChange"
+  >
+    <ElOption v-for="item in list" :key="item.id" :label="item.name" :value="item.id!" />
+  </ElSelect>
+</template>
diff --git a/apps/web-ele/src/views/mes/dv/checkplan/components/index.ts b/apps/web-ele/src/views/mes/dv/checkplan/components/index.ts
new file mode 100644
index 000000000..379957e07
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/checkplan/components/index.ts
@@ -0,0 +1 @@
+export { default as DvCheckPlanSelect } from './dv-check-plan-select.vue';
diff --git a/apps/web-ele/src/views/mes/dv/checkplan/data.ts b/apps/web-ele/src/views/mes/dv/checkplan/data.ts
new file mode 100644
index 000000000..cf5ff2c44
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/checkplan/data.ts
@@ -0,0 +1,248 @@
+import type { VbenFormApi, VbenFormSchema } from '#/adapter/form';
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvCheckPlanApi } from '#/api/mes/dv/checkplan';
+
+import { h } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
+import { ElButton } from 'element-plus';
+
+import { z } from '#/adapter/form';
+import { generateAutoCode } from '#/api/mes/md/autocode/record';
+import { getRangePickerDefaultProps } from '#/utils';
+import {
+  MesAutoCodeRuleCode,
+  MesDvCheckPlanStatusEnum,
+  MesDvSubjectTypeEnum,
+} from '#/views/mes/utils/constants';
+
+/** 新增/修改点检保养方案的表单 */
+export function useFormSchema(formApi?: VbenFormApi): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'status',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+      defaultValue: MesDvCheckPlanStatusEnum.PREPARE,
+    },
+    {
+      fieldName: 'code',
+      label: '方案编码',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入方案编码',
+      },
+      rules: 'required',
+      suffix: () =>
+        h(
+          ElButton,
+          {
+            type: 'default',
+            onClick: async () => {
+              try {
+                const code = await generateAutoCode(MesAutoCodeRuleCode.DV_CHECK_PLAN_CODE);
+                await formApi?.setFieldValue('code', code);
+              } catch (error) {
+                console.error(error);
+              }
+            },
+          },
+          { default: () => '生成' },
+        ),
+    },
+    {
+      fieldName: 'name',
+      label: '方案名称',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入方案名称',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'type',
+      label: '方案类型',
+      component: 'RadioGroup',
+      componentProps: {
+        options: getDictOptions(DICT_TYPE.MES_DV_SUBJECT_TYPE, 'number'),
+      },
+      rules: z.number().default(MesDvSubjectTypeEnum.CHECK),
+    },
+    {
+      fieldName: 'startDate',
+      label: '开始日期',
+      component: 'DatePicker',
+      componentProps: {
+        class: '!w-full',
+        format: 'YYYY-MM-DD',
+        placeholder: '请选择开始日期',
+        valueFormat: 'x',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'endDate',
+      label: '结束日期',
+      component: 'DatePicker',
+      componentProps: {
+        class: '!w-full',
+        format: 'YYYY-MM-DD',
+        placeholder: '请选择结束日期',
+        valueFormat: 'x',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'cycleType',
+      label: '周期类型',
+      component: 'Select',
+      componentProps: {
+        clearable: true,
+        options: getDictOptions(DICT_TYPE.MES_DV_CYCLE_TYPE, 'number'),
+        placeholder: '请选择周期类型',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'cycleCount',
+      label: '周期数量',
+      component: 'InputNumber',
+      componentProps: {
+        class: '!w-full',
+        controlsPosition: 'right',
+        min: 1,
+        precision: 0,
+      },
+      rules: z.number().default(1),
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      formItemClass: 'col-span-3',
+      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: 'type',
+      label: '方案类型',
+      component: 'Select',
+      componentProps: {
+        clearable: true,
+        options: getDictOptions(DICT_TYPE.MES_DV_SUBJECT_TYPE, 'number'),
+        placeholder: '请选择方案类型',
+      },
+    },
+    {
+      fieldName: 'status',
+      label: '状态',
+      component: 'Select',
+      componentProps: {
+        clearable: true,
+        options: getDictOptions(DICT_TYPE.MES_DV_CHECK_PLAN_STATUS, 'number'),
+        placeholder: '请选择状态',
+      },
+    },
+    {
+      fieldName: 'startDate',
+      label: '开始日期',
+      component: 'RangePicker',
+      componentProps: {
+        ...getRangePickerDefaultProps(),
+      },
+    },
+  ];
+}
+
+/** 列表的字段 */
+export function useGridColumns(): VxeTableGridOptions<MesDvCheckPlanApi.CheckPlan>['columns'] {
+  return [
+    {
+      field: 'code',
+      title: '方案编码',
+      minWidth: 140,
+      slots: {
+        default: 'code',
+      },
+    },
+    { field: 'name', title: '方案名称', minWidth: 150 },
+    {
+      field: 'type',
+      title: '方案类型',
+      width: 120,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_DV_SUBJECT_TYPE },
+      },
+    },
+    { field: 'startDate', title: '开始日期', width: 150, formatter: 'formatDate' },
+    { field: 'endDate', title: '结束日期', width: 150, formatter: 'formatDate' },
+    {
+      field: 'cycleType',
+      title: '周期类型',
+      width: 120,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_DV_CYCLE_TYPE },
+      },
+    },
+    { field: 'cycleCount', title: '周期数量', width: 100 },
+    {
+      field: 'status',
+      title: '状态',
+      width: 120,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_DV_CHECK_PLAN_STATUS },
+      },
+    },
+    { field: 'createTime', title: '创建时间', width: 180, formatter: 'formatDateTime' },
+    {
+      title: '操作',
+      width: 240,
+      fixed: 'right',
+      slots: {
+        default: 'actions',
+      },
+    },
+  ];
+}
diff --git a/apps/web-ele/src/views/mes/dv/checkplan/index.vue b/apps/web-ele/src/views/mes/dv/checkplan/index.vue
new file mode 100644
index 000000000..493af75d0
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/checkplan/index.vue
@@ -0,0 +1,195 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvCheckPlanApi } from '#/api/mes/dv/checkplan';
+import type { ActionItem } from '#/components/table-action/typing';
+
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
+import { downloadFileFromBlobPart } from '@vben/utils';
+
+import { ElButton, ElLoading, ElMessage } from 'element-plus';
+
+import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import {
+  deleteCheckPlan,
+  disableCheckPlan,
+  enableCheckPlan,
+  exportCheckPlan,
+  getCheckPlanPage,
+} from '#/api/mes/dv/checkplan';
+import { $t } from '#/locales';
+import { MesDvCheckPlanStatusEnum } from '#/views/mes/utils/constants';
+
+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({ type: 'create' }).open();
+}
+
+/** 查看点检计划 */
+function handleDetail(row: MesDvCheckPlanApi.CheckPlan) {
+  formModalApi.setData({ id: row.id, type: 'detail' }).open();
+}
+
+/** 编辑点检计划 */
+function handleEdit(row: MesDvCheckPlanApi.CheckPlan) {
+  formModalApi.setData({ id: row.id, type: 'update' }).open();
+}
+
+/** 删除点检计划 */
+async function handleDelete(row: MesDvCheckPlanApi.CheckPlan) {
+  const hideLoading = ElLoading.service({ text: $t('ui.actionMessage.deleting', [row.name]) });
+  try {
+    await deleteCheckPlan(row.id!);
+    ElMessage.success($t('ui.actionMessage.deleteSuccess', [row.name]));
+    handleRefresh();
+  } finally {
+    hideLoading.close();
+  }
+}
+
+/** 导出点检计划 */
+async function handleExport() {
+  const data = await exportCheckPlan(await gridApi.formApi.getValues());
+  downloadFileFromBlobPart({ fileName: '点检保养方案.xls', source: data });
+}
+
+/** 启用点检计划 */
+async function handleEnable(row: MesDvCheckPlanApi.CheckPlan) {
+  await enableCheckPlan(row.id!);
+  ElMessage.success($t('ui.actionMessage.operationSuccess'));
+  handleRefresh();
+}
+
+/** 停用点检计划 */
+async function handleDisable(row: MesDvCheckPlanApi.CheckPlan) {
+  await disableCheckPlan(row.id!);
+  ElMessage.success($t('ui.actionMessage.operationSuccess'));
+  handleRefresh();
+}
+
+/** 获取行操作按钮 */
+function getTableActions(row: MesDvCheckPlanApi.CheckPlan): ActionItem[] {
+  const actions: ActionItem[] = [];
+  if (row.status === MesDvCheckPlanStatusEnum.PREPARE) {
+    actions.push(
+      {
+        label: $t('common.edit'),
+        type: 'primary',
+        link: true,
+        icon: ACTION_ICON.EDIT,
+        auth: ['mes:dv-check-plan:update'],
+        onClick: handleEdit.bind(null, row),
+      },
+      {
+        label: $t('common.delete'),
+        type: 'danger',
+        link: true,
+        icon: ACTION_ICON.DELETE,
+        auth: ['mes:dv-check-plan:delete'],
+        popConfirm: {
+          title: $t('ui.actionMessage.deleteConfirm', [row.name]),
+          confirm: handleDelete.bind(null, row),
+        },
+      },
+    );
+  }
+  actions.push(
+    row.status === MesDvCheckPlanStatusEnum.PREPARE
+      ? {
+          label: '启用',
+          type: 'warning',
+          link: true,
+          auth: ['mes:dv-check-plan:update'],
+          onClick: handleEnable.bind(null, row),
+        }
+      : {
+          label: '停用',
+          type: 'warning',
+          link: true,
+          auth: ['mes:dv-check-plan:update'],
+          onClick: handleDisable.bind(null, row),
+        },
+  );
+  return actions;
+}
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  formOptions: {
+    schema: useGridFormSchema(),
+  },
+  gridOptions: {
+    columns: useGridColumns(),
+    height: 'auto',
+    keepSource: true,
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }, formValues) =>
+          await getCheckPlanPage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            ...formValues,
+          }),
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+  } as VxeTableGridOptions<MesDvCheckPlanApi.CheckPlan>,
+});
+</script>
+<template>
+  <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【设备】点检保养项目、点检保养方案"
+        url="https://doc.iocoder.cn/mes/dv/check-plan/"
+      />
+    </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:dv-check-plan:create'],
+              onClick: handleCreate,
+            },
+            {
+              label: $t('ui.actionTitle.export'),
+              type: 'primary',
+              icon: ACTION_ICON.DOWNLOAD,
+              auth: ['mes:dv-check-plan:export'],
+              onClick: handleExport,
+            },
+          ]"
+        />
+      </template>
+      <template #code="{ row }">
+        <ElButton link type="primary" @click="handleDetail(row)">{{ row.code }}</ElButton>
+      </template>
+      <template #actions="{ row }">
+        <TableAction :actions="getTableActions(row)" />
+      </template>
+    </Grid>
+  </Page>
+</template>
diff --git a/apps/web-ele/src/views/mes/dv/checkplan/modules/form.vue b/apps/web-ele/src/views/mes/dv/checkplan/modules/form.vue
new file mode 100644
index 000000000..14b3a5b5f
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/checkplan/modules/form.vue
@@ -0,0 +1,117 @@
+<script lang="ts" setup>
+import type { MesDvCheckPlanApi } from '#/api/mes/dv/checkplan';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { ElMessage, ElTabPane, ElTabs } from 'element-plus';
+
+import { useVbenForm } from '#/adapter/form';
+import { createCheckPlan, getCheckPlan, updateCheckPlan } from '#/api/mes/dv/checkplan';
+import { $t } from '#/locales';
+import { MesDvCheckPlanStatusEnum } from '#/views/mes/utils/constants';
+
+import { useFormSchema } from '../data';
+import MachineryList from './machinery-list.vue';
+import SubjectList from './subject-list.vue';
+
+type FormMode = 'create' | 'detail' | 'update';
+
+const emit = defineEmits(['success']);
+const formMode = ref<FormMode>('create');
+const subTabsName = ref('machinery');
+const formData = ref<MesDvCheckPlanApi.CheckPlan>();
+const isDetail = computed(() => formMode.value === 'detail');
+const getTitle = computed(() => {
+  if (formMode.value === 'detail') {
+    return '查看点检保养方案';
+  }
+  return formMode.value === 'update' ? '修改点检保养方案' : '新增点检保养方案';
+});
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-1',
+    labelWidth: 110,
+  },
+  wrapperClass: 'grid-cols-3',
+  layout: 'horizontal',
+  schema: [],
+  showDefaultActions: false,
+});
+
+/** 表单 schema 需要 formApi 引用，所以通过 setState 设置 schema */
+formApi.setState({ schema: useFormSchema(formApi) });
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    if (isDetail.value) {
+      await modalApi.close();
+      return;
+    }
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    const data = (await formApi.getValues()) as MesDvCheckPlanApi.CheckPlan;
+    try {
+      if (formMode.value === 'create') {
+        const id = await createCheckPlan(data);
+        formData.value = { ...data, id: id as number, status: MesDvCheckPlanStatusEnum.PREPARE };
+        await formApi.setFieldValue('id', id);
+        formMode.value = 'update';
+      } else {
+        await updateCheckPlan(data);
+        formData.value = { ...formData.value, ...data };
+      }
+      emit('success');
+      ElMessage.success($t('ui.actionMessage.operationSuccess'));
+    } finally {
+      modalApi.unlock();
+    }
+  },
+  async onOpenChange(isOpen: boolean) {
+    if (!isOpen) {
+      formData.value = undefined;
+      return;
+    }
+    await formApi.resetForm();
+    subTabsName.value = 'machinery';
+    // 加载数据
+    const data = modalApi.getData<{ id?: number; type?: FormMode }>();
+    formMode.value = data?.type || 'create';
+    formApi.setDisabled(formMode.value === 'detail');
+    modalApi.setState({ showConfirmButton: formMode.value !== 'detail' });
+    if (!data?.id) {
+      return;
+    }
+    modalApi.lock();
+    try {
+      formData.value = await getCheckPlan(data.id);
+      // 设置到 values
+      await formApi.setValues(formData.value);
+    } finally {
+      modalApi.unlock();
+    }
+  },
+});
+</script>
+<template>
+  <Modal :title="getTitle" class="w-4/5">
+    <Form class="mx-4" />
+    <ElTabs v-if="formMode !== 'create' && formData?.id" v-model="subTabsName" class="mx-4 mt-4">
+      <ElTabPane label="设备" name="machinery">
+        <MachineryList :form-type="formMode" :plan-id="formData.id" />
+      </ElTabPane>
+      <ElTabPane label="项目" name="subject">
+        <SubjectList :form-type="formMode" :plan-id="formData.id" :plan-type="formData.type" />
+      </ElTabPane>
+    </ElTabs>
+  </Modal>
+</template>
diff --git a/apps/web-ele/src/views/mes/dv/checkplan/modules/machinery-list.vue b/apps/web-ele/src/views/mes/dv/checkplan/modules/machinery-list.vue
new file mode 100644
index 000000000..5c91afdd4
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/checkplan/modules/machinery-list.vue
@@ -0,0 +1,187 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvCheckPlanMachineryApi } from '#/api/mes/dv/checkplan/machinery';
+
+import { computed, ref, watch } from 'vue';
+
+import { ElButton, ElDialog, ElMessage } from 'element-plus';
+
+import { useVbenForm } from '#/adapter/form';
+import { TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import {
+  createCheckPlanMachinery,
+  deleteCheckPlanMachinery,
+  getCheckPlanMachineryListByPlan,
+} from '#/api/mes/dv/checkplan/machinery';
+import { $t } from '#/locales';
+import { DvMachinerySelect } from '#/views/mes/dv/machinery/components';
+
+const props = withDefaults(
+  defineProps<{ formType?: string; planId: number; planType?: number }>(),
+  { formType: 'update', planType: undefined },
+);
+const isEditable = computed(() => props.formType !== 'detail');
+const formOpen = ref(false);
+const formLoading = ref(false);
+const list = ref<MesDvCheckPlanMachineryApi.CheckPlanMachinery[]>([]);
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-2',
+    labelWidth: 80,
+  },
+  layout: 'horizontal',
+  schema: [
+    {
+      fieldName: 'planId',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'machineryId',
+      label: '设备',
+      component: DvMachinerySelect,
+      componentProps: {
+        placeholder: '请选择设备',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入备注',
+        rows: 3,
+      },
+    },
+  ],
+  showDefaultActions: false,
+});
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    autoResize: true,
+    border: true,
+    columns: [
+      { field: 'machineryCode', title: '设备编码', minWidth: 140 },
+      { field: 'machineryName', title: '设备名称', minWidth: 150 },
+      { field: 'machineryBrand', title: '品牌', minWidth: 120 },
+      { field: 'machinerySpecification', title: '规格型号', minWidth: 140 },
+      { field: 'remark', title: '备注', minWidth: 140 },
+      {
+        title: '操作',
+        width: 90,
+        fixed: 'right',
+        slots: {
+          default: 'actions',
+        },
+        visible: isEditable.value,
+      },
+    ],
+    data: list.value,
+    minHeight: 240,
+    pagerConfig: {
+      enabled: false,
+    },
+    rowConfig: {
+      isHover: true,
+      keyField: 'id',
+    },
+    showOverflow: true,
+    toolbarConfig: {
+      enabled: false,
+    },
+  } as VxeTableGridOptions<MesDvCheckPlanMachineryApi.CheckPlanMachinery>,
+});
+
+/** 加载点检设备列表 */
+async function getList() {
+  gridApi.setLoading(true);
+  try {
+    list.value = await getCheckPlanMachineryListByPlan(props.planId);
+    gridApi.setGridOptions({ data: list.value });
+  } finally {
+    gridApi.setLoading(false);
+  }
+}
+
+/** 打开点检设备表单 */
+async function openForm() {
+  formOpen.value = true;
+  await formApi.resetForm();
+  await formApi.setValues({ planId: props.planId });
+}
+
+/** 提交点检设备表单 */
+async function submitForm() {
+  const { valid } = await formApi.validate();
+  if (!valid) {
+    return;
+  }
+  formLoading.value = true;
+  try {
+    await createCheckPlanMachinery(
+      (await formApi.getValues()) as MesDvCheckPlanMachineryApi.CheckPlanMachinery,
+    );
+    formOpen.value = false;
+    ElMessage.success($t('ui.actionMessage.operationSuccess'));
+    await getList();
+  } finally {
+    formLoading.value = false;
+  }
+}
+
+/** 删除点检设备 */
+async function handleDelete(id: number) {
+  await deleteCheckPlanMachinery(id);
+  ElMessage.success($t('ui.actionMessage.deleteSuccess', ['设备']));
+  await getList();
+}
+watch(
+  () => props.planId,
+  (value) => {
+    if (value) {
+      getList();
+    }
+  },
+  { immediate: true },
+);
+</script>
+<template>
+  <div>
+    <div v-if="isEditable" class="mb-3 flex items-center justify-start">
+      <TableAction :actions="[{ label: '添加设备', type: 'primary', onClick: openForm }]" />
+    </div>
+    <Grid class="w-full">
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: '删除',
+              type: 'danger',
+              link: true,
+              popConfirm: {
+                title: '确认删除该设备吗？',
+                confirm: handleDelete.bind(null, row.id!),
+              },
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+    <ElDialog v-model="formOpen" title="添加设备" width="520px">
+      <Form class="mx-4" />
+      <template #footer>
+        <ElButton @click="formOpen = false">取消</ElButton>
+        <ElButton type="primary" :loading="formLoading" @click="submitForm">确定</ElButton>
+      </template>
+    </ElDialog>
+  </div>
+</template>
diff --git a/apps/web-ele/src/views/mes/dv/checkplan/modules/subject-list.vue b/apps/web-ele/src/views/mes/dv/checkplan/modules/subject-list.vue
new file mode 100644
index 000000000..b678ed8d5
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/checkplan/modules/subject-list.vue
@@ -0,0 +1,199 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvCheckPlanSubjectApi } from '#/api/mes/dv/checkplan/subject';
+
+import { computed, ref, watch } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+
+import { ElButton, ElDialog, ElMessage } from 'element-plus';
+
+import { useVbenForm } from '#/adapter/form';
+import { TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import {
+  createCheckPlanSubject,
+  deleteCheckPlanSubject,
+  getCheckPlanSubjectListByPlan,
+} from '#/api/mes/dv/checkplan/subject';
+import { $t } from '#/locales';
+import { DvSubjectSelect } from '#/views/mes/dv/subject/components';
+
+const props = withDefaults(
+  defineProps<{ formType?: string; planId: number; planType?: number }>(),
+  { formType: 'update', planType: undefined },
+);
+const isEditable = computed(() => props.formType !== 'detail');
+const formOpen = ref(false);
+const formLoading = ref(false);
+const list = ref<MesDvCheckPlanSubjectApi.CheckPlanSubject[]>([]);
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-2',
+    labelWidth: 80,
+  },
+  layout: 'horizontal',
+  schema: [
+    {
+      fieldName: 'planId',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'subjectId',
+      label: '项目',
+      component: DvSubjectSelect,
+      componentProps: {
+        type: props.planType,
+        placeholder: '请选择项目',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入备注',
+        rows: 3,
+      },
+    },
+  ],
+  showDefaultActions: false,
+});
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    autoResize: true,
+    border: true,
+    columns: [
+      { field: 'subjectCode', title: '项目编码', minWidth: 140 },
+      { field: 'subjectName', title: '项目名称', minWidth: 150 },
+      {
+        field: 'subjectType',
+        title: '项目类型',
+        width: 120,
+        cellRender: {
+          name: 'CellDict',
+          props: { type: DICT_TYPE.MES_DV_SUBJECT_TYPE },
+        },
+      },
+      { field: 'subjectContent', title: '项目内容', minWidth: 160 },
+      { field: 'subjectStandard', title: '标准', minWidth: 160 },
+      { field: 'remark', title: '备注', minWidth: 140 },
+      {
+        title: '操作',
+        width: 90,
+        fixed: 'right',
+        slots: {
+          default: 'actions',
+        },
+        visible: isEditable.value,
+      },
+    ],
+    data: list.value,
+    minHeight: 240,
+    pagerConfig: {
+      enabled: false,
+    },
+    rowConfig: {
+      isHover: true,
+      keyField: 'id',
+    },
+    showOverflow: true,
+    toolbarConfig: {
+      enabled: false,
+    },
+  } as VxeTableGridOptions<MesDvCheckPlanSubjectApi.CheckPlanSubject>,
+});
+
+/** 加载点检项目列表 */
+async function getList() {
+  gridApi.setLoading(true);
+  try {
+    list.value = await getCheckPlanSubjectListByPlan(props.planId);
+    gridApi.setGridOptions({ data: list.value });
+  } finally {
+    gridApi.setLoading(false);
+  }
+}
+
+/** 打开点检项目表单 */
+async function openForm() {
+  formOpen.value = true;
+  await formApi.resetForm();
+  await formApi.setValues({ planId: props.planId });
+}
+
+/** 提交点检项目表单 */
+async function submitForm() {
+  const { valid } = await formApi.validate();
+  if (!valid) {
+    return;
+  }
+  formLoading.value = true;
+  try {
+    await createCheckPlanSubject(
+      (await formApi.getValues()) as MesDvCheckPlanSubjectApi.CheckPlanSubject,
+    );
+    formOpen.value = false;
+    ElMessage.success($t('ui.actionMessage.operationSuccess'));
+    await getList();
+  } finally {
+    formLoading.value = false;
+  }
+}
+
+/** 删除点检项目 */
+async function handleDelete(id: number) {
+  await deleteCheckPlanSubject(id);
+  ElMessage.success($t('ui.actionMessage.deleteSuccess', ['项目']));
+  await getList();
+}
+watch(
+  () => props.planId,
+  (value) => {
+    if (value) {
+      getList();
+    }
+  },
+  { immediate: true },
+);
+</script>
+<template>
+  <div>
+    <div v-if="isEditable" class="mb-3 flex items-center justify-start">
+      <TableAction :actions="[{ label: '添加项目', type: 'primary', onClick: openForm }]" />
+    </div>
+    <Grid class="w-full">
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: '删除',
+              type: 'danger',
+              link: true,
+              popConfirm: {
+                title: '确认删除该项目吗？',
+                confirm: handleDelete.bind(null, row.id!),
+              },
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+    <ElDialog v-model="formOpen" title="添加项目" width="520px">
+      <Form class="mx-4" />
+      <template #footer>
+        <ElButton @click="formOpen = false">取消</ElButton>
+        <ElButton type="primary" :loading="formLoading" @click="submitForm">确定</ElButton>
+      </template>
+    </ElDialog>
+  </div>
+</template>
diff --git a/apps/web-ele/src/views/mes/dv/checkrecord/data.ts b/apps/web-ele/src/views/mes/dv/checkrecord/data.ts
new file mode 100644
index 000000000..d75828f64
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/checkrecord/data.ts
@@ -0,0 +1,166 @@
+import type { VbenFormSchema } from '#/adapter/form';
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvCheckRecordApi } from '#/api/mes/dv/checkrecord';
+
+import { markRaw } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
+import { getSimpleUserList } from '#/api/system/user';
+import { getRangePickerDefaultProps } from '#/utils';
+import { DvCheckPlanSelect } from '#/views/mes/dv/checkplan/components';
+import { DvMachinerySelect } from '#/views/mes/dv/machinery/components';
+import {
+  MesDvCheckPlanStatusEnum,
+  MesDvCheckRecordStatusEnum,
+  MesDvSubjectTypeEnum,
+} from '#/views/mes/utils/constants';
+
+/** 新增/修改点检记录的表单 */
+export function useFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'status',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+      defaultValue: MesDvCheckRecordStatusEnum.DRAFT,
+    },
+    {
+      fieldName: 'machineryId',
+      label: '设备',
+      component: markRaw(DvMachinerySelect),
+      componentProps: {
+        placeholder: '请选择设备',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'planId',
+      label: '点检计划',
+      component: markRaw(DvCheckPlanSelect),
+      componentProps: {
+        status: MesDvCheckPlanStatusEnum.ENABLED,
+        type: MesDvSubjectTypeEnum.CHECK,
+        placeholder: '请选择计划',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'userId',
+      label: '点检人',
+      component: 'ApiSelect',
+      componentProps: {
+        clearable: true,
+        api: getSimpleUserList,
+        labelField: 'nickname',
+        placeholder: '请选择点检人',
+        valueField: 'id',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'checkTime',
+      label: '点检时间',
+      component: 'DatePicker',
+      componentProps: {
+        class: '!w-full',
+        format: 'YYYY-MM-DD HH:mm:ss',
+        placeholder: '请选择点检时间',
+        showTime: true,
+        valueFormat: 'x',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      formItemClass: 'col-span-3',
+      componentProps: {
+        placeholder: '请输入备注',
+        rows: 3,
+      },
+    },
+  ];
+}
+
+/** 列表的搜索表单 */
+export function useGridFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'machineryName',
+      label: '设备名称',
+      component: 'Input',
+      componentProps: {
+        clearable: true,
+        placeholder: '请输入设备名称',
+      },
+    },
+    {
+      fieldName: 'checkTime',
+      label: '点检时间',
+      component: 'RangePicker',
+      componentProps: {
+        ...getRangePickerDefaultProps(),
+      },
+    },
+    {
+      fieldName: 'status',
+      label: '状态',
+      component: 'Select',
+      componentProps: {
+        clearable: true,
+        options: getDictOptions(DICT_TYPE.MES_DV_CHECK_RECORD_STATUS, 'number'),
+        placeholder: '请选择状态',
+      },
+    },
+  ];
+}
+
+/** 列表的字段 */
+export function useGridColumns(): VxeTableGridOptions<MesDvCheckRecordApi.CheckRecord>['columns'] {
+  return [
+    { field: 'machineryCode', title: '设备编码', minWidth: 140 },
+    {
+      field: 'machineryName',
+      title: '设备名称',
+      minWidth: 150,
+      slots: {
+        default: 'machineryName',
+      },
+    },
+    { field: 'planName', title: '计划名称', minWidth: 150 },
+    { field: 'checkTime', title: '点检时间', width: 180, formatter: 'formatDateTime' },
+    { field: 'nickname', title: '点检人', minWidth: 120 },
+    {
+      field: 'status',
+      title: '状态',
+      width: 120,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_DV_CHECK_RECORD_STATUS },
+      },
+    },
+    { field: 'createTime', title: '创建时间', width: 180, formatter: 'formatDateTime' },
+    {
+      title: '操作',
+      width: 200,
+      fixed: 'right',
+      slots: {
+        default: 'actions',
+      },
+    },
+  ];
+}
diff --git a/apps/web-ele/src/views/mes/dv/checkrecord/index.vue b/apps/web-ele/src/views/mes/dv/checkrecord/index.vue
new file mode 100644
index 000000000..f29ff2d05
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/checkrecord/index.vue
@@ -0,0 +1,162 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvCheckRecordApi } from '#/api/mes/dv/checkrecord';
+
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
+import { downloadFileFromBlobPart } from '@vben/utils';
+
+import { ElButton, ElLoading, ElMessage } from 'element-plus';
+
+import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import { deleteCheckRecord, exportCheckRecord, getCheckRecordPage } from '#/api/mes/dv/checkrecord';
+import { $t } from '#/locales';
+import { MesDvCheckRecordStatusEnum } from '#/views/mes/utils/constants';
+
+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({ type: 'create' }).open();
+}
+
+/** 查看点检记录 */
+function handleDetail(row: MesDvCheckRecordApi.CheckRecord) {
+  formModalApi.setData({ id: row.id, type: 'detail' }).open();
+}
+
+/** 编辑点检记录 */
+function handleEdit(row: MesDvCheckRecordApi.CheckRecord) {
+  formModalApi.setData({ id: row.id, type: 'update' }).open();
+}
+
+/** 删除点检记录 */
+async function handleDelete(row: MesDvCheckRecordApi.CheckRecord) {
+  const hideLoading = ElLoading.service({
+    text: $t('ui.actionMessage.deleting', [row.machineryName]),
+  });
+  try {
+    await deleteCheckRecord(row.id!);
+    ElMessage.success($t('ui.actionMessage.deleteSuccess', [row.machineryName]));
+    handleRefresh();
+  } finally {
+    hideLoading.close();
+  }
+}
+
+/** 导出点检记录 */
+async function handleExport() {
+  const data = await exportCheckRecord(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) =>
+          await getCheckRecordPage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            ...formValues,
+          }),
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+  } as VxeTableGridOptions<MesDvCheckRecordApi.CheckRecord>,
+});
+</script>
+<template>
+  <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【设备】点检记录、保养记录、维修单"
+        url="https://doc.iocoder.cn/mes/dv/check-record/"
+      />
+    </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:dv-check-record:create'],
+              onClick: handleCreate,
+            },
+            {
+              label: $t('ui.actionTitle.export'),
+              type: 'primary',
+              icon: ACTION_ICON.DOWNLOAD,
+              auth: ['mes:dv-check-record:export'],
+              onClick: handleExport,
+            },
+          ]"
+        />
+      </template>
+      <template #machineryName="{ row }">
+        <ElButton link type="primary" @click="handleDetail(row)">{{ row.machineryName }}</ElButton>
+      </template>
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: $t('common.edit'),
+              type: 'primary',
+              link: true,
+              icon: ACTION_ICON.EDIT,
+              auth: ['mes:dv-check-record:update'],
+              onClick: handleEdit.bind(null, row),
+              ifShow: row.status === MesDvCheckRecordStatusEnum.DRAFT,
+            },
+            {
+              label: $t('common.delete'),
+              type: 'danger',
+              link: true,
+              icon: ACTION_ICON.DELETE,
+              auth: ['mes:dv-check-record:delete'],
+              popConfirm: {
+                title: $t('ui.actionMessage.deleteConfirm', [row.machineryName]),
+                confirm: handleDelete.bind(null, row),
+              },
+              ifShow: row.status === MesDvCheckRecordStatusEnum.DRAFT,
+            },
+            {
+              label: $t('common.detail'),
+              type: 'primary',
+              link: true,
+              icon: ACTION_ICON.VIEW,
+              auth: ['mes:dv-check-record:query'],
+              onClick: handleDetail.bind(null, row),
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+  </Page>
+</template>
diff --git a/apps/web-ele/src/views/mes/dv/checkrecord/modules/form.vue b/apps/web-ele/src/views/mes/dv/checkrecord/modules/form.vue
new file mode 100644
index 000000000..cbbc3557a
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/checkrecord/modules/form.vue
@@ -0,0 +1,144 @@
+<script lang="ts" setup>
+import type { MesDvCheckRecordApi } from '#/api/mes/dv/checkrecord';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { ElButton, ElMessage, ElPopconfirm } from 'element-plus';
+
+import { useVbenForm } from '#/adapter/form';
+import {
+  createCheckRecord,
+  getCheckRecord,
+  submitCheckRecord,
+  updateCheckRecord,
+} from '#/api/mes/dv/checkrecord';
+import { $t } from '#/locales';
+import { MesDvCheckRecordStatusEnum } from '#/views/mes/utils/constants';
+
+import { useFormSchema } from '../data';
+import LineList from './line-list.vue';
+
+type FormMode = 'create' | 'detail' | 'update';
+
+const emit = defineEmits(['success']);
+const formMode = ref<FormMode>('create');
+const formData = ref<MesDvCheckRecordApi.CheckRecord>();
+const isDetail = computed(() => formMode.value === 'detail');
+const canSubmit = computed(
+  () => formMode.value === 'update' && formData.value?.status === MesDvCheckRecordStatusEnum.DRAFT,
+);
+const getTitle = computed(() => {
+  if (formMode.value === 'detail') {
+    return '查看点检记录';
+  }
+  return formMode.value === 'update' ? '修改点检记录' : '新增点检记录';
+});
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-1',
+    labelWidth: 100,
+  },
+  wrapperClass: 'grid-cols-3',
+  layout: 'horizontal',
+  schema: useFormSchema(),
+  showDefaultActions: false,
+});
+
+/** 提交点检记录 */
+async function handleSubmit() {
+  const { valid } = await formApi.validate();
+  if (!valid || !formData.value?.id) {
+    return;
+  }
+
+  modalApi.lock();
+  try {
+    await updateCheckRecord((await formApi.getValues()) as MesDvCheckRecordApi.CheckRecord);
+    await submitCheckRecord(formData.value.id);
+    await modalApi.close();
+    emit('success');
+    ElMessage.success('提交成功');
+  } finally {
+    modalApi.unlock();
+  }
+}
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    if (isDetail.value) {
+      await modalApi.close();
+      return;
+    }
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    const data = (await formApi.getValues()) as MesDvCheckRecordApi.CheckRecord;
+    try {
+      if (formMode.value === 'create') {
+        const id = await createCheckRecord(data);
+        formData.value = { ...data, id: id as number, status: MesDvCheckRecordStatusEnum.DRAFT };
+        await formApi.setFieldValue('id', id);
+        formMode.value = 'update';
+      } else {
+        await updateCheckRecord(data);
+        formData.value = { ...formData.value, ...data };
+      }
+      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; type?: FormMode }>();
+    formMode.value = data?.type || 'create';
+    formApi.setDisabled(formMode.value === 'detail');
+    modalApi.setState({ showConfirmButton: formMode.value !== 'detail' });
+    if (!data?.id) {
+      return;
+    }
+    modalApi.lock();
+    try {
+      formData.value = await getCheckRecord(data.id);
+      // 设置到 values
+      await formApi.setValues(formData.value);
+    } finally {
+      modalApi.unlock();
+    }
+  },
+});
+</script>
+<template>
+  <Modal :title="getTitle" class="w-4/5">
+    <Form class="mx-4" />
+    <LineList v-if="formData?.id" :disabled="isDetail" :record-id="formData.id" />
+    <template #prepend-footer>
+      <div class="flex flex-auto items-center">
+        <ElPopconfirm
+          v-if="canSubmit"
+          title="确认提交该点检记录？提交后将不能修改。"
+          @confirm="handleSubmit"
+        >
+          <template #reference>
+            <ElButton type="primary">提交</ElButton>
+          </template>
+        </ElPopconfirm>
+      </div>
+    </template>
+  </Modal>
+</template>
diff --git a/apps/web-ele/src/views/mes/dv/checkrecord/modules/line-list.vue b/apps/web-ele/src/views/mes/dv/checkrecord/modules/line-list.vue
new file mode 100644
index 000000000..42bd2e466
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/checkrecord/modules/line-list.vue
@@ -0,0 +1,233 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvCheckRecordLineApi } from '#/api/mes/dv/checkrecord/line';
+
+import { computed, ref, watch } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
+import { ElButton, ElDialog, ElMessage } from 'element-plus';
+
+import { useVbenForm } from '#/adapter/form';
+import { TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import {
+  createCheckRecordLine,
+  deleteCheckRecordLine,
+  getCheckRecordLine,
+  getCheckRecordLinePage,
+  updateCheckRecordLine,
+} from '#/api/mes/dv/checkrecord/line';
+import { $t } from '#/locales';
+import { DvSubjectSelect } from '#/views/mes/dv/subject/components';
+import { MesDvCheckResultEnum, MesDvSubjectTypeEnum } from '#/views/mes/utils/constants';
+
+const props = defineProps<{ disabled?: boolean; recordId: number }>();
+const formOpen = ref(false);
+const formLoading = ref(false);
+const lineFormType = ref<'create' | 'update'>('create');
+const formTitle = computed(() => (lineFormType.value === 'create' ? '添加明细' : '修改明细'));
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-2',
+    labelWidth: 90,
+  },
+  layout: 'horizontal',
+  schema: [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'recordId',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'subjectId',
+      label: '项目',
+      component: DvSubjectSelect,
+      componentProps: {
+        type: MesDvSubjectTypeEnum.CHECK,
+        placeholder: '请选择项目',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'checkStatus',
+      label: '结果',
+      component: 'RadioGroup',
+      componentProps: {
+        options: getDictOptions(DICT_TYPE.MES_DV_CHECK_RESULT, 'number'),
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'checkResult',
+      label: '异常描述',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入异常描述',
+        rows: 3,
+      },
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入备注',
+        rows: 2,
+      },
+    },
+  ],
+  showDefaultActions: false,
+});
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    columns: [
+      { field: 'subjectName', title: '项目名称', minWidth: 150 },
+      { field: 'subjectContent', title: '项目内容', minWidth: 160 },
+      { field: 'subjectStandard', title: '项目标准', minWidth: 160 },
+      {
+        field: 'checkStatus',
+        title: '结果',
+        width: 120,
+        cellRender: {
+          name: 'CellDict',
+          props: { type: DICT_TYPE.MES_DV_CHECK_RESULT },
+        },
+      },
+      { field: 'checkResult', title: '异常描述', minWidth: 160 },
+      {
+        title: '操作',
+        width: 130,
+        fixed: 'right',
+        slots: {
+          default: 'actions',
+        },
+        visible: !props.disabled,
+      },
+    ],
+    height: 320,
+    keepSource: true,
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }) =>
+          await getCheckRecordLinePage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            recordId: props.recordId,
+          }),
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+    },
+  } as VxeTableGridOptions<MesDvCheckRecordLineApi.CheckRecordLine>,
+});
+
+/** 打开点检明细表单 */
+async function openForm(type: 'create' | 'update', row?: MesDvCheckRecordLineApi.CheckRecordLine) {
+  formOpen.value = true;
+  lineFormType.value = type;
+  await formApi.resetForm();
+  await formApi.setValues(
+    row
+      ? await getCheckRecordLine(row.id!)
+      : {
+          recordId: props.recordId,
+          checkStatus: MesDvCheckResultEnum.NORMAL,
+          checkResult: '',
+          remark: '',
+        },
+  );
+}
+
+/** 提交点检明细表单 */
+async function submitForm() {
+  const { valid } = await formApi.validate();
+  if (!valid) {
+    return;
+  }
+  formLoading.value = true;
+  try {
+    const data = (await formApi.getValues()) as MesDvCheckRecordLineApi.CheckRecordLine;
+    await (data.id ? updateCheckRecordLine(data) : createCheckRecordLine(data));
+    formOpen.value = false;
+    ElMessage.success($t('ui.actionMessage.operationSuccess'));
+    await gridApi.query();
+  } finally {
+    formLoading.value = false;
+  }
+}
+
+/** 删除点检明细 */
+async function handleDelete(id: number) {
+  await deleteCheckRecordLine(id);
+  ElMessage.success($t('ui.actionMessage.deleteSuccess', ['明细']));
+  await gridApi.query();
+}
+watch(
+  () => props.recordId,
+  (value) => {
+    if (value) {
+      gridApi.query();
+    }
+  },
+);
+</script>
+<template>
+  <div class="mx-4 mt-4">
+    <div v-if="!disabled" class="mb-3">
+      <TableAction
+        :actions="[{ label: '添加明细', type: 'primary', onClick: openForm.bind(null, 'create') }]"
+      />
+    </div>
+    <Grid table-title="明细列表">
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: '编辑',
+              type: 'primary',
+              link: true,
+              onClick: openForm.bind(null, 'update', row),
+            },
+            {
+              label: '删除',
+              type: 'danger',
+              link: true,
+              popConfirm: {
+                title: '确认删除该明细吗？',
+                confirm: handleDelete.bind(null, row.id!),
+              },
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+    <ElDialog v-model="formOpen" :title="formTitle" width="620px">
+      <Form class="mx-4" />
+      <template #footer>
+        <ElButton @click="formOpen = false">取消</ElButton>
+        <ElButton type="primary" :loading="formLoading" @click="submitForm">确定</ElButton>
+      </template>
+    </ElDialog>
+  </div>
+</template>
diff --git a/apps/web-ele/src/views/mes/dv/machinery/components/dv-machinery-select.vue b/apps/web-ele/src/views/mes/dv/machinery/components/dv-machinery-select.vue
new file mode 100644
index 000000000..09f55a66b
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/machinery/components/dv-machinery-select.vue
@@ -0,0 +1,55 @@
+<script lang="ts" setup>
+import type { MesDvMachineryApi } from '#/api/mes/dv/machinery';
+
+import { onMounted, ref } from 'vue';
+
+import { ElOption, ElSelect } from 'element-plus';
+
+import { getMachinerySimpleList } from '#/api/mes/dv/machinery';
+
+withDefaults(
+  defineProps<{
+    clearable?: boolean;
+    disabled?: boolean;
+    modelValue?: number;
+    placeholder?: string;
+  }>(),
+  { clearable: true, disabled: false, modelValue: undefined, placeholder: '请选择设备' },
+);
+const emit = defineEmits<{
+  change: [row?: MesDvMachineryApi.Machinery];
+  'update:modelValue': [value?: number];
+}>();
+const list = ref<MesDvMachineryApi.Machinery[]>([]); // 设备列表
+
+/** 加载设备列表 */
+async function getList() {
+  list.value = await getMachinerySimpleList();
+}
+
+/** 处理设备选择变化 */
+function handleChange(value: number | string | undefined) {
+  const machineryId = typeof value === 'number' ? value : undefined;
+  emit('update:modelValue', machineryId);
+  emit(
+    'change',
+    list.value.find((item) => item.id === machineryId),
+  );
+}
+
+onMounted(getList);
+</script>
+
+<template>
+  <ElSelect
+    :clearable="clearable"
+    :disabled="disabled"
+    :model-value="modelValue"
+    :placeholder="placeholder"
+    class="w-full"
+    filterable
+    @change="handleChange"
+  >
+    <ElOption v-for="item in list" :key="item.id" :label="item.name" :value="item.id!" />
+  </ElSelect>
+</template>
diff --git a/apps/web-ele/src/views/mes/dv/machinery/components/index.ts b/apps/web-ele/src/views/mes/dv/machinery/components/index.ts
new file mode 100644
index 000000000..cbe225de1
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/machinery/components/index.ts
@@ -0,0 +1 @@
+export { default as DvMachinerySelect } from './dv-machinery-select.vue';
diff --git a/apps/web-ele/src/views/mes/dv/machinery/data.ts b/apps/web-ele/src/views/mes/dv/machinery/data.ts
new file mode 100644
index 000000000..c11fd5940
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/machinery/data.ts
@@ -0,0 +1,277 @@
+import type { Ref } from 'vue';
+
+import type { VbenFormApi, VbenFormSchema } from '#/adapter/form';
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvMachineryApi } from '#/api/mes/dv/machinery';
+
+import { h, markRaw } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
+import { ElButton } from 'element-plus';
+
+import { z } from '#/adapter/form';
+import { generateAutoCode } from '#/api/mes/md/autocode/record';
+import { MdWorkshopSelect } from '#/views/mes/md/workstation/components';
+import { MesAutoCodeRuleCode, MesDvMachineryStatusEnum } from '#/views/mes/utils/constants';
+
+import { DvMachineryTypeSelect } from './type/components';
+
+/** 新增/修改设备的表单 */
+export function useFormSchema(formApi?: VbenFormApi, formMode?: Ref<string>): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'code',
+      label: '设备编码',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入设备编码',
+      },
+      dependencies: {
+        triggerFields: ['id'],
+        componentProps: (values) => ({ disabled: !!values.id }),
+      },
+      rules: 'required',
+      suffix: () =>
+        h(
+          ElButton,
+          {
+            type: 'default',
+            onClick: async () => {
+              try {
+                const code = await generateAutoCode(MesAutoCodeRuleCode.DV_MACHINERY_CODE);
+                await formApi?.setFieldValue('code', code);
+              } catch (error) {
+                console.error(error);
+              }
+            },
+          },
+          { default: () => '生成' },
+        ),
+    },
+    {
+      fieldName: 'name',
+      label: '设备名称',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入设备名称',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'brand',
+      label: '品牌',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入品牌',
+      },
+    },
+    {
+      fieldName: 'machineryTypeId',
+      label: '设备类型',
+      component: markRaw(DvMachineryTypeSelect),
+      componentProps: {
+        placeholder: '请选择设备类型',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'workshopId',
+      label: '所属车间',
+      component: markRaw(MdWorkshopSelect),
+      componentProps: {
+        placeholder: '请选择所属车间',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'status',
+      label: '设备状态',
+      component: 'RadioGroup',
+      componentProps: {
+        options: getDictOptions(DICT_TYPE.MES_DV_MACHINERY_STATUS, 'number'),
+      },
+      rules: z.number().default(MesDvMachineryStatusEnum.STOP),
+    },
+    {
+      fieldName: 'specification',
+      label: '规格型号',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入规格型号',
+      },
+    },
+    {
+      fieldName: 'lastCheckTime',
+      label: '最近点检时间',
+      component: 'DatePicker',
+      componentProps: {
+        disabled: true,
+        format: 'YYYY-MM-DD HH:mm:ss',
+        showTime: true,
+        valueFormat: 'x',
+        class: '!w-full',
+      },
+      dependencies: {
+        triggerFields: ['id'],
+        show: () => formMode?.value === 'detail',
+      },
+    },
+    {
+      fieldName: 'lastMaintenTime',
+      label: '最近保养时间',
+      component: 'DatePicker',
+      componentProps: {
+        disabled: true,
+        format: 'YYYY-MM-DD HH:mm:ss',
+        showTime: true,
+        valueFormat: 'x',
+        class: '!w-full',
+      },
+      dependencies: {
+        triggerFields: ['id'],
+        show: () => formMode?.value === 'detail',
+      },
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      formItemClass: 'col-span-3',
+      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: 'workshopId',
+      label: '所属车间',
+      component: markRaw(MdWorkshopSelect),
+      componentProps: {
+        clearable: true,
+        placeholder: '请选择所属车间',
+      },
+    },
+    {
+      fieldName: 'status',
+      label: '设备状态',
+      component: 'Select',
+      componentProps: {
+        clearable: true,
+        options: getDictOptions(DICT_TYPE.MES_DV_MACHINERY_STATUS, 'number'),
+        placeholder: '请选择设备状态',
+      },
+    },
+  ];
+}
+
+/** 列表的字段 */
+export function useGridColumns(): VxeTableGridOptions<MesDvMachineryApi.Machinery>['columns'] {
+  return [
+    {
+      field: 'code',
+      title: '设备编码',
+      minWidth: 140,
+      slots: {
+        default: 'code',
+      },
+    },
+    { field: 'name', title: '设备名称', minWidth: 140 },
+    { field: 'brand', title: '品牌', minWidth: 120 },
+    { field: 'specification', title: '规格型号', minWidth: 140 },
+    { field: 'machineryTypeName', title: '设备类型', minWidth: 140 },
+    { field: 'workshopName', title: '所属车间', minWidth: 140 },
+    {
+      field: 'status',
+      title: '设备状态',
+      width: 120,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_DV_MACHINERY_STATUS },
+      },
+    },
+    {
+      field: 'lastCheckTime',
+      title: '最近点检时间',
+      width: 180,
+      formatter: 'formatDateTime',
+    },
+    {
+      field: 'lastMaintenTime',
+      title: '最近保养时间',
+      width: 180,
+      formatter: 'formatDateTime',
+    },
+    {
+      field: 'createTime',
+      title: '创建时间',
+      width: 180,
+      formatter: 'formatDateTime',
+    },
+    {
+      title: '操作',
+      width: 220,
+      fixed: 'right',
+      slots: {
+        default: 'actions',
+      },
+    },
+  ];
+}
+
+/** 导入表单 */
+export function useImportFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'file',
+      label: '设备数据',
+      component: 'Upload',
+      rules: 'required',
+      help: '仅允许导入 xls、xlsx 格式文件',
+    },
+    {
+      fieldName: 'updateSupport',
+      label: '是否覆盖',
+      component: 'Switch',
+      componentProps: {
+        activeText: '是',
+        inactiveText: '否',
+      },
+      rules: z.boolean().default(false),
+      help: '是否更新已经存在的设备数据',
+    },
+  ];
+}
diff --git a/apps/web-ele/src/views/mes/dv/machinery/index.vue b/apps/web-ele/src/views/mes/dv/machinery/index.vue
new file mode 100644
index 000000000..97b0adde5
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/machinery/index.vue
@@ -0,0 +1,196 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvMachineryApi } from '#/api/mes/dv/machinery';
+import type { MesDvMachineryTypeApi } from '#/api/mes/dv/machinery/type';
+
+import { ref } from 'vue';
+
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
+import { downloadFileFromBlobPart } from '@vben/utils';
+
+import { ElButton, ElLoading, ElMessage } from 'element-plus';
+
+import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import { deleteMachinery, exportMachinery, getMachineryPage } from '#/api/mes/dv/machinery';
+import { $t } from '#/locales';
+import { MachineryTypeTree } from '#/views/mes/dv/machinery/type/components';
+
+import { useGridColumns, useGridFormSchema } from './data';
+import Form from './modules/form.vue';
+import ImportForm from './modules/import-form.vue';
+
+const selectedMachineryTypeId = ref<number>(); // 选中设备类型编号
+
+const [FormModal, formModalApi] = useVbenModal({
+  connectedComponent: Form,
+  destroyOnClose: true,
+});
+const [ImportModal, importModalApi] = useVbenModal({
+  connectedComponent: ImportForm,
+  destroyOnClose: true,
+});
+
+/** 刷新表格 */
+function handleRefresh() {
+  gridApi.query();
+}
+
+/** 创建设备 */
+function handleCreate() {
+  formModalApi.setData({ type: 'create' }).open();
+}
+
+/** 查看设备 */
+function handleDetail(row: MesDvMachineryApi.Machinery) {
+  formModalApi.setData({ id: row.id, type: 'detail' }).open();
+}
+
+/** 编辑设备 */
+function handleEdit(row: MesDvMachineryApi.Machinery) {
+  formModalApi.setData({ id: row.id, type: 'update' }).open();
+}
+
+/** 删除设备 */
+async function handleDelete(row: MesDvMachineryApi.Machinery) {
+  const hideLoading = ElLoading.service({ text: $t('ui.actionMessage.deleting', [row.name]) });
+  try {
+    await deleteMachinery(row.id!);
+    ElMessage.success($t('ui.actionMessage.deleteSuccess', [row.name]));
+    handleRefresh();
+  } finally {
+    hideLoading.close();
+  }
+}
+
+/** 导出设备 */
+async function handleExport() {
+  const data = await exportMachinery(await gridApi.formApi.getValues());
+  downloadFileFromBlobPart({ fileName: '设备台账.xls', source: data });
+}
+
+/** 导入设备 */
+function handleImport() {
+  importModalApi.open();
+}
+
+/** 按设备类型筛选 */
+function handleTypeNodeClick(row: MesDvMachineryTypeApi.MachineryType | undefined) {
+  selectedMachineryTypeId.value = row?.id;
+  handleRefresh();
+}
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  formOptions: {
+    schema: useGridFormSchema(),
+  },
+  gridOptions: {
+    columns: useGridColumns(),
+    height: 'auto',
+    keepSource: true,
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }, formValues) =>
+          await getMachineryPage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            ...formValues,
+            machineryTypeId: selectedMachineryTypeId.value,
+          }),
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+  } as VxeTableGridOptions<MesDvMachineryApi.Machinery>,
+});
+</script>
+
+<template>
+  <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【设备】设备类型、设备台账"
+        url="https://doc.iocoder.cn/mes/dv/device/"
+      />
+    </template>
+    <FormModal @success="handleRefresh" />
+    <ImportModal @success="handleRefresh" />
+    <div class="flex h-full w-full">
+      <div class="mr-4 h-full w-1/6">
+        <MachineryTypeTree @node-click="handleTypeNodeClick" />
+      </div>
+      <div class="w-5/6">
+        <Grid table-title="设备台账列表">
+          <template #toolbar-tools>
+            <TableAction
+              :actions="[
+                {
+                  label: $t('ui.actionTitle.create', ['设备']),
+                  type: 'primary',
+                  icon: ACTION_ICON.ADD,
+                  auth: ['mes:dv-machinery:create'],
+                  onClick: handleCreate,
+                },
+                {
+                  label: $t('ui.actionTitle.import'),
+                  type: 'primary',
+                  icon: ACTION_ICON.UPLOAD,
+                  auth: ['mes:dv-machinery:import'],
+                  onClick: handleImport,
+                },
+                {
+                  label: $t('ui.actionTitle.export'),
+                  type: 'primary',
+                  icon: ACTION_ICON.DOWNLOAD,
+                  auth: ['mes:dv-machinery:export'],
+                  onClick: handleExport,
+                },
+              ]"
+            />
+          </template>
+          <template #code="{ row }">
+            <ElButton link type="primary" @click="handleDetail(row)">{{ row.code }}</ElButton>
+          </template>
+          <template #actions="{ row }">
+            <TableAction
+              :actions="[
+                {
+                  label: $t('common.edit'),
+                  type: 'primary',
+                  link: true,
+                  icon: ACTION_ICON.EDIT,
+                  auth: ['mes:dv-machinery:update'],
+                  onClick: handleEdit.bind(null, row),
+                },
+                {
+                  label: $t('common.delete'),
+                  type: 'danger',
+                  link: true,
+                  icon: ACTION_ICON.DELETE,
+                  auth: ['mes:dv-machinery:delete'],
+                  popConfirm: {
+                    title: $t('ui.actionMessage.deleteConfirm', [row.name]),
+                    confirm: handleDelete.bind(null, row),
+                  },
+                },
+                {
+                  label: $t('common.detail'),
+                  type: 'primary',
+                  link: true,
+                  icon: ACTION_ICON.VIEW,
+                  auth: ['mes:dv-machinery:query'],
+                  onClick: handleDetail.bind(null, row),
+                },
+              ]"
+            />
+          </template>
+        </Grid>
+      </div>
+    </div>
+  </Page>
+</template>
diff --git a/apps/web-ele/src/views/mes/dv/machinery/modules/check-record-list.vue b/apps/web-ele/src/views/mes/dv/machinery/modules/check-record-list.vue
new file mode 100644
index 000000000..aa486cf05
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/machinery/modules/check-record-list.vue
@@ -0,0 +1,73 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvCheckRecordApi } from '#/api/mes/dv/checkrecord';
+
+import { watch } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { getCheckRecordPage } from '#/api/mes/dv/checkrecord';
+
+const props = defineProps<{ machineryId: number }>();
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    columns: [
+      { field: 'planName', title: '计划名称', minWidth: 150 },
+      {
+        field: 'planCycleType',
+        title: '周期类型',
+        width: 120,
+        cellRender: {
+          name: 'CellDict',
+          props: { type: DICT_TYPE.MES_DV_CYCLE_TYPE },
+        },
+      },
+      { field: 'checkTime', title: '点检时间', width: 180, formatter: 'formatDateTime' },
+      { field: 'nickname', title: '操作人', minWidth: 120 },
+      {
+        field: 'status',
+        title: '状态',
+        width: 120,
+        cellRender: {
+          name: 'CellDict',
+          props: { type: DICT_TYPE.MES_DV_CHECK_RECORD_STATUS },
+        },
+      },
+    ],
+    height: 320,
+    keepSource: true,
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }) =>
+          await getCheckRecordPage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            machineryId: props.machineryId,
+          }),
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+    },
+  } as VxeTableGridOptions<MesDvCheckRecordApi.CheckRecord>,
+});
+
+watch(
+  () => props.machineryId,
+  (value) => {
+    if (value) {
+      gridApi.query();
+    }
+  },
+);
+</script>
+
+<template>
+  <Grid table-title="点检记录" />
+</template>
diff --git a/apps/web-ele/src/views/mes/dv/machinery/modules/form.vue b/apps/web-ele/src/views/mes/dv/machinery/modules/form.vue
new file mode 100644
index 000000000..4165ef0bf
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/machinery/modules/form.vue
@@ -0,0 +1,139 @@
+<script lang="ts" setup>
+import type { MesDvMachineryApi } from '#/api/mes/dv/machinery';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { ElButton, ElMessage, ElTabPane, ElTabs } from 'element-plus';
+
+import { useVbenForm } from '#/adapter/form';
+import { createMachinery, getMachinery, updateMachinery } from '#/api/mes/dv/machinery';
+import { $t } from '#/locales';
+import { BarcodeBizTypeEnum } from '#/views/mes/utils/constants';
+import { BarcodeDetail } from '#/views/mes/wm/barcode/components';
+
+import { useFormSchema } from '../data';
+import CheckRecordList from './check-record-list.vue';
+import MaintenRecordList from './mainten-record-list.vue';
+import RepairList from './repair-list.vue';
+
+type FormMode = 'create' | 'detail' | 'update';
+
+const emit = defineEmits(['success']);
+const formMode = ref<FormMode>('create'); // 表单模式
+const subTabsName = ref('check'); // 当前资源页签
+const formData = ref<MesDvMachineryApi.Machinery>();
+const barcodeDetailRef = ref<InstanceType<typeof BarcodeDetail>>(); // 条码详情弹窗
+const isDetail = computed(() => formMode.value === 'detail'); // 是否查看模式
+const getTitle = computed(() => {
+  if (formMode.value === 'detail') {
+    return '查看设备';
+  }
+  return formMode.value === 'update' ? '修改设备' : '新增设备';
+});
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-1',
+    labelWidth: 110,
+  },
+  wrapperClass: 'grid-cols-3',
+  layout: 'horizontal',
+  schema: [],
+  showDefaultActions: false,
+});
+
+/** 表单 schema 需要 formApi 引用，所以通过 setState 设置 schema */
+formApi.setState({ schema: useFormSchema(formApi, formMode) });
+
+/** 查看设备条码 */
+function handleBarcode() {
+  if (!formData.value?.id) {
+    return;
+  }
+  barcodeDetailRef.value?.openByBusiness(
+    formData.value.id,
+    BarcodeBizTypeEnum.MACHINERY,
+    formData.value.code,
+    formData.value.name,
+  );
+}
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    if (isDetail.value) {
+      await modalApi.close();
+      return;
+    }
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    const data = (await formApi.getValues()) as MesDvMachineryApi.Machinery;
+    try {
+      await (data.id ? updateMachinery(data) : createMachinery(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();
+    subTabsName.value = 'check';
+    // 加载数据
+    const data = modalApi.getData<{ id?: number; type?: FormMode }>();
+    formMode.value = data?.type || 'create';
+    formApi.setDisabled(formMode.value === 'detail');
+    modalApi.setState({ showConfirmButton: formMode.value !== 'detail' });
+    if (!data?.id) {
+      return;
+    }
+    modalApi.lock();
+    try {
+      formData.value = await getMachinery(data.id);
+      // 设置到 values
+      await formApi.setValues(formData.value);
+    } finally {
+      modalApi.unlock();
+    }
+  },
+});
+</script>
+
+<template>
+  <Modal :title="getTitle" class="w-4/5">
+    <Form class="mx-4" />
+    <ElTabs v-if="formMode !== 'create' && formData?.id" v-model="subTabsName" class="mx-4 mt-4">
+      <ElTabPane label="点检记录" name="check">
+        <CheckRecordList :machinery-id="formData.id" />
+      </ElTabPane>
+      <ElTabPane label="保养记录" name="mainten">
+        <MaintenRecordList :machinery-id="formData.id" />
+      </ElTabPane>
+      <ElTabPane label="维修记录" name="repair">
+        <RepairList :machinery-id="formData.id" />
+      </ElTabPane>
+    </ElTabs>
+    <template #prepend-footer>
+      <div class="flex flex-auto items-center">
+        <ElButton v-if="isDetail && formData?.id" type="primary" @click="handleBarcode">
+          查看条码
+        </ElButton>
+      </div>
+    </template>
+    <BarcodeDetail ref="barcodeDetailRef" />
+  </Modal>
+</template>
diff --git a/apps/web-ele/src/views/mes/dv/machinery/modules/import-form.vue b/apps/web-ele/src/views/mes/dv/machinery/modules/import-form.vue
new file mode 100644
index 000000000..52343051a
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/machinery/modules/import-form.vue
@@ -0,0 +1,93 @@
+<script lang="ts" setup>
+import type { UploadRawFile } from 'element-plus';
+
+import type { MesDvMachineryApi } from '#/api/mes/dv/machinery';
+
+import { useVbenModal } from '@vben/common-ui';
+import { downloadFileFromBlobPart } from '@vben/utils';
+
+import { ElButton, ElMessage, ElUpload } from 'element-plus';
+
+import { useVbenForm } from '#/adapter/form';
+import { importMachinery, importMachineryTemplate } from '#/api/mes/dv/machinery';
+import { $t } from '#/locales';
+
+import { useImportFormSchema } from '../data';
+
+const emit = defineEmits(['success']);
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-2',
+    labelWidth: 120,
+  },
+  layout: 'horizontal',
+  schema: useImportFormSchema(),
+  showDefaultActions: false,
+});
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    const data = await formApi.getValues();
+    try {
+      const result = await importMachinery(data.file, data.updateSupport);
+      const importData = result as MesDvMachineryApi.MachineryImportRespVO;
+      let text = `上传成功数量：${importData.createCodes?.length || 0}；`;
+      text += `更新成功数量：${importData.updateCodes?.length || 0}；`;
+      text += `更新失败数量：${Object.keys(importData.failureCodes || {}).length}；`;
+      ElMessage.info(text);
+      // 关闭并提示
+      await modalApi.close();
+      emit('success');
+      ElMessage.success($t('ui.actionMessage.operationSuccess'));
+    } finally {
+      modalApi.unlock();
+    }
+  },
+});
+
+/** 上传前 */
+function beforeUpload(file: UploadRawFile) {
+  formApi.setFieldValue('file', file);
+  return false;
+}
+
+/** 下载模版 */
+async function handleDownload() {
+  const data = await importMachineryTemplate();
+  downloadFileFromBlobPart({ fileName: '设备导入模板.xls', source: data });
+}
+</script>
+
+<template>
+  <Modal :title="$t('ui.actionTitle.import', ['设备'])" class="w-1/3">
+    <Form class="mx-4">
+      <template #file>
+        <div class="w-full">
+          <ElUpload
+            :auto-upload="false"
+            :before-upload="beforeUpload"
+            :limit="1"
+            accept=".xls,.xlsx"
+          >
+            <ElButton type="primary">选择 Excel 文件</ElButton>
+          </ElUpload>
+        </div>
+      </template>
+    </Form>
+    <template #prepend-footer>
+      <div class="flex flex-auto items-center">
+        <ElButton @click="handleDownload">下载导入模板</ElButton>
+      </div>
+    </template>
+  </Modal>
+</template>
diff --git a/apps/web-ele/src/views/mes/dv/machinery/modules/mainten-record-list.vue b/apps/web-ele/src/views/mes/dv/machinery/modules/mainten-record-list.vue
new file mode 100644
index 000000000..3a8f2e656
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/machinery/modules/mainten-record-list.vue
@@ -0,0 +1,73 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvMaintenRecordApi } from '#/api/mes/dv/maintenrecord';
+
+import { watch } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { getMaintenRecordPage } from '#/api/mes/dv/maintenrecord';
+
+const props = defineProps<{ machineryId: number }>();
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    columns: [
+      { field: 'planName', title: '计划名称', minWidth: 150 },
+      {
+        field: 'planCycleType',
+        title: '周期类型',
+        width: 120,
+        cellRender: {
+          name: 'CellDict',
+          props: { type: DICT_TYPE.MES_DV_CYCLE_TYPE },
+        },
+      },
+      { field: 'maintenTime', title: '保养时间', width: 180, formatter: 'formatDateTime' },
+      { field: 'nickname', title: '操作人', minWidth: 120 },
+      {
+        field: 'status',
+        title: '状态',
+        width: 120,
+        cellRender: {
+          name: 'CellDict',
+          props: { type: DICT_TYPE.MES_MAINTEN_RECORD_STATUS },
+        },
+      },
+    ],
+    height: 320,
+    keepSource: true,
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }) =>
+          await getMaintenRecordPage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            machineryId: props.machineryId,
+          }),
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+    },
+  } as VxeTableGridOptions<MesDvMaintenRecordApi.MaintenRecord>,
+});
+
+watch(
+  () => props.machineryId,
+  (value) => {
+    if (value) {
+      gridApi.query();
+    }
+  },
+);
+</script>
+
+<template>
+  <Grid table-title="保养记录" />
+</template>
diff --git a/apps/web-ele/src/views/mes/dv/machinery/modules/repair-list.vue b/apps/web-ele/src/views/mes/dv/machinery/modules/repair-list.vue
new file mode 100644
index 000000000..efed48449
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/machinery/modules/repair-list.vue
@@ -0,0 +1,74 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvRepairApi } from '#/api/mes/dv/repair';
+
+import { watch } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { getRepairPage } from '#/api/mes/dv/repair';
+
+const props = defineProps<{ machineryId: number }>();
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    columns: [
+      { field: 'code', title: '维修单号', minWidth: 140 },
+      { field: 'name', title: '维修单名称', minWidth: 150 },
+      {
+        field: 'result',
+        title: '维修结果',
+        width: 120,
+        cellRender: {
+          name: 'CellDict',
+          props: { type: DICT_TYPE.MES_DV_REPAIR_RESULT },
+        },
+      },
+      { field: 'requireDate', title: '报修日期', width: 180, formatter: 'formatDateTime' },
+      { field: 'nickname', title: '操作人', minWidth: 120 },
+      {
+        field: 'status',
+        title: '状态',
+        width: 120,
+        cellRender: {
+          name: 'CellDict',
+          props: { type: DICT_TYPE.MES_DV_REPAIR_STATUS },
+        },
+      },
+    ],
+    height: 320,
+    keepSource: true,
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }) =>
+          await getRepairPage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            machineryId: props.machineryId,
+          }),
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+    },
+  } as VxeTableGridOptions<MesDvRepairApi.Repair>,
+});
+
+watch(
+  () => props.machineryId,
+  (value) => {
+    if (value) {
+      gridApi.query();
+    }
+  },
+);
+</script>
+
+<template>
+  <Grid table-title="维修记录" />
+</template>
diff --git a/apps/web-ele/src/views/mes/dv/machinery/type/components/dv-machinery-type-select.vue b/apps/web-ele/src/views/mes/dv/machinery/type/components/dv-machinery-type-select.vue
new file mode 100644
index 000000000..0d3419116
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/machinery/type/components/dv-machinery-type-select.vue
@@ -0,0 +1,113 @@
+<script lang="ts" setup>
+import type { MesDvMachineryTypeApi } from '#/api/mes/dv/machinery/type';
+
+import { computed, onMounted, ref, watch } from 'vue';
+
+import { handleTree } from '@vben/utils';
+
+import { ElTooltip, ElTreeSelect } from 'element-plus';
+
+import { getMachineryTypeSimpleList } from '#/api/mes/dv/machinery/type';
+
+const props = withDefaults(
+  defineProps<{
+    clearable?: boolean;
+    disabled?: boolean;
+    modelValue?: number;
+    placeholder?: string;
+  }>(),
+  {
+    clearable: true,
+    disabled: false,
+    modelValue: undefined,
+    placeholder: '请选择设备类型',
+  },
+);
+
+const emit = defineEmits<{
+  change: [item: MesDvMachineryTypeApi.MachineryType | undefined];
+  'update:modelValue': [value: number | undefined];
+}>();
+
+type MachineryTypeNode = MesDvMachineryTypeApi.MachineryType & {
+  children?: MachineryTypeNode[];
+  disabled?: boolean;
+};
+
+const allList = ref<MesDvMachineryTypeApi.MachineryType[]>([]); // 设备类型列表
+const machineryTypeTree = ref<MachineryTypeNode[]>([]); // 设备类型树
+const selectedItem = ref<MesDvMachineryTypeApi.MachineryType>(); // 选中设备类型
+
+const selectValue = computed({
+  // 选择器绑定值
+  get: () => props.modelValue,
+  set: (value: number | undefined) => {
+    emit('update:modelValue', value);
+  },
+});
+
+/** 递归将有子节点的分支节点标记为 disabled */
+function markParentsDisabled(nodes: MesDvMachineryTypeApi.MachineryType[]): MachineryTypeNode[] {
+  return nodes.map((node) => {
+    const children = node.children?.length ? markParentsDisabled(node.children) : undefined;
+    return { ...node, children, disabled: Boolean(children?.length) };
+  });
+}
+
+/** 根据当前值同步 tooltip 展示的设备类型详情 */
+function syncSelectedItem(value: number | undefined) {
+  selectedItem.value =
+    value === undefined ? undefined : allList.value.find((item) => item.id === value);
+}
+
+/** 除 v-model 外，额外抛出完整设备类型对象给业务表单使用 */
+function handleChange(value: number | undefined) {
+  syncSelectedItem(value);
+  emit('change', selectedItem.value);
+}
+
+/** 查询设备类型树 */
+async function getMachineryTypeTree() {
+  allList.value = await getMachineryTypeSimpleList();
+  machineryTypeTree.value = markParentsDisabled(handleTree(allList.value));
+  syncSelectedItem(props.modelValue);
+}
+
+watch(
+  () => props.modelValue,
+  (value) => {
+    syncSelectedItem(value);
+  },
+);
+
+onMounted(() => {
+  getMachineryTypeTree();
+});
+</script>
+
+<template>
+  <ElTooltip :disabled="!selectedItem" placement="top" :show-after="500">
+    <template #content>
+      <div v-if="selectedItem" class="leading-6">
+        <div>编码：{{ selectedItem.code || '-' }}</div>
+        <div>名称：{{ selectedItem.name || '-' }}</div>
+        <div>备注：{{ selectedItem.remark || '-' }}</div>
+      </div>
+    </template>
+    <ElTreeSelect
+      v-bind="$attrs"
+      v-model="selectValue"
+      :clearable="clearable"
+      :data="machineryTypeTree"
+      :disabled="disabled"
+      :placeholder="placeholder"
+      :props="{ children: 'children', label: 'name' }"
+      check-strictly
+      class="w-full"
+      default-expand-all
+      filterable
+      node-key="id"
+      @change="handleChange"
+    />
+  </ElTooltip>
+</template>
diff --git a/apps/web-ele/src/views/mes/dv/machinery/type/components/index.ts b/apps/web-ele/src/views/mes/dv/machinery/type/components/index.ts
new file mode 100644
index 000000000..c4cff7c14
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/machinery/type/components/index.ts
@@ -0,0 +1,2 @@
+export { default as DvMachineryTypeSelect } from './dv-machinery-type-select.vue';
+export { default as MachineryTypeTree } from './machinery-type-tree.vue';
diff --git a/apps/web-ele/src/views/mes/dv/machinery/type/components/machinery-type-tree.vue b/apps/web-ele/src/views/mes/dv/machinery/type/components/machinery-type-tree.vue
new file mode 100644
index 000000000..88b175a18
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/machinery/type/components/machinery-type-tree.vue
@@ -0,0 +1,95 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvMachineryTypeApi } from '#/api/mes/dv/machinery/type';
+
+import { ref } from 'vue';
+
+import { CommonStatusEnum } from '@vben/constants';
+import { handleTree } from '@vben/utils';
+
+import { ElCard, ElInput } from 'element-plus';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { getMachineryTypeList } from '#/api/mes/dv/machinery/type';
+
+const emit = defineEmits<{
+  nodeClick: [row?: MesDvMachineryTypeApi.MachineryType];
+}>();
+const selectedId = ref<number>(); // 选中设备类型编号
+const searchKeyword = ref(''); // 设备类型搜索关键字
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    autoResize: true,
+    border: false,
+    columns: [{ field: 'name', title: '类型名称', treeNode: true }],
+    height: 'auto',
+    pagerConfig: {
+      enabled: false,
+    },
+    proxyConfig: {
+      ajax: {
+        query: async () =>
+          handleTree(
+            await getMachineryTypeList({
+              name: searchKeyword.value || undefined,
+              status: CommonStatusEnum.ENABLE,
+            }),
+          ),
+      },
+    },
+    rowConfig: {
+      isCurrent: true,
+      isHover: true,
+      keyField: 'id',
+    },
+    showHeader: false,
+    toolbarConfig: {
+      enabled: false,
+    },
+    treeConfig: { parentField: 'parentId', rowField: 'id', transform: true },
+  } as VxeTableGridOptions<MesDvMachineryTypeApi.MachineryType>,
+  gridEvents: {
+    cellClick: ({ row }: { row: MesDvMachineryTypeApi.MachineryType }) => {
+      if (selectedId.value === row.id) {
+        selectedId.value = undefined;
+        gridApi.grid.clearCurrentRow();
+        emit('nodeClick', undefined);
+        return;
+      }
+      selectedId.value = row.id;
+      emit('nodeClick', row);
+    },
+  },
+});
+
+/** 重置选中状态 */
+function reset() {
+  selectedId.value = undefined;
+  searchKeyword.value = '';
+  gridApi.grid.clearCurrentRow();
+  emit('nodeClick', undefined);
+  gridApi.query();
+}
+
+/** 搜索设备类型 */
+function handleSearch() {
+  gridApi.query();
+}
+
+defineExpose({ reset });
+</script>
+
+<template>
+  <ElCard class="h-full" shadow="never">
+    <template #header>设备类型</template>
+    <ElInput
+      v-model="searchKeyword"
+      clearable
+      class="mb-3"
+      placeholder="搜索设备类型"
+      @change="handleSearch"
+    />
+    <Grid class="h-full" />
+  </ElCard>
+</template>
diff --git a/apps/web-ele/src/views/mes/dv/machinery/type/data.ts b/apps/web-ele/src/views/mes/dv/machinery/type/data.ts
new file mode 100644
index 000000000..b63b684a3
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/machinery/type/data.ts
@@ -0,0 +1,170 @@
+import type { VbenFormApi, VbenFormSchema } from '#/adapter/form';
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvMachineryTypeApi } from '#/api/mes/dv/machinery/type';
+
+import { h } from 'vue';
+
+import { CommonStatusEnum, DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+import { handleTree } from '@vben/utils';
+
+import { ElButton } from 'element-plus';
+
+import { z } from '#/adapter/form';
+import { getMachineryTypeList } from '#/api/mes/dv/machinery/type';
+import { generateAutoCode } from '#/api/mes/md/autocode/record';
+import { MesAutoCodeRuleCode } from '#/views/mes/utils/constants';
+
+/** 新增/修改设备类型的表单 */
+export function useFormSchema(formApi?: VbenFormApi): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'parentId',
+      label: '上级类型',
+      component: 'ApiTreeSelect',
+      componentProps: {
+        clearable: true,
+        api: async () => [
+          { id: 0, name: '顶级类型', children: handleTree(await getMachineryTypeList()) },
+        ],
+        childrenField: 'children',
+        labelField: 'name',
+        placeholder: '请选择上级类型',
+        defaultExpandAll: true,
+        valueField: 'id',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'code',
+      label: '类型编码',
+      component: 'Input',
+      componentProps: {
+        maxLength: 64,
+        placeholder: '请输入类型编码',
+      },
+      rules: z.string().min(1, '类型编码不能为空').max(64),
+      suffix: () =>
+        h(
+          ElButton,
+          {
+            type: 'default',
+            onClick: async () => {
+              try {
+                const code = await generateAutoCode(MesAutoCodeRuleCode.DV_MACHINERY_TYPE_CODE);
+                await formApi?.setFieldValue('code', code);
+              } catch (error) {
+                console.error(error);
+              }
+            },
+          },
+          { default: () => '生成' },
+        ),
+    },
+    {
+      fieldName: 'name',
+      label: '类型名称',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入类型名称',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'sort',
+      label: '显示排序',
+      component: 'InputNumber',
+      componentProps: {
+        class: '!w-full',
+        controlsPosition: 'right',
+        min: 0,
+        precision: 0,
+      },
+      rules: z.number().default(0),
+    },
+    {
+      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: '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<MesDvMachineryTypeApi.MachineryType>['columns'] {
+  return [
+    { field: 'name', title: '类型名称', minWidth: 200, align: 'left', treeNode: true },
+    { field: 'code', title: '类型编码', width: 160, align: 'center' },
+    { field: 'sort', title: '排序', width: 100, align: 'center' },
+    {
+      field: 'status',
+      title: '状态',
+      width: 120,
+      align: 'center',
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.COMMON_STATUS },
+      },
+    },
+    {
+      field: 'createTime',
+      title: '创建时间',
+      width: 180,
+      formatter: 'formatDateTime',
+    },
+    {
+      title: '操作',
+      width: 260,
+      fixed: 'right',
+      slots: {
+        default: 'actions',
+      },
+    },
+  ];
+}
diff --git a/apps/web-ele/src/views/mes/dv/machinery/type/index.vue b/apps/web-ele/src/views/mes/dv/machinery/type/index.vue
new file mode 100644
index 000000000..96a81dc2d
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/machinery/type/index.vue
@@ -0,0 +1,162 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvMachineryTypeApi } from '#/api/mes/dv/machinery/type';
+
+import { ref } from 'vue';
+
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
+import { handleTree } from '@vben/utils';
+
+import { ElLoading, ElMessage } from 'element-plus';
+
+import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import { deleteMachineryType, getMachineryTypeList } from '#/api/mes/dv/machinery/type';
+import { $t } from '#/locales';
+
+import { useGridColumns, useGridFormSchema } from './data';
+import Form from './modules/form.vue';
+
+const [FormModal, formModalApi] = useVbenModal({
+  connectedComponent: Form,
+  destroyOnClose: true,
+});
+
+const isExpanded = ref(true); // 树形表格是否展开
+
+/** 切换树形展开/收缩状态 */
+function handleExpand() {
+  isExpanded.value = !isExpanded.value;
+  gridApi.grid.setAllTreeExpand(isExpanded.value);
+}
+
+/** 刷新表格 */
+function handleRefresh() {
+  gridApi.query();
+}
+
+/** 创建设备类型 */
+function handleCreate() {
+  formModalApi.setData(null).open();
+}
+
+/** 添加下级设备类型 */
+function handleAppend(row: MesDvMachineryTypeApi.MachineryType) {
+  formModalApi.setData({ parentId: row.id }).open();
+}
+
+/** 编辑设备类型 */
+function handleEdit(row: MesDvMachineryTypeApi.MachineryType) {
+  formModalApi.setData(row).open();
+}
+
+/** 删除设备类型 */
+async function handleDelete(row: MesDvMachineryTypeApi.MachineryType) {
+  const loadingInstance = ElLoading.service({
+    text: $t('ui.actionMessage.deleting', [row.name]),
+  });
+  try {
+    await deleteMachineryType(row.id!);
+    ElMessage.success($t('ui.actionMessage.deleteSuccess', [row.name]));
+    handleRefresh();
+  } finally {
+    loadingInstance.close();
+  }
+}
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  formOptions: {
+    schema: useGridFormSchema(),
+  },
+  gridOptions: {
+    columns: useGridColumns(),
+    height: 'auto',
+    keepSource: true,
+    pagerConfig: {
+      enabled: false,
+    },
+    proxyConfig: {
+      ajax: { query: async (_, formValues) => handleTree(await getMachineryTypeList(formValues)) },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+    treeConfig: {
+      parentField: 'parentId',
+      rowField: 'id',
+      transform: true,
+      expandAll: true,
+      reserve: true,
+    },
+  } as VxeTableGridOptions<MesDvMachineryTypeApi.MachineryType>,
+});
+</script>
+
+<template>
+  <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【设备】设备类型、设备台账"
+        url="https://doc.iocoder.cn/mes/dv/device/"
+      />
+    </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:dv-machinery-type:create'],
+              onClick: handleCreate,
+            },
+            {
+              label: isExpanded ? '收缩' : '展开',
+              type: 'primary',
+              onClick: handleExpand,
+            },
+          ]"
+        />
+      </template>
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: $t('ui.actionTitle.create', ['下级']),
+              type: 'primary',
+              link: true,
+              icon: ACTION_ICON.ADD,
+              auth: ['mes:dv-machinery-type:create'],
+              onClick: handleAppend.bind(null, row),
+            },
+            {
+              label: $t('common.edit'),
+              type: 'primary',
+              link: true,
+              icon: ACTION_ICON.EDIT,
+              auth: ['mes:dv-machinery-type:update'],
+              onClick: handleEdit.bind(null, row),
+            },
+            {
+              label: $t('common.delete'),
+              type: 'danger',
+              link: true,
+              icon: ACTION_ICON.DELETE,
+              auth: ['mes:dv-machinery-type: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/dv/machinery/type/modules/form.vue b/apps/web-ele/src/views/mes/dv/machinery/type/modules/form.vue
new file mode 100644
index 000000000..5a3aae39c
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/machinery/type/modules/form.vue
@@ -0,0 +1,97 @@
+<script lang="ts" setup>
+import type { MesDvMachineryTypeApi } from '#/api/mes/dv/machinery/type';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { ElMessage } from 'element-plus';
+
+import { useVbenForm } from '#/adapter/form';
+import {
+  createMachineryType,
+  getMachineryType,
+  updateMachineryType,
+} from '#/api/mes/dv/machinery/type';
+import { $t } from '#/locales';
+
+import { useFormSchema } from '../data';
+
+const emit = defineEmits(['success']);
+const formData = ref<MesDvMachineryTypeApi.MachineryType>();
+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: 100,
+  },
+  layout: 'horizontal',
+  schema: [],
+  showDefaultActions: false,
+});
+
+/** 表单 schema 需要 formApi 引用，所以通过 setState 设置 schema */
+formApi.setState({ schema: useFormSchema(formApi) });
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    const data = (await formApi.getValues()) as MesDvMachineryTypeApi.MachineryType;
+    try {
+      await (formData.value?.id
+        ? updateMachineryType(data)
+        : createMachineryType(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<MesDvMachineryTypeApi.MachineryType>();
+    if (!data || !data.id) {
+      formData.value = data || undefined;
+      if (data) {
+        // 设置上级类型
+        await formApi.setValues(data);
+      }
+      return;
+    }
+    modalApi.lock();
+    try {
+      formData.value = await getMachineryType(data.id);
+      // 设置到 values
+      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/dv/maintenrecord/data.ts b/apps/web-ele/src/views/mes/dv/maintenrecord/data.ts
new file mode 100644
index 000000000..e5d6f6116
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/maintenrecord/data.ts
@@ -0,0 +1,166 @@
+import type { VbenFormSchema } from '#/adapter/form';
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvMaintenRecordApi } from '#/api/mes/dv/maintenrecord';
+
+import { markRaw } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
+import { getSimpleUserList } from '#/api/system/user';
+import { getRangePickerDefaultProps } from '#/utils';
+import { DvCheckPlanSelect } from '#/views/mes/dv/checkplan/components';
+import { DvMachinerySelect } from '#/views/mes/dv/machinery/components';
+import {
+  MesDvCheckPlanStatusEnum,
+  MesDvMaintenRecordStatusEnum,
+  MesDvSubjectTypeEnum,
+} from '#/views/mes/utils/constants';
+
+/** 新增/修改保养记录的表单 */
+export function useFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'status',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+      defaultValue: MesDvMaintenRecordStatusEnum.PREPARE,
+    },
+    {
+      fieldName: 'machineryId',
+      label: '设备',
+      component: markRaw(DvMachinerySelect),
+      componentProps: {
+        placeholder: '请选择设备',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'planId',
+      label: '保养计划',
+      component: markRaw(DvCheckPlanSelect),
+      componentProps: {
+        status: MesDvCheckPlanStatusEnum.ENABLED,
+        type: MesDvSubjectTypeEnum.MAINTENANCE,
+        placeholder: '请选择计划',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'userId',
+      label: '保养人',
+      component: 'ApiSelect',
+      componentProps: {
+        clearable: true,
+        api: getSimpleUserList,
+        labelField: 'nickname',
+        placeholder: '请选择保养人',
+        valueField: 'id',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'maintenTime',
+      label: '保养时间',
+      component: 'DatePicker',
+      componentProps: {
+        class: '!w-full',
+        format: 'YYYY-MM-DD HH:mm:ss',
+        placeholder: '请选择保养时间',
+        showTime: true,
+        valueFormat: 'x',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      formItemClass: 'col-span-3',
+      componentProps: {
+        placeholder: '请输入备注',
+        rows: 3,
+      },
+    },
+  ];
+}
+
+/** 列表的搜索表单 */
+export function useGridFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'machineryName',
+      label: '设备名称',
+      component: 'Input',
+      componentProps: {
+        clearable: true,
+        placeholder: '请输入设备名称',
+      },
+    },
+    {
+      fieldName: 'maintenTime',
+      label: '保养时间',
+      component: 'RangePicker',
+      componentProps: {
+        ...getRangePickerDefaultProps(),
+      },
+    },
+    {
+      fieldName: 'status',
+      label: '状态',
+      component: 'Select',
+      componentProps: {
+        clearable: true,
+        options: getDictOptions(DICT_TYPE.MES_MAINTEN_RECORD_STATUS, 'number'),
+        placeholder: '请选择状态',
+      },
+    },
+  ];
+}
+
+/** 列表的字段 */
+export function useGridColumns(): VxeTableGridOptions<MesDvMaintenRecordApi.MaintenRecord>['columns'] {
+  return [
+    { field: 'machineryCode', title: '设备编码', minWidth: 140 },
+    {
+      field: 'machineryName',
+      title: '设备名称',
+      minWidth: 150,
+      slots: {
+        default: 'machineryName',
+      },
+    },
+    { field: 'planName', title: '计划名称', minWidth: 150 },
+    { field: 'maintenTime', title: '保养时间', width: 180, formatter: 'formatDateTime' },
+    { field: 'nickname', title: '保养人', minWidth: 120 },
+    {
+      field: 'status',
+      title: '状态',
+      width: 120,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_MAINTEN_RECORD_STATUS },
+      },
+    },
+    { field: 'createTime', title: '创建时间', width: 180, formatter: 'formatDateTime' },
+    {
+      title: '操作',
+      width: 200,
+      fixed: 'right',
+      slots: {
+        default: 'actions',
+      },
+    },
+  ];
+}
diff --git a/apps/web-ele/src/views/mes/dv/maintenrecord/index.vue b/apps/web-ele/src/views/mes/dv/maintenrecord/index.vue
new file mode 100644
index 000000000..b2d7045c9
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/maintenrecord/index.vue
@@ -0,0 +1,166 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvMaintenRecordApi } from '#/api/mes/dv/maintenrecord';
+
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
+import { downloadFileFromBlobPart } from '@vben/utils';
+
+import { ElButton, ElLoading, ElMessage } from 'element-plus';
+
+import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import {
+  deleteMaintenRecord,
+  exportMaintenRecord,
+  getMaintenRecordPage,
+} from '#/api/mes/dv/maintenrecord';
+import { $t } from '#/locales';
+import { MesDvMaintenRecordStatusEnum } from '#/views/mes/utils/constants';
+
+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({ type: 'create' }).open();
+}
+
+/** 查看保养记录 */
+function handleDetail(row: MesDvMaintenRecordApi.MaintenRecord) {
+  formModalApi.setData({ id: row.id, type: 'detail' }).open();
+}
+
+/** 编辑保养记录 */
+function handleEdit(row: MesDvMaintenRecordApi.MaintenRecord) {
+  formModalApi.setData({ id: row.id, type: 'update' }).open();
+}
+
+/** 删除保养记录 */
+async function handleDelete(row: MesDvMaintenRecordApi.MaintenRecord) {
+  const hideLoading = ElLoading.service({
+    text: $t('ui.actionMessage.deleting', [row.machineryName]),
+  });
+  try {
+    await deleteMaintenRecord(row.id!);
+    ElMessage.success($t('ui.actionMessage.deleteSuccess', [row.machineryName]));
+    handleRefresh();
+  } finally {
+    hideLoading.close();
+  }
+}
+
+/** 导出保养记录 */
+async function handleExport() {
+  const data = await exportMaintenRecord(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) =>
+          await getMaintenRecordPage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            ...formValues,
+          }),
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+  } as VxeTableGridOptions<MesDvMaintenRecordApi.MaintenRecord>,
+});
+</script>
+<template>
+  <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【设备】点检记录、保养记录、维修单"
+        url="https://doc.iocoder.cn/mes/dv/check-record/"
+      />
+    </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:dv-mainten-record:create'],
+              onClick: handleCreate,
+            },
+            {
+              label: $t('ui.actionTitle.export'),
+              type: 'primary',
+              icon: ACTION_ICON.DOWNLOAD,
+              auth: ['mes:dv-mainten-record:export'],
+              onClick: handleExport,
+            },
+          ]"
+        />
+      </template>
+      <template #machineryName="{ row }">
+        <ElButton link type="primary" @click="handleDetail(row)">{{ row.machineryName }}</ElButton>
+      </template>
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: $t('common.edit'),
+              type: 'primary',
+              link: true,
+              icon: ACTION_ICON.EDIT,
+              auth: ['mes:dv-mainten-record:update'],
+              onClick: handleEdit.bind(null, row),
+              ifShow: row.status === MesDvMaintenRecordStatusEnum.PREPARE,
+            },
+            {
+              label: $t('common.delete'),
+              type: 'danger',
+              link: true,
+              icon: ACTION_ICON.DELETE,
+              auth: ['mes:dv-mainten-record:delete'],
+              popConfirm: {
+                title: $t('ui.actionMessage.deleteConfirm', [row.machineryName]),
+                confirm: handleDelete.bind(null, row),
+              },
+              ifShow: row.status === MesDvMaintenRecordStatusEnum.PREPARE,
+            },
+            {
+              label: $t('common.detail'),
+              type: 'primary',
+              link: true,
+              icon: ACTION_ICON.VIEW,
+              auth: ['mes:dv-mainten-record:query'],
+              onClick: handleDetail.bind(null, row),
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+  </Page>
+</template>
diff --git a/apps/web-ele/src/views/mes/dv/maintenrecord/modules/form.vue b/apps/web-ele/src/views/mes/dv/maintenrecord/modules/form.vue
new file mode 100644
index 000000000..2aa64705f
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/maintenrecord/modules/form.vue
@@ -0,0 +1,152 @@
+<script lang="ts" setup>
+import type { MesDvMaintenRecordApi } from '#/api/mes/dv/maintenrecord';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+import { useUserStore } from '@vben/stores';
+
+import { ElButton, ElMessage, ElPopconfirm } from 'element-plus';
+
+import { useVbenForm } from '#/adapter/form';
+import {
+  createMaintenRecord,
+  getMaintenRecord,
+  submitMaintenRecord,
+  updateMaintenRecord,
+} from '#/api/mes/dv/maintenrecord';
+import { $t } from '#/locales';
+import { MesDvMaintenRecordStatusEnum } from '#/views/mes/utils/constants';
+
+import { useFormSchema } from '../data';
+import LineList from './line-list.vue';
+
+type FormMode = 'create' | 'detail' | 'update';
+
+const emit = defineEmits(['success']);
+const userStore = useUserStore();
+const formMode = ref<FormMode>('create');
+const formData = ref<MesDvMaintenRecordApi.MaintenRecord>();
+const isDetail = computed(() => formMode.value === 'detail');
+const canSubmit = computed(
+  () =>
+    formMode.value === 'update' && formData.value?.status === MesDvMaintenRecordStatusEnum.PREPARE,
+);
+const getTitle = computed(() => {
+  if (formMode.value === 'detail') {
+    return '查看保养记录';
+  }
+  return formMode.value === 'update' ? '修改保养记录' : '新增保养记录';
+});
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-1',
+    labelWidth: 100,
+  },
+  wrapperClass: 'grid-cols-3',
+  layout: 'horizontal',
+  schema: useFormSchema(),
+  showDefaultActions: false,
+});
+
+/** 提交保养记录 */
+async function handleSubmit() {
+  const { valid } = await formApi.validate();
+  if (!valid || !formData.value?.id) {
+    return;
+  }
+
+  modalApi.lock();
+  try {
+    await updateMaintenRecord((await formApi.getValues()) as MesDvMaintenRecordApi.MaintenRecord);
+    await submitMaintenRecord(formData.value.id);
+    await modalApi.close();
+    emit('success');
+    ElMessage.success('提交成功');
+  } finally {
+    modalApi.unlock();
+  }
+}
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    if (isDetail.value) {
+      await modalApi.close();
+      return;
+    }
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    const data = (await formApi.getValues()) as MesDvMaintenRecordApi.MaintenRecord;
+    try {
+      if (formMode.value === 'create') {
+        const id = await createMaintenRecord(data);
+        formData.value = {
+          ...data,
+          id: id as number,
+          status: MesDvMaintenRecordStatusEnum.PREPARE,
+        };
+        await formApi.setFieldValue('id', id);
+        formMode.value = 'update';
+      } else {
+        await updateMaintenRecord(data);
+        formData.value = { ...formData.value, ...data };
+      }
+      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; type?: FormMode }>();
+    formMode.value = data?.type || 'create';
+    formApi.setDisabled(formMode.value === 'detail');
+    modalApi.setState({ showConfirmButton: formMode.value !== 'detail' });
+    if (!data?.id) {
+      await formApi.setFieldValue('userId', userStore.userInfo?.id);
+      return;
+    }
+    modalApi.lock();
+    try {
+      formData.value = await getMaintenRecord(data.id);
+      // 设置到 values
+      await formApi.setValues(formData.value);
+    } finally {
+      modalApi.unlock();
+    }
+  },
+});
+</script>
+<template>
+  <Modal :title="getTitle" class="w-4/5">
+    <Form class="mx-4" />
+    <LineList v-if="formData?.id" :disabled="isDetail" :record-id="formData.id" />
+    <template #prepend-footer>
+      <div class="flex flex-auto items-center">
+        <ElPopconfirm
+          v-if="canSubmit"
+          title="确认提交该保养记录？提交后将不能修改。"
+          @confirm="handleSubmit"
+        >
+          <template #reference>
+            <ElButton type="primary">提交</ElButton>
+          </template>
+        </ElPopconfirm>
+      </div>
+    </template>
+  </Modal>
+</template>
diff --git a/apps/web-ele/src/views/mes/dv/maintenrecord/modules/line-list.vue b/apps/web-ele/src/views/mes/dv/maintenrecord/modules/line-list.vue
new file mode 100644
index 000000000..1599cd0c6
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/maintenrecord/modules/line-list.vue
@@ -0,0 +1,236 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvMaintenRecordLineApi } from '#/api/mes/dv/maintenrecord/line';
+
+import { computed, ref, watch } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
+import { ElButton, ElDialog, ElMessage } from 'element-plus';
+
+import { useVbenForm } from '#/adapter/form';
+import { TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import {
+  createMaintenRecordLine,
+  deleteMaintenRecordLine,
+  getMaintenRecordLine,
+  getMaintenRecordLinePage,
+  updateMaintenRecordLine,
+} from '#/api/mes/dv/maintenrecord/line';
+import { $t } from '#/locales';
+import { DvSubjectSelect } from '#/views/mes/dv/subject/components';
+import { MesDvMaintenStatusEnum, MesDvSubjectTypeEnum } from '#/views/mes/utils/constants';
+
+const props = defineProps<{ disabled?: boolean; recordId: number }>();
+const formOpen = ref(false);
+const formLoading = ref(false);
+const lineFormType = ref<'create' | 'update'>('create');
+const formTitle = computed(() => (lineFormType.value === 'create' ? '添加明细' : '修改明细'));
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-2',
+    labelWidth: 90,
+  },
+  layout: 'horizontal',
+  schema: [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'recordId',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'subjectId',
+      label: '项目',
+      component: DvSubjectSelect,
+      componentProps: {
+        type: MesDvSubjectTypeEnum.MAINTENANCE,
+        placeholder: '请选择项目',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'status',
+      label: '结果',
+      component: 'RadioGroup',
+      componentProps: {
+        options: getDictOptions(DICT_TYPE.MES_MAINTEN_STATUS, 'number'),
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'result',
+      label: '异常描述',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入异常描述',
+        rows: 3,
+      },
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入备注',
+        rows: 2,
+      },
+    },
+  ],
+  showDefaultActions: false,
+});
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    columns: [
+      { field: 'subjectName', title: '项目名称', minWidth: 150 },
+      { field: 'subjectContent', title: '项目内容', minWidth: 160 },
+      { field: 'subjectStandard', title: '项目标准', minWidth: 160 },
+      {
+        field: 'status',
+        title: '结果',
+        width: 120,
+        cellRender: {
+          name: 'CellDict',
+          props: { type: DICT_TYPE.MES_MAINTEN_STATUS },
+        },
+      },
+      { field: 'result', title: '异常描述', minWidth: 160 },
+      {
+        title: '操作',
+        width: 130,
+        fixed: 'right',
+        slots: {
+          default: 'actions',
+        },
+        visible: !props.disabled,
+      },
+    ],
+    height: 320,
+    keepSource: true,
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }) =>
+          await getMaintenRecordLinePage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            recordId: props.recordId,
+          }),
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+    },
+  } as VxeTableGridOptions<MesDvMaintenRecordLineApi.MaintenRecordLine>,
+});
+
+/** 打开保养明细表单 */
+async function openForm(
+  type: 'create' | 'update',
+  row?: MesDvMaintenRecordLineApi.MaintenRecordLine,
+) {
+  formOpen.value = true;
+  lineFormType.value = type;
+  await formApi.resetForm();
+  await formApi.setValues(
+    row
+      ? await getMaintenRecordLine(row.id!)
+      : {
+          recordId: props.recordId,
+          status: MesDvMaintenStatusEnum.NORMAL,
+          result: '',
+          remark: '',
+        },
+  );
+}
+
+/** 提交保养明细表单 */
+async function submitForm() {
+  const { valid } = await formApi.validate();
+  if (!valid) {
+    return;
+  }
+  formLoading.value = true;
+  try {
+    const data = (await formApi.getValues()) as MesDvMaintenRecordLineApi.MaintenRecordLine;
+    await (data.id ? updateMaintenRecordLine(data) : createMaintenRecordLine(data));
+    formOpen.value = false;
+    ElMessage.success($t('ui.actionMessage.operationSuccess'));
+    await gridApi.query();
+  } finally {
+    formLoading.value = false;
+  }
+}
+
+/** 删除保养明细 */
+async function handleDelete(id: number) {
+  await deleteMaintenRecordLine(id);
+  ElMessage.success($t('ui.actionMessage.deleteSuccess', ['明细']));
+  await gridApi.query();
+}
+watch(
+  () => props.recordId,
+  (value) => {
+    if (value) {
+      gridApi.query();
+    }
+  },
+);
+</script>
+<template>
+  <div class="mx-4 mt-4">
+    <div v-if="!disabled" class="mb-3">
+      <TableAction
+        :actions="[{ label: '添加明细', type: 'primary', onClick: openForm.bind(null, 'create') }]"
+      />
+    </div>
+    <Grid table-title="明细列表">
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: '编辑',
+              type: 'primary',
+              link: true,
+              onClick: openForm.bind(null, 'update', row),
+            },
+            {
+              label: '删除',
+              type: 'danger',
+              link: true,
+              popConfirm: {
+                title: '确认删除该明细吗？',
+                confirm: handleDelete.bind(null, row.id!),
+              },
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+    <ElDialog v-model="formOpen" :title="formTitle" width="620px">
+      <Form class="mx-4" />
+      <template #footer>
+        <ElButton @click="formOpen = false">取消</ElButton>
+        <ElButton type="primary" :loading="formLoading" @click="submitForm">确定</ElButton>
+      </template>
+    </ElDialog>
+  </div>
+</template>
diff --git a/apps/web-ele/src/views/mes/dv/repair/data.ts b/apps/web-ele/src/views/mes/dv/repair/data.ts
new file mode 100644
index 000000000..9b027fb42
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/repair/data.ts
@@ -0,0 +1,268 @@
+import type { VbenFormApi, VbenFormSchema } from '#/adapter/form';
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvRepairApi } from '#/api/mes/dv/repair';
+
+import { h, markRaw } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
+import { ElButton } from 'element-plus';
+
+import { generateAutoCode } from '#/api/mes/md/autocode/record';
+import { getSimpleUserList } from '#/api/system/user';
+import { getRangePickerDefaultProps } from '#/utils';
+import { DvMachinerySelect } from '#/views/mes/dv/machinery/components';
+import { MesAutoCodeRuleCode, MesDvRepairStatusEnum } from '#/views/mes/utils/constants';
+/** 新增/修改维修工单的表单 */
+export function useFormSchema(formApi?: VbenFormApi): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'status',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+      defaultValue: MesDvRepairStatusEnum.PREPARE,
+    },
+    {
+      fieldName: 'code',
+      label: '维修单编码',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入维修单编码',
+      },
+      dependencies: {
+        triggerFields: ['id'],
+        componentProps: (values) => ({ disabled: !!values.id }),
+      },
+      rules: 'required',
+      suffix: () =>
+        h(
+          ElButton,
+          {
+            type: 'default',
+            onClick: async () => {
+              try {
+                const code = await generateAutoCode(MesAutoCodeRuleCode.DV_REPAIR_CODE);
+                await formApi?.setFieldValue('code', code);
+              } catch (error) {
+                console.error(error);
+              }
+            },
+          },
+          { default: () => '生成' },
+        ),
+    },
+    {
+      fieldName: 'name',
+      label: '维修单名称',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入维修单名称',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'machineryId',
+      label: '设备',
+      component: markRaw(DvMachinerySelect),
+      componentProps: {
+        placeholder: '请选择设备',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'requireDate',
+      label: '报修日期',
+      component: 'DatePicker',
+      componentProps: {
+        class: '!w-full',
+        format: 'YYYY-MM-DD HH:mm:ss',
+        placeholder: '请选择报修日期',
+        showTime: true,
+        valueFormat: 'x',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'acceptedUserId',
+      label: '维修人',
+      component: 'ApiSelect',
+      componentProps: {
+        clearable: true,
+        api: getSimpleUserList,
+        labelField: 'nickname',
+        placeholder: '请选择维修人',
+        valueField: 'id',
+      },
+    },
+    {
+      fieldName: 'finishDate',
+      label: '维修完成日期',
+      component: 'DatePicker',
+      componentProps: {
+        class: '!w-full',
+        format: 'YYYY-MM-DD HH:mm:ss',
+        placeholder: '请选择完成日期',
+        showTime: true,
+        valueFormat: 'x',
+      },
+    },
+    {
+      fieldName: 'confirmUserId',
+      label: '验收人',
+      component: 'ApiSelect',
+      componentProps: {
+        clearable: true,
+        api: getSimpleUserList,
+        labelField: 'nickname',
+        placeholder: '请选择验收人',
+        valueField: 'id',
+      },
+    },
+    {
+      fieldName: 'confirmDate',
+      label: '验收日期',
+      component: 'DatePicker',
+      componentProps: {
+        class: '!w-full',
+        format: 'YYYY-MM-DD HH:mm:ss',
+        placeholder: '请选择验收日期',
+        showTime: true,
+        valueFormat: 'x',
+      },
+    },
+    {
+      fieldName: 'result',
+      label: '维修结果',
+      component: 'RadioGroup',
+      componentProps: {
+        options: getDictOptions(DICT_TYPE.MES_DV_REPAIR_RESULT, 'number'),
+      },
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      formItemClass: 'col-span-3',
+      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: 'machineryName',
+      label: '设备名称',
+      component: 'Input',
+      componentProps: {
+        clearable: true,
+        placeholder: '请输入设备名称',
+      },
+    },
+    {
+      fieldName: 'requireDate',
+      label: '报修日期',
+      component: 'RangePicker',
+      componentProps: {
+        ...getRangePickerDefaultProps(),
+      },
+    },
+    {
+      fieldName: 'result',
+      label: '维修结果',
+      component: 'Select',
+      componentProps: {
+        clearable: true,
+        options: getDictOptions(DICT_TYPE.MES_DV_REPAIR_RESULT, 'number'),
+        placeholder: '请选择维修结果',
+      },
+    },
+    {
+      fieldName: 'status',
+      label: '状态',
+      component: 'Select',
+      componentProps: {
+        clearable: true,
+        options: getDictOptions(DICT_TYPE.MES_DV_REPAIR_STATUS, 'number'),
+        placeholder: '请选择状态',
+      },
+    },
+  ];
+}
+/** 列表的字段 */
+export function useGridColumns(): VxeTableGridOptions<MesDvRepairApi.Repair>['columns'] {
+  return [
+    {
+      field: 'code',
+      title: '维修单编码',
+      minWidth: 140,
+      slots: {
+        default: 'code',
+      },
+    },
+    { field: 'name', title: '维修单名称', minWidth: 150 },
+    { field: 'machineryName', title: '设备名称', minWidth: 150 },
+    { field: 'requireDate', title: '报修日期', width: 180, formatter: 'formatDateTime' },
+    { field: 'finishDate', title: '完成日期', width: 180, formatter: 'formatDateTime' },
+    {
+      field: 'result',
+      title: '维修结果',
+      width: 120,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_DV_REPAIR_RESULT },
+      },
+    },
+    {
+      field: 'status',
+      title: '状态',
+      width: 120,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_DV_REPAIR_STATUS },
+      },
+    },
+    { field: 'createTime', title: '创建时间', width: 180, formatter: 'formatDateTime' },
+    {
+      title: '操作',
+      width: 260,
+      fixed: 'right',
+      slots: {
+        default: 'actions',
+      },
+    },
+  ];
+}
diff --git a/apps/web-ele/src/views/mes/dv/repair/index.vue b/apps/web-ele/src/views/mes/dv/repair/index.vue
new file mode 100644
index 000000000..0b765e81b
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/repair/index.vue
@@ -0,0 +1,182 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvRepairApi } from '#/api/mes/dv/repair';
+
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
+import { downloadFileFromBlobPart } from '@vben/utils';
+
+import { ElButton, ElLoading, ElMessage } from 'element-plus';
+
+import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import { deleteRepair, exportRepair, getRepairPage } from '#/api/mes/dv/repair';
+import { $t } from '#/locales';
+import { MesDvRepairStatusEnum } from '#/views/mes/utils/constants';
+
+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({ type: 'create' }).open();
+}
+
+/** 查看维修工单 */
+function handleDetail(row: MesDvRepairApi.Repair) {
+  formModalApi.setData({ id: row.id, type: 'detail' }).open();
+}
+
+/** 编辑维修工单 */
+function handleEdit(row: MesDvRepairApi.Repair) {
+  formModalApi.setData({ id: row.id, type: 'update' }).open();
+}
+
+/** 完成维修 */
+function handleConfirm(row: MesDvRepairApi.Repair) {
+  formModalApi.setData({ id: row.id, type: 'confirm' }).open();
+}
+
+/** 验收维修 */
+function handleFinish(row: MesDvRepairApi.Repair) {
+  formModalApi.setData({ id: row.id, type: 'finish' }).open();
+}
+
+/** 删除维修工单 */
+async function handleDelete(row: MesDvRepairApi.Repair) {
+  const hideLoading = ElLoading.service({ text: $t('ui.actionMessage.deleting', [row.name]) });
+  try {
+    await deleteRepair(row.id!);
+    ElMessage.success($t('ui.actionMessage.deleteSuccess', [row.name]));
+    handleRefresh();
+  } finally {
+    hideLoading.close();
+  }
+}
+
+/** 导出维修工单 */
+async function handleExport() {
+  const data = await exportRepair(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) =>
+          await getRepairPage({ pageNo: page.currentPage, pageSize: page.pageSize, ...formValues }),
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+  } as VxeTableGridOptions<MesDvRepairApi.Repair>,
+});
+</script>
+<template>
+  <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【设备】点检记录、保养记录、维修单"
+        url="https://doc.iocoder.cn/mes/dv/check-record/"
+      />
+    </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:dv-repair:create'],
+              onClick: handleCreate,
+            },
+            {
+              label: $t('ui.actionTitle.export'),
+              type: 'primary',
+              icon: ACTION_ICON.DOWNLOAD,
+              auth: ['mes:dv-repair:export'],
+              onClick: handleExport,
+            },
+          ]"
+        />
+      </template>
+      <template #code="{ row }">
+        <ElButton link type="primary" @click="handleDetail(row)">{{ row.code }}</ElButton>
+      </template>
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: $t('common.edit'),
+              type: 'primary',
+              link: true,
+              icon: ACTION_ICON.EDIT,
+              auth: ['mes:dv-repair:update'],
+              ifShow: row.status === MesDvRepairStatusEnum.PREPARE,
+              onClick: handleEdit.bind(null, row),
+            },
+            {
+              label: $t('common.delete'),
+              type: 'danger',
+              link: true,
+              icon: ACTION_ICON.DELETE,
+              auth: ['mes:dv-repair:delete'],
+              ifShow: row.status === MesDvRepairStatusEnum.PREPARE,
+              popConfirm: {
+                title: $t('ui.actionMessage.deleteConfirm', [row.name]),
+                confirm: handleDelete.bind(null, row),
+              },
+            },
+            {
+              label: '完成维修',
+              type: 'warning',
+              link: true,
+              auth: ['mes:dv-repair:update'],
+              ifShow: row.status === MesDvRepairStatusEnum.CONFIRMED,
+              onClick: handleConfirm.bind(null, row),
+            },
+            {
+              label: '验收',
+              type: 'warning',
+              link: true,
+              auth: ['mes:dv-repair:update'],
+              ifShow: row.status === MesDvRepairStatusEnum.APPROVING,
+              onClick: handleFinish.bind(null, row),
+            },
+            {
+              label: $t('common.detail'),
+              type: 'primary',
+              link: true,
+              icon: ACTION_ICON.VIEW,
+              auth: ['mes:dv-repair:query'],
+              onClick: handleDetail.bind(null, row),
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+  </Page>
+</template>
diff --git a/apps/web-ele/src/views/mes/dv/repair/modules/form.vue b/apps/web-ele/src/views/mes/dv/repair/modules/form.vue
new file mode 100644
index 000000000..a50e83cdb
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/repair/modules/form.vue
@@ -0,0 +1,232 @@
+<script lang="ts" setup>
+import type { MesDvRepairApi } from '#/api/mes/dv/repair';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { ElButton, ElMessage, ElPopconfirm } from 'element-plus';
+
+import { useVbenForm } from '#/adapter/form';
+import {
+  confirmRepair,
+  createRepair,
+  finishRepair,
+  getRepair,
+  submitRepair,
+  updateRepair,
+} from '#/api/mes/dv/repair';
+import { $t } from '#/locales';
+import { MesDvRepairResultEnum, MesDvRepairStatusEnum } from '#/views/mes/utils/constants';
+
+import { useFormSchema } from '../data';
+import LineList from './line-list.vue';
+
+type FormMode = 'confirm' | 'create' | 'detail' | 'finish' | 'update';
+
+const emit = defineEmits(['success']);
+const formMode = ref<FormMode>('create');
+const formData = ref<MesDvRepairApi.Repair>();
+const isDetail = computed(() => formMode.value === 'detail');
+const isReadonly = computed(() => ['confirm', 'detail', 'finish'].includes(formMode.value));
+const canSubmit = computed(
+  () => formMode.value === 'update' && formData.value?.status === MesDvRepairStatusEnum.PREPARE,
+);
+const getTitle = computed(
+  () =>
+    ({
+      create: '新增维修工单',
+      update: '修改维修工单',
+      confirm: '完成维修',
+      finish: '验收维修',
+      detail: '查看维修工单',
+    })[formMode.value],
+);
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-1',
+    labelWidth: 110,
+  },
+  wrapperClass: 'grid-cols-3',
+  layout: 'horizontal',
+  schema: [],
+  showDefaultActions: false,
+});
+
+/** 表单 schema 需要 formApi 引用，所以通过 setState 设置 schema */
+formApi.setState({ schema: useFormSchema(formApi) });
+
+/** 提交维修工单 */
+async function handleSubmit() {
+  const { valid } = await formApi.validate();
+  if (!valid || !formData.value?.id) {
+    return;
+  }
+  await doSubmit();
+}
+
+/** 执行维修工单提交 */
+async function doSubmit() {
+  modalApi.lock();
+  try {
+    await updateRepair((await formApi.getValues()) as MesDvRepairApi.Repair);
+    await submitRepair(formData.value!.id!);
+    await modalApi.close();
+    emit('success');
+    ElMessage.success('提交成功');
+  } finally {
+    modalApi.unlock();
+  }
+}
+
+/** 完成维修 */
+async function handleConfirm() {
+  const { valid } = await formApi.validate();
+  if (!valid || !formData.value?.id) {
+    return;
+  }
+  const values = (await formApi.getValues()) as MesDvRepairApi.Repair;
+  await doConfirm(values);
+}
+
+/** 执行完成维修 */
+async function doConfirm(values: MesDvRepairApi.Repair) {
+  modalApi.lock();
+  try {
+    await confirmRepair({
+      id: formData.value!.id,
+      finishDate: values.finishDate,
+    });
+    await modalApi.close();
+    emit('success');
+    ElMessage.success($t('ui.actionMessage.operationSuccess'));
+  } finally {
+    modalApi.unlock();
+  }
+}
+
+/** 验收维修 */
+async function handleFinish(result: number) {
+  if (!formData.value?.id) {
+    return;
+  }
+  await doFinish(result);
+}
+
+/** 执行维修验收 */
+async function doFinish(result: number) {
+  modalApi.lock();
+  try {
+    await finishRepair(formData.value!.id!, result);
+    await modalApi.close();
+    emit('success');
+    ElMessage.success($t('ui.actionMessage.operationSuccess'));
+  } finally {
+    modalApi.unlock();
+  }
+}
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    if (isDetail.value || formMode.value === 'confirm' || formMode.value === 'finish') {
+      await modalApi.close();
+      return;
+    }
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    const data = (await formApi.getValues()) as MesDvRepairApi.Repair;
+    try {
+      if (formMode.value === 'create') {
+        const id = await createRepair(data);
+        formData.value = { ...data, id: id as number, status: MesDvRepairStatusEnum.PREPARE };
+        await formApi.setFieldValue('id', id);
+        formMode.value = 'update';
+      } else {
+        await updateRepair(data);
+        formData.value = { ...formData.value, ...data };
+      }
+      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; type?: FormMode }>();
+    formMode.value = data?.type || 'create';
+    formApi.setDisabled(isReadonly.value);
+    modalApi.setState({ showConfirmButton: ['create', 'update'].includes(formMode.value) });
+    if (!data?.id) {
+      return;
+    }
+    modalApi.lock();
+    try {
+      formData.value = await getRepair(data.id);
+      // 设置到 values
+      await formApi.setValues(formData.value);
+    } finally {
+      modalApi.unlock();
+    }
+  },
+});
+</script>
+<template>
+  <Modal :title="getTitle" class="w-4/5">
+    <Form class="mx-4" />
+    <LineList v-if="formData?.id" :disabled="isReadonly" :repair-id="formData.id" />
+    <template #prepend-footer>
+      <div class="flex flex-auto items-center gap-2">
+        <ElPopconfirm
+          v-if="canSubmit"
+          title="确认提交该维修工单？提交后将不能修改。"
+          @confirm="handleSubmit"
+        >
+          <template #reference>
+            <ElButton type="primary">提交</ElButton>
+          </template>
+        </ElPopconfirm>
+        <ElPopconfirm
+          v-if="formMode === 'confirm'"
+          title="确认完成维修？完成后进入待验收。"
+          @confirm="handleConfirm"
+        >
+          <template #reference>
+            <ElButton type="primary">完成维修</ElButton>
+          </template>
+        </ElPopconfirm>
+        <ElPopconfirm
+          v-if="formMode === 'finish'"
+          title="确认完成验收？"
+          @confirm="handleFinish(MesDvRepairResultEnum.PASS)"
+        >
+          <template #reference>
+            <ElButton type="primary">验收通过</ElButton>
+          </template>
+        </ElPopconfirm>
+        <ElPopconfirm
+          v-if="formMode === 'finish'"
+          title="确认完成验收？"
+          @confirm="handleFinish(MesDvRepairResultEnum.FAIL)"
+        >
+          <template #reference>
+            <ElButton>不通过</ElButton>
+          </template>
+        </ElPopconfirm>
+      </div>
+    </template>
+  </Modal>
+</template>
diff --git a/apps/web-ele/src/views/mes/dv/repair/modules/line-list.vue b/apps/web-ele/src/views/mes/dv/repair/modules/line-list.vue
new file mode 100644
index 000000000..c0eb315de
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/repair/modules/line-list.vue
@@ -0,0 +1,236 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvRepairLineApi } from '#/api/mes/dv/repair/line';
+
+import { computed, ref, watch } from 'vue';
+
+import { ElButton, ElDialog, ElMessage } from 'element-plus';
+
+import { useVbenForm } from '#/adapter/form';
+import { TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import {
+  createRepairLine,
+  deleteRepairLine,
+  getRepairLine,
+  getRepairLinePage,
+  updateRepairLine,
+} from '#/api/mes/dv/repair/line';
+import { $t } from '#/locales';
+import { DvSubjectSelect } from '#/views/mes/dv/subject/components';
+
+const props = defineProps<{ disabled?: boolean; repairId: number }>();
+const formOpen = ref(false);
+const formLoading = ref(false);
+const lineFormType = ref<'create' | 'update'>('create');
+const formTitle = computed(() =>
+  lineFormType.value === 'create' ? '添加维修项目' : '修改维修项目',
+);
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-2',
+    labelWidth: 90,
+  },
+  layout: 'horizontal',
+  schema: [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'repairId',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'subjectId',
+      label: '项目',
+      component: DvSubjectSelect,
+      componentProps: {
+        placeholder: '请选择项目',
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'malfunction',
+      label: '故障描述',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入故障描述',
+        rows: 3,
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'malfunctionUrl',
+      label: '故障图片',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入故障图片 URL',
+      },
+    },
+    {
+      fieldName: 'description',
+      label: '维修描述',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入维修描述',
+        rows: 3,
+      },
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      componentProps: {
+        placeholder: '请输入备注',
+        rows: 2,
+      },
+    },
+  ],
+  showDefaultActions: false,
+});
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    columns: [
+      { field: 'subjectName', title: '项目名称', minWidth: 150 },
+      { field: 'subjectContent', title: '项目内容', minWidth: 160 },
+      { field: 'subjectStandard', title: '项目标准', minWidth: 160 },
+      { field: 'malfunction', title: '故障描述', minWidth: 180 },
+      { field: 'malfunctionUrl', title: '故障图片', minWidth: 180 },
+      { field: 'description', title: '维修描述', minWidth: 180 },
+      {
+        title: '操作',
+        width: 130,
+        fixed: 'right',
+        slots: {
+          default: 'actions',
+        },
+        visible: !props.disabled,
+      },
+    ],
+    height: 320,
+    keepSource: true,
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }) =>
+          await getRepairLinePage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            repairId: props.repairId,
+          }),
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+    },
+  } as VxeTableGridOptions<MesDvRepairLineApi.RepairLine>,
+});
+
+/** 打开维修明细表单 */
+async function openForm(type: 'create' | 'update', row?: MesDvRepairLineApi.RepairLine) {
+  formOpen.value = true;
+  lineFormType.value = type;
+  await formApi.resetForm();
+  await formApi.setValues(
+    row
+      ? await getRepairLine(row.id!)
+      : {
+          repairId: props.repairId,
+          malfunction: '',
+          malfunctionUrl: '',
+          description: '',
+          remark: '',
+        },
+  );
+}
+
+/** 提交维修明细表单 */
+async function submitForm() {
+  const { valid } = await formApi.validate();
+  if (!valid) {
+    return;
+  }
+  formLoading.value = true;
+  try {
+    const data = (await formApi.getValues()) as MesDvRepairLineApi.RepairLine;
+    await (data.id ? updateRepairLine(data) : createRepairLine(data));
+    formOpen.value = false;
+    ElMessage.success($t('ui.actionMessage.operationSuccess'));
+    await gridApi.query();
+  } finally {
+    formLoading.value = false;
+  }
+}
+
+/** 删除维修明细 */
+async function handleDelete(id: number) {
+  await deleteRepairLine(id);
+  ElMessage.success($t('ui.actionMessage.deleteSuccess', ['维修项目']));
+  await gridApi.query();
+}
+watch(
+  () => props.repairId,
+  (value) => {
+    if (value) {
+      gridApi.query();
+    }
+  },
+);
+</script>
+<template>
+  <div class="mx-4 mt-4">
+    <div v-if="!disabled" class="mb-3">
+      <TableAction
+        :actions="[
+          { label: '添加维修项目', type: 'primary', onClick: openForm.bind(null, 'create') },
+        ]"
+      />
+    </div>
+    <Grid table-title="维修项目明细">
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: '编辑',
+              type: 'primary',
+              link: true,
+              onClick: openForm.bind(null, 'update', row),
+            },
+            {
+              label: '删除',
+              type: 'danger',
+              link: true,
+              popConfirm: {
+                title: '确认删除该维修项目吗？',
+                confirm: handleDelete.bind(null, row.id!),
+              },
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+    <ElDialog v-model="formOpen" :title="formTitle" width="620px">
+      <Form class="mx-4" />
+      <template #footer>
+        <ElButton @click="formOpen = false">取消</ElButton>
+        <ElButton type="primary" :loading="formLoading" @click="submitForm">确定</ElButton>
+      </template>
+    </ElDialog>
+  </div>
+</template>
diff --git a/apps/web-ele/src/views/mes/dv/subject/components/dv-subject-select.vue b/apps/web-ele/src/views/mes/dv/subject/components/dv-subject-select.vue
new file mode 100644
index 000000000..36e75fb68
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/subject/components/dv-subject-select.vue
@@ -0,0 +1,65 @@
+<script lang="ts" setup>
+import type { MesDvSubjectApi } from '#/api/mes/dv/subject';
+
+import { computed, onMounted, ref } from 'vue';
+
+import { ElOption, ElSelect } from 'element-plus';
+
+import { getSubjectSimpleList } from '#/api/mes/dv/subject';
+
+const props = withDefaults(
+  defineProps<{
+    clearable?: boolean;
+    disabled?: boolean;
+    modelValue?: number;
+    placeholder?: string;
+    type?: number;
+  }>(),
+  {
+    clearable: true,
+    disabled: false,
+    modelValue: undefined,
+    placeholder: '请选择项目',
+    type: undefined,
+  },
+);
+const emit = defineEmits<{
+  change: [row?: MesDvSubjectApi.Subject];
+  'update:modelValue': [value?: number];
+}>();
+const list = ref<MesDvSubjectApi.Subject[]>([]); // 项目列表
+const filteredList = computed( // 筛选后的项目列表
+  () => list.value.filter((item) => !props.type || item.type === props.type),
+);
+
+/** 加载项目列表 */
+async function getList() {
+  list.value = await getSubjectSimpleList();
+}
+
+/** 处理选择变化 */
+function handleChange(value: number | string | undefined) {
+  const subjectId = typeof value === 'number' ? value : undefined;
+  emit('update:modelValue', subjectId);
+  emit(
+    'change',
+    list.value.find((item) => item.id === subjectId),
+  );
+}
+
+onMounted(getList);
+</script>
+
+<template>
+  <ElSelect
+    :clearable="clearable"
+    :disabled="disabled"
+    :model-value="modelValue"
+    :placeholder="placeholder"
+    class="w-full"
+    filterable
+    @change="handleChange"
+  >
+    <ElOption v-for="item in filteredList" :key="item.id" :label="item.name" :value="item.id!" />
+  </ElSelect>
+</template>
diff --git a/apps/web-ele/src/views/mes/dv/subject/components/index.ts b/apps/web-ele/src/views/mes/dv/subject/components/index.ts
new file mode 100644
index 000000000..a8c12d3be
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/subject/components/index.ts
@@ -0,0 +1 @@
+export { default as DvSubjectSelect } from './dv-subject-select.vue';
diff --git a/apps/web-ele/src/views/mes/dv/subject/data.ts b/apps/web-ele/src/views/mes/dv/subject/data.ts
new file mode 100644
index 000000000..087781834
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/subject/data.ts
@@ -0,0 +1,195 @@
+import type { VbenFormApi, VbenFormSchema } from '#/adapter/form';
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvSubjectApi } from '#/api/mes/dv/subject';
+
+import { h } from 'vue';
+
+import { CommonStatusEnum, DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
+import { ElButton } from 'element-plus';
+
+import { z } from '#/adapter/form';
+import { generateAutoCode } from '#/api/mes/md/autocode/record';
+import { MesAutoCodeRuleCode, MesDvSubjectTypeEnum } from '#/views/mes/utils/constants';
+
+/** 新增/修改点检保养项目的表单 */
+export function useFormSchema(formApi?: VbenFormApi): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'code',
+      label: '项目编码',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入项目编码',
+      },
+      rules: 'required',
+      suffix: () =>
+        h(
+          ElButton,
+          {
+            type: 'default',
+            onClick: async () => {
+              try {
+                const code = await generateAutoCode(MesAutoCodeRuleCode.DV_SUBJECT_CODE);
+                await formApi?.setFieldValue('code', code);
+              } catch (error) {
+                console.error(error);
+              }
+            },
+          },
+          { default: () => '生成' },
+        ),
+    },
+    {
+      fieldName: 'name',
+      label: '项目名称',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入项目名称',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'type',
+      label: '项目类型',
+      component: 'RadioGroup',
+      componentProps: {
+        options: getDictOptions(DICT_TYPE.MES_DV_SUBJECT_TYPE, 'number'),
+      },
+      rules: z.number().default(MesDvSubjectTypeEnum.CHECK),
+    },
+    {
+      fieldName: 'content',
+      label: '项目内容',
+      component: 'Textarea',
+      formItemClass: 'col-span-2',
+      componentProps: {
+        placeholder: '请输入项目内容',
+        rows: 2,
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'standard',
+      label: '标准',
+      component: 'Textarea',
+      formItemClass: 'col-span-2',
+      componentProps: {
+        placeholder: '请输入标准',
+        rows: 2,
+      },
+      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',
+      formItemClass: 'col-span-2',
+      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: 'type',
+      label: '项目类型',
+      component: 'Select',
+      componentProps: {
+        clearable: true,
+        options: getDictOptions(DICT_TYPE.MES_DV_SUBJECT_TYPE, 'number'),
+        placeholder: '请选择项目类型',
+      },
+    },
+  ];
+}
+
+/** 列表的字段 */
+export function useGridColumns(): VxeTableGridOptions<MesDvSubjectApi.Subject>['columns'] {
+  return [
+    {
+      field: 'code',
+      title: '项目编码',
+      minWidth: 140,
+      slots: {
+        default: 'code',
+      },
+    },
+    { field: 'name', title: '项目名称', minWidth: 140 },
+    {
+      field: 'type',
+      title: '项目类型',
+      width: 120,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_DV_SUBJECT_TYPE },
+      },
+    },
+    { field: 'content', title: '项目内容', minWidth: 180 },
+    { field: 'standard', title: '标准', minWidth: 180 },
+    {
+      field: 'status',
+      title: '状态',
+      width: 100,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.COMMON_STATUS },
+      },
+    },
+    {
+      field: 'createTime',
+      title: '创建时间',
+      width: 180,
+      formatter: 'formatDateTime',
+    },
+    {
+      title: '操作',
+      width: 180,
+      fixed: 'right',
+      slots: {
+        default: 'actions',
+      },
+    },
+  ];
+}
diff --git a/apps/web-ele/src/views/mes/dv/subject/index.vue b/apps/web-ele/src/views/mes/dv/subject/index.vue
new file mode 100644
index 000000000..336a80cd1
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/subject/index.vue
@@ -0,0 +1,150 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesDvSubjectApi } from '#/api/mes/dv/subject';
+
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
+import { downloadFileFromBlobPart } from '@vben/utils';
+
+import { ElButton, ElLoading, ElMessage } from 'element-plus';
+
+import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import { deleteSubject, exportSubject, getSubjectPage } from '#/api/mes/dv/subject';
+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({ type: 'create' }).open();
+}
+
+/** 查看点检保养项目 */
+function handleDetail(row: MesDvSubjectApi.Subject) {
+  formModalApi.setData({ id: row.id, type: 'detail' }).open();
+}
+
+/** 编辑点检保养项目 */
+function handleEdit(row: MesDvSubjectApi.Subject) {
+  formModalApi.setData({ id: row.id, type: 'update' }).open();
+}
+
+/** 删除点检保养项目 */
+async function handleDelete(row: MesDvSubjectApi.Subject) {
+  const hideLoading = ElLoading.service({ text: $t('ui.actionMessage.deleting', [row.name]) });
+  try {
+    await deleteSubject(row.id!);
+    ElMessage.success($t('ui.actionMessage.deleteSuccess', [row.name]));
+    handleRefresh();
+  } finally {
+    hideLoading.close();
+  }
+}
+
+/** 导出点检保养项目 */
+async function handleExport() {
+  const data = await exportSubject(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) =>
+          await getSubjectPage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            ...formValues,
+          }),
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+  } as VxeTableGridOptions<MesDvSubjectApi.Subject>,
+});
+</script>
+
+<template>
+  <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【设备】点检保养项目、点检保养方案"
+        url="https://doc.iocoder.cn/mes/dv/check-plan/"
+      />
+    </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:dv-subject:create'],
+              onClick: handleCreate,
+            },
+            {
+              label: $t('ui.actionTitle.export'),
+              type: 'primary',
+              icon: ACTION_ICON.DOWNLOAD,
+              auth: ['mes:dv-subject:export'],
+              onClick: handleExport,
+            },
+          ]"
+        />
+      </template>
+      <template #code="{ row }">
+        <ElButton link type="primary" @click="handleDetail(row)">{{ row.code }}</ElButton>
+      </template>
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: $t('common.edit'),
+              type: 'primary',
+              link: true,
+              icon: ACTION_ICON.EDIT,
+              auth: ['mes:dv-subject:update'],
+              onClick: handleEdit.bind(null, row),
+            },
+            {
+              label: $t('common.delete'),
+              type: 'danger',
+              link: true,
+              icon: ACTION_ICON.DELETE,
+              auth: ['mes:dv-subject: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/dv/subject/modules/form.vue b/apps/web-ele/src/views/mes/dv/subject/modules/form.vue
new file mode 100644
index 000000000..5608a0023
--- /dev/null
+++ b/apps/web-ele/src/views/mes/dv/subject/modules/form.vue
@@ -0,0 +1,95 @@
+<script lang="ts" setup>
+import type { MesDvSubjectApi } from '#/api/mes/dv/subject';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { ElMessage } from 'element-plus';
+
+import { useVbenForm } from '#/adapter/form';
+import { createSubject, getSubject, updateSubject } from '#/api/mes/dv/subject';
+import { $t } from '#/locales';
+
+import { useFormSchema } from '../data';
+
+type FormMode = 'create' | 'detail' | 'update';
+
+const emit = defineEmits(['success']);
+const formMode = ref<FormMode>('create'); // 表单模式
+const isDetail = computed(() => formMode.value === 'detail'); // 是否查看模式
+const getTitle = computed(() => {
+  if (formMode.value === 'detail') {
+    return '查看点检保养项目';
+  }
+  return formMode.value === 'update' ? '修改点检保养项目' : '新增点检保养项目';
+});
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-1',
+    labelWidth: 110,
+  },
+  wrapperClass: 'grid-cols-2',
+  layout: 'horizontal',
+  schema: [],
+  showDefaultActions: false,
+});
+
+/** 表单 schema 需要 formApi 引用，所以通过 setState 设置 schema */
+formApi.setState({ schema: useFormSchema(formApi) });
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    if (isDetail.value) {
+      await modalApi.close();
+      return;
+    }
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    const data = (await formApi.getValues()) as MesDvSubjectApi.Subject;
+    try {
+      await (data.id ? updateSubject(data) : createSubject(data));
+      // 关闭并提示
+      await modalApi.close();
+      emit('success');
+      ElMessage.success($t('ui.actionMessage.operationSuccess'));
+    } finally {
+      modalApi.unlock();
+    }
+  },
+  async onOpenChange(isOpen: boolean) {
+    if (!isOpen) {
+      return;
+    }
+    await formApi.resetForm();
+    // 加载数据
+    const data = modalApi.getData<{ id?: number; type?: FormMode }>();
+    formMode.value = data?.type || 'create';
+    formApi.setDisabled(formMode.value === 'detail');
+    modalApi.setState({ showConfirmButton: formMode.value !== 'detail' });
+    if (!data?.id) {
+      return;
+    }
+    modalApi.lock();
+    try {
+      await formApi.setValues(await getSubject(data.id));
+    } finally {
+      modalApi.unlock();
+    }
+  },
+});
+</script>
+
+<template>
+  <Modal :title="getTitle" class="w-2/5">
+    <Form class="mx-4" />
+  </Modal>
+</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
index e99f2b3ee..a87d7b7ec 100644
--- a/apps/web-ele/src/views/mes/md/autocode/modules/form.vue
+++ b/apps/web-ele/src/views/mes/md/autocode/modules/form.vue
@@ -55,6 +55,7 @@ const [Modal, modalApi] = useVbenModal({
       return;
     }
     modalApi.lock();
+    // 提交表单
     const data = normalizeRuleData(
       (await formApi.getValues()) as MesMdAutoCodeRuleApi.AutoCodeRule,
     );
@@ -62,6 +63,7 @@ const [Modal, modalApi] = useVbenModal({
       await (formData.value?.id
         ? updateAutoCodeRule(data)
         : createAutoCodeRule(data));
+      // 关闭并提示
       await modalApi.close();
       emit('success');
       ElMessage.success($t('ui.actionMessage.operationSuccess'));
@@ -75,6 +77,7 @@ const [Modal, modalApi] = useVbenModal({
       return;
     }
     await formApi.resetForm();
+    // 加载数据
     const data = modalApi.getData<MesMdAutoCodeRuleApi.AutoCodeRule>();
     if (!data?.id) {
       return;
@@ -82,6 +85,7 @@ const [Modal, modalApi] = useVbenModal({
     modalApi.lock();
     try {
       formData.value = await getAutoCodeRule(data.id);
+      // 设置到 values
       await formApi.setValues(formData.value);
     } finally {
       modalApi.unlock();
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
index 87da800ba..ee839560a 100644
--- 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
@@ -65,6 +65,7 @@ const [Modal, modalApi] = useVbenModal({
       return;
     }
     modalApi.lock();
+    // 提交表单
     const data = normalizePartData(
       (await formApi.getValues()) as MesMdAutoCodePartApi.AutoCodePart,
     );
@@ -72,6 +73,7 @@ const [Modal, modalApi] = useVbenModal({
       await (formData.value?.id
         ? updateAutoCodePart(data)
         : createAutoCodePart(data));
+      // 关闭并提示
       await modalApi.close();
       emit('success');
       ElMessage.success($t('ui.actionMessage.operationSuccess'));
@@ -85,6 +87,7 @@ const [Modal, modalApi] = useVbenModal({
       return;
     }
     await formApi.resetForm();
+    // 加载数据
     const data = modalApi.getData<{
       id?: number;
       maxSort?: number;
@@ -100,6 +103,7 @@ const [Modal, modalApi] = useVbenModal({
     modalApi.lock();
     try {
       formData.value = await getAutoCodePart(data.id);
+      // 设置到 values
       await formApi.setValues(formData.value);
     } finally {
       modalApi.unlock();
diff --git a/apps/web-ele/src/views/mes/md/client/modules/form.vue b/apps/web-ele/src/views/mes/md/client/modules/form.vue
index 1c003ef0c..5b0fa0f41 100644
--- a/apps/web-ele/src/views/mes/md/client/modules/form.vue
+++ b/apps/web-ele/src/views/mes/md/client/modules/form.vue
@@ -24,12 +24,10 @@ const formData = ref<MesMdClientApi.Client>();
 
 const isDetail = computed(() => formMode.value === 'detail'); // 是否查看模式
 const getTitle = computed(() => {
-  const titles: Record<FormMode, string> = {
-    create: '新增客户',
-    update: '修改客户',
-    detail: '查看客户',
-  };
-  return titles[formMode.value];
+  if (formMode.value === 'detail') {
+    return '查看客户';
+  }
+  return formMode.value === 'update' ? '修改客户' : '新增客户';
 });
 
 const [Form, formApi] = useVbenForm({
diff --git a/apps/web-ele/src/views/mes/md/item/modules/form.vue b/apps/web-ele/src/views/mes/md/item/modules/form.vue
index b29e9a957..b9681d9e9 100644
--- a/apps/web-ele/src/views/mes/md/item/modules/form.vue
+++ b/apps/web-ele/src/views/mes/md/item/modules/form.vue
@@ -29,12 +29,10 @@ const barcodeDetailRef = ref<InstanceType<typeof BarcodeDetail>>(); // 条码详
 
 const isDetail = computed(() => formMode.value === 'detail'); // 是否查看模式
 const getTitle = computed(() => {
-  const titles: Record<FormMode, string> = {
-    create: '新增物料/产品',
-    update: '修改物料/产品',
-    detail: '查看物料/产品',
-  };
-  return titles[formMode.value];
+  if (formMode.value === 'detail') {
+    return '查看物料/产品';
+  }
+  return formMode.value === 'update' ? '修改物料/产品' : '新增物料/产品';
 });
 const currentItemOrProduct = computed(
   () => formData.value?.itemOrProduct || '',
diff --git a/apps/web-ele/src/views/mes/md/item/type/index.vue b/apps/web-ele/src/views/mes/md/item/type/index.vue
index dceaef395..be0612713 100644
--- a/apps/web-ele/src/views/mes/md/item/type/index.vue
+++ b/apps/web-ele/src/views/mes/md/item/type/index.vue
@@ -4,7 +4,7 @@ import type { MesMdItemTypeApi } from '#/api/mes/md/item/type';
 
 import { ref } from 'vue';
 
-import { Page, useVbenModal } from '@vben/common-ui';
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
 
 import { ElLoading, ElMessage } from 'element-plus';
 
@@ -101,6 +101,12 @@ const [Grid, gridApi] = useVbenVxeGrid({
 
 <template>
   <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【基础】物料产品、分类、计量单位"
+        url="https://doc.iocoder.cn/mes/md/product/"
+      />
+    </template>
     <FormModal @success="handleRefresh" />
     <Grid table-title="物料分类列表">
       <template #toolbar-tools>
diff --git a/apps/web-ele/src/views/mes/md/workstation/data.ts b/apps/web-ele/src/views/mes/md/workstation/data.ts
index a1e266a2f..703c88aac 100644
--- a/apps/web-ele/src/views/mes/md/workstation/data.ts
+++ b/apps/web-ele/src/views/mes/md/workstation/data.ts
@@ -129,11 +129,9 @@ export function useFormSchema(formApi?: VbenFormApi): VbenFormSchema[] {
             onChange: async () => {
               await formApi?.setFieldValue('areaId', undefined);
             },
-            options: list.map((item) => ({
-              label: item.name,
-              value: item.id,
-            })),
+            options: list,
             placeholder: '请选择库区',
+            props: { label: 'name', value: 'id' },
           };
         },
       },
@@ -151,11 +149,9 @@ export function useFormSchema(formApi?: VbenFormApi): VbenFormSchema[] {
             : [];
           return {
             clearable: true,
-            options: list.map((item) => ({
-              label: item.name,
-              value: item.id,
-            })),
+            options: list,
             placeholder: '请选择库位',
+            props: { label: 'name', value: 'id' },
           };
         },
       },
diff --git a/apps/web-ele/src/views/mes/md/workstation/modules/form.vue b/apps/web-ele/src/views/mes/md/workstation/modules/form.vue
index f43deb8a0..b8680ca88 100644
--- a/apps/web-ele/src/views/mes/md/workstation/modules/form.vue
+++ b/apps/web-ele/src/views/mes/md/workstation/modules/form.vue
@@ -32,12 +32,10 @@ const barcodeDetailRef = ref<InstanceType<typeof BarcodeDetail>>(); // 条码详
 
 const isDetail = computed(() => formMode.value === 'detail'); // 是否查看模式
 const getTitle = computed(() => {
-  const titles: Record<FormMode, string> = {
-    create: '新增工作站',
-    update: '修改工作站',
-    detail: '查看工作站',
-  };
-  return titles[formMode.value];
+  if (formMode.value === 'detail') {
+    return '查看工作站';
+  }
+  return formMode.value === 'update' ? '修改工作站' : '新增工作站';
 });
 
 const [Form, formApi] = useVbenForm({
diff --git a/apps/web-ele/src/views/mes/md/workstation/workshop/modules/form.vue b/apps/web-ele/src/views/mes/md/workstation/workshop/modules/form.vue
index b2a7b3a96..822009e42 100644
--- a/apps/web-ele/src/views/mes/md/workstation/workshop/modules/form.vue
+++ b/apps/web-ele/src/views/mes/md/workstation/workshop/modules/form.vue
@@ -28,12 +28,10 @@ const barcodeDetailRef = ref<InstanceType<typeof BarcodeDetail>>(); // 条码详
 
 const isDetail = computed(() => formMode.value === 'detail'); // 是否查看模式
 const getTitle = computed(() => {
-  const titles: Record<FormMode, string> = {
-    create: '新增车间',
-    update: '修改车间',
-    detail: '查看车间',
-  };
-  return titles[formMode.value];
+  if (formMode.value === 'detail') {
+    return '查看车间';
+  }
+  return formMode.value === 'update' ? '修改车间' : '新增车间';
 });
 
 const [Form, formApi] = useVbenForm({
diff --git a/apps/web-ele/src/views/mes/pro/process/components/pro-process-select.vue b/apps/web-ele/src/views/mes/pro/process/components/pro-process-select.vue
index 135ff4654..8be8f82da 100644
--- a/apps/web-ele/src/views/mes/pro/process/components/pro-process-select.vue
+++ b/apps/web-ele/src/views/mes/pro/process/components/pro-process-select.vue
@@ -106,7 +106,7 @@ onMounted(async () => {
         v-for="item in filteredList"
         :key="item.id"
         :label="item.name"
-        :value="item.id"
+        :value="item.id!"
       >
         <div class="flex items-center gap-2">
           <span>{{ item.name }}</span>
diff --git a/apps/web-ele/src/views/mes/tm/tool/components/index.ts b/apps/web-ele/src/views/mes/tm/tool/components/index.ts
new file mode 100644
index 000000000..cdddb2cfd
--- /dev/null
+++ b/apps/web-ele/src/views/mes/tm/tool/components/index.ts
@@ -0,0 +1 @@
+export { default as TmToolSelect } from './tm-tool-select.vue';
diff --git a/apps/web-ele/src/views/mes/tm/tool/components/tm-tool-select.vue b/apps/web-ele/src/views/mes/tm/tool/components/tm-tool-select.vue
new file mode 100644
index 000000000..ea1f3aa09
--- /dev/null
+++ b/apps/web-ele/src/views/mes/tm/tool/components/tm-tool-select.vue
@@ -0,0 +1,52 @@
+<script lang="ts" setup>
+import type { MesTmToolApi } from '#/api/mes/tm/tool';
+
+import { onMounted, ref } from 'vue';
+
+import { ElOption, ElSelect } from 'element-plus';
+
+import { getToolSimpleList } from '#/api/mes/tm/tool';
+
+withDefaults(
+  defineProps<{
+    clearable?: boolean;
+    disabled?: boolean;
+    modelValue?: number;
+    placeholder?: string;
+  }>(),
+  { clearable: true, disabled: false, modelValue: undefined, placeholder: '请选择工具' },
+);
+const emit = defineEmits<{
+  change: [row?: MesTmToolApi.Tool];
+  'update:modelValue': [value?: number];
+}>();
+const list = ref<MesTmToolApi.Tool[]>([]); // 工具列表
+
+/** 加载工具列表 */
+async function getList() {
+  list.value = await getToolSimpleList();
+}
+
+/** 处理工具选择变化 */
+function handleChange(value: number | string | undefined) {
+  const toolId = typeof value === 'number' ? value : undefined;
+  emit('update:modelValue', toolId);
+  emit('change', list.value.find((item) => item.id === toolId));
+}
+
+onMounted(getList);
+</script>
+
+<template>
+  <ElSelect
+    :clearable="clearable"
+    :disabled="disabled"
+    :model-value="modelValue"
+    :placeholder="placeholder"
+    class="w-full"
+    filterable
+    @change="handleChange"
+  >
+    <ElOption v-for="item in list" :key="item.id" :label="item.name" :value="item.id!" />
+  </ElSelect>
+</template>
diff --git a/apps/web-ele/src/views/mes/tm/tool/data.ts b/apps/web-ele/src/views/mes/tm/tool/data.ts
new file mode 100644
index 000000000..0c0e00050
--- /dev/null
+++ b/apps/web-ele/src/views/mes/tm/tool/data.ts
@@ -0,0 +1,309 @@
+import type { VbenFormApi, VbenFormSchema } from '#/adapter/form';
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesTmToolApi } from '#/api/mes/tm/tool';
+
+import { h, markRaw } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+import { formatDateTime } from '@vben/utils';
+
+import { ElButton } from 'element-plus';
+
+import { z } from '#/adapter/form';
+import { generateAutoCode } from '#/api/mes/md/autocode/record';
+import {
+  MesAutoCodeRuleCode,
+  MesMaintenTypeEnum,
+  MesToolStatusEnum,
+} from '#/views/mes/utils/constants';
+
+import { TmToolTypeSelect } from './type/components';
+
+/** 新增/修改工具的表单 */
+export function useFormSchema(formApi?: VbenFormApi): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'code',
+      label: '工具编码',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入工具编码',
+      },
+      dependencies: {
+        triggerFields: ['id'],
+        componentProps: (values) => ({ disabled: !!values.id }),
+      },
+      rules: 'required',
+      suffix: () =>
+        h(
+          ElButton,
+          {
+            type: 'default',
+            onClick: async () => {
+              const code = await generateAutoCode(MesAutoCodeRuleCode.TM_TOOL_CODE);
+              await formApi?.setFieldValue('code', code);
+            },
+          },
+          { default: () => '生成' },
+        ),
+    },
+    {
+      fieldName: 'name',
+      label: '工具名称',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入工具名称',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'toolTypeId',
+      label: '工具类型',
+      component: markRaw(TmToolTypeSelect),
+      componentProps: {
+        placeholder: '请选择工具类型',
+        onChange: async (row: any) => {
+          if (row?.codeFlag) {
+            await formApi?.setFieldValue('quantity', 1);
+            await formApi?.setFieldValue('availableQuantity', 1);
+          }
+        },
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'brand',
+      label: '品牌',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入品牌',
+      },
+    },
+    {
+      fieldName: 'specification',
+      label: '型号规格',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入型号规格',
+      },
+    },
+    {
+      fieldName: 'quantity',
+      label: '库存数量',
+      component: 'InputNumber',
+      componentProps: {
+        class: '!w-full',
+        controlsPosition: 'right',
+        min: 1,
+        onChange: async (value?: number) => {
+          const values = (await formApi?.getValues()) as MesTmToolApi.Tool | undefined;
+          if (!values?.id) {
+            await formApi?.setFieldValue('availableQuantity', value);
+          }
+        },
+        precision: 0,
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'availableQuantity',
+      label: '可用数量',
+      component: 'InputNumber',
+      componentProps: {
+        class: '!w-full',
+        controlsPosition: 'right',
+        disabled: true,
+        min: 0,
+        precision: 0,
+      },
+      rules: z.number().default(1),
+    },
+    {
+      fieldName: 'status',
+      label: '状态',
+      component: 'Select',
+      componentProps: {
+        disabled: true,
+        options: getDictOptions(DICT_TYPE.MES_TM_TOOL_STATUS, 'number'),
+      },
+      rules: z.number().default(MesToolStatusEnum.STORE),
+    },
+    {
+      fieldName: 'maintenType',
+      label: '保养维护类型',
+      component: 'Select',
+      componentProps: {
+        clearable: true,
+        options: getDictOptions(DICT_TYPE.MES_TM_MAINTEN_TYPE, 'number'),
+        placeholder: '请选择保养维护类型',
+      },
+    },
+    {
+      fieldName: 'nextMaintenDate',
+      label: '下次保养日期',
+      component: 'DatePicker',
+      componentProps: {
+        class: '!w-full',
+        format: 'YYYY-MM-DD HH:mm:ss',
+        showTime: true,
+        valueFormat: 'x',
+      },
+      dependencies: {
+        triggerFields: ['maintenType'],
+        show: (values) => values.maintenType === MesMaintenTypeEnum.REGULAR,
+      },
+    },
+    {
+      fieldName: 'nextMaintenPeriod',
+      label: '下次保养周期',
+      component: 'InputNumber',
+      componentProps: {
+        class: '!w-full',
+        controlsPosition: 'right',
+        min: 1,
+        precision: 0,
+      },
+      dependencies: {
+        triggerFields: ['maintenType'],
+        show: (values) => values.maintenType === MesMaintenTypeEnum.USAGE,
+      },
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      formItemClass: 'col-span-3',
+      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: 'brand',
+      label: '品牌',
+      component: 'Input',
+      componentProps: {
+        clearable: true,
+        placeholder: '请输入品牌',
+      },
+    },
+    {
+      fieldName: 'specification',
+      label: '型号规格',
+      component: 'Input',
+      componentProps: {
+        clearable: true,
+        placeholder: '请输入型号规格',
+      },
+    },
+    {
+      fieldName: 'status',
+      label: '状态',
+      component: 'Select',
+      componentProps: {
+        clearable: true,
+        options: getDictOptions(DICT_TYPE.MES_TM_TOOL_STATUS, 'number'),
+        placeholder: '请选择状态',
+      },
+    },
+  ];
+}
+
+/** 列表的字段 */
+export function useGridColumns(): VxeTableGridOptions<MesTmToolApi.Tool>['columns'] {
+  return [
+    {
+      field: 'code',
+      title: '工具编码',
+      minWidth: 140,
+      slots: {
+        default: 'code',
+      },
+    },
+    { field: 'name', title: '工具名称', minWidth: 150 },
+    { field: 'toolTypeName', title: '工具类型', minWidth: 140 },
+    { field: 'brand', title: '品牌', minWidth: 120 },
+    { field: 'specification', title: '型号规格', minWidth: 140 },
+    { field: 'quantity', title: '库存数量', width: 100 },
+    { field: 'availableQuantity', title: '可用数量', width: 100 },
+    {
+      field: 'maintenType',
+      title: '保养维护类型',
+      width: 140,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_TM_MAINTEN_TYPE },
+      },
+    },
+    {
+      field: 'nextMaintenDate',
+      title: '下次保养',
+      width: 180,
+      formatter: ({ row }) => {
+        if (row.maintenType === MesMaintenTypeEnum.REGULAR) {
+          return row.nextMaintenDate ? formatDateTime(row.nextMaintenDate) : '-';
+        }
+        if (row.maintenType === MesMaintenTypeEnum.USAGE) {
+          return row.nextMaintenPeriod == null ? '-' : `${row.nextMaintenPeriod} 次`;
+        }
+        return '-';
+      },
+    },
+    {
+      field: 'status',
+      title: '状态',
+      width: 120,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_TM_TOOL_STATUS },
+      },
+    },
+    {
+      field: 'createTime',
+      title: '创建时间',
+      width: 180,
+      formatter: 'formatDateTime',
+    },
+    {
+      title: '操作',
+      width: 180,
+      fixed: 'right',
+      slots: {
+        default: 'actions',
+      },
+    },
+  ];
+}
diff --git a/apps/web-ele/src/views/mes/tm/tool/index.vue b/apps/web-ele/src/views/mes/tm/tool/index.vue
new file mode 100644
index 000000000..9031f261f
--- /dev/null
+++ b/apps/web-ele/src/views/mes/tm/tool/index.vue
@@ -0,0 +1,172 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesTmToolApi } from '#/api/mes/tm/tool';
+import type { MesTmToolTypeApi } from '#/api/mes/tm/tool/type';
+
+import { ref } from 'vue';
+
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
+import { downloadFileFromBlobPart } from '@vben/utils';
+
+import { ElButton, ElCard, ElLoading, ElMessage } from 'element-plus';
+
+import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import { deleteTool, exportTool, getToolPage } from '#/api/mes/tm/tool';
+import { $t } from '#/locales';
+import { TmToolTypeList } from '#/views/mes/tm/tool/type/components';
+
+import { useGridColumns, useGridFormSchema } from './data';
+import Form from './modules/form.vue';
+
+const selectedToolTypeId = ref<number>(); // 当前选中的工具类型编号
+
+const [FormModal, formModalApi] = useVbenModal({
+  connectedComponent: Form,
+  destroyOnClose: true,
+});
+
+/** 刷新表格 */
+function handleRefresh() {
+  gridApi.query();
+}
+
+/** 创建工具 */
+function handleCreate() {
+  formModalApi.setData({ type: 'create' }).open();
+}
+
+/** 查看工具 */
+function handleDetail(row: MesTmToolApi.Tool) {
+  formModalApi.setData({ id: row.id, type: 'detail' }).open();
+}
+
+/** 编辑工具 */
+function handleEdit(row: MesTmToolApi.Tool) {
+  formModalApi.setData({ id: row.id, type: 'update' }).open();
+}
+
+/** 删除工具 */
+async function handleDelete(row: MesTmToolApi.Tool) {
+  const hideLoading = ElLoading.service({ text: $t('ui.actionMessage.deleting', [row.name]) });
+  try {
+    await deleteTool(row.id!);
+    ElMessage.success($t('ui.actionMessage.deleteSuccess', [row.name]));
+    handleRefresh();
+  } finally {
+    hideLoading.close();
+  }
+}
+
+/** 导出工具 */
+async function handleExport() {
+  const data = await exportTool(await gridApi.formApi.getValues());
+  downloadFileFromBlobPart({ fileName: '工具.xls', source: data });
+}
+
+/** 工具类型选中变化 */
+function handleToolTypeSelect(row: MesTmToolTypeApi.ToolType | undefined) {
+  selectedToolTypeId.value = row?.id;
+  handleRefresh();
+}
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  formOptions: {
+    schema: useGridFormSchema(),
+  },
+  gridOptions: {
+    columns: useGridColumns(),
+    height: 'auto',
+    keepSource: true,
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }, formValues) => {
+          return await getToolPage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            ...formValues,
+            toolTypeId: selectedToolTypeId.value,
+          });
+        },
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+  } as VxeTableGridOptions<MesTmToolApi.Tool>,
+});
+</script>
+
+<template>
+  <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【工具】工具类型、工装夹具台账"
+        url="https://doc.iocoder.cn/mes/tm/tool/"
+      />
+    </template>
+
+    <FormModal @success="handleRefresh" />
+    <div class="flex h-full w-full">
+      <ElCard class="mr-4 h-full w-1/6">
+        <TmToolTypeList @select="handleToolTypeSelect" />
+      </ElCard>
+      <div class="w-5/6">
+        <Grid table-title="工具列表">
+          <template #toolbar-tools>
+            <TableAction
+              :actions="[
+                {
+                  label: $t('ui.actionTitle.create', ['工具']),
+                  type: 'primary',
+                  icon: ACTION_ICON.ADD,
+                  auth: ['mes:tm-tool:create'],
+                  onClick: handleCreate,
+                },
+                {
+                  label: $t('ui.actionTitle.export'),
+                  type: 'primary',
+                  icon: ACTION_ICON.DOWNLOAD,
+                  auth: ['mes:tm-tool:export'],
+                  onClick: handleExport,
+                },
+              ]"
+            />
+          </template>
+          <template #code="{ row }">
+            <ElButton link type="primary" @click="handleDetail(row)">{{ row.code }}</ElButton>
+          </template>
+          <template #actions="{ row }">
+            <TableAction
+              :actions="[
+                {
+                  label: $t('common.edit'),
+                  type: 'primary',
+                  link: true,
+                  icon: ACTION_ICON.EDIT,
+                  auth: ['mes:tm-tool:update'],
+                  onClick: handleEdit.bind(null, row),
+                },
+                {
+                  label: $t('common.delete'),
+                  type: 'danger',
+                  link: true,
+                  icon: ACTION_ICON.DELETE,
+                  auth: ['mes:tm-tool:delete'],
+                  popConfirm: {
+                    title: $t('ui.actionMessage.deleteConfirm', [row.name]),
+                    confirm: handleDelete.bind(null, row),
+                  },
+                },
+              ]"
+            />
+          </template>
+        </Grid>
+      </div>
+    </div>
+  </Page>
+</template>
diff --git a/apps/web-ele/src/views/mes/tm/tool/modules/form.vue b/apps/web-ele/src/views/mes/tm/tool/modules/form.vue
new file mode 100644
index 000000000..bf46e425c
--- /dev/null
+++ b/apps/web-ele/src/views/mes/tm/tool/modules/form.vue
@@ -0,0 +1,126 @@
+<script lang="ts" setup>
+import type { MesTmToolApi } from '#/api/mes/tm/tool';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { ElButton, ElMessage } from 'element-plus';
+
+import { useVbenForm } from '#/adapter/form';
+import { createTool, getTool, updateTool } from '#/api/mes/tm/tool';
+import { $t } from '#/locales';
+import { BarcodeBizTypeEnum } from '#/views/mes/utils/constants';
+import { BarcodeDetail } from '#/views/mes/wm/barcode/components';
+
+import { useFormSchema } from '../data';
+
+type FormMode = 'create' | 'detail' | 'update';
+
+const emit = defineEmits(['success']);
+const formMode = ref<FormMode>('create'); // 表单模式
+const formData = ref<MesTmToolApi.Tool>();
+const barcodeDetailRef = ref<InstanceType<typeof BarcodeDetail>>(); // 条码详情弹窗
+
+const isDetail = computed(() => formMode.value === 'detail'); // 是否查看模式
+const getTitle = computed(() => {
+  if (formMode.value === 'detail') {
+    return $t('ui.actionTitle.view', ['工具']);
+  }
+  return formMode.value === 'update'
+    ? $t('ui.actionTitle.edit', ['工具'])
+    : $t('ui.actionTitle.create', ['工具']);
+});
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-1',
+    labelWidth: 110,
+  },
+  wrapperClass: 'grid-cols-3',
+  layout: 'horizontal',
+  schema: [],
+  showDefaultActions: false,
+});
+
+/** 表单 schema 需要 formApi 引用，所以通过 setState 设置 schema */
+formApi.setState({ schema: useFormSchema(formApi) });
+
+/** 查看工具条码 */
+function handleBarcode() {
+  if (!formData.value?.id) {
+    return;
+  }
+  barcodeDetailRef.value?.openByBusiness(
+    formData.value.id,
+    BarcodeBizTypeEnum.TOOL,
+    formData.value.code,
+    formData.value.name,
+  );
+}
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    if (isDetail.value) {
+      await modalApi.close();
+      return;
+    }
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    const data = (await formApi.getValues()) as MesTmToolApi.Tool;
+    try {
+      await (data.id ? updateTool(data) : createTool(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; type?: FormMode }>();
+    formMode.value = data?.type || 'create';
+    formApi.setDisabled(formMode.value === 'detail');
+    modalApi.setState({ showConfirmButton: formMode.value !== 'detail' });
+    if (!data?.id) {
+      return;
+    }
+    modalApi.lock();
+    try {
+      formData.value = await getTool(data.id);
+      // 设置到 values
+      await formApi.setValues(formData.value);
+    } finally {
+      modalApi.unlock();
+    }
+  },
+});
+</script>
+
+<template>
+  <Modal :title="getTitle" class="w-4/5">
+    <Form class="mx-4" />
+    <template #prepend-footer>
+      <div class="flex flex-auto items-center">
+        <ElButton v-if="isDetail && formData?.id" type="primary" @click="handleBarcode">
+          查看条码
+        </ElButton>
+      </div>
+    </template>
+    <BarcodeDetail ref="barcodeDetailRef" />
+  </Modal>
+</template>
diff --git a/apps/web-ele/src/views/mes/tm/tool/type/components/index.ts b/apps/web-ele/src/views/mes/tm/tool/type/components/index.ts
new file mode 100644
index 000000000..7d68a5c4d
--- /dev/null
+++ b/apps/web-ele/src/views/mes/tm/tool/type/components/index.ts
@@ -0,0 +1,2 @@
+export { default as TmToolTypeList } from './tm-tool-type-list.vue';
+export { default as TmToolTypeSelect } from './tm-tool-type-select.vue';
diff --git a/apps/web-ele/src/views/mes/tm/tool/type/components/tm-tool-type-list.vue b/apps/web-ele/src/views/mes/tm/tool/type/components/tm-tool-type-list.vue
new file mode 100644
index 000000000..e9874f2ba
--- /dev/null
+++ b/apps/web-ele/src/views/mes/tm/tool/type/components/tm-tool-type-list.vue
@@ -0,0 +1,106 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesTmToolTypeApi } from '#/api/mes/tm/tool/type';
+
+import { computed, onMounted, ref, watch } from 'vue';
+
+import { Search } from '@vben/icons';
+
+import { ElInput } from 'element-plus';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { getToolTypeSimpleList } from '#/api/mes/tm/tool/type';
+
+defineOptions({ name: 'TmToolTypeList' });
+
+const emit = defineEmits<{
+  select: [row?: MesTmToolTypeApi.ToolType];
+}>();
+const selectedId = ref<number>(); // 当前选中工具类型编号
+const filterText = ref(''); // 工具类型搜索关键字
+const toolTypeList = ref<MesTmToolTypeApi.ToolType[]>([]); // 工具类型列表
+const filteredList = computed(() =>
+  filterText.value
+    ? toolTypeList.value.filter((item) => item.name?.includes(filterText.value))
+    : toolTypeList.value,
+);
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  gridOptions: {
+    autoResize: true,
+    border: false,
+    columns: [{ field: 'name', title: '类型名称' }],
+    data: [],
+    height: 'auto',
+    pagerConfig: {
+      enabled: false,
+    },
+    rowConfig: {
+      isCurrent: true,
+      isHover: true,
+      keyField: 'id',
+    },
+    showHeader: false,
+    toolbarConfig: {
+      enabled: false,
+    },
+  } as VxeTableGridOptions<MesTmToolTypeApi.ToolType>,
+  gridEvents: {
+    cellClick: ({ row }: { row: MesTmToolTypeApi.ToolType }) => {
+      // 再次点击同一项：取消选中
+      if (selectedId.value === row.id) {
+        selectedId.value = undefined;
+        gridApi.grid.clearCurrentRow();
+        emit('select', undefined);
+        return;
+      }
+      selectedId.value = row.id;
+      emit('select', row);
+    },
+  },
+});
+
+/** 刷新工具类型列表 */
+function refreshGridData() {
+  gridApi.setGridOptions({ data: filteredList.value });
+}
+
+/** 加载工具类型列表 */
+async function loadList() {
+  toolTypeList.value = await getToolTypeSimpleList();
+  refreshGridData();
+}
+
+/** 重置工具类型列表 */
+function reset() {
+  selectedId.value = undefined;
+  filterText.value = '';
+  gridApi.grid.clearCurrentRow();
+  emit('select', undefined);
+  refreshGridData();
+}
+
+watch(filterText, () => {
+  refreshGridData();
+});
+
+onMounted(loadList);
+
+defineExpose({ loadList, reset });
+</script>
+
+<template>
+  <div class="h-full">
+    <ElInput
+      v-model="filterText"
+      class="mb-3 w-full"
+      clearable
+      placeholder="搜索工具类型"
+    >
+      <template #prefix>
+        <Search class="size-4" />
+      </template>
+    </ElInput>
+    <Grid class="h-full" />
+  </div>
+</template>
diff --git a/apps/web-ele/src/views/mes/tm/tool/type/components/tm-tool-type-select.vue b/apps/web-ele/src/views/mes/tm/tool/type/components/tm-tool-type-select.vue
new file mode 100644
index 000000000..270850bc3
--- /dev/null
+++ b/apps/web-ele/src/views/mes/tm/tool/type/components/tm-tool-type-select.vue
@@ -0,0 +1,52 @@
+<script lang="ts" setup>
+import type { MesTmToolTypeApi } from '#/api/mes/tm/tool/type';
+
+import { onMounted, ref } from 'vue';
+
+import { ElOption, ElSelect } from 'element-plus';
+
+import { getToolTypeSimpleList } from '#/api/mes/tm/tool/type';
+
+withDefaults(
+  defineProps<{
+    clearable?: boolean;
+    disabled?: boolean;
+    modelValue?: number;
+    placeholder?: string;
+  }>(),
+  { clearable: true, disabled: false, modelValue: undefined, placeholder: '请选择工具类型' },
+);
+const emit = defineEmits<{
+  change: [row?: MesTmToolTypeApi.ToolType];
+  'update:modelValue': [value?: number];
+}>();
+const list = ref<MesTmToolTypeApi.ToolType[]>([]); // 工具类型列表
+
+/** 加载工具类型列表 */
+async function getList() {
+  list.value = await getToolTypeSimpleList();
+}
+
+/** 处理工具类型选择变化 */
+function handleChange(value: number | string | undefined) {
+  const toolTypeId = typeof value === 'number' ? value : undefined;
+  emit('update:modelValue', toolTypeId);
+  emit('change', list.value.find((item) => item.id === toolTypeId));
+}
+
+onMounted(getList);
+</script>
+
+<template>
+  <ElSelect
+    :clearable="clearable"
+    :disabled="disabled"
+    :model-value="modelValue"
+    :placeholder="placeholder"
+    class="w-full"
+    filterable
+    @change="handleChange"
+  >
+    <ElOption v-for="item in list" :key="item.id" :label="item.name" :value="item.id!" />
+  </ElSelect>
+</template>
diff --git a/apps/web-ele/src/views/mes/tm/tool/type/data.ts b/apps/web-ele/src/views/mes/tm/tool/type/data.ts
new file mode 100644
index 000000000..527f4a844
--- /dev/null
+++ b/apps/web-ele/src/views/mes/tm/tool/type/data.ts
@@ -0,0 +1,208 @@
+import type { VbenFormApi, VbenFormSchema } from '#/adapter/form';
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesTmToolTypeApi } from '#/api/mes/tm/tool/type';
+
+import { h } from 'vue';
+
+import { DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
+import { ElButton } from 'element-plus';
+
+import { z } from '#/adapter/form';
+import { generateAutoCode } from '#/api/mes/md/autocode/record';
+import { MesAutoCodeRuleCode, MesMaintenTypeEnum } from '#/views/mes/utils/constants';
+
+/** 新增/修改工具类型的表单 */
+export function useFormSchema(formApi?: VbenFormApi): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'id',
+      component: 'Input',
+      dependencies: {
+        triggerFields: [''],
+        show: () => false,
+      },
+    },
+    {
+      fieldName: 'code',
+      label: '类型编码',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入类型编码',
+      },
+      rules: 'required',
+      suffix: () =>
+        h(
+          ElButton,
+          {
+            type: 'default',
+            onClick: async () => {
+              const code = await generateAutoCode(MesAutoCodeRuleCode.TM_TOOL_TYPE_CODE);
+              await formApi?.setFieldValue('code', code);
+            },
+          },
+          { default: () => '生成' },
+        ),
+    },
+    {
+      fieldName: 'name',
+      label: '类型名称',
+      component: 'Input',
+      componentProps: {
+        placeholder: '请输入类型名称',
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'codeFlag',
+      label: '是否编码管理',
+      component: 'RadioGroup',
+      componentProps: {
+        options: getDictOptions(DICT_TYPE.INFRA_BOOLEAN_STRING, 'boolean'),
+      },
+      rules: z.boolean().default(true),
+    },
+    {
+      fieldName: 'maintenType',
+      label: '保养维护类型',
+      component: 'Select',
+      componentProps: {
+        clearable: true,
+        options: getDictOptions(DICT_TYPE.MES_TM_MAINTEN_TYPE, 'number'),
+        placeholder: '请选择保养维护类型',
+      },
+      dependencies: {
+        triggerFields: ['codeFlag'],
+        show: (values) => !!values.codeFlag,
+      },
+      rules: 'selectRequired',
+    },
+    {
+      fieldName: 'maintenPeriod',
+      label: '保养周期',
+      component: 'InputNumber',
+      componentProps: {
+        class: '!w-full',
+        controlsPosition: 'right',
+        min: 1,
+        precision: 0,
+      },
+      dependencies: {
+        triggerFields: ['codeFlag', 'maintenType'],
+        show: (values) =>
+          !!values.codeFlag &&
+          [MesMaintenTypeEnum.REGULAR, MesMaintenTypeEnum.USAGE].includes(values.maintenType),
+      },
+      rules: 'required',
+    },
+    {
+      fieldName: 'remark',
+      label: '备注',
+      component: 'Textarea',
+      formItemClass: 'col-span-2',
+      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: 'maintenType',
+      label: '保养维护类型',
+      component: 'Select',
+      componentProps: {
+        clearable: true,
+        options: getDictOptions(DICT_TYPE.MES_TM_MAINTEN_TYPE, 'number'),
+        placeholder: '请选择保养维护类型',
+      },
+    },
+  ];
+}
+
+/** 列表的字段 */
+export function useGridColumns(): VxeTableGridOptions<MesTmToolTypeApi.ToolType>['columns'] {
+  return [
+    {
+      field: 'code',
+      title: '类型编码',
+      minWidth: 140,
+      slots: {
+        default: 'code',
+      },
+    },
+    { field: 'name', title: '类型名称', minWidth: 150 },
+    {
+      field: 'codeFlag',
+      title: '编码管理',
+      width: 120,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.INFRA_BOOLEAN_STRING },
+      },
+    },
+    {
+      field: 'maintenType',
+      title: '保养维护类型',
+      width: 140,
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.MES_TM_MAINTEN_TYPE },
+      },
+    },
+    {
+      field: 'maintenPeriod',
+      title: '保养周期',
+      width: 100,
+      formatter: ({ row }) => {
+        if (row.maintenPeriod == null) {
+          return '-';
+        }
+        if (row.maintenType === MesMaintenTypeEnum.REGULAR) {
+          return `${row.maintenPeriod} 天`;
+        }
+        if (row.maintenType === MesMaintenTypeEnum.USAGE) {
+          return `${row.maintenPeriod} 次`;
+        }
+        return '-';
+      },
+    },
+    {
+      field: 'createTime',
+      title: '创建时间',
+      width: 180,
+      formatter: 'formatDateTime',
+    },
+    {
+      title: '操作',
+      width: 180,
+      fixed: 'right',
+      slots: {
+        default: 'actions',
+      },
+    },
+  ];
+}
diff --git a/apps/web-ele/src/views/mes/tm/tool/type/index.vue b/apps/web-ele/src/views/mes/tm/tool/type/index.vue
new file mode 100644
index 000000000..3cc81e9c2
--- /dev/null
+++ b/apps/web-ele/src/views/mes/tm/tool/type/index.vue
@@ -0,0 +1,151 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { MesTmToolTypeApi } from '#/api/mes/tm/tool/type';
+
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
+import { downloadFileFromBlobPart } from '@vben/utils';
+
+import { ElButton, ElLoading, ElMessage } from 'element-plus';
+
+import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import { deleteToolType, exportToolType, getToolTypePage } from '#/api/mes/tm/tool/type';
+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({ type: 'create' }).open();
+}
+
+/** 查看工具类型 */
+function handleDetail(row: MesTmToolTypeApi.ToolType) {
+  formModalApi.setData({ id: row.id, type: 'detail' }).open();
+}
+
+/** 编辑工具类型 */
+function handleEdit(row: MesTmToolTypeApi.ToolType) {
+  formModalApi.setData({ id: row.id, type: 'update' }).open();
+}
+
+/** 删除工具类型 */
+async function handleDelete(row: MesTmToolTypeApi.ToolType) {
+  const hideLoading = ElLoading.service({ text: $t('ui.actionMessage.deleting', [row.name]) });
+  try {
+    await deleteToolType(row.id!);
+    ElMessage.success($t('ui.actionMessage.deleteSuccess', [row.name]));
+    handleRefresh();
+  } finally {
+    hideLoading.close();
+  }
+}
+
+/** 导出工具类型 */
+async function handleExport() {
+  const data = await exportToolType(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) =>
+          await getToolTypePage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            ...formValues,
+          }),
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+  } as VxeTableGridOptions<MesTmToolTypeApi.ToolType>,
+});
+</script>
+
+<template>
+  <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【工具】工具类型、工装夹具台账"
+        url="https://doc.iocoder.cn/mes/tm/tool/"
+      />
+    </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:tm-tool-type:create'],
+              onClick: handleCreate,
+            },
+            {
+              label: $t('ui.actionTitle.export'),
+              type: 'primary',
+              icon: ACTION_ICON.DOWNLOAD,
+              auth: ['mes:tm-tool-type:export'],
+              onClick: handleExport,
+            },
+          ]"
+        />
+      </template>
+      <template #code="{ row }">
+        <ElButton link type="primary" @click="handleDetail(row)">{{ row.code }}</ElButton>
+      </template>
+      <template #actions="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: $t('common.edit'),
+              type: 'primary',
+              link: true,
+              icon: ACTION_ICON.EDIT,
+              auth: ['mes:tm-tool-type:update'],
+              onClick: handleEdit.bind(null, row),
+            },
+            {
+              label: $t('common.delete'),
+              type: 'danger',
+              link: true,
+              icon: ACTION_ICON.DELETE,
+              auth: ['mes:tm-tool-type: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/tm/tool/type/modules/form.vue b/apps/web-ele/src/views/mes/tm/tool/type/modules/form.vue
new file mode 100644
index 000000000..4588bf62b
--- /dev/null
+++ b/apps/web-ele/src/views/mes/tm/tool/type/modules/form.vue
@@ -0,0 +1,102 @@
+<script lang="ts" setup>
+import type { MesTmToolTypeApi } from '#/api/mes/tm/tool/type';
+
+import { computed, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { ElMessage } from 'element-plus';
+
+import { useVbenForm } from '#/adapter/form';
+import { createToolType, getToolType, updateToolType } from '#/api/mes/tm/tool/type';
+import { $t } from '#/locales';
+
+import { useFormSchema } from '../data';
+
+type FormMode = 'create' | 'detail' | 'update';
+
+const emit = defineEmits(['success']);
+const formMode = ref<FormMode>('create'); // 表单模式
+const formData = ref<MesTmToolTypeApi.ToolType>();
+
+const isDetail = computed(() => formMode.value === 'detail'); // 是否查看模式
+const getTitle = computed(() => {
+  if (formMode.value === 'detail') {
+    return $t('ui.actionTitle.view', ['工具类型']);
+  }
+  return formMode.value === 'update'
+    ? $t('ui.actionTitle.edit', ['工具类型'])
+    : $t('ui.actionTitle.create', ['工具类型']);
+});
+
+const [Form, formApi] = useVbenForm({
+  commonConfig: {
+    componentProps: {
+      class: 'w-full',
+    },
+    formItemClass: 'col-span-1',
+    labelWidth: 120,
+  },
+  wrapperClass: 'grid-cols-2',
+  layout: 'horizontal',
+  schema: [],
+  showDefaultActions: false,
+});
+
+/** 表单 schema 需要 formApi 引用，所以通过 setState 设置 schema */
+formApi.setState({ schema: useFormSchema(formApi) });
+
+const [Modal, modalApi] = useVbenModal({
+  async onConfirm() {
+    if (isDetail.value) {
+      await modalApi.close();
+      return;
+    }
+    const { valid } = await formApi.validate();
+    if (!valid) {
+      return;
+    }
+    modalApi.lock();
+    // 提交表单
+    const data = (await formApi.getValues()) as MesTmToolTypeApi.ToolType;
+    try {
+      await (data.id ? updateToolType(data) : createToolType(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; type?: FormMode }>();
+    formMode.value = data?.type || 'create';
+    formApi.setDisabled(formMode.value === 'detail');
+    modalApi.setState({ showConfirmButton: formMode.value !== 'detail' });
+    if (!data?.id) {
+      return;
+    }
+    modalApi.lock();
+    try {
+      formData.value = await getToolType(data.id);
+      // 设置到 values
+      await formApi.setValues(formData.value);
+    } finally {
+      modalApi.unlock();
+    }
+  },
+});
+</script>
+
+<template>
+  <Modal :title="getTitle" class="w-2/5">
+    <Form class="mx-4" />
+  </Modal>
+</template>
diff --git a/apps/web-ele/src/views/mes/utils/constants.ts b/apps/web-ele/src/views/mes/utils/constants.ts
index bc7a2a5fe..a436eabd5 100644
--- a/apps/web-ele/src/views/mes/utils/constants.ts
+++ b/apps/web-ele/src/views/mes/utils/constants.ts
@@ -1,3 +1,13 @@
+/** MES 单据状态常量 */
+export const MesOrderStatusConstants = {
+  DRAFT: 0,
+  CONFIRMED: 1,
+  APPROVING: 2,
+  APPROVED: 3,
+  FINISHED: 4,
+  CANCELLED: 5,
+} as const;
+
 /** MES 物料/产品标识枚举 */
 export const MesItemOrProductEnum = {
   ITEM: {
@@ -10,14 +20,181 @@ export const MesItemOrProductEnum = {
   },
 } as const;
 
+/** MES 工具状态枚举 */
+export const MesToolStatusEnum = {
+  STORE: 1,
+  ISSUE: 2,
+  REPAIR: 3,
+  SCRAP: 4,
+} as const;
+
+/** MES 保养维护类型枚举 */
+export const MesMaintenTypeEnum = {
+  REGULAR: 1,
+  USAGE: 2,
+} as const;
+
+/** MES 设备状态枚举 */
+export const MesDvMachineryStatusEnum = {
+  STOP: 1,
+  PRODUCING: 2,
+  MAINTENANCE: 3,
+} as const;
+
+/** MES 假期类型枚举 */
+export const HolidayType = {
+  WORKDAY: 1,
+  HOLIDAY: 2,
+} as const;
+
+/** MES 排班计划状态枚举 */
+export const MesCalPlanStatusEnum = {
+  PREPARE: 0,
+  CONFIRMED: 1,
+} as const;
+
+/** MES 轮班方式枚举 */
+export const MesCalShiftTypeEnum = {
+  SINGLE: 1,
+  TWO: 2,
+  THREE: 3,
+} as const;
+
+/** MES 倒班方式枚举 */
+export const MesCalShiftMethodEnum = {
+  QUARTER: 1,
+  MONTH: 2,
+  WEEK: 3,
+  DAY: 4,
+} as const;
+
+/** MES 点检保养项目类型枚举 */
+export const MesDvSubjectTypeEnum = {
+  CHECK: 1,
+  MAINTENANCE: 2,
+} as const;
+
+/** MES 点检保养方案状态枚举 */
+export const MesDvCheckPlanStatusEnum = {
+  PREPARE: 0,
+  ENABLED: 1,
+} as const;
+
+/** MES 设备保养记录状态枚举 */
+export const MesDvMaintenRecordStatusEnum = {
+  PREPARE: MesOrderStatusConstants.DRAFT,
+  SUBMITTED: MesOrderStatusConstants.FINISHED,
+} as const;
+
+/** MES 设备保养明细结果枚举 */
+export const MesDvMaintenStatusEnum = {
+  NORMAL: 1,
+  ABNORMAL: 2,
+} as const;
+
+/** MES 设备点检记录状态枚举 */
+export const MesDvCheckRecordStatusEnum = {
+  DRAFT: 10,
+  FINISHED: 20,
+} as const;
+
+/** MES 设备点检结果枚举 */
+export const MesDvCheckResultEnum = {
+  NORMAL: 1,
+  ABNORMAL: 2,
+} as const;
+
+/** MES 维修工单状态枚举 */
+export const MesDvRepairStatusEnum = {
+  PREPARE: MesOrderStatusConstants.DRAFT,
+  CONFIRMED: MesOrderStatusConstants.CONFIRMED,
+  APPROVING: MesOrderStatusConstants.APPROVING,
+  FINISHED: MesOrderStatusConstants.FINISHED,
+} as const;
+
+/** MES 维修结果枚举 */
+export const MesDvRepairResultEnum = {
+  PASS: 1,
+  FAIL: 2,
+} as const;
+
 /** MES 自动编码规则 Code 枚举 */
 export const MesAutoCodeRuleCode = {
+  CAL_PLAN_CODE: 'CAL_PLAN_CODE',
+  CAL_TEAM_CODE: 'CAL_TEAM_CODE',
+  DV_CHECK_PLAN_CODE: 'DV_CHECK_PLAN_CODE',
+  DV_MACHINERY_TYPE_CODE: 'DV_MACHINERY_TYPE_CODE',
+  DV_MACHINERY_CODE: 'DV_MACHINERY_CODE',
+  DV_REPAIR_CODE: 'DV_REPAIR_CODE',
+  DV_SUBJECT_CODE: 'DV_SUBJECT_CODE',
   MD_CLIENT_CODE: 'MD_CLIENT_CODE',
   MD_ITEM_TYPE_CODE: 'MD_ITEM_TYPE_CODE',
   MD_ITEM_CODE: 'MD_ITEM_CODE',
   MD_VENDOR_CODE: 'MD_VENDOR_CODE',
   MD_WORKSTATION_CODE: 'MD_WORKSTATION_CODE',
   MD_WORKSHOP_CODE: 'MD_WORKSHOP_CODE',
+  PRO_CARD_CODE: 'PRO_CARD_CODE',
+  PRO_FEEDBACK_CODE: 'PRO_FEEDBACK_CODE',
+  PRO_PROCESS_CODE: 'PRO_PROCESS_CODE',
+  PRO_ROUTE_CODE: 'PRO_ROUTE_CODE',
+  PRO_TASK_CODE: 'PRO_TASK_CODE',
+  PRO_WORK_ORDER_CODE: 'PRO_WORK_ORDER_CODE',
+  TM_TOOL_TYPE_CODE: 'TM_TOOL_TYPE_CODE',
+  TM_TOOL_CODE: 'TM_TOOL_CODE',
+} as const;
+
+/** MES 生产工单状态枚举 */
+export const MesProWorkOrderStatusEnum = {
+  PREPARE: MesOrderStatusConstants.DRAFT,
+  CONFIRMED: MesOrderStatusConstants.CONFIRMED,
+  APPROVING: MesOrderStatusConstants.APPROVING,
+  PRODUCING: MesOrderStatusConstants.APPROVED,
+  FINISHED: MesOrderStatusConstants.FINISHED,
+  CANCELLED: MesOrderStatusConstants.CANCELLED,
+} as const;
+
+/** MES 生产任务状态枚举 */
+export const MesProTaskStatusEnum = {
+  PREPARE: MesOrderStatusConstants.DRAFT,
+  CONFIRMED: MesOrderStatusConstants.CONFIRMED,
+  APPROVING: MesOrderStatusConstants.APPROVING,
+  PRODUCING: MesOrderStatusConstants.APPROVED,
+  FINISHED: MesOrderStatusConstants.FINISHED,
+  CANCELLED: MesOrderStatusConstants.CANCELLED,
+} as const;
+
+/** MES 生产报工状态枚举 */
+export const MesProFeedbackStatusEnum = {
+  PREPARE: MesOrderStatusConstants.DRAFT,
+  CONFIRMED: MesOrderStatusConstants.CONFIRMED,
+  APPROVING: MesOrderStatusConstants.APPROVING,
+  FINISHED: MesOrderStatusConstants.FINISHED,
+  CANCELLED: MesOrderStatusConstants.CANCELLED,
+} as const;
+
+/** MES 流转卡状态枚举 */
+export const MesProCardStatusEnum = {
+  PREPARE: MesOrderStatusConstants.DRAFT,
+  ISSUED: MesOrderStatusConstants.CONFIRMED,
+  PRODUCING: MesOrderStatusConstants.APPROVED,
+  FINISHED: MesOrderStatusConstants.FINISHED,
+  CANCELLED: MesOrderStatusConstants.CANCELLED,
+} as const;
+
+/** MES 安灯类型枚举 */
+export const MesProAndonTypeEnum = {
+  QUALITY: 1,
+  EQUIPMENT: 2,
+  MATERIAL: 3,
+  PROCESS: 4,
+  OTHER: 9,
+} as const;
+
+/** MES 安灯状态枚举 */
+export const MesProAndonStatusEnum = {
+  TRIGGERED: 1,
+  HANDLING: 2,
+  CLOSED: 3,
 } as const;
 
 /** MES 编码规则分段类型枚举 */
diff --git a/packages/@core/base/shared/src/utils/__tests__/inference.test.ts b/packages/@core/base/shared/src/utils/__tests__/inference.test.ts
index 7fda46508..6fe96b549 100644
--- a/packages/@core/base/shared/src/utils/__tests__/inference.test.ts
+++ b/packages/@core/base/shared/src/utils/__tests__/inference.test.ts
@@ -4,6 +4,7 @@ import {
   getFirstNonNullOrUndefined,
   isBoolean,
   isEmpty,
+  isEmptyVal,
   isHttpUrl,
   isObject,
   isUndefined,
@@ -85,6 +86,21 @@ describe('isEmpty', () => {
   });
 });
 
+describe('isEmptyVal', () => {
+  it('should return true for empty value', () => {
+    expect(isEmptyVal('')).toBe(true);
+    expect(isEmptyVal(null)).toBe(true);
+    expect(isEmptyVal()).toBe(true);
+  });
+
+  it('should return false for valid falsy and collection values', () => {
+    expect(isEmptyVal(0)).toBe(false);
+    expect(isEmptyVal(false)).toBe(false);
+    expect(isEmptyVal([])).toBe(false);
+    expect(isEmptyVal({})).toBe(false);
+  });
+});
+
 describe('isWindow', () => {
   it('should return true for the window object', () => {
     expect(isWindow(window)).toBe(true);
diff --git a/packages/@core/base/shared/src/utils/date.ts b/packages/@core/base/shared/src/utils/date.ts
index b2ad6bcdc..73fb83f70 100644
--- a/packages/@core/base/shared/src/utils/date.ts
+++ b/packages/@core/base/shared/src/utils/date.ts
@@ -97,3 +97,22 @@ export const setCurrentTimezone = (timezone?: string) => {
 export const getCurrentTimezone = () => {
   return currentTimezone;
 };
+
+/**
+ * 把 antd TimePicker / DatePicker `@update:value` 回传的值统一成字符串。
+ *
+ * antd 在设置了 `value-format` 后实际只会回传字符串，
+ * 但 `@update:value` 的类型仍包含 `Dayjs`，调用方需要做一次类型归一。
+ *
+ * - 空值（null / undefined / '' / 0）返回 ''
+ * - 已经是字符串：原样返回（保持 `value-format` 已格式化的结果）
+ * - 兜底的 Dayjs：调用 `.format()` 转默认 ISO 字符串
+ */
+export function formatDayjs(
+  value: dayjs.Dayjs | null | string | undefined,
+): string {
+  if (!value) {
+    return '';
+  }
+  return typeof value === 'string' ? value : value.format();
+}
diff --git a/packages/@core/base/shared/src/utils/inference.ts b/packages/@core/base/shared/src/utils/inference.ts
index c5c4b4555..8a6c86be1 100644
--- a/packages/@core/base/shared/src/utils/inference.ts
+++ b/packages/@core/base/shared/src/utils/inference.ts
@@ -53,6 +53,21 @@ function isEmpty<T = unknown>(value?: T): boolean {
   return false;
 }
 
+/**
+ * 检查传入的值是否为空值。
+ *
+ * 仅以下情况将被认为是空值：
+ * - 值为 null。
+ * - 值为 undefined。
+ * - 值为空字符串。
+ *
+ * @param value 要检查的值。
+ * @returns 如果值为空值，返回 true，否则返回 false。
+ */
+function isEmptyVal(value?: unknown): value is '' | null | undefined {
+  return value === '' || value === null || value === undefined;
+}
+
 /**
  * 检查传入的字符串是否为有效的HTTP或HTTPS URL。
  *
@@ -152,6 +167,7 @@ export {
   getFirstNonNullOrUndefined,
   isBoolean,
   isEmpty,
+  isEmptyVal,
   isFunction,
   isHttpUrl,
   isMacOs,
diff --git a/packages/@core/base/shared/src/utils/util.ts b/packages/@core/base/shared/src/utils/util.ts
index 4fbae5c7d..97d88b0d7 100644
--- a/packages/@core/base/shared/src/utils/util.ts
+++ b/packages/@core/base/shared/src/utils/util.ts
@@ -1,3 +1,5 @@
+import { buildShortUUID } from './uuid';
+
 export function bindMethods<T extends object>(instance: T): void {
   const prototype = Object.getPrototypeOf(instance);
   const propertyNames = Object.getOwnPropertyNames(prototype);
@@ -114,3 +116,22 @@ export function jsonParse(str: string) {
     return str;
   }
 }
+
+const stableObjectKeyMap = new WeakMap<object, string>();
+
+/**
+ * 为对象引用生成稳定 key，不写入对象本身。
+ *
+ * 适用于 v-for 使用对象或数组项作为渲染单位，但不希望把 UI 字段混入业务数据的场景。
+ */
+export function getStableObjectKey(
+  item: object,
+  generator: () => string = buildShortUUID,
+): string {
+  let key = stableObjectKeyMap.get(item);
+  if (!key) {
+    key = generator();
+    stableObjectKeyMap.set(item, key);
+  }
+  return key;
+}
diff --git a/packages/constants/src/dict-enum.ts b/packages/constants/src/dict-enum.ts
index 9beebd898..7a127bbc1 100644
--- a/packages/constants/src/dict-enum.ts
+++ b/packages/constants/src/dict-enum.ts
@@ -183,6 +183,36 @@ const MES_DICT = {
   MES_MD_AUTO_CODE_PART_TYPE: 'mes_md_auto_code_part_type', // MES 编码规则分段类型
   MES_CLIENT_TYPE: 'mes_client_type', // MES 客户类型
   MES_VENDOR_LEVEL: 'mes_vendor_level', // MES 供应商级别
+  MES_CAL_HOLIDAY_TYPE: 'mes_cal_holiday_type', // MES 假期类型
+  MES_CAL_SHIFT_TYPE: 'mes_cal_shift_type', // MES 轮班方式
+  MES_CAL_SHIFT_METHOD: 'mes_cal_shift_method', // MES 倒班方式
+  MES_CAL_CALENDAR_TYPE: 'mes_cal_calendar_type', // MES 班组类型
+  MES_CAL_PLAN_STATUS: 'mes_cal_plan_status', // MES 排班计划状态
+  MES_TM_TOOL_STATUS: 'mes_tm_tool_status', // MES 工具状态
+  MES_TM_MAINTEN_TYPE: 'mes_tm_mainten_type', // MES 保养维护类型
+  MES_DV_MACHINERY_STATUS: 'mes_dv_machinery_status', // MES 设备状态
+  MES_DV_SUBJECT_TYPE: 'mes_dv_subject_type', // MES 点检保养项目类型
+  MES_DV_CYCLE_TYPE: 'mes_dv_cycle_type', // MES 点检保养周期类型
+  MES_DV_CHECK_PLAN_STATUS: 'mes_dv_check_plan_status', // MES 点检保养方案状态
+  MES_MAINTEN_RECORD_STATUS: 'mes_mainten_record_status', // MES 保养记录状态
+  MES_MAINTEN_STATUS: 'mes_mainten_status', // MES 保养结果
+  MES_DV_REPAIR_STATUS: 'mes_dv_repair_status', // MES 维修工单状态
+  MES_DV_REPAIR_RESULT: 'mes_dv_repair_result', // MES 维修结果
+  MES_DV_CHECK_RECORD_STATUS: 'mes_dv_check_record_status', // MES 点检记录状态
+  MES_DV_CHECK_RESULT: 'mes_dv_check_result', // MES 点检结果
+  MES_PRO_LINK_TYPE: 'mes_pro_link_type', // MES 工序关系类型
+  MES_PRO_WORK_ORDER_STATUS: 'mes_pro_work_order_status', // MES 生产工单状态
+  MES_PRO_WORK_ORDER_TYPE: 'mes_pro_work_order_type', // MES 工单类型
+  MES_PRO_WORK_ORDER_SOURCE_TYPE: 'mes_pro_work_order_source_type', // MES 工单来源类型
+  MES_PRO_TASK_STATUS: 'mes_pro_task_status', // MES 生产任务状态
+  MES_PRO_FEEDBACK_STATUS: 'mes_pro_feedback_status', // MES 生产报工状态
+  MES_PRO_FEEDBACK_TYPE: 'mes_pro_feedback_type', // MES 生产报工类型
+  MES_PRO_FEEDBACK_CHANNEL: 'mes_pro_feedback_channel', // MES 生产报工途径
+  MES_PRO_ANDON_STATUS: 'mes_pro_andon_status', // MES 安灯处置状态
+  MES_PRO_ANDON_LEVEL: 'mes_pro_andon_level', // MES 安灯级别
+  MES_PRO_WORK_RECORD_TYPE: 'mes_pro_work_record_type', // MES 上下工状态类型
+  MES_TIME_UNIT_TYPE: 'mes_time_unit_type', // MES 时间单位
+  MES_ORDER_STATUS: 'mes_order_status', // MES 单据状态
   MES_WM_BARCODE_BIZ_TYPE: 'mes_wm_barcode_biz_type', // MES 条码业务类型
   MES_WM_BARCODE_FORMAT: 'mes_wm_barcode_format', // MES 条码格式
   MES_WM_PRODUCT_SALES_STATUS: 'mes_wm_product_sales_status', // MES 销售出库单状态
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 908a06c2f..7085a4064 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -837,6 +837,9 @@ importers:
       tinymce:
         specifier: 'catalog:'
         version: 7.9.3
+      tyme4ts:
+        specifier: 'catalog:'
+        version: 1.5.0
       video.js:
         specifier: 'catalog:'
         version: 7.21.7
@@ -1089,6 +1092,9 @@ importers:
       tinymce:
         specifier: 'catalog:'
         version: 7.9.3
+      tyme4ts:
+        specifier: 'catalog:'
+        version: 1.5.0
       video.js:
         specifier: 'catalog:'
         version: 7.21.7
@@ -11488,6 +11494,9 @@ packages:
   tw-animate-css@1.4.0:
     resolution: {integrity: sha512-7bziOlRqH0hJx80h/3mbicLW7o8qLsH5+RaLR2t+OHM3D0JlWGODQKQ4cxbK7WlvmUxpcj6Kgu6EKqjrGFe3QQ==}
 
+  tyme4ts@1.5.0:
+    resolution: {integrity: sha512-SqmlNyDtYb3bsnSkjX8lxyMcCt9xBaBkF8xWs/2ORiysWXftEoTGHEi/zxWEJ8s7aANe5veMcLcOuMK6Z+kzbw==}
+
   type-check@0.4.0:
     resolution: {integrity: sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew==}
     engines: {node: '>= 0.8.0'}
@@ -22132,6 +22141,8 @@ snapshots:
 
   tw-animate-css@1.4.0: {}
 
+  tyme4ts@1.5.0: {}
+
   type-check@0.4.0:
     dependencies:
       prelude-ls: 1.2.1
diff --git a/pnpm-workspace.yaml b/pnpm-workspace.yaml
index 91108aee7..deb73380f 100644
--- a/pnpm-workspace.yaml
+++ b/pnpm-workspace.yaml
@@ -213,6 +213,7 @@ catalog:
   tsdown: ^0.22.0
   turbo: ^2.9.14
   tw-animate-css: ^1.4.0
+  tyme4ts: ^1.5.0
   typescript: ^6.0.3
   unplugin-dts: ^1.0.1
   unplugin-element-plus: ^0.11.2