Merge branch 'feature/33-rozhranie_pre_zmluvy_vykazy' into develop

frontend/app/components/InternshipDocumentEditor.vue

@@ -0,0 +1,144 @@
+<script setup lang="ts">
+import type { Internship } from '~/types/internships';
+import { FetchError } from 'ofetch';
+import type { User } from '~/types/user';
+import { Role } from '~/types/role';
+
+const props = defineProps<{
+    internship: Internship
+}>();
+const emit = defineEmits(['successfulSubmit']);
+
+const rules = {
+    isPdf: (v: File | null) =>
+        !v || v.type === "application/pdf" || 'Povolený je iba PDF súbor.',
+    maxSize: (v: File | null) =>
+        !v || v.size <= (10 * 1024 * 1024 /* 10 MB */) || 'Maximálna veľkosť súboru je 10 MB.',
+};
+
+const loading = ref(false);
+const error = ref<string | null>(null);
+const agreement = ref<File | null>(null);
+const report = ref<File | null>(null);
+const report_confirmed = ref(props.internship.report_confirmed);
+
+const client = useSanctumClient();
+const user = useSanctumUser<User>();
+
+function triggerDownload(file: Blob, file_name: string) {
+    const url = window.URL.createObjectURL(file);
+    const link = document.createElement('a');
+    link.href = url;
+    link.download = `${file_name}.pdf`;
+    link.target = "_blank";
+    link.click();
+    window.URL.revokeObjectURL(url);
+}
+
+async function downloadAgreement() {
+    const agreement: Blob = await client(`/api/internships/${props.internship.id}/agreement`);
+    triggerDownload(agreement, `agreement-${props.internship.id}`);
+}
+
+async function downloadReport() {
+    const report: Blob = await client(`/api/internships/${props.internship.id}/report`);
+    triggerDownload(report, `report-${props.internship.id}`);
+}
+
+async function onSubmit() {
+    error.value = null;
+    loading.value = true;
+
+    const formData = new FormData();
+    formData.append('report_confirmed', report_confirmed.value ? '1' : '0');
+    if (agreement.value) {
+        formData.append('agreement', agreement.value);
+    }
+    if (report.value) {
+        formData.append('report', report.value);
+    }
+
+    try {
+        await client(`/api/internships/${props.internship.id}/documents`, {
+            method: 'POST',
+            body: formData
+        });
+
+        agreement.value = null;
+        report.value = null;
+        emit('successfulSubmit');
+    } catch (e) {
+        if (e instanceof FetchError) {
+            error.value = e.response?._data.message;
+        }
+    } finally {
+        loading.value = false;
+    }
+}
+</script>
+
+<template>
+    <div>
+        <!-- Čakajúca hláška -->
+        <v-alert v-if="loading" density="compact" text="Prosím čakajte..." title="Spracovávam" type="info"
+            class="mx-auto mb-2"></v-alert>
+
+        <!-- Chybová hláška -->
+        <v-alert v-if="error" density="compact" :text="error" title="Chyba" type="error" class="mx-auto mb-2"></v-alert>
+
+        <v-form @submit.prevent="onSubmit" :disabled="loading">
+            <div>
+                <h4 class="mb-2">Podpísaná zmluva / dohoda</h4>
+
+                <v-alert v-if="props.internship.agreement" class="mb-2" type="warning" variant="tonal"
+                    title="Existujúci dokument"
+                    text="V systéme je už nahratá zmluva/dohoda. Ak chcete nahradiť existujúcu verziu, vyberte súbor, alebo v opačnom prípade nechajte toto pole nevyplnené.">
+
+                    <br />
+
+                    <v-btn prepend-icon="mdi-download" color="blue" class="mr-2 mt-2" @click="downloadAgreement">
+                        Stiahnuť
+                    </v-btn>
+                </v-alert>
+
+                <v-file-input v-model="agreement" :rules="[rules.isPdf, rules.maxSize]" accept=".pdf,application/pdf"
+                    prepend-icon="mdi-handshake" label="Nahrať PDF zmluvu" variant="outlined" show-size clearable
+                    hint="Povolené: PDF, max 10 MB" persistent-hint />
+            </div>
+
+            <br />
+
+            <div>
+                <h4 class="mb-2">Výkaz</h4>
+
+                <v-alert v-if="props.internship.report" class="mb-2" type="warning" variant="tonal"
+                    title="Existujúci dokument"
+                    text="V systéme je už nahratý výkaz. Ak chcete nahradiť existujúcu verziu, vyberte súbor, alebo v opačnom prípade nechajte toto pole nevyplnené.">
+
+                    <br />
+
+                    <v-btn prepend-icon="mdi-download" color="blue" class="mr-2 mt-2" @click="downloadReport">
+                        Stiahnuť
+                    </v-btn>
+                </v-alert>
+
+                <v-file-input v-model="report" :rules="[rules.isPdf, rules.maxSize]" accept=".pdf,application/pdf"
+                    prepend-icon="mdi-chart-box-outline" label="Nahrať PDF výkaz" variant="outlined" show-size clearable
+                    hint="Povolené: PDF, max 10 MB" persistent-hint />
+
+                <v-checkbox v-if="user?.role === Role.EMPLOYER"
+                    :disabled="!props.internship.agreement || !props.internship.report" v-model="report_confirmed"
+                    label="Výkaz je správny"></v-checkbox>
+            </div>
+
+            <br />
+
+            <v-btn type="submit" color="success" size="large" block
+                :disabled="!agreement && !report && (!props.internship.agreement || !props.internship.report)">
+                Uloziť
+            </v-btn>
+        </v-form>
+    </div>
+</template>
+
+<style scoped></style>

