// 项目数据
const projectsData = [
    {
        id: 1,
        title: "智慧工厂",
        date: "2024-06-08 15:56:35",
        type: "industrial",
        image: "🏭",
        favorite: true
    },
    {
        id: 2,
        title: "智慧水务",
        date: "2023-01-10 12:09:04",
        type: "smart",
        image: "💧",
        favorite: false
    },
    {
        id: 3,
        title: "数字工厂",
        date: "2024-06-07 06:57:46",
        type: "industrial",
        image: "🏗️",
        favorite: false
    },
    {
        id: 4,
        title: "智慧监控",
        date: "2024-07-28 17:38:02",
        type: "smart",
        image: "📊",
        favorite: true
    },
    {
        id: 5,
        title: "工业设计平台",
        date: "2025-02-28 18:00:05",
        type: "design",
        image: "🎨",
        favorite: false
    }
];

// DOM 元素
const createProjectBtn = document.getElementById('createProjectBtn');
const createProjectModal = document.getElementById('createProjectModal');
const importProjectModal = document.getElementById('importProjectModal');
const closeCreateModal = document.getElementById('closeCreateModal');
const closeImportModal = document.getElementById('closeImportModal');
const cancelCreate = document.getElementById('cancelCreate');
const cancelImport = document.getElementById('cancelImport');
const confirmCreate = document.getElementById('confirmCreate');
const confirmImport = document.getElementById('confirmImport');
const projectsGrid = document.getElementById('projectsGrid');
const uploadZone = document.getElementById('uploadZone');
const fileInput = document.getElementById('fileInput');
const projectNameInput = document.getElementById('projectName');

// 搜索和过滤相关元素
let searchBtn, filterBtn, searchFilterArea, searchInput, sortSelect, typeFilter;

// 过滤和排序状态
let filteredProjects = [...projectsData];
let currentSearchTerm = '';
let currentSortBy = 'date-desc';
let currentTypeFilter = 'all';

// 初始化
document.addEventListener('DOMContentLoaded', function() {
    initializeSearchElements();
    renderProjects();
    initEventListeners();
});

// 初始化搜索相关元素
function initializeSearchElements() {
    searchBtn = document.getElementById('searchBtn');
    filterBtn = document.getElementById('filterBtn');
    searchFilterArea = document.getElementById('searchFilterArea');
    searchInput = document.getElementById('searchInput');
    sortSelect = document.getElementById('sortSelect');
    typeFilter = document.getElementById('typeFilter');
}

// 渲染项目列表
function renderProjects() {
    projectsGrid.innerHTML = '';

    // 应用过滤和排序
    applyFiltersAndSort();

    if (filteredProjects.length === 0) {
        projectsGrid.innerHTML = `
            <div class="no-projects">
                <i class="fas fa-folder-open"></i>
                <p>没有找到匹配的项目</p>
            </div>
        `;
        return;
    }

    filteredProjects.forEach(project => {
        const projectCard = document.createElement('div');
        projectCard.className = 'project-card';
        projectCard.innerHTML = `
            <div class="project-header">
                <div class="project-title">${project.title}</div>
                <div class="project-header-actions">
                    ${project.favorite ? '<i class="fas fa-star favorite-icon" title="已收藏"></i>' : ''}
                    <div class="project-menu" data-project-id="${project.id}">
                        <i class="fas fa-ellipsis-v"></i>
                    </div>
                </div>
            </div>
            <div class="project-image">
                ${project.image}
                <div class="project-type-badge">${getProjectTypeLabel(project.type)}</div>
            </div>
            <div class="project-footer">
                <div class="project-date">${project.date}</div>
            </div>
        `;

        // 项目卡片点击事件（排除菜单按钮）
        projectCard.addEventListener('click', (e) => {
            if (!e.target.closest('.project-menu')) {
                openProject(project.id);
            }
        });

        // 菜单按钮点击事件
        const menuBtn = projectCard.querySelector('.project-menu');
        menuBtn.addEventListener('click', (e) => {
            e.stopPropagation();
            showProjectMenu(project.id, menuBtn);
        });

        projectsGrid.appendChild(projectCard);
    });
}

