admin/JiShe.IOT.UI
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

设备日志数据查看

Browse Source
This commit is contained in:
ChenYi 2025-08-01 16:01:58 +08:00
parent b4530f1360
commit b501552616
8 changed files with 201 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
apps/web-antd/src/locales/langs/en-US/abp.json
View File

@ -97,7 +97,8 @@
"receivedMessageHexString": "Received Message (Hex)",
"receivedTime": "Received Time",
"isReceived": "Received Status",
"receivedRemark": "Report Parsing Remarks"
"receivedRemark": "Report Parsing Remarks",
"title": "Title"
},
"message": {
"title": "Title",

3
apps/web-antd/src/locales/langs/zh-CN/abp.json
View File

@ -97,7 +97,8 @@
"receivedMessageHexString": "消息上报内容",
"receivedTime": "消息上报时间",
"isReceived": "是否已上报",
"receivedRemark": "上报报文解析备注"
"receivedRemark": "上报报文解析备注",
"title": "日志"
},
"message": {
"title": "标题",

28
apps/web-antd/src/views/devicemanagement/deviceinfo/index.vue
View File

@ -238,6 +238,27 @@ const toDeviceInfoData = (row: Record<string, any>) => {
},
});
};
const toDeviceLog = (row: Record<string, any>) => {
// 根据平台类型跳转到对应的日志页面
if (row.ioTPlatform === 1 || row.ioTPlatform === '1') {
// CTWing平台
router.push({
path: '/iotdbdatamanagement/ctwingLog',
query: {
DeviceAddress: row.deviceAddress,
},
});
} else if (row.ioTPlatform === 2 || row.ioTPlatform === '2') {
// OneNET平台
router.push({
path: '/iotdbdatamanagement/onenetLog',
query: {
DeviceAddress: row.deviceAddress,
},
});
}
};
const openAddModal = async () => {
editRow.value = {};
userModalApi.open();
@ -358,6 +379,13 @@ const toolbarActions = computed(() => [
auth: ['AbpIdentity.Users.Update'],
onClick: toDeviceInfoData.bind(null, row),
},
{
label: $t('abp.log.title'),
type: 'link',
size: 'small',
auth: ['AbpIdentity.Users.Update'],
onClick: toDeviceLog.bind(null, row),
},
]" :drop-down-actions="[
{
label: $t('common.delete'),

5
apps/web-antd/src/views/devicemanagement/deviceinfo/schema.ts
View File

@ -83,7 +83,7 @@ export const tableSchema: any = computed((): VxeGridProps['columns'] => [
title: $t('common.action'),
field: 'action',
fixed: 'right',
width: '150',
width: '165',
slots: { default: 'action' },
},
]);
@ -105,7 +105,8 @@ export const addDeviceFormSchema: any = computed(() => [
optionsPropName: 'options',
immediate: true,
allowClear: true,
placeholder: $t('common.pleaseSelect') + $t('abp.deviceInfos.ioTPlatform'),
placeholder:
$t('common.pleaseSelect') + $t('abp.deviceInfos.ioTPlatform'),
afterFetch: (res: any) => {
// 确保返回的是数组格式
if (Array.isArray(res)) {

106
apps/web-antd/src/views/iotdbdatamanagement/ctwingLog/index.vue
View File

@ -19,7 +19,10 @@ defineOptions({
});
const route = useRoute();
const { DeviceType, DeviceId, FocusAddress } = route.query;
const { DeviceAddress } = route.query;
// 是否正在初始化，用于防止重复查询
const isInitializing = ref(false);
// 添加设备选择器引用
const deviceSelectRef = ref();
@ -48,13 +51,13 @@ const fetchDeviceOptions = async () => {
}
};
// 根据设备ID获取设备信息对象
const getDeviceInfoById = (deviceId: string) => {
if (!deviceId || !deviceOptions.value || deviceOptions.value.length === 0) {
// 根据设备地址获取设备信息对象
const getDeviceInfoByAddress = (deviceAddress: string) => {
if (!deviceAddress || !deviceOptions.value || deviceOptions.value.length === 0) {
return null;
}
const device = deviceOptions.value.find((device) => device.id === deviceId);
const device = deviceOptions.value.find((device) => device.deviceAddress === deviceAddress);
return device;
};
@ -80,19 +83,27 @@ const getDeviceInfoFromRef = async () => {
const formOptions: VbenFormProps = {
schema: querySchema.value,
initialValues: {
DeviceAddress: DeviceAddress as string,
},
// 禁用表单值变化时自动提交，使用自定义处理函数
submitOnChange: false,
// 添加表单值变化的处理函数
handleValuesChange: async (values, changedFields) => {
// 当 DeviceId 发生变化时，更新 selectedDeviceInfo
if (changedFields.includes('DeviceId')) {
const deviceId = values.DeviceId;
// 如果正在初始化，不触发查询
if (isInitializing.value) {
return;
}
if (deviceId) {
// 当 DeviceAddress 发生变化时，更新 selectedDeviceInfo
if (changedFields.includes('DeviceAddress')) {
const deviceAddress = values.DeviceAddress;
if (deviceAddress) {
// 先尝试从 deviceOptions 中查找（备用方案）
let device =
deviceOptions.value.length > 0
? deviceOptions.value.find((d) => d.id === deviceId)
? deviceOptions.value.find((d) => d.deviceAddress === deviceAddress)
: null;
// 如果没找到，尝试从 DeviceSelect 组件中获取
@ -100,7 +111,7 @@ const formOptions: VbenFormProps = {
try {
// 获取 DeviceSelect 组件的实例
const deviceSelectRef =
gridApi.formApi.getFieldComponentRef('DeviceId');
gridApi.formApi.getFieldComponentRef('DeviceAddress');
if (deviceSelectRef && deviceSelectRef.getSelectedDevice) {
device = deviceSelectRef.getSelectedDevice();
}
@ -116,7 +127,7 @@ const formOptions: VbenFormProps = {
setTimeout(() => {
try {
const deviceSelectRef =
gridApi.formApi.getFieldComponentRef('DeviceId');
gridApi.formApi.getFieldComponentRef('DeviceAddress');
if (deviceSelectRef && deviceSelectRef.getSelectedDevice) {
const delayedDevice = deviceSelectRef.getSelectedDevice();
if (delayedDevice) {
@ -135,7 +146,7 @@ const formOptions: VbenFormProps = {
// 当任何相关字段发生变化时，刷新表格数据
const relevantFields = new Set([
'DeviceId',
'DeviceAddress',
'EndCreationTime',
'IoTDataType',
'StartCreationTime',
@ -180,14 +191,19 @@ const gridOptions: VxeGridProps<any> = {
// 总是从表单API获取最新的表单值，确保分页时参数完整
const currentFormValues = gridApi?.formApi ? await gridApi.formApi.getValues() : {};
// 如果表单中没有DeviceAddress，但有路由参数，使用路由参数
if (!currentFormValues.DeviceAddress && DeviceAddress) {
currentFormValues.DeviceAddress = DeviceAddress as string;
}
// 获取选中的设备信息
let deviceAddress = currentFormValues.DeviceId || '';
let deviceAddress = currentFormValues.DeviceAddress || '';
// 优先使用选中的设备信息
const deviceInfo =
selectedDeviceInfo.value ||
(currentFormValues.DeviceId && deviceOptions.value.length > 0
? getDeviceInfoById(currentFormValues.DeviceId)
(deviceAddress && deviceOptions.value.length > 0
? getDeviceInfoByAddress(deviceAddress)
: null);
if (deviceInfo) {
@ -199,13 +215,11 @@ const gridOptions: VxeGridProps<any> = {
pageSize: page.pageSize,
SearchKeyword: currentFormValues.SearchKeyword || '',
IoTDataType: currentFormValues.IoTDataType || '',
DeviceId: deviceAddress, // 直接使用设备地址
DeviceAddress: deviceAddress, // 使用设备地址
StartCreationTime: formatDate(currentFormValues.StartCreationTime),
EndCreationTime: formatDate(currentFormValues.EndCreationTime),
};
if (DeviceType) queryParams.DeviceType = DeviceType;
if (DeviceId) queryParams.DeviceId = DeviceId;
const { data } = await postTableModelCtWingLogInfo({
body: queryParams,
});
@ -221,11 +235,52 @@ const gridOptions: VxeGridProps<any> = {
const [Grid, gridApi] = useVbenVxeGrid({ formOptions, gridOptions });
// 初始化函数
const initializeGrid = async () => {
try {
// 设置初始化标志
isInitializing.value = true;
// 获取设备信息数据
await fetchDeviceOptions();
// 如果有路由参数，自动触发查询
if (DeviceAddress) {
// 延迟一下确保表格已完全初始化
setTimeout(async () => {
if (gridApi && gridApi.formApi) {
// 确保表单值正确设置
const currentValues = await gridApi.formApi.getValues();
if (!currentValues.DeviceAddress && DeviceAddress) {
await gridApi.formApi.setValues({
...currentValues,
DeviceAddress: DeviceAddress as string,
});
}
// 延迟清除初始化标志，确保只触发一次查询
setTimeout(() => {
isInitializing.value = false;
gridApi.reload();
}, 200);
} else {
isInitializing.value = false;
}
}, 300);
} else {
// 如果没有路由参数，直接清除初始化标志
isInitializing.value = false;
}
} catch (error) {
console.error('初始化表格失败:', error);
isInitializing.value = false;
}
};
// 监听分页器状态变化
watch(
() => gridApi?.pagerApi?.pageSize,
async (newSize, oldSize) => {
if (newSize !== oldSize && oldSize) {
if (newSize !== oldSize && oldSize && !isInitializing.value) {
// 重置到第一页
gridApi.pagerApi.currentPage = 1;
// 获取最新表单值并触发数据重新加载
@ -239,7 +294,7 @@ watch(
watch(
() => gridApi?.pagerApi?.currentPage,
async (newPage, oldPage) => {
if (newPage !== oldPage && oldPage) {
if (newPage !== oldPage && oldPage && !isInitializing.value) {
// 获取最新表单值并触发数据重新加载
const latestValues = await gridApi.formApi.getValues();
gridApi.reload(latestValues);
@ -247,16 +302,19 @@ watch(
},
);
// 页面初始化时获取设备信息
// 页面初始化时，延迟初始化表格
onMounted(async () => {
await fetchDeviceOptions();
// 延迟初始化，确保VXE表格组件已完全挂载
setTimeout(async () => {
await initializeGrid();
}, 100);
});
</script>
<template>
<Page auto-content-height>
<Grid>
<template #DeviceId="{ model, field }">
<template #DeviceAddress="{ model, field }">
<DeviceSelect ref="deviceSelectRef" v-model:value="model[field]"
:placeholder="$t('common.pleaseSelect') + $t('abp.log.deviceInfo')" allow-clear />
</template>

2
apps/web-antd/src/views/iotdbdatamanagement/ctwingLog/schema.ts
View File

@ -45,7 +45,7 @@ export const querySchema = computed(() => [
},
{
component: 'DeviceSelect',
fieldName: 'DeviceId',
fieldName: 'DeviceAddress',
label: $t('abp.log.deviceInfo'),
componentProps: {
placeholder: $t('common.pleaseSelect') + $t('abp.log.deviceInfo'),

106
apps/web-antd/src/views/iotdbdatamanagement/onenetLog/index.vue
View File

@ -19,7 +19,10 @@ defineOptions({
});
const route = useRoute();
const { DeviceType, DeviceId, FocusAddress } = route.query;
const { DeviceAddress } = route.query;
// 是否正在初始化，用于防止重复查询
const isInitializing = ref(false);
// 添加设备选择器引用
const deviceSelectRef = ref();
@ -48,13 +51,13 @@ const fetchDeviceOptions = async () => {
}
};
// 根据设备ID获取设备信息对象
const getDeviceInfoById = (deviceId: string) => {
if (!deviceId || !deviceOptions.value || deviceOptions.value.length === 0) {
// 根据设备地址获取设备信息对象
const getDeviceInfoByAddress = (deviceAddress: string) => {
if (!deviceAddress || !deviceOptions.value || deviceOptions.value.length === 0) {
return null;
}
const device = deviceOptions.value.find((device) => device.id === deviceId);
const device = deviceOptions.value.find((device) => device.deviceAddress === deviceAddress);
return device;
};
@ -79,19 +82,27 @@ const getDeviceInfoFromRef = async () => {
const formOptions: VbenFormProps = {
schema: querySchema.value,
initialValues: {
DeviceAddress: DeviceAddress as string,
},
// 禁用表单值变化时自动提交，使用自定义处理函数
submitOnChange: false,
// 添加表单值变化的处理函数
handleValuesChange: async (values, changedFields) => {
// 当 DeviceId 发生变化时，更新 selectedDeviceInfo
if (changedFields.includes('DeviceId')) {
const deviceId = values.DeviceId;
// 如果正在初始化，不触发查询
if (isInitializing.value) {
return;
}
if (deviceId) {
// 当 DeviceAddress 发生变化时，更新 selectedDeviceInfo
if (changedFields.includes('DeviceAddress')) {
const deviceAddress = values.DeviceAddress;
if (deviceAddress) {
// 先尝试从 deviceOptions 中查找（备用方案）
let device =
deviceOptions.value.length > 0
? deviceOptions.value.find((d) => d.id === deviceId)
? deviceOptions.value.find((d) => d.deviceAddress === deviceAddress)
: null;
// 如果没找到，尝试从 DeviceSelect 组件中获取
@ -99,7 +110,7 @@ const formOptions: VbenFormProps = {
try {
// 获取 DeviceSelect 组件的实例
const deviceSelectRef =
gridApi.formApi.getFieldComponentRef('DeviceId');
gridApi.formApi.getFieldComponentRef('DeviceAddress');
if (deviceSelectRef && deviceSelectRef.getSelectedDevice) {
device = deviceSelectRef.getSelectedDevice();
}
@ -115,7 +126,7 @@ const formOptions: VbenFormProps = {
setTimeout(() => {
try {
const deviceSelectRef =
gridApi.formApi.getFieldComponentRef('DeviceId');
gridApi.formApi.getFieldComponentRef('DeviceAddress');
if (deviceSelectRef && deviceSelectRef.getSelectedDevice) {
const delayedDevice = deviceSelectRef.getSelectedDevice();
if (delayedDevice) {
@ -134,7 +145,7 @@ const formOptions: VbenFormProps = {
// 当任何相关字段发生变化时，刷新表格数据
const relevantFields = new Set([
'DeviceId',
'DeviceAddress',
'EndCreationTime',
'IoTDataType',
'StartCreationTime',
@ -178,14 +189,19 @@ const gridOptions: VxeGridProps<any> = {
// 总是从表单API获取最新的表单值，确保分页时参数完整
const currentFormValues = gridApi?.formApi ? await gridApi.formApi.getValues() : {};
// 如果表单中没有DeviceAddress，但有路由参数，使用路由参数
if (!currentFormValues.DeviceAddress && DeviceAddress) {
currentFormValues.DeviceAddress = DeviceAddress as string;
}
// 获取选中的设备信息
let deviceAddress = currentFormValues.DeviceId || '';
let deviceAddress = currentFormValues.DeviceAddress || '';
// 优先使用选中的设备信息
const deviceInfo =
selectedDeviceInfo.value ||
(currentFormValues.DeviceId && deviceOptions.value.length > 0
? getDeviceInfoById(currentFormValues.DeviceId)
(deviceAddress && deviceOptions.value.length > 0
? getDeviceInfoByAddress(deviceAddress)
: null);
if (deviceInfo) {
@ -198,13 +214,11 @@ const gridOptions: VxeGridProps<any> = {
pageSize: page.pageSize,
SearchKeyword: currentFormValues.SearchKeyword || '',
IoTDataType: currentFormValues.IoTDataType || '',
DeviceId: deviceAddress, // 直接使用设备地址
DeviceAddress: deviceAddress, // 使用设备地址
StartCreationTime: formatDate(currentFormValues.StartCreationTime),
EndCreationTime: formatDate(currentFormValues.EndCreationTime),
};
if (DeviceType) queryParams.DeviceType = DeviceType;
if (DeviceId) queryParams.DeviceId = DeviceId;
const { data } = await postTableModelOneNetLogInfo({
body: queryParams,
});
@ -220,11 +234,52 @@ const gridOptions: VxeGridProps<any> = {
const [Grid, gridApi] = useVbenVxeGrid({ formOptions, gridOptions });
// 初始化函数
const initializeGrid = async () => {
try {
// 设置初始化标志
isInitializing.value = true;
// 获取设备信息数据
await fetchDeviceOptions();
// 如果有路由参数，自动触发查询
if (DeviceAddress) {
// 延迟一下确保表格已完全初始化
setTimeout(async () => {
if (gridApi && gridApi.formApi) {
// 确保表单值正确设置
const currentValues = await gridApi.formApi.getValues();
if (!currentValues.DeviceAddress && DeviceAddress) {
await gridApi.formApi.setValues({
...currentValues,
DeviceAddress: DeviceAddress as string,
});
}
// 延迟清除初始化标志，确保只触发一次查询
setTimeout(() => {
isInitializing.value = false;
gridApi.reload();
}, 200);
} else {
isInitializing.value = false;
}
}, 300);
} else {
// 如果没有路由参数，直接清除初始化标志
isInitializing.value = false;
}
} catch (error) {
console.error('初始化表格失败:', error);
isInitializing.value = false;
}
};
// 监听分页器状态变化
watch(
() => gridApi?.pagerApi?.pageSize,
async (newSize, oldSize) => {
if (newSize !== oldSize && oldSize) {
if (newSize !== oldSize && oldSize && !isInitializing.value) {
// 重置到第一页
gridApi.pagerApi.currentPage = 1;
// 获取最新表单值并触发数据重新加载
@ -238,7 +293,7 @@ watch(
watch(
() => gridApi?.pagerApi?.currentPage,
async (newPage, oldPage) => {
if (newPage !== oldPage && oldPage) {
if (newPage !== oldPage && oldPage && !isInitializing.value) {
// 获取最新表单值并触发数据重新加载
const latestValues = await gridApi.formApi.getValues();
gridApi.reload(latestValues);
@ -246,16 +301,19 @@ watch(
},
);
// 页面初始化时获取设备信息
// 页面初始化时，延迟初始化表格
onMounted(async () => {
await fetchDeviceOptions();
// 延迟初始化，确保VXE表格组件已完全挂载
setTimeout(async () => {
await initializeGrid();
}, 100);
});
</script>
<template>
<Page auto-content-height>
<Grid>
<template #DeviceId="{ model, field }">
<template #DeviceAddress="{ model, field }">
<DeviceSelect ref="deviceSelectRef" v-model:value="model[field]"
:placeholder="$t('common.pleaseSelect') + $t('abp.log.deviceInfo')" allow-clear />
</template>

2
apps/web-antd/src/views/iotdbdatamanagement/onenetLog/schema.ts
View File

@ -45,7 +45,7 @@ export const querySchema = computed(() => [
},
{
component: 'DeviceSelect',
fieldName: 'DeviceId',
fieldName: 'DeviceAddress',
label: $t('abp.log.deviceInfo'),
componentProps: {
placeholder: $t('common.pleaseSelect') + $t('abp.log.deviceInfo'),