From 787c82d30c40fa411aabd853fe0a1910998bb11b Mon Sep 17 00:00:00 2001 From: gaoxq <376340421@qq.com> Date: Tue, 31 Mar 2026 17:13:39 +0800 Subject: [PATCH] =?UTF-8?q?=E9=A1=B9=E7=9B=AE=E5=88=9D=E5=A7=8B=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../apps/web/SysAnalysisController.java | 28 ++++---- .../desktop/analysis/components/BizApps.vue | 66 ++++--------------- .../analysis/components/QuickLogin.vue | 41 +++++++----- 3 files changed, 52 insertions(+), 83 deletions(-) diff --git a/web-api/src/main/java/com/jeesite/modules/apps/web/SysAnalysisController.java b/web-api/src/main/java/com/jeesite/modules/apps/web/SysAnalysisController.java index 9c560b8..d138094 100644 --- a/web-api/src/main/java/com/jeesite/modules/apps/web/SysAnalysisController.java +++ b/web-api/src/main/java/com/jeesite/modules/apps/web/SysAnalysisController.java @@ -12,6 +12,7 @@ import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.bind.annotation.ResponseBody; +import java.lang.management.ManagementFactory; import java.util.ArrayList; import java.util.List; import java.util.Map; @@ -29,19 +30,20 @@ public class SysAnalysisController { public List getHostInfo() { List chartInfoList = new ArrayList<>(); CpuInfo cpuInfo = OshiUtil.getCpuInfo(); - String runTime = DateUtil.formatBetween(OshiUtil.getOs().getSystemUptime() * 1000); - // 系统使用率（红色） - chartInfoList.add(new ChartInfo("sys", "系统使用率", cpuInfo.getSys(), KeyUtil.getColor(), runTime)); - // 用户使用率（蓝色） - chartInfoList.add(new ChartInfo("user", "用户使用率", cpuInfo.getUser(), KeyUtil.getColor(), runTime)); - // CPU等待率（橙色） - chartInfoList.add(new ChartInfo("wait", "CPU等待率", cpuInfo.getWait(), KeyUtil.getColor(), runTime)); - // CPU空闲率（绿色） - chartInfoList.add(new ChartInfo("free", "CPU空闲率", cpuInfo.getFree(), KeyUtil.getColor(), runTime)); - // CPU总使用率（粉色） - chartInfoList.add(new ChartInfo("used", "CPU总使用率", cpuInfo.getUsed(), KeyUtil.getColor(), runTime)); - // 系统运行时间（紫色） - chartInfoList.add(new ChartInfo("time", "服务器运行时长", 0, KeyUtil.getColor(), runTime)); + long processUptimeMs = ManagementFactory.getRuntimeMXBean().getUptime(); + String runTime = DateUtil.formatBetween(processUptimeMs); + // 系统使用率 + chartInfoList.add(new ChartInfo("sys", "系统使用率", cpuInfo.getSys(), KeyUtil.getColor(), "")); + // 用户使用率 + chartInfoList.add(new ChartInfo("user", "用户使用率", cpuInfo.getUser(), KeyUtil.getColor(), "")); + // CPU等待率 + chartInfoList.add(new ChartInfo("wait", "CPU等待率", cpuInfo.getWait(), KeyUtil.getColor(), "")); + // CPU空闲率 + chartInfoList.add(new ChartInfo("free", "CPU空闲率", cpuInfo.getFree(), KeyUtil.getColor(), "")); + // CPU总使用率 + chartInfoList.add(new ChartInfo("used", "CPU总使用率", cpuInfo.getUsed(), KeyUtil.getColor(), "")); + // 系统运行时间 + chartInfoList.add(new ChartInfo("time", "系统运行时长", processUptimeMs, KeyUtil.getColor(), runTime)); return chartInfoList; } diff --git a/web-vue/packages/core/layouts/views/desktop/analysis/components/BizApps.vue b/web-vue/packages/core/layouts/views/desktop/analysis/components/BizApps.vue index 5f2686a..90f45dc 100644 --- a/web-vue/packages/core/layouts/views/desktop/analysis/components/BizApps.vue +++ b/web-vue/packages/core/layouts/views/desktop/analysis/components/BizApps.vue @@ -5,11 +5,6 @@
@@ -78,19 +73,22 @@ padding: var(--analysis-card-content-padding, 8px 12px 12px); display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); - grid-template-rows: minmax(0, 1fr); + grid-template-rows: repeat(2, minmax(0, 1fr)); + grid-auto-flow: column; + grid-auto-columns: minmax(0, 1fr); gap: var(--analysis-card-item-gap, 8px); - overflow: hidden; + overflow-x: auto; + overflow-y: hidden; } .biz-apps-item { display: flex; - flex-direction: column; + flex-direction: row; align-items: center; - justify-content: space-between; + justify-content: center; min-width: 0; min-height: 0; - padding: 8px; + padding: 6px 4px; border: 1px solid rgb(226 232 240); border-radius: var(--analysis-card-radius, 10px); background: rgb(255, 255, 255); @@ -108,49 +106,12 @@ box-shadow: 0 12px 28px rgb(96 165 250 / 20%); } - &__main { - display: flex; - flex: 1; - width: 100%; - min-height: 0; - padding: 2px; - overflow: hidden; - border-radius: 8px; - } - - &__pane { - width: 100%; - min-width: 0; - height: 100%; - display: flex; - align-items: center; - justify-content: center; - border-radius: 8px; - background: linear-gradient(135deg, rgb(239 246 255), rgb(224 242 254)); - color: rgb(51 65 85); - font-size: 12px; - line-height: 16px; - box-shadow: 0 8px 24px rgb(148 163 184 / 14%); - margin: 0 auto; - overflow: hidden; - } - - &__icon { - width: 100%; - height: 100%; - object-fit: cover; - border-radius: 8px; - } - &__name { display: flex; align-items: center; justify-content: center; width: 100%; - min-height: 28px; - margin-top: 2px; - padding-top: 4px; - border-top: 1px solid rgb(226 232 240); + min-height: 100%; color: rgb(51 65 85); font-size: 12px; line-height: 16px; @@ -178,13 +139,7 @@ box-shadow: 0 14px 32px rgb(37 99 235 / 22%); } - &__pane { - background: linear-gradient(135deg, rgb(30 41 59), rgb(15 23 42)); - box-shadow: 0 10px 24px rgb(0 0 0 / 24%); - } - &__name { - border-top-color: rgb(51 65 85); color: rgb(226 232 240); } } @@ -194,7 +149,8 @@ .biz-apps-card { .card-content { grid-template-columns: repeat(12, minmax(0, 1fr)); - grid-template-rows: minmax(0, 1fr); + grid-template-rows: repeat(2, minmax(0, 1fr)); + grid-auto-flow: column; } } } diff --git a/web-vue/packages/core/layouts/views/desktop/analysis/components/QuickLogin.vue b/web-vue/packages/core/layouts/views/desktop/analysis/components/QuickLogin.vue index 6d36fd3..d70f4e7 100644 --- a/web-vue/packages/core/layouts/views/desktop/analysis/components/QuickLogin.vue +++ b/web-vue/packages/core/layouts/views/desktop/analysis/components/QuickLogin.vue @@ -225,9 +225,10 @@ flex: 0 0 136px; width: 136px; display: flex; - flex-direction: column; + flex-direction: row; align-items: center; - justify-content: space-between; + justify-content: flex-start; + gap: 8px; min-height: 0; height: 100%; padding: 8px; @@ -247,16 +248,24 @@ box-shadow: 0 12px 28px rgb(96 165 250 / 20%); } + &:hover .quick-login-item__image-wrap { + border-color: rgb(147 197 253); + box-shadow: 0 8px 18px rgb(96 165 250 / 20%); + } + &__image-wrap { display: flex; align-items: center; justify-content: center; - flex: 1; - width: 100%; - min-height: 0; + flex: 0 0 44px; + width: 44px; + height: 44px; + min-height: 44px; overflow: hidden; - padding: 2px; border-radius: 8px; + background: rgb(248 250 252); + border: 1px solid rgb(191 219 254); + box-shadow: 0 6px 14px rgb(96 165 250 / 12%); } &__image { @@ -269,17 +278,14 @@ &__name { display: flex; align-items: center; - justify-content: center; - max-width: 100%; - min-height: 28px; - width: 100%; - margin-top: 2px; - padding-top: 4px; - border-top: 1px solid rgb(226 232 240); + justify-content: flex-start; + flex: 1; + min-width: 0; + min-height: 100%; color: rgb(51 65 85); font-size: 12px; line-height: 16px; - text-align: center; + text-align: left; word-break: break-word; } } @@ -304,9 +310,14 @@ } &__name { - border-top-color: rgb(51 65 85); color: rgb(226 232 240); } + + &__image-wrap { + background: rgb(30 41 59); + border-color: rgb(59 130 246 / 35%); + box-shadow: 0 6px 14px rgb(37 99 235 / 16%); + } } }