chore: format code

2024-06-09 13:31:43 +08:00
parent 68229a4d2f
commit 35c3dd78ec
65 changed files with 419 additions and 494 deletions
--- a/packages/@core/uikit/layout-ui/src/components/layout-footer.vue
+++ b/packages/@core/uikit/layout-ui/src/components/layout-footer.vue
@@ -65,8 +65,8 @@ const style = computed((): CSSProperties => {
 <template>
  <footer
    :class="b()"
-    class="bottom-0 w-full transition-all duration-200"
    :style="style"
+    class="bottom-0 w-full transition-all duration-200"
  >
    <slot></slot>
  </footer>
--- a/packages/@core/uikit/layout-ui/src/components/layout-side.vue
+++ b/packages/@core/uikit/layout-ui/src/components/layout-side.vue
@@ -267,7 +267,7 @@ function handleScroll(event: Event) {
    <div v-if="slots.logo" :style="headerStyle">
      <slot name="logo"></slot>
    </div>
-    <ScrollArea :style="contentStyle" :on-scroll="handleScroll">
+    <ScrollArea :on-scroll="handleScroll" :style="contentStyle">
      <div :class="[e('shadow'), { scrolled }]"></div>
      <slot></slot>
    </ScrollArea>
@@ -282,8 +282,8 @@ function handleScroll(event: Event) {
      v-if="isSideMixed"
      ref="asideRef"
      :class="e('extra')"
-      class="transition-[width] duration-200"
      :style="extraStyle"
+      class="transition-[width] duration-200"
    >
      <SideCollapseButton
        v-if="isSideMixed && expandOnHover"
@@ -300,9 +300,9 @@ function handleScroll(event: Event) {
        <slot name="extra-title"></slot>
      </div>
      <ScrollArea
-        :style="extraContentStyle"
        :class="e('extra-content')"
        :on-scroll="handleScroll"
+        :style="extraContentStyle"
      >
        <div :class="[e('shadow'), { scrolled }]"></div>
        <slot name="extra"></slot>
--- a/packages/@core/uikit/layout-ui/src/vben-layout.ts
+++ b/packages/@core/uikit/layout-ui/src/vben-layout.ts
@@ -46,6 +46,11 @@ interface VbenLayoutProps {
   * @default #fff
   */
  footerBackgroundColor?: string;
+  /**
+   * footer 是否可见
+   * @default false
+   */
+  footerEnable?: boolean;
  /**
   * footer 是否固定
   * @default true
@@ -56,11 +61,6 @@ interface VbenLayoutProps {
   * @default 32
   */
  footerHeight?: number;
-  /**
-   * footer 是否可见
-   * @default false
-   */
-  footerVisible?: boolean;
  /**
   * 背景颜色
   * @default #fff
--- a/packages/@core/uikit/layout-ui/src/vben-layout.vue
+++ b/packages/@core/uikit/layout-ui/src/vben-layout.vue
@@ -26,10 +26,10 @@ const props = withDefaults(defineProps<Props>(), {
  contentPaddingLeft: 0,
  contentPaddingRight: 0,
  contentPaddingTop: 0,
+  footerEnable: false,
  // footerBackgroundColor: '#fff',
  footerFixed: true,
  footerHeight: 32,
-  footerVisible: false,
  // headerBackgroundColor: 'hsl(var(--color-background))',
  headerHeight: 50,
  headerHeightOffset: 10,
@@ -323,7 +323,7 @@ const contentStyle = computed((): CSSProperties => {
      (!isHeaderAuto.value || scrollY.value < headerWrapperHeight.value)
        ? `${headerWrapperHeight.value}px`
        : 0,
-    paddingBottom: `${props.footerVisible ? props.footerHeight : 0}px`,
+    paddingBottom: `${props.footerEnable ? props.footerHeight : 0}px`,
  };
 });

@@ -465,19 +465,19 @@ function handleOpenMenu() {
    <LayoutSide
      v-if="sideVisibleState"
      v-model:collapse="sideCollapse"
-      v-model:extra-collapse="sideExtraCollapse"
-      v-model:expand-on-hovering="sideExpandOnHovering"
      v-model:expand-on-hover="sideExpandOnHover"
+      v-model:expand-on-hovering="sideExpandOnHovering"
+      v-model:extra-collapse="sideExtraCollapse"
      v-model:extra-visible="sideExtraVisible"
-      :dom-visible="!isMobile"
-      :fixed-extra="sideExpandOnHover"
-      :mixed-width="sideMixedWidth"
-      :header-height="isMixedNav ? 0 : getHeaderHeight"
      :collapse-width="getSideCollapseWidth"
+      :dom-visible="!isMobile"
+      :extra-width="getExtraWidth"
+      :fixed-extra="sideExpandOnHover"
+      :header-height="isMixedNav ? 0 : getHeaderHeight"
      :is-side-mixed="isSideMixedNav"
+      :mixed-width="sideMixedWidth"
      :padding-top="sidePaddingTop"
      :show="showSide"
-      :extra-width="getExtraWidth"
      :width="getSideWidth"
      :z-index="sideZIndex"
      v-bind="sideFace"
@@ -513,16 +513,16 @@ function handleOpenMenu() {
          v-if="headerVisible"
          :full-width="!isSideMode"
          :height="getHeaderHeight"
-          :show="!fullContent && !headerHidden"
-          :side-hidden="sideHidden"
-          :show-toggle-btn="showHeaderToggleButton"
-          :width="mainStyle.width"
          :is-mixed-nav="isMixedNav"
          :is-mobile="isMobile"
-          :z-index="headerZIndex"
+          :show="!fullContent && !headerHidden"
+          :show-toggle-btn="showHeaderToggleButton"
+          :side-hidden="sideHidden"
          :side-width="sideWidth"
-          @toggle-menu="handleToggleMenu"
+          :width="mainStyle.width"
+          :z-index="headerZIndex"
          @open-menu="handleOpenMenu"
+          @toggle-menu="handleToggleMenu"
        >
          <template v-if="showHeaderLogo" #logo>
            <slot name="logo"></slot>
@@ -540,8 +540,6 @@ function handleOpenMenu() {

      <!-- </div> -->
      <LayoutContent
-        class="transition-[margin-top] duration-200"
-        :style="contentStyle"
        :content-compact="contentCompact"
        :content-compact-width="contentCompactWidth"
        :padding="contentPadding"
@@ -549,12 +547,14 @@ function handleOpenMenu() {
        :padding-left="contentPaddingLeft"
        :padding-right="contentPaddingRight"
        :padding-top="contentPaddingTop"
+        :style="contentStyle"
+        class="transition-[margin-top] duration-200"
      >
        <slot name="content"></slot>
      </LayoutContent>

      <LayoutFooter
-        v-if="footerVisible"
+        v-if="footerEnable"
        :fixed="footerFixed"
        :height="footerHeight"
        :show="!fullContent"
@@ -566,8 +566,8 @@ function handleOpenMenu() {
    </div>
    <div
      v-if="maskVisible"
-      class="fixed left-0 top-0 h-full w-full bg-[rgb(0_0_0_/_40%)] transition-[background-color] duration-200"
      :style="maskStyle"
+      class="fixed left-0 top-0 h-full w-full bg-[rgb(0_0_0_/_40%)] transition-[background-color] duration-200"
      @click="handleClickMask"
    ></div>
  </div>
--- a/packages/@core/uikit/menu-ui/src/components/menu.vue
+++ b/packages/@core/uikit/menu-ui/src/components/menu.vue
@@ -334,7 +334,7 @@ function removeMenuItem(item: MenuItemRegistered) {
      <template v-for="item in getSlot.slotDefault" :key="item.key">
        <component :is="item" />
      </template>
-      <SubMenu path="sub-menu-more" is-sub-menu-more>
+      <SubMenu is-sub-menu-more path="sub-menu-more">
        <template #title>
          <IcRoundMoreHoriz />
        </template>
--- a/packages/@core/uikit/menu-ui/src/components/sub-menu.vue
+++ b/packages/@core/uikit/menu-ui/src/components/sub-menu.vue
@@ -214,11 +214,11 @@ onBeforeUnmount(() => {
        <template #trigger>
          <SubMenuContent
            :class="is('active', active)"
+            :icon="icon"
+            :is-menu-more="isSubMenuMore"
            :is-top-level-menu-submenu="isTopLevelMenuSubmenu"
            :level="currentLevel"
            :path="path"
-            :icon="icon"
-            :is-menu-more="isSubMenuMore"
            @click.stop="handleClick"
          >
            <template #title>
@@ -244,12 +244,12 @@ onBeforeUnmount(() => {

    <template v-else>
      <SubMenuContent
+        :class="is('active', active)"
+        :icon="icon"
+        :is-menu-more="isSubMenuMore"
        :is-top-level-menu-submenu="isTopLevelMenuSubmenu"
        :level="currentLevel"
        :path="path"
-        :icon="icon"
-        :is-menu-more="isSubMenuMore"
-        :class="is('active', active)"
        @click.stop="handleClick"
      >
        <slot name="content"></slot>
--- a/packages/@core/uikit/menu-ui/src/sub-menu.vue
+++ b/packages/@core/uikit/menu-ui/src/sub-menu.vue
@@ -37,19 +37,19 @@ const hasChildren = computed(() => {
  <MenuItem
    v-if="!hasChildren"
    :key="menu.path"
-    :path="menu.path"
-    :icon="menu.icon"
    :badge="menu.badge"
    :badge-type="menu.badgeType"
    :badge-variants="menu.badgeVariants"
+    :icon="menu.icon"
+    :path="menu.path"
  >
    <template #title>{{ menu.name }}</template>
  </MenuItem>
  <SubMenuComp
    v-else
    :key="`${menu.path}_sub`"
-    :path="menu.path"
    :icon="menu.icon"
+    :path="menu.path"
  >
    <template #content>
      <VbenMenuBadge
--- a/packages/@core/uikit/shadcn-ui/src/components/avatar/avatar.vue
+++ b/packages/@core/uikit/shadcn-ui/src/components/avatar/avatar.vue
@@ -41,8 +41,8 @@ const text = computed(() => {
    </Avatar>
    <span
      v-if="dot"
-      class="border-background absolute bottom-0 right-0 size-3 rounded-full border-2"
      :class="dotClass"
+      class="border-background absolute bottom-0 right-0 size-3 rounded-full border-2"
    >
    </span>
  </div>
--- a/packages/@core/uikit/shadcn-ui/src/components/breadcrumb/breadcrumb-background.vue
+++ b/packages/@core/uikit/shadcn-ui/src/components/breadcrumb/breadcrumb-background.vue
@@ -34,8 +34,8 @@ function handleClick(path?: string) {
            <span class="flex-center h-full">
              <VbenIcon
                v-if="item.icon && showIcon"
-                class="mr-1 size-5 flex-shrink-0"
                :icon="item.icon"
+                class="mr-1 size-5 flex-shrink-0"
              />
              <span
                :class="{
--- a/packages/@core/uikit/shadcn-ui/src/components/breadcrumb/breadcrumb.vue
+++ b/packages/@core/uikit/shadcn-ui/src/components/breadcrumb/breadcrumb.vue
@@ -53,8 +53,8 @@ function handleClick(path?: string) {
                <DropdownMenuTrigger class="flex items-center gap-1">
                  <VbenIcon
                    v-if="item.icon && showIcon"
-                    class="size-5"
                    :icon="item.icon"
+                    class="size-5"
                  />
                  {{ item.title }}
                  <IcRoundKeyboardArrowDown class="size-5" />
@@ -79,9 +79,9 @@ function handleClick(path?: string) {
              <div class="flex-center">
                <VbenIcon
                  v-if="item.icon && showIcon"
-                  class="mr-1 size-4"
                  :class="{ 'size-5': item.isHome }"
                  :icon="item.icon"
+                  class="mr-1 size-4"
                />
                {{ item.title }}
              </div>
@@ -90,9 +90,9 @@ function handleClick(path?: string) {
              <div class="flex-center">
                <VbenIcon
                  v-if="item.icon && showIcon"
-                  class="mr-1 size-4"
                  :class="{ 'size-5': item.isHome }"
                  :icon="item.icon"
+                  class="mr-1 size-4"
                />
                {{ item.title }}
              </div>
--- a/packages/@core/uikit/shadcn-ui/src/components/context-menu/context-menu.vue
+++ b/packages/@core/uikit/shadcn-ui/src/components/context-menu/context-menu.vue
@@ -72,10 +72,10 @@ function handleClick(menu: IContextMenuItem) {
    >
      <template v-for="menu in menusView" :key="menu.key">
        <ContextMenuItem
-          :inset="menu.inset || !menu.icon"
-          :disabled="menu.disabled"
-          class="cursor-pointer"
          :class="itemClass"
+          :disabled="menu.disabled"
+          :inset="menu.inset || !menu.icon"
+          class="cursor-pointer"
          @click="handleClick(menu)"
        >
          <component
--- a/packages/@core/uikit/shadcn-ui/src/components/dropdown-menu/dropdown-radio-menu.vue
+++ b/packages/@core/uikit/shadcn-ui/src/components/dropdown-menu/dropdown-radio-menu.vue
@@ -22,24 +22,24 @@ function handleItemClick(value: string) {
 </script>
 <template>
  <DropdownMenu>
-    <DropdownMenuTrigger class="flex items-center gap-1" as-child>
+    <DropdownMenuTrigger as-child class="flex items-center gap-1">
      <slot></slot>
    </DropdownMenuTrigger>
    <DropdownMenuContent align="start">
      <DropdownMenuGroup>
        <template v-for="menu in menus" :key="menu.key">
          <DropdownMenuItem
-            class="data-[state=checked]:bg-accent data-[state=checked]:text-accent-foreground text-foreground/80 mb-1 cursor-pointer"
            :class="
              menu.key === modelValue ? 'bg-accent text-accent-foreground' : ''
            "
+            class="data-[state=checked]:bg-accent data-[state=checked]:text-accent-foreground text-foreground/80 mb-1 cursor-pointer"
            @click="handleItemClick(menu.key)"
          >
            <component :is="menu.icon" v-if="menu.icon" class="mr-2 size-4" />
            <span
              v-if="!menu.icon"
-              class="mr-2 size-1.5 rounded-full"
              :class="menu.key === modelValue ? 'bg-foreground' : ''"
+              class="mr-2 size-1.5 rounded-full"
            ></span>
            {{ menu.text }}
          </DropdownMenuItem>
--- a/packages/@core/uikit/shadcn-ui/src/components/floating-button-group/floating-button-group.vue
+++ b/packages/@core/uikit/shadcn-ui/src/components/floating-button-group/floating-button-group.vue
@@ -16,18 +16,18 @@ const handleMenuItemClick = (_item) => {
 <template>
  <div class="fixed bottom-5 right-5 flex flex-col-reverse items-center gap-2">
    <button
-      class="flex h-12 w-12 items-center justify-center rounded-full bg-blue-500 text-xl text-white transition-transform duration-300"
      :class="{ 'rotate-45': isMenuOpen }"
+      class="flex h-12 w-12 items-center justify-center rounded-full bg-blue-500 text-xl text-white transition-transform duration-300"
      @click="toggleMenu"
    >
      ✖
    </button>
    <div
-      class="absolute bottom-16 right-0 flex flex-col-reverse gap-2 transition-all duration-300"
      :class="{
        'visible translate-y-0 opacity-100': isMenuOpen,
        'invisible translate-y-2 opacity-0': !isMenuOpen,
      }"
+      class="absolute bottom-16 right-0 flex flex-col-reverse gap-2 transition-all duration-300"
    >
      <button
        v-for="(item, index) in menuItems"
--- a/packages/@core/uikit/shadcn-ui/src/components/input-password/password-strength.vue
+++ b/packages/@core/uikit/shadcn-ui/src/components/input-password/password-strength.vue
@@ -54,11 +54,11 @@ function checkPasswordStrength(password: string) {
        class="dark:bg-input-background bg-heavy relative mr-1 h-1.5 w-1/5 rounded-sm last:mr-0"
      >
        <span
-          class="absolute left-0 h-full w-0 rounded-sm transition-all duration-500"
          :style="{
            backgroundColor: currentColor,
            width: currentStrength >= index ? '100%' : '',
          }"
+          class="absolute left-0 h-full w-0 rounded-sm transition-all duration-500"
        ></span>
      </div>
    </template>
--- a/packages/@core/uikit/shadcn-ui/src/components/input/input.vue
+++ b/packages/@core/uikit/shadcn-ui/src/components/input/input.vue
@@ -32,8 +32,8 @@ const inputClass = computed(() => {
      :id="name"
      v-model="modelValue"
      :class="[props.class, inputClass]"
-      class="border-input bg-input-background ring-offset-background placeholder:text-muted-foreground focus-visible:ring-ring focus:border-primary flex h-10 w-full rounded-md border p-2 text-sm file:border-0 file:bg-transparent file:text-sm file:font-medium focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50"
      autocomplete="off"
+      class="border-input bg-input-background ring-offset-background placeholder:text-muted-foreground focus-visible:ring-ring focus:border-primary flex h-10 w-full rounded-md border p-2 text-sm file:border-0 file:bg-transparent file:text-sm file:font-medium focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50"
      required
      type="text"
      v-bind="$attrs"
--- a/packages/@core/uikit/shadcn-ui/src/components/logo/logo.vue
+++ b/packages/@core/uikit/shadcn-ui/src/components/logo/logo.vue
@@ -51,16 +51,16 @@ const logoClass = computed(() => {
 </script>

 <template>
-  <div class="group flex h-full items-center text-lg" :class="logoClass">
+  <div :class="logoClass" class="group flex h-full items-center text-lg">
    <a
+      :class="$attrs.class"
      :href="href"
      class="flex h-full items-center gap-2 overflow-hidden px-3 font-semibold leading-normal transition-all duration-500"
-      :class="$attrs.class"
    >
      <img
        v-if="src"
-        :src="src"
        :alt="alt"
+        :src="src"
        :width="logoSize"
        class="relative rounded-none bg-transparent"
      />
--- a/packages/@core/uikit/shadcn-ui/src/components/menu-badge/menu-badge-dot.vue
+++ b/packages/@core/uikit/shadcn-ui/src/components/menu-badge/menu-badge-dot.vue
@@ -14,15 +14,15 @@ withDefaults(defineProps<Props>(), {
 <template>
  <span class="relative mr-1 flex size-1.5">
    <span
-      class="absolute inline-flex h-full w-full animate-ping rounded-full opacity-75"
      :class="dotClass"
      :style="dotStyle"
+      class="absolute inline-flex h-full w-full animate-ping rounded-full opacity-75"
    >
    </span>
    <span
-      class="relative inline-flex size-1.5 rounded-full"
      :class="dotClass"
      :style="dotStyle"
+      class="relative inline-flex size-1.5 rounded-full"
    ></span>
  </span>
 </template>
--- a/packages/@core/uikit/shadcn-ui/src/components/menu-badge/menu-badge.vue
+++ b/packages/@core/uikit/shadcn-ui/src/components/menu-badge/menu-badge.vue
@@ -43,7 +43,7 @@ const badgeStyle = computed(() => {
 });
 </script>
 <template>
-  <span v-if="isDot || badge" class="absolute right-5" :class="$attrs.class">
+  <span v-if="isDot || badge" :class="$attrs.class" class="absolute right-5">
    <BadgeDot v-if="isDot" :dot-class="badgeClass" :dot-style="badgeStyle" />
    <div
      v-else
--- a/packages/@core/uikit/shadcn-ui/src/components/pin-input/input.vue
+++ b/packages/@core/uikit/shadcn-ui/src/components/pin-input/input.vue
@@ -56,10 +56,10 @@ function handleComplete(e: string[]) {
    <PinInput
      :id="name"
      v-model="inputValue"
+      :class="inputClass"
+      class="flex justify-between"
      otp
      placeholder="○"
-      class="flex justify-between"
-      :class="inputClass"
      type="number"
      @complete="handleComplete"
    >
@@ -71,10 +71,10 @@ function handleComplete(e: string[]) {
        />
      </PinInputGroup>
      <VbenButton
+        :loading="btnLoading"
        class="w-[300px] xl:w-full"
        size="lg"
        variant="outline"
-        :loading="btnLoading"
        @click="handleSendCode"
      >
        {{ btnText }}
--- a/packages/@core/uikit/shadcn-ui/src/components/ui/breadcrumb/Breadcrumb.vue
+++ b/packages/@core/uikit/shadcn-ui/src/components/ui/breadcrumb/Breadcrumb.vue
@@ -7,7 +7,7 @@ const props = defineProps<{
 </script>

 <template>
-  <nav aria-label="breadcrumb" role="navigation" :class="props.class">
+  <nav :class="props.class" aria-label="breadcrumb" role="navigation">
    <slot></slot>
  </nav>
 </template>
--- a/packages/@core/uikit/shadcn-ui/src/components/ui/breadcrumb/BreadcrumbEllipsis.vue
+++ b/packages/@core/uikit/shadcn-ui/src/components/ui/breadcrumb/BreadcrumbEllipsis.vue
@@ -12,9 +12,9 @@ const props = defineProps<{

 <template>
  <span
-    role="presentation"
-    aria-hidden="true"
    :class="cn('flex h-9 w-9 items-center justify-center', props.class)"
+    aria-hidden="true"
+    role="presentation"
  >
    <slot>
      <DotsHorizontalIcon class="h-4 w-4" />
--- a/packages/@core/uikit/shadcn-ui/src/components/ui/breadcrumb/BreadcrumbPage.vue
+++ b/packages/@core/uikit/shadcn-ui/src/components/ui/breadcrumb/BreadcrumbPage.vue
@@ -10,10 +10,10 @@ const props = defineProps<{

 <template>
  <span
-    role="link"
-    aria-disabled="true"
-    aria-current="page"
    :class="cn('text-foreground font-normal', props.class)"
+    aria-current="page"
+    aria-disabled="true"
+    role="link"
  >
    <slot></slot>
  </span>
--- a/packages/@core/uikit/shadcn-ui/src/components/ui/breadcrumb/BreadcrumbSeparator.vue
+++ b/packages/@core/uikit/shadcn-ui/src/components/ui/breadcrumb/BreadcrumbSeparator.vue
@@ -12,9 +12,9 @@ const props = defineProps<{

 <template>
  <li
-    role="presentation"
-    aria-hidden="true"
    :class="cn('[&>svg]:size-3.5', props.class)"
+    aria-hidden="true"
+    role="presentation"
  >
    <slot>
      <ChevronRightIcon />
--- a/packages/@core/uikit/shadcn-ui/src/components/ui/scroll-area/ScrollArea.vue
+++ b/packages/@core/uikit/shadcn-ui/src/components/ui/scroll-area/ScrollArea.vue
@@ -37,8 +37,8 @@ const delegatedProps = computed(() => {
    :class="cn('relative overflow-hidden', props.class)"
  >
    <ScrollAreaViewport
-      class="h-full w-full rounded-[inherit]"
      as-child
+      class="h-full w-full rounded-[inherit]"
      @scroll="onScroll"
    >
      <slot></slot>
--- a/packages/@core/uikit/tabs-ui/src/components/chrome-tabs/tab-background.vue
+++ b/packages/@core/uikit/tabs-ui/src/components/chrome-tabs/tab-background.vue
@@ -12,10 +12,10 @@ const { b, e } = useNamespace('chrome-tab-background');
  <div :class="b()">
    <div :class="e('divider')"></div>
    <div :class="e('content')"></div>
-    <svg width="10" height="10" :class="e('before')">
+    <svg :class="e('before')" height="10" width="10">
      <path d="M 0 10 A 10 10 0 0 0 10 0 L 10 10 Z" />
    </svg>
-    <svg width="10" height="10" :class="e('after')">
+    <svg :class="e('after')" height="10" width="10">
      <path d="M 0 0 A 10 10 0 0 0 10 10 L 0 10 Z" />
    </svg>
  </div>
--- a/packages/@core/uikit/tabs-ui/src/components/chrome-tabs/tab.vue
+++ b/packages/@core/uikit/tabs-ui/src/components/chrome-tabs/tab.vue
@@ -39,7 +39,7 @@ function handleUnPushPin() {

 <template>
  <div :class="[b()]">
-    <VbenContextMenu :menus="menus" :handler-data="tab" item-class="pr-4">
+    <VbenContextMenu :handler-data="tab" :menus="menus" item-class="pr-4">
      <div class="h-full">
        <TabBackground />
        <div :class="e('content')" :title="title">
--- a/packages/@core/uikit/tabs-ui/src/components/chrome-tabs/tabs.vue
+++ b/packages/@core/uikit/tabs-ui/src/components/chrome-tabs/tabs.vue
@@ -89,18 +89,18 @@ function handleUnPushPin(tab: TabItem) {
        <Tab
          v-for="(tab, i) in tabsView"
          :key="tab.key"
-          :menus="menus"
-          :tab="tab"
-          :icon="tab.icon"
-          :title="tab.title"
-          :show-icon="showIcon"
          :affix-tab="tab.affixTab"
-          :only-one="tabsView.length <= 1"
          :class="[e('tab'), is('active', tab.key === active)]"
+          :icon="tab.icon"
+          :menus="menus"
+          :only-one="tabsView.length <= 1"
+          :show-icon="showIcon"
          :style="{
            width: `${tabWidth}px`,
            left: `${(tabWidth - gap * 2) * i}px`,
          }"
+          :tab="tab"
+          :title="tab.title"
          @click="active = tab.key"
          @close="() => handleClose(tab.key)"
          @un-push-pin="() => handleUnPushPin(tab)"