<template>
    <view class="flex flex-wrap p-[32rpx] gap-[16rpx] text-[28rpx] bg-white">
        <view
            class="bg-[#F0F7FF] rounded-[8rpx] px-[16rpx] py-[8rpx]"
            v-for="(value, key) in filteredForm"
            :key="key"
        >
            <template v-if="key === 'createTimeRange'">
                <text class="text-[#1E40AF]">{{ parseLabel(key) }}:</text>
                <text class="text-primary">
                    {{ form.createTimeStart }} - {{ form.createTimeEnd }}
                </text>
            </template>
            <template v-else>
                <text class="text-[#1E40AF]">{{ parseLabel(key) }}:</text>
                <text class="text-primary" v-if="key === 'organizationId'">
                    {{ findTargetNode(value) }}
                </text>
                <text class="text-primary" v-else>{{ value }}</text>
            </template>
        </view>
    </view>
</template>

<script setup lang="ts">
import { PropType } from 'vue'
import { IForm } from './team/index.vue'
import { computed } from 'vue'
import { AdminTabEnum } from '@/enums'

const formMap: Record<AdminTabEnum, any> = {
    [AdminTabEnum.TEAM]: {
        organizationId: '组织',
        createTimeRange: '日期'
    },
    [AdminTabEnum.PERSONALLY]: {
        postId: '岗位',
        userId: '用户',
        createTimeRange: '日期'
    }
}
const props = defineProps({
    form: {
        type: Object as PropType<IForm>,
        default: () => ({})
    },
    activeTab: {
        type: Number as PropType<AdminTabEnum>,
        default: AdminTabEnum.TEAM
    },
    organizationList: {
        type: Array as PropType<any[]>,
        default: () => []
    }
})
const filteredForm = computed(() => {
    const { createTimeStart, createTimeEnd, ...rest } = props.form
    const activeTabMap = formMap[props.activeTab]
    const filtered = Object.keys(rest).reduce((acc, key) => {
        if (activeTabMap[key]) {
            acc[key] = rest[key]
        }
        return acc
    }, {} as Record<string, any>)

    if (createTimeStart && createTimeEnd) {
        filtered['createTimeRange'] = 'createTimeRange'
    }

    return filtered
})
const parseLabel = computed(() => (key: string) => {
    const { activeTab } = props
    return formMap[activeTab][key]
})
// 根据组织id查找对应的节点
const findNodeById = (nodes: any[], id: number, key = 'id'): any | undefined => {
    for (const node of nodes) {
        if (node[key] === id) {
            return node
        }
        if (node.children && node.children.length > 0) {
            const foundNode = findNodeById(node.children, id)
            if (foundNode) {
                return foundNode
            }
        }
    }
    return undefined
}
const findTargetNode = computed(() => (id: number) => {
    const nodeInfo = findNodeById(props.organizationList, id)
    if (nodeInfo && nodeInfo.pid) {
        const parentNode = findNodeById(props.organizationList, nodeInfo.pid, 'pid')
        if (parentNode) {
            return `${parentNode.name}-${nodeInfo.name}`
        }
    }
    return nodeInfo?.name || ''
})
</script>
<style scoped></style>
