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

package/es/ele-text/style/index.scss

@@ -9,7 +9,7 @@
   font-size: elVar('font-size', 'base');
   box-sizing: border-box;
 
-  // 类型
+  /* 类型 */
   &.is-heading {
     color: elVar('text-color', 'primary');
     font-weight: eleVar('text', 'heading-weight');
@@ -43,7 +43,7 @@
     color: elVar('color-info');
   }
 
-  // 尺寸
+  /* 尺寸 */
   &.is-xs {
     font-size: elVar('font-size', 'extra-small');
   }
@@ -72,7 +72,7 @@
     font-size: eleVar('text', 'xxxl');
   }
 
-  // 其它
+  /* 其它 */
   &.is-delete {
     text-decoration: line-through;
   }
@@ -93,7 +93,7 @@
     font-style: italic;
   }
 
-  // 图标
+  /* 图标 */
   &.is-icon > .el-icon {
     vertical-align: -2px;
   }

package/es/ele-tool/props.d.ts

@@ -3,11 +3,14 @@ import type { PropType, ExtractPropTypes } from 'vue';
  * 属性
  */
 export declare const toolProps: {
+    /** 提示文字 */
     title: StringConstructor;
+    /** 提示方向 */
     placement: {
         type: PropType<import("element-plus/es/utils").EpPropMergeType<StringConstructor, import("element-plus").Placement, unknown> | undefined>;
         default: string;
     };
+    /** 是否禁用提示 */
     disabled: BooleanConstructor;
 };
 export type ToolProps = ExtractPropTypes<typeof toolProps>;

package/es/ele-tool/props.js

