| <!DOCTYPE HTML> | 
| <html xmlns:th="http://www.thymeleaf.org" xmlns:matrix="http://www.w3.org/1999/xhtml"> | 
| <head> | 
|     <meta charset="utf-8"> | 
|     <META HTTP-EQUIV="Pragma" CONTENT="no-cache"> | 
|     <meta name="renderer" content="webkit|ie-comp|ie-stand"> | 
|     <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> | 
|     <meta name="viewport" | 
|           content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/> | 
|     <meta http-equiv="Cache-Control" content="no-siteapp"/> | 
|     <!-- 本框架基本脚本和样式 --> | 
|     <script type="text/javascript" | 
|             th:src="@{/js/plugin/jquery-2.1.4.min.js}"></script> | 
|     <script type="text/javascript" | 
|             th:src="@{/js/systools/MBase.js}"></script> | 
| </head> | 
| <style> | 
|   | 
|     .form-head .col-md-8 { | 
|         width: 100% !important; | 
|     } | 
|   | 
|     .input-group { | 
|         display: flex !important; | 
|         align-items: center; | 
|         padding: 35px 0; | 
|         margin-left: -13px; | 
|     } | 
|   | 
|     .btn-group-sm > .btn, .btn-sm { | 
|         margin-right: 8px; | 
|     } | 
|   | 
|     table tr:last-child { | 
|         border-bottom: 1px solid #ddd | 
|     } | 
|   | 
|     table tr:first-child { | 
|         border-top: 1px solid #ddd | 
|     } | 
|   | 
|     td { | 
|         text-align: center; | 
|         border-left: 1px solid #ddd; | 
|         border-right: 1px solid #ddd | 
|     } | 
|   | 
|     th { | 
|         text-align: center; | 
|         border-top: 1px solid #ddd; | 
|         border-left: 1px solid #ddd; | 
|         border-right: 1px solid #ddd; | 
|     } | 
|   | 
|     .pd-10 { | 
|         padding: 0; | 
|         margin: 50px 10px | 
|     } | 
| </style> | 
| <body> | 
| <div class="ibox-content" id="displayOrder" style="margin-bottom: 20px"> | 
|     <!--编辑界面--> | 
|     <form class="form-horizontal" id="dataform" onsubmit="javascript:return false;"> | 
|         <input autocomplete="off"   type="hidden" name="tokenUrl" th:value="${tokenUrl}"> | 
|         <input autocomplete="off"   type="hidden" name="token" th:value="${token}"> | 
|         <input autocomplete="off"   type="hidden" id="orderId" name="id" th:value="${orderInfo.id}"> | 
|         <div class="form-group"> | 
|             <label class="col-sm-2 control-label">订单编号 | 
|             </label> | 
|             <div class="col-sm-4"> | 
|                 <!--name="orderNo"--> | 
|                 <input autocomplete="off"   type="text" class="form-control" | 
|                        ignore="ignore" readonly="readonly" | 
|                        th:value="${orderInfo.orderNo}" nullmsg="订单编号不能为空"> | 
|             </div> | 
|             <label class="col-sm-2 control-label">订单金额 | 
|             </label> | 
|             <div class="col-sm-4"> | 
|                 <!--name="orderMoney"--> | 
|                 <input autocomplete="off"   type="text" class="form-control" name="orderMoney" | 
|                        ignore="ignore" | 
|                        th:value="${orderInfo.orderMoney}" nullmsg="订单金额不能为空"> | 
|             </div> | 
|         </div> | 
|         <div class="form-group"> | 
|             <label class="col-sm-2 control-label">下单时间 | 
|             </label> | 
|             <div class="col-sm-4"> | 
|                 <!--name="orderTime"--> | 
|                 <input autocomplete="off"   type="text" class="form-control datetimepicker" readonly="readonly" | 
|                        th:value="${#dates.format(orderInfo.orderTime, 'yyyy-MM-dd hh:mm:ss')}" nullmsg="下单时间不能为空"> | 
|             </div> | 
|   | 
|             <label class="col-sm-2 control-label">配送方式 | 
|             </label> | 
|             <div class="col-sm-4"> | 
|                 <input autocomplete="off"   type="text" class="form-control" readonly="readonly" | 
|                        th:value="${orderInfo.shippingMethod}" nullmsg="订单备注不能为空"> | 
|             </div> | 
|         </div> | 
|         <div class="form-group"> | 
|   | 
|             <label class="col-sm-2 control-label">订单状态 | 
|             </label> | 
|             <div class="col-sm-4"> | 
|                 <!--name="orderStatus"--> | 
|                 <select class="form-control autoFull" dataType="*" name="orderStatus" | 
|                         th:data-url="@{/admin/shopOrder/getOrderStatusSelectValue}" data-value="code" | 
|                         data-def="${orderInfo.orderStatus}" | 
|                         th:data-def="${orderInfo.orderStatus}" | 
|                         data-filed="name"> | 
|                 </select> | 
|             </div> | 
|         </div> | 
|   | 
|         <div class="form-group"> | 
|             <label class="col-sm-2 control-label">购买件数 | 
|             </label> | 
|             <div class="col-sm-4"> | 
|                 <!--name="purchaseQuantity"--> | 
|                 <input autocomplete="off"   type="text" class="form-control" | 
|                        ignore="ignore" readonly="readonly" | 
|                        th:value="${orderInfo.purchaseQuantity}"> | 
|             </div> | 
|         </div> | 
|         <div class="form-group"> | 
|             <label class="col-sm-2 control-label">收货人 | 
|                 <span class="text-danger">*</span> | 
|             </label> | 
|             <div class="col-sm-4"> | 
|                 <input autocomplete="off"   type="text" class="form-control" name="userName" | 
|                        datatype="*1-20" | 
|                        th:value="${orderInfo.userName}" nullmsg="客户姓名不能为空"> | 
|             </div> | 
|             <label class="col-sm-2 control-label">收货电话 | 
|                 <span class="text-danger">*</span> | 
|             </label> | 
|             <div class="col-sm-4"> | 
|                 <input autocomplete="off"   type="text" class="form-control" name="userTel" | 
|                        datatype="*1-20" | 
|                        th:value="${orderInfo.userTel}" nullmsg="客户电话不能为空"> | 
|             </div> | 
|         </div> | 
|         <div class="form-group" v-if="orderInfo.shippingMethod == 1"> | 
|             <label class="col-sm-2 control-label">收货地址 | 
|                 <span class="text-danger">*</span> | 
|             </label> | 
|             <div class="col-sm-10" | 
|                  th:if="${orderInfo.deliveryInfo != null && orderInfo.deliveryInfo.receiveAddress != null}"> | 
|                 <textarea type="text" class="form-control" name="receiveAddr" | 
|                           datatype="*1-250" | 
|                           th:text="${orderInfo.deliveryInfo.receiveAddress}"></textarea> | 
|             </div> | 
|         </div> | 
|         <div class="form-group"> | 
|             <label class="col-sm-2 control-label">订单备注 | 
|             </label> | 
|             <div class="col-sm-10"> | 
|                 <textarea type="text" class="form-control" name="remarks" | 
|                           ignore="ignore" | 
|                           th:text="${orderInfo.remarks}" nullmsg="订单备注不能为空"></textarea> | 
|             </div> | 
|         </div> | 
|   | 
|   | 
|   | 
|         <div class="form-group row"> | 
|             <label class="col-sm-2 control-label">订单明细 | 
|             </label> | 
|             <div class="col-sm-8"> | 
|                 <table class="table table-hover table-striped"> | 
|                     <tr> | 
|                         <th>产品</th> | 
|                         <th>单价</th> | 
|                         <th>数量</th> | 
|                         <th>小计</th> | 
|                     </tr> | 
|                     <tr th:each="orderDetails,userStat : ${orderInfo.details}"> | 
|                         <td th:text="${orderDetails.shopProduct.title}"></td> | 
|                         <td th:text="${orderDetails.price}"></td> | 
|                         <td th:text="${orderDetails.count}"></td> | 
|                         <td > | 
|                             <input autocomplete="off"   class="form-control" style="width: 150px" th:data-id="${orderDetails.id}"  th:name="orderDetails" th:value="${orderDetails.totalPrice}" > | 
|                         </td> | 
|                     </tr> | 
|                 </table> | 
|             </div> | 
|         </div> | 
|   | 
|         <div class="form-group " style="padding-top: 10px"> | 
|             <div class="col-sm-12 text-center"> | 
|                 <a href="javascript:;" onclick="myForm.submit()" | 
|                    class="btn btn-success radius"><i class="fa fa-check"></i> 保存</a>     | 
|   | 
|                 <a href="javascript:;" onclick="print()" | 
|                    class="btn btn-success radius"><i class="fa fa-check"></i> 打印</a> | 
|   | 
|                 <a class="btn btn-danger radius" href="javascript:;" onclick="MTools.closeForm()"><i | 
|                         class="fa fa-close"></i> 关闭</a> | 
|             </div> | 
|         </div> | 
|     </form> | 
| </div> | 
| </div> | 
| </body> | 
| <script type="text/javascript" th:src="@{/js/systools/MJsBase.js}"></script> | 
| <script type="text/javascript" th:src="@{/pages/js/libs/vue.js}"></script> | 
|   | 
| <script type="text/javascript"> | 
|   | 
|   | 
|     function print() { | 
|         layer.full(layer.open({ | 
|             type: 2, | 
|             title: "打印订单", | 
|             maxmin: true, | 
|             content: [basePath + '/admin/shopOrder/printOrder?id=' + $("#orderId").val()] | 
|         })) | 
|     } | 
| </script> | 
|   | 
| <script th:inline="javascript"> | 
|     MTools.autoFullSelect(); | 
|     $(".select2").select2(); | 
|   | 
|     /*<![CDATA[*/ | 
|     var orderInfo = /*[[${orderInfo}]]*/ | 
|     /*]]>*/ | 
|   | 
|   | 
|     var invokeUrl = basePath + "/admin/shopOrder/addShopOrder"; | 
|     if (orderInfo.id != null) { | 
|         invokeUrl = basePath + "/admin/shopOrder/modifyShopOrder"; | 
|     } | 
|     var myForm = MForm.initForm({ | 
|         invokeUrl: invokeUrl, | 
|         afterSubmit: function () { | 
|             parent.myGrid.serchData(); | 
|         }, | 
|         beforeSubmit: function () { | 
|             var orderDetails= $("input[name='orderDetails']"); | 
|             var param={}; | 
|             orderDetails.each(function(i,node){ | 
|                 console.log(i); | 
|                 param['details['+i+'].id']=$(node).data("id"); | 
|                 param['details['+i+'].totalPrice']=$(node).val(); | 
|             }); | 
|             myForm.initParam.extendParam=param; | 
|             return true; | 
|   | 
|   | 
|   | 
|         } | 
|     }); | 
| </script> | 
| </body> | 
| </html> |