@easyquery/ui 7.4.0-rc02 → 7.4.0-rc03
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/assets/css/easyquery.css +1 -0
- package/dist/assets/css/easyquery.ui.css +3 -0
- package/dist/easyquery.ui.cjs.js +63 -23
- package/dist/easyquery.ui.esm.js +64 -24
- package/dist/types/widgets/columns_bar.d.ts +1 -0
- package/dist/types/widgets/renderers/columnsbar/editable_column_renderer_cb.d.ts +5 -0
- package/dist/types/widgets/widget_options.d.ts +7 -0
- package/package.json +2 -2
|
@@ -3295,6 +3295,9 @@ body {
|
|
|
3295
3295
|
position: relative;
|
|
3296
3296
|
font: normal 14px Trebuchet MS, Tahoma, Verdana, Geneva, Arial, Helvetica, sans-serif;
|
|
3297
3297
|
padding: 0.5rem;
|
|
3298
|
+
-webkit-user-select: none;
|
|
3299
|
+
-moz-user-select: none;
|
|
3300
|
+
user-select: none;
|
|
3298
3301
|
}
|
|
3299
3302
|
|
|
3300
3303
|
.eqjs-cb-header, .eqjs-sb-header {
|
package/dist/easyquery.ui.cjs.js
CHANGED
|
@@ -3611,7 +3611,9 @@ class ColumnsPanel extends core.Widget {
|
|
|
3611
3611
|
}
|
|
3612
3612
|
setOptions(options) {
|
|
3613
3613
|
core$1.utils.assignDeep(this.options, options);
|
|
3614
|
-
|
|
3614
|
+
if (typeof options.allowCustomExpressions !== 'undefined') {
|
|
3615
|
+
this.context.options.allowCustomExpressions = options.allowCustomExpressions;
|
|
3616
|
+
}
|
|
3615
3617
|
if (options.attrElementFormat) {
|
|
3616
3618
|
this.context.options.attributeFormat = options.attrElementFormat;
|
|
3617
3619
|
}
|
|
@@ -3973,6 +3975,13 @@ class ColumnsPanel extends core.Widget {
|
|
|
3973
3975
|
}
|
|
3974
3976
|
}
|
|
3975
3977
|
|
|
3978
|
+
exports.ColumnsEditMode = void 0;
|
|
3979
|
+
(function (ColumnsEditMode) {
|
|
3980
|
+
ColumnsEditMode[ColumnsEditMode["ReadOnly"] = 0] = "ReadOnly";
|
|
3981
|
+
ColumnsEditMode[ColumnsEditMode["FixedList"] = 16] = "FixedList";
|
|
3982
|
+
ColumnsEditMode[ColumnsEditMode["Full"] = 255] = "Full";
|
|
3983
|
+
})(exports.ColumnsEditMode || (exports.ColumnsEditMode = {}));
|
|
3984
|
+
|
|
3976
3985
|
class ColumnRendererCB {
|
|
3977
3986
|
constructor(panel, column, slot) {
|
|
3978
3987
|
this.functionMenu = null;
|
|
@@ -3996,7 +4005,7 @@ class ColumnRendererCB {
|
|
|
3996
4005
|
.replaceChild(builder.toDOM(), this.element);
|
|
3997
4006
|
}
|
|
3998
4007
|
this.element = builder.toDOM();
|
|
3999
|
-
if (this.bar.
|
|
4008
|
+
if (this.bar.isDraggable()) {
|
|
4000
4009
|
ui.eqDragManager.registerDraggableItem({
|
|
4001
4010
|
element: this.element,
|
|
4002
4011
|
scope: "entityAttrSort",
|
|
@@ -4043,15 +4052,19 @@ class ColumnRendererCB {
|
|
|
4043
4052
|
this.render();
|
|
4044
4053
|
}
|
|
4045
4054
|
isEditable() {
|
|
4046
|
-
|
|
4055
|
+
// Editable if enabled, not read-only, and editMode is All or FixedList (for title/sort/order)
|
|
4056
|
+
return this.column.enabled && !this.column.isReadOnly() && (this.bar.options.editMode === exports.ColumnsEditMode.Full || this.bar.options.editMode === exports.ColumnsEditMode.FixedList);
|
|
4047
4057
|
}
|
|
4048
4058
|
renderButtonsBlock() {
|
|
4059
|
+
// Only show delete/type buttons in All mode
|
|
4060
|
+
const showDelete = this.bar.options.editMode === exports.ColumnsEditMode.Full;
|
|
4061
|
+
const showType = this.bar.options.editMode === exports.ColumnsEditMode.Full;
|
|
4049
4062
|
return ui.domel('div', this.element)
|
|
4050
4063
|
.addClass(`${eqCssPrefix}-column-buttonsBlock`, `${this.cssPrefix}-buttonsBlock`)
|
|
4051
4064
|
.addChildElement(this.renderSortingButton())
|
|
4052
|
-
.addChildElement(this.renderColumnTypeButton())
|
|
4065
|
+
.addChildElement(showType ? this.renderColumnTypeButton() : null)
|
|
4053
4066
|
.addChildElement(this.renderColumnFormatButton())
|
|
4054
|
-
.addChildElement(this.renderDeleteButton())
|
|
4067
|
+
.addChildElement(showDelete ? this.renderDeleteButton() : null)
|
|
4055
4068
|
.toDOM();
|
|
4056
4069
|
}
|
|
4057
4070
|
renderCaptionBlock() {
|
|
@@ -4236,7 +4249,8 @@ class ColumnRendererCB {
|
|
|
4236
4249
|
return false;
|
|
4237
4250
|
}
|
|
4238
4251
|
renderDeleteButton() {
|
|
4239
|
-
|
|
4252
|
+
// Only show delete in All mode
|
|
4253
|
+
if (this.column.isReadOnly() || this.bar.options.editMode !== exports.ColumnsEditMode.Full) {
|
|
4240
4254
|
return null;
|
|
4241
4255
|
}
|
|
4242
4256
|
return ui.domel('div')
|
|
@@ -4309,7 +4323,8 @@ class ColumnRendererCB {
|
|
|
4309
4323
|
});
|
|
4310
4324
|
}
|
|
4311
4325
|
renderColumnTypeButton() {
|
|
4312
|
-
|
|
4326
|
+
// Only show type button in All mode
|
|
4327
|
+
if (!this.isEditable() || this.bar.options.allowAggrColumns === false || this.bar.options.editMode !== exports.ColumnsEditMode.Full) {
|
|
4313
4328
|
return null;
|
|
4314
4329
|
}
|
|
4315
4330
|
return ui.domel('div')
|
|
@@ -4520,6 +4535,9 @@ class AttrColumnRendererCB extends ColumnRendererCB {
|
|
|
4520
4535
|
this.fireColumnChanged();
|
|
4521
4536
|
}
|
|
4522
4537
|
changeColumnTypeHandler(ev) {
|
|
4538
|
+
// Only allow type change in All mode
|
|
4539
|
+
if (this.bar.options.editMode !== exports.ColumnsEditMode.Full)
|
|
4540
|
+
return;
|
|
4523
4541
|
this.functionMenu.showMenu({
|
|
4524
4542
|
anchor: ev.target,
|
|
4525
4543
|
selectedIds: null,
|
|
@@ -4564,10 +4582,18 @@ class AggrFuncColumnRendererCB extends AttrColumnRendererCB {
|
|
|
4564
4582
|
this.fireColumnChanged();
|
|
4565
4583
|
}
|
|
4566
4584
|
changeColumnTypeHandler(ev) {
|
|
4585
|
+
// Only allow type change in All mode
|
|
4586
|
+
if (this.bar.options.editMode !== exports.ColumnsEditMode.Full)
|
|
4587
|
+
return;
|
|
4567
4588
|
this.changeTypeToSimple();
|
|
4568
4589
|
}
|
|
4569
4590
|
}
|
|
4570
4591
|
|
|
4592
|
+
/**
|
|
4593
|
+
* Base class for editable column renderers for the ColumnsBar widgets.
|
|
4594
|
+
* It provides common functionality for rendering editable columns,
|
|
4595
|
+
* including handling column type changes and rendering buttons.
|
|
4596
|
+
*/
|
|
4571
4597
|
class EditableColumnRendererCB extends ColumnRendererCB {
|
|
4572
4598
|
getClassesToAdd() {
|
|
4573
4599
|
return `${this.cssPrefix}-row ${this.cssPrefix}-row-column-entattr` + super.getClassesToAdd();
|
|
@@ -4594,6 +4620,9 @@ class EditableColumnRendererCB extends ColumnRendererCB {
|
|
|
4594
4620
|
return true;
|
|
4595
4621
|
}
|
|
4596
4622
|
changeColumnTypeHandler(ev) {
|
|
4623
|
+
// Only allow type change in All mode
|
|
4624
|
+
if (this.bar.options.editMode !== exports.ColumnsEditMode.Full)
|
|
4625
|
+
return;
|
|
4597
4626
|
this.changeTypeToSimple();
|
|
4598
4627
|
}
|
|
4599
4628
|
}
|
|
@@ -4661,7 +4690,8 @@ class ColumnsBar extends core.Widget {
|
|
|
4661
4690
|
sortEntities: false,
|
|
4662
4691
|
columnRenderedCallback: null,
|
|
4663
4692
|
customExpressionText: 0,
|
|
4664
|
-
showAddAllForEntity: false
|
|
4693
|
+
showAddAllForEntity: false,
|
|
4694
|
+
editMode: exports.ColumnsEditMode.Full
|
|
4665
4695
|
};
|
|
4666
4696
|
this.landingSlot = ui.domel('div')
|
|
4667
4697
|
.addClass(`${eqCssPrefix}-highlight`)
|
|
@@ -4688,6 +4718,10 @@ class ColumnsBar extends core.Widget {
|
|
|
4688
4718
|
getWidgetType() {
|
|
4689
4719
|
return 'columnsBar';
|
|
4690
4720
|
}
|
|
4721
|
+
isDraggable() {
|
|
4722
|
+
// Only allow drag-drop in All and FixedList modes
|
|
4723
|
+
return this.options.allowDragDrop && this.options.editMode > exports.ColumnsEditMode.ReadOnly;
|
|
4724
|
+
}
|
|
4691
4725
|
init(context, options) {
|
|
4692
4726
|
super.init(context, options);
|
|
4693
4727
|
this.setOptions(options);
|
|
@@ -4700,7 +4734,8 @@ class ColumnsBar extends core.Widget {
|
|
|
4700
4734
|
this.detachQueryObserver();
|
|
4701
4735
|
this.attachQueryObserver();
|
|
4702
4736
|
ui.eqDragManager.removeDropContainer(this.slot);
|
|
4703
|
-
|
|
4737
|
+
// Only allow drag-drop in All and FixedList modes
|
|
4738
|
+
if (this.isDraggable()) {
|
|
4704
4739
|
ui.eqDragManager.registerDropContainer({
|
|
4705
4740
|
element: this.slot,
|
|
4706
4741
|
scopes: ["entityAttrSort"],
|
|
@@ -4826,7 +4861,9 @@ class ColumnsBar extends core.Widget {
|
|
|
4826
4861
|
}
|
|
4827
4862
|
setOptions(options) {
|
|
4828
4863
|
this.options = core$1.utils.assignDeep(this.options, options);
|
|
4829
|
-
|
|
4864
|
+
if (typeof options.allowCustomExpressions !== 'undefined') {
|
|
4865
|
+
this.context.options.allowCustomExpressions = options.allowCustomExpressions;
|
|
4866
|
+
}
|
|
4830
4867
|
}
|
|
4831
4868
|
showLandingSlot(pageX, pageY) {
|
|
4832
4869
|
const elements = this.columnsBlock.querySelectorAll(`[class*=${this.cssPrefix}-row]`);
|
|
@@ -4937,7 +4974,8 @@ class ColumnsBar extends core.Widget {
|
|
|
4937
4974
|
.addClass(`${this.cssPrefix}-columns`)
|
|
4938
4975
|
.addClass(getMobileCssClass())
|
|
4939
4976
|
.toDOM();
|
|
4940
|
-
|
|
4977
|
+
// Only show add row in All mode
|
|
4978
|
+
if (this.options.showAddRow && this.options.editMode === exports.ColumnsEditMode.Full) {
|
|
4941
4979
|
this.addRowButton =
|
|
4942
4980
|
ui.domel('div')
|
|
4943
4981
|
.toDOM();
|
|
@@ -5000,16 +5038,18 @@ class ColumnsBar extends core.Widget {
|
|
|
5000
5038
|
return false;
|
|
5001
5039
|
})
|
|
5002
5040
|
.toDOM();
|
|
5003
|
-
this.
|
|
5004
|
-
|
|
5005
|
-
|
|
5006
|
-
|
|
5007
|
-
|
|
5008
|
-
|
|
5009
|
-
|
|
5010
|
-
|
|
5011
|
-
|
|
5012
|
-
|
|
5041
|
+
if (this.options.editMode == exports.ColumnsEditMode.Full) {
|
|
5042
|
+
this.buttonsBlockDeleteButton = ui.domel('div', this.columnButtonsBlockMobile)
|
|
5043
|
+
.addClass(`${this.cssPrefix}-column-button`, `${this.cssPrefix}-column-button-delete`)
|
|
5044
|
+
.on('touchstart click', (ev) => {
|
|
5045
|
+
ev.stopPropagation();
|
|
5046
|
+
this.currentColumnRenderer.buttonDeleteClickHandler.call(this.currentColumnRenderer, ev);
|
|
5047
|
+
this.toggleColumnPicked(null);
|
|
5048
|
+
this.hideColumnButtonsMobile();
|
|
5049
|
+
return false;
|
|
5050
|
+
})
|
|
5051
|
+
.toDOM();
|
|
5052
|
+
}
|
|
5013
5053
|
ui.domel('div', this.columnButtonsBlockMobile)
|
|
5014
5054
|
.addClass(`${this.cssPrefix}-column-button-close-block`)
|
|
5015
5055
|
.on('touchstart click', () => {
|
|
@@ -5038,7 +5078,7 @@ class ColumnsBar extends core.Widget {
|
|
|
5038
5078
|
.setStyle('top', (top + rect.height).toString() + 'px');
|
|
5039
5079
|
}
|
|
5040
5080
|
//show/hide separate buttons
|
|
5041
|
-
if (column.enabled && !column.isReadOnly()) {
|
|
5081
|
+
if (column.enabled && !column.isReadOnly() && this.options.editMode > exports.ColumnsEditMode.ReadOnly) {
|
|
5042
5082
|
ui.domel(this.buttonsBlockSortingButton).show();
|
|
5043
5083
|
ui.domel(this.buttonsBlockTypeButton).show();
|
|
5044
5084
|
if (columnRenderer.formatButtonIsShown()) {
|
|
@@ -5053,7 +5093,7 @@ class ColumnsBar extends core.Widget {
|
|
|
5053
5093
|
ui.domel(this.buttonsBlockTypeButton).hide();
|
|
5054
5094
|
}
|
|
5055
5095
|
//show
|
|
5056
|
-
if (column.isReadOnly()) {
|
|
5096
|
+
if (column.isReadOnly() || this.options.editMode == exports.ColumnsEditMode.ReadOnly) {
|
|
5057
5097
|
ui.domel(this.columnButtonsBlockMobile).hide();
|
|
5058
5098
|
}
|
|
5059
5099
|
else {
|
package/dist/easyquery.ui.esm.js
CHANGED
|
@@ -3609,7 +3609,9 @@ class ColumnsPanel extends Widget {
|
|
|
3609
3609
|
}
|
|
3610
3610
|
setOptions(options) {
|
|
3611
3611
|
utils.assignDeep(this.options, options);
|
|
3612
|
-
|
|
3612
|
+
if (typeof options.allowCustomExpressions !== 'undefined') {
|
|
3613
|
+
this.context.options.allowCustomExpressions = options.allowCustomExpressions;
|
|
3614
|
+
}
|
|
3613
3615
|
if (options.attrElementFormat) {
|
|
3614
3616
|
this.context.options.attributeFormat = options.attrElementFormat;
|
|
3615
3617
|
}
|
|
@@ -3971,6 +3973,13 @@ class ColumnsPanel extends Widget {
|
|
|
3971
3973
|
}
|
|
3972
3974
|
}
|
|
3973
3975
|
|
|
3976
|
+
var ColumnsEditMode;
|
|
3977
|
+
(function (ColumnsEditMode) {
|
|
3978
|
+
ColumnsEditMode[ColumnsEditMode["ReadOnly"] = 0] = "ReadOnly";
|
|
3979
|
+
ColumnsEditMode[ColumnsEditMode["FixedList"] = 16] = "FixedList";
|
|
3980
|
+
ColumnsEditMode[ColumnsEditMode["Full"] = 255] = "Full";
|
|
3981
|
+
})(ColumnsEditMode || (ColumnsEditMode = {}));
|
|
3982
|
+
|
|
3974
3983
|
class ColumnRendererCB {
|
|
3975
3984
|
constructor(panel, column, slot) {
|
|
3976
3985
|
this.functionMenu = null;
|
|
@@ -3994,7 +4003,7 @@ class ColumnRendererCB {
|
|
|
3994
4003
|
.replaceChild(builder.toDOM(), this.element);
|
|
3995
4004
|
}
|
|
3996
4005
|
this.element = builder.toDOM();
|
|
3997
|
-
if (this.bar.
|
|
4006
|
+
if (this.bar.isDraggable()) {
|
|
3998
4007
|
eqDragManager.registerDraggableItem({
|
|
3999
4008
|
element: this.element,
|
|
4000
4009
|
scope: "entityAttrSort",
|
|
@@ -4041,15 +4050,19 @@ class ColumnRendererCB {
|
|
|
4041
4050
|
this.render();
|
|
4042
4051
|
}
|
|
4043
4052
|
isEditable() {
|
|
4044
|
-
|
|
4053
|
+
// Editable if enabled, not read-only, and editMode is All or FixedList (for title/sort/order)
|
|
4054
|
+
return this.column.enabled && !this.column.isReadOnly() && (this.bar.options.editMode === ColumnsEditMode.Full || this.bar.options.editMode === ColumnsEditMode.FixedList);
|
|
4045
4055
|
}
|
|
4046
4056
|
renderButtonsBlock() {
|
|
4057
|
+
// Only show delete/type buttons in All mode
|
|
4058
|
+
const showDelete = this.bar.options.editMode === ColumnsEditMode.Full;
|
|
4059
|
+
const showType = this.bar.options.editMode === ColumnsEditMode.Full;
|
|
4047
4060
|
return domel('div', this.element)
|
|
4048
4061
|
.addClass(`${eqCssPrefix}-column-buttonsBlock`, `${this.cssPrefix}-buttonsBlock`)
|
|
4049
4062
|
.addChildElement(this.renderSortingButton())
|
|
4050
|
-
.addChildElement(this.renderColumnTypeButton())
|
|
4063
|
+
.addChildElement(showType ? this.renderColumnTypeButton() : null)
|
|
4051
4064
|
.addChildElement(this.renderColumnFormatButton())
|
|
4052
|
-
.addChildElement(this.renderDeleteButton())
|
|
4065
|
+
.addChildElement(showDelete ? this.renderDeleteButton() : null)
|
|
4053
4066
|
.toDOM();
|
|
4054
4067
|
}
|
|
4055
4068
|
renderCaptionBlock() {
|
|
@@ -4234,7 +4247,8 @@ class ColumnRendererCB {
|
|
|
4234
4247
|
return false;
|
|
4235
4248
|
}
|
|
4236
4249
|
renderDeleteButton() {
|
|
4237
|
-
|
|
4250
|
+
// Only show delete in All mode
|
|
4251
|
+
if (this.column.isReadOnly() || this.bar.options.editMode !== ColumnsEditMode.Full) {
|
|
4238
4252
|
return null;
|
|
4239
4253
|
}
|
|
4240
4254
|
return domel('div')
|
|
@@ -4307,7 +4321,8 @@ class ColumnRendererCB {
|
|
|
4307
4321
|
});
|
|
4308
4322
|
}
|
|
4309
4323
|
renderColumnTypeButton() {
|
|
4310
|
-
|
|
4324
|
+
// Only show type button in All mode
|
|
4325
|
+
if (!this.isEditable() || this.bar.options.allowAggrColumns === false || this.bar.options.editMode !== ColumnsEditMode.Full) {
|
|
4311
4326
|
return null;
|
|
4312
4327
|
}
|
|
4313
4328
|
return domel('div')
|
|
@@ -4518,6 +4533,9 @@ class AttrColumnRendererCB extends ColumnRendererCB {
|
|
|
4518
4533
|
this.fireColumnChanged();
|
|
4519
4534
|
}
|
|
4520
4535
|
changeColumnTypeHandler(ev) {
|
|
4536
|
+
// Only allow type change in All mode
|
|
4537
|
+
if (this.bar.options.editMode !== ColumnsEditMode.Full)
|
|
4538
|
+
return;
|
|
4521
4539
|
this.functionMenu.showMenu({
|
|
4522
4540
|
anchor: ev.target,
|
|
4523
4541
|
selectedIds: null,
|
|
@@ -4562,10 +4580,18 @@ class AggrFuncColumnRendererCB extends AttrColumnRendererCB {
|
|
|
4562
4580
|
this.fireColumnChanged();
|
|
4563
4581
|
}
|
|
4564
4582
|
changeColumnTypeHandler(ev) {
|
|
4583
|
+
// Only allow type change in All mode
|
|
4584
|
+
if (this.bar.options.editMode !== ColumnsEditMode.Full)
|
|
4585
|
+
return;
|
|
4565
4586
|
this.changeTypeToSimple();
|
|
4566
4587
|
}
|
|
4567
4588
|
}
|
|
4568
4589
|
|
|
4590
|
+
/**
|
|
4591
|
+
* Base class for editable column renderers for the ColumnsBar widgets.
|
|
4592
|
+
* It provides common functionality for rendering editable columns,
|
|
4593
|
+
* including handling column type changes and rendering buttons.
|
|
4594
|
+
*/
|
|
4569
4595
|
class EditableColumnRendererCB extends ColumnRendererCB {
|
|
4570
4596
|
getClassesToAdd() {
|
|
4571
4597
|
return `${this.cssPrefix}-row ${this.cssPrefix}-row-column-entattr` + super.getClassesToAdd();
|
|
@@ -4592,6 +4618,9 @@ class EditableColumnRendererCB extends ColumnRendererCB {
|
|
|
4592
4618
|
return true;
|
|
4593
4619
|
}
|
|
4594
4620
|
changeColumnTypeHandler(ev) {
|
|
4621
|
+
// Only allow type change in All mode
|
|
4622
|
+
if (this.bar.options.editMode !== ColumnsEditMode.Full)
|
|
4623
|
+
return;
|
|
4595
4624
|
this.changeTypeToSimple();
|
|
4596
4625
|
}
|
|
4597
4626
|
}
|
|
@@ -4659,7 +4688,8 @@ class ColumnsBar extends Widget {
|
|
|
4659
4688
|
sortEntities: false,
|
|
4660
4689
|
columnRenderedCallback: null,
|
|
4661
4690
|
customExpressionText: 0,
|
|
4662
|
-
showAddAllForEntity: false
|
|
4691
|
+
showAddAllForEntity: false,
|
|
4692
|
+
editMode: ColumnsEditMode.Full
|
|
4663
4693
|
};
|
|
4664
4694
|
this.landingSlot = domel('div')
|
|
4665
4695
|
.addClass(`${eqCssPrefix}-highlight`)
|
|
@@ -4686,6 +4716,10 @@ class ColumnsBar extends Widget {
|
|
|
4686
4716
|
getWidgetType() {
|
|
4687
4717
|
return 'columnsBar';
|
|
4688
4718
|
}
|
|
4719
|
+
isDraggable() {
|
|
4720
|
+
// Only allow drag-drop in All and FixedList modes
|
|
4721
|
+
return this.options.allowDragDrop && this.options.editMode > ColumnsEditMode.ReadOnly;
|
|
4722
|
+
}
|
|
4689
4723
|
init(context, options) {
|
|
4690
4724
|
super.init(context, options);
|
|
4691
4725
|
this.setOptions(options);
|
|
@@ -4698,7 +4732,8 @@ class ColumnsBar extends Widget {
|
|
|
4698
4732
|
this.detachQueryObserver();
|
|
4699
4733
|
this.attachQueryObserver();
|
|
4700
4734
|
eqDragManager.removeDropContainer(this.slot);
|
|
4701
|
-
|
|
4735
|
+
// Only allow drag-drop in All and FixedList modes
|
|
4736
|
+
if (this.isDraggable()) {
|
|
4702
4737
|
eqDragManager.registerDropContainer({
|
|
4703
4738
|
element: this.slot,
|
|
4704
4739
|
scopes: ["entityAttrSort"],
|
|
@@ -4824,7 +4859,9 @@ class ColumnsBar extends Widget {
|
|
|
4824
4859
|
}
|
|
4825
4860
|
setOptions(options) {
|
|
4826
4861
|
this.options = utils.assignDeep(this.options, options);
|
|
4827
|
-
|
|
4862
|
+
if (typeof options.allowCustomExpressions !== 'undefined') {
|
|
4863
|
+
this.context.options.allowCustomExpressions = options.allowCustomExpressions;
|
|
4864
|
+
}
|
|
4828
4865
|
}
|
|
4829
4866
|
showLandingSlot(pageX, pageY) {
|
|
4830
4867
|
const elements = this.columnsBlock.querySelectorAll(`[class*=${this.cssPrefix}-row]`);
|
|
@@ -4935,7 +4972,8 @@ class ColumnsBar extends Widget {
|
|
|
4935
4972
|
.addClass(`${this.cssPrefix}-columns`)
|
|
4936
4973
|
.addClass(getMobileCssClass())
|
|
4937
4974
|
.toDOM();
|
|
4938
|
-
|
|
4975
|
+
// Only show add row in All mode
|
|
4976
|
+
if (this.options.showAddRow && this.options.editMode === ColumnsEditMode.Full) {
|
|
4939
4977
|
this.addRowButton =
|
|
4940
4978
|
domel('div')
|
|
4941
4979
|
.toDOM();
|
|
@@ -4998,16 +5036,18 @@ class ColumnsBar extends Widget {
|
|
|
4998
5036
|
return false;
|
|
4999
5037
|
})
|
|
5000
5038
|
.toDOM();
|
|
5001
|
-
this.
|
|
5002
|
-
|
|
5003
|
-
|
|
5004
|
-
|
|
5005
|
-
|
|
5006
|
-
|
|
5007
|
-
|
|
5008
|
-
|
|
5009
|
-
|
|
5010
|
-
|
|
5039
|
+
if (this.options.editMode == ColumnsEditMode.Full) {
|
|
5040
|
+
this.buttonsBlockDeleteButton = domel('div', this.columnButtonsBlockMobile)
|
|
5041
|
+
.addClass(`${this.cssPrefix}-column-button`, `${this.cssPrefix}-column-button-delete`)
|
|
5042
|
+
.on('touchstart click', (ev) => {
|
|
5043
|
+
ev.stopPropagation();
|
|
5044
|
+
this.currentColumnRenderer.buttonDeleteClickHandler.call(this.currentColumnRenderer, ev);
|
|
5045
|
+
this.toggleColumnPicked(null);
|
|
5046
|
+
this.hideColumnButtonsMobile();
|
|
5047
|
+
return false;
|
|
5048
|
+
})
|
|
5049
|
+
.toDOM();
|
|
5050
|
+
}
|
|
5011
5051
|
domel('div', this.columnButtonsBlockMobile)
|
|
5012
5052
|
.addClass(`${this.cssPrefix}-column-button-close-block`)
|
|
5013
5053
|
.on('touchstart click', () => {
|
|
@@ -5036,7 +5076,7 @@ class ColumnsBar extends Widget {
|
|
|
5036
5076
|
.setStyle('top', (top + rect.height).toString() + 'px');
|
|
5037
5077
|
}
|
|
5038
5078
|
//show/hide separate buttons
|
|
5039
|
-
if (column.enabled && !column.isReadOnly()) {
|
|
5079
|
+
if (column.enabled && !column.isReadOnly() && this.options.editMode > ColumnsEditMode.ReadOnly) {
|
|
5040
5080
|
domel(this.buttonsBlockSortingButton).show();
|
|
5041
5081
|
domel(this.buttonsBlockTypeButton).show();
|
|
5042
5082
|
if (columnRenderer.formatButtonIsShown()) {
|
|
@@ -5051,7 +5091,7 @@ class ColumnsBar extends Widget {
|
|
|
5051
5091
|
domel(this.buttonsBlockTypeButton).hide();
|
|
5052
5092
|
}
|
|
5053
5093
|
//show
|
|
5054
|
-
if (column.isReadOnly()) {
|
|
5094
|
+
if (column.isReadOnly() || this.options.editMode == ColumnsEditMode.ReadOnly) {
|
|
5055
5095
|
domel(this.columnButtonsBlockMobile).hide();
|
|
5056
5096
|
}
|
|
5057
5097
|
else {
|
|
@@ -14459,4 +14499,4 @@ if (!Array.prototype.findIndex) {
|
|
|
14459
14499
|
};
|
|
14460
14500
|
}
|
|
14461
14501
|
|
|
14462
|
-
export { AddRowRenderer, AdvancedSearchView, AggrFuncColumnRendererCB, AggrFuncColumnRendererCP, AggrSettingsDialog, AggrSettingsRenderer, AggregationBar, AttrColumnRendererCB, AttrColumnRendererCP, AttributeExpressionRenderer, BaseElementRenderer, ChartFacet, ChartJsWidget, ChartType, ChartWidget, ColumnAction, ColumnRendererCB, ColumnRendererCP, ColumnsBar, ColumnsPanel, ConditionAction, ConditionGroupRenderer, ConditionGroupRowRenderer, ConditionRenderer, ConstColumnRendererCP, CustomListExpressionRenderer, CustomSqlColumnRendererCP, DataFilterView, DataTableFacet, DateTimeExpressionRenderer, DomDropDownElementBuilder, DropDownRenderer, EasyGridWidget, EntitiesPanel, EqHtmlGrid, ExportDialog, ExportWidget, ExpressionRenderer, FacetContainer, FacetType, FilterBar, GoogleChartWidget, Grid, HtmlContentWidget, HtmlDataFilterView, InputExpressionRenderer, ListExpressionRenderer, ManageDrillDownWidget, OperatorRenderer, PivotTableFacet, PopupMenu, ProcessWidget, QPEditablePart, QueryPanel, ReportView, ResultFacet, ResultFacetsPanel, SimpleConditionRenderer, SortingBar, SqlListExpressionRenderer, StatementPanel, SubQueryExpressionRenderer, TextRenderer, View, dropdown };
|
|
14502
|
+
export { AddRowRenderer, AdvancedSearchView, AggrFuncColumnRendererCB, AggrFuncColumnRendererCP, AggrSettingsDialog, AggrSettingsRenderer, AggregationBar, AttrColumnRendererCB, AttrColumnRendererCP, AttributeExpressionRenderer, BaseElementRenderer, ChartFacet, ChartJsWidget, ChartType, ChartWidget, ColumnAction, ColumnRendererCB, ColumnRendererCP, ColumnsBar, ColumnsEditMode, ColumnsPanel, ConditionAction, ConditionGroupRenderer, ConditionGroupRowRenderer, ConditionRenderer, ConstColumnRendererCP, CustomListExpressionRenderer, CustomSqlColumnRendererCP, DataFilterView, DataTableFacet, DateTimeExpressionRenderer, DomDropDownElementBuilder, DropDownRenderer, EasyGridWidget, EntitiesPanel, EqHtmlGrid, ExportDialog, ExportWidget, ExpressionRenderer, FacetContainer, FacetType, FilterBar, GoogleChartWidget, Grid, HtmlContentWidget, HtmlDataFilterView, InputExpressionRenderer, ListExpressionRenderer, ManageDrillDownWidget, OperatorRenderer, PivotTableFacet, PopupMenu, ProcessWidget, QPEditablePart, QueryPanel, ReportView, ResultFacet, ResultFacetsPanel, SimpleConditionRenderer, SortingBar, SqlListExpressionRenderer, StatementPanel, SubQueryExpressionRenderer, TextRenderer, View, dropdown };
|
|
@@ -20,6 +20,7 @@ export declare class ColumnsBar extends Widget {
|
|
|
20
20
|
private customQuery?;
|
|
21
21
|
constructor(slot: HTMLElement, customQuery?: Query);
|
|
22
22
|
getWidgetType(): string;
|
|
23
|
+
isDraggable(): boolean;
|
|
23
24
|
init(context: EqContext, options?: ColumnsBarOptions): void;
|
|
24
25
|
private attachQueryObserver;
|
|
25
26
|
getQuery(): Query;
|
|
@@ -1,4 +1,9 @@
|
|
|
1
1
|
import { ColumnRendererCB } from './column_renderer_cb';
|
|
2
|
+
/**
|
|
3
|
+
* Base class for editable column renderers for the ColumnsBar widgets.
|
|
4
|
+
* It provides common functionality for rendering editable columns,
|
|
5
|
+
* including handling column type changes and rendering buttons.
|
|
6
|
+
*/
|
|
2
7
|
export declare class EditableColumnRendererCB extends ColumnRendererCB {
|
|
3
8
|
protected getClassesToAdd(): string;
|
|
4
9
|
protected renderColumnTypeButton(): HTMLDivElement;
|
|
@@ -15,6 +15,11 @@ export interface UseInOptions {
|
|
|
15
15
|
useInResult: boolean;
|
|
16
16
|
useInSorting: boolean;
|
|
17
17
|
}
|
|
18
|
+
export declare enum ColumnsEditMode {
|
|
19
|
+
ReadOnly = 0,
|
|
20
|
+
FixedList = 16,
|
|
21
|
+
Full = 255
|
|
22
|
+
}
|
|
18
23
|
/** EntitiesPanel options */
|
|
19
24
|
export interface EntitiesPanelOptions {
|
|
20
25
|
showToolbar?: boolean;
|
|
@@ -168,6 +173,8 @@ export interface ColumnsPanelOptions {
|
|
|
168
173
|
showAddAllForEntity?: boolean;
|
|
169
174
|
/** Gets or sets a value indicating whether a progress indicator should appear while the model is loading */
|
|
170
175
|
showIndicatorOnLoad?: boolean;
|
|
176
|
+
/** Gets or sets the edit mode option: All, FixedList or ReadOnly */
|
|
177
|
+
editMode?: ColumnsEditMode;
|
|
171
178
|
[name: string]: any;
|
|
172
179
|
}
|
|
173
180
|
/** Columns bar options */
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@easyquery/ui",
|
|
3
|
-
"version": "7.4.0-
|
|
3
|
+
"version": "7.4.0-rc03",
|
|
4
4
|
"description": "EasyQuery.JS Community UI widgets",
|
|
5
5
|
"types": "./dist/types/public_api.d.ts",
|
|
6
6
|
"main": "./dist/easyquery.ui.cjs.js",
|
|
@@ -30,7 +30,7 @@
|
|
|
30
30
|
"bugs": "https://korzh.com/support",
|
|
31
31
|
"license": "LGPL-3.0",
|
|
32
32
|
"peerDependencies": {
|
|
33
|
-
"@easyquery/core": "^7.4.0-
|
|
33
|
+
"@easyquery/core": "^7.4.0-rc03"
|
|
34
34
|
},
|
|
35
35
|
"files": [
|
|
36
36
|
"dist",
|