From e4d2f65abfe90074270c3543d8055478887dd44b Mon Sep 17 00:00:00 2001
From: isah <isabelle.herbauts@univie.ac.at>
Date: Fri, 12 Jun 2020 10:03:16 +0200
Subject: [PATCH] fixed display metadata

---
 src/App.vue                                   |  62 +---
 .../display/pharma_display/PhDJsonld.vue      | 314 ++++++++++++------
 .../display/pharma_display/PhDMetadata.vue    |   2 -
 src/components/input/PhSubmit.vue             |   3 +-
 .../input/pharma-input-fields/PISelect.vue    |   2 -
 .../input/pharma-input-fields/PhInputForm.vue |  44 +--
 src/store/index.js                            |  28 +-
 src/store/modules/initialForm.js              |  15 +
 src/utils/arrays.js                           |  10 +-
 9 files changed, 260 insertions(+), 220 deletions(-)
 create mode 100644 src/store/modules/initialForm.js

diff --git a/src/App.vue b/src/App.vue
index 683bb0e..7986c17 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -98,6 +98,7 @@
             <v-flex>
               <v-window v-model="window">
                 <v-window-item>
+                 
                   <ph-submit
                     :model="contentmodel"
                     :form="form"
@@ -107,15 +108,14 @@
                     v-on:add-phaidrasubject-section="addPhaidrasubjectSection($event)"
                   ></ph-submit>
                 </v-window-item>
-                <v-window-item>
-                  <v-flex>
+                <v-window-item>                
+                <v-flex>
                     <v-card>
                       <v-toolbar flat>
                         <v-toolbar-title>{{$t('Display')}}</v-toolbar-title>
                         <v-divider class="mx-3" inset vertical></v-divider>
                         <v-text-field v-model="pid" :placeholder="pid"></v-text-field>
                         <v-spacer></v-spacer>
-
                         <v-btn
                           raised
                           single-line
@@ -127,7 +127,7 @@
                       <v-card-text>
                         <v-layout row>
                           <ph-d-jsonld
-                            :form="form"
+                            :form="emptyForm"
                             :jsonld="displayjsonld"
                             :viewpharmameta="true"
                             :pid="pid"
@@ -171,54 +171,7 @@
                     </v-card>
                   </v-flex>
                 </v-window-item>
-                <!-- <v-window-item>
-                  <v-flex>
-                    <v-card>
-                      <v-toolbar flat>
-                        <v-toolbar-title>{{$t('Edit')}}</v-toolbar-title>
-                        <v-divider class="mx-3" inset vertical></v-divider>
-                        <v-text-field v-model="pid" :placeholder="pid"></v-text-field>
-                        <v-spacer></v-spacer>
-                        <v-btn
-                          raised
-                          single-line
-                          class="right"
-                          color="primary lighten-2"
-                          @click="loadEdit()"
-                        >Load</v-btn>
-                      </v-toolbar>
-                      <v-card-text>
-                      
-                      </v-card-text>
-                    </v-card>
-                  </v-flex>
-                </v-window-item>-->
-
-                <!-- <v-window-item>
-                  <v-flex>
-                    <v-card>
-                      <v-toolbar flat>
-                        <v-toolbar-title>{{ $t('Search') }}</v-toolbar-title>
-                        <v-divider class="mx-3" inset vertical></v-divider>
-                        <v-text-field
-                          :placeholder="'Collection, e.g. ' + sampleCollection"
-                          v-model="collection"
-                        ></v-text-field>
-                        <v-spacer></v-spacer>
-                        <v-btn
-                          raised
-                          single-line
-                          class="right"
-                          color="primary lighten-2"
-                          @click="loadSearch()"
-                        >Load Collection</v-btn>
-                      </v-toolbar>
-                      <v-card-text>
-                        <p-search :collection="collection"></p-search>
-                      </v-card-text>
-                    </v-card>
-                  </v-flex>
-                </v-window-item>-->
+              
               </v-window>
             </v-flex>
           </v-layout>
