mirror of
https://github.com/danbulant/Portfolio
synced 2026-05-27 14:02:14 +00:00
feat: add NameField and get data for parent
This commit is contained in:
parent
41214f9704
commit
757e618ef4
2 changed files with 45 additions and 6 deletions
32
frontend/src/lib/components/textfield/NameField.svelte
Normal file
32
frontend/src/lib/components/textfield/NameField.svelte
Normal file
|
|
@ -0,0 +1,32 @@
|
||||||
|
<script lang="ts">
|
||||||
|
import { onMount } from 'svelte';
|
||||||
|
import TextField from './TextField.svelte';
|
||||||
|
|
||||||
|
export let placeholder: string = '';
|
||||||
|
|
||||||
|
export let valueName: string = '';
|
||||||
|
export let valueSurname: string = '';
|
||||||
|
|
||||||
|
let value: string = "";
|
||||||
|
|
||||||
|
$: {
|
||||||
|
const parsed = value.trim().split(' ');
|
||||||
|
if (parsed.length > 1) {
|
||||||
|
valueName = parsed[0];
|
||||||
|
valueSurname = parsed[1];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
onMount(() => {
|
||||||
|
if (valueName && valueSurname) {
|
||||||
|
value = `${valueName} ${valueSurname}`;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
export let error: string = '';
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<TextField bind:error bind:value on:click on:keydown on:keyup on:change type="text" {placeholder} />
|
||||||
|
|
||||||
|
<style>
|
||||||
|
</style>
|
||||||
|
|
@ -9,6 +9,7 @@
|
||||||
import SplitLayout from '$lib/components/layout/SplitLayout.svelte';
|
import SplitLayout from '$lib/components/layout/SplitLayout.svelte';
|
||||||
import EmailField from '$lib/components/textfield/EmailField.svelte';
|
import EmailField from '$lib/components/textfield/EmailField.svelte';
|
||||||
import IdField from '$lib/components/textfield/IdField.svelte';
|
import IdField from '$lib/components/textfield/IdField.svelte';
|
||||||
|
import NameField from '$lib/components/textfield/NameField.svelte';
|
||||||
import TelephoneField from '$lib/components/textfield/TelephoneField.svelte';
|
import TelephoneField from '$lib/components/textfield/TelephoneField.svelte';
|
||||||
import TextField from '$lib/components/textfield/TextField.svelte';
|
import TextField from '$lib/components/textfield/TextField.svelte';
|
||||||
|
|
||||||
|
|
@ -31,8 +32,8 @@
|
||||||
citizenship: '',
|
citizenship: '',
|
||||||
personalIdNumber: '',
|
personalIdNumber: '',
|
||||||
study: '',
|
study: '',
|
||||||
parentName: 'TODO name',
|
parentName: '',
|
||||||
parentSurname: 'TODO',
|
parentSurname: '',
|
||||||
parentTelephone: '',
|
parentTelephone: '',
|
||||||
parentEmail: ''
|
parentEmail: ''
|
||||||
};
|
};
|
||||||
|
|
@ -133,11 +134,11 @@
|
||||||
</p>
|
</p>
|
||||||
<div class="flex w-full items-center justify-center md:flex-col">
|
<div class="flex w-full items-center justify-center md:flex-col">
|
||||||
<span class="mt-8 w-full">
|
<span class="mt-8 w-full">
|
||||||
<TextField
|
<NameField
|
||||||
error={$errors.name}
|
error={$errors.name}
|
||||||
on:change={handleChange}
|
on:change={handleChange}
|
||||||
bind:value={$form.name}
|
bind:valueName={$form.name}
|
||||||
type="text"
|
bind:valueSurname={$form.surname}
|
||||||
placeholder="Jméno a příjmení"
|
placeholder="Jméno a příjmení"
|
||||||
/>
|
/>
|
||||||
</span>
|
</span>
|
||||||
|
|
@ -167,7 +168,13 @@
|
||||||
</p>
|
</p>
|
||||||
<div class="flex w-full flex-row md:flex-col">
|
<div class="flex w-full flex-row md:flex-col">
|
||||||
<span class="mt-8 w-full">
|
<span class="mt-8 w-full">
|
||||||
<TextField type="text" placeholder="Rodné příjmení" on:change={handleChange} />
|
<NameField
|
||||||
|
error={$errors.name}
|
||||||
|
on:change={handleChange}
|
||||||
|
bind:valueName={$form.parentName}
|
||||||
|
bind:valueSurname={$form.parentSurname}
|
||||||
|
placeholder="Jméno a příjmení zákonného zástupce"
|
||||||
|
/>
|
||||||
</span>
|
</span>
|
||||||
<span class="mt-8 ml-2 w-full md:ml-0">
|
<span class="mt-8 ml-2 w-full md:ml-0">
|
||||||
<TextField
|
<TextField
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue