<template>
	<view class="container">
<!-- 政治面貌 -->
		<view class="form-item">
			<text class="label">政治面貌：</text>
			<input v-model="position" class="uni-input" focus placeholder="请输入政治面貌" />
		</view>
		<!-- 第二课堂学分认定 -->
		<view class="form-item">
			<text class="label">第二课堂学分认定</text>
			<picker :range="options" v-model="selectedOptionIndex" @change="onPickerChange">
				<view class="select">{{ options[selectedOptionIndex] || '请选择' }} </view>
			</picker>
		</view>


		<!-- 青年大学习学习率 -->
		<view class="form-item">
			<text class="label">青年大学习学习率：</text>
			<input v-model="cardID" class="uni-input" focus placeholder="请输入青年大学习学习率" />
		</view>
		<!-- 职务 -->
		<view class="form-item">
			<text class="label">职务：</text>
			<input v-model="bank" class="uni-input" focus placeholder="请输入职务" />
		</view>
		<!-- 获奖情况 -->
		<view class="form-text">
			<text class="label">获奖情况：</text>
			<view class="txt">
				<uni-forms-item>
					<uni-easyinput type="textarea" v-model="introduction" maxlength="500" placeholder="请输入获奖情况" />
				</uni-forms-item>
			</view>

		</view>
		<!-- 主要事迹 -->
		<view class="form-text">
			<text class="label">主要事迹：</text>
			<view class="txt">
				<uni-forms-item>
					<uni-easyinput type="textarea" v-model="deeds" maxlength="500" placeholder="请输入主要事迹" />
				</uni-forms-item>
			</view>

		</view>

		<!-- 按钮 -->
		<button @click="showPopup">提交申请</button>
	</view>
</template>

<script>
	
	import {
		listApplyXgb,verifyApplyYXGB,addApplyYxgb
	} from "@/api/good/yxbg.js";
	
	import {
		listOwnScoreClassRank
	} from "@/api/good/index.js";
	
	import {
		getDict,
		isEmpty
	} from "@/api/helpFunc/index.js";
	
	export default {
		data() {
			return {
	
				options: ['合格', '不合格'], // 学年
				selectedOptionIndex: 0, // 当前选中的奖项索引
				
				position: '', // 职务，
				cardID: "", // 银行卡号，
				bank: '',
				introduction: "",
				deeds: ""

			};
		},
		async onShow(){
			uni.showLoading();
			
			await this.tocarder();
			
			uni.hideLoading();
		},
		methods: {
			async tocarder() {
				uni.showLoading();
				let res = await verifyApplyYXGB();
				uni.hideLoading();
				if(res.code != 200){
					uni.navigateTo({
						url: "/pages/cadre/cadre"
					})
				}
			},
			// 当选择发生变化时触发
			onPickerChange(event) {
				this.selectedOptionIndex = event.detail.value;
			},
			// 
			onPoliticalChange(event) {
				this.selectedPoliticalIndex = event.detail.value;
			},
			async showPopup() {
			
				let sdata = {
					zzmm: this.position,
					classPost: this.bank,
					goodHis: this.introduction,
					mainHis: this.deeds,
					youthPercent: this.cardID,
					classtwoSure: this.options[this.selectedOptionIndex]
				};
			
				if (isEmpty(sdata.zzmm)) {
					uni.showToast({
						title: "请填写政治面貌",
						icon: "none"
					});
					return;
				}
				if (isEmpty(sdata.classPost)) {
					uni.showToast({
						title: "请填写职务",
						icon: "none"
					});
					return;
				}
				if (isEmpty(sdata.youthPercent)) {
					uni.showToast({
						title: "请填写青年大学习学习率",
						icon: "none"
					});
					return;
				}
				if (isEmpty(sdata.classtwoSure)) {
					uni.showToast({
						title: "请填写第二课堂学分认定",
						icon: "none"
					});
					return;
				}
			
				if (isEmpty(sdata.goodHis)) {
					uni.showToast({
						title: "请填写获奖记录",
						icon: "none"
					});
					return;
				}
				if (isEmpty(sdata.mainHis)) {
					uni.showToast({
						title: "请填写主要事迹",
						icon: "none"
					});
					return;
				}
				if (sdata.mainHis.length < 100) {
					uni.showToast({
						title: "主要事迹字数需要100字以上",
						icon: "none"
					});
					return;
				}
				
				uni.showLoading();
				
				let res = await addApplyYxgb(sdata);
				
				uni.hideLoading();
				
				if(res.code == 200){
					uni.showToast({
						title: '申请成功',
						icon: 'success',
						duration: 2000, // 弹窗持续时间，单位为毫秒
						success() {
							setTimeout(() => {
								uni.navigateTo({
									url: '/pages/cadre/cadre' // 替换为您要跳转的页面路径
								});
							}, 1000); // 等待2秒后执行页面跳转，确保用户能看到弹窗内容
						}
					});
				}else{
					uni.showToast({
						title: res.msg,
						icon: "error"
					});
				}
			
			
				
			
			},
		}
	};
</script>

<style>
	.container {
		display: flex;
		flex-direction: column;
		align-items: center;
		padding: 10rpx;
	}

	.form-item {
		width: 95%;
		height: 80rpx;
		display: flex;
		align-items: center;
		margin-bottom: 20rpx;
		justify-content: space-between;

		border-bottom: 1px solid #ededee;
	}

	.form-text {
		
		width:95%;

		margin-bottom: 20rpx;
		border-bottom: 1px solid #ededee;
	}
.txt{
	margin-top: 20rpx;
}
	

	.label {

		text-align: right;
		margin-right: 20rpx;
	}

	.select {
		color: #888889;
	}

	.uni-input {
		/*      width: 23%; */
		color: #888889;
		text-align: right;
	}
	button{
		width: 90%;
		background-color: #87CEFA;
		color: white;
	}
</style>