New file |
| | |
| | | <!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"/> |
| | | <LINK rel="Bookmark" href="../images/favicon.ico"> |
| | | <!-- 本框架基本脚本和样式 --> |
| | | <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> |
| | | <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> |
| | | |
| | | <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" 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}]]*/ |
| | | |
| | | 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() { |
| | | var id=$("#orderId").val(); |
| | | layer.open({ |
| | | type: 2, |
| | | title: "打印订单", |
| | | area: ['250px', '550px'], |
| | | maxmin: true, |
| | | content: [basePath + '/admin/redirect/hive/beautySalon/print-order?id=' + id] |
| | | }); |
| | | }; |
| | | |
| | | |
| | | </script> |
| | | </html> |