移除无用的内容
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 { querySchema, tableSchema } from './schema';
|
||||||
import { generateDynamicColumns } from './dynamicColumns';
|
import { generateDynamicColumns } from './dynamicColumns';
|
||||||
import { handleStandardIoTDBData, validateAndCleanData } from './example';
|
|
||||||
|
|
||||||
defineOptions({
|
defineOptions({
|
||||||
name: 'DeviceData',
|
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