68 lines
1.6 KiB
Vue
68 lines
1.6 KiB
Vue
<template>
|
|
<n-config-provider
|
|
wh-full
|
|
:locale="zhCN"
|
|
:date-locale="dateZhCN"
|
|
:theme="appStore.isDark ? darkTheme : undefined"
|
|
:theme-overrides="naiveThemeOverrides"
|
|
>
|
|
<n-loading-bar-provider>
|
|
<n-dialog-provider>
|
|
<n-notification-provider>
|
|
<n-message-provider>
|
|
<slot></slot>
|
|
<NaiveProviderContent />
|
|
</n-message-provider>
|
|
</n-notification-provider>
|
|
</n-dialog-provider>
|
|
</n-loading-bar-provider>
|
|
</n-config-provider>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { defineComponent, h } from 'vue'
|
|
import {
|
|
zhCN,
|
|
dateZhCN,
|
|
darkTheme,
|
|
useLoadingBar,
|
|
useDialog,
|
|
useMessage,
|
|
useNotification,
|
|
} from 'naive-ui'
|
|
import { useCssVar } from '@vueuse/core'
|
|
import { kebabCase } from 'lodash-es'
|
|
import { setupMessage, setupDialog } from '@/utils'
|
|
import { naiveThemeOverrides } from '~/settings'
|
|
import { useAppStore } from '@/store'
|
|
|
|
const appStore = useAppStore()
|
|
|
|
function setupCssVar() {
|
|
const common = naiveThemeOverrides.common
|
|
for (const key in common) {
|
|
useCssVar(`--${kebabCase(key)}`, document.documentElement).value = common[key] || ''
|
|
if (key === 'primaryColor') window.localStorage.setItem('__THEME_COLOR__', common[key] || '')
|
|
}
|
|
}
|
|
|
|
// 挂载naive组件的方法至window, 以便在全局使用
|
|
function setupNaiveTools() {
|
|
window.$loadingBar = useLoadingBar()
|
|
window.$notification = useNotification()
|
|
|
|
window.$message = setupMessage(useMessage())
|
|
window.$dialog = setupDialog(useDialog())
|
|
}
|
|
|
|
const NaiveProviderContent = defineComponent({
|
|
setup() {
|
|
setupCssVar()
|
|
setupNaiveTools()
|
|
},
|
|
render() {
|
|
return h('div')
|
|
},
|
|
})
|
|
</script>
|