Skip to content

fix(ui): translate aria-label attributes and repair the search-clear tooltips #167

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
argszero merged 1 commit into from
Sep 11, 2026
Merged

fix(ui): translate aria-label attributes and repair the search-clear tooltips #167

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
28 changes: 14 additions & 14 deletions ui/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,13 +5,13 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>AITokenPool</title>
<link rel="icon" type="image/svg+xml" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop offset='0' stop-color='%234ecdc4'/%3E%3Cstop offset='1' stop-color='%232a9d8f'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect width='64' height='64' rx='14' fill='url(%23g)'/%3E%3Ctext x='32' y='43' font-family='-apple-system,Segoe UI,Arial,sans-serif' font-size='30' font-weight='800' text-anchor='middle' fill='%23062021'%3EAT%3C/text%3E%3C/svg%3E">
<link rel="stylesheet" href="css/style.css?v=20260911-11">
<link rel="stylesheet" href="css/style.css?v=20260911-12">
</head>
<body>

<!-- ======================= 登录页（rant 2026-09-11T16:23:43：左右分栏 + 品牌叙事 + 端点卡片） ======================= -->
<div id="login-view" class="login-view">
<button type="button" class="icon-btn login-theme" id="login-theme-toggle" data-i18n-title="theme.toggle.title" title="切换亮色 / 深色主题" aria-label="切换主题">
<button type="button" class="icon-btn login-theme" id="login-theme-toggle" data-i18n-label="theme.toggle.title" data-i18n-title="theme.toggle.title" title="切换亮色 / 深色主题" aria-label="切换主题">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" class="ico-sun" aria-hidden="true"><circle cx="12" cy="12" r="4"/><path d="M12 2v2M12 20v2M4.9 4.9l1.4 1.4M17.7 17.7l1.4 1.4M2 12h2M20 12h2M4.9 19.1l1.4-1.4M17.7 6.3l1.4-1.4"/></svg>
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" class="ico-moon" aria-hidden="true"><path d="M21 12.8A9 9 0 1 1 11.2 3a7 7 0 0 0 9.8 9.8z"/></svg>
</button>
Expand Down Expand Up @@ -154,7 +154,7 @@ <h2 id="auth-title" data-i18n="login.title">进入平台</h2>
<strong id="side-name"></strong>
<span><span data-i18n="common.balance">点数余额</span> <b id="side-balance">0</b></span>
</div>
<button type="button" class="theme-toggle" id="theme-toggle" data-i18n-title="theme.toggle.title" title="切换亮色 / 深色主题" aria-label="切换主题">
<button type="button" class="theme-toggle" id="theme-toggle" data-i18n-label="theme.toggle.title" data-i18n-title="theme.toggle.title" title="切换亮色 / 深色主题" aria-label="切换主题">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" class="ico-sun" aria-hidden="true"><circle cx="12" cy="12" r="4"/><path d="M12 2v2M12 20v2M4.9 4.9l1.4 1.4M17.7 17.7l1.4 1.4M2 12h2M20 12h2M4.9 19.1l1.4-1.4M17.7 6.3l1.4-1.4"/></svg>
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" class="ico-moon" aria-hidden="true"><path d="M21 12.8A9 9 0 1 1 11.2 3a7 7 0 0 0 9.8 9.8z"/></svg>
</button>
Expand Down Expand Up @@ -220,7 +220,7 @@ <h2 data-i18n="view.marketplace">模型市场</h2>
<div class="toolbar">
<span class="search">
<input id="mk-search" class="input" data-i18n-ph="mk.search.ph" placeholder="搜索模型名 / 厂商…">
<button type="button" class="search-clear" hidden aria-label="清空搜索" data-i18n-title="mk.clear" title="清空搜索">×</button>
<button type="button" class="search-clear" hidden data-i18n-label="mk.clear" aria-label="清空搜索" data-i18n-title="mk.clear" title="清空搜索">×</button>
</span>
<select id="mk-provider" class="input">
<option value="" data-i18n="mk.provider.all">全部厂商</option>
Expand Down Expand Up @@ -512,7 +512,7 @@ <h3 data-i18n="settings.apikey">API Key</h3>
</div>
<span class="search" style="display:block;margin-bottom:10px">
<input id="ak-search" class="input" data-i18n-ph="settings.ak.search.ph" placeholder="搜索 key 名字…">
<button type="button" class="search-clear" hidden aria-label="清空搜索" data-i18n-title="common.search" title="清空搜索">×</button>
<button type="button" class="search-clear" hidden data-i18n-label="mk.clear" aria-label="清空搜索" data-i18n-title="mk.clear" title="清空搜索">×</button>
</span>
<div class="table-wrap compact">
<table class="table">
Expand Down Expand Up @@ -593,7 +593,7 @@ <h3 data-i18n="admin.emp.list">成员列表</h3>
</div>
<span class="search">
<input id="emp-search" class="input" data-i18n-ph="admin.emp.search.ph" placeholder="搜索成员 / 部门…">
<button type="button" class="search-clear" hidden aria-label="清空搜索" title="清空搜索">×</button>
<button type="button" class="search-clear" hidden data-i18n-label="mk.clear" aria-label="清空搜索" data-i18n-title="mk.clear" title="清空搜索">×</button>
</span>
</div>
<div class="table-wrap compact">
Expand Down Expand Up @@ -632,7 +632,7 @@ <h3 data-i18n="admin.usage.byDept">按部门用量</h3>
<div class="toolbar">
<span class="search">
<input id="od-search" class="input" data-i18n-ph="admin.org.search.ph" placeholder="搜索部门…">
<button type="button" class="search-clear" hidden aria-label="清空搜索" title="清空搜索">×</button>
<button type="button" class="search-clear" hidden data-i18n-label="mk.clear" aria-label="清空搜索" data-i18n-title="mk.clear" title="清空搜索">×</button>
</span>
<span class="grow"></span>
<button class="btn btn-primary btn-sm" id="add-dept-btn" data-i18n="admin.org.add">添加部门</button>
Expand Down Expand Up @@ -670,7 +670,7 @@ <h3 id="dept-form-title">添加部门</h3>
<div class="toolbar">
<span class="search">
<input id="model-search" class="input" data-i18n-ph="admin.models.search.ph" placeholder="搜索模型…">
<button type="button" class="search-clear" hidden aria-label="清空搜索" title="清空搜索">×</button>
<button type="button" class="search-clear" hidden data-i18n-label="mk.clear" aria-label="清空搜索" data-i18n-title="mk.clear" title="清空搜索">×</button>
</span>
<span class="grow"></span>
<button class="btn btn-primary btn-sm" id="add-model-btn" data-i18n="admin.models.add">添加模型</button>
Expand Down Expand Up @@ -782,7 +782,7 @@ <h3 data-i18n="ops.users.title">用户充值</h3>
</div>
<span class="search">
<input id="ops-search" class="input" data-i18n-ph="ops.users.search.ph" placeholder="搜索用户名 / 邮箱…">
<button type="button" class="search-clear" hidden aria-label="清空搜索" title="清空搜索">×</button>
<button type="button" class="search-clear" hidden data-i18n-label="mk.clear" aria-label="清空搜索" data-i18n-title="mk.clear" title="清空搜索">×</button>
</span>
</div>
<div class="table-wrap compact">
Expand All @@ -799,7 +799,7 @@ <h3 data-i18n="ops.users.title">用户充值</h3>
</div>

