考勤统计

src/projects/business/apis/Master/attendance.js

@@ -87,11 +87,22 @@ export function getAttednance(params) {
 	})
 }
 
-//获取考勤统计列表更多
-export function getMoreList(params) {
+//获取考勤统计人员更多
+export function getPersonList(params) {
 	return request({
 		url: '/mobile/workAttendance/workAttendanceStatByCompanyId',
 		params: params,
 		method: 'get',
 	})
 }
+
+//获取考勤统计公司列表
+export function getCompanyList(companyId) {
+	return request({
+		url: '/mobile/workAttendance/workAttendanceStatCompanyList',
+		params: {
+			companyId: companyId
+		},
+		method: 'get',
+	})
+}

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

@@ -9,95 +9,54 @@
 				<a class="mui-col-xs-6" @click="selectTime">{{timeName}}<span class="mui-icon iconfont icon-xiajiantou"></span></a>
 			</div>
 			<div class="vongi-bread">
-				<a href="" class="color4fc5f7">首页</a><span class="mui-icon mui-icon-forward"></span>
-				<a href="" class="color4fc5f7">湖北荆鹏软件集团有限公司</a><span class="mui-icon mui-icon-forward"></span>
-				<a href="">行政服务中心</a>
+				<template v-for="(item,index) in navList">
+					<a :class="navCanClick(item,index)?'color4fc5f7':''" @click="reloadItem(item,index)" v-text="item.name"></a>
+					<span v-if="index!=navList.length-1" class="mui-icon mui-icon-forward"></span>
+				</template>
 			</div>
 			<div class="vongi-kqtj-center">
-				<ul class="mui-table-view margin10">
-					<li class="mui-table-view-cell">
-						<a class="mui-navigate-right" href="#">行政服务中心（14）</a>
-					</li>
-					<li class="mui-table-view-cell">
-						<a class="mui-navigate-right" href="#">石油工程中心（14）</a>
-					</li>
-					<li class="mui-table-view-cell">
-						<a class="mui-navigate-right" href="#">信息工程中心（11）</a>
-					</li>
-					<li class="mui-table-view-cell">
-						<a class="mui-navigate-right" href="#">运营中心（9）</a>
+				<ul v-if="!isLast" class="mui-table-view margin10">
+					<li v-for="(item,index) in companyList" class="mui-table-view-cell">
+						<a class="mui-navigate-right" @click="reloadNext(item)">{{item.name}}（{{item.number}}）</a>
 					</li>
 				</ul>
-				<div class="vongi-work">
+				<div v-else class="vongi-work">
 					<ul class="mui-table-view">
-						<li class="mui-table-view-cell">
-							姓名
-							<div class="mui-media-body">
-								<button type="button" class="mui-btn  mui-btn-primary mui-btn-outlined">设备打卡</button>
-								<span class="color55f868">正常</span>
-							</div>
-						</li>
-						<li class="mui-table-view-cell">
-							姓名
-							<div class="mui-media-body">
-								<button type="button" class="mui-btn  mui-btn-danger mui-btn-outlined">异地打卡</button>
-								<span class="colorf8b155">早退</span>
-							</div>
-						</li>
-						<li class="mui-table-view-cell">
-							姓名
-							<div class="mui-media-body">
-								<button type="button" class="mui-btn  mui-btn-royal mui-btn-outlined">补  卡</button>
-								<span class="colorf8b155">迟到</span>
-							</div>
-						</li>
-						<li class="mui-table-view-cell">
-							姓名
-							<div class="mui-media-body">
-								<button type="button" class="mui-btn  mui-btn-primary mui-btn-outlined">设备打卡</button>
-								<span class="colorfe616c">缺卡</span>
-							</div>
-						</li>
-						<li class="mui-table-view-cell">
+						<template v-for="(iten,index) in recordList">
+							<li v-for="(item,index) in iten.personList" class="mui-table-view-cell">
+								{{item.name}}
+								<div class="mui-media-body">
+									<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>
+						<!-- <li class="mui-table-view-cell">
 							<a class="vongi-lodtext">加载更多统计数据<span class="iconfont icon-xiajiantou_huaban"></span></a>
-						</li>
+						</li> -->
 					</ul>
 				</div>
 				<!--部门-->
-				<!--<div class="vongi-work">
+				<div v-if="!isLast" class="vongi-work">
 					<ul class="mui-table-view">
-						<li class="mui-table-view-cell">
-							{{姓名}}
-							<div class="mui-media-body">
-								<button type="button" class="mui-btn  mui-btn-primary mui-btn-outlined">设备打卡</button>
-								<span class="color55f868">正常</span>
-							</div>
-						</li>
-						<li class="mui-table-view-cell">
+						<template v-for="(iten,index) in recordList">
+							<li v-for="(item,index) in iten.personList" class="mui-table-view-cell">
+								{{item.name}}
+								<div class="mui-media-body">
+									<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>
+						<!-- <li class="mui-table-view-cell">
 							<a class="vongi-lodtext">加载更多统计数据<span class="iconfont icon-xiajiantou_huaban"></span></a>
-						</li>
+						</li> -->
 					</ul>
-				</div>-->
+				</div>
 			</div>
-			<!--原来的-->
-			<!-- <ul class="mui-table-view mui-table-view-chevron">
-				<li v-for="(item,index) in recordList" class="mui-table-view-cell mui-collapse vongi-work">
-					<a class="mui-navigate-right" v-text="item.companyName"></a>
-					<ul class="mui-table-view mui-table-view-chevron">
-						<li v-for="(iten,inden) in item.personList" class="mui-table-view-cell" @click="goToInfo(iten)">
-							{{iten.name}}
-							<div class="mui-media-body">
-								<button type="button" class="mui-btn  mui-btn-primary mui-btn-outlined" v-show="iten.remark" v-text="iten.remark"></button>
-								<span class="color55f868" v-show="iten.result" v-text="iten.result"></span>
-							</div>
-						</li>
-						<li v-if="item.totalPage>1 && item.pageNumber<item.totalPage" class="mui-table-view-cell">
-							<a @click="loadMore(item.companyId,index)" class="vongi-lodtext">加载更多统计数据<span class="iconfont icon-xiajiantou_huaban"></span></a>
-						</li>
-					</ul>
-				</li>
-			</ul> -->
-			<h6>本时段考勤统计: 已打卡<span class="color55f868" v-text="absentCount"></span>人/缺卡<span class="colorfe616c" v-text="workCount"></span>人</h6>
+			<h6>本时段考勤统计: 已打卡<span class="color55f868" v-text="workCount"></span>人/缺卡<span class="colorfe616c" v-text="absentCount"></span>人</h6>
 		</div>
 
 		<loading :visible="isLoading"></loading>
@@ -133,13 +92,25 @@
 
 				subForm: {
 					queryDate: '',
-					alarmConfigId: ''
+					alarmConfigId: '',
+					companyId: '',
 				},
 				absentCount: 0,
 				workCount: 0,
 				recordList: [],
 				timeList: [],
 				timeName: '',
+
+				companyList: [],
+				isLast: false,
+				nowLevel: 0,
+				navList: [{
+					name: '首页',
+					id: '',
+					hasNext: true,
+				}],
+
+				resultColor: ['colorfe616c', 'color55f868', 'colorf8b155', 'colorf8b155'],
 			}
 		},
 		created() {
@@ -148,8 +119,38 @@
 		methods: {
 			//获取列表
 			getList() {
+				if (this.isLast) {
+					this.getPersonList();
+				} else {
+					this.getCompanyList();
+				}
+			},
+			//获取公司列表
+			getCompanyList() {
+				this.isLoading = true;
+				API_Attendance.getCompanyList(this.subForm.companyId).then(response => {
+					this.isLoading = false;
+
+					this.companyList = response.list;
+
+				}).catch(error => {
+					this.isLoading = false;
+					mui.toast(error);
+				})
+			},
+			//获取下级公司列表
+			reloadNext(item) {
+				this.subForm.companyId = item.id;
+				this.nowLevel++;
+				this.getCompanyList();
+				this.navList.push(item);
+
+				this.isLast = !item.hasNext;
+			},
+			//获取人员列表
+			getPersonList() {
 				this.isLoading = true;
-				API_Attendance.getAttednance(this.subForm).then(response => {
+				API_Attendance.getPersonList(this.subForm).then(response => {
 					this.isLoading = false;
 
 					this.recordList = response.groupList;
@@ -161,6 +162,26 @@
 					mui.toast(error);
 				})
 			},
+			//面包屑选择加载
+			reloadItem(item, index) {
+				this.navList = this.navList.slice(0, index + 1);
+				this.nowLevel = index;
+				this.subForm.companyId = item.id;
+				this.getCompanyList();
+				this.isLast = !item.hasNext;
+			},
+			//判断面包屑是否可点击
+			navCanClick(item, index) {
+				if (index > 0) {
+					if (index == this.nowLevel) {
+						return false;
+					} else {
+						return true;
+					}
+				} else {
+					return true;
+				}
+			},
 			//选择日期
 			selectData() {
 				var _this = this;
@@ -247,27 +268,6 @@
 					}
 				}
 			},
-			//加载更多
-			loadMore(companyId, index) {
-				this.isLoading = true;
-				this.recordList[index]['pageNumber']++;
-				let data = {
-					queryDate: this.subForm.queryDate,
-					alarmConfigId: this.subForm.alarmConfigId,
-					pageNum: this.recordList[index]['pageNumber'],
-					companyId: companyId,
-				};
-				API_Attendance.getMoreList(data).then(response => {
-					this.isLoading = false;
-
-					this.recordList[index]['personList'] = this.recordList[index]['personList'].concat(response['groupList'][0][
-						'personList'
-					])
-				}).catch(error => {
-					this.isLoading = false;
-					mui.toast(error);
-				})
-			},
 			asynCallBack() {
 
 			},
@@ -286,6 +286,19 @@
 				person_data: 'person_data',
 				person_popedom: 'person_popedom',
 			})
+		},
+		watch: {
+			'subForm.companyId': {
+				handler(newValue) {
+					if (newValue) {
+						this.getPersonList();
+					} else {
+						this.recordList = [];
+					}
+				},
+				immediate: true,
+				deep: true
+			},
 		}
 	}
 </script>

src/projects/business/views/Master/Company/RegisterSelectDepartment.vue

@@ -1,6 +1,5 @@
 <template>
 	<div>
-		<!--<a class="mui-btn mui-btn-grey mui-pull-right">确定</a>-->
 		<common ref="common" @asynCallBack="asynCallBack"></common>
 		<top-header :pageTitle="pageTitle" :rightLink="rightLink" :doRightLink="doRightLink"></top-header>