mirror of
https://github.com/danbulant/Portfolio
synced 2026-05-24 12:35:31 +00:00
feat: optionally show personal data
This commit is contained in:
parent
040241bc74
commit
7e3740f436
3 changed files with 56 additions and 6 deletions
|
|
@ -7,10 +7,12 @@
|
|||
import StatusNotificationBig from './StatusNotificationBig.svelte';
|
||||
import InfoButton from './InfoButton.svelte';
|
||||
import { candidateData } from '$lib/stores/candidate';
|
||||
import tippy from 'tippy.js';
|
||||
|
||||
export let title: string;
|
||||
export let status: Status;
|
||||
|
||||
export let showDetails = true;
|
||||
let loading = false;
|
||||
|
||||
const submitPortfolio = async () => {
|
||||
|
|
@ -56,12 +58,12 @@
|
|||
<div class="mr-4">
|
||||
<div on:click on:keydown class="flex flex-col">
|
||||
<div class="flex flex-col h-20">
|
||||
<InfoButton on:download={downloadPortfolio}></InfoButton>
|
||||
<InfoButton on:download={downloadPortfolio} on:showInfo on:showInfo={(_) => showDetails = !showDetails}></InfoButton>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="relative flex flex-row justify-between">
|
||||
<div class="relative flex flex-row">
|
||||
<div>
|
||||
<span class="absolute -left-16 -top-36">
|
||||
<Circles />
|
||||
|
|
@ -71,6 +73,50 @@
|
|||
<slot />
|
||||
</div>
|
||||
</div>
|
||||
{#if showDetails}
|
||||
<svg class="ml-12 mr-8 h-40 hidden xl:block mt-10" viewBox="0 0 2 80" xmlns="http://www.w3.org/2000/svg">
|
||||
<line
|
||||
x1="0"
|
||||
y="0"
|
||||
x2="0"
|
||||
y2="80"
|
||||
stroke="#406280ff"
|
||||
stroke-width="2"
|
||||
stroke-dasharray="3"/>
|
||||
</svg>
|
||||
<div
|
||||
use:tippy={{
|
||||
content: "<span>Vámi vyplněné osobní údaje</span>",
|
||||
allowHTML: true,
|
||||
placement: 'top',
|
||||
showOnCreate: false,
|
||||
delay: 0
|
||||
}}
|
||||
class="flex flex-col justify-around mt-10">
|
||||
<span>Adresa: <span class="font-bold">{$candidateData.candidate.address}</span></span>
|
||||
<span>Datum narození: <span class="font-bold">{$candidateData.candidate.birthdate}</span></span>
|
||||
<span>Místo narození: <span class="font-bold">{$candidateData.candidate.birthplace}</span></span>
|
||||
<span>Rodné číslo: <span class="font-bold">{$candidateData.candidate.personalIdNumber}</span></span>
|
||||
<span>Telefon: <span class="font-bold">{$candidateData.candidate.telephone}</span></span>
|
||||
</div>
|
||||
<div
|
||||
use:tippy={{
|
||||
content: "<span>Vámi vyplněné osobní údaje</span>",
|
||||
allowHTML: true,
|
||||
placement: 'top',
|
||||
showOnCreate: false,
|
||||
delay: 0
|
||||
}}
|
||||
class="ml-10 flex flex-col justify-around mt-10">
|
||||
{#each $candidateData.parents as parent}
|
||||
<div class="flex flex-col">
|
||||
<span class="font-bold text-sspsBlue text-xl">{parent.name + " " + parent.surname}</span>
|
||||
<span>Email: <span class="font-bold">{parent.email}</span></span>
|
||||
<span>Telefon: <span class="font-bold">{parent.telephone}</span></span>
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -16,7 +16,8 @@
|
|||
|
||||
<div class="flex flex-col">
|
||||
<div class="flex flex-col">
|
||||
<span on:click={(_) => showInfo()} on:keydown={(_) => showInfo()} use:tippy={{
|
||||
<span on:click={(_) => showInfo()} on:keydown={(_) => showInfo()}
|
||||
use:tippy={{
|
||||
content: "Zobrazit osobní údaje",
|
||||
placement: 'top',
|
||||
showOnCreate: false,
|
||||
|
|
|
|||
|
|
@ -14,6 +14,9 @@
|
|||
|
||||
export let data: PageData;
|
||||
|
||||
// TODO: transition
|
||||
let showDetails = true;
|
||||
|
||||
// @ts-ignore
|
||||
$: candidateData.set(data.candidate);
|
||||
// @ts-ignore
|
||||
|
|
@ -33,13 +36,13 @@
|
|||
|
||||
<FullLayout>
|
||||
<div class="dashboard dashboardDesktop">
|
||||
<div class="name col-span-4">
|
||||
<DashboardInfoCard status={getUploadStatus($submissionProgress.status)} title={$candidateData.candidate.name + ' ' + $candidateData.candidate.surname ?? ''}>
|
||||
<div class="movable name col-span-5" class:col-span-5={showDetails} class:col-span-3={!showDetails}>
|
||||
<DashboardInfoCard bind:showDetails={showDetails} status={getUploadStatus($submissionProgress.status)} title={$candidateData.candidate.name + ' ' + $candidateData.candidate.surname ?? ''}>
|
||||
<span class="text-sspsBlue mt-3 truncate">{$candidateData.candidate.email}</span>
|
||||
<span class="text-sspsGray mt-3 text-xs">Uchazeč na SSPŠ</span>
|
||||
</DashboardInfoCard>
|
||||
</div>
|
||||
<div class="coverletter col-span-4">
|
||||
<div class="movable coverletter" class:col-span-3={showDetails} class:col-span-5={!showDetails}>
|
||||
<CoverLetterUploadCard />
|
||||
</div>
|
||||
<div class="portfolio col-span-3">
|
||||
|
|
|
|||
Loading…
Reference in a new issue