This commit is contained in:
Adrian Hopek
2022-05-10 12:19:58 +02:00
parent 5c55f1860a
commit 22c5f7bb54
10 changed files with 163 additions and 76 deletions

View File

@@ -263,11 +263,25 @@
<template #form="{ element, index }">
<div class="gap-4 md:grid md:grid-cols-2 ">
<div class="py-4">
<Combobox
v-model="element.name"
label="Język"
:items="languages"
/>
<label
:for="`language-${index}-level`"
class="block text-sm font-medium text-gray-700"
>
Język
</label>
<div class="mt-2">
<Combobox
:id="`language-${index}-level`"
v-model="element.name"
:items="languages"
/>
<p
v-if="form.errors[`languages.${index}.name`]"
class="mt-2 text-sm text-red-600"
>
{{ form.errors[`languages.${index}.name`] }}
</p>
</div>
</div>
<div class="py-4">
<label
@@ -313,11 +327,25 @@
<template #form="{ element, index }">
<div class="gap-4 md:grid md:grid-cols-2 ">
<div class="py-4">
<Combobox
v-model="element.name"
label="Technologia"
:items="technologies"
/>
<label
:for="`technology-${index}-level`"
class="block text-sm font-medium text-gray-700"
>
Technologia
</label>
<div class="mt-2">
<Combobox
:id="`technology-${index}-level`"
v-model="element.name"
:items="technologies"
/>
<p
v-if="form.errors[`technologies.${index}.name`]"
class="mt-2 text-sm text-red-600"
>
{{ form.errors[`technologies.${index}.name`] }}
</p>
</div>
</div>
<div class="py-4">
<label
@@ -367,6 +395,7 @@
<textarea
:id="`project-description-${index}`"
v-model="element.description"
rows="5"
class="block w-full rounded-md shadow-sm sm:text-sm"
:class="{ 'border-red-300 text-red-900 focus:outline-none focus:ring-red-500 focus:border-red-500': form.errors[`projects.${index}.description`], 'focus:ring-blumilk-500 focus:border-blumilk-500 sm:text-sm border-gray-300': !form.errors[`projects.${index}.description`] }"
/>
@@ -386,13 +415,11 @@
Technologie
</label>
<div class="mt-1 sm:mt-0">
<input
<MultipleCombobox
:id="`project-technologies-${index}`"
v-model="element.technologies"
type="text"
class="block w-full rounded-md shadow-sm sm:text-sm"
:class="{ 'border-red-300 text-red-900 focus:outline-none focus:ring-red-500 focus:border-red-500': form.errors[`projects.${index}.technologies`], 'focus:ring-blumilk-500 focus:border-blumilk-500 sm:text-sm border-gray-300': !form.errors[`projects.${index}.technologies`] }"
>
:items="technologies"
/>
<p
v-if="form.errors[`projects.${index}.technologies`]"
class="mt-2 text-sm text-red-600"
@@ -458,6 +485,7 @@
<textarea
:id="`project-tasks-${index}`"
v-model="element.tasks"
rows="5"
class="block w-full rounded-md shadow-sm sm:text-sm"
:class="{ 'border-red-300 text-red-900 focus:outline-none focus:ring-red-500 focus:border-red-500': form.errors[`projects.${index}.tasks`], 'focus:ring-blumilk-500 focus:border-blumilk-500 sm:text-sm border-gray-300': !form.errors[`projects.${index}.tasks`] }"
/>
@@ -495,10 +523,12 @@
<script setup>
import { Listbox, ListboxOption, ListboxOptions, ListboxLabel, ListboxButton } from '@headlessui/vue'
import { SelectorIcon, CheckIcon } from '@heroicons/vue/outline'
import { ExclamationCircleIcon } from '@heroicons/vue/solid'
import { useForm } from '@inertiajs/inertia-vue3'
import FlatPickr from 'vue-flatpickr-component'
import DynamicSection from '@/Shared/Forms/DynamicSection'
import Combobox from '@/Shared/Forms/Combobox'
import MultipleCombobox from '@/Shared/Forms/MultipleCombobox'
import LevelPicker from '@/Shared/Forms/LevelPicker'
import useLevels from '@/Composables/useLevels'
@@ -527,7 +557,7 @@ const form = useForm({
function addProject() {
form.projects.push({
description: null,
technologies: null,
technologies: [],
tasks: null,
startDate: null,
endDate: null,

View File

@@ -263,17 +263,25 @@
<template #form="{ element, index }">
<div class="gap-4 md:grid md:grid-cols-2 ">
<div class="py-4">
<Combobox
v-model="element.name"
label="Język"
:items="languages"
/>
<p
v-if="form.errors[`languages.${index}.name`]"
class="mt-2 text-sm text-red-600"
<label
:for="`language-${index}-level`"
class="block text-sm font-medium text-gray-700"
>
{{ form.errors[`languages.${index}.name`] }}
</p>
Język
</label>
<div class="mt-2">
<Combobox
:id="`language-${index}-level`"
v-model="element.name"
:items="languages"
/>
<p
v-if="form.errors[`languages.${index}.name`]"
class="mt-2 text-sm text-red-600"
>
{{ form.errors[`languages.${index}.name`] }}
</p>
</div>
</div>
<div class="py-4">
<label
@@ -319,17 +327,25 @@
<template #form="{ element, index }">
<div class="gap-4 md:grid md:grid-cols-2 ">
<div class="py-4">
<Combobox
v-model="element.name"
label="Technologia"
:items="technologies"
/>
<p
v-if="form.errors[`technologies.${index}.name`]"
class="mt-2 text-sm text-red-600"
<label
:for="`technology-${index}-level`"
class="block text-sm font-medium text-gray-700"
>
{{ form.errors[`technologies.${index}.name`] }}
</p>
Technologia
</label>
<div class="mt-2">
<Combobox
:id="`technology-${index}-level`"
v-model="element.name"
:items="technologies"
/>
<p
v-if="form.errors[`technologies.${index}.name`]"
class="mt-2 text-sm text-red-600"
>
{{ form.errors[`technologies.${index}.name`] }}
</p>
</div>
</div>
<div class="py-4">
<label
@@ -379,6 +395,7 @@
<textarea
:id="`project-description-${index}`"
v-model="element.description"
rows="5"
class="block w-full rounded-md shadow-sm sm:text-sm"
:class="{ 'border-red-300 text-red-900 focus:outline-none focus:ring-red-500 focus:border-red-500': form.errors[`projects.${index}.description`], 'focus:ring-blumilk-500 focus:border-blumilk-500 sm:text-sm border-gray-300': !form.errors[`projects.${index}.description`] }"
/>
@@ -398,13 +415,11 @@
Technologie
</label>
<div class="mt-1 sm:mt-0">
<input
<MultipleCombobox
:id="`project-technologies-${index}`"
v-model="element.technologies"
type="text"
class="block w-full rounded-md shadow-sm sm:text-sm"
:class="{ 'border-red-300 text-red-900 focus:outline-none focus:ring-red-500 focus:border-red-500': form.errors[`projects.${index}.technologies`], 'focus:ring-blumilk-500 focus:border-blumilk-500 sm:text-sm border-gray-300': !form.errors[`projects.${index}.technologies`] }"
>
:items="technologies"
/>
<p
v-if="form.errors[`projects.${index}.technologies`]"
class="mt-2 text-sm text-red-600"
@@ -470,7 +485,7 @@
<textarea
:id="`project-tasks-${index}`"
v-model="element.tasks"
rows="3"
rows="5"
class="block w-full rounded-md shadow-sm sm:text-sm"
:class="{ 'border-red-300 text-red-900 focus:outline-none focus:ring-red-500 focus:border-red-500': form.errors[`projects.${index}.tasks`], 'focus:ring-blumilk-500 focus:border-blumilk-500 sm:text-sm border-gray-300': !form.errors[`projects.${index}.tasks`] }"
/>
@@ -513,6 +528,7 @@ import { useForm } from '@inertiajs/inertia-vue3'
import FlatPickr from 'vue-flatpickr-component'
import DynamicSection from '@/Shared/Forms/DynamicSection'
import Combobox from '@/Shared/Forms/Combobox'
import MultipleCombobox from '@/Shared/Forms/MultipleCombobox'
import LevelPicker from '@/Shared/Forms/LevelPicker'
import useLevels from '@/Composables/useLevels'
@@ -548,7 +564,7 @@ const form = useForm({
function addProject() {
form.projects.push({
description: null,
technologies: null,
technologies: [],
tasks: null,
startDate: null,
endDate: null,

View File

@@ -25,12 +25,6 @@
>
Użytkownik
</th>
<th
scope="col"
class="py-3 px-4 text-xs font-semibold tracking-wider text-left text-gray-500 uppercase whitespace-nowrap"
>
Opis
</th>
<th
scope="col"
class="py-3 px-4 text-xs font-semibold tracking-wider text-left text-gray-500 uppercase whitespace-nowrap"
@@ -43,6 +37,30 @@
>
Data aktualizacji
</th>
<th
scope="col"
class="py-3 px-4 text-xs font-semibold tracking-wider text-left text-gray-500 uppercase whitespace-nowrap"
>
Szkoły
</th>
<th
scope="col"
class="py-3 px-4 text-xs font-semibold tracking-wider text-left text-gray-500 uppercase whitespace-nowrap"
>
Języki
</th>
<th
scope="col"
class="py-3 px-4 text-xs font-semibold tracking-wider text-left text-gray-500 uppercase whitespace-nowrap"
>
Technologie
</th>
<th
scope="col"
class="py-3 px-4 text-xs font-semibold tracking-wider text-left text-gray-500 uppercase whitespace-nowrap"
>
Projekty
</th>
<th
scope="col"
class="py-3 px-4 text-xs font-semibold tracking-wider text-left text-gray-500 uppercase whitespace-nowrap"
@@ -76,18 +94,27 @@
</div>
</div>
<template v-else>
{{ resume.name }}
<span class="text-sm font-medium text-gray-900 break-all">{{ resume.name }}</span>
</template>
</td>
<td class="p-4 text-sm text-gray-500 whitespace-nowrap">
{{ resume.description ?? '-' }}
</td>
<td class="p-4 text-sm text-gray-500 whitespace-nowrap">
{{ resume.createdAt }}
</td>
<td class="p-4 text-sm text-gray-500 whitespace-nowrap">
{{ resume.updatedAt }}
</td>
<td class="p-4 text-sm text-gray-500 whitespace-nowrap">
{{ resume.educationCount }}
</td>
<td class="p-4 text-sm text-gray-500 whitespace-nowrap">
{{ resume.languageCount }}
</td>
<td class="p-4 text-sm text-gray-500 whitespace-nowrap">
{{ resume.technologyCount }}
</td>
<td class="p-4 text-sm text-gray-500 whitespace-nowrap">
{{ resume.projectCount }}
</td>
<td class="p-4 text-sm text-right text-gray-500 whitespace-nowrap">
<Menu
as="div"