<template>
	<view class="feedback-wrapper">
		<view class="common-card">
			<BaseTitle txt="如果您有什么想法和意见,请在下面填写"></BaseTitle>
			<u--textarea height="140" v-model="remark" placeholder="请输入内容" ></u--textarea>
			<view class="common-btn mt15" @click="submitData">提交</view>
		</view>
		<view class="common-card">
			<BaseTitle txt="我的反馈"></BaseTitle>
			<view class="feedback-list">
				<view class="feedback-item" v-for="(item, index) in feedbackList" :key="index">
					<view class="content fw600 mb5 display-flex-center">
						<u-icon name="coupon" color="#765AEE"></u-icon>
					  <text class="ml5">{{item.remark}}</text>
					</view>
					<view class="time fs12 color-71">{{item.create_at}}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import BaseTitle from "@/components/base-title/index.vue"
	export default {
		components: {BaseTitle},
		data() {
			return {
				remark: '',
				feedbackList: [
        ]
			}
		},
		onLoad() {
			this.getList()
		},
		methods: {
			submitData() {
				if (!this.remark) {
					uni.showToast({
						icon: "none",
						title: '请填写反馈内容'
					})
					return
				}
				uni.showLoading()
				this.$api.addFeedbackData({remark: this.remark}).then(res => {
					uni.hideLoading()
					if (res.code == 1) {
						uni.showToast({
							icon: "success",
							title: '提交成功!'
						})
						this.remark = ''
						this.getList()
					}
				})
			},
			getList() {
				uni.showLoading()
				this.$api.getMyFeedbackList().then(res => {
					uni.hideLoading()
					if (res.code == 1) {
						this.feedbackList = res.data.list
					}
				}).catch(() => {
					uni.hideLoading()
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
.feedback-wrapper {
	height: 100vh;
	box-sizing: border-box;
	// background-color: #fff;
	padding: 20rpx;
	::v-deep {
		.base-title-line {
			margin-left: 0;
		}
	}
	.feedback-item {
		border-bottom: 2rpx solid #E8E8EB;
		padding: 20rpx 0;
		font-size: 28rpx;
	}
}
</style>
