fc63cc6e8d
Phase 7 重构完成，实现 HomeNavbar 的最终优化： 新增文件： - src/components/Navbars/components/SecondaryNav/config.js (111行) * 二级导航配置数据 * 统一管理所有二级菜单结构 - src/components/Navbars/components/SecondaryNav/index.js (138行) * 二级导航栏组件 * 支持动态路由匹配、徽章显示、导航埋点 - src/hooks/useProfileCompleteness.js (127行) * 用户资料完整性管理 Hook * 封装资料检查逻辑、状态管理、自动检测 - src/components/Navbars/components/ProfileCompletenessAlert/index.js (96行) * 资料完整性提醒横幅组件 * 响应式设计、操作回调 - src/components/Navbars/components/NavbarActions/index.js (82行) * 右侧功能区统一组件 * 集成主题切换、登录按钮、功能菜单、用户菜单 - src/components/Navbars/components/ThemeToggleButton.js (更新) * 添加导航埋点支持 * 支持自定义尺寸和样式 HomeNavbar.js 优化： - 移除 SecondaryNav 内联组件定义（~148行） - 移除资料完整性状态和逻辑（~90行） - 移除资料完整性横幅 JSX（~50行） - 移除右侧功能区 JSX（~54行） - 简化 handleLogout，使用 resetCompleteness - 525 → 215 行（-310行，-59.0%） Phase 7 成果： - 创建 1 个配置文件、4 个新组件、1 个自定义 Hook - 从 HomeNavbar 中提取 ~342 行复杂逻辑和 JSX - 代码高度模块化，职责清晰分离 - 所有功能保持完整，便于维护和测试 总体成果（Phase 1-7）： - 原始代码：1623 行 - Phase 1-6 后：525 行（-67.7%） - Phase 7 后：215 行（-86.8%） - 总减少：1408 行 - 提取组件总数：18+ 个 - 代码结构从臃肿单体文件转变为清晰的模块化架构 技术亮点： - 自定义 Hooks 封装复杂状态逻辑 - 配置与组件分离 - 组件高度复用 - React.memo 性能优化 - 完整的 Props 类型注释 注意：存在 Webpack 缓存导致的间歇性编译错误， 代码本身正确，重启开发服务器可解决 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
112 lines
3.1 KiB
JavaScript
112 lines
3.1 KiB
JavaScript
// src/components/Navbars/components/SecondaryNav/config.js
|
|
// 二级导航配置数据
|
|
|
|
/**
|
|
* 二级导航配置结构
|
|
* - key: 匹配的路径前缀
|
|
* - title: 导航组标题
|
|
* - items: 导航项列表
|
|
* - path: 路径
|
|
* - label: 显示文本
|
|
* - badges: 徽章列表 (可选)
|
|
* - external: 是否外部链接 (可选)
|
|
*/
|
|
export const secondaryNavConfig = {
|
|
'/community': {
|
|
title: '高频跟踪',
|
|
items: [
|
|
{
|
|
path: '/community',
|
|
label: '事件中心',
|
|
badges: [
|
|
{ text: 'HOT', colorScheme: 'green' },
|
|
{ text: 'NEW', colorScheme: 'red' }
|
|
]
|
|
},
|
|
{
|
|
path: '/concepts',
|
|
label: '概念中心',
|
|
badges: [{ text: 'NEW', colorScheme: 'red' }]
|
|
}
|
|
]
|
|
},
|
|
'/concepts': {
|
|
title: '高频跟踪',
|
|
items: [
|
|
{
|
|
path: '/community',
|
|
label: '事件中心',
|
|
badges: [
|
|
{ text: 'HOT', colorScheme: 'green' },
|
|
{ text: 'NEW', colorScheme: 'red' }
|
|
]
|
|
},
|
|
{
|
|
path: '/concepts',
|
|
label: '概念中心',
|
|
badges: [{ text: 'NEW', colorScheme: 'red' }]
|
|
}
|
|
]
|
|
},
|
|
'/limit-analyse': {
|
|
title: '行情复盘',
|
|
items: [
|
|
{
|
|
path: '/limit-analyse',
|
|
label: '涨停分析',
|
|
badges: [{ text: 'FREE', colorScheme: 'blue' }]
|
|
},
|
|
{
|
|
path: '/stocks',
|
|
label: '个股中心',
|
|
badges: [{ text: 'HOT', colorScheme: 'green' }]
|
|
},
|
|
{
|
|
path: '/trading-simulation',
|
|
label: '模拟盘',
|
|
badges: [{ text: 'NEW', colorScheme: 'red' }]
|
|
}
|
|
]
|
|
},
|
|
'/stocks': {
|
|
title: '行情复盘',
|
|
items: [
|
|
{
|
|
path: '/limit-analyse',
|
|
label: '涨停分析',
|
|
badges: [{ text: 'FREE', colorScheme: 'blue' }]
|
|
},
|
|
{
|
|
path: '/stocks',
|
|
label: '个股中心',
|
|
badges: [{ text: 'HOT', colorScheme: 'green' }]
|
|
},
|
|
{
|
|
path: '/trading-simulation',
|
|
label: '模拟盘',
|
|
badges: [{ text: 'NEW', colorScheme: 'red' }]
|
|
}
|
|
]
|
|
},
|
|
'/trading-simulation': {
|
|
title: '行情复盘',
|
|
items: [
|
|
{
|
|
path: '/limit-analyse',
|
|
label: '涨停分析',
|
|
badges: [{ text: 'FREE', colorScheme: 'blue' }]
|
|
},
|
|
{
|
|
path: '/stocks',
|
|
label: '个股中心',
|
|
badges: [{ text: 'HOT', colorScheme: 'green' }]
|
|
},
|
|
{
|
|
path: '/trading-simulation',
|
|
label: '模拟盘',
|
|
badges: [{ text: 'NEW', colorScheme: 'red' }]
|
|
}
|
|
]
|
|
}
|
|
};
|