<%@ page contentType="text/html; charset=utf-8"%>
<%@ taglib prefix="s" uri="/struts-tags" %>
<%@ taglib prefix="cm" uri="/commons-tags" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>排班管理</title>
<link href="../resources/style/base.css" rel="stylesheet" type="text/css"/>
<s:include value="../common/head.jsp" />
<script language="javascript" src="../resources/js/calendar/calendar.js"></script>
<script language="javascript" src="../code/vm/ExtCodeJs.htm"></script>
<style>
.dayTD{
	cursor:pointer;
	text-align:center;
	padding:0;
}
.sunday_css{
	background-color:#E8E8E8;
}
.cal_data td{
	padding:5px 0px;
	border-bottom:#CCCCCC 1px solid;
	border-right:#CCCCCC 1px solid;
	border-left:#F6F6F6 1px solid;
	border-top:#F6F6F6 1px solid;
	font-size:13px;
}
</style>
<script language="javascript">
var $currObj;
function showMenu(obj){
	$currObj=$(obj);
	var of=$currObj.offset();
	of.top=of.top+$currObj.outerHeight()-9;
	of.left=of.left+10;
	$menu().show();
	$menu().offset(of);
}
function changeVal(confId){
	var emplId=$currObj.attr("empl");
	var dayIx=$currObj.attr("day");	
	if(confId!=null){
		$currObj.html($("#code_"+confId).html());
	}else{
		$currObj.html("");
	}
	$menu().fadeOut("fast");
	$.get("<s:url action='attEmplWorkdayConfEditOne'/>?conf.emplInfo.id="+emplId+"&conf.id="+dayIx
		+(confId==null?"":("&conf.day1.id="+confId))+"&conf.attMonth=<s:property value='conf.attMonth'/>&uniqueid="+getCodeUniqueID());
}
function $menu(){
	return $("#menu_table");
}
$(function() {
  $(document).bind('click', function(event) {
	  $menu().fadeOut("fast");
  });
  $(".dayTD").bind('click', function(event) {
	  showMenu(this);
	  event.stopPropagation();
  });
});
</script>

<script type="text/javascript">
function changeMonth(v){
	$am=$("#attMonth");
	$am.val(addMonth($am.val(),v));
	query();
}
</script>
</head>

<body>
<div class="body_list">
<s:include value="../common/body.jsp" />
<s:form action="attEmplWorkdayConfList" id="queryForm"  onsubmit="return checkForm(this)">

 <table width="100%" border="0" align="center" cellpadding="0" cellspacing="0" class="table_line">
    <tr class="form_title">
      <td colspan="4">查询条件</td>
    </tr>
    <tr class="form_item">
      <td width="29%">月份：
	  <input type="button" value="&lt;" title="前一个月" onclick="changeMonth(-1)" />
	  <s:textfield id="attMonth" name="conf.attMonth" readonly="true" title="月份为必填项" cssStyle="width:60px;" onclick="showCalendar('yyyyMM',this,false)" cssClass="date_input"/>
	  <input type="button" value="&gt;" title="后一个月" onclick="changeMonth(1)" />
	  </td>
      <td width="30%">姓名：<s:textfield name="conf.emplInfo.name" cssStyle="width:100px;"/></td>
      <td width="28%">工号：<s:textfield name="conf.emplInfo.emplNo"  title="工号必须为数字。"  cssStyle="width:100px;"/></td>
      <td width="13%" align="center">
        <input name="q" value="查 询" onclick="query()" type="button" />
        </td>
    </tr>
  </table>
  
  <table width="100%" border="0" align="center" cellpadding="0" cellspacing="0" class="table_line" style="margin:15px 0 5px 0;" >
    <tr class="list_title">
      <td align="center" nowrap="nowrap">工号</td>
      <td align="center" nowrap="nowrap">姓名</td>
       <s:iterator value="weekList">
       		<s:iterator value="top" status="sx">
      			<s:if test="top!=null">
                    <td width="20"><s:property /></td>
                </s:if>
            </s:iterator>
	   </s:iterator>
      </tr>
    <s:iterator value="dataList" status="st">
      <s:set name="empl" value="top[0]"/>
      <s:set name="conf" value="top[1]"/>
      <tr class="cal_data">
        <td width="32" align="center"><s:property value="#empl.emplNo"/></td>
        <td width="49" class="center nowrap"><s:property value="#empl.name"/></td>
         <s:iterator value="weekList">
            <s:iterator value="top" status="sx">
                <s:if test="top!=null">
                    <s:set name="sunday_css" value=""/>
                    <s:if test="#sx.index==0 || #sx.index==6">
                    	<s:set name="sunday_css" value="%{'sunday_css'}"/>
                    </s:if>
                    <td width="20" day="<s:property />" empl="<s:property value='#empl.id'/>" 
                    	class="<s:property value='#sunday_css'/> dayTD">
                    	<s:if test="#conf.getDay(top) != null">
                             <span style="background-color:<s:property value='#conf.getDay(top).color' />; border:1px #999 solid;"><s:property value='#conf.getDay(top).code' /></span>                        
                        </s:if>
                        <s:else>&nbsp;</s:else>
                  </td>
                </s:if>
            </s:iterator>
        </s:iterator>
      </tr>
    </s:iterator>
  </table>
  <table width="100%" border="0" align="center" cellpadding="0" cellspacing="0" class="list_page">
    <tr>
      <td width="66%" style="text-align:left;">
      <span class="info">
      提示：请直接在日期表格上点击鼠标左键进行班次设置；其中灰色背景的表格表示周六、周日。      </span>      </td>
      <td width="34%"><cm:pager/></td>
    </tr>
  </table>
