OMC/fe.ems.vue3
1
0
Fork 0
Code Issues Releases 3 Activity

feat: 仪表盘概览数

Browse Source
This commit is contained in:
TsMask
2024-01-19 09:42:45 +08:00
parent 7c8091434b
commit bf246d621d
1 changed files with 34 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

82
src/views/dashboard/overview/index.vue
View File

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