feat: 品牌统一 LokiStack + 全站中英 i18n + 用户批量删除 + 主题定时切换与浅色侧栏

- 品牌: Go 模块/数据文件/二进制/构建部署资产全部 opsx→lokistack;前端 localStorage 命名空间迁移(读旧写新,含按用户 id 前缀迁移);修复 nginx upstream 与 Makefile 引用已改名服务的断裂
- i18n: react-i18next 落地,common + 11 个页面域命名空间全站中英(菜单/顶栏/登录/列表页/表单/确认弹窗/状态徽章);设置页语言即时切换;修复词典自注册导致的循环导入白屏
- 用户管理: 批量删除(POST /users/batch-delete,不删自己/最后管理员,部分失败不阻断)+ 行复选/全选/批量工具条
- 主题: 浅色侧栏(中性灰激活态)、四态模式(浅色/深色/跟随系统/定时切换,按时区判定)、顶栏太阳月亮二态、设置页紧凑分段选择器
- UI: 登录记住用户名、CardActionButton 统一五页卡片操作钮、shadcn Badge 替换手写徽章、语义色修正
- 清理: 移除主机 Web 终端(前后端)、k8s-helm/Helm 遗留代码与字段、README 重写精简
- 修复: 侧栏与日志告警 order 重复、路由标题 i18n key 未翻译、词典双逗号等
This commit is contained in:
opsx committed 2026-10-27 17:11:38 +08:00
1 parent 02d1bd87a7
commit f3733f0bfc
201 files changed
+5438 -2388

No files matched your search

+26 -24
View File
@@ -1,5 +1,6 @@
import { memo, useCallback, useEffect, useRef, useState } from 'react'
import { Monitor, Plus } from 'lucide-react'
import { useTranslation } from 'react-i18next'
import { Button } from '@/components/ui/button'
import { hostApi, deploymentApi, collectorApi } from '@/api'
import { PageContainer } from '@/components/PageContainer'
@@ -11,23 +12,29 @@ import { ConfirmDialog } from '@/components/ConfirmDialog'
import { toast } from 'sonner'
import { useListQuery } from '@/hooks/useListQuery'
import type { Host } from '@/types'
import i18n from '@/i18n'
import zhHosts from '@/i18n/locales/zh/hosts'
import enHosts from '@/i18n/locales/en/hosts'
import { HostCard } from './components/HostCard'
import { HostFormDialog } from './components/HostFormDialog'
import { HostDetailDialog } from './components/HostDetailDialog'
import { TerminalDialog } from './components/TerminalDialog'
// 注册本域命名空间(i18n/index.ts 只负责 common,域词典就近注册;页面为懒加载,渲染前必然已注册)
i18n.addResourceBundle('zh', 'hosts', zhHosts)
i18n.addResourceBundle('en', 'hosts', enHosts)
/**
* 主机管理页 — 只做编排:数据走 useListQuery(取消+版本号),
* 卡片/表单/详情/终端/删除确认均为域内子组件。成功操作静默(列表刷新即反馈)。
* 卡片/表单/详情/删除确认均为域内子组件。成功操作静默(列表刷新即反馈)。
*/
const HostsPage = memo(function HostsPage() {
const { t } = useTranslation('hosts')
const query = useListQuery<Host>((params, signal) =>
hostApi.list(params, { signal })
)
const [formOpen, setFormOpen] = useState(false)
const [detailHost, setDetailHost] = useState<Host | null>(null)
const [terminalHost, setTerminalHost] = useState<Host | null>(null)
const [deleteTarget, setDeleteTarget] = useState<Host | null>(null)
const [editingTarget, setEditingTarget] = useState<Host | null>(null)
const [deleting, setDeleting] = useState(false)
@@ -65,11 +72,11 @@ const HostsPage = memo(function HostsPage() {
setDeleteTarget(null)
query.refresh()
} catch (err) {
toast.error(err instanceof Error ? err.message : '删除主机失败')
toast.error(err instanceof Error ? err.message : t('toast.deleteFailed'))
} finally {
setDeleting(false)
}
}, [deleteTarget, query])
}, [deleteTarget, query, t])
const handleValidate = useCallback(
async (id: number) => {
@@ -78,25 +85,22 @@ const HostsPage = memo(function HostsPage() {
await hostApi.validate(id)
timeoutsRef.current.push(setTimeout(() => query.refresh(), 3000))
} catch (err) {
toast.error(err instanceof Error ? err.message : '验证失败')
toast.error(err instanceof Error ? err.message : t('toast.validateFailed'))
} finally {
timeoutsRef.current.push(setTimeout(() => setValidating(null), 3000))
}
},
[query]
[query, t]
)
return (
<PageContainer
title="主机管理"
description="管理用于二进制方式部署 Loki 的 SSH 主机"
title={t('title')}
description={t('description')}
action={
<Button
className="bg-primary hover:bg-primary/90"
onClick={() => setFormOpen(true)}
>
<Button onClick={() => setFormOpen(true)}>
<Plus className="w-4 h-4 mr-1" />
添加主机
{t('actions.add')}
</Button>
}
>
@@ -107,8 +111,8 @@ const HostsPage = memo(function HostsPage() {
) : query.list.length === 0 ? (
<EmptyState
icon={Monitor}
title="暂无主机"
description="添加第一台 SSH 主机开始使用"
title={t('empty.title')}
description={t('empty.description')}
/>
) : (
<>
@@ -119,7 +123,6 @@ const HostsPage = memo(function HostsPage() {
host={host}
validating={validating}
onViewInfo={setDetailHost}
onOpenTerminal={setTerminalHost}
onValidate={handleValidate}
onDelete={setDeleteTarget}
onEdit={setEditingTarget}
@@ -143,7 +146,7 @@ const HostsPage = memo(function HostsPage() {
setEditingTarget(null)
}
}}
onCreated={query.refresh}
onCreated={() => (editingTarget ? query.refresh() : query.reload())}
editing={editingTarget}
/>
@@ -153,11 +156,6 @@ const HostsPage = memo(function HostsPage() {
onClose={() => setDetailHost(null)}
/>
<TerminalDialog
host={terminalHost}
onClose={() => setTerminalHost(null)}
/>
<ConfirmDialog
open={deleteTarget !== null}
onOpenChange={(open) => {
@@ -167,7 +165,11 @@ const HostsPage = memo(function HostsPage() {
loading={deleting}
description={
refCount.dep + refCount.col > 0
? `确定要删除「${deleteTarget?.name}」吗?警告:仍有 ${refCount.dep} 个部署、${refCount.col} 个采集策略引用该主机,删除后它们将无法工作。`
? t('delete.warning', {
name: deleteTarget?.name ?? '',
dep: refCount.dep,
col: refCount.col,
})
: undefined
}
onConfirm={handleDelete}