package-lock.json

@@ -4,6 +4,7 @@
     "requires": true,
     "packages": {
         "": {
+            "name": "toby",
             "hasInstallScript": true,
             "dependencies": {
                 "@headlessui/vue": "^1.5.0",
@@ -31,7 +32,8 @@
                 "vue-loader": "^17.0.0",
                 "vue-material-design-icons": "^5.0.0",
                 "vue-toastification": "^2.0.0-rc.5",
-                "vue3-popper": "^1.4.2"
+                "vue3-popper": "^1.4.2",
+                "vuedraggable": "^4.1.0"
             },
             "devDependencies": {
                 "eslint": "^8.12.0",
@@ -2642,9 +2644,9 @@
             }
         },
         "node_modules/async": {
-            "version": "2.6.3",
+            "version": "2.6.4",
-            "resolved": "https://registry.npmjs.org/async/-/async-2.6.3.tgz",
+            "resolved": "https://registry.npmjs.org/async/-/async-2.6.4.tgz",
-            "integrity": "sha512-zflvls11DCy+dQWzTW2dzuilv8Z5X/pjfmZOWba6TNIVDm+2UDaJmXSOXlasHKfNBs8oo3M0aT50fDEWfKZjXg==",
+            "integrity": "sha512-mzo5dfJYwAn29PeiJ0zvwTo04zj8HDJj0Mn8TD7sno7q12prdbnasKJHhkm2c1LgrhlJ0teaea8860oxi51mGA==",
             "dependencies": {
                 "lodash": "^4.17.14"
             }
@@ -7983,6 +7985,11 @@
                 "websocket-driver": "^0.7.4"
             }
         },
+        "node_modules/sortablejs": {
+            "version": "1.14.0",
+            "resolved": "https://registry.npmjs.org/sortablejs/-/sortablejs-1.14.0.tgz",
+            "integrity": "sha512-pBXvQCs5/33fdN1/39pPL0NZF20LeRbLQ5jtnheIPN9JQAaufGjKdWduZn4U7wCtVuzKhmRkI0DFYHYRbB2H1w=="
+        },
         "node_modules/source-list-map": {
             "version": "2.0.1",
             "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-2.0.1.tgz",
@@ -8798,6 +8805,17 @@
                 "vue": "^3.2.20"
             }
         },
+        "node_modules/vuedraggable": {
+            "version": "4.1.0",
+            "resolved": "https://registry.npmjs.org/vuedraggable/-/vuedraggable-4.1.0.tgz",
+            "integrity": "sha512-FU5HCWBmsf20GpP3eudURW3WdWTKIbEIQxh9/8GE806hydR9qZqRRxRE3RjqX7PkuLuMQG/A7n3cfj9rCEchww==",
+            "dependencies": {
+                "sortablejs": "1.14.0"
+            },
+            "peerDependencies": {
+                "vue": "^3.0.1"
+            }
+        },
         "node_modules/watchpack": {
             "version": "2.3.1",
             "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.3.1.tgz",
@@ -11311,9 +11329,9 @@
             }
         },
         "async": {
-            "version": "2.6.3",
+            "version": "2.6.4",
-            "resolved": "https://registry.npmjs.org/async/-/async-2.6.3.tgz",
+            "resolved": "https://registry.npmjs.org/async/-/async-2.6.4.tgz",
-            "integrity": "sha512-zflvls11DCy+dQWzTW2dzuilv8Z5X/pjfmZOWba6TNIVDm+2UDaJmXSOXlasHKfNBs8oo3M0aT50fDEWfKZjXg==",
+            "integrity": "sha512-mzo5dfJYwAn29PeiJ0zvwTo04zj8HDJj0Mn8TD7sno7q12prdbnasKJHhkm2c1LgrhlJ0teaea8860oxi51mGA==",
             "requires": {
                 "lodash": "^4.17.14"
             }
@@ -15219,6 +15237,11 @@
                 "websocket-driver": "^0.7.4"
             }
         },
