feat: personalIdError Modal with tech support contact

This commit is contained in:
Sebastian Pravda 2023-02-02 19:45:28 +01:00
parent 50985f47ae
commit 049fb88220
No known key found for this signature in database
GPG key ID: F3BC84F08EFA3F57
2 changed files with 61 additions and 5 deletions

View file

@ -0,0 +1,43 @@
<script lang="ts">
import { createEventDispatcher } from 'svelte';
import Modal from '../Modal.svelte';
import { SvelteToast, toast } from '@zerodevx/svelte-toast';
let isOpened = true;
export let personalIdNumber: string;
const dispatch = createEventDispatcher();
const close = () => {
isOpened = false;
dispatch('close');
};
</script>
{#if isOpened}
<SvelteToast />
<Modal on:close={close}>
<div class="w-[60vw] h-[40vh] flex flex-col items-center relative">
<div>
<h1 class="mt-6 text-4xl text-center text-sspsBlueDark font-bold">
Vaše rodné číslo <span class="underline">není</span>
'{personalIdNumber}'?
</h1>
<h3 class="text-center mt-4"
>Znamená to, že jsme udělali chybu v přepisu přihlášky.
</h3>
<h2 class="font-bold text-2xl text-center text-sspsBlueDark mt-12">
Kontaktujte nás na telefonu +420 123 456 789,
</h2>
<h3 class="text-center mt-2">
nebo nám napište na email na
<a href="mailto:portfolio@ssps.cz " class="underline"> portfolio@ssps.cz </a>
</h3>
<h4 class="text-center absolute bottom-4 left-0 w-full">Omlouváme se za komplikace s přijímacím řízením SSPŠaG</h4>
</div>
</div>
</Modal>
{/if}
<style lang="postcss">
</style>

View file

@ -26,6 +26,7 @@
import SchoolSelect from '$lib/components/select/SchoolSelect/SchoolSelect.svelte';
import PersonalIdConfirmCheckBox from '$lib/components/checkbox/PersonalIdConfirmCheckBox.svelte';
import { isPersonalIdNumberWithBirthdateValid } from '$lib/utils/personalIdFormat';
import PersonalIdErrorModal from '$lib/components/modal/PersonalIdErrorModal.svelte';
let pageIndex = 0;
let pagesFilled = [false, false, false, false, false, false, false, false];
@ -203,7 +204,11 @@
// TODO: https://github.com/tjinauyeung/svelte-forms-lib/issues/171!! (Zatím tenhle mega typ)
$: typedErrors = errors as unknown as Writable<FormErrorType>;
$: console.log($typedErrors);
let visibleModals = {
personalIdModal: false,
linkErrorModal: false
};
const onSubmit = async (values: CandidateData) => {
if (pageIndex === 3) {
if (values.candidate.citizenship === 'Česká republika') {
@ -285,11 +290,13 @@
switch (index) {
case 0:
if ($typedErrors['personalIdOk'] || $typedErrors['personalIdErr']) {
visibleModals.personalIdModal = true;
return true;
}
break;
case 1:
if ($typedErrors['linkOk'] || $typedErrors['linkError']) {
visibleModals.linkErrorModal = true;
return true;
}
break;
@ -351,10 +358,10 @@
case 7:
// @ts-ignore
if (
$typedErrors['candidate']['firstSchool']['name'] ||
$typedErrors['candidate']['firstSchool']['field'] ||
$typedErrors['candidate']['secondSchool']['name'] ||
$typedErrors['candidate']['secondSchool']['field']
$typedErrors['candidate']['firstSchool']['name'] ||
$typedErrors['candidate']['firstSchool']['field'] ||
$typedErrors['candidate']['secondSchool']['name'] ||
$typedErrors['candidate']['secondSchool']['field']
) {
return true;
}
@ -422,6 +429,12 @@
<SplitLayout>
<SvelteToast />
{#if visibleModals.personalIdModal}
<PersonalIdErrorModal
on:close={(_) => (visibleModals.personalIdModal = false)}
personalIdNumber={baseCandidateDetails.personalIdNumber}
/>
{/if}
<div class="form relative bg-center">
<div class="bottom-5/24 absolute flex w-full flex-col md:h-auto">
<div class="<md:hidden self-center">