11 图书借阅功能实现(Vue3+element plus +Spring Boot)

目录

  • 1 功能描述
  • 2 接口地址
  • 3 后端代码
  • 4 api/book.js中编写借阅图书的接口代码
  • 5 BookResourcesVue.vue组件中完成点击事件borrowBook
  • 6 功能演示

1 功能描述

普通用户借阅图书,点击借阅按钮,修改图书状态,最多能够借阅3本图书。

2 接口地址

图书借阅
GET http://localhost:8082/book/borrowBook

3 后端代码

 //用户借阅图书功能@GetMapping("/borrowBook")public Result userBorrowBook(String bookId){User user = ThreadLocalUtil.get();
//      查询用户当前借了是否达到三本书,如果达到,禁止借阅QueryWrapper<Book> queryWrapper = new QueryWrapper<>();queryWrapper.eq("book_borrower",user.getUserName());List<Book> books = iBookService.list(queryWrapper);if(books.size()>=3){return Result.error("借阅图书失败,借阅图书数量已达上限!");}//定义时间格式DateTimeFormatter dateFormatter = DateTimeFormatter.ofPattern("yyyy-MM-dd");//获取当前时间 格式为 yyyy-MM-ddString borrowTime = LocalDate.now().format(dateFormatter);//设置还书时间为当前时间的30天之后String returnTime =  LocalDate.now().plusDays(30).format(dateFormatter);//通过book_id查找需要借阅的图书UpdateWrapper<Book> updateWrapper = new UpdateWrapper<>();updateWrapper.eq("book_id",bookId).set("book_borrower",user.getUserName()).set("book_status","1").set("book_borrowtime",borrowTime).set("book_returntime",returnTime);boolean result = iBookService.update(updateWrapper); // 调用 update 方法if (result) {return Result.success("借阅图书成功");} else {return Result.error("借阅失败,可能图书已被其他人借阅或者是其他问题!");}}

4 api/book.js中编写借阅图书的接口代码

//借阅图书 发送get请求
export const bookBorrowService = (bookId) => {return request.get('/book/borrowBook', { params: { bookId: bookId } })
}

5 BookResourcesVue.vue组件中完成点击事件borrowBook

 <el-table-column v-else label="操作" width="100"><template #default="{ row }"><el-button v-if="row.bookStatus == 0" plain type="primary"@click="borrowBook(row.bookId)">借阅</el-button><el-button v-if="row.bookStatus == 1" plain disabled type="primary"@click="borrowBook(row.bookId)">借阅</el-button></template></el-table-column>

点击借阅,实现对应代码