+        "sortablejs": {
+            "version": "1.14.0",
+            "resolved": "https://registry.npmjs.org/sortablejs/-/sortablejs-1.14.0.tgz",
+            "integrity": "sha512-pBXvQCs5/33fdN1/39pPL0NZF20LeRbLQ5jtnheIPN9JQAaufGjKdWduZn4U7wCtVuzKhmRkI0DFYHYRbB2H1w=="
+        },
         "source-list-map": {
             "version": "2.0.1",
             "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-2.0.1.tgz",
@@ -15805,6 +15828,14 @@
                 "debounce": "^1.2.1"
             }
         },
+        "vuedraggable": {
+            "version": "4.1.0",
+            "resolved": "https://registry.npmjs.org/vuedraggable/-/vuedraggable-4.1.0.tgz",
+            "integrity": "sha512-FU5HCWBmsf20GpP3eudURW3WdWTKIbEIQxh9/8GE806hydR9qZqRRxRE3RjqX7PkuLuMQG/A7n3cfj9rCEchww==",
+            "requires": {
+                "sortablejs": "1.14.0"
+            }
+        },
         "watchpack": {
             "version": "2.3.1",
             "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.3.1.tgz",

package.json

@@ -38,7 +38,8 @@
         "vue-loader": "^17.0.0",
         "vue-material-design-icons": "^5.0.0",
         "vue-toastification": "^2.0.0-rc.5",
-        "vue3-popper": "^1.4.2"
+        "vue3-popper": "^1.4.2",
+        "vuedraggable": "^4.1.0"
     },
     "devDependencies": {
         "eslint": "^8.12.0",

resources/js/Pages/Resumes/Create.vue

@@ -1,187 +1,261 @@
 <template>
   <InertiaHead title="Dodawanie CV" />
-  <div class="bg-white shadow-md">
+  <div class="mx-auto w-full max-w-7xl bg-white shadow-md">
     <div class="p-4 sm:px-6">
       <h2 class="text-lg font-medium leading-6 text-gray-900">
         Dodaj CV
       </h2>
     </div>
-    <form
+    <form class="flex flex-col justify-center py-8 px-6 space-y-8 border-t border-gray-200 divide-y divide-gray-200">
-      class="px-6 border-t border-gray-200"
+      <div class="space-y-8 sm:space-y-5">
-      @submit.prevent="createResume"
+        <div>
-    >
+          <h3 class="text-lg font-medium leading-6 text-gray-900">
-      <h1 class="text-gray-900 font-medium mt-2">Informacje podstawowe</h1>
+            Dane podstawowe
-      <div class="items-center py-4 sm:grid sm:grid-cols-3">
+          </h3>
-        <label
+          <div class="pt-4">
-          for="firstName"
+            <div class="items-center py-4 sm:grid sm:grid-cols-2">
-          class="block text-sm font-medium text-gray-700 sm:mt-px"
+              <label
-        >
+                for="firstName"
-          Imię
+                class="block text-sm font-medium text-gray-700 sm:mt-px"
-        </label>
+              >
-        <div class="mt-1 sm:col-span-2 sm:mt-0">
+                Imię
-          <input
+              </label>
-            id="firstName"
+              <div class="mt-1 sm:mt-0">
-            v-model="form.firstName"
+                <input
-            type="text"
+                  id="firstName"
-            class="block w-full max-w-lg rounded-md shadow-sm sm:text-sm"
+                  v-model="form.firstName"
-            :class="{ 'border-red-300 text-red-900 focus:outline-none focus:ring-red-500 focus:border-red-500': form.errors.firstName, 'focus:ring-blumilk-500 focus:border-blumilk-500 sm:text-sm border-gray-300': !form.errors.firstName }"
+                  type="text"
-          >
+                  class="block w-full rounded-md shadow-sm sm:text-sm"
-          <p
+                  :class="{ 'border-red-300 text-red-900 focus:outline-none focus:ring-red-500 focus:border-red-500': form.errors.firstName, 'focus:ring-blumilk-500 focus:border-blumilk-500 sm:text-sm border-gray-300': !form.errors.firstName }"
-            v-if="form.errors.firstName"
+                >
-            class="mt-2 text-sm text-red-600"
+                <p
-          >
+                  v-if="form.errors.firstName"
-            {{ form.errors.firstName }}
+                  class="mt-2 text-sm text-red-600"
-          </p>
+                >
+                  {{ form.errors.firstName }}
+                </p>
+              </div>
+            </div>
+            <div class="items-center py-4 sm:grid sm:grid-cols-2">
+              <label
+                for="lastName"
+                class="block text-sm font-medium text-gray-700 sm:mt-px"
+              >
+                Nazwisko
+              </label>
+              <div class="mt-1 sm:mt-0">
+                <input
+                  id="lastName"
+                  v-model="form.lastName"
+                  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.lastName, 'focus:ring-blumilk-500 focus:border-blumilk-500 sm:text-sm border-gray-300': !form.errors.lastName }"
+                >
+                <p
+                  v-if="form.errors.lastName"
+                  class="mt-2 text-sm text-red-600"
+                >
+                  {{ form.errors.lastName }}
+                </p>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div>
+          <h3 class="text-lg font-medium leading-6 text-gray-900">
+            Edukacja
+          </h3>
+          <div class="pt-4 space-y-4">
+            <div
+              v-for="(element, index) in form.elements"
+              :key="index"
+              class="flex items-start"
+            >
+              <Disclosure
+                v-slot="{ open }"
+                default-open
+                as="div"
+                class="flex-1 border border-gray-200"
+              >
+                <div class="flex">
+                  <DisclosureButton :class="['transition transition-colors rounded-md group w-full max-w-full overflow-hidden flex items-center justify-between p-4 font-semibold text-gray-500 hover:text-blumilk-500 transition transition-colors rounded-md focus:outline-none']">
+                    <div class="break-all line-clamp-1 text-md">
+                      {{ element.school ? element.school : '(Nieokreślony)' }}
+                    </div>
+                    <div class="ml-2">
+                      <svg
+                        :class="[open ? '-rotate-90' : 'rotate-90', 'h-6 w-6 transform transition-transform ease-in-out duration-150']"
+                        viewBox="0 0 20 20"
+                      >
+                        <path
+                          d="M6 6L14 10L6 14V6Z"
+                          fill="currentColor"
+                        />
+                      </svg>
+                    </div>
+                  </DisclosureButton>
+                </div>
+                <DisclosurePanel
+                  as="div"
+                  class="py-2 px-4 border-t border-gray-200"
+                >
+                  <div>
+                    <div class="items-center py-4 sm:grid sm:grid-cols-2">
+                      <label
+                        :for="`school-${index}`"
+                        class="block text-sm font-medium text-gray-700 sm:mt-px"
+                      >
+                        Szkoła
+                      </label>
+                      <div class="mt-1 sm:mt-0">
+                        <input
+                          :id="`school-${index}`"
+                          v-model="element.school"
+                          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[`elements.${index}.school`], 'focus:ring-blumilk-500 focus:border-blumilk-500 sm:text-sm border-gray-300': !form.errors[`elements.${index}.school`] }"
+                        >
+                        <p
+                          v-if="form.errors[`elements.${index}.school`]"
+                          class="mt-2 text-sm text-red-600"
+                        >
+                          {{ form.errors[`elements.${index}.school`] }}
+                        </p>
+                      </div>
+                    </div>
+                    <div class="items-center py-4 sm:grid sm:grid-cols-2">
+                      <label
+                        :for="`degree-${index}`"
+                        class="block text-sm font-medium text-gray-700 sm:mt-px"
+                      >
+                        Stopień
+                      </label>
+                      <div class="mt-1 sm:mt-0">
+                        <input
+                          :id="`degree-${index}`"
+                          v-model="element.degree"
+                          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[`elements.${index}.degree`], 'focus:ring-blumilk-500 focus:border-blumilk-500 sm:text-sm border-gray-300': !form.errors[`elements.${index}.degree`] }"
+                        >
+                        <p
+                          v-if="form.errors[`elements.${index}.degree`]"
+                          class="mt-2 text-sm text-red-600"
+                        >
+                          {{ form.errors[`elements.${index}.degree`] }}
+                        </p>
+                      </div>
+                    </div>
+                    <div class="items-center py-4 sm:grid sm:grid-cols-2">
+                      <label
+                        :for="`fieldOfStudy-${index}`"
+                        class="block text-sm font-medium text-gray-700 sm:mt-px"
+                      >
+                        Kierunek/Specjalizacja
+                      </label>
+                      <div class="mt-1 sm:mt-0">
+                        <input
+                          :id="`fieldOfStudy-${index}`"
+                          v-model="element.fieldOfStudy"
+                          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[`elements.${index}.fieldOfStudy`], 'focus:ring-blumilk-500 focus:border-blumilk-500 sm:text-sm border-gray-300': !form.errors[`elements.${index}.fieldOfStudy`] }"
+                        >
+                        <p
+                          v-if="form.errors[`elements.${index}.fieldOfStudy`]"
+                          class="mt-2 text-sm text-red-600"
+                        >
+                          {{ form.errors[`elements.${index}.fieldOfStudy`] }}
+                        </p>
+                      </div>
+                    </div>
+                    <div class="items-center py-4 sm:grid sm:grid-cols-2">
+                      <label
+                        :for="`startDate-${index}`"
+                        class="block text-sm font-medium text-gray-700 sm:mt-px"
+                      >
+                        Data rozpoczęcia
+                      </label>
+                      <div class="mt-1 sm:mt-0">
+                        <FlatPickr
+                          :id="`startDate-${index}`"
+                          v-model="form.startDate"
+                          placeholder="Wybierz datę"
+                          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[`elements.${index}.startDate`], 'focus:ring-blumilk-500 focus:border-blumilk-500 sm:text-sm border-gray-300': !form.errors[`elements.${index}.startDate`] }"
+                        />
+                        <p
+                          v-if="form.errors[`elements.${index}.startDate`]"
+                          class="mt-2 text-sm text-red-600"
+                        >
+                          {{ form.errors[`elements.${index}.startDate`] }}
+                        </p>
+                      </div>
+                    </div>
+                    <div class="items-center py-4 sm:grid sm:grid-cols-2">
+                      <label
+                        :for="`endDate-${index}`"
+                        class="block text-sm font-medium text-gray-700 sm:mt-px"
+                      >
+                        Data zakończenia
+                      </label>
+                      <div class="mt-1 sm:mt-0">
+                        <FlatPickr
+                          :id="`endDate-${index}`"
+                          v-model="form.endDate"
+                          placeholder="Wybierz datę"
+                          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[`elements.${index}.endDate`], 'focus:ring-blumilk-500 focus:border-blumilk-500 sm:text-sm border-gray-300': !form.errors[`elements.${index}.endDate`] }"
+                        />
+                        <p
+                          v-if="form.errors[`elements.${index}.endDate`]"
+                          class="mt-2 text-sm text-red-600"
+                        >
+                          {{ form.errors[`elements.${index}.endDate`] }}
+                        </p>
+                      </div>
+                    </div>
+                  </div>
+                </DisclosurePanel>
+              </Disclosure>
+              <button
+                class="py-4 pl-4 text-red-500 hover:text-red-600 hover:scale-110"
+                type="button"
+                @click="form.elements.splice(index, 1)"
+              >
+                <TrashIcon class="w-5 h-5 text-red-500" />
+              </button>
+            </div>
+            <button
+              type="button"
+              class="p-4 w-full font-semibold text-center text-blumilk-600 hover:bg-blumilk-25 focus:outline-none transition-colors"
+              @click="form.elements.push({
+                school: null,
+                degree: null,
+                fieldOfStudy: null,
+                startDate: null,
+                endDate: null,
+              })"
+            >
+              Dodaj element
+            </button>
+          </div>
         </div>
       </div>
