<template>
	<div class="page-cont">
		<p class="page-title">请确认审核当前业务到下一个环节</p>
		<div class="page-select">
			<div class="select-item">
				<span>业务转出到</span>
				<view class="select-unit" @tap="choese(1)">
					<picker mode="selector" @change="pickerChange($event,0)"  :value="pickerIndex[0]" range-key="ActDef_Name" :range="NextActDefList">
						<view class="uni-ellipsis">{{NextActDefList[pickerIndex[0]].ActDef_Name}}</view>
					</picker>
					<i class="uni-icon uni-icon-arrowright"></i>
				</view>
			</div>
			<div class="select-item" v-if="!notUserData">
				<span>指定经办人</span>
				<view class="select-unit" @tap="choese(2)">
					<picker mode="selector" @change="pickerChange($event,1)" :value="pickerIndex[1]" range-key="USER_NAME" :range="TransferUserList">
						<view class="uni-ellipsis picker-text">{{TransferUserList[pickerIndex[1]].USER_NAME}}</view>
					</picker>
					<i class="uni-icon uni-icon-arrowright"></i>
					
				</view>
			
			</div>
		
			<block v-if="needSign">
				
				<div class="select-item nb" >
					<span>会签人员</span>
					
					<view class="select-btn" @tap="choese(3)">
						<picker mode="selector" @change="pickerChange($event,1)" :value="pickerIndex[1]" range-key="USER_NAME" :range="TransferUserList">
							<view>添加+</view>
						</picker>
					</view>
				</div>
				<div class="sign-tag-box">
					<div class="sign-tag" v-for="(item,i) in signUsers" :key="item.USER_ID" >
						<span>{{item.USER_NAME}}</span>
						<span class="remove-tag" @click="removeSignUsers(i)">×</span>
					</div>
					<!-- <textarea  placeholder="选择会签人员备注" v-model="postData.SignDesc"/> -->
					
				</div>
			</block>
			<div class="text-area-box" v-if="postData.NeedApproved==1">
				<textarea  placeholder="请输入您的意见" v-model="postData.APPROVED_INFO"/>
			</div>
		</div>
		
		<button @click="postFn" :loading="isSubmit">审核</button>
		
		
	</div>
</template>