@@ -302,9 +255,10 @@ export default {
       form: {
         sections: []
       },
+      emptyForm: {},
       members: [],
       fullmembers: [],
-      pid: "o:589108",
+      pid: "o:589601",
       piddoc: {},
       collection: "",
       sampleCollection: "",
@@ -1136,6 +1090,8 @@ export default {
       this.form.sections[2].categories[8].fields.push(
         fields.getField("8-Discipline")
       );
+      this.emptyForm = JSON.parse(JSON.stringify(this.form));
+      this.$store.commit("initForm", this.emptyForm);
     },
     createContainerForm: function() {
       this.createSimpleForm();
diff --git a/src/components/display/pharma_display/PhDJsonld.vue b/src/components/display/pharma_display/PhDJsonld.vue
index e20aa14..9907e2d 100644
--- a/src/components/display/pharma_display/PhDJsonld.vue
+++ b/src/components/display/pharma_display/PhDJsonld.vue
@@ -304,6 +304,7 @@
         </template>
 
         <template v-else-if="p==='dcterms:subject'" slot="dcterms:subject">
+          
           <template v-for="(subject, j) in o">
             <v-card
               class="mt-3"
@@ -325,7 +326,8 @@
             </template>
           </template>
           <template v-if="viewpharmameta">
-            <template v-for="(categ,index) in pharmaStructure">
+             
+            <template v-for="(categ,index) in pharmaStructure()">
               <v-card v-if="categ.fields.length>0" :key="index+categ.category">
                 <v-toolbar dense flat>
                   <v-layout>
@@ -336,13 +338,9 @@
                 <template v-if="categ.fields.length>0">
                   <v-card v-for="(l,index) in categ.fields" :key="l['@type']+'field'+index">
                     <v-layout v-if="l">
-                      <!-- <v-flex xs1 class="subheading">
-                    <a :href="l.id" target="_blank">{{l.label}}</a>
-                      </v-flex>-->
+                    
                       <v-flex xs11>
-                        <!--<v-card v-for="(inputf,index) in l" :key="index+'subjectField'">-->
-
-                        <!-- <v-flex xs2 v-if="inputf.selection">{{getLabel(inputf.data['@type'])}}</v-flex>-->
+                      
                         <p-d-skos-preflabel
                           v-if="getSkosexactMatch(l)==undefined"
                           :o="l"
@@ -351,7 +349,7 @@
 
                         <ph-d-metadata
                           v-if="getSkosexactMatch(l)"
-                          :o="l"
+                        :o="l"
                           :p="p"
                           :key="l+index+'pharmasubject'"
                         ></ph-d-metadata>
@@ -377,8 +375,9 @@
                         </div>
                       </v-flex>
 
-                      <v-flex xs11 v-if="viewpharmameta">
+                      <v-flex xs11>
                         <v-card v-for="(inputf,index) in l.fields" :key="index+'subjectField'">
+                          
                           <p-d-skos-preflabel
                             v-if="getSkosexactMatch(inputf)==undefined"
                             :p="getLabel(inputf['@type'])"
@@ -395,30 +394,94 @@
                           <v-divider></v-divider>
                         </v-card>
                       </v-flex>
-                      <v-flex xs11 v-if="!viewpharmameta">
-                        fields {{l.fields}}
+                     
+                    </v-layout>
+                  </v-card>
+                </template>
+              </v-card>
+            </template>
+          </template>
+          <template v-if="!viewpharmameta">
+            <template v-for="(subject, j) in o">
+              <p-d-skos-preflabel :p="p" :o="subject" :key="componentid+'subject'+j"></p-d-skos-preflabel>
+            </template>
+              <v-btn @click="pharmaStructure()">View/reload full metadata</v-btn>
+                 <template v-for="(categ,index) in pharma">
+              <v-card v-if="categ.fields.length>0" :key="index+categ.category">
+                <v-toolbar dense flat>
+                  <v-layout>
+                    <v-toolbar-title class="font-weight-light">{{categ.label}}</v-toolbar-title>
+                  </v-layout>
+                </v-toolbar>
+
+                <template v-if="categ.fields.length>0">
+                  <v-card v-for="(l,index) in categ.fields" :key="l['@type']+'field'+index">
+                    <v-layout v-if="l">
+                    
+                      <v-flex xs11>
+                      
+                        <p-d-skos-preflabel
+                          v-if="getSkosexactMatch(l)==undefined"
+                          :o="l"
+                          :key="l+index+'pharmafreesubject'"
+                        ></p-d-skos-preflabel>
+
+                        <ph-d-metadata
+                          v-if="getSkosexactMatch(l)"
+                          :o="l"
+                          :p="p"
+                          :key="l+index+'pharmasubject'"
+                        ></ph-d-metadata>
+                        <v-divider></v-divider>
+                      </v-flex>
+                    </v-layout>
+                  </v-card>
+                </template>
+              </v-card>
+              <v-card v-if="categ.subcategory" :key="index+categ.label">
+                <v-toolbar dense flat>
+                  <v-layout>
+                    <v-toolbar-title class="font-weight-light">{{categ.label}}</v-toolbar-title>
+                  </v-layout>
+                </v-toolbar>
+
+                <template v-if="categ.subcategory.length>0">
+                 
+                  <v-card v-for="l in categ.subcategory" :key="l.category+'field'">
+                    <v-layout v-if="l">
+                      <v-flex xs1 class="subheading">
+                        <div class="text-xs-center">
+                          <a :href="l.id" target="_blank">{{l.category}}</a>
+                        </div>
+                      </v-flex>
+
+                      <v-flex xs11>
                         <v-card v-for="(inputf,index) in l.fields" :key="index+'subjectField'">
+                         
                           <p-d-skos-preflabel
+                            v-if="getSkosexactMatch(inputf)==undefined"
                             :p="getLabel(inputf['@type'])"
                             :o="inputf"
                             :key="inputf+index+'pharmafreesubject'"
                           ></p-d-skos-preflabel>
 
+                          <ph-d-metadata
+                            v-if="getSkosexactMatch(inputf)"
+                            :o="inputf"
+                            :p="p"
+                            :key="index+'pharmasubject'"
+                          ></ph-d-metadata>
                           <v-divider></v-divider>
                         </v-card>
                       </v-flex>
+                     
                     </v-layout>
                   </v-card>
                 </template>
               </v-card>
             </template>
           </template>
-          <template v-if="!viewpharmameta">
-            <template v-for="(subject, j) in o">
-              <p-d-skos-preflabel :p="p" :o="subject" :key="componentid+'subject'+j"></p-d-skos-preflabel>
-            </template>
-          </template>
-          <v-btn @click="pharmaStructure()">view full data</v-btn>
+         
         </template>
 
         <template v-else-if="p==='@type'"></template>
@@ -464,6 +527,7 @@ import { parseoutput } from "../../../mixins/parseoutput";
 import { matchsubject } from "../../../mixins/matchsubject";
 import fields from "../../../utils/fields";
 import PImg from "../../utils/PImg";
+import arrays from "@/utils/arrays";
 
 export default {
   name: "ph-d-jsonld",
@@ -479,9 +543,93 @@ export default {
     componentid: function() {
       return Math.floor(Math.random() * 10000000);
     },
-    pharmaStructure: function(json) {
-      var subjectjson = this.jsonld["dcterms:subject"];
+    pharmaData: function() {
+      var s = this.jsonldd["dcterms:subject"];
+      //filter subjects for only the ones with subjects[i]["@type"]=!= "skos:Concept"
+      //that would be the pharma-related subjects
+      var subjects = s.filter(s => s["@type"] != "skos:Concept");
+
+      var n_subjects = [];
+
+      // take all the jsonld["dcterms:subject"] but not the ones which have no skos:prefLabel"
+      for (let i = 0; i < subjects.length; i++) {
+        var subcat = subjects[i]["@type"]; // thuis should be unique to each  entry field, comes from "subjectType" in jsonld
+
+        var categ = this.getCategory(subcat);
+
+        n_subjects[i] = {};
+        if (categ) {
+          n_subjects[i].category = categ;
+          n_subjects[i].selection = this.getDescription(subcat);
+          n_subjects[i].subcategory = subcat;
+        } else {
+          n_subjects[i].category = subcat;
+        }
+        //now check for the subcategories of:Biological macromolecules and Bioassay,
+
+        n_subjects[i].data = subjects[i];
+      }
+      //console.log("pharmaData", n_subjects);
+      //console.log("pharmaSubjects", this.pharmaSubjects);
+      return n_subjects;
+    }
+  },
+
+  mounted: function() {
+    this.$store.dispatch("loadLanguages");
+  },
+  props: {
+    jsonld: {
+      type: Object,
+      default: null
+    },
+    pid: String,
 
+    form: {
+      type: Object,
+      default: null
+    },
+    viewpharmameta: {
+      type: Boolean,
+      default: false
+    }
+  },
+  components: {
+    PDTitle,
+    PDEntity,
+    PhDJsonldLayout,
+    PDSkosPreflabel,
+    PDKeyword,
+    PDLangValue,
+    PDLicense,
+    PDValue,
+    PDDimension,
+    PDDuration,
+    PDGeoreference,
+    PDLabeledValue,
+    PDFunder,
+    PDProject,
+    PDBfPublication,
+    PDStudyPlan,
+    PDSeries,
+    PDAdaptation,
+    PDCitation,
+    PIUnknownReadonly,
+    PhDMetadata,
+    PImg
+  },
+  data() {
+    return {
+      jsonldd: this.jsonld,
+      pharma: []
+    };
+  },
+  methods: {
+    alert: function(e) {
+      console.log("alert", e);
+    },
+    pharmaStructure: function() {
+      var subjectjson = this.jsonld["dcterms:subject"];
       //filter subjects for only the ones with subjects[i]["@type"]=!= "skos:Concept"
       //that would be the pharma-related subjects
       var pharmajson = subjectjson.filter(
@@ -503,14 +651,24 @@ export default {
         var formFieldsFiltered = formFields.filter(
           formFields => formFields.type != "skos:Concept"
         );
+        formFieldsFiltered = formFields.filter(
+          formFields => formFields.value != ""
+        );
+        formFieldsFiltered = formFields.filter(
+          formFields => formFields.value != null
+        );
 
         for (var j = 0; j < formFieldsFiltered.length; j++) {
           //filter all the elem in subjects which have this type
           var jsonTypeArray = pharmajson.filter(function(fs) {
             return fs["@type"] == formFieldsFiltered[j].type;
           });
-          console.log("this.jsonld", jsonTypeArray);
+
           if (jsonTypeArray.length > 0) {
+            //for (var k = 0; k < jsonTypeArray.length; k++) {
+            //  console.log("jsonTypeArray", jsonTypeArray[k]);
+            //}
+            //find first whether there is a subcategory
             if (formFieldsFiltered[j].subcategory) {
               //the category is formFieldsFiltered[j].category
               // if it exists, push to it, otherwise create it
@@ -551,6 +709,8 @@ export default {
                 }
               }
             } else {
+              //the category is formFieldsFiltered[j].category
+              // if it exists, push to it, otherwise create it
               var n_categ = formFieldsFiltered[j].category[0];
 
               //check if it exists already
@@ -559,100 +719,42 @@ export default {
               );
 
               if (result >= 0) {
+                /* if (jsonStructured[result].subcategory) {
+                  var r = jsonStructured[result].subcategory.findIndex(
+                    obj => obj.category === n_subcat
+                  );
+                  console.log(
+                    "n_sub r",
+                    r,
+                    "formFieldsFiltered[j].infoRef",
+                    formFieldsFiltered[j].infoRef
+                  );
+                  if (r >= 0) {
+                    jsonStructured[result].subcategory[r].fields.push(
+                      jsonTypeArray[0]
+                    );
+                  } else {
+                    jsonStructured[result].subcategory.push({
+                      category: n_subcat,
+                      id: formFieldsFiltered[j].infoRef,
+                      fields: jsonTypeArray
+                    });
+                  }
+                } else {*/
+                jsonStructured[result].fields = jsonTypeArray;
+                //  category: n_categ,
+                //   id: formFieldsFiltered[j].infoRef,
+                //  fields: jsonTypeArray
+                //};
               }
             }
           }
         }
       }
-      console.log("jsonStructured", jsonStructured);
+      this.pharma = jsonStructured;
       return jsonStructured;
     },
 
-    pharmaData: function() {
-      var s = this.jsonldd["dcterms:subject"];
-      //filter subjects for only the ones with subjects[i]["@type"]=!= "skos:Concept"
-      //that would be the pharma-related subjects
-      var subjects = s.filter(s => s["@type"] != "skos:Concept");
-
-      var n_subjects = [];
-
-      // take all the jsonld["dcterms:subject"] but not the ones which have no skos:prefLabel"
-      for (let i = 0; i < subjects.length; i++) {
-        var subcat = subjects[i]["@type"]; // thuis should be unique to each  entry field, comes from "subjectType" in jsonld
-
-        var categ = this.getCategory(subcat);
-
-        n_subjects[i] = {};
-        if (categ) {
-          n_subjects[i].category = categ;
-          n_subjects[i].selection = this.getDescription(subcat);
-          n_subjects[i].subcategory = subcat;
-        } else {
-          n_subjects[i].category = subcat;
-        }
-        //now check for the subcategories of:Biological macromolecules and Bioassay,
-
-        n_subjects[i].data = subjects[i];
-      }
-      //console.log("pharmaData", n_subjects);
-      //console.log("pharmaSubjects", this.pharmaSubjects);
-      return n_subjects;
-    }
-  },
-
-  mounted: function() {
-    this.$store.dispatch("loadLanguages");
-  },
-  props: {
-    jsonld: {
-      type: Object,
-      default: null
-    },
-    pid: String,
-
-    form: {
-      type: Object,
-      default: null
-    },
-    viewpharmameta: {
-      type: Boolean,
-      default: false
-    }
-  },
-  components: {
-    PDTitle,
-    PDEntity,
-    PhDJsonldLayout,
-    PDSkosPreflabel,
-    PDKeyword,
-    PDLangValue,
-    PDLicense,
-    PDValue,
-    PDDimension,
-    PDDuration,
-    PDGeoreference,
-    PDLabeledValue,
-    PDFunder,
-    PDProject,
-    PDBfPublication,
-    PDStudyPlan,
-    PDSeries,
-    PDAdaptation,
-    PDCitation,
-    PIUnknownReadonly,
-    PhDMetadata,
-    PImg
-  },
-  data() {
-    return {
-      jsonldd: this.jsonld
-    };
-  },
-  methods: {
-    alert: function(e) {
-      console.log("alert", e);
-    },
-
     getCatElem: function(cat) {
       var elem = this.pharmaData.filter(
         pharmaData => pharmaData.category === cat
diff --git a/src/components/display/pharma_display/PhDMetadata.vue b/src/components/display/pharma_display/PhDMetadata.vue
index 34b67a8..58824f4 100644
--- a/src/components/display/pharma_display/PhDMetadata.vue
+++ b/src/components/display/pharma_display/PhDMetadata.vue
@@ -187,8 +187,6 @@ export default {
       var iri = this.getIri;
       //var iri = self.getSkosexactMatch(this.o);
 
-      console.log("irir ", iri);
-
       //before I was getting it all in an array in the parent component
 
       //if (r.hasOwnProperty(iri)) {
diff --git a/src/components/input/PhSubmit.vue b/src/components/input/PhSubmit.vue
index 833029f..bd4869b 100644
--- a/src/components/input/PhSubmit.vue
+++ b/src/components/input/PhSubmit.vue
@@ -17,7 +17,7 @@
       <v-tab-item v-if="form">
      
         <ph-input-form
-        :model="model"
+          :model="model"
           :form="form"
           :loading="loading"
           :templating="templating"
@@ -25,7 +25,6 @@
           :targetpid="targetpid"
           v-on:submit="checkWarnings()"
         ></ph-input-form>
-       
           <v-footer>
         Fields indicated with (*) are required field for submission.
         </v-footer>
diff --git a/src/components/input/pharma-input-fields/PISelect.vue b/src/components/input/pharma-input-fields/PISelect.vue
index 728dd6b..ec23a86 100644
--- a/src/components/input/pharma-input-fields/PISelect.vue
+++ b/src/components/input/pharma-input-fields/PISelect.vue
@@ -95,11 +95,9 @@ export default {
         if (this.$refs.form.validate()) {
           this.validationWarning = false;
         } else {
-          console.log("here");
           this.validationWarning = true;
         }
       } else {
-        console.log("here 2", this.formValidation);
         this.validationWarning = false;
       }
       /*console.log(
diff --git a/src/components/input/pharma-input-fields/PhInputForm.vue b/src/components/input/pharma-input-fields/PhInputForm.vue
index 42c2a66..ff4dd46 100644
--- a/src/components/input/pharma-input-fields/PhInputForm.vue
+++ b/src/components/input/pharma-input-fields/PhInputForm.vue
@@ -71,7 +71,7 @@
                   v-on:input-role="f.role=$event"
                   v-on:input-orcid="f.orcid=$event"
                   v-on:input-email="f.email=$event"
-                  v-on:add="addField(s[index].fields, f);alert(f)"
+                  v-on:add="addField(s[index].fields, f);"
                   v-on:remove="removeField(s[index].fields, f)"
                   v-on:up="sortFieldUp(s[index].fields, f)"
                   v-on:down="sortFieldDown(s[index].fields, f)"
@@ -249,7 +249,7 @@
               </v-flex>
             </v-layout>
 
-            <ph-d-jsonld :form="form" :viewpharmameta="false" :jsonld="jsonDisplay"></ph-d-jsonld>
+            <ph-d-jsonld :form="initialForm" :viewpharmameta="false" :jsonld="jsonDisplay"></ph-d-jsonld>
             <v-layout align-center justify-center fill-height>
               <v-flex>
                 <v-toolbar dense flat color="white">
@@ -265,46 +265,13 @@
               </v-flex>
               <v-flex xs12>
                 <v-card>
-                  <ph-d-jsonld :form="form" :jsonld="mjson"></ph-d-jsonld>
+                  
+                  <ph-d-jsonld :form="initialForm" :jsonld="mjson"></ph-d-jsonld>
                   <v-spacer></v-spacer>
                 </v-card>
               </v-flex>
             </v-layout>
             <v-layout align-center justify-end row class="ma-3">
-              <!--<v-dialog v-if="templating" v-model="templatedialog" width="500">
-                <v-btn
-                  class="mr-3"
-                  slot="activator"
-                  dark
-                  raised
-                  :loading="loading"
-                  :disabled="loading"
-                  color="grey"
-                >Save as template</v-btn>
-                <v-card>
-                  <v-card-title class="headline grey lighten-2" primary-title>
-                    <span v-t="'Save as template'"></span>
-                  </v-card-title>
-                  <v-card-text>
-                    <v-text-field v-model="templatename" :label="$t('Template name')"></v-text-field>
-                  </v-card-text>
-                  <v-card-actions>
-                    <v-spacer></v-spacer>
-                    <v-btn
-                      :loading="loading"
-                      :disabled="loading"
-                      color="grey"
-                      dark
-                      @click="templatedialog= false"
-                    >
-                      <span v-t="'Cancel'"></span>
-                    </v-btn>
-                    <v-btn :loading="loading" :disabled="loading" color="primary">
-                      <span v-t="'Save'"></span>
-                    </v-btn>
-                  </v-card-actions>
-                </v-card>
-              </v-dialog>-->
               <v-btn
                 v-if="targetpid"
                 raised
@@ -479,6 +446,9 @@ export default {
           return jsonmembersarray;
         }
       }
+    },
+    initialForm: function() {
+      return this.$store.state.initialForm.initialForm;
     }
   },
   data() {
diff --git a/src/store/index.js b/src/store/index.js
index bc03796..ce99f7b 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -2,6 +2,7 @@ import Vue from "vue";
 import Vuex from "vuex";
 import vocabulary from "./modules/vocabulary";
 import metadataInputs from "./modules/metadataInputs";
+import initialForm from "./modules/initialForm";
 
 Vue.use(Vuex);
 
@@ -83,10 +84,10 @@ export default new Vuex.Store({
               "Basic " + btoa(credentials.username + ":" + credentials.password)
           }
         })
-          .then(function(response) {
+          .then(function (response) {
             return response.json();
           })
-          .then(function(json) {
+          .then(function (json) {
             if (json.alerts && json.alerts.length > 0) {
               commit("setAlerts", json.alerts);
             }
@@ -97,9 +98,9 @@ export default new Vuex.Store({
               // if sign in was successful, get user's data (name, email, etc)
               fetch(
                 rootState.settings.instance.api +
-                  "/directory/user/" +
-                  state.user.username +
-                  "/data",
+                "/directory/user/" +
+                state.user.username +
+                "/data",
                 {
                   method: "GET",
                   mode: "cors",
@@ -108,10 +109,10 @@ export default new Vuex.Store({
                   }
                 }
               )
-                .then(function(response) {
+                .then(function (response) {
                   return response.json();
                 })
-                .then(function(json) {
+                .then(function (json) {
                   if (json.alerts && json.alerts.length > 0) {
                     commit("setAlerts", json.alerts);
                   }
@@ -124,14 +125,14 @@ export default new Vuex.Store({
                     resolve();
                   }
                 })
-                .catch(function(error) {
+                .catch(function (error) {
                   console.log(error);
                   reject();
                 });
             }
           })
 
-          .catch(function(error) {
+          .catch(function (error) {
             console.log(error); // eslint-disable-line no-console
             reject();
           });
@@ -146,17 +147,17 @@ export default new Vuex.Store({
             "X-XSRF-TOKEN": state.token
           }
         })
-          .then(function(response) {
+          .then(function (response) {
             return response.json();
           })
-          .then(function(json) {
+          .then(function (json) {
             commit("initStore");
             if (json.alerts && json.alerts.length > 0) {
               commit("setAlerts", json.alerts);
             }
             resolve();
           })
-          .catch(function(error) {
+          .catch(function (error) {
             console.log(error); // eslint-disable-line no-console
             commit("initStore");
             resolve();
@@ -166,7 +167,8 @@ export default new Vuex.Store({
   },
   modules: {
     vocabulary,
-    metadataInputs
+    metadataInputs,
+    initialForm
   },
   strict: debug
 });
diff --git a/src/store/modules/initialForm.js b/src/store/modules/initialForm.js
new file mode 100644
index 0000000..894166f
--- /dev/null
+++ b/src/store/modules/initialForm.js
@@ -0,0 +1,15 @@
+const state = {
+  initialForm: [],
+};
+
+const mutations = {
+  initForm(state, initialForm) {
+    state.initialForm = initialForm;
+  },
+
+};
+
+export default {
+  state,
+  mutations
+};
diff --git a/src/utils/arrays.js b/src/utils/arrays.js
index 55761ba..23cef21 100644
--- a/src/utils/arrays.js
+++ b/src/utils/arrays.js
@@ -1,5 +1,5 @@
 export default {
-  arrayMove (arr, oldIndex, newIndex) {
+  arrayMove(arr, oldIndex, newIndex) {
     if (newIndex >= arr.length) {
       var k = newIndex - arr.length + 1
       while (k--) {
@@ -9,23 +9,23 @@ export default {
     arr.splice(newIndex, 0, arr.splice(oldIndex, 1)[0])
     return arr // for testing, arr was modified inplace
   },
-  duplicate (arr, e) {
+  duplicate(arr, e) {
     var i = arr.indexOf(e)
     var e2 = JSON.parse(JSON.stringify(e))
     arr.splice(i + 1, 0, e2)
     return e2
   },
-  remove (arr, e) {
+  remove(arr, e) {
     var i = arr.indexOf(e)
     arr.splice(i, 1)
   },
-  moveUp (arr, e) {
+  moveUp(arr, e) {
     var i = arr.indexOf(e)
     if (i - 1 >= 0) {
       this.arrayMove(arr, i, i - 1)
     }
   },
-  moveDown (arr, e) {
+  moveDown(arr, e) {
     var i = arr.indexOf(e)
     if (i + 1 <= arr.length) {
       this.arrayMove(arr, i, i + 1)
-- 
GitLab