Adds confirmation dialog before leaving field or filter page without saving a form.

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

@@ -30,7 +30,7 @@
                             <grip-icon></grip-icon>
                             <span 
                                 class="field-name" 
-                                :class="{'is-danger': formWithErrors == field.id || field.status == 'auto-draft' || (editForms[field.id] != undefined && editForms[field.id].saved != true) }">
+                                :class="{'is-danger': formWithErrors == field.id }">
                                 {{ field.name }}
                             </span>
                             <span   
@@ -129,6 +129,27 @@ export default {
         FieldEditionForm,
         GripIcon
     },
+    beforeRouteLeave ( to, from, next ) {
+        let hasUnsavedForms = false;
+        for (let editForm in this.editForms) {
+            if (!this.editForms[editForm].saved) 
+                hasUnsavedForms = true;
+        }
+        if ((this.openedFieldId != '' && this.openedFieldId != undefined) || hasUnsavedForms ) {
+            this.$dialog.confirm({
+                message: this.$i18n.get('info_warning_fields_not_saved'),
+                    onConfirm: () => {
+                        this.onEditionCanceled();
+                        next();
+                    },
+                    cancelText: this.$i18n.get('cancel'),
+                    confirmText: this.$i18n.get('continue'),
+                    type: 'is-secondary'
+                });  
+        } else {
+            next()
+        }  
+    },
     methods: {
         ...mapActions('fields', [
             'fetchFieldTypes',
@@ -209,6 +230,7 @@ export default {
 
             // Opening collapse
             } else {
+
                 this.openedFieldId = field.id;
                 // First time opening
                 if (this.editForms[this.openedFieldId] == undefined) {

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

@@ -153,6 +153,27 @@ export default {
         FilterEditionForm,
         GripIcon
     },
+    beforeRouteLeave ( to, from, next ) {
+        let hasUnsavedForms = false;
+        for (let editForm in this.editForms) {
+            if (!this.editForms[editForm].saved) 
+                hasUnsavedForms = true;
+        }
+        if ((this.openedFilterId != '' && this.openedFilterId != undefined) || hasUnsavedForms ) {
+            this.$dialog.confirm({
+                message: this.$i18n.get('info_warning_filters_not_saved'),
+                    onConfirm: () => {
+                        this.onEditionCanceled();
+                        next();
+                    },
+                    cancelText: this.$i18n.get('cancel'),
+                    confirmText: this.$i18n.get('continue'),
+                    type: 'is-secondary'
+                });  
+        } else {
+            next()
+        }  
+    },
     methods: {
         ...mapActions('filter', [
             'fetchFilterTypes',

src/admin/tainacan-admin-i18n.php

@@ -27,6 +27,7 @@ return [
     'see' => __('See', 'tainacan'),
     'search' => __('Search', 'tainacan'),
     'advanced_search' => __('Advanced Search', 'tainacan'),
+    'continue' => __('Continue', 'tainacan'),
 
     // Wordpress Status
     'publish' => __('Publish', 'tainacan'),
@@ -147,6 +148,8 @@ return [
     'info_created_by'  => __('Created by: ', 'tainacan'),
     'info_date'  => __('Date: ', 'tainacan'),
     'info_not_saved'  => __('Not saved ', 'tainacan'),
+    'info_warning_fields_not_saved' => __('Are you sure? There are fields not saved, changes will be lost.', 'tainacan'),
+    'info_warning_filters_not_saved' => __('Are you sure? There are filters not saved, changes will be lost.', 'tainacan'),
 
     // Tainacan Field Types
     'tainacan-text'  => __('Text', 'tainacan'),