display success message

src/App.vue

@@ -138,18 +138,16 @@
             <div
               v-for="(message, index) in messages"
               :key="'message-' + index"
-              class="ui positive message"
+              class="ui info message"
             >
-              <div class="ui info message">
-                <div class="header">
-                  <i class="info circle icon"></i> Informations
-                </div>
-                <ul class="list">
-                  {{
-                    message.comment
-                  }}
-                </ul>
+              <div class="header">
+                <i class="info circle icon"></i> Informations
               </div>
+              <ul class="list">
+                {{
+                  message.comment
+                }}
+              </ul>
             </div>
           </div>
         </div>

src/store/index.js

@@ -47,6 +47,7 @@ export default new Vuex.Store({
     SSO_SETTED: false,
     USER_LEVEL_PROJECTS: null,
     user_permissions: null,
+    messages: []
   },
 
   mutations: {
@@ -89,6 +90,13 @@ export default new Vuex.Store({
     SET_USER_PERMISSIONS(state, userPermissions) {
       state.user_permissions = userPermissions;
     },
+    DISPLAY_MESSAGE(state, comment) {
+      state.messages = [{ comment }, ...state.messages];
+      document.getElementById("messages").scrollIntoView({ block: "start", inline: "nearest" });
+    },
+    CLEAR_MESSAGES(state) {
+      state.messages = [];
+    }
   },
 
   getters: {

src/store/modules/map.js

@@ -15,7 +15,7 @@ const map = {
     basemapsToDelete: [],
     features: [],
     geojsonFeatures: null,
-    layers: null
+    layers: null,
   },
   mutations: {
     SET_LAYERS(state, layers) {

src/views/feature/Feature_detail.vue

@@ -150,6 +150,7 @@
                 <td>
                   {{ link.relation_type_display }}
                   <router-link
+                    v-if="link.feature_to.feature_type_slug"
                     :to="{
                       name: 'details-signalement',
                       params: {
@@ -438,20 +439,25 @@ export default {
                 comment: response.data.id,
               })
               .then(() => {
-                this.getFeatureEvents(); //* display new comment on the page
-                this.getFeatureAttachments(); //* display new attachment from comment on the page
-                this.comment_form.attachment_file.file = null;
-                this.comment_form.attachment_file.value = null;
-                this.comment_form.title.file = null;
-                this.comment_form.title.value = null;
-                this.comment_form.comment.value = null;
+                this.confirmComment();
+                //this.getFeatureAttachments(); //* display new attachment from comment on the page
               });
           } else {
-            this.getFeatureEvents();
+            this.confirmComment();
           }
         });
     },
 
+    confirmComment() {
+      this.$store.commit("DISPLAY_MESSAGE", "Ajout du commentaire confirmé");
+      this.getFeatureEvents(); //* display new comment on the page
+      this.comment_form.attachment_file.file = null;
+      this.comment_form.attachment_file.value = null;
+      this.comment_form.title.file = null;
+      this.comment_form.title.value = null;
+      this.comment_form.comment.value = null;
+    },
+
     getAttachmentFileData(evt) {
       const files = evt.target.files || evt.dataTransfer.files;
       const period = files[0].name.lastIndexOf(".");