</s:form>


 <s:if test="worktimeConfList!=null && worktimeConfList.size()>0">
 <table width="100%" border="0" cellspacing="0" cellpadding="0" style="margin:5px 0;">
  <tr>
    <td><a href="javascript:showHide('timeDetail')">[查看班次时间明细]</a></td>
  </tr>
 </table>
  <table width="100%" border="0" cellspacing="0" cellpadding="0" class="table_line" 
  		style="display:none;" id="timeDetail"> 
    <tr>
      <td  style="padding-bottom:10px;">
        <s:iterator value="worktimeConfList">
        <table width="130" border="0" cellspacing="0" cellpadding="0" style="border:1px #CCC solid; margin:10px; float:left;">
          <tr class="sub_list_title">
            <td valign="top">
            	<span style="background-color:<s:property value='color'/>; border:1px #999 solid;"><s:property value='code'/></span>
                &nbsp;<s:property value='name'/>
            </td>
          </tr>
          <s:iterator value="periodSet">
          <tr class="list_data">
            <td><s:property value="beginTime"/>&nbsp;至&nbsp;<s:property value="dateType.codeName"/><s:property value="endTime"/>
            </td>
          </tr>
          </s:iterator> 
        </table>
        </s:iterator>
      </td>
    </tr>
  </table>
  </s:if>


<table width="115" border="0" cellspacing="0" cellpadding="0" id="menu_table" style="display:none;">
  <tr>
    <td style="background:url(../resources/images/up.gif) no-repeat top left; height:7px;"></td>
  </tr>
  <tr>
    <td>
        <table width="100%" border="0" cellpadding="0" cellspacing="0" style="border:#6090f0 solid 1px;">
         <s:iterator value="worktimeConfList">
          <tr class="form_tr list_data">
            <td onclick="changeVal('<s:property value='id'/>')" class="pointer">
                <span id="code_<s:property value='id'/>">
                	<span style="background-color:<s:property value='color'/>; border:1px #999 solid;"><s:property value='code'/></span>
                </span>&nbsp;
                <s:property value='name'/>
            </td>
          </tr>
         </s:iterator> 
          <tr class="form_tr list_data">
            <td onclick="changeVal()" class="pointer">
                <span id="code_<s:property value='id'/>">
                	<span style="background-color:#FFF; border:1px #999 solid;">　</span>
                </span>&nbsp;
                清除
            </td>
          </tr>
        </table>    
    </td>
  </tr>
</table>




</div>
</body>
</html>