dev/dcp-app-gate/pages/service/others/helpCenter.vue

<template>
	<view class="helpcenter">
		<!-- 标题栏 -->
		<u-navbar
			back-icon-color="#fff"
			:back-text="$t('common.Back')" 
			:is-back="true" 
			:background="{background:'#1777FE'}"
			:back-text-style="{color:'#fff'}" 
			:border-bottom="true"
			title-color="#fff"
			:title="title"
			:custom-back="back"
			>
		</u-navbar>
		<!-- 问题分类 -->
		<!-- <scroll-view class="helpList" :scroll-x="false" :scscroll-y="true" v-if="helpList.length>0">
			<view class="item" v-for="(item,index) in helpList" :key="item.id" @click="showItem(item)">
				<view class="label">{{item.name}}</view>
				<view class="icon">&gt;</view>
			</view>
		</scroll-view> -->
		
		 <tree :list="helpList" @treeItemClick="showQuestionDetial"/>
		<!-- <tki-tree ref="tkitree" :range="helpList" :rangeKey="name" confirmColor="#4e8af7" /> -->
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import UNavbar from '@/components/uni-nav-bar/uni-nav-bar.vue'
	import tree from "@/components/tree/tree.vue"
	export default {
		name:'HelpCenter',
		components:{
			UNavbar,
			tree
		},
		data(){
			return {
				title:'',
				backtext:'',
				helpList:[],
				
			}
		},
		onLoad(e){
			uni.showLoading({
				title: this.$i18n.locale == 'zh'? '加载中...': 'Loading...'
			});
			this.title= this.$i18n.locale == 'zh'? '帮助中心': 'Help Center'
			this.backtext= this.$i18n.locale == 'zh'? '返回': 'Back'
			setTimeout(()=>{uni.hideLoading();},100)
		},
		created(){
			this.getHelpColumnTree()
		},
		onShow(){
		},
		methods:{
			showQuestionDetial(item){
				uni.navigateTo({
					url:'/pages/service/others/helpCenterDetial?questionId='+item.id
				})
			},
			showItem(item){
				if(item.children && item.children.length>0){
					uni.setStorageSync('helpItem',item.children);
					uni.navigateTo({
						url:'/pages/service/others/helpCenterList?pageTitle='+encodeURIComponent(item.name)
					})
				}else{
					this.$refs.uToast.show({title:'暂无数据',type:'info'})
				}
			},
			//获取帮助中心栏目
			async getHelpColumnTree(){
				let res = await this.$myRequest({
					url:'/op/helpCenterEntitys/getColumnTree',
					data:{language:this.$i18n.locale}
				})
				if(res.status=='200' && res.msg=="ok");
				this.helpList=res.data;
				
			},
			
			//路由后退一步
			back(){
				// #ifdef H5
				history.back()
				// #endif
				// #ifndef H5
				uni.navigateBack()
				// #endif
			},
			
		},
	}
</script>
	
<style lang="scss" scoped>
	page {
		background-color: #fff;
	}
	.helpcenter{
		background:#fefefe;
		.helpList{
			position:absolute;
			height:93.2%;
			background:#fefefe;
			.item{
				padding:20upx;
				height:100upx;
				border-bottom:2upx solid #eee;
				display:flex;
				align-items:center;
				.label{
					flex:1
				}
			}
		}
	}
</style>