6.2 KiB
6.2 KiB
牛只运输管理系统数据结构说明
1. 概述
本文档详细描述了牛只运输管理系统中使用的主要数据结构，包括API接口返回数据结构、状态管理数据结构等。
2. API接口数据结构
2.1 用户相关接口
登录接口 /login
请求参数:
interface LoginRequest {
mobile: string; // 手机号
password: string; // 密码或验证码
loginType: number; // 登录类型(0:密码登录, 1:验证码登录)
}
响应数据:
interface LoginResponse {
token: string; // 认证令牌
mobile: string; // 手机号
username: string; // 用户名
userType: number; // 用户类型
roleId: string; // 角色ID
}
获取用户菜单接口 /getUserMenus
响应数据:
interface Menu {
id: string; // 菜单ID
parentId: string; // 父级菜单ID
name: string; // 菜单名称
routeUrl: string; // 路由URL
pageUrl: string; // 页面URL
icon: string; // 菜单图标
type: number; // 菜单类型(1:菜单, 2:按钮)
authority: string; // 权限标识
}
2.2 系统管理接口
岗位管理列表接口 /sysRole/queryList
请求参数:
interface PositionListRequest {
pageNum: number; // 页码
pageSize: number; // 每页条数
name?: string; // 岗位名称(可选)
}
响应数据:
interface PositionListResponse {
total: number; // 总条数
rows: Position[]; // 岗位列表
}
interface Position {
id: string; // 岗位ID
name: string; // 岗位名称
description: string; // 岗位描述
createTime: string; // 创建时间
isAdmin: number; // 是否管理员岗位(1:是, 其他:否)
}
岗位删除接口 /sysRole/delete
请求参数:
interface PositionDeleteRequest {
id: string; // 岗位ID
}
2.3 运输管理接口
运输计划相关接口
(具体接口结构需根据实际API文档补充)
2.4 检疫管理接口
检疫记录相关接口
(具体接口结构需根据实际API文档补充)
3. 状态管理数据结构
3.1 用户状态 (userStore)
interface UserState {
id: string; // 用户ID
username: string; // 用户名
token: string; // 认证令牌
loginUser: any; // 登录用户信息
userType: string; // 用户类型
roleId: string; // 角色ID
}
3.2 权限状态 (permissionStore)
interface PermissionState {
routes: Route[]; // 所有路由
addRoutes: Route[]; // 动态添加的路由
sidebarRouters: Route[]; // 侧边栏路由
routeFlag: boolean; // 路由加载标志
userPermission: string[]; // 用户权限列表
}
4. 路由数据结构
4.1 路由配置结构
interface RouteConfig {
path: string; // 路由路径
name?: string; // 路由名称
component: Component; // 组件
redirect?: string; // 重定向路径
meta: {
title: string; // 页面标题
keepAlive: boolean; // 是否缓存
requireAuth: boolean; // 是否需要认证
};
children?: RouteConfig[]; // 子路由
}
5. 组件数据结构
5.1 表单配置结构
interface FormItem {
label: string; // 标签文本
type: string; // 表单类型(input, select, date等)
param: string; // 参数名
placeholder?: string; // 占位符
span?: number; // 栅格占据的列数
labelWidth?: number; // 标签宽度
// 根据类型不同可能包含以下属性
selectOptions?: Option[]; // 下拉选项(仅select类型)
multiple?: boolean; // 是否多选(仅select类型)
labelKey?: string; // 标签键名(仅select类型)
valueKey?: string; // 值键名(仅select类型)
}
5.2 表格配置结构
interface TableColumn {
label: string; // 列标题
prop: string; // 对应字段名
width?: number; // 列宽
showOverflowTooltip?: boolean;// 是否显示溢出提示
}
6. 工具函数数据结构
6.1 树形结构处理
系统中多处使用树形结构数据，如菜单树、组织架构树等，统一采用以下结构：
interface TreeNode {
id: string; // 节点ID
parentId: string; // 父节点ID
name: string; // 节点名称
children?: TreeNode[]; // 子节点
}
7. 配置数据结构
7.1 环境配置
系统支持多种环境配置，通过环境变量文件进行管理：
.env: 基础配置.env.development: 开发环境配置.env.production: 生产环境配置
7.2 主题配置
系统支持主题配置，包括颜色、字体、间距等样式变量。
8. 数据存储结构
8.1 localStorage存储
// 用户信息存储
'userStore': {
id: string,
username: string,
token: string,
loginUser: object,
userType: string,
roleId: string
}
8.2 sessionStorage存储
(根据实际使用情况补充)
9. 数据交互流程
9.1 登录流程数据交互
1. 用户输入登录信息
2. 调用/login接口
3. 服务端验证并返回token等信息
4. 前端存储用户信息到store和localStorage
5. 调用/getUserMenus接口获取菜单信息
6. 根据菜单信息动态生成路由
7. 跳转到首页
9.2 页面访问流程
1. 用户访问某个页面URL
2. 路由守卫检查用户是否登录
3. 如未登录，跳转到登录页
4. 如已登录，检查用户是否有该页面权限
5. 如有权限，加载对应组件
6. 如无权限，显示无权限提示
10. 数据安全
10.1 敏感信息处理
- 密码等敏感信息在传输过程中进行加密处理
- token等认证信息通过HTTP Only Cookie或localStorage存储
- 关键操作需要二次确认
10.2 数据验证
- 前端对用户输入进行基础验证
- 后端对接口参数进行严格验证
- 防止SQL注入、XSS等安全问题