收银
2016-01-09 17:21
169 查看
一、效果图
![](http://img.blog.csdn.net/20160201102430323?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center)
![](http://img.blog.csdn.net/20160201102306128?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center)
二、前端页面
1、商品列表
三、reserve_commodity_sell.js
1、ReserveCommoditySellDetailController
二、前端页面
1、商品列表
<%@ page contentType="text/html;charset=UTF-8" %> <%@ include file="/WEB-INF/views/include/taglib.jsp" %> <html> <head> <title>商品管理</title> <meta name="decorator" content="main"/> </head> <body> <jsp:include page="/WEB-INF/views/include/sidebar.jsp"> <jsp:param name="action" value="commoditySell"></jsp:param> </jsp:include> <div class="container-fluid"> <div class="row"> <div class="block-flat"> <div class="header"> <h3>商品列表</h3> </div> <form:form id="searchForm" modelAttribute="reserveCommodity" action="${ctx}/reserve/commodity/list" method="post" class="breadcrumb form-search"> <input id="pageNo" name="pageNo" type="hidden" value="${page.pageNo}"/> <input id="pageSize" name="pageSize" type="hidden" value="${page.pageSize}"/> <div class="row"> <div class="col-sm-6 col-md-6 col-lg-6"> <table class="no-border"> <tbody class="no-border-y"> <tr> <td>名称:</td> <td><form:input path="name" htmlEscape="false" maxlength="30" class="form-control"/></td> <td><input id="btnSubmit" class="btn btn-primary" type="submit" value="查询"/></td> </tr> </tbody> </table> </div> </div> </form:form> <div class="row"> <%-- left start--%> <div class="col-sm-6 col-md-6 col-lg-6"> <table id="contentTable"> <thead> <tr> <th>编号</th> <th>名称</th> <th>价格</th> <th>库存量</th> <th>类别</th> <th>操作</th> </tr> </thead> <tbody> <c:forEach items="${page.list}" var="commodity"> <tr> <td><a href="${ctx}/reserve/commodity/form?id=${commodity.id}"> ${commodity.commodityId} </a></td> <td> ${commodity.name} </td> <td> ${commodity.price} 元 </td> <td> ${commodity.repertoryNum} </td> <td> ${commodity.commodityType.name} </td> <td> <button id="${commodity.id}" class="btn btn-primary btn-xs" onclick="outStorage('${commodity.id}','${commodity.name}',${commodity.price})"> 售卖 </button> </td> </tr> </c:forEach> </tbody> </table> <div class="row"> <div class="col-sm-12"> <div class="pull-right"> <div class="dataTables_paginate paging_bs_normal"> <sys:javascript_page p="${page}"></sys:javascript_page> </div> </div> <div class="clearfix"></div> </div> </div> </div> <%--end of left--%> <%-- right start--%> <div class="col-sm-6 col-md-6 col-lg-6"> <form id="paySell"> 商品销售表 <table id="sellList" class="table table-striped table-bordered table-condensed"> <thead> <tr> <th align="center">商品名称</th> <th align="center">数量</th> </tr> </thead> </table> 合计:<span id="sum">0</span>元 <a class="btn btn-success" onclick="settlement()">结算</a> </form> </div> <%--end of right--%> </div> </div> </div> <%-- end of row-fluid--%> </div> <button class="btn btn-primary btn-flat md-trigger" id="settlementDialogBtn" style="display: none" data-modal="settlementDialog"> 结算 </button> <div class="md-modal colored-header custom-width md-effect-12 warning" id="settlementDialog"> <div class="md-content"> <div class="modal-header"> <h5>结算</h5> <button type="button" class="close md-close" data-dismiss="modal" aria-hidden="true">×</button> </div> <div class="modal-body form-horizontal " id="settlementForm"> <!--结算--> <!--end 结算--> </div> <div class="modal-footer"> <button type="button" class="btn btn-default btn-flat md-close" data-dismiss="modal"> 取消 </button> <button type="button" id="settlementSaveBtn" class="btn btn-primary btn-flat" onclick="paySubmit()">结算</button> </div> </div> </div> <%--end of container-fluid--%> <script src="${ctxStatic}/modules/reserve/js/reserve_commodity_sell.js" type="text/javascript"></script> </body> </html>2、结算
<%@ page contentType="text/html;charset=UTF-8" language="java" %> <%@ include file="/WEB-INF/views/include/taglib.jsp" %> <div class="row"> <div class="content"> <div class="table-responsive"> <form id="paySubmitForm"> <table> <thead> <tr> <th>商品名称</th> <th>数量</th> <th>单价</th> </tr> </thead> <tbody> <input type="hidden" name="token" value="${token}"/> <c:forEach items="${sellDetailList}" var="reserveCommoditySellDetail" varStatus="status"> <tr> <input name="reserveCommoditySellDetailList[${status.index}].reserveCommodity.id" value="${reserveCommoditySellDetail.reserveCommodity.id}" type="hidden"> <td><input class="form-control" type="text" name="reserveCommoditySellDetailList[${status.index}].reserveCommodity.name" value="${reserveCommoditySellDetail.reserveCommodity.name}" placeholder="${reserveCommoditySellDetail.reserveCommodity.name}" readonly></td> <td><input class="form-control" type="text" name="reserveCommoditySellDetailList[${status.index}].num" value="${reserveCommoditySellDetail.num}" placeholder="${reserveCommoditySellDetail.num}" readonly></td> <td><input class="form-control" type="text" name="reserveCommoditySellDetailList[${status.index}].price" value="${reserveCommoditySellDetail.price}" placeholder="${reserveCommoditySellDetail.price}" readonly></td> </tr> </c:forEach> <tr> <td> 支付方式: </td> <td colspan="3"> <div class="btn-group" id="payType"> <label class="radio-inline"> <input type="radio" class="icheck" id="cash" value="2" checked="checked" name="payType"/>现金 </label> <label class="radio-inline"> <input type="radio" class="icheck" id="isMember" value="1" name="payType"/>会员卡 </label> <label class="radio-inline"> <input type="radio" class="icheck" id="card" value="3" name="payType"/>银行卡 </label> <label class="radio-inline"> <input type="radio" class="icheck" id="weixin" value="4" name="payType"/>微信 </label> <label class="radio-inline"> <input type="radio" class="icheck" id="alipay" value="5" name="payType"/>支付宝 </label> <label class="radio-inline"> <input type="radio" class="icheck" id="other" value="6" name="payType"/>其它 </label> </div> </td> </tr> <div id="memberList" style="display:none"> <tr> <td>姓名:</td> <td> <select style="width: 80px;" id="reserveMemberSelect" class="select2" name="reserveStoredCardMember.id" disabled> <option value="">--请选择会员--</option> <c:forEach items="${reserveMemberList}" var="m"> <option value="${m.id}">${m.mobile}-${m.name}</option> </c:forEach> </select> </td> </tr> </div> </tbody> </table> </form> </div> </div> </div> <script type="text/javascript"> $(document).ready(function () { $("#isMember").on('ifChecked', function () { $("#reserveMemberSelect").removeAttr("disabled"); }); $("#cash").on('ifChecked', function () { $("#reserveMemberSelect").attr("disabled","disabled"); }); $("#card").on('ifChecked', function () { $("#reserveMemberSelect").attr("disabled","disabled"); }); $("#weixin").on('ifChecked', function () { $("#reserveMemberSelect").attr("disabled","disabled"); }); $("#alipay").on('ifChecked', function () { $("#reserveMemberSelect").attr("disabled","disabled"); }); $("#other").on('ifChecked', function () { $("#reserveMemberSelect").attr("disabled","disabled"); }); }) </script>
三、reserve_commodity_sell.js
/** * Created by lenovo on 2016/1/11. */ function outStorage(id, name, price) { var index = $("#sellList tbody tr").length; var s = '<tr data-price="'+price+'" data-num="1" id="'+id+'tr"><td>'+name+'</td><td>\ <a onclick="add(\''+id+'\')" class="glyphicon glyphicon-plus"></a>\ <input name="reserveCommoditySellDetailList['+index+'].reserveCommodity.id" value=\''+id+'\' type="hidden">\ <input name="reserveCommoditySellDetailList['+index+'].reserveCommodity.name" value=\''+name+'\' type="hidden" >\ <input name="reserveCommoditySellDetailList['+index+'].num" id="'+id+'num" style="width:20px" value="1" onblur="changeNumber(\''+id+'\')">\ <input name="reserveCommoditySellDetailList['+index+'].price" value=\''+price+'\' type="hidden">\ <a onclick="dele(\''+id+'\')" class="glyphicon glyphicon-minus"></a></td></tr>'; $("#" + id).attr("disabled", "true"); /*求和*/ var sum = Number($("#sum").text()); sum += price; $("#sum").text(sum); $('#sellList').append(s); } function add(id) { var num = Number($("#" + id + "num").val()); num++; $("#" + id + "num").val(num); $("#" + id+"tr").attr("data-num",num); sum(); } function dele(id) { var num = Number($("#" + id + "num").val()); num--; $("#" + id + "num").val(num); $("#" + id+"tr").attr("data-num",num); sum(); } function changeNumber(id){ var num = Number($("#" + id + "num").val()); $("#" + id+"tr").attr("data-num",num); sum(); } function sum() { var sum = 0; $("#sellList tbody tr").each(function () { var num = $(this).attr("data-num"); var price = $(this).attr("data-price"); var t = price*1 * num*1; sum += t; }); $("#sum").text(sum); return sum; } function settlement() { var sellDetailList = $("#paySell").serializeArray(); jQuery.postItems({ url: ctx+'/reserve/reserveCommoditySellDetail/settlement', data: sellDetailList, success: function (result) { $("#settlementForm").html(result); $("#settlementDialogBtn").click(); $("#settlementForm .select2").select2({ width: '100%' }); $('#settlementForm .icheck').iCheck({ checkboxClass: 'icheckbox_square-blue checkbox', radioClass: 'iradio_square-blue' }); } }); } function paySubmit() { var data = $("#paySubmitForm").serializeArray(); var payType = $('#payType input:radio:checked').val(); if(payType=='1'){ var memberId=jQuery("#reserveMemberSelect").val(); if(memberId=="" || memberId==null || memberId== undefined){ errorLoding("请选择会员"); return; } } jQuery.postItems({ url: ctx+'/reserve/reserveCommoditySellDetail/paySubmit', data: data, success: function (result) { successLoding(result); location.reload(true); }, error: function () { errorLoding("付款失败"); } }); }四、controller
1、ReserveCommoditySellDetailController
@RequestMapping(value = "paySubmit") @ResponseBody @Token(remove = true) public String paySubmit(ReserveCommoditySellDetailList sellDetailList) { //销售主表 Double total=0.0; for(ReserveCommoditySellDetail sellDetail:sellDetailList.getReserveCommoditySellDetailList() ){ Double price=sellDetail.getPrice(); Integer num=sellDetail.getNum(); Double detailSum=price*num; total+=detailSum; } ReserveCommoditySell reserveCommoditySell=new ReserveCommoditySell(); reserveCommoditySell.setTotalSum(total); reserveCommoditySell.setGiftFlag("0"); ReserveMember reserveMember=sellDetailList.getReserveStoredCardMember(); reserveCommoditySell.setReserveMember(reserveMember); reserveCommoditySellService.save(reserveCommoditySell); if(reserveMember!=null){ //储值卡会员扣款 reserveMember=reserveMemberService.get(reserveMember); double remainder=reserveMember.getRemainder(); remainder-=total; reserveMember.setRemainder(remainder); reserveMemberService.save(reserveMember); } //销售详情 for(ReserveCommoditySellDetail sellDetail:sellDetailList.getReserveCommoditySellDetailList() ){ Double price=sellDetail.getPrice(); Integer num=sellDetail.getNum(); Double detailSum=price*num; sellDetail.setDetailSum(detailSum); sellDetail.setReserveCommoditySell(reserveCommoditySell); reserveCommoditySellDetailService.save(sellDetail); } return "付款成功"; }
相关文章推荐
- 简单的Java读取xml文件
- python新手笔记之python继承
- Python新手笔记之python迭代器遍历列表
- python新手笔记之包和模块的引入
- python新手笔记之python高级函数编程
- 机器学习初识之KNN算法
- 机器学习初识之Kmeans浅尝
- 判断一个数组是不是排序二叉树后序遍历
- 内部排序(一)
- 层次遍历二叉树的变种
- Android环境下安装openCV
- iOS开发tableView去掉顶部上部空表区域
- java模式之装饰者模式
- java并发编程学习笔记1
- java并发编程学习笔记2
- java模式之观察者模式
- java并发编程学习笔记之线程池等源码小析
- 笔试题小解
- 从notify-wait模式说去
- java 并发编程之同步器