加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
文件
该仓库未声明开源许可证文件(LICENSE),使用请关注具体项目描述及其代码上游依赖。
克隆/下载
kaoqinguanli.html 14.62 KB
一键复制 编辑 原始数据 按行查看 历史
aicong 提交于 2017-09-12 17:13 . init 前端代码
<!DOCTYPE html>
<html lang="en">
<head>
<title>Matrix Admin</title>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="css/bootstrap.min.css" />
<link rel="stylesheet" href="css/bootstrap-responsive.min.css" />
<link rel="stylesheet" href="css/uniform.css" />
<link rel="stylesheet" href="css/select2.css" />
<link rel="stylesheet" href="css/matrix-style2.css" />
<link rel="stylesheet" href="css/matrix-media.css" />
<link href="font-awesome/css/font-awesome.css" rel="stylesheet" />
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,700,800' rel='stylesheet' type='text/css'>
</head>
<style>
.content-info{
/*overflow: auto;*/
/*}*/
/*.content-info span{*/
/*padding: 6px 0;*/
/*float: left;*/
/*width: 50%;*/
/*display: block;*/
/*}*/
/*.td-btn{*/
/*width: 150px;*/
/*}*/
/*************许永霖**********/
/*.demo1{*/
/*float: right;*/
/*position: relative;*/
/*right: 10px;*/
/*}*/
/*.demo1 ul{*/
/*margin: 0px;*/
/*padding: 0px;*/
/*}*/
/*.demo1 ul li {*/
/*float:left;*/
/*list-style-type:none;*/
/*margin-left: 5px;*/
/*!*line-height:15px;*!*/
/*}*/
/*.demo1 ul li input{*/
/*width: 120px;*/
/*}*/
/*.dataTables_filter input{display: none}*/
/*.dataTables_filter{display: none}*/
/*select[multiple], select{display: none}*/
/*.dataTables_length{display: none}*/
/** li{ list-style-type: none;}*/
/*.renyuan_count{*/
/*float: left;*/
/*margin-left: 0px;*/
/*margin-bottom: 0px;*/
/*width:55%;*/
/*height: 230px;*/
/*!*background-color: #ededed;*!*/
/*!*background-color: #ffffff;*!*/
/*}*/
/*.widget-title{*/
/*margin-left: 1%;*/
/*}*/
/*.renyuan_count ul{*/
/*!*margin-left: 5px;*!*/
/*width:100%;*/
/*height:160px;*/
/*!*background-color:#989898;*!*/
/*}*/
/*.renyuan_count ul li{*/
/*!*margin-top: 1px;*!*/
/*!*margin-left: 1px;*!*/
/*float: left;*/
/*color: #696969;*/
/*list-style-type: none;*/
/*width:25%;*/
/*height: 2.5rem;*/
/*text-align:left;*/
/*background-color: #f7f7f7;*/
/*padding-left: 60px;*/
/*line-height: 40px;*/
/*}*/
/********end***********/
</style>
<body>
<div id="content">
<div id="content-header">
<h1>考勤管理</h1>
</div>
<div class="container-fluid">
<div class="row-fluid">
<div class="span12">
<div class="widget-box">
<div class="widget-title"> <span class="icon"> <i class="icon-list"></i> </span>
<h5>项目名称:武汉市金地天悦</h5>
</div>
<div class="widget-content nopadding">
<table class="table table-bordered ">
<tbody>
<tr class="even gradeC">
<td>当前人数:111人</td>
<td>施工人员:100人</td>
<td>特种作业:15人</td>
<td class="center">未到人数:2人</td>
</tr>
<tr class="odd gradeA">
<td>水泥工&nbsp&nbsp :50人</td>
<td>钢筋工&nbsp&nbsp :10人</td>
<td>土木工&nbsp&nbsp :5人</td>
<td class="center">架子工&nbsp&nbsp :5人</td>
</tr>
<tr class="even gradeA">
<td>防水工&nbsp&nbsp :5人</td>
<td>砌筑工&nbsp&nbsp :7人</td>
<td>塔吊工&nbsp&nbsp :5人</td>
<td class="center">监理&nbsp&nbsp &nbsp&nbsp :7人</td>
</tr>
</tbody>
</table>
</div>
<!--<table class="table table-bordered table-striped " >-->
<!--<tbody>-->
<!--<tr class="even gradeC">-->
<!--<td>当前人数:111人</td>-->
<!--<td>施工人员:100人</td>-->
<!--<td>特种作业:15人</td>-->
<!--<td class="center">未到人数:2人</td>-->
<!--</tr>-->
<!--<tr class="odd gradeA">-->
<!--<td>水泥工&nbsp&nbsp :50人</td>-->
<!--<td>钢筋工&nbsp&nbsp :10人</td>-->
<!--<td>土木工&nbsp&nbsp :5人</td>-->
<!--<td class="center">架子工&nbsp&nbsp :5人</td>-->
<!--</tr>-->
<!--<tr class="even gradeA">-->
<!--<td>防水工&nbsp&nbsp :5人</td>-->
<!--<td>砌筑工&nbsp&nbsp :7人</td>-->
<!--<td>塔吊工&nbsp&nbsp :5人</td>-->
<!--<td class="center">监理&nbsp&nbsp &nbsp&nbsp :7人</td>-->
<!--</tr>-->
<!--</tbody>-->
<!--</table>-->
<div class="widget-title"> <span class="icon"><i class="icon-th"></i></span>
<h5>工人列表</h5>
<!--许永霖-->
<!-- <div class="demo1">
<ul>
<li>
<div data-date="12-02-2012" class="input-append date datepicker ">
<h5>起始时间</h5>
<input type="text" data-date-format="mm-dd-yyyy" class="span7">
<span class="add-on"><i class="icon-th"></i></span>
</div>
</li>
<li>
<div data-date="12-02-2012" class="input-append date datepicker ">
<h5>结束时间</h5>
<input type="text" data-date-format="mm-dd-yyyy" class="span7">
<span class="add-on"><i class="icon-th"></i></span>
</div>
</li>
<li><button style="height: 30px ; background-color: #989898;color: white;width: 75px">搜索</button></li>
</ul>
</div>-->
<!--end-->
</div>
<div class="widget-content nopadding">
<table class="table table-bordered ">
<thead id="tb">
<tr>
<th>#</th>
<th>员工号</th>
<th>姓名</th>
<th>性别</th>
<th>年龄</th>
<th>电话</th>
<th>工种类别</th>
<th>进入时间</th>
<th>出门时间</th>
<th>操作</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
<div class="pagination alternate">
<ul style="float: right">
<li><a href="#">Prev</a></li>
<li class="active"> <a href="#">1</a> </li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">Next</a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="js/jquery.min.js"></script>
<script src="js/jquery-3.1.0.js"></script>
<script src="js/jquery.ui.custom.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/jquery.uniform.js"></script>
<script src="js/select2.min.js"></script>
<script src="js/jquery.dataTables.min.js"></script>
<script src="js/matrix.js"></script>
<script src="js/matrix.tables.js"></script>
<!--日历-->
<script src="js/bootstrap-colorpicker.js"></script>
<script src="js/bootstrap-datepicker.js"></script>
<script src="js/jquery.toggle.buttons.html"></script>
<script src="js/masked.js"></script>
<script src="js/jquery.uniform.js"></script>
<script src="js/matrix.form_common.js"></script>
<script src="js/wysihtml5-0.3.0.js"></script>
<script src="js/jquery.peity.min.js"></script>
<script src="js/bootstrap-wysihtml5.js"></script>
<!--日历-->
<!--***********许********-->
<td></td>
<td></td>
<td></td>
<td>38</td>
<td>13563968569</td>
<td></td>
<td>2017/8/10 7:</td>
<td>2017/8/10 18:</td>
<script>
window.onload = function () {
var datanav = [
{ "usernum": "20130501","name": "张亮","sex": "", "age": "35", "phone": "13566521458", "worktype":"建筑电工","intime":"2017/8/10 7:26" , "outtime": "2017/8/10 18:00","operation":"编辑 删除" },
{ "usernum": "20120502","name": "王强","sex": "", "age": "40", "phone": "13320322568", "worktype":"建筑架子工","intime":"2017/8/10 7:27" , "outtime": "2017/8/10 18:02","operation":"编辑 删除" },
{ "usernum": "20160203","name": "李力","sex": "", "age": "41", "phone": "13725843156", "worktype":"建筑起重信号工","intime":"2017/8/10 7:20" , "outtime": "2017/8/10 18:03","operation":"编辑 删除" },
{ "usernum": "20140603","name": "郭靖","sex": "", "age": "32", "phone": "13325478964", "worktype":"建筑起重机械司机","intime":"2017/8/10 7:25" ,"outtime": "2017/8/10 18:01","operation":"编辑 删除" },
{ "usernum": "20150308","name": "王朝强","sex": "", "age": "39", "phone": "13634869512", "worktype":"建筑塔吊工","intime":"2017/8/10 7:24" , "outtime": "2017/8/10 18:05","operation":"编辑 删除" },
{ "usernum": "20140509","name": "赵清龙","sex": "", "age": "38", "phone": "13320113659", "worktype":"建筑架子工","intime":"2017/8/10 7:23" , "outtime": "2017/8/10 18:05","operation":"编辑 删除" },
{ "usernum": "20140510","name": "王凯","sex": "", "age": "38", "phone": "13563968569", "worktype":"建筑中小型机械操作工","intime":"2017/8/10 7:27" , "outtime": "2017/8/10 18:05","operation":"编辑 删除" },
];
var tb = document.getElementById("tt");
for (var i = 0; i < datanav.length; i++) {
var row = tb.insertRow(tb.rows.length);
var c1 = row.insertCell(1);
c1.innerHTML = datanav[i].usernum;
var c2 = row.insertCell(2);
c2.innerHTML = datanav[i].name;
var c3 = row.insertCell(3);
c3.innerHTML = datanav[i].sex;
var c4 = row.insertCell(4);
c4.innerHTML = datanav[i].age;
}
}
window.onload = function () {
var datanav = [
{ "usernum": "20130501","name": "张亮","sex": "", "age": "35", "phone": "13566521458", "worktype":"建筑电工","intime":"2017/8/10 7:26" , "outtime": "2017/8/10 18:00","operation":"编辑 删除" },
{ "usernum": "20120502","name": "王强","sex": "", "age": "40", "phone": "13320322568", "worktype":"建筑架子工","intime":"2017/8/10 7:27" , "outtime": "2017/8/10 18:02","operation":"编辑 删除" },
{ "usernum": "20160203","name": "李力","sex": "", "age": "41", "phone": "13725843156", "worktype":"建筑起重信号工","intime":"2017/8/10 7:20" , "outtime": "2017/8/10 18:03","operation":"编辑 删除" },
{ "usernum": "20140603","name": "郭靖","sex": "", "age": "32", "phone": "13325478964", "worktype":"建筑起重机械司机","intime":"2017/8/10 7:25" ,"outtime": "2017/8/10 18:01","operation":"编辑 删除" },
{ "usernum": "20150308","name": "王朝强","sex": "", "age": "39", "phone": "13634869512", "worktype":"建筑塔吊工","intime":"2017/8/10 7:24" , "outtime": "2017/8/10 18:05","operation":"编辑 删除" },
{ "usernum": "20140509","name": "赵清龙","sex": "", "age": "38", "phone": "13320113659", "worktype":"建筑架子工","intime":"2017/8/10 7:23" , "outtime": "2017/8/10 18:05","operation":"编辑 删除" },
{ "usernum": "20140510","name": "王凯","sex": "", "age": "38", "phone": "13563968569", "worktype":"建筑中小型机械操作工","intime":"2017/8/10 7:27" , "outtime": "2017/8/10 18:05","operation":"编辑 删除" },
];
var tb = document.getElementById("tb");
for (var i = 0; i < datanav.length; i++) {
var row = tb.insertRow(tb.rows.length);
var c0 = row.insertCell(0);
c0.innerHTML = i+1;
var c1 = row.insertCell(1);
c1.innerHTML = datanav[i].usernum;
var c2 = row.insertCell(2);
c2.innerHTML = datanav[i].name;
var c3 = row.insertCell(3);
c3.innerHTML = datanav[i].sex;
var c4 = row.insertCell(4);
c4.innerHTML = datanav[i].age;
var c5 = row.insertCell(5);
c5.innerHTML = datanav[i].phone;
var c6 = row.insertCell(6);
c6.innerHTML = datanav[i].worktype;
var c7 = row.insertCell(7);
c7.innerHTML = datanav[i].intime;
var c8 = row.insertCell(8);
c8.innerHTML = datanav[i].outtime;
var c9 = row.insertCell(9);
c9.innerHTML = datanav[i].operation;
/* var c10 = row.insertCell(10);
c10.innerHTML = datanav[i].worktype;
var c11 = row.insertCell(11);
c11.innerHTML = datanav[i].level;
var c12 = row.insertCell(12);
c12.innerHTML = datanav[i].zuoyeleibie;
var c13 = row.insertCell(13);
c13.innerHTML = datanav[i].attendance;
var c14 = row.insertCell(14);
c14.innerHTML = datanav[i].operation;*/
}
}
</script>
<!--*********end**************-->
</body>
</html>
Loading...
马建仓 AI 助手
尝试更多
代码解读
代码找茬
代码优化