个人开发接口文档

Appearance

部门管理 ​

概述 ​

部门管理是系统中用于管理和维护组织结构中的部门信息的核心模块。通过该模块，管理员可以对部门进行添加、编辑、删除等操作，并且可以配置部门的层级关系和权限。部门管理模块确保了系统的组织架构清晰、易于扩展，并且能够根据用户角色动态展示不同的部门内容。

主要功能 ​

1. 部门列表查看 ​

  • 功能描述：以表格形式展示所有部门的详细信息，包括部门名称、父级部门、创建时间、更新时间等。

  • 字段说明：

    • 部门ID：唯一标识符。
    • 部门名称：部门的显示名称。
    • 父级部门ID：关联上级部门（0表示顶级部门）。
    • 创建时间：部门的创建时间。
    • 更新时间：部门的最后更新时间。

  • 操作按钮：

    • 编辑：进入编辑模式，修改部门信息。
    • 删除：删除选中的部门。
    • 排序：调整部门的显示顺序。

2. 添加部门 ​

  • 功能描述：管理员可以新增一个部门。

  • 字段说明：

    • 部门名称：必填，部门的显示名称。
    • 父级部门：选择上级部门（可选，默认为顶级部门）。
    • 状态：选择部门的状态（启用/禁用）。

  • 操作按钮：

    • 保存：保存新增的部门。
    • 取消：放弃新增并返回部门列表。

3. 编辑部门 ​

  • 功能描述：管理员可以编辑现有部门的信息。

  • 字段说明：

    • 部门名称：可修改，部门的显示名称。
    • 父级部门：可修改，选择上级部门。
    • 状态：可修改，选择部门的状态（启用/禁用）。

  • 操作按钮：

    • 保存：保存修改后的部门信息。
    • 取消：放弃修改并返回部门列表。

4. 删除部门 ​

  • 功能描述：管理员可以删除指定的部门。
  • 确认提示：删除前会弹出确认对话框，提醒管理员是否继续删除。
  • 级联删除：如果删除的是父级部门，可以选择是否同时删除其所有子部门。

5. 排序部门 ​

  • 功能描述：管理员可以通过拖拽或手动输入序号来调整部门的显示顺序。
  • 操作方式：
    • 拖拽排序：通过鼠标拖拽部门进行排序。
    • 手动输入：直接在排序序号字段中输入新的序号。

6. 权限配置 ​

  • 功能描述：管理员可以为每个部门配置访问权限，确保只有授权用户才能访问。

  • 字段说明：

    • 角色列表：选择允许访问该部门的角色。
    • 权限类型：选择具体的权限类型（如只读、编辑等）。

  • 操作按钮：

    • 保存：保存权限配置。
    • 取消：放弃修改并返回部门列表。

技术实现 ​

数据库设计 ​

  • 部门表 (departments)：

    • id：主键，自增。
    • name：部门名称。
    • parent_id：外键，关联上级部门（0表示顶级部门）。
    • status：部门状态（0: 禁用, 1: 启用）。
    • created_at：创建时间。
    • updated_at：更新时间。

  • 部门权限表 (department_permissions)：

    • department_id：外键，关联部门表。
    • role_id：外键，关联角色表。
    • permission_type：权限类型（如只读、编辑等）。

前端实现 ​

技术栈 ​

  • 框架：Vue.js 3.x
  • UI库：Naive UI
  • 状态管理：Pinia
  • 路由管理：Vue Router
  • API请求：Axios