// 应用过滤和排序
function applyFiltersAndSort() {
    // 首先应用搜索过滤
    filteredProjects = projectsData.filter(project => {
        const matchesSearch = currentSearchTerm === '' ||
            project.title.toLowerCase().includes(currentSearchTerm.toLowerCase());

        const matchesType = currentTypeFilter === 'all' ||
            project.type === currentTypeFilter;

        return matchesSearch && matchesType;
    });

    // 然后应用排序
    filteredProjects.sort((a, b) => {
        switch (currentSortBy) {
            case 'date-desc':
                return new Date(b.date) - new Date(a.date);
            case 'date-asc':
                return new Date(a.date) - new Date(b.date);
            case 'name-asc':
                return a.title.localeCompare(b.title);
            case 'name-desc':
                return b.title.localeCompare(a.title);
            default:
                return 0;
        }
    });
}

// 初始化事件监听器
function initEventListeners() {
    // 创建项目按钮 - 顶部和侧边栏
    createProjectBtn.addEventListener('click', () => {
        showModal(createProjectModal);
    });

    const sidebarCreateBtn = document.getElementById('sidebarCreateBtn');
    const sidebarImportBtn = document.getElementById('sidebarImportBtn');

    if (sidebarCreateBtn) {
        sidebarCreateBtn.addEventListener('click', () => {
            showModal(createProjectModal);
        });
    }

    if (sidebarImportBtn) {
        sidebarImportBtn.addEventListener('click', () => {
            showModal(importProjectModal);
        });
    }

    // 关闭模态框
    closeCreateModal.addEventListener('click', () => {
        hideModal(createProjectModal);
    });

    closeImportModal.addEventListener('click', () => {
        hideModal(importProjectModal);
    });

    // 取消按钮
    cancelCreate.addEventListener('click', () => {
        hideModal(createProjectModal);
    });

    cancelImport.addEventListener('click', () => {
        hideModal(importProjectModal);
    });

    // 确认按钮
    confirmCreate.addEventListener('click', () => {
        createProject();
    });

    confirmImport.addEventListener('click', () => {
        importProject();
    });

    // 树状结构展开/折叠
    initTreeStructure();

    // 搜索和过滤功能
    initSearchAndFilter();
    
    // 模板选择
    const templateItems = document.querySelectorAll('.template-item');
    templateItems.forEach(item => {
        item.addEventListener('click', () => {
            templateItems.forEach(t => t.classList.remove('selected'));
            item.classList.add('selected');
            updateTemplateDescription(item.dataset.template);
        });
    });
    
    // 文件上传
    uploadZone.addEventListener('click', () => {
        fileInput.click();
    });
    
    uploadZone.addEventListener('dragover', (e) => {
        e.preventDefault();
        uploadZone.classList.add('dragover');
    });
    
    uploadZone.addEventListener('dragleave', () => {
        uploadZone.classList.remove('dragover');
    });
    
    uploadZone.addEventListener('drop', (e) => {
        e.preventDefault();
        uploadZone.classList.remove('dragover');
        handleFileUpload(e.dataTransfer.files);
    });
    
    fileInput.addEventListener('change', (e) => {
        handleFileUpload(e.target.files);
    });
    
    // 点击模态框外部关闭
    createProjectModal.addEventListener('click', (e) => {
        if (e.target === createProjectModal) {
            hideModal(createProjectModal);
        }
    });
    
    importProjectModal.addEventListener('click', (e) => {
        if (e.target === importProjectModal) {
            hideModal(importProjectModal);
        }
    });
    
    // 导航菜单项点击
    const navItems = document.querySelectorAll('.nav-item');
    navItems.forEach(item => {
        item.addEventListener('click', () => {
            navItems.forEach(nav => nav.classList.remove('active'));
            item.classList.add('active');

            // 更新面包屑导航
            updateBreadcrumb(item);

            // 根据页面类型过滤项目
            const pageType = item.dataset.page;
            if (pageType) {
                filterProjectsByPage(pageType);
            }
        });
    });

    // 浏览位置按钮
    const browseLocationBtn = document.getElementById('browseLocation');
    if (browseLocationBtn) {
        browseLocationBtn.addEventListener('click', () => {
            browseProjectLocation();
        });
    }
    
    // 视图切换
    const viewBtns = document.querySelectorAll('.view-btn[data-view]');
    viewBtns.forEach(btn => {
        btn.addEventListener('click', () => {
            viewBtns.forEach(v => v.classList.remove('active'));
            btn.classList.add('active');
            
            const view = btn.dataset.view;
            if (view === 'list') {
                projectsGrid.style.gridTemplateColumns = '1fr';
            } else {
                projectsGrid.style.gridTemplateColumns = 'repeat(auto-fill, minmax(280px, 1fr))';
            }
        });
    });
    
    // 添加导入项目的快捷方式
    const importBtn = document.createElement('button');
    importBtn.className = 'btn-secondary';
    importBtn.innerHTML = '<i class="fas fa-upload"></i> 导入';
    importBtn.style.marginLeft = '10px';
    importBtn.addEventListener('click', () => {
        showModal(importProjectModal);
    });
    
    const topActions = document.querySelector('.top-actions');
    topActions.insertBefore(importBtn, createProjectBtn);
}

