<template>
	<div class="flexOne">
		<div :class="{approval_page_layer:showlayer}" @click="closeLayer">
			<div :class="{approval_person_set:true,approval_person_set_right:isTransition}" @click.stop>
				<p class="setTitle">{{$t('fnc.sprshezhi')}}</p>
				<div class="approval_person_layerContent">
					<div class="approval_page_title">{{$t('fnc.sprleibie')}}</div>
					<p style="padding-left: 20px;">
						<el-radio-group v-model="approvalType" @change='clearValue'>
							<el-radio :label="1">{{$t('fnc.zhuguan')}}</el-radio>
							<el-radio :label="2">{{$t('fnc.zdchengyuan')}}</el-radio>
							<el-radio :label="3">{{$t('admin.admin_Post')}}</el-radio>
						</el-radio-group>
					</p>

					<div class="approval_layer_info" v-if="approvalType==1">
						{{$t('fnc.fqrende')}}&nbsp;
						<el-select v-model='zgObj.RoleOrInitiator' @change="changeValue">
							<el-option v-for='item in zgList' :label='item.label' :value='item.value' :key='item.value'>
							</el-option>
						</el-select>
					</div>
					<div class="approval_layer_info" v-if="approvalType==2">
						<div class="normalMember">
							<ul>
								<li v-for="item in showMember">{{item.DepartmentName}}</li>
								<!-- @click="mySetCheckedKeys(item.DepartmentId)"-->
							</ul>
						</div>
						<input type="button" class="normalBtn" @click="getMember(),mySetCheckedKeys(-1)" :value="$t('fnc.tjchengyuan')" />
						<div style="margin: 10px 0;" v-if="showMember.length>1">
							<el-radio-group v-model="zgObj.AuditWay">
								<el-radio :label="2">{{$t('fnc.huiquandetail')}}</el-radio>
								<el-radio :label="3">{{$t('fnc.huoqiandetail')}}</el-radio>
							</el-radio-group>
						</div>
					</div>
					<div class="approval_layer_info" v-if="approvalType==3">
						<div class="normalMember">
							<ul>
								<li v-for="item in showRole">{{item.DepartmentName}}</li>
							</ul>
						</div>
						<input type="button" class="normalBtn" @click="getRole()" :value="$t('fnc.addgangweo')" />
						<div style="margin: 10px 0;">
							<el-radio-group v-model="zgObj.AuditWay">
								<el-radio :label="2">{{$t('fnc.huiquandetail')}}</el-radio>
								<el-radio :label="3">{{$t('fnc.huoqiandetail')}}</el-radio>
							</el-radio-group>
						</div>
					</div>

				</div>
				<div class="approval_page_layer_bottom">
					<input type="button" class="hollowFixedBtn" :value="$t('pub.cancelBtn')" @click="closeLayer" /> &nbsp;&nbsp;
					<input type="button" class="normalBtn" v-if='addBtn' :value="$t('pub.sureBtn')" @click="addNode" />
					<input type="button" class="normalBtn" v-if='!addBtn' :value="$t('fnc.xgjiedian')" @click="saveUpdateNode" />
				</div>
			</div>
		</div>
		<input type="button" class="hollowFixedBtn approval_back_btn" :value="$t('pub.returnBack')" @click="goback" />
		<div class="approval_page_content" v-loading="loading" >

			<div>
				<p style="text-align: center; border-bottom:1px solid #f1f1f1;  padding: 15px 0 10px 0;font-size: 16px;">{{TemplateTypeName}}{{$t('fnc.lcshezhi')}}</p>
				<p style="padding: 10px; font-size: 14px; overflow: hidden;">{{$t('objFill.v101.administrative.dangsptsmzyxtjs')}}</p>
				<p v-if='askListType==1' class="processTimeP" style="overflow: hidden">
					<span style="padding: 10px; font-size: 14px; float: left;">{{$t('objFill.v101.administrative.qingjialeix')}}：</span>
					<el-checkbox-group class='fl' v-model="AskforleaveTypeArr">
						<el-checkbox v-for="item in askList" :label="item.Id" :key='item.Id'>{{item.Name}}</el-checkbox>
					</el-checkbox-group>
				</p>
				<p class="processTime">
					<span>{{$t('objFill.v101.administrative.shichang')}}<em v-if="askListType==2">({{$t('hotel.hotel_day')}})</em><em v-else>({{$t('salesModule.Hour')}})</em></span>：
					<el-select class='w120' v-model='addMsg.ConditionType'>
						<el-option :label="$t('objFill.v101.administrative.xiaoyu')" value='1'></el-option>
						<el-option :label="$t('objFill.v101.administrative.dayu')" value='2'></el-option>
						<el-option :label="$t('objFill.v101.administrative.dengyu')" value='3'></el-option>
						<el-option :label="$t('objFill.v101.administrative.xiaoyudengyu')" value='4'></el-option>
						<el-option :label="$t('objFill.v101.administrative.dayudengyu')" value='5'></el-option>
						<el-option :label="$t('objFill.v101.administrative.jieyulgszj')" value='6'></el-option>
					</el-select>
					<el-input-number v-if="addMsg.ConditionType!=6" class='w80' v-model="addMsg.StartValue" :controls="false" :min="0" :max="1000"></el-input-number>
					<span v-if="addMsg.ConditionType==6">
					 	 <el-input-number  class='w80' v-model="addMsg.StartValue" :controls="false"  :min="0" :max="1000"></el-input-number>
					 	 <el-select  class='w80' v-model='addMsg.StartType'>
					 	 	<el-option label='<' value='1'></el-option>
						    <el-option label='≤' value='2'></el-option>
					 	 </el-select>
					 	 {{$t('objFill.v101.administrative.shichang')}}
					 	 <el-select  class='w80' v-model='addMsg.EndType'>
					 	 	<el-option label='<' value='1'></el-option>
						    <el-option label='≤' value='2'></el-option>
					 	 </el-select>
					 	  <el-input-number   class='w80' v-model="addMsg.EndValue" :controls="false"  :min="0" :max="1000"></el-input-number>
					 </span>
				</p>
			</div>

			<div class="approval_person_content">
				<span class="approval_span_type" style="display: inline-block; margin: 10px 0;">{{$t('objFill.v101.administrative.shenpiren')}}</span>
				<div class="approval_person_list fl">
					<div class="approval_process_item" draggable="true" v-for="(item,index) in myAuditList" @click="getItemValue(item,index)">
						<span style="position: relative;" @mouseenter="itemIndex=index" @mouseleave="itemIndex='-1'">
							<i class="iconfont icon-user11"></i>
							{{item.AuditDescription}}&nbsp;
							<b class="bnotice" v-if="item.AuditWay!=1">({{item.AuditWay=="2"?$t('fnc.huiqian'):$t('fnc.huoqian')}})</b>
							<em v-if='index==itemIndex' class="iconfont icon-guanbi approval_process_item_delete"  @click.stop='deleteItem(item.Sort)'></em>
						</span>
						<i class="iconfont icon-jiantouyou"></i>
					</div>
					<input type="button" class="hollowFixedBtn" @click="addAppPerson" :value="$t('fnc.tianjia')" />
				</div>
			</div>
			<div class="approval_person_content">
				<span class="approval_span_type" style="display: inline-block; margin: 10px 0;">{{$t('objFill.v101.administrative.chaosongren')}}</span>
				<div class="approval_person_list fl">
					<div class="approval_process_item" v-for="(item,index) in myAuditUserList">
						<span style="position: relative;" @mouseenter="itemIndex1=index" @mouseleave="itemIndex1='-1'">
							<i class="iconfont icon-user11"></i>
							{{item.EmName}}&nbsp;
							<em v-if='index==itemIndex1' @click="deleteUser(item.EmployeeId)" class="iconfont icon-guanbi approval_process_item_delete" ></em>
						</span>
					</div>
					<input type="button" class="hollowFixedBtn" :value="$t('fnc.tianjia')" @click='addAuditUser' />
				</div>
			</div>
			<div style="margin: 30px 0;">
				<input type="button" :value="$t('pub.cancelBtn')" class="hollowFixedBtn" @click="goback" />
				<input type="button" :value="$t('pub.saveBtn')" class="normalBtn" @click="saveApproval" />
			</div>
		</div>

		<el-dialog custom-class='w700' :title="dialogTitle" :visible.sync="outerVisible" center>
			<div class="fl" style="width: 300px; margin: 0 20px;">
				<p style="margin: 0 0 10px 0;">{{$t('fnc.xuanze')}}:<el-input class='w200' :placeholder="$t('tips.srgjzjxguolv')"  v-model="filterText">
				</el-input>
				</p>
				<el-tree class='ApprovalProcessBg'
					:filter-node-method="filterNode"
					 :data="memberList" show-checkbox ref="tree" :props="defaultProps" :render-after-expand="false" node-key="DepartmentId" @check-change="handleNodeChange">
				</el-tree>
			</div>
			<div class="fl">
				<p style="margin: 0 0 20px 0;">{{$t('fnc.yixuan')}}:</p>
				<div class="Approval_yxList">
					<li v-for="item in showMember">{{item.DepartmentName}}
						<i @click="mySetCheckedKeys(item.DepartmentId)" class="el-icon-circle-close showMemberIcon"></i>
					</li>
				</div>
			</div>
			<div slot="footer" class="dialog-footer">
				<button class="hollowFixedBtn" @click="outerVisible = false">{{$t('pub.cancelBtn')}}</button> &nbsp;
				<button class="normalBtn" type="primary" @click="outerVisible = false">{{$t('pub.sureBtn')}}</button>
			</div>
		</el-dialog>

		<el-dialog custom-class='w700' :title="dialogTitle" :visible.sync="outerVisible1" center>
			<div class="fl" style="width: 300px; margin: 0 20px;">
				<p style="margin: 0 0 10px 0;">{{$t('fnc.xzgangwei')}}： <el-input class='w200' :placeholder="$t('tips.srgjzjxguolv')"  v-model="filterText1">
				</el-input>
				</p>
				<el-tree class='ApprovalProcessBg'
					 :filter-node-method="filterNode1"
					 :data="roleList" ref="treeRole" show-checkbox :props="defaultProps1" @check-change="checkedRole">
				</el-tree>
			</div>
			<div class="fl">
				<p style="margin: 0 0 20px 0;">{{$t('fnc.yixuangangwei')}}： </p>
				<div class="Approval_yxList">
					<li v-for="item in showRole">{{item.DepartmentName}}
						<i @click="deleteRole()" class="el-icon-circle-close showMemberIcon"></i>
					</li>
				</div>
			</div>
			<div slot="footer" class="dialog-footer">
				<button class="hollowFixedBtn" @click="outerVisible1= false">{{$t('pub.cancelBtn')}}</button> &nbsp;
				<button class="normalBtn" type="primary" @click="outerVisible1 = false">{{$t('pub.sureBtn')}}</button>
			</div>
		</el-dialog>

		<el-dialog custom-class='w700' :title="dialogTitle" :visible.sync="outerVisible2" center>
			<div class="fl" style="width: 300px; margin: 0 20px;">
				<p style="margin: 0 0 10px 0;">{{$t('fnc.xzcsongren')}}：<el-input class='w200' :placeholder="$t('tips.srgjzjxguolv')"  v-model="filterText2">
				</el-input>
				</p>
				<el-tree class='ApprovalProcessBg'
					 :filter-node-method="filterNode2"
					 :data="userList" show-checkbox ref="treeUser"

					  :props="defaultProps2" :render-after-expand="false" node-key="DepartmentId" @check-change="handleNodeChange1">
				</el-tree>
			</div>
			<div class="fl">
				<p style="margin: 0 0 20px 0;">{{$t('fnc.yixuan')}}:</p>
				<div class="Approval_yxList">
					<li v-for="item in myAuditUserList1">{{item.EmName}}
						<i @click="deleteUser(item.EmployeeId)" class="el-icon-circle-close showMemberIcon"></i>
					</li>
				</div>
			</div>
			<div slot="footer" class="dialog-footer">
				<button class="hollowFixedBtn" @click="outerVisible2 = false">{{$t('pub.cancelBtn')}}</button> &nbsp;
				<button class="normalBtn" type="primary" @click="saveAuditUser">{{$t('pub.sureBtn')}}</button>
			</div>
		</el-dialog>

	</div>
