gd-bs 6.6.82 → 6.6.84
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/build/components/table/index.js +70 -22
- package/dist/gd-bs-icons.js +1 -1
- package/dist/gd-bs-icons.min.js +1 -1
- package/dist/gd-bs.d.ts +14 -8
- package/dist/gd-bs.js +1 -1
- package/dist/gd-bs.min.js +1 -1
- package/package.json +2 -2
- package/src/components/table/index.ts +81 -23
- package/src/components/table/types.d.ts +14 -8
|
@@ -35,6 +35,7 @@ var _Table = /** @class */ (function (_super) {
|
|
|
35
35
|
}
|
|
36
36
|
// Configure the card group
|
|
37
37
|
_Table.prototype.configure = function () {
|
|
38
|
+
var hasFooter = false;
|
|
38
39
|
// See if columns are defined
|
|
39
40
|
var head = this.el.querySelector("thead");
|
|
40
41
|
if (head) {
|
|
@@ -44,11 +45,17 @@ var _Table = /** @class */ (function (_super) {
|
|
|
44
45
|
head.appendChild(row);
|
|
45
46
|
// Parse the columns
|
|
46
47
|
for (var i = 0; i < this.props.columns.length; i++) {
|
|
48
|
+
var colProp = this.props.columns[i];
|
|
47
49
|
// Append the column
|
|
48
50
|
var column = document.createElement("th");
|
|
49
51
|
row.appendChild(column);
|
|
52
|
+
// See if the footer exists
|
|
53
|
+
if (colProp.footer || colProp.onRenderFooter) {
|
|
54
|
+
// Set the flag
|
|
55
|
+
hasFooter = true;
|
|
56
|
+
}
|
|
50
57
|
// Render the column
|
|
51
|
-
this.renderColumn(
|
|
58
|
+
this.renderColumn(column, colProp);
|
|
52
59
|
}
|
|
53
60
|
// See if there is an event
|
|
54
61
|
if (this.props.onRenderHeaderRow) {
|
|
@@ -59,9 +66,59 @@ var _Table = /** @class */ (function (_super) {
|
|
|
59
66
|
}
|
|
60
67
|
// Add the rows
|
|
61
68
|
this.addRows(this.props.rows);
|
|
69
|
+
// See if the footer exists
|
|
70
|
+
if (hasFooter) {
|
|
71
|
+
// Append the footer
|
|
72
|
+
var footer = document.createElement("tfoot");
|
|
73
|
+
this.el.appendChild(footer);
|
|
74
|
+
// Append the row
|
|
75
|
+
var row = document.createElement("tr");
|
|
76
|
+
footer.appendChild(row);
|
|
77
|
+
// Parse the columns
|
|
78
|
+
for (var i = 0; i < this.props.columns.length; i++) {
|
|
79
|
+
// Append the column
|
|
80
|
+
var column = document.createElement("td");
|
|
81
|
+
row.appendChild(column);
|
|
82
|
+
// Render the column
|
|
83
|
+
this.renderColumnFooter(column, this.props.columns[i]);
|
|
84
|
+
}
|
|
85
|
+
}
|
|
86
|
+
};
|
|
87
|
+
// Renders a cell
|
|
88
|
+
_Table.prototype.renderCell = function (row, props, data, rowIdx) {
|
|
89
|
+
var _this = this;
|
|
90
|
+
// Create the cell
|
|
91
|
+
var cell = document.createElement("td");
|
|
92
|
+
cell.className = props.className || "";
|
|
93
|
+
cell.innerHTML = data[props.name] == null ? "" : data[props.name];
|
|
94
|
+
row.appendChild(cell);
|
|
95
|
+
// See if there is a scope
|
|
96
|
+
if (props.scope) {
|
|
97
|
+
// Set the scope
|
|
98
|
+
cell.setAttribute("scope", props.scope);
|
|
99
|
+
}
|
|
100
|
+
// See if there is an event for this column
|
|
101
|
+
if (props.onRenderCell) {
|
|
102
|
+
// Call the event
|
|
103
|
+
props.onRenderCell(cell, props, data, rowIdx);
|
|
104
|
+
}
|
|
105
|
+
// See if there is an event for this component
|
|
106
|
+
if (this.props.onRenderCell) {
|
|
107
|
+
// Call the event
|
|
108
|
+
this.props.onRenderCell(cell, props, data, rowIdx);
|
|
109
|
+
}
|
|
110
|
+
// See if there is a click event
|
|
111
|
+
if (props.onClickCell || this.props.onClickCell) {
|
|
112
|
+
// Add the click event
|
|
113
|
+
cell.addEventListener("click", function (ev) {
|
|
114
|
+
// Call the event
|
|
115
|
+
props.onClickCell ? props.onClickCell(cell, props, data, rowIdx) : null;
|
|
116
|
+
_this.props.onClickCell ? _this.props.onClickCell(cell, props, data, rowIdx) : null;
|
|
117
|
+
});
|
|
118
|
+
}
|
|
62
119
|
};
|
|
63
120
|
// Renders a column
|
|
64
|
-
_Table.prototype.renderColumn = function (
|
|
121
|
+
_Table.prototype.renderColumn = function (column, props) {
|
|
65
122
|
var _this = this;
|
|
66
123
|
column.innerHTML = props.isHidden ? "" : props.title || props.name;
|
|
67
124
|
column.setAttribute("scope", "col");
|
|
@@ -85,36 +142,27 @@ var _Table = /** @class */ (function (_super) {
|
|
|
85
142
|
});
|
|
86
143
|
}
|
|
87
144
|
};
|
|
88
|
-
// Renders a
|
|
89
|
-
_Table.prototype.
|
|
145
|
+
// Renders a column footer
|
|
146
|
+
_Table.prototype.renderColumnFooter = function (column, props) {
|
|
90
147
|
var _this = this;
|
|
91
|
-
|
|
92
|
-
var cell = document.createElement("td");
|
|
93
|
-
cell.className = props.className || "";
|
|
94
|
-
cell.innerHTML = data[props.name] == null ? "" : data[props.name];
|
|
95
|
-
row.appendChild(cell);
|
|
96
|
-
// See if there is a scope
|
|
97
|
-
if (props.scope) {
|
|
98
|
-
// Set the scope
|
|
99
|
-
cell.setAttribute("scope", props.scope);
|
|
100
|
-
}
|
|
148
|
+
column.innerHTML = props.footer || "";
|
|
101
149
|
// See if there is an event for this column
|
|
102
|
-
if (props.
|
|
150
|
+
if (props.onRenderFooter) {
|
|
103
151
|
// Call the event
|
|
104
|
-
props.
|
|
152
|
+
props.onRenderFooter(column, props);
|
|
105
153
|
}
|
|
106
154
|
// See if there is an event for this component
|
|
107
|
-
if (this.props.
|
|
155
|
+
if (this.props.onRenderFooterCell) {
|
|
108
156
|
// Call the event
|
|
109
|
-
this.props.
|
|
157
|
+
this.props.onRenderFooterCell(column, props);
|
|
110
158
|
}
|
|
111
159
|
// See if there is a click event
|
|
112
|
-
if (props.
|
|
160
|
+
if (props.onClickFooter || this.props.onClickFooter) {
|
|
113
161
|
// Add the click event
|
|
114
|
-
|
|
162
|
+
column.addEventListener("click", function (ev) {
|
|
115
163
|
// Call the event
|
|
116
|
-
props.
|
|
117
|
-
_this.props.
|
|
164
|
+
props.onClickFooter ? props.onClickFooter(column, props) : null;
|
|
165
|
+
_this.props.onClickFooter ? _this.props.onClickFooter(column, props) : null;
|
|
118
166
|
});
|
|
119
167
|
}
|
|
120
168
|
};
|