外出登记与外出审查修改

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

@@ -9,7 +9,7 @@
 					<div class="flew"><img :src="detail.faceImageUrl" width="50" v-viewer /></div>
 					<h4>{{detail.personName}} 登记 <span class="color4fc5f7" v-text="detail.typeN"></span></h4>
 				</div>
-				<button class="mui-btn  mui-btn-primary mui-btn-outlined" :style="getColor(detail.status)" v-text="detail.remark?'已审查':'未审查'"></button>
+				<button class="mui-btn  mui-btn-primary mui-btn-outlined" :style="getColor(detail)" v-text="detail.remark?'已审查':'未审查'"></button>
 			</div>
 			<form class="mui-input-group margin10">
 				<div class="mui-input-row">
@@ -176,14 +176,12 @@
 				})
 			},
 			//获取状态颜色
-			getColor(status) {
+			getColor(item) {
 				var color = '';
-				if (status == '0') {
-					color = '#4fc5f7';
-				} else if (status == '1') {
+				if (item.remark) {
 					color = '#55f868';
-				} else if (status == '2') {
-					color = '#fe616c';
+				} else {
+					color = '#4fc5f7';
 				}
 				return 'color:' + color + ';border-color:' + color + ';';
 			},

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

@@ -15,16 +15,16 @@
 							<p class='mui-ellipsis'>外出事由:{{item.content}}</p>
 							<p class='flew-sp flew-items'>
 								预估时长:{{item.estimatedTime}}小时
-								<button type="button" :style="getColor(item.status)" class="mui-btn mui-btn-primary mui-btn-outlined" v-text="item.remark?'已审查':'未审查'"></button>
+								<button type="button" :style="getColor(item)" class="mui-btn mui-btn-primary mui-btn-outlined" v-text="item.remark?'已审查':'未审查'"></button>
 							</p>
 						</router-link>
 					</li>
 				</ul>
 			</div>
 		</div>
-		
+
 		<NullList :remark="'暂无申请记录'" v-if="!recordList.length"></NullList>
-		
+
 		<div class="fyy-footer">
 			<div class="bindfyy-btn"><button @click="goToForm" type="submit" class="mui-btn mui-btn-primary ">填写外出登记单</button></div>
 		</div>
@@ -110,14 +110,12 @@
 				})
 			},
 			//获取状态颜色
