Skip to content

Commit f547171

Browse files
wangxueliangwangxueliang
committed
docs: fix statistic demo
1 parent 15c645f commit f547171

File tree

5 files changed

+99
-64
lines changed

5 files changed

+99
-64
lines changed

‎components/statistic/demo/card.md

+35-17
Original file line numberDiff line numberDiff line change
@@ -10,23 +10,41 @@ Display statistic data in Card.
1010

1111
```html
1212
<template>
13-
<div>
14-
<a-card style="padding: 30px">
15-
<a-statistic
16-
title="Feedback"
17-
:value="1128"
18-
style="margin-right: 50px"
19-
>
20-
<a-icon slot="prefix" type="like" />
21-
</a-statistic>
22-
<a-statistic
23-
title="Unmerged"
24-
:value="1234567890"
25-
valueClass="demo-class"
26-
>
27-
<span slot="suffix"> / 100</span>
28-
</a-statistic>
29-
</a-card>
13+
<div style="background: #ECECEC; padding: 30px">
14+
<a-row :gutter="16">
15+
<a-col :span="12">
16+
<a-card>
17+
<a-statistic
18+
title="Feedback"
19+
:value="11.28"
20+
:precision="2"
21+
suffix="%"
22+
:valueStyle="{color: '#3f8600'}"
23+
style="margin-right: 50px"
24+
>
25+
<template v-slot:prefix>
26+
<a-icon type="arrow-up" />
27+
</template>
28+
</a-statistic>
29+
</a-card>
30+
</a-col>
31+
<a-col :span="12">
32+
<a-card>
33+
<a-statistic
34+
title="Idle"
35+
:value="9.3"
36+
:precision="2"
37+
suffix="%"
38+
valueClass="demo-class"
39+
:valueStyle="{ color: '#cf1322' }"
40+
>
41+
<template v-slot:prefix>
42+
<a-icon type="arrow-down" />
43+
</template>
44+
</a-statistic>
45+
</a-card>
46+
</a-col>
47+
</a-row>
3048
</div>
3149
</template>
3250
```

‎components/statistic/demo/countdown.md

+26-14
Original file line numberDiff line numberDiff line change
@@ -10,19 +10,31 @@ Countdown component.
1010