</template>

<script>
	export default {
		data() {
			return {
				filterText:"",
				filterText1:"",
				filterText2:"",
				defaultProps: {
					children: 'ChildList',
					label: 'DepartmentName',
				},
				defaultProps1: {
					children: 'ChildList',
					label: 'DepartmentName',
					disabled: "Disabled"
				},
				defaultProps2: {
					children: 'ChildList',
					label: 'DepartmentName',
				},
				zgList: [{
						value: '1',
						label: this.$t('objFill.v101.administrative.zhijiezg')
					},
					{
						value: '2',
						label: this.$t('objFill.v101.administrative.dierjizg')
					},
					{
						value: '3',
						label: this.$t('objFill.v101.administrative.disanjizg')
					},
					{
						value: '4',
						label: this.$t('objFill.v101.administrative.disijizg')
					},
					{
						value: '5',
						label: this.$t('objFill.v101.administrative.diwujizg')
					},
					{
						value: '6',
						label: this.$t('objFill.v101.administrative.diliujizg')
					},
				],
				askListType: '',
				askList: [],
				addBtn: true,
				loading: true,
				dialogTitle: '',
				outerVisible: false,
				outerVisible1: false,
				outerVisible2: false,
				itemIndex: -1,
				itemIndex1: -1,
				approvalType: 1,
				showlayer: false,
				isTransition: false,
				updateItem: [],
				updateItemIndex: -1, //修改节点
				TemplateId: '',
				AskforleaveTypeArr: [],
				addMsg: {
					Id: '-1',
					TemplateId: '',
					AuditList: [],
					AuditUserList: [],
					AskforleaveType: [],
					DayHour: 1,
					ConditionType:'1',
					StartValue: '',
					StartType: '1',
					EndValue: '',
					EndType: '1',
					Sort: '',
				},
				zgObj: {
					AuditDescription: '',
					RoleOrInitiator: '1',
					AuditType: '',
					AuditUserList: [],
					AuditWay: 2,
					Sort: '',
				},
				tempChosenId: -1,
				//返回数据
				TemplateTypeName:'',
				myAuditList: [],
				myAuditUserList: [],
				myAuditUserList1: [],
				memberList: [],
				sysUserKeys: [],
				userList: [],
				roleList: [],
				checkedMember: [],
				showMember: [],
				showRole: [],
				memberSetCheckedKeys: [],
				memberSetCheckedUserKeys: [],
				normalMember: [],
			}
		},
		 watch: {
	      filterText(val) {
	        this.$refs.tree.filter(val);
	      },
	      filterText1(val) {
	        this.$refs.treeRole.filter(val);
	      },
	      filterText2(val) {
	        this.$refs.treeUser.filter(val);
	      }
	    },
		methods: {
		     filterNode(value, data) {
		        if (!value) return true;
		        return data.DepartmentName.indexOf(value) !== -1;
		      },
		      filterNode1(value, data) {
		        if (!value) return true;
		        return data.DepartmentName.indexOf(value) !== -1;
		      },
		      filterNode2(value, data) {
		        if (!value) return true;
		        return data.DepartmentName.indexOf(value) !== -1;
		      },
			getAppType() {
				this.apipost('WorkFlow_get_GetAskForLeaveType', {
					TemplateId: this.TemplateId
				}, res => {
					if(res.data.resultCode == 1) {
						this.loading=false;
						this.askListType = res.data.data.TemplateType
						this.TemplateTypeName = res.data.data.TemplateTypeName
						this.askList = res.data.data.askList
					}

				}, err => {})
			},
			addAppPerson() {
				this.approvalType=1;
				this.addBtn = true;
				this.showLayer();
			},
			deleteUser(id) {
				if(this.memberSetCheckedUserKeys.findIndex(item => item === id) != -1) {
					this.memberSetCheckedUserKeys.splice(this.memberSetCheckedUserKeys.findIndex(item => item === id), 1)
				}
				if(this.myAuditUserList.findIndex(item => item.EmployeeId === id) != -1) {
					this.myAuditUserList.splice(this.myAuditUserList.findIndex(item => item.EmployeeId === id), 1)
				}
				if(this.myAuditUserList1.findIndex(item => item.EmployeeId === id) != -1) {
					this.myAuditUserList1.splice(this.myAuditUserList1.findIndex(item => item.EmployeeId === id), 1)
				}

			},
			addAuditUser() {
				let _arr = this.sysUserKeys.concat(this.memberSetCheckedUserKeys)
				this.dialogTitle =  this.$t('fnc.xzrenyuan');
				this.outerVisible2 = true;
				let _this = this;
				this.apipost('WorkFlow_get_GetDepartMentEmployee', {}, res => {
					if(res.data.resultCode == 1) {
						this.userList = res.data.data
						_this.$refs.treeUser.setCheckedKeys(_arr);
					}
				}, err => {})
				//
			},
			saveAuditUser() {
				if(this.myAuditUserList1.length <= 10) {
					this.myAuditUserList = JSON.parse(JSON.stringify(this.myAuditUserList1))
					this.outerVisible2 = false
				} else {
					this.$message.error(this.$t('tips.rsbncgtr'))
					return false;
				}

			},
			clearValue(value) {
				if(value == '1') {
					this.zgObj.RoleOrInitiator = '1'
				}
				if(value == '2') {
					this.showMember = [];
					this.memberSetCheckedKeys = [];
				}
				if(value == '3') {
					this.showRole = []
					this.zgObj.AuditWay=2
				}
			},
			getMember() {
				this.outerVisible = true;
				this.dialogTitle =  this.$t('fnc.xzrenyuan');
				this.apipost('WorkFlow_get_GetDepartMentEmployee', {}, res => {
					this.memberList = res.data.data
				}, err => {})
			},
			getRole() {
				this.outerVisible1 = true;
				this.dialogTitle = this.$t('fnc.xzgangwei');
				this.apipost('WorkFlow_get_GetDepartMentPost', {}, res => {
					this.roleList = res.data.data
				}, err => {})
			},
			handleNodeChange1(data, checked) {
				data.IsCheck = checked;
				if(data.Type == 2 && data.IsCheck) { //是员工且选中
					let isExsit = false
					this.myAuditUserList1.forEach(x => {
						if(x.EmployeeId == data.DepartmentId) {
							isExsit = true
							return false
						}
					})
					if(!isExsit) {
						this.myAuditUserList1.push({
							EmName: data.DepartmentName,
							EmployeeId: data.DepartmentId,
							Sort: '1'
						})
						this.memberSetCheckedUserKeys.push(data.DepartmentId)
					}
				} else if(data.Type == 2 && !data.IsCheck) {
					if(this.myAuditUserList1.findIndex(item => item.EmployeeId === data.DepartmentId) != -1) {
						this.myAuditUserList1.splice(this.myAuditUserList1.findIndex(item => item.EmployeeId === data.DepartmentId), 1)
						this.memberSetCheckedUserKeys.splice(this.memberSetCheckedUserKeys.findIndex(item => item === data.DepartmentId), 1)
						if(this.myAuditUserList1.findIndex(item => item.EmployeeId === data.ParentId) != -1) {
							this.memberSetCheckedUserKeys.splice(this.memberSetCheckedUserKeys.findIndex(item => item === data.ParentId), 1)
						}
					}
				}
				if(data.Type != 2 && data.IsCheck) {
					if(this.memberSetCheckedUserKeys.findIndex(item => item === data.DepartmentId) == -1) {
						this.memberSetCheckedUserKeys.push(data.DepartmentId)
					}
				} else if(data.Type == 2 && !data.IsCheck) {
					if(this.memberSetCheckedUserKeys.findIndex(item => item === data.DepartmentId) != -1) {
						this.memberSetCheckedUserKeys.splice(this.memberSetCheckedUserKeys.findIndex(item => item === data.DepartmentId), 1)
						if(this.myAuditUserList1.findIndex(item => item.EmployeeId === data.ParentId) != -1) {
							this.memberSetCheckedUserKeys.splice(this.memberSetCheckedUserKeys.findIndex(item => item === data.ParentId), 1)
						}
					}
				}
			},
			handleNodeChange(data, checked) {
				data.IsCheck = checked;
				if(data.Type == 2 && data.IsCheck) { //是员工且选中
					let isExsit = false
					this.showMember.forEach(x => {
						if(x.DepartmentId == data.DepartmentId) {
							isExsit = true
							return false
						}
					})
					if(!isExsit) {
						this.showMember.push({
							DepartmentName: data.DepartmentName,
							DepartmentId: data.DepartmentId
						})
						this.memberSetCheckedKeys.push(data.DepartmentId)
					}
				} else if(data.Type == 2 && !data.IsCheck) {
					if(this.showMember.findIndex(item => item.DepartmentId === data.DepartmentId) != -1) {
						this.showMember.splice(this.showMember.findIndex(item => item.DepartmentId === data.DepartmentId), 1)
						this.memberSetCheckedKeys.splice(this.memberSetCheckedKeys.findIndex(item => item === data.DepartmentId), 1)
						if(this.showMember.findIndex(item => item.DepartmentId === data.ParentId) != -1) {
							this.memberSetCheckedKeys.splice(this.memberSetCheckedKeys.findIndex(item => item === data.ParentId), 1)
						}
					}
				}
				if(data.Type != 2 && data.IsCheck) {
					if(this.memberSetCheckedKeys.findIndex(item => item === data.DepartmentId) == -1) {
						this.memberSetCheckedKeys.push(data.DepartmentId)
					}
				} else if(data.Type == 2 && !data.IsCheck) {
					if(this.memberSetCheckedKeys.findIndex(item => item === data.DepartmentId) != -1) {
						this.memberSetCheckedKeys.splice(this.memberSetCheckedKeys.findIndex(item => item === data.DepartmentId), 1)
						if(this.showMember.findIndex(item => item.DepartmentId === data.ParentId) != -1) {
							this.memberSetCheckedKeys.splice(this.memberSetCheckedKeys.findIndex(item => item === data.ParentId), 1)
						}
					}
				}
			},
			mySetCheckedKeys(id) {
				if(this.memberSetCheckedKeys.length == 0)
					return
				if(id == -1) {
					this.$refs.tree.setCheckedKeys(this.memberSetCheckedKeys)
					return
				}
				this.showMember.splice(this.showMember.findIndex(item => item.DepartmentId === id), 1)
				this.memberSetCheckedKeys.splice(this.memberSetCheckedKeys.findIndex(item => item === id), 1)
				this.$refs.tree.setCheckedKeys(this.memberSetCheckedKeys);
			},
			mySetCheckedUsersKeys() {

			},
			checkedRole(data, checked) {
				data.IsCheck = checked;
				if(data.Disabled == false && data.IsCheck) {
					this.showRole = [];
					this.showRole.push({
						DepartmentName: data.DepartmentName,
						Id: data.DepartmentId
					})
				}

			},
			deleteItem(sort) {
				this.myAuditList.splice(this.myAuditList.findIndex(item => item.Sort === sort), 1)
			},
			getItemValue(obj, index) {
				this.addBtn = false;
				this.updateItemIndex = index;
				this.updateItem = obj;
				this.showLayer();
				this.approvalType = obj.AuditType;
				if(obj.AuditType == 1) {
					this.zgObj.RoleOrInitiator = obj.RoleOrInitiator.toString();
				}
				if(obj.AuditType == 2) {
					this.showMember = [];
					this.memberSetCheckedKeys = [];
					this.zgObj.AuditWay = obj.AuditWay;
					obj.AuditUserList.forEach((item, index) => {
						this.showMember.push({
							DepartmentName: item.EmName,
							DepartmentId: item.EmployeeId
						})
						this.memberSetCheckedKeys.push(item.EmployeeId)
					})
				}
				if(obj.AuditType == 3) {
					this.zgObj.AuditWay = obj.AuditWay;
					this.showRole = [];
					this.showRole.push({
						DepartmentName: obj.AuditDescription
					})
				}

			},
			saveUpdateNode() {
				let zg = {}
				if(this.approvalType == 1) {
					zg.AuditType = 1;
					zg.AuditWay = 1;
					zg.AuditUserList = null,
						zg.Sort = this.myAuditList.length + 1;
					zg.RoleOrInitiator = this.zgObj.RoleOrInitiator
					let obj = {}
					if(this.tempChosenId != -1) {
						obj = this.zgList.find((item) => {
							return item.value === this.tempChosenId;
						})
						zg.AuditDescription = obj.label
					} else {
						zg.AuditDescription = '直接主管'
					}
					this.myAuditList[this.updateItemIndex] = zg;
				}
				if(this.approvalType == 2) { //指定成员
					let Au = this.showMember;
					let Auu = [];
					Au.forEach((item, index) => {
						Auu.push({
							EmployeeId: item.DepartmentId,
							EmName: item.DepartmentName,
							Sort: index
						})
					})
					if(Auu.length==1){
						zg.AuditWay = 1
						zg.AuditDescription = Auu[0].EmName
					}else if(Auu.length>1){
						zg.AuditWay = this.zgObj.AuditWay;
						zg.AuditDescription = '指定' + this.showMember.length + '人'
					}
					zg.AuditType = 2;
					zg.RoleOrInitiator = '-1';
					zg.Sort = this.myAuditList.length + 1;
					zg.AuditUserList = Auu;
					if(Auu.length == 0) {
						this.$message.error(this.$t('tips.cybnweikong'))
						return
					} else if(Auu.length > 10) {
						this.$message.error(this.$t('tips.rsbncgtr'))
						return
					}
					this.myAuditList[this.updateItemIndex] = zg;
				}
				if(this.approvalType == 3) { //岗位
					zg.AuditType = 3;
					zg.AuditWay = this.zgObj.AuditWay;
					zg.Sort = this.myAuditList.length + 1;
					zg.AuditUserList = '';
					if(this.showRole.length == 0) {
						this.$message.error(this.$t('tips.qxzgangwei'))
						return
					} else {
						zg.RoleOrInitiator = this.showRole[0].Id;
						zg.AuditDescription = this.showRole[0].DepartmentName;
					}
					this.myAuditList[this.updateItemIndex] = zg;
				}
				this.closeLayer()

			},
			deleteRole() {
				this.showRole = [];
			},
			changeValue(value) {
				this.tempChosenId = value
			},
			addNode() {
				//data>>AuditList>>AuditType 核人类型 1主管(指定一级) 2 指定成员 3角色
				let zg = {}
				if(this.approvalType == 1) //主管
				{
					zg.AuditType = 1;
					zg.AuditWay = 1;
					zg.AuditUserList = null,
						zg.Sort = this.myAuditList.length + 1;
					zg.RoleOrInitiator = this.zgObj.RoleOrInitiator
					let obj = {}
					if(this.tempChosenId != -1) {
						obj = this.zgList.find((item) => {
							return item.value === this.tempChosenId;
						})
						zg.AuditDescription = obj.label
					} else {
						zg.AuditDescription = '直接主管'
					}
					this.myAuditList.push(zg);
				}
				if(this.approvalType == 2) { //指定成员
					let Au = this.showMember;
					let Auu = [];
					Au.forEach((item, index) => {
						Auu.push({
							EmployeeId: item.DepartmentId,
							EmName: item.DepartmentName,
							Sort: index
						})
					})
					if(Auu.length==1){
						zg.AuditWay = 1
						zg.AuditDescription = Auu[0].EmName
					}else if(Auu.length>1){
						zg.AuditWay = this.zgObj.AuditWay;
						zg.AuditDescription = '指定' + this.showMember.length + '人'
					}
					zg.AuditType = 2;
					zg.RoleOrInitiator = '-1';
					zg.Sort = this.myAuditList.length + 1;
					zg.AuditUserList = Auu;
					if(Auu.length == 0) {
						this.$message.error(this.$t('tips.cybnweikong'))
						return
					} else if(Auu.length > 10) {
						this.$message.error(this.$t('tips.rsbncgtr'))
						return
					}

					this.myAuditList.push(zg);
				}
				if(this.approvalType == 3) { //岗位
					zg.AuditType = 3;
					zg.AuditWay = this.zgObj.AuditWay;
					zg.Sort = this.myAuditList.length + 1;
					zg.AuditUserList = '';
					if(this.showRole.length == 0) {
						this.$message.error(this.$t('tips.qxzgangwei'))
						return
					} else {
						zg.RoleOrInitiator = this.showRole[0].Id;
						zg.AuditDescription = this.showRole[0].DepartmentName;
					}
					this.myAuditList.push(zg);
				}
				this.closeLayer()
			},
			showLayer() {
				this.showlayer = true;
				this.isTransition = true;
			},
			closeLayer() {
				let _this = this;
				setTimeout(function() {
					_this.showlayer = false;
				}, 300)
				this.isTransition = false;
			},
			saveApproval() {
				if(this.askListType==1)
				{
				   if(this.AskforleaveTypeArr.length == 0) {
					this.$message.error(this.$t('objFill.v101.administrative.qingxuanzqjlx'))
					return
				  }
				}
				if(this.addMsg.ConditionType!=6&&this.addMsg.StartValue==''){
					this.$message.error(this.$t('objFill.v101.administrative.qingshursc'))
					return
				}
				if(this.addMsg.ConditionType==6)
				{
					if(this.addMsg.StartValue==''||this.addMsg.EndValue==''){
					   this.$message.error(this.$t('objFill.v101.administrative.qingshursc'))
					   return
					}
				}
				this.addMsg.AuditList = this.myAuditList;
				this.addMsg.AuditUserList = this.myAuditUserList;
				this.ConditionSortList = [],
				this.addMsg.AskforleaveType = '[' + this.AskforleaveTypeArr.toString() + ']'
				this.loading = true;
				this.apipost('WorkFlow_post_SetOtherCondition', this.addMsg, res => {
					if(res.data.resultCode == 1) {
						this.loading = false;
						this.$message.success(this.$t('tips.czchenggong'))
						this.goback()
					}else{
						this.$message.success(res.data.message)
					}
				}, err => {})
			},
			goback() {
				history.back(-1)
			}
		},
		mounted() {
			this.TemplateId = this.addMsg.TemplateId = this.$route.query.id
			this.getAppType()
		}

	}
