<template>
	<view class="uinfo_view">
		<view class="u_head">
			<view class="head_img">
				<image :src="currentUser.headimgurl"  class="i_img"></image>
			</view>
		</view>
		<view class="u_mid">
			<view class="mid_view">
				<view class="tab_left">
					姓　名：<!-- <text style="color: red;position: absolute;">*</text> -->
				</view>
				<view class="tab_rig">
					<input :disabled="uinfo.userStatus == 2" v-model="uinfo.realName" placeholder="请填写姓名"/>
				</view>
			</view>
			<view class="mid_view">
				<view class="tab_left">
					手机号：<!-- <text style="color: red;position: absolute;">*</text> -->
				</view>
				<view class="tab_rig">
					<input v-model="uinfo.mobile" type="number"  placeholder="请填写手机号码" maxlength="11"/>
				</view>
			</view>
			<view class="mid_view code-box" >
				<view class="tab_left">
					验证码：
				</view>
				<view class="tab_rig">
					<input class="ipt" v-model="vCode" type="number"  placeholder="请填写验证码" maxlength="6"/>
				</view>
				<view class="getCodeBtn" :class="jsq ? 'bg-ccc' : ''" @click="getCodeInfo()">{{btnText}}</view>
			</view>
			
			
			<view v-if="true" class="mid_view">
				<view class="tab_left">
					学　校：
				</view>
				<view class="ipt-box select">
					<image class="arrow" src="/static/icons/right-arrow.png" mode=""></image>
					<picker class="picker" v-if="companyList.length > 0" :range="companyList" @change="companyChange" range-key="name">
						<view>{{ companyList[companyListIndex].name }}</view>
					</picker>
				</view>
			</view>
			
			<view  class="mid_view" v-if="companyList[companyListIndex].name != '其它'">
				<view class="tab_left">
					单　位：
				</view>
				<view class="ipt-box select">
					<image class="arrow" src="/static/icons/right-arrow.png" mode=""></image>
					<picker class="picker" v-if="departmentList.length > 0" :range="departmentList" @change="departmentChange" range-key="name">
						<view>{{ departmentList[departmentListIndex].name }}</view>
					</picker>
				</view>
			</view>
			
			<view  class="mid_view" v-if="companyList[companyListIndex].name != '其它'">
				<view class="tab_left">
					部门/班级：
				</view>
				<view class="ipt-box select">
					<image class="arrow" src="/static/icons/right-arrow.png" mode=""></image>
					<picker class="picker" v-if="classList.length > 0" :range="classList" @change="classChange" range-key="name">
						<view>{{ classList[classListIndex].name }}</view>
					</picker>
				</view>
			</view>
			
			<view class="mid_view"  v-if="companyList[companyListIndex].name == '其它'">
				<view class="tab_left">
					
				</view>
				<view class="tab_rig">
					<input v-model="uinfo.companyName" placeholder="请填写学校名称名称"/>
				</view>
				
			</view>
			
			<view v-if="uinfo.userStatus ==2 || uinfo.userStatus == 1" class="mid_view">
				<view class="tab_left">
					状　态：
				</view>
				<view v-if="uinfo.role<40 || uinfo.role>60" class="tab_rig">
					<label>您已注册为企业用户</label>
				</view>
				<view v-else-if="uinfo.userStatus==1" class="tab_rig">
					<label>{{this.uinfo.orgName}}/未审核</label>
				</view>
				<view v-else-if="uinfo.userStatus==2" class="tab_rig">
					<label>{{this.uinfo.orgName}}/已审核</label>
				</view>
				
			</view>
			 
			
			
		</view>
		<!-- <button class="confirm-btn bg-gray" v-if="uinfo.register == 1 ">待审核</button>
		<button class="confirm-btn" v-else @click="toSubUinfo">更新</button> -->
		<button class="confirm-btn" @click="toSubUinfo">更新</button>
		<!-- <view style="width: 100%;padding: 12upx 0upx 24upx 0upx;text-align: center;font-size: 28upx;background: white;position: fixed;bottom: 0upx;color: gray;">
			<text>甘肃同兴智能科技发展有限责任公司提供技术支持</text><br>
			<text>13919995340</text>
		</view> -->
		<wechat @getOpenId="getOpenId"></wechat>
	</view>
