diff --git a/examples/docs/en-US/progress.md b/examples/docs/en-US/progress.md index 9ead51ffe..c8b552ee6 100644 --- a/examples/docs/en-US/progress.md +++ b/examples/docs/en-US/progress.md @@ -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 | \ No newline at end of file diff --git a/examples/docs/es/progress.md b/examples/docs/es/progress.md index 9ff5eef39..7b7c2f312 100644 --- a/examples/docs/es/progress.md +++ b/examples/docs/es/progress.md @@ -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 | \ No newline at end of file diff --git a/examples/docs/fr-FR/progress.md b/examples/docs/fr-FR/progress.md index d6dc904ba..b7bf96ecb 100644 --- a/examples/docs/fr-FR/progress.md +++ b/examples/docs/fr-FR/progress.md @@ -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 | \ No newline at end of file diff --git a/examples/docs/zh-CN/progress.md b/examples/docs/zh-CN/progress.md index b47a95c82..b2ac24897 100644 --- a/examples/docs/zh-CN/progress.md +++ b/examples/docs/zh-CN/progress.md @@ -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 | \ No newline at end of file diff --git a/packages/progress/src/progress.vue b/packages/progress/src/progress.vue index 488d54b2a..103dff62a 100644 --- a/packages/progress/src/progress.vue +++ b/packages/progress/src/progress.vue @@ -35,7 +35,7 @@ :d="trackPath" :stroke="stroke" fill="none" - stroke-linecap="round" + :stroke-linecap="strokeLinecap" :stroke-width="percentage ? relativeStrokeWidth : 0" :style="circlePathStyle"> @@ -73,6 +73,10 @@ type: Number, default: 6 }, + strokeLinecap: { + type: String, + default: 'round' + }, textInside: { type: Boolean, default: false diff --git a/types/progress.d.ts b/types/progress.d.ts index 0831514d5..780a8d4ff 100644 --- a/types/progress.d.ts +++ b/types/progress.d.ts @@ -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