<template>
  <a-config-provider :locale="locale" :auto-insert-space-in-button="false">
    <RouterView v-if="isRouterReady">
      <template #default="{ Component, route }">
        <component
          :is="isFullScreen ? Component : BaseLayout"
          v-bind="isFullScreen ? {} : { content: Component }"
        >
          <keep-alive>
            <component
              :is="Component"
              v-if="route.meta.keepAlive"
              :key="route.meta.usePathKey ? route.path : route.name"
            />
          </keep-alive>

          <component
            :is="Component"
            v-if="!route.meta.keepAlive"
            :key="route.meta.usePathKey ? route.path : route.name"
          />
        </component>
      </template>
    </RouterView>
  </a-config-provider>
</template>

<script setup lang="ts">
import { computed, ref, onMounted } from 'vue'
import BaseLayout from '@/layout/index.vue'
import { useRoute, useRouter } from 'vue-router'

import zhCN from 'ant-design-vue/es/locale/zh_CN'
import dayjs from 'dayjs'
import 'dayjs/locale/zh-cn'
dayjs.locale('zh-cn')
const locale = zhCN

const route = useRoute()
const router = useRouter()
const isRouterReady = ref(false)

onMounted(() => {
  router.isReady().then(() => {
    isRouterReady.value = true

    // 环境信息
    console.log(`🚀CurrentMode: ${import.meta.env.MODE}`)
    console.log(`🚀HostAPI: ${import.meta.env.VITE_APP_HOST}`)
    console.log(`🚀ProxyAPI: ${import.meta.env.VITE_APP_HOST}`)
  })
})

const isFullScreen = computed(() => Boolean(route.meta?.isFullScreen))
console.log('🚀App route🚀', route)
</script>

<style scoped lang="less"></style>
