仅桌面端保证样式
Progress 进度条
展示操作或任务的当前进度，支持线性（line）与环形（circle / dashboard）两种形态。内置 success / warning / exception 状态色，也可通过 color 自定义；percentage 超出 0-100 会自动截断，数值变化按 duration 秒平滑过渡。
基础用法
percentage 接受 0-100 的数字；status 指定状态后进度条与文字切换为语义色（success 绿 / warning 橙 / exception 红）。
20%
60%
80%
45%
35%
内显文字与加粗轨道
text-inside 把百分比文字放进进度条内部，需要配合较大的 stroke-width（line 形态下 stroke-width 是轨道高度）才有足够空间。
环形进度与仪表盘
type="circle" 渲染环形进度（width 控制直径，stroke-width 控制线条粗细），type="dashboard" 渲染 270 度仪表盘形态；color 传字符串固定颜色。
25%
70%
55%
动态进度
进度值变化时按 duration（默认 0.3 秒）平滑过渡，适合上传、轮询等场景。
自定义颜色
color 传函数时入参为当前百分比，返回颜色值，可实现分段变色；传字符串则全程固定颜色。
30%
30%
自定义文字
#text 插槽替换右侧百分比文字，作用域插槽入参为 { percentage }。
已上传 6/6 个文件
使用提示
- circle / dashboard 形态下
stroke-width是相对直径的线条宽度，调大width时同步调大线条更协调； status与color同时提供时，color优先；- 环形文字同样支持
#text插槽，常用于将百分比替换为分数、件数等业务语义。
API
Progress Props
| 参数 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| percentage | 进度百分比，超出 0-100 自动截断 | number | 0 |
| type | 形态 | line | circle | dashboard | line |
| stroke-width | 进度条粗细（px），line 为轨道高度，circle 为线条宽度（缺省 6） | number | — |
| status | 状态，决定进度条与文字配色 | success | warning | exception | — |
| show-text | 是否显示百分比文字 | boolean | true |
| text-inside | 文字显示在进度条内部（仅 line） | boolean | false |
| width | circle / dashboard 直径（px） | number | 126 |
| color | 进度条颜色，函数入参为当前百分比；缺省按 status 取语义色 | string | (percentage) => string | — |
| duration | 进度变化的过渡时长（秒） | number | 0.3 |
Slots
| 参数 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| text | 自定义右侧文字内容（show-text 且非 text-inside 时渲染） | { percentage: number } | — |