</template>

<script>
	import{saveWechatUserOfSchool,iOpenidGetUserInfo,getCodeInfo,getAllSchool,getAllFacultyBySchool,getAllClassByFaculty} from '@/common/api.js'
	import {callbackRequest,alertTip,setStorage,getStorage,devEnv} from '@/common/util.js'
	import uniIcons from '@/components/uni-icons/uni-icons.vue';
	import wechat from '@/mixins/wechat.vue'
	import dyDatetimePicker from '@/components/dateTime.vue'
	import xflSelect from '../../components/xfl-select/xfl-select.vue'
	export default {
		components: {
			uniIcons,
			wechat,
			dyDatetimePicker,
			xflSelect 
		},
		data() {
			return {	
				sexs: ["男","女"],
				index: 0,
				currentUser: {},
				uinfo:{
					realName:'',
					idnumber:'',
					telnumber:'',
					orgName:'',
					isInner:'',
					deptName:''
				},
				vCode:'',
				codeKey:'',
				saving:false,
				jsq:null,//计时器
				btnText:'获取验证码',
				list: [],
				finalList: [],
				
				showList:false,
				isload:false,
				ttt:"444",
				items: [{
							value: '1',
							name: '内部'
						},
						{
							value: '2',
							name: '外部',
							checked: 'true'
						},
						
					],
				current: 0,
				departmentList: [{name:"请选择..."}], //部门列表
				departmentListIndex:0,
				companyList: [{name:"请选择..."}], //部门列表
				companyListIndex:0,
				needInitial:false,//用于初始化院系信息
				classList:[{name:"请选择..."}],//班级列表
				classListIndex:0,//选择的班级下标
				classNeedInitial:false,//用于初始化班级信息
					
			}
			
		},
		/* components: { xflSelect },  //注册为子组件 */
		computed: {
		},
		onLoad() {
			
			// this.getOrgeName();
			this.getSchool();
		},
		methods: {
			radioChange: function(evt) {
				if(this.uinfo.isInner == 2){
					return
				}
				for (let i = 0; i < this.items.length; i++) {
					if (this.items[i].value === evt.target.value) {
						
						this.current = i;
						//this.uinfo.isInner = this.items[this.current].value;
						break;
					}
				}
				
			},

			makePhone(x){
				// 导入Activity、Intent类
				var Intent = plus.android.importClass("android.content.Intent");  
				var Uri = plus.android.importClass("android.net.Uri");  
				// 获取主Activity对象的实例  
				var main = plus.android.runtimeMainActivity();  
				// 创建Intent  
				var uri = Uri.parse("tel:"+x); // 这里可修改电话号码  
				var call = new Intent("android.intent.action.CALL",uri);  
				// 调用startActivity方法拨打电话  
				main.startActivity( call );  
			},
			getOpenId(e){

				if(devEnv){
					this.currentUser = {
						// openid:"o1Y6NxPbYn-aetCzknfLTn26IM-M",
						openid:"ovRg7w7y-xtRAIwydz8cpSi00Dsc",
						headimgurl:"http://thirdwx.qlogo.cn/mmopen/vi_32/Q0j4TwGTfTISdddo0mV33rHIXxtRXPvYNTq5DOI8hWaBfGmDu633AuOkcpicm2zvN2nCQDQTPJ0hRQoERqiaDetw/132"
					}
				} else {
					this.currentUser = e;
				}
				this.iOpenidGetUserInfo();
			},
			iOpenidGetUserInfo(){
				let data = {
					"method": iOpenidGetUserInfo,
					"data": {
						wxOpenId:this.currentUser.openid,
						headportrait:this.currentUser.headimgurl
					}
				};
				let that = this;
				callbackRequest(data)
				.then(res =>{
					
					console.log("code:",res.data);
					if(res.data.returnCode == 1){
						this.uinfo = res.data.returnData;
						this.uinfo.wxOpenId = this.currentUser.openid;
						this.uinfo.wxProfile = this.currentUser.headimgurl;
						this.uinfo.isInner = res.data.returnData.isInner;
						this.uinfo.userStatus = res.data.returnData.userStatus;
						this.uinfo.role = res.data.returnData.role;
						
						if(!this.uinfo.realName){
							this.uinfo.realName = '';
						}
						if(!this.uinfo.mobile){
							this.uinfo.mobile = '';
						}
						if(!this.uinfo.orgName){
							
							this.uinfo.orgName='';
						}
						if(res.data.returnData.isInner == 2){
							this.uinfo.companyName=res.data.returnData.orgName;
						}
						
						that.ttt = that.uinfo.departmentName || that.uinfo.orgName;
						
						for(var k=0; k<that.companyList.length; k++){
							if(that.uinfo.orgName == that.companyList[k].name){
								this.companyListIndex = k;
								break;
							}
						}
						this.needInitial = true;
						this.classNeedInitial = true;
						that.getAllFacultyBySchool();
						
						
						
						
						that.isload=true;
						if(this.uinfo.gender == '男'){
							this.index=0;
						}else{
							this.index=1;
						}
						
						if(this.uinfo.userStatus == 2 && this.uinfo.isInner == 2){
							this.current = 1;
						}
						
						setStorage('userInfo',this.uinfo);
					} else {
						this.isload=true;
					}
				})
			},
			//获取公司列表
			getSchool() {
				let data = {
					method: getAllSchool,
					data: {}
				};
				callbackRequest(data).then(res => {
					if (res.data.returnCode == 1) {
						// console.log("---",res.data.returnData);
						
						this.companyList = this.companyList.concat(res.data.returnData);
						// this.companyList = this.companyList.concat([{name:"其它"}]);
						console.log(this.companyList)
					}
				});
			},
			//公司改变事件
			companyChange(e) {
				this.companyListIndex = e.detail.value;
				console.log(this.companyListIndex);
				this.getAllFacultyBySchool();
			},
			//获取某个学校的院系列表
			getAllFacultyBySchool(){
				let data = {
					method: getAllFacultyBySchool,
					data: {companyName:this.companyList[this.companyListIndex]}
				};
				callbackRequest(data).then(res => {
					let that=this;
					if (res.data.returnCode == 1) {

						this.departmentList = [{name:"请选择..."}];
						this.departmentList = this.departmentList.concat(res.data.returnData);
						if(this.departmentListIndex >= this.companyList.length){
							this.departmentListIndex = 0;
						}
						console.log(this.departmentList);
						//刚进入页面时，部门数据回显
						if(this.needInitial){
							for(var k=0; k<that.departmentList.length; k++){
								if(that.ttt == that.departmentList[k].name){
									that.departmentListIndex = k;
									break;
								}
							}
							this.getAllClassByFaculty();
							this.needInitial = false;
						}
					}
				});
			},
			//院系切换
			departmentChange(e) {
				this.departmentListIndex = e.detail.value;
				console.log(this.departmentListIndex);
				this.getAllClassByFaculty();
			},
			//获取某个院系的班级列表
			getAllClassByFaculty(){
				let data = {
					method: getAllClassByFaculty,
					data: {facultyName:this.departmentList[this.departmentListIndex]}
				};
				callbackRequest(data).then(res => {
					if (res.data.returnCode == 1) {
			
						this.classList = [];
						this.classList = this.classList.concat(res.data.returnData);
						if(this.classListIndex >= this.classList.length){
							this.classListIndex = 0;
						}
						console.log(this.classList);
						//刚进入页面时，部门数据回显
						if(this.classNeedInitial){
							for(var k=0; k<this.classList.length; k++){
								if(this.uinfo.className == this.classList[k].name){
									this.classListIndex = k;
									break;
								}
							}
							this.classNeedInitial = false;
						}
					}
				});
			},
			//班级切换
			classChange(e) {
				this.classListIndex = e.detail.value;
				console.log(this.classListIndex);
			},
			getOrgeName(){
				let data = {
					"method": getOrargs,
					"data": {
					}
				}
				callbackRequest(data)
				.then(res =>{
					if(res.data.returnCode == 1){
						this.list = res.data.returnData;
						this.finalList = this.list;
					}
				})
			},
			inputSel(e){
				this.uinfo.orgName = e.detail.value;
				if(e.detail.value == ""){
					this.finalList = this.list;
					this.showList = true;
					return
				}
				var finalList = [];
				for (var i = 0; i < this.list.length; i++) {
					let ite = this.list[i];
					// 包含某一字符串
					if(ite.indexOf(e.detail.value) !== -1){
						finalList = finalList.concat(ite);
					}
				}
				this.finalList = finalList;
				this.showList = true;
			},
			changeSel(newVal){
				this.uinfo.orgName = newVal.newVal;
			},
			checkPhone (phone) {
			  if (!(/^1[3456789]\d{9}$/.test(phone))) {   
				  return false;
			  } 
			  return true;
			},
			testCode(code) {
				if(!(/^\d{6}$/.test(code))){
					return false;
				}
				return true;
			},
			getCodeInfo(){
				if(this.jsq){return false;}
				if (!this.checkPhone(this.uinfo.mobile)) {
					alertTip('请填写正确的手机号码','',1000);
					return false;
				}
				let data = {
					"method": getCodeInfo,
					"data": {
						phone:this.uinfo.mobile
					}
				}
				callbackRequest(data)
				.then(res =>{
					if(res.data.returnCode == 1){
						this.codeKey = res.data.returnMsg;
						alertTip('验证码已发送，请注意查收！','',3000);
						this.timer();
					}
				})
			},
			//倒计时
			timer(){
				let i = 60;
				let _this = this;
				this.jsq = setInterval(function(){
					if(i == 0){
						_this.btnText = '重新发送';
						clearInterval(_this.jsq);
						_this.jsq = null;
						return false;
					}
					_this.btnText = i+'s';
					i--;
				},1000);
				
			},
			toSubUinfo() {
				if(!this.currentUser.openid){
					alertTip('微信授权失败，请退出重新进入此页面','',3000);
					return false;
				}
				if(!this.uinfo.realName){
					alertTip('姓名不能为空','',1000);
					return false;
				}
				if (!this.checkPhone(this.uinfo.mobile)) {
					alertTip('请填写正确的手机号码','',1000);
					return false;
				}
				if (!this.testCode(this.vCode)) {
					alertTip('请输入六位数字验证码','',1000);
					return false;
				}
				if(this.companyList[this.companyListIndex].name == '请选择...'){
					alertTip('请选择单位信息','',1000);
					return false;
				}
				if(this.companyList[this.companyListIndex].name == '其它' && !this.uinfo.companyName){
					alertTip('请输入单位信息','',1000);
					return false;
				}
				if(this.companyList[this.companyListIndex].name != '其它' && 
				this.departmentList[this.departmentListIndex].name == '请选择...'){
					alertTip('请选择部门信息','',1000);
					return false;
				}
				
				uni.showModal({
					title: "保存信息",
					content: "确定要保存修改内容？",
					showCancel: true,
					cancelText: "取消",
					confirmText: "保存",
					success: (res) => {
						if (res.confirm) {
							
							let that = this;
							that.saving = true
							that.uinfo.gender = that.sexs[that.index];
							that.uinfo.wxOpenId = that.currentUser.openid;
							that.uinfo.wxProfile = that.currentUser.headimgurl;
							that.uinfo.vCode = that.vCode;
							that.uinfo.codeKey = that.codeKey;
							console.log("codeKey--->"+that.uinfo.codeKey)
							// debugger
							if(that.companyList[that.companyListIndex].name == '其它'){
								that.uinfo.orgName = that.uinfo.companyName;
							}
							else{
								that.uinfo.orgName = that.companyList[that.companyListIndex].name;
							}
							that.uinfo.departmentName = that.departmentList[that.departmentListIndex].name;
							that.uinfo.className = that.classList[that.classListIndex].name;
							that.uinfo.departmentId = that.departmentList[that.departmentListIndex].id;
							
							let param={
								"method":saveWechatUserOfSchool,
								data:that.uinfo,
							}
							console.log("params:",that.uinfo);
							callbackRequest(param)
							.then(({data}) => {
								if(data.returnCode == 2){
									that.uinfo.register = 1;
									//that.uinfo.isCheck = 0;
									that.uinfo.isCheck = 1;//信息错误，不变成待审核
									alertTip(data.returnMsg,'',5000);
								}
								else if(data.returnCode == 1){
									alertTip(data.returnData.returnMsg);
									that.uinfo.userStatus = 2;
									that.uinfo.role = data.returnData.role;
								}
								else if(data.returnCode == 0){
									alertTip(data.returnMsg);
								}
							})
							
						} else if (res.cancel) {
						}
					}

				})
			},
			bindDateChange: function(e) {
				this.date = e.target.value
			},
			chooseDate(e) {
				this.date = e.time;
			},
			change(type, e) {
				this.index = e.detail.value;
			},
			confirm(e) {
				this.selectedTime = e.fulldate;
			},
			open() {
				this.$refs.calendar.open();
			},
			
		},
	}