-      <div class="items-center py-4 sm:grid sm:grid-cols-3">
+
-        <label
+      <div class="pt-5">
-          for="lastName"
+        <div class="flex justify-end">
-          class="block text-sm font-medium text-gray-700 sm:mt-px"
+          <button
-        >
+            type="button"
-          Nazwisko
+            class="py-2 px-4 text-sm font-medium text-gray-700 bg-white hover:bg-gray-50 rounded-md border border-gray-300 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 shadow-sm"
-        </label>
-        <div class="mt-1 sm:col-span-2 sm:mt-0">
-          <input
-            id="lastName"
-            v-model="form.lastName"
-            type="text"
-            class="block w-full max-w-lg 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.lastName, 'focus:ring-blumilk-500 focus:border-blumilk-500 sm:text-sm border-gray-300': !form.errors.lastName }"
           >
-          <p
+            Cancel
-            v-if="form.errors.lastName"
+          </button>
-            class="mt-2 text-sm text-red-600"
-          >
-            {{ form.errors.lastName }}
-          </p>
-        </div>
-      </div>
-      <div class="items-center py-4 sm:grid sm:grid-cols-3">
-        <label
-          class="block text-sm font-medium text-gray-700 sm:mt-px"
-        >
-          Języki
-        </label>
-        <div class="mt-1 sm:col-span-2 sm:mt-0">
-          <p>Języki - taki bajer jak na JustJoinIT</p>
-        </div>
-      </div>
-      <h1 class="text-gray-900 font-medium mt-4">Wykształcenie</h1>
-      <div class="mt-2">
-        <InertiaLink
-          href="#"
-          class="py-2 px-4 text-sm font-medium text-blumilk-700 bg-white hover:bg-blumilk-25 rounded-md border border-blumilk-300 focus:outline-none focus:ring-2 focus:ring-blumilk-500 focus:ring-offset-2 shadow-sm"
-        >
-          Dodaj wykształcenie
-        </InertiaLink>
-      </div>
-      
-      <div class="items-center py-4 sm:grid sm:grid-cols-3">
-       <label
-         for="university"
-         class="block text-sm font-medium text-gray-700 sm:mt-px">
-         Uczelnia
-       </label>
-       <div class="mt-1 sm:col-span-2 sm:mt-0">
-         <input
-           id="university"
-           v-model="form.firstName"
-           type="text"
-           class="block w-full max-w-lg 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.firstName, 'focus:ring-blumilk-500 focus:border-blumilk-500 sm:text-sm border-gray-300': !form.errors.firstName }"
-         >
-         <p
-           v-if="form.errors.firstName"
-           class="mt-2 text-sm text-red-600"
-         >
-           {{ form.errors.firstName }}
-         </p>
-       </div>
-     </div>
-       <div class="items-center py-4 sm:grid sm:grid-cols-3">
-         <label
-           for="title"
-           class="block text-sm font-medium text-gray-700 sm:mt-px"
-         >
-           Tytuł
-         </label>
-         <div class="mt-1 sm:col-span-2 sm:mt-0">
-           <input
-             id="title"
-             v-model="form.firstName"
-             type="text"
-             class="block w-full max-w-lg 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.firstName, 'focus:ring-blumilk-500 focus:border-blumilk-500 sm:text-sm border-gray-300': !form.errors.firstName }"
-           >
-           <p
-             v-if="form.errors.firstName"
-             class="mt-2 text-sm text-red-600"
-           >
-             {{ form.errors.firstName }}
-           </p>
-         </div>
-     </div>
-     <div class="items-center py-4 sm:grid sm:grid-cols-3">
-       <label
-         for="subject"
-         class="block text-sm font-medium text-gray-700 sm:mt-px"
-       >
-         Kierunek studiów
-       </label>
-       <div class="mt-1 sm:col-span-2 sm:mt-0">
-         <input
-           id="subject"
-           v-model="form.firstName"
-           type="text"
-           class="block w-full max-w-lg 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.firstName, 'focus:ring-blumilk-500 focus:border-blumilk-500 sm:text-sm border-gray-300': !form.errors.firstName }"
-         >
-         <p
-           v-if="form.errors.firstName"
-           class="mt-2 text-sm text-red-600"
-         >
-           {{ form.errors.firstName }}
-         </p>
-       </div>
-     </div>
-      <div class="items-center py-4 sm:grid sm:grid-cols-3">
-        <label
-          for="subject"
-          class="block text-sm font-medium text-gray-700 sm:mt-px"
-        >
-          Rok ukończenia
-        </label>
-        <div class="mt-1 sm:col-span-2 sm:mt-0">
-          <input
-            id="subject"
-            v-model="form.firstName"
-            type="text"
-            class="block w-full max-w-lg 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.firstName, 'focus:ring-blumilk-500 focus:border-blumilk-500 sm:text-sm border-gray-300': !form.errors.firstName }"
-          >
-          <p
-            v-if="form.errors.firstName"
-            class="mt-2 text-sm text-red-600"
-          >
-            {{ form.errors.firstName }}
-          </p>
-        </div>
-      </div>
-      <div class="flex justify-end py-3">
-        <div class="space-x-3">
-          <InertiaLink
-            href="/users"
-            class="py-2 px-4 text-sm font-medium text-gray-700 bg-white hover:bg-gray-50 rounded-md border border-gray-300 focus:outline-none focus:ring-2 focus:ring-blumilk-500 focus:ring-offset-2 shadow-sm"
-          >
-            Anuluj
-          </InertiaLink>
           <button
             type="submit"
