Save

src/routes/index.vue

@@ -0,0 +1,101 @@
+<template>
+  <div
+    v-if="processStatus === true"
+    :class='[
+      "fixed","inset-0", "flex", "flex-col", "z-49",
+      "wrap-break-word", "items-center", "justify-center", "text-center",
+    ]'
+  >
+    <Progress />
+  </div>
+
+  <div
+    :class='[
+      "flex", "flex-col", "items-center",
+      "w-full", "h-full", "mt-2", "gap-3",
+    ]'
+    v-else
+  >
+    <h1 class="text-2xl font-bold">こんにちは、{{ me.username }}さん</h1>
+    
+    <div
+      class="flex flex-wrap gap-3"
+      id="followers"
+    >
+      <User
+        v-for="follower in followers"
+        :key="follower.id"
+        :meData="follower"
+        :hostname="hostname"
+        class="grow"
+      />
+    </div>
+    
+    <Progress v-if='processStatus === "async"' />
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { useHead } from "@vueuse/head";
+import Database, { getByIndex } from "@/lib/db";
+import useAPI from "@/lib/api";
+import { isSignin } from "@/lib/account";
+import { useRouter } from "vue-router";
+import { ref } from "vue";
+import Progress from "@/components/Progress.vue";
+import User from "@/components/User.vue";
+
+useHead({
+  title: "ホーム | Clean Follow uwuzu",
+});
+
+const db = new Database();
+const router = useRouter();
+
+const me = ref<any>();
+const followers = ref<any[]>([]);
+const processStatus = ref<boolean | "async">(false);
+const hostname = ref<string>("");
+
+(async () => {
+  processStatus.value = true;
+  
+  if (!await isSignin(db)) {
+    router.replace("/signin");
+    return;
+  }
+
+  const origin = await getByIndex(db.server, "name", "origin");
+  const token = await getByIndex(db.server, "name", "token");
+  if (!origin || !token) {
+    router.replace("/signin");
+    return;
+  }
+  
+  hostname.value = new window.URL(origin.value).hostname;
+
+  me.value = await useAPI(origin.value, "/me/", {
+    method: "POST",
+    cache: "no-store",
+    body: JSON.stringify({
+      token: token.value,
+    }),
+  });
+  
+  processStatus.value = "async";
+  for (const follower of me.value.follower) {
+    const user = await useAPI(origin.value, "/users/", {
+      method: "POST",
+      cache: "no-store",
+      body: JSON.stringify({
+        token: token.value,
+        userid: follower,
+      }),
+    });
+    
+    followers.value.push(user);
+  }
+  
+  processStatus.value = false;
+}) ();
+</script>