</script>

<style>
	.processTimeP .el-checkbox+.el-checkbox {
		margin-left: 10px;
		margin-top: 10px;
	}

	.processTime {
		margin: 10px 0;
		font-size: 14px;
		padding-left: 10px;
	}

	.processTime .el-input {
		height: 38px;
	}

	.processTime em {
		font-style: normal;
	}

	.processTime .el-input .el-input__inner {
		border-radius: 4px!important;
	}

	.showMemberIcon {
		float: right;
		font-size: 20px;
		margin: 10px 20px 0 0;
		color: #999;
		cursor: pointer;
	}

	.normalMember {
		margin: 10px 0;
		width: 700px;
		max-height: 500px;
		overflow: auto
	}

	.normalMember li {
		display: inline-block;
		margin: 10px;
		padding: 5px 10px;
		background: #f8f8f8;
		border-radius: 4px;
		text-align: center;
		font-size: 14px;
		color: #333;
	}

	.approval_layer_info {
		padding: 20px 0 0 30px;
	}

	.ApprovalProcessBg {
		background: #f8f8f8;
		max-height: 400px;
		overflow-y: auto;
	}

	.Approval_yxList {
		width: 300px;
		background: #f8f8f8;
		min-height: 400px;
		max-height: 400px;
		overflow-y: auto;
	}

	.Approval_yxList li {
		line-height: 40px;
		text-indent: 15px;
		border-bottom: 1px dotted #eee;
	}

	.approval_page_content i {
		color: #999!important;
	}

	.approval_page_layer_bottom {
		position: absolute;
		bottom: 20px;
		padding-left: 20px;
	}

	.approval_span_type {
		float: left;
		width: 120px;
		margin-bottom: 10px;
	}

	.approval_process_item_delete {
		position: absolute;
		right: 2px;
		top: -11px;
		font-size: 5px;
	}

	.approval_process_item {
		display: inline-block;
		margin: 10px 5px 10px 0;
		cursor: pointer;
	}

	.approval_process_item b.bnotice {
		color: #E95252;
	}

	.approval_process_item>span {
		padding: 0 10px;
		min-width: 100px;
		height: 40px;
		line-height: 40px;
		text-align: center;
		font-size: 12px;
		background: #f8f8f8;
		border-radius: 4px;
		display: inline-block;
	}

	.approval_page_layer {
		position: fixed;
		width: 100%;
		left: 0;
		top: 0;
		z-index: 99;
		height: 100%;
		background: rgba(0, 0, 0, .2);
	}

	.approval_page_title {
		height: 14px;
		line-height: 14px;
		padding-left: 15px;
		border-left: 3px solid #E95252;
		margin: 20px 0 20px 0;
	}

	.approval_back_btn {
		margin: 20px 0;
	}

	.approval_page_content {
		width: 680px;
		min-height: 480px;
		overflow: hidden;
		padding: 0 20px;
		background: #fff;
		border-radius: 4px;
	}

	.approval_person_content {
		padding: 0 30px;
		overflow: hidden;
		margin-bottom: 30px;
	}

	.approval_person_content>span {
		font-size: 12px;
		color: #666;
		margin-right: 30px;
	}

	.approval_person_list {
		float: left;
		width: 550px;
		max-height: 400px;
		overflow: auto;
	}

	.approval_person_set {
		width: 800px;
		height: 100%;
		transition: right .3s;
		background: #fff;
		position: absolute;
		top: 0;
		right: -800px;
		box-shadow: 4px 0px 10px rgba(0, 0, 0, 0.1)
	}

	.approval_person_set_right {
		right: 0;
	}

	.approval_person_set .setTitle {
		height: 48px;
		line-height: 48px;
		background: #EDEEF0;
		font-size: 16px;
		color: #333;
		text-indent: 20px;
	}

	.approval_person_layerContent {
		padding-left: 20px;
		overflow: hidden;
	}
</style>
