diff --git a/apps/web-antd/src/api/iot/iot/alert/config/index.ts b/apps/web-antd/src/api/iot/iot/alert/config/index.ts
new file mode 100644
index 0000000000000000000000000000000000000000..26e114c0c2caf2b20884c1a387259a7135cc9e65
--- /dev/null
+++ b/apps/web-antd/src/api/iot/iot/alert/config/index.ts
@@ -0,0 +1,94 @@
+import type { PageParam, PageResult } from '@vben/request';
+
+import { requestClient } from '#/api/request';
+
+export namespace AlertConfigApi {
+  /** IoT 告警配置 VO */
+  export interface AlertConfig {
+    id?: number;
+    name: string;
+    description?: string;
+    level?: number;
+    status?: number;
+    sceneRuleIds?: number[];
+    receiveUserIds?: number[];
+    receiveUserNames?: string;
+    receiveTypes?: number[];
+    createTime?: Date;
+    updateTime?: Date;
+  }
+}
+
+/** IoT 告警配置 */
+export interface AlertConfig {
+  id?: number;
+  name?: string;
+  description?: string;
+  level?: number;
+  status?: number;
+  sceneRuleIds?: number[];
+  receiveUserIds?: number[];
+  receiveUserNames?: string;
+  receiveTypes?: number[];
+  createTime?: Date;
+  updateTime?: Date;
+}
+
+/** 查询告警配置分页 */
+export function getAlertConfigPage(params: PageParam) {
+  return requestClient.get<PageResult<AlertConfigApi.AlertConfig>>(
+    '/iot/alert-config/page',
+    { params },
+  );
+}
+
+/** 查询告警配置详情 */
+export function getAlertConfig(id: number) {
+  return requestClient.get<AlertConfigApi.AlertConfig>(
+    `/iot/alert-config/get?id=${id}`,
+  );
+}
+
+/** 查询所有告警配置列表 */
+export function getAlertConfigList() {
+  return requestClient.get<AlertConfigApi.AlertConfig[]>(
+    '/iot/alert-config/list',
+  );
+}
+
+/** 新增告警配置 */
+export function createAlertConfig(data: AlertConfig) {
+  return requestClient.post('/iot/alert-config/create', data);
+}
+
+/** 修改告警配置 */
+export function updateAlertConfig(data: AlertConfig) {
+  return requestClient.put('/iot/alert-config/update', data);
+}
+
+/** 删除告警配置 */
+export function deleteAlertConfig(id: number) {
+  return requestClient.delete(`/iot/alert-config/delete?id=${id}`);
+}
+
+/** 批量删除告警配置 */
+export function deleteAlertConfigList(ids: number[]) {
+  return requestClient.delete('/iot/alert-config/delete-list', {
+    params: { ids: ids.join(',') },
+  });
+}
+
+/** 启用/禁用告警配置 */
+export function toggleAlertConfig(id: number, enabled: boolean) {
+  return requestClient.put(`/iot/alert-config/toggle`, {
+    id,
+    enabled,
+  });
+}
+
+/** 获取告警配置简单列表 */
+export function getSimpleAlertConfigList() {
+  return requestClient.get<AlertConfigApi.AlertConfig[]>(
+    '/iot/alert-config/simple-list',
+  );
+}
diff --git a/apps/web-antd/src/api/iot/iot/alert/record/index.ts b/apps/web-antd/src/api/iot/iot/alert/record/index.ts
new file mode 100644
index 0000000000000000000000000000000000000000..6d2afcfcf2f605bf1ce1f8906652510df00d1776
--- /dev/null
+++ b/apps/web-antd/src/api/iot/iot/alert/record/index.ts
@@ -0,0 +1,82 @@
+import type { PageParam, PageResult } from '@vben/request';
+
+import { requestClient } from '#/api/request';
+
+export namespace AlertRecordApi {
+  /** IoT 告警记录 VO */
+  export interface AlertRecord {
+    id?: number;
+    configId?: number;
+    configName?: string;
+    configLevel?: number;
+    deviceId?: number;
+    deviceName?: string;
+    productId?: number;
+    productName?: string;
+    deviceMessage?: string;
+    processStatus?: boolean;
+    processRemark?: string;
+    processTime?: Date;
+    createTime?: Date;
+  }
+}
+
+/** IoT 告警记录 */
+export interface AlertRecord {
+  id?: number;
+  configId?: number;
+  configName?: string;
+  configLevel?: number;
+  deviceId?: number;
+  deviceName?: string;
+  productId?: number;
+  productName?: string;
+  deviceMessage?: string;
+  processStatus?: boolean;
+  processRemark?: string;
+  processTime?: Date;
+  createTime?: Date;
+}
+
+/** 查询告警记录分页 */
+export function getAlertRecordPage(params: PageParam) {
+  return requestClient.get<PageResult<AlertRecordApi.AlertRecord>>(
+    '/iot/alert-record/page',
+    { params },
+  );
+}
+
+/** 查询告警记录详情 */
+export function getAlertRecord(id: number) {
+  return requestClient.get<AlertRecordApi.AlertRecord>(
+    `/iot/alert-record/get?id=${id}`,
+  );
+}
+
+/** 处理告警记录 */
+export function processAlertRecord(id: number, remark?: string) {
+  return requestClient.put('/iot/alert-record/process', {
+    id,
+    remark,
+  });
+}
+
+/** 批量处理告警记录 */
+export function batchProcessAlertRecord(ids: number[], remark?: string) {
+  return requestClient.put('/iot/alert-record/batch-process', {
+    ids,
+    remark,
+  });
+}
+
+/** 删除告警记录 */
+export function deleteAlertRecord(id: number) {
+  return requestClient.delete(`/iot/alert-record/delete?id=${id}`);
+}
+
+/** 批量删除告警记录 */
+export function deleteAlertRecordList(ids: number[]) {
+  return requestClient.delete('/iot/alert-record/delete-list', {
+    params: { ids: ids.join(',') },
+  });
+}
diff --git a/apps/web-antd/src/api/iot/iot/device/device/index.ts b/apps/web-antd/src/api/iot/iot/device/device/index.ts
new file mode 100644
index 0000000000000000000000000000000000000000..650fe08753d9ee4f717183713c0e242fd487de76
--- /dev/null
+++ b/apps/web-antd/src/api/iot/iot/device/device/index.ts
@@ -0,0 +1,196 @@
+import type { PageParam, PageResult } from '@vben/request';
+
+import { requestClient } from '#/api/request';
+
+export namespace IotDeviceApi {
+  /** IoT 设备 VO */
+  export interface Device {
+    id?: number; // 设备 ID，主键，自增
+    deviceName: string; // 设备名称
+    productId: number; // 产品编号
+    productKey?: string; // 产品标识
+    deviceType?: number; // 设备类型
+    nickname?: string; // 设备备注名称
+    gatewayId?: number; // 网关设备 ID
+    state?: number; // 设备状态
+    status?: number; // 设备状态（兼容字段）
+    onlineTime?: Date; // 最后上线时间
+    offlineTime?: Date; // 最后离线时间
+    activeTime?: Date; // 设备激活时间
+    createTime?: Date; // 创建时间
+    ip?: string; // 设备的 IP 地址
+    firmwareVersion?: string; // 设备的固件版本
+    deviceSecret?: string; // 设备密钥，用于设备认证，需安全存储
+    mqttClientId?: string; // MQTT 客户端 ID
+    mqttUsername?: string; // MQTT 用户名
+    mqttPassword?: string; // MQTT 密码
+    authType?: string; // 认证类型
+    locationType?: number; // 定位类型
+    latitude?: number; // 设备位置的纬度
+    longitude?: number; // 设备位置的经度
+    areaId?: number; // 地区编码
+    address?: string; // 设备详细地址
+    serialNumber?: string; // 设备序列号
+    config?: string; // 设备配置
+    groupIds?: number[]; // 添加分组 ID
+    picUrl?: string; // 设备图片
+    location?: string; // 位置信息（格式：经度,纬度）
+  }
+
+  /** IoT 设备属性详细 VO */
+  export interface DevicePropertyDetail {
+    identifier: string; // 属性标识符
+    value: string; // 最新值
+    updateTime: Date; // 更新时间
+    name: string; // 属性名称
+    dataType: string; // 数据类型
+    dataSpecs: any; // 数据定义
+    dataSpecsList: any[]; // 数据定义列表
+  }
+
+  /** IoT 设备属性 VO */
+  export interface DeviceProperty {
+    identifier: string; // 属性标识符
+    value: string; // 最新值
+    updateTime: Date; // 更新时间
+  }
+
+  /** 设备认证参数 VO */
+  export interface DeviceAuthInfo {
+    clientId: string; // 客户端 ID
+    username: string; // 用户名
+    password: string; // 密码
+  }
+
+  /** IoT 设备发送消息 Request VO */
+  export interface DeviceMessageSendReq {
+    deviceId: number; // 设备编号
+    method: string; // 请求方法
+    params?: any; // 请求参数
+  }
+
+  /** 设备分组更新请求 */
+  export interface DeviceGroupUpdateReq {
+    ids: number[]; // 设备 ID 列表
+    groupIds: number[]; // 分组 ID 列表
+  }
+}
+
+/** IoT 设备状态枚举 */
+export enum DeviceStateEnum {
+  INACTIVE = 0, // 未激活
+  OFFLINE = 2, // 离线
+  ONLINE = 1, // 在线
+}
+
+/** 查询设备分页 */
+export function getDevicePage(params: PageParam) {
+  return requestClient.get<PageResult<IotDeviceApi.Device>>(
+    '/iot/device/page',
+    { params },
+  );
+}
+
+/** 查询设备详情 */
+export function getDevice(id: number) {
+  return requestClient.get<IotDeviceApi.Device>(`/iot/device/get?id=${id}`);
+}
+
+/** 新增设备 */
+export function createDevice(data: IotDeviceApi.Device) {
+  return requestClient.post('/iot/device/create', data);
+}
+
+/** 修改设备 */
+export function updateDevice(data: IotDeviceApi.Device) {
+  return requestClient.put('/iot/device/update', data);
+}
+
+/** 修改设备分组 */
+export function updateDeviceGroup(data: IotDeviceApi.DeviceGroupUpdateReq) {
+  return requestClient.put('/iot/device/update-group', data);
+}
+
+/** 删除单个设备 */
+export function deleteDevice(id: number) {
+  return requestClient.delete(`/iot/device/delete?id=${id}`);
+}
+
+/** 删除多个设备 */
+export function deleteDeviceList(ids: number[]) {
+  return requestClient.delete('/iot/device/delete-list', {
+    params: { ids: ids.join(',') },
+  });
+}
+
+/** 导出设备 */
+export function exportDeviceExcel(params: any) {
+  return requestClient.download('/iot/device/export-excel', { params });
+}
+
+/** 获取设备数量 */
+export function getDeviceCount(productId: number) {
+  return requestClient.get<number>(`/iot/device/count?productId=${productId}`);
+}
+
+/** 获取设备的精简信息列表 */
+export function getSimpleDeviceList(deviceType?: number, productId?: number) {
+  return requestClient.get<IotDeviceApi.Device[]>('/iot/device/simple-list', {
+    params: { deviceType, productId },
+  });
+}
+
+/** 根据产品编号，获取设备的精简信息列表 */
+export function getDeviceListByProductId(productId: number) {
+  return requestClient.get<IotDeviceApi.Device[]>('/iot/device/simple-list', {
+    params: { productId },
+  });
+}
+
+/** 获取导入模板 */
+export function importDeviceTemplate() {
+  return requestClient.download('/iot/device/get-import-template');
+}
+
+/** 获取设备属性最新数据 */
+export function getLatestDeviceProperties(params: any) {
+  return requestClient.get<IotDeviceApi.DevicePropertyDetail[]>(
+    '/iot/device/property/get-latest',
+    { params },
+  );
+}
+
+/** 获取设备属性历史数据 */
+export function getHistoryDevicePropertyList(params: any) {
+  return requestClient.get<PageResult<IotDeviceApi.DeviceProperty>>(
+    '/iot/device/property/history-list',
+    { params },
+  );
+}
+
+/** 获取设备认证信息 */
+export function getDeviceAuthInfo(id: number) {
+  return requestClient.get<IotDeviceApi.DeviceAuthInfo>(
+    '/iot/device/get-auth-info',
+    { params: { id } },
+  );
+}
+
+/** 查询设备消息分页 */
+export function getDeviceMessagePage(params: PageParam) {
+  return requestClient.get<PageResult<any>>('/iot/device/message/page', {
+    params,
+  });
+}
+
+/** 查询设备消息配对分页 */
+export function getDeviceMessagePairPage(params: PageParam) {
+  return requestClient.get<PageResult<any>>('/iot/device/message/pair-page', {
+    params,
+  });
+}
+
+/** 发送设备消息 */
+export function sendDeviceMessage(params: IotDeviceApi.DeviceMessageSendReq) {
+  return requestClient.post('/iot/device/message/send', params);
+}
diff --git a/apps/web-antd/src/api/iot/iot/device/group/index.ts b/apps/web-antd/src/api/iot/iot/device/group/index.ts
new file mode 100644
index 0000000000000000000000000000000000000000..18cac3097f52a38be64076a4bc8cb721381f1adc
--- /dev/null
+++ b/apps/web-antd/src/api/iot/iot/device/group/index.ts
@@ -0,0 +1,51 @@
+import type { PageParam, PageResult } from '@vben/request';
+
+import { requestClient } from '#/api/request';
+
+export namespace IotDeviceGroupApi {
+  /** IoT 设备分组 VO */
+  export interface DeviceGroup {
+    id?: number; // 分组 ID
+    name: string; // 分组名字
+    status?: number; // 分组状态
+    description?: string; // 分组描述
+    deviceCount?: number; // 设备数量
+  }
+}
+
+/** 查询设备分组分页 */
+export function getDeviceGroupPage(params: PageParam) {
+  return requestClient.get<PageResult<IotDeviceGroupApi.DeviceGroup>>(
+    '/iot/device-group/page',
+    { params },
+  );
+}
+
+/** 查询设备分组详情 */
+export function getDeviceGroup(id: number) {
+  return requestClient.get<IotDeviceGroupApi.DeviceGroup>(
+    `/iot/device-group/get?id=${id}`,
+  );
+}
+
+/** 新增设备分组 */
+export function createDeviceGroup(data: IotDeviceGroupApi.DeviceGroup) {
+  return requestClient.post('/iot/device-group/create', data);
+}
+
+/** 修改设备分组 */
+export function updateDeviceGroup(data: IotDeviceGroupApi.DeviceGroup) {
+  return requestClient.put('/iot/device-group/update', data);
+}
+
+/** 删除设备分组 */
+export function deleteDeviceGroup(id: number) {
+  return requestClient.delete(`/iot/device-group/delete?id=${id}`);
+}
+
+/** 获取设备分组的精简信息列表 */
+export function getSimpleDeviceGroupList() {
+  return requestClient.get<IotDeviceGroupApi.DeviceGroup[]>(
+    '/iot/device-group/simple-list',
+  );
+}
diff --git a/apps/web-antd/src/api/iot/iot/ota/firmware/index.ts b/apps/web-antd/src/api/iot/iot/ota/firmware/index.ts
new file mode 100644
index 0000000000000000000000000000000000000000..1b8ae5b69be9bf1518d1e58919686cfa974983bc
--- /dev/null
+++ b/apps/web-antd/src/api/iot/iot/ota/firmware/index.ts
@@ -0,0 +1,90 @@
+import type { PageParam, PageResult } from '@vben/request';
+
+import { requestClient } from '#/api/request';
+
+export namespace IoTOtaFirmwareApi {
+  /** IoT OTA 固件 VO */
+  export interface Firmware {
+    id?: number;
+    name: string;
+    version: string;
+    productId: number;
+    productName?: string;
+    description?: string;
+    fileUrl?: string;
+    fileMd5?: string;
+    fileSize?: number;
+    status?: number;
+    createTime?: Date;
+    updateTime?: Date;
+  }
+}
+
+/** IoT OTA 固件 */
+export interface IoTOtaFirmware {
+  id?: number;
+  name?: string;
+  version?: string;
+  productId?: number;
+  productName?: string;
+  description?: string;
+  fileUrl?: string;
+  fileMd5?: string;
+  fileSize?: number;
+  status?: number;
+  createTime?: Date;
+  updateTime?: Date;
+}
+
+/** 查询 OTA 固件分页 */
+export function getOtaFirmwarePage(params: PageParam) {
+  return requestClient.get<PageResult<IoTOtaFirmwareApi.Firmware>>(
+    '/iot/ota/firmware/page',
+    { params },
+  );
+}
+
+/** 查询 OTA 固件详情 */
+export function getOtaFirmware(id: number) {
+  return requestClient.get<IoTOtaFirmwareApi.Firmware>(
+    `/iot/ota/firmware/get?id=${id}`,
+  );
+}
+
+/** 新增 OTA 固件 */
+export function createOtaFirmware(data: IoTOtaFirmware) {
+  return requestClient.post('/iot/ota/firmware/create', data);
+}
+
+/** 修改 OTA 固件 */
+export function updateOtaFirmware(data: IoTOtaFirmware) {
+  return requestClient.put('/iot/ota/firmware/update', data);
+}
+
+/** 删除 OTA 固件 */
+export function deleteOtaFirmware(id: number) {
+  return requestClient.delete(`/iot/ota/firmware/delete?id=${id}`);
+}
+
+/** 批量删除 OTA 固件 */
+export function deleteOtaFirmwareList(ids: number[]) {
+  return requestClient.delete('/iot/ota/firmware/delete-list', {
+    params: { ids: ids.join(',') },
+  });
+}
+
+/** 更新 OTA 固件状态 */
+export function updateOtaFirmwareStatus(id: number, status: number) {
+  return requestClient.put(`/iot/ota/firmware/update-status`, {
+    id,
+    status,
+  });
+}
+
+/** 根据产品 ID 查询固件列表 */
+export function getOtaFirmwareListByProductId(productId: number) {
+  return requestClient.get<IoTOtaFirmwareApi.Firmware[]>(
+    '/iot/ota/firmware/list-by-product-id',
+    { params: { productId } },
+  );
+}
diff --git a/apps/web-antd/src/api/iot/iot/ota/task/index.ts b/apps/web-antd/src/api/iot/iot/ota/task/index.ts
new file mode 100644
index 0000000000000000000000000000000000000000..25ef2429fc1e023d71a0edc935772b9b6500a7ca
--- /dev/null
+++ b/apps/web-antd/src/api/iot/iot/ota/task/index.ts
@@ -0,0 +1,98 @@
+import type { PageParam, PageResult } from '@vben/request';
+
+import { requestClient } from '#/api/request';
+
+export namespace IoTOtaTaskApi {
+  /** IoT OTA 升级任务 VO */
+  export interface Task {
+    id?: number;
+    name: string;
+    description?: string;
+    firmwareId: number;
+    firmwareName?: string;
+    productId?: number;
+    productName?: string;
+    deviceScope?: number;
+    deviceIds?: number[];
+    status?: number;
+    successCount?: number;
+    failureCount?: number;
+    pendingCount?: number;
+    createTime?: Date;
+    updateTime?: Date;
+  }
+}
+
+/** IoT OTA 升级任务 */
+export interface OtaTask {
+  id?: number;
+  name?: string;
+  description?: string;
+  firmwareId?: number;
+  firmwareName?: string;
+  productId?: number;
+  productName?: string;
+  deviceScope?: number;
+  deviceIds?: number[];
+  status?: number;
+  successCount?: number;
+  failureCount?: number;
+  pendingCount?: number;
+  createTime?: Date;
+  updateTime?: Date;
+}
+
+/** 查询 OTA 升级任务分页 */
+export function getOtaTaskPage(params: PageParam) {
+  return requestClient.get<PageResult<IoTOtaTaskApi.Task>>(
+    '/iot/ota/task/page',
+    { params },
+  );
+}
+
+/** 查询 OTA 升级任务详情 */
+export function getOtaTask(id: number) {
+  return requestClient.get<IoTOtaTaskApi.Task>(`/iot/ota/task/get?id=${id}`);
+}
+
+/** 新增 OTA 升级任务 */
+export function createOtaTask(data: OtaTask) {
+  return requestClient.post('/iot/ota/task/create', data);
+}
+
+/** 修改 OTA 升级任务 */
+export function updateOtaTask(data: OtaTask) {
+  return requestClient.put('/iot/ota/task/update', data);
+}
+
+/** 删除 OTA 升级任务 */
+export function deleteOtaTask(id: number) {
+  return requestClient.delete(`/iot/ota/task/delete?id=${id}`);
+}
+
+/** 批量删除 OTA 升级任务 */
+export function deleteOtaTaskList(ids: number[]) {
+  return requestClient.delete('/iot/ota/task/delete-list', {
+    params: { ids: ids.join(',') },
+  });
+}
+
+/** 取消 OTA 升级任务 */
+export function cancelOtaTask(id: number) {
+  return requestClient.put(`/iot/ota/task/cancel?id=${id}`);
+}
+
+/** 启动 OTA 升级任务 */
+export function startOtaTask(id: number) {
+  return requestClient.put(`/iot/ota/task/start?id=${id}`);
+}
+
+/** 暂停 OTA 升级任务 */
+export function pauseOtaTask(id: number) {
+  return requestClient.put(`/iot/ota/task/pause?id=${id}`);
+}
+
+/** 恢复 OTA 升级任务 */
+export function resumeOtaTask(id: number) {
+  return requestClient.put(`/iot/ota/task/resume?id=${id}`);
+}
diff --git a/apps/web-antd/src/api/iot/iot/ota/task/record/index.ts b/apps/web-antd/src/api/iot/iot/ota/task/record/index.ts
new file mode 100644
index 0000000000000000000000000000000000000000..3ad7b0990d651fc9d2fd9a1e1e722c76a5d0b665
--- /dev/null
+++ b/apps/web-antd/src/api/iot/iot/ota/task/record/index.ts
@@ -0,0 +1,101 @@
+import type { PageParam, PageResult } from '@vben/request';
+
+import { requestClient } from '#/api/request';
+
+export namespace IoTOtaTaskRecordApi {
+  /** IoT OTA 升级任务记录 VO */
+  export interface TaskRecord {
+    id?: number;
+    taskId: number;
+    taskName?: string;
+    deviceId: number;
+    deviceName?: string;
+    firmwareId?: number;
+    firmwareName?: string;
+    firmwareVersion?: string;
+    status?: number;
+    progress?: number;
+    errorMessage?: string;
+    startTime?: Date;
+    endTime?: Date;
+    createTime?: Date;
+  }
+}
+
+/** IoT OTA 升级任务记录 */
+export interface OtaTaskRecord {
+  id?: number;
+  taskId?: number;
+  taskName?: string;
+  deviceId?: number;
+  deviceName?: string;
+  firmwareId?: number;
+  firmwareName?: string;
+  firmwareVersion?: string;
+  status?: number;
+  progress?: number;
+  errorMessage?: string;
+  startTime?: Date;
+  endTime?: Date;
+  createTime?: Date;
+}
+
+/** 查询 OTA 升级任务记录分页 */
+export function getOtaTaskRecordPage(params: PageParam) {
+  return requestClient.get<PageResult<IoTOtaTaskRecordApi.TaskRecord>>(
+    '/iot/ota/task/record/page',
+    { params },
+  );
+}
+
+/** 查询 OTA 升级任务记录详情 */
+export function getOtaTaskRecord(id: number) {
+  return requestClient.get<IoTOtaTaskRecordApi.TaskRecord>(
+    `/iot/ota/task/record/get?id=${id}`,
+  );
+}
+
+/** 根据任务 ID 查询记录列表 */
+export function getOtaTaskRecordListByTaskId(taskId: number) {
+  return requestClient.get<IoTOtaTaskRecordApi.TaskRecord[]>(
+    '/iot/ota/task/record/list-by-task-id',
+    { params: { taskId } },
+  );
+}
+
+/** 根据设备 ID 查询记录列表 */
+export function getOtaTaskRecordListByDeviceId(deviceId: number) {
+  return requestClient.get<IoTOtaTaskRecordApi.TaskRecord[]>(
+    '/iot/ota/task/record/list-by-device-id',
+    { params: { deviceId } },
+  );
+}
+
+/** 根据固件 ID 查询记录列表 */
+export function getOtaTaskRecordListByFirmwareId(firmwareId: number) {
+  return requestClient.get<IoTOtaTaskRecordApi.TaskRecord[]>(
+    '/iot/ota/task/record/list-by-firmware-id',
+    { params: { firmwareId } },
+  );
+}
+
+/** 重试升级任务记录 */
+export function retryOtaTaskRecord(id: number) {
+  return requestClient.put(`/iot/ota/task/record/retry?id=${id}`);
+}
+
+/** 取消升级任务记录 */
+export function cancelOtaTaskRecord(id: number) {
+  return requestClient.put(`/iot/ota/task/record/cancel?id=${id}`);
+}
+
+/** 获取升级任务记录状态统计 */
+export function getOtaTaskRecordStatusStatistics(
+  firmwareId?: number,
+  taskId?: number,
+) {
+  return requestClient.get<Record<string, number>>(
+    '/iot/ota/task/record/status-statistics',
+    { params: { firmwareId, taskId } },
+  );
+}
diff --git a/apps/web-antd/src/api/iot/iot/product/category/index.ts b/apps/web-antd/src/api/iot/iot/product/category/index.ts
new file mode 100644
index 0000000000000000000000000000000000000000..72f04b6b3c3f9e35af33246f69a53a81ce7504d7
--- /dev/null
+++ b/apps/web-antd/src/api/iot/iot/product/category/index.ts
@@ -0,0 +1,57 @@
+import type { PageParam, PageResult } from '@vben/request';
+
+import { requestClient } from '#/api/request';
+
+export namespace IotProductCategoryApi {
+  /** IoT 產品分類 VO */
+  export interface ProductCategory {
+    id?: number; // 分類 ID
+    name: string; // 分類名稱
+    parentId?: number; // 父级分類 ID
+    sort?: number; // 分類排序
+    status?: number; // 分類狀態
+    description?: string; // 分類描述
+    createTime?: string; // 創建時間
+  }
+}
+
+/** 查詢產品分類分頁 */
+export function getProductCategoryPage(params: PageParam) {
+  return requestClient.get<PageResult<IotProductCategoryApi.ProductCategory>>(
+    '/iot/product-category/page',
+    { params },
+  );
+}
+
+/** 查詢產品分類詳情 */
+export function getProductCategory(id: number) {
+  return requestClient.get<IotProductCategoryApi.ProductCategory>(
+    `/iot/product-category/get?id=${id}`,
+  );
+}
+
+/** 新增產品分類 */
+export function createProductCategory(
+  data: IotProductCategoryApi.ProductCategory,
+) {
+  return requestClient.post('/iot/product-category/create', data);
+}
+
+/** 修改產品分類 */
+export function updateProductCategory(
+  data: IotProductCategoryApi.ProductCategory,
+) {
+  return requestClient.put('/iot/product-category/update', data);
+}
+
+/** 刪除產品分類 */
+export function deleteProductCategory(id: number) {
+  return requestClient.delete(`/iot/product-category/delete?id=${id}`);
+}
+
+/** 獲取產品分類精簡列表 */
+export function getSimpleProductCategoryList() {
+  return requestClient.get<IotProductCategoryApi.ProductCategory[]>(
+    '/iot/product-category/simple-list',
+  );
+}
diff --git a/apps/web-antd/src/api/iot/iot/product/product/index.ts b/apps/web-antd/src/api/iot/iot/product/product/index.ts
new file mode 100644
index 0000000000000000000000000000000000000000..71bc3ade331345caa179c0d19dd6829f6d6a76d3
--- /dev/null
+++ b/apps/web-antd/src/api/iot/iot/product/product/index.ts
@@ -0,0 +1,99 @@
+import type { PageParam, PageResult } from '@vben/request';
+
+import { requestClient } from '#/api/request';
+
+export namespace IotProductApi {
+  /** IoT 产品 VO */
+  export interface Product {
+    id?: number; // 产品编号
+    name: string; // 产品名称
+    productKey?: string; // 产品标识
+    protocolId?: number; // 协议编号
+    protocolType?: number; // 接入协议类型
+    categoryId?: number; // 产品所属品类标识符
+    categoryName?: string; // 产品所属品类名称
+    icon?: string; // 产品图标
+    picUrl?: string; // 产品图片
+    description?: string; // 产品描述
+    status?: number; // 产品状态
+    deviceType?: number; // 设备类型
+    locationType?: number; // 定位类型
+    netType?: number; // 联网方式
+    codecType?: string; // 数据格式（编解码器类型）
+    dataFormat?: number; // 数据格式
+    validateType?: number; // 认证方式
+    deviceCount?: number; // 设备数量
+    createTime?: Date; // 创建时间
+  }
+}
+
+/** IOT 产品设备类型枚举类 */
+export enum DeviceTypeEnum {
+  DEVICE = 0, // 直连设备
+  GATEWAY = 2, // 网关设备
+  GATEWAY_SUB = 1, // 网关子设备
+}
+
+/** IOT 产品定位类型枚举类 */
+export enum LocationTypeEnum {
+  IP = 1, // IP 定位
+  MANUAL = 3, // 手动定位
+  MODULE = 2, // 设备定位
+}
+
+/** IOT 数据格式（编解码器类型）枚举类 */
+export enum CodecTypeEnum {
+  ALINK = 'Alink', // 阿里云 Alink 协议
+}
+
+/** 查询产品分页 */
+export function getProductPage(params: PageParam) {
+  return requestClient.get<PageResult<IotProductApi.Product>>(
+    '/iot/product/page',
+    { params },
+  );
+}
+
+/** 查询产品详情 */
+export function getProduct(id: number) {
+  return requestClient.get<IotProductApi.Product>(`/iot/product/get?id=${id}`);
+}
+
+/** 新增产品 */
+export function createProduct(data: IotProductApi.Product) {
+  return requestClient.post('/iot/product/create', data);
+}
+
+/** 修改产品 */
+export function updateProduct(data: IotProductApi.Product) {
+  return requestClient.put('/iot/product/update', data);
+}
+
+/** 删除产品 */
+export function deleteProduct(id: number) {
+  return requestClient.delete(`/iot/product/delete?id=${id}`);
+}
+
+/** 导出产品 Excel */
+export function exportProduct(params: any) {
+  return requestClient.download('/iot/product/export-excel', { params });
+}
+
+/** 更新产品状态 */
+export function updateProductStatus(id: number, status: number) {
+  return requestClient.put(
+    `/iot/product/update-status?id=${id}&status=${status}`,
+  );
+}
+
+/** 查询产品（精简）列表 */
+export function getSimpleProductList() {
+  return requestClient.get<IotProductApi.Product[]>('/iot/product/simple-list');
+}
+
+/** 根据 ProductKey 获取产品信息 */
+export function getProductByKey(productKey: string) {
+  return requestClient.get<IotProductApi.Product>('/iot/product/get-by-key', {
+    params: { productKey },
+  });
+}
diff --git a/apps/web-antd/src/api/iot/iot/rule/data/rule/index.ts b/apps/web-antd/src/api/iot/iot/rule/data/rule/index.ts
new file mode 100644
index 0000000000000000000000000000000000000000..55e50184ac61377b8f9873098c7c27382a6e341a
--- /dev/null
+++ b/apps/web-antd/src/api/iot/iot/rule/data/rule/index.ts
@@ -0,0 +1,83 @@
+import type { PageParam, PageResult } from '@vben/request';
+
+import { requestClient } from '#/api/request';
+
+export namespace DataRuleApi {
+  /** IoT 数据流转规则 VO */
+  export interface Rule {
+    id?: number;
+    name: string;
+    description?: string;
+    status?: number;
+    productId?: number;
+    productKey?: string;
+    sourceConfigs?: SourceConfig[];
+    sinkIds?: number[];
+    createTime?: Date;
+  }
+
+  /** IoT 数据源配置 */
+  export interface SourceConfig {
+    productId?: number;
+    productKey?: string;
+    deviceId?: number;
+    type?: string;
+    topic?: string;
+  }
+}
+
+/** IoT 数据流转规则 */
+export interface DataRule {
+  id?: number;
+  name?: string;
+  description?: string;
+  status?: number;
+  productId?: number;
+  productKey?: string;
+  sourceConfigs?: any[];
+  sinkIds?: number[];
+  createTime?: Date;
+}
+
+/** 查询数据流转规则分页 */
+export function getDataRulePage(params: PageParam) {
+  return requestClient.get<PageResult<DataRuleApi.Rule>>(
+    '/iot/data-rule/page',
+    { params },
+  );
+}
+
+/** 查询数据流转规则详情 */
+export function getDataRule(id: number) {
+  return requestClient.get<DataRuleApi.Rule>(`/iot/data-rule/get?id=${id}`);
+}
+
+/** 新增数据流转规则 */
+export function createDataRule(data: DataRule) {
+  return requestClient.post('/iot/data-rule/create', data);
+}
+
+/** 修改数据流转规则 */
+export function updateDataRule(data: DataRule) {
+  return requestClient.put('/iot/data-rule/update', data);
+}
+
+/** 删除数据流转规则 */
+export function deleteDataRule(id: number) {
+  return requestClient.delete(`/iot/data-rule/delete?id=${id}`);
+}
+
+/** 批量删除数据流转规则 */
+export function deleteDataRuleList(ids: number[]) {
+  return requestClient.delete('/iot/data-rule/delete-list', {
+    params: { ids: ids.join(',') },
+  });
+}
+
+/** 更新数据流转规则状态 */
+export function updateDataRuleStatus(id: number, status: number) {
+  return requestClient.put(`/iot/data-rule/update-status`, {
+    id,
+    status,
+  });
+}
diff --git a/apps/web-antd/src/api/iot/iot/rule/data/sink/index.ts b/apps/web-antd/src/api/iot/iot/rule/data/sink/index.ts
new file mode 100644
index 0000000000000000000000000000000000000000..4614c2a6e6a9747efd0e23f55de1748bc0af97bd
--- /dev/null
+++ b/apps/web-antd/src/api/iot/iot/rule/data/sink/index.ts
@@ -0,0 +1,148 @@
+import type { PageParam, PageResult } from '@vben/request';
+
+import { requestClient } from '#/api/request';
+
+export namespace DataSinkApi {
+  /** IoT 数据流转目的 VO */
+  export interface Sink {
+    id?: number;
+    name: string;
+    description?: string;
+    status?: number;
+    type: string;
+    config?: any;
+    createTime?: Date;
+  }
+}
+
+/** IoT 数据流转目的 */
+export interface DataSinkVO {
+  id?: number;
+  name?: string;
+  description?: string;
+  status?: number;
+  type?: string;
+  config?: any;
+  createTime?: Date;
+}
+
+/** IoT 数据目的类型枚举 */
+export enum IotDataSinkTypeEnum {
+  HTTP = 'HTTP',
+  KAFKA = 'KAFKA',
+  MQTT = 'MQTT',
+  RABBITMQ = 'RABBITMQ',
+  REDIS_STREAM = 'REDIS_STREAM',
+  ROCKETMQ = 'ROCKETMQ',
+}
+
+/** HTTP 配置 */
+export interface HttpConfig {
+  url?: string;
+  method?: string;
+  headers?: Record<string, string>;
+  timeout?: number;
+}
+
+/** MQTT 配置 */
+export interface MqttConfig {
+  broker?: string;
+  port?: number;
+  topic?: string;
+  username?: string;
+  password?: string;
+  clientId?: string;
+  qos?: number;
+}
+
+/** Kafka 配置 */
+export interface KafkaMQConfig {
+  bootstrapServers?: string;
+  topic?: string;
+  acks?: string;
+  retries?: number;
+  batchSize?: number;
+}
+
+/** RabbitMQ 配置 */
+export interface RabbitMQConfig {
+  host?: string;
+  port?: number;
+  virtualHost?: string;
+  username?: string;
+  password?: string;
+  exchange?: string;
+  routingKey?: string;
+  queue?: string;
+}
+
+/** RocketMQ 配置 */
+export interface RocketMQConfig {
+  nameServer?: string;
+  topic?: string;
+  tag?: string;
+  producerGroup?: string;
+}
+
+/** Redis Stream 配置 */
+export interface RedisStreamMQConfig {
+  host?: string;
+  port?: number;
+  password?: string;
+  database?: number;
+  streamKey?: string;
+  maxLen?: number;
+}
+
+/** 查询数据流转目的分页 */
+export function getDataSinkPage(params: PageParam) {
+  return requestClient.get<PageResult<DataSinkApi.Sink>>(
+    '/iot/data-sink/page',
+    { params },
+  );
+}
+
+/** 查询数据流转目的详情 */
+export function getDataSink(id: number) {
+  return requestClient.get<DataSinkApi.Sink>(`/iot/data-sink/get?id=${id}`);
+}
+
+/** 查询所有数据流转目的列表 */
+export function getDataSinkList() {
+  return requestClient.get<DataSinkApi.Sink[]>('/iot/data-sink/list');
+}
+
+/** 查询数据流转目的简单列表 */
+export function getDataSinkSimpleList() {
+  return requestClient.get<DataSinkApi.Sink[]>('/iot/data-sink/simple-list');
+}
+
+/** 新增数据流转目的 */
+export function createDataSink(data: DataSinkVO) {
+  return requestClient.post('/iot/data-sink/create', data);
+}
+
+/** 修改数据流转目的 */
+export function updateDataSink(data: DataSinkVO) {
+  return requestClient.put('/iot/data-sink/update', data);
+}
+
+/** 删除数据流转目的 */
+export function deleteDataSink(id: number) {
+  return requestClient.delete(`/iot/data-sink/delete?id=${id}`);
+}
+
+/** 批量删除数据流转目的 */
+export function deleteDataSinkList(ids: number[]) {
+  return requestClient.delete('/iot/data-sink/delete-list', {
+    params: { ids: ids.join(',') },
+  });
+}
+
+/** 更新数据流转目的状态 */
+export function updateDataSinkStatus(id: number, status: number) {
+  return requestClient.put(`/iot/data-sink/update-status`, {
+    id,
+    status,
+  });
+}
diff --git a/apps/web-antd/src/api/iot/iot/rule/scene/index.ts b/apps/web-antd/src/api/iot/iot/rule/scene/index.ts
new file mode 100644
index 0000000000000000000000000000000000000000..5fc3224e19b00ea87c36046665f1ca902df092dc
--- /dev/null
+++ b/apps/web-antd/src/api/iot/iot/rule/scene/index.ts
@@ -0,0 +1,156 @@
+import type { PageParam, PageResult } from '@vben/request';
+
+import { requestClient } from '#/api/request';
+
+export namespace RuleSceneApi {
+  /** IoT 场景联动规则 VO */
+  export interface SceneRule {
+    id?: number;
+    name: string;
+    description?: string;
+    status?: number;
+    triggers?: Trigger[];
+    actions?: Action[];
+    createTime?: Date;
+  }
+
+  /** IoT 场景联动规则触发器 */
+  export interface Trigger {
+    type?: string;
+    productId?: number;
+    deviceId?: number;
+    identifier?: string;
+    operator?: string;
+    value?: any;
+    cronExpression?: string;
+    conditionGroups?: TriggerConditionGroup[];
+  }
+
+  /** IoT 场景联动规则触发条件组 */
+  export interface TriggerConditionGroup {
+    conditions?: TriggerCondition[];
+    operator?: string;
+  }
+
+  /** IoT 场景联动规则触发条件 */
+  export interface TriggerCondition {
+    productId?: number;
+    deviceId?: number;
+    identifier?: string;
+    operator?: string;
+    value?: any;
+    type?: string;
+  }
+
+  /** IoT 场景联动规则动作 */
+  export interface Action {
+    type?: string;
+    productId?: number;
+    deviceId?: number;
+    identifier?: string;
+    value?: any;
+    alertConfigId?: number;
+  }
+}
+
+/** IoT 场景联动规则 */
+export interface IotSceneRule {
+  id?: number;
+  name?: string;
+  description?: string;
+  status?: number;
+  triggers?: Trigger[];
+  actions?: Action[];
+  createTime?: Date;
+}
+
+/** IoT 场景联动规则触发器 */
+export interface Trigger {
+  type?: string;
+  productId?: number;
+  deviceId?: number;
+  identifier?: string;
+  operator?: string;
+  value?: any;
+  cronExpression?: string;
+  conditionGroups?: TriggerConditionGroup[];
+}
+
+/** IoT 场景联动规则触发条件组 */
+export interface TriggerConditionGroup {
+  conditions?: TriggerCondition[];
+  operator?: string;
+}
+
+/** IoT 场景联动规则触发条件 */
+export interface TriggerCondition {
+  productId?: number;
+  deviceId?: number;
+  identifier?: string;
+  operator?: string;
+  value?: any;
+  type?: string;
+  param?: string;
+}
+
+/** IoT 场景联动规则动作 */
+export interface Action {
+  type?: string;
+  productId?: number;
+  deviceId?: number;
+  identifier?: string;
+  value?: any;
+  alertConfigId?: number;
+}
+
+/** 查询场景联动规则分页 */
+export function getSceneRulePage(params: PageParam) {
+  return requestClient.get<PageResult<RuleSceneApi.SceneRule>>(
+    '/iot/scene-rule/page',
+    { params },
+  );
+}
+
+/** 查询场景联动规则详情 */
+export function getSceneRule(id: number) {
+  return requestClient.get<RuleSceneApi.SceneRule>(
+    `/iot/scene-rule/get?id=${id}`,
+  );
+}
+
+/** 新增场景联动规则 */
+export function createSceneRule(data: IotSceneRule) {
+  return requestClient.post('/iot/scene-rule/create', data);
+}
+
+/** 修改场景联动规则 */
+export function updateSceneRule(data: IotSceneRule) {
+  return requestClient.put('/iot/scene-rule/update', data);
+}
+
+/** 删除场景联动规则 */
+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`, {
+    id,
+    status,
+  });
+}
+
+/** 获取场景联动规则简单列表 */
+export function getSimpleRuleSceneList() {
+  return requestClient.get<RuleSceneApi.SceneRule[]>(
+    '/iot/scene-rule/simple-list',
+  );
+}
diff --git a/apps/web-antd/src/api/iot/iot/statistics/index.ts b/apps/web-antd/src/api/iot/iot/statistics/index.ts
new file mode 100644
index 0000000000000000000000000000000000000000..588eefcc4425d90485159b13fbc4d595bedc6285
--- /dev/null
+++ b/apps/web-antd/src/api/iot/iot/statistics/index.ts
@@ -0,0 +1,69 @@
+import { requestClient } from '#/api/request';
+
+export namespace IotStatisticsApi {
+  /** IoT 统计摘要数据 */
+  export interface StatisticsSummary {
+    productCategoryCount: number;
+    productCount: number;
+    deviceCount: number;
+    deviceMessageCount: number;
+    productCategoryTodayCount: number;
+    productTodayCount: number;
+    deviceTodayCount: number;
+    deviceMessageTodayCount: number;
+    deviceOnlineCount: number;
+    deviceOfflineCount: number;
+    deviceInactiveCount: number;
+    productCategoryDeviceCounts: Record<string, number>;
+  }
+
+  /** 时间戳-数值的键值对类型 */
+  export interface TimeValueItem {
+    [key: string]: number;
+  }
+
+  /** IoT 消息统计数据类型 */
+  export interface DeviceMessageSummary {
+    statType: number;
+    upstreamCounts: TimeValueItem[];
+    downstreamCounts: TimeValueItem[];
+  }
+
+  /** 消息统计数据项（按日期） */
+  export interface DeviceMessageSummaryByDate {
+    time: string;
+    upstreamCount: number;
+    downstreamCount: number;
+  }
+
+  /** 消息统计接口参数 */
+  export interface DeviceMessageReq {
+    interval: number;
+    times?: string[];
+  }
+}
+
+/** 获取 IoT 统计摘要数据 */
+export function getStatisticsSummary() {
+  return requestClient.get<IotStatisticsApi.StatisticsSummary>(
+    '/iot/statistics/get-summary',
+  );
+}
+
+/** 获取设备消息的数据统计（按日期） */
+export function getDeviceMessageSummaryByDate(
+  params: IotStatisticsApi.DeviceMessageReq,
+) {
+  return requestClient.get<IotStatisticsApi.DeviceMessageSummaryByDate[]>(
+    '/iot/statistics/get-device-message-summary-by-date',
+    { params },
+  );
+}
+
+/** 获取设备消息统计摘要 */
+export function getDeviceMessageSummary(statType: number) {
+  return requestClient.get<IotStatisticsApi.DeviceMessageSummary>(
+    '/iot/statistics/get-device-message-summary',
+    { params: { statType } },
+  );
+}
diff --git a/apps/web-antd/src/api/iot/iot/thingmodel/index.ts b/apps/web-antd/src/api/iot/iot/thingmodel/index.ts
new file mode 100644
index 0000000000000000000000000000000000000000..3540887049897867a38b4d44cab32c6341daf489
--- /dev/null
+++ b/apps/web-antd/src/api/iot/iot/thingmodel/index.ts
@@ -0,0 +1,201 @@
+import type { PageParam, PageResult } from '@vben/request';
+
+import { requestClient } from '#/api/request';
+
+export namespace ThingModelApi {
+  /** IoT 物模型数据 VO */
+  export interface ThingModel {
+    id?: number;
+    productId?: number;
+    productKey?: string;
+    identifier: string;
+    name: string;
+    desc?: string;
+    type: string;
+    property?: ThingModelProperty;
+    event?: ThingModelEvent;
+    service?: ThingModelService;
+  }
+
+  /** IoT 物模型属性 */
+  export interface Property {
+    identifier: string;
+    name: string;
+    accessMode: string;
+    dataType: string;
+    dataSpecs?: any;
+    dataSpecsList?: any[];
+    desc?: string;
+  }
+
+  /** IoT 物模型服务 */
+  export interface Service {
+    identifier: string;
+    name: string;
+    callType: string;
+    inputData?: any[];
+    outputData?: any[];
+    desc?: string;
+  }
+
+  /** IoT 物模型事件 */
+  export interface Event {
+    identifier: string;
+    name: string;
+    type: string;
+    outputData?: any[];
+    desc?: string;
+  }
+}
+
+/** IoT 物模型数据 */
+export interface ThingModelData {
+  id?: number;
+  productId?: number;
+  productKey?: string;
+  identifier?: string;
+  name?: string;
+  desc?: string;
+  type?: string;
+  dataType?: string;
+  property?: ThingModelProperty;
+  event?: ThingModelEvent;
+  service?: ThingModelService;
+}
+
+/** IoT 物模型属性 */
+export interface ThingModelProperty {
+  identifier?: string;
+  name?: string;
+  accessMode?: string;
+  dataType?: string;
+  dataSpecs?: any;
+  dataSpecsList?: any[];
+  desc?: string;
+}
+
+/** IoT 物模型服务 */
+export interface ThingModelService {
+  identifier?: string;
+  name?: string;
+  callType?: string;
+  inputData?: any[];
+  outputData?: any[];
+  desc?: string;
+}
+
+/** IoT 物模型事件 */
+export interface ThingModelEvent {
+  identifier?: string;
+  name?: string;
+  type?: string;
+  outputData?: any[];
+  desc?: string;
+}
+
+/** IoT 数据定义（数值型） */
+export interface DataSpecsNumberData {
+  min?: number | string;
+  max?: number | string;
+  step?: number | string;
+  unit?: string;
+  unitName?: string;
+}
+
+/** IoT 数据定义（枚举/布尔型） */
+export interface DataSpecsEnumOrBoolData {
+  value: number | string;
+  name: string;
+}
+
+/** IoT 物模型表单校验规则 */
+export interface ThingModelFormRules {
+  [key: string]: any;
+}
+
+/** 验证布尔型名称 */
+export function validateBoolName(_rule: any, value: any, callback: any) {
+  if (value) {
+    callback();
+  } else {
+    callback(new Error('枚举描述不能为空'));
+  }
+}
+
+/** 查询产品物模型分页 */
+export function getThingModelPage(params: PageParam) {
+  return requestClient.get<PageResult<ThingModelApi.ThingModel>>(
+    '/iot/thing-model/page',
+    { params },
+  );
+}
+
+/** 查询产品物模型详情 */
+export function getThingModel(id: number) {
+  return requestClient.get<ThingModelApi.ThingModel>(
+    `/iot/thing-model/get?id=${id}`,
+  );
+}
+
+/** 根据产品 ID 查询物模型列表 */
+export function getThingModelListByProductId(productId: number) {
+  return requestClient.get<ThingModelApi.ThingModel[]>(
+    '/iot/thing-model/list-by-product-id',
+    { params: { productId } },
+  );
+}
+
+/** 根据产品标识查询物模型列表 */
+export function getThingModelListByProductKey(productKey: string) {
+  return requestClient.get<ThingModelApi.ThingModel[]>(
+    '/iot/thing-model/list-by-product-key',
+    { params: { productKey } },
+  );
+}
+
+/** 新增物模型 */
+export function createThingModel(data: ThingModelData) {
+  return requestClient.post('/iot/thing-model/create', data);
+}
+
+/** 修改物模型 */
+export function updateThingModel(data: ThingModelData) {
+  return requestClient.put('/iot/thing-model/update', data);
+}
+
+/** 删除物模型 */
+export function deleteThingModel(id: number) {
+  return requestClient.delete(`/iot/thing-model/delete?id=${id}`);
+}
+
+/** 批量删除物模型 */
+export function deleteThingModelList(ids: number[]) {
+  return requestClient.delete('/iot/thing-model/delete-list', {
+    params: { ids: ids.join(',') },
+  });
+}
+
+/** 获取物模型 TSL */
+export function getThingModelTSL(productId: number) {
+  return requestClient.get<ThingModelApi.ThingModel[]>(
+    '/iot/thing-model/get-tsl',
+    { params: { productId } },
+  );
+}
+
+/** 导入物模型 TSL
+export function importThingModelTSL(productId: number, tslData: any) {
+  return requestClient.post('/iot/thing-model/import-tsl', {
+    productId,
+    tslData,
+  });
+}
+ */
+
+/** 导出物模型 TSL
+export function exportThingModelTSL(productId: number) {
+  return requestClient.get<any>('/iot/thing-model/export-tsl', {
+    params: { productId },
+  });
+}
+ */
diff --git a/apps/web-antd/src/api/iot/thingmodel/index.ts b/apps/web-antd/src/api/iot/thingmodel/index.ts
index 341e0964e361bbbbbe94a9f568d0c0f36239215d..3540887049897867a38b4d44cab32c6341daf489 100644
--- a/apps/web-antd/src/api/iot/thingmodel/index.ts
+++ b/apps/web-antd/src/api/iot/thingmodel/index.ts
@@ -175,17 +175,27 @@ export function deleteThingModelList(ids: number[]) {
   });
 }
 
-/** 导入物模型 TSL */
+/** 获取物模型 TSL */
+export function getThingModelTSL(productId: number) {
+  return requestClient.get<ThingModelApi.ThingModel[]>(
+    '/iot/thing-model/get-tsl',
+    { params: { productId } },
+  );
+}
+
+/** 导入物模型 TSL
 export function importThingModelTSL(productId: number, tslData: any) {
   return requestClient.post('/iot/thing-model/import-tsl', {
     productId,
     tslData,
   });
 }
+ */
 
-/** 导出物模型 TSL */
+/** 导出物模型 TSL
 export function exportThingModelTSL(productId: number) {
   return requestClient.get<any>('/iot/thing-model/export-tsl', {
     params: { productId },
   });
 }
+ */
diff --git a/apps/web-antd/src/views/iot/alert/config/index.vue b/apps/web-antd/src/views/iot/alert/config/index.vue
index 4797250dcc6185134020fc659ed513c33d4a2fb3..0e25afb69fd320352e83f649c4a40aa735cf5a6d 100644
--- a/apps/web-antd/src/views/iot/alert/config/index.vue
+++ b/apps/web-antd/src/views/iot/alert/config/index.vue
@@ -21,7 +21,7 @@ const [FormModal, formModalApi] = useVbenModal({
 });
 
 /** 刷新表格 */
-function handleRefresh() {
+function onRefresh() {
   gridApi.query();
 }
 
@@ -82,7 +82,7 @@ async function handleDelete(row: AlertConfigApi.AlertConfig) {
     message.success({
       content: $t('ui.actionMessage.deleteSuccess', [row.name]),
     });
-    handleRefresh();
+    onRefresh();
   } finally {
     hideLoading();
   }
@@ -121,7 +121,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
 
 <template>
   <Page auto-content-height>
-    <FormModal @success="handleRefresh" />
+    <FormModal @success="onRefresh" />
     <Grid table-title="告警配置列表">
       <template #toolbar-tools>
         <TableAction
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 64ba6cfacd9e7659d6b9f32abc2e0c0a76c1404c..4492483b04eb916f6f53b04ace2cac8f374484e7 100644
--- a/apps/web-antd/src/views/iot/alert/record/index.vue
+++ b/apps/web-antd/src/views/iot/alert/record/index.vue
@@ -22,7 +22,7 @@ const productList = ref<any[]>([]);
 const deviceList = ref<any[]>([]);
 
 /** 刷新表格 */
-function handleRefresh() {
+function onRefresh() {
   gridApi.query();
 }
 
@@ -101,7 +101,7 @@ async function handleProcess(row: AlertRecord) {
       try {
         await processAlertRecord(row.id as number, processRemark);
         message.success('处理成功');
-        handleRefresh();
+        onRefresh();
       } catch (error) {
         console.error('处理失败:', error);
         throw error;
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 e825055dc41655b0e46d52389fc6409d688a4da9..86996ceae58a16e3670e8336c9f416298ac2e4fd 100644
--- a/apps/web-antd/src/views/iot/device/device/data.ts
+++ b/apps/web-antd/src/views/iot/device/device/data.ts
@@ -113,16 +113,16 @@ export function useFormSchema(): VbenFormSchema[] {
         .optional()
         .or(z.literal('')),
     },
-    // {
-    //   fieldName: 'locationType',
-    //   label: '定位类型',
-    //   component: 'RadioGroup',
-    //   componentProps: {
-    //     options: getDictOptions(DICT_TYPE.IOT_LOCATION_TYPE, 'number'),
-    //     buttonStyle: 'solid',
-    //     optionType: 'button',
-    //   },
-    // },
+    {
+      fieldName: 'locationType',
+      label: '定位类型',
+      component: 'RadioGroup',
+      componentProps: {
+        options: getDictOptions(DICT_TYPE.IOT_LOCATION_TYPE, 'number'),
+        buttonStyle: 'solid',
+        optionType: 'button',
+      },
+    },
     {
       fieldName: 'longitude',
       label: '设备经度',
diff --git a/apps/web-antd/src/views/iot/device/device/modules/DeviceForm.vue b/apps/web-antd/src/views/iot/device/device/modules/DeviceForm.vue
index 39fe16a999d76a4c944c2f5bb4698f0f4491ea31..050376a8de8d78f6c9a841f0235c3636736039ff 100644
--- a/apps/web-antd/src/views/iot/device/device/modules/DeviceForm.vue
+++ b/apps/web-antd/src/views/iot/device/device/modules/DeviceForm.vue
@@ -1,13 +1,15 @@
 <script setup lang="ts">
-import type { IotDeviceApi } from '#/api/iot/device/device';
-
 import { computed, ref } from 'vue';
 
-import { useVbenForm, useVbenModal } from '@vben/common-ui';
-
 import { message } from 'ant-design-vue';
+import { useVbenForm, useVbenModal } from '@vben/common-ui';
 
-import { createDevice, getDevice, updateDevice } from '#/api/iot/device/device';
+import {
+  createDevice,
+  getDevice,
+  updateDevice,
+  type IotDeviceApi
+} from '#/api/iot/device/device';
 import { $t } from '#/locales';
 
 import { useFormSchema } from '../data';
diff --git a/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailConfig.vue b/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailConfig.vue
index 6dd12c0a693a42f42169c099bab7951185cb31e2..61aeed88a1c419046d67823593b526b4b001e0c2 100644
--- a/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailConfig.vue
+++ b/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailConfig.vue
@@ -2,9 +2,9 @@
 <script lang="ts" setup>
 import type { IotDeviceApi } from '#/api/iot/device/device';
 
-import { ref, watchEffect } from 'vue';
+import { computed, ref, watchEffect } from 'vue';
 
-import { Alert, Button, message } from 'ant-design-vue';
+import { Alert, Button, message, Textarea } from 'ant-design-vue';
 
 import { sendDeviceMessage, updateDevice } from '#/api/iot/device/device';
 import { IotDeviceMessageMethodEnum } from '#/views/iot/utils/constants';
@@ -22,41 +22,68 @@ const emit = defineEmits<{
 const loading = ref(false); // 加载中
 const pushLoading = ref(false); // 推送加载中
 const config = ref<any>({}); // 只存储 config 字段
-const hasJsonError = ref(false); // 是否有 JSON 格式错误
+const configString = ref(''); // 用于编辑器的字符串格式
 
 /** 监听 props.device 的变化，只更新 config 字段 */
 watchEffect(() => {
   try {
     config.value = props.device.config ? JSON.parse(props.device.config) : {};
+    // 将对象转换为格式化的 JSON 字符串
+    configString.value = JSON.stringify(config.value, null, 2);
   } catch {
     config.value = {};
+    configString.value = '{}';
   }
 });
 
 const isEditing = ref(false); // 编辑状态
+
+/** 格式化的配置用于只读展示 */
+const formattedConfig = computed(() => {
+  try {
+    if (typeof config.value === 'string') {
+      return JSON.stringify(JSON.parse(config.value), null, 2);
+    }
+    return JSON.stringify(config.value, null, 2);
+  } catch {
+    return JSON.stringify(config.value, null, 2);
+  }
+});
+
+/** 判断配置是否有数据 */
+const hasConfigData = computed(() => {
+  return config.value && Object.keys(config.value).length > 0;
+});
+
 /** 启用编辑模式的函数 */
 function enableEdit() {
   isEditing.value = true;
-  hasJsonError.value = false; // 重置错误状态
+  // 重新同步编辑器内容
+  configString.value = JSON.stringify(config.value, null, 2);
 }
 
 /** 取消编辑的函数 */
 function cancelEdit() {
   try {
     config.value = props.device.config ? JSON.parse(props.device.config) : {};
+    configString.value = JSON.stringify(config.value, null, 2);
   } catch {
     config.value = {};
+    configString.value = '{}';
   }
   isEditing.value = false;
-  hasJsonError.value = false; // 重置错误状态
 }
 
 /** 保存配置的函数 */
 async function saveConfig() {
-  if (hasJsonError.value) {
+  // 验证 JSON 格式
+  try {
+    config.value = JSON.parse(configString.value);
+  } catch (error) {
     message.error({ content: 'JSON格式错误，请修正后再提交！' });
     return;
   }
+
   await updateDeviceConfig();
   isEditing.value = false;
 }
@@ -102,39 +129,26 @@ async function updateDeviceConfig() {
     loading.value = false;
   }
 }
-
-/** 处理 JSON 编辑器错误的函数 */
-function onError(errors: any) {
-  if (!errors || (Array.isArray(errors) && errors.length === 0)) {
-    hasJsonError.value = false;
-    return;
-  }
-  hasJsonError.value = true;
-}
 </script>
 
 <template>
   <div>
+    <!-- 只在没有配置数据时显示提示 -->
     <Alert
+      v-if="!hasConfigData"
       message="支持远程更新设备的配置文件(JSON 格式)，可以在下方编辑配置模板，对设备的系统参数、网络参数等进行远程配置。配置完成后，需点击「下发」按钮，设备即可进行远程配置。"
       type="info"
       show-icon
       class="my-4"
       description="如需编辑文件，请点击下方编辑按钮"
     />
-    <JsonEditor
-      v-model="config"
-      :mode="isEditing ? 'code' : 'view'"
-      height="600px"
-      @error="onError"
-    />
     <div class="mt-5 text-center">
       <Button v-if="isEditing" @click="cancelEdit">取消</Button>
       <Button
         v-if="isEditing"
         type="primary"
         @click="saveConfig"
-        :disabled="hasJsonError"
+        :loading="loading"
       >
         保存
       </Button>
@@ -148,5 +162,47 @@ function onError(errors: any) {
         配置推送
       </Button>
     </div>
+
+    <!-- 代码视图 - 只读展示 -->
+    <div v-if="!isEditing" class="json-viewer-container">
+      <pre class="json-code"><code>{{ formattedConfig }}</code></pre>
+    </div>
+
+    <!-- 编辑器视图 - 可编辑 -->
+    <Textarea
+      v-else
+      v-model:value="configString"
+      :rows="20"
+      placeholder="请输入 JSON 格式的配置信息"
+      class="json-editor"
+    />
+
+
   </div>
 </template>
+
+<style scoped>
+.json-viewer-container {
+  background-color: #f5f5f5;
+  border: 1px solid #d9d9d9;
+  border-radius: 4px;
+  padding: 12px;
+  max-height: 600px;
+  overflow-y: auto;
+}
+
+.json-code {
+  margin: 0;
+  font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', monospace;
+  font-size: 13px;
+  line-height: 1.5;
+  color: #333;
+  white-space: pre-wrap;
+  word-wrap: break-word;
+}
+
+.json-editor {
+  font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', monospace;
+  font-size: 13px;
+}
+</style>
diff --git a/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsInfo.vue b/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsInfo.vue
index aced9b29063d40195b279781c659def885e78a23..d4b6b06cb815dbfbbac758edd491b4812b653001 100644
--- a/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsInfo.vue
+++ b/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsInfo.vue
@@ -85,7 +85,7 @@ function handleAuthInfoDialogClose() {
               <span>设备信息</span>
             </div>
           </template>
-          <Descriptions :column="1" bordered>
+          <Descriptions :column="1" bordered size="small">
             <Descriptions.Item label="产品名称">
               {{ product.name }}
             </Descriptions.Item>
diff --git a/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsMessage.vue b/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsMessage.vue
index 20f8f150a96741af982586ee264b4da7ac744195..6a3760e76c38d00f6652a2739acb6efd72bfa123 100644
--- a/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsMessage.vue
+++ b/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsMessage.vue
@@ -1,28 +1,109 @@
 <!-- 设备消息列表 -->
+<template>
+  <ContentWrap>
+    <!-- 搜索区域 -->
+    <Form :model="queryParams" layout="inline">
+      <Form.Item>
+        <Select
+          v-model:value="queryParams.method"
+          placeholder="所有方法"
+          style="width: 160px"
+          allow-clear
+        >
+          <Select.Option
+            v-for="item in methodOptions"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          >
+            {{ item.label }}
+          </Select.Option>
+        </Select>
+      </Form.Item>
+      <Form.Item>
+        <Select
+          v-model:value="queryParams.upstream"
+          placeholder="上行/下行"
+          style="width: 160px"
+          allow-clear
+        >
+          <Select.Option label="上行" value="true">上行</Select.Option>
+          <Select.Option label="下行" value="false">下行</Select.Option>
+        </Select>
+      </Form.Item>
+      <Form.Item>
+        <Button type="primary" @click="handleQuery">
+          <IconifyIcon icon="ep:search" class="mr-5px" /> 搜索
+        </Button>
+        <Switch
+          v-model:checked="autoRefresh"
+          class="ml-20px"
+          checked-children="定时刷新"
+          un-checked-children="定时刷新"
+        />
+      </Form.Item>
+    </Form>
+
+    <!-- 消息列表 -->
+    <Table
+      :loading="loading"
+      :data-source="list"
+      :columns="columns"
+      :pagination="false"
+      class="whitespace-nowrap"
+    >
+      <template #bodyCell="{ column, record }">
+        <template v-if="column.key === 'ts'">
+          {{ formatDate(record.ts) }}
+        </template>
+        <template v-else-if="column.key === 'upstream'">
+          <Tag :color="record.upstream ? 'blue' : 'green'">
+            {{ record.upstream ? '上行' : '下行' }}
+          </Tag>
+        </template>
+        <template v-else-if="column.key === 'reply'">
+          <DictTag
+            :type="DICT_TYPE.INFRA_BOOLEAN_STRING"
+            :value="record.reply"
+          />
+        </template>
+        <template v-else-if="column.key === 'method'">
+          {{
+            methodOptions.find((item) => item.value === record.method)?.label
+          }}
+        </template>
+        <template v-else-if="column.key === 'params'">
+          <span v-if="record.reply">
+            {{
+              `{"code":${record.code},"msg":"${record.msg}","data":${record.data}\}`
+            }}
+          </span>
+          <span v-else>{{ record.params }}</span>
+        </template>
+      </template>
+    </Table>
+
+    <!-- 分页 -->
+    <div class="mt-10px flex justify-end">
+      <Pagination
+        :total="total"
+        v-model:page="queryParams.pageNo"
+        v-model:limit="queryParams.pageSize"
+        @pagination="getMessageList"
+      />
+    </div>
+  </ContentWrap>
+</template>
+
 <script setup lang="ts">
-import {
-  computed,
-  onBeforeUnmount,
-  onMounted,
-  reactive,
-  ref,
-  watch,
-} from 'vue';
+import { computed, onBeforeUnmount, onMounted, reactive, ref, watch } from 'vue';
 
 import { ContentWrap } from '@vben/common-ui';
 import { DICT_TYPE } from '@vben/constants';
 import { IconifyIcon } from '@vben/icons';
 import { formatDate } from '@vben/utils';
 
-import {
-  Button,
-  Form,
-  Pagination,
-  Select,
-  Switch,
-  Table,
-  Tag,
-} from 'ant-design-vue';
+import { Button, Form, Pagination, Select, Switch, Table, Tag } from 'ant-design-vue';
 
 import { getDeviceMessagePage } from '#/api/iot/device/device';
 import { DictTag } from '#/components/dict-tag';
@@ -62,42 +143,48 @@ const columns = [
     title: '时间',
     dataIndex: 'ts',
     key: 'ts',
+    align: 'center' as const,
     width: 180,
   },
   {
     title: '上行/下行',
     dataIndex: 'upstream',
     key: 'upstream',
+    align: 'center' as const,
     width: 140,
   },
   {
     title: '是否回复',
     dataIndex: 'reply',
     key: 'reply',
+    align: 'center' as const,
     width: 140,
   },
   {
     title: '请求编号',
     dataIndex: 'requestId',
     key: 'requestId',
+    align: 'center' as const,
     width: 300,
   },
   {
     title: '请求方法',
     dataIndex: 'method',
     key: 'method',
+    align: 'center' as const,
     width: 140,
   },
   {
     title: '请求/响应数据',
     dataIndex: 'params',
     key: 'params',
+    align: 'center' as const,
     ellipsis: true,
   },
 ];
 
 /** 查询消息列表 */
-async function getMessageList() {
+const getMessageList = async () => {
   if (!props.deviceId) return;
   loading.value = true;
   try {
@@ -107,13 +194,13 @@ async function getMessageList() {
   } finally {
     loading.value = false;
   }
-}
+};
 
 /** 搜索操作 */
-function handleQuery() {
+const handleQuery = () => {
   queryParams.pageNo = 1;
   getMessageList();
-}
+};
 
 /** 监听自动刷新 */
 watch(autoRefresh, (newValue) => {
@@ -153,7 +240,7 @@ onMounted(() => {
 });
 
 /** 刷新消息列表 */
-function refresh(delay = 0) {
+const refresh = (delay = 0) => {
   if (delay > 0) {
     setTimeout(() => {
       handleQuery();
@@ -161,107 +248,10 @@ function refresh(delay = 0) {
   } else {
     handleQuery();
   }
-}
+};
 
 /** 暴露方法给父组件 */
 defineExpose({
   refresh,
 });
 </script>
-
-<template>
-  <ContentWrap>
-    <!-- 搜索区域 -->
-    <Form :model="queryParams" layout="inline">
-      <Form.Item>
-        <Select
-          v-model:value="queryParams.method"
-          placeholder="所有方法"
-          style="width: 160px"
-          allow-clear
-        >
-          <Select.Option
-            v-for="item in methodOptions"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value"
-          >
-            {{ item.label }}
-          </Select.Option>
-        </Select>
-      </Form.Item>
-      <Form.Item>
-        <Select
-          v-model:value="queryParams.upstream"
-          placeholder="上行/下行"
-          style="width: 160px"
-          allow-clear
-        >
-          <Select.Option label="上行" value="true">上行</Select.Option>
-          <Select.Option label="下行" value="false">下行</Select.Option>
-        </Select>
-      </Form.Item>
-      <Form.Item>
-        <Button type="primary" @click="handleQuery">
-          <IconifyIcon icon="ep:search" class="mr-5px" /> 搜索
-        </Button>
-        <Switch
-          v-model:checked="autoRefresh"
-          class="ml-20px"
-          checked-children="定时刷新"
-          un-checked-children="定时刷新"
-        />
-      </Form.Item>
-    </Form>
-
-    <!-- 消息列表 -->
-    <Table
-      :loading="loading"
-      :data-source="list"
-      :columns="columns"
-      :pagination="false"
-      align="center"
-      class="whitespace-nowrap"
-    >
-      <template #bodyCell="{ column, record }">
-        <template v-if="column.key === 'ts'">
-          {{ formatDate(record.ts) }}
-        </template>
-        <template v-else-if="column.key === 'upstream'">
-          <Tag :color="record.upstream ? 'blue' : 'green'">
-            {{ record.upstream ? '上行' : '下行' }}
-          </Tag>
-        </template>
-        <template v-else-if="column.key === 'reply'">
-          <DictTag
-            :type="DICT_TYPE.INFRA_BOOLEAN_STRING"
-            :value="record.reply"
-          />
-        </template>
-        <template v-else-if="column.key === 'method'">
-          {{
-            methodOptions.find((item) => item.value === record.method)?.label
-          }}
-        </template>
-        <template v-else-if="column.key === 'params'">
-          <span v-if="record.reply">
-            {{
-              `{"code":${record.code},"msg":"${record.msg}","data":${record.data}\}`
-            }}
-          </span>
-          <span v-else>{{ record.params }}</span>
-        </template>
-      </template>
-    </Table>
-
-    <!-- 分页 -->
-    <div class="mt-10px flex justify-end">
-      <Pagination
-        :total="total"
-        v-model:page="queryParams.pageNo"
-        v-model:limit="queryParams.pageSize"
-        @pagination="getMessageList"
-      />
-    </div>
-  </ContentWrap>
-</template>
diff --git a/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsSimulator.vue b/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsSimulator.vue
index eb6fbbc0cca5adf8a17ed6b969c9af723dfbdd3f..7480e2d4f0f39af57028b775e30e72b1631a2879 100644
--- a/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsSimulator.vue
+++ b/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsSimulator.vue
@@ -8,17 +8,18 @@ import type { ThingModelData } from '#/api/iot/thingmodel';
 
 import { computed, ref } from 'vue';
 
+import { ContentWrap } from '@vben/common-ui';
+
 import {
   Button,
   Card,
-  Col,
   Input,
   message,
-  Row,
   Table,
   Tabs,
   Textarea,
 } from 'ant-design-vue';
+import { DownOutlined, UpOutlined } from '@ant-design/icons-vue';
 
 import { DeviceStateEnum, sendDeviceMessage } from '#/api/iot/device/device';
 import {
@@ -26,6 +27,8 @@ import {
   IoTThingModelTypeEnum,
 } from '#/views/iot/utils/constants';
 
+import DataDefinition from '#/views/iot/thingmodel/modules/components/DataDefinition.vue';
+
 import DeviceDetailsMessage from './DeviceDetailsMessage.vue';
 
 const props = defineProps<{
@@ -41,6 +44,10 @@ const downstreamTab = ref(IotDeviceMessageMethodEnum.PROPERTY_SET.method); // 
 const deviceMessageRef = ref(); // 设备消息组件引用
 const deviceMessageRefreshDelay = 2000; // 延迟 N 秒，保证模拟上行的消息被处理
 
+// 折叠状态
+const debugCollapsed = ref(false); // 指令调试区域折叠状态
+const messageCollapsed = ref(false); // 设备消息区域折叠状态
+
 // 表单数据：存储用户输入的模拟值
 const formData = ref<Record<string, string>>({});
 
@@ -90,12 +97,12 @@ const propertyColumns: TableColumnType[] = [
   {
     title: '数据定义',
     key: 'dataDefinition',
-    minWidth: 200,
+    minWidth: 100,
   },
   {
     title: '值',
     key: 'value',
-    width: 150,
+    width: 300,
     fixed: 'right' as any,
   },
 ];
@@ -332,19 +339,32 @@ async function handleServiceInvoke(row: ThingModelData) {
 
 <template>
   <ContentWrap>
-    <Row :gutter="20">
-      <!-- 左侧指令调试区域 -->
-      <Col :span="12">
-        <Card>
-          <Tabs v-model:active-key="activeTab">
-            <!-- 上行指令调试 -->
-            <Tabs.Pane key="upstream" tab="上行指令调试">
+    <!-- 上方：指令调试区域 -->
+    <Card class="mb-4 simulator-tabs">
+      <template #title>
+        <div class="flex items-center justify-between">
+          <span>指令调试</span>
+          <Button
+            type="text"
+            size="small"
+            @click="debugCollapsed = !debugCollapsed"
+          >
+            <UpOutlined v-if="!debugCollapsed" />
+            <DownOutlined v-if="debugCollapsed" />
+          </Button>
+        </div>
+      </template>
+      <div v-show="!debugCollapsed">
+        <Tabs v-model:active-key="activeTab" size="small">
+        <!-- 上行指令调试 -->
+        <Tabs.TabPane key="upstream" tab="上行指令调试">
               <Tabs
                 v-if="activeTab === 'upstream'"
                 v-model:active-key="upstreamTab"
+                size="small"
               >
                 <!-- 属性上报 -->
-                <Tabs.Pane
+                <Tabs.TabPane
                   :key="IotDeviceMessageMethodEnum.PROPERTY_POST.method"
                   tab="属性上报"
                 >
@@ -354,6 +374,8 @@ async function handleServiceInvoke(row: ThingModelData) {
                       align="center"
                       :columns="propertyColumns"
                       :pagination="false"
+                      :scroll="{ y: 300 }"
+                      size="small"
                     >
                       <template #bodyCell="{ column, record }">
                         <template v-if="column.key === 'dataType'">
@@ -383,10 +405,10 @@ async function handleServiceInvoke(row: ThingModelData) {
                       </Button>
                     </div>
                   </ContentWrap>
-                </Tabs.Pane>
+                </Tabs.TabPane>
 
                 <!-- 事件上报 -->
-                <Tabs.Pane
+                <Tabs.TabPane
                   :key="IotDeviceMessageMethodEnum.EVENT_POST.method"
                   tab="事件上报"
                 >
@@ -396,6 +418,8 @@ async function handleServiceInvoke(row: ThingModelData) {
                       align="center"
                       :columns="eventColumns"
                       :pagination="false"
+                      :scroll="{ y: 300 }"
+                      size="small"
                     >
                       <template #bodyCell="{ column, record }">
                         <template v-if="column.key === 'dataType'">
@@ -427,10 +451,10 @@ async function handleServiceInvoke(row: ThingModelData) {
                       </template>
                     </Table>
                   </ContentWrap>
-                </Tabs.Pane>
+                </Tabs.TabPane>
 
                 <!-- 状态变更 -->
-                <Tabs.Pane
+                <Tabs.TabPane
                   :key="IotDeviceMessageMethodEnum.STATE_UPDATE.method"
                   tab="状态变更"
                 >
@@ -450,18 +474,19 @@ async function handleServiceInvoke(row: ThingModelData) {
                       </Button>
                     </div>
                   </ContentWrap>
-                </Tabs.Pane>
+                </Tabs.TabPane>
               </Tabs>
-            </Tabs.Pane>
+            </Tabs.TabPane>
 
             <!-- 下行指令调试 -->
-            <Tabs.Pane key="downstream" tab="下行指令调试">
+            <Tabs.TabPane key="downstream" tab="下行指令调试">
               <Tabs
                 v-if="activeTab === 'downstream'"
                 v-model:active-key="downstreamTab"
+                size="small"
               >
                 <!-- 属性调试 -->
-                <Tabs.Pane
+                <Tabs.TabPane
                   :key="IotDeviceMessageMethodEnum.PROPERTY_SET.method"
                   tab="属性设置"
                 >
@@ -471,6 +496,8 @@ async function handleServiceInvoke(row: ThingModelData) {
                       align="center"
                       :columns="propertyColumns"
                       :pagination="false"
+                      :scroll="{ y: 300 }"
+                      size="small"
                     >
                       <template #bodyCell="{ column, record }">
                         <template v-if="column.key === 'dataType'">
@@ -500,10 +527,10 @@ async function handleServiceInvoke(row: ThingModelData) {
                       </Button>
                     </div>
                   </ContentWrap>
-                </Tabs.Pane>
+                </Tabs.TabPane>
 
                 <!-- 服务调用 -->
-                <Tabs.Pane
+                <Tabs.TabPane
                   :key="IotDeviceMessageMethodEnum.SERVICE_INVOKE.method"
                   tab="设备服务调用"
                 >
@@ -513,6 +540,8 @@ async function handleServiceInvoke(row: ThingModelData) {
                       align="center"
                       :columns="serviceColumns"
                       :pagination="false"
+                      :scroll="{ y: 300 }"
+                      size="small"
                     >
                       <template #bodyCell="{ column, record }">
                         <template v-if="column.key === 'dataDefinition'">
@@ -541,23 +570,35 @@ async function handleServiceInvoke(row: ThingModelData) {
                       </template>
                     </Table>
                   </ContentWrap>
-                </Tabs.Pane>
+                </Tabs.TabPane>
               </Tabs>
-            </Tabs.Pane>
+            </Tabs.TabPane>
           </Tabs>
-        </Card>
-      </Col>
-
-      <!-- 右侧设备日志区域 -->
-      <Col :span="12">
-        <ContentWrap title="设备消息">
-          <DeviceDetailsMessage
-            v-if="device.id"
-            ref="deviceMessageRef"
-            :device-id="device.id"
-          />
-        </ContentWrap>
-      </Col>
-    </Row>
+        </div>
+      </Card>
+
+    <!-- 下方：设备消息区域 -->
+    <Card>
+      <template #title>
+        <div class="flex items-center justify-between">
+          <span>设备消息</span>
+          <Button
+            type="text"
+            size="small"
+            @click="messageCollapsed = !messageCollapsed"
+          >
+            <UpOutlined v-if="!messageCollapsed" />
+            <DownOutlined v-if="messageCollapsed" />
+          </Button>
+        </div>
+      </template>
+      <div v-show="!messageCollapsed">
+        <DeviceDetailsMessage
+          v-if="device.id"
+          ref="deviceMessageRef"
+          :device-id="device.id"
+        />
+      </div>
+    </Card>
   </ContentWrap>
 </template>
diff --git a/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsSubDevice.vue b/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsSubDevice.vue
new file mode 100644
index 0000000000000000000000000000000000000000..b97052a7fc6c63ce3c4e27e7d181053af48a91db
--- /dev/null
+++ b/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsSubDevice.vue
@@ -0,0 +1,44 @@
+<script lang="ts" setup>
+import { onMounted, ref } from 'vue';
+
+import { Card, Empty } from 'ant-design-vue';
+
+interface Props {
+  deviceId: number;
+}
+
+defineProps<Props>();
+
+const loading = ref(false);
+const subDevices = ref<any[]>([]);
+
+/** 获取子设备列表 */
+async function getSubDeviceList() {
+  loading.value = true;
+  try {
+    // TODO: 实现获取子设备列表的API调用
+    // const data = await getSubDevicesByGatewayId(deviceId);
+    // subDevices.value = data || [];
+    subDevices.value = [];
+  } catch (error) {
+    console.error('获取子设备列表失败:', error);
+  } finally {
+    loading.value = false;
+  }
+}
+
+onMounted(() => {
+  getSubDeviceList();
+});
+</script>
+
+<template>
+  <Card :loading="loading" title="子设备管理">
+    <Empty
+      description="暂无子设备数据，此功能待实现"
+      :image="Empty.PRESENTED_IMAGE_SIMPLE"
+    />
+    <!-- TODO: 实现子设备列表展示和管理功能 -->
+  </Card>
+</template>
+
diff --git a/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsThingModel.vue b/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsThingModel.vue
index 7cac1c2050be12390741e8a9dac42de295de4f23..18433eeaac61fd83bc4ad26b34933d4b6f499974 100644
--- a/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsThingModel.vue
+++ b/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsThingModel.vue
@@ -22,21 +22,26 @@ const activeTab = ref('property'); // 默认选中设备属性
 <template>
   <ContentWrap>
     <Tabs v-model:active-key="activeTab" class="!h-auto !p-0">
-      <Tabs.Pane key="property" tab="设备属性（运行状态）">
-        <DeviceDetailsThingModelProperty :device-id="deviceId" />
-      </Tabs.Pane>
-      <Tabs.Pane key="event" tab="设备事件上报">
+      <Tabs.TabPane key="property" tab="设备属性（运行状态）">
+        <DeviceDetailsThingModelProperty
+          v-if="activeTab === 'property'"
+          :device-id="deviceId"
+        />
+      </Tabs.TabPane>
+      <Tabs.TabPane key="event" tab="设备事件上报">
         <DeviceDetailsThingModelEvent
+          v-if="activeTab === 'event'"
           :device-id="props.deviceId"
           :thing-model-list="props.thingModelList"
         />
-      </Tabs.Pane>
-      <Tabs.Pane key="service" tab="设备服务调用">
+      </Tabs.TabPane>
+      <Tabs.TabPane key="service" tab="设备服务调用">
         <DeviceDetailsThingModelService
+          v-if="activeTab === 'service'"
           :device-id="deviceId"
           :thing-model-list="props.thingModelList"
         />
-      </Tabs.Pane>
+      </Tabs.TabPane>
     </Tabs>
   </ContentWrap>
 </template>
diff --git a/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsThingModelEvent.vue b/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsThingModelEvent.vue
index a7a7c558bb91fac4956bb4ebaf2e42cd5beadd92..90ceb8bf3b82409971a091ea873e707e4bcceb1f 100644
--- a/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsThingModelEvent.vue
+++ b/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsThingModelEvent.vue
@@ -148,6 +148,7 @@ onMounted(() => {
           v-model:value="queryParams.times"
           show-time
           format="YYYY-MM-DD HH:mm:ss"
+          value-format="YYYY-MM-DD HH:mm:ss"
           style="width: 360px"
         />
       </Form.Item>
diff --git a/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsThingModelPropertyHistory.vue b/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsThingModelPropertyHistory.vue
index 9eabb6019363c07f2ac2b34f236ea409f2c2e542..b695c4edf51dce3f338798649a58335cbff3002b 100644
--- a/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsThingModelPropertyHistory.vue
+++ b/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsThingModelPropertyHistory.vue
@@ -1,4 +1,5 @@
 <!-- 设备物模型 -> 运行状态 -> 查看数据（设备的属性值历史）-->
+// 重新关闭打开图表,图表不显示可能图例注销失败等大佬修复
 <script setup lang="ts">
 import type { Dayjs } from 'dayjs';
 
@@ -10,7 +11,7 @@ import { computed, nextTick, reactive, ref, watch } from 'vue';
 
 import { IconifyIcon } from '@vben/icons';
 import { EchartsUI, useEcharts } from '@vben/plugins/echarts';
-import { beginOfDay, endOfDay, formatDate } from '@vben/utils';
+import { beginOfDay, endOfDay, formatDate, formatDateTime } from '@vben/utils';
 
 import {
   Button,
@@ -20,6 +21,7 @@ import {
   RangePicker,
   Space,
   Spin,
+  Table,
   Tag,
 } from 'ant-design-vue';
 import dayjs from 'dayjs';
@@ -49,8 +51,8 @@ const queryParams = reactive({
   deviceId: -1,
   identifier: '',
   times: [
-    formatDate(beginOfDay(new Date(Date.now() - 3600 * 1000 * 24 * 7))),
-    formatDate(endOfDay(new Date())),
+    formatDateTime(beginOfDay(new Date(Date.now() - 3600 * 1000 * 24 * 7))),
+    formatDateTime(endOfDay(new Date())),
   ],
 });
 
@@ -100,7 +102,7 @@ const tableColumns = computed(() => [
     title: '序号',
     key: 'index',
     width: 80,
-    align: 'center',
+    align: 'center' as const,
     customRender: ({ index }: { index: number }) => index + 1,
   },
   {
@@ -108,20 +110,20 @@ const tableColumns = computed(() => [
     key: 'updateTime',
     dataIndex: 'updateTime',
     width: 200,
-    align: 'center',
+    align: 'center' as const,
   },
   {
     title: '属性值',
     key: 'value',
     dataIndex: 'value',
-    align: 'center',
+    align: 'center' as const,
   },
 ]);
 
 // 分页配置
 const paginationConfig = computed(() => ({
   current: 1,
-  pageSize: 20,
+  pageSize: 10,
   total: total.value,
   showSizeChanger: true,
   showQuickJumper: true,
@@ -134,7 +136,8 @@ async function getList() {
   loading.value = true;
   try {
     const data = await getHistoryDevicePropertyList(queryParams);
-    list.value = (data?.list as IotDeviceApi.DevicePropertyDetail[]) || [];
+    // 后端直接返回数组，不是 { list: [] } 格式
+    list.value = (Array.isArray(data) ? data : (data?.list || [])) as IotDeviceApi.DevicePropertyDetail[];
     total.value = list.value.length;
 
     // 如果是图表模式且不是复杂数据类型，渲染图表
@@ -143,7 +146,9 @@ async function getList() {
       !isComplexDataType.value &&
       list.value.length > 0
     ) {
+      // 等待 DOM 更新完成后再渲染图表
       await nextTick();
+      await nextTick(); // 双重 nextTick 确保 DOM 完全准备好
       renderChart();
     }
   } catch {
@@ -157,11 +162,20 @@ async function getList() {
 
 /** 渲染图表 */
 function renderChart() {
-  if (!list.value || list.value.length === 0) return;
+  if (!list.value || list.value.length === 0) {
+    return;
+  }
 
   const chartData = list.value.map((item) => [item.updateTime, item.value]);
 
-  renderEcharts({
+  // 使用 setTimeout 延迟渲染，避免 ECharts 主进程冲突
+  setTimeout(() => {
+    // 检查 chartRef 是否存在且已挂载
+    if (!chartRef.value || !chartRef.value.$el) {
+      return;
+    }
+
+    renderEcharts({
     title: {
       text: '属性值趋势',
       left: 'center',
@@ -265,6 +279,7 @@ function renderChart() {
       },
     ],
   });
+  }, 300); // 延迟300ms渲染，确保 DOM 完全准备好
 }
 
 /** 打开弹窗 */
@@ -275,12 +290,31 @@ async function open(deviceId: number, identifier: string, dataType: string) {
   propertyIdentifier.value = identifier;
   thingModelDataType.value = dataType;
 
+  // 重置时间范围为最近7天
+  dateRange.value = [
+    dayjs().subtract(7, 'day').startOf('day'),
+    dayjs().endOf('day'),
+  ];
+
+  // 更新查询参数的时间
+  queryParams.times = [
+    formatDateTime(dateRange.value[0].toDate()),
+    formatDateTime(dateRange.value[1].toDate()),
+  ];
+
   // 如果物模型是 struct、array，需要默认使用 list 模式
   viewMode.value = isComplexDataType.value ? 'list' : 'chart';
 
   // 等待弹窗完全渲染后再获取数据
   await nextTick();
   await getList();
+
+  // 如果是图表模式，延迟渲染图表
+  if (viewMode.value === 'chart' && !isComplexDataType.value) {
+    setTimeout(() => {
+      renderChart();
+    }, 500);
+  }
 }
 
 /** 时间变化处理 */
@@ -290,8 +324,8 @@ function handleTimeChange() {
   }
 
   queryParams.times = [
-    formatDate(dateRange.value[0].toDate()),
-    formatDate(dateRange.value[1].toDate()),
+    formatDateTime(dateRange.value[0].toDate()),
+    formatDateTime(dateRange.value[1].toDate()),
   ];
 
   getList();
@@ -372,8 +406,14 @@ watch(viewMode, async (newMode) => {
     !isComplexDataType.value &&
     list.value.length > 0
   ) {
+    // 等待 DOM 显示完成
     await nextTick();
-    renderChart();
+    await nextTick();
+
+    // 延迟渲染图表
+    setTimeout(() => {
+      renderChart();
+    }, 300);
   }
 });
 
@@ -398,7 +438,7 @@ defineExpose({ open }); // 提供 open 方法，用于打开弹窗
             format="YYYY-MM-DD HH:mm:ss"
             :placeholder="['开始时间', '结束时间']"
             class="!w-[400px]"
-            @press-enter="handleTimeChange"
+            @change="handleTimeChange"
           />
 
           <!-- 刷新按钮 -->
@@ -460,18 +500,20 @@ defineExpose({ open }); // 提供 open 方法，用于打开弹窗
       <!-- 数据展示区域 -->
       <Spin :spinning="loading" :delay="200">
         <!-- 图表模式 -->
-        <div v-if="viewMode === 'chart'" class="chart-container">
+        <div v-show="viewMode === 'chart'" class="chart-container">
           <Empty
             v-if="list.length === 0"
             :image="Empty.PRESENTED_IMAGE_SIMPLE"
             description="暂无数据"
             class="py-20"
           />
-          <EchartsUI v-else ref="chartRef" height="500px" />
+          <div v-else>
+            <EchartsUI ref="chartRef" height="500px" />
+          </div>
         </div>
 
         <!-- 表格模式 -->
-        <div v-else class="table-container">
+        <div v-show="viewMode === 'list'" class="table-container">
           <Table
             :data-source="list"
             :columns="tableColumns"
diff --git a/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsThingModelService.vue b/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsThingModelService.vue
index dfe22c13387895c41fb5d61415f2343794360fdc..9827353192c07c31d1728d93b7d5694973f72054 100644
--- a/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsThingModelService.vue
+++ b/apps/web-antd/src/views/iot/device/device/modules/detail/DeviceDetailsThingModelService.vue
@@ -148,6 +148,7 @@ onMounted(() => {
           v-model:value="queryParams.times"
           show-time
           format="YYYY-MM-DD HH:mm:ss"
+          value-format="YYYY-MM-DD HH:mm:ss"
           style="width: 360px"
         />
       </Form.Item>
diff --git a/apps/web-antd/src/views/iot/device/device/modules/detail/index.vue b/apps/web-antd/src/views/iot/device/device/modules/detail/index.vue
index ef6e4037072501c0e40687a5d645241559992140..10697c0493b4093a03948d93bf8f894689954a2c 100644
--- a/apps/web-antd/src/views/iot/device/device/modules/detail/index.vue
+++ b/apps/web-antd/src/views/iot/device/device/modules/detail/index.vue
@@ -1,13 +1,12 @@
-<script lang="ts" setup>
+<script setup lang="ts">
 import type { IotDeviceApi } from '#/api/iot/device/device';
 import type { IotProductApi } from '#/api/iot/product/product';
 import type { ThingModelData } from '#/api/iot/thingmodel';
 
-import { onMounted, ref, unref } from 'vue';
+import { onMounted, ref } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
 
 import { Page } from '@vben/common-ui';
-import { useTabbarStore } from '@vben/stores';
 
 import { message, Tabs } from 'ant-design-vue';
 
@@ -20,33 +19,42 @@ import DeviceDetailsHeader from './DeviceDetailsHeader.vue';
 import DeviceDetailsInfo from './DeviceDetailsInfo.vue';
 import DeviceDetailsMessage from './DeviceDetailsMessage.vue';
 import DeviceDetailsSimulator from './DeviceDetailsSimulator.vue';
+import DeviceDetailsSubDevice from './DeviceDetailsSubDevice.vue';
 import DeviceDetailsThingModel from './DeviceDetailsThingModel.vue';
 
 defineOptions({ name: 'IoTDeviceDetail' });
 
 const route = useRoute();
-const id = Number(route.params.id); // 将字符串转换为数字
-const loading = ref(true); // 加载中
-const product = ref<IotProductApi.Product>({} as IotProductApi.Product); // 产品详情
-const device = ref<IotDeviceApi.Device>({} as IotDeviceApi.Device); // 设备详情
-const activeTab = ref('info'); // 默认激活的标签页
-const thingModelList = ref<ThingModelData[]>([]); // 物模型列表数据
+const router = useRouter();
+
+const id = Number(route.params.id);
+const loading = ref(true);
+const product = ref<IotProductApi.Product>({} as IotProductApi.Product);
+const device = ref<IotDeviceApi.Device>({} as IotDeviceApi.Device);
+const activeTab = ref('info');
+const thingModelList = ref<ThingModelData[]>([]);
 
 /** 获取设备详情 */
-async function getDeviceData() {
+async function getDeviceData(deviceId: number) {
   loading.value = true;
   try {
-    device.value = await getDevice(id);
+    device.value = await getDevice(deviceId);
     await getProductData(device.value.productId);
     await getThingModelList(device.value.productId);
+  } catch {
+    message.error('获取设备详情失败');
   } finally {
     loading.value = false;
   }
 }
 
 /** 获取产品详情 */
-async function getProductData(id: number) {
-  product.value = await getProduct(id);
+async function getProductData(productId: number) {
+  try {
+    product.value = await getProduct(productId);
+  } catch (error) {
+    console.error('获取产品详情失败:', error);
+  }
 }
 
 /** 获取物模型列表 */
@@ -61,17 +69,20 @@ async function getThingModelList(productId: number) {
 }
 
 /** 初始化 */
-const tabbarStore = useTabbarStore(); // 视图操作
-const router = useRouter(); // 路由
-const { currentRoute } = router;
 onMounted(async () => {
   if (!id) {
-    message.warning({ content: '参数错误，产品不能为空！' });
-    await tabbarStore.closeTab(unref(currentRoute), router);
+    message.warning('参数错误，设备不能为空！');
+    router.back();
     return;
   }
-  await getDeviceData();
-  activeTab.value = (route.query.tab as string) || 'info';
+
+  await getDeviceData(id);
+
+  // 处理 tab 参数
+  const { tab } = route.query;
+  if (tab) {
+    activeTab.value = tab as string;
+  }
 });
 </script>
 <template>
@@ -80,50 +91,55 @@ onMounted(async () => {
       :loading="loading"
       :product="product"
       :device="device"
-      @refresh="getDeviceData"
+      @refresh="() => getDeviceData(id)"
     />
 
-    <Tabs v-model:active-key="activeTab" class="device-detail-tabs mt-4">
-      <Tabs.Pane key="info" tab="设备信息">
+    <Tabs v-model:active-key="activeTab" class="mt-4">
+      <Tabs.TabPane key="info" tab="设备信息">
         <DeviceDetailsInfo
           v-if="activeTab === 'info'"
           :product="product"
           :device="device"
         />
-      </Tabs.Pane>
-      <Tabs.Pane key="model" tab="物模型数据">
+      </Tabs.TabPane>
+      <Tabs.TabPane key="model" tab="物模型数据">
         <DeviceDetailsThingModel
           v-if="activeTab === 'model' && device.id"
           :device-id="device.id"
           :thing-model-list="thingModelList"
         />
-      </Tabs.Pane>
-      <Tabs.Pane
+      </Tabs.TabPane>
+      <Tabs.TabPane
         v-if="product.deviceType === DeviceTypeEnum.GATEWAY"
         key="sub-device"
         tab="子设备管理"
-      />
-      <Tabs.Pane key="log" tab="设备消息">
+      >
+        <DeviceDetailsSubDevice
+          v-if="activeTab === 'sub-device' && device.id"
+          :device-id="device.id"
+        />
+      </Tabs.TabPane>
+      <Tabs.TabPane key="log" tab="设备消息">
         <DeviceDetailsMessage
           v-if="activeTab === 'log' && device.id"
           :device-id="device.id"
         />
-      </Tabs.Pane>
-      <Tabs.Pane key="simulator" tab="模拟设备">
+      </Tabs.TabPane>
+      <Tabs.TabPane key="simulator" tab="模拟设备">
         <DeviceDetailsSimulator
           v-if="activeTab === 'simulator'"
           :product="product"
           :device="device"
           :thing-model-list="thingModelList"
         />
-      </Tabs.Pane>
-      <Tabs.Pane key="config" tab="设备配置">
+      </Tabs.TabPane>
+      <Tabs.TabPane key="config" tab="设备配置">
         <DeviceDetailConfig
           v-if="activeTab === 'config'"
           :device="device"
-          @success="getDeviceData"
+          @success="() => getDeviceData(id)"
         />
-      </Tabs.Pane>
+      </Tabs.TabPane>
     </Tabs>
   </Page>
 </template>
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 f6a0992f897b69bdf63588741a9862e9551816cd..7bbb32e4c1da34fdea8098966f82370644faa9ec 100644
--- a/apps/web-antd/src/views/iot/device/group/index.vue
+++ b/apps/web-antd/src/views/iot/device/group/index.vue
@@ -22,7 +22,7 @@ const [FormModal, formModalApi] = useVbenModal({
 });
 
 /** 刷新表格 */
-function handleRefresh() {
+function onRefresh() {
   gridApi.query();
 }
 
@@ -47,7 +47,7 @@ async function handleDelete(row: IotDeviceGroupApi.DeviceGroup) {
     message.success({
       content: $t('ui.actionMessage.deleteSuccess', [row.name]),
     });
-    handleRefresh();
+    onRefresh();
   } finally {
     hideLoading();
   }
@@ -97,7 +97,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
 
 <template>
   <Page auto-content-height>
-    <FormModal @success="handleRefresh" />
+    <FormModal @success="onRefresh" />
     <Grid table-title="设备分组列表">
       <template #toolbar-tools>
         <TableAction
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 097f85badd155c7b6416960e70d44e5d85d27172..13a132dec88c3c4d2ca745ff4a9ff4eff69232dc 100644
--- a/apps/web-antd/src/views/iot/ota/firmware/index.vue
+++ b/apps/web-antd/src/views/iot/ota/firmware/index.vue
@@ -22,7 +22,7 @@ const [FormModal, formModalApi] = useVbenModal({
 });
 
 /** 刷新表格 */
-function handleRefresh() {
+function onRefresh() {
   gridApi.query();
 }
 
@@ -52,7 +52,7 @@ async function handleDelete(row: IoTOtaFirmwareApi.Firmware) {
     message.success({
       content: $t('ui.actionMessage.deleteSuccess', [row.name]),
     });
-    handleRefresh();
+    onRefresh();
   } finally {
     hideLoading();
   }
@@ -91,7 +91,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
 
 <template>
   <Page auto-content-height>
-    <FormModal @success="handleRefresh" />
+    <FormModal @success="onRefresh" />
     <Grid table-title="固件列表">
       <template #toolbar-tools>
         <TableAction
diff --git a/apps/web-antd/src/views/iot/ota/index.vue b/apps/web-antd/src/views/iot/ota/index.vue
index b4cc3d86fd08de395fa2ec6666db2413ea71e6e9..21c3c10a5b23dfc4cabd2120015cca5f3bb9c698 100644
--- a/apps/web-antd/src/views/iot/ota/index.vue
+++ b/apps/web-antd/src/views/iot/ota/index.vue
@@ -21,7 +21,7 @@ const [FormModal, formModalApi] = useVbenModal({
 });
 
 /** 刷新表格 */
-function handleRefresh() {
+function onRefresh() {
   gridApi.query();
 }
 
@@ -46,7 +46,7 @@ async function handleDelete(row: IoTOtaFirmwareApi.Firmware) {
     message.success({
       content: $t('ui.actionMessage.deleteSuccess', [row.name]),
     });
-    handleRefresh();
+    onRefresh();
   } finally {
     hideLoading();
   }
@@ -85,7 +85,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
 
 <template>
   <Page auto-content-height>
-    <FormModal @success="handleRefresh" />
+    <FormModal @success="onRefresh" />
     <Grid table-title="OTA 固件列表">
       <template #toolbar-tools>
         <TableAction
diff --git a/apps/web-antd/src/views/iot/product/product/modules/ProductCardView.vue b/apps/web-antd/src/views/iot/product/product/modules/ProductCardView.vue
index e28090822ec73acfddfa6a41b1715b4858cf38c4..411ff50c1bea20035a9df65f8c5659d31ef1f79f 100644
--- a/apps/web-antd/src/views/iot/product/product/modules/ProductCardView.vue
+++ b/apps/web-antd/src/views/iot/product/product/modules/ProductCardView.vue
@@ -237,12 +237,10 @@ defineExpose({
   .product-card {
     height: 100%;
     overflow: hidden;
-    border: 1px solid #e8e8e8;
     border-radius: 8px;
     transition: all 0.3s ease;
 
     &:hover {
-      border-color: #d9d9d9;
       box-shadow: 0 4px 16px rgb(0 0 0 / 8%);
       transform: translateY(-2px);
     }
@@ -273,7 +271,6 @@ defineExpose({
       font-size: 16px;
       font-weight: 600;
       line-height: 1.5;
-      color: #1f2937;
       white-space: nowrap;
     }
 
@@ -292,14 +289,13 @@ defineExpose({
         .info-label {
           flex-shrink: 0;
           margin-right: 8px;
-          color: #6b7280;
+          opacity: 0.65;
         }
 
         .info-value {
           overflow: hidden;
           text-overflow: ellipsis;
           font-weight: 500;
-          color: #1f2937;
           white-space: nowrap;
 
           &.text-primary {
@@ -315,9 +311,9 @@ defineExpose({
           font-family: 'Courier New', monospace;
           font-size: 12px;
           vertical-align: middle;
-          color: #374151;
           white-space: nowrap;
           cursor: help;
+          opacity: 0.85;
         }
 
         .info-tag {
@@ -337,6 +333,7 @@ defineExpose({
       color: #667eea;
       background: linear-gradient(135deg, #667eea15 0%, #764ba215 100%);
       border-radius: 8px;
+      opacity: 0.8;
     }
 
     // 按钮组
@@ -345,7 +342,7 @@ defineExpose({
       gap: 8px;
       padding-top: 12px;
       margin-top: auto;
-      border-top: 1px solid #f0f0f0;
+      border-top: 1px solid var(--ant-color-split);
 
       .action-btn {
         flex: 1;
@@ -392,4 +389,38 @@ defineExpose({
     }
   }
 }
+
+// 夜间模式适配
+html.dark {
+  .product-card-view {
+    .product-card {
+      &:hover {
+        box-shadow: 0 4px 16px rgb(0 0 0 / 30%);
+      }
+
+      .product-title {
+        color: rgb(255 255 255 / 85%);
+      }
+
+      .info-list {
+        .info-label {
+          color: rgb(255 255 255 / 65%);
+        }
+
+        .info-value {
+          color: rgb(255 255 255 / 85%);
+        }
+
+        .product-key {
+          color: rgb(255 255 255 / 75%);
+        }
+      }
+
+      .product-3d-icon {
+        color: #8b9cff;
+        background: linear-gradient(135deg, #667eea25 0%, #764ba225 100%);
+      }
+    }
+  }
+}
 </style>
diff --git a/apps/web-antd/src/views/iot/product/product/modules/ProductForm.vue b/apps/web-antd/src/views/iot/product/product/modules/ProductForm.vue
index 7fad6cd197e55a4931a59db2c990382bda096db5..0b2e5dd0e0daf27e956af1caf5b3787f864ccfab 100644
--- a/apps/web-antd/src/views/iot/product/product/modules/ProductForm.vue
+++ b/apps/web-antd/src/views/iot/product/product/modules/ProductForm.vue
@@ -65,12 +65,12 @@ const [Modal, modalApi] = useVbenModal({
     if (!basicValid) {
       return;
     }
-    
+
     modalApi.lock();
     try {
       // 提交表单 - 合并两个表单的值
       const basicValues = await formApi.getValues();
-      
+
       // 如果折叠面板展开，则获取高级表单的值，否则保留原有值（编辑时）或使用空值（新增时）
       let advancedValues: any = {};
       if (activeKey.value.includes('advanced')) {
@@ -83,12 +83,12 @@ const [Modal, modalApi] = useVbenModal({
           description: formData.value.description,
         };
       }
-      
+
       const values = { ...basicValues, ...advancedValues } as IotProductApi.Product;
       const data = formData.value?.id
         ? { ...values, id: formData.value.id }
         : values;
-      
+
       await (formData.value?.id ? updateProduct(data) : createProduct(data));
       // 关闭并提示
       await modalApi.close();
@@ -123,14 +123,14 @@ const [Modal, modalApi] = useVbenModal({
       formData.value = await getProduct(data.id);
       // 设置基础表单
       await formApi.setValues(formData.value);
-      
+
       // 先设置高级表单的值（不等待）
       advancedFormApi.setValues({
         icon: formData.value.icon,
         picUrl: formData.value.picUrl,
         description: formData.value.description,
       });
-      
+
       // 如果有图标、图片或描述，自动展开折叠面板以便显示
       if (formData.value.icon || formData.value.picUrl || formData.value.description) {
         activeKey.value = ['advanced'];
@@ -151,9 +151,6 @@ const [Modal, modalApi] = useVbenModal({
       <Form />
       <Collapse v-model:active-key="activeKey" class="mt-4">
         <CollapsePanel key="advanced" header="更多设置">
-          <template #extra>
-            <span class="text-gray-500">📷</span>
-          </template>
           <AdvancedForm />
         </CollapsePanel>
       </Collapse>
diff --git a/apps/web-antd/src/views/iot/product/product/modules/detail/ProductDetailsInfo.vue b/apps/web-antd/src/views/iot/product/product/modules/detail/ProductDetailsInfo.vue
index 711c258ab899b882b8587354764bc92344b13e88..e2d1ac281b195afa8201296a3e5647b82800f677 100644
--- a/apps/web-antd/src/views/iot/product/product/modules/detail/ProductDetailsInfo.vue
+++ b/apps/web-antd/src/views/iot/product/product/modules/detail/ProductDetailsInfo.vue
@@ -23,7 +23,7 @@ const formatDate = (date?: Date | string) => {
 
 <template>
   <Card title="产品信息">
-    <Descriptions bordered :column="3">
+    <Descriptions bordered :column="3" size="small">
       <Descriptions.Item label="产品名称">
         {{ product.name }}
       </Descriptions.Item>
diff --git a/apps/web-antd/src/views/iot/rule/data/index.vue b/apps/web-antd/src/views/iot/rule/data/index.vue
index 30e15b9b8bef8a6753d6f60f169490a61e0f529f..17ff79c885c827938dda9dbad76a0b93b5b847ba 100644
--- a/apps/web-antd/src/views/iot/rule/data/index.vue
+++ b/apps/web-antd/src/views/iot/rule/data/index.vue
@@ -21,7 +21,7 @@ const [FormModal, formModalApi] = useVbenModal({
 });
 
 /** 刷新表格 */
-function handleRefresh() {
+function onRefresh() {
   gridApi.query();
 }
 
@@ -46,7 +46,7 @@ async function handleDelete(row: any) {
     message.success({
       content: $t('ui.actionMessage.deleteSuccess', [row.name]),
     });
-    handleRefresh();
+    onRefresh();
   } finally {
     hideLoading();
   }
@@ -85,7 +85,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
 
 <template>
   <Page auto-content-height>
-    <FormModal @success="handleRefresh" />
+    <FormModal @success="onRefresh" />
     <Grid table-title="数据规则列表">
       <template #toolbar-tools>
         <TableAction
diff --git a/apps/web-antd/src/views/iot/rule/data/rule/index.vue b/apps/web-antd/src/views/iot/rule/data/rule/index.vue
index e71d273e70331091e321d24479f92c3c7f59861e..5965647c695d56598527c5656bd4c68c759f2551 100644
--- a/apps/web-antd/src/views/iot/rule/data/rule/index.vue
+++ b/apps/web-antd/src/views/iot/rule/data/rule/index.vue
@@ -21,7 +21,7 @@ const [FormModal, formModalApi] = useVbenModal({
 });
 
 /** 刷新表格 */
-function handleRefresh() {
+function onRefresh() {
   gridApi.query();
 }
 
@@ -46,7 +46,7 @@ async function handleDelete(row: any) {
     message.success({
       content: $t('ui.actionMessage.deleteSuccess', [row.name]),
     });
-    handleRefresh();
+    onRefresh();
   } finally {
     hideLoading();
   }
@@ -85,7 +85,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
 
 <template>
   <Page auto-content-height>
-    <FormModal @success="handleRefresh" />
+    <FormModal @success="onRefresh" />
     <Grid table-title="数据规则列表">
       <template #toolbar-tools>
         <TableAction
diff --git a/apps/web-antd/src/views/iot/rule/data/sink/index.vue b/apps/web-antd/src/views/iot/rule/data/sink/index.vue
index 8c9986ef63d6e02a6a653cbc6d48757fc9375b19..2cab535366061d3e44050844b25590d368d18797 100644
--- a/apps/web-antd/src/views/iot/rule/data/sink/index.vue
+++ b/apps/web-antd/src/views/iot/rule/data/sink/index.vue
@@ -21,7 +21,7 @@ const [FormModal, formModalApi] = useVbenModal({
 });
 
 /** 刷新表格 */
-function handleRefresh() {
+function onRefresh() {
   gridApi.query();
 }
 
@@ -46,7 +46,7 @@ async function handleDelete(row: any) {
     message.success({
       content: $t('ui.actionMessage.deleteSuccess', [row.name]),
     });
-    handleRefresh();
+    onRefresh();
   } finally {
     hideLoading();
   }
@@ -85,7 +85,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
 
 <template>
   <Page auto-content-height>
-    <FormModal @success="handleRefresh" />
+    <FormModal @success="onRefresh" />
     <Grid table-title="数据目的列表">
       <template #toolbar-tools>
         <TableAction
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 a81ba6d5555d7f488328eab76263c857966eaaa4..752784b2df54d3e8dba07352f7b5e2003d525a31 100644
--- a/apps/web-antd/src/views/iot/rule/scene/index.vue
+++ b/apps/web-antd/src/views/iot/rule/scene/index.vue
@@ -25,7 +25,7 @@ const [FormModal, formModalApi] = useVbenModal({
 });
 
 /** 刷新表格 */
-function handleRefresh() {
+function onRefresh() {
   gridApi.query();
 }
 
@@ -51,7 +51,7 @@ async function handleToggleStatus(row: RuleSceneApi.SceneRule) {
     message.success({
       content: newStatus === 0 ? '启用成功' : '停用成功',
     });
-    handleRefresh();
+    onRefresh();
   } finally {
     hideLoading();
   }
@@ -68,7 +68,7 @@ async function handleDelete(row: RuleSceneApi.SceneRule) {
     message.success({
       content: $t('ui.actionMessage.deleteSuccess', [row.name]),
     });
-    handleRefresh();
+    onRefresh();
   } finally {
     hideLoading();
   }
@@ -107,7 +107,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
 
 <template>
   <Page auto-content-height>
-    <FormModal @success="handleRefresh" />
+    <FormModal @success="onRefresh" />
     <Grid table-title="场景规则列表">
       <template #toolbar-tools>
         <TableAction
diff --git a/apps/web-antd/src/views/iot/thingmodel/data.ts b/apps/web-antd/src/views/iot/thingmodel/data.ts
index fd3a079e560e06842d5237e48ddc90874909486f..3f2002aac98e5b2f217626152566437d806ba62c 100644
--- a/apps/web-antd/src/views/iot/thingmodel/data.ts
+++ b/apps/web-antd/src/views/iot/thingmodel/data.ts
@@ -15,6 +15,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
         options: getDictOptions(DICT_TYPE.IOT_THING_MODEL_TYPE, 'number'),
         placeholder: '请选择功能类型',
         allowClear: true,
+
       },
     },
   ];
@@ -27,7 +28,7 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       field: 'type',
       title: '功能类型',
-      minWidth: 100,
+      minWidth: 20,
       cellRender: {
         name: 'CellDict',
         props: { type: DICT_TYPE.IOT_THING_MODEL_TYPE },
@@ -41,17 +42,17 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
     {
       field: 'identifier',
       title: '标识符',
-      minWidth: 150,
+      minWidth: 20,
     },
     {
       field: 'dataType',
       title: '数据类型',
-      minWidth: 120,
+      minWidth: 50,
       slots: { default: 'dataType' },
     },
     {
-      field: 'dataDefinition',
-      title: '数据定义',
+      field: 'property',
+      title: '属性',
       minWidth: 200,
       slots: { default: 'dataDefinition' },
     },
diff --git a/apps/web-antd/src/views/iot/thingmodel/index.vue b/apps/web-antd/src/views/iot/thingmodel/index.vue
index facdafe66092bb63b37a14dd658906b89f639341..db57ecf82c641d8b64d47872a8c20a9ead892154 100644
--- a/apps/web-antd/src/views/iot/thingmodel/index.vue
+++ b/apps/web-antd/src/views/iot/thingmodel/index.vue
@@ -1,17 +1,19 @@
 <script setup lang="ts">
-import type { VxeTableGridOptions } from '#/adapter/vxe-table';
-import type { ThingModelApi } from '#/api/iot/thingmodel';
+import { onMounted, provide, ref } from 'vue';
 
+import { message } from 'ant-design-vue';
 import { Page } from '@vben/common-ui';
-import { IconifyIcon } from '@vben/icons';
 
-import { Button, message } from 'ant-design-vue';
-
-import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
 import { deleteThingModel, getThingModelPage } from '#/api/iot/thingmodel';
+import { getProduct } from '#/api/iot/product/product';
+import type { IotProductApi } from '#/api/iot/product/product';
 
-import { getDataTypeOptionsLabel } from '../utils/constants';
 import { useGridColumns, useGridFormSchema } from './data';
+import { getDataTypeOptionsLabel, IOT_PROVIDE_KEY } from '../utils/constants';
+import ThingModelForm from './modules/ThingModelForm.vue';
+import ThingModelTSL from './modules/ThingModelTSL.vue';
+import { DataDefinition } from './modules/components';
 
 defineOptions({ name: 'IoTThingModel' });
 
@@ -19,6 +21,16 @@ const props = defineProps<{
   productId: number;
 }>();
 
+// 产品信息
+const product = ref<IotProductApi.Product>({} as IotProductApi.Product);
+
+// 提供产品信息给子组件
+provide(IOT_PROVIDE_KEY.PRODUCT, product);
+
+// 组件引用
+const thingModelFormRef = ref();
+const thingModelTSLRef = ref();
+
 const [Grid, gridApi] = useVbenVxeGrid({
   gridOptions: {
     columns: useGridColumns(),
@@ -26,12 +38,12 @@ const [Grid, gridApi] = useVbenVxeGrid({
     keepSource: true,
     proxyConfig: {
       ajax: {
-        query: async ({ page, form }) => {
+        query: async ({ page }: any, formValues: any) => {
           return await getThingModelPage({
             pageNo: page.currentPage,
             pageSize: page.pageSize,
             productId: props.productId,
-            ...form,
+            ...formValues,
           });
         },
       },
@@ -44,7 +56,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
       refresh: true,
       search: true,
     },
-  } as VxeTableGridOptions<ThingModelApi.ThingModel>,
+  },
   formOptions: {
     schema: useGridFormSchema(),
   },
@@ -52,14 +64,12 @@ const [Grid, gridApi] = useVbenVxeGrid({
 
 // 新增功能
 const handleCreate = () => {
-  // TODO: 打开物模型表单
-  console.error('新增功能');
+  thingModelFormRef.value?.open('create');
 };
 
 // 编辑功能
 const handleEdit = (row: any) => {
-  // TODO: 打开物模型表单
-  console.error('编辑功能:', row);
+  thingModelFormRef.value?.open('update', row.id);
 };
 
 // 删除功能
@@ -75,28 +85,58 @@ const handleDelete = async (row: any) => {
 
 // 打开 TSL
 const handleOpenTSL = () => {
-  // TODO: 打开 TSL 弹窗
-  console.error('打开 TSL');
+  thingModelTSLRef.value?.open();
 };
 
 // 获取数据类型标签
 const getDataTypeLabel = (row: any) => {
   return getDataTypeOptionsLabel(row.property?.dataType) || '-';
 };
+
+// 刷新表格
+const handleRefresh = () => {
+  gridApi.reload();
+};
+
+// 获取产品信息
+const getProductData = async () => {
+  try {
+    product.value = await getProduct(props.productId);
+  } catch (error) {
+    console.error('获取产品信息失败:', error);
+  }
+};
+
+// 初始化
+onMounted(async () => {
+  await getProductData();
+});
 </script>
 
 <template>
   <Page
+    auto-content-height
     description="管理产品的物模型定义，包括属性、服务和事件"
     title="物模型管理"
   >
-    <Grid>
+    <Grid ref="xGrid">
       <template #toolbar-tools>
-        <Button @click="handleCreate">
-          <IconifyIcon icon="ant-design:plus-outlined" class="mr-1" />
-          添加功能
-        </Button>
-        <Button type="primary" @click="handleOpenTSL"> TSL </Button>
+        <TableAction
+          :actions="[
+            {
+              label: '添加功能',
+              type: 'primary',
+              icon: ACTION_ICON.ADD,
+              onClick: handleCreate,
+            },
+            {
+              label: 'TSL',
+              type: 'default',
+              color: 'success',
+              onClick: handleOpenTSL,
+            },
+          ]"
+        />
       </template>
 
       <!-- 数据类型列 -->
@@ -106,17 +146,38 @@ const getDataTypeLabel = (row: any) => {
 
       <!-- 数据定义列 -->
       <template #dataDefinition="{ row }">
-        <!-- TODO: 实现数据定义组件 -->
-        <span class="text-gray-400">{{ row }}</span>
+        <DataDefinition :data="row" />
       </template>
 
       <!-- 操作列 -->
       <template #actions="{ row }">
-        <Button size="small" type="primary" @click="handleEdit(row)">
-          编辑
-        </Button>
-        <Button size="small" danger @click="handleDelete(row)"> 删除 </Button>
+        <TableAction
+          :actions="[
+            {
+              label: '编辑',
+              type: 'link',
+              icon: ACTION_ICON.EDIT,
+              onClick: handleEdit.bind(null, row),
+            },
+            {
+              label: '删除',
+              type: 'link',
+              danger: true,
+              icon: ACTION_ICON.DELETE,
+              popConfirm: {
+                title: '确认删除该功能吗?',
+                confirm: handleDelete.bind(null, row),
+              },
+            },
+          ]"
+        />
       </template>
     </Grid>
+
+    <!-- 物模型表单 -->
+    <ThingModelForm ref="thingModelFormRef" @success="handleRefresh" />
+
+    <!-- TSL 弹窗 -->
+    <ThingModelTSL ref="thingModelTSLRef" />
   </Page>
 </template>
diff --git a/apps/web-antd/src/views/iot/thingmodel/modules/ThingModelEvent.vue b/apps/web-antd/src/views/iot/thingmodel/modules/ThingModelEvent.vue
index 75ac3e5714d4641e604b21887c1e0d57e1fb9f65..367d0160359cdd14e398df6541d1e10058beca17 100644
--- a/apps/web-antd/src/views/iot/thingmodel/modules/ThingModelEvent.vue
+++ b/apps/web-antd/src/views/iot/thingmodel/modules/ThingModelEvent.vue
@@ -2,8 +2,6 @@
 <script lang="ts" setup>
 import type { Ref } from 'vue';
 
-import type { ThingModelEvent } from '#/api/iot/thingmodel';
-
 import { watch } from 'vue';
 
 import { isEmpty } from '@vben/utils';
@@ -27,7 +25,7 @@ const thingModelEvent = useVModel(
   props,
   'modelValue',
   emits,
-) as Ref<ThingModelEvent>;
+) as Ref<any>;
 
 // 默认选中，INFO 信息
 watch(
@@ -43,9 +41,9 @@ watch(
   <Form.Item
     :rules="[{ required: true, message: '请选择事件类型', trigger: 'change' }]"
     label="事件类型"
-    prop="event.type"
+    name="event.type"
   >
-    <Radio.Group v-model="thingModelEvent.type">
+    <Radio.Group v-model:value="thingModelEvent.type">
       <Radio
         v-for="eventType in Object.values(IoTThingModelEventTypeEnum)"
         :key="eventType.value"
@@ -57,7 +55,7 @@ watch(
   </Form.Item>
   <Form.Item label="输出参数">
     <ThingModelInputOutputParam
-      v-model="thingModelEvent.outputData"
+      v-model="thingModelEvent.outputParams"
       :direction="IoTThingModelParamDirectionEnum.OUTPUT"
     />
   </Form.Item>
diff --git a/apps/web-antd/src/views/iot/thingmodel/modules/ThingModelForm.vue b/apps/web-antd/src/views/iot/thingmodel/modules/ThingModelForm.vue
index 4165813a107f007e6d3ebd02252ad267fe4a50d1..5ffc24f4d335afa80c8e494a0e2bc04503bc4a52 100644
--- a/apps/web-antd/src/views/iot/thingmodel/modules/ThingModelForm.vue
+++ b/apps/web-antd/src/views/iot/thingmodel/modules/ThingModelForm.vue
@@ -12,7 +12,7 @@ import { getDictOptions } from '@vben/hooks';
 import { $t } from '@vben/locales';
 import { cloneDeep } from '@vben/utils';
 
-import { Button, Form, Input, message, Radio } from 'ant-design-vue';
+import { Form, Input, message, Modal, Radio } from 'ant-design-vue';
 
 import {
   createThingModel,
@@ -40,8 +40,8 @@ const dialogVisible = ref(false); // 弹窗的是否展示
 const dialogTitle = ref(''); // 弹窗的标题
 const formLoading = ref(false); // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
 const formType = ref(''); // 表单的类型：create - 新增；update - 修改
-const formData = ref<ThingModelData>({
-  type: IoTThingModelTypeEnum.PROPERTY.toString(),
+const formData = ref<any>({
+  type: IoTThingModelTypeEnum.PROPERTY,
   dataType: IoTDataSpecsDataTypeEnum.INT,
   property: {
     dataType: IoTDataSpecsDataTypeEnum.INT,
@@ -49,8 +49,13 @@ const formData = ref<ThingModelData>({
       dataType: IoTDataSpecsDataTypeEnum.INT,
     },
   },
-  service: {},
-  event: {},
+  service: {
+    inputParams: [],
+    outputParams: [],
+  },
+  event: {
+    outputParams: [],
+  },
 });
 
 const formRef = ref(); // 表单 Ref
@@ -58,13 +63,19 @@ const formRef = ref(); // 表单 Ref
 /** 打开弹窗 */
 const open = async (type: string, id?: number) => {
   dialogVisible.value = true;
-  dialogTitle.value = $t(`action.${type}`);
+  // 设置标题：create -> 新增，update -> 编辑
+  dialogTitle.value = type === 'create' ? $t('page.action.add') : $t('page.action.edit');
   formType.value = type;
   resetForm();
   if (id) {
     formLoading.value = true;
     try {
-      formData.value = await getThingModel(id);
+      const result = await getThingModel(id);
+      // 转换类型为数字
+      formData.value = {
+        ...result,
+        type: Number(result.type),
+      };
       // 情况一：属性初始化
       if (
         !formData.value.property ||
@@ -77,20 +88,50 @@ const open = async (type: string, id?: number) => {
             dataType: IoTDataSpecsDataTypeEnum.INT,
           },
         };
+      } else {
+        // 确保 dataSpecs 和 dataSpecsList 存在
+        if (!formData.value.property.dataSpecs) {
+          formData.value.property.dataSpecs = {};
+        }
+        if (!formData.value.property.dataSpecsList) {
+          formData.value.property.dataSpecsList = [];
+        }
+        // 如果 property.dataType 不存在，设置为默认值
+        if (!formData.value.property.dataType) {
+          formData.value.property.dataType = IoTDataSpecsDataTypeEnum.INT;
+        }
       }
       // 情况二：服务初始化
       if (
         !formData.value.service ||
         Object.keys(formData.value.service).length === 0
       ) {
-        formData.value.service = {};
+        formData.value.service = {
+          inputParams: [],
+          outputParams: [],
+        };
+      } else {
+        // 确保参数数组存在
+        if (!formData.value.service.inputParams) {
+          formData.value.service.inputParams = [];
+        }
+        if (!formData.value.service.outputParams) {
+          formData.value.service.outputParams = [];
+        }
       }
       // 情况三：事件初始化
       if (
         !formData.value.event ||
         Object.keys(formData.value.event).length === 0
       ) {
-        formData.value.event = {};
+        formData.value.event = {
+          outputParams: [],
+        };
+      } else {
+        // 确保参数数组存在
+        if (!formData.value.event.outputParams) {
+          formData.value.event.outputParams = [];
+        }
       }
     } finally {
       formLoading.value = false;
@@ -137,6 +178,13 @@ function fillExtraAttributes(data: any) {
     data.dataType = data.service.dataType;
     data.service.identifier = data.identifier;
     data.service.name = data.name;
+    // 保留输入输出参数，但如果为空数组则删除
+    if (!data.service.inputParams || data.service.inputParams.length === 0) {
+      delete data.service.inputParams;
+    }
+    if (!data.service.outputParams || data.service.outputParams.length === 0) {
+      delete data.service.outputParams;
+    }
     delete data.property;
     delete data.event;
   }
@@ -146,6 +194,10 @@ function fillExtraAttributes(data: any) {
     data.dataType = data.event.dataType;
     data.event.identifier = data.identifier;
     data.event.name = data.name;
+    // 保留输出参数，但如果为空数组则删除
+    if (!data.event.outputParams || data.event.outputParams.length === 0) {
+      delete data.event.outputParams;
+    }
     delete data.property;
     delete data.service;
   }
@@ -164,7 +216,7 @@ function removeDataSpecs(val: any) {
 /** 重置表单 */
 function resetForm() {
   formData.value = {
-    type: IoTThingModelTypeEnum.PROPERTY.toString(),
+    type: IoTThingModelTypeEnum.PROPERTY,
     dataType: IoTDataSpecsDataTypeEnum.INT,
     property: {
       dataType: IoTDataSpecsDataTypeEnum.INT,
@@ -172,18 +224,27 @@ function resetForm() {
         dataType: IoTDataSpecsDataTypeEnum.INT,
       },
     },
-    service: {},
-    event: {},
+    service: {
+      inputParams: [],
+      outputParams: [],
+    },
+    event: {
+      outputParams: [],
+    },
   };
   formRef.value?.resetFields();
 }
 </script>
 
 <template>
-  <Modal v-model="dialogVisible" :title="dialogTitle">
+  <Modal
+    v-model:open="dialogVisible"
+    :title="dialogTitle"
+    :confirm-loading="formLoading"
+    @ok="submitForm"
+  >
     <Form
       ref="formRef"
-      :loading="formLoading"
       :model="formData"
       :label-col="{ span: 6 }"
       :wrapper-col="{ span: 18 }"
@@ -191,12 +252,9 @@ function resetForm() {
       <Form.Item label="功能类型" name="type">
         <Radio.Group v-model:value="formData.type">
           <Radio.Button
-            v-for="(dict, index) in getDictOptions(
-              DICT_TYPE.IOT_THING_MODEL_TYPE,
-              'number',
-            )"
-            :key="index"
-            :value="dict.value"
+            v-for="dict in getDictOptions(DICT_TYPE.IOT_THING_MODEL_TYPE)"
+            :key="String(dict.value)"
+            :value="Number(dict.value)"
           >
             {{ dict.label }}
           </Radio.Button>
@@ -210,17 +268,17 @@ function resetForm() {
       </Form.Item>
       <!-- 属性配置 -->
       <ThingModelProperty
-        v-if="formData.type === IoTThingModelTypeEnum.PROPERTY.toString()"
+        v-if="formData.type === IoTThingModelTypeEnum.PROPERTY"
         v-model="formData.property"
       />
       <!-- 服务配置 -->
       <ThingModelService
-        v-if="formData.type === IoTThingModelTypeEnum.SERVICE.toString()"
+        v-if="formData.type === IoTThingModelTypeEnum.SERVICE"
         v-model="formData.service"
       />
       <!-- 事件配置 -->
       <ThingModelEvent
-        v-if="formData.type === IoTThingModelTypeEnum.EVENT.toString()"
+        v-if="formData.type === IoTThingModelTypeEnum.EVENT"
         v-model="formData.event"
       />
       <Form.Item label="描述" name="desc">
@@ -232,12 +290,5 @@ function resetForm() {
         />
       </Form.Item>
     </Form>
-
-    <template #footer>
-      <Button :disabled="formLoading" type="primary" @click="submitForm">
-        确 定
-      </Button>
-      <Button @click="dialogVisible = false">取 消</Button>
-    </template>
   </Modal>
 </template>
diff --git a/apps/web-antd/src/views/iot/thingmodel/modules/ThingModelInputOutputParam.vue b/apps/web-antd/src/views/iot/thingmodel/modules/ThingModelInputOutputParam.vue
index 4c10b0d9bee35116a8f7cc7d56d21ecb2e5233cb..7fc0b925584456adec526e2f6514c0d6d59e1afc 100644
--- a/apps/web-antd/src/views/iot/thingmodel/modules/ThingModelInputOutputParam.vue
+++ b/apps/web-antd/src/views/iot/thingmodel/modules/ThingModelInputOutputParam.vue
@@ -29,6 +29,7 @@ const formData = ref<any>({
     dataSpecs: {
       dataType: IoTDataSpecsDataTypeEnum.INT,
     },
+    dataSpecsList: [],
   },
 });
 
@@ -40,16 +41,22 @@ function openParamForm(val: any) {
     return;
   }
   // 编辑时回显数据
+  const valData = val as any;
   formData.value = {
-    identifier: val.identifier,
-    name: val.name,
-    description: val.description,
+    identifier: valData?.identifier || '',
+    name: valData?.name || '',
+    description: valData?.description || '',
     property: {
-      dataType: val.dataType,
-      dataSpecs: val.dataSpecs,
-      dataSpecsList: val.dataSpecsList,
+      dataType: valData?.dataType || IoTDataSpecsDataTypeEnum.INT,
+      dataSpecs: valData?.dataSpecs ?? {},
+      dataSpecsList: valData?.dataSpecsList ?? [],
     },
   };
+
+  // 确保 property.dataType 有值
+  if (!formData.value.property.dataType) {
+    formData.value.property.dataType = IoTDataSpecsDataTypeEnum.INT;
+  }
 }
 
 /** 删除 param 项 */
@@ -108,6 +115,7 @@ function resetForm() {
       dataSpecs: {
         dataType: IoTDataSpecsDataTypeEnum.INT,
       },
+      dataSpecsList: [],
     },
   };
   paramFormRef.value?.resetFields();
@@ -122,35 +130,34 @@ function resetForm() {
   >
     <span>参数名称：{{ item.name }}</span>
     <div class="btn">
-      <Button link type="primary" @click="openParamForm(item)"> 编辑 </Button>
-      <Divider direction="vertical" />
-      <Button link danger @click="deleteParamItem(index)"> 删除 </Button>
+      <Button type="link" @click="openParamForm(item)">编辑</Button>
+      <Divider type="vertical" />
+      <Button type="link" danger @click="deleteParamItem(index)">删除</Button>
     </div>
   </div>
-  <Button link type="primary" @click="openParamForm(null)"> +新增参数 </Button>
+  <Button type="link" @click="openParamForm(null)">+新增参数</Button>
 
   <!-- param 表单 -->
-  <Modal v-model="dialogVisible" title="新增参数" append-to-body>
+  <Modal
+    v-model:open="dialogVisible"
+    title="新增参数"
+    :confirm-loading="formLoading"
+    @ok="submitForm"
+  >
     <Form
       ref="paramFormRef"
-      v-loading="formLoading"
       :model="formData"
-      label-width="100px"
+      :label-col="{ span: 6 }"
+      :wrapper-col="{ span: 18 }"
     >
-      <Form.Item label="参数名称" prop="name">
-        <Input v-model="formData.name" placeholder="请输入功能名称" />
+      <Form.Item label="参数名称" name="name">
+        <Input v-model:value="formData.name" placeholder="请输入功能名称" />
       </Form.Item>
-      <Form.Item label="标识符" prop="identifier">
-        <Input v-model="formData.identifier" placeholder="请输入标识符" />
+      <Form.Item label="标识符" name="identifier">
+        <Input v-model:value="formData.identifier" placeholder="请输入标识符" />
       </Form.Item>
       <!-- 属性配置 -->
       <ThingModelProperty v-model="formData.property" is-params />
     </Form>
-    <template #footer>
-      <Button :disabled="formLoading" type="primary" @click="submitForm">
-        确 定
-      </Button>
-      <Button @click="dialogVisible = false">取 消</Button>
-    </template>
   </Modal>
 </template>
diff --git a/apps/web-antd/src/views/iot/thingmodel/modules/ThingModelProperty.vue b/apps/web-antd/src/views/iot/thingmodel/modules/ThingModelProperty.vue
index 6f9f869e0c60499b3644911ffbce5db3e1c513ee..2536c3eba5324c6ea21b876fc5e6a98587b8c54b 100644
--- a/apps/web-antd/src/views/iot/thingmodel/modules/ThingModelProperty.vue
+++ b/apps/web-antd/src/views/iot/thingmodel/modules/ThingModelProperty.vue
@@ -11,7 +11,6 @@ import { isEmpty } from '@vben/utils';
 import { useVModel } from '@vueuse/core';
 import { Form, Input, Radio, Select } from 'ant-design-vue';
 
-import { validateBoolName } from '#/api/iot/thingmodel';
 import {
   getDataTypeOptions,
   IoTDataSpecsDataTypeEnum,
@@ -43,13 +42,8 @@ const getDataTypeOptions2 = computed(() => {
   if (!props.isStructDataSpecs) {
     return getDataTypeOptions();
   }
-  const excludedTypes = new Set([
-    IoTDataSpecsDataTypeEnum.ARRAY,
-    IoTDataSpecsDataTypeEnum.STRUCT,
-  ]);
-  return getDataTypeOptions().filter(
-    (item: any) => !excludedTypes.has(item.value),
-  );
+  const excludedTypes = [IoTDataSpecsDataTypeEnum.STRUCT, IoTDataSpecsDataTypeEnum.ARRAY];
+  return getDataTypeOptions().filter((item: any) => !excludedTypes.includes(item.value));
 }); // 获得数据类型列表
 
 /** 属性值的数据类型切换时初始化相关数据 */
@@ -58,11 +52,19 @@ function handleChange(dataType: any) {
   property.value.dataSpecsList = [];
   // 不是列表型数据才设置 dataSpecs.dataType
   ![
-    IoTDataSpecsDataTypeEnum.BOOL,
     IoTDataSpecsDataTypeEnum.ENUM,
+    IoTDataSpecsDataTypeEnum.BOOL,
     IoTDataSpecsDataTypeEnum.STRUCT,
   ].includes(dataType) && (property.value.dataSpecs.dataType = dataType);
   switch (dataType) {
+    case IoTDataSpecsDataTypeEnum.ENUM: {
+      property.value.dataSpecsList.push({
+        dataType: IoTDataSpecsDataTypeEnum.ENUM,
+        name: '', // 枚举项的名称
+        value: undefined, // 枚举值
+      });
+      break;
+    }
     case IoTDataSpecsDataTypeEnum.BOOL: {
       for (let i = 0; i < 2; i++) {
         property.value.dataSpecsList.push({
@@ -73,15 +75,8 @@ function handleChange(dataType: any) {
       }
       break;
     }
-    case IoTDataSpecsDataTypeEnum.ENUM: {
-      property.value.dataSpecsList.push({
-        dataType: IoTDataSpecsDataTypeEnum.ENUM,
-        name: '', // 枚举项的名称
-        value: undefined, // 枚举值
-      });
-      break;
-    }
   }
+  // useVModel 会自动同步数据到父组件，不需要手动 emit
 }
 
 /** 默认选中读写 */
@@ -91,9 +86,9 @@ watch(
     if (props.isStructDataSpecs || props.isParams) {
       return;
     }
-    isEmpty(val) &&
-      (property.value.accessMode =
-        IoTThingModelAccessModeEnum.READ_WRITE.value);
+    if (isEmpty(val)) {
+      property.value.accessMode = IoTThingModelAccessModeEnum.READ_WRITE.value;
+    }
   },
   { immediate: true },
 );
@@ -101,12 +96,10 @@ watch(
 
 <template>
   <Form.Item
-    :rules="[{ required: true, message: '请选择数据类型', trigger: 'change' }]"
     label="数据类型"
-    prop="property.dataType"
   >
     <Select
-      v-model="property.dataType"
+      v-model:value="property.dataType"
       placeholder="请选择数据类型"
       @change="handleChange"
     >
@@ -114,9 +107,10 @@ watch(
       <Select.Option
         v-for="option in getDataTypeOptions2"
         :key="option.value"
-        :label="`${option.value}(${option.label})`"
         :value="option.value"
-      />
+      >
+        {{ `${option.value}(${option.label})` }}
+      </Select.Option>
     </Select>
   </Form.Item>
   <!-- 数值型配置 -->
@@ -140,24 +134,17 @@ watch(
     v-if="property.dataType === IoTDataSpecsDataTypeEnum.BOOL"
     label="布尔值"
   >
-    <template v-for="(item, index) in property.dataSpecsList" :key="item.value">
-      <div class="w-1/1 mb-5px flex items-center justify-start">
+    <template v-for="item in property.dataSpecsList" :key="item.value">
+      <div class="flex items-center justify-start w-1/1 mb-5px">
         <span>{{ item.value }}</span>
         <span class="mx-2">-</span>
-        <Form.Item
-          :prop="`property.dataSpecsList[${index}].name`"
-          :rules="[
-            { required: true, message: '枚举描述不能为空' },
-            { validator: validateBoolName, trigger: 'blur' },
-          ]"
-          class="mb-0 flex-1"
-        >
+        <div class="flex-1">
           <Input
-            v-model="item.name"
+            v-model:value="item.name"
             :placeholder="`如：${item.value === 0 ? '关' : '开'}`"
             class="w-255px!"
           />
-        </Form.Item>
+        </div>
       </div>
     </template>
   </Form.Item>
@@ -165,21 +152,21 @@ watch(
   <Form.Item
     v-if="property.dataType === IoTDataSpecsDataTypeEnum.TEXT"
     label="数据长度"
-    prop="property.dataSpecs.length"
+    name="property.dataSpecs.length"
   >
     <Input
-      v-model="property.dataSpecs.length"
+      v-model:value="property.dataSpecs.length"
       class="w-255px!"
       placeholder="请输入文本字节长度"
     >
-      <template #append>字节</template>
+      <template #addonAfter>字节</template>
     </Input>
   </Form.Item>
   <!-- 时间型配置 -->
   <Form.Item
     v-if="property.dataType === IoTDataSpecsDataTypeEnum.DATE"
     label="时间格式"
-    prop="date"
+    name="date"
   >
     <Input
       class="w-255px!"
@@ -200,13 +187,13 @@ watch(
   <Form.Item
     v-if="!isStructDataSpecs && !isParams"
     label="读写类型"
-    prop="property.accessMode"
+    name="property.accessMode"
   >
-    <Radio.Group v-model="property.accessMode">
+    <Radio.Group v-model:value="property.accessMode">
       <Radio
         v-for="accessMode in Object.values(IoTThingModelAccessModeEnum)"
         :key="accessMode.value"
-        :label="accessMode.value"
+        :value="accessMode.value"
       >
         {{ accessMode.label }}
       </Radio>
diff --git a/apps/web-antd/src/views/iot/thingmodel/modules/ThingModelService.vue b/apps/web-antd/src/views/iot/thingmodel/modules/ThingModelService.vue
index 2b5611bc5d09ff80bbb702eb8bf2b3264bccf39d..f65c74b245d9706fcecb26d1d2cee21fb9127bf5 100644
--- a/apps/web-antd/src/views/iot/thingmodel/modules/ThingModelService.vue
+++ b/apps/web-antd/src/views/iot/thingmodel/modules/ThingModelService.vue
@@ -2,8 +2,6 @@
 <script lang="ts" setup>
 import type { Ref } from 'vue';
 
-import type { ThingModelService } from '#/api/iot/thingmodel';
-
 import { watch } from 'vue';
 
 import { isEmpty } from '@vben/utils';
@@ -23,7 +21,7 @@ defineOptions({ name: 'ThingModelService' });
 
 const props = defineProps<{ isStructDataSpecs?: boolean; modelValue: any }>();
 const emits = defineEmits(['update:modelValue']);
-const service = useVModel(props, 'modelValue', emits) as Ref<ThingModelService>;
+const service = useVModel(props, 'modelValue', emits) as Ref<any>;
 
 /** 默认选中，ASYNC 异步 */
 watch(
@@ -39,9 +37,9 @@ watch(
   <Form.Item
     :rules="[{ required: true, message: '请选择调用方式', trigger: 'change' }]"
     label="调用方式"
-    prop="service.callType"
+    name="service.callType"
   >
-    <Radio.Group v-model="service.callType">
+    <Radio.Group v-model:value="service.callType">
       <Radio
         v-for="callType in Object.values(IoTThingModelServiceCallTypeEnum)"
         :key="callType.value"
@@ -53,13 +51,13 @@ watch(
   </Form.Item>
   <Form.Item label="输入参数">
     <ThingModelInputOutputParam
-      v-model="service.inputData"
+      v-model="service.inputParams"
       :direction="IoTThingModelParamDirectionEnum.INPUT"
     />
   </Form.Item>
   <Form.Item label="输出参数">
     <ThingModelInputOutputParam
-      v-model="service.outputData"
+      v-model="service.outputParams"
       :direction="IoTThingModelParamDirectionEnum.OUTPUT"
     />
   </Form.Item>
diff --git a/apps/web-antd/src/views/iot/thingmodel/modules/ThingModelTSL.vue b/apps/web-antd/src/views/iot/thingmodel/modules/ThingModelTSL.vue
index 8a3d4d69496f89d51509550fdbfd35bb6392937c..4af4ecb5ce70ec357f5599201970f8c199d589bd 100644
--- a/apps/web-antd/src/views/iot/thingmodel/modules/ThingModelTSL.vue
+++ b/apps/web-antd/src/views/iot/thingmodel/modules/ThingModelTSL.vue
@@ -3,58 +3,115 @@ import type { Ref } from 'vue';
 
 import type { IotProductApi } from '#/api/iot/product/product';
 
-import { inject, onMounted, ref } from 'vue';
+import { computed, inject, ref, watch } from 'vue';
 
-import { Modal, Radio } from 'ant-design-vue';
-import hljs from 'highlight.js'; // 导入代码高亮文件
-import json from 'highlight.js/lib/languages/json';
+import { Modal, Radio, Textarea } from 'ant-design-vue';
 
-import { getThingModelListByProductId } from '#/api/iot/thingmodel';
+import { getThingModelTSL } from '#/api/iot/thingmodel';
 import { IOT_PROVIDE_KEY } from '#/views/iot/utils/constants';
 
-import 'highlight.js/styles/github.css'; // 导入代码高亮样式
-
 defineOptions({ name: 'ThingModelTSL' });
 
 const dialogVisible = ref(false); // 弹窗的是否展示
 const dialogTitle = ref('物模型 TSL'); // 弹窗的标题
 const product = inject<Ref<IotProductApi.Product>>(IOT_PROVIDE_KEY.PRODUCT); // 注入产品信息
-const viewMode = ref('code'); // 查看模式：code-代码视图，editor-编辑器视图
+const viewMode = ref('view'); // 查看模式：view-代码视图，editor-编辑器视图
 
 /** 打开弹窗 */
-function open() {
+const open = async () => {
   dialogVisible.value = true;
-}
+  await getTsl();
+};
 defineExpose({ open });
 
 /** 获取 TSL */
-const thingModelTSL = ref({});
-async function getTsl() {
-  thingModelTSL.value = await getThingModelListByProductId(
-    product?.value?.id || 0,
-  );
-}
+const thingModelTSL = ref<any>({});
+const tslString = ref(''); // 用于编辑器的字符串格式
 
-/** 初始化 */
-onMounted(async () => {
-  // 注册代码高亮的各种语言
-  hljs.registerLanguage('json', json);
-  await getTsl();
+const getTsl = async () => {
+  try {
+    thingModelTSL.value = await getThingModelTSL(product?.value?.id || 0);
+    // 将对象转换为格式化的 JSON 字符串
+    tslString.value = JSON.stringify(thingModelTSL.value, null, 2);
+  } catch (error) {
+    console.error('获取 TSL 失败:', error);
+    thingModelTSL.value = {};
+    tslString.value = '{}';
+  }
+};
+
+/** 格式化的 TSL 用于只读展示 */
+const formattedTSL = computed(() => {
+  try {
+    if (typeof thingModelTSL.value === 'string') {
+      return JSON.stringify(JSON.parse(thingModelTSL.value), null, 2);
+    }
+    return JSON.stringify(thingModelTSL.value, null, 2);
+  } catch {
+    return JSON.stringify(thingModelTSL.value, null, 2);
+  }
+});
+
+/** 监听编辑器内容变化，实时更新数据 */
+watch(tslString, (newValue) => {
+  try {
+    thingModelTSL.value = JSON.parse(newValue);
+  } catch {
+    // JSON 解析失败时保持原值
+  }
 });
 </script>
 
 <template>
-  <Modal v-model="dialogVisible" :title="dialogTitle">
-    <JsonEditor
-      v-model="thingModelTSL"
-      :mode="viewMode === 'editor' ? 'code' : 'view'"
-      height="600px"
-    />
-    <template #footer>
-      <Radio.Group v-model="viewMode" size="small">
-        <Radio.Button label="code">代码视图</Radio.Button>
-        <Radio.Button label="editor">编辑器视图</Radio.Button>
+  <Modal
+    v-model:open="dialogVisible"
+    :title="dialogTitle"
+    :footer="null"
+    width="800px"
+  >
+    <div class="mb-4">
+      <Radio.Group v-model:value="viewMode" size="small">
+        <Radio.Button value="view">代码视图</Radio.Button>
+        <Radio.Button value="editor">编辑器视图</Radio.Button>
       </Radio.Group>
-    </template>
+    </div>
+    <!-- 代码视图 - 只读展示 -->
+    <div v-if="viewMode === 'view'" class="json-viewer-container">
+      <pre class="json-code"><code>{{ formattedTSL }}</code></pre>
+    </div>
+    <!-- 编辑器视图 - 可编辑 -->
+    <Textarea
+      v-else
+      v-model:value="tslString"
+      :rows="20"
+      placeholder="请输入 JSON 格式的物模型 TSL"
+      class="json-editor"
+    />
   </Modal>
 </template>
+
+<style scoped>
+.json-viewer-container {
+  background-color: #f5f5f5;
+  border: 1px solid #d9d9d9;
+  border-radius: 4px;
+  padding: 12px;
+  max-height: 600px;
+  overflow-y: auto;
+}
+
+.json-code {
+  margin: 0;
+  font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', monospace;
+  font-size: 13px;
+  line-height: 1.5;
+  color: #333;
+  white-space: pre-wrap;
+  word-wrap: break-word;
+}
+
+.json-editor {
+  font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', monospace;
+  font-size: 13px;
+}
+</style>
diff --git a/apps/web-antd/src/views/iot/thingmodel/modules/components/DataDefinition.vue b/apps/web-antd/src/views/iot/thingmodel/modules/components/DataDefinition.vue
index d600daf4fe48657f49301e7abc808239831d10da..51a79cc9d7a02277fb0268596fc82fb1bac5e24a 100644
--- a/apps/web-antd/src/views/iot/thingmodel/modules/components/DataDefinition.vue
+++ b/apps/web-antd/src/views/iot/thingmodel/modules/components/DataDefinition.vue
@@ -1,6 +1,10 @@
 <script lang="ts" setup>
 import type { ThingModelData } from '#/api/iot/thingmodel';
 
+import { computed } from 'vue';
+
+import { Tooltip } from 'ant-design-vue';
+
 import {
   getEventTypeLabel,
   getThingModelServiceCallTypeLabel,
@@ -11,12 +15,32 @@ import {
 /** 数据定义展示组件 */
 defineOptions({ name: 'DataDefinition' });
 
-defineProps<{ data: ThingModelData }>();
+const props = defineProps<{ data: ThingModelData }>();
+
+// 格式化布尔值和枚举值列表为字符串
+const formattedDataSpecsList = computed(() => {
+  if (!props.data.property?.dataSpecsList || props.data.property.dataSpecsList.length === 0) {
+    return '';
+  }
+  return props.data.property.dataSpecsList
+    .map(item => `${item.value}-${item.name}`)
+    .join('、');
+});
+
+// 显示的简短文本（第一个值）
+const shortText = computed(() => {
+  if (!props.data.property?.dataSpecsList || props.data.property.dataSpecsList.length === 0) {
+    return '-';
+  }
+  const first = props.data.property.dataSpecsList[0];
+  const count = props.data.property.dataSpecsList.length;
+  return count > 1 ? `${first.value}-${first.name} 等${count}项` : `${first.value}-${first.name}`;
+});
 </script>
 
 <template>
   <!-- 属性 -->
-  <template v-if="data.type === IoTThingModelTypeEnum.PROPERTY.toString()">
+  <template v-if="Number(data.type) === IoTThingModelTypeEnum.PROPERTY">
     <!-- 非列表型：数值 -->
     <div
       v-if="
@@ -28,12 +52,12 @@ defineProps<{ data: ThingModelData }>();
       "
     >
       取值范围：{{
-        `${data.property?.dataSpecs.min}~${data.property?.dataSpecs.max}`
+        `${data.property?.dataSpecs?.min}~${data.property?.dataSpecs?.max}`
       }}
     </div>
     <!-- 非列表型：文本 -->
     <div v-if="IoTDataSpecsDataTypeEnum.TEXT === data.property?.dataType">
-      数据长度：{{ data.property?.dataSpecs.length }}
+      数据长度：{{ data.property?.dataSpecs?.length }}
     </div>
     <!-- 列表型: 数组、结构、时间（特殊） -->
     <div
@@ -55,28 +79,37 @@ defineProps<{ data: ThingModelData }>();
         )
       "
     >
-      <div>
-        {{
-          IoTDataSpecsDataTypeEnum.BOOL === data.property?.dataType
-            ? '布尔值'
-            : '枚举值'
-        }}：
-      </div>
-      <div v-for="item in data.property?.dataSpecsList" :key="item.value">
-        {{ `${item.name}-${item.value}` }}
-      </div>
+      <Tooltip :title="formattedDataSpecsList" placement="topLeft">
+        <span class="data-specs-text">
+          {{
+            IoTDataSpecsDataTypeEnum.BOOL === data.property?.dataType
+              ? '布尔值'
+              : '枚举值'
+          }}：{{ shortText }}
+        </span>
+      </Tooltip>
     </div>
   </template>
   <!-- 服务 -->
-  <div v-if="data.type === IoTThingModelTypeEnum.SERVICE.toString()">
+  <div v-if="Number(data.type) === IoTThingModelTypeEnum.SERVICE">
     调用方式：{{
       getThingModelServiceCallTypeLabel(data.service?.callType as any)
     }}
   </div>
   <!-- 事件 -->
-  <div v-if="data.type === IoTThingModelTypeEnum.EVENT.toString()">
+  <div v-if="Number(data.type) === IoTThingModelTypeEnum.EVENT">
     事件类型：{{ getEventTypeLabel(data.event?.type as any) }}
   </div>
 </template>
 
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+.data-specs-text {
+  cursor: help;
+  border-bottom: 1px dashed #d9d9d9;
+
+  &:hover {
+    border-bottom-color: #1890ff;
+    color: #1890ff;
+  }
+}
+</style>
diff --git a/apps/web-antd/src/views/iot/thingmodel/modules/dataSpecs/ThingModelArrayDataSpecs.vue b/apps/web-antd/src/views/iot/thingmodel/modules/dataSpecs/ThingModelArrayDataSpecs.vue
index 29bbf29b3ad450eec7569662b8875d7ab9bf377b..dd3e58241b5cd057e3639ec2fe7dbd2c43d13233 100644
--- a/apps/web-antd/src/views/iot/thingmodel/modules/dataSpecs/ThingModelArrayDataSpecs.vue
+++ b/apps/web-antd/src/views/iot/thingmodel/modules/dataSpecs/ThingModelArrayDataSpecs.vue
@@ -29,8 +29,8 @@ function handleChange(val: any) {
 </script>
 
 <template>
-  <Form.Item label="元素类型" prop="property.dataSpecs.childDataType">
-    <Radio.Group v-model="dataSpecs.childDataType" @change="handleChange">
+  <Form.Item label="元素类型" name="property.dataSpecs.childDataType">
+    <Radio.Group v-model:value="dataSpecs.childDataType" @change="handleChange">
       <template v-for="item in getDataTypeOptions()" :key="item.value">
         <Radio
           v-if="
@@ -50,8 +50,8 @@ function handleChange(val: any) {
       </template>
     </Radio.Group>
   </Form.Item>
-  <Form.Item label="元素个数" prop="property.dataSpecs.size">
-    <Input v-model="dataSpecs.size" placeholder="请输入数组中的元素个数" />
+  <Form.Item label="元素个数" name="property.dataSpecs.size">
+    <Input v-model:value="dataSpecs.size" placeholder="请输入数组中的元素个数" />
   </Form.Item>
   <!-- Struct 型配置-->
   <ThingModelStructDataSpecs
diff --git a/apps/web-antd/src/views/iot/thingmodel/modules/dataSpecs/ThingModelEnumDataSpecs.vue b/apps/web-antd/src/views/iot/thingmodel/modules/dataSpecs/ThingModelEnumDataSpecs.vue
index 13bb95315125ea0eae006e796ffa3f6ed8ed267b..da03db37d238de14d767c9cad49d248c3cc4d934 100644
--- a/apps/web-antd/src/views/iot/thingmodel/modules/dataSpecs/ThingModelEnumDataSpecs.vue
+++ b/apps/web-antd/src/views/iot/thingmodel/modules/dataSpecs/ThingModelEnumDataSpecs.vue
@@ -2,31 +2,22 @@
 <script lang="ts" setup>
 import type { Ref } from 'vue';
 
-import type { DataSpecsEnumOrBoolData } from '#/api/iot/thingmodel';
-
-import { isEmpty } from '@vben/utils';
-
 import { useVModel } from '@vueuse/core';
 import { Button, Form, Input, message } from 'ant-design-vue';
 
-import { IoTDataSpecsDataTypeEnum } from '#/views/iot/utils/constants';
-
 /** 枚举型的 dataSpecs 配置组件 */
 defineOptions({ name: 'ThingModelEnumDataSpecs' });
 
 const props = defineProps<{ modelValue: any }>();
 const emits = defineEmits(['update:modelValue']);
-const dataSpecsList = useVModel(props, 'modelValue', emits) as Ref<
-  DataSpecsEnumOrBoolData[]
->;
+const dataSpecsList = useVModel(props, 'modelValue', emits) as Ref<any[]>;
 
 /** 添加枚举项 */
 function addEnum() {
   dataSpecsList.value.push({
-    dataType: IoTDataSpecsDataTypeEnum.ENUM,
     name: '', // 枚举项的名称
     value: '', // 枚举值
-  });
+  } as any);
 }
 
 /** 删除枚举项 */
@@ -38,92 +29,10 @@ function deleteEnum(index: number) {
   dataSpecsList.value.splice(index, 1);
 }
 
-/** 校验枚举值 */
-function validateEnumValue(_: any, value: any, callback: any) {
-  if (isEmpty(value)) {
-    callback(new Error('枚举值不能为空'));
-    return;
-  }
-  if (Number.isNaN(Number(value))) {
-    callback(new Error('枚举值必须是数字'));
-    return;
-  }
-  // 检查枚举值是否重复
-  const values = dataSpecsList.value.map((item) => item.value);
-  if (values.filter((v) => v === value).length > 1) {
-    callback(new Error('枚举值不能重复'));
-    return;
-  }
-  callback();
-}
-
-/** 校验枚举描述 */
-function validateEnumName(_: any, value: string, callback: any) {
-  if (isEmpty(value)) {
-    callback(new Error('枚举描述不能为空'));
-    return;
-  }
-  // 检查开头字符
-  if (!/^[\u4E00-\u9FA5a-z0-9]/i.test(value)) {
-    callback(new Error('枚举描述必须以中文、英文字母或数字开头'));
-    return;
-  }
-  // 检查整体格式
-  if (!/^[\u4E00-\u9FA5a-z0-9][\w\u4E00-\u9FA5-]*$/i.test(value)) {
-    callback(new Error('枚举描述只能包含中文、英文字母、数字、下划线和短划线'));
-    return;
-  }
-  // 检查长度（一个中文算一个字符）
-  if (value.length > 20) {
-    callback(new Error('枚举描述长度不能超过20个字符'));
-    return;
-  }
-  callback();
-}
-
-/** 校验整个枚举列表 */
-function validateEnumList(_: any, __: any, callback: any) {
-  if (isEmpty(dataSpecsList.value)) {
-    callback(new Error('请至少添加一个枚举项'));
-    return;
-  }
-
-  // 检查是否存在空值
-  const hasEmptyValue = dataSpecsList.value.some(
-    (item) => isEmpty(item.value) || isEmpty(item.name),
-  );
-  if (hasEmptyValue) {
-    callback(new Error('存在未填写的枚举值或描述'));
-    return;
-  }
-
-  // 检查枚举值是否都是数字
-  const hasInvalidNumber = dataSpecsList.value.some((item) =>
-    Number.isNaN(Number(item.value)),
-  );
-  if (hasInvalidNumber) {
-    callback(new Error('存在非数字的枚举值'));
-    return;
-  }
-
-  // 检查是否有重复的枚举值
-  const values = dataSpecsList.value.map((item) => item.value);
-  const uniqueValues = new Set(values);
-  if (values.length !== uniqueValues.size) {
-    callback(new Error('存在重复的枚举值'));
-    return;
-  }
-  callback();
-}
 </script>
 
 <template>
-  <Form.Item
-    :rules="[
-      { required: true, validator: validateEnumList, trigger: 'change' },
-    ]"
-    label="枚举项"
-  >
+  <Form.Item label="枚举项">
     <div class="flex flex-col">
       <div class="flex items-center">
         <span class="flex-1"> 参数值 </span>
@@ -132,41 +41,27 @@ function validateEnumList(_: any, __: any, callback: any) {
       <div
         v-for="(item, index) in dataSpecsList"
         :key="index"
-        class="mb-5px flex items-center justify-between"
+        class="flex items-center justify-between mb-5px"
       >
-        <Form.Item
-          :prop="`property.dataSpecsList[${index}].value`"
-          :rules="[
-            { required: true, message: '枚举值不能为空' },
-            { validator: validateEnumValue, trigger: 'blur' },
-          ]"
-          class="mb-0 flex-1"
-        >
-          <Input v-model="item.value" placeholder="请输入枚举值,如'0'" />
-        </Form.Item>
+        <div class="flex-1">
+          <Input v-model:value="item.value" placeholder="请输入枚举值,如'0'" />
+        </div>
         <span class="mx-2">~</span>
-        <Form.Item
-          :prop="`property.dataSpecsList[${index}].name`"
-          :rules="[
-            { required: true, message: '枚举描述不能为空' },
-            { validator: validateEnumName, trigger: 'blur' },
-          ]"
-          class="mb-0 flex-1"
-        >
-          <Input v-model="item.name" placeholder="对该枚举项的描述" />
-        </Form.Item>
-        <Button class="ml-10px" link type="primary" @click="deleteEnum(index)">
+        <div class="flex-1">
+          <Input v-model:value="item.name" placeholder="对该枚举项的描述" />
+        </div>
+        <Button class="ml-10px" type="link" @click="deleteEnum(index)">
           删除
         </Button>
       </div>
-      <Button link type="primary" @click="addEnum">+添加枚举项</Button>
+      <Button type="link" @click="addEnum">+添加枚举项</Button>
     </div>
   </Form.Item>
 </template>
 
 <style lang="scss" scoped>
-:deep(.el-form-item) {
-  .el-form-item {
+:deep(.ant-form-item) {
+  .ant-form-item {
     margin-bottom: 0;
   }
 }
diff --git a/apps/web-antd/src/views/iot/thingmodel/modules/dataSpecs/ThingModelNumberDataSpecs.vue b/apps/web-antd/src/views/iot/thingmodel/modules/dataSpecs/ThingModelNumberDataSpecs.vue
index 0b08c9c8437c547c0168e773be045fdd83de1f74..9a75a4272905484ebfaf8fd9bb1615ddf022aeb6 100644
--- a/apps/web-antd/src/views/iot/thingmodel/modules/dataSpecs/ThingModelNumberDataSpecs.vue
+++ b/apps/web-antd/src/views/iot/thingmodel/modules/dataSpecs/ThingModelNumberDataSpecs.vue
@@ -1,14 +1,55 @@
 <!-- dataType：number 数组类型 -->
+<template>
+  <Form.Item label="取值范围">
+    <div class="flex items-center justify-between">
+      <div class="flex-1">
+        <Input v-model:value="dataSpecs.min" placeholder="请输入最小值" />
+      </div>
+      <span class="mx-2">~</span>
+      <div class="flex-1">
+        <Input v-model:value="dataSpecs.max" placeholder="请输入最大值" />
+      </div>
+    </div>
+  </Form.Item>
+  <Form.Item label="步长">
+    <Input v-model:value="dataSpecs.step" placeholder="请输入步长" />
+  </Form.Item>
+  <Form.Item label="单位">
+    <Select
+      :model-value="
+        dataSpecs.unit ? `${dataSpecs.unitName}-${dataSpecs.unit}` : ''
+      "
+      show-search
+      placeholder="请选择单位"
+      class="w-1/1"
+      @change="unitChange"
+    >
+      <Select.Option
+        v-for="(item, index) in getDictOptions(
+          DICT_TYPE.IOT_THING_MODEL_UNIT,
+          'string',
+        )"
+        :key="index"
+        :value="`${item.label}-${item.value}`"
+      >
+        {{ `${item.label}-${item.value}` }}
+      </Select.Option>
+    </Select>
+  </Form.Item>
+</template>
+
 <script lang="ts" setup>
 import type { Ref } from 'vue';
 
 import type { DataSpecsNumberData } from '#/api/iot/thingmodel';
 
+import { useVModel } from '@vueuse/core';
+
+import { Form, Input, Select } from 'ant-design-vue';
+
 import { DICT_TYPE } from '@vben/constants';
 import { getDictOptions } from '@vben/hooks';
 
-import { useVModel } from '@vueuse/core';
-
 /** 数值型的 dataSpecs 配置组件 */
 defineOptions({ name: 'ThingModelNumberDataSpecs' });
 
@@ -21,132 +62,17 @@ const dataSpecs = useVModel(
 ) as Ref<DataSpecsNumberData>;
 
 /** 单位发生变化时触发 */
-const unitChange = (UnitSpecs: string) => {
-  const [unitName, unit] = UnitSpecs.split('-');
+const unitChange = (UnitSpecs: any) => {
+  if (!UnitSpecs) return;
+  const [unitName, unit] = String(UnitSpecs).split('-');
   dataSpecs.value.unitName = unitName;
   dataSpecs.value.unit = unit;
 };
-
-/** 校验最小值 */
-const validateMin = (_: any, __: any, callback: any) => {
-  const min = Number(dataSpecs.value.min);
-  const max = Number(dataSpecs.value.max);
-  if (Number.isNaN(min)) {
-    callback(new Error('请输入有效的数值'));
-    return;
-  }
-  if (max !== undefined && !Number.isNaN(max) && min >= max) {
-    callback(new Error('最小值必须小于最大值'));
-    return;
-  }
-
-  callback();
-};
-
-/** 校验最大值 */
-const validateMax = (_: any, __: any, callback: any) => {
-  const min = Number(dataSpecs.value.min);
-  const max = Number(dataSpecs.value.max);
-  if (Number.isNaN(max)) {
-    callback(new Error('请输入有效的数值'));
-    return;
-  }
-  if (min !== undefined && !Number.isNaN(min) && max <= min) {
-    callback(new Error('最大值必须大于最小值'));
-    return;
-  }
-
-  callback();
-};
-
-/** 校验步长 */
-const validateStep = (_: any, __: 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>
-  <el-form-item label="取值范围">
-    <div class="flex items-center justify-between">
-      <el-form-item
-        :rules="[
-          { required: true, message: '最小值不能为空' },
-          { validator: validateMin, trigger: 'blur' },
-        ]"
-        class="mb-0"
-        prop="property.dataSpecs.min"
-      >
-        <el-input v-model="dataSpecs.min" placeholder="请输入最小值" />
-      </el-form-item>
-      <span class="mx-2">~</span>
-      <el-form-item
-        :rules="[
-          { required: true, message: '最大值不能为空' },
-          { validator: validateMax, trigger: 'blur' },
-        ]"
-        class="mb-0"
-        prop="property.dataSpecs.max"
-      >
-        <el-input v-model="dataSpecs.max" placeholder="请输入最大值" />
-      </el-form-item>
-    </div>
-  </el-form-item>
-  <el-form-item
-    :rules="[
-      { required: true, message: '步长不能为空' },
-      { validator: validateStep, trigger: 'blur' },
-    ]"
-    label="步长"
-    prop="property.dataSpecs.step"
-  >
-    <el-input v-model="dataSpecs.step" placeholder="请输入步长" />
-  </el-form-item>
-  <el-form-item
-    :rules="[{ required: true, message: '请选择单位' }]"
-    label="单位"
-    prop="property.dataSpecs.unit"
-  >
-    <el-select
-      :model-value="
-        dataSpecs.unit ? `${dataSpecs.unitName}-${dataSpecs.unit}` : ''
-      "
-      filterable
-      placeholder="请选择单位"
-      class="w-1/1"
-      @change="unitChange"
-    >
-      <el-option
-        v-for="(item, index) in getDictOptions(
-          DICT_TYPE.IOT_THING_MODEL_UNIT,
-          'string',
-        )"
-        :key="index"
-        :label="`${item.label}-${item.value}`"
-        :value="`${item.label}-${item.value}`"
-      />
-    </el-select>
-  </el-form-item>
-</template>
-
 <style lang="scss" scoped>
-:deep(.el-form-item) {
-  .el-form-item {
+:deep(.ant-form-item) {
+  .ant-form-item {
     margin-bottom: 0;
   }
 }
diff --git a/apps/web-antd/src/views/iot/thingmodel/modules/dataSpecs/ThingModelStructDataSpecs.vue b/apps/web-antd/src/views/iot/thingmodel/modules/dataSpecs/ThingModelStructDataSpecs.vue
index 34d52a12c6cea9b56a6a83af53af586779190a38..c48383beaf0cb027bad3bdf34b881f65111a0083 100644
--- a/apps/web-antd/src/views/iot/thingmodel/modules/dataSpecs/ThingModelStructDataSpecs.vue
+++ b/apps/web-antd/src/views/iot/thingmodel/modules/dataSpecs/ThingModelStructDataSpecs.vue
@@ -29,6 +29,7 @@ const formData = ref<any>({
     dataSpecs: {
       dataType: IoTDataSpecsDataTypeEnum.INT,
     },
+    dataSpecsList: [],
   },
 });
 
@@ -40,16 +41,22 @@ function openStructForm(val: any) {
     return;
   }
   // 编辑时回显数据
+  const valData = val as any;
   formData.value = {
-    identifier: val.identifier,
-    name: val.name,
-    description: val.description,
+    identifier: valData?.identifier || '',
+    name: valData?.name || '',
+    description: valData?.description || '',
     property: {
-      dataType: val.childDataType,
-      dataSpecs: val.dataSpecs,
-      dataSpecsList: val.dataSpecsList,
+      dataType: valData?.childDataType || IoTDataSpecsDataTypeEnum.INT,
+      dataSpecs: valData?.dataSpecs ?? {},
+      dataSpecsList: valData?.dataSpecsList ?? [],
     },
   };
+
+  // 确保 property.dataType 有值
+  if (!formData.value.property.dataType) {
+    formData.value.property.dataType = IoTDataSpecsDataTypeEnum.INT;
+  }
 }
 
 /** 删除 struct 项 */
@@ -102,19 +109,12 @@ function resetForm() {
       dataSpecs: {
         dataType: IoTDataSpecsDataTypeEnum.INT,
       },
+      dataSpecsList: [],
     },
   };
   structFormRef.value?.resetFields();
 }
 
-/** 校验 struct 不能为空 */
-function validateList(_: any, __: any, callback: any) {
-  if (isEmpty(dataSpecsList.value)) {
-    callback(new Error('struct 不能为空'));
-    return;
-  }
-  callback();
-}
 
 /** 组件初始化 */
 onMounted(async () => {
@@ -126,51 +126,49 @@ onMounted(async () => {
 
 <template>
   <!-- struct 数据展示 -->
-  <Form.Item
-    :rules="[{ required: true, validator: validateList, trigger: 'change' }]"
-    label="JSON 对象"
-  >
+  <Form.Item label="属性对象">
     <div
       v-for="(item, index) in dataSpecsList"
       :key="index"
       class="px-10px mb-10px flex w-full justify-between bg-gray-100"
     >
-      <span>参数名称：{{ item.name }}</span>
+      <span>参数：{{ item.name }}</span>
       <div class="btn">
-        <Button link type="primary" @click="openStructForm(item)">
+        <Button type="link" @click="openStructForm(item)">
           编辑
         </Button>
-        <Divider direction="vertical" />
-        <Button link danger @click="deleteStructItem(index)"> 删除 </Button>
+        <Divider type="vertical" />
+        <Button type="link" danger @click="deleteStructItem(index)">
+          删除
+        </Button>
       </div>
     </div>
-    <Button link type="primary" @click="openStructForm(null)">
+    <Button type="link" @click="openStructForm(null)">
       +新增参数
     </Button>
   </Form.Item>
 
   <!-- struct 表单 -->
-  <Modal v-model="dialogVisible" :title="dialogTitle" append-to-body>
+  <Modal
+    v-model:open="dialogVisible"
+    :title="dialogTitle"
+    :confirm-loading="formLoading"
+    @ok="submitForm"
+  >
     <Form
       ref="structFormRef"
-      v-loading="formLoading"
       :model="formData"
-      label-width="100px"
+      :label-col="{ span: 6 }"
+      :wrapper-col="{ span: 18 }"
     >
-      <Form.Item label="参数名称" prop="name">
-        <Input v-model="formData.name" placeholder="请输入功能名称" />
+      <Form.Item label="参数名称" name="name">
+        <Input v-model:value="formData.name" placeholder="请输入功能名称" />
       </Form.Item>
-      <Form.Item label="标识符" prop="identifier">
-        <Input v-model="formData.identifier" placeholder="请输入标识符" />
+      <Form.Item label="标识符" name="identifier">
+        <Input v-model:value="formData.identifier" placeholder="请输入标识符" />
       </Form.Item>
       <!-- 属性配置 -->
       <ThingModelProperty v-model="formData.property" is-struct-data-specs />
     </Form>
-    <template #footer>
-      <Button :disabled="formLoading" type="primary" @click="submitForm">
-        确 定
-      </Button>
-      <Button @click="dialogVisible = false">取 消</Button>
-    </template>
   </Modal>
 </template>