移除无用的内容
This commit is contained in:
ChenYi
parent
1d90754602
commit
fb44ace832
@ -1,111 +0,0 @@
|
||||
<script setup lang="ts">
|
||||
import type { VbenFormProps } from '#/adapter/form';
|
||||
import type { VxeGridProps } from '#/adapter/vxe-table';
|
||||
|
||||
import { useRoute } from 'vue-router';
|
||||
import { ref } from 'vue';
|
||||
|
||||
import { Page } from '@vben/common-ui';
|
||||
|
||||
import { useVbenVxeGrid } from '#/adapter/vxe-table';
|
||||
import { postTreeModelDeviceDataInfoPage } from '#/api-client';
|
||||
|
||||
import { querySchema } from './schema';
|
||||
|
||||
defineOptions({
|
||||
name: 'DeviceDataBasicTest',
|
||||
});
|
||||
|
||||
const route = useRoute();
|
||||
const { DeviceType, DeviceId, FocusAddress } = route.query;
|
||||
|
||||
// 简单的表单配置
|
||||
const formOptions: VbenFormProps = {
|
||||
schema: querySchema.value,
|
||||
initialValues: {
|
||||
FocusAddress: FocusAddress as string,
|
||||
},
|
||||
};
|
||||
|
||||
// 最基本的列定义
|
||||
const basicColumns = [
|
||||
{ type: 'seq', width: 50, title: '序号' },
|
||||
{ field: 'SystemName', title: '系统名称', width: 150 },
|
||||
{ field: 'DeviceType', title: '设备类型', width: 150 },
|
||||
{ field: 'DeviceId', title: '设备ID', width: 150 },
|
||||
{ field: 'Timestamps', title: '时间戳', width: 200 },
|
||||
];
|
||||
|
||||
// 调试信息
|
||||
const debugInfo = ref('');
|
||||
|
||||
const gridOptions: VxeGridProps<any> = {
|
||||
columns: basicColumns,
|
||||
height: 'auto',
|
||||
pagerConfig: {
|
||||
currentPage: 1,
|
||||
pageSize: 20,
|
||||
},
|
||||
proxyConfig: {
|
||||
ajax: {
|
||||
query: async ({ page }, formValues) => {
|
||||
debugInfo.value = '开始API调用...';
|
||||
console.log('基本测试 - 开始API调用');
|
||||
|
||||
try {
|
||||
const response = await postTreeModelDeviceDataInfoPage({
|
||||
body: {
|
||||
...formValues,
|
||||
pageIndex: page.currentPage,
|
||||
pageSize: page.pageSize,
|
||||
DeviceType,
|
||||
DeviceId,
|
||||
FocusAddress,
|
||||
},
|
||||
});
|
||||
|
||||
console.log('基本测试 - 完整响应:', response);
|
||||
console.log('基本测试 - response.data:', response.data);
|
||||
|
||||
debugInfo.value = `API调用成功，数据: ${JSON.stringify(response.data, null, 2)}`;
|
||||
|
||||
if (response.data?.items) {
|
||||
console.log('基本测试 - items长度:', response.data.items.length);
|
||||
if (response.data.items.length > 0) {
|
||||
console.log('基本测试 - 第一条数据:', response.data.items[0]);
|
||||
}
|
||||
}
|
||||
|
||||
// 确保返回的数据包含totalCount字段
|
||||
const result = {
|
||||
items: response.data.items || [],
|
||||
totalCount: response.data.totalCount || (response.data.items ? response.data.items.length : 0),
|
||||
};
|
||||
|
||||
return result;
|
||||
} catch (error) {
|
||||
console.error('基本测试 - API调用失败:', error);
|
||||
debugInfo.value = `API调用失败: ${error}`;
|
||||
throw error;
|
||||
}
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const [Grid] = useVbenVxeGrid({ formOptions, gridOptions });
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Page auto-content-height>
|
||||
<div class="mb-4 p-4 bg-green-100 border border-green-400 rounded">
|
||||
<h3 class="text-lg font-bold mb-2">基本测试模式</h3>
|
||||
<p>这个页面使用最基本的列定义来测试数据是否能正常显示。</p>
|
||||
<div class="mt-2">
|
||||
<strong>调试信息:</strong>
|
||||
<pre class="mt-1 text-sm bg-gray-100 p-2 rounded">{{ debugInfo }}</pre>
|
||||
</div>
|
||||
</div>
|
||||
<Grid />
|
||||
</Page>
|
||||
</template>
|
||||
@ -1,122 +0,0 @@
|
||||
import type { DynamicDeviceData, DynamicPageResponse } from './types';
|
||||
|
||||
// 示例1：处理标准IoTDB数据
|
||||
export const handleStandardIoTDBData = (response: any): DynamicPageResponse<DynamicDeviceData> => {
|
||||
// 确保响应格式正确
|
||||
if (!response || !response.items) {
|
||||
return { items: [], totalCount: 0 };
|
||||
}
|
||||
|
||||
// 转换数据，确保所有字段都被包含
|
||||
const items = response.items.map((item: any) => ({
|
||||
SystemName: item.SystemName || '',
|
||||
ProjectId: item.ProjectId || '',
|
||||
ProjectName: item.ProjectName || '',
|
||||
IoTDataType: item.IoTDataType || '',
|
||||
DeviceType: item.DeviceType || '',
|
||||
DeviceId: item.DeviceId || '',
|
||||
Timestamps: item.Timestamps || '',
|
||||
APPData: item.APPData || '',
|
||||
// 包含所有其他字段
|
||||
...item,
|
||||
}));
|
||||
|
||||
return {
|
||||
items,
|
||||
totalCount: response.totalCount || items.length,
|
||||
};
|
||||
};
|
||||
|
||||
// 示例2：处理自定义字段数据
|
||||
export const handleCustomFieldData = (response: any): DynamicPageResponse<DynamicDeviceData> => {
|
||||
if (!response || !response.items) {
|
||||
return { items: [], totalCount: 0 };
|
||||
}
|
||||
|
||||
// 直接使用原始数据，允许任意字段
|
||||
return {
|
||||
items: response.items,
|
||||
totalCount: response.totalCount || response.items.length,
|
||||
};
|
||||
};
|
||||
|
||||
// 示例3：数据验证和清理
|
||||
export const validateAndCleanData = (data: any[]): DynamicDeviceData[] => {
|
||||
return data.map(item => {
|
||||
const cleaned: DynamicDeviceData = {};
|
||||
|
||||
// 遍历所有字段，进行类型转换和清理
|
||||
Object.keys(item).forEach(key => {
|
||||
const value = item[key];
|
||||
|
||||
// 根据字段名进行特殊处理
|
||||
switch (key) {
|
||||
case 'Timestamps':
|
||||
cleaned[key] = value ? String(value) : '';
|
||||
break;
|
||||
case 'SystemName':
|
||||
case 'ProjectName':
|
||||
case 'DeviceType':
|
||||
case 'IoTDataType':
|
||||
cleaned[key] = value ? String(value) : '';
|
||||
break;
|
||||
case 'ProjectId':
|
||||
case 'DeviceId':
|
||||
cleaned[key] = value ? String(value) : '';
|
||||
break;
|
||||
default:
|
||||
// 对于未知字段，保持原值
|
||||
cleaned[key] = value;
|
||||
}
|
||||
});
|
||||
|
||||
return cleaned;
|
||||
});
|
||||
};
|
||||
|
||||
// 示例4：动态字段检测
|
||||
export const detectDynamicFields = (data: DynamicDeviceData[]): string[] => {
|
||||
if (!data || data.length === 0) return [];
|
||||
|
||||
const allFields = new Set<string>();
|
||||
|
||||
data.forEach(item => {
|
||||
Object.keys(item).forEach(key => {
|
||||
allFields.add(key);
|
||||
});
|
||||
});
|
||||
|
||||
return Array.from(allFields);
|
||||
};
|
||||
|
||||
// 示例5：字段重要性排序
|
||||
export const sortFieldsByImportance = (fields: string[]): string[] => {
|
||||
const importanceOrder = [
|
||||
'Timestamps',
|
||||
'SystemName',
|
||||
'ProjectName',
|
||||
'DeviceType',
|
||||
'DeviceId',
|
||||
'IoTDataType',
|
||||
'APPData',
|
||||
];
|
||||
|
||||
return fields.sort((a, b) => {
|
||||
const aIndex = importanceOrder.indexOf(a);
|
||||
const bIndex = importanceOrder.indexOf(b);
|
||||
|
||||
// 如果都在预定义列表中，按列表顺序排序
|
||||
if (aIndex !== -1 && bIndex !== -1) {
|
||||
return aIndex - bIndex;
|
||||
}
|
||||
|
||||
// 如果只有a在预定义列表中，a排在前面
|
||||
if (aIndex !== -1) return -1;
|
||||
|
||||
// 如果只有b在预定义列表中，b排在前面
|
||||
if (bIndex !== -1) return 1;
|
||||
|
||||
// 都不在预定义列表中，按字母顺序排序
|
||||
return a.localeCompare(b);
|
||||
});
|
||||
};
|
||||
@ -12,7 +12,6 @@ import { postTreeModelDeviceDataInfoPage } from '#/api-client';
|
||||
|
||||
import { querySchema, tableSchema } from './schema';
|
||||
import { generateDynamicColumns } from './dynamicColumns';
|
||||
import { handleStandardIoTDBData, validateAndCleanData } from './example';
|
||||
|
||||
defineOptions({
|
||||
name: 'DeviceData',
|
||||
|
||||
@ -1,110 +0,0 @@
|
||||
<script setup lang="ts">
|
||||
import type { VbenFormProps } from '#/adapter/form';
|
||||
import type { VxeGridProps } from '#/adapter/vxe-table';
|
||||
|
||||
import { useRoute } from 'vue-router';
|
||||
import { ref } from 'vue';
|
||||
|
||||
import { Page } from '@vben/common-ui';
|
||||
|
||||
import { useVbenVxeGrid } from '#/adapter/vxe-table';
|
||||
import { postTreeModelDeviceDataInfoPage } from '#/api-client';
|
||||
|
||||
import { querySchema } from './schema';
|
||||
|
||||
defineOptions({
|
||||
name: 'DeviceDataSimpleTest',
|
||||
});
|
||||
|
||||
const route = useRoute();
|
||||
const { DeviceType, DeviceId, FocusAddress } = route.query;
|
||||
|
||||
// 简单的表单配置
|
||||
const formOptions: VbenFormProps = {
|
||||
schema: querySchema.value,
|
||||
initialValues: {
|
||||
FocusAddress: FocusAddress as string,
|
||||
},
|
||||
};
|
||||
|
||||
// 最简单的列定义
|
||||
const simpleColumns = [
|
||||
{ title: '序号', type: 'seq', width: 50 },
|
||||
{ field: 'SystemName', title: '系统名称', width: 150 },
|
||||
{ field: 'DeviceType', title: '设备类型', width: 150 },
|
||||
{ field: 'DeviceId', title: '设备ID', width: 150 },
|
||||
{ field: 'Timestamps', title: '时间戳', width: 200 },
|
||||
];
|
||||
|
||||
// 调试信息
|
||||
const debugInfo = ref('');
|
||||
|
||||
const gridOptions: VxeGridProps<any> = {
|
||||
columns: simpleColumns,
|
||||
height: 'auto',
|
||||
pagerConfig: {
|
||||
currentPage: 1,
|
||||
pageSize: 20,
|
||||
},
|
||||
proxyConfig: {
|
||||
ajax: {
|
||||
query: async ({ page }, formValues) => {
|
||||
debugInfo.value = '开始API调用...';
|
||||
console.log('简单测试 - 开始API调用');
|
||||
|
||||
try {
|
||||
const response = await postTreeModelDeviceDataInfoPage({
|
||||
body: {
|
||||
...formValues,
|
||||
pageIndex: page.currentPage,
|
||||
pageSize: page.pageSize,
|
||||
DeviceType,
|
||||
DeviceId,
|
||||
FocusAddress,
|
||||
},
|
||||
});
|
||||
|
||||
console.log('简单测试 - 完整响应:', response);
|
||||
console.log('简单测试 - response.data:', response.data);
|
||||
|
||||
debugInfo.value = `API调用成功，数据: ${JSON.stringify(response.data, null, 2)}`;
|
||||
|
||||
if (response.data?.items) {
|
||||
console.log('简单测试 - items长度:', response.data.items.length);
|
||||
if (response.data.items.length > 0) {
|
||||
console.log('简单测试 - 第一条数据:', response.data.items[0]);
|
||||
}
|
||||
}
|
||||
|
||||
// 确保返回的数据包含totalCount字段
|
||||
const result = {
|
||||
items: response.data.items || [],
|
||||
totalCount: response.data.totalCount || (response.data.items ? response.data.items.length : 0),
|
||||
};
|
||||
return result;
|
||||
} catch (error) {
|
||||
console.error('简单测试 - API调用失败:', error);
|
||||
debugInfo.value = `API调用失败: ${error}`;
|
||||
throw error;
|
||||
}
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const [Grid] = useVbenVxeGrid({ formOptions, gridOptions });
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Page auto-content-height>
|
||||
<div class="mb-4 p-4 bg-blue-100 border border-blue-400 rounded">
|
||||
<h3 class="text-lg font-bold mb-2">简单测试模式</h3>
|
||||
<p>这个页面使用最简单的配置来测试数据是否能正常显示。</p>
|
||||
<div class="mt-2">
|
||||
<strong>调试信息:</strong>
|
||||
<pre class="mt-1 text-sm bg-gray-100 p-2 rounded">{{ debugInfo }}</pre>
|
||||
</div>
|
||||
</div>
|
||||
<Grid />
|
||||
</Page>
|
||||
</template>
|
||||
@ -1,113 +0,0 @@
|
||||
<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]);
|
||||
}
|
||||
|
||||
// 确保返回的数据包含totalCount字段
|
||||
const result = {
|
||||
items: data.items || [],
|
||||
totalCount: data.totalCount || (data.items ? data.items.length : 0),
|
||||
};
|
||||
return result;
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
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>
|
||||
Loading…
x
Reference in New Issue
Block a user