Progress add prop success-percent

src/components/progress/progress.vue

@@ -3,6 +3,7 @@
         <div :class="outerClasses">
             <div :class="innerClasses">
                 <div :class="bgClasses" :style="bgStyle"></div>
+                <div :class="successBgClasses" :style="successBgStyle"></div>
             </div>
         </div>
         <span v-if="!hideInfo" :class="textClasses">
@@ -30,6 +31,10 @@
                 type: Number,
                 default: 0
             },
+            successPercent: {
+                type: Number,
+                default: 0
+            },
             status: {
                 validator (value) {
                     return oneOf(value, ['normal', 'active', 'wrong', 'success']);
@@ -80,6 +85,15 @@
                     height: `${this.strokeWidth}px`
                 };
             },
+            successBgStyle () {
+                return this.vertical ? {
+                    height: `${this.successPercent}%`,
+                    width: `${this.strokeWidth}px`
+                } : {
+                    width: `${this.successPercent}%`,
+                    height: `${this.strokeWidth}px`
+                };
+            },
             wrapClasses () {
                 return [
                     `${prefixCls}`,
@@ -105,6 +119,9 @@
             },
             bgClasses () {
                 return `${prefixCls}-bg`;
+            },
+            successBgClasses () {
+                return `${prefixCls}-success-bg`;
             }
         },
         created () {