mirror of https://github.com/ElemeFE/element
Progress: add strokeLinecap prop (#17552)
* Progress: add strokeLinecap prop * update docspull/17926/head
parent
42e74d1d65
commit
0c31a0a48b
|
@ -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 | — | '' |
|
| color | background color of progress bar. Overrides `status` prop | string/function/array | — | '' |
|
||||||
| width | the canvas width of circle progress bar | number | — | 126 |
|
| width | the canvas width of circle progress bar | number | — | 126 |
|
||||||
| show-text | whether to show percentage | boolean | — | true |
|
| show-text | whether to show percentage | boolean | — | true |
|
||||||
|
| stroke-linecap | circle/dashboard type shape at the end path | string | butt/round/square | round |
|
|
@ -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 | — | '' |
|
| 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 |
|
| width | ancho del canvas que contiene la barra de progreso circula | number | — | 126 |
|
||||||
| show-text | mostrar porcentaje | boolean | — | true |
|
| show-text | mostrar porcentaje | boolean | — | true |
|
||||||
|
| stroke-linecap | circle/dashboard type shape at the end path | string | butt/round/square | round |
|
|
@ -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 | — | '' |
|
| 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 |
|
| width | La largeur du canvas dans le cas d'une barre circulaire. | number | — | 126 |
|
||||||
| show-text | Si le pourcentage doit être affiché. | boolean | — | true |
|
| 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 |
|
|
@ -174,3 +174,4 @@ Progress 组件可通过 `type` 属性来指定使用环形进度条,在环形
|
||||||
| color | 进度条背景色(会覆盖 status 状态颜色) | string/function/array | — | '' |
|
| color | 进度条背景色(会覆盖 status 状态颜色) | string/function/array | — | '' |
|
||||||
| width | 环形进度条画布宽度(只在 type 为 circle 或 dashboard 时可用) | number | | 126 |
|
| width | 环形进度条画布宽度(只在 type 为 circle 或 dashboard 时可用) | number | | 126 |
|
||||||
| show-text | 是否显示进度条文字内容 | boolean | — | true |
|
| show-text | 是否显示进度条文字内容 | boolean | — | true |
|
||||||
|
| stroke-linecap | circle/dashboard 类型路径两端的形状 | string | butt/round/square | round |
|
|
@ -35,7 +35,7 @@
|
||||||
:d="trackPath"
|
:d="trackPath"
|
||||||
:stroke="stroke"
|
:stroke="stroke"
|
||||||
fill="none"
|
fill="none"
|
||||||
stroke-linecap="round"
|
:stroke-linecap="strokeLinecap"
|
||||||
:stroke-width="percentage ? relativeStrokeWidth : 0"
|
:stroke-width="percentage ? relativeStrokeWidth : 0"
|
||||||
:style="circlePathStyle"></path>
|
:style="circlePathStyle"></path>
|
||||||
</svg>
|
</svg>
|
||||||
|
@ -73,6 +73,10 @@
|
||||||
type: Number,
|
type: Number,
|
||||||
default: 6
|
default: 6
|
||||||
},
|
},
|
||||||
|
strokeLinecap: {
|
||||||
|
type: String,
|
||||||
|
default: 'round'
|
||||||
|
},
|
||||||
textInside: {
|
textInside: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false
|
default: false
|
||||||
|
|
|
@ -14,6 +14,9 @@ export declare class ElProgress extends ElementUIComponent {
|
||||||
/** The width of progress bar */
|
/** The width of progress bar */
|
||||||
strokeWidth: number
|
strokeWidth: number
|
||||||
|
|
||||||
|
/** Circle progress bar stroke line cap */
|
||||||
|
strokeLinecap: string
|
||||||
|
|
||||||
/** Whether to place the percentage inside progress bar, only works when type is 'line' */
|
/** Whether to place the percentage inside progress bar, only works when type is 'line' */
|
||||||
textInside: boolean
|
textInside: boolean
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue