fix: aplica um lazy loading no sortable do jquery ui pelo evento mouseenter.

frontend/src/__apps/compilacao/js/old/compilacao_edit.js

@@ -1,4 +1,3 @@
-
 const _$ = window.$
 
 window.DispositivoEdit = function () {
@@ -500,7 +499,11 @@ window.DispositivoEdit = function () {
   }
 
   instance.reloadFunctionsDraggables = function () {
-    _$('.dpt-alts').sortable({
+    const dptAlts = _$('.dpt-alts')
+    if (dptAlts.length > 0) {
+      dptAlts.sortable({
+        connectWith: '.dpt-alts',
+        items: '.sorting-initialize',
         revert: true,
         distance: 15,
         start: function (event, ui) {
@@ -511,11 +514,14 @@ window.DispositivoEdit = function () {
 
           const url = pk + '/refresh?action=json_drag_move_dpt_alterado&index=' + ui.item.index() + '&bloco_pk=' + bloco_pk
           _$.get(url).done(function (data) {
-          // console.log(pk + ' - ' + bloco_pk)
-          // reloadFunctionsForObjectsOfCompilacao();
+            // handle data if needed
           })
         }
       })
+      dptAlts.find('.dpt').one('mouseenter', function () {
+        $(this).addClass('sorting-initialize')
+        dptAlts.sortable('refresh')
+      })
 
       _$('.dpt-alts .dpt').draggable({
         connectToSortable: '.dpt-alts',
@@ -523,7 +529,6 @@ window.DispositivoEdit = function () {
         zIndex: 1,
         distance: 15,
         drag: function (event, ui) {
-        // _$('.dpt-comp-selected').removeClass('dpt-comp-selected');
           _$('.dpt-alts').addClass('drag')
         },
         stop: function (event, ui) {
@@ -531,7 +536,10 @@ window.DispositivoEdit = function () {
         }
       })
 
-    _$('.dpt-alts').disableSelection()
+      dptAlts.disableSelection()
+    } else {
+      console.warn("No '.dpt-alts' elements found to make sortable/draggable.")
+    }
   }
   instance.scrollTo = function (dpt) {
     try {
@@ -570,7 +578,9 @@ window.DispositivoEdit = function () {
       instance.triggerBtnDptEdit(href[1])
     }
     _$('main').click(function (event) {
-      if (event.target === this || event.target === this.firstElementChild) { instance.clearEditSelected() }
+      if (event.target === this || event.target === this.firstElementChild) {
+        instance.clearEditSelected()
+      }
     })
     instance.waitHide()
   }