src/components/FormBottomBar.vue

@@ -1,9 +0,0 @@
-<template>
-  <div class="flex flex-col text-gray-400 text-sm mt-4 items-center">
-    <div class="flex flex-row gap-2 justify-center">
-      <a ref="https://jk-effects.com/privacy" target="_blank">Datenschutz</a>
-      <a ref="https://jk-effects.com/imprint" target="_blank">Impressum</a>
-    </div>
-    <a href="https://jk-effects.com" target="_blank"> &copy; Admin-Portal by JK Effects </a>
-  </div>
-</template>

src/components/TextCopy.vue

@@ -1,44 +0,0 @@
-<template>
-  <div class="flex relative">
-    <input type="text" :value="copyText" />
-    <ClipboardIcon
-      class="w-5 h-5 p-2 box-content absolute right-1 top-1/2 -translate-y-1/2 bg-white cursor-pointer"
-      @click="copyToClipboard"
-    />
-    <div v-if="copySuccess" class="absolute w-5 h-5 right-3 top-[10px]">
-      <SuccessCheckmark />
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { defineComponent } from "vue";
-import SuccessCheckmark from "@/components/SuccessCheckmark.vue";
-import { ClipboardIcon } from "@heroicons/vue/24/outline";
-</script>
-
-<script lang="ts">
-export default defineComponent({
-  props: {
-    copyText: {
-      type: String,
-      default: "",
-    },
-  },
-  data() {
-    return {
-      timeoutCopy: undefined as any,
-      copySuccess: false,
-    };
-  },
-  methods: {
-    copyToClipboard() {
-      navigator.clipboard.writeText(this.otp ?? "");
-      this.copySuccess = true;
-      this.timputCopy = setTimeout(() => {
-        this.copySuccess = false;
-      }, 2000);
-    },
-  },
-});
-</script>

src/router/index.ts

@@ -40,24 +40,6 @@ const router = createRouter({
         },
       ],
     },
