From 50b634f9c3977ed96a8b4261a506f82010715458 Mon Sep 17 00:00:00 2001
From: YangPengPc <1324901147@qq.com>
Date: Wed, 12 Aug 2020 15:58:39 +0800
Subject: [PATCH 1/5] =?UTF-8?q?feat:=E6=9B=B4=E6=96=B0tag=E9=BB=98?=
 =?UTF-8?q?=E8=AE=A4=E5=A4=9A=E5=BD=A9=E9=A2=9C=E8=89=B2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/ui-theme/src/colors.js           |  6 ++++++
 packages/ui/tag/src/index.less            | 21 ++++++++++++++++++++-
 packages/ui/tag/stories/index.stories.tsx | 10 ++++++----
 3 files changed, 32 insertions(+), 5 deletions(-)

diff --git a/packages/ui-theme/src/colors.js b/packages/ui-theme/src/colors.js
index 980acfd9..926ec56e 100644
--- a/packages/ui-theme/src/colors.js
+++ b/packages/ui-theme/src/colors.js
@@ -257,4 +257,10 @@ exports.presetColors = {
     '--select-item-selected-bg': 'var(--theme-secondary-color-hover)',
     '--table-row-hover-bg': 'var(--color-brand-1)',
     '--tag-check-border': 'var(--color-brand-4)',
+    '--tag-font-color': 'var(--color-gray-9)',
+    '--tag-blue-color': 'var(--color-brand-2)',
+    '--tag-green-color': 'var(--color-success-1)',
+    '--tag-red-color': 'var(--color-error-1)',
+    '--tag-yellow-color': 'var(--color-warning-1)',
+
 };
diff --git a/packages/ui/tag/src/index.less b/packages/ui/tag/src/index.less
index ae629026..d869570c 100644
--- a/packages/ui/tag/src/index.less
+++ b/packages/ui/tag/src/index.less
@@ -2,7 +2,7 @@
 
 .@{osui-tag-class-prefix} {
     border: 1px solid transparent;
-    //border: none;
+    // border: none;
 
     &:hover {
         background: var(--theme-bg-color-base);
@@ -11,7 +11,26 @@
     .ant-tag-close-icon {
         color: var(--theme-text-color);
     }
+}
+
+.ant-tag-blue {
+    color: var(--tag-font-color);
+    background: var(--tag-blue-color);
+}
+
+.ant-tag-green {
+    color: var(--tag-font-color);
+    background: var(--tag-green-color);
+}
+
+.ant-tag-red {
+    color: var(--tag-font-color);
+    background: var(--tag-red-color);
+}
 
+.ant-tag-yellow {
+    color: var(--tag-font-color);
+    background: var(--tag-yellow-color);
 }
 
 .ant-tag-checkable-checked {
diff --git a/packages/ui/tag/stories/index.stories.tsx b/packages/ui/tag/stories/index.stories.tsx
index 8995b01a..e3fe9766 100644
--- a/packages/ui/tag/stories/index.stories.tsx
+++ b/packages/ui/tag/stories/index.stories.tsx
@@ -50,11 +50,13 @@ export const Demo = () => {
                 </CheckableTag>
             ))}
             {/* 多彩标签 */}
-            <Tag color="magenta">magenta</Tag>
+            <Tag color="blue">blue</Tag>
+            <Tag color="green">red</Tag>
+            <Tag color="purple">purple</Tag>
             <Tag color="red">red</Tag>
-            <Tag color="volcano">volcano</Tag>
-            <Tag color="orange">orange</Tag>
-            <Tag color="gold">gold</Tag>
+            <Tag color="teal">teal</Tag>
+            <Tag color="yellow">yellow</Tag>
+
 
             <Tag color="#f50">#f50</Tag>
             <Tag color="#2db7f5">#2db7f5</Tag>
-- 
Gitee


From 2d068a609e5b29059a180f321623ece2886e07ca Mon Sep 17 00:00:00 2001
From: YangPengPc <1324901147@qq.com>
Date: Wed, 12 Aug 2020 16:49:19 +0800
Subject: [PATCH 2/5] feat:update tag

---
 packages/ui-theme/src/antd-vars-patch.less |  6 ++++++
 packages/ui-theme/src/colors.js            |  1 +
 packages/ui/tag/src/index.less             |  9 +++++++++
 packages/ui/tag/stories/index.stories.mdx  | 14 ++++++++++++--
 packages/ui/tag/stories/index.stories.tsx  |  9 +++++++--
 5 files changed, 35 insertions(+), 4 deletions(-)

