星球系列 (planet-series)
- 文件:
web/src/pages/planet-map/planet-series.vue - 路由:
/planet-series?subCategory=<id>&planet=<planetKey>
页面职责
展示某个星球子分类下的汉字列表,支持按学习状态筛选,点击汉字进入书写练习。
使用的 Store
useCharacterStore:汉字数据(characters),按 subCategory 过滤useUserStore:学习记录(records),用于判断每个汉字的学习状态
核心功能
学习进度条
- 显示"已学习 N/M"和百分比
- 进度条颜色继承系列主题色
- 支持吸顶(sticky)效果
汉字网格
- 以网格形式展示该系列下所有汉字
- 每个汉字卡片显示:拼音、汉字、学习状态图标
- 学习状态有三种:
learned:绿色对勾 ✓(maxScore ≥ 60)failed:红色叉号 ✗(有记录但未达标)- 默认:无标记(未学习)
- 点击汉字卡片进入书写练习页面(
/write?from=planet-series)
空状态
- 当系列下无汉字数据时显示空状态提示
导航
- 返回按钮:回到星球详情
- 关闭按钮:回到星球地图