Skip to content

模块:Workspace(工作台)

唯一职责:管理工作空间和画布列表,提供画布的创建、删除、恢复、重命名和打开入口。

边界

属于本模块:

  • 获取用户工作空间(不存在自动创建)
  • 展示画布列表(从后端 API 获取)
  • 触发创建新画布,跳转到画布编辑器
  • 触发删除画布(乐观删除 + 回滚)
  • 触发恢复已删除画布
  • 触发重命名画布(乐观更新 + 回滚)
  • 展示空状态提示

不属于本模块:

  • 后端 API 通信(由 Services 模块负责)
  • 画布内容的编辑(由 Canvas Editor 模块负责)

对外接口

Workspace 是顶层页面组件(路由 /),不对外暴露 API。仅通过 Vue Router 路由参数访问,无 props / emits。

消费的接口

依赖模块调用的方法/属性用途
workspaceStorefetchWorkspace()初始化加载工作空间 + 画布列表
workspaceStoreitems读取画布列表
workspaceStorecreateCanvas(name?)创建画布
workspaceStoredeleteItem(itemId)删除画布(移入回收站)
workspaceStorerestoreItem(itemId)恢复已删除画布
workspaceStorerenameCanvas(itemId, canvasId, name)重命名
Vue RouternavigateTo('/canvas/:id')打开画布

不变量

  1. 页面加载时自动获取工作空间,workspaceId 存入全局状态
  2. 删除操作采用乐观更新:立即从列表移除,API 失败时回滚
  3. 新建画布后立即跳转到编辑器页面

错误场景

场景模块行为调用方职责
fetchWorkspace() API 请求失败error 存储错误信息,列表为空页面展示错误状态
createCanvas() API 请求失败返回 nullerror 存储信息页面提示用户
deleteItem() API 请求失败乐观删除回滚,项目恢复到列表中页面提示用户
renameCanvas() API 请求失败乐观更新回滚,名称恢复原值页面提示用户

实现位置

角色文件路径
页面app/pages/index.vue
卡片组件app/components/dashboard/CanvasCard.vue
Storestores/workspaceStore.ts