-            :disabled="form.processing"
+            class="inline-flex justify-center py-2 px-4 ml-3 text-sm font-medium text-white bg-indigo-600 hover:bg-indigo-700 rounded-md border border-transparent focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 shadow-sm"
-            class="inline-flex justify-center py-2 px-4 text-sm font-medium text-white bg-blumilk-600 hover:bg-blumilk-700 rounded-md border border-transparent focus:outline-none focus:ring-2 focus:ring-blumilk-500 focus:ring-offset-2 shadow-sm"
           >
-            Zapisz
+            Save
           </button>
         </div>
       </div>
@@ -190,30 +264,22 @@
 </template>
 
 <script setup>
+import {
+  Disclosure,
+  DisclosureButton,
+  DisclosurePanel,
+} from '@headlessui/vue'
+import { TrashIcon } from '@heroicons/vue/outline'
 import { useForm } from '@inertiajs/inertia-vue3'
 import FlatPickr from 'vue-flatpickr-component'
-import { Listbox, ListboxButton, ListboxLabel, ListboxOption, ListboxOptions } from '@headlessui/vue'
-import { CheckIcon, SelectorIcon } from '@heroicons/vue/solid'
-
-const props = defineProps({
-  employmentForms: Object,
-  languages: Object,
-})
 
 const form = useForm({
-  firstName: null,
+  elements: [{
-  lastName: null,
+    school: null,
-  email: null,
+    degree: null,
-  position: null,
+    fieldOfStudy: null,
-  employmentDate: null,
+    startDate: null,
+    endDate: null,
+  }],
 })
