ng-zorro-antd
Version:
An enterprise-class UI components based on Ant Design and Angular
334 lines (326 loc) • 11.9 kB
JavaScript
import { __extends, __read } from 'tslib';
import { Platform, PlatformModule } from '@angular/cdk/platform';
import { Component, ChangeDetectionStrategy, ViewEncapsulation, Input, EventEmitter, ChangeDetectorRef, NgZone, Output, Inject, LOCALE_ID, NgModule } from '@angular/core';
import { interval } from 'rxjs';
import { getLocaleNumberSymbol, NumberSymbol, CommonModule } from '@angular/common';
import { NzOutletModule } from 'ng-zorro-antd/core/outlet';
import { NzPipesModule } from 'ng-zorro-antd/core/pipe';
/**
* @fileoverview added by tsickle
* Generated from: statistic.component.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var NzStatisticComponent = /** @class */ (function () {
function NzStatisticComponent() {
this.nzValueStyle = {};
}
NzStatisticComponent.decorators = [
{ type: Component, args: [{
changeDetection: ChangeDetectionStrategy.OnPush,
encapsulation: ViewEncapsulation.None,
selector: 'nz-statistic',
exportAs: 'nzStatistic',
template: "\n <div class=\"ant-statistic\">\n <div class=\"ant-statistic-title\">\n <ng-container *nzStringTemplateOutlet=\"nzTitle\">{{ nzTitle }}</ng-container>\n </div>\n <div class=\"ant-statistic-content\" [ngStyle]=\"nzValueStyle\">\n <span *ngIf=\"nzPrefix\" class=\"ant-statistic-content-prefix\">\n <ng-container *nzStringTemplateOutlet=\"nzPrefix\">{{ nzPrefix }}</ng-container>\n </span>\n <nz-statistic-number [nzValue]=\"nzValue\" [nzValueTemplate]=\"nzValueTemplate\"> </nz-statistic-number>\n <span *ngIf=\"nzSuffix\" class=\"ant-statistic-content-suffix\">\n <ng-container *nzStringTemplateOutlet=\"nzSuffix\">{{ nzSuffix }}</ng-container>\n </span>\n </div>\n </div>\n "
}] }
];
NzStatisticComponent.propDecorators = {
nzPrefix: [{ type: Input }],
nzSuffix: [{ type: Input }],
nzTitle: [{ type: Input }],
nzValue: [{ type: Input }],
nzValueStyle: [{ type: Input }],
nzValueTemplate: [{ type: Input }]
};
return NzStatisticComponent;
}());
if (false) {
/** @type {?} */
NzStatisticComponent.prototype.nzPrefix;
/** @type {?} */
NzStatisticComponent.prototype.nzSuffix;
/** @type {?} */
NzStatisticComponent.prototype.nzTitle;
/** @type {?} */
NzStatisticComponent.prototype.nzValue;
/** @type {?} */
NzStatisticComponent.prototype.nzValueStyle;
/** @type {?} */
NzStatisticComponent.prototype.nzValueTemplate;
}
/**
* @fileoverview added by tsickle
* Generated from: countdown.component.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/** @type {?} */
var REFRESH_INTERVAL = 1000 / 30;
var NzCountdownComponent = /** @class */ (function (_super) {
__extends(NzCountdownComponent, _super);
function NzCountdownComponent(cdr, ngZone, platform) {
var _this = _super.call(this) || this;
_this.cdr = cdr;
_this.ngZone = ngZone;
_this.platform = platform;
_this.nzFormat = 'HH:mm:ss';
_this.nzCountdownFinish = new EventEmitter();
return _this;
}
/**
* @param {?} changes
* @return {?}
*/
NzCountdownComponent.prototype.ngOnChanges = /**
* @param {?} changes
* @return {?}
*/
function (changes) {
if (changes.nzValue) {
this.target = Number(changes.nzValue.currentValue);
if (!changes.nzValue.isFirstChange()) {
this.syncTimer();
}
}
};
/**
* @return {?}
*/
NzCountdownComponent.prototype.ngOnInit = /**
* @return {?}
*/
function () {
this.syncTimer();
};
/**
* @return {?}
*/
NzCountdownComponent.prototype.ngOnDestroy = /**
* @return {?}
*/
function () {
this.stopTimer();
};
/**
* @return {?}
*/
NzCountdownComponent.prototype.syncTimer = /**
* @return {?}
*/
function () {
if (this.target >= Date.now()) {
this.startTimer();
}
else {
this.stopTimer();
}
};
/**
* @return {?}
*/
NzCountdownComponent.prototype.startTimer = /**
* @return {?}
*/
function () {
var _this = this;
if (this.platform.isBrowser) {
this.ngZone.runOutsideAngular((/**
* @return {?}
*/
function () {
_this.stopTimer();
_this.updater_ = interval(REFRESH_INTERVAL).subscribe((/**
* @return {?}
*/
function () {
_this.updateValue();
_this.cdr.detectChanges();
}));
}));
}
};
/**
* @return {?}
*/
NzCountdownComponent.prototype.stopTimer = /**
* @return {?}
*/
function () {
if (this.updater_) {
this.updater_.unsubscribe();
this.updater_ = null;
}
};
/**
* Update time that should be displayed on the screen.
*/
/**
* Update time that should be displayed on the screen.
* @protected
* @return {?}
*/
NzCountdownComponent.prototype.updateValue = /**
* Update time that should be displayed on the screen.
* @protected
* @return {?}
*/
function () {
this.diff = Math.max(this.target - Date.now(), 0);
if (this.diff === 0) {
this.stopTimer();
this.nzCountdownFinish.emit();
}
};
NzCountdownComponent.decorators = [
{ type: Component, args: [{
changeDetection: ChangeDetectionStrategy.OnPush,
encapsulation: ViewEncapsulation.None,
selector: 'nz-countdown',
exportAs: 'nzCountdown',
template: "\n <nz-statistic\n [nzValue]=\"diff\"\n [nzValueStyle]=\"nzValueStyle\"\n [nzValueTemplate]=\"nzValueTemplate || countDownTpl\"\n [nzTitle]=\"nzTitle\"\n [nzPrefix]=\"nzPrefix\"\n [nzSuffix]=\"nzSuffix\"\n >\n </nz-statistic>\n\n <ng-template #countDownTpl>{{ diff | nzTimeRange: nzFormat }}</ng-template>\n "
}] }
];
/** @nocollapse */
NzCountdownComponent.ctorParameters = function () { return [
{ type: ChangeDetectorRef },
{ type: NgZone },
{ type: Platform }
]; };
NzCountdownComponent.propDecorators = {
nzFormat: [{ type: Input }],
nzCountdownFinish: [{ type: Output }]
};
return NzCountdownComponent;
}(NzStatisticComponent));
if (false) {
/** @type {?} */
NzCountdownComponent.prototype.nzFormat;
/** @type {?} */
NzCountdownComponent.prototype.nzCountdownFinish;
/** @type {?} */
NzCountdownComponent.prototype.diff;
/**
* @type {?}
* @private
*/
NzCountdownComponent.prototype.target;
/**
* @type {?}
* @private
*/
NzCountdownComponent.prototype.updater_;
/**
* @type {?}
* @private
*/
NzCountdownComponent.prototype.cdr;
/**
* @type {?}
* @private
*/
NzCountdownComponent.prototype.ngZone;
/**
* @type {?}
* @private
*/
NzCountdownComponent.prototype.platform;
}
/**
* @fileoverview added by tsickle
* Generated from: statistic-number.component.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var NzStatisticNumberComponent = /** @class */ (function () {
function NzStatisticNumberComponent(locale_id) {
this.locale_id = locale_id;
this.displayInt = '';
this.displayDecimal = '';
}
/**
* @return {?}
*/
NzStatisticNumberComponent.prototype.ngOnChanges = /**
* @return {?}
*/
function () {
this.formatNumber();
};
/**
* @private
* @return {?}
*/
NzStatisticNumberComponent.prototype.formatNumber = /**
* @private
* @return {?}
*/
function () {
/** @type {?} */
var decimalSeparator = typeof this.nzValue === 'number' ? '.' : getLocaleNumberSymbol(this.locale_id, NumberSymbol.Decimal);
/** @type {?} */
var value = String(this.nzValue);
var _a = __read(value.split(decimalSeparator), 2), int = _a[0], decimal = _a[1];
this.displayInt = int;
this.displayDecimal = decimal ? "" + decimalSeparator + decimal : '';
};
NzStatisticNumberComponent.decorators = [
{ type: Component, args: [{
changeDetection: ChangeDetectionStrategy.OnPush,
encapsulation: ViewEncapsulation.None,
preserveWhitespaces: false,
selector: 'nz-statistic-number',
exportAs: 'nzStatisticNumber',
template: "\n <span class=\"ant-statistic-content-value\">\n <ng-container *ngIf=\"nzValueTemplate\" [ngTemplateOutlet]=\"nzValueTemplate\" [ngTemplateOutletContext]=\"{ $implicit: nzValue }\">\n </ng-container>\n <ng-container *ngIf=\"!nzValueTemplate\">\n <span *ngIf=\"displayInt\" class=\"ant-statistic-content-value-int\">{{ displayInt }}</span>\n <span *ngIf=\"displayDecimal\" class=\"ant-statistic-content-value-decimal\">{{ displayDecimal }}</span>\n </ng-container>\n </span>\n "
}] }
];
/** @nocollapse */
NzStatisticNumberComponent.ctorParameters = function () { return [
{ type: String, decorators: [{ type: Inject, args: [LOCALE_ID,] }] }
]; };
NzStatisticNumberComponent.propDecorators = {
nzValue: [{ type: Input }],
nzValueTemplate: [{ type: Input }]
};
return NzStatisticNumberComponent;
}());
if (false) {
/** @type {?} */
NzStatisticNumberComponent.prototype.nzValue;
/** @type {?} */
NzStatisticNumberComponent.prototype.nzValueTemplate;
/** @type {?} */
NzStatisticNumberComponent.prototype.displayInt;
/** @type {?} */
NzStatisticNumberComponent.prototype.displayDecimal;
/**
* @type {?}
* @private
*/
NzStatisticNumberComponent.prototype.locale_id;
}
/**
* @fileoverview added by tsickle
* Generated from: statistic.module.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var NzStatisticModule = /** @class */ (function () {
function NzStatisticModule() {
}
NzStatisticModule.decorators = [
{ type: NgModule, args: [{
imports: [CommonModule, PlatformModule, NzOutletModule, NzPipesModule],
declarations: [NzStatisticComponent, NzCountdownComponent, NzStatisticNumberComponent],
exports: [NzStatisticComponent, NzCountdownComponent, NzStatisticNumberComponent]
},] }
];
return NzStatisticModule;
}());
/**
* @fileoverview added by tsickle
* Generated from: public-api.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @fileoverview added by tsickle
* Generated from: ng-zorro-antd-statistic.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
export { NzCountdownComponent, NzStatisticComponent, NzStatisticModule, NzStatisticNumberComponent };
//# sourceMappingURL=ng-zorro-antd-statistic.js.map