Progress: add strokeLinecap prop (#17552)

* Progress: add strokeLinecap prop

* update docs
pull/17926/head
iamkun 2019-10-31 15:08:07 +08:00 committed by Zhi Cun
parent 42e74d1d65
commit 0c31a0a48b
6 changed files with 12 additions and 1 deletions

View File

@ -170,3 +170,4 @@ You also can specify `type` attribute to `dashboard` to use dashboard progress b
| color | background color of progress bar. Overrides `status` prop | string/function/array | — | '' |
| width | the canvas width of circle progress bar | number | — | 126 |
| show-text | whether to show percentage | boolean | — | true |
| stroke-linecap | circle/dashboard type shape at the end path | string | butt/round/square | round |

View File

@ -168,3 +168,4 @@ Puede utilizar el atributo `color` para establecer el color de la barra de progr
| color | color de fondo de la barra de progreso. Sobreescribe la propiedad `status` | string/function/array | — | '' |
| width | ancho del canvas que contiene la barra de progreso circula | number | — | 126 |
| show-text | mostrar porcentaje | boolean | — | true |
| stroke-linecap | circle/dashboard type shape at the end path | string | butt/round/square | round |

View File

@ -171,3 +171,4 @@ Vous pouvez également spécifier l'attribut `type` de `dashboard` pour utiliser
| color | La couleur de fon de la barre. Écrase `status`. | string/function/array | — | '' |
| width | La largeur du canvas dans le cas d'une barre circulaire. | number | — | 126 |
| show-text | Si le pourcentage doit être affiché. | boolean | — | true |
| stroke-linecap | circle/dashboard type shape at the end path | string | butt/round/square | round |

View File

@ -174,3 +174,4 @@ Progress 组件可通过 `type` 属性来指定使用环形进度条,在环形
| color | 进度条背景色(会覆盖 status 状态颜色) | string/function/array | — | '' |
| width | 环形进度条画布宽度(只在 type 为 circle 或 dashboard 时可用) | number | | 126 |
| show-text | 是否显示进度条文字内容 | boolean | — | true |
| stroke-linecap | circle/dashboard 类型路径两端的形状 | string | butt/round/square | round |

View File

@ -35,7 +35,7 @@
:d="trackPath"
:stroke="stroke"
fill="none"
stroke-linecap="round"
:stroke-linecap="strokeLinecap"
:stroke-width="percentage ? relativeStrokeWidth : 0"
:style="circlePathStyle"></path>
</svg>
@ -73,6 +73,10 @@
type: Number,
default: 6
},
strokeLinecap: {
type: String,
default: 'round'
},
textInside: {
type: Boolean,
default: false

3
types/progress.d.ts vendored
View File

@ -14,6 +14,9 @@ export declare class ElProgress extends ElementUIComponent {
/** The width of progress bar */
strokeWidth: number
/** Circle progress bar stroke line cap */
strokeLinecap: string
/** Whether to place the percentage inside progress bar, only works when type is 'line' */
textInside: boolean