Skip to content

Commit e7da41c

Browse files
committed
Merge branch 'feat-imageText-mly' of github.com:ShuyunFF2E/cloud-react into v1-develop
2 parents b5c3534 + 0edcd16 commit e7da41c

13 files changed

Lines changed: 135 additions & 127 deletions

File tree

src/components/format/index.md

Lines changed: 45 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -15,77 +15,82 @@ group:
1515

1616
## 组件列表
1717

18-
| 组件 | 说明 | 主要功能 |
19-
| ---- | ---- | -------- |
20-
| NumberTpl | 数字格式化 | 支持千分位、小数位数、前缀后缀 |
21-
| TextTpl | 文本格式化 | 支持多行显示、Tooltip提示 |
22-
| TimeTpl | 时间格式化 | 支持自定义时间格式 |
18+
| 组件 | 说明 | 主要功能 |
19+
| ------------ | -------------- | ------------------------------ |
20+
| NumberTpl | 数字格式化 | 支持千分位、小数位数、前缀后缀 |
21+
| TextTpl | 文本格式化 | 支持多行显示、Tooltip 提示 |
22+
| TimeTpl | 时间格式化 | 支持自定义时间格式 |
2323
| TimeRangeTpl | 时间范围格式化 | 支持开始和结束时间的格式化显示 |
24-
| LinkTpl | 链接格式化 | 支持点击跳转、自定义点击事件 |
24+
| LinkTpl | 链接格式化 | 支持点击跳转、自定义点击事件 |
2525

2626
## API
2727

2828
### NumberTpl 数字格式化
2929

30-
| 参数 | 说明 | 类型 | 默认值 |
31-
| --- | --- | --- | --- |
32-
| value | 要格式化的数值 | `number \| string` | - |
33-
| precision | 小数位数 | `number` | `0` |
34-
| isThousands | 是否使用千分位格式 | `boolean` | `true` |
35-
| prefix | 前缀 | `string` | `''` |
36-
| suffix | 后缀 | `string` | `''` |
30+
| 参数 | 说明 | 类型 | 默认值 |
31+
| ----------- | ------------------ | ------------------ | ------ |
32+
| value | 要格式化的数值 | `number \| string` | - |
33+
| precision | 小数位数 | `number` | `0` |
34+
| isThousands | 是否使用千分位格式 | `boolean` | `true` |
35+
| prefix | 前缀 | `string` | `''` |
36+
| suffix | 后缀 | `string` | `''` |
3737

3838
### TextTpl 文本格式化
3939

40-
| 参数 | 说明 | 类型 | 默认值 |
41-
| --- | --- | --- | --- |
42-
| value | 要显示的文本内容 | `number \| string` | - |
43-
| line | 显示行数 | `number` | `1` |
44-
| tooltipValue | 自定义tooltip内容 | `string` | - |
40+
| 参数 | 说明 | 类型 | 默认值 |
41+
| ------------ | ------------------- | ------------------ | ------ |
42+
| value | 要显示的文本内容 | `number \| string` | - |
43+
| line | 显示行数 | `number` | `1` |
44+
| tooltipValue | 自定义 tooltip 内容 | `string` | - |
4545

4646
### TimeTpl 时间格式化
4747

