Skip to content

Commit d065837

Browse files
ssongliussongliu
authored
fix: 优化概览页磁盘显示 (#7023)
1 parent 67c1fbd commit d065837

File tree

6 files changed

+43
-43
lines changed

6 files changed

+43
-43
lines changed

‎frontend/src/lang/modules/en.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ const message = {
1111
true: 'true',
1212
false: 'false',
1313
example: 'e.g.:',
14+
fit2cloud: 'FIT2CLOUD',
1415
button: {
1516
create: 'Create ',
1617
add: 'Add ',

‎frontend/src/lang/modules/tw.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ const message = {
1010
true: '是',
1111
false: '否',
1212
example: '例：',
13+
fit2cloud: '飛致雲',
1314
button: {
1415
create: '創建',
1516
add: '添加',

‎frontend/src/lang/modules/zh.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ const message = {
1010
true: '是',
1111
false: '否',
1212
example: '例：',
13+
fit2cloud: '飞致云',
1314
button: {
1415
create: '创建',
1516
add: '添加',

‎frontend/src/layout/components/AppFooter.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<div class="footer" :style="{ height: mobile ? '108px' : '48px' }">
33
<div class="flex w-full flex-col gap-4 md:justify-between md:flex-row">
44
<div class="flex flex-wrap gap-4">
5-
<a href="https://fit2cloud.com/" target="_blank">Copyright © 2014-2024 飞致云</a>
5+
<a href="https://fit2cloud.com/" target="_blank">Copyright © 2014-2024 {{ $t('commons.fit2cloud') }}</a>
66
</div>
77
<div class="flex flex-row gap-2 md:flex-col lg:flex-row">
88
<SystemUpgrade :footer="true" />

‎frontend/src/views/home/index.vue‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -290,7 +290,6 @@ const isSafety = ref();
290290
const chartOption = ref('network');
291291
let timer: NodeJS.Timer | null = null;
292292
let isInit = ref<boolean>(true);
293-
let isStatusInit = ref<boolean>(true);
294293
let isActive = ref(true);
295294
296295
const ioReadBytes = ref<Array<number>>([]);
@@ -429,8 +428,7 @@ const onLoadBaseInfo = async (isInit: boolean, range: string) => {
429428
currentInfo.value.uptime = resData.uptime;
430429
431430
loadAppCurrentInfo();
432-
isStatusInit.value = false;
433-
statusRef.value.acceptParams(currentInfo.value, baseInfo.value, isStatusInit.value);
431+
statusRef.value.acceptParams(currentInfo.value, baseInfo.value);
434432
appRef.value.acceptParams();
435433
if (isInit) {
436434
timer = setInterval(async () => {
@@ -443,7 +441,7 @@ const onLoadBaseInfo = async (isInit: boolean, range: string) => {
443441
444442
const loadAppCurrentInfo = async () => {
445443
await Promise.all([onLoadCurrentInfo('gpu'), onLoadCurrentInfo('basic'), onLoadCurrentInfo('ioNet')]);
446-
statusRef.value.acceptParams(currentInfo.value, baseInfo.value, isStatusInit.value);
444+
statusRef.value.acceptParams(currentInfo.value, baseInfo.value);
447445
};
448446
449447
const onLoadCurrentInfo = async (scope: string) => {

‎frontend/src/views/home/status/index.vue‎

Lines changed: 37 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -112,7 +112,7 @@
112112
<span class="input-help">{{ loadStatus(currentInfo.loadUsagePercent) }}</span>
113113
</el-col>
114114
<template v-for="(item, index) of currentInfo.diskData" :key="index">
115-
<el-col :xs="12" :sm="12" :md="6" :lg="6" :xl="6" align="center" v-if="showMore || index < 4">
115+
<el-col :xs="12" :sm="12" :md="6" :lg="6" :xl="6" align="center" v-if="isShow('disk', index)">
116116
<el-popover placement="bottom" :width="300" trigger="hover" v-if="chartsOption[`disk${index}`]">
117117
<el-row :gutter="5">
118118
<el-tag style="font-weight: 500">{{ $t('home.baseInfo') }}:</el-tag>
@@ -165,15 +165,7 @@
165165
</el-col>
166166
</template>
167167
<template v-for="(item, index) of currentInfo.gpuData" :key="index">
168-
<el-col
169-
:xs="12"
170-
:sm="12"
171-
:md="6"
172-
:lg="6"
173-
:xl="6"
174-
align="center"
175-
v-if="showMore || index < 4 - currentInfo.diskData.length"
176-
>
168+
<el-col :xs="12" :sm="12" :md="6" :lg="6" :xl="6" align="center" v-if="isShow('gpu', index)">
177169
<el-popover placement="bottom" :width="250" trigger="hover" v-if="chartsOption[`gpu${index}`]">
178170
<el-row :gutter="5">
179171
<el-tag style="font-weight: 500">{{ $t('home.baseInfo') }}:</el-tag>
@@ -218,16 +210,8 @@
218210
</el-col>
219211
</template>
220212
<template v-for="(item, index) of currentInfo.xpuData" :key="index">
221-
<el-col
222-
:xs="12"
223-
:sm="12"
224-
:md="6"
225-
:lg="6"
226-
:xl="6"
227-
align="center"
228-
v-if="showMore || index < 4 - currentInfo.diskData.length"
229-
>
230-
<el-popover placement="bottom" :width="250" trigger="hover" v-if="chartsOption[`gpu${index}`]">
213+
<el-col :xs="12" :sm="12" :md="6" :lg="6" :xl="6" align="center" v-if="isShow('xpu', index)">
214+
<el-popover placement="bottom" :width="250" trigger="hover" v-if="chartsOption[`xpu${index}`]">
231215
<el-row :gutter="5">
232216
<el-tag style="font-weight: 500">{{ $t('home.baseInfo') }}:</el-tag>
233217
</el-row>
@@ -249,10 +233,10 @@
249233
<v-charts
250234
@click="goGPU()"
251235
height="160px"
252-
:id="`gpu${index}`"
236+
:id="`xpu${index}`"
253237
type="pie"
254-
:option="chartsOption[`gpu${index}`]"
255-
v-if="chartsOption[`gpu${index}`]"
238+
:option="chartsOption[`xpu${index}`]"
239+
v-if="chartsOption[`xpu${index}`]"
256240
/>
257241
</template>
258242
</el-popover>
@@ -262,18 +246,12 @@
262246
<span class="input-help" v-else>{{ item.deviceName }}</span>
263247
</el-col>
264248
</template>
265-
<el-col :xs="12" :sm="12" :md="6" :lg="6" :xl="6" align="center">
266-
<el-button v-if="!showMore" link type="primary" @click="showMore = true" class="buttonClass">
249+
<el-col :xs="12" :sm="12" :md="6" :lg="6" :xl="6" align="center" v-if="totalCount > 5">
250+
<el-button v-if="!showMore" link type="primary" @click="changeShowMore(true)" class="buttonClass">
267251
{{ $t('tabs.more') }}
268252
<el-icon><Bottom /></el-icon>
269253
</el-button>
270-
<el-button
271-
v-if="showMore && currentInfo.diskData.length > 5"
272-
type="primary"
273-
link
274-
@click="showMore = false"
275-
class="buttonClass"
276-
>
254+
<el-button v-if="showMore" type="primary" link @click="changeShowMore(false)" class="buttonClass">
277255
{{ $t('tabs.hide') }}
278256
<el-icon><Top /></el-icon>
279257
</el-button>
@@ -288,6 +266,7 @@ import router from '@/routers';
288266
import i18n from '@/lang';
289267
import { nextTick, ref } from 'vue';
290268
const showMore = ref(false);
269+
const totalCount = ref();
291270
292271
const baseInfo = ref<Dashboard.BaseInfo>({
293272
websiteNumber: 0,
@@ -355,7 +334,7 @@ const cpuShowAll = ref();
355334
356335
const chartsOption = ref({ cpu: null, memory: null, load: null });
357336
358-
const acceptParams = (current: Dashboard.CurrentInfo, base: Dashboard.BaseInfo, isInit: boolean): void => {
337+
const acceptParams = (current: Dashboard.CurrentInfo, base: Dashboard.BaseInfo): void => {
359338
currentInfo.value = current;
360339
baseInfo.value = base;
361340
chartsOption.value['cpu'] = {
@@ -389,14 +368,15 @@ const acceptParams = (current: Dashboard.CurrentInfo, base: Dashboard.BaseInfo,
389368
}
390369
currentInfo.value.xpuData = currentInfo.value.xpuData || [];
391370
for (let i = 0; i < currentInfo.value.xpuData.length; i++) {
392-
chartsOption.value['gpu' + i] = {
393-
title: 'GPU-' + currentInfo.value.xpuData[i].deviceID,
371+
chartsOption.value['xpu' + i] = {
372+
title: 'XPU-' + currentInfo.value.xpuData[i].deviceID,
394373
data: formatNumber(Number(currentInfo.value.xpuData[i].memoryUtil.replaceAll('%', ''))),
395374
};
396375
}
397-
if (currentInfo.value.diskData.length + currentInfo.value.gpuData.length > 5) {
398-
showMore.value = isInit ? false : showMore.value || false;
399-
}
376+
377+
totalCount.value =
378+
currentInfo.value.diskData.length + currentInfo.value.gpuData.length + currentInfo.value.xpuData.length;
379+
showMore.value = localStorage.getItem('dashboard_show') === 'more';
400380
});
401381
};
402382
@@ -413,10 +393,29 @@ function loadStatus(val: number) {
413393
return i18n.global.t('home.runJam');
414394
}
415395
396+
const isShow = (val: string, index: number) => {
397+
let showCount = totalCount.value < 6 ? 5 : 4;
398+
switch (val) {
399+
case 'disk':
400+
return showMore.value || index < showCount;
401+
case 'gpu':
402+
let gpuCount = showCount - currentInfo.value.diskData.length;
403+
return showMore.value || index < gpuCount;
404+
case 'xpu':
405+
let xpuCount = showCount - currentInfo.value.diskData.length - currentInfo.value.gpuData.length;
406+
return showMore.value || index < xpuCount;
407+
}
408+
};
409+
416410
const goGPU = () => {
417411
router.push({ name: 'GPU' });
418412
};
419413
414+
const changeShowMore = (show: boolean) => {
415+
showMore.value = show;
416+
localStorage.setItem('dashboard_show', show ? 'more' : 'hide');
417+
};
418+
420419
const loadWidth = () => {
421420
if (!cpuShowAll.value || currentInfo.value.cpuPercent.length < 32) {
422421
return 310;

0 commit comments

Comments
 (0)