| <!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/systools/MBaseVue.js}"></script> | 
|     <link rel="stylesheet" th:href="@{/plugin/element-ui/index.css}"> | 
|     <link th:href="@{/css/styleOne/style.min.css}" rel="stylesheet" type="text/css"/> | 
|     <style> | 
|         .vertical { | 
|             display: flex; | 
|             align-items: center; | 
|         } | 
|   | 
|         .searchInput { | 
|             width: 400px; | 
|             margin-right: 20px; | 
|         } | 
|   | 
|         .bigbtn { | 
|             width: 200px; | 
|         } | 
|   | 
|         .btn-box { | 
|             text-align: right; | 
|         } | 
|   | 
|         .money-box { | 
|             display: flex; | 
|             justify-content: space-between; | 
|             align-items: center; | 
|             font-size: 18px; | 
|         } | 
|   | 
|         .money-box ul { | 
|             list-style: none; | 
|         } | 
|   | 
|         .money-box ul li { | 
|             line-height: 30px; | 
|         } | 
|   | 
|         .money-title { | 
|             font-weight: bold; | 
|         } | 
|   | 
|         .money-value { | 
|             font-weight: bold; | 
|             color: #ff3300; | 
|             font-size: 30px; | 
|         } | 
|   | 
|         .space { | 
|             padding: 20px; | 
|         } | 
|   | 
|         .yjxzbtn { | 
|             float: right; | 
|         } | 
|   | 
|         .vipSelect { | 
|             width: 400px; | 
|         } | 
|   | 
|         .title { | 
|             font-weight: bold; | 
|         } | 
|   | 
|         .arrears { | 
|             color: #E6A23C; | 
|         } | 
|   | 
|         .paymethod ul { | 
|             padding: 0; | 
|             margin: 0; | 
|             height: 50px; | 
|         } | 
|         .paymethod ul li { | 
|             padding: 10px; | 
|             margin: 5px; | 
|             list-style:none; | 
|             float: left; | 
|             display: block; | 
|             cursor: pointer; | 
|             position: relative; | 
|             border: white 1px solid; | 
|         } | 
|         .paymethod ul li:hover { | 
|             border: #409EFF 1px solid; | 
|         } | 
|         .paymethod .active { | 
|             border: #409EFF 1px solid; | 
|         } | 
|         .paymethod .active::after { | 
|              content: ''; | 
|              display: block; | 
|              height: 0px; | 
|              width: 0px; | 
|              position: absolute; | 
|              bottom: 0; | 
|              right: 0; | 
|              color:#fff; | 
|              /**对号大小*/ | 
|              font-size: 10px; | 
|              line-height: 8px; | 
|              border: 3px solid; | 
|              border-color: transparent #4884ff #4884ff transparent; | 
|          } | 
|   | 
|         .el-dialog__body { | 
|             padding-top: 10px !important; | 
|         } | 
|     </style> | 
| </head> | 
| <body> | 
| <div class="ibox-content" id="app" v-cloak> | 
|   | 
|   | 
|     <el-row> | 
|         <el-col :span="24"> | 
|             <el-row class="vertical  "> | 
|                 <el-col :span="24"> | 
|                     <!--  TODO 暂时不能切换会员 | 
|                      <span class="title">选择会员</span> | 
|                     <el-select | 
|                           class="vipSelect" | 
|                           v-model="order.vipId" | 
|                           @change="changeVip" | 
|                           filterable | 
|                           remote | 
|                           reserve-keyword | 
|                           placeholder="请输会员名称/手机号/编号搜索" | 
|                           :remote-method="remoteMethod" | 
|                           :loading="loading"> | 
|                       <el-option | 
|                               v-for="item in vipList" | 
|                               :key="item.id" | 
|                               :label="item.showLable" | 
|                               :value="item.id"> | 
|                       </el-option> | 
|                   </el-select> --> | 
|   | 
|                     <p class=" el-big-title"> 会员信息 <span v-if="currentVipInfo.id">【 编号:{{currentVipInfo.vipNo}} , 姓名:{{currentVipInfo.vipName}} , 手机号码:{{currentVipInfo.phone}} ,等级:<span | 
|                             v-if="currentVipInfo.vipLevel!=null">{{currentVipInfo.vipLevel.levelName}} </span> ,储值卡余额:{{currentVipInfo.balance}} 】</span> | 
|                     </p> | 
|                 </el-col> | 
|             </el-row> | 
|         </el-col> | 
|     </el-row> | 
|   | 
|     <el-row v-if="order.vipId!=null"> | 
|         <el-col :span="24"> | 
|             <el-row class="vertical  "> | 
|                 <el-col :span="6"><p>消费门店:{{order.shopName}} </p></el-col> | 
|                 <el-col :span="6"><p>订单编号:{{order.orderNo}}</p></el-col> | 
|                 <el-col :span="6"> | 
|                     <span> 订单时间:</span> | 
|                     <el-date-picker | 
|                             v-model="order.orderTime" | 
|                             type="datetime" | 
|                             placeholder="选择日期时间"> | 
|                     </el-date-picker> | 
|                 </el-col> | 
|                 <el-col :span="6"> | 
|                     <span> 备注:</span> | 
|                     <el-input style="width: 70%" | 
|                               v-model="order.remark"> | 
|                     </el-input> | 
|                 </el-col> | 
|             </el-row> | 
|             <el-row class="vertical  "> | 
|                 <el-input class="searchInput" @input="searchGoods()" v-model="queryKey" | 
|                           placeholder="搜索添加产品"></el-input> | 
|                 <el-button @click="searchGoods()" type="primary">搜索</el-button> | 
|             </el-row> | 
|   | 
|             <div class="searchResultTable" style="width: 50%" v-show="showSearchTable"> | 
|                 <!-- 搜索加载数据表格 --> | 
|                 <el-table | 
|                         ref="dataTable" | 
|                         v-loading="loading" | 
|                         element-loading-text="拼命加载中" | 
|                         element-loading-spinner="el-icon-loading" | 
|                         element-loading-background="rgba(0, 0, 0, 0.8)" | 
|                         @selection-change="handleSelectionChange" | 
|                         @row-click="handleClickTableRow" | 
|                         :max-height="400" | 
|                         :data="searchTableData" | 
|                         style="width: 100%"> | 
|                     <el-table-column | 
|                             type="selection" | 
|                             width="50"> | 
|                     </el-table-column> | 
|                     <el-table-column | 
|                             prop="code" | 
|                             label="产品编号" | 
|                             width="100"> | 
|                     </el-table-column> | 
|   | 
|                     <el-table-column | 
|                             prop="name" | 
|   | 
|                             label="产品名称"> | 
|                     </el-table-column> | 
|   | 
|                     <el-table-column | 
|                             prop="sealPice" | 
|                             label="售价"> | 
|                     </el-table-column> | 
|                     <el-table-column | 
|                             prop="goodType" | 
|                             label="类型"> | 
|                     </el-table-column> | 
|                     <el-table-column | 
|                             prop="cateName" | 
|                             label="分类"> | 
|                     </el-table-column> | 
|                     <el-table-column | 
|                             width="150" | 
|                             prop="address" | 
|                             label="操作"> | 
|                         <template slot-scope="scope"> | 
|                             <el-button type="primary" | 
|                                        size="mini" | 
|                                        @click="handleEdit(scope.$index, scope.row,1)">选择 | 
|                             </el-button> | 
|                             <el-button type="warning" v-if="scope.row.isPresent == '是'" | 
|                                        size="mini" | 
|                                        @click="handleEdit(scope.$index, scope.row,2)">赠送 | 
|                             </el-button> | 
|                         </template> | 
|                     </el-table-column> | 
|                 </el-table> | 
|                 <el-row class="btn-box"> | 
|                     <el-button size="mini" type="danger" @click="closeXm()">关闭</el-button> | 
|                     <el-button size="mini" type="primary" @click="chouseGoods()">确认</el-button> | 
|                 </el-row> | 
|             </div> | 
|   | 
|             <el-row class="mt-10"> | 
|                 <el-table | 
|                         :stripe="true" | 
|                         :border="true" | 
|                         :height="tableHeight" | 
|                         :data="order.items" | 
|                         style="width: 100%"> | 
|                     <el-table-column | 
|                             type="index" | 
|                             width="50"> | 
|                     </el-table-column> | 
|                     <el-table-column | 
|                             prop="shoppingGoods.code" | 
|                             label="产品编号" | 
|                             width="100"> | 
|                     </el-table-column> | 
|   | 
|                     <el-table-column | 
|                             prop="shoppingGoods.name" | 
|                             width="280" | 
|                             label="产品名称"> | 
|                     </el-table-column> | 
|                     <el-table-column | 
|                             prop="shoppingGoods.goodType" | 
|                             width="80" | 
|                             label="产品类型"> | 
|                     </el-table-column> | 
|                     <el-table-column | 
|                             prop="shoppingGoods.sealPice" | 
|                             label="单价"> | 
|                     </el-table-column> | 
|                     <el-table-column label="数量"> | 
|   | 
|                         <template slot-scope="scope"> | 
|                             <el-input @change="calculationTotal" v-model="scope.row.count"></el-input> | 
|                         </template> | 
|   | 
|                     </el-table-column> | 
|                     <el-table-column | 
|                             label="折扣单价"> | 
|                         <template slot-scope="scope"> | 
|                             <el-input @change="calculationTotal" v-model="scope.row.zkPrice"></el-input> | 
|                         </template> | 
|                     </el-table-column> | 
|                     <el-table-column | 
|                             label="小计"> | 
|                         <template slot-scope="scope"> | 
|                             {{scope.row.zkPrice * scope.row.count }} | 
|                         </template> | 
|                     </el-table-column> | 
|   | 
| <!--                    <el-table-column--> | 
| <!--                            label="实付">--> | 
| <!--                        <template slot-scope="scope">--> | 
| <!--                            <el-input @change="calculationTotal(1)" v-model="scope.row.payMoney"></el-input>--> | 
| <!--                        </template>--> | 
| <!--                    </el-table-column>--> | 
|   | 
| <!--                    <el-table-column--> | 
| <!--                            label="支付方式"--> | 
| <!--                            width="130">--> | 
| <!--                        <template slot-scope="scope">--> | 
| <!--                            <el-select @change="changePayMethod(scope.row)" v-model="scope.row.payMethod"--> | 
| <!--                                       placeholder="请选择支付方式">--> | 
| <!--                                <el-option--> | 
| <!--                                        v-for="item in payMethods"--> | 
| <!--                                        :key="item.value"--> | 
| <!--                                        :label="item.label"--> | 
| <!--                                        :value="item.value"--> | 
| <!--                                        :disabled="item.disabled">--> | 
| <!--                                </el-option>--> | 
| <!--                            </el-select>--> | 
| <!--                        </template>--> | 
| <!--                    </el-table-column>--> | 
|   | 
|   | 
| <!--                    <el-table-column--> | 
| <!--                            label="储值卡">--> | 
| <!--                        <template slot-scope="scope">--> | 
| <!--                            <el-select :disabled="scope.row.payMethod!='储值卡'" v-model="scope.row.payMethodDetail"--> | 
| <!--                                       placeholder="请选择支付卡">--> | 
| <!--                                <el-option--> | 
| <!--                                        v-for="item in moneyCards"--> | 
| <!--                                        :key="item.id"--> | 
| <!--                                        :label="item.showLable"--> | 
| <!--                                        :value="item.id">--> | 
| <!--                                </el-option>--> | 
| <!--                            </el-select>--> | 
| <!--                        </template>--> | 
| <!--                    </el-table-column>--> | 
|                     <el-table-column | 
|                             prop="address" | 
|                             label="操作"> | 
|                         <template slot-scope="scope"> | 
|                             <el-button type="primary" v-if="order.statu!='欠款'" | 
|                                        size="mini" | 
|                                        @click="removeItem(scope.$index, scope.row)">删除 | 
|                             </el-button> | 
|                         </template> | 
|                     </el-table-column> | 
|                 </el-table> | 
|   | 
|             </el-row> | 
|             <el-row class="mt-20 vertical"> | 
|                 <el-col :span="10" class="money-box"> | 
|                     <div> | 
|                         <ul> | 
|                             <li>应收金额:{{order.zkTotal}}</li> | 
|   | 
|                             <li>订单总金额:{{order.total}}</li> | 
|   | 
|                             <li>整单折扣:<span class="arrears" v-if="order.zkTotal != null">{{order.total - order.zkTotal}}</span></li> | 
| <!--                            <li v-if="order.arrears>0">订单欠款:<span class="arrears">{{order.arrears}}</span></li>--> | 
| <!--                            <li v-if="order.arrears<0">找零:<span class="arrears">{{order.arrears}}</span></li>--> | 
|                         </ul> | 
|                     </div> | 
|                     <div class="money"> | 
|                         <span class="money-title">实收:</span> | 
|                         <span class="money-value">¥{{order.payMoney}}</span> | 
|                     </div> | 
|                 </el-col> | 
|                 <el-col :span="14" class="btn-box"> | 
|                     <el-button type="danger" @click="closeFram()">取消</el-button> | 
|                     <el-button type="primary" @click="submitOrder(2)">挂单</el-button> | 
|                     <el-button type="primary" @click="print()">打印</el-button> | 
|                     <el-button type="primary" @click="drawer = true">业绩设置</el-button> | 
|                     <!--                    <el-button type="success" @click="confirmSubmit()" class="bigbtn"> 结算</el-button>--> | 
|                     <el-button type="success" @click="openPayMoney" class="bigbtn">收款 ¥{{order.payMoney}}</el-button> | 
|                 </el-col> | 
|             </el-row> | 
|   | 
|         </el-col> | 
|     </el-row> | 
|   | 
|   | 
|     <el-drawer | 
|             title="业绩设置" | 
|             :visible.sync="drawer" | 
|             :direction="direction" | 
|             size="50%" | 
|     > | 
|         <el-row> | 
|             <el-col :span="24"> | 
|                 <div class="space"> | 
|   | 
|                     <el-table class="mt-20" | 
|                               :stripe="true" | 
|                               :border="true" | 
|                               :height="600" | 
|                               :data="achieveList" | 
|                               style="width: 100%"> | 
|                         <el-table-column | 
|                                 type="index" | 
|                                 width="50"> | 
|                         </el-table-column> | 
|                         <el-table-column | 
|                                 prop="orderItem.shoppingGoods.code" | 
|                                 label="产品编号" | 
|                                 width="100"> | 
|                         </el-table-column> | 
|   | 
|                         <el-table-column | 
|                                 prop="orderItem.shoppingGoods.name" | 
|                                 width="280" | 
|                                 label="产品名称"> | 
|                         </el-table-column> | 
|   | 
|                         <el-table-column | 
|                                 prop="orderItem.payMoney" | 
|                                 label="收款"> | 
|                         </el-table-column> | 
|   | 
|                         <el-table-column | 
|                                 label="业绩类型" width="150"> | 
|                             <template slot-scope="scope"> | 
|                                 <el-select v-model="scope.row.t3" placeholder="请选择业绩类型"> | 
|                                     <el-option | 
|                                             v-for="item in achieveTypeList" | 
|                                             :key="item.key" | 
|                                             :label="item.value" | 
|                                             :value="item.key"> | 
|                                     </el-option> | 
|                                 </el-select> | 
|                             </template> | 
|                         </el-table-column> | 
|                         <el-table-column | 
|                                 label="业绩" width="100"> | 
|                             <template slot-scope="scope"> | 
|                                 <el-input v-model="scope.row.achieveMoney"></el-input> | 
|                             </template> | 
|                         </el-table-column> | 
|                         <el-table-column | 
|                                 label="提成"> | 
|                             <template slot-scope="scope"> | 
|                                 <el-input v-model="scope.row.commission"></el-input> | 
|                             </template> | 
|                         </el-table-column> | 
|                         <el-table-column | 
|                                 label="员工" width="130"> | 
|                             <template slot-scope="scope"> | 
|                                 <el-select v-model="scope.row.saleId" placeholder="请选择员工"> | 
|                                     <el-option | 
|                                             v-for="item in userList" | 
|                                             :key="item.suId" | 
|                                             :label="item.suName" | 
|                                             :value="item.suId"> | 
|                                     </el-option> | 
|                                 </el-select> | 
|                             </template> | 
|                         </el-table-column> | 
|                         <el-table-column | 
|                                 width="150" | 
|                                 label="操作"> | 
|                             <template slot-scope="scope"> | 
|                                 <el-button type="primary" v-if="scope.row.isShare" | 
|                                            size="mini" | 
|                                            @click="delAchieve(scope.$index, scope.row)">删除 | 
|                                 </el-button> | 
|                                 <el-tooltip content="分享业绩" placement="top"> | 
|                                     <el-button @click="shareAchieve(scope.$index, scope.row)" icon="el-icon-share" | 
|                                                size="mini" type="primary"></el-button> | 
|                                 </el-tooltip> | 
|                             </template> | 
|                         </el-table-column> | 
|                     </el-table> | 
|                 </div> | 
|   | 
|             </el-col> | 
|         </el-row> | 
|     </el-drawer> | 
|   | 
|     <el-dialog title="收款" :visible.sync="dialogSettleVisible"> | 
|         <el-row type="flex" align="middle" style="padding: 0 0 10px 0;"> | 
|             <el-col :span="5" style="text-align: center;">应收</el-col> | 
|             <el-col :span="10" style="text-align: center; line-height: 50px;"><span style="color: red; font-size: 20px;">¥ {{order.payMoney}}</span></el-col> | 
|         </el-row> | 
|   | 
|         <el-row type="flex" align="middle" style="padding: 10px 0;"> | 
|             <el-col :span="5" style="text-align: center;">收款方式</el-col> | 
|             <el-col class="paymethod" :span="18"> | 
|                 <el-row> | 
|                     <ul> | 
|                         <span v-for="(item, index) in payMethods"> | 
|                             <el-popover | 
|                                     :disabled="item.type != '储值卡'" | 
|                                     placement="bottom" | 
|                                     trigger="hover" | 
|                                     @hide="popoverHide(item)"> | 
|                                 <el-row style="text-align: center;"><span style="padding: 0 0 10px 0; display: block; font-size: 12px;">选择储值卡支付方式</span></el-row> | 
|                                 <el-tree :data="moneyCards" | 
|                                         show-checkbox | 
|                                         default-expand-all | 
|                                         node-key="id" | 
|                                         ref="tree" | 
|                                          check-strictly | 
|                                          highlight-current | 
|                                          @check="(click, checked,$item)=>{handleCheckChange(click, checked,$item)}" | 
|                                          :props="defaultProps"> | 
|                                 </el-tree> | 
|                                 <li :class="{active : item.isActive}" slot="reference" @click="payMethodSelect(item, index)"><div style=" height:30px; line-height: 30px; display: flex; align-items: center"><img style="width: 25px; height: 25px; align-items: center;" :src="item.img"><span style="margin-left: 5px;">{{item.value}}</span></div></li> | 
|                             </el-popover> | 
|                         </span> | 
|                     </ul> | 
|                 </el-row> | 
|             </el-col> | 
|         </el-row> | 
|   | 
|         <el-row type="flex" align="middle" style="padding: 10px 0 50px 0;"> | 
|             <el-col :span="5" style="text-align: center;">支付金额</el-col> | 
|             <el-col :span="15"> | 
|                 <el-row style="line-height: 50px;" v-for="(item, index) in payMoneys"> | 
|                     <el-col :span="6" style="text-align: right; padding-right: 10px; font-size: 12px;">{{item.value}}</el-col> | 
|                     <el-col :span="8"><el-input v-model="item.money"></el-input></el-col> | 
|                     <el-col :span="6" style="margin-left: 10px;" v-if="item.type == '储值卡'">{{item.isGift == 1 ? '赠送余额' : '余额' }}:<span class="arrears">¥ {{item.balance}}</span></el-col> | 
|                 </el-row> | 
|             </el-col> | 
|         </el-row> | 
|   | 
|         <el-row style="text-align: center; margin: 20px 0 10px 0"> | 
|             <el-checkbox v-model="printPaper">打印小票</el-checkbox> | 
|         </el-row> | 
|   | 
|         <el-row style="text-align: center; margin: 10px 0 0 0"> | 
|             <el-button type="primary" @click="confirmSubmit">确认收款</el-button> | 
|         </el-row> | 
|     </el-dialog> | 
|   | 
| </div> | 
| </body> | 
| <script type="text/javascript" th:src="@{/js/plugin/jquery-2.1.4.min.js}"></script> | 
| <script type="text/javascript" th:src="@{/js/plugin/jquery.query.js}"></script> | 
| <script type="text/javascript" th:src="@{/plugin/layer/layer.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> | 
|   | 
|     var id = $.query.get("id"); | 
|     var vipId = $.query.get("vipId"); | 
|   | 
|     const BUY_TYPE_NOT_FREE = 1; | 
|     const BUY_TYPE_FREE = 2; | 
|   | 
|   | 
|     var app = new Vue({ | 
|         el: '#app', | 
|         data: { | 
|   | 
|             //业绩设置框 | 
|             drawer: false, | 
|             direction: 'rtl', | 
|             //当前登录用户 | 
|             loginUser: {}, | 
|             //业绩用户列表 | 
|             userList: [], | 
|             order: { | 
|                 orderTime: new Date(), | 
|                 items: [], | 
|                 shopName: '', | 
|                 total: 0, | 
|                 zkPrice: 0, | 
|                 payMoney: 0, | 
|                 orderNo: "", | 
|             }, | 
|             vipCardDisAble: true, | 
|             vipList: [], | 
|             currentVipInfo: {}, | 
|             vipLoading: false, | 
|             payMethods: [{ | 
|                 value: '现金支付', | 
|                 img: '/images/pay/cash.png', | 
|                 isActive: false, | 
|                 type: '现金支付' | 
|             }, { | 
|                 value: '微信', | 
|                 img: '/images/pay/wechat.png', | 
|                 isActive: false, | 
|                 type: '微信' | 
|             }, { | 
|                 value: '支付宝', | 
|                 img: '/images/pay/zhifubao.png', | 
|                 isActive: false, | 
|                 type: '支付宝' | 
|             }, { | 
|                 value: '银行卡', | 
|                 img: '/images/pay/yinlian.png', | 
|                 isActive: false, | 
|                 type: '银行卡' | 
|             }, { | 
|                 value: '团购', | 
|                 img: '/images/pay/tuan.png', | 
|                 isActive: false, | 
|                 type: '团购' | 
|             }, { | 
|                 value: '储值卡', | 
|                 img: '/images/pay/card.png', | 
|                 isActive: false, | 
|                 type: '储值卡' | 
|             },{ | 
|                 value: '欠款', | 
|                 img: '/images/pay/qian.png', | 
|                 isActive: false, | 
|                 type: '欠款' | 
|             },], | 
|             achieveList: [], | 
|             achieveTypeList : [ | 
|                 { | 
|                     "key" : "现金业绩", | 
|                     "value" : "现金业绩" | 
|                 },{ | 
|                     "key" : "划扣业绩", | 
|                     "value" : "划扣业绩" | 
|                 }, | 
|             ], | 
|             //会员可用的充值卡 | 
|             moneyCards: [], | 
|             //门店信息 | 
|             shopInfo: {}, | 
|   | 
|   | 
|             tableHeight: 500, | 
|   | 
|             /*****搜索表格数据*********/ | 
|             //搜索关键词 | 
|             queryKey: '', | 
|             //是否展示搜索表格 | 
|             showSearchTable: false, | 
|             //搜索表格数据 | 
|             searchTableData: [], | 
|             //表格加载效果 | 
|             loading: false, | 
|             /******搜索表格数据END********/ | 
|   | 
|             dialogSettleVisible : false, | 
|             defaultProps: { | 
|                 children: 'children', | 
|                 label: 'showLable' | 
|             }, | 
|             treeSelect : [], | 
|             payMoneys : [], | 
|             printPaper : true, | 
|   | 
|         }, | 
|   | 
|         /** | 
|          * 初始化数据表 | 
|          */ | 
|         created: function () { | 
|             let _this = this; | 
|   | 
|             //获取登录用户信息 | 
|             AjaxProxy.requst({ | 
|                 app: _this, | 
|                 url: basePath + '/admin/getLoginUser', | 
|                 callback: function (data) { | 
|                     _this.loginUser = data.mapInfo.user; | 
|   | 
|                     if (id) { | 
|                         //加载订单信息 | 
|                         AjaxProxy.requst({ | 
|                             app: _this, | 
|                             url: basePath + '/admin/order/findOrderById/' + id, | 
|                             callback: function (data) { | 
|                                 _this.order = data.rows[0]; | 
|                                 //修改支付金额 | 
|                                 _this.changeVip(_this.order.vipId); | 
|                                 let items = _this.order.items; | 
|                                 let orderPayMoney = 0; | 
|                                 //设置欠款订单设置欠款金额等于支付金额,非欠款订单设置折扣金额等于支付金额 | 
|                                 items.forEach(item => { | 
|                                     if (item.arrears > 0) { | 
|                                         item.payMoney = item.arrears; | 
|                                     } else { | 
|                                         item.payMoney = item.zkPrice; | 
|                                     } | 
|                                     orderPayMoney += item.payMoney; | 
|                                     item.uuid = MTools.uuid(); | 
|                                     //业绩设置 | 
|                                     _this.achieveList.push({ | 
|                                         orderItem: item, | 
|                                         staff: _this.loginUser, | 
|                                         saleId: _this.loginUser.suId, | 
|                                         achieveMoney: item.payMoney, | 
|                                         commission : 0, | 
|                                         t3 : '现金业绩', | 
|                                         isShare: false, | 
|                                     }); | 
|                                 }); | 
|                                 _this.order.payMoney = orderPayMoney; | 
|                             } | 
|                         }); | 
|   | 
|                     } else { | 
|                         //获取门店信息 | 
|                         AjaxProxy.requst({ | 
|                             app: _this, | 
|                             url: basePath + '/admin/shopInfo/findUserShop', | 
|                             callback: function (data) { | 
|                                 _this.order.shopName = data.rows[0].shopName; | 
|   | 
|                             } | 
|                         }); | 
|                     } | 
|   | 
|   | 
|                 } | 
|             }); | 
|   | 
|             if (vipId) { | 
|                 _this.changeVip(vipId); | 
|             } | 
|             //获取用户列表 | 
|             AjaxProxy.requst({ | 
|                 app: _this, | 
|                 url: basePath + '/admin/shopAll', | 
|                 callback: function (data) { | 
|                     _this.userList = data.rows; | 
|                 } | 
|             }); | 
|   | 
|         }, | 
|   | 
|         methods: { | 
|   | 
|             //取消订单 | 
|             closeFram() { | 
|                 parent.layer.close(parent.layer.getFrameIndex(window.name)); | 
|             }, | 
|   | 
|             changePayMethod(item) { | 
|                 console.log("changePayMethod", item); | 
|                 if (item.payMethod != '储值卡') { | 
|                     item.payMethodDetail = ''; | 
|                 } | 
|             }, | 
|   | 
|             getVipMoneyCards() { | 
|                 let _this = this; | 
|                 if (_this.currentVipInfo.id) { | 
|                     AjaxProxy.requst({ | 
|                         app: _this, | 
|                         data: {vipId: _this.currentVipInfo.id}, | 
|                         contentType: 'application/x-www-form-urlencoded', | 
|                         url: basePath + '/admin/moneyCardUse/getUseMoneyCard', | 
|                         callback: function (data) { | 
|                             if (data.rows.length > 0) { | 
|                                 data.rows.forEach(function (item, index, input) { | 
|                                     item.showLable = item.cardName + "-余额:" + (item.realMoney) | 
|                                     item.uuid = MTools.uuid(); | 
|                                     if (item.giftMoney != 0) { | 
|                                         var children = []; | 
|                                         var gift = {}; | 
|                                         gift.id = item.id; | 
|                                         gift.giftMoney = item.giftMoney; | 
|                                         gift.showLable = item.cardName + '-赠送金额' + item.giftMoney; | 
|                                         gift.cardName = item.cardName; | 
|                                         gift.isGift = 1; | 
|                                         gift.uuid = MTools.uuid(); | 
|                                         children.push(gift); | 
|                                         item.children = children; | 
|                                     } | 
|                                 }); | 
|                                 console.log(data.rows) | 
|                                 _this.moneyCards = data.rows; | 
|                             } | 
|   | 
|                         } | 
|                     }); | 
|                 } | 
|             }, | 
|   | 
|             //选择产品 | 
|             handleEdit(index, row, type) { | 
|   | 
|                 this.pushToSelectGoods(row, type); | 
|                 this.calculationTotal(); | 
|             }, | 
|             /** | 
|              * 把选中的产品加入到已存在的列表中 | 
|              * @param{type} 1 = 购买 2=赠送 | 
|              * */ | 
|             pushToSelectGoods(goods, type) { | 
|   | 
|                 //判断是否被选中 | 
|                 let selected = false; | 
|                 this.order.items.forEach(item => { | 
|                     if (item.shoppingGoods.id == goods.id) { | 
|                         selected = true; | 
|                         //购买数量+1 | 
|                         item.count++; | 
|                         return; | 
|                     } | 
|                 }); | 
|                 if (!selected) { | 
|                     //未选中产品加入列表 | 
|                     let item = {}; | 
|   | 
|                     item.uuid = MTools.uuid(); | 
|                     item.achieveList = []; | 
|                     item.shoppingGoods = goods; | 
|                     item.price = goods.sealPice; | 
|                     item.goodsId = goods.id; | 
|                     item.isFree = '否'; | 
|                     item.payMethod = '现金'; | 
|                     if (type == BUY_TYPE_NOT_FREE) { | 
|                         //购买 | 
|                         item.zkPrice = goods.sealPice; | 
|                         item.payMoney = goods.sealPice; | 
|                     } else if (type == BUY_TYPE_FREE) { | 
|                         //赠送 | 
|                         item.zkPrice = 0; | 
|                         item.payMoney = 0; | 
|                         item.isFree = '是'; | 
|                     } | 
|                     item.count = 1; | 
|   | 
|   | 
|                     //加入业绩 | 
|                     this.achieveList.push({ | 
|                         orderItem: item, | 
|                         staff: this.loginUser, | 
|                         saleId: this.loginUser.suId, | 
|                         achieveMoney: item.payMoney, | 
|                         t3 : '现金业绩', | 
|                         commission : 0, | 
|                         isShare: false, | 
|                     }); | 
|                     this.order.items.push(item); | 
|                 } | 
|   | 
|             }, | 
|   | 
|             /** | 
|              * 点击多选 | 
|              */ | 
|             handleSelectionChange(val) { | 
|                 this.multipleSelection = val; | 
|             }, | 
|   | 
|             /** | 
|              * 计算订单总价 | 
|              */ | 
|             calculationTotal(optionType) { | 
|                 let _this = this; | 
|                 if (_this.checkSubmitOrder()) { | 
|                     _this.order.arrears = 0; | 
|                     _this.order.payMoney = 0; | 
|                     //后台计算订单金额和折扣金额 | 
|                     AjaxProxy.requst({ | 
|                         app: _this, | 
|                         data: _this.order, | 
|                         url: basePath + "/admin/order/calculationOrder", | 
|                         callback: function (data) { | 
|                             let order = data.rows[0]; | 
|                             console.log("order", order); | 
|                             _this.order.zkTotal = order.zkTotal; | 
|                             _this.order.total = order.total; | 
|   | 
|                             //支付金额计算 | 
|                             _this.order.items.forEach(item => { | 
|                                 let count = parseFloat(item.count); | 
|                                 let zkPrice = parseFloat(item.zkPrice); | 
|   | 
|                                 if (optionType != 1) { | 
|                                     //直接修改支付金额不重置支付金额 | 
|                                     item.payMoney = zkPrice * count; | 
|                                 } | 
|                                 _this.order.payMoney += parseFloat(item.payMoney); | 
|                             }); | 
|                             //计算欠款 | 
|                             // _this.order.arrears = _this.order.zkTotal - _this.order.payMoney; | 
|                             // if (_this.order.arrears < 0) { | 
|                             //     _this.$message.error("支付金额不能大于应收金额"); | 
|                             // } | 
|                         } | 
|                     }) | 
|                 } | 
|                 ; | 
|   | 
|   | 
|             }, | 
|   | 
|             confirmSubmit(){ | 
|                 let _this=this; | 
|                 //结算打印提示 | 
|                 _this.$confirm('请确认结算该订单吗?', '提示', { | 
|                     confirmButtonText: '确认', | 
|                     cancelButtonText: '取消', | 
|                     type: 'warning' | 
|                 }).then(() => { | 
|                     _this.submitOrder(1); | 
|                 }).catch(() => { | 
|   | 
|                 }); | 
|             }, | 
|   | 
|   | 
|   | 
|             /** | 
|              * 提交表单订单 | 
|              * submitType 1 提交,2保存 | 
|              */ | 
|             submitOrder(submitType) { | 
|   | 
|                 if (this.checkSubmitOrder()) { | 
|                     let _this = this; | 
|   | 
|                     if(submitType == 1) { | 
|                         if (_this.payMoneys.length > 0) { | 
|                             let flows = [] | 
|                             var total = 0; | 
|                             _this.payMoneys.forEach(item => { | 
|                                 let flow = {}; | 
|                                 flow.payMethod = item.type; | 
|                                 if (!item.money) { | 
|                                     this.$message.warning("请输入" + item.type + "的付款金额"); | 
|                                     return false; | 
|                                 } | 
|                                 flow.amount = parseFloat(item.money); | 
|                                 if (item.type == '储值卡'){ | 
|                                     flow.isGift = item.isGift; | 
|                                     flow.cardId = item.id; | 
|                                 } | 
|                                 total += parseFloat(item.money); | 
|                                 flows.push(flow) | 
|                             }) | 
|                             if (total != _this.order.payMoney) { | 
|                                 this.$message.warning("输入付款总金额与应付金额不符"); | 
|                                 return false; | 
|                             } | 
|                             _this.order.flows = flows; | 
|                         } else { | 
|                             this.$message.warning("请选择支付方式"); | 
|                             return false; | 
|                         } | 
|                     } | 
|   | 
|                     //匹配业绩 | 
|                     _this.achieveList.forEach(achieve => { | 
|                         for (let i = 0; i < _this.order.items.length; i++) { | 
|                             let item = _this.order.items[i]; | 
|                             if (!item.achaeveList){ | 
|                                 item.achaeveList = []; | 
|                             } | 
|                             if (item.uuid == achieve.orderItem.uuid) { | 
|                                 let achieveNew = { | 
|                                     uuid:item.uuid, | 
|                                     beaultId: achieve.saleId, | 
|                                     t1: achieve.achieveMoney, | 
|                                     t3: achieve.t3, | 
|                                     projPercentage: achieve.commission, | 
|                                 }; | 
|   | 
|                                 var flag = true; | 
|                                 for(var j = 0; j < item.achaeveList.length; j++) { | 
|                                     if(item.achaeveList[j].uuid == achieveNew.uuid && item.achaeveList[j].beaultId == achieveNew.beaultId) { | 
|                                         flag = false; | 
|                                         break; | 
|                                     } | 
|                                 } | 
|   | 
|                                 if (flag) { | 
|                                     item.achaeveList.push(achieveNew); | 
|                                 } | 
|                                 break; | 
|                             } | 
|                         } | 
|                     }) | 
|   | 
|                     console.log(_this.order); | 
|                     //校验业绩金额 | 
|                     if (_this.checkAchieve()) { | 
|                         let url = basePath + "/admin/order/payOrder"; | 
|                         if (submitType == 2) { | 
|                             url = basePath + "/admin/order/saveOrder"; | 
|                         } | 
|   | 
|                         AjaxProxy.requst({ | 
|                             app: _this, | 
|                             data: _this.order, | 
|                             url: url, | 
|                             callback: function (data) { | 
|                                 let order = data.rows[0]; | 
|                                 _this.order.id = order.id; | 
|                                 _this.order.orderNo = order.orderNo; | 
|                                 //结算打印提示 | 
|                                 if (submitType == 1) { | 
|                                     if (_this.printPaper) { | 
|                                         _this.print(); | 
|                                     } | 
|                                     // _this.closeFram(); | 
|                                     // _this.$confirm('结算成功,是否立刻打印小票?', '提示', { | 
|                                     //     confirmButtonText: '打印', | 
|                                     //     cancelButtonText: '取消', | 
|                                     //     type: 'warning' | 
|                                     // }).then(() => { | 
|                                     //     _this.print(); | 
|                                     // | 
|                                     // }).catch(() => { | 
|                                     //     _this.closeFram(); | 
|                                     // }); | 
|                                 } else { | 
|                                     _this.$message.success(data.info); | 
|                                 } | 
|                                 if(parent.myGrid) { | 
|                                     parent.myGrid.serchData(); | 
|                                 } | 
|   | 
|                                 if (parent.app) { | 
|                                     parent.app.orderQuery(); | 
|                                 } | 
|                             } | 
|                         }); | 
|                     } | 
|   | 
|   | 
|                 } | 
|             }, | 
|             /** | 
|              * 校验订单业绩设置是否合理 | 
|              */ | 
|             checkAchieve() { | 
|                /* | 
|                //TODO 前端展示不检测,因为考虑到储值卡支付问题 | 
|                let _this = this; | 
|                 for (let i = 0; i < _this.order.items.length; i++) { | 
|                     if (_this.achieveList.length > 0) { | 
|                         let item = _this.order.items[i]; | 
|                         let sum = 0; | 
|                         item.achieveList.forEach(achieve => { | 
|                             console.log(sum, achieve); | 
|                             sum += parseFloat(achieve.t1); | 
|                         }); | 
|                         if (sum > item.payMoney) { | 
|                             this.$message.warning("业绩金额不能大于支付金额【" + item.shoppingGoods.name + "】"); | 
|                             return false; | 
|                         } | 
|                     } | 
|                 }*/ | 
|                 return true; | 
|             }, | 
|   | 
|             /** | 
|              * 检查订单是否能够提交 | 
|              */ | 
|             checkSubmitOrder() { | 
|                 let order = this.order; | 
|                 if (!order.vipId) { | 
|                     this.$message.warning("请选择会员"); | 
|                     return false; | 
|                 } | 
|                 if (order.items.length > 0) { | 
|                     order.items.forEach(item => | 
|                     { | 
|                         if (!(MTools.isRealNum(item.count) && item.count > 0)) { | 
|                             this.$message.warning("数量填写不正确"); | 
|                             return false; | 
|                         } | 
|                         if (!(MTools.isRealNum(item.zkPrice) && item.zkPrice >= 0)) { | 
|                             this.$message.warning("折扣单价填写不正确"); | 
|                             return false; | 
|                         } | 
|                         // if (!(MTools.isRealNum(item.payMoney) && item.payMoney >= 0)) { | 
|                         //     this.$message.warning("实付金额填写不正确"); | 
|                         //     return false; | 
|                         // } | 
|                     }) | 
|                 } else { | 
|                     this.$message.warning("请选择要购买的产品"); | 
|                     return false; | 
|                 } | 
|                 return true; | 
|             }, | 
|   | 
|   | 
|             /** | 
|              * 批量选择产品 | 
|              */ | 
|             chouseGoods() { | 
|                 let _this = this; | 
|                 // this.multipleSelection.forEach(item => { | 
|                 //     _this.pushToSelectGoods(item, BUY_TYPE_NOT_FREE); | 
|                 // }); | 
|                 this.closeXm(); | 
|                 this.calculationTotal(); | 
|             }, | 
|             /** | 
|              * 行点击事件 | 
|              */ | 
|             handleClickTableRow(row, event, column) { | 
|                 this.$refs.dataTable.toggleRowSelection(row); | 
|             }, | 
|             /** | 
|              * 删除组合产品 | 
|              */ | 
|             removeItem(index, row) { | 
|                 this.order.items.splice(index, 1); | 
|                 //删除业绩 | 
|                 let achieveListNew = []; | 
|                 this.achieveList.forEach(achieve => { | 
|                     if (achieve.orderItem.uuid != row.uuid) { | 
|                         achieveListNew.push(achieve); | 
|                     } | 
|                 }); | 
|                 this.achieveList = achieveListNew; | 
|                 this.order.zkTotal = 0; | 
|                 this.order.total = 0; | 
|                 this.order.payMoney = 0; | 
|                 this.calculationTotal(); | 
|             }, | 
|   | 
|   | 
|             /** | 
|              * 搜索项目绑定的产品信息 | 
|              */ | 
|             searchGoods() { | 
|                 let _this = this; | 
|                 if (this.queryKey && this.queryKey.trim().length > 0) { | 
|                     this.showSearchTable = true; | 
|                     this.loading = true; | 
|                     AjaxProxy.requst({ | 
|                         app: _this, | 
|                         contentType: 'application/x-www-form-urlencoded', | 
|                         //TODO 优化下拉加载 | 
|                         data: {name: _this.queryKey, limit: 10000}, | 
|                         url: basePath + "/admin/shoppinggoods/showList", | 
|                         callback: function (data) { | 
|                             _this.searchTableData = data.rows; | 
|                             _this.loading = false; | 
|                         } | 
|                     }); | 
|                 } else { | 
|                     this.showSearchTable = false; | 
|                 } | 
|             }, | 
|   | 
|   | 
|             remoteMethod(query) { | 
|                 if (query !== '') { | 
|                     this.vipLoading = true; | 
|                     let _this = this; | 
|                     AjaxProxy.requst({ | 
|                         app: _this, | 
|                         data: {keyWord: query}, | 
|                         contentType: 'application/x-www-form-urlencoded', | 
|                         url: basePath + '/admin/vipInfo/findUserByPhotoOrName', | 
|                         callback: function (data) { | 
|                             _this.vipLoading = false; | 
|                             if (data.rows.length > 0) { | 
|                                 data.rows.forEach(function (item, index, input) { | 
|                                     item.showLable = item.vipName + "-" + item.phone + "-" + item.vipNo | 
|                                 }); | 
|                             } | 
|                             _this.vipList = data.rows; | 
|                         } | 
|                     }); | 
|                 } else { | 
|   | 
|                     this.options = []; | 
|                 } | 
|             }, | 
|             changeVip(data) { | 
|                 let _this = this; | 
|                 AjaxProxy.requst({ | 
|                     app: _this, | 
|                     data: {id: data}, | 
|                     contentType: 'application/x-www-form-urlencoded', | 
|                     url: basePath + '/admin/vipInfo/findUserById', | 
|                     callback: function (data) { | 
|                         _this.currentVipInfo = data.rows[0]; | 
|                         _this.order.vipId = _this.currentVipInfo.id; | 
|                         _this.getVipMoneyCards(); | 
|   | 
|                     } | 
|                 }); | 
|             }, | 
|             closeXm() { | 
|                 this.showSearchTable = false; | 
|             }, | 
|   | 
|             //分享业绩 | 
|             shareAchieve(index, row) { | 
|                 row2 = JSON.parse(JSON.stringify(row)); | 
|                 row2.isShare = true; | 
|                 this.achieveList.push(row2); | 
|             }, | 
|             //删除业绩 | 
|             delAchieve(index, row) { | 
|                 this.achieveList.splice(index, 1); | 
|             }, | 
|             print() { | 
|                 let _this = this; | 
|                 if (_this.order.id) { | 
|                     layer.open({ | 
|                         type: 2, | 
|                         title: "打印订单", | 
|                         area: ['250px', '550px'], | 
|                         maxmin: true, | 
|                         content: [basePath + '/admin/redirect/hive/beautySalon/print-order?id=' + this.order.id], | 
|                         cancel: function (index, layero) { | 
|                             _this.closeFram(); | 
|                         } | 
|                     }); | 
|                 } else { | 
|                     this.$message.warning("请先挂单在打印"); | 
|                 } | 
|   | 
|   | 
|             }, | 
|             payMethodSelect(item, index) { | 
|                 let _this = this; | 
|                 let payMoneys = _this.payMoneys; | 
|                 if (item.type != '储值卡') { | 
|                     this.$nextTick(function () { | 
|                         if (item.isActive) { | 
|                             Vue.set(item,'isActive',false); | 
|                             var index = -1; | 
|                             for (var i = 0; i < payMoneys.length; i++) { | 
|                                 let payMoney = payMoneys[i]; | 
|                                 if (payMoney.value == item.value) { | 
|                                     index = i; | 
|                                     break; | 
|                                 } | 
|                             } | 
|   | 
|                             if (index > -1) { | 
|                                 _this.payMoneys.splice(index, 1) | 
|                             } | 
|                         } else { | 
|                             Vue.set(item,'isActive',true); | 
|                             var hasAmount = 0; | 
|                             for(var i = 0; i < payMoneys.length; i++) { | 
|                                 hasAmount += parseFloat(payMoneys[i].money); | 
|                             } | 
|                             if (_this.order.payMoney - hasAmount > 0) { | 
|                                 Vue.set(item, 'money', _this.order.payMoney - hasAmount); | 
|                             } | 
|                             _this.payMoneys.push(item); | 
|                         } | 
|                     }); | 
|                 } | 
|             }, | 
|             popoverHide(item) { | 
|                 if(this.treeSelect.length <= 0) { | 
|                     Vue.set(item, 'isActive', false) | 
|                 } else { | 
|                     Vue.set(item, 'isActive', true) | 
|                 } | 
|             }, | 
|             handleCheckChange(clickNode, checked) { | 
|                 let _this = this; | 
|   | 
|                 let nodes = checked.checkedNodes; | 
|                 _this.treeSelect = nodes; | 
|                 var index = -1; | 
|                 // 判断点击节点是否在已展示支付方式中 | 
|                 for(var i = 0; i < _this.payMoneys.length; i++) { | 
|                     let node = _this.payMoneys[i]; | 
|                     if (node.uuid === clickNode.uuid) { | 
|                         index = i; | 
|                         break; | 
|                     } | 
|                 } | 
|   | 
|                 // 若点击节点在选中节点中,且已展示支付方式不存在,则添加 | 
|                 if (nodes.indexOf(clickNode) > -1 && index === -1) { | 
|                     var node = clickNode; | 
|                     var item = {}; | 
|                     if (node.isGift) { | 
|                         item.value = node.cardName; | 
|                         item.balance = node.giftMoney; | 
|                         item.isGift = 'Y'; | 
|                     } else { | 
|                         item.value = node.cardName; | 
|                         item.balance = node.realMoney; | 
|                         item.isGift = 'N'; | 
|                     } | 
|                     item.type = '储值卡'; | 
|                     item.id = node.id; | 
|                     item.uuid = clickNode.uuid; | 
|                     _this.payMoneys.push(item); | 
|                 } | 
|   | 
|                 // 若点击节点不存在选中节点中,且已展示支付方式中存在,则移除 | 
|                 if (nodes.indexOf(clickNode) === -1 && index > -1) { | 
|                     _this.payMoneys.splice(index, 1); | 
|                 } | 
|             }, | 
|             openPayMoney() { | 
|                 let _this = this; | 
|                 if (!_this.order.items.length > 0) { | 
|                     this.$message.warning("请选择要购买的产品"); | 
|                     return false; | 
|                 } | 
|   | 
|                 _this.dialogSettleVisible = true; | 
|             } | 
|         } | 
|   | 
|     }) | 
| </script> | 
|   | 
| </body> | 
| </html> |