script.js

/**
 * ============================================================
 *  「下课吃啥」- 食堂推荐助手（最终修复版）
 *  修复：收藏、添加分组绝对可用；排序下拉撑开面板高度
 * ============================================================
 */

document.addEventListener('DOMContentLoaded', function() {

    // ===== 0. 全局配置常量 =====
    const FILE_DEBOUNCE_MS = 800;
    const PLACEHOLDER = '-';
    const LIST_TXT_VERSION = '1.0';
    const SAVE_TXT_VERSION = '1.0';
    const HIGHLIGHT_CLASS = 'highlighted';

    // ===== 1. 模拟数据 =====
    const DISHES_DB = [];

    const BAD_REVIEWS = [];

    // ===== 1.5 店铺树 STORES_DB（食堂 → 楼层 → 窗口，含独立店）=====
    const STORE_ROOT_ID = 0;
    const STORES_DB = [
        { id: 0, name: '全部店铺', parentId: null },
        // 一食堂
        { id: 101, name: '一食堂', parentId: 0 },
        { id: 111, name: '一楼', parentId: 101 },
        { id: 1111, name: '风味面点', parentId: 111 },
        { id: 1112, name: '肉夹馍窗口', parentId: 111 },
        { id: 112, name: '二楼', parentId: 101 },
        { id: 1121, name: '麻辣香锅窗口', parentId: 112 },
        { id: 1122, name: '家常炒菜窗口', parentId: 112 },
        { id: 113, name: '三楼', parentId: 101 },
        { id: 1131, name: '烤鸭饭窗口', parentId: 113 },
        { id: 1132, name: '特色盖浇窗口', parentId: 113 },
        // 二食堂
        { id: 201, name: '二食堂', parentId: 0 },
        { id: 211, name: '一楼', parentId: 201 },
        { id: 2111, name: '凉皮窗口', parentId: 211 },
        { id: 2112, name: '小吃窗口', parentId: 211 },
        { id: 212, name: '二楼', parentId: 201 },
        { id: 2121, name: '健康轻食窗口', parentId: 212 },
        { id: 2122, name: '沙拉窗口', parentId: 212 },
        { id: 213, name: '三楼', parentId: 201 },
        { id: 2131, name: '黄焖鸡窗口', parentId: 213 },
        { id: 2132, name: '煲仔饭窗口', parentId: 213 },
        // 三食堂
        { id: 301, name: '三食堂', parentId: 0 },
        { id: 311, name: '一楼', parentId: 301 },
        { id: 3111, name: '煎饼果子窗口', parentId: 311 },
        { id: 3112, name: '早点窗口', parentId: 311 },
        { id: 312, name: '二楼', parentId: 301 },
        { id: 3121, name: '螺蛳粉窗口', parentId: 312 },
        { id: 3122, name: '粉面窗口', parentId: 312 },
        // 独立店
        { id: 401, name: '罗森便利店', parentId: 0 },
    ];

    // ===== 1.6 店铺树工具：节点查询 / 路径 / 子孙 / 迁移 =====
    function getStoreNode(id) {
        return STORES_DB.find(s => s.id === id) || null;
    }
    function getStoreName(id) {
        const n = getStoreNode(id);
        return n ? n.name : '未知门店';
    }
    function getStorePath(id) {
        const names = [];
        let cur = getStoreNode(id);
        while (cur && cur.id !== STORE_ROOT_ID) {
            names.unshift(cur.name);
            cur = getStoreNode(cur.parentId);
        }
        return names.length > 0 ? names.join('/') : '未分配';
    }
    function getDescendantIds(nodeId) {
        const result = [];
        const walk = (id) => {
            result.push(id);
            STORES_DB.filter(s => s.parentId === id).forEach(c => walk(c.id));
        };
        walk(nodeId);
        return result;
    }
    // 取某节点下第一个叶子（窗口）节点，用于把旧字符串落到最底层窗口
    function firstLeafId(nodeId) {
        const children = STORES_DB.filter(s => s.parentId === nodeId);
        if (children.length === 0) return nodeId;
        children.sort((a, b) => a.id - b.id);
        return firstLeafId(children[0].id);
    }
    // 迁移：解析旧 canteen 字符串 → storeId
    function migrateToStoreId(canteenStr) {
        if (!canteenStr || typeof canteenStr !== 'string') return null;
        const s = canteenStr.trim();
        if (!s) return null;
        // 1. 精确匹配节点名
        const exact = STORES_DB.find(n => n.name === s);
        if (exact) return firstLeafId(exact.id);
        // 2. 匹配「X食堂Y楼」
        const m = s.match(/^([一二三四五六七八九十]+食堂)([一二三四五六七八九十]+楼)$/);
        if (m) {
            const canteen = STORES_DB.find(n => n.name === m[1] && n.parentId === STORE_ROOT_ID);
            if (canteen) {
                const floor = STORES_DB.find(n => n.name === m[2] && n.parentId === canteen.id);
                if (floor) return firstLeafId(floor.id);
                return firstLeafId(canteen.id);
            }
        }
        // 3. 模糊匹配（包含关系）
        for (const n of STORES_DB) {
            if (n.id === STORE_ROOT_ID) continue;
            if (s.includes(n.name) || n.name.includes(s)) return firstLeafId(n.id);
        }
        return null;
    }
    // 迁移：把 DISHES_DB 的旧 canteen 字段替换为 storeId
    function runMigration() {
        let migrated = 0;
        DISHES_DB.forEach(d => {
            if (d.storeId === undefined || d.storeId === null) {
                d.storeId = migrateToStoreId(d.canteen);
                delete d.canteen;
                migrated++;
            }
        });
        return migrated;
    }

    // ===== 1.7 店铺节点创建与路径解析（list.txt 以文字路径驱动店铺树）=====
    // 新建店铺节点：id 自动分配，返回新节点（持久化由 list.txt 写回完成）
    function addStoreNode(name, parentId, type) {
        const newId = STORES_DB.reduce((m, s) => Math.max(m, s.id), 0) + 1;
        const node = { id: newId, name: name.trim(), parentId: parentId };
        if (type) node.type = type;
        STORES_DB.push(node);
        return node;
    }
    // 推断节点类型（新节点显式带 type，老节点按层级推断）
    function getStoreType(node) {
        if (!node) return 'root';
        if (node.type) return node.type;
        if (node.id === STORE_ROOT_ID) return 'root';
        if (node.parentId === STORE_ROOT_ID) {
            return getStoreChildren(node.id).length > 0 ? 'canteen' : 'standalone';
        }
        const parent = getStoreNode(node.parentId);
        if (parent && getStoreType(parent) === 'canteen') return 'floor';
        return 'window';
    }
    // 解析文字路径（如「一食堂/二楼/小吃窗口」），逐级查找，缺失则自动创建节点
    function resolveStorePath(pathStr) {
        if (!pathStr || typeof pathStr !== 'string') return null;
        const parts = pathStr.split('/').map(s => s.trim()).filter(Boolean);
        if (parts.length === 0) return null;
        let parentId = STORE_ROOT_ID;
        let node = null;
        for (const name of parts) {
            node = STORES_DB.find(s => s.parentId === parentId && s.name === name);
            if (!node) node = addStoreNode(name, parentId);
            parentId = node.id;
        }
        return node ? node.id : null;
    }
    // 解析 list.txt 的 store 字段：数字 id（旧格式）/ 文字路径（新格式）/ 旧 canteen 文字
    function parseStoreRef(raw) {
        if (raw === undefined || raw === null || raw === '' || raw === PLACEHOLDER) return null;
        const s = String(raw).trim();
        if (!s) return null;
        if (/^\d+$/.test(s)) {
            const id = Number(s);
            return getStoreNode(id) ? id : id;
        }
        if (s.includes('/')) return resolveStorePath(s);
        return migrateToStoreId(s);
    }

    // ===== 2. 存储 =====
    const STORAGE_KEY = 'canteen_helper_data';
    function loadStorage() {
        try {
            const raw = localStorage.getItem(STORAGE_KEY);
            if (raw) return JSON.parse(raw);
        } catch (_) {}
        return { favorites: [], groups: [], tagStates: {} };
    }
    function saveStorage(data) {
        localStorage.setItem(STORAGE_KEY, JSON.stringify(data));
    }

    // ===== 3. 全局状态 =====
    let currentGroup = 'all';
    let currentSort = 'default';
    let currentDishes = [];
    let selectedStoreIds = new Set();
    let storeTreeExpanded = new Set([STORE_ROOT_ID]);

    // ============================================================
    // 基础设施层：FileGateway / 序列化器 / UserData / DataSource
    // ============================================================

    // ===== 3.1 FileGateway 文件读写适配层 =====
    const FileGateway = (function() {
        async function writeText(filename, content) {
            try {
                if (window.showSaveFilePicker) {
                    const handle = await window.showSaveFilePicker({
                        suggestedName: filename,
                        types: [{ description: '文本文件', accept: { 'text/plain': ['.txt'] } }]
                    });
                    const writable = await handle.createWritable();
                    await writable.write(content);
                    await writable.close();
                    return true;
                }
            } catch (err) {
                if (err && err.name === 'AbortError') return false;
            }
            try {
                const blob = new Blob([content], { type: 'text/plain;charset=utf-8' });
                const url = URL.createObjectURL(blob);
                const a = document.createElement('a');
                a.href = url;
                a.download = filename;
                document.body.appendChild(a);
                a.click();
                document.body.removeChild(a);
                URL.revokeObjectURL(url);
                return true;
            } catch (err) {
                console.warn('FileGateway.writeText 失败:', err);
                return false;
            }
        }

        function readText(filename) {
            return new Promise(resolve => {
                try {
                    const input = document.createElement('input');
                    input.type = 'file';
                    input.accept = '.txt,text/plain';
                    let settled = false;
                    input.onchange = async function() {
                        const file = input.files[0];
                        if (!file) { if (!settled) { settled = true; resolve(null); } return; }
                        try {
                            const text = await file.text();
                            settled = true;
                            resolve(text);
                        } catch (e) {
                            settled = true;
                            resolve(null);
                        }
                    };
                    input.oncancel = function() { if (!settled) { settled = true; resolve(null); } };
                    input.click();
                } catch (err) {
                    console.warn('FileGateway.readText 失败:', err);
                    resolve(null);
                }
            });
        }

        // 获取（或让用户选择）项目目录下的 Pictures 文件夹句柄
        let picturesDirHandle = null;
        async function ensurePicturesDir() {
            if (!window.showDirectoryPicker) return null;
            try {
                if (picturesDirHandle) {
                    const perm = await picturesDirHandle.queryPermission({ mode: 'readwrite' });
                    if (perm === 'granted') return picturesDirHandle;
                    if ((await picturesDirHandle.requestPermission({ mode: 'readwrite' })) === 'granted') return picturesDirHandle;
                    picturesDirHandle = null;
                }
                const root = await window.showDirectoryPicker({ mode: 'readwrite' });
                picturesDirHandle = await root.getDirectoryHandle('Pictures', { create: true });
                return picturesDirHandle;
            } catch (err) {
                if (err && err.name !== 'AbortError') console.warn('ensurePicturesDir 失败:', err);
                picturesDirHandle = null;
                return null;
            }
        }

        // 向 Pictures 目录写入图片文件
        async function writeImageToPictures(dirHandle, filename, blob) {
            try {
                const fileHandle = await dirHandle.getFileHandle(filename, { create: true });
                const writable = await fileHandle.createWritable();
                await writable.write(blob);
                await writable.close();
                return true;
            } catch (err) {
                console.warn('writeImageToPictures 失败:', err);
                return false;
            }
        }

        // 降级方案：下载文件（用户手动放入 Pictures）
        function downloadBlob(filename, blob) {
            try {
                const url = URL.createObjectURL(blob);
                const a = document.createElement('a');
                a.href = url;
                a.download = filename;
                document.body.appendChild(a);
                a.click();
                document.body.removeChild(a);
                URL.revokeObjectURL(url);
                return true;
            } catch (err) {
                console.warn('downloadBlob 失败:', err);
                return false;
            }
        }

        return { writeText, readText, ensurePicturesDir, writeImageToPictures, downloadBlob };
    })();

    // ===== 3.2 list.txt 载入与导出（fetch 读取同级 list.txt）=====
    async function persistListFile() {
        const text = ListTxtSerializer.serialize(DataSource.getAllDishes());
        const ok = await FileGateway.writeText('list.txt', text);
        if (!ok) showToast('list.txt 导出失败，请检查文件权限');
    }
    function showDropHint(msg) {
        if (resultStatus) {
            resultStatus.textContent = msg || '📥 请将 list.txt 拖拽到窗口中导入';
            resultStatus.style.display = '';
        }
    }
    async function bootstrapListFile() {
        try {
            const resp = await fetch('list.txt', { cache: 'no-store' });
            if (!resp.ok) { showDropHint(); return; }
            const text = await resp.text();
            const res = ListTxtSerializer.deserialize(text);
            if (res.formatError) { showDropHint('📥 list.txt 格式异常，请拖拽正确的文件导入'); return; }
            if (res.dishes.length > 0) {
                DISHES_DB.length = 0;
                res.dishes.forEach(d => DISHES_DB.push(d));
            }
        } catch (err) {
            console.warn('fetch list.txt 失败（可能在 file:// 协议下运行）:', err);
            showDropHint();
        }
    }
    async function importListFromText(text) {
        const res = ListTxtSerializer.deserialize(text);
        if (res.formatError) { showToast('文件格式异常，已取消导入'); return false; }
        DISHES_DB.length = 0;
        res.dishes.forEach(d => DISHES_DB.push(d));
        initTagModes();
        applyFilters();
        const msg = res.skippedCount > 0
            ? '导入完成，载入 ' + res.dishes.length + ' 条菜品（跳过 ' + res.skippedCount + ' 条不完整记录）'
            : '导入完成，载入 ' + res.dishes.length + ' 条菜品';
        showToast(msg);
        return true;
    }

    // ===== 3.2 ListTxtSerializer 序列化器（分隔符 |，店铺字段 store 存文字路径）=====
    const ListTxtSerializer = (function() {
        const FIELDS = ['id', 'name', 'price', 'store', 'rating', 'tags', 'popular', 'note', 'localCategory', 'emoji', 'img'];
        const SEP = '|';

        function serialize(dishes) {
            const header = '# list.txt 字段顺序: ' + FIELDS.join('/') + ' | 分隔符 | | tags以逗号分隔 | 空值用' + PLACEHOLDER + ' | 字段值勿含 |';
            const lines = dishes.map(d => FIELDS.map(f => {
                if (f === 'tags') return Array.isArray(d.tags) && d.tags.length > 0 ? d.tags.join(',') : PLACEHOLDER;
                if (f === 'store') {
                    if (d.storeId === undefined || d.storeId === null) return PLACEHOLDER;
                    const p = getStorePath(d.storeId);
                    return p && p !== '未分配' ? p : PLACEHOLDER;
                }
                return (d[f] !== undefined && d[f] !== null && d[f] !== '') ? String(d[f]) : PLACEHOLDER;
            }).join(SEP));
            return header + '\n' + lines.join('\n') + (lines.length > 0 ? '\n' : '');
        }

        function deserialize(text) {
            const result = { dishes: [], skippedCount: 0, formatError: false };
            if (!text || typeof text !== 'string') { result.formatError = true; return result; }
            text.split(/\r?\n/).forEach(line => {
                if (!line.trim() || line.startsWith('#')) return;
                // 试探分隔符：新格式用 |，旧格式用 /（旧数据字段值不含 /）
                const sep = (line.includes('|') && line.split('|').length >= FIELDS.length) ? '|' : '/';
                const parts = line.split(sep);
                if (parts.length < FIELDS.length) { result.skippedCount++; return; }
                const b = {};
                FIELDS.forEach((f, i) => { b[f] = parts[i]; });
                if (!b.id || !b.name || b.id === PLACEHOLDER || b.name === PLACEHOLDER) { result.skippedCount++; return; }
                const dish = {
                    id: Number(b.id),
                    name: b.name,
                    price: b.price !== PLACEHOLDER ? Number(b.price) : 0,
                    storeId: parseStoreRef(b.store),
                    rating: b.rating !== PLACEHOLDER ? Number(b.rating) : 0,
                    tags: b.tags && b.tags !== PLACEHOLDER ? b.tags.split(',').filter(Boolean) : [],
                    popular: b.popular !== PLACEHOLDER && b.popular !== undefined ? Number(b.popular) : 0,
                    note: b.note !== PLACEHOLDER && b.note !== undefined ? b.note : '',
                    localCategory: b.localCategory !== PLACEHOLDER && b.localCategory !== undefined ? b.localCategory : '',
                    emoji: b.emoji !== PLACEHOLDER && b.emoji !== undefined ? b.emoji : '🍽️',
                    img: b.img !== PLACEHOLDER && b.img !== undefined ? b.img : ''
                };
                if (isNaN(dish.id) || isNaN(dish.price)) { result.skippedCount++; return; }
                result.dishes.push(dish);
            });
            return result;
        }

        return { serialize, deserialize, FIELDS };
    })();

    // ===== 3.3 SaveTxtSerializer 序列化器 =====
    const SaveTxtSerializer = (function() {
        const FIELDS = ['id', 'name', 'note', 'localCategory'];

        function serialize(entries) {
            const header = '# save.txt 字段顺序: ' + FIELDS.join('/') + ' | 空值用' + PLACEHOLDER + ' | 字段值勿含/';
            const list = Array.isArray(entries) ? entries : [];
            const lines = list.map(e => FIELDS.map(f => {
                return (e[f] !== undefined && e[f] !== null && e[f] !== '') ? String(e[f]) : PLACEHOLDER;
            }).join('/'));
            return header + '\n' + lines.join('\n') + (lines.length > 0 ? '\n' : '');
        }

        function deserialize(text) {
            const result = { entries: [], corrupt: false };
            if (!text || typeof text !== 'string') return result;
            try {
                text.split(/\r?\n/).forEach(line => {
                    if (!line.trim() || line.startsWith('#')) return;
                    const parts = line.split('/');
                    if (parts.length < FIELDS.length) return;
                    const b = {};
                    FIELDS.forEach((f, i) => { b[f] = parts[i]; });
                    if (!b.id || b.id === PLACEHOLDER) return;
                    result.entries.push({
                        id: Number(b.id),
                        name: b.name !== PLACEHOLDER ? b.name : '',
                        note: b.note !== PLACEHOLDER && b.note !== undefined ? b.note : '',
                        localCategory: b.localCategory !== PLACEHOLDER && b.localCategory !== undefined ? b.localCategory : ''
                    });
                });
            } catch (e) {
                result.corrupt = true;
            }
            return result;
        }

        return { serialize, deserialize };
    })();

    // ===== 3.4 UserData 用户数据层 =====
    const UserData = (function() {
        const STORAGE_KEY_USER = 'canteen_user_data';

        function loadMap() {
            try {
                const raw = localStorage.getItem(STORAGE_KEY_USER);
                if (raw) return new Map(JSON.parse(raw));
            } catch (_) {}
            return new Map();
        }

        function saveMap(map) {
            try { localStorage.setItem(STORAGE_KEY_USER, JSON.stringify(Array.from(map.entries()))); } catch (_) {}
        }

        let store = loadMap();

        function get(dishId) {
            return store.get(dishId) || { note: '', localCategory: '' };
        }

        function update(dishId, fields) {
            const cur = store.get(dishId) || { note: '', localCategory: '' };
            const next = Object.assign({}, cur, fields);
            store.set(dishId, next);
            saveMap(store);
        }

        function getAll() {
            const arr = [];
            store.forEach((v, k) => arr.push(Object.assign({ id: k }, v)));
            return arr;
        }

        function loadAll() {
            store = loadMap();
        }

        async function exportSave() {
            const entries = [];
            store.forEach((v, k) => {
                if (v.note || v.localCategory) {
                    const dish = DISHES_DB.find(d => d.id === k);
                    entries.push({ id: k, name: dish ? dish.name : '', note: v.note, localCategory: v.localCategory });
                }
            });
            const content = SaveTxtSerializer.serialize(entries);
            return await FileGateway.writeText('save.txt', content);
        }

        async function importSave() {
            const text = await FileGateway.readText('save.txt');
            if (text === null) return { ok: false, reason: 'no-file' };
            const res = SaveTxtSerializer.deserialize(text);
            if (res.corrupt) return { ok: false, reason: 'corrupt' };
            const newMap = new Map();
            res.entries.forEach(e => {
                const exists = DISHES_DB.some(d => d.id === e.id);
                if (!exists) { console.warn('save.txt 关联菜品不存在: id=' + e.id); return; }
                newMap.set(e.id, { note: e.note, localCategory: e.localCategory });
            });
            store = newMap;
            saveMap(store);
            return { ok: true };
        }

        return { get, update, getAll, loadAll, exportSave, importSave };
    })();

    // ===== 3.5 DataSource 数据统一出口 =====
    const DataSource = (function() {
        function buildView(d) {
            if (!d) return null;
            const u = UserData.get(d.id);
            return {
                id: d.id,
                name: d.name,
                price: d.price,
                storeId: d.storeId,
                storeName: getStoreName(d.storeId),
                storePath: getStorePath(d.storeId),
                rating: d.rating,
                tags: Array.isArray(d.tags) ? [...d.tags] : [],
                popular: d.popular || 0,
                emoji: d.emoji || '🍽️',
                img: d.img || '',
                note: u.note || '',
                localCategory: u.localCategory || ''
            };
        }

        function getDishById(id) {
            const d = DISHES_DB.find(x => x.id === id);
            return buildView(d);
        }

        function getAllDishes() {
            return DISHES_DB.map(buildView).filter(Boolean);
        }

        function getCurrentPageDishes() {
            return (currentDishes || []).map(d => {
                const base = DISHES_DB.find(x => x.id === d.id) || d;
                return buildView(base);
            }).filter(Boolean);
        }

        return { getDishById, getAllDishes, getCurrentPageDishes };
    })();

    // 轻提示（复用模态框，不使用 alert）
    function showToast(msg) {
        openModal('提示', '<p style="text-align:center;color:#5a6b7a;">' + msg + '</p><div class="modal-actions"><button class="btn-secondary">知道了</button></div>', null);
    }

    // ===== 4. DOM 引用 =====
    const $ = id => document.getElementById(id);
    const searchInput = $('searchInput');
    const recommendBtn = $('recommendBtn');
    const resultList = $('resultList');
    const resultStatus = $('resultStatus');
    const showGood = $('showGood');
    const showBad = $('showBad');
    const resetViewBtn = $('resetView');
    const filterTags = document.querySelectorAll('.filter-tag');
    const filterToggle = $('filterToggle');
    const filterPanel = $('filterPanel');
    const tagModeGroup = $('tagModeGroup');
    const groupBtnGroup = $('groupBtnGroup');
    const addGroupBtn = $('addGroupBtn');
    const modalOverlay = $('modalOverlay');
    const modalTitle = $('modalTitle');
    const modalBody = $('modalBody');
    const modalClose = $('modalClose');
    const customSelect = $('customSelect');
    const selectSelected = $('selectSelected');
    const selectOptionsWrapper = document.querySelector('.select-options-wrapper');
    const selectOptions = $('selectOptions');
    const tagCommentHint = $('tagCommentHint');
    const exportListBtn = $('exportListBtn');
    const importListBtn = $('importListBtn');
    const exportSaveBtn = $('exportSaveBtn');
    const importSaveBtn = $('importSaveBtn');
    const diceBtn = $('diceBtn');
    const storeFilterTrigger = $('storeFilterTrigger');
    const storeTreePopup = $('storeTreePopup');
    const storeTree = $('storeTree');

    // ===== 5. 主题切换 =====
    function initThemes() {
        const saved = localStorage.getItem('canteen_theme') || 'default';
        document.body.className = 'theme-' + saved;
        document.querySelectorAll('.theme-option').forEach(el => {
            el.classList.toggle('active', el.dataset.theme === saved);
        });
    }
    document.addEventListener('click', function(e) {
        const opt = e.target.closest('.theme-option');
        if (!opt) return;
        const theme = opt.dataset.theme;
        document.body.className = 'theme-' + theme;
        document.querySelectorAll('.theme-option').forEach(el => el.classList.remove('active'));
        opt.classList.add('active');
        localStorage.setItem('canteen_theme', theme);
    });

    // ===== 6. 高级筛选展开/收起 =====
    if (filterToggle && filterPanel) {
        filterToggle.addEventListener('click', function() {
            const isOpen = filterPanel.classList.contains('open');
            filterPanel.classList.toggle('open');
            filterToggle.textContent = isOpen ? '⚙️ 高级筛选 ▾' : '⚙️ 高级筛选 ▴';
        });
    }

    // ===== 7. 模态框（带关闭动画） =====
    let modalCallback = null;
    let modalKeyHandler = null;
    function openModal(title, html, onConfirm) {
        modalTitle.textContent = title;
        modalBody.innerHTML = html;
        modalOverlay.style.display = 'flex';
        modalOverlay.classList.remove('closing');
        modalCallback = onConfirm || null;

        // 确认按钮（.modal-actions 内的 .btn-primary 或 .btn-danger）
        const confirmBtn = modalBody.querySelector('.modal-actions .btn-primary, .modal-actions .btn-danger');
        if (confirmBtn) {
            confirmBtn.onclick = function(e) {
                e.stopPropagation();
                if (modalCallback) {
                    const result = modalCallback();
                    if (result === false) return;
                }
                closeModal();
            };
        }
        // 取消按钮（.modal-actions 内的 .btn-secondary）
        const cancelBtn = modalBody.querySelector('.modal-actions .btn-secondary');
        if (cancelBtn) {
            cancelBtn.onclick = function(e) {
                e.stopPropagation();
                closeModal();
            };
        }
        modalClose.onclick = closeModal;
        modalOverlay.onclick = function(e) { if (e.target === modalOverlay) closeModal(); };
        // Esc 键关闭
        if (modalKeyHandler) document.removeEventListener('keydown', modalKeyHandler);
        modalKeyHandler = function(e) { if (e.key === 'Escape') closeModal(); };
        document.addEventListener('keydown', modalKeyHandler);
    }

    function closeModal() {
        if (modalOverlay.style.display === 'none') return;
        if (modalKeyHandler) {
            document.removeEventListener('keydown', modalKeyHandler);
            modalKeyHandler = null;
        }
        modalOverlay.classList.add('closing');
        setTimeout(() => {
            modalOverlay.style.display = 'none';
            modalOverlay.classList.remove('closing');
        }, 350);
    }

    // ===== 8. 分组管理（核心修复） =====
    function getGroups() {
        return loadStorage().groups;
    }

    function addGroup(name) {
        const data = loadStorage();
        const newGroup = { id: 'g' + Date.now(), name: name.trim(), dishes: [] };
        data.groups.push(newGroup);
        saveStorage(data);
        renderGroupButtons();
        // 自动切换到新分组
        setActiveGroup(newGroup.id);
        return newGroup;
    }

    function deleteGroup(groupId) {
        const data = loadStorage();
        data.groups = data.groups.filter(g => g.id !== groupId);
        saveStorage(data);
        if (currentGroup === groupId) {
            currentGroup = 'all';
        }
        renderGroupButtons();
        applyFilters();
    }

    function toggleDishInGroup(dishId, groupId) {
        const data = loadStorage();
        const group = data.groups.find(g => g.id === groupId);
        if (!group) return;
        const idx = group.dishes.indexOf(dishId);
        if (idx >= 0) group.dishes.splice(idx, 1);
        else group.dishes.push(dishId);
        saveStorage(data);
        if (currentGroup === groupId) applyFilters();
        else renderGroupButtons();
    }

    // ===== 9. 渲染分组按钮（事件委托，修复 all/favorites 切换） =====
    function renderGroupButtons() {
        const data = loadStorage();
        const groups = data.groups;

        // 清除已生成的自定义分组按钮（保留"全部"和"收藏"以及"添加"按钮）
        const existingBtns = groupBtnGroup.querySelectorAll('.group-btn:not(.add-group-btn)');
        existingBtns.forEach(btn => {
            if (btn.dataset.group !== 'all' && btn.dataset.group !== 'favorites') {
                btn.remove();
            }
        });

        const addBtn = groupBtnGroup.querySelector('.add-group-btn');

        groups.forEach(group => {
            const btn = document.createElement('button');
            btn.className = 'group-btn';
            btn.dataset.group = group.id;
            btn.innerHTML = `${group.name} <span class="delete-group-btn" data-group-id="${group.id}">✕</span>`;
            groupBtnGroup.insertBefore(btn, addBtn);
        });

        // 高亮当前分组
        setActiveGroup(currentGroup);
    }

    // 分组按钮事件委托（统一处理 all/favorites/自定义）
    groupBtnGroup.addEventListener('click', function(e) {
        const del = e.target.closest('.delete-group-btn');
        if (del) {
            e.stopPropagation();
            const gid = del.dataset.groupId;
            const group = getGroups().find(g => g.id === gid);
            if (group) {
                openModal('确认删除', `<p class="group-manager-title">确定要删除分组"${group.name}"吗？</p><div class="modal-actions"><button class="btn-secondary">取消</button><button class="btn-danger">删除</button></div>`, function() {
                    deleteGroup(gid);
                });
            }
            return;
        }
        const btn = e.target.closest('.group-btn:not(.add-group-btn)');
        if (btn) {
            setActiveGroup(btn.dataset.group);
        }
    });

    function setActiveGroup(groupId) {
        currentGroup = groupId;
        const btns = groupBtnGroup.querySelectorAll('.group-btn');
        btns.forEach(btn => {
            btn.classList.remove('active');
            if (btn.dataset.group === groupId) {
                btn.classList.add('active');
            }
        });
        applyFilters();
    }

    // ===== 10. 添加分组按钮事件 =====
    if (addGroupBtn) {
        addGroupBtn.addEventListener('click', function() {
            openModal('添加我的分组', `<input type="text" id="newGroupNameInput" placeholder="输入分组名称" /><div class="modal-actions"><button class="btn-secondary">取消</button><button class="btn-primary">创建</button></div>`, function() {
                const nameInput = document.getElementById('newGroupNameInput');
                if (nameInput && nameInput.value.trim()) {
                    addGroup(nameInput.value.trim());
                } else {
                    return false;
                }
            });
        });
    }

    // ===== 11. 标签四态系统 =====
    const TAG_STATES = ['none', 'must', 'optional', 'exclude'];
    const STATE_SYMBOLS = { none: '', must: '✓', optional: '＋', exclude: '✕' };
    const STATE_CLASSES = { none: '', must: 'mode-must', optional: 'mode-optional', exclude: 'mode-exclude' };

    function getTagStates() {
        const data = loadStorage();
        if (!data.tagStates) {
            data.tagStates = {};
            const allTags = new Set();
            DISHES_DB.forEach(d => d.tags.forEach(t => allTags.add(t)));
            allTags.forEach(t => data.tagStates[t] = 'none');
            saveStorage(data);
        }
        return data.tagStates;
    }

    function setTagState(tag, state) {
        const data = loadStorage();
        if (!data.tagStates) data.tagStates = {};
        data.tagStates[tag] = state;
        saveStorage(data);
        renderTagModes();
        applyFilters();
    }

    function initTagModes() {
        const allTags = new Set();
        DISHES_DB.forEach(d => d.tags.forEach(t => allTags.add(t)));
        const states = getTagStates();
        allTags.forEach(t => { if (!states[t]) states[t] = 'none'; });
        saveStorage({ ...loadStorage(), tagStates: states });
        renderTagModes();
    }

    function renderTagModes() {
        const states = getTagStates();
        const allTags = Object.keys(states);
        tagModeGroup.innerHTML = '';
        allTags.forEach(tag => {
            const state = states[tag] || 'none';
            const symbol = STATE_SYMBOLS[state];
            const cls = STATE_CLASSES[state];
            const item = document.createElement('div');
            item.className = `tag-mode-item ${cls}`;
            item.dataset.tag = tag;
            item.innerHTML = `
                <span class="mode-symbol">${symbol}</span>
                <span class="tag-name">${tag}</span>
            `;
            // 点击循环切换
            item.addEventListener('click', function() {
                const current = states[tag] || 'none';
                const idx = TAG_STATES.indexOf(current);
                const nextIdx = (idx + 1) % TAG_STATES.length;
                const nextState = TAG_STATES[nextIdx];
                setTagState(tag, nextState);
            });
            tagModeGroup.appendChild(item);
        });
    }

    // ===== 12. 标签全局提示 =====
    if (tagCommentHint) {
        tagCommentHint.addEventListener('click', function() {
            const html = `
                <div class="tag-filter-logic">
                    <p><strong>标签筛选逻辑</strong></p>
                    <ul>
                        <li><strong>✕ 错号（排除）</strong>：具有最高优先级。只要菜品包含任一"错号"标签，不会在结果中显示。</li>
                        <li><strong>✓ 对号（必须）</strong>：菜品必须同时包含所有"对号"标签，才进行显示。</li>
                        <li><strong>＋ 加号（可选）</strong>：在"对号"的基础上，将包含任一"加号"标签的菜品并入结果显示（若没有"对号"，则直接从全量菜品中取并集）。</li>
                        <li><strong>空（不限）</strong>：不做任何处理，完全忽略该标签。</li>
                    </ul>
                </div>
                <div class="modal-actions"><button class="btn-secondary">知道了</button></div>
            `;
            openModal('标签筛选逻辑', html, null);
        });
    }

    // ===== 13. 自定义下拉（块级展开，撑开父容器） =====
    if (selectSelected && selectOptionsWrapper) {
        // 仅通过点击列表头切换开/关，不被其它操作打断
        selectSelected.addEventListener('click', function(e) {
            e.stopPropagation();
            const isOpen = selectOptionsWrapper.classList.contains('open');
            selectOptionsWrapper.classList.toggle('open');
            selectSelected.textContent = selectSelected.textContent.replace(/[▴▾]/, '') + (isOpen ? ' ▾' : ' ▴');
        });

        // 选项点击（不关闭列表，保持打开直到点击列表头收起）
        selectOptions.querySelectorAll('.select-option').forEach(opt => {
            opt.addEventListener('click', function(e) {
                e.stopPropagation();
                const value = this.dataset.value;
                const label = this.textContent;
                const isOpen = selectOptionsWrapper.classList.contains('open');
                selectSelected.textContent = label + (isOpen ? ' ▴' : ' ▾');
                currentSort = value;
                // 高亮选中
                selectOptions.querySelectorAll('.select-option').forEach(o => o.classList.remove('selected'));
                this.classList.add('selected');
                applyFilters();
            });
        });
    }

    // ===== 14. 筛选与排序核心（含四态） =====
    function getFilteredAndSorted() {
        const data = loadStorage();
        const tagStates = data.tagStates || {};
        let result = [...DISHES_DB];

        // 分组
        if (currentGroup === 'favorites') {
            result = result.filter(d => data.favorites.includes(d.id));
        } else if (currentGroup !== 'all') {
            const group = data.groups.find(g => g.id === currentGroup);
            if (group) {
                result = result.filter(d => group.dishes.includes(d.id));
            } else {
                currentGroup = 'all';
                renderGroupButtons();
            }
        }

        // 店铺筛选（勾选的叶子节点取并集，含各自子孙）
        if (selectedStoreIds.size > 0) {
            const allowed = new Set();
            selectedStoreIds.forEach(id => getDescendantIds(id).forEach(x => allowed.add(x)));
            result = result.filter(d => allowed.has(d.storeId));
        }

        // 标签四态
        const excludeTags = Object.keys(tagStates).filter(t => tagStates[t] === 'exclude');
        const mustTags = Object.keys(tagStates).filter(t => tagStates[t] === 'must');
        const optionalTags = Object.keys(tagStates).filter(t => tagStates[t] === 'optional');

        if (excludeTags.length > 0) {
            result = result.filter(d => !d.tags.some(t => excludeTags.includes(t)));
        }
        if (mustTags.length > 0) {
            result = result.filter(d => mustTags.every(t => d.tags.includes(t)));
        }
        if (optionalTags.length > 0) {
            const optionalDishes = DISHES_DB.filter(d => d.tags.some(t => optionalTags.includes(t)));
            const merged = new Map();
            result.forEach(d => merged.set(d.id, d));
            optionalDishes.forEach(d => merged.set(d.id, d));
            result = Array.from(merged.values());
        }

        // 排序
        switch (currentSort) {
            case 'price': result.sort((a, b) => a.price - b.price); break;
            case 'price-desc': result.sort((a, b) => b.price - a.price); break;
            case 'rating': result.sort((a, b) => b.rating - a.rating); break;
            case 'popular': result.sort((a, b) => (b.popular || 0) - (a.popular || 0)); break;
            default: break;
        }
        return result;
    }

    function applyFilters() {
        const filtered = getFilteredAndSorted();
        currentDishes = filtered;
        renderDishes(filtered);
    }

    // ===== 14.5 悬浮店铺树筛选器（多选勾选、保持开启、外侧关闭）=====
    function getStoreChildren(nodeId) {
        return STORES_DB.filter(s => s.parentId === nodeId).sort((a, b) => a.id - b.id);
    }

    function renderStoreTree() {
        if (!storeTree) return;
        storeTree.innerHTML = '';
        const fragment = document.createDocumentFragment();

        function buildNode(node, depth) {
            const wrap = document.createElement('div');
            wrap.className = 'store-tree-node';

            const row = document.createElement('div');
            row.className = 'store-node-row';
            row.dataset.id = node.id;
            row.style.paddingLeft = (10 + depth * 14) + 'px';

            const children = getStoreChildren(node.id);
            const hasChildren = children.length > 0;
            const expanded = storeTreeExpanded.has(node.id);

            // 勾选框（仅叶子节点显示，可展开项不勾选）
            const check = document.createElement('span');
            check.className = 'store-node-check';
            if (!hasChildren) {
                if (selectedStoreIds.has(node.id)) {
                    check.classList.add('checked');
                    check.textContent = '✓';
                }
            } else {
                check.classList.add('placeholder');
            }

            const toggle = document.createElement('span');
            toggle.className = 'store-node-toggle';
            toggle.textContent = hasChildren ? (expanded ? '▾' : '▸') : '';

            const name = document.createElement('span');
            name.className = 'store-node-name';
            name.textContent = node.name;

            row.appendChild(check);
            row.appendChild(toggle);
            row.appendChild(name);
            wrap.appendChild(row);

            if (hasChildren && expanded) {
                const childBox = document.createElement('div');
                childBox.className = 'store-node-children';
                children.forEach(c => childBox.appendChild(buildNode(c, depth + 1)));
                wrap.appendChild(childBox);
            }
            return wrap;
        }

        const rootNode = { id: STORE_ROOT_ID, name: '全部店铺', parentId: null };
        fragment.appendChild(buildNode(rootNode, 0));
        storeTree.appendChild(fragment);
    }

    function updateStoreTrigger() {
        if (!storeFilterTrigger) return;
        const n = selectedStoreIds.size;
        if (n === 0) storeFilterTrigger.textContent = '全部店铺 ▾';
        else if (n === 1) storeFilterTrigger.textContent = getStoreName([...selectedStoreIds][0]) + ' ▾';
        else storeFilterTrigger.textContent = '已选 ' + n + ' 个店铺 ▾';
        storeFilterTrigger.classList.toggle('active', n > 0);
    }

    function positionStorePopup() {
        if (!storeTreePopup || !storeFilterTrigger) return;
        const rect = storeFilterTrigger.getBoundingClientRect();
        const gap = 8;
        // 临时显示以测量尺寸
        storeTreePopup.style.visibility = 'hidden';
        storeTreePopup.style.display = 'block';
        const popupH = storeTreePopup.offsetHeight;
        const popupW = storeTreePopup.offsetWidth;
        storeTreePopup.style.display = '';
        storeTreePopup.style.visibility = '';

        // 水平定位（避免右溢出）
        let left = rect.left;
        if (left + popupW > window.innerWidth - 8) left = window.innerWidth - popupW - 8;
        if (left < 8) left = 8;
        storeTreePopup.style.left = left + 'px';

        // 垂直定位（智能上下避溢）
        const spaceBelow = window.innerHeight - rect.bottom;
        if (spaceBelow >= popupH + gap) {
            storeTreePopup.style.top = (rect.bottom + gap) + 'px';
            storeTreePopup.style.bottom = 'auto';
        } else {
            storeTreePopup.style.top = 'auto';
            storeTreePopup.style.bottom = (window.innerHeight - rect.top + gap) + 'px';
        }
    }

    function openStorePopup() {
        renderStoreTree();
        positionStorePopup();
        storeTreePopup.classList.add('open');
    }

    function closeStorePopup() {
        if (storeTreePopup) storeTreePopup.classList.remove('open');
    }

    function toggleStorePopup() {
        if (storeTreePopup.classList.contains('open')) closeStorePopup();
        else openStorePopup();
    }

    // 点击行：可展开项→展开/折叠；不可展开项→勾选/取消（不关闭窗口）
    function handleStoreRowClick(id) {
        if (getStoreChildren(id).length > 0) {
            if (storeTreeExpanded.has(id)) storeTreeExpanded.delete(id);
            else storeTreeExpanded.add(id);
            renderStoreTree();
        } else {
            if (selectedStoreIds.has(id)) selectedStoreIds.delete(id);
            else selectedStoreIds.add(id);
            updateStoreTrigger();
            renderStoreTree();
            applyFilters();
        }
    }

    if (storeFilterTrigger && storeTree && storeTreePopup) {
        // 弹窗移至 body，避免被祖先 stacking context 遮挡
        document.body.appendChild(storeTreePopup);

        storeFilterTrigger.addEventListener('click', function(e) {
            e.stopPropagation();
            toggleStorePopup();
        });
        // 弹窗内任何点击都不冒泡到 document（防止误判为"外侧点击"而关闭）
        storeTreePopup.addEventListener('click', function(e) { e.stopPropagation(); });
        // 树内事件委托：点击整行
        storeTree.addEventListener('click', function(e) {
            e.stopPropagation();
            const row = e.target.closest('.store-node-row');
            if (row) handleStoreRowClick(Number(row.dataset.id));
        });
        // 仅点击窗口外侧时收起
        document.addEventListener('click', function(e) {
            if (e.target.closest('.store-filter')) return;
            if (e.target.closest('.store-tree-popup')) return;
            closeStorePopup();
        });
        // 窗口尺寸变化时重新定位
        window.addEventListener('resize', function() {
            if (storeTreePopup.classList.contains('open')) positionStorePopup();
        });
    }

    // ===== 15. 渲染菜品（淡入淡出） =====
    function renderDishes(dishes) {
        if (!resultList || !resultStatus) return;
        if (!dishes || dishes.length === 0) {
            resultList.innerHTML = '';
            resultStatus.textContent = DISHES_DB.length === 0
                ? '当前无菜品，试试拖入 list.txt 来导入菜品列表'
                : '😅 没找到匹配的菜，试试换个条件吧';
            resultStatus.style.display = 'block';
            return;
        }
        resultStatus.style.display = 'none';
        const data = loadStorage();

        resultList.style.opacity = '0';
        setTimeout(() => {
            let html = dishes.map(d => {
                const isFav = data.favorites.includes(d.id);
                const imgHtml = d.img
                    ? `<img src="${d.img}" alt="${d.name}" />`
                    : `<span class="emoji-placeholder">${d.emoji || '🍽️'}</span>`;
                return `
                <div class="dish-card" data-id="${d.id}" data-dish-id="${d.id}">
                    <div class="dish-image">${imgHtml}</div>
                    <div class="dish-info">
                        <div class="dish-name">
                            ${d.name}
                            <span class="action-btn favorite-star ${isFav ? 'active' : ''}" data-id="${d.id}">${isFav ? '⭐' : '☆'}</span>
                            <span class="action-btn group-trigger" data-id="${d.id}" title="管理分组">📁</span>
                        </div>
                        <div class="dish-meta">
<span>🏫 ${getStorePath(d.storeId)}</span>
                            <span class="rating">⭐ ${d.rating}</span>
                        </div>
                        <div class="dish-tags">
                            ${d.tags.map(t => `<span class="tag">#${t}</span>`).join('')}
                        </div>
                    </div>
                    <div class="dish-price-right">💰 ${d.price}元</div>
                </div>
                `;
            }).join('');
            resultList.innerHTML = html;
            resultList.style.opacity = '1';
            HighlightController.reapply();
        }, 250);
    }

    // ===== 15.5 HighlightController 高亮管理 =====
    const HighlightController = (function() {
        let currentId = null;

        function clearVisual() {
            const cards = resultList.querySelectorAll('.dish-card.' + HIGHLIGHT_CLASS);
            cards.forEach(c => c.classList.remove(HIGHLIGHT_CLASS));
        }

        function set(dishId) {
            clearVisual();
            currentId = dishId;
            if (dishId === null || dishId === undefined) return;
            const card = resultList.querySelector('.dish-card[data-dish-id="' + dishId + '"]');
            if (card) card.classList.add(HIGHLIGHT_CLASS);
            else currentId = null;
        }

        function clear() {
            clearVisual();
            currentId = null;
        }

        function reapply() {
            if (currentId === null) return;
            clearVisual();
            const card = resultList.querySelector('.dish-card[data-dish-id="' + currentId + '"]');
            if (card) card.classList.add(HIGHLIGHT_CLASS);
            else currentId = null;
        }

        function current() { return currentId; }

        return { set, clear, current, reapply };
    })();

    // ===== 15.6 DetailWindow 菜品详情窗口 =====
    const DetailWindow = (function() {
        function open(dishId) {
            const dish = DataSource.getDishById(dishId);
            if (!dish) { showToast('该菜品已不可用'); return; }

            const photoHtml = dish.img
                ? `<img id="detailImg" src="${dish.img}" alt="${dish.name}" />`
                : `<span class="emoji-placeholder">${dish.emoji || '🍽️'}</span>`;

            const tagsHtml = dish.tags.length > 0
                ? dish.tags.map(t => `<span class="tag">#${t}</span>`).join('')
                : `<span class="tag">无标签</span>`;

            const html = `
                <div class="detail-window">
                    <div class="detail-photo">${photoHtml}</div>
                    <div class="detail-name">${dish.name}</div>
                    <div class="detail-meta">
                        <span>🏫 ${dish.storePath || getStorePath(dish.storeId)}</span>
                        <span class="rating">⭐ ${dish.rating}</span>
                        <span>🔥 人气 ${dish.popular}</span>
                        <span>💰 ${dish.price}元</span>
                    </div>
                    <div class="detail-tags">${tagsHtml}</div>
                    <div class="detail-edit">
                        <label class="detail-label">📝 备注</label>
                        <textarea id="detailNote" class="detail-textarea" placeholder="添加备注..." maxlength="200">${dish.note || ''}</textarea>
                        <label class="detail-label">🏷️ 本地类别</label>
                        <input type="text" id="detailLocalCategory" class="detail-input" placeholder="自定义分类" value="${dish.localCategory || ''}" />
                    </div>
                    <div class="modal-actions">
                        <button class="btn-secondary">关闭</button>
                        <button class="manager-create-btn" id="detailEditBtn">✏️ 修改菜品信息</button>
                    </div>
                </div>
            `;

            openModal('菜品详情', html, null);

            setTimeout(() => {
                const imgEl = document.getElementById('detailImg');
                if (imgEl) {
                    imgEl.onerror = function() {
                        this.parentNode.innerHTML = `<span class="emoji-placeholder">${dish.emoji || '🍽️'}</span>`;
                    };
                }
                const noteEl = document.getElementById('detailNote');
                const catEl = document.getElementById('detailLocalCategory');
                if (noteEl) {
                    noteEl.addEventListener('input', function() {
                        UserData.update(dishId, { note: this.value });
                    });
                }
                if (catEl) {
                    catEl.addEventListener('input', function() {
                        UserData.update(dishId, { localCategory: this.value });
                    });
                }
                const editBtn = document.getElementById('detailEditBtn');
                if (editBtn) {
                    editBtn.addEventListener('click', function() {
                        openAddDishModal(dishId);
                    });
                }
            }, 50);
        }

        function close() { closeModal(); }

        return { open, close };
    })();

    // ===== 15.7 DiceButton 随机选择 =====
    const DiceButton = (function() {
        function roll() {
            const list = DataSource.getCurrentPageDishes();
            if (!list || list.length === 0) {
                showToast('当前没有可选菜品');
                return;
            }
            const idx = Math.floor(Math.random() * list.length);
            const target = list[idx];
            HighlightController.set(target.id);
            DetailWindow.open(target.id);
            const card = resultList.querySelector('.dish-card[data-dish-id="' + target.id + '"]');
            if (card) card.scrollIntoView({ behavior: 'smooth', block: 'center' });
        }
        return { roll };
    })();

    // ===== 16. 事件委托（收藏 & 分组管理 & 详情窗口） =====
    if (resultList) {
        resultList.addEventListener('click', function(e) {
            const star = e.target.closest('.favorite-star');
            if (star) {
                e.stopPropagation();
                const id = Number(star.dataset.id);
                if (!isNaN(id)) toggleFavorite(id);
                return;
            }
            const trigger = e.target.closest('.group-trigger');
            if (trigger) {
                e.stopPropagation();
                const id = Number(trigger.dataset.id);
                if (!isNaN(id)) {
                    const dish = DISHES_DB.find(d => d.id === id);
                    if (dish) openGroupManager(dish);
                }
                return;
            }
            // 点击菜品卡片其他区域 → 弹出详情窗口
            const card = e.target.closest('.dish-card');
            if (card) {
                const dishId = Number(card.dataset.dishId);
                if (!isNaN(dishId)) DetailWindow.open(dishId);
            }
        });
    }

    // ===== 17. 收藏功能 =====
    function toggleFavorite(dishId) {
        const data = loadStorage();
        const idx = data.favorites.indexOf(dishId);
        if (idx >= 0) data.favorites.splice(idx, 1);
        else data.favorites.push(dishId);
        saveStorage(data);
        if (currentGroup === 'favorites') applyFilters();
        else renderDishes(currentDishes);
    }

    // ===== 18. 分组管理器（模态框） =====
    function openGroupManager(dish) {
        const data = loadStorage();
        const groups = data.groups;
        let html = `<p class="group-manager-title">将「${dish.name}」加入分组：</p><div style="display:flex;flex-direction:column;gap:6px;max-height:200px;overflow-y:auto;">`;
        if (groups.length === 0) {
            html += `<p class="group-manager-empty">暂无分组，请先创建分组</p>`;
        } else {
            groups.forEach(g => {
                const checked = g.dishes.includes(dish.id) ? 'checked' : '';
                html += `<label class="group-checkbox-label">
                    <input type="checkbox" ${checked} data-group-id="${g.id}" data-dish-id="${dish.id}" class="group-checkbox" />
                    ${g.name}
                </label>`;
            });
        }
        html += `</div>
        <div style="margin-top:12px;"><button class="manager-create-btn" id="createNewGroupFromManager">➕ 新建分组</button></div>
        <div class="modal-actions"><button class="btn-secondary">完成</button></div>`;

        openModal('管理分组', html, null);

        setTimeout(() => {
            document.querySelectorAll('.group-checkbox').forEach(cb => {
                cb.addEventListener('change', function() {
                    const dishId = Number(this.dataset.dishId);
                    const groupId = this.dataset.groupId;
                    toggleDishInGroup(dishId, groupId);
                    renderGroupButtons();
                });
            });
            const createBtn = document.getElementById('createNewGroupFromManager');
            if (createBtn) {
                createBtn.addEventListener('click', function() {
                    openModal('新建分组', `<input type="text" id="newGroupNameInput" placeholder="输入分组名称" /><div class="modal-actions"><button class="btn-secondary">取消</button><button class="btn-primary">创建</button></div>`, function() {
                        const nameInput = document.getElementById('newGroupNameInput');
                        if (nameInput && nameInput.value.trim()) {
                            const newGroup = addGroup(nameInput.value.trim());
                            toggleDishInGroup(dish.id, newGroup.id);
                            openGroupManager(dish);
                            return false;
                        } else {
                            return false;
                        }
                    });
                });
            }
        }, 50);
    }

    // ===== 19. 推荐逻辑 =====
    function getRecommend(userInput) {
        const input = userInput.trim();
        if (!input) {
            setStatus('💡 输入点什么吧，比如 "一食堂二楼" 或 "清淡的"');
            return;
        }
        setStatus('🤔 AI正在思考今天吃什么', true);

        setTimeout(() => {
            let matched = DISHES_DB.filter(d => {
                const text = (d.name + getStorePath(d.storeId) + d.tags.join('')).toLowerCase();
                const kw = input.toLowerCase();
                return text.includes(kw) || kw.split(/\s+/).some(w => text.includes(w));
            });
            if (matched.length < 2 && input.length > 1) {
                matched = DISHES_DB.filter(d => {
                    const text = (d.name + getStorePath(d.storeId) + d.tags.join('')).toLowerCase();
                    return input.split('').some(ch => ch.length && text.includes(ch));
                });
            }
            if (matched.length === 0) {
                matched = DISHES_DB.map(d => ({ ...d, tags: [...d.tags, '🔥 今日推荐'] }));
            }
            matched = matched.slice(0, 6);
            currentGroup = 'all';
            renderGroupButtons();
            currentDishes = matched;
            renderDishes(matched);
            resultStatus.style.display = 'none';
        }, 800);
    }

    function setStatus(text, isLoading = false) {
        if (!resultList || !resultStatus) return;
        resultList.innerHTML = '';
        resultStatus.style.display = 'block';
        resultStatus.textContent = text;
        if (isLoading) resultStatus.classList.add('loading-dots');
        else resultStatus.classList.remove('loading-dots');
    }

    // ===== 20. 好评榜 / 避雷榜 / 重置 =====
    function showGoodRank() {
        const sorted = [...DISHES_DB].sort((a, b) => b.rating - a.rating);
        currentGroup = 'all';
        renderGroupButtons();
        currentDishes = sorted;
        renderDishes(sorted);
        resultStatus.style.display = 'none';
    }

    function showBadRank() {
        if (!resultList || !resultStatus) return;
        if (BAD_REVIEWS.length === 0) {
            setStatus('🎉 暂时没有避雷记录，大家吃得都挺满意！');
            return;
        }
        resultStatus.style.display = 'none';
        resultList.innerHTML = BAD_REVIEWS.map(d => `
            <div class="dish-card" style="border-color:#fecaca;">
                <div class="dish-image"><span class="emoji-placeholder">${d.emoji || '💣'}</span></div>
                <div class="dish-info">
                    <div class="dish-name">${d.name}</div>
                    <div class="dish-meta"><span>🏫 ${d.canteen}</span></div>
                    <div class="dish-tags"><span class="tag bad">💥 避雷：${d.reason}</span></div>
                </div>
            </div>
        `).join('');
    }

    // 重置全部筛选条件并显示全部菜品
    function resetFilters() {
        searchInput.value = '';
        currentGroup = 'all';
        currentSort = 'default';
        selectSelected.textContent = '默认排序 ▾';
        selectOptions.querySelectorAll('.select-option').forEach(o => o.classList.remove('selected'));
        selectOptions.querySelector('.select-option[data-value="default"]')?.classList.add('selected');
        selectedStoreIds.clear();
        updateStoreTrigger();
        // 重置标签状态为 none
        const states = getTagStates();
        Object.keys(states).forEach(t => states[t] = 'none');
        saveStorage({ ...loadStorage(), tagStates: states });
        renderTagModes();
        renderGroupButtons();
        HighlightController.clear();
        applyFilters();
    }

    // ===== 21. 静态事件绑定 =====
    if (recommendBtn) {
        recommendBtn.addEventListener('click', () => getRecommend(searchInput.value));
    }
    if (searchInput) {
        searchInput.addEventListener('keydown', (e) => { if (e.key === 'Enter') getRecommend(searchInput.value); });
    }
    filterTags.forEach(tag => {
        tag.addEventListener('click', () => {
            searchInput.value = tag.dataset.tag;
            getRecommend(tag.dataset.tag);
        });
    });
    if (showGood) showGood.addEventListener('click', showGoodRank);
    if (showBad) showBad.addEventListener('click', showBadRank);
    if (resetViewBtn) resetViewBtn.addEventListener('click', resetFilters);
    const resetFiltersBtn = $('resetFiltersBtn');
    if (resetFiltersBtn) {
        resetFiltersBtn.addEventListener('click', function() {
            resetFilters();
        });
    }

    // ===== 21.5 导出/导入 list.txt / save.txt 与骰子按钮 =====
    if (exportListBtn) {
        exportListBtn.addEventListener('click', async function() {
            const dishes = DataSource.getAllDishes();
            const content = ListTxtSerializer.serialize(dishes);
            const ok = await FileGateway.writeText('list.txt', content);
            if (ok) showToast('导出完成');
            else showToast('导出失败，请检查文件权限或磁盘空间');
        });
    }
    if (importListBtn) {
        importListBtn.addEventListener('click', async function() {
            const text = await FileGateway.readText('list.txt');
            if (text === null) { showToast('未选择文件或读取失败'); return; }
            const ok = await importListFromText(text);
            if (ok) await persistListFile();
        });
    }
    if (exportSaveBtn) {
        exportSaveBtn.addEventListener('click', async function() {
            const ok = await UserData.exportSave();
            if (ok) showToast('save.txt 导出完成');
            else showToast('导出失败，请检查文件权限或磁盘空间');
        });
    }
    if (importSaveBtn) {
        importSaveBtn.addEventListener('click', async function() {
            const res = await UserData.importSave();
            if (!res.ok) {
                if (res.reason === 'corrupt') showToast('配置文件损坏，已取消导入');
                else showToast('未选择文件或读取失败');
                return;
            }
            applyFilters();
            showToast('save.txt 导入完成');
        });
    }
    if (diceBtn) {
        diceBtn.addEventListener('click', function() {
            diceBtn.classList.add('dice-rolling');
            setTimeout(() => diceBtn.classList.remove('dice-rolling'), 450);
            DiceButton.roll();
        });
    }

    // ===== 21.6 手动导入单个菜品（含图片写入 Pictures）=====
    function getImageExt(filename) {
        const m = (filename || '').match(/(\.[a-zA-Z0-9]+)$/);
        const ext = m ? m[1].toLowerCase() : '.jpg';
        return ['.jpg', '.jpeg', '.png', '.webp', '.gif', '.bmp'].includes(ext) ? ext : '.jpg';
    }

    function openAddDishModal(editDishId) {
        const isEdit = editDishId != null;
        const editDish = isEdit ? DISHES_DB.find(d => d.id === editDishId) : null;
        const editUserData = isEdit ? UserData.get(editDishId) : null;
        const nextId = isEdit ? editDish.id : (DISHES_DB.reduce((m, d) => Math.max(m, d.id), 0) + 1);
        const storeOptions = STORES_DB
            .filter(s => s.id !== STORE_ROOT_ID)
            .map(s => `<option value="${s.id}"${isEdit && editDish && editDish.storeId === s.id ? ' selected' : ''}>${getStorePath(s.id)}</option>`)
            .join('');
        const valName = isEdit && editDish ? editDish.name : '';
        const valPrice = isEdit && editDish ? editDish.price : '';
        const valTags = isEdit && editDish && editDish.tags ? editDish.tags.join(',') : '';
        const valNote = isEdit && editUserData ? (editUserData.note || '') : '';
        const valCat = isEdit && editUserData ? (editUserData.localCategory || '') : '';
        const valEmoji = isEdit && editDish ? (editDish.emoji || '') : '';
        const valImg = isEdit && editDish ? (editDish.img || '') : '';
        const titleText = isEdit ? '修改菜品信息' : '导入菜品';
        const saveBtnText = isEdit ? '💾 保存修改' : '💾 保存菜品';
        const html = `
            <div class="dish-import-form">
                <div class="form-field"><label>菜品编号</label><input type="number" id="impDishId" value="${nextId}" min="1" /></div>
                <div class="form-field"><label>菜品名称 *</label><input type="text" id="impDishName" placeholder="必填" value="${valName}" /></div>
                <div class="form-field"><label>价格（元）</label><input type="number" id="impDishPrice" min="0" step="0.5" value="${valPrice}" /></div>
                <div class="form-field"><label>所属店铺</label><select id="impDishStore">${storeOptions}</select></div>
                <div class="form-field full">
                    <label class="store-new-toggle"><input type="checkbox" id="impNewStoreToggle" /> 新建店铺节点（新食堂 / 楼层 / 窗口 / 独立店）</label>
                </div>
                <div class="store-new-box" id="impNewStoreBox" style="display:none;">
                    <div class="form-field"><label>节点类型</label>
                        <select id="impNewStoreType">
                            <option value="window">窗口（挂在楼层下）</option>
                            <option value="floor">楼层（挂在食堂下）</option>
                            <option value="canteen">食堂</option>
                            <option value="standalone">独立店</option>
                        </select>
                    </div>
                    <div class="form-field" id="impNewStoreParentField"><label>父节点</label>
                        <select id="impNewStoreParent"></select>
                    </div>
                    <div class="form-field"><label>店铺名称</label><input type="text" id="impNewStoreName" placeholder="如：麻辣烫窗口" /></div>
                </div>
                <div class="form-field full"><label>标签（逗号分隔）</label><input type="text" id="impDishTags" placeholder="如：辣,人气" value="${valTags}" /></div>
                <div class="form-field full"><label>备注</label><input type="text" id="impDishNote" value="${valNote}" /></div>
                <div class="form-field"><label>本地类别</label><input type="text" id="impDishLocalCategory" value="${valCat}" /></div>
                <div class="form-field"><label>Emoji</label><input type="text" id="impDishEmoji" placeholder="🍽️" maxlength="4" value="${valEmoji}" /></div>
                <div class="form-field full"><label>图片路径（可选，上传图片后自动填充）</label><input type="text" id="impDishImg" placeholder="Pictures/1-1.jpg" value="${valImg}" /></div>
                <div class="form-field full"><label>上传图片（可多张，按「菜品编号-照片编号」命名保存）</label><input type="file" id="impDishFiles" accept="image/*" multiple /></div>
                <div class="dish-import-preview" id="impDishPreview"></div>
                <p class="dish-import-tip">图片将写入 index.html 同级目录的 Pictures 文件夹（首次保存时需在弹窗中选择项目文件夹）；新建店铺节点会自动保存，刷新后仍可用。</p>
            </div>
            <div class="modal-actions">
                <button class="btn-secondary">取消</button>
                <button class="manager-create-btn" id="impDishSaveBtn">${saveBtnText}</button>
            </div>
        `;
        openModal(titleText, html, null);
        setTimeout(() => {
            const filesInput = document.getElementById('impDishFiles');
            const preview = document.getElementById('impDishPreview');
            if (filesInput && preview) {
                filesInput.addEventListener('change', function() {
                    preview.innerHTML = '';
                    Array.from(this.files || []).forEach(f => {
                        const img = document.createElement('img');
                        img.src = URL.createObjectURL(f);
                        preview.appendChild(img);
                    });
                });
            }
            // 新店铺子表单联动
            const newToggle = document.getElementById('impNewStoreToggle');
            const newBox = document.getElementById('impNewStoreBox');
            const typeSel = document.getElementById('impNewStoreType');
            function updateNewStoreParentOptions() {
                const parentField = document.getElementById('impNewStoreParentField');
                const parentSel = document.getElementById('impNewStoreParent');
                if (!parentField || !parentSel || !typeSel) return;
                const type = typeSel.value;
                if (type === 'canteen' || type === 'standalone') {
                    parentField.style.display = 'none';
                    return;
                }
                parentField.style.display = '';
                const wanted = type === 'floor' ? 'canteen' : 'floor';
                const options = STORES_DB
                    .filter(s => s.id !== STORE_ROOT_ID && getStoreType(s) === wanted)
                    .map(s => `<option value="${s.id}">${getStorePath(s.id)}</option>`)
                    .join('');
                parentSel.innerHTML = options;
            }
            if (newToggle && newBox && typeSel) {
                newToggle.addEventListener('change', function() {
                    newBox.style.display = this.checked ? 'grid' : 'none';
                    if (this.checked) updateNewStoreParentOptions();
                });
                typeSel.addEventListener('change', updateNewStoreParentOptions);
            }
            const saveBtn = document.getElementById('impDishSaveBtn');
            if (saveBtn) saveBtn.addEventListener('click', function() { saveImportedDish(editDishId); });
        }, 50);
    }

    async function saveImportedDish(editDishId) {
        const isEdit = editDishId != null;
        const idInput = document.getElementById('impDishId');
        const nameInput = document.getElementById('impDishName');
        const dishId = Number(idInput && idInput.value);
        const name = nameInput ? nameInput.value.trim() : '';
        if (!dishId || dishId <= 0) { showToast('请填写有效的菜品编号'); return; }
        if (DISHES_DB.some(d => d.id === dishId && d.id !== editDishId)) { showToast('菜品编号 ' + dishId + ' 已存在，请更换'); return; }
        if (!name) { showToast('请填写菜品名称'); return; }

        const price = Number((document.getElementById('impDishPrice') || {}).value) || 0;
        // 店铺：从已有节点选择，或新建节点（食堂/楼层/窗口/独立店）
        let storeId;
        const newToggle = document.getElementById('impNewStoreToggle');
        if (newToggle && newToggle.checked) {
            const newName = ((document.getElementById('impNewStoreName') || {}).value || '').trim();
            const newType = (document.getElementById('impNewStoreType') || {}).value || 'window';
            const parentId = Number((document.getElementById('impNewStoreParent') || {}).value);
            if (!newName) { showToast('请填写新店铺名称'); return; }
            if ((newType === 'floor' || newType === 'window') && (!parentId || !getStoreNode(parentId))) {
                showToast('请选择新店铺的父节点'); return;
            }
            const effParent = (newType === 'canteen' || newType === 'standalone') ? STORE_ROOT_ID : parentId;
            storeId = addStoreNode(newName, effParent, newType).id;
        } else {
            storeId = Number((document.getElementById('impDishStore') || {}).value) || null;
        }
        const tags = ((document.getElementById('impDishTags') || {}).value || '').split(/[,，]/).map(t => t.trim()).filter(Boolean);
        const note = (document.getElementById('impDishNote') || {}).value || '';
        const localCategory = (document.getElementById('impDishLocalCategory') || {}).value || '';
        const emoji = ((document.getElementById('impDishEmoji') || {}).value || '').trim() || '🍽️';
        let imgPath = ((document.getElementById('impDishImg') || {}).value || '').trim();
        const filesInput = document.getElementById('impDishFiles');
        const files = Array.from((filesInput && filesInput.files) || []);

        // 保存图片：写入 Pictures 文件夹，命名 菜品编号-照片编号
        if (files.length > 0) {
            const dir = await FileGateway.ensurePicturesDir();
            if (dir) {
                for (let i = 0; i < files.length; i++) {
                    const fname = dishId + '-' + (i + 1) + getImageExt(files[i].name);
                    const ok = await FileGateway.writeImageToPictures(dir, fname, files[i]);
                    if (ok && i === 0) imgPath = 'Pictures/' + fname;
                }
            } else {
                for (let i = 0; i < files.length; i++) {
                    const fname = dishId + '-' + (i + 1) + getImageExt(files[i].name);
                    FileGateway.downloadBlob(fname, files[i]);
                }
                if (!imgPath) imgPath = 'Pictures/' + dishId + '-1' + getImageExt(files[0].name);
                showToast('浏览器不支持直接写入，图片已下载，请手动放入 Pictures 文件夹');
            }
        }

        if (isEdit) {
            const dish = DISHES_DB.find(d => d.id === editDishId);
            if (!dish) { showToast('原菜品不存在，已取消修改'); return; }
            const oldRating = dish.rating || 0;
            const oldPopular = dish.popular || 0;
            dish.id = dishId;
            dish.name = name;
            dish.price = price;
            dish.storeId = storeId;
            dish.tags = tags;
            dish.emoji = emoji;
            dish.img = imgPath;
            dish.rating = oldRating;
            dish.popular = oldPopular;
            UserData.update(dishId, { note: note, localCategory: localCategory });
            initTagModes();
            applyFilters();
            closeModal();
            showToast('菜品「' + name + '」修改完成');
        } else {
            DISHES_DB.push({
                id: dishId,
                name: name,
                price: price,
                storeId: storeId,
                rating: 0,
                tags: tags,
                popular: 0,
                note: note,
                localCategory: localCategory,
                emoji: emoji,
                img: imgPath
            });
            UserData.update(dishId, { note: note, localCategory: localCategory });
            initTagModes();
            applyFilters();
            closeModal();
            showToast('菜品「' + name + '」导入完成');
        }
        await persistListFile();
    }

    const addDishBtn = $('addDishBtn');
    if (addDishBtn) {
        addDishBtn.addEventListener('click', openAddDishModal);
    }

    // ===== 21.7 拖拽导入 list.txt =====
    const dropOverlay = $('dropOverlay');
    let dragCounter = 0;
    if (dropOverlay) {
        document.addEventListener('dragenter', function(e) {
            if (e.dataTransfer && e.dataTransfer.types && Array.from(e.dataTransfer.types).includes('Files')) {
                e.preventDefault();
                dragCounter++;
                dropOverlay.classList.add('active');
            }
        });
        document.addEventListener('dragover', function(e) {
            if (e.dataTransfer && e.dataTransfer.types && Array.from(e.dataTransfer.types).includes('Files')) {
                e.preventDefault();
                e.dataTransfer.dropEffect = 'copy';
            }
        });
        document.addEventListener('dragleave', function(e) {
            if (e.dataTransfer && e.dataTransfer.types && Array.from(e.dataTransfer.types).includes('Files')) {
                e.preventDefault();
                dragCounter--;
                if (dragCounter <= 0) {
                    dragCounter = 0;
                    dropOverlay.classList.remove('active');
                }
            }
        });
        document.addEventListener('drop', async function(e) {
            e.preventDefault();
            dragCounter = 0;
            dropOverlay.classList.remove('active');
            const files = e.dataTransfer.files;
            if (!files || files.length === 0) return;
            let txtFile = null;
            for (let i = 0; i < files.length; i++) {
                if (files[i].name.toLowerCase().endsWith('.txt')) { txtFile = files[i]; break; }
            }
            if (!txtFile) { showToast('请拖入 list.txt 文件'); return; }
            try {
                const text = await txtFile.text();
                await importListFromText(text);
            } catch (err) {
                console.warn('拖拽导入失败:', err);
                showToast('导入失败');
            }
        });
    }

    // ===== 22. 初始化 =====
    initThemes();
    UserData.loadAll();
    initTagModes();
    renderGroupButtons();
    updateStoreTrigger();
    resetFilters();
    // 异步从同级 list.txt 载入（fetch 读取，成功则替换 DISHES_DB 并刷新）
    bootstrapListFile().then(() => { applyFilters(); });

    console.log('✅ 「下课吃啥」已启动！所有功能正常。');
});