@colijnit/corecomponents_v12 12.0.52 → 12.0.55
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/bundles/colijnit-corecomponents_v12.umd.js +30 -26
- package/bundles/colijnit-corecomponents_v12.umd.js.map +1 -1
- package/colijnit-corecomponents_v12.metadata.json +1 -1
- package/esm2015/lib/components/pagination/pagination.component.js +4 -20
- package/esm2015/lib/components/pagination-bar/pagination-bar.component.js +20 -6
- package/esm2015/lib/components/simple-grid/simple-grid.component.js +17 -4
- package/esm2015/lib/components/simple-grid/simple-grid.module.js +4 -2
- package/fesm2015/colijnit-corecomponents_v12.js +40 -28
- package/fesm2015/colijnit-corecomponents_v12.js.map +1 -1
- package/lib/components/pagination/pagination.component.d.ts +0 -3
- package/lib/components/pagination-bar/pagination-bar.component.d.ts +2 -0
- package/lib/components/pagination-bar/style/_layout.scss +4 -0
- package/lib/components/pagination-bar/style/_material-definition.scss +2 -1
- package/lib/components/pagination-bar/style/_theme.scss +1 -1
- package/lib/components/simple-grid/simple-grid.component.d.ts +3 -1
- package/package.json +1 -1
|
@@ -9775,9 +9775,14 @@
|
|
|
9775
9775
|
}
|
|
9776
9776
|
this._detectChanges();
|
|
9777
9777
|
};
|
|
9778
|
-
SimpleGridComponent.prototype.
|
|
9778
|
+
SimpleGridComponent.prototype.goToPreviousPage = function () {
|
|
9779
|
+
this.currentPage -= 1;
|
|
9780
|
+
};
|
|
9781
|
+
SimpleGridComponent.prototype.goToNextPage = function () {
|
|
9782
|
+
this.currentPage += 1;
|
|
9783
|
+
};
|
|
9784
|
+
SimpleGridComponent.prototype.setCurrentPage = function (page) {
|
|
9779
9785
|
this.currentPage = page;
|
|
9780
|
-
//this.gridBody.nativeElement.scrollTop = 0;
|
|
9781
9786
|
};
|
|
9782
9787
|
SimpleGridComponent.prototype._detectChanges = function () {
|
|
9783
9788
|
this._changeDetection.detectChanges();
|
|
@@ -9787,7 +9792,7 @@
|
|
|
9787
9792
|
SimpleGridComponent.decorators = [
|
|
9788
9793
|
{ type: core.Component, args: [{
|
|
9789
9794
|
selector: 'co-simple-grid',
|
|
9790
|
-
template: "\n <co-grid-toolbar *ngIf=\"showToolbar\" [class.right]=\"rightToolbar\"\n [showEdit]=\"inlineEdit\"\n [showAdd]=\"showAdd\"\n [showDelete]=\"showDelete\"\n [deleteEnabled]=\"selectedRowIndex > -1\"\n (addClick)=\"addNewRow()\"\n (editClick)=\"editRow($event)\"\n (saveClick)=\"validateAndSave()\"\n (cancelClick)=\"cancelEditRow()\"\n (deleteClick)=\"removeRow()\"\n ></co-grid-toolbar>\n <table class=\"simple-grid-table\">\n <colgroup>\n <col *ngFor=\"let column of headerColumns; let index = index\"\n [class.simple-grid-column-auto-fit]=\"column.autoFit\"\n [style.width.px]=\"column.width\"\n [style.min-width.px]=\"MIN_COLUMN_WIDTH\">\n </colgroup>\n <thead>\n <tr>\n <th scope=\"col\" #headerCell class=\"simple-grid-column-header\" *ngFor=\"let column of headerColumns; let index = index\">\n <div class=\"simple-grid-column-header-wrapper\" [class.resizable]=\"resizable\"\n [ngClass]=\"column.textAlign ? column.textAlign : defaultTextAlign\">\n <ng-container *ngIf=\"column.headerTemplate; else noHeaderTemplate\">\n <ng-container [ngTemplateOutlet]=\"column.headerTemplate\"></ng-container>\n </ng-container>\n <ng-template #noHeaderTemplate>\n <div class=\"simple-grid-column-header-label\" [ngClass]=\"column.textAlign ? column.textAlign : defaultTextAlign\"\n [textContent]=\"column.headerText || ' '\"\n ></div>\n </ng-template>\n <div *ngIf=\"resizable && column.resizable\" class=\"simple-grid-column-sizer\"\n (mousedown)=\"handleSizerMouseDown($event, column)\"\n ></div>\n </div>\n </th>\n </tr>\n </thead>\n <tbody #dropList cdkDropList cdkDropListOrientation=\"vertical\"\n class=\"simple-grid-drag-drop-list\"\n [cdkDropListDisabled]=\"!dragDropEnabled\"\n [cdkDropListData]=\"data\"\n [cdkDropListEnterPredicate]=\"handleCanDragDrop\"\n (cdkDropListDropped)=\"handleDrop($event)\">\n <tr class=\"simple-grid-row\" [class.selected]=\"rowIndex === selectedRowIndex && !editing\" observeVisibility\n [class.editing]=\"rowIndex === editRowIndex\" *ngFor=\"let row of (!!rowsPerPage ? (data | paginate: {itemsPerPage: rowsPerPage, currentPage: currentPage}) : data); last as last; let rowIndex = index\" cdkDrag\n (click)=\"handleClickRow($event, rowIndex)\" (dblclick)=\"handleDblClickRow($event, rowIndex)\" (visible)=\"rowVisible.next(row)\">\n <co-form class=\"simple-grid-row-form\">\n <ng-container *ngIf=\"isSingleColumnRow(row)\">\n <td class=\"simple-grid-single-column-cell\" [attr.colspan]=\"headerColumns.length\">\n <co-simple-grid-cell\n [column]=\"columns[singleColumnIndex(row)]\"\n [row]=\"row\"\n [editMode]=\"false\"\n ></co-simple-grid-cell>\n </td>\n </ng-container>\n <ng-container *ngIf=\"!isSingleColumnRow(row)\">\n <ng-container *ngFor=\"let column of headerColumns; let columnIndex = index\">\n <td class=\"simple-grid-column-cell\" *ngIf=\"columnIndex !== singleColumnIndex(row)\">\n <co-simple-grid-cell\n [column]=\"column\"\n [row]=\"row\"\n [editMode]=\"inlineEdit && editing && rowIndex === editRowIndex\"\n [fieldEditMode]=\"editCellIndex === columnIndex\"\n (cellClick)=\"handleCellClick(columnIndex)\"\n ></co-simple-grid-cell>\n <div *ngIf=\"column.resizable\" class=\"simple-grid-column-sizer-placeholder\"></div>\n </td>\n </ng-container>\n </ng-container>\n </co-form>\n </tr>\n </tbody>\n </table>\n <co-pagination *ngIf=\"data?.length > rowsPerPage\"
|
|
9795
|
+
template: "\n <co-grid-toolbar *ngIf=\"showToolbar\" [class.right]=\"rightToolbar\"\n [showEdit]=\"inlineEdit\"\n [showAdd]=\"showAdd\"\n [showDelete]=\"showDelete\"\n [deleteEnabled]=\"selectedRowIndex > -1\"\n (addClick)=\"addNewRow()\"\n (editClick)=\"editRow($event)\"\n (saveClick)=\"validateAndSave()\"\n (cancelClick)=\"cancelEditRow()\"\n (deleteClick)=\"removeRow()\"\n ></co-grid-toolbar>\n <table class=\"simple-grid-table\">\n <colgroup>\n <col *ngFor=\"let column of headerColumns; let index = index\"\n [class.simple-grid-column-auto-fit]=\"column.autoFit\"\n [style.width.px]=\"column.width\"\n [style.min-width.px]=\"MIN_COLUMN_WIDTH\">\n </colgroup>\n <thead>\n <tr>\n <th scope=\"col\" #headerCell class=\"simple-grid-column-header\" *ngFor=\"let column of headerColumns; let index = index\">\n <div class=\"simple-grid-column-header-wrapper\" [class.resizable]=\"resizable\"\n [ngClass]=\"column.textAlign ? column.textAlign : defaultTextAlign\">\n <ng-container *ngIf=\"column.headerTemplate; else noHeaderTemplate\">\n <ng-container [ngTemplateOutlet]=\"column.headerTemplate\"></ng-container>\n </ng-container>\n <ng-template #noHeaderTemplate>\n <div class=\"simple-grid-column-header-label\" [ngClass]=\"column.textAlign ? column.textAlign : defaultTextAlign\"\n [textContent]=\"column.headerText || ' '\"\n ></div>\n </ng-template>\n <div *ngIf=\"resizable && column.resizable\" class=\"simple-grid-column-sizer\"\n (mousedown)=\"handleSizerMouseDown($event, column)\"\n ></div>\n </div>\n </th>\n </tr>\n </thead>\n <tbody #dropList cdkDropList cdkDropListOrientation=\"vertical\"\n class=\"simple-grid-drag-drop-list\"\n [cdkDropListDisabled]=\"!dragDropEnabled\"\n [cdkDropListData]=\"data\"\n [cdkDropListEnterPredicate]=\"handleCanDragDrop\"\n (cdkDropListDropped)=\"handleDrop($event)\">\n <tr class=\"simple-grid-row\" [class.selected]=\"rowIndex === selectedRowIndex && !editing\" observeVisibility\n [class.editing]=\"rowIndex === editRowIndex\" *ngFor=\"let row of (!!rowsPerPage ? (data | paginate: {itemsPerPage: rowsPerPage, currentPage: currentPage}) : data); last as last; let rowIndex = index\" cdkDrag\n (click)=\"handleClickRow($event, rowIndex)\" (dblclick)=\"handleDblClickRow($event, rowIndex)\" (visible)=\"rowVisible.next(row)\">\n <co-form class=\"simple-grid-row-form\">\n <ng-container *ngIf=\"isSingleColumnRow(row)\">\n <td class=\"simple-grid-single-column-cell\" [attr.colspan]=\"headerColumns.length\">\n <co-simple-grid-cell\n [column]=\"columns[singleColumnIndex(row)]\"\n [row]=\"row\"\n [editMode]=\"false\"\n ></co-simple-grid-cell>\n </td>\n </ng-container>\n <ng-container *ngIf=\"!isSingleColumnRow(row)\">\n <ng-container *ngFor=\"let column of headerColumns; let columnIndex = index\">\n <td class=\"simple-grid-column-cell\" *ngIf=\"columnIndex !== singleColumnIndex(row)\">\n <co-simple-grid-cell\n [column]=\"column\"\n [row]=\"row\"\n [editMode]=\"inlineEdit && editing && rowIndex === editRowIndex\"\n [fieldEditMode]=\"editCellIndex === columnIndex\"\n (cellClick)=\"handleCellClick(columnIndex)\"\n ></co-simple-grid-cell>\n <div *ngIf=\"column.resizable\" class=\"simple-grid-column-sizer-placeholder\"></div>\n </td>\n </ng-container>\n </ng-container>\n </co-form>\n </tr>\n </tbody>\n </table>\n <co-pagination-bar *ngIf=\"data?.length > rowsPerPage\"\n [itemsPerPage]=\"rowsPerPage\"\n [currentPage]=\"currentPage\"\n [totalItems]=\"data.length\"\n [autoHide]=\"true\"\n (previousClick)=\"goToPreviousPage()\"\n (nextClick)=\"goToNextPage()\"\n (pageClick)=\"setCurrentPage($event)\"\n ></co-pagination-bar>\n ",
|
|
9791
9796
|
providers: [
|
|
9792
9797
|
FormMasterService
|
|
9793
9798
|
],
|
|
@@ -9818,6 +9823,7 @@
|
|
|
9818
9823
|
this.itemsPerPage = 20;
|
|
9819
9824
|
this.totalItems = 1;
|
|
9820
9825
|
this.paginationRange = 8;
|
|
9826
|
+
this.autoHide = false;
|
|
9821
9827
|
this.previousClick = new core.EventEmitter();
|
|
9822
9828
|
this.nextClick = new core.EventEmitter();
|
|
9823
9829
|
this.pageClick = new core.EventEmitter();
|
|
@@ -9842,15 +9848,27 @@
|
|
|
9842
9848
|
return this.pages.length === this.currentPage;
|
|
9843
9849
|
};
|
|
9844
9850
|
PaginationBarComponent.prototype.onPreviousClick = function () {
|
|
9845
|
-
this.
|
|
9851
|
+
if (!this.isOnFirstPage()) {
|
|
9852
|
+
this.previousClick.emit();
|
|
9853
|
+
}
|
|
9846
9854
|
};
|
|
9847
9855
|
PaginationBarComponent.prototype.onNextClick = function () {
|
|
9848
|
-
this.
|
|
9856
|
+
if (!this.isOnLastPage()) {
|
|
9857
|
+
this.nextClick.emit();
|
|
9858
|
+
}
|
|
9849
9859
|
};
|
|
9850
9860
|
PaginationBarComponent.prototype.onPageClick = function (value) {
|
|
9851
9861
|
this.currentPage = value;
|
|
9852
9862
|
this.pageClick.emit(value);
|
|
9853
9863
|
};
|
|
9864
|
+
PaginationBarComponent.prototype.shouldBeHidden = function () {
|
|
9865
|
+
if (!this.autoHide) {
|
|
9866
|
+
return false;
|
|
9867
|
+
}
|
|
9868
|
+
else {
|
|
9869
|
+
return (this.totalItems <= this.itemsPerPage);
|
|
9870
|
+
}
|
|
9871
|
+
};
|
|
9854
9872
|
// Returns an array of IPage objects to use in the pagination controls.
|
|
9855
9873
|
PaginationBarComponent.prototype._createPageArray = function () {
|
|
9856
9874
|
// paginationRange could be a string if passed from attribute, so cast to number.
|
|
@@ -9910,7 +9928,7 @@
|
|
|
9910
9928
|
PaginationBarComponent.decorators = [
|
|
9911
9929
|
{ type: core.Component, args: [{
|
|
9912
9930
|
selector: "co-pagination-bar",
|
|
9913
|
-
template: "\n <ul class=\"pagination\">\n <li *ngIf=\"directionLinks\" class=\"pagination-previous\">\n <a (click)=\"onPreviousClick()\" [class.disabled]=\"isOnFirstPage()\">{{ previousLabel }}</a>\n </li>\n <li *ngFor=\"let page of pages\" [class.current]=\"currentPage === page.value\" (click)=\"onPageClick(page.value)\">\n <span>{{page.label}}</span>\n </li>\n <li *ngIf=\"directionLinks\" class=\"pagination-next\">\n <a (click)=\"onNextClick()\" [class.disabled]=\"isOnLastPage()\">{{ nextLabel }}</a>\n </li>\n </ul>\n ",
|
|
9931
|
+
template: "\n <ul class=\"pagination\" *ngIf=\"!shouldBeHidden()\">\n <li *ngIf=\"directionLinks\" class=\"pagination-previous\" [class.disabled]=\"isOnFirstPage()\">\n <a (click)=\"onPreviousClick()\" [class.disabled]=\"isOnFirstPage()\">{{ previousLabel }}</a>\n </li>\n <li *ngFor=\"let page of pages\" [class.current]=\"currentPage === page.value\" (click)=\"onPageClick(page.value)\">\n <span>{{page.label}}</span>\n </li>\n <li *ngIf=\"directionLinks\" class=\"pagination-next\" [class.disabled]=\"isOnLastPage()\">\n <a (click)=\"onNextClick()\" [class.disabled]=\"isOnLastPage()\">{{ nextLabel }}</a>\n </li>\n </ul>\n ",
|
|
9914
9932
|
encapsulation: core.ViewEncapsulation.None
|
|
9915
9933
|
},] }
|
|
9916
9934
|
];
|
|
@@ -9922,6 +9940,7 @@
|
|
|
9922
9940
|
itemsPerPage: [{ type: core.Input }],
|
|
9923
9941
|
totalItems: [{ type: core.Input }],
|
|
9924
9942
|
paginationRange: [{ type: core.Input }],
|
|
9943
|
+
autoHide: [{ type: core.Input }],
|
|
9925
9944
|
previousClick: [{ type: core.Output }],
|
|
9926
9945
|
nextClick: [{ type: core.Output }],
|
|
9927
9946
|
pageClick: [{ type: core.Output }],
|
|
@@ -10176,29 +10195,17 @@
|
|
|
10176
10195
|
this.changeSub.unsubscribe();
|
|
10177
10196
|
};
|
|
10178
10197
|
PaginationComponent.prototype.goToFirstPage = function () {
|
|
10179
|
-
|
|
10180
|
-
this.setCurrentPage(1);
|
|
10181
|
-
}
|
|
10198
|
+
this.setCurrentPage(1);
|
|
10182
10199
|
};
|
|
10183
10200
|
PaginationComponent.prototype.goToPreviousPage = function () {
|
|
10184
|
-
|
|
10185
|
-
this.setCurrentPage(this.getCurrentPage() - 1);
|
|
10186
|
-
}
|
|
10201
|
+
this.setCurrentPage(this.getCurrentPage() - 1);
|
|
10187
10202
|
};
|
|
10188
10203
|
PaginationComponent.prototype.goToNextPage = function () {
|
|
10189
|
-
|
|
10190
|
-
this.setCurrentPage(this.getCurrentPage() + 1);
|
|
10191
|
-
}
|
|
10204
|
+
this.setCurrentPage(this.getCurrentPage() + 1);
|
|
10192
10205
|
};
|
|
10193
10206
|
PaginationComponent.prototype.setCurrentPage = function (page) {
|
|
10194
10207
|
this.pageChange.emit(page);
|
|
10195
10208
|
};
|
|
10196
|
-
PaginationComponent.prototype.isOnFirstPage = function () {
|
|
10197
|
-
return this.getCurrentPage() === 1;
|
|
10198
|
-
};
|
|
10199
|
-
PaginationComponent.prototype.isOnLastPage = function () {
|
|
10200
|
-
return this.getLastPage() === this.getCurrentPage();
|
|
10201
|
-
};
|
|
10202
10209
|
PaginationComponent.prototype.shouldBeHidden = function () {
|
|
10203
10210
|
if (!this.autoHide) {
|
|
10204
10211
|
return false;
|
|
@@ -10225,10 +10232,6 @@
|
|
|
10225
10232
|
PaginationComponent.prototype.getCurrentPage = function () {
|
|
10226
10233
|
return this._paginationService.getCurrentPage(this.id);
|
|
10227
10234
|
};
|
|
10228
|
-
PaginationComponent.prototype.getLastPage = function () {
|
|
10229
|
-
var instance = this._paginationService.getInstance(this.id);
|
|
10230
|
-
return Math.ceil(instance.totalItems / instance.itemsPerPage);
|
|
10231
|
-
};
|
|
10232
10235
|
/**
|
|
10233
10236
|
* Checks that the instance.currentPage property is within bounds for the current page range.
|
|
10234
10237
|
* If not, return a correct value for currentPage, or the current value if OK.
|
|
@@ -10565,7 +10568,8 @@
|
|
|
10565
10568
|
InputTextModule,
|
|
10566
10569
|
FormModule,
|
|
10567
10570
|
ObserveVisibilityModule,
|
|
10568
|
-
PaginationModule
|
|
10571
|
+
PaginationModule,
|
|
10572
|
+
PaginationBarModule
|
|
10569
10573
|
],
|
|
10570
10574
|
declarations: [
|
|
10571
10575
|
SimpleGridComponent,
|