// App shell — WCA junior 牙科領袖營 · 戰情控制台 (() => { const { Badge, Button, Input } = window.WCATalentGameDesignSystem_377d00; const { Modal, FormRow, ModalActions } = window.WCA_UI; const { userRoleLabel, rank } = window.WCA_UTIL; const NAV = [ { id: "dashboard", label: "戰情總覽", glyph: "◆" }, { id: "roster", label: "名單", glyph: "⚑" }, { id: "flow", label: "活動流程", glyph: "☷" }, { id: "merch", label: "文宣清單", glyph: "✦" }, { id: "contacts", label: "聯絡窗口", glyph: "☎" }, ]; const ADMIN_NAV = { id: "admin", label: "帳號管理", glyph: "⛨" }; const TITLES = { dashboard: ["戰情總覽", "Talent Game · Hackathon · Lecture 作戰儀表板"], roster: ["名單管理", "工作人員 · 導師 · 講師 · 學員 · 來賓 · 房間分配"], flow: ["活動流程", "簡易流程 · 詳細流程 · 器材道具"], merch: ["文宣清單", "輸出品製作與攜帶查核"], contacts: ["聯絡窗口", "場地 · 接駁 · 住宿 · 醫護"], admin: ["帳號管理", "Admin · Leader · Member 權限"], }; function PasswordModal({ onClose }) { const [cur, setCur] = React.useState(""); const [nxt, setNxt] = React.useState(""); const save = async () => { await api("PUT", "/api/me/password", { current: cur, next: nxt }); alert("密碼已更新"); onClose(); }; return ( setCur(e.target.value)} /> setNxt(e.target.value)} /> ); } function Sidebar({ view, setView, me }) { const [pwOpen, setPwOpen] = React.useState(false); const nav = me.role === "admin" ? [...NAV, ADMIN_NAV] : NAV; return ( ); } function countdown(meta) { if (!meta.event_start) return ""; const start = new Date(meta.event_start + "T00:00:00+08:00"); const days = Math.ceil((start - Date.now()) / 86400000); if (days > 0) return "倒數 T-" + days; if (days > -3) return "作戰進行中"; return "已結營"; } function Topbar({ view, meta }) { const [t, sub] = TITLES[view]; return (

{t}

{sub}
{meta.event_date}
{meta.event_venue}
{countdown(meta)}
); } function App() { const [me, setMe] = React.useState(null); const [data, setData] = React.useState(null); const initial = location.hash.slice(1); const [view, setViewRaw] = React.useState(TITLES[initial] ? initial : "dashboard"); const setView = (v) => { location.hash = v; setViewRaw(v); }; const refresh = React.useCallback(async () => { setData(await api("GET", "/api/data")); }, []); React.useEffect(() => { (async () => { try { const res = await fetch("/api/me"); if (res.status === 401) { location.href = "/login.html"; return; } setMe(await res.json()); await refresh(); } catch (e) { console.error(e); } })(); }, [refresh]); if (!me || !data) { return (
召 喚 中 …
); } const canEdit = rank[me.role] >= rank.leader; const Views = { dashboard: window.Dashboard, roster: window.Roster, flow: window.FlowSchedule, merch: window.MerchChecklist, contacts: window.Contacts, admin: window.AdminUsers }; const Current = Views[view] || window.Dashboard; return (
); } window.App = App; })();