feat: 仪表盘概览数
This commit is contained in:
@@ -3,6 +3,8 @@ import { onMounted, ref } from 'vue';
|
||||
import useI18n from '@/hooks/useI18n';
|
||||
import Topology from './components/Topology/index.vue';
|
||||
import { useFullscreen } from '@vueuse/core';
|
||||
import useAppStore from '@/store/modules/app';
|
||||
const appStore = useAppStore();
|
||||
const { t } = useI18n();
|
||||
|
||||
/**总览节点 */
|
||||
@@ -20,56 +22,40 @@ onMounted(() => {});
|
||||
<FullscreenExitOutlined v-if="isFullscreen" />
|
||||
<FullscreenOutlined v-else />
|
||||
</div>
|
||||
<div class="brand-desc">5GC 核心网数据</div>
|
||||
<div class="brand-desc">{{ appStore.appName }}</div>
|
||||
</div>
|
||||
|
||||
<div class="column">
|
||||
<!-- 基站数量 -->
|
||||
<div class="wrap">
|
||||
<div class="channel panel">
|
||||
<div class="inner">
|
||||
<h3>UE数量</h3>
|
||||
<div class="data">
|
||||
<div class="item">
|
||||
<h4>39 <small>%</small></h4>
|
||||
<span>
|
||||
<i class="icon-plane"></i>
|
||||
IMS
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="data">
|
||||
<div class="item">
|
||||
<h4>20 <small>%</small></h4>
|
||||
<span>
|
||||
<i class="icon-train"></i>
|
||||
AMF
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<!--概览-->
|
||||
<div class="overview panel">
|
||||
<div class="inner">
|
||||
<div class="item">
|
||||
<h4>2,190</h4>
|
||||
<span>
|
||||
<UserOutlined style="color: #006cff" />
|
||||
签约用户
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="quarter panel">
|
||||
<div class="inner">
|
||||
<h3>基站数量</h3>
|
||||
<div class="chart">
|
||||
<div class="data">
|
||||
<div class="item">
|
||||
<h4>1,321</h4>
|
||||
<span>
|
||||
<i class="icon-dot" style="color: #6acca3"></i>
|
||||
在线
|
||||
</span>
|
||||
</div>
|
||||
<div class="item">
|
||||
<h4>150%</h4>
|
||||
<span>
|
||||
<i class="icon-dot" style="color: #ed3f35"></i>
|
||||
不在线
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<h4>190</h4>
|
||||
<span>
|
||||
<UserSwitchOutlined style="color: #6acca3" />
|
||||
语音在线
|
||||
</span>
|
||||
</div>
|
||||
<div class="item">
|
||||
<h4>3,001</h4>
|
||||
<span>
|
||||
<UserSwitchOutlined style="color: #6acca3" />
|
||||
数据在线
|
||||
</span>
|
||||
</div>
|
||||
<div class="item">
|
||||
<h4>23</h4>
|
||||
<span>
|
||||
<WifiOutlined style="color: #edcb35" />
|
||||
基站在线
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -208,14 +194,14 @@ onMounted(() => {});
|
||||
<h4>248</h4>
|
||||
<span>
|
||||
<i class="icon-dot" style="color: #eacf19"></i>
|
||||
cpu
|
||||
cpu
|
||||
</span>
|
||||
</div>
|
||||
<div class="item">
|
||||
<h4>248</h4>
|
||||
<span>
|
||||
<i class="icon-dot" style="color: #eacf19"></i>
|
||||
内存
|
||||
内存
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user