📅  最后修改于: 2023-12-03 15:40:57.050000             🧑  作者: Mango
电子图书馆管理系统是一个管理图书馆资源的重要软件。本文将介绍该系统的设计和实现。
该系统分为前端和后端两部分,前端主要是用Vue.js框架开发,后端采用SpringBoot框架实现。数据库采用MySQL,在前端和后端之间使用了RESTful API进行数据传输。
前端实现了用户登录、注册、注销、图书检索、借阅、归还等功能,使用了axios进行后台API调用。
后端实现了用户管理、图书管理、借阅管理、权限管理等功能,使用了MyBatis进行数据库操作。同时,使用了Swagger UI进行API文档生成和测试,方便前后端联调。
@RestController
@RequestMapping("/api/books")
public class BookController {
@Autowired
private BookMapper bookMapper;
@GetMapping("/{bookId}")
public Book getBookById(@PathVariable Long bookId) {
return bookMapper.selectByPrimaryKey(bookId);
}
@PostMapping("/")
public int addBook(@RequestBody Book book) {
return bookMapper.insertSelective(book);
}
@PutMapping("/")
public int updateBook(@RequestBody Book book) {
return bookMapper.updateByPrimaryKeySelective(book);
}
@DeleteMapping("/{bookId}")
public int deleteBookById(@PathVariable Long bookId) {
return bookMapper.deleteByPrimaryKey(bookId);
}
}
<template>
<div>
<input type="text" v-model="keyword" placeholder="请输入关键词" />
<button @click="searchBooks">搜索</button>
<ul>
<li v-for="book in books" :key="book.id">
<img :src="book.coverUrl" />
<span>{{ book.name }}</span>
<button @click="borrowBook(book.id)">借阅</button>
</li>
</ul>
</div>
</template>
<script>
import axios from 'axios'
export default {
data() {
return {
keyword: '',
books: []
}
},
methods: {
searchBooks() {
axios.get('/api/books/search?keyword=' + this.keyword).then(res => {
this.books = res.data
})
},
borrowBook(bookId) {
axios.post('/api/borrow', { bookId }).then(() => {
alert('借阅成功')
})
}
}
}
</script>