app-setting.ts 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687
  1. import { $themeConfig } from '../theme.config';
  2. import { useAppStore } from '@/stores/index';
  3. export default {
  4. init() {
  5. const store = useAppStore();
  6. // set default styles
  7. let val: any = localStorage.getItem('theme'); // light, dark, system
  8. val = val || $themeConfig.theme;
  9. store.toggleTheme(val);
  10. val = localStorage.getItem('menu'); // vertical, collapsible-vertical, horizontal
  11. val = val || $themeConfig.menu;
  12. store.toggleMenu(val);
  13. val = localStorage.getItem('layout'); // full, boxed-layout
  14. val = val || $themeConfig.layout;
  15. store.toggleLayout(val);
  16. val = localStorage.getItem('i18n_locale'); // en, da, de, el, es, fr, hu, it, ja, pl, pt, ru, sv, tr, zh
  17. val = val || $themeConfig.locale;
  18. const list = store.languageList;
  19. const item = list.find((item: any) => item.code === val);
  20. if (item) {
  21. this.toggleLanguage(item);
  22. }
  23. val = localStorage.getItem('rtlClass'); // rtl, ltr
  24. val = val || $themeConfig.rtlClass;
  25. store.toggleRTL(val);
  26. val = localStorage.getItem('animation'); // animate__fadeIn, animate__fadeInDown, animate__fadeInUp, animate__fadeInLeft, animate__fadeInRight, animate__slideInDown, animate__slideInLeft, animate__slideInRight, animate__zoomIn
  27. val = val || $themeConfig.animation;
  28. store.toggleAnimation(val);
  29. val = localStorage.getItem('navbar'); // navbar-sticky, navbar-floating, navbar-static
  30. val = val || $themeConfig.navbar;
  31. store.toggleNavbar(val);
  32. val = localStorage.getItem('semidark');
  33. val = val === 'true' ? true : $themeConfig.semidark;
  34. store.toggleSemidark(val);
  35. },
  36. toggleLanguage(item: any) {
  37. const store = useAppStore();
  38. let lang: any = null;
  39. if (item) {
  40. lang = item;
  41. } else {
  42. let code = store.locale || null;
  43. if (!code) {
  44. code = localStorage.getItem('i18n_locale');
  45. }
  46. item = store.languageList.find((d: any) => d.code === code);
  47. if (item) {
  48. lang = item;
  49. }
  50. }
  51. if (!lang) {
  52. lang = store.languageList.find((d: any) => d.code === 'en');
  53. }
  54. store.toggleLocale(lang.code);
  55. return lang;
  56. },
  57. changeAnimation(type = 'add') {
  58. const store = useAppStore();
  59. if (store.animation) {
  60. const eleanimation: any = document.querySelector('.animation');
  61. if (type === 'add') {
  62. eleanimation?.classList.add('animate__animated');
  63. eleanimation?.classList.add(store.animation);
  64. } else {
  65. eleanimation?.classList.remove('animate__animated');
  66. eleanimation?.classList.remove(store.animation);
  67. }
  68. }
  69. },
  70. };