- licence name_long varchar 200

- remove and add authors and creators in edit form
- EditDataset.js
- add authors array to Dataset.ts
- use id in PersonTable.vue
- remove active styles from create-step1.blade.php

resources/js/EditDataset.js

@@ -4,11 +4,18 @@ import VeeValidate from 'vee-validate';
 Vue.use(VeeValidate);
 import LocationsMap from './components/locations-map.vue';
 import Dataset from './components/Dataset';
+import PersonTable from './components/PersonTable.vue';
+import MyAutocomplete from './components/MyAutocomplete.vue';
+import VueToast from 'vue-toast-notification';
+import 'vue-toast-notification/dist/index.css';
+Vue.use(VueToast);
 
 @Component({
     components: {
         LocationsMap,
-        datetime
+        datetime,
+        PersonTable,
+        MyAutocomplete
     }
 })
 export default class EditDataset extends Vue {
@@ -91,6 +98,26 @@ export default class EditDataset extends Vue {
 
             }
         });
+        const isUnique = (value, [objectArray, index, attribute]) =>
+            new Promise(resolve => {
+                setTimeout(() => {
+                    if (objectArray.some((item, i) => item[attribute] === value && index !== i)) {
+                        return resolve({
+                            valid: false,
+                            data: {
+                                message: value + ' is already taken.'
+                            }
+                        });
+                    }
+                    return resolve({
+                        valid: true
+                    });
+                }, 200);
+            });
+        VeeValidate.Validator.extend("unique", {
+            getMessage: (field, params, data) => field + ' ' + data.message,
+            validate: isUnique,
+        });
     }
 
     mounted() {
@@ -259,4 +286,24 @@ export default class EditDataset extends Vue {
         this.form.abstracts.splice(key, 1);
     }
 
+    onAddAuthor(person) {
+        //if person is not in person array
+        //if (this.persons.includes(person) == false) {
+        if (this.form.authors.filter(e => e.id === person.id).length > 0) {
+            this.$toast.error("person is already defined as author");
+        }  else if (this.form.contributors.filter(e => e.id === person.id).length > 0) {
+            this.$toast.error("person is already defined as contributor");
+        }
+        else {
+            //person.sort_order = this.dataset.persons.length;
+            this.form.authors.push(person);
+            // this.dataset.checkedAuthors.push(person.id);
+            this.$toast.success("person has been successfully added as author");
+        }
+        
+        // else if (this.dataset.contributors.filter(e => e.id === person.id).length > 0) {
+        //     this.$toast.error("person is already defined as contributor");
+        // } 
+    }
+
 }

resources/js/components/Dataset.ts

@@ -114,6 +114,7 @@ export default class Dataset extends Vue {
   checkedContributors = [];
   // checkedSubmitters: [],
 
+  authors = [];
   persons = [];
   contributors = [];
   // submitters: []

resources/js/components/PersonTable.vue

@@ -5,6 +5,7 @@
       <thead class="thead-dark">
         <tr>
           <th scope="col">#</th>
+          <th scope="col">ID</th>
           <th scope="col">First Name</th>
           <th scope="col">Last Name</th>
           <th scope="col">Email</th>
@@ -21,12 +22,19 @@
         <tr
           v-for="(item, index) in personlist"
           v-bind:key="item.id"
-          v-bind:class="[item.status==1 ? 'activeClass' : 'inactiveClass']"
+          v-bind:class="[item.status==true ? 'activeClass' : 'inactiveClass']"
         >
           <td scope="row">{{ index + 1 }}</td>
+           <td> <input             
+              v-bind:name="heading+'['+item.id+'][id]'"
+              class="form-control"             
+              v-model="item.id"              
+              v-bind:readonly="item.status==1"              
+              data-vv-scope="step-1"
+            /></td>
           <td>
-            <input
-              name="first_name"
+            <input             
+              v-bind:name="heading+'['+item.id+'][first_name]'"
               class="form-control"
               placeholder="[FIRST NAME]"
               v-model="item.first_name"
@@ -37,7 +45,7 @@
           </td>
           <td>
             <input
-              name="last_name"
+             v-bind:name="heading+'['+item.id+'][last_name]'"            
               class="form-control"
               placeholder="[LAST NAME]"
               v-model="item.last_name"
@@ -49,7 +57,7 @@
           <td>
              <!-- v-validate="'required|email'" -->
             <input
-              name="email"
+             v-bind:name="heading+'['+item.id+'][email]'"             
               class="form-control"
               placeholder="[EMAIL]"
               v-model="item.email"             
@@ -60,7 +68,7 @@
           </td>
           <td>
             <input
-              name="identifier_orcid"
+              v-bind:name="heading+'['+item.id+'][identifier_orcid]'"             
               class="form-control"
               placeholder="[ORCID optional]"
               v-model="item.identifier_orcid"
@@ -144,4 +152,10 @@ export default class PersonTable extends Vue {
 .custom-actions button.ui.button > i.icon {
   margin: auto !important;
 }
+ .activeClass {
+        background-color: aquamarine;
+    }
+    .inactiveClass {
+        background-color: orange;
+    }
 </style>