@syncfusion/ej2-treegrid 20.1.59 → 20.2.38
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/CHANGELOG.md +11 -51
- package/dist/ej2-treegrid.umd.min.js +2 -2
- package/dist/ej2-treegrid.umd.min.js.map +1 -1
- package/dist/es6/ej2-treegrid.es2015.js +213 -119
- package/dist/es6/ej2-treegrid.es2015.js.map +1 -1
- package/dist/es6/ej2-treegrid.es5.js +218 -124
- package/dist/es6/ej2-treegrid.es5.js.map +1 -1
- package/dist/global/ej2-treegrid.min.js +2 -2
- package/dist/global/ej2-treegrid.min.js.map +1 -1
- package/dist/global/index.d.ts +1 -1
- package/helpers/e2e/index.js +8 -6
- package/helpers/e2e/treegridhelper.js +82 -65
- package/package.json +9 -9
- package/src/treegrid/actions/batch-edit.js +6 -1
- package/src/treegrid/actions/edit.js +12 -5
- package/src/treegrid/actions/rowdragdrop.js +46 -9
- package/src/treegrid/actions/selection.js +6 -1
- package/src/treegrid/actions/sort.js +11 -0
- package/src/treegrid/base/data.js +14 -2
- package/src/treegrid/base/treegrid.js +8 -4
- package/src/treegrid/renderer/render.js +3 -1
- package/src/treegrid/renderer/virtual-tree-content-render.js +13 -3
- package/styles/bootstrap-dark.css +9 -0
- package/styles/bootstrap.css +9 -0
- package/styles/bootstrap4.css +9 -0
- package/styles/bootstrap5-dark.css +9 -0
- package/styles/bootstrap5.css +9 -0
- package/styles/fabric-dark.css +9 -0
- package/styles/fabric.css +9 -0
- package/styles/fluent-dark.css +9 -0
- package/styles/fluent.css +9 -0
- package/styles/highcontrast-light.css +9 -0
- package/styles/highcontrast.css +9 -0
- package/styles/material-dark.css +9 -0
- package/styles/material.css +9 -0
- package/styles/tailwind-dark.css +9 -0
- package/styles/tailwind.css +9 -0
- package/styles/treegrid/_fusionnew-definition.scss +29 -0
- package/styles/treegrid/_icons.scss +11 -0
- package/styles/treegrid/_material3-definition.scss +29 -0
- package/styles/treegrid/bootstrap-dark.css +9 -0
- package/styles/treegrid/bootstrap.css +9 -0
- package/styles/treegrid/bootstrap4.css +9 -0
- package/styles/treegrid/bootstrap5-dark.css +9 -0
- package/styles/treegrid/bootstrap5.css +9 -0
- package/styles/treegrid/fabric-dark.css +9 -0
- package/styles/treegrid/fabric.css +9 -0
- package/styles/treegrid/fluent-dark.css +9 -0
- package/styles/treegrid/fluent.css +9 -0
- package/styles/treegrid/highcontrast-light.css +9 -0
- package/styles/treegrid/highcontrast.css +9 -0
- package/styles/treegrid/icons/_bootstrap-dark.scss +11 -0
- package/styles/treegrid/icons/_bootstrap.scss +11 -0
- package/styles/treegrid/icons/_bootstrap4.scss +11 -0
- package/styles/treegrid/icons/_bootstrap5.scss +11 -0
- package/styles/treegrid/icons/_fabric-dark.scss +11 -0
- package/styles/treegrid/icons/_fabric.scss +11 -0
- package/styles/treegrid/icons/_fluent.scss +11 -0
- package/styles/treegrid/icons/_fusionnew.scss +26 -0
- package/styles/treegrid/icons/_highcontrast-light.scss +11 -0
- package/styles/treegrid/icons/_highcontrast.scss +11 -0
- package/styles/treegrid/icons/_material-dark.scss +11 -0
- package/styles/treegrid/icons/_material.scss +11 -0
- package/styles/treegrid/icons/_material3.scss +26 -0
- package/styles/treegrid/icons/_tailwind-dark.scss +11 -0
- package/styles/treegrid/icons/_tailwind.scss +11 -0
- package/styles/treegrid/material-dark.css +9 -0
- package/styles/treegrid/material.css +9 -0
- package/styles/treegrid/tailwind-dark.css +9 -0
- package/styles/treegrid/tailwind.css +9 -0
|
@@ -1043,7 +1043,12 @@ class Selection {
|
|
|
1043
1043
|
if (indeter > 0 || (checkChildRecords > 0 && checkChildRecords !== length)) {
|
|
1044
1044
|
record.checkboxState = 'indeterminate';
|
|
1045
1045
|
}
|
|
1046
|
-
else if (checkChildRecords === 0 &&
|
|
1046
|
+
else if (checkChildRecords === 0 && (!record.hasFilteredChildRecords || isNullOrUndefined(record.hasFilteredChildRecords)) && !isNullOrUndefined(this.parent['dataResults']['actionArgs']) &&
|
|
1047
|
+
(this.parent['dataResults']['actionArgs'].requestType === 'searching' || this.parent['dataResults']['actionArgs'].requestType === 'filtering') && record.checkboxState === 'check') {
|
|
1048
|
+
record.checkboxState = 'check';
|
|
1049
|
+
}
|
|
1050
|
+
else if ((checkChildRecords === 0 && indeter === 0) || (checkChildRecords === 0 && record.hasFilteredChildRecords && !isNullOrUndefined(this.parent['dataResults']['actionArgs']) &&
|
|
1051
|
+
(this.parent['dataResults']['actionArgs'].requestType === 'searching' || this.parent['dataResults']['actionArgs'].requestType === 'filtering') && record.checkboxState === 'check')) {
|
|
1047
1052
|
record.checkboxState = 'uncheck';
|
|
1048
1053
|
}
|
|
1049
1054
|
else {
|
|
@@ -1271,100 +1276,6 @@ class Selection {
|
|
|
1271
1276
|
}
|
|
1272
1277
|
}
|
|
1273
1278
|
|
|
1274
|
-
/**
|
|
1275
|
-
* TreeGrid Freeze module
|
|
1276
|
-
*
|
|
1277
|
-
* @hidden
|
|
1278
|
-
*/
|
|
1279
|
-
class Freeze$1 {
|
|
1280
|
-
/**
|
|
1281
|
-
* Constructor for render module
|
|
1282
|
-
*
|
|
1283
|
-
* @param {TreeGrid} parent - Tree Grid instance
|
|
1284
|
-
*/
|
|
1285
|
-
constructor(parent) {
|
|
1286
|
-
Grid.Inject(Freeze);
|
|
1287
|
-
this.parent = parent;
|
|
1288
|
-
this.addEventListener();
|
|
1289
|
-
}
|
|
1290
|
-
addEventListener() {
|
|
1291
|
-
this.parent.on('rowExpandCollapse', this.rowExpandCollapse, this);
|
|
1292
|
-
this.parent.on('dataBoundArg', this.dataBoundArg, this);
|
|
1293
|
-
this.parent.grid.on('dblclick', this.dblClickHandler, this);
|
|
1294
|
-
}
|
|
1295
|
-
removeEventListener() {
|
|
1296
|
-
if (this.parent.isDestroyed) {
|
|
1297
|
-
return;
|
|
1298
|
-
}
|
|
1299
|
-
this.parent.off('rowExpandCollapse', this.rowExpandCollapse);
|
|
1300
|
-
this.parent.off('dataBoundArg', this.dataBoundArg);
|
|
1301
|
-
this.parent.grid.off('dblclick', this.dblClickHandler);
|
|
1302
|
-
}
|
|
1303
|
-
rowExpandCollapse(args) {
|
|
1304
|
-
const movableRows = this.parent.getMovableDataRows();
|
|
1305
|
-
const frozenrows = this.parent.getRows();
|
|
1306
|
-
let rows;
|
|
1307
|
-
let frozenRightRows;
|
|
1308
|
-
const freeze = (this.parent.getFrozenLeftColumnsCount() > 0 ||
|
|
1309
|
-
this.parent.getFrozenRightColumnsCount() > 0) ? true : false;
|
|
1310
|
-
if (freeze) {
|
|
1311
|
-
frozenRightRows = this.parent.getFrozenRightRows().filter((e) => e.querySelector('.e-gridrowindex' + args.record.index + 'level' + (args.record.level + 1)));
|
|
1312
|
-
}
|
|
1313
|
-
if (!args.detailrows.length) {
|
|
1314
|
-
rows = movableRows.filter((e) => e.querySelector('.e-gridrowindex' + args.record.index + 'level' + (args.record.level + 1)));
|
|
1315
|
-
}
|
|
1316
|
-
else {
|
|
1317
|
-
rows = args.detailrows;
|
|
1318
|
-
}
|
|
1319
|
-
for (let i = 0; i < rows.length; i++) {
|
|
1320
|
-
const rData = this.parent.grid.getRowObjectFromUID(rows[i].getAttribute('data-Uid')).data;
|
|
1321
|
-
rows[i].style.display = args.action;
|
|
1322
|
-
if (freeze) {
|
|
1323
|
-
frozenRightRows[i].style.display = args.action;
|
|
1324
|
-
}
|
|
1325
|
-
const queryselector = args.action === 'none' ? '.e-treecolumn-container .e-treegridcollapse'
|
|
1326
|
-
: '.e-treecolumn-container .e-treegridexpand';
|
|
1327
|
-
if (frozenrows[rows[i].rowIndex].querySelector(queryselector)) {
|
|
1328
|
-
const cRow = [];
|
|
1329
|
-
for (let i = 0; i < movableRows.length; i++) {
|
|
1330
|
-
if (movableRows[i].querySelector('.e-gridrowindex' + rData.index + 'level' + (rData.level + 1))) {
|
|
1331
|
-
cRow.push(movableRows[i]);
|
|
1332
|
-
}
|
|
1333
|
-
}
|
|
1334
|
-
if (cRow.length) {
|
|
1335
|
-
this.rowExpandCollapse({ detailrows: cRow, action: args.action });
|
|
1336
|
-
}
|
|
1337
|
-
}
|
|
1338
|
-
}
|
|
1339
|
-
}
|
|
1340
|
-
dblClickHandler(e) {
|
|
1341
|
-
if (parentsUntil(e.target, 'e-rowcell') &&
|
|
1342
|
-
this.parent.grid.editSettings.allowEditOnDblClick && this.parent.editSettings.mode !== 'Cell') {
|
|
1343
|
-
this.parent.grid.editModule.startEdit(parentsUntil(e.target, 'e-row'));
|
|
1344
|
-
}
|
|
1345
|
-
}
|
|
1346
|
-
dataBoundArg() {
|
|
1347
|
-
const checkboxColumn = this.parent.getColumns().filter((e) => {
|
|
1348
|
-
return e.showCheckbox;
|
|
1349
|
-
});
|
|
1350
|
-
if (checkboxColumn.length && this.parent.freezeModule && this.parent.initialRender) {
|
|
1351
|
-
addClass([this.parent.element.getElementsByClassName('e-grid')[0]], 'e-checkselection');
|
|
1352
|
-
}
|
|
1353
|
-
}
|
|
1354
|
-
destroy() {
|
|
1355
|
-
this.removeEventListener();
|
|
1356
|
-
}
|
|
1357
|
-
/**
|
|
1358
|
-
* For internal use only - Get the module name.
|
|
1359
|
-
*
|
|
1360
|
-
* @private
|
|
1361
|
-
* @returns {string} Returns Freeze module name
|
|
1362
|
-
*/
|
|
1363
|
-
getModuleName() {
|
|
1364
|
-
return 'freeze';
|
|
1365
|
-
}
|
|
1366
|
-
}
|
|
1367
|
-
|
|
1368
1279
|
/**
|
|
1369
1280
|
* TreeGrid Print module
|
|
1370
1281
|
*
|
|
@@ -1526,7 +1437,7 @@ class Render {
|
|
|
1526
1437
|
const parentrec = this.parent.getCurrentViewRecords().filter((rec) => {
|
|
1527
1438
|
return getValue(proxy.idMapping, rec) === getValue(proxy.parentIdMapping, data);
|
|
1528
1439
|
});
|
|
1529
|
-
if (parentrec.length > 0) {
|
|
1440
|
+
if (parentrec.length > 0 && !parentrec[0].isSummaryRow) {
|
|
1530
1441
|
const display = parentrec[0].expanded ? 'table-row' : 'none';
|
|
1531
1442
|
args.row.setAttribute('style', 'display: ' + display + ';');
|
|
1532
1443
|
}
|
|
@@ -1774,6 +1685,8 @@ class Render {
|
|
|
1774
1685
|
const cellRenderer = new CellRenderer(this.parent.grid, this.parent.grid.serviceLocator);
|
|
1775
1686
|
const td = this.parent.getCellFromIndex(rowsObj[j].index, cellIndex - indent);
|
|
1776
1687
|
cellRenderer.refreshTD(td, cell, rowsObj[j].data, { index: rowsObj[j][rowIdx] });
|
|
1688
|
+
const treecell = this.parent.getRows()[j].cells[cellIndex];
|
|
1689
|
+
this.cellRender({ data: rowsObj[j].data, cell: treecell, column: cell.column });
|
|
1777
1690
|
}
|
|
1778
1691
|
}
|
|
1779
1692
|
});
|
|
@@ -2164,8 +2077,8 @@ class DataManipulation {
|
|
|
2164
2077
|
if (!Object.prototype.hasOwnProperty.call(currentData, 'index')) {
|
|
2165
2078
|
currentData.index = this.storedIndex;
|
|
2166
2079
|
}
|
|
2167
|
-
if (!isNullOrUndefined(currentData[this.parent.childMapping]) ||
|
|
2168
|
-
(currentData[this.parent.hasChildMapping] && isCountRequired(this.parent))) {
|
|
2080
|
+
if ((!isNullOrUndefined(currentData[this.parent.childMapping]) && !isCountRequired(this.parent)) ||
|
|
2081
|
+
((currentData[this.parent.hasChildMapping]) && isCountRequired(this.parent) && this.parent.initialRender)) {
|
|
2169
2082
|
currentData.hasChildRecords = true;
|
|
2170
2083
|
if (this.parent.enableCollapseAll || !isNullOrUndefined(this.parent.dataStateChange)
|
|
2171
2084
|
&& isNullOrUndefined(currentData[this.parent.childMapping])) {
|
|
@@ -2317,6 +2230,18 @@ class DataManipulation {
|
|
|
2317
2230
|
srtQry.sortBy(this.parent.grid.sortSettings.columns[srt].field, compFun);
|
|
2318
2231
|
}
|
|
2319
2232
|
const modifiedData = new DataManager(parentData).executeLocal(srtQry);
|
|
2233
|
+
if (this.parent.allowRowDragAndDrop && !isNullOrUndefined(this.parent.rowDragAndDropModule['draggedRecord']) &&
|
|
2234
|
+
this.parent.rowDragAndDropModule['droppedRecord'].hasChildRecords && this.parent.rowDragAndDropModule['dropPosition'] !== 'middleSegment') {
|
|
2235
|
+
const dragdIndex = modifiedData.indexOf(this.parent.rowDragAndDropModule['draggedRecord']);
|
|
2236
|
+
modifiedData.splice(dragdIndex, 1);
|
|
2237
|
+
const dropdIndex = modifiedData.indexOf(this.parent.rowDragAndDropModule['droppedRecord']);
|
|
2238
|
+
if (this.parent.rowDragAndDropModule['droppedRecord'].hasChildRecords && this.parent.rowDragAndDropModule['dropPosition'] === 'topSegment') {
|
|
2239
|
+
modifiedData.splice(dropdIndex, 0, this.parent.rowDragAndDropModule['draggedRecord']);
|
|
2240
|
+
}
|
|
2241
|
+
else if (this.parent.rowDragAndDropModule['dropPosition'] === 'bottomSegment') {
|
|
2242
|
+
modifiedData.splice(dropdIndex + 1, 0, this.parent.rowDragAndDropModule['draggedRecord']);
|
|
2243
|
+
}
|
|
2244
|
+
}
|
|
2320
2245
|
const sortArgs = { modifiedData: modifiedData, filteredData: results, srtQry: srtQry };
|
|
2321
2246
|
this.parent.notify('createSort', sortArgs);
|
|
2322
2247
|
results = sortArgs.modifiedData;
|
|
@@ -3411,7 +3336,6 @@ let TreeGrid = TreeGrid_1 = class TreeGrid extends Component {
|
|
|
3411
3336
|
requiredModules() {
|
|
3412
3337
|
const modules = [];
|
|
3413
3338
|
const splitFrozenCount = 'splitFrozenCount';
|
|
3414
|
-
this.freezeModule = new Freeze$1(this);
|
|
3415
3339
|
this.grid[splitFrozenCount](this.getGridColumns(this.columns));
|
|
3416
3340
|
if (this.isDestroyed) {
|
|
3417
3341
|
return modules;
|
|
@@ -3462,8 +3386,11 @@ let TreeGrid = TreeGrid_1 = class TreeGrid extends Component {
|
|
|
3462
3386
|
member: 'ExcelExport', args: [this]
|
|
3463
3387
|
});
|
|
3464
3388
|
}
|
|
3389
|
+
const freezePresent = this.injectedModules.filter((e) => {
|
|
3390
|
+
return e.prototype.getModuleName() === 'freeze';
|
|
3391
|
+
});
|
|
3465
3392
|
if (this.frozenColumns || this.frozenRows || this.getFrozenColumns() ||
|
|
3466
|
-
this.grid.getFrozenLeftColumnsCount() || this.grid.getFrozenRightColumnsCount() ||
|
|
3393
|
+
this.grid.getFrozenLeftColumnsCount() || this.grid.getFrozenRightColumnsCount() || freezePresent.length) {
|
|
3467
3394
|
modules.push({
|
|
3468
3395
|
member: 'freeze', args: [this]
|
|
3469
3396
|
});
|
|
@@ -4403,6 +4330,9 @@ let TreeGrid = TreeGrid_1 = class TreeGrid extends Component {
|
|
|
4403
4330
|
gridColumn[prop] = this.getGridColumns(column[i][prop], false, index);
|
|
4404
4331
|
treeGridColumn[prop] = column[i][prop];
|
|
4405
4332
|
}
|
|
4333
|
+
else if (this.initialRender && !isNullOrUndefined(treeColumn) && this.enablePersistence && prop === 'edit') {
|
|
4334
|
+
gridColumn[prop] = treeGridColumn[prop] = treeColumn[prop];
|
|
4335
|
+
}
|
|
4406
4336
|
else if (!(treeColumn) || prop !== 'sortComparer') {
|
|
4407
4337
|
gridColumn[prop] = treeGridColumn[prop] = column[i][prop];
|
|
4408
4338
|
}
|
|
@@ -5949,7 +5879,7 @@ let TreeGrid = TreeGrid_1 = class TreeGrid extends Component {
|
|
|
5949
5879
|
}
|
|
5950
5880
|
const args = { data: record, row: row };
|
|
5951
5881
|
let rows = [];
|
|
5952
|
-
rows = gridRows.filter((r) => r.querySelector('.e-gridrowindex' + record.index + 'level' + (record.level + 1)));
|
|
5882
|
+
rows = gridRows.filter((r) => ((r.querySelector('.e-gridrowindex' + record.index + 'level' + (record.level + 1))) || (r.querySelector('.e-gridrowindex' + record.index + 'level0' + '.e-summarycell'))));
|
|
5953
5883
|
if (action === 'expand') {
|
|
5954
5884
|
this.notify(remoteExpand, { record: record, rows: rows, parentRow: row });
|
|
5955
5885
|
const args = { row: row, data: record };
|
|
@@ -7079,7 +7009,8 @@ class RowDD$1 {
|
|
|
7079
7009
|
this.parent[dropPosition] = this.dropPosition;
|
|
7080
7010
|
const data = [];
|
|
7081
7011
|
for (let i = 0; i < fromIndexes.length; i++) {
|
|
7082
|
-
|
|
7012
|
+
const index = this.parent.getRowByIndex(fromIndexes[i]).rowIndex;
|
|
7013
|
+
data[i] = this.parent.getCurrentViewRecords()[index];
|
|
7083
7014
|
}
|
|
7084
7015
|
const isByMethod = true;
|
|
7085
7016
|
const args = {
|
|
@@ -7183,6 +7114,9 @@ class RowDD$1 {
|
|
|
7183
7114
|
else {
|
|
7184
7115
|
dropIndex = this.selectedRow.rowIndex - 1;
|
|
7185
7116
|
}
|
|
7117
|
+
if (this.parent.enableVirtualization && this.parent.allowRowDragAndDrop && this.selectedRecord) {
|
|
7118
|
+
dropIndex = parseInt(this.selectedRow.getAttribute('aria-rowindex'), 10) - 1;
|
|
7119
|
+
}
|
|
7186
7120
|
tObj[action] = 'indenting';
|
|
7187
7121
|
tObj[droppedIndex] = dropIndex;
|
|
7188
7122
|
this.eventTrigger('indenting', dropIndex);
|
|
@@ -7199,6 +7133,9 @@ class RowDD$1 {
|
|
|
7199
7133
|
dropIndex = i;
|
|
7200
7134
|
}
|
|
7201
7135
|
}
|
|
7136
|
+
if (this.parent.enableVirtualization && this.parent.allowRowDragAndDrop && this.selectedRecord) {
|
|
7137
|
+
dropIndex = parseInt(this.parent.getRows()[dropIndex].getAttribute('aria-rowindex'), 10);
|
|
7138
|
+
}
|
|
7202
7139
|
tObj[action] = 'outdenting';
|
|
7203
7140
|
tObj[droppedIndex] = dropIndex;
|
|
7204
7141
|
this.eventTrigger('outdenting', dropIndex);
|
|
@@ -7215,10 +7152,20 @@ class RowDD$1 {
|
|
|
7215
7152
|
this.parent.trigger(actionBegin, actionArgs, (actionArgs) => {
|
|
7216
7153
|
if (!actionArgs.cancel) {
|
|
7217
7154
|
if (actionArgs.action === 'indenting') {
|
|
7218
|
-
|
|
7155
|
+
if (this.parent.enableVirtualization && this.parent.allowRowDragAndDrop) {
|
|
7156
|
+
this.reorderRows([parseInt(this.selectedRow.getAttribute('aria-rowindex'), 10)], dropIndex, 'child');
|
|
7157
|
+
}
|
|
7158
|
+
else {
|
|
7159
|
+
this.reorderRows([this.selectedRow.rowIndex], dropIndex, 'child');
|
|
7160
|
+
}
|
|
7219
7161
|
}
|
|
7220
7162
|
else if (actionArgs.action === 'outdenting') {
|
|
7221
|
-
|
|
7163
|
+
if (this.parent.enableVirtualization && this.parent.allowRowDragAndDrop) {
|
|
7164
|
+
this.reorderRows([parseInt(this.selectedRow.getAttribute('aria-rowindex'), 10)], dropIndex, 'below');
|
|
7165
|
+
}
|
|
7166
|
+
else {
|
|
7167
|
+
this.reorderRows([this.selectedRow.rowIndex], dropIndex, 'below');
|
|
7168
|
+
}
|
|
7222
7169
|
}
|
|
7223
7170
|
}
|
|
7224
7171
|
});
|
|
@@ -7413,9 +7360,17 @@ class RowDD$1 {
|
|
|
7413
7360
|
removeLastrowBorder(element) {
|
|
7414
7361
|
const isEmptyRow = element && (element.classList.contains('e-emptyrow') || element.classList.contains('e-columnheader')
|
|
7415
7362
|
|| element.classList.contains('e-detailrow'));
|
|
7416
|
-
|
|
7417
|
-
|
|
7418
|
-
|
|
7363
|
+
let islastRowIndex;
|
|
7364
|
+
if (this.parent.enableVirtualization) {
|
|
7365
|
+
islastRowIndex = element && !isEmptyRow &&
|
|
7366
|
+
this.parent.getRows()[this.parent.getCurrentViewRecords().length - 1].getAttribute('data-uid') !==
|
|
7367
|
+
element.getAttribute('data-uid');
|
|
7368
|
+
}
|
|
7369
|
+
else {
|
|
7370
|
+
islastRowIndex = element && !isEmptyRow &&
|
|
7371
|
+
this.parent.getRowByIndex(this.parent.getCurrentViewRecords().length - 1).getAttribute('data-uid') !==
|
|
7372
|
+
element.getAttribute('data-uid');
|
|
7373
|
+
}
|
|
7419
7374
|
const canremove = islastRowIndex || this.dropPosition === 'topSegment';
|
|
7420
7375
|
if (this.parent.element.getElementsByClassName('e-lastrow-border').length > 0 && element && (islastRowIndex || canremove)) {
|
|
7421
7376
|
this.parent.element.getElementsByClassName('e-lastrow-border')[0].remove();
|
|
@@ -7449,7 +7404,12 @@ class RowDD$1 {
|
|
|
7449
7404
|
rowPositionHeight = rowEle.offsetTop - scrollTop;
|
|
7450
7405
|
}
|
|
7451
7406
|
// let scrollTop = (tObj.grid.scrollModule as any).content.scrollTop;
|
|
7452
|
-
|
|
7407
|
+
if (this.parent.enableVirtualization) {
|
|
7408
|
+
rowTop = rowEle.getBoundingClientRect().top;
|
|
7409
|
+
}
|
|
7410
|
+
else {
|
|
7411
|
+
rowTop = rowPositionHeight + contentHeight + roundOff;
|
|
7412
|
+
}
|
|
7453
7413
|
const rowBottom = rowTop + row[0].offsetHeight;
|
|
7454
7414
|
const difference = rowBottom - rowTop;
|
|
7455
7415
|
const divide = difference / 3;
|
|
@@ -7529,7 +7489,7 @@ class RowDD$1 {
|
|
|
7529
7489
|
addLastRowborder(trElement) {
|
|
7530
7490
|
const isEmptyRow = trElement && (trElement.classList.contains('e-emptyrow') ||
|
|
7531
7491
|
trElement.classList.contains('e-columnheader') || trElement.classList.contains('e-detailrow'));
|
|
7532
|
-
if (trElement && !isEmptyRow && this.parent.
|
|
7492
|
+
if (trElement && !isEmptyRow && this.parent.getRows()[this.parent.getCurrentViewRecords().length - 1].getAttribute('data-uid') ===
|
|
7533
7493
|
trElement.getAttribute('data-uid')) {
|
|
7534
7494
|
const bottomborder = this.parent.createElement('div', { className: 'e-lastrow-border' });
|
|
7535
7495
|
const gridcontentEle = this.parent.getContent();
|
|
@@ -7871,7 +7831,13 @@ class RowDD$1 {
|
|
|
7871
7831
|
}
|
|
7872
7832
|
else {
|
|
7873
7833
|
args.dropIndex = args.dropIndex === args.fromIndex ? this.getTargetIdx(args.target.parentElement) : args.dropIndex;
|
|
7874
|
-
this.
|
|
7834
|
+
if (this.parent.enableVirtualization) {
|
|
7835
|
+
const index = this.parent.getRowByIndex(args.dropIndex).rowIndex;
|
|
7836
|
+
this.droppedRecord = tObj.getCurrentViewRecords()[index];
|
|
7837
|
+
}
|
|
7838
|
+
else {
|
|
7839
|
+
this.droppedRecord = tObj.getCurrentViewRecords()[args.dropIndex];
|
|
7840
|
+
}
|
|
7875
7841
|
}
|
|
7876
7842
|
let dragRecords = [];
|
|
7877
7843
|
droppedRecord = this.droppedRecord;
|
|
@@ -7948,6 +7914,7 @@ class RowDD$1 {
|
|
|
7948
7914
|
childRecords.splice(droppedRecordIndex, 0, draggedRecord);
|
|
7949
7915
|
draggedRecord.parentItem = droppedRecord.parentItem;
|
|
7950
7916
|
draggedRecord.parentUniqueID = droppedRecord.parentUniqueID;
|
|
7917
|
+
draggedRecord.level = droppedRecord.level;
|
|
7951
7918
|
if (this.parent.parentIdMapping) {
|
|
7952
7919
|
draggedRecord[this.parent.parentIdMapping] = droppedRecord[this.parent.parentIdMapping];
|
|
7953
7920
|
draggedRecord.parentItem = droppedRecord.parentItem;
|
|
@@ -9663,6 +9630,17 @@ class Sort$1 {
|
|
|
9663
9630
|
}
|
|
9664
9631
|
if (data[d].hasChildRecords) {
|
|
9665
9632
|
const childSort = (new DataManager(data[d].childRecords).executeLocal(srtQry));
|
|
9633
|
+
if (this.parent.allowRowDragAndDrop && data[d].childRecords.indexOf(this.parent.rowDragAndDropModule['draggedRecord']) !== -1 && this.parent.rowDragAndDropModule['dropPosition'] !== 'middleSegment') {
|
|
9634
|
+
const dragdIndex = childSort.indexOf(this.parent.rowDragAndDropModule['draggedRecord']);
|
|
9635
|
+
childSort.splice(dragdIndex, 1);
|
|
9636
|
+
const dropdIndex = childSort.indexOf(this.parent.rowDragAndDropModule['droppedRecord']);
|
|
9637
|
+
if (this.parent.rowDragAndDropModule['dropPosition'] === 'topSegment') {
|
|
9638
|
+
childSort.splice(dropdIndex, 0, this.parent.rowDragAndDropModule['draggedRecord']);
|
|
9639
|
+
}
|
|
9640
|
+
else if (this.parent.rowDragAndDropModule['dropPosition'] === 'bottomSegment') {
|
|
9641
|
+
childSort.splice(dropdIndex + 1, 0, this.parent.rowDragAndDropModule['draggedRecord']);
|
|
9642
|
+
}
|
|
9643
|
+
}
|
|
9666
9644
|
this.iterateSort(childSort, srtQry);
|
|
9667
9645
|
}
|
|
9668
9646
|
}
|
|
@@ -10479,7 +10457,12 @@ class BatchEdit {
|
|
|
10479
10457
|
nextCellIndex(args) {
|
|
10480
10458
|
const index = 'index';
|
|
10481
10459
|
const rowIndex = 'rowIndex';
|
|
10482
|
-
|
|
10460
|
+
if (this.parent.getSelectedRows().length) {
|
|
10461
|
+
args[index] = this.parent.getSelectedRows()[0][rowIndex];
|
|
10462
|
+
}
|
|
10463
|
+
else {
|
|
10464
|
+
args[index] = this.batchIndex;
|
|
10465
|
+
}
|
|
10483
10466
|
}
|
|
10484
10467
|
}
|
|
10485
10468
|
|
|
@@ -11006,9 +10989,11 @@ class Edit$1 {
|
|
|
11006
10989
|
this.parent.parentData.push(data[i]);
|
|
11007
10990
|
}
|
|
11008
10991
|
}
|
|
11009
|
-
if (
|
|
11010
|
-
|
|
11011
|
-
|
|
10992
|
+
if (!this.parent.enableInfiniteScrolling) {
|
|
10993
|
+
if (details.action === 'add' && this.previousNewRowPosition != null) {
|
|
10994
|
+
this.parent.setProperties({ editSettings: { newRowPosition: this.previousNewRowPosition } }, true);
|
|
10995
|
+
this.previousNewRowPosition = null;
|
|
10996
|
+
}
|
|
11012
10997
|
}
|
|
11013
10998
|
}
|
|
11014
10999
|
updateIndex(data, rows, records) {
|
|
@@ -11252,14 +11237,19 @@ class Edit$1 {
|
|
|
11252
11237
|
}
|
|
11253
11238
|
else {
|
|
11254
11239
|
if (this.isAddedRowByMethod && (this.parent.enableVirtualization || this.parent.enableInfiniteScrolling)) {
|
|
11255
|
-
|
|
11240
|
+
if (args.index !== 0) {
|
|
11241
|
+
this.addRowIndex = args.index;
|
|
11242
|
+
}
|
|
11243
|
+
else {
|
|
11244
|
+
this.addRowIndex = this.parent.grid.selectedRowIndex;
|
|
11245
|
+
}
|
|
11256
11246
|
}
|
|
11257
11247
|
else {
|
|
11258
11248
|
this.addRowIndex = this.parent.grid.selectedRowIndex > -1 ? this.parent.grid.selectedRowIndex : 0;
|
|
11259
11249
|
}
|
|
11260
11250
|
}
|
|
11261
11251
|
if (this.isAddedRowByMethod && (this.parent.enableVirtualization || this.parent.enableInfiniteScrolling)) {
|
|
11262
|
-
this.addRowRecord = this.parent.flatData[
|
|
11252
|
+
this.addRowRecord = this.parent.flatData[this.parent.grid.selectedRowIndex];
|
|
11263
11253
|
}
|
|
11264
11254
|
else {
|
|
11265
11255
|
this.addRowRecord = this.parent.getSelectedRecords()[0];
|
|
@@ -11742,7 +11732,7 @@ class VirtualTreeContentRenderer extends VirtualContentRenderer {
|
|
|
11742
11732
|
getValue('virtualEle', this).setVirtualHeight(this.parent.getRowHeight() * e.count, '100%');
|
|
11743
11733
|
}
|
|
11744
11734
|
}
|
|
11745
|
-
if ((!isNullOrUndefined(e.requestType) && e.requestType.toString() === 'collapseAll') || (this.isDataSourceChanged && this.startIndex === -1)) {
|
|
11735
|
+
if ((!isNullOrUndefined(e.requestType) && e.requestType.toString() === 'collapseAll') || (this.isDataSourceChanged && (this.startIndex === -1 || this.startIndex === 0 && this['preStartIndex'] === 0))) {
|
|
11746
11736
|
this.contents.scrollTop = 0;
|
|
11747
11737
|
this.isDataSourceChanged = false;
|
|
11748
11738
|
}
|
|
@@ -11971,7 +11961,12 @@ class VirtualTreeContentRenderer extends VirtualContentRenderer {
|
|
|
11971
11961
|
firsttdinx = +attr; // this.parent.getContent().querySelector('.e-content tr').getAttribute('aria-rowindex');
|
|
11972
11962
|
}
|
|
11973
11963
|
if (firsttdinx === 0) {
|
|
11974
|
-
this.
|
|
11964
|
+
if (this.parent.allowRowDragAndDrop) {
|
|
11965
|
+
this.translateY = scrollArgs.offset.top - this.parent.getRowHeight() * 2;
|
|
11966
|
+
}
|
|
11967
|
+
else {
|
|
11968
|
+
this.translateY = scrollArgs.offset.top;
|
|
11969
|
+
}
|
|
11975
11970
|
}
|
|
11976
11971
|
else {
|
|
11977
11972
|
const height = this.parent.getRowHeight();
|
|
@@ -11997,7 +11992,12 @@ class VirtualTreeContentRenderer extends VirtualContentRenderer {
|
|
|
11997
11992
|
this.translateY = this.getTranslateY(scrollArgs.offset.top, content.getBoundingClientRect().height);
|
|
11998
11993
|
}
|
|
11999
11994
|
else {
|
|
12000
|
-
this.
|
|
11995
|
+
if (this.parent.allowRowDragAndDrop) {
|
|
11996
|
+
this.translateY = scrollArgs.offset.top - this.parent.getRowHeight() * 2;
|
|
11997
|
+
}
|
|
11998
|
+
else {
|
|
11999
|
+
this.translateY = scrollArgs.offset.top;
|
|
12000
|
+
}
|
|
12001
12001
|
}
|
|
12002
12002
|
}
|
|
12003
12003
|
if (((downScroll && (scrollArgs.offset.top < (this.parent.getRowHeight() * this.totalRecords)))
|
|
@@ -12359,6 +12359,100 @@ class TreeVirtual extends VirtualScroll {
|
|
|
12359
12359
|
}
|
|
12360
12360
|
}
|
|
12361
12361
|
|
|
12362
|
+
/**
|
|
12363
|
+
* TreeGrid Freeze module
|
|
12364
|
+
*
|
|
12365
|
+
* @hidden
|
|
12366
|
+
*/
|
|
12367
|
+
class Freeze$1 {
|
|
12368
|
+
/**
|
|
12369
|
+
* Constructor for render module
|
|
12370
|
+
*
|
|
12371
|
+
* @param {TreeGrid} parent - Tree Grid instance
|
|
12372
|
+
*/
|
|
12373
|
+
constructor(parent) {
|
|
12374
|
+
Grid.Inject(Freeze);
|
|
12375
|
+
this.parent = parent;
|
|
12376
|
+
this.addEventListener();
|
|
12377
|
+
}
|
|
12378
|
+
addEventListener() {
|
|
12379
|
+
this.parent.on('rowExpandCollapse', this.rowExpandCollapse, this);
|
|
12380
|
+
this.parent.on('dataBoundArg', this.dataBoundArg, this);
|
|
12381
|
+
this.parent.grid.on('dblclick', this.dblClickHandler, this);
|
|
12382
|
+
}
|
|
12383
|
+
removeEventListener() {
|
|
12384
|
+
if (this.parent.isDestroyed) {
|
|
12385
|
+
return;
|
|
12386
|
+
}
|
|
12387
|
+
this.parent.off('rowExpandCollapse', this.rowExpandCollapse);
|
|
12388
|
+
this.parent.off('dataBoundArg', this.dataBoundArg);
|
|
12389
|
+
this.parent.grid.off('dblclick', this.dblClickHandler);
|
|
12390
|
+
}
|
|
12391
|
+
rowExpandCollapse(args) {
|
|
12392
|
+
const movableRows = this.parent.getMovableDataRows();
|
|
12393
|
+
const frozenrows = this.parent.getRows();
|
|
12394
|
+
let rows;
|
|
12395
|
+
let frozenRightRows;
|
|
12396
|
+
const freeze = (this.parent.getFrozenLeftColumnsCount() > 0 ||
|
|
12397
|
+
this.parent.getFrozenRightColumnsCount() > 0) ? true : false;
|
|
12398
|
+
if (freeze) {
|
|
12399
|
+
frozenRightRows = this.parent.getFrozenRightRows().filter((e) => e.querySelector('.e-gridrowindex' + args.record.index + 'level' + (args.record.level + 1)));
|
|
12400
|
+
}
|
|
12401
|
+
if (!args.detailrows.length) {
|
|
12402
|
+
rows = movableRows.filter((e) => e.querySelector('.e-gridrowindex' + args.record.index + 'level' + (args.record.level + 1)));
|
|
12403
|
+
}
|
|
12404
|
+
else {
|
|
12405
|
+
rows = args.detailrows;
|
|
12406
|
+
}
|
|
12407
|
+
for (let i = 0; i < rows.length; i++) {
|
|
12408
|
+
const rData = this.parent.grid.getRowObjectFromUID(rows[i].getAttribute('data-Uid')).data;
|
|
12409
|
+
rows[i].style.display = args.action;
|
|
12410
|
+
if (freeze) {
|
|
12411
|
+
frozenRightRows[i].style.display = args.action;
|
|
12412
|
+
}
|
|
12413
|
+
const queryselector = args.action === 'none' ? '.e-treecolumn-container .e-treegridcollapse'
|
|
12414
|
+
: '.e-treecolumn-container .e-treegridexpand';
|
|
12415
|
+
if (frozenrows[rows[i].rowIndex].querySelector(queryselector)) {
|
|
12416
|
+
const cRow = [];
|
|
12417
|
+
for (let i = 0; i < movableRows.length; i++) {
|
|
12418
|
+
if (movableRows[i].querySelector('.e-gridrowindex' + rData.index + 'level' + (rData.level + 1))) {
|
|
12419
|
+
cRow.push(movableRows[i]);
|
|
12420
|
+
}
|
|
12421
|
+
}
|
|
12422
|
+
if (cRow.length) {
|
|
12423
|
+
this.rowExpandCollapse({ detailrows: cRow, action: args.action });
|
|
12424
|
+
}
|
|
12425
|
+
}
|
|
12426
|
+
}
|
|
12427
|
+
}
|
|
12428
|
+
dblClickHandler(e) {
|
|
12429
|
+
if (parentsUntil(e.target, 'e-rowcell') &&
|
|
12430
|
+
this.parent.grid.editSettings.allowEditOnDblClick && this.parent.editSettings.mode !== 'Cell') {
|
|
12431
|
+
this.parent.grid.editModule.startEdit(parentsUntil(e.target, 'e-row'));
|
|
12432
|
+
}
|
|
12433
|
+
}
|
|
12434
|
+
dataBoundArg() {
|
|
12435
|
+
const checkboxColumn = this.parent.getColumns().filter((e) => {
|
|
12436
|
+
return e.showCheckbox;
|
|
12437
|
+
});
|
|
12438
|
+
if (checkboxColumn.length && this.parent.freezeModule && this.parent.initialRender) {
|
|
12439
|
+
addClass([this.parent.element.getElementsByClassName('e-grid')[0]], 'e-checkselection');
|
|
12440
|
+
}
|
|
12441
|
+
}
|
|
12442
|
+
destroy() {
|
|
12443
|
+
this.removeEventListener();
|
|
12444
|
+
}
|
|
12445
|
+
/**
|
|
12446
|
+
* For internal use only - Get the module name.
|
|
12447
|
+
*
|
|
12448
|
+
* @private
|
|
12449
|
+
* @returns {string} Returns Freeze module name
|
|
12450
|
+
*/
|
|
12451
|
+
getModuleName() {
|
|
12452
|
+
return 'freeze';
|
|
12453
|
+
}
|
|
12454
|
+
}
|
|
12455
|
+
|
|
12362
12456
|
/**
|
|
12363
12457
|
* TreeGrid ColumnChooser module
|
|
12364
12458
|
*
|