@kuzntsv/uikit 0.21.31 → 0.21.33
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.
|
@@ -1844,45 +1844,18 @@ var DialogAction;
|
|
|
1844
1844
|
})(DialogAction || (DialogAction = {}));
|
|
1845
1845
|
|
|
1846
1846
|
class NavBarComponent extends BaseNavBarMenuClass {
|
|
1847
|
-
|
|
1848
|
-
|
|
1849
|
-
fioUser = '';
|
|
1850
|
-
|
|
1851
|
-
|
|
1852
|
-
|
|
1853
|
-
avatarService = inject(AvatarService);
|
|
1847
|
+
visibleOnLogout = input(false, ...(ngDevMode ? [{ debugName: "visibleOnLogout" }] : []));
|
|
1848
|
+
loggedIn = input(false, ...(ngDevMode ? [{ debugName: "loggedIn" }] : []));
|
|
1849
|
+
fioUser = input('', ...(ngDevMode ? [{ debugName: "fioUser" }] : []));
|
|
1850
|
+
roles = input([], ...(ngDevMode ? [{ debugName: "roles" }] : []));
|
|
1851
|
+
photoURL = input('', ...(ngDevMode ? [{ debugName: "photoURL" }] : []));
|
|
1852
|
+
logout = output();
|
|
1854
1853
|
dialog = inject(MatDialog);
|
|
1855
1854
|
constructor() {
|
|
1856
1855
|
super();
|
|
1857
|
-
this.loggedIn$ = this.authService.loggedIn$;
|
|
1858
|
-
this.roles$ = this.authService.roles$;
|
|
1859
|
-
this.fioUser = '';
|
|
1860
|
-
const subs = this.loggedIn$.subscribe({
|
|
1861
|
-
next: (value) => {
|
|
1862
|
-
if (value) {
|
|
1863
|
-
if (this.userService.userData) {
|
|
1864
|
-
if (this.userService.userData.lastName && this.userService.userData.firstName) {
|
|
1865
|
-
this.fioUser = this.userService.userData.lastName + ' ' + this.userService.userData.firstName;
|
|
1866
|
-
}
|
|
1867
|
-
if (this.userService.userData.idHuman) {
|
|
1868
|
-
// Аватар сотрудника.
|
|
1869
|
-
const subs2 = this.avatarService.getAvatarById(Number(this.userService.userData.idHuman))
|
|
1870
|
-
.subscribe((image) => {
|
|
1871
|
-
if (image) {
|
|
1872
|
-
const blob = new Blob([image], { "type": "image/jpeg" });
|
|
1873
|
-
this.photoURL = URL.createObjectURL(blob);
|
|
1874
|
-
}
|
|
1875
|
-
});
|
|
1876
|
-
this.subscription.add(subs2);
|
|
1877
|
-
}
|
|
1878
|
-
}
|
|
1879
|
-
}
|
|
1880
|
-
}
|
|
1881
|
-
});
|
|
1882
|
-
this.subscription.add(subs);
|
|
1883
1856
|
}
|
|
1884
|
-
|
|
1885
|
-
this.
|
|
1857
|
+
onLogout() {
|
|
1858
|
+
this.logout.emit(this.router.url);
|
|
1886
1859
|
}
|
|
1887
1860
|
openDialog() {
|
|
1888
1861
|
const dialogRef = this.dialog.open(DialogComponent, {
|
|
@@ -1897,19 +1870,18 @@ class NavBarComponent extends BaseNavBarMenuClass {
|
|
|
1897
1870
|
});
|
|
1898
1871
|
const subs = dialogRef.afterClosed().subscribe((id) => {
|
|
1899
1872
|
if (id) {
|
|
1900
|
-
this.
|
|
1873
|
+
this.onLogout();
|
|
1901
1874
|
}
|
|
1902
1875
|
});
|
|
1903
1876
|
this.subscription.add(subs);
|
|
1904
1877
|
}
|
|
1905
1878
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NavBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1906
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: NavBarComponent, isStandalone: true, selector: "ngx-uik-navbar", usesInheritance: true, ngImport: i0, template: "@if (
|
|
1879
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: NavBarComponent, isStandalone: true, selector: "ngx-uik-navbar", inputs: { visibleOnLogout: { classPropertyName: "visibleOnLogout", publicName: "visibleOnLogout", isSignal: true, isRequired: false, transformFunction: null }, loggedIn: { classPropertyName: "loggedIn", publicName: "loggedIn", isSignal: true, isRequired: false, transformFunction: null }, fioUser: { classPropertyName: "fioUser", publicName: "fioUser", isSignal: true, isRequired: false, transformFunction: null }, roles: { classPropertyName: "roles", publicName: "roles", isSignal: true, isRequired: false, transformFunction: null }, photoURL: { classPropertyName: "photoURL", publicName: "photoURL", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { logout: "logout" }, usesInheritance: true, ngImport: i0, template: "@if (visibleOnLogout() || loggedIn()) {\r\n <nav class=\"ngx-uik-navbar-header\">\r\n \r\n <ng-content></ng-content>\r\n\r\n <div class=\"flex-spacer\"></div>\r\n \r\n @if (loggedIn() === false || !photoURL) {\r\n <mat-icon [matTooltip]=\"(roles())?.join(',')||''\">account_circle</mat-icon>\r\n }\r\n @if (loggedIn() && photoURL()) {\r\n <img\r\n class=\"user-photo\"\r\n [src]=\"photoURL() | safe\"\r\n loading=\"lazy\"\r\n [alt]=\"fioUser()\"\r\n [matTooltip]=\"(roles())?.join(',')||''\">\r\n }\r\n\r\n <span class = \"user-name\" [matTooltip]=\"(roles())?.join(',') || ''\">\r\n {{ fioUser() }}\r\n </span>\r\n\r\n <a mat-button class=\"pm-button\" (click)=\"openDialog()\">\u0412\u044B\u0439\u0442\u0438 <mat-icon>logout</mat-icon></a>\r\n </nav>\r\n}", styles: [".ngx-uik-navbar-header{display:flex;flex-wrap:wrap;align-items:center;padding:8px 16px}.flex-spacer{flex-grow:1}.user-name{margin-left:8px;line-height:1rem;white-space:normal}.user-photo{border-radius:50%;width:32px;height:32px;margin-right:10px}.mat-mdc-button{color:#fff!important;padding-left:16px!important;padding-right:16px!important}.mdc-button{letter-spacing:normal}\n"], dependencies: [{ kind: "component", type: MatAnchor, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "pipe", type: SafePipe, name: "safe" }] });
|
|
1907
1880
|
}
|
|
1908
1881
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NavBarComponent, decorators: [{
|
|
1909
1882
|
type: Component,
|
|
1910
|
-
args: [{ selector: 'ngx-uik-navbar', imports: [MatAnchor, MatIcon, MatTooltip,
|
|
1911
|
-
|
|
1912
|
-
}], ctorParameters: () => [] });
|
|
1883
|
+
args: [{ selector: 'ngx-uik-navbar', imports: [MatAnchor, MatIcon, MatTooltip, SafePipe], template: "@if (visibleOnLogout() || loggedIn()) {\r\n <nav class=\"ngx-uik-navbar-header\">\r\n \r\n <ng-content></ng-content>\r\n\r\n <div class=\"flex-spacer\"></div>\r\n \r\n @if (loggedIn() === false || !photoURL) {\r\n <mat-icon [matTooltip]=\"(roles())?.join(',')||''\">account_circle</mat-icon>\r\n }\r\n @if (loggedIn() && photoURL()) {\r\n <img\r\n class=\"user-photo\"\r\n [src]=\"photoURL() | safe\"\r\n loading=\"lazy\"\r\n [alt]=\"fioUser()\"\r\n [matTooltip]=\"(roles())?.join(',')||''\">\r\n }\r\n\r\n <span class = \"user-name\" [matTooltip]=\"(roles())?.join(',') || ''\">\r\n {{ fioUser() }}\r\n </span>\r\n\r\n <a mat-button class=\"pm-button\" (click)=\"openDialog()\">\u0412\u044B\u0439\u0442\u0438 <mat-icon>logout</mat-icon></a>\r\n </nav>\r\n}", styles: [".ngx-uik-navbar-header{display:flex;flex-wrap:wrap;align-items:center;padding:8px 16px}.flex-spacer{flex-grow:1}.user-name{margin-left:8px;line-height:1rem;white-space:normal}.user-photo{border-radius:50%;width:32px;height:32px;margin-right:10px}.mat-mdc-button{color:#fff!important;padding-left:16px!important;padding-right:16px!important}.mdc-button{letter-spacing:normal}\n"] }]
|
|
1884
|
+
}], ctorParameters: () => [], propDecorators: { visibleOnLogout: [{ type: i0.Input, args: [{ isSignal: true, alias: "visibleOnLogout", required: false }] }], loggedIn: [{ type: i0.Input, args: [{ isSignal: true, alias: "loggedIn", required: false }] }], fioUser: [{ type: i0.Input, args: [{ isSignal: true, alias: "fioUser", required: false }] }], roles: [{ type: i0.Input, args: [{ isSignal: true, alias: "roles", required: false }] }], photoURL: [{ type: i0.Input, args: [{ isSignal: true, alias: "photoURL", required: false }] }], logout: [{ type: i0.Output, args: ["logout"] }] } });
|
|
1913
1885
|
|
|
1914
1886
|
class NotFoundComponent {
|
|
1915
1887
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NotFoundComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
@@ -2252,14 +2224,14 @@ class TableComponent {
|
|
|
2252
2224
|
return arr.reduce((acc, value) => acc + value, 0);
|
|
2253
2225
|
}
|
|
2254
2226
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: TableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2255
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: TableComponent, isStandalone: true, selector: "ngx-uik-table", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, length: { classPropertyName: "length", publicName: "length", isSignal: true, isRequired: false, transformFunction: null }, columnOptions: { classPropertyName: "columnOptions", publicName: "columnOptions", isSignal: true, isRequired: false, transformFunction: null }, tableState: { classPropertyName: "tableState", publicName: "tableState", isSignal: true, isRequired: true, transformFunction: null }, allowMultiSelect: { classPropertyName: "allowMultiSelect", publicName: "allowMultiSelect", isSignal: true, isRequired: false, transformFunction: null }, opt: { classPropertyName: "opt", publicName: "opt", isSignal: true, isRequired: false, transformFunction: null }, rowDblClickedDisable: { classPropertyName: "rowDblClickedDisable", publicName: "rowDblClickedDisable", isSignal: true, isRequired: false, transformFunction: null }, footer: { classPropertyName: "footer", publicName: "footer", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { pageStateChange: "pageStateChange", sortStateChange: "sortStateChange", selectionChange: "selectionChange", rowDoubleClicked: "rowDoubleClicked" }, viewQueries: [{ propertyName: "sort", first: true, predicate: MatSort, descendants: true, isSignal: true }, { propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, isSignal: true }, { propertyName: "contextMenu", first: true, predicate: MatMenuTrigger, descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"component-container\">\r\n <div class=\"table-container\">\r\n <table mat-table [dataSource]=\"dataSource\"\r\n matSort\r\n [matSortActive]=\"sortState().sortActive || ''\"\r\n [matSortDirection]=\"sortState().sortDirection\"\r\n matSortDisableClear>\r\n\r\n <!-- \u0412\u044B\u0431\u043E\u0440 \u0441\u0442\u0440\u043E\u043A\u0438 Column -->\r\n <ng-container matColumnDef=\"select\">\r\n <th mat-header-cell *matHeaderCellDef>\r\n @if (allowMultiSelect()) {\r\n <mat-checkbox (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\"\r\n [indeterminate]=\"selection.hasValue() && !isAllSelected()\">\r\n </mat-checkbox>\r\n }\r\n </th>\r\n <td mat-cell *matCellDef=\"let row\">\r\n <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(row) : null\"\r\n [checked]=\"selection.isSelected(row)\">\r\n </mat-checkbox>\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef></td>\r\n }\r\n </ng-container>\r\n\r\n @for (item of columnOptions(); track item) {\r\n <ng-container matColumnDef={{item.name}}>\r\n <th mat-header-cell *matHeaderCellDef mat-sort-header [disabled]=\"item.titleSortDisable\">{{item.title}}</th>\r\n @if (!item.format) {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n {{element[item.name]}}\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footer) {\r\n <strong>{{ getTotal(item.name) }}</strong>\r\n }\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n } \r\n }\r\n @if (item.format === 'pre-wrap') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" class=\"pre-wrap\" [matTooltip]=\"item.tooltip ?? ''\">\r\n {{element[item.name]}}\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'link') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n <a [href]=\"element[item.name]\" target=\"_blank\">{{element[item.name]}}</a>\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'linkIcon') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n @if (element[item.name]) {\r\n <a [href]=\"element[item.name]\" target=\"_blank\">\r\n @if (item.icon) {\r\n <mat-icon [class]=\"item.classList ? item.classList : ''\" >{{item.icon}}</mat-icon>\r\n } \r\n @if (item.symbol) {\r\n <span [class]=\"item.classList ? item.classList : ''\" >{{item.symbol}}</span>\r\n }\r\n </a>\r\n }\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'routerLink') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n <a [routerLink]=\"[element[item.name]]\">{{element[item.name]}}</a>\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'routerLinkIcon') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n @if (element[item.name]) {\r\n <a [routerLink]=\"[element[item.name]]\">\r\n @if (item.icon) {\r\n <mat-icon [class]=\"item.classList ? item.classList : ''\" >{{item.icon}}</mat-icon>\r\n } \r\n @if (item.symbol) {\r\n <span [class]=\"item.classList ? item.classList : ''\" >{{item.symbol}}</span>\r\n }\r\n </a>\r\n }\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'checkbox') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n <mat-checkbox [checked]=\"element[item.name] === 1\" [disabled]=\"true\"></mat-checkbox>\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'icon') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n @if (item.icon) {\r\n <mat-icon [class]=\"item.classList ? item.classList : ''\" >{{item.icon}}</mat-icon>\r\n } \r\n @if (item.symbol) {\r\n <span [class]=\"item.classList ? item.classList : ''\" >{{item.symbol}}</span>\r\n }\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'icons') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\">\r\n @if (item.icons) {\r\n <mat-icon [class]=\"item.classList ? item.classList[element[item.name]] : ''\" \r\n [matTooltip]=\"item.tooltips ? item.tooltips[element[item.name]] : ''\">{{item.icons[element[item.name]]}}</mat-icon>\r\n } \r\n @if (item.symbols) {\r\n <span [class]=\"item.classList ? item.classList[element[item.name]] : ''\" >{{item.symbols[element[item.name]]}}</span>\r\n }\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'actions') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\">\r\n @if (item.actions) {\r\n <div class=\"actions-container\">\r\n @for (action of item.actions; track action) {\r\n @if (!(action.hideFn ? action.hideFn(element) : action.hide)) {\r\n <button mat-icon-button\r\n (click)=\"action.onClickFn ? action.onClickFn(element) : ''\"\r\n (mousedown)=\"action.onClickMiddleFn ? action.onClickMiddleFn($event, element) : ''\"\r\n [disabled]=\"action.disabledFn ? action.disabledFn(element) : action.disabled\"\r\n [matTooltip]=\"action.tooltip ? action.tooltip : ''\" >\r\n @if (action.icon) {\r\n <mat-icon [class]=\"action.classList ? action.classList : ''\" >{{action.icon}}</mat-icon>\r\n }\r\n @if (action.symbol) {\r\n <span [class]=\"action.classList ? action.classList : ''\" >{{action.symbol}}</span>\r\n }\r\n {{ action.title }}\r\n </button>\r\n }\r\n }\r\n </div>\r\n } \r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'image') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n @if (item.imageUrl) {\r\n <img\r\n [src]=\"item.imageUrl\"\r\n [alt]=\"item.imageAlt ? item.imageAlt : ''\"\r\n [class]=\"item.classList ? item.classList : ''\"\r\n />\r\n } \r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n </ng-container>\r\n }\r\n\r\n <tr class=\"mat-row\" *matNoDataRow>\r\n <td class=\"mat-cell\" colspan=\"9999\">\r\n \u041D\u0435\u0442 \u0434\u0430\u043D\u043D\u044B\u0445 \u0434\u043B\u044F \u043E\u0442\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0438\u044F\r\n </td>\r\n </tr>\r\n\r\n <tr mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></tr>\r\n <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\" \r\n (click)=\"onRowClicked(row)\" (dblclick)=\"onRowDblClicked(row)\" \r\n class=\"element-row\" [class.selected-row]=\"selection.isSelected(row)\">\r\n </tr>\r\n @if (footer()) {\r\n <tr mat-footer-row *matFooterRowDef=\"displayedColumns; sticky: true\"></tr>\r\n }\r\n </table>\r\n <div style=\"visibility: hidden; position: fixed\"\r\n [style.left]=\"contextMenuPosition.x\"\r\n [style.top]=\"contextMenuPosition.y\"\r\n [matMenuTriggerFor]=\"contextMenu\" #menuTrigger=\"matMenuTrigger\">\r\n </div>\r\n <mat-menu #contextMenu=\"matMenu\">\r\n <ng-template matMenuContent let-id=\"id\">\r\n @for (menuItem of opt(); track menuItem) {\r\n @if (menuItem.title === '-' && !(menuItem.hideFn ? menuItem.hideFn(itemForMenu) : menuItem.hide)) {\r\n <mat-divider></mat-divider>\r\n }\r\n @if (menuItem.title !== '-' && !(menuItem.hideFn ? menuItem.hideFn(itemForMenu) : menuItem.hide)) {\r\n <button mat-menu-item\r\n (click)=\"menuItem.onClickFn ? menuItem.onClickFn(itemForMenu) : ''\"\r\n (mousedown)=\"menuItem.onClickMiddleFn ? menuItem.onClickMiddleFn($event, itemForMenu, menuTrigger) : ''\"\r\n [disabled]=\"menuItem.disabledFn ? menuItem.disabledFn(itemForMenu) : menuItem.disabled\">\r\n @if (menuItem.icon) {\r\n <mat-icon [class]=\"menuItem.classList ? menuItem.classList : ''\">{{menuItem.icon}}</mat-icon>\r\n }\r\n @if (menuItem.symbol) {\r\n <span [class]=\"menuItem.classList ? menuItem.classList : ''\">{{menuItem.symbol}}</span>\r\n }\r\n {{ menuItem.title }}\r\n </button>\r\n }\r\n }\r\n </ng-template>\r\n </mat-menu>\r\n</div>\r\n\r\n\r\n<mat-paginator [length]=\"length()\"\r\n [pageIndex]=\"pageState().pageIndex || defaultPageIndex\"\r\n [pageSizeOptions]=\"[5, 10, 20, 50, 100]\"\r\n [pageSize]=\"pageState().pageSize || defaultPageSize\"\r\n showFirstLastButtons\r\n itemsPerPageLabel=\"\"\r\n></mat-paginator>\r\n</div>\r\n", styles: [".component-container{display:flex;flex-direction:column;height:100%}.table-container{display:flex;flex-direction:column;justify-content:space-between;flex:auto;margin:0 20px;overflow:auto;height:400px}.center{position:absolute;inset:0 0 56px;background:#00000026;z-index:1;display:flex;align-items:center;justify-content:center}.mat-column-select{overflow:initial}tr.mat-footer-row{font-weight:700;height:56px}.mat-table{overflow-x:scroll}.mat-cell,.mat-header-cell{word-wrap:initial;display:table-cell;padding:0 10px;line-break:unset;white-space:nowrap;overflow:hidden;vertical-align:middle}.mat-row,.mat-header-row{display:table-row}tr.element-row:not(.selected-row):hover{background:#f5f5f5}tr.element-row:not(.selected-row):active{background:#efefef}.selected-row{background-color:#eee}.fact-done-row{background-color:#eefdec}a,a:visited,a:hover,a:active{color:inherit}.pre-wrap{white-space:pre-wrap}.actions-container{display:flex;column-gap:5px}\n"], dependencies: [{ kind: "component", type: MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "directive", type: MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "component", type: MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: MatNoDataRow, selector: "ng-template[matNoDataRow]" }, { kind: "directive", type: MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "component", type: MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "directive", type: MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "component", type: MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "directive", type: MatMenuContent, selector: "ng-template[matMenuContent]" }, { kind: "component", type: MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "component", type: MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "directive", type: MatFooterRowDef, selector: "[matFooterRowDef]", inputs: ["matFooterRowDef", "matFooterRowDefSticky"] }, { kind: "component", type: MatFooterRow, selector: "mat-footer-row, tr[mat-footer-row]", exportAs: ["matFooterRow"] }, { kind: "directive", type: MatFooterCellDef, selector: "[matFooterCellDef]" }, { kind: "directive", type: MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "ngmodule", type: MatTableModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i1$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }] });
|
|
2227
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: TableComponent, isStandalone: true, selector: "ngx-uik-table", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, length: { classPropertyName: "length", publicName: "length", isSignal: true, isRequired: false, transformFunction: null }, columnOptions: { classPropertyName: "columnOptions", publicName: "columnOptions", isSignal: true, isRequired: false, transformFunction: null }, tableState: { classPropertyName: "tableState", publicName: "tableState", isSignal: true, isRequired: true, transformFunction: null }, allowMultiSelect: { classPropertyName: "allowMultiSelect", publicName: "allowMultiSelect", isSignal: true, isRequired: false, transformFunction: null }, opt: { classPropertyName: "opt", publicName: "opt", isSignal: true, isRequired: false, transformFunction: null }, rowDblClickedDisable: { classPropertyName: "rowDblClickedDisable", publicName: "rowDblClickedDisable", isSignal: true, isRequired: false, transformFunction: null }, footer: { classPropertyName: "footer", publicName: "footer", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { pageStateChange: "pageStateChange", sortStateChange: "sortStateChange", selectionChange: "selectionChange", rowDoubleClicked: "rowDoubleClicked" }, viewQueries: [{ propertyName: "sort", first: true, predicate: MatSort, descendants: true, isSignal: true }, { propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, isSignal: true }, { propertyName: "contextMenu", first: true, predicate: MatMenuTrigger, descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"component-container\">\r\n <div class=\"table-container\">\r\n <table mat-table [dataSource]=\"dataSource\"\r\n matSort\r\n [matSortActive]=\"sortState().sortActive || ''\"\r\n [matSortDirection]=\"sortState().sortDirection\"\r\n matSortDisableClear>\r\n\r\n <!-- \u0412\u044B\u0431\u043E\u0440 \u0441\u0442\u0440\u043E\u043A\u0438 Column -->\r\n <ng-container matColumnDef=\"select\">\r\n <th mat-header-cell *matHeaderCellDef>\r\n @if (allowMultiSelect()) {\r\n <mat-checkbox (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\"\r\n [indeterminate]=\"selection.hasValue() && !isAllSelected()\">\r\n </mat-checkbox>\r\n }\r\n </th>\r\n <td mat-cell *matCellDef=\"let row\">\r\n <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(row) : null\"\r\n [checked]=\"selection.isSelected(row)\">\r\n </mat-checkbox>\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef></td>\r\n }\r\n </ng-container>\r\n\r\n @for (item of columnOptions(); track item) {\r\n <ng-container matColumnDef={{item.name}}>\r\n <th mat-header-cell *matHeaderCellDef mat-sort-header [disabled]=\"item.titleSortDisable\">{{item.title}}</th>\r\n @if (!item.format) {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n {{element[item.name]}}\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footer) {\r\n <strong>{{ getTotal(item.name) }}</strong>\r\n }\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n } \r\n }\r\n @if (item.format === 'pre-wrap') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" class=\"pre-wrap\" [matTooltip]=\"item.tooltip ?? ''\">\r\n {{element[item.name]}}\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'link') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n <a [href]=\"element[item.name]\" target=\"_blank\">{{element[item.name]}}</a>\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'linkIcon') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n @if (element[item.name]) {\r\n <a [href]=\"element[item.name]\" target=\"_blank\">\r\n @if (item.icon) {\r\n <mat-icon [class]=\"item.classList ? item.classList : ''\" >{{item.icon}}</mat-icon>\r\n } \r\n @if (item.symbol) {\r\n <span [class]=\"item.classList ? item.classList : ''\" >{{item.symbol}}</span>\r\n }\r\n </a>\r\n }\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'routerLink') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n <a [routerLink]=\"[element[item.name]]\">{{element[item.name]}}</a>\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'routerLinkIcon') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n @if (element[item.name]) {\r\n <a [routerLink]=\"[element[item.name]]\">\r\n @if (item.icon) {\r\n <mat-icon [class]=\"item.classList ? item.classList : ''\" >{{item.icon}}</mat-icon>\r\n } \r\n @if (item.symbol) {\r\n <span [class]=\"item.classList ? item.classList : ''\" >{{item.symbol}}</span>\r\n }\r\n </a>\r\n }\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'checkbox') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n <mat-checkbox [checked]=\"element[item.name] === 1\" [disabled]=\"true\"></mat-checkbox>\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'icon') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n @if (item.icon) {\r\n <mat-icon [class]=\"item.classList ? item.classList : ''\" >{{item.icon}}</mat-icon>\r\n } \r\n @if (item.symbol) {\r\n <span [class]=\"item.classList ? item.classList : ''\" >{{item.symbol}}</span>\r\n }\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'icons') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\">\r\n @if (item.icons) {\r\n <mat-icon [class]=\"item.classList ? item.classList[element[item.name]] : ''\" \r\n [matTooltip]=\"item.tooltips ? item.tooltips[element[item.name]] : ''\">{{item.icons[element[item.name]]}}</mat-icon>\r\n } \r\n @if (item.symbols) {\r\n <span [class]=\"item.classList ? item.classList[element[item.name]] : ''\" >{{item.symbols[element[item.name]]}}</span>\r\n }\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'actions') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\">\r\n @if (item.actions) {\r\n <div class=\"actions-container\">\r\n @for (action of item.actions; track action) {\r\n @if (!(action.hideFn ? action.hideFn(element) : action.hide)) {\r\n <button mat-icon-button\r\n (click)=\"action.onClickFn ? action.onClickFn(element) : ''\"\r\n (mousedown)=\"action.onClickMiddleFn ? action.onClickMiddleFn($event, element) : ''\"\r\n [disabled]=\"action.disabledFn ? action.disabledFn(element) : action.disabled\"\r\n [matTooltip]=\"action.tooltip ? action.tooltip : ''\" >\r\n @if (action.icon) {\r\n <mat-icon [class]=\"action.classList ? action.classList : ''\" >{{action.icon}}</mat-icon>\r\n }\r\n @if (action.symbol) {\r\n <span [class]=\"action.classList ? action.classList : ''\" >{{action.symbol}}</span>\r\n }\r\n {{ action.title }}\r\n </button>\r\n }\r\n }\r\n </div>\r\n } \r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'image') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n @if (element[item.name]) {\r\n <img\r\n [src]=\"element[item.name]\"\r\n [alt]=\"item.imageAlt && element[item.imageAlt] ? element[item.imageAlt] : ''\"\r\n [class]=\"item.classList ? item.classList : ''\"\r\n />\r\n } \r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n </ng-container>\r\n }\r\n\r\n <tr class=\"mat-row\" *matNoDataRow>\r\n <td class=\"mat-cell\" colspan=\"9999\">\r\n \u041D\u0435\u0442 \u0434\u0430\u043D\u043D\u044B\u0445 \u0434\u043B\u044F \u043E\u0442\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0438\u044F\r\n </td>\r\n </tr>\r\n\r\n <tr mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></tr>\r\n <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\" \r\n (click)=\"onRowClicked(row)\" (dblclick)=\"onRowDblClicked(row)\" \r\n class=\"element-row\" [class.selected-row]=\"selection.isSelected(row)\">\r\n </tr>\r\n @if (footer()) {\r\n <tr mat-footer-row *matFooterRowDef=\"displayedColumns; sticky: true\"></tr>\r\n }\r\n </table>\r\n <div style=\"visibility: hidden; position: fixed\"\r\n [style.left]=\"contextMenuPosition.x\"\r\n [style.top]=\"contextMenuPosition.y\"\r\n [matMenuTriggerFor]=\"contextMenu\" #menuTrigger=\"matMenuTrigger\">\r\n </div>\r\n <mat-menu #contextMenu=\"matMenu\">\r\n <ng-template matMenuContent let-id=\"id\">\r\n @for (menuItem of opt(); track menuItem) {\r\n @if (menuItem.title === '-' && !(menuItem.hideFn ? menuItem.hideFn(itemForMenu) : menuItem.hide)) {\r\n <mat-divider></mat-divider>\r\n }\r\n @if (menuItem.title !== '-' && !(menuItem.hideFn ? menuItem.hideFn(itemForMenu) : menuItem.hide)) {\r\n <button mat-menu-item\r\n (click)=\"menuItem.onClickFn ? menuItem.onClickFn(itemForMenu) : ''\"\r\n (mousedown)=\"menuItem.onClickMiddleFn ? menuItem.onClickMiddleFn($event, itemForMenu, menuTrigger) : ''\"\r\n [disabled]=\"menuItem.disabledFn ? menuItem.disabledFn(itemForMenu) : menuItem.disabled\">\r\n @if (menuItem.icon) {\r\n <mat-icon [class]=\"menuItem.classList ? menuItem.classList : ''\">{{menuItem.icon}}</mat-icon>\r\n }\r\n @if (menuItem.symbol) {\r\n <span [class]=\"menuItem.classList ? menuItem.classList : ''\">{{menuItem.symbol}}</span>\r\n }\r\n {{ menuItem.title }}\r\n </button>\r\n }\r\n }\r\n </ng-template>\r\n </mat-menu>\r\n</div>\r\n\r\n\r\n<mat-paginator [length]=\"length()\"\r\n [pageIndex]=\"pageState().pageIndex || defaultPageIndex\"\r\n [pageSizeOptions]=\"[5, 10, 20, 50, 100]\"\r\n [pageSize]=\"pageState().pageSize || defaultPageSize\"\r\n showFirstLastButtons\r\n itemsPerPageLabel=\"\"\r\n></mat-paginator>\r\n</div>\r\n", styles: [".component-container{display:flex;flex-direction:column;height:100%}.table-container{display:flex;flex-direction:column;justify-content:space-between;flex:auto;margin:0 20px;overflow:auto;height:400px}.center{position:absolute;inset:0 0 56px;background:#00000026;z-index:1;display:flex;align-items:center;justify-content:center}.mat-column-select{overflow:initial}tr.mat-footer-row{font-weight:700;height:56px}.mat-table{overflow-x:scroll}.mat-cell,.mat-header-cell{word-wrap:initial;display:table-cell;padding:0 10px;line-break:unset;white-space:nowrap;overflow:hidden;vertical-align:middle}.mat-row,.mat-header-row{display:table-row}tr.element-row:not(.selected-row):hover{background:#f5f5f5}tr.element-row:not(.selected-row):active{background:#efefef}.selected-row{background-color:#eee}.fact-done-row{background-color:#eefdec}a,a:visited,a:hover,a:active{color:inherit}.pre-wrap{white-space:pre-wrap}.actions-container{display:flex;column-gap:5px}\n"], dependencies: [{ kind: "component", type: MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "directive", type: MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "component", type: MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: MatNoDataRow, selector: "ng-template[matNoDataRow]" }, { kind: "directive", type: MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "component", type: MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "directive", type: MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "component", type: MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "directive", type: MatMenuContent, selector: "ng-template[matMenuContent]" }, { kind: "component", type: MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "component", type: MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "directive", type: MatFooterRowDef, selector: "[matFooterRowDef]", inputs: ["matFooterRowDef", "matFooterRowDefSticky"] }, { kind: "component", type: MatFooterRow, selector: "mat-footer-row, tr[mat-footer-row]", exportAs: ["matFooterRow"] }, { kind: "directive", type: MatFooterCellDef, selector: "[matFooterCellDef]" }, { kind: "directive", type: MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "ngmodule", type: MatTableModule }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i1$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }] });
|
|
2256
2228
|
}
|
|
2257
2229
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: TableComponent, decorators: [{
|
|
2258
2230
|
type: Component,
|
|
2259
2231
|
args: [{ selector: 'ngx-uik-table', imports: [MatTable, MatSort, MatColumnDef, MatHeaderCellDef, MatHeaderCell, MatCheckbox, MatCellDef, MatCell,
|
|
2260
2232
|
MatSortHeader, MatIcon, RouterLink, MatNoDataRow, MatHeaderRowDef, MatHeaderRow, MatRowDef, MatRow,
|
|
2261
2233
|
MatMenuTrigger, MatMenu, MatMenuContent, MatDivider, MatMenuItem, MatPaginator, MatFooterRowDef, MatFooterRow,
|
|
2262
|
-
MatFooterCellDef, MatFooterCell, MatTableModule, MatTooltipModule, MatIconButton], template: "<div class=\"component-container\">\r\n <div class=\"table-container\">\r\n <table mat-table [dataSource]=\"dataSource\"\r\n matSort\r\n [matSortActive]=\"sortState().sortActive || ''\"\r\n [matSortDirection]=\"sortState().sortDirection\"\r\n matSortDisableClear>\r\n\r\n <!-- \u0412\u044B\u0431\u043E\u0440 \u0441\u0442\u0440\u043E\u043A\u0438 Column -->\r\n <ng-container matColumnDef=\"select\">\r\n <th mat-header-cell *matHeaderCellDef>\r\n @if (allowMultiSelect()) {\r\n <mat-checkbox (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\"\r\n [indeterminate]=\"selection.hasValue() && !isAllSelected()\">\r\n </mat-checkbox>\r\n }\r\n </th>\r\n <td mat-cell *matCellDef=\"let row\">\r\n <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(row) : null\"\r\n [checked]=\"selection.isSelected(row)\">\r\n </mat-checkbox>\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef></td>\r\n }\r\n </ng-container>\r\n\r\n @for (item of columnOptions(); track item) {\r\n <ng-container matColumnDef={{item.name}}>\r\n <th mat-header-cell *matHeaderCellDef mat-sort-header [disabled]=\"item.titleSortDisable\">{{item.title}}</th>\r\n @if (!item.format) {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n {{element[item.name]}}\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footer) {\r\n <strong>{{ getTotal(item.name) }}</strong>\r\n }\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n } \r\n }\r\n @if (item.format === 'pre-wrap') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" class=\"pre-wrap\" [matTooltip]=\"item.tooltip ?? ''\">\r\n {{element[item.name]}}\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'link') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n <a [href]=\"element[item.name]\" target=\"_blank\">{{element[item.name]}}</a>\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'linkIcon') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n @if (element[item.name]) {\r\n <a [href]=\"element[item.name]\" target=\"_blank\">\r\n @if (item.icon) {\r\n <mat-icon [class]=\"item.classList ? item.classList : ''\" >{{item.icon}}</mat-icon>\r\n } \r\n @if (item.symbol) {\r\n <span [class]=\"item.classList ? item.classList : ''\" >{{item.symbol}}</span>\r\n }\r\n </a>\r\n }\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'routerLink') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n <a [routerLink]=\"[element[item.name]]\">{{element[item.name]}}</a>\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'routerLinkIcon') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n @if (element[item.name]) {\r\n <a [routerLink]=\"[element[item.name]]\">\r\n @if (item.icon) {\r\n <mat-icon [class]=\"item.classList ? item.classList : ''\" >{{item.icon}}</mat-icon>\r\n } \r\n @if (item.symbol) {\r\n <span [class]=\"item.classList ? item.classList : ''\" >{{item.symbol}}</span>\r\n }\r\n </a>\r\n }\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'checkbox') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n <mat-checkbox [checked]=\"element[item.name] === 1\" [disabled]=\"true\"></mat-checkbox>\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'icon') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n @if (item.icon) {\r\n <mat-icon [class]=\"item.classList ? item.classList : ''\" >{{item.icon}}</mat-icon>\r\n } \r\n @if (item.symbol) {\r\n <span [class]=\"item.classList ? item.classList : ''\" >{{item.symbol}}</span>\r\n }\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'icons') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\">\r\n @if (item.icons) {\r\n <mat-icon [class]=\"item.classList ? item.classList[element[item.name]] : ''\" \r\n [matTooltip]=\"item.tooltips ? item.tooltips[element[item.name]] : ''\">{{item.icons[element[item.name]]}}</mat-icon>\r\n } \r\n @if (item.symbols) {\r\n <span [class]=\"item.classList ? item.classList[element[item.name]] : ''\" >{{item.symbols[element[item.name]]}}</span>\r\n }\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'actions') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\">\r\n @if (item.actions) {\r\n <div class=\"actions-container\">\r\n @for (action of item.actions; track action) {\r\n @if (!(action.hideFn ? action.hideFn(element) : action.hide)) {\r\n <button mat-icon-button\r\n (click)=\"action.onClickFn ? action.onClickFn(element) : ''\"\r\n (mousedown)=\"action.onClickMiddleFn ? action.onClickMiddleFn($event, element) : ''\"\r\n [disabled]=\"action.disabledFn ? action.disabledFn(element) : action.disabled\"\r\n [matTooltip]=\"action.tooltip ? action.tooltip : ''\" >\r\n @if (action.icon) {\r\n <mat-icon [class]=\"action.classList ? action.classList : ''\" >{{action.icon}}</mat-icon>\r\n }\r\n @if (action.symbol) {\r\n <span [class]=\"action.classList ? action.classList : ''\" >{{action.symbol}}</span>\r\n }\r\n {{ action.title }}\r\n </button>\r\n }\r\n }\r\n </div>\r\n } \r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'image') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n @if (item.imageUrl) {\r\n <img\r\n [src]=\"item.imageUrl\"\r\n [alt]=\"item.imageAlt ? item.imageAlt : ''\"\r\n [class]=\"item.classList ? item.classList : ''\"\r\n />\r\n } \r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n </ng-container>\r\n }\r\n\r\n <tr class=\"mat-row\" *matNoDataRow>\r\n <td class=\"mat-cell\" colspan=\"9999\">\r\n \u041D\u0435\u0442 \u0434\u0430\u043D\u043D\u044B\u0445 \u0434\u043B\u044F \u043E\u0442\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0438\u044F\r\n </td>\r\n </tr>\r\n\r\n <tr mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></tr>\r\n <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\" \r\n (click)=\"onRowClicked(row)\" (dblclick)=\"onRowDblClicked(row)\" \r\n class=\"element-row\" [class.selected-row]=\"selection.isSelected(row)\">\r\n </tr>\r\n @if (footer()) {\r\n <tr mat-footer-row *matFooterRowDef=\"displayedColumns; sticky: true\"></tr>\r\n }\r\n </table>\r\n <div style=\"visibility: hidden; position: fixed\"\r\n [style.left]=\"contextMenuPosition.x\"\r\n [style.top]=\"contextMenuPosition.y\"\r\n [matMenuTriggerFor]=\"contextMenu\" #menuTrigger=\"matMenuTrigger\">\r\n </div>\r\n <mat-menu #contextMenu=\"matMenu\">\r\n <ng-template matMenuContent let-id=\"id\">\r\n @for (menuItem of opt(); track menuItem) {\r\n @if (menuItem.title === '-' && !(menuItem.hideFn ? menuItem.hideFn(itemForMenu) : menuItem.hide)) {\r\n <mat-divider></mat-divider>\r\n }\r\n @if (menuItem.title !== '-' && !(menuItem.hideFn ? menuItem.hideFn(itemForMenu) : menuItem.hide)) {\r\n <button mat-menu-item\r\n (click)=\"menuItem.onClickFn ? menuItem.onClickFn(itemForMenu) : ''\"\r\n (mousedown)=\"menuItem.onClickMiddleFn ? menuItem.onClickMiddleFn($event, itemForMenu, menuTrigger) : ''\"\r\n [disabled]=\"menuItem.disabledFn ? menuItem.disabledFn(itemForMenu) : menuItem.disabled\">\r\n @if (menuItem.icon) {\r\n <mat-icon [class]=\"menuItem.classList ? menuItem.classList : ''\">{{menuItem.icon}}</mat-icon>\r\n }\r\n @if (menuItem.symbol) {\r\n <span [class]=\"menuItem.classList ? menuItem.classList : ''\">{{menuItem.symbol}}</span>\r\n }\r\n {{ menuItem.title }}\r\n </button>\r\n }\r\n }\r\n </ng-template>\r\n </mat-menu>\r\n</div>\r\n\r\n\r\n<mat-paginator [length]=\"length()\"\r\n [pageIndex]=\"pageState().pageIndex || defaultPageIndex\"\r\n [pageSizeOptions]=\"[5, 10, 20, 50, 100]\"\r\n [pageSize]=\"pageState().pageSize || defaultPageSize\"\r\n showFirstLastButtons\r\n itemsPerPageLabel=\"\"\r\n></mat-paginator>\r\n</div>\r\n", styles: [".component-container{display:flex;flex-direction:column;height:100%}.table-container{display:flex;flex-direction:column;justify-content:space-between;flex:auto;margin:0 20px;overflow:auto;height:400px}.center{position:absolute;inset:0 0 56px;background:#00000026;z-index:1;display:flex;align-items:center;justify-content:center}.mat-column-select{overflow:initial}tr.mat-footer-row{font-weight:700;height:56px}.mat-table{overflow-x:scroll}.mat-cell,.mat-header-cell{word-wrap:initial;display:table-cell;padding:0 10px;line-break:unset;white-space:nowrap;overflow:hidden;vertical-align:middle}.mat-row,.mat-header-row{display:table-row}tr.element-row:not(.selected-row):hover{background:#f5f5f5}tr.element-row:not(.selected-row):active{background:#efefef}.selected-row{background-color:#eee}.fact-done-row{background-color:#eefdec}a,a:visited,a:hover,a:active{color:inherit}.pre-wrap{white-space:pre-wrap}.actions-container{display:flex;column-gap:5px}\n"] }]
|
|
2234
|
+
MatFooterCellDef, MatFooterCell, MatTableModule, MatTooltipModule, MatIconButton], template: "<div class=\"component-container\">\r\n <div class=\"table-container\">\r\n <table mat-table [dataSource]=\"dataSource\"\r\n matSort\r\n [matSortActive]=\"sortState().sortActive || ''\"\r\n [matSortDirection]=\"sortState().sortDirection\"\r\n matSortDisableClear>\r\n\r\n <!-- \u0412\u044B\u0431\u043E\u0440 \u0441\u0442\u0440\u043E\u043A\u0438 Column -->\r\n <ng-container matColumnDef=\"select\">\r\n <th mat-header-cell *matHeaderCellDef>\r\n @if (allowMultiSelect()) {\r\n <mat-checkbox (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\"\r\n [indeterminate]=\"selection.hasValue() && !isAllSelected()\">\r\n </mat-checkbox>\r\n }\r\n </th>\r\n <td mat-cell *matCellDef=\"let row\">\r\n <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(row) : null\"\r\n [checked]=\"selection.isSelected(row)\">\r\n </mat-checkbox>\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef></td>\r\n }\r\n </ng-container>\r\n\r\n @for (item of columnOptions(); track item) {\r\n <ng-container matColumnDef={{item.name}}>\r\n <th mat-header-cell *matHeaderCellDef mat-sort-header [disabled]=\"item.titleSortDisable\">{{item.title}}</th>\r\n @if (!item.format) {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n {{element[item.name]}}\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footer) {\r\n <strong>{{ getTotal(item.name) }}</strong>\r\n }\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n } \r\n }\r\n @if (item.format === 'pre-wrap') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" class=\"pre-wrap\" [matTooltip]=\"item.tooltip ?? ''\">\r\n {{element[item.name]}}\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'link') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n <a [href]=\"element[item.name]\" target=\"_blank\">{{element[item.name]}}</a>\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'linkIcon') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n @if (element[item.name]) {\r\n <a [href]=\"element[item.name]\" target=\"_blank\">\r\n @if (item.icon) {\r\n <mat-icon [class]=\"item.classList ? item.classList : ''\" >{{item.icon}}</mat-icon>\r\n } \r\n @if (item.symbol) {\r\n <span [class]=\"item.classList ? item.classList : ''\" >{{item.symbol}}</span>\r\n }\r\n </a>\r\n }\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'routerLink') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n <a [routerLink]=\"[element[item.name]]\">{{element[item.name]}}</a>\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'routerLinkIcon') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n @if (element[item.name]) {\r\n <a [routerLink]=\"[element[item.name]]\">\r\n @if (item.icon) {\r\n <mat-icon [class]=\"item.classList ? item.classList : ''\" >{{item.icon}}</mat-icon>\r\n } \r\n @if (item.symbol) {\r\n <span [class]=\"item.classList ? item.classList : ''\" >{{item.symbol}}</span>\r\n }\r\n </a>\r\n }\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'checkbox') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n <mat-checkbox [checked]=\"element[item.name] === 1\" [disabled]=\"true\"></mat-checkbox>\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'icon') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n @if (item.icon) {\r\n <mat-icon [class]=\"item.classList ? item.classList : ''\" >{{item.icon}}</mat-icon>\r\n } \r\n @if (item.symbol) {\r\n <span [class]=\"item.classList ? item.classList : ''\" >{{item.symbol}}</span>\r\n }\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'icons') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\">\r\n @if (item.icons) {\r\n <mat-icon [class]=\"item.classList ? item.classList[element[item.name]] : ''\" \r\n [matTooltip]=\"item.tooltips ? item.tooltips[element[item.name]] : ''\">{{item.icons[element[item.name]]}}</mat-icon>\r\n } \r\n @if (item.symbols) {\r\n <span [class]=\"item.classList ? item.classList[element[item.name]] : ''\" >{{item.symbols[element[item.name]]}}</span>\r\n }\r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'actions') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\">\r\n @if (item.actions) {\r\n <div class=\"actions-container\">\r\n @for (action of item.actions; track action) {\r\n @if (!(action.hideFn ? action.hideFn(element) : action.hide)) {\r\n <button mat-icon-button\r\n (click)=\"action.onClickFn ? action.onClickFn(element) : ''\"\r\n (mousedown)=\"action.onClickMiddleFn ? action.onClickMiddleFn($event, element) : ''\"\r\n [disabled]=\"action.disabledFn ? action.disabledFn(element) : action.disabled\"\r\n [matTooltip]=\"action.tooltip ? action.tooltip : ''\" >\r\n @if (action.icon) {\r\n <mat-icon [class]=\"action.classList ? action.classList : ''\" >{{action.icon}}</mat-icon>\r\n }\r\n @if (action.symbol) {\r\n <span [class]=\"action.classList ? action.classList : ''\" >{{action.symbol}}</span>\r\n }\r\n {{ action.title }}\r\n </button>\r\n }\r\n }\r\n </div>\r\n } \r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n @if (item.format === 'image') {\r\n <td mat-cell *matCellDef=\"let element\" (contextmenu)=\"onContextMenu($event, element)\" [matTooltip]=\"item.tooltip ?? ''\">\r\n @if (element[item.name]) {\r\n <img\r\n [src]=\"element[item.name]\"\r\n [alt]=\"item.imageAlt && element[item.imageAlt] ? element[item.imageAlt] : ''\"\r\n [class]=\"item.classList ? item.classList : ''\"\r\n />\r\n } \r\n </td>\r\n @if (footer()) {\r\n <td mat-footer-cell *matFooterCellDef>\r\n @if (item.footerTitle) {\r\n <strong>{{ item.footerTitle }}</strong>\r\n }\r\n </td>\r\n }\r\n }\r\n </ng-container>\r\n }\r\n\r\n <tr class=\"mat-row\" *matNoDataRow>\r\n <td class=\"mat-cell\" colspan=\"9999\">\r\n \u041D\u0435\u0442 \u0434\u0430\u043D\u043D\u044B\u0445 \u0434\u043B\u044F \u043E\u0442\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0438\u044F\r\n </td>\r\n </tr>\r\n\r\n <tr mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></tr>\r\n <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\" \r\n (click)=\"onRowClicked(row)\" (dblclick)=\"onRowDblClicked(row)\" \r\n class=\"element-row\" [class.selected-row]=\"selection.isSelected(row)\">\r\n </tr>\r\n @if (footer()) {\r\n <tr mat-footer-row *matFooterRowDef=\"displayedColumns; sticky: true\"></tr>\r\n }\r\n </table>\r\n <div style=\"visibility: hidden; position: fixed\"\r\n [style.left]=\"contextMenuPosition.x\"\r\n [style.top]=\"contextMenuPosition.y\"\r\n [matMenuTriggerFor]=\"contextMenu\" #menuTrigger=\"matMenuTrigger\">\r\n </div>\r\n <mat-menu #contextMenu=\"matMenu\">\r\n <ng-template matMenuContent let-id=\"id\">\r\n @for (menuItem of opt(); track menuItem) {\r\n @if (menuItem.title === '-' && !(menuItem.hideFn ? menuItem.hideFn(itemForMenu) : menuItem.hide)) {\r\n <mat-divider></mat-divider>\r\n }\r\n @if (menuItem.title !== '-' && !(menuItem.hideFn ? menuItem.hideFn(itemForMenu) : menuItem.hide)) {\r\n <button mat-menu-item\r\n (click)=\"menuItem.onClickFn ? menuItem.onClickFn(itemForMenu) : ''\"\r\n (mousedown)=\"menuItem.onClickMiddleFn ? menuItem.onClickMiddleFn($event, itemForMenu, menuTrigger) : ''\"\r\n [disabled]=\"menuItem.disabledFn ? menuItem.disabledFn(itemForMenu) : menuItem.disabled\">\r\n @if (menuItem.icon) {\r\n <mat-icon [class]=\"menuItem.classList ? menuItem.classList : ''\">{{menuItem.icon}}</mat-icon>\r\n }\r\n @if (menuItem.symbol) {\r\n <span [class]=\"menuItem.classList ? menuItem.classList : ''\">{{menuItem.symbol}}</span>\r\n }\r\n {{ menuItem.title }}\r\n </button>\r\n }\r\n }\r\n </ng-template>\r\n </mat-menu>\r\n</div>\r\n\r\n\r\n<mat-paginator [length]=\"length()\"\r\n [pageIndex]=\"pageState().pageIndex || defaultPageIndex\"\r\n [pageSizeOptions]=\"[5, 10, 20, 50, 100]\"\r\n [pageSize]=\"pageState().pageSize || defaultPageSize\"\r\n showFirstLastButtons\r\n itemsPerPageLabel=\"\"\r\n></mat-paginator>\r\n</div>\r\n", styles: [".component-container{display:flex;flex-direction:column;height:100%}.table-container{display:flex;flex-direction:column;justify-content:space-between;flex:auto;margin:0 20px;overflow:auto;height:400px}.center{position:absolute;inset:0 0 56px;background:#00000026;z-index:1;display:flex;align-items:center;justify-content:center}.mat-column-select{overflow:initial}tr.mat-footer-row{font-weight:700;height:56px}.mat-table{overflow-x:scroll}.mat-cell,.mat-header-cell{word-wrap:initial;display:table-cell;padding:0 10px;line-break:unset;white-space:nowrap;overflow:hidden;vertical-align:middle}.mat-row,.mat-header-row{display:table-row}tr.element-row:not(.selected-row):hover{background:#f5f5f5}tr.element-row:not(.selected-row):active{background:#efefef}.selected-row{background-color:#eee}.fact-done-row{background-color:#eefdec}a,a:visited,a:hover,a:active{color:inherit}.pre-wrap{white-space:pre-wrap}.actions-container{display:flex;column-gap:5px}\n"] }]
|
|
2263
2235
|
}], ctorParameters: () => [], propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], length: [{ type: i0.Input, args: [{ isSignal: true, alias: "length", required: false }] }], columnOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "columnOptions", required: false }] }], tableState: [{ type: i0.Input, args: [{ isSignal: true, alias: "tableState", required: true }] }], allowMultiSelect: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowMultiSelect", required: false }] }], opt: [{ type: i0.Input, args: [{ isSignal: true, alias: "opt", required: false }] }], rowDblClickedDisable: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowDblClickedDisable", required: false }] }], footer: [{ type: i0.Input, args: [{ isSignal: true, alias: "footer", required: false }] }], pageStateChange: [{ type: i0.Output, args: ["pageStateChange"] }], sortStateChange: [{ type: i0.Output, args: ["sortStateChange"] }], selectionChange: [{ type: i0.Output, args: ["selectionChange"] }], rowDoubleClicked: [{ type: i0.Output, args: ["rowDoubleClicked"] }], sort: [{ type: i0.ViewChild, args: [i0.forwardRef(() => MatSort), { isSignal: true }] }], paginator: [{ type: i0.ViewChild, args: [i0.forwardRef(() => MatPaginator), { isSignal: true }] }], contextMenu: [{ type: i0.ViewChild, args: [i0.forwardRef(() => MatMenuTrigger), { isSignal: true }] }] } });
|
|
2264
2236
|
|
|
2265
2237
|
/*
|