<%@ 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/jquery/iColorPicker.js"></script>
<script language="javascript" src="../resources/js/calendar/calendar.js"></script>

</head>

<body>
<s:include value="../common/body.jsp" />
<script language="javascript">
var tempHtml="";
$(function(){
	tempHtml=$("#periodTemp").html();
	$("#periodTemp").html("");
	//init
	initData();
});

function initData(){
    <s:iterator value="periodList" status="st"> 
    addPeriodRow("<s:property value='beginTime'/>","<s:property value='endTime'/>","<s:property value='dateType.id'/>");
    </s:iterator>
    <s:if test="periodList==null||periodList.size()<1">
	addPeriodRow();
    </s:if>
}

var rowIndex=0;
function addPeriodRow(beginTime,endTime,dateType){
	var currIx=rowIndex++;
	var thtml=tempHtml.replace("beginTime_name","periodList["+currIx+"].beginTime")
		.replace("endTime_name","periodList["+currIx+"].endTime").replace("dateType_name","periodList["+currIx+"].dateType.id");
	var $row=$(thtml);
	$row.attr("id","row_"+currIx);
	$row.children("#beginTime").val(beginTime);
	$row.children("#endTime").val(endTime);
	$row.children("#dateType").val(dateType);
	$row.children("img").attr("id",currIx);
	$row.appendTo($("#periodBody"));
}

function delPeriodRow(ix){
	$("#row_"+ix).css("display","none");
	$("#row_"+ix).html("");
}
	
</script>


<s:form action="attWorktimeConfOperate" namespace="/att" onsubmit="return checkForm(this)" >
  <table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
    <tr class="form_tr">
      <td align="right"><span class="required">•</span>名称：</td>
      <td valign="top"><s:textfield name="conf.name" title="名称为必填项。" cssStyle="width:225px;"/></td>
    </tr>
    <tr class="form_tr">
      <td align="right"><span class="required">•</span>代码：</td>
      <td valign="top"><s:textfield name="conf.code" cssClass="center" title="代码为必填项" maxlength="1" cssStyle="width:30px;"/>
      &nbsp;<span class="info">建议使用单个汉字，以便于排班。</span></td>
    </tr>
    <tr class="form_tr">
      <td align="right"><span class="required">•</span>颜色：</td>
      <td valign="top"><s:textfield name="conf.color" title="颜色为必填项"  cssClass="iColorPicker" cssStyle="width:225px;"/></td>
    </tr>
    <tr class="form_tr">
      <td align="right" valign="top"><span class="required">•</span>时间段：</td>
      <td valign="top">
		<div id="periodBody"></div>
        <div class="sub_add" style="margin-left:0;" title="添加" onclick="addPeriodRow()">新增时间段</div>	  
		<div id="periodTemp">
		  <div id="" style="margin:0px 0 5px 0;">
			<input id="beginTime" name="beginTime_name" title="开始时间为必填项" class="date_input" onclick="showTimeOnly(this)" 
				readonly="readonly" style="width:55px;" type="text" />
			至
			<s:select id="dateType" name="dateType_name" title="结束时间类型为必填项" cssStyle="width:60px;" 
				list='#request.SysCodeFinder.find("WORKTIME_DATE_TYPE")' headerKey="" headerValue="" listKey="id" listValue="codeName"/>
			<input id="endTime" name="endTime_name" title="结束时间为必填项" class="date_input" onclick="showTimeOnly(this)" 
				readonly="readonly" style="width:55px;" type="text" />
			<img id="" src="../resources/images/del.gif" title="删除" style="cursor:pointer; margin-top:3px;" 
						onclick="delPeriodRow(this.id)" />
		   </div>
		</div>
        </td>
    </tr>
    <tbody id="yearBody" style="display:none;">
    </tbody>
    <tr class="form_tr">
      <td align="right" valign="top">备注：</td>
      <td valign="top"><s:textfield name="conf.descr"  cssStyle="width:225px;height:50px;"/></td>
    </tr>
    <tr class="form_tr">
      <td width="31%" align="right">&nbsp;</td>
      <td width="69%" valign="top">
        
        <s:if test="oper=='edit'">
          <input type="submit" name="button" id="button" value="修 改" />
        </s:if>
        <s:if test="oper=='add'">
          <input type="submit" name="button" id="button" value="添 加" />
        </s:if>
        &nbsp;
        <!-- back begin -->
        <input name="winID" type="hidden" value="${param.winID}" />
        <input type="button" onclick="iframeWindowClose('${param.winID}')" name="button" id="button" value="返 回" />
        <!-- back end -->
        <s:hidden name="conf.id" />
        <s:hidden name="oper"/>
        
        </td>
    </tr>
  </table>
</s:form>
</body>
</html>