完善表单表头
This commit is contained in:
parent
12d28955bf
commit
31c6a15aae
@ -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[]>([]);
|
||||
|
||||
@ -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,10 +161,14 @@ 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;
|
||||
@ -161,7 +179,7 @@ const gridOptions: VxeGridProps<any> = {
|
||||
console.log('设备类型为集中器,使用focusId:', {
|
||||
originalDeviceId: formValues.DeviceId,
|
||||
focusId: deviceInfo.focusId,
|
||||
deviceInfo: deviceInfo,
|
||||
deviceInfo,
|
||||
});
|
||||
}
|
||||
}
|
||||
@ -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: {
|
||||
@ -267,7 +288,12 @@ const gridOptions: VxeGridProps<any> = {
|
||||
};
|
||||
|
||||
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,
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user