<template>
	<div>
		<div class="complaint-form">
			<!-- <h2>投诉与建议</h2> -->
			<div>
				<!-- <label for="title">标题</label> -->
				<input type="text" id="title" v-model="title" maxlength="30" required placeholder="请输入标题" />
			</div>
			<div class="horizontal-line"></div>
			<div>
				<!--  <label for="content">请输入正文</label> -->
				<textarea id="content" v-model="content" maxlength="500" required placeholder="请输入内容"></textarea>
			</div>
		</div>
		<button class="complaint-form-button" @click="handleSubmit" type="submit">提交</button>
	</div>
</template>

<script>
	import {
		addSuggestions
	} from '../../api/apiList'
	export default {
		data() {
			return {
				title: '',
				content: '',
				mobile: '',
				// driver_id:''
			};
		},
		methods: {
			handleSubmit() {
				// 在这里处理表单提交逻辑
				console.log('Title:', this.title);
				console.log('Content:', this.content);
				const reqData = {
					"aux": {
						"title": this.title,
						"content": this.content,
						"mobile": this.mobile,

					}
				}
				addSuggestions(reqData).then(res => {
					// uni.stopPullDownRefresh()
					 if (res.data.messageType === 'success') {
						 uni.showToast({
							message: '提交成功!',
						})
						setTimeout(() => {
						  uni.navigateBack()
						}, 1500)
					};
				}).catch(errors => {
					 uni.showToast({
						message: '系统异常，请联系管理员',
					})
				})
				// 可以在这里发送数据到服务器或进行其他操作
			}
		},
		onLoad: function(param) {
			this.mobile = param.mobile;
			console.log("this.mobile  " + this.mobile);
		}
	};
</script>

<style scoped>
	.complaint-form {
		max-width: 400px;
		/* height: 80%; */
		margin: auto;
		padding: 20px;
		border: 1px solid #ccc;
		border-radius: 5px;
	}

	.complaint-form h2 {
		text-align: center;
	}

	.complaint-form form div {
		margin-bottom: 15px;
	}

	.complaint-form label {
		display: block;
		margin-bottom: 5px;
	}

	.complaint-form input {
		width: 100%;
		/* 	padding: 8px; */
		box-sizing: border-box;
	}

	.complaint-form textarea {
		width: 100%;
		height: 300px;
		/* padding: 8px; */
		box-sizing: border-box;
	}

	.complaint-form-button {
		width: 100%;
		height: 60px;
		/*  padding: 20px; */
		margin-top: 3%;
		background-color: #007bff;
		color: white;
		border: none;
		border-radius: 5px;
		cursor: pointer;
		font-size: 100%;
	}

	.complaint-form button:hover {
		background-color: #0056b3;
	}

	.horizontal-line {
		height: 2px;
		/* 横线的高度 */
		background-color: #F0F0F0;
		/* 横线的颜色 */

	}
</style>