[{"__symbolic":"module","version":3,"metadata":{"ZrProgressComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"zr-progress","template":"\n  <div *ngIf=\"type==='line'\" class=\"lz-progress\">\n    <div class=\"lz-progress-bar\">\n      <div class=\"lz-progress-bar__outer\" [ngStyle]=\"{'height':setLineHeight()}\">\n        <div class=\"lz-progress-bar__inner\" [ngStyle]=\"{'background-color':setBackGround(),'width': progress + '%'}\">\n          <div *ngIf=\"textInside==='inside'&&textShow===true\" [ngStyle]=\"{'color':'#fff'}\" class=\"lz-progress__text\">{{progress}}%</div>\n        </div>\n      </div>\n    </div>\n    <div *ngIf=\"textInside==='outside'\" [ngStyle]=\"{'color':'#5a5e66'}\" class=\"lz-progress__text\">\n      <span *ngIf=\"progress!==100&&textShow===true\">{{progress}}%</span>\n      <i *ngIf=\"progress===100\" [ngStyle]=\"{'color':'#67C23A'}\" class=\"la la-check-circle\"></i>\n    </div>\n  </div>\n\n  <div *ngIf=\"type==='circle'\" class=\"lz-progress text-center\" [ngStyle]=\"{'margin':'auto','width':setWidth(),'height':setWidth()}\">\n    <svg viewBox=\"0 0 100 100\">\n      <path fill=\"none\" stroke=\"#e5e9f2\" d=\"M 50 50 m 0 -47 a 47 47 0 1 1 0 94 a 47 47 0 1 1 0 -94\"\n        stroke-width=\"4.8\"></path>\n      <path class=\"lz-circle__inner\" fill=\"none\" stroke-linecap=\"round\" d=\"M 50 50 m 0 -47 a 47 47 0 1 1 0 94 a 47 47 0 1 1 0 -94\"\n        stroke-width=\"4.8\" [ngStyle]=\"{'stroke-dashoffset': setCircleProgress(),'stroke': setStrokeColor()}\"></path>\n    </svg>\n    <div class=\"lz-circle-progress__text\">\n        <span *ngIf=\"progress!==100&&status!=='exception'\">{{progress}}%</span>\n        <i *ngIf=\"progress===100\" [ngStyle]=\"{'color':'#67C23A'}\" class=\"la la-check\"></i>\n        <i *ngIf=\"status==='exception'\" [ngStyle]=\"{'color':'#FF4949'}\" class=\"la la-close\"></i>\n    </div>\n  </div>\n","styles":["\n      .lz-progress {\n        position: relative;\n        line-height: 1;\n      }\n\n      .lz-progress-bar {\n        display: inline-block;\n        vertical-align: middle;\n        padding-right: 50px;\n        width: 100%;\n        margin-right: -55px;\n        box-sizing: border-box;\n      }\n\n      .lz-progress-bar__outer {\n        position: relative;\n        border-radius: 100px;\n        background-color: #e6ebf5;\n        overflow: hidden;\n        vertical-align: middle;\n      }\n\n      .lz-progress-bar__inner {\n        position: absolute;\n        left: 0;\n        top: 0;\n        width: 20%;\n        height: 100%;\n        text-align: right;\n        border-radius: 100px;\n        line-height: 1;\n      }\n\n      .lz-progress__text {\n        font-size: 14px;\n        display: inline-block;\n        vertical-align: middle;\n        margin-left: 10px;\n        line-height: 1;\n      }\n\n      .lz-progress-bar__inner:after {\n        content: '';\n        display: inline-block;\n        vertical-align: middle;\n        height: 100%;\n      }\n\n      .lz-circle__inner {\n        stroke-dasharray: 299.08px, 299.08px;\n        transition: stroke-dashoffset 0.6s ease 0s, stroke 0.6s ease;\n      }\n\n      .lz-circle-progress__text {\n        position: absolute;\n        top: 50%;\n        left: 0;\n        width: 100%;\n        text-align: center;\n        margin: 0;\n        transform: translateY(-50%);\n      }\n    "]}]}],"members":{"progress":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"type":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"lineHeight":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"textInside":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"backGround":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"textShow":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"width":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"status":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"setLineHeight":[{"__symbolic":"method"}],"setBackGround":[{"__symbolic":"method"}],"setWidth":[{"__symbolic":"method"}],"setCircleProgress":[{"__symbolic":"method"}],"setStrokeColor":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"ZrProgressComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"zr-progress","template":"\n  <div *ngIf=\"type==='line'\" class=\"lz-progress\">\n    <div class=\"lz-progress-bar\">\n      <div class=\"lz-progress-bar__outer\" [ngStyle]=\"{'height':setLineHeight()}\">\n        <div class=\"lz-progress-bar__inner\" [ngStyle]=\"{'background-color':setBackGround(),'width': progress + '%'}\">\n          <div *ngIf=\"textInside==='inside'&&textShow===true\" [ngStyle]=\"{'color':'#fff'}\" class=\"lz-progress__text\">{{progress}}%</div>\n        </div>\n      </div>\n    </div>\n    <div *ngIf=\"textInside==='outside'\" [ngStyle]=\"{'color':'#5a5e66'}\" class=\"lz-progress__text\">\n      <span *ngIf=\"progress!==100&&textShow===true\">{{progress}}%</span>\n      <i *ngIf=\"progress===100\" [ngStyle]=\"{'color':'#67C23A'}\" class=\"la la-check-circle\"></i>\n    </div>\n  </div>\n\n  <div *ngIf=\"type==='circle'\" class=\"lz-progress text-center\" [ngStyle]=\"{'margin':'auto','width':setWidth(),'height':setWidth()}\">\n    <svg viewBox=\"0 0 100 100\">\n      <path fill=\"none\" stroke=\"#e5e9f2\" d=\"M 50 50 m 0 -47 a 47 47 0 1 1 0 94 a 47 47 0 1 1 0 -94\"\n        stroke-width=\"4.8\"></path>\n      <path class=\"lz-circle__inner\" fill=\"none\" stroke-linecap=\"round\" d=\"M 50 50 m 0 -47 a 47 47 0 1 1 0 94 a 47 47 0 1 1 0 -94\"\n        stroke-width=\"4.8\" [ngStyle]=\"{'stroke-dashoffset': setCircleProgress(),'stroke': setStrokeColor()}\"></path>\n    </svg>\n    <div class=\"lz-circle-progress__text\">\n        <span *ngIf=\"progress!==100&&status!=='exception'\">{{progress}}%</span>\n        <i *ngIf=\"progress===100\" [ngStyle]=\"{'color':'#67C23A'}\" class=\"la la-check\"></i>\n        <i *ngIf=\"status==='exception'\" [ngStyle]=\"{'color':'#FF4949'}\" class=\"la la-close\"></i>\n    </div>\n  </div>\n","styles":["\n      .lz-progress {\n        position: relative;\n        line-height: 1;\n      }\n\n      .lz-progress-bar {\n        display: inline-block;\n        vertical-align: middle;\n        padding-right: 50px;\n        width: 100%;\n        margin-right: -55px;\n        box-sizing: border-box;\n      }\n\n      .lz-progress-bar__outer {\n        position: relative;\n        border-radius: 100px;\n        background-color: #e6ebf5;\n        overflow: hidden;\n        vertical-align: middle;\n      }\n\n      .lz-progress-bar__inner {\n        position: absolute;\n        left: 0;\n        top: 0;\n        width: 20%;\n        height: 100%;\n        text-align: right;\n        border-radius: 100px;\n        line-height: 1;\n      }\n\n      .lz-progress__text {\n        font-size: 14px;\n        display: inline-block;\n        vertical-align: middle;\n        margin-left: 10px;\n        line-height: 1;\n      }\n\n      .lz-progress-bar__inner:after {\n        content: '';\n        display: inline-block;\n        vertical-align: middle;\n        height: 100%;\n      }\n\n      .lz-circle__inner {\n        stroke-dasharray: 299.08px, 299.08px;\n        transition: stroke-dashoffset 0.6s ease 0s, stroke 0.6s ease;\n      }\n\n      .lz-circle-progress__text {\n        position: absolute;\n        top: 50%;\n        left: 0;\n        width: 100%;\n        text-align: center;\n        margin: 0;\n        transform: translateY(-50%);\n      }\n    "]}]}],"members":{"progress":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"type":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"lineHeight":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"textInside":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"backGround":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"textShow":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"width":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"status":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"setLineHeight":[{"__symbolic":"method"}],"setBackGround":[{"__symbolic":"method"}],"setWidth":[{"__symbolic":"method"}],"setCircleProgress":[{"__symbolic":"method"}],"setStrokeColor":[{"__symbolic":"method"}]}}}}]