mirror of
https://github.com/danbulant/Portfolio
synced 2026-07-10 13:30:46 +00:00
fix: formatting
This commit is contained in:
parent
5f431fb92a
commit
23fab618db
23 changed files with 280 additions and 279 deletions
|
|
@ -1,7 +1,7 @@
|
|||
import { API_URL } from '$lib/@api';
|
||||
import type { HandleFetch } from '@sveltejs/kit';
|
||||
|
||||
export const handleFetch: HandleFetch = async ({ request, fetch, event,}) => {
|
||||
export const handleFetch: HandleFetch = async ({ request, fetch, event }) => {
|
||||
console.log(`SSR: handleFetch() BEFORE: ${request.method} ${request.url}`);
|
||||
|
||||
const cookie = event.request.headers.get('cookie') || '';
|
||||
|
|
@ -10,10 +10,7 @@ export const handleFetch: HandleFetch = async ({ request, fetch, event,}) => {
|
|||
|
||||
request.headers.set('cookie', cookie);
|
||||
|
||||
request = new Request(
|
||||
request.url.replace(API_URL, 'http://127.0.0.1:8000'),
|
||||
request
|
||||
);
|
||||
request = new Request(request.url.replace(API_URL, 'http://127.0.0.1:8000'), request);
|
||||
|
||||
console.log(`SSR: handleFetch() AFTER: ${request.method} ${request.url}`);
|
||||
|
||||
|
|
|
|||
|
|
@ -1,14 +1,14 @@
|
|||
import type { AxiosError } from "axios";
|
||||
import type { AxiosError } from 'axios';
|
||||
|
||||
export type Fetch = (input: RequestInfo, init?: RequestInit) => Promise<Response>
|
||||
export type Fetch = (input: RequestInfo, init?: RequestInit) => Promise<Response>;
|
||||
|
||||
export const API_URL = "http://localhost:8000";
|
||||
export const API_URL = 'http://localhost:8000';
|
||||
|
||||
export interface ApiError {
|
||||
error: AxiosError,
|
||||
msg: string,
|
||||
error: AxiosError;
|
||||
msg: string;
|
||||
}
|
||||
|
||||
export function errorHandler(error: AxiosError, msg: string): ApiError {
|
||||
return {error, msg}
|
||||
return { error, msg };
|
||||
}
|
||||
|
|
@ -1,23 +1,20 @@
|
|||
<script lang="ts">
|
||||
import { fetchSubmProgress } from "$lib/stores/portfolio";
|
||||
import { apiUploadCoverLetter } from "$lib/@api/candidate";
|
||||
import DashboardUploadCard from "./DashboardUploadCard.svelte";
|
||||
import { fetchSubmProgress } from '$lib/stores/portfolio';
|
||||
import { apiUploadCoverLetter } from '$lib/@api/candidate';
|
||||
import DashboardUploadCard from './DashboardUploadCard.svelte';
|
||||
|
||||
const onFileDrop = async (detail: any) => {
|
||||
const file = detail.file;
|
||||
const callback = detail.callback;
|
||||
await apiUploadCoverLetter(file, callback);
|
||||
await fetchSubmProgress();
|
||||
}
|
||||
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
<DashboardUploadCard
|
||||
on:filedrop={e => onFileDrop(e.detail)}
|
||||
on:filedrop={(e) => onFileDrop(e.detail)}
|
||||
title="Motivační dopis"
|
||||
filetype="PDF"
|
||||
filesize={10}
|
||||
fileType={1}
|
||||
>
|
||||
</DashboardUploadCard>
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -1,22 +1,20 @@
|
|||
<script lang="ts">
|
||||
import { fetchSubmProgress } from "$lib/stores/portfolio";
|
||||
import { apiUploadPortfolioLetter } from "../../@api/candidate";
|
||||
import DashboardUploadCard from "./DashboardUploadCard.svelte";
|
||||
import { fetchSubmProgress } from '$lib/stores/portfolio';
|
||||
import { apiUploadPortfolioLetter } from '../../@api/candidate';
|
||||
import DashboardUploadCard from './DashboardUploadCard.svelte';
|
||||
|
||||
const onFileDrop = async (detail: any) => {
|
||||
const file = detail.file;
|
||||
const callback = detail.callback;
|
||||
await apiUploadPortfolioLetter(file, callback);
|
||||
await fetchSubmProgress();
|
||||
}
|
||||
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
<DashboardUploadCard
|
||||
on:filedrop={e => onFileDrop(e.detail)}
|
||||
on:filedrop={(e) => onFileDrop(e.detail)}
|
||||
title="Portfolio"
|
||||
filetype="PDF"
|
||||
filesize={10}
|
||||
fileType={2}>
|
||||
</DashboardUploadCard>
|
||||
fileType={2}
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -1,22 +1,20 @@
|
|||
<script lang="ts">
|
||||
import { fetchSubmProgress } from "$lib/stores/portfolio";
|
||||
import { apiUploadPortfolioZip } from "$lib/@api/candidate";
|
||||
import DashboardUploadCard from "./DashboardUploadCard.svelte";
|
||||
import { fetchSubmProgress } from '$lib/stores/portfolio';
|
||||
import { apiUploadPortfolioZip } from '$lib/@api/candidate';
|
||||
import DashboardUploadCard from './DashboardUploadCard.svelte';
|
||||
|
||||
const onFileDrop = async (detail: any) => {
|
||||
const file = detail.file;
|
||||
const callback = detail.callback;
|
||||
await apiUploadPortfolioZip(file, callback);
|
||||
await fetchSubmProgress();
|
||||
}
|
||||
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
<DashboardUploadCard
|
||||
on:filedrop={e => onFileDrop(e.detail)}
|
||||
on:filedrop={(e) => onFileDrop(e.detail)}
|
||||
title="Další data"
|
||||
filetype="ZIP"
|
||||
filesize={100}
|
||||
fileType={3}>
|
||||
</DashboardUploadCard>
|
||||
fileType={3}
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -3,19 +3,36 @@
|
|||
</script>
|
||||
|
||||
<div class="progress-bar">
|
||||
<svg class="animated animate-ease-linear"
|
||||
<svg
|
||||
class="animated animate-ease-linear"
|
||||
width="40mm"
|
||||
height="8mm"
|
||||
viewBox="0 0 50 6"
|
||||
version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<line x1="5" y1="3" x2="45" y2="3" stroke="#e6e6e6" stroke-width="6" stroke-linecap="round" />
|
||||
|
||||
{#if progress === 1}
|
||||
<line x1="5" y1="3" x2={progress * 45} y2="3" stroke="#35e000ff" stroke-width="3" stroke-linecap="round" />
|
||||
<line
|
||||
x1="5"
|
||||
y1="3"
|
||||
x2={progress * 45}
|
||||
y2="3"
|
||||
stroke="#35e000ff"
|
||||
stroke-width="3"
|
||||
stroke-linecap="round"
|
||||
/>
|
||||
{:else}
|
||||
<line x1="5" y1="3" x2={progress * 45} y2="3" stroke="#75bff8ff" stroke-width="3" stroke-linecap="round" />
|
||||
<line
|
||||
x1="5"
|
||||
y1="3"
|
||||
x2={progress * 45}
|
||||
y2="3"
|
||||
stroke="#75bff8ff"
|
||||
stroke-width="3"
|
||||
stroke-linecap="round"
|
||||
/>
|
||||
{/if}
|
||||
>
|
||||
</svg>
|
||||
|
|
|
|||
|
|
@ -1,23 +1,23 @@
|
|||
<script lang="ts">
|
||||
import type { Status } from "$lib/stores/portfolio";
|
||||
import StatusNotificationDot from "./StatusNotificationDot.svelte";
|
||||
import type { Status } from '$lib/stores/portfolio';
|
||||
import StatusNotificationDot from './StatusNotificationDot.svelte';
|
||||
|
||||
export let status: Status;
|
||||
|
||||
let title: string;
|
||||
switch (status) {
|
||||
case "submitted":
|
||||
title = "Soubory odeslány!";
|
||||
case 'submitted':
|
||||
title = 'Soubory odeslány!';
|
||||
break;
|
||||
case "uploaded":
|
||||
title = "Soubory nahrány!";
|
||||
case 'uploaded':
|
||||
title = 'Soubory nahrány!';
|
||||
break;
|
||||
case "missing":
|
||||
title = "Chybí soubory!";
|
||||
case 'missing':
|
||||
title = 'Chybí soubory!';
|
||||
break;
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<div class="bg-white rounded-full flex mb-8">
|
||||
<div class="mt-3 mb-3 ml-3 flex flex-row">
|
||||
<h2 class="ml-2 text-2xl text-sspsBlueDark font-bold">{title}</h2>
|
||||
|
|
@ -39,4 +39,3 @@
|
|||
@apply bg-[#ff3030ff];
|
||||
}
|
||||
</style>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,21 +1,20 @@
|
|||
<script lang="ts">
|
||||
import type { Status } from "$lib/stores/portfolio";
|
||||
|
||||
import type { Status } from '$lib/stores/portfolio';
|
||||
|
||||
export let status: Status;
|
||||
let title: string;
|
||||
|
||||
$: switch (status) {
|
||||
case "submitted":
|
||||
title = "Odeslané";
|
||||
case 'submitted':
|
||||
title = 'Odeslané';
|
||||
break;
|
||||
case "uploaded":
|
||||
title = "Nahráno";
|
||||
case 'uploaded':
|
||||
title = 'Nahráno';
|
||||
break;
|
||||
case "missing":
|
||||
title = "Chybí";
|
||||
case 'missing':
|
||||
title = 'Chybí';
|
||||
break;
|
||||
};
|
||||
}
|
||||
</script>
|
||||
|
||||
<!-- make red dot -->
|
||||
|
|
@ -40,11 +39,9 @@
|
|||
.uploaded {
|
||||
@apply bg-[#ff8530ff];
|
||||
@apply animate-none;
|
||||
|
||||
}
|
||||
|
||||
.missing {
|
||||
@apply bg-red-700;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
@ -1,13 +1,13 @@
|
|||
<svg height="24" width="24" xmlns="http://www.w3.org/2000/svg"
|
||||
><path
|
||||
><path
|
||||
d="M4.586 20.414l-.707.707zm14.828 0l-.707-.707zM19 10v7h2v-7zm-3 10H8v2h8zM5 17v-7H3v7zm3 3c-.971 0-1.599-.002-2.061-.064-.434-.059-.57-.153-.646-.229l-1.414 1.414c.51.51 1.138.709 1.793.797C6.3 22.002 7.085 22 8 22zm-5-3c0 .915-.002 1.701.082 2.328.088.655.287 1.284.797 1.793l1.414-1.414c-.076-.076-.17-.212-.229-.646C5.002 18.6 5 17.971 5 17zm16 0c0 .971-.002 1.599-.064 2.061-.059.434-.153.57-.229.646l1.414 1.414c.51-.51.709-1.138.797-1.793C21.002 18.7 21 17.915 21 17zm-3 5c.915 0 1.701.002 2.328-.082.655-.088 1.284-.287 1.793-.797l-1.414-1.414c-.076.076-.212.17-.646.229-.462.062-1.09.064-2.061.064z"
|
||||
/><path
|
||||
/><path
|
||||
d="M3 11l6.172-6.172c1.333-1.333 2-2 2.828-2s1.495.667 2.828 2L21 11"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2"
|
||||
/><path
|
||||
/><path
|
||||
d="M9 17c0-.932 0-1.398.152-1.765a2 2 0 0 1 1.083-1.083C10.602 14 11.068 14 12 14s1.398 0 1.765.152a2 2 0 0 1 1.083 1.083C15 15.602 15 16.068 15 17v4H9zm7-12.5c0-.466 0-.699.076-.883a1 1 0 0 1 .541-.54C16.801 3 17.034 3 17.5 3s.699 0 .883.076a1 1 0 0 1 .54.541c.077.184.077.417.077.883V10l-3-3.5z"
|
||||
/></svg
|
||||
/></svg
|
||||
>
|
||||
|
||||
<style>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 1.2 KiB After Width: | Height: | Size: 1.2 KiB |
|
|
@ -12,7 +12,8 @@
|
|||
svg {
|
||||
@apply stroke-sspsBlue fill-sspsBlue;
|
||||
}
|
||||
g, path {
|
||||
g,
|
||||
path {
|
||||
@apply fill-sspsBlue stroke-sspsBlue;
|
||||
}
|
||||
</style>
|
||||
|
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 1.6 KiB |
|
|
@ -1,6 +1,7 @@
|
|||
<script lang="ts">
|
||||
import lion from '$lib/assets/logo/lion.png';
|
||||
</script>
|
||||
</script>
|
||||
|
||||
<div
|
||||
class="py-3 px-6 md:py-4 md:px-8 rounded-[999px] shadow-2xl flex items-center justify-center transition-all duration-700 hover:shadow-md"
|
||||
>
|
||||
|
|
@ -8,5 +9,4 @@
|
|||
</div>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
|
|
@ -21,7 +21,7 @@
|
|||
|
||||
<style>
|
||||
.logo {
|
||||
@apply w-[200px] h-[200px]
|
||||
@apply w-[200px] h-[200px];
|
||||
}
|
||||
.bgImage {
|
||||
@apply -z-20;
|
||||
|
|
|
|||
|
|
@ -4,18 +4,21 @@
|
|||
import DarkModeToggle from '../DarkModeToggle.svelte';
|
||||
|
||||
export let backgroundImage: string = defaultBg;
|
||||
export let backgroundPosition: string = "55%";
|
||||
export let backgroundPosition: string = '55%';
|
||||
</script>
|
||||
|
||||
<div class="bg">
|
||||
<div class="bgOverlay">
|
||||
<img class="logo" src={logo} alt="SSPŠ logo" />
|
||||
</div>
|
||||
<div style={`background-image: url(${backgroundImage}); background-position: ${backgroundPosition}`} class="bgImage" />
|
||||
<div
|
||||
style={`background-image: url(${backgroundImage}); background-position: ${backgroundPosition}`}
|
||||
class="bgImage"
|
||||
/>
|
||||
</div>
|
||||
<div class="view">
|
||||
<div class="darkModeToggle">
|
||||
<DarkModeToggle/>
|
||||
<DarkModeToggle />
|
||||
</div>
|
||||
<div class="content">
|
||||
<slot />
|
||||
|
|
|
|||
|
|
@ -10,25 +10,18 @@
|
|||
$: {
|
||||
let x = value.replace(/\D/g, '').match(/(\d{0,3})(\d{0,3})(\d{0,3})(\d{0,3})/)!;
|
||||
value =
|
||||
(x[1] ? '+' + x[1] : '') + (x[2] ? ' ' + x[2] : '') + (x[3] ? ' ' + x[3] : '') + (x[4] ? ' ' + x[4] : '');
|
||||
(x[1] ? '+' + x[1] : '') +
|
||||
(x[2] ? ' ' + x[2] : '') +
|
||||
(x[3] ? ' ' + x[3] : '') +
|
||||
(x[4] ? ' ' + x[4] : '');
|
||||
}
|
||||
</script>
|
||||
|
||||
<TextField
|
||||
bind:error
|
||||
bind:value
|
||||
on:keydown
|
||||
on:keyup
|
||||
on:change
|
||||
type="tel"
|
||||
{placeholder}
|
||||
icon
|
||||
>
|
||||
<TextField bind:error bind:value on:keydown on:keyup on:change type="tel" {placeholder} icon>
|
||||
<div slot="icon" class="flex items-center justify-center">
|
||||
<Telephone />
|
||||
</div>
|
||||
</TextField>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
import { writable } from "svelte/store";
|
||||
import { writable } from 'svelte/store';
|
||||
|
||||
export interface CandidateData {
|
||||
name?: string;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import { apiFetchSubmissionProgress } from "../@api/candidate";
|
||||
import { writable } from "svelte/store";
|
||||
import { apiFetchSubmissionProgress } from '../@api/candidate';
|
||||
import { writable } from 'svelte/store';
|
||||
|
||||
export type Status = 'submitted' | 'uploaded' | 'missing';
|
||||
|
||||
|
|
@ -7,7 +7,7 @@ export enum UploadStatus {
|
|||
None = 1,
|
||||
Some = 2,
|
||||
All = 3,
|
||||
Submitted = 4,
|
||||
Submitted = 4
|
||||
}
|
||||
|
||||
export interface SubmissionProgress {
|
||||
|
|
|
|||
|
|
@ -43,7 +43,10 @@
|
|||
name: yup.string().required(),
|
||||
surname: yup.string(),
|
||||
email: yup.string().email().required(),
|
||||
telephone: yup.string().required().matches(/^\+\d{1,3} \d{3} \d{3} \d{3}$/),
|
||||
telephone: yup
|
||||
.string()
|
||||
.required()
|
||||
.matches(/^\+\d{1,3} \d{3} \d{3} \d{3}$/),
|
||||
birthplace: yup.string().required(),
|
||||
birthdate: yup.string().required(),
|
||||
sex: yup.string(),
|
||||
|
|
@ -53,24 +56,27 @@
|
|||
study: yup.string().required(),
|
||||
parentName: yup.string(),
|
||||
parentSurname: yup.string(),
|
||||
parentTelephone: yup.string().required().matches(/^\+\d{1,3} \d{3} \d{3} \d{3}$/),
|
||||
parentTelephone: yup
|
||||
.string()
|
||||
.required()
|
||||
.matches(/^\+\d{1,3} \d{3} \d{3} \d{3}$/),
|
||||
parentEmail: yup.string().email().required()
|
||||
}),
|
||||
|
||||
onSubmit: async (values) => {
|
||||
if (pageIndex === pageCount) {
|
||||
try {
|
||||
console.log("submit")
|
||||
console.log('submit');
|
||||
// @ts-ignore // love javascript
|
||||
delete values.undefined;
|
||||
values.birthdate = '2000-01-01' // TODO: reformat user typed date
|
||||
values.birthdate = '2000-01-01'; // TODO: reformat user typed date
|
||||
await apiFillDetails(values);
|
||||
goto("/dashboard");
|
||||
goto('/dashboard');
|
||||
} catch (e) {
|
||||
console.error("error while submitting data: " + e);
|
||||
console.error('error while submitting data: ' + e);
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
$: console.log($errors);
|
||||
|
|
@ -84,7 +90,10 @@
|
|||
break;
|
||||
|
||||
case 1:
|
||||
if (/* $errors.birthdurname || */ $errors.birthplace || $errors.birthdate /* || $errors.sex */) {
|
||||
if (
|
||||
/* $errors.birthdurname || */ $errors.birthplace ||
|
||||
$errors.birthdate /* || $errors.sex */
|
||||
) {
|
||||
return true;
|
||||
}
|
||||
break;
|
||||
|
|
@ -158,11 +167,7 @@
|
|||
</p>
|
||||
<div class="flex flex-row md:flex-col w-full">
|
||||
<span class="w-full mt-8">
|
||||
<TextField
|
||||
type="text"
|
||||
placeholder="Rodné příjmení"
|
||||
on:change={handleChange}
|
||||
/>
|
||||
<TextField type="text" placeholder="Rodné příjmení" on:change={handleChange} />
|
||||
</span>
|
||||
<span class="w-full mt-8 ml-2 md:ml-0">
|
||||
<TextField
|
||||
|
|
@ -250,11 +255,7 @@
|
|||
/>
|
||||
</span>
|
||||
<span class="w-full mt-8 ml-2 md:ml-0">
|
||||
<TextField
|
||||
on:change={handleChange}
|
||||
type="text"
|
||||
placeholder="Evidenční číslo přihlášky"
|
||||
/>
|
||||
<TextField on:change={handleChange} type="text" placeholder="Evidenční číslo přihlášky" />
|
||||
</span>
|
||||
</div>
|
||||
<div class="mt-8 flex items-center justify-center w-full">
|
||||
|
|
@ -278,7 +279,7 @@
|
|||
<input
|
||||
on:click={async (e) => {
|
||||
await handleSubmit(e);
|
||||
console.log("clicked " + isPageInvalid());
|
||||
console.log('clicked ' + isPageInvalid());
|
||||
if (isPageInvalid()) return;
|
||||
if (pageIndex === pageCount) {
|
||||
} else {
|
||||
|
|
|
|||
|
|
@ -4,9 +4,9 @@ export default defineConfig({
|
|||
theme: {
|
||||
extend: {
|
||||
colors: {
|
||||
"sspsBlue": '#406280',
|
||||
"sspsBlueDark": '#243a55',
|
||||
"sspsGray": "#e6e6e6",
|
||||
sspsBlue: '#406280',
|
||||
sspsBlueDark: '#243a55',
|
||||
sspsGray: '#e6e6e6'
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue