<template>
	<view class="container">
		<view class="page">
			<text class="num actived pass">1</text>
			<text class="line line_pass"></text>
			<text class="num actived pass">2</text>
			<text class="line line_pass"></text>
			<text class="num actived pass">3</text>
			<text class="line line_pass"></text>
			<text class="num actived">4</text>
			<text class="line"></text>
			<text class="num">5</text>
			<text class="line"></text>
			<text class="num">6</text>
			<text class="line"></text>
			<text class="num">7</text>
			<text class="line"></text>
			<text class="num">8</text>
		</view>
		<view class="wrapper">
			<view class="title">
				<view>
					<text class="line"></text>学历信息
				</view>
				<text class="page_mark">4/8</text>
			</view>
			<view class="content" style="padding-bottom: 150rpx;">
				<view class="contentDetail employ">
					<view class="contentItem">
						<text>最高学历：如本科、专科、硕士</text>
						<picker @change="changeEducation" :value="educationIdx" :range="educationLevelList"
							range-key="name"
							:disabled="this.educationForm.approvalStatus!= 0 && this.educationForm.approvalStatus != 2">
							<view class="uni-input">{{educationLevelList[educationIdx]['name']}}
								<text class="iconfont icon-youjiantou"></text>
							</view>
						</picker>
					</view>
					<view class="contentItem">
						<text>毕业学校</text>
						<input type="text" class="form-control" v-model="educationForm.lastGraduateSchool"
							placeholder="请输入毕业院校" :disabled="this.educationForm.approvalStatus!= 0 && this.educationForm.approvalStatus != 2" />
					</view>
					<view class="contentItem" style="border:none;">
						<text>毕业证</text>
						<view></view>
					</view>
				</view>
				<view class="photo_wrapper" v-if="!educationForm.lastGraduateCertificationOssPath"
					@click="upLoadPhoto()">
					<text class="iconfont icon-weibiaoti553"></text>
					<view style="margin-top: 10px;">点击添加毕业证照片</view>
				</view>
				<!-- mode="widthFix" -->
				<view class="photo_w" v-if="educationForm.lastGraduateCertificationOssPath">
					<image :src="educationForm.lastGraduateCertificationOssPath" @click="upLoadPhoto()" mode="widthFix"></image>
				</view>

				<view class="tips">
					<view>（jpg,png 文件大小不大于1mb）</view>
				</view>
			</view>
		</view>
		<view class="fixed" @click="saveInfo()">
			{{(this.educationForm.approvalStatus== 0 || this.educationForm.approvalStatus == 2)?'保存并下一步':'下一步'}}
		</view>
	</view>
</template>

