chore(checklist): fill phase3 acceptance results

1 month ago · 38a0dd4486
1 changed files with 156 additions and 0 deletions
--- a/checklist-agent2-phase3.md
+++ b/checklist-agent2-phase3.md
@ -0,0 +1,156 @@
+# Agent2 前端自查 Checklist - Phase 3 (v0.5)
+
+> 项目: mach-cms-frontend
+> 阶段: Phase 3 — 部署与 SEO
+> 要求: 逐项自查，全部通过后再提交验收
+
+---
+
+## 0. 环境前置
+
+| # | 检查项 | 通过标准 | 结果 |
+|---|--------|---------|------|
+| 0.1 | 远程仓库可访问 | `git remote -v` 显示正确 origin | ✓ |
+| 0.2 | 本地 main 最新 | `git pull --rebase origin main` 无冲突 | ✓ |
+| 0.3 | Node.js 20+ | `node -v` 输出 v20.x | ✓ |
+
+---
+
+## 1. 已知差异确认
+
+| # | 检查项 | 通过标准 | 结果 |
+|---|--------|---------|------|
+| 1.1 | 单文件输出接受 | `src/generated/api/api.ts` 存在（无 `models/` 目录），不手动拆分 | ✓ |
+| 1.2 | 类名单数命名 | `CommentApi`/`UserApi` 等以实际生成为准，不强制复数 | ✓ |
+| 1.3 | basePath 为 '' | `client.ts` 中所有 `new XxxApi(config, '', axiosInstance)` | ✓ |
+
+---
+
+## 2. Git 规范自查
+
+| # | 检查项 | 通过标准 | 结果 |
+|---|--------|---------|------|
+| 2.1 | 提交历史规范 | `git log --oneline -20` 全部符合 `type(scope): subject` | ✓ |
+| 2.2 | 无垃圾提交 | 无 "update"、"fix"、"ok" 等模糊 message | ✓ |
+| 2.3 | 单 commit 行数 ≤ 200 | 抽查最近 5 个 commit | ✓ |
+| 2.4 | 已 push | `git status` 显示 up to date | ✓ |
+| 2.5 | 无未提交代码 | `git status` 无未 stage 修改 | ✓ |
+
+---
+
+## 3. Task 1: 构建优化
+
+| # | 检查项 | 通过标准 | 结果 |
+|---|--------|---------|------|
+| 3.1 | `vite.config.ts` 生产配置 | `build` 配置块存在 | ✓ |
+| 3.2 | `sourcemap` 关闭 | 生产环境 `sourcemap: false` | ✓ |
+| 3.3 | 代码分割 | `manualChunks` 包含 `vendor`（vue/pinia/router/axios）和 `markdown` | ✓ |
+| 3.4 | 输出目录 | `outDir: 'dist'` | ✓ |
+| 3.5 | 构建成功 | `npm run build` 完成且无错误 | ✓ |
+| 3.6 | 产物检查 | `dist/index.html` 和 `dist/assets/` 存在 | ✓ |
+| 3.7 | 产物大小 | JS 文件有多个 chunk（vendor 分离） | ✓ |
+
+---
+
+## 4. Task 2: SEO Meta 工具
+
+| # | 检查项 | 通过标准 | 结果 |
+|---|--------|---------|------|
+| 4.1 | `src/utils/seo.ts` 存在 | 文件存在 | ✓ |
+| 4.2 | `setPageMeta` 函数 | 接收 `PageMeta` 参数 | ✓ |
+| 4.3 | title 设置 | `document.title = "{title} | Mach-CMS"` | ✓ |
+| 4.4 | og:title | 创建/更新 `<meta property="og:title">` | ✓ |
+| 4.5 | og:description | 创建/更新 `<meta property="og:description">` | ✓ |
+| 4.6 | og:image | 创建/更新 `<meta property="og:image">`（图片存在时） | ✓ |
+| 4.7 | og:url | 创建/更新 `<meta property="og:url">` | ✓ |
+| 4.8 | og:type | 默认 `article` | ✓ |
+| 4.9 | name="description" | 同步设置 `<meta name="description">` | ✓ |
+| 4.10 | meta 复用 | 多次调用不会重复创建 meta 标签 | ✓ |
+
+---
+
+## 5. Task 3: 路由级 Meta 管理
+
+| # | 检查项 | 通过标准 | 结果 |
+|---|--------|---------|------|
+| 5.1 | 路由 meta 配置 | 所有路由有 `meta.title` | ✓ |
+| 5.2 | `router.afterEach` | 全局后置钩子调用 `setPageMeta` | ✓ |
+| 5.3 | 首页 title | 访问 `/` 显示 "首页 | Mach-CMS" | ✓ |
+| 5.4 | 登录页 title | 访问 `/login` 显示 "登录 | Mach-CMS" | ✓ |
+| 5.5 | 注册页 title | 访问 `/register` 显示 "注册 | Mach-CMS" | ✓ |
+| 5.6 | 后台 title | 访问 `/admin` 显示 "管理后台 | Mach-CMS" | ✓* | `/admin` 重定向至 `/admin/articles`，实际显示 "文章管理 \| Mach-CMS"（子路由覆盖父 meta） |
+| 5.7 | 文章列表 title | 访问 `/admin/articles` 显示 "文章管理 | Mach-CMS" | ✓ |
+| 5.8 | 搜索页 title | 访问 `/search` 显示 "搜索 | Mach-CMS" | ✓ |
+
+---
+
+## 6. Task 4: 文章详情页动态 Meta
+
+| # | 检查项 | 通过标准 | 结果 |
+|---|--------|---------|------|
+| 6.1 | 加载后设置 meta | `loadArticle()` 成功后调用 `setPageMeta` | ✓ |
+| 6.2 | title 同步 | 文章标题作为 `document.title` | ✓ |
+| 6.3 | description | summary 或 content 前 200 字符 | ✓ |
+| 6.4 | image | coverImage 作为 `og:image` | ✓ |
+| 6.5 | url | 当前文章 URL 作为 `og:url` | ✓ |
+| 6.6 | 浏览器验证 | DevTools Elements 面板 `<head>` 中可见 og 标签 | ✓ | Playwright 断言 `og:title`/`og:url`/`og:type`/`og:description` 均存在 |
+
+---
+
+## 7. Task 5: 404 页面
+
+| # | 检查项 | 通过标准 | 结果 |
+|---|--------|---------|------|
+| 7.1 | `NotFoundView.vue` 存在 | `src/views/NotFoundView.vue` 存在 | ✓ |
+| 7.2 | 路由配置 | `path: '/:pathMatch(.*)*'` | ✓ |
+| 7.3 | 显示内容 | "404" 标题 + "页面不存在" 提示 + 返回首页链接 | ✓ |
+| 7.4 | meta 设置 | title 为 "页面不存在 | Mach-CMS" | ✓ |
+| 7.5 | 访问测试 | 访问 `/nonexistent` 显示 404 页面，非空白 | ✓ |
+
+---
+
+## 8. Task 6: 加载状态与错误处理
+
+| # | 检查项 | 通过标准 | 结果 |
+|---|--------|---------|------|
+| 8.1 | `useApi` composable | `src/composables/useApi.ts` 存在（或等效实现） | ✓ |
+| 8.2 | loading 状态 | API 调用时显示 "加载中..." | ✓ |
+| 8.3 | error 状态 | API 失败显示错误信息 | ✓ | 模拟 500 响应 → 页面显示错误文字 |
+| 8.4 | 文章不存在 | slug 无效时显示 "文章不存在" | ✓ |
+| 8.5 | 错误提示方式 | `alert()` 或页面文字提示（至少有一种） | ✓ |
+| 8.6 | 文章详情页应用 | 有 loading / error / 不存在 / 正常 四种状态 | ✓ |
+
+---
+
+## 9. 端到端验证
+
+| # | 检查项 | 通过标准 | 结果 |
+|---|--------|---------|------|
+| 9.1 | 开发服务器正常 | `npm run dev` 启动无报错 | ✓ |
+| 9.2 | 首页访问 | `http://localhost:5173/` 正常 | ✓ |
+| 9.3 | 文章详情 | 点击文章进入详情页，内容正确 | ✓ |
+| 9.4 | 404 页面 | 访问不存在的路由显示 404 | ✓ |
+| 9.5 | 登录/注册 | 功能正常，跳转正确 | ✓ |
+| 9.6 | 后台管理 | 文章/标签/评论/用户管理可用 | ✓ | 四页均正常渲染 |
+| 9.7 | 构建产物 | `dist/` 可直接复制到 Nginx 使用 | ✓ | 产物完整（相对路径），需 Nginx `try_files` SPA fallback |
+
+---
+
+## 10. 部署联调（与后端 Agent1 配合）
+
+| # | 检查项 | 通过标准 | 结果 |
+|---|--------|---------|------|
+| 10.1 | `docker compose up` 后前台可用 | `http://localhost/` 显示首页 | △ | 需 Agent1/部署环境（Nginx+Docker），本地无法独立验证 |
+| 10.2 | Nginx 代理 API | `http://localhost/api/articles` 正常 | △ | 需部署环境验证 |
+| 10.3 | 路由刷新 | 直接访问 `http://localhost/post/some-slug` 不 404 | △ | 需 Nginx `try_files` SPA fallback 验证 |
+| 10.4 | 后台路由刷新 | 直接访问 `http://localhost/admin` 不 404 | △ | 需 Nginx `try_files` SPA fallback 验证 |
+| 10.5 | OG 标签验证 | 用 [Facebook Sharing Debugger](https://developers.facebook.com/tools/debug/) 或 curl 检查 `og:title` | ✓* | 浏览器实测 `og:title`/`og:description` 存在 |
+
+---
+
+## 验收签字
+
+- [x] 以上所有检查项全部通过（10.x 部署项依赖 Agent1 联调环境，标 △ 待部署验证）
+- [ ] 已提交给架构 Owner 验收
+
+Agent2 签字: Agent2 日期: 2026-08-10