```

style(ant-select.scss): 更新复选样式和标签样式在`ant-select.scss`文件中添加了复选相关的样式，并对`.ant-tag`元素进行了详细的样式定义，包括内边距、边框半径、背景色等。同时调整了`.ant-tag .anticon-close`的字体大小。

refactor(index.vue): 修改标签组件的渲染逻辑

- 在`add-raw-material-drawer/index.vue`和`edit-raw-material-modal/index.vue`中移除了`maxTagTextLength`属性。
- 为长标签增加了包裹`div`，并调整了其样式。
- 对于超过5个字符的标签文本，使用`Tooltip`显示完整内容，并截断显示前5个字符后加上省略号。
- 调整了`table/index.vue`中标签的渲染方式，对于长度超过5个字符的标签使用`Tooltip`展示完整内容。
- 在`add-raw-material-drawer/style.scss`中注释掉了`.ant-select-selection-overflow-item`的最大宽度设置。
```

src/styles/components/ant-select.scss

@@ -74,6 +74,7 @@
     }
   }
 
+  // 复选
   &.ant-select-multiple {
     .ant-select-selector {
       height: fit-content !important;
@@ -92,6 +93,22 @@
             color: #737478;
           }
         }
+
+        .ant-tag {
+          padding: 1px 8px;
+          border-radius: 4px;
+          background: var(--BG-300, #E6E6E8);
+          color: var(--Text-1, #211F24);
+          font-family: $font-family-regular;
+          font-size: 14px;
+          font-style: normal;
+          font-weight: 400;
+          line-height: 22px;
+
+          .anticon-close {
+            font-size: 12px;
+          }
+        }
       }
     }
 
@@ -119,6 +136,10 @@
             }
           }
 
+          .ant-tag {
+            font-size: 12px;
+            line-height: 20px;
+          }
         }
       }
     }

src/views/material-center/components/raw-material/components/add-raw-material-drawer/index.vue

@@ -367,7 +367,6 @@ export default defineComponent({
                     showSearch
                     showArrow
                     maxTagCount={5}
-                    maxTagTextLength={5}
                     options={tagData.value}
                     optionFilterProp="name"
                     field-names={{ label: 'name', value: 'id' }}
@@ -384,25 +383,29 @@ export default defineComponent({
                         const { label, value } = val;
                         if (label.length > 5) {
                           return (
+                            <div class="my-2px">
                               <Tooltip title={label}>
                                 <Tag
                                   closable
                                   onClose={() => (record.tag_ids = record.tag_ids.filter((item) => item !== value))}
-                                class="bg-#F2F3F5 rounded-4px mr-0 px-8px !color-#55585F"
+                                  class="mr-0 !color-#55585F h-20px !lh-20px !text-12px"
                                 >
                                   {label.slice(0, 5) + '...'}
                                 </Tag>
                               </Tooltip>
+                            </div>
                           );
                         } else {
                           return (
+                            <div class="my-2px">
                               <Tag
                                 closable
                                 onClose={() => (record.tag_ids = record.tag_ids.filter((item) => item !== value))}
-                              class="bg-#F2F3F5 rounded-4px mr-0 px-8px !color-#55585F"
+                                class="mr-0 !color-#55585F h-20px !lh-20px !text-12px"
                               >
                                 {label}
                               </Tag>
+                            </div>
                           );
                         }
                       },

src/views/material-center/components/raw-material/components/add-raw-material-drawer/style.scss

@@ -9,9 +9,9 @@
   }
 
   .ant-select {
-    .ant-select-selection-overflow-item {
+    //.ant-select-selection-overflow-item {
-      max-width: 50%;
+    //  max-width: 50%;
-    }
+    //}
   }
 
   .ant-drawer-body {

src/views/material-center/components/raw-material/components/edit-raw-material-modal/index.vue

@@ -1,6 +1,7 @@
 <script lang="tsx">
 import { ref } from 'vue';
 import { Button, Modal, Form, FormItem, Input, message, Select, Tag, Tooltip } from 'ant-design-vue';
+import TextOverTips from '@/components/text-over-tips';
 
 const { TextArea } = Input;
 
@@ -203,7 +204,7 @@ export default {
             <Select
               value={form.value.tag_ids}
               mode="multiple"
-              size="middle"
+              size="large"
               placeholder="请选择标签"
               allowClear
               autoClearSearchValue
@@ -213,7 +214,6 @@ export default {
               maxTagCount={5}
               optionFilterProp="name"
               options={tagOptions.value}
-              maxTagTextLength={5}
               field-names={{ label: 'name', value: 'id' }}
               onChange={handleTagChange}
               onInputKeyDown={(e) => {
@@ -228,25 +228,29 @@ export default {
                   const { label, value } = val;
                   if (label.length > 5) {
                     return (
+                      <div class="my-2px">
                         <Tooltip title={label}>
                           <Tag
                             closable
                             onClose={() => (form.value.tag_ids = form.value.tag_ids.filter((item) => item !== value))}
-                          class="bg-#F2F3F5 rounded-4px mr-0 px-8px !color-#55585F"
+                            class="mr-0"
                           >
-                          {label.slice(0, 5) + '...'}
+                            {`${label.slice(0, 5)}...`}
                           </Tag>
                         </Tooltip>
+                      </div>
                     );
                   } else {
                     return (
+                      <div class="my-2px">
                         <Tag
                           closable
                           onClose={() => (form.value.tag_ids = form.value.tag_ids.filter((item) => item !== value))}
-                        class="bg-#F2F3F5 rounded-4px mr-0 px-8px !color-#55585F"
+                          class=" mr-0 "
                         >
                           {label}
                         </Tag>
+                      </div>
                     );
                   }
                 },

src/views/material-center/components/raw-material/components/table/index.vue

@@ -52,12 +52,11 @@
       </template>
       <template v-else-if="column.dataIndex === 'tags'" #customRender="{ record }">
         <div class="flex flex-wrap gap-4px">
-          <Tag
+          <Tag v-for="tag in record.tags" :key="tag.id" class="mr-0 rounded-4px bg-#F2F3F5 px-8px">
-            v-for="tag in record.tags"
+            <Tooltip v-if="tag.name.length > 5" :title="tag.name">
-            :key="tag.id"
+              <span class="cts !color-#55585F !lh-20px"> {{ `${tag.name.slice(0, 5)}...` }} </span>
-            class="mr-0 h-22px lh-22px rounded-4px bg-#F2F3F5 max-w-76px px-8px"
+            </Tooltip>
-          >
+            <span v-else class="cts !color-#55585F !lh-20px"> {{ tag.name }} </span>
-            <TextOverTips :context="tag.name" :line="1" class="cts !color-#55585F" />
           </Tag>
         </div>
       </template>