- add titles and abstracts in edit form

app/Http/Controllers/Publish/SubmitController.php

@@ -61,6 +61,12 @@ class SubmitController extends Controller
         $dataset = Dataset::findOrFail($id);
         $dataset->load('licenses', 'titles', 'abstracts', 'files', 'coverage', 'subjects', 'references');
 
+        $titleTypes = ['Main' => 'Main', 'Sub' => 'Sub', 'Alternative' => 'Alternative', 'Translated' => 'Translated', 'Other' => 'Other'];
+        $descriptionTypes = ['Abstract' => 'Abstract', 'Methods' => 'Methods', 'Series_information' => 'Series_information', 'Technical_info' => 'Technical_info', 'Translated' => 'Translated', 'Other' => 'Other'];
+        $languages = DB::table('languages')
+            ->where('active', true)
+            ->pluck('part1', 'part1');
+
         $projects = Project::pluck('label', 'id');
 
         $datum = date('Y-m-d');
@@ -93,6 +99,9 @@ class SubmitController extends Controller
             'workflow.submitter.edit',
             compact(
                 'dataset',
+                'titleTypes',
+                'descriptionTypes',
+                'languages',
                 'projects',
                 'licenses',
                 'checkeds',
@@ -145,7 +154,15 @@ class SubmitController extends Controller
         if (!$validator->fails()) {
             $dataset = Dataset::findOrFail($id);
             $data = $request->all();
-            $input = $request->except('abstracts', 'licenses', 'titles', 'coverage', 'subjects', 'files', '_method', '_token');
+            $input = $request->except(
+                'abstracts',
+                'licenses',
+                'titles',
+                'coverage',
+                'subjects',
+                'references',
+                'files'
+            );
 
             $licenses = $request->input('licenses');
             //$licenses = $input['licenses'];
@@ -155,11 +172,17 @@ class SubmitController extends Controller
             $titles = $request->input('titles');
             if (is_array($titles) && count($titles) > 0) {
                 foreach ($titles as $key => $formTitle) {
-                    $title = Title::findOrFail($key);
+                    if (isset($key) && $key != 'undefined') {
-                    $title->value = $formTitle['value'];
+                        $title = Title::findOrFail($key);
-                    $title->language = $formTitle['language'];
+                        $title->value = $formTitle['value'];
-                    if ($title->isDirty()) {
+                        $title->language = $formTitle['language'];
-                        $title->save();
+                        $title->type = $formTitle['type'];
+                        if ($title->isDirty()) {
+                            $title->save();
+                        }
+                    } else {
+                        $title = new Title($formTitle);
+                        $dataset->titles()->save($title);
                     }
                 }
             }
@@ -168,11 +191,16 @@ class SubmitController extends Controller
             $abstracts = $request->input('abstracts');
             if (is_array($abstracts) && count($abstracts) > 0) {
                 foreach ($abstracts as $key => $formAbstract) {
-                    $abstract = Description::findOrFail($key);
+                    if (isset($key) && $key != 'undefined') {
-                    $abstract->value = $formAbstract['value'];
+                        $abstract = Description::findOrFail($key);
-                    $abstract->language = $formAbstract['language'];
+                        $abstract->value = $formAbstract['value'];
-                    if ($abstract->isDirty()) {
+                        $abstract->language = $formAbstract['language'];
-                        $abstract->save();
+                        if ($abstract->isDirty()) {
+                            $abstract->save();
+                        }
+                    } else {
+                        $abstract = new Description($formAbstract);
+                        $dataset->abstracts()->save($abstract);
                     }
                 }
             }
@@ -192,8 +220,6 @@ class SubmitController extends Controller
                         }
                     } else {
                         $reference = new DatasetReference($formReference);
-                        // $title->status = true;
-                        // $title->name_type = "Organizational";
                         $dataset->references()->save($reference);
                     }
                 }
@@ -212,8 +238,6 @@ class SubmitController extends Controller
                         }
                     } else {
                         $subject = new Subject($formKeyword);
-                        // $title->status = true;
-                        // $title->name_type = "Organizational";
                         $dataset->subjects()->save($subject);
                     }
                 }

resources/js/EditDataset.js

