<script setup lang="ts">
import { onMounted } from 'vue';
import { useRouter, useRoute } from 'vue-router';
import useI18n from '@/hooks/useI18n';
import useAppStore from '@/store/modules/app';
const router = useRouter();
const route = useRoute();
const appStore = useAppStore();
const { t } = useI18n();

/**
 * 国际化翻译转换
 */
function fnLocale() {
  let title = route.meta.title as string;
  if (title.indexOf('router.') !== -1) {
    title = t(title);
  }
  appStore.setTitle(title);
}

onMounted(() => {
  fnLocale();
});
</script>

<template>
  <a-result
    status="403"
    :title="t('views.error.err403.ttile')"
    :sub-title="t('views.error.err403.subTitle')"
  >
    <template #extra>
      <RouterLink :to="{ name: 'Index' }" :replace="true">
        <a-button type="primary">
          {{ t('views.error.err403.backHome') }}
        </a-button>
      </RouterLink>
      <a-button type="default" @click="() => router.back()">
        {{ t('views.error.err403.back') }}
      </a-button>
    </template>
  </a-result>
</template>

<style lang="less" scoped></style>