// 显示模态框
function showModal(modal) {
    modal.classList.add('show');
    document.body.style.overflow = 'hidden';
}

// 隐藏模态框
function hideModal(modal) {
    modal.classList.remove('show');
    document.body.style.overflow = 'auto';
    
    // 重置表单
    if (modal === createProjectModal) {
        projectNameInput.value = '';
        document.querySelectorAll('.template-item').forEach(item => {
            item.classList.remove('selected');
        });
    }
}

// 创建项目
function createProject() {
    const projectName = projectNameInput.value.trim();
    const selectedTemplate = document.querySelector('.template-item.selected');
    
    if (!projectName) {
        alert('请输入项目名称');
        return;
    }
    
    if (!selectedTemplate) {
        alert('请选择项目模板');
        return;
    }
    
    const templateType = selectedTemplate.dataset.template;
    const templateIcons = {
        empty: '📄',
        industrial: '🏭',
        vr: '🥽',
        smart: '📊',
        game: '🎮'
    };
    
    const newProject = {
        id: projectsData.length + 1,
        title: projectName,
        date: new Date().toLocaleString('zh-CN'),
        type: templateType,
        image: templateIcons[templateType] || '📄'
    };
    
    projectsData.unshift(newProject);
    renderProjects();
    hideModal(createProjectModal);
    
    // 显示成功消息
    showNotification('项目创建成功！', 'success');
}

// 导入项目
function importProject() {
    const files = fileInput.files;
    if (files.length === 0) {
        alert('请选择要导入的文件');
        return;
    }
    
    // 模拟导入过程
    showNotification('正在导入项目...', 'info');
    
    setTimeout(() => {
        const newProject = {
            id: projectsData.length + 1,
            title: `导入的项目_${Date.now()}`,
            date: new Date().toLocaleString('zh-CN'),
            type: 'imported',
            image: '📦'
        };
        
        projectsData.unshift(newProject);
        renderProjects();
        hideModal(importProjectModal);
        showNotification('项目导入成功！', 'success');
    }, 2000);
}

// 处理文件上传
function handleFileUpload(files) {
    if (files.length > 0) {
        const file = files[0];
        const allowedTypes = ['.zip', '.rar', '.7z'];
        const fileExtension = '.' + file.name.split('.').pop().toLowerCase();

        if (allowedTypes.includes(fileExtension)) {
            fileInput.files = files;
            uploadZone.innerHTML = `
                <i class="fas fa-file-archive"></i>
                <p>已选择文件: ${file.name}</p>
                <button class="btn-upload">重新选择</button>
            `;
        } else {
            alert('请选择支持的文件格式 (.zip, .rar, .7z)');
        }
    }
}