<script>
	import api from '../../api/api';
	import {
		CommonUpload
	} from '@/util/uploaderFile';
	export default {
		data() {
			return {
				educationLevelList: [{
					id: null,
					name: '请选择'
				}],
				educationIdx: 0,
				educationForm: {
					lastGraduateGrade: '',
					lastGraduateSchool: '',
					lastGraduateCertificationOssPath: '',
					approvalStatus: ''
				},
				applyParam: {},
				shareId: null,
				// appStatus: false,
				dataForm: {
					loginId: uni.getStorageSync('cffp_userId'),
					targetType: "5",
					targetId: '',
					targetNo: "4",
					targetUseFor: "12",
					targetSeq: "0"
				}
			}
		},
		components: {},
		onLoad(options) {
			this.educationLevelQuery();
			if (uni.getStorageSync('applyId')) {
				this.queryById(uni.getStorageSync('applyId'), null)
			} else if (options.shareId) {
				this.queryById(options.shareId, null)
			} else {
				this.queryById(null, uni.getStorageSync('cffp_userId'))
			}
		},
		onShow() {
			if (uni.getStorageSync('educationForm')) {
				this.educationForm = uni.getStorageSync('educationForm')
			}
			// if (uni.getStorageSync('Refresh_query')) {
			// 	this.queryById(null, uni.getStorageSync('cffp_userId'))
			// }
			uni.$on("ckqueryById", res => {
				if (res == true) {
					this.queryById(null, uni.getStorageSync('cffp_userId'))
				}
			});
		},
		onUnload() {
			// 移除监听事件  
			uni.$off('ckqueryById');
		},
		methods: {
			educationLevelQuery() {
				api.educationLevelQuery().then((res) => {
					console.log(res)
					if (res['success']) {
						this.educationLevelList = this.educationLevelList.concat(res['data'][
							'educationLevelList'
						]);
					}
				})
			},
			queryById(id, userId) {
				uni.showLoading({
					title: '加载中...'
				});
				api.queryById({
					id: id,
					userId: userId
				}).then((res) => {
					if (res['success']) {
						this.applyParam = res['data']['data'];
						console.log(res, 114)
						if (uni.getStorageSync('educationForm')) {
							this.educationForm = uni.getStorageSync('educationForm')
						} else {
							this.educationForm.lastGraduateGrade = this.applyParam.lastGraduateGrade
							this.educationForm.lastGraduateSchool = this.applyParam.lastGraduateSchool != null ?
								this.applyParam.lastGraduateSchool : ''
							this.educationForm.lastGraduateCertificationOssPath = this.applyParam
								.lastGraduateCertificationOssPath

						}
						this.educationForm.approvalStatus = this.applyParam.approvalStatus
						uni.setStorageSync('educationForm',this.educationForm)
						// if (this.educationForm.approvalStatus != 0 && this.educationForm.approvalStatus != 2) {
						// 	this.appStatus = false
						// }
						this.educationForm.id = this.applyParam.id
						for (let i = 0; i < this.educationLevelList.length; i++) {
							if (this.educationForm.lastGraduateGrade == this.educationLevelList[i].name) {
								this.educationIdx = i;
							}
						}
					}
					uni.hideLoading()
				})
			},
			upLoadPhoto(event) {
				uni.setStorageSync('educationForm',this.educationForm)
				if (this.educationForm.approvalStatus == 0 || this.educationForm.approvalStatus == 2) {
					this.dataForm.targetId = this.educationForm.id
					CommonUpload(this.dataForm).then(res => {
						this.educationForm.lastGraduateCertificationOssPath = res.data.filePath;
						uni.setStorageSync('educationForm',this.educationForm)
					});
				}
			},
			changeEducation: function(e) {
				this.educationIdx = e.detail.value;
				this.educationForm.lastGraduateGrade = this.educationLevelList[this.educationIdx]['name'];
			},
			saveInfo() {
				uni.showLoading({
					title: '加载中...'
				});
				if (this.educationForm.approvalStatus == 0 || this.educationForm.approvalStatus == 2) {
					if (!this.educationForm.lastGraduateGrade) {
						uni.showToast({
							title: '请选择最高学历',
							duration: 2000,
							icon: 'none'
						})
						return;
					}
					if (!this.educationForm.lastGraduateSchool) {
						uni.showToast({
							title: '请输入毕业学校',
							duration: 2000,
							icon: 'none'
						})
						return;
					}
					if (!this.educationForm.lastGraduateCertificationOssPath) {
						uni.showToast({
							title: '请上传毕业证书',
							duration: 2000,
							icon: 'none'
						})
						return;
					}
					uni.setStorageSync('educationForm', this.educationForm)
					this.applyParam.lastGraduateGrade = this.educationForm.lastGraduateGrade
					this.applyParam.lastGraduateSchool = this.educationForm.lastGraduateSchool
					this.applyParam.lastGraduateCertificationOssPath = this.educationForm.lastGraduateCertificationOssPath
					this.applyParam.approvalStatus = this.educationForm.approvalStatus
					this.applyParam = {
						...this.applyParam,
						operatStep: 4,
					}
					api.saveApplyInfo(this.applyParam).then((res) => {
						if (res['success']) {
							this.queryById(null, uni.getStorageSync('cffp_userId'))
							uni.navigateTo({
								// url:`bank-card?id=${res['data']['id']}`
								url: `bank-card`
							});
						} else {
							uni.showToast({
								title: res['message'],
								duration: 2000,
								icon: 'none'
							})
							return;
						}
						uni.hideLoading()
					})
				} else {
					uni.hideLoading()
					uni.navigateTo({
						// url:`bank-card?id=${res['data']['id']}`
						url: `bank-card`
					});
				}
			}
		}
	}
</script>

<style lang="scss">
	@import 'applyCommon.scss';

	.photo_w {
		// height: 380rpx;
		width: 80%;
		margin: auto;
	}

	.photo_w image {
		width: 100%;
		height: 100%;
	}
</style>