<script>
	import {mapState, mapMutations, mapActions} from 'vuex'
	
	export default {
		data() {
			
			return {
				postData: {
					PROINST_ID:'',
					FINANCEPROINST_ID:'',
					NOWACTINST_ID:'',
					PROINST_NEXTID: 2000,
					NextACTDEF_IDS: '',
					APPROVED_INFO: '拟同意' ,// 审核意见
				
				},
				pickerIndex: [0,0],
				signUsers: [], // 已选的会签人员
				needSign: false, // 是否需要会签
				notUserData: false ,//  下一转出环节为 办结时，不需要选择转出人员
				TransferUserList: [] ,// 待移交人员列表 
				NextActDefList: [] ,// 可选环节列表
				
				nowType: 1 ,// 1: 业务 2：转出人员 3.会签（多选人员）
				isSubmit:false
			};
		},
		computed:{
			...mapState({
				'userId': state => state.userData.UserId
				
			}),
			// ...mapGetters({'users':'getUser'})
		},
		methods: {
			...mapMutations(['shouldReLoadingList']),
			...mapActions(['getTodoList']),
			pickerChange(e,index){
			
				this.pickerIndex[index] = e.detail.value
				if(index===0) {
					this.getTransferUser( e.detail.value)
				}
				if(this.nowType==1) {
					let el = this.NextActDefList[e.detail.value]
					if(el.ActDef_Type==5010){
						_this.notUserData = true
					}
					if(el.IsSign ===1) {
						this.notUserData = true
						this.needSign = true
					}
					
					
				}
				
				if(this.nowType===3) {
					let el = this.TransferUserList[e.detail.value]
					let i = this.signUsers.some(s=>{return s.USER_ID===el.USER_ID})
					if(!i) {
						this.signUsers.push(el)
					}
				}
				this.$forceUpdate()
			},
			choese (type) { // 1: 业务 2：转出人员 3.会签
				let noList = false
				this.nowType = type
				if (type!==1 && !this.NextActDefList[this.pickerIndex[0]].ActDef_ID) {
					uni.showToast({
						title: '请先选择转出业务后再指定经办人。',
						icon: 'none'
					})
					return false
				}
				switch (type) {
					case 1:
						if(this.NextActDefList.length===0){
							noList = true
						}
						
						break
					default:
						
						if(this.TransferUserList.length===0){
							noList = true
						}
						
						break
				}
				
				if (noList) {
					uni.showToast({
						title: '该选项没有待选项，请稍后重试或待管理人员添加待选项后重试。',
						icon: 'none'
					})
					return false
				}
				
			},
			removeSignUsers (i) {
				this.signUsers.splice(i,1)
			},
			getHighNextActDef() { // 获取下一环节
				let _this = this
				let arr  = {
						
						businessType: _this.postData.businessType,
						PROINST_ID: _this.postData.PROINST_ID,
						PROINST_NEXTID: _this.postData.PROINST_NEXTID
					}
				
				this.$request.$get('GetNextStep',arr).then((res)=> {
					uni.hideLoading()
					
					if (res.Data.List[0].ActDef_Type && res.Data.List[0].ActDef_Type===5010) { // 是否是办结
						_this.notUserData = true
					}
					if(res.Data.List[0].IsSign ===1) {
						this.notUserData = true
						this.needSign = true
					}
					_this.NextActDefList= res.Data.List
					_this.getTransferUser()
					
				})
			},
			getTransferUser(ActDef_ID) { // 是否是请求移交人员
				let _this = this
				let _data = {
						businessType: _this.postData.businessType,
						PROINST_ID: _this.postData.PROINST_ID,
						NextStepId: _this.NextActDefList[_this.pickerIndex[0]].ActDef_ID,
						USER_ID: _this.userId
					}
					
				uni.showLoading()
				this.$request.$get('GetNextStepUser',_data).then((res)=> {
					
					_this.TransferUserList= res.Data.List
				
					uni.hideLoading()
				})
			},
		
			postFn () {
				let _this = this
				
				if(_this.isSubmit) {
					return
				}
				if(!_this.NextActDefList[_this.pickerIndex[0]]) {
					uni.showToast({
						title: '请选择转出业务后提交。',
						icon: 'none'
					})
					return false
				}
			
				if( (!this.notUserData && !_this.TransferUserList[_this.pickerIndex[1]]) || (this.needSign && this.signUsers.length===0)) {
					uni.showToast({
						title: '请选择人员后提交。',
						icon: 'none'
					})
					return false
				}
		
					
				let arr = {
					
					businessType: _this.postData.businessType,
					PROINST_ID: _this.postData.PROINST_ID,
					PROINST_NEXTID: _this.postData.PROINST_NEXTID,
					NOWACTINST_IDS: _this.postData.NOWACTINST_ID,
					NextACTDEF_IDS: _this.NextActDefList[_this.pickerIndex[0]].ActDef_ID,
					NextSTAFF_ID: _this.TransferUserList.length>0 ?this.TransferUserList[_this.pickerIndex[1]].USER_ID:'',
					APPROVED_INFO: _this.postData.NeedApproved==1 ? _this.postData.APPROVED_INFO: '',
					APPROVED_NAME: _this.postData.ApproName
				}
				
				
				
				if (_this.notUserData) {
					delete arr.NextSTAFF_ID
					if(this.needSign) {
						let SignUserIds =[]
						let SignUserNames =[]
						this.signUsers.map(n=>{ 
							SignUserIds.push(n.USER_ID)
							SignUserNames.push(n.USER_NAME)
						})
						arr.SignUserIds = SignUserIds.toString()
						arr.SignUserNames = SignUserNames.toString()
				
					}
				}
				this.isSubmit =true
				// console.log(arr)
				this.$request.$post('ProcessApproval',arr).then((_data)=> {
					_this.isSubmit = false
					
					if (_data.ResultCode==='100') {
						uni.$emit(_this.postData.businessType,true);
						_this.getTodoList();
						_this.shouldReLoadingList(true);
						uni.showToast({
							title: _data.ResultDesc,
							success () {
								setTimeout(()=> {
									uni.navigateBack({ delta: 1})
								},1000)
								
							}
						})
					}else {
						uni.showToast({
							title: _data.ResultDesc || '操作错误',
							icon: 'none'
						})
						
					}
				})
			},
		},
		onLoad(option) {
	
			this.postData = option
			this.postData.PROINST_NEXTID = 2000
			this.postData.APPROVED_INFO = '拟同意' ,// 审核意见
			
			 uni.showLoading({
				title:'正在加载'
			 })
			this.getHighNextActDef()
		},
		onUnload() {
			this.$util.addUserBehavior()
		}
	
	}
</script>

<style scoped>
	@import url("../../common/css/auditingPop.css");
	@import url("../../common/css/picker.css");
	.select-item.nb {
		border-bottom: 0;
	}
</style>
