<template>
	<TnTabbar v-model="currentTabbar" fixed>
	    <TnTabbarItem
	      v-for="(item, index) in tabbarData"
	      :key="index"
	      :icon="item.icon"
	      :active-icon="item.activeIcon"
	      :text="item.name"
		  @click="navigate(item)"
	    />
	</TnTabbar>
</template>

<script lang="ts" setup>
	import { ref,watch } from 'vue'
	import TnTabbar from '@/uni_modules/tuniaoui-vue3/components/tabbar/src/tabbar.vue'
	import TnTabbarItem from '@/uni_modules/tuniaoui-vue3/components/tabbar/src/tabbar-item.vue'
	
	const currentTabbar = ref(0)
	
	const props = defineProps<{
		current?:0
	}>()
	
	// 导航栏数据
	const tabbarData = ref([
	  {
	    name: '首页',
	    icon: 'home',
	    activeIcon: 'home-fill',
		path:'/pages/index/index'
	  },
	  {
	    name: '关于',
	    icon: 'company',
	    activeIcon: 'company-fill',
		path:'/pages/park/intro'
	  },
	  {
	    name: '动态',
	    icon: 'image-text',
	    activeIcon: 'image-text-fill',
		path:'/pages/article/index?id=648'
	  },
	  {
	    name: '我的',
	    icon: 'my-circle',
	    activeIcon: 'my-circle-fill',
		path:'/pages/ucenter/index'
	  },
	])
	
	const navigate = (item:any) => {
		uni.redirectTo({
			url:item.path
		})
	}
	
	watch(
		()=>props.current,
		(value) => {
			currentTabbar.value = value
		},{immediate:true}
	)
</script>

<style lang="scss" scoped>
</style>