-
+</script>
-function createResume() {
-  form
-    .transform(data => ({
-      ...data,
-      language: data.language.value,
-    }))
-    .post('/resumes')
-}
-</script>

resources/js/Pages/Resumes/Index.vue

@@ -20,46 +20,46 @@
       <div class="overflow-auto xl:overflow-visible">
         <table class="min-w-full divide-y divide-gray-200">
           <thead class="bg-gray-50">
-          <tr>
+            <tr>
-            <th
+              <th
-              scope="col"
+                scope="col"
-              class="py-3 px-4 text-xs font-semibold tracking-wider text-left text-gray-500 uppercase whitespace-nowrap"
+                class="py-3 px-4 text-xs font-semibold tracking-wider text-left text-gray-500 uppercase whitespace-nowrap"
-            >
+              >
-              Pracownik
+                Pracownik
-            </th>
+              </th>
-            <th
+              <th
-              scope="col"
+                scope="col"
-              class="py-3 px-4 text-xs font-semibold tracking-wider text-left text-gray-500 uppercase whitespace-nowrap"
+                class="py-3 px-4 text-xs font-semibold tracking-wider text-left text-gray-500 uppercase whitespace-nowrap"
-            >
+              >
-              Data
+                Data
-            </th>
+              </th>
-            <th
+              <th
-              scope="col"
+                scope="col"
-              class="py-3 px-4 text-xs font-semibold tracking-wider text-left text-gray-500 uppercase whitespace-nowrap"
+                class="py-3 px-4 text-xs font-semibold tracking-wider text-left text-gray-500 uppercase whitespace-nowrap"
-            >
+              >
-              Dzień tygodnia
+                Dzień tygodnia
-            </th>
+              </th>
-            <th
+              <th
-              scope="col"
+                scope="col"
-              class="py-3 px-4 text-xs font-semibold tracking-wider text-left text-gray-500 uppercase whitespace-nowrap"
+                class="py-3 px-4 text-xs font-semibold tracking-wider text-left text-gray-500 uppercase whitespace-nowrap"
-            />
+              />
-          </tr>
+            </tr>
           </thead>
           <tbody class="bg-white divide-y divide-gray-100">
