Merge branch 'master' of http://47.92.161.104:10080/wgl/jp-xpgj

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

@@ -50,3 +50,20 @@ export function getApprovalList(params) {
 		method: 'post',
 	})
 }
+
+//获取补卡审批列表
+export function getVerifyList(params) {
+	return request({
+		url: '/mobile/workAttendance/adminListPatchCard',
+		data: Qs.stringify(params),
+		method: 'post',
+	})
+}
+//补卡审批
+export function doVerify(params) {
+	return request({
+		url: '/mobile/workAttendance/approvalPatchCard',
+		data: Qs.stringify(params),
+		method: 'post',
+	})
+}

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

@@ -12,7 +12,7 @@
 					{{detail.personName}}
 					<p class='mui-ellipsis'><span class="colorfe616c">{{detail.typeN}}</span>申请</p>
 				</div>
-				<button type="button" class="mui-btn mui-btn-success mui-btn-outlined">
+				<button type="button" :class="'mui-btn mui-btn-success mui-btn-outlined '+(detail.status>0?(detail.status==1?'status_a':'status_r'):'')">
 					{{detail.status>0?(detail.status==1?'已同意':'已拒绝'):'未审核'}}
 				</button>
 			</div>
@@ -151,4 +151,13 @@
 <style scoped src="$project/assets/css/xpwyfyy.css"></style>
 <style src="$project/assets/css/iconfont.css"></style>
 <style scoped>
+	.status_r {
+		color: #fe616c !important;
+		border: 1px solid #fe616c !important;
+	}
+
+	.status_a {
+		color: #05c8af !important;
+		border: 1px solid #05c8af !important;
+	}
 </style>

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

@@ -20,19 +20,7 @@
 				</ul>
 			</div>
 		</div>
-		<!-- 审批弹窗 -->
-		<!-- <div class="mui-backdrop mui-active" style="display: block;"></div>
-		<div class="mui-card fyy-popup" style="display: block;">
-			<div class="mui-card-header mui-h3">审批意见</div>
-			<div class="mui-card-content">
-				<div class="mui-input-row">
-					<textarea id="textarea" rows="5" placeholder="请输入"></textarea>
-				</div>
-			</div>
-			<div class="vongi-btn">
-				<button class="mui-btn mui-btn-primary ">提交</button>
-			</div>
-		</div> -->
+		
 	</div>
 </template>
 
@@ -62,7 +50,6 @@
 				listForm: {
 					pageIndex: 1,
 					pageSize: 20,
-					token: '',
 					totalPage: 1,
 					result: 0,
 				},

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

@@ -1,99 +1,67 @@
 <template>
-<div>
-    <header class="mui-bar mui-bar-nav">
-			<h1 class="mui-title">补卡审批</h1>
-			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
-		</header>
+	<div>
+		<common @asynCallBack="asynCallBack"></common>
+		<top-header :pageTitle="pageTitle"></top-header>
+
 		<div class="mui-content vongi-wordcard-sp">
 			<div id="slider" class="mui-slider mui-fullscreen">
 				<div id="sliderSegmentedControl" class="mui-scroll-wrapper mui-slider-indicator mui-segmented-control mui-segmented-control-inverted">
 					<div class="mui-scroll">
-						<a class="mui-control-item mui-active" href="#item1mobile">
-							<span class="fyy-badge">待处理<span class="mui-badge">5</span></span>
+						<a @click="reloadList(0)" :class="'mui-control-item '+(listForm.status==0?'':'mui-active')">
+							<span class="fyy-badge">待处理<span class="mui-badge" v-if="firstRecordsTotal" v-text="firstRecordsTotal"></span></span>
 						</a>
-						<a class="mui-control-item" href="#item2mobile">
+						<a @click="reloadList(3)" :class="'mui-control-item '+(listForm.status==3?'mui-active':'')">
 							已处理
 						</a>
 					</div>
 				</div>
 				<div class="mui-slider-group">
-					<div id="item1mobile" class="mui-slider-item mui-control-content mui-active">
-						<div id="scroll1" class="mui-scroll-wrapper">
+
+					<div v-show="listForm.status==0" class="mui-slider-item mui-control-content">
+						<div class="mui-scroll-wrapper">
 							<div class="mui-scroll">
 								<form class="mui-input-group fyy-checkbox">
-									<div class="mui-input-row mui-checkbox mui-left">
-										<label>
-											<a href="adadd.html" class="mui-navigate-right">
-												<div class="mui-media-object mui-pull-left"><img src="~$project/assets/img/zhaop1.jpg"></div>
-												<div class="mui-media-body">
-													冯银银
-													<p class='mui-ellipsis'><span class="colorfe616c">缺勤</span>补卡申请</p>
-												</div>
-											</a>
-										</label>
-										<input name="checkbox" value="Item 1" type="checkbox" checked>
-									</div>
-									<div class="mui-input-row mui-checkbox mui-left">
+									<div v-for="(item,index) in recordList" :key="item.id" class="mui-input-row mui-checkbox mui-left">
 										<label>
