@sankhyalabs/ezui 1.1.118 → 1.1.121
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/ez-check.cjs.entry.js +1 -1
- package/dist/cjs/ez-form.cjs.entry.js +59 -15
- package/dist/cjs/ez-grid.cjs.entry.js +45 -12
- package/dist/cjs/ez-popover.cjs.entry.js +41 -22
- package/dist/cjs/ez-upload.cjs.entry.js +10 -3
- package/dist/cjs/ezui.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/test-du.cjs.entry.js +39 -46
- package/dist/collection/components/ez-check/ez-check.css +28 -10
- package/dist/collection/components/ez-form/DataBinder.js +59 -15
- package/dist/collection/components/ez-form/fieldbuilder/tpl/FileInput.tpl.js +1 -1
- package/dist/collection/components/ez-grid/controller/ag-grid/AgGridController.js +27 -9
- package/dist/collection/components/ez-grid/controller/ag-grid/DataSource.js +6 -3
- package/dist/collection/components/ez-grid/ez-grid.js +47 -0
- package/dist/collection/components/ez-popover/ez-popover.css +3 -5
- package/dist/collection/components/ez-popover/ez-popover.js +62 -28
- package/dist/collection/components/ez-upload/ez-upload.js +29 -3
- package/dist/collection/components/test-du/test-du.js +47 -48
- package/dist/custom-elements/index.js +197 -102
- package/dist/esm/ez-check.entry.js +1 -1
- package/dist/esm/ez-form.entry.js +60 -16
- package/dist/esm/ez-grid.entry.js +45 -12
- package/dist/esm/ez-popover.entry.js +41 -22
- package/dist/esm/ez-upload.entry.js +10 -3
- package/dist/esm/ezui.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/test-du.entry.js +40 -47
- package/dist/ezui/ezui.esm.js +1 -1
- package/dist/ezui/p-68c509a7.entry.js +1 -0
- package/dist/ezui/p-76b64956.entry.js +1 -0
- package/dist/ezui/p-8793a124.entry.js +1 -0
- package/dist/ezui/p-a6e28794.entry.js +1 -0
- package/dist/ezui/{p-3cd17150.entry.js → p-c86cd69e.entry.js} +1 -1
- package/dist/ezui/p-f8d3c04d.entry.js +1 -0
- package/dist/types/components/ez-form/DataBinder.d.ts +2 -0
- package/dist/types/components/ez-grid/controller/EzGridController.d.ts +6 -2
- package/dist/types/components/ez-grid/controller/ag-grid/AgGridController.d.ts +5 -2
- package/dist/types/components/ez-grid/controller/ag-grid/DataSource.d.ts +2 -0
- package/dist/types/components/ez-grid/ez-grid.d.ts +8 -0
- package/dist/types/components/ez-popover/ez-popover.d.ts +7 -0
- package/dist/types/components/ez-upload/ez-upload.d.ts +5 -0
- package/dist/types/components/test-du/test-du.d.ts +2 -0
- package/dist/types/components.d.ts +21 -1
- package/package.json +1 -1
- package/dist/ezui/p-080045a0.entry.js +0 -1
- package/dist/ezui/p-126d33e2.entry.js +0 -1
- package/dist/ezui/p-1339fde7.entry.js +0 -1
- package/dist/ezui/p-73d3f767.entry.js +0 -1
- package/dist/ezui/p-f3f9c7e6.entry.js +0 -1
|
@@ -57,9 +57,9 @@
|
|
|
57
57
|
/*@doc Define a altura do slider do checkbox.*/
|
|
58
58
|
--ez-switch--slider--height: 14px;
|
|
59
59
|
/*@doc Define a largura do pino do slider do checkbox.*/
|
|
60
|
-
--ez-switch--pin--width:
|
|
60
|
+
--ez-switch--pin--width: 19px;
|
|
61
61
|
/*@doc Define a altura do pino do slider do checkbox.*/
|
|
62
|
-
--ez-switch--pin--height:
|
|
62
|
+
--ez-switch--pin--height: 19px;
|
|
63
63
|
/*@doc Define a largura do slider quando focado.*/
|
|
64
64
|
--ez-switch--focus--width: 32px;
|
|
65
65
|
/*@doc Define a altura do slider quando focado.*/
|
|
@@ -71,15 +71,17 @@
|
|
|
71
71
|
/*@doc Define a cor de fundo do checkbox desabilitado no modo switch.*/
|
|
72
72
|
--ez-switch--disabled--background-color: var(--color--disable-secondary);
|
|
73
73
|
/*@doc Define a cor de fundo do checkbox marcado no modo switch.*/
|
|
74
|
-
--ez-switch--checked--background-color: var(--color--primary-300);
|
|
74
|
+
--ez-switch--disabled--checked--background-color: var(--color--primary-300);
|
|
75
|
+
/*@doc Define a cor de fundo do checkbox marcado no modo switch.*/
|
|
76
|
+
--ez-switch--checked--background-color: var(--color--primary);
|
|
75
77
|
|
|
76
78
|
/*pin*/
|
|
77
79
|
/*@doc Define a cor de fundo do pino do slider. */
|
|
78
80
|
--ez-switch--pin--background-color: var(--background--xlight);
|
|
79
81
|
/*@doc Define a cor de fundo do pino do slider quando desabilitado. */
|
|
80
|
-
--ez-switch--pin--disabled--background-color: var(--color--disable-
|
|
82
|
+
--ez-switch--pin--disabled--background-color: var(--color--disable-primary);
|
|
81
83
|
/*@doc Define a cor de fundo do pino do slider quando marcado. */
|
|
82
|
-
--ez-switch--pin--checked--background-color: var(--
|
|
84
|
+
--ez-switch--pin--checked--background-color: var(--background--xlight);
|
|
83
85
|
/*@doc Define a cor de fundo do pino do slider quando marcado e desabilitado1. */
|
|
84
86
|
--ez-switch--pin--checked--disabled--background-color: #E8F7F4;
|
|
85
87
|
/*@doc Define a cor de fundo do pino do slider quando focado. */
|
|
@@ -87,6 +89,11 @@
|
|
|
87
89
|
/*@doc Define a cor de fundo do pino do slider quando marcado e focado. */
|
|
88
90
|
--ez-switch--pin--checked--focus--background-color: var(--color--primary);
|
|
89
91
|
|
|
92
|
+
/*@doc Define a cor da borda do pino do slider. */
|
|
93
|
+
--ez-switch--pin--border-color: var(--text--primary);
|
|
94
|
+
/*@doc Define a cor da borda do pino do slider quando desabilitado. */
|
|
95
|
+
--ez-switch--pin--disabled--border-color: var(--text--secondary);
|
|
96
|
+
|
|
90
97
|
/*@doc Define o tamanho da fonte do label.*/
|
|
91
98
|
--ez-check--label--font-size: var(--text--medium, 14px);
|
|
92
99
|
/*@doc Define a família da fonte do label.*/
|
|
@@ -218,7 +225,7 @@ input.switchMode {
|
|
|
218
225
|
outline: none;
|
|
219
226
|
cursor: pointer;
|
|
220
227
|
border-radius: 20px;
|
|
221
|
-
border: var(--border--small, 1px solid) var(--
|
|
228
|
+
border: var(--border--small, 1px solid) var(--ez-switch--pin--border-color, #626e82);
|
|
222
229
|
transition: background-color var(--transition);
|
|
223
230
|
|
|
224
231
|
/*public*/
|
|
@@ -230,6 +237,12 @@ input.switchMode {
|
|
|
230
237
|
input.switchMode:disabled {
|
|
231
238
|
/*public*/
|
|
232
239
|
background-color: var(--ez-switch--disabled--background-color);
|
|
240
|
+
border: var(--border--small, 1px solid) var(--ez-switch--pin--disabled--border-color, #a2abb9);
|
|
241
|
+
}
|
|
242
|
+
|
|
243
|
+
input.switchMode:checked:disabled {
|
|
244
|
+
/*public*/
|
|
245
|
+
background-color: var(--ez-switch--disabled--checked--background-color);
|
|
233
246
|
}
|
|
234
247
|
|
|
235
248
|
input.switchMode::after {
|
|
@@ -240,8 +253,10 @@ input.switchMode::after {
|
|
|
240
253
|
box-shadow: var(--shadow);
|
|
241
254
|
transition: transform var(--transition);
|
|
242
255
|
transition: background-color var(--transition);
|
|
243
|
-
|
|
256
|
+
transition: border-color var(--transition);
|
|
257
|
+
transform: translateX(-2px) translateY(-4px);
|
|
244
258
|
border-radius: 50%;
|
|
259
|
+
border: var(--border--small, 1px solid) var(--ez-switch--pin--border-color, #626e82);
|
|
245
260
|
|
|
246
261
|
/*public*/
|
|
247
262
|
width: var(--ez-switch--pin--width);
|
|
@@ -252,6 +267,7 @@ input.switchMode::after {
|
|
|
252
267
|
input.switchMode:disabled::after {
|
|
253
268
|
/*public*/
|
|
254
269
|
background-color: var(--ez-switch--pin--disabled--background-color);
|
|
270
|
+
border: var(--border--small, 1px solid) var(--ez-switch--pin--disabled--border-color, #a2abb9);
|
|
255
271
|
}
|
|
256
272
|
|
|
257
273
|
/*-------------------------------ON---------------------------------*/
|
|
@@ -277,7 +293,7 @@ input.switchMode::before {
|
|
|
277
293
|
width: var(--ez-switch--focus--width);
|
|
278
294
|
height: var(--ez-switch--focus--height);
|
|
279
295
|
top: calc((var(--ez-switch--slider--height) - var(--ez-switch--focus--height)) / 2);
|
|
280
|
-
left: calc((var(--ez-switch--pin--width) - var(--ez-switch--focus--width))/2);
|
|
296
|
+
left: calc((var(--ez-switch--pin--width) - var(--ez-switch--focus--width) - 2px) / 2);
|
|
281
297
|
background-color: var(--ez-switch--pin--focus--background-color);
|
|
282
298
|
}
|
|
283
299
|
|
|
@@ -290,18 +306,20 @@ input.switchMode:focus::before {
|
|
|
290
306
|
input.switchMode:checked:focus::before {
|
|
291
307
|
/*private*/
|
|
292
308
|
background-color: var(--ez-switch--pin--checked--focus--background-color);
|
|
293
|
-
transform: translateX(calc(var(--ez-switch--slider--width) - var(--ez-switch--pin--width)));
|
|
309
|
+
transform: translateX(calc(var(--ez-switch--slider--width) - var(--ez-switch--pin--width) + 2px));
|
|
294
310
|
}
|
|
295
311
|
|
|
296
312
|
input.switchMode:checked::after {
|
|
297
313
|
/*private*/
|
|
298
314
|
transition: transform var(--transition);
|
|
299
315
|
transition: background-color var(--transition);
|
|
300
|
-
|
|
316
|
+
transition: border-color var(--transition);
|
|
317
|
+
transform: translateX(calc(var(--ez-switch--slider--width) - var(--ez-switch--pin--width))) translateY(-4px);
|
|
301
318
|
box-shadow: var(--shadow);
|
|
302
319
|
|
|
303
320
|
/*public*/
|
|
304
321
|
background-color: var(--ez-switch--pin--checked--background-color);
|
|
322
|
+
border: var(--border--small, 1px solid) var(--color--primary, #008561);
|
|
305
323
|
}
|
|
306
324
|
|
|
307
325
|
input.switchMode:checked:disabled::after {
|
|
@@ -1,32 +1,58 @@
|
|
|
1
|
-
import { ApplicationContext } from "@sankhyalabs/core";
|
|
1
|
+
import { ApplicationContext, Action } from "@sankhyalabs/core";
|
|
2
2
|
export default class DataBinder {
|
|
3
3
|
constructor(dataUnit) {
|
|
4
4
|
this._fields = new Map();
|
|
5
5
|
this._dataUnit = dataUnit;
|
|
6
|
-
this._dataUnit.subscribe(
|
|
6
|
+
this._dataUnit.subscribe(action => {
|
|
7
7
|
var _a;
|
|
8
|
-
(
|
|
9
|
-
|
|
10
|
-
|
|
8
|
+
switch (action.type) {
|
|
9
|
+
case Action.DATA_LOADED:
|
|
10
|
+
case Action.DATA_SAVED:
|
|
11
|
+
case Action.RECORDS_REMOVED:
|
|
12
|
+
case Action.RECORDS_ADDED:
|
|
13
|
+
case Action.RECORDS_COPIED:
|
|
14
|
+
case Action.DATA_CHANGED:
|
|
15
|
+
case Action.EDITION_CANCELED:
|
|
16
|
+
case Action.CHANGE_UNDONE:
|
|
17
|
+
case Action.CHANGE_REDONE:
|
|
18
|
+
case Action.SELECTION_CHANGED:
|
|
19
|
+
case Action.NEXT_SELECTED:
|
|
20
|
+
case Action.PREVIOUS_SELECTED:
|
|
21
|
+
(_a = this._fields) === null || _a === void 0 ? void 0 : _a.forEach(field => {
|
|
22
|
+
this.updateValue(field.fieldName, field.field);
|
|
23
|
+
});
|
|
24
|
+
break;
|
|
25
|
+
}
|
|
11
26
|
});
|
|
12
27
|
}
|
|
13
28
|
bind(fields) {
|
|
14
29
|
fields.forEach(fieldElement => {
|
|
15
30
|
const fieldName = fieldElement.dataset.fieldName;
|
|
16
31
|
this.updateBind(fieldName, fieldElement);
|
|
17
|
-
this.updateValue(fieldName, fieldElement);
|
|
18
32
|
});
|
|
19
33
|
}
|
|
20
34
|
updateValue(fieldName, field) {
|
|
21
|
-
field["value"]
|
|
35
|
+
const oldValue = field["value"];
|
|
36
|
+
const newValue = this._dataUnit.getFieldValue(fieldName);
|
|
37
|
+
if (oldValue != newValue) {
|
|
38
|
+
field["value"] = newValue;
|
|
39
|
+
}
|
|
22
40
|
}
|
|
23
41
|
updateBind(fieldName, field) {
|
|
24
42
|
const oldBind = this._fields.get(fieldName);
|
|
25
43
|
if (oldBind) {
|
|
26
44
|
oldBind.destroy();
|
|
27
45
|
}
|
|
28
|
-
|
|
46
|
+
field["value"] = this._dataUnit.getFieldValue(fieldName);
|
|
47
|
+
this._fields.set(fieldName, Bind.create(fieldName, field, (fieldName, waitingChange) => this.changeStarted(fieldName, waitingChange), (fieldName, newValue) => this.setFieldValue(fieldName, newValue)));
|
|
29
48
|
this.bindSearchOptionsLoader(fieldName, field);
|
|
49
|
+
this.applyEzUploadContext(fieldName, field);
|
|
50
|
+
}
|
|
51
|
+
changeStarted(fieldName, waitingChange) {
|
|
52
|
+
if (this._dataUnit.records.length === 0) {
|
|
53
|
+
this._dataUnit.addRecord();
|
|
54
|
+
}
|
|
55
|
+
this._dataUnit.startChange(fieldName, waitingChange);
|
|
30
56
|
}
|
|
31
57
|
setFieldValue(fieldName, newValue) {
|
|
32
58
|
if (this._dataUnit.records.length === 0) {
|
|
@@ -44,19 +70,37 @@ export default class DataBinder {
|
|
|
44
70
|
}
|
|
45
71
|
}
|
|
46
72
|
}
|
|
73
|
+
applyEzUploadContext(fieldName, field) {
|
|
74
|
+
var _a, _b;
|
|
75
|
+
if (field.nodeName === "EZ-UPLOAD") {
|
|
76
|
+
field["urlUpload"] = ApplicationContext.getContextValue("__EZUI__UPLOAD__ADD__URL__");
|
|
77
|
+
field["urlDelete"] = ApplicationContext.getContextValue("__EZUI__UPLOAD__DEL__URL__");
|
|
78
|
+
const descriptor = this._dataUnit.getField(fieldName);
|
|
79
|
+
const destination = (_a = descriptor.properties) === null || _a === void 0 ? void 0 : _a.DESTINATION;
|
|
80
|
+
if (destination) {
|
|
81
|
+
field["requestHeaders"] = { XTRAINF: `{"destination": "${destination}"}` };
|
|
82
|
+
}
|
|
83
|
+
field["maxFiles"] = ((_b = descriptor.properties) === null || _b === void 0 ? void 0 : _b.MAX_FILES) || 0;
|
|
84
|
+
}
|
|
85
|
+
}
|
|
47
86
|
}
|
|
48
87
|
class Bind {
|
|
88
|
+
constructor() {
|
|
89
|
+
this.startChangeEventName = "ezStartChange";
|
|
90
|
+
this.changeEventName = "ezChange";
|
|
91
|
+
}
|
|
49
92
|
destroy() {
|
|
50
|
-
this.field.removeEventListener(this.
|
|
93
|
+
this.field.removeEventListener(this.startChangeEventName, this.startChangeListener);
|
|
94
|
+
this.field.removeEventListener(this.changeEventName, this.changeListener);
|
|
51
95
|
}
|
|
52
|
-
static create(fieldName, field,
|
|
96
|
+
static create(fieldName, field, startChangeCallback, changeCallback) {
|
|
53
97
|
const b = new Bind();
|
|
54
|
-
b.fieldName = fieldName;
|
|
55
98
|
b.field = field;
|
|
56
|
-
|
|
57
|
-
b.
|
|
58
|
-
b.
|
|
59
|
-
b.
|
|
99
|
+
b.fieldName = fieldName;
|
|
100
|
+
b.startChangeListener = (evt) => { startChangeCallback(fieldName, evt.detail); };
|
|
101
|
+
b.field.addEventListener(b.startChangeEventName, b.startChangeListener);
|
|
102
|
+
b.changeListener = (evt) => { changeCallback(fieldName, evt.detail); };
|
|
103
|
+
b.field.addEventListener(b.changeEventName, b.changeListener);
|
|
60
104
|
return b;
|
|
61
105
|
}
|
|
62
106
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { h } from "@stencil/core";
|
|
2
2
|
export const buildFile = ({ name, label, readOnly }) => {
|
|
3
3
|
return (h("div", { class: "col col--sd-12 padding-horizontal--small" },
|
|
4
|
-
h("ez-upload", { enabled: !readOnly, label: label,
|
|
4
|
+
h("ez-upload", { enabled: !readOnly, label: label, "data-field-name": name, key: name })));
|
|
5
5
|
};
|
|
@@ -37,11 +37,13 @@ export default class AgGridController {
|
|
|
37
37
|
this._serverURL = options.serverURL;
|
|
38
38
|
this._dataUnit = options.dataUnit;
|
|
39
39
|
this._dataUnit.sortingProvider = this;
|
|
40
|
+
this._dataSource = new DataSource(this._dataUnit, this._serverURL);
|
|
40
41
|
this._gridOptions = {
|
|
41
42
|
localeText: gridTerms,
|
|
42
43
|
rowModelType: "serverSide",
|
|
44
|
+
serverSideStoreType: "partial",
|
|
43
45
|
rowSelection: this._multipleSelection ? "multiple" : "single",
|
|
44
|
-
serverSideDatasource:
|
|
46
|
+
serverSideDatasource: this._dataSource,
|
|
45
47
|
getRowNodeId: (params) => typeof params === "string" ? params : params[this._idAttribName],
|
|
46
48
|
getMainMenuItems: (params) => {
|
|
47
49
|
const column = params.column;
|
|
@@ -52,10 +54,13 @@ export default class AgGridController {
|
|
|
52
54
|
}));
|
|
53
55
|
return items;
|
|
54
56
|
},
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
57
|
+
getRowHeight: () => {
|
|
58
|
+
//FIXME: Existe um bug no PartialStore.prototype.destroyAllBlocks do ag-grid, pois
|
|
59
|
+
//apesar de destruir os blocos, mantém a variável "blockHeights" com o tamanho antigo
|
|
60
|
+
//dos blocos, então, quando removemos uma linha, a altura do bloco não é recalculada.
|
|
61
|
+
//Descobri que setando manualmente a altura das linhas, apesar do bloco ficar com
|
|
62
|
+
//tamanho errado, isso afeta menos o componente.
|
|
63
|
+
return 25;
|
|
59
64
|
}
|
|
60
65
|
};
|
|
61
66
|
this.setOptionsEvents(this._gridOptions);
|
|
@@ -78,6 +83,11 @@ export default class AgGridController {
|
|
|
78
83
|
opt.onSelectionChanged = e => this.onSelectionChange(e);
|
|
79
84
|
opt.onPaginationChanged = () => this.onPaginationChange();
|
|
80
85
|
opt.onRowDoubleClicked = evt => this.onRowDoubleClick(evt);
|
|
86
|
+
opt.onViewportChanged = () => {
|
|
87
|
+
if (this._dataUnit) {
|
|
88
|
+
this.selectRows(this._dataUnit.getSelection());
|
|
89
|
+
}
|
|
90
|
+
};
|
|
81
91
|
}
|
|
82
92
|
setOptionsPagination(opt) {
|
|
83
93
|
opt.pagination = (this._pageSize > -1);
|
|
@@ -95,11 +105,11 @@ export default class AgGridController {
|
|
|
95
105
|
}
|
|
96
106
|
this._gridOptions.api.setRowData(data);
|
|
97
107
|
}
|
|
98
|
-
addRows(
|
|
108
|
+
addRows() {
|
|
99
109
|
if (this._grid === undefined) {
|
|
100
110
|
throw new Error("Erro interno: Grid ainda não inicializado.");
|
|
101
111
|
}
|
|
102
|
-
this._gridOptions.api.
|
|
112
|
+
this._gridOptions.api.refreshServerSideStore({});
|
|
103
113
|
}
|
|
104
114
|
selectRows(rowIds) {
|
|
105
115
|
if (this._grid === undefined) {
|
|
@@ -114,11 +124,11 @@ export default class AgGridController {
|
|
|
114
124
|
});
|
|
115
125
|
}
|
|
116
126
|
}
|
|
117
|
-
removeRows(
|
|
127
|
+
removeRows() {
|
|
118
128
|
if (this._grid === undefined) {
|
|
119
129
|
throw new Error("Erro interno: Grid ainda não inicializado.");
|
|
120
130
|
}
|
|
121
|
-
this._gridOptions.api.
|
|
131
|
+
this._gridOptions.api.refreshServerSideStore({});
|
|
122
132
|
}
|
|
123
133
|
changeValues(changes, rowIds) {
|
|
124
134
|
if (this._grid === undefined) {
|
|
@@ -235,6 +245,14 @@ export default class AgGridController {
|
|
|
235
245
|
previousPage() {
|
|
236
246
|
this._gridOptions.api.paginationGoToPreviousPage();
|
|
237
247
|
}
|
|
248
|
+
goToPage(page) {
|
|
249
|
+
this._gridOptions.api.paginationGoToPage(page);
|
|
250
|
+
}
|
|
251
|
+
quickFilter(term) {
|
|
252
|
+
this._dataSource.setQuickFilter(term);
|
|
253
|
+
this.goToPage(0);
|
|
254
|
+
this._gridOptions.api.refreshServerSideStore({ purge: true });
|
|
255
|
+
}
|
|
238
256
|
buildColDef(source) {
|
|
239
257
|
return {
|
|
240
258
|
headerName: source.label,
|
|
@@ -19,15 +19,15 @@ export default class DataSource {
|
|
|
19
19
|
}
|
|
20
20
|
}
|
|
21
21
|
else {
|
|
22
|
-
this.loadData()
|
|
22
|
+
this.loadData({ limit: params.api.paginationGetPageSize(), offset: params.request.startRow, quickFilter: this._quickFilterTerm })
|
|
23
23
|
.then(data => params.success(data))
|
|
24
24
|
.catch(() => params.fail());
|
|
25
25
|
}
|
|
26
26
|
}
|
|
27
|
-
loadData() {
|
|
27
|
+
loadData(page) {
|
|
28
28
|
return new Promise((resolve, reject) => {
|
|
29
29
|
if (this._dataUnit) {
|
|
30
|
-
this._dataUnit.loadData().then(
|
|
30
|
+
this._dataUnit.loadData(page).then(pageRes => resolve({ rowData: this._dataUnit.records, rowCount: pageRes.total }));
|
|
31
31
|
}
|
|
32
32
|
else {
|
|
33
33
|
fetch(this._serverURL)
|
|
@@ -38,4 +38,7 @@ export default class DataSource {
|
|
|
38
38
|
}
|
|
39
39
|
});
|
|
40
40
|
}
|
|
41
|
+
setQuickFilter(term) {
|
|
42
|
+
this._quickFilterTerm = term;
|
|
43
|
+
}
|
|
41
44
|
}
|
|
@@ -54,6 +54,18 @@ export class EzGrid {
|
|
|
54
54
|
async getColumns() {
|
|
55
55
|
return Promise.resolve(this._gridController.getColumnsDef());
|
|
56
56
|
}
|
|
57
|
+
/**
|
|
58
|
+
* Método para recarregar pagina atual da grid.
|
|
59
|
+
*/
|
|
60
|
+
async refresh() {
|
|
61
|
+
this._gridController.refresh();
|
|
62
|
+
}
|
|
63
|
+
/**
|
|
64
|
+
* Método para fazer um filtro rápido na grid.
|
|
65
|
+
*/
|
|
66
|
+
async quickFilter(term) {
|
|
67
|
+
this._gridController.quickFilter(term);
|
|
68
|
+
}
|
|
57
69
|
componentWillLoad() {
|
|
58
70
|
if (this.dataUnit) {
|
|
59
71
|
this._dataUnitBridge = new DataUnitBridge(this._gridController, this.dataUnit);
|
|
@@ -433,6 +445,41 @@ export class EzGrid {
|
|
|
433
445
|
"text": "M\u00E9todo retornar o estado atual das colunas do grid.",
|
|
434
446
|
"tags": []
|
|
435
447
|
}
|
|
448
|
+
},
|
|
449
|
+
"refresh": {
|
|
450
|
+
"complexType": {
|
|
451
|
+
"signature": "() => Promise<any>",
|
|
452
|
+
"parameters": [],
|
|
453
|
+
"references": {
|
|
454
|
+
"Promise": {
|
|
455
|
+
"location": "global"
|
|
456
|
+
}
|
|
457
|
+
},
|
|
458
|
+
"return": "Promise<any>"
|
|
459
|
+
},
|
|
460
|
+
"docs": {
|
|
461
|
+
"text": "M\u00E9todo para recarregar pagina atual da grid.",
|
|
462
|
+
"tags": []
|
|
463
|
+
}
|
|
464
|
+
},
|
|
465
|
+
"quickFilter": {
|
|
466
|
+
"complexType": {
|
|
467
|
+
"signature": "(term: string) => Promise<any>",
|
|
468
|
+
"parameters": [{
|
|
469
|
+
"tags": [],
|
|
470
|
+
"text": ""
|
|
471
|
+
}],
|
|
472
|
+
"references": {
|
|
473
|
+
"Promise": {
|
|
474
|
+
"location": "global"
|
|
475
|
+
}
|
|
476
|
+
},
|
|
477
|
+
"return": "Promise<any>"
|
|
478
|
+
},
|
|
479
|
+
"docs": {
|
|
480
|
+
"text": "M\u00E9todo para fazer um filtro r\u00E1pido na grid.",
|
|
481
|
+
"tags": []
|
|
482
|
+
}
|
|
436
483
|
}
|
|
437
484
|
}; }
|
|
438
485
|
}
|
|
@@ -17,11 +17,9 @@
|
|
|
17
17
|
position: relative;
|
|
18
18
|
display: flex;
|
|
19
19
|
user-select: none;
|
|
20
|
-
width: 100%;
|
|
21
20
|
}
|
|
22
21
|
|
|
23
|
-
|
|
24
|
-
.box {
|
|
22
|
+
.popover__box {
|
|
25
23
|
/*private*/
|
|
26
24
|
z-index: var(--ez-popover__box--z-index);
|
|
27
25
|
display: flex;
|
|
@@ -35,10 +33,10 @@
|
|
|
35
33
|
box-shadow: var(--ez-popover__box--box-shadow);
|
|
36
34
|
}
|
|
37
35
|
|
|
38
|
-
.
|
|
36
|
+
.popover__box--fit-content {
|
|
39
37
|
width: fit-content;
|
|
40
38
|
}
|
|
41
39
|
|
|
42
|
-
.
|
|
40
|
+
.popover__box--full-width {
|
|
43
41
|
width: 100%;
|
|
44
42
|
}
|
|
@@ -29,6 +29,41 @@ export class EzPopover {
|
|
|
29
29
|
* Opções: "100% e "fit-content" (default)
|
|
30
30
|
*/
|
|
31
31
|
this.boxWidth = "fit-content";
|
|
32
|
+
this.innerClickTest = (_popOvercontainer, node, eventOrigin) => {
|
|
33
|
+
const innerContainers = [_popOvercontainer];
|
|
34
|
+
if (this.innerElement) {
|
|
35
|
+
if (typeof (this.innerElement) == "string") {
|
|
36
|
+
innerContainers.push(document.querySelector(`#${this.innerElement}`));
|
|
37
|
+
}
|
|
38
|
+
else {
|
|
39
|
+
this.innerElement.forEach(comp => {
|
|
40
|
+
innerContainers.push(document.querySelector(`#${comp}`));
|
|
41
|
+
});
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
for (var i = 0; i < innerContainers.length; i++) {
|
|
45
|
+
let _container = innerContainers[i];
|
|
46
|
+
if (_container != undefined) {
|
|
47
|
+
if (_container.contains(node)) {
|
|
48
|
+
return true;
|
|
49
|
+
}
|
|
50
|
+
if (eventOrigin && "nodeType" in (eventOrigin === null || eventOrigin === void 0 ? void 0 : eventOrigin.target) && _container.contains(eventOrigin.target)) {
|
|
51
|
+
return true;
|
|
52
|
+
}
|
|
53
|
+
if (_container.shadowRoot && _container.shadowRoot.contains(node)) {
|
|
54
|
+
return true;
|
|
55
|
+
}
|
|
56
|
+
_container = this._host;
|
|
57
|
+
if (!_container.lastElementChild.shadowRoot ? _container.contains(node) : _container.lastElementChild.shadowRoot.contains(node)) {
|
|
58
|
+
return true;
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
}
|
|
62
|
+
return false;
|
|
63
|
+
};
|
|
64
|
+
this.backClickListener = () => {
|
|
65
|
+
this.ezVisibilityChange.emit(false);
|
|
66
|
+
};
|
|
32
67
|
}
|
|
33
68
|
dispatchVisibilityChange(newValue, oldValue) {
|
|
34
69
|
if (newValue != oldValue) {
|
|
@@ -45,16 +80,8 @@ export class EzPopover {
|
|
|
45
80
|
left,
|
|
46
81
|
bottom,
|
|
47
82
|
right,
|
|
48
|
-
innerClickTest:
|
|
49
|
-
|
|
50
|
-
return true;
|
|
51
|
-
}
|
|
52
|
-
if (_container.shadowRoot && _container.shadowRoot.contains(node)) {
|
|
53
|
-
return true;
|
|
54
|
-
}
|
|
55
|
-
_container = this._host;
|
|
56
|
-
return !_container.lastElementChild.shadowRoot ? _container.contains(node) : _container.lastElementChild.shadowRoot.contains(node);
|
|
57
|
-
}
|
|
83
|
+
innerClickTest: this.innerClickTest,
|
|
84
|
+
backClickListener: this.backClickListener
|
|
58
85
|
};
|
|
59
86
|
FloatingManager.updateFloatPosition(this._box, this._container, floatingOptions);
|
|
60
87
|
}
|
|
@@ -68,16 +95,8 @@ export class EzPopover {
|
|
|
68
95
|
left,
|
|
69
96
|
bottom,
|
|
70
97
|
right,
|
|
71
|
-
innerClickTest:
|
|
72
|
-
|
|
73
|
-
return true;
|
|
74
|
-
}
|
|
75
|
-
if (_container.shadowRoot && _container.shadowRoot.contains(node)) {
|
|
76
|
-
return true;
|
|
77
|
-
}
|
|
78
|
-
_container = this._host;
|
|
79
|
-
return !_container.lastElementChild.shadowRoot ? _container.contains(node) : _container.lastElementChild.shadowRoot.contains(node);
|
|
80
|
-
}
|
|
98
|
+
innerClickTest: this.innerClickTest,
|
|
99
|
+
backClickListener: this.backClickListener
|
|
81
100
|
};
|
|
82
101
|
this._floatingID = FloatingManager.float(this._box, this._container, floatingOptions);
|
|
83
102
|
this.opened = true;
|
|
@@ -101,7 +120,7 @@ export class EzPopover {
|
|
|
101
120
|
render() {
|
|
102
121
|
return (h(Host, null,
|
|
103
122
|
h("section", { ref: el => this._container = el },
|
|
104
|
-
h("div", { class: `
|
|
123
|
+
h("div", { class: `popover__box ${this.boxWidth === "fit-content" ? "popover__box--fit-content" : "popover__box--full-width"}`, ref: el => this._box = el },
|
|
105
124
|
h("slot", null)))));
|
|
106
125
|
}
|
|
107
126
|
static get is() { return "ez-popover"; }
|
|
@@ -237,6 +256,27 @@ export class EzPopover {
|
|
|
237
256
|
},
|
|
238
257
|
"attribute": "opened",
|
|
239
258
|
"reflect": true
|
|
259
|
+
},
|
|
260
|
+
"innerElement": {
|
|
261
|
+
"type": "string",
|
|
262
|
+
"mutable": true,
|
|
263
|
+
"complexType": {
|
|
264
|
+
"original": "Array<string> | string",
|
|
265
|
+
"resolved": "string | string[]",
|
|
266
|
+
"references": {
|
|
267
|
+
"Array": {
|
|
268
|
+
"location": "global"
|
|
269
|
+
}
|
|
270
|
+
}
|
|
271
|
+
},
|
|
272
|
+
"required": false,
|
|
273
|
+
"optional": false,
|
|
274
|
+
"docs": {
|
|
275
|
+
"tags": [],
|
|
276
|
+
"text": "Array de componente(s) que ir\u00E1(\u00E3o) abrir o popover."
|
|
277
|
+
},
|
|
278
|
+
"attribute": "inner-element",
|
|
279
|
+
"reflect": true
|
|
240
280
|
}
|
|
241
281
|
}; }
|
|
242
282
|
static get events() { return [{
|
|
@@ -247,7 +287,7 @@ export class EzPopover {
|
|
|
247
287
|
"composed": true,
|
|
248
288
|
"docs": {
|
|
249
289
|
"tags": [],
|
|
250
|
-
"text": "
|
|
290
|
+
"text": "\nEvento disparado ao exibir/ocultar o componente."
|
|
251
291
|
},
|
|
252
292
|
"complexType": {
|
|
253
293
|
"original": "boolean",
|
|
@@ -275,9 +315,6 @@ export class EzPopover {
|
|
|
275
315
|
"references": {
|
|
276
316
|
"Promise": {
|
|
277
317
|
"location": "global"
|
|
278
|
-
},
|
|
279
|
-
"HTMLElement": {
|
|
280
|
-
"location": "global"
|
|
281
318
|
}
|
|
282
319
|
},
|
|
283
320
|
"return": "Promise<void>"
|
|
@@ -306,9 +343,6 @@ export class EzPopover {
|
|
|
306
343
|
"references": {
|
|
307
344
|
"Promise": {
|
|
308
345
|
"location": "global"
|
|
309
|
-
},
|
|
310
|
-
"HTMLElement": {
|
|
311
|
-
"location": "global"
|
|
312
346
|
}
|
|
313
347
|
},
|
|
314
348
|
"return": "Promise<void>"
|
|
@@ -10,6 +10,9 @@ export class EzUpload {
|
|
|
10
10
|
this.enabled = true;
|
|
11
11
|
}
|
|
12
12
|
changeValue(newValue) {
|
|
13
|
+
//Observamos o mundo externo, se um novo valor foi atribuído,
|
|
14
|
+
//precisamos cancelar a alteração anterior, isso envolve, percorrer
|
|
15
|
+
//a lista de ponteiros e cancelar todos os uploads em andamento.
|
|
13
16
|
if (newValue !== this._updatingValue) {
|
|
14
17
|
this._filePointers.forEach(f => {
|
|
15
18
|
if (this.isRemoteFile(f)) {
|
|
@@ -18,8 +21,8 @@ export class EzUpload {
|
|
|
18
21
|
});
|
|
19
22
|
this._filePointers = new Map();
|
|
20
23
|
this.updateFilePointers();
|
|
24
|
+
this._updatingValue = undefined;
|
|
21
25
|
}
|
|
22
|
-
this._updatingValue = undefined;
|
|
23
26
|
}
|
|
24
27
|
updateFilePointers() {
|
|
25
28
|
if (this.value) {
|
|
@@ -89,6 +92,7 @@ export class EzUpload {
|
|
|
89
92
|
}
|
|
90
93
|
async doAddFile(file) {
|
|
91
94
|
if (this.validateFile(file)) {
|
|
95
|
+
this.ezStartChange.emit({ waitmessage: "Há arquivos sendo enviados. Por favor aguarde a conclusão ou cancele o envio." });
|
|
92
96
|
const uploadingFile = new RemoteFile(file);
|
|
93
97
|
this._filePointers.set(file.name, uploadingFile);
|
|
94
98
|
uploadingFile.upload(this.urlUpload, this._requestHeaders, (file) => this.updateFeedback(file))
|
|
@@ -108,8 +112,10 @@ export class EzUpload {
|
|
|
108
112
|
this._updatingValue.push(f);
|
|
109
113
|
}
|
|
110
114
|
});
|
|
111
|
-
this.
|
|
112
|
-
|
|
115
|
+
if (this._filePointers.size === this._updatingValue.length) {
|
|
116
|
+
this.value = this._updatingValue;
|
|
117
|
+
this.ezChange.emit(this.value);
|
|
118
|
+
}
|
|
113
119
|
}
|
|
114
120
|
buildProgressId(uploading) {
|
|
115
121
|
let sanitizedName = uploading.name.replace(/[^a-z0-9_]/gi, "_");
|
|
@@ -435,6 +441,26 @@ export class EzUpload {
|
|
|
435
441
|
}
|
|
436
442
|
}
|
|
437
443
|
}
|
|
444
|
+
}, {
|
|
445
|
+
"method": "ezStartChange",
|
|
446
|
+
"name": "ezStartChange",
|
|
447
|
+
"bubbles": true,
|
|
448
|
+
"cancelable": true,
|
|
449
|
+
"composed": true,
|
|
450
|
+
"docs": {
|
|
451
|
+
"tags": [],
|
|
452
|
+
"text": "Evento emitido ao iniciar a altera\u00E7\u00E3o (remover ou adicionar um arquivo)."
|
|
453
|
+
},
|
|
454
|
+
"complexType": {
|
|
455
|
+
"original": "WaitingChange",
|
|
456
|
+
"resolved": "WaitingChange",
|
|
457
|
+
"references": {
|
|
458
|
+
"WaitingChange": {
|
|
459
|
+
"location": "import",
|
|
460
|
+
"path": "@sankhyalabs/core"
|
|
461
|
+
}
|
|
462
|
+
}
|
|
463
|
+
}
|
|
438
464
|
}]; }
|
|
439
465
|
static get methods() { return {
|
|
440
466
|
"addFiles": {
|