@@ -1,12 +1,12 @@
 const toolProps = {
-  // 提示文字
+  /** 提示文字 */
   title: String,
-  // 提示方向
+  /** 提示方向 */
   placement: {
     type: String,
     default: "top"
   },
-  // 是否禁用提示
+  /** 是否禁用提示 */
   disabled: Boolean
 };
 export {

package/es/ele-tool/style/css-var.scss

@@ -1,5 +1,6 @@
 @use '../../style/util.scss' as *;
 
+/* 工具按钮主题变量 */
 @mixin set-tool-var($var) {
   .ele-tool {
     @include set-ele-var('tool', $var);

package/es/ele-tool/style/index.scss

@@ -47,7 +47,6 @@
   }
 }
 
-// 工具栏
 .ele-toolbar .ele-tool {
   flex-shrink: 0;
   margin-top: calc(#{eleVar('toolbar', 'space')} / 2);
@@ -56,7 +55,7 @@
   margin-right: 0;
 }
 
-// 朴素风格
+/* 朴素风格 */
 .ele-toolbar.is-plain .ele-tool {
   padding: 0;
   border: none;

package/es/ele-toolbar/props.d.ts

@@ -4,14 +4,20 @@ import type { ToolbarTheme } from './types';
  * 属性
  */
 export declare const toolbarProps: {
+    /** 标题 */
     title: StringConstructor;
+    /** 二级标题 */
     subtitle: StringConstructor;
+    /** 主题风格 */
     theme: {
         type: PropType<ToolbarTheme>;
         default: string;
     };
+    /** 标题区样式 */
     titleStyle: PropType<Partial<import("vue").CSSProperties>>;
+    /** 内容区样式 */
     bodyStyle: PropType<Partial<import("vue").CSSProperties>>;
+    /** 按钮区样式 */
     toolsStyle: PropType<Partial<import("vue").CSSProperties>>;
 };
 export type ToolbarProps = ExtractPropTypes<typeof toolbarProps>;

package/es/ele-toolbar/props.js

@@ -1,18 +1,18 @@
 const toolbarProps = {
-  // 标题
+  /** 标题 */
   title: String,
-  // 二级标题
+  /** 二级标题 */
   subtitle: String,
-  // 主题风格
+  /** 主题风格 */
   theme: {
     type: String,
     default: "plain"
   },
-  // 标题区样式
+  /** 标题区样式 */
   titleStyle: Object,
-  // 内容区样式
+  /** 内容区样式 */
   bodyStyle: Object,
-  // 按钮区样式
+  /** 按钮区样式 */
   toolsStyle: Object
 };
 export {

package/es/ele-toolbar/style/css-var.scss

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

package/es/ele-toolbar/style/index.scss

@@ -41,7 +41,7 @@
     align-items: center;
   }
 
-  // 朴素风格
+  /* 朴素风格 */
   &.is-plain {
     padding: 0;
     border: none;
@@ -49,7 +49,7 @@
     margin: eleVar('toolbar-plain', 'margin');
   }
 
-  // 修复上传列表占位
+  /* 修复上传列表占位 */
   .el-upload-list {
     margin: 0;
   }

package/es/ele-tooltip/index.d.ts

@@ -1,16 +1,16 @@
 import type { ElTooltipProps, ElTooltipInstance, ElPopperInstance } from '../ele-app/types';
-import type { TooltipEmits } from './props';
 declare const _default: import("vue").DefineComponent<{
     bodyStyle: import("vue").PropType<Partial<import("vue").CSSProperties>>;
     bg: StringConstructor;
     arrowBg: StringConstructor;
-    keepAlive: BooleanConstructor;
-    id: StringConstructor;
+    width: (StringConstructor | NumberConstructor)[];
+    isPopover: BooleanConstructor;
     offset: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 12, boolean>;
     trigger: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => "hover" | "focus" | "click" | "contextmenu" | import("element-plus").TooltipTriggerType[]) | (() => import("element-plus/es/utils").Arrayable<import("element-plus").TooltipTriggerType>) | ((new (...args: any[]) => "hover" | "focus" | "click" | "contextmenu" | import("element-plus").TooltipTriggerType[]) | (() => import("element-plus/es/utils").Arrayable<import("element-plus").TooltipTriggerType>))[], unknown, unknown, "hover", boolean>;
     effect: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "dark", boolean>;
     placement: import("element-plus/es/utils").EpPropFinalized<StringConstructor, import("element-plus").Placement, unknown, "bottom", boolean>;
     popperOptions: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => Partial<import("element-plus").Options>) | (() => Partial<import("element-plus").Options>) | ((new (...args: any[]) => Partial<import("element-plus").Options>) | (() => Partial<import("element-plus").Options>))[], unknown, unknown, () => {}, boolean>;
+    id: StringConstructor;
     disabled: BooleanConstructor;
     role: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "menu" | "group" | "listbox" | "grid" | "tooltip" | "dialog" | "navigation" | "tree", unknown, "tooltip", boolean>;
     teleported: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
@@ -39,48 +39,6 @@ declare const _default: import("vue").DefineComponent<{
         __epPropKey: true;
     };
     virtualTriggering: BooleanConstructor;
-    onMouseenter: {
-        readonly type: import("vue").PropType<(e: Event) => void>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
-    onMouseleave: {
-        readonly type: import("vue").PropType<(e: Event) => void>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
-    onClick: {
-        readonly type: import("vue").PropType<(e: Event) => void>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
-    onKeydown: {
-        readonly type: import("vue").PropType<(e: Event) => void>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
-    onFocus: {
-        readonly type: import("vue").PropType<(e: Event) => void>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
-    onBlur: {
-        readonly type: import("vue").PropType<(e: Event) => void>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
-    onContextmenu: {
-        readonly type: import("vue").PropType<(e: Event) => void>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
     open: BooleanConstructor;
     appendTo: {
         readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement) | ((new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement))[], unknown, unknown>>;
@@ -119,9 +77,9 @@ declare const _default: import("vue").DefineComponent<{
     contentRef: import("vue").ComputedRef<any>;
     isFocusInsideContent: () => void;
     updatePopper: () => void;
-    onOpen: (opt: any) => void;
-    onClose: (opt: any) => void;
-    hide: (opt: any) => void;
+    onOpen: (opt?: Event) => void;
+    onClose: (opt?: Event) => void;
+    hide: (opt?: Event) => void;
     onUpdateVisible: (visible: boolean) => void;
     onPopBeforeShow: (e: Event) => void;
     onPopBeforeHide: (e: Event) => void;
@@ -129,17 +87,18 @@ declare const _default: import("vue").DefineComponent<{
     onPopHide: (e: Event) => void;
     onPopOpen: (e: any) => void;
     onPopClose: (e: any) => void;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, TooltipEmits, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("./props").TooltipEmits, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     bodyStyle: import("vue").PropType<Partial<import("vue").CSSProperties>>;
     bg: StringConstructor;
     arrowBg: StringConstructor;
-    keepAlive: BooleanConstructor;
-    id: StringConstructor;
+    width: (StringConstructor | NumberConstructor)[];
+    isPopover: BooleanConstructor;
     offset: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 12, boolean>;
     trigger: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => "hover" | "focus" | "click" | "contextmenu" | import("element-plus").TooltipTriggerType[]) | (() => import("element-plus/es/utils").Arrayable<import("element-plus").TooltipTriggerType>) | ((new (...args: any[]) => "hover" | "focus" | "click" | "contextmenu" | import("element-plus").TooltipTriggerType[]) | (() => import("element-plus/es/utils").Arrayable<import("element-plus").TooltipTriggerType>))[], unknown, unknown, "hover", boolean>;
     effect: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "dark", boolean>;
     placement: import("element-plus/es/utils").EpPropFinalized<StringConstructor, import("element-plus").Placement, unknown, "bottom", boolean>;
     popperOptions: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => Partial<import("element-plus").Options>) | (() => Partial<import("element-plus").Options>) | ((new (...args: any[]) => Partial<import("element-plus").Options>) | (() => Partial<import("element-plus").Options>))[], unknown, unknown, () => {}, boolean>;
+    id: StringConstructor;
     disabled: BooleanConstructor;
     role: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "menu" | "group" | "listbox" | "grid" | "tooltip" | "dialog" | "navigation" | "tree", unknown, "tooltip", boolean>;
     teleported: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
@@ -168,48 +127,6 @@ declare const _default: import("vue").DefineComponent<{
         __epPropKey: true;
     };
     virtualTriggering: BooleanConstructor;
-    onMouseenter: {
-        readonly type: import("vue").PropType<(e: Event) => void>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
-    onMouseleave: {
-        readonly type: import("vue").PropType<(e: Event) => void>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
-    onClick: {
-        readonly type: import("vue").PropType<(e: Event) => void>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
-    onKeydown: {
-        readonly type: import("vue").PropType<(e: Event) => void>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
-    onFocus: {
-        readonly type: import("vue").PropType<(e: Event) => void>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
-    onBlur: {
-        readonly type: import("vue").PropType<(e: Event) => void>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
-    onContextmenu: {
-        readonly type: import("vue").PropType<(e: Event) => void>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
     open: BooleanConstructor;
     appendTo: {
         readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement) | ((new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement))[], unknown, unknown>>;
@@ -279,6 +196,6 @@ declare const _default: import("vue").DefineComponent<{
     boundariesPadding: number;
     fallbackPlacements: import("element-plus").Placement[];
     gpuAcceleration: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
-    keepAlive: boolean;
+    isPopover: boolean;
 }, {}>;
 export default _default;

package/es/ele-tooltip/index.js

@@ -1,8 +1,8 @@
-import { defineComponent, ref, computed, onDeactivated, resolveComponent, openBlock, createBlock, mergeProps, withCtx, createElementBlock, normalizeStyle, renderSlot, createTextVNode, toDisplayString, createCommentVNode } from "vue";
-import { ElTooltip, tooltipEmits } from "element-plus";
+import { defineComponent, ref, computed, resolveComponent, openBlock, createBlock, mergeProps, withCtx, renderSlot, createElementBlock, normalizeStyle, createTextVNode, toDisplayString, createCommentVNode } from "vue";
+import { ElTooltip } from "element-plus";
 import { useLicense } from "../ele-config-provider/receiver";
 import { omit } from "../utils/core";
-import { tooltipProps } from "./props";
+import { tooltipProps, tooltipEmits } from "./props";
 const _sfc_main = defineComponent({
   name: "EleTooltip",
   components: { ElTooltip },
@@ -15,6 +15,9 @@ const _sfc_main = defineComponent({
       const options = omit(props, [
         "content",
         "bodyStyle",
+        "bg",
+        "arrowBg",
+        "isPopover",
         "onUpdate:visible",
         "onBefore-show",
         "onBefore-hide",
@@ -24,29 +27,37 @@ const _sfc_main = defineComponent({
         "onClose"
       ]);
       if (authenticated.value) {
-        const classes = ["ele-popper", "ele-tooltip"];
+        const classes = ["ele-popper"];
+        if (props.isPopover && props.effect === "light") {
+          classes.push("ele-popover");
+        } else {
+          classes.push("ele-tooltip");
+        }
         if (typeof props.popperClass === "string" && props.popperClass) {
           classes.push(props.popperClass);
         }
         options.popperClass = classes.join(" ");
       }
+      const style = {};
       if (props.bg || props.arrowBg) {
         options.effect = "dark";
-        const style = {};
         if (props.bg) {
           style["--ele-tooltip-bg"] = props.bg;
         }
         if (props.arrowBg) {
           style["--ele-tooltip-arrow-bg"] = props.arrowBg;
         }
-        const popStyle = props.popperStyle;
-        if (!popStyle) {
-          options.popperStyle = style;
-        } else if (Array.isArray(popStyle)) {
-          options.popperStyle = [style, ...popStyle];
-        } else {
-          options.popperStyle = [style, popStyle];
-        }
+      }
+      const { width, popperStyle } = props;
+      if (width != null) {
+        style.width = typeof width === "string" ? width : `${width}px`;
+      }
+      if (!popperStyle) {
+        options.popperStyle = style;
+      } else if (Array.isArray(popperStyle)) {
+        options.popperStyle = [style, ...popperStyle];
+      } else {
+        options.popperStyle = [style, popperStyle];
       }
       return options;
     });
@@ -96,11 +107,6 @@ const _sfc_main = defineComponent({
     const onPopClose = (e) => {
       emit("close", e);
     };
-    onDeactivated(() => {
-      if (!props.keepAlive) {
-        hide(void 0);
-      }
-    });
     return {
       tooltipRef,
       rootProps,
@@ -142,20 +148,22 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     onClose: _ctx.onPopClose
   }), {
     content: withCtx(() => [
-      _ctx.rawContent && _ctx.content != null && _ctx.content != "" ? (openBlock(), createElementBlock("div", {
-        key: 0,
-        innerHTML: _ctx.content,
-        class: "ele-tooltip-body",
-        style: normalizeStyle(_ctx.bodyStyle)
-      }, null, 12, _hoisted_1)) : (openBlock(), createElementBlock("div", {
-        key: 1,
-        class: "ele-tooltip-body",
-        style: normalizeStyle(_ctx.bodyStyle)
-      }, [
-        renderSlot(_ctx.$slots, "content", {}, () => [
-          createTextVNode(toDisplayString(_ctx.content), 1)
-        ])
-      ], 4))
+      renderSlot(_ctx.$slots, "body", {}, () => [
+        _ctx.rawContent && _ctx.content != null && _ctx.content != "" ? (openBlock(), createElementBlock("div", {
+          key: 0,
+          innerHTML: _ctx.content,
+          class: "ele-tooltip-body",
+          style: normalizeStyle(_ctx.bodyStyle)
+        }, null, 12, _hoisted_1)) : (openBlock(), createElementBlock("div", {
+          key: 1,
+          class: "ele-tooltip-body",
+          style: normalizeStyle(_ctx.bodyStyle)
+        }, [
+          renderSlot(_ctx.$slots, "content", {}, () => [
+            createTextVNode(toDisplayString(_ctx.content), 1)
+          ])
+        ], 4))
+      ])
     ]),
     default: withCtx(() => [
       _ctx.$slots.default ? renderSlot(_ctx.$slots, "default", { key: 0 }) : createCommentVNode("", true)

package/es/ele-tooltip/props.d.ts

@@ -3,10 +3,16 @@ import type { PropType, ExtractPropTypes } from 'vue';
  * 属性
  */
 export declare const tooltipProps: {
+    /** 自定义内容样式 */
     bodyStyle: PropType<Partial<import("vue").CSSProperties>>;
+    /** 自定义背景色 */
     bg: StringConstructor;
+    /** 自定义箭头颜色 */
     arrowBg: StringConstructor;
-    keepAlive: BooleanConstructor;
+    /** 宽度 */
+    width: (StringConstructor | NumberConstructor)[];
+    /** 是否是气泡卡片 */
+    isPopover: BooleanConstructor;
     offset: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 12, boolean>;
     trigger: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => "hover" | "focus" | "click" | "contextmenu" | import("element-plus").TooltipTriggerType[]) | (() => import("element-plus/es/utils").Arrayable<import("element-plus").TooltipTriggerType>) | ((new (...args: any[]) => "hover" | "focus" | "click" | "contextmenu" | import("element-plus").TooltipTriggerType[]) | (() => import("element-plus/es/utils").Arrayable<import("element-plus").TooltipTriggerType>))[], unknown, unknown, "hover", boolean>;
     effect: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "dark", boolean>;
@@ -41,48 +47,6 @@ export declare const tooltipProps: {
         __epPropKey: true;
     };
     virtualTriggering: BooleanConstructor;
-    onMouseenter: {
-        readonly type: PropType<(e: Event) => void>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
-    onMouseleave: {
-        readonly type: PropType<(e: Event) => void>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
-    onClick: {
-        readonly type: PropType<(e: Event) => void>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
-    onKeydown: {
-        readonly type: PropType<(e: Event) => void>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
-    onFocus: {
-        readonly type: PropType<(e: Event) => void>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
-    onBlur: {
-        readonly type: PropType<(e: Event) => void>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
-    onContextmenu: {
-        readonly type: PropType<(e: Event) => void>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
     open: BooleanConstructor;
     appendTo: {
         readonly type: PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement) | ((new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement))[], unknown, unknown>>;
@@ -128,3 +92,4 @@ export type TooltipEmits = {
     open: (e: any) => boolean;
     close: (e: any) => boolean;
 };
+export declare const tooltipEmits: TooltipEmits;

package/es/ele-tooltip/props.js

@@ -1,22 +1,33 @@
-import { useTooltipProps } from "element-plus";
+import { useTooltipProps, tooltipEmits as tooltipEmits$1 } from "element-plus";
 import { omit } from "../utils/core";
 const normalizeProps = omit(useTooltipProps, [
   "onUpdate:visible",
-  "style"
+  "style",
+  "onMouseenter",
+  "onMouseleave",
+  "onClick",
+  "onKeydown",
+  "onFocus",
+  "onBlur",
+  "onContextmenu"
 ]);
 const tooltipProps = {
   popperClass: String,
   className: String,
   ...normalizeProps,
-  // 自定义内容样式
+  /** 自定义内容样式 */
   bodyStyle: Object,
-  // 自定义背景色
+  /** 自定义背景色 */
   bg: String,
-  // 自定义箭头颜色
+  /** 自定义箭头颜色 */
   arrowBg: String,
-  // 是否在KeepAlive失活后继续显示
-  keepAlive: Boolean
+  /** 宽度 */
+  width: [String, Number],
+  /** 是否是气泡卡片 */
+  isPopover: Boolean
 };
+const tooltipEmits = tooltipEmits$1;
 export {
+  tooltipEmits,
   tooltipProps
 };

package/es/ele-tooltip/style/css-var.scss

@@ -1,7 +1,79 @@
 @use '../../style/util.scss' as *;
 
+/* 文字提示主题变量 */
 @mixin set-tooltip-var($var) {
+  .el-popper {
+    @include set-ele-var('popper', $var);
+  }
+
+  .el-popper.is-dark,
+  .ele-tooltip {
+    @include set-ele-var('tooltip', $var);
+  }
+
   .ele-tooltip.is-light {
     @include set-ele-var('tooltip-light', $var);
   }
 }
+
+/* 底层气泡样式 */
+@mixin popper-style($selector) {
+  #{$selector} {
+    border-radius: eleVar('popper', 'radius');
+
+    &.is-light {
+      background: eleVar('popper', 'bg');
+      border: eleVar('popper', 'border');
+      box-shadow: eleVar('popper', 'shadow');
+
+      & > .el-popper__arrow::before {
+        background: eleVar('popper', 'arrow-bg');
+        border: eleVar('popper', 'border');
+        box-shadow: eleVar('popper', 'arrow-shadow');
+      }
+    }
+
+    .el-popper__arrow {
+      width: eleVar('popper', 'arrow-size');
+      height: eleVar('popper', 'arrow-size');
+
+      &::before {
+        width: eleVar('popper', 'arrow-size');
+        height: eleVar('popper', 'arrow-size');
+      }
+    }
+
+    &[data-popper-placement^='top'] > .el-popper__arrow {
+      bottom: eleVar('popper', 'arrow-offset');
+    }
+
+    &[data-popper-placement^='bottom'] > .el-popper__arrow {
+      top: eleVar('popper', 'arrow-offset');
+    }
+
+    &[data-popper-placement^='left'] > .el-popper__arrow {
+      right: eleVar('popper', 'arrow-offset');
+    }
+
+    &[data-popper-placement^='right'] > .el-popper__arrow {
+      left: eleVar('popper', 'arrow-offset');
+    }
+
+    &.is-dark {
+      color: eleVar('tooltip', 'color');
+      font-size: eleVar('tooltip', 'font-size');
+      line-height: eleVar('tooltip', 'line-height');
+      padding: eleVar('tooltip', 'padding');
+      background: eleVar('tooltip', 'bg');
+      border: eleVar('tooltip', 'border');
+      box-shadow: eleVar('tooltip', 'shadow');
+      border-radius: eleVar('tooltip', 'radius');
+
+      & > .el-popper__arrow::before {
+        background: eleVar('tooltip', 'arrow-bg');
+        border: eleVar('tooltip', 'border');
+        box-shadow: eleVar('tooltip', 'arrow-shadow');
+      }
+    }
+  }
+}

package/es/ele-tooltip/style/index.js

@@ -1,3 +1,2 @@
 import 'element-plus/es/components/tooltip/style/index';
-import '../../ele-popover/style/index';
 import './index.scss';

package/es/ele-tooltip/style/index.scss

@@ -4,11 +4,17 @@
 
 @include set-tooltip-var($ele);
 
-.ele-tooltip-body {
+@include popper-style('.ele-popper.el-popper');
+
+.ele-tooltip-body,
+.ele-popover-body {
   background: inherit;
   border-radius: inherit;
-  padding: eleVar('tooltip', 'padding');
   box-sizing: border-box;
+}
+
+.ele-tooltip-body {
+  padding: eleVar('tooltip', 'padding');
   position: relative;
   z-index: 2;
 }