@@ -147,7 +147,7 @@ exports = module.exports = __webpack_require__(4)();
147
147
148
148
149
149
// module
150
- exports . push ( [ module . i , ".vue-simple-progress-bar{transition:all .3s linear}" , "" ] ) ;
150
+ exports . push ( [ module . i , ".vue-simple-progress-bar{transition:all .15s linear}" , "" ] ) ;
151
151
152
152
// exports
153
153
@@ -538,18 +538,17 @@ var isNumber = function isNumber(n) {
538
538
exports . default = {
539
539
name : 'vue-simple-progress' ,
540
540
props : {
541
- 'size ' : {
542
- default : 32
541
+ 'pct ' : {
542
+ default : 0
543
543
} ,
544
- 'line-size' : {
545
- type : Number ,
546
- default : 3
544
+ 'size' : {
545
+ default : 'tiny'
547
546
} ,
548
- 'line- bg-color' : {
547
+ 'bg-color' : {
549
548
type : String ,
550
549
default : '#eee'
551
550
} ,
552
- 'line-fg -color' : {
551
+ 'bar -color' : {
553
552
type : String ,
554
553
default : '#2196f3' } ,
555
554
'text' : {
@@ -569,56 +568,22 @@ exports.default = {
569
568
size_px : function size_px ( ) {
570
569
switch ( this . size ) {
571
570
case 'tiny' :
572
- return 12 ;
573
- case 'small' :
574
- return 16 ;
575
- case 'medium' :
576
- return 32 ;
577
- case 'large' :
578
- return 48 ;
579
- case 'big' :
580
- return 64 ;
581
- case 'huge' :
582
- return 96 ;
583
- case 'massive' :
584
- return 128 ;
585
- }
586
-
587
- return isNumber ( this . size ) ? this . size : 32 ;
588
- } ,
589
- line_size_px : function line_size_px ( ) {
590
- switch ( this . size ) {
591
- case 'tiny' :
592
- return 1 ;
593
- case 'small' :
594
571
return 2 ;
595
- case 'medium' :
596
- return 3 ;
597
- case 'large' :
598
- return 3 ;
599
- case 'big' :
600
- return 4 ;
601
- case 'huge' :
602
- return 4 ;
603
- case 'massive' :
604
- return 5 ;
605
- }
606
-
607
- return isNumber ( this . lineSize ) ? this . lineSize : 4 ;
608
- } ,
609
- text_margin_top : function text_margin_top ( ) {
610
- switch ( this . size ) {
611
- case 'tiny' :
612
572
case 'small' :
573
+ return 4 ;
613
574
case 'medium' :
575
+ return 8 ;
614
576
case 'large' :
577
+ return 12 ;
615
578
case 'big' :
579
+ return 16 ;
616
580
case 'huge' :
581
+ return 32 ;
617
582
case 'massive' :
618
- return Math . min ( Math . max ( Math . ceil ( this . size_px / 8 ) , 3 ) , 12 ) ;
583
+ return 64 ;
619
584
}
620
585
621
- return isNumber ( this . spacing ) ? this . spacing : 4 ;
586
+ return isNumber ( this . size ) ? this . size : 32 ;
622
587
} ,
623
588
text_font_size : function text_font_size ( ) {
624
589
switch ( this . size ) {
@@ -636,11 +601,13 @@ exports.default = {
636
601
} ,
637
602
progress_style : function progress_style ( ) {
638
603
return {
639
- 'margin' : '0 auto' ,
640
- 'border-radius' : '100%' ,
641
- 'border' : this . line_size_px + 'px solid ' + this . lineBgColor ,
642
- 'border-top' : this . line_size_px + 'px solid ' + this . lineFgColor ,
643
- 'width' : this . size_px + '%' ,
604
+ 'background' : this . bgColor
605
+ } ;
606
+ } ,
607
+ bar_style : function bar_style ( ) {
608
+ return {
609
+ 'background' : this . barColor ,
610
+ 'width' : this . pct + '%' ,
644
611
'height' : this . size_px + 'px'
645
612
} ;
646
613
} ,
@@ -660,12 +627,15 @@ exports.default = {
660
627
661
628
module . exports = { render :function ( ) { var _vm = this ; var _h = _vm . $createElement ; var _c = _vm . _self . _c || _h ;
662
629
return _c ( 'div' , [ _c ( 'div' , {
663
- staticClass : "vue-simple-progress-bar " ,
630
+ staticClass : "vue-simple-progress" ,
664
631
style : ( _vm . progress_style )
665
- } ) , _vm . _v ( " " ) , ( _vm . message . length > 0 ) ? _c ( 'div' , {
632
+ } , [ _c ( 'div' , {
633
+ staticClass : "vue-simple-progress-bar" ,
634
+ style : ( _vm . bar_style )
635
+ } ) , _vm . _v ( " " ) , ( _vm . text . length > 0 ) ? _c ( 'div' , {
666
636
staticClass : "vue-simple-progress-text" ,
667
637
style : ( _vm . text_style )
668
- } , [ _vm . _v ( _vm . _s ( _vm . message ) ) ] ) : _vm . _e ( ) ] )
638
+ } , [ _vm . _v ( _vm . _s ( _vm . text ) ) ] ) : _vm . _e ( ) ] ) ] )
669
639
} , staticRenderFns : [ ] }
670
640
671
641
/***/ } )
0 commit comments