myrta-ui 1.1.67 → 1.1.68
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/esm2020/lib/components/form/input-text/input-text.component.mjs +2 -1
- package/esm2020/lib/components/form/input-textarea/input-textarea.component.mjs +2 -1
- package/esm2020/lib/components/table/table.component.mjs +3 -3
- package/fesm2015/myrta-ui.mjs +4 -2
- package/fesm2015/myrta-ui.mjs.map +1 -1
- package/fesm2020/myrta-ui.mjs +4 -2
- package/fesm2020/myrta-ui.mjs.map +1 -1
- package/package.json +1 -1
package/fesm2020/myrta-ui.mjs
CHANGED
|
@@ -4019,7 +4019,7 @@ class TableComponent {
|
|
|
4019
4019
|
}
|
|
4020
4020
|
}
|
|
4021
4021
|
TableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: TableComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
4022
|
-
TableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: TableComponent, selector: "mrx-table", inputs: { type: "type", data: "data", pageSize: "pageSize", currentPage: "currentPage", total: "total", link: "link", isLoading: "isLoading", sort: "sort", trackById: "trackById", sortable: "sortable", striped: "striped", customClasses: "customClasses", emptyResultMsg: "emptyResultMsg", hovered: "hovered", autoHeight: "autoHeight", headerSettings: "headerSettings", contentSettings: "contentSettings", paginatorSettings: "paginatorSettings", setPageable: ["pageable", "setPageable"] }, outputs: { dataStateChanged: "dataStateChanged", downloadData: "downloadData", changeTypeTable: "changeTypeTable", change: "change" }, queries: [{ propertyName: "templateCard", first: true, predicate: ["templateCard"], descendants: true }, { propertyName: "emptyResultMsgTemplate", first: true, predicate: ["emptyResultMsgTemplate"], descendants: true }, { propertyName: "contentChildren", predicate: ColumnComponent }], ngImport: i0, template: "<div class=\"mrx-table\" [class]=\"getClasses\" [class.mb-3]=\"pageable\">\r\n <ng-container *ngIf=\"headerSettings\">\r\n <div\r\n class=\"mrx-table-card-header pt-2 pb-2 mb-3\"\r\n [class.mrx-table-card-header--substrate]=\"headerSettings.substrate\"\r\n *ngIf=\"headerSettings.type === 'default'\"\r\n >\r\n <div class=\"row\">\r\n <div\r\n class=\"mrx-table-card-header--left col col-12 col-md-6 mb-1 mb-md-0 d-flex justify-content-start align-content-center\">\r\n <ng-container *ngTemplateOutlet=\"counterTemplate\"></ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-table-card-header--right col col-12 col-md-6 d-flex justify-content-end align-content-center\">\r\n <ng-container *ngTemplateOutlet=\"sortTemplate\"></ng-container>\r\n <div class=\"ml-4\" *ngIf=\"headerSettings.toggle\">\r\n <ng-container *ngTemplateOutlet=\"toggleTemplate\"></ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div\r\n class=\"mrx-table-card-header mb-3 pt-2 pb-2\"\r\n [class.mrx-table-card-header--substrate]=\"headerSettings.substrate\"\r\n *ngIf=\"headerSettings.type === 'second'\"\r\n >\r\n <div class=\"row\">\r\n <div\r\n class=\"mrx-table-card-header--left col col-12 col-sm-6 mb-1 mb-sm-0 d-flex justify-content-start align-content-center\">\r\n <ng-container *ngTemplateOutlet=\"sortTemplate\"></ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-table-card-header--right col col-12 col-sm-6 d-flex justify-content-end align-content-center\">\r\n <ng-container *ngTemplateOutlet=\"downloadTemplate\"></ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container [ngSwitch]=\"type\">\r\n <div class=\"mrx-table__wrapper\" *ngSwitchCase=\"'default'\"\r\n [class.mrx-table__wrapper--substrate]=\"contentSettings.substrate\">\r\n <table\r\n [class.table-striped]=\"striped\"\r\n [class.table-solid]=\"!striped\"\r\n [class.mt-2]=\"contentSettings.substrate\"\r\n [class.mb-3]=\"contentSettings.substrate && data.length\"\r\n >\r\n <thead [class.table-head-gray]=\"!headerSettings || headerSettings.background\">\r\n <tr>\r\n <th *ngFor=\"let col of contentChildren; let index = index; let first = first; let last = last; trackBy: trackByFn\" [class]=\"col.customClasses\">\r\n <ng-container *ngIf=\"!col.templateHead; else headerItemTemplate\">\r\n <ng-container *ngIf=\"col.sortable; else defaultHeadCol\">\r\n <div [class.th-wrapper]=\"sortable\" (click)=\"onSortColumn(col.name, col.sortable)\">\r\n <span>{{ col.label }}</span>\r\n <svg\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"\r\n [class]=\"columnSortedDir(col.name)\"\r\n class=\"mrx-table__sort-icon\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M4 9L8 13L12 9\" fill=\"#DAD5CE\"/>\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M12 7L8 3L4 7\" fill=\"#DAD5CE\"/>\r\n </svg>\r\n </div>\r\n </ng-container>\r\n <ng-template #defaultHeadCol>\r\n <div><span>{{ col.label }}</span></div>\r\n </ng-template>\r\n </ng-container>\r\n\r\n <ng-template #headerItemTemplate>\r\n <ng-container *ngIf=\"col.sortable; else defaultHeadCol\">\r\n <div [class.th-wrapper]=\"sortable\" (click)=\"onSortColumn(col.name, col.sortable)\">\r\n <ng-container *ngTemplateOutlet=\"col.templateHead; context: { $implicit: col }\"></ng-container>\r\n <svg\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"\r\n [class]=\"columnSortedDir(col.name)\"\r\n class=\"mrx-table__sort-icon\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M4 9L8 13L12 9\" fill=\"#DAD5CE\"/>\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M12 7L8 3L4 7\" fill=\"#DAD5CE\"/>\r\n </svg>\r\n </div>\r\n </ng-container>\r\n <ng-template #defaultHeadCol>\r\n <ng-container *ngTemplateOutlet=\"col.templateHead; context: { $implicit: col, index, first, last }\"></ng-container>\r\n </ng-template>\r\n </ng-template>\r\n </th>\r\n </tr>\r\n </thead>\r\n\r\n <tbody>\r\n <tr *ngFor=\"let dataItem of data; let index = index; let first = first; let last = last\" [class.-hovered]=\"hovered\">\r\n <td\r\n #tableTD\r\n class=\"p-0\"\r\n *ngFor=\"let col of contentChildren\"\r\n [class]=\"col.customClasses\"\r\n >\r\n <a\r\n class=\"link-wrapper td-content-wrapper\"\r\n [href]=\"getLinkForStroke(link, dataItem)\"\r\n *ngIf=\"link && col['isLink']; else defaultTemplate\"\r\n >\r\n <ng-container *ngIf=\"!col.templateCell; else bodyItemTemplate\">\r\n <div class=\"p-2 h-100\">{{ dataItem[col.name] }}</div>\r\n </ng-container>\r\n\r\n <ng-template #bodyItemTemplate>\r\n <ng-container\r\n *ngTemplateOutlet=\"col.templateCell; context: { $implicit: col, row: dataItem, index, first, last }\"></ng-container>\r\n </ng-template>\r\n </a>\r\n\r\n <ng-template #defaultTemplate>\r\n <ng-container *ngIf=\"!col.templateCell; else bodyItemTemplate\">\r\n <div class=\"td-content-wrapper p-2 h-100\">{{ dataItem[col.name] }}</div>\r\n </ng-container>\r\n\r\n <ng-template #bodyItemTemplate>\r\n <div class=\"td-content-wrapper h-100\">\r\n <ng-container\r\n *ngTemplateOutlet=\"col.templateCell; context: { $implicit: col, row: dataItem, index, first, last }\"></ng-container>\r\n </div>\r\n </ng-template>\r\n </ng-template>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n\r\n <div class=\"mrx-table__result-message\" *ngIf=\"!data.length\">\r\n <ng-container *ngTemplateOutlet=\"emptyResultMsg ? emptyResultMsgTemplateDefault : emptyResultMsgTemplate\">\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-table__overlay\" [@visibleLoading]=\"isLoading ? 'in' : 'out'\" [ngClass]=\"{'open': isLoading}\" >\r\n <mrx-loader size=\"large\" color=\"brand\"></mrx-loader>\r\n </div>\r\n </div>\r\n\r\n <div class=\"mrx-table__wrapper\" *ngSwitchCase=\"'cards'\">\r\n <ng-container *ngFor=\"let item of data; let index = index; let first = first; let last = last\">\r\n <ng-container *ngTemplateOutlet=\"templateCard; context: { $implicit: item, index, first, last }\"></ng-container>\r\n </ng-container>\r\n\r\n <div class=\"mrx-table__result-message--substrate\" *ngIf=\"!data.length\" >\r\n <ng-container *ngTemplateOutlet=\"emptyResultMsg ? emptyResultMsgTemplateDefault : emptyResultMsgTemplate\">\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-table__overlay\" [@visibleLoading]=\"isLoading ? 'in' : 'out'\" [ngClass]=\"{'open': isLoading}\" >\r\n <mrx-loader size=\"large\" color=\"brand\"></mrx-loader>\r\n </div>\r\n </div>\r\n </ng-container>\r\n</div>\r\n\r\n<div class=\"mrx-table__paginator pt-2 pb-2\" [class.mrx-table__paginator--substrate]=\"paginatorSettings.substrate\" *ngIf=\"total\">\r\n <mrx-paginator\r\n *ngIf=\"pageable\"\r\n [total]=\"total\"\r\n [pageSize]=\"pageSize\"\r\n [position]=\"pageable.position\"\r\n [pageSizes]=\"pageable.pageSizes\"\r\n [currentPage]=\"currentPage\"\r\n [withPageSize]=\"pageable.withPageSize\"\r\n (dataStateChanged)=\"onDataStatePaginatorChanged($event)\">\r\n </mrx-paginator>\r\n</div>\r\n\r\n<ng-template #counterTemplate>\r\n <span class=\"d-flex align-items-center\" *ngIf=\"headerSettings?.count\">\r\n {{ total }} {{headerSettings?.countText || '\u043D\u043E\u0432\u043E\u0441\u0442\u0435\u0439'}}\r\n </span>\r\n</ng-template>\r\n\r\n<ng-template #sortTemplate>\r\n <div class=\"d-flex mrx-table-sort\" *ngIf=\"headerSettings?.sort\">\r\n <div class=\"mrx-table-sort-scale\" (click)=\"changeSort()\">\r\n <span class=\"mrx-table-sort-scale__title\">\u0421\u043E\u0440\u0442\u0438\u0440\u043E\u0432\u0430\u0442\u044C \u043F\u043E:</span>\r\n <div class=\"mrx-table-sort-scale__icon\">\r\n <span *ngIf=\"sort?.dir === 'desc'\" class=\"mrx-icon icon-sorting-down icon-font-16\"></span>\r\n <span *ngIf=\"sort?.dir === 'asc'\" class=\"mrx-icon icon-sorting-up icon-font-16\"></span>\r\n </div>\r\n </div>\r\n <ng-select\r\n bindLabel=\"sortLabel\"\r\n bindValue=\"name\"\r\n [items]=\"colArray\"\r\n [ngModel]=\"selectedSort\"\r\n (change)=\"updateSortSelect($event)\"\r\n [clearable]=\"false\"\r\n [searchable]=\"false\"\r\n [closeOnSelect]=\"true\"\r\n ></ng-select>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #downloadTemplate>\r\n <div class=\"mrx-table-download\" (click)=\"clickToDownload($event)\" *ngIf=\"headerSettings?.download\">\r\n <span class=\"desktop\">\u0421\u043A\u0430\u0447\u0430\u0442\u044C \u0434\u0430\u043D\u043D\u044B\u0435</span>\r\n <span class=\"mrx-icon icon-download icon-font-24\"></span>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #toggleTemplate>\r\n <div class=\"mrx-table-toggle\">\r\n <div class=\"mrx-table-toggle--item mr-1\" (click)=\"onChangeTypeTable('cards')\" [class.active]=\"type === 'cards'\">\r\n <span class=\"mrx-icon icon-cards-view icon-font-24\"></span>\r\n </div>\r\n <div class=\"mrx-table-toggle--item\" (click)=\"onChangeTypeTable('default')\" [class.active]=\"type === 'default'\">\r\n <span class=\"mrx-icon icon-table-view icon-font-24\"></span>\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #emptyResultMsgTemplateDefault>\r\n {{emptyResultMsg}}\r\n</ng-template>\r\n", styles: [".mrx-table.mrx-table{display:block;width:100%}.mrx-table.mrx-table table td{height:1px}.mrx-table.mrx-table .th-wrapper{display:flex;cursor:pointer;word-break:inherit;justify-content:space-between;align-items:flex-end}.mrx-table.mrx-table .th-wrapper span{word-break:inherit}.mrx-table.mrx-table .mrx-table__sort-icon.asc path:last-child{fill:var(--brand-bg-primary-default)}.mrx-table.mrx-table .mrx-table__sort-icon.desc path:first-child{fill:var(--brand-bg-primary-default)}.mrx-table__wrapper.mrx-table__wrapper{overflow-x:auto;overflow-y:hidden;position:relative}.mrx-table__wrapper.mrx-table__wrapper .mrx-table__wrapper--substrate{padding-top:8px}.mrx-table.mrx-table.type-default table{width:100%;text-align:left;background-color:transparent;border-spacing:0}.mrx-table.mrx-table.type-default table thead.table-head-gray{background:var(--Disabled)}.mrx-table.mrx-table.type-default table thead .sort-asc .custom-table__sort path:nth-child(2){fill:var(--Main2)}.mrx-table.mrx-table.type-default table thead .sort-desc .custom-table__sort path:nth-child(1){fill:var(--Main2)}.mrx-table.mrx-table.type-default table td{max-width:340px;vertical-align:top}.mrx-table.mrx-table.type-default table td .link-wrapper{display:block;color:initial;height:100%}.mrx-table.mrx-table.type-default table td .link-wrapper:active{color:var(--Main1)}.mrx-table.mrx-table.type-default table td .left-border{border-left:4px solid var(--Main2)}.mrx-table.mrx-table.type-default table td .light-border{border-left:4px solid transparent}.mrx-table.mrx-table.type-default table td .warning-back{background-color:#ffece7}.mrx-table.mrx-table.type-default table td .disabled-back{background-color:#fafafa}.mrx-table.mrx-table.type-default table td .link-colored,.mrx-table.mrx-table.type-default table td .link-colored:active{color:var(--Main2)}.mrx-table.mrx-table.type-default table th{padding:8px;vertical-align:bottom;word-break:inherit;font-weight:700}.mrx-table.mrx-table.type-default table th svg{margin-left:8px;cursor:pointer}.mrx-table.mrx-table .mrx-table-card-header{position:relative}.mrx-table.mrx-table .mrx-table-card-header--substrate{padding-left:24px;padding-right:24px;background:#FFFFFF;box-shadow:0 1px 4px #3b43571a;border-radius:4px}.mrx-table.mrx-table .mrx-table__wrapper--substrate{background:#FFFFFF;box-shadow:0 1px 4px #3b43571a;border-radius:4px}.mrx-table.mrx-table .mrx-table-toggle{display:flex}.mrx-table.mrx-table .mrx-table-toggle--item{display:flex;align-items:center;justify-content:center;cursor:pointer}.mrx-table.mrx-table .mrx-table-toggle--item .mrx-icon{color:#e5e5e5}.mrx-table.mrx-table .mrx-table-toggle--item.active .mrx-icon{color:var(--Main2)}.mrx-table.mrx-table .mrx-table-sort.mrx-table-sort--is-card,.mrx-table.mrx-table .mrx-table-sort.mrx-table-sort--is-table{justify-content:flex-start}.mrx-table.mrx-table .mrx-table-sort-scale{display:flex;align-items:center;margin-right:8px;cursor:pointer}.mrx-table.mrx-table .mrx-table-sort-scale__title{font-family:PT Sans;font-style:normal;font-weight:400;font-size:14px;line-height:143%;color:var(--Main1);margin-right:12px}.mrx-table.mrx-table .mrx-table-sort-scale__icon{display:flex;align-items:center;justify-content:center}:host::ng-deep .mrx-table.mrx-table .mrx-table-sort .ng-select{max-width:215px;margin-bottom:0}:host::ng-deep .mrx-table.mrx-table .mrx-table-sort .ng-select .ng-select-container.ng-select-container{min-height:auto!important;border:none;cursor:pointer;align-items:center;height:100%!important}:host::ng-deep .mrx-table.mrx-table .mrx-table-sort .ng-select .ng-value-container.ng-value-container{padding-left:0!important;margin-right:8px}:host::ng-deep .mrx-table.mrx-table .mrx-table-sort .ng-select .ng-arrow-wrapper.ng-arrow-wrapper{min-height:auto;width:auto!important}:host::ng-deep .mrx-table.mrx-table .mrx-table-sort .ng-select .ng-dropdown-panel.ng-dropdown-panel{width:100vw;max-width:215px;left:auto;right:0}.mrx-table__paginator.mrx-table__paginator.mrx-table__paginator--substrate{padding-left:24px;padding-right:24px;background:#FFFFFF;box-shadow:0 1px 4px #3b43571a;border-radius:4px}.mrx-table.mrx-table .table-striped tbody tr:nth-child(even){background-color:var(--Disabled)}.mrx-table.mrx-table .table-striped tbody tr:nth-child(n){transition:.2s}.mrx-table.mrx-table .table-striped tbody tr:nth-child(n).-hovered:hover{background-color:var(--Bg2)}.mrx-table.mrx-table .table-solid{border-collapse:collapse}.mrx-table.mrx-table .table-solid thead tr{border-bottom:1px solid #f2f2f2}.mrx-table.mrx-table .table-solid tbody tr:not(:last-child){border-bottom:1px solid #f2f2f2}.mrx-table.mrx-table .table-solid tbody tr.-hovered:hover{box-shadow:0 1px 4px #3a3a3a4d}.mrx-table.mrx-table .mrx-table__wrapper .mrx-table__overlay{position:absolute;inset:0;background:rgba(255,255,255,.7);display:flex;align-items:flex-start;justify-content:center;padding-top:12px;border-radius:4px}.mrx-table .mrx-table__result-message{display:flex;justify-content:center;width:100%;padding:var(--spacing-4);font-family:var(--body-md-font-family);font-weight:var(--body-md-font-weight);font-size:var(--body-md-font-size);line-height:var(--body-md-line-height);color:var(--neutral-text-secondary)}.mrx-table .mrx-table__result-message *{font-family:var(--body-md-font-family);font-weight:var(--body-md-font-weight);font-size:var(--body-md-font-size);line-height:var(--body-md-line-height);color:var(--neutral-text-secondary)}.mrx-table .mrx-table__result-message--substrate{display:flex;justify-content:center;width:100%;font-weight:400;font-size:16px;line-height:24px;color:var(--neutral-text-primary);padding:24px;background:#FFFFFF;box-shadow:0 1px 4px #3b43571a;border-radius:4px;position:relative}.mrx-table.mrx-table .mrx-table-download{display:flex;align-items:center;justify-content:flex-end;cursor:pointer}.mrx-table.mrx-table .mrx-table-download span{margin-right:8px;color:var(--Main2)}.mrx-table.mrx-table .mrx-table-download svg path{stroke:var(--Main2)}.mrx-table.mrx-table .mrx-table-counter{font-family:var(--body-lg-font-family);font-size:var(--body-lg-font-size);font-weight:var(--body-lg-font-weight);line-height:var(--body-lg-line-height)}\n"], components: [{ type: LoaderComponent, selector: "mrx-loader", inputs: ["size", "color", "customClasses"] }, { type: PaginatorComponent, selector: "mrx-paginator", inputs: ["pageSizes", "currentPage", "pageSize", "total", "customClasses", "isEmptyPaginator", "isPaginatorText", "paginatorText", "position", "withPageSize"], outputs: ["dataStateChanged"] }, { type: i1$3.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }], directives: [{ type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], animations: [
|
|
4022
|
+
TableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: TableComponent, selector: "mrx-table", inputs: { type: "type", data: "data", pageSize: "pageSize", currentPage: "currentPage", total: "total", link: "link", isLoading: "isLoading", sort: "sort", trackById: "trackById", sortable: "sortable", striped: "striped", customClasses: "customClasses", emptyResultMsg: "emptyResultMsg", hovered: "hovered", autoHeight: "autoHeight", headerSettings: "headerSettings", contentSettings: "contentSettings", paginatorSettings: "paginatorSettings", setPageable: ["pageable", "setPageable"] }, outputs: { dataStateChanged: "dataStateChanged", downloadData: "downloadData", changeTypeTable: "changeTypeTable", change: "change" }, queries: [{ propertyName: "templateCard", first: true, predicate: ["templateCard"], descendants: true }, { propertyName: "emptyResultMsgTemplate", first: true, predicate: ["emptyResultMsgTemplate"], descendants: true }, { propertyName: "contentChildren", predicate: ColumnComponent }], ngImport: i0, template: "<div class=\"mrx-table\" [class]=\"getClasses\" [class.mb-3]=\"pageable\">\r\n <ng-container *ngIf=\"headerSettings\">\r\n <div\r\n class=\"mrx-table-card-header pt-2 pb-2 mb-3\"\r\n [class.mrx-table-card-header--substrate]=\"headerSettings.substrate\"\r\n *ngIf=\"headerSettings.type === 'default'\"\r\n >\r\n <div class=\"row\">\r\n <div\r\n class=\"mrx-table-card-header--left col col-12 col-md-6 mb-1 mb-md-0 d-flex justify-content-start align-content-center\">\r\n <ng-container *ngTemplateOutlet=\"counterTemplate\"></ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-table-card-header--right col col-12 col-md-6 d-flex justify-content-end align-content-center\">\r\n <ng-container *ngTemplateOutlet=\"sortTemplate\"></ng-container>\r\n <div class=\"ml-4\" *ngIf=\"headerSettings.toggle\">\r\n <ng-container *ngTemplateOutlet=\"toggleTemplate\"></ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div\r\n class=\"mrx-table-card-header mb-3 pt-2 pb-2\"\r\n [class.mrx-table-card-header--substrate]=\"headerSettings.substrate\"\r\n *ngIf=\"headerSettings.type === 'second'\"\r\n >\r\n <div class=\"row\">\r\n <div\r\n class=\"mrx-table-card-header--left col col-12 col-sm-6 mb-1 mb-sm-0 d-flex justify-content-start align-content-center\">\r\n <ng-container *ngTemplateOutlet=\"sortTemplate\"></ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-table-card-header--right col col-12 col-sm-6 d-flex justify-content-end align-content-center\">\r\n <ng-container *ngTemplateOutlet=\"downloadTemplate\"></ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container [ngSwitch]=\"type\">\r\n <div class=\"mrx-table__wrapper\" *ngSwitchCase=\"'default'\"\r\n [class.mrx-table__wrapper--substrate]=\"contentSettings.substrate\">\r\n <table\r\n [class.table-striped]=\"striped\"\r\n [class.table-solid]=\"!striped\"\r\n [class.mt-2]=\"contentSettings.substrate\"\r\n [class.mb-3]=\"contentSettings.substrate && data.length\"\r\n >\r\n <thead [class.table-head-gray]=\"!headerSettings || headerSettings.background\">\r\n <tr>\r\n <th *ngFor=\"let col of contentChildren; let index = index; let first = first; let last = last; trackBy: trackByFn\" [class]=\"col.customClasses\">\r\n <ng-container *ngIf=\"!col.templateHead; else headerItemTemplate\">\r\n <ng-container *ngIf=\"col.sortable; else defaultHeadCol\">\r\n <div [class.th-wrapper]=\"sortable\" (click)=\"onSortColumn(col.name, col.sortable)\">\r\n <span>{{ col.label }}</span>\r\n <svg\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"\r\n [class]=\"columnSortedDir(col.name)\"\r\n class=\"mrx-table__sort-icon\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M4 9L8 13L12 9\" fill=\"#DAD5CE\"/>\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M12 7L8 3L4 7\" fill=\"#DAD5CE\"/>\r\n </svg>\r\n </div>\r\n </ng-container>\r\n <ng-template #defaultHeadCol>\r\n <div><span>{{ col.label }}</span></div>\r\n </ng-template>\r\n </ng-container>\r\n\r\n <ng-template #headerItemTemplate>\r\n <ng-container *ngIf=\"col.sortable; else defaultHeadCol\">\r\n <div [class.th-wrapper]=\"sortable\" (click)=\"onSortColumn(col.name, col.sortable)\">\r\n <ng-container *ngTemplateOutlet=\"col.templateHead; context: { $implicit: col }\"></ng-container>\r\n <svg\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"\r\n [class]=\"columnSortedDir(col.name)\"\r\n class=\"mrx-table__sort-icon\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M4 9L8 13L12 9\" fill=\"#DAD5CE\"/>\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M12 7L8 3L4 7\" fill=\"#DAD5CE\"/>\r\n </svg>\r\n </div>\r\n </ng-container>\r\n <ng-template #defaultHeadCol>\r\n <ng-container *ngTemplateOutlet=\"col.templateHead; context: { $implicit: col, index, first, last }\"></ng-container>\r\n </ng-template>\r\n </ng-template>\r\n </th>\r\n </tr>\r\n </thead>\r\n\r\n <tbody>\r\n <tr *ngFor=\"let dataItem of data; let index = index; let first = first; let last = last\" [class.-hovered]=\"hovered\">\r\n <td\r\n #tableTD\r\n class=\"p-0\"\r\n *ngFor=\"let col of contentChildren\"\r\n [class]=\"col.customClasses\"\r\n >\r\n <a\r\n class=\"link-wrapper td-content-wrapper\"\r\n [href]=\"getLinkForStroke(link, dataItem)\"\r\n *ngIf=\"link && col['isLink']; else defaultTemplate\"\r\n >\r\n <ng-container *ngIf=\"!col.templateCell; else bodyItemTemplate\">\r\n <div class=\"p-2 h-100\">{{ dataItem[col.name] }}</div>\r\n </ng-container>\r\n\r\n <ng-template #bodyItemTemplate>\r\n <ng-container\r\n *ngTemplateOutlet=\"col.templateCell; context: { $implicit: col, row: dataItem, index, first, last }\"></ng-container>\r\n </ng-template>\r\n </a>\r\n\r\n <ng-template #defaultTemplate>\r\n <ng-container *ngIf=\"!col.templateCell; else bodyItemTemplate\">\r\n <div class=\"td-content-wrapper p-2 h-100\">{{ dataItem[col.name] }}</div>\r\n </ng-container>\r\n\r\n <ng-template #bodyItemTemplate>\r\n <div class=\"td-content-wrapper h-100\">\r\n <ng-container\r\n *ngTemplateOutlet=\"col.templateCell; context: { $implicit: col, row: dataItem, index, first, last }\"></ng-container>\r\n </div>\r\n </ng-template>\r\n </ng-template>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n\r\n <div class=\"mrx-table__result-message\" *ngIf=\"!data.length\">\r\n <ng-container *ngTemplateOutlet=\"emptyResultMsg ? emptyResultMsgTemplateDefault : emptyResultMsgTemplate\">\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-table__overlay\" [@visibleLoading]=\"isLoading ? 'in' : 'out'\" [ngClass]=\"{'open': isLoading}\" >\r\n <mrx-loader size=\"large\" color=\"brand\"></mrx-loader>\r\n </div>\r\n </div>\r\n\r\n <div class=\"mrx-table__wrapper\" *ngSwitchCase=\"'cards'\">\r\n <ng-container *ngFor=\"let item of data; let index = index; let first = first; let last = last\">\r\n <ng-container *ngTemplateOutlet=\"templateCard; context: { $implicit: item, index, first, last }\"></ng-container>\r\n </ng-container>\r\n\r\n <div class=\"mrx-table__result-message--substrate\" *ngIf=\"!data.length\" >\r\n <ng-container *ngTemplateOutlet=\"emptyResultMsg ? emptyResultMsgTemplateDefault : emptyResultMsgTemplate\">\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-table__overlay\" [@visibleLoading]=\"isLoading ? 'in' : 'out'\" [ngClass]=\"{'open': isLoading}\" >\r\n <mrx-loader size=\"large\" color=\"brand\"></mrx-loader>\r\n </div>\r\n </div>\r\n </ng-container>\r\n</div>\r\n\r\n<div class=\"mrx-table__paginator pt-2 pb-2\" [class.mrx-table__paginator--substrate]=\"paginatorSettings.substrate\" *ngIf=\"total\">\r\n <mrx-paginator\r\n *ngIf=\"pageable\"\r\n [total]=\"total\"\r\n [pageSize]=\"pageSize\"\r\n [position]=\"pageable.position\"\r\n [pageSizes]=\"pageable.pageSizes\"\r\n [currentPage]=\"currentPage\"\r\n [withPageSize]=\"pageable.withPageSize\"\r\n (dataStateChanged)=\"onDataStatePaginatorChanged($event)\">\r\n </mrx-paginator>\r\n</div>\r\n\r\n<ng-template #counterTemplate>\r\n <span class=\"d-flex align-items-center\" *ngIf=\"headerSettings?.count\">\r\n {{ total }} {{headerSettings?.countText || '\u043D\u043E\u0432\u043E\u0441\u0442\u0435\u0439'}}\r\n </span>\r\n</ng-template>\r\n\r\n<ng-template #sortTemplate>\r\n <div class=\"d-flex mrx-table-sort\" *ngIf=\"headerSettings?.sort\">\r\n <div class=\"mrx-table-sort-scale\" (click)=\"changeSort()\">\r\n <span class=\"mrx-table-sort-scale__title\">\u0421\u043E\u0440\u0442\u0438\u0440\u043E\u0432\u0430\u0442\u044C \u043F\u043E:</span>\r\n <div class=\"mrx-table-sort-scale__icon\">\r\n <span *ngIf=\"sort?.dir === 'desc'\" class=\"mrx-icon icon-sorting-down icon-font-16\"></span>\r\n <span *ngIf=\"sort?.dir === 'asc'\" class=\"mrx-icon icon-sorting-up icon-font-16\"></span>\r\n </div>\r\n </div>\r\n <ng-select\r\n bindLabel=\"sortLabel\"\r\n bindValue=\"name\"\r\n [items]=\"colArray\"\r\n [ngModel]=\"selectedSort\"\r\n (change)=\"updateSortSelect($event)\"\r\n [clearable]=\"false\"\r\n [searchable]=\"false\"\r\n [closeOnSelect]=\"true\"\r\n ></ng-select>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #downloadTemplate>\r\n <div class=\"mrx-table-download\" (click)=\"clickToDownload($event)\" *ngIf=\"headerSettings?.download\">\r\n <span class=\"desktop\">\u0421\u043A\u0430\u0447\u0430\u0442\u044C \u0434\u0430\u043D\u043D\u044B\u0435</span>\r\n <span class=\"mrx-icon icon-download icon-font-24\"></span>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #toggleTemplate>\r\n <div class=\"mrx-table-toggle\">\r\n <div class=\"mrx-table-toggle--item mr-1\" (click)=\"onChangeTypeTable('cards')\" [class.active]=\"type === 'cards'\">\r\n <span class=\"mrx-icon icon-cards-view icon-font-24\"></span>\r\n </div>\r\n <div class=\"mrx-table-toggle--item\" (click)=\"onChangeTypeTable('default')\" [class.active]=\"type === 'default'\">\r\n <span class=\"mrx-icon icon-table-view icon-font-24\"></span>\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #emptyResultMsgTemplateDefault>\r\n {{emptyResultMsg}}\r\n</ng-template>\r\n", styles: [".mrx-table.mrx-table{display:block;width:100%}.mrx-table.mrx-table table td{height:1px}.mrx-table.mrx-table .th-wrapper{display:flex;cursor:pointer;word-break:inherit;justify-content:space-between;align-items:flex-end}.mrx-table.mrx-table .th-wrapper span{word-break:inherit}.mrx-table.mrx-table .mrx-table__sort-icon.asc path:last-child{fill:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table .mrx-table__sort-icon.desc path:first-child{fill:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table__wrapper.mrx-table__wrapper{overflow-x:auto;overflow-y:hidden;position:relative}.mrx-table__wrapper.mrx-table__wrapper .mrx-table__wrapper--substrate{padding-top:8px}.mrx-table.mrx-table.type-default table{width:100%;text-align:left;background-color:transparent;border-spacing:0}.mrx-table.mrx-table.type-default table thead.table-head-gray{background:var(--neutral-bg-island-default, #F8F9FA)}.mrx-table.mrx-table.type-default table thead .sort-asc .custom-table__sort path:nth-child(2){fill:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table.type-default table thead .sort-desc .custom-table__sort path:nth-child(1){fill:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table.type-default table td{max-width:340px;vertical-align:top}.mrx-table.mrx-table.type-default table td .link-wrapper{display:block;color:initial;height:100%}.mrx-table.mrx-table.type-default table td .link-wrapper:active{color:var(--neutral-text-primary, #262626)}.mrx-table.mrx-table.type-default table td .left-border{border-left:4px solid var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table.type-default table td .light-border{border-left:4px solid transparent}.mrx-table.mrx-table.type-default table td .warning-back{background-color:#ffece7}.mrx-table.mrx-table.type-default table td .disabled-back{background-color:#fafafa}.mrx-table.mrx-table.type-default table td .link-colored,.mrx-table.mrx-table.type-default table td .link-colored:active{color:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table.type-default table th{padding:8px;vertical-align:bottom;word-break:inherit;font-weight:700}.mrx-table.mrx-table.type-default table th svg{margin-left:8px;cursor:pointer}.mrx-table.mrx-table .mrx-table-card-header{position:relative}.mrx-table.mrx-table .mrx-table-card-header--substrate{padding-left:24px;padding-right:24px;background:#FFFFFF;box-shadow:0 1px 4px #3b43571a;border-radius:4px}.mrx-table.mrx-table .mrx-table__wrapper--substrate{background:#FFFFFF;box-shadow:0 1px 4px #3b43571a;border-radius:4px}.mrx-table.mrx-table .mrx-table-toggle{display:flex}.mrx-table.mrx-table .mrx-table-toggle--item{display:flex;align-items:center;justify-content:center;cursor:pointer}.mrx-table.mrx-table .mrx-table-toggle--item .mrx-icon{color:#e5e5e5}.mrx-table.mrx-table .mrx-table-toggle--item.active .mrx-icon{color:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table .mrx-table-sort.mrx-table-sort--is-card,.mrx-table.mrx-table .mrx-table-sort.mrx-table-sort--is-table{justify-content:flex-start}.mrx-table.mrx-table .mrx-table-sort-scale{display:flex;align-items:center;margin-right:8px;cursor:pointer}.mrx-table.mrx-table .mrx-table-sort-scale__title{font-family:PT Sans;font-style:normal;font-weight:400;font-size:14px;line-height:143%;color:var(--neutral-text-primary, #262626);margin-right:12px}.mrx-table.mrx-table .mrx-table-sort-scale__icon{display:flex;align-items:center;justify-content:center}:host::ng-deep .mrx-table.mrx-table .mrx-table-sort .ng-select{max-width:215px;margin-bottom:0}:host::ng-deep .mrx-table.mrx-table .mrx-table-sort .ng-select .ng-select-container.ng-select-container{min-height:auto!important;border:none;cursor:pointer;align-items:center;height:100%!important}:host::ng-deep .mrx-table.mrx-table .mrx-table-sort .ng-select .ng-value-container.ng-value-container{padding-left:0!important;margin-right:8px}:host::ng-deep .mrx-table.mrx-table .mrx-table-sort .ng-select .ng-arrow-wrapper.ng-arrow-wrapper{min-height:auto;width:auto!important}:host::ng-deep .mrx-table.mrx-table .mrx-table-sort .ng-select .ng-dropdown-panel.ng-dropdown-panel{width:100vw;max-width:215px;left:auto;right:0}.mrx-table__paginator.mrx-table__paginator.mrx-table__paginator--substrate{padding-left:24px;padding-right:24px;background:#FFFFFF;box-shadow:0 1px 4px #3b43571a;border-radius:4px}.mrx-table.mrx-table .table-striped tbody tr:nth-child(even){background-color:var(--neutral-bg-island-default, #F8F9FA)}.mrx-table.mrx-table .table-striped tbody tr:nth-child(n){transition:.2s}.mrx-table.mrx-table .table-striped tbody tr:nth-child(n).-hovered:hover{background-color:var(--brand-bg-tertiary-hover, #edf5ff)}.mrx-table.mrx-table .table-solid{border-collapse:collapse}.mrx-table.mrx-table .table-solid thead tr{border-bottom:1px solid #f2f2f2}.mrx-table.mrx-table .table-solid tbody tr:not(:last-child){border-bottom:1px solid #f2f2f2}.mrx-table.mrx-table .table-solid tbody tr.-hovered:hover{box-shadow:0 1px 4px #3a3a3a4d}.mrx-table.mrx-table .mrx-table__wrapper .mrx-table__overlay{position:absolute;inset:0;background:rgba(255,255,255,.7);display:flex;align-items:flex-start;justify-content:center;padding-top:12px;border-radius:4px}.mrx-table .mrx-table__result-message{display:flex;justify-content:center;width:100%;padding:var(--spacing-4);font-family:var(--body-md-font-family);font-weight:var(--body-md-font-weight);font-size:var(--body-md-font-size);line-height:var(--body-md-line-height);color:var(--neutral-text-secondary)}.mrx-table .mrx-table__result-message *{font-family:var(--body-md-font-family);font-weight:var(--body-md-font-weight);font-size:var(--body-md-font-size);line-height:var(--body-md-line-height);color:var(--neutral-text-secondary)}.mrx-table .mrx-table__result-message--substrate{display:flex;justify-content:center;width:100%;font-weight:400;font-size:16px;line-height:24px;color:var(--neutral-text-primary, #262626);padding:24px;background:#FFFFFF;box-shadow:0 1px 4px #3b43571a;border-radius:4px;position:relative}.mrx-table.mrx-table .mrx-table-download{display:flex;align-items:center;justify-content:flex-end;cursor:pointer}.mrx-table.mrx-table .mrx-table-download span{margin-right:8px;color:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table .mrx-table-download svg path{stroke:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table .mrx-table-counter{font-family:var(--body-lg-font-family);font-size:var(--body-lg-font-size);font-weight:var(--body-lg-font-weight);line-height:var(--body-lg-line-height)}\n"], components: [{ type: LoaderComponent, selector: "mrx-loader", inputs: ["size", "color", "customClasses"] }, { type: PaginatorComponent, selector: "mrx-paginator", inputs: ["pageSizes", "currentPage", "pageSize", "total", "customClasses", "isEmptyPaginator", "isPaginatorText", "paginatorText", "position", "withPageSize"], outputs: ["dataStateChanged"] }, { type: i1$3.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }], directives: [{ type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], animations: [
|
|
4023
4023
|
trigger('visibleLoading', [
|
|
4024
4024
|
state('in', style({ opacity: 1, visibility: 'visible' })),
|
|
4025
4025
|
state('out', style({ opacity: 0, visibility: 'hidden' })),
|
|
@@ -4048,7 +4048,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
|
|
|
4048
4048
|
animate('300ms ease-in-out', style({ opacity: 1 }))
|
|
4049
4049
|
])])
|
|
4050
4050
|
])
|
|
4051
|
-
], template: "<div class=\"mrx-table\" [class]=\"getClasses\" [class.mb-3]=\"pageable\">\r\n <ng-container *ngIf=\"headerSettings\">\r\n <div\r\n class=\"mrx-table-card-header pt-2 pb-2 mb-3\"\r\n [class.mrx-table-card-header--substrate]=\"headerSettings.substrate\"\r\n *ngIf=\"headerSettings.type === 'default'\"\r\n >\r\n <div class=\"row\">\r\n <div\r\n class=\"mrx-table-card-header--left col col-12 col-md-6 mb-1 mb-md-0 d-flex justify-content-start align-content-center\">\r\n <ng-container *ngTemplateOutlet=\"counterTemplate\"></ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-table-card-header--right col col-12 col-md-6 d-flex justify-content-end align-content-center\">\r\n <ng-container *ngTemplateOutlet=\"sortTemplate\"></ng-container>\r\n <div class=\"ml-4\" *ngIf=\"headerSettings.toggle\">\r\n <ng-container *ngTemplateOutlet=\"toggleTemplate\"></ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div\r\n class=\"mrx-table-card-header mb-3 pt-2 pb-2\"\r\n [class.mrx-table-card-header--substrate]=\"headerSettings.substrate\"\r\n *ngIf=\"headerSettings.type === 'second'\"\r\n >\r\n <div class=\"row\">\r\n <div\r\n class=\"mrx-table-card-header--left col col-12 col-sm-6 mb-1 mb-sm-0 d-flex justify-content-start align-content-center\">\r\n <ng-container *ngTemplateOutlet=\"sortTemplate\"></ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-table-card-header--right col col-12 col-sm-6 d-flex justify-content-end align-content-center\">\r\n <ng-container *ngTemplateOutlet=\"downloadTemplate\"></ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container [ngSwitch]=\"type\">\r\n <div class=\"mrx-table__wrapper\" *ngSwitchCase=\"'default'\"\r\n [class.mrx-table__wrapper--substrate]=\"contentSettings.substrate\">\r\n <table\r\n [class.table-striped]=\"striped\"\r\n [class.table-solid]=\"!striped\"\r\n [class.mt-2]=\"contentSettings.substrate\"\r\n [class.mb-3]=\"contentSettings.substrate && data.length\"\r\n >\r\n <thead [class.table-head-gray]=\"!headerSettings || headerSettings.background\">\r\n <tr>\r\n <th *ngFor=\"let col of contentChildren; let index = index; let first = first; let last = last; trackBy: trackByFn\" [class]=\"col.customClasses\">\r\n <ng-container *ngIf=\"!col.templateHead; else headerItemTemplate\">\r\n <ng-container *ngIf=\"col.sortable; else defaultHeadCol\">\r\n <div [class.th-wrapper]=\"sortable\" (click)=\"onSortColumn(col.name, col.sortable)\">\r\n <span>{{ col.label }}</span>\r\n <svg\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"\r\n [class]=\"columnSortedDir(col.name)\"\r\n class=\"mrx-table__sort-icon\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M4 9L8 13L12 9\" fill=\"#DAD5CE\"/>\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M12 7L8 3L4 7\" fill=\"#DAD5CE\"/>\r\n </svg>\r\n </div>\r\n </ng-container>\r\n <ng-template #defaultHeadCol>\r\n <div><span>{{ col.label }}</span></div>\r\n </ng-template>\r\n </ng-container>\r\n\r\n <ng-template #headerItemTemplate>\r\n <ng-container *ngIf=\"col.sortable; else defaultHeadCol\">\r\n <div [class.th-wrapper]=\"sortable\" (click)=\"onSortColumn(col.name, col.sortable)\">\r\n <ng-container *ngTemplateOutlet=\"col.templateHead; context: { $implicit: col }\"></ng-container>\r\n <svg\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"\r\n [class]=\"columnSortedDir(col.name)\"\r\n class=\"mrx-table__sort-icon\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M4 9L8 13L12 9\" fill=\"#DAD5CE\"/>\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M12 7L8 3L4 7\" fill=\"#DAD5CE\"/>\r\n </svg>\r\n </div>\r\n </ng-container>\r\n <ng-template #defaultHeadCol>\r\n <ng-container *ngTemplateOutlet=\"col.templateHead; context: { $implicit: col, index, first, last }\"></ng-container>\r\n </ng-template>\r\n </ng-template>\r\n </th>\r\n </tr>\r\n </thead>\r\n\r\n <tbody>\r\n <tr *ngFor=\"let dataItem of data; let index = index; let first = first; let last = last\" [class.-hovered]=\"hovered\">\r\n <td\r\n #tableTD\r\n class=\"p-0\"\r\n *ngFor=\"let col of contentChildren\"\r\n [class]=\"col.customClasses\"\r\n >\r\n <a\r\n class=\"link-wrapper td-content-wrapper\"\r\n [href]=\"getLinkForStroke(link, dataItem)\"\r\n *ngIf=\"link && col['isLink']; else defaultTemplate\"\r\n >\r\n <ng-container *ngIf=\"!col.templateCell; else bodyItemTemplate\">\r\n <div class=\"p-2 h-100\">{{ dataItem[col.name] }}</div>\r\n </ng-container>\r\n\r\n <ng-template #bodyItemTemplate>\r\n <ng-container\r\n *ngTemplateOutlet=\"col.templateCell; context: { $implicit: col, row: dataItem, index, first, last }\"></ng-container>\r\n </ng-template>\r\n </a>\r\n\r\n <ng-template #defaultTemplate>\r\n <ng-container *ngIf=\"!col.templateCell; else bodyItemTemplate\">\r\n <div class=\"td-content-wrapper p-2 h-100\">{{ dataItem[col.name] }}</div>\r\n </ng-container>\r\n\r\n <ng-template #bodyItemTemplate>\r\n <div class=\"td-content-wrapper h-100\">\r\n <ng-container\r\n *ngTemplateOutlet=\"col.templateCell; context: { $implicit: col, row: dataItem, index, first, last }\"></ng-container>\r\n </div>\r\n </ng-template>\r\n </ng-template>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n\r\n <div class=\"mrx-table__result-message\" *ngIf=\"!data.length\">\r\n <ng-container *ngTemplateOutlet=\"emptyResultMsg ? emptyResultMsgTemplateDefault : emptyResultMsgTemplate\">\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-table__overlay\" [@visibleLoading]=\"isLoading ? 'in' : 'out'\" [ngClass]=\"{'open': isLoading}\" >\r\n <mrx-loader size=\"large\" color=\"brand\"></mrx-loader>\r\n </div>\r\n </div>\r\n\r\n <div class=\"mrx-table__wrapper\" *ngSwitchCase=\"'cards'\">\r\n <ng-container *ngFor=\"let item of data; let index = index; let first = first; let last = last\">\r\n <ng-container *ngTemplateOutlet=\"templateCard; context: { $implicit: item, index, first, last }\"></ng-container>\r\n </ng-container>\r\n\r\n <div class=\"mrx-table__result-message--substrate\" *ngIf=\"!data.length\" >\r\n <ng-container *ngTemplateOutlet=\"emptyResultMsg ? emptyResultMsgTemplateDefault : emptyResultMsgTemplate\">\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-table__overlay\" [@visibleLoading]=\"isLoading ? 'in' : 'out'\" [ngClass]=\"{'open': isLoading}\" >\r\n <mrx-loader size=\"large\" color=\"brand\"></mrx-loader>\r\n </div>\r\n </div>\r\n </ng-container>\r\n</div>\r\n\r\n<div class=\"mrx-table__paginator pt-2 pb-2\" [class.mrx-table__paginator--substrate]=\"paginatorSettings.substrate\" *ngIf=\"total\">\r\n <mrx-paginator\r\n *ngIf=\"pageable\"\r\n [total]=\"total\"\r\n [pageSize]=\"pageSize\"\r\n [position]=\"pageable.position\"\r\n [pageSizes]=\"pageable.pageSizes\"\r\n [currentPage]=\"currentPage\"\r\n [withPageSize]=\"pageable.withPageSize\"\r\n (dataStateChanged)=\"onDataStatePaginatorChanged($event)\">\r\n </mrx-paginator>\r\n</div>\r\n\r\n<ng-template #counterTemplate>\r\n <span class=\"d-flex align-items-center\" *ngIf=\"headerSettings?.count\">\r\n {{ total }} {{headerSettings?.countText || '\u043D\u043E\u0432\u043E\u0441\u0442\u0435\u0439'}}\r\n </span>\r\n</ng-template>\r\n\r\n<ng-template #sortTemplate>\r\n <div class=\"d-flex mrx-table-sort\" *ngIf=\"headerSettings?.sort\">\r\n <div class=\"mrx-table-sort-scale\" (click)=\"changeSort()\">\r\n <span class=\"mrx-table-sort-scale__title\">\u0421\u043E\u0440\u0442\u0438\u0440\u043E\u0432\u0430\u0442\u044C \u043F\u043E:</span>\r\n <div class=\"mrx-table-sort-scale__icon\">\r\n <span *ngIf=\"sort?.dir === 'desc'\" class=\"mrx-icon icon-sorting-down icon-font-16\"></span>\r\n <span *ngIf=\"sort?.dir === 'asc'\" class=\"mrx-icon icon-sorting-up icon-font-16\"></span>\r\n </div>\r\n </div>\r\n <ng-select\r\n bindLabel=\"sortLabel\"\r\n bindValue=\"name\"\r\n [items]=\"colArray\"\r\n [ngModel]=\"selectedSort\"\r\n (change)=\"updateSortSelect($event)\"\r\n [clearable]=\"false\"\r\n [searchable]=\"false\"\r\n [closeOnSelect]=\"true\"\r\n ></ng-select>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #downloadTemplate>\r\n <div class=\"mrx-table-download\" (click)=\"clickToDownload($event)\" *ngIf=\"headerSettings?.download\">\r\n <span class=\"desktop\">\u0421\u043A\u0430\u0447\u0430\u0442\u044C \u0434\u0430\u043D\u043D\u044B\u0435</span>\r\n <span class=\"mrx-icon icon-download icon-font-24\"></span>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #toggleTemplate>\r\n <div class=\"mrx-table-toggle\">\r\n <div class=\"mrx-table-toggle--item mr-1\" (click)=\"onChangeTypeTable('cards')\" [class.active]=\"type === 'cards'\">\r\n <span class=\"mrx-icon icon-cards-view icon-font-24\"></span>\r\n </div>\r\n <div class=\"mrx-table-toggle--item\" (click)=\"onChangeTypeTable('default')\" [class.active]=\"type === 'default'\">\r\n <span class=\"mrx-icon icon-table-view icon-font-24\"></span>\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #emptyResultMsgTemplateDefault>\r\n {{emptyResultMsg}}\r\n</ng-template>\r\n", styles: [".mrx-table.mrx-table{display:block;width:100%}.mrx-table.mrx-table table td{height:1px}.mrx-table.mrx-table .th-wrapper{display:flex;cursor:pointer;word-break:inherit;justify-content:space-between;align-items:flex-end}.mrx-table.mrx-table .th-wrapper span{word-break:inherit}.mrx-table.mrx-table .mrx-table__sort-icon.asc path:last-child{fill:var(--brand-bg-primary-default)}.mrx-table.mrx-table .mrx-table__sort-icon.desc path:first-child{fill:var(--brand-bg-primary-default)}.mrx-table__wrapper.mrx-table__wrapper{overflow-x:auto;overflow-y:hidden;position:relative}.mrx-table__wrapper.mrx-table__wrapper .mrx-table__wrapper--substrate{padding-top:8px}.mrx-table.mrx-table.type-default table{width:100%;text-align:left;background-color:transparent;border-spacing:0}.mrx-table.mrx-table.type-default table thead.table-head-gray{background:var(--Disabled)}.mrx-table.mrx-table.type-default table thead .sort-asc .custom-table__sort path:nth-child(2){fill:var(--Main2)}.mrx-table.mrx-table.type-default table thead .sort-desc .custom-table__sort path:nth-child(1){fill:var(--Main2)}.mrx-table.mrx-table.type-default table td{max-width:340px;vertical-align:top}.mrx-table.mrx-table.type-default table td .link-wrapper{display:block;color:initial;height:100%}.mrx-table.mrx-table.type-default table td .link-wrapper:active{color:var(--Main1)}.mrx-table.mrx-table.type-default table td .left-border{border-left:4px solid var(--Main2)}.mrx-table.mrx-table.type-default table td .light-border{border-left:4px solid transparent}.mrx-table.mrx-table.type-default table td .warning-back{background-color:#ffece7}.mrx-table.mrx-table.type-default table td .disabled-back{background-color:#fafafa}.mrx-table.mrx-table.type-default table td .link-colored,.mrx-table.mrx-table.type-default table td .link-colored:active{color:var(--Main2)}.mrx-table.mrx-table.type-default table th{padding:8px;vertical-align:bottom;word-break:inherit;font-weight:700}.mrx-table.mrx-table.type-default table th svg{margin-left:8px;cursor:pointer}.mrx-table.mrx-table .mrx-table-card-header{position:relative}.mrx-table.mrx-table .mrx-table-card-header--substrate{padding-left:24px;padding-right:24px;background:#FFFFFF;box-shadow:0 1px 4px #3b43571a;border-radius:4px}.mrx-table.mrx-table .mrx-table__wrapper--substrate{background:#FFFFFF;box-shadow:0 1px 4px #3b43571a;border-radius:4px}.mrx-table.mrx-table .mrx-table-toggle{display:flex}.mrx-table.mrx-table .mrx-table-toggle--item{display:flex;align-items:center;justify-content:center;cursor:pointer}.mrx-table.mrx-table .mrx-table-toggle--item .mrx-icon{color:#e5e5e5}.mrx-table.mrx-table .mrx-table-toggle--item.active .mrx-icon{color:var(--Main2)}.mrx-table.mrx-table .mrx-table-sort.mrx-table-sort--is-card,.mrx-table.mrx-table .mrx-table-sort.mrx-table-sort--is-table{justify-content:flex-start}.mrx-table.mrx-table .mrx-table-sort-scale{display:flex;align-items:center;margin-right:8px;cursor:pointer}.mrx-table.mrx-table .mrx-table-sort-scale__title{font-family:PT Sans;font-style:normal;font-weight:400;font-size:14px;line-height:143%;color:var(--Main1);margin-right:12px}.mrx-table.mrx-table .mrx-table-sort-scale__icon{display:flex;align-items:center;justify-content:center}:host::ng-deep .mrx-table.mrx-table .mrx-table-sort .ng-select{max-width:215px;margin-bottom:0}:host::ng-deep .mrx-table.mrx-table .mrx-table-sort .ng-select .ng-select-container.ng-select-container{min-height:auto!important;border:none;cursor:pointer;align-items:center;height:100%!important}:host::ng-deep .mrx-table.mrx-table .mrx-table-sort .ng-select .ng-value-container.ng-value-container{padding-left:0!important;margin-right:8px}:host::ng-deep .mrx-table.mrx-table .mrx-table-sort .ng-select .ng-arrow-wrapper.ng-arrow-wrapper{min-height:auto;width:auto!important}:host::ng-deep .mrx-table.mrx-table .mrx-table-sort .ng-select .ng-dropdown-panel.ng-dropdown-panel{width:100vw;max-width:215px;left:auto;right:0}.mrx-table__paginator.mrx-table__paginator.mrx-table__paginator--substrate{padding-left:24px;padding-right:24px;background:#FFFFFF;box-shadow:0 1px 4px #3b43571a;border-radius:4px}.mrx-table.mrx-table .table-striped tbody tr:nth-child(even){background-color:var(--Disabled)}.mrx-table.mrx-table .table-striped tbody tr:nth-child(n){transition:.2s}.mrx-table.mrx-table .table-striped tbody tr:nth-child(n).-hovered:hover{background-color:var(--Bg2)}.mrx-table.mrx-table .table-solid{border-collapse:collapse}.mrx-table.mrx-table .table-solid thead tr{border-bottom:1px solid #f2f2f2}.mrx-table.mrx-table .table-solid tbody tr:not(:last-child){border-bottom:1px solid #f2f2f2}.mrx-table.mrx-table .table-solid tbody tr.-hovered:hover{box-shadow:0 1px 4px #3a3a3a4d}.mrx-table.mrx-table .mrx-table__wrapper .mrx-table__overlay{position:absolute;inset:0;background:rgba(255,255,255,.7);display:flex;align-items:flex-start;justify-content:center;padding-top:12px;border-radius:4px}.mrx-table .mrx-table__result-message{display:flex;justify-content:center;width:100%;padding:var(--spacing-4);font-family:var(--body-md-font-family);font-weight:var(--body-md-font-weight);font-size:var(--body-md-font-size);line-height:var(--body-md-line-height);color:var(--neutral-text-secondary)}.mrx-table .mrx-table__result-message *{font-family:var(--body-md-font-family);font-weight:var(--body-md-font-weight);font-size:var(--body-md-font-size);line-height:var(--body-md-line-height);color:var(--neutral-text-secondary)}.mrx-table .mrx-table__result-message--substrate{display:flex;justify-content:center;width:100%;font-weight:400;font-size:16px;line-height:24px;color:var(--neutral-text-primary);padding:24px;background:#FFFFFF;box-shadow:0 1px 4px #3b43571a;border-radius:4px;position:relative}.mrx-table.mrx-table .mrx-table-download{display:flex;align-items:center;justify-content:flex-end;cursor:pointer}.mrx-table.mrx-table .mrx-table-download span{margin-right:8px;color:var(--Main2)}.mrx-table.mrx-table .mrx-table-download svg path{stroke:var(--Main2)}.mrx-table.mrx-table .mrx-table-counter{font-family:var(--body-lg-font-family);font-size:var(--body-lg-font-size);font-weight:var(--body-lg-font-weight);line-height:var(--body-lg-line-height)}\n"] }]
|
|
4051
|
+
], template: "<div class=\"mrx-table\" [class]=\"getClasses\" [class.mb-3]=\"pageable\">\r\n <ng-container *ngIf=\"headerSettings\">\r\n <div\r\n class=\"mrx-table-card-header pt-2 pb-2 mb-3\"\r\n [class.mrx-table-card-header--substrate]=\"headerSettings.substrate\"\r\n *ngIf=\"headerSettings.type === 'default'\"\r\n >\r\n <div class=\"row\">\r\n <div\r\n class=\"mrx-table-card-header--left col col-12 col-md-6 mb-1 mb-md-0 d-flex justify-content-start align-content-center\">\r\n <ng-container *ngTemplateOutlet=\"counterTemplate\"></ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-table-card-header--right col col-12 col-md-6 d-flex justify-content-end align-content-center\">\r\n <ng-container *ngTemplateOutlet=\"sortTemplate\"></ng-container>\r\n <div class=\"ml-4\" *ngIf=\"headerSettings.toggle\">\r\n <ng-container *ngTemplateOutlet=\"toggleTemplate\"></ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div\r\n class=\"mrx-table-card-header mb-3 pt-2 pb-2\"\r\n [class.mrx-table-card-header--substrate]=\"headerSettings.substrate\"\r\n *ngIf=\"headerSettings.type === 'second'\"\r\n >\r\n <div class=\"row\">\r\n <div\r\n class=\"mrx-table-card-header--left col col-12 col-sm-6 mb-1 mb-sm-0 d-flex justify-content-start align-content-center\">\r\n <ng-container *ngTemplateOutlet=\"sortTemplate\"></ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-table-card-header--right col col-12 col-sm-6 d-flex justify-content-end align-content-center\">\r\n <ng-container *ngTemplateOutlet=\"downloadTemplate\"></ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container [ngSwitch]=\"type\">\r\n <div class=\"mrx-table__wrapper\" *ngSwitchCase=\"'default'\"\r\n [class.mrx-table__wrapper--substrate]=\"contentSettings.substrate\">\r\n <table\r\n [class.table-striped]=\"striped\"\r\n [class.table-solid]=\"!striped\"\r\n [class.mt-2]=\"contentSettings.substrate\"\r\n [class.mb-3]=\"contentSettings.substrate && data.length\"\r\n >\r\n <thead [class.table-head-gray]=\"!headerSettings || headerSettings.background\">\r\n <tr>\r\n <th *ngFor=\"let col of contentChildren; let index = index; let first = first; let last = last; trackBy: trackByFn\" [class]=\"col.customClasses\">\r\n <ng-container *ngIf=\"!col.templateHead; else headerItemTemplate\">\r\n <ng-container *ngIf=\"col.sortable; else defaultHeadCol\">\r\n <div [class.th-wrapper]=\"sortable\" (click)=\"onSortColumn(col.name, col.sortable)\">\r\n <span>{{ col.label }}</span>\r\n <svg\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"\r\n [class]=\"columnSortedDir(col.name)\"\r\n class=\"mrx-table__sort-icon\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M4 9L8 13L12 9\" fill=\"#DAD5CE\"/>\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M12 7L8 3L4 7\" fill=\"#DAD5CE\"/>\r\n </svg>\r\n </div>\r\n </ng-container>\r\n <ng-template #defaultHeadCol>\r\n <div><span>{{ col.label }}</span></div>\r\n </ng-template>\r\n </ng-container>\r\n\r\n <ng-template #headerItemTemplate>\r\n <ng-container *ngIf=\"col.sortable; else defaultHeadCol\">\r\n <div [class.th-wrapper]=\"sortable\" (click)=\"onSortColumn(col.name, col.sortable)\">\r\n <ng-container *ngTemplateOutlet=\"col.templateHead; context: { $implicit: col }\"></ng-container>\r\n <svg\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"\r\n [class]=\"columnSortedDir(col.name)\"\r\n class=\"mrx-table__sort-icon\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M4 9L8 13L12 9\" fill=\"#DAD5CE\"/>\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M12 7L8 3L4 7\" fill=\"#DAD5CE\"/>\r\n </svg>\r\n </div>\r\n </ng-container>\r\n <ng-template #defaultHeadCol>\r\n <ng-container *ngTemplateOutlet=\"col.templateHead; context: { $implicit: col, index, first, last }\"></ng-container>\r\n </ng-template>\r\n </ng-template>\r\n </th>\r\n </tr>\r\n </thead>\r\n\r\n <tbody>\r\n <tr *ngFor=\"let dataItem of data; let index = index; let first = first; let last = last\" [class.-hovered]=\"hovered\">\r\n <td\r\n #tableTD\r\n class=\"p-0\"\r\n *ngFor=\"let col of contentChildren\"\r\n [class]=\"col.customClasses\"\r\n >\r\n <a\r\n class=\"link-wrapper td-content-wrapper\"\r\n [href]=\"getLinkForStroke(link, dataItem)\"\r\n *ngIf=\"link && col['isLink']; else defaultTemplate\"\r\n >\r\n <ng-container *ngIf=\"!col.templateCell; else bodyItemTemplate\">\r\n <div class=\"p-2 h-100\">{{ dataItem[col.name] }}</div>\r\n </ng-container>\r\n\r\n <ng-template #bodyItemTemplate>\r\n <ng-container\r\n *ngTemplateOutlet=\"col.templateCell; context: { $implicit: col, row: dataItem, index, first, last }\"></ng-container>\r\n </ng-template>\r\n </a>\r\n\r\n <ng-template #defaultTemplate>\r\n <ng-container *ngIf=\"!col.templateCell; else bodyItemTemplate\">\r\n <div class=\"td-content-wrapper p-2 h-100\">{{ dataItem[col.name] }}</div>\r\n </ng-container>\r\n\r\n <ng-template #bodyItemTemplate>\r\n <div class=\"td-content-wrapper h-100\">\r\n <ng-container\r\n *ngTemplateOutlet=\"col.templateCell; context: { $implicit: col, row: dataItem, index, first, last }\"></ng-container>\r\n </div>\r\n </ng-template>\r\n </ng-template>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n\r\n <div class=\"mrx-table__result-message\" *ngIf=\"!data.length\">\r\n <ng-container *ngTemplateOutlet=\"emptyResultMsg ? emptyResultMsgTemplateDefault : emptyResultMsgTemplate\">\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-table__overlay\" [@visibleLoading]=\"isLoading ? 'in' : 'out'\" [ngClass]=\"{'open': isLoading}\" >\r\n <mrx-loader size=\"large\" color=\"brand\"></mrx-loader>\r\n </div>\r\n </div>\r\n\r\n <div class=\"mrx-table__wrapper\" *ngSwitchCase=\"'cards'\">\r\n <ng-container *ngFor=\"let item of data; let index = index; let first = first; let last = last\">\r\n <ng-container *ngTemplateOutlet=\"templateCard; context: { $implicit: item, index, first, last }\"></ng-container>\r\n </ng-container>\r\n\r\n <div class=\"mrx-table__result-message--substrate\" *ngIf=\"!data.length\" >\r\n <ng-container *ngTemplateOutlet=\"emptyResultMsg ? emptyResultMsgTemplateDefault : emptyResultMsgTemplate\">\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-table__overlay\" [@visibleLoading]=\"isLoading ? 'in' : 'out'\" [ngClass]=\"{'open': isLoading}\" >\r\n <mrx-loader size=\"large\" color=\"brand\"></mrx-loader>\r\n </div>\r\n </div>\r\n </ng-container>\r\n</div>\r\n\r\n<div class=\"mrx-table__paginator pt-2 pb-2\" [class.mrx-table__paginator--substrate]=\"paginatorSettings.substrate\" *ngIf=\"total\">\r\n <mrx-paginator\r\n *ngIf=\"pageable\"\r\n [total]=\"total\"\r\n [pageSize]=\"pageSize\"\r\n [position]=\"pageable.position\"\r\n [pageSizes]=\"pageable.pageSizes\"\r\n [currentPage]=\"currentPage\"\r\n [withPageSize]=\"pageable.withPageSize\"\r\n (dataStateChanged)=\"onDataStatePaginatorChanged($event)\">\r\n </mrx-paginator>\r\n</div>\r\n\r\n<ng-template #counterTemplate>\r\n <span class=\"d-flex align-items-center\" *ngIf=\"headerSettings?.count\">\r\n {{ total }} {{headerSettings?.countText || '\u043D\u043E\u0432\u043E\u0441\u0442\u0435\u0439'}}\r\n </span>\r\n</ng-template>\r\n\r\n<ng-template #sortTemplate>\r\n <div class=\"d-flex mrx-table-sort\" *ngIf=\"headerSettings?.sort\">\r\n <div class=\"mrx-table-sort-scale\" (click)=\"changeSort()\">\r\n <span class=\"mrx-table-sort-scale__title\">\u0421\u043E\u0440\u0442\u0438\u0440\u043E\u0432\u0430\u0442\u044C \u043F\u043E:</span>\r\n <div class=\"mrx-table-sort-scale__icon\">\r\n <span *ngIf=\"sort?.dir === 'desc'\" class=\"mrx-icon icon-sorting-down icon-font-16\"></span>\r\n <span *ngIf=\"sort?.dir === 'asc'\" class=\"mrx-icon icon-sorting-up icon-font-16\"></span>\r\n </div>\r\n </div>\r\n <ng-select\r\n bindLabel=\"sortLabel\"\r\n bindValue=\"name\"\r\n [items]=\"colArray\"\r\n [ngModel]=\"selectedSort\"\r\n (change)=\"updateSortSelect($event)\"\r\n [clearable]=\"false\"\r\n [searchable]=\"false\"\r\n [closeOnSelect]=\"true\"\r\n ></ng-select>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #downloadTemplate>\r\n <div class=\"mrx-table-download\" (click)=\"clickToDownload($event)\" *ngIf=\"headerSettings?.download\">\r\n <span class=\"desktop\">\u0421\u043A\u0430\u0447\u0430\u0442\u044C \u0434\u0430\u043D\u043D\u044B\u0435</span>\r\n <span class=\"mrx-icon icon-download icon-font-24\"></span>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #toggleTemplate>\r\n <div class=\"mrx-table-toggle\">\r\n <div class=\"mrx-table-toggle--item mr-1\" (click)=\"onChangeTypeTable('cards')\" [class.active]=\"type === 'cards'\">\r\n <span class=\"mrx-icon icon-cards-view icon-font-24\"></span>\r\n </div>\r\n <div class=\"mrx-table-toggle--item\" (click)=\"onChangeTypeTable('default')\" [class.active]=\"type === 'default'\">\r\n <span class=\"mrx-icon icon-table-view icon-font-24\"></span>\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #emptyResultMsgTemplateDefault>\r\n {{emptyResultMsg}}\r\n</ng-template>\r\n", styles: [".mrx-table.mrx-table{display:block;width:100%}.mrx-table.mrx-table table td{height:1px}.mrx-table.mrx-table .th-wrapper{display:flex;cursor:pointer;word-break:inherit;justify-content:space-between;align-items:flex-end}.mrx-table.mrx-table .th-wrapper span{word-break:inherit}.mrx-table.mrx-table .mrx-table__sort-icon.asc path:last-child{fill:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table .mrx-table__sort-icon.desc path:first-child{fill:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table__wrapper.mrx-table__wrapper{overflow-x:auto;overflow-y:hidden;position:relative}.mrx-table__wrapper.mrx-table__wrapper .mrx-table__wrapper--substrate{padding-top:8px}.mrx-table.mrx-table.type-default table{width:100%;text-align:left;background-color:transparent;border-spacing:0}.mrx-table.mrx-table.type-default table thead.table-head-gray{background:var(--neutral-bg-island-default, #F8F9FA)}.mrx-table.mrx-table.type-default table thead .sort-asc .custom-table__sort path:nth-child(2){fill:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table.type-default table thead .sort-desc .custom-table__sort path:nth-child(1){fill:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table.type-default table td{max-width:340px;vertical-align:top}.mrx-table.mrx-table.type-default table td .link-wrapper{display:block;color:initial;height:100%}.mrx-table.mrx-table.type-default table td .link-wrapper:active{color:var(--neutral-text-primary, #262626)}.mrx-table.mrx-table.type-default table td .left-border{border-left:4px solid var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table.type-default table td .light-border{border-left:4px solid transparent}.mrx-table.mrx-table.type-default table td .warning-back{background-color:#ffece7}.mrx-table.mrx-table.type-default table td .disabled-back{background-color:#fafafa}.mrx-table.mrx-table.type-default table td .link-colored,.mrx-table.mrx-table.type-default table td .link-colored:active{color:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table.type-default table th{padding:8px;vertical-align:bottom;word-break:inherit;font-weight:700}.mrx-table.mrx-table.type-default table th svg{margin-left:8px;cursor:pointer}.mrx-table.mrx-table .mrx-table-card-header{position:relative}.mrx-table.mrx-table .mrx-table-card-header--substrate{padding-left:24px;padding-right:24px;background:#FFFFFF;box-shadow:0 1px 4px #3b43571a;border-radius:4px}.mrx-table.mrx-table .mrx-table__wrapper--substrate{background:#FFFFFF;box-shadow:0 1px 4px #3b43571a;border-radius:4px}.mrx-table.mrx-table .mrx-table-toggle{display:flex}.mrx-table.mrx-table .mrx-table-toggle--item{display:flex;align-items:center;justify-content:center;cursor:pointer}.mrx-table.mrx-table .mrx-table-toggle--item .mrx-icon{color:#e5e5e5}.mrx-table.mrx-table .mrx-table-toggle--item.active .mrx-icon{color:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table .mrx-table-sort.mrx-table-sort--is-card,.mrx-table.mrx-table .mrx-table-sort.mrx-table-sort--is-table{justify-content:flex-start}.mrx-table.mrx-table .mrx-table-sort-scale{display:flex;align-items:center;margin-right:8px;cursor:pointer}.mrx-table.mrx-table .mrx-table-sort-scale__title{font-family:PT Sans;font-style:normal;font-weight:400;font-size:14px;line-height:143%;color:var(--neutral-text-primary, #262626);margin-right:12px}.mrx-table.mrx-table .mrx-table-sort-scale__icon{display:flex;align-items:center;justify-content:center}:host::ng-deep .mrx-table.mrx-table .mrx-table-sort .ng-select{max-width:215px;margin-bottom:0}:host::ng-deep .mrx-table.mrx-table .mrx-table-sort .ng-select .ng-select-container.ng-select-container{min-height:auto!important;border:none;cursor:pointer;align-items:center;height:100%!important}:host::ng-deep .mrx-table.mrx-table .mrx-table-sort .ng-select .ng-value-container.ng-value-container{padding-left:0!important;margin-right:8px}:host::ng-deep .mrx-table.mrx-table .mrx-table-sort .ng-select .ng-arrow-wrapper.ng-arrow-wrapper{min-height:auto;width:auto!important}:host::ng-deep .mrx-table.mrx-table .mrx-table-sort .ng-select .ng-dropdown-panel.ng-dropdown-panel{width:100vw;max-width:215px;left:auto;right:0}.mrx-table__paginator.mrx-table__paginator.mrx-table__paginator--substrate{padding-left:24px;padding-right:24px;background:#FFFFFF;box-shadow:0 1px 4px #3b43571a;border-radius:4px}.mrx-table.mrx-table .table-striped tbody tr:nth-child(even){background-color:var(--neutral-bg-island-default, #F8F9FA)}.mrx-table.mrx-table .table-striped tbody tr:nth-child(n){transition:.2s}.mrx-table.mrx-table .table-striped tbody tr:nth-child(n).-hovered:hover{background-color:var(--brand-bg-tertiary-hover, #edf5ff)}.mrx-table.mrx-table .table-solid{border-collapse:collapse}.mrx-table.mrx-table .table-solid thead tr{border-bottom:1px solid #f2f2f2}.mrx-table.mrx-table .table-solid tbody tr:not(:last-child){border-bottom:1px solid #f2f2f2}.mrx-table.mrx-table .table-solid tbody tr.-hovered:hover{box-shadow:0 1px 4px #3a3a3a4d}.mrx-table.mrx-table .mrx-table__wrapper .mrx-table__overlay{position:absolute;inset:0;background:rgba(255,255,255,.7);display:flex;align-items:flex-start;justify-content:center;padding-top:12px;border-radius:4px}.mrx-table .mrx-table__result-message{display:flex;justify-content:center;width:100%;padding:var(--spacing-4);font-family:var(--body-md-font-family);font-weight:var(--body-md-font-weight);font-size:var(--body-md-font-size);line-height:var(--body-md-line-height);color:var(--neutral-text-secondary)}.mrx-table .mrx-table__result-message *{font-family:var(--body-md-font-family);font-weight:var(--body-md-font-weight);font-size:var(--body-md-font-size);line-height:var(--body-md-line-height);color:var(--neutral-text-secondary)}.mrx-table .mrx-table__result-message--substrate{display:flex;justify-content:center;width:100%;font-weight:400;font-size:16px;line-height:24px;color:var(--neutral-text-primary, #262626);padding:24px;background:#FFFFFF;box-shadow:0 1px 4px #3b43571a;border-radius:4px;position:relative}.mrx-table.mrx-table .mrx-table-download{display:flex;align-items:center;justify-content:flex-end;cursor:pointer}.mrx-table.mrx-table .mrx-table-download span{margin-right:8px;color:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table .mrx-table-download svg path{stroke:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table .mrx-table-counter{font-family:var(--body-lg-font-family);font-size:var(--body-lg-font-size);font-weight:var(--body-lg-font-weight);line-height:var(--body-lg-line-height)}\n"] }]
|
|
4052
4052
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { contentChildren: [{
|
|
4053
4053
|
type: ContentChildren,
|
|
4054
4054
|
args: [ColumnComponent]
|
|
@@ -5255,6 +5255,7 @@ class InputTextareaComponent {
|
|
|
5255
5255
|
this.blurred.emit({ value: this.value, id: this.uuid });
|
|
5256
5256
|
}
|
|
5257
5257
|
updateValue(insideValue) {
|
|
5258
|
+
this.value = this._normalizeValue(insideValue);
|
|
5258
5259
|
this.changed.emit(this._normalizeValue(insideValue));
|
|
5259
5260
|
this.modelChange.emit({ value: this._normalizeValue(insideValue), id: this.uuid });
|
|
5260
5261
|
this.onChange(this._normalizeValue(insideValue));
|
|
@@ -5909,6 +5910,7 @@ class InputTextComponent {
|
|
|
5909
5910
|
this.blurred.emit({ value: this.formatValue(this.value), id: this.uuid });
|
|
5910
5911
|
}
|
|
5911
5912
|
updateValue(insideValue) {
|
|
5913
|
+
this.value = this._normalizeValue(insideValue);
|
|
5912
5914
|
this.changed.emit(this._normalizeValue(this.formatValue(insideValue)));
|
|
5913
5915
|
this.modelChange.emit({ value: this._normalizeValue(this.formatValue(insideValue)), id: this.uuid });
|
|
5914
5916
|
this.onChange(this._normalizeValue(this.formatValue(insideValue)));
|