优化查询
This commit is contained in:
parent
460121fdab
commit
12d28955bf
@ -8,11 +8,38 @@ import { useRoute } from 'vue-router';
|
||||
import { Page } from '@vben/common-ui';
|
||||
|
||||
import { useVbenVxeGrid } from '#/adapter/vxe-table';
|
||||
import { postTreeModelDeviceDataInfoPage } from '#/api-client';
|
||||
import { postTreeModelDeviceDataInfoPage, postMetersPage } from '#/api-client';
|
||||
|
||||
import { generateDynamicColumns } from './dynamicColumns';
|
||||
import { querySchema } from './schema';
|
||||
|
||||
// 存储设备信息选项的完整数据
|
||||
const deviceOptions = ref<any[]>([]);
|
||||
|
||||
// 获取设备信息的完整数据
|
||||
const fetchDeviceOptions = async () => {
|
||||
try {
|
||||
const { data } = await postMetersPage({
|
||||
body: {
|
||||
pageIndex: 1,
|
||||
pageSize: 1000,
|
||||
},
|
||||
});
|
||||
|
||||
if (data?.items) {
|
||||
deviceOptions.value = data.items;
|
||||
console.log('设备信息选项:', deviceOptions.value);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('获取设备信息失败:', error);
|
||||
}
|
||||
};
|
||||
|
||||
// 根据设备ID获取设备信息对象
|
||||
const getDeviceInfoById = (deviceId: string) => {
|
||||
return deviceOptions.value.find(device => device.id === deviceId);
|
||||
};
|
||||
|
||||
defineOptions({
|
||||
name: 'DeviceData',
|
||||
});
|
||||
@ -50,24 +77,32 @@ const initDefaultColumns = () => {
|
||||
// 初始化默认列
|
||||
initDefaultColumns();
|
||||
|
||||
// 获取设备信息数据
|
||||
fetchDeviceOptions();
|
||||
|
||||
const formOptions: VbenFormProps = {
|
||||
schema: querySchema.value,
|
||||
initialValues: {
|
||||
FocusAddress: FocusAddress as string,
|
||||
DeviceType: DeviceType ? Number(DeviceType) : undefined,
|
||||
DeviceId: DeviceId as string,
|
||||
},
|
||||
// 禁用表单值变化时自动提交,使用自定义处理函数
|
||||
submitOnChange: false,
|
||||
// 添加表单值变化的处理函数
|
||||
handleValuesChange: async (values, changedFields) => {
|
||||
// 当系统类型发生变化时,刷新表格数据
|
||||
if (changedFields.includes('SystemName')) {
|
||||
console.log('SystemName changed, values:', values);
|
||||
console.log('Changed fields:', changedFields);
|
||||
// 当任何相关字段发生变化时,刷新表格数据
|
||||
const relevantFields = ['SystemName', 'DeviceType', 'IoTDataType', 'DeviceId', 'FocusAddress'];
|
||||
const hasRelevantChange = changedFields.some(field => relevantFields.includes(field));
|
||||
|
||||
if (hasRelevantChange) {
|
||||
console.log('表单字段变化:', { values, changedFields });
|
||||
console.log('相关字段变化:', changedFields.filter(field => relevantFields.includes(field)));
|
||||
|
||||
// 使用 setTimeout 确保表单值已经完全更新
|
||||
setTimeout(async () => {
|
||||
const latestValues = await gridApi.formApi.getValues();
|
||||
console.log('Latest values after timeout:', latestValues);
|
||||
console.log('最新表单值:', latestValues);
|
||||
gridApi.reload(latestValues);
|
||||
}, 0);
|
||||
}
|
||||
@ -110,12 +145,58 @@ const gridOptions: VxeGridProps<any> = {
|
||||
ajax: {
|
||||
query: async ({ page }, formValues) => {
|
||||
console.log('=== API调用开始 ===');
|
||||
// 处理DeviceType和IoTDataType,确保传递数字类型
|
||||
const deviceTypeValue = formValues.DeviceType || DeviceType;
|
||||
const deviceTypeNumber = deviceTypeValue ? Number(deviceTypeValue) : undefined;
|
||||
|
||||
const ioTDataTypeValue = formValues.IoTDataType;
|
||||
const ioTDataTypeNumber = ioTDataTypeValue ? Number(ioTDataTypeValue) : undefined;
|
||||
|
||||
// 处理DeviceId,当设备类型为集中器(10)时,使用focusId
|
||||
let finalDeviceId = formValues.DeviceId || DeviceId;
|
||||
if (deviceTypeNumber === 10 && formValues.DeviceId) {
|
||||
const deviceInfo = getDeviceInfoById(formValues.DeviceId);
|
||||
if (deviceInfo && deviceInfo.focusId) {
|
||||
finalDeviceId = deviceInfo.focusId;
|
||||
console.log('设备类型为集中器,使用focusId:', {
|
||||
originalDeviceId: formValues.DeviceId,
|
||||
focusId: deviceInfo.focusId,
|
||||
deviceInfo: deviceInfo,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
console.log('请求参数:', {
|
||||
page,
|
||||
formValues,
|
||||
DeviceType,
|
||||
DeviceId,
|
||||
FocusAddress,
|
||||
routeParams: { DeviceType, DeviceId, FocusAddress },
|
||||
typeConversions: {
|
||||
deviceType: {
|
||||
originalValue: deviceTypeValue,
|
||||
convertedValue: deviceTypeNumber,
|
||||
type: typeof deviceTypeNumber,
|
||||
},
|
||||
ioTDataType: {
|
||||
originalValue: ioTDataTypeValue,
|
||||
convertedValue: ioTDataTypeNumber,
|
||||
type: typeof ioTDataTypeNumber,
|
||||
},
|
||||
deviceId: {
|
||||
originalValue: formValues.DeviceId || DeviceId,
|
||||
finalValue: finalDeviceId,
|
||||
isFocusId: deviceTypeNumber === 10 && formValues.DeviceId && getDeviceInfoById(formValues.DeviceId)?.focusId,
|
||||
},
|
||||
},
|
||||
finalParams: {
|
||||
...formValues,
|
||||
pageIndex: page.currentPage,
|
||||
pageSize: page.pageSize,
|
||||
DeviceType: deviceTypeNumber,
|
||||
DeviceId: finalDeviceId,
|
||||
FocusAddress: formValues.FocusAddress || FocusAddress,
|
||||
SystemName: formValues.SystemName,
|
||||
IoTDataType: ioTDataTypeNumber,
|
||||
},
|
||||
});
|
||||
|
||||
try {
|
||||
@ -124,9 +205,13 @@ const gridOptions: VxeGridProps<any> = {
|
||||
...formValues,
|
||||
pageIndex: page.currentPage,
|
||||
pageSize: page.pageSize,
|
||||
DeviceType,
|
||||
DeviceId,
|
||||
FocusAddress,
|
||||
// 优先使用表单中的值,如果没有则使用路由参数
|
||||
DeviceType: deviceTypeNumber,
|
||||
DeviceId: finalDeviceId,
|
||||
FocusAddress: formValues.FocusAddress || FocusAddress,
|
||||
// 添加其他表单参数
|
||||
SystemName: formValues.SystemName,
|
||||
IoTDataType: ioTDataTypeNumber,
|
||||
},
|
||||
});
|
||||
|
||||
|
||||
@ -2,11 +2,7 @@ import type { VxeGridProps } from '#/adapter/vxe-table';
|
||||
|
||||
import { computed } from 'vue';
|
||||
|
||||
import {
|
||||
getSelectResultList,
|
||||
postFocusesPage,
|
||||
postMetersPage,
|
||||
} from '#/api-client';
|
||||
import { getSelectResultList, postMetersPage } from '#/api-client';
|
||||
import { $t } from '#/locales';
|
||||
|
||||
export const querySchema = computed(() => [
|
||||
@ -109,49 +105,6 @@ export const querySchema = computed(() => [
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
component: 'ApiSelect',
|
||||
fieldName: 'FocusAddress',
|
||||
label: $t('abp.focus.focusAddress'),
|
||||
componentProps: {
|
||||
api: postFocusesPage,
|
||||
params: {
|
||||
body: {
|
||||
pageIndex: 1,
|
||||
pageSize: 1000, // 获取足够多的数据用于下拉选择
|
||||
},
|
||||
},
|
||||
labelField: 'name',
|
||||
valueField: 'focusAddress',
|
||||
optionsPropName: 'options',
|
||||
immediate: true,
|
||||
showSearch: true,
|
||||
allowClear: true,
|
||||
placeholder: $t('common.pleaseSelect') + $t('abp.focus.focusAddress'),
|
||||
filterOption: false, // 禁用本地过滤,使用服务端搜索
|
||||
optionFilterProp: 'label', // 根据 label 进行过滤
|
||||
afterFetch: (res: any) => {
|
||||
// 确保返回的是数组格式
|
||||
if (Array.isArray(res)) {
|
||||
return res;
|
||||
}
|
||||
// 如果是包装在 items 中的,提取出来
|
||||
if (res && Array.isArray(res.items)) {
|
||||
return res.items;
|
||||
}
|
||||
// 如果是包装在 data 中的,提取出来
|
||||
if (res && Array.isArray(res.data)) {
|
||||
return res.data;
|
||||
}
|
||||
// 如果是包装在 data.items 中的,提取出来
|
||||
if (res && res.data && Array.isArray(res.data.items)) {
|
||||
return res.data.items;
|
||||
}
|
||||
// 如果都不是,返回空数组
|
||||
return [];
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
component: 'ApiSelect',
|
||||
fieldName: 'DeviceId',
|
||||
@ -164,8 +117,8 @@ export const querySchema = computed(() => [
|
||||
pageSize: 1000, // 获取足够多的数据用于下拉选择
|
||||
},
|
||||
},
|
||||
labelField: 'name',
|
||||
valueField: 'focusAddress',
|
||||
labelField: 'meterName',
|
||||
valueField: 'id', // 使用id作为值,这样可以获取完整的对象
|
||||
optionsPropName: 'options',
|
||||
immediate: true,
|
||||
showSearch: true,
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user