Removes unused functions on refactoring terms list.

src/admin/components/edition/term-edition-form.vue

@@ -149,7 +149,7 @@
                         .then(() => {
                             this.editForm = {};
                             this.formErrors = {};
-                            this.$emit('onEditionFinished');
+                            this.$termsListBus.onTermEditionSaved(this.editForm);
                         })
                         .catch((errors) => {
                             for (let error of errors.errors) {
@@ -172,7 +172,7 @@
                         .then(() => {
                             this.editForm.saved = true;
                             this.formErrors = {};
-                            this.$emit('onEditionFinished');
+                            this.$termsListBus.onTermEditionSaved(this.editForm);
                         })
                         .catch((errors) => {
                             for (let error of errors.errors) {
@@ -185,7 +185,7 @@
                 }
             },
             cancelEdition() {
-                this.$emit('onEditionCanceled', this.editForm);
+                this.$termsListBus.onTermEditionCanceled(this.editForm);
             },
             deleteHeaderImage() {
                 this.editForm = Object.assign({},

src/admin/components/lists/recursive-terms-list.vue

@@ -46,8 +46,8 @@
                         icon="plus-circle"/>
             </a>
             <a 
-                    :disabled="isEditingTerm"
+                    v-if="!isEditingTerm"
-                    @click.prevent="editTerm(term, index)">
+                    @click.prevent="editTerm()">
                 <b-icon 
                         type="is-secondary" 
                         icon="pencil"/>
@@ -63,7 +63,7 @@
     <div    
             class="term-item"
             :class="{
-                'opened-term': term.opened,
+                'opened-term': childTerm.opened,
             }" 
             v-for="(childTerm, childIndex) in term.children"
             :key="childTerm.id"
@@ -86,6 +86,7 @@ export default {
     data(){
         return {
             isLoadingTerms: false,
+            isEditingTerm: false,
             searchQuery: '',
             order: 'asc',
             showChildren: false 
@@ -151,7 +152,7 @@ export default {
                 this.showChildren = !this.showChildren;
             }
         },
-        editTerm(term, index) {
+        editTerm() {
             
             // Position edit form in a visible area
             let container = document.getElementById('repository-container');
@@ -160,62 +161,25 @@ export default {
             else
                 this.termEditionFormTop = 0;
         
-            this.isEditingTerm = true;
+            this.term.opened = !this.term.opened;
             
-            if (!term.opened) {
+            this.$termsListBus.onEditTerm(this.term);
-
-                // for (let i = 0; i < this.orderedTermsList.length; i++) {
-                //     // Checks if other terms are opened
-                //     if (term.id != this.orderedTermsList[i].id && this.orderedTermsList[i].opened) {
-                //         let otherTerm = this.orderedTermsList[i];
-                    
-                //         // Checks there's an original version of term (wasn't saved)
-                //         let originalIndex = this.termsList.findIndex(anOriginalTerm => anOriginalTerm.id === otherTerm.id);
-                //         if (originalIndex >= 0) {
-                //             let originalTerm = JSON.parse(JSON.stringify(this.termsList[originalIndex]));
-                //             originalTerm.saved = otherTerm.saved;
-                //             originalTerm.opened = otherTerm.opened;
-                //             if (JSON.stringify(otherTerm) != JSON.stringify(originalTerm)) {
-                //                 otherTerm.saved = false;
-                //             } else {
-                //                 otherTerm.saved = true;
-                //             }
-                //         // A new term is being closed
-                //         } else {
-                //             otherTerm.saved = false;
-                //         }
-                                      
-                //         otherTerm.opened = false;
-                //         this.orderedTermsList.splice(i, 1, otherTerm);
-                //     }
-                // }
-            } else {
-                let originalIndex = this.termsList.findIndex(anOriginalTerm => anOriginalTerm.id === term.id);
-                if (originalIndex >= 0) {
-
-                    let originalTerm = JSON.parse(JSON.stringify(this.termsList[originalIndex]));
-                    originalTerm.saved = term.saved;
-                    originalTerm.opened = term.opened;
-
-                    if (JSON.stringify(term) != JSON.stringify(originalTerm))
-                        term.saved = false;
-                    else 
-                        term.saved = true;
-                    
-                } else {
-                    term.saved = false;
-                }
-                this.isEditingTerm = false;
-            }
-            
-            term.opened = !term.opened;
-            this.$emit('')
             // this.orderedTermsList.splice(index, 1, term);
         
         },
     },
     created() {
-        //this.loadChildTerms(this.term.id, this.index);    
+        this.$termsListBus.$on('editTerm', (term) => {
+            this.isEditingTerm = true;
+        });
+        this.$termsListBus.$on('termEditionSaved', (term) => {
+            this.isEditingTerm = false;
+            this.term.opened = false;
+        });
+        this.$termsListBus.$on('termEditionCanceled', (term) => {
+            this.isEditingTerm = false;
+            this.term.opened = false;
+        });
     }
 }
 </script>

src/admin/components/lists/terms-list.vue

@@ -57,7 +57,7 @@
             <br>
 
             <div    
-                    v-for="(term, index) in termsList"
+                    v-for="(term, index) in localTerms"
                     :key="term.id">
                 
                 <recursive-terms-list 
@@ -68,16 +68,14 @@
         </div>
         <div 
                 class="column is-4 edit-forms-list"
-                :key="index"
+                v-show="isEditingTerm">
-                v-for="(term, index) in orderedTermsList"
-                v-show="term.opened">
             <term-edition-form 
                     :style="{ 'top': termEditionFormTop + 'px'}"
                     :taxonomy-id="taxonomyId"
                     @onEditionFinished="onTermEditionFinished()"
-                    @onEditionCanceled="onTermEditionCanceled(term)"
+                    @onEditionCanceled="onTermEditionCanceled(editTerm)"
-                    @onErrorFound="formWithErrors = term.id"
+                    @onErrorFound="formWithErrors = editTerm.id"
-                    :edit-form="term"/>
+                    :edit-form="editTerm"/>
         </div>
     </div>
     <!-- Empty state image -->
@@ -119,7 +117,8 @@ export default {
             order: 'asc',
             termEditionFormTop: 0,
             searchQuery: '',
-            termsColapses: []
+            localTerms: [],
+            editTerm: null
         }
     },
     props: {
@@ -132,7 +131,7 @@ export default {
     },
     watch: {
         termsList() {
-            this.generateOrderedTerms();
+            this.localTerms = JSON.parse(JSON.stringify(this.termsList));
         },
         taxonomyId() {
             this.loadTerms(0);
@@ -157,11 +156,6 @@ export default {
             this.loadTerms(0);
         },
         addNewTerm() {
-            if (this.isEditingTerm) {
-                let editingTermIndex = this.orderedTermsList.findIndex(anEditingTerm => anEditingTerm.opened == true);
-                if (editingTermIndex >= 0)
-                    this.onTermEditionCanceled(this.orderedTermsList[editingTermIndex]);
-            }
 
             let newTerm = {
                 taxonomyId: this.taxonomyId,
@@ -172,16 +166,9 @@ export default {
                 saved: false,
                 depth: 0
             }
-            this.orderedTermsList.push(newTerm);
+            this.localTerms.push(newTerm);
             this.editTerm(newTerm, this.orderedTermsList.length - 1);
         },
-        getOriginalTerm(termId){
-            let index = this.orderedTermsList.findIndex(originalTerm => originalTerm.id == termId);
-            if (index >= 0) {
-                return this.termsList[index];
-            }
-            return null
-        },
         tryToRemoveTerm(term) {
 
             // Checks if user is deleting a term with unsaved info.
@@ -247,9 +234,6 @@ export default {
                 }
             });  
         },
-        onTermEditionFinished() {   
-            this.isEditingTerm = false;
-        },
         onTermEditionCanceled(term) {
 
             let originalIndex = this.termsList.findIndex(anOriginalTerm => anOriginalTerm.id == term.id);
@@ -263,76 +247,12 @@ export default {
             }
             this.isEditingTerm = false;
         },
-        buildOrderedTermsList(parentId, termDepth) {
-
-            for (let i = 0; i < this.termsList.length; i++) {
-                let term = this.termsList[i];
-
-                if (term.parent != parentId ) {    
-                    continue;
-                } 
-                
-                term.depth = termDepth;
-                if (this.orderedTermsList[term.id] === undefined ) {
-                    term.opened = false;
-                    term.saved = true ;
-                } else {
-                    term.opened = (this.orderedTermsList[term.id].opened === undefined ? false : this.orderedTermsList[term.id].opened);
-                    term.saved = (this.orderedTermsList[term.id].saved === undefined ? true : this.orderedTermsList[term.id].saved);
-                }
-                if (term.taxonomy != null) {
-                    let termCollapseIndex = this.termsColapses.findIndex(aTerm => aTerm.id == term.id);
-                    if (termCollapseIndex >= 0) {
-                        term.collapsed = this.termsColapses[termCollapseIndex].collapsed;
-                        term.hasLoadedChildren = this.termsColapses[termCollapseIndex].hasLoadedChildren;
-                        term.hasCollapsedChildren = this.termsColapses[termCollapseIndex].hasCollapsedChildren;
-                        term.opened = this.termsColapses[termCollapseIndex].opened;
-                        term.saved = this.termsColapses[termCollapseIndex].saved;
-                    }
-                    this.orderedTermsList.push(JSON.parse(JSON.stringify(term)));
-                }
-
-                this.buildOrderedTermsList(term.id, termDepth + 1);
-            }
-        },
-        generateOrderedTerms() {
-            this.termsColapses = JSON.parse(JSON.stringify(this.orderedTermsList));
-            this.orderedTermsList = new Array();
-            this.buildOrderedTermsList(0, 0);
-        },
-
-        collapseTermChildren(parentId, parentIndex) {
-            if (this.orderedTermsList[parentIndex].hasCollapsedChildren != undefined && !this.orderedTermsList[parentIndex].hasCollapsedChildren) {
-                for (let i = 0; i < this.orderedTermsList.length; i++) {
-                    if (this.orderedTermsList[i].parent == parentId) {
-                        this.$set(this.orderedTermsList[i], 'collapsed', true);
-                        this.$set(this.orderedTermsList[i], 'hasCollapsedChildren', false);
-                        this.collapseTermChildren(this.orderedTermsList[i].id, i);
-                    }
-                }
-                this.$set(this.orderedTermsList[parentIndex], 'hasCollapsedChildren', true);
-            } else {
-                for (let i = 0; i < this.orderedTermsList.length; i++) {
-                    if (this.orderedTermsList[i].parent == parentId) {
-                        this.$set(this.orderedTermsList[i], 'collapsed', false);
-                        this.collapseTermChildren(this.orderedTermsList[i].id, i);
-                    }
-                }
-                this.$set(this.orderedTermsList[parentIndex], 'hasCollapsedChildren', false);
-            }
-        },
         loadTerms(parentId, parentIndex) {
 
             this.isLoadingTerms = true;
             let search = (this.searchQuery != undefined && this.searchQuery != '') ? { searchterm: this.searchQuery } : '';
             this.fetchChildTerms({ parentId: parentId, taxonomyId: this.taxonomyId, fetchOnly: '', search: search, all: '', order: this.order})
                 .then(() => {
-                                 
-                    if (parentId != undefined && parentId > 0) {
-                        this.orderedTermsList[parentIndex].hasLoadedChildren = true;
-                        this.orderedTermsList[parentIndex].hasCollapsedChildren = false;
-                    }
-                    this.generateOrderedTerms();
                     this.isLoadingTerms = false;   
                 })
                 .catch((error) => {
@@ -345,6 +265,19 @@ export default {
         if (this.taxonomyId !== String) {
             this.loadTerms(0);
         }
+        this.$termsListBus.$on('editTerm', (term) => {
+            this.editTerm = term;
+            this.isEditingTerm = true;
+        });
+        this.$termsListBus.$on('termEditionSaved', (term) => {
+            this.isEditingTerm = false;
+            this.editTerm = null;
+        });
+        this.$termsListBus.$on('termEditionCanceled', (term) => {
+            this.isEditingTerm = false;
+            this.editTerm = null;
+            this.onTermEditionCanceled();
+        });
     }
     
 }

src/admin/js/main.js

@@ -44,6 +44,7 @@ import draggable from 'vuedraggable'
 import store from '../../js/store/store'
 import router from './router'
 import eventBusSearch from '../../js/event-bus-search';
+import termsListBus from './terms-list-bus.js';
 import { I18NPlugin, UserPrefsPlugin, RouterHelperPlugin, ConsolePlugin, UserCapabilitiesPlugin } from './utilities';
 import VueTheMask from 'vue-the-mask';
 
@@ -90,6 +91,7 @@ Vue.component('help-button', HelpButton);
 Vue.component('draggable', draggable);
 Vue.component('tainacan-title', TainacanTitle);
 
+Vue.use(termsListBus, {});
 Vue.use(eventBusSearch, { store: store, router: router});
 
 // Changing title of pages

src/admin/js/terms-list-bus.js

@@ -0,0 +1,22 @@
+export default {
+
+    install(Vue, options = {}) {
+
+        Vue.prototype.$termsListBus = new Vue({
+
+            data: {
+            },
+            methods: {
+                onEditTerm(term) {
+                    this.$emit('editTerm', term);
+                },
+                onTermEditionSaved(term) {
+                    this.$emit('termEditionSaved', term);
+                },
+                onTermEditionCanceled(term) {
+                    this.$emit('termEditionCanceled', term);
+                }
+            }
+        });
+    }
+}