diff --git a/packages/ui-theme/src/antd-vars-patch.less b/packages/ui-theme/src/antd-vars-patch.less
index 1cab60c3..4dbfae59 100644
--- a/packages/ui-theme/src/antd-vars-patch.less
+++ b/packages/ui-theme/src/antd-vars-patch.less
@@ -133,3 +133,9 @@
 @alert-close-color:  var(--theme-text-color-secondary);
 @alert-with-description-padding: var(--alert-with-description-padding);
 @alert-with-description-icon-top: var(--alert-with-description-icon-top);
+
+// Tag
+@tag-default-bg: @background-color-light;
+@tag-default-color: @text-color;
+@tag-font-size: @font-size-base;
+@tag-line-height: 22px;
diff --git a/packages/ui-theme/src/colors.js b/packages/ui-theme/src/colors.js
index 65ff31b0..2d36b474 100644
--- a/packages/ui-theme/src/colors.js
+++ b/packages/ui-theme/src/colors.js
@@ -271,6 +271,7 @@ exports.presetColors = {
     '--tag-font-color': 'var(--color-gray-9)',
     '--tag-blue-color': 'var(--color-brand-2)',
     '--tag-green-color': 'var(--color-success-1)',
+    '--tag-purple-color': 'var(--color-purple-1)',
     '--tag-red-color': 'var(--color-error-1)',
     '--tag-yellow-color': 'var(--color-warning-1)',
 };
diff --git a/packages/ui/tag/src/index.less b/packages/ui/tag/src/index.less
index d869570c..99ca95fd 100644
--- a/packages/ui/tag/src/index.less
+++ b/packages/ui/tag/src/index.less
@@ -23,6 +23,11 @@
     background: var(--tag-green-color);
 }
 
+.ant-tag-purple {
+    color: var(--tag-font-color);
+    background: var(--tag-purple-color);
+}
+
 .ant-tag-red {
     color: var(--tag-font-color);
     background: var(--tag-red-color);
@@ -33,6 +38,10 @@
     background: var(--tag-yellow-color);
 }
 
