@@ -809,6 +974,189 @@ export default function MenuManagementPage() {
);
}
+function CompactMenuManagementPanel({ baseTree }: { baseTree: MenuItem[] }) {
+ const { data: overrides = [], isLoading } = useCompactMenuOverrides();
+ const { save } = useCompactMenuOverrideActions();
+ const initialRows = useMemo(() => compactRowsFromTree(baseTree, overrides), [baseTree, overrides]);
+ const [rows, setRows] = useState
(initialRows);
+ const [loadedKey, setLoadedKey] = useState("");
+
+ const sourceKey = useMemo(
+ () =>
+ JSON.stringify({
+ tree: baseTree.flatMap((top) =>
+ (top.children ?? []).map((child) => [top.id, child.id, child.label]),
+ ),
+ overrides,
+ }),
+ [baseTree, overrides],
+ );
+ useEffect(() => {
+ if (sourceKey !== loadedKey) {
+ setRows(initialRows);
+ setLoadedKey(sourceKey);
+ }
+ }, [sourceKey, loadedKey, initialRows]);
+
+ const currentOverrides = useMemo(() => compactOverridesFromRows(rows), [rows]);
+ const dirty = useMemo(() => !sameOverrides(currentOverrides, overrides), [currentOverrides, overrides]);
+
+ const grouped = useMemo(() => {
+ const groups = new Map();
+ for (const row of rows) {
+ const group = groups.get(row.topId) ?? { label: row.topLabel, rows: [] };
+ group.rows.push(row);
+ groups.set(row.topId, group);
+ }
+ return Array.from(groups.entries()).map(([id, group]) => ({ id, ...group }));
+ }, [rows]);
+
+ const updateRow = (id: string, patch: Partial) =>
+ setRows((prev) => prev.map((row) => (row.id === id ? { ...row, ...patch } : row)));
+
+ const moveRow = (row: CompactRow, direction: -1 | 1) => {
+ setRows((prev) => {
+ const sameLane = prev.filter((item) => item.topId === row.topId && item.placement === row.placement);
+ const laneIndex = sameLane.findIndex((item) => item.id === row.id);
+ const swapWith = sameLane[laneIndex + direction];
+ if (!swapWith) return prev;
+ const next = prev.slice();
+ const a = next.findIndex((item) => item.id === row.id);
+ const b = next.findIndex((item) => item.id === swapWith.id);
+ [next[a], next[b]] = [next[b], next[a]];
+ return next;
+ });
+ };
+
+ const handleSave = async () => {
+ try {
+ await save.mutateAsync(currentOverrides);
+ toast.success("简介菜单配置已保存");
+ } catch (err) {
+ toast.error(err instanceof Error ? err.message : "保存失败");
+ }
+ };
+
+ const handleReset = () => {
+ if (!confirm("确定要重置简介模式菜单为默认布局吗？保存后将清除简介模式自定义配置。")) return;
+ setRows(compactRowsFromTree(baseTree, []));
+ };
+
+ return (
+ <>
+
+
+
+
+
+
+
+
+
+ 仅简介模式生效
+
+
+ 简介菜单管理
+
+ {rows.length} 个项目
+
+
+
+
+
+
+
+
+
+
+ 这里配置的是简介模式工作区左侧菜单：可改显示名称、调整顺序，或迁移到「设置和更多」下拉中；全量模式菜单不受影响。
+
+
+
+ {isLoading ? (
+
加载中…
+ ) : (
+ grouped.map((group) => (
+
+ {group.label}
+
+ {group.rows.map((row) => {
+ const lane = group.rows.filter((item) => item.placement === row.placement);
+ const laneIndex = lane.findIndex((item) => item.id === row.id);
+ const Icon = row.source.icon;
+ return (
+
+
+
+
+
+ updateRow(row.id, { label: e.target.value })}
+ className="bg-white"
+ />
+
+
+
+
+
+
+
+ );
+ })}
+
+ ))
+ )}
+
-