edu-uniapp/pages/aiCt/userForm.vue

<template>
	<view class="form-container-box">
		<!-- 待用活动表单 -->
		<active-form 
		:formDate="formDate"
		 @choose-image-btn="chooseImage"
		  @delete-img-btn="deleteImg" 
		   @sure-btn="sure" @input-val="inputVal">								
		</active-form>
		<!-- (对必填项input框为空是提示的和错误两种不同提示) -->
		<view class="buttonBox" @click="submit1">
			提交
		</view>
		<!-- (对必填项input框为为空和错误是一种提示) -->
		<!-- <view class="buttonBox" @click="submit2">
			提交2
		</view> -->		
		<cover-view class="submit-data">
			{{submitData}}
		</cover-view>
		
		<view style="margin: 100rpx; color: red;">
			温馨提示: 请准确填写相关信息帮助系统对您或您的孩子生成精准学习分析报告和推荐的学习路径
		</view>
		
	</view>
</template>

<script>
	import activeForm from '@/components/userInfo/active_form.vue'
	import { mapGetters } from 'vuex'
	export default {	
		data() {
			return {
				submitData: "",								
				formDate: [
					{
						placeholder: "请输入姓名",
						label: "姓名",
						type: "text",
						rules: {
							name: "name",
							value: "",
							verify: "req",
							errMess: "请输入姓名"
						}
					},
					
					{
						placeholder: "请输入就读学校",
						label: "就读学校",
						type: "text",
						rules: {
							name: "from_school_name",
							value: "",
							verify: "req",
							errMess: "请输入就读学校"
						}
					},
					
					{
						placeholder: "请填写联系方式",
						label: "手机号",
						type: "number",
						rules: {
							name: "mobile",
							value: "",
							verify: "req|phone",
							errMess: "手机号填写不正确"
						}
					},
					
					/*{
						placeholder: "请填写家长姓名",
						label: "家长姓名",
						type: "text",
						rules: {
							name: "father_name",
							value: "",
							verify: "req",
							errMess: "请填写家长姓名"
						}
					},
					
					{
						placeholder: "请填写联系方式",
						label: "手机号",
						type: "number",
						rules: {
							name: "mobile",
							value: "",
							verify: "req|phone",
							errMess: "手机号填写不正确"
						}
					},
					
					{
						placeholder: "请填写学习科目",
						label: "科目",
						type: "text",
						rules: {
							name: "subject_name",
							value: "",
							verify: "req",
							errMess: "请填写学习科目"
						}
					},
					
					{
						placeholder: "请填写学期",
						label: "学期",
						type: "text",
						rules: {
							name: "term",
							value: "",
							verify: "req",
							errMess: "请填写学期"
						}
					}*/
				]
			}
		},
		
		components:{
			activeForm
		},
		
		
		computed: {
		   ...mapGetters({
				fromSchoolId: 'paper/getFromSchoolId',
				examParams: 'paper/getExamParams'
		   })
		},
		
		methods: {
			submit1: function() {
				// 表单验证 可选项 otherPra:otherPra	 
				var otherPra = {
					reqEmptyVal: true,
				}
				if (this.$vervify({
						formDate: this.formDate,
						otherPra: otherPra
					   })
					) {
						
					let formArray = []
					this.formDate.forEach(item => {
						let itemValue = item.rules
						if (itemValue.name === 'sex') {
							if (itemValue.value === '男') {
								itemValue.value = 1
							} else if (itemValue.value === '女') {
								itemValue.value = 0
							}
						}
						formArray.push({
							name: itemValue.name,
							value: itemValue.value,
						})
					})
					uni.showLoading({
						title: '正在生成测试报告, 请稍后...'
					})
					this.$httpApi.post('/front/potentialStudentInfo', {formList: formArray, fromSchoolId: parseInt(this.fromSchoolId)})
					.then(response => {
						if (response.code === 1) {
							let studentId = response.data
							this.$store.commit('paper/updateStudentId', response.data)
							this.sendCommitQuestionHttp(studentId)
						} else {
							uni.hideLoading()
							setTimeout(() => {
								uni.showToast({
									title: response.message
								})
							}, 100)
						}
					})
				}
			},
			
			sendCommitQuestionHttp (studentId) {
				let form = this.examParams
				form.potentialStudentInfoId = studentId
				
				this.$httpApi.post('/front/aiCt/commitAiPaperQuestion', form)
				 .then(response => {
					uni.hideLoading()
					if (response.code === 1) {
						uni.showToast({
							icon: 'none',
							title: '报告生成成功'
						})
						setTimeout(() => {
							// 跳转测评报告结果页
							uni.redirectTo({
								url: 'ctReport'
							})
						}, 100) 
					} else {
						uni.showToast({
							icon: 'none',
							title: '报告生成失败'
						})
					}
				})
			},
						
			// 上传图片
			chooseImage: function(data) {		
				var data=JSON.parse(data)					
				this.formDate[data.index].rules.value=data.value;
				this.formDate[data.index].updateImg=true;
			},
			// 删除图片
			deleteImg:function(index){
				this.formDate[index].rules.value="";
				this.formDate[index].updateImg=false;
			},
			// 确定
			sure: function(data) {	
				var data=JSON.parse(data);
				if (String(data.currentSelectIndex) != "" && String(data.currentSelectValue) != "") {				
					this.formDate[data.currentSelectIndex].rules.value = data.currentSelectValue;
				}
			},
			// inputVal
			inputVal:function(data){
				var data=JSON.parse(data);
				if (String(data.val) != "" && String(data.index) != "") {				
					this.formDate[data.index].rules.value = data.val;
				}
			}

		}
	}
</script>

<style lang="scss">
	.form-container-box{
		width: 100vw;
		font-size: 28upx;
		min-height: 100vh;
		position: relative;
		padding-bottom: 100upx;
	}
	.bgfff {
		
	}
	  
	.buttonBox {
		width: 100%;			
		height: 84upx;
		color: white;
		display: flex;
		align-items: center;
		justify-content: center;
		background-color: #ff5b01;
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		z-index: 999;
	}
	.submit-data {
		padding: 20upx;
		margin-top: 20upx;
		word-break: break-word;
	}
	
</style>