汽車租賃系統
阿新 • • 發佈:2022-03-11
汽車租賃系統
1.使用者模組
1.使用者列表
1.修改 user/list.jsp
<form class="layui-form"> <blockquote class="layui-elem-quote quoteBox"> <form class="layui-form layui-form-pane"> <div class="layui-form-item"> <div class="layui-inline"> <label class="layui-form-label">姓名</label> <div class="layui-input-inline"> <input type="text" class="layui-input" placeholder="姓名" id="realname"> </div> </div> <div class="layui-inline"> <label class="layui-form-label">手機號</label> <div class="layui-input-inline"> <input type="text" class="layui-input" placeholder="手機號" id="phone"> </div> </div> <div class="layui-inline"> <label class="layui-form-label">地址</label> <div class="layui-input-inline"> <input type="text" class="layui-input" placeholder="地址" id="address"> </div> </div> <div class="layui-inline"> <button class="layui-btn" id="searchBtn" type="button">搜尋</button> <button class="layui-btn layui-btn-primary" type="reset">重置</button> </div> </div> </form> </blockquote> <table id="dataTable" lay-filter="dataTableFilter"></table> <%--操作--%> <script type="text/html" id="headBtns"> <button class="layui-btn layui-btn-sm" lay-event="add"> <i class="layui-icon layui-icon-add-1"></i> 新增 </button> </script> <script type="text/html" id="rowBtns"> <button class="layui-btn layui-btn-sm" lay-event="resetPwd"> <i class="layui-icon layui-icon-refresh"></i> 重置密碼 </button> <button class="layui-btn layui-btn-sm" lay-event="setRoles"> <i class="layui-icon layui-icon-refresh"></i> 設定角色 </button> </script> </form> <script type="text/javascript" src="${pageContext.request.contextPath}/resources/layui/layui.js"> </script> <script > layui.use(['jquery','form','layer','table'],function () { var cxt = '${pageContext.request.contextPath}'; var $ =layui.jquery; var form = layui.form; var layer = layui.layer; var table = layui.table; //渲染資料表格 //表格引數 var tabOps ={ id:"dataTableId", elem:"#dataTable", url:cxt + "/sysuser/page.do", page:true, toolbar: "#headBtns", cols:[[ {type:"checkbox"}, {field:"realname",title:"姓名",align:"center",width: 85}, {field:"loginName",title:"登入名",align:"center",width: 85}, {field:"phone",title:"電話",align:"center"}, {field:"idCard",title:"身份證",align:"center",minWidth:"170"}, {field:"sex",title:"性別",align:"center",width:65,templet:function (d) { var sex = d.sex; if (sex == 1){ return "<p style='color: #1385e8'>男</p>"; }else if (sex == 2){ return "<p style='color: #e8139a'>女</p>"; } }}, {field:"address",title:"地址",align:"center",width: 100}, {title:"頭像",width: 65,templet:function (d) { var img = d.img; return "<button class='layui-btn layui-btn-xs' onclick=showUserImg(\'"+img+"\') >檢視</button>" }}, {field:"createTime",title:"建立時間",align:"center"}, {field: "操作",toolbar:"#rowBtns", minWidth: 230, fixed: "right"} ]], parseData:function (rs) { return{ code: rs.code, msg:rs.msg, count:rs.data.total, data:rs.data.list } }, response:{ statusCode:200 } }; //進行渲染 var tabIns = table.render(tabOps); //按鈕查詢 $("#searchBtn").click(function () { var realname = $("#realname").val(); var phone = $("#phone").val(); var address = $("#address").val(); tabIns.reload({ where:{ realname:realname, phone:phone, address:address } }) }) }); </script>
2.修改SysUserController
/**
* 使用者的分頁查詢
*
* @return
*/
@RequestMapping("page.do")
public Object page(SysUserQuery query) {
return this.sysUserService.queryPage(query);
}
3.修改SysUserService
/**
* 使用者的分頁查詢
*
* @param query
* @return
*/
Result queryPage(SysUserQuery query);
4.修改SysUserServiceImpl
/** * 使用者的分頁查詢 * * @param query * @return */ @Override public Result queryPage(SysUserQuery query) { // 開啟分頁查詢 Page<SysUser> sysUserPage = PageHelper.startPage(query.getPage(), query.getLimit()); // 根據引數查詢使用者列表 sysUserMapper.selectList(query); return new Result(sysUserPage.toPageInfo()); }
5.修改SysUserMapper
/**
* 根據引數查詢使用者列表
*
* @param query
* @return
*/
List<SysUser> selectList(SysUserQuery query);
6.修改SysUserMapper.xml
<select id="selectList" resultMap="BaseResultMap">
select
<include refid="Base_Column_List"/>
from sys_user
<where>
<if test="realname != null and realname != ''">
and realname like concat('%',#{realname},'%')
</if>
<if test="phone != null and phone != ''">
and phone =#{phone}
</if>
<if test="address != null and address != ''">
and address like concat('%',#{address},'%')
</if>
</where>
</select>
2.新增使用者
1.修改 user/list.jsp
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ page contentType="text/html;charset=UTF-8" pageEncoding="UTF-8" isELIgnored="false" language="java" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>使用者管理</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="format-detection" content="telephone=no">
<link rel="stylesheet" href="${pageContext.request.contextPath}/resources/layui/css/layui.css" media="all"/>
<link rel="stylesheet" href="${pageContext.request.contextPath}/resources/css/public.css" media="all"/>
</head>
<body class="childrenBody">
<form class="layui-form">
<blockquote class="layui-elem-quote quoteBox">
<form class="layui-form layui-form-pane">
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">姓名</label>
<div class="layui-input-inline">
<input type="text" class="layui-input" placeholder="姓名" id="realname">
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">手機號</label>
<div class="layui-input-inline">
<input type="text" class="layui-input" placeholder="手機號" id="phone">
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">地址</label>
<div class="layui-input-inline">
<input type="text" class="layui-input" placeholder="地址" id="address">
</div>
</div>
<div class="layui-inline">
<button class="layui-btn" id="searchBtn" type="button">搜尋</button>
<button class="layui-btn layui-btn-primary" type="reset">重置</button>
</div>
</div>
</form>
</blockquote>
<table id="dataTable" lay-filter="dataTableFilter"></table>
<%--操作--%>
<script type="text/html" id="headBtns">
<button class="layui-btn layui-btn-sm" lay-event="add">
<i class="layui-icon layui-icon-add-1"></i>
新增
</button>
</script>
<script type="text/html" id="rowBtns">
<button class="layui-btn layui-btn-sm" lay-event="resetPwd">
<i class="layui-icon layui-icon-refresh"></i>
重置密碼
</button>
<button class="layui-btn layui-btn-sm" lay-event="setRoles">
<i class="layui-icon layui-icon-refresh"></i>
設定角色
</button>
</script>
</form>
<%--新增使用者模板--%>
<script type="text/html" id = "addUserTpl">
<form class="layui-form layui-form-pane" style="margin: 10px">
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">姓名</label>
<div class="layui-input-inline">
<input type="text" name="realname" lay-verify="required" lay-reqText="請輸入姓名" placeholder="使用者姓名" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">登入名</label>
<div class="layui-input-inline">
<input type="text" name="loginName" lay-verify="required" lay-reqText="請輸入登入名" placeholder="登入名" autocomplete="off" class="layui-input">
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">手機號</label>
<div class="layui-input-inline">
<input type="text" name="phone" lay-verify="required|phone" lay-reqText="請輸入手機號" placeholder="手機號" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">身份證</label>
<div class="layui-input-inline">
<input type="text" name="idCard" lay-verify="required|idCard" lay-reqText="請輸入手機號" placeholder="手機號" autocomplete="off" class="layui-input">
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">性別</label>
<div class="layui-input-inline">
<input type="radio" name="sex" value="1" title="男" checked>
<input type="radio" name="sex" value="2" title="女">
</div>
</div>
</div>
<div class="layui-form-item layui-form-text">
<label class="layui-form-label">地址</label>
<div class="layui-input-block">
<textarea class="layui-textarea" name="address" placeholder="地址" lay-reqText="請輸入地址" lay-verify="required" ></textarea>
</div>
</div>
<button type="button" style="display: none" id="subBtn" lay-submit lay-filter="subBtnFilter"></button>
</form>
</script>
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/layui/layui.js"> </script>
<script >
layui.use(['jquery','form','layer','table'],function () {
var cxt = '${pageContext.request.contextPath}';
var $ =layui.jquery;
var form = layui.form;
var layer = layui.layer;
var table = layui.table;
//渲染資料表格
//表格引數
var tabOps ={
id:"dataTableId",
elem:"#dataTable",
url:cxt + "/sysuser/page.do",
page:true,
toolbar: "#headBtns",
cols:[[
{type:"checkbox"},
{field:"realname",title:"姓名",align:"center",width: 85},
{field:"loginName",title:"登入名",align:"center",width: 85},
{field:"phone",title:"電話",align:"center"},
{field:"idCard",title:"身份證",align:"center",minWidth:"170"},
{field:"sex",title:"性別",align:"center",width:65,templet:function (d) {
var sex = d.sex;
if (sex == 1){
return "<p style='color: #1385e8'>男</p>";
}else if (sex == 2){
return "<p style='color: #e8139a'>女</p>";
}
}},
{field:"address",title:"地址",align:"center",width: 100},
{title:"頭像",width: 65,templet:function (d) {
var img = d.img;
return "<button class='layui-btn layui-btn-xs'>檢視</button>"
}},
{field:"createTime",title:"建立時間",align:"center"},
{field: "操作",toolbar:"#rowBtns", minWidth: 230, fixed: "right"}
]],
parseData:function (rs) {
return{
code: rs.code,
msg:rs.msg,
count:rs.data.total,
data:rs.data.list
}
},
response:{
statusCode:200
}
};
//進行渲染
var tabIns = table.render(tabOps);
//按鈕查詢
$("#searchBtn").click(function () {
var realname = $("#realname").val();
var phone = $("#phone").val();
var address = $("#address").val();
tabIns.reload({
where:{
realname:realname,
phone:phone,
address:address
}
})
})
//表格頭工具欄監聽事件
table.on("toolbar(dataTableFilter)",function (d) {
var event = d.event;
if (event == "add"){
add();
}
})
//新增使用者的方法
function add() {
//彈出層的引數
var layOps = {
title:"新增使用者",
type:1,
skin: "layui-layer-molv",
content:$("#addUserTpl").html(),
area:['680px','450px'],
success:function (layero,index) {
form.render("radio");
//表單的提交監聽
form.on("submit(subBtnFilter)",function (d) {
var formData = d.field;
//使用ajax提交資料
$.post(cxt+"/sysuser/add.do",formData,function (rs) {
layer.msg(rs.msg); //展示業務訊息
if (rs.code != 200){
return false;
}
layer.close(index); //關閉彈層
//重新整理表格
$("#searchBtn").click();
})
return false;//阻止預設提交行為
})
},
btn:['確認','取消'],
btnAlign: "c",
yes:function (index,layero) {
//點選隱藏的提交按鈕 觸發 表單提交監聽
$("#subBtn").click();
}
};
layer.open(layOps);
}
});
</script>
</body>
</html>
2.修改SysUserController
/**
* 使用者的分頁查詢
*
* @return
*/
@RequestMapping("page.do")
public Object page(SysUserQuery query) {
return this.sysUserService.queryPage(query);
}
/**
* 新增使用者
*
* @param sysUser
* @return
*/
@RequestMapping("add.do")
public Object add(SysUser sysUser) {
// 進行資料格式校驗
ValidatorUtil.validator(sysUser);
return sysUserService.add(sysUser);
}
3.修改SysUser
package com.toddding.domain;
import com.fasterxml.jackson.annotation.JsonFormat;
import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
import org.hibernate.validator.constraints.Length;
import org.hibernate.validator.constraints.Range;
import javax.validation.constraints.NotEmpty;
import javax.validation.constraints.NotNull;
import java.util.Date;
/**
* @Description: 使用者實體類
* @author: Todd Ding
* @date 2020-11-30 14:50
*/
@Data
@AllArgsConstructor
@NoArgsConstructor
public class SysUser {
/**
* 使用者ID
*/
private Integer id;
/**
* 登入名
*/
@NotEmpty(message = "loginName:登入名不能為空")
@Length(min = 6,max = 15,message = "loginName:登入名6~15位字元")
private String loginName;
/**
* 登入密碼
*/
private String loginPassword;
/**
* 手機號
*/
@NotEmpty(message = "phone:手機號不能為空")
@Length(min = 11,max = 11,message = "phone:手機號11位字元")
private String phone;
/**
* 真實姓名
*/
@NotEmpty(message = "realname:姓名不能為空")
@Length(max = 20,message = "realname:姓名最多20位字元")
private String realname;
/**
* 身份證號
*/
@NotEmpty(message = "idCard:身份證號不能為空")
@Length(min=18,max = 18,message = "idCard:身份證號18位字元")
private String idCard;
/**
* 性別 1 男 2 女
*/
@NotNull(message = "sex:性別不能為空")
@Range(min = 1,max = 2,message = "sex:性別只能是男(1)或者女(2)")
private Integer sex;
/**
* 地址
*/
@NotEmpty(message = "address:地址不能為空")
@Length(max = 100,message = "address:地址最多100個字元")
private String address;
/**
* 影象
*/
private String img;
/**
* 建立時間
*/
@JsonFormat(pattern="yyyy-MM-dd")
private Date createTime;
}
4.修改SysUserService
/**
* 使用者的分頁查詢
*
* @param query
* @return
*/
Result queryPage(SysUserQuery query);
/**
* 新增使用者
*
* @param sysUser
* @return
*/
Result add(SysUser sysUser);
5.修改SysUserServiceImpl
/**
* 使用者的分頁查詢
*
* @param query
* @return
*/
@Override
public Result queryPage(SysUserQuery query) {
// 開啟分頁查詢
Page<SysUser> sysUserPage = PageHelper.startPage(query.getPage(), query.getLimit());
// 根據引數查詢使用者列表
sysUserMapper.selectList(query);
return new Result(sysUserPage.toPageInfo());
}
/**
* 新增使用者
*
* @param sysUser
* @return
*/
@Override
public Result add(SysUser sysUser) {
// 進行業務資料校驗
SysUserQuery query = new SysUserQuery();
// 校驗使用者名稱是否重複
query.setLoginName(sysUser.getLoginName());
// 根據登入名查詢使用者
SysUser user = sysUserMapper.selectUserByKeywords(query);
if (user != null) {
return new Result(CodeMsg.USER_LOGIN_NAME_EXIST_ERROR);
}
// 校驗手機號是否重複
query = new SysUserQuery();
query.setPhone(sysUser.getPhone());
// 根據手機號查詢使用者
user = sysUserMapper.selectUserByKeywords(query);
if (user != null) {
return new Result(CodeMsg.USER_PHONE_EXIST_ERROR);
}
// 校驗身份證號是否重複
query = new SysUserQuery();
query.setIdCard(sysUser.getIdCard());
// 根據身份證號查詢使用者
user = sysUserMapper.selectUserByKeywords(query);
if (user != null) {
return new Result(CodeMsg.USER_ID_CARD_EXIST_ERROR);
}
// 新增使用者
// 獲取加密後的預設密碼
Md5Hash md5Hash = new Md5Hash(Constant.DEFAULT_PASSWORD, Constant.MD5_SALT, 2);
sysUser.setLoginPassword(md5Hash.toString());
sysUserMapper.insert(sysUser);
return new Result();
}
6.修改CodeMsg
public enum CodeMsg {
USER_USER_PASSWORD_ERROR(4001001, "使用者名稱或者密碼錯誤!"),
USER_LOGIN_NAME_EXIST_ERROR(4001002, "使用者登入名已被使用!"),
USER_PHONE_EXIST_ERROR(4001003, "使用者手機號已被使用!"),
USER_ID_CARD_EXIST_ERROR(4001004, "使用者身份證號已被使用!"),
USER_NOT_HAVE_PERMISSION_ERROR(4001005, "使用者許可權不足!"),
USER_UPDATE_PASSWORD_ERROR(4001006, "修改失敗,原密碼不正確"),
CUSTOMER_ID_CARD_EXIST_ERROR(4002001, "客戶身份證號已被使用!"),
CUSTOMER_PHONE_EXIST_ERROR(4002002, "客戶手機號已被使用!"),
}
7.修改Constant
public interface Constant {
/**
* MD5加密的鹽
*/
String MD5_SALT = "day day up";
/**
* 預設的登入密碼
*/
String DEFAULT_PASSWORD = "123456";
}
8.修改SysUserMapper
public interface SysUserMapper {
/**
* 校驗使用者關鍵字是否重複
*
* @param query 包含 登入名/手機號/身份證號
* @return
*/
SysUser selectUserByKeywords(SysUserQuery query);
/**
* 新增使用者
*
* @param sysUser
*/
void insert(SysUser sysUser);
}
9.修改SysUserMapper.xml
<select id="selectUserByKeywords" resultMap="BaseResultMap">
select
<include refid="Base_Column_List"/>
from sys_user
<where>
<if test="loginName != null and loginName != ''">
and login_name =#{loginName}
</if>
<if test="phone != null and phone != ''">
and phone =#{phone}
</if>
<if test="idCard != null and idCard != ''">
and id_card =#{idCard}
</if>
</where>
</select>
<insert id="insert">
insert into
sys_user (login_name, login_password, phone, realname, id_card, sex, address)
value
(#{loginName}, #{loginPassword}, #{phone}, #{realname}, #{idCard}, #{sex}, #{address})
</insert>
3.重置密碼
1.修改user/list.jsp
<table id="dataTable" lay-filter="dataTableFilter"></table>
<script type="text/html" id="rowBtns">
<button class="layui-btn layui-btn-sm" lay-event="resetPwd">
<i class="layui-icon layui-icon-refresh"></i>
重置密碼
</button>
<button class="layui-btn layui-btn-sm" lay-event="setRoles">
<i class="layui-icon layui-icon-refresh"></i>
設定角色
</button>
</script>
//表格行工具欄事件
table.on("tool(dataTableFilter)",function (d) {
var event = d.event;
var rowData = d.data;
if (event == "resetPwd"){
resetPwd(rowData);
}
})
//重置密碼方法
function resetPwd(rowData) {
layer.confirm("確定要重置密碼嗎?",function (index) {
$.get(cxt+"/sysuser/reset.do",{id:rowData.id},function (rs) {
//展示業務訊息
layer.msg(rs.msg);
layer.close(index); //關閉彈出層
$("#searchBtn").click(); //過載表格
})
})
}
2.修改SysUserController
/**
* 重置使用者密碼
*
* @param id
* @return
*/
@RequestMapping("reset.do")
public Object reset(Integer id) {
return sysUserService.resetPassword(id);
}
3.修改SysUserService
/**
* 重置使用者密碼
*
* @param id
* @return
*/
Result resetPassword(Integer id);
4.修改SysUserServiceImpl
/**
* 重置使用者密碼
*
* @param id
* @return
*/
@Override
public Result resetPassword(Integer id) {
Md5Hash md5Hash = new Md5Hash(Constant.DEFAULT_PASSWORD, Constant.MD5_SALT, 2);
sysUserMapper.updatePassword(id, md5Hash.toString());
return new Result();
}
5.修改SysUserMapper
/**
* 修改使用者密碼
*
* @param id
* @param password
*/
void updatePassword(@Param("id") Integer id, @Param("password") String password);
6.修改SysUserMapper.xml
<update id="updatePassword">
update sys_user set login_password = #{password} where id = #{id}
</update>
4.顯示使用者頭像
檢視使用者頭像,就是將使用者頭像url地址進行顯示
1.修改user/list.jsp
{title:"頭像",width: 65,templet:function (d) {
var img = d.img;
return "<button class='layui-btn layui-btn-xs' onclick=showUserImg(\'"+img+"\') >檢視</button>"
}}
//顯示頭像的方法
// url : 影象的網路路徑
window.showUserImg = function (url) {
var imgData = {
"title": "使用者頭像", //相簿標題
"start": 0, //初始顯示的圖片序號,預設0
"data": [ //相簿包含的圖片,陣列格式
{
"alt": "使用者頭像",
"src": cxt + "/" + url, //原圖地址
"thumb": cxt + "/" + url //縮圖地址
}
]
}
layer.photos({
photos: imgData
});
}
2.車輛模組
1.車輛列表
1.新建car/list.jsp
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ page contentType="text/html;charset=UTF-8" pageEncoding="UTF-8" isELIgnored="false" language="java" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>汽車管理</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="format-detection" content="telephone=no">
<link rel="stylesheet" href="${pageContext.request.contextPath}/resources/layui/css/layui.css" media="all"/>
<link rel="stylesheet" href="${pageContext.request.contextPath}/resources/css/public.css" media="all"/>
</head>
<body class="childrenBody">
<form class="layui-form">
<blockquote class="layui-elem-quote quoteBox">
<form class="layui-form layui-form-pane">
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">車牌號</label>
<div class="layui-input-inline">
<input type="text" class="layui-input" placeholder="車牌號" id="num">
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">顏色</label>
<div class="layui-input-inline" style="width: 150px">
<input type="text" class="layui-input" placeholder="顏色" id="color">
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">車型</label>
<div class="layui-input-inline" style="width: 110px">
<select id="type">
<option value="">型別</option>
<option value="1">轎車</option>
<option value="2">SUV</option>
<option value="3">跑車</option>
</select>
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">出租狀態</label>
<div class="layui-input-inline" style="width: 110px">
<select id="isRent">
<option value="">狀態</option>
<option value="1">未出租</option>
<option value="2">已出租</option>
</select>
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">價格</label>
<div class="layui-input-inline" style="width: 100px;">
<input type="text" class="layui-input" placeholder="¥" id="minPrice" >
</div>
<div class="layui-form-mid">-</div>
<div class="layui-input-inline" style="width: 100px;">
<input type="text" class="layui-input" placeholder="¥" id="maxPrice" >
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">租金</label>
<div class="layui-input-inline" style="width: 100px;">
<input type="text" class="layui-input" placeholder="¥" id="minRentPrice" >
</div>
<div class="layui-form-mid">-</div>
<div class="layui-input-inline" style="width: 100px;">
<input type="text" class="layui-input" placeholder="¥" id="maxRentPrice" >
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">描述</label>
<div class="layui-input-inline">
<input type="text" class="layui-input" placeholder="描述" id="descp">
</div>
</div>
<div class="layui-inline">
<button class="layui-btn" id="searchBtn" type="button">搜尋</button>
<button class="layui-btn layui-btn-primary" type="reset">重置</button>
</div>
</div>
</form>
</blockquote>
<table id="dataTable" lay-filter="dataTableFilter"></table>
<%--操作--%>
<script type="text/html" id="headBtns">
<button class="layui-btn layui-btn-sm" lay-event="add">
<i class="layui-icon layui-icon-add-1"></i>
新增
</button>
<button class="layui-btn layui-btn-sm" lay-event="add">
<i class="layui-icon layui-icon-add-1"></i>
匯出
</button>
</script>
<script type="text/html" id="rowBtns">
<button class="layui-btn layui-btn-sm" lay-event="resetPwd">
<i class="layui-icon layui-icon-release"></i>
出租
</button>
<%-- <button class="layui-btn layui-btn-sm" lay-event="setRoles">
<i class="layui-icon layui-icon-refresh"></i>
刪除
</button>--%>
</script>
</form>
<%--新增使用者模板--%>
<script type="text/html" id = "addUserTpl">
<form class="layui-form layui-form-pane" style="margin: 10px">
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">姓名</label>
<div class="layui-input-inline">
<input type="text" name="realname" lay-verify="required" lay-reqText="請輸入姓名" placeholder="使用者姓名" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">登入名</label>
<div class="layui-input-inline">
<input type="text" name="loginName" lay-verify="required" lay-reqText="請輸入登入名" placeholder="登入名" autocomplete="off" class="layui-input">
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">手機號</label>
<div class="layui-input-inline">
<input type="text" name="phone" lay-verify="required|phone" lay-reqText="請輸入手機號" placeholder="手機號" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">身份證</label>
<div class="layui-input-inline">
<input type="text" name="idCard" lay-verify="required|idCard" lay-reqText="請輸入手機號" placeholder="手機號" autocomplete="off" class="layui-input">
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">性別</label>
<div class="layui-input-inline">
<input type="radio" name="sex" value="1" title="男" checked>
<input type="radio" name="sex" value="2" title="女">
</div>
</div>
</div>
<div class="layui-form-item layui-form-text">
<label class="layui-form-label">地址</label>
<div class="layui-input-block">
<textarea class="layui-textarea" name="address" placeholder="地址" lay-reqText="請輸入地址" lay-verify="required" ></textarea>
</div>
</div>
<button type="button" style="display: none" id="subBtn" lay-submit lay-filter="subBtnFilter"></button>
</form>
</script>
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/layui/layui.js"> </script>
<script >
layui.use(['jquery','form','layer','table','upload'],function () {
var cxt = '${pageContext.request.contextPath}';
var $ =layui.jquery;
var form = layui.form;
var layer = layui.layer;
var table = layui.table;
var upload = layui.upload;
//渲染資料表格
//表格引數
var tabOps ={
id:"dataTableId",
elem:"#dataTable",
url:cxt + "/car/page.do",
page:true,
toolbar: "#headBtns",
cols:[[
{type:"checkbox"},
{field:"num",title:"車牌號",align:"center",width: 115},
{field:"type",title:"車型",align:"center",width: 95,templet:function (d) {
var type = d.type;
if (type == 1){
return "<p style='color: #1AA094'>轎車</p>";
}else if (type == 2){
return "<p style='color: #e47214'>SUV</p>";
}else if(type == 3){
return "<p style='color: red'>跑車</p>";
}
}},
{field:"color",title:"顏色",align:"center"},
{field:"price",title:"價格",align:"center",width: 100},
{field:"rentPrice",title:"出租價格",align:"center",width:100},
{field:"deposit",title:"押金",align:"center",width: 100},
{field:"isRent",title:"出租狀態",align:"center",width: 100,templet:function (d) {
var isRent = d.isRent;
if (isRent == 1) {
return "<p style='color: #40AFFE'>未出租</p>";
}else if (isRent == 2){
return "<p style='color: #ff9831'>未出租</p>";
}
}},
{field:"descp",title:"描述",align:"center",width: 110},
{field:"img",title:"車輛圖片",align:"center",width: 90,templet:function (d) {
var img = d.img;
return "<button class='layui-btn layui-btn-xs' onclick=showUserImg(\'"+img+"\') >檢視</button>"
}},
{field:"version",title:"版本",align:"center",width: 80},
{field:"createTime",title:"建立時間",align:"center",width: 160},
{field: "操作",toolbar:"#rowBtns", minWidth: 60, fixed: "right"}
]],
parseData:function (rs) {
return{
code: rs.code,
msg:rs.msg,
count:rs.data.total,
data:rs.data.list
}
},
response:{
statusCode:200
}
};
//進行渲染
var tabIns = table.render(tabOps);
//按鈕查詢
$("#searchBtn").click(function () {
var num = $("#num").val();
var type = $("#type").val();
var color = $("#color").val();
var minPrice = $("#minPrice").val();
var maxPrice = $("#maxPrice").val();
var minRentPrice = $("#minRentPrice").val();
var maxRentPrice = $("#maxRentPrice").val();
var isRent = $("#isRent").val();
var descp = $("#descp").val();
tabIns.reload({
where:{
num:num,
type:type,
color:color,
minPrice:minPrice,
maxPrice:maxPrice,
minRentPrice:minRentPrice,
maxRentPrice:maxRentPrice,
isRent:isRent,
descp:descp,
}
})
})
//表格頭工具欄監聽事件
table.on("toolbar(dataTableFilter)",function (d) {
var event = d.event;
if (event == "add"){
add();
}
})
//新增使用者的方法
function add() {
//彈出層的引數
var layOps = {
title:"新增使用者",
type:1,
skin: "layui-layer-molv",
content:$("#addUserTpl").html(),
area:['680px','450px'],
success:function (layero,index) {
form.render("radio");
//表單的提交監聽
form.on("submit(subBtnFilter)",function (d) {
var formData = d.field;
//使用ajax提交資料
$.post(cxt+"/sysuser/add.do",formData,function (rs) {
layer.msg(rs.msg); //展示業務訊息
if (rs.code != 200){
return false;
}
layer.close(index); //關閉彈層
//重新整理表格
$("#searchBtn").click();
})
return false;//阻止預設提交行為
})
},
btn:['確認','取消'],
btnAlign: "c",
yes:function (index,layero) {
//點選隱藏的提交按鈕 觸發 表單提交監聽
$("#subBtn").click();
}
};
layer.open(layOps);
}
//表格行工具欄事件
table.on("tool(dataTableFilter)",function (d) {
var event = d.event;
var rowData = d.data;
if (event == "resetPwd"){
resetPwd(rowData);
}
})
//重置密碼方法
function resetPwd(rowData) {
layer.confirm("確定要重置密碼嗎?",function (index) {
$.get(cxt+"/sysuser/reset.do",{id:rowData.id},function (rs) {
//展示業務訊息
layer.msg(rs.msg);
layer.close(index); //關閉彈出層
$("#searchBtn").click(); //過載表格
})
})
}
//顯示頭像的方法
// url : 影象的網路路徑
window.showUserImg = function (url) {
var imgData = {
"title": "使用者頭像", //相簿標題
"start": 0, //初始顯示的圖片序號,預設0
"data": [ //相簿包含的圖片,陣列格式
{
"alt": "使用者頭像",
"src": cxt + "/" + url, //原圖地址
"thumb": cxt + "/" + url //縮圖地址
}
]
}
layer.photos({
photos: imgData
});
}
});
</script>
</body>
</html>
2.修改PageController
/**
* 跳轉車輛列表
*
* @return
*/
@RequestMapping("car/list.do")
public String carList() {
return "car/list.jsp";
}
3.新建BusCar
package com.toddding.domain;
import com.fasterxml.jackson.annotation.JsonFormat;
import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
import org.hibernate.validator.constraints.Length;
import org.hibernate.validator.constraints.Range;
import javax.validation.constraints.NotEmpty;
import javax.validation.constraints.NotNull;
import java.util.Date;
/**
* @Description: 車輛實體類
* @Author: Todd Ding
* @Date 2020-12-02 19:21
*/
@Data
@AllArgsConstructor
@NoArgsConstructor
public class BusCar {
/**
* 汽車ID
*/
private Integer id;
/**
* 車牌號
*/
@NotEmpty(message = "車牌號不能為空")
@Length(min = 7, max = 8, message = "車牌號7-8位")
private String num;
/**
* 型別 1 轎車 2 SUV 3 跑車
*/
@NotNull(message = "車型不能為空")
@Range(min = 1, max = 3, message = "車輛型別只能1-3")
private Integer type;
/**
* 顏色
*/
@NotEmpty(message = "汽車顏色不能為空")
@Length(max = 10, message = "汽車顏色最多10位字元")
private String color;
/**
* 價格
*/
@NotNull(message = "汽車金額不能為空")
@Range(min = 1, max = 999999999, message = "汽車金額1-999999999")
private Integer price;
/**
* 出租金額
*/
@NotNull(message = "汽車租金不能為空")
@Range(min = 1, max = 999999999, message = "汽車租金1-999999999")
private Integer rentPrice;
/**
* 押金
*/
@NotNull(message = "汽車押金不能為空")
@Range(min = 1, max = 999999999, message = "汽車押金1-999999999")
private Integer deposit;
/**
* 出租狀態 1 未出租 2 已出租
*/
private Integer isRent;
/**
* 描述
*/
@Length(max = 100, message = "汽車描述最多100個字元")
private String descp;
/**
* 汽車圖片
*/
@NotEmpty(message = "汽車圖片不能為空")
@Length(max = 100, message = "汽車圖片地址最多100位字元")
private String img;
/**
* 版本號
*/
private Integer version;
/**
* 建立時間
*/
@JsonFormat(pattern = "yyyy-MM-dd HH:mm", timezone = "GMT+8")
private Date createTime;
}
4.新建BusCarQuery
package com.toddding.query;
import lombok.Data;
/**
* @Description: 車輛列表的查詢引數封裝類
* @Author: Todd Ding
* @Date 2020-12-02 19:54
*/
@Data
public class BusCarQuery extends Query {
/**
* 車牌號
*/
private String num;
/**
* 車型
*/
private Integer type;
/**
* 顏色
*/
private String color;
/**
* 最低價格
*/
private Integer minPrice;
/**
* 最高價格
*/
private Integer maxPrice;
/**
* 最低租金
*/
private Integer minRentPrice;
/**
* 最高租金
*/
private Integer maxRentPrice;
/**
* 出租狀態
*/
private Integer isRent;
/**
* 描述
*/
private String descp;
}
5.新建BusCarController
package com.toddding.controller;
import com.toddding.query.BusCarQuery;
import com.toddding.service.BusCarService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
@RequestMapping("car")
@RestController
public class BusCarController {
@Autowired
BusCarService busCarService;
//分頁查詢資料
@RequestMapping("page.do")
public Object page(BusCarQuery query){
return busCarService.queryPage(query);
}
}
6.新建BusCarService
package com.toddding.service;
import com.toddding.common.Result;
import com.toddding.query.BusCarQuery;
public interface BusCarService {
Result queryPage(BusCarQuery query);
}
7.新建BusCarServiceImpl
@Service
public class BusCarServiceImpl implements BusCarService {
@Autowired
private BusCarMapper busCarMapper;
@Override
public Result queryPage(BusCarQuery query) {
Page<BusCar> busCarVoPage = PageHelper.startPage(query.getPage(), query.getLimit());
busCarMapper.selectList(query);
return new Result(busCarVoPage.toPageInfo());
}
8.新建BusCarMapper
public interface BusCarMapper {
/**
* 根據條件查詢車輛列表
*
* @param query
* @return
*/
List<BusCar> selectList(BusCarQuery query);
}
9.新建BusCarMapper.xml
<select id="selectList" resultMap="BaseResultMap">
<!-- @mbg.generated -->
select
<include refid="Base_Column_List" />
from bus_car
<where>
<if test="num != null and num != ''">
and num like concat('%',#{num},'%')
</if>
<if test="type != null and type != ''">
and type = #{type}
</if>
<if test="color != null and color != ''">
and color like concat('%',#{color},'%')
</if>
<if test="minPrice != null and minPrice != ''">
and price >= #{minPrice}
</if>
<if test="maxPrice != null and maxPrice != ''">
and #{maxPrice} >= price
</if>
<if test="minRentPrice != null and minRentPrice != ''">
and rent_price >= #{minRentPrice}
</if>
<if test="maxRentPrice != null and maxRentPrice != ''">
and #{maxRentPrice} >= rent_price
</if>
<if test="descp != null and descp != ''">
and descp like concat('%',#{descp},'%')
</if>
<if test="isRent != null and isRent != ''">
and is_rent = #{isRent}
</if>
</where>
</select>
2.新增車輛
1.修改car/list.jsp
<form class="layui-form">
<table id="dataTable" lay-filter="dataTableFilter"></table>
<%--操作--%>
<script type="text/html" id="headBtns">
<button class="layui-btn layui-btn-sm" lay-event="add">
<i class="layui-icon layui-icon-add-1"></i>
新增
</button>
</script>
<script type="text/html" id="rowBtns">
<button class="layui-btn layui-btn-sm" lay-event="resetPwd">
<i class="layui-icon layui-icon-release"></i>
出租
</button>
<%-- <button class="layui-btn layui-btn-sm" lay-event="setRoles">
<i class="layui-icon layui-icon-refresh"></i>
刪除
</button>--%>
</script>
</form>
<%-- 新增車輛 --%>
<script type="text/html" id="addTpl">
<form class="layui-form layui-form-pane" style="padding: 10px">
<div class="layui-form-item">
<div class="layui-inline">
<div class="layui-form-item">
<label class="layui-form-label">車牌號</label>
<div class="layui-input-inline">
<input type="text" class="layui-input" name="num" lay-verify="required" lay-reqText="請輸入車牌號" placeholder="車牌號">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">車型</label>
<div class="layui-input-inline">
<select name="type" lay-verify="required" lay-reqText="請選擇車型">
<option value="">車型</option>
<option value="1">轎車</option>
<option value="2">SUV</option>
<option value="3">跑車</option>
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">顏色</label>
<div class="layui-input-inline">
<input type="text" class="layui-input" name="color" lay-verify="required" lay-reqText="請輸入顏色" placeholder="顏色">
</div>
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">圖片</label>
<div class="layui-input-inline">
<img id="uploadImg" src="${pageContext.request.contextPath}/resources/images/upload.jpg" style="height: 160px;width:160px;" title="選擇圖片"/>
<%-- 隱藏的input 用於接收上傳的檔案的URL地址 --%>
<input id="img" name="img" type="hidden" lay-verify="required" lay-reqText="請上傳車輛圖片"/>
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">價格</label>
<div class="layui-input-inline">
<input type="text" class="layui-input" name="price" lay-verify="required|number" lay-reqText="請輸入價格" placeholder="價格">
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">租金</label>
<div class="layui-input-inline">
<input type="text" class="layui-input" name="rentPrice" lay-verify="required|number" lay-reqText="請輸入租金" placeholder="租金">
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">押金</label>
<div class="layui-input-inline">
<input type="text" class="layui-input" name="deposit" lay-verify="required|number" lay-reqText="請輸入押金" placeholder="押金">
</div>
</div>
</div>
<div class="layui-form-item layui-form-text">
<label class="layui-form-label">描述</label>
<div class="layui-input-block">
<textarea name="descp" class="layui-textarea"></textarea>
</div>
</div>
<button type="button" style="display: none" id="subBtn" lay-submit lay-filter="subBtnFilter"></button>
</form>
</script>
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/layui/layui.js"> </script>
<script >
layui.use(['jquery','form','layer','table','upload'],function () {
var cxt = '${pageContext.request.contextPath}';
var $ =layui.jquery;
var form = layui.form;
var layer = layui.layer;
var table = layui.table;
var upload = layui.upload;
//渲染資料表格
//表格引數
var tabOps ={
id:"dataTableId",
elem:"#dataTable",
url:cxt + "/car/page.do",
page:true,
toolbar: "#headBtns",
cols:[[
{type:"checkbox"},
{field:"num",title:"車牌號",align:"center",width: 115},
{field:"type",title:"車型",align:"center",width: 95,templet:function (d) {
var type = d.type;
if (type == 1){
return "<p style='color: #1AA094'>轎車</p>";
}else if (type == 2){
return "<p style='color: #e47214'>SUV</p>";
}else if(type == 3){
return "<p style='color: red'>跑車</p>";
}
}},
{field:"color",title:"顏色",align:"center"},
{field:"price",title:"價格",align:"center",width: 100},
{field:"rentPrice",title:"出租價格",align:"center",width:100},
{field:"deposit",title:"押金",align:"center",width: 100},
{field:"isRent",title:"出租狀態",align:"center",width: 100,templet:function (d) {
var isRent = d.isRent;
if (isRent == 1) {
return "<p style='color: #40AFFE'>未出租</p>";
}else if (isRent == 2){
return "<p style='color: #ff9831'>未出租</p>";
}
}},
{field:"descp",title:"描述",align:"center",width: 110},
{title:"車輛圖片",align:"center",width: 90,templet:function (d) {
var img = d.img;
return "<button class='layui-btn layui-btn-xs' onclick=showUserImg(\'"+img+"\') >檢視</button>"
}},
{field:"version",title:"版本",align:"center",width: 80},
{field:"createTime",title:"建立時間",align:"center",width: 160},
{field: "操作",toolbar:"#rowBtns", minWidth: 60, fixed: "right"}
]],
parseData:function (rs) {
return{
code: rs.code,
msg:rs.msg,
count:rs.data.total,
data:rs.data.list
}
},
response:{
statusCode:200
}
};
//進行渲染
var tabIns = table.render(tabOps);
//按鈕查詢
$("#searchBtn").click(function () {
var num = $("#num").val();
var type = $("#type").val();
var color = $("#color").val();
var minPrice = $("#minPrice").val();
var maxPrice = $("#maxPrice").val();
var minRentPrice = $("#minRentPrice").val();
var maxRentPrice = $("#maxRentPrice").val();
var isRent = $("#isRent").val();
var descp = $("#descp").val();
tabIns.reload({
where:{
num:num,
type:type,
color:color,
minPrice:minPrice,
maxPrice:maxPrice,
minRentPrice:minRentPrice,
maxRentPrice:maxRentPrice,
isRent:isRent,
descp:descp,
}
})
})
//表格頭工具欄監聽事件
table.on("toolbar(dataTableFilter)",function (d) {
var event = d.event;
if (event == "add"){
add();
}
})
//新增使用者的方法
function add() {
//彈出層的引數
var layOps = {
title:"新增車輛",
type:1,
skin: "layui-layer-molv",
content:$("#addTpl").html(),
area:['710px','580px'],
success:function (layero,index) {
form.render();
/* 初始化上傳元件 */
//初始化檔案上傳
let uploadOpt = {
elem: "#uploadImg",
url: cxt + "/file/uploadImage.do",//處理檔案上傳的介面
auto: true,//自動上傳
field: "image",//指定檔案上傳的資料域名稱
choose: function (obj) {
//檔案預覽
obj.preview(function (index, file, result) {
//修改圖片src屬性值 實現預覽
$("#uploadImg").attr("src", result);
})
},
done: function (rs, fileIndex, upload) {
//將業務訊息展示
layer.msg(rs.msg);
if (rs.code == 200) {
//給隱藏框賦值
$("#img").val(rs.data);
}
}
};
upload.render(uploadOpt);
//表單的提交監聽
form.on("submit(subBtnFilter)",function (d) {
var formData = d.field;
//使用ajax提交資料
$.post(cxt+"/car/add.do",formData,function (rs) {
layer.msg(rs.msg); //展示業務訊息
if (rs.code != 200){
return false;
}
layer.close(index); //關閉彈層
//重新整理表格
$("#searchBtn").click();
})
return false;//阻止預設提交行為
})
},
btn:['確認','取消'],
btnAlign: "c",
yes:function (index,layero) {
//點選隱藏的提交按鈕 觸發 表單提交監聽
$("#subBtn").click();
}
};
layer.open(layOps);
}
//顯示頭像的方法
// url : 影象的網路路徑
window.showUserImg = function (url) {
var imgData = {
"title": "使用者頭像", //相簿標題
"start": 0, //初始顯示的圖片序號,預設0
"data": [ //相簿包含的圖片,陣列格式
{
"alt": "使用者頭像",
"src": cxt + "/" + url, //原圖地址
"thumb": cxt + "/" + url //縮圖地址
}
]
}
layer.photos({
photos: imgData
});
}
});
</script>
</body>
</html>
2.新建FileUploadController
package com.toddding.controller;
import cn.hutool.core.date.DateUtil;
import cn.hutool.core.io.FileUtil;
import com.toddding.common.CodeMsg;
import com.toddding.common.Constant;
import com.toddding.common.Result;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.multipart.MultipartFile;
import javax.servlet.http.HttpServletRequest;
import java.io.File;
import java.io.IOException;
import java.util.Date;
@RestController
@RequestMapping("file")
public class FileUploadController {
@RequestMapping("uploadImage.do")
public Object uploadImage(@RequestParam("image") MultipartFile image, HttpServletRequest request){
//原圖片名稱
String originalFilename = image.getOriginalFilename();
//獲取圖片的字尾
String extName = FileUtil.extName(originalFilename);
//產生圖片新的名稱
String newFileName = DateUtil.format(new Date(), "yyyyMMddHHmmssSSS");
newFileName = newFileName + "."+extName;
//獲取upload資料夾的物理路徑
String realPath = request.getServletContext().getRealPath(Constant.UPLOAD_FOLDER);
//檔案儲存的物理路徑
String fileRealPath = realPath + File.separator + newFileName;
//檔案還需要URL路徑 upload/xxxxx.jpg
String url = Constant.UPLOAD_FOLDER + "/" + newFileName;
try {
image.transferTo(new File(fileRealPath));
//將圖片的網路路徑返回
return new Result(url);
} catch (IOException e) {
e.printStackTrace();
}
return new Result(CodeMsg.CAR_UPLOAD_IMG_ERROR);
}
}
3.修改springmvc.xml
<!-- 檔案上傳解析 -->
<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver"></bean>
4.修改BusCarController
//新增車輛資料
@RequestMapping("add.do")
public Object add(BusCar busCar) {
//進行資料格式的效驗
ValidatorUtil.validator(busCar);
return busCarService.add(busCar);
}
5.新建BusCar
package com.toddding.domain;
import com.fasterxml.jackson.annotation.JsonFormat;
import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
import org.hibernate.validator.constraints.Length;
import org.hibernate.validator.constraints.Range;
import javax.validation.constraints.NotEmpty;
import javax.validation.constraints.NotNull;
import java.util.Date;
/**
* @Description: 車輛實體類
* @Author: Todd Ding
* @Date 2020-12-02 19:21
*/
@Data
@AllArgsConstructor
@NoArgsConstructor
public class BusCar {
/**
* 汽車ID
*/
private Integer id;
/**
* 車牌號
*/
@NotEmpty(message = "車牌號不能為空")
@Length(min = 7, max = 8, message = "車牌號7-8位")
private String num;
/**
* 型別 1 轎車 2 SUV 3 跑車
*/
@NotNull(message = "車型不能為空")
@Range(min = 1, max = 3, message = "車輛型別只能1-3")
private Integer type;
/**
* 顏色
*/
@NotEmpty(message = "汽車顏色不能為空")
@Length(max = 10, message = "汽車顏色最多10位字元")
private String color;
/**
* 價格
*/
@NotNull(message = "汽車金額不能為空")
@Range(min = 1, max = 999999999, message = "汽車金額1-999999999")
private Integer price;
/**
* 出租金額
*/
@NotNull(message = "汽車租金不能為空")
@Range(min = 1, max = 999999999, message = "汽車租金1-999999999")
private Integer rentPrice;
/**
* 押金
*/
@NotNull(message = "汽車押金不能為空")
@Range(min = 1, max = 999999999, message = "汽車押金1-999999999")
private Integer deposit;
/**
* 出租狀態 1 未出租 2 已出租
*/
private Integer isRent;
/**
* 描述
*/
@Length(max = 100, message = "汽車描述最多100個字元")
private String descp;
/**
* 汽車圖片
*/
@NotEmpty(message = "汽車圖片不能為空")
@Length(max = 100, message = "汽車圖片地址最多100位字元")
private String img;
/**
* 版本號
*/
private Integer version;
/**
* 建立時間
*/
@JsonFormat(pattern = "yyyy-MM-dd HH:mm", timezone = "GMT+8")
private Date createTime;
}
5.修改BusCarService
Result add(BusCar busCar);
6.修改BusCarServiceImpl
@Override
public Result add(BusCar busCar) {
//進行業務資料效驗
//車牌號不能重複
BusCar busCar1 = busCarMapper.selectOneByNum(busCar.getNum());
if (busCar1 != null){
return new Result(CodeMsg.CAR_NUM_EXIST_ERROR);
}
busCarMapper.insert(busCar);
return new Result();
}
7.修改CodeMsg
CAR_UPLOAD_IMG_ERROR(4003001, "汽車圖片上傳失敗!"),
CAR_NUM_EXIST_ERROR(4003002, "汽車車牌號已被使用!"),
8.修改Constant
/**
* 儲存上傳檔案的資料夾
*/
String UPLOAD_FOLDER = "upload";
9.修改BusCarMapper
/**
* 根據車牌號查詢車輛資訊
*
* @param num
* @return
*/
BusCar selectOneByNum(@Param("num") String num);
/**
* 新增車輛資訊
*
* @param busCar
*/
void insert(BusCar busCar);
10.修改BusCarMapper.xml
<select id="selectOneByNum" resultMap="BaseResultMap">
select
<include refid="Base_Column_List" />
from
bus_car
where num = #{num}
</select>
<insert id="insert">
insert into bus_car
(num, `type`, color, price, rent_price, deposit, descp, img)
value
(#{num}, #{type}, #{color}, #{price}, #{rentPrice}, #{deposit}, #{descp}, #{img})
</insert>
3.車輛出租
1.修改/car/list.jsp
<script type="text/html" id="rowBtns">
<button class="layui-btn layui-btn-sm" lay-event="rent">
<i class="layui-icon layui-icon-release"></i>
出租
</button>
</script>
<%-- 計程車輛 --%>
<script type="text/html" id="rentTpl" >
<form class="layui-form layui-form-pane" style="padding: 10px" lay-filter="rentFormFilter" >
<div class="layui-form-item">
<div class="layui-inline">
<div class="layui-form-item">
<label class="layui-form-label">車牌號</label>
<div class="layui-input-inline">
<%--設定為 readonly 就不能改裡面的資訊了 --%>
<input type="text" readonly class="layui-input" name="num" lay-verify="required" lay-reqText="請輸入車牌號" placeholder="車牌號">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">車型</label>
<div class="layui-input-inline">
<select name="type" readonly disabled lay-verify="required" lay-reqText="請選擇車型">
<option value="">車型</option>
<option value="1">轎車</option>
<option value="2">SUV</option>
<option value="3">跑車</option>
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">顏色</label>
<div class="layui-input-inline">
<input type="text" readonly class="layui-input" name="color" lay-verify="required" lay-reqText="請輸入顏色" placeholder="顏色">
</div>
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">圖片</label>
<div class="layui-input-inline">
<img id="carImg" src="${pageContext.request.contextPath}/resources/images/upload.jpg" style="height: 160px;width:160px;" />
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">價格</label>
<div class="layui-input-inline">
<input type="text" readonly class="layui-input" name="price" lay-verify="required|number" lay-reqText="請輸入價格" placeholder="價格">
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">租金</label>
<div class="layui-input-inline">
<input type="text" readonly class="layui-input" name="rentPrice" lay-verify="required|number" lay-reqText="請輸入租金" placeholder="租金">
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">押金</label>
<div class="layui-input-inline">
<input type="text" class="layui-input" readonly name="deposit" lay-verify="required|number" lay-reqText="請輸入押金" placeholder="押金">
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">身份證</label>
<div class="layui-input-inline">
<input type="text" class="layui-input" name="idCard" lay-verify="required|idCard" lay-reqText="請輸入客戶身份證" placeholder="客戶身份證">
</div>
</div>
</div>
<div class="layui-form-item ">
<label class="layui-form-label">出租時間</label>
<div class="layui-input-block" style=" width: 514px">
<input type="text" readonly name="rentTime" id="rentTime" class="layui-input" />
</div>
</div>
<button type="button" style="display: none" id="subBtn" lay-submit lay-filter="subBtnFilter"></button>
</form>
</script>
<script >
layui.use(['jquery','form','layer','table','upload','laydate'],function () {
var cxt = '${pageContext.request.contextPath}';
var $ =layui.jquery;
var form = layui.form;
var layer = layui.layer;
var table = layui.table;
var upload = layui.upload;
var laydate = layui.laydate;
//表格行工具欄事件
table.on("tool(dataTableFilter)",function (d) {
var event = d.event;
var rowData = d.data;
if (event == "rent"){
rent(rowData); //具體出租方法
}
})
//出租方法
function rent(rowData){
//彈出層的引數
var layOps = {
title:"計程車輛",
type:1,
skin: "layui-layer-molv",
content:$("#rentTpl").html(),
area:['710px','580px'],
success:function (layero,index) {
//為表單賦值
form.val("rentFormFilter",rowData)
//為圖片設定資料
$("#carImg").attr("src",cxt + "/"+rowData.img);
//渲染時間元件
laydate.render({
elem:"#rentTime",
range:"~"
});
//表單的提交監聽
form.on("submit(subBtnFilter)",function (d) {
var formData = d.field;
//使用ajax提交資料
$.post(cxt+"/rent/add.do",formData,function (rs) {
layer.msg(rs.msg); //展示業務訊息
if (rs.code != 200){
return false;
}
layer.close(index); //關閉彈層
//重新整理表格
$("#searchBtn").click();
})
return false;//阻止預設提交行為
})
},
btn:['確認','取消'],
btnAlign: "c",
yes:function (index,layero) {
//點選隱藏的提交按鈕 觸發 表單提交監聽
$("#subBtn").click();
}
};
layer.open(layOps);
}
</script>
2.新建BusRentController
package com.toddding.controller;
import com.toddding.common.validator.ValidatorUtil;
import com.toddding.domain.BusRent;
import com.toddding.service.BusRentService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
@RestController
@RequestMapping("rent")
public class BusRentController {
@Autowired
private BusRentService busRentService;
//新增車輛出租記錄
@RequestMapping("add.do")
public Object add(BusRent busRent){
//資料效驗
ValidatorUtil.validator(busRent);
return busRentService.add(busRent);
}
}
3.新建BusRentService
package com.toddding.service;
import com.toddding.common.Result;
import com.toddding.domain.BusRent;
public interface BusRentService {
//新增出租記錄
Result add(BusRent busRent);
}
4.新建BusRentServiceImpl
package com.toddding.service.impl;
@Service
public class BusRentServiceImpl implements BusRentService {
@Autowired
private BusRentMapper busRentMapper;
@Autowired
private BusCustomerMapper busCustomerMapper;
@Autowired
private BusCarMapper busCarMapper;
@Override
@Transactional(rollbackFor = Exception.class)
public Result add(BusRent busRent) {
//業務資料效驗
//校驗客戶是否存在
//根據身份證號, 查詢客戶 效驗客戶是否存在
BusCustomerQuery query = new BusCustomerQuery();
query.setIdCard(busRent.getIdCard());
BusCustomer busCustomer = busCustomerMapper.selectCustomerByKeywords(query);
if (busCustomer == null){
return new Result(CodeMsg.RENT_CUSTOMER_ID_CARD_ERROR);
}
//效驗車輛資訊
//根據車牌號查詢車輛資訊
BusCar busCar = busCarMapper.selectOneByNum(busRent.getNum());
//獲取出租狀態 判斷出租狀態是否是 未出租
if (busCar.getIsRent().equals(Constant.CAR_RENT_ED)){
return new Result(CodeMsg.RENT_CAR_RENTED_ERROR);
}
//樂觀鎖處理併發問題
//修改車輛狀態
Integer rows = busCarMapper.updateRentState(busCar.getId(), Constant.CAR_RENT_ED, busCar.getVersion());
if (rows != 1){
throw new BussiException(CodeMsg.RENT_FAILED_ERROR.code,CodeMsg.RENT_FAILED_ERROR.msg);
}
String rentTime = busRent.getRentTime();
String[] split = rentTime.split("~");
busRent.setBeginTime(split[0].trim()); //去掉空格
busRent.setEndTime(split[1].trim());
//客戶名稱
busRent.setName(busCustomer.getName());
//設定業務員ID
Subject subject = SecurityUtils.getSubject();
ActiveUser activeUser = (ActiveUser) subject.getPrincipal();
busRent.setUserId(activeUser.getSysUser().getId());
//新增出租記錄
busRentMapper.insert(busRent);
return new Result();
}
}
5.修改CodeMsg
RENT_CAR_RENTED_ERROR(4004002, "車輛已經出租!"),
RENT_FAILED_ERROR(4004003, "車輛出租失敗,車輛資訊發生了變化!"),
6.修改Constant
/**
* 未出租
*/
Integer CAR_RENT_NOT = 1;
/**
* 已經出租
*/
Integer CAR_RENT_ED = 2;
7.新建BusRent
package com.toddding.domain;
import com.fasterxml.jackson.annotation.JsonFormat;
import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
import org.hibernate.validator.constraints.Length;
import org.hibernate.validator.constraints.Range;
import javax.validation.constraints.NotEmpty;
import javax.validation.constraints.NotNull;
import java.util.Date;
/**
* @Description: 車輛出租記錄實體類
* @Author: Todd Ding
* @Date 2020-12-03 10:59
*/
@Data
@AllArgsConstructor
@NoArgsConstructor
public class BusRent {
/**
* 出租記錄ID
*/
private Integer id;
/**
* 車牌號
*/
@NotEmpty(message = "車牌號不能為空")
@Length(max = 8,message = "車牌號最多8位")
private String num;
/**
* 車型 1 轎車 2 SUV 3跑車
*/
@NotNull(message = "車型不能為空")
@Range(min = 1,max = 3,message = "車型的值1~3")
private Integer type;
/**
* 租金
*/
@NotNull(message = "租金不能為空")
@Range(min = 1,max = 999999999,message = "租金範圍:1~999999999")
private Integer rentPrice;
/**
* 押金
*/
@NotNull(message = "押金不能為空")
@Range(min = 1,max = 999999999,message = "押金範圍:1~999999999")
private Integer deposit;
/**
* 客戶名稱
*/
private String name;
/**
* 客戶身份證號
*/
@NotEmpty(message = "身份證號不能為空")
@Length(min = 18,max = 18,message = "身份證號18位")
private String idCard;
@NotEmpty(message = "出租時間不能為空")
private String rentTime;
/**
* 計劃租車開始時間
*/
private String beginTime;
/**
* 計劃租車的結束時間
*/
private String endTime;
/**
* 狀態 1 未還車 2 已還車
*/
private Integer flag;
/**
* 業務員ID
*/
private Integer userId;
/**
* 建立時間
*/
@JsonFormat(pattern = "yyyy-MM-dd HH:mm",timezone = "GMT+8")
private Date createTime;
/**
* 修改時間
*/
private Date updateTime;
}
8.新建BusRentMapper
/**
* @Description: 車輛出租記錄資料操作介面
* @Author: Todd Ding
* @Date 2020-12-03 11:06
*/
public interface BusRentMapper {
/**
* 新增車輛出租記錄
*
* @param busRent
*/
void insert(BusRent busRent);
}
9.新建BusRentMapper.xml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.toddding.mapper.BusRentMapper">
<resultMap id="BaseResultMap" type="com.toddding.domain.BusRent">
<id column="id" property="id"/>
<result column="num" property="num"/>
<result column="type" property="type"/>
<result column="rent_price" property="rentPrice"/>
<result column="deposit" property="deposit"/>
<result column="name" property="name"/>
<result column="id_card" property="idCard"/>
<result column="begin_time" property="beginTime"/>
<result column="end_time" property="endTime"/>
<result column="flag" property="flag"/>
<result column="user_id" property="userId"/>
<result column="create_time" property="createTime"/>
<result column="update_time" property="updateTime"/>
</resultMap>
<sql id="Base_Column_List">
<!-- @mbg.generated -->
id, num, `type`, rent_price, deposit, `name`, id_card, begin_time, end_time, flag, user_id, create_time, update_time
</sql>
<insert id="insert">
insert into bus_rent
(num, `type`, rent_price, deposit, `name`, id_card, begin_time, end_time, user_id)
value
(#{num}, #{type}, #{rentPrice}, #{deposit}, #{name}, #{idCard}, #{beginTime}, #{endTime}, #{userId})
</insert>
</mapper>
10.修改BusCarMapper
/**
* 修改車輛狀態
*
* @param id
* @param rent
* @param version
* @return
*/
Integer updateRentState(@Param("id") Integer id, @Param("rent") Integer rent, @Param("version") Integer version);
11.修改BusCarMapper.xml
<!-- 修改車輛狀態 -->
<update id="updateRentState">
update bus_car set is_rent = #{rent} ,version = version + 1 where id = #{id} and version = #{version}
</update>
4.車輛出租列表
1.新建 /rent/list.jsp
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ page contentType="text/html;charset=UTF-8" pageEncoding="UTF-8" isELIgnored="false" language="java" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>出租列表</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="format-detection" content="telephone=no">
<link rel="stylesheet" href="${pageContext.request.contextPath}/resources/layui/css/layui.css" media="all"/>
<link rel="stylesheet" href="${pageContext.request.contextPath}/resources/css/public.css" media="all"/>
</head>
<body class="childrenBody">
<form class="layui-form">
<blockquote class="layui-elem-quote quoteBox">
<form class="layui-form layui-form-pane">
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">車牌號</label>
<div class="layui-input-inline" style="width: 120px">
<input type="text" class="layui-input" placeholder="車牌號" id="num">
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">客戶名稱</label>
<div class="layui-input-inline" style="width: 120px">
<input type="text" class="layui-input" placeholder="客戶名稱" id="name">
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">出租狀態</label>
<div class="layui-input-inline" style="width: 120px">
<select id="flag">
<option value="">狀態</option>
<option value="1">未還車</option>
<option value="2">已還車</option>
</select>
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">出租時間</label>
<div class="layui-input-inline">
<input readonly class="layui-input" id="beginTime" placeholder="出租時間"/>
</div>
</div>
<div class="layui-inline">
<button class="layui-btn" id="searchBtn" type="button">搜尋</button>
<button class="layui-btn layui-btn-primary" type="reset">重置</button>
</div>
</div>
</form>
</blockquote>
<table id="dataTable" lay-filter="dataTableFilter"></table>
<%--操作--%>
<script type="text/html" id="rowBtns">
<button class="layui-btn layui-btn-sm" lay-event="returnCar">
<i class="layui-icon layui-icon-ok"></i>
還車
</button>
</script>
</form>
<%--新增使用者模板--%>
<script type="text/html" id = "addUserTpl">
<form class="layui-form layui-form-pane" style="margin: 10px">
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">姓名</label>
<div class="layui-input-inline">
<input type="text" name="realname" lay-verify="required" lay-reqText="請輸入姓名" placeholder="使用者姓名" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">登入名</label>
<div class="layui-input-inline">
<input type="text" name="loginName" lay-verify="required" lay-reqText="請輸入登入名" placeholder="登入名" autocomplete="off" class="layui-input">
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">手機號</label>
<div class="layui-input-inline">
<input type="text" name="phone" lay-verify="required|phone" lay-reqText="請輸入手機號" placeholder="手機號" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">身份證</label>
<div class="layui-input-inline">
<input type="text" name="idCard" lay-verify="required|idCard" lay-reqText="請輸入手機號" placeholder="手機號" autocomplete="off" class="layui-input">
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">性別</label>
<div class="layui-input-inline">
<input type="radio" name="sex" value="1" title="男" checked>
<input type="radio" name="sex" value="2" title="女">
</div>
</div>
</div>
<div class="layui-form-item layui-form-text">
<label class="layui-form-label">地址</label>
<div class="layui-input-block">
<textarea class="layui-textarea" name="address" placeholder="地址" lay-reqText="請輸入地址" lay-verify="required" ></textarea>
</div>
</div>
<button type="button" style="display: none" id="subBtn" lay-submit lay-filter="subBtnFilter"></button>
</form>
</script>
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/layui/layui.js"> </script>
<script >
layui.use(['jquery','form','layer','table','laydate'],function () {
var cxt = '${pageContext.request.contextPath}';
var $ =layui.jquery;
var form = layui.form;
var layer = layui.layer;
var table = layui.table;
var laydate = layui.laydate;
//渲染時間控制元件
laydate.render({
elem: "#beginTime",
range:"~"
})
//渲染資料表格
//表格引數
var tabOps ={
id:"dataTableId",
elem:"#dataTable",
url:cxt + "/rent/page.do",
page:true,
toolbar: "#headBtns",
cols:[[
{field: "num", align: "center", title: "車牌號"},
{
field: "type", align: "center", title: "車型", templet: function (d) {
let type = d.type;
if (type == 1) {
return "<p style='color: #00ffb7'>轎車</p>";
} else if (type == 2) {
return "<p style='color: #00e1ff'>SUV</p>";
} else if (type == 3) {
return "<p style='color: #ff8400'>超跑</p>";
}
}
},
{field: "rentPrice", align: "center", title: "租金"},
{field: "deposit", align: "center", title: "押金"},
{field: "name", align: "center", title: "客戶"},
{field: "beginTime", align: "center", title: "開始時間"},
{field: "endTime", align: "center", title: "結束時間"},
{
field: "flag", align: "center", title: "狀態", width: 80, templet: function (d) {
let flag = d.flag;
if (flag == 1) {
return "<p style='color: #ff5900'>未歸還</p>";
} else if (flag == 2) {
return "<p style='color: #00ffd9'>已歸還</p>";
}
}
},
{field: "createTime", align: "center", title: "建立時間", width: 150},
{title: "操作", align: "center", toolbar: "#rowBtns", fixed: "right"}
]], //列資料
parseData:function (rs) {
return{
code: rs.code,
msg:rs.msg,
count:rs.data.total,
data:rs.data.list
}
},
response:{
statusCode:200
}
};
//進行渲染
var tabIns = table.render(tabOps);
//按鈕查詢
$("#searchBtn").click(function () {
var num = $("#num").val();
var name = $("#name").val();
var flag = $("#flag").val();
var beginTime = $("#beginTime").val();
tabIns.reload({
where:{
"num":num,
"name":name,
"flag":flag,
"beginTime":beginTime
}
})
})
//表格行工具欄事件
table.on("tool(dataTableFilter)",function (d) {
var event = d.event;
var rowData = d.data;
if (event == "returnCar"){
returnCar(rowData);
}
})
//顯示頭像的方法
// url : 影象的網路路徑
window.showUserImg = function (url) {
var imgData = {
"title": "使用者頭像", //相簿標題
"start": 0, //初始顯示的圖片序號,預設0
"data": [ //相簿包含的圖片,陣列格式
{
"alt": "使用者頭像",
"src": cxt + "/" + url, //原圖地址
"thumb": cxt + "/" + url //縮圖地址
}
]
}
layer.photos({
photos: imgData
});
}
});
</script>
</body>
</html>
2..修改navs.json
{
"title": "出租記錄",
"icon": "",
"href": "rent/list.do",
"spread": false,
"target": "_self"
},
3.修改PageController
/**
* 跳轉租車記錄列表
*
* @return
*/
@RequestMapping("rent/list.do")
public String rentList() {
return "rent/list.jsp";
}
4.修改BusRentController
//出租記錄列表的分頁查詢
@RequestMapping("page.do")
public Object page(BusRentQuery query){
return busRentService.queryPage(query);
}
5.修改BusRentService
//查詢出租記錄
Result queryPage(BusRentQuery query);
6.修改BusRentServiceImpl
@Override
public Result queryPage(BusRentQuery query) {
Page<BusRent> busRentVOPage = PageHelper.startPage(query.getPage(), query.getLimit());
//如果開始時間不為空
if (StrUtil.isNotEmpty(query.getBeginTime())){
String[] split = query.getBeginTime().split("~");
System.out.println("-----------------------------------------"+split);
query.setMinBeginTime(split[0].trim());
query.setMaxBeginTime(split[1].trim());
}
busRentMapper.selectList(query);
return new Result(busRentVOPage.toPageInfo());
}
7.新建BusRentQuery
package com.toddding.query;
import lombok.Data;
/**
* @Description: 出租記錄列表的查詢引數封裝類
* @Author: Todd Ding
* @Date 2020-12-03 15:07
*/
@Data
public class BusRentQuery extends Query {
/**
* 車牌號
*/
private String num;
/**
* 客戶名稱
*/
private String name;
/**
* 出租狀態
*/
private Integer flag;
/**
* 開始時間
*/
private String beginTime;
private String minBeginTime; // 最小開始時間
private String maxBeginTime; // 最大的開始時間
}
8.修改BusRentMapper
/**
* 根據引數查詢車輛出租記錄
*
* @param query
* @return
*/
List<BusRent> selectList(BusRentQuery query);
9.修改BusRentMapper.xml
<select id="selectList" resultMap="BaseResultMap">
select
<include refid="Base_Column_List" />
from bus_rent
<where>
<if test="num != null and num != ''">
and num like concat('%',#{num},'%')
</if>
<if test="name != null and name != ''">
and name like concat('%',#{name},'%')
</if>
<if test="flag != null and flag != ''">
and flag = #{flag}
</if>
<if test="minBeginTime != null and minBeginTime != ''">
and begin_time >= #{minBeginTime}
</if>
<if test="maxBeginTime != null and maxBeginTime != ''">
and #{maxBeginTime} >= begin_time
</if>
</where>
</select>
5.還車
1.修改rent/list.jsp
<%--操作--%>
<script type="text/html" id="rowBtns">
<button class="layui-btn layui-btn-sm" lay-event="returnCar">
<i class="layui-icon layui-icon-ok"></i>
還車
</button>
</script>
<%--新增還車記錄模板--%>
<script type="text/html" id = "returnTpl">
<form class="layui-form layui-form-pane" style="margin: 10px" lay-filter="returnFormFilter">
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">車牌號</label>
<div class="layui-input-inline">
<input type="text" name="num" readonly class="layui-input">
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">還車時間</label>
<div class="layui-input-inline">
<input type="text" name="returnTime" id="returnTime" lay-verify="required" lay-reqText="請輸入還車時間" placeholder="還車時間" autocomplete="off" class="layui-input">
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">賠付金額</label>
<div class="layui-input-inline">
<input type="text" name="payMoney" lay-verify="required" value="0" lay-reqText="請輸入賠付金額" placeholder="賠付金額" autocomplete="off" class="layui-input">
</div>
</div>
</div>
<div class="layui-form-item layui-form-text">
<label class="layui-form-label">問題</label>
<div class="layui-input-block">
<textarea class="layui-textarea" name="problem" placeholder="問題" ></textarea>
</div>
</div>
<button type="button" style="display: none" id="subBtn" lay-submit lay-filter="subBtnFilter"></button>
</form>
</script>
//表格行工具欄事件
table.on("tool(dataTableFilter)",function (d) {
var event = d.event;
var rowData = d.data;
if (event == "returnCar"){
returnCar(rowData);
}
})
//還車方法
function returnCar(rowData){
//彈出層的引數
var layOps = {
title:"還車",
type:1,
skin: "layui-layer-molv",
content:$("#returnTpl").html(),
area:['680px','450px'],
success:function (layero,index) {
form.val("returnFormFilter",rowData)
//渲染還車時間
laydate.render({
elem:"#returnTime"
});
//表單的提交監聽
form.on("submit(subBtnFilter)",function (d) {
var formData = d.field;
formData.rentId=rowData.id; //出租記錄id
//使用ajax提交資料
$.post(cxt+"/return/add.do",formData,function (rs) {
layer.msg(rs.msg); //展示業務訊息
if (rs.code != 200){
return false;
}
layer.close(index); //關閉彈層
//重新整理表格
$("#searchBtn").click();
})
return false;//阻止預設提交行為
})
},
btn:['確認','取消'],
btnAlign: "c",
yes:function (index,layero) {
//點選隱藏的提交按鈕 觸發 表單提交監聽
$("#subBtn").click();
}
};
layer.open(layOps);
}
2.新建BusReturnController
package com.toddding.controller;
import com.toddding.common.validator.ValidatorUtil;
import com.toddding.domain.BusReturn;
import com.toddding.service.BusReturnService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
@RestController
@RequestMapping("return")
public class BusReturnController {
@Autowired
private BusReturnService busReturnService;
//新增還車記錄請求
@RequestMapping("add.do")
public Object add(BusReturn busReturn){
ValidatorUtil.validator(busReturn);
return busReturnService.add(busReturn);
}
}
3.新建BusReturnService
package com.toddding.service;
import com.toddding.common.Result;
import com.toddding.domain.BusReturn;
public interface BusReturnService {
//新增還車記錄
Result add(BusReturn busReturn);
}
4.新建BusReturnServiceImpl
package com.toddding.service.impl;
import cn.hutool.core.date.DateTime;
import cn.hutool.core.date.DateUtil;
import com.toddding.common.CodeMsg;
import com.toddding.common.Constant;
import com.toddding.common.Result;
import com.toddding.common.exception.BussiException;
import com.toddding.domain.BusCar;
import com.toddding.domain.BusRent;
import com.toddding.domain.BusReturn;
import com.toddding.mapper.BusCarMapper;
import com.toddding.mapper.BusRentMapper;
import com.toddding.mapper.BusReturnMapper;
import com.toddding.service.BusReturnService;
import com.toddding.shiro.ActiveUser;
import org.apache.shiro.SecurityUtils;
import org.apache.shiro.subject.Subject;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import org.springframework.transaction.annotation.Transactional;
import javax.persistence.RollbackException;
@Service
public class BusReturnServiceImpl implements BusReturnService {
@Autowired
private BusReturnMapper busReturnMapper;
@Autowired
private BusRentMapper busRentMapper;
@Autowired
private BusCarMapper busCarMapper;
@Override
@Transactional(rollbackFor = Exception.class)
public Result add(BusReturn busReturn) {
//業務資料效驗
//查詢出租記錄
//判斷出租記錄狀態
/*
1.查詢出租記錄
2.檢查出租記錄是否還車
3.只有沒有還車時,才能還車
4.修改出租記錄狀態 改為已還車
5.插入還車記錄
6.修改車輛狀態 從已出租改為未出租
計算 出租的總金額
*/
//1.查詢出租記錄
BusRent busRent = busRentMapper.selectByRentId(busReturn.getRentId());
//如果出租狀態已經還車是已還車,則
if (busRent.getFlag().equals(Constant.CAR_RETURN_ED)){
return new Result(CodeMsg.RETURN_CAR_ERROR);
}
//如果沒有還 則修改還車記錄狀態
int rows = busRentMapper.updateRentFlag(busReturn.getRentId(),busRent.getFlag(),Constant.CAR_RENT_ED);
if (rows != 1){
return new Result(CodeMsg.RETURN_FAILED_RENT_CHANGED_ERROR);
}
//修改車輛狀態
BusCar busCar = busCarMapper.selectOneByNum(busReturn.getNum());
rows = busCarMapper.updateRentState(busCar.getId(), Constant.CAR_RENT_NOT, busCar.getVersion());
if (rows != 1){
throw new BussiException(CodeMsg.RETURN_FAILED_CAR_CHANG_ERROR.code,CodeMsg.RETURN_FAILED_CAR_CHANG_ERROR.msg);
}
//計算出租總金額
String beginTime = busRent.getBeginTime()+" 00:00:00"; //格式轉換
String returnTime = busReturn.getReturnTime()+" 23:59:59";
int rentPrice = busRent.getRentPrice(); // 單日租金
Date begin = DateUtil.parse(beginTime, "yyyy-MM-dd HH:mm:ss");
Date end = DateUtil.parse(returnTime, "yyyy-MM-dd HH:mm:ss");
int days = (int) DateUtil.betweenDay(begin, end, true)+1; //不是同一天 對比後加1
if (DateUtil.isSameDay(begin,end)){
days = 1; //如果是同一天的話 設定為1
}
rentPrice= rentPrice * days; //計算總租金
//總金額
int totalMoney = rentPrice + busReturn.getPayMoney();
//總租金
busReturn.setRentPrice(rentPrice);
busReturn.setTotalMoney(totalMoney);
//獲取操作員id
Subject subject = SecurityUtils.getSubject();
ActiveUser activeUser = (ActiveUser) subject.getPrincipal();
busReturn.setUserId(activeUser.getSysUser().getId());
//新增還車記錄
busReturnMapper.insert(busReturn);
return new Result() ;
}
}
5.修改CodeMsg
RETURN_CAR_ERROR(4005001, "車輛已經歸還,請不要重複還車!"),
RETURN_FAILED_RENT_CHANGED_ERROR(4005002, "還車失敗,出租記錄發生變化!"),
RETURN_FAILED_CAR_CHANG_ERROR(4005003, "還車失敗,車輛狀態修改失敗!"),
6.修改Constant
/**
* 未還車
*/
Integer CAR_RETURN_NOT = 1;
/**
* 已還車
*/
Integer CAR_RETURN_ED = 2;
7.新建BusReturn
package com.toddding.domain;
import com.fasterxml.jackson.annotation.JsonFormat;
import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
import org.hibernate.validator.constraints.Length;
import javax.validation.constraints.Min;
import javax.validation.constraints.NotEmpty;
import javax.validation.constraints.NotNull;
import java.util.Date;
/**
* @Description: 車輛歸還記錄實體類
* @Author: Todd Ding
* @Date 2020-12-03 11:01
*/
@Data
@AllArgsConstructor
@NoArgsConstructor
public class BusReturn {
/**
* 還車記錄ID
*/
private Integer id;
/**
* 車牌號
*/
@NotEmpty(message = "車牌號不能為空")
@Length(min = 7,max = 8,message = "車牌號7~8位")
private String num;
/**
* 出租記錄ID
*/
@NotNull(message = "出租記錄ID不能為空")
private Integer rentId;
/**
* 還車時間
*/
@NotEmpty(message = "還車時間不能為空")
private String returnTime;
/**
* 租金
*/
private Integer rentPrice;
/**
* 賠付金額
*/
@NotNull(message = "賠付金額不能為空")
@Min(value = 0,message = "賠付金額最少0")
private Integer payMoney;
/**
* 問題
*/
private String problem;
/**
* 總金額
*/
private Integer totalMoney;
/**
* 業務員ID
*/
private Integer userId;
/**
* 建立時間
*/
@JsonFormat(pattern = "yyyy-MM-dd",timezone = "GMT+8")
private Date createTime;
}
8.新建BusReturnMapper
public interface BusReturnMapper {
/**
* 新增還車記錄
*
* @param busReturn
*/
void insert(BusReturn busReturn);
}
9.新建BusReturnMapper.xml
<mapper namespace="com.toddding.mapper.BusReturnMapper">
<resultMap id="BaseResultMap" type="com.toddding.domain.BusReturn">
<id column="id" property="id"/>
<result column="num" property="num"/>
<result column="rent_id" property="rentId"/>
<result column="return_time" property="returnTime"/>
<result column="rent_price" property="rentPrice"/>
<result column="pay_money" property="payMoney"/>
<result column="problem" property="problem"/>
<result column="total_money" property="totalMoney"/>
<result column="user_id" property="userId"/>
<result column="create_time" property="createTime"/>
</resultMap>
<sql id="Base_Column_List">
id, num, rent_id, return_time, rent_price, pay_money, problem, total_money, user_id, create_time
</sql>
<insert id="insert">
insert into bus_return
(num, rent_id, return_time, rent_price, pay_money, problem, total_money, user_id)
value
(#{num}, #{rentId}, #{returnTime}, #{rentPrice}, #{payMoney}, #{problem}, #{totalMoney}, #{userId})
</insert>
</mapper>
10.修改BusRentMapper
/**
* 根據 ID 查詢出租記錄
*
* @param rentId
* @return
*/
BusRent selectByRentId(@Param("id") Integer rentId);
/**
* 修改還車記錄狀態
*
* @param rentId 出租記錄ID
* @param oldFlag 原出租狀態
* @param flag 新出租狀態
* @return
*/
int updateRentFlag(@Param("id") Integer rentId, @Param("oldFlag") Integer oldFlag, @Param("flag") Integer flag);
11修改BusRentMapper.xml
<select id="selectByRentId" resultMap="BaseResultMap">
select
<include refid="Base_Column_List" />
from bus_rent where id = #{id}
</select>
<update id="updateRentFlag">
update bus_rent set flag = #{flag} where id = #{id} and flag = #{oldFlag}
</update>
6.還車記錄列表
1.新建/return/list.jsp
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ page contentType="text/html;charset=UTF-8" pageEncoding="UTF-8" isELIgnored="false" language="java" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>還車管理</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="format-detection" content="telephone=no">
<link rel="stylesheet" href="${pageContext.request.contextPath}/resources/layui/css/layui.css" media="all"/>
<link rel="stylesheet" href="${pageContext.request.contextPath}/resources/css/public.css" media="all"/>
</head>
<body class="childrenBody">
<form class="layui-form">
<blockquote class="layui-elem-quote quoteBox">
<form class="layui-form layui-form-pane">
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">車牌號</label>
<div class="layui-input-inline" style="width: 120px">
<input type="text" class="layui-input" placeholder="車牌號" id="num">
</div>
</div>
<div class="layui-inline">
<button class="layui-btn" id="searchBtn" type="button">搜尋</button>
<button class="layui-btn layui-btn-primary" type="reset">重置</button>
</div>
</div>
</form>
</blockquote>
<table id="dataTable" lay-filter="dataTableFilter"></table>
<%--操作--%>
<%-- <script type="text/html" id="rowBtns">
<button class="layui-btn layui-btn-sm" lay-event="returnCar">
<i class="layui-icon layui-icon-ok"></i>
還車
</button>
</script>--%>
</form>
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/layui/layui.js"> </script>
<script >
layui.use(['jquery','form','layer','table'],function () {
var cxt = '${pageContext.request.contextPath}';
var $ =layui.jquery;
var form = layui.form;
var layer = layui.layer;
var table = layui.table;
//渲染資料表格
//表格引數
var tabOps ={
id:"dataTableId",
elem:"#dataTable",
url:cxt + "/return/page.do",
page:true,
toolbar: "#headBtns",
cols:[[
{field: "num", align: "center", title: "車牌號"},
{field: "rentId", align: "center", title: "出租ID"},
{field: "returnTime", align: "center", title: "還車時間"},
{field: "rentPrice", align: "center", title: "總租金"},
{field: "payMoney", align: "center", title: "賠付金額"},
{field: "totalMoney", align: "center", title: "總金額"},
{field: "problem", align: "center", title: "問題"},
{field: "createTime", align: "center", title: "建立時間", width: 150},
]], //列資料
parseData:function (rs) {
return{
code: rs.code,
msg:rs.msg,
count:rs.data.total,
data:rs.data.list
}
},
response:{
statusCode:200
}
};
//進行渲染
var tabIns = table.render(tabOps);
//按鈕查詢
$("#searchBtn").click(function () {
var num = $("#num").val();
tabIns.reload({
where:{
"num":num
}
})
})
});
</script>
</body>
</html>
2.修改PageController
/**
* 跳轉還車記錄列表
*
* @return
*/
@RequestMapping("return/list.do")
public String returnList() {
return "return/list.jsp";
}
3.修改navs.json
{
"title": "還車記錄",
"icon": "",
"href": "return/list.do",
"spread": false,
"target": "_self"
}
4.修改BusReturnController
@RequestMapping("page.do")
public Object page(BusReturnQuery query){
return busReturnService.queryPage(query);
}
5.新建BusReturnQuery
package com.toddding.query;
import lombok.Data;
/**
* @Description: 還車記錄列表的查詢引數封裝類
* @Author: Todd Ding
* @Date 2020-12-03 17:11
*/
@Data
public class BusReturnQuery extends Query {
/**
* 車牌號
*/
private String num;
}
6.修改BusReturnService
//分頁查詢還車記錄
Result queryPage(BusReturnQuery query);
7.修改BusReturnServiceImpl
/**
* 還車記錄的分頁查詢
*
* @param query
* @return
*/
@Override
public Result queryPage(BusReturnQuery query) {
Page<BusReturn> busReturnVO = PageHelper.startPage(query.getPage(), query.getLimit());
busReturnMapper.selectList(query);
return new Result(busReturnVO.toPageInfo());
}
8.修改BusReturnMapper
/**
* 還車記錄的分頁查詢
*
* @param query
* @return
*/
List<BusReturn> selectList(BusReturnQuery query);
9.修改BusReturnMapper.xml
<select id="selectList" resultMap="BaseResultMap">
select <include refid="Base_Column_List" /> from bus_return
<where>
<if test="num != null and num != ''">
num like concat('%',#{num},'%')
</if>
</where>
</select>