<template style="background-color:#F6F6F6 ;">
	<view style="margin-top: 20rpx;background-color: #FFFFFF;">
		<!-- 标题 -->
		<view class="title">常见问题</view>
		<!-- 线 -->
		<u-line color="#EFEFEF" />
		<!-- 问题列表 -->
		<view class="list">
			<u-collapse>
				<u-collapse-item :title="item.head" v-for="(item, index) in itemList" :key="index" head-style="font-size: 28rpx;">
					<div class="body">{{item.body}}</div>
				</u-collapse-item>
			</u-collapse>
		</view>
		<view class="footer">
			<view class="cu-bar bg-white tabbar border shop" style="width: 100%;">
				<view class="submit" @click="next" style="background-color: #0B73B9; color: #FFFFFF; font-size: 32rpx;">添加意见反馈</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				itemList: [{
					head: "赏识在于角度的转换",
					body: "1111111111\n11111111</br>11111111111111111111111111111111111111111111111111111111111111111111111111111111111111",
					open: true,
					disabled: true
				}, {
					head: "生活中不是缺少美，而是缺少发现美的眼睛",
					body: "学会欣赏，实际是一种积极生活的态度，是生活的调味品，会在欣赏中发现生活的美",
					open: false,
				}, {
					head: "周围一些不起眼的人、事、物，或许都隐藏着不同凡响的智慧",
					body: "但是据说雕刻大卫像所用的这块大理石，曾被多位雕刻家批评得一无是处，有些人认为这块大理石采凿得不好，有些人嫌它的纹路不够美",
					open: false,
				}, {
					head: "赏识在于角度的转换",
					body: "只要我们正确择取一个合适的参照物乃至稍降一格去看待他人，值得赏识的东西便会扑面而来",
					open: true,
					disabled: true
				}, {
					head: "生活中不是缺少美，而是缺少发现美的眼睛",
					body: "学会欣赏，实际是一种积极生活的态度，是生活的调味品，会在欣赏中发现生活的美",
					open: false,
				}, {
					head: "周围一些不起眼的人、事、物，或许都隐藏着不同凡响的智慧",
					body: "但是据说雕刻大卫像所用的这块大理石，曾被多位雕刻家批评得一无是处，有些人认为这块大理石采凿得不好，有些人嫌它的纹路不够美",
					open: false,
				}, {
					head: "赏识在于角度的转换",
					body: "只要我们正确择取一个合适的参照物乃至稍降一格去看待他人，值得赏识的东西便会扑面而来",
					open: true,
					disabled: true
				}, {
					head: "生活中不是缺少美，而是缺少发现美的眼睛",
					body: "学会欣赏，实际是一种积极生活的态度，是生活的调味品，会在欣赏中发现生活的美",
					open: false,
				}, {
					head: "周围一些不起眼的人、事、物，或许都隐藏着不同凡响的智慧",
					body: "但是据说雕刻大卫像所用的这块大理石，曾被多位雕刻家批评得一无是处，有些人认为这块大理石采凿得不好，有些人嫌它的纹路不够美",
					open: false,
				}],
			}
		},
		methods:{
			next(e){
				uni.navigateTo({
					url:'/pages/common_tools/help_feedback/opinion1'
				})
			}
		}
	}
</script>

<style lang="scss">
	.title {
		height: auto;
		display: flex;
		align-items: center;
		padding: 30rpx 0 30rpx 30rpx;
		font-size: 30rpx;
		font-weight: bold;
	}

	.list {
		height: auto;
		width: 100%;
		padding: 0 30rpx;

		.body {
			padding: 20rpx 30rpx 20rpx 20rpx;
			word-break: break-all;
			word-wrap: break-word
		}
	}
	.footer {
		width: 100%;
		height: auto;
		display: flex;
		position: fixed;
		bottom: 0;
	}
</style>
