// Page 7: Library Home - 知识库首页 import { PlusIcon, SearchIcon, FolderIcon, ChevronRightIcon, MoreHorizontalIcon } from 'lucide-react'; import BottomTabBar from '../components/BottomTabBar'; const libraries = [ { name: '机器学习', desc: 'ML基础 · 深度学习 · 实战项目', items: 47, mastery: 72, color: '#7C6EFA', emoji: '🤖', tags: ['算法', '数学', '实战'], lastStudied: '今天', }, { name: '高等数学', desc: '微积分 · 线代 · 概率论', items: 93, mastery: 58, color: '#F97316', emoji: '📐', tags: ['公式', '定理', '习题'], lastStudied: '昨天', }, { name: '英语词汇', desc: 'GRE · 托福 · 商务英语', items: 312, mastery: 84, color: '#2DD4BF', emoji: '📖', tags: ['词根', '语境', '拼写'], lastStudied: '3天前', }, { name: '产品设计', desc: 'UX 方法论 · 用研 · 交互规范', items: 28, mastery: 43, color: '#F59E0B', emoji: '🎨', tags: ['方法论', '案例'], lastStudied: '1周前', }, ]; const LibraryHomePage = () => { return (
{/* Header */}

知识库

{/* Search bar */}
搜索知识库或知识点…
{/* Stats row */}
{[ { label: '知识库', value: '4', icon: '📚' }, { label: '知识点', value: '480', icon: '📝' }, { label: '待巩固', value: '23', icon: '🎯', highlight: true }, ].map((s, i) => (

{s.value}

{s.icon} {s.label}

))}
{/* Library list */}

我的知识库

按最近学习
{libraries.map((lib, i) => (
{/* Color strip */}
{/* Title row */}
{lib.emoji}

{lib.name}

{lib.desc}

{/* Mastery bar */}
掌握度 {lib.mastery}%
{/* Meta row */}
{lib.items} 个知识点 {lib.lastStudied}学习
{lib.tags.map((tag, j) => ( {tag} ))}
))}
{/* Add library button */}
); }; export default LibraryHomePage;