<template>
	<tm-app>
		<tm-sheet>
			<tm-text label="点击中间+按钮可以体验异步加载动态效果."></tm-text>
		</tm-sheet>
		<tm-tabbar :autoSelect="false" v-model:active="acc">
			<tm-tabbar-item
				@click="acc = 0"
				activeColor="green"
				count="HOT"
				open-type="reLaunch"
				text="首页"
				icon="tmicon-collection-fill"
			></tm-tabbar-item>
			<tm-tabbar-item @click="acc = 1" activeColor="orange" text="表单" icon="tmicon-cog-fill"></tm-tabbar-item>
			<tm-tabbar-item
				@click="acc = 2"
				:shadow="2"
				:beforeClick="laodingfun"
				:data="'中间项'"
				btn-top
				fontColor="white"
				activeColor="white"
				linear="top"
				linearDeep="accent"
				color="yellow"
				icon="tmicon-plus"
			></tm-tabbar-item>
			<tm-tabbar-item
				@click="acc = 3"
				activeColor="orange"
				url="/pages/fankui/index"
				text="反馈分类"
				unicon="tmicon-like"
				icon="tmicon-heart-fill"
			></tm-tabbar-item>
			<tm-tabbar-item
				@click="acc = 4"
				activeColor="orange"
				:count="8"
				url="/pages/chart/index"
				active
				text="图表中心"
				unicon="tmicon-account"
				icon="tmicon-userplus-fill"
			></tm-tabbar-item>
		</tm-tabbar>
	</tm-app>
</template>
<script lang="ts" setup>
import { ref, getCurrentInstance } from 'vue'
import { onShow, onLoad } from '@dcloudio/uni-app'
import tmApp from '@/tmui/components/tm-app/tm-app.vue'
import tmSheet from '@/tmui/components/tm-sheet/tm-sheet.vue'
import tmText from '@/tmui/components/tm-text/tm-text.vue'
import tmTabbar from '@/tmui/components/tm-tabbar/tm-tabbar.vue'
import tmTabbarItem from '@/tmui/components/tm-tabbar-item/tm-tabbar-item.vue'
const acc = ref(1)
function laodingfun(val) {
	return new Promise((res) => {
		setTimeout(function () {
			console.log('选中了：', val)
			res(true)
		}, 2000)
	})
}
</script>