-			getColor(status) {
+			getColor(item) {
 				var color = '';
-				if (status == '0') {
-					color = '#4fc5f7';
-				} else if (status == '1') {
+				if (item.remark) {
 					color = '#55f868';
-				} else if (status == '2') {
-					color = '#fe616c';
+				} else {
+					color = '#4fc5f7';
 				}
 				return 'color:' + color + ';border-color:' + color + ';';
 			},

src/projects/business/views/Master/Egress/VerifyInfo.vue

@@ -3,81 +3,100 @@
 		<common @asynCallBack="asynCallBack" :doLoading="true"></common>
 		<top-header :pageTitle="pageTitle"></top-header>
 
-		<div class="mui-content vongi-wordcard">
-			<div class="mui-content-padded vongi-wordcard-top">
-				<div class="mui-media-object mui-pull-left">
-					<img :src="detail.faceImageUrl">
+		<div v-if="detail.personName" class="mui-content vongi-qingjiadt margin60">
+			<div class="vongi-qingjiadt-head flew-sp">
+				<div class="flew-items">
+					<div class="flew"><img :src="detail.faceImageUrl" width="50" v-viewer /></div>
+					<h4>{{detail.personName}} 登记 <span class="color4fc5f7" v-text="detail.typeN"></span></h4>
 				</div>
-				<div class="mui-media-body">
-					{{detail.personName}}
-					<p class='mui-ellipsis'><span class="color4fc5f7" v-text="detail.typeN"></span>申请</p>
+				<button class="mui-btn  mui-btn-primary mui-btn-outlined" :style="getColor(detail)" v-text="detail.remark?'已审查':'未审查'"></button>
+			</div>
+			<form class="mui-input-group margin10">
+				<div class="mui-input-row">
+					<label>所属部门</label>
+					<span v-text="detail.companyName"></span>
+				</div>
+				<div class="mui-input-row">
+					<label>外出地点</label>
+					<span v-text="detail.destination"></span>
+				</div>
+				<div class="mui-input-row">
+					<label>外出事由</label>
+					<span v-text="detail.content"></span>
+				</div>
+				<div class="mui-input-row">
+					<label>报备</label>
+					<span v-text="detail.list.length>0?detail.list[0]['name']:''"></span>
+				</div>
+				<div class="mui-input-row">
+					<label>提交时间</label>
+					<span v-text="detail.createTime"></span>
 				</div>
-				<button :style="getColor(detail.status)" v-text="detail.statusN" type="button" class="mui-btn mui-btn-primary mui-btn-outlined">
+				<div class="mui-input-row">
+					<label>申请单编号</label>
+					<span v-text="detail.approvalNo"></span>
+				</div>
+			</form>
 
-				</button>
-			</div>
-			<div class="mui-content-padded vongi-wordcard-center">
-				<ul class="mui-table-view">
-					<li class="mui-table-view-cell mui-media">
-						<div class="mui-media-body">申请类型</div>
-						<span v-text="detail.typeN"></span>
-					</li>
-					<li class="mui-table-view-cell mui-media">
-						<div class="mui-media-body">所在部门</div>
-						<span v-text="detail.companyName"></span>
-					</li>
-					<li class="mui-table-view-cell mui-media">
-						<div class="mui-media-body">外出地点</div>
-						<span v-text="detail.destination"></span>
-					</li>
-					<li class="mui-table-view-cell mui-media">
-						<div class="mui-media-body">外出日期</div>
-						<span v-text="detail.startTime"></span>
-					</li>
-					<li class="mui-table-view-cell mui-media">
-						<div class="mui-media-body">预估时长</div>
-						<span v-text="detail.estimatedTime+'小时'"></span>
-					</li>
-					<li class="mui-table-view-cell mui-media">
-						<div class="mui-media-body">外出事由</div>
-						<span v-text="detail.content"></span>
-					</li>
-					<li class="mui-table-view-cell mui-media">
-						<div class="mui-media-body">申请单编号</div>
-						<span v-text="detail.approvalNo"></span>
-					</li>
-					<li class="mui-table-view-cell mui-media">
-						<div class="mui-media-body">申请时间</div>
-						<span v-text="detail.createTime"></span>
-					</li>
-					<li v-if="detail.endTime" class="mui-table-view-cell mui-media">
-						<div class="mui-media-body">结束时间</div>
-						<span v-text="detail.endTime"></span>
-					</li>
-					<li v-if="detail.remark" class="mui-table-view-cell mui-media">
-						<div class="mui-media-body">审核意见</div>
-						<span v-text="detail.remark"></span>
-					</li>
-					<li v-if="detail.workReport" class="mui-table-view-cell mui-media">
-						<div class="mui-media-body">办理结果</div>
-						<span v-text="detail.workReport"></span>
-					</li>
-				</ul>
+			<form class="mui-input-group margin10">
+				<div class="mui-input-row">
+					<label>预计外出时间</label>
+					<span v-text="detail.startTime"></span>
+				</div>
+				<div class="mui-input-row">
+					<label>预估时长</label>
+					<span v-text="detail.estimatedTime+'小时'"></span>
+				</div>
+				<div v-if="detail.endTime" class="mui-input-row">
+					<label>返回时间</label>
+					<span v-text="detail.endTime"></span>
+				</div>
+				<div v-if="detail.remark" class="mui-input-row">
+					<label>审查意见</label>
+					<span v-text="detail.remark"></span>
+				</div>
+				<div v-if="detail.workReport" class="mui-input-row">
+					<label>办理结果</label>
+					<span v-text="detail.workReport"></span>
+				</div>
+			</form>
+			<!-- <div class="mui-content-padded">
+				<h5>审核记录</h5>
 			</div>
-			<div class="vongi-slot mui-content-padded">
-				<div v-for="(item,index) in detail.list" class="vongi-slot-block">
-					<div class="vongi-slot-img"><img :src="item.faceImageUrl"></div>
-					<div class="vongi-slot-content">
-						<h4>审批人{{index+1}}<span class="mui-pull-right mui-h5 color999" v-text="item.time"></span></h4>
-						<p>{{item.name}} <span class="color55f868" :style="getColor(item.status)" v-text="item.statusN"></span></p>
+			<form class="mui-input-group margin10">
+				<template v-for="(item,index) in detail.list">
+					<div class="mui-input-row">
+						<label>通知人</label>
+						<span v-text="item.name"></span>
+					</div>
+					<div v-if="item.approvalContent" class="mui-input-row">
+						<label>审核意见</label>
+						<span v-text="item.approvalContent"></span>
 					</div>
+					<div v-if="item.time" class="mui-input-row">
+						<label>审核时间</label>
+						<span v-text="item.time"></span>
+					</div>
+				</template>
+			</form> -->
+		</div>
+
+
+		<div v-if="!detail.remark" class="fyy-scon-botton" style="position: fixed;width: 100%;bottom: 0;">
+			<div style="background-color: #3385FF;" class="examine-btn examine-btn1-blue" @click="openFromVisible=true">填写意见</div>
+		</div>
+
+		<!-- 审批弹窗 -->
+		<div v-show="openFromVisible" class="mui-popup mui-popup-in vongi-mui-pop">
+			<div class="mui-popup-inner vongi-pop-inner">
+				<div class="mui-popup-title">填写意见</div>
+				<div class="mui-popup-input">
+					<textarea v-model="remarkForm.remark" rows="3" placeholder="请输入"></textarea>
 				</div>
 			</div>
-			<div v-if="detail.status=='0'" class="fyy-scon-botton">
-				<div class="examine-btn examine-btn1" @click="openFrom('2')">拒绝</div>
-				<div class="examine-btn examine-btn2" @click="openFrom('1')">通过</div>
-			</div>
+			<div class="mui-popup-buttons"><span class="mui-popup-button mui-popup-button-bold" @click="addRemark">提交</span></div>
 		</div>
+		<div v-show="openFromVisible" @click="openFromVisible=false" class="mui-popup-backdrop mui-active"></div>
 
 		<loading :visible="isLoading"></loading>
 	</div>
@@ -101,19 +120,20 @@
 		},
 		data() {
 			return {
-				pageTitle: '外出记录详情',
+				pageTitle: '外出审查详情',
 
 				isLoading: false,
 
-				subForm: {
-					ids: this.$route.query.id,
-					status: '',
-					approvalContent: '',
-				},
-
+				id: this.$route.query.id,
 				detail: {
 					list: [],
 				},
+				
+				remarkForm: {
+					id: this.$route.query.id,
+					remark: ''
+				},
+				openFromVisible: false,
 			}
 		},
 		created() {},
@@ -121,7 +141,7 @@
 			//获取详情
 			getInfo() {
 				this.isLoading = true;
-				API_BusinessTravel.businessOutDetail(this.subForm.ids).then(response => {
+				API_BusinessTravel.businessOutDetail(this.id).then(response => {
 					this.isLoading = false;
 
 					this.detail = response;
@@ -131,46 +151,26 @@
 				})
 			},
 			//获取状态颜色
-			getColor(status) {
+			getColor(item) {
 				var color = '';
-				if (status == '0') {
-					color = '#4fc5f7';
-				} else if (status == '1') {
+				if (item.remark) {
 					color = '#55f868';
-				} else if (status == '2') {
-					color = '#fe616c';
-				}
-				return 'color:' + color + ';border-color:' + color + ';';
-			},
-			//显示内容表单
-			openFrom(status) {
-				if (!this.subForm.ids) {
-					mui.toast('请选择要处理的信息');
 				} else {
-					this.subForm.status = status;
-					this.subForm.approvalContent = status == 1 ? '同意' : '拒绝';
-					//this.openFromVisible = true;
-					//直接点击处理，不需要弹窗理由框
-					this.doAction();
+					color = '#4fc5f7';
 				}
+				return 'color:' + color + ';border-color:' + color + ';';
 			},
-			//检测表单
-			checkForm() {
-				if (!this.subForm.ids) {
-					mui.toast('请选择要处理的信息');
-					return false;
+			//领导添加备注
+			addRemark() {
+				if (!this.remarkForm.remark) {
+					mui.toast('请填写意见');
 				} else {
-					return true;
-				}
-			},
-			//同意拒绝
-			doAction() {
-				if (this.checkForm()) {
 					this.isLoading = true;
-					API_BusinessTravel.businessOutApproval(this.subForm).then(response => {
+					API_BusinessTravel.addRemark(this.remarkForm).then(response => {
 						this.isLoading = false;
 
 						this.openFromVisible = false;
+						mui.toast('提交成功');
 						this.getInfo();
 					}).catch(error => {
 						this.isLoading = false;
@@ -198,5 +198,14 @@
 
 <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>

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

@@ -3,76 +3,27 @@
 		<common @asynCallBack="asynCallBack"></common>
 		<top-header :pageTitle="pageTitle"></top-header>
 
-		<div class="mui-content vongi-wordcard-sp">
-			
-			<div id="sliderSegmentedControl" class="mui-scroll-wrapper mui-slider-indicator mui-segmented-control mui-segmented-control-inverted">
-				<div class="mui-scroll">
-					<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 @click="reloadList('1')" :class="'mui-control-item '+(listForm.status=='1'?'mui-active':'')">
-						已处理
-					</a>
-				</div>
-			</div>
-			
-			<NullList :remark="'暂无申请记录'" v-if="!recordList.length"></NullList>
-			
-			<div id="slider" class="mui-slider mui-fullscreen vongi-over">
-				
-				<div class="mui-slider-group vongi-cchai">
-					<div v-if="listForm.status=='0'" class="mui-slider-item mui-control-content mui-active">
-						<div id="scroll1" class="mui-scroll-wrapper vongi-over-hei">
-							<div class="mui-scroll">
-								<form class="mui-input-group fyy-checkbox">
-									<div v-for="(item,index) in recordList" class="mui-input-row mui-checkbox mui-left">
-										<router-link :to="{name:'MasterEgressVerifyInfo',query:{id:item.id}}">
-											<h4>{{item.personName}}的外出登记<span class="mui-h6 mui-pull-right" v-text="item.startTime.substr(5)"></span></h4>
-											<p class='mui-ellipsis'>外出事由:{{item.content}}</p>
-											<p class='mui-ellipsis flew-items flew-sp'>
-												预估时长:{{item.estimatedTime}}小时
-												<button type="button" class="mui-btn mui-btn-primary mui-btn-outlined" :style="getColor(item.status)"
-												 v-text="item.statusN"></button>
-											</p>
-										</router-link>
-										<input name="checkbox" v-model="selectIdList" :value="item.id" type="checkbox">
-									</div>
-								</form>
-							</div>
-						</div>
-					</div>
-					<div v-if="listForm.status=='1'" 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 v-for="(item,index) in recordList" class="mui-table-view-cell mui-media">
-										<router-link :to="{name:'MasterEgressVerifyInfo',query:{id:item.id}}">
-											<h4>{{item.personName}}的外出登记<span class="mui-h6 mui-pull-right" v-text="item.startTime.substr(5)"></span></h4>
-											<p class='mui-ellipsis'>外出事由:{{item.content}}</p>
-											<p class='mui-ellipsis flew-items flew-sp'>
-												预估时长:{{item.estimatedTime}}小时
-												<button type="button" class="mui-btn mui-btn-primary mui-btn-outlined" :style="getColor(item.status)"
-												 v-text="item.statusN"></button>
-											</p>
-										</router-link>
-									</li>
-								</ul>
+		<div class="mui-content vongi-hdsq">
+			<div class="mui-slider-group">
+				<ul class="mui-table-view">
+					<li v-for="(item,index) in recordList" class="mui-table-view-cell">
+						<router-link :to="{name:'MasterEgressVerifyInfo',query:{id:item.id}}">
+							<div class="mui-media-body flew-sp">
+								外出地点:{{item.destination}}
+								<span class='mui-ellipsis mui-h6' v-text="item.startTime.substr(5)"></span>
 							</div>
-						</div>
-					</div>
-				</div>
-			</div>
-			<div v-show="recordList.length>0 && listForm.status==0" class="fyy-bindfyy-btn">
-				<form class="mui-input-group">
-					<div class="mui-input-row mui-checkbox mui-left">
-						<label>全选</label>
-						<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" @click="openFrom('2')">拒绝</button>
-				<button type="button" class="mui-btn mui-btn-success" @click="openFrom('1')">同意</button>
+							<p class='mui-ellipsis'>外出事由:{{item.content}}</p>
+							<p class='flew-sp flew-items'>
+								预估时长:{{item.estimatedTime}}小时
+								<button type="button" :style="getColor(item)" class="mui-btn mui-btn-primary mui-btn-outlined" v-text="item.remark?'已审查':'未审查'"></button>
+							</p>
+						</router-link>
+					</li>
+				</ul>
 			</div>
 		</div>
+		
+		<NullList :remark="'暂无审查记录'" v-if="!recordList.length"></NullList>
 
 		<loading :visible="isLoading"></loading>
 	</div>
@@ -99,7 +50,7 @@
 		},
 		data() {
 			return {
-				pageTitle: '外出记录',
+				pageTitle: '外出审查',
 
 				isLoading: false,
 
@@ -108,19 +59,9 @@
 					pageIndex: 1,
 					pageSize: 20,
 					totalPage: 1,
-					status: '0'
+					status: '1'
 				},
 				recordList: [],
-
-				subForm: {
-					ids: '',
-					approvalContent: '',
-					status: ''
-				},
-
-				selectIdList: [],
-				allSelect: [],
-				firstRecordsTotal: 0,
 			}
 		},
 		created() {},
@@ -141,11 +82,6 @@
 							];
 						}
 					}
-
-					if (this.listForm.status == 0) {
-						this.firstRecordsTotal = response.recordsTotal;
-					}
-
 					this.listForm.pageIndex++;
 					this.isLoading = false;
 				}).catch(error => {
@@ -164,71 +100,13 @@
 					}
 				}
 			},
-			//切换
-			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.subForm.content = status == 1 ? '同意' : '拒绝';
-					//this.openFromVisible = true;
-					//直接点击处理，不需要弹窗理由框
-					this.doAction();
-				}
-			},
-			//检测表单
-			checkForm() {
-				if (!this.subForm.ids) {
-					mui.toast('请选择要处理的信息');
-					return false;
-				} else {
-					return true;
-				}
-			},
-			//同意拒绝
-			doAction() {
-				this.subForm.ids = this.selectIdList.join(',');
-				if (this.checkForm()) {
-					this.isLoading = true;
-					API_BusinessTravel.businessOutApproval(this.subForm).then(response => {
-						this.isLoading = false;
-
-						this.openFromVisible = false;
-						this.listForm.pageIndex = 1;
-						this.getList();
-					}).catch(error => {
-						this.isLoading = false;
-						mui.toast(error);
-					})
-				}
-			},
 			//获取状态颜色
-			getColor(status) {
+			getColor(item) {
 				var color = '';
-				if (status == '0') {
-					color = '#4fc5f7';
-				} else if (status == '1') {
+				if (item.remark) {
 					color = '#55f868';
-				} else if (status == '2') {
-					color = '#fe616c';
+				} else {
+					color = '#4fc5f7';
 				}
 				return 'color:' + color + ';border-color:' + color + ';';
 			},
@@ -253,32 +131,10 @@
 				token: 'token',
 			})
 		},
-		//keepalive监控判断
-		beforeRouteLeave(to, from, next) {
-			console.log(to.name);
-			if (['MasterEgressVerifyInfo'].indexOf(to.name) > -1) {
-				this.$store.commit('SET_KEEP_ALIVE_COMPONENTS', ['MasterEgressVerifyList'])
-			} else {
-				this.$store.commit('SET_KEEP_ALIVE_COMPONENTS', [])
-			}
-			next()
-		},
 	}
 </script>
 
 <style scoped src="$project/assets/css/xpwyfyy.css"></style>
 <style src="$project/assets/css/iconfont.css"></style>
-<style scoped>
-	
-	.mui-segmented-control {
-		position: fixed;
-		top: 44px;
-		z-index: 99;
-		background-color: #eee;
-	}
-	
-	.mui-fullscreen {
-		position: unset;
-		margin-top: 45px;
-	}
+<style>
 </style>