app.vue 936 B

1234567891011121314151617181920212223242526272829303132333435363738394041
  1. <script lang="ts" setup>
  2. import { computed } from 'vue';
  3. import { useAntdDesignTokens } from '@vben/hooks';
  4. import { preferences, usePreferences } from '@vben/preferences';
  5. import { App, ConfigProvider, theme } from 'ant-design-vue';
  6. import { antdLocale } from '#/locales';
  7. import { useAppStore } from '#/store';
  8. defineOptions({ name: 'App' });
  9. const appStore = useAppStore();
  10. appStore.loadAppInfo();
  11. const { isDark } = usePreferences();
  12. const { tokens } = useAntdDesignTokens();
  13. const tokenTheme = computed(() => {
  14. const algorithm = isDark.value
  15. ? [theme.darkAlgorithm]
  16. : [theme.defaultAlgorithm];
  17. // antd 紧凑模式算法
  18. if (preferences.app.compact) {
  19. algorithm.push(theme.compactAlgorithm);
  20. }
  21. return {
  22. algorithm,
  23. token: tokens,
  24. };
  25. });
  26. </script>
  27. <template>
  28. <ConfigProvider :locale="antdLocale" :theme="tokenTheme">
  29. <App>
  30. <RouterView />
  31. </App>
  32. </ConfigProvider>
  33. </template>