organize files

src/pages/graduation/GenerateQR.vue

@@ -2,6 +2,7 @@
 import QRCode from "qrcode"
 import { v4 as uuid } from "uuid"
 import { ref, onMounted, watch } from "vue"
+import { useGraduationIdURL } from "./graduation"
 
 const id = ref<string>()
 const idStoreKey = "graduationId"
@@ -10,11 +11,12 @@ const setId = () => {
   localStorage.setItem(idStoreKey, id.value)
 }
 
-const url = ref<string>()
 const svg = ref()
 watch(id, async () => {
-  svg.value = await QRCode.toString(`https://nbtca.space/graduation/download/${id.value}`, { type: "svg" })
-  url.value = await QRCode.toDataURL(`https://nbtca.space/graduation/download/${id.value}`)
+  if (!id.value) {
+    return
+  }
+  svg.value = await QRCode.toString(useGraduationIdURL().constructURL(id.value))
 })
 
 onMounted(() => {

src/pages/graduation/GraduationDownloadView.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { onMounted, ref } from "vue"
+import { useGraduationIdURL } from "./graduation"
 
 const id = ref<string>()
 
@@ -22,7 +23,7 @@ const setStatus = async () => {
 }
 
 onMounted(() => {
-  id.value = new URLSearchParams(window.location.search).get("id")
+  id.value = useGraduationIdURL().getId()
   setStatus()
 })
 </script>

src/pages/graduation/download.astro

@@ -1,8 +1,8 @@
 ---
 import BaseLayout from "../../layouts/BaseLayout.astro"
-import GraduationView from "../../components/GraduationView.vue"
+import GraduationDownloadView from "./GraduationDownloadView.vue"
 
 ---
   <BaseLayout>
-    <GraduationView client:load></GraduationView>
+    <GraduationDownloadView client:load></GraduationDownloadView>
   </BaseLayout>

src/pages/graduation/graduation.ts

@@ -0,0 +1,20 @@
+import { SITE_URL } from "../../consts"
+
+export const useGraduationIdURL = () => {
+  const idKey = "id"
+
+  const getId = () => {
+    return new URLSearchParams(window.location.search).get(idKey) as string | undefined
+  }
+
+  const constructURL = (id: string) => {
+    const url = new URL(`/graduation/download`, SITE_URL)
+    url.searchParams.append(idKey, id)
+    return url.toString()
+  }
+
+  return {
+    getId,
+    constructURL,
+  }
+}