<template>
    <TContainer>
        <u-tabs
            :list="tabs"
            :scrollable="false"
            :itemStyle="{ height: '44px', flex: 1 }"
            :activeStyle="{ color: '#0E66FB' }"
            lineWidth="32"
            lineColor="#0E66FB"
            @change="handleChangeTab"
        ></u-tabs>
        <view class="flex-1 bg-gray3">
            <admin-team v-if="activeTab === AdminTabEnum.TEAM" :activeTab="activeTab" />
            <personally v-if="activeTab === AdminTabEnum.PERSONALLY" :activeTab="activeTab" />
        </view>
    </TContainer>
</template>

<script setup lang="ts">
import { ref, shallowRef } from 'vue'
import { AdminTabEnum } from '@/enums'
import adminTeam from '@/components/widgets/admin/team/index.vue'
import personally from '@/components/widgets/admin/personally/index.vue'

const activeTab = ref(AdminTabEnum.TEAM)
const tabs = shallowRef([
    { name: '团队', value: AdminTabEnum.TEAM },
    { name: '个人', value: AdminTabEnum.PERSONALLY }
])
const handleChangeTab = item => {
    activeTab.value = item.value
}
</script>
<style scoped></style>
