@den4ik92/ng2-smart-table 2.0.0 → 2.0.2

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.
@@ -1232,6 +1232,11 @@ class LocalDataSource extends DataSource {
1232
1232
  this.data.unshift(element);
1233
1233
  return super.prependEmit(element);
1234
1234
  }
1235
+ appendMany(elements) {
1236
+ this.reset(true);
1237
+ this.data = [...this.data, ...elements];
1238
+ return super.loadEmit();
1239
+ }
1235
1240
  append(element) {
1236
1241
  this.reset(true);
1237
1242
  this.data.push(element);
@@ -2956,6 +2961,7 @@ class Ng2SmartTableComponent {
2956
2961
  constructor() {
2957
2962
  this.multiRowSelect = new EventEmitter();
2958
2963
  this.rowClicked = new EventEmitter();
2964
+ this.listScrollEnd = new EventEmitter();
2959
2965
  this.delete = new EventEmitter();
2960
2966
  this.edit = new EventEmitter();
2961
2967
  this.editCancel = new EventEmitter();
@@ -2972,11 +2978,13 @@ class Ng2SmartTableComponent {
2972
2978
  this.isHideSubHeader = false;
2973
2979
  this.isPagerDisplay = false;
2974
2980
  this.rowClassFunction = () => '';
2981
+ this.currentScrollTop = 0;
2975
2982
  this.defaultSettings = {
2976
2983
  mode: 'inline',
2977
2984
  selectMode: 'single',
2978
2985
  selectedRowIndex: -1,
2979
2986
  switchPageToSelectedRowPage: false,
2987
+ bodyHeight: '85vh',
2980
2988
  hideHeader: false,
2981
2989
  hideSubHeader: false,
2982
2990
  actions: {
@@ -3051,6 +3059,20 @@ class Ng2SmartTableComponent {
3051
3059
  onSelectRow(row, state) {
3052
3060
  this.grid.selectRow(row, state);
3053
3061
  }
3062
+ emitUserRowClicked(row) {
3063
+ this.rowClicked.emit({
3064
+ data: row ? row.getData() : null,
3065
+ source: this.source,
3066
+ });
3067
+ }
3068
+ onScroll(event) {
3069
+ const { scrollHeight, scrollTop, clientHeight } = event.target;
3070
+ const isListEnd = (clientHeight + Math.round(scrollTop)) >= scrollHeight;
3071
+ if (isListEnd && this.currentScrollTop < scrollTop) {
3072
+ this.listScrollEnd.emit(true);
3073
+ }
3074
+ this.currentScrollTop = scrollTop;
3075
+ }
3054
3076
  initGrid() {
3055
3077
  this.source = this.prepareSource();
3056
3078
  this.grid = new Grid(this.source, this.prepareSettings());
@@ -3072,18 +3094,12 @@ class Ng2SmartTableComponent {
3072
3094
  selected: this.grid.dataSet.getSelectedRowsData(),
3073
3095
  });
3074
3096
  }
3075
- emitUserRowClicked(row) {
3076
- this.rowClicked.emit({
3077
- data: row ? row.getData() : null,
3078
- source: this.source,
3079
- });
3080
- }
3081
3097
  }
3082
3098
  Ng2SmartTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: Ng2SmartTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3083
- Ng2SmartTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: Ng2SmartTableComponent, selector: "ng2-smart-table", inputs: { source: "source", settings: "settings" }, outputs: { multiRowSelect: "multiRowSelect", rowClicked: "rowClicked", delete: "delete", edit: "edit", editCancel: "editCancel", create: "create", custom: "custom", deleteConfirm: "deleteConfirm", editConfirm: "editConfirm", createConfirm: "createConfirm", rowHover: "rowHover" }, usesOnChanges: true, ngImport: i0, template: "<table [id]=\"tableId\" [ngClass]=\"tableClass\">\n\n <thead ng2-st-thead *ngIf=\"!isHideHeader || !isHideSubHeader\"\n [grid]=\"grid\"\n [source]=\"source\"\n [createConfirm]=\"createConfirm\"\n (create)=\"create.emit($event)\"\n (selectAllRows)=\"onSelectAllRows()\">\n </thead>\n\n <tbody ng2-st-tbody [grid]=\"grid\"\n [source]=\"source\"\n [deleteConfirm]=\"deleteConfirm\"\n [editConfirm]=\"editConfirm\"\n [rowClassFunction]=\"rowClassFunction\"\n (edit)=\"edit.emit($event)\"\n (editCancel)=\"editCancel.emit($event)\"\n (delete)=\"delete.emit($event)\"\n (custom)=\"custom.emit($event)\"\n (userClickedRow)=\"emitUserRowClicked($event)\"\n (multipleSelectRow)=\"multipleSelectRow($event)\">\n </tbody>\n\n</table>\n\n<ng2-smart-table-pager *ngIf=\"isPagerDisplay\"\n [source]=\"source\"\n [perPageSelect]=\"perPageSelect\">\n</ng2-smart-table-pager>\n", styles: [":host{font-size:1rem}:host ::ng-deep *{box-sizing:border-box}:host ::ng-deep button,:host ::ng-deep input,:host ::ng-deep optgroup,:host ::ng-deep select,:host ::ng-deep textarea{color:inherit;font:inherit;margin:0}:host ::ng-deep table{line-height:1.5em;border-collapse:collapse;border-spacing:0;display:table;width:100%;max-width:100%;overflow:auto;word-break:normal;word-break:keep-all}:host ::ng-deep table tr th{font-weight:700}:host ::ng-deep table tr section{font-size:.75em;font-weight:700}:host ::ng-deep table tr td,:host ::ng-deep table tr th{font-size:.875em;margin:0;padding:.5em 1em}:host ::ng-deep a{color:#1e6bb8;text-decoration:none}:host ::ng-deep a:hover{text-decoration:underline}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: PagerComponent, selector: "ng2-smart-table-pager", inputs: ["source", "perPageSelect"], outputs: ["changePage"] }, { kind: "component", type: Ng2SmartTableTbodyComponent, selector: "[ng2-st-tbody]", inputs: ["grid", "source", "deleteConfirm", "editConfirm", "rowClassFunction"], outputs: ["save", "cancel", "edit", "editCancel", "delete", "custom", "edited", "userSelectRow", "userClickedRow", "editRowSelect", "multipleSelectRow"] }, { kind: "component", type: Ng2SmartTableTheadComponent, selector: "[ng2-st-thead]", inputs: ["grid", "source", "createConfirm"], outputs: ["sort", "selectAllRows", "create", "filter"] }] });
3099
+ Ng2SmartTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: Ng2SmartTableComponent, selector: "ng2-smart-table", inputs: { source: "source", settings: "settings" }, outputs: { multiRowSelect: "multiRowSelect", rowClicked: "rowClicked", listScrollEnd: "listScrollEnd", delete: "delete", edit: "edit", editCancel: "editCancel", create: "create", custom: "custom", deleteConfirm: "deleteConfirm", editConfirm: "editConfirm", createConfirm: "createConfirm", rowHover: "rowHover" }, usesOnChanges: true, ngImport: i0, template: "<table [id]=\"tableId\" [ngClass]=\"tableClass\">\n\n <thead ng2-st-thead *ngIf=\"!isHideHeader || !isHideSubHeader\"\n [grid]=\"grid\"\n [source]=\"source\"\n [createConfirm]=\"createConfirm\"\n (create)=\"create.emit($event)\"\n (selectAllRows)=\"onSelectAllRows()\">\n </thead>\n\n <tbody ng2-st-tbody [ngStyle]=\"{'max-height': this.grid.getSetting('bodyHeight', '85vh')}\"\n [grid]=\"grid\"\n [source]=\"source\"\n [deleteConfirm]=\"deleteConfirm\"\n [editConfirm]=\"editConfirm\"\n [rowClassFunction]=\"rowClassFunction\"\n (edit)=\"edit.emit($event)\"\n (editCancel)=\"editCancel.emit($event)\"\n (delete)=\"delete.emit($event)\"\n (custom)=\"custom.emit($event)\"\n (scroll)=\"onScroll($any($event))\"\n (userClickedRow)=\"emitUserRowClicked($event)\"\n (multipleSelectRow)=\"multipleSelectRow($event)\">\n </tbody>\n\n</table>\n\n<ng2-smart-table-pager *ngIf=\"isPagerDisplay\"\n [source]=\"source\"\n [perPageSelect]=\"perPageSelect\">\n</ng2-smart-table-pager>\n", styles: [":host{font-size:1rem}:host ::ng-deep *{box-sizing:border-box}:host ::ng-deep button,:host ::ng-deep input,:host ::ng-deep optgroup,:host ::ng-deep select,:host ::ng-deep textarea{color:inherit;font:inherit;margin:0}:host ::ng-deep table{line-height:1.5em;border-collapse:collapse;border-spacing:0;display:table;width:100%;max-width:100%;word-break:normal;word-break:keep-all}:host ::ng-deep table tbody{display:block;max-height:85vh;overflow-y:scroll}:host ::ng-deep table tr{display:table;width:100%;table-layout:fixed}:host ::ng-deep table tr th{font-weight:700}:host ::ng-deep table tr section{font-size:.75em;font-weight:700}:host ::ng-deep table tr td,:host ::ng-deep table tr th{font-size:.875em;margin:0;padding:.5em 1em}:host ::ng-deep a{color:#1e6bb8;text-decoration:none}:host ::ng-deep a:hover{text-decoration:underline}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: PagerComponent, selector: "ng2-smart-table-pager", inputs: ["source", "perPageSelect"], outputs: ["changePage"] }, { kind: "component", type: Ng2SmartTableTbodyComponent, selector: "[ng2-st-tbody]", inputs: ["grid", "source", "deleteConfirm", "editConfirm", "rowClassFunction"], outputs: ["save", "cancel", "edit", "editCancel", "delete", "custom", "edited", "userSelectRow", "userClickedRow", "editRowSelect", "multipleSelectRow"] }, { kind: "component", type: Ng2SmartTableTheadComponent, selector: "[ng2-st-thead]", inputs: ["grid", "source", "createConfirm"], outputs: ["sort", "selectAllRows", "create", "filter"] }] });
3084
3100
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: Ng2SmartTableComponent, decorators: [{
3085
3101
  type: Component,
3086
- args: [{ selector: 'ng2-smart-table', template: "<table [id]=\"tableId\" [ngClass]=\"tableClass\">\n\n <thead ng2-st-thead *ngIf=\"!isHideHeader || !isHideSubHeader\"\n [grid]=\"grid\"\n [source]=\"source\"\n [createConfirm]=\"createConfirm\"\n (create)=\"create.emit($event)\"\n (selectAllRows)=\"onSelectAllRows()\">\n </thead>\n\n <tbody ng2-st-tbody [grid]=\"grid\"\n [source]=\"source\"\n [deleteConfirm]=\"deleteConfirm\"\n [editConfirm]=\"editConfirm\"\n [rowClassFunction]=\"rowClassFunction\"\n (edit)=\"edit.emit($event)\"\n (editCancel)=\"editCancel.emit($event)\"\n (delete)=\"delete.emit($event)\"\n (custom)=\"custom.emit($event)\"\n (userClickedRow)=\"emitUserRowClicked($event)\"\n (multipleSelectRow)=\"multipleSelectRow($event)\">\n </tbody>\n\n</table>\n\n<ng2-smart-table-pager *ngIf=\"isPagerDisplay\"\n [source]=\"source\"\n [perPageSelect]=\"perPageSelect\">\n</ng2-smart-table-pager>\n", styles: [":host{font-size:1rem}:host ::ng-deep *{box-sizing:border-box}:host ::ng-deep button,:host ::ng-deep input,:host ::ng-deep optgroup,:host ::ng-deep select,:host ::ng-deep textarea{color:inherit;font:inherit;margin:0}:host ::ng-deep table{line-height:1.5em;border-collapse:collapse;border-spacing:0;display:table;width:100%;max-width:100%;overflow:auto;word-break:normal;word-break:keep-all}:host ::ng-deep table tr th{font-weight:700}:host ::ng-deep table tr section{font-size:.75em;font-weight:700}:host ::ng-deep table tr td,:host ::ng-deep table tr th{font-size:.875em;margin:0;padding:.5em 1em}:host ::ng-deep a{color:#1e6bb8;text-decoration:none}:host ::ng-deep a:hover{text-decoration:underline}\n"] }]
3102
+ args: [{ selector: 'ng2-smart-table', template: "<table [id]=\"tableId\" [ngClass]=\"tableClass\">\n\n <thead ng2-st-thead *ngIf=\"!isHideHeader || !isHideSubHeader\"\n [grid]=\"grid\"\n [source]=\"source\"\n [createConfirm]=\"createConfirm\"\n (create)=\"create.emit($event)\"\n (selectAllRows)=\"onSelectAllRows()\">\n </thead>\n\n <tbody ng2-st-tbody [ngStyle]=\"{'max-height': this.grid.getSetting('bodyHeight', '85vh')}\"\n [grid]=\"grid\"\n [source]=\"source\"\n [deleteConfirm]=\"deleteConfirm\"\n [editConfirm]=\"editConfirm\"\n [rowClassFunction]=\"rowClassFunction\"\n (edit)=\"edit.emit($event)\"\n (editCancel)=\"editCancel.emit($event)\"\n (delete)=\"delete.emit($event)\"\n (custom)=\"custom.emit($event)\"\n (scroll)=\"onScroll($any($event))\"\n (userClickedRow)=\"emitUserRowClicked($event)\"\n (multipleSelectRow)=\"multipleSelectRow($event)\">\n </tbody>\n\n</table>\n\n<ng2-smart-table-pager *ngIf=\"isPagerDisplay\"\n [source]=\"source\"\n [perPageSelect]=\"perPageSelect\">\n</ng2-smart-table-pager>\n", styles: [":host{font-size:1rem}:host ::ng-deep *{box-sizing:border-box}:host ::ng-deep button,:host ::ng-deep input,:host ::ng-deep optgroup,:host ::ng-deep select,:host ::ng-deep textarea{color:inherit;font:inherit;margin:0}:host ::ng-deep table{line-height:1.5em;border-collapse:collapse;border-spacing:0;display:table;width:100%;max-width:100%;word-break:normal;word-break:keep-all}:host ::ng-deep table tbody{display:block;max-height:85vh;overflow-y:scroll}:host ::ng-deep table tr{display:table;width:100%;table-layout:fixed}:host ::ng-deep table tr th{font-weight:700}:host ::ng-deep table tr section{font-size:.75em;font-weight:700}:host ::ng-deep table tr td,:host ::ng-deep table tr th{font-size:.875em;margin:0;padding:.5em 1em}:host ::ng-deep a{color:#1e6bb8;text-decoration:none}:host ::ng-deep a:hover{text-decoration:underline}\n"] }]
3087
3103
  }], propDecorators: { source: [{
3088
3104
  type: Input
3089
3105
  }], settings: [{
@@ -3092,6 +3108,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
3092
3108
  type: Output
3093
3109
  }], rowClicked: [{
3094
3110
  type: Output
3111
+ }], listScrollEnd: [{
3112
+ type: Output
3095
3113
  }], delete: [{
3096
3114
  type: Output
3097
3115
  }], edit: [{