material-dynamic-table
Version:
Dynamic table component for angular built on top of angular material table. It offers sorting, pagination, filtering per column and the ability to specify content types and components used for displaying them.
93 lines • 12.2 kB
JavaScript
import { Directive, EventEmitter, Input, Output, } from '@angular/core';
import { MatSort } from '@angular/material/sort';
import * as i0 from "@angular/core";
/** Container for MatSortables to manage the sort state and provide default sort parameters. */
export class MdtMultiSort extends MatSort {
constructor() {
super(...arguments);
this.start = 'asc';
this.mode = 'single';
/** Event emitted when the user changes either the active sort or sort direction. */
this.multiSortChange = new EventEmitter();
}
/**
* The array of active sort ids. Order defines sorting precedence.
*/
get sortedBy() {
return this._sortedBy;
}
set sortedBy(sortedBy) {
this._sortedBy = sortedBy;
let sort = sortedBy ? sortedBy[0] : undefined;
let sortedValue = sort ? { active: sort.id, direction: sort.direction } : undefined;
this.sortChange.emit(sortedValue);
this.multiSortChange.emit({ sortedBy: this._sortedBy });
}
isSortDirectionValid(direction) {
return Object.keys(direction).every((id) => this.isIndividualSortDirectionValid(direction[id]));
}
isIndividualSortDirectionValid(direction) {
return !direction || direction === 'asc' || direction === 'desc';
}
/** Sets the active sort id and determines the new sort direction. */
sort(sortable) {
if (!Array.isArray(this.sortedBy)) {
let direction = sortable.start ? sortable.start : this.start;
this._sortedBy = [{
id: sortable.id,
direction: direction
}];
}
else {
const sort = this._sortedBy.find(s => s.id === sortable.id);
if (sort) {
this.direction = sort.direction;
let nextDirection = this.getNextSortDirection(sortable);
if (nextDirection) {
sort.direction = nextDirection;
}
else {
let index = this._sortedBy.indexOf(sort);
this._sortedBy.splice(index, 1);
}
}
else {
let newSort = {
id: sortable.id,
direction: sortable.start ? sortable.start : this.start
};
if (this.mode === 'multi') {
this._sortedBy.push(newSort);
}
else {
this._sortedBy = [newSort];
}
}
}
this.multiSortChange.emit({ sortedBy: this._sortedBy });
super.sort(sortable);
}
ngOnInit() {
super.ngOnInit();
}
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MdtMultiSort, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: MdtMultiSort, selector: "[mdtMultiSort]", inputs: { disabled: ["matSortDisabled", "disabled"], sortedBy: ["mdtSortActive", "sortedBy"], mode: "mode" }, outputs: { multiSortChange: "matSortChange" }, exportAs: ["mdtMultiSort"], usesInheritance: true, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MdtMultiSort, decorators: [{
type: Directive,
args: [{
selector: '[mdtMultiSort]',
exportAs: 'mdtMultiSort',
inputs: ['disabled: matSortDisabled']
}]
}], propDecorators: { sortedBy: [{
type: Input,
args: ['mdtSortActive']
}], mode: [{
type: Input,
args: ['mode']
}], multiSortChange: [{
type: Output,
args: ['matSortChange']
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibXVsdGktc29ydC5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9tYXRlcmlhbC1keW5hbWljLXRhYmxlL3NyYy9saWIvbXVsdGktc29ydC9tdWx0aS1zb3J0LmRpcmVjdGl2ZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQ0wsU0FBUyxFQUNULFlBQVksRUFDWixLQUFLLEVBSUwsTUFBTSxHQUNQLE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sRUFBRSxPQUFPLEVBQThCLE1BQU0sd0JBQXdCLENBQUM7O0FBUTdFLCtGQUErRjtBQU0vRixNQUFNLE9BQU8sWUFBYSxTQUFRLE9BQU87SUFMekM7O1FBd0JFLFVBQUssR0FBbUIsS0FBSyxDQUFDO1FBRWYsU0FBSSxHQUF1QixRQUFRLENBQUM7UUFVbkQsb0ZBQW9GO1FBRTNFLG9CQUFlLEdBQTRCLElBQUksWUFBWSxFQUFhLENBQUM7S0F5Q25GO0lBeEVDOztPQUVHO0lBQ0gsSUFDSSxRQUFRO1FBQ1YsT0FBTyxJQUFJLENBQUMsU0FBUyxDQUFDO0lBQ3hCLENBQUM7SUFDRCxJQUFJLFFBQVEsQ0FBQyxRQUFxRDtRQUNoRSxJQUFJLENBQUMsU0FBUyxHQUFHLFFBQVEsQ0FBQztRQUMxQixJQUFJLElBQUksR0FBRyxRQUFRLENBQUMsQ0FBQyxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUMsU0FBUyxDQUFDO1FBQzlDLElBQUksV0FBVyxHQUFHLElBQUksQ0FBQyxDQUFDLENBQUMsRUFBRSxNQUFNLEVBQUUsSUFBSSxDQUFDLEVBQUUsRUFBRSxTQUFTLEVBQUUsSUFBSSxDQUFDLFNBQVMsRUFBRSxDQUFDLENBQUMsQ0FBQyxTQUFTLENBQUM7UUFDcEYsSUFBSSxDQUFDLFVBQVUsQ0FBQyxJQUFJLENBQUMsV0FBVyxDQUFDLENBQUM7UUFDbEMsSUFBSSxDQUFDLGVBQWUsQ0FBQyxJQUFJLENBQUMs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LDJCQUEyQixDQUFDO2lCQUN0Qzs4QkFPSyxRQUFRO3NCQURYLEtBQUs7dUJBQUMsZUFBZTtnQkFnQlAsSUFBSTtzQkFBbEIsS0FBSzt1QkFBQyxNQUFNO2dCQVlKLGVBQWU7c0JBRHZCLE1BQU07dUJBQUMsZUFBZSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XHJcbiAgRGlyZWN0aXZlLFxyXG4gIEV2ZW50RW1pdHRlcixcclxuICBJbnB1dCxcclxuICBPbkNoYW5nZXMsXHJcbiAgT25EZXN0cm95LFxyXG4gIE9uSW5pdCxcclxuICBPdXRwdXQsXHJcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IE1hdFNvcnQsIE1hdFNvcnRhYmxlLCBTb3J0RGlyZWN0aW9uIH0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvc29ydCc7XHJcbmltcG9ydCB7IE1kdE11bHRpU29ydEhlYWRlciB9IGZyb20gJy4vbXVsdGktc29ydC1oZWFkZXInO1xyXG5cclxuLyoqIFRoZSBjdXJyZW50IHNvcnQgc3RhdGUuICovXHJcbmV4cG9ydCBpbnRlcmZhY2UgTXVsdGlTb3J0IHtcclxuICBzb3J0ZWRCeTogeyBpZDogc3RyaW5nLCBkaXJlY3Rpb246ICdhc2MnIHwgJ2Rlc2MnIH1bXTtcclxufVxyXG5cclxuLyoqIENvbnRhaW5lciBmb3IgTWF0U29ydGFibGVzIHRvIG1hbmFnZSB0aGUgc29ydCBzdGF0ZSBhbmQgcHJvdmlkZSBkZWZhdWx0IHNvcnQgcGFyYW1ldGVycy4gKi9cclxuQERpcmVjdGl2ZSh7XHJcbiAgc2VsZWN0b3I6ICdbbWR0TXVsdGlTb3J0XScsXHJcbiAgZXhwb3J0QXM6ICdtZHRNdWx0aVNvcnQnLFxyXG4gIGlucHV0czogWydkaXNhYmxlZDogbWF0U29ydERpc2FibGVkJ11cclxufSlcclxuZXhwb3J0IGNsYXNzIE1kdE11bHRpU29ydCBleHRlbmRzIE1hdFNvcnQgaW1wbGVtZW50cyBPbkNoYW5nZXMsIE9uRGVzdHJveSwgT25Jbml0IHtcclxuXHJcbiAgLyoqXHJcbiAgICogVGhlIGFycmF5IG9mIGFjdGl2ZSBzb3J0IGlkcy4gT3JkZXIgZGVmaW5lcyBzb3J0aW5nIHByZWNlZGVuY2UuXHJcbiAgICovXHJcbiAgQElucHV0KCdtZHRTb3J0QWN0aXZlJylcclxuICBnZXQgc29ydGVkQnkoKSB7XHJcbiAgICByZXR1cm4gdGhpcy5fc29ydGVkQnk7XHJcbiAgfVxyXG4gIHNldCBzb3J0ZWRCeShzb3J0ZWRCeTogeyBpZDogc3RyaW5nLCBkaXJlY3Rpb246ICdhc2MnIHwgJ2Rlc2MnIH1bXSkge1xyXG4gICAgdGhpcy5fc29ydGVkQnkgPSBzb3J0ZWRCeTtcclxuICAgIGxldCBzb3J0ID0gc29ydGVkQnkgPyBzb3J0ZWRCeVswXSA6IHVuZGVmaW5lZDtcclxuICAgIGxldCBzb3J0ZWRWYWx1ZSA9IHNvcnQgPyB7IGFjdGl2ZTogc29ydC5pZCwgZGlyZWN0aW9uOiBzb3J0LmRpcmVjdGlvbiB9IDogdW5kZWZpbmVkO1xyXG4gICAgdGhpcy5zb3J0Q2hhbmdlLmVtaXQoc29ydGVkVmFsdWUpO1xyXG4gICAgdGhpcy5tdWx0aVNvcnRDaGFuZ2UuZW1pdCh7IHNvcnRlZEJ5OiB0aGlzLl9zb3J0ZWRCeSB9KTtcclxuICB9XHJcblxyXG4gIHByaXZhdGUgX3NvcnRlZEJ5OiB7IGlkOiBzdHJpbmcsIGRpcmVjdGlvbjogJ2FzYycgfCAnZGVzYycgfVtdXHJcblxyXG4gIHN0YXJ0OiAnYXNjJyB8ICdkZXNjJyA9ICdhc2MnO1xyXG5cclxuICBASW5wdXQoJ21vZGUnKSBtb2RlOiAnc2luZ2xlJyB8ICdtdWx0aScgPSAnc2luZ2xlJztcclxuXHJcbiAgaXNTb3J0RGlyZWN0aW9uVmFsaWQoZGlyZWN0aW9uOiB7IFtpZDogc3RyaW5nXTogU29ydERpcmVjdGlvbiB9KTogYm9vbGVhbiB7XHJcbiAgICByZXR1cm4gT2JqZWN0LmtleXMoZGlyZWN0aW9uKS5ldmVyeSgoaWQpID0+IHRoaXMuaXNJbmRpdmlkdWFsU29ydERpcmVjdGlvblZhbGlkKGRpcmVjdGlvbltpZF0pKTtcclxuICB9XHJcblxyXG4gIGlzSW5kaXZpZHVhbFNvcnREaXJlY3Rpb25WYWxpZChkaXJlY3Rpb246IHN0cmluZyk6IGJvb2xlYW4ge1xyXG4gICAgcmV0dXJuICFkaXJlY3Rpb24gfHwgZGlyZWN0aW9uID09PSAnYXNjJyB8fCBkaXJlY3Rpb24gPT09ICdkZXNjJztcclxuICB9XHJcblxyXG4gIC8qKiBFdmVudCBlbWl0dGVkIHdoZW4gdGhlIHVzZXIgY2hhbmdlcyBlaXRoZXIgdGhlIGFjdGl2ZSBzb3J0IG9yIHNvcnQgZGlyZWN0aW9uLiAqL1xyXG4gIEBPdXRwdXQoJ21hdFNvcnRDaGFuZ2UnKVxyXG4gIHJlYWRvbmx5IG11bHRpU29ydENoYW5nZTogRXZlbnRFbWl0dGVyPE11bHRpU29ydD4gPSBuZXcgRXZlbnRFbWl0dGVyPE11bHRpU29ydD4oKTtcclxuXHJcbiAgLyoqIFNldHMgdGhlIGFjdGl2ZSBzb3J0IGlkIGFuZCBkZXRlcm1pbmVzIHRoZSBuZXcgc29ydCBkaXJlY3Rpb24uICovXHJcbiAgc29ydChzb3J0YWJsZTogTWF0U29ydGFibGUpOiB2b2lkIHtcclxuICAgIGlmICghQXJyYXkuaXNBcnJheSh0aGlzLnNvcnRlZEJ5KSkge1xyXG4gICAgICBsZXQgZGlyZWN0aW9uID0gc29ydGFibGUuc3RhcnQgPyBzb3J0YWJsZS5zdGFydCA6IHRoaXMuc3RhcnQ7XHJcbiAgICAgIHRoaXMuX3NvcnRlZEJ5ID0gW3tcclxuICAgICAgICBpZDogc29ydGFibGUuaWQsXHJcbiAgICAgICAgZGlyZWN0aW9uOiBkaXJlY3Rpb25cclxuICAgICAgfV07ICBcclxuICAgIH0gZWxzZSB7XHJcbiAgICAgIGNvbnN0IHNvcnQgPSB0aGlzLl9zb3J0ZWRCeS5maW5kKHMgPT4gcy5pZCA9PT0gc29ydGFibGUuaWQpO1xyXG4gICAgICBpZiAoc29ydCkge1xyXG4gICAgICAgIHRoaXMuZGlyZWN0aW9uID0gc29ydC5kaXJlY3Rpb247XHJcbiAgICAgICAgbGV0IG5leHREaXJlY3Rpb24gPSB0aGlzLmdldE5leHRTb3J0RGlyZWN0aW9uKHNvcnRhYmxlKTsgICAgICAgIFxyXG4gICAgICAgIGlmIChuZXh0RGlyZWN0aW9uKSB7XHJcbiAgICAgICAgICBzb3J0LmRpcmVjdGlvbiA9IG5leHREaXJlY3Rpb247XHJcbiAgICAgICAgfSBlbHNlIHtcclxuICAgICAgICAgIGxldCBpbmRleCA9IHRoaXMuX3NvcnRlZEJ5LmluZGV4T2Yoc29ydCk7XHJcbiAgICAgICAgICB0aGlzLl9zb3J0ZWRCeS5zcGxpY2UoaW5kZXgsIDEpO1xyXG4gICAgICAgIH1cclxuICAgICAgfSBlbHNlIHtcclxuICAgICAgICBsZXQgbmV3U29ydCA9IHtcclxuICAgICAgICAgIGlkOiBzb3J0YWJsZS5pZCxcclxuICAgICAgICAgIGRpcmVjdGlvbjogc29ydGFibGUuc3RhcnQgPyBzb3J0YWJsZS5zdGFydCA6IHRoaXMuc3RhcnRcclxuICAgICAgICB9XHJcbiAgICAgICAgaWYgKHRoaXMubW9kZSA9PT0gJ211bHRpJykge1xyXG4gICAgICAgICAgdGhpcy5fc29ydGVkQnkucHVzaChuZXdTb3J0KTtcclxuICAgICAgICB9IGVsc2Uge1xyXG4gICAgICAgICAgdGhpcy5fc29ydGVkQnkgPSBbbmV3U29ydF1cclxuICAgICAgICB9XHJcbiAgICAgIH1cclxuICAgIH1cclxuXHJcbiAgICB0aGlzLm11bHRpU29ydENoYW5nZS5lbWl0KHsgc29ydGVkQnk6IHRoaXMuX3NvcnRlZEJ5IH0pOyAgIFxyXG4gICAgc3VwZXIuc29ydChzb3J0YWJsZSk7XHJcbiAgfVxyXG5cclxuICBuZ09uSW5pdCgpIHtcclxuICAgIHN1cGVyLm5nT25Jbml0KCk7XHJcbiAgfVxyXG59XHJcbiJdfQ==