dan/Portfolio
1
0
Fork 0
mirror of https://github.com/danbulant/Portfolio synced 2026-05-24 12:35:31 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: candidate details from server

Browse source
This commit is contained in:
Sebastian Pravda 2022-12-04 20:02:25 +01:00 committed by EETagent
parent 47445ba381
commit 85e83bd964
4 changed files with 87 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
frontend/src/lib/@api/admin.ts
View file

@ -16,7 +16,7 @@ export const apiLogin = async (data: AdminLogin): Promise<number> => {
// Create new candidate /admin/create
// return created candidate's applicationId, personalIdNumber and password
export const createCandidate = async (data: CreateCandidate): Promise<CreateCandidateLogin> => {
export const apiCreateCandidate = async (data: CreateCandidate): Promise<CreateCandidateLogin> => {
try {
const res = await axios.post(API_URL + '/admin/create', data, { withCredentials: true });
return res.data;
@ -26,7 +26,7 @@ export const createCandidate = async (data: CreateCandidate): Promise<CreateCand
}
// Reset candidate password /admin/candidate/{id}/reset_password
export const resetCandidatePassword = async (id: number): Promise<CreateCandidateLogin> => {
export const apiResetCandidatePassword = async (id: number): Promise<CreateCandidateLogin> => {
try {
const res = await axios.post(API_URL + '/admin/candidate/' + id + '/reset_password',
{},

44
frontend/src/lib/components/dashboard/CandidateDetails.svelte Normal file
View file

@ -0,0 +1,44 @@
<script lang="ts">
import { apiResetCandidatePassword } from "$lib/@api/admin";
import type { CandidateData } from "$lib/stores/candidate";
import ListElement from "./ListElement.svelte";
export let candidate: CandidateData;
async function resetCandidatePassword(id: number) {
try {
await apiResetCandidatePassword(id);
} catch {
console.log('error');
}
}
</script>
<div class="flex flex-row">
<div class="w-96">
<li>
<ListElement label="Jméno" content={candidate.name}></ListElement>
<ListElement label="Příjmení" content={candidate.surname}></ListElement>
<ListElement label="Místo narození" content={candidate.birthplace}></ListElement>
<ListElement label="Datum narození" content={candidate.birthdate}></ListElement>
<ListElement label="Adresa" content={candidate.address}></ListElement>
<ListElement label="Telefon" content={candidate.telephone}></ListElement>
<ListElement label="Email" content={candidate.email}></ListElement>
<ListElement label="Obor" content={candidate.study}></ListElement>
<ListElement label="Rodné číslo" content={candidate.personalIdNumber}></ListElement>
<ListElement label="Jméno rodiče" content={candidate.parentName}></ListElement>
<ListElement label="Příjmení rodiče" content={candidate.parentSurname}></ListElement>
<ListElement label="Telefon rodiče" content={candidate.parentTelephone}></ListElement>
<ListElement label="Email rodiče" content={candidate.parentEmail}></ListElement>
</li>
</div>
<div class="ml-20">
<div class="bg-sspsBlue hover:bg-sspsBlueDark transition duration-300 rounded-lg px-10 py-4">
<button class="text-2xl text-white font-bold">Resetovat heslo</button>
</div>
</div>
</div>
<style>
</style>

10
frontend/src/lib/components/dashboard/ListElement.svelte Normal file
View file

@ -0,0 +1,10 @@
<script lang="ts">
export let label = 'TEST';
export let content = 'TEST';
</script>
<div class="flex justify-between relative">
<span class="font-bold">{label}:</span>
<span class="absolute left-40">{content}</span>
</div>

54
frontend/src/routes/(admin)/admin/(authenticated)/dashboard/+page.svelte
View file

@ -1,14 +1,15 @@
<script lang="ts">
import backgroundImage from '$lib/assets/background.jpg';
import { apiFetchCandidate, apiListCandidates } from '$lib/@api/admin';
import { apiFetchCandidate, apiListCandidates, apiResetCandidatePassword } from '$lib/@api/admin';
import Home from '$lib/components/icons/Home.svelte';
import TextField from '$lib/components/textfield/TextField.svelte';
import type { CandidatePreview } from '$lib/stores/candidate';
import type { CandidateData, CandidatePreview } from '$lib/stores/candidate';
import ListElement from '$lib/components/dashboard/ListElement.svelte';
import CandidateDetails from '$lib/components/dashboard/CandidateDetails.svelte';
let candidates: [CandidatePreview] = [{}];
let candidateDetails: { [id: number]: CandidatePreview } = {};
let currentCandidateId: number = 0;
let candidateDetails: { [id: number]: CandidateData } = {};
getCandidates();
@ -20,9 +21,13 @@
}
}
async function getCandidateDetails(id: number) {
currentCandidateId = id;
candidateDetails[id] = await apiFetchCandidate(id);
async function toggleDetail(id: number | undefined) {
if (id === undefined) return true;
if (candidateDetails.hasOwnProperty(id)) {
delete candidateDetails[id];
} else {
candidateDetails[id] = await apiFetchCandidate(id);
}
}
type Filter = 'Vše' | 'KBB' | 'IT' | 'GYM';
@ -66,30 +71,33 @@
<table class="min-w-full rounded-md border-2 border-[#dfe0e9] text-center">
<thead class="bg-[#f6f4f4] ">
<tr>
<th scope="col" class="px-6 py-4 text-sm font-medium text-gray-900"> # </th>
<th scope="col" class="px-6 py-4 text-sm font-medium text-gray-900"> First </th>
<th scope="col" class="px-6 py-4 text-sm font-medium text-gray-900"> Last </th>
<th scope="col" class="px-6 py-4 text-sm font-medium text-gray-900">
Handle
</th>
<th scope="col" class="px-6 py-4 text-sm font-medium text-gray-900"> Ev. č. přihlásky </th>
<th scope="col" class="px-6 py-4 text-sm font-medium text-gray-900"> Jméno </th>
<th scope="col" class="px-6 py-4 text-sm font-medium text-gray-900"> Příjmení </th>
<th scope="col" class="px-6 py-4 text-sm font-medium text-gray-900"> Obor </th>
</tr>
</thead>
<tbody>
{#each Array(40) as item}
<tr class="border-b bg-white">
<td class="whitespace-nowrap px-6 py-4 text-sm font-medium text-gray-900"
>1</td
{#each candidates as candidate}
<tr on:click={e=> toggleDetail(candidate.applicationId)} class="hover:cursor-pointer border-b bg-white">
<td class="whitespace-nowrap px-6 py-4 text-sm text-gray-900"
>{candidate.applicationId}</td
>
<td class="whitespace-nowrap px-6 py-4 text-sm font-light text-gray-900">
Mark
<td class="whitespace-nowrap px-6 py-4 text-sm text-gray-900">
{candidate.name}
</td>
<td class="whitespace-nowrap px-6 py-4 text-sm font-light text-gray-900">
Otto
<td class="whitespace-nowrap px-6 py-4 text-sm text-gray-900">
{candidate.surname}
</td>
<td class="whitespace-nowrap px-6 py-4 text-sm font-light text-gray-900">
@mdo
<td class="whitespace-nowrap px-6 py-4 text-sm text-gray-900">
{candidate.study}
</td>
</tr>
{#if candidateDetails.hasOwnProperty(candidate.applicationId)}
<CandidateDetails
candidate={candidateDetails[candidate.applicationId]}>
</CandidateDetails>
{/if}
{/each}
</tbody>
</table>