ele-admin-plus 1.1.4 → 1.1.5-beta.2

package/lib/ele-tabs/components/tab-title.d.ts

@@ -1,36 +1,50 @@
 import type { PropType } from 'vue';
 import type { DropdownItem } from '../../ele-dropdown/types';
-import type { EleDropdownProps, DropdownInstance } from '../../ele-file-list/types';
+import type { EleDropdownProps, EleDropdownInstance } from '../../ele-app/types/components';
 import type { TabPaneItem, TabEventOption } from '../types';
 declare const _default: import("vue").DefineComponent<{
+    /** 当前选中页签 */
     active: (StringConstructor | NumberConstructor)[];
+    /** 页签标识 */
     tabName: (StringConstructor | NumberConstructor)[];
+    /** 页签标题 */
     label: StringConstructor;
+    /** 页签数据 */
     item: PropType<TabPaneItem>;
+    /** 是否支持右键菜单 */
     contextMenu: PropType<boolean | EleDropdownProps>;
+    /** 右键菜单 */
     contextMenus: PropType<DropdownItem[]>;
+    /** 是否自己处理页签点击事件 */
     handleClick: BooleanConstructor;
 }, {
-    dropdownRef: import("vue").Ref<DropdownInstance>;
+    dropdownRef: import("vue").Ref<EleDropdownInstance>;
     onContextMenu: (command: string) => void;
     onContextVisible: (visible: boolean) => void;
     onClick: (e: MouseEvent) => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     itemClick: (_opt: TabEventOption) => true;
     contextMenu: (_option: TabEventOption) => true;
-    contextOpen: (_ref: DropdownInstance) => true;
+    contextOpen: (_ref: EleDropdownInstance) => true;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    /** 当前选中页签 */
     active: (StringConstructor | NumberConstructor)[];
+    /** 页签标识 */
     tabName: (StringConstructor | NumberConstructor)[];
+    /** 页签标题 */
     label: StringConstructor;
+    /** 页签数据 */
     item: PropType<TabPaneItem>;
+    /** 是否支持右键菜单 */
     contextMenu: PropType<boolean | EleDropdownProps>;
+    /** 右键菜单 */
     contextMenus: PropType<DropdownItem[]>;
+    /** 是否自己处理页签点击事件 */
     handleClick: BooleanConstructor;
 }>> & {
-    onItemClick?: ((_opt: TabEventOption) => any) | undefined;
     onContextMenu?: ((_option: TabEventOption) => any) | undefined;
-    onContextOpen?: ((_ref: DropdownInstance) => any) | undefined;
+    onItemClick?: ((_opt: TabEventOption) => any) | undefined;
+    onContextOpen?: ((_ref: EleDropdownInstance) => any) | undefined;
 }, {
     handleClick: boolean;
 }, {}>;

package/lib/ele-tabs/components/tab-title.js

