tool.xpcool.com/src/i18n/helpers.ts
夏犀麟 af233e1628
All checks were successful
Build and Deploy (tool.xpcool.com) / build-and-deploy (push) Successful in 1m6s
feat: 视觉重设计 + 中英日韩四语言 + 三态昼夜主题 + 服务端接口对接
视觉体系(核心是「令牌 → TDesign 桥接」)
- 新增 tokens.scss:--tk-* 设计令牌(青玉 Jade 单一强调色、冷调中性色阶、
  圆角/间距/字号/z-index/动效规范、按语言切换字体栈)
- 新增 tdesign-theme.scss:--tk-* → --td-* 桥接(含完整冷调灰阶 1-14)
  → 60+ 个未改动的存量工具页零成本继承新配色与圆角
- index.scss 重写:只过渡颜色、统一 focus-visible、reduced-motion 降级
- 新增 v-reveal 滚动进入指令

布局与交互
- MainLayout 重写:毛玻璃 sticky 顶栏 + 三区布局 + 页脚(含备案号)
- 新增 CommandPalette(⌘K/Ctrl+K)、LocaleSwitch(显示语言代码不用国旗)、
  ThemeSwitch(三态;图标显示生效 mode、菜单勾选用户偏好 preference)
- SideNav 重写:内联筛选、可折叠分组持久化、活动态指示条、需联网标记
- HomeView 重写:左对齐 Hero + 真实可用搜索 + 概览数字条 + 服务端工具专区

国际化与主题
- vue-i18n 11 + zh-CN/en-US/ja-JP/ko-KR 完整语言包(58 个工具名与描述全译)
- helpers 取词带中文兜底;index.html 防闪烁内联脚本与 store 三处同步
- 主题三态 light/dark/auto,preference 与 mode 分离

服务端对接(service.xpcool.com /api/service/open/tools/*)
- 新增 openTools.ts:接口元数据与调用函数共用同一份路径定义
- 改造/新建 6 页:ip-info、uuid、hash(服务端 MD5 两端口径对比)、
  timestamp(服务端时钟 + 时钟偏移)、random-string、api-status
- 均为「本机 / 服务端」双模式,默认本机、不自动打网络请求
- 后端未实现的 5 个接口用 BackendPending 如实标注,不伪装可用

修复
- 空分类渲染缺陷(health/study/travel 无工具却渲染空区块),分类 9 → 6
- UnoCSS panel 快捷类补内边距;IpInfoView 漏 onBeforeUnmount;
  SideNav 末尾 import;HomeView 错误导入 SUPPORTED_LOCALES

其他
- 新增 src/config.ts 集中站点常量,页脚展示备案号并链工信部核验
- docs/api-contract.md 按线上实际重写;PROJECT_STATE.md 全面更新
- 构建通过:vue-tsc --noEmit + vite build
2026-09-14 02:05:38 +08:00

51 lines
1.9 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import { i18n } from './index'
/**
* 工具注册表router/tools.ts的国际化取词助手。
*
* 设计取舍:中文名称与描述仍以 tools.ts 为「唯一数据源」保留在注册表里,
* 语言包只负责提供其它语言的翻译。取值时先查语言包,查不到就回退注册表原文,
* 这样即使某个工具忘了补翻译,页面也不会显示成空的 key。
*
* 这些函数直接使用 i18n.global因此在 setup 之外(如路由守卫、工具函数)也能调用;
* 在组件的模板或 computed 中调用同样具备响应式能力t 内部会读取 locale
*/
function translateOr(key: string, fallback: string): string {
if (i18n.global.te(key)) {
const value = i18n.global.t(key)
// t() 在 key 存在但值为空字符串时也会返回空串,这里一并用兜底值覆盖
if (value) return value
}
return fallback
}
/** 取工具名称(已翻译;缺失时回退注册表中文名) */
export function toolName(path: string, fallback: string): string {
return translateOr(`tool.${path}.name`, fallback)
}
/** 取工具描述(已翻译;缺失时回退注册表中文描述) */
export function toolDesc(path: string, fallback: string): string {
return translateOr(`tool.${path}.desc`, fallback)
}
/** 取分类名称 */
export function categoryLabel(key: string, fallback: string): string {
return translateOr(`category.${key}.label`, fallback)
}
/** 取分类描述 */
export function categoryDesc(key: string, fallback: string): string {
return translateOr(`category.${key}.desc`, fallback)
}
/** 通用取词(带兜底值) */
export function tOr(key: string, fallback: string): string {
return translateOr(key, fallback)
}
/** 通用取词(带命名参数) */
export function tArgs(key: string, args: Record<string, unknown>): string {
return i18n.global.t(key, args)
}