<template>
	<view class="container">
		<view class="top">
			<text class="iconfont icon-youjiantou zuojiantou" @click="goBack()"></text>
			<text>申请加盟</text>
		</view>
		<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 pass">4</text>
			<text class="line line_pass"></text>
			<text class="num actived pass">5</text>
			<text class="line line_pass"></text>
			<text class="num actived">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">6/8</text>
			</view>
			<view class="content">
				<view class="ulBox">
					<view class="liBox" v-for="personalStatements in dropOptionsInfoList"
						@click="selectStatements(personalStatements)">
						<text class="iconfont icon-yuanxingweixuanzhong" v-if="!personalStatements.status"></text>
						<text class="iconfont icon-selected-copy" v-if="personalStatements.status"></text>
						<text class="itemName"> {{personalStatements.dropOptionName}}</text>
						<text class="iconfont icon-gougou" v-if="personalStatements.status"></text>
					</view>
				</view>
			</view>
		</view>
		<view class="fixed" @click="saveInfo()">
			{{(this.personalForm.approvalStatus== 0 || this.personalForm.approvalStatus == 2)?'保存并下一步':'下一步'}}
		</view>
	</view>
</template>

<script>
	import api from '../../api/api';
	export default {
		data() {
			return {
				dropOptionsInfoList: [],
				shareId: null,
				personalForm: {
					personalStatement: '',
					approvalStatus: ''
				},
				applyParam: {},
				personalStatementList: []
			}
		},
		components: {},
		onLoad(options) {
			this.shareId = options.shareId
		},
		onShow() {
			uni.showLoading({
				title: '加载中...'
			});
			setTimeout(() => {
				if (uni.getStorageSync('applyId')) {
					this.queryById(uni.getStorageSync('applyId'), null)
				} else if (this.shareId) {
					this.queryById(this.shareId, null)
				} else {
					this.queryById(null, uni.getStorageSync('cffp_userId'))
				}
			}, 500)
			this.dropOptionsQuery();
		},
		methods: {
			goBack() {
				uni.navigateBack({
					delta: 1  
				});
			},
			dropOptionsQuery() {
				api.dropOptionsQuery({
					code: 'CFFP_Partner_Statements'
				}).then((res) => {
					this.dropOptionsInfoList = res["data"]["dropMasterInfoList"][0]["dropOptionsInfoList"];
				})
			},
			selectStatements(personalStatements) {
				if (this.personalForm.approvalStatus == 0 || this.personalForm.approvalStatus == 2) {
					if (personalStatements.status == 1) {
						personalStatements.status = 0;
					} else {
						personalStatements.status = 1;
					}
				}
			},
			queryById(id, userId) {
				api.queryById({
					id: id,
					userId: userId
				}).then((res) => {
					if (res['success']) {
						this.applyParam = res['data']['data'];
						if (uni.getStorageSync('personalForm')) {
							this.personalForm = uni.getStorageSync('personalForm')
						} else {
							this.personalForm.personalStatement = this.applyParam.personalStatement
						}
						this.personalForm.approvalStatus = this.applyParam.approvalStatus
						if (this.personalForm.personalStatement) {
							this.personalStatementList = this.personalForm.personalStatement.split(',');
							for (let i = 0; i < this.dropOptionsInfoList.length; i++) {
								for (let j = 0; j < this.personalStatementList.length; j++) {
									if (this.dropOptionsInfoList[i]['dropOptionName'] == this
										.personalStatementList[j]) {
										this.dropOptionsInfoList[i].status = 1;
									}
								}
							}
						}
					}
					uni.hideLoading()
				})
			},
			saveInfo() {
				if (this.personalForm.approvalStatus == 0 || this.personalForm.approvalStatus == 2) {
					const selectedPersonalStatement = this.dropOptionsInfoList.filter((item) => {
						return item.status == 1;
					});
					if (!selectedPersonalStatement.length) {
						uni.showToast({
							title: '请选择至少一项个人声明！',
							duration: 2000,
							icon: 'none'
						})
						return;
					}
					this.personalStatementList = [];
					for (let i = 0; i < selectedPersonalStatement.length; i++) {
						this.personalStatementList.push(selectedPersonalStatement[i]['dropOptionName']);
					}
					this.applyParam.personalStatement = this.personalStatementList.join(',');
					this.personalForm.personalStatement = this.applyParam.personalStatement
					this.applyParam.operatStep = 6;
					uni.setStorageSync('personalForm', this.personalForm)
					this.applyParam.approvalStatus = this.personalForm.approvalStatus
					api.saveApplyInfo(this.applyParam).then((res) => {
						this.dropOptionsInfoList = []
						if (res['success']) {
							uni.navigateTo({
								// url:`contract?id=${res['data']['id']}`
								url: `contract`
							});
						} else {
							uni.showToast({
								title: res['message'],
								duration: 2000,
								icon: 'none'
							})
							return;
						}
					})
				} else {
					uni.navigateTo({
						// url:`contract?id=${res['data']['id']}`
						url: `contract`
					});
				}
			}
		}
	}
</script>

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

	.container {
		background-color: #FBFBFB;
	}
</style>
