- add key word table for submitter with adeqate validations ind DatasetController.ts an model Subject.ts

- npm updates

resources/js/Pages/Submitter/Dataset/Create.vue

@@ -1,7 +1,8 @@
 <script setup lang="ts">
 import { Head, useForm } from '@inertiajs/vue3';
 import { ref, watch } from 'vue';
-import { Dataset, Description, Title } from '@/Dataset';
+
+import { Dataset, Description, Title, Subject } from '@/Dataset';
 import {
     mdiDatabasePlus,
     mdiMinusCircle,
@@ -40,6 +41,7 @@ import MapComponent from '@/Components/Map/map.component.vue';
 import { MapOptions } from '@/Components/Map/MapOptions';
 import { LatLngBoundsExpression } from 'leaflet/src/geo/LatLngBounds';
 import { LayerOptions } from '@/Components/Map/LayerOptions';
+import TableKeywords from '@/Components/TableKeywords.vue';
 
 const props = defineProps({
     licenses: {
@@ -109,6 +111,11 @@ if (Object.keys(mainService.dataset).length == 0) {
             time_absolut: undefined,
         },
         // errors: undefined,
+        subjects: [
+        { value: '', type: 'uncontrolled', language: language.value },
+        { value: '', type: 'uncontrolled', language: language.value },
+        { value: '', type: 'uncontrolled', language: language.value },
+        ],
     };
     // mainService.setDataset(dataset, language);
 } else {
@@ -129,6 +136,7 @@ if (Object.keys(mainService.dataset).length == 0) {
         project_id: mainService.dataset.project_id,
         embargo_date: mainService.dataset.embargo_date,
         coverage: mainService.dataset.coverage,
+        subjects: mainService.dataset.subjects,
     };
     for (let index in mainService.dataset.titles) {
         let title: Title = mainService.dataset.titles[index];
@@ -289,6 +297,21 @@ const onMapInitialized = (newItem) => {
     // notify({ type: 'info', text: message });
     console.log(newItem);
 };
+
+/*
+       adds a new Keyword
+       */
+const addKeyword = () => {
+    let newSubject: Subject = { value: 'test', language: '', type: 'uncontrolled' };
+    //this.dataset.files.push(uploadedFiles[i]);
+    form.subjects.push(newSubject);
+};
+/*
+        Removes a selected keyword
+        */
+// const removeKeyword = (key) => {
+//     form.subjects.splice(key, 1);
+// };
 </script>
 
 <template>
@@ -947,12 +970,7 @@ const onMapInitialized = (newItem) => {
                                     :class="{ 'text-red-400': form.errors['coverage.depth_min'] }"
                                     class="w-full mx-2 flex-1"
                                 >
-                                    <FormControl
-                                        required
-                                        v-model="form.coverage.depth_min"
-                                        type="text"
-                                        placeholder="[enter depth_min]"
-                                    >
+                                    <FormControl required v-model="form.coverage.depth_min" type="text" placeholder="[enter depth_min]">
                                         <div class="text-red-400 text-sm" v-if="Array.isArray(form.errors['coverage.depth_min'])">
                                             {{ form.errors['coverage.depth_min'].join(', ') }}
                                         </div>
@@ -964,12 +982,7 @@ const onMapInitialized = (newItem) => {
                                     :class="{ 'text-red-400': form.errors['coverage.depth_max'] }"
                                     class="w-full mx-2 flex-1"
                                 >
-                                    <FormControl
-                                        required
-                                        v-model="form.coverage.depth_max"
-                                        type="text"
-                                        placeholder="[enter depth_max]"
-                                    >
+                                    <FormControl required v-model="form.coverage.depth_max" type="text" placeholder="[enter depth_max]">
                                         <div class="text-red-400 text-sm" v-if="Array.isArray(form.errors['coverage.depth_max'])">
                                             {{ form.errors['coverage.depth_max'].join(', ') }}
                                         </div>
@@ -977,6 +990,23 @@ const onMapInitialized = (newItem) => {
                                 </FormField>
                             </div>
                         </CardBox>
+
+                        <CardBox
+                            class="mb-6 shadow"
+                            has-table
+                            title="Dataset Keywords"
+                            :icon="mdiEarthPlus"
+                            :header-icon="mdiPlusCircle"
+                            v-on:header-icon-click="addKeyword"
+                        >
+                            <!-- <ul>
+                                <li v-for="(subject, index) in form.subjects" :key="index">
+                                {{ subject.value }} <BaseButton color="danger" :icon="mdiTrashCan" small @click.prevent="removeKeyword(index)" />
+                                </li>
+                            </ul> -->
+                            <TableKeywords :keywords="form.subjects" :errors="form.errors" v-if="form.subjects.length > 0" />
+                            
+                        </CardBox>
                     </div>
 
                     <div v-if="formStep == 4">