// 打开项目
function openProject(projectId) {
    const project = projectsData.find(p => p.id === projectId);
    if (project) {
        showNotification(`正在打开项目: ${project.title}`, 'info');
        // 这里可以添加实际的项目打开逻辑
    }
}

// 显示通知
function showNotification(message, type = 'info') {
    const notification = document.createElement('div');
    notification.className = `notification ${type}`;
    notification.textContent = message;
    notification.style.cssText = `
        position: fixed;
        top: 20px;
        right: 20px;
        padding: 15px 20px;
        background: ${type === 'success' ? '#10b981' : type === 'error' ? '#ef4444' : '#3b82f6'};
        color: white;
        border-radius: 8px;
        z-index: 3000;
        animation: slideIn 0.3s ease;
    `;

    document.body.appendChild(notification);

    setTimeout(() => {
        notification.style.animation = 'slideOut 0.3s ease';
        setTimeout(() => {
            if (document.body.contains(notification)) {
                document.body.removeChild(notification);
            }
        }, 300);
    }, 3000);
}

// 打开项目
function openProject(projectId) {
    const project = projectsData.find(p => p.id === projectId);
    if (project) {
        showNotification(`正在打开项目: ${project.title}`, 'info');
        // 这里可以添加实际的项目打开逻辑
    }
}

// 显示通知
function showNotification(message, type = 'info') {
    const notification = document.createElement('div');
    notification.className = `notification ${type}`;
    notification.textContent = message;
    notification.style.cssText = `
        position: fixed;
        top: 20px;
        right: 20px;
        padding: 15px 20px;
        background: ${type === 'success' ? '#10b981' : type === 'error' ? '#ef4444' : '#3b82f6'};
        color: white;
        border-radius: 8px;
        z-index: 3000;
        animation: slideIn 0.3s ease;
    `;

    document.body.appendChild(notification);

    setTimeout(() => {
        notification.style.animation = 'slideOut 0.3s ease';
        setTimeout(() => {
            if (document.body.contains(notification)) {
                document.body.removeChild(notification);
            }
        }, 300);
    }, 3000);
}

// 更新模板描述
function updateTemplateDescription(templateType) {
    const templateDescription = document.getElementById('templateDescription');
    if (!templateDescription) return;

    const descriptions = {
        empty: {
            title: '空白项目模板',
            description: '从零开始创建项目，适合有经验的开发者。提供基础的项目结构和配置文件，您可以根据需要自由定制。'
        },
        industrial: {
            title: '工业项目模板',
            description: '专为工业应用设计的项目模板。包含工业设备监控、数据采集、生产流程管理等常用功能模块和界面组件。'
        },
        vr: {
            title: 'VR虚拟现实模板',
            description: '虚拟现实项目模板，集成VR交互组件和3D场景管理。适合创建沉浸式体验、虚拟展示和培训应用。'
        },
        smart: {
            title: '智能可视化大屏模板',
            description: '智能数据可视化大屏模板，包含丰富的图表组件、实时数据展示和响应式布局。适合创建监控中心和数据分析平台。'
        },
        game: {
            title: '游戏开发模板',
            description: '游戏开发项目模板，提供游戏引擎集成、资源管理、场景编辑等功能。适合2D/3D游戏和交互应用开发。'
        }
    };

    const template = descriptions[templateType];
    if (template) {
        templateDescription.innerHTML = `
            <h4>${template.title}</h4>
            <p>${template.description}</p>
        `;
    }
}

// 更新面包屑导航
function updateBreadcrumb(navItem) {
    const breadcrumb = document.getElementById('breadcrumb');
    if (!breadcrumb) return;

    const pageNames = {
        'all-projects': { section: '我的项目', page: '项目概览' },
        'favorite-projects': { section: '我的项目', page: '收藏项目' },
        'recent-projects': { section: '我的项目', page: '最近项目' },
        'industrial-projects': { section: '我的项目', page: '工业项目' },
        'smart-projects': { section: '我的项目', page: '智能项目' },
        'vr-projects': { section: '我的项目', page: 'VR项目' },
        'resource-category': { section: '内容管理', page: '资源分类' },
        'category-management': { section: '内容管理', page: '分类管理' },
        'asset-library': { section: '内容管理', page: '资源库' },
        'template-library': { section: '内容管理', page: '模板库' }
    };

    const pageType = navItem.dataset.page;
    const pageInfo = pageNames[pageType];

    if (pageInfo) {
        breadcrumb.innerHTML = `
            <span>${pageInfo.section}</span>
            <span>/</span>
            <span>${pageInfo.page}</span>
        `;
    }
}

