<template>
	<view class="container">
		<view class="list-view">
			<view v-for="(item,index) in faqList" :key="index" class="list-cell tui-list-item">
				<view @tap="goFaqContent(index)">
					<view class="cell-title-box">
						<view class="cell-title">{{item.title}}</view>
					</view>
					<view class="sub-title">
						<view style="">{{item.desc}}</view>
						<block v-if="item.image.length" v-for="(item1,index1) in item.image" :key="index1">
							<image style="height:150rpx;margin-right:20rpx;padding-top:20rpx" mode="heightFix" :src="apiHost+'/miniapp/static/'+item1"></image>
						</block>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import myapp from '@/common/js/myapp.js'
	export default {
		data() {
			return {
				apiHost: myapp.apiHost,
				faqList: [{
					title: '登陆不上？',
					desc:'请确认用户名和密码是否正确，确认无误可以联系技术人员帮忙解决。',
					iamge:[]
				},{
					title: 'RFID卡消磁了，怎么办？',
					desc:'RFID标签其实是一种非接触式的IC卡，它是结合RFID无线射频识别技术，把非接触式IC卡制成标签的形式，由于使用的是IC（集成电路）芯片，所以不存在消磁的问题。',
					image:[
						'faq_example1.png',
						'faq_example2.png'
					]
				}]
			}
		},
		onShow: function() {
			let user = myapp.checkLogin()
			uni.setStorageSync('lastPagePath', '/packagePage/pages/faq/faq')
		},
		methods: {
			goFaqContent:function(id) {
				uni.navigateTo({
					url:'/packagePage/pages/faq_content/faq_content'
				})
			}
		}
	}
</script>

<style>
	page {
		background-color: #F5F6FA;
	}
	
	.container {
		padding-bottom: env(safe-area-inset-bottom);
	}

	.list-view {
		width: 100%;
		box-sizing: border-box;
	}

	.list-cell {
		background: #fff;
		padding: 30rpx 32rpx;
		box-sizing: border-box;
		margin-bottom:20rpx;
	}

	.cell-title-box {
		position: relative;
	}

	.cell-title {
		font-size: 32rpx;
		line-height: 56rpx;
		word-break: break-all;
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 3;
	}

	.sub-title {
		padding-top: 24rpx;
		font-size: 28rpx;
		color: #BCBCBC;
		align-items: center
	}
</style>
