Fix protocol status bar reloading after step elements modifications [SCI-6986]

app/javascript/vue/protocol/attachments.vue

@@ -80,7 +80,7 @@
           :attachment.sync="attachmentsOrdered[index]"
           :stepId="parseInt(step.id)"
           @attachment:viewMode="updateAttachmentViewMode"
-          @attachment:delete="attachments.splice(index, 1)"
+          @attachment:delete="deleteAttachment"
         />
       </template>
     </div>
@@ -155,7 +155,11 @@
           return 'uploadingAttachment'
         }
         return `${attachment.attributes.view_mode}Attachment`
-      }
+      },
+      deleteAttachment(index) {
+        this.attachments.splice(index, 1)
+        this.$emit('attachment:deleted')
+      },
     }
   }
 </script>

app/javascript/vue/protocol/container.vue

@@ -101,6 +101,7 @@
               :inRepository="inRepository"
               @step:delete="updateStepsPosition"
               @step:update="updateStep"
+              @stepUpdated="refreshProtocolStatus"
               :reorderStepUrl="steps.length > 1 ? urls.reorder_steps_url : null"
             />
           </div>

app/javascript/vue/protocol/mixins/attachments.js

@@ -64,6 +64,7 @@ export default {
               });
               filesUploadedCntr += 1;
               if (filesUploadedCntr === filesToUploadCntr) {
+                this.$emit('stepUpdated');
                 resolve('done');
               }
             }

app/javascript/vue/protocol/step.vue

@@ -139,6 +139,7 @@
         <Attachments :step="step"
                     :attachments="attachments"
                     @attachments:openFileModal="showFileModal = true"
+                    @attachment:deleted="attachmentDeleted"
                     @attachments:order="changeAttachmentsOrder"
                     @attachments:viewMode="changeAttachmentsViewMode"
                     @attachment:viewMode="updateAttachmentViewMode"/>
@@ -310,12 +311,14 @@
           return e;
         })
         this.reorderElements(unorderedElements)
+        this.$emit('stepUpdated')
       },
       updateElement(element, skipRequest=false) {
         let index = this.elements.findIndex((e) => e.id === element.id);
 
         if (skipRequest) {
           this.elements[index].attributes.orderable = element.attributes.orderable;
+          this.$emit('stepUpdated');
         } else {
           $.ajax({
             url: element.attributes.orderable.urls.update_url,
@@ -323,6 +326,7 @@
             data: element.attributes.orderable,
             success: (result) => {
               this.elements[index].attributes.orderable = result.data.attributes;
+              this.$emit('stepUpdated');
             }
           }).error(() => {
             HelperModule.flashAlertMsg(this.i18n.t('errors.general'), 'danger');
@@ -385,6 +389,9 @@
         $('.comments-sidebar .close-btn').click();
         this.showCommentsSidebar = true
       },
+      attachmentDeleted() {
+        this.$emit('stepUpdated');
+      },
       closeCommentsSidebar() {
         this.showCommentsSidebar = false
       },

app/javascript/vue/protocol/step_attachments/clipboard_paste_modal.vue

@@ -17,7 +17,7 @@
           <p><strong>{{i18n.t('assets.from_clipboard.file_name')}}</strong></p>
           <div class="input-group">
             <input id="clipboardImageName" type="text" class="form-control"
-                    :placeholder="i18n.t('assets.from_clipboard.file_name_placeholder')" aria-describedby="image-name">      
+                    :placeholder="i18n.t('assets.from_clipboard.file_name_placeholder')" aria-describedby="image-name">
               <span class="input-group-addon" id="image-name"></span>
           </div>
         </div>