<template>
	<view class="content">
		<view class="content-form">
			<u--form label-position="top" labelWidth="100" :model="model" :rules="rules" ref="form">
				<u-form-item required label="标题" prop="title" borderBottom :customStyle="{
						'flex-direction': 'row !important'
					}">
					<u--input inputAlign="right" border="none" v-model="model.title" placeholder="请填写标题">
					</u--input>
				</u-form-item>
				<u-form-item required label="备注" prop="content">
					<u--textarea maxlength="-1" :customStyle="{
							marginTop: '20rpx',
							background: '#F5F5F5',
							border: 'none'
						}" v-model="model.content" placeholder="备注说明" height="128rpx"></u--textarea>
				</u-form-item>
			</u--form>
		</view>
		<u-button @click="handleSubmit" text="提交反馈" color="#2C66FF" :customStyle="{
				width: '710rpx',
				height: '80rpx',
				borderRadius: '10rpx',
				padding: '0rpx',
				position: 'absolute',
				bottom: '142rpx',
				left: '20rpx'
			}"></u-button>
	</view>
</template>

<script>
	// import apiBaseConfig from '@/config/index.js';
	import {
		addUserFeedback
	} from '@/api/my/index.js'
	export default {
		data() {
			return {
				// imgBgUrl: apiBaseConfig.imgBgUrl,
				globalData: getApp().globalData,
				scrollTopHeader: 0,
				model: {
					title: '',
					content: '',
					userId:'111',
					modifyTime:'2021-12-03 09:30:11',
					deleteStatus:0,
					createUser:'李哈哈',
					modifyUser:'杜小渣'
				},
				rules: {
					title: {
						type: 'string',
						required: true,
						message: '请填写标题',
						trigger: ['blur', 'change']
					},
					content: {
						type: 'string',
						required: true,
						message: '请填写备注说明',
						trigger: ['blur', 'change']
					}
				}
			};
		},
		onLoad() {},
		onReady() {
			//如果需要兼容微信小程序，并且校验规则中含有方法等，只能通过setRules方法设置规则。
			this.$refs.form.setRules(this.rules);
		},
		methods: {
			handleSubmit() {
				let that = this
				that.model = {
					...that.model,
					content:that.model.content.trim()
				}
				that.$refs.form.validate().then(res => {
					addUserFeedback(that.model).then(res=>{
						if(res.code == 200){
							uni.showToast({
								title:'提交成功!',
								icon:'none',
								duration:2000,
								success() {
									setTimeout(()=>{
										that.$uniGo.navigateBack({
											delta: 1
										});
										that.resetForm()
									},1000)
								}
							})
						}
					})
					// uni.$u.toast('校验通过')
				}).catch(errors => {
					uni.$u.toast('请完善信息')
				})
				
			},
			resetForm(){
				this.model = {
					title: '',
					content: '',
					userId:'111',
					modifyTime:'2021-12-03 09:30:11',
					deleteStatus:0,
					createUser:'李哈哈',
					modifyUser:'杜小渣'
				}
			}
		}
	};
</script>

<style lang="scss" scoped>
	.content {
		&-form {
			margin: 30rpx 20rpx;
			width: calc(100% - 20rpx * 2);

			/deep/ .u-form {
				width: calc(100% - 20rpx * 2);
				margin: 0rpx 20rpx;
			}
		}
	}
</style>
