style: model list type tag

src/components/icon-font/iconfont/iconfont.css

@@ -1,9 +1,9 @@
 @font-face {
   font-family: iconfont; /* Project id 4613488 */
   src:
-    url('iconfont.woff2?t=1732806927800') format('woff2'),
+    url('iconfont.woff2?t=1734062014514') format('woff2'),
-    url('iconfont.woff?t=1732806927800') format('woff'),
+    url('iconfont.woff?t=1734062014514') format('woff'),
-    url('iconfont.ttf?t=1732806927800') format('truetype');
+    url('iconfont.ttf?t=1734062014514') format('truetype');
 }
 
 .iconfont {
@@ -14,6 +14,22 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-sound-wave::before {
+  content: '\e619';
+}
+
+.icon-rank1::before {
+  content: '\e7cb';
+}
+
+.icon-cube::before {
+  content: '\e769';
+}
+
+.icon-speaker-slash::before {
+  content: '\ebb6';
+}
+
 .icon-random::before {
   content: '\e603';
 }

src/components/icon-font/iconfont/iconfont.json

@@ -5,6 +5,34 @@
   "css_prefix_text": "icon-",
   "description": "",
   "glyphs": [
+    {
+      "icon_id": "14464883",
+      "name": "sound-wave",
+      "font_class": "sound-wave",
+      "unicode": "e619",
+      "unicode_decimal": 58905
+    },
+    {
+      "icon_id": "37200543",
+      "name": "rank",
+      "font_class": "rank1",
+      "unicode": "e7cb",
+      "unicode_decimal": 59339
+    },
+    {
+      "icon_id": "5127275",
+      "name": "cube",
+      "font_class": "cube",
+      "unicode": "e769",
+      "unicode_decimal": 59241
+    },
+    {
+      "icon_id": "28326047",
+      "name": "speaker-slash",
+      "font_class": "speaker-slash",
+      "unicode": "ebb6",
+      "unicode_decimal": 60342
+    },
     {
       "icon_id": "13059398",
       "name": "随机",

src/components/icon-font/index.tsx

@@ -1,8 +1,8 @@
 import { createFromIconfontCN } from '@ant-design/icons';
-// import './iconfont/iconfont.js';
+import './iconfont/iconfont.js';
 
 const IconFont = createFromIconfontCN({
-  scriptUrl: '//at.alicdn.com/t/c/font_4613488_oyisgn7lqa.js'
+  scriptUrl: ''
 });
 
 export default IconFont;

src/pages/api-keys/index.tsx

@@ -195,7 +195,12 @@ const APIKeys: React.FC = () => {
                 onClick={handleDeleteBatch}
                 disabled={!rowSelection.selectedRowKeys.length}
               >
-                {intl.formatMessage({ id: 'common.button.delete' })}
+                <span>
+                  {intl?.formatMessage?.({ id: 'common.button.delete' })}
+                  {rowSelection.selectedRowKeys.length > 0 && (
+                    <span>({rowSelection.selectedRowKeys?.length})</span>
+                  )}
+                </span>
               </Button>
             </Space>
           }

src/pages/llmodels/components/table-list.tsx

@@ -17,9 +17,11 @@ import {
 } from '@/pages/resources/config/types';
 import { handleBatchRequest } from '@/utils';
 import {
+  AudioOutlined,
   DeleteOutlined,
   DownOutlined,
   EditOutlined,
+  PictureOutlined,
   SyncOutlined,
   WechatWorkOutlined
 } from '@ant-design/icons';
@@ -341,6 +343,7 @@ const Models: React.FC<ModelsProps> = ({
   const handleLogModalCancel = useCallback(() => {
     setOpenLogModal(false);
   }, []);
+
   const handleDelete = async (row: any) => {
     modalRef.current.show({
       content: 'models.table.models',
@@ -353,6 +356,7 @@ const Models: React.FC<ModelsProps> = ({
       }
     });
   };
+
   const handleDeleteBatch = () => {
     modalRef.current.show({
       content: 'models.table.models',
@@ -465,12 +469,15 @@ const Models: React.FC<ModelsProps> = ({
       if (record.reranker) {
         return (
           <Tag
+            icon={<IconFont type="icon-rank1"></IconFont>}
             style={{
               margin: 0,
-              opacity: 0.8,
+              opacity: 1,
+              paddingInline: 8,
+              borderRadius: 12,
               transform: 'scale(0.9)'
             }}
-            color="geekblue"
+            color="cyan"
           >
             Reranker
           </Tag>
@@ -480,12 +487,15 @@ const Models: React.FC<ModelsProps> = ({
       if (record.embedding_only && !record.reranker) {
         return (
           <Tag
+            icon={<IconFont type="icon-cube"></IconFont>}
             style={{
               margin: 0,
-              opacity: 0.8,
+              opacity: 1,
+              paddingInline: 8,
+              borderRadius: 12,
               transform: 'scale(0.9)'
             }}
-            color="geekblue"
+            color="purple"
           >
             Embedding
           </Tag>
@@ -494,9 +504,12 @@ const Models: React.FC<ModelsProps> = ({
       if (record.text_to_speech) {
         return (
           <Tag
+            icon={<IconFont type="icon-sound-wave"></IconFont>}
             style={{
               margin: 0,
-              opacity: 0.8,
+              opacity: 1,
+              paddingInline: 8,
+              borderRadius: 12,
               transform: 'scale(0.9)'
             }}
             color="geekblue"
@@ -508,12 +521,15 @@ const Models: React.FC<ModelsProps> = ({
       if (record.speech_to_text) {
         return (
           <Tag
+            icon={<AudioOutlined />}
             style={{
               margin: 0,
-              opacity: 0.8,
+              opacity: 1,
+              paddingInline: 8,
+              borderRadius: 12,
               transform: 'scale(0.9)'
             }}
-            color="geekblue"
+            color="processing"
           >
             Speech-To-Text
           </Tag>
@@ -522,12 +538,15 @@ const Models: React.FC<ModelsProps> = ({
       if (record.image_only) {
         return (
           <Tag
+            icon={<PictureOutlined />}
             style={{
               margin: 0,
-              opacity: 0.8,
+              opacity: 1,
+              paddingInline: 8,
+              borderRadius: 12,
               transform: 'scale(0.9)'
             }}
-            color="geekblue"
+            color="orange"
           >
             Image
           </Tag>
@@ -614,7 +633,12 @@ const Models: React.FC<ModelsProps> = ({
                   onClick={handleDeleteBatch}
                   disabled={!rowSelection.selectedRowKeys.length}
                 >
-                  {intl?.formatMessage?.({ id: 'common.button.delete' })}
+                  <span>
+                    {intl?.formatMessage?.({ id: 'common.button.delete' })}
+                    {rowSelection.selectedRowKeys.length > 0 && (
+                      <span>({rowSelection.selectedRowKeys?.length})</span>
+                    )}
+                  </span>
                 </Button>
               </Access>
             </Space>

src/pages/resources/components/workers.tsx

@@ -282,7 +282,12 @@ const Resources: React.FC = () => {
               onClick={handleDeleteBatch}
               disabled={!rowSelection.selectedRowKeys.length}
             >
-              {intl.formatMessage({ id: 'common.button.delete' })}
+              <span>
+                {intl?.formatMessage?.({ id: 'common.button.delete' })}
+                {rowSelection.selectedRowKeys.length > 0 && (
+                  <span>({rowSelection.selectedRowKeys?.length})</span>
+                )}
+              </span>
             </Button>
           </Space>
         }
@@ -333,7 +338,15 @@ const Resources: React.FC = () => {
               >
                 {_.map(record.labels, (item: any, index: string) => {
                   return (
-                    <AutoTooltip key={index} className="m-r-0" maxWidth={120}>
+                    <AutoTooltip
+                      key={index}
+                      className="m-r-0"
+                      maxWidth={120}
+                      style={{
+                        paddingInline: 8,
+                        borderRadius: 12
+                      }}
+                    >
                       {index}:{item}
                     </AutoTooltip>
                   );

src/pages/users/index.tsx

@@ -252,7 +252,12 @@ const Users: React.FC = () => {
                 onClick={handleDeleteBatch}
                 disabled={!rowSelection.selectedRowKeys.length}
               >
-                {intl.formatMessage({ id: 'common.button.delete' })}
+                <span>
+                  {intl?.formatMessage?.({ id: 'common.button.delete' })}
+                  {rowSelection.selectedRowKeys.length > 0 && (
+                    <span>({rowSelection.selectedRowKeys?.length})</span>
+                  )}
+                </span>
               </Button>
             </Space>
           }