<template>
	<view>
		<dHeader :title="$lang.lang.help.help"></dHeader>
		<!-- <view class="start-bar"></view> -->
		<view class="help">
			<view class="item" v-for="(item, index) in data" @click="itemClick(index)">
				<view class="item-v">
					<text>{{item[$lang.title]}}</text>
					<image :class="dataFlag[index].show == 0 ? '' : 'route'" src="../../static/img/rgt.png" mode=""></image>
				</view>
				<view v-if="dataFlag[index].show == 1" class="item-content" v-html="item[$lang.content]" ></view>
			</view>
		</view>
	</view>
</template>

<script>
	import dHeader from '../../components/dHeader/index.vue'
	export default {
		components: {
			dHeader
		},
		data() {
			return {
				data: [],
				dataFlag: [],
				page: 1,
				totalPage: 1,
			}
		},
		onShow () {
			this.page = 1
			this.getData()
		},
		onPullDownRefresh() {
			this.page = 1
			this.data = []
			this.getData()
			uni.stopPullDownRefresh()
		},
		onReachBottom() {
			if(this.totalPage > this.page){
				this.page ++
				this.getData()
			}
		},
		methods: {
			getData(){
				this.$request.get('/app-api/system/help-doc/page', {page: this.page, rows: 20}).then(res => {
					if(res.code == 0&&res.data&& res.data.list.length > 0){
						this.data = res.data.list
						for(let i in res.data.list){
							let flag = {show: 0}
							this.dataFlag.push(flag)
						}
						this.totalPage = res.data.pages
					}

				})
			},
			itemClick (e) {
				this.dataFlag[e].show = this.dataFlag[e].show == 0 ? 1 : 0
			}
		}
	}
</script>

<style>
	@import url("../../static/css/help.css");
</style>
