@inspark/inspark-components 19.0.11 → 19.0.13
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/full/components/table/table.component.d.ts +3 -2
- package/full/components/table/table.component.d.ts.map +1 -1
- package/full/components/tree-table/tree-table.component.d.ts +19 -4
- package/full/components/tree-table/tree-table.component.d.ts.map +1 -1
- package/full/fesm2022/inspark-inspark-components.mjs +236 -110
- package/full/fesm2022/inspark-inspark-components.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -1337,6 +1337,22 @@ class TableComponent {
|
|
|
1337
1337
|
}
|
|
1338
1338
|
}
|
|
1339
1339
|
}
|
|
1340
|
+
ngAfterContentInit() {
|
|
1341
|
+
this.templates.forEach((item) => {
|
|
1342
|
+
switch (item.getType()) {
|
|
1343
|
+
case 'value':
|
|
1344
|
+
this.valueTemplate = item.template;
|
|
1345
|
+
break;
|
|
1346
|
+
case 'header':
|
|
1347
|
+
this.headerTemplate = item.template;
|
|
1348
|
+
break;
|
|
1349
|
+
case 'body':
|
|
1350
|
+
this.bodyTemplate = item.template;
|
|
1351
|
+
break;
|
|
1352
|
+
// добавьте другие типы по необходимости
|
|
1353
|
+
}
|
|
1354
|
+
});
|
|
1355
|
+
}
|
|
1340
1356
|
/** O(1) check used in template instead of dt.isSelected() */
|
|
1341
1357
|
_isRowSelected(row) {
|
|
1342
1358
|
const key = this.dataKey || 'id';
|
|
@@ -1647,11 +1663,11 @@ class TableComponent {
|
|
|
1647
1663
|
i0.ɵɵproperty("ngIf", !ctx.bodyTemplate);
|
|
1648
1664
|
i0.ɵɵadvance();
|
|
1649
1665
|
i0.ɵɵproperty("ngIf", ctx.toolbar);
|
|
1650
|
-
} }, dependencies: () => [i1$2.NgClass, i1$2.NgForOf, i1$2.NgIf, i1$2.NgTemplateOutlet, i1$2.NgSwitch, i1$2.NgSwitchCase, i2$2.Table, i2.PrimeTemplate, i2$2.SortableColumn, i2$2.SelectableRow, i2$2.ResizableColumn, i2$2.SortIcon, i2$1.ɵNgNoValidate, i2$1.DefaultValueAccessor, i2$1.NgControlStatus, i2$1.NgControlStatusGroup, i2$1.RequiredValidator, i2$1.NgModel, i2$1.NgForm, i5.Dropdown, i6.MultiSelect, i7.NgbDropdown, i7.NgbDropdownToggle, i7.NgbDropdownMenu, i7.NgbDropdownItem, TableColumnsMultiselectComponent, PropertyValuePipe, i1.TranslatePipe], styles: ["@charset \"UTF-8\";.u-overflow-visible[_ngcontent-%COMP%]{overflow:visible!important}.row_status_success[_ngcontent-%COMP%]{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-success, #31AC51)}.row_status_error[_ngcontent-%COMP%]{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-error, #F95C5D)}.row_status_warning[_ngcontent-%COMP%]{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-warning, #EE9946)}.row_status_critical[_ngcontent-%COMP%]{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-critical, #F95C5D)}.row_status_falsevalue[_ngcontent-%COMP%]{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-falsevalue, #85B3CB)}.row_status_disabled[_ngcontent-%COMP%]{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-disabled)}.row_status_none[_ngcontent-%COMP%]{padding-left:9px!important;border-left:4px solid transparent}.row_status_pending[_ngcontent-%COMP%]{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-pending, #1f85ff)}.button-reset[_ngcontent-%COMP%]{display:flex;align-items:center;position:absolute;right:6px;top:5px;padding:6px;font-size:15px;border:none;outline:0;cursor:pointer;color:var(--colorTextMuted);background-color:transparent}.button-reset[_ngcontent-%COMP%]:hover{color:var(--ids-theme-btn-default-color, #FFFFFF)}.input-wrapper[_ngcontent-%COMP%]{position:relative;display:flex;align-items:baseline}.c-input[_ngcontent-%COMP%]:not(:valid) ~ .button-reset[_ngcontent-%COMP%]{display:none}.in-table-checkbox[_ngcontent-%COMP%]{appearance:none;-webkit-appearance:none;width:var(--p-checkbox-width, 20px);height:var(--p-checkbox-height, 20px);border:1px solid var(--p-checkbox-border-color, #B3B3B3);border-radius:var(--p-checkbox-border-radius, 2px);background:var(--p-checkbox-background, transparent);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;flex-shrink:0;transition:border-color var(--p-checkbox-transition-duration, .15s),background var(--p-checkbox-transition-duration, .15s)}.in-table-checkbox[_ngcontent-%COMP%]:checked{background:var(--p-checkbox-checked-background, #387382);border-color:var(--p-checkbox-checked-border-color, #387382)}.in-table-checkbox[_ngcontent-%COMP%]:checked:after{content:\"\";display:block;width:var(--p-checkbox-icon-size, 14px);height:var(--p-checkbox-icon-size, 14px);background-color:var(--p-checkbox-icon-checked-color, #ffffff);mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath fill='currentColor' d='M5.25 10.15l-2.8-2.8-.7.7 3.5 3.5 7.5-7.5-.7-.7z'/%3E%3C/svg%3E\");-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath fill='currentColor' d='M5.25 10.15l-2.8-2.8-.7.7 3.5 3.5 7.5-7.5-.7-.7z'/%3E%3C/svg%3E\");mask-size:contain;-webkit-mask-size:contain;mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;mask-position:center;-webkit-mask-position:center}.in-table-checkbox[_ngcontent-%COMP%]:hover:not(:checked){border-color:var(--p-checkbox-hover-border-color, #999999)}"] }); }
|
|
1666
|
+
} }, dependencies: () => [i1$2.NgClass, i1$2.NgForOf, i1$2.NgIf, i1$2.NgTemplateOutlet, i1$2.NgSwitch, i1$2.NgSwitchCase, i2$2.Table, i2.PrimeTemplate, i2$2.SortableColumn, i2$2.SelectableRow, i2$2.ResizableColumn, i2$2.SortIcon, i2$1.ɵNgNoValidate, i2$1.DefaultValueAccessor, i2$1.NgControlStatus, i2$1.NgControlStatusGroup, i2$1.RequiredValidator, i2$1.NgModel, i2$1.NgForm, i5.Dropdown, i6.MultiSelect, i7.NgbDropdown, i7.NgbDropdownToggle, i7.NgbDropdownMenu, i7.NgbDropdownItem, TableColumnsMultiselectComponent, PropertyValuePipe, i1.TranslatePipe], styles: ["@charset \"UTF-8\";.u-overflow-visible[_ngcontent-%COMP%]{overflow:visible!important}.row_status_success[_ngcontent-%COMP%]{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-success, #31AC51)}.row_status_error[_ngcontent-%COMP%]{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-error, #F95C5D)}.row_status_warning[_ngcontent-%COMP%]{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-warning, #EE9946)}.row_status_critical[_ngcontent-%COMP%]{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-critical, #F95C5D)}.row_status_falsevalue[_ngcontent-%COMP%]{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-falsevalue, #85B3CB)}.row_status_disabled[_ngcontent-%COMP%]{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-disabled)}.row_status_none[_ngcontent-%COMP%]{padding-left:9px!important;border-left:4px solid transparent}.row_status_pending[_ngcontent-%COMP%]{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-pending, #1f85ff)}.button-reset[_ngcontent-%COMP%]{display:flex;align-items:center;position:absolute;right:6px;top:5px;padding:6px;font-size:15px;border:none;outline:0;cursor:pointer;color:var(--colorTextMuted);background-color:transparent}.button-reset[_ngcontent-%COMP%]:hover{color:var(--ids-theme-btn-default-color, #FFFFFF)}.input-wrapper[_ngcontent-%COMP%]{position:relative;display:flex;align-items:baseline}.c-input[_ngcontent-%COMP%]:not(:valid) ~ .button-reset[_ngcontent-%COMP%]{display:none}.theme-light[_nghost-%COMP%] .in-table-checkbox[_ngcontent-%COMP%], .theme-light [_nghost-%COMP%] .in-table-checkbox[_ngcontent-%COMP%], .theme-contrast[_nghost-%COMP%] .in-table-checkbox[_ngcontent-%COMP%], .theme-contrast [_nghost-%COMP%] .in-table-checkbox[_ngcontent-%COMP%]{border-color:#00000073}.theme-light[_nghost-%COMP%] .in-table-checkbox[_ngcontent-%COMP%]:hover:not(:checked):not(:indeterminate), .theme-light [_nghost-%COMP%] .in-table-checkbox[_ngcontent-%COMP%]:hover:not(:checked):not(:indeterminate), .theme-contrast[_nghost-%COMP%] .in-table-checkbox[_ngcontent-%COMP%]:hover:not(:checked):not(:indeterminate), .theme-contrast [_nghost-%COMP%] .in-table-checkbox[_ngcontent-%COMP%]:hover:not(:checked):not(:indeterminate){border-color:#000000b3}.in-table-checkbox[_ngcontent-%COMP%]{appearance:none;-webkit-appearance:none;width:var(--p-checkbox-width, 20px);height:var(--p-checkbox-height, 20px);border:1px solid var(--p-checkbox-border-color, #B3B3B3);border-radius:var(--p-checkbox-border-radius, 2px);background:var(--p-checkbox-background, transparent);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;flex-shrink:0;transition:border-color var(--p-checkbox-transition-duration, .15s),background var(--p-checkbox-transition-duration, .15s)}.in-table-checkbox[_ngcontent-%COMP%]:checked{background:var(--p-checkbox-checked-background, #387382);border-color:var(--p-checkbox-checked-border-color, #387382)}.in-table-checkbox[_ngcontent-%COMP%]:checked:after{content:\"\";display:block;width:var(--p-checkbox-icon-size, 14px);height:var(--p-checkbox-icon-size, 14px);background-color:var(--p-checkbox-icon-checked-color, #ffffff);mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath fill='currentColor' d='M5.25 10.15l-2.8-2.8-.7.7 3.5 3.5 7.5-7.5-.7-.7z'/%3E%3C/svg%3E\");-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath fill='currentColor' d='M5.25 10.15l-2.8-2.8-.7.7 3.5 3.5 7.5-7.5-.7-.7z'/%3E%3C/svg%3E\");mask-size:contain;-webkit-mask-size:contain;mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;mask-position:center;-webkit-mask-position:center}.in-table-checkbox[_ngcontent-%COMP%]:indeterminate{background:var(--p-checkbox-checked-background, #387382);border-color:var(--p-checkbox-checked-border-color, #387382)}.in-table-checkbox[_ngcontent-%COMP%]:indeterminate:after{content:\"\";display:block;width:calc(var(--p-checkbox-icon-size, 14px) - 2px);height:2px;background-color:var(--p-checkbox-icon-checked-color, #ffffff);margin:auto}.in-table-checkbox[_ngcontent-%COMP%]:hover:not(:checked):not(:indeterminate){border-color:var(--p-checkbox-hover-border-color, #999999)}"] }); }
|
|
1651
1667
|
}
|
|
1652
1668
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TableComponent, [{
|
|
1653
1669
|
type: Component,
|
|
1654
|
-
args: [{ standalone: false, selector: 'in-table', providers: [TableService], template: "<span *ngIf=\"label\" class=\"c-label\">\r\n {{label}}\r\n <span *ngIf=\"required\" class=\"c-label__req\">*</span>\r\n <span *ngIf=\"error\" class=\"c-label__sub_is-error\">{{error}}</span>\r\n</span>\r\n<p-table #dt\r\n (onFilter) = onFilter($event)\r\n (onSort)=\"onSort()\"\r\n (onStateRestore)=\"restoreSearchText()\"\r\n (onStateSave)=\"stateSave($event)\"\r\n (sortFunction)=\"sortFunction? sortFunction.emit($event): null\"\r\n [(selection)]=\"selectionValue\"\r\n [class]=\"class\"\r\n [columns]=\"filteredColumns\"\r\n [customSort]=\"customSort\"\r\n [dataKey]=\"dataKey || 'id'\"\r\n [globalFilterFields]=\"globalFilteredColumns\"\r\n [resizableColumns]=\"resizableColumns\"\r\n [scrollHeight]=\"scrollHeight\"\r\n [scrollable]=\"scrollable\"\r\n [selectionMode]=\"selectionMode\"\r\n [sortField]=\"sortField || 'id'\"\r\n [sortOrder]=\"isAscending ? 1 : -1\"\r\n [stateKey]=\"stateKey\"\r\n [stateStorage]=\"'local'\"\r\n [style]=\"style\"\r\n [value]=\"values\"\r\n [columnResizeMode]=\"columnResizeMode\"\r\n>\r\n <ng-template *ngIf=\"colGroupTemplate\" let-columns pTemplate=\"colgroup\">\r\n <ng-container\r\n *ngTemplateOutlet=\"colGroupTemplate; context: {$implicit: { columns: columns}}\"></ng-container>\r\n </ng-template>\r\n\r\n <ng-template *ngIf=\"!colGroupTemplate\" let-columns pTemplate=\"colgroup\">\r\n <colgroup *ngIf=\"!isMobileView\">\r\n <col *ngIf=\"checkboxSelection\" style=\"width: 44px;\">\r\n <col *ngFor=\"let col of filteredColumns; let idx = index\">\r\n </colgroup>\r\n </ng-template>\r\n\r\n <ng-template let-columns pTemplate=\"header\">\r\n <ng-container *ngIf=\"showHeader\">\r\n <tr>\r\n <th *ngIf=\"checkboxSelection\" class=\"u-position-relative u-text_center\" pResizableColumn style=\"width: 44px;\">\r\n <!-- Native header checkbox bypasses dt.processedData (O(N log N) sort) used\r\n by p-tableHeaderCheckbox.toggleRowsWithCheckbox() on select all. -->\r\n <input type=\"checkbox\"\r\n class=\"in-table-checkbox\"\r\n [checked]=\"_isAllSelected()\"\r\n (change)=\"_onHeaderCheckboxChange($event)\"\r\n (click)=\"$event.stopPropagation()\"\r\n >\r\n </th>\r\n <th *ngFor=\"let col of filteredColumns\" [pSortableColumn]=\"col.field\" class=\"u-position-relative\"\r\n pResizableColumn>\r\n <div class=\"p-table-thead-title\"\r\n title=\"{{col.label | translate}}\">\r\n {{col.label | translate}}\r\n </div>\r\n <p-sortIcon *ngIf=\"isSortIcon\" [field]=\"col.field\"\r\n class=\"u-position-absolute u-position-absolute-right c-sorticon\"\r\n style=\"display: flex; width: 18px; top: 0; height: 100%;\"></p-sortIcon>\r\n </th>\r\n </tr>\r\n <tr *ngIf=\"toolbar && toolbar.filter && toolbar.filter.active\">\r\n <th *ngIf=\"checkboxSelection\" class=\"u-position-relative u-text_center\" pResizableColumn\r\n style=\"width: 44px;\"></th>\r\n <th *ngFor=\"let col of columns\" [ngSwitch]=\"col.field\">\r\n <input\r\n (input)=\"dt.filter($any($event.target).value, col.field, 'contains')\"\r\n *ngSwitchCase=\"colFilter(col.field)?.type === 'text' ? col.field : ''\"\r\n autofocus=\"\"\r\n class=\"c-input c-input_small ng-pristine ng-valid ng-scope ng-empty ng-touched\"\r\n pInputText\r\n type=\"text\">\r\n\r\n <p-dropdown (onChange)=\"dt.filter($event.value, col.field, 'equals')\"\r\n *ngSwitchCase=\"colFilter(col.field)?.type === 'dropdown' ? col.field : ''\"\r\n [options]=\"colFilter(col.field)?.options\"\r\n [style]=\"{ width: '100%', overflow: 'visible' }\"\r\n appendTo=\"body\"></p-dropdown>\r\n\r\n <p-multiSelect (onChange)=\"dt.filter($event.value, col.field, 'in')\"\r\n *ngSwitchCase=\"colFilter(col.field)?.type === 'multiselect' ? col.field : ''\"\r\n [options]=\"colFilter(col.field)?.options\"\r\n [style]=\"{ width: '100%', overflow: 'visible' }\" appendTo=\"body\"\r\n defaultLabel=\"{{'All' | translate}}\"></p-multiSelect>\r\n <input\r\n (input)=\"dt.filter($any($event.target).value, col.field + '2filter', 'contains')\"\r\n *ngSwitchCase=\"colFilter(col.field)?.type === 'datetext' ? col.field : ''\"\r\n autofocus=\"\"\r\n class=\"c-input c-input_small ng-pristine ng-valid ng-scope ng-empty ng-touched\"\r\n pInputText\r\n type=\"text\">\r\n </th>\r\n </tr>\r\n </ng-container>\r\n </ng-template>\r\n\r\n <ng-template *ngIf=\"bodyTemplate\" let-columns=\"columns\" let-rowData let-rowIndex=\"rowIndex\" pTemplate=\"body\">\r\n <ng-container\r\n *ngTemplateOutlet=\"bodyTemplate; context: {$implicit: { rowIndex: rowIndex, rowData: rowData, columns: columns}}\"></ng-container>\r\n </ng-template>\r\n\r\n <ng-template *ngIf=\"!bodyTemplate\" let-columns=\"columns\" let-index=\"rowIndex\" let-rowData pTemplate=\"body\">\r\n <tr\r\n (click)=\"toggleGroup(index, rowData.groupKey[groupMode])\"\r\n *ngIf=\"isGrouped && isShowGroup(rowData.groupKey[groupMode], index)\"\r\n class=\"row_hover_highlight\">\r\n <td [colSpan]=\"countVisibleColumns() + 1\">\r\n <span>\r\n <i\r\n [ngClass]=\"groupInfo[rowData.groupKey[groupMode]].isExpanded ? 'in fa-fw in-chevron-down' : 'in fa-fw in-chevron-right'\"></i>\r\n <span>{{rowData.groupKey[groupMode] | translate }} ({{countGroup(rowData.groupKey[groupMode], groupMode)}}\r\n )</span>\r\n </span>\r\n </td>\r\n </tr>\r\n <tr *ngIf=\"!isGrouped || groupInfo[(rowData.groupKey[groupMode])].isExpanded\"\r\n [ngClass]=\"{row_active: isRowActive(rowData)}\"\r\n [pSelectableRow]=\"rowData\"\r\n class=\"row\">\r\n <td *ngIf=\"checkboxSelection\" [ngClass]=\"{\r\n 'row_status_success': rowData.sdirparamstatecolor === 'success',\r\n 'row_status_error': rowData.sdirparamstatecolor === 'error',\r\n 'row_status_warning': rowData.sdirparamstatecolor === 'warning',\r\n 'row_status_critical': rowData.sdirparamstatecolor === 'critical',\r\n 'row_status_falsevalue': rowData.sdirparamstatecolor === 'falsevalue',\r\n 'row_status_pending': rowData.sdirparamstatecolor === 'pending'\r\n }\" class=\"u-text_center\"\r\n style=\"width: 44px\"\r\n >\r\n <!-- Native checkbox \u2014 no Angular component overhead (no NgModel/CVA/signals).\r\n Uses Set for O(1) state lookup instead of p-tableCheckbox's O(M) isSelected(). -->\r\n <input type=\"checkbox\"\r\n class=\"in-table-checkbox\"\r\n [checked]=\"_isRowSelected(rowData)\"\r\n [style.pointer-events]=\"(selectionMode === 'single' || (selectionMode === 'multiple' && checkboxSelection)) ? 'none' : 'auto'\"\r\n (change)=\"_onCheckboxChange($event, rowData)\"\r\n (click)=\"$event.stopPropagation()\"\r\n >\r\n </td>\r\n <td (click)=\"activeChange.emit(rowData)\"\r\n *ngFor=\"let col of filteredColumns\"\r\n class=\"u-overflow-visible\">\r\n <div (mouseover)=\"showTooltip($event)\" *ngIf=\"!valueTemplate\" class=\"p-table-tbody-content\" title>\r\n {{col.translatable ? (rowData | propertyValue: col.field | translate) : (rowData | propertyValue: col.field)}}\r\n </div>\r\n <ng-container\r\n *ngTemplateOutlet=\"valueTemplate; context: {$implicit: { data: rowData, col: col}}\"></ng-container>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n\r\n <ng-template *ngIf=\"toolbar\" pTemplate=\"caption\">\r\n\r\n <div class=\"o-grid o-grid_no-gutter\">\r\n <div class=\"c-tree-table__toolbar-content u-display-inline-flex\">\r\n <div *ngIf=\"isTextSearch\" class=\"c-form c-form_inline u-display-inline-block\">\r\n <form class=\"c-label\">\r\n <div class=\"input-wrapper u-margin-right-tiny\">\r\n <input #searchTextInput\r\n (input)=\"localSearch(dt, searchText)\"\r\n [(ngModel)]=\"searchText\"\r\n [ngModelOptions]=\"{standalone: true}\"\r\n autofocus=\"\"\r\n class=\"search-box c-input c-input_small ng-pristine ng-valid ng-scope ng-empty ng-touched\"\r\n pInputText\r\n placeholder=\"{{('SHARED.SEARCH' | translate) + ':'}}\"\r\n required\r\n style=\"padding-right: 28px\"\r\n tabindex=\"1\"\r\n type=\"search\"\r\n >\r\n <button (click)=\"clear()\" class=\"button-reset\" type=\"reset\"\r\n [attr.title]=\"'Reset' | translate\">\r\n <i class=\"in in-close\"></i>\r\n </button>\r\n </div>\r\n </form>\r\n </div>\r\n <div class=\"c-btn c-btn_border-free c-btn_small\">\r\n <in-table-columns-multiselect (columnsChange)=\"columnsChange($event)\"\r\n [columns]=\"primaryColumns\"\r\n [disableActiveCheckboxes]=\"countVisibleColumns() === 1\"></in-table-columns-multiselect>\r\n </div>\r\n\r\n <button (click)=\"onFilterToolbar($event)\" *ngIf=\"toolbar.filter\"\r\n class=\"c-btn c-btn_border-free c-btn_small\"\r\n >\r\n <i class=\"in in-filter\" title=\"{{'Service filter' | translate}}\"></i>\r\n </button>\r\n\r\n <button (click)=\"treeAction.emit($event)\" *ngIf=\"toolbar.tree\" [disabled]=\"toolbar.tree.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\"\r\n >\r\n <i class=\"in in-list\" title=\"{{'Filter by rubric' | translate}}\"></i>\r\n </button>\r\n\r\n <button (click)=\"addAction.emit($event)\" *ngIf=\"toolbar.add\" [disabled]=\"toolbar.add.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\"\r\n >\r\n <i class=\"in in-plus\" title=\"{{'Add' | translate}}\"></i>\r\n </button>\r\n\r\n <button (click)=\"linkAction.emit($event)\" *ngIf=\"toolbar.link\" [disabled]=\"toolbar.link.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\"\r\n >\r\n <i class=\"in in-link\" title=\"{{'Link' | translate}}\"></i>\r\n </button>\r\n <button (click)=\"csvAction.emit($event)\" *ngIf=\"toolbar.csv\" [disabled]=\"toolbar.csv.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\"\r\n >\r\n <!--Todo: \u0437\u0430\u043C\u0435\u043D\u0438\u0442\u044C \u043D\u0430 in-file-csv-->\r\n <i class=\"in in-file-excel-outline\" title=\"{{'LOGS.SAVE_TO_CSV' | translate}}\"></i>\r\n </button>\r\n <button (click)=\"saveAction.emit($event)\" *ngIf=\"toolbar.save\"\r\n [disabled]=\"toolbar.save.disabled\"\r\n class=\"c-btn c-btn_primary c-btn_small\"\r\n title=\"{{'Save' | translate}}\"\r\n >\r\n {{'Save' | translate}}\r\n </button>\r\n <button (click)=\"groupEditAction.emit($event)\" *ngIf=\"toolbar.groupEdit && toolbar.groupEdit.active\"\r\n [disabled]=\"toolbar.groupEdit.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\">\r\n <i class=\"in in-pencil\" title=\"{{'groupEdit' | translate}}\"></i>\r\n </button>\r\n <ng-content select=\"[buttons]\"></ng-content>\r\n <button (click)=\"paramsEditAction.emit($event)\" *ngIf=\"toolbar.paramsEdit && toolbar.paramsEdit.active\"\r\n [disabled]=\"toolbar.paramsEdit.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\">\r\n <i class=\"in in-pencil\" title=\"{{'paramsEdit' | translate}}\"></i>\r\n </button>\r\n\r\n\r\n <button (click)=\"removeAction.emit($event)\" *ngIf=\"toolbar.remove && toolbar.remove.active\"\r\n [disabled]=\"toolbar.remove.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\">\r\n <i class=\"in in-trash\" title=\"{{'Delete' | translate}}\"></i>\r\n </button>\r\n <button (click)=\"unlinkAction.emit($event)\" *ngIf=\"toolbar.unlink\" [disabled]=\"toolbar.unlink.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\">\r\n <i class=\"in in-link-off\" title=\"{{'Detach tag from selected items' | translate}}\"></i>\r\n </button>\r\n <button (click)=\"toggleNodes(true)\"\r\n *ngIf=\"toolbar.expandAll\"\r\n class=\"c-btn c-btn_small c-btn_svg-24 c-icon c-icon_svg c-icon_svg-24 c-btn_border-free\"\r\n title=\"{{'Expand all' | translate}}\">\r\n <svg fill=\"currentColor\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M20 2H4v2h16V2zM4 20v2h16v-2H4zM12 5l5 6H7l5-6zM17 13l-5 6-5-6h10z\"/>\r\n </svg>\r\n </button>\r\n <button (click)=\"toggleNodes(false)\"\r\n *ngIf=\"toolbar.expandAll\"\r\n class=\"c-btn c-btn_small c-btn_svg-24 c-icon c-icon_svg c-icon_svg-24 c-btn_border-free\"\r\n title=\"{{'Collapse all' | translate}}\">\r\n <svg fill=\"currentColor\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path clip-rule=\"evenodd\" d=\"M17 3l-5 6-5-6h10zM4 13v-2h16v2H4zm8 2l5 6H7l5-6z\" fill-rule=\"evenodd\"/>\r\n </svg>\r\n </button>\r\n\r\n <div *ngIf=\"toolbar.groupSort\"\r\n class=\"c-btn-group\"\r\n container=\"body\"\r\n ngbDropdown>\r\n\r\n <button class=\"c-btn c-btn_border-free c-btn_small\"\r\n id=\"dropdownGroupType\"\r\n ngbDropdownToggle\r\n title=\"{{'Change the way parameters are grouped' | translate}}\">\r\n <i aria-hidden=\"true\" class=\"in in-object-group\"></i>\r\n <i aria-hidden=\"true\" class=\"c-caret\"></i>\r\n </button>\r\n\r\n <ul aria-labelledby=\"dropdownGroupType\"\r\n class=\"c-dropdown-menu c-dropdown-menu_right ng-star-inserted\"\r\n ngbDropdownMenu\r\n role=\"menu\">\r\n <li *ngFor=\"let item of toolbar.groupSort.label\"\r\n [ngClass]=\"{'is-dropdown-menu__listitem_active': item.value === groupMode}\"\r\n class=\"c-dropdown-menu__listitem is-dropdown-menu__listitem_active\"\r\n ngbDropdownItem\r\n role=\"menuitem\">\r\n <a (click)=\"toggleMode(item.value)\" class=\"c-dropdown-menu__content\">\r\n {{item.label}}\r\n </a>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-template>\r\n</p-table>\r\n", styles: ["@charset \"UTF-8\";.u-overflow-visible{overflow:visible!important}.row_status_success{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-success, #31AC51)}.row_status_error{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-error, #F95C5D)}.row_status_warning{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-warning, #EE9946)}.row_status_critical{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-critical, #F95C5D)}.row_status_falsevalue{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-falsevalue, #85B3CB)}.row_status_disabled{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-disabled)}.row_status_none{padding-left:9px!important;border-left:4px solid transparent}.row_status_pending{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-pending, #1f85ff)}.button-reset{display:flex;align-items:center;position:absolute;right:6px;top:5px;padding:6px;font-size:15px;border:none;outline:0;cursor:pointer;color:var(--colorTextMuted);background-color:transparent}.button-reset:hover{color:var(--ids-theme-btn-default-color, #FFFFFF)}.input-wrapper{position:relative;display:flex;align-items:baseline}.c-input:not(:valid)~.button-reset{display:none}.in-table-checkbox{appearance:none;-webkit-appearance:none;width:var(--p-checkbox-width, 20px);height:var(--p-checkbox-height, 20px);border:1px solid var(--p-checkbox-border-color, #B3B3B3);border-radius:var(--p-checkbox-border-radius, 2px);background:var(--p-checkbox-background, transparent);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;flex-shrink:0;transition:border-color var(--p-checkbox-transition-duration, .15s),background var(--p-checkbox-transition-duration, .15s)}.in-table-checkbox:checked{background:var(--p-checkbox-checked-background, #387382);border-color:var(--p-checkbox-checked-border-color, #387382)}.in-table-checkbox:checked:after{content:\"\";display:block;width:var(--p-checkbox-icon-size, 14px);height:var(--p-checkbox-icon-size, 14px);background-color:var(--p-checkbox-icon-checked-color, #ffffff);mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath fill='currentColor' d='M5.25 10.15l-2.8-2.8-.7.7 3.5 3.5 7.5-7.5-.7-.7z'/%3E%3C/svg%3E\");-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath fill='currentColor' d='M5.25 10.15l-2.8-2.8-.7.7 3.5 3.5 7.5-7.5-.7-.7z'/%3E%3C/svg%3E\");mask-size:contain;-webkit-mask-size:contain;mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;mask-position:center;-webkit-mask-position:center}.in-table-checkbox:hover:not(:checked){border-color:var(--p-checkbox-hover-border-color, #999999)}\n"] }]
|
|
1670
|
+
args: [{ standalone: false, selector: 'in-table', providers: [TableService], template: "<span *ngIf=\"label\" class=\"c-label\">\r\n {{label}}\r\n <span *ngIf=\"required\" class=\"c-label__req\">*</span>\r\n <span *ngIf=\"error\" class=\"c-label__sub_is-error\">{{error}}</span>\r\n</span>\r\n<p-table #dt\r\n (onFilter) = onFilter($event)\r\n (onSort)=\"onSort()\"\r\n (onStateRestore)=\"restoreSearchText()\"\r\n (onStateSave)=\"stateSave($event)\"\r\n (sortFunction)=\"sortFunction? sortFunction.emit($event): null\"\r\n [(selection)]=\"selectionValue\"\r\n [class]=\"class\"\r\n [columns]=\"filteredColumns\"\r\n [customSort]=\"customSort\"\r\n [dataKey]=\"dataKey || 'id'\"\r\n [globalFilterFields]=\"globalFilteredColumns\"\r\n [resizableColumns]=\"resizableColumns\"\r\n [scrollHeight]=\"scrollHeight\"\r\n [scrollable]=\"scrollable\"\r\n [selectionMode]=\"selectionMode\"\r\n [sortField]=\"sortField || 'id'\"\r\n [sortOrder]=\"isAscending ? 1 : -1\"\r\n [stateKey]=\"stateKey\"\r\n [stateStorage]=\"'local'\"\r\n [style]=\"style\"\r\n [value]=\"values\"\r\n [columnResizeMode]=\"columnResizeMode\"\r\n>\r\n <ng-template *ngIf=\"colGroupTemplate\" let-columns pTemplate=\"colgroup\">\r\n <ng-container\r\n *ngTemplateOutlet=\"colGroupTemplate; context: {$implicit: { columns: columns}}\"></ng-container>\r\n </ng-template>\r\n\r\n <ng-template *ngIf=\"!colGroupTemplate\" let-columns pTemplate=\"colgroup\">\r\n <colgroup *ngIf=\"!isMobileView\">\r\n <col *ngIf=\"checkboxSelection\" style=\"width: 44px;\">\r\n <col *ngFor=\"let col of filteredColumns; let idx = index\">\r\n </colgroup>\r\n </ng-template>\r\n\r\n <ng-template let-columns pTemplate=\"header\">\r\n <ng-container *ngIf=\"showHeader\">\r\n <tr>\r\n <th *ngIf=\"checkboxSelection\" class=\"u-position-relative u-text_center\" pResizableColumn style=\"width: 44px;\">\r\n <!-- Native header checkbox bypasses dt.processedData (O(N log N) sort) used\r\n by p-tableHeaderCheckbox.toggleRowsWithCheckbox() on select all. -->\r\n <input type=\"checkbox\"\r\n class=\"in-table-checkbox\"\r\n [checked]=\"_isAllSelected()\"\r\n (change)=\"_onHeaderCheckboxChange($event)\"\r\n (click)=\"$event.stopPropagation()\"\r\n >\r\n </th>\r\n <th *ngFor=\"let col of filteredColumns\" [pSortableColumn]=\"col.field\" class=\"u-position-relative\"\r\n pResizableColumn>\r\n <div class=\"p-table-thead-title\"\r\n title=\"{{col.label | translate}}\">\r\n {{col.label | translate}}\r\n </div>\r\n <p-sortIcon *ngIf=\"isSortIcon\" [field]=\"col.field\"\r\n class=\"u-position-absolute u-position-absolute-right c-sorticon\"\r\n style=\"display: flex; width: 18px; top: 0; height: 100%;\"></p-sortIcon>\r\n </th>\r\n </tr>\r\n <tr *ngIf=\"toolbar && toolbar.filter && toolbar.filter.active\">\r\n <th *ngIf=\"checkboxSelection\" class=\"u-position-relative u-text_center\" pResizableColumn\r\n style=\"width: 44px;\"></th>\r\n <th *ngFor=\"let col of columns\" [ngSwitch]=\"col.field\">\r\n <input\r\n (input)=\"dt.filter($any($event.target).value, col.field, 'contains')\"\r\n *ngSwitchCase=\"colFilter(col.field)?.type === 'text' ? col.field : ''\"\r\n autofocus=\"\"\r\n class=\"c-input c-input_small ng-pristine ng-valid ng-scope ng-empty ng-touched\"\r\n pInputText\r\n type=\"text\">\r\n\r\n <p-dropdown (onChange)=\"dt.filter($event.value, col.field, 'equals')\"\r\n *ngSwitchCase=\"colFilter(col.field)?.type === 'dropdown' ? col.field : ''\"\r\n [options]=\"colFilter(col.field)?.options\"\r\n [style]=\"{ width: '100%', overflow: 'visible' }\"\r\n appendTo=\"body\"></p-dropdown>\r\n\r\n <p-multiSelect (onChange)=\"dt.filter($event.value, col.field, 'in')\"\r\n *ngSwitchCase=\"colFilter(col.field)?.type === 'multiselect' ? col.field : ''\"\r\n [options]=\"colFilter(col.field)?.options\"\r\n [style]=\"{ width: '100%', overflow: 'visible' }\" appendTo=\"body\"\r\n defaultLabel=\"{{'All' | translate}}\"></p-multiSelect>\r\n <input\r\n (input)=\"dt.filter($any($event.target).value, col.field + '2filter', 'contains')\"\r\n *ngSwitchCase=\"colFilter(col.field)?.type === 'datetext' ? col.field : ''\"\r\n autofocus=\"\"\r\n class=\"c-input c-input_small ng-pristine ng-valid ng-scope ng-empty ng-touched\"\r\n pInputText\r\n type=\"text\">\r\n </th>\r\n </tr>\r\n </ng-container>\r\n </ng-template>\r\n\r\n <ng-template *ngIf=\"bodyTemplate\" let-columns=\"columns\" let-rowData let-rowIndex=\"rowIndex\" pTemplate=\"body\">\r\n <ng-container\r\n *ngTemplateOutlet=\"bodyTemplate; context: {$implicit: { rowIndex: rowIndex, rowData: rowData, columns: columns}}\"></ng-container>\r\n </ng-template>\r\n\r\n <ng-template *ngIf=\"!bodyTemplate\" let-columns=\"columns\" let-index=\"rowIndex\" let-rowData pTemplate=\"body\">\r\n <tr\r\n (click)=\"toggleGroup(index, rowData.groupKey[groupMode])\"\r\n *ngIf=\"isGrouped && isShowGroup(rowData.groupKey[groupMode], index)\"\r\n class=\"row_hover_highlight\">\r\n <td [colSpan]=\"countVisibleColumns() + 1\">\r\n <span>\r\n <i\r\n [ngClass]=\"groupInfo[rowData.groupKey[groupMode]].isExpanded ? 'in fa-fw in-chevron-down' : 'in fa-fw in-chevron-right'\"></i>\r\n <span>{{rowData.groupKey[groupMode] | translate }} ({{countGroup(rowData.groupKey[groupMode], groupMode)}}\r\n )</span>\r\n </span>\r\n </td>\r\n </tr>\r\n <tr *ngIf=\"!isGrouped || groupInfo[(rowData.groupKey[groupMode])].isExpanded\"\r\n [ngClass]=\"{row_active: isRowActive(rowData)}\"\r\n [pSelectableRow]=\"rowData\"\r\n class=\"row\">\r\n <td *ngIf=\"checkboxSelection\" [ngClass]=\"{\r\n 'row_status_success': rowData.sdirparamstatecolor === 'success',\r\n 'row_status_error': rowData.sdirparamstatecolor === 'error',\r\n 'row_status_warning': rowData.sdirparamstatecolor === 'warning',\r\n 'row_status_critical': rowData.sdirparamstatecolor === 'critical',\r\n 'row_status_falsevalue': rowData.sdirparamstatecolor === 'falsevalue',\r\n 'row_status_pending': rowData.sdirparamstatecolor === 'pending'\r\n }\" class=\"u-text_center\"\r\n style=\"width: 44px\"\r\n >\r\n <!-- Native checkbox \u2014 no Angular component overhead (no NgModel/CVA/signals).\r\n Uses Set for O(1) state lookup instead of p-tableCheckbox's O(M) isSelected(). -->\r\n <input type=\"checkbox\"\r\n class=\"in-table-checkbox\"\r\n [checked]=\"_isRowSelected(rowData)\"\r\n [style.pointer-events]=\"(selectionMode === 'single' || (selectionMode === 'multiple' && checkboxSelection)) ? 'none' : 'auto'\"\r\n (change)=\"_onCheckboxChange($event, rowData)\"\r\n (click)=\"$event.stopPropagation()\"\r\n >\r\n </td>\r\n <td (click)=\"activeChange.emit(rowData)\"\r\n *ngFor=\"let col of filteredColumns\"\r\n class=\"u-overflow-visible\">\r\n <div (mouseover)=\"showTooltip($event)\" *ngIf=\"!valueTemplate\" class=\"p-table-tbody-content\" title>\r\n {{col.translatable ? (rowData | propertyValue: col.field | translate) : (rowData | propertyValue: col.field)}}\r\n </div>\r\n <ng-container\r\n *ngTemplateOutlet=\"valueTemplate; context: {$implicit: { data: rowData, col: col}}\"></ng-container>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n\r\n <ng-template *ngIf=\"toolbar\" pTemplate=\"caption\">\r\n\r\n <div class=\"o-grid o-grid_no-gutter\">\r\n <div class=\"c-tree-table__toolbar-content u-display-inline-flex\">\r\n <div *ngIf=\"isTextSearch\" class=\"c-form c-form_inline u-display-inline-block\">\r\n <form class=\"c-label\">\r\n <div class=\"input-wrapper u-margin-right-tiny\">\r\n <input #searchTextInput\r\n (input)=\"localSearch(dt, searchText)\"\r\n [(ngModel)]=\"searchText\"\r\n [ngModelOptions]=\"{standalone: true}\"\r\n autofocus=\"\"\r\n class=\"search-box c-input c-input_small ng-pristine ng-valid ng-scope ng-empty ng-touched\"\r\n pInputText\r\n placeholder=\"{{('SHARED.SEARCH' | translate) + ':'}}\"\r\n required\r\n style=\"padding-right: 28px\"\r\n tabindex=\"1\"\r\n type=\"search\"\r\n >\r\n <button (click)=\"clear()\" class=\"button-reset\" type=\"reset\"\r\n [attr.title]=\"'Reset' | translate\">\r\n <i class=\"in in-close\"></i>\r\n </button>\r\n </div>\r\n </form>\r\n </div>\r\n <div class=\"c-btn c-btn_border-free c-btn_small\">\r\n <in-table-columns-multiselect (columnsChange)=\"columnsChange($event)\"\r\n [columns]=\"primaryColumns\"\r\n [disableActiveCheckboxes]=\"countVisibleColumns() === 1\"></in-table-columns-multiselect>\r\n </div>\r\n\r\n <button (click)=\"onFilterToolbar($event)\" *ngIf=\"toolbar.filter\"\r\n class=\"c-btn c-btn_border-free c-btn_small\"\r\n >\r\n <i class=\"in in-filter\" title=\"{{'Service filter' | translate}}\"></i>\r\n </button>\r\n\r\n <button (click)=\"treeAction.emit($event)\" *ngIf=\"toolbar.tree\" [disabled]=\"toolbar.tree.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\"\r\n >\r\n <i class=\"in in-list\" title=\"{{'Filter by rubric' | translate}}\"></i>\r\n </button>\r\n\r\n <button (click)=\"addAction.emit($event)\" *ngIf=\"toolbar.add\" [disabled]=\"toolbar.add.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\"\r\n >\r\n <i class=\"in in-plus\" title=\"{{'Add' | translate}}\"></i>\r\n </button>\r\n\r\n <button (click)=\"linkAction.emit($event)\" *ngIf=\"toolbar.link\" [disabled]=\"toolbar.link.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\"\r\n >\r\n <i class=\"in in-link\" title=\"{{'Link' | translate}}\"></i>\r\n </button>\r\n <button (click)=\"csvAction.emit($event)\" *ngIf=\"toolbar.csv\" [disabled]=\"toolbar.csv.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\"\r\n >\r\n <!--Todo: \u0437\u0430\u043C\u0435\u043D\u0438\u0442\u044C \u043D\u0430 in-file-csv-->\r\n <i class=\"in in-file-excel-outline\" title=\"{{'LOGS.SAVE_TO_CSV' | translate}}\"></i>\r\n </button>\r\n <button (click)=\"saveAction.emit($event)\" *ngIf=\"toolbar.save\"\r\n [disabled]=\"toolbar.save.disabled\"\r\n class=\"c-btn c-btn_primary c-btn_small\"\r\n title=\"{{'Save' | translate}}\"\r\n >\r\n {{'Save' | translate}}\r\n </button>\r\n <button (click)=\"groupEditAction.emit($event)\" *ngIf=\"toolbar.groupEdit && toolbar.groupEdit.active\"\r\n [disabled]=\"toolbar.groupEdit.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\">\r\n <i class=\"in in-pencil\" title=\"{{'groupEdit' | translate}}\"></i>\r\n </button>\r\n <ng-content select=\"[buttons]\"></ng-content>\r\n <button (click)=\"paramsEditAction.emit($event)\" *ngIf=\"toolbar.paramsEdit && toolbar.paramsEdit.active\"\r\n [disabled]=\"toolbar.paramsEdit.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\">\r\n <i class=\"in in-pencil\" title=\"{{'paramsEdit' | translate}}\"></i>\r\n </button>\r\n\r\n\r\n <button (click)=\"removeAction.emit($event)\" *ngIf=\"toolbar.remove && toolbar.remove.active\"\r\n [disabled]=\"toolbar.remove.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\">\r\n <i class=\"in in-trash\" title=\"{{'Delete' | translate}}\"></i>\r\n </button>\r\n <button (click)=\"unlinkAction.emit($event)\" *ngIf=\"toolbar.unlink\" [disabled]=\"toolbar.unlink.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\">\r\n <i class=\"in in-link-off\" title=\"{{'Detach tag from selected items' | translate}}\"></i>\r\n </button>\r\n <button (click)=\"toggleNodes(true)\"\r\n *ngIf=\"toolbar.expandAll\"\r\n class=\"c-btn c-btn_small c-btn_svg-24 c-icon c-icon_svg c-icon_svg-24 c-btn_border-free\"\r\n title=\"{{'Expand all' | translate}}\">\r\n <svg fill=\"currentColor\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M20 2H4v2h16V2zM4 20v2h16v-2H4zM12 5l5 6H7l5-6zM17 13l-5 6-5-6h10z\"/>\r\n </svg>\r\n </button>\r\n <button (click)=\"toggleNodes(false)\"\r\n *ngIf=\"toolbar.expandAll\"\r\n class=\"c-btn c-btn_small c-btn_svg-24 c-icon c-icon_svg c-icon_svg-24 c-btn_border-free\"\r\n title=\"{{'Collapse all' | translate}}\">\r\n <svg fill=\"currentColor\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path clip-rule=\"evenodd\" d=\"M17 3l-5 6-5-6h10zM4 13v-2h16v2H4zm8 2l5 6H7l5-6z\" fill-rule=\"evenodd\"/>\r\n </svg>\r\n </button>\r\n\r\n <div *ngIf=\"toolbar.groupSort\"\r\n class=\"c-btn-group\"\r\n container=\"body\"\r\n ngbDropdown>\r\n\r\n <button class=\"c-btn c-btn_border-free c-btn_small\"\r\n id=\"dropdownGroupType\"\r\n ngbDropdownToggle\r\n title=\"{{'Change the way parameters are grouped' | translate}}\">\r\n <i aria-hidden=\"true\" class=\"in in-object-group\"></i>\r\n <i aria-hidden=\"true\" class=\"c-caret\"></i>\r\n </button>\r\n\r\n <ul aria-labelledby=\"dropdownGroupType\"\r\n class=\"c-dropdown-menu c-dropdown-menu_right ng-star-inserted\"\r\n ngbDropdownMenu\r\n role=\"menu\">\r\n <li *ngFor=\"let item of toolbar.groupSort.label\"\r\n [ngClass]=\"{'is-dropdown-menu__listitem_active': item.value === groupMode}\"\r\n class=\"c-dropdown-menu__listitem is-dropdown-menu__listitem_active\"\r\n ngbDropdownItem\r\n role=\"menuitem\">\r\n <a (click)=\"toggleMode(item.value)\" class=\"c-dropdown-menu__content\">\r\n {{item.label}}\r\n </a>\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-template>\r\n</p-table>\r\n", styles: ["@charset \"UTF-8\";.u-overflow-visible{overflow:visible!important}.row_status_success{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-success, #31AC51)}.row_status_error{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-error, #F95C5D)}.row_status_warning{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-warning, #EE9946)}.row_status_critical{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-critical, #F95C5D)}.row_status_falsevalue{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-falsevalue, #85B3CB)}.row_status_disabled{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-disabled)}.row_status_none{padding-left:9px!important;border-left:4px solid transparent}.row_status_pending{padding-left:9px!important;border-left:4px solid var(--ids-theme-status-pending, #1f85ff)}.button-reset{display:flex;align-items:center;position:absolute;right:6px;top:5px;padding:6px;font-size:15px;border:none;outline:0;cursor:pointer;color:var(--colorTextMuted);background-color:transparent}.button-reset:hover{color:var(--ids-theme-btn-default-color, #FFFFFF)}.input-wrapper{position:relative;display:flex;align-items:baseline}.c-input:not(:valid)~.button-reset{display:none}:host-context(.theme-light) .in-table-checkbox,:host-context(.theme-contrast) .in-table-checkbox{border-color:#00000073}:host-context(.theme-light) .in-table-checkbox:hover:not(:checked):not(:indeterminate),:host-context(.theme-contrast) .in-table-checkbox:hover:not(:checked):not(:indeterminate){border-color:#000000b3}.in-table-checkbox{appearance:none;-webkit-appearance:none;width:var(--p-checkbox-width, 20px);height:var(--p-checkbox-height, 20px);border:1px solid var(--p-checkbox-border-color, #B3B3B3);border-radius:var(--p-checkbox-border-radius, 2px);background:var(--p-checkbox-background, transparent);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;flex-shrink:0;transition:border-color var(--p-checkbox-transition-duration, .15s),background var(--p-checkbox-transition-duration, .15s)}.in-table-checkbox:checked{background:var(--p-checkbox-checked-background, #387382);border-color:var(--p-checkbox-checked-border-color, #387382)}.in-table-checkbox:checked:after{content:\"\";display:block;width:var(--p-checkbox-icon-size, 14px);height:var(--p-checkbox-icon-size, 14px);background-color:var(--p-checkbox-icon-checked-color, #ffffff);mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath fill='currentColor' d='M5.25 10.15l-2.8-2.8-.7.7 3.5 3.5 7.5-7.5-.7-.7z'/%3E%3C/svg%3E\");-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath fill='currentColor' d='M5.25 10.15l-2.8-2.8-.7.7 3.5 3.5 7.5-7.5-.7-.7z'/%3E%3C/svg%3E\");mask-size:contain;-webkit-mask-size:contain;mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;mask-position:center;-webkit-mask-position:center}.in-table-checkbox:indeterminate{background:var(--p-checkbox-checked-background, #387382);border-color:var(--p-checkbox-checked-border-color, #387382)}.in-table-checkbox:indeterminate:after{content:\"\";display:block;width:calc(var(--p-checkbox-icon-size, 14px) - 2px);height:2px;background-color:var(--p-checkbox-icon-checked-color, #ffffff);margin:auto}.in-table-checkbox:hover:not(:checked):not(:indeterminate){border-color:var(--p-checkbox-hover-border-color, #999999)}\n"] }]
|
|
1655
1671
|
}], null, { columns: [{
|
|
1656
1672
|
type: Input
|
|
1657
1673
|
}], values: [{
|
|
@@ -2277,127 +2293,132 @@ function TreeTableComponent_ng_template_2_Template(rf, ctx) { if (rf & 1) {
|
|
|
2277
2293
|
i0.ɵɵproperty("ngForOf", ctx_r2.visibleColumns());
|
|
2278
2294
|
} }
|
|
2279
2295
|
function TreeTableComponent_ng_template_3_th_1_Template(rf, ctx) { if (rf & 1) {
|
|
2280
|
-
i0.ɵɵ
|
|
2281
|
-
i0.ɵɵ
|
|
2282
|
-
i0.ɵɵ
|
|
2296
|
+
const _r4 = i0.ɵɵgetCurrentView();
|
|
2297
|
+
i0.ɵɵelementStart(0, "th")(1, "input", 11);
|
|
2298
|
+
i0.ɵɵlistener("change", function TreeTableComponent_ng_template_3_th_1_Template_input_change_1_listener($event) { i0.ɵɵrestoreView(_r4); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2._onHeaderCheckboxChange($event)); })("click", function TreeTableComponent_ng_template_3_th_1_Template_input_click_1_listener($event) { i0.ɵɵrestoreView(_r4); return i0.ɵɵresetView($event.stopPropagation()); });
|
|
2299
|
+
i0.ɵɵelementEnd()();
|
|
2300
|
+
} if (rf & 2) {
|
|
2301
|
+
const ctx_r2 = i0.ɵɵnextContext(2);
|
|
2302
|
+
i0.ɵɵadvance();
|
|
2303
|
+
i0.ɵɵproperty("checked", ctx_r2._isAllSelected());
|
|
2283
2304
|
} }
|
|
2284
2305
|
function TreeTableComponent_ng_template_3_th_2_Template(rf, ctx) { if (rf & 1) {
|
|
2285
|
-
i0.ɵɵelementStart(0, "th",
|
|
2306
|
+
i0.ɵɵelementStart(0, "th", 12)(1, "div", 13);
|
|
2286
2307
|
i0.ɵɵpipe(2, "translate");
|
|
2287
2308
|
i0.ɵɵtext(3);
|
|
2288
2309
|
i0.ɵɵpipe(4, "translate");
|
|
2289
2310
|
i0.ɵɵelementEnd();
|
|
2290
|
-
i0.ɵɵelement(5, "p-treeTableSortIcon",
|
|
2311
|
+
i0.ɵɵelement(5, "p-treeTableSortIcon", 14);
|
|
2291
2312
|
i0.ɵɵelementEnd();
|
|
2292
2313
|
} if (rf & 2) {
|
|
2293
|
-
const
|
|
2294
|
-
i0.ɵɵproperty("ttSortableColumn",
|
|
2314
|
+
const col_r5 = ctx.$implicit;
|
|
2315
|
+
i0.ɵɵproperty("ttSortableColumn", col_r5.field);
|
|
2295
2316
|
i0.ɵɵadvance();
|
|
2296
|
-
i0.ɵɵpropertyInterpolate("title", i0.ɵɵpipeBind1(2, 4,
|
|
2317
|
+
i0.ɵɵpropertyInterpolate("title", i0.ɵɵpipeBind1(2, 4, col_r5.label));
|
|
2297
2318
|
i0.ɵɵadvance(2);
|
|
2298
|
-
i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(4, 6,
|
|
2319
|
+
i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(4, 6, col_r5.label), " ");
|
|
2299
2320
|
i0.ɵɵadvance(2);
|
|
2300
|
-
i0.ɵɵproperty("field",
|
|
2321
|
+
i0.ɵɵproperty("field", col_r5.field);
|
|
2301
2322
|
} }
|
|
2302
2323
|
function TreeTableComponent_ng_template_3_Template(rf, ctx) { if (rf & 1) {
|
|
2303
2324
|
i0.ɵɵelementStart(0, "tr");
|
|
2304
|
-
i0.ɵɵtemplate(1, TreeTableComponent_ng_template_3_th_1_Template, 2,
|
|
2325
|
+
i0.ɵɵtemplate(1, TreeTableComponent_ng_template_3_th_1_Template, 2, 1, "th", 6)(2, TreeTableComponent_ng_template_3_th_2_Template, 6, 8, "th", 10);
|
|
2305
2326
|
i0.ɵɵelementEnd();
|
|
2306
2327
|
} if (rf & 2) {
|
|
2307
|
-
const
|
|
2328
|
+
const columns_r6 = ctx.$implicit;
|
|
2308
2329
|
const ctx_r2 = i0.ɵɵnextContext();
|
|
2309
2330
|
i0.ɵɵadvance();
|
|
2310
2331
|
i0.ɵɵproperty("ngIf", ctx_r2.checkboxSelection);
|
|
2311
2332
|
i0.ɵɵadvance();
|
|
2312
|
-
i0.ɵɵproperty("ngForOf",
|
|
2333
|
+
i0.ɵɵproperty("ngForOf", columns_r6);
|
|
2313
2334
|
} }
|
|
2314
2335
|
function TreeTableComponent_ng_template_4_td_1_Template(rf, ctx) { if (rf & 1) {
|
|
2315
|
-
const
|
|
2316
|
-
i0.ɵɵelementStart(0, "td")(1, "input",
|
|
2317
|
-
i0.ɵɵlistener("change", function TreeTableComponent_ng_template_4_td_1_Template_input_change_1_listener($event) { i0.ɵɵrestoreView(
|
|
2336
|
+
const _r7 = i0.ɵɵgetCurrentView();
|
|
2337
|
+
i0.ɵɵelementStart(0, "td")(1, "input", 17);
|
|
2338
|
+
i0.ɵɵlistener("change", function TreeTableComponent_ng_template_4_td_1_Template_input_change_1_listener($event) { i0.ɵɵrestoreView(_r7); const ctx_r7 = i0.ɵɵnextContext(); const rowData_r9 = ctx_r7.rowData; const rowNode_r10 = ctx_r7.$implicit; const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2._onCheckboxChange($event, rowNode_r10, rowData_r9)); })("click", function TreeTableComponent_ng_template_4_td_1_Template_input_click_1_listener($event) { i0.ɵɵrestoreView(_r7); return i0.ɵɵresetView($event.stopPropagation()); });
|
|
2318
2339
|
i0.ɵɵelementEnd()();
|
|
2319
2340
|
} if (rf & 2) {
|
|
2320
|
-
const
|
|
2341
|
+
const rowData_r9 = i0.ɵɵnextContext().rowData;
|
|
2321
2342
|
const ctx_r2 = i0.ɵɵnextContext();
|
|
2322
2343
|
i0.ɵɵadvance();
|
|
2323
|
-
i0.ɵɵproperty("checked", ctx_r2._isRowSelected(
|
|
2344
|
+
i0.ɵɵproperty("checked", ctx_r2._isRowSelected(rowData_r9))("indeterminate", ctx_r2._isIndeterminate(rowData_r9));
|
|
2324
2345
|
} }
|
|
2325
2346
|
function TreeTableComponent_ng_template_4_td_2_ng_template_2_Template(rf, ctx) { if (rf & 1) {
|
|
2326
|
-
i0.ɵɵelement(0, "p-treeTableToggler",
|
|
2347
|
+
i0.ɵɵelement(0, "p-treeTableToggler", 23);
|
|
2327
2348
|
} if (rf & 2) {
|
|
2328
|
-
const
|
|
2329
|
-
i0.ɵɵproperty("rowNode",
|
|
2349
|
+
const rowNode_r10 = i0.ɵɵnextContext(2).$implicit;
|
|
2350
|
+
i0.ɵɵproperty("rowNode", rowNode_r10);
|
|
2330
2351
|
} }
|
|
2331
2352
|
function TreeTableComponent_ng_template_4_td_2_ng_container_5_i_1_Template(rf, ctx) { if (rf & 1) {
|
|
2332
|
-
i0.ɵɵelement(0, "i",
|
|
2353
|
+
i0.ɵɵelement(0, "i", 25);
|
|
2333
2354
|
} if (rf & 2) {
|
|
2334
2355
|
const rowData_r9 = i0.ɵɵnextContext(3).rowData;
|
|
2335
2356
|
i0.ɵɵproperty("ngClass", rowData_r9.icon);
|
|
2336
2357
|
} }
|
|
2337
2358
|
function TreeTableComponent_ng_template_4_td_2_ng_container_5_Template(rf, ctx) { if (rf & 1) {
|
|
2338
2359
|
i0.ɵɵelementContainerStart(0);
|
|
2339
|
-
i0.ɵɵtemplate(1, TreeTableComponent_ng_template_4_td_2_ng_container_5_i_1_Template, 1, 1, "i",
|
|
2360
|
+
i0.ɵɵtemplate(1, TreeTableComponent_ng_template_4_td_2_ng_container_5_i_1_Template, 1, 1, "i", 24);
|
|
2340
2361
|
i0.ɵɵtext(2);
|
|
2341
2362
|
i0.ɵɵpipe(3, "propertyValue");
|
|
2342
2363
|
i0.ɵɵelementContainerEnd();
|
|
2343
2364
|
} if (rf & 2) {
|
|
2344
|
-
const
|
|
2345
|
-
const
|
|
2346
|
-
const
|
|
2365
|
+
const ctx_r11 = i0.ɵɵnextContext();
|
|
2366
|
+
const col_r13 = ctx_r11.$implicit;
|
|
2367
|
+
const i_r14 = ctx_r11.index;
|
|
2347
2368
|
const rowData_r9 = i0.ɵɵnextContext().rowData;
|
|
2348
2369
|
i0.ɵɵadvance();
|
|
2349
|
-
i0.ɵɵproperty("ngIf", rowData_r9.icon &&
|
|
2370
|
+
i0.ɵɵproperty("ngIf", rowData_r9.icon && i_r14 == 0);
|
|
2350
2371
|
i0.ɵɵadvance();
|
|
2351
|
-
i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind2(3, 2, rowData_r9,
|
|
2372
|
+
i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind2(3, 2, rowData_r9, col_r13.field), " ");
|
|
2352
2373
|
} }
|
|
2353
2374
|
function TreeTableComponent_ng_template_4_td_2_ng_container_6_Template(rf, ctx) { if (rf & 1) {
|
|
2354
2375
|
i0.ɵɵelementContainer(0);
|
|
2355
2376
|
} }
|
|
2356
2377
|
function TreeTableComponent_ng_template_4_td_2_Template(rf, ctx) { if (rf & 1) {
|
|
2357
|
-
const
|
|
2358
|
-
i0.ɵɵelementStart(0, "td",
|
|
2359
|
-
i0.ɵɵlistener("click", function TreeTableComponent_ng_template_4_td_2_Template_td_click_0_listener() { i0.ɵɵrestoreView(
|
|
2360
|
-
i0.ɵɵelementStart(1, "div",
|
|
2361
|
-
i0.ɵɵtemplate(2, TreeTableComponent_ng_template_4_td_2_ng_template_2_Template, 1, 1, "ng-template",
|
|
2362
|
-
i0.ɵɵelementStart(3, "div",
|
|
2378
|
+
const _r11 = i0.ɵɵgetCurrentView();
|
|
2379
|
+
i0.ɵɵelementStart(0, "td", 18);
|
|
2380
|
+
i0.ɵɵlistener("click", function TreeTableComponent_ng_template_4_td_2_Template_td_click_0_listener() { i0.ɵɵrestoreView(_r11); const rowData_r9 = i0.ɵɵnextContext().rowData; const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.activeChange.emit(rowData_r9)); });
|
|
2381
|
+
i0.ɵɵelementStart(1, "div", 19);
|
|
2382
|
+
i0.ɵɵtemplate(2, TreeTableComponent_ng_template_4_td_2_ng_template_2_Template, 1, 1, "ng-template", 20);
|
|
2383
|
+
i0.ɵɵelementStart(3, "div", 21);
|
|
2363
2384
|
i0.ɵɵpipe(4, "propertyValue");
|
|
2364
|
-
i0.ɵɵtemplate(5, TreeTableComponent_ng_template_4_td_2_ng_container_5_Template, 4, 5, "ng-container", 6)(6, TreeTableComponent_ng_template_4_td_2_ng_container_6_Template, 1, 0, "ng-container",
|
|
2385
|
+
i0.ɵɵtemplate(5, TreeTableComponent_ng_template_4_td_2_ng_container_5_Template, 4, 5, "ng-container", 6)(6, TreeTableComponent_ng_template_4_td_2_ng_container_6_Template, 1, 0, "ng-container", 22);
|
|
2365
2386
|
i0.ɵɵelementEnd()()();
|
|
2366
2387
|
} if (rf & 2) {
|
|
2367
|
-
const
|
|
2368
|
-
const
|
|
2388
|
+
const col_r13 = ctx.$implicit;
|
|
2389
|
+
const i_r14 = ctx.index;
|
|
2369
2390
|
const rowData_r9 = i0.ɵɵnextContext().rowData;
|
|
2370
2391
|
const ctx_r2 = i0.ɵɵnextContext();
|
|
2371
2392
|
i0.ɵɵadvance(2);
|
|
2372
|
-
i0.ɵɵproperty("ngIf",
|
|
2393
|
+
i0.ɵɵproperty("ngIf", i_r14 == 0);
|
|
2373
2394
|
i0.ɵɵadvance();
|
|
2374
|
-
i0.ɵɵpropertyInterpolate("title", i0.ɵɵpipeBind2(4, 6, rowData_r9,
|
|
2375
|
-
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(9, _c1$7,
|
|
2395
|
+
i0.ɵɵpropertyInterpolate("title", i0.ɵɵpipeBind2(4, 6, rowData_r9, col_r13.field));
|
|
2396
|
+
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(9, _c1$7, i_r14 == 0));
|
|
2376
2397
|
i0.ɵɵadvance(2);
|
|
2377
2398
|
i0.ɵɵproperty("ngIf", !ctx_r2.valueTemplate);
|
|
2378
2399
|
i0.ɵɵadvance();
|
|
2379
|
-
i0.ɵɵproperty("ngTemplateOutlet", ctx_r2.valueTemplate)("ngTemplateOutletContext", i0.ɵɵpureFunction1(14, _c3$5, i0.ɵɵpureFunction2(11, _c2$6, rowData_r9,
|
|
2400
|
+
i0.ɵɵproperty("ngTemplateOutlet", ctx_r2.valueTemplate)("ngTemplateOutletContext", i0.ɵɵpureFunction1(14, _c3$5, i0.ɵɵpureFunction2(11, _c2$6, rowData_r9, col_r13)));
|
|
2380
2401
|
} }
|
|
2381
2402
|
function TreeTableComponent_ng_template_4_Template(rf, ctx) { if (rf & 1) {
|
|
2382
|
-
i0.ɵɵelementStart(0, "tr",
|
|
2383
|
-
i0.ɵɵtemplate(1, TreeTableComponent_ng_template_4_td_1_Template, 2,
|
|
2403
|
+
i0.ɵɵelementStart(0, "tr", 15);
|
|
2404
|
+
i0.ɵɵtemplate(1, TreeTableComponent_ng_template_4_td_1_Template, 2, 2, "td", 6)(2, TreeTableComponent_ng_template_4_td_2_Template, 7, 16, "td", 16);
|
|
2384
2405
|
i0.ɵɵelementEnd();
|
|
2385
2406
|
} if (rf & 2) {
|
|
2386
|
-
const
|
|
2407
|
+
const columns_r15 = ctx.columns;
|
|
2387
2408
|
const rowData_r9 = ctx.rowData;
|
|
2388
|
-
const
|
|
2409
|
+
const rowNode_r10 = ctx.$implicit;
|
|
2389
2410
|
const ctx_r2 = i0.ɵɵnextContext();
|
|
2390
|
-
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(4, _c0$g, ctx_r2.isRowActive(rowData_r9)))("ttSelectableRow",
|
|
2411
|
+
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(4, _c0$g, ctx_r2.isRowActive(rowData_r9)))("ttSelectableRow", rowNode_r10);
|
|
2391
2412
|
i0.ɵɵadvance();
|
|
2392
2413
|
i0.ɵɵproperty("ngIf", ctx_r2.checkboxSelection);
|
|
2393
2414
|
i0.ɵɵadvance();
|
|
2394
|
-
i0.ɵɵproperty("ngForOf",
|
|
2415
|
+
i0.ɵɵproperty("ngForOf", columns_r15);
|
|
2395
2416
|
} }
|
|
2396
2417
|
function TreeTableComponent_5_ng_template_0_button_13_Template(rf, ctx) { if (rf & 1) {
|
|
2397
|
-
const
|
|
2398
|
-
i0.ɵɵelementStart(0, "button",
|
|
2399
|
-
i0.ɵɵlistener("click", function TreeTableComponent_5_ng_template_0_button_13_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(
|
|
2400
|
-
i0.ɵɵelement(1, "i",
|
|
2418
|
+
const _r18 = i0.ɵɵgetCurrentView();
|
|
2419
|
+
i0.ɵɵelementStart(0, "button", 40);
|
|
2420
|
+
i0.ɵɵlistener("click", function TreeTableComponent_5_ng_template_0_button_13_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r18); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.addAction.emit($event)); });
|
|
2421
|
+
i0.ɵɵelement(1, "i", 41);
|
|
2401
2422
|
i0.ɵɵelementEnd();
|
|
2402
2423
|
} if (rf & 2) {
|
|
2403
2424
|
const ctx_r2 = i0.ɵɵnextContext(3);
|
|
@@ -2406,10 +2427,10 @@ function TreeTableComponent_5_ng_template_0_button_13_Template(rf, ctx) { if (rf
|
|
|
2406
2427
|
i0.ɵɵproperty("title", ctx_r2.toolbar.add.title || "\u0414\u043E\u0431\u0430\u0432\u0438\u0442\u044C");
|
|
2407
2428
|
} }
|
|
2408
2429
|
function TreeTableComponent_5_ng_template_0_button_14_Template(rf, ctx) { if (rf & 1) {
|
|
2409
|
-
const
|
|
2410
|
-
i0.ɵɵelementStart(0, "button",
|
|
2411
|
-
i0.ɵɵlistener("click", function TreeTableComponent_5_ng_template_0_button_14_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(
|
|
2412
|
-
i0.ɵɵelement(1, "i",
|
|
2430
|
+
const _r19 = i0.ɵɵgetCurrentView();
|
|
2431
|
+
i0.ɵɵelementStart(0, "button", 40);
|
|
2432
|
+
i0.ɵɵlistener("click", function TreeTableComponent_5_ng_template_0_button_14_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r19); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.groupAddAction.emit($event)); });
|
|
2433
|
+
i0.ɵɵelement(1, "i", 42);
|
|
2413
2434
|
i0.ɵɵelementEnd();
|
|
2414
2435
|
} if (rf & 2) {
|
|
2415
2436
|
const ctx_r2 = i0.ɵɵnextContext(3);
|
|
@@ -2418,10 +2439,10 @@ function TreeTableComponent_5_ng_template_0_button_14_Template(rf, ctx) { if (rf
|
|
|
2418
2439
|
i0.ɵɵproperty("title", ctx_r2.toolbar.groupAdd.title || "\u0414\u043E\u0431\u0430\u0432\u0438\u0442\u044C \u0433\u0440\u0443\u043F\u043F\u0443");
|
|
2419
2440
|
} }
|
|
2420
2441
|
function TreeTableComponent_5_ng_template_0_button_15_Template(rf, ctx) { if (rf & 1) {
|
|
2421
|
-
const
|
|
2422
|
-
i0.ɵɵelementStart(0, "button",
|
|
2442
|
+
const _r20 = i0.ɵɵgetCurrentView();
|
|
2443
|
+
i0.ɵɵelementStart(0, "button", 43);
|
|
2423
2444
|
i0.ɵɵpipe(1, "translate");
|
|
2424
|
-
i0.ɵɵlistener("click", function TreeTableComponent_5_ng_template_0_button_15_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(
|
|
2445
|
+
i0.ɵɵlistener("click", function TreeTableComponent_5_ng_template_0_button_15_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r20); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.saveAction.emit($event)); });
|
|
2425
2446
|
i0.ɵɵtext(2);
|
|
2426
2447
|
i0.ɵɵpipe(3, "translate");
|
|
2427
2448
|
i0.ɵɵelementEnd();
|
|
@@ -2433,10 +2454,10 @@ function TreeTableComponent_5_ng_template_0_button_15_Template(rf, ctx) { if (rf
|
|
|
2433
2454
|
i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(3, 5, "Save"), " ");
|
|
2434
2455
|
} }
|
|
2435
2456
|
function TreeTableComponent_5_ng_template_0_button_16_Template(rf, ctx) { if (rf & 1) {
|
|
2436
|
-
const
|
|
2437
|
-
i0.ɵɵelementStart(0, "button",
|
|
2438
|
-
i0.ɵɵlistener("click", function TreeTableComponent_5_ng_template_0_button_16_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(
|
|
2439
|
-
i0.ɵɵelement(1, "i",
|
|
2457
|
+
const _r21 = i0.ɵɵgetCurrentView();
|
|
2458
|
+
i0.ɵɵelementStart(0, "button", 40);
|
|
2459
|
+
i0.ɵɵlistener("click", function TreeTableComponent_5_ng_template_0_button_16_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r21); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.groupEditAction.emit($event)); });
|
|
2460
|
+
i0.ɵɵelement(1, "i", 44);
|
|
2440
2461
|
i0.ɵɵpipe(2, "translate");
|
|
2441
2462
|
i0.ɵɵelementEnd();
|
|
2442
2463
|
} if (rf & 2) {
|
|
@@ -2446,10 +2467,10 @@ function TreeTableComponent_5_ng_template_0_button_16_Template(rf, ctx) { if (rf
|
|
|
2446
2467
|
i0.ɵɵpropertyInterpolate("title", i0.ɵɵpipeBind1(2, 2, "groupEdit"));
|
|
2447
2468
|
} }
|
|
2448
2469
|
function TreeTableComponent_5_ng_template_0_button_17_Template(rf, ctx) { if (rf & 1) {
|
|
2449
|
-
const
|
|
2450
|
-
i0.ɵɵelementStart(0, "button",
|
|
2451
|
-
i0.ɵɵlistener("click", function TreeTableComponent_5_ng_template_0_button_17_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(
|
|
2452
|
-
i0.ɵɵelement(1, "i",
|
|
2470
|
+
const _r22 = i0.ɵɵgetCurrentView();
|
|
2471
|
+
i0.ɵɵelementStart(0, "button", 40);
|
|
2472
|
+
i0.ɵɵlistener("click", function TreeTableComponent_5_ng_template_0_button_17_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r22); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.removeAction.emit($event)); });
|
|
2473
|
+
i0.ɵɵelement(1, "i", 45);
|
|
2453
2474
|
i0.ɵɵelementEnd();
|
|
2454
2475
|
} if (rf & 2) {
|
|
2455
2476
|
const ctx_r2 = i0.ɵɵnextContext(3);
|
|
@@ -2458,10 +2479,10 @@ function TreeTableComponent_5_ng_template_0_button_17_Template(rf, ctx) { if (rf
|
|
|
2458
2479
|
i0.ɵɵproperty("title", (ctx_r2.toolbar.remove == null ? null : ctx_r2.toolbar.remove.title) || "\u0423\u0434\u0430\u043B\u0438\u0442\u044C");
|
|
2459
2480
|
} }
|
|
2460
2481
|
function TreeTableComponent_5_ng_template_0_button_18_Template(rf, ctx) { if (rf & 1) {
|
|
2461
|
-
const
|
|
2462
|
-
i0.ɵɵelementStart(0, "button",
|
|
2463
|
-
i0.ɵɵlistener("click", function TreeTableComponent_5_ng_template_0_button_18_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(
|
|
2464
|
-
i0.ɵɵelement(1, "i",
|
|
2482
|
+
const _r23 = i0.ɵɵgetCurrentView();
|
|
2483
|
+
i0.ɵɵelementStart(0, "button", 40);
|
|
2484
|
+
i0.ɵɵlistener("click", function TreeTableComponent_5_ng_template_0_button_18_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r23); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.unlinkAction.emit($event)); });
|
|
2485
|
+
i0.ɵɵelement(1, "i", 46);
|
|
2465
2486
|
i0.ɵɵpipe(2, "translate");
|
|
2466
2487
|
i0.ɵɵelementEnd();
|
|
2467
2488
|
} if (rf & 2) {
|
|
@@ -2471,10 +2492,10 @@ function TreeTableComponent_5_ng_template_0_button_18_Template(rf, ctx) { if (rf
|
|
|
2471
2492
|
i0.ɵɵpropertyInterpolate("title", i0.ɵɵpipeBind1(2, 2, "Detach tag from selected items"));
|
|
2472
2493
|
} }
|
|
2473
2494
|
function TreeTableComponent_5_ng_template_0_button_19_Template(rf, ctx) { if (rf & 1) {
|
|
2474
|
-
const
|
|
2475
|
-
i0.ɵɵelementStart(0, "button",
|
|
2476
|
-
i0.ɵɵlistener("click", function TreeTableComponent_5_ng_template_0_button_19_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(
|
|
2477
|
-
i0.ɵɵelement(1, "i",
|
|
2495
|
+
const _r24 = i0.ɵɵgetCurrentView();
|
|
2496
|
+
i0.ɵɵelementStart(0, "button", 40);
|
|
2497
|
+
i0.ɵɵlistener("click", function TreeTableComponent_5_ng_template_0_button_19_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r24); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.csvAction.emit($event)); });
|
|
2498
|
+
i0.ɵɵelement(1, "i", 47);
|
|
2478
2499
|
i0.ɵɵelementEnd();
|
|
2479
2500
|
} if (rf & 2) {
|
|
2480
2501
|
const ctx_r2 = i0.ɵɵnextContext(3);
|
|
@@ -2482,22 +2503,22 @@ function TreeTableComponent_5_ng_template_0_button_19_Template(rf, ctx) { if (rf
|
|
|
2482
2503
|
} }
|
|
2483
2504
|
function TreeTableComponent_5_ng_template_0_button_20__svg_svg_2_Template(rf, ctx) { if (rf & 1) {
|
|
2484
2505
|
i0.ɵɵnamespaceSVG();
|
|
2485
|
-
i0.ɵɵelementStart(0, "svg",
|
|
2486
|
-
i0.ɵɵelement(1, "path",
|
|
2506
|
+
i0.ɵɵelementStart(0, "svg", 50);
|
|
2507
|
+
i0.ɵɵelement(1, "path", 51);
|
|
2487
2508
|
i0.ɵɵelementEnd();
|
|
2488
2509
|
} }
|
|
2489
2510
|
function TreeTableComponent_5_ng_template_0_button_20__svg_svg_3_Template(rf, ctx) { if (rf & 1) {
|
|
2490
2511
|
i0.ɵɵnamespaceSVG();
|
|
2491
|
-
i0.ɵɵelementStart(0, "svg",
|
|
2492
|
-
i0.ɵɵelement(1, "path",
|
|
2512
|
+
i0.ɵɵelementStart(0, "svg", 50);
|
|
2513
|
+
i0.ɵɵelement(1, "path", 52);
|
|
2493
2514
|
i0.ɵɵelementEnd();
|
|
2494
2515
|
} }
|
|
2495
2516
|
function TreeTableComponent_5_ng_template_0_button_20_Template(rf, ctx) { if (rf & 1) {
|
|
2496
|
-
const
|
|
2497
|
-
i0.ɵɵelementStart(0, "button",
|
|
2517
|
+
const _r25 = i0.ɵɵgetCurrentView();
|
|
2518
|
+
i0.ɵɵelementStart(0, "button", 48);
|
|
2498
2519
|
i0.ɵɵpipe(1, "translate");
|
|
2499
|
-
i0.ɵɵlistener("click", function TreeTableComponent_5_ng_template_0_button_20_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(
|
|
2500
|
-
i0.ɵɵtemplate(2, TreeTableComponent_5_ng_template_0_button_20__svg_svg_2_Template, 2, 0, "svg",
|
|
2520
|
+
i0.ɵɵlistener("click", function TreeTableComponent_5_ng_template_0_button_20_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r25); const ctx_r2 = i0.ɵɵnextContext(3); const dt_r17 = i0.ɵɵreference(1); return i0.ɵɵresetView(ctx_r2.collapse($event, dt_r17)); });
|
|
2521
|
+
i0.ɵɵtemplate(2, TreeTableComponent_5_ng_template_0_button_20__svg_svg_2_Template, 2, 0, "svg", 49)(3, TreeTableComponent_5_ng_template_0_button_20__svg_svg_3_Template, 2, 0, "svg", 49);
|
|
2501
2522
|
i0.ɵɵelementEnd();
|
|
2502
2523
|
} if (rf & 2) {
|
|
2503
2524
|
const ctx_r2 = i0.ɵɵnextContext(3);
|
|
@@ -2508,21 +2529,21 @@ function TreeTableComponent_5_ng_template_0_button_20_Template(rf, ctx) { if (rf
|
|
|
2508
2529
|
i0.ɵɵproperty("ngIf", !ctx_r2.isCollapse);
|
|
2509
2530
|
} }
|
|
2510
2531
|
function TreeTableComponent_5_ng_template_0_Template(rf, ctx) { if (rf & 1) {
|
|
2511
|
-
const
|
|
2512
|
-
i0.ɵɵelementStart(0, "div",
|
|
2532
|
+
const _r16 = i0.ɵɵgetCurrentView();
|
|
2533
|
+
i0.ɵɵelementStart(0, "div", 27)(1, "div", 28)(2, "div", 29)(3, "form", 30)(4, "div", 31)(5, "input", 32, 1);
|
|
2513
2534
|
i0.ɵɵpipe(7, "translate");
|
|
2514
|
-
i0.ɵɵlistener("input", function TreeTableComponent_5_ng_template_0_Template_input_input_5_listener($event) { i0.ɵɵrestoreView(
|
|
2515
|
-
i0.ɵɵtwoWayListener("ngModelChange", function TreeTableComponent_5_ng_template_0_Template_input_ngModelChange_5_listener($event) { i0.ɵɵrestoreView(
|
|
2535
|
+
i0.ɵɵlistener("input", function TreeTableComponent_5_ng_template_0_Template_input_input_5_listener($event) { i0.ɵɵrestoreView(_r16); i0.ɵɵnextContext(2); const dt_r17 = i0.ɵɵreference(1); return i0.ɵɵresetView(dt_r17.filterGlobal($event.target.value, "contains")); });
|
|
2536
|
+
i0.ɵɵtwoWayListener("ngModelChange", function TreeTableComponent_5_ng_template_0_Template_input_ngModelChange_5_listener($event) { i0.ɵɵrestoreView(_r16); const ctx_r2 = i0.ɵɵnextContext(2); i0.ɵɵtwoWayBindingSet(ctx_r2.searchText, $event) || (ctx_r2.searchText = $event); return i0.ɵɵresetView($event); });
|
|
2516
2537
|
i0.ɵɵelementEnd();
|
|
2517
|
-
i0.ɵɵelementStart(8, "button",
|
|
2538
|
+
i0.ɵɵelementStart(8, "button", 33);
|
|
2518
2539
|
i0.ɵɵpipe(9, "translate");
|
|
2519
|
-
i0.ɵɵlistener("click", function TreeTableComponent_5_ng_template_0_Template_button_click_8_listener($event) { i0.ɵɵrestoreView(
|
|
2520
|
-
i0.ɵɵelement(10, "i",
|
|
2540
|
+
i0.ɵɵlistener("click", function TreeTableComponent_5_ng_template_0_Template_button_click_8_listener($event) { i0.ɵɵrestoreView(_r16); i0.ɵɵnextContext(2); const dt_r17 = i0.ɵɵreference(1); return i0.ɵɵresetView(dt_r17.filterGlobal($event.target.value, "contains")); });
|
|
2541
|
+
i0.ɵɵelement(10, "i", 34);
|
|
2521
2542
|
i0.ɵɵelementEnd()()()();
|
|
2522
|
-
i0.ɵɵelementStart(11, "div",
|
|
2523
|
-
i0.ɵɵlistener("columnsChange", function TreeTableComponent_5_ng_template_0_Template_in_table_columns_multiselect_columnsChange_12_listener($event) { i0.ɵɵrestoreView(
|
|
2543
|
+
i0.ɵɵelementStart(11, "div", 35)(12, "in-table-columns-multiselect", 36);
|
|
2544
|
+
i0.ɵɵlistener("columnsChange", function TreeTableComponent_5_ng_template_0_Template_in_table_columns_multiselect_columnsChange_12_listener($event) { i0.ɵɵrestoreView(_r16); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.columnsChange($event)); });
|
|
2524
2545
|
i0.ɵɵelementEnd()();
|
|
2525
|
-
i0.ɵɵtemplate(13, TreeTableComponent_5_ng_template_0_button_13_Template, 2, 2, "button",
|
|
2546
|
+
i0.ɵɵtemplate(13, TreeTableComponent_5_ng_template_0_button_13_Template, 2, 2, "button", 37)(14, TreeTableComponent_5_ng_template_0_button_14_Template, 2, 2, "button", 37)(15, TreeTableComponent_5_ng_template_0_button_15_Template, 4, 7, "button", 38)(16, TreeTableComponent_5_ng_template_0_button_16_Template, 3, 4, "button", 37)(17, TreeTableComponent_5_ng_template_0_button_17_Template, 2, 2, "button", 37)(18, TreeTableComponent_5_ng_template_0_button_18_Template, 3, 4, "button", 37)(19, TreeTableComponent_5_ng_template_0_button_19_Template, 2, 1, "button", 37)(20, TreeTableComponent_5_ng_template_0_button_20_Template, 4, 5, "button", 39);
|
|
2526
2547
|
i0.ɵɵelementEnd()();
|
|
2527
2548
|
} if (rf & 2) {
|
|
2528
2549
|
const ctx_r2 = i0.ɵɵnextContext(2);
|
|
@@ -2552,12 +2573,11 @@ function TreeTableComponent_5_ng_template_0_Template(rf, ctx) { if (rf & 1) {
|
|
|
2552
2573
|
i0.ɵɵproperty("ngIf", ctx_r2.toolbar.collapse);
|
|
2553
2574
|
} }
|
|
2554
2575
|
function TreeTableComponent_5_Template(rf, ctx) { if (rf & 1) {
|
|
2555
|
-
i0.ɵɵtemplate(0, TreeTableComponent_5_ng_template_0_Template, 21, 18, "ng-template",
|
|
2576
|
+
i0.ɵɵtemplate(0, TreeTableComponent_5_ng_template_0_Template, 21, 18, "ng-template", 26);
|
|
2556
2577
|
} }
|
|
2557
2578
|
class TreeTableComponent {
|
|
2558
2579
|
constructor() {
|
|
2559
2580
|
this.columns = [];
|
|
2560
|
-
this.values = [];
|
|
2561
2581
|
this.selectionMode = null;
|
|
2562
2582
|
this.checkboxSelection = true;
|
|
2563
2583
|
this.activeChange = new EventEmitter();
|
|
@@ -2574,6 +2594,37 @@ class TreeTableComponent {
|
|
|
2574
2594
|
this.isCollapse = true;
|
|
2575
2595
|
this._selection = null;
|
|
2576
2596
|
this._selectionSet = new Set();
|
|
2597
|
+
/** Map: dataKey → TreeNode (built from values for O(1) lookups) */
|
|
2598
|
+
this._nodeMap = new Map();
|
|
2599
|
+
this._values = [];
|
|
2600
|
+
}
|
|
2601
|
+
_buildNodeMap() {
|
|
2602
|
+
this._nodeMap = new Map();
|
|
2603
|
+
const key = this.dataKey || 'id';
|
|
2604
|
+
const visit = (node) => {
|
|
2605
|
+
const k = node?.data?.[key];
|
|
2606
|
+
if (k !== undefined) {
|
|
2607
|
+
this._nodeMap.set(k, node);
|
|
2608
|
+
}
|
|
2609
|
+
(node?.children || []).forEach(visit);
|
|
2610
|
+
};
|
|
2611
|
+
(this.values || []).forEach(visit);
|
|
2612
|
+
}
|
|
2613
|
+
/** All descendant data-keys of a node */
|
|
2614
|
+
_descendantKeys(node) {
|
|
2615
|
+
const key = this.dataKey || 'id';
|
|
2616
|
+
const result = [];
|
|
2617
|
+
const collect = (n) => {
|
|
2618
|
+
(n?.children || []).forEach((c) => {
|
|
2619
|
+
const k = c?.data?.[key];
|
|
2620
|
+
if (k !== undefined) {
|
|
2621
|
+
result.push(k);
|
|
2622
|
+
}
|
|
2623
|
+
collect(c);
|
|
2624
|
+
});
|
|
2625
|
+
};
|
|
2626
|
+
collect(node);
|
|
2627
|
+
return result;
|
|
2577
2628
|
}
|
|
2578
2629
|
_rebuildSelectionSet(val) {
|
|
2579
2630
|
this._selectionSet = new Set();
|
|
@@ -2587,29 +2638,104 @@ class TreeTableComponent {
|
|
|
2587
2638
|
}
|
|
2588
2639
|
}
|
|
2589
2640
|
}
|
|
2590
|
-
|
|
2641
|
+
/** True if some (not all) descendants are selected → show indeterminate (-) */
|
|
2642
|
+
_isIndeterminate(rowData) {
|
|
2643
|
+
const key = this.dataKey || 'id';
|
|
2644
|
+
const node = this._nodeMap.get(rowData?.[key]);
|
|
2645
|
+
if (!node?.children?.length) {
|
|
2646
|
+
return false;
|
|
2647
|
+
}
|
|
2648
|
+
const descKeys = this._descendantKeys(node);
|
|
2649
|
+
if (!descKeys.length) {
|
|
2650
|
+
return false;
|
|
2651
|
+
}
|
|
2652
|
+
const selectedCount = descKeys.filter(k => this._selectionSet.has(k)).length;
|
|
2653
|
+
return selectedCount > 0 && selectedCount < descKeys.length;
|
|
2654
|
+
}
|
|
2655
|
+
_isAllSelected() {
|
|
2656
|
+
if (!this.values || this.values.length === 0) {
|
|
2657
|
+
return false;
|
|
2658
|
+
}
|
|
2659
|
+
return this._selectionSet.size >= this.values.length;
|
|
2660
|
+
}
|
|
2661
|
+
_onHeaderCheckboxChange(event) {
|
|
2662
|
+
const checked = event.target.checked;
|
|
2663
|
+
const key = this.dataKey || 'id';
|
|
2664
|
+
if (checked) {
|
|
2665
|
+
this._selectionSet = new Set((this.values || []).flatMap(node => this._flattenTree(node)).map(row => row?.[key] ?? row));
|
|
2666
|
+
this._selection = (this.values || []).flatMap(node => this._flattenTreeNodes(node));
|
|
2667
|
+
}
|
|
2668
|
+
else {
|
|
2669
|
+
this._selectionSet = new Set();
|
|
2670
|
+
this._selection = [];
|
|
2671
|
+
}
|
|
2672
|
+
this.selectionValue = this._selection;
|
|
2673
|
+
}
|
|
2674
|
+
_flattenTree(node) {
|
|
2675
|
+
const key = this.dataKey || 'id';
|
|
2676
|
+
const data = node?.data ?? node;
|
|
2677
|
+
const result = [data];
|
|
2678
|
+
if (node?.children?.length) {
|
|
2679
|
+
for (const child of node.children) {
|
|
2680
|
+
result.push(...this._flattenTree(child));
|
|
2681
|
+
}
|
|
2682
|
+
}
|
|
2683
|
+
return result;
|
|
2684
|
+
}
|
|
2685
|
+
_flattenTreeNodes(node) {
|
|
2686
|
+
const result = [node];
|
|
2687
|
+
if (node?.children?.length) {
|
|
2688
|
+
for (const child of node.children) {
|
|
2689
|
+
result.push(...this._flattenTreeNodes(child));
|
|
2690
|
+
}
|
|
2691
|
+
}
|
|
2692
|
+
return result;
|
|
2693
|
+
}
|
|
2694
|
+
/** rowData = plain data object from template let-rowData="rowData" */
|
|
2695
|
+
_isRowSelected(rowData) {
|
|
2591
2696
|
const key = this.dataKey || 'id';
|
|
2592
|
-
|
|
2593
|
-
return this._selectionSet.has(data?.[key] ?? data);
|
|
2697
|
+
return this._selectionSet.has(rowData?.[key] ?? rowData);
|
|
2594
2698
|
}
|
|
2595
|
-
|
|
2699
|
+
/** rowNode = PrimeNG TreeNode (for selection state), rowData = plain data (for key lookup) */
|
|
2700
|
+
_onCheckboxChange(event, rowNode, rowData) {
|
|
2596
2701
|
const checked = event.target.checked;
|
|
2597
2702
|
const key = this.dataKey || 'id';
|
|
2598
|
-
const
|
|
2599
|
-
const
|
|
2703
|
+
const rowKey = rowData?.[key] ?? rowData;
|
|
2704
|
+
const node = this._nodeMap.get(rowKey);
|
|
2705
|
+
const descKeys = node ? this._descendantKeys(node) : [];
|
|
2600
2706
|
if (checked) {
|
|
2707
|
+
// Select this node + all descendants
|
|
2601
2708
|
this._selectionSet.add(rowKey);
|
|
2602
|
-
|
|
2709
|
+
descKeys.forEach(k => this._selectionSet.add(k));
|
|
2710
|
+
const keysToAdd = new Set([rowKey, ...descKeys]);
|
|
2711
|
+
const existing = new Set((this._selection || []).map((i) => (i?.data ?? i)?.[key]));
|
|
2712
|
+
const toAdd = [];
|
|
2713
|
+
keysToAdd.forEach(k => {
|
|
2714
|
+
if (!existing.has(k)) {
|
|
2715
|
+
const n = this._nodeMap.get(k);
|
|
2716
|
+
if (n) {
|
|
2717
|
+
toAdd.push(n);
|
|
2718
|
+
}
|
|
2719
|
+
}
|
|
2720
|
+
});
|
|
2721
|
+
this._selection = [...(this._selection || []), ...toAdd];
|
|
2603
2722
|
}
|
|
2604
2723
|
else {
|
|
2605
|
-
this
|
|
2724
|
+
// Deselect this node + all descendants
|
|
2725
|
+
const keysToRemove = new Set([rowKey, ...descKeys]);
|
|
2726
|
+
keysToRemove.forEach(k => this._selectionSet.delete(k));
|
|
2606
2727
|
this._selection = (this._selection || []).filter((item) => {
|
|
2607
2728
|
const d = item?.data ?? item;
|
|
2608
|
-
return (d?.[key] ?? d)
|
|
2729
|
+
return !keysToRemove.has(d?.[key] ?? d);
|
|
2609
2730
|
});
|
|
2610
2731
|
}
|
|
2611
2732
|
this.selectionValue = this._selection;
|
|
2612
2733
|
}
|
|
2734
|
+
set values(val) {
|
|
2735
|
+
this._values = val;
|
|
2736
|
+
this._buildNodeMap();
|
|
2737
|
+
}
|
|
2738
|
+
get values() { return this._values; }
|
|
2613
2739
|
set selection(val) {
|
|
2614
2740
|
this._selection = val;
|
|
2615
2741
|
this._rebuildSelectionSet(val);
|
|
@@ -2711,7 +2837,7 @@ class TreeTableComponent {
|
|
|
2711
2837
|
} if (rf & 2) {
|
|
2712
2838
|
let _t;
|
|
2713
2839
|
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.templates = _t);
|
|
2714
|
-
} }, inputs: { columns: "columns",
|
|
2840
|
+
} }, inputs: { columns: "columns", scrollHeight: "scrollHeight", scrollable: "scrollable", selectionMode: "selectionMode", label: "label", error: "error", class: "class", required: "required", style: "style", toolbar: "toolbar", checkboxSelection: "checkboxSelection", active: "active", sortField: "sortField", isAscending: "isAscending", dataKey: "dataKey", values: "values", selection: "selection" }, outputs: { activeChange: "activeChange", selectionChange: "selectionChange", addAction: "addAction", csvAction: "csvAction", saveAction: "saveAction", collapseAction: "collapseAction", removeAction: "removeAction", unlinkAction: "unlinkAction", groupEditAction: "groupEditAction", groupAddAction: "groupAddAction" }, standalone: false, decls: 6, vars: 14, consts: [["dt", ""], ["searchTextInput", ""], ["columnResizeMode", "expand", 3, "selectionChange", "selection", "columns", "resizableColumns", "scrollHeight", "scrollable", "selectionMode", "sortField", "sortOrder", "value"], ["pTemplate", "colgroup"], ["pTemplate", "header"], ["pTemplate", "body"], [4, "ngIf"], ["style", "width:44px;", 4, "ngIf"], [3, "width", 4, "ngFor", "ngForOf"], [2, "width", "44px"], ["class", "u-position-relative", "ttResizableColumn", "", 3, "ttSortableColumn", 4, "ngFor", "ngForOf"], ["type", "checkbox", 1, "in-table-checkbox", 3, "change", "click", "checked"], ["ttResizableColumn", "", 1, "u-position-relative", 3, "ttSortableColumn"], [1, "p-treetable-thead-title", 3, "title"], [1, "p-sortable-column-buttons", 3, "field"], [1, "row", 3, "ngClass", "ttSelectableRow"], ["class", "_u-overflow-visible", 3, "click", 4, "ngFor", "ngForOf"], ["type", "checkbox", 1, "in-table-checkbox", 3, "change", "click", "checked", "indeterminate"], [1, "_u-overflow-visible", 3, "click"], [1, "", 2, "display", "flex", "flex-wrap", "nowrap"], [3, "ngIf"], [1, "p-treetable-tbody-content", "cell-content_hover", 2, "flex-grow", "1", 3, "ngClass", "title"], [4, "ngTemplateOutlet", "ngTemplateOutletContext"], [2, "align-self", "center", 3, "rowNode"], ["class", "u-margin-right-tiny", 3, "ngClass", 4, "ngIf"], [1, "u-margin-right-tiny", 3, "ngClass"], ["pTemplate", "caption"], [1, "o-grid", "o-grid_no-gutter"], [1, "c-tree-table__toolbar-content", "u-display-inline-flex"], [1, "c-form", "c-form_inline", "u-display-inline-block"], [1, "c-label"], [1, "input-wrapper", "u-margin-right-tiny"], ["autofocus", "", "pInputText", "", "required", "", "tabindex", "1", "type", "search", 1, "search-box", "c-input", "c-input_small", "ng-pristine", "ng-valid", "ng-scope", "ng-empty", "ng-touched", 2, "padding-right", "28px", 3, "input", "ngModelChange", "ngModel", "ngModelOptions", "placeholder"], ["type", "reset", 1, "button-reset", 3, "click"], [1, "in", "in-close"], [1, "c-btn", "c-btn_border-free", "c-btn_small"], [3, "columnsChange", "columns"], ["class", "c-btn c-btn_border-free c-btn_small", 3, "disabled", "click", 4, "ngIf"], ["class", "c-btn c-btn_primary c-btn_small", 3, "disabled", "title", "click", 4, "ngIf"], ["class", "c-btn c-btn_small c-btn_svg-24 c-icon c-icon_svg c-icon_svg-24 c-btn_border-free", 3, "title", "click", 4, "ngIf"], [1, "c-btn", "c-btn_border-free", "c-btn_small", 3, "click", "disabled"], [1, "in", "in-plus", 3, "title"], [1, "in", "in-folder-closed", 3, "title"], [1, "c-btn", "c-btn_primary", "c-btn_small", 3, "click", "disabled", "title"], [1, "in", "in-pencil", 3, "title"], [1, "in", "in-trash", 3, "title"], [1, "in", "in-link-off", 3, "title"], ["title", "\u0421\u043E\u0445\u0440\u0430\u043D\u0438\u0442\u044C \u043A\u0430\u043A CSV", 1, "in", "in-file-excel-outline"], [1, "c-btn", "c-btn_small", "c-btn_svg-24", "c-icon", "c-icon_svg", "c-icon_svg-24", "c-btn_border-free", 3, "click", "title"], ["xmlns", "http://www.w3.org/2000/svg", "width", "24", "height", "24", "fill", "currentColor", "viewBox", "0 0 24 24", 4, "ngIf"], ["xmlns", "http://www.w3.org/2000/svg", "width", "24", "height", "24", "fill", "currentColor", "viewBox", "0 0 24 24"], ["d", "M20 2H4v2h16V2zM4 20v2h16v-2H4zM12 5l5 6H7l5-6zM17 13l-5 6-5-6h10z"], ["fill-rule", "evenodd", "d", "M17 3l-5 6-5-6h10zM4 13v-2h16v2H4zm8 2l5 6H7l5-6z", "clip-rule", "evenodd"]], template: function TreeTableComponent_Template(rf, ctx) { if (rf & 1) {
|
|
2715
2841
|
const _r1 = i0.ɵɵgetCurrentView();
|
|
2716
2842
|
i0.ɵɵelementStart(0, "p-treeTable", 2, 0);
|
|
2717
2843
|
i0.ɵɵtwoWayListener("selectionChange", function TreeTableComponent_Template_p_treeTable_selectionChange_0_listener($event) { i0.ɵɵrestoreView(_r1); i0.ɵɵtwoWayBindingSet(ctx.selectionValue, $event) || (ctx.selectionValue = $event); return i0.ɵɵresetView($event); });
|
|
@@ -2724,15 +2850,13 @@ class TreeTableComponent {
|
|
|
2724
2850
|
i0.ɵɵproperty("columns", ctx.visibleColumns())("resizableColumns", true)("scrollHeight", ctx.scrollHeight)("scrollable", ctx.scrollable)("selectionMode", ctx.selectionMode)("sortField", ctx.sortField || "id")("sortOrder", ctx.isAscending ? 1 : -1)("value", ctx.values);
|
|
2725
2851
|
i0.ɵɵadvance(5);
|
|
2726
2852
|
i0.ɵɵproperty("ngIf", ctx.toolbar);
|
|
2727
|
-
} }, dependencies: [i1$2.NgClass, i1$2.NgForOf, i1$2.NgIf, i1$2.NgTemplateOutlet, i2$4.TreeTable, i2.PrimeTemplate, i2$4.TreeTableToggler, i2$4.TTSortableColumn, i2$4.TTSortIcon, i2$4.TTResizableColumn, i2$4.TTSelectableRow, i2$
|
|
2853
|
+
} }, dependencies: [i1$2.NgClass, i1$2.NgForOf, i1$2.NgIf, i1$2.NgTemplateOutlet, i2$4.TreeTable, i2.PrimeTemplate, i2$4.TreeTableToggler, i2$4.TTSortableColumn, i2$4.TTSortIcon, i2$4.TTResizableColumn, i2$4.TTSelectableRow, i2$1.ɵNgNoValidate, i2$1.DefaultValueAccessor, i2$1.NgControlStatus, i2$1.NgControlStatusGroup, i2$1.RequiredValidator, i2$1.NgModel, i2$1.NgForm, TableColumnsMultiselectComponent, PropertyValuePipe, i1.TranslatePipe], styles: ["@charset \"UTF-8\";.p-sortable-column[_ngcontent-%COMP%]{cursor:pointer;position:relative}.theme-light[_nghost-%COMP%] .in-table-checkbox[_ngcontent-%COMP%], .theme-light [_nghost-%COMP%] .in-table-checkbox[_ngcontent-%COMP%], .theme-contrast[_nghost-%COMP%] .in-table-checkbox[_ngcontent-%COMP%], .theme-contrast [_nghost-%COMP%] .in-table-checkbox[_ngcontent-%COMP%]{border-color:#00000073}.theme-light[_nghost-%COMP%] .in-table-checkbox[_ngcontent-%COMP%]:hover:not(:checked):not(:indeterminate), .theme-light [_nghost-%COMP%] .in-table-checkbox[_ngcontent-%COMP%]:hover:not(:checked):not(:indeterminate), .theme-contrast[_nghost-%COMP%] .in-table-checkbox[_ngcontent-%COMP%]:hover:not(:checked):not(:indeterminate), .theme-contrast [_nghost-%COMP%] .in-table-checkbox[_ngcontent-%COMP%]:hover:not(:checked):not(:indeterminate){border-color:#000000b3}.in-table-checkbox[_ngcontent-%COMP%]{appearance:none;-webkit-appearance:none;width:var(--p-checkbox-width, 20px);height:var(--p-checkbox-height, 20px);border:1px solid var(--p-checkbox-border-color, #B3B3B3);border-radius:var(--p-checkbox-border-radius, 2px);background:var(--p-checkbox-background, transparent);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;flex-shrink:0;transition:border-color var(--p-checkbox-transition-duration, .15s),background var(--p-checkbox-transition-duration, .15s)}.in-table-checkbox[_ngcontent-%COMP%]:checked{background:var(--p-checkbox-checked-background, #387382);border-color:var(--p-checkbox-checked-border-color, #387382)}.in-table-checkbox[_ngcontent-%COMP%]:checked:after{content:\"\";display:block;width:var(--p-checkbox-icon-size, 14px);height:var(--p-checkbox-icon-size, 14px);background-color:var(--p-checkbox-icon-checked-color, #ffffff);mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath fill='currentColor' d='M5.25 10.15l-2.8-2.8-.7.7 3.5 3.5 7.5-7.5-.7-.7z'/%3E%3C/svg%3E\");-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath fill='currentColor' d='M5.25 10.15l-2.8-2.8-.7.7 3.5 3.5 7.5-7.5-.7-.7z'/%3E%3C/svg%3E\");mask-size:contain;-webkit-mask-size:contain;mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;mask-position:center;-webkit-mask-position:center}.in-table-checkbox[_ngcontent-%COMP%]:indeterminate{background:var(--p-checkbox-checked-background, #387382);border-color:var(--p-checkbox-checked-border-color, #387382)}.in-table-checkbox[_ngcontent-%COMP%]:indeterminate:after{content:\"\";display:block;width:calc(var(--p-checkbox-icon-size, 14px) - 2px);height:2px;background-color:var(--p-checkbox-icon-checked-color, #ffffff);margin:auto}.in-table-checkbox[_ngcontent-%COMP%]:hover:not(:checked):not(:indeterminate){border-color:var(--p-checkbox-hover-border-color, #999999)}.p-sortable-column-buttons[_ngcontent-%COMP%]{position:absolute;top:0;right:0;width:18px;height:100%;display:inline-flex;align-items:center;z-index:10000}.p-sortable-column-buttons[_ngcontent-%COMP%] > a[_ngcontent-%COMP%]{position:absolute;top:50%;right:0;left:0;transform:translateY(-50%)}.u-overflow-visible[_ngcontent-%COMP%]{overflow:visible!important}.button-reset[_ngcontent-%COMP%]{display:flex;align-items:center;position:absolute;right:6px;top:5px;padding:6px;font-size:15px;border:none;outline:0;cursor:pointer;color:var(--colorTextMuted);background-color:transparent}.button-reset[_ngcontent-%COMP%]:hover{color:var(--colorIcon)}.input-wrapper[_ngcontent-%COMP%]{position:relative;display:flex;align-items:baseline}.c-input[_ngcontent-%COMP%]:not(:valid) ~ .button-reset[_ngcontent-%COMP%]{display:none}"] }); }
|
|
2728
2854
|
}
|
|
2729
2855
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TreeTableComponent, [{
|
|
2730
2856
|
type: Component,
|
|
2731
|
-
args: [{ standalone: false, selector: 'in-tree-table', template: "<p-treeTable #dt\r\n [(selection)]=\"selectionValue\"\r\n [class]=\"class\"\r\n [columns]=\"visibleColumns()\"\r\n [resizableColumns]=\"true\"\r\n [scrollHeight]=\"scrollHeight\"\r\n [scrollable]=\"scrollable\"\r\n [selectionMode]=\"selectionMode\"\r\n [sortField]=\"sortField || 'id'\"\r\n [sortOrder]=\"isAscending ? 1 : -1\"\r\n [style]=\"style\"\r\n [value]=\"values\"\r\n columnResizeMode=\"expand\"\r\n>\r\n <ng-template let-columns pTemplate=\"colgroup\">\r\n <colgroup>\r\n <col *ngIf=\"checkboxSelection\" style=\"width:44px;\">\r\n <col *ngFor=\"let col of visibleColumns()\" [style.width]=\"col.width ? col.width : '10px'\">\r\n </colgroup>\r\n </ng-template>\r\n <ng-template let-columns pTemplate=\"header\">\r\n <tr>\r\n <th *ngIf=\"checkboxSelection\">\r\n <p-treeTableHeaderCheckbox></p-treeTableHeaderCheckbox>\r\n </th>\r\n <th *ngFor=\"let col of columns; let i = index\" [ttSortableColumn]=\"col.field\" class=\"u-position-relative\"\r\n ttResizableColumn>\r\n <div class=\"p-treetable-thead-title\" title=\"{{col.label | translate}}\">\r\n {{col.label | translate}}\r\n </div>\r\n <p-treeTableSortIcon [field]=\"col.field\" class=\"p-sortable-column-buttons\"></p-treeTableSortIcon>\r\n </th>\r\n </tr>\r\n </ng-template>\r\n\r\n <ng-template let-columns=\"columns\" let-rowData=\"rowData\" let-rowNode pTemplate=\"body\">\r\n <tr [ngClass]=\"{row_active: isRowActive(rowData)}\" [ttSelectableRow]=\"rowNode\" class=\"row\">\r\n <td *ngIf=\"checkboxSelection\">\r\n <input type=\"checkbox\"\r\n class=\"in-table-checkbox\"\r\n [checked]=\"_isRowSelected(rowNode)\"\r\n (change)=\"_onCheckboxChange($event, rowNode)\"\r\n (click)=\"$event.stopPropagation()\"\r\n >\r\n </td>\r\n <td (click)=\"activeChange.emit(rowData)\" *ngFor=\"let col of columns; let i = index\"\r\n class=\"_u-overflow-visible\">\r\n <div class=\"\" style=\"display: flex; flex-wrap: nowrap;\">\r\n <ng-template [ngIf]=\"i == 0\">\r\n <p-treeTableToggler [rowNode]=\"rowNode\" style=\"align-self: center;\"></p-treeTableToggler>\r\n </ng-template>\r\n <div [ngClass]=\"{ 'p-treetable-tbody-content_has-toggler ': i == 0 }\"\r\n class=\"p-treetable-tbody-content cell-content_hover\"\r\n style=\"flex-grow: 1;\"\r\n title=\"{{rowData | propertyValue: col.field}}\">\r\n <ng-container *ngIf=\"!valueTemplate\">\r\n <i *ngIf=\"rowData.icon && i == 0\" [ngClass]=\"rowData.icon\" class=\"u-margin-right-tiny\"></i>\r\n {{rowData | propertyValue: col.field}}\r\n </ng-container>\r\n\r\n <ng-container\r\n *ngTemplateOutlet=\"valueTemplate; context: {$implicit: { data: rowData, col: col}}\"></ng-container>\r\n </div>\r\n </div>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n\r\n <ng-template *ngIf=\"toolbar\" pTemplate=\"caption\">\r\n\r\n <div class=\"o-grid o-grid_no-gutter\">\r\n <div class=\"c-tree-table__toolbar-content u-display-inline-flex\">\r\n <div class=\"c-form c-form_inline u-display-inline-block\">\r\n <form class=\"c-label\">\r\n <div class=\"input-wrapper u-margin-right-tiny\">\r\n <input #searchTextInput\r\n (input)=\"dt.filterGlobal($any($event.target).value, 'contains')\"\r\n [(ngModel)]=\"searchText\"\r\n [ngModelOptions]=\"{standalone: true}\"\r\n autofocus=\"\"\r\n class=\"search-box c-input c-input_small ng-pristine ng-valid ng-scope ng-empty ng-touched\"\r\n pInputText\r\n placeholder=\"{{('SHARED.SEARCH' | translate) + ':'}}\"\r\n required\r\n style=\"padding-right: 28px\"\r\n tabindex=\"1\"\r\n type=\"search\"\r\n >\r\n <button (click)=\"dt.filterGlobal($any($event.target).value, 'contains')\" class=\"button-reset\" type=\"reset\"\r\n [attr.title]=\"'Reset' | translate\">\r\n <i class=\"in in-close\"></i>\r\n </button>\r\n </div>\r\n </form>\r\n </div>\r\n <div class=\"c-btn c-btn_border-free c-btn_small\">\r\n <in-table-columns-multiselect (columnsChange)=\"columnsChange($event)\"\r\n [columns]=\"columns\"></in-table-columns-multiselect>\r\n </div>\r\n\r\n <button (click)=\"addAction.emit($event)\" *ngIf=\"toolbar.add\" [disabled]=\"toolbar.add.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\"\r\n >\r\n <i class=\"in in-plus\" [title]=\"toolbar.add.title || '\u0414\u043E\u0431\u0430\u0432\u0438\u0442\u044C'\"></i>\r\n </button>\r\n\r\n <button (click)=\"groupAddAction.emit($event)\" *ngIf=\"toolbar.groupAdd\" [disabled]=\"toolbar.groupAdd.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\"\r\n >\r\n <i class=\"in in-folder-closed\" [title]=\"toolbar.groupAdd.title || '\u0414\u043E\u0431\u0430\u0432\u0438\u0442\u044C \u0433\u0440\u0443\u043F\u043F\u0443'\"></i>\r\n </button>\r\n\r\n\r\n <button (click)=\"saveAction.emit($event)\" *ngIf=\"toolbar.save\"\r\n [disabled]=\"toolbar.save.disabled\"\r\n class=\"c-btn c-btn_primary c-btn_small\"\r\n title=\"{{'Save' | translate}}\"\r\n >\r\n {{'Save' | translate}}\r\n </button>\r\n <button (click)=\"groupEditAction.emit($event)\" *ngIf=\"toolbar.groupEdit && toolbar.groupEdit.active\"\r\n [disabled]=\"toolbar.groupEdit.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\">\r\n <i class=\"in in-pencil\" title=\"{{'groupEdit' | translate}}\"></i>\r\n </button>\r\n <button (click)=\"removeAction.emit($event)\" *ngIf=\"toolbar.remove && toolbar.remove.active\"\r\n [disabled]=\"toolbar.remove.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\">\r\n <i class=\"in in-trash\" [title]=\"toolbar.remove?.title || '\u0423\u0434\u0430\u043B\u0438\u0442\u044C'\"></i>\r\n </button>\r\n <button (click)=\"unlinkAction.emit($event)\" *ngIf=\"toolbar.unlink\" [disabled]=\"toolbar.unlink.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\">\r\n <i class=\"in in-link-off\" title=\"{{'Detach tag from selected items' | translate}}\"></i>\r\n </button>\r\n <button (click)=\"csvAction.emit($event)\" *ngIf=\"toolbar.csv\" [disabled]=\"toolbar.csv.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\"\r\n >\r\n<!-- Todo: \u0437\u0430\u043C\u0435\u043D\u0438\u0442\u044C \u043D\u0430 in-file-csv-->\r\n <i class=\"in in-file-excel-outline\" title=\"\u0421\u043E\u0445\u0440\u0430\u043D\u0438\u0442\u044C \u043A\u0430\u043A CSV\"></i>\r\n </button>\r\n <button *ngIf=\"toolbar.collapse\"\r\n class=\"c-btn c-btn_small c-btn_svg-24 c-icon c-icon_svg c-icon_svg-24 c-btn_border-free\"\r\n (click)=\"collapse($event, dt)\"\r\n title=\"{{(isCollapse ? 'Expand all' : 'Collapse all') | translate}}\">\r\n <svg *ngIf=\"isCollapse\" xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\r\n <path d=\"M20 2H4v2h16V2zM4 20v2h16v-2H4zM12 5l5 6H7l5-6zM17 13l-5 6-5-6h10z\"/>\r\n </svg>\r\n <svg *ngIf=\"!isCollapse\" xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\r\n <path fill-rule=\"evenodd\" d=\"M17 3l-5 6-5-6h10zM4 13v-2h16v2H4zm8 2l5 6H7l5-6z\" clip-rule=\"evenodd\"/>\r\n </svg>\r\n </button>\r\n </div>\r\n </div>\r\n </ng-template>\r\n</p-treeTable>\r\n", styles: ["@charset \"UTF-8\";.p-sortable-column{cursor:pointer;position:relative}.p-sortable-column-buttons{position:absolute;top:0;right:0;width:18px;height:100%;display:inline-flex;align-items:center;z-index:10000}.p-sortable-column-buttons>a{position:absolute;top:50%;right:0;left:0;transform:translateY(-50%)}.u-overflow-visible{overflow:visible!important}.button-reset{display:flex;align-items:center;position:absolute;right:6px;top:5px;padding:6px;font-size:15px;border:none;outline:0;cursor:pointer;color:var(--colorTextMuted);background-color:transparent}.button-reset:hover{color:var(--colorIcon)}.input-wrapper{position:relative;display:flex;align-items:baseline}.c-input:not(:valid)~.button-reset{display:none}\n"] }]
|
|
2857
|
+
args: [{ standalone: false, selector: 'in-tree-table', template: "<p-treeTable #dt\r\n [(selection)]=\"selectionValue\"\r\n [class]=\"class\"\r\n [columns]=\"visibleColumns()\"\r\n [resizableColumns]=\"true\"\r\n [scrollHeight]=\"scrollHeight\"\r\n [scrollable]=\"scrollable\"\r\n [selectionMode]=\"selectionMode\"\r\n [sortField]=\"sortField || 'id'\"\r\n [sortOrder]=\"isAscending ? 1 : -1\"\r\n [style]=\"style\"\r\n [value]=\"values\"\r\n columnResizeMode=\"expand\"\r\n>\r\n <ng-template let-columns pTemplate=\"colgroup\">\r\n <colgroup>\r\n <col *ngIf=\"checkboxSelection\" style=\"width:44px;\">\r\n <col *ngFor=\"let col of visibleColumns()\" [style.width]=\"col.width ? col.width : '10px'\">\r\n </colgroup>\r\n </ng-template>\r\n <ng-template let-columns pTemplate=\"header\">\r\n <tr>\r\n <th *ngIf=\"checkboxSelection\">\r\n <input type=\"checkbox\"\r\n class=\"in-table-checkbox\"\r\n [checked]=\"_isAllSelected()\"\r\n (change)=\"_onHeaderCheckboxChange($event)\"\r\n (click)=\"$event.stopPropagation()\"\r\n >\r\n </th>\r\n <th *ngFor=\"let col of columns; let i = index\" [ttSortableColumn]=\"col.field\" class=\"u-position-relative\"\r\n ttResizableColumn>\r\n <div class=\"p-treetable-thead-title\" title=\"{{col.label | translate}}\">\r\n {{col.label | translate}}\r\n </div>\r\n <p-treeTableSortIcon [field]=\"col.field\" class=\"p-sortable-column-buttons\"></p-treeTableSortIcon>\r\n </th>\r\n </tr>\r\n </ng-template>\r\n\r\n <ng-template let-columns=\"columns\" let-rowData=\"rowData\" let-rowNode pTemplate=\"body\">\r\n <tr [ngClass]=\"{row_active: isRowActive(rowData)}\" [ttSelectableRow]=\"rowNode\" class=\"row\">\r\n <td *ngIf=\"checkboxSelection\">\r\n <!-- rowData = plain data; rowNode = PrimeNG wrapper used for selection cascade -->\r\n <input type=\"checkbox\"\r\n class=\"in-table-checkbox\"\r\n [checked]=\"_isRowSelected(rowData)\"\r\n [indeterminate]=\"_isIndeterminate(rowData)\"\r\n (change)=\"_onCheckboxChange($event, rowNode, rowData)\"\r\n (click)=\"$event.stopPropagation()\"\r\n >\r\n </td>\r\n <td (click)=\"activeChange.emit(rowData)\" *ngFor=\"let col of columns; let i = index\"\r\n class=\"_u-overflow-visible\">\r\n <div class=\"\" style=\"display: flex; flex-wrap: nowrap;\">\r\n <ng-template [ngIf]=\"i == 0\">\r\n <p-treeTableToggler [rowNode]=\"rowNode\" style=\"align-self: center;\"></p-treeTableToggler>\r\n </ng-template>\r\n <div [ngClass]=\"{ 'p-treetable-tbody-content_has-toggler ': i == 0 }\"\r\n class=\"p-treetable-tbody-content cell-content_hover\"\r\n style=\"flex-grow: 1;\"\r\n title=\"{{rowData | propertyValue: col.field}}\">\r\n <ng-container *ngIf=\"!valueTemplate\">\r\n <i *ngIf=\"rowData.icon && i == 0\" [ngClass]=\"rowData.icon\" class=\"u-margin-right-tiny\"></i>\r\n {{rowData | propertyValue: col.field}}\r\n </ng-container>\r\n\r\n <ng-container\r\n *ngTemplateOutlet=\"valueTemplate; context: {$implicit: { data: rowData, col: col}}\"></ng-container>\r\n </div>\r\n </div>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n\r\n <ng-template *ngIf=\"toolbar\" pTemplate=\"caption\">\r\n\r\n <div class=\"o-grid o-grid_no-gutter\">\r\n <div class=\"c-tree-table__toolbar-content u-display-inline-flex\">\r\n <div class=\"c-form c-form_inline u-display-inline-block\">\r\n <form class=\"c-label\">\r\n <div class=\"input-wrapper u-margin-right-tiny\">\r\n <input #searchTextInput\r\n (input)=\"dt.filterGlobal($any($event.target).value, 'contains')\"\r\n [(ngModel)]=\"searchText\"\r\n [ngModelOptions]=\"{standalone: true}\"\r\n autofocus=\"\"\r\n class=\"search-box c-input c-input_small ng-pristine ng-valid ng-scope ng-empty ng-touched\"\r\n pInputText\r\n placeholder=\"{{('SHARED.SEARCH' | translate) + ':'}}\"\r\n required\r\n style=\"padding-right: 28px\"\r\n tabindex=\"1\"\r\n type=\"search\"\r\n >\r\n <button (click)=\"dt.filterGlobal($any($event.target).value, 'contains')\" class=\"button-reset\" type=\"reset\"\r\n [attr.title]=\"'Reset' | translate\">\r\n <i class=\"in in-close\"></i>\r\n </button>\r\n </div>\r\n </form>\r\n </div>\r\n <div class=\"c-btn c-btn_border-free c-btn_small\">\r\n <in-table-columns-multiselect (columnsChange)=\"columnsChange($event)\"\r\n [columns]=\"columns\"></in-table-columns-multiselect>\r\n </div>\r\n\r\n <button (click)=\"addAction.emit($event)\" *ngIf=\"toolbar.add\" [disabled]=\"toolbar.add.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\"\r\n >\r\n <i class=\"in in-plus\" [title]=\"toolbar.add.title || '\u0414\u043E\u0431\u0430\u0432\u0438\u0442\u044C'\"></i>\r\n </button>\r\n\r\n <button (click)=\"groupAddAction.emit($event)\" *ngIf=\"toolbar.groupAdd\" [disabled]=\"toolbar.groupAdd.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\"\r\n >\r\n <i class=\"in in-folder-closed\" [title]=\"toolbar.groupAdd.title || '\u0414\u043E\u0431\u0430\u0432\u0438\u0442\u044C \u0433\u0440\u0443\u043F\u043F\u0443'\"></i>\r\n </button>\r\n\r\n\r\n <button (click)=\"saveAction.emit($event)\" *ngIf=\"toolbar.save\"\r\n [disabled]=\"toolbar.save.disabled\"\r\n class=\"c-btn c-btn_primary c-btn_small\"\r\n title=\"{{'Save' | translate}}\"\r\n >\r\n {{'Save' | translate}}\r\n </button>\r\n <button (click)=\"groupEditAction.emit($event)\" *ngIf=\"toolbar.groupEdit && toolbar.groupEdit.active\"\r\n [disabled]=\"toolbar.groupEdit.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\">\r\n <i class=\"in in-pencil\" title=\"{{'groupEdit' | translate}}\"></i>\r\n </button>\r\n <button (click)=\"removeAction.emit($event)\" *ngIf=\"toolbar.remove && toolbar.remove.active\"\r\n [disabled]=\"toolbar.remove.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\">\r\n <i class=\"in in-trash\" [title]=\"toolbar.remove?.title || '\u0423\u0434\u0430\u043B\u0438\u0442\u044C'\"></i>\r\n </button>\r\n <button (click)=\"unlinkAction.emit($event)\" *ngIf=\"toolbar.unlink\" [disabled]=\"toolbar.unlink.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\">\r\n <i class=\"in in-link-off\" title=\"{{'Detach tag from selected items' | translate}}\"></i>\r\n </button>\r\n <button (click)=\"csvAction.emit($event)\" *ngIf=\"toolbar.csv\" [disabled]=\"toolbar.csv.disabled\"\r\n class=\"c-btn c-btn_border-free c-btn_small\"\r\n >\r\n<!-- Todo: \u0437\u0430\u043C\u0435\u043D\u0438\u0442\u044C \u043D\u0430 in-file-csv-->\r\n <i class=\"in in-file-excel-outline\" title=\"\u0421\u043E\u0445\u0440\u0430\u043D\u0438\u0442\u044C \u043A\u0430\u043A CSV\"></i>\r\n </button>\r\n <button *ngIf=\"toolbar.collapse\"\r\n class=\"c-btn c-btn_small c-btn_svg-24 c-icon c-icon_svg c-icon_svg-24 c-btn_border-free\"\r\n (click)=\"collapse($event, dt)\"\r\n title=\"{{(isCollapse ? 'Expand all' : 'Collapse all') | translate}}\">\r\n <svg *ngIf=\"isCollapse\" xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\r\n <path d=\"M20 2H4v2h16V2zM4 20v2h16v-2H4zM12 5l5 6H7l5-6zM17 13l-5 6-5-6h10z\"/>\r\n </svg>\r\n <svg *ngIf=\"!isCollapse\" xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\r\n <path fill-rule=\"evenodd\" d=\"M17 3l-5 6-5-6h10zM4 13v-2h16v2H4zm8 2l5 6H7l5-6z\" clip-rule=\"evenodd\"/>\r\n </svg>\r\n </button>\r\n </div>\r\n </div>\r\n </ng-template>\r\n</p-treeTable>\r\n", styles: ["@charset \"UTF-8\";.p-sortable-column{cursor:pointer;position:relative}:host-context(.theme-light) .in-table-checkbox,:host-context(.theme-contrast) .in-table-checkbox{border-color:#00000073}:host-context(.theme-light) .in-table-checkbox:hover:not(:checked):not(:indeterminate),:host-context(.theme-contrast) .in-table-checkbox:hover:not(:checked):not(:indeterminate){border-color:#000000b3}.in-table-checkbox{appearance:none;-webkit-appearance:none;width:var(--p-checkbox-width, 20px);height:var(--p-checkbox-height, 20px);border:1px solid var(--p-checkbox-border-color, #B3B3B3);border-radius:var(--p-checkbox-border-radius, 2px);background:var(--p-checkbox-background, transparent);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;flex-shrink:0;transition:border-color var(--p-checkbox-transition-duration, .15s),background var(--p-checkbox-transition-duration, .15s)}.in-table-checkbox:checked{background:var(--p-checkbox-checked-background, #387382);border-color:var(--p-checkbox-checked-border-color, #387382)}.in-table-checkbox:checked:after{content:\"\";display:block;width:var(--p-checkbox-icon-size, 14px);height:var(--p-checkbox-icon-size, 14px);background-color:var(--p-checkbox-icon-checked-color, #ffffff);mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath fill='currentColor' d='M5.25 10.15l-2.8-2.8-.7.7 3.5 3.5 7.5-7.5-.7-.7z'/%3E%3C/svg%3E\");-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath fill='currentColor' d='M5.25 10.15l-2.8-2.8-.7.7 3.5 3.5 7.5-7.5-.7-.7z'/%3E%3C/svg%3E\");mask-size:contain;-webkit-mask-size:contain;mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;mask-position:center;-webkit-mask-position:center}.in-table-checkbox:indeterminate{background:var(--p-checkbox-checked-background, #387382);border-color:var(--p-checkbox-checked-border-color, #387382)}.in-table-checkbox:indeterminate:after{content:\"\";display:block;width:calc(var(--p-checkbox-icon-size, 14px) - 2px);height:2px;background-color:var(--p-checkbox-icon-checked-color, #ffffff);margin:auto}.in-table-checkbox:hover:not(:checked):not(:indeterminate){border-color:var(--p-checkbox-hover-border-color, #999999)}.p-sortable-column-buttons{position:absolute;top:0;right:0;width:18px;height:100%;display:inline-flex;align-items:center;z-index:10000}.p-sortable-column-buttons>a{position:absolute;top:50%;right:0;left:0;transform:translateY(-50%)}.u-overflow-visible{overflow:visible!important}.button-reset{display:flex;align-items:center;position:absolute;right:6px;top:5px;padding:6px;font-size:15px;border:none;outline:0;cursor:pointer;color:var(--colorTextMuted);background-color:transparent}.button-reset:hover{color:var(--colorIcon)}.input-wrapper{position:relative;display:flex;align-items:baseline}.c-input:not(:valid)~.button-reset{display:none}\n"] }]
|
|
2732
2858
|
}], null, { columns: [{
|
|
2733
2859
|
type: Input
|
|
2734
|
-
}], values: [{
|
|
2735
|
-
type: Input
|
|
2736
2860
|
}], scrollHeight: [{
|
|
2737
2861
|
type: Input
|
|
2738
2862
|
}], scrollable: [{
|
|
@@ -2784,6 +2908,8 @@ class TreeTableComponent {
|
|
|
2784
2908
|
type: Output
|
|
2785
2909
|
}], groupAddAction: [{
|
|
2786
2910
|
type: Output
|
|
2911
|
+
}], values: [{
|
|
2912
|
+
type: Input
|
|
2787
2913
|
}], selection: [{
|
|
2788
2914
|
type: Input
|
|
2789
2915
|
}] }); })();
|