016 Spring Boot + Vue 图书管理系统

Spring Boot + Vue 图书馆管理系统(library-system)

本地快捷预览项目

第一步:运行 db 文件夹下的springboot-vue.sql(询问作者获取),创建springboot-vue数据库

第二步:修改后端数据库配置文件,启动后端

第三步:vue目录下:在cmd运行npm install,npm run serve ,浏览器访问localhost:9876

主要技术

SpringBoot、Mybatis-Plus、MySQL、Vue3、ElementPlus等

主要功能

管理员模块:注册、登录、书籍管理、读者管理、借阅管理、借阅状态、修改个人信息、修改密码

读者模块:注册、登录、查询图书信息、借阅和归还图书、查看个人借阅记录、修改个人信息、修改密码

主要功能截图

登录

登录支持两种用户角色:管理员和读者

输入正确的账号、密码后,系统会自动识别管理员或者用户,并跳转到相应主页。

在这里插入图片描述

展示板页面

在这里插入图片描述

管理员界面

图书管理
  • 图书表格列表

    在这里插入图片描述

  • 添加图书

    在这里插入图片描述

  • 编辑图书

    在这里插入图片描述

  • 删除图书

    在这里插入图片描述

读者管理
  • 读者管理的增删查改类似图书管理,不再赘述

    在这里插入图片描述

借阅管理
  • 借阅记录查询

    在这里插入图片描述

  • 借阅记录编辑

    在这里插入图片描述

    借阅状态

    在这里插入图片描述

读者界面

读者信息
  • 编辑个人信息

    在这里插入图片描述

  • 修改密码

    点击修改密码按钮,修改密码

    在这里插入图片描述

图书查询

在这里插入图片描述

借阅图书

在这里插入图片描述
在这里插入图片描述

归还图书

在这里插入图片描述

借阅记录

在这里插入图片描述

借阅状态

在这里插入图片描述

代码结构

前端

library-ui
├─api			// api接口
├─assets		// 资源文件	
│  ├─icon	 	// 图标
│  ├─img	 	// 图片
│  └─styles	 	// 样式
├─components	// 自定义Vue组件
├─layout		// 页面布局
├─router		// Vue路由
├─utils			// 工具函数
└─views			// 页面

在这里插入图片描述

后端

maven项目结构

library-serve
├─java
│  └─com
│      └─admin
│          └─library
│              ├─common			// 通用类
│              │  ├─base		// 基础类
│              │  └─config		// 配置类
│              ├─controller		// 控制层
│              ├─domain			// 实体类
│              ├─mapper			// 持久层
│              └─service		// 业务层
└─resources	// maven资源配置

在这里插入图片描述

数据库

使用Navicat生成ER模型图

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/128674.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

开启深度学习之门—《深度学习》

开启深度学习之门—《深度学习》 《深度学习》由Ian Goodfellow和Yoshua Bengio合著,以其前沿的内容和深入浅出的风格,成为了当今最受欢迎的人工智能教材之一。首先,让我们来了解一下这两位作者。Ian Goodfellow是一位备受瞩目的计算机科学家,他在深度学习和生成对抗网络的…

菜单子节点的写法

菜单子节点的写法 1.测试数据2.实现代码3.获取父ID层级 1.测试数据 1.表结构SQL CREATE TABLE test (id int DEFAULT NULL,u_id int DEFAULT NULL,p_u_id int DEFAULT NULL ) ENGINEInnoDB DEFAULT CHARSETutf8mb4 COLLATEutf8mb4_general_ci;2.数据SQL INSERT INTO test (i…

【EI会议征稿】第三届智慧交通、能源与动力国际学术会议(STEP 2023)

第三届智慧交通、能源与动力国际学术会议(STEP 2023) 2023 3rd International Conference on Smart Transportation, Energy and Power 第三届智慧交通、能源与动力国际学术会议 (STEP 2023) 将于2023年12月15-17日在中国三亚市隆重举行,会议…

tcpdump(四)命令行参数讲解(三)

一 BPF高级过滤条件 高级filter官方地址 常见需求案例汇总 过滤的目的:获取最精细、准确的数据思考: 抓取更精确的包?1) tcp/ip 报文结构要精通,这样才能知道如何获取自己想要的信息 -> 偏移量2) tcpdump 的synax语法要精通,要正确写对3) 多练习…

docker入门加实战—docker安装并配置阿里云加速

docker入门加实战—docker安装并配置阿里云加速 为什么要学习docker 在开发和部署项目的过程中,经常会遇到如下问题: 软件安装包名字复杂,不知道去哪里找安装软件和部署项目步骤复杂,容易出错 这就是我们今天要学习Docker技术…

29 WEB漏洞-CSRF及SSRF漏洞案例讲解

目录 CSRF漏洞解释,原理等CSRF漏洞检测,案例,防御等防御方案2、设置随机Token3、检验referer来源 SSRF漏洞会比csrf漏洞重要一些SSRF_PHP,JAVA漏洞代码协议运用演示案例:SSRF_漏洞代码结合某漏洞利用测试 如何查找ssrf漏洞 SSRF漏…

k8s-9 ingress-nginx 特性

TLS加密 创建证书 测试 auth认证 创建认证文件 rewrite重定向 进入域名 会自动重定向hostname.html 示例二: 测试 后面必须跟westos 这个关键字 canary金丝雀发布 基于header灰度 场景:版本的升级迭代,比如一个service 升级到另…

Windows安装Node.js

1、Node.js介绍 ①、Node.js简介 Node.js是一个开源的、跨平台的JavaScript运行环境,它允许开发者使用JavaScript语言来构建高性能的网络应用程序和服务器端应用。Node.js的核心特点包括: 1. 事件驱动: Node.js采用了事件驱动的编程模型,通…

如何对比github中不同commits的区别

有时候想要对比跨度几十个commits之前的代码区别,想直接使用github的用户界面。可以直接在官网操作。 示例 首先要创建一个就commit的branch。进入该旧的commit,然后输入branch名字即可。 然后在项目网址后面加上compare即可对比旧的branch和新的bran…

MQTT服务器源码解析

目录 1、关于header问题 2、MQTT 连接参数的使用 2.1连接地址 2.2 基于 TCP 的 MQTT 连接 2.3 基于 WebSocket 的连接 3、订阅topic 4、推送消息给订阅者 5、QOS 机制 5.1 QOS是什么 5.2 QOS的实现原理 5.3 发送流程 6、reatain机制 总结:给还没上线的…