import { apiCluseDetail } from '@/api/clue'
import { IForm } from '@/components/widgets/admin/team/index.vue'
import { computed, ref, shallowRef } from 'vue'

// 获取线索详情
export function useClueDetail() {
    const clueDetailInfo = ref()
    const fetchClueDetail = async (id: number | string) => {
        uni.showLoading({
            title: '加载中'
        })
        try {
            const result = await apiCluseDetail({ id })
            clueDetailInfo.value = result
        } catch (error) {}
        uni.hideLoading()
    }
    return {
        clueDetailInfo,
        fetchClueDetail
    }
}

interface IRank {
    index: number
    name: string
    total: number
}
interface IRankTab {
    name: string
    value: number
    id: number
}
// 主账号排行榜
export function useRank({ width }: { width: number }) {
    const tabs = ref<IRankTab[]>([])
    const activeTab = ref()
    const loading = ref(false)
    const data = ref<IRank[]>([])
    const totalLabel = computed(() => (activeTab.value == 5 ? '意向' : '成交'))
    const rankStyle = computed(() => row => {
        const styleMap: Record<number, string> = {
            '1': '#FCAE3C',
            '2': '#BCC1D8',
            '3': '#EEB286'
        }
        return {
            color: row >= 4 ? '#3d3d3d' : '#fff',
            background: styleMap[row]
        }
    })

    const handleChangeTab = item => {
        activeTab.value = item.id
        generateColumns()
    }
    const generateColumns = () => {
        return [
            { name: 'index', label: '排名', slot: true },
            { name: 'name', label: '姓名' },
            { name: 'total', label: totalLabel.value + '客户数', width, align: 'right' }
        ]
    }

    const columns = ref(generateColumns())
    const fetchTabs = () => {
        return new Promise(resolve => {
            tabs.value = [
                { name: '电销业绩排行榜', value: 1, id: 5 },
                { name: '招生业绩排行榜', value: 2, id: 6 }
            ]
            if (tabs.value.length > 0) activeTab.value = tabs.value[0]
            resolve(tabs.value)
        })
    }
    const fetchData = async (payload: IForm) => {
        await fetchTabs()
        console.log(activeTab.value)
        loading.value = true
        setTimeout(() => {
            data.value = [
                {
                    index: 1,
                    name: '王小虎1789789789789789',
                    total: 100
                },
                {
                    index: 2,
                    name: '王小虎2',
                    total: 20
                },
                {
                    index: 3,
                    name: '王小虎2',
                    total: 20
                },
                {
                    index: 4,
                    name: '王小虎2',
                    total: 20
                }
            ]
            loading.value = false
        }, 500)
    }

    return {
        fetchData,
        rankStyle,
        activeTab,
        columns,
        tabs,
        data,
        loading,
        handleChangeTab
    }
}

// 岗位
export function usePositions() {
    const positionList = ref()
    const postId = ref()
    const fetchPositions = () => {
        try {
            positionList.value = [
                {
                    label: '电销老师',
                    id: 5,
                    value: 5
                },
                {
                    label: '招生老师',
                    id: 6,
                    value: 6
                }
            ]
            if (positionList.value.length > 0) postId.value = positionList.value
        } catch (error) {}
    }

    return {
        positionList,
        postId,
        fetchPositions
    }
}