frontend/app/components/InternshipDocumentViewer.vue

@@ -0,0 +1,85 @@
+<script setup lang="ts">
+import type { Internship } from '~/types/internships';
+
+const props = defineProps<{
+    internship: Internship
+}>();
+
+const client = useSanctumClient();
+
+function triggerDownload(file: Blob, file_name: string) {
+    const url = window.URL.createObjectURL(file);
+    const link = document.createElement('a');
+    link.href = url;
+    link.download = `${file_name}.pdf`;
+    link.target = "_blank";
+    link.click();
+    window.URL.revokeObjectURL(url);
+}
+
+async function downloadAgreement() {
+    const agreement: Blob = await client(`/api/internships/${props.internship.id}/agreement`);
+    triggerDownload(agreement, `agreement-${props.internship.id}`);
+}
+
+async function downloadReport() {
+    const report: Blob = await client(`/api/internships/${props.internship.id}/report`);
+    triggerDownload(report, `report-${props.internship.id}`);
+}
+</script>
+
+<template>
+    <div>
+        <v-row>
+            <!-- Podpísaná zmluva -->
+            <v-col cols="12" md="6">
+                <v-card variant="outlined">
+                    <v-card-title class="d-flex align-center ga-2">
+                        <v-icon icon="mdi mdi-file-document-outline" />
+                        Podpísaná zmluva / dohoda
+                    </v-card-title>
+                    <v-card-text>
+                        <v-alert v-if="!props.internship.agreement" type="warning" variant="tonal" title="Neodovzdané"
+                            text="Zmluva zatiaľ nebola nahratá." />
+
+                        <div v-else>
+                            <v-alert type="success" variant="tonal" title="Odovzdané" text="Zmluva bola nahratá." />
+
+                            <v-btn prepend-icon="mdi-download" color="blue" class="mr-2 mt-2" block
+                                @click="downloadAgreement">
+                                Stiahnuť
+                            </v-btn>
+                        </div>
+                    </v-card-text>
+                </v-card>
+            </v-col>
+
+            <!-- Výkaz -->
+            <v-col cols="12" md="6">
+                <v-card variant="outlined">
+                    <v-card-title class="d-flex align-center ga-2">
+                        <v-icon icon="mdi-file-clock-outline" />
+                        Výkaz
+                    </v-card-title>
+                    <v-card-text>
+                        <v-alert v-if="!props.internship.report" type="info" variant="tonal" title="Neodovzdané"
+                            text="Výkaz zatiaľ nebol nahratý." />
+
+                        <div v-else>
+                            <v-alert v-if="!props.internship.report_confirmed" type="error" variant="tonal"
+                                title="Nepotvrdené" text="Výkaz bol nahratý, ale zatiaľ nebol potvrdený firmou." />
+
+                            <v-alert v-else type="success" variant="tonal" title="Potvrdené"
+                                text="Výkaz bol nahratý, aj potvrdený firmou." />
+
+                            <v-btn prepend-icon="mdi-download" color="blue" class="mr-2 mt-2" block
+                                @click="downloadReport">
+                                Stiahnuť
+                            </v-btn>
+                        </div>
+                    </v-card-text>
+                </v-card>
+            </v-col>
+        </v-row>
+    </div>
+</template>

