<template>
  <el-config-provider :locale="locale">
    <RouterView />
  </el-config-provider>
</template>

<script setup lang="ts">
import { RouterView } from "vue-router"
import appStore from "@/stores"
import { themeConfigValue } from "@/core/helpers/config"
import { initializeComponents } from "@/core/plugins/keenthemes"
import zhCn from "element-plus/lib/locale/lang/zh-cn"
const locale = zhCn
const store = appStore.bodyConfigStore

onBeforeMount(() => {
  /**
   * Overrides the layout config using saved data from localStorage
   * remove this to use static config (@/core/config/DefaultLayoutConfig.ts)
   */
  store.overrideLayoutConfig()

  /**
   *  Sets a mode from configuration
   */
  store.setThemeMode(themeConfigValue.value)
})

onMounted(() => {
  nextTick(() => {
    initializeComponents()

    store.removeBodyClassName("page-loading")
  })
})
</script>

<style lang="scss">
@import "bootstrap-icons/font/bootstrap-icons.css";
@import "apexcharts/dist/apexcharts.css";
@import "quill/dist/quill.snow.css";
@import "animate.css";
@import "sweetalert2/dist/sweetalert2.css";
@import "nouislider/distribute/nouislider.css";
@import "@fortawesome/fontawesome-free/css/all.min.css";
@import "socicon/css/socicon.css";
@import "line-awesome/dist/line-awesome/css/line-awesome.css";
@import "dropzone/dist/dropzone.css";
@import "@vueform/multiselect/themes/default.css";
@import "prism-themes/themes/prism-shades-of-purple.css";
@import "element-plus/dist/index.css";

// Main demo style scss
@import "assets/fonticon/fonticon.css";
@import "assets/keenicons/duotone/style.css";
@import "assets/keenicons/outline/style.css";
@import "assets/keenicons/solid/style.css";
@import "assets/sass/element-ui.dark";
@import "assets/sass/plugins";
@import "assets/sass/style";

#app {
  display: contents;
}
</style>
