git 地址 vue数据管理系统项目地址

说明文档

1. 题目

实现一张数据管理表格，包含以下字段，实现其增删改查和查看。id 头像姓名性别手机号邮箱个人简介密码

2. 角色分配

管理员 : 姓名: 李磊 账号: admin 密码: admin

管理员mock数据

const managerData = {id: 1111,token: "qwer13265",name: "小马甲",phoneNum: 15623272359,role: 1,sex: "男",email: "123465@henhaoji.com",img:"https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=2621280521,1724782664&fm=26&gp=0.jpg",introduce:"游戏奋斗者,廿四哦打死哦i哦亲哦阿萨大四哦i倒是安居客圣诞节撒谎绘画覅婚纱活动教案或就哈哈的骄傲和世界的哈吉今安徽省的剧情和较好的",password: 666666,msg: "success",}

普通用户: 姓名:尤大大 账号:15623703201 密码:111111

3. 操作说明

3.1 登录

用户必须通过登录才能进入系统首页以及查看详情页，如果未登录用户通过url强行访问首页及详情页将会被拦截并跳转到登录页面
用户分角色登录展现不同权限的页面，项目中开通一个管理员账号和一个普通用户账号：
- 管理员：姓名 小马甲 账号 admin 密码 admin ，权限：查看所有用户列表，搜索单个用户，增加用户，编辑用户，删除用户，查看用户详情
- 普通用户：姓名:尤大大 账号:15623703201 密码:111111,权限：只能看到自己的列表，编辑自己信息，查看自己详情

3.2 查询

管理员总表查询:管理员通过账号登录可以查询到总体用户的数据并渲染到表格上
管理员单个查询:管理员可以通过上方的搜索框输入想要查询的人的名字全称就可以精准查询到

3.3 增加

管理员可以通过点击增加成员,弹出弹窗进行增加成员的表单的填写,表单通过验证后才能进行提交增加数据
表单验证规则: name :不能为空 password:密码不少于4位 email : /\w+@[a-z0-9]+.[a-z]{2,4}/ introduce不能为空

3.4 编辑

管理员可以通过点击编辑所有成员,普通用户只能编辑自己,弹出弹窗进行编辑成员的表单的填写,表单通过验证后才能进行提交更改数据
验证同上

3.4 删除

管理员可通过点击删除删除对应的列表

3.5 查看详情

管理员可以通过点击列表中所有的详情通过路由跳转到详情页面,普通用户只能查看自己的详情,如果通过url强行访问,将会进行路由拦截

vue数据管理系统项目说明文档相关推荐

c++ 家谱管理系统项目文档
家谱管理系统项目文档一．项目简介: 家谱是一种以表谱形式,记载一个以血缘关系为主体的家族世袭繁衍和重要任务事迹的特殊图书体裁.家谱是中国特有的文化遗产,是中华民族的三大文献(国史,地志,族谱)之一, ...
计算机毕业设计-基于springboot的电影院会员管理系统(项目+文档+ppt)
计算机毕业设计-基于springboot的电影院会员管理系统(项目+文档+ppt) 1.开发环境及工具下载开发语言:Java 架构:B/S 后台:SpringBoot 前端:HTML+CSS+Jav ...
权限管理系统项目文档——Vue前端
文章目录第二篇前端实现篇 1. 搭建开发环境 1.1 技术基础 1.2 开发环境 1.3 创建项目 2. 前端项目案例 2.1 安装Element 2.2 页面路由 2.3 安装SCSS 2.4 ...
权限管理系统项目文档——SpringBoot后端
文章目录关键技术第一篇后端实现篇 1. 搭建开发环境 2. 集成Swagger文档 3. 集成MyBatis框架 4. 集成Druid数据源 5. 跨域解决方案 6. 业务功能实现 6.1 工程 ...
图书管理系统（说明文档与相关代码）
图书信息管理系统目录一.设计说明 3 1.功能结构 3 2.项目架构 3 3.包及 Java 类说明 4 4.数据库设计 5 二.功能实现 5 1.登录 5 2.系统主界面 6 3.图书列表页面 ...
Vue后台管理系统项目——实现登录功能
文章目录登录功能 1. 登录业务流程 2. 登录业务相关技术点 3. 登录-- token 原理分析 4. 登录功能的实现(都记牢点) 登录页面的布局创建登录组件登录组件页面布局登录组件头部布 ...
Vue后台管理系统项目(2)后台管理系统模板介绍
目录 1.我们这里下载简洁版 2.新建一个空文件夹,把下载好的模板解压到该文件夹内 3.我们安装项目依赖 3.1安装完成后,我们打开项目 3.2运行项目运行后的效果: 4.模板中文件夹的作用 git ...
vue后台管理系统项目标准完整的目录开发架构
vue-cli@3.x 之前的版本构建的项目目录: vue-cli@3.x 之后的版本构建的项目目录: 两者区别: 安装创建命令: 3.x版本以前: npm i -g vue-clivue init ...
SAR数据集项目说明文档写作
0 田老师数据文件夹目录 MiniSAR:未知SAR数据. SAR图像--Sandia National Laboratories:来自美国Sandia国家实验室的数据,(附:美国Sandia国家实验 ...

vue数据管理系统项目说明文档