笔记内容
" - } - ``` - - 返回: 创建的笔记信息 - -4. **更新笔记** - - URL: `POST /platform/notebook/update/:id` - - 参数: - ```json - { - "title": "更新的标题", - "content": "更新的内容
" - } - ``` - - 返回: 更新后的笔记信息 - -5. **删除笔记** - - URL: `DELETE /platform/notebook/delete/:id` - - 参数: `id` - 笔记ID - - 返回: 删除结果 - -## 前端API - -### API文件 -`platform/src/api/notebook.js` - -### 方法说明 - -```javascript -// 获取笔记列表 -getNotebookList({ page, pageSize, keyword }) - -// 获取笔记详情 -getNotebookDetail(id) - -// 创建笔记 -createNotebook({ title, content }) - -// 更新笔记 -updateNotebook(id, { title, content }) - -// 删除笔记 -deleteNotebook(id) -``` - -## 使用步骤 - -### 1. 初始化数据库 -```bash -# 在MySQL中执行SQL文件 -mysql -u用户名 -p数据库名 < sql/yz_platform_notebook.sql -``` - -### 2. 启动后端服务 -后端已自动注册模型和路由,直接启动即可: -```bash -cd go -go run main.go -``` - -### 3. 访问前端 -在浏览器中访问笔记本页面(路由需要在菜单中配置) - -## 功能特性 - -### 列表功能 -- ✅ 显示所有笔记 -- ✅ 搜索笔记(按标题) -- ✅ 创建新笔记 -- ✅ 删除笔记 -- ✅ 查看笔记预览 -- ✅ 显示更新时间 - -### 编辑器功能 -- ✅ 富文本编辑(基于Tiptap) -- ✅ 标题编辑 -- ✅ 内容编辑 -- ✅ 保存笔记 -- ✅ 自动识别新建/编辑模式 -- ✅ 加载状态显示 - -### TiptapEditor支持的功能 -- 文本样式(加粗、斜体、下划线等) -- 标题(H1-H6) -- 引用 -- 代码块 -- 有序/无序列表 -- 表格 -- 链接 -- 图片上传(需配置上传接口) -- 视频嵌入 - -## 权限说明 - -- 所有接口都需要平台用户登录(JWT Token验证) -- 每个用户只能查看、编辑、删除自己创建的笔记 -- 删除操作为软删除,数据仍保留在数据库中 - -## 扩展功能(可选) - -如需添加以下功能,可以扩展: - -1. **笔记分类** - - 添加分类表和分类字段 - - 支持笔记分类管理 - -2. **笔记标签** - - 添加标签表和关联表 - - 支持多标签筛选 - -3. **笔记分享** - - 添加分享链接生成功能 - - 支持公开/私密设置 - -4. **笔记导出** - - 支持导出为PDF - - 支持导出为Markdown - -5. **版本历史** - - 记录笔记的修改历史 - - 支持版本回退 - -6. **协作编辑** - - 支持多人协作编辑 - - 实时同步功能 - -## 注意事项 - -1. 图片上传需要配置文件上传接口 -2. 富文本内容存储为HTML格式,注意XSS防护 -3. 数据库content字段使用longtext类型,支持大容量内容 -4. 建议定期清理软删除的数据 -5. 生产环境建议添加内容审核机制 - -## 技术栈 - -- **前端**: Vue 3 + Element Plus + Tiptap -- **后端**: Go + Beego + MySQL -- **编辑器**: Tiptap (基于ProseMirror) - -## 开发调试 - -### 前端调试 -```bash -cd platform -npm run dev -``` - -### 后端调试 -```bash -cd go -go run main.go -``` - -### 查看API请求 -打开浏览器开发者工具 -> Network 标签页,查看API请求和响应 - -## 问题排查 - -1. **笔记列表为空** - - 检查数据库表是否创建成功 - - 检查用户是否已登录 - - 查看浏览器Console是否有错误 - -2. **保存失败** - - 检查JWT Token是否有效 - - 检查标题是否为空 - - 查看后端日志 - -3. **编辑器显示异常** - - 检查Tiptap是否正确安装 - - 查看浏览器Console错误信息 - - 检查CSS样式是否正确加载 - -## 更新日志 - -### v1.0.0 (2024) -- ✅ 完成基础功能 -- ✅ 支持笔记CRUD操作 -- ✅ 集成Tiptap富文本编辑器 -- ✅ 响应式设计支持 -- ✅ 暗色模式支持 diff --git a/backend/src/views/tools/notebook/components/edit.vue b/backend/src/views/tools/notebook/components/edit.vue index 1452af7..f25e9a7 100644 --- a/backend/src/views/tools/notebook/components/edit.vue +++ b/backend/src/views/tools/notebook/components/edit.vue @@ -16,7 +16,7 @@笔记内容
" - } - ``` - - 返回: 创建的笔记信息 - -4. **更新笔记** - - URL: `POST /platform/notebook/update/:id` - - 参数: - ```json - { - "title": "更新的标题", - "content": "更新的内容
" - } - ``` - - 返回: 更新后的笔记信息 - -5. **删除笔记** - - URL: `DELETE /platform/notebook/delete/:id` - - 参数: `id` - 笔记ID - - 返回: 删除结果 - -## 前端API - -### API文件 -`platform/src/api/notebook.js` - -### 方法说明 - -```javascript -// 获取笔记列表 -getNotebookList({ page, pageSize, keyword }) - -// 获取笔记详情 -getNotebookDetail(id) - -// 创建笔记 -createNotebook({ title, content }) - -// 更新笔记 -updateNotebook(id, { title, content }) - -// 删除笔记 -deleteNotebook(id) -``` - -## 使用步骤 - -### 1. 初始化数据库 -```bash -# 在MySQL中执行SQL文件 -mysql -u用户名 -p数据库名 < sql/yz_platform_notebook.sql -``` - -### 2. 启动后端服务 -后端已自动注册模型和路由,直接启动即可: -```bash -cd go -go run main.go -``` - -### 3. 访问前端 -在浏览器中访问笔记本页面(路由需要在菜单中配置) - -## 功能特性 - -### 列表功能 -- ✅ 显示所有笔记 -- ✅ 搜索笔记(按标题) -- ✅ 创建新笔记 -- ✅ 删除笔记 -- ✅ 查看笔记预览 -- ✅ 显示更新时间 - -### 编辑器功能 -- ✅ 富文本编辑(基于Tiptap) -- ✅ 标题编辑 -- ✅ 内容编辑 -- ✅ 保存笔记 -- ✅ 自动识别新建/编辑模式 -- ✅ 加载状态显示 - -### TiptapEditor支持的功能 -- 文本样式(加粗、斜体、下划线等) -- 标题(H1-H6) -- 引用 -- 代码块 -- 有序/无序列表 -- 表格 -- 链接 -- 图片上传(需配置上传接口) -- 视频嵌入 - -## 权限说明 - -- 所有接口都需要平台用户登录(JWT Token验证) -- 每个用户只能查看、编辑、删除自己创建的笔记 -- 删除操作为软删除,数据仍保留在数据库中 - -## 扩展功能(可选) - -如需添加以下功能,可以扩展: - -1. **笔记分类** - - 添加分类表和分类字段 - - 支持笔记分类管理 - -2. **笔记标签** - - 添加标签表和关联表 - - 支持多标签筛选 - -3. **笔记分享** - - 添加分享链接生成功能 - - 支持公开/私密设置 - -4. **笔记导出** - - 支持导出为PDF - - 支持导出为Markdown - -5. **版本历史** - - 记录笔记的修改历史 - - 支持版本回退 - -6. **协作编辑** - - 支持多人协作编辑 - - 实时同步功能 - -## 注意事项 - -1. 图片上传需要配置文件上传接口 -2. 富文本内容存储为HTML格式,注意XSS防护 -3. 数据库content字段使用longtext类型,支持大容量内容 -4. 建议定期清理软删除的数据 -5. 生产环境建议添加内容审核机制 - -## 技术栈 - -- **前端**: Vue 3 + Element Plus + Tiptap -- **后端**: Go + Beego + MySQL -- **编辑器**: Tiptap (基于ProseMirror) - -## 开发调试 - -### 前端调试 -```bash -cd platform -npm run dev -``` - -### 后端调试 -```bash -cd go -go run main.go -``` - -### 查看API请求 -打开浏览器开发者工具 -> Network 标签页,查看API请求和响应 - -## 问题排查 - -1. **笔记列表为空** - - 检查数据库表是否创建成功 - - 检查用户是否已登录 - - 查看浏览器Console是否有错误 - -2. **保存失败** - - 检查JWT Token是否有效 - - 检查标题是否为空 - - 查看后端日志 - -3. **编辑器显示异常** - - 检查Tiptap是否正确安装 - - 查看浏览器Console错误信息 - - 检查CSS样式是否正确加载 - -## 更新日志 - -### v1.0.0 (2024) -- ✅ 完成基础功能 -- ✅ 支持笔记CRUD操作 -- ✅ 集成Tiptap富文本编辑器 -- ✅ 响应式设计支持 -- ✅ 暗色模式支持 diff --git a/platform/src/views/tools/notebook/components/edit.vue b/platform/src/views/tools/notebook/components/edit.vue index 336e962..b069b1c 100644 --- a/platform/src/views/tools/notebook/components/edit.vue +++ b/platform/src/views/tools/notebook/components/edit.vue @@ -16,7 +16,7 @@