Skip to content

🌐 Admin 请求与模块

Admin 请求封装位于:

text
frontend/admin/src/utils/request/index.ts

📑 请求默认配置

配置说明
baseURLVITE_APP_BASE_URL 处理后的域名
urlPrefixadminapi
timeout10 秒
Content-Typeapplication/json
versionfrontend/admin/src/config/index.ts 中的版本
withToken默认 true
isParamsToDataPOST 默认把 params 转为 data
isOpenRetry默认开启请求重试

📁 API 文件放置

System 模块 API 位于:

text
frontend/admin/src/views/System/api

该目录按业务继续细分:

text
api/
├─ article/
├─ integration/
├─ language/
├─ org/
├─ perms/
├─ setting/
├─ app.ts
├─ decoration.ts
├─ file.ts
├─ login.ts
├─ message.ts
├─ search.ts
└─ user.ts

新增模块建议遵循同样模式:

text
src/views/{Module}/api
src/views/{Module}/{feature}/index.vue
src/views/{Module}/{feature}/edit.vue

可选业务模块如果需要支持安装、卸载,不应把页面长期直接放在主工程。推荐先放入模块资源包:

text
modules/{Module}/Resources/admin/src/views/{Module}

再通过 modules/{Module}/Resources/publish-manifest.json 发布到:

text
frontend/admin/src/views/{Module}

模块卸载时,安装器会删除发布过的页面资源。后台菜单中的 component 仍然以 src/views 为根,例如 {Module}/{feature}/index

可选能力模块的 API 封装放在自己的模块页面目录中,例如:

text
frontend/admin/src/views/{Module}/api

跨模块共用的轻量注册表或适配器可以放到 frontend/admin/src/components,具体业务页面仍由模块资源包发布。

🧑‍💻 API 写法示例

ts
import request from '@/utils/request'

export function articleList(params?: Record<string, any>) {
  return request.get({ url: '/system/article/list/index', params })
}

注意:不需要在业务 API 文件里重复写 adminapi,请求封装会自动拼接前缀。

📡 响应处理

统一响应处理规则:

  • 成功:code=200,返回 data
  • 成功提示:后端返回 message 时自动成功提示。
  • 业务错误:展示 messagePromise.reject(response.data)
  • 登录失效:清理 token 并跳转登录页。
  • 打开外部页:code=2,跳转 data.url

⬆️ 上传

后台上传接口:

text
POST /adminapi/system/upload/file

后端有 admin-upload 限流。文件类型、大小规则由 config/sunadmin.phpupload 配置控制。

🪛 页面开发建议

  • 列表页优先复用 components/admin/list-shell.vuesurface-card.vue 等后台壳组件。
  • 表单弹窗或编辑页要和接口保存字段保持一一对应,不做无意义兼容字段。
  • 菜单页面组件路径以 src/views 为根,例如 System/user/index
  • 可安装模块的装修链接入口写入 admin.app_links,由安装器生成 src/modules/app-links.ts
  • 需要刷新菜单权限时调用用户 store 的 refreshUserAccess()
  • 请求错误由拦截器统一提示,页面只处理业务上的恢复动作。