@@ -56,15 +56,41 @@ export default class EditDataset extends Vue {
     elevation = "no_elevation";
     depth = "no_depth";
     time = "no_time";
+    titleTypes = [];
+
+    get remainingTitleTypes() {
+        // this.titleTypes.filter(e => e != 'Main');
+        var filtered = Object.fromEntries(Object.entries(this.titleTypes).filter(([k,v]) => v != 'Main'));
+        return filtered;
+    }
 
     beforeMount() {
         // this.form = window.Laravel.form;
         this.realMerge(this.form, window.Laravel.form);
+        this.titleTypes = window.Laravel.titleTypes;
+        this.descriptionTypes = window.Laravel.descriptionTypes;
+        this.languages = window.Laravel.languages;
         this.projects = window.Laravel.projects;
         this.licenses = window.Laravel.licenses;
         this.checkeds = window.Laravel.checkeds;
         this.referenceTypes = window.Laravel.referenceTypes;
         this.relationTypes = window.Laravel.relationTypes;
+
+        
+    }
+
+    created() {
+         // add the required rule
+         VeeValidate.Validator.extend('translatedLanguage', {
+            getMessage: field => 'The translated ' + field + ' must be in a language other than than the dataset language.',
+            validate: (value, [mainLanguage, type]) => {
+                if (type == "Translated") {
+                    return value !== mainLanguage;
+                }
+                return true;
+
+            }
+        });
     }
 
     mounted() {
@@ -207,14 +233,30 @@ export default class EditDataset extends Vue {
         this.form.references.splice(key, 1);
     }
 
-    // @Watch('form.coverage.time_absolut')
+    addTitle() {
-    // onTimeAbsolutChanged(val) {
+        let newTitle = { value: '', language: this.form.language, type: '' };
-    //   this.time = "absolut";      
+        //this.dataset.files.push(uploadedFiles[i]);
-    // }
+        this.form.titles.push(newTitle);
+    }
 
-    // @Watch('form.coverage.time_min')
+    /*
-    // onTimeMinChanged(val) {
+    Removes a selected title
-    //   this.time = "range";      
+    */
-    // }
+    removeTitle(key) {
+        this.form.titles.splice(key, 1);
+    }
+
+    addDescription() {
+        let newTitle = { value: '', language: this.form.language, type: '' };
+        //this.dataset.files.push(uploadedFiles[i]);
+        this.form.abstracts.push(newTitle);
+    }
+
+    /*
+    Removes a selected description
+    */
+    removeDescription(key) {
+        this.form.abstracts.splice(key, 1);
+    }
 
 }

resources/js/components/Dataset.ts

@@ -131,6 +131,16 @@ export default class Dataset extends Vue {
   onLanguageChanged(val) {
     this.title_main.language = val;
     this.abstract_main.language = val;
+    for (let [key, title] of Object.entries(this.titles)) {
+      if (title.type == "Main") {
+        title.language = val;
+      }
+    }
+    for (let [key, abstract] of Object.entries(this.abstracts)) {
+      if (abstract.type == "Abstract") {
+        abstract.language = val;
+      }
+    }
   }
 
 

resources/views/workflow/submitter/_form.blade.php

@@ -64,6 +64,166 @@
     </div>
 </fieldset>
 
+<fieldset id="fieldset-titles">
+    <legend>Title</legend>
+    <div>
+
+        {{-- @foreach($dataset->titles as $key => $title)
+        <div class="pure-u-1 pure-u-md-1-2 pure-div">
+            {{ Form::label('title', 'Title ' .($key+1).':') }}
+        {{ Form::text('titles['.$title->id.'][value]', $title->value, ['class' => 'pure-u-23-24']) }}
+    </div>
+    <div class="pure-u-1 pure-u-md-1-2 pure-div">
+        {{ Form::label('language', 'Language..') }}
+        {{ Form::text('titles['.$title->id.'][language]', $title->language, ['placeholder' => '--no language--', 'class' => 'pure-u-23-24', 'readonly']) }}
+    </div>
+    @endforeach --}}
+    <div class="pure-u-1 pure-u-md-1-2 pure-div">
+        <label name="TitleMain">Add additional title(s) </label>
+        <button class="pure-button button-small" @click.prevent="addTitle()"><i class="fas fa-plus-circle"></i></button>
+    </div>
+    <table v-if="form.titles.length" class="pure-table pure-table-horizontal">
+        <thead>
+            <tr>
+                <th style="width: 20px;">Title</th>
+                <th>Type</th>
+                <th>Language</th>
+                <th style="width: 130px;"></th>
+            </tr>
+        </thead>
+        <tbody>
+            <tr v-for="(title, key) in form.titles">
+                <td>
+                    <input type="text" :id="'titles['+title.id+'][value]'" :name="'titles['+title.id+'][value]'"
+                        v-validate="'required'" class="form-control" v-model="title.value">
+                </td>
+                <td>
+                    <template v-if="title.type == 'Main'">
+                        <input v-bind:name="'titles['+title.id+'][type]'" v-model="title.type" class="form-control"
+                            v-validate="'required'" v-bind:readonly="title.type == 'Main'">
+                    </template>
+                    <template v-else>
+                        <select type="text" :id="'titles['+title.id+'][type]'" :name="'titles['+title.id+'][type]'"
+                            class="form-control"
+                            v-validate="{required: true, translatedLanguage: [form.language, title.type]}"
+                            v-model="title.type" v-bind:readonly="title.type == 'Main'">
+                            <option v-for="option in remainingTitleTypes" :value='option'
+                                :disabled="title.type == 'Main'">
+                                @{{ option }}
+                            </option>
+                        </select>
+                    </template>
+                </td>
+                <td>
+                    <template v-if="title.type == 'Main'">
+                        <input v-bind:name="'titles['+title.id+'][language]'" v-model="title.language"
+                            class="form-control" v-validate="'required'" v-bind:readonly="title.type == 'Main'">
+                    </template>
+                    <template v-else>
+                        <select type="text" :id="'titles['+title.id+'][language]'"
+                            :name="'titles['+title.id+'][language]'" class="form-control"
+                            v-validate="{required: true, translatedLanguage: [form.language, title.type]}"
+                            v-model="title.language" v-bind:readonly="title.type == 'Main'">
+                            <option v-for="option in languages" :value='option'>
+                                @{{ option }}
+                            </option>
+                        </select>
+                    </template>
+                </td>
+                <td>
+                    <button v-if="title.id == undefined" class="pure-button button-small is-warning"
+                        @click.prevent="removeTitle(key)">
+                        <i class="fa fa-trash"></i>
+                </td>
+            </tr>
+        </tbody>
+    </table>
+    </div>
+</fieldset>
+
+<fieldset id="fieldset-abstracts">
+    <legend>Abstract</legend>
+    <div>
+
+        {{-- @foreach($dataset->abstracts as $key => $abstract)
+        <div class="pure-u-1 pure-u-md-1-2 pure-div">
+            {{ Form::label('abstract', 'Abstract ' .($key+1).':') }}
+        <!-- Notice this is an array now: -->
+        {{ Form::textarea('abstracts['.$abstract->id.'][value]', $abstract->value, ['class' => 'pure-u-23-24', 'size' => '70x6']) }}
+    </div>
+    <div class="pure-u-1 pure-u-md-1-2 pure-div">
+        {{ Form::label('language', 'Language..') }}
+        {{ Form::text('abstracts['.$abstract->id.'][language]', $abstract->language, ['placeholder' => '--no language--', 'class' => 'pure-u-23-24', 'readonly']) }}
+    </div>
+    @endforeach --}}
+
+    <div class="pure-u-1 pure-u-md-1-2 pure-div">
+        <label name="DescriptionMain">Add additional abstract(s) </label>
+        <button class="pure-button button-small" @click.prevent="addDescription()"><i
+                class="fas fa-plus-circle"></i></button>
+    </div>
+    <table v-if="form.abstracts.length" class="pure-table pure-table-horizontal">
+        <thead>
+            <tr>
+                <th style="width: 20px;">Value</th>
+                <th>Type</th>
+                <th>Language</th>
+                <th style="width: 130px;"></th>
+            </tr>
+        </thead>
+        <tbody>
+            <tr v-for="(abstract, key) in form.abstracts">
+                <td>
+                    {{-- <label :for="'abstracts['+abstract.id+'][value]'"> @{{ 'Title ' + (key + 1) + ':' }}</label>
+                    --}}
+                    <input type="text" :id="'abstracts['+abstract.id+'][value]'"
+                        :name="'abstracts['+abstract.id+'][value]'" v-validate="'required'" v-model="abstract.value"
+                        class="form-control">
+                </td>
+                <td>
+                    <template v-if="abstract.type == 'Abstract'">
+                        <input v-bind:name="'abstracts['+abstract.id+'][type]'" v-model="abstract.type"
+                            class="form-control" v-validate="'required'" v-bind:readonly="abstract.type == 'Abstract'">
+                    </template>
+                    <template v-else>
+                        <select type="text" :id="'abstracts['+abstract.id+'][type]'"
+                            :name="'abstracts['+abstract.id+'][type]'" class="form-control"
+                            v-validate="{required: true, translatedLanguage: [form.language, abstract.type]}"
+                            v-model="abstract.type" v-bind:readonly="abstract.type == 'Abstract'">
+                            <option v-for="option in descriptionTypes" :value='option'>
+                                @{{ option }}
+                            </option>
+                        </select>
+                    </template>
+                </td>
+                <td>
+                    <template v-if="abstract.type == 'Abstract'">
+                        <input v-bind:name="'abstracts['+abstract.id+'][language]'" v-model="abstract.language"
+                            class="form-control" v-validate="'required'" v-bind:readonly="abstract.type == 'Abstract'">
+                    </template>
+                    <template v-else>
+                        <select type="text" :id="'abstracts['+abstract.id+'][language]'"
+                            :name="'abstracts['+abstract.id+'][language]'" class="form-control"
+                            v-validate="{required: true, translatedLanguage: [form.language, abstract.type]}"
+                            v-model="abstract.language" v-bind:readonly="abstract.type == 'Abstract'">
+                            <option v-for="option in languages" :value='option'>
+                                @{{ option }}
+                            </option>
+                        </select>
+                    </template>
+                </td>
+                <td>
+                    <button v-if="abstract.id == undefined" class="pure-button button-small is-warning"
+                        @click.prevent="removeDescription(key)">
+                        <i class="fa fa-trash"></i>
+                </td>
+            </tr>
+        </tbody>
+    </table>
+
+    </div>
+</fieldset>
+
 <fieldset id="fieldset-dates">
     <legend>Date(s)</legend>
     <div class="pure-u-1 pure-u-md-1-2 pure-div">
@@ -198,49 +358,58 @@
             <div v-show="elevation === 'absolut'" class="pure-u-1 pure-u-md-1">
                 {!! Form::label('elevation_absolut', 'elevation absolut: ') !!}
                 {!! Form::text('elevation_absolut', null,
-                ['class' => 'pure-u-23-24', 'v-model' => 'form.coverage.elevation_absolut', 'data-vv-scope' => 'step-2', "v-validate" => "this.isElevationAbsolut ? 'required|integer' : '' " ]) !!}
+                ['class' => 'pure-u-23-24', 'v-model' => 'form.coverage.elevation_absolut', 'data-vv-scope' => 'step-2',
+                "v-validate" => "this.isElevationAbsolut ? 'required|integer' : '' " ]) !!}
             </div>
             <div v-show="elevation === 'range'" class="pure-u-1 pure-u-md-1">
                 {!! Form::label('elevation_min', 'elevation min: ') !!}
                 {!! Form::text('elevation_min', null,
-                ['class' => 'pure-u-23-24', 'v-model' => 'form.coverage.elevation_min', 'data-vv-scope' => 'step-2', "v-validate" => "this.isElevationRange ? 'required|integer' : '' "]) !!}
+                ['class' => 'pure-u-23-24', 'v-model' => 'form.coverage.elevation_min', 'data-vv-scope' => 'step-2',
+                "v-validate" => "this.isElevationRange ? 'required|integer' : '' "]) !!}
             </div>
