考勤统计改版

src/assets/css/xpwyfyy.css

@@ -3968,20 +3968,23 @@ h3 {
 .margin77{
 	margin-bottom:77px
 }
-.vongi-kqtj-bot .vongi-clasadmin-ma{
+.vongi-kqtj-bot .vongi-clasadmin-ma,
+.vongi-kqtj-list .vongi-clasadmin-m{
 	position:relative
 }
-.vongi-kqtj-bot .vongi-clasadmin-ma:after{
+.vongi-kqtj-bot .vongi-clasadmin-ma:after,
+.vongi-kqtj-list .vongi-clasadmin-ma:after{
 	content: "";
-	height:40px;
+	height:30px;
 	width:1px;
 	background:#eee;
 	position:absolute;
 	right:0;
 	top:50%;
-	margin-top:-20px
+	margin-top:-15px
 }
-.vongi-kqtj-bot .vongi-clasadmin-ma:last-child:after{
+.vongi-kqtj-bot .vongi-clasadmin-ma:last-child:after,
+.vongi-kqtj-list .vongi-clasadmin-ma:last-child:after{
 	width:0
 }
 .vongi-kqtj-bot .vongi-clasadmin-list{
@@ -4001,3 +4004,26 @@ h3 {
 .vongi-kqtj-time{
 	margin-left:5px;
 }
+.vongi-kqtj-list .mui-card{
+	margin:0;
+	box-shadow: initial;
+	margin-bottom:10px
+}
+.vongi-kqtj-list .mui-card-content-inner{
+	padding:10px 0
+}
+.vongi-kqtj-list .mui-card-content-inner .mui-navigate-right{
+	position:relative;
+	padding-right:15px
+}
+.vongi-kqtj-list .mui-card-content-inner a:after{
+	right:0
+}
+.vongi-kqtj-list .mui-card-content-inner a .iconfont{
+	font-size:14px;
+	margin-right:3px
+}
+.vongi-kqtj-list .mui-card-header button{
+	border-radius: 15px;
+	padding:3px 15px
+}

src/projects/business/views/Master/Attendance/StatisticList.vue

@@ -5,8 +5,8 @@
 
 		<div class="mui-content vongi-admin-kqtj">
 			<div class="fyy-temper-date" style="position: fixed;width: 100%;top: 45px;z-index: 10;">
-				<a class="mui-col-xs-6" @click="selectData">{{subForm.queryDate}}<span class="mui-icon iconfont icon-xiajiantou"></span></a>
-				<a class="mui-col-xs-6" @click="selectTime">{{timeName}}<span class="mui-icon iconfont icon-xiajiantou"></span></a>
+				<a class="mui-col-xs-12" @click="selectData">{{subForm.queryDate}}<span class="mui-icon iconfont icon-xiajiantou"></span></a>
+				<!-- <a class="mui-col-xs-6" @click="selectTime">{{timeName}}<span class="mui-icon iconfont icon-xiajiantou"></span></a> -->
 			</div>
 			<div class="vongi-bread" style="margin-top: 45px;">
 				<template v-for="(item,index) in navList">
@@ -42,7 +42,40 @@
 					<div v-if="recordList.length>0 && recordList[0]['personList'].length>0" class="mui-content-padded">
 						<h5 class="flew-items"><span class="iconfont icon-guanliyuan color4fc5f7"></span>组织人员</h5>
 					</div>
-					<ul class="mui-table-view">
+					<div class="vongi-kqtj-list">
+						<div class="mui-card">
+							<div class="mui-card-header">
+								凡佳佳
+								<button type="button" class="mui-btn  mui-btn-royal mui-btn-outlined">补卡</button>
+							</div>
+							<div class="mui-card-content">
+								<div class="mui-card-content-inner flew">
+									<div class="mui-col-xs-3 vongi-center vongi-clasadmin-ma">
+										<p class="">08:25</p>
+										<a class="mui-media-body mui-navigate-right color55f868" href="">
+											<span class="iconfont icon-_renlianshibie color4fc5f7"></span>正常</a>
+									</div>
+									<div class="mui-col-xs-3 vongi-center vongi-clasadmin-ma">
+										<p class="">08:25</p>
+										<a class="mui-media-body mui-navigate-right colorda94f8" href="">
+											<span class="iconfont icon-_renlianshibie color4fc5f7"></span>请假</a>
+									</div>
+									<div class="mui-col-xs-3 vongi-center vongi-clasadmin-ma">
+										<p class="">08:25</p>
+										<a class="mui-media-body mui-navigate-right colorf8b155" href="">
+											<span class="iconfont icon-_renlianshibie color4fc5f7"></span>迟到</a>
+									</div>
+									<div class="mui-col-xs-3 vongi-center vongi-clasadmin-ma">
+										<p class="">08:25</p>
+										<a class="mui-media-body colorfe616c">
+											缺卡</a>
+									</div>
+								</div>
+							</div>
+						</div>
+						
+					</div>
+					<!-- <ul class="mui-table-view">
 						<template v-for="(iten,index) in recordList">
 							<li v-show="filterStatus=='-1' || item.result==filterStatus" v-for="(item,index) in iten.personList" class="mui-table-view-cell">
 								<div class="mui-media-body">
@@ -50,41 +83,49 @@
 									<span v-if="item.result=='0'" class="mui-h6 vongi-kqtj-time">{{timeName}}</span>
 									<span v-else class="mui-h6 vongi-kqtj-time">打卡时间：{{item.workTime}}</span>
 								</div>
-								<div class="mui-media-body">
+								<div class="mui-media-body"> -->
 									<!--工作状态:1-工作，2-外出，3-出差，4-休假-->
 									<!--result:0-缺卡，1-正常，2-迟到，3-早退-->
 									<!--type:0=设备打卡，1=外勤打卡、2=补卡-->
-									<button type="button" class="mui-btn  mui-btn-primary mui-btn-outlined" v-if="item.workStatus!=1" v-text="item.workStatusN"></button>
+									<!-- <button type="button" class="mui-btn  mui-btn-primary mui-btn-outlined" v-if="item.workStatus!=1" v-text="item.workStatusN"></button>
 									<button type="button" class="mui-btn  mui-btn-primary mui-btn-outlined" v-if="item.remark && item.result!='0'"
 									 v-text="item.remark"></button>
 									<span :class="resultColor[item.result]" v-if="item.resultN" v-text="item.resultN"></span>
 								</div>
 							</li>
-						</template>
+						</template> -->
 						<!-- <li class="mui-table-view-cell">
 							<a class="vongi-lodtext">加载更多统计数据<span class="iconfont icon-xiajiantou_huaban"></span></a>
 						</li> -->
-					</ul>
+					<!-- </ul> -->
 				</div>
 
 				<div class="vongi-clasadmin vongi-kqtj-bot">
 					<div class="vongi-clasadmin-list">
-						<div @click="filter('1',workCount)" class="vongi-clasadmin-ma mui-col-xs-3">
+						<div @click="filter('1',workCount)" class="vongi-clasadmin-ma mui-col-xs-2">
 							<span :class="['-1','1'].indexOf(filterStatus)>-1?'color55f868':'colorAAA'" v-text="workCount"></span>
 							<div class="mui-media-body">正常</div>
 						</div>
-						<div @click="filter('2',lateCount)" class="vongi-clasadmin-ma mui-col-xs-3">
+						<div @click="filter('2',lateCount)" class="vongi-clasadmin-ma mui-col-xs-2">
 							<span :class="['-1','2'].indexOf(filterStatus)>-1?'colorf8b155':'colorAAA'" v-text="lateCount"></span>
 							<div class="mui-media-body">迟到</div>
 						</div>
-						<div @click="filter('3',leaveEarlyCount)" class="vongi-clasadmin-ma mui-col-xs-3">
+						<div @click="filter('3',leaveEarlyCount)" class="vongi-clasadmin-ma mui-col-xs-2">
 							<span :class="['-1','3'].indexOf(filterStatus)>-1?'colorda94f8':'colorAAA'" v-text="leaveEarlyCount"></span>
 							<div class="mui-media-body">早退</div>
 						</div>
-						<div @click="filter('0',absentCount)" class="vongi-clasadmin-ma mui-col-xs-3">
+						<div @click="filter('0',absentCount)" class="vongi-clasadmin-ma mui-col-xs-2">
 							<span :class="['-1','0'].indexOf(filterStatus)>-1?'colorfe616c':'colorAAA'" v-text="absentCount"></span>
 							<div class="mui-media-body">缺卡</div>
 						</div>
+						<div class="vongi-clasadmin-ma mui-col-xs-2">
+							<span class="colorda94f8">0</span>
+							<div class="mui-media-body">出差</div>
+						</div>
+						<div class="vongi-clasadmin-ma mui-col-xs-2">
+							<span class="colorda94f8">23</span>
+							<div class="mui-media-body">请假</div>
+						</div>
 					</div>
 				</div>
 			</div>