48-
| 参数 | 说明 | 类型 | 默认值 |
49-
| --- | --- | --- | --- |
50-
| value | 时间值 | `string` | - |
51-
| format | 时间格式(moment格式| `string` | `''` |
48+
| 参数 | 说明 | 类型 | 默认值 |
49+
| ------ | ----------------------- | -------- | ------ |
50+
| value | 时间值 | `string` | - |
51+
| format | 时间格式(moment 格式| `string` | `''` |
5252

5353
### TimeRangeTpl 时间范围格式化
5454

55-
| 参数 | 说明 | 类型 | 默认值 |
56-
| --- | --- | --- | --- |
57-
| row | 行数据对象 | `object` | - |
58-
| startKey | 开始时间字段名 | `string` | - |
59-
| endKey | 结束时间字段名 | `string` | - |
60-
| format | 时间格式(moment格式) | `string` | `''` |
61-
| startValue | 开始时间值(优先级高于startKey| `string` | `''` |
62-
| endValue | 结束时间值(优先级高于endKey) | `string` | `''` |
55+
| 参数 | 说明 | 类型 | 默认值 |
56+
| ---------- | --------------------------------- | -------- | ------ |
57+
| row | 行数据对象 | `object` | - |
58+
| startKey | 开始时间字段名 | `string` | - |
59+
| endKey | 结束时间字段名 | `string` | - |
60+
| format | 时间格式(moment 格式) | `string` | `''` |
61+
| startValue | 开始时间值(优先级高于 startKey| `string` | `''` |
62+
| endValue | 结束时间值(优先级高于 endKey) | `string` | `''` |
6363

6464
### LinkTpl 链接格式化
6565

66-
| 参数 | 说明 | 类型 | 默认值 |
67-
| --- | --- | --- | --- |
68-
| value | 显示的文本内容 | `string` | - |
69-
| linkKey | 链接字段名 | `string` | - |
70-
| row | 行数据对象 | `object` | `{}` |
71-
| link | 链接地址(优先级高于linkKey| `string` | `''` |
72-
| onClick | 自定义点击事件 | `function` | - |
73-
| line | 显示行数 | `number` | `1` |
74-
| tooltipValue | 自定义tooltip内容 | `string` | - |
66+
| 参数 | 说明 | 类型 | 默认值 |
67+
| ------------ | ------------------------------ | ---------- | ------ |
68+
| value | 显示的文本内容 | `string` | - |
69+
| linkKey | 链接字段名 | `string` | - |
70+
| row | 行数据对象 | `object` | `{}` |
71+
| link | 链接地址(优先级高于 linkKey| `string` | `''` |
72+
| onClick | 自定义点击事件 | `function` | - |
73+
| line | 显示行数 | `number` | `1` |
74+
| tooltipValue | 自定义 tooltip 内容 | `string` | - |
7575

76-
## 代码演示
76+
## 代码演示
7777

7878
### 数字格式化
79+
7980
<embed src="@components/format/demos/number.md" />
8081

8182
### 文本格式化
83+
8284
<embed src="@components/format/demos/text.md" />
8385

8486
### 时间格式化
87+
8588
<embed src="@components/format/demos/time.md" />
8689

8790
### 时间范围格式化
91+
8892
<embed src="@components/format/demos/time-range.md" />
8993

9094
### 链接格式化
95+
9196
<embed src="@components/format/demos/link.md" />

src/components/image-text/demos/basic.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,8 @@ desc: 最简单的用法,展示图片和标题
99
* title: 基础使用
1010
* desc: 最简单的用法,展示图片和标题
1111
*/
12-
import React from 'react';
13-
import { ImageText } from 'cloud-react';
12+
import React from "react";
13+
import { ImageText } from "cloud-react";
1414

1515
class BasicDemo extends React.Component {
1616
render() {

src/components/image-text/demos/custom-img.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,8 @@ desc: 自定义图片的大小和样式
99
* title: 自定义图片样式
1010
* desc: 自定义图片的大小和样式
1111
*/
12-
import React from 'react';
13-
import { ImageText } from 'cloud-react';
12+
import React from "react";
13+
import { ImageText } from "cloud-react";
1414

1515
class CustomImgDemo extends React.Component {
1616
render() {

src/components/image-text/demos/disabled.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,8 @@ desc: 禁用状态下的图文组合展示
99
* title: 禁用状态
1010
* desc: 禁用状态下的图文组合展示
1111
*/
12-
import React from 'react';
13-
import { ImageText } from 'cloud-react';
12+
import React from "react";
13+
import { ImageText } from "cloud-react";
1414

1515
class DisabledDemo extends React.Component {
1616
render() {

src/components/image-text/demos/highlight.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -9,12 +9,12 @@ desc: 支持搜索关键词高亮显示
99
* title: 搜索高亮
1010
* desc: 支持搜索关键词高亮显示
1111
*/
12-
import React from 'react';
13-
import { ImageText, Input } from 'cloud-react';
12+
import React from "react";
13+
import { ImageText, Input } from "cloud-react";
1414

1515
class HighlightDemo extends React.Component {
1616
state = {
17-
searchValue: '产品',
17+
searchValue: "产品",
1818
};
1919

2020
handleSearch = (e) => {

src/components/image-text/demos/with-icon.md

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,8 @@ desc: 使用图标替代图片
99
* title: 使用图标
1010
* desc: 使用图标替代图片
1111
*/
12-
import React from 'react';
13-
import { ImageText, Icon } from 'cloud-react';
12+
import React from "react";
13+
import { ImageText, Icon } from "cloud-react";
1414

1515
class WithIconDemo extends React.Component {
1616
render() {
@@ -21,7 +21,7 @@ class WithIconDemo extends React.Component {
2121
icon={
2222
<Icon
2323
type="user-fill"
24-
style={{ fontSize: 48, color: '#1890ff' }}
24+
style={{ fontSize: 48, color: "#1890ff" }}
2525
/>
2626
}
2727
label="用户管理"
@@ -34,7 +34,7 @@ class WithIconDemo extends React.Component {
3434
icon={
3535
<Icon
3636
type="setting-fill"
37-
style={{ fontSize: 48, color: '#52c41a' }}
37+
style={{ fontSize: 48, color: "#52c41a" }}
3838
/>
3939
}
4040
label="系统设置"
@@ -47,7 +47,7 @@ class WithIconDemo extends React.Component {
4747
icon={
4848
<Icon
4949
type="file-text-fill"
50-
style={{ fontSize: 48, color: '#faad14' }}
50+
style={{ fontSize: 48, color: "#faad14" }}
5151
/>
5252
}
5353
label="文档管理"
@@ -60,7 +60,7 @@ class WithIconDemo extends React.Component {
6060
icon={
6161
<Icon
6262
type="mail-fill"
63-
style={{ fontSize: 48, color: '#f5222d' }}
63+
style={{ fontSize: 48, color: "#f5222d" }}
6464
/>
6565
}
6666
label="消息中心"

src/components/light-text/demos/basic.md

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,8 @@ desc: 最基本的文本高亮功能
99
* title: 基础使用
1010
* desc: 最基本的文本高亮功能
1111
*/
12-
import React from 'react';
13-
import { LightText } from 'cloud-react';
12+
import React from "react";
13+
import { LightText } from "cloud-react";
1414

1515
class BasicDemo extends React.Component {
1616
render() {
@@ -20,7 +20,7 @@ class BasicDemo extends React.Component {
2020
<h5>原始文本:</h5>
2121
<p>这是一个产品管理系统,用于管理产品的各种信息。</p>
2222
</div>
23-
23+
2424
<div style={{ marginBottom: 20 }}>
2525
<h5>高亮关键词 "产品"</h5>
2626
<p>
@@ -30,7 +30,7 @@ class BasicDemo extends React.Component {
3030
/>
3131
</p>
3232
</div>
33-
33+
3434
<div style={{ marginBottom: 20 }}>
3535
<h5>高亮关键词 "管理"</h5>
3636
<p>
@@ -40,7 +40,7 @@ class BasicDemo extends React.Component {
4040
/>
4141
</p>
4242
</div>
43-
43+
4444
<div>
4545
<h5>高亮多个字符 "系统"</h5>
4646
<p>
@@ -56,4 +56,4 @@ class BasicDemo extends React.Component {
5656
}
5757

5858
export default BasicDemo;
59-
```
59+
```

src/components/light-text/demos/custom-color.md

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,8 @@ desc: 自定义高亮文本的颜色
99
* title: 自定义颜色
1010
* desc: 自定义高亮文本的颜色
1111
*/
12-
import React from 'react';
13-
import { LightText } from 'cloud-react';
12+
import React from "react";
13+
import { LightText } from "cloud-react";
1414

1515
class CustomColorDemo extends React.Component {
1616
render() {
@@ -25,7 +25,7 @@ class CustomColorDemo extends React.Component {
2525
/>
2626
</p>
2727
</div>
28-
28+
2929
<div style={{ marginBottom: 20 }}>
3030
<h5>红色高亮:</h5>
3131
<p>
@@ -36,7 +36,7 @@ class CustomColorDemo extends React.Component {
3636
/>
3737
</p>
3838
</div>
39-
39+
4040
<div style={{ marginBottom: 20 }}>
4141
<h5>绿色高亮:</h5>
4242
<p>
@@ -47,7 +47,7 @@ class CustomColorDemo extends React.Component {
4747
/>
4848
</p>
4949
</div>
50-
50+
5151
<div style={{ marginBottom: 20 }}>
5252
<h5>橙色高亮:</h5>
5353
<p>
@@ -58,7 +58,7 @@ class CustomColorDemo extends React.Component {
5858
/>
5959
</p>
6060
</div>
61-
61+
6262
<div>
6363
<h5>紫色高亮:</h5>
6464
<p>
@@ -75,4 +75,4 @@ class CustomColorDemo extends React.Component {
7575
}
7676

7777
export default CustomColorDemo;
78-
```
78+
```

src/components/light-text/demos/full-match.md

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,8 @@ desc: 完全匹配模式,只有文本完全等于关键词时才会高亮
99
* title: 完全匹配
1010
* desc: 完全匹配模式,只有文本完全等于关键词时才会高亮
1111
*/
12-
import React from 'react';
13-
import { LightText } from 'cloud-react';
12+
import React from "react";
13+
import { LightText } from "cloud-react";
1414

1515
class FullMatchDemo extends React.Component {
1616
render() {
@@ -26,7 +26,7 @@ class FullMatchDemo extends React.Component {
2626
/>
2727
</p>
2828
</div>
29-
29+
3030
<div style={{ marginBottom: 20 }}>
3131
<h5>部分匹配(对比):</h5>
3232
<p>
@@ -37,7 +37,7 @@ class FullMatchDemo extends React.Component {
3737
/>
3838
</p>
3939
</div>
40-
40+
4141
<div style={{ marginBottom: 20 }}>
4242
<h5>完全匹配单个词:</h5>
4343
<p>
@@ -48,7 +48,7 @@ class FullMatchDemo extends React.Component {
4848
/>
4949
</p>
5050
</div>
51-
51+
5252
<div>
5353
<h5>完全匹配不存在的词:</h5>
5454
<p>
@@ -65,4 +65,4 @@ class FullMatchDemo extends React.Component {
6565
}
6666

6767
export default FullMatchDemo;
68-
```
68+
```

0 commit comments

Comments
 (0)