@easyquery/ui 7.2.4-beta03 → 7.2.4-rc02

package/dist/bundles/easyquery.ui.js

@@ -9008,10 +9008,20 @@ var ColumnRendererCP = /** @class */ (function () {
         enumerable: false,
         configurable: true
     });
+    Object.defineProperty(ColumnRendererCP.prototype, "columnEnabled", {
+        get: function () {
+            return this.column.enabled;
+        },
+        set: function (value) {
+            this.column.enabled = value;
+        },
+        enumerable: false,
+        configurable: true
+    });
     ColumnRendererCP.prototype.render = function () {
         var _this = this;
         this.baseAttr = this.getAttribute();
-        if (this.getButtonsToShow().indexOf("sorting") >= 0 && this.column.enabled) {
+        if (this.getButtonsToShow().indexOf("sorting") >= 0 && this.columnEnabled) {
             this.sortingButton = this.renderSoringButton(this.column.sorting);
             if (this.column.sorting !== external_easyqueryCore_.SortDirection.None) {
                 this.sortingButton.style.display = 'block';
@@ -9081,12 +9091,12 @@ var ColumnRendererCP = /** @class */ (function () {
             }
             //end enable button
             //start aggr func button
-            if (_this.getButtonsToShow().indexOf("type") >= 0 && _this.column.enabled) {
+            if (_this.getButtonsToShow().indexOf("type") >= 0 && _this.columnEnabled) {
                 builder.addChildElement(_this.renderColumnTypeButton());
             }
             //end aggr func button
             //start format selector button
-            if (_this.getButtonsToShow().indexOf("format") >= 0 && _this.column.enabled) {
+            if (_this.getButtonsToShow().indexOf("format") >= 0 && _this.columnEnabled) {
                 builder.addChildElement(_this.renderColumnFormatButton());
             }
             //end format selector button
@@ -9299,9 +9309,9 @@ var ColumnRendererCP = /** @class */ (function () {
                 .title(external_easyqueryCore_.i18n.getText('CmdToggleEnable'))
                 .attr('tabIndex', '0')
                 .addClass("".concat(this.cssPrefix, "-colelement ").concat(this.cssPrefix, "-column-checkbox"))
-                .addClass("".concat(this.column.enabled ? 'enabled' : ''))
+                .addClass("".concat(this.columnEnabled ? 'enabled' : ''))
                 .on('click', function () {
-                _this.column.enabled = !_this.column.enabled;
+                _this.columnEnabled = !_this.columnEnabled;
                 _this.column.fireChangedEvent();
                 return false;
             })
@@ -9357,8 +9367,8 @@ var ColumnRendererCP = /** @class */ (function () {
     };
     ColumnRendererCP.prototype.getClassesToAdd = function () {
         var result = "";
-        result += this.column.enabled ? '' : " ".concat(this.cssPrefix, "-disabled");
-        if (this.column.enabled) {
+        result += this.columnEnabled ? '' : " ".concat(this.cssPrefix, "-disabled");
+        if (this.columnEnabled) {
             result += this.column.isReadOnly() ? " ".concat(this.cssPrefix, "-readonly") : '';
         }
         result += this.column.isHidden() ? " ".concat(this.cssPrefix, "-hidden") : '';
@@ -9415,7 +9425,7 @@ var ColumnRendererCP = /** @class */ (function () {
             .addChild('div', function (b) { return b
             .addClass("".concat(utils/* eqCssPrefix */.YR, "-button"), "".concat(utils/* eqCssPrefix */.YR, "-column-button"), "".concat(utils/* eqCssPrefix */.YR, "-column-button-enable"))
             .title(external_easyqueryCore_.i18n.getText('CmdToggleEnable'))
-            .addClass(_this.column.enabled ? 'enabled' : '')
+            .addClass(_this.columnEnabled ? 'enabled' : '')
             .attr('tabIndex', '0')
             .on('click', function (evt) { return _this.buttonMenuHandler(ColumnAction.Enable, evt); }) //touchstart
             .on('keypress', function (evt) { if (evt.keyCode == 13) {
@@ -9423,7 +9433,7 @@ var ColumnRendererCP = /** @class */ (function () {
         } }); }).toDOM();
     };
     ColumnRendererCP.prototype.isEditable = function () {
-        return this.column.enabled && !this.column.isReadOnly();
+        return this.columnEnabled && !this.column.isReadOnly();
     };
     ColumnRendererCP.prototype.changeFormatHandler = function (ev) {
         var _this = this;
@@ -9589,7 +9599,7 @@ var ColumnRendererCP = /** @class */ (function () {
                 curQuery.fireColumnsChangedEvent(external_easyqueryCore_.QueryChangeAction.Delete, this.column);
                 break;
             case ColumnAction.Enable:
-                this.column.enabled = !this.column.enabled;
+                this.columnEnabled = !this.columnEnabled;
                 this.fireColumnChanged();
                 break;
             case ColumnAction.Hidden:
@@ -9663,7 +9673,7 @@ var ColumnRendererCP = /** @class */ (function () {
                         _this.buttonMenuHandler(action, evt);
                     },
                     itemFilterCallback: function (item) {
-                        var result = _this.column.enabled || item.id === "__group" || item.id === "enable" || item.id === "delete";
+                        var result = _this.columnEnabled || item.id === "__group" || item.id === "enable" || item.id === "delete";
                         return result;
                     },
                     menuClosedCallback: function () {
@@ -9756,7 +9766,7 @@ var ColumnRendererCP = /** @class */ (function () {
     ColumnRendererCP.prototype.getButtonMenuSelectedItems = function () {
         var _this = this;
         var arrSelected = [];
-        if (this.column.enabled) {
+        if (this.columnEnabled) {
             arrSelected.push("enable");
         }
         ;
@@ -10172,13 +10182,6 @@ var CustomSqlColumnRendererCP = /** @class */ (function (_super) {
         _this.dataTypeMenu = null;
         return _this;
     }
-    CustomSqlColumnRendererCP.prototype.render = function () {
-        if (!this.panel.areCustomExpressionsAllowed() && this.column.enabled) {
-            this.column.enabled = false;
-            this.fireColumnChanged();
-        }
-        return _super.prototype.render.call(this);
-    };
     CustomSqlColumnRendererCP.prototype.renderEnabledButton = function () {
         var elem = _super.prototype.renderEnabledButton.call(this);
         var child = elem.children[0];
@@ -10736,6 +10739,7 @@ var ColumnsPanel = /** @class */ (function (_super) {
     };
     ColumnsPanel.prototype.setOptions = function (options) {
         public_api/* utils.assignDeep */.P6.assignDeep(this.options, options);
+        this.getContext().options.allowCustomExpressions = options.allowCustomExpressions;
         if (browser_utils/* browserUtils.isMobileMode */.z.isMobileMode()) {
             this.options.buttons = ["menu"];
             this.options.showHeader = false;
@@ -10955,7 +10959,7 @@ var ColumnsPanel = /** @class */ (function (_super) {
     };
     ColumnsPanel.prototype.areCustomExpressionsAllowed = function () {
         var query = this.getQuery();
-        return query.isEx() && this.options.allowCustomExpressions;
+        return query.isEx() && this.getContext().options.allowCustomExpressions;
     };
     ColumnsPanel.prototype.addAllColumnsToEntitiesList = function (list) {
         var _this = this;
@@ -11384,7 +11388,7 @@ var ColumnRendererCB = /** @class */ (function () {
                 if (data.id == 'None' || data.id == "Ascending" || data.id == "Descending") {
                     var query = _this.bar.getQuery();
                     _this.column.sorting = strToSortDirection(data.id);
-                    _this.column.sortIndex = query.getColumnSortIndex(_this.column);
+                    _this.column._sortIndex = query.getColumnSortIndex(_this.column);
                     _this.fireColumnChanged();
                 }
                 else {
@@ -11939,10 +11943,15 @@ var ColumnsBar = /** @class */ (function (_super) {
                     _this.hideLandingSlot();
                 },
                 onDrop: function (container, ev) {
-                    var query = _this.getQuery();
-                    var columns = query.getColumns();
-                    var index = columns.indexOf(ev.data.column);
-                    _this.moveColumnCore(index, _this.landingIndex);
+                    if (_this.landingIndex >= 0) {
+                        var query = _this.getQuery();
+                        var columns = query.getColumns();
+                        var index = columns.indexOf(ev.data.column);
+                        _this.moveColumnCore(index, _this.landingIndex);
+                    }
+                    else {
+                        ev.item.element.removeAttribute('style');
+                    }
                 }
             });
         }
@@ -12575,6 +12584,7 @@ var ColumnRendererSB = /** @class */ (function () {
         configurable: true
     });
     ColumnRendererSB.prototype.render = function () {
+        var _this = this;
         this.baseAttr = this.getAttribute();
         var builder = (0,lib_public_api/* domel */.uC)('div');
         builder.data('id', this.column.id);
@@ -12584,6 +12594,23 @@ var ColumnRendererSB = /** @class */ (function () {
                 .replaceChild(builder.toDOM(), this.element);
         }
         this.element = builder.toDOM();
+        if (this.bar.options.allowDragDrop) {
+            lib_public_api/* eqDragManager.registerDraggableItem */.Yy.registerDraggableItem({
+                element: this.element,
+                scope: "entityAttrSortSB",
+                beforeDragStart: function () { return _this.element.dispatchEvent((0,lib_public_api/* createBrowserEvent */.sJ)('mouseleave')); },
+                onDragStart: function (ev) {
+                    _this.element.style.display = 'none';
+                    ev.dropEffect = lib_public_api/* DropEffect.Allow */.KX.Allow;
+                },
+                onDragEnd: function (ev) {
+                    if (!ev.data.finishedSuccessfully) {
+                        _this.element.removeAttribute('style');
+                    }
+                },
+                data: { column: this.column }
+            });
+        }
         builder
             .addClass(this.getClassesToAdd())
             .addClass(browser_utils/* browserUtils.getMobileCssClass */.z.getMobileCssClass())
@@ -12686,10 +12713,13 @@ var ColumnRendererSB = /** @class */ (function () {
                     }
                     else {
                         _this.column.sorting = strToSortDirection(data.id);
-                        _this.column.sortIndex = query.getColumnSortIndex(_this.column);
+                        _this.column._sortIndex = query.getColumnSortIndex(_this.column);
                         _this.fireColumnChanged();
                     }
                 }
+                else {
+                    _this.bar.moveColumn(_this.column, data.id);
+                }
             },
             menuClosedCallback: function () {
                 _this.keepShowingButtons = false;
@@ -12748,6 +12778,7 @@ var SortingBar = /** @class */ (function (_super) {
             showAddRow: true,
             attrElementFormat: '{entity} {attr}',
             titleElementFormat: null,
+            allowDragDrop: true,
             menuOptions: {
                 showSearchBoxAfter: 30,
                 searchBoxAutoFocus: true,
@@ -12759,8 +12790,17 @@ var SortingBar = /** @class */ (function (_super) {
         _this.sortMenuList = [
             { id: 'None', text: public_api/* i18n.getText */.ag.getText('CmdNotSorted') },
             { id: 'Ascending', text: public_api/* i18n.getText */.ag.getText('CmdAscending') },
-            { id: 'Descending', text: public_api/* i18n.getText */.ag.getText('CmdDescending') }
+            { id: 'Descending', text: public_api/* i18n.getText */.ag.getText('CmdDescending') },
+            { id: '---', text: '---' },
+            { id: 'MoveTop', text: public_api/* i18n.getText */.ag.getText('CmdMoveToFirst') },
+            { id: 'MoveUp', text: public_api/* i18n.getText */.ag.getText('CmdMoveToPrev') },
+            { id: 'MoveDown', text: public_api/* i18n.getText */.ag.getText('CmdMoveToNext') },
+            { id: 'MoveBottom', text: public_api/* i18n.getText */.ag.getText('CmdMoveToLast') }
         ];
+        _this.landingSlot = (0,lib_public_api/* domel */.uC)('div')
+            .addClass("".concat(utils/* eqCssPrefix */.YR, "-highlight"))
+            .toDOM();
+        _this.landingIndex = -1;
         (0,lib_public_api/* domel */.uC)(_this.slot)
             .addClass("".concat(_this.cssPrefix, "-panel"))
             .addClass(browser_utils/* browserUtils.getMobileCssClass */.z.getMobileCssClass());
@@ -12778,10 +12818,37 @@ var SortingBar = /** @class */ (function (_super) {
         return 'sortingBar';
     };
     SortingBar.prototype.init = function (context, options) {
+        var _this = this;
         _super.prototype.init.call(this, context, options);
         this.setOptions(options);
         this.destroyCore();
         this.attachQueryObserver();
+        lib_public_api/* eqDragManager.removeDropContainer */.Yy.removeDropContainer(this.slot);
+        if (this.options.allowDragDrop) {
+            lib_public_api/* eqDragManager.registerDropContainer */.Yy.registerDropContainer({
+                element: this.slot,
+                scopes: ["entityAttrSortSB"],
+                onDragEnter: function (container, ev) {
+                    _this.showLandingSlot(ev.pageX, ev.pageY);
+                },
+                onDragOver: function (container, ev) {
+                    _this.showLandingSlot(ev.pageX, ev.pageY);
+                },
+                onDragLeave: function (container, ev) {
+                    ev.dropEffect = lib_public_api/* DropEffect.Forbid */.KX.Forbid;
+                    _this.hideLandingSlot();
+                },
+                onDrop: function (container, ev) {
+                    if (_this.landingIndex >= 0) {
+                        var query = _this.getQuery();
+                        query.setColumnSortIndex(ev.data.column, _this.landingIndex);
+                    }
+                    else {
+                        ev.item.element.removeAttribute('style');
+                    }
+                }
+            });
+        }
     };
     SortingBar.prototype.setOptions = function (options) {
         public_api/* utils.assignDeep */.P6.assignDeep(this.options, options);
@@ -12796,66 +12863,21 @@ var SortingBar = /** @class */ (function (_super) {
                 && edata.part != external_easyqueryCore_.QueryChangePart.Columns && edata.part != external_easyqueryCore_.QueryChangePart.All)) {
                 return;
             }
-            switch (edata.action) {
-                case external_easyqueryCore_.QueryChangeAction.Modify: {
-                    var columns = edata.changee;
-                    var modifyColumn_1 = function (column) {
-                        var colEl = _this.columnsBlock.querySelector("div[data-id='".concat(column.id, "']"));
-                        if (colEl) {
-                            _this.renderColumn(column, colEl);
-                        }
-                    };
-                    if (Array.isArray(columns)) {
-                        columns.forEach(function (col) { return modifyColumn_1(col); });
-                    }
-                    else {
-                        modifyColumn_1(columns);
-                    }
-                    break;
-                }
-                case external_easyqueryCore_.QueryChangeAction.Add: {
-                    var columns = edata.changee;
-                    var addColumn_1 = function (column) {
-                        _this.addColumnElement(column);
-                    };
-                    if (Array.isArray(columns)) {
-                        columns.forEach(function (col) { return addColumn_1(col); });
-                    }
-                    else {
-                        addColumn_1(columns);
-                    }
-                    break;
-                }
-                case external_easyqueryCore_.QueryChangeAction.Delete: {
-                    var columns = edata.changee;
-                    var deleteColumn_1 = function (column) {
-                        var colEl = _this.columnsBlock.querySelector("div[data-id='".concat(column.id, "']"));
-                        if (colEl)
-                            _this.columnsBlock.removeChild(colEl);
-                    };
-                    if (Array.isArray(columns)) {
-                        columns.forEach(function (col) { return deleteColumn_1(col); });
-                    }
-                    else {
-                        deleteColumn_1(columns);
-                    }
-                    break;
-                }
-                default:
-                    _this.refresh();
-                    break;
-            }
+            _this.refresh();
         });
     };
     SortingBar.prototype.detachQueryObserver = function () {
         if (this.queryEventCallbackId) {
-            var query = this.getContext().getQuery();
+            var query = this.getQuery();
             query.removeChangedCallback(this.queryEventCallbackId);
         }
     };
     SortingBar.prototype.getQuery = function () {
         return this.getContext().getQuery();
     };
+    SortingBar.prototype.getModel = function () {
+        return this.getContext().getModel();
+    };
     SortingBar.prototype.destroyCore = function () {
         this.detachQueryObserver();
         this.clear();
@@ -12893,7 +12915,7 @@ var SortingBar = /** @class */ (function (_super) {
         this.entitiesMenu.showMenu(menuOptions);
     };
     SortingBar.prototype.createEntitiesMenu = function () {
-        var model = this.getContext().getModel();
+        var model = this.getModel();
         if (!model || model.isEmpty())
             return null;
         var menuId = this.slot.id;
@@ -12906,7 +12928,7 @@ var SortingBar = /** @class */ (function (_super) {
         this.entitiesMenu = new PopupMenu(options);
     };
     SortingBar.prototype.createSortMenu = function () {
-        var model = this.getContext().getModel();
+        var model = this.getModel();
         if (!model || model.isEmpty())
             return null;
         var menuId = this.slot.id;
@@ -12943,8 +12965,8 @@ var SortingBar = /** @class */ (function (_super) {
         }
         (0,lib_public_api/* domel */.uC)(this.slot)
             .addChildElement(this.columnsBlock);
-        var query = this.context.getQuery();
-        var columns = query.getColumns().concat(query.getJustSortedColumns());
+        var query = this.getQuery();
+        var columns = query.getSortedColumns(); // .getColumns().concat(query.getJustSortedColumns());
         columns.forEach(function (column, index) {
             var slot = _this.renderColumn(column);
             _this.columnsBlock.appendChild(slot);
@@ -12952,8 +12974,8 @@ var SortingBar = /** @class */ (function (_super) {
     };
     SortingBar.prototype.addNewColumn = function (attrId) {
         var _this = this;
-        var model = this.getContext().getModel();
-        var query = this.getContext().getQuery();
+        var model = this.getModel();
+        var query = this.getQuery();
         var getColumnByAttrId = function (attrid) {
             var attribute = model.getAttributeById(attrid);
             if (!attribute) {
@@ -12972,60 +12994,28 @@ var SortingBar = /** @class */ (function (_super) {
             }
             var column = query.createColumn(true);
             column.caption = _this.getDefaultColumnCaption(attribute);
-            column.sorting = external_easyqueryCore_.SortDirection.Ascending;
-            column.sortIndex = _this.getQuery().getColumnSortIndex(column);
+            column._sorting = external_easyqueryCore_.SortDirection.Ascending;
+            //column.sortIndex = this.getQuery().getColumnSortIndex(column);
             column.expr.tag = external_easyqueryCore_.ExprTag.EntityAttribute;
+            column.expr.dataType = attribute.dataType;
             //column.expr.id = attrid;
             column.expr.setValue(attrid, true);
             column.params.concat(attribute.params);
             return column;
         };
-        if (!this.getContext().getQuery()) {
+        if (!this.getQuery()) {
             return;
         }
-        return this.addColumn(getColumnByAttrId(attrId));
+        var newCol = getColumnByAttrId(attrId);
+        return this.getQuery().addColumn({
+            column: newCol
+        });
     };
     SortingBar.prototype.getDefaultColumnCaption = function (attr) {
         var format = this.options.titleElementFormat || this.options.attrElementFormat;
-        var model = this.getContext().getModel();
+        var model = this.getModel();
         return model.getAttributeText(attr, format);
     };
-    SortingBar.prototype.addColumn = function (column) {
-        var query = this.getContext().getQuery();
-        if (!query) {
-            return;
-        }
-        column = this.checkColumn(column);
-        if (!column) {
-            return;
-        }
-        column = query.addColumn({
-            caption: column.caption,
-            attributeId: column.expr.value,
-            sorting: column.sorting,
-            sortIndex: column.sortIndex,
-            justsorted: true
-        });
-        query.fireChangedEvent({
-            part: external_easyqueryCore_.QueryChangePart.SortingColumns,
-            action: external_easyqueryCore_.QueryChangeAction.Add,
-            changee: column
-        });
-        return column;
-    };
-    SortingBar.prototype.checkColumn = function (col) {
-        var query = this.getContext().getQuery();
-        var columns = query.getColumns()
-            .concat(query.getJustSortedColumns());
-        var colJson = JSON.stringify(col.expr.saveToData());
-        for (var i = 0; i < columns.length; i++) {
-            var qcolJson = JSON.stringify(columns[i].expr.saveToData());
-            if (qcolJson === colJson) {
-                return null;
-            }
-        }
-        return col;
-    };
     SortingBar.prototype.renderColumn = function (column, elem) {
         var renderer = new ColumnRendererSB(this, column, elem);
         if (renderer) {
@@ -13034,17 +13024,84 @@ var SortingBar = /** @class */ (function (_super) {
         }
         return null;
     };
-    //adds one column to the bar on the specified position
-    SortingBar.prototype.addColumnElement = function (column) {
-        var newColBlock = this.renderColumn(column);
-        this.columnsBlock.appendChild(newColBlock);
-        if (this.options.columnRenderedCallback) {
-            this.options.columnRenderedCallback(newColBlock);
-        }
-    };
     SortingBar.prototype.clear = function () {
         this.slot.innerHTML = '';
     };
+    SortingBar.prototype.moveColumn = function (column, direction) {
+        var query = this.getQuery();
+        var columns = query.getSortedColumns();
+        var index = query.getColumnSortIndex(column);
+        if (index >= 0) {
+            switch (direction) {
+                case 'MoveTop':
+                    query.setColumnSortIndex(column, 0);
+                    break;
+                case 'MoveUp':
+                    query.setColumnSortIndex(column, index > 0 ? index - 1 : 0);
+                    break;
+                case 'MoveDown':
+                    query.setColumnSortIndex(column, index < columns.length - 1 ? index + 1 : columns.length - 1);
+                    break;
+                case 'MoveBottom':
+                    query.setColumnSortIndex(column, columns.length - 1);
+                    break;
+            }
+            ;
+        }
+    };
+    SortingBar.prototype.showLandingSlot = function (pageX, pageY) {
+        var elements = this.columnsBlock.querySelectorAll("[class*=".concat(this.cssPrefix, "-row]"));
+        var columnSlots = [];
+        for (var i = 0; i < elements.length; i++) {
+            if (elements[i].style.display !== 'none') {
+                columnSlots.push(elements[i]);
+            }
+        }
+        if (columnSlots.length === 0) {
+            this.landingIndex = 0;
+            return;
+        }
+        var landingPos = (0,lib_public_api/* getElementAbsolutePos */.lE)(this.landingSlot);
+        if (pageX >= landingPos.x && pageX <= landingPos.x + this.landingSlot.offsetWidth
+            && pageY >= landingPos.y && pageY <= landingPos.y + this.landingSlot.offsetHeight) {
+            return;
+        }
+        var newLandingIndex = this.landingIndex;
+        for (var i = 0; i < columnSlots.length; i++) {
+            var colSlot = columnSlots[i];
+            var absPos = (0,lib_public_api/* getElementAbsolutePos */.lE)(colSlot);
+            var colWidth = colSlot.offsetWidth;
+            var colHeight = colSlot.offsetHeight;
+            var paddingWidth = 0.2 * colWidth;
+            var paddingHeight = 2;
+            if (pageX >= absPos.x + paddingWidth && pageX <= absPos.x + colWidth - paddingWidth
+                && pageY >= absPos.y + paddingHeight && pageY <= absPos.y + colHeight - paddingHeight) {
+                if (pageX > landingPos.x)
+                    newLandingIndex = i + 1;
+                else
+                    newLandingIndex = i;
+                break;
+            }
+        }
+        if (newLandingIndex != this.landingIndex || this.landingSlot.parentElement) {
+            this.landingIndex = newLandingIndex;
+            if (this.landingIndex <= 0) {
+                this.columnsBlock.insertBefore(this.landingSlot, columnSlots[0]);
+            }
+            if (this.landingIndex < columnSlots.length) {
+                this.columnsBlock.insertBefore(this.landingSlot, columnSlots[this.landingIndex]);
+            }
+            else {
+                this.columnsBlock.appendChild(this.landingSlot);
+            }
+        }
+    };
+    SortingBar.prototype.hideLandingSlot = function () {
+        this.landingIndex = -1;
+        if (this.landingSlot.parentElement) {
+            this.landingSlot.parentElement.removeChild(this.landingSlot);
+        }
+    };
     return SortingBar;
 }(external_easyqueryCore_.Widget));
 
@@ -16944,7 +17001,8 @@ var ManageDrillDownWidget = /** @class */ (function (_super) {
             }
         }, null);
         this.ddQuery = new external_easyqueryCore_.Query(model, null, {
-            parent: query
+            parent: query,
+            context: this.context
         });
         var dds = this.context.getQuery().getDrillDowns();
         if (dds.length) {