perf(table): optimize effect performance

src/layouts/default/index.less

@@ -103,7 +103,7 @@
     padding: 0;
     line-height: @multiple-height;
     background: @border-color-shallow-light;
-    box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.12);
+    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
   }
 }
 

src/layouts/default/multitabs/TabContent.tsx

@@ -5,7 +5,7 @@ import { getScaleAction, TabContentProps } from './tab.data';
 import { defineComponent, unref, computed } from 'vue';
 import { Dropdown } from '/@/components/Dropdown/index';
 import Icon from '/@/components/Icon/index';
-import { DoubleRightOutlined } from '@ant-design/icons-vue';
+import { RightOutlined } from '@ant-design/icons-vue';
 import { appStore } from '/@/store/modules/app';
 
 import { TabContentEnum } from './tab.data';
@@ -74,7 +74,7 @@ export default defineComponent({
     function renderExtraContent() {
       return (
         <span class={`multiple-tabs-content__extra `}>
-          <DoubleRightOutlined />
+          <RightOutlined />
         </span>
       );
     }

src/layouts/default/multitabs/index.less

@@ -20,6 +20,7 @@
 
       .ant-tabs-tab {
         height: calc(@multiple-height - 2px);
+        padding-right: 12px;
         line-height: calc(@multiple-height - 2px);
         color: @text-color-call-out;
         background: @white;
@@ -37,17 +38,10 @@
           &:hover {
             svg {
               width: 0.8em;
-              transition: all 0.1s;
             }
           }
         }
 
-        &:hover {
-          .ant-tabs-close-x {
-            display: block;
-          }
-        }
-
         > div {
           display: flex;
           justify-content: center;
@@ -106,9 +100,10 @@
     width: @multiple-height;
     height: @multiple-height;
     line-height: @multiple-height;
-    color: @primary-color;
+    color: #999;
     text-align: center;
     cursor: pointer;
+    border-left: 1px solid #eee;
     // box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
 
     span[role='img'] {