</script>

<style lang="scss">
	@import '@/static/css/common.scss';
	.bg-ccc{
		background: #ccc !important;
	}
	.icon_view {
		color: $font-color-light;
		margin-left: 2vw;
	}

	.uinfo_view {
		font-size: $font-lg;
		background: #fff;
		min-height:100vh;
	}

	.u_head {
		padding: 4vw;
	}

	.head_img {
		margin: 40upx auto;
		margin-top: 50upx;
		width: 25vw;
		height: 25vw;
		box-shadow: 0 0 10rpx 1rpx #f8f8f8;
		border-radius:50%;
	}
	.head_img image{
		width:100%;
		height:100%;
		border-radius: 50%;;
	}
	.head_edit {
		position: absolute;
		top: 41vw;
		left: 56vw;
		width: 10vw;
		height: 10vw;
		z-index: 9999;
	}

	.i_img {
		width: 100%;
		height: 100%;
		border-radius: 50%;

	}

	.head_name {
		font-size: 40upx;
		font-weight: 800;
		text-align: center;
	}

	.u_mid {
		padding: 4vw;
	}

	.mid_view {
		padding: 4vw 0;
		display: flex;
		border-bottom: 1px solid #eee;
	}
	.code-box  .getCodeBtn{
		float:right;
		width:22vw;
		height:50rpx;
		background: #ff6600;
		text-align: center;
		line-height: 50rpx;
		border-radius:4rpx;
		font-size:26rpx;
		color:#fff;
	}
	.code-box .tab_rig {
		width: 40vw;
		height: 25px;
	}
	.tab_left {
		width: 25vw;
		text-align: right;
		margin-right: 3vw;
		line-height:50rpx;
	}

	.tab_rig {
		width: 55vw;
		line-height:50rpx;
		input{
			height: 50rpx;
		}
	}

	.confirm-btn {
		width: 630upx;
		height: 76upx;
		line-height: 76upx;
		border-radius: 50px;
		margin-top: 90upx;
		margin-bottom: 60upx;
		background: #00c277;
		color: #fff;
		font-size: $font-lg;

		&:after {
			border-radius: 100px;
		}
	}
	.ipt-box {
		margin-left: 160upx;
		input {
			width: 100%;
			height: 50upx;
			line-height: 50upx;
			font-size: 26upx;
			color: #666;
		}
	}
	
	.select {
		margin-left: 0rpx;
		width: 60vw;
		font-size: 30rpx;
		color: #666;
		.picker{
			line-height: 50rpx;
		}
		.arrow {
			float: right;
			width: 16upx;
			height: 29upx;
			margin-top: 10upx;
		}
	
		input {
			width: 70%;
		}
	}
	
	.bg-gray{
		background-color: #9A9A9A;
	}
</style>