-											<a href="" class="mui-navigate-right">
-												<div class="mui-media-object mui-pull-left"><img src="~$project/assets/img/zhaop1.jpg"></div>
+											<router-link :to="{name:'MasterAttendanceInfo',query:{id:item.id}}" class="mui-navigate-right">
+												<div class="mui-media-object mui-pull-left"><img :src="item.faceImageUrl"></div>
 												<div class="mui-media-body">
-													冯银银
-													<p class='mui-ellipsis'><span class="colorfe616c">缺勤</span>补卡申请</p>
+													{{item.personName}}
+													<p class='mui-ellipsis'><span class="colorfe616c" v-text="item.typeN"></span>申请</p>
 												</div>
-											</a>
+											</router-link>
 										</label>
-										<input name="checkbox" value="Item 1" type="checkbox">
-									</div>
-									<div class="mui-input-row mui-checkbox mui-left">
-										<label>
-											<a href="" class="mui-navigate-right">
-												<div class="mui-media-object mui-pull-left"><img src="~$project/assets/img/zhaop1.jpg"></div>
-												<div class="mui-media-body">
-													冯银银
-													<p class='mui-ellipsis'><span class="colorfe616c">缺勤</span>补卡申请</p>
-												</div>
-											</a>
-										</label>
-										<input name="checkbox" value="Item 1" type="checkbox">
+										<input name="checkbox" v-model="selectIdList" :value="item.id" type="checkbox">
 									</div>
 								</form>
 								<div class="fyy-bindfyy-btn">
 									<form class="mui-input-group">
 										<div class="mui-input-row mui-checkbox mui-left">
 											<label>全选</label>
-											<input name="checkbox" value="Item 1" type="checkbox">
+											<input v-model="allSelect" value="1" type="checkbox" @click="selectAll" :checked="recordList.length==selectIdList.length">
 										</div>
 									</form>
-									<button type="button" class="mui-btn mui-btn-danger">拒绝</button>
-									<button type="button" class="mui-btn mui-btn-success">同意</button>
+									<button type="button" class="mui-btn mui-btn-danger" @click="openFrom('2')">拒绝</button>
+									<button type="button" class="mui-btn mui-btn-success" @click="openFrom('1')">同意</button>
 								</div>
 							</div>
 						</div>
 					</div>
-					<div id="item2mobile" class="mui-slider-item mui-control-content">
+
+					<div v-show="listForm.status==3" class="mui-slider-item mui-control-content">
 						<div class="mui-scroll-wrapper">
 							<div class="mui-scroll">
 								<ul class="mui-table-view mui-table-view-chevron">
-									<li class="mui-table-view-cell mui-media">
-										<a class="mui-navigate-right" href="">
-											<div class="mui-media-object mui-pull-left"><img src="~$project/assets/img/zhaop1.jpg"></div>
+									<li v-for="(item,index) in recordList" :key="item.id" class="mui-table-view-cell mui-media">
+										<router-link :to="{name:'MasterAttendanceInfo',query:{id:item.id}}" class="mui-navigate-right">
+											<div class="mui-media-object mui-pull-left"><img :src="item.faceImageUrl"></div>
 											<div class="mui-media-body">
-												冯银银
-												<p class='mui-ellipsis'><span class="colorfe616c">缺勤</span>补卡申请</p>
+												{{item.personName}}
+												<p class='mui-ellipsis'><span class="colorfe616c" v-text="item.typeN"></span>申请</p>
 											</div>
-											<button type="button" class="mui-btn mui-btn-success mui-btn-outlined">已同意</button>
-										</a>
-									</li>
-									<li class="mui-table-view-cell mui-media">
-										<a class="mui-navigate-right" href="">
-											<div class="mui-media-object mui-pull-left"><img src="~$project/assets/img/zhaop1.jpg"></div>
-											<div class="mui-media-body">
-												冯银银
-												<p class='mui-ellipsis'><span class="colorfe616c">缺勤</span>补卡申请</p>
-											</div>
-											<button type="button" class="mui-btn mui-btn-danger mui-btn-outlined">已拒绝</button>
-										</a>
+											<button type="button" :class="'mui-btn mui-btn-success mui-btn-outlined '+(item.status>0?(item.status==1?'status_a':'status_r'):'')"
+											 v-text="item.statusN"></button>
+										</router-link>
 									</li>
 								</ul>
 							</div>
@@ -102,15 +70,205 @@
 
 				</div>
 			</div>
+		</div>
 
+		<!-- 审批弹窗 -->
+		<div v-show="openFromVisible" class="mui-backdrop mui-active"></div>
+		<div v-show="openFromVisible" class="mui-card fyy-popup">
+			<div class="mui-card-header mui-h3">审批意见</div>
+			<div class="mui-card-content">
+				<div class="mui-input-row">
+					<textarea v-model="subForm.content" rows="5" placeholder="请输入"></textarea>
+				</div>
+			</div>
+			<div class="vongi-btn">
+				<button class="mui-btn mui-btn-primary" @click="doAction">提交</button>
+			</div>
 		</div>
