<template>
    <div class="flex flex-col h-full">
        <account-number :accoutnInfo="accoutnInfo" />
        <div class="flex flex-1 bg-white overflow-x-auto">
            <organization
                ref="organizationRef"
                @set-selected-node="setSelectedNode"
                :curSelectedNode="selectedNode"
                @fetch-table-list="fetchTableList"
                @get-organization-list="getOrganizationList"
            />
            <!-- v-if="organzationList[0]?.children?.length > 0"-->
            <account-list
                ref="accountListRef"
                :curOrganization="selectedNode"
                @refresh-sub-account-number="fetchSubAccountNumber"
                @fetch-organization-list="fetchOrganizationList"
            />
            <!-- <account-empty v-else /> -->
        </div>
    </div>
</template>

<script setup lang="ts">
import accountNumber, { type IAccountInfo } from './modules/account-number.vue'
import organization from './modules/organization.vue'
import accountList from './modules/account-list.vue'
import accountEmpty from './modules/account-empty.vue'
import type { Tree } from './components/organization/organization-tree.vue'
import { subAccountNumber } from '@/api/account_center/sub_account'
import { StatusEnum } from '@/enums'
import feedback from '@/utils/feedback'

const organizationRef = ref<InstanceType<typeof organization>>()
const organzationList = ref<Tree[]>([])
const selectedNode = ref()
const setSelectedNode = (data: Tree) => {
    selectedNode.value = data
}
watch(
    () => selectedNode.value,
    val => {
        if (val) {
            if (val.status == StatusEnum.Stop) feedback.msgError('当前组织状态为停用，请先启用')
            fetchTableList()
        }
    }
)
const accountListRef = ref<InstanceType<typeof accountList>>()
const fetchTableList = () => {
    accountListRef.value?.fetchTableList(selectedNode.value?.id)
}
const accoutnInfo = ref<IAccountInfo>()
const fetchSubAccountNumber = async () => {
    try {
        const result = await subAccountNumber()
        accoutnInfo.value = result
    } catch (error) {}
}
fetchSubAccountNumber()

const getOrganizationList = (data: Tree[]) => {
    organzationList.value = data
}
const fetchOrganizationList = async () => {
    organizationRef.value?.fetchOrganizationList()
    fetchTableList()
}
</script>
<style scoped></style>
