ngx-bootstrap
Version:
Native Angular Bootstrap Components
42 lines • 2.63 kB
JavaScript
import { Component, EventEmitter, Input, Output } from '@angular/core';
import { yearsPerCalendar } from '../../engine/format-years-calendar';
import { BsNavigationDirection } from '../../models/index';
var BsYearsCalendarViewComponent = (function () {
function BsYearsCalendarViewComponent() {
this.onNavigate = new EventEmitter();
this.onViewMode = new EventEmitter();
this.onSelect = new EventEmitter();
this.onHover = new EventEmitter();
}
BsYearsCalendarViewComponent.prototype.navigateTo = function (event) {
var step = BsNavigationDirection.DOWN === event ? -1 : 1;
this.onNavigate.emit({ step: { year: step * yearsPerCalendar } });
};
BsYearsCalendarViewComponent.prototype.viewYear = function (year) {
this.onSelect.emit(year);
};
BsYearsCalendarViewComponent.prototype.hoverYear = function (cell, isHovered) {
this.onHover.emit({ cell: cell, isHovered: isHovered });
};
BsYearsCalendarViewComponent.prototype.changeViewMode = function (event) {
this.onViewMode.emit(event);
};
BsYearsCalendarViewComponent.decorators = [
{ type: Component, args: [{
selector: 'bs-years-calendar-view',
template: "\n <bs-calendar-layout>\n <bs-datepicker-navigation-view\n [calendar]=\"calendar\"\n (onNavigate)=\"navigateTo($event)\"\n (onViewMode)=\"changeViewMode($event)\"\n ></bs-datepicker-navigation-view>\n\n <table role=\"grid\" class=\"years\">\n <tbody>\n <tr *ngFor=\"let row of calendar.years\">\n <td *ngFor=\"let year of row\" role=\"gridcell\"\n (click)=\"viewYear(year)\"\n (mouseenter)=\"hoverYear(year, true)\"\n (mouseleave)=\"hoverYear(year, false)\"\n [class.disabled]=\"year.isDisabled\"\n [class.is-highlighted]=\"year.isHovered\">\n <span>{{ year.label }}</span>\n </td>\n </tr>\n </tbody>\n </table>\n </bs-calendar-layout>\n "
},] },
];
/** @nocollapse */
BsYearsCalendarViewComponent.ctorParameters = function () { return []; };
BsYearsCalendarViewComponent.propDecorators = {
'calendar': [{ type: Input },],
'onNavigate': [{ type: Output },],
'onViewMode': [{ type: Output },],
'onSelect': [{ type: Output },],
'onHover': [{ type: Output },],
};
return BsYearsCalendarViewComponent;
}());
export { BsYearsCalendarViewComponent };
//# sourceMappingURL=bs-years-calendar-view.component.js.map