update tag

components/apolloTable/component/base/detail/tag/index.tsx

@@ -3,6 +3,20 @@ import { Popover } from 'antd';
 import classNames from 'classnames';
 import s from './index.less';
 
+const getColor = (item: any, options: any[]) => {
+    let color = '';
+    if (item.text === item.value) {
+        return 'transparent';
+    }
+    if (options && Array.isArray(options) && options.length > 0) {
+        const obj =
+            options.find((ls) => {
+                return String(ls.id) === String(item.value);
+            }) || {};
+        color = obj.color || 'e9eef9';
+    }
+    return `#${color}`;
+};
 export const Tags = (props: any) => {
     const { value, origin, componentAttr, columnConfig } = props;
     if (!Array.isArray(value) || value.length === 0) return null;
@@ -18,23 +32,12 @@ export const Tags = (props: any) => {
         innerStyle.flexWrap = 'wrap';
         itemStyle.marginBottom = '5px';
     }
-    const getColor = (item: any) => {
-        let color = '';
-        if (options && Array.isArray(options) && options.length > 0) {
-            const obj =
-                options.find((ls) => {
-                    return String(ls.id) === String(item.value);
-                }) || {};
-            color = obj.color || 'e9eef9';
-        }
-        return color;
-    };
 
     if (mode !== 'multiple') {
         // 单选
         return (
             <div className={s.container} style={{ overflow: 'hidden' }}>
-                <span className={s.item} style={{ ...itemStyle, background: `#${getColor(value[0])}` }}>
+                <span className={s.item} style={{ ...itemStyle, background: getColor(value[0], options) }}>
                     <div className={s.itemBgTxt}>{value[0].text}</div>
                 </span>
             </div>
@@ -78,7 +81,7 @@ export const Tags = (props: any) => {
                                             <span
                                                 className={s.popItem}
                                                 key={index}
-                                                style={{ background: `#${getColor(item)}` }}
+                                                style={{ background: getColor(item, options) }}
                                             >
                                                 <div className={s.popItemBgTxt}>{item.text}</div>
                                             </span>
@@ -93,7 +96,7 @@ export const Tags = (props: any) => {
                                         <span
                                             key={index}
                                             className={classNames(s.item, s.multi)}
-                                            style={{ ...itemStyle, background: `#${getColor(item)}` }}
+                                            style={{ ...itemStyle, background: getColor(item, options) }}
                                         >
                                             <div className={s.itemBgTxt}>{item.text}</div>
                                         </span>
@@ -108,7 +111,7 @@ export const Tags = (props: any) => {
                                     <span
                                         key={index}
                                         className={classNames(s.item, s.multi)}
-                                        style={{ ...itemStyle, background: `#${getColor(item)}` }}
+                                        style={{ ...itemStyle, background: getColor(item, options) }}
                                     >
                                         <div className={s.itemBgTxt}>{item.text}</div>
                                     </span>