e.stopPropagation()}
+ style={{
+ display: "flex",
+ flex: 1,
+ background: "#fff",
+ margin: "60px auto",
+ maxWidth: 1100,
+ height: "calc(100% - 120px)",
+ border: "1px solid var(--border)",
+ boxShadow: "0 6px 32px rgba(0,0,0,0.3)",
+ }}
+ >
+
+ {MEGA_NAV.map((s) => {
+ const active = s.id === activeId;
+ return (
+
setActiveId(s.id)}
+ style={{
+ display: "flex",
+ alignItems: "center",
+ gap: 8,
+ padding: "8px 12px",
+ fontSize: 12,
+ cursor: "pointer",
+ color: active ? "var(--accent-strong)" : "var(--text)",
+ background: active ? "var(--accent-soft)" : "transparent",
+ borderLeft: active ? "3px solid var(--accent)" : "3px solid transparent",
+ fontWeight: active ? 500 : 400,
+ }}
+ >
+ {s.id === "sys" ? : }
+ {s.label}
+
+ );
+ })}
+
+
+
+
+ {MEGA_NAV.find((s) => s.id === activeId)?.label}
+
+
+
+
+ {columns.length === 0 && (
+
+ 此分类暂无配置内容
+
+ )}
+ {columns.map((col) => (
+
+
+ {col.title}
+
+ {col.items.map((it) => (
+
{
+ if (it.screen) {
+ onOpen(it.screen, it.label);
+ onClose();
+ }
+ }}
+ style={{
+ padding: "5px 6px",
+ fontSize: 12,
+ cursor: it.screen ? "pointer" : "default",
+ color: it.screen
+ ? it.featured
+ ? "var(--accent-strong)"
+ : "var(--text)"
+ : "var(--text-faint)",
+ fontWeight: it.featured ? 500 : 400,
+ borderRadius: 2,
+ }}
+ onMouseEnter={(e) => {
+ if (it.screen) e.currentTarget.style.background = "var(--bg-row-hover)";
+ }}
+ onMouseLeave={(e) => {
+ e.currentTarget.style.background = "transparent";
+ }}
+ >
+ {it.label}
+
+ ))}
+
+ ))}
+
+
+