2020暑假專案-車輛派遣管理系統開發記錄#4
阿新 • • 發佈:2020-07-22
2020暑假專案-車輛派遣管理系統開發記錄#4
內容展示
- 1、今日完成內容,
- 駕駛員資訊列表完成,及資訊更新維護;使用layui的表格編輯功能,可直接在表格中修改資訊
- 業務員資訊列表完成,及資訊更新維護;使用layui的表格編輯功能,可直接在表格中修改資訊 - 2、核心原始碼
pilotList.jsp
<%@ page contentType="text/html;charset=UTF-8" language="java" %> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> <%@ taglib uri="http://java.sun.com/jstl/fmt_rt" prefix="fmt"%> <jsp:include page="../common/menu.jsp" /> <html> <head> <title>車輛資訊管理</title> </head> <script src="<%=basePath%>js/tools.js"></script> <body> <div class="layui-tab"> <ul class="layui-tab-title"> <li class="layui-this">駕駛員管理</li> </ul> <div class="layui-tab-content"> <table class="layui-hide" id="backUser" lay-filter="backUser"></table> </div> </div> <script type="text/html" id="toolbar"> <div class="layui-btn-container"> <button class="layui-btn layui-btn-sm" lay-event="addUser">新增資料</button> </div> </script> <script type="text/html" id="bduCreateDate"> {{ dateFormat(d.createTime) }} </script> <script type="text/html" id="bpilotLicenseTime"> {{ dateFormat(d.pilotLicenseTime) }} </script> <script type="text/html" id="bworkLicenseTime"> {{ dateFormat(d.workLicenseTime) }} </script> <script type="text/html" id="status"> <input type="checkbox" name="status" id="{{d.id}}" value="{{d.status}}" lay-skin="switch" lay-text="啟用|停用" lay-filter="bduStatusFilter" {{ d.status == 1 ? 'checked' : '' }}> </script> </body> </html> <jsp:include page="../common/js.jsp" /> <script type="text/javascript"> $('document').ready(function() { var layer = null; var laypage = null; var table = null; var form = null; layui.use([ "laypage", "layer", 'table' ], function() { layer = layui.layer; laypage = layui.laypage; table = layui.table; form = layui.form; table.render({ elem : '#backUser', url : '<%=basePath%>pilot/pilotList', id : 'backUser', height:650, toolbar : '#toolbar', cellMinWidth : 100, cols : [ [ { field : 'id', title : '編號', width : '5%', unresize : true, sort : true } , { field : 'pilotName', title : '駕駛員姓名', width : '10%', sort : true } , { field : 'pilotCrad', title : '身份證號碼', edit: 'text', width : '10%', unresize : true } , { field : 'pilotTel', title : '聯絡電話', width : '10%', edit: 'text', sort : true } , { field : 'pilotAdr', title : '聯絡地址', width : '10%', edit: 'text', sort : true } , { field : 'pilotLicenseTime', title : '駕駛證有效期', width : '10%', templet : '#bpilotLicenseTime', sort : true } , { field : 'workLicenseTime', title : '上崗證有效期', width : '10%', templet : '#bworkLicenseTime', sort : true } , { field : 'remark', title : '備註', edit: 'text', width : '12%', unresize : true } , { field : 'createBy', title : '建立人', width : '10%', sort : true } , { field : 'createtime', title : '建立日期', width : '10%', templet : '#bduCreateDate', unresize : true } , { fixed : 'right', width : '10%', align : 'center', toolbar : '#status', title : '狀態' } ] ], page : true }); //監聽單元格編輯 TODO table.on('edit(backUser)', function(obj){ var value = obj.value //得到修改後的值 ,data = obj.data //得到所在行所有鍵值 ,field = obj.field; //得到欄位 layer.msg('[ID: '+ data.id +'] ' + field + ' 欄位更改為:'+ value); var postData ={}; postData["id"] = data.id; postData[field] = obj.value; $.ajax({ url:'<%=basePath %>pilot/updatePilotByPk', data:postData, type:'POST', success:function(data){ if(data.responseHead.code == '200'){ layer.alert('操作成功!', {icon: 1,title: "結果"}); }else{ layer.alert(data.responseHead.msg, {icon: 5,title: "結果"}); } table.reload('backUser', { url: '<%=basePath%>pilot/pilotList' }); } }); }); //頭工具欄事件 table.on('toolbar(backUser)', function(obj) { var checkStatus = table.checkStatus(obj.config.id); var data = checkStatus.data; switch(obj.event){ case 'addUser': layer.msg('新增'); window.location.href="<%=basePath %>pilot/toAddPilot"; break; }; }); form.on('switch(bduStatusFilter)', function(obj) { var ids =[]; ids[0] = this.id; var type = this.value=="1"?0:1; $.ajax({ url:'<%=basePath %>pilot/updatePilotStatus', data:{ "type":type, "list":ids }, type:'POST', success:function(data){ if(data.responseHead.code == '200'){ layer.alert('操作成功!', {icon: 1,title: "結果"}); }else{ layer.alert(data.responseHead.msg, {icon: 5,title: "結果"}); } table.reload('backUser', { url: '<%=basePath%>pilot/pilotList' }); } }); }); }); }); </script>
addPilot.jsp
<%@ page contentType="text/html;charset=UTF-8" language="java" %> <% String path = request.getContextPath(); String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/"; %> <jsp:include page="../common/menu.jsp" /> <html> <head> <title>車輛新增</title> </head> <body class="form-wrap"> <div class="layui-fluid"> <div class="layui-card"> <div class="layui-card-header">新增駕駛員</div> <div class="layui-card-body" style="padding: 15px;"> <form class="layui-form" action="<%=basePath %>pilot/addPilot" name="warehouseAreaForm" method="post" lay-filter="component-form-group"> <div class="layui-form-item"> <label class="layui-form-label">駕駛員姓名</label> <div class="layui-input-block"> <input type="text" name="pilotName" value="" autocomplete="off" class="layui-input"> </div> </div> <div class="layui-form-item"> <label class="layui-form-label">身份證號碼</label> <div class="layui-input-block"> <input type="text" name="pilotCrad" id="pilotCrad" autocomplete="off" class="layui-input"> </div> </div> <div class="layui-form-item"> <label class="layui-form-label">聯絡電話</label> <div class="layui-input-block"> <input type="number" name="pilotTel" id="pilotTel" autocomplete="off" class="layui-input"> </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" value="" name="pilotAdr" id='pilotAdr' 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" value="" name="pilotLicenseTime" id='pilotLicenseTime' 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" value="" name="workLicenseTime" id='workLicenseTime' class="layui-input"> </div> </div> </div> <div class="layui-form-item"> <label class="layui-form-label">是否可用</label> <div class="layui-input-block"> <input type="checkbox" name="status" value="1" checked="" lay-skin="switch" lay-text="允許|禁止"><div class="layui-unselect layui-form-switch layui-form-onswitch" lay-skin="_switch"><em>允許</em><i></i></div> </div> </div> <div class="layui-form-item layui-form-text"> <label class="layui-form-label">備註</label> <div class="layui-input-block"> <textarea name="remark" class="layui-textarea"></textarea> </div> </div> <div class="layui-form-item layui-layout-admin"> <div class="layui-input-block"> <div class="layui-footer" style="text-align: center;"> <button class="layui-btn" lay-submit="" lay-filter="component-form-demo1">立即提交</button> <button type="reset" class="layui-btn layui-btn-primary">重置</button> <button class="layui-btn layui-btn-primary" id="back">返回</button> </div> </div> </div> </form> </div> </div> </div> </body> <script type="text/javascript"> $('document').ready(function(){ layui.use(['form','laydate'], function(){ var form = layui.form; var laydate = layui.laydate; laydate.render({ elem : '#pilotLicenseTime', trigger : 'click' }); laydate.render({ elem : '#workLicenseTime', trigger : 'click' }); /* 監聽提交 */ form.on('submit(component-form-demo1)', function(data){ var form = document.forms[0]; form.submit(); return false; }); }); $('#back').click(function(){ window.location.href="<%=basePath %>pilot/toPilotList"; return false; }); }); </script> </html> <jsp:include page="../common/js.jsp" />
PilotController.java
package com.vdm.action; import com.vdm.model.PilotInfo; import com.vdm.model.UserInfo; import com.vdm.service.PilotService; import com.vdm.util.Constants; import com.vdm.util.ErrorConstants; import com.vdm.util.ReturnMapUtil; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.bind.annotation.RequestMethod; import org.springframework.web.bind.annotation.RequestParam; import org.springframework.web.bind.annotation.ResponseBody; import javax.servlet.http.HttpSession; import java.util.HashMap; import java.util.List; import java.util.Map; @Controller @RequestMapping(value = "/pilot") public class PilotController { @Autowired PilotService pilotService; @RequestMapping(value = "/toPilotList") public String toPilotList(){return "pilot/pilotList";} @ResponseBody @RequestMapping(value = "/pilotList",method = RequestMethod.GET) public Map<String,Object> vehicleList(){ List<PilotInfo> userList = pilotService.pilotInfoList(); int count = pilotService.getPilotInfoCount(); Map<String,Object> retMap = new HashMap<String,Object>(); retMap.put("code",0); retMap.put("msg",""); retMap.put("count",count); retMap.put("data",userList); return retMap; } @ResponseBody @RequestMapping(value="/updatePilotStatus",method=RequestMethod.POST) public Map<String,Object> updatePilotStatus(@RequestParam(value = "list[]")List<Integer> ids, Integer type){ if(pilotService.updatePilotInfoStatus(ids, type)>0){ return ReturnMapUtil.getOKResult(); }else{ return ReturnMapUtil.getErrorResult(ErrorConstants.PARAMETER_ERROR); } } @ResponseBody @RequestMapping(value="/updatePilotByPk",method=RequestMethod.POST) public Map<String,Object> updatePilotByPk(PilotInfo pilotInfo){ if(pilotService.updateByPk(pilotInfo)>0){ return ReturnMapUtil.getOKResult(); }else{ return ReturnMapUtil.getErrorResult(ErrorConstants.PARAMETER_ERROR); } } @RequestMapping(value = "/toAddPilot") public String toAddPilot(){return "pilot/addPilot";} @RequestMapping(value = "/addPilot" , method = RequestMethod.POST) public String addPilot(PilotInfo pilotInfo, HttpSession session){ UserInfo user = (UserInfo) session.getAttribute(Constants.CURRENT_USER); pilotInfo.setCreateBy(user.getLoginName()); pilotService.insertSelective(pilotInfo); return "redirect:toPilotList"; } }
pilotInfoMapper.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.vdm.dao.PilotInfoMapper" >
<resultMap id="BaseResultMap" type="com.vdm.model.PilotInfo" >
<id column="id" property="id" jdbcType="INTEGER" />
<result column="pilot_name" property="pilotName" jdbcType="VARCHAR" />
<result column="pilot_crad" property="pilotCrad" jdbcType="VARCHAR" />
<result column="pilot_tel" property="pilotTel" jdbcType="VARCHAR" />
<result column="pilot_adr" property="pilotAdr" jdbcType="VARCHAR" />
<result column="pilot_license_time" property="pilotLicenseTime" jdbcType="DATE" />
<result column="work_license_time" property="workLicenseTime" jdbcType="DATE" />
<result column="status" property="status" jdbcType="SMALLINT" />
<result column="remark" property="remark" jdbcType="VARCHAR" />
<result column="create_time" property="createTime" jdbcType="TIMESTAMP" />
<result column="create_by" property="createBy" jdbcType="VARCHAR" />
</resultMap>
<sql id="Base_Column_List" >
id, pilot_name, pilot_crad, pilot_tel, pilot_adr, pilot_license_time, work_license_time, status,
remark, create_time, create_by
</sql>
<select id="selectByPrimaryKey" resultMap="BaseResultMap" parameterType="java.lang.Integer" >
select
<include refid="Base_Column_List" />
from pilot_info
where id = #{id,jdbcType=INTEGER}
</select>
<delete id="deleteByPrimaryKey" parameterType="java.lang.Integer" >
delete from pilot_info
where id = #{id,jdbcType=INTEGER}
</delete>
<insert id="insert" parameterType="com.vdm.model.PilotInfo" >
insert into pilot_info (id, pilot_name, pilot_crad,
pilot_tel, pilot_adr, pilot_license_time, status,
work_license_time, remark, create_time,
create_by)
values (#{id,jdbcType=INTEGER}, #{pilotName,jdbcType=VARCHAR}, #{pilotCrad,jdbcType=VARCHAR},
#{pilotTel,jdbcType=VARCHAR}, #{pilotAdr,jdbcType=VARCHAR}, #{pilotLicenseTime,jdbcType=DATE},
#{workLicenseTime,jdbcType=DATE}, #{remark,jdbcType=VARCHAR}, #{createTime,jdbcType=TIMESTAMP},
#{createBy,jdbcType=VARCHAR})
</insert>
<insert id="insertSelective" parameterType="com.vdm.model.PilotInfo" >
insert into pilot_info
<trim prefix="(" suffix=")" suffixOverrides="," >
<if test="id != null" >
id,
</if>
<if test="pilotName != null" >
pilot_name,
</if>
<if test="pilotCrad != null" >
pilot_crad,
</if>
<if test="pilotTel != null" >
pilot_tel,
</if>
<if test="pilotAdr != null" >
pilot_adr,
</if>
<if test="pilotLicenseTime != null" >
pilot_license_time,
</if>
<if test="workLicenseTime != null" >
work_license_time,
</if>
<if test="remark != null" >
remark,
</if>
<if test="status != null" >
status,
</if>
create_time,
<if test="createBy != null" >
create_by,
</if>
</trim>
<trim prefix="values (" suffix=")" suffixOverrides="," >
<if test="id != null" >
#{id,jdbcType=INTEGER},
</if>
<if test="pilotName != null" >
#{pilotName,jdbcType=VARCHAR},
</if>
<if test="pilotCrad != null" >
#{pilotCrad,jdbcType=VARCHAR},
</if>
<if test="pilotTel != null" >
#{pilotTel,jdbcType=VARCHAR},
</if>
<if test="pilotAdr != null" >
#{pilotAdr,jdbcType=VARCHAR},
</if>
<if test="pilotLicenseTime != null" >
#{pilotLicenseTime,jdbcType=DATE},
</if>
<if test="workLicenseTime != null" >
#{workLicenseTime,jdbcType=DATE},
</if>
<if test="remark != null" >
#{remark,jdbcType=VARCHAR},
</if>
<if test="status != null" >
#{status,jdbcType=SMALLINT},
</if>
<if test="createTime != null" >
#{createTime,jdbcType=TIMESTAMP},
</if>
<if test="createTime == null" >
now(),
</if>
<if test="createBy != null" >
#{createBy,jdbcType=VARCHAR},
</if>
</trim>
</insert>
<update id="updateByPrimaryKeySelective" parameterType="com.vdm.model.PilotInfo" >
update pilot_info
<set >
<if test="pilotName != null" >
pilot_name = #{pilotName,jdbcType=VARCHAR},
</if>
<if test="pilotCrad != null" >
pilot_crad = #{pilotCrad,jdbcType=VARCHAR},
</if>
<if test="pilotTel != null" >
pilot_tel = #{pilotTel,jdbcType=VARCHAR},
</if>
<if test="pilotAdr != null" >
pilot_adr = #{pilotAdr,jdbcType=VARCHAR},
</if>
<if test="pilotLicenseTime != null" >
pilot_license_time = #{pilotLicenseTime,jdbcType=DATE},
</if>
<if test="workLicenseTime != null" >
work_license_time = #{workLicenseTime,jdbcType=DATE},
</if>
<if test="remark != null" >
remark = #{remark,jdbcType=VARCHAR},
</if>
<if test="createTime != null" >
create_time = #{createTime,jdbcType=TIMESTAMP},
</if>
<if test="createBy != null" >
create_by = #{createBy,jdbcType=VARCHAR},
</if>
</set>
where id = #{id,jdbcType=INTEGER}
</update>
<update id="updateByPrimaryKey" parameterType="com.vdm.model.PilotInfo" >
update pilot_info
set pilot_name = #{pilotName,jdbcType=VARCHAR},
pilot_crad = #{pilotCrad,jdbcType=VARCHAR},
pilot_tel = #{pilotTel,jdbcType=VARCHAR},
pilot_adr = #{pilotAdr,jdbcType=VARCHAR},
pilot_license_time = #{pilotLicenseTime,jdbcType=DATE},
work_license_time = #{workLicenseTime,jdbcType=DATE},
remark = #{remark,jdbcType=VARCHAR},
create_time = #{createTime,jdbcType=TIMESTAMP},
create_by = #{createBy,jdbcType=VARCHAR}
where id = #{id,jdbcType=INTEGER}
</update>
<select id="pilotInfoInfoList" resultMap="BaseResultMap">
select
<include refid="Base_Column_List"/>
from pilot_info
</select>
<select id="getPilotInfoCount" resultType="java.lang.Integer">
select count(*) from pilot_info
</select>
<update id="updatePilotInfoStatus">
update pilot_info
set
status = #{type,jdbcType=INTEGER}
where 1=1
<if test="ids !=null and ids.size()>0">
and id IN
<foreach collection="ids" open="(" close=")" separator=","
index="index" item="item">
#{item, jdbcType=INTEGER}
</foreach>
</if>
</update>
</mapper>
-
3、遇到的問題
- 3.1 layui中laydate在一個頁面上使用多個日期選擇框時會出現閃爍,及無法正常顯示
- 3.2 提交表單資料中有日期型別的資料(精確到日)時會報400錯誤,
-
4、解決問題
- 4.1 在渲染laydate中增加 trigger屬性
laydate.render({ elem : '#workLicenseTime', trigger : 'click' });
- 4.2 提交的資料為字串,無法自動適配到bean的Date日期物件中,需要進行轉換設定,在對應的model物件的欄位上加轉化註解
@DateTimeFormate(pattern="yyyy-MM-dd")
- 4.1 在渲染laydate中增加 trigger屬性