From af506608870fc970cea7c81fb67101af7bf00634 Mon Sep 17 00:00:00 2001 From: "Apple\\Apple" Date: Sun, 15 Jun 2025 03:22:23 +0800 Subject: [PATCH] =?UTF-8?q?=F0=9F=8E=A8=20style(dashboard):=20Standardize?= =?UTF-8?q?=20Empty=20component=20visuals=20in=20Detail=20page?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Summary: Refactored the `Detail` page to deliver a more consistent and compact visual experience when displaying empty states. Key changes: 1. Introduced a reusable `ILLUSTRATION_SIZE` constant (96 × 96) to ensure all `IllustrationConstruction` / `IllustrationConstructionDark` icons render at a uniform, reduced size. 2. Applied the new size to every `Empty` component instance within the file. 3. Ensured Empty‐state content (title, description, icon) is centrally aligned for better readability. 4. Updated the Uptime panel’s empty description text for greater clarity. These adjustments improve UI cohesion, reduce visual noise, and make empty messages easier to scan. --- web/src/i18n/locales/en.json | 2 +- web/src/pages/Detail/index.js | 29 +++++++++++++---------------- 2 files changed, 14 insertions(+), 17 deletions(-) diff --git a/web/src/i18n/locales/en.json b/web/src/i18n/locales/en.json index 11bea1e4..ba23ca5c 100644 --- a/web/src/i18n/locales/en.json +++ b/web/src/i18n/locales/en.json @@ -1598,6 +1598,7 @@ "请联系管理员在系统设置中配置API信息": "Please contact the administrator to configure API information in the system settings.", "请联系管理员在系统设置中配置公告信息": "Please contact the administrator to configure notice information in the system settings.", "请联系管理员在系统设置中配置常见问答": "Please contact the administrator to configure FAQ information in the system settings.", + "请联系管理员在系统设置中配置Uptime": "Please contact the administrator to configure Uptime in the system settings.", "确定要删除此API信息吗？": "Are you sure you want to delete this API information?", "测速": "Speed Test", "批量删除": "Batch Delete", @@ -1645,7 +1646,6 @@ "高延迟": "High latency", "维护中": "Maintenance", "暂无监控数据": "No monitoring data", - "请联系管理员在系统设置中配置Uptime": "Please contact the administrator to configure Uptime in the system settings.", "IP记录": "IP Record", "记录请求与错误日志 IP": "Record request and error log IP", "开启后，仅“消费”和“错误”日志将记录您的客户端 IP 地址": "After enabling, only \"consumption\" and \"error\" logs will record your client IP address", diff --git a/web/src/pages/Detail/index.js b/web/src/pages/Detail/index.js index 777924e0..0fd18d16 100644 --- a/web/src/pages/Detail/index.js +++ b/web/src/pages/Detail/index.js @@ -87,6 +87,8 @@ const Detail = (props) => { const ICON_BUTTON_CLASS = "text-white hover:bg-opacity-80 !rounded-full"; const FLEX_CENTER_GAP2 = "flex items-center gap-2"; + const ILLUSTRATION_SIZE = { width: 96, height: 96 }; + // ========== Constants ========== let now = new Date(); const isAdminUser = isAdmin(); @@ -912,10 +914,9 @@ const Detail = (props) => { return (
} - darkModeImage={} + image={} + darkModeImage={} title={t('暂无监控数据')} - style={{ padding: '8px' }} />
); @@ -1202,11 +1203,10 @@ const Detail = (props) => { ) : (
} - darkModeImage={} + image={} + darkModeImage={} title={t('暂无API信息')} description={t('请联系管理员在系统设置中配置API信息')} - style={{ padding: '12px' }} />
)} @@ -1274,11 +1274,10 @@ const Detail = (props) => { ) : (
} - darkModeImage={} + image={} + darkModeImage={} title={t('暂无系统公告')} description={t('请联系管理员在系统设置中配置公告信息')} - style={{ padding: '12px' }} />
)} @@ -1329,11 +1328,10 @@ const Detail = (props) => { ) : (
} - darkModeImage={} + image={} + darkModeImage={} title={t('暂无常见问答')} description={t('请联系管理员在系统设置中配置常见问答')} - style={{ padding: '12px' }} />
)} @@ -1440,11 +1438,10 @@ const Detail = (props) => { ) : (
} - darkModeImage={} + image={} + darkModeImage={} title={t('暂无监控数据')} - description={t('请联系管理员在系统设置中配置Uptime分组')} - style={{ padding: '12px' }} + description={t('请联系管理员在系统设置中配置Uptime')} />
)}