@zeedhi/teknisa-components-vuetify 3.0.4 → 3.2.0

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.
Files changed (87) hide show
  1. package/dist/teknisa-components-vuetify.es.js +3234 -0
  2. package/dist/teknisa-vuetify.css +1 -1
  3. package/dist/types/components/index.d.ts +6 -0
  4. package/dist/types/components/public.d.ts +11 -0
  5. package/dist/types/components/tek-breadcrumb-header/TekBreadcrumbHeader.d.ts +3 -0
  6. package/dist/types/components/tek-grid/TekGrid.d.ts +3 -0
  7. package/dist/types/components/tek-grid/column-filter/TekGridColumnFilter.d.ts +36 -0
  8. package/dist/types/components/tek-grid/column-header/TekGridHeaderRow.d.ts +2 -0
  9. package/dist/types/components/tek-grid/columns-button/TekGridColumnsButton.d.ts +3 -0
  10. package/{types → dist/types}/components/tek-grid/columns-button/TekGridColumnsOptionsController.d.ts +67 -66
  11. package/{types → dist/types}/components/tek-grid/columns-button/TekGridColumnsOptionsModal.d.ts +10 -9
  12. package/dist/types/components/tek-grid/filter-button/TekGridFilterButton.d.ts +3 -0
  13. package/dist/types/components/tek-grid/indentation/TekGridIndentation.d.ts +2 -0
  14. package/dist/types/components/tek-grid/layout-options/TekGridLayoutOptions.d.ts +3 -0
  15. package/dist/types/components/tek-grid/row/TekGridFooterRow.d.ts +2 -0
  16. package/dist/types/components/tek-grid/row/TekGridGroupRow.d.ts +2 -0
  17. package/dist/types/components/tek-loading/TekLoading.d.ts +3 -0
  18. package/dist/types/components/tek-user-info/TekUserInfo.d.ts +3 -0
  19. package/dist/types/components/tek-user-info/TekUserInfoList.d.ts +2 -0
  20. package/{types → dist/types}/composables/useTableLayout.d.ts +26 -26
  21. package/{types → dist/types}/index.d.ts +5 -6
  22. package/{types → dist/types}/utils/isArrayOperation.d.ts +2 -2
  23. package/package.json +40 -20
  24. package/src/index.ts +5 -3
  25. package/dist/teknisa-vuetify.js +0 -3885
  26. package/environments.json +0 -16
  27. package/jest.config.js +0 -31
  28. package/rollup.scss.config.js +0 -13
  29. package/src/components/index.ts +0 -38
  30. package/src/components/public.ts +0 -41
  31. package/src/components/tek-breadcrumb-header/TekBreadcrumbHeader.ts +0 -34
  32. package/src/components/tek-breadcrumb-header/TekBreadcrumbHeader.vue +0 -76
  33. package/src/components/tek-grid/TekGrid.ts +0 -318
  34. package/src/components/tek-grid/TekGrid.vue +0 -235
  35. package/src/components/tek-grid/column-filter/TekGridColumnFilter.ts +0 -244
  36. package/src/components/tek-grid/column-filter/TekGridColumnFilter.vue +0 -93
  37. package/src/components/tek-grid/column-header/TekGridHeaderRow.ts +0 -147
  38. package/src/components/tek-grid/column-header/TekGridHeaderRow.vue +0 -78
  39. package/src/components/tek-grid/columns-button/TekGridColumnsButton.ts +0 -96
  40. package/src/components/tek-grid/columns-button/TekGridColumnsButton.vue +0 -273
  41. package/src/components/tek-grid/columns-button/TekGridColumnsOptionsController.ts +0 -470
  42. package/src/components/tek-grid/columns-button/TekGridColumnsOptionsModal.ts +0 -513
  43. package/src/components/tek-grid/filter-button/TekGridFilterButton.ts +0 -47
  44. package/src/components/tek-grid/filter-button/TekGridFilterButton.vue +0 -28
  45. package/src/components/tek-grid/indentation/TekGridIndentation.ts +0 -21
  46. package/src/components/tek-grid/indentation/TekGridIndentation.vue +0 -33
  47. package/src/components/tek-grid/layout-options/TekGridLayoutOptions.ts +0 -119
  48. package/src/components/tek-grid/layout-options/TekGridLayoutOptions.vue +0 -172
  49. package/src/components/tek-grid/row/TekGridFooterRow.ts +0 -62
  50. package/src/components/tek-grid/row/TekGridFooterRow.vue +0 -64
  51. package/src/components/tek-grid/row/TekGridGroupRow.ts +0 -65
  52. package/src/components/tek-grid/row/TekGridGroupRow.vue +0 -65
  53. package/src/components/tek-user-info/TekUserInfo.ts +0 -51
  54. package/src/components/tek-user-info/TekUserInfo.vue +0 -53
  55. package/src/components/tek-user-info/TekUserInfoList.ts +0 -39
  56. package/src/components/tek-user-info/TekUserInfoList.vue +0 -12
  57. package/src/composables/useTableLayout.ts +0 -290
  58. package/src/shims-vue.d.ts +0 -6
  59. package/src/styles/index.scss +0 -0
  60. package/src/utils/isArrayOperation.ts +0 -5
  61. package/tsconfig.eslint.json +0 -9
  62. package/types/components/index.d.ts +0 -5
  63. package/types/components/public.d.ts +0 -9
  64. package/types/components/tek-breadcrumb-header/TekBreadcrumbHeader.d.ts +0 -1138
  65. package/types/components/tek-breadcrumb-header/TekBreadcrumbHeader.ts.d.ts +0 -1138
  66. package/types/components/tek-grid/TekGrid.d.ts +0 -7211
  67. package/types/components/tek-grid/TekGrid.ts.d.ts +0 -7211
  68. package/types/components/tek-grid/column-filter/TekGridColumnFilter.d.ts +0 -130
  69. package/types/components/tek-grid/column-filter/TekGridColumnFilter.ts.d.ts +0 -130
  70. package/types/components/tek-grid/column-header/TekGridHeaderRow.d.ts +0 -225
  71. package/types/components/tek-grid/column-header/TekGridHeaderRow.ts.d.ts +0 -225
  72. package/types/components/tek-grid/columns-button/TekGridColumnsButton.d.ts +0 -2432
  73. package/types/components/tek-grid/columns-button/TekGridColumnsButton.ts.d.ts +0 -2432
  74. package/types/components/tek-grid/filter-button/TekGridFilterButton.d.ts +0 -2920
  75. package/types/components/tek-grid/filter-button/TekGridFilterButton.ts.d.ts +0 -2920
  76. package/types/components/tek-grid/indentation/TekGridIndentation.d.ts +0 -32
  77. package/types/components/tek-grid/indentation/TekGridIndentation.ts.d.ts +0 -32
  78. package/types/components/tek-grid/layout-options/TekGridLayoutOptions.d.ts +0 -1893
  79. package/types/components/tek-grid/layout-options/TekGridLayoutOptions.ts.d.ts +0 -1893
  80. package/types/components/tek-grid/row/TekGridFooterRow.d.ts +0 -90
  81. package/types/components/tek-grid/row/TekGridFooterRow.ts.d.ts +0 -90
  82. package/types/components/tek-grid/row/TekGridGroupRow.d.ts +0 -87
  83. package/types/components/tek-grid/row/TekGridGroupRow.ts.d.ts +0 -87
  84. package/types/components/tek-user-info/TekUserInfo.d.ts +0 -1940
  85. package/types/components/tek-user-info/TekUserInfo.ts.d.ts +0 -1940
  86. package/types/components/tek-user-info/TekUserInfoList.d.ts +0 -1015
  87. package/types/components/tek-user-info/TekUserInfoList.ts.d.ts +0 -1015
