feat: switch to spa

polylan_submitter/src/layout/AppHeader.vue

@@ -1,30 +1,29 @@
 <script setup lang="ts">
 import { computed } from "vue";
-import { useRoute } from "vue-router";
+import { useRoute, useRouter } from "vue-router";
 import { useI18n } from "vue-i18n";
 import { storeToRefs } from "pinia";
 import { useUserStore } from "@/stores/user";
-import { bootstrap } from "@/bootstrap";
+import { usePageHeaderStore } from "@/stores/pageHeader";
 
 const route = useRoute();
+const router = useRouter();
 const { t } = useI18n();
 const userStore = useUserStore();
 const { userInfo } = storeToRefs(userStore);
+const pageHeaderStore = usePageHeaderStore();
+const { title: dynamicTitle } = storeToRefs(pageHeaderStore);
 
 const title = computed(() => {
+  if (dynamicTitle.value) return dynamicTitle.value;
   const key = route.meta.titleKey;
-  if (!key) return t("common.appName");
-  return t(key, {
-    game: (bootstrap.gameName as string) ?? "",
-    scope: (bootstrap.scopeName as string) ?? "",
-  });
+  return key ? t(key) : t("common.appName");
 });
 
-const backPath = computed(() => route.meta.getBackPath?.(route));
-
 const goBack = () => {
-  if (backPath.value) {
-    window.location.href = backPath.value;
+  const backRoute = route.meta.getBackRoute?.(route);
+  if (backRoute) {
+    router.push(backRoute);
   }
 };
 </script>
@@ -32,7 +31,7 @@ const goBack = () => {
 <template>
   <div class="navbar bg-base-100 shadow-lg">
     <div class="container min-w-3/4 mx-auto w-full flex items-center gap-4">
-      <button v-if="backPath" @click="goBack" class="btn btn-primary btn-sm">
+      <button v-if="route.meta.getBackRoute" @click="goBack" class="btn btn-primary btn-sm">
         <i class="mdi mdi-arrow-left"></i>
         {{ t("common.back") }}
       </button>