// 根据页面类型过滤项目
function filterProjectsByPage(pageType) {
    const contentHeader = document.querySelector('.content-header h1');

    switch (pageType) {
        case 'all-projects':
            currentTypeFilter = 'all';
            if (contentHeader) contentHeader.textContent = '全部项目';
            break;
        case 'favorite-projects':
            currentTypeFilter = 'all';
            if (contentHeader) contentHeader.textContent = '收藏项目';
            // 这里可以添加收藏项目的过滤逻辑
            break;
        case 'recent-projects':
            currentTypeFilter = 'all';
            if (contentHeader) contentHeader.textContent = '最近项目';
            // 按日期排序显示最近的项目
            currentSortBy = 'date-desc';
            break;
        case 'industrial-projects':
            currentTypeFilter = 'industrial';
            if (contentHeader) contentHeader.textContent = '工业项目';
            break;
        case 'smart-projects':
            currentTypeFilter = 'smart';
            if (contentHeader) contentHeader.textContent = '智能项目';
            break;
        case 'vr-projects':
            currentTypeFilter = 'vr';
            if (contentHeader) contentHeader.textContent = 'VR项目';
            break;
        default:
            currentTypeFilter = 'all';
            if (contentHeader) contentHeader.textContent = '全部项目';
    }

    // 更新过滤器选择框
    if (typeFilter) {
        typeFilter.value = currentTypeFilter;
    }

    // 重新渲染项目
    renderProjects();
}

// 浏览项目位置
function browseProjectLocation() {
    const projectLocationInput = document.getElementById('projectLocation');
    if (!projectLocationInput) return;

    // 尝试调用系统文件选择器
    if (window.showDirectoryPicker) {
        // 现代浏览器支持的文件系统访问API
        showSystemDirectoryPicker(projectLocationInput);
    } else if (window.electronAPI) {
        // Electron环境
        showElectronDirectoryDialog(projectLocationInput);
    } else {
        // 降级方案：显示自定义文件夹选择对话框
        showFallbackFolderDialog(projectLocationInput);
    }
}

// 现代浏览器的目录选择器
async function showSystemDirectoryPicker(input) {
    try {
        const directoryHandle = await window.showDirectoryPicker();
        const path = directoryHandle.name;
        input.value = path;
        showNotification('已选择项目位置: ' + path, 'success');
    } catch (err) {
        if (err.name !== 'AbortError') {
            console.error('目录选择失败:', err);
            showFallbackFolderDialog(input);
        }
    }
}

// Electron环境的目录选择
function showElectronDirectoryDialog(input) {
    if (window.electronAPI && window.electronAPI.showOpenDialog) {
        window.electronAPI.showOpenDialog({
            properties: ['openDirectory'],
            title: '选择项目保存位置'
        }).then(result => {
            if (!result.canceled && result.filePaths.length > 0) {
                const selectedPath = result.filePaths[0];
                input.value = selectedPath;
                showNotification('已选择项目位置: ' + selectedPath, 'success');
            }
        }).catch(err => {
            console.error('目录选择失败:', err);
            showFallbackFolderDialog(input);
        });
    } else {
        showFallbackFolderDialog(input);
    }
}

