修改租户界面排版

This commit is contained in:
lai
2024-07-04 14:40:17 +08:00
parent 60dc02010d
commit 361fdf6959
3 changed files with 78 additions and 90 deletions

View File

@@ -1,6 +1,6 @@
.cardClass {
width: 100%;
height: 100%;
height:170px;
border-radius: 10px;
}
@@ -43,6 +43,13 @@
position: absolute;
right: 15px;
padding-right: 15px;
top: 50%;
}
.detailsLeft {
position: absolute;
left: 15px;
padding-left: 15px;
top: 50%;
}
/*
.details {

View File

@@ -4,6 +4,7 @@ import useI18n from '@/hooks/useI18n';
import { RESULT_CODE_SUCCESS } from '@/constants/result-constants';
import { listUDMSub } from '@/api/neData/udm_sub';
import { listUENumBySMF, listUEInfoBySMF } from '@/api/neUser/smf';
import svgBasefff from '@/assets/svg/basefff.svg';
import { listBase5G } from '@/api/neUser/base5G';
import { useRouter } from 'vue-router';
const router = useRouter();
@@ -112,6 +113,12 @@ onMounted(() => {
:hoverable="true"
class="cardClass"
>
<div style="text-align: center">
<span style="font-size: 24px; font-weight: bold; color: #fff">
{{ t('views.dashboard.overview.skim.users') }}
</span>
</div>
<div class="visual">
<rise-outlined />
</div>
@@ -120,11 +127,6 @@ onMounted(() => {
<UserOutlined class="spaceButton" />
{{ skimState.udmSubNum }}
</div>
<div class="desc">
<span class="flexibleSpan gNodeBSpan">
{{ t('views.dashboard.overview.skim.users') }}
</span>
</div>
</div>
</a-card>
</a-col>
@@ -136,6 +138,11 @@ onMounted(() => {
:hoverable="true"
class="cardClass"
>
<div style="text-align: center">
<span style="font-size: 24px; font-weight: bold; color: #fff">
{{ t('views.dashboard.overview.skim.smfUeNum') }}
</span>
</div>
<div class="visual">
<bar-chart-outlined />
</div>
@@ -144,11 +151,6 @@ onMounted(() => {
<database-outlined class="spaceButton" />
{{ skimState.smfUeNum }}
</div>
<div class="desc">
<span class="flexibleSpan dataSpan">
{{ t('views.dashboard.overview.skim.smfUeNum') }}
</span>
</div>
</div>
</a-card>
</a-col>
@@ -160,46 +162,34 @@ onMounted(() => {
:hoverable="true"
class="cardClass"
>
<a-row :gutter="16">
<a-col :lg="12" :md="12" :xs="24">
<div class="visual45G">
<bar-chart-outlined />
</div>
<div class="details">
<div
class="number"
@click="fnToRouter('Base5G_2160', { neType: 'AMF' })"
>
<wifi-outlined class="spaceButton" />
{{ skimState.gnbNum }}
</div>
<div class="desc">
<span class="flexibleSpan gNodeBSpan">{{
t('views.dashboard.overview.skim.gnbBase')
}}</span>
</div>
</div>
</a-col>
<a-col :lg="12" :md="12" :xs="24">
<div class="visual45G">
<bar-chart-outlined />
</div>
<div class="details">
<div
class="number"
@click="fnToRouter('Base5G_2160', { neType: 'AMF' })"
>
<UserOutlined class="spaceButton" />
{{ skimState.gnbUeNum }}
</div>
<div class="desc">
<span class="flexibleSpan gUserSpan">{{
t('views.dashboard.overview.skim.gnbUeNum')
}}</span>
</div>
</div>
</a-col>
</a-row>
<div style="text-align: center">
<span style="font-size: 24px; font-weight: bold; color: #fff">
5G
</span>
</div>
<div class="detailsLeft">
<div
class="number"
@click="fnToRouter('Base5G_2160', { neType: 'AMF' })"
>
<img
:src="svgBasefff"
style="height: 2rem; color: #fff; margin-top: -9px"
class="spaceButton"
/>
{{ skimState.gnbNum }}
</div>
</div>
<div class="details">
<div
class="number"
@click="fnToRouter('Base5G_2160', { neType: 'AMF' })"
>
<UserOutlined class="spaceButton" />
{{ skimState.gnbUeNum }}
</div>
</div>
</a-card>
</a-col>
@@ -210,45 +200,33 @@ onMounted(() => {
:hoverable="true"
class="cardClass"
>
<a-row :gutter="16">
<a-col :lg="12" :md="12" :xs="24">
<div class="visual45G">
<bar-chart-outlined />
</div>
<div class="details">
<div
class="number"
@click="fnToRouter('Base5G_2160', { neType: 'MME' })"
>
<wifi-outlined class="spaceButton" />
{{ skimState.enbNum }}
</div>
<div class="desc">
<span class="flexibleSpan eNodeBSpan">{{
t('views.dashboard.overview.skim.enbBase')
}}</span>
</div>
</div>
</a-col>
<a-col :lg="12" :md="12" :xs="24">
<div class="visual45G">
<bar-chart-outlined />
</div>
<div class="details">
<div
class="number"
@click="fnToRouter('Base5G_2160', { neType: 'MME' })"
>
<UserOutlined class="spaceButton" /> {{ skimState.enbUeNum }}
</div>
<div class="desc">
<span class="flexibleSpan eUserSpan">{{
t('views.dashboard.overview.skim.enbUeNum')
}}</span>
</div>
</div>
</a-col>
</a-row>
<div style="text-align: center">
<span style="font-size: 24px; font-weight: bold; color: #fff">
4G
</span>
</div>
<div class="detailsLeft">
<div
class="number"
@click="fnToRouter('Base5G_2160', { neType: 'MME' })"
>
<img
:src="svgBasefff"
style="height: 2rem; color: #fff; margin-top: -9px"
class="spaceButton"
/>
{{ skimState.enbNum }}
</div>
</div>
<div class="details">
<div
class="number"
@click="fnToRouter('Base5G_2160', { neType: 'MME' })"
>
<UserOutlined class="spaceButton" /> {{ skimState.enbUeNum }}
</div>
</div>
</a-card>
</a-col>
</a-row>