<template>
	<view class="container">
		<view class="page">
			<text class="num actived pass">1</text>
			<text class="line line_pass"></text>
			<text class="num actived">2</text>
			<text class="line"></text>
			<text class="num">3</text>
			<text class="line"></text>
			<text class="num">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">2/8</text>
			 </view>
			<view class="content">
				<view class="contentDetail employ">
				   <view class="contentItem">
				    <text>职业类型</text>
					<picker @change="changeIndustry" :value="industryIdx" :range="industry"
					range-key="industryName" :disabled="this.applyParam.approvalStatus!= 0 && this.applyParam.approvalStatus != 2">
						<view class="uni-input">{{industry[industryIdx]['industryName']}}
							<text class="iconfont icon-youjiantou"></text>
						</view>
					</picker>
				   </view>
				   <view class="contentItem">
				     <text>最近一次工作单位</text>
				     <input type="text" class="form-control" placeholder="非必填" v-model="applyParam.workingCompany" 
					  :disabled="this.applyParam.approvalStatus!= 0 && this.applyParam.approvalStatus != 2"/>
				   </view>
				   <view class="contentItem">
				     <text>职位</text>
				     <input type="text" class="form-control" placeholder="非必填" v-model="applyParam.position"
					  :disabled="this.applyParam.approvalStatus!= 0 && this.applyParam.approvalStatus != 2"/>
				   </view>
				   <view class="contentItem">
				     <text>任职开始时间</text>
				     <picker mode="date" :value="applyParam.workingStart" @change="bindWorkingStart" :disabled="this.applyParam.approvalStatus!= 0 && this.applyParam.approvalStatus != 2">
				     	<view v-if="!applyParam.workingStart">请选择<text class="iconfont icon-youjiantou"></text></view>
				   		<view class="uni-input" v-if="applyParam.workingStart">{{applyParam.workingStart}}<text class="iconfont icon-youjiantou"></text></view>
				     </picker>
				   </view>
				   <view class="contentItem">
				     <text>结束时间</text>
				     <picker mode="date" :value="applyParam.workingEnd" @change="bindWorkingEnd" :disabled="this.applyParam.approvalStatus!= 0 && this.applyParam.approvalStatus != 2">
				     	<view v-if="!applyParam.workingEnd">请选择<text class="iconfont icon-youjiantou"></text></view>
				     	<view class="uni-input" v-if="applyParam.workingEnd">{{applyParam.workingEnd}}<text class="iconfont icon-youjiantou"></text></view>
				     </picker>
				   </view>
				   <view class="contentItem" style="border: 0;">
				     <text>荣誉证书</text>
				   </view>
				</view>
				<view class="photo_wrapper" @click="upLoadPhoto()" v-if="!applyParam.certificate">
				  <text class="iconfont icon-weibiaoti553"></text>
				  <view style="margin-top: 10px;">点击添加荣誉证书照片</view>
				</view>
				<view v-if="applyParam.certificate">
					<view class="pic_list" v-for="picItem in picList">
						<image :src="picItem" mode="widthFix"></image>
					</view>
				</view>
				<view class="tips">
				  <view>（jpg,png 文件大小不大于1mb）</view>
				</view>
				<view class="upLoadMore" v-if="applyParam.certificate" @click="upLoadPhoto()">
					<view class="iconfont icon-jiahao"></view>
					<view>上传更多</view>
				</view>
			</view>
		</view>
		<view class="fixed" @click="saveInfo()">
		   {{(this.applyParam.approvalStatus== 0 || this.applyParam.approvalStatus == 2)?'保存并下一步':'下一步'}}
		</view>
	</view>
</template>

<script>
	import api from '../../api/api';
	import { CommonUpload } from '@/util/uploaderFile';
	export default{
		data(){
			return {
				industry:[{industryName:'请选择',industryId:null}],
				industryIdx:0,
				applyParam:{
					workingCategoryId:'',
					workingCompany:'',
					position:'',
					workingStart:'',
					workingEnd:'',
					certificate:'',
				},
				dataForm:{
					loginId: uni.getStorageSync('cffp_userId'),
					targetType: "5",
					targetId: uni.getStorageSync('cffp_userId'),
					targetNo: "1",
					targetUseFor: "12",
					targetSeq: "0"
				},
				picList:[]
			}
		},
		components:{},
		onLoad(options){
			this.occupationQry();
			setTimeout(()=>{
				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'))
				}
			},500)
		},
		methods:{
			changeIndustry: function(e){
				this.industryIdx = e.detail.value;
				// this.workingCategory = this.industry[this.industryIdx]['industryName'];
				this.applyParam.workingCategoryId = this.industry[this.industryIdx]['industryId'];
			},
			bindWorkingStart:function(e){
				this.applyParam.workingStart = e.detail.value;
			},
			bindWorkingEnd:function(e){
				this.applyParam.workingEnd = e.detail.value;
			},
			occupationQry(){
				api.occupationQry({insurerId:2}).then((res)=>{
					if(res['success']){
						this.industry = this.industry.concat(res['data']['industry']);
					}else{
						this.industry = [{industryName:'请选择',industryId:null}];
					}
				})
			},
			upLoadPhoto(event){
				if(this.applyParam.approvalStatus== 0 || this.applyParam.approvalStatus == 2){
					CommonUpload(this.dataForm).then(res => {
						this.applyParam.certificate = res.data.filePath;
						this.picList.push(this.applyParam.certificate);
					});
				}
			},
			saveInfo(){
				if(this.applyParam.approvalStatus== 0 || this.applyParam.approvalStatus == 2){
					if(!this.applyParam.workingCategoryId){
						uni.showToast({
							title: '请选择职业类型',
							duration: 2000,
							icon: 'none'
						})
						return;
					}
					this.applyParam = {
							...this.applyParam,
							applyType:2,
							operatStep:2,
							userId:uni.getStorageSync('cffp_userId'),
							certificate:this.picList.join(',')
					}
					console.log(this.applyParam)
					api.saveApplyInfo(this.applyParam).then((res)=>{
						if(res['success']){
							uni.navigateTo({
								// url:`id-card?id=${res['data']['id']}`
								url:`id-card`
							});
						}else{
							uni.showToast({
								title: res['message'],
								duration: 2000,
								icon: 'none'
							})
							return;
						}
					})
				}else{
					uni.navigateTo({
						// url:`id-card?id=${res['data']['id']}`
						url:`id-card`
					});
				}
			},
			queryById(id,userId){
				api.queryById({id:id,userId:userId}).then((res)=>{
					console.log(res)
					if(res['success']){
						this.applyParam = res['data']['data'];
						if(this.applyParam.certificate){
							this.picList = this.applyParam.certificate.split(',');
						}
						for(let i=0;i<this.industry.length;i++){
							if(this.applyParam.workingCategoryId == this.industry[i].industryId){
								this.industryIdx = i;
							}
						}
					}
				})
			}
		},
		mounted() {
			
		}
	}
</script>

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