// 导入借阅图书的接口
import { bookBorrowService } from '@/api/book.js'
const borrowBook = async (bookId) => {// 提示要借阅吗 如果确定 提交借阅申请await ElMessageBox.confirm('确定要借阅吗?', '提示', {confirmButtonText: '确定',cancelButtonText: '取消',type: 'warning'}).then(() => {// 用户点击了确定console.log("要借阅的图书为:" + bookId);bookBorrowService(bookId).then(result => {ElMessage.success(result.message ? result.message : '借阅成功')// 刷新列表getBooks()})}).catch(error => {ElMessage.error(error.message)})}

6 功能演示

添加链接描述
在这里插入图片描述

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

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

相关文章

保证缓存一致性的常用套路

缓存更新的套路 看到好些人在写更新缓存数据代码时&#xff0c;先删除缓存&#xff0c;然后再更新数据库&#xff0c;而后续的操作会把数据再装载的缓存中。然而&#xff0c;这个是逻辑是错误的。试想&#xff0c;两个并发操作&#xff0c;一个是更新操作&#xff0c;另一个是…

[MyBatis-Plus]扩展功能详解

代码生成 使用MP的步骤是非常固定的几步操作 基于插件, 可以快速的生成基础性的代码 安装插件安装完成后重启IEDA连接数据库 mp是数据库的名字?serverTimezoneUTC 是修复mysql时区, 不加会报错 生成代码 TablePrefix选项是用于去除表名的前缀, 比如根据tb_user表生成实体类U…

恒定电流下有功率密度,功率密度体积分就是恒定电流的功率

体积趋于0时&#xff0c;体积的功率就叫功率密度 恒定电流的 电场乘距离等于电压 电流面密度*面积等于电流注意&#xff1a;电流面密度不是电荷线面体密度&#xff0c;电荷线面体密度用在静电场中&#xff0c;即电荷不运动这种

redo文件误删除后通过逻辑备份进行恢复

问题描述 开发同事让在一个服务器上查找下先前库的备份文件是否存在&#xff0c;如果存在进行下恢复。翻了服务器发现备份文件存在&#xff0c;多愁了一眼竟翻到了该备份文件于2024.6.17日恢复过的日志&#xff0c;赶紧和开发沟通说2024.6.17号已经恢复过了为啥还要恢复&#x…

ESP32_S3驱动舵机servor sg90

ESP32_S3驱动舵机servor sg90 硬件连接图硬件外观[^1]硬件引脚功能图硬件连接引脚对照表硬件接线图 Arduino IDE添加ESP32_S3开发板[^2]安装SERVO3舵机驱动库[^3]下载库ZIP包安装库 ESP32_S3程序下载方式源代码SERVO库自带例程方式二 参考文献 调试ESP32_S3舵机发现舵机不动。查…

多线程编程

使用多线程完成两个文件的拷贝&#xff0c;分支线程1&#xff0c;拷贝前一半&#xff0c;分支线程2拷贝后一半&#xff0c;主线程用于回收分支线程的资源 #include<myhead.h>typedef struct sockaddr_in addr_in_t; typedef struct sockaddr addr_t; typedef struct soc…

Redis --- 第四讲 --- 常用数据结构 --- Hash、List

一、Hash哈希类型的基本介绍。 哈希表&#xff1a;之前学过的所有数据结构中&#xff0c;最最重要的。 1、日常开发中&#xff0c;出场频率非常高。 2、面试中&#xff0c;非常重要的考点。 Redis自身已经是键值对结构了。Redis自身的键值对就是通过哈希的方式来组织的。把…

【MySQL 保姆级教学】数据类型全面讲解(5)

数据类型 1. 数据类型分类1.1 数值类型1.2 文本和二进制类型1.3 日期类型 2 数值类型2.1 TINYINT 类型2.1.1 默认有符号类型2.1.2 无符号类型 2.2 INT 类型2.2.1 默认有符号类型2.2.2 无符号类型 2.3 BIT 类型2.3.1 语法2.3.2 举例 2.4 FLOAT 类型2.4.1 语法2.4.2 默认有符号类…

OpenCV高级图形用户界面(20)更改窗口的标题函数setWindowTitle()的使用

操作系统&#xff1a;ubuntu22.04 OpenCV版本&#xff1a;OpenCV4.9 IDE:Visual Studio Code 编程语言&#xff1a;C11 算法描述 在OpenCV中&#xff0c;cv::setWindowTitle函数用于更改窗口的标题。这使得您可以在程序运行时动态地更改窗口的标题文本。 函数原型 void cv::…

keepalived(高可用)+nginx(负载均衡)+web

环境 注意&#xff1a; (1) 做高可用负载均衡至少需要四台服务器&#xff1a;两台独立的高可用负载均衡器&#xff0c;两台web服务器做集群 (2) vip&#xff08;虚拟ip&#xff09;不能和物理ip冲突 (3) vip&#xff08;虚拟ip&#xff09;最好设置成和内网ip同一网段&#xf…

【Vulnhub靶场】Kioptrix Level 3

目标 本机IP&#xff1a;192.168.118.128 目标IP&#xff1a;192.168.118.0/24 信息收集 常规 nmap 扫存活主机&#xff0c;扫端口 根据靶机IP容易得出靶机IP为 192.168.118.133 nmap -sP 192.168.118.0/24nmap -p- 192.168.118.133 Getshell 开放22端口和80 端口 访问web…

Git极速入门

git初始化 git -v git config --global user.name "" git config --global user.email "" git config --global credential.helper store git config --global --list省略(Local) 本地配置&#xff0c;只对本地仓库有效–global 全局配置&#xff0c;所有…

第十七周:机器学习笔记

第十七周周报 摘要Abstratc一、机器学习——生成式对抗网络&#xff08;Generative Adversarial Networks | GAN&#xff09;——&#xff08;中&#xff09;1. GAN 的理论介绍2. 用JS散度训练存在的问题3. WGAN 算法4. 拓展——流体 总结 摘要 本周周报主要对GAN进行了详细的…

在ESP-IDF环境中如何进行多文件中的数据流转-FreeRTOS实时操作系统_流缓存区“xMessageBuffer”

一、建立三个源文件和对应的头文件 建立文件名&#xff0c;如图所示 图 1-1 二、包含相应的头文件 main.h 图 2-1 mess_send.h mess_rece.h和这个中类似,不明白的大家看我最后面的源码分享 图2-2 三、声明消息缓存区的句柄 大家注意&#xff0c;在main.c中定义的是全局变…

免费字体二次贩卖;刮刮乐模拟器;小报童 | 生活周刊 #4

Raycast 的两款在线工具 Raycast 公司出品&#xff0c;必属精品&#xff0c;之前的代码转图片工具&#xff0c;交互和颜值都做得很漂亮 现在又新出了一个 图标制作器&#xff0c;一键制作美观好看的图标 猫啃网 没想到像【汇文明朝体】这样免费的字体都被人拿来当成【打字机字…

基于知识图谱的电子元器件问答系统

你还在为寻找电子元器件的相关信息头疼吗&#xff1f;作为一名程序员或电子工程师&#xff0c;在项目中经常需要快速查询电子元件的属性或关联关系。今天给大家介绍一个可以大大提升工作效率的神器——基于知识图谱的电子元器件问答系统。这不仅是你学习和工作的好帮手&#xf…

vue2使用pdfjs-dist实现pdf预览(iframe形式,不修改pdfjs原来的ui和控件,dom层可以用display去掉一部分组件)

前情提要 在一开始要使用pdf预览的时候&#xff0c;第一次选的是vue-pdf&#xff0c;但是vue-pdf支持的功能太少&#xff0c;缺少了项目中需要的一项-复制粘贴功能 之后我一顿搜搜搜&#xff0c;最终貌似只有pdfjs能用 但是网上支持text-layer的貌似都是用的2.09那个版本。 使…

androidStudio编译导致的同名.so文件冲突问题解决

files found with path lib/arm64-v8a/libserial_port.so from inputs: ...\build\intermediates\library_jni\debug\jni\arm64-v8a\libserial_port.so C:\Users\...\.gradle\caches\transforms-3\...\jni\arm64-v8a\XXX.so 解决方式如下&#xff1a; 1.将gradle缓存文件删…

c++迷宫游戏

1、问题描述 程序开始运行时显示一个迷宫地图&#xff0c;迷宫中央有一只老鼠&#xff0c;迷宫的右下方有一个粮仓。游戏的任务是使用键盘上的方向健操纵老鼠在规定的时间内走到粮仓处。 基本要求: 老鼠形象可以辨认,可用键盘操纵老鼠上下左右移动&#xff1b;迷宫的墙足够结…

Android 第5种启动模式:singleInstancePerTask

Android 第5种启动模式&#xff1a;singleInstancePerTask 随着 Android 版本的更新&#xff0c;应用启动模式逐渐丰富。在 Android 12 中&#xff0c;新增了一种启动模式——singleInstancePerTask。它是继 standard、singleTop、singleTask 和 singleInstance 之后的第五种启…