-            <div  v-show="elevation === 'range'" class="pure-u-1 pure-u-md-1">
+            <div v-show="elevation === 'range'" class="pure-u-1 pure-u-md-1">
                 {!! Form::label('elevation_max', 'elevation max: ') !!}
                 {!! Form::text('elevation_max', null,
-                ['class' => 'pure-u-23-24', 'v-model' => 'form.coverage.elevation_max', 'data-vv-scope' => 'step-2', "v-validate" => "this.isElevationRange ? 'required|integer' : '' "]) !!}
+                ['class' => 'pure-u-23-24', 'v-model' => 'form.coverage.elevation_max', 'data-vv-scope' => 'step-2',
+                "v-validate" => "this.isElevationRange ? 'required|integer' : '' "]) !!}
             </div>
         </div>
 
         <div class="pure-u-1 pure-u-md-1-2">
             <div class="pure-u-1 pure-u-md-1">
                 <label for="depth-option-one" class="pure-radio">
-                                                <input id="depth-option-one" type="radio" v-model="depth" value="absolut">
+                    <input id="depth-option-one" type="radio" v-model="depth" value="absolut">
-                                                absolut depth (m)
+                    absolut depth (m)
-                                            </label>
+                </label>
                 <label for="depth-option-two" class="pure-radio">
