<template>
	<view class="page">
		<uni-section title="表单校验" type="line">
			<view class="example">
				<!-- 基础表单校验 -->
				<uni-forms ref="valiForm" :rules="rules" :modelValue="valiFormData">
					<uni-forms-item label="标题" required name="title">
						<uni-easyinput v-model="valiFormData.title" placeholder="请输入标题" />
					</uni-forms-item>
					<uni-forms-item label="介绍标题" required name="subTitle">
						<uni-easyinput v-model="valiFormData.subTitle" placeholder="请输入介绍标题" />
					</uni-forms-item>
					<uni-forms-item label="岗位名" required name="post">
						<uni-easyinput v-model="valiFormData.post" placeholder="请输入岗位名" />
					</uni-forms-item>
					<uni-forms-item label="详细内容">
						<uni-easyinput type="textarea" v-model="valiFormData.bodyContent" placeholder="请输入详细内容" />
					</uni-forms-item>
				</uni-forms>
				<button type="primary" @click="submit('valiForm')">提交</button>
			</view>
		</uni-section>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				// 校验表单数据
				valiFormData: {
					title: '',
					subTitle: '',
					bodyContent: '',
					post: '',
					phone:''
				},
				creater: '',
				rules: {
					title: {
						rules: [{
							required: true,
							errorMessage: '标题不能为空'
						}]
					},
					post: {
						rules: [{
							required: true,
							errorMessage: '标题不能为空'
						}]
					},
					subTitle: {
						rules: [{
							required: true,
							errorMessage: '介绍不能为空'
						}]
					}
				},
			}
		},
		onLoad() {
			let userinfo = uni.getStorageSync('user')
			this.creater = userinfo.userInfo.userId
		},
		methods: {
			// 表单校验与提交
			submit(ref) {
				this.$refs[ref].validate().then(res => {
					console.log('success', res);
					uni.showToast({
						title: `校验通过`
					})
					let query = {
						title:this.valiFormData.title,
						subTitle:this.valiFormData.subTitle,
						bodyContent:this.valiFormData.bodyContent,
						post:this.valiFormData.post,
						creater:this.creater
					}
					console.log(query)
					this.API.postTalent(query).then(res=>{
						if(res.code === 200){
							console.log(res)
							uni.showToast({
								icon:"success",
								title:'发布成功'
							}).then(()=>{
								uni.navigateTo({
									url:'/pages/talent/talent'
								})
							})
						}
					})
				}).catch(err => {
					console.log('err', err);
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.page {
		width: 100%;
		height: 100vh;
		background-color: #f4f4f4;
	}

	.example {
		padding: 15px;
		background-color: #fff;
	}

	.segmented-control {
		margin-bottom: 15px;
	}

	.button-group {
		margin-top: 15px;
		display: flex;
		justify-content: space-around;
	}

	.form-item {
		display: flex;
		align-items: center;
	}

	.button {
		display: flex;
		align-items: center;
		height: 35px;
		margin-left: 10px;
	}
</style>