重构 Mask

dev/src/views/ui/mask.vue

@@ -2,10 +2,9 @@
   <XMask
     :menus="menus"
     :favorites="favorites"
-    manual
-    @select="onMenuSelect"
+    :menuAdapter="menuAdapter"
     :defaultActiveMenu="defaultActiveMenu"
-    homepage="/ui/mask"
+    home="/ui/mask"
     :tabs="20"
     :actions="actions"
     theme
@@ -40,11 +39,14 @@
     }).then((res) => res.data);
   };
 
-  const onMenuSelect = (menu: MenuDataItem) => {
-    router.push({
-      path: '/ui/mask/page',
-      query: { id: menu.id }
-    });
+  const menuAdapter = (menu: MenuDataItem) => {
+    return {
+      ...menu,
+      url:
+        !menu.type || menu.type === 'route'
+          ? `/ui/mask/page?id=${menu.id}`
+          : menu.url
+    };
   };
 
   const defaultActiveMenu = (

dev/src/views/ui/pages/index.vue

@@ -11,25 +11,26 @@
   import { ref } from 'vue';
   import { ElInput, ElButton } from 'element-plus';
   import { useRoute, useRouter } from 'vue-router';
-  import { useMask } from '@vtj/ui';
+  import { useMask, MaskTab } from '@vtj/ui';
   const route = useRoute();
   const router = useRouter();
   const inputValue = ref('');
   const mask = useMask();
   const onClick = () => {
     router.push('/ui/mask/subpage');
-    mask.exposed?.addTab({
-      menu: {
-        id: 'aaaaa',
-        title: '测试'
-      },
-      closable: true
-    });
   };
 
   defineOptions({
-    tabAdapter() {
-      console.log('component tabAdapter');
-    }
+    name: 'InnerPage'
+  });
+
+  const defineTab = async () => {
+    return {
+      // title: '自定义标签'
+    };
+  };
+
+  defineExpose({
+    defineTab
   });
 </script>

dev/src/views/ui/pages/subpage.vue

@@ -2,10 +2,16 @@
   <div>Subpage</div>
 </template>
 
-<script type="ts" setup>
-  import {useMask} from '@vtj/ui'
+<script lang="ts" setup>
+  import { useMask } from '@vtj/ui';
+  const defineTab = () => {
+    return {
+      title: '二级页面'
+    };
+  };
 
-    // const mask = useMask();
-    // mask.exposed.openTab('/ui/mask/subpage', {title:'测试跳转'});
-    // console.log('mask', mask)
+
+  defineExpose({
+    defineTab
+  });
 </script>