feat: add basic internship editor

frontend/app/components/InternshipEditor.vue

@@ -0,0 +1,133 @@
+<script setup lang="ts">
+import type { CompanyData } from '~/types/company_data';
+import type { NewInternship } from '~/types/internships';
+import type { User } from '~/types/user';
+
+const rules = {
+    required: (v: any) => (!!v && String(v).trim().length > 0) || 'Povinné pole',
+    mustAgree: (v: boolean) => v === true || 'Je potrebné potvrdiť',
+};
+
+const year_of_study_choices = [
+    {
+        title: '1',
+        subtitle: 'bakalárske',
+    },
+    {
+        title: '2',
+        subtitle: 'bakalárske',
+    },
+    {
+        title: '3',
+        subtitle: 'bakalárske',
+    },
+    {
+        title: '4',
+        subtitle: 'magisterské',
+    },
+    {
+        title: '5',
+        subtitle: 'magisterské',
+    }
+];
+
+const props = defineProps({
+    start: {
+        type: String,
+        required: false,
+        default: ''
+    },
+    end: {
+        type: String,
+        required: false,
+        default: ''
+    },
+    year_of_study: {
+        type: Number,
+        required: false,
+        default: 1
+    },
+    semester: {
+        type: String,
+        required: false,
+        default: ''
+    },
+    company_id: {
+        type: Number,
+        required: false,
+        default: -1
+    },
+    description: {
+        type: String,
+        required: false,
+        default: ''
+    },
+    submit: {
+        type: Function as PropType<(internship: NewInternship) => void>,
+        required: true
+    }
+});
+
+const isValid = ref(false);
+const form = ref({
+    start: props.start,
+    end: props.end,
+    year_of_study: props.year_of_study,
+    semester: props.semester,
+    company_id: props.company_id === -1 ? null : props.company_id,
+    description: props.description,
+    consent: false,
+});
+
+const user = useSanctumUser<User>();
+
+function triggerSubmit() {
+    const new_internship: NewInternship = {
+        user_id: user.value?.id!,
+        company_id: form.value.company_id!,
+        start: form.value.start,
+        end: form.value.end,
+        year_of_study: form.value.year_of_study,
+        semester: form.value.semester === "Zimný" ? "WINTER" : "SUMMER",
+        position_description: form.value.description
+    }
+
+    props.submit(new_internship);
+}
+
+const { data, error } = await useSanctumFetch<CompanyData[]>('/api/companies/simple');
+</script>
+
+<template>
+    <v-form v-model="isValid" @submit.prevent="triggerSubmit">
+        <v-date-input v-model="form.start" :rules="[rules.required]" clearable label="Začiatok"></v-date-input>
+        <v-date-input v-model="form.end" :rules="[rules.required]" clearable label="Koniec"></v-date-input>
+
+        <v-select v-model="form.year_of_study" clearable label="Ročník" :items="year_of_study_choices"
+            :item-props="(item) => { return { title: item.title, subtitle: item.subtitle } }"
+            :rules="[rules.required]"></v-select>
+
+        <v-select v-model="form.semester" clearable label="Semester" :items="['Zimný', 'Letný']"
+            :rules="[rules.required]"></v-select>
+
+        <v-select v-model="form.company_id" clearable label="Firma" :items="[{ title: 'a', subtitle: 'b', value: 0 }]"
+            :item-props="(item) => { return { title: item.title, subtitle: item.subtitle } }"
+            :rules="[rules.required]"></v-select>
+
+        <v-textarea clearable label="Popis práce" :rules="[rules.required]"></v-textarea>
+
+        <v-checkbox v-model="form.consent" :rules="[rules.mustAgree]" label="Potvrdzujem, že zadané údaje sú pravdivé"
+            density="comfortable" />
+
+        <v-btn type="submit" color="success" size="large" block :disabled="!isValid || !form.consent">
+            Pridať
+        </v-btn>
+    </v-form>
+</template>
+
+<style scoped>
+form {
+    width: 80%;
+    margin: 0 auto;
+}
+</style>

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

@@ -38,7 +38,7 @@ const { data, error } = await useSanctumFetch<Internship[]>('/api/internships');
             <!-- spacer -->
             <div style="height: 40px;"></div>
 
-            <v-btn prepend-icon="mdi-plus" color="blue" class="mr-2">
+            <v-btn prepend-icon="mdi-plus" color="blue" class="mr-2" to="/dashboard/student/internship/create">
                 Pridať
             </v-btn>
             <v-btn prepend-icon="mdi-pencil" color="orange" class="mr-2">

frontend/app/pages/dashboard/student/internship/create.vue

@@ -0,0 +1,36 @@
+<script setup lang="ts">
+import type { User } from '~/types/user';
+
+definePageMeta({
+    middleware: ['sanctum:auth', 'student-only'],
+});
+
+useSeoMeta({
+    title: "Vytvorenie praxe | ISOP",
+    ogTitle: "Vytvorenie praxe",
+    description: "Vytvorenie praxe ISOP",
+    ogDescription: "Vytvorenie praxe",
+});
+
+const user = useSanctumUser<User>();
+</script>
+
+<template>
+    <v-container fluid>
+        <v-card id="page-container-card">
+            <h1>Vytvorenie praxe</h1>
+
+            <br />
+
+            <InternshipEditor :submit="(form: any) => console.log(form)" />
+        </v-card>
+    </v-container>
+</template>
+
+<style scoped>
+#page-container-card {
+    padding-left: 10px;
+    padding-right: 10px;
+    padding-bottom: 10px;
+}
+</style>

frontend/app/types/internships.ts

@@ -15,11 +15,11 @@ export interface Internship {
 };
 
 export interface NewInternship {
-    user_id: string;
+    user_id: number;
-    company_id: string;
+    company_id: number;
-    start: number;
+    start: string;
-    end: number;
+    end: string;
-    year_of_study: boolean;
+    year_of_study: number;
     semester: string;
     position_description: string;
     agreement?: Uint8Array;