diff --git a/apps/web-antd/src/views/dataManger/ctwingLog/index.vue b/apps/web-antd/src/views/dataManger/ctwingLog/index.vue index f0128e0..ee3da3e 100644 --- a/apps/web-antd/src/views/dataManger/ctwingLog/index.vue +++ b/apps/web-antd/src/views/dataManger/ctwingLog/index.vue @@ -2,13 +2,13 @@ import type { VbenFormProps } from '#/adapter/form'; import type { VxeGridProps } from '#/adapter/vxe-table'; -import { ref, watch } from 'vue'; +import { onMounted, ref, watch } from 'vue'; import { useRoute } from 'vue-router'; import { Page } from '@vben/common-ui'; import { useVbenVxeGrid } from '#/adapter/vxe-table'; -import { postCTWingLogInfoPage } from '#/api-client'; +import { postMetersPage, postCTWingLogInfoPage } from '#/api-client'; import DeviceSelect from '../deviceData/DeviceSelect.vue'; import { querySchema, tableSchema } from './schema'; @@ -26,6 +26,53 @@ const deviceSelectRef = ref(); // 添加选中的设备信息 const selectedDeviceInfo = ref(null); +// 存储设备信息选项的完整数据 +const deviceOptions = ref(); + +// 获取设备信息的完整数据 +const fetchDeviceOptions = async () => { + try { + const { data } = await postMetersPage({ + body: { + pageIndex: 1, + pageSize: 1000, + }, + }); + + if (data?.items) { + deviceOptions.value = data.items; + } + } catch (error) { + console.error('获取设备信息失败:', error); + } +}; + +// 根据设备ID获取设备信息对象 +const getDeviceInfoById = (deviceId: string) => { + console.log('getDeviceInfoById 调用:', { deviceId, deviceOptionsLength: deviceOptions.value?.length }); + + if (!deviceId || !deviceOptions.value || deviceOptions.value.length === 0) { + console.log('getDeviceInfoById 返回 null - 条件不满足'); + return null; + } + + // 查看前几个设备的数据结构 + console.log('前3构:', deviceOptions.value.slice(0, 3).map(device => ({ + id: device.id, + meterName: device.meterName, + meterId: device.meterId, + focusId: device.focusId, + systemName: device.systemName, + keys: Object.keys(device), + fullDevice: JSON.parse(JSON.stringify(device)) // 展开完整对象 + }))); + + const device = deviceOptions.value.find((device) => device.id === deviceId); + console.log('查找结果:', device); + + return device; +}; + // 格式化日期函数 const formatDate = (date: any) => { if (!date) return ''; @@ -33,8 +80,99 @@ const formatDate = (date: any) => { if (date.toISOString) return date.format('YYYY-MM-DD HH:mm:ss'); return ''; }; + +// 从 DeviceSelect 组件获取设备信息 +const getDeviceInfoFromRef = async () => { + if ( + deviceSelectRef.value && + typeof deviceSelectRef.value.getSelectedDevice === 'function' + ) { + const deviceInfo = deviceSelectRef.value.getSelectedDevice(); + console.log('从 ref 获取设备信息:', deviceInfo); + return deviceInfo; + } + return null; +}; + const formOptions: VbenFormProps = { schema: querySchema.value, + // 禁用表单值变化时自动提交，使用自定义处理函数 + submitOnChange: false, + // 添加表单值变化的处理函数 + handleValuesChange: async (values, changedFields) => { + console.log('handleValuesChange 被触发:', { values, changedFields }); + console.log('当前所有表单值:', values); + console.log('DeviceType:', values.DeviceType); + console.log('IoTDataType:', values.IoTDataType); + + // 当 DeviceId 发生变化时，更新 selectedDeviceInfo + if (changedFields.includes('DeviceId')) { + const deviceId = values.DeviceId; + console.log('DeviceId 变化:', deviceId); + + if (deviceId) { + // 先尝试从 deviceOptions 中查找（备用方案） + let device = deviceOptions.value.length > 0 ? deviceOptions.value.find(d => d.id === deviceId) : null; + + // 如果没找到，尝试从 DeviceSelect 组件中获取 + if (!device && gridApi?.formApi) { + try { + // 获取 DeviceSelect 组件的实例 + const deviceSelectRef = gridApi.formApi.getFieldComponentRef('DeviceId'); + if (deviceSelectRef && deviceSelectRef.getSelectedDevice) { + device = deviceSelectRef.getSelectedDevice(); + } + } catch (error) { + console.log('获取组件实例失败:', error); + } + } + + if (device) { + selectedDeviceInfo.value = device; + console.log('handleValuesChange 更新设备信息:', device); + } else { + // 如果还是没找到，尝试延迟获取（组件可能还没完全更新） + setTimeout(() => { + try { + const deviceSelectRef = gridApi.formApi.getFieldComponentRef('DeviceId'); + if (deviceSelectRef && deviceSelectRef.getSelectedDevice) { + const delayedDevice = deviceSelectRef.getSelectedDevice(); + if (delayedDevice) { + selectedDeviceInfo.value = delayedDevice; + console.log('延迟获取设备信息成功:', delayedDevice); + } + } + } catch (error) { + console.log('延迟获取组件实例失败:', error); + } + }, 100); + } + } else { + selectedDeviceInfo.value = null; + } + } + + // 当任何相关字段发生变化时，刷新表格数据 + const relevantFields = new Set([ + 'DeviceId', + 'DeviceType', + 'IoTDataType', + 'SystemName', + 'StartCreationTime', + 'EndCreationTime', + ]); + const hasRelevantChange = changedFields.some((field) => + relevantFields.has(field), + ); + + if (hasRelevantChange) { + // 使用 setTimeout 确保表单值已经完全更新 + setTimeout(async () => { + const latestValues = await gridApi.formApi.getValues(); + gridApi.reload(latestValues); + }, 0); + } + }, }; const gridOptions: VxeGridProps = { @@ -45,18 +183,11 @@ const gridOptions: VxeGridProps = { columns: tableSchema.value, height: 'auto', keepSource: true, + // 确保分页功能正常工作 + pager: true, pagerConfig: { currentPage: 1, - pageSize: 10, - pageSizes: [10, 20, 100], - layouts: [ - 'PrevPage', - 'JumpNumber', - 'NextPage', - 'FullJump', - 'Sizes', - 'Total', - ], + pageSize: 20, }, toolbarConfig: { custom: true, @@ -67,36 +198,56 @@ const gridOptions: VxeGridProps = { proxyConfig: { ajax: { query: async ({ page }, formValues) => { + // 获取当前表单值，如果formValues为空则从表单API获取 + const currentFormValues = formValues || (gridApi?.formApi ? await gridApi.formApi.getValues() : {}) || {}; + + console.log('查询时的 formValues:', formValues); + console.log('查询时的 currentFormValues:', currentFormValues); + // 获取选中的设备信息 - let deviceId = ''; + let deviceId = currentFormValues.DeviceId || ''; let systemName = ''; - const deviceType = formValues?.DeviceType || ''; - const finalFocusAddress = formValues.FocusAddress || ''; - if (deviceSelectRef.value) { - const deviceInfo = deviceSelectRef.value.getSelectedDeviceInfo(); - if (deviceInfo) { - finalFocusAddress = deviceInfo.focusAddress || ''; - systemName = deviceInfo.systemName || ''; - // 设备类型为10时取focusId，其他情况取meterId - deviceId = - Number(deviceType) === 10 - ? deviceInfo.focusId || '' - : deviceInfo.meterId || ''; + const deviceType = currentFormValues.DeviceType || ''; + + console.log('查询参数:', { deviceId, deviceType, currentFormValues }); + console.log('currentFormValues.DeviceId:', currentFormValues.DeviceId); + console.log('currentFormValues.DeviceType:', currentFormValues.DeviceType); + console.log('currentFormValues.IoTDataType:', currentFormValues.IoTDataType); + + // 优先使用选中的设备信息 + const deviceInfo = selectedDeviceInfo.value || (currentFormValues.DeviceId && deviceOptions.value.length > 0 ? getDeviceInfoById(currentFormValues.DeviceId) : null); + + if (deviceInfo) { + console.log('使用设备信息:', deviceInfo); + systemName = deviceInfo.systemName || ''; + // 根据设备类型获取正确的 id + if (Number(deviceType) === 10) { + // 集中器类型使用 focusId + deviceId = deviceInfo.focusId || deviceId; + } else { + // 其他设备类型使用 meterId + deviceId = deviceInfo.meterId || deviceId; } + } else { + console.log('没有找到设备信息，使用原始 deviceId:', deviceId); } + // 构建查询参数 - const queryParams: any = { + const queryParams = { pageIndex: page.currentPage, pageSize: page.pageSize, - SearchKeyword: formValues?.SearchKeyword || '', + SearchKeyword: currentFormValues.SearchKeyword || '', DeviceType: deviceType, - IoTDataType: formValues?.IoTDataType || '', + IoTDataType: currentFormValues.IoTDataType || '', DeviceId: deviceId, - SystemName: systemName || formValues?.SystemName || '', - StartCreationTime: formatDate(formValues?.StartCreationTime), - EndCreationTime: formatDate(formValues?.EndCreationTime), - FocusAddress: finalFocusAddress, + SystemName: systemName || currentFormValues.SystemName || '', + StartCreationTime: formatDate(currentFormValues.StartCreationTime), + EndCreationTime: formatDate(currentFormValues.EndCreationTime), + FocusAddress: currentFormValues.FocusAddress || '', }; + + console.log('最终查询参数:', queryParams); + if (DeviceType) queryParams.DeviceType = DeviceType; if (DeviceId) queryParams.DeviceId = DeviceId; const { data } = await postCTWingLogInfoPage({ @@ -117,12 +268,13 @@ const [Grid, gridApi] = useVbenVxeGrid({ formOptions, gridOptions }); // 监听分页器状态变化 watch( () => gridApi?.pagerApi?.pageSize, - (newSize, oldSize) => { + async (newSize, oldSize) => { if (newSize !== oldSize && oldSize) { // 重置到第一页 gridApi.pagerApi.currentPage = 1; - // 触发数据重新加载 - gridApi.reload(); + // 获取最新表单值并触发数据重新加载 + const latestValues = await gridApi.formApi.getValues(); + gridApi.reload(latestValues); } }, ); @@ -130,23 +282,19 @@ watch( // 监听当前页变化 watch( () => gridApi?.pagerApi?.currentPage, - (newPage, oldPage) => { + async (newPage, oldPage) => { if (newPage !== oldPage && oldPage) { - // 触发数据重新加载 - gridApi.reload(); + // 获取最新表单值并触发数据重新加载 + const latestValues = await gridApi.formApi.getValues(); + gridApi.reload(latestValues); } }, ); -// 监听DeviceId变化，自动刷新表格 -watch( - () => gridApi?.getFormModel?.()?.DeviceId, - (newVal, oldVal) => { - if (newVal !== oldVal) { - gridApi.reload(); - } - }, -); +// 页面初始化时获取设备信息 +onMounted(async () => { + await fetchDeviceOptions(); +});