feat: CreateCandidateModal input validation

frontend/src/lib/components/admin/modal/CreateCandidateModal.svelte

@@ -1,16 +1,22 @@
 <script lang="ts">
 	import type { ApiError } from '$lib/@api';
 	import { apiCreateCandidate } from '$lib/@api/admin';
+	import SelectField from '$lib/components/select/SelectField.svelte';
+	import TextField from '$lib/components/textfield/TextField.svelte';
 	import type { CreateCandidate, CreateCandidateLogin } from '$lib/stores/candidate';
+	import { isPersonalIdNumberValid } from '$lib/utils/personalIdFormat';
 	import { createEventDispatcher } from 'svelte';
 	import Modal from '../../Modal.svelte';
 	import IdField from '../../textfield/IdField.svelte';
 	import NumberField from '../../textfield/NumberField.svelte';
+	import { SvelteToast, toast } from '@zerodevx/svelte-toast';
 
 	let isOpened = true;
 
 	let applicationId: string = '';
+	let citizenship: string = '';
 	let personalId: string = '';
+	let field: 'GYM' | 'IT' | 'KB' | 'Ev. č. nezadáno';
 
 	let login: CreateCandidateLogin;
 
@@ -18,13 +24,58 @@
 
 	const dispatch = createEventDispatcher();
 
+	$: {
+		let prefix = applicationId.slice(0, 3);
+		if (Number(prefix) === 101) {
+			field = 'GYM';
+		} else if (Number(prefix) === 102) {
+			field = 'IT';
+		} else if (Number(prefix) === 103) {
+			field = 'KB';
+		} else {
+			field = 'Ev. č. nezadáno';
+		}
+	}
+
 	const createCandidate = async () => {
+		if (applicationId.length < 6) {
+			toast.push('Ev. číslo musí mít minimálně 6 znaků', {
+				theme: {
+					'--toastColor': 'mintcream',
+					'--toastBackground': '#b91c1c',
+					'--toastBarBackground': '#7f1d1d'
+				}
+			});
+			return;
+		}
+		if (citizenship === 'Česká republika') {
+			if (!isPersonalIdNumberValid(personalId)) {
+				toast.push('Rodné číslo neodpovídá oficiální specifikaci či datumu narození', {
+					theme: {
+						'--toastColor': 'mintcream',
+						'--toastBackground': '#b91c1c',
+						'--toastBarBackground': '#7f1d1d'
+					}
+				});
+				return;
+			}
+		}
 		const data: CreateCandidate = {
 			applicationId: Number(applicationId),
 			personalIdNumber: personalId
 		};
 		try {
 			login = await apiCreateCandidate(data);
+			toast.push(
+				`Uživatel ${data.applicationId} s rodným číslem ${data.personalIdNumber} byl vytvořen!`,
+				{
+					theme: {
+						'--toastColor': 'mintcream',
+						'--toastBackground': '#047857',
+						'--toastBarBackground': '#064e3b'
+					}
+				}
+			);
 			dispatch('created');
 			error = '';
 		} catch (e: unknown) {
@@ -40,11 +91,18 @@
 </script>
 
 {#if isOpened}
+	<SvelteToast />
 	<Modal on:close={close}>
 		<div class="p-20">
 			{#if login}
-				<h1 class="text-sspsBlue text-3xl font-semibold">{applicationId}</h1>
-				<h1 class="text-sspsBlue text-3xl font-semibold">{login.password}</h1>
+				<h1 class="text-sspsBlue text-3xl font-semibold">Ev. č.: {applicationId}</h1>
+				<h1 class="text-sspsBlue text-3xl font-semibold">R. č.: {login.personalIdNumber}</h1>
+				<h1 class="text-sspsBlue text-3xl font-semibold">Heslo: {login.password}</h1>
+				{#if login.applications.length > 1}
+					<h1 class="text-sspsBlue text-3xl font-semibold">
+						Slinkovaný s {login.applications.filter((a) => a != applicationId)}
+					</h1>
+				{/if}
 			{:else}
 				<h1 class="text-sspsBlue text-3xl font-semibold">Registrace nového uchazeče</h1>
 				{#if error}
@@ -55,10 +113,28 @@
 						<span class="block sm:inline">{error}</span>
 					</div>
 				{/if}
-				<h3 class="my-4">Evidenčni číslo přihlášky</h3>
-				<NumberField bind:value={applicationId} />
-				<h3 class="my-4">Rodné číslo</h3>
-				<IdField bind:value={personalId} />
+				<div>
+					<h3 class="my-4">Evidenční číslo přihlášky (
+						<span class="font-bold">{`Obor: ${field}`}</span>)
+					</h3>
+					<NumberField bind:value={applicationId} />
+				</div>
+				<div>
+					<h3 class="my-4">Občanství</h3>
+					<SelectField
+						bind:value={citizenship}
+						placeholder="Občanství"
+						options={['Česká republika', 'Slovenská republika', 'Ukrajina', 'Jiné']}
+					/>
+					<h3 class="my-4">Rodné číslo</h3>
+				</div>
+				<div>
+					{#if citizenship === 'Česká republika'}
+						<IdField bind:value={personalId} />
+					{:else}
+						<TextField bind:value={personalId} />
+					{/if}
+				</div>
 				<input
 					on:click={createCandidate}
 					class="bg-sspsBlue hover:bg-sspsBlueDark mt-6 w-full rounded-lg p-3 text-xl font-semibold text-white transition-colors duration-300"

frontend/src/lib/stores/candidate.ts

@@ -61,6 +61,8 @@ export interface BaseCandidate {
 }
 
 export interface CreateCandidateLogin extends CreateCandidate {
+	applications: [];
+	fieldOfStudy: string;
 	password: string;
 }