online_office_simple
/
work-mine.html

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>考勤管理</title>
		<link rel="stylesheet" type="text/css" href="css/main.css" />
	</head>

	<body>
		<!-- 头部 -->
		<div class="header">
			<div class="w-1200">
				<div class="logo">
					<img src="images/logo_03.png">
				</div>
				<ul>
					<li><a>组织图</a></li>
					<li><a href="set.html">个人设置</a></li>
					<li><a href="login.html">退出</a></li>
				</ul>
				<div class="personnel">admin / 管理员 / 吉林长春分部</div>
			</div>
		</div>
		<!-- 导航 -->
		<div class="nav">
			<div class="w-1200">
				<ul>
					<li><a href="index.html">首页</a></li>
					<li><a href="email.html">邮件</a></li>
					<li><a href="approval.html">审批</a></li>
					<li><a href="notice.html">公告</a></li>
					<li><a href="report.html">业务报告</a></li>
					<li><a href="task.html">任务奖励</a></li>
					<li class="cur2"><a href="work.html">考勤管理</a></li>
					<li><a href="personnel.html">人员管理</a></li>
					<li><a href="homepage.html">网站主页</a></li>
				</ul>
			</div>
		</div>
		<!-- 内容 -->
		<div class="w-1200 container">
			<!-- 左侧导航 -->
			<div class="Left LeftMore">
				<div class="columnBox">
					<h1><a href="work.html">打卡</a></h1>
				</div>
				<div class="columnBox">
					<h1><a>请假</a></h1>
				</div>
				<div class="columnBox">
					<h1><a>加班</a></h1>
				</div>
				<div class="columnBox">
					<h1><a>外出</a></h1>
				</div>
				<div class="columnBox">
					<h1><a>外派</a></h1>
				</div>
				<div class="columnBox">
					<h1><a>串休</a></h1>
				</div>
				<div class="columnBox">
					<h1><a>统计</a></h1>
				</div>
				<div class="columnBox">
					<h1><a>考勤审批</a></h1>
				</div>
				<div class="columnBox">
					<h1><a class="cur" href="work-mine.html">我的申请</a></h1>
				</div>
			</div>
			<!-- 右侧内容 -->
			<div class="Right RightMore">
				<ul class="operate">
					<li><a class="add">申请</a></li>
					<li class="query">
						<lable>姓名</lable>
						<input placeholder="关键字" />
						<lable>日期</lable>
						<input placeholder="请选择" onclick="WdatePicker({startDate:'today'})" />
						<a>查询</a>
					</li>
				</ul>
				<table class="table-list">
					<thead>
						<tr>
							<th>姓名</th>
							<th>日期</th>
							<th>星期</th>
							<th>打卡时间</th>
						</tr>
					</thead>
					<tbody>
						<tr>
							<td>01</td>
							<td><a>请假</a></td>
							<td>未审批</td>
							<td>2018-03-23  17:45</td>
						</tr>
						<tr>
							<td>01</td>
							<td><a>请假</a></td>
							<td>未审批</td>
							<td>2018-03-23  17:45</td>
						</tr>
						<tr>
							<td>01</td>
							<td><a>请假</a></td>
							<td>未审批</td>
							<td>2018-03-23  17:45</td>
						</tr>
						<tr>
							<td>01</td>
							<td><a>请假</a></td>
							<td>未审批</td>
							<td>2018-03-23  17:45</td>
						</tr>
						<tr>
							<td>01</td>
							<td><a>请假</a></td>
							<td>未审批</td>
							<td>2018-03-23  17:45</td>
						</tr>
						<tr>
							<td>01</td>
							<td><a>请假</a></td>
							<td>未审批</td>
							<td>2018-03-23  17:45</td>
						</tr>
						<tr>
							<td>01</td>
							<td><a>请假</a></td>
							<td>未审批</td>
							<td>2018-03-23  17:45</td>
						</tr>
						<tr>
							<td>01</td>
							<td><a>请假</a></td>
							<td>未审批</td>
							<td>2018-03-23  17:45</td>
						</tr>
						<tr>
							<td>01</td>
							<td><a>请假</a></td>
							<td>未审批</td>
							<td>2018-03-23  17:45</td>
						</tr>
					</tbody>
				</table>
				<!-- 分页 -->
				<div class="page-box">
					<ul class="page-count">
						<li>共132条记录</li>
						<li>第1/10页</li>
					</ul>
					<dl>
						<dd><a>首页</a></dd>
						<dd><a>上一页</a></dd>
						<dd class="cur"><a>1</a></dd>
						<dd><a>2</a></dd>
						<dd><a>3</a></dd>
						<dd><a>4</a></dd>
						<dd><a>5</a></dd>
						<dd><span>...</span></dd>
						<dd><a>10</a></dd>
						<dd><a>下一页</a></dd>
						<dd><a>尾页</a></dd>
						<dt><span>跳转到</span></dt>
						<dt><input type="number" /></dt>
						<dt><span>页</span></dt>
						<dt><a>确定</a></dt>
					</dl>
				</div>
			</div><!-- RightMore -->
		</div>

		<!-- 发布 -->
		<div class="write-box">
			<ul class="operate">
				<li><a class="send">提交申请</a></li>
				<li class="query"><a class="close">关闭</a></li>
			</ul>
			<div class="write-con">
				<table>
					<tr>
						<td><span>类型：</span></td>
						<td>
							<select>
								<option value="1">请选择</option>
								<option value="2">请假</option>
								<option value="3">加班</option>
								<option value="2">外出</option>
								<option value="3">串休</option>
								<option value="2">外派</option>
							</select>
						</td>
					</tr>
					<tr>
						<td><span>是否周期：</span></td>
						<td><input placeholder="请选择"></td>
					</tr>
					<tr>
						<td><span>日期：</span></td>
						<td>
							<div class="time">
								<input placeholder="开始日期" onclick="WdatePicker({startDate:'today'})">
								<span>至</span>
								<input placeholder="结束日期" onclick="WdatePicker({startDate:'today'})">
							</div>
						</td>
					</tr>
					<tr>
						<td><span>时间：</span></td>
						<td>
							<div class="time">
								<input placeholder="开始时间" onclick="WdatePicker({startDate:'today'})">
								<span>至</span>
								<input placeholder="结束时间" onclick="WdatePicker({startDate:'today'})">
							</div>
						</td>
					</tr>
					<tr>
						<td><span>事由：</span></td>
						<td><textarea placeholder="字符500以内~"></textarea></td>
					</tr>
					<tr>
						<td><span>附件：</span></td>
						<td><input type="file"></td>
					</tr>
					<tr>
						<td><span>审批人：</span></td>
						<td><input placeholder="请选择"></td>
					</tr>
					<tr>
						<td><span>抄送人：</span></td>
						<td><input placeholder="请选择"></td>
					</tr>
				</table>
			</div>
		</div>
		<!-- 发布查看 -->
		<div class="look-box">
			<ul class="operate">
				<li><a>通过</a></li>
				<li><a>驳回</a></li>
				<li><a>拒绝</a></li>
				<li><a>撤回申请</a></li>
				<li class="query"><a class="close">关闭</a></li>
			</ul>
			<div class="write-con">
				<table>
					<tr>
						<td><span>类型：</span></td>
						<td>请假</td>
					</tr>
					<tr>
						<td><span>是否周期：</span></td>
						<td>周期</td>
					</tr>
					<tr>
						<td><span>日期：</span></td>
						<td>
							<div class="time">
								<span>2012-01-05</span>
								<span>至</span>
								<span>2012-06-05</span>
							</div>
						</td>
					</tr>
					<tr>
						<td><span>时间：</span></td>
						<td>
							<div class="time">
								<span>08:30</span>
								<span>至</span>
								<span>17:30</span>
							</div>
						</td>
					</tr>
					<tr>
						<td><span>事由：</span></td>
						<td>生病住院</td>
					</tr>
					<tr>
						<td><span>附件：</span></td>
						<td>无</td>
					</tr>
					<tr>
						<td><span>审批人：</span></td>
						<td>周部长</td>
					</tr>
					<tr>
						<td><span>抄送人：</span></td>
						<td>董经理</td>
					</tr>
				</table>
				<table>
					<tr>
						<td><span>申请状态：</span></td>
						<td>待审核</td>
					</tr>
				</table>
			</div>
		</div>
		<div class="bg-shadow"></div>
		<!-- JS -->
		<script src="js/jquery.js"></script>
		<script src="js/common.js"></script>
		<script src="My97DatePicker/WdatePicker.js"></script>
		<script>
			// 发布
			function showMessage() {
				$(".bg-shadow").fadeIn(100);
				$(".write-box").fadeIn(300);
			}

			function closeMessage() {
				$(".bg-shadow").fadeOut();
				$(".write-box").fadeOut(100);
				$(".look-box").fadeOut(100);
			}
			$(".operate li .add").click(function() {
				showMessage();
			})
			$(".operate li .send").click(function() {
				alert("发送成功");
				closeMessage()
			})
			$(".operate li .close").click(function() {
				closeMessage();
			})
			// 查看
			function lookMessage() {
				$(".bg-shadow").fadeIn(100);
				$(".look-box").fadeIn(300);
			}
			$(".table-list tbody tr td a").click(function() {
				lookMessage();
			})
		</script>
	</body>
</html>