@@ -5,19 +5,19 @@ const _sfc_main = vue.defineComponent({
   name: "TabTitle",
   components: { EleDropdown },
   props: {
-    // 当前选中页签
+    /** 当前选中页签 */
     active: [String, Number],
-    // 页签标识
+    /** 页签标识 */
     tabName: [String, Number],
-    // 页签标题
+    /** 页签标题 */
     label: String,
-    // 页签数据
+    /** 页签数据 */
     item: Object,
-    // 是否支持右键菜单
+    /** 是否支持右键菜单 */
     contextMenu: [Boolean, Object],
-    // 右键菜单
+    /** 右键菜单 */
     contextMenus: Array,
-    // 是否自己处理页签点击事件
+    /** 是否自己处理页签点击事件 */
     handleClick: Boolean
   },
   emits: {

package/lib/ele-tabs/index.d.ts

@@ -2,7 +2,7 @@ import type { Ref } from 'vue';
 import type { TabPaneName, TabsPaneContext } from 'element-plus';
 import { omit } from '../utils/core';
 import type { ElTabsProps, ElTabsInstance } from '../ele-app/types';
-import type { DropdownInstance } from '../ele-file-list/types';
+import type { EleDropdownInstance } from '../ele-app/types/components';
 import type { DropdownItem } from '../ele-dropdown/types';
 import type { TabPaneItem, TabEventOption } from './types';
 import type { TabTitleInstance } from './props';
@@ -14,7 +14,7 @@ declare const _default: import("vue").DefineComponent<{
     size: import("vue").PropType<import("./types").TabSize>;
     type: import("vue").PropType<import("./types").TabType>;
     center: BooleanConstructor;
-    contextMenu: import("vue").PropType<boolean | import("../ele-file-list/types").EleDropdownProps>;
+    contextMenu: import("vue").PropType<boolean | import("../ele-app/types/components").EleDropdownProps>;
     contextMenus: import("vue").PropType<import("./types").ContextMenus>;
     sortable: BooleanConstructor;
     mousewheel: BooleanConstructor;
@@ -59,14 +59,14 @@ declare const _default: import("vue").DefineComponent<{
     onEdit: (name: TabPaneName | undefined, action: 'remove' | 'add') => void;
     onItemClick: (option: TabEventOption) => void;
     onItemContextMenu: (option: TabEventOption) => void;
-    onItemContextOpen: (ref: DropdownInstance) => void;
+    onItemContextOpen: (ref: EleDropdownInstance) => void;
     onContextmenu: (e: MouseEvent) => void;
     hideAllDropdown: () => void;
     updateActiveBar: () => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     tabItemClick: (_opt: TabEventOption) => boolean;
     tabContextMenu: (_opt: TabEventOption) => boolean;
-    tabContextOpen: (_ref: DropdownInstance) => boolean;
+    tabContextOpen: (_ref: EleDropdownInstance) => boolean;
     tabSortChange: (_data: TabPaneItem[]) => boolean;
     "update:modelValue": (name: TabPaneName) => boolean;
     tabClick: (pane: {
@@ -86,7 +86,7 @@ declare const _default: import("vue").DefineComponent<{
         index: string | undefined;
         isClosable: boolean;
     }, ev: Event) => boolean;
-    tabChange: (name: TabPaneName) => boolean;
+    tabChange: (name: TabPaneName) => boolean; /** 页签移除或新增事件 */
     edit: (paneName: TabPaneName | undefined, action: "add" | "remove") => boolean;
     tabRemove: (name: TabPaneName) => boolean;
     tabAdd: () => boolean;
@@ -98,7 +98,7 @@ declare const _default: import("vue").DefineComponent<{
     size: import("vue").PropType<import("./types").TabSize>;
     type: import("vue").PropType<import("./types").TabType>;
     center: BooleanConstructor;
-    contextMenu: import("vue").PropType<boolean | import("../ele-file-list/types").EleDropdownProps>;
+    contextMenu: import("vue").PropType<boolean | import("../ele-app/types/components").EleDropdownProps>;
     contextMenus: import("vue").PropType<import("./types").ContextMenus>;
     sortable: BooleanConstructor;
     mousewheel: BooleanConstructor;
@@ -133,7 +133,7 @@ declare const _default: import("vue").DefineComponent<{
     "onUpdate:modelValue"?: ((name: TabPaneName) => any) | undefined;
     onTabItemClick?: ((_opt: TabEventOption) => any) | undefined;
     onTabContextMenu?: ((_opt: TabEventOption) => any) | undefined;
-    onTabContextOpen?: ((_ref: DropdownInstance) => any) | undefined;
+    onTabContextOpen?: ((_ref: EleDropdownInstance) => any) | undefined;
     onTabSortChange?: ((_data: TabPaneItem[]) => any) | undefined;
     onTabClick?: ((pane: {
         uid: number;

package/lib/ele-tabs/index.js

@@ -151,7 +151,7 @@ const _sfc_main = vue.defineComponent({
       bindDragSort();
       const el = getHeaderEl();
       if (props$1.mousewheel && el) {
-        el.addEventListener("mousewheel", onMousewheel);
+        el.addEventListener("mousewheel", onMousewheel, { passive: false });
         el.addEventListener("DOMMouseScroll", onFMousewheel);
       }
     };

package/lib/ele-tabs/props.d.ts

@@ -1,27 +1,36 @@
 import type { PropType, ExtractPropTypes } from 'vue';
 import { tabsProps as elTabsProps } from 'element-plus';
-import type { EleDropdownProps, DropdownInstance } from '../ele-file-list/types';
+import type { EleDropdownProps, EleDropdownInstance } from '../ele-app/types/components';
 import type TabTitle from "./components/tab-title";
 import type { TabPaneItem, TabSize, TabType, TabEventOption, ContextMenus } from './types';
 /**
  * 属性
  */
 export declare const tabsProps: {
+    /** 标签页数据 */
     items: {
         type: PropType<TabPaneItem[]>;
         required: boolean;
     };
+    /** 尺寸 */
     size: PropType<TabSize>;
+    /** 风格类型 */
     type: PropType<TabType>;
+    /** 标签是否居中显示 */
     center: BooleanConstructor;
+    /** 是否支持右键菜单 */
     contextMenu: PropType<boolean | EleDropdownProps>;
+    /** 右键菜单 */
     contextMenus: PropType<ContextMenus>;
+    /** 是否支持拖动排序 */
     sortable: BooleanConstructor;
+    /** 是否支持鼠标滚轮滑动 */
     mousewheel: BooleanConstructor;
+    /** 是否自己处理页签点击事件 */
     handleClick: BooleanConstructor;
     activeName: {
         readonly type: PropType<import("element-plus/es/utils").EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>>;
-        readonly required: false;
+        readonly required: false; /** 风格类型 */
         readonly validator: ((val: unknown) => boolean) | undefined;
         __epPropKey: true;
     };
@@ -51,9 +60,13 @@ export type TabsProps = ExtractPropTypes<typeof tabsProps>;
  * 事件
  */
 export declare const tabsEmits: {
+    /** 页签点击事件 */
     tabItemClick: (_opt: TabEventOption) => boolean;
+    /** 页签右键菜单项点击事件 */
     tabContextMenu: (_opt: TabEventOption) => boolean;
-    tabContextOpen: (_ref: DropdownInstance) => boolean;
+    /** 页签右键菜单打开事件 */
+    tabContextOpen: (_ref: EleDropdownInstance) => boolean;
+    /** 拖动排序改变事件 */
     tabSortChange: (_data: TabPaneItem[]) => boolean;
     "update:modelValue": (name: import("element-plus").TabPaneName) => boolean;
     tabClick: (pane: {

package/lib/ele-tabs/props.js

@@ -3,37 +3,37 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const elementPlus = require("element-plus");
 const tabsProps = {
   ...elementPlus.tabsProps,
-  // 标签页数据
+  /** 标签页数据 */
   items: {
     type: Array,
     required: true
   },
-  // 尺寸
+  /** 尺寸 */
   size: String,
-  // 风格类型
+  /** 风格类型 */
   type: String,
-  // 标签是否居中显示
+  /** 标签是否居中显示 */
   center: Boolean,
-  // 是否支持右键菜单
+  /** 是否支持右键菜单 */
   contextMenu: [Boolean, Object],
-  // 右键菜单
+  /** 右键菜单 */
   contextMenus: [Array, Function],
-  // 是否支持拖动排序
+  /** 是否支持拖动排序 */
   sortable: Boolean,
-  // 是否支持鼠标滚轮滑动
+  /** 是否支持鼠标滚轮滑动 */
   mousewheel: Boolean,
-  // 是否自己处理页签点击事件
+  /** 是否自己处理页签点击事件 */
   handleClick: Boolean
 };
 const tabsEmits = {
   ...elementPlus.tabsEmits,
-  // 页签点击事件
+  /** 页签点击事件 */
   tabItemClick: (_opt) => true,
-  // 页签右键菜单项点击事件
+  /** 页签右键菜单项点击事件 */
   tabContextMenu: (_opt) => true,
-  // 页签右键菜单打开事件
+  /** 页签右键菜单打开事件 */
   tabContextOpen: (_ref) => true,
-  // 拖动排序改变事件
+  /** 拖动排序改变事件 */
   tabSortChange: (_data) => true
 };
 const tabPropKeys = Object.keys(elementPlus.tabsProps);

package/lib/ele-tabs/style/css-var.scss

@@ -1,5 +1,6 @@
 @use '../../style/util.scss' as *;
 
+/* 标签页主题变量 */
 @mixin set-tab-var($var) {
   .ele-tabs,
   .ele-tab-tool {

package/lib/ele-tabs/style/index.scss

@@ -59,7 +59,7 @@
     }
   }
 
-  // 右键菜单
+  /* 右键菜单 */
   .el-tabs__item > .el-dropdown {
     color: inherit;
     font-size: inherit;
@@ -69,7 +69,7 @@
     display: block;
   }
 
-  // 标题
+  /* 标题 */
   .ele-tab-title {
     padding: 0 eleVar('tab', 'padding');
     box-sizing: border-box;
@@ -82,7 +82,7 @@
     padding-right: calc(#{$padding} + #{$size} / 2 + #{$padding} / 4);
   }
 
-  // 关闭图标
+  /* 关闭图标 */
   .el-tabs__nav-wrap .el-tabs__nav .el-tabs__item .is-icon-close {
     margin: 0;
     width: eleVar('tab', 'close-size');
@@ -107,12 +107,12 @@
     }
   }
 
-  // 拖动
+  /* 拖动 */
   .el-tabs__item.sortable-ghost {
     opacity: 0;
   }
 
-  // 左右箭头
+  /* 左右箭头 */
   .el-tabs__nav-prev,
   .el-tabs__nav-next {
     flex-shrink: 0;
@@ -126,7 +126,7 @@
     display: flex;
     align-items: center;
     justify-content: center;
-    position: static;
+    position: relative;
     right: auto;
     left: auto;
 
@@ -137,6 +137,34 @@
     &.is-disabled {
       cursor: not-allowed;
     }
+
+    &::before,
+    &::before {
+      content: '';
+      width: 10px;
+      position: absolute;
+      top: 0;
+      bottom: -1px;
+      transition: box-shadow $ele-transition;
+      pointer-events: none;
+      z-index: calc(#{eleVar('tab', 'active-index')} + 1);
+    }
+  }
+
+  .el-tabs__nav-prev::before {
+    right: -10px;
+  }
+
+  .el-tabs__nav-next::before {
+    left: -10px;
+  }
+
+  .el-tabs__nav-prev:not(.is-disabled)::before {
+    box-shadow: eleVar('tab', 'scroll-left-shadow');
+  }
+
+  .el-tabs__nav-next:not(.is-disabled)::before {
+    box-shadow: eleVar('tab', 'scroll-right-shadow');
   }
 
   .el-tabs__nav-next {
@@ -329,7 +357,7 @@
   .el-tabs__item {
     border-radius: eleVar('tab-simple', 'radius');
 
-    // 指示线
+    /* 指示线 */
     &::after {
       content: '';
       width: 0;
@@ -342,7 +370,7 @@
       left: 0;
     }
 
-    // 两侧反圆角
+    /* 两侧反圆角 */
     & > .el-dropdown {
       $size: eleVar('tab-simple', 'angle-size');
       $bg-size: calc(#{$size} * 2);
@@ -406,7 +434,7 @@
       }
     }
 
-    // 选中样式
+    /* 选中样式 */
     &.is-active {
       $bg: eleVar('tab-simple', 'active-bg');
       color: eleVar('tab-simple', 'active-color');
@@ -440,9 +468,13 @@
     }
   }
 
-  .el-tabs__nav-prev:not(.is-disabled):hover,
-  .el-tabs__nav-next:not(.is-disabled):hover {
-    background: eleVar('tab-simple', 'hover-bg');
+  .el-tabs__nav-prev:not(.is-disabled),
+  .el-tabs__nav-next:not(.is-disabled) {
+    border-radius: eleVar('tab-simple', 'radius');
+
+    &:hover {
+      background: eleVar('tab-simple', 'tool-hover-bg');
+    }
   }
 
   .el-tabs__active-bar,
@@ -450,7 +482,7 @@
     display: none;
   }
 
-  // 加左右间距为反圆角留点位置
+  /* 加左右间距为反圆角留点位置 */
   .el-tabs__nav {
     padding: 0 eleVar('tab-simple', 'angle-size');
   }
@@ -519,6 +551,11 @@
   & > .el-tabs__header {
     $height: calc(#{eleVar('tab', 'height')} - #{$space});
 
+    .el-tabs__nav {
+      padding-top: $space;
+      padding-bottom: $space;
+    }
+
     .el-tabs__item {
       height: $height;
       line-height: $height;
@@ -529,8 +566,14 @@
         margin-left: $space;
       }
 
+      &:hover {
+        background: eleVar('tab-button', 'hover-bg');
+      }
+
       &.is-active {
         font-weight: eleVar('tab-button', 'active-weight');
+        background: eleVar('tab-button', 'active-bg');
+        box-shadow: eleVar('tab-button', 'active-shadow');
       }
     }
 
@@ -539,6 +582,11 @@
       width: $height;
       height: $height;
       line-height: $height;
+      margin-top: $space;
+
+      &::before {
+        display: none;
+      }
     }
 
     .el-tabs__active-bar,
@@ -597,7 +645,7 @@
     color: eleVar('tab', 'tool-hover-color');
   }
 
-  // 模拟页签
+  /* 模拟页签 */
   &.is-tab {
     color: eleVar('tab', 'color');
     font-size: eleVar('tab', 'font-size');
@@ -611,14 +659,14 @@
     }
   }
 
-  // 标题
+  /* 标题 */
   .ele-tab-title {
     padding: 0 eleVar('tab', 'padding');
     box-sizing: border-box;
     outline: none;
   }
 
-  // 下拉菜单
+  /* 下拉菜单 */
   & > .el-dropdown {
     color: inherit;
     font-size: inherit;
@@ -635,7 +683,7 @@
   box-sizing: border-box;
   position: relative;
 
-  // 页签
+  /* 页签 */
   & > .ele-tabs {
     flex: 1;
     overflow: hidden;
@@ -645,7 +693,7 @@
     }
   }
 
-  // 取消反圆角预留间距
+  /* 取消反圆角预留间距 */
   .ele-tab-tool.is-tab + .ele-tabs.is-simple,
   .ele-tab-tool.is-tab + .ele-tabs.is-indicator {
     margin-left: calc(0px - eleVar('tab-simple', 'angle-size'));
@@ -655,7 +703,7 @@
     }
   }
 
-  // 小型尺寸
+  /* 小型尺寸 */
   &.is-small .ele-tab-tool {
     height: eleVar('tab-sm', 'height');
     line-height: eleVar('tab-sm', 'height');
@@ -667,7 +715,7 @@
     }
   }
 
-  // 大型尺寸
+  /* 大型尺寸 */
   &.is-large .ele-tab-tool {
     height: eleVar('tab-lg', 'height');
     line-height: eleVar('tab-lg', 'height');
@@ -679,17 +727,17 @@
     }
   }
 
-  // 简约风格和指示器风格
+  /* 简约风格和指示器风格 */
   &.is-simple .ele-tab-tool,
   &.is-indicator .ele-tab-tool {
+    border-radius: eleVar('tab-simple', 'radius');
+
     &:hover {
-      background: eleVar('tab-simple', 'hover-bg');
+      background: eleVar('tab-simple', 'tool-hover-bg');
     }
 
     &.is-tab {
-      border-radius: eleVar('tab-simple', 'radius');
-
-      // 两侧反圆角
+      /* 两侧反圆角 */
       & > .el-dropdown {
         $size: eleVar('tab-simple', 'angle-size');
         $bg-size: calc(#{$size} * 2);
@@ -727,6 +775,7 @@
 
       &:hover {
         color: eleVar('tab-simple', 'hover-color');
+        background: eleVar('tab-simple', 'hover-bg');
         z-index: eleVar('tab', 'hover-index');
 
         & > .el-dropdown {
@@ -798,7 +847,7 @@
     }
   }
 
-  // 按钮风格
+  /* 按钮风格 */
   &.is-button {
     $space: eleVar('tab-button', 'space');
 
@@ -808,14 +857,30 @@
       line-height: calc(#{$height} - #{$space});
       min-width: calc(#{$height} - #{$space});
       border-radius: eleVar('tab-button', 'radius');
-      background: eleVar('tab-button', 'bg');
+      background: eleVar('tab-button', 'hover-bg');
+      margin-top: $space;
+      margin-bottom: $space;
 
       & + .ele-tab-tool {
         margin-left: $space;
       }
 
-      &.is-tab.is-active {
-        font-weight: eleVar('tab-button', 'active-weight');
+      &:hover {
+        box-shadow: eleVar('tab-button', 'active-shadow');
+      }
+
+      &.is-tab {
+        background: eleVar('tab-button', 'bg');
+
+        &:hover {
+          background: eleVar('tab-button', 'hover-bg');
+        }
+
+        &.is-active {
+          font-weight: eleVar('tab-button', 'active-weight');
+          background: eleVar('tab-button', 'active-bg');
+          box-shadow: eleVar('tab-button', 'active-shadow');
+        }
       }
     }
 

package/lib/ele-text/props.d.ts

@@ -5,18 +5,28 @@ import type { TextType, TextSize, TextIcon } from './types';
  * 属性
  */
 export declare const textProps: {
+    /** 渲染标签 */
     tag: {
         type: StringConstructor;
         default: string;
     };
+    /** 类型 */
     type: PropType<TextType>;
+    /** 文字大小 */
     size: PropType<TextSize>;
+    /** 文字删除线 */
     deleted: BooleanConstructor;
+    /** 文字下划线 */
     underline: BooleanConstructor;
+    /** 是否加粗 */
     strong: BooleanConstructor;
+    /** 是否斜体 */
     italic: BooleanConstructor;
+    /** 图标 */
     icon: PropType<TextIcon>;
+    /** 图标属性 */
     iconProps: PropType<ElIconProps>;
+    /** 图标样式 */
     iconStyle: PropType<Partial<import("vue").CSSProperties>>;
 };
 export type TextProps = ExtractPropTypes<typeof textProps>;

package/lib/ele-text/props.js

@@ -1,28 +1,28 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const textProps = {
-  // 渲染标签
+  /** 渲染标签 */
   tag: {
     type: String,
     default: "div"
   },
-  // 类型
+  /** 类型 */
   type: String,
-  // 文字大小
+  /** 文字大小 */
   size: String,
-  // 文字删除线
+  /** 文字删除线 */
   deleted: Boolean,
-  // 文字下划线
+  /** 文字下划线 */
   underline: Boolean,
-  // 是否加粗
+  /** 是否加粗 */
   strong: Boolean,
-  // 是否斜体
+  /** 是否斜体 */
   italic: Boolean,
-  // 图标
+  /** 图标 */
   icon: [String, Object, Function],
-  // 图标属性
+  /** 图标属性 */
   iconProps: Object,
-  // 图标样式
+  /** 图标样式 */
   iconStyle: Object
 };
 const textPropKeys = Object.keys(textProps);

package/lib/ele-text/style/css-var.scss

@@ -1,5 +1,6 @@
 @use '../../style/util.scss' as *;
 
+/* 文本主题变量 */
 @mixin set-text-var($var) {
   .ele-text {
     @include set-ele-var('text', $var);