| | |
| | | <meta http-equiv="Cache-Control" content="no-siteapp"/> |
| | | <LINK rel="Bookmark" href="../images/favicon.ico"> |
| | | <!-- 本框架基本脚本和样式 --> |
| | | <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> |
| | | <script type="text/javascript" th:src="@{/js/systools/MBaseVue.js}"></script> |
| | | <script type="text/javascript" th:src="@{/js/plugin/jquery-2.1.4.min.js}"></script> |
| | | <script type="text/javascript" th:src="@{/plugin/moment.min.js}"></script> |
| | | <script type="text/javascript" th:src="@{/js/systools/MBase.js}"></script> |
| | | <script type="text/javascript" th:src="@{/js/function/vip.js}"></script> |
| | | <link rel="stylesheet" th:href="@{/plugin/element-ui/index.css}"> |
| | | |
| | | <script type="text/javascript" th:src="@{/js/function/vip.js}"></script> |
| | | <script type="text/javascript" th:src="@{/js/function/meiduCommon.js}"></script> |
| | | <title></title> |
| | | </head> |
| | | |
| | | <div class="panel-body"> |
| | | <div class="form-group"> |
| | | <label class="col-sm-2 control-label">订单号</label> |
| | | <div class="col-sm-4"> |
| | | <span class="form-control-static" th:text="${order.orderNo}"></span> |
| | | </div> |
| | | |
| | | <label class="col-sm-2 control-label">订单总价</label> |
| | | <div class="col-sm-4"> |
| | | <span class="form-control-static" id="total" th:text="${order.total}"></span> |
| | | </div> |
| | | </div> |
| | | <br> |
| | | <div class="form-group"> |
| | | <label class="col-sm-2 control-label">客户编号</label> |
| | | <div class="col-sm-4"> |
| | | <span class="form-control-static" th:text="${order.vipNo}"></span> |
| | | </div> |
| | | <label class="col-sm-2 control-label">客户姓名</label> |
| | | <div class="col-sm-4"> |
| | | <span class="form-control-static" th:text="${order.vipName}"></span> |
| | | </div> |
| | | </div> |
| | | <br> |
| | | <div class="form-group"> |
| | | <label class="col-sm-2 control-label">现金支付金额</label> |
| | | <div class="col-sm-4"> |
| | | <span class="form-control-static">[[${order.cashPay}]]</span> |
| | | </div> |
| | | <label class="col-sm-2 control-label">卡支付金额</label> |
| | | <div class="col-sm-4"> |
| | | <span class="form-control-static" id="total">[[${order.cardPay}]]</span> |
| | | </div> |
| | | </div> |
| | | <br> |
| | | <div class="form-group"> |
| | | <label class="col-sm-2 control-label">欠款</label> |
| | | <div class="col-sm-4"> |
| | | <span class="form-control-static">[[${order.arrears}]]</span> |
| | | </div> |
| | | <label class="col-sm-2 control-label">折后价</label> |
| | | <div class="col-sm-4"> |
| | | <span class="form-control-static" id="zkTotal" th:text="${order.zkTotal}"></span> |
| | | </div> |
| | | </div> |
| | | <br> |
| | | <div class="form-group"> |
| | | <label class="col-sm-2 control-label">顾问姓名</label> |
| | | <div class="col-sm-4"> |
| | | <span class="form-control-static" th:text="${order.staffName}"></span> |
| | | </div> |
| | | <label class="col-sm-2 control-label">备注</label> |
| | | <div class="col-sm-4"> |
| | | <span class="form-control-static" th:text="${order.remark}"></span> |
| | | </div> |
| | | </div> |
| | | |
| | | </div> |
| | | |
| | | |
| | | <div class="col-sm-12 form-group"> |
| | | <div class="panel-body"> |
| | | <table class="table table-striped table-condensed table-hover"> |
| | | <thead> |
| | | <tr> |
| | | <th>序号</th> |
| | | <th>商品名称</th> |
| | | <th>单价</th> |
| | | <th>购买数量</th> |
| | | <th>折扣单价</th> |
| | | <th>卡付款</th> |
| | | <th>现金付款</th> |
| | | <th>欠款</th> |
| | | </tr> |
| | | </thead> |
| | | <tbody id="tbody"> |
| | | <tr th:each="item,count:${order.items }"> |
| | | <td th:text="${count.index}+1"></td> |
| | | <td><span th:text=" ${item.shoppingGoods.name }"></span> |
| | | |
| | | <span th:if="${item.isFree eq '是' }" th:text="赠"></span> |
| | | </td> |
| | | <td th:text="${item.price }"></td> |
| | | <td th:text="${item.count}"></td> |
| | | <td th:text="${item.zkPrice}"></td> |
| | | <td>[[${item.cardPay}]]</td> |
| | | <td>[[${item.cashPay}]]</td> |
| | | <td>[[${item.arrears}]]</td> |
| | | </tr> |
| | | </tbody> |
| | | </table> |
| | | </div> |
| | | <div class="form-group "> |
| | | <div class="col-sm-12 text-center"> |
| | | <a href="javascript:;" onclick="print()" class="btn btn-success radius">打印</a> |
| | | <button onclick="MTools.closeForm()" class="btn btn-danger radius" type="button">取消</button> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | |
| | | </body> |
| | | |
| | | <form id="print" style="display: none;"> |
| | | <!-- <form id="print"> --> |
| | | <style midia="print"> |
| | | .table1 { |
| | | width: 500px; |
| | | font-size: 10px; |
| | | border-top: 1px solid #333; |
| | | margin-top: 40px; |
| | | } |
| | | |
| | | .table2 { |
| | | margin-bottom: 100px; |
| | | } |
| | | |
| | | .table1 td { |
| | | height: 20px; |
| | | } |
| | | |
| | | .table2 td { |
| | | height: 20px; |
| | | } |
| | | |
| | | .table1 tr { |
| | | height: 30px; |
| | | } |
| | | |
| | | .table3 { |
| | | position: absolute; |
| | | bottom: 20px; |
| | | } |
| | | |
| | | .tittl { |
| | | text-align: center; |
| | | font-size: 20px; |
| | | <style> |
| | | .ibox-content { |
| | | background-color: rgba(240, 242, 245, 1); |
| | | } |
| | | </style> |
| | | </head> |
| | | <div class="ibox-content" id="app"> |
| | | <el-container> |
| | | <el-header style="height: 210px; background-color: white; margin: 15px;"> |
| | | <el-row style="line-height: 60px; padding-top: 20px;"> |
| | | <el-col :span="1" style="font-size: 40px; color:#409EFF;"> |
| | | <i class="el-icon-s-order" type="primary"></i> |
| | | </el-col> |
| | | <el-col :span="10"> |
| | | <h1 style="line-height: 60px; margin: 0 0;">订单号:{{order.orderNo}}</h1> |
| | | </el-col> |
| | | <el-col :span="5" style="float: right; margin-right: 10px;"> |
| | | <el-button type="info" @click="printf">打印</el-button> |
| | | <el-button type="danger" @click="toBack">返回</el-button> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row class="order-info" type="flex" justify="space-around" style="height: 150px; padding: 30px 30px;"> |
| | | <el-col :span="5"> |
| | | <p>顾问姓名:{{order.staffName}}</p> |
| | | <p>会员姓名:{{order.vipName}}</p> |
| | | <p>会员编号:{{order.vipNo}}</p> |
| | | </el-col> |
| | | <el-col :span="5"> |
| | | <p>卡支付:{{order.cardPay}}</p> |
| | | <p>现金支付:{{order.cashPay}}</p> |
| | | <p>备注:{{order.remark}}</p> |
| | | </el-col> |
| | | <el-col :span="10"> |
| | | <el-col :span="6"> |
| | | <p>欠款总额</p> |
| | | <h2>¥ {{order.arrears}}</h2> |
| | | </el-col> |
| | | <el-col :span="6"> |
| | | <p>折后总额</p> |
| | | <h2>¥ {{order.zkTotal}}</h2> |
| | | </el-col> |
| | | <el-col :span="6"> |
| | | <p>订单总额</p> |
| | | <h2>¥ {{order.total}}</h2> |
| | | </el-col> |
| | | </el-col> |
| | | </el-row> |
| | | </el-header> |
| | | <el-main style="background-color: white; margin: 15px; padding: 20px 30px;"> |
| | | <el-tabs v-model="activeName" @tab-click="handleClick"> |
| | | <el-tab-pane label="商品" name="goods"> |
| | | <el-table :data="orderData" |
| | | style="width: 100%"> |
| | | <el-table-column |
| | | prop="shoppingGoods.name" |
| | | label="商品名称" |
| | | width="300"> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="price" |
| | | label="单价" |
| | | width="80"> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="count" |
| | | label="购买数量"> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="zkPrice" |
| | | label="折后金额"> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="cardPay" |
| | | label="卡付款"> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="cashPay" |
| | | label="现金付款"> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="arrears" |
| | | label="欠款"> |
| | | </el-table-column> |
| | | </el-table> |
| | | </el-tab-pane> |
| | | <el-tab-pane label="业绩" name="yj">业绩</el-tab-pane> |
| | | </el-tabs> |
| | | </el-main> |
| | | </el-container> |
| | | </div> |
| | | </body> |
| | | |
| | | <h1 class="tittl">HIVE收银单</h1> |
| | | <table class="table1"> |
| | | |
| | | |
| | | <tr> |
| | | <td>会员姓名:[[${order.vipName }]]</td> |
| | | <td>联系电话:[[${order.vipPhone }]]</td> |
| | | <td>打印日期:[[<span id="date">]]</span></td> |
| | | </tr> |
| | | <tr> |
| | | <td>会员编号:[[${order.vipNo}]]</td> |
| | | <td>健康顾问:[[${order.staffName}]]</td> |
| | | </tr> |
| | | <tr> |
| | | <td>订单编号:[[${order.orderNo}]]</td> |
| | | <td>收银人:[[${session.userInfo.suName}]]</td> |
| | | </tr> |
| | | </table> |
| | | <table class="table2 table1"> |
| | | <tr> |
| | | <td>套餐/项目/家居/充值卡</td> |
| | | <td>数量</td> |
| | | <td>单价</td> |
| | | <td>折后价</td> |
| | | <td>赠送</td> |
| | | </tr> |
| | | |
| | | <tr th:each="item,count:${orderItems }"> |
| | | <td> <span th:text=" ${item.shoppingGoods.name }"></span> |
| | | |
| | | <span th:if="${item.isFree eq '是' }" th:text="赠"></span> |
| | | </td> |
| | | <td th:text="${item.count}"></td> |
| | | <td th:text="${item.price }"></td> |
| | | <td th:text="${item.zkPrice}"></td> |
| | | |
| | | <td> |
| | | <span th:if="${item.shoppingGoods.goodType eq '充值卡' }"> |
| | | [[${item.shoppingGoods.referencePice }]] |
| | | </span> |
| | | </td> |
| | | </tr> |
| | | </table> |
| | | |
| | | <table class="table1 table3"> |
| | | <tr> |
| | | <td colspan="4">备注:</td> |
| | | </tr> |
| | | <tr> |
| | | <td>缴纳金额:[[${order.cashPay+order.cardPay}]]</td> |
| | | <td>现金:[[${order.cashPay}]]</td> |
| | | <td>划扣:[[${order.cardPay }]]</td> |
| | | <td>本次欠款:[[${order.arrears }]]</td> |
| | | </tr> |
| | | |
| | | </table> |
| | | </form> |
| | | <script type="text/javascript" th:src="@{/js/plugin/LodopFuncs.js}"></script> |
| | | <script type="text/javascript" th:src="@{/js/systools/AjaxProxyVue.js}"></script> |
| | | <script type="text/javascript" th:src="@{/js/plugin/vue.js}"></script> |
| | | <script type="text/javascript" th:src="@{/plugin/element-ui/index.js}"></script> |
| | | <script type="text/javascript" th:src="@{/js/systools/MJsBase.js}"></script> |
| | | <script type="text/javascript"> |
| | | <script type="text/javascript" th:inline="javascript"> |
| | | //<![CDATA[ |
| | | var app = new Vue({ |
| | | el : "#app", |
| | | data : { |
| | | activeName : "goods", |
| | | order : "", |
| | | orderItems : "", |
| | | cards : "", |
| | | orderData : [] |
| | | }, |
| | | created : function() { |
| | | this.order = /*[[${order}]]*/ |
| | | this.orderItems = /*[[${orderItems}]]*/ |
| | | this.cards = /*[[${cards}]]*/ |
| | | |
| | | var LODOP; |
| | | |
| | | this.orderData = this.order.items; |
| | | }, |
| | | methods : { |
| | | handleClick(tab, event) { |
| | | }, |
| | | printf() { |
| | | var id = 1; |
| | | layer.open({ |
| | | type: 2, |
| | | title: "打印服务单", |
| | | area: ['250px', '550px'], |
| | | maxmin: true, |
| | | content: [basePath + '/admin/redirect/hive/beautySalon/print-service?id=' + id] |
| | | }); |
| | | }, |
| | | toBack() { |
| | | MTools.closeForm(); |
| | | }, |
| | | } |
| | | }); |
| | | //]]> |
| | | function print() { |
| | | CreateOneFormPage(); |
| | | LODOP.PRINTA(); |
| | | } |
| | | |
| | | function CreateOneFormPage() { |
| | | $("#date").text(getNowFormatDate()); |
| | | |
| | | LODOP = getLodop(); |
| | | |
| | | LODOP.PRINT_INIT(""); |
| | | LODOP.SET_PRINT_STYLE("FontSize", 18); |
| | | LODOP.SET_PRINT_PAGESIZE(0, 1300, 1945, ""); |
| | | strCenterStyle = "<style/>table {width:100%}</style>"; |
| | | LODOP.ADD_PRINT_HTM(5, "9%", "82%", 600, strCenterStyle |
| | | + document.getElementById("print").innerHTML); |
| | | LODOP.SET_PRINT_STYLE("Bold", 1); |
| | | /* LODOP.ADD_PRINT_HTM(30,30,650,600,document.getElementById("print").innerHTML); */ |
| | | |
| | | var id=$("#orderId").val(); |
| | | layer.open({ |
| | | type: 2, |
| | | title: "打印订单", |
| | | area: ['250px', '550px'], |
| | | maxmin: true, |
| | | content: [basePath + '/admin/redirect/hive/beautySalon/print-order?id=' + id] |
| | | }); |
| | | }; |
| | | |
| | | //获取当前时间 |
| | | function getNowFormatDate() { |
| | | var date = new Date(); |
| | | var seperator1 = "-"; |
| | | var seperator2 = ":"; |
| | | var month = date.getMonth() + 1; |
| | | var strDate = date.getDate(); |
| | | if (month >= 1 && month <= 9) { |
| | | month = "0" + month; |
| | | } |
| | | if (strDate >= 0 && strDate <= 9) { |
| | | strDate = "0" + strDate; |
| | | } |
| | | var currentdate = date.getFullYear() + seperator1 + month + seperator1 |
| | | + strDate + " " + date.getHours() + seperator2 |
| | | + date.getMinutes() + seperator2 + date.getSeconds(); |
| | | return currentdate; |
| | | } |
| | | |
| | | </script> |
| | | </html> |