import { computed, } from 'vue'
import { useI18n } from 'vue-i18n'
import useCardStore from '@/stores/use-card-store';
/**
 * 订单字段处理 Composable
 * 将 detailData 中的字段数据转换为分组列表，支持缓存数据立即渲染
 */
export function useOrderFields(detailData: any) {
    const { t } = useI18n()
    const cardStore = useCardStore()

    /** 1️⃣ 字段解析（一维数组） */
    const fieldList = computed(() => {
        const dt = detailData.value

        if (!dt) {
            return []
        }

        // 检查 dt 是否已经加载了数据（通过检查是否有属性）
        const hasData = Object.keys(dt).length > 0

        if (!hasData) {
            console.log('数据尚未加载，返回空数组');
            return []
        }

        // fieldDtos 存在且不为空数组时使用 fieldDtos
        if (dt.fieldDtos && Array.isArray(dt.fieldDtos) && dt.fieldDtos.length > 0) {
            console.log('使用 fieldDtos 分支，数量:', dt.fieldDtos.length);
            return [...dt.fieldDtos]
                .sort((a, b) => (a.sorting || 0) - (b.sorting || 0))
                .map(item => {
                    const key = Object.keys(dt).find(
                        k => k.toLowerCase() === item.fieldName.toLowerCase()
                    )
                    const i18nKey = `global.fieldName.${item.fieldName}.fieldTitle`
                    let name = t(i18nKey)
                    if (name === i18nKey) {
                        name = item.fieldName
                    }
                    let value = key ? dt[key] : item.fixedValue
                    if (
                        item.fieldType === 'select' &&
                        key &&
                        !['transferType', 'payoutMethod'].includes(key)
                    ) {
                        value = dt[key + 'Value'] || value
                    }
                    if (item.fieldName === 'transferAmount' && dt.payoutCurrency) {
                        value = `${value} ${dt.payoutCurrency}`
                    }

                    return {
                        name,
                        value: value ?? '',
                        type: item.fieldUserType || 'other',
                        fieldName: item.fieldName,
                        fieldType: item.fieldType,
                        options: item.options || null
                    }
                })
        }

        // 使用 globalFieldParams
        console.log('使用 globalFieldParams 分支');
        console.log('globalFieldParams:', cardStore.globalFieldParams);

        return cardStore.globalFieldParams
            .map((item: any) => {
                const key = Object.keys(dt).find(
                    k => k === item.fieldName
                )

                const i18nKey = `global.fieldName.${item.fieldName}.fieldTitle`
                let name = t(i18nKey)
                if (name === i18nKey) {
                    name = item.fieldName
                }
                let value = key ? dt[key] : ''

                if (
                    item.fieldType === 'select' &&
                    key &&
                    !['transferType', 'payoutMethod'].includes(key)
                ) {
                    value = dt[key + 'Value'] || value
                }
                if (item.fieldName === 'transferAmount' && dt.payoutCurrency) {
                    value = `${value} ${dt.payoutCurrency}`
                }

                return {
                    name,
                    value: value ?? '',
                    type: item.fieldUserType || 'other',
                    fieldName: item.fieldName,
                    fieldType: item.fieldType,
                    options: item.options || null
                }
            })
            .filter(field => {
                // 过滤掉 value 为空的字段
                const val = field.value
                return val !== '' && val !== null && val !== undefined
            })
    })

    /** 2️⃣ 分组字段（按类型分组） */
    const fieldGroups = computed(() => {
        const groups: Record<string, any[]> = {}

        fieldList.value.forEach(field => {
            const type = field.type || 'other'
            if (!groups[type]) {
                groups[type] = []
            }
            groups[type].push(field)
        })
        return groups
    })
    return {
        fieldList,
        fieldGroups
    }
}