-          <tr>
+            <tr>
-            <!--              v-for="holiday in holidays.data"-->
+              <!--              v-for="holiday in holidays.data"-->
-            <!--              :key="holiday.id"-->
+              <!--              :key="holiday.id"-->
-            <!--              :class="[holiday.isPast ? 'bg-gray-100' : 'hover:bg-blumilk-25']"-->
+              <!--              :class="[holiday.isPast ? 'bg-gray-100' : 'hover:bg-blumilk-25']"-->
-            <td class="p-4 text-sm font-semibold text-gray-700 capitalize whitespace-nowrap">
+              <td class="p-4 text-sm font-semibold text-gray-700 capitalize whitespace-nowrap">
-              Jan Kowalski
+                Jan Kowalski
-            </td>
+              </td>
-            <td class="p-4 text-sm text-gray-500 whitespace-nowrap">
+              <td class="p-4 text-sm text-gray-500 whitespace-nowrap">
-              xd
+                xd
-            </td>
+              </td>
-            <td class="p-4 text-sm text-gray-500 whitespace-nowrap">
+              <td class="p-4 text-sm text-gray-500 whitespace-nowrap">
-              xd
+                xd
-            </td>
+              </td>
-            <td class="p-4 text-sm text-right text-gray-500 whitespace-nowrap">
+              <td class="p-4 text-sm text-right text-gray-500 whitespace-nowrap">
               <!--                <Menu-->
               <!--                  v-if="true"-->
               <!--                  as="div"-->
@@ -111,16 +111,16 @@
               <!--                    </MenuItems>-->
               <!--                  </transition>-->
               <!--                </Menu>-->
-            </td>
+              </td>
-          </tr>
+            </tr>
-          <tr v-if="!true">
+            <tr v-if="!true">
-            <td
+              <td
-              colspan="100%"
+                colspan="100%"
-              class="py-4 text-xl leading-5 text-center text-gray-700"
+                class="py-4 text-xl leading-5 text-center text-gray-700"
-            >
+              >
-              Brak danych
+                Brak danych
-            </td>
+              </td>
-          </tr>
+            </tr>
           </tbody>
         </table>
       </div>

resources/js/Shared/MainMenu.vue

@@ -379,7 +379,7 @@ const navigation = computed(() =>
       section: 'Resumes',
       icon: TemplateIcon,
       can: true,
-    }
+    },
 
   ].filter(item => item.can))
 </script>