<template>
	<view class="p-30">
		<view class="bg-white box">
			<view class="title">反馈类型</view>
			<view>
				<u-radio-group v-model="type" @change="changeType" :disabled="isUpdate" placement="row">
					<u-radio label="功能建议" name="01"></u-radio>
					<u-radio label="客服投诉" name="02"></u-radio>
					<u-radio label="其他" name="03"></u-radio>
				</u-radio-group>
			</view>
		</view>

		<view class="bg-white box">
			<view class="title">问题和意见</view>
			<view>
				<u--textarea v-model="remark" :disabled="isUpdate" placeholder="请输入内容" count maxlength="200"></u--textarea>
			</view>
		</view>

		<view style="padding: 50rpx;" class="fixed-btn" v-if="!isUpdate">
			<u-button shape="circle" type="primary" @click="submit()">提交</u-button>
		</view>
	</view>
</template>

<script>
	import {
		feedbackAdd
	} from '@/api/index.js'
	import {
		mapState
	} from 'vuex'
	export default {
		computed: {
			...mapState(['userInfo'])
		},
		data() {
			return {
				type: '01',
				remark: '',
				isUpdate: false
			}
		},
		onLoad(option) {
			if (option.data) {
				const jsonData = JSON.parse(option.data)
				this.type = jsonData.type
				this.remark = jsonData.content
				this.isUpdate = true
			}
		},
		methods: {
			async submit() {
				if (!this.remark) return uni.$u.toast('请输入问题和建议')
				const res = await feedbackAdd({
					userId: this.userInfo.id,
					type: this.type,
					content: this.remark
				})
				if (!res.success) return
				uni.showToast({
					title: '提交成功',
					icon: 'success',
					duration: 1500,
					success() {
						setTimeout(() => {
							uni.navigateBack()
						}, 1500)
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.box {
		border-radius: 20upx;
		padding: 30upx;
		margin-bottom: 20upx;
	}

	.title {
		font-size: 30upx;
		color: $u-info;
		padding-bottom: 20upx;
	}

	::v-deep .u-radio {
		flex: 1;
	}

	.fixed-btn {
		width: 100%;
		box-sizing: border-box;
		position: fixed;
		left: 0;
		bottom: 0
	}
</style>