wip

app/assets/javascripts/admin/treeview.js

@@ -19,7 +19,19 @@ window.osuny.treeView = {
                 group: 'nested',
                 animation: 150,
                 fallbackOnBody: true,
-                swapThreshold: 0.65
+                swapThreshold: 0.65,
+                onEnd: function (/**Event*/evt) {
+                    console.log(evt);
+            		var itemEl = evt.item;  // dragged HTMLElement
+            		evt.to;    // target list
+            		evt.from;  // previous list
+            		evt.oldIndex;  // element's old index within old parent
+            		evt.newIndex;  // element's new index within new parent
+            		evt.oldDraggableIndex; // element's old index within old parent, only counting draggable elements
+            		evt.newDraggableIndex; // element's new index within new parent, only counting draggable elements
+            		evt.clone // the clone element
+            		evt.pullMode;  // when item is in another sortable: `"clone"` if cloning, `true` if moving
+            	},
             });
         }
     },

app/views/admin/communication/website/pages/_treebranch.html.erb

 <% pages.each do |page| %>
-  <li class="<%= page.has_children? ? 'treeview__branch js-treeview-branch' : 'treeview__leaf' %>" data-id="<%= page.id %>">
-    <div class="d-flex align-items-center treeview__label">
+  <li class="list-group-item <%= page.has_children? ? 'treeview__branch js-treeview-branch' : 'treeview__leaf' %>" data-id="<%= page.id %>">
+    <div class="d-flex align-items-center justify-content-between treeview__label">
       <% if page.has_children? %>
         <%= link_to children_admin_communication_website_page_path(website_id: page.website.id, id: page.id),
                     class: 'js-treeview-element', remote: true do %>

app/views/admin/communication/website/pages/index.html.erb

 <% content_for :title, Communication::Website::Page.model_name.human(count: 2) %>
 
-<ul id="test" class="list-unstyled treeview js-treeview js-treeview-sortable">
+<ul class="list-unstyled list-group treeview js-treeview js-treeview-sortable">
   <%= render 'treebranch', pages: @pages %>
 </ul>
 <%#= render 'admin/communication/website/pages/list', pages: @pages %>