// 降级方案：简化的文件夹选择
function showFallbackFolderDialog(input) {
    // 创建隐藏的文件输入元素来模拟文件夹选择
    const fileInput = document.createElement('input');
    fileInput.type = 'file';
    fileInput.webkitdirectory = true;
    fileInput.style.display = 'none';

    fileInput.addEventListener('change', (e) => {
        if (e.target.files.length > 0) {
            // 获取第一个文件的路径，然后提取目录路径
            const file = e.target.files[0];
            const path = file.webkitRelativePath.split('/')[0];
            input.value = path || '已选择文件夹';
            showNotification('已选择项目位置', 'success');
        }
        document.body.removeChild(fileInput);
    });

    document.body.appendChild(fileInput);
    fileInput.click();
}



// 显示项目菜单
function showProjectMenu(projectId, menuButton) {
    // 移除已存在的菜单
    const existingMenu = document.querySelector('.project-context-menu');
    if (existingMenu) {
        existingMenu.remove();
    }

    // 获取项目信息
    const project = projectsData.find(p => p.id === projectId);
    if (!project) return;

    // 创建菜单
    const menu = document.createElement('div');
    menu.className = 'project-context-menu';
    menu.innerHTML = `
        <div class="menu-item" data-action="open">
            <i class="fas fa-folder-open"></i>
            <span>打开项目</span>
        </div>
        <div class="menu-item" data-action="rename">
            <i class="fas fa-edit"></i>
            <span>重命名</span>
        </div>
        <div class="menu-item" data-action="duplicate">
            <i class="fas fa-copy"></i>
            <span>复制项目</span>
        </div>
        <div class="menu-item" data-action="export">
            <i class="fas fa-download"></i>
            <span>导出项目</span>
        </div>
        <div class="menu-divider"></div>
        <div class="menu-item" data-action="favorite">
            <i class="fas fa-star${project.favorite ? ' favorited' : ''}"></i>
            <span>${project.favorite ? '从收藏中移除' : '添加到收藏'}</span>
        </div>
        <div class="menu-divider"></div>
        <div class="menu-item danger" data-action="delete">
            <i class="fas fa-trash"></i>
            <span>删除项目</span>
        </div>
    `;

    // 定位菜单
    const rect = menuButton.getBoundingClientRect();
    menu.style.position = 'fixed';
    menu.style.top = rect.bottom + 5 + 'px';
    menu.style.left = rect.left - 150 + 'px'; // 菜单宽度约150px，向左偏移
    menu.style.zIndex = '2000';

    // 添加到页面
    document.body.appendChild(menu);

    // 菜单项点击事件
    menu.addEventListener('click', (e) => {
        const action = e.target.closest('.menu-item')?.dataset.action;
        if (action) {
            handleProjectAction(projectId, action);
            menu.remove();
        }
    });

    // 点击其他地方关闭菜单
    setTimeout(() => {
        document.addEventListener('click', function closeMenu(e) {
            if (!menu.contains(e.target)) {
                menu.remove();
                document.removeEventListener('click', closeMenu);
            }
        });
    }, 0);
}

// 处理项目操作
function handleProjectAction(projectId, action) {
    const project = projectsData.find(p => p.id === projectId);
    if (!project) return;

    switch (action) {
        case 'open':
            openProject(projectId);
            break;
        case 'rename':
            renameProject(projectId);
            break;
        case 'duplicate':
            duplicateProject(projectId);
            break;
        case 'export':
            exportProject(projectId);
            break;
        case 'favorite':
            toggleFavorite(projectId);
            break;
        case 'delete':
            deleteProject(projectId);
            break;
    }
}

// 重命名项目
function renameProject(projectId) {
    const project = projectsData.find(p => p.id === projectId);
    if (!project) return;

    const newName = prompt('请输入新的项目名称:', project.title);
    if (newName && newName.trim() !== '') {
        project.title = newName.trim();
        renderProjects();
        showNotification('项目重命名成功', 'success');
    }
}

// 复制项目
function duplicateProject(projectId) {
    const project = projectsData.find(p => p.id === projectId);
    if (!project) return;

    const newProject = {
        ...project,
        id: projectsData.length + 1,
        title: project.title + ' - 副本',
        date: new Date().toLocaleString('zh-CN')
    };

    projectsData.unshift(newProject);
    renderProjects();
    showNotification('项目复制成功', 'success');
}

