📚 图书信息平台 - 前端

概述

该项目是一个综合性图书管理系统，针对三种不同用户角色（系统管理员、工作人员和读者）进行了细致的功能设计。系统管理员具备全面的用户管理能力，包括创建、查询、修改及删除工作人员和单位信息，以及对图书信息进行维护管理。其特点在于，在图书和单位管理中，均设有详尽的操作列，如查看详情、修改和删除，并确保图书在删除前必须处于归还状态。

工作人员则专注于图书管理、图书借阅、借入借出管理和统计分析管理四大模块，能够进行图书信息的入库、修改、维护、查询，以及图书的借出、流入流出管理。工作人员仅能管理本单位图书，且在图书流通环节，可查阅并发起与其他单位的图书流通申请。

读者用户需注册账户后方可查看系统内的图书信息，拥有账户注册与管理、图书信息查看以及图书借阅与归还等功能。读者借阅图书的过程需经过工作人员审核，归还图书后会更新借阅状态。

整体系统设计强调了用户友好性和安全性，统一支持登录、密码重置以及个人信息修改，并在登录验证、资源操作权限控制等方面做了充分考虑。此外，系统还提供了便捷的数据统计分析工具，助力图书馆运营决策。

项目基本信息

项目体验地址：https://book.jarvlis.top, 目前体验服务器配置：1 核 2G

前端：

• HTML + CSS + JavaScript 三件套
• React 开发框架
• Ant Design Pro 项目模板
• Ant Design 端组件库
• Umi 开发框架
• Umi Request 请求库

后端：https://github.com/Jarvlis/bookSystem-backend

• Java8 编程语言
• Spring + SpringMVC + SpringBoot2.7 框架
• MyBatis 数据访问框架
• MySQL 数据库
• jUnit 单元测试库

项目内容目录

• 开始上手

• 系统功能架构

• 运行展示

• API 设计

• License

开始上手

// clone源代码或者下载代码包
$ git clone https://github.com/Jarvlis/bookSystem-frontend.git

环境准备

下载依赖包 node_modules:

npm install

or

yarn

提供命令

启动项目

npm start

构建项目

npm run build

查验代码风格

npm run lint

接着就可以运行啦，记得同时要启动后端哦！！

项目运行在: http://localhost:8000

系统功能架构

功能架构图

功能模块图

运行展示

(求求各位，为了其他人能够正常浏览，不要随意删除和修改数据，欢迎注册使用) 管理员登录，默认账户：admin，密码：123；

工作人员 staff1, 账户：staff1, 密码：123456789

工作人员 staff2, 账户：staff1, 密码：123456789

读者 reader, 账户：reader，密码：123456789

🏔️ 登录界面：

🏔️ 成功登录界面：

🏔️ 用户管理界面：

🏔️ 用户添加界面：此处的下拉列表是发送请求，请求所有的注册部门所获得的：

🏔️ 图书管理界面：

🏔️ 单位管理界面：

🏔️ 个人中心：

🏔️ 图书流通界面(部分)：

在单位 1 的工作人员中流通管理中，可以看到发起申请的流通信息：

单位 2 的工作人员的图书流出界面显示：

🏔️ 图书借阅管理界面(部分)：

🏔️ 读者发起申请界面：

借阅申请成功发起界面：

工作人员图书借出界面：

🏔️ 统计分析管理界面：

均为动态数据，会根据数据库表自动生成

API 设计

模块接口设计：

本系统采用 knife4j 生成接口文档，部署系统后可通过 http://localhost:8080/api/doc.html 进行访问，也可见附录文件夹，提供了 doc 文档和 html 文档进行查看。定义各个模块之间的接口，包括输入参数、输出结果和调用方式。

License

MIT License