6. 图书管理功能测试
经过以上几个步骤，即可完成图书管理的基本操作，主要包括图书的查询，新增，编辑，删除，已经分页等功能，如下所示：
图书借还
1. 图书借还数据表结构
图书借还包括图书的借阅和归还，两个功能，主要记录借阅人，借阅时间，归还时间，以及经手人，数据表结构如下所示：
2. 图书借还实体类
数据表实体类和数据表一一对应，主要通过EntityFrameword与数据库进行映射。如下所示：
namespace CLMS.Entity { /// <summary> /// 借还记录 /// </summary> public class CirculateEntity { /// <summary> /// 唯一标识 /// </summary> public int Id { get; set; } /// <summary> /// 图书标识 /// </summary> public int BookId { get; set; } /// <summary> /// 是否归还 /// </summary> public bool IsReturn { get; set; } /// <summary> /// 借阅人 /// </summary> public string BorrowUser { get; set; } /// <summary> /// 借阅时间 /// </summary> public DateTime BorrowTime { get; set; } /// <summary> /// 借阅确认人 /// </summary> public string BorrowConfirmor { get; set; } /// <summary> /// 归还时间 /// </summary> public DateTime? ReturnTime { get; set; } /// <summary> /// 归还确认人 /// </summary> public string? ReturnConfirmor { get; set; } } }
3. 图书借还页面布局
图书借还主要包括信息查询，借阅和归还等功能，页面布局如下所示：
<div id="app"> <template> <el-breadcrumb separator-class="el-icon-arrow-right"> <el-breadcrumb-item>图书管理</el-breadcrumb-item> <el-breadcrumb-item>图书借阅及归还</el-breadcrumb-item> </el-breadcrumb> <el-form :inline="true" :model="queryCondition" class="demo-form-inline" style="margin-top: 10px; border: solid;border-width: 1px;border-color: #ebeef5;padding: 10px;"> <el-form-item label="书籍名称"> <el-input v-model="queryCondition.Name" placeholder="书籍名称"></el-input> </el-form-item> <el-form-item> <el-button type="primary" v-on:click="handleQuery">查询</el-button> </el-form-item> <el-form-item> <el-button type="primary" v-on:click="handleBorrow">借阅</el-button> </el-form-item> <el-form-item> <el-button type="primary" v-on:click="handleReturn">归还</el-button> </el-form-item> </el-form> <el-table :data="tableData" style="width: 100%" border :default-sort="{prop: 'BorrowTime', order: 'descending'}"> <el-table-column prop="Name" label="书籍名称" sortable ></el-table-column> <el-table-column prop="ISBN" label="ISBN" sortable ></el-table-column> <el-table-column prop="BorrowUser" label="借阅人" sortable ></el-table-column> <el-table-column prop="BorrowTime" label="借阅时间" sortable ></el-table-column> <el-table-column prop="BorrowConfirmor" label="借阅经手人" sortable ></el-table-column> <el-table-column prop="IsReturn" label="是否归还" sortable ></el-table-column> <el-table-column prop="ReturnTime" label="归还时间" sortable ></el-table-column> <el-table-column prop="ReturnConfirmor" label="归还经手人" sortable ></el-table-column> </el-table> <el-pagination background layout="prev, pager, next" :page-size="pageSize" :current-page="currentPage" :total="total" style="margin-top:10px;" v-on:current-change="handlePageChanged" v-on:prev-click="handlePrevClick" v-on:next-click="handleNextClick"></el-pagination> <el-dialog title="借阅信息" :visible.sync="dialogFormBorrowVisible"> <el-form :model="borrowForm"> <el-form-item label="ISBN" :label-width="formLabelWidth"> <el-input v-model="borrowForm.ISBN" autocomplete="off"></el-input> </el-form-item> <el-form-item label="书籍名称" :label-width="formLabelWidth"> <el-input v-model="borrowForm.Name" autocomplete="off"></el-input> </el-form-item> <el-form-item label="借阅人" :label-width="formLabelWidth"> <el-input v-model="borrowForm.BorrowUser" autocomplete="off"></el-input> </el-form-item> </el-form> <div slot="footer" class="dialog-footer"> <el-button v-on:click="dialogFormBorrowVisible = false">取 消</el-button> <el-button type="primary" v-on:click="handleSaveBorrow">确 定</el-button> </div> </el-dialog> <el-dialog title="归还信息" :visible.sync="dialogFormReturnVisible"> <el-form :model="returnForm"> <el-form-item label="ISBN" :label-width="formLabelWidth"> <el-input v-model="returnForm.ISBN" autocomplete="off"></el-input> </el-form-item> <el-form-item label="书籍名称" :label-width="formLabelWidth"> <el-input v-model="returnForm.Name" autocomplete="off"></el-input> </el-form-item> </el-form> <div slot="footer" class="dialog-footer"> <el-button v-on:click="dialogFormReturnVisible = false">取 消</el-button> <el-button type="primary" v-on:click="handleSaveReturn">确 定</el-button> </div> </el-dialog> </template> </div>
4. 图书借还数据交互
数据交互通过JS脚本进行，书写格式和VUE2.0保持一致，在页面启动时，加载所有的图书借还信息，并绑定到el-table对象，所以需要在mounted函数中增加调用向服务器端发出请求，当用户借阅或归还保存时，通过axios发送请求到服务端接口。
<script> var app= new Vue({ el: '#app', data:function() { return { queryCondition:{ Name:'' }, formLabelWidth: '120px', addOrEditForm:{ Id:0, ISBN: '', Name: '', BorrowConfirmor: '', BorrowTime: '', BorrowUser: '', IsReturn:'', ReturnConfirmor: '', ReturnTime: '', }, borrowForm:{ Id:0, ISBN: '', Name: '', BorrowUser:'' }, returnForm:{ Id:0, ISBN: '', Name: '', }, total:0, pageSize:10, currentPage:1, tableData: [], dialogFormBorrowVisible: false, dialogFormReturnVisible: false, } }, mounted:function(){ this.query(1); }, methods: { handleOpen(key, keyPath) { console.log(key, keyPath); }, handleClose(key, keyPath) { console.log(key, keyPath); }, formatter(row, column) { return row.address; }, handleQuery(){ console.log("query"); this.query(1); }, handlePageChanged(val){ this.query(val); }, handlePrevClick(){ //query(this.currentPage); }, handleNextClick(){ //query(this.currentPage); }, handleBorrow(){ this.dialogFormBorrowVisible=true; }, handleReturn(){ this.dialogFormReturnVisible=true; }, handleSaveBorrow(){ this.$confirm('确定要借阅编号为'+this.borrowForm.ISBN+'的书籍吗?', '提示', { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' }).then(() => { var that=this; axios.post('/Circulate/Borrow', { Id:that.borrowForm.Id, ISBN:that.borrowForm.ISBN, Name:that.borrowForm.Name, BorrowUser:that.borrowForm.BorrowUser, }).then(function (response) { if(response.status==200){ var msg = response.data; console.log(msg); if(msg.code=="0"){ //刷新页面 that.dialogFormBorrowVisible=false; that.$message({ type: 'success', message: '借阅成功!' }); that.query(1); }else{ that.$message.error(msg.message); } } console.log(response); }).catch(function (error) { that.$message.error(error); }); console.log("delete"); }).catch(() => { this.$message({ type: 'info', message: '已取消借阅' }); }); }, handleSaveReturn(){ this.$confirm('确定要归还编号为'+this.returnForm.ISBN+'的书籍吗?', '提示', { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' }).then(() => { var that=this; axios.post('/Circulate/Return', { Id:that.returnForm.Id, ISBN:that.returnForm.ISBN, Name:that.returnForm.Name, }).then(function (response) { if(response.status==200){ var msg = response.data; console.log(msg); if(msg.code=="0"){ //刷新页面 that.dialogFormReturnVisible=false; that.$message({ type: 'success', message: '归还成功!' }); that.query(1); }else{ that.$message.error(msg.message); } } console.log(response); }).catch(function (error) { that.$message.error(error); }); console.log("delete"); }).catch(() => { this.$message({ type: 'info', message: '已取消归还' }); }); }, query(pageNum){ var that = this; this.tableData=[]; console.log("query"); axios.get('/Circulate/Query', {params:{ Name:this.queryCondition.Name, PageSize:this.pageSize, PageNum:pageNum }}).then(function (response) { if(response.status==200){ var data = response.data; var count=data.count; that.total = count; for (let i = 0; i < data.items.length; i++) { that.tableData.push({ Id:data.items[i].id, ISBN: data.items[i].isbn, Name: data.items[i].name, BorrowConfirmor: data.items[i].borrowConfirmor, BorrowTime: data.items[i].borrowTime, BorrowUser: data.items[i].borrowUser, IsReturn:data.items[i].isReturn==true?'已归还':'未归还', ReturnConfirmor: data.items[i].returnConfirmor, ReturnTime: data.items[i].returnTime, }); } } console.log(response); }).catch(function (error) { console.log(error); }); }, } }); </script>
5. 图书借还控制器CirculateController
控制器主要用于响应用户的请求，与数据库交互，并返回执行的结果信息。
namespace CLMS.Host.Controllers { /// <summary> /// 借还管理 /// </summary> public class CirculateController : Controller { private DataContext dataContext; public CirculateController(DataContext context) { dataContext = context; } public IActionResult Index() { return View(); } [HttpGet] public PagedRequest<Circulate> Query(string Name, int pageNum, int pageSize) { Name = string.IsNullOrEmpty(Name) ? string.Empty : Name; var dtos = dataContext.Circulates.Join(dataContext.Books, c => c.BookId, b => b.Id, (c, b) => new Circulate() { Id = c.Id, Name = b.Name, BookId = c.BookId, BorrowConfirmor = c.BorrowConfirmor, BorrowTime = c.BorrowTime, BorrowUser = c.BorrowUser, ISBN = b.ISBN, IsReturn = c.IsReturn, ReturnConfirmor = c.ReturnConfirmor, ReturnTime = c.ReturnTime, }).Where(r=>r.Name.Contains(Name)); var total = dtos.Count(); var dtos2 = dtos.Skip((pageNum - 1) * pageSize).Take(pageSize).ToList(); // return new PagedRequest<Circulate>() { count = total, items = dtos2, }; } [Consumes("application/json")] [HttpPost] public Msg Borrow([FromBody]Borrow borrow) { Msg msg = new Msg(); if (borrow == null || string.IsNullOrEmpty(borrow.ISBN)) { msg.code = 1; msg.message = "书籍为空"; return msg; } var book = dataContext.Books.FirstOrDefault(r => r.ISBN == borrow.ISBN); if (book == null) { msg.code = 1; msg.message = "ISBN有误"; return msg; } var entity = dataContext.Circulates.FirstOrDefault(r => r.BookId == book.Id && r.IsReturn == false); if (entity != null) { msg.code = 1; msg.message = "书籍已被借阅"; return msg; } var userId = HttpContext.Session.GetInt32("UserId"); if (userId < 0) { msg.code = 1; msg.message = "尚未登录"; return msg; } var borrorConfirmor = dataContext.Users.FirstOrDefault(r => r.Id == userId)?.NickName; var entity2 = new CirculateEntity() { Id = 0, BookId = book.Id, IsReturn = false, BorrowTime = DateTime.Now, BorrowUser=borrow.BorrowUser, BorrowConfirmor= borrorConfirmor, }; this.dataContext.Circulates.Add(entity2); this.dataContext.SaveChanges(); msg.code = 0; msg.message = "success"; return msg; } /// <summary> /// 归还 /// </summary> /// <param name="returns"></param> /// <returns></returns> [Consumes("application/json")] [HttpPost] public Msg Return([FromBody] Return returns) { Msg msg = new Msg(); if (returns == null || string.IsNullOrEmpty(returns.ISBN)) { msg.code = 1; msg.message = "书籍为空"; return msg; } var book = dataContext.Books.FirstOrDefault(r => r.ISBN == returns.ISBN); if (book == null) { msg.code = 1; msg.message = "ISBN有误"; return msg; } var userId = HttpContext.Session.GetInt32("UserId"); if (userId < 0) { msg.code = 1; msg.message = "尚未登录"; return msg; } var returnConfirmor = dataContext.Users.FirstOrDefault(r => r.Id == userId)?.NickName; var entity = dataContext.Circulates.FirstOrDefault(r => r.BookId == book.Id && r.IsReturn == false); if (entity != null) { entity.IsReturn = true; entity.ReturnTime = DateTime.Now; entity.ReturnConfirmor=returnConfirmor; dataContext.Circulates.Update(entity); dataContext.SaveChanges(); msg.code = 0; msg.message = "success"; } else { msg.code = 1; msg.message = "书籍已归还"; } return msg; } } }
6. 图书借还功能测试
图书借还主要包括借阅和归还，如下所示：
以上就是校园图书管理系统的图书管理及图书借还功能实现，功能正在开发完善中，后续功能再继续介绍。旨在抛砖引玉，一起学习，共同进步。
