ng-cw-v12/fesm2015/ng-cw-v12-wave-progress.js

Angular UI component library

import * as i0 from '@angular/core';
import { Component, Input, NgModule } from '@angular/core';
import * as i1 from '@angular/common';
import { CommonModule } from '@angular/common';

class WaveProgressComponent {
    constructor(eleRef) {
        this.eleRef = eleRef;
        this.ncWidth = 132;
        this.ncBorderColor = '#1890ff';
        this.ncColor = '#000000d9';
        this.ncWaveColor = '#74bcff';
        this.showInfoMode = true;
        this.ncSpeed = 'default';
        this.percent = 0;
        this.borderWidth = 5; //计算
        this.fontSize = 32; //计算
        this.speedType = {
            veryFast: 2,
            fast: 4,
            default: 6,
            slow: 8,
            verySlow: 10
        };
    }
    set ncPercent(value) {
        this.percent = value;
        setTimeout(() => {
            //加延迟，防止其他传入参数未获取到
            this.setTop();
        });
    }
    ;
    set ncShowInfo(value) {
        this.showInfoMode = value !== null && value !== undefined && value !== false && value !== 'false';
    }
    ngOnInit() {
    }
    setTop() {
        this.eleRef.nativeElement.querySelector('.wave').style.top = `${this.ncWidth * (1 - this.percent / 100)}px`;
        this.fontSize = Math.round(this.ncWidth * 0.24);
        this.borderWidth = Math.round(this.ncWidth * 0.038);
    }
}
WaveProgressComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: WaveProgressComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
WaveProgressComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.5", type: WaveProgressComponent, selector: "nc-wave-progress", inputs: { ncPercent: "ncPercent", ncWidth: "ncWidth", ncBorderColor: "ncBorderColor", ncColor: "ncColor", ncWaveColor: "ncWaveColor", ncShowInfo: "ncShowInfo", ncSpeed: "ncSpeed" }, ngImport: i0, template: "<div class=\"main\"\r\n    [ngStyle]=\"{'width': ncWidth + 'px', 'border-width': borderWidth + 'px', 'border-color': ncBorderColor}\">\r\n    <div class=\"main-number\" *ngIf=\"showInfoMode\" [ngStyle]=\"{'color': ncColor, 'fontSize': fontSize + 'px'}\">{{percent}}%\r\n    </div>\r\n    <div class=\"wave\"\r\n        [ngStyle]=\"{'width': ncWidth * 2 + 'px', 'top': ncWidth + 'px', 'background-color': ncWaveColor, 'animation-duration': speedType[ncSpeed] +'s'}\">\r\n    </div>\r\n</div>", styles: [".main{position:relative;aspect-ratio:1;border-radius:50%;background:#fff;display:flex;justify-content:center;align-items:center;overflow:hidden;border-style:solid}.main .main-number{z-index:1;-webkit-user-select:none;user-select:none}@keyframes rotateAnimation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.wave{position:absolute;aspect-ratio:1;border-radius:40%;animation-iteration-count:infinite;animation-timing-function:linear;animation-name:rotateAnimation}\n"], directives: [{ type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: WaveProgressComponent, decorators: [{
            type: Component,
            args: [{
                    selector: 'nc-wave-progress',
                    templateUrl: './wave-progress.component.html',
                    styleUrls: ['./wave-progress.component.less']
                }]
        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { ncPercent: [{
                type: Input
            }], ncWidth: [{
                type: Input
            }], ncBorderColor: [{
                type: Input
            }], ncColor: [{
                type: Input
            }], ncWaveColor: [{
                type: Input
            }], ncShowInfo: [{
                type: Input
            }], ncSpeed: [{
                type: Input
            }] } });

class NcWaveProgressModule {
}
NcWaveProgressModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: NcWaveProgressModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
NcWaveProgressModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: NcWaveProgressModule, declarations: [WaveProgressComponent], imports: [CommonModule], exports: [WaveProgressComponent] });
NcWaveProgressModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: NcWaveProgressModule, imports: [[
            CommonModule
        ]] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: NcWaveProgressModule, decorators: [{
            type: NgModule,
            args: [{
                    declarations: [
                        WaveProgressComponent
                    ],
                    imports: [
                        CommonModule
                    ],
                    exports: [
                        WaveProgressComponent
                    ]
                }]
        }] });

/**
 * Generated bundle index. Do not edit.
 */

export { NcWaveProgressModule, WaveProgressComponent };
//# sourceMappingURL=ng-cw-v12-wave-progress.js.map