1111
```html
1212
<template>
13-
<div>
14-
<a-statistic-countdown
15-
title="Countdown"
16-
:value="deadline"
17-
@finish="onFinish"
18-
style="margin-right: 50px"
19-
/>
20-
<a-statistic-countdown
21-
title="Million Seconds"
22-
:value="deadline"
23-
format="HH:mm:ss:SSS"
24-
/>
25-
</div>
13+
<a-row :gutter="16">
14+
<a-col :span="12">
15+
<a-statistic-countdown
16+
title="Countdown"
17+
:value="deadline"
18+
@finish="onFinish"
19+
style="margin-right: 50px"
20+
/>
21+
</a-col>
22+
<a-col :span="12">
23+
<a-statistic-countdown
24+
title="Million Seconds"
25+
:value="deadline"
26+
format="HH:mm:ss:SSS"
27+
style="margin-right: 50px"
28+
/>
29+
</a-col>
30+
<a-col :span="24" style="margin-top: 32px;">
31+
<a-statistic-countdown
32+
title="Day Level"
33+
:value="deadline"
34+
format="D 天 H 时 m 分 s 秒"
35+
/>
36+
</a-col>
37+
</a-row>
2638
</template>
2739
<script>
2840
export default {
@@ -38,4 +50,4 @@ export default {
3850
},
3951
}
4052
</script>
41-
```
53+
```

‎components/statistic/demo/unit.md

+24-19
Original file line numberDiff line numberDiff line change
@@ -10,24 +10,29 @@ Add unit through `prefix` and `suffix`.
1010

1111
```html
1212
<template>
13-
<div>
14-
<a-statistic
15-
title="Feedback"
16-
:value="11.28"
17-
:precision="2"
18-
suffix="%"
19-
:valueStyle="{color: '#3f8600'}"
20-
style="margin-right: 50px"
21-
>
22-
<a-icon slot="prefix" type="arrow-up" />
23-
</a-statistic>
24-
<a-statistic
25-
title="Unmerged"
26-
:value="78"
27-
valueClass="demo-class"
28-
>
29-
<span slot="suffix"> / 100</span>
30-
</a-statistic>
31-
</div>
13+
<a-row :gutter="16">
14+
<a-col :span="12">
15+
<a-statistic
16+
title="Feedback"
17+
:value="1128"
18+
style="margin-right: 50px"
19+
>
20+
<template v-slot:suffix>
21+
<a-icon type="like" />
22+
</template>
23+
</a-statistic>
24+
</a-col>
25+
<a-col :span="12">
26+
<a-statistic
27+
title="Unmerged"
28+
:value="93"
29+
valueClass="demo-class"
30+
>
31+
<template v-slot:suffix>
32+
<span> / 100</span>
33+
</template>
34+
</a-statistic>
35+
</a-col>
36+
</a-row>
3237
</template>
3338
```

‎components/statistic/index.en-US.md

+7-7
Original file line numberDiff line numberDiff line change
@@ -5,12 +5,12 @@
55
| Property | Description | Type | Default |
66
| -------- | ----------- | ---- | ------- |
77
| decimalSeparator | decimal separator | string | . |
8-
| formatter | customize value display logic | (h) => VNode | - |
8+
| formatter | customize value display logic | v-slot \|(h) => VNode | - |
99
| groupSeparator | group separator | string | , |
1010
| precision | precision of input value | number | - |
11-
| prefix | prefix node of value | string \| VNode | - |
12-
| suffix | suffix node of value | string \| VNode | - |
13-
| title | Display title | string \| VNode | - |
11+
| prefix | prefix node of value | string \| v-slot | - |
12+
| suffix | suffix node of value | string \| v-slot | - |
13+
| title | Display title | string \| v-slot | - |
1414
| value | Display value | string \| number | - |
1515

1616

@@ -19,9 +19,9 @@
1919
| Property | Description | Type | Default |
2020
| -------- | ----------- | ---- | ------- |
2121
| format | Format as [moment](http://momentjs.com/) | string | 'HH:mm:ss' |
22-
| prefix | prefix node of value | string \| VNode | - |
23-
| suffix | suffix node of value | string \| VNode | - |
24-
| title | Display title | string \| VNode | - |
22+
| prefix | prefix node of value | string \| v-slot | - |
23+
| suffix | suffix node of value | string \| v-slot | - |
24+
| title | Display title | string \| v-slot | - |
2525
| value | Set target countdown time | number \| moment | - |
2626

2727
#### Statistic.Countdown Events

‎components/statistic/index.zh-CN.md

+7-7
Original file line numberDiff line numberDiff line change
@@ -5,22 +5,22 @@
55
| 参数 | 说明 | 类型 | 默认值 |
66
| -------- | ----------- | ---- | ------- |
77
| decimalSeparator | 设置小数点 | string | . |
8-
| formatter | 自定义数值展示 | (h) => VNode | - |
8+
| formatter | 自定义数值展示 | v-slot \| (h) => VNode | - |
99
| groupSeparator | 设置千分位标识符 | string | , |
1010
| precision | 数值精度 | number | - |
11-
| prefix | 设置数值的前缀 | string \| VNode | - |
12-
| suffix | 设置数值的后缀 | string \| VNode | - |
13-
| title | 数值的标题 | string \| VNode | - |
11+
| prefix | 设置数值的前缀 | string \| v-slot | - |
12+
| suffix | 设置数值的后缀 | string \| v-slot | - |
13+
| title | 数值的标题 | string \| v-slot | - |
1414
| value | 数值内容 | string \| number | - |
1515

1616
### Statistic.Countdown
1717

1818
| 参数 | 说明 | 类型 | 默认值 |
1919
| -------- | ----------- | ---- | ------- |
2020
| format | 格式化倒计时展示，参考 [moment](http://momentjs.com/) | string | 'HH:mm:ss' |
21-
| prefix | 设置数值的前缀 | string \| VNode | - |
22-
| suffix | 设置数值的后缀 | string \| VNode | - |
23-
| title | 数值的标题 | string \| VNode | - |
21+
| prefix | 设置数值的前缀 | string \| v-slot | - |
22+
| suffix | 设置数值的后缀 | string \| v-slot | - |
23+
| title | 数值的标题 | string \| v-slot | - |
2424
| value | 数值内容 | number \| moment | - |
2525

2626
#### Statistic.Countdown事件

0 commit comments

Comments
 (0)