feat: 实现 Fluent 风格 Steam 成就追踪前端框架#1
Conversation
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 30be3ca2bf
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| ]) | ||
|
|
||
| const currentPageLabel = computed(() => navItems.find((i) => i.key === currentPage.value)?.label ?? '') | ||
| const filteredGames = computed(() => games.value.filter((g) => `${g.zhName} ${g.enName} ${g.tags.join(' ')} ${g.note}`.toLowerCase().includes(query.value.toLowerCase()))) |
There was a problem hiding this comment.
Filter wishlist entries by page state
Update the game list computation to include currentPage criteria, not just the search text. As written, filteredGames only checks query, so switching to 我的清单 still renders the full library (including non-wishlist states), which breaks the expected separation between Library and Wishlist views.
Useful? React with 👍 / 👎.
| <button class="primary"> | ||
| <span v-if="syncing">⏳</span> | ||
| {{ currentPage === 'wishlist' ? '添加游戏' : syncing ? '同步中…' : '同步我的库' }} | ||
| </button> |
There was a problem hiding this comment.
Wire primary command button to sync/add action
Attach a click handler that mutates state for the primary command. The button text and spinner depend on syncing, but there is no @click or other state transition here, so users cannot trigger sync/add behavior and the 同步中… branch is effectively dead in normal use.
Useful? React with 👍 / 👎.
Motivation
Description
package.json(依赖与脚本)、vite.config.js与index.html,以及入口src/main.js用于启动 Vue 3 + Vite 应用。src/App.vue中实现主界面结构与交互:72px Navigation Rail、56px Command Bar、全局搜索、卡片网格、右侧 480px 详情抽屉(概览/成就分段)、同步中心与设置页以及状态/标签/备注的编辑交互。src/styles.css,实现遵循设计稿的 Fluent 风格视觉系统(间距、圆角、阴影、进度条、分段控件、Chips 等)。Testing
git status --short并成功返回项目状态。npm install获取依赖时遇到 npm registry 返回403 Forbidden,导致依赖未能安装并阻止后续构建与运行验证。vite build/ 运行时验证未能执行,待网络/registry 可用后需再运行完整的构建与功能验证。Codex Task