Merge pull request #1121 from solverat/range_order

allow price range ordering

src/CoreShop/Bundle/ProductQuantityPriceRulesBundle/Resources/public/pimcore/js/productQuantityPriceRules/ranges.js

@@ -18,8 +18,10 @@ coreshop.product_quantity_price_rules.ranges = Class.create({
     objectId: null,
     clipboardManager: null,
     pricingBehaviourTypes: [],
+    storeDataChanged: false,
 
     initialize: function (ruleId, objectId, clipboardManager, pricingBehaviourTypes) {
+        this.storeDataChanged = false;
         this.internalTmpId = Ext.id();
         this.ruleId = ruleId;
         this.objectId = objectId;
@@ -129,6 +131,10 @@ coreshop.product_quantity_price_rules.ranges = Class.create({
         var grid = this.rangesContainer.query('[name=price-rule-ranges-grid]')[0],
             store = grid.getStore();
 
+        if (this.storeDataChanged === true) {
+            return true;
+        }
+
         if (store.getModifiedRecords().length > 0 || store.getNewRecords().length > 0 || store.getRemovedRecords().length > 0) {
             return true;
         }
@@ -220,6 +226,42 @@ coreshop.product_quantity_price_rules.ranges = Class.create({
                     return t('no');
                 }
             },
+            {
+                xtype: 'actioncolumn',
+                menuText: t('up'),
+                width: 30,
+                items: [
+                    {
+                        tooltip: t('up'),
+                        icon: '/bundles/pimcoreadmin/img/flat-color-icons/up.svg',
+                        handler: function (grid, rowIndex) {
+                            if (rowIndex > 0) {
+                                var rec = grid.getStore().getAt(rowIndex);
+                                grid.getStore().removeAt(rowIndex);
+                                grid.getStore().insert(rowIndex - 1, [rec]);
+                            }
+                        }.bind(this)
+                    }
+                ]
+            },
+            {
+                xtype: 'actioncolumn',
+                menuText: t('down'),
+                width: 30,
+                items: [
+                    {
+                        tooltip: t('down'),
+                        icon: '/bundles/pimcoreadmin/img/flat-color-icons/down.svg',
+                        handler: function (grid, rowIndex) {
+                            if (rowIndex < (grid.getStore().getCount() - 1)) {
+                                var rec = grid.getStore().getAt(rowIndex);
+                                grid.getStore().removeAt(rowIndex);
+                                grid.getStore().insert(rowIndex + 1, [rec]);
+                            }
+                        }.bind(this)
+                    }
+                ]
+            },
             {
                 xtype: 'actioncolumn',
                 menuText: t('delete'),
@@ -245,25 +287,81 @@ coreshop.product_quantity_price_rules.ranges = Class.create({
             items: [
                 {
                     xtype: 'grid',
+                    enableDragDrop: true,
+                    ddGroup: 'element',
                     name: 'price-rule-ranges-grid',
                     frame: false,
                     autoScroll: true,
                     store: new Ext.data.Store({
-                        data: this.adjustRangeStoreData(storeData)
+                        data: this.adjustRangeStoreData(storeData),
+                        listeners: {
+                            add: function () {
+                                this.storeDataChanged = true;
+                            }.bind(this),
+                            remove: function () {
+                                this.storeDataChanged = true;
+                            }.bind(this),
+                            clear: function () {
+                                this.storeDataChanged = true;
+                            }.bind(this),
+                            update: function (store) {
+                                if (store.ignoreDataChanged) {
+                                    return;
+                                }
+                                this.storeDataChanged = true;
+                            }.bind(this)
+                        }
                     }),
                     columnLines: true,
                     stripeRows: true,
                     bodyCls: 'pimcore_editable_grid',
                     trackMouseOver: true,
                     columns: columns,
-                    clicksToEdit: 1,
-                    selModel: Ext.create('Ext.selection.CellModel', {}),
+                    selModel: {
+                        selType: 'rowmodel'
+                    },
                     autoExpandColumn: 'value_col',
                     plugins: [
                         this.generateCellEditing()
                     ],
                     viewConfig: {
-                        forceFit: true
+                        forceFit: true,
+                        markDirty: false,
+                        plugins: {
+                            ptype: 'gridviewdragdrop',
+                            draggroup: 'element'
+                        },
+                        listeners: {
+                            drop: function (node, data, dropRec, dropPosition) {
+                                // this is necessary to avoid endless recursion when lists are sorted via d&d
+                                var panel = this.rangesContainer.up('panel'),
+                                    items, subItems;
+
+                                if (panel && panel.hasOwnProperty('items')) {
+                                    items = panel.items;
+                                }
+
+                                if (items && items.hasOwnProperty('items')) {
+                                    subItems = items.items;
+                                }
+
+                                if (subItems && subItems.length > 0) {
+                                    subItems[0].focus();
+                                }
+
+                            }.bind(this),
+                            // see https://github.com/pimcore/pimcore/issues/979
+                            cellmousedown: function (element, td, cellIndex, record, tr, rowIndex, event) {
+                                var el;
+                                if (event.getTarget()) {
+                                    el = Ext.fly(event.getTarget());
+                                    if (el && el.hasOwnProperty('id')) {
+                                        return false;
+                                    }
+                                }
+                                return true;
+                            }
+                        }
                     },
                     tbar: [
                         {