smart-app/pages/task/approvalTasks/approvalTasks.vue

<template>
	<view>
		<!-- 顶部 -->
		<cu-custom bgColor="bg-blue" :isBack="true">
			<block slot="backText">审批任务</block>
			<block slot="content"></block>
			<block slot="right">
				<view class=" flex justify-center">
				 	<button @click="save()" class="margin-top-ssm cu-btn text-white line-blue round">提交</button>
				</view>
			</block>
		</cu-custom>
		<!-- 内容 -->
		<form>
			<view class="cu-form-group" @click="modalShow=true">
				<view class="title">审批意见</view>
				<input placeholder="请选择" v-model="opinion" name="input" disabled=""></input>
				<text class='cuIcon-right text-gray'></text>
			</view>
			<view class="cu-form-group align-start">
				<view class="title">备注</view>
				<textarea maxlength="-1" v-model="remarks" placeholder="请输入"></textarea>
			</view>
		</form>
		<form v-if="taskData.task_flow == null||taskData.task_flow ==1">
			<view v-if="radio == 1" class="cu-form-group margin-top-sm" @click="navNext()">
				<view class="title">下一审批人</view>
				<input placeholder="请选择" v-model="approve" disabled=""  ></input>
				<text class='cuIcon-right'></text>
			</view>
			<view v-if="radio == 2" class="cu-form-group margin-top-sm" @click="navBack()">
				<view class="title">退回人员</view>
				<input placeholder="请选择" v-model="approve" disabled=""  ></input>
				<text class='cuIcon-right'></text>
			</view>
		</form>
		<!-- 弹窗 -->
		<view class="cu-modal bottom-modal" :class="modalShow?'show':''" >
			<view class="cu-dialog" style="background-color: white;">
				<view class="cu-bar bg-white">
					<view class="action text-gray"></view>
					<view class="action text-black text-bold" style="color: #101010;">选择审批意见</view>
					<view class="action text-gray" @tap="modalShow=false">取消</view>
				</view>
				<view class="">
					<radio-group class="block" @change="RadioChange">
						<view class="cu-list menu text-left"  v-for="(item,index) in radioList" :key="index">
							<view class="cu-item" v-if="index!=2">
								<label  class="flex justify-between align-center flex-sub">
									<view class="flex-sub">{{item.name}}</view>
									<radio class="round" :class="radio==item.vlaue ?'checked':''" :checked="radio==item.vlaue ? true:false"
									 :value="item.value"></radio>
								</label>
							</view>
							<view class="cu-item" v-else-if="index==2 && choose" >
								<label class="flex justify-between align-center flex-sub">
									<view class="flex-sub" style="color: #101010;">{{item.name}}</view>
									<radio class="round" :class="radio==item.vlaue ?'checked':''" :checked="radio==item.vlaue ? true:false"
									 :value="item.value"></radio>
								</label>
							</view>
						</view>
					</radio-group>
				</view>
			</view>
		</view>
		
		<uni-popup ref="popup1" type="dialog">
		    <view class="padding-top radius bg-white" style="width: 660rpx;">
				<view class="text-center" style="font-size: 36rpx;">短信验证</view>
				<view class="cu-form-group">
					<view class="title">绑定手机</view>
					<input placeholder="" name="input" :value="signType.isPhone" disabled></input>
				</view>
				<view class="cu-form-group">
					<view class="title">验证码</view>
					<input placeholder="请输入短信验证码" name="input" @input="onKeyInput"></input>
					<button class='cu-btn round' v-if="sendCoded">{{timeOutNum}}s</button>
					<button class='cu-btn round line-blue' v-else @tap="toMobileByCode">获取验证码</button>
				</view>
				<view class="flex flex-wrap text-center" style="border-top:1px solid #eee;">
					<view class="basis-df padding-tb" style="border-right: 1px solid #eee;" @tap="hideDialong">取消</view>
					<view class="basis-df padding-tb text-blue" @tap="checkSms">确定</view>
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	import rangeDatetime from "@/components/range-datetime.vue";
	export default {
		components: {
		    rangeDatetime,
		},
		data() {
			return {
				modalShow:false,
				show:true,
				opinion:"",
				radio: 0,
				approve:"",//人员,
				approveId:"",
				radioList:[{name:"同意",value:'1'},{name:"不同意",value:'2'},{name:"同意并结束流程",value:'3'}],
				taskData:{},
				choose:true,
				remarks:"",
				userInfo:"",
				project:uni.getStorageSync("porject"+"_"+uni.getStorageSync("userInfo").id),
				
				signType:{
					isOpenSign:0,//合同是否开启电签,0关闭，1开启
					isPfxFile:'',//是否有证书文件,1有
					isPhone:'',//绑定的手机号，没有则没绑定
				},
				smscode:'',
				sendCoded:false,//
				
				timeOutId:null,
				timeOutNum:60,
				
				formDataIds:'',
				contractIdList:'',
			}
		},
		onLoad(e) {
			this.userInfo = uni.getStorageSync("userInfo");
			if(e.taskId){
				//单个任务
				this.finTaskSingle(e.taskId);
				this.signType.isOpenSign = (e.isOpenSign);
				this.signType.isPfxFile = (e.isPfxFile);
				this.signType.isPhone = (e.isPhone);
			}else{
				this.formDataIds = e.formDataIds;
				this.contractIdList = e.contractIdList;
				this.taskData.task_flow = e.task_flow;
				this.getSignType();
			}

			//console.log(this.signType)
		},
		methods: {
			save(){
				 var that =this;
				 if(that.radio!=0){
					 if(this.taskData.task_flow == null||this.taskData.task_flow ==1){
						 //如果是自定义流程 必须选人员
						 if(!that.approveId){
							 if(that.radio==1){
								 that.$prompt.none("请选择下一审批人");
								 return;
							 }
							 if(that.radio==2){
								 that.$prompt.none("请选择退回人员");
								 return;
							 }
						 }
					 }
					 
				 	if(that.radio==1 || that.radio==3){//同意 || //同意并结束
						// if(that.approveId!=""){
						// 	
						// }else{
						// 	that.$prompt.none("请选择下一审批人")
						// }
						
						//不开启电签
						if(this.signType.isOpenSign != 1 ||
							this.signType.isPfxFile != '1'
						){
							that.saveData(that.radio);								
						}
						
						//开启电签可是需要绑定手机
						if(this.signType.isOpenSign == 1 &&
							this.signType.isPfxFile == '1' &&
							(!this.signType.isPhone || this.signType.isPhone.length != 11)
						){
							uni.showModal({
								title: '提示',
								content: '当前账号未绑定手机，或手机号不正确，无法通过APP端进行电签，请通过PC端使用UKEY进行电签'
							});
							return;
						}
						
						//开启电签,短信验证
						if(this.signType.isOpenSign == 1 &&
							this.signType.isPfxFile == '1' &&
							this.signType.isPhone.length == 11
						){
							//是否超时
							this.http.request("/app/sms/checkSmsTimeout",{userId:this.userInfo.id,phone:this.signType.isPhone}).then((res)=>{
								 if(res.result=="-1"){
									this.$refs.popup1.open(); 
								 }
								 if(res.result == '1'){
									 //未超时
									 that.saveData(that.radio);	
								 }
							})
							
						}

					}else if(that.radio==2){ //不同意
						if(that.remarks){
							that.saveData(that.radio);
						}else{
							that.$prompt.none("请输入备注内容")
						}
					}				 
				 }else{
					 that.$prompt.none("请选择审批意见")
				 }
			},
			// saveData(type){
			// 	var that =this;
			// 	if(type==1){//同意的保存
			// 		that.http.request("/app/task/agree",{userId:that.userInfo.id,taskId:that.taskData.id,remarks:that.remarks,approveId:that.approveId}).then((res)=>{
			// 			if(res.result=="1"){
			// 				that.$prompt.none("提交成功");
			// 				setTimeout(function(){
			// 					uni.reLaunch({
			// 						url:"/pages/task/task"
			// 					})
			// 				},2000)						
			// 			}else{
			// 				that.$prompt.none("提交失败");
			// 			} 
			// 		})
			// 	}else if(type==2){//不同意的保存
			// 		that.http.request("/app/task/disagreeOrEnd",{taskId:that.taskData.id,remarks:that.remarks}).then((res)=>{
			// 			 if(res.result=="1"){
			// 				that.$prompt.none("提交成功"); 
			// 				setTimeout(function(){
			// 					uni.reLaunch({
			// 						url:"/pages/task/task"
			// 					})
			// 				},2000)
			// 			 }else{
			// 				that.$prompt.none("提交失败");
			// 			} 
			// 		})
			// 	}else if(type==3){//同意并结束的保存
			// 		that.http.request("/app/task/disagreeOrEnd",{taskId:that.taskData.id,remarks:""}).then((res)=>{
			// 			 if(res.result=="1"){
			// 				that.$prompt.none("提交成功"); 
			// 				setTimeout(function(){
			// 					uni.reLaunch({
			// 						url:"/pages/task/task"
			// 					})
			// 				},2000)
			// 			 }else{
			// 				that.$prompt.none("提交失败");
			// 			} 
			// 		})
			// 	}
			// 	//uni.$emit("save");
			// },
			
			saveData(type){
				if(this.formDataIds){
					//批量审批
					this.batchSave(type);
					return;
				}
				
				var obj = {
					formDataId: this.taskData.id,
					taskStatus: '',
					userIds: this.approveId,
					flow: this.taskData.task_flow,
					remarks: this.remarks,
					contractId: this.taskData.contractInfoId,
					nowUserId:this.userInfo.id
				}
				
				if(type==1){//同意的保存
					obj.taskStatus = "1";
				}else if(type==2){//不同意的保存
					obj.taskStatus = "-1";
				}else if(type==3){//同意并结束的保存
					obj.taskStatus = "2";
				}
				
				this.http.request("/app/task/audit",obj).then((res)=>{
					 if(res.result == '1'){
						this.$prompt.none("提交成功");
						setTimeout(function(){
							uni.reLaunch({
								url:"/pages/task/task"
							})
						},2000)
					 }else{
						this.$prompt.none("提交失败");
					} 
				})
			},
			
			finTaskSingle(id){
				var that = this;
				that.http.request("/app/task/findTaskSingle",{taskId:id}).then((res)=>{
					that.taskData = res.data;
					// if(that.taskData.task_flow=="固定流程"){
					// 	that.choose=false;
					// }
					
					if(!(that.taskData.task_flow==null || that.taskData.task_flow ==1)){
						that.choose=false;
					}
					//console.log(that.taskData)
				})
			},
			navNext(){
				uni.navigateTo({
					url:"/pages/constructionLog/personnel/personnel?name=选择审批人"
				})
			},
			navBack(){
				uni.navigateTo({
					url:"/pages/constructionLog/personnel/personnel?name=选择退回人员"
				})
			},
			RadioChange(e) {
				this.radio = e.detail.value;
				this.radioList.forEach((item,index,arry)=>{
					if(item.value==e.detail.value){
						this.opinion=item.name
						return 
					}
				})
				this.approve = "";
				this.approveId = "";
				// if(this.radio==1){
				// 	this.show=true;
				// }else{
				// 	this.show=false;
				// }
				this.modalShow=false
			},
			
			//发送验证码
			toMobileByCode(){
				 if(this.sendCoded){
					 //一分钟内只给发一次请求
					 return;
				 }
				 
				 this.http.request("/app/sms/toMobileByCode",{userId:this.userInfo.id,phone:this.signType.isPhone}).then((res)=>{
					 if(res.result=="1"){
						this.$prompt.none('验证码已发送');
						this.sendCoded = true;
						setTimeout(()=>{
							this.sendCoded = false;
						},60000);
						this.timeOutId = setInterval(()=>{
							this.timeOutNum--;
							if(this.timeOutNum < 1){
								clearInterval(this.timeOutId)
								this.timeOutNum = 60;
							}
							console.log(this.timeOutNum);
						},1000)
					 }else{
						 this.$prompt.none(res.msg);
					 }
					 
				 })
			},
			//验证短信验证码
			checkSms(){
				 console.log(this.smscode)
				 this.http.request("/app/sms/checkSms",{userId:this.userInfo.id,phone:this.signType.isPhone,code:this.smscode}).then((res)=>{
					 if(res.result=="1"){
						//通过
						this.saveData(this.radio);
					 }else{
						this.$prompt.none(res.msg);
					 }
				 })
			},
			
			hideDialong(){
				this.$refs.popup1.close();
			},
			
			onKeyInput(value){
				//console.log(value)
				this.smscode = value.detail.value;
			},
			
			getSignType(){
				let userInfo = uni.getStorageSync("userInfo");
				let porject = uni.getStorageSync("porject"+"_"+uni.getStorageSync("userInfo").id);
				this.http.request("/app/task/findtaskByTypeList",{
					userId:userInfo.id , 
					contractId:porject.contractId
				}).then((res)=>{
					this.signType = res.data;
				})
			},
			
			//批量审批
			batchSave(type){
				var obj = {
					formDataIds: this.formDataIds,
					taskStatus: '',
					userIds: this.approveId,
					flow: this.taskData.task_flow,
					remarks: this.remarks,
					contractIdList: this.contractIdList,
					contractId: this.project.contractId,
					nowUserId:this.userInfo.id
				}
				
				if(type==1){//同意的保存
					obj.taskStatus = "1";
				}else if(type==2){//不同意的保存
					obj.taskStatus = "-1";
				}else if(type==3){//同意并结束的保存
					obj.taskStatus = "2";
				}
				
				this.http.request("/app/task/auditList",obj).then((res)=>{
					 if(res.result == '1'){
						this.$prompt.none("提交成功");
						setTimeout(function(){
							uni.reLaunch({
								url:"/pages/task/task"
							})
						},2000)
					 }else{
						this.$prompt.none("提交失败");
					} 
				})
			}
		},
		onShow() {
			uni.$on("approve", res =>{
				//console.log(res)
				this.approveId = res[0].id;
				this.approve=res[0].user_name;
			})
		}
		
	}
</script>

<style>
    .cu-modal.show {
    	overflow-y: auto;
    	pointer-events: auto; 
    }
	
	.cu-form-group .title {
		min-width: calc(4em + 15px);
	}
</style>