feat(about): 优化评论区多语言支持和UI显示

- 提取语言判断逻辑到常量 isZh,提升代码可读性
- 统一使用 isZh 判断替换原有的 lang === 'zh' 条件表达式
- 移除CSS中冗余的发送按钮文字定义,改由JS统一控制
- 完善时间显示
This commit is contained in:
hehh
2025-11-25 14:16:08 +08:00
parent f2644b4fe6
commit 26e8e68b4e
2 changed files with 17 additions and 24 deletions

View File

@@ -124,14 +124,6 @@
transform: translateY(0) !important; transform: translateY(0) !important;
} }
.atk-send-btn:before {
content: "发送" !important;
}
[data-lang="en"] .atk-send-btn:before {
content: "Send" !important;
}
.atk-list-header { .atk-list-header {
padding: 20px !important; padding: 20px !important;
border-bottom: 1px solid rgba(128, 128, 128, 0.15) !important; border-bottom: 1px solid rgba(128, 128, 128, 0.15) !important;

View File

@@ -529,8 +529,9 @@ class UIManager {
const isHttps = location.protocol === 'https:'; const isHttps = location.protocol === 'https:';
const isLocal = !!(window.SiteConfig?.dev?.isLocal); const isLocal = !!(window.SiteConfig?.dev?.isLocal);
const lang = getStoredLanguage(); const lang = getStoredLanguage();
const isZh = lang === 'zh';
if (!isHttps || isLocal) { if (!isHttps || isLocal) {
const msg = lang === 'zh' ? '当前评论区已关闭' : 'Comments are closed'; const msg = isZh ? '当前评论区已关闭' : 'Comments are closed';
$('#artalk-container').html(`<div style="text-align:center;color:#999;padding:20px;">${msg}</div>`); $('#artalk-container').html(`<div style="text-align:center;color:#999;padding:20px;">${msg}</div>`);
return; return;
} }
@@ -543,7 +544,13 @@ class UIManager {
server: window.SiteConfig.artalk.server, server: window.SiteConfig.artalk.server,
site: window.SiteConfig.artalk.site, site: window.SiteConfig.artalk.site,
// 多语言支持 // 多语言支持
locale: lang === 'zh' ? 'zh-CN' : 'en-US', locale: isZh ? 'zh-CN' : 'en-US',
// 自定义占位符(支持多语言)
placeholder: isZh ? '说点什么吧...支持 Markdown 语法,可 @用户、发送表情' : 'Leave a comment... Supports Markdown, @mentions, and Send 😊',
// 发送按钮文字(多语言)
sendBtn: isZh ? '发送' : 'Send',
loginBtn: isZh ? '发送' : 'Send',
// 主题支持 // 主题支持
darkMode: document.documentElement.getAttribute('data-theme') === 'night', darkMode: document.documentElement.getAttribute('data-theme') === 'night',
@@ -553,12 +560,6 @@ class UIManager {
// 启用 Markdown // 启用 Markdown
markdown: true, markdown: true,
// 自定义占位符(支持多语言)
placeholder: lang === 'zh' ? '说点什么吧...支持 Markdown 语法,可 @用户、发送表情' : 'Leave a comment... Supports Markdown, @mentions, and Send 😊',
// 发送按钮文字(多语言)
sendBtn: lang === 'zh' ? '发送' : 'Send',
// 表情面板 // 表情面板
emoji: { emoji: {
// 使用默认表情包 // 使用默认表情包
@@ -591,21 +592,21 @@ class UIManager {
const now = new Date(); const now = new Date();
const diffSec = Math.floor((now - date) / 1000); const diffSec = Math.floor((now - date) / 1000);
if (diffSec < 60) return lang === 'zh' ? '刚刚' : 'Just now'; if (diffSec < 60) return isZh ? '刚刚' : 'Just now';
if (diffSec < 3600) return lang === 'zh' ? `${Math.floor(diffSec / 60)}分钟前` : `${Math.floor(diffSec / 60)} minutes ago`; if (diffSec < 3600) return isZh ? `${Math.floor(diffSec / 60)}分钟前` : `${Math.floor(diffSec / 60)} minutes ago`;
if (diffSec < 86400) return lang === 'zh' ? `${Math.floor(diffSec / 3600)}小时前` : `${Math.floor(diffSec / 3600)} hours ago`; if (diffSec < 86400) return isZh ? `${Math.floor(diffSec / 3600)}小时前` : `${Math.floor(diffSec / 3600)} hours ago`;
const isToday = date.toDateString() === now.toDateString(); const isToday = date.toDateString() === now.toDateString();
if (isToday) return lang === 'zh' ? if (isToday) return isZh ?
`今天 ${date.getHours().toString().padStart(2, '0')}:${date.getMinutes().toString().padStart(2, '0')}` : `今天 ${date.getHours().toString().padStart(2, '0')}:${date.getMinutes().toString().padStart(2, '0')}` :
`Today ${date.getHours().toString().padStart(2, '0')}:${date.getMinutes().toString().padStart(2, '0')}`; `Today ${date.getHours().toString().padStart(2, '0')}:${date.getMinutes().toString().padStart(2, '0')}`;
const isYesterday = new Date(now - 86400000).toDateString() === date.toDateString(); const isYesterday = new Date(now - 86400000).toDateString() === date.toDateString();
if (isYesterday) return lang === 'zh' ? if (isYesterday) return isZh ?
`昨天 ${date.getHours().toString().padStart(2, '0')}:${date.getMinutes().toString().padStart(2, '0')}` : `昨天 ${date.getHours().toString().padStart(2, '0')}:${date.getMinutes().toString().padStart(2, '0')}` :
`Yesterday ${date.getHours().toString().padStart(2, '0')}:${date.getMinutes().toString().padStart(2, '0')}`; `Yesterday ${date.getHours().toString().padStart(2, '0')}:${date.getMinutes().toString().padStart(2, '0')}`;
return date.toLocaleString(lang === 'zh' ? 'zh-CN' : 'en-US', { return date.toLocaleString(isZh ? 'zh-CN' : 'en-US', {
year: 'numeric', year: 'numeric',
month: '2-digit', month: '2-digit',
day: '2-digit', day: '2-digit',
@@ -630,11 +631,11 @@ class UIManager {
this.enhanceArtalkUI(); this.enhanceArtalkUI();
} catch (e) { } catch (e) {
console.error("Artalk Error", e); console.error("Artalk Error", e);
const msg = lang === 'zh' ? '当前评论区已关闭' : 'Comments are closed'; const msg = isZh ? '当前评论区已关闭' : 'Comments are closed';
$('#artalk-container').html(`<div style="text-align:center;color:#999;padding:20px;">${msg}</div>`); $('#artalk-container').html(`<div style="text-align:center;color:#999;padding:20px;">${msg}</div>`);
} }
} else { } else {
const msg = lang === 'zh' ? '当前评论区已关闭' : 'Comments are closed'; const msg = isZh ? '当前评论区已关闭' : 'Comments are closed';
$('#artalk-container').html(`<div style="text-align:center;color:#999;padding:20px;">${msg}</div>`); $('#artalk-container').html(`<div style="text-align:center;color:#999;padding:20px;">${msg}</div>`);
} }
} }