| <!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/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/function/vip.js}"></script> | 
|     <style type="text/css"> | 
|   | 
|         .btn-my { | 
|             background-color: #f8ac59; | 
|             border-color: #f8ac59; | 
|             color: #fff | 
|         } | 
|   | 
|         .btn-my:hover { | 
|             background-color: #FFD19F; | 
|             border-color: #FFD19F; | 
|             color: #fff | 
|         } | 
|   | 
|         .btn-my:focus { | 
|             outline: 0 !important; | 
|         } | 
|   | 
|         .btn-my.active { | 
|             background-color: rgb(185, 136, 85); | 
|             border-color: rgb(185, 136, 85); | 
|             color: #fff; | 
|             outline: 0; | 
|         } | 
|   | 
|     </style> | 
| </head> | 
| <body class=" container-fluid"> | 
| <div class="pd-10"> | 
|     <!-- 搜索框部分start --> | 
|     <div class="row form-head"> | 
|   | 
|         <!-- ------------搜索服务单开始---------------- --> | 
|         <form class="form-inline" id="serchform"> | 
|   | 
|   | 
|             <div class="form-group mr-20"> | 
|                 <label>服务单编号</label> | 
|                 <input name="serviceNo" type="text" class="form-control" id="serviceNo"> | 
|             </div> | 
|   | 
|             <div class="form-group mr-20"> | 
|                 <label>客户手机号</label> | 
|                 <input name="vipPhone" type="text" class="form-control" id="vipPhone"> | 
|             </div> | 
|             <div class="form-group mr-20"> | 
|                 <label>客户姓名</label> | 
|                 <input name="vipName" id="vipName" type="text" class="form-control"> | 
|             </div> | 
|             <div class="form-group mr-20"> | 
|                 <label>预约日期</label> | 
|                 <input autocomplete="off"   name="beginTime" type="text" | 
|                        class="form-control datetimepicker" id="beginTime">- | 
|                 <input autocomplete="off"   name="closureTime" type="text" | 
|                        class="form-control datetimepicker" id="endTime"> | 
|             </div> | 
|             <div class="form-group mr-20"> | 
|                 <label >所属门店</label> | 
|                 <select class="form-control autoFull" data-filed="shopName" name="shopId" id="shopId" | 
|                         th:data-url="@{/admin/shopInfo/findAll}"> | 
|                     <option value=''>--请选择部所属门店--</option> | 
|                 </select> | 
|             </div> | 
|             <input type="hidden" value="待预约" name="state" id="state"/> | 
|             <div class="form-group mr-20"> | 
|                 <button type="button" class="btn btn-my btn-sm" id="btn4" value="">全部</button> | 
|                 <button type="button" class="btn btn-my btn-sm active" id="btn1" value="待预约">待预约</button> | 
|                 <!--                <button type="button" class="btn btn-my btn-sm" id="btn2" value="预约成功待处理">待派单</button>--> | 
|                 <button type="button" class="btn btn-my btn-sm" id="btn3" value="需配料">待配料</button> | 
|                 <button type="button" class="btn btn-my btn-sm" id="btn3" value="配料完成">待服务</button> | 
|                 <button type="button" class="btn btn-my btn-sm" id="btn6" value="服务中">服务中</button> | 
|                 <button type="button" class="btn btn-my btn-sm" id="btn7" value="服务完成">服务完成</button> | 
|                 <button type="button" class="btn btn-my btn-sm" id="btn8" value="服务单结束">服务单结束</button> | 
|             </div> | 
|             <div class="form-group mr-20"> | 
|                 <button onclick="myGrid.serchData()" type="button" class="btn btn-info btn-sm"><i | 
|                         class="fa fa-search "></i> | 
|                     搜索 | 
|                 </button> | 
|                 <button type="reset" class="btn btn-info btn-sm"><i class="fa fa-refresh "></i> 重置</button> | 
|             </div> | 
|         </form> | 
|     </div> | 
|     <table class="table table-bordered" id="mgrid"> | 
|         <div id="option-bar"> | 
|             <button   matrix:btn="serviceClub-exportExcel" onclick="exportExcel()" type="button" class="btn btn-info btn-sm"><i class="fa fa-download" ></i> 导出</button> | 
|             <button   class="btn btn-info btn-sm" onClick="openEdit2()" title=""><i class="fa fa-lg fa-eye"></i> 查看详情</button> | 
|             <button   matrix:btn="serviceClub-del"  onClick="removeOrder()" type="button" class="btn btn-danger btn-sm"><i class="fa fa-trash" ></i> 删除</button> | 
|         </div> | 
|         <thead> | 
|         <tr> | 
|             <th data-checkbox="true"></th> | 
|   | 
|             <th data-formatter="MGrid.indexfn" data-align="center" data-width="30px">序号</th> | 
|             <th data-field="serviceNo" data-sortable="true">单号</th> | 
|             <th data-field="vipInfo.vipNo">会员编号</th> | 
|             <th data-field="vipInfo.vipName">会员姓名</th> | 
|             <th data-field="vipInfo.phone">会员手机号</th> | 
|             <th data-field="state">状态</th> | 
|             <th data-field="money">消耗金额</th> | 
|             <th data-field="createTime" data-sortable="true" data-formatter="MGrid.getTime">下单时间</th> | 
|             <th data-field="yyTime" data-sortable="true" data-formatter="MGrid.getTime">预约时间</th> | 
|             <th data-field="consumeTime" data-sortable="true" data-formatter="MGrid.getTime">划扣时间</th> | 
|             <th data-field="totalTime" data-sortable="true">服务时长</th> | 
|             <th data-field="isOverTime" data-formatter="overTime">超时时间</th> | 
|             <th data-field="createStaffName">下单顾问</th> | 
|             <th data-field="shopName">门店</th> | 
|             <th data-sortable="true" data-field="id" data-formatter="buidOperate">操作</th> | 
|         </tr> | 
|         </thead> | 
|     </table> | 
| </div> | 
| </div> | 
| </body> | 
| <script type="text/javascript" th:src="@{/js/systools/MJsBase.js}"></script> | 
| <script type="text/javascript"> | 
|   | 
|     $("#vipPhone").val($.query.get('vipPhone')); | 
|     var _initParam = {format : 'yyyy-mm-dd hh:ii', | 
|         todayBtn : true, | 
|         autoclose : true, | 
|         startView : 2, | 
|         maxView : 3, | 
|         minView : 0}; | 
|     MTools.ininDatetimepicker(_initParam); | 
|     //限制结束时间不小于开始时间 | 
|     var initParam = {format : 'yyyy-mm-dd hh:ii', | 
|         todayBtn : true, | 
|         autoclose : true, | 
|         startView : 2, | 
|         maxView : 3, | 
|         minView : 0}; | 
|     MTools.limitStartEndTime(initParam); | 
|   | 
|     var myGrid; | 
|     $(function () { | 
|         MTools.autoFullSelect(); | 
|         myGrid = MGrid.initGrid({ | 
|             url: basePath + "/admin/projService/showList", | 
|             delurl: basePath + "/admin/del", | 
|             sortOrder: "desc", | 
|         }); | 
|     }); | 
|   | 
|     function findTime() { | 
|         if ($("#shopId").val() != "" && $("#totalTime").val() != "" && $("#startTime").val() != "") { | 
|   | 
|             if (!isNaN($("#totalTime").val()) && $("#totalTime").val() > 0 && $("#totalTime").val() < 600) { | 
|                 $.AjaxProxy({ | 
|                     p: { | 
|                         shopId: $("#shopId").val(), | 
|                         totalTime: $("#totalTime").val(), | 
|                         startTime: $("#startTime").val() | 
|                     }, | 
|                 }).invoke(basePath + "/admin/projService/kdyySecletTime", function (loj) { | 
|                     $("#mls").html("美疗师空余数:" + loj.attr("result").rows[0] + "        床位空余数:" + loj.attr("result").rows[1]); | 
|   | 
|                 }); | 
|             } else { | 
|                 layer.alert('时长请输入数字并且大于0小于600'); | 
|             } | 
|   | 
|         } | 
|     } | 
|     var btns=[]; | 
|     btns[0]="",btns[1]="",btns[2]="",btns[3]="",btns[4]="",btns[5]="",btns[6]=""; | 
|     function buidOperate(value, row, index) { | 
|         var status = row.state; | 
|         var html ='<a class="text-primary mr-5" onClick="selectFwz(' + value + ')"  title="查看"><i class="fa fa-eye">查看</i></a> ' | 
|         switch (status) { | 
|             case '待预约': | 
|                 html +=  btns[0].replace('VALUE',value); | 
|                 break; | 
|             case '预约成功待处理': | 
|                 html += btns[1].replace('VALUE',value); | 
|                 html += btns[2].replace('VALUE',value); | 
|                 break; | 
|             case '需配料': | 
|                 html +=btns[3].replace('VALUE',value); | 
|                 html += btns[2].replace('VALUE',value); | 
|                 break; | 
|             case '配料完成': | 
|                 break; | 
|             case '服务完成': | 
|                 html +=btns[4].replace('VALUE',value); | 
|                 html += btns[2].replace('VALUE',value); | 
|                 break; | 
|             case '待确认': | 
|                 html +=btns[7].replace('VALUE',value); | 
|                 break; | 
|         } | 
|         html += btns[5].replace('VALUE',value); | 
|         html += btns[6].replace('VALUE',value); | 
|         html += '</ul></div>' | 
|         return html; | 
|     } | 
|   | 
|     function updateTime(id) { | 
|         layer.open({ | 
|             type: 2, | 
|             title: "修改订单时间", | 
|             maxmin: true, | 
|             area: [MUI.SIZE_L, '500px'], | 
|             content: [basePath + '/admin/projService/toServiceOrderUpdateTime?id=' + id] | 
|         }); | 
|     } | 
|   | 
|     $('#startTime').datetimepicker({ | 
|         format: "yyyy-mm-dd hh:ii", | 
|         maxView: 1, | 
|         minView: 0, | 
|         startView: 0, | 
|         todayBtn: true, | 
|         autoclose: true | 
|     }).on("change", function (ev) { | 
|         findTime(); | 
|     }); | 
|     $('#startTime').datetimepicker("setStartDate", "<fmt:formatDate pattern='yyyy-MM-dd HH:MM'  value='${now }'/>"); | 
|   | 
|     /** | 
|      * 超时 | 
|      */ | 
|     function overTime(value, row, index) { | 
|         var html = ""; | 
|         if (parseInt(value) > 0) { | 
|             html = '<span class="label-danger" >  超时' + value + '分钟  </span>'; | 
|         } else if (parseInt(value) < 0) { | 
|             value = 0 - value; | 
|             html = '<span class="label-warning" >  提前' + value + '分钟  </span>'; | 
|         } else { | 
|             html = '<span class="label-primary" >  --  </span>'; | 
|         } | 
|         return html; | 
|   | 
|     } | 
|   | 
|     $(".btn-my").click(function () { | 
|         var btnValue = $(this).val(); | 
|         $("#state").val(btnValue); | 
|         myGrid.serchData(); | 
|         /* $("#state").val(""); */ | 
|         $(".btn-my").removeClass("active"); | 
|         $(this).addClass("active"); | 
|     }); | 
|   | 
|     //打开开始配料 | 
|   | 
|     function openEdit1(id) { | 
|   | 
|         layer.full(layer.open({ | 
|             type: 2, | 
|             title: "开始配料", | 
|             maxmin: true, | 
|             area: [MUI.SIZE_L, '450px'], | 
|             content: [basePath + '/admin/projService/startpl?id=' + id] | 
|         })); | 
|     } | 
|   | 
|   | 
|   | 
|     function removeOrder(id) { | 
|         var id=myGrid.getSelectItemId(); | 
|         layer.confirm('确定取消此订单?', { | 
|             btn: ['确认', '取消'] //可以无限个按钮 | 
|         }, function(index, layero){ | 
|             $.post(basePath+'/admin/projService/cancelOrder?id='+id, {}, function(data){ | 
|                 parent.layer.msg(data.info,{icon: 1}); | 
|                 layer.closeAll(); | 
|                 myGrid.serchData(); | 
|             }); | 
|             //按钮【按钮一】的回调 | 
|         }, function(index){ | 
|             // alert("2 = "+index); | 
|             //按钮【按钮二】的回调 | 
|         }); | 
|   | 
|     } | 
|   | 
|     function confirmServiceOrder(id) { | 
|         layer.confirm('确定确认订单吗?', { | 
|             btn: ['确认', '取消'] //可以无限个按钮 | 
|         }, function(index, layero){ | 
|             $.post(basePath+'/admin/projService/confirmServiceOrder?id='+id, {}, function(data){ | 
|                 parent.layer.msg(data.info,{icon: 1}); | 
|                 layer.closeAll(); | 
|                 myGrid.serchData(); | 
|             }); | 
|             //按钮【按钮一】的回调 | 
|         }, function(index){ | 
|             // alert("2 = "+index); | 
|             //按钮【按钮二】的回调 | 
|         }); | 
|   | 
|     } | 
|   | 
|   | 
|     //打开查看界面 | 
|     function openEdit2() { | 
|         var id=myGrid.getSelectItemId(); | 
|         layer.open({ | 
|             type : 2, | 
|             title : "查看服务单详情", | 
|             area :   MUI.SIZE_M, | 
|             maxmin : true, | 
|             content : [ basePath+'/admin/projService/serviceInfo?pageFlae=pc&id=' + id] | 
|         }); | 
|     } | 
|   | 
|     //导出 | 
|     //导出 | 
|     function exportExcel(){ | 
|         var param=MForm.toUrlParam("#serchform"); | 
|         window.location.href=basePath+"/admin/projService/exportExcel?"+param; | 
|     } | 
|   | 
| </script> | 
|   | 
| <script matrix:btn="serviceClub-paiban"  > | 
|     btns[0]='<a  class="text-primary mr-5" onClick="openPb(\'VALUE\')"  title="排班"><i class="fa fa-calendar">排班</i></a> ' | 
| </script> | 
|   | 
| <!--<script matrix:btn="serviceClub-paidan"  >--> | 
| <!--    btns[1]='<a  class="text-primary mr-5" onClick="openPd(\'VALUE\')"  title="派单"><i class="fa fa-sign-in">派单</i></a>'--> | 
| <!--</script>--> | 
|   | 
| <script matrix:btn="serviceClub-edit"  > | 
|     btns[2]='<a  class="text-primary mr-5" onClick="updatePd(\'VALUE\')"  title="修改"><i class="fa fa-edit">修改</i></a>' | 
| </script> | 
|   | 
| <script matrix:btn="serviceClub-peiliao"  > | 
|     btns[3]='<a  class="text-primary" onClick="openEdit1(\'VALUE\')" ><i class="fa fa-close ">配料</i></a> ' | 
| </script> | 
|   | 
| <script matrix:btn="serviceClub-huakou"  > | 
|     btns[4]='<a  class="text-primary" onClick="openHkServcie(\'VALUE\')" title="划扣"><i class="fa fa-sign-in ">划扣</i></a> ' | 
| </script> | 
| <script matrix:btn="serviceClub-del"  > | 
|     btns[5]='<a  class="text-primary mr-5" onClick="qxPb(\'VALUE\')" title="取消"><i class="fa fa-close ">取消</i></a> ' | 
| </script> | 
|   | 
| <script matrix:btn="serviceClub-edit"> | 
|     btns[6]='<a  class="text-primary mr-5" onclick="updateTime(\'VALUE\')" title="修改时间"><i class="fa fa-edit">修改时间</i></a> ' | 
| </script> | 
| <script matrix:btn="serviceClub-edit"> | 
|     btns[7]='<a  class="text-primary mr-5" onclick="confirmServiceOrder(\'VALUE\')" title="确认服务单"><i class="fa fa-edit">确认服务单</i></a> ' | 
| </script> | 
|   | 
| </html> |