Fix file drag and drop on step [SCI-9508]

app/javascript/vue/protocol/container.vue

@@ -171,6 +171,7 @@
                 @reorder="startStepReorder"
                 :inRepository="inRepository"
                 :stepToReload="stepToReload"
+                :activeDragStep="activeDragStep"
                 @step:delete="updateStepsPosition"
                 @step:update="updateStep"
                 @stepUpdated="refreshProtocolStatus"
@@ -179,6 +180,7 @@
                 @step:move_element="reloadStep"
                 @step:attachemnts:loaded="stepToReload = null"
                 @step:move_attachment="reloadStep"
+                @step:drag_enter="dragEnter"
                 :reorderStepUrl="steps.length > 1 ? urls.reorder_steps_url : null"
                 :assignableMyModuleId="protocol.attributes.assignable_my_module_id"
               />
@@ -256,6 +258,7 @@
         reordering: false,
         publishing: false,
         stepToReload: null,
+        activeDragStep: null
       }
     },
     mounted() {
@@ -433,6 +436,9 @@
           $('.my_module-name .view-mode').trigger('click');
           $('.my_module-name .input-field').focus();
         }, 300)
+      },
+      dragEnter(id) {
+        this.activeDragStep = id;
       }
     }
   }

app/javascript/vue/protocol/step.vue

@@ -194,6 +194,10 @@
         type: Number,
         required: false
       },
+      activeDragStep: {
+        type: Number,
+        required: false
+      }
     },
     data() {
       return {
@@ -242,6 +246,11 @@
           this.loadElements();
           this.loadAttachments();
         }
+      },
+      activeDragStep() {
+        if (this.activeDragStep != this.step.id && this.dragingFile) {
+          this.dragingFile = false;
+        }
       }
     },
     mounted() {
@@ -349,6 +358,7 @@
         let dt = e.dataTransfer;
         if (dt.types && (dt.types.indexOf ? dt.types.indexOf('Files') != -1 : dt.types.contains('Files'))) {
           this.dragingFile = true;
+          this.$emit('step:drag_enter', this.step.id);
         }
       },
       loadAttachments() {