refactor: React 前端重构，新旧平台合并为莞易学

2026-10-29 23:50:46 +08:00
parent 35853891c9
commit e8634a6317
62 changed files with 8923 additions and 4623 deletions
@@ -0,0 +1,78 @@
+import { Plus, RefreshCw, ScrollText, Settings2 } from 'lucide-react'
+
+import { Button } from './ui/Button'
+
+export function TopBar({
+  refreshing,
+  onRefresh,
+  onSettings,
+  onSystemLog,
+  onAdd,
+}: {
+  refreshing: boolean
+  onRefresh: () => void
+  onSettings: () => void
+  onSystemLog: () => void
+  onAdd: () => void
+}) {
+  return (
+    <header className="sticky top-0 z-30 border-b border-line/80 bg-white/85 backdrop-blur-xl">
+      <div className="mx-auto flex h-16 max-w-[1320px] items-center gap-3 px-4 sm:px-6">
+        <div className="flex min-w-0 items-center gap-3">
+          <div className="grid size-9 shrink-0 place-items-center rounded-xl bg-gradient-to-br from-brand-500 to-sky-400 text-[15px] font-bold text-white shadow-md shadow-brand-500/30">
+            学
+          </div>
+          <div className="min-w-0">
+            <div className="flex items-center gap-2">
+              <h1 className="truncate text-[15px] font-semibold tracking-tight text-slate-900">
+                莞易学
+              </h1>
+              <span className="hidden rounded-md bg-slate-100 px-1.5 py-0.5 text-[10px] font-medium text-slate-500 sm:inline">
+                多账号学习控制台
+              </span>
+            </div>
+            <p className="truncate text-[11.5px] text-slate-500">
+              东莞市教师培训平台 · 新旧版课程自动识别
+            </p>
+          </div>
+        </div>
+
+        <div className="flex-1" />
+
+        <div className="flex items-center gap-1.5">
+          <Button
+            variant="ghost"
+            size="icon"
+            onClick={onRefresh}
+            loading={refreshing}
+            title="刷新列表"
+            aria-label="刷新列表"
+          >
+            <RefreshCw className="size-4" />
+          </Button>
+          <Button
+            variant="ghost"
+            size="icon"
+            onClick={onSystemLog}
+            title="系统日志"
+            aria-label="系统日志"
+          >
+            <ScrollText className="size-4" />
+          </Button>
+          <Button
+            variant="ghost"
+            size="icon"
+            onClick={onSettings}
+            title="系统设置"
+            aria-label="系统设置"
+          >
+            <Settings2 className="size-4" />
+          </Button>
+          <Button variant="primary" className="ml-1" icon={<Plus className="size-4" />} onClick={onAdd}>
+            <span className="hidden sm:inline">添加账号</span>
+          </Button>
+        </div>
+      </div>
+    </header>
+  )
+}