@den4ik92/ng2-smart-table 19.6.2 → 19.6.4
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.
|
@@ -726,6 +726,7 @@ class LocalDataSource extends DataSource {
|
|
|
726
726
|
}
|
|
727
727
|
}
|
|
728
728
|
}
|
|
729
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
729
730
|
async emitOnChanged(event, newElements) {
|
|
730
731
|
super.emitOnChanged(event, this.paginatedList());
|
|
731
732
|
if (this.pagingConf().display && this.isPageOutOfBounce()) {
|
|
@@ -851,11 +852,11 @@ class PagerComponent {
|
|
|
851
852
|
this.source().setPaging(1, +target.value);
|
|
852
853
|
}
|
|
853
854
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PagerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
854
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: PagerComponent, isStandalone: true, selector: "ng2-smart-table-pager", inputs: { source: { classPropertyName: "source", publicName: "source", isSignal: true, isRequired: true, transformFunction: null }, content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"ng2-smart-table-pagination__wrap\">\n <div class=\"total-wrap\">\n <ng-content>\n @if (content()) {\n <ng-template [ngTemplateOutlet]=\"content()!\"></ng-template>\n } @else {\n @if (isShowTotal()) {\n <span class=\"total-count\"> Total: {{ count() }} </span>\n }\n }\n </ng-content>\n </div>\n <nav class=\"ng2-smart-table-pagination__nav\">\n <ul class=\"ng2-smart-table-pagination__list\">\n <li class=\"ng2-smart-table-pagination__list-item\" [class.disabled]=\"currentPage() <= 1\">\n <a (click)=\"prev()\" aria-label=\"Prev\">\n @if (prevButtonText(); as text) {\n {{ text }}\n } @else {\n « Previous\n }\n </a>\n </li>\n @for (page of pages(); track $index) {\n <li class=\"ng2-smart-table-pagination__list-item\" [class.active]=\"currentPage() === page\">\n @if (isString(page) || currentPage() === page) {\n <span>\n {{ page }}\n </span>\n } @else {\n <a (click)=\"paginate(page)\">{{ page }}</a>\n }\n </li>\n }\n <li class=\"ng2-smart-table-pagination__list-item\" [class.disabled]=\"currentPage() >= lastPage()\">\n <a (click)=\"next()\" aria-label=\"Next\">\n @if (nextButtonText(); as text) {\n {{ text }}\n } @else {\n Next »\n }\n </a>\n </li>\n </ul>\n </nav>\n <div>\n @if ((pagingConf().perPageSelect?.length || 0) > 0) {\n <nav class=\"ng2-smart-pagination-per-page\">\n <label for=\"per-page\"> Per Page: </label>\n <select
|
|
855
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: PagerComponent, isStandalone: true, selector: "ng2-smart-table-pager", inputs: { source: { classPropertyName: "source", publicName: "source", isSignal: true, isRequired: true, transformFunction: null }, content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"ng2-smart-table-pagination__wrap\">\n <div class=\"total-wrap\">\n <ng-content>\n @if (content()) {\n <ng-template [ngTemplateOutlet]=\"content()!\"></ng-template>\n } @else {\n @if (isShowTotal()) {\n <span class=\"total-count\"> Total: {{ count() }} </span>\n }\n }\n </ng-content>\n </div>\n <nav class=\"ng2-smart-table-pagination__nav\">\n <ul class=\"ng2-smart-table-pagination__list\">\n <li class=\"ng2-smart-table-pagination__list-item\" [class.disabled]=\"currentPage() <= 1\">\n <a tabindex=\"0\" (keyup)=\"prev()\" (click)=\"prev()\" aria-label=\"Prev\">\n @if (prevButtonText(); as text) {\n {{ text }}\n } @else {\n « Previous\n }\n </a>\n </li>\n @for (page of pages(); track $index) {\n <li class=\"ng2-smart-table-pagination__list-item\" [class.active]=\"currentPage() === page\">\n @if (isString(page) || currentPage() === page) {\n <span>\n {{ page }}\n </span>\n } @else {\n <a [tabindex]=\"page\" (keyup)=\"paginate(page)\" (click)=\"paginate(page)\">{{ page }}</a>\n }\n </li>\n }\n <li class=\"ng2-smart-table-pagination__list-item\" [class.disabled]=\"currentPage() >= lastPage()\">\n <a tabindex=\"10\" (keyup)=\"next()\" (click)=\"next()\" aria-label=\"Next\">\n @if (nextButtonText(); as text) {\n {{ text }}\n } @else {\n Next »\n }\n </a>\n </li>\n </ul>\n </nav>\n <div>\n @if ((pagingConf().perPageSelect?.length || 0) > 0) {\n <nav class=\"ng2-smart-pagination-per-page\">\n <label for=\"per-page\"> Per Page: </label>\n <select\n (change)=\"onChangePerPage($any($event.target))\"\n [ngModel]=\"currentPerPage()\"\n id=\"ng2-smart-pagination-per-page\">\n @for (item of pagingConf().perPageSelect; track $index) {\n <option [value]=\"item\">{{ item }}</option>\n }\n </select>\n </nav>\n }\n </div>\n</div>\n", styles: [".ng2-smart-table-pagination__wrap{width:100%;display:inline-flex;align-items:center;font-size:.875em;padding:1rem}.ng2-smart-table-pagination__nav{margin:0 auto}.ng2-smart-table-pagination__list{margin:0;list-style:none;display:flex}.ng2-smart-table-pagination__list-item span,.ng2-smart-table-pagination__list-item a{color:var(--layout-text-color);padding:.2rem .5rem}.ng2-smart-table-pagination__list-item:not(.disabled) a{cursor:pointer}.ng2-smart-table-pagination__list-item:not(.disabled) a:hover{background-color:var(--layout-background-color);color:var(--layout-text-color)}.ng2-smart-table-pagination__list-item.active span{background-color:var(--card-header-primary-background-color);color:var(--card-header-primary-text-color)}.ng2-smart-table-pagination__list-item.disabled{opacity:.5}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
855
856
|
}
|
|
856
857
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PagerComponent, decorators: [{
|
|
857
858
|
type: Component,
|
|
858
|
-
args: [{ selector: 'ng2-smart-table-pager', changeDetection: ChangeDetectionStrategy.OnPush, imports: [FormsModule, NgTemplateOutlet], template: "<div class=\"ng2-smart-table-pagination__wrap\">\n <div class=\"total-wrap\">\n <ng-content>\n @if (content()) {\n <ng-template [ngTemplateOutlet]=\"content()!\"></ng-template>\n } @else {\n @if (isShowTotal()) {\n <span class=\"total-count\"> Total: {{ count() }} </span>\n }\n }\n </ng-content>\n </div>\n <nav class=\"ng2-smart-table-pagination__nav\">\n <ul class=\"ng2-smart-table-pagination__list\">\n <li class=\"ng2-smart-table-pagination__list-item\" [class.disabled]=\"currentPage() <= 1\">\n <a (click)=\"prev()\" aria-label=\"Prev\">\n @if (prevButtonText(); as text) {\n {{ text }}\n } @else {\n « Previous\n }\n </a>\n </li>\n @for (page of pages(); track $index) {\n <li class=\"ng2-smart-table-pagination__list-item\" [class.active]=\"currentPage() === page\">\n @if (isString(page) || currentPage() === page) {\n <span>\n {{ page }}\n </span>\n } @else {\n <a (click)=\"paginate(page)\">{{ page }}</a>\n }\n </li>\n }\n <li class=\"ng2-smart-table-pagination__list-item\" [class.disabled]=\"currentPage() >= lastPage()\">\n <a (click)=\"next()\" aria-label=\"Next\">\n @if (nextButtonText(); as text) {\n {{ text }}\n } @else {\n Next »\n }\n </a>\n </li>\n </ul>\n </nav>\n <div>\n @if ((pagingConf().perPageSelect?.length || 0) > 0) {\n <nav class=\"ng2-smart-pagination-per-page\">\n <label for=\"per-page\"> Per Page: </label>\n <select
|
|
859
|
+
args: [{ selector: 'ng2-smart-table-pager', changeDetection: ChangeDetectionStrategy.OnPush, imports: [FormsModule, NgTemplateOutlet], template: "<div class=\"ng2-smart-table-pagination__wrap\">\n <div class=\"total-wrap\">\n <ng-content>\n @if (content()) {\n <ng-template [ngTemplateOutlet]=\"content()!\"></ng-template>\n } @else {\n @if (isShowTotal()) {\n <span class=\"total-count\"> Total: {{ count() }} </span>\n }\n }\n </ng-content>\n </div>\n <nav class=\"ng2-smart-table-pagination__nav\">\n <ul class=\"ng2-smart-table-pagination__list\">\n <li class=\"ng2-smart-table-pagination__list-item\" [class.disabled]=\"currentPage() <= 1\">\n <a tabindex=\"0\" (keyup)=\"prev()\" (click)=\"prev()\" aria-label=\"Prev\">\n @if (prevButtonText(); as text) {\n {{ text }}\n } @else {\n « Previous\n }\n </a>\n </li>\n @for (page of pages(); track $index) {\n <li class=\"ng2-smart-table-pagination__list-item\" [class.active]=\"currentPage() === page\">\n @if (isString(page) || currentPage() === page) {\n <span>\n {{ page }}\n </span>\n } @else {\n <a [tabindex]=\"page\" (keyup)=\"paginate(page)\" (click)=\"paginate(page)\">{{ page }}</a>\n }\n </li>\n }\n <li class=\"ng2-smart-table-pagination__list-item\" [class.disabled]=\"currentPage() >= lastPage()\">\n <a tabindex=\"10\" (keyup)=\"next()\" (click)=\"next()\" aria-label=\"Next\">\n @if (nextButtonText(); as text) {\n {{ text }}\n } @else {\n Next »\n }\n </a>\n </li>\n </ul>\n </nav>\n <div>\n @if ((pagingConf().perPageSelect?.length || 0) > 0) {\n <nav class=\"ng2-smart-pagination-per-page\">\n <label for=\"per-page\"> Per Page: </label>\n <select\n (change)=\"onChangePerPage($any($event.target))\"\n [ngModel]=\"currentPerPage()\"\n id=\"ng2-smart-pagination-per-page\">\n @for (item of pagingConf().perPageSelect; track $index) {\n <option [value]=\"item\">{{ item }}</option>\n }\n </select>\n </nav>\n }\n </div>\n</div>\n", styles: [".ng2-smart-table-pagination__wrap{width:100%;display:inline-flex;align-items:center;font-size:.875em;padding:1rem}.ng2-smart-table-pagination__nav{margin:0 auto}.ng2-smart-table-pagination__list{margin:0;list-style:none;display:flex}.ng2-smart-table-pagination__list-item span,.ng2-smart-table-pagination__list-item a{color:var(--layout-text-color);padding:.2rem .5rem}.ng2-smart-table-pagination__list-item:not(.disabled) a{cursor:pointer}.ng2-smart-table-pagination__list-item:not(.disabled) a:hover{background-color:var(--layout-background-color);color:var(--layout-text-color)}.ng2-smart-table-pagination__list-item.active span{background-color:var(--card-header-primary-background-color);color:var(--card-header-primary-text-color)}.ng2-smart-table-pagination__list-item.disabled{opacity:.5}\n"] }]
|
|
859
860
|
}] });
|
|
860
861
|
|
|
861
862
|
class CheckboxEditorComponent extends BaseEditorComponent {
|
|
@@ -1333,13 +1334,13 @@ class TrowComponent {
|
|
|
1333
1334
|
this.row()?.isInEditing.set(false);
|
|
1334
1335
|
}
|
|
1335
1336
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TrowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1336
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: TrowComponent, isStandalone: true, selector: "[ng2-st-trow]", inputs: { grid: { classPropertyName: "grid", publicName: "grid", isSignal: true, isRequired: true, transformFunction: null }, source: { classPropertyName: "source", publicName: "source", isSignal: true, isRequired: true, transformFunction: null }, row: { classPropertyName: "row", publicName: "row", isSignal: true, isRequired: true, transformFunction: null }, isMobileView: { classPropertyName: "isMobileView", publicName: "isMobileView", isSignal: true, isRequired: false, transformFunction: null }, isCreateRow: { classPropertyName: "isCreateRow", publicName: "isCreateRow", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { edit: "edit", editCancel: "editCancel", editConfirmed: "editConfirmed", deleteEmitter: "deleteEmitter", createConfirmed: "createConfirmed", customActionEmitter: "customActionEmitter", userClickedRow: "userClickedRow", multipleSelectRow: "multipleSelectRow" }, host: { properties: { "class.ng2-smart-card": "isMobileView()" } }, ngImport: i0, template: "@if (isMobileView()) {\n <td colspan=\"50\">\n <div class=\"ng2-smart-card-header\">\n <ng-container [ngTemplateOutlet]=\"multiselectCheckbox\"></ng-container>\n <div class=\"ng2-smart-card-actions\">\n <ng-container [ngTemplateOutlet]=\"actions\"></ng-container>\n </div>\n </div>\n <div class=\"ng2-smart-card-content\">\n @for (cell of row().visibleCells(); track cell.id + $index) {\n <div class=\"ng2-smart-card-field\">\n <div class=\"ng2-smart-card-field-label\">{{ cell.title }}</div>\n <div class=\"ng2-smart-card-field-value\">\n <ng2-smart-table-cell [cell]=\"cell\" [isInEditing]=\"!!row().isInEditing()\"> </ng2-smart-table-cell>\n </div>\n </div>\n }\n </div>\n </td>\n} @else {\n <ng-container [ngTemplateOutlet]=\"multiselectCheckbox\"></ng-container>\n @if (grid().actionIsOnLeft()) {\n <ng-container [ngTemplateOutlet]=\"actions\"></ng-container>\n }\n @for (cell of row().visibleCells(); track cell.id + $index) {\n <td [class]=\"cell.columnClass\" [style]=\"cell.styles\">\n <ng2-smart-table-cell [cell]=\"cell\" [isInEditing]=\"!!row().isInEditing()\"> </ng2-smart-table-cell>\n </td>\n }\n @if (grid().actionIsOnRight()) {\n <ng-container [ngTemplateOutlet]=\"actions\"></ng-container>\n }\n}\n\n<ng-template #actions>\n @if (isCreateRow() || row().isInEditing()) {\n <td class=\"ng2-smart-actions\">\n <ng2-st-tbody-create-cancel\n [grid]=\"grid()\"\n [rowIndex]=\"row().index || 0\"\n (cancelEdit)=\"onCancelEdit()\"\n (save)=\"onSave()\"\n [rowPending]=\"!!row().pending()\"></ng2-st-tbody-create-cancel>\n </td>\n } @else {\n @if (grid().isActionsVisible()) {\n <td class=\"ng2-smart-actions\" (click)=\"$event.stopPropagation()\">\n <ng2-row-actions\n [grid]=\"grid()\"\n [row]=\"row()\"\n (customActionEmitter)=\"customActionEmitter.emit($event)\"\n (editEmitter)=\"edit.emit()\"\n (deleteEmitter)=\"deleteEmitter.emit()\"></ng2-row-actions>\n </td>\n }\n }\n</ng-template>\n\n<ng-template #multiselectCheckbox>\n @if (grid().isMultiSelectVisible() && !isCreateRow()) {\n <td\n class=\"ng2-smart-actions ng2-smart-action-multiple-select\"\n (click)=\"$event.stopPropagation(); multipleSelectRow.emit(row())\">\n <input\n type=\"checkbox\"\n [id]=\"'row-' + row().index + '_select-checkbox'\"\n class=\"form-control\"\n [ngModel]=\"row().isSelected()\" />\n </td>\n }\n</ng-template>\n", styles: [":host .ng2-smart-action-multiple-select{margin-right:.5rem;text-align:center}:host.ng2-smart-card{display:block;margin-bottom:1rem;border-radius:.5rem;overflow:hidden;box-shadow:var(--table-card-shadow, 0 0 8px 5px color-mix(in oklab, var(--smart-table-bg, #d7d7d7) 30%, transparent 50%));background-color:var(--smart-table-bg, #ffffff)}:host.ng2-smart-card td{display:block;padding:0;border:none}:host.ng2-smart-card td .ng2-smart-actions{margin:.5rem}:host.ng2-smart-card td .ng2-smart-card-header{display:flex;align-items:center;gap:.5rem;justify-content:space-between}:host.ng2-smart-card td .ng2-smart-card-content{padding:1rem;display:grid;gap:.75rem}@media (min-width: 400px){:host.ng2-smart-card td .ng2-smart-card-content{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}}:host.ng2-smart-card td .ng2-smart-card-content .ng2-smart-card-field .ng2-smart-card-field-label{font-weight:600;color:inherit;margin-bottom:.35rem;font-size:.9em}:host.ng2-smart-card td .ng2-smart-card-content .ng2-smart-card-field .ng2-smart-card-field-value{word-break:break-word}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CellComponent, selector: "ng2-smart-table-cell", inputs: ["cell", "isInEditing"] }, { kind: "component", type: RowActionsComponent, selector: "ng2-row-actions", inputs: ["grid", "row"], outputs: ["editEmitter", "deleteEmitter", "customActionEmitter"] }, { kind: "component", type: TbodyCreateCancelComponent, selector: "ng2-st-tbody-create-cancel", inputs: ["grid", "rowIndex", "rowPending"], outputs: ["save", "cancelEdit"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1337
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: TrowComponent, isStandalone: true, selector: "[ng2-st-trow]", inputs: { grid: { classPropertyName: "grid", publicName: "grid", isSignal: true, isRequired: true, transformFunction: null }, source: { classPropertyName: "source", publicName: "source", isSignal: true, isRequired: true, transformFunction: null }, row: { classPropertyName: "row", publicName: "row", isSignal: true, isRequired: true, transformFunction: null }, isMobileView: { classPropertyName: "isMobileView", publicName: "isMobileView", isSignal: true, isRequired: false, transformFunction: null }, isCreateRow: { classPropertyName: "isCreateRow", publicName: "isCreateRow", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { edit: "edit", editCancel: "editCancel", editConfirmed: "editConfirmed", deleteEmitter: "deleteEmitter", createConfirmed: "createConfirmed", customActionEmitter: "customActionEmitter", userClickedRow: "userClickedRow", multipleSelectRow: "multipleSelectRow" }, host: { properties: { "class.ng2-smart-card": "isMobileView()" } }, ngImport: i0, template: "@if (isMobileView()) {\n <td colspan=\"50\">\n <div class=\"ng2-smart-card-header\">\n <ng-container [ngTemplateOutlet]=\"multiselectCheckbox\"></ng-container>\n <div class=\"ng2-smart-card-actions\">\n <ng-container [ngTemplateOutlet]=\"actions\"></ng-container>\n </div>\n </div>\n <div class=\"ng2-smart-card-content\">\n @for (cell of row().visibleCells(); track cell.id + $index) {\n <div class=\"ng2-smart-card-field\">\n <div class=\"ng2-smart-card-field-label\">{{ cell.title }}</div>\n <div class=\"ng2-smart-card-field-value\">\n <ng2-smart-table-cell [cell]=\"cell\" [isInEditing]=\"!!row().isInEditing()\"> </ng2-smart-table-cell>\n </div>\n </div>\n }\n </div>\n </td>\n} @else {\n <ng-container [ngTemplateOutlet]=\"multiselectCheckbox\"></ng-container>\n @if (grid().actionIsOnLeft()) {\n <ng-container [ngTemplateOutlet]=\"actions\"></ng-container>\n }\n @for (cell of row().visibleCells(); track cell.id + $index) {\n <td [class]=\"cell.columnClass\" [style]=\"cell.styles\">\n <ng2-smart-table-cell [cell]=\"cell\" [isInEditing]=\"!!row().isInEditing()\"> </ng2-smart-table-cell>\n </td>\n }\n @if (grid().actionIsOnRight()) {\n <ng-container [ngTemplateOutlet]=\"actions\"></ng-container>\n }\n}\n\n<ng-template #actions>\n @if (isCreateRow() || row().isInEditing()) {\n <td class=\"ng2-smart-actions\" (click)=\"$event.stopPropagation()\">\n <ng2-st-tbody-create-cancel\n [grid]=\"grid()\"\n [rowIndex]=\"row().index || 0\"\n (cancelEdit)=\"onCancelEdit()\"\n (save)=\"onSave()\"\n [rowPending]=\"!!row().pending()\"></ng2-st-tbody-create-cancel>\n </td>\n } @else {\n @if (grid().isActionsVisible()) {\n <td class=\"ng2-smart-actions\" (click)=\"$event.stopPropagation()\">\n <ng2-row-actions\n [grid]=\"grid()\"\n [row]=\"row()\"\n (customActionEmitter)=\"customActionEmitter.emit($event)\"\n (editEmitter)=\"edit.emit()\"\n (deleteEmitter)=\"deleteEmitter.emit()\"></ng2-row-actions>\n </td>\n }\n }\n</ng-template>\n\n<ng-template #multiselectCheckbox>\n @if (grid().isMultiSelectVisible() && !isCreateRow()) {\n <td\n class=\"ng2-smart-actions ng2-smart-action-multiple-select\"\n (click)=\"$event.stopPropagation(); multipleSelectRow.emit(row())\">\n <input\n type=\"checkbox\"\n [id]=\"'row-' + row().index + '_select-checkbox'\"\n class=\"form-control\"\n [ngModel]=\"row().isSelected()\" />\n </td>\n }\n</ng-template>\n", styles: [":host .ng2-smart-action-multiple-select{margin-right:.5rem;text-align:center}:host.ng2-smart-card{display:block;margin-bottom:1rem;border-radius:.5rem;overflow:hidden;box-shadow:var(--table-card-shadow, 0 0 8px 5px color-mix(in oklab, var(--smart-table-bg, #d7d7d7) 30%, transparent 50%));background-color:var(--smart-table-bg, #ffffff)}:host.ng2-smart-card td{display:block;padding:0;border:none}:host.ng2-smart-card td .ng2-smart-actions{margin:.5rem}:host.ng2-smart-card td .ng2-smart-card-header{display:flex;align-items:center;gap:.5rem;justify-content:space-between}:host.ng2-smart-card td .ng2-smart-card-content{padding:1rem;display:grid;gap:.75rem}@media (min-width: 400px){:host.ng2-smart-card td .ng2-smart-card-content{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}}:host.ng2-smart-card td .ng2-smart-card-content .ng2-smart-card-field .ng2-smart-card-field-label{font-weight:600;color:inherit;margin-bottom:.35rem;font-size:.9em}:host.ng2-smart-card td .ng2-smart-card-content .ng2-smart-card-field .ng2-smart-card-field-value{word-break:break-word}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CellComponent, selector: "ng2-smart-table-cell", inputs: ["cell", "isInEditing"] }, { kind: "component", type: RowActionsComponent, selector: "ng2-row-actions", inputs: ["grid", "row"], outputs: ["editEmitter", "deleteEmitter", "customActionEmitter"] }, { kind: "component", type: TbodyCreateCancelComponent, selector: "ng2-st-tbody-create-cancel", inputs: ["grid", "rowIndex", "rowPending"], outputs: ["save", "cancelEdit"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1337
1338
|
}
|
|
1338
1339
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TrowComponent, decorators: [{
|
|
1339
1340
|
type: Component,
|
|
1340
1341
|
args: [{ selector: '[ng2-st-trow]', imports: [NgTemplateOutlet, FormsModule, CellComponent, RowActionsComponent, TbodyCreateCancelComponent], host: {
|
|
1341
1342
|
'[class.ng2-smart-card]': 'isMobileView()',
|
|
1342
|
-
}, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (isMobileView()) {\n <td colspan=\"50\">\n <div class=\"ng2-smart-card-header\">\n <ng-container [ngTemplateOutlet]=\"multiselectCheckbox\"></ng-container>\n <div class=\"ng2-smart-card-actions\">\n <ng-container [ngTemplateOutlet]=\"actions\"></ng-container>\n </div>\n </div>\n <div class=\"ng2-smart-card-content\">\n @for (cell of row().visibleCells(); track cell.id + $index) {\n <div class=\"ng2-smart-card-field\">\n <div class=\"ng2-smart-card-field-label\">{{ cell.title }}</div>\n <div class=\"ng2-smart-card-field-value\">\n <ng2-smart-table-cell [cell]=\"cell\" [isInEditing]=\"!!row().isInEditing()\"> </ng2-smart-table-cell>\n </div>\n </div>\n }\n </div>\n </td>\n} @else {\n <ng-container [ngTemplateOutlet]=\"multiselectCheckbox\"></ng-container>\n @if (grid().actionIsOnLeft()) {\n <ng-container [ngTemplateOutlet]=\"actions\"></ng-container>\n }\n @for (cell of row().visibleCells(); track cell.id + $index) {\n <td [class]=\"cell.columnClass\" [style]=\"cell.styles\">\n <ng2-smart-table-cell [cell]=\"cell\" [isInEditing]=\"!!row().isInEditing()\"> </ng2-smart-table-cell>\n </td>\n }\n @if (grid().actionIsOnRight()) {\n <ng-container [ngTemplateOutlet]=\"actions\"></ng-container>\n }\n}\n\n<ng-template #actions>\n @if (isCreateRow() || row().isInEditing()) {\n <td class=\"ng2-smart-actions\">\n <ng2-st-tbody-create-cancel\n [grid]=\"grid()\"\n [rowIndex]=\"row().index || 0\"\n (cancelEdit)=\"onCancelEdit()\"\n (save)=\"onSave()\"\n [rowPending]=\"!!row().pending()\"></ng2-st-tbody-create-cancel>\n </td>\n } @else {\n @if (grid().isActionsVisible()) {\n <td class=\"ng2-smart-actions\" (click)=\"$event.stopPropagation()\">\n <ng2-row-actions\n [grid]=\"grid()\"\n [row]=\"row()\"\n (customActionEmitter)=\"customActionEmitter.emit($event)\"\n (editEmitter)=\"edit.emit()\"\n (deleteEmitter)=\"deleteEmitter.emit()\"></ng2-row-actions>\n </td>\n }\n }\n</ng-template>\n\n<ng-template #multiselectCheckbox>\n @if (grid().isMultiSelectVisible() && !isCreateRow()) {\n <td\n class=\"ng2-smart-actions ng2-smart-action-multiple-select\"\n (click)=\"$event.stopPropagation(); multipleSelectRow.emit(row())\">\n <input\n type=\"checkbox\"\n [id]=\"'row-' + row().index + '_select-checkbox'\"\n class=\"form-control\"\n [ngModel]=\"row().isSelected()\" />\n </td>\n }\n</ng-template>\n", styles: [":host .ng2-smart-action-multiple-select{margin-right:.5rem;text-align:center}:host.ng2-smart-card{display:block;margin-bottom:1rem;border-radius:.5rem;overflow:hidden;box-shadow:var(--table-card-shadow, 0 0 8px 5px color-mix(in oklab, var(--smart-table-bg, #d7d7d7) 30%, transparent 50%));background-color:var(--smart-table-bg, #ffffff)}:host.ng2-smart-card td{display:block;padding:0;border:none}:host.ng2-smart-card td .ng2-smart-actions{margin:.5rem}:host.ng2-smart-card td .ng2-smart-card-header{display:flex;align-items:center;gap:.5rem;justify-content:space-between}:host.ng2-smart-card td .ng2-smart-card-content{padding:1rem;display:grid;gap:.75rem}@media (min-width: 400px){:host.ng2-smart-card td .ng2-smart-card-content{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}}:host.ng2-smart-card td .ng2-smart-card-content .ng2-smart-card-field .ng2-smart-card-field-label{font-weight:600;color:inherit;margin-bottom:.35rem;font-size:.9em}:host.ng2-smart-card td .ng2-smart-card-content .ng2-smart-card-field .ng2-smart-card-field-value{word-break:break-word}\n"] }]
|
|
1343
|
+
}, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (isMobileView()) {\n <td colspan=\"50\">\n <div class=\"ng2-smart-card-header\">\n <ng-container [ngTemplateOutlet]=\"multiselectCheckbox\"></ng-container>\n <div class=\"ng2-smart-card-actions\">\n <ng-container [ngTemplateOutlet]=\"actions\"></ng-container>\n </div>\n </div>\n <div class=\"ng2-smart-card-content\">\n @for (cell of row().visibleCells(); track cell.id + $index) {\n <div class=\"ng2-smart-card-field\">\n <div class=\"ng2-smart-card-field-label\">{{ cell.title }}</div>\n <div class=\"ng2-smart-card-field-value\">\n <ng2-smart-table-cell [cell]=\"cell\" [isInEditing]=\"!!row().isInEditing()\"> </ng2-smart-table-cell>\n </div>\n </div>\n }\n </div>\n </td>\n} @else {\n <ng-container [ngTemplateOutlet]=\"multiselectCheckbox\"></ng-container>\n @if (grid().actionIsOnLeft()) {\n <ng-container [ngTemplateOutlet]=\"actions\"></ng-container>\n }\n @for (cell of row().visibleCells(); track cell.id + $index) {\n <td [class]=\"cell.columnClass\" [style]=\"cell.styles\">\n <ng2-smart-table-cell [cell]=\"cell\" [isInEditing]=\"!!row().isInEditing()\"> </ng2-smart-table-cell>\n </td>\n }\n @if (grid().actionIsOnRight()) {\n <ng-container [ngTemplateOutlet]=\"actions\"></ng-container>\n }\n}\n\n<ng-template #actions>\n @if (isCreateRow() || row().isInEditing()) {\n <td class=\"ng2-smart-actions\" (click)=\"$event.stopPropagation()\">\n <ng2-st-tbody-create-cancel\n [grid]=\"grid()\"\n [rowIndex]=\"row().index || 0\"\n (cancelEdit)=\"onCancelEdit()\"\n (save)=\"onSave()\"\n [rowPending]=\"!!row().pending()\"></ng2-st-tbody-create-cancel>\n </td>\n } @else {\n @if (grid().isActionsVisible()) {\n <td class=\"ng2-smart-actions\" (click)=\"$event.stopPropagation()\">\n <ng2-row-actions\n [grid]=\"grid()\"\n [row]=\"row()\"\n (customActionEmitter)=\"customActionEmitter.emit($event)\"\n (editEmitter)=\"edit.emit()\"\n (deleteEmitter)=\"deleteEmitter.emit()\"></ng2-row-actions>\n </td>\n }\n }\n</ng-template>\n\n<ng-template #multiselectCheckbox>\n @if (grid().isMultiSelectVisible() && !isCreateRow()) {\n <td\n class=\"ng2-smart-actions ng2-smart-action-multiple-select\"\n (click)=\"$event.stopPropagation(); multipleSelectRow.emit(row())\">\n <input\n type=\"checkbox\"\n [id]=\"'row-' + row().index + '_select-checkbox'\"\n class=\"form-control\"\n [ngModel]=\"row().isSelected()\" />\n </td>\n }\n</ng-template>\n", styles: [":host .ng2-smart-action-multiple-select{margin-right:.5rem;text-align:center}:host.ng2-smart-card{display:block;margin-bottom:1rem;border-radius:.5rem;overflow:hidden;box-shadow:var(--table-card-shadow, 0 0 8px 5px color-mix(in oklab, var(--smart-table-bg, #d7d7d7) 30%, transparent 50%));background-color:var(--smart-table-bg, #ffffff)}:host.ng2-smart-card td{display:block;padding:0;border:none}:host.ng2-smart-card td .ng2-smart-actions{margin:.5rem}:host.ng2-smart-card td .ng2-smart-card-header{display:flex;align-items:center;gap:.5rem;justify-content:space-between}:host.ng2-smart-card td .ng2-smart-card-content{padding:1rem;display:grid;gap:.75rem}@media (min-width: 400px){:host.ng2-smart-card td .ng2-smart-card-content{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}}:host.ng2-smart-card td .ng2-smart-card-content .ng2-smart-card-field .ng2-smart-card-field-label{font-weight:600;color:inherit;margin-bottom:.35rem;font-size:.9em}:host.ng2-smart-card td .ng2-smart-card-content .ng2-smart-card-field .ng2-smart-card-field-value{word-break:break-word}\n"] }]
|
|
1343
1344
|
}] });
|
|
1344
1345
|
|
|
1345
1346
|
class Ng2SmartTableTbodyComponent {
|
|
@@ -2189,7 +2190,6 @@ class DataSet {
|
|
|
2189
2190
|
}
|
|
2190
2191
|
multipleSelectRow(row) {
|
|
2191
2192
|
row.isSelected.update((old) => !old);
|
|
2192
|
-
console.log('row', row);
|
|
2193
2193
|
this.storeSelectedRow(row);
|
|
2194
2194
|
return row;
|
|
2195
2195
|
}
|