summaryrefslogtreecommitdiff
path: root/frontend/pages
diff options
context:
space:
mode:
authorSanto Cariotti <santo@dcariotti.me>2025-04-03 21:47:18 +0200
committerSanto Cariotti <santo@dcariotti.me>2025-04-03 21:47:18 +0200
commit400a81fdae4ea1ff2263024a7cd0618fc31076ca (patch)
tree77b4a41084af4330c5d002785936f56bb46528fb /frontend/pages
parent0d987f5c97cc8c0e205193ef8c67745ac981d5bf (diff)
Use TUI instead of Web
Diffstat (limited to 'frontend/pages')
-rw-r--r--frontend/pages/index.vue7
-rw-r--r--frontend/pages/login.vue129
-rw-r--r--frontend/pages/register.vue128
3 files changed, 0 insertions, 264 deletions
diff --git a/frontend/pages/index.vue b/frontend/pages/index.vue
deleted file mode 100644
index 110db25..0000000
--- a/frontend/pages/index.vue
+++ /dev/null
@@ -1,7 +0,0 @@
-<script setup lang="ts"></script>
-
-<template>
- <div>
- <h1>Hello</h1>
- </div>
-</template>
diff --git a/frontend/pages/login.vue b/frontend/pages/login.vue
deleted file mode 100644
index 5fdb689..0000000
--- a/frontend/pages/login.vue
+++ /dev/null
@@ -1,129 +0,0 @@
-<template>
- <div
- class="flex min-h-screen items-center justify-center px-4 py-12 sm:px-6 lg:px-8"
- >
- <UCard class="w-full max-w-md bg-gray-900">
- <div class="flex flex-col items-center">
- <h1
- class="text-center text-2xl font-bold tracking-tight text-white"
- >
- Sign in to your account
- </h1>
- <p class="mt-2 text-center text-sm text-gray-200">
- Or
- <NuxtLink
- to="/register"
- class="font-medium text-primary hover:text-primary-dark underline"
- >
- create a new account
- </NuxtLink>
- </p>
- </div>
-
- <div class="mt-8">
- <form
- @submit.prevent="handleSubmit"
- class="space-y-6"
- method="POST"
- >
- <UFormField label="Username" name="username">
- <UInput
- v-model="username"
- name="username"
- autocomplete="username"
- required
- placeholder="mario.rossi"
- class="w-full"
- />
- </UFormField>
-
- <UFormField label="Password" name="password">
- <UInput
- v-model="password"
- type="password"
- name="password"
- autocomplete="current-password"
- required
- placeholder="*****"
- class="w-full"
- />
- </UFormField>
-
- <div>
- <UButton
- type="submit"
- block
- :loading="isLoading"
- color="primary"
- variant="solid"
- class="cursor-pointer"
- >
- Sign in
- </UButton>
- </div>
- </form>
- </div>
- </UCard>
- </div>
-</template>
-
-<script setup>
-const username = ref("");
-const password = ref("");
-const error = ref("");
-const isLoading = ref(false);
-
-const toast = useToast();
-
-const config = useRuntimeConfig();
-
-const handleSubmit = async (event) => {
- event.preventDefault();
-
- try {
- error.value = null;
- isLoading.value = true;
- await fetch(`${config.public.apiBase}/auth/login`, {
- method: "POST",
- headers: {
- "Content-Type": "application/json",
- },
- body: JSON.stringify({
- username: username.value,
- password: password.value,
- }),
- }).then(async (response) => {
- const body = await response.json();
- if (response.status != 200) {
- toast.add({
- title: "Login Failed",
- description: body.error,
- color: "error",
- });
- } else {
- toast.add({
- title: "Login Successful",
- description: "You have been successfully logged in",
- color: "success",
- });
-
- localStorage.setItem("token", body.token);
- setTimeout(() => {
- window.location.href = "/play";
- }, 1000);
- }
- });
- } catch (err) {
- error.value =
- err.response?.data?.message || "An error occurred during login";
-
- toast.add({
- title: "Login Failed",
- description: error.value,
- color: "error",
- });
- } finally {
- isLoading.value = false;
- }
-};
-</script>
diff --git a/frontend/pages/register.vue b/frontend/pages/register.vue
deleted file mode 100644
index 824b53b..0000000
--- a/frontend/pages/register.vue
+++ /dev/null
@@ -1,128 +0,0 @@
-<template>
- <div
- class="flex min-h-screen items-center justify-center px-4 py-12 sm:px-6 lg:px-8"
- >
- <UCard class="w-full max-w-md bg-gray-900">
- <div class="flex flex-col items-center">
- <h1
- class="text-center text-2xl font-bold tracking-tight text-white"
- >
- Create a new account
- </h1>
- <p class="mt-2 text-center text-sm text-gray-200">
- Or
- <NuxtLink
- to="/login"
- class="font-medium text-primary hover:text-primary-dark underline"
- >
- sign in to your account
- </NuxtLink>
- </p>
- </div>
-
- <div class="mt-8">
- <form
- @submit.prevent="handleSubmit"
- class="space-y-6"
- method="POST"
- >
- <UFormField label="Username" name="username">
- <UInput
- v-model="username"
- name="username"
- autocomplete="username"
- required
- placeholder="mario.rossi"
- class="w-full"
- />
- </UFormField>
-
- <UFormField label="Password" name="password">
- <UInput
- v-model="password"
- type="password"
- name="password"
- autocomplete="current-password"
- required
- placeholder="*****"
- class="w-full"
- />
- </UFormField>
-
- <div>
- <UButton
- type="submit"
- block
- :loading="isLoading"
- color="primary"
- variant="solid"
- class="cursor-pointer"
- >
- Sign up
- </UButton>
- </div>
- </form>
- </div>
- </UCard>
- </div>
-</template>
-
-<script setup>
-const username = ref("");
-const password = ref("");
-const error = ref("");
-const isLoading = ref(false);
-
-const toast = useToast();
-
-const config = useRuntimeConfig();
-
-const handleSubmit = async (event) => {
- event.preventDefault();
-
- try {
- error.value = null;
- isLoading.value = true;
- await fetch(`${config.public.apiBase}/auth/register`, {
- method: "POST",
- headers: {
- "Content-Type": "application/json",
- },
- body: JSON.stringify({
- username: username.value,
- password: password.value,
- }),
- }).then(async (response) => {
- const body = await response.json();
- if (response.status != 200) {
- toast.add({
- title: "Login Failed",
- description: body.error,
- color: "error",
- });
- } else {
- toast.add({
- title: "Register Successful",
- description: "You have been successfully signed up",
- color: "success",
- });
- localStorage.setItem("token", body.token);
- setTimeout(() => {
- window.location.href = "/play";
- }, 1000);
- }
- });
- } catch (err) {
- error.value =
- err.response?.data?.message || "An error occurred during login";
-
- toast.add({
- title: "Login Failed",
- description: error.value,
- color: "error",
- });
- } finally {
- isLoading.value = false;
- }
-};
-</script>