<template>
    <TContainer>
        <u-tabs
            :list="tabs"
            :scrollable="false"
            :itemStyle="{ height: '44px', flex: 1 }"
            :activeStyle="{ color: '#0E66FB' }"
            lineWidth="60"
            lineColor="#0E66FB"
            :current="activeTab"
            @change="handleChangeTab"
        ></u-tabs>
        <view class="flex-1 bg-gray3">
            <follow-form v-if="activeTab === teleSaleEnum.ADD_FOLLOW" />
            <follow-record v-else-if="activeTab === teleSaleEnum.FOLLOW_RECORD" />
        </view>
    </TContainer>
</template>

<script setup lang="ts">
import { shallowRef } from 'vue'
import { ref } from 'vue'
import followForm from '@/components/widgets/telesale/follow-form.vue'
import followRecord from '@/components/widgets/telesale/follow-record.vue'
import { teleSaleEnum } from '@/enums'

const activeTab = ref(teleSaleEnum.ADD_FOLLOW)
const tabs = shallowRef([
    { name: '新增跟进', value: teleSaleEnum.ADD_FOLLOW },
    { name: '跟进动态', value: teleSaleEnum.FOLLOW_RECORD }
])
const handleChangeTab = item => {
    activeTab.value = item.value
}
</script>
<style scoped></style>
