feat: 页面标签组件样式与功能优化

src/layouts/BasicLayout.tsx

@@ -79,7 +79,15 @@ export default defineComponent({
 
     const { menuItems } = useMenuStore();
     const { phone } = useUserStore();
-    const { tabs, cachedViews, removeTab } = useTabsStore();
+    const {
+      tabs,
+      cachedViews,
+      removeTab,
+      removeLeftTabs,
+      removeRightTabs,
+      removeOtherTabs,
+      removeAllTabs,
+    } = useTabsStore();
     const { breadcrumbs } = useBreadcrumb();
 
     const selectedKeys = computed<string[]>(() => [route.path]);
@@ -160,6 +168,22 @@ export default defineComponent({
       removeTab(key);
     };
 
+    const handleCloseLeftTabs = (key: string) => {
+      removeLeftTabs(key);
+    };
+
+    const handleCloseRightTabs = (key: string) => {
+      removeRightTabs(key);
+    };
+
+    const handleCloseOtherTabs = (key: string) => {
+      removeOtherTabs(key);
+    };
+
+    const handleCloseAllTabs = () => {
+      removeAllTabs();
+    };
+
     return () => (
       <Layout class={styles.basicLayoutMain}>
         <Sider style={siderStyle} collapsed={collapsed.value} trigger={null} collapsible>
@@ -241,6 +265,10 @@ export default defineComponent({
                 activeKey={activeTabKey.value}
                 onChange={handleTabChange}
                 onClose={handleTabClose}
+                onCloseLeft={handleCloseLeftTabs}
+                onCloseRight={handleCloseRightTabs}
+                onCloseOther={handleCloseOtherTabs}
+                onCloseAll={handleCloseAllTabs}
               />
             </div>
           </Header>