<template>

  <!-- 加载应用 -->
  <template v-if="!loading">
    <app-header />
    <slot />
    <app-footer />
  </template>

  <!-- 异常状态 -->
  <UnderMaintenance v-if="loading" />

</template>
<script setup lang="ts">
  import {useServerRequest} from "~/composables/useServerRequest";
  import type {ApiResult} from "~/api";
  import type {Domain} from "~/api/cms/domain/model";
  import {useConfigInfo, useForm, useMenu, useSubMenu, useWebsite} from "~/composables/configState";
  import type {Website} from "~/api/cms/website/model";
  import type {Navigation} from "~/api/cms/navigation/model";
  import type {Config} from "~/types/global";
  import {getLoacl, getPath, setLocal} from "~/utils/common";
  import UnderMaintenance from "~/components/UnderMaintenance.vue";

  // 加载状态
  const loading = ref<boolean>(false)
  const website = useWebsite()
  const config = useConfigInfo();
  const menu = useMenu()
  const subMenu = useSubMenu()

  // 挂载钩子
  onMounted(() => {
    //必须在onMounted的时候才能用local和window
    // getLoacl();
    window.onbeforeunload = () => {
      //离开页面时保存数据，由于可能突发情况，所以重要数据请手动调用setLocal函数
      // setLocal(); //如果需要调试本地存储数据，记得把这个注释一下
    };
  });

  // 加载数据
  const reload = async () => {
    // const loading = ElLoading.service({
    //   lock: true,
    //   text: 'Loading'
    // })

    // TODO 1 查询当前域名是否有绑定域名,绑定则解构出租户ID放入缓存
    const domain = window.location.hostname;
    if(domain !== 'localhost'){
      // 生产环境生效
      const runtimeConfig = useRuntimeConfig();
      const {data: domainInfo } = await useServerRequest<ApiResult<Domain>>('/cms/domain/getByDomain',{query: {
        domain
        }});
      const data = domainInfo.value?.data;
      if (data) {
        localStorage.setItem('TID_DOMAIN',`${data?.tenantId}`)
      }else {
        website.value.statusIcon = 'error';
        website.value.statusName = '未开通';
        website.value.statusUrl = 'https://websoft.top'
        website.value.statusBtnText = '去开通';
        website.value.statusText = '请在后台开通产品并绑定域名';
        loading.value = true;
        return ;
      }
    }

    // TODO 2 读取服务器缓存数据
    const {data: websiteInfo } = await useServerRequest<ApiResult<Website>>('/cms/website/getSiteInfo');
    if(!websiteInfo.value){
      ElMessage.error('require is not defined.')
      return false;
    }
    if(websiteInfo.value?.data){
      website.value = websiteInfo.value?.data;
    }

    // TODO 4 读取网站状态
    const {data: websiteRealTime } = await useServerRequest<ApiResult<Website>>('/cms/website/' + website.value.websiteId);
    website.value = Object.assign({},website.value,websiteRealTime.value?.data)
    if (website.value?.status != 1) {
      useHead({title: ''})
      loading.value = true;
      return false;
    }

    // TODO 5 读取网站配置信息
    const { data: fields } = await useServerRequest<ApiResult<Config>>('/cms/website-field/config', {});
    if (fields.value?.data) {
      config.value = fields.value?.data;
    }

    // TODO 6 获取网站顶部菜单
    const { data: menuInfo } = await useServerRequest<ApiResult<Navigation[]>>('/cms/navigation/tree', {
      query: {
        top: 0
      }
    });
    if(menuInfo.value?.data){
      menu.value = menuInfo.value?.data
    }

    // TODO 7 获取网站底部菜单
    const { data: subMenuInfo } = await useServerRequest<ApiResult<Navigation[]>>('/cms/navigation/tree', {
      query: {
        bottom: 0
      }
    });
    if(subMenuInfo.value?.data){
      subMenu.value = subMenuInfo.value?.data
    }

    // TODO 8 获取当前页面的导航信息
    // const { data: navInfo } = await useServerRequest<ApiResult<Navigation>>('/cms/navigation/getNavigationByPath', {
    //   query: {
    //     path: getPath()
    //   }
    // });
    // if(navInfo.value?.data){
    //   form.value = navInfo.value?.data
    // }

    // TODO 9 配置SEO
    // useHead({
    //   title: `首页 - ${website.value?.websiteName}`,
    //   meta: [{ name: website.value.keywords, content: website.value.comments }]
    // });
  }

  reload()
</script>
