动态列处理

apps/web-antd/src/views/dataManger/deviceData/dynamicColumns.ts

@@ -9,7 +9,6 @@ export const fieldNameMapping: FieldMapping = {
   DeviceType: '设备类型',
   DeviceId: '设备ID',
   Timestamps: '时间戳',
-  APPData: '应用数据',
   // 可以根据需要添加更多映射
 };
 

apps/web-antd/src/views/dataManger/deviceData/example.ts

@@ -64,18 +64,6 @@ export const validateAndCleanData = (data: any[]): DynamicDeviceData[] => {
         case 'DeviceId':
           cleaned[key] = value ? String(value) : '';
           break;
-        case 'APPData':
-          // 尝试解析JSON数据
-          try {
-            if (typeof value === 'string') {
-              cleaned[key] = JSON.parse(value);
-            } else {
-              cleaned[key] = value;
-            }
-          } catch {
-            cleaned[key] = value;
-          }
-          break;
         default:
           // 对于未知字段，保持原值
           cleaned[key] = value;

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

@@ -31,10 +31,28 @@ const fixedColumns = computed(() => [
 ]);
 
 // 合并固定列和动态列
-const allColumns = computed(() => [
+const allColumns = computed(() => {
-  ...fixedColumns.value,
+  const columns = [
-  ...dynamicColumns.value,
+    ...fixedColumns.value,
-]);
+    ...dynamicColumns.value,
+  ];
+  console.log('当前所有列定义:', columns);
+  return columns;
+});
+
+// 初始化默认列（防止表格空白）
+const initDefaultColumns = () => {
+  if (dynamicColumns.value.length === 0) {
+    dynamicColumns.value = [
+      { field: 'SystemName', title: '系统名称', minWidth: '150' },
+      { field: 'DeviceType', title: '设备类型', minWidth: '150' },
+      { field: 'DeviceId', title: '设备ID', minWidth: '150' },
+    ];
+  }
+};
+
+// 初始化默认列
+initDefaultColumns();
 
 const formOptions: VbenFormProps = {
   schema: querySchema.value,
@@ -67,7 +85,10 @@ const gridOptions: VxeGridProps<any> = {
   columns: allColumns,
   height: 'auto',
   keepSource: true,
-  pagerConfig: {},
+  pagerConfig: {
+    currentPage: 1,
+    pageSize: 20,
+  },
   toolbarConfig: {
     custom: true,
     search: true, 
@@ -89,21 +110,30 @@ const gridOptions: VxeGridProps<any> = {
           },
         });
         
-        // 处理数据并动态生成列定义
+        console.log('API返回的原始数据:', data);
+        
+        // 简化处理逻辑，先确保基本功能正常
         if (data?.items && data.items.length > 0) {
-          // 验证和清理数据
+          console.log('原始items数据:', data.items);
-          const cleanedData = validateAndCleanData(data.items);
+          
+          // 直接使用原始数据，不进行复杂处理
+          const items = data.items;
           
           // 动态生成列定义
-          dynamicColumns.value = generateDynamicColumns(cleanedData);
+          const generatedColumns = generateDynamicColumns(items);
+          console.log('生成的列定义:', generatedColumns);
           
-          // 返回处理后的数据
+          // 更新动态列
-          return {
+          dynamicColumns.value = generatedColumns;
-            ...data,
+          
-            items: cleanedData,
+          // 强制更新列定义
-          };
+          await nextTick();
+          
+          console.log('返回给表格的数据:', data);
+          return data;
         }
         
+        console.log('没有数据或数据为空');
         return data;
       },
     },

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

@@ -0,0 +1,108 @@
+<script setup lang="ts">
+import type { VbenFormProps } from '#/adapter/form';
+import type { VxeGridProps } from '#/adapter/vxe-table';
+
+import { useRoute } from 'vue-router';
+
+import { Page } from '@vben/common-ui';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { postTreeModelDeviceDataInfoPage } from '#/api-client';
+
+import { querySchema } from './schema';
+
+defineOptions({
+  name: 'DeviceDataTest',
+});
+
+const route = useRoute();
+const { DeviceType, DeviceId, FocusAddress } = route.query;
+
+const formOptions: VbenFormProps = {
+  schema: querySchema.value,
+  initialValues: {
+    FocusAddress: FocusAddress as string,
+  },
+};
+
+// 使用固定的列定义进行测试
+const testColumns = [
+  { title: '序号', type: 'seq', width: 50 },
+  { field: 'SystemName', title: '系统名称', minWidth: '150' },
+  { field: 'ProjectId', title: '项目ID', minWidth: '150' },
+  { field: 'ProjectName', title: '项目名称', minWidth: '150' },
+  { field: 'IoTDataType', title: 'IoT数据类型', minWidth: '150' },
+  { field: 'DeviceType', title: '设备类型', minWidth: '150' },
+  { field: 'DeviceId', title: '设备ID', minWidth: '150' },
+  { field: 'Timestamps', title: '时间戳', minWidth: '150' },
+  // 添加一个通用字段来显示其他数据
+  { field: 'extraData', title: '其他数据', minWidth: '200', formatter: (value: any, row: any) => {
+    // 显示所有不在固定列中的字段
+    const fixedFields = ['SystemName', 'ProjectId', 'ProjectName', 'IoTDataType', 'DeviceType', 'DeviceId', 'Timestamps'];
+    const extraFields = Object.keys(row).filter(key => !fixedFields.includes(key));
+    if (extraFields.length > 0) {
+      return extraFields.map(field => `${field}: ${row[field]}`).join(', ');
+    }
+    return '';
+  }},
+];
+
+const gridOptions: VxeGridProps<any> = {
+  checkboxConfig: {
+    highlight: true,
+    labelField: 'name',
+  },
+  columns: testColumns,
+  height: 'auto',
+  keepSource: true,
+  pagerConfig: {
+    currentPage: 1,
+    pageSize: 20,
+  },
+  toolbarConfig: {
+    custom: true,
+    search: true, 
+  },
+  customConfig: {
+    storage: true,
+  },
+  proxyConfig: {
+    ajax: {
+      query: async ({ page }, formValues) => {
+        const { data } = await postTreeModelDeviceDataInfoPage({
+          body: {
+            ...formValues,
+            pageIndex: page.currentPage,
+            pageSize: page.pageSize,
+            DeviceType,
+            DeviceId,
+            FocusAddress,
+          },
+        });
+        
+        console.log('测试 - API返回的原始数据:', data);
+        
+        if (data?.items && data.items.length > 0) {
+          console.log('测试 - 第一条数据的所有字段:', Object.keys(data.items[0]));
+          console.log('测试 - 第一条数据:', data.items[0]);
+        }
+        
+        return data;
+      },
+    },
+  },
+};
+
+const [Grid] = useVbenVxeGrid({ formOptions, gridOptions });
+</script>
+
+<template>
+  <Page auto-content-height>
+    <div class="mb-4 p-4 bg-yellow-100 border border-yellow-400 rounded">
+      <h3 class="text-lg font-bold mb-2">测试模式</h3>
+      <p>这个页面使用固定列定义来测试数据是否能正常显示。</p>
+      <p>请查看控制台输出来了解数据结构。</p>
+    </div>
+    <Grid />
+  </Page>
+</template> 

apps/web-antd/src/views/dataManger/deviceData/types.ts

@@ -7,7 +7,6 @@ export interface BaseDeviceData {
   DeviceType?: string;
   DeviceId?: string;
   Timestamps?: string;
-  APPData?: string;
   [key: string]: any; // 允许任意额外字段
 }