From 42b97f10aa4e4991f08d992efec1b41213c6b236 Mon Sep 17 00:00:00 2001
From: Jens Christian Aanestad <jenscaa@stud.ntnu.no>
Date: Mon, 22 Apr 2024 08:40:11 +0200
Subject: [PATCH] feat/Created the login link and sign up link components
---
src/App.vue | 2 +-
src/components/Configuration/ChallangeCheckBox.vue | 6 ++++++
src/components/Configuration/Configuration.vue | 4 ++--
.../{ProgressBar.vue => ConfigurationProgressBar.vue} | 0
src/components/Login/LoginForm.vue | 2 ++
src/components/Login/LoginLink.vue | 11 +++++++++++
src/components/SignUp/SignUpForm.vue | 2 ++
src/components/SignUp/SignUpLink.vue | 11 +++++++++++
8 files changed, 35 insertions(+), 3 deletions(-)
rename src/components/Configuration/{ProgressBar.vue => ConfigurationProgressBar.vue} (100%)
create mode 100644 src/components/Login/LoginLink.vue
create mode 100644 src/components/SignUp/SignUpLink.vue
diff --git a/src/App.vue b/src/App.vue
index dc693f4..12ad03a 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,6 +1,6 @@
<script setup lang="ts">
import { RouterView } from 'vue-router'
-// import ErrorBoundaryCatcher from '@/components/Exceptions/ErrorBoundaryCatcher.vue';
+import ErrorBoundaryCatcher from '@/components/Exceptions/ErrorBoundaryCatcher.vue';
</script>
<template>
diff --git a/src/components/Configuration/ChallangeCheckBox.vue b/src/components/Configuration/ChallangeCheckBox.vue
index 529a72e..2157aa3 100644
--- a/src/components/Configuration/ChallangeCheckBox.vue
+++ b/src/components/Configuration/ChallangeCheckBox.vue
@@ -16,6 +16,12 @@ const props = defineProps({
}
})
+/**
+ * This method is run whenever a change has occurred in the checkbox. It retrieves
+ * the current value of the checkbox (true/false) and emits a data object containing
+ * the challenge's description and the checked value.
+ * @param event The event object containing information about the input's checked value.
+ */
const onChallengeChanged = (event: any) => {
const value = event.target.checked
const data = [props.text, value]
diff --git a/src/components/Configuration/Configuration.vue b/src/components/Configuration/Configuration.vue
index 8398e67..a02e631 100644
--- a/src/components/Configuration/Configuration.vue
+++ b/src/components/Configuration/Configuration.vue
@@ -1,5 +1,5 @@
<script setup lang="ts">
-import ProgressBar from '@/components/Configuration/ProgressBar.vue'
+import ProgressBar from '@/components/Configuration/ConfigurationProgressBar.vue'
import { ref } from 'vue'
import { useRouter } from 'vue-router'
import { useRoute } from 'vue-router'
@@ -17,7 +17,7 @@ let currentRoute = useRoute()
let currentPath = currentRoute.fullPath
// Sets the current path to a new path and updates progressbar
-const onNewRouteEvent = (path) => {
+const onNewRouteEvent = (path: string) => {
currentPath = path
percentage.value = (1/length) * configurationSteps[path]
}
diff --git a/src/components/Configuration/ProgressBar.vue b/src/components/Configuration/ConfigurationProgressBar.vue
similarity index 100%
rename from src/components/Configuration/ProgressBar.vue
rename to src/components/Configuration/ConfigurationProgressBar.vue
diff --git a/src/components/Login/LoginForm.vue b/src/components/Login/LoginForm.vue
index 0d2476e..6091ab8 100644
--- a/src/components/Login/LoginForm.vue
+++ b/src/components/Login/LoginForm.vue
@@ -7,6 +7,7 @@ import { AuthenticationService, OpenAPI, LoginRequest } from '@/api';
import { useRouter, useRoute } from 'vue-router';
import handleUnknownError from '@/components/Exceptions/unkownErrorHandler';
import { useErrorStore } from '@/stores/ErrorStore';
+import SignUpLink from '@/components/SignUp/SignUpLink.vue'
const emailRef = ref('')
const passwordRef = ref('')
@@ -95,6 +96,7 @@ const handleSubmit = async () => {
<p class="text-danger">{{ errorMsg }}</p>
<button1 id="confirmButton" type="submit" @click="handleSubmit" button-text="Login"></button1>
+ <SignUpLink/>
</form>
</div>
</template>
diff --git a/src/components/Login/LoginLink.vue b/src/components/Login/LoginLink.vue
new file mode 100644
index 0000000..0f23a2e
--- /dev/null
+++ b/src/components/Login/LoginLink.vue
@@ -0,0 +1,11 @@
+<script setup lang="ts">
+
+</script>
+
+<template>
+ <p>Already have an account? <RouterLink to="/login">Login</RouterLink></p>
+</template>
+
+<style scoped>
+
+</style>
\ No newline at end of file
diff --git a/src/components/SignUp/SignUpForm.vue b/src/components/SignUp/SignUpForm.vue
index aefb991..dad760e 100644
--- a/src/components/SignUp/SignUpForm.vue
+++ b/src/components/SignUp/SignUpForm.vue
@@ -6,6 +6,7 @@ import { useRouter } from 'vue-router'
import { AuthenticationService } from '@/api'
import handleUnknownError from '@/components/Exceptions/unkownErrorHandler'
import { useUserInfoStore } from '@/stores/UserStore'
+import LoginLink from '@/components/Login/LoginLink.vue'
const router = useRouter();
const userStore = useUserInfoStore();
@@ -113,6 +114,7 @@ const handleSubmit = async () => {
<p class="text-danger">{{ errorMsg }}</p>
<p v-if="!samePasswords" class="text-danger">The passwords are not identical</p>
<button1 id="confirmButton" @click="handleSubmit" button-text="Sign up"></button1>
+ <LoginLink/>
</form>
</div>
diff --git a/src/components/SignUp/SignUpLink.vue b/src/components/SignUp/SignUpLink.vue
new file mode 100644
index 0000000..f7c354b
--- /dev/null
+++ b/src/components/SignUp/SignUpLink.vue
@@ -0,0 +1,11 @@
+<script setup lang="ts">
+
+</script>
+
+<template>
+ <p>Don't have an account? <RouterLink to="/sign-up">Sign up</RouterLink></p>
+</template>
+
+<style scoped>
+
+</style>
\ No newline at end of file
--
GitLab