页面结构 ​

  1. 部门列表页

    • 组件：DepartmentList.vue
    • 功能：
      • 使用 Naive UI 的 n-data-table 组件展示部门列表。
      • 支持分页、排序和筛选功能。
      • 提供搜索栏，使用 n-input 和 n-button 组件实现模糊查询。
      • 提供批量操作按钮（如批量删除）。
      • 提供操作列，包含编辑、删除、排序等功能按钮。

  2. 添加部门页

    • 组件：AddDepartment.vue
    • 功能：
      • 使用 Naive UI 的 n-form 和 n-form-item 组件构建部门添加表单。
      • 表单字段包括部门名称、父级部门、状态。
      • 提交表单时，调用后端 API 新增部门。

  3. 编辑部门页

    • 组件：EditDepartment.vue
    • 功能：
      • 使用 Naive UI 的 n-form 和 n-form-item 组件构建部门编辑表单。
      • 表单字段包括部门名称、父级部门、状态。
      • 提交表单时，调用后端 API 更新部门信息。

  4. 排序部门页

    • 组件：SortDepartment.vue
    • 功能：
      • 使用 Naive UI 的 n-draggable 组件实现拖拽排序。
      • 提供手动输入排序序号的功能。
      • 提交排序结果时，调用后端 API 更新部门的排序序号。

  5. 权限配置页

    • 组件：DepartmentPermissions.vue
    • 功能：
      • 使用 Naive UI 的 n-select 组件选择允许访问该部门的角色。
      • 使用 n-radio-group 组件选择具体的权限类型。
      • 提交权限配置时，调用后端 API 更新部门的权限信息。

接口列表 ​

1. 获取部门列表 ​

  • URL：/api/departments
  • 方法：GET

请求参数 ​

参数名类型是否必填默认值描述
pageint否1当前页码
pageSizeint否10每页显示条数
searchstring否搜索关键字（部门名称等）

成功响应 ​

json
{
  "total": 100,
  "data": [
    {
      "id": 1,
      "name": "研发部",
      "parentId": 0,
      "status": 1,
      "createdAt": "2023-09-01T08:00:00Z",
      "updatedAt": "2023-09-01T08:00:00Z"
    },
    ...
  ]
}

2. 添加部门 ​

  • URL：/api/departments
  • 方法：POST
  • 请求头:
    • Content-Type: application/json

请求体 ​

json
{
  "name": "新部门",
  "parentId": 0,
  "status": 1
}

成功响应 ​

json
{
  "id": 101,
  "name": "新部门",
  "parentId": 0,
  "status": 1,
  "createdAt": "2023-09-01T08:00:00Z",
  "updatedAt": "2023-09-01T08:00:00Z"
}

3. 编辑部门 ​

  • URL：/api/departments/{id}
  • 方法：PUT
  • 路径参数：
    • id：部门ID
  • 请求头:
    • Content-Type: application/json

请求体 ​

json
{
  "name": "更新后的部门",
  "parentId": 0,
  "status": 1
}

成功响应 ​

json
{
  "id": 101,
  "name": "更新后的部门",
  "parentId": 0,
  "status": 1,
  "updatedAt": "2023-09-01T08:00:00Z"
}

4. 删除部门 ​

  • URL：/api/departments/{id}
  • 方法：DELETE
  • 路径参数：
    • id：部门ID

成功响应 ​

json
{
  "message": "删除成功"
}

5. 排序部门 ​

  • URL：/api/departments/sort
  • 方法：POST
  • 请求头:
    • Content-Type: application/json

请求体 ​

json
{
  "departmentIds": [1, 2, 3, 4]
}

成功响应 ​

json
{
  "message": "排序成功"
}

6. 配置部门权限 ​

  • URL：/api/departments/{id}/permissions
  • 方法：POST
  • 路径参数：
    • id：部门ID
  • 请求头:
    • Content-Type: application/json

请求体 ​

json
{
  "roleId": 1,
  "permissionType": "edit"
}

成功响应 ​

json
{
  "message": "权限配置成功"
}

附录 ​

接口规范 ​

  • HTTP状态码：

    • 200 OK：请求成功。
    • 201 Created：资源创建成功。
    • 204 No Content：请求成功但无返回内容。
    • 400 Bad Request：客户端请求有误。
    • 404 Not Found：请求的资源不存在。
    • 409 Conflict：请求冲突，例如资源已存在。

  • 错误响应格式：

    json
    {
  "error": "Error message",
  "details": ["Detail 1", "Detail 2"]
}

  • 时间格式：

    • 使用 ISO 8601 标准格式，例如 2023-01-01T00:00:00Z。

总结 ​

部门管理模块是系统中不可或缺的一部分，它不仅提供了对部门信息的全面管理，还确保了系统的组织架构清晰和可扩展性。通过合理的权限配置和部门信息的增删改查功能，管理员可以有效地管理和调整部门结构，保障系统的稳定运行和用户体验。如果有其他问题或需要进一步的帮助，请随时联系技术支持团队。

滇ICP备2024047254号-1
滇公网安备53011102001490