主 题
博客系统自文档 · 第 4/16 篇
目录 · 上一篇:评论、点赞与站内通知 · 下一篇:管理后台能力地图
写在前面
作者不必打开 admin,在 C 端用户中心 就能完成写文、定时发布、看数据、收评论。
本篇对应 2026-06 三批优化里的「作者工作流」,也是本连载本身的写作方式(本地 Markdown → SQL 是运维向变体)。
功能与体验
| 能力 | 入口 | 说明 |
|---|---|---|
| 写文 | /user/article/edit |
md-editor-v3,需登录 |
| 个人中心 | /user/profile |
资料、我的文章 |
| 评论收件箱 | /user/profile?tab=inbox |
读者评论汇总 |
| 创作看板 | /user/profile?tab=dashboard |
发文/阅读等统计 |
| 登录回跳 | 任意需登录页 | 登录后回到原 URL |
编辑器体验
- localStorage 草稿 autosave:刷新不丢稿
- 离开页确认:
CyberModal防误关 - 发布成功面板:Cyber 风格结果反馈
- 定时发布:选未来时间,状态
scheduled,后端 cron 到点改publish - 文章列表筛选:个人中心按状态、标题筛自己的文
通知
- 导航栏 铃铛:新评论经
/realtime推送siteNotification,角标实时更新 - 与收件箱互补:铃铛看未读数,inbox 看详情列表
设计与实现
sequenceDiagram
participant Author as 作者浏览器
participant Home as blog-home-nuxt
participant API as blog-server
Author->>Home: /user/article/edit
Home->>Home: auth.global 校验 token
Author->>Home: 编辑 Markdown autosave
Author->>API: POST /article/create
API->>API: 校验 deptId 分类 标签
API-->>Author: 200 发布成功
Note over API: publish 时发 ARTICLE_PUBLISHED
关键文件
| 文件 | 职责 |
|---|---|
components/user/article-edit-form.vue |
编辑表单、autosave、定时发布 UI |
composables/use-login-redirect.ts |
登录后回跳 |
middleware/auth.global.ts |
保护 /user/profile、/user/article/edit |
api/article.ts |
create / edit / my-list |
api/author.ts |
author-stats、on-my-articles |
api/notification.ts |
收件箱与已读 |
与 admin 编辑的差异
| 项 | C 端 | admin |
|---|---|---|
| 受众 | 作者自己 | 管理员批量运营 |
| UI | Cyber 风 | Arco Design |
| 权限 | 自己的文 | RBAC + 数据范围 |
| API | 同一套 /article/* |
同一套 |
本连载 自文档 采用本地 .md + SQL 导入,适合批量写系列;日常单篇仍推荐 C 端或 admin 编辑器。
踩坑与取舍
- 作者必须有 deptId:否则
POST /article/create报「未关联机构」。 - 封面 URL:C 端上传走
/file,生产域名为/x-blog/api/v1/static/uploads/...。 - 定时发布依赖 server 定时任务:需保证
scheduled-task模块与 cron 在生产运行。
系列导航
- 目录
- 导读 · 第 0 篇
- 第 5 篇:管理后台能力地图(待写)
延伸阅读
blog-home-nuxt/docs/home-features-2026-06.mdblog-server/docs/home-api-2026-06.md

全部评论(0)