-</div>
+
+	</div>
 </template>
 
 <script>
+	import * as API_Attendance from '@/apis/Master/attendance'
+	import Common from '$project/components/Common.vue'
+	import Loading from '$project/components/Loading.vue'
+	import TopHeader from '$project/components/TopHeader.vue'
+	import isReachBottom from '$project/utils/isReachBottom'
+	import {
+		mapGetters,
+		mapMutations
+	} from 'vuex'
+	export default {
+		name: 'MasterAttendanceVerifyList',
+		components: {
+			Common,
+			Loading,
+			TopHeader
+		},
+		data() {
+			return {
+				pageTitle: '补卡审批',
+
+				isLoading: false,
+
+				listForm: {
+					pageIndex: 1,
+					pageSize: 20,
+					totalPage: 1,
+					status: 0,
+				},
+				recordList: [],
+				selectIdList: [],
+				allSelect: [],
+				subForm: {
+					ids: '',
+					content: '',
+					status: ''
+				},
+				//审批内容弹窗显示
+				openFromVisible: false,
+				firstRecordsTotal: 0,
+
+			}
+		},
+		created() {
+
+		},
+		methods: {
+			//获取列表
+			getList() {
+				this.isLoading = true;
+				API_Attendance.getVerifyList(this.listForm).then(response => {
+					if (response) {
+						if (this.listForm.pageIndex == 1) {
+							this.recordList = response.data;
+							this.listForm.pageIndex = response.pageNumber;
+							this.listForm.totalPage = response.totalPage;
+						} else {
+							this.recordList = [
+								...this.recordList,
+								...response.data
+							];
+						}
+					}
+
+					if (this.listForm.status == 0) {
+						this.firstRecordsTotal = response.recordsTotal;
+					}
+
+					this.listForm.pageIndex++;
+					this.isLoading = false;
+				}).catch(error => {
+					this.isLoading = false;
+					mui.toast(error);
+				})
+			},
+			//下拉事件
+			handleScrool() {
+				if (isReachBottom()) {
+					console.log('到达底部')
+					if (this.listForm.pageIndex <= this.listForm.totalPage && this.isLoading == false) {
+						this.getList();
+					} else {
+						return;
+					}
+				}
+			},
+			//切换
+			reloadList(status) {
+				this.listForm.status = status;
+				this.listForm.pageIndex = 1;
+				this.getList();
+			},
+			//选择所有
+			selectAll() {
+				if (this.allSelect.length) {
+					this.selectIdList = [];
+				} else {
+					var selectIdList = [];
+					this.recordList.forEach(function(item, index) {
+						selectIdList.push(item.id);
+					})
+					this.selectIdList = selectIdList;
+				}
+			},
+			//显示内容表单
+			openFrom(status) {
+				if (!this.selectIdList.length) {
+					mui.toast('请选择要处理的信息');
+				} else {
+					this.subForm.status = status;
+					this.openFromVisible = true;
+				}
+			},
+			//检测表单
+			checkForm() {
+				if (!this.subForm.ids) {
+					mui.toast('请选择要处理的信息');
+					return false;
+				} else if (!this.subForm.content) {
+					mui.toast('请填写审核意见');
+					return false;
+				} else {
+					return true;
+				}
+			},
+			//同意拒绝
+			doAction() {
+				this.subForm.ids = this.selectIdList.join(',');
+				if (this.checkForm()) {
+					var btnArray = ['否', '是'];
+					var _this = this;
+					mui.confirm('确认当操作？', '提示', btnArray, function(e) {
+						_this.isLoading = true;
+						API_Attendance.doVerify(_this.subForm).then(response => {
+							_this.isLoading = false;
+
+							_this.openFromVisible = false;
+							_this.listForm.pageIndex = 1;
+							_this.getList();
+						}).catch(error => {
+							_this.isLoading = false;
+							mui.toast(error);
+						})
+					});
+				}
+			},
+			asynCallBack() {
+
+			},
+		},
+		mounted() {
+			this.getList();
+			//监控下拉加载事件
+			var _this = this;
+			window.addEventListener('scroll', _this.handleScrool);
+		},
+		destroyed() {
+			//销毁监听事件
+			var _this = this;
+			window.removeEventListener('scroll', _this.handleScrool);
+		},
+		computed: {
+			...mapGetters({
+				openId: 'wx_openid',
+				token: 'token',
+			})
+		}
+	}
 </script>
 
 <style scoped src="$project/assets/css/xpwyfyy.css"></style>
 <style src="$project/assets/css/iconfont.css"></style>
-<style>
+<style scoped>
+	.status_r {
+		color: #fe616c !important;
+		border: 1px solid #fe616c !important;
+	}
+
+	.status_a {
+		color: #05c8af !important;
+		border: 1px solid #05c8af !important;
+	}
 </style>