feat: login, basic admin dashboard

frontend/src/lib/stores/candidate.ts

@@ -19,10 +19,10 @@ export interface CandidateData {
 }
 
 export interface CandidatePreview {
-	applicationId: number;
-	name: string;
-	surname: string;
-	study: string;
+	applicationId?: number;
+	name?: string;
+	surname?: string;
+	study?: string;
 }
 
 export interface CandidateLogin {

frontend/src/routes/(admin)/admin/(authenticated)/dashboard/+page.svelte

@@ -0,0 +1,61 @@
+<script lang="ts">
+	import { apiFetchCandidate, apiListCandidates } from "$lib/@api/admin";
+	import type { CandidatePreview } from "$lib/stores/candidate";
+
+
+    let candidates: [CandidatePreview] = [{}];
+    let candidateDetails: { [id: number] : CandidatePreview } = {};
+    let currentCandidateId: number = 0;
+
+    getCandidates();
+
+    async function getCandidates() {
+        try {
+            candidates = await apiListCandidates();
+        } catch {
+            console.log("error");
+        }
+    }
+
+    async function getCandidateDetails(id: number) {
+        currentCandidateId = id;
+        candidateDetails[id] = await apiFetchCandidate(id);
+    }
+</script>
+<div>
+    <div class="flex flex-row">
+        <div class="list">
+            {#each candidates as candidate}
+                <div class="candidatePreview flex flex-row">
+                    <h1 class="ml-5 text-2xl font-bold self-center">{candidate.applicationId}</h1>
+                    <div class="flex flex-col ml-12 mt-4">
+                        <h3 class="text-lg font-bold">{candidate.name} {candidate.surname?.toUpperCase()}</h3>
+                        <div class="relative">
+                            <h3 class="text-lg absolute right-0">Obor: {candidate.study}</h3>
+                        </div>
+                    </div>
+                </div>
+            {/each}
+        </div>
+        <div class="detail">
+            <h1>Details here</h1>
+        </div>
+    </div>
+</div>
+
+<style>
+    .list {
+        @apply h-[100vh] w-96;
+        @apply overflow-scroll float-left;
+    }
+
+    .detail {
+        @apply h-[100vh] w-[calc(100vw-96px)] bg-yellow-300;
+        @apply float-left overflow-hidden;
+    }
+    
+    .candidatePreview {
+        @apply h-20 w-full bg-gray-200 rounded-xl mt-5;
+        @apply hover:cursor-pointer;
+    }
+</style>

frontend/src/routes/(admin)/admin/auth/login/+page.svelte

@@ -5,9 +5,20 @@
 
 	import background from '$lib/assets/background2.jpg';
 	import Lock from '$lib/components/icons/Lock.svelte';
+	import { apiLogin } from '$lib/@api/admin';
+	import { goto } from '$app/navigation';
 
 	let adminIdValue = '';
 	let adminPasswordValue = '';
+
+	const login = async () => {
+		try {
+			await apiLogin({adminId: Number(adminIdValue), password: adminPasswordValue});
+			goto("/admin/dashboard");
+		} catch (e) {
+			console.log(e);
+		}
+	};
 </script>
 
 <SplitLayout backgroundImage={background} backgroundPosition="30%">
@@ -37,6 +48,7 @@
 			class="bg-sspsBlue hover:bg-sspsBlueDark mt-8 w-3/5 rounded-lg p-3 text-xl font-semibold text-white transition-colors duration-300"
 			type="submit"
 			value="Odeslat"
+			on:click={login}
 		/>
 	</div>
 </SplitLayout>