|   | 
|   | 
|   | 
|   | 
| <!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="box_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=box_no" /> | 
| <meta http-equiv="Cache-Control" content="box_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> | 
| <style type="text/css"> | 
|   | 
| /* 代表服务已结束 */ | 
| .box_danger { | 
|     background: #d9534f; | 
|     cursor: pointer; | 
| } | 
|   | 
| /* 代表上班未被预约还可再约位的空档 */ | 
| .box_success { | 
|     background: #5cb85c; | 
| } | 
| /* 代表已预约 */ | 
| .box_warning { | 
|     background: #f0ad4e; | 
|     cursor: pointer; | 
| } | 
| /* 代表正在服务中 */ | 
| .box_primary { | 
|     background: #337ab7; | 
|     cursor: pointer; | 
| } | 
|   | 
| /* 代表不上班 */ | 
| .box_no { | 
|     background-image: url("${path}/resource/images/wsb.jpg"); | 
| } | 
|   | 
| .exp-warp { | 
|     margin-left: 20px; | 
|     height: 50px; | 
|     width: 100px; | 
|     float: left; | 
| } | 
|   | 
| .exp-box { | 
|     width: 100px; | 
|     height: 30px; | 
|     float: left; | 
|     border-radius: 5px; | 
| } | 
|   | 
| .exp-title { | 
|     width: 100px; | 
|     height: 20px; | 
|     width: 100px; | 
|     line-height: 20px; | 
|     text-align: center; | 
| } | 
|   | 
| .box-table { | 
|      | 
| } | 
|   | 
| .box-table th { | 
|     border: 1px solid; | 
| } | 
|   | 
| .box-table td { | 
|     border: 1px solid; | 
| } | 
|   | 
| .table-box { | 
|     height: 500px; | 
|     overflow-x: hidden; | 
|     overflow-y: auto; | 
|     margin-bottom: 20px; | 
| } | 
|   | 
| .adbox { | 
|     position: absolute; | 
|     top: 0px; | 
|     left: 0px; | 
|     border: 1px solid #aeaeae; | 
|     width: 200px; | 
|     height: 100px; | 
|     background: white; | 
|     padding: 10px; | 
| } | 
|   | 
| #mgrid>thead { | 
|     display: table-footer-group; | 
| } | 
| </style> | 
|   | 
| <title></title> | 
| </head> | 
| <div class="ibox-content"> | 
|  <div class="panel-heading"> | 
|      <label id="lastestWorks" >上一次排班的美疗师:<span id="lastestWork" class="label label-success"></span></label>  | 
|      </div> | 
|     <table class="box-table" id="mgridThead"> | 
|         <thead> | 
|             <tr> | 
|                 <th width="100">时间     </th> | 
|                 <th th:each="item:${mlsList }" width="100" th:text="${item.staffName }"></th> | 
|             </tr> | 
|         </thead> | 
|     </table> | 
|     <div class=" table-box "> | 
|         <table class="box-table" id="mgrid"> | 
|             <thead> | 
|                 <tr> | 
|                     <th width="100">时间     </th> | 
|                     <th th:each="item:${mlsList }" width="100" th:text="${item.staffName }"></th> | 
|                 </tr> | 
|             </thead> | 
|             <tbody> | 
|                     <tr th:each="item,counter:${timePark }"> | 
|                         <td th:text="${#dates.format(item, 'HH:mm')}" > | 
|                         </td> | 
|                         <th:block th:each="td,counter:${chart[counter.index] }"   > | 
|                                 <td th:if="${td.msg ne null}" th:class="${td.css } +'msg'" th:msg="${td.msg}"></td> | 
|                                 <td th:if="${td.msg eq null}" th:class="${td.css }"></td> | 
|                         </th:block> | 
|                     </tr> | 
|             </tbody> | 
|         </table> | 
|     </div> | 
|     <div class="row"> | 
|         <div class="exp-warp"> | 
|             <div class="exp-box box_success"></div> | 
|             <div class="exp-title">可预约</div> | 
|         </div> | 
|         <div class="exp-warp"> | 
|             <div class="exp-box box_warning"></div> | 
|             <div class="exp-title">已预约</div> | 
|         </div> | 
|         <div class="exp-warp"> | 
|             <div class="exp-box box_primary"></div> | 
|             <div class="exp-title">服务中</div> | 
|         </div> | 
|         <div class="exp-warp"> | 
|             <div class="exp-box box_danger"></div> | 
|             <div class="exp-title">服务结束</div> | 
|         </div> | 
|         <div class="exp-warp"> | 
|             <div class="exp-box box_no"></div> | 
|             <div class="exp-title">未上班</div> | 
|         </div> | 
|   | 
|     </div> | 
|   | 
|   | 
| </div> | 
|   | 
| <div id="ad" class="adbox" style="display: none"></div> | 
|   | 
|   | 
| <script type="text/javascript" th:src="@{/js/systools/MJsBase.js}"></script><script type="text/javascript"> | 
|     $(function() { | 
|         $(".msg").mouseenter(function(event) { | 
|             var adNode = $("#ad"); | 
|             adNode.html($(this).attr("msg")); | 
|             adNode.css("left", event.pageX + 10 + "px"); | 
|             adNode.css("top", event.pageY + 10 + "px"); | 
|             adNode.show(); | 
|         }); | 
|         $(".msg").mouseleave(function(event) { | 
|             $("#ad").hide(); | 
|         }); | 
|         getLastedWork(); | 
|     }) | 
|      | 
|      | 
|              | 
|   | 
|      | 
|     function getLastedWork(){ | 
|         $.AjaxProxy().invoke(basePath+"/admin/lastestWorkBeatuistaff/findLasteWork",function(loj){ | 
|             var html=[]; | 
|             for(var i=0;i<loj.getRowCount();i++){ | 
|                 html[i]=loj.getString(i,"staffName"); | 
|             } | 
|             if(html.length<1){ | 
|                 $("#lastestWorks").html("暂无排班美疗师"); | 
|             }else{ | 
|                 $("#lastestWork").html(html.join(" | "));     | 
|             } | 
|         }) | 
|     } | 
| </script> | 
| </body> | 
| </html> |