完善表单表头

apps/web-antd/src/views/dataManger/deviceData/index.vue

@@ -8,11 +8,16 @@ import { useRoute } from 'vue-router';
 import { Page } from '@vben/common-ui';
 
 import { useVbenVxeGrid } from '#/adapter/vxe-table';
-import { postTreeModelDeviceDataInfoPage, postMetersPage } from '#/api-client';
+import { postMetersPage, postTreeModelDeviceDataInfoPage } from '#/api-client';
+import { $t } from '#/locales';
 
 import { generateDynamicColumns } from './dynamicColumns';
 import { querySchema } from './schema';
 
+defineOptions({
+  name: 'DeviceData',
+});
+
 // 存储设备信息选项的完整数据
 const deviceOptions = ref<any[]>([]);
 
@@ -25,7 +30,7 @@ const fetchDeviceOptions = async () => {
         pageSize: 1000,
       },
     });
-    
+
     if (data?.items) {
       deviceOptions.value = data.items;
       console.log('设备信息选项:', deviceOptions.value);
@@ -37,30 +42,28 @@ const fetchDeviceOptions = async () => {
 
 // 根据设备ID获取设备信息对象
 const getDeviceInfoById = (deviceId: string) => {
-  return deviceOptions.value.find(device => device.id === deviceId);
+  return deviceOptions.value.find((device) => device.id === deviceId);
 };
 
-defineOptions({
-  name: 'DeviceData',
-});
-
 const route = useRoute();
 const { DeviceType, DeviceId, FocusAddress } = route.query;
 
 // 动态列定义
 const dynamicColumns = ref<any[]>([]);
 
-
-
 // 固定列定义（始终显示）- 基于 IoTDBTreeModelDeviceDataDto 类型
 const fixedColumns = [
   { title: '序号', type: 'seq', width: 50 },
-  { field: 'Timestamps', title: '时间戳', minWidth: 150 },
-  { field: 'SystemName', title: '系统名称', minWidth: 150 },
-  { field: 'ProjectId', title: '项目ID', minWidth: 150 },
-  { field: 'DeviceType', title: '设备类型', minWidth: 150 },
-  { field: 'IoTDataType', title: 'IoT数据类型', minWidth: 150 },
-  { field: 'DeviceId', title: '设备ID', minWidth: 150 },
+  { field: 'Timestamps', title: $t('abp.IoTDBBase.Timestamps'), minWidth: 150 },
+  { field: 'SystemName', title: $t('abp.IoTDBBase.SystemName'), minWidth: 150 },
+  { field: 'ProjectId', title: $t('abp.IoTDBBase.ProjectId'), minWidth: 150 },
+  { field: 'DeviceType', title: $t('abp.IoTDBBase.DeviceType'), minWidth: 150 },
+  {
+    field: 'IoTDataType',
+    title: $t('abp.IoTDBBase.IoTDataType'),
+    minWidth: 150,
+  },
+  { field: 'DeviceId', title: $t('abp.IoTDBBase.DeviceId'), minWidth: 150 },
 ];
 
 // 合并固定列和动态列 - 使用计算属性确保响应式
@@ -92,12 +95,23 @@ const formOptions: VbenFormProps = {
   // 添加表单值变化的处理函数
   handleValuesChange: async (values, changedFields) => {
     // 当任何相关字段发生变化时，刷新表格数据
-    const relevantFields = ['SystemName', 'DeviceType', 'IoTDataType', 'DeviceId', 'FocusAddress'];
-    const hasRelevantChange = changedFields.some(field => relevantFields.includes(field));
-    
+    const relevantFields = new Set([
+      'DeviceId',
+      'DeviceType',
+      'FocusAddress',
+      'IoTDataType',
+      'SystemName',
+    ]);
+    const hasRelevantChange = changedFields.some((field) =>
+      relevantFields.has(field),
+    );
+
     if (hasRelevantChange) {
       console.log('表单字段变化:', { values, changedFields });
-      console.log('相关字段变化:', changedFields.filter(field => relevantFields.includes(field)));
+      console.log(
+        '相关字段变化:',
+        changedFields.filter((field) => relevantFields.has(field)),
+      );
 
       // 使用 setTimeout 确保表单值已经完全更新
       setTimeout(async () => {
@@ -147,11 +161,15 @@ const gridOptions: VxeGridProps<any> = {
         console.log('=== API调用开始 ===');
         // 处理DeviceType和IoTDataType，确保传递数字类型
         const deviceTypeValue = formValues.DeviceType || DeviceType;
-        const deviceTypeNumber = deviceTypeValue ? Number(deviceTypeValue) : undefined;
-        
+        const deviceTypeNumber = deviceTypeValue
+          ? Number(deviceTypeValue)
+          : undefined;
+
         const ioTDataTypeValue = formValues.IoTDataType;
-        const ioTDataTypeNumber = ioTDataTypeValue ? Number(ioTDataTypeValue) : undefined;
-        
+        const ioTDataTypeNumber = ioTDataTypeValue
+          ? Number(ioTDataTypeValue)
+          : undefined;
+
         // 处理DeviceId，当设备类型为集中器(10)时，使用focusId
         let finalDeviceId = formValues.DeviceId || DeviceId;
         if (deviceTypeNumber === 10 && formValues.DeviceId) {
@@ -161,11 +179,11 @@ const gridOptions: VxeGridProps<any> = {
             console.log('设备类型为集中器，使用focusId:', {
               originalDeviceId: formValues.DeviceId,
               focusId: deviceInfo.focusId,
-              deviceInfo: deviceInfo,
+              deviceInfo,
             });
           }
         }
-        
+
         console.log('请求参数:', {
           page,
           formValues,
@@ -184,7 +202,10 @@ const gridOptions: VxeGridProps<any> = {
             deviceId: {
               originalValue: formValues.DeviceId || DeviceId,
               finalValue: finalDeviceId,
-              isFocusId: deviceTypeNumber === 10 && formValues.DeviceId && getDeviceInfoById(formValues.DeviceId)?.focusId,
+              isFocusId:
+                deviceTypeNumber === 10 &&
+                formValues.DeviceId &&
+                getDeviceInfoById(formValues.DeviceId)?.focusId,
             },
           },
           finalParams: {
@@ -265,14 +286,19 @@ const gridOptions: VxeGridProps<any> = {
               items: data.items || [],
               totalCount: data.totalCount || 0,
             };
-            
+
             console.log('返回给表格的数据:', result);
-            console.log('总数:', result.totalCount, '当前页数据量:', result.items.length);
+            console.log(
+              '总数:',
+              result.totalCount,
+              '当前页数据量:',
+              result.items.length,
+            );
             console.log('分页信息:', {
               currentPage: page.currentPage,
               pageSize: page.pageSize,
             });
-            
+
             return result;
           }