-    {
-      path: "/reset",
-      name: "reset",
-      component: () => import("@/views/RouterView.vue"),
-      children: [
-        {
-          path: "",
-          name: "reset-start",
-          component: () => import("@/views/reset/Start.vue"),
-        },
-        {
-          path: "reset",
-          name: "reset-reset",
-          component: () => import("@/views/reset/Reset.vue"),
-          props: (route) => ({ mail: route.query.mail, token: route.query.token }),
-        },
-      ],
-    },
     {
       path: "/admin",
       name: "admin",

src/views/Login.vue

@@ -3,7 +3,7 @@
     <div class="max-w-md w-full space-y-8 pb-20">
       <div class="flex flex-col items-center gap-4">
         <img src="/FFW-Logo.svg" alt="LOGO" class="h-36" />
-        <h2 class="text-center text-4xl font-extrabold text-gray-900">Mitgliederverwaltung</h2>
+        <h2 class="text-center text-5xl font-extrabold text-gray-900">Mitgliederverwaltung</h2>
       </div>
 
       <form class="flex flex-col gap-2" @submit.prevent="login">
@@ -23,7 +23,6 @@
             />
           </div>
         </div>
-        <RouterLink :to="{ name: 'reset-start' }" class="w-fit self-end text-primary">TOTP verloren</RouterLink>
 
         <div class="flex flex-row gap-2">
           <button type="submit" primary :disabled="loginStatus == 'loading' || loginStatus == 'success'">
@@ -36,7 +35,13 @@
         <p v-if="loginError" class="text-center">{{ loginError }}</p>
       </form>
 
-      <FormBottomBar />
+      <div class="flex flex-col text-gray-400 text-sm mt-4 items-center">
+        <div class="flex flex-row gap-2 justify-center">
+          <a href="#">Datenschutz</a>
+          <a href="#">Impressum</a>
+        </div>
+        <a href="#"> &copy; Admin-Portal by JK Effects </a>
+      </div>
     </div>
   </div>
 </template>
@@ -47,7 +52,6 @@ import Spinner from "@/components/Spinner.vue";
 import SuccessCheckmark from "@/components/SuccessCheckmark.vue";
 import FailureXMark from "@/components/FailureXMark.vue";
 import { resetAllPiniaStores } from "@/helpers/piniaReset";
-import FormBottomBar from "@/components/FormBottomBar.vue";
 </script>
 
 <script lang="ts">

src/views/reset/Reset.vue

@@ -1,115 +0,0 @@
-<template>
-  <div class="grow flex items-center justify-center py-12 px-4 sm:px-6 lg:px-8">
-    <div class="max-w-md w-full space-y-8 pb-20">
-      <div class="flex flex-col items-center gap-4">
-        <img src="/FFW-Logo.svg" alt="LOGO" class="h-36" />
-        <h2 class="text-center text-4xl font-extrabold text-gray-900">TOTP zurücksetzen</h2>
-      </div>
-
-      <div v-if="verification == 'loading'" class="flex flex-col gap-2 items-center">
-        <p class="w-fit">Rücksetz-Link wird verifiziert</p>
-        <Spinner class="my-auto" />
-      </div>
-      <div v-else-if="verification == 'failed'" class="flex flex-col gap-2 items-center">
-        <p class="w-fit">Rücksetz-Link nicht gültig</p>
-        <RouterLink to="/reset" class="text-primary">Zum zurücksetzen Start</RouterLink>
-      </div>
-      <form v-else class="flex flex-col gap-2" @submit.prevent="reset">
-        <img :src="image" alt="totp" class="w-56 h-56 self-center" />
-
-        <TextCopy :copyText="otp" />
-
-        <div class="-space-y-px">
-          <div>
-            <input id="totp" name="totp" type="text" required placeholder="TOTP" />
-          </div>
-        </div>
-
-        <div class="flex flex-row gap-2">
-          <button type="submit" primary :disabled="resetStatus == 'loading' || resetStatus == 'success'">
-            TOTP zurücksetzen
-          </button>
-          <Spinner v-if="resetStatus == 'loading'" class="my-auto" />
-          <SuccessCheckmark v-else-if="resetStatus == 'success'" />
-          <FailureXMark v-else-if="resetStatus == 'failed'" />
-        </div>
-        <p v-if="resetError" class="text-center">{{ resetError }}</p>
-      </form>
-
-      <FormBottomBar />
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { defineComponent } from "vue";
-import Spinner from "@/components/Spinner.vue";
-import SuccessCheckmark from "@/components/SuccessCheckmark.vue";
-import FailureXMark from "@/components/FailureXMark.vue";
-import { RouterLink } from "vue-router";
-import { ClipboardIcon } from "@heroicons/vue/24/outline";
-import FormBottomBar from "@/components/FormBottomBar.vue";
-import TextCopy from "@/components/TextCopy.vue";
-</script>
-
-<script lang="ts">
-export default defineComponent({
-  props: {
-    token: String,
-    mail: String,
-  },
-  data() {
-    return {
-      verification: "loading" as "success" | "loading" | "failed",
-      image: undefined as undefined | string,
-      otp: undefined as undefined | string,
-      resetStatus: undefined as undefined | "loading" | "success" | "failed",
-      resetError: "" as string,
-    };
-  },
-  mounted() {
-    this.$http
-      .post(`/reset/verify`, {
-        token: this.token,
-        mail: this.mail,
-      })
-      .then((result) => {
-        setTimeout(() => {
-          this.verification = "success";
-          this.image = result.data.dataUrl;
-          this.otp = result.data.otp;
-        }, 1000);
-      })
-      .catch((err) => {
-        setTimeout(() => {
-          this.verification = "failed";
-        }, 1000);
-      });
-  },
-  methods: {
-    reset(e: any) {
-      let formData = e.target.elements;
-      this.resetStatus = "loading";
-      this.resetError = "";
-      this.$http
-        .put(`/reset`, {
-          token: this.token,
-          mail: this.mail,
-          totp: formData.totp.value,
-        })
-        .then((result) => {
-          this.resetStatus = "success";
-          localStorage.setItem("accessToken", result.data.accessToken);
-          localStorage.setItem("refreshToken", result.data.refreshToken);
-          setTimeout(() => {
-            this.$router.push(`/admin`);
-          }, 1000);
-        })
-        .catch((err) => {
-          this.resetStatus = "failed";
-          this.resetError = err.response.data;
-        });
-    },
-  },
-});
-</script>

src/views/reset/Start.vue

@@ -1,69 +0,0 @@
-<template>
-  <div class="grow flex items-center justify-center py-12 px-4 sm:px-6 lg:px-8">
-    <div class="max-w-md w-full space-y-8 pb-20">
-      <div class="flex flex-col items-center gap-4">
-        <img src="/FFW-Logo.svg" alt="LOGO" class="h-36" />
-        <h2 class="text-center text-4xl font-extrabold text-gray-900">TOTP zurücksetzen</h2>
-      </div>
-
-      <form class="flex flex-col gap-2" @submit.prevent="reset">
-        <div class="-space-y-px">
-          <div>
-            <input id="username" name="username" type="text" required placeholder="Benutzer" />
-          </div>
-        </div>
-        <RouterLink to="/" class="w-fit self-end text-primary">zum Login</RouterLink>
-
-        <div class="flex flex-row gap-2">
-          <button type="submit" primary :disabled="resetStatus == 'loading' || resetStatus == 'success'">
-            TOTP zurücksetzen
-          </button>
-          <Spinner v-if="resetStatus == 'loading'" class="my-auto" />
-          <SuccessCheckmark v-else-if="resetStatus == 'success'" />
-          <FailureXMark v-else-if="resetStatus == 'failed'" />
-        </div>
-        <p v-if="resetMessage" class="text-center">{{ resetMessage }}</p>
-      </form>
-
-      <FormBottomBar />
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { defineComponent } from "vue";
-import Spinner from "@/components/Spinner.vue";
-import SuccessCheckmark from "@/components/SuccessCheckmark.vue";
-import FailureXMark from "@/components/FailureXMark.vue";
-import FormBottomBar from "@/components/FormBottomBar.vue";
-</script>
-
-<script lang="ts">
-export default defineComponent({
-  data() {
-    return {
-      resetStatus: undefined as undefined | "loading" | "success" | "failed",
-      resetMessage: "" as string,
-    };
-  },
-  methods: {
-    reset(e: any) {
-      let formData = e.target.elements;
-      this.resetStatus = "loading";
-      this.resetMessage = "";
-      this.$http
-        .post(`/reset`, {
-          username: formData.username.value,
-        })
-        .then((result) => {
-          this.resetStatus = "success";
-          this.resetMessage = "Sie haben einen Verifizierungslink per Mail erhalten.";
-        })
-        .catch((err) => {
-          this.resetStatus = "failed";
-          this.resetMessage = err.response.data;
-        });
-    },
-  },
-});
-</script>

src/views/setup/Setup.vue

@@ -3,7 +3,7 @@
     <div class="max-w-md w-full space-y-8 pb-20">
       <div class="flex flex-col items-center gap-4">
         <img src="/FFW-Logo.svg" alt="LOGO" class="h-36" />
-        <h2 class="text-center text-4xl font-extrabold text-gray-900">Einrichtung</h2>
+        <h2 class="text-center text-5xl font-extrabold text-gray-900">Einrichtung</h2>
       </div>
 
       <form class="flex flex-col gap-2" @submit.prevent="setup">
@@ -33,7 +33,13 @@
         <p v-if="setupMessage" class="text-center">{{ setupMessage }}</p>
       </form>
 
-      <FormBottomBar />
+      <div class="flex flex-col text-gray-400 text-sm mt-4 items-center">
+        <div class="flex flex-row gap-2 justify-center">
+          <a href="#">Datenschutz</a>
+          <a href="#">Impressum</a>
+        </div>
+        <a href="#"> &copy; Admin-Portal by JK Effects </a>
+      </div>
     </div>
   </div>
 </template>
@@ -43,7 +49,6 @@ import { defineComponent } from "vue";
 import Spinner from "@/components/Spinner.vue";
 import SuccessCheckmark from "@/components/SuccessCheckmark.vue";
 import FailureXMark from "@/components/FailureXMark.vue";
-import FormBottomBar from "@/components/FormBottomBar.vue";
 </script>
 
 <script lang="ts">

src/views/setup/Verify.vue

@@ -3,7 +3,7 @@
     <div class="max-w-md w-full space-y-8 pb-20">
       <div class="flex flex-col items-center gap-4">
         <img src="/FFW-Logo.svg" alt="LOGO" class="h-36" />
-        <h2 class="text-center text-4xl font-extrabold text-gray-900">Einrichtung</h2>
+        <h2 class="text-center text-5xl font-extrabold text-gray-900">Einrichtung</h2>
       </div>
 
       <div v-if="verification == 'loading'" class="flex flex-col gap-2 items-center">
@@ -46,7 +46,13 @@
         <RouterLink to="/setup" class="text-primary self-end">Zum Einrichtungsstart</RouterLink>
       </form>
 
-      <FormBottomBar />
+      <div class="flex flex-col text-gray-400 text-sm mt-4 items-center">
+        <div class="flex flex-row gap-2 justify-center">
+          <a href="#">Datenschutz</a>
+          <a href="#">Impressum</a>
+        </div>
+        <a href="#"> &copy; Admin-Portal by JK Effects </a>
+      </div>
     </div>
   </div>
 </template>
@@ -58,7 +64,6 @@ import SuccessCheckmark from "@/components/SuccessCheckmark.vue";
 import FailureXMark from "@/components/FailureXMark.vue";
 import { RouterLink } from "vue-router";
 import { ClipboardIcon } from "@heroicons/vue/24/outline";
-import FormBottomBar from "@/components/FormBottomBar.vue";
 </script>
 
 <script lang="ts">