@sd-angular/core 0.0.1003 → 0.0.1004
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/bundles/sd-angular-core-grid-material.umd.js +23 -7
- package/bundles/sd-angular-core-grid-material.umd.js.map +1 -1
- package/bundles/sd-angular-core-grid-material.umd.min.js +2 -2
- package/bundles/sd-angular-core-grid-material.umd.min.js.map +1 -1
- package/esm2015/grid-material/src/lib/components/quick-action/quick-action.component.js +7 -4
- package/esm2015/grid-material/src/lib/grid-material.component.js +13 -3
- package/esm2015/grid-material/src/lib/models/grid.model.js +1 -1
- package/esm2015/grid-material/src/lib/pipes/selection-disable.pipe.js +3 -2
- package/esm2015/grid-material/src/lib/pipes/selection-visible.pipe.js +4 -3
- package/fesm2015/sd-angular-core-grid-material.js +22 -7
- package/fesm2015/sd-angular-core-grid-material.js.map +1 -1
- package/grid-material/sd-angular-core-grid-material.metadata.json +1 -1
- package/grid-material/src/lib/components/quick-action/quick-action.component.d.ts +2 -0
- package/grid-material/src/lib/grid-material.component.d.ts +1 -0
- package/grid-material/src/lib/models/grid.model.d.ts +1 -0
- package/package.json +1 -1
- package/{sd-angular-core-0.0.1003.tgz → sd-angular-core-0.0.1004.tgz} +0 -0
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export {};
|
|
2
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
2
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZ3JpZC5tb2RlbC5qcyIsInNvdXJjZVJvb3QiOiJDOi9Vc2Vycy9uZ2hpYXR0MTUvRGVza3RvcC9Xb3JraW5nLzFNRy9saWItY29yZS11aS9wcm9qZWN0cy9zZC1jb3JlL2dyaWQtbWF0ZXJpYWwvIiwic291cmNlcyI6WyJzcmMvbGliL21vZGVscy9ncmlkLm1vZGVsLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBPYnNlcnZhYmxlIH0gZnJvbSBcInJ4anNcIjtcclxuZXhwb3J0IGludGVyZmFjZSBFZGl0b3JIYW5kbGVyIHtcclxuICBbY29sdW1uOiBzdHJpbmddOiB7XHJcbiAgICB2aXNpYmxlPzogYm9vbGVhbiB8ICdjcmVhdGUnIHwgJ3VwZGF0ZScsXHJcbiAgICBpdGVtcz86IGFueVtdIHwgT2JzZXJ2YWJsZTxhbnlbXT5cclxuICB9O1xyXG59XHJcblxyXG5leHBvcnQgaW50ZXJmYWNlIFNkSXRlbSB7XHJcbiAgc2RJZD86IHN0cmluZztcclxuICBvcmlnaW5JdGVtPzogYW55O1xyXG4gIHNlbGVjdGFibGU/OiBib29sZWFuO1xyXG4gIGlzU2VsZWN0ZWQ/OiBib29sZWFuO1xyXG4gIGFjdGlvbnM/OiBzdHJpbmdbXTtcclxuICBpc0V4cGFuZGVkPzogYm9vbGVhbjtcclxuICBpc0V4cGFuZGluZz86IGJvb2xlYW47XHJcbiAgZXhwYW5kRGV0YWlsPzogYW55O1xyXG4gIGVkaXRvckVycm9yTWVzc2FnZT86IHN0cmluZztcclxuICBlZGl0b3JTdGF0dXM/OiAnY3JlYXRlJyB8ICd1cGRhdGUnO1xyXG4gIGVkaXRvckhhbmRsZXJSb3c/OiBFZGl0b3JIYW5kbGVyUm93LFxyXG4gIGVkaXRvckhhbmRsZXJDb2x1bW4/OiB7XHJcbiAgICBba2V5OiBzdHJpbmddOiB7XHJcbiAgICAgIHZpc2libGU6IGJvb2xlYW47XHJcbiAgICAgIGVycm9yTWVzc2FnZT86IHN0cmluZztcclxuICAgIH1cclxuICB9XHJcbn1cclxuXHJcbmV4cG9ydCBpbnRlcmZhY2UgRWRpdG9ySGFuZGxlclJvdyB7XHJcbiAgc3RhdHVzPzogJ2NyZWF0ZScgfCAndXBkYXRlJztcclxuICB2aXNpYmxlPzogYm9vbGVhbjtcclxuICBlZGl0YWJsZT86IGJvb2xlYW47XHJcbiAgcmVtb3ZhYmxlPzogYm9vbGVhbjtcclxuICBzYXZhYmxlPzogYm9vbGVhbjtcclxuICBjYW5jZWxhYmxlPzogYm9vbGVhbjtcclxuICBlcnJvck1lc3NhZ2U/OiBzdHJpbmc7XHJcbiAgdGVtcG9yYXJ5PzogYW55O1xyXG4gIHNhdmluZz86IGJvb2xlYW47XHJcbn1cclxuXHJcbmV4cG9ydCB0eXBlIFNkR3JpZE1hdGVyaWFsSXRlbTxUID0gYW55PiA9IFQgJiBTZEl0ZW07XHJcblxyXG5cclxuXHJcbi8vIGV4cG9ydCBpbnRlcmZhY2UgU2RHcmlkTWF0ZXJpYWxJdGVtPFQgPSBhbnk+IHtcclxuLy8gICBpc1NlbGVjdGVkPzogYm9vbGVhbjtcclxuLy8gICBpc0V4cGFuZGVkPzogYm9vbGVhbjtcclxuLy8gICBpc0V4cGFuZGluZz86IGJvb2xlYW47XHJcbi8vICAgZXhwYW5kRGV0YWlsPzogYW55O1xyXG4vLyB9XHJcblxyXG5leHBvcnQgaW50ZXJmYWNlIEdyaWRJdGVtIHtcclxuICBibGlua2VyPzogYW55O1xyXG4gIG9yaWdpbkl0ZW0/OiBhbnk7XHJcbiAgdGVtcG9yYXJ5PzogYW55O1xyXG4gIGlzQ2hlY2tlZD86IGJvb2xlYW47XHJcbiAgZWRpdGluZ1N0YXR1cz86ICdjcmVhdGUnIHwgJ3VwZGF0ZSc7XHJcbiAgZWRpdG9ySGFuZGxlcj86IEVkaXRvckhhbmRsZXIgJiB7XHJcbiAgICBkaXNhYmxlZD86IGJvb2xlYW47XHJcbiAgICBlcnJvck1lc3NhZ2U/OiBzdHJpbmc7XHJcbiAgICBzYXZpbmc/OiBib29sZWFuO1xyXG4gIH07XHJcbiAgc3ViSW5mb3JtYXRpb24/OiB7XHJcbiAgICBpc09wZW5lZD86IGJvb2xlYW47XHJcbiAgICBpc0xvYWRlZD86IGJvb2xlYW47XHJcbiAgICBpc0xvYWRpbmc/OiBib29sZWFuO1xyXG4gICAgc3ViSXRlbXM/OiBhbnlbXTtcclxuICB9O1xyXG4gIFtrZXk6IHN0cmluZ106IGFueTtcclxufSJdfQ==
|
|
@@ -8,7 +8,8 @@ export class SdSelectionDisablePipe {
|
|
|
8
8
|
if (!disabled) {
|
|
9
9
|
return false;
|
|
10
10
|
}
|
|
11
|
-
|
|
11
|
+
rowData.selectable = !disabled(rowData, selectedItems);
|
|
12
|
+
return !rowData.selectable;
|
|
12
13
|
}
|
|
13
14
|
// Lọc các action theo selectedItems hiện tại
|
|
14
15
|
const availableActions = actions.filter(action => {
|
|
@@ -50,4 +51,4 @@ SdSelectionDisablePipe.decorators = [
|
|
|
50
51
|
name: 'selectionDisable'
|
|
51
52
|
},] }
|
|
52
53
|
];
|
|
53
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
54
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2VsZWN0aW9uLWRpc2FibGUucGlwZS5qcyIsInNvdXJjZVJvb3QiOiJDOi9Vc2Vycy9uZ2hpYXR0MTUvRGVza3RvcC9Xb3JraW5nLzFNRy9saWItY29yZS11aS9wcm9qZWN0cy9zZC1jb3JlL2dyaWQtbWF0ZXJpYWwvIiwic291cmNlcyI6WyJzcmMvbGliL3BpcGVzL3NlbGVjdGlvbi1kaXNhYmxlLnBpcGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLElBQUksRUFBaUIsTUFBTSxlQUFlLENBQUM7QUFDcEQsT0FBTyxJQUFJLE1BQU0sYUFBYSxDQUFDO0FBTS9CLE1BQU0sT0FBTyxzQkFBc0I7SUFIbkM7UUFJRSxjQUFTLEdBQUcsQ0FBQyxhQUF1QixFQUFFLE9BQWUsRUFBRSxTQUFrQyxFQUFXLEVBQUU7WUFDcEcsTUFBTSxFQUFFLFFBQVEsRUFBRSxPQUFPLEVBQUUsR0FBRyxTQUFTLENBQUM7WUFDeEMsSUFBSSxFQUFDLE9BQU8sYUFBUCxPQUFPLHVCQUFQLE9BQU8sQ0FBRSxNQUFNLENBQUEsRUFBRTtnQkFDcEIsSUFBSSxDQUFDLFFBQVEsRUFBRTtvQkFDYixPQUFPLEtBQUssQ0FBQztpQkFDZDtnQkFDRCxPQUFPLENBQUMsVUFBVSxHQUFHLENBQUMsUUFBUSxDQUFDLE9BQU8sRUFBRSxhQUFhLENBQUMsQ0FBQztnQkFDdkQsT0FBTyxDQUFDLE9BQU8sQ0FBQyxVQUFVLENBQUM7YUFDNUI7WUFDRCw2Q0FBNkM7WUFDN0MsTUFBTSxnQkFBZ0IsR0FBRyxPQUFPLENBQUMsTUFBTSxDQUFDLE1BQU0sQ0FBQyxFQUFFO2dCQUMvQyxJQUFJLFVBQVUsSUFBSSxNQUFNLEVBQUU7b0JBQ3hCLEtBQUssTUFBTSxXQUFXLElBQUksTUFBTSxDQUFDLFFBQVEsRUFBRTt3QkFDekMsTUFBTSxHQUFHLEdBQUcsSUFBSSxDQUFDLFdBQVcsQ0FBQyxDQUFDO3dCQUM5QixJQUFJLGFBQWEsQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQyxDQUFDLENBQUMsT0FBTyxDQUFDLFFBQVEsQ0FBQyxHQUFHLENBQUMsQ0FBQyxFQUFFOzRCQUNyRCxPQUFPLElBQUksQ0FBQzt5QkFDYjtxQkFDRjtvQkFDRCxPQUFPLEtBQUssQ0FBQztpQkFDZDtxQkFBTTtvQkFDTCxNQUFNLEdBQUcsR0FBRyxJQUFJLENBQUMsTUFBTSxDQUFDLENBQUM7b0JBQ3pCLE9BQU8sYUFBYSxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUMsRUFBRSxDQUFDLENBQUMsQ0FBQyxPQUFPLENBQUMsUUFBUSxDQUFDLEdBQUcsQ0FBQyxDQUFDLENBQUM7aUJBQzFEO1lBQ0gsQ0FBQyxDQUFDLENBQUM7WUFDSCxrRUFBa0U7WUFDbEUsS0FBSyxNQUFNLE1BQU0sSUFBSSxnQkFBZ0IsRUFBRTtnQkFDckMsSUFBSSxVQUFVLElBQUksTUFBTSxFQUFFO29CQUN4QixLQUFLLE1BQU0sV0FBVyxJQUFJLE1BQU0sQ0FBQyxRQUFRLEVBQUU7d0JBQ3pDLElBQUcsT0FBTyxDQUFDLE9BQU8sQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLFdBQVcsQ0FBQyxDQUFDLEVBQUU7NEJBQzlDLE9BQU8sS0FBSyxDQUFDO3lCQUNkO3FCQUNGO2lCQUNGO3FCQUFNO29CQUNMLElBQUcsT0FBTyxDQUFDLE9BQU8sQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxDQUFDLEVBQUU7d0JBQ3pDLE9BQU8sS0FBSyxDQUFDO3FCQUNkO2lCQUNGO2FBQ0Y7WUFDRCxPQUFPLElBQUksQ0FBQztRQUNkLENBQUMsQ0FBQTtJQUNILENBQUM7OztZQTVDQSxJQUFJLFNBQUM7Z0JBQ0osSUFBSSxFQUFFLGtCQUFrQjthQUN6QiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IFBpcGUsIFBpcGVUcmFuc2Zvcm0gfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IGhhc2ggZnJvbSAnb2JqZWN0LWhhc2gnO1xyXG5pbXBvcnQgeyBTZEdyaWRNYXRlcmlhbFNlbGVjdGlvbiB9IGZyb20gJy4uL21vZGVscy9ncmlkLXNlbGVjdGlvbi5tb2RlbCc7XHJcbmltcG9ydCB7IFNkSXRlbSB9IGZyb20gJy4uL21vZGVscy9ncmlkLm1vZGVsJztcclxuQFBpcGUoe1xyXG4gIG5hbWU6ICdzZWxlY3Rpb25EaXNhYmxlJ1xyXG59KVxyXG5leHBvcnQgY2xhc3MgU2RTZWxlY3Rpb25EaXNhYmxlUGlwZSBpbXBsZW1lbnRzIFBpcGVUcmFuc2Zvcm0ge1xyXG4gIHRyYW5zZm9ybSA9IChzZWxlY3RlZEl0ZW1zOiBTZEl0ZW1bXSwgcm93RGF0YTogU2RJdGVtLCBzZWxlY3Rpb246IFNkR3JpZE1hdGVyaWFsU2VsZWN0aW9uKTogYm9vbGVhbiA9PiB7XHJcbiAgICBjb25zdCB7IGRpc2FibGVkLCBhY3Rpb25zIH0gPSBzZWxlY3Rpb247XHJcbiAgICBpZiAoIWFjdGlvbnM/Lmxlbmd0aCkge1xyXG4gICAgICBpZiAoIWRpc2FibGVkKSB7XHJcbiAgICAgICAgcmV0dXJuIGZhbHNlO1xyXG4gICAgICB9XHJcbiAgICAgIHJvd0RhdGEuc2VsZWN0YWJsZSA9ICFkaXNhYmxlZChyb3dEYXRhLCBzZWxlY3RlZEl0ZW1zKTtcclxuICAgICAgcmV0dXJuICFyb3dEYXRhLnNlbGVjdGFibGU7XHJcbiAgICB9XHJcbiAgICAvLyBM4buNYyBjw6FjIGFjdGlvbiB0aGVvIHNlbGVjdGVkSXRlbXMgaGnhu4duIHThuqFpXHJcbiAgICBjb25zdCBhdmFpbGFibGVBY3Rpb25zID0gYWN0aW9ucy5maWx0ZXIoYWN0aW9uID0+IHtcclxuICAgICAgaWYgKCdjaGlsZHJlbicgaW4gYWN0aW9uKSB7XHJcbiAgICAgICAgZm9yIChjb25zdCBjaGlsZEFjdGlvbiBvZiBhY3Rpb24uY2hpbGRyZW4pIHtcclxuICAgICAgICAgIGNvbnN0IGtleSA9IGhhc2goY2hpbGRBY3Rpb24pO1xyXG4gICAgICAgICAgaWYgKHNlbGVjdGVkSXRlbXMuZXZlcnkoZSA9PiBlLmFjdGlvbnMuaW5jbHVkZXMoa2V5KSkpIHtcclxuICAgICAgICAgICAgcmV0dXJuIHRydWU7XHJcbiAgICAgICAgICB9XHJcbiAgICAgICAgfVxyXG4gICAgICAgIHJldHVybiBmYWxzZTtcclxuICAgICAgfSBlbHNlIHtcclxuICAgICAgICBjb25zdCBrZXkgPSBoYXNoKGFjdGlvbik7XHJcbiAgICAgICAgcmV0dXJuIHNlbGVjdGVkSXRlbXMuZXZlcnkoZSA9PiBlLmFjdGlvbnMuaW5jbHVkZXMoa2V5KSk7XHJcbiAgICAgIH1cclxuICAgIH0pO1xyXG4gICAgLy8gS2nhu4NtIHRyYSByb3dEYXRhIGPDsyBhY3Rpb24gbsOgbyB0aOG7j2EgaGF5IGtvLCBu4bq/dSBrbyB0aMOsIGRpc2FibGVkXHJcbiAgICBmb3IgKGNvbnN0IGFjdGlvbiBvZiBhdmFpbGFibGVBY3Rpb25zKSB7XHJcbiAgICAgIGlmICgnY2hpbGRyZW4nIGluIGFjdGlvbikge1xyXG4gICAgICAgIGZvciAoY29uc3QgY2hpbGRBY3Rpb24gb2YgYWN0aW9uLmNoaWxkcmVuKSB7XHJcbiAgICAgICAgICBpZihyb3dEYXRhLmFjdGlvbnMuaW5jbHVkZXMoaGFzaChjaGlsZEFjdGlvbikpKSB7XHJcbiAgICAgICAgICAgIHJldHVybiBmYWxzZTtcclxuICAgICAgICAgIH1cclxuICAgICAgICB9XHJcbiAgICAgIH0gZWxzZSB7XHJcbiAgICAgICAgaWYocm93RGF0YS5hY3Rpb25zLmluY2x1ZGVzKGhhc2goYWN0aW9uKSkpIHtcclxuICAgICAgICAgIHJldHVybiBmYWxzZTtcclxuICAgICAgICB9XHJcbiAgICAgIH1cclxuICAgIH1cclxuICAgIHJldHVybiB0cnVlO1xyXG4gIH1cclxufVxyXG4iXX0=
|
|
@@ -6,7 +6,7 @@ export class SdSelectionVisiblePipe {
|
|
|
6
6
|
const { actions } = selection;
|
|
7
7
|
rowData.actions = rowData.actions || [];
|
|
8
8
|
if (!(actions === null || actions === void 0 ? void 0 : actions.length)) {
|
|
9
|
-
return
|
|
9
|
+
return rowData.selectable;
|
|
10
10
|
}
|
|
11
11
|
for (const action of actions) {
|
|
12
12
|
if ('children' in action) {
|
|
@@ -42,7 +42,8 @@ export class SdSelectionVisiblePipe {
|
|
|
42
42
|
}
|
|
43
43
|
}
|
|
44
44
|
}
|
|
45
|
-
|
|
45
|
+
rowData.selectable = !!rowData.actions.length;
|
|
46
|
+
return rowData.selectable;
|
|
46
47
|
};
|
|
47
48
|
}
|
|
48
49
|
}
|
|
@@ -51,4 +52,4 @@ SdSelectionVisiblePipe.decorators = [
|
|
|
51
52
|
name: 'selectionVisible'
|
|
52
53
|
},] }
|
|
53
54
|
];
|
|
54
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
55
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2VsZWN0aW9uLXZpc2libGUucGlwZS5qcyIsInNvdXJjZVJvb3QiOiJDOi9Vc2Vycy9uZ2hpYXR0MTUvRGVza3RvcC9Xb3JraW5nLzFNRy9saWItY29yZS11aS9wcm9qZWN0cy9zZC1jb3JlL2dyaWQtbWF0ZXJpYWwvIiwic291cmNlcyI6WyJzcmMvbGliL3BpcGVzL3NlbGVjdGlvbi12aXNpYmxlLnBpcGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLElBQUksRUFBaUIsTUFBTSxlQUFlLENBQUM7QUFDcEQsT0FBTyxJQUFJLE1BQU0sYUFBYSxDQUFDO0FBTy9CLE1BQU0sT0FBTyxzQkFBc0I7SUFIbkM7UUFJRSxjQUFTLEdBQUcsQ0FBQyxPQUFlLEVBQUUsU0FBa0MsRUFBVyxFQUFFO1lBQzNFLE1BQU0sRUFBRSxPQUFPLEVBQUUsR0FBRyxTQUFTLENBQUM7WUFDOUIsT0FBTyxDQUFDLE9BQU8sR0FBRyxPQUFPLENBQUMsT0FBTyxJQUFJLEVBQUUsQ0FBQztZQUN4QyxJQUFJLEVBQUMsT0FBTyxhQUFQLE9BQU8sdUJBQVAsT0FBTyxDQUFFLE1BQU0sQ0FBQSxFQUFFO2dCQUNwQixPQUFPLE9BQU8sQ0FBQyxVQUFVLENBQUM7YUFDM0I7WUFDRCxLQUFLLE1BQU0sTUFBTSxJQUFJLE9BQU8sRUFBRTtnQkFDNUIsSUFBSSxVQUFVLElBQUksTUFBTSxFQUFFO29CQUN4QixJQUFJLElBQUksR0FBRyxLQUFLLENBQUM7b0JBQ2pCLEtBQUssTUFBTSxXQUFXLElBQUksTUFBTSxDQUFDLFFBQVEsRUFBRTt3QkFDekMsTUFBTSxFQUFFLE1BQU0sRUFBRSxHQUFHLFdBQVcsQ0FBQzt3QkFDL0IsTUFBTSxHQUFHLEdBQUcsSUFBSSxDQUFDLFdBQVcsQ0FBQyxDQUFDO3dCQUM5QixJQUFJLE9BQU8sQ0FBQyxNQUFNLENBQUMsS0FBSyxVQUFVLEVBQUU7NEJBQ2xDLElBQUksQ0FBQyxNQUFNLENBQUMsT0FBTyxDQUFDLEVBQUU7Z0NBQ3BCLE9BQU8sQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDO2dDQUMxQixJQUFJLEdBQUcsSUFBSSxDQUFDOzZCQUNiO3lCQUNGOzZCQUFNLElBQUksQ0FBQyxNQUFNLEVBQUU7NEJBQ2xCLE9BQU8sQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDOzRCQUMxQixJQUFJLEdBQUcsSUFBSSxDQUFDO3lCQUNiO3FCQUNGO29CQUNELElBQUcsSUFBSSxFQUFFO3dCQUNQLE9BQU8sQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxNQUFNLENBQUMsQ0FBQyxDQUFDO3FCQUNwQztpQkFDRjtxQkFBTTtvQkFDTCxNQUFNLEVBQUUsTUFBTSxFQUFFLEdBQUcsTUFBTSxDQUFDO29CQUMxQixNQUFNLEdBQUcsR0FBRyxJQUFJLENBQUMsTUFBTSxDQUFDLENBQUM7b0JBQ3pCLElBQUksT0FBTyxDQUFDLE1BQU0sQ0FBQyxLQUFLLFVBQVUsRUFBRTt3QkFDbEMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxPQUFPLENBQUMsRUFBRTs0QkFDcEIsT0FBTyxDQUFDLE9BQU8sQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUM7eUJBQzNCO3FCQUNGO3lCQUFNLElBQUksQ0FBQyxNQUFNLEVBQUU7d0JBQ2xCLE9BQU8sQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDO3FCQUMzQjtpQkFDRjthQUNGO1lBQ0QsT0FBTyxDQUFDLFVBQVUsR0FBRyxDQUFDLENBQUMsT0FBTyxDQUFDLE9BQU8sQ0FBQyxNQUFNLENBQUM7WUFDOUMsT0FBTyxPQUFPLENBQUMsVUFBVSxDQUFDO1FBQzVCLENBQUMsQ0FBQTtJQUNILENBQUM7OztZQTVDQSxJQUFJLFNBQUM7Z0JBQ0osSUFBSSxFQUFFLGtCQUFrQjthQUN6QiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IFBpcGUsIFBpcGVUcmFuc2Zvcm0gfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IGhhc2ggZnJvbSAnb2JqZWN0LWhhc2gnO1xyXG5pbXBvcnQgeyBTZEdyaWRNYXRlcmlhbFNlbGVjdGlvbiB9IGZyb20gJy4uL21vZGVscy9ncmlkLXNlbGVjdGlvbi5tb2RlbCc7XHJcbmltcG9ydCB7IFNkSXRlbSB9IGZyb20gJy4uL21vZGVscy9ncmlkLm1vZGVsJztcclxuXHJcbkBQaXBlKHtcclxuICBuYW1lOiAnc2VsZWN0aW9uVmlzaWJsZSdcclxufSlcclxuZXhwb3J0IGNsYXNzIFNkU2VsZWN0aW9uVmlzaWJsZVBpcGUgaW1wbGVtZW50cyBQaXBlVHJhbnNmb3JtIHtcclxuICB0cmFuc2Zvcm0gPSAocm93RGF0YTogU2RJdGVtLCBzZWxlY3Rpb246IFNkR3JpZE1hdGVyaWFsU2VsZWN0aW9uKTogYm9vbGVhbiA9PiB7XHJcbiAgICBjb25zdCB7IGFjdGlvbnMgfSA9IHNlbGVjdGlvbjtcclxuICAgIHJvd0RhdGEuYWN0aW9ucyA9IHJvd0RhdGEuYWN0aW9ucyB8fCBbXTtcclxuICAgIGlmICghYWN0aW9ucz8ubGVuZ3RoKSB7XHJcbiAgICAgIHJldHVybiByb3dEYXRhLnNlbGVjdGFibGU7XHJcbiAgICB9XHJcbiAgICBmb3IgKGNvbnN0IGFjdGlvbiBvZiBhY3Rpb25zKSB7XHJcbiAgICAgIGlmICgnY2hpbGRyZW4nIGluIGFjdGlvbikge1xyXG4gICAgICAgIGxldCBmbGFnID0gZmFsc2U7XHJcbiAgICAgICAgZm9yIChjb25zdCBjaGlsZEFjdGlvbiBvZiBhY3Rpb24uY2hpbGRyZW4pIHtcclxuICAgICAgICAgIGNvbnN0IHsgaGlkZGVuIH0gPSBjaGlsZEFjdGlvbjtcclxuICAgICAgICAgIGNvbnN0IGtleSA9IGhhc2goY2hpbGRBY3Rpb24pO1xyXG4gICAgICAgICAgaWYgKHR5cGVvZiAoaGlkZGVuKSA9PT0gJ2Z1bmN0aW9uJykge1xyXG4gICAgICAgICAgICBpZiAoIWhpZGRlbihyb3dEYXRhKSkge1xyXG4gICAgICAgICAgICAgIHJvd0RhdGEuYWN0aW9ucy5wdXNoKGtleSk7XHJcbiAgICAgICAgICAgICAgZmxhZyA9IHRydWU7XHJcbiAgICAgICAgICAgIH1cclxuICAgICAgICAgIH0gZWxzZSBpZiAoIWhpZGRlbikge1xyXG4gICAgICAgICAgICByb3dEYXRhLmFjdGlvbnMucHVzaChrZXkpO1xyXG4gICAgICAgICAgICBmbGFnID0gdHJ1ZTtcclxuICAgICAgICAgIH1cclxuICAgICAgICB9XHJcbiAgICAgICAgaWYoZmxhZykge1xyXG4gICAgICAgICAgcm93RGF0YS5hY3Rpb25zLnB1c2goaGFzaChhY3Rpb24pKTtcclxuICAgICAgICB9XHJcbiAgICAgIH0gZWxzZSB7XHJcbiAgICAgICAgY29uc3QgeyBoaWRkZW4gfSA9IGFjdGlvbjtcclxuICAgICAgICBjb25zdCBrZXkgPSBoYXNoKGFjdGlvbik7XHJcbiAgICAgICAgaWYgKHR5cGVvZiAoaGlkZGVuKSA9PT0gJ2Z1bmN0aW9uJykge1xyXG4gICAgICAgICAgaWYgKCFoaWRkZW4ocm93RGF0YSkpIHtcclxuICAgICAgICAgICAgcm93RGF0YS5hY3Rpb25zLnB1c2goa2V5KTtcclxuICAgICAgICAgIH1cclxuICAgICAgICB9IGVsc2UgaWYgKCFoaWRkZW4pIHtcclxuICAgICAgICAgIHJvd0RhdGEuYWN0aW9ucy5wdXNoKGtleSk7XHJcbiAgICAgICAgfVxyXG4gICAgICB9XHJcbiAgICB9XHJcbiAgICByb3dEYXRhLnNlbGVjdGFibGUgPSAhIXJvd0RhdGEuYWN0aW9ucy5sZW5ndGg7XHJcbiAgICByZXR1cm4gcm93RGF0YS5zZWxlY3RhYmxlO1xyXG4gIH1cclxufVxyXG4iXX0=
|
|
@@ -1671,10 +1671,20 @@ class SdGridMaterial {
|
|
|
1671
1671
|
};
|
|
1672
1672
|
this.onSelectAll = () => {
|
|
1673
1673
|
var _a, _b, _c;
|
|
1674
|
-
(_a = this.items) === null || _a === void 0 ? void 0 : _a.forEach(e =>
|
|
1674
|
+
(_a = this.items) === null || _a === void 0 ? void 0 : _a.forEach(e => {
|
|
1675
|
+
if (e.selectable) {
|
|
1676
|
+
e.isSelected = this.isSelectAll;
|
|
1677
|
+
}
|
|
1678
|
+
});
|
|
1675
1679
|
(_c = (_b = this.gridOption.selection) === null || _b === void 0 ? void 0 : _b.onSelectAll) === null || _c === void 0 ? void 0 : _c.call(_b, this.items.filter(e => e.isSelected));
|
|
1676
1680
|
__classPrivateFieldGet(this, _updateSelectedItems).call(this);
|
|
1677
1681
|
};
|
|
1682
|
+
this.onClearSelection = () => {
|
|
1683
|
+
var _a;
|
|
1684
|
+
this.isSelectAll = false;
|
|
1685
|
+
(_a = this.items) === null || _a === void 0 ? void 0 : _a.forEach(e => e.isSelected = false);
|
|
1686
|
+
__classPrivateFieldGet(this, _updateSelectedItems).call(this);
|
|
1687
|
+
};
|
|
1678
1688
|
_updateSelectedItems.set(this, () => {
|
|
1679
1689
|
this.selectedItems = this.items.filter(item => item.isSelected)
|
|
1680
1690
|
.map(item => {
|
|
@@ -1911,7 +1921,7 @@ _paginator = new WeakMap(), _sort = new WeakMap(), _subscription$1 = new WeakMap
|
|
|
1911
1921
|
SdGridMaterial.decorators = [
|
|
1912
1922
|
{ type: Component, args: [{
|
|
1913
1923
|
selector: 'sd-grid-material',
|
|
1914
|
-
template: "<ng-container *ngIf=\"gridConfigurationObserver | async as gridConfiguration\">\r\n <ng-container *ngIf=\"\r\n gridConfiguration\r\n | sdGridConfigurationResult\r\n : gridOption\r\n : sdSubInformation as configuration\r\n \">\r\n <ng-container *ngIf=\"!gridOption.filter?.disabled\">\r\n <sd-grid-filter [filter]=\"gridOption?.filter\" [columns]=\"configuration.firstColumns\" [filterDefs]=\"filterDefs\">\r\n </sd-grid-filter>\r\n </ng-container>\r\n <div class=\"c-container {{ gridOption?.style?.grid }}\" [ngClass]=\"{ 'mat-elevation-z2': gridOption?.shadow }\">\r\n <div class=\"c-loading\" *ngIf=\"isLoading\">\r\n <mat-spinner *ngIf=\"isLoading\"></mat-spinner>\r\n </div>\r\n <ng-container>\r\n <div class=\"c-table\" [ngStyle]=\"{\r\n 'max-height': gridOption?.maxHeight,\r\n 'min-height': gridOption?.minHeight\r\n }\">\r\n <table *ngIf=\"items?.length; else elseEmpty\" mat-table [dataSource]=\"items\" matSort\r\n [matSortDisabled]=\"!gridOption.sortable\" cdkDropList cdkDropListOrientation=\"horizontal\"\r\n [cdkDropListDisabled]=\"!gridOption.dropDragColumnEnable\"\r\n (cdkDropListDropped)=\"drop($event, configuration.displayedColumns)\" multiTemplateDataRows>\r\n <ng-container matColumnDef=\"sdSubInformation\" sticky>\r\n <td class=\"p-0\" mat-cell *matCellDef=\"let item\" [attr.colspan]=\"configuration.displayedColumns.length\">\r\n <div *ngIf=\"sdSubInformation?.templateRef\" [@detailExpand]=\"item.isExpanded ? 'expanded' : 'collapsed'\">\r\n <ng-container *ngIf=\"item.isExpanded\">\r\n <ng-container *ngTemplateOutlet=\"\r\n sdSubInformation.templateRef;\r\n context: { item: item }\r\n \">\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n </td>\r\n <td mat-footer-cell *matFooterCellDef></td>\r\n </ng-container>\r\n <ng-container matColumnDef=\"sdSubInformationAction\" stickyEnd>\r\n <th class=\"p-0\" mat-header-cell *matHeaderCellDef style=\"width: 1px\"\r\n [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\"></th>\r\n <td mat-cell *matCellDef=\"let element\">\r\n <button *ngIf=\"!element.isExpanding\" mat-icon-button aria-label=\"Expand & Collapse\"\r\n (click)=\"onExpand(element)\">\r\n <mat-icon *ngIf=\"!element.isExpanded\">expand_more</mat-icon>\r\n <mat-icon *ngIf=\"element.isExpanded\">expand_less</mat-icon>\r\n </button>\r\n <div *ngIf=\"element.isExpanding\" class=\"lds-ring\">\r\n <div></div>\r\n <div></div>\r\n <div></div>\r\n <div></div>\r\n </div>\r\n </td>\r\n </ng-container>\r\n <ng-container matColumnDef=\"sdSelection\" sticky>\r\n <th class=\"text-center px-15\" mat-header-cell *matHeaderCellDef style=\"min-width: 50px; max-width: 50px\"\r\n [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\">\r\n <ng-container *ngIf=\"items | selectionVisibleSelectAll: gridOption?.selection | async\">\r\n <mat-checkbox *ngIf=\"!gridOption.selection?.single\" class=\"c-selection\" color=\"primary\"\r\n [(ngModel)]=\"isSelectAll\" (change)=\"onSelectAll()\">\r\n </mat-checkbox>\r\n </ng-container>\r\n\r\n </th>\r\n <td class=\"text-center px-15\" mat-cell *matCellDef=\"let item\" style=\"min-width: 50px; max-width: 50px\">\r\n <ng-container *ngIf=\"item | selectionVisible:gridOption?.selection\">\r\n <mat-checkbox class=\"c-selection\" color=\"primary\" [(ngModel)]=\"item.isSelected\"\r\n (change)=\"onSelect(item)\" [disabled]=\"\r\n selectedItems | selectionDisable: item:gridOption?.selection\r\n \">\r\n </mat-checkbox>\r\n </ng-container>\r\n\r\n </td>\r\n <td mat-footer-cell *matFooterCellDef></td>\r\n </ng-container>\r\n <ng-container matColumnDef=\"sdEditorValidation\">\r\n <th class=\"p-0\" mat-header-cell *matHeaderCellDef style=\"width: 2px\"\r\n [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\">\r\n </th>\r\n <td class=\"p-0 position-relative\" mat-cell *matCellDef=\"let item\">\r\n <sd-desktop-editor-validation [sdId]=\"item.sdId\" [item]=\"item\" [gridOption]=\"gridOption\">\r\n </sd-desktop-editor-validation>\r\n </td>\r\n <td mat-footer-cell *matFooterCellDef></td>\r\n </ng-container>\r\n <ng-container matColumnDef=\"sdEditor\">\r\n <th class=\"px-8 py-8\" mat-header-cell *matHeaderCellDef style=\"width: 50px\"\r\n [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\">\r\n <button\r\n *ngIf=\"gridOption.editor?.addable && (!gridOption.editor.limit || gridOption.editor.limit > items.length)\"\r\n (click)=\"onCreate()\" aria-hidden=\"true\" mat-icon-button>\r\n <mat-icon class=\"c-icon\">add</mat-icon>\r\n </button>\r\n </th>\r\n <td class=\"px-8\" mat-cell *matCellDef=\"let item\">\r\n <ng-container *sdLet=\"item.editorStatus | sdEditorHandlerRow:item:gridOption as editorHandler\">\r\n <div *ngIf=\"editorHandler\" class=\"d-flex align-items-center justify-content-center\">\r\n <button *ngIf=\"editorHandler.editable\" class=\"mx-2\" (click)=\"onUpdate(item)\" aria-hidden=\"true\"\r\n mat-icon-button>\r\n <mat-icon class=\"c-icon\">edit</mat-icon>\r\n </button>\r\n <button *ngIf=\"editorHandler.removable\" class=\"mx-2\" (click)=\"onRemove(item)\" aria-hidden=\"true\"\r\n mat-icon-button>\r\n <mat-icon class=\"c-icon\">delete</mat-icon>\r\n </button>\r\n <button *ngIf=\"editorHandler.savable\" class=\"mx-2\" (click)=\"onSave(item)\" aria-hidden=\"true\"\r\n mat-icon-button>\r\n <mat-icon class=\"c-icon\">save</mat-icon>\r\n </button>\r\n <button *ngIf=\"editorHandler.cancelable\" class=\"mx-2\" (click)=\"onCancel(item)\" aria-hidden=\"true\"\r\n mat-icon-button>\r\n <mat-icon class=\"c-icon\">close</mat-icon>\r\n </button>\r\n </div>\r\n </ng-container>\r\n </td>\r\n <td mat-footer-cell *matFooterCellDef></td>\r\n </ng-container>\r\n <ng-container matColumnDef=\"sdCommand\">\r\n <th class=\"px-8 py-8\" mat-header-cell *matHeaderCellDef style=\"width: 50px\"\r\n [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\"></th>\r\n <td class=\"px-8\" mat-cell *matCellDef=\"let item\">\r\n <sd-desktop-command [commands]=\"gridOption.commands\" [item]=\"item\"></sd-desktop-command>\r\n </td>\r\n <td mat-footer-cell *matFooterCellDef></td>\r\n </ng-container>\r\n <ng-container *ngFor=\"let column of configuration.firstColumns; let i = index\" [matColumnDef]=\"column.field\"\r\n [sticky]=\"configuration.fixedColumn[column.field]\">\r\n <th mat-header-cell *matHeaderCellDef cdkDrag class=\"px-8 py-8 c-th\"\r\n [ngStyle]=\"{ 'min-width': configuration.firstColumns[i].width }\" [attr.rowspan]=\"\r\n configuration.multipleHeader && column.type !== 'children-col'\r\n ? 2\r\n : 1\r\n \" [attr.colspan]=\"\r\n column.type === 'children-col' ? column.children?.length : 1\r\n \">\r\n <div>\r\n <div aria-hidden=\"false\" role=\"presentation\" mat-sort-header [disabled]=\"\r\n !column.sortable || column.type === 'children-col'\r\n \" [innerHTML]=\"configuration.firstColumns[i].titleHtml || configuration.firstColumns[i].title\">\r\n </div>\r\n <sd-column-inline-filter *ngIf=\"gridOption.filter?.inlineColumn\" [value]=\"columnFilter[column.field]\"\r\n [columnFilter]=\"columnFilter\" [column]=\"column\" (filterChange)=\"onFilterChange()\">\r\n </sd-column-inline-filter>\r\n </div>\r\n </th>\r\n <td class=\"c-td px-8\" mat-cell *matCellDef=\"let item\">\r\n <sd-desktop-cell [sdId]=\"item.sdId\" [key]=\"key\" [value]=\"item[column.field]\" [column]=\"column\"\r\n [item]=\"item\" [idx]=\"i\" [cellDef]=\"cellDef\" [gridOption]=\"gridOption\">\r\n </sd-desktop-cell>\r\n </td>\r\n <td mat-footer-cell *matFooterCellDef>\r\n <ng-container *ngIf=\"footerDef[column.field]\">\r\n <ng-container *ngTemplateOutlet=\"\r\n footerDef[column.field].templateRef;\r\n context: { items: items, column: column }\r\n \">\r\n </ng-container>\r\n </ng-container>\r\n </td>\r\n </ng-container>\r\n <ng-container *ngFor=\"let column of configuration.secondColumns; let i = index\"\r\n [matColumnDef]=\"column.field\">\r\n <th mat-header-cell *matHeaderCellDef mat-sort-header class=\"c-th px-8\"\r\n [ngStyle]=\"{ 'min-width': column.width }\">\r\n <div>\r\n <div [innerHTML]=\"column.titleHtml || column.title\"></div>\r\n <sd-column-inline-filter *ngIf=\"gridOption.filter?.inlineColumn\" [value]=\"columnFilter[column.field]\"\r\n [columnFilter]=\"columnFilter\" [column]=\"column\" (filterChange)=\"onFilterChange()\">\r\n </sd-column-inline-filter>\r\n </div>\r\n </th>\r\n <td class=\"c-td px-8\" mat-cell *matCellDef=\"let item\">\r\n <sd-desktop-cell [sdId]=\"item.sdId\" [key]=\"key\" [value]=\"item[column.field]\" [column]=\"column\"\r\n [item]=\"item\" [idx]=\"i\" [cellDef]=\"cellDef\" [gridOption]=\"gridOption\">\r\n </sd-desktop-cell>\r\n </td>\r\n <td mat-footer-cell *matFooterCellDef>\r\n <ng-container *ngIf=\"footerDef[column.field]\">\r\n <ng-container *ngTemplateOutlet=\"\r\n footerDef[column.field].templateRef;\r\n context: { items: items, column: column }\r\n \">\r\n </ng-container>\r\n </ng-container>\r\n </td>\r\n </ng-container>\r\n <tr class=\"c-first-header\" mat-header-row *matHeaderRowDef=\"configuration.firstHeaders; sticky: true\"></tr>\r\n <ng-container *ngIf=\"configuration.secondHeaders?.length\">\r\n <tr class=\"c-second-header\" mat-header-row *matHeaderRowDef=\"configuration.secondHeaders; sticky: true\">\r\n </tr>\r\n </ng-container>\r\n <tr mat-row *matRowDef=\"let row; columns: configuration.displayedColumns\" matRipple class=\"c-row\" [class.selected]=\"row.isSelected\"\r\n [style]=\"row | sdStyleRowCss:gridOption\"></tr>\r\n <tr mat-row *matRowDef=\"let row; columns: ['sdSubInformation']\" class=\"c-detail-row\"></tr>\r\n <ng-container *ngIf=\"hasFooter && configuration.displayedFooters?.length\">\r\n <tr mat-footer-row *matFooterRowDef=\"configuration.displayedFooters; sticky: true\"></tr>\r\n </ng-container>\r\n </table>\r\n <ng-template #elseEmpty>\r\n <table mat-table [dataSource]=\"[{}]\">\r\n <ng-container matColumnDef=\"sdSelection\" sticky>\r\n <th class=\"px-15\" mat-header-cell *matHeaderCellDef style=\"min-width: 50px; max-width: 50px\"\r\n [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\"></th>\r\n </ng-container>\r\n <ng-container matColumnDef=\"sdEditorValidation\">\r\n <th class=\"p-0\" mat-header-cell *matHeaderCellDef style=\"width: 4px\"\r\n [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\">\r\n </th>\r\n <td class=\"p-0\" mat-cell *matCellDef=\"let item\">\r\n </td>\r\n <td mat-footer-cell *matFooterCellDef></td>\r\n </ng-container>\r\n <ng-container matColumnDef=\"sdEditor\">\r\n <th class=\"px-8\" mat-header-cell *matHeaderCellDef style=\"min-width: 50px; max-width: 50px\"\r\n [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\">\r\n <button\r\n *ngIf=\"gridOption.editor?.addable && (!gridOption.editor.limit || gridOption.editor.limit > items.length)\"\r\n (click)=\"onCreate()\" aria-hidden=\"true\" mat-icon-button>\r\n <mat-icon class=\"c-icon\">add</mat-icon>\r\n </button>\r\n </th>\r\n </ng-container>\r\n <ng-container matColumnDef=\"sdCommand\">\r\n <th class=\"px-8\" mat-header-cell *matHeaderCellDef style=\"min-width: 50px; max-width: 50px\"\r\n [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\"></th>\r\n </ng-container>\r\n <ng-container matColumnDef=\"sdSubInformationAction\">\r\n <th class=\"p-0\" mat-header-cell *matHeaderCellDef style=\"width: 1px\"\r\n [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\"></th>\r\n </ng-container>\r\n <ng-container matColumnDef=\"sdEmpty\">\r\n <td class=\"c-empty\" mat-cell *matCellDef=\"let item\"\r\n [attr.colspan]=\"configuration.displayedColumns.length\">\r\n <ng-container *ngIf=\"sdEmptyData?.templateRef; else sdEmptyDataNoRef\">\r\n <ng-container *ngTemplateOutlet=\"\r\n sdEmptyData.templateRef;\r\n context: { item: item }\r\n \">\r\n </ng-container>\r\n </ng-container>\r\n <ng-template #sdEmptyDataNoRef>\r\n <mat-icon fontSet=\"material-icons-outlined\">leaderboard</mat-icon>\r\n </ng-template>\r\n </td>\r\n </ng-container>\r\n <ng-container *ngFor=\"let column of configuration.columns\" [matColumnDef]=\"column.field\"\r\n [sticky]=\"configuration.fixedColumn[column.field]\">\r\n <th mat-header-cell *matHeaderCellDef class=\"c-th px-8 py-8\" [ngStyle]=\"{ 'min-width': column.width }\">\r\n <div [innerHTML]=\"column.titleHtml || column.title\"></div>\r\n </th>\r\n </ng-container>\r\n <ng-container *ngFor=\"let column of configuration.firstColumns; let i = index\"\r\n [matColumnDef]=\"column.field\" [sticky]=\"configuration.fixedColumn[column.field]\">\r\n <th mat-header-cell *matHeaderCellDef class=\"c-th px-8 py-8\"\r\n [ngStyle]=\"{ 'min-width': configuration.firstColumns[i].width }\" [attr.rowspan]=\"\r\n configuration.multipleHeader &&\r\n column.type !== 'children-col'\r\n ? 2\r\n : 1\r\n \" [attr.colspan]=\"\r\n column.type === 'children-col' ? column.children?.length : 1\r\n \">\r\n <div>\r\n <div [innerHTML]=\"configuration.firstColumns[i].titleHtml || configuration.firstColumns[i].title\">\r\n </div>\r\n <sd-column-inline-filter *ngIf=\"gridOption.filter?.inlineColumn\"\r\n [value]=\"columnFilter[column.field]\" [columnFilter]=\"columnFilter\" [column]=\"column\"\r\n (filterChange)=\"onFilterChange()\"></sd-column-inline-filter>\r\n </div>\r\n </th>\r\n </ng-container>\r\n <ng-container *ngFor=\"let column of configuration.secondColumns\" [matColumnDef]=\"column.field\">\r\n <th mat-header-cell *matHeaderCellDef class=\"c-th px-8 py-8\" [ngStyle]=\"{ 'min-width': column.width }\">\r\n <div>\r\n <div [innerHTML]=\"column.titleHtml || column.title\"></div>\r\n <sd-column-inline-filter *ngIf=\"gridOption.filter?.inlineColumn\"\r\n [value]=\"columnFilter[column.field]\" [columnFilter]=\"columnFilter\" [column]=\"column\"\r\n (filterChange)=\"onFilterChange()\"></sd-column-inline-filter>\r\n </div>\r\n </th>\r\n </ng-container>\r\n <tr class=\"c-first-header\" mat-header-row *matHeaderRowDef=\"configuration.firstHeaders; sticky: true\">\r\n </tr>\r\n <tr class=\"c-second-header\" mat-header-row *matHeaderRowDef=\"configuration.secondHeaders; sticky: true\">\r\n </tr>\r\n <tr mat-row *matRowDef=\"let row; columns: ['sdEmpty']\"></tr>\r\n </table>\r\n </ng-template>\r\n </div>\r\n </ng-container>\r\n <div class=\"c-paginator\">\r\n <div class=\"c-action\">\r\n <sd-button *ngIf=\"\r\n !gridOption.filter?.disabled && !gridOption.filter?.inlineColumn\r\n \" class=\"mr-10\" [title]=\"'Filter' | sdTranslate\" icon=\"filter_alt\" size=\"sm\" (action)=\"gridFilter.open()\"\r\n type=\"link\">\r\n </sd-button>\r\n <sd-button *ngIf=\"gridOption.reload?.visible\" class=\"mr-10\" [title]=\"'Reload' | sdTranslate\" icon=\"refresh\"\r\n size=\"sm\" (action)=\"reload()\" [disabled]=\"!items?.length\" type=\"link\">\r\n </sd-button>\r\n <ng-container *ngIf=\"gridOption.export?.visible && items?.length\">\r\n <ng-container *ngIf=\"isExporting; else unExporting\">\r\n <sd-button class=\"mr-10\" [loading]=\"isExporting\" [title]=\"exportTitle | sdTranslate\" icon=\"get_app\"\r\n size=\"sm\" type=\"link\">\r\n </sd-button>\r\n </ng-container>\r\n <ng-template #unExporting>\r\n <sd-button class=\"mr-10\" [title]=\"exportTitle | sdTranslate\" icon=\"get_app\" size=\"sm\"\r\n [matMenuTriggerFor]=\"menu\" type=\"link\">\r\n </sd-button>\r\n </ng-template>\r\n\r\n <mat-menu #menu=\"matMenu\">\r\n <button *ngIf=\"gridOption.export?.visibleExcel !== false\" mat-menu-item\r\n (click)=\"sdPopupExport.exportDefault()\" type=\"button\">\r\n <mat-icon fontSet=\"material-icons-outlined\">file_download</mat-icon>\r\n <span> {{ \"Export excel\" | sdTranslate }}</span>\r\n </button>\r\n <button *ngIf=\"gridOption.export?.visibleCSV !== false\" mat-menu-item\r\n (click)=\"sdPopupExport.exportDefault(true)\" type=\"button\">\r\n <mat-icon fontSet=\"material-icons-outlined\">file_download</mat-icon>\r\n <span> {{ \"Export CSV\" | sdTranslate }}</span>\r\n </button>\r\n <button *ngIf=\"gridOption.export?.key\" mat-menu-item (click)=\"sdPopupExport.open()\" type=\"button\">\r\n <mat-icon fontSet=\"material-icons-outlined\">settings</mat-icon>\r\n <span> {{ \"Configure\" | sdTranslate }}</span>\r\n </button>\r\n </mat-menu>\r\n </ng-container>\r\n <sd-button *ngIf=\"gridOption.config?.visible\" class=\"mr-10\" [title]=\"'Configure' | sdTranslate\"\r\n icon=\"settings\" size=\"sm\" (action)=\"popupGridConfiguration.open()\" type=\"link\">\r\n </sd-button>\r\n </div>\r\n <mat-paginator [class.d-none]=\"gridOption.paginate?.hidden\" [length]=\"total\"\r\n [pageSize]=\"gridOption.paginate?.pageSize\" [pageSizeOptions]=\"gridOption.paginate?.pages\"\r\n [showFirstLastButtons]=\"gridOption.paginate?.showFirstLastButtons\"></mat-paginator>\r\n </div>\r\n </div>\r\n <sd-popup-export *ngIf=\"gridOption.export?.visible\" [gridOption]=\"gridOption\" (export)=\"onExport($event)\"\r\n #sdPopupExport>\r\n </sd-popup-export>\r\n <sd-popup-grid-configuration [gridOption]=\"gridOption\" [key]=\"key\" #popupGridConfiguration>\r\n </sd-popup-grid-configuration>\r\n </ng-container>\r\n</ng-container>\r\n<sd-grid-quick-action [gridOption]=\"gridOption\" [selectedItems]=\"selectedItems\"></sd-grid-quick-action>",
|
|
1924
|
+
template: "<ng-container *ngIf=\"gridConfigurationObserver | async as gridConfiguration\">\r\n <ng-container *ngIf=\"\r\n gridConfiguration\r\n | sdGridConfigurationResult\r\n : gridOption\r\n : sdSubInformation as configuration\r\n \">\r\n <ng-container *ngIf=\"!gridOption.filter?.disabled\">\r\n <sd-grid-filter [filter]=\"gridOption?.filter\" [columns]=\"configuration.firstColumns\" [filterDefs]=\"filterDefs\">\r\n </sd-grid-filter>\r\n </ng-container>\r\n <div class=\"c-container {{ gridOption?.style?.grid }}\" [ngClass]=\"{ 'mat-elevation-z2': gridOption?.shadow }\">\r\n <div class=\"c-loading\" *ngIf=\"isLoading\">\r\n <mat-spinner *ngIf=\"isLoading\"></mat-spinner>\r\n </div>\r\n <ng-container>\r\n <div class=\"c-table\" [ngStyle]=\"{\r\n 'max-height': gridOption?.maxHeight,\r\n 'min-height': gridOption?.minHeight\r\n }\">\r\n <table *ngIf=\"items?.length; else elseEmpty\" mat-table [dataSource]=\"items\" matSort\r\n [matSortDisabled]=\"!gridOption.sortable\" cdkDropList cdkDropListOrientation=\"horizontal\"\r\n [cdkDropListDisabled]=\"!gridOption.dropDragColumnEnable\"\r\n (cdkDropListDropped)=\"drop($event, configuration.displayedColumns)\" multiTemplateDataRows>\r\n <ng-container matColumnDef=\"sdSubInformation\" sticky>\r\n <td class=\"p-0\" mat-cell *matCellDef=\"let item\" [attr.colspan]=\"configuration.displayedColumns.length\">\r\n <div *ngIf=\"sdSubInformation?.templateRef\" [@detailExpand]=\"item.isExpanded ? 'expanded' : 'collapsed'\">\r\n <ng-container *ngIf=\"item.isExpanded\">\r\n <ng-container *ngTemplateOutlet=\"\r\n sdSubInformation.templateRef;\r\n context: { item: item }\r\n \">\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n </td>\r\n <td mat-footer-cell *matFooterCellDef></td>\r\n </ng-container>\r\n <ng-container matColumnDef=\"sdSubInformationAction\" stickyEnd>\r\n <th class=\"p-0\" mat-header-cell *matHeaderCellDef style=\"width: 1px\"\r\n [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\"></th>\r\n <td mat-cell *matCellDef=\"let element\">\r\n <button *ngIf=\"!element.isExpanding\" mat-icon-button aria-label=\"Expand & Collapse\"\r\n (click)=\"onExpand(element)\">\r\n <mat-icon *ngIf=\"!element.isExpanded\">expand_more</mat-icon>\r\n <mat-icon *ngIf=\"element.isExpanded\">expand_less</mat-icon>\r\n </button>\r\n <div *ngIf=\"element.isExpanding\" class=\"lds-ring\">\r\n <div></div>\r\n <div></div>\r\n <div></div>\r\n <div></div>\r\n </div>\r\n </td>\r\n </ng-container>\r\n <ng-container matColumnDef=\"sdSelection\" sticky>\r\n <th class=\"text-center px-15\" mat-header-cell *matHeaderCellDef style=\"min-width: 50px; max-width: 50px\"\r\n [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\">\r\n <ng-container *ngIf=\"items | selectionVisibleSelectAll: gridOption?.selection | async\">\r\n <mat-checkbox *ngIf=\"!gridOption.selection?.single\" class=\"c-selection\" color=\"primary\"\r\n [(ngModel)]=\"isSelectAll\" (change)=\"onSelectAll()\">\r\n </mat-checkbox>\r\n </ng-container>\r\n\r\n </th>\r\n <td class=\"text-center px-15\" mat-cell *matCellDef=\"let item\" style=\"min-width: 50px; max-width: 50px\">\r\n <ng-container *ngIf=\"item | selectionVisible:gridOption?.selection\">\r\n <mat-checkbox class=\"c-selection\" color=\"primary\" [(ngModel)]=\"item.isSelected\"\r\n (change)=\"onSelect(item)\" [disabled]=\"\r\n selectedItems | selectionDisable: item:gridOption?.selection\r\n \">\r\n </mat-checkbox>\r\n </ng-container>\r\n\r\n </td>\r\n <td mat-footer-cell *matFooterCellDef></td>\r\n </ng-container>\r\n <ng-container matColumnDef=\"sdEditorValidation\">\r\n <th class=\"p-0\" mat-header-cell *matHeaderCellDef style=\"width: 2px\"\r\n [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\">\r\n </th>\r\n <td class=\"p-0 position-relative\" mat-cell *matCellDef=\"let item\">\r\n <sd-desktop-editor-validation [sdId]=\"item.sdId\" [item]=\"item\" [gridOption]=\"gridOption\">\r\n </sd-desktop-editor-validation>\r\n </td>\r\n <td mat-footer-cell *matFooterCellDef></td>\r\n </ng-container>\r\n <ng-container matColumnDef=\"sdEditor\">\r\n <th class=\"px-8 py-8\" mat-header-cell *matHeaderCellDef style=\"width: 50px\"\r\n [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\">\r\n <button\r\n *ngIf=\"gridOption.editor?.addable && (!gridOption.editor.limit || gridOption.editor.limit > items.length)\"\r\n (click)=\"onCreate()\" aria-hidden=\"true\" mat-icon-button>\r\n <mat-icon class=\"c-icon\">add</mat-icon>\r\n </button>\r\n </th>\r\n <td class=\"px-8\" mat-cell *matCellDef=\"let item\">\r\n <ng-container *sdLet=\"item.editorStatus | sdEditorHandlerRow:item:gridOption as editorHandler\">\r\n <div *ngIf=\"editorHandler\" class=\"d-flex align-items-center justify-content-center\">\r\n <button *ngIf=\"editorHandler.editable\" class=\"mx-2\" (click)=\"onUpdate(item)\" aria-hidden=\"true\"\r\n mat-icon-button>\r\n <mat-icon class=\"c-icon\">edit</mat-icon>\r\n </button>\r\n <button *ngIf=\"editorHandler.removable\" class=\"mx-2\" (click)=\"onRemove(item)\" aria-hidden=\"true\"\r\n mat-icon-button>\r\n <mat-icon class=\"c-icon\">delete</mat-icon>\r\n </button>\r\n <button *ngIf=\"editorHandler.savable\" class=\"mx-2\" (click)=\"onSave(item)\" aria-hidden=\"true\"\r\n mat-icon-button>\r\n <mat-icon class=\"c-icon\">save</mat-icon>\r\n </button>\r\n <button *ngIf=\"editorHandler.cancelable\" class=\"mx-2\" (click)=\"onCancel(item)\" aria-hidden=\"true\"\r\n mat-icon-button>\r\n <mat-icon class=\"c-icon\">close</mat-icon>\r\n </button>\r\n </div>\r\n </ng-container>\r\n </td>\r\n <td mat-footer-cell *matFooterCellDef></td>\r\n </ng-container>\r\n <ng-container matColumnDef=\"sdCommand\">\r\n <th class=\"px-8 py-8\" mat-header-cell *matHeaderCellDef style=\"width: 50px\"\r\n [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\"></th>\r\n <td class=\"px-8\" mat-cell *matCellDef=\"let item\">\r\n <sd-desktop-command [commands]=\"gridOption.commands\" [item]=\"item\"></sd-desktop-command>\r\n </td>\r\n <td mat-footer-cell *matFooterCellDef></td>\r\n </ng-container>\r\n <ng-container *ngFor=\"let column of configuration.firstColumns; let i = index\" [matColumnDef]=\"column.field\"\r\n [sticky]=\"configuration.fixedColumn[column.field]\">\r\n <th mat-header-cell *matHeaderCellDef cdkDrag class=\"px-8 py-8 c-th\"\r\n [ngStyle]=\"{ 'min-width': configuration.firstColumns[i].width }\" [attr.rowspan]=\"\r\n configuration.multipleHeader && column.type !== 'children-col'\r\n ? 2\r\n : 1\r\n \" [attr.colspan]=\"\r\n column.type === 'children-col' ? column.children?.length : 1\r\n \">\r\n <div>\r\n <div aria-hidden=\"false\" role=\"presentation\" mat-sort-header [disabled]=\"\r\n !column.sortable || column.type === 'children-col'\r\n \" [innerHTML]=\"configuration.firstColumns[i].titleHtml || configuration.firstColumns[i].title\">\r\n </div>\r\n <sd-column-inline-filter *ngIf=\"gridOption.filter?.inlineColumn\" [value]=\"columnFilter[column.field]\"\r\n [columnFilter]=\"columnFilter\" [column]=\"column\" (filterChange)=\"onFilterChange()\">\r\n </sd-column-inline-filter>\r\n </div>\r\n </th>\r\n <td class=\"c-td px-8\" mat-cell *matCellDef=\"let item\">\r\n <sd-desktop-cell [sdId]=\"item.sdId\" [key]=\"key\" [value]=\"item[column.field]\" [column]=\"column\"\r\n [item]=\"item\" [idx]=\"i\" [cellDef]=\"cellDef\" [gridOption]=\"gridOption\">\r\n </sd-desktop-cell>\r\n </td>\r\n <td mat-footer-cell *matFooterCellDef>\r\n <ng-container *ngIf=\"footerDef[column.field]\">\r\n <ng-container *ngTemplateOutlet=\"\r\n footerDef[column.field].templateRef;\r\n context: { items: items, column: column }\r\n \">\r\n </ng-container>\r\n </ng-container>\r\n </td>\r\n </ng-container>\r\n <ng-container *ngFor=\"let column of configuration.secondColumns; let i = index\"\r\n [matColumnDef]=\"column.field\">\r\n <th mat-header-cell *matHeaderCellDef mat-sort-header class=\"c-th px-8\"\r\n [ngStyle]=\"{ 'min-width': column.width }\">\r\n <div>\r\n <div [innerHTML]=\"column.titleHtml || column.title\"></div>\r\n <sd-column-inline-filter *ngIf=\"gridOption.filter?.inlineColumn\" [value]=\"columnFilter[column.field]\"\r\n [columnFilter]=\"columnFilter\" [column]=\"column\" (filterChange)=\"onFilterChange()\">\r\n </sd-column-inline-filter>\r\n </div>\r\n </th>\r\n <td class=\"c-td px-8\" mat-cell *matCellDef=\"let item\">\r\n <sd-desktop-cell [sdId]=\"item.sdId\" [key]=\"key\" [value]=\"item[column.field]\" [column]=\"column\"\r\n [item]=\"item\" [idx]=\"i\" [cellDef]=\"cellDef\" [gridOption]=\"gridOption\">\r\n </sd-desktop-cell>\r\n </td>\r\n <td mat-footer-cell *matFooterCellDef>\r\n <ng-container *ngIf=\"footerDef[column.field]\">\r\n <ng-container *ngTemplateOutlet=\"\r\n footerDef[column.field].templateRef;\r\n context: { items: items, column: column }\r\n \">\r\n </ng-container>\r\n </ng-container>\r\n </td>\r\n </ng-container>\r\n <tr class=\"c-first-header\" mat-header-row *matHeaderRowDef=\"configuration.firstHeaders; sticky: true\"></tr>\r\n <ng-container *ngIf=\"configuration.secondHeaders?.length\">\r\n <tr class=\"c-second-header\" mat-header-row *matHeaderRowDef=\"configuration.secondHeaders; sticky: true\">\r\n </tr>\r\n </ng-container>\r\n <tr mat-row *matRowDef=\"let row; columns: configuration.displayedColumns\" matRipple class=\"c-row\" [class.selected]=\"row.isSelected\"\r\n [style]=\"row | sdStyleRowCss:gridOption\"></tr>\r\n <tr mat-row *matRowDef=\"let row; columns: ['sdSubInformation']\" class=\"c-detail-row\"></tr>\r\n <ng-container *ngIf=\"hasFooter && configuration.displayedFooters?.length\">\r\n <tr mat-footer-row *matFooterRowDef=\"configuration.displayedFooters; sticky: true\"></tr>\r\n </ng-container>\r\n </table>\r\n <ng-template #elseEmpty>\r\n <table mat-table [dataSource]=\"[{}]\">\r\n <ng-container matColumnDef=\"sdSelection\" sticky>\r\n <th class=\"px-15\" mat-header-cell *matHeaderCellDef style=\"min-width: 50px; max-width: 50px\"\r\n [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\"></th>\r\n </ng-container>\r\n <ng-container matColumnDef=\"sdEditorValidation\">\r\n <th class=\"p-0\" mat-header-cell *matHeaderCellDef style=\"width: 4px\"\r\n [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\">\r\n </th>\r\n <td class=\"p-0\" mat-cell *matCellDef=\"let item\">\r\n </td>\r\n <td mat-footer-cell *matFooterCellDef></td>\r\n </ng-container>\r\n <ng-container matColumnDef=\"sdEditor\">\r\n <th class=\"px-8\" mat-header-cell *matHeaderCellDef style=\"min-width: 50px; max-width: 50px\"\r\n [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\">\r\n <button\r\n *ngIf=\"gridOption.editor?.addable && (!gridOption.editor.limit || gridOption.editor.limit > items.length)\"\r\n (click)=\"onCreate()\" aria-hidden=\"true\" mat-icon-button>\r\n <mat-icon class=\"c-icon\">add</mat-icon>\r\n </button>\r\n </th>\r\n </ng-container>\r\n <ng-container matColumnDef=\"sdCommand\">\r\n <th class=\"px-8\" mat-header-cell *matHeaderCellDef style=\"min-width: 50px; max-width: 50px\"\r\n [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\"></th>\r\n </ng-container>\r\n <ng-container matColumnDef=\"sdSubInformationAction\">\r\n <th class=\"p-0\" mat-header-cell *matHeaderCellDef style=\"width: 1px\"\r\n [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\"></th>\r\n </ng-container>\r\n <ng-container matColumnDef=\"sdEmpty\">\r\n <td class=\"c-empty\" mat-cell *matCellDef=\"let item\"\r\n [attr.colspan]=\"configuration.displayedColumns.length\">\r\n <ng-container *ngIf=\"sdEmptyData?.templateRef; else sdEmptyDataNoRef\">\r\n <ng-container *ngTemplateOutlet=\"\r\n sdEmptyData.templateRef;\r\n context: { item: item }\r\n \">\r\n </ng-container>\r\n </ng-container>\r\n <ng-template #sdEmptyDataNoRef>\r\n <mat-icon fontSet=\"material-icons-outlined\">leaderboard</mat-icon>\r\n </ng-template>\r\n </td>\r\n </ng-container>\r\n <ng-container *ngFor=\"let column of configuration.columns\" [matColumnDef]=\"column.field\"\r\n [sticky]=\"configuration.fixedColumn[column.field]\">\r\n <th mat-header-cell *matHeaderCellDef class=\"c-th px-8 py-8\" [ngStyle]=\"{ 'min-width': column.width }\">\r\n <div [innerHTML]=\"column.titleHtml || column.title\"></div>\r\n </th>\r\n </ng-container>\r\n <ng-container *ngFor=\"let column of configuration.firstColumns; let i = index\"\r\n [matColumnDef]=\"column.field\" [sticky]=\"configuration.fixedColumn[column.field]\">\r\n <th mat-header-cell *matHeaderCellDef class=\"c-th px-8 py-8\"\r\n [ngStyle]=\"{ 'min-width': configuration.firstColumns[i].width }\" [attr.rowspan]=\"\r\n configuration.multipleHeader &&\r\n column.type !== 'children-col'\r\n ? 2\r\n : 1\r\n \" [attr.colspan]=\"\r\n column.type === 'children-col' ? column.children?.length : 1\r\n \">\r\n <div>\r\n <div [innerHTML]=\"configuration.firstColumns[i].titleHtml || configuration.firstColumns[i].title\">\r\n </div>\r\n <sd-column-inline-filter *ngIf=\"gridOption.filter?.inlineColumn\"\r\n [value]=\"columnFilter[column.field]\" [columnFilter]=\"columnFilter\" [column]=\"column\"\r\n (filterChange)=\"onFilterChange()\"></sd-column-inline-filter>\r\n </div>\r\n </th>\r\n </ng-container>\r\n <ng-container *ngFor=\"let column of configuration.secondColumns\" [matColumnDef]=\"column.field\">\r\n <th mat-header-cell *matHeaderCellDef class=\"c-th px-8 py-8\" [ngStyle]=\"{ 'min-width': column.width }\">\r\n <div>\r\n <div [innerHTML]=\"column.titleHtml || column.title\"></div>\r\n <sd-column-inline-filter *ngIf=\"gridOption.filter?.inlineColumn\"\r\n [value]=\"columnFilter[column.field]\" [columnFilter]=\"columnFilter\" [column]=\"column\"\r\n (filterChange)=\"onFilterChange()\"></sd-column-inline-filter>\r\n </div>\r\n </th>\r\n </ng-container>\r\n <tr class=\"c-first-header\" mat-header-row *matHeaderRowDef=\"configuration.firstHeaders; sticky: true\">\r\n </tr>\r\n <tr class=\"c-second-header\" mat-header-row *matHeaderRowDef=\"configuration.secondHeaders; sticky: true\">\r\n </tr>\r\n <tr mat-row *matRowDef=\"let row; columns: ['sdEmpty']\"></tr>\r\n </table>\r\n </ng-template>\r\n </div>\r\n </ng-container>\r\n <div class=\"c-paginator\">\r\n <div class=\"c-action\">\r\n <sd-button *ngIf=\"\r\n !gridOption.filter?.disabled && !gridOption.filter?.inlineColumn\r\n \" class=\"mr-10\" [title]=\"'Filter' | sdTranslate\" icon=\"filter_alt\" size=\"sm\" (action)=\"gridFilter.open()\"\r\n type=\"link\">\r\n </sd-button>\r\n <sd-button *ngIf=\"gridOption.reload?.visible\" class=\"mr-10\" [title]=\"'Reload' | sdTranslate\" icon=\"refresh\"\r\n size=\"sm\" (action)=\"reload()\" [disabled]=\"!items?.length\" type=\"link\">\r\n </sd-button>\r\n <ng-container *ngIf=\"gridOption.export?.visible && items?.length\">\r\n <ng-container *ngIf=\"isExporting; else unExporting\">\r\n <sd-button class=\"mr-10\" [loading]=\"isExporting\" [title]=\"exportTitle | sdTranslate\" icon=\"get_app\"\r\n size=\"sm\" type=\"link\">\r\n </sd-button>\r\n </ng-container>\r\n <ng-template #unExporting>\r\n <sd-button class=\"mr-10\" [title]=\"exportTitle | sdTranslate\" icon=\"get_app\" size=\"sm\"\r\n [matMenuTriggerFor]=\"menu\" type=\"link\">\r\n </sd-button>\r\n </ng-template>\r\n\r\n <mat-menu #menu=\"matMenu\">\r\n <button *ngIf=\"gridOption.export?.visibleExcel !== false\" mat-menu-item\r\n (click)=\"sdPopupExport.exportDefault()\" type=\"button\">\r\n <mat-icon fontSet=\"material-icons-outlined\">file_download</mat-icon>\r\n <span> {{ \"Export excel\" | sdTranslate }}</span>\r\n </button>\r\n <button *ngIf=\"gridOption.export?.visibleCSV !== false\" mat-menu-item\r\n (click)=\"sdPopupExport.exportDefault(true)\" type=\"button\">\r\n <mat-icon fontSet=\"material-icons-outlined\">file_download</mat-icon>\r\n <span> {{ \"Export CSV\" | sdTranslate }}</span>\r\n </button>\r\n <button *ngIf=\"gridOption.export?.key\" mat-menu-item (click)=\"sdPopupExport.open()\" type=\"button\">\r\n <mat-icon fontSet=\"material-icons-outlined\">settings</mat-icon>\r\n <span> {{ \"Configure\" | sdTranslate }}</span>\r\n </button>\r\n </mat-menu>\r\n </ng-container>\r\n <sd-button *ngIf=\"gridOption.config?.visible\" class=\"mr-10\" [title]=\"'Configure' | sdTranslate\"\r\n icon=\"settings\" size=\"sm\" (action)=\"popupGridConfiguration.open()\" type=\"link\">\r\n </sd-button>\r\n </div>\r\n <mat-paginator [class.d-none]=\"gridOption.paginate?.hidden\" [length]=\"total\"\r\n [pageSize]=\"gridOption.paginate?.pageSize\" [pageSizeOptions]=\"gridOption.paginate?.pages\"\r\n [showFirstLastButtons]=\"gridOption.paginate?.showFirstLastButtons\"></mat-paginator>\r\n </div>\r\n </div>\r\n <sd-popup-export *ngIf=\"gridOption.export?.visible\" [gridOption]=\"gridOption\" (export)=\"onExport($event)\"\r\n #sdPopupExport>\r\n </sd-popup-export>\r\n <sd-popup-grid-configuration [gridOption]=\"gridOption\" [key]=\"key\" #popupGridConfiguration>\r\n </sd-popup-grid-configuration>\r\n </ng-container>\r\n</ng-container>\r\n<sd-grid-quick-action [gridOption]=\"gridOption\" [selectedItems]=\"selectedItems\" (clear)=\"onClearSelection()\"></sd-grid-quick-action>",
|
|
1915
1925
|
animations: [
|
|
1916
1926
|
trigger('detailExpand', [
|
|
1917
1927
|
state('collapsed', style({ height: '0', minHeight: '0', visibility: 'hidden' })),
|
|
@@ -2550,7 +2560,8 @@ class SdSelectionDisablePipe {
|
|
|
2550
2560
|
if (!disabled) {
|
|
2551
2561
|
return false;
|
|
2552
2562
|
}
|
|
2553
|
-
|
|
2563
|
+
rowData.selectable = !disabled(rowData, selectedItems);
|
|
2564
|
+
return !rowData.selectable;
|
|
2554
2565
|
}
|
|
2555
2566
|
// Lọc các action theo selectedItems hiện tại
|
|
2556
2567
|
const availableActions = actions.filter(action => {
|
|
@@ -3006,7 +3017,7 @@ class SdSelectionVisiblePipe {
|
|
|
3006
3017
|
const { actions } = selection;
|
|
3007
3018
|
rowData.actions = rowData.actions || [];
|
|
3008
3019
|
if (!(actions === null || actions === void 0 ? void 0 : actions.length)) {
|
|
3009
|
-
return
|
|
3020
|
+
return rowData.selectable;
|
|
3010
3021
|
}
|
|
3011
3022
|
for (const action of actions) {
|
|
3012
3023
|
if ('children' in action) {
|
|
@@ -3042,7 +3053,8 @@ class SdSelectionVisiblePipe {
|
|
|
3042
3053
|
}
|
|
3043
3054
|
}
|
|
3044
3055
|
}
|
|
3045
|
-
|
|
3056
|
+
rowData.selectable = !!rowData.actions.length;
|
|
3057
|
+
return rowData.selectable;
|
|
3046
3058
|
};
|
|
3047
3059
|
}
|
|
3048
3060
|
}
|
|
@@ -3069,14 +3081,16 @@ SdIdPipe.decorators = [
|
|
|
3069
3081
|
|
|
3070
3082
|
class SdGridQuickAction {
|
|
3071
3083
|
constructor() {
|
|
3084
|
+
this.clear = new EventEmitter();
|
|
3072
3085
|
this.onClear = () => {
|
|
3086
|
+
this.clear.emit();
|
|
3073
3087
|
};
|
|
3074
3088
|
}
|
|
3075
3089
|
}
|
|
3076
3090
|
SdGridQuickAction.decorators = [
|
|
3077
3091
|
{ type: Component, args: [{
|
|
3078
3092
|
selector: 'sd-grid-quick-action',
|
|
3079
|
-
template: "<sd-quick-action *ngIf=\"selectedItems | selectionActionFilter: gridOption?.selection?.actions as actions\"\r\n [isOpened]=\"actions?.length\">\r\n <div class=\"d-flex align-items-center\" sdMessage>\r\n <div class=\"c-bg-length\">\r\n <span class=\"c-length\">{{ selectedItems.length }}</span>\r\n </div>\r\n <div class=\"c-message\">{{ gridOption?.selection?.message || (\"selected items\" | sdTranslate) }}</div>\r\n </div>\r\n <div class=\"d-flex align-items-center mr-8\" sdAction>\r\n <ng-container *ngFor=\"let action of actions\">\r\n <sd-button *ngIf=\"action.click\" class=\"ml-5\" [tooltip]=\"action.tooltip\" [icon]=\"action.icon\"\r\n [color]=\"action.color || 'secondary'\" [type]=\"action.type || 'light'\" [fontSet]=\"action.fontSet\"\r\n [title]=\"action.title\" size=\"sm\" (action)=\"action.click(selectedItems)\"></sd-button>\r\n <ng-container *ngIf=\"action.children?.length\">\r\n <sd-button class=\"ml-5\" [tooltip]=\"action.tooltip\" [icon]=\"action.icon || 'more_vert'\"\r\n [color]=\"action.color || 'secondary'\" [type]=\"action.type || 'light'\" [fontSet]=\"action.fontSet\"\r\n [title]=\"action.title\" size=\"sm\" [matMenuTriggerFor]=\"menu\">\r\n </sd-button>\r\n <mat-menu #menu=\"matMenu\">\r\n <span>\r\n <button *ngFor=\"let childAction of action.children\" mat-menu-item (click)=\"childAction.click(selectedItems)\"\r\n [disabled]=\"childAction.disabled\">\r\n <mat-icon [fontSet]=\"childAction.fontSet\" class=\"c-icon\">{{ childAction.icon }}\r\n </mat-icon>\r\n <span> {{ childAction.title }}</span>\r\n </button>\r\n </span>\r\n </mat-menu>\r\n </ng-container>\r\n </ng-container>\r\n <sd-button class=\"ml-5\" icon=\"close\" color=\"secondary\" type=\"outline\" size=\"sm\"\r\n (action)=\"onClear()\"></sd-button>\r\n </div>\r\n</sd-quick-action>",
|
|
3093
|
+
template: "<sd-quick-action *ngIf=\"selectedItems | selectionActionFilter: gridOption?.selection?.actions as actions\"\r\n [isOpened]=\"actions?.length\">\r\n <div class=\"d-flex align-items-center\" sdMessage>\r\n <div class=\"c-bg-length\">\r\n <span class=\"c-length\">{{ selectedItems.length }}</span>\r\n </div>\r\n <div class=\"c-message\">{{ gridOption?.selection?.message || (\"selected items\" | sdTranslate) }}</div>\r\n </div>\r\n <div class=\"d-flex align-items-center mr-8\" sdAction>\r\n <ng-container *ngFor=\"let action of actions\">\r\n <sd-button *ngIf=\"action.click\" class=\"ml-5\" [tooltip]=\"action.tooltip\" [icon]=\"action.icon\"\r\n [color]=\"action.color || 'secondary'\" [type]=\"action.type || 'light'\" [fontSet]=\"action.fontSet\"\r\n [title]=\"action.title\" size=\"sm\" (action)=\"action.click(selectedItems)\"></sd-button>\r\n <ng-container *ngIf=\"action.children?.length\">\r\n <sd-button class=\"ml-5\" [tooltip]=\"action.tooltip\" [icon]=\"action.icon || 'more_vert'\"\r\n [color]=\"action.color || 'secondary'\" [type]=\"action.type || 'light'\" [fontSet]=\"action.fontSet\"\r\n [title]=\"action.title\" size=\"sm\" [matMenuTriggerFor]=\"menu\">\r\n </sd-button>\r\n <mat-menu #menu=\"matMenu\">\r\n <span>\r\n <button *ngFor=\"let childAction of action.children\" mat-menu-item (click)=\"childAction.click(selectedItems)\"\r\n [disabled]=\"childAction.disabled\">\r\n <mat-icon [fontSet]=\"childAction.fontSet\" class=\"c-icon\">{{ childAction.icon }}\r\n </mat-icon>\r\n <span> {{ childAction.title }}</span>\r\n </button>\r\n </span>\r\n </mat-menu>\r\n </ng-container>\r\n </ng-container>\r\n <sd-button class=\"ml-5\" icon=\"close\" color=\"secondary\" type=\"outline\" size=\"sm\"\r\n (action)=\"onClear()\" width=\"35px\"></sd-button>\r\n </div>\r\n</sd-quick-action>",
|
|
3080
3094
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
3081
3095
|
styles: [".c-bg-length{align-items:flex-start;background:#2962ff;border-radius:4px 0 0 4px;display:flex;flex-direction:column;height:48px;left:0;padding:12px 8px;position:static;top:0;width:48px}.c-bg-length .c-length{color:#fff;font-size:16px;font-weight:500;height:24px;left:8px;line-height:24px;text-align:center;top:12px;width:32px}.c-bg-length .c-length,.c-message{font-family:Roboto;font-style:normal;position:static}.c-message{color:#000;font-size:14px;font-weight:400;height:20px;left:0;line-height:20px;margin:0 0 0 16px;min-width:200px;top:6px}"]
|
|
3082
3096
|
},] }
|
|
@@ -3084,7 +3098,8 @@ SdGridQuickAction.decorators = [
|
|
|
3084
3098
|
SdGridQuickAction.ctorParameters = () => [];
|
|
3085
3099
|
SdGridQuickAction.propDecorators = {
|
|
3086
3100
|
gridOption: [{ type: Input }],
|
|
3087
|
-
selectedItems: [{ type: Input }]
|
|
3101
|
+
selectedItems: [{ type: Input }],
|
|
3102
|
+
clear: [{ type: Output }]
|
|
3088
3103
|
};
|
|
3089
3104
|
|
|
3090
3105
|
class MatPaginatorIntlCro extends MatPaginatorIntl {
|