zhxg_app_v1.0/pages/addapply/addapply.vue

<template>
	<view class="container">
		<!-- 学年 -->
		<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>
			<picker :range="politicalOptions" v-model="selectedPoliticalIndex" @change="onPoliticalChange">
				<view class="select">{{ politicalOptions[selectedPoliticalIndex] || '请选择加分项' }}</view>
			</picker>
		</view>

		<!-- 加分项对应分数 -->
		<view class="form-item">
			<text class="label">分数：</text>
			<input class="uni-input"
				:value="selectedPoliticalIndex !== -1 ? type_list[selectedPoliticalIndex].maxScore : ''" disabled />
		</view>
		<!-- 上传佐证 -->
		<view class="form-img">
			<text class="label">上传佐证：</text>
			<view class="example-body">
				<uni-file-picker @select="uploadEvidence" @delete="onDelImg" :auto-upload="false" limit="9"
					title=""></uni-file-picker>
			</view>
		</view>
		<!-- 主要事迹 -->
		<view class="form-text">
			<text class="label">备注：</text>
			<view class="txt">
				<uni-forms-item>
					<uni-easyinput type="textarea" v-model="description" maxlength="500" placeholder="输入内容" />
				</uni-forms-item>
			</view>
		</view>

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

<script>
	import {
		listEnableYear,
		listIamChild,
		stuAddIam
	} from "@/api/cqScore/cqscore.js";

	import {
		isEmpty
	} from "@/api/helpFunc";

	import uploadFile from "@/plugins/upload.js";

	export default {
		data() {
			return {
				options: ['2022-2023学年', '2023-2024学年'], // 学年选项
				selectedOptionIndex: -1, // 当前选中的奖项索引
				politicalOptions: ['入党积极分子', '参与学校党校培训并获得结业证书', '参加校级青马工程培训并获得结业证书', '参加校级青马工程培训并获得结业证书',
					'参加全国青马工程培训并获得结业证书', "二级学院通报表彰",
					"学校通报表彰", '市（县）级表彰', "自治区表彰", "全国表彰"
				], // 政治面貌选项
				selectedPoliticalIndex: -1, // 当前选中的政治面貌索引
				points: [3, 5, 6, 10, 10, 2, 5, 10, 20, 30], // 对应加分项的分数
				description: "",

				year_list: [],
				choose_year: null,

				type_list: [],
				choose_type: null,

				material: ""

			};
		},
		async onShow() {
			await this.listEnableYear();
			await this.listIamChild();
		},
		methods: {
			// 当选择发生变化时触发
			onPickerChange(event) {
				this.selectedOptionIndex = event.detail.value;
				this.choose_year = this.year_list[this.selectedOptionIndex].id;
			},
			// 政治面貌选择改变时触发
			onPoliticalChange(event) {
				this.selectedPoliticalIndex = event.detail.value;
				this.choose_type = this.type_list[this.selectedPoliticalIndex].ruleId;
			},
			async listEnableYear() {
				let res = await listEnableYear();
				if (res.code == 200) {
					let data = [...res.rows];
					this.year_list = [...data];
					this.options = data.map(x => x.stuYearName)
				}
			},
			async listIamChild() {
				let res = await listIamChild();
				if (res.code == 200) {
					let data = [...res.data];
					this.type_list = [...data];
					this.politicalOptions = data.map(x => {
						if (x.maxScore >= 0) {
							return x.ruleName;
						}
					});

				}
			},
			uploadEvidence(e) {
				uploadFile('/common/upload', e.tempFilePaths[0]).then((res) => {
					if (this.material !== "") {
						this.material = this.material + "," + JSON.parse(res).fileName;
					} else {
						this.material = JSON.parse(res).fileName;
					}
				})
			},
			//删除已选图片
			onDelImg(e) {

			},
			async submitIamForm() {
				if (isEmpty(this.choose_year)) {
					uni.showToast({
						title: "请选择学年",
						icon: "error"
					});
					return;
				}
				if (isEmpty(this.choose_type)) {
					uni.showToast({
						title: "请选择加分项",
						icon: "error"
					});
					return;
				}
				if (isEmpty(this.material)) {
					uni.showToast({
						title: "请上传附件",
						icon: "error"
					});
					return;
				}
				if (isEmpty(this.description)) {
					uni.showToast({
						title: "请输入备注",
						icon: "error"
					});
					return;
				}
				let sdata = {
					stuYearId: this.choose_year,
					material: this.material,
					description: this.description,
					ruleId: this.choose_type,
				};

				uni.showLoading({
					title: '加载中'
				});

				let res = await stuAddIam(sdata);
				uni.hideLoading();
				if (res.code == 200) {
					uni.showToast({
						title: res.msg,
						icon: "success"
					});
				} 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;
	}

	.form-img {
		width: 95%;
		margin-bottom: 20rpx;
		border-bottom: 1px solid #ededee;
	}

	.example-body {
		margin-top: 20rpx;
		margin-bottom: 20rpx;
	}

	.txt {
		margin-top: 20rpx;
	}

	.label {
		text-align: right;
		margin-right: 20rpx;
	}

	.select {
		color: #888889;
		white-space: nowrap;
		/* 防止换行 */
		overflow: hidden;
		/* 隐藏溢出部分 */
		text-overflow: ellipsis;
		/* 显示省略号 */
	}

	.uni-input {
		color: #888889;
		text-align: right;
	}

	button {
		width: 90%;
		background-color: #87CEFA;
		color: white;
	}
</style>