ngx-academia-uniandes-library/lib/academia-pagination/academia-pagination.component.js

This library is used for Academia-Uniandes system.

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var core_1 = require("@angular/core");
var academia_pagination_model_1 = require("./academia-pagination.model");
var AcademiaPaginationComponent = /** @class */ (function () {
    function AcademiaPaginationComponent() {
        this.pageChanged = new core_1.EventEmitter();
        this.numPagesUpdated = new core_1.EventEmitter();
        this.numPages = 0;
    }
    AcademiaPaginationComponent.prototype.ngOnInit = function () {
    };
    AcademiaPaginationComponent.prototype.onPageChange = function (event) {
        this.pageChanged.emit(new academia_pagination_model_1.AcademiaPaginationModel(event.page, event.itemsPerPage, this.collectionSize));
    };
    AcademiaPaginationComponent.prototype.onNumPagesChange = function (event) {
        this.numPages = event;
        this.numPagesUpdated.emit(this.numPages);
    };
    AcademiaPaginationComponent.decorators = [
        { type: core_1.Component, args: [{
                    selector: 'academia-pagination',
                    template: "\n    <div class=\"paginator-container\" *ngIf=\"fullPaginator; else compactPaginator\" style=\"text-align:center\">\n        <div class=\"input-group mb-3 input-paginator\">\n            <div class=\"input-group-prepend\">\n                <span class=\"input-group-text\">{{'page' | translate}}</span>\n            </div>\n            <input type=\"text\" class=\"form-control\" [(ngModel)]=\"page\" placeholder=\"#\">\n            <div class=\"input-group-append\">\n                <span class=\"input-group-text\">{{'of'|translate}} {{numPages}}</span>\n            </div>\n        </div>\n        <div class=\"paginator-component\">\n            <pagination [boundaryLinks]=\"true\" [maxSize]=\"maxSize || 6\" [itemsPerPage]=\"pageSize\" [totalItems]=\"collectionSize\" (pageChanged)=\"onPageChange($event)\" (numPages)=\"onNumPagesChange($event)\" [(ngModel)]=\"page\" previousText=\"&lsaquo;\" nextText=\"&rsaquo;\" firstText=\"&laquo;\" lastText=\"&raquo;\"></pagination>\n        </div>\n        <div class=\"pagination-info\">\n            <p><strong>{{ ((page - 1) * pageSize) + 1}} - {{ (((page - 1) * pageSize) + pageSize) > collectionSize ? collectionSize: ((page - 1) * pageSize) + pageSize }} {{'of' | translate }} {{collectionSize}}</strong></p>\n        </div>\n    </div> \n    <ng-template #compactPaginator>\n        <div style=\"text-align:center\">\n            <pagination [boundaryLinks]=\"true\" [maxSize]=\"maxSize || 6\" [itemsPerPage]=\"pageSize\" [totalItems]=\"collectionSize\" (pageChanged)=\"onPageChange($event)\" (numPages)=\"onNumPagesChange($event)\" [(ngModel)]=\"page\"\n            previousText=\"&lsaquo;\" nextText=\"&rsaquo;\" firstText=\"&laquo;\" lastText=\"&raquo;\">\n            </pagination>\n        </div>\n    </ng-template>\n  ",
                    styles: ["\n    .paginator-container{\n        display: grid;\n        grid-template-columns: 1fr;\n        grid-template-rows: 1fr 1fr 1fr;\n        grid-template-areas: \n        \"pagination\"\n        \"input-pag \"\n        \"pag-info\";\n        grid-gap: 10px;\n        align-items: center;\n        justify-items: center;\n        border: 1px solid #ccc;\n        padding: 10px 10px 0 10px;\n    }\n\n    .pagination-component{\n        grid-area: pagination\n    }\n\n    .input-paginator{\n        grid-area: input-pag;\n        justify-self: initial;\n    }\n\n    .pagination-info{\n        grid-area:  pag-info;\n        justify-self: center;\n        text-align: center;\n    }\n\n\n\n    @media (min-width : 730px){\n\n        .paginator-container{\n            display: grid;\n            grid-template-columns: 0.55fr 1fr 0.41fr;\n            grid-template-rows: 1fr;\n            grid-template-areas: \n            \"input-pag pagination pag-info\";\n            grid-gap: 10px;\n            align-items: center;\n            justify-items: start;\n            border: 1px solid #ccc;\n            padding: 10px 0 0 10px;\n        }\n\n        .pagination-component{\n            grid-area: pagination;\n            justify-self: center;\n        }\n\n        .input-paginator{\n            grid-area: input-pag;\n            justify-self: initial;\n        }\n    \n        .pagination-info{\n            grid-area:  pag-info;\n            justify-self: start;\n        }\n    \n    }\n  "]
                },] },
    ];
    /** @nocollapse */
    AcademiaPaginationComponent.ctorParameters = function () { return []; };
    AcademiaPaginationComponent.propDecorators = {
        "fullPaginator": [{ type: core_1.Input },],
        "collectionSize": [{ type: core_1.Input },],
        "pageSize": [{ type: core_1.Input },],
        "page": [{ type: core_1.Input },],
        "maxSize": [{ type: core_1.Input },],
        "pageChanged": [{ type: core_1.Output },],
        "numPagesUpdated": [{ type: core_1.Output },],
    };
    return AcademiaPaginationComponent;
}());
exports.AcademiaPaginationComponent = AcademiaPaginationComponent;
//# sourceMappingURL=academia-pagination.component.js.map