ngx-pluto/esm5/lib/date-picker/components/date-picker-header.js

ngx-pluto组件库

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
import { Component, ViewEncapsulation, Input, Output, EventEmitter } from "@angular/core";
import * as moment_ from 'moment';
/** @type {?} */
var moment = moment_;
import { NpDatePickerService } from "../date-picker.service";
/**
 * @ignore
 */
var NpDatePickerHeader = /** @class */ (function () {
    function NpDatePickerHeader(datePickerService) {
        this.datePickerService = datePickerService;
        this.date = moment();
        this.onYearClicked = new EventEmitter();
        this.onMonthClicked = new EventEmitter();
        this.onArrowClicked = new EventEmitter();
        this.isYearLabelRanged = false;
        this.isShowMonthLabel = true;
        this.isShowPreBtn = true;
    }
    /**
     * @return {?}
     */
    NpDatePickerHeader.prototype.ngOnInit = /**
     * @return {?}
     */
    function () {
        this.resetYearAndMonth();
    };
    /**
     * @param {?} changes
     * @return {?}
     */
    NpDatePickerHeader.prototype.ngOnChanges = /**
     * @param {?} changes
     * @return {?}
     */
    function (changes) {
        /** @type {?} */
        var date = (/** @type {?} */ (changes['date'].currentValue));
        if (date) {
            this.resetYearAndMonth();
        }
    };
    /**
     * @return {?}
     */
    NpDatePickerHeader.prototype.onYearLabelClicked = /**
     * @return {?}
     */
    function () {
        if (this.isYearLabelRanged) {
            return;
        }
        this.isYearLabelRanged = true;
        this.isShowMonthLabel = false;
        this.isShowPreBtn = false;
        /** @type {?} */
        var ranges = this.datePickerService.buildYearsPanel(this.date, this.year, this.date.clone());
        this.year = ranges[1].value + '-' + ranges[ranges.length - 2].value;
        this.onYearClicked.emit({ date: this.date, year: this.year, ranges: ranges });
    };
    /**
     * @return {?}
     */
    NpDatePickerHeader.prototype.onMonthLabelClicked = /**
     * @return {?}
     */
    function () {
        this.isShowMonthLabel = false;
        this.isShowPreBtn = false;
        this.month = this.date.format('MMMM');
        this.onMonthClicked.emit({ date: this.date, month: this.month });
    };
    /**
     * @param {?} arrowType
     * @return {?}
     */
    NpDatePickerHeader.prototype.onArrowBtnClicked = /**
     * @param {?} arrowType
     * @return {?}
     */
    function (arrowType) {
        this.onArrowClicked.emit({ arrowType: arrowType, date: this.date });
    };
    /**
     * @private
     * @return {?}
     */
    NpDatePickerHeader.prototype.resetYearAndMonth = /**
     * @private
     * @return {?}
     */
    function () {
        if (this.isYearLabelRanged) {
            /** @type {?} */
            var ranges = this.datePickerService.buildYearsPanel(this.date, this.date.format('YYYY'), this.date.clone());
            this.year = ranges[1].value + '-' + ranges[ranges.length - 2].value;
        }
        else {
            this.year = this.date.format('YYYY');
        }
        this.month = this.date.format('MMMM');
    };
    NpDatePickerHeader.decorators = [
        { type: Component, args: [{
                    selector: "np-date-picker-header",
                    template: "<div class=\"date-picker-header flex-wrap row-flex\">\r\n  <div class=\"arrow-container flex-wrap row-flex\">\r\n    <span class=\"double-pre-btn\" (click)=\"onArrowBtnClicked('double-pre')\"></span>\r\n    <span class=\"pre-btn\" *ngIf=\"isShowPreBtn\" (click)=\"onArrowBtnClicked('pre')\"></span>\r\n  </div>\r\n  <div class=\"date-container flex-wrap row-flex\">\r\n    <span class=\"year\" (click)=\"onYearLabelClicked()\">{{ year }}</span>\r\n    &nbsp;&nbsp;\r\n    <span class=\"month\" *ngIf=\"isShowMonthLabel\" (click)=\"onMonthLabelClicked()\">{{ month }}</span>\r\n  </div>\r\n  <div class=\"arrow-container flex-wrap row-flex\">\r\n    <span class=\"next-btn\" *ngIf=\"isShowPreBtn\" (click)=\"onArrowBtnClicked('next')\"></span>\r\n    <span class=\"double-next-btn\" (click)=\"onArrowBtnClicked('double-next')\"></span>\r\n  </div>\r\n</div>\r\n",
                    encapsulation: ViewEncapsulation.None,
                    styles: [".date-picker-header{position:relative;justify-content:space-between;height:41px;line-height:41px;font-weight:500}.date-picker-header .arrow-container{position:relative;padding-top:17px}.date-picker-header .arrow-container .arrow-btn,.date-picker-header .arrow-container .double-next-btn::after,.date-picker-header .arrow-container .double-next-btn::before,.date-picker-header .arrow-container .double-pre-btn::after,.date-picker-header .arrow-container .double-pre-btn::before,.date-picker-header .arrow-container .next-btn::before,.date-picker-header .arrow-container .pre-btn::before{position:absolute;display:inline-block;width:6px;height:6px;border:0 solid;border-width:1.5px 0 0 1.5px;content:\"\"}.date-picker-header .arrow-container .double-next-btn::before,.date-picker-header .arrow-container .double-pre-btn::before{top:0;left:0}.date-picker-header .arrow-container .double-next-btn::after,.date-picker-header .arrow-container .double-pre-btn::after{top:4px;left:4px}.date-picker-header .arrow-container .next-btn::before,.date-picker-header .arrow-container .pre-btn::before{top:0;left:0}.date-picker-header .arrow-container .double-pre-btn,.date-picker-header .arrow-container .pre-btn{transform:rotate(-45deg);position:relative;display:inline-block;width:7px;height:7px;margin-left:17px;cursor:pointer}.date-picker-header .arrow-container .double-next-btn,.date-picker-header .arrow-container .next-btn{transform:rotate(135deg);position:relative;display:inline-block;width:7px;height:7px;margin-right:17px;cursor:pointer}.date-picker-header .date-container{cursor:pointer}"]
                }] }
    ];
    /** @nocollapse */
    NpDatePickerHeader.ctorParameters = function () { return [
        { type: NpDatePickerService }
    ]; };
    NpDatePickerHeader.propDecorators = {
        date: [{ type: Input }],
        onYearClicked: [{ type: Output }],
        onMonthClicked: [{ type: Output }],
        onArrowClicked: [{ type: Output }]
    };
    return NpDatePickerHeader;
}());
export { NpDatePickerHeader };
if (false) {
    /** @type {?} */
    NpDatePickerHeader.prototype.date;
    /** @type {?} */
    NpDatePickerHeader.prototype.onYearClicked;
    /** @type {?} */
    NpDatePickerHeader.prototype.onMonthClicked;
    /** @type {?} */
    NpDatePickerHeader.prototype.onArrowClicked;
    /** @type {?} */
    NpDatePickerHeader.prototype.year;
    /** @type {?} */
    NpDatePickerHeader.prototype.month;
    /** @type {?} */
    NpDatePickerHeader.prototype.isYearLabelRanged;
    /** @type {?} */
    NpDatePickerHeader.prototype.isShowMonthLabel;
    /** @type {?} */
    NpDatePickerHeader.prototype.isShowPreBtn;
    /**
     * @type {?}
     * @private
     */
    NpDatePickerHeader.prototype.datePickerService;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGF0ZS1waWNrZXItaGVhZGVyLmpzIiwic291cmNlUm9vdCI6Im5nOi8vbmd4LXBsdXRvLyIsInNvdXJjZXMiOlsibGliL2RhdGUtcGlja2VyL2NvbXBvbmVudHMvZGF0ZS1waWNrZXItaGVhZGVyLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7QUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLGlCQUFpQixFQUFVLEtBQUssRUFBeUIsTUFBTSxFQUFFLFlBQVksRUFBaUIsTUFBTSxlQUFlLENBQUM7QUFDeEksT0FBTyxLQUFLLE9BQU8sTUFBTSxRQUFRLENBQUM7O0lBQU8sTUFBTSxHQUFHLE9BQU87QUFDekQsT0FBTyxFQUFFLG1CQUFtQixFQUFZLE1BQU0sd0JBQXdCLENBQUM7Ozs7QUFLdkU7SUFxQkUsNEJBQW9CLGlCQUFzQztRQUF0QyxzQkFBaUIsR0FBakIsaUJBQWlCLENBQXFCO1FBWmpELFNBQUksR0FBbUIsTUFBTSxFQUFFLENBQUM7UUFFL0Isa0JBQWEsR0FBRyxJQUFJLFlBQVksRUFBbUUsQ0FBQztRQUNwRyxtQkFBYyxHQUFHLElBQUksWUFBWSxFQUEyQyxDQUFDO1FBQzdFLG1CQUFjLEdBQUcsSUFBSSxZQUFZLEVBQWtELENBQUM7UUFJOUYsc0JBQWlCLEdBQVksS0FBSyxDQUFDO1FBQ25DLHFCQUFnQixHQUFZLElBQUksQ0FBQztRQUNqQyxpQkFBWSxHQUFZLElBQUksQ0FBQztJQUVpQyxDQUFDOzs7O0lBRS9ELHFDQUFROzs7SUFBUjtRQUNFLElBQUksQ0FBQyxpQkFBaUIsRUFBRSxDQUFDO0lBQzNCLENBQUM7Ozs7O0lBRUQsd0NBQVc7Ozs7SUFBWCxVQUFZLE9BQXNCOztZQUMxQixJQUFJLEdBQW1CLG1CQUFBLE9BQU8sQ0FBQyxNQUFNLENBQUMsQ0FBQyxZQUFZLEVBQWtCO1FBRTNFLElBQUksSUFBSSxFQUFFO1lBQ1IsSUFBSSxDQUFDLGlCQUFpQixFQUFFLENBQUM7U0FDMUI7SUFDSCxDQUFDOzs7O0lBRUQsK0NBQWtCOzs7SUFB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Q0FBaUM7O0lBQ2pDLDBDQUE2Qjs7Ozs7SUFFakIsK0NBQThDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBWaWV3RW5jYXBzdWxhdGlvbiwgT25Jbml0LCBJbnB1dCwgRWxlbWVudFJlZiwgVmlld0NoaWxkLCBPdXRwdXQsIEV2ZW50RW1pdHRlciwgU2ltcGxlQ2hhbmdlcyB9IGZyb20gXCJAYW5ndWxhci9jb3JlXCI7XHJcbmltcG9ydCAqIGFzIG1vbWVudF8gZnJvbSAnbW9tZW50JzsgY29uc3QgbW9tZW50ID0gbW9tZW50X1xyXG5pbXBvcnQgeyBOcERhdGVQaWNrZXJTZXJ2aWNlLCBZZWFyRGF0YSB9IGZyb20gXCIuLi9kYXRlLXBpY2tlci5zZXJ2aWNlXCI7XHJcblxyXG4vKipcclxuICogQGlnbm9yZVxyXG4gKi9cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6IGBucC1kYXRlLXBpY2tlci1oZWFkZXJgLFxyXG4gIHRlbXBsYXRlVXJsOiAnZGF0ZS1waWNrZXItaGVhZGVyLmh0bWwnLFxyXG4gIHN0eWxlVXJsczogWydkYXRlLXBpY2tlci1oZWFkZXIuc2NzcyddLFxyXG4gIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmVcclxufSlcclxuXHJcbmV4cG9ydCBjbGFzcyBOcERhdGVQaWNrZXJIZWFkZXIgaW1wbGVtZW50cyBPbkluaXQge1xyXG5cclxuICBASW5wdXQoKSBkYXRlOiBtb21lbnRfLk1vbWVudCA9IG1vbWVudCgpO1xyXG5cclxuICBAT3V0cHV0KCkgb25ZZWFyQ2xpY2tlZCA9IG5ldyBFdmVudEVtaXR0ZXI8eyBkYXRlOiBtb21lbnRfLk1vbWVudCwgeWVhcjogc3RyaW5nLCByYW5nZXM6IEFycmF5PFllYXJEYXRhPiB9PigpO1xyXG4gIEBPdXRwdXQoKSBvbk1vbnRoQ2xpY2tlZCA9IG5ldyBFdmVudEVtaXR0ZXI8eyBkYXRlOiBtb21lbnRfLk1vbWVudCwgbW9udGg6IHN0cmluZyB9PigpO1xyXG4gIEBPdXRwdXQoKSBvbkFycm93Q2xpY2tlZCA9IG5ldyBFdmVudEVtaXR0ZXI8eyBhcnJvd1R5cGU6IEFycm93VHlwZSwgZGF0ZTogbW9tZW50Xy5Nb21lbnQgfT4oKTtcclxuXHJcbiAgeWVhcjogc3RyaW5nO1xyXG4gIG1vbnRoOiBzdHJpbmc7XHJcbiAgaXNZZWFyTGFiZWxSYW5nZWQ6IGJvb2xlYW4gPSBmYWxzZTtcclxuICBpc1Nob3dNb250aExhYmVsOiBib29sZWFuID0gdHJ1ZTtcclxuICBpc1Nob3dQcmVCdG46IGJvb2xlYW4gPSB0cnVlO1xyXG5cclxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIGRhdGVQaWNrZXJTZXJ2aWNlOiBOcERhdGVQaWNrZXJTZXJ2aWNlKSB7IH1cclxuXHJcbiAgbmdPbkluaXQoKSB7XHJcbiAgICB0aGlzLnJlc2V0WWVhckFuZE1vbnRoKCk7XHJcbiAgfVxyXG5cclxuICBuZ09uQ2hhbmdlcyhjaGFuZ2VzOiBTaW1wbGVDaGFuZ2VzKSB7XHJcbiAgICBjb25zdCBkYXRlOiBtb21lbnRfLk1vbWVudCA9IGNoYW5nZXNbJ2RhdGUnXS5jdXJyZW50VmFsdWUgYXMgbW9tZW50Xy5Nb21lbnQ7XHJcblxyXG4gICAgaWYgKGRhdGUpIHtcclxuICAgICAgdGhpcy5yZXNldFllYXJBbmRNb250aCgpO1xyXG4gICAgfVxyXG4gIH1cclxuXHJcbiAgb25ZZWFyTGFiZWxDbGlja2VkKCkge1xyXG4gICAgaWYgKHRoaXMuaXNZZWFyTGFiZWxSYW5nZWQpIHtcclxuICAgICAgcmV0dXJuO1xyXG4gICAgfVxyXG5cclxuICAgIHRoaXMuaXNZZWFyTGFiZWxSYW5nZWQgPSB0cnVlO1xyXG4gICAgdGhpcy5pc1Nob3dNb250aExhYmVsID0gZmFsc2U7XHJcbiAgICB0aGlzLmlzU2hvd1ByZUJ0biA9IGZhbHNlO1xyXG4gICAgbGV0IHJhbmdlcyA9IHRoaXMuZGF0ZVBpY2tlclNlcnZpY2UuYnVpbGRZZWFyc1BhbmVsKHRoaXMuZGF0ZSwgdGhpcy55ZWFyLCB0aGlzLmRhdGUuY2xvbmUoKSk7XHJcbiAgICB0aGlzLnllYXIgPSByYW5nZXNbMV0udmFsdWUgKyAnLScgKyByYW5nZXNbcmFuZ2VzLmxlbmd0aCAtIDJdLnZhbHVlO1xyXG4gICAgdGhpcy5vblllYXJDbGlja2VkLmVtaXQoeyBkYXRlOiB0aGlzLmRhdGUsIHllYXI6IHRoaXMueWVhciwgcmFuZ2VzOiByYW5nZXMgfSk7XHJcbiAgfVxyXG5cclxuICBvbk1vbnRoTGFiZWxDbGlja2VkKCkge1xyXG4gICAgdGhpcy5pc1Nob3dNb250aExhYmVsID0gZmFsc2U7XHJcbiAgICB0aGlzLmlzU2hvd1ByZUJ0biA9IGZhbHNlO1xyXG4gICAgdGhpcy5tb250aCA9IHRoaXMuZGF0ZS5mb3JtYXQoJ01NTU0nKTtcclxuICAgIHRoaXMub25Nb250aENsaWNrZWQuZW1pdCh7IGRhdGU6IHRoaXMuZGF0ZSwgbW9udGg6IHRoaXMubW9udGggfSk7XHJcbiAgfVxyXG5cclxuICBvbkFycm93QnRuQ2xpY2tlZChhcnJvd1R5cGU6IEFycm93VHlwZSkge1xyXG4gICAgdGhpcy5vbkFycm93Q2xpY2tlZC5lbWl0KHsgYXJyb3dUeXBlOiBhcnJvd1R5cGUsIGRhdGU6IHRoaXMuZGF0ZSB9KTtcclxuICB9XHJcblxyXG4gIHByaXZhdGUgcmVzZXRZZWFyQW5kTW9udGgoKSB7XHJcbiAgICBpZiAodGhpcy5pc1llYXJMYWJlbFJhbmdlZCkge1xyXG4gICAgICBsZXQgcmFuZ2VzID0gdGhpcy5kYXRlUGlja2VyU2VydmljZS5idWlsZFllYXJzUGFuZWwodGhpcy5kYXRlLCB0aGlzLmRhdGUuZm9ybWF0KCdZWVlZJyksIHRoaXMuZGF0ZS5jbG9uZSgpKTtcclxuICAgICAgdGhpcy55ZWFyID0gcmFuZ2VzWzFdLnZhbHVlICsgJy0nICsgcmFuZ2VzW3Jhbmdlcy5sZW5ndGggLSAyXS52YWx1ZTtcclxuICAgIH0gZWxzZSB7XHJcbiAgICAgIHRoaXMueWVhciA9IHRoaXMuZGF0ZS5mb3JtYXQoJ1lZWVknKTtcclxuICAgIH1cclxuXHJcbiAgICB0aGlzLm1vbnRoID0gdGhpcy5kYXRlLmZvcm1hdCgnTU1NTScpO1xyXG4gIH1cclxufVxyXG5cclxuZXhwb3J0IHR5cGUgQXJyb3dUeXBlID0gJ2RvdWJsZS1wcmUnIHwgJ3ByZScgfCAnbmV4dCcgfCAnZG91YmxlLW5leHQnOyJdfQ==