// 导出项目
function exportProject(projectId) {
    const project = projectsData.find(p => p.id === projectId);
    if (!project) return;

    showNotification(`正在导出项目: ${project.title}`, 'info');
    // 这里可以添加实际的导出逻辑
}

// 切换收藏状态
function toggleFavorite(projectId) {
    const project = projectsData.find(p => p.id === projectId);
    if (!project) return;

    project.favorite = !project.favorite;
    renderProjects(); // 重新渲染以显示收藏状态变化
    showNotification(project.favorite ? '已添加到收藏' : '已从收藏中移除', 'success');
}

// 删除项目
function deleteProject(projectId) {
    const project = projectsData.find(p => p.id === projectId);
    if (!project) return;

    if (confirm(`确定要删除项目 "${project.title}" 吗？此操作不可撤销。`)) {
        const index = projectsData.findIndex(p => p.id === projectId);
        if (index > -1) {
            projectsData.splice(index, 1);
            renderProjects();
            showNotification('项目删除成功', 'success');
        }
    }
}

// 获取项目类型标签
function getProjectTypeLabel(type) {
    const typeLabels = {
        'industrial': '工业',
        'smart': '智能',
        'vr': 'VR',
        'game': '游戏',
        'design': '设计'
    };
    return typeLabels[type] || '其他';
}

// 初始化搜索和过滤功能
function initSearchAndFilter() {
    if (!searchBtn || !filterBtn) return;

    // 搜索按钮点击
    searchBtn.addEventListener('click', () => {
        toggleSearchFilterArea();
    });

    // 过滤按钮点击
    filterBtn.addEventListener('click', () => {
        toggleSearchFilterArea();
    });

    // 搜索输入
    if (searchInput) {
        searchInput.addEventListener('input', (e) => {
            currentSearchTerm = e.target.value;
            renderProjects();
        });
    }

    // 排序选择
    if (sortSelect) {
        sortSelect.addEventListener('change', (e) => {
            currentSortBy = e.target.value;
            renderProjects();
        });
    }

    // 类型过滤
    if (typeFilter) {
        typeFilter.addEventListener('change', (e) => {
            currentTypeFilter = e.target.value;
            renderProjects();
        });
    }
}

// 切换搜索过滤区域显示
function toggleSearchFilterArea() {
    if (!searchFilterArea) return;

    if (searchFilterArea.style.display === 'none' || searchFilterArea.style.display === '') {
        searchFilterArea.style.display = 'flex';
        if (searchInput) {
            searchInput.focus();
        }
    } else {
        searchFilterArea.style.display = 'none';
    }
}

// 初始化树状结构
function initTreeStructure() {
    // 主分区展开/折叠
    const navTitles = document.querySelectorAll('.nav-title.expandable');
    navTitles.forEach(title => {
        title.addEventListener('click', () => {
            const sectionId = title.dataset.section;
            const subsection = document.getElementById(sectionId);
            const icon = title.querySelector('.expand-icon');

            if (subsection.classList.contains('collapsed')) {
                subsection.classList.remove('collapsed');
                subsection.style.maxHeight = subsection.scrollHeight + 'px';
                icon.style.transform = 'rotate(0deg)';
            } else {
                subsection.classList.add('collapsed');
                subsection.style.maxHeight = '0px';
                icon.style.transform = 'rotate(-90deg)';
            }
        });
    });

    // 设置初始状态 - 默认展开所有主分区
    const allSubsections = document.querySelectorAll('.nav-subsection');
    allSubsections.forEach(subsection => {
        subsection.style.maxHeight = subsection.scrollHeight + 'px';
    });
}

// 添加动画样式
const style = document.createElement('style');
style.textContent = `
    @keyframes slideIn {
        from { transform: translateX(100%); opacity: 0; }
        to { transform: translateX(0); opacity: 1; }
    }

    @keyframes slideOut {
        from { transform: translateX(0); opacity: 1; }
        to { transform: translateX(100%); opacity: 0; }
    }
`;
document.head.appendChild(style);