2
0

fix:终端设备界面信息增加字段修改

This commit is contained in:
zhongzm
2025-01-16 20:45:33 +08:00
parent a9a6fd9b88
commit 0b20cec9bd
4 changed files with 177 additions and 13 deletions

View File

@@ -56,8 +56,9 @@ import { SimpleScrollbar } from '~/packages/materials/src';
import { computed, shallowRef, watch } from 'vue';
import { useElementSize } from '@vueuse/core';
import { fetchTerminalList } from '@/service/api/auth';
import { Card as ACard, Table as ATable } from 'ant-design-vue';
import { Card as ACard, Table as ATable, Tag as ATag } from 'ant-design-vue';
import TerminalSearch from './modules/terminal-search.vue';
import { formatStorage, formatTime } from '@/utils/units';
const wrapperEl = shallowRef<HTMLElement | null>(null);
@@ -68,6 +69,43 @@ const scrollConfig = computed(() => ({
x: 800
}));
const getAuthStatusText = (status: number) => {
switch (status) {
case 1:
return 'pending';
case 2:
return 'authorized';
default:
return '未知';
}
};
const getAuthStatusColor = (status: number) => {
switch (status) {
case 1:
return 'warning';
case 2:
return 'success';
default:
return 'default';
}
};
const formatDetailedTime = (seconds: number): string => {
const days = Math.floor(seconds / 86400);
const hours = Math.floor((seconds % 86400) / 3600);
const minutes = Math.floor((seconds % 3600) / 60);
const remainingSeconds = seconds % 60;
const parts = [];
if (days > 0) parts.push(`${days}`);
if (hours > 0) parts.push(`${hours}小时`);
if (minutes > 0) parts.push(`${minutes}分钟`);
if (remainingSeconds > 0 || parts.length === 0) parts.push(`${remainingSeconds}`);
return parts.join('');
};
const {
columns,
columnChecks,
@@ -114,25 +152,83 @@ const {
pagination: true,
columns: (): AntDesign.TableColumn<Api.Device.TerminalDevice>[] => [
{
key: 'clientName',
dataIndex: 'clientName',
key: 'name',
dataIndex: 'name',
title: '设备名称',
align: 'center',
width: 150
},
{
key: 'clientDeviceType',
dataIndex: 'clientDeviceType',
title: '设备类型',
key: 'ip',
dataIndex: 'ip',
title: 'IP地址',
align: 'center',
width: 150
},
{
key: 'clientMac',
dataIndex: 'clientMac',
title: 'MAC地址',
key: 'authStatus',
dataIndex: 'authStatus',
title: '状态',
align: 'center',
width: 180
width: 120,
customRender: ({ text }) => h(ATag, {
color: getAuthStatusColor(text)
}, () => getAuthStatusText(text))
},
{
key: 'ssid',
dataIndex: 'ssid',
title: '网络',
align: 'center',
width: 150
},
{
key: 'apName',
dataIndex: 'apName',
title: '所属AP设备',
align: 'center',
width: 150
},
{
key: 'activity',
dataIndex: 'activity',
title: '下载速率',
align: 'center',
width: 120,
customRender: ({ text }) => {
const { value, unit } = formatStorage(text);
return `${value.toFixed(2)} ${unit}/s`;
}
},
{
key: 'trafficDown',
dataIndex: 'trafficDown',
title: '下载量',
align: 'center',
width: 120,
customRender: ({ text }) => {
const { value, unit } = formatStorage(text);
return `${value.toFixed(2)} ${unit}`;
}
},
{
key: 'trafficUp',
dataIndex: 'trafficUp',
title: '上传量',
align: 'center',
width: 120,
customRender: ({ text }) => {
const { value, unit } = formatStorage(text);
return `${value.toFixed(2)} ${unit}`;
}
},
{
key: 'uptime',
dataIndex: 'uptime',
title: '在线时长',
align: 'center',
width: 150,
customRender: ({ text }) => formatDetailedTime(text)
}
]
});