-                                                <input id="depth-option-two" type="radio" v-model="depth" value="range">
+                    <input id="depth-option-two" type="radio" v-model="depth" value="range">
-                                                depth range (m)
+                    depth range (m)
-                                            </label>
+                </label>
                 <label for="depth-option-three" class="pure-radio">
-                                                <input id="depth-option-three" type="radio" v-model="depth" value="no_depth">
+                    <input id="depth-option-three" type="radio" v-model="depth" value="no_depth">
-                                                no depth
+                    no depth
-                                            </label>
+                </label>
             </div>
 
             <div v-show="depth === 'absolut'" class="pure-u-1 pure-u-md-1">
-                {!! Form::label('depth_absolut', 'depth absolut: ') !!} {!! Form::text('depth_absolut', null, ['class' => 'pure-u-23-24',
+                {!! Form::label('depth_absolut', 'depth absolut: ') !!} {!! Form::text('depth_absolut', null, ['class'
-                'v-model' => 'form.coverage.depth_absolut', 'data-vv-scope' => 'step-2', "v-validate" => "this.isDepthAbsolut
+                => 'pure-u-23-24',
+                'v-model' => 'form.coverage.depth_absolut', 'data-vv-scope' => 'step-2', "v-validate" =>
+                "this.isDepthAbsolut
                 ? 'required|integer' : '' " ]) !!}
             </div>
             <div v-show="depth === 'range'" class="pure-u-1 pure-u-md-1">
-                {!! Form::label('depth_min', 'depth min: ') !!} {!! Form::text('depth_min', null, ['class' => 'pure-u-23-24', 'v-model' =>
+                {!! Form::label('depth_min', 'depth min: ') !!} {!! Form::text('depth_min', null, ['class' =>
-                'form.coverage.depth_min', 'data-vv-scope' => 'step-2', "v-validate" => "this.isDepthRange ? 'required|integer'
+                'pure-u-23-24', 'v-model' =>
+                'form.coverage.depth_min', 'data-vv-scope' => 'step-2', "v-validate" => "this.isDepthRange ?
+                'required|integer'
                 : '' "]) !!}
             </div>
             <div v-show="depth === 'range'" class="pure-u-1 pure-u-md-1">
-                {!! Form::label('depth_max', 'depth max: ') !!} {!! Form::text('depth_max', null, ['class' => 'pure-u-23-24', 'v-model' =>
+                {!! Form::label('depth_max', 'depth max: ') !!} {!! Form::text('depth_max', null, ['class' =>
-                'form.coverage.depth_max', 'data-vv-scope' => 'step-2', "v-validate" => "this.isDepthRange ? 'required|integer'
+                'pure-u-23-24', 'v-model' =>
+                'form.coverage.depth_max', 'data-vv-scope' => 'step-2', "v-validate" => "this.isDepthRange ?
+                'required|integer'
                 : '' "]) !!}
             </div>
         </div>
@@ -248,17 +417,17 @@
         <div class="pure-u-1 pure-u-md-1-2">
             <div class="pure-u-1 pure-u-md-1">
                 <label for="time-option-one" class="pure-radio">
-                                                <input id="time-option-one" type="radio" v-model="time" value="absolut">
+                    <input id="time-option-one" type="radio" v-model="time" value="absolut">
-                                                absolut time (dd.MM.yyyy HH:mm:ss)
+                    absolut time (dd.MM.yyyy HH:mm:ss)
-                                            </label>
+                </label>
                 <label for="time-option-two" class="pure-radio">
-                                                <input id="time-option-two" type="radio" v-model="time" value="range">
+                    <input id="time-option-two" type="radio" v-model="time" value="range">
-                                                time range (dd.MM.yyyy HH:mm:ss)
+                    time range (dd.MM.yyyy HH:mm:ss)
-                                            </label>
+                </label>
                 <label for="time-option-three" class="pure-radio">
-                                                <input id="time-option-three" type="radio" v-model="time" value="no_time">
+                    <input id="time-option-three" type="radio" v-model="time" value="no_time">
-                                                no time
+                    no time
-                                            </label>
+                </label>
             </div>
 
             <div v-show="time === 'absolut'" class="pure-u-1 pure-u-md-1">
@@ -266,7 +435,9 @@
                 {{-- {!! Form::datetime('time_absolut', null, ['class' => 'pure-u-23-24', 'placeholder' => 'dd.MM.yyyy HH:mm',
                 'v-model' => 'dataset.coverage.time_absolut', 'data-vv-scope' => 'step-2', 'format' => 'yyyy-MM-dd HH:mm',
                 "v-validate" => "this.isTimeAbsolut ? 'required|date_format:dd.MM.yyyy HH:mm:ss' : '' " ]) !!} --}}
-                <datetime name="time_absolut" v-validate="this.isTimeAbsolut ? 'required|date_format:dd-MM-yyyy HH:mm:ss' : '' " data-vv-scope="step-2" format="YYYY-MM-DD h:i:s" v-model='form.coverage.time_absolut' ></datetime>
+                <datetime name="time_absolut"
+                    v-validate="this.isTimeAbsolut ? 'required|date_format:dd-MM-yyyy HH:mm:ss' : '' "
+                    data-vv-scope="step-2" format="YYYY-MM-DD h:i:s" v-model='form.coverage.time_absolut'></datetime>
                 {{-- <datetime name="time_absolut" format="MM-DD-YYYY H:i:s" width="300px" v-model="dataset.coverage.time_absolut"></datetime> --}}
             </div>
             <div v-show="time === 'range'" class="pure-u-1 pure-u-md-1">
@@ -274,85 +445,24 @@
                 {{-- {!! Form::datetimelocal('time_min', null, ['class' => 'pure-u-23-24', 'placeholder' => 'dd.MM.yyyy HH:mm:ss', 
                 'v-model' => 'dataset.coverage.time_min', 'data-vv-scope' => 'step-2', 'step' => 1,
                 "v-validate" => "this.isTimeRange ? 'required|date_format:dd.MM.yyyy HH:mm:ss' : '' "]) !!} --}}
-                <datetime name="time_min" v-validate="this.isTimeRange ? 'required|date_format:dd-MM-yyyy HH:mm:ss' : '' " data-vv-scope="step-2" format="DD-MM-YYYY h:i:s" v-model='form.coverage.time_min' ></datetime>
+                <datetime name="time_min"
+                    v-validate="this.isTimeRange ? 'required|date_format:dd-MM-yyyy HH:mm:ss' : '' "
+                    data-vv-scope="step-2" format="DD-MM-YYYY h:i:s" v-model='form.coverage.time_min'></datetime>
             </div>
             <div v-show="time === 'range'" class="pure-u-1 pure-u-md-1">
                 {!! Form::label('timemax', 'time max: ') !!}
                 {{-- {!! Form::datetimelocal('time_max', null, ['class' => 'pure-u-23-24', 'placeholder' => 'dd.MM.yyyy HH:mm:ss',
                 'v-model' => 'dataset.coverage.time_max', 'data-vv-scope' => 'step-2', 'step' => 1,
                 "v-validate" => "this.isTimeRange ? 'required|date_format:dd.MM.yyyy HH:mm:ss' : '' "]) !!} --}}
-                <datetime name="time_max" v-validate="this.isTimeRange ? 'required|date_format:dd-MM-yyyy HH:mm:ss' : '' " data-vv-scope="step-2" format="DD-MM-YYYY h:i:s" v-model='form.coverage.time_max' ></datetime>
+                <datetime name="time_max"
+                    v-validate="this.isTimeRange ? 'required|date_format:dd-MM-yyyy HH:mm:ss' : '' "
+                    data-vv-scope="step-2" format="DD-MM-YYYY h:i:s" v-model='form.coverage.time_max'></datetime>
             </div>
         </div>
 
     </div>
 </fieldset>
 
-<fieldset id="fieldset-titles">
-    <legend>Title</legend>
-    <div class="pure-g">
-
-        {{-- @foreach($dataset->titles as $key => $title)
-        <div class="pure-u-1 pure-u-md-1-2 pure-div">
-            {{ Form::label('title', 'Title ' .($key+1).':') }}
-        {{ Form::text('titles['.$title->id.'][value]', $title->value, ['class' => 'pure-u-23-24']) }}
-    </div>
-    <div class="pure-u-1 pure-u-md-1-2 pure-div">
-        {{ Form::label('language', 'Language..') }}
-        {{ Form::text('titles['.$title->id.'][language]', $title->language, ['placeholder' => '--no language--', 'class' => 'pure-u-23-24', 'readonly']) }}
-    </div>
-    @endforeach --}}
-
-    <template v-for="(title, key) in form.titles">
-        <div class="pure-u-1 pure-u-md-1-2 pure-div">
-            <label :for="'titles['+title.id+'][value]'"> @{{ 'Title ' + (key + 1) + ':' }}</label>
-            <input type="text" :id="'titles['+title.id+'][value]'" :name="'titles['+title.id+'][value]'"
-                v-model="title.value" class="pure-u-23-24">
-        </div>
-        <div class="pure-u-1 pure-u-md-1-2 pure-div">
-            <label :for="'titles['+title.id+'][language]'"> @{{ 'Language for title ' + (key + 1) + ':' }}</label>
-            <input type="text" :id="'titles['+title.id+'][language]'" :name="'titles['+title.id+'][language]'"
-                v-model="title.language" class="pure-u-23-24" readonly>
-        </div>
-    </template>
-
-    </div>
-</fieldset>
-
-<fieldset id="fieldset-abstracts">
-    <legend>Abstract</legend>
-    <div class="pure-g">
-
-        {{-- @foreach($dataset->abstracts as $key => $abstract)
-        <div class="pure-u-1 pure-u-md-1-2 pure-div">
-            {{ Form::label('abstract', 'Abstract ' .($key+1).':') }}
-        <!-- Notice this is an array now: -->
-        {{ Form::textarea('abstracts['.$abstract->id.'][value]', $abstract->value, ['class' => 'pure-u-23-24', 'size' => '70x6']) }}
-    </div>
-    <div class="pure-u-1 pure-u-md-1-2 pure-div">
-        {{ Form::label('language', 'Language..') }}
-        {{ Form::text('abstracts['.$abstract->id.'][language]', $abstract->language, ['placeholder' => '--no language--', 'class' => 'pure-u-23-24', 'readonly']) }}
-    </div>
-    @endforeach --}}
-
-    <template v-for="(abstract, key) in form.abstracts">
-        <div class="pure-u-1 pure-u-md-1-2 pure-div">
-            <label :for="'abstracts['+abstract.id+'][value]'"> @{{ 'Title ' + (key + 1) + ':' }}</label>
-            <input type="text" :id="'abstracts['+abstract.id+'][value]'" :name="'abstracts['+abstract.id+'][value]'"
-                v-model="abstract.value" class="pure-u-23-24">
-        </div>
-        <div class="pure-u-1 pure-u-md-1-2 pure-div">
-            <label :for="'abstracts['+abstract.id+'][language]'">
-                @{{ 'Language for abstract ' + (key + 1) + ':' }}</label>
-            <input type="text" :id="'abstracts['+abstract.id+'][language]'"
-                :name="'abstracts['+abstract.id+'][language]'" v-model="abstract.language" class="pure-u-23-24"
-                readonly>
-        </div>
-    </template>
-
-    </div>
-</fieldset>
-
 <fieldset id="fieldset-licenses">
     <legend>Licenses</legend>
 
@@ -390,7 +500,8 @@
 
 <fieldset id="fieldset-references">
     <legend>Dataset References</legend>
-    <button class="pure-button button-small" @click.prevent="addReference()">Add Reference</button>
+    <label name="ReferenceLabel">Add Reference </label>
+    <button class="pure-button button-small" @click.prevent="addReference()"><i class="fas fa-plus-circle"></i></button>
     {{-- <table class="table table-hover" v-if="dataset.keywords.length"> --}}
     {{-- @if ($dataset->references->count() > 0) --}}
     <table v-show="form.references.length" id="references" class="pure-table pure-table-horizontal">
@@ -422,7 +533,8 @@
                 <td>
                     {{-- {!! Form::select('references['.$reference->id.'][type]', $referenceTypes, $reference->type,
                     ['placeholder' => '[REFERENCE TYPE]', 'v-model' => 'item.type', "v-validate" => "'required'"]) !!} --}}
-                    <select v-bind:name="'references[' +  item.id +'][type]'" v-model="item.type" class="form-control" v-validate="'required'">
+                    <select v-bind:name="'references[' +  item.id +'][type]'" v-model="item.type" class="form-control"
+                        v-validate="'required'">
                         <option v-for="option in referenceTypes" :value='option'>
                             @{{ option }}
                         </option>
@@ -432,7 +544,8 @@
                 <td>
                     {{-- {!! Form::select('references['.$reference->id.'][relation]', $relationTypes, $reference->relation,
                     ['placeholder' => '[REFERENCE TYPE]', 'v-model' => 'item.relation', "v-validate" => "'required'"]) !!} --}}
-                    <select v-bind:name="'references[' +  item.id +'][relation]'" v-model="item.relation" class="form-control" v-validate="'required'">
+                    <select v-bind:name="'references[' +  item.id +'][relation]'" v-model="item.relation"
+                        class="form-control" v-validate="'required'">
                         <option v-for="option in relationTypes" :value='option'>
                             @{{ option }}
                         </option>
@@ -440,9 +553,9 @@
                 </td>
                 <td>
                     <button v-if="item.id == undefined" class="pure-button button-small is-warning"
-                    @click.prevent="removeReference(index)">
+                        @click.prevent="removeReference(index)">
-                    <i class="fa fa-trash"></i>
+                        <i class="fa fa-trash"></i>
-                </button>
+                    </button>
                 </td>
             </tr>
             {{-- @endforeach --}}
@@ -455,8 +568,8 @@
 
 <fieldset id="fieldset-keywords">
     <legend>Dataset Keywords</legend>
-    {{-- <table class="table table-hover" v-if="dataset.keywords.length"> --}}
+    <label name="SubjectLabel">Add Reference </label>
-    <button class="pure-button button-small" @click.prevent="addKeyword()">Add Keyword</button>
+    <button class="pure-button button-small" @click.prevent="addKeyword()"><i class="fas fa-plus-circle"></i></button>
     @if ($dataset->subjects->count() > 0)
     <table id="keywords" class="pure-table pure-table-horizontal">
         <thead>
@@ -539,7 +652,7 @@
 <br />
 <div class="pure-controls">
     <button :disabled="errors.any()" type="submit" class="pure-button button-small">
-        <i class="fa fa-share"></i>
+        <i class="fas fa-save"></i>
         <span>{!! $submitButtonText !!}</span>
     </button>
 </div>

resources/views/workflow/submitter/edit.blade.php

@@ -31,7 +31,7 @@
         <div id="app1">
             {!! Form::model($dataset, ['method' => 'POST', 'route' => ['publish.workflow.submit.update', $dataset->id], 'id' => 'submitEditForm',
             'class' => 'pure-form', 'enctype' => 'multipart/form-data', 'v-on:submit.prevent' => 'onSubmit' ]) !!}
-            @include('workflow/submitter/_form', ['submitButtonText' => 'Edit Dataset', 'bookLabel' => 'Edit Dataset.'])
+            @include('workflow/submitter/_form', ['submitButtonText' => 'Save Dataset', 'bookLabel' => 'Edit Dataset.'])
             {{-- @include('errors._errors') --}}
             
             <div v-if="errors.items.length > 0">
@@ -52,6 +52,9 @@
     window.Laravel = <?php echo json_encode([
             'csrf_token' => csrf_token(),
             'form' => $dataset,
+            'titleTypes' => $titleTypes,
+            'descriptionTypes' => $descriptionTypes,
+            'languages' => $languages,
             'projects' => $projects,
             'licenses'  => $licenses,
             'checkeds' => $checkeds,