import { ChangeDetectionStrategy , Component , Directive , EventEmitter , Input , OnChanges , OnInit , Output , SimpleChanges , ViewEncapsulation } from '@angular/core' ; import { PanelMode } from '../../standard-types' ; import { TinyDate } from 'ngx-tethys/util' ; import { DateHelperService } from '../../date-helper.service' ; export interface PanelSelector { className : string ; title ? : string ; label : string ; onClick ? ( ) : void ; } @ Directive ( ) export abstract class CalendarHeader implements OnInit , OnChanges { @ Input ( ) showSuperPreBtn : boolean = true ; @ Input ( ) showSuperNextBtn : boolean = true ; @ Input ( ) showPreBtn : boolean = true ; @ Input ( ) showNextBtn : boolean = true ; @ Input ( ) value : TinyDate ; @ Output ( ) readonly valueChange = new EventEmitter < TinyDate > ( ) ; @ Output ( ) readonly panelModeChange = new EventEmitter < PanelMode > ( ) ; abstract getSelectors ( ) ; prefixCls = 'thy-calendar' ; selectors : PanelSelector [ ] ; constructor ( public dateHelper ) { } ngOnInit ( ) { if ( ! this . value ) { this . value = new TinyDate ( ) ; } this . selectors = this . getSelectors ( ) ; } ngOnChanges ( changes ) { if ( changes . value ) { this . render ( ) ; } } superPrevious ( ) { this . gotoYear ( - 1 ) ; } superNext ( ) { this . gotoYear ( 1 ) ; } previous ( ) { this . gotoMonth ( - 1 ) ; } next ( ) { this . gotoMonth ( 1 ) ; } changePanel ( mode , value ? ) { this . panelModeChange . emit ( mode ) ; } private render ( ) { if ( this . value ) { this . selectors = this . getSelectors ( ) ; } } private gotoMonth ( amount ) { this . changeValue ( this . value . addMonths ( amount ) ) ; } private gotoYear ( amount ) { this . changeValue ( this . value . addYears ( amount ) ) ; } public changeValue ( value ) { if ( this . value !== value ) { this . value = value ; this . valueChange . emit ( this . value ) ; this . render ( ) ; } } formatDateTime ( format ) { return this . dateHelper . format ( this . value . nativeDate , format ) ; } }