fix: fix dashboard running time calculation (#13187)

agent/app/dto/dashboard.go

@@ -79,8 +79,9 @@ type NodeCurrent struct {
 }
 
 type DashboardCurrent struct {
-	Uptime          uint64 `json:"uptime"`
-	TimeSinceUptime string `json:"timeSinceUptime"`
+	Uptime          uint64      `json:"uptime"`
+	TimeSinceUptime string      `json:"timeSinceUptime"`
+	RunningTime     RunningTime `json:"runningTime"`
 
 	Procs uint64 `json:"procs"`
 
@@ -128,6 +129,13 @@ type DashboardCurrent struct {
 	ShotTime time.Time `json:"shotTime"`
 }
 
+type RunningTime struct {
+	Days    uint64 `json:"days"`
+	Hours   uint64 `json:"hours"`
+	Minutes uint64 `json:"minutes"`
+	Seconds uint64 `json:"seconds"`
+}
+
 type AppLauncherSync struct {
 	Keys []string `json:"keys"`
 }

agent/app/service/dashboard.go

@@ -187,6 +187,7 @@ func (u *DashboardService) LoadCurrentInfo(ioOption string, netOption string) *d
 	hostInfo, _ := psutil.HOST.GetHostInfo(false)
 	currentInfo.Uptime = hostInfo.Uptime
 	currentInfo.TimeSinceUptime = time.Unix(int64(hostInfo.BootTime), 0).Format(constant.DateTimeLayout)
+	currentInfo.RunningTime = loadRunningTime(hostInfo.Uptime)
 	currentInfo.Procs = hostInfo.Procs
 	currentInfo.CPUTotal, _ = psutil.CPUInfo.GetLogicalCores(false)
 
@@ -267,6 +268,15 @@ func (u *DashboardService) LoadCurrentInfo(ioOption string, netOption string) *d
 	return &currentInfo
 }
 
+func loadRunningTime(uptime uint64) dto.RunningTime {
+	return dto.RunningTime{
+		Days:    uptime / 86400,
+		Hours:   (uptime % 86400) / 3600,
+		Minutes: (uptime % 3600) / 60,
+		Seconds: uptime % 60,
+	}
+}
+
 func (u *DashboardService) LoadTopCPU() []dto.Process {
 	return loadTopCPU()
 }

frontend/src/api/interface/dashboard.ts

@@ -70,6 +70,7 @@ export namespace Dashboard {
     export interface CurrentInfo {
         uptime: number;
         timeSinceUptime: string;
+        runningTime: RunningTime;
         procs: number;
 
         load1: number;
@@ -114,6 +115,12 @@ export namespace Dashboard {
 
         shotTime: Date;
     }
+    export interface RunningTime {
+        days: number;
+        hours: number;
+        minutes: number;
+        seconds: number;
+    }
     export interface Process {
         name: string;
         pid: number;

frontend/src/utils/date.ts

@@ -1,50 +1,50 @@
 import i18n from '@/lang';
 
-export function loadUpTime(timeSince: string) {
-    if (!timeSince) {
+interface RunningTime {
+    days: number;
+    hours: number;
+    minutes: number;
+    seconds: number;
+}
+
+const formatDurationUnit = (value: number, unit: string) => `${value}${i18n.global.t(unit, value)}`;
+
+export function formatUptime(runningTime?: RunningTime) {
+    if (!runningTime) {
         return '';
     }
-    const targetTime = new Date(timeSince);
-    const currentTime = new Date();
-    const uptime = (currentTime.getTime() - targetTime.getTime()) / 1000;
-    if (uptime <= 0) {
+    const { days, hours, minutes, seconds } = runningTime;
+    if (days <= 0 && hours <= 0 && minutes <= 0 && seconds <= 0) {
         return '';
     }
-    let days = Math.floor(uptime / 86400);
-    let hours = Math.floor((uptime % 86400) / 3600);
-    let minutes = Math.floor((uptime % 3600) / 60);
-    let seconds = Math.floor(uptime % 60);
     if (days !== 0) {
         return (
-            days +
-            i18n.global.t('commons.units.day') +
+            formatDurationUnit(days, 'commons.units.day') +
             ' ' +
-            hours +
-            i18n.global.t('commons.units.hour') +
+            formatDurationUnit(hours, 'commons.units.hour') +
             ' ' +
-            minutes +
-            i18n.global.t('commons.units.minute') +
+            formatDurationUnit(minutes, 'commons.units.minute') +
             ' ' +
-            seconds +
-            i18n.global.t('commons.units.second')
+            formatDurationUnit(seconds, 'commons.units.second')
         );
     }
     if (hours !== 0) {
         return (
-            hours +
-            i18n.global.t('commons.units.hour') +
+            formatDurationUnit(hours, 'commons.units.hour') +
             ' ' +
-            minutes +
-            i18n.global.t('commons.units.minute') +
+            formatDurationUnit(minutes, 'commons.units.minute') +
             ' ' +
-            seconds +
-            i18n.global.t('commons.units.second')
+            formatDurationUnit(seconds, 'commons.units.second')
         );
     }
     if (minutes !== 0) {
-        return minutes + i18n.global.t('commons.units.minute') + ' ' + seconds + i18n.global.t('commons.units.second');
+        return (
+            formatDurationUnit(minutes, 'commons.units.minute') +
+            ' ' +
+            formatDurationUnit(seconds, 'commons.units.second')
+        );
     }
-    return seconds + i18n.global.t('commons.units.second');
+    return formatDurationUnit(seconds, 'commons.units.second');
 }
 
 export function getCurrentDateFormatted() {

frontend/src/views/home/index.vue

@@ -321,7 +321,7 @@
                                             <template #label>
                                                 <span class="system-label">{{ $t('home.runningTime') }}</span>
                                             </template>
-                                            {{ loadUpTime(currentInfo.timeSinceUptime) }}
+                                            {{ formatUptime(currentInfo.runningTime) }}
                                         </el-descriptions-item>
                                     </el-descriptions>
                                 </el-scrollbar>
@@ -448,7 +448,7 @@ import CardWithHeader from '@/components/card-with-header/index.vue';
 import MarkDownEditor from '@/components/mkdown-editor/index.vue';
 import i18n from '@/lang';
 import { Dashboard } from '@/api/interface/dashboard';
-import { dateFormatForSecond, loadUpTime } from '@/utils/date';
+import { dateFormatForSecond, formatUptime } from '@/utils/date';
 import { computeSize, computeSizeFromKBs } from '@/utils/size';
 import { jumpToPath } from '@/utils/router';
 import { copyText } from '@/utils/clipboard';
@@ -625,6 +625,12 @@ const baseInfo = ref<Dashboard.BaseInfo>({
 const currentInfo = ref<Dashboard.CurrentInfo>({
     uptime: 0,
     timeSinceUptime: '',
+    runningTime: {
+        days: 0,
+        hours: 0,
+        minutes: 0,
+        seconds: 0,
+    },
     procs: 0,
 
     load1: 0,
@@ -848,6 +854,7 @@ const onLoadCurrentInfo = async () => {
     }
 
     currentInfo.value.timeSinceUptime = res.data.timeSinceUptime;
+    currentInfo.value.runningTime = res.data.runningTime;
 
     let timeInterval = Number(res.data.uptime - currentInfo.value.uptime) || 3;
     currentChartInfo.netBytesSent =
@@ -936,7 +943,7 @@ const handleCopy = () => {
         '\n' +
         i18n.global.t('home.runningTime') +
         ': ' +
-        loadUpTime(currentInfo.value.timeSinceUptime) +
+        formatUptime(currentInfo.value.runningTime) +
         '\n';
     copyText(content);
 };

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

@@ -423,6 +423,12 @@ const baseInfo = ref<Dashboard.BaseInfo>({
 const currentInfo = ref<Dashboard.CurrentInfo>({
     uptime: 0,
     timeSinceUptime: '',
+    runningTime: {
+        days: 0,
+        hours: 0,
+        minutes: 0,
+        seconds: 0,
+    },
     procs: 0,
 
     load1: 0,