ng-zorro-antd-mobile
Version:
An enterprise-class mobile UI components based on Ant Design and Angular
116 lines • 13.4 kB
JavaScript
import { Component, Input, ContentChildren, QueryList, HostBinding, Renderer2, ElementRef } from '@angular/core';
import { StepStatusEnum, StepDirectionEnum } from './step/step.component';
import { StepComponent } from './step/step.component';
import * as i0 from "@angular/core";
export class StepsComponent {
set current(value) {
if (value >= 0) {
this._current = value;
if (this.stepItems) {
this.setStepStyle();
}
}
}
set size(value) {
this._size = value;
this.setCls();
}
set status(value) {
this._status = value;
if (this.stepItems) {
this.setStepStyle();
}
}
set direction(value) {
this._direction = value;
this.setCls();
}
constructor(_elf, _render) {
this._elf = _elf;
this._render = _render;
this.prefixCls = 'am-steps';
this._current = 0;
this._status = StepStatusEnum.PROCESS;
this._direction = StepDirectionEnum.VERTICAL;
this.clsSteps = true;
}
setStepStyle() {
const itemCount = this.stepItems.length;
const itemArr = this.stepItems['_results'];
for (let index = 0; index < itemCount; index++) {
const step = itemArr[index];
step.stepNumber = index + 1;
step.outStatus = this._status;
step.currentIndex = this._current + 1;
step.iconSize = this._size === 'small' ? (this._status === StepStatusEnum.WAIT ? 'xxs' : 'xs') : 'md';
if (index < itemCount - 1 && itemArr[index + 1].status === StepStatusEnum.ERROR) {
step.stepItemCls = step.stepItemCls
? Object.assign(step.stepItemCls, { 'error-tail': true })
: { 'error-tail': true };
}
}
}
setCls() {
if (this._direction === StepDirectionEnum.HORIZONTAL) {
this.clsStepsLabelVtl = true;
this.clsStepsHztl = true;
this.clsStepsVtl = false;
}
else if (this._direction === StepDirectionEnum.VERTICAL) {
this.clsStepsVtl = true;
this.clsStepsHztl = false;
}
if (this._size === 'small') {
this.clsStepsSmall = true;
}
else {
this.clsStepsSmall = false;
}
}
ngOnInit() {
this.setCls();
}
ngAfterContentInit() {
setTimeout(() => {
this.setStepStyle();
}, 0);
this.stepItems.changes.subscribe(change => {
setTimeout(() => {
this.setStepStyle();
}, 0);
});
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: StepsComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: StepsComponent, selector: "Steps,nzm-steps", inputs: { current: "current", size: "size", status: "status", direction: "direction" }, host: { properties: { "class.am-steps": "this.clsSteps", "class.am-steps-small": "this.clsStepsSmall", "class.am-steps-label-vertical": "this.clsStepsLabelVtl", "class.am-steps-vertical": "this.clsStepsVtl", "class.am-steps-horizontal": "this.clsStepsHztl" } }, queries: [{ propertyName: "stepItems", predicate: StepComponent }], ngImport: i0, template: "<ng-content></ng-content>\n" }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: StepsComponent, decorators: [{
type: Component,
args: [{ selector: 'Steps,nzm-steps', template: "<ng-content></ng-content>\n" }]
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }], propDecorators: { stepItems: [{
type: ContentChildren,
args: [StepComponent]
}], current: [{
type: Input
}], size: [{
type: Input
}], status: [{
type: Input
}], direction: [{
type: Input
}], clsSteps: [{
type: HostBinding,
args: ['class.am-steps']
}], clsStepsSmall: [{
type: HostBinding,
args: ['class.am-steps-small']
}], clsStepsLabelVtl: [{
type: HostBinding,
args: ['class.am-steps-label-vertical']
}], clsStepsVtl: [{
type: HostBinding,
args: ['class.am-steps-vertical']
}], clsStepsHztl: [{
type: HostBinding,
args: ['class.am-steps-horizontal']
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3RlcHMuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9zdGVwcy9zdGVwcy5jb21wb25lbnQudHMiLCIuLi8uLi8uLi9jb21wb25lbnRzL3N0ZXBzL3N0ZXBzLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCxTQUFTLEVBRVQsS0FBSyxFQUNMLGVBQWUsRUFDZixTQUFTLEVBRVQsV0FBVyxFQUNYLFNBQVMsRUFDVCxVQUFVLEVBQ1gsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFFLGNBQWMsRUFBRSxpQkFBaUIsRUFBRSxNQUFNLHVCQUF1QixDQUFDO0FBQzFFLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSx1QkFBdUIsQ0FBQzs7QUFNdEQsTUFBTSxPQUFPLGNBQWM7SUFXekIsSUFDSSxPQUFPLENBQUMsS0FBSztRQUNmLElBQUksS0FBSyxJQUFJLENBQUMsRUFBRTtZQUNkLElBQUksQ0FBQyxRQUFRLEdBQUcsS0FBSyxDQUFDO1lBQ3RCLElBQUksSUFBSSxDQUFDLFNBQVMsRUFBRTtnQkFDbEIsSUFBSSxDQUFDLFlBQVksRUFBRSxDQUFDO2FBQ3JCO1NBQ0Y7SUFDSCxDQUFDO0lBQ0QsSUFDSSxJQUFJLENBQUMsS0FBSztRQUNaLElBQUksQ0FBQyxLQUFLLEdBQUcsS0FBSyxDQUFDO1FBQ25CLElBQUksQ0FBQyxNQUFNLEVBQUUsQ0FBQztJQUNoQixDQUFDO0lBQ0QsSUFDSSxNQUFNLENBQUMsS0FBcUI7UUFDOUIsSUFBSSxDQUFDLE9BQU8sR0FBRyxLQUFLLENBQUM7UUFDckIsSUFBSSxJQUFJLENBQUMsU0FBUyxFQUFFO1lBQ2xCLElBQUksQ0FBQyxZQUFZLEVBQUUsQ0FBQztTQUNyQjtJQUNILENBQUM7SUFDRCxJQUNJLFNBQVMsQ0FBQyxLQUF3QjtRQUNwQyxJQUFJLENBQUMsVUFBVSxHQUFHLEtBQUssQ0FBQztRQUN4QixJQUFJLENB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QVUsQ0FBQyxHQUFHLEVBQUU7Z0JBQ2QsSUFBSSxDQUFDLFlBQVksRUFBRSxDQUFDO1lBQ3RCLENBQUMsRUFBRSxDQUFDLENBQUMsQ0FBQztRQUNSLENBQUMsQ0FBQyxDQUFDO0lBQ0wsQ0FBQzs4R0FqR1UsY0FBYztrR0FBZCxjQUFjLCthQVFSLGFBQWEsNkJDMUJoQyw2QkFDQTs7MkZEaUJhLGNBQWM7a0JBSjFCLFNBQVM7K0JBQ0UsaUJBQWlCO3VHQVkzQixTQUFTO3NCQURSLGVBQWU7dUJBQUMsYUFBYTtnQkFJMUIsT0FBTztzQkFEVixLQUFLO2dCQVVGLElBQUk7c0JBRFAsS0FBSztnQkFNRixNQUFNO3NCQURULEtBQUs7Z0JBUUYsU0FBUztzQkFEWixLQUFLO2dCQU9OLFFBQVE7c0JBRFAsV0FBVzt1QkFBQyxnQkFBZ0I7Z0JBRzdCLGFBQWE7c0JBRFosV0FBVzt1QkFBQyxzQkFBc0I7Z0JBR25DLGdCQUFnQjtzQkFEZixXQUFXO3VCQUFDLCtCQUErQjtnQkFHNUMsV0FBVztzQkFEVixXQUFXO3VCQUFDLHlCQUF5QjtnQkFHdEMsWUFBWTtzQkFEWCxXQUFXO3VCQUFDLDJCQUEyQiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XG4gIENvbXBvbmVudCxcbiAgT25Jbml0LFxuICBJbnB1dCxcbiAgQ29udGVudENoaWxkcmVuLFxuICBRdWVyeUxpc3QsXG4gIEFmdGVyQ29udGVudEluaXQsXG4gIEhvc3RCaW5kaW5nLFxuICBSZW5kZXJlcjIsXG4gIEVsZW1lbnRSZWZcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBTdGVwU3RhdHVzRW51bSwgU3RlcERpcmVjdGlvbkVudW0gfSBmcm9tICcuL3N0ZXAvc3RlcC5jb21wb25lbnQnO1xuaW1wb3J0IHsgU3RlcENvbXBvbmVudCB9IGZyb20gJy4vc3RlcC9zdGVwLmNvbXBvbmVudCc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ1N0ZXBzLG56bS1zdGVwcycsXG4gIHRlbXBsYXRlVXJsOiAnLi9zdGVwcy5jb21wb25lbnQuaHRtbCdcbn0pXG5leHBvcnQgY2xhc3MgU3RlcHNDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQsIEFmdGVyQ29udGVudEluaXQge1xuICBwcmVmaXhDbHM6IHN0cmluZyA9ICdhbS1zdGVwcyc7XG5cbiAgcHJpdmF0ZSBfY3VycmVudDogbnVtYmVyID0gMDtcbiAgcHJpdmF0ZSBfc2l6ZTogc3RyaW5nO1xuICBwcml2YXRlIF9zdGF0dXM6IFN0ZXBTdGF0dXNFbnVtID0gU3RlcFN0YXR1c0VudW0uUFJPQ0VTUztcbiAgcHJpdmF0ZSBfZGlyZWN0aW9uOiBTdGVwRGlyZWN0aW9uRW51bSA9IFN0ZXBEaXJlY3Rpb25FbnVtLlZFUlRJQ0FMO1xuXG4gIEBDb250ZW50Q2hpbGRyZW4oU3RlcENvbXBvbmVudClcbiAgc3RlcEl0ZW1zOiBRdWVyeUxpc3Q8U3RlcENvbXBvbmVudD47XG5cbiAgQElucHV0KClcbiAgc2V0IGN1cnJlbnQodmFsdWUpIHtcbiAgICBpZiAodmFsdWUgPj0gMCkge1xuICAgICAgdGhpcy5fY3VycmVudCA9IHZhbHVlO1xuICAgICAgaWYgKHRoaXMuc3RlcEl0ZW1zKSB7XG4gICAgICAgIHRoaXMuc2V0U3RlcFN0eWxlKCk7XG4gICAgICB9XG4gICAgfVxuICB9XG4gIEBJbnB1dCgpXG4gIHNldCBzaXplKHZhbHVlKSB7XG4gICAgdGhpcy5fc2l6ZSA9IHZhbHVlO1xuICAgIHRoaXMuc2V0Q2xzKCk7XG4gIH1cbiAgQElucHV0KClcbiAgc2V0IHN0YXR1cyh2YWx1ZTogU3RlcFN0YXR1c0VudW0pIHtcbiAgICB0aGlzLl9zdGF0dXMgPSB2YWx1ZTtcbiAgICBpZiAodGhpcy5zdGVwSXRlbXMpIHtcbiAgICAgIHRoaXMuc2V0U3RlcFN0eWxlKCk7XG4gICAgfVxuICB9XG4gIEBJbnB1dCgpXG4gIHNldCBkaXJlY3Rpb24odmFsdWU6IFN0ZXBEaXJlY3Rpb25FbnVtKSB7XG4gICAgdGhpcy5fZGlyZWN0aW9uID0gdmFsdWU7XG4gICAgdGhpcy5zZXRDbHMoKTtcbiAgfVxuXG4gIEBIb3N0QmluZGluZygnY2xhc3MuYW0tc3RlcHMnKVxuICBjbHNTdGVwczogYm9vbGVhbiA9IHRydWU7XG4gIEBIb3N0QmluZGluZygnY2xhc3MuYW0tc3RlcHMtc21hbGwnKVxuICBjbHNTdGVwc1NtYWxsOiBib29sZWFuO1xuICBASG9zdEJpbmRpbmcoJ2NsYXNzLmFtLXN0ZXBzLWxhYmVsLXZlcnRpY2FsJylcbiAgY2xzU3RlcHNMYWJlbFZ0bDogYm9vbGVhbjtcbiAgQEhvc3RCaW5kaW5nKCdjbGFzcy5hbS1zdGVwcy12ZXJ0aWNhbCcpXG4gIGNsc1N0ZXBzVnRsOiBib29sZWFuO1xuICBASG9zdEJpbmRpbmcoJ2NsYXNzLmFtLXN0ZXBzLWhvcml6b250YWwnKVxuICBjbHNTdGVwc0h6dGw6IGJvb2xlYW47XG5cbiAgY29uc3RydWN0b3IocHJpdmF0ZSBfZWxmOiBFbGVtZW50UmVmLCBwcml2YXRlIF9yZW5kZXI6IFJlbmRlcmVyMikgeyB9XG5cbiAgc2V0U3RlcFN0eWxlKCkge1xuICAgIGNvbnN0IGl0ZW1Db3VudCA9IHRoaXMuc3RlcEl0ZW1zLmxlbmd0aDtcbiAgICBjb25zdCBpdGVtQXJyID0gdGhpcy5zdGVwSXRlbXNbJ19yZXN1bHRzJ107XG4gICAgZm9yIChsZXQgaW5kZXggPSAwOyBpbmRleCA8IGl0ZW1Db3VudDsgaW5kZXgrKykge1xuICAgICAgY29uc3Qgc3RlcCA9IGl0ZW1BcnJbaW5kZXhdO1xuICAgICAgc3RlcC5zdGVwTnVtYmVyID0gaW5kZXggKyAxO1xuICAgICAgc3RlcC5vdXRTdGF0dXMgPSB0aGlzLl9zdGF0dXM7XG4gICAgICBzdGVwLmN1cnJlbnRJbmRleCA9IHRoaXMuX2N1cnJlbnQgKyAxO1xuICAgICAgc3RlcC5pY29uU2l6ZSA9IHRoaXMuX3NpemUgPT09ICdzbWFsbCcgPyAodGhpcy5fc3RhdHVzID09PSBTdGVwU3RhdHVzRW51bS5XQUlUID8gJ3h4cycgOiAneHMnKSA6ICdtZCc7XG4gICAgICBpZiAoaW5kZXggPCBpdGVtQ291bnQgLSAxICYmIGl0ZW1BcnJbaW5kZXggKyAxXS5zdGF0dXMgPT09IFN0ZXBTdGF0dXNFbnVtLkVSUk9SKSB7XG4gICAgICAgIHN0ZXAuc3RlcEl0ZW1DbHMgPSBzdGVwLnN0ZXBJdGVtQ2xzXG4gICAgICAgICAgPyBPYmplY3QuYXNzaWduKHN0ZXAuc3RlcEl0ZW1DbHMsIHsgJ2Vycm9yLXRhaWwnOiB0cnVlIH0pXG4gICAgICAgICAgOiB7ICdlcnJvci10YWlsJzogdHJ1ZSB9O1xuICAgICAgfVxuICAgIH1cbiAgfVxuXG4gIHNldENscygpIHtcbiAgICBpZiAodGhpcy5fZGlyZWN0aW9uID09PSBTdGVwRGlyZWN0aW9uRW51bS5IT1JJWk9OVEFMKSB7XG4gICAgICB0aGlzLmNsc1N0ZXBzTGFiZWxWdGwgPSB0cnVlO1xuICAgICAgdGhpcy5jbHNTdGVwc0h6dGwgPSB0cnVlO1xuICAgICAgdGhpcy5jbHNTdGVwc1Z0bCA9IGZhbHNlO1xuICAgIH0gZWxzZSBpZiAodGhpcy5fZGlyZWN0aW9uID09PSBTdGVwRGlyZWN0aW9uRW51bS5WRVJUSUNBTCkge1xuICAgICAgdGhpcy5jbHNTdGVwc1Z0bCA9IHRydWU7XG4gICAgICB0aGlzLmNsc1N0ZXBzSHp0bCA9IGZhbHNlO1xuICAgIH1cbiAgICBpZiAodGhpcy5fc2l6ZSA9PT0gJ3NtYWxsJykge1xuICAgICAgdGhpcy5jbHNTdGVwc1NtYWxsID0gdHJ1ZTtcbiAgICB9IGVsc2Uge1xuICAgICAgdGhpcy5jbHNTdGVwc1NtYWxsID0gZmFsc2U7XG4gICAgfVxuICB9XG5cbiAgbmdPbkluaXQoKSB7XG4gICAgdGhpcy5zZXRDbHMoKTtcbiAgfVxuXG4gIG5nQWZ0ZXJDb250ZW50SW5pdCgpIHtcbiAgICBzZXRUaW1lb3V0KCgpID0+IHtcbiAgICAgIHRoaXMuc2V0U3RlcFN0eWxlKCk7XG4gICAgfSwgMCk7XG4gICAgdGhpcy5zdGVwSXRlbXMuY2hhbmdlcy5zdWJzY3JpYmUoY2hhbmdlID0+IHtcbiAgICAgIHNldFRpbWVvdXQoKCkgPT4ge1xuICAgICAgICB0aGlzLnNldFN0ZXBTdHlsZSgpO1xuICAgICAgfSwgMCk7XG4gICAgfSk7XG4gIH1cblxufVxuIiwiPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PlxuIl19