<script setup lang="ts">
import { computed } from 'vue'
import { useRoute } from 'vue-router'
import { useDark, useThrottleFn, useWindowSize } from '@vueuse/core'
import zhCn from 'element-plus/es/locale/lang/zh-cn'

import { ScreenEnum } from './enums/appEnums'
import useAppStore from './stores/modules/app'
import useSettingStore from './stores/modules/setting'
import useUserStore from './stores/modules/user'
import ChatNotifyToast from './components/chat-notify-toast/index.vue'

const appStore = useAppStore()
const settingStore = useSettingStore()
const userStore = useUserStore()
const route = useRoute()

/** 须先绑企微时 chat/notifications 会反复返回 code=10，无意义轮询且可能干扰 axios/路由；绑定页也不展示会话通知 */
const showChatNotifyToast = computed(
    () =>
        Boolean(userStore.token) &&
        route.path !== '/bind-work-wechat' &&
        !userStore.userInfo?.need_bind_work_wechat
)
const elConfig = {
    zIndex: 2000,
    locale: zhCn
}
const isDark = useDark()
onMounted(async () => {
    console.log('主题颜色',isDark.value)
    //设置主题色
    settingStore.setTheme(isDark.value)
})

const { width } = useWindowSize()
watch(
    width,
    useThrottleFn((value) => {
        if (value > ScreenEnum.SM) {
            appStore.setMobile(false)
            appStore.toggleCollapsed(false)
        } else {
            appStore.setMobile(true)
            appStore.toggleCollapsed(true)
        }
        if (value < ScreenEnum.MD) {
            appStore.toggleCollapsed(true)
        }
    }),
    {
        immediate: true
    }
)
</script>

<template>
    <el-config-provider :locale="elConfig.locale" :z-index="elConfig.zIndex">
        <router-view />
        <ChatNotifyToast v-if="showChatNotifyToast" />
    </el-config-provider>
</template>

<style></style>
