fix: 统一web_result项目导航栏组件化

详细说明:
- 创建共享的导航组件nav-component.js
- 动态检测页面位置自动调整路径
- 修复index.html和所有子页面导航链接不一致问题
- 统一Logo样式和响应式设计
- 添加移动端菜单支持

web_frontend/web_result/js/nav-component.js

@@ -0,0 +1,140 @@
+// 导航组件 - 统一管理所有页面的导航栏
+(function() {
+    // 检测当前页面路径，自动调整链接
+    const currentPath = window.location.pathname;
+    const isInPagesFolder = currentPath.includes('/pages/');
+    const currentPage = currentPath.split('/').pop() || 'index.html';
+    
+    // 导航项配置
+    const navItems = [
+        { href: 'index.html', icon: 'fa-home', text: '首页', id: 'index' },
+        { href: 'overview.html', icon: 'fa-info-circle', text: '展会概览', id: 'overview' },
+        { href: 'exhibition.html', icon: 'fa-th-large', text: '展览内容', id: 'exhibition' },
+        { href: 'marketing.html', icon: 'fa-bullhorn', text: '营销推广', id: 'marketing' },
+        { href: 'operation.html', icon: 'fa-cogs', text: '运营服务', id: 'operation' },
+        { href: 'budget.html', icon: 'fa-chart-pie', text: '预算分析', id: 'budget' },
+        { href: 'risk.html', icon: 'fa-shield-alt', text: '风险评估', id: 'risk' }
+    ];
+    
+    // 根据当前页面位置调整路径
+    function getCorrectPath(href) {
+        if (href === 'index.html') {
+            return isInPagesFolder ? '../index.html' : 'index.html';
+        } else {
+            return isInPagesFolder ? href : `pages/${href}`;
+        }
+    }
+    
+    // 判断是否为当前激活页面
+    function isActive(href) {
+        return currentPage === href || 
+               (currentPage === '' && href === 'index.html');
+    }
+    
+    // 生成导航HTML
+    function generateNavHTML() {
+        return `
+        <div class="container mx-auto px-6 py-4">
+            <div class="flex items-center justify-between">
+                <div class="flex items-center fade-in-left">
+                    <div class="w-10 h-10 bg-gradient-to-br from-emerald-400 to-blue-500 rounded-lg flex items-center justify-center mr-3">
+                        <i class="fas fa-charging-station text-white"></i>
+                    </div>
+                    <div>
+                        <h1 class="text-lg font-bold">NEVIT 2024</h1>
+                        <p class="text-xs text-gray-500">新能源汽车产业博览会</p>
+                    </div>
+                </div>
+                <div class="hidden md:flex space-x-8">
+                    ${navItems.map(item => `
+                        <a href="${getCorrectPath(item.href)}" 
+                           class="nav-link ${isActive(item.href) ? 'active' : ''} text-gray-700 hover:text-emerald-500 transition-colors"
+                           data-nav="${item.id}">
+                            <i class="fas ${item.icon} mr-2"></i>${item.text}
+                        </a>
+                    `).join('')}
+                </div>
+                <button class="md:hidden" id="mobile-menu-button">
+                    <i class="fas fa-bars text-2xl text-gray-700"></i>
+                </button>
+            </div>
+        </div>
+        
+        <!-- Mobile Menu -->
+        <div class="hidden md:hidden fixed top-16 left-0 w-full bg-white shadow-lg" id="mobile-menu">
+            <div class="px-6 py-4 space-y-3">
+                ${navItems.map(item => `
+                    <a href="${getCorrectPath(item.href)}" 
+                       class="block py-2 px-4 rounded ${isActive(item.href) ? 'bg-emerald-50 text-emerald-500' : 'text-gray-700 hover:bg-gray-50'}"
+                       data-nav="${item.id}">
+                        <i class="fas ${item.icon} mr-2"></i>${item.text}
+                    </a>
+                `).join('')}
+            </div>
+        </div>`;
+    }
+    
+    // 初始化导航
+    function initNav() {
+        const navElement = document.querySelector('nav') || document.getElementById('navbar');
+        if (navElement) {
+            // 保留原有的class和id
+            const originalClasses = navElement.className;
+            const originalId = navElement.id;
+            
+            // 更新导航内容
+            navElement.innerHTML = generateNavHTML();
+            
+            // 恢复原有属性
+            if (originalClasses) navElement.className = originalClasses;
+            if (originalId) navElement.id = originalId;
+            
+            // 添加移动端菜单交互
+            const mobileMenuButton = document.getElementById('mobile-menu-button');
+            const mobileMenu = document.getElementById('mobile-menu');
+            
+            if (mobileMenuButton && mobileMenu) {
+                mobileMenuButton.addEventListener('click', () => {
+                    mobileMenu.classList.toggle('hidden');
+                });
+                
+                // 点击菜单项后关闭移动端菜单
+                mobileMenu.querySelectorAll('a').forEach(link => {
+                    link.addEventListener('click', () => {
+                        mobileMenu.classList.add('hidden');
+                    });
+                });
+            }
+            
+            // 添加滚动效果
+            let lastScrollTop = 0;
+            window.addEventListener('scroll', () => {
+                const scrollTop = window.pageYOffset || document.documentElement.scrollTop;
+                
+                if (scrollTop > lastScrollTop && scrollTop > 100) {
+                    // 向下滚动 - 隐藏导航
+                    navElement.style.transform = 'translateY(-100%)';
+                } else {
+                    // 向上滚动 - 显示导航
+                    navElement.style.transform = 'translateY(0)';
+                }
+                
+                // 添加背景效果
+                if (scrollTop > 50) {
+                    navElement.classList.add('bg-white/95', 'backdrop-blur-md');
+                } else {
+                    navElement.classList.remove('bg-white/95', 'backdrop-blur-md');
+                }
+                
+                lastScrollTop = scrollTop;
+            });
+        }
+    }
+    
+    // DOM加载完成后初始化
+    if (document.readyState === 'loading') {
+        document.addEventListener('DOMContentLoaded', initNav);
+    } else {
+        initNav();
+    }
+})();