frontend/app/components/InternshipEditor.vue

@@ -77,7 +77,7 @@ function triggerSubmit() {
         start: dateTimeFixup(form.value.start as any),
         end: dateTimeFixup(form.value.end as any),
         year_of_study: form.value.year_of_study,
-        semester: form.value.semester === "Zimný" ? "WINTER" : "SUMMER",
+        semester: form.value.semester,
         position_description: form.value.description
     };
 

frontend/app/pages/dashboard/admin/internships/edit/[id].vue

@@ -94,8 +94,7 @@ const { data, error, refresh } = await useSanctumFetch<Internship>(`/api/interns
                     <hr />
 
                     <h2>Dokumenty</h2>
-                    <p>...</p>
-                    <hr />
+                    <InternshipDocumentViewer :internship="data!" />
                 </div>
             </div>
         </v-card>

frontend/app/pages/dashboard/company.vue

@@ -1,26 +0,0 @@
-<script setup lang="ts">
-import type { User } from '~/types/user';
-
-definePageMeta({
-    middleware: ['sanctum:auth', 'company-only'],
-});
-
-useSeoMeta({
-    title: "Portál firmy | ISOP",
-    ogTitle: "Portál firmy",
-    description: "Portál firmy ISOP",
-    ogDescription: "Portál firmy",
-});
-
-const user = useSanctumUser<User>();
-</script>
-
-<template>
-    <v-container fluid>
-        <v-card id="footer-card">
-            <h1>Vitajte, {{ user?.name }} <em>({{ user?.company_data?.name }})</em></h1>
-
-
-        </v-card>
-    </v-container>
-</template>

frontend/app/pages/dashboard/company/index.vue

@@ -0,0 +1,45 @@
+<script setup lang="ts">
+import type { User } from '~/types/user';
+
+definePageMeta({
+    middleware: ['sanctum:auth', 'company-only'],
+});
+
+useSeoMeta({
+    title: "Portál firmy | ISOP",
+    ogTitle: "Portál firmy",
+    description: "Portál firmy ISOP",
+    ogDescription: "Portál firmy",
+});
+
+const user = useSanctumUser<User>();
+
+</script>
+
+<template>
+    <v-container fluid>
+        <v-card id="page-container-card">
+            <h1>Vitajte, {{ user?.name }} <em>({{ user?.company_data?.name }})</em></h1>
+
+            <!-- spacer -->
+            <div style="height: 40px;"></div>
+
+            <v-btn prepend-icon="mdi-account-circle" color="blue" class="mr-2">
+                Môj profil
+            </v-btn>
+            <v-btn prepend-icon="mdi-briefcase" color="blue" class="mr-2" to="/dashboard/company/internships">
+                Praxe
+            </v-btn>
+
+            <!-- spacer -->
+            <div style="height: 40px;"></div>
+        </v-card>
+    </v-container>
+</template>
+
+<style scoped>
+#page-container-card {
+    padding-left: 10px;
+    padding-right: 10px;
+}
+</style>

frontend/app/pages/dashboard/company/internships/edit/[id].vue

@@ -0,0 +1,116 @@
+<script setup lang="ts">
+import { InternshipStatus, prettyInternshipStatus } from '~/types/internship_status';
+import type { Internship, NewInternship } from '~/types/internships';
+import { FetchError } from 'ofetch';
+
+definePageMeta({
+    middleware: ['sanctum:auth', 'company-only'],
+});
+
+useSeoMeta({
+    title: "Edit praxe | ISOP",
+    ogTitle: "Edit praxe",
+    description: "Edit praxe ISOP",
+    ogDescription: "Edit praxe",
+});
+
+const route = useRoute();
+const client = useSanctumClient();
+
+const loading = ref(false);
+const action_error = ref(null as null | string);
+const refreshKey = ref(0);
+
+const { data, refresh } = await useSanctumFetch<Internship>(`/api/internships/${route.params.id}`);
+
+async function handleUpdateOfBasicInfo(internship: NewInternship) {
+    action_error.value = null;
+    loading.value = true;
+
+    try {
+        await client(`/api/internships/${route.params.id}/basic`, {
+            method: 'POST',
+            body: internship
+        });
+
+        navigateTo("/dashboard/company/internships");
+    } catch (e) {
+        if (e instanceof FetchError) {
+            action_error.value = e.response?._data.message;
+        }
+    } finally {
+        loading.value = false;
+    }
+}
+</script>
+
+<template>
+    <v-container fluid>
+        <v-card id="page-container-card">
+            <h1>Edit praxe</h1>
+
+            <!-- spacer -->
+            <div style="height: 40px;"></div>
+
+            <!-- Čakajúca hláška -->
+            <v-alert v-if="loading" density="compact" text="Prosím čakajte..." title="Spracovávam" type="info"
+                class="mx-auto alert"></v-alert>
+
+            <!-- Chybová hláška -->
+            <v-alert v-if="action_error !== null" density="compact" :text="action_error" title="Chyba" type="error"
+                class="mx-auto alert"></v-alert>
+
+            <div>
+                <h2>Základné informácie</h2>
+                <v-alert v-if="data?.status.status !== InternshipStatus.SUBMITTED" density="compact"
+                    text='Vaša prax nie je v stave "Zadaná" a teda nemôžete meniť údaje.' title="Blokované" type="error"
+                    class="mx-auto alert"></v-alert>
+                <InternshipEditor v-else :internship="data!" :submit="handleUpdateOfBasicInfo" />
+            </div>
+
+            <hr />
+
+            <div>
+                <h2>Stav</h2>
+                <h4>Aktuálny stav</h4>
+                <p>{{ prettyInternshipStatus(data?.status.status!) }}</p>
+                <p>Poznámka: <em>{{ data?.status.note }}</em></p>
+                <p>Posledná zmena: <em>{{ data?.status.changed }}, {{ data?.status.modified_by.name }}</em></p>
+
+                <br />
+
+                <h4>História</h4>
+                <InternshipStatusHistoryView :internship="data!" />
+
+                <br />
+
+                <h4>Zmena stavu</h4>
+                <InternshipStatusEditor :internship="data!" @successful-submit="() => { refresh(); refreshKey++; }" />
+            </div>
+
+            <hr />
+
+            <div>
+                <h2>Nahratie dokumentov</h2>
+
+                <v-alert v-if="data?.status.status !== InternshipStatus.CONFIRMED" type="error" variant="tonal"
+                    title="Blokované" text='Vaša prax nie je v stave "Schválená" a teda nemôžete nahrať dokumenty.' />
+
+                <InternshipDocumentEditor v-else :internship="data!" @successful-submit="refresh" />
+            </div>
+        </v-card>
+    </v-container>
+</template>
+
+<style scoped>
+#page-container-card {
+    padding-left: 10px;
+    padding-right: 10px;
+    padding-bottom: 10px;
+}
+
+hr {
+    margin-top: 20px;
+    margin-bottom: 20px;
+}
+</style>

frontend/app/pages/dashboard/company/internships/index.vue

@@ -0,0 +1,87 @@
+<script setup lang="ts">
+import type { Internship } from '~/types/internships';
+import { prettyInternshipStatus } from '~/types/internship_status';
+
+definePageMeta({
+    middleware: ['sanctum:auth', 'company-only'],
+});
+
+useSeoMeta({
+    title: "Portál firmy - praxe | ISOP",
+    ogTitle: "Portál firmy - praxe",
+    description: "Portál firmy - praxe ISOP",
+    ogDescription: "Portál firmy - praxe",
+});
+
+const headers = [
+    { title: 'Študent', key: 'student', align: 'left' },
+    { title: 'Od', key: 'start', align: 'left' },
+    { title: 'Do', key: 'end', align: 'left' },
+    { title: 'Ročník', key: 'year_of_study', align: 'middle' },
+    { title: 'Semester', key: 'semester', align: 'middle' },
+    { title: 'Stav', key: 'status', align: 'middle' },
+    { title: 'Operácie', key: 'ops', align: 'middle' },
+];
+
+const { data, error } = await useSanctumFetch<Internship[]>('/api/internships/my');
+</script>
+
+<template>
+    <v-container fluid>
+        <v-card id="page-container-card">
+            <h1>Praxe študentov</h1>
+
+            <!-- spacer -->
+            <div style="height: 40px;"></div>
+
+            <!-- Chybová hláška -->
+            <v-alert v-if="error" density="compact" :text="error?.message" title="Chyba" type="error"
+                id="login-error-alert" class="mx-auto alert"></v-alert>
+
+            <v-table v-else>
+                <thead>
+                    <tr>
+                        <th v-for="header in headers" :class="'text-' + header.align">
+                            <strong>{{ header.title }}</strong>
+                        </th>
+                    </tr>
+                </thead>
+                <tbody>
+                    <tr v-for="item in data">
+                        <td>{{ item.user!.name }}</td>
+                        <td>{{ item.start }}</td>
+                        <td>{{ item.end }}</td>
+                        <td>{{ item.year_of_study }}</td>
+                        <td>{{ item.semester === "WINTER" ? "Zimný" : "Letný" }}</td>
+                        <td>
+                            <v-btn class="m-1" density="compact" base-color="grey">
+                                {{ prettyInternshipStatus(item.status.status) }}
+                            </v-btn>
+                        </td>
+                        <td class="text-left">
+                            <v-btn class="m-1 op-btn" density="compact" append-icon="mdi-pencil" base-color="orange"
+                                :to="'/dashboard/company/internships/edit/' + item.id">Editovať</v-btn>
+                            <v-btn class="m-1 op-btn" density="compact" append-icon="mdi-trash-can-outline"
+                                base-color="red" @click="async () => { }">Zmazať</v-btn>
+                        </td>
+                    </tr>
+                </tbody>
+            </v-table>
+        </v-card>
+    </v-container>
+</template>
+
+<style scoped>
+#page-container-card {
+    padding-left: 10px;
+    padding-right: 10px;
+}
+
+.alert {
+    margin-bottom: 10px;
+}
+
+.op-btn {
+    margin: 10px;
+}
+</style>

frontend/app/pages/dashboard/student/internship/edit/[id].vue

@@ -1,5 +1,7 @@
 <script setup lang="ts">
-import type { User } from '~/types/user';
+import { InternshipStatus, prettyInternshipStatus } from '~/types/internship_status';
+import type { Internship, NewInternship } from '~/types/internships';
+import { FetchError } from 'ofetch';
 
 definePageMeta({
     middleware: ['sanctum:auth', 'student-only'],
@@ -12,13 +14,84 @@ useSeoMeta({
     ogDescription: "Edit praxe",
 });
 
-const user = useSanctumUser<User>();
+const route = useRoute();
+const client = useSanctumClient();
+
+const loading = ref(false);
+const action_error = ref(null as null | string);
+
+const { data, refresh } = await useSanctumFetch<Internship>(`/api/internships/${route.params.id}`);
+
+async function handleUpdateOfBasicInfo(internship: NewInternship) {
+    action_error.value = null;
+    loading.value = true;
+
+    try {
+        await client(`/api/internships/${route.params.id}/basic`, {
+            method: 'POST',
+            body: internship
+        });
+
+        navigateTo("/dashboard/student");
+    } catch (e) {
+        if (e instanceof FetchError) {
+            action_error.value = e.response?._data.message;
+        }
+    } finally {
+        loading.value = false;
+    }
+}
 </script>
 
 <template>
     <v-container fluid>
         <v-card id="page-container-card">
-            <p>...</p>
+            <h1>Edit praxe</h1>
+
+            <!-- spacer -->
+            <div style="height: 40px;"></div>
+
+            <!-- Čakajúca hláška -->
+            <v-alert v-if="loading" density="compact" text="Prosím čakajte..." title="Spracovávam" type="info"
+                class="mx-auto alert"></v-alert>
+
+            <!-- Chybová hláška -->
+            <v-alert v-if="action_error !== null" density="compact" :text="action_error" title="Chyba" type="error"
+                class="mx-auto alert"></v-alert>
+
+            <div>
+                <h2>Základné informácie</h2>
+                <v-alert v-if="data?.status.status !== InternshipStatus.SUBMITTED" density="compact"
+                    text='Vaša prax nie je v stave "Zadaná" a teda nemôžete meniť údaje.' title="Blokované" type="error"
+                    class="mx-auto alert"></v-alert>
+                <InternshipEditor v-else :internship="data!" :submit="handleUpdateOfBasicInfo" />
+            </div>
+
+            <hr />
+
+            <div>
+                <h2>Stav</h2>
+                <h4>Aktuálny stav</h4>
+                <p>{{ prettyInternshipStatus(data?.status.status!) }}</p>
+                <p>Poznámka: <em>{{ data?.status.note }}</em></p>
+                <p>Posledná zmena: <em>{{ data?.status.changed }}, {{ data?.status.modified_by.name }}</em></p>
+
+                <br />
+
+                <h4>História</h4>
+                <InternshipStatusHistoryView :internship="data!" />
+            </div>
+
+            <hr />
+
+            <div>
+                <h2>Nahratie dokumentov</h2>
+
+                <v-alert v-if="data?.status.status !== InternshipStatus.CONFIRMED" type="error" variant="tonal"
+                    title="Blokované" text='Vaša prax nie je v stave "Schválená" a teda nemôžete nahrať dokumenty.' />
+
+                <InternshipDocumentEditor v-else :internship="data!" @successful-submit="refresh" />
+            </div>
         </v-card>
     </v-container>
 </template>
@@ -27,5 +100,11 @@ const user = useSanctumUser<User>();
 #page-container-card {
     padding-left: 10px;
     padding-right: 10px;
+    padding-bottom: 10px;
+}
+
+hr {
+    margin-top: 20px;
+    margin-bottom: 20px;
 }
 </style>

frontend/app/types/internships.ts

@@ -12,7 +12,9 @@ export interface Internship {
     year_of_study: number;
     semester: string;
     position_description: string;
-    agreement?: Uint8Array;
+    agreement: boolean;
+    report: boolean;
+    report_confirmed: boolean;
     status: InternshipStatusData;
 };
 
@@ -24,5 +26,4 @@ export interface NewInternship {
     year_of_study: number;
     semester: string;
     position_description: string;
-    agreement?: Uint8Array;
 };