Implemented drag'n'drop for parts on the category tree, fixes #540

partkeepr · Dec 18, 2015 · f16e4fb · f16e4fb
1 parent 10c9820
commit f16e4fb
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 3 deletions.
diff --git a/src/PartKeepr/FrontendBundle/Resources/public/js/Components/Part/PartCategoryTree.js b/src/PartKeepr/FrontendBundle/Resources/public/js/Components/Part/PartCategoryTree.js
@@ -2,7 +2,13 @@ Ext.define("PartKeepr.PartCategoryTree", {
     extend: 'PartKeepr.CategoryEditorTree',
     alias: 'widget.PartCategoryTree',
 
-    ddGroup: 'PartTree',
+    viewConfig: {
+        plugins: {
+            ptype: 'treeviewdragdrop',
+            sortOnDrop: true,
+            ddGroup: 'PartTree'
+        }
+    },
     categoryModel: 'PartKeepr.PartBundle.Entity.PartCategory',
     rootVisible: false,
 
@@ -22,5 +28,19 @@ Ext.define("PartKeepr.PartCategoryTree", {
             disabled: true
         });
         this.toolbar.add(['->', this.syncButton]);
+    },
+    listeners: {
+        "foreignModelDrop": function (record, target)
+        {
+            record.setCategory(target);
+            record.save({
+                success: function ()
+                {
+                    if (record.store && record.store.reload) {
+                        record.store.reload();
+                    }
+                }
+            });
+        }
     }
 });
diff --git a/src/PartKeepr/FrontendBundle/Resources/public/js/Components/Part/PartsManager.js b/src/PartKeepr/FrontendBundle/Resources/public/js/Components/Part/PartsManager.js
@@ -11,6 +11,7 @@ Ext.define('PartKeepr.PartManager', {
     id: 'partkeepr-partmanager',
     border: false,
     padding: 5,
+    dragAndDrop: true,
 
     /**
      * Defines if the border layout should be compact or regular.
@@ -70,9 +71,24 @@ Ext.define('PartKeepr.PartManager', {
         this.detail = Ext.create("PartKeepr.PartDisplay", {title: i18n("Part Details")});
         this.detail.on("editPart", this.onEditPart, this);
 
+        var gridConfig = {
+            title: i18n("Parts List"), region: 'center', layout: 'fit', store: this.getStore()
+        };
+
+        if (this.dragAndDrop) {
+            gridConfig.viewConfig = {
+                plugins: {
+                    ddGroup: 'PartTree',
+                    ptype: 'gridviewdragdrop',
+                    enableDrop: false
+                }
+            };
+
+            gridConfig.enableDragDrop = true;
+        }
+
         // Create the grid
-        this.grid = Ext.create("PartKeepr.PartsGrid",
-            {title: i18n("Parts List"), region: 'center', layout: 'fit', store: this.getStore()});
+        this.grid = Ext.create("PartKeepr.PartsGrid", gridConfig);
         this.grid.on("editPart", this.onEditPart, this);
 
         // Create the grid listeners