WFC/fe.wfc
2
0
Fork 0
Code Activity

feat:隐藏网关、交换机、OLTs项，增加告警跳转

Browse Source
This commit is contained in:
zhongzm
2025-06-11 11:14:31 +08:00
parent bc89546ec6
commit c9b4e430e9
2 changed files with 66 additions and 62 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
src/views/dashboard/modules/card-data.vue
View File

@@ -167,21 +167,21 @@ const columns: TableColumnType<Api.DashboardSite>[] = [
key: 'alerts', key: 'alerts',
width: 100 width: 100
}, },
{ // {
title: t('page.carddata.gateway'), // title: t('page.carddata.gateway'),
key: 'gateway', // key: 'gateway',
width: 100 // width: 100
}, // },
{ // {
title: t('page.carddata.switches'), // title: t('page.carddata.switches'),
key: 'switches', // key: 'switches',
width: 100 // width: 100
}, // },
{ // {
title: 'OLTS', // title: 'OLTS',
key: 'olts', // key: 'olts',
width: 100 // width: 100
}, // },
{ {
title: 'EAPS', title: 'EAPS',
key: 'eaps', key: 'eaps',

98
src/views/dashboard/modules/header-banner.vue
View File

@@ -25,6 +25,10 @@ const handleUserClick = () =>{
const handleterminalClick = () => { const handleterminalClick = () => {
router.push('/device/terminal'); router.push('/device/terminal');
}; };
//告警跳转
const handAlertsClick = () => {
router.push('/device/alerts');
};
defineOptions({ defineOptions({
@@ -164,53 +168,53 @@ const otherDevices = computed(() => ({
</div> </div>
</div> </div>
<!-- Gateways --> <!-- &lt;!&ndash; Gateways &ndash;&gt;-->
<div class="flex flex-col p-6px"> <!-- <div class="flex flex-col p-6px">-->
<div class="flex items-center gap-6px mb-6px"> <!-- <div class="flex items-center gap-6px mb-6px">-->
<div class="size-48px flex-center bg-gray-100 rounded-lg relative"> <!-- <div class="size-48px flex-center bg-gray-100 rounded-lg relative">-->
<safety-outlined class="text-24px text-primary" /> <!-- <safety-outlined class="text-24px text-primary" />-->
<span class="text-20px font-semibold absolute -right-2 -top-2 bg-primary text-white rounded-full w-6 h-6 flex-center">{{ otherDevices.gateways.connected + otherDevices.gateways.disconnected }}</span> <!-- <span class="text-20px font-semibold absolute -right-2 -top-2 bg-primary text-white rounded-full w-6 h-6 flex-center">{{ otherDevices.gateways.connected + otherDevices.gateways.disconnected }}</span>-->
</div> <!-- </div>-->
<div class="text-16px font-medium">{{ t('page.headerbanner.gateway') }}</div> <!-- <div class="text-16px font-medium">{{ t('page.headerbanner.gateway') }}</div>-->
</div> <!-- </div>-->
<div class="border-t border-gray-100 my-4px"></div> <!-- <div class="border-t border-gray-100 my-4px"></div>-->
<div class="flex flex-col text-12px text-gray-500"> <!-- <div class="flex flex-col text-12px text-gray-500">-->
<span>{{ t('page.headerbanner.connect') }}: {{ otherDevices.gateways.connected }}</span> <!-- <span>{{ t('page.headerbanner.connect') }}: {{ otherDevices.gateways.connected }}</span>-->
<span>{{ t('page.headerbanner.disconnect') }}: {{ otherDevices.gateways.disconnected }}</span> <!-- <span>{{ t('page.headerbanner.disconnect') }}: {{ otherDevices.gateways.disconnected }}</span>-->
</div> <!-- </div>-->
</div> <!-- </div>-->
<!-- Switches --> <!-- &lt;!&ndash; Switches &ndash;&gt;-->
<div class="flex flex-col p-6px"> <!-- <div class="flex flex-col p-6px">-->
<div class="flex items-center gap-6px mb-6px"> <!-- <div class="flex items-center gap-6px mb-6px">-->
<div class="size-48px flex-center bg-gray-100 rounded-lg relative"> <!-- <div class="size-48px flex-center bg-gray-100 rounded-lg relative">-->
<hdd-outlined class="text-24px text-primary" /> <!-- <hdd-outlined class="text-24px text-primary" />-->
<span class="text-20px font-semibold absolute -right-2 -top-2 bg-primary text-white rounded-full w-6 h-6 flex-center">{{ otherDevices.switches.connected + otherDevices.switches.disconnected }}</span> <!-- <span class="text-20px font-semibold absolute -right-2 -top-2 bg-primary text-white rounded-full w-6 h-6 flex-center">{{ otherDevices.switches.connected + otherDevices.switches.disconnected }}</span>-->
</div> <!-- </div>-->
<div class="text-16px font-medium">{{ t('page.headerbanner.switches') }}</div> <!-- <div class="text-16px font-medium">{{ t('page.headerbanner.switches') }}</div>-->
</div> <!-- </div>-->
<div class="border-t border-gray-100 my-4px"></div> <!-- <div class="border-t border-gray-100 my-4px"></div>-->
<div class="flex flex-col text-12px text-gray-500"> <!-- <div class="flex flex-col text-12px text-gray-500">-->
<span>{{ t('page.headerbanner.connect') }}: {{ otherDevices.switches.connected }}</span> <!-- <span>{{ t('page.headerbanner.connect') }}: {{ otherDevices.switches.connected }}</span>-->
<span>{{ t('page.headerbanner.disconnect') }}: {{ otherDevices.switches.disconnected }}</span> <!-- <span>{{ t('page.headerbanner.disconnect') }}: {{ otherDevices.switches.disconnected }}</span>-->
</div> <!-- </div>-->
</div> <!-- </div>-->
<!-- OLTs --> <!-- &lt;!&ndash; OLTs &ndash;&gt;-->
<div class="flex flex-col p-6px"> <!-- <div class="flex flex-col p-6px">-->
<div class="flex items-center gap-6px mb-6px"> <!-- <div class="flex items-center gap-6px mb-6px">-->
<div class="size-48px flex-center bg-gray-100 rounded-lg relative"> <!-- <div class="size-48px flex-center bg-gray-100 rounded-lg relative">-->
<group-outlined class="text-24px text-primary" /> <!-- <group-outlined class="text-24px text-primary" />-->
<span class="text-20px font-semibold absolute -right-2 -top-2 bg-primary text-white rounded-full w-6 h-6 flex-center">{{ otherDevices.olts.total }}</span> <!-- <span class="text-20px font-semibold absolute -right-2 -top-2 bg-primary text-white rounded-full w-6 h-6 flex-center">{{ otherDevices.olts.total }}</span>-->
</div> <!-- </div>-->
<div class="text-16px font-medium">OLTs</div> <!-- <div class="text-16px font-medium">OLTs</div>-->
</div> <!-- </div>-->
<div class="border-t border-gray-100 my-4px"></div> <!-- <div class="border-t border-gray-100 my-4px"></div>-->
<div class="flex flex-col text-12px text-gray-500"> <!-- <div class="flex flex-col text-12px text-gray-500">-->
<span>{{ t('page.headerbanner.connect') }}: {{ otherDevices.olts.connected }}</span> <!-- <span>{{ t('page.headerbanner.connect') }}: {{ otherDevices.olts.connected }}</span>-->
<span>{{ t('page.headerbanner.disconnect') }}: {{ otherDevices.olts.disconnected }}</span> <!-- <span>{{ t('page.headerbanner.disconnect') }}: {{ otherDevices.olts.disconnected }}</span>-->
</div> <!-- </div>-->
</div> <!-- </div>-->
<!-- Register Users --> <!-- Register Users -->
<div class="flex flex-col p-6px"> <div class="flex flex-col p-6px">
@@ -281,8 +285,8 @@ const otherDevices = computed(() => ({
<!-- Alerts --> <!-- Alerts -->
<div class="flex flex-col p-6px"> <div class="flex flex-col p-6px">
<div class="flex items-center gap-6px mb-6px"> <div class="flex items-center gap-6px mb-6px">
<div class="size-48px flex-center bg-yellow-50 rounded-lg"> <div class="size-48px flex-center bg-yellow-50 rounded-lg relative hover:bg-green-100">
<icon-mdi-alert class="text-warning text-24px" /> <icon-mdi-alert class="text-warning text-24px cursor-pointer" @click="handAlertsClick"/>
</div> </div>
<div class="text-16px font-medium">{{ t('page.headerbanner.alerts') }}</div> <div class="text-16px font-medium">{{ t('page.headerbanner.alerts') }}</div>
</div> </div>