- add cv management

resources/js/Pages/CV/Edit.vue

@@ -0,0 +1,126 @@
+<script setup>
+import { computed, ref } from 'vue';
+import { useForm } from '@inertiajs/inertia-vue3';
+import Input from '../../Share/Components/Input.vue';
+
+const props = defineProps({
+    cv: {
+        type: Object,
+        required: true,
+    }
+});
+
+const locations = ref(props.cv.locations);
+const locationsToString = computed({
+    get: () => locations.value.join(', '),
+    set: (val) => {
+        val = val.replace(', ', ',').replace(' , ', ',').replace(' ,', ',');
+        val = val.split(',');
+        val.forEach((element, key) => {
+            val[key] = element.trim();
+        });
+        locations.value = val;
+    }
+});
+
+const mission = ref(props.cv.mission);
+const missionToString = computed({
+    get: () => mission.value.join("\n"),
+    set: (value) => {
+        mission.value = value.split("\n");
+    }
+});
+
+const form = useForm({
+    recipient: props.cv.recipient,
+    email: props.cv.email,
+    phone_number: props.cv.phone.formattedNumber,
+    locations: locations,
+    mission: missionToString,
+    rodo: props.cv.rodo,
+    position: props.cv.position,
+});
+
+function updateCV() {
+    form.put(`/dashboard/cv/${props.cv.token}`);
+}
+</script>
+
+<template>
+    <InertiaHead title="Edycja danych do CV" />
+    <div class="p-4">
+        <header class="flex items-center justify-between pb-4">
+            <div class="flex items-center gap-2">
+                <InertiaLink
+                    as="button"
+                    href="/dashboard/cv"
+                    class="px-2 text-xl text-gray-700 hover:text-black"
+                    title="Wróć do listy CV"><FontAwesomeIcon :icon="['fas', 'caret-left']" /></InertiaLink>
+                <h1 class="text-3xl font-roboto font-light">Edycja danych do CV</h1>
+            </div>
+            <InertiaLink
+                as="button"
+                :href="`/dashboard/cv/${cv.token}/delete`"
+                class="flex items-center gap-2 px-2 py-1 text-red-600 hover:text-white hover:bg-red-600 rounded-md"
+                title="Usuń CV"
+                ><FontAwesomeIcon :icon="['fas', 'trash']" />Usuń</InertiaLink>
+        </header>
+        <div>
+            <form class="flex flex-col gap-4" @submit.prevent="updateCV">
+                <Input
+                    id="recipient"
+                    label="Firma gdzie jest składane CV"
+                    placeholder="Oki doki sp. z.o.o"
+                    v-model="form.recipient"
+                    :error="form.errors.recipient"
+                />
+                <Input
+                    id="email"
+                    type="email"
+                    label="E-mail"
+                    placeholder="Adres e-mail wyświetlany na CV"
+                    v-model="form.email"
+                    :error="form.errors.email"
+                />
+                <Input
+                    id="phone"
+                    label="Numer telefonu"
+                    placeholder="+48 123 456 789"
+                    v-model="form.phone_number"
+                    :error="form.errors.phone_number"
+                />
+                <Input
+                    id="locations"
+                    label="Lokalizacje"
+                    placeholder="Miejsca pracy."
+                    v-model="locationsToString"
+                    :error="form.errors.locations"
+                />
+                <Input
+                    id="position"
+                    label="Stanowisko"
+                    placeholder="Stanowisko na jakie jest rekrutacja."
+                    v-model="form.position"
+                    :error="form.errors.position"
+                />
+                <Input
+                    id="mission"
+                    type="textarea"
+                    label="Misja - wstęp"
+                    placeholder="Krótki opis, list motywacyjny."
+                    v-model="form.mission"
+                    :error="form.errors.mission"
+                />
+                <Input
+                    id="rodo"
+                    type="textarea"
+                    label="RODO"
+                    placeholder="Klauzula informacyjna RODO"
+                    v-model="form.rodo"
+                    :error="form.errors.rodo"
+                />
+                <button class="px-0.5 py-1 rounded-lg bg-[#436da7] border-4 border-[#436da7] text-white text-lg hover:bg-transparent hover:text-[#436da7]">Edytuj CV</button>
+            </form>
+        </div>
+    </div>
+</template>