<template>
  <a-config-provider
    :locale="zhCN"
    :theme="{
      token: {
        colorPrimary: '#bd4b36',
      },
    }"
  >
    <NuxtLoadingIndicator />
    <NavBar v-if="showNavAndFooter" />
    <main>
      <NuxtPage />
    </main>
    <Footer v-if="showNavAndFooter" />
  </a-config-provider>
</template>

<script setup lang="ts">
import { onMounted, watch } from 'vue';
import { RouterView, useRoute } from 'vue-router'
import NavBar from './components/NavBar.vue';
import Footer from './components/Footer.vue';
import { useAuthStore } from './stores/auth';
import zhCN from 'ant-design-vue/es/locale/zh_CN';
import VueAMap, {initAMapApiLoader} from '@vuemap/vue-amap';
import { registryConvert } from './common/ConvertRgeistry'
import { registerAllFormComponents } from './components/dynamicf';

const showNavAndFooter = computed(() => {
  return route.path !== '/exportToAiIch';
});

if (import.meta.client) {
  initAMapApiLoader({
    key: '212b86dc49a5116a34e945d31da7ad14',
    securityJsCode: '46cae8205a707cfaf5801abcc4301566',
  });
  registerAllFormComponents();
} 
registryConvert();

const authStore = useAuthStore();

onMounted(() => {
  if (import.meta.server)
    return;
  authStore.loadLoginState();
});

const route = useRoute();

watch(route, () => {
  window.scrollTo({
    top: 0,
    behavior: 'instant'
  })
});
</script>

<style>
@import "bootstrap/dist/css/bootstrap.css";
@import "bootstrap/dist/css/bootstrap-grid.css";
@import "bootstrap/dist/css/bootstrap-utilities.css";
@import "./assets/scss/main.scss";
@import "vue3-carousel/carousel.css";
@import "@vuemap/vue-amap/dist/style.css";
@import "@imengyu/vue-scroll-rect/lib/vue-scroll-rect.css";
</style>