+.ant-tag-checkable {
+    border: 2px solid transparent;
+}
+
 .ant-tag-checkable-checked {
     background:@tag-default-bg;
     border:2px solid var(--color-brand-4);
diff --git a/packages/ui/tag/stories/index.stories.mdx b/packages/ui/tag/stories/index.stories.mdx
index d6dfbaa5..942fee69 100644
--- a/packages/ui/tag/stories/index.stories.mdx
+++ b/packages/ui/tag/stories/index.stories.mdx
@@ -1,11 +1,21 @@
 import {Meta, Story, Preview} from '@storybook/addon-docs/blocks';
 import {Demo} from './index.stories'
 
-<Meta title="设计文档/Welcome" component={Demo} />
+<Meta title="OSUI-Tag" component={Demo} />
 
 # OSUI Alert
 
-一些给UE看的文档说明，可以放在这里
+## API
+
+### 基本属性
+
+支持所有antd属性：见[antd文档](https://ant.design/components/tag-cn/)
+
+### 修改属性
+
+|参数|说明|类型|默认值|
+|:---|:----:|:---:|------:|
+|color|标签色(OSUI已支持预设颜色：'blue、red、purple、red、teal、yellow'，除之外颜色按原生显示)|string|-|
 
 <Preview>
   <Story name="Demo">
diff --git a/packages/ui/tag/stories/index.stories.tsx b/packages/ui/tag/stories/index.stories.tsx
index e3fe9766..36a95797 100644
--- a/packages/ui/tag/stories/index.stories.tsx
+++ b/packages/ui/tag/stories/index.stories.tsx
@@ -1,6 +1,7 @@
 import * as React from 'react';
 import {PlusOutlined} from '@ant-design/icons';
 import Tag from '../src';
+import {Divider} from 'antd';
 
 
 export default {
@@ -25,6 +26,7 @@ export const Demo = () => {
     return (
         <div style={{padding: 30}}>
             {/* success */}
+            <Divider orientation="left">基本</Divider>
             <Tag>标签</Tag>
             <Tag className={'osui-tag-dome-dashed'}>
                 <PlusOutlined style={{fontSize: '12px', marginRight: '4px'}} />
@@ -39,7 +41,9 @@ export const Demo = () => {
             >
                 标签
             </Tag>
+
             {/* 焦点状态 */}
+            <Divider orientation="left">可选择状态</Divider>
             {tagsData.map(tag => (
                 <CheckableTag
                     key={tag}
@@ -49,7 +53,9 @@ export const Demo = () => {
                     {tag}
                 </CheckableTag>
             ))}
+
             {/* 多彩标签 */}
+            <Divider orientation="left">多彩标签(已修改属性，其他可用原生)</Divider>
             <Tag color="blue">blue</Tag>
             <Tag color="green">red</Tag>
             <Tag color="purple">purple</Tag>
@@ -57,7 +63,7 @@ export const Demo = () => {
             <Tag color="teal">teal</Tag>
             <Tag color="yellow">yellow</Tag>
 
-
+            <Divider orientation="left">自定义颜色</Divider>
             <Tag color="#f50">#f50</Tag>
             <Tag color="#2db7f5">#2db7f5</Tag>
 
@@ -66,6 +72,5 @@ export const Demo = () => {
             <Tag color="error">error</Tag>
             <Tag color="warning">warning</Tag>
             <Tag color="default">default</Tag>
-
         </div>);
 };
-- 
Gitee


From b49c2db6d8633cfb39f392d436f811bf81f3955e Mon Sep 17 00:00:00 2001
From: YangPengPc <1324901147@qq.com>
Date: Wed, 12 Aug 2020 16:51:43 +0800
Subject: [PATCH 3/5] feat:update tag

---
 packages/ui/tag/stories/index.stories.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/ui/tag/stories/index.stories.tsx b/packages/ui/tag/stories/index.stories.tsx
index 36a95797..7399e53d 100644
--- a/packages/ui/tag/stories/index.stories.tsx
+++ b/packages/ui/tag/stories/index.stories.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
+import {Divider} from 'antd';
 import {PlusOutlined} from '@ant-design/icons';
 import Tag from '../src';
-import {Divider} from 'antd';
 
 
 export default {
-- 
Gitee


From fe3148f5bc279ac3433354a8203d70323f1286e0 Mon Sep 17 00:00:00 2001
From: YangPengPc <1324901147@qq.com>
Date: Thu, 13 Aug 2020 11:35:28 +0800
Subject: [PATCH 4/5] feat:update tag

---
 packages/ui/tag/src/index.less            | 4 ++--
 packages/ui/tag/stories/index.stories.tsx | 2 --
 2 files changed, 2 insertions(+), 4 deletions(-)

diff --git a/packages/ui/tag/src/index.less b/packages/ui/tag/src/index.less
index 99ca95fd..66753710 100644
--- a/packages/ui/tag/src/index.less
+++ b/packages/ui/tag/src/index.less
@@ -2,7 +2,6 @@
 
 .@{osui-tag-class-prefix} {
     border: 1px solid transparent;
-    // border: none;
 
     &:hover {
         background: var(--theme-bg-color-base);
@@ -43,11 +42,12 @@
 }
 
 .ant-tag-checkable-checked {
-    background:@tag-default-bg;
+    background:  var(--color-brand-1);
     border:2px solid var(--color-brand-4);
     color: @text-color;
 }
 
+/* 边框虚线示例 */
 .osui-tag-dome-dashed {
     background: #fff;
     border: 1px solid rgba(218,222,227,1);
diff --git a/packages/ui/tag/stories/index.stories.tsx b/packages/ui/tag/stories/index.stories.tsx
index 7399e53d..d3baf8aa 100644
--- a/packages/ui/tag/stories/index.stories.tsx
+++ b/packages/ui/tag/stories/index.stories.tsx
@@ -3,7 +3,6 @@ import {Divider} from 'antd';
 import {PlusOutlined} from '@ant-design/icons';
 import Tag from '../src';
 
-
 export default {
     title: 'OSUI-Tag',
 };
@@ -71,6 +70,5 @@ export const Demo = () => {
             <Tag color="processing">processing</Tag>
             <Tag color="error">error</Tag>
             <Tag color="warning">warning</Tag>
-            <Tag color="default">default</Tag>
         </div>);
 };
-- 
Gitee


From 1a3faeb165d36c7a8daa2e0fd6fac31c2b881c3b Mon Sep 17 00:00:00 2001
From: YangPengPc <1324901147@qq.com>
Date: Thu, 13 Aug 2020 15:06:18 +0800
Subject: [PATCH 5/5] feat:update tag

---
 packages/ui/tag/stories/index.stories.tsx | 5 -----
 1 file changed, 5 deletions(-)

diff --git a/packages/ui/tag/stories/index.stories.tsx b/packages/ui/tag/stories/index.stories.tsx
index d3baf8aa..d0deae52 100644
--- a/packages/ui/tag/stories/index.stories.tsx
+++ b/packages/ui/tag/stories/index.stories.tsx
@@ -65,10 +65,5 @@ export const Demo = () => {
             <Divider orientation="left">自定义颜色</Divider>
             <Tag color="#f50">#f50</Tag>
             <Tag color="#2db7f5">#2db7f5</Tag>
-
-            <Tag color="success">success</Tag>
-            <Tag color="processing">processing</Tag>
-            <Tag color="error">error</Tag>
-            <Tag color="warning">warning</Tag>
         </div>);
 };
-- 
Gitee