@cdmx/wappler_ag_grid 0.5.3 → 0.5.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +34 -31
- package/app_connect/components.hjson +6 -6
- package/dmx-ag-grid.js +6 -6
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -15,42 +15,45 @@ The AG Grid module allows you to create a flexible and customizable data grid wi
|
|
|
15
15
|
5. **Locale**: Select the locale for the grid. Currently supported locales: English (EN) and Hebrew (HE). (Default: EN)
|
|
16
16
|
|
|
17
17
|
## AG Grid Options
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
18
|
+
1. **Minimum Width**: The minimum width of the column. (Default: 150)
|
|
19
|
+
2. **Resizable**: Specifies if the column can be resized. (Default: true)
|
|
20
|
+
3. **Sortable**: Specifies if the columns are sortable. (Default: true)
|
|
21
|
+
4. **Filter**: Specifies if the column has a filter. (Default: true)
|
|
22
|
+
5. **Floating Filter**: Specifies if the column has a floating filter. (Default: true)
|
|
23
|
+
6. **CSV Export**: Specifies if Export to CSV is enabled. (Default: true)
|
|
24
|
+
7. **Enable RTL**: Enabled Right to Left, used for Hebrew and Arabic. (Default: false)
|
|
25
|
+
8. **Column Hover Highlight**: Specifies column hover highlighting. (Default: true)
|
|
26
|
+
9. **Suppress Row Deselection**: Specifies if rows can be deselected. (Default: false)
|
|
27
|
+
10. **Pagination**: Enables pagination. (Default: true)
|
|
28
|
+
11. **Pagination Page Size**: Number of rows to show per page. (Default: 20)
|
|
29
|
+
12. **Row Selection**: Row Selection (single or multiple).
|
|
30
30
|
- "Single"
|
|
31
31
|
- "Multiple" (Default)
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
32
|
+
13. **Timezone**: Timezone for Date Fields. Select the appropriate timezone from the dropdown list. (Default: Local)
|
|
33
|
+
14. **Date Format**: Date Format for displaying date values. (Default: "dd/MM/yyyy hh:mm A")
|
|
34
|
+
15. **Sticky Header and Horizonal Scrollbar**: Optionally specify the header offset and topbar class.
|
|
35
|
+
- Fixed Header: Enables sticky header. (Default: false)
|
|
35
36
|
- Header Offset: Specifies offset from the top of the viewport area (Optional). (Default: 100)
|
|
36
37
|
- Topbar Class: Specify class, e.g., "topbar", to measure the offset from (Optional). (Default: "topbar")
|
|
37
38
|
- Topbar Offset: Specify topbar offset (Default: 80)
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
39
|
+
- Fixed Horizontal Scroll: Enables Hovering horizontal scrollbar which stays at the bottom all the time. (Default: false)
|
|
40
|
+
- Fixed Horizontal Scroll Width: Fixed horizontal scroll width percentage. (Default: 80%)
|
|
41
|
+
16. **Row Height**: Height of each row in pixels. (Default: 25)
|
|
42
|
+
17. **Header Height**: Height of the header row in pixels. (Default: 30)
|
|
43
|
+
18. **Suppress Row Click Selection**: Disables row selection on row click. (Default: false)
|
|
44
|
+
19. **Suppress Menu Hide**: Prevents hiding the column menu. (Default: false)
|
|
45
|
+
20. **Suppress Movable Columns**: Disables moving columns. (Default: false)
|
|
46
|
+
21. **Enable Cell Expressions**: Enables expressions in cell values. (Default: false)
|
|
47
|
+
22. **Animate Rows**: Enables row animation on data changes. (Default: false)
|
|
48
|
+
23. **Suppress Aggregation Function in Header**: Hides the aggregation function in column headers. (Default: false)
|
|
49
|
+
24. **Suppress Aggregation at Root Level**: Disables aggregation at the root level. (Default: false)
|
|
50
|
+
25. **Suppress Clipboard Paste**: Disables pasting data from the clipboard. (Default: false)
|
|
51
|
+
26. **Suppress Scroll on New Data**: Prevents scrolling to newly added data. (Default: false)
|
|
52
|
+
27. **Suppress Property Names Check**: Disables checking for duplicate property names. (Default: false)
|
|
53
|
+
28. **Hide ID Field**: Hides the ID Field in the Grid. (Default: false)
|
|
54
|
+
29. **Row Click Events**: Enables row click events. This can be used in Dynamic events => Grid Events => Row Clicked. (Default: false)
|
|
55
|
+
30. **Enable Row Selection**: Enables row selection. This can be used in Dynamic events => Grid Events => Checkbox Checked || Checkbox Unchecked. (Default: false)
|
|
56
|
+
31. **Enable Row Status Toggle**: Enables row status toggle events. This can be used in Dynamic events => Grid Events => Checkbox Checked || Checkbox Unchecked. (Default: false)
|
|
54
57
|
|
|
55
58
|
# Data Type Overrides
|
|
56
59
|
|
|
@@ -315,18 +315,18 @@
|
|
|
315
315
|
"help": "Specify topbar offset, Default: 80"
|
|
316
316
|
},
|
|
317
317
|
{
|
|
318
|
-
"name": "
|
|
319
|
-
"attribute": "dmx-bind:
|
|
320
|
-
"title": "Fixed
|
|
318
|
+
"name": "fixedHorizontalScroll",
|
|
319
|
+
"attribute": "dmx-bind:fixed_horizontal_scroll",
|
|
320
|
+
"title": "Fixed Horizontal Scroll",
|
|
321
321
|
"type": "boolean",
|
|
322
322
|
"initDisplay": "none",
|
|
323
323
|
"defaultValue": false,
|
|
324
324
|
"help": "Enables bottom fixed horizontal scroll"
|
|
325
325
|
},
|
|
326
326
|
{
|
|
327
|
-
"name": "
|
|
328
|
-
"attribute": "dmx-bind:
|
|
329
|
-
"title": "Fixed
|
|
327
|
+
"name": "fixedHorizontalScrollWidth",
|
|
328
|
+
"attribute": "dmx-bind:fixed_horizontal_scroll_width",
|
|
329
|
+
"title": "Fixed Horizontal Scroll Width",
|
|
330
330
|
"type": "number",
|
|
331
331
|
"initDisplay": "none",
|
|
332
332
|
"defaultValue": 80,
|
package/dmx-ag-grid.js
CHANGED
|
@@ -50,12 +50,12 @@ dmx.Component('ag-grid', {
|
|
|
50
50
|
column_hover_highlight: { type: Boolean, default: true },
|
|
51
51
|
export_to_csv: { type: Boolean, default: true },
|
|
52
52
|
fixed_header: { type: Boolean, default: false },
|
|
53
|
-
topbar_class: { type:
|
|
53
|
+
topbar_class: { type: String, default: 'topbar' },
|
|
54
54
|
fixed_header_offset: { type: Number, default: 100 },
|
|
55
55
|
fixed_top_offset: { type: Number, default: 80 },
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
timezone: {type:
|
|
56
|
+
fixed_horizontal_scroll: { type: Boolean, default: false },
|
|
57
|
+
fixed_horizontal_scroll_width: { type: Number, default: 80 },
|
|
58
|
+
timezone: {type: String, default: '' },
|
|
59
59
|
cell_click_event: {type: Boolean, default: false },
|
|
60
60
|
row_click_event: {type: Boolean, default: false },
|
|
61
61
|
row_checkbox_event: {type: Boolean, default: false },
|
|
@@ -889,11 +889,11 @@ dmx.Component('ag-grid', {
|
|
|
889
889
|
const agGridElement = document.getElementById(gridId);
|
|
890
890
|
function updateHoveringBarStyles() {
|
|
891
891
|
const existingStyle = document.getElementById('hovering-bar-style');
|
|
892
|
-
if (options.
|
|
892
|
+
if (options.fixed_horizontal_scroll) {
|
|
893
893
|
// Create a new style element
|
|
894
894
|
const styleElement = document.createElement('style');
|
|
895
895
|
styleElement.id = 'hovering-bar-style';
|
|
896
|
-
const barWidthPercentage = options.
|
|
896
|
+
const barWidthPercentage = options.fixed_horizontal_scroll_width;
|
|
897
897
|
const barWidth = `calc(${barWidthPercentage}vw - 10px)`;
|
|
898
898
|
// Add the styles for the hovering horizontal bottom bar
|
|
899
899
|
styleElement.innerHTML = `
|