@vicoders/angular
Version:
- [Vicoders Angular Common Module](#vicoders-angular-common-module) - [Install](#install) - [How to use](#how-to-use) - [Pipes](#pipes) - [hasItem](#hasitem) - [isArray](#isarray) - [length](#length) - [orderBy](#orderby)
1,279 lines (1,250 loc) • 48.4 kB
JavaScript
import * as moment_ from 'moment';
import { Router, NavigationEnd, ActivatedRoute, RouterModule } from '@angular/router';
import { NG_VALUE_ACCESSOR, FormsModule, ReactiveFormsModule } from '@angular/forms';
import { isUndefined, assign, isArray, filter, includes, get, find, flatMap, forEach, isNil, orderBy, sumBy, isObject, isString, remove, map } from 'lodash';
import { Pipe, NgModule, Component, Input, EventEmitter, Output, forwardRef, ElementRef, Renderer, Directive, HostListener } from '@angular/core';
import { CommonModule } from '@angular/common';
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class HasItemPipe {
/**
* @param {?} value
* @param {?=} args
* @return {?}
*/
transform(value, args) {
if (!isArray(value)) {
return false;
}
else {
if (value.length === 0) {
return false;
}
else {
return true;
}
}
}
}
HasItemPipe.decorators = [
{ type: Pipe, args: [{
name: "hasItem"
},] }
];
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class LengthPipe {
/**
* @param {?} value
* @param {?=} args
* @return {?}
*/
transform(value, args) {
if (!isArray(value)) {
return 0;
}
else {
return value.length;
}
}
}
LengthPipe.decorators = [
{ type: Pipe, args: [{
name: 'length'
},] }
];
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class FilterByPipe {
/**
* @param {?} arr
* @param {?} path
* @param {?} value
* @param {?} type
* @return {?}
*/
transform(arr, path, value, type) {
if (!isArray(arr)) {
return null;
}
if (isArray(value)) {
return filter(arr, item => includes(value, get(item, path)));
}
else {
switch (type) {
case ">":
return filter(arr, item => get(item, path) > value);
case "<":
return filter(arr, item => get(item, path) < value);
case "not":
return filter(arr, item => get(item, path) !== value);
default:
return filter(arr, item => get(item, path) === value);
}
}
}
}
FilterByPipe.decorators = [
{ type: Pipe, args: [{
name: "filterBy"
},] }
];
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class FindByPipe {
/**
* @param {?} arr
* @param {?} path
* @param {?} value
* @param {?} type
* @return {?}
*/
transform(arr, path, value, type) {
if (!isArray(arr)) {
return null;
}
if (isArray(value)) {
return find(arr, item => includes(value, get(item, path)));
}
else {
switch (type) {
case ">":
return find(arr, item => get(item, path) > value);
case "<":
return find(arr, item => get(item, path) < value);
case "not":
return find(arr, item => get(item, path) !== value);
default:
return find(arr, item => get(item, path) === value);
}
}
}
}
FindByPipe.decorators = [
{ type: Pipe, args: [{
name: "findBy"
},] }
];
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class IsArrayPipe {
/**
* @param {?} value
* @param {?=} args
* @return {?}
*/
transform(value, args) {
return Array.isArray(value);
}
}
IsArrayPipe.decorators = [
{ type: Pipe, args: [{
name: "isArray"
},] }
];
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class OrderByPipe {
/**
* @param {?} value
* @param {...?} criterias
* @return {?}
*/
transform(value, ...criterias) {
/** @type {?} */
let fields = [];
/** @type {?} */
let directions = [];
forEach(criterias, item => {
fields.push(item[0]);
directions.push(item[1]);
});
if (filter(directions, item => !isNil(item)).length > 0) {
value = orderBy.apply(null, [value, fields, directions]);
}
else {
return value;
}
return value;
}
}
OrderByPipe.decorators = [
{ type: Pipe, args: [{
name: 'orderBy'
},] }
];
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class SumByPipe {
/**
* @param {?} value
* @param {?} path
* @return {?}
*/
transform(value, path) {
if (!isArray(value)) {
return 0;
}
else {
if (value.length === 0) {
return 0;
}
else {
return sumBy(value, item => Number(get(item, path)));
}
}
}
}
SumByPipe.decorators = [
{ type: Pipe, args: [{
name: 'sumBy'
},] }
];
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class FlatMapPipe {
/**
* @param {?} collection
* @param {?} callable
* @return {?}
*/
transform(collection, callable) {
return flatMap(collection, callable);
}
}
FlatMapPipe.decorators = [
{ type: Pipe, args: [{
name: 'flatMap'
},] }
];
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/** @type {?} */
const moment = moment_;
class TimeFormatPipe {
/**
* @param {?} time
* @param {?} format
* @return {?}
*/
transform(time, format) {
if (isObject(time) && time instanceof moment) {
return ((/** @type {?} */ (time))).format(format);
}
else if (isString(time)) {
return moment(time).format(format);
}
else {
return null;
}
}
}
TimeFormatPipe.decorators = [
{ type: Pipe, args: [{
name: "timeFormat"
},] }
];
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/** @type {?} */
const moment$1 = moment_;
class ReadableTimePipe {
/**
* @param {?} time
* @param {?} locale
* @return {?}
*/
transform(time, locale) {
locale = locale || "en";
/** @type {?} */
const m = moment$1(time).locale(locale);
if (m.isValid()) {
return m.fromNow();
}
return "";
}
}
ReadableTimePipe.decorators = [
{ type: Pipe, args: [{
name: "readableTime"
},] }
];
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class PipesModule {
}
PipesModule.decorators = [
{ type: NgModule, args: [{
imports: [CommonModule],
exports: [
HasItemPipe,
LengthPipe,
IsArrayPipe,
FilterByPipe,
OrderByPipe,
SumByPipe,
FlatMapPipe,
FindByPipe,
TimeFormatPipe,
ReadableTimePipe
],
declarations: [
HasItemPipe,
LengthPipe,
FilterByPipe,
IsArrayPipe,
OrderByPipe,
SumByPipe,
FlatMapPipe,
FindByPipe,
TimeFormatPipe,
ReadableTimePipe
]
},] }
];
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class PaginationComponent {
constructor() {
this.goPrev = new EventEmitter();
this.goNext = new EventEmitter();
this.goPage = new EventEmitter();
}
/**
* @return {?}
*/
getMin() {
return this.perPage * this.page - this.perPage + 1;
}
/**
* @return {?}
*/
getMax() {
/** @type {?} */
let max = this.perPage * this.page;
if (max > this.count) {
max = this.count;
}
return max;
}
/**
* @param {?} n
* @return {?}
*/
onPage(n) {
this.goPage.emit(n);
}
/**
* @return {?}
*/
onPrev() {
this.goPrev.emit(true);
}
/**
* @param {?} next
* @return {?}
*/
onNext(next) {
this.goNext.emit(next);
}
/**
* @return {?}
*/
totalPages() {
return Math.ceil(this.count / this.perPage) || 0;
}
/**
* @return {?}
*/
lastPage() {
return this.perPage * this.page > this.count;
}
/**
* @return {?}
*/
getPages() {
/** @type {?} */
const c = Math.ceil(this.count / this.perPage);
/** @type {?} */
const p = this.page || 1;
/** @type {?} */
const pagesToShow = this.pagesToShow || 9;
/** @type {?} */
const pages = [];
pages.push(p);
/** @type {?} */
const times = pagesToShow - 1;
for (let i = 0; i < times; i++) {
if (pages.length < pagesToShow) {
if (Math.min.apply(null, pages) > 1) {
pages.push(Math.min.apply(null, pages) - 1);
}
}
if (pages.length < pagesToShow) {
if (Math.max.apply(null, pages) < c) {
pages.push(Math.max.apply(null, pages) + 1);
}
}
}
pages.sort((a, b) => a - b);
return pages;
}
}
PaginationComponent.decorators = [
{ type: Component, args: [{
selector: 'app-pagination',
template: "<div class=\"row\">\n <div class=\"col-md-5 col-sm-7\">\n <div class=\"description\">\n <span class=\"page-counts\">{{ getMin() }} - {{ getMax() }} of {{ count }}</span>\n <span class=\"page-totals\">{{ totalPages() }} pages</span>\n </div>\n </div>\n <div class=\"col-md-7 col-sm-7\">\n <div class=\"dataTables_paginate paging_simple_numbers\" *ngIf=\"count > 0\">\n\n <ul class=\"pagination\">\n <li class=\"paginate_button previous\" [ngClass]=\"{ 'disabled': page === 1 || loading }\">\n <button class=\"link\" (click)=\"onPrev()\" [disabled]=\"page === 1 || loading\">\n Previous\n </button>\n </li>\n <li class=\"paginate_button\" *ngFor=\"let pageNum of getPages()\" (click)=\"onPage(pageNum)\" [ngClass]=\"{'active': pageNum === page, 'disabled': loading}\">\n <a href=\"javascript:;\">{{ pageNum }}</a>\n </li>\n <li class=\"paginate_button next\" [ngClass]=\"{ 'disabled': lastPage() || loading }\">\n <button class=\"link\" (click)=\"onNext(true)\" [disabled]=\"lastPage() || loading\">\n Next\n </button>\n </li>\n </ul>\n </div>\n </div>\n</div>",
styles: [""]
}] }
];
PaginationComponent.ctorParameters = () => [];
PaginationComponent.propDecorators = {
pagesToShow: [{ type: Input }],
page: [{ type: Input }],
count: [{ type: Input }],
perPage: [{ type: Input }],
loading: [{ type: Input }],
goPrev: [{ type: Output }],
goNext: [{ type: Output }],
goPage: [{ type: Output }]
};
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class LoaderComponent {
constructor() { }
/**
* @return {?}
*/
ngOnInit() { }
}
LoaderComponent.decorators = [
{ type: Component, args: [{
// tslint:disable-next-line:component-selector
selector: 'loader',
template: "<div class=\"preloader-wrapper active small\">\n <div class=\"spinner-layer spinner-red-only\">\n <div class=\"circle-clipper left\">\n <div class=\"circle\"></div>\n </div>\n <div class=\"gap-patch\">\n <div class=\"circle\"></div>\n </div>\n <div class=\"circle-clipper right\">\n <div class=\"circle\"></div>\n </div>\n </div>\n</div>\n",
styles: [".preloader-wrapper{display:inline-block;position:relative;width:48px;height:48px}.preloader-wrapper.small{width:36px;height:36px}.preloader-wrapper.big{width:64px;height:64px}.preloader-wrapper.active{-webkit-animation:1568ms linear infinite container-rotate;animation:1568ms linear infinite container-rotate}@-webkit-keyframes container-rotate{to{-webkit-transform:rotate(360deg)}}@keyframes container-rotate{to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.spinner-layer{position:absolute;width:100%;height:100%;opacity:0;border-color:color(\"teal\", \"lighten-1\")}.spinner-blue,.spinner-blue-only{border-color:#4285f4}.spinner-red,.spinner-red-only{border-color:#ef6b59}.spinner-yellow,.spinner-yellow-only{border-color:#f4b400}.spinner-green,.spinner-green-only{border-color:#0f9d58}.active .spinner-layer.spinner-blue{-webkit-animation:5332ms cubic-bezier(.4,0,.2,1) infinite both fill-unfill-rotate,5332ms cubic-bezier(.4,0,.2,1) infinite both blue-fade-in-out;animation:5332ms cubic-bezier(.4,0,.2,1) infinite both fill-unfill-rotate,5332ms cubic-bezier(.4,0,.2,1) infinite both blue-fade-in-out}.active .spinner-layer.spinner-red{-webkit-animation:5332ms cubic-bezier(.4,0,.2,1) infinite both fill-unfill-rotate,5332ms cubic-bezier(.4,0,.2,1) infinite both red-fade-in-out;animation:5332ms cubic-bezier(.4,0,.2,1) infinite both fill-unfill-rotate,5332ms cubic-bezier(.4,0,.2,1) infinite both red-fade-in-out}.active .spinner-layer.spinner-yellow{-webkit-animation:5332ms cubic-bezier(.4,0,.2,1) infinite both fill-unfill-rotate,5332ms cubic-bezier(.4,0,.2,1) infinite both yellow-fade-in-out;animation:5332ms cubic-bezier(.4,0,.2,1) infinite both fill-unfill-rotate,5332ms cubic-bezier(.4,0,.2,1) infinite both yellow-fade-in-out}.active .spinner-layer.spinner-green{-webkit-animation:5332ms cubic-bezier(.4,0,.2,1) infinite both fill-unfill-rotate,5332ms cubic-bezier(.4,0,.2,1) infinite both green-fade-in-out;animation:5332ms cubic-bezier(.4,0,.2,1) infinite both fill-unfill-rotate,5332ms cubic-bezier(.4,0,.2,1) infinite both green-fade-in-out}.active .spinner-layer,.active .spinner-layer.spinner-blue-only,.active .spinner-layer.spinner-green-only,.active .spinner-layer.spinner-red-only,.active .spinner-layer.spinner-yellow-only{opacity:1;-webkit-animation:5332ms cubic-bezier(.4,0,.2,1) infinite both fill-unfill-rotate;animation:5332ms cubic-bezier(.4,0,.2,1) infinite both fill-unfill-rotate}@-webkit-keyframes fill-unfill-rotate{12.5%{-webkit-transform:rotate(135deg)}25%{-webkit-transform:rotate(270deg)}37.5%{-webkit-transform:rotate(405deg)}50%{-webkit-transform:rotate(540deg)}62.5%{-webkit-transform:rotate(675deg)}75%{-webkit-transform:rotate(810deg)}87.5%{-webkit-transform:rotate(945deg)}to{-webkit-transform:rotate(1080deg)}}@keyframes fill-unfill-rotate{12.5%{-webkit-transform:rotate(135deg);transform:rotate(135deg)}25%{-webkit-transform:rotate(270deg);transform:rotate(270deg)}37.5%{-webkit-transform:rotate(405deg);transform:rotate(405deg)}50%{-webkit-transform:rotate(540deg);transform:rotate(540deg)}62.5%{-webkit-transform:rotate(675deg);transform:rotate(675deg)}75%{-webkit-transform:rotate(810deg);transform:rotate(810deg)}87.5%{-webkit-transform:rotate(945deg);transform:rotate(945deg)}to{-webkit-transform:rotate(1080deg);transform:rotate(1080deg)}}@-webkit-keyframes blue-fade-in-out{100%,25%,90%,from{opacity:1}26%,89%{opacity:0}}@keyframes blue-fade-in-out{100%,25%,90%,from{opacity:1}26%,89%{opacity:0}}@-webkit-keyframes red-fade-in-out{15%,51%,from{opacity:0}25%,50%{opacity:1}}@keyframes red-fade-in-out{15%,51%,from{opacity:0}25%,50%{opacity:1}}@-webkit-keyframes yellow-fade-in-out{40%,76%,from{opacity:0}50%,75%{opacity:1}}@keyframes yellow-fade-in-out{40%,76%,from{opacity:0}50%,75%{opacity:1}}@-webkit-keyframes green-fade-in-out{100%,65%,from{opacity:0}75%,90%{opacity:1}}@keyframes green-fade-in-out{100%,65%,from{opacity:0}75%,90%{opacity:1}}.gap-patch{position:absolute;top:0;left:45%;width:10%;height:100%;overflow:hidden;border-color:inherit}.gap-patch .circle{width:1000%;left:-450%}.circle-clipper{display:inline-block;position:relative;width:50%;height:100%;overflow:hidden;border-color:inherit}.circle-clipper .circle{width:200%;height:100%;border-width:3px;border-style:solid;border-color:inherit;border-bottom-color:transparent!important;border-radius:50%;-webkit-animation:none;animation:none;position:absolute;top:0;right:0;bottom:0}.circle-clipper.left .circle{left:0;border-right-color:transparent!important;-webkit-transform:rotate(129deg);transform:rotate(129deg)}.circle-clipper.right .circle{left:-100%;border-left-color:transparent!important;-webkit-transform:rotate(-129deg);transform:rotate(-129deg)}.active .circle-clipper.left .circle{-webkit-animation:1333ms cubic-bezier(.4,0,.2,1) infinite both left-spin;animation:1333ms cubic-bezier(.4,0,.2,1) infinite both left-spin}.active .circle-clipper.right .circle{-webkit-animation:1333ms cubic-bezier(.4,0,.2,1) infinite both right-spin;animation:1333ms cubic-bezier(.4,0,.2,1) infinite both right-spin}@-webkit-keyframes left-spin{from,to{-webkit-transform:rotate(130deg)}50%{-webkit-transform:rotate(-5deg)}}@keyframes left-spin{from,to{-webkit-transform:rotate(130deg);transform:rotate(130deg)}50%{-webkit-transform:rotate(-5deg);transform:rotate(-5deg)}}@-webkit-keyframes right-spin{from,to{-webkit-transform:rotate(-130deg)}50%{-webkit-transform:rotate(5deg)}}@keyframes right-spin{from,to{-webkit-transform:rotate(-130deg);transform:rotate(-130deg)}50%{-webkit-transform:rotate(5deg);transform:rotate(5deg)}}#spinnerContainer.cooldown{-webkit-animation:1568ms linear infinite container-rotate,.4s cubic-bezier(.4,0,.2,1) fade-out;animation:1568ms linear infinite container-rotate,.4s cubic-bezier(.4,0,.2,1) fade-out}@-webkit-keyframes fade-out{from{opacity:1}to{opacity:0}}@keyframes fade-out{from{opacity:1}to{opacity:0}}loader{display:block;width:100%;text-align:center;padding:20px}loader .preloader-wrapper .spinner-layer .left{float:left}loader .preloader-wrapper .spinner-layer .right{float:right}"]
}] }
];
LoaderComponent.ctorParameters = () => [];
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class SearchFormComponent {
/**
* @param {?} route
* @param {?} activatedRoute
*/
constructor(route, activatedRoute) {
this.route = route;
this.activatedRoute = activatedRoute;
this.keyword = '';
// @Output() searching: EventEmitter<string> = new EventEmitter<string>();
this.placeHolder = 'Search';
if (isUndefined(this.navigationSubscription)) {
this.navigationSubscription = this.route.events.subscribe((e) => {
if (e instanceof NavigationEnd) {
if (!isUndefined(this.activatedRoute.snapshot.queryParams.search)) {
this.keyword = this.activatedRoute.snapshot.queryParams.search;
}
else {
this.keyword = '';
}
}
});
}
}
/**
* @return {?}
*/
ngOnInit() { }
/**
* @return {?}
*/
ngOnDestroy() {
this.navigationSubscription.unsubscribe();
}
/**
* @return {?}
*/
onSubmit() {
/** @type {?} */
const url = window.location.pathname;
/** @type {?} */
let queryParams = this.activatedRoute.snapshot.queryParams;
queryParams = assign({}, queryParams, { search: this.keyword });
/** @type {?} */
const params = assign({}, this.activatedRoute.snapshot.params, { queryParams });
this.route.navigate([url], params);
}
}
SearchFormComponent.decorators = [
{ type: Component, args: [{
// tslint:disable-next-line:component-selector
selector: 'search-form',
template: "<form class=\"search-form search-form--inline\" (ngSubmit)=\"onSubmit()\">\n <div class=\"form-group search-form--inline__submit\">\n <input type=\"submit\" value=\"Search\" class=\"btn btn-success search-form--inline__btn-submit\">\n </div>\n <div class=\"form-group search-form--inline__search\">\n <input type=\"search\" name=\"keyword\" placeholder=\"{{ placeHolder }}\" class=\"form-control search-form--inline__input-field\" [(ngModel)]=\"keyword\">\n </div>\n</form>",
styles: [""]
}] }
];
SearchFormComponent.ctorParameters = () => [
{ type: Router },
{ type: ActivatedRoute }
];
SearchFormComponent.propDecorators = {
placeHolder: [{ type: Input }]
};
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class Exception extends Error {
/**
* @param {?} message
*/
constructor(message) {
super(message);
}
}
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class LengthAwarePaginatorComponent {
/**
* @param {?} router
* @param {?} activeRoute
*/
constructor(router, activeRoute) {
this.name = 'page';
this.current_page = 1;
this.pages = [];
this.numberPageInBetween = 5;
this.pagesInBetween = [];
this.router = router;
this.activeRoute = activeRoute;
this.navigationSubscription = this.router.events.subscribe((e) => {
if (e instanceof NavigationEnd) {
if (!isUndefined(this.activeRoute.snapshot.queryParams.page)) {
// tslint:disable-next-line:radix
this.current_page = parseInt(this.activeRoute.snapshot.queryParams.page);
}
}
});
}
/**
* @return {?}
*/
ngOnInit() {
if (!isUndefined(this.activeRoute.snapshot.queryParams[this.name])) {
// tslint:disable-next-line:radix
this.current_page = parseInt(this.activeRoute.snapshot.queryParams[this.name]);
}
}
/**
* @return {?}
*/
ngOnDestroy() {
this.navigationSubscription.unsubscribe();
}
/**
* @param {?} changes
* @return {?}
*/
ngOnChanges(changes) {
if (!isUndefined(this.paginator)) {
/** @type {?} */
const pages = [];
/** @type {?} */
const length = this.paginator.getTotalPages();
for (let k = 1; k <= length; k++) {
pages.push(k);
}
this.pages = pages;
/** @type {?} */
let newPagesInBetween = [];
if (length - 2 > this.numberPageInBetween) {
if (this.isHideLeftShowMore(this.current_page)) {
for (let k = 2; k <= this.numberPageInBetween + 1; k++) {
newPagesInBetween.push(k);
}
}
else if (this.isHideRightShowMore(this.current_page)) {
for (let k = length - this.numberPageInBetween; k <= length - 1; k++) {
newPagesInBetween.push(k);
}
}
else {
if (this.pagesInBetween.indexOf(this.current_page) > -1) {
newPagesInBetween = this.pagesInBetween;
}
else {
for (let k = this.current_page; k <= this.current_page + this.numberPageInBetween - 1; k++) {
newPagesInBetween.push(k);
}
}
}
}
else {
for (let k = 2; k <= length - 1; k++) {
newPagesInBetween.push(k);
}
}
this.pagesInBetween = newPagesInBetween;
}
}
/**
* @param {?} page
* @param {?=} action
* @return {?}
*/
resolveParams(page, action) {
if (!isUndefined(action)) {
if (action === 'prev') {
/** @type {?} */
const prevPage = page - 1;
return assign({}, this.activeRoute.snapshot.queryParams, { [this.name]: prevPage });
}
else if (action === 'next') {
/** @type {?} */
const nextPage = page + 1;
return assign({}, this.activeRoute.snapshot.queryParams, { [this.name]: nextPage });
}
else {
throw new Exception('only \'prev\' or \'next\' action are allowed');
}
}
else {
return assign({}, this.activeRoute.snapshot.queryParams, { [this.name]: page });
}
}
/**
* @return {?}
*/
getCurrentPage() {
return this.current_page;
}
/**
* @param {?} page
* @return {?}
*/
isCurrentPage(page) {
return page === this.current_page;
}
/**
* @return {?}
*/
shouldActivePrev() {
return this.current_page > 1;
}
/**
* @return {?}
*/
shouldActiveNext() {
return this.current_page < this.paginator.getTotalPages();
}
/**
* @return {?}
*/
getCurrentUrl() {
/** @type {?} */
let segments = ['/'];
this.activeRoute.snapshot.pathFromRoot.forEach(item => {
if (Array.isArray(item.url) && item.url.length > 0) {
segments = [...segments, ...item.url.map(i => i.path)];
}
});
return segments;
}
/**
* @param {?} page
* @return {?}
*/
isHideLeftShowMore(page) {
if (this.pages.length - 2 < this.numberPageInBetween || page <= this.numberPageInBetween + 1) {
return true;
}
else {
return false;
}
}
/**
* @param {?} page
* @return {?}
*/
isHideRightShowMore(page) {
// if left hide means we know that the left over pages is not more than this.numberPageInBetween
if (!this.isHideLeftShowMore(page)) {
if (this.pages.length - 2 < this.numberPageInBetween || page > this.pages.length - this.numberPageInBetween) {
return true;
}
else {
return false;
}
}
else {
if (this.pages.length - 2 < this.numberPageInBetween || page > this.numberPageInBetween + 1) {
return true;
}
else {
return false;
}
}
}
}
LengthAwarePaginatorComponent.decorators = [
{ type: Component, args: [{
// tslint:disable-next-line:component-selector
selector: 'length-aware-paginator',
template: "<div class=\"row\" *ngIf=\"paginator !== undefined && (alwaysDisplay === true || this.paginator.getTotalPages() > 1)\">\n <div class=\"col-md-12 col-sm-12 col-xs-12\">\n <ul class=\"pagination animated fadeIn\">\n <li class=\"page-item\" *ngIf=\"shouldActivePrev()\">\n <a class=\"page-link\" [routerLink]=\"getCurrentUrl()\" [queryParams]=\"this.resolveParams(getCurrentPage(), 'prev')\">Prev</a>\n </li>\n <li class=\"page-item\" [ngClass]=\"{'active': isCurrentPage(1)}\">\n <a class=\"page-link\" [routerLink]=\"getCurrentUrl()\" [queryParams]=\"this.resolveParams(1)\">1</a>\n </li>\n <li class=\"page-item left-show-more\" *ngIf=\"!isHideLeftShowMore(getCurrentPage())\">\n <a class=\"page-link\" [routerLink]=\"getCurrentUrl()\" [queryParams]=\"this.resolveParams(pagesInBetween[0] - numberPageInBetween )\">...</a>\n </li>\n <li class=\"page-item\" [ngClass]=\"{'active': isCurrentPage(page)}\" *ngFor=\"let page of pagesInBetween\">\n <a class=\"page-link\" [routerLink]=\"getCurrentUrl()\" [queryParams]=\"this.resolveParams(page)\">{{ page }}</a>\n </li>\n <li class=\"page-item right-show-more\" *ngIf=\"!isHideRightShowMore(getCurrentPage())\">\n <a class=\"page-link\" [routerLink]=\"getCurrentUrl()\" [queryParams]=\"this.resolveParams(pagesInBetween[pagesInBetween.length - 1] + 1)\">...</a>\n </li>\n <li class=\"page-item\" [ngClass]=\"{'active': isCurrentPage(pages.length)}\" *ngIf=\"pages.length > 1\">\n <a class=\"page-link\" [routerLink]=\"getCurrentUrl()\" [queryParams]=\"this.resolveParams(pages.length)\">{{ pages.length }}</a>\n </li>\n <li class=\"page-item\" *ngIf=\"shouldActiveNext()\">\n <a class=\"page-link\" [routerLink]=\"getCurrentUrl()\" [queryParams]=\"this.resolveParams(getCurrentPage(), 'next')\">Next</a>\n </li>\n </ul>\n </div>\n</div>",
styles: [""]
}] }
];
LengthAwarePaginatorComponent.ctorParameters = () => [
{ type: Router },
{ type: ActivatedRoute }
];
LengthAwarePaginatorComponent.propDecorators = {
alwaysDisplay: [{ type: Input }],
paginator: [{ type: Input }],
name: [{ type: Input }]
};
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/** @type {?} */
const ASC = 'asc';
/** @type {?} */
const DESC = 'desc';
class SortByFieldComponent {
/**
* @param {?} route
* @param {?} activatedRoute
*/
constructor(route, activatedRoute) {
this.allowMulti = false;
this.route = route;
this.activatedRoute = activatedRoute;
}
/**
* @return {?}
*/
ngOnInit() {
if (!isUndefined(this.default)) {
if (this.default.toLowerCase() === 'asc') {
this.direction = ASC;
}
if (this.default.toLowerCase() === 'desc') {
this.direction = DESC;
}
}
if (!isUndefined(this.activatedRoute.snapshot.queryParams.sort)) {
/** @type {?} */
const fields = this.activatedRoute.snapshot.queryParams.sort.split(',');
if (includes(fields, this.field) || includes(fields, `+${this.field}`)) {
this.direction = ASC;
}
else if (includes(fields, `-${this.field}`)) {
this.direction = DESC;
}
}
this.navigationSubscription = this.route.events.subscribe((e) => {
if (e instanceof NavigationEnd) {
if (!isUndefined(this.default)) {
if (this.default.toLowerCase() === 'asc') {
this.direction = ASC;
}
if (this.default.toLowerCase() === 'desc') {
this.direction = DESC;
}
}
if (!isUndefined(this.activatedRoute.snapshot.queryParams.sort)) {
/** @type {?} */
const fields = this.activatedRoute.snapshot.queryParams.sort.split(',');
if (includes(fields, this.field) || includes(fields, `+${this.field}`)) {
this.direction = ASC;
}
else if (includes(fields, `-${this.field}`)) {
this.direction = DESC;
}
else {
// tslint:disable-next-line:no-unused-expression
this.direction = undefined;
}
}
else {
// tslint:disable-next-line:no-unused-expression
this.direction = undefined;
}
}
});
}
/**
* @return {?}
*/
ngOnDestroy() {
this.navigationSubscription.unsubscribe();
}
/**
* @return {?}
*/
getDirection() {
return this.direction;
}
/**
* @return {?}
*/
getRouterDirection() {
if (this.direction === ASC) {
return '';
}
else if (this.direction === DESC) {
return '-';
}
else {
return undefined;
}
}
/**
* @return {?}
*/
sort() {
if (this.direction === ASC) {
this.direction = DESC;
}
else if (this.direction === DESC) {
this.direction = undefined;
}
else {
this.direction = ASC;
}
/** @type {?} */
const url = this.activatedRoute.snapshot.url;
/** @type {?} */
const queryParams = this.activatedRoute.snapshot.queryParams;
/** @type {?} */
let fields = [];
if (this.allowMulti === true) {
if (!isUndefined(queryParams.sort)) {
fields = queryParams.sort.split(',');
if (includes(fields, this.field) || includes(fields, `+${this.field}`) || includes(fields, `-${this.field}`)) {
if (this.getRouterDirection() === undefined) {
remove(fields, item => item === this.field || item === `+${this.field}` || item === `-${this.field}`);
}
else {
fields = map(fields, item => {
if (item === this.field || item === `+${this.field}` || item === `-${this.field}`) {
item = `${this.getRouterDirection()}${this.field}`;
}
return item;
});
}
}
else {
if (this.getRouterDirection() !== undefined) {
fields.push(`${this.getRouterDirection()}${this.field}`);
}
}
}
else {
if (this.getRouterDirection() !== undefined) {
fields.push(`${this.getRouterDirection()}${this.field}`);
}
}
}
else {
if (this.getRouterDirection() !== undefined) {
fields.push(`${this.getRouterDirection()}${this.field}`);
}
}
remove(fields, item => isNil(item) || item === '');
/** @type {?} */
let extras = { queryParams: { sort: fields.join(','), page: 1 } };
if (!isUndefined(this.options)) {
extras = assign(this.options, extras);
}
if (isUndefined(this.callback)) {
this.route.navigate([document.location.pathname], assign(extras, { queryParamsHandling: 'merge' }));
}
else {
this.callback(this.field, this.direction, extras);
}
}
}
SortByFieldComponent.decorators = [
{ type: Component, args: [{
// tslint:disable-next-line:component-selector
selector: 'sort-by-field',
template: "<span class=\"sorting fa fa-sort\" [ngClass]=\"{ 'fa-sort-up': direction === 'asc', 'fa-sort-down': direction === 'desc' }\" (click)=\"sort()\"></span>\n",
styles: [":host .sorting{cursor:pointer}"]
}] }
];
SortByFieldComponent.ctorParameters = () => [
{ type: Router },
{ type: ActivatedRoute }
];
SortByFieldComponent.propDecorators = {
field: [{ type: Input }],
allowMulti: [{ type: Input }],
default: [{ type: Input }],
options: [{ type: Input }],
callback: [{ type: Input }]
};
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class PerPageComponent {
/**
* @param {?} route
* @param {?} activatedRoute
*/
constructor(route, activatedRoute) {
this.route = route;
this.activatedRoute = activatedRoute;
this.limits = [5, 10, 20, 100];
this.perPage = 20;
this.navigationSubscription = this.route.events.subscribe((e) => {
if (e instanceof NavigationEnd) {
/** @type {?} */
const name = this.name || 'per_page';
if (!isUndefined(this.activatedRoute.snapshot.queryParams[name])) {
// tslint:disable-next-line:radix
this.perPage = parseInt(this.activatedRoute.snapshot.queryParams[name]);
if (!includes(this.limits, this.perPage)) {
this.limits.push(this.perPage);
}
else {
this.limits = [5, 10, 20, 100];
}
}
}
});
}
/**
* @return {?}
*/
ngOnInit() { }
/**
* @return {?}
*/
ngOnDestroy() {
if (!isUndefined(this.navigationSubscription)) {
this.navigationSubscription.unsubscribe();
}
}
/**
* @return {?}
*/
updateLimit() {
/** @type {?} */
const name = this.name || 'per_page';
/** @type {?} */
const page = this.page || 'page';
/** @type {?} */
const url = window.location.pathname;
/** @type {?} */
let queryParams = this.activatedRoute.snapshot.queryParams;
/** @type {?} */
const data = {};
data[name] = this.perPage;
data[page] = 1;
queryParams = assign({}, queryParams, data);
/** @type {?} */
const params = assign({}, this.activatedRoute.snapshot.params, { queryParams });
this.route.navigate([url], params);
}
}
PerPageComponent.decorators = [
{ type: Component, args: [{
// tslint:disable-next-line:component-selector
selector: 'per-page',
template: "<label for=\"\">Show</label>\n<select class=\"form-control input-sm\" name=\"perPage\" [(ngModel)]=\"perPage\" (change)=\"updateLimit()\">\n <option [ngValue]=\"i\" *ngFor=\"let i of limits\">{{ i }}</option>\n</select>\n",
styles: [""]
}] }
];
PerPageComponent.ctorParameters = () => [
{ type: Router },
{ type: ActivatedRoute }
];
PerPageComponent.propDecorators = {
perPage: [{ type: Input }],
name: [{ type: Input }],
page: [{ type: Input }]
};
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class CustomSelectionComponent {
/**
* @param {?} element
* @param {?} renderer
*/
constructor(element, renderer) {
this.element = element;
this.renderer = renderer;
this.onChange = (val) => { };
this.onTouched = () => { };
this.disabled = false;
}
/**
* @return {?}
*/
triggerChanged() {
/** @type {?} */
let event = new CustomEvent('change', { bubbles: true });
this.renderer.invokeElementMethod(this.element.nativeElement, 'dispatchEvent', [event]);
}
/**
* @param {?} val
* @return {?}
*/
writeValue(val) {
if (val) {
this.value = val;
}
}
/**
* @return {?}
*/
get value() {
return this._value;
}
/**
* @param {?} val
* @return {?}
*/
set value(val) {
this.selected = find(this.options, item => item.value === val);
this._value = val;
this.onChange(this._value);
}
/**
* @param {?} fn
* @return {?}
*/
registerOnChange(fn) {
this.onChange = fn;
}
/**
* @param {?} fn
* @return {?}
*/
registerOnTouched(fn) {
this.onTouched = fn;
}
/**
* @param {?} isDisabled
* @return {?}
*/
setDisabledState(isDisabled) {
this.disabled = isDisabled;
}
/**
* @param {?} opt
* @return {?}
*/
change(opt) {
this.value = opt.value;
this.triggerChanged();
}
}
CustomSelectionComponent.decorators = [
{ type: Component, args: [{
// tslint:disable-next-line:component-selector
selector: 'custom-selection',
template: "<div class=\"dropdown custom-selection\">\n <button class=\"btn btn-default btn-sm dropdown-toggle\" type=\"button\" data-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\n {{ selected === undefined ? '' : selected.label }}\n </button>\n <div class=\"dropdown-menu\">\n <a class=\"dropdown-item\" *ngFor=\"let option of options\" (click)=\"change(option)\">{{ option.label }}</a>\n </div>\n</div>\n",
providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => CustomSelectionComponent),
multi: true
}
],
styles: [":host .custom-selection button{border:1px solid #ddd;border-radius:4px}:host .custom-selection button.btn:focus{box-shadow:none;outline:0}:host .custom-selection .dropdown-menu .dropdown-item{cursor:pointer}"]
}] }
];
CustomSelectionComponent.ctorParameters = () => [
{ type: ElementRef },
{ type: Renderer }
];
CustomSelectionComponent.propDecorators = {
_value: [{ type: Input }],
options: [{ type: Input }]
};
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class AutoresizeDirective {
/**
* @param {?} element
*/
constructor(element) {
this.element = element;
}
/**
* @param {?} textArea
* @return {?}
*/
onInput(textArea) {
this.adjust();
}
/**
* @return {?}
*/
ngOnInit() {
this.adjust();
}
/**
* @return {?}
*/
adjust() {
/** @type {?} */
let el = this.element.nativeElement;
/** @type {?} */
let newHeight;
if (el) {
el.style.overflow = 'hidden';
el.style.height = 'auto';
if (this.autoresize) {
newHeight = Math.min(el.scrollHeight, this.autoresize);
}
else {
newHeight = el.scrollHeight;
}
el.style.height = newHeight + 'px';
}
}
}
AutoresizeDirective.decorators = [
{ type: Directive, args: [{
// tslint:disable-next-line:directive-selector
selector: '[autoresize]'
},] }
];
AutoresizeDirective.ctorParameters = () => [
{ type: ElementRef }
];
AutoresizeDirective.propDecorators = {
autoresize: [{ type: Input }],
onInput: [{ type: HostListener, args: ['input', ['$event.target'],] }]
};
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class DirectivesModule {
}
DirectivesModule.decorators = [
{ type: NgModule, args: [{
imports: [
CommonModule,
FormsModule,
ReactiveFormsModule,
RouterModule,
PipesModule
],
exports: [
CustomSelectionComponent,
LengthAwarePaginatorComponent,
PerPageComponent,
SearchFormComponent,
SortByFieldComponent,
PaginationComponent,
LoaderComponent,
AutoresizeDirective
],
declarations: [
CustomSelectionComponent,
LengthAwarePaginatorComponent,
PerPageComponent,
SearchFormComponent,
SortByFieldComponent,
PaginationComponent,
LoaderComponent,
AutoresizeDirective
]
},] }
];
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class ActivityLogComponent {
constructor() { }
/**
* @return {?}
*/
ngOnInit() { }
}
ActivityLogComponent.decorators = [
{ type: Component, args: [{
selector: 'vicoders-activity-log',
template: "<table class=\"table table-no-border-top\">\n <thead>\n <tr>\n <th>\n ID\n <sort-by-field field=\"id\"></sort-by-field>\n </th>\n <th>Th\u1EDDi gian</th>\n <th>S\u1EF1 ki\u1EC7n</th>\n </tr>\n </thead>\n <tbody *ngIf=\"(items | hasItem)\">\n <tr *ngFor=\"let item of items\">\n <td>{{ item.getId() }}</td>\n <td>\n {{\n item.timestamps.created_at.date | timeFormat: \"DD/MM/YYYY HH:mm:ss\"\n }}\n </td>\n <td>{{ item.getDescription() }}</td>\n </tr>\n </tbody>\n\n <tbody *ngIf=\"!(items | hasItem)\">\n <tr>\n <td colspan=\"4\" class=\"text-center\">We don't have any record here</td>\n </tr>\n </tbody>\n</table>\n<length-aware-paginator *ngIf=\"paginator\" [(paginator)]=\"paginator\"></length-aware-paginator>\n",
styles: [""]
}] }
];
ActivityLogComponent.ctorParameters = () => [];
ActivityLogComponent.propDecorators = {
items: [{ type: Input }],
paginator: [{ type: Input }]
};
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class VicodersActivityLogModule {
}
VicodersActivityLogModule.decorators = [
{ type: NgModule, args: [{
imports: [CommonModule, DirectivesModule, PipesModule],
declarations: [ActivityLogComponent],
exports: [ActivityLogComponent]
},] }
];
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
export { DirectivesModule, PipesModule, Exception, ActivityLogComponent, VicodersActivityLogModule, AutoresizeDirective as ɵr, CustomSelectionComponent as ɵk, LengthAwarePaginatorComponent as ɵl, LoaderComponent as ɵq, PaginationComponent as ɵp, PerPageComponent as ɵm, SearchFormComponent as ɵn, SortByFieldComponent as ɵo, FilterByPipe as ɵd, FindByPipe as ɵh, FlatMapPipe as ɵg, HasItemPipe as ɵa, IsArrayPipe as ɵc, LengthPipe as ɵb, OrderByPipe as ɵe, ReadableTimePipe as ɵj, SumByPipe as ɵf, TimeFormatPipe as ɵi };
//# sourceMappingURL=vicoders-angular.js.map