@sankhyalabs/sankhyablocks 2.1.3 → 2.1.4
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/cjs/AuthorizationConfig-79ffae4b.js +7 -0
- package/dist/cjs/{form-config-fetcher-2de7c16a.js → ConfigStorage-c112de1d.js} +101 -1
- package/dist/cjs/{SnkMessageBuilder-89482d28.js → SnkMessageBuilder-61f00e7f.js} +33 -5
- package/dist/cjs/{constants-9056ca9e.js → constants-a47a5190.js} +15 -0
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/sankhyablocks.cjs.js +1 -1
- package/dist/cjs/snk-application.cjs.entry.js +30 -64
- package/dist/cjs/snk-config-options.cjs.entry.js +1 -1
- package/dist/cjs/{snk-field-config_2.cjs.entry.js → snk-configurator_3.cjs.entry.js} +134 -13
- package/dist/cjs/snk-crud.cjs.entry.js +23 -6
- package/dist/cjs/snk-data-unit.cjs.entry.js +1 -1
- package/dist/cjs/{snk-configurator_6.cjs.entry.js → snk-filter-bar_7.cjs.entry.js} +498 -188
- package/dist/cjs/snk-form-config.cjs.entry.js +30 -24
- package/dist/cjs/snk-form.cjs.entry.js +30 -17
- package/dist/cjs/snk-tab-config.cjs.entry.js +1 -1
- package/dist/cjs/{taskbar-elements-d762e436.js → taskbar-elements-a0b857c0.js} +4 -8
- package/dist/collection/collection-manifest.json +3 -2
- package/dist/collection/components/snk-application/snk-application.js +3 -2
- package/dist/collection/components/snk-configurator/AuthorizationConfig.js +5 -0
- package/dist/collection/components/snk-configurator/snk-configurator.css +124 -0
- package/dist/collection/components/snk-configurator/snk-configurator.js +126 -181
- package/dist/collection/components/snk-crud/snk-crud.js +23 -5
- package/dist/collection/components/snk-form/snk-form.js +37 -54
- package/dist/collection/components/snk-form/subcomponents/snk-form-config/snk-form-config.js +47 -28
- package/dist/collection/components/snk-grid/snk-grid.js +69 -20
- package/dist/collection/components/snk-grid/subcomponents/snk-grid-config/snk-grid-config.css +166 -0
- package/dist/collection/components/snk-grid/subcomponents/snk-grid-config/snk-grid-config.js +605 -0
- package/dist/collection/components/snk-grid/subcomponents/snk-select-box/snk-select-box.css +9 -0
- package/dist/collection/components/snk-grid/subcomponents/snk-select-box/snk-select-box.js +70 -0
- package/dist/collection/components/snk-taskbar/elements/taskbar-elements.js +4 -8
- package/dist/collection/components/snk-taskbar/snk-taskbar.js +9 -1
- package/dist/collection/lib/configs/ConfigStorage.js +15 -15
- package/dist/collection/lib/message/SnkMessageBuilder.js +5 -3
- package/dist/collection/lib/message/resources/snk-configurator.msg.js +0 -3
- package/dist/collection/lib/message/resources/snk-form.msg.js +3 -0
- package/dist/collection/lib/message/resources/snk-grid.msg.js +26 -0
- package/dist/collection/lib/utils/constants.js +14 -0
- package/dist/components/AuthorizationConfig.js +7 -0
- package/dist/components/{form-config-fetcher.js → ConfigStorage.js} +100 -2
- package/dist/components/SnkMessageBuilder.js +33 -5
- package/dist/components/constants.js +15 -1
- package/dist/components/index.d.ts +2 -1
- package/dist/components/index.js +2 -1
- package/dist/components/snk-application2.js +2 -36
- package/dist/components/snk-configurator2.js +63 -165
- package/dist/components/snk-crud.js +53 -29
- package/dist/components/snk-form-config2.js +25 -19
- package/dist/components/snk-form2.js +33 -32
- package/dist/components/{snk-config-modal.d.ts → snk-grid-config.d.ts} +4 -4
- package/dist/components/snk-grid-config.js +6 -0
- package/dist/components/snk-grid-config2.js +497 -0
- package/dist/components/snk-grid2.js +65 -27
- package/dist/components/snk-select-box.d.ts +11 -0
- package/dist/components/snk-select-box.js +6 -0
- package/dist/components/snk-select-box2.js +38 -0
- package/dist/components/snk-taskbar2.js +14 -22
- package/dist/esm/AuthorizationConfig-dcbd207a.js +7 -0
- package/dist/esm/{form-config-fetcher-96c6c2dc.js → ConfigStorage-99025655.js} +100 -2
- package/dist/esm/{SnkMessageBuilder-a27fc561.js → SnkMessageBuilder-f5ef87df.js} +33 -5
- package/dist/esm/{constants-c6039d3d.js → constants-babe1a08.js} +15 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/sankhyablocks.js +1 -1
- package/dist/esm/snk-application.entry.js +3 -37
- package/dist/esm/snk-config-options.entry.js +1 -1
- package/dist/esm/{snk-field-config_2.entry.js → snk-configurator_3.entry.js} +134 -14
- package/dist/esm/snk-crud.entry.js +23 -6
- package/dist/esm/snk-data-unit.entry.js +1 -1
- package/dist/esm/{snk-configurator_6.entry.js → snk-filter-bar_7.entry.js} +499 -190
- package/dist/esm/snk-form-config.entry.js +25 -19
- package/dist/esm/snk-form.entry.js +30 -17
- package/dist/esm/snk-tab-config.entry.js +1 -1
- package/dist/esm/{taskbar-elements-1092b0b7.js → taskbar-elements-4d6584cd.js} +4 -8
- package/dist/sankhyablocks/p-105cd4a8.entry.js +1 -0
- package/dist/sankhyablocks/p-4131d41e.entry.js +1 -0
- package/dist/sankhyablocks/{p-8706fe65.entry.js → p-43aff8f5.entry.js} +1 -1
- package/dist/sankhyablocks/p-53f33e9d.entry.js +1 -0
- package/dist/sankhyablocks/p-639b8f6e.entry.js +76 -0
- package/dist/sankhyablocks/{p-a5b26df2.js → p-6673c77c.js} +1 -1
- package/dist/sankhyablocks/p-6ba8f415.js +26 -0
- package/dist/sankhyablocks/{p-2517529d.js → p-877bd6cf.js} +1 -1
- package/dist/sankhyablocks/p-87896198.entry.js +1 -0
- package/dist/sankhyablocks/p-bd6d4a83.js +1 -0
- package/dist/sankhyablocks/p-cae38f51.entry.js +1 -0
- package/dist/sankhyablocks/{p-f37cdeb5.entry.js → p-cd03ea9e.entry.js} +1 -1
- package/dist/sankhyablocks/p-dc36cfbf.js +1 -0
- package/dist/sankhyablocks/{p-92782503.entry.js → p-eb94df0b.entry.js} +1 -1
- package/dist/sankhyablocks/sankhyablocks.esm.js +1 -1
- package/dist/types/components/snk-application/snk-application.d.ts +0 -1
- package/dist/types/components/snk-configurator/AuthorizationConfig.d.ts +4 -0
- package/dist/types/components/snk-configurator/snk-configurator.d.ts +21 -24
- package/dist/types/components/snk-crud/snk-crud.d.ts +6 -0
- package/dist/types/components/snk-form/snk-form.d.ts +6 -9
- package/dist/types/components/snk-form/subcomponents/snk-form-config/snk-form-config.d.ts +7 -3
- package/dist/types/components/snk-grid/snk-grid.d.ts +13 -3
- package/dist/types/components/snk-grid/subcomponents/snk-grid-config/snk-grid-config.d.ts +66 -0
- package/dist/types/components/snk-grid/subcomponents/snk-select-box/snk-select-box.d.ts +7 -0
- package/dist/types/components/snk-taskbar/elements/taskbar-elements.d.ts +3 -4
- package/dist/types/components.d.ts +104 -74
- package/dist/types/lib/configs/ConfigStorage.d.ts +3 -3
- package/dist/types/lib/message/resources/snk-configurator.msg.d.ts +0 -1
- package/dist/types/lib/message/resources/snk-grid.msg.d.ts +2 -0
- package/dist/types/lib/utils/constants.d.ts +14 -0
- package/package.json +1 -1
- package/react/components.d.ts +2 -1
- package/react/components.js +2 -1
- package/react/components.js.map +1 -1
- package/dist/cjs/configurableElementsStorage-93459c72.js +0 -20
- package/dist/cjs/snk-config-modal.cjs.entry.js +0 -62
- package/dist/collection/components/snk-configurator/subcomponents/configModalProvider/configurableElementsStorage.js +0 -16
- package/dist/collection/components/snk-configurator/subcomponents/snk-config-modal/snk-config-modal.css +0 -122
- package/dist/collection/components/snk-configurator/subcomponents/snk-config-modal/snk-config-modal.js +0 -137
- package/dist/components/snk-config-modal.js +0 -6
- package/dist/components/snk-config-modal2.js +0 -91
- package/dist/esm/configurableElementsStorage-cdc144b5.js +0 -18
- package/dist/esm/snk-config-modal.entry.js +0 -58
- package/dist/sankhyablocks/p-361299e8.js +0 -26
- package/dist/sankhyablocks/p-429c5e3f.entry.js +0 -1
- package/dist/sankhyablocks/p-4fab64ec.js +0 -1
- package/dist/sankhyablocks/p-60eef7cd.entry.js +0 -1
- package/dist/sankhyablocks/p-626cf022.entry.js +0 -1
- package/dist/sankhyablocks/p-6511d132.entry.js +0 -1
- package/dist/sankhyablocks/p-8c14bbfb.entry.js +0 -76
- package/dist/sankhyablocks/p-c4ae984b.entry.js +0 -1
- package/dist/sankhyablocks/p-ce7c38a1.entry.js +0 -1
- package/dist/sankhyablocks/p-d50651a3.js +0 -1
- package/dist/types/components/snk-configurator/subcomponents/configModalProvider/configurableElementsStorage.d.ts +0 -8
- package/dist/types/components/snk-configurator/subcomponents/snk-config-modal/snk-config-modal.d.ts +0 -38
|
@@ -0,0 +1,605 @@
|
|
|
1
|
+
import { ApplicationContext, StringUtils } from '@sankhyalabs/core';
|
|
2
|
+
import { ApplicationUtils, DialogType } from '@sankhyalabs/ezui/dist/collection/utils';
|
|
3
|
+
import { h, Host } from '@stencil/core';
|
|
4
|
+
import { ConfigStorage } from '../../../../lib/configs/ConfigStorage';
|
|
5
|
+
import { ORDER_VALUES } from '../../../../lib/utils/constants';
|
|
6
|
+
export class EzGridConfig {
|
|
7
|
+
constructor() {
|
|
8
|
+
this._orderListItems = [];
|
|
9
|
+
this._orderPriorityList = [];
|
|
10
|
+
this._columListItems = [];
|
|
11
|
+
this._selectedIndex = -1;
|
|
12
|
+
this._dataChanged = false;
|
|
13
|
+
this._componenteInternalKey = Date.now();
|
|
14
|
+
/**
|
|
15
|
+
* Aba selecionada das configurações da grade.
|
|
16
|
+
*/
|
|
17
|
+
this.selectedIndex = 0;
|
|
18
|
+
}
|
|
19
|
+
/* Creation Methods */
|
|
20
|
+
async saveConfig(config) {
|
|
21
|
+
var _a;
|
|
22
|
+
if (config == undefined || ((_a = this._application) === null || _a === void 0 ? void 0 : _a.configName) == undefined) {
|
|
23
|
+
return;
|
|
24
|
+
}
|
|
25
|
+
ConfigStorage.saveGridConfig(config, this._application.configName)
|
|
26
|
+
.then((response) => {
|
|
27
|
+
if ((response === null || response === void 0 ? void 0 : response.resource) != undefined) {
|
|
28
|
+
ApplicationUtils.info(this.getMessage("snkGridConfig.info.successfullyConfigSaved"), { iconName: "check" });
|
|
29
|
+
this.configChange.emit(config);
|
|
30
|
+
this._orderList.clearHistory();
|
|
31
|
+
}
|
|
32
|
+
});
|
|
33
|
+
}
|
|
34
|
+
/**
|
|
35
|
+
* Conforme mecanismo de mensagens, é possível customizar as mensagens dos blocos de construção
|
|
36
|
+
* através de um pequeno modulo na estrutura da aplicação:
|
|
37
|
+
* - Criar um arquivo no seguinte caminho: /messages/appmessages.msg.js.
|
|
38
|
+
* Para conhecer os detalhes do módulo, vide o arquivo neste projeto "/src/lib/message/resources/snk-grid.msg.ts"
|
|
39
|
+
*/
|
|
40
|
+
getMessage(key, params) {
|
|
41
|
+
return this._application.messagesBuilder.getMessage(key, params);
|
|
42
|
+
}
|
|
43
|
+
createOrderList() {
|
|
44
|
+
let newList = [];
|
|
45
|
+
this.columns.filter(col => { var _a; return StringUtils.getBooleanValue((_a = col === null || col === void 0 ? void 0 : col.props) === null || _a === void 0 ? void 0 : _a.get("sortable"), true); }).forEach((column) => {
|
|
46
|
+
var _a;
|
|
47
|
+
let configItem = (_a = this.config) === null || _a === void 0 ? void 0 : _a.columns.find((item) => item.name === column.name);
|
|
48
|
+
let item = { name: column.name, label: column.label };
|
|
49
|
+
if (configItem) {
|
|
50
|
+
item['orderIndex'] = configItem.orderIndex;
|
|
51
|
+
item['ascending'] = configItem.ascending;
|
|
52
|
+
}
|
|
53
|
+
if (!column.hidden) {
|
|
54
|
+
newList.push(item);
|
|
55
|
+
}
|
|
56
|
+
});
|
|
57
|
+
newList.sort((a, b) => {
|
|
58
|
+
//OS dois tem order index 0 e pelo menos um deles tem orientação de ordenação.
|
|
59
|
+
if (a.orderIndex == 0 && b.orderIndex == 0 && (a.ascending != undefined || b.ascending != undefined)) {
|
|
60
|
+
if (a.ascending != undefined)
|
|
61
|
+
return -1;
|
|
62
|
+
if (b.ascending != undefined)
|
|
63
|
+
return 1;
|
|
64
|
+
return 0;
|
|
65
|
+
//Pelo menos um deles tem order index diferente de 0 e os dois tem orientação de ordenação.
|
|
66
|
+
}
|
|
67
|
+
else if (a.ascending != undefined && b.ascending != undefined) {
|
|
68
|
+
return (a.orderIndex - b.orderIndex);
|
|
69
|
+
//Pelo menos um deles tem order index diferente de 0 e pelo menos um deles tem orientação de ordenação.
|
|
70
|
+
}
|
|
71
|
+
else if (a.ascending != undefined || b.ascending != undefined) {
|
|
72
|
+
if (a.ascending != undefined)
|
|
73
|
+
return -1;
|
|
74
|
+
if (b.ascending != undefined)
|
|
75
|
+
return 1;
|
|
76
|
+
return 0;
|
|
77
|
+
}
|
|
78
|
+
return (a.orderIndex - b.orderIndex);
|
|
79
|
+
});
|
|
80
|
+
this._orderListItems = newList;
|
|
81
|
+
}
|
|
82
|
+
createColumnList() {
|
|
83
|
+
let visibleGroup = {
|
|
84
|
+
group: this.getMessage("snkGridConfig.group.visible"),
|
|
85
|
+
items: [],
|
|
86
|
+
};
|
|
87
|
+
let hiddenGroup = {
|
|
88
|
+
group: this.getMessage("snkGridConfig.group.hidden"),
|
|
89
|
+
items: [],
|
|
90
|
+
sort: ORDER_VALUES.asc.value
|
|
91
|
+
};
|
|
92
|
+
this.columns.forEach((column) => {
|
|
93
|
+
let item = { label: column.label };
|
|
94
|
+
if (column.hidden) {
|
|
95
|
+
hiddenGroup.items.push(item);
|
|
96
|
+
}
|
|
97
|
+
else {
|
|
98
|
+
visibleGroup.items.push(item);
|
|
99
|
+
}
|
|
100
|
+
});
|
|
101
|
+
this._columListItems = [visibleGroup, hiddenGroup];
|
|
102
|
+
}
|
|
103
|
+
buildColumnListSlot(item, group) {
|
|
104
|
+
return (h("div", null, h("ez-check", { mode: 'switch', id: 'switch' + ((item === null || item === void 0 ? void 0 : item.label) || '') + ((group === null || group === void 0 ? void 0 : group.group) || ''), value: group.group === this.getMessage("snkGridConfig.group.visible"), onEzChange: (evt) => { this.switchColumnGroup(evt, item); } })));
|
|
105
|
+
}
|
|
106
|
+
buildOrderListSlot(item) {
|
|
107
|
+
let selectedOption = ORDER_VALUES.none.value;
|
|
108
|
+
if ((item === null || item === void 0 ? void 0 : item.ascending) != undefined) {
|
|
109
|
+
selectedOption = item.ascending == true ? ORDER_VALUES.asc.value : ORDER_VALUES.desc.value;
|
|
110
|
+
}
|
|
111
|
+
return (h("div", null, h("snk-select-box", { selectedOption: selectedOption, key: 'snk-select-box-' + this._componenteInternalKey + '-' + item, onEzChange: (evt) => { evt.stopPropagation(); this.updateOrder(evt.detail, item.label); } })));
|
|
112
|
+
}
|
|
113
|
+
updateOrder(sortOrder, updatedItemLabel) {
|
|
114
|
+
var _a;
|
|
115
|
+
this._dataChanged = true;
|
|
116
|
+
let newList = [...this.columns];
|
|
117
|
+
let newItem = newList.find((item) => item.label === updatedItemLabel);
|
|
118
|
+
if (newItem) {
|
|
119
|
+
newItem.sort = sortOrder.value === ORDER_VALUES.none.value ? undefined : sortOrder.value;
|
|
120
|
+
}
|
|
121
|
+
let orderArray;
|
|
122
|
+
if (((_a = this._orderPriorityList) === null || _a === void 0 ? void 0 : _a.length) > 0) {
|
|
123
|
+
this._orderPriorityList.find((item) => item.label === newItem.label).sort = sortOrder;
|
|
124
|
+
this._orderPriorityList.filter((item) => item.sort).map((item, index) => {
|
|
125
|
+
if (item.label === newItem.label) {
|
|
126
|
+
newItem.sortIndex = index;
|
|
127
|
+
}
|
|
128
|
+
});
|
|
129
|
+
}
|
|
130
|
+
else {
|
|
131
|
+
orderArray = newList.filter((item) => item.sort && item.hidden !== true)
|
|
132
|
+
.map((item, index) => {
|
|
133
|
+
return { label: item.label, orderIndex: index };
|
|
134
|
+
});
|
|
135
|
+
orderArray.forEach((element) => {
|
|
136
|
+
newList.find((item) => item.label === element.label).sortIndex = element.orderIndex;
|
|
137
|
+
});
|
|
138
|
+
}
|
|
139
|
+
this.columns = newList;
|
|
140
|
+
}
|
|
141
|
+
/* Actions Methods */
|
|
142
|
+
switchColumnGroup(evt, switchedItem) {
|
|
143
|
+
evt.stopPropagation();
|
|
144
|
+
let newList = [...this._columListItems];
|
|
145
|
+
this._dataChanged = true;
|
|
146
|
+
if (evt.detail === true) {
|
|
147
|
+
let hiddenGroup = newList.find((group) => group.group === this.getMessage("snkGridConfig.group.hidden"));
|
|
148
|
+
let index = hiddenGroup.items.findIndex((item) => item.label === switchedItem.label);
|
|
149
|
+
if (index >= 0) {
|
|
150
|
+
hiddenGroup.items.splice(index, 1);
|
|
151
|
+
}
|
|
152
|
+
let visibleGroup = newList.find((group) => group.group === this.getMessage("snkGridConfig.group.visible"));
|
|
153
|
+
visibleGroup.items.push(switchedItem);
|
|
154
|
+
this._columListItems = newList;
|
|
155
|
+
this.createOrderList();
|
|
156
|
+
}
|
|
157
|
+
else if (evt.detail === false) {
|
|
158
|
+
let visibleGroup = newList.find((group) => group.group === this.getMessage("snkGridConfig.group.visible"));
|
|
159
|
+
let index = visibleGroup.items.findIndex((item) => item.label === switchedItem.label);
|
|
160
|
+
if (index >= 0) {
|
|
161
|
+
visibleGroup.items.splice(index, 1);
|
|
162
|
+
}
|
|
163
|
+
let hiddenGroup = newList.find((group) => group.group === this.getMessage("snkGridConfig.group.hidden"));
|
|
164
|
+
hiddenGroup.items.push(switchedItem);
|
|
165
|
+
this._columListItems = newList;
|
|
166
|
+
this.createOrderList();
|
|
167
|
+
}
|
|
168
|
+
}
|
|
169
|
+
finish() {
|
|
170
|
+
if (!this._dataChanged) {
|
|
171
|
+
this.closeConfig();
|
|
172
|
+
return;
|
|
173
|
+
}
|
|
174
|
+
let newColumnList = [];
|
|
175
|
+
this._columListItems.forEach((group) => {
|
|
176
|
+
group.items.forEach((item) => {
|
|
177
|
+
const baseColumn = this.columns.find((column) => column.label === item.label);
|
|
178
|
+
let newColumnItem = Object.assign({}, baseColumn);
|
|
179
|
+
if (group.group === this.getMessage("snkGridConfig.group.hidden")) {
|
|
180
|
+
newColumnItem.hidden = true;
|
|
181
|
+
}
|
|
182
|
+
else {
|
|
183
|
+
newColumnItem.hidden = false;
|
|
184
|
+
}
|
|
185
|
+
newColumnList.push(newColumnItem);
|
|
186
|
+
});
|
|
187
|
+
});
|
|
188
|
+
this.columns = newColumnList;
|
|
189
|
+
this._dataChanged = false;
|
|
190
|
+
this.closeConfig();
|
|
191
|
+
this.save();
|
|
192
|
+
}
|
|
193
|
+
save() {
|
|
194
|
+
var _a;
|
|
195
|
+
let _newConfig;
|
|
196
|
+
if (this.config) {
|
|
197
|
+
_newConfig = this.config;
|
|
198
|
+
}
|
|
199
|
+
else {
|
|
200
|
+
_newConfig = this.createConfigFromState(this.columns);
|
|
201
|
+
}
|
|
202
|
+
let _newColumnConfigList = [];
|
|
203
|
+
let orderArray;
|
|
204
|
+
if (((_a = this._orderPriorityList) === null || _a === void 0 ? void 0 : _a.length) > 0) {
|
|
205
|
+
orderArray = this.columns.filter((item) => item.sort && item.hidden !== true)
|
|
206
|
+
.map((item) => {
|
|
207
|
+
return { label: item.label, orderIndex: 0 };
|
|
208
|
+
});
|
|
209
|
+
let indexCount = 0;
|
|
210
|
+
let newOrderArray = [];
|
|
211
|
+
this._orderPriorityList.forEach((orderPriorityItem) => {
|
|
212
|
+
let item = orderArray.find((column) => column.label === orderPriorityItem.label);
|
|
213
|
+
if (item) {
|
|
214
|
+
item.orderIndex = indexCount;
|
|
215
|
+
newOrderArray.push(item);
|
|
216
|
+
indexCount++;
|
|
217
|
+
}
|
|
218
|
+
});
|
|
219
|
+
if (newOrderArray.length > 0) {
|
|
220
|
+
orderArray = newOrderArray;
|
|
221
|
+
}
|
|
222
|
+
}
|
|
223
|
+
for (let i = 0; i < this.columns.length; i++) {
|
|
224
|
+
const column = this.columns[i];
|
|
225
|
+
let _newColumnConfig = _newConfig.columns.find((_newColumnConfig) => column.name === _newColumnConfig.name);
|
|
226
|
+
if (column.hidden === true && _newColumnConfig) {
|
|
227
|
+
continue;
|
|
228
|
+
}
|
|
229
|
+
if (_newColumnConfig) {
|
|
230
|
+
_newColumnConfig.width = column.width;
|
|
231
|
+
}
|
|
232
|
+
else if (column.hidden === false) {
|
|
233
|
+
_newColumnConfig = { name: column.name, width: column.width, orderIndex: 0 };
|
|
234
|
+
}
|
|
235
|
+
if (_newColumnConfig) {
|
|
236
|
+
if (column.sort) {
|
|
237
|
+
_newColumnConfig.ascending = column.sort.toUpperCase() === ORDER_VALUES.asc.value ? true : false;
|
|
238
|
+
if (orderArray) {
|
|
239
|
+
adjustPriorityOrder(column, _newColumnConfig);
|
|
240
|
+
}
|
|
241
|
+
else {
|
|
242
|
+
_newColumnConfig.orderIndex = column.sortIndex;
|
|
243
|
+
}
|
|
244
|
+
}
|
|
245
|
+
else {
|
|
246
|
+
delete _newColumnConfig.ascending;
|
|
247
|
+
_newColumnConfig.orderIndex = 0;
|
|
248
|
+
}
|
|
249
|
+
_newColumnConfigList.push(_newColumnConfig);
|
|
250
|
+
}
|
|
251
|
+
}
|
|
252
|
+
_newConfig.columns = _newColumnConfigList;
|
|
253
|
+
this.saveConfig(_newConfig);
|
|
254
|
+
function adjustPriorityOrder(column, _newColumnConfig) {
|
|
255
|
+
if (orderArray) {
|
|
256
|
+
let orderItem = orderArray.find((item) => item.label === column.label);
|
|
257
|
+
if (orderItem) {
|
|
258
|
+
_newColumnConfig.orderIndex = orderItem.orderIndex;
|
|
259
|
+
}
|
|
260
|
+
}
|
|
261
|
+
}
|
|
262
|
+
}
|
|
263
|
+
createConfigFromState(state) {
|
|
264
|
+
let newConfig = { columns: [] };
|
|
265
|
+
state.forEach((columnState) => {
|
|
266
|
+
if (!columnState.hidden) {
|
|
267
|
+
let newConfigColumn = { name: columnState.name };
|
|
268
|
+
if (columnState.width) {
|
|
269
|
+
newConfigColumn['width'] = columnState.width;
|
|
270
|
+
}
|
|
271
|
+
if (columnState.sort) {
|
|
272
|
+
newConfigColumn['ascending'] = (columnState.sort.toUpperCase() === ORDER_VALUES.asc.value);
|
|
273
|
+
newConfigColumn['orderIndex'] = columnState.sortIndex;
|
|
274
|
+
}
|
|
275
|
+
else {
|
|
276
|
+
newConfigColumn['orderIndex'] = 0;
|
|
277
|
+
}
|
|
278
|
+
if (newConfigColumn) {
|
|
279
|
+
newConfig.columns.push(newConfigColumn);
|
|
280
|
+
}
|
|
281
|
+
}
|
|
282
|
+
});
|
|
283
|
+
return newConfig;
|
|
284
|
+
}
|
|
285
|
+
async locateColumn(evt, searchingText) {
|
|
286
|
+
var _a;
|
|
287
|
+
const hitEnter = evt.key === "Enter";
|
|
288
|
+
if (!searchingText) {
|
|
289
|
+
searchingText = (_a = evt.currentTarget) === null || _a === void 0 ? void 0 : _a.value;
|
|
290
|
+
}
|
|
291
|
+
let newSelected = -1;
|
|
292
|
+
if (this.selectedIndex === 1) {
|
|
293
|
+
if (searchingText) {
|
|
294
|
+
const matchedIndexes = [];
|
|
295
|
+
let orderListDatasource;
|
|
296
|
+
await this._orderList.getList().then((listGroup) => {
|
|
297
|
+
orderListDatasource = listGroup;
|
|
298
|
+
orderListDatasource.forEach((column, index) => {
|
|
299
|
+
if (this.compareWords(column, searchingText)) {
|
|
300
|
+
matchedIndexes.push(index);
|
|
301
|
+
}
|
|
302
|
+
});
|
|
303
|
+
});
|
|
304
|
+
if (matchedIndexes.length > 0) {
|
|
305
|
+
if (hitEnter) {
|
|
306
|
+
for (let j = 0; j < matchedIndexes.length; j++) {
|
|
307
|
+
if (matchedIndexes[j] > this._selectedIndex) {
|
|
308
|
+
newSelected = matchedIndexes[j];
|
|
309
|
+
break;
|
|
310
|
+
}
|
|
311
|
+
}
|
|
312
|
+
}
|
|
313
|
+
if (newSelected === -1) {
|
|
314
|
+
newSelected = matchedIndexes[0];
|
|
315
|
+
}
|
|
316
|
+
}
|
|
317
|
+
this._selectedIndex = newSelected;
|
|
318
|
+
let selectedColumn;
|
|
319
|
+
selectedColumn = orderListDatasource[newSelected];
|
|
320
|
+
if (selectedColumn) {
|
|
321
|
+
this._orderList.setSelection({ label: selectedColumn.label }, true);
|
|
322
|
+
}
|
|
323
|
+
else {
|
|
324
|
+
this._orderList.setSelection(undefined);
|
|
325
|
+
}
|
|
326
|
+
}
|
|
327
|
+
else {
|
|
328
|
+
this._orderList.setSelection(undefined);
|
|
329
|
+
}
|
|
330
|
+
}
|
|
331
|
+
else {
|
|
332
|
+
if (searchingText) {
|
|
333
|
+
const matchedIndexes = [];
|
|
334
|
+
this.columns.forEach((column, index) => {
|
|
335
|
+
if (this.compareWords(column, searchingText)) {
|
|
336
|
+
matchedIndexes.push(index);
|
|
337
|
+
}
|
|
338
|
+
});
|
|
339
|
+
if (matchedIndexes.length > 0) {
|
|
340
|
+
if (hitEnter) {
|
|
341
|
+
for (let j = 0; j < matchedIndexes.length; j++) {
|
|
342
|
+
if (matchedIndexes[j] > this._selectedIndex) {
|
|
343
|
+
newSelected = matchedIndexes[j];
|
|
344
|
+
break;
|
|
345
|
+
}
|
|
346
|
+
}
|
|
347
|
+
}
|
|
348
|
+
if (newSelected === -1) {
|
|
349
|
+
newSelected = matchedIndexes[0];
|
|
350
|
+
}
|
|
351
|
+
}
|
|
352
|
+
this._selectedIndex = newSelected;
|
|
353
|
+
let selectedColumn = this.columns[newSelected];
|
|
354
|
+
if (selectedColumn) {
|
|
355
|
+
this._columnList.setSelection({ label: selectedColumn.label }, true);
|
|
356
|
+
}
|
|
357
|
+
else {
|
|
358
|
+
this._columnList.setSelection(undefined);
|
|
359
|
+
}
|
|
360
|
+
}
|
|
361
|
+
else {
|
|
362
|
+
this._columnList.setSelection(undefined);
|
|
363
|
+
}
|
|
364
|
+
}
|
|
365
|
+
}
|
|
366
|
+
compareWords(column, searchingText) {
|
|
367
|
+
if (StringUtils.replaceAccentuatedChars(column.label).indexOf(StringUtils.replaceAccentuatedChars(searchingText)) > -1) {
|
|
368
|
+
return true;
|
|
369
|
+
}
|
|
370
|
+
return false;
|
|
371
|
+
}
|
|
372
|
+
getColumnNames() {
|
|
373
|
+
const listNames = [];
|
|
374
|
+
listNames.push(this.getMessage("snkGridConfig.tab.columns"));
|
|
375
|
+
listNames.push(this.getMessage("snkGridConfig.tab.lineOrdering"));
|
|
376
|
+
return listNames.join(',');
|
|
377
|
+
}
|
|
378
|
+
closeConfig() {
|
|
379
|
+
this._orderList.scrollToTop();
|
|
380
|
+
this._columnList.scrollToTop();
|
|
381
|
+
this._searchElement.value = "";
|
|
382
|
+
if (this._dataChanged) {
|
|
383
|
+
let options = {
|
|
384
|
+
canClose: false,
|
|
385
|
+
labelCancel: this.getMessage("snkGridConfig.confirm.cancel"),
|
|
386
|
+
labelConfirm: this.getMessage("snkGridConfig.confirm.save"),
|
|
387
|
+
btnConfirmDanger: false
|
|
388
|
+
};
|
|
389
|
+
ApplicationUtils.confirm(this.getMessage("snkGridConfig.confirm.alert"), this.getMessage("snkGridConfig.confirm.msgCancel"), null, DialogType.WARN, options)
|
|
390
|
+
.then((response) => {
|
|
391
|
+
if (!response) {
|
|
392
|
+
this._dataChanged = false;
|
|
393
|
+
this.configCancel.emit();
|
|
394
|
+
this._orderList.clearHistory();
|
|
395
|
+
this._componenteInternalKey = Date.now();
|
|
396
|
+
}
|
|
397
|
+
else {
|
|
398
|
+
this.finish();
|
|
399
|
+
}
|
|
400
|
+
});
|
|
401
|
+
}
|
|
402
|
+
else {
|
|
403
|
+
this.configCancel.emit();
|
|
404
|
+
this._orderList.clearHistory();
|
|
405
|
+
}
|
|
406
|
+
}
|
|
407
|
+
/* Handlers */
|
|
408
|
+
handleTabChange(tab) {
|
|
409
|
+
if ((tab === null || tab === void 0 ? void 0 : tab.index) != undefined) {
|
|
410
|
+
if (this.selectedIndex !== tab.index) {
|
|
411
|
+
if (tab.index === 0) {
|
|
412
|
+
this._orderList.scrollToTop();
|
|
413
|
+
}
|
|
414
|
+
else if (tab.index === 1) {
|
|
415
|
+
this._columnList.scrollToTop();
|
|
416
|
+
}
|
|
417
|
+
this._searchElement.value = "";
|
|
418
|
+
}
|
|
419
|
+
if (tab.index === 1) {
|
|
420
|
+
this.createOrderList();
|
|
421
|
+
}
|
|
422
|
+
this.selectedIndex = tab.index;
|
|
423
|
+
}
|
|
424
|
+
}
|
|
425
|
+
handleColumnListChange(evt) {
|
|
426
|
+
var _a;
|
|
427
|
+
if (evt.detail) {
|
|
428
|
+
let visibleItems = (_a = evt.detail.find((group) => group.group === this.getMessage("snkGridConfig.group.visible"))) === null || _a === void 0 ? void 0 : _a.items;
|
|
429
|
+
if (visibleItems) {
|
|
430
|
+
this._dataChanged = true;
|
|
431
|
+
this._orderListItems = visibleItems;
|
|
432
|
+
}
|
|
433
|
+
}
|
|
434
|
+
}
|
|
435
|
+
handleOrderListChange(evt) {
|
|
436
|
+
if (evt.detail) {
|
|
437
|
+
let orderPriorityList = evt.detail;
|
|
438
|
+
if (orderPriorityList) {
|
|
439
|
+
this._dataChanged = true;
|
|
440
|
+
this._orderPriorityList = orderPriorityList;
|
|
441
|
+
}
|
|
442
|
+
}
|
|
443
|
+
}
|
|
444
|
+
componentWillRender() {
|
|
445
|
+
var _a;
|
|
446
|
+
if (((_a = this.columns) === null || _a === void 0 ? void 0 : _a.length) > 0) {
|
|
447
|
+
this.createColumnList();
|
|
448
|
+
}
|
|
449
|
+
}
|
|
450
|
+
componentDidRender() {
|
|
451
|
+
var _a;
|
|
452
|
+
if (((_a = this.columns) === null || _a === void 0 ? void 0 : _a.length) > 0) {
|
|
453
|
+
this.locateColumn(new KeyboardEvent("arrow-right", { key: "ArrowRight" }), this._searchElement.value);
|
|
454
|
+
}
|
|
455
|
+
}
|
|
456
|
+
componentWillLoad() {
|
|
457
|
+
this._application = ApplicationContext.getContextValue("__SNK__APPLICATION__");
|
|
458
|
+
}
|
|
459
|
+
render() {
|
|
460
|
+
return (h(Host, null, h("div", { class: "grid-config__header" }, h("div", { class: "title-container" }, h("div", { class: "" }, h("label", { class: "title" }, this.getMessage("snkGridConfig.gridConfiguration")), h("label", { class: "subtitle" }, this.getMessage("snkGridConfig.columnVisibilityOrder"))), h("div", { class: "button-close" }, h("ez-button", { mode: 'icon', iconName: "close", size: 'medium', onClick: () => this.closeConfig() }))), h("div", { class: "tabselector-container" }, h("ez-tabselector", { selectedIndex: this.selectedIndex, onEzChange: (evt) => { this.handleTabChange(evt.detail); }, tabs: this.getColumnNames() })), h("div", null, h("ez-text-input", { ref: (el) => this._searchElement = el, label: this.getMessage("snkGridConfig.findColumn"), onKeyUp: (evt) => this.locateColumn(evt) }, h("ez-icon", { slot: "leftIcon", size: "medium", iconName: "search" })))), h("div", { class: "grid-config__main" }, h("ez-list", { ref: (el) => this._columnList = el, class: this.selectedIndex === 0 ? "" : "hidden", dataSource: this._columListItems, onEzChange: (evt) => this.handleColumnListChange(evt), ezDraggable: true, ezSelectable: true, itemSlotBuilder: (item, group) => this.buildColumnListSlot(item, group), useGroups: true }), h("div", { class: this.selectedIndex === 1 ? "group-name" : "hidden" }, this.getMessage("snkGridConfig.info.sortingSequence")), h("ez-list", { ref: (el) => this._orderList = el, class: this.selectedIndex === 1 ? "height-calc" : "hidden", dataSource: this._orderListItems, ezSelectable: true, onEzChange: (evt) => this.handleOrderListChange(evt), ezDraggable: true, itemSlotBuilder: (item) => this.buildOrderListSlot(item) })), h("div", { class: "grid-config__footer" }, h("ez-button", { class: "padding-right--medium", label: this.getMessage("snkGridConfig.cancel"), onClick: () => this.closeConfig() }), h("ez-button", { label: this.getMessage("snkGridConfig.complete"), class: "ez-button--primary", onClick: () => this.finish() }))));
|
|
461
|
+
}
|
|
462
|
+
static get is() { return "snk-grid-config"; }
|
|
463
|
+
static get encapsulation() { return "scoped"; }
|
|
464
|
+
static get originalStyleUrls() {
|
|
465
|
+
return {
|
|
466
|
+
"$": ["snk-grid-config.css"]
|
|
467
|
+
};
|
|
468
|
+
}
|
|
469
|
+
static get styleUrls() {
|
|
470
|
+
return {
|
|
471
|
+
"$": ["snk-grid-config.css"]
|
|
472
|
+
};
|
|
473
|
+
}
|
|
474
|
+
static get assetsDirs() { return ["../assets"]; }
|
|
475
|
+
static get properties() {
|
|
476
|
+
return {
|
|
477
|
+
"selectedIndex": {
|
|
478
|
+
"type": "number",
|
|
479
|
+
"mutable": true,
|
|
480
|
+
"complexType": {
|
|
481
|
+
"original": "number",
|
|
482
|
+
"resolved": "number",
|
|
483
|
+
"references": {}
|
|
484
|
+
},
|
|
485
|
+
"required": false,
|
|
486
|
+
"optional": false,
|
|
487
|
+
"docs": {
|
|
488
|
+
"tags": [],
|
|
489
|
+
"text": "Aba selecionada das configura\u00E7\u00F5es da grade."
|
|
490
|
+
},
|
|
491
|
+
"attribute": "selected-index",
|
|
492
|
+
"reflect": false,
|
|
493
|
+
"defaultValue": "0"
|
|
494
|
+
},
|
|
495
|
+
"columns": {
|
|
496
|
+
"type": "unknown",
|
|
497
|
+
"mutable": true,
|
|
498
|
+
"complexType": {
|
|
499
|
+
"original": "Array<EzGridColumn>",
|
|
500
|
+
"resolved": "EzGridColumn[]",
|
|
501
|
+
"references": {
|
|
502
|
+
"Array": {
|
|
503
|
+
"location": "global"
|
|
504
|
+
},
|
|
505
|
+
"EzGridColumn": {
|
|
506
|
+
"location": "import",
|
|
507
|
+
"path": "@sankhyalabs/ezui/dist/types/components/ez-grid/controller/EzGridController"
|
|
508
|
+
}
|
|
509
|
+
}
|
|
510
|
+
},
|
|
511
|
+
"required": false,
|
|
512
|
+
"optional": false,
|
|
513
|
+
"docs": {
|
|
514
|
+
"tags": [],
|
|
515
|
+
"text": "Colunas da grade."
|
|
516
|
+
}
|
|
517
|
+
},
|
|
518
|
+
"config": {
|
|
519
|
+
"type": "unknown",
|
|
520
|
+
"mutable": true,
|
|
521
|
+
"complexType": {
|
|
522
|
+
"original": "IGridConfig",
|
|
523
|
+
"resolved": "IGridConfig",
|
|
524
|
+
"references": {
|
|
525
|
+
"IGridConfig": {
|
|
526
|
+
"location": "import",
|
|
527
|
+
"path": "@sankhyalabs/ezui/dist/types/components/ez-grid/controller/EzGridController"
|
|
528
|
+
}
|
|
529
|
+
}
|
|
530
|
+
},
|
|
531
|
+
"required": false,
|
|
532
|
+
"optional": false,
|
|
533
|
+
"docs": {
|
|
534
|
+
"tags": [],
|
|
535
|
+
"text": "Configura\u00E7\u00F5es da grade."
|
|
536
|
+
}
|
|
537
|
+
}
|
|
538
|
+
};
|
|
539
|
+
}
|
|
540
|
+
static get events() {
|
|
541
|
+
return [{
|
|
542
|
+
"method": "configChange",
|
|
543
|
+
"name": "configChange",
|
|
544
|
+
"bubbles": true,
|
|
545
|
+
"cancelable": true,
|
|
546
|
+
"composed": true,
|
|
547
|
+
"docs": {
|
|
548
|
+
"tags": [],
|
|
549
|
+
"text": "Evento disparado ao salvar a altera\u00E7\u00E3o das configura\u00E7\u00F5es."
|
|
550
|
+
},
|
|
551
|
+
"complexType": {
|
|
552
|
+
"original": "IGridConfig",
|
|
553
|
+
"resolved": "IGridConfig",
|
|
554
|
+
"references": {
|
|
555
|
+
"IGridConfig": {
|
|
556
|
+
"location": "import",
|
|
557
|
+
"path": "@sankhyalabs/ezui/dist/types/components/ez-grid/controller/EzGridController"
|
|
558
|
+
}
|
|
559
|
+
}
|
|
560
|
+
}
|
|
561
|
+
}, {
|
|
562
|
+
"method": "configCancel",
|
|
563
|
+
"name": "configCancel",
|
|
564
|
+
"bubbles": true,
|
|
565
|
+
"cancelable": true,
|
|
566
|
+
"composed": true,
|
|
567
|
+
"docs": {
|
|
568
|
+
"tags": [],
|
|
569
|
+
"text": "Evento disparado ao cancelar a altera\u00E7\u00E3o das configura\u00E7\u00F5es."
|
|
570
|
+
},
|
|
571
|
+
"complexType": {
|
|
572
|
+
"original": "void",
|
|
573
|
+
"resolved": "void",
|
|
574
|
+
"references": {}
|
|
575
|
+
}
|
|
576
|
+
}];
|
|
577
|
+
}
|
|
578
|
+
static get methods() {
|
|
579
|
+
return {
|
|
580
|
+
"saveConfig": {
|
|
581
|
+
"complexType": {
|
|
582
|
+
"signature": "(config: IGridConfig) => Promise<void>",
|
|
583
|
+
"parameters": [{
|
|
584
|
+
"tags": [],
|
|
585
|
+
"text": ""
|
|
586
|
+
}],
|
|
587
|
+
"references": {
|
|
588
|
+
"Promise": {
|
|
589
|
+
"location": "global"
|
|
590
|
+
},
|
|
591
|
+
"IGridConfig": {
|
|
592
|
+
"location": "import",
|
|
593
|
+
"path": "@sankhyalabs/ezui/dist/types/components/ez-grid/controller/EzGridController"
|
|
594
|
+
}
|
|
595
|
+
},
|
|
596
|
+
"return": "Promise<void>"
|
|
597
|
+
},
|
|
598
|
+
"docs": {
|
|
599
|
+
"text": "",
|
|
600
|
+
"tags": []
|
|
601
|
+
}
|
|
602
|
+
}
|
|
603
|
+
};
|
|
604
|
+
}
|
|
605
|
+
}
|
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
import { h } from '@stencil/core';
|
|
2
|
+
import { ORDER_VALUES } from '../../../../lib/utils/constants';
|
|
3
|
+
export class SelectBox {
|
|
4
|
+
constructor() {
|
|
5
|
+
this.selectedOption = ORDER_VALUES.none;
|
|
6
|
+
}
|
|
7
|
+
render() {
|
|
8
|
+
return (h("ez-combo-box", { class: "grid-config-combo ez-input--inverted", label: "", suppressSearch: true, value: this.selectedOption, enabled: true, canShowError: false, suppressEmptyOption: true }, Object.keys(ORDER_VALUES).map((key) => {
|
|
9
|
+
return h("option", { value: ORDER_VALUES[key].value }, ORDER_VALUES[key].label);
|
|
10
|
+
})));
|
|
11
|
+
}
|
|
12
|
+
static get is() { return "snk-select-box"; }
|
|
13
|
+
static get encapsulation() { return "shadow"; }
|
|
14
|
+
static get originalStyleUrls() {
|
|
15
|
+
return {
|
|
16
|
+
"$": ["snk-select-box.css"]
|
|
17
|
+
};
|
|
18
|
+
}
|
|
19
|
+
static get styleUrls() {
|
|
20
|
+
return {
|
|
21
|
+
"$": ["snk-select-box.css"]
|
|
22
|
+
};
|
|
23
|
+
}
|
|
24
|
+
static get assetsDirs() { return ["../assets"]; }
|
|
25
|
+
static get properties() {
|
|
26
|
+
return {
|
|
27
|
+
"selectedOption": {
|
|
28
|
+
"type": "string",
|
|
29
|
+
"mutable": false,
|
|
30
|
+
"complexType": {
|
|
31
|
+
"original": "IOption | string",
|
|
32
|
+
"resolved": "IOption | string",
|
|
33
|
+
"references": {
|
|
34
|
+
"IOption": {
|
|
35
|
+
"location": "import",
|
|
36
|
+
"path": "@sankhyalabs/ezui/dist/types/components/ez-combo-box/ez-combo-box"
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
},
|
|
40
|
+
"required": false,
|
|
41
|
+
"optional": false,
|
|
42
|
+
"docs": {
|
|
43
|
+
"tags": [],
|
|
44
|
+
"text": ""
|
|
45
|
+
},
|
|
46
|
+
"attribute": "selected-option",
|
|
47
|
+
"reflect": false,
|
|
48
|
+
"defaultValue": "ORDER_VALUES.none"
|
|
49
|
+
}
|
|
50
|
+
};
|
|
51
|
+
}
|
|
52
|
+
static get events() {
|
|
53
|
+
return [{
|
|
54
|
+
"method": "ezChange",
|
|
55
|
+
"name": "ezChange",
|
|
56
|
+
"bubbles": true,
|
|
57
|
+
"cancelable": true,
|
|
58
|
+
"composed": true,
|
|
59
|
+
"docs": {
|
|
60
|
+
"tags": [],
|
|
61
|
+
"text": ""
|
|
62
|
+
},
|
|
63
|
+
"complexType": {
|
|
64
|
+
"original": "string",
|
|
65
|
+
"resolved": "string",
|
|
66
|
+
"references": {}
|
|
67
|
+
}
|
|
68
|
+
}];
|
|
69
|
+
}
|
|
70
|
+
}
|