<!-- 快捷键帮助面板（rant 20:39:30 E：行内卡片，非 modal；? / Shift+/ 开合，Esc 关闭） -->
<div id="help-panel" class="help-panel hidden" role="dialog" aria-label="快捷键帮助">
<div id="help-panel" class="help-panel hidden" role="dialog" data-i18n-label="help.title" aria-label="快捷键帮助">
<div class="help-head">
<strong data-i18n="help.title">快捷键</strong>
<button type="button" class="help-close" id="help-close" data-i18n-title="help.close.title" title="关闭（Esc）">×</button>
Expand Down Expand Up @@ -842,9 +842,9 @@ <h3 id="chat-title">使用模型</h3>
</div>
</div>

<script src="js/api.js?v=20260911-11"></script>
<script src="js/data.js?v=20260911-11"></script>
<script src="js/i18n.js?v=20260911-11"></script>
<script src="js/app.js?v=20260911-11"></script>
<script src="js/api.js?v=20260911-12"></script>
<script src="js/data.js?v=20260911-12"></script>
<script src="js/i18n.js?v=20260911-12"></script>
<script src="js/app.js?v=20260911-12"></script>
</body>
</html>
10 changes: 9 additions & 1 deletion ui/js/i18n.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1718,7 +1718,8 @@
return best === -1 ? msg : t(ERR_MAP[best][1]);
}

// 静态文案批量替换：[data-i18n] 文本 + [data-i18n-ph] placeholder + [data-i18n-title] title
// 静态文案批量替换：[data-i18n] 文本 + [data-i18n-ph] placeholder
// + [data-i18n-title] title + [data-i18n-label] aria-label
function applyStatic() {
var i, els, key;
els = document.querySelectorAll("[data-i18n]");
Expand All @@ -1736,6 +1737,13 @@
key = els[i].getAttribute("data-i18n-title");
if (key && ZH[key]) els[i].setAttribute("title", t(key));
}
// aria-label 是无障碍名的主来源（优先级高于 title），必须与 title 同步语言，
// 否则英文模式下屏幕阅读器读到的仍是中文
els = document.querySelectorAll("[data-i18n-label]");
for (i = 0; i < els.length; i++) {
key = els[i].getAttribute("data-i18n-label");
if (key && ZH[key]) els[i].setAttribute("aria-label", t(key));
}
if (document.documentElement) document.documentElement.setAttribute("lang", current === "en" ? "en" : "zh-CN");
}

Expand Down
Loading