<template>
	<view class="content">
		<view class="formbox">
			<view class="input">
				<input type="text" v-model="formdata.phone" placeholder="在此输入您的联系方式" />
			</view>
			<view class="input textarea">
				<textarea v-model="formdata.content" name="content" placeholder="有什么想说的，尽管来吧..." />
			</view>
			<view class="btn " type="button" @click="submit">提交</view>
		</view>
	</view>
</template>

<script>
	import {
		mapState
	} from "vuex";
	export default {
		data() {
			return {
				formdata: {
					phone: "",
					content: ""
				},
			}
		},
		computed: {
			...mapState([])
		},
		onLoad() {},
		methods: {
			submit() {
				if (!this.formdata.phone.trim()) {
					this.$tools.msg("请输入联系方式");
					return
				}
				if (!/(^1[3|4|5|7|8][0-9]{9}$)/.test(this.formdata.phone)) {
					this.$tools.msg('请输入正确的联系方式');
					return;
				}
				if (!this.formdata.content.trim()) {
					this.$tools.msg("请输入建议");
					return
				}
				this.$model.submitadvice(this.formdata).then((res) => {
					this.$tools.msg(res.message)
					setTimeout(function() {
						uni.switchTab({
							url: "/pages/me/me"
						})
					}, 500)

				}).catch((res) => {
					this.$tools.msg('提交失败，请稍后重试!')
				});

			}
		},
	}
</script>

<style lang="scss" scoped>
	.formbox {
		padding: 15px;
		width: calc(100% - 30px);
	}

	.input {
		margin: 0;
		display: flex;
		border-radius: 10px;
		padding: 10px;
		margin-bottom: 1rem;
		background: #fff;

		input {
			width: 100%;
			height: 1.5rem;
			line-height: 1.5rem;
			background: none;
			border: none;
			font-size: 14px;
		}

		/deep/textarea {
			width: 100%;
			height: 6rem;
			line-height: 20px;
			background: none;
			border: none;
			font-size: 14px;
		}
	}

	.btn {
		color: #fff;
		margin: 15px 0;
	}
</style>