@@ -1,3885 +0,0 @@
1
- import { ModalService, Icons } from '@zeedhi/common';
2
- import ZdUserInfoComponent, { ZdUserInfoProps } from '@zeedhi/zd-user-info-vue';
3
- import { BreadcrumbHeader, TekRestDatasource, TekGridColumn, TekFilterHelper, TekGrid, TekMemoryDatasource, TekGridColumnsButton, TekGridFilterButton, TekGridLayoutOptions, TekUserInfo, TekUserInfoList } from '@zeedhi/teknisa-components-common';
4
- import { defineComponent, resolveComponent, openBlock, createElementBlock, createVNode, mergeProps, withCtx, normalizeProps, guardReactiveProps, createElementVNode, Fragment, renderList, createBlock, resolveDynamicComponent, createCommentVNode, renderSlot, inject, computed, provide, nextTick, withDirectives, normalizeClass, normalizeStyle, createSlots, vShow, reactive, toDisplayString, ref, watch, createTextVNode, onMounted, isMemoSame, withModifiers } from 'vue';
5
- import { ZdComponentRenderProps, useCreateInstance, NotProvidedError, buildProps, ZdGridEditableProps, useGridEditableInstance, getRootElement, useGridColumns, ZdIterableColumnsButtonProps, useButtonInstance, ZdButtonProps, useGetMethods, ZdListProps } from '@zeedhi/vuetify';
6
- import { Utils, Config, Metadata, dayjs, Singleton, I18n, Loader } from '@zeedhi/core';
7
- import cloneDeep from 'lodash.clonedeep';
8
- import debounce from 'lodash.debounce';
9
- import sortable from 'sortablejs';
10
-
11
- const TekBreadcrumbHeaderProps$1 = Object.assign(Object.assign({}, ZdComponentRenderProps), { title: {
12
- type: String,
13
- default: '',
14
- }, breadcrumb: {
15
- type: Object,
16
- default: {},
17
- }, rightSlot: {
18
- type: Array,
19
- default: () => [],
20
- } });
21
- const breadcrumbHeaderComponent$1 = defineComponent({
22
- props: TekBreadcrumbHeaderProps$1,
23
- inheritAttrs: false,
24
- setup(props, ctx) {
25
- const { instance, root } = useCreateInstance(props, ctx, BreadcrumbHeader);
26
- return {
27
- instance,
28
- root,
29
- };
30
- },
31
- });
32
-
33
- const _hoisted_1$6 = ["id"];
34
- const _hoisted_2$3 = { class: "tek-breadcrumb-header-slot-right" };
35
- const _hoisted_3$1 = { key: 0 };
36
-
37
- function render$b(_ctx, _cache, $props, $setup, $data, $options) {
38
- const _component_zd_breadcrumbs = resolveComponent("zd-breadcrumbs");
39
- const _component_zd_text = resolveComponent("zd-text");
40
- const _component_v_col = resolveComponent("v-col");
41
-
42
- return (openBlock(), createElementBlock("div", {
43
- id: _ctx.instance.name,
44
- ref: "root",
45
- class: "tek-breadcrumb-header"
46
- }, [
47
- createVNode(_component_zd_breadcrumbs, mergeProps(_ctx.instance.breadcrumb, {
48
- theme: _ctx.instance.theme
49
- }), null, 16 /* FULL_PROPS */, ["theme"]),
50
- createVNode(_component_v_col, {
51
- class: "tek-breadcrumb-header-title-col",
52
- cols: "12"
53
- }, {
54
- default: withCtx(() => [
55
- createVNode(_component_zd_text, normalizeProps(guardReactiveProps({
56
- name: `${_ctx.instance.name}-title`,
57
- cssClass: 'tek-breadcrumb-header-title',
58
- text: _ctx.$t(_ctx.instance.title),
59
- })), null, 16 /* FULL_PROPS */),
60
- createElementVNode("span", _hoisted_2$3, [
61
- (_ctx.instance.rightSlot.length)
62
- ? (openBlock(), createElementBlock("span", _hoisted_3$1, [
63
- (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.instance.rightSlot, (child) => {
64
- return (openBlock(), createBlock(resolveDynamicComponent(child.component), mergeProps({ ref_for: true }, child, {
65
- key: child.name
66
- }), null, 16 /* FULL_PROPS */))
67
- }), 128 /* KEYED_FRAGMENT */))
68
- ]))
69
- : createCommentVNode("v-if", true),
70
- renderSlot(_ctx.$slots, "rightSlot")
71
- ])
72
- ]),
73
- _: 3 /* FORWARDED */
74
- })
75
- ], 8 /* PROPS */, _hoisted_1$6))
76
- }
77
-
78
- breadcrumbHeaderComponent$1.render = render$b;
79
- breadcrumbHeaderComponent$1.__file = "src/components/tek-breadcrumb-header/TekBreadcrumbHeader.vue";
80
-
81
- function useTableLayout() {
82
- const applyLayout = inject('applyLayout');
83
- const getColumnElements = inject('getColumnElements');
84
- const getTableWidth = inject('getTableWidth');
85
- if (!applyLayout) {
86
- throw new NotProvidedError('applyLayout');
87
- }
88
- if (!getColumnElements) {
89
- throw new NotProvidedError('getColumnElements');
90
- }
91
- if (!getTableWidth) {
92
- throw new NotProvidedError('getTableWidth');
93
- }
94
- return { applyLayout, getColumnElements, getTableWidth };
95
- }
96
- function provideTableLayout({ instance, rootEl, }) {
97
- var _a;
98
- const tableElement = (_a = rootEl.value) === null || _a === void 0 ? void 0 : _a.querySelector('table');
99
- const columnDictionary = computed(() => getColumnDictionary(instance.columns));
100
- const datasourceDynamicFilter = () => {
101
- const datasource = instance.datasource;
102
- if (datasource instanceof TekRestDatasource)
103
- return datasource.dynamicFilter;
104
- return {};
105
- };
106
- const getColumnDictionary = (columns) => {
107
- const columnDictionary = {};
108
- columns.forEach((column) => {
109
- columnDictionary[column.name] = column;
110
- });
111
- return columnDictionary;
112
- };
113
- const addMissingColumns = (layout) => {
114
- var _a;
115
- const layoutColumnNames = ((_a = layout.columns) === null || _a === void 0 ? void 0 : _a.map((column) => column.name)) || [];
116
- const columnNames = Object.keys(columnDictionary.value);
117
- columnNames.forEach((columnName) => {
118
- var _a;
119
- if (!layoutColumnNames.includes(columnName)) {
120
- (_a = layout.columns) === null || _a === void 0 ? void 0 : _a.push(columnDictionary.value[columnName]);
121
- }
122
- });
123
- };
124
- const setHelperValue = (column, value) => {
125
- if (column instanceof TekGridColumn) {
126
- if (!Array.isArray(column.filterProps) && typeof value === 'string') {
127
- column.filterProps.helperValue = value;
128
- }
129
- else if (Array.isArray(column.filterProps) && Array.isArray(value)) {
130
- column.filterProps.forEach((prop, index) => {
131
- prop.value = value[index];
132
- });
133
- }
134
- }
135
- };
136
- const getHelperValues = (dynamicFilter, columns) => {
137
- const filter = cloneDeep(dynamicFilter);
138
- Object.keys(filter).forEach((columnName) => {
139
- const filterOptions = filter[columnName];
140
- const column = columns[columns.findIndex((col) => col.name === columnName)];
141
- const { filterHelperValue } = column;
142
- filterOptions.forEach((item) => {
143
- if (['IN', 'NOT_IN', 'BETWEEN'].includes(item.operation) && !Array.isArray(item.value)) {
144
- item.value = item.value.split(';');
145
- }
146
- let helperValue = '';
147
- if (!Array.isArray(filterHelperValue)) {
148
- helperValue = filterHelperValue;
149
- }
150
- else {
151
- Object.keys(filterHelperValue).forEach((key) => {
152
- const value = filterHelperValue[key] || '';
153
- if (`${item.relation || 'AND'}-${item.operation || 'CONTAINS'}` === key) {
154
- helperValue = value;
155
- }
156
- });
157
- }
158
- if (helperValue) {
159
- const columnObj = instance.getColumn(column.name);
160
- item.value = TekFilterHelper.getValue(helperValue, columnObj);
161
- }
162
- });
163
- });
164
- return filter;
165
- };
166
- /**
167
- * Applies the default grid layout
168
- * @returns a boolean to indicate whether the group parameters changed
169
- */
170
- const applyDefaultLayout = (defaultLayout) => {
171
- let groupParamsChanged = false;
172
- instance.datasource.order = [...defaultLayout.originalDatasourceOrder];
173
- instance.datasource.filter = Object.assign({}, defaultLayout.originalDatasourceFilter);
174
- if (instance.datasource instanceof TekRestDatasource) {
175
- instance.datasource.dynamicFilter = getHelperValues(defaultLayout.originalDatasourceDynamicFilter, defaultLayout.originalColumnProps);
176
- }
177
- instance.columns = defaultLayout.originalColumnProps.map((defaultColumn) => {
178
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
179
- const col = columnDictionary.value[defaultColumn.name];
180
- groupParamsChanged =
181
- groupParamsChanged ||
182
- col.grouped !== defaultColumn.grouped ||
183
- col.groupOpened !== defaultColumn.groupOpened ||
184
- col.aggregation !== defaultColumn.aggregation;
185
- col.isVisible = (_a = defaultColumn.isVisible) !== null && _a !== void 0 ? _a : col.isVisible;
186
- col.label = (_b = defaultColumn.label) !== null && _b !== void 0 ? _b : col.label;
187
- col.align = (_c = defaultColumn.align) !== null && _c !== void 0 ? _c : col.align;
188
- col.fixed = (_d = defaultColumn.fixed) !== null && _d !== void 0 ? _d : col.fixed;
189
- col.grouped = (_e = defaultColumn.grouped) !== null && _e !== void 0 ? _e : col.grouped;
190
- col.groupOpened = (_f = defaultColumn.groupOpened) !== null && _f !== void 0 ? _f : col.groupOpened;
191
- col.aggregation = (_g = defaultColumn.aggregation) !== null && _g !== void 0 ? _g : col.aggregation;
192
- col.minWidth = (_h = defaultColumn.minWidth) !== null && _h !== void 0 ? _h : col.minWidth;
193
- col.maxWidth = (_j = defaultColumn.maxWidth) !== null && _j !== void 0 ? _j : col.maxWidth;
194
- col.width = (_k = defaultColumn.width) !== null && _k !== void 0 ? _k : col.width;
195
- setHelperValue(col, defaultColumn.filterHelperValue || '');
196
- return col;
197
- });
198
- if (tableElement) {
199
- tableElement.style.width = '100%';
200
- const columnElements = Array.from(tableElement.querySelectorAll('tr th:not(.selectable)'));
201
- columnElements.forEach((item) => {
202
- item.style.width = 'unset';
203
- });
204
- }
205
- return groupParamsChanged;
206
- };
207
- const applyNewLayout = (layout, changeLayoutCallback) => {
208
- var _a;
209
- const gridColumnNames = Object.keys(columnDictionary.value);
210
- let layoutChanged = false;
211
- // removes columns that are in the layout but not in grid
212
- layout.columns = (_a = layout.columns) === null || _a === void 0 ? void 0 : _a.filter((column) => {
213
- const isInGrid = gridColumnNames.includes(column.name);
214
- if (!isInGrid)
215
- layoutChanged = true;
216
- return isInGrid;
217
- });
218
- if (layoutChanged) {
219
- changeLayoutCallback(layout);
220
- }
221
- if (tableElement)
222
- tableElement.style.width = layout.gridWidth || 'auto';
223
- instance.datasource.order = layout.order !== undefined ? layout.order : instance.datasource.order;
224
- instance.datasource.filter = layout.filter !== undefined ? layout.filter : instance.datasource.filter;
225
- if (instance.datasource instanceof TekRestDatasource && layout.dynamicFilter !== undefined) {
226
- instance.datasource.dynamicFilter = getHelperValues(layout.dynamicFilter, layout.columns || instance.columns);
227
- }
228
- if (layout.columns) {
229
- instance.columns = layout.columns.map((column) => {
230
- const col = columnDictionary.value[column.name];
231
- col.label = column.label !== undefined ? column.label : col.label;
232
- col.align = column.align !== undefined ? column.align : col.align;
233
- col.isVisible = column.isVisible !== undefined ? column.isVisible : col.isVisible;
234
- col.fixed = !!column.fixed;
235
- col.grouped = !!column.grouped;
236
- col.groupOpened = !!column.groupOpened;
237
- col.aggregation = column.aggregation;
238
- col.minWidth = column.minWidth || '';
239
- col.maxWidth = column.maxWidth || '';
240
- col.width = column.width;
241
- setHelperValue(col, column.filterHelperValue || '');
242
- return col;
243
- });
244
- // wait to change column orders
245
- nextTick(() => {
246
- gridColumnNames.forEach((_key, index) => {
247
- const columnElement = tableElement === null || tableElement === void 0 ? void 0 : tableElement.querySelector(`tr th:not(.selectable)[index="${index}"]`);
248
- if (columnElement) {
249
- columnElement.style.width = layout.columns[index].width || 'unset';
250
- }
251
- });
252
- });
253
- }
254
- };
255
- const applyLayout = ({ layout, defaultLayout, changeLayoutCallback, }) => {
256
- const oldOrder = instance.datasource.order;
257
- const oldFilter = instance.datasource.filter;
258
- const oldDynamicFilter = datasourceDynamicFilter();
259
- let groupParamsChanged = false;
260
- if (layout) {
261
- addMissingColumns(layout);
262
- applyNewLayout(layout, changeLayoutCallback);
263
- }
264
- else {
265
- groupParamsChanged = applyDefaultLayout(defaultLayout);
266
- }
267
- if ((!Utils.isEqual(instance.datasource.order, oldOrder) ||
268
- !Utils.isEqual(instance.datasource.filter, oldFilter) ||
269
- !Utils.isEqual(datasourceDynamicFilter(), oldDynamicFilter)) &&
270
- !groupParamsChanged) {
271
- // Se os parametros de agrupamento tiverem sido alterados um get é feito automaticamente
272
- instance.loadAfterTasks();
273
- }
274
- };
275
- const getColumnElements = () => {
276
- const elementDict = {};
277
- const columnElements = (tableElement === null || tableElement === void 0 ? void 0 : tableElement.querySelectorAll('tr th:not(.selectable)[index]')) || [];
278
- columnElements.forEach((el) => {
279
- const index = el.getAttribute('index');
280
- if (index === null)
281
- return;
282
- elementDict[index] = el;
283
- });
284
- return elementDict;
285
- };
286
- const getTableWidth = () => {
287
- return tableElement ? window.getComputedStyle(tableElement).width : 'auto';
288
- };
289
- provide('applyLayout', applyLayout);
290
- provide('getColumnElements', getColumnElements);
291
- provide('getTableWidth', getTableWidth);
292
- }
293
-
294
- const TekGridProps$1 = buildProps(Object.assign(Object.assign({}, ZdGridEditableProps), { toolbarSlot: {
295
- type: Array,
296
- default: undefined,
297
- }, title: {
298
- type: String,
299
- default: '',
300
- }, addButton: {
301
- type: [Boolean, String],
302
- default: false,
303
- }, deleteButton: {
304
- type: [String, Boolean],
305
- default: 'none',
306
- }, columnsButton: {
307
- type: [Boolean, String],
308
- default: false,
309
- }, columnsButtonIgnore: {
310
- type: [Array, String],
311
- default: () => [],
312
- }, showEditButtons: {
313
- type: [Boolean, String],
314
- default: true,
315
- }, filterButton: {
316
- type: [Boolean, String],
317
- default: false,
318
- }, modalFilterProps: {
319
- type: Object,
320
- default: () => ({}),
321
- }, showSearch: {
322
- type: [Boolean, String],
323
- default: true,
324
- }, columnFilterButton: {
325
- type: [Boolean, String],
326
- default: false,
327
- }, hideActions: {
328
- type: [Boolean, String],
329
- default: false,
330
- }, actions: {
331
- type: Array,
332
- default: () => [],
333
- }, dragColumns: {
334
- type: [Boolean, String],
335
- default: true,
336
- }, resizeColumns: {
337
- type: [Boolean, String],
338
- default: true,
339
- }, showLayoutOptions: {
340
- type: [Boolean, String],
341
- default: true,
342
- }, showExport: {
343
- type: [String, Boolean],
344
- default: false,
345
- }, showReload: {
346
- type: [Boolean, String],
347
- default: true,
348
- }, exportConfig: {
349
- type: Array,
350
- }, exportActions: {
351
- type: Array,
352
- }, groupsOpened: {
353
- type: [Boolean, String],
354
- default: false,
355
- }, showSummaryTotal: {
356
- type: [Boolean, String],
357
- default: true,
358
- }, mainGrid: {
359
- type: [Boolean, String],
360
- default: true,
361
- }, xlsDefaultType: {
362
- type: String,
363
- default: undefined,
364
- }, showCheckboxAllFilter: {
365
- type: [Boolean, String],
366
- default: Config.gridShowCheckboxAllFilter,
367
- }, toolbarOpened: {
368
- type: [Boolean],
369
- default: true,
370
- }, defaultFilter: {
371
- type: Object,
372
- }, reportTitle: {
373
- type: String,
374
- }, editNewRowsOnly: {
375
- type: [Boolean, String],
376
- default: false,
377
- } }));
378
- const gridEditableComponent$1 = defineComponent({
379
- props: TekGridProps$1,
380
- inheritAttrs: false,
381
- setup(props, ctx) {
382
- const { instance, root } = useCreateInstance(props, ctx, TekGrid);
383
- const renderedData = computed(() => {
384
- if (instance.isGrouped()) {
385
- return instance.getGroupedData();
386
- }
387
- return instance.getData();
388
- });
389
- const visibleData = computed(() => {
390
- return renderedData.value.filter((row) => instance.isItemVisible(row));
391
- });
392
- const gridEditableScope = useGridEditableInstance({ instance, root, renderedData: visibleData });
393
- const rootEl = getRootElement(root);
394
- const { visibleColumns } = useGridColumns({
395
- instance,
396
- rootEl,
397
- visibilityCondition: (column) => column.isVisible && !column.grouped,
398
- });
399
- provideTableLayout({ instance, rootEl });
400
- const debouncedDatasourceGet = debounce((instance) => {
401
- const event = new Event('change', { cancelable: true });
402
- instance.callEvent('beforeApplyFilter', { component: instance, event });
403
- if (event.defaultPrevented)
404
- return;
405
- const { datasource } = instance;
406
- if (datasource instanceof TekRestDatasource || datasource instanceof TekMemoryDatasource) {
407
- datasource.updateDynamicFilter();
408
- }
409
- else {
410
- datasource.get();
411
- }
412
- }, 500);
413
- const filter = computed(() => {
414
- if (instance.datasource instanceof TekRestDatasource || instance.datasource instanceof TekMemoryDatasource) {
415
- return instance.datasource.dynamicFilter;
416
- }
417
- const datasourceFilter = instance.datasource.filter;
418
- const simpleFilter = {};
419
- Object.keys(datasourceFilter).forEach((key) => {
420
- simpleFilter[key] = [{ relation: 'AND', operation: 'CONTAINS', value: datasourceFilter[key] }];
421
- });
422
- return simpleFilter;
423
- });
424
- const setFilter = (newFilter) => {
425
- if (Utils.isEqual(filter, newFilter))
426
- return;
427
- if (instance.datasource instanceof TekRestDatasource || instance.datasource instanceof TekMemoryDatasource) {
428
- instance.datasource.dynamicFilter = cloneDeep(newFilter);
429
- }
430
- else {
431
- const normalFilter = {};
432
- Object.keys(newFilter).forEach((key) => {
433
- if (!newFilter[key][0].value)
434
- return;
435
- normalFilter[key] = newFilter[key][0].value;
436
- });
437
- instance.datasource.filter = normalFilter;
438
- }
439
- debouncedDatasourceGet(instance);
440
- instance.changeLayout();
441
- };
442
- const columnHasFilter = (columnName) => {
443
- return instance.columnHasFilter(columnName);
444
- };
445
- const isRowVisible = (row, index) => {
446
- return instance.isItemVisible(row) && gridEditableScope.shouldRender(index);
447
- };
448
- const isCurrentRowGroup = (row) => {
449
- const { uniqueKey, currentRow } = instance.datasource;
450
- return !!((row.group && row.groupValue === currentRow.groupValue) ||
451
- (row[uniqueKey] && row[uniqueKey] === currentRow[uniqueKey]));
452
- };
453
- const isGroupSelectIndeterminate = (item) => {
454
- let hasSelected = false;
455
- let hasNotSelected = false;
456
- const { uniqueKey } = instance.datasource;
457
- item.children.forEach((child) => {
458
- const idx = instance.selectedRows.findIndex((row) => child[uniqueKey] === row[uniqueKey]);
459
- hasSelected = hasSelected || idx !== -1;
460
- hasNotSelected = hasNotSelected || idx === -1;
461
- });
462
- return hasSelected && hasNotSelected;
463
- };
464
- const isGroupSelected = (item) => {
465
- return item.children.every((child) => {
466
- const { uniqueKey } = instance.datasource;
467
- const idx = instance.selectedRows.findIndex((row) => child[uniqueKey] === row[uniqueKey]);
468
- return idx !== -1;
469
- });
470
- };
471
- const selectGroupRowClick = (row, isSelected, event) => {
472
- nextTick(() => {
473
- const rootElement = getRootElement(root);
474
- instance.selectGroupClick(row, isSelected, event, rootElement.value);
475
- });
476
- };
477
- const selectGroup = (item, event) => {
478
- const { uniqueKey } = instance.datasource;
479
- const isSelected = isGroupSelected(item);
480
- if (!isSelected) {
481
- // here we fetch the item from renderedData because vuetify isSelected checks for object reference
482
- // so we need to find the item inside renderedData to call selectRow() with the correct reference
483
- // https://github.com/vuetifyjs/vuetify/blob/master/packages/vuetify/src/components/VDataTable/composables/select.ts#L128
484
- const items = item.children.map((child) => {
485
- return renderedData.value.find((row) => child[uniqueKey] === row[uniqueKey]);
486
- });
487
- items.forEach((child) => {
488
- if (!child)
489
- return;
490
- const idx = instance.selectedRows.findIndex((row) => child[uniqueKey] === row[uniqueKey]);
491
- if (idx === -1) {
492
- instance.selectRow(child, true);
493
- }
494
- });
495
- }
496
- else {
497
- item.children.forEach((child) => {
498
- const idx = instance.selectedRows.findIndex((row) => child[uniqueKey] === row[uniqueKey]);
499
- if (idx !== -1) {
500
- instance.selectRow(child, false);
501
- }
502
- });
503
- }
504
- selectGroupRowClick(item, !isSelected, event);
505
- };
506
- const openGroup = (item) => {
507
- instance.openGroup(item);
508
- };
509
- const isGroup = (item) => {
510
- return !!item.group;
511
- };
512
- const isFooter = (item) => {
513
- return !!item.groupFooter;
514
- };
515
- const groupColumnNames = computed(() => {
516
- return instance.columns.filter((column) => column.grouped).map((column) => column.name) || [];
517
- });
518
- return Object.assign(Object.assign({}, gridEditableScope), { instance,
519
- root,
520
- filter,
521
- setFilter,
522
- columnHasFilter,
523
- visibleColumns,
524
- isRowVisible,
525
- isCurrentRowGroup,
526
- isGroupSelectIndeterminate,
527
- selectGroup,
528
- isGroup,
529
- openGroup,
530
- renderedData,
531
- isGroupSelected,
532
- groupColumnNames,
533
- isFooter,
534
- visibleData });
535
- },
536
- });
537
-
538
- const _hoisted_1$5 = ["colspan"];
539
- const _hoisted_2$2 = ["colspan"];
540
-
541
- function render$a(_ctx, _cache, $props, $setup, $data, $options) {
542
- const _component_zd_grid_toolbar = resolveComponent("zd-grid-toolbar");
543
- const _component_tek_grid_header_row = resolveComponent("tek-grid-header-row");
544
- const _component_tek_grid_group_row = resolveComponent("tek-grid-group-row");
545
- const _component_tek_grid_indentation = resolveComponent("tek-grid-indentation");
546
- const _component_zd_grid_editable_row = resolveComponent("zd-grid-editable-row");
547
- const _component_tek_grid_footer_row = resolveComponent("tek-grid-footer-row");
548
- const _component_zd_iterable_no_data = resolveComponent("zd-iterable-no-data");
549
- const _component_zd_grid_footer = resolveComponent("zd-grid-footer");
550
- const _component_v_data_table = resolveComponent("v-data-table");
551
-
552
- return withDirectives((openBlock(), createBlock(_component_v_data_table, {
553
- ref: "root",
554
- id: _ctx.instance.name,
555
- modelValue: _ctx.selectedRows,
556
- "onUpdate:modelValue": _cache[12] || (_cache[12] = $event => ((_ctx.selectedRows) = $event)),
557
- class: normalizeClass([
558
- 'zd-grid',
559
- 'tek-grid',
560
- 'zd-grid-editable',
561
- _ctx.instance.cssClass,
562
- {
563
- 'zd-grid--loading': _ctx.instance.datasource.loading,
564
- 'zd-grid--cell-selection': _ctx.instance.cellSelection,
565
- },
566
- ]),
567
- style: normalizeStyle([
568
- _ctx.cssColorVars,
569
- {
570
- height: _ctx.$formatSize(_ctx.instance.height),
571
- width: _ctx.$formatSize(_ctx.instance.width),
572
- maxHeight: _ctx.$formatSize(_ctx.instance.maxHeight),
573
- minHeight: _ctx.$formatSize(_ctx.instance.minHeight),
574
- maxWidth: _ctx.$formatSize(_ctx.instance.maxWidth),
575
- minWidth: _ctx.$formatSize(_ctx.instance.minWidth),
576
- },
577
- _ctx.$styleObject(_ctx.instance.cssStyle),
578
- ]),
579
- theme: _ctx.instance.theme,
580
- "sort-asc-icon": "$collapse",
581
- "sort-desc-icon": "$expand",
582
- "fixed-header": "",
583
- "multi-sort": "",
584
- "hide-default-footer": "",
585
- name: _ctx.instance.name,
586
- headers: _ctx.headers,
587
- items: _ctx.renderedData,
588
- search: _ctx.instance.datasource.search,
589
- density: _ctx.instance.dense ? 'compact' : 'default',
590
- loading: _ctx.instance.datasource.loading,
591
- "item-value": _ctx.instance.datasource.uniqueKey,
592
- "items-per-page": -1,
593
- "no-filter": "",
594
- "sort-by": _ctx.sortBy,
595
- "disable-sort": "",
596
- "return-object": "",
597
- tabindex: "0",
598
- "onUpdate:sortBy": _cache[13] || (_cache[13] = $event => (_ctx.updateSortBy($event)))
599
- }, createSlots({
600
- top: withCtx(() => [
601
- (!_ctx.hasToolbarSlot)
602
- ? (openBlock(), createBlock(_component_zd_grid_toolbar, { key: 0 }))
603
- : createCommentVNode("v-if", true),
604
- renderSlot(_ctx.$slots, "toolbarSlot")
605
- ]),
606
- headers: withCtx(({ columns: tableColumns, isSorted, getSortIcon, toggleSort, sortBy }) => [
607
- (_ctx.instance.showHeader)
608
- ? (openBlock(), createBlock(_component_tek_grid_header_row, {
609
- key: 0,
610
- name: _ctx.instance.name,
611
- selectable: _ctx.instance.selectable,
612
- headerBackground: _ctx.instance.headerBackground,
613
- showSelectAll: _ctx.instance.showSelectAll,
614
- allselectedState: _ctx.allselectedState,
615
- visibleColumns: _ctx.visibleColumns,
616
- dragColumns: _ctx.instance.dragColumns,
617
- headerCellTextColor: _ctx.instance.headerCellTextColor,
618
- resizeColumns: _ctx.instance.resizeColumns,
619
- getSortIcon: getSortIcon,
620
- toggleSort: toggleSort,
621
- sortBy: sortBy,
622
- tableColumns: tableColumns,
623
- isSorted: isSorted,
624
- disableCheckbox: _ctx.instance.editing,
625
- instanceName: _ctx.instance.name,
626
- filterRelationsDatasource: _ctx.instance.filterRelationsDatasource,
627
- filterOperationsDatasource: _ctx.instance.filterOperationsDatasource,
628
- modelValue: _ctx.filter,
629
- columnFilterButton: _ctx.instance.columnFilterButton,
630
- columnHasFilter: _ctx.columnHasFilter,
631
- level: _ctx.groupColumnNames.length,
632
- "onUpdate:modelValue": _cache[0] || (_cache[0] = $event => (_ctx.setFilter($event))),
633
- onResizeMousedown: _cache[1] || (_cache[1] = $event => (_ctx.resizeMouseDownHandler($event.column, $event.event))),
634
- onResizeClick: _cache[2] || (_cache[2] = $event => (_ctx.resizeClickHandler($event.event))),
635
- onSelectAllClick: _cache[3] || (_cache[3] = $event => (_ctx.selectAllClick($event)))
636
- }, null, 8 /* PROPS */, ["name", "selectable", "headerBackground", "showSelectAll", "allselectedState", "visibleColumns", "dragColumns", "headerCellTextColor", "resizeColumns", "getSortIcon", "toggleSort", "sortBy", "tableColumns", "isSorted", "disableCheckbox", "instanceName", "filterRelationsDatasource", "filterOperationsDatasource", "modelValue", "columnFilterButton", "columnHasFilter", "level"]))
637
- : createCommentVNode("v-if", true)
638
- ]),
639
- "no-data": withCtx(() => [
640
- createVNode(_component_zd_iterable_no_data, null, {
641
- errorSlot: withCtx(() => [
642
- renderSlot(_ctx.$slots, "errorSlot")
643
- ]),
644
- noResultSlot: withCtx(() => [
645
- renderSlot(_ctx.$slots, "noResultSlot")
646
- ]),
647
- noDataSlot: withCtx(() => [
648
- renderSlot(_ctx.$slots, "noDataSlot")
649
- ]),
650
- _: 3 /* FORWARDED */
651
- })
652
- ]),
653
- bottom: withCtx(() => [
654
- (_ctx.instance.showFooter && !_ctx.hasFooterSlot)
655
- ? (openBlock(), createBlock(_component_zd_grid_footer, { key: 0 }))
656
- : createCommentVNode("v-if", true),
657
- renderSlot(_ctx.$slots, "footerSlot")
658
- ]),
659
- _: 2 /* DYNAMIC */
660
- }, [
661
- (_ctx.addTopPadding())
662
- ? {
663
- name: "body.prepend",
664
- fn: withCtx(({ headers }) => [
665
- createElementVNode("tr", null, [
666
- createElementVNode("td", {
667
- colspan: headers.length,
668
- style: normalizeStyle(`padding-top:${_ctx.scrollData.startHeight}px`)
669
- }, null, 12 /* STYLE, PROPS */, _hoisted_1$5)
670
- ])
671
- ]),
672
- key: "0"
673
- }
674
- : undefined,
675
- (_ctx.addBottomPadding())
676
- ? {
677
- name: "body.append",
678
- fn: withCtx(({ headers }) => [
679
- createElementVNode("tr", null, [
680
- createElementVNode("td", {
681
- colspan: headers.length,
682
- style: normalizeStyle(`padding-top:${_ctx.scrollData.endHeight}px`)
683
- }, null, 12 /* STYLE, PROPS */, _hoisted_2$2)
684
- ])
685
- ]),
686
- key: "1"
687
- }
688
- : undefined,
689
- (_ctx.instance.datasource.data.length)
690
- ? {
691
- name: "body",
692
- fn: withCtx(({ internalItems, isSelected }) => [
693
- (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.visibleData, (item, i) => {
694
- return (openBlock(), createElementBlock(Fragment, null, [
695
- (_ctx.isRowVisible(item, i))
696
- ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
697
- (_ctx.isGroup(item))
698
- ? (openBlock(), createBlock(_component_tek_grid_group_row, {
699
- key: item.groupColumnName + item.groupValue,
700
- row: item,
701
- "is-current-row": _ctx.isCurrentRowGroup(item),
702
- selectable: _ctx.instance.selectable,
703
- selectionDisabled: _ctx.instance.callDisableSelection(item),
704
- cellSelection: _ctx.instance.cellSelection,
705
- "is-current": _ctx.isCurrent,
706
- isSelected: _ctx.isGroupSelected(item),
707
- indeterminate: _ctx.isGroupSelectIndeterminate(item),
708
- onClick: $event => (_ctx.rowClick(item, $event)),
709
- onCheckboxClick: $event => (_ctx.selectGroup(item, $event)),
710
- onFocusin: _cache[4] || (_cache[4] = $event => (_ctx.cellFocusIn($event))),
711
- onExpandClick: $event => (_ctx.openGroup(item))
712
- }, null, 8 /* PROPS */, ["row", "is-current-row", "selectable", "selectionDisabled", "cellSelection", "is-current", "isSelected", "indeterminate", "onClick", "onCheckboxClick", "onExpandClick"]))
713
- : (!_ctx.isFooter(item))
714
- ? (openBlock(), createBlock(_component_zd_grid_editable_row, {
715
- key: _ctx.instance.getRowKey(item),
716
- isSelected: isSelected(internalItems[i]),
717
- isCurrentRow: _ctx.isCurrentRow(item),
718
- selectable: _ctx.instance.selectable,
719
- selectionDisabled: _ctx.instance.callDisableSelection(item),
720
- cellSelection: _ctx.instance.cellSelection,
721
- isCurrent: _ctx.isCurrent,
722
- columns: _ctx.visibleColumns,
723
- row: item,
724
- fixedLeft: _ctx.fixedLeft,
725
- fixedRight: _ctx.fixedRight,
726
- isEditing: _ctx.isEditing,
727
- onCellFocus: _cache[5] || (_cache[5] = $event => (_ctx.cellFocus($event))),
728
- onCellClick: _cache[6] || (_cache[6] = $event => (_ctx.cellClick($event))),
729
- onClick: $event => (_ctx.rowClick(item, $event)),
730
- onFocusin: _cache[7] || (_cache[7] = $event => (_ctx.cellFocusIn($event))),
731
- onCheckboxClick: $event => (_ctx.selectRowClick(item, !isSelected(internalItems[i]), $event)),
732
- onCellEnterEdit: _cache[8] || (_cache[8] = $event => (_ctx.cellEnterEdit($event))),
733
- onCellKeydown: _cache[9] || (_cache[9] = $event => (_ctx.cellKeydown($event)))
734
- }, {
735
- "cell-prepend": withCtx(({ index }) => [
736
- (index === 0 && _ctx.groupColumnNames.length > 0)
737
- ? (openBlock(), createBlock(_component_tek_grid_indentation, {
738
- key: 0,
739
- level: item.groupHeaders?.length
740
- }, null, 8 /* PROPS */, ["level"]))
741
- : createCommentVNode("v-if", true)
742
- ]),
743
- _: 2 /* DYNAMIC */
744
- }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["isSelected", "isCurrentRow", "selectable", "selectionDisabled", "cellSelection", "isCurrent", "columns", "row", "fixedLeft", "fixedRight", "isEditing", "onClick", "onCheckboxClick"]))
745
- : (openBlock(), createBlock(_component_tek_grid_footer_row, {
746
- key: 'footer' + item.groupColumnName + item.groupValue,
747
- isSelected: isSelected(internalItems[i]),
748
- selectable: _ctx.instance.selectable,
749
- selectionDisabled: _ctx.instance.callDisableSelection(item),
750
- cellSelection: _ctx.instance.cellSelection,
751
- isCurrent: _ctx.isCurrent,
752
- columns: _ctx.visibleColumns,
753
- row: item,
754
- fixedLeft: _ctx.fixedLeft,
755
- fixedRight: _ctx.fixedRight,
756
- onCellFocus: _cache[10] || (_cache[10] = $event => (_ctx.cellFocus($event))),
757
- onFocusin: _cache[11] || (_cache[11] = $event => (_ctx.cellFocusIn($event)))
758
- }, null, 8 /* PROPS */, ["isSelected", "selectable", "selectionDisabled", "cellSelection", "isCurrent", "columns", "row", "fixedLeft", "fixedRight"]))
759
- ], 64 /* STABLE_FRAGMENT */))
760
- : createCommentVNode("v-if", true)
761
- ], 64 /* STABLE_FRAGMENT */))
762
- }), 256 /* UNKEYED_FRAGMENT */))
763
- ]),
764
- key: "2"
765
- }
766
- : undefined
767
- ]), 1032 /* PROPS, DYNAMIC_SLOTS */, ["id", "modelValue", "class", "style", "theme", "name", "headers", "items", "search", "density", "loading", "item-value", "sort-by"])), [
768
- [vShow, _ctx.instance.isVisible]
769
- ])
770
- }
771
-
772
- gridEditableComponent$1.render = render$a;
773
- gridEditableComponent$1.__file = "src/components/tek-grid/TekGrid.vue";
774
-
775
- const isArrayOperation = (operation) => {
776
- return ['IN', 'NOT_IN', 'BETWEEN'].includes(operation);
777
- };
778
-
779
- const TekGridColumnFilterProps$1 = {
780
- hasFilterData: {
781
- type: Boolean,
782
- default: false,
783
- },
784
- column: {
785
- type: Object,
786
- required: true,
787
- },
788
- modelValue: {
789
- type: Array,
790
- default: [],
791
- },
792
- instanceName: {
793
- type: String,
794
- required: true,
795
- },
796
- filterRelationsDatasource: {
797
- type: [Object, null],
798
- required: false,
799
- },
800
- filterOperationsDatasource: {
801
- type: [Object, null],
802
- required: false,
803
- },
804
- isHovering: {
805
- type: Boolean,
806
- default: false,
807
- },
808
- multiple: {
809
- type: Boolean,
810
- required: true,
811
- },
812
- };
813
- const tekGridColumnFilter$1 = defineComponent({
814
- props: TekGridColumnFilterProps$1,
815
- inheritAttrs: false,
816
- emits: ['update:modelValue'],
817
- setup(props, ctx) {
818
- const getValueInputName = (index) => `${props.instanceName}-${props.column.name}-filter-value-${index}`;
819
- const focusValueInput = (index) => {
820
- const valueInputName = getValueInputName(index);
821
- const input = Metadata.getInstance(valueInputName);
822
- input.setFocus();
823
- };
824
- const createNewFilter = () => {
825
- return reactive({
826
- operation: 'CONTAINS',
827
- relation: 'AND',
828
- value: undefined,
829
- });
830
- };
831
- let newFilter = createNewFilter();
832
- const convertToDateFormat = (value, revert) => {
833
- const dateFormat = props.column.componentProps.dateFormat || Config.dateFormat;
834
- const displayFormat = props.column.componentProps.displayFormat || Config.displayFormat;
835
- if (revert) {
836
- if (dayjs(value, displayFormat).isValid() || !dayjs(value, dateFormat).isValid()) {
837
- return value;
838
- }
839
- return dayjs(value, dateFormat).format(displayFormat);
840
- }
841
- if (dayjs(value, dateFormat).isValid() || !dayjs(value, displayFormat).isValid()) {
842
- return value;
843
- }
844
- return dayjs(value, displayFormat).format(dateFormat);
845
- };
846
- const checkDateValueFormat = (value, revert = false) => {
847
- if (!['ZdDate', 'ZdDateRange'].includes(props.column.componentProps.component))
848
- return value;
849
- if (Array.isArray(value)) {
850
- return value.map((item) => convertToDateFormat(item, revert));
851
- }
852
- return convertToDateFormat(value, revert);
853
- };
854
- // use WeakMap to avoid memory leaks
855
- const idMap = new WeakMap();
856
- let idCounter = 0;
857
- // retrieves a unique id for each item
858
- const getId = (item) => {
859
- if (!idMap.has(item)) {
860
- idMap.set(item, `__item__${idCounter++}`);
861
- }
862
- return idMap.get(item);
863
- };
864
- // use computed to generate unique ids for each filter item
865
- // this is needed for the v-for :key updates
866
- const modelWithIds = computed(() => {
867
- if (!props.multiple) {
868
- if (props.modelValue.length > 0) {
869
- return [{ id: getId(props.modelValue[0]), item: props.modelValue[0] }];
870
- }
871
- return [{ id: getId(newFilter), item: newFilter }];
872
- }
873
- return [...props.modelValue, newFilter].map((item) => ({
874
- id: getId(item),
875
- item,
876
- }));
877
- });
878
- const debounceUpdateModel = debounce((modelValue) => {
879
- if (Utils.isEqual(modelValue, props.modelValue))
880
- return;
881
- ctx.emit('update:modelValue', modelValue);
882
- newFilter = createNewFilter();
883
- }, 500);
884
- const changeRelation = (index, { component }) => {
885
- const modelValue = cloneDeep(props.modelValue);
886
- const isNewFilter = index === modelValue.length;
887
- const filter = isNewFilter ? newFilter : modelValue[index];
888
- const { value } = component;
889
- focusValueInput(index);
890
- // update item type value
891
- filter.relation = value;
892
- if (isNewFilter)
893
- return;
894
- debounceUpdateModel(modelValue);
895
- };
896
- const changeOperation = (index, { component }) => {
897
- const modelValue = cloneDeep(props.modelValue);
898
- const filterItem = modelValue[index];
899
- const isNewFilter = index === modelValue.length;
900
- const filter = isNewFilter ? newFilter : filterItem;
901
- const { value } = component;
902
- focusValueInput(index);
903
- // if operation is IN, NOT_IN or BETWEEN, value should be an array
904
- if (isArrayOperation(value)) {
905
- filter.value = Array.isArray(filterItem.value) ? filterItem.value : [filterItem.value];
906
- }
907
- // update item type value
908
- filter.operation = value;
909
- if (isNewFilter)
910
- return;
911
- debounceUpdateModel(modelValue);
912
- };
913
- const changeValue = (item, index, { component }) => {
914
- const modelValue = cloneDeep(props.modelValue);
915
- const filter = cloneDeep(item);
916
- const { value } = component;
917
- const isNewFilter = props.multiple && index === modelValue.length;
918
- let formattedValue = value;
919
- if (value && isArrayOperation(filter.operation)) {
920
- formattedValue = value.split(';');
921
- }
922
- filter.value = checkDateValueFormat(formattedValue);
923
- if (!props.multiple) {
924
- debounceUpdateModel([filter]);
925
- return;
926
- }
927
- if (isNewFilter) {
928
- // only emit event when newFilter has value
929
- if (!filter.value)
930
- return;
931
- debounceUpdateModel([...modelValue, filter]);
932
- return;
933
- }
934
- if (!filter.value) {
935
- // when removing the last (not new) filter, should pass its operation and relation to the new filter
936
- if (index === modelValue.length - 1) {
937
- newFilter.operation = filter.operation;
938
- newFilter.relation = filter.relation;
939
- }
940
- modelValue.splice(index, 1);
941
- // if the removed filter was the first, should set the new first relation to AND
942
- if (modelValue.length > 0 && index === 0) {
943
- modelValue[0].relation = 'AND';
944
- }
945
- // if the removed filter was the last, should set the newFilter relation to AND
946
- if (modelValue.length === 0) {
947
- newFilter.relation = 'AND';
948
- }
949
- }
950
- debounceUpdateModel(modelValue);
951
- };
952
- const getComponentType = (operation) => {
953
- return isArrayOperation(operation) ? 'ZdTextInput' : props.column.componentProps.component;
954
- };
955
- const getComponentHint = (operation) => {
956
- return isArrayOperation(operation) ? 'TEKGRID_MULTIPLE_VALUE_HINT' : '';
957
- };
958
- const getItemValue = (item) => {
959
- return isArrayOperation(item.operation) ? item.value.join(';') : item.value;
960
- };
961
- return {
962
- changeValue,
963
- changeRelation,
964
- changeOperation,
965
- getValueInputName,
966
- newFilter,
967
- getComponentType,
968
- getComponentHint,
969
- modelWithIds,
970
- getItemValue,
971
- };
972
- },
973
- });
974
-
975
- function render$9(_ctx, _cache, $props, $setup, $data, $options) {
976
- const _component_zd_grid_header_icon = resolveComponent("zd-grid-header-icon");
977
- const _component_zd_radio = resolveComponent("zd-radio");
978
- const _component_zd_select = resolveComponent("zd-select");
979
- const _component_v_card = resolveComponent("v-card");
980
- const _component_v_menu = resolveComponent("v-menu");
981
-
982
- return (openBlock(), createBlock(_component_v_menu, {
983
- "offset-overflow": "",
984
- "offset-y": "",
985
- transition: "scale-transition",
986
- "content-class": "tek-grid-column-filter__menu",
987
- "close-on-content-click": false
988
- }, {
989
- activator: withCtx(({ props }) => [
990
- createVNode(_component_zd_grid_header_icon, mergeProps(props, {
991
- icon: _ctx.$getIcon('filter'),
992
- hidden: !_ctx.isHovering && !_ctx.hasFilterData,
993
- color: _ctx.hasFilterData ? 'primary' : ''
994
- }), null, 16 /* FULL_PROPS */, ["icon", "hidden", "color"])
995
- ]),
996
- default: withCtx(() => [
997
- createVNode(_component_v_card, {
998
- class: "zd-pa-4 zd-pb-0",
999
- "min-width": 200,
1000
- "max-height": 300
1001
- }, {
1002
- default: withCtx(() => [
1003
- (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.modelWithIds, ({ item, id }, filterIndex) => {
1004
- return (openBlock(), createElementBlock(Fragment, { key: id }, [
1005
- createCommentVNode(" relation "),
1006
- (_ctx.multiple && filterIndex > 0)
1007
- ? (openBlock(), createBlock(_component_zd_radio, mergeProps({
1008
- key: 0,
1009
- name: `${_ctx.instanceName}-${_ctx.column.name}-filter-relation-${filterIndex}`
1010
- }, { ref_for: true }, {
1011
- showLabel: false,
1012
- showHelper: false,
1013
- vertical: false,
1014
- cssClass: 'zd-mb-2',
1015
- datasource: _ctx.filterRelationsDatasource,
1016
- dataValue: 'value',
1017
- dataLabel: 'text',
1018
- value: item.relation,
1019
- events: {
1020
- change: (params) => _ctx.changeRelation(filterIndex, params),
1021
- },
1022
- }), null, 16 /* FULL_PROPS */, ["name"]))
1023
- : createCommentVNode("v-if", true),
1024
- createCommentVNode(" operation "),
1025
- (_ctx.multiple && item.operation)
1026
- ? (openBlock(), createBlock(_component_zd_select, mergeProps({
1027
- key: 1,
1028
- name: `${_ctx.instanceName}-${_ctx.column.name}-filter-operation-${filterIndex}`
1029
- }, { ref_for: true }, {
1030
- autocomplete: false,
1031
- showLabel: false,
1032
- showHelper: false,
1033
- clearable: false,
1034
- cssClass: 'zd-mb-2',
1035
- datasource: _ctx.filterOperationsDatasource,
1036
- dataValue: 'value',
1037
- dataText: 'text',
1038
- value: item.operation,
1039
- events: {
1040
- change: (params) => _ctx.changeOperation(filterIndex, params),
1041
- },
1042
- }), null, 16 /* FULL_PROPS */, ["name"]))
1043
- : createCommentVNode("v-if", true),
1044
- createCommentVNode(" value "),
1045
- (openBlock(), createBlock(resolveDynamicComponent(_ctx.getComponentType(item.operation)), mergeProps({
1046
- name: `${_ctx.instanceName}-${_ctx.column.name}-filter-value-${filterIndex}`
1047
- }, { ref_for: true }, {
1048
- ..._ctx.column.componentProps,
1049
- showLabel: false,
1050
- showHelper: true,
1051
- autofill: false,
1052
- cssClass: 'zd-mb-2',
1053
- value: _ctx.getItemValue(item),
1054
- persistentHint: true,
1055
- hint: _ctx.getComponentHint(item.operation),
1056
- events: {
1057
- input: (params) => _ctx.changeValue(item, filterIndex, params),
1058
- change: (params) => _ctx.changeValue(item, filterIndex, params),
1059
- },
1060
- }), null, 16 /* FULL_PROPS */, ["name"]))
1061
- ], 64 /* STABLE_FRAGMENT */))
1062
- }), 128 /* KEYED_FRAGMENT */))
1063
- ]),
1064
- _: 1 /* STABLE */
1065
- })
1066
- ]),
1067
- _: 1 /* STABLE */
1068
- }))
1069
- }
1070
-
1071
- tekGridColumnFilter$1.render = render$9;
1072
- tekGridColumnFilter$1.__file = "src/components/tek-grid/column-filter/TekGridColumnFilter.vue";
1073
-
1074
- var script$3 = defineComponent({
1075
- props: {
1076
- selectable: {
1077
- type: Boolean,
1078
- default: false,
1079
- },
1080
- headerBackground: {
1081
- type: String,
1082
- default: '',
1083
- },
1084
- showSelectAll: {
1085
- type: Boolean,
1086
- default: false,
1087
- },
1088
- allselectedState: {
1089
- type: Number,
1090
- default: 0,
1091
- },
1092
- visibleColumns: {
1093
- type: Array,
1094
- default: () => [],
1095
- },
1096
- dragColumns: {
1097
- type: Boolean,
1098
- default: false,
1099
- },
1100
- headerCellTextColor: {
1101
- type: String,
1102
- default: '',
1103
- },
1104
- resizeColumns: {
1105
- type: Boolean,
1106
- default: false,
1107
- },
1108
- getSortIcon: {
1109
- type: Function,
1110
- default: () => { },
1111
- },
1112
- isSorted: {
1113
- type: Function,
1114
- default: () => { },
1115
- },
1116
- toggleSort: {
1117
- type: Function,
1118
- default: () => { },
1119
- },
1120
- tableColumns: {
1121
- type: Array,
1122
- default: () => [],
1123
- },
1124
- sortBy: {
1125
- type: Array,
1126
- default: () => [],
1127
- },
1128
- disableCheckbox: {
1129
- type: Boolean,
1130
- default: false,
1131
- },
1132
- sortable: {
1133
- type: Boolean,
1134
- default: true,
1135
- },
1136
- name: {
1137
- type: String,
1138
- default: '',
1139
- },
1140
- modelValue: {
1141
- type: Object,
1142
- default: () => [],
1143
- },
1144
- instanceName: {
1145
- type: String,
1146
- required: true,
1147
- },
1148
- filterRelationsDatasource: {
1149
- type: [Object, null],
1150
- required: false,
1151
- },
1152
- filterOperationsDatasource: {
1153
- type: [Object, null],
1154
- required: false,
1155
- },
1156
- columnFilterButton: {
1157
- type: Boolean,
1158
- required: true,
1159
- },
1160
- columnHasFilter: {
1161
- type: Function,
1162
- required: true,
1163
- },
1164
- level: {
1165
- type: Number,
1166
- default: 0,
1167
- },
1168
- },
1169
- emits: ['selectAllClick', 'resizeMousedown', 'resizeClick', 'update:modelValue'],
1170
- setup(props, { emit }) {
1171
- const calcWidth = inject('calcWidth');
1172
- if (!calcWidth) {
1173
- // TODO: use NotProvidedError
1174
- throw new Error('calcWidth');
1175
- }
1176
- const selectAllClick = (event) => {
1177
- emit('selectAllClick', event);
1178
- };
1179
- const resizeMousedown = (column, event) => {
1180
- emit('resizeMousedown', { event, column });
1181
- };
1182
- const resizeClick = (event) => {
1183
- emit('resizeClick', { event });
1184
- };
1185
- const findOrderIndex = (sortBy, column) => {
1186
- return sortBy.findIndex((sort) => sort.key === column.name);
1187
- };
1188
- const updateModelValue = (columnName, value) => {
1189
- const modelValue = Object.assign({}, props.modelValue);
1190
- modelValue[columnName] = value;
1191
- emit('update:modelValue', modelValue);
1192
- };
1193
- const showFilterButton = (column) => {
1194
- return column.type !== 'action' && props.columnFilterButton && column.filterable;
1195
- };
1196
- return {
1197
- calcWidth,
1198
- resizeMousedown,
1199
- resizeClick,
1200
- findOrderIndex,
1201
- updateModelValue,
1202
- showFilterButton,
1203
- selectAllClick,
1204
- };
1205
- },
1206
- });
1207
-
1208
- const _hoisted_1$4 = {
1209
- key: 0,
1210
- class: "tek-grid-column-aggregation"
1211
- };
1212
-
1213
- function render$8(_ctx, _cache, $props, $setup, $data, $options) {
1214
- const _component_tek_grid_indentation = resolveComponent("tek-grid-indentation");
1215
- const _component_tek_grid_column_filter = resolveComponent("tek-grid-column-filter");
1216
- const _component_zd_grid_column_header = resolveComponent("zd-grid-column-header");
1217
- const _component_zd_grid_header_row = resolveComponent("zd-grid-header-row");
1218
-
1219
- return (openBlock(), createBlock(_component_zd_grid_header_row, {
1220
- name: _ctx.name,
1221
- selectable: _ctx.selectable,
1222
- headerBackground: _ctx.headerBackground,
1223
- showSelectAll: _ctx.showSelectAll,
1224
- allselectedState: _ctx.allselectedState,
1225
- visibleColumns: _ctx.visibleColumns,
1226
- dragColumns: _ctx.dragColumns,
1227
- headerCellTextColor: _ctx.headerCellTextColor,
1228
- resizeColumns: _ctx.resizeColumns,
1229
- getSortIcon: _ctx.getSortIcon,
1230
- toggleSort: _ctx.toggleSort,
1231
- sortBy: _ctx.sortBy,
1232
- tableColumns: _ctx.tableColumns,
1233
- isSorted: _ctx.isSorted,
1234
- disableCheckbox: _ctx.disableCheckbox,
1235
- onSelectAllClick: _ctx.selectAllClick
1236
- }, {
1237
- default: withCtx(({ column, index, isHovering }) => [
1238
- createVNode(_component_zd_grid_column_header, {
1239
- cssStyle: {
1240
- 'color': _ctx.headerCellTextColor,
1241
- width: _ctx.calcWidth(column),
1242
- },
1243
- action: column.type === 'action',
1244
- overflow: column.overflow,
1245
- helperText: column.helperText,
1246
- label: column.label,
1247
- columnAlign: column.align,
1248
- orderIndex: _ctx.findOrderIndex(_ctx.sortBy, column),
1249
- isSortable: _ctx.sortable && column.sortable,
1250
- resizeColumns: _ctx.resizeColumns,
1251
- sortIcon: _ctx.getSortIcon(_ctx.tableColumns[index]),
1252
- isSorted: _ctx.isSorted(_ctx.tableColumns[index]),
1253
- isHovering: isHovering,
1254
- onClick: $event => (_ctx.toggleSort(_ctx.tableColumns[index])),
1255
- onResizeMousedown: $event => (_ctx.resizeMousedown(column, $event)),
1256
- onResizeClick: _cache[0] || (_cache[0] = $event => (_ctx.resizeClick($event)))
1257
- }, createSlots({
1258
- label: withCtx(() => [
1259
- (column.aggregation)
1260
- ? (openBlock(), createElementBlock("span", _hoisted_1$4, "(" + toDisplayString(_ctx.$t(`TEKGRID_AGGREGATION_${column.aggregation}`)) + ") ", 1 /* TEXT */))
1261
- : createCommentVNode("v-if", true)
1262
- ]),
1263
- _: 2 /* DYNAMIC */
1264
- }, [
1265
- (index === 0)
1266
- ? {
1267
- name: "prepend",
1268
- fn: withCtx(() => [
1269
- createVNode(_component_tek_grid_indentation, {
1270
- level: _ctx.level,
1271
- "show-divider": false
1272
- }, null, 8 /* PROPS */, ["level"])
1273
- ]),
1274
- key: "0"
1275
- }
1276
- : undefined,
1277
- (_ctx.showFilterButton(column))
1278
- ? {
1279
- name: "append",
1280
- fn: withCtx(({ isHovering }) => [
1281
- createVNode(_component_tek_grid_column_filter, {
1282
- modelValue: _ctx.modelValue[column.name],
1283
- hasFilterData: _ctx.columnHasFilter(column.name),
1284
- column: column,
1285
- instanceName: _ctx.instanceName,
1286
- filterRelationsDatasource: _ctx.filterRelationsDatasource,
1287
- filterOperationsDatasource: _ctx.filterOperationsDatasource,
1288
- isHovering: isHovering,
1289
- multiple: !!_ctx.filterRelationsDatasource && !!_ctx.filterOperationsDatasource,
1290
- "onUpdate:modelValue": $event => (_ctx.updateModelValue(column.name, $event))
1291
- }, null, 8 /* PROPS */, ["modelValue", "hasFilterData", "column", "instanceName", "filterRelationsDatasource", "filterOperationsDatasource", "isHovering", "multiple", "onUpdate:modelValue"])
1292
- ]),
1293
- key: "1"
1294
- }
1295
- : undefined
1296
- ]), 1032 /* PROPS, DYNAMIC_SLOTS */, ["cssStyle", "action", "overflow", "helperText", "label", "columnAlign", "orderIndex", "isSortable", "resizeColumns", "sortIcon", "isSorted", "isHovering", "onClick", "onResizeMousedown"])
1297
- ]),
1298
- _: 1 /* STABLE */
1299
- }, 8 /* PROPS */, ["name", "selectable", "headerBackground", "showSelectAll", "allselectedState", "visibleColumns", "dragColumns", "headerCellTextColor", "resizeColumns", "getSortIcon", "toggleSort", "sortBy", "tableColumns", "isSorted", "disableCheckbox", "onSelectAllClick"]))
1300
- }
1301
-
1302
- script$3.render = render$8;
1303
- script$3.__file = "src/components/tek-grid/column-header/TekGridHeaderRow.vue";
1304
-
1305
- /******************************************************************************
1306
- Copyright (c) Microsoft Corporation.
1307
-
1308
- Permission to use, copy, modify, and/or distribute this software for any
1309
- purpose with or without fee is hereby granted.
1310
-
1311
- THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
1312
- REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
1313
- AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
1314
- INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
1315
- LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
1316
- OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
1317
- PERFORMANCE OF THIS SOFTWARE.
1318
- ***************************************************************************** */
1319
- /* global Reflect, Promise, SuppressedError, Symbol, Iterator */
1320
-
1321
-
1322
- function __decorate(decorators, target, key, desc) {
1323
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
1324
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
1325
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
1326
- return c > 3 && r && Object.defineProperty(target, key, r), r;
1327
- }
1328
-
1329
- typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
1330
- var e = new Error(message);
1331
- return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
1332
- };
1333
-
1334
- let TekGridColumnsOptionsController = class TekGridColumnsOptionsController {
1335
- constructor(modal) {
1336
- this.columnData = {};
1337
- this.fixedColumns = [];
1338
- this.visibleColumns = [];
1339
- this.groupedColumns = [];
1340
- this.otherColumns = [];
1341
- this.aggregationData = [];
1342
- this.selectedColumnNames = [];
1343
- this.searchValue = '';
1344
- this.showGroups = true;
1345
- this.updatingSelect = false;
1346
- this.modal = modal;
1347
- }
1348
- updateArrays() {
1349
- this.fixedColumns = [];
1350
- this.visibleColumns = [];
1351
- this.groupedColumns = [];
1352
- this.otherColumns = [];
1353
- Object.keys(this.columnData).forEach((name) => {
1354
- const column = this.columnData[name];
1355
- if (this.instanceValue && this.instanceValue.ignoreColumns.indexOf(column.name) === -1) {
1356
- if (column.grouped) {
1357
- this.groupedColumns.push(column);
1358
- }
1359
- else if (column.fixed) {
1360
- this.fixedColumns.push(column);
1361
- }
1362
- else if (column.isVisible) {
1363
- this.visibleColumns.push(column);
1364
- }
1365
- else {
1366
- this.otherColumns.push(column);
1367
- }
1368
- }
1369
- });
1370
- }
1371
- set instance(instance) {
1372
- this.instanceValue = instance;
1373
- this.iterableComponent = instance.iterableComponent;
1374
- this.showGroups = instance.iterableComponent instanceof TekGrid;
1375
- this.aggregationData = instance.getAggregationSelectData();
1376
- this.columnData = {};
1377
- this.iterableComponent.columns.forEach((column) => {
1378
- this.columnData[column.name] = {
1379
- name: column.name,
1380
- label: column.label,
1381
- fixed: column.fixed,
1382
- isVisible: column.isVisible,
1383
- align: column.align,
1384
- grouped: column.grouped || false,
1385
- groupOpened: column.groupOpened || false,
1386
- aggregation: column.aggregation,
1387
- aggregationText: this.getAggregationText(column.aggregation),
1388
- selected: false,
1389
- };
1390
- });
1391
- this.updateArrays();
1392
- this.selectedColumnNames = [];
1393
- }
1394
- getAggregationText(aggregation) {
1395
- let result = '';
1396
- if (aggregation) {
1397
- const idx = this.aggregationData.findIndex((item) => item.value === aggregation);
1398
- if (idx !== -1) {
1399
- result = ` (${this.aggregationData[idx].text})`;
1400
- }
1401
- }
1402
- return result;
1403
- }
1404
- columnInSearch(column) {
1405
- return !this.searchValue || Utils.normalize(column.label).indexOf(Utils.normalize(this.searchValue)) !== -1;
1406
- }
1407
- get fixedColumnData() {
1408
- return this.fixedColumns.filter(this.columnInSearch.bind(this));
1409
- }
1410
- set fixedColumnData(_data) {
1411
- // do nothing
1412
- }
1413
- get visibleColumnData() {
1414
- return this.visibleColumns.filter(this.columnInSearch.bind(this));
1415
- }
1416
- set visibleColumnData(_data) {
1417
- // do nothing
1418
- }
1419
- get groupedColumnData() {
1420
- return this.groupedColumns.filter(this.columnInSearch.bind(this));
1421
- }
1422
- set groupedColumnData(_data) {
1423
- // do nothing
1424
- }
1425
- get otherColumnData() {
1426
- return this.otherColumns.filter(this.columnInSearch.bind(this));
1427
- }
1428
- set otherColumnData(_data) {
1429
- // do nothing
1430
- }
1431
- get hasSelectedColumn() {
1432
- return this.selectedColumnNames.length > 0;
1433
- }
1434
- get hasNoSelectedColumn() {
1435
- return !this.hasSelectedColumn;
1436
- }
1437
- get detailColumnName() {
1438
- const columnNames = this.selectedColumnNames.length
1439
- ? this.selectedColumnNames.join(', ')
1440
- : I18n.translate('TEKGRID_SELECT_COLUMN');
1441
- return `${I18n.translate('TEKGRID_DETAILS_FOR')} ${columnNames}`;
1442
- }
1443
- get hasNoFixedColumns() {
1444
- return this.fixedColumns.length === 0;
1445
- }
1446
- get hasNoVisibleColumns() {
1447
- return this.visibleColumns.length === 0;
1448
- }
1449
- get hasNoGroupedColumns() {
1450
- return this.groupedColumns.length === 0;
1451
- }
1452
- get hasNoOtherColumns() {
1453
- return this.otherColumns.length === 0;
1454
- }
1455
- get hasNoSingleSelection() {
1456
- return this.selectedColumnNames.length !== 1;
1457
- }
1458
- get selectedColumnLabel() {
1459
- return this.selectedColumnNames.length === 1 ? this.columnData[this.selectedColumnNames[0]].label : '';
1460
- }
1461
- set selectedColumnLabel(value) {
1462
- if (this.selectedColumnNames.length === 1) {
1463
- this.columnData[this.selectedColumnNames[0]].label = value;
1464
- }
1465
- }
1466
- getSameValue(propName) {
1467
- const isEqual = this.selectedColumnNames.length > 0 &&
1468
- this.selectedColumnNames.every((name) => this.columnData[name][propName] === this.columnData[this.selectedColumnNames[0]][propName]);
1469
- return isEqual ? this.columnData[this.selectedColumnNames[0]][propName] : undefined;
1470
- }
1471
- setSameValue(propName, value) {
1472
- this.selectedColumnNames.forEach((name) => {
1473
- this.columnData[name][propName] = value;
1474
- });
1475
- }
1476
- get groupInSelection() {
1477
- return this.hasNoSelectedColumn || this.selectedColumnNames.some((name) => this.columnData[name].grouped);
1478
- }
1479
- get notGroupInSelection() {
1480
- return this.hasNoSelectedColumn || this.selectedColumnNames.some((name) => !this.columnData[name].grouped);
1481
- }
1482
- get selectedColumnGroupOpened() {
1483
- return this.getSameValue('groupOpened');
1484
- }
1485
- set selectedColumnGroupOpened(value) {
1486
- this.setSameValue('groupOpened', value);
1487
- }
1488
- selectMounted({ component }) {
1489
- this.updatingSelect = true;
1490
- if (component.name === 'tekGridColumnsOptionsColumnAlignment') {
1491
- component.value = this.selectedColumnsAlignment;
1492
- }
1493
- else if (component.name === 'tekGridColumnsOptionsColumnAggregation') {
1494
- component.value = this.selectedColumnsAggregation;
1495
- }
1496
- // prevent changing column value from here
1497
- setTimeout(() => {
1498
- this.updatingSelect = false;
1499
- }, 0);
1500
- }
1501
- selectChange({ component }) {
1502
- if (this.updatingSelect)
1503
- return;
1504
- if (component.name === 'tekGridColumnsOptionsColumnAlignment') {
1505
- this.setSameValue('align', component.value);
1506
- }
1507
- else {
1508
- this.setSameValue('aggregation', component.value);
1509
- this.setSameValue('aggregationText', this.getAggregationText(component.value));
1510
- }
1511
- }
1512
- updateSelects() {
1513
- this.selectedColumnsAlignment = this.updateSelect('align');
1514
- this.selectedColumnsAggregation = this.updateSelect('aggregation');
1515
- }
1516
- updateSelect(propName) {
1517
- this.updatingSelect = true;
1518
- const propValue = this.getSameValue(propName);
1519
- const selectNames = {
1520
- align: 'tekGridColumnsOptionsColumnAlignment',
1521
- aggregation: 'tekGridColumnsOptionsColumnAggregation',
1522
- };
1523
- const instances = Metadata.getInstances(selectNames[propName]);
1524
- if (instances[0]) {
1525
- instances[0].value = propValue;
1526
- }
1527
- // prevent changing column value from here
1528
- setTimeout(() => {
1529
- this.updatingSelect = false;
1530
- }, 0);
1531
- return propValue;
1532
- }
1533
- columnRemoveClick(column) {
1534
- column.isVisible = false;
1535
- this.selectedColumnNames.splice(this.selectedColumnNames.indexOf(column.name), 1);
1536
- this.otherColumns.push(column);
1537
- }
1538
- columnFixedRemoveClick({ element }) {
1539
- const columnName = element === null || element === void 0 ? void 0 : element.getAttribute('columnname');
1540
- if (columnName) {
1541
- const column = this.columnData[columnName];
1542
- this.columnRemoveClick(column);
1543
- this.fixedColumns.splice(this.fixedColumns.indexOf(column), 1);
1544
- }
1545
- }
1546
- columnVisibleRemoveClick({ element }) {
1547
- const columnName = element === null || element === void 0 ? void 0 : element.getAttribute('columnname');
1548
- if (columnName) {
1549
- const column = this.columnData[columnName];
1550
- this.columnRemoveClick(column);
1551
- this.visibleColumns.splice(this.visibleColumns.indexOf(column), 1);
1552
- }
1553
- }
1554
- columnGroupedRemoveClick({ element }) {
1555
- const columnName = element === null || element === void 0 ? void 0 : element.getAttribute('columnname');
1556
- if (columnName) {
1557
- const column = this.columnData[columnName];
1558
- this.columnRemoveClick(column);
1559
- this.groupedColumns.splice(this.groupedColumns.indexOf(column), 1);
1560
- }
1561
- }
1562
- isMacPlatform() {
1563
- return /Mac/.test(navigator.platform);
1564
- }
1565
- isMobilePlatform() {
1566
- return /iPhone|iPad|Android/.test(navigator.platform);
1567
- }
1568
- columnClick({ element, event }) {
1569
- const columnName = element.getAttribute('columnname');
1570
- if (columnName) {
1571
- const mouseEvent = event;
1572
- const multiple = (this.isMacPlatform() && mouseEvent.metaKey) || mouseEvent.ctrlKey || this.isMobilePlatform();
1573
- if (!multiple) {
1574
- Object.keys(this.columnData).forEach((name) => {
1575
- const column = this.columnData[name];
1576
- column.selected = column.name === columnName;
1577
- });
1578
- }
1579
- else {
1580
- this.columnData[columnName].selected = !this.columnData[columnName].selected;
1581
- }
1582
- const orderedColumns = this.fixedColumns
1583
- .concat(this.visibleColumns)
1584
- .concat(this.groupedColumns)
1585
- .concat(this.otherColumns);
1586
- this.selectedColumnNames = orderedColumns.filter((column) => column.selected).map((column) => column.name);
1587
- this.updateSelects();
1588
- }
1589
- }
1590
- removeFromSourceList(columnName) {
1591
- const column = this.columnData[columnName];
1592
- const fixedIdx = this.fixedColumns.indexOf(column);
1593
- if (fixedIdx !== -1) {
1594
- this.fixedColumns.splice(fixedIdx, 1);
1595
- }
1596
- else {
1597
- const visibleIdx = this.visibleColumns.indexOf(column);
1598
- if (visibleIdx !== -1) {
1599
- this.visibleColumns.splice(visibleIdx, 1);
1600
- }
1601
- else {
1602
- const groupedIdx = this.groupedColumns.indexOf(column);
1603
- if (groupedIdx !== -1) {
1604
- this.groupedColumns.splice(groupedIdx, 1);
1605
- }
1606
- else {
1607
- const otherIdx = this.otherColumns.indexOf(column);
1608
- if (otherIdx !== -1) {
1609
- this.otherColumns.splice(otherIdx, 1);
1610
- }
1611
- }
1612
- }
1613
- }
1614
- }
1615
- onDragEnd(event) {
1616
- const columnName = event.item.getAttribute('columnname');
1617
- if (this.selectedColumnNames.indexOf(columnName) === -1) {
1618
- this.selectedColumnNames = [columnName];
1619
- this.updateSelects();
1620
- setTimeout(() => {
1621
- Object.keys(this.columnData).forEach((name) => {
1622
- const column = this.columnData[name];
1623
- column.selected = column.name === columnName;
1624
- });
1625
- });
1626
- }
1627
- this.selectedColumnNames.forEach((name, index) => {
1628
- const newIndex = event.newIndex + index;
1629
- if (name) {
1630
- this.removeFromSourceList(name);
1631
- const column = this.columnData[name];
1632
- if (event.to.id === 'tekGridColumnsOptionsFixedColumns') {
1633
- column.fixed = true;
1634
- column.isVisible = true;
1635
- column.grouped = false;
1636
- column.groupOpened = false;
1637
- this.fixedColumns.splice(newIndex, 0, column);
1638
- }
1639
- else if (event.to.id === 'tekGridColumnsOptionsVisibleColumns') {
1640
- column.fixed = false;
1641
- column.isVisible = true;
1642
- column.grouped = false;
1643
- column.groupOpened = false;
1644
- this.visibleColumns.splice(newIndex, 0, column);
1645
- }
1646
- else if (event.to.id === 'tekGridColumnsOptionsOtherColumns') {
1647
- column.fixed = false;
1648
- column.isVisible = false;
1649
- column.grouped = false;
1650
- column.groupOpened = false;
1651
- this.otherColumns.splice(newIndex, 0, column);
1652
- }
1653
- else if (event.to.id === 'tekGridColumnsOptionsGroupedColumns') {
1654
- column.fixed = false;
1655
- column.isVisible = true;
1656
- column.grouped = true;
1657
- column.aggregation = undefined;
1658
- column.aggregationText = '';
1659
- this.groupedColumns.splice(newIndex, 0, column);
1660
- }
1661
- }
1662
- });
1663
- }
1664
- columnContainerMounted({ element }) {
1665
- if (element) {
1666
- sortable.create(element, {
1667
- handle: '.tek-grid-column-option-box',
1668
- group: 'column-container',
1669
- filter: '.no-data, .tek-grid-column-option-grouped-true',
1670
- onEnd: this.onDragEnd.bind(this),
1671
- });
1672
- }
1673
- }
1674
- selectAll({ component }) {
1675
- let list;
1676
- if (component.name === 'tekGridColumnsOptionsFixedSelectAll') {
1677
- list = this.fixedColumns;
1678
- }
1679
- else if (component.name === 'tekGridColumnsOptionsVisibleSelectAll') {
1680
- list = this.visibleColumns;
1681
- }
1682
- else if (component.name === 'tekGridColumnsOptionsOtherSelectAll') {
1683
- list = this.otherColumns;
1684
- }
1685
- else {
1686
- list = this.groupedColumns;
1687
- }
1688
- this.selectedColumnNames = list.map((column) => column.name);
1689
- Object.keys(this.columnData).forEach((columnName) => {
1690
- const column = this.columnData[columnName];
1691
- column.selected = this.selectedColumnNames.indexOf(column.name) !== -1;
1692
- });
1693
- }
1694
- cancelChanges() {
1695
- this.modal.hide();
1696
- }
1697
- applyChanges({ event, element }) {
1698
- const ignoredColumns = this.iterableComponent.columns.filter((column) => this.instanceValue && this.instanceValue.ignoreColumns.indexOf(column.name) !== -1);
1699
- const orderedColumns = this.groupedColumns
1700
- .concat(this.fixedColumns)
1701
- .concat(this.visibleColumns)
1702
- .concat(this.otherColumns)
1703
- .concat(ignoredColumns);
1704
- if (this.iterableComponent) {
1705
- this.iterableComponent.columns = orderedColumns.map((orderColumn) => {
1706
- const columnIdx = this.iterableComponent.columns.findIndex((column) => column.name === orderColumn.name);
1707
- const iterableColumn = this.iterableComponent.columns[columnIdx];
1708
- iterableColumn.fixed = orderColumn.fixed;
1709
- iterableColumn.isVisible = orderColumn.isVisible;
1710
- iterableColumn.grouped = orderColumn.grouped;
1711
- iterableColumn.groupOpened = orderColumn.groupOpened;
1712
- iterableColumn.label = orderColumn.label;
1713
- iterableColumn.align = orderColumn.align;
1714
- iterableColumn.aggregation = orderColumn.aggregation;
1715
- return iterableColumn;
1716
- });
1717
- const { datasource } = this.iterableComponent;
1718
- const order = datasource.order.filter((item) => {
1719
- const columnName = item.split('.')[0];
1720
- return this.groupedColumns.findIndex((column) => column.name === columnName) === -1;
1721
- });
1722
- datasource.order = this.groupedColumns.map((column) => `${column.name}.asc`).concat(order);
1723
- this.iterableComponent.changeLayout(event, element);
1724
- }
1725
- this.modal.hide();
1726
- }
1727
- };
1728
- TekGridColumnsOptionsController = __decorate([
1729
- Singleton
1730
- ], TekGridColumnsOptionsController);
1731
- var TekGridColumnsOptionsController$1 = TekGridColumnsOptionsController;
1732
-
1733
- class TekGridColumnsOptionsModal {
1734
- static show(instance) {
1735
- if (!TekGridColumnsOptionsModal.modal) {
1736
- TekGridColumnsOptionsModal.modal = ModalService.create(TekGridColumnsOptionsModal.modalDef);
1737
- Loader.addController(TekGridColumnsOptionsModal.controllerName, TekGridColumnsOptionsController$1, [
1738
- TekGridColumnsOptionsModal.modal,
1739
- ]);
1740
- }
1741
- const controller = Loader.getInstance(TekGridColumnsOptionsModal.controllerName);
1742
- controller.instance = instance;
1743
- TekGridColumnsOptionsModal.modal.show();
1744
- }
1745
- static hide() {
1746
- if (TekGridColumnsOptionsModal.modal) {
1747
- TekGridColumnsOptionsModal.modal.hide();
1748
- }
1749
- }
1750
- }
1751
- TekGridColumnsOptionsModal.controllerName = `TekGridColumnsOptionsController_${Date.now()}`;
1752
- TekGridColumnsOptionsModal.modalDef = {
1753
- name: 'tekGridColumnsOptionsModal',
1754
- title: '',
1755
- persistent: true,
1756
- grid: {
1757
- sm: 11,
1758
- md: 9,
1759
- },
1760
- children: [
1761
- {
1762
- name: 'tekGridColumnsOptionsCloseButtonContainer',
1763
- component: 'ZdContainer',
1764
- cssClass: 'zd-pa-0 zd-mb-6 zd-display-flex',
1765
- children: [
1766
- {
1767
- name: 'tekGridColumnsOptionsTitleText',
1768
- component: 'ZdText',
1769
- text: 'TEKGRID_COLUMNS_OPTIONS',
1770
- cssClass: 'zd-theme-font-title',
1771
- },
1772
- {
1773
- name: 'tekGridColumnsOptionsFilterSpacer',
1774
- component: 'VSpacer',
1775
- },
1776
- {
1777
- name: 'tekGridColumnsOptionsCloseModalButton',
1778
- component: 'ZdModalCloseButton',
1779
- small: true,
1780
- modalName: 'tekGridColumnsOptionsModal',
1781
- },
1782
- ],
1783
- },
1784
- {
1785
- name: 'tekGridColumnsOptionsSearchRow',
1786
- component: 'ZdRow',
1787
- children: [
1788
- {
1789
- name: 'tekGridColumnsOptionsSearchCol',
1790
- component: 'ZdCol',
1791
- cols: 12,
1792
- children: [
1793
- {
1794
- name: 'tekGridColumnsOptionsSearchInput',
1795
- component: 'ZdTextInput',
1796
- showLabel: false,
1797
- showHelper: false,
1798
- placeholder: 'SEARCH',
1799
- appendIcon: 'magnify',
1800
- value: `{{${TekGridColumnsOptionsModal.controllerName}.searchValue}}`,
1801
- },
1802
- ],
1803
- },
1804
- ],
1805
- },
1806
- {
1807
- name: 'tekGridColumnsOptionsFixedRow',
1808
- component: 'ZdRow',
1809
- children: [
1810
- {
1811
- name: 'tekGridColumnsOptionsFixedCol',
1812
- component: 'ZdCol',
1813
- cols: 12,
1814
- cssClass: 'tek-grid-column-option-container-col',
1815
- children: [
1816
- {
1817
- name: 'tekGridColumnsOptionsFixedLabel',
1818
- component: 'ZdText',
1819
- text: 'TEKGRID_FIXED_COLUMNS',
1820
- cssClass: 'tek-grid-column-option-label',
1821
- },
1822
- {
1823
- name: 'tekGridColumnsOptionsFixedSelectAll',
1824
- component: 'ZdText',
1825
- text: 'TEKGRID_SELECT_ALL',
1826
- cssClass: 'tek-grid-column-option-select-all',
1827
- events: {
1828
- click: `{{${TekGridColumnsOptionsModal.controllerName}.selectAll}}`,
1829
- },
1830
- },
1831
- {
1832
- name: 'tekGridColumnsOptionsFixedDropHere',
1833
- component: 'ZdText',
1834
- text: 'TEKGRID_DROP_COLUMNS',
1835
- cssClass: 'tek-grid-column-option-drop-here',
1836
- isVisible: `{{${TekGridColumnsOptionsModal.controllerName}.hasNoFixedColumns}}`,
1837
- },
1838
- {
1839
- name: 'tekGridColumnsOptionsFixedColumns',
1840
- component: 'TekIterableComponentRender',
1841
- id: 'tekGridColumnsOptionsFixedColumns',
1842
- cssClass: 'tek-grid-column-option-container',
1843
- datasource: {
1844
- uniqueKey: 'name',
1845
- data: `{{${TekGridColumnsOptionsModal.controllerName}.fixedColumnData}}`,
1846
- },
1847
- noDataSlot: [],
1848
- events: {
1849
- onMounted: `{{${TekGridColumnsOptionsModal.controllerName}.columnContainerMounted}}`,
1850
- },
1851
- componentMetadata: {
1852
- name: 'tekGridColumnsOptionsFixedColumn_<<row.name>>',
1853
- component: 'ZdTag',
1854
- columnName: '<<row.name>>',
1855
- cssClass: 'tek-grid-column-option-box zd-elevation-1 ' + 'tek-grid-column-option-selected-<<row.selected>>',
1856
- tag: 'div',
1857
- children: [
1858
- {
1859
- name: 'tekGridColumnsOptionsFixedColumnText_<<row.name>>',
1860
- columnName: '<<row.name>>',
1861
- component: 'ZdText',
1862
- text: '<<row.label>><<row.aggregationText>>',
1863
- },
1864
- {
1865
- name: 'tekGridColumnsOptionsFixedColumnRemove_<<row.name>>',
1866
- columnName: '<<row.name>>',
1867
- component: 'ZdIcon',
1868
- iconName: 'close',
1869
- events: {
1870
- click: `{{${TekGridColumnsOptionsModal.controllerName}.columnFixedRemoveClick}}`,
1871
- },
1872
- },
1873
- ],
1874
- events: {
1875
- click: `{{${TekGridColumnsOptionsModal.controllerName}.columnClick}}`,
1876
- },
1877
- },
1878
- },
1879
- ],
1880
- },
1881
- ],
1882
- },
1883
- {
1884
- name: 'tekGridColumnsOptionsVisibleRow',
1885
- component: 'ZdRow',
1886
- children: [
1887
- {
1888
- name: 'tekGridColumnsOptionsVisibleCol',
1889
- component: 'ZdCol',
1890
- cols: 12,
1891
- cssClass: 'tek-grid-column-option-container-col',
1892
- children: [
1893
- {
1894
- name: 'tekGridColumnsOptionsVisibleLabel',
1895
- component: 'ZdText',
1896
- text: 'TEKGRID_VISIBLE_COLUMNS',
1897
- cssClass: 'tek-grid-column-option-label',
1898
- },
1899
- {
1900
- name: 'tekGridColumnsOptionsVisibleSelectAll',
1901
- component: 'ZdText',
1902
- text: 'TEKGRID_SELECT_ALL',
1903
- cssClass: 'tek-grid-column-option-select-all',
1904
- events: {
1905
- click: `{{${TekGridColumnsOptionsModal.controllerName}.selectAll}}`,
1906
- },
1907
- },
1908
- {
1909
- name: 'tekGridColumnsOptionsVisibleDropHere',
1910
- component: 'ZdText',
1911
- text: 'TEKGRID_DROP_COLUMNS',
1912
- cssClass: 'tek-grid-column-option-drop-here',
1913
- isVisible: `{{${TekGridColumnsOptionsModal.controllerName}.hasNoVisibleColumns}}`,
1914
- },
1915
- {
1916
- name: 'tekGridColumnsOptionsVisibleColumns',
1917
- component: 'TekIterableComponentRender',
1918
- id: 'tekGridColumnsOptionsVisibleColumns',
1919
- cssClass: 'tek-grid-column-option-container',
1920
- datasource: {
1921
- uniqueKey: 'name',
1922
- data: `{{${TekGridColumnsOptionsModal.controllerName}.visibleColumnData}}`,
1923
- },
1924
- noDataSlot: [],
1925
- events: {
1926
- onMounted: `{{${TekGridColumnsOptionsModal.controllerName}.columnContainerMounted}}`,
1927
- },
1928
- componentMetadata: {
1929
- name: 'tekGridColumnsOptionsVisibleColumn_<<row.name>>',
1930
- component: 'ZdTag',
1931
- columnName: '<<row.name>>',
1932
- cssClass: 'tek-grid-column-option-box zd-elevation-1 ' + 'tek-grid-column-option-selected-<<row.selected>>',
1933
- tag: 'div',
1934
- children: [
1935
- {
1936
- name: 'tekGridColumnsOptionsVisibleColumnText_<<row.name>>',
1937
- columnName: '<<row.name>>',
1938
- component: 'ZdText',
1939
- text: '<<row.label>><<row.aggregationText>>',
1940
- },
1941
- {
1942
- name: 'tekGridColumnsOptionsVisibleColumnRemove_<<row.name>>',
1943
- columnName: '<<row.name>>',
1944
- component: 'ZdIcon',
1945
- iconName: 'close',
1946
- events: {
1947
- click: `{{${TekGridColumnsOptionsModal.controllerName}.columnVisibleRemoveClick}}`,
1948
- },
1949
- },
1950
- ],
1951
- events: {
1952
- click: `{{${TekGridColumnsOptionsModal.controllerName}.columnClick}}`,
1953
- },
1954
- },
1955
- },
1956
- ],
1957
- },
1958
- ],
1959
- },
1960
- {
1961
- name: 'tekGridColumnsOptionsGroupedRow',
1962
- component: 'ZdRow',
1963
- isVisible: `{{${TekGridColumnsOptionsModal.controllerName}.showGroups}}`,
1964
- children: [
1965
- {
1966
- name: 'tekGridColumnsOptionsGroupedCol',
1967
- component: 'ZdCol',
1968
- cssClass: 'tek-grid-column-option-container-col',
1969
- cols: 12,
1970
- children: [
1971
- {
1972
- name: 'tekGridColumnsOptionsGroupedLabel',
1973
- component: 'ZdText',
1974
- text: 'TEKGRID_GROUPED_COLUMNS',
1975
- cssClass: 'tek-grid-column-option-label',
1976
- },
1977
- {
1978
- name: 'tekGridColumnsOptionsGroupedSelectAll',
1979
- component: 'ZdText',
1980
- text: 'TEKGRID_SELECT_ALL',
1981
- cssClass: 'tek-grid-column-option-select-all',
1982
- events: {
1983
- click: `{{${TekGridColumnsOptionsModal.controllerName}.selectAll}}`,
1984
- },
1985
- },
1986
- {
1987
- name: 'tekGridColumnsOptionsGroupedDropHere',
1988
- component: 'ZdText',
1989
- text: 'TEKGRID_DROP_COLUMNS',
1990
- cssClass: 'tek-grid-column-option-drop-here',
1991
- isVisible: `{{${TekGridColumnsOptionsModal.controllerName}.hasNoGroupedColumns}}`,
1992
- },
1993
- {
1994
- name: 'tekGridColumnsOptionsGroupedColumns',
1995
- component: 'TekIterableComponentRender',
1996
- id: 'tekGridColumnsOptionsGroupedColumns',
1997
- cssClass: 'tek-grid-column-option-container',
1998
- datasource: {
1999
- uniqueKey: 'name',
2000
- data: `{{${TekGridColumnsOptionsModal.controllerName}.groupedColumnData}}`,
2001
- },
2002
- noDataSlot: [],
2003
- events: {
2004
- onMounted: `{{${TekGridColumnsOptionsModal.controllerName}.columnContainerMounted}}`,
2005
- },
2006
- componentMetadata: {
2007
- name: 'tekGridColumnsOptionsGroupedColumn_<<row.name>>',
2008
- component: 'ZdTag',
2009
- columnName: '<<row.name>>',
2010
- cssClass: 'tek-grid-column-option-box zd-elevation-1 ' + 'tek-grid-column-option-selected-<<row.selected>>',
2011
- tag: 'div',
2012
- children: [
2013
- {
2014
- name: 'tekGridColumnsOptionsGroupedColumnText_<<row.name>>',
2015
- columnName: '<<row.name>>',
2016
- component: 'ZdText',
2017
- text: '<<row.label>><<row.aggregationText>>',
2018
- },
2019
- {
2020
- name: 'tekGridColumnsOptionsGroupedColumnRemove_<<row.name>>',
2021
- columnName: '<<row.name>>',
2022
- component: 'ZdIcon',
2023
- iconName: 'close',
2024
- events: {
2025
- click: `{{${TekGridColumnsOptionsModal.controllerName}.columnGroupedRemoveClick}}`,
2026
- },
2027
- },
2028
- ],
2029
- events: {
2030
- click: `{{${TekGridColumnsOptionsModal.controllerName}.columnClick}}`,
2031
- },
2032
- },
2033
- },
2034
- ],
2035
- },
2036
- ],
2037
- },
2038
- {
2039
- name: 'tekGridColumnsOptionsOtherRow',
2040
- component: 'ZdRow',
2041
- children: [
2042
- {
2043
- name: 'tekGridColumnsOptionsOtherCol',
2044
- component: 'ZdCol',
2045
- cssClass: 'tek-grid-column-option-container-col',
2046
- cols: 12,
2047
- children: [
2048
- {
2049
- name: 'tekGridColumnsOptionsOtherLabel',
2050
- component: 'ZdText',
2051
- text: 'TEKGRID_OTHER_COLUMNS',
2052
- cssClass: 'tek-grid-column-option-label',
2053
- },
2054
- {
2055
- name: 'tekGridColumnsOptionsOtherSelectAll',
2056
- component: 'ZdText',
2057
- text: 'TEKGRID_SELECT_ALL',
2058
- cssClass: 'tek-grid-column-option-select-all',
2059
- events: {
2060
- click: `{{${TekGridColumnsOptionsModal.controllerName}.selectAll}}`,
2061
- },
2062
- },
2063
- {
2064
- name: 'tekGridColumnsOptionsOtherDropHere',
2065
- component: 'ZdText',
2066
- text: 'TEKGRID_DROP_COLUMNS',
2067
- cssClass: 'tek-grid-column-option-drop-here',
2068
- isVisible: `{{${TekGridColumnsOptionsModal.controllerName}.hasNoOtherColumns}}`,
2069
- },
2070
- {
2071
- name: 'tekGridColumnsOptionsOtherColumns',
2072
- component: 'TekIterableComponentRender',
2073
- id: 'tekGridColumnsOptionsOtherColumns',
2074
- cssClass: 'tek-grid-column-option-container',
2075
- datasource: {
2076
- uniqueKey: 'name',
2077
- data: `{{${TekGridColumnsOptionsModal.controllerName}.otherColumnData}}`,
2078
- },
2079
- noDataSlot: [],
2080
- events: {
2081
- onMounted: `{{${TekGridColumnsOptionsModal.controllerName}.columnContainerMounted}}`,
2082
- },
2083
- componentMetadata: {
2084
- name: 'tekGridColumnsOptionsOtherColumn_<<row.name>>',
2085
- component: 'ZdText',
2086
- columnName: '<<row.name>>',
2087
- text: '<<row.label>><<row.aggregationText>>',
2088
- cssClass: 'tek-grid-column-option-box zd-elevation-1 ' + 'tek-grid-column-option-selected-<<row.selected>>',
2089
- events: {
2090
- click: `{{${TekGridColumnsOptionsModal.controllerName}.columnClick}}`,
2091
- },
2092
- },
2093
- },
2094
- ],
2095
- },
2096
- ],
2097
- },
2098
- {
2099
- name: 'tekGridColumnsOptionsDetailColumnName',
2100
- component: 'ZdText',
2101
- cssClass: 'tek-grid-column-option-detail-name',
2102
- text: `{{${TekGridColumnsOptionsModal.controllerName}.detailColumnName}}`,
2103
- grid: {
2104
- xs: 12,
2105
- },
2106
- },
2107
- {
2108
- name: 'tekGridColumnsOptionsDetailRow',
2109
- component: 'ZdRow',
2110
- children: [
2111
- {
2112
- name: 'tekGridColumnsOptionsDetailCol',
2113
- component: 'ZdCol',
2114
- cols: 12,
2115
- children: [
2116
- {
2117
- name: 'tekGridColumnsOptionsDetailForm',
2118
- component: 'ZdForm',
2119
- cssClass: 'tek-grid-column-option-detail-form',
2120
- children: [
2121
- {
2122
- name: 'tekGridColumnsOptionsColumnLabel',
2123
- component: 'ZdTextInput',
2124
- label: 'TEKGRID_COLUMN_LABEL',
2125
- showHelper: false,
2126
- clearable: false,
2127
- disabled: `{{${TekGridColumnsOptionsModal.controllerName}.hasNoSingleSelection}}`,
2128
- value: `{{${TekGridColumnsOptionsModal.controllerName}.selectedColumnLabel}}`,
2129
- grid: {
2130
- xs: 12,
2131
- md: 5,
2132
- },
2133
- },
2134
- {
2135
- name: 'tekGridColumnsOptionsColumnAlignment',
2136
- component: 'ZdSelect',
2137
- autocomplete: false,
2138
- label: 'TEKGRID_COLUMN_ALIGNMENT',
2139
- disabled: `{{${TekGridColumnsOptionsModal.controllerName}.hasNoSelectedColumn}}`,
2140
- showHelper: false,
2141
- clearable: false,
2142
- grid: {
2143
- xs: 6,
2144
- md: 2,
2145
- },
2146
- dataText: 'text',
2147
- dataValue: 'value',
2148
- datasource: {
2149
- data: [
2150
- { text: 'TEKGRID_LEFT', value: 'left' },
2151
- { text: 'TEKGRID_CENTER', value: 'center' },
2152
- { text: 'TEKGRID_RIGHT', value: 'right' },
2153
- ],
2154
- translate: 'text',
2155
- },
2156
- events: {
2157
- change: `{{${TekGridColumnsOptionsModal.controllerName}.selectChange}}`,
2158
- onMounted: `{{${TekGridColumnsOptionsModal.controllerName}.selectMounted}}`,
2159
- },
2160
- },
2161
- {
2162
- name: 'tekGridColumnsOptionsColumnAggregation',
2163
- component: 'ZdSelect',
2164
- isVisible: `{{${TekGridColumnsOptionsModal.controllerName}.showGroups}}`,
2165
- autocomplete: false,
2166
- label: 'TEKGRID_COLUMN_AGGREGATION',
2167
- showHelper: false,
2168
- disabled: `{{${TekGridColumnsOptionsModal.controllerName}.groupInSelection}}`,
2169
- dataText: 'text',
2170
- dataValue: 'value',
2171
- grid: {
2172
- xs: 6,
2173
- md: 2,
2174
- },
2175
- datasource: {
2176
- data: `{{${TekGridColumnsOptionsModal.controllerName}.aggregationData}}`,
2177
- },
2178
- events: {
2179
- change: `{{${TekGridColumnsOptionsModal.controllerName}.selectChange}}`,
2180
- onMounted: `{{${TekGridColumnsOptionsModal.controllerName}.selectMounted}}`,
2181
- },
2182
- },
2183
- {
2184
- name: 'tekGridColumnsOptionsColumnGroupOpened',
2185
- component: 'ZdCheckbox',
2186
- isVisible: `{{${TekGridColumnsOptionsModal.controllerName}.showGroups}}`,
2187
- cssClass: 'zd-form-input-align',
2188
- disabled: `{{${TekGridColumnsOptionsModal.controllerName}.notGroupInSelection}}`,
2189
- label: 'TEKGRID_COLUMN_GROUP_OPENED',
2190
- value: `{{${TekGridColumnsOptionsModal.controllerName}.selectedColumnGroupOpened}}`,
2191
- grid: {
2192
- xs: 6,
2193
- md: 3,
2194
- },
2195
- },
2196
- ],
2197
- },
2198
- ],
2199
- },
2200
- ],
2201
- },
2202
- {
2203
- name: 'tekGridColumnsOptionsDetailFooter',
2204
- component: 'ZdFooter',
2205
- padless: true,
2206
- color: 'transparent',
2207
- cssClass: 'zd-mt-6',
2208
- rightSlot: [
2209
- {
2210
- name: 'tekGridColumnsOptionsDetailCancel',
2211
- component: 'ZdButton',
2212
- outline: true,
2213
- label: 'TEKGRID_CANCEL',
2214
- events: {
2215
- click: `{{${TekGridColumnsOptionsModal.controllerName}.cancelChanges}}`,
2216
- },
2217
- },
2218
- {
2219
- name: 'tekGridColumnsOptionsDetailApply',
2220
- component: 'ZdButton',
2221
- label: 'TEKGRID_APPLY',
2222
- events: {
2223
- click: `{{${TekGridColumnsOptionsModal.controllerName}.applyChanges}}`,
2224
- },
2225
- },
2226
- ],
2227
- },
2228
- ],
2229
- };
2230
-
2231
- const TekGridColumnsButtonProps$1 = Object.assign(Object.assign({}, ZdIterableColumnsButtonProps), { hideGroups: {
2232
- type: [Boolean, String],
2233
- default: false,
2234
- } });
2235
- const tekGridColumnsButton$1 = defineComponent({
2236
- props: TekGridColumnsButtonProps$1,
2237
- inheritAttrs: false,
2238
- setup(props, ctx) {
2239
- const { instance, root } = useCreateInstance(props, ctx, TekGridColumnsButton);
2240
- const buttonScope = useButtonInstance({ instance, root });
2241
- const menuIsOpened = ref(false);
2242
- const sortableInitialized = ref(false);
2243
- const teste = (a) => {
2244
- console.warn(a);
2245
- };
2246
- watch(menuIsOpened, () => {
2247
- if (!menuIsOpened.value || sortableInitialized.value)
2248
- return;
2249
- sortableInitialized.value = true;
2250
- nextTick(() => {
2251
- const columnsTableBody = document.querySelector(`#${instance.name}_columns_table tbody`);
2252
- if (columnsTableBody) {
2253
- sortable.create(columnsTableBody, {
2254
- handle: '.sortHandle',
2255
- dragClass: 'tek-grid-columns-button-sortable-drag',
2256
- onEnd: sortEnd,
2257
- });
2258
- }
2259
- });
2260
- });
2261
- const gridGroupColumnNames = computed(() => {
2262
- return instance.iterableComponent.columns.filter((column) => column.grouped).map((column) => column.name) || [];
2263
- });
2264
- const sortEnd = (event) => {
2265
- const grid = instance.iterableComponent;
2266
- const newOrder = Array.from(event.srcElement.querySelectorAll('tr')).map((row) => row.getAttribute('name'));
2267
- const groupColumnNames = [];
2268
- const newColumns = newOrder.map((columnName) => {
2269
- const column = grid.getColumn(columnName);
2270
- if (column.grouped) {
2271
- groupColumnNames.push(columnName);
2272
- }
2273
- return column;
2274
- });
2275
- const ignoredColumns = grid.columns.filter((column) => instance.ignoreColumns.indexOf(column.name) !== -1);
2276
- grid.columns = newColumns.concat(ignoredColumns);
2277
- if (grid.updateGrouping && JSON.stringify(groupColumnNames) !== JSON.stringify(gridGroupColumnNames)) {
2278
- grid.updateGrouping();
2279
- }
2280
- grid.changeLayout();
2281
- };
2282
- const moreOptions = () => {
2283
- TekGridColumnsOptionsModal.show(instance);
2284
- };
2285
- const close = () => {
2286
- menuIsOpened.value = false;
2287
- };
2288
- return Object.assign(Object.assign({}, buttonScope), { instance,
2289
- root,
2290
- menuIsOpened,
2291
- moreOptions,
2292
- close,
2293
- teste,
2294
- mergeProps });
2295
- },
2296
- });
2297
-
2298
- const _hoisted_1$3 = { class: "tek-grid-columns-button-table-wrapper zd-mb-2" };
2299
- const _hoisted_2$1 = ["id"];
2300
- const _hoisted_3 = { key: 0 };
2301
- const _hoisted_4 = { key: 1 };
2302
- const _hoisted_5 = ["name"];
2303
- const _hoisted_6 = { class: "tek-grid-columns-button-column-name sortHandle" };
2304
- const _hoisted_7 = { key: 0 };
2305
- const _hoisted_8 = {
2306
- key: 1,
2307
- class: "tek-grid-columns-button-column-aggregation"
2308
- };
2309
- const _hoisted_9 = { class: "tek-grid-columns-button-table-footer" };
2310
-
2311
- function render$7(_ctx, _cache, $props, $setup, $data, $options) {
2312
- const _component_zd_activator_wrapper = resolveComponent("zd-activator-wrapper");
2313
- const _component_v_tooltip = resolveComponent("v-tooltip");
2314
- const _component_zd_checkbox = resolveComponent("zd-checkbox");
2315
- const _component_zd_select = resolveComponent("zd-select");
2316
- const _component_zd_button = resolveComponent("zd-button");
2317
- const _component_v_card = resolveComponent("v-card");
2318
- const _component_v_menu = resolveComponent("v-menu");
2319
-
2320
- return (openBlock(), createBlock(_component_v_menu, {
2321
- id: _ctx.instance.name,
2322
- modelValue: _ctx.menuIsOpened,
2323
- "onUpdate:modelValue": _cache[2] || (_cache[2] = $event => ((_ctx.menuIsOpened) = $event)),
2324
- class: normalizeClass(['zd-iterable-columns-button', 'tek-grid-columns-button', _ctx.instance.cssClass]),
2325
- style: normalizeStyle(_ctx.instance.cssStyle),
2326
- closeOnContentClick: false,
2327
- "offset-y": "",
2328
- "content-class": "zd-iterable-columns-button-options tek-grid-columns-button-options"
2329
- }, {
2330
- activator: withCtx(({ props: onMenu }) => [
2331
- createVNode(_component_v_tooltip, { bottom: "" }, {
2332
- activator: withCtx(({ props: onTooltip }) => [
2333
- createVNode(_component_zd_activator_wrapper, mergeProps({
2334
- "child-props": {
2335
- component: 'ZdButton',
2336
- name: _ctx.instance.name,
2337
- instanceObject: _ctx.instance,
2338
- }
2339
- }, _ctx.mergeProps(onMenu, onTooltip)), null, 16 /* FULL_PROPS */, ["child-props"])
2340
- ]),
2341
- default: withCtx(() => [
2342
- createElementVNode("span", null, toDisplayString(_ctx.$t('TEKGRID_COLUMNS')), 1 /* TEXT */)
2343
- ]),
2344
- _: 2 /* DYNAMIC */
2345
- }, 1024 /* DYNAMIC_SLOTS */)
2346
- ]),
2347
- default: withCtx(() => [
2348
- createVNode(_component_v_card, { class: "zd-pa-2" }, {
2349
- default: withCtx(() => [
2350
- createElementVNode("div", _hoisted_1$3, [
2351
- createElementVNode("table", {
2352
- class: "tek-grid-columns-button-table",
2353
- id: _ctx.instance.name + '_columns_table'
2354
- }, [
2355
- createElementVNode("thead", null, [
2356
- createElementVNode("tr", null, [
2357
- _cache[3] || (_cache[3] = createElementVNode("th", null, [
2358
- createCommentVNode("Name")
2359
- ], -1 /* CACHED */)),
2360
- createElementVNode("th", null, toDisplayString(_ctx.$t('TEKGRID_COLUMN_VISIBLE')), 1 /* TEXT */),
2361
- (!_ctx.instance.hideGroups)
2362
- ? (openBlock(), createElementBlock("th", _hoisted_3, toDisplayString(_ctx.$t('TEKGRID_COLUMN_GROUPED')), 1 /* TEXT */))
2363
- : createCommentVNode("v-if", true),
2364
- (!_ctx.instance.hideGroups)
2365
- ? (openBlock(), createElementBlock("th", _hoisted_4, toDisplayString(_ctx.$t('TEKGRID_COLUMN_AGGREGATION')), 1 /* TEXT */))
2366
- : createCommentVNode("v-if", true)
2367
- ])
2368
- ]),
2369
- createElementVNode("tbody", null, [
2370
- (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.instance.filteredColumns(), (column) => {
2371
- return (openBlock(), createElementBlock("tr", {
2372
- key: column.name,
2373
- name: column.name
2374
- }, [
2375
- createElementVNode("td", _hoisted_6, [
2376
- _cache[4] || (_cache[4] = createElementVNode("span", null, "⦙⦙", -1 /* CACHED */)),
2377
- createTextVNode(toDisplayString(_ctx.$t(column.label)), 1 /* TEXT */)
2378
- ]),
2379
- createElementVNode("td", null, [
2380
- createVNode(_component_zd_checkbox, {
2381
- name: _ctx.instance.name + '_column_visible_' + column.name,
2382
- value: column.grouped || column.isVisible,
2383
- events: {
2384
- change: _ctx.instance.controller.showHideTekColumn.bind(_ctx.instance.controller, column)
2385
- }
2386
- }, null, 8 /* PROPS */, ["name", "value", "events"])
2387
- ]),
2388
- (!_ctx.instance.hideGroups)
2389
- ? (openBlock(), createElementBlock("td", _hoisted_7, [
2390
- (column.type !== 'action')
2391
- ? (openBlock(), createBlock(_component_zd_checkbox, {
2392
- key: 0,
2393
- name: _ctx.instance.name + '_column_grouped_' + column.name,
2394
- value: column.grouped,
2395
- events: {
2396
- change: _ctx.instance.controller.changeGroupedColumn.bind(_ctx.instance.controller, column)
2397
- }
2398
- }, null, 8 /* PROPS */, ["name", "value", "events"]))
2399
- : createCommentVNode("v-if", true)
2400
- ]))
2401
- : createCommentVNode("v-if", true),
2402
- (!_ctx.instance.hideGroups)
2403
- ? (openBlock(), createElementBlock("td", _hoisted_8, [
2404
- (column.type !== 'action')
2405
- ? (openBlock(), createBlock(_component_zd_select, mergeProps({
2406
- key: 0,
2407
- name: _ctx.instance.name + '_column_aggregation_' + column.name
2408
- }, { ref_for: true }, {
2409
- value: column.aggregation,
2410
- disabled: column.grouped || !column.isVisible,
2411
- events: {
2412
- change: _ctx.instance.controller.changeAggregationColumn.bind(_ctx.instance.controller, column)
2413
- },
2414
- dataText: 'text',
2415
- dataValue: 'value',
2416
- autocomplete: false,
2417
- showHelper: false,
2418
- showLabel: false,
2419
- datasource: {
2420
- data: _ctx.instance.getAggregationSelectData(),
2421
- },
2422
- }), null, 16 /* FULL_PROPS */, ["name"]))
2423
- : createCommentVNode("v-if", true)
2424
- ]))
2425
- : createCommentVNode("v-if", true)
2426
- ], 8 /* PROPS */, _hoisted_5))
2427
- }), 128 /* KEYED_FRAGMENT */))
2428
- ])
2429
- ], 8 /* PROPS */, _hoisted_2$1)
2430
- ]),
2431
- createElementVNode("div", _hoisted_9, [
2432
- createVNode(_component_zd_button, {
2433
- name: _ctx.instance.name + '_columns_table_footer_button',
2434
- label: "TEKGRID_MORE_OPTIONS",
2435
- small: "",
2436
- outline: "",
2437
- cssClass: "zd-ma-2 zd-mr-1",
2438
- onClick: _cache[0] || (_cache[0] = $event => (_ctx.moreOptions()))
2439
- }, null, 8 /* PROPS */, ["name"]),
2440
- createVNode(_component_zd_button, {
2441
- name: _ctx.instance.name + '_columns_table_footer_close',
2442
- label: "TEKGRID_CLOSE",
2443
- small: "",
2444
- cssClass: "zd-ma-2 zd-ml-1",
2445
- onClick: _cache[1] || (_cache[1] = $event => (_ctx.close()))
2446
- }, null, 8 /* PROPS */, ["name"])
2447
- ])
2448
- ]),
2449
- _: 1 /* STABLE */
2450
- })
2451
- ]),
2452
- _: 1 /* STABLE */
2453
- }, 8 /* PROPS */, ["id", "modelValue", "class", "style"]))
2454
- }
2455
-
2456
- tekGridColumnsButton$1.render = render$7;
2457
- tekGridColumnsButton$1.__file = "src/components/tek-grid/columns-button/TekGridColumnsButton.vue";
2458
-
2459
- const TekGridFilterButtonProps$1 = Object.assign(Object.assign({}, ZdButtonProps), { gridName: {
2460
- type: String,
2461
- default: '',
2462
- }, grid: {
2463
- type: [Object, String],
2464
- default: () => { },
2465
- }, showCheckboxAll: {
2466
- type: [Boolean, String],
2467
- default: false,
2468
- } });
2469
- const tekGridFilterButtonComponent$1 = defineComponent({
2470
- props: TekGridFilterButtonProps$1,
2471
- inheritAttrs: false,
2472
- setup(props, ctx) {
2473
- const { instance, root } = useCreateInstance(props, ctx, TekGridFilterButton);
2474
- const buttonScope = useButtonInstance({ instance, root });
2475
- const filterClick = ({ event }) => {
2476
- instance.click(event);
2477
- };
2478
- return Object.assign(Object.assign({}, buttonScope), { instance,
2479
- root,
2480
- filterClick });
2481
- },
2482
- });
2483
-
2484
- function render$6(_ctx, _cache, $props, $setup, $data, $options) {
2485
- const _component_zd_button = resolveComponent("zd-button");
2486
-
2487
- return (openBlock(), createBlock(_component_zd_button, mergeProps({
2488
- id: `instance.name`,
2489
- name: `${_ctx.instance.name}_name`
2490
- }, {
2491
- icon: true,
2492
- cssClass: 'tek-grid-filter-button',
2493
- iconName: 'mdi-filter',
2494
- isVisible: _ctx.instance.grid.filterButton,
2495
- events: {
2496
- click: _ctx.filterClick,
2497
- },
2498
- }), null, 16 /* FULL_PROPS */, ["name"]))
2499
- }
2500
-
2501
- tekGridFilterButtonComponent$1.render = render$6;
2502
- tekGridFilterButtonComponent$1.__file = "src/components/tek-grid/filter-button/TekGridFilterButton.vue";
2503
-
2504
- var script$2 = defineComponent({
2505
- props: {
2506
- showDivider: {
2507
- type: Boolean,
2508
- default: true,
2509
- },
2510
- level: {
2511
- type: Number,
2512
- default: 0,
2513
- },
2514
- footer: {
2515
- type: Boolean,
2516
- default: false,
2517
- },
2518
- },
2519
- setup() {
2520
- return {};
2521
- },
2522
- });
2523
-
2524
- function render$5(_ctx, _cache, $props, $setup, $data, $options) {
2525
- return (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.level, (n) => {
2526
- return (openBlock(), createElementBlock("span", {
2527
- key: n,
2528
- class: normalizeClass([
2529
- 'tek-grid-indentation',
2530
- {
2531
- 'tek-grid-indentation--corner': _ctx.footer && n === _ctx.level,
2532
- 'tek-grid-indentation--divider': _ctx.showDivider,
2533
- }
2534
- ])
2535
- }, null, 2 /* CLASS */))
2536
- }), 128 /* KEYED_FRAGMENT */))
2537
- }
2538
-
2539
- script$2.render = render$5;
2540
- script$2.__file = "src/components/tek-grid/indentation/TekGridIndentation.vue";
2541
-
2542
- const TekGridLayoutOptionsProps$1 = Object.assign({}, ZdComponentRenderProps);
2543
- const layoutOptionsComponent$1 = defineComponent({
2544
- props: TekGridLayoutOptionsProps$1,
2545
- inheritAttrs: false,
2546
- setup(props, ctx) {
2547
- const { instance, root } = useCreateInstance(props, ctx, TekGridLayoutOptions);
2548
- const { applyLayout: applyTekGridLayout, getColumnElements, getTableWidth } = useTableLayout();
2549
- onMounted(() => {
2550
- instance.viewApplyLayout = applyLayout;
2551
- instance.viewGetCurrentLayout = getCurrentLayout;
2552
- });
2553
- const confirmLayoutClick = ({ component }) => {
2554
- const layoutName = component.value;
2555
- if (layoutName) {
2556
- const newLayout = getCurrentLayout(layoutName);
2557
- instance.newLayout(newLayout);
2558
- }
2559
- menuActive.value = false;
2560
- component.value = '';
2561
- };
2562
- const datasourceDynamicFilter = () => {
2563
- const datasource = instance.grid.datasource;
2564
- if (datasource instanceof TekRestDatasource)
2565
- return datasource.dynamicFilter;
2566
- return {};
2567
- };
2568
- const changeLayout = (layout) => {
2569
- instance.updateLayout(layout.name, getCurrentLayout(layout.name));
2570
- };
2571
- const applyLayout = (layout) => {
2572
- const defaultLayout = {
2573
- originalDatasourceOrder: instance.originalDatasourceOrder,
2574
- originalDatasourceFilter: instance.originalDatasourceFilter,
2575
- originalColumnProps: instance.originalColumnProps,
2576
- originalDatasourceDynamicFilter: instance.originalDatasourceDynamicFilter,
2577
- };
2578
- applyTekGridLayout({ layout, defaultLayout, changeLayoutCallback: changeLayout });
2579
- menuActive.value = false;
2580
- };
2581
- const getCurrentLayout = (layoutName) => {
2582
- const { grid } = instance;
2583
- const gridWidth = getTableWidth();
2584
- const columnElementsDict = getColumnElements();
2585
- return {
2586
- name: layoutName,
2587
- gridWidth,
2588
- order: grid.datasource.order,
2589
- filter: grid.datasource.filter,
2590
- dynamicFilter: datasourceDynamicFilter(),
2591
- columns: grid.columns.map((column, index) => {
2592
- const columnElement = columnElementsDict[index];
2593
- return {
2594
- name: column.name,
2595
- label: column.label,
2596
- align: column.align,
2597
- width: columnElement ? window.getComputedStyle(columnElement).width : 'unset',
2598
- minWidth: column.minWidth,
2599
- maxWidth: column.maxWidth,
2600
- isVisible: column.isVisible,
2601
- fixed: column.fixed,
2602
- grouped: column.grouped,
2603
- groupOpened: column.groupOpened,
2604
- aggregation: column.aggregation,
2605
- filterHelperValue: instance.getHelperValue(column),
2606
- };
2607
- }),
2608
- };
2609
- };
2610
- const menuActive = ref(false);
2611
- const applyOrUpdateLayout = (event, layoutName) => {
2612
- if (instance.layoutEdited) {
2613
- instance.updateLayout(layoutName, getCurrentLayout(layoutName));
2614
- event.stopImmediatePropagation();
2615
- menuActive.value = false;
2616
- }
2617
- else {
2618
- instance.applyLayout(layoutName);
2619
- }
2620
- };
2621
- const deleteLayout = (event, layoutName) => {
2622
- instance.deleteLayout(layoutName);
2623
- event.stopImmediatePropagation();
2624
- };
2625
- return {
2626
- instance,
2627
- root,
2628
- menuActive,
2629
- confirmLayoutClick,
2630
- applyOrUpdateLayout,
2631
- deleteLayout,
2632
- mergeProps,
2633
- };
2634
- },
2635
- });
2636
-
2637
- const _hoisted_1$2 = {
2638
- key: 0,
2639
- class: "tek-grid-layout-item-buttons"
2640
- };
2641
-
2642
- function render$4(_ctx, _cache, $props, $setup, $data, $options) {
2643
- const _component_zd_activator_wrapper = resolveComponent("zd-activator-wrapper");
2644
- const _component_v_badge = resolveComponent("v-badge");
2645
- const _component_v_tooltip = resolveComponent("v-tooltip");
2646
- const _component_v_list_item = resolveComponent("v-list-item");
2647
- const _component_zd_text_input = resolveComponent("zd-text-input");
2648
- const _component_zd_button = resolveComponent("zd-button");
2649
- const _component_v_list = resolveComponent("v-list");
2650
- const _component_v_menu = resolveComponent("v-menu");
2651
-
2652
- return (openBlock(), createBlock(_component_v_menu, {
2653
- id: _ctx.instance.name,
2654
- name: _ctx.instance.name,
2655
- class: normalizeClass(['tek-grid-layout-options', _ctx.instance.cssClass]),
2656
- style: normalizeStyle(_ctx.instance.cssStyle),
2657
- modelValue: _ctx.menuActive,
2658
- "onUpdate:modelValue": _cache[2] || (_cache[2] = $event => ((_ctx.menuActive) = $event)),
2659
- "offset-y": "",
2660
- closeOnContentClick: false
2661
- }, {
2662
- activator: withCtx(({ props: onMenu }) => [
2663
- createVNode(_component_v_tooltip, { bottom: "" }, {
2664
- activator: withCtx(({ props: onTooltip }) => [
2665
- withDirectives(createVNode(_component_v_badge, {
2666
- overlap: "",
2667
- class: "tek-grid-layout-options-badge",
2668
- dot: "",
2669
- offsetX: 12,
2670
- offsetY: 12,
2671
- value: _ctx.instance.layoutEdited
2672
- }, {
2673
- default: withCtx(() => [
2674
- createVNode(_component_zd_activator_wrapper, mergeProps({ ref: "root" }, _ctx.mergeProps(onMenu, onTooltip), {
2675
- "child-props": {
2676
- component: 'ZdButton',
2677
- name: _ctx.instance.name + '_button',
2678
- icon: true,
2679
- iconName: 'mdi-table-star',
2680
- isVisible: _ctx.instance.isVisible,
2681
- }
2682
- }), null, 16 /* FULL_PROPS */, ["child-props"])
2683
- ]),
2684
- _: 2 /* DYNAMIC */
2685
- }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["value"]), [
2686
- [vShow, _ctx.instance.isVisible]
2687
- ])
2688
- ]),
2689
- default: withCtx(() => [
2690
- createElementVNode("span", null, toDisplayString(_ctx.$t('LAYOUT') + (_ctx.instance.currentLayoutName || _ctx.$t('DEFAULT_LAYOUT'))), 1 /* TEXT */)
2691
- ]),
2692
- _: 2 /* DYNAMIC */
2693
- }, 1024 /* DYNAMIC_SLOTS */)
2694
- ]),
2695
- default: withCtx(() => [
2696
- createVNode(_component_v_list, null, {
2697
- default: withCtx(() => [
2698
- createVNode(_component_v_list_item, {
2699
- class: normalizeClass(['tek-grid-layout-item-header', { edited: _ctx.instance.layoutEdited }])
2700
- }, {
2701
- default: withCtx(() => [
2702
- createTextVNode(toDisplayString(_ctx.instance.layoutEdited ? _ctx.$t('LAYOUT_MODIFIED') : _ctx.$t('LAYOUT_NOT_MODIFIED')), 1 /* TEXT */)
2703
- ]),
2704
- _: 1 /* STABLE */
2705
- }, 8 /* PROPS */, ["class"]),
2706
- createVNode(_component_v_list_item, null, {
2707
- default: withCtx(() => [
2708
- createVNode(_component_zd_text_input, mergeProps({
2709
- name: _ctx.instance.name+'_new_layout',
2710
- ref: "inputNewLayout"
2711
- }, {
2712
- showHelper: false,
2713
- showLabel: false,
2714
- placeholder: 'NEW_LAYOUT',
2715
- appendOuterIcon: 'mdi-check',
2716
- autofocus: true,
2717
- autofill: false,
2718
- keyMap: {
2719
- enter: {
2720
- event: _ctx.confirmLayoutClick,
2721
- input: true,
2722
- active: true,
2723
- },
2724
- },
2725
- events: {
2726
- appendOuterIconClick: _ctx.confirmLayoutClick,
2727
- },
2728
- }), null, 16 /* FULL_PROPS */, ["name"])
2729
- ]),
2730
- _: 1 /* STABLE */
2731
- }),
2732
- (!_ctx.instance.layoutEdited)
2733
- ? (openBlock(), createBlock(_component_v_list_item, {
2734
- key: 0,
2735
- class: normalizeClass(['tek-grid-layout-item', {
2736
- selected: _ctx.instance.currentLayoutName === ''
2737
- }]),
2738
- onClick: _cache[0] || (_cache[0] = $event => (_ctx.instance.applyLayout('')))
2739
- }, {
2740
- default: withCtx(() => [
2741
- createTextVNode(toDisplayString(_ctx.$t('DEFAULT_LAYOUT')), 1 /* TEXT */)
2742
- ]),
2743
- _: 1 /* STABLE */
2744
- }, 8 /* PROPS */, ["class"]))
2745
- : createCommentVNode("v-if", true),
2746
- (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.instance.layoutNames, (item) => {
2747
- return (openBlock(), createBlock(_component_v_list_item, {
2748
- key: item,
2749
- class: normalizeClass(['tek-grid-layout-item', {
2750
- selected: item === _ctx.instance.currentLayoutName
2751
- }]),
2752
- onClick: $event => (_ctx.applyOrUpdateLayout($event, item))
2753
- }, {
2754
- default: withCtx(() => [
2755
- createTextVNode(toDisplayString(item) + " ", 1 /* TEXT */),
2756
- (!_ctx.instance.layoutEdited)
2757
- ? (openBlock(), createElementBlock("span", _hoisted_1$2, [
2758
- createVNode(_component_zd_button, mergeProps({
2759
- name: 'tek-grid-layout-item-delete_' + _ctx.instance.name + item
2760
- }, { ref_for: true }, {
2761
- small: true,
2762
- icon: true,
2763
- iconName: 'mdi-trash-can-outline',
2764
- events: {
2765
- click: ({ event }) => { _ctx.deleteLayout(event, item); },
2766
- },
2767
- }), null, 16 /* FULL_PROPS */, ["name"])
2768
- ]))
2769
- : createCommentVNode("v-if", true)
2770
- ]),
2771
- _: 2 /* DYNAMIC */
2772
- }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["class", "onClick"]))
2773
- }), 128 /* KEYED_FRAGMENT */)),
2774
- (_ctx.instance.layoutEdited)
2775
- ? (openBlock(), createBlock(_component_v_list_item, {
2776
- key: 1,
2777
- class: normalizeClass(['tek-grid-layout-item-discard']),
2778
- onClick: _cache[1] || (_cache[1] = $event => (_ctx.instance.discardChanges()))
2779
- }, {
2780
- default: withCtx(() => [
2781
- createVNode(_component_zd_button, {
2782
- small: "",
2783
- color: "error darken-2",
2784
- width: "100%",
2785
- name: "tek-grid-layout-item-discard-changes",
2786
- label: "LAYOUT_DISCART_CHANGES"
2787
- })
2788
- ]),
2789
- _: 1 /* STABLE */
2790
- }))
2791
- : createCommentVNode("v-if", true)
2792
- ]),
2793
- _: 1 /* STABLE */
2794
- })
2795
- ]),
2796
- _: 1 /* STABLE */
2797
- }, 8 /* PROPS */, ["id", "name", "class", "style", "modelValue"]))
2798
- }
2799
-
2800
- layoutOptionsComponent$1.render = render$4;
2801
- layoutOptionsComponent$1.__file = "src/components/tek-grid/layout-options/TekGridLayoutOptions.vue";
2802
-
2803
- var script$1 = defineComponent({
2804
- props: {
2805
- isSelected: {
2806
- type: Boolean,
2807
- required: true,
2808
- },
2809
- selectable: {
2810
- type: Boolean,
2811
- required: true,
2812
- },
2813
- selectionDisabled: {
2814
- type: Boolean,
2815
- required: true,
2816
- },
2817
- cellSelection: {
2818
- type: Boolean,
2819
- required: true,
2820
- },
2821
- isCurrent: {
2822
- type: Function,
2823
- required: true,
2824
- },
2825
- columns: {
2826
- type: Array,
2827
- required: true,
2828
- },
2829
- row: {
2830
- type: Object,
2831
- required: true,
2832
- },
2833
- fixedLeft: {
2834
- type: Object,
2835
- required: true,
2836
- },
2837
- fixedRight: {
2838
- type: Object,
2839
- required: true,
2840
- },
2841
- },
2842
- emits: ['focusin'],
2843
- setup(props, { emit }) {
2844
- const focusin = (event) => {
2845
- emit('focusin', { event, row: props.row });
2846
- };
2847
- const getLevel = (row) => {
2848
- if (!row.groupHeaders)
2849
- return 0;
2850
- const { length } = row.groupHeaders;
2851
- return length + 1;
2852
- };
2853
- return {
2854
- focusin,
2855
- getLevel,
2856
- };
2857
- },
2858
- });
2859
-
2860
- const _hoisted_1$1 = {
2861
- key: 0,
2862
- class: /*@__PURE__*/normalizeClass([
2863
- 'zd-grid__cell',
2864
- 'zd-grid__cell--fixed',
2865
- 'zd-grid__selectable-cell',
2866
- ])
2867
- };
2868
-
2869
- function render$3(_ctx, _cache, $props, $setup, $data, $options) {
2870
- const _component_tek_grid_indentation = resolveComponent("tek-grid-indentation");
2871
- const _component_zd_grid_cell = resolveComponent("zd-grid-cell");
2872
- const _component_table_row = resolveComponent("table-row");
2873
-
2874
- return (openBlock(), createBlock(_component_table_row, {
2875
- cssClass: [
2876
- 'tek-grid-footer-row',
2877
- { 'tek-grid-footer-row--summary': _ctx.row.groupSummary }
2878
- ]
2879
- }, {
2880
- default: withCtx(() => [
2881
- (_ctx.selectable)
2882
- ? (openBlock(), createElementBlock("td", _hoisted_1$1))
2883
- : createCommentVNode("v-if", true),
2884
- (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.columns, (column, index, ___, _cached) => {
2885
- const _memo = ([_ctx.row, column, _ctx.fixedLeft, _ctx.fixedRight, _ctx.cellSelection, _ctx.isCurrent({ row: _ctx.row, column })]);
2886
- if (_cached && _cached.key === column.name && isMemoSame(_cached, _memo)) return _cached
2887
- const _item = (openBlock(), createBlock(_component_zd_grid_cell, {
2888
- key: column.name,
2889
- row: _ctx.row,
2890
- column: column,
2891
- cssClass: [
2892
- {
2893
- 'zd-grid__cell--fixed': column.fixed,
2894
- 'zd-grid__action-cell--fixed': column.actionFixed,
2895
- },
2896
- ],
2897
- cssStyle: [{
2898
- left: column.fixed ? _ctx.fixedLeft[column.name] : 'unset',
2899
- right: column.actionFixed ? _ctx.fixedRight[column.name] : 'unset',
2900
- }],
2901
- cellSelection: _ctx.cellSelection,
2902
- isCurrent: _ctx.isCurrent({ row: _ctx.row, column }),
2903
- onFocus: $event => (_ctx.cellFocus($event, column)),
2904
- onFocusin: $event => (_ctx.focusin($event, column))
2905
- }, {
2906
- prepend: withCtx(() => [
2907
- (index === 0)
2908
- ? (openBlock(), createBlock(_component_tek_grid_indentation, {
2909
- key: 0,
2910
- footer: "",
2911
- level: _ctx.getLevel(_ctx.row)
2912
- }, null, 8 /* PROPS */, ["level"]))
2913
- : createCommentVNode("v-if", true)
2914
- ]),
2915
- _: 2 /* DYNAMIC */
2916
- }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["row", "column", "cssClass", "cssStyle", "cellSelection", "isCurrent", "onFocus", "onFocusin"]));
2917
- _item.memo = _memo;
2918
- return _item
2919
- }, _cache, 0), 128 /* KEYED_FRAGMENT */))
2920
- ]),
2921
- _: 1 /* STABLE */
2922
- }, 8 /* PROPS */, ["cssClass"]))
2923
- }
2924
-
2925
- script$1.render = render$3;
2926
- script$1.__file = "src/components/tek-grid/row/TekGridFooterRow.vue";
2927
-
2928
- var script = defineComponent({
2929
- props: {
2930
- isSelected: {
2931
- type: Boolean,
2932
- required: true,
2933
- },
2934
- isCurrentRow: {
2935
- type: Boolean,
2936
- required: true,
2937
- },
2938
- selectable: {
2939
- type: Boolean,
2940
- required: true,
2941
- },
2942
- selectionDisabled: {
2943
- type: Boolean,
2944
- required: true,
2945
- },
2946
- cellSelection: {
2947
- type: Boolean,
2948
- required: true,
2949
- },
2950
- isCurrent: {
2951
- type: Function,
2952
- required: true,
2953
- },
2954
- row: {
2955
- type: Object,
2956
- required: true,
2957
- },
2958
- indeterminate: {
2959
- type: Boolean,
2960
- required: true,
2961
- },
2962
- },
2963
- emits: ['click', 'checkboxClick', 'focusin', 'expandClick'],
2964
- setup(props, { emit }) {
2965
- const click = (event) => {
2966
- emit('click', event);
2967
- };
2968
- const checkboxClick = (event) => {
2969
- emit('checkboxClick', event);
2970
- };
2971
- const focusin = (event) => {
2972
- emit('focusin', { event, row: props.row });
2973
- };
2974
- const expandClick = (event) => {
2975
- emit('expandClick', { event, row: props.row });
2976
- };
2977
- return {
2978
- click,
2979
- focusin,
2980
- checkboxClick,
2981
- expandClick,
2982
- };
2983
- },
2984
- });
2985
-
2986
- const _hoisted_1 = ["tabindex"];
2987
- const _hoisted_2 = { class: "tek-grid__group-text zd-ml-2" };
2988
-
2989
- function render$2(_ctx, _cache, $props, $setup, $data, $options) {
2990
- const _component_zd_grid_checkbox = resolveComponent("zd-grid-checkbox");
2991
- const _component_tek_grid_indentation = resolveComponent("tek-grid-indentation");
2992
- const _component_v_icon = resolveComponent("v-icon");
2993
- const _component_table_row = resolveComponent("table-row");
2994
-
2995
- return (openBlock(), createBlock(_component_table_row, {
2996
- class: normalizeClass([
2997
- 'tek-grid-group-row',
2998
- { 'tek-grid-row-group--summary': _ctx.row.groupSummary }
2999
- ]),
3000
- isCurrentRow: _ctx.isCurrentRow,
3001
- onClick: _cache[3] || (_cache[3] = $event => (_ctx.click($event)))
3002
- }, {
3003
- default: withCtx(() => [
3004
- (_ctx.selectable)
3005
- ? (openBlock(), createBlock(_component_zd_grid_checkbox, {
3006
- key: 0,
3007
- disabled: _ctx.selectionDisabled,
3008
- isSelected: _ctx.isSelected,
3009
- indeterminate: _ctx.indeterminate,
3010
- cellSelection: _ctx.cellSelection,
3011
- isCurrent: _ctx.isCurrent({ row: _ctx.row }),
3012
- onFocusin: _cache[0] || (_cache[0] = $event => (_ctx.focusin($event))),
3013
- onClick: _cache[1] || (_cache[1] = withModifiers($event => (_ctx.checkboxClick($event)), ["stop"]))
3014
- }, null, 8 /* PROPS */, ["disabled", "isSelected", "indeterminate", "cellSelection", "isCurrent"]))
3015
- : createCommentVNode("v-if", true),
3016
- createElementVNode("td", {
3017
- colspan: 999,
3018
- class: normalizeClass(
3019
- [
3020
- 'zd-grid__cell',
3021
- 'text-left',
3022
- 'tek-grid-group-cell',
3023
- 'zd-grid__cell--fixed',
3024
- ]),
3025
- style: normalizeStyle(`left: ${(_ctx.selectable ? 40 : 0)}px`),
3026
- tabindex: _ctx.cellSelection ? 0 : ''
3027
- }, [
3028
- createElementVNode("span", {
3029
- class: normalizeClass([
3030
- 'tek-grid-group-cell__container'
3031
- ]),
3032
- style: normalizeStyle(`left: ${(_ctx.selectable ? 48 : 8)}px`)
3033
- }, [
3034
- createVNode(_component_tek_grid_indentation, {
3035
- level: _ctx.row.groupHeaders.length
3036
- }, null, 8 /* PROPS */, ["level"]),
3037
- (openBlock(), createBlock(_component_v_icon, {
3038
- class: normalizeClass({ closed: !_ctx.row.groupOpened }),
3039
- onClick: _cache[2] || (_cache[2] = $event => (_ctx.expandClick($event))),
3040
- key: `${_ctx.row.groupIndex}_${_ctx.row.groupValue}`
3041
- }, {
3042
- default: withCtx(() => [
3043
- createTextVNode(toDisplayString(_ctx.$getIcon('expand')), 1 /* TEXT */)
3044
- ]),
3045
- _: 1 /* STABLE */
3046
- }, 8 /* PROPS */, ["class"])),
3047
- createElementVNode("span", _hoisted_2, toDisplayString((_ctx.row.groupLabel? _ctx.row.groupLabel + ': ': '') + _ctx.row.groupValue), 1 /* TEXT */)
3048
- ], 4 /* STYLE */)
3049
- ], 12 /* STYLE, PROPS */, _hoisted_1)
3050
- ]),
3051
- _: 1 /* STABLE */
3052
- }, 8 /* PROPS */, ["class", "isCurrentRow"]))
3053
- }
3054
-
3055
- script.render = render$2;
3056
- script.__file = "src/components/tek-grid/row/TekGridGroupRow.vue";
3057
-
3058
- const TekUserInfoProps$1 = Object.assign(Object.assign({}, ZdUserInfoProps), { aboutImage: {
3059
- type: String,
3060
- default: '',
3061
- }, defaultEmail: {
3062
- type: String,
3063
- default: '',
3064
- }, versionInfo: {
3065
- type: [Object, String],
3066
- default: null,
3067
- }, versionUrl: {
3068
- type: String,
3069
- default: '',
3070
- }, bottomSlot: {
3071
- type: Array,
3072
- default: undefined,
3073
- } });
3074
- const tekUserInfoComponent$1 = defineComponent({
3075
- props: TekUserInfoProps$1,
3076
- inheritAttrs: false,
3077
- setup(props, ctx) {
3078
- const { instance, root } = useCreateInstance(props, ctx, TekUserInfo);
3079
- const { click, focus, blur, mouseenter, mouseleave } = useGetMethods(instance, root);
3080
- return {
3081
- instance,
3082
- root,
3083
- click,
3084
- focus,
3085
- blur,
3086
- mouseenter,
3087
- mouseleave,
3088
- };
3089
- }
3090
- });
3091
-
3092
- function render$1(_ctx, _cache, $props, $setup, $data, $options) {
3093
- const _component_zd_user_info = resolveComponent("zd-user-info");
3094
-
3095
- return (openBlock(), createBlock(_component_zd_user_info, {
3096
- id: _ctx.instance.name,
3097
- "instance-object": _ctx.instance,
3098
- name: "user-info"
3099
- }, null, 8 /* PROPS */, ["id", "instance-object"]))
3100
- }
3101
-
3102
- tekUserInfoComponent$1.render = render$1;
3103
- tekUserInfoComponent$1.__file = "src/components/tek-user-info/TekUserInfo.vue";
3104
-
3105
- const TekUserInfoListProps$1 = Object.assign(Object.assign({}, ZdListProps), { parentName: {
3106
- type: String,
3107
- default: '',
3108
- }, dense: {
3109
- type: [Boolean, String],
3110
- default: true,
3111
- } });
3112
- const tekUserInfoListComponent$1 = defineComponent({
3113
- props: TekUserInfoListProps$1,
3114
- inheritAttrs: false,
3115
- setup(props, ctx) {
3116
- const { instance, root } = useCreateInstance(props, ctx, TekUserInfoList);
3117
- const { click, focus, blur, mouseenter, mouseleave } = useGetMethods(instance, root);
3118
- return {
3119
- instance,
3120
- root,
3121
- click,
3122
- focus,
3123
- blur,
3124
- mouseenter,
3125
- mouseleave,
3126
- };
3127
- }
3128
- });
3129
-
3130
- function render(_ctx, _cache, $props, $setup, $data, $options) {
3131
- const _component_zd_list = resolveComponent("zd-list");
3132
-
3133
- return (openBlock(), createBlock(_component_zd_list, {
3134
- id: _ctx.instance.name,
3135
- "instance-object": _ctx.instance,
3136
- name: "list"
3137
- }, null, 8 /* PROPS */, ["id", "instance-object"]))
3138
- }
3139
-
3140
- tekUserInfoListComponent$1.render = render;
3141
- tekUserInfoListComponent$1.__file = "src/components/tek-user-info/TekUserInfoList.vue";
3142
-
3143
- const TekBreadcrumbHeaderProps = Object.assign(Object.assign({}, ZdComponentRenderProps), { title: {
3144
- type: String,
3145
- default: '',
3146
- }, breadcrumb: {
3147
- type: Object,
3148
- default: {},
3149
- }, rightSlot: {
3150
- type: Array,
3151
- default: () => [],
3152
- } });
3153
- const breadcrumbHeaderComponent = defineComponent({
3154
- props: TekBreadcrumbHeaderProps,
3155
- inheritAttrs: false,
3156
- setup(props, ctx) {
3157
- const { instance, root } = useCreateInstance(props, ctx, BreadcrumbHeader);
3158
- return {
3159
- instance,
3160
- root,
3161
- };
3162
- },
3163
- });
3164
-
3165
- const components = {
3166
- TekBreadcrumbHeader: breadcrumbHeaderComponent$1,
3167
- TekGrid: gridEditableComponent$1,
3168
- TekGridColumnFilter: tekGridColumnFilter$1,
3169
- TekGridHeaderRow: script$3,
3170
- TekGridColumnsButton: tekGridColumnsButton$1,
3171
- TekGridFilterButton: tekGridFilterButtonComponent$1,
3172
- TekGridIndentation: script$2,
3173
- TekGridLayoutOptions: layoutOptionsComponent$1,
3174
- TekGridFooterRow: script$1,
3175
- TekGridGroupRow: script,
3176
- TekUserInfo: tekUserInfoComponent$1,
3177
- TekUserInfoList: tekUserInfoListComponent$1,
3178
- };
3179
-
3180
- const TekGridProps = buildProps(Object.assign(Object.assign({}, ZdGridEditableProps), { toolbarSlot: {
3181
- type: Array,
3182
- default: undefined,
3183
- }, title: {
3184
- type: String,
3185
- default: '',
3186
- }, addButton: {
3187
- type: [Boolean, String],
3188
- default: false,
3189
- }, deleteButton: {
3190
- type: [String, Boolean],
3191
- default: 'none',
3192
- }, columnsButton: {
3193
- type: [Boolean, String],
3194
- default: false,
3195
- }, columnsButtonIgnore: {
3196
- type: [Array, String],
3197
- default: () => [],
3198
- }, showEditButtons: {
3199
- type: [Boolean, String],
3200
- default: true,
3201
- }, filterButton: {
3202
- type: [Boolean, String],
3203
- default: false,
3204
- }, modalFilterProps: {
3205
- type: Object,
3206
- default: () => ({}),
3207
- }, showSearch: {
3208
- type: [Boolean, String],
3209
- default: true,
3210
- }, columnFilterButton: {
3211
- type: [Boolean, String],
3212
- default: false,
3213
- }, hideActions: {
3214
- type: [Boolean, String],
3215
- default: false,
3216
- }, actions: {
3217
- type: Array,
3218
- default: () => [],
3219
- }, dragColumns: {
3220
- type: [Boolean, String],
3221
- default: true,
3222
- }, resizeColumns: {
3223
- type: [Boolean, String],
3224
- default: true,
3225
- }, showLayoutOptions: {
3226
- type: [Boolean, String],
3227
- default: true,
3228
- }, showExport: {
3229
- type: [String, Boolean],
3230
- default: false,
3231
- }, showReload: {
3232
- type: [Boolean, String],
3233
- default: true,
3234
- }, exportConfig: {
3235
- type: Array,
3236
- }, exportActions: {
3237
- type: Array,
3238
- }, groupsOpened: {
3239
- type: [Boolean, String],
3240
- default: false,
3241
- }, showSummaryTotal: {
3242
- type: [Boolean, String],
3243
- default: true,
3244
- }, mainGrid: {
3245
- type: [Boolean, String],
3246
- default: true,
3247
- }, xlsDefaultType: {
3248
- type: String,
3249
- default: undefined,
3250
- }, showCheckboxAllFilter: {
3251
- type: [Boolean, String],
3252
- default: Config.gridShowCheckboxAllFilter,
3253
- }, toolbarOpened: {
3254
- type: [Boolean],
3255
- default: true,
3256
- }, defaultFilter: {
3257
- type: Object,
3258
- }, reportTitle: {
3259
- type: String,
3260
- }, editNewRowsOnly: {
3261
- type: [Boolean, String],
3262
- default: false,
3263
- } }));
3264
- const gridEditableComponent = defineComponent({
3265
- props: TekGridProps,
3266
- inheritAttrs: false,
3267
- setup(props, ctx) {
3268
- const { instance, root } = useCreateInstance(props, ctx, TekGrid);
3269
- const renderedData = computed(() => {
3270
- if (instance.isGrouped()) {
3271
- return instance.getGroupedData();
3272
- }
3273
- return instance.getData();
3274
- });
3275
- const visibleData = computed(() => {
3276
- return renderedData.value.filter((row) => instance.isItemVisible(row));
3277
- });
3278
- const gridEditableScope = useGridEditableInstance({ instance, root, renderedData: visibleData });
3279
- const rootEl = getRootElement(root);
3280
- const { visibleColumns } = useGridColumns({
3281
- instance,
3282
- rootEl,
3283
- visibilityCondition: (column) => column.isVisible && !column.grouped,
3284
- });
3285
- provideTableLayout({ instance, rootEl });
3286
- const debouncedDatasourceGet = debounce((instance) => {
3287
- const event = new Event('change', { cancelable: true });
3288
- instance.callEvent('beforeApplyFilter', { component: instance, event });
3289
- if (event.defaultPrevented)
3290
- return;
3291
- const { datasource } = instance;
3292
- if (datasource instanceof TekRestDatasource || datasource instanceof TekMemoryDatasource) {
3293
- datasource.updateDynamicFilter();
3294
- }
3295
- else {
3296
- datasource.get();
3297
- }
3298
- }, 500);
3299
- const filter = computed(() => {
3300
- if (instance.datasource instanceof TekRestDatasource || instance.datasource instanceof TekMemoryDatasource) {
3301
- return instance.datasource.dynamicFilter;
3302
- }
3303
- const datasourceFilter = instance.datasource.filter;
3304
- const simpleFilter = {};
3305
- Object.keys(datasourceFilter).forEach((key) => {
3306
- simpleFilter[key] = [{ relation: 'AND', operation: 'CONTAINS', value: datasourceFilter[key] }];
3307
- });
3308
- return simpleFilter;
3309
- });
3310
- const setFilter = (newFilter) => {
3311
- if (Utils.isEqual(filter, newFilter))
3312
- return;
3313
- if (instance.datasource instanceof TekRestDatasource || instance.datasource instanceof TekMemoryDatasource) {
3314
- instance.datasource.dynamicFilter = cloneDeep(newFilter);
3315
- }
3316
- else {
3317
- const normalFilter = {};
3318
- Object.keys(newFilter).forEach((key) => {
3319
- if (!newFilter[key][0].value)
3320
- return;
3321
- normalFilter[key] = newFilter[key][0].value;
3322
- });
3323
- instance.datasource.filter = normalFilter;
3324
- }
3325
- debouncedDatasourceGet(instance);
3326
- instance.changeLayout();
3327
- };
3328
- const columnHasFilter = (columnName) => {
3329
- return instance.columnHasFilter(columnName);
3330
- };
3331
- const isRowVisible = (row, index) => {
3332
- return instance.isItemVisible(row) && gridEditableScope.shouldRender(index);
3333
- };
3334
- const isCurrentRowGroup = (row) => {
3335
- const { uniqueKey, currentRow } = instance.datasource;
3336
- return !!((row.group && row.groupValue === currentRow.groupValue) ||
3337
- (row[uniqueKey] && row[uniqueKey] === currentRow[uniqueKey]));
3338
- };
3339
- const isGroupSelectIndeterminate = (item) => {
3340
- let hasSelected = false;
3341
- let hasNotSelected = false;
3342
- const { uniqueKey } = instance.datasource;
3343
- item.children.forEach((child) => {
3344
- const idx = instance.selectedRows.findIndex((row) => child[uniqueKey] === row[uniqueKey]);
3345
- hasSelected = hasSelected || idx !== -1;
3346
- hasNotSelected = hasNotSelected || idx === -1;
3347
- });
3348
- return hasSelected && hasNotSelected;
3349
- };
3350
- const isGroupSelected = (item) => {
3351
- return item.children.every((child) => {
3352
- const { uniqueKey } = instance.datasource;
3353
- const idx = instance.selectedRows.findIndex((row) => child[uniqueKey] === row[uniqueKey]);
3354
- return idx !== -1;
3355
- });
3356
- };
3357
- const selectGroupRowClick = (row, isSelected, event) => {
3358
- nextTick(() => {
3359
- const rootElement = getRootElement(root);
3360
- instance.selectGroupClick(row, isSelected, event, rootElement.value);
3361
- });
3362
- };
3363
- const selectGroup = (item, event) => {
3364
- const { uniqueKey } = instance.datasource;
3365
- const isSelected = isGroupSelected(item);
3366
- if (!isSelected) {
3367
- // here we fetch the item from renderedData because vuetify isSelected checks for object reference
3368
- // so we need to find the item inside renderedData to call selectRow() with the correct reference
3369
- // https://github.com/vuetifyjs/vuetify/blob/master/packages/vuetify/src/components/VDataTable/composables/select.ts#L128
3370
- const items = item.children.map((child) => {
3371
- return renderedData.value.find((row) => child[uniqueKey] === row[uniqueKey]);
3372
- });
3373
- items.forEach((child) => {
3374
- if (!child)
3375
- return;
3376
- const idx = instance.selectedRows.findIndex((row) => child[uniqueKey] === row[uniqueKey]);
3377
- if (idx === -1) {
3378
- instance.selectRow(child, true);
3379
- }
3380
- });
3381
- }
3382
- else {
3383
- item.children.forEach((child) => {
3384
- const idx = instance.selectedRows.findIndex((row) => child[uniqueKey] === row[uniqueKey]);
3385
- if (idx !== -1) {
3386
- instance.selectRow(child, false);
3387
- }
3388
- });
3389
- }
3390
- selectGroupRowClick(item, !isSelected, event);
3391
- };
3392
- const openGroup = (item) => {
3393
- instance.openGroup(item);
3394
- };
3395
- const isGroup = (item) => {
3396
- return !!item.group;
3397
- };
3398
- const isFooter = (item) => {
3399
- return !!item.groupFooter;
3400
- };
3401
- const groupColumnNames = computed(() => {
3402
- return instance.columns.filter((column) => column.grouped).map((column) => column.name) || [];
3403
- });
3404
- return Object.assign(Object.assign({}, gridEditableScope), { instance,
3405
- root,
3406
- filter,
3407
- setFilter,
3408
- columnHasFilter,
3409
- visibleColumns,
3410
- isRowVisible,
3411
- isCurrentRowGroup,
3412
- isGroupSelectIndeterminate,
3413
- selectGroup,
3414
- isGroup,
3415
- openGroup,
3416
- renderedData,
3417
- isGroupSelected,
3418
- groupColumnNames,
3419
- isFooter,
3420
- visibleData });
3421
- },
3422
- });
3423
-
3424
- const TekGridColumnFilterProps = {
3425
- hasFilterData: {
3426
- type: Boolean,
3427
- default: false,
3428
- },
3429
- column: {
3430
- type: Object,
3431
- required: true,
3432
- },
3433
- modelValue: {
3434
- type: Array,
3435
- default: [],
3436
- },
3437
- instanceName: {
3438
- type: String,
3439
- required: true,
3440
- },
3441
- filterRelationsDatasource: {
3442
- type: [Object, null],
3443
- required: false,
3444
- },
3445
- filterOperationsDatasource: {
3446
- type: [Object, null],
3447
- required: false,
3448
- },
3449
- isHovering: {
3450
- type: Boolean,
3451
- default: false,
3452
- },
3453
- multiple: {
3454
- type: Boolean,
3455
- required: true,
3456
- },
3457
- };
3458
- const tekGridColumnFilter = defineComponent({
3459
- props: TekGridColumnFilterProps,
3460
- inheritAttrs: false,
3461
- emits: ['update:modelValue'],
3462
- setup(props, ctx) {
3463
- const getValueInputName = (index) => `${props.instanceName}-${props.column.name}-filter-value-${index}`;
3464
- const focusValueInput = (index) => {
3465
- const valueInputName = getValueInputName(index);
3466
- const input = Metadata.getInstance(valueInputName);
3467
- input.setFocus();
3468
- };
3469
- const createNewFilter = () => {
3470
- return reactive({
3471
- operation: 'CONTAINS',
3472
- relation: 'AND',
3473
- value: undefined,
3474
- });
3475
- };
3476
- let newFilter = createNewFilter();
3477
- const convertToDateFormat = (value, revert) => {
3478
- const dateFormat = props.column.componentProps.dateFormat || Config.dateFormat;
3479
- const displayFormat = props.column.componentProps.displayFormat || Config.displayFormat;
3480
- if (revert) {
3481
- if (dayjs(value, displayFormat).isValid() || !dayjs(value, dateFormat).isValid()) {
3482
- return value;
3483
- }
3484
- return dayjs(value, dateFormat).format(displayFormat);
3485
- }
3486
- if (dayjs(value, dateFormat).isValid() || !dayjs(value, displayFormat).isValid()) {
3487
- return value;
3488
- }
3489
- return dayjs(value, displayFormat).format(dateFormat);
3490
- };
3491
- const checkDateValueFormat = (value, revert = false) => {
3492
- if (!['ZdDate', 'ZdDateRange'].includes(props.column.componentProps.component))
3493
- return value;
3494
- if (Array.isArray(value)) {
3495
- return value.map((item) => convertToDateFormat(item, revert));
3496
- }
3497
- return convertToDateFormat(value, revert);
3498
- };
3499
- // use WeakMap to avoid memory leaks
3500
- const idMap = new WeakMap();
3501
- let idCounter = 0;
3502
- // retrieves a unique id for each item
3503
- const getId = (item) => {
3504
- if (!idMap.has(item)) {
3505
- idMap.set(item, `__item__${idCounter++}`);
3506
- }
3507
- return idMap.get(item);
3508
- };
3509
- // use computed to generate unique ids for each filter item
3510
- // this is needed for the v-for :key updates
3511
- const modelWithIds = computed(() => {
3512
- if (!props.multiple) {
3513
- if (props.modelValue.length > 0) {
3514
- return [{ id: getId(props.modelValue[0]), item: props.modelValue[0] }];
3515
- }
3516
- return [{ id: getId(newFilter), item: newFilter }];
3517
- }
3518
- return [...props.modelValue, newFilter].map((item) => ({
3519
- id: getId(item),
3520
- item,
3521
- }));
3522
- });
3523
- const debounceUpdateModel = debounce((modelValue) => {
3524
- if (Utils.isEqual(modelValue, props.modelValue))
3525
- return;
3526
- ctx.emit('update:modelValue', modelValue);
3527
- newFilter = createNewFilter();
3528
- }, 500);
3529
- const changeRelation = (index, { component }) => {
3530
- const modelValue = cloneDeep(props.modelValue);
3531
- const isNewFilter = index === modelValue.length;
3532
- const filter = isNewFilter ? newFilter : modelValue[index];
3533
- const { value } = component;
3534
- focusValueInput(index);
3535
- // update item type value
3536
- filter.relation = value;
3537
- if (isNewFilter)
3538
- return;
3539
- debounceUpdateModel(modelValue);
3540
- };
3541
- const changeOperation = (index, { component }) => {
3542
- const modelValue = cloneDeep(props.modelValue);
3543
- const filterItem = modelValue[index];
3544
- const isNewFilter = index === modelValue.length;
3545
- const filter = isNewFilter ? newFilter : filterItem;
3546
- const { value } = component;
3547
- focusValueInput(index);
3548
- // if operation is IN, NOT_IN or BETWEEN, value should be an array
3549
- if (isArrayOperation(value)) {
3550
- filter.value = Array.isArray(filterItem.value) ? filterItem.value : [filterItem.value];
3551
- }
3552
- // update item type value
3553
- filter.operation = value;
3554
- if (isNewFilter)
3555
- return;
3556
- debounceUpdateModel(modelValue);
3557
- };
3558
- const changeValue = (item, index, { component }) => {
3559
- const modelValue = cloneDeep(props.modelValue);
3560
- const filter = cloneDeep(item);
3561
- const { value } = component;
3562
- const isNewFilter = props.multiple && index === modelValue.length;
3563
- let formattedValue = value;
3564
- if (value && isArrayOperation(filter.operation)) {
3565
- formattedValue = value.split(';');
3566
- }
3567
- filter.value = checkDateValueFormat(formattedValue);
3568
- if (!props.multiple) {
3569
- debounceUpdateModel([filter]);
3570
- return;
3571
- }
3572
- if (isNewFilter) {
3573
- // only emit event when newFilter has value
3574
- if (!filter.value)
3575
- return;
3576
- debounceUpdateModel([...modelValue, filter]);
3577
- return;
3578
- }
3579
- if (!filter.value) {
3580
- // when removing the last (not new) filter, should pass its operation and relation to the new filter
3581
- if (index === modelValue.length - 1) {
3582
- newFilter.operation = filter.operation;
3583
- newFilter.relation = filter.relation;
3584
- }
3585
- modelValue.splice(index, 1);
3586
- // if the removed filter was the first, should set the new first relation to AND
3587
- if (modelValue.length > 0 && index === 0) {
3588
- modelValue[0].relation = 'AND';
3589
- }
3590
- // if the removed filter was the last, should set the newFilter relation to AND
3591
- if (modelValue.length === 0) {
3592
- newFilter.relation = 'AND';
3593
- }
3594
- }
3595
- debounceUpdateModel(modelValue);
3596
- };
3597
- const getComponentType = (operation) => {
3598
- return isArrayOperation(operation) ? 'ZdTextInput' : props.column.componentProps.component;
3599
- };
3600
- const getComponentHint = (operation) => {
3601
- return isArrayOperation(operation) ? 'TEKGRID_MULTIPLE_VALUE_HINT' : '';
3602
- };
3603
- const getItemValue = (item) => {
3604
- return isArrayOperation(item.operation) ? item.value.join(';') : item.value;
3605
- };
3606
- return {
3607
- changeValue,
3608
- changeRelation,
3609
- changeOperation,
3610
- getValueInputName,
3611
- newFilter,
3612
- getComponentType,
3613
- getComponentHint,
3614
- modelWithIds,
3615
- getItemValue,
3616
- };
3617
- },
3618
- });
3619
-
3620
- const TekGridColumnsButtonProps = Object.assign(Object.assign({}, ZdIterableColumnsButtonProps), { hideGroups: {
3621
- type: [Boolean, String],
3622
- default: false,
3623
- } });
3624
- const tekGridColumnsButton = defineComponent({
3625
- props: TekGridColumnsButtonProps,
3626
- inheritAttrs: false,
3627
- setup(props, ctx) {
3628
- const { instance, root } = useCreateInstance(props, ctx, TekGridColumnsButton);
3629
- const buttonScope = useButtonInstance({ instance, root });
3630
- const menuIsOpened = ref(false);
3631
- const sortableInitialized = ref(false);
3632
- const teste = (a) => {
3633
- console.warn(a);
3634
- };
3635
- watch(menuIsOpened, () => {
3636
- if (!menuIsOpened.value || sortableInitialized.value)
3637
- return;
3638
- sortableInitialized.value = true;
3639
- nextTick(() => {
3640
- const columnsTableBody = document.querySelector(`#${instance.name}_columns_table tbody`);
3641
- if (columnsTableBody) {
3642
- sortable.create(columnsTableBody, {
3643
- handle: '.sortHandle',
3644
- dragClass: 'tek-grid-columns-button-sortable-drag',
3645
- onEnd: sortEnd,
3646
- });
3647
- }
3648
- });
3649
- });
3650
- const gridGroupColumnNames = computed(() => {
3651
- return instance.iterableComponent.columns.filter((column) => column.grouped).map((column) => column.name) || [];
3652
- });
3653
- const sortEnd = (event) => {
3654
- const grid = instance.iterableComponent;
3655
- const newOrder = Array.from(event.srcElement.querySelectorAll('tr')).map((row) => row.getAttribute('name'));
3656
- const groupColumnNames = [];
3657
- const newColumns = newOrder.map((columnName) => {
3658
- const column = grid.getColumn(columnName);
3659
- if (column.grouped) {
3660
- groupColumnNames.push(columnName);
3661
- }
3662
- return column;
3663
- });
3664
- const ignoredColumns = grid.columns.filter((column) => instance.ignoreColumns.indexOf(column.name) !== -1);
3665
- grid.columns = newColumns.concat(ignoredColumns);
3666
- if (grid.updateGrouping && JSON.stringify(groupColumnNames) !== JSON.stringify(gridGroupColumnNames)) {
3667
- grid.updateGrouping();
3668
- }
3669
- grid.changeLayout();
3670
- };
3671
- const moreOptions = () => {
3672
- TekGridColumnsOptionsModal.show(instance);
3673
- };
3674
- const close = () => {
3675
- menuIsOpened.value = false;
3676
- };
3677
- return Object.assign(Object.assign({}, buttonScope), { instance,
3678
- root,
3679
- menuIsOpened,
3680
- moreOptions,
3681
- close,
3682
- teste,
3683
- mergeProps });
3684
- },
3685
- });
3686
-
3687
- const TekGridFilterButtonProps = Object.assign(Object.assign({}, ZdButtonProps), { gridName: {
3688
- type: String,
3689
- default: '',
3690
- }, grid: {
3691
- type: [Object, String],
3692
- default: () => { },
3693
- }, showCheckboxAll: {
3694
- type: [Boolean, String],
3695
- default: false,
3696
- } });
3697
- const tekGridFilterButtonComponent = defineComponent({
3698
- props: TekGridFilterButtonProps,
3699
- inheritAttrs: false,
3700
- setup(props, ctx) {
3701
- const { instance, root } = useCreateInstance(props, ctx, TekGridFilterButton);
3702
- const buttonScope = useButtonInstance({ instance, root });
3703
- const filterClick = ({ event }) => {
3704
- instance.click(event);
3705
- };
3706
- return Object.assign(Object.assign({}, buttonScope), { instance,
3707
- root,
3708
- filterClick });
3709
- },
3710
- });
3711
-
3712
- const TekGridLayoutOptionsProps = Object.assign({}, ZdComponentRenderProps);
3713
- const layoutOptionsComponent = defineComponent({
3714
- props: TekGridLayoutOptionsProps,
3715
- inheritAttrs: false,
3716
- setup(props, ctx) {
3717
- const { instance, root } = useCreateInstance(props, ctx, TekGridLayoutOptions);
3718
- const { applyLayout: applyTekGridLayout, getColumnElements, getTableWidth } = useTableLayout();
3719
- onMounted(() => {
3720
- instance.viewApplyLayout = applyLayout;
3721
- instance.viewGetCurrentLayout = getCurrentLayout;
3722
- });
3723
- const confirmLayoutClick = ({ component }) => {
3724
- const layoutName = component.value;
3725
- if (layoutName) {
3726
- const newLayout = getCurrentLayout(layoutName);
3727
- instance.newLayout(newLayout);
3728
- }
3729
- menuActive.value = false;
3730
- component.value = '';
3731
- };
3732
- const datasourceDynamicFilter = () => {
3733
- const datasource = instance.grid.datasource;
3734
- if (datasource instanceof TekRestDatasource)
3735
- return datasource.dynamicFilter;
3736
- return {};
3737
- };
3738
- const changeLayout = (layout) => {
3739
- instance.updateLayout(layout.name, getCurrentLayout(layout.name));
3740
- };
3741
- const applyLayout = (layout) => {
3742
- const defaultLayout = {
3743
- originalDatasourceOrder: instance.originalDatasourceOrder,
3744
- originalDatasourceFilter: instance.originalDatasourceFilter,
3745
- originalColumnProps: instance.originalColumnProps,
3746
- originalDatasourceDynamicFilter: instance.originalDatasourceDynamicFilter,
3747
- };
3748
- applyTekGridLayout({ layout, defaultLayout, changeLayoutCallback: changeLayout });
3749
- menuActive.value = false;
3750
- };
3751
- const getCurrentLayout = (layoutName) => {
3752
- const { grid } = instance;
3753
- const gridWidth = getTableWidth();
3754
- const columnElementsDict = getColumnElements();
3755
- return {
3756
- name: layoutName,
3757
- gridWidth,
3758
- order: grid.datasource.order,
3759
- filter: grid.datasource.filter,
3760
- dynamicFilter: datasourceDynamicFilter(),
3761
- columns: grid.columns.map((column, index) => {
3762
- const columnElement = columnElementsDict[index];
3763
- return {
3764
- name: column.name,
3765
- label: column.label,
3766
- align: column.align,
3767
- width: columnElement ? window.getComputedStyle(columnElement).width : 'unset',
3768
- minWidth: column.minWidth,
3769
- maxWidth: column.maxWidth,
3770
- isVisible: column.isVisible,
3771
- fixed: column.fixed,
3772
- grouped: column.grouped,
3773
- groupOpened: column.groupOpened,
3774
- aggregation: column.aggregation,
3775
- filterHelperValue: instance.getHelperValue(column),
3776
- };
3777
- }),
3778
- };
3779
- };
3780
- const menuActive = ref(false);
3781
- const applyOrUpdateLayout = (event, layoutName) => {
3782
- if (instance.layoutEdited) {
3783
- instance.updateLayout(layoutName, getCurrentLayout(layoutName));
3784
- event.stopImmediatePropagation();
3785
- menuActive.value = false;
3786
- }
3787
- else {
3788
- instance.applyLayout(layoutName);
3789
- }
3790
- };
3791
- const deleteLayout = (event, layoutName) => {
3792
- instance.deleteLayout(layoutName);
3793
- event.stopImmediatePropagation();
3794
- };
3795
- return {
3796
- instance,
3797
- root,
3798
- menuActive,
3799
- confirmLayoutClick,
3800
- applyOrUpdateLayout,
3801
- deleteLayout,
3802
- mergeProps,
3803
- };
3804
- },
3805
- });
3806
-
3807
- const TekUserInfoProps = Object.assign(Object.assign({}, ZdUserInfoProps), { aboutImage: {
3808
- type: String,
3809
- default: '',
3810
- }, defaultEmail: {
3811
- type: String,
3812
- default: '',
3813
- }, versionInfo: {
3814
- type: [Object, String],
3815
- default: null,
3816
- }, versionUrl: {
3817
- type: String,
3818
- default: '',
3819
- }, bottomSlot: {
3820
- type: Array,
3821
- default: undefined,
3822
- } });
3823
- const tekUserInfoComponent = defineComponent({
3824
- props: TekUserInfoProps,
3825
- inheritAttrs: false,
3826
- setup(props, ctx) {
3827
- const { instance, root } = useCreateInstance(props, ctx, TekUserInfo);
3828
- const { click, focus, blur, mouseenter, mouseleave } = useGetMethods(instance, root);
3829
- return {
3830
- instance,
3831
- root,
3832
- click,
3833
- focus,
3834
- blur,
3835
- mouseenter,
3836
- mouseleave,
3837
- };
3838
- }
3839
- });
3840
-
3841
- const TekUserInfoListProps = Object.assign(Object.assign({}, ZdListProps), { parentName: {
3842
- type: String,
3843
- default: '',
3844
- }, dense: {
3845
- type: [Boolean, String],
3846
- default: true,
3847
- } });
3848
- const tekUserInfoListComponent = defineComponent({
3849
- props: TekUserInfoListProps,
3850
- inheritAttrs: false,
3851
- setup(props, ctx) {
3852
- const { instance, root } = useCreateInstance(props, ctx, TekUserInfoList);
3853
- const { click, focus, blur, mouseenter, mouseleave } = useGetMethods(instance, root);
3854
- return {
3855
- instance,
3856
- root,
3857
- click,
3858
- focus,
3859
- blur,
3860
- mouseenter,
3861
- mouseleave,
3862
- };
3863
- }
3864
- });
3865
-
3866
- Icons.addIcons({
3867
- add: 'mdi-plus-box',
3868
- delete: 'mdi-trash-can-outline',
3869
- refresh: 'mdi-refresh',
3870
- more: 'mdi-dots-vertical',
3871
- filter: 'mdi-filter',
3872
- confirmLayout: 'mdi-check',
3873
- updateLayout: 'mdi-square-edit-outline',
3874
- layout: 'mdi-table-star',
3875
- });
3876
- const TeknisaComponents = {
3877
- install(app) {
3878
- Object.keys(components).forEach((id) => {
3879
- app.component(id, components[id]);
3880
- });
3881
- app.component('ZdUserInfo', ZdUserInfoComponent);
3882
- },
3883
- };
3884
-
3885
- export { breadcrumbHeaderComponent as TekBreadcrumbHeader, gridEditableComponent as TekGrid, tekGridColumnFilter as TekGridColumnFilter, tekGridColumnsButton as TekGridColumnsButton, tekGridFilterButtonComponent as TekGridFilterButton, layoutOptionsComponent as TekGridLayoutOptions, tekUserInfoComponent as TekUserInfo, tekUserInfoListComponent as TekUserInfoList, TeknisaComponents as default };