<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>工作日管理</title>
<style>
	.workingCalendarBox{
		padding:0 0.2rem;
		position:relative;
	}
	.workingCalender-legend{
		position:absolute;
		top:0;
		left:0.2rem;
		width:1.3rem;
		bottom:0;
		background-color:#fff;
		padding:0.1rem;
	}
	#workingDayCalendar{
		margin-left:1.4rem;
		background-color:#fff;
		padding:0 0.1rem 0.1rem;
	}
	#workingDayCalendar .btn-toolbar{
		padding:0.15rem 0 0.05rem 0;
	}
	#workingDayCalendar.calendar .cell-day{
		background-color:#fff;
	}
	#workingDayCalendar.calendar .cell-day.current-month{
		background-color:#fff;
	}
	#workingDayCalendar.calendar .day{
		opacity:0;
	} 
	#workingDayCalendar.calendar .cell-day.current-month>.day{
		opacity:1;
	}
	#workingDayCalendar.calendar .cell-day.current{
		-webkit-box-shadow:none;
		box-shadow:none;
	}
	#workingDayCalendar.calendar .cell-day.current>.day>.heading{
		background-color:transparent;
	}
	#workingDayCalendar.calendar .cell-day.current-month.holiday{
		background-color:#fbebed;
		color:red;
	}
	.workingCalender-legend-pic{
		height:0.2rem;
		line-height:0.2rem;
		margin-bottom:0.1rem;
	}
	.workingCalender-legend-pic span{
		display:inline-block;
		width:0.4rem;
		height:0.2rem;
		border:1px solid #ccc;
		background-color:#fbebed;
		margin-right:0.1rem;
		float:left;
	}
	.workingCalender-legend p{
		font-weight:bold;
		font-size:0.16rem;
	}
	.workingCalender-legend-pic p{
		display:inline-block;
		font-weight:normal;
		float:left;
		font-size:0.12rem;
	}
	#workingDayCalendar .btn-toolbar div{
		display:inline-block;
		cursor:pointer;
		font-size:0.14rem;
		min-width:0.2rem;
	}
	#workingDayCalendar .btn-toolbar div i{
		font-weight:bold;
		font-size:0.18rem;
	}
	#workingDayCalendar .btn-toolbar div.workingDay-prev:hover,
	#workingDayCalendar .btn-toolbar div.workingDay-next:hover{
		box-shadow:0 0 0.02rem 0.02rem rgba(82,174,220,0.3)
	}
	#workingDayCalendar .btn-toolbar{
		text-align:center;
	}
	#workingDayCalendar .btn-toolbar .workingDay-center{
		margin:0 0.25rem;
		font-size:0.16rem;
		font-weight:bold;
		cursor:default;
	}
	#workingDayCalendar.calendar .table>thead>tr>th{
		padding:0.07rem 0;
		color:#fff;
	}
	.editShowDate{
		text-align:left !important;
		font-size:0.2rem;
		margin:0;
		padding:0.2rem 0;
	}
	#workingDayCalendar.calendar .cell-day.past>.day>.content{
		opacity:1;
	}
	#workingDayCalendar.calendar .event{
		background-color:transparent;
		color:#333;
		font-weight:bold;
		text-align:center;
	}
	#workingDayCalendar.calendar .event span.time{
		display:none !important;
	}
	#workingDayCalendar.calendar .holiday .event{
		color:red;
	}
</style>
</head>
<body>
<div class="base-extend">
	<ol class="breadcrumb">
	  	<li>系统管理</li>
	  	<li>工作日管理</li>
	</ol>
	<div class="workingCalendarBox">
		<div class="workingCalender-legend">
			<p>图例</p>
			<div class="workingCalender-legend-pic">
				<span style="background-color:#fff;"></span><p>工作日</p>
			</div>
			<div class="workingCalender-legend-pic">
				<span></span><p>非工作日</p>
			</div>
		</div>
		<div id="workingDayCalendar" class="calendar"></div>
	</div>
	<!-- 编辑 -->
	<div class="modal fade businessDialog" id="myModal-updateWorkingDayNature" data-backdrop="static">
		<div class="modal-dialog" style="width:8rem;">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal">
					<span aria-hidden="true" style="font-size:0.18rem">×</span><span class="sr-only">关闭</span>
				</button>
				<span class="modal-title">编辑</span>
			</div>
			<div class="modal-content">
				<form class="form-horizontal" id="editDateForm">
					<div class="newTabAddUpdateBox" style="position:static;border:none;padding-left:0.2rem;padding-right:0.2rem;padding-bottom:0;padding-top:0;">
						<div class="row">
							<p class="editShowDate"></p>
							<input type="hidden" name="dateTime" id="dateTime">
							<input type="hidden" name="id">
							<table>
								<tr>
									<td width="20%">
										<span>节/假/工作日备注</span>：
									</td>
									<td width="80%" class="enter">
										<input type="text" id="remark" name="remark" class="form-control" maxlength="20">
									</td>
								</tr>
								<tr>
									<td width="20%">
										<span class="required_fileds_star">工作日/非工作日</span>：
									</td>
									<td width="80%" class="enter hasradio">
										<label>
											<input class="weekday radios" type="radio" name="workingDay" value="true">
											<span style="margin-right:25px;">工作日</span>
										</label>
										<label>
											<input class="notweekday radios" type="radio" name="workingDay" value="false">
											<span>非工作日</span>
										</label>
									</td>
								</tr>
							</table>
						</div>
					</div>
					<div class="modal-footer" style="margin:0 -0.2rem;">
						<button class="btn btn-default btn-white btn-info colorbtn saveSure" style='margin-bottom:0;'>保存</button>
						<button class="btn btn-default btn-white btn-info" data-dismiss="modal" style='margin-bottom:0;'>取消</button>
					</div>
				</form>
			</div>
		</div>
	</div>
</div>  
</body>
<script src="/js/external/calendar.js"></script>
<script src="/js/sys/workingDayManage/workingDayManageList.js"></script>
</html>