<template>
	<view style="padding:20rpx;">
		<view style="margin-top:50rpx;margin-bottom:180rpx;">
			<view style="color:gray;font-size:25rpx;margin-top:50rpx;margin-bottom:30rpx;margin-left:20rpx;">收件人<text
					style="color:red;">*</text>
			</view>
			<view style="background-color:#F1F5F7;border-radius:20rpx;padding:20rpx;">
				<view>
					<input maxlength="30" placeholder="收件人" placeholderStyle="font-size: 25rpx;" type="text" v-model="model.consigneeUser"></input>
				</view>
			</view>
			<view style="color:gray;font-size:25rpx;margin-top:50rpx;margin-bottom:30rpx;margin-left:20rpx;">联系电话<text
					style="color:red;">*</text>
			</view>
			<view style="background-color:#F1F5F7;border-radius:20rpx;padding:20rpx;">
				<view>
					<input maxlength="30" placeholder="联系电话" placeholderStyle="font-size: 25rpx;" type="text" v-model="model.phone"></input>
				</view>
			</view>
			<view style="color:gray;font-size:25rpx;margin-top:50rpx;margin-bottom:30rpx;margin-left:20rpx;">
				详细地址(请务必写明地址,否则无法寄出)<text style="color:red;">*</text>
			</view>
			<view style="background-color:#F1F5F7;border-radius:20rpx;padding:20rpx;">
				<view>
					<textarea maxlength="50" placeholder="详情地址" placeholderStyle="font-size: 25rpx;" v-model="model.addressDetail" @input="ChangeDetail"></textarea>
				</view>
				<view style="display:flex;align-items:center;justify-content:flex-end;">{{''+CandidateDetailNum+'/50'}}</view>
			</view>
			<view style="color:gray;font-size:25rpx;margin-top:50rpx;margin-bottom:30rpx;margin-left:20rpx;">Exam
				ID不是成绩单上的Exam Session ID,Exam ID可在您预约考试成功时收到的邮件内查到。请阅读以上内容后在此栏填写：已确认<text style="color:red;">*</text>
			</view>
			<view style="background-color:#F1F5F7;border-radius:20rpx;padding:20rpx;">
				<view>
					<input maxlength="10" placeholder="信息" placeholderStyle="font-size: 25rpx;" v-model="model.confirmInfo" @input="ChangeInfo"></input>
				</view>
				<view style="display:flex;align-items:center;justify-content:flex-end;font-size:20rpx;">
					{{''+CandidateInfoNum+'/10'}}
				</view>
			</view>
			<view style="color:gray;font-size:25rpx;margin-top:50rpx;">Exam ID<text style="color:red;">*</text>
				<view style="background-color:#F1F5F7;padding:20rpx;border-radius:20rpx;margin-top:20rpx;">
					<input maxlength="30" placeholder="不是成绩单上的Exam Session ID" placeholderStyle="font-size: 25rpx;"
						type="text" v-model="model.examId"></input>
				</view>
			</view>
			<view style="font-size:25rpx;color:red;margin-top:20rpx;">
				温馨提示：1.纸质证书并非成绩单，没有小分；2.纸质证书从海外总部寄出到收到需要8-12周，收到后消杀，录入需5个工作日。查询请联系考务老师。</view>
		</view>
		<view style="color:white;" class="centerview" @click="Submit">提交</view>
	</view>

</template>

<script>
	import BASE_URL from '../../common/config.js'
	import service from '../../service/service.js'
	export default {
		data() {
			return {
				BASE_URL,
				CandidateDetailNum: 0,
				CandidateInfoNum:0,
				model: {
					"userId": "",
					"consigneeUser": "",
					"phone": "",
					"addressDetail": "",
					"confirmInfo": "",
					"examId": "",
					"creatorTime": "2022-12-23T06:10:32.051Z",
					"lastModifyTime": "2022-12-23T06:10:32.051Z"
				}
			}
		},
		onLoad() {

		},
		methods: {
			ChangeDetail(){
				this.CandidateDetailNum=this.model.addressDetail.length
			},
			ChangeInfo(){
				this.CandidateInfoNum=this.model.confirmInfo.length
			},
			Checked() {
				let bl = true
				if (!this.model.consigneeUser) {
					uni.showToast({
						title: '请输入收件人',
						icon: 'none'
					})
					bl = false
				} else if (!this.model.phone) {
					uni.showToast({
						title: '请输入联系电话',
						icon: 'none'
					})
					bl = false
				} else if (!this.model.addressDetail) {
					uni.showToast({
						title: '请输入详细地址',
						icon: 'none'
					})
					bl = false
				} else if (!this.model.confirmInfo) {
					uni.showToast({
						title: '请输入确认信息',
						icon: 'none'
					})
					bl = false
				} else if (!this.model.examId) {
					uni.showToast({
						title: '请输入ExamId',
						icon: 'none'
					})
					bl = false
				}
				return bl
			},
			Submit() {
				if (this.Checked()) {
					this.model.userId = service.getUser().id
					this.API.AddMailSend(this.model).then(res => {
						console.log('嗡嗡嗡', res)
						if (res.code == 200) {
							uni.showToast({
								title: '提交成功',
								icon: 'success',
								duration: 2000
							})
							setTimeout(() => {
								uni.navigateTo({
									url: '/pages/Report/result'
								})
							}, 1000)
						} else {
							uni.showToast({
								title: '提交失败',
								icon: 'none'
							})
						}
					})
				}
			}
		}
	}
</script>

<style>
	.centerview {
		position: fixed;
		bottom: 10px;
		margin: 0 auto;
		width: 90%;
		border: 1px solid #ff4544;
		border-radius: 10px;
		background-color: #ff4544;
		text-align: center;
		z-index: 99999999999;
		height: 40px;
		line-height: 40px;
		color: #000000;
		animation: scaleDrawC 2s;
		transform-origin: 50% 50%;
		-webkit-animation-name: scaleDrawC !important;
		/*关键帧名称*/
		-webkit-animation-timing-function: ease-in-out;
		/*动画的速度曲线*/
		-webkit-animation-iteration-count: infinite;
		/*动画播放的次数*/
		-webkit-animation-duration: 2s;
	}
</style>
