ele-admin-plus 1.3.0 → 1.4.0-beta.1

package/es/utils/core.js

@@ -70,23 +70,64 @@ function eachTree(data, callback, childrenField = "children", parent) {
     }
   }
 }
-function mapTree(data, formatter, childrenField = "children", resultChildrenField = "children", parent) {
+function formatTreeItem(item, index, parent, formatter, childrenField = "children", resultChildrenField = "children", afterFormatter) {
   const result = [];
-  if (data && data.length) {
+  const itemResult = formatter(item, index, parent);
+  if (itemResult === "flatChildren") {
+    const children = item[childrenField];
+    if (children) {
+      children.forEach((c, j) => {
+        const childItems = formatTreeItem(
+          c,
+          j,
+          item,
+          formatter,
+          childrenField,
+          resultChildrenField,
+          afterFormatter
+        );
+        childItems.forEach((childItem) => {
+          const afterItem = afterFormatter ? afterFormatter(childItem) : childItem;
+          if (afterItem) {
+            result.push(afterItem);
+          }
+        });
+      });
+    }
+  } else if (itemResult) {
+    if (item[childrenField] != null) {
+      itemResult[resultChildrenField] = mapTree(
+        item[childrenField],
+        formatter,
+        childrenField,
+        resultChildrenField,
+        afterFormatter,
+        itemResult
+      );
+    }
+    const afterItem = afterFormatter ? afterFormatter(itemResult) : itemResult;
+    if (afterItem) {
+      result.push(afterItem);
+    }
+  }
+  return result;
+}
+function mapTree(data, formatter, childrenField = "children", resultChildrenField = "children", afterFormatter, parent) {
+  const result = [];
+  if (data) {
     data.forEach((d, i) => {
-      const item = formatter(d, i, parent);
-      if (item) {
-        if (d[childrenField] != null) {
-          item[resultChildrenField] = mapTree(
-            d[childrenField],
-            formatter,
-            childrenField,
-            resultChildrenField,
-            item
-          );
-        }
+      const items = formatTreeItem(
+        d,
+        i,
+        parent,
+        formatter,
+        childrenField,
+        resultChildrenField,
+        afterFormatter
+      );
+      items.forEach((item) => {
         result.push(item);
-      }
+      });
     });
   }
   return result;
@@ -105,75 +146,6 @@ function findTree(data, predicate, childrenField) {
   );
   return temp;
 }
-function random(m, n) {
-  return Math.floor(Math.random() * (m - n) + n);
-}
-function uuid(length = 32, radix) {
-  const str = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz";
-  let result = "";
-  for (let i = 0; i < length; i++) {
-    result += str.charAt(Math.floor(Math.random() * (radix || str.length)));
-  }
-  return result;
-}
-function formatNumber(num) {
-  return String(num ?? "").replace(/(\d{1,3})(?=(\d{3})+(?:$|\.))/g, "$1,");
-}
-function assignObject(target, source, excludes) {
-  Object.keys(target).forEach((key) => {
-    var _a;
-    if (!((_a = excludes == null ? void 0 : excludes.includes) == null ? void 0 : _a.call(excludes, key))) {
-      target[key] = source[key];
-    }
-  });
-  return target;
-}
-function isExternalLink(url) {
-  return !!(url && (url.startsWith("http://") || url.startsWith("https://") || url.startsWith("//")));
-}
-function queryChild(parentEl, className, attr) {
-  return Array.from((parentEl == null ? void 0 : parentEl.children) ?? []).find((el) => {
-    if (className && !el.classList.contains(className)) {
-      return false;
-    }
-    if (attr != null && attr[0] != null) {
-      if (el.getAttribute(attr[0]) != attr[1]) {
-        return false;
-      }
-    }
-    return true;
-  });
-}
-function getCurrentStyle(el) {
-  return el["currentStyle"] || window.getComputedStyle(el, null) || {};
-}
-function contentIsEllipsis(el, direction) {
-  if (!el || !el.childNodes.length) {
-    return false;
-  }
-  const range = document.createRange();
-  range.setStart(el, 0);
-  range.setEnd(el, el.childNodes.length);
-  const { width, height } = range.getBoundingClientRect();
-  const floorW = Math.floor(width);
-  const rangeWidth = width - floorW < 8e-3 ? floorW : width;
-  const floorH = Math.floor(height);
-  const rangeHeight = height - floorH < 8e-3 ? floorH : height;
-  const style = getCurrentStyle(el);
-  const top = Number.parseInt(style.paddingTop) || 0;
-  const left = Number.parseInt(style.paddingLeft) || 0;
-  const right = Number.parseInt(style.paddingRight) || 0;
-  const bottom = Number.parseInt(style.paddingBottom) || 0;
-  const horizontalPadding = left + right;
-  const verticalPadding = top + bottom;
-  if (direction === "horizontal") {
-    return rangeWidth + horizontalPadding > el.offsetWidth || el.scrollWidth > el.offsetWidth;
-  }
-  if (direction === "vertical") {
-    return rangeHeight + verticalPadding > el.offsetHeight || el.scrollHeight > el.offsetHeight;
-  }
-  return rangeWidth + horizontalPadding > el.offsetWidth || rangeHeight + verticalPadding > el.offsetHeight || el.scrollWidth > el.offsetWidth;
-}
 function checkFullscreen() {
   return !!(document.fullscreenElement || document.webkitFullscreenElement || document.mozFullScreenElement || document.msFullscreenElement);
 }
@@ -213,6 +185,29 @@ function gcj02ToBd09(point) {
     lat: z * Math.sin(theta) + 6e-3
   };
 }
+function random(m, n) {
+  return Math.floor(Math.random() * (m - n) + n);
+}
+function uuid(length = 32, radix) {
+  const str = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz";
+  let result = "";
+  for (let i = 0; i < length; i++) {
+    result += str.charAt(Math.floor(Math.random() * (radix || str.length)));
+  }
+  return result;
+}
+function formatNumber(num) {
+  return String(num ?? "").replace(/(\d{1,3})(?=(\d{3})+(?:$|\.))/g, "$1,");
+}
+function assignObject(target, source, excludes) {
+  Object.keys(target).forEach((key) => {
+    var _a;
+    if (!((_a = excludes == null ? void 0 : excludes.includes) == null ? void 0 : _a.call(excludes, key))) {
+      target[key] = source[key];
+    }
+  });
+  return target;
+}
 async function copyText(text) {
   var _a;
   if (typeof ((_a = navigator == null ? void 0 : navigator.clipboard) == null ? void 0 : _a.writeText) === "function") {
@@ -235,95 +230,37 @@ async function copyText(text) {
   }
   el.remove();
 }
-function getValue(data, path, defaultValue) {
-  if (data == null) {
-    return defaultValue;
-  }
-  const pathType = typeof path;
-  if (pathType === "function") {
-    return path(data);
-  }
-  const fields = (pathType === "string" ? path.match(/[^\[\].]+/g) : path) ?? [];
-  let result = data;
-  for (const key of fields) {
-    result = result[key.trim()];
-  }
-  return typeof result === "undefined" ? defaultValue : result;
-}
-function debounce(func, wait) {
-  let timer = void 0;
-  const debounced = function(...args) {
-    if (timer) {
-      clearTimeout(timer);
+function queryChild(parentEl, className, attr) {
+  return Array.from((parentEl == null ? void 0 : parentEl.children) ?? []).find((el) => {
+    if (className && !el.classList.contains(className)) {
+      return false;
     }
-    timer = setTimeout(() => {
-      func.apply(this, args);
-      timer = void 0;
-    }, wait);
-  };
-  return debounced;
-}
-function throttle(func, wait, trailing) {
-  let timer = void 0;
-  const debounced = function(...args) {
-    if (!timer) {
-      if (!trailing) {
-        func.apply(this, args);
+    if (attr != null && attr[0] != null) {
+      if (el.getAttribute(attr[0]) != attr[1]) {
+        return false;
       }
-      timer = setTimeout(() => {
-        if (trailing) {
-          func.apply(this, args);
-        }
-        timer = void 0;
-      }, wait);
     }
-  };
-  return debounced;
-}
-function omit(obj, fields) {
-  const result = Object.assign({}, obj);
-  if (obj) {
-    for (const key of fields) {
-      delete result[key];
-    }
-  }
-  return result;
-}
-function pick(obj, fields) {
-  const result = {};
-  if (obj) {
-    for (const key of fields) {
-      result[key] = obj[key];
-    }
-  }
-  return result;
+    return true;
+  });
 }
-function capitalize(str) {
-  return str.charAt(0).toUpperCase() + str.slice(1);
+function isExternalLink(url) {
+  return !!(url && (url.startsWith("http://") || url.startsWith("https://") || url.startsWith("//")));
 }
 export {
   assignObject,
   bd09ToGcj02,
-  capitalize,
   checkFullscreen,
-  contentIsEllipsis,
   copyText,
-  debounce,
   eachTree,
   exitFullscreen,
   findTree,
   formatNumber,
   gcj02ToBd09,
-  getCurrentStyle,
-  getValue,
   isExternalLink,
   mapTree,
-  omit,
-  pick,
   queryChild,
   random,
   requestFullscreen,
-  throttle,
   toTree,
   uuid
 };

package/es/utils/hook.d.ts

@@ -1,4 +1,5 @@
-import { Ref, EmitsOptions, ObjectEmitsOptions, EmitsToProps } from 'vue';
+import { Ref, EmitsOptions, EmitsToProps } from 'vue';
+import { EmitMethods } from '../ele-app/types';
 
 /**
  * 重置组件表单验证
@@ -134,24 +135,20 @@ export declare function useMoveEvent(option?: UseTouchEventOption<MoveEvent>): {
     handleTouchstart: (e: TouchEvent) => void;
 };
 /**
- * 组件事件对应的方法类型
+ * useComponentEvents 返回结果
  */
-export type EmitMethods<T extends EmitsOptions> = T extends string[] ? {
-    [K in T[number]]: (...args: any[]) => void;
-} : T extends ObjectEmitsOptions ? {
-    [K in string & keyof T]: (...args: T[K] extends (...args: infer P) => any ? P : T[K] extends null ? any[] : never) => void;
-} : {};
+export interface UseComponentEventsResult<T extends EmitsOptions> {
+    emitMethods: EmitMethods<T>;
+    emitProps: Required<EmitsToProps<T>>;
+}
 /**
  * 二次封装组件事件处理 hook
  */
-export declare function useComponentEvents<T extends EmitsOptions>(events: T, emit: any): {
-    emitMethods: EmitMethods<T>;
-    emitProps: Required<EmitsToProps<T>>;
-};
+export declare function useComponentEvents<T extends EmitsOptions>(events: T, emit: any): UseComponentEventsResult<T>;
 /**
  * 高级选项数据 hook
  */
 export declare function useProOptions<T>(props: Record<string, any>, name?: string): {
     optionData: Ref<T[], T[]>;
-    reloadOptions: () => void;
+    reloadOptions: (params?: any) => void;
 };

package/es/utils/hook.js

@@ -1,6 +1,6 @@
 import { provide, ref, onBeforeUnmount, computed, watch } from "vue";
 import { formItemContextKey } from "element-plus";
-import { capitalize, getValue } from "./core";
+import { capitalize, getValue } from "./common";
 function useFormItemRest() {
   provide(formItemContextKey, null);
 }
@@ -67,6 +67,7 @@ function useMobile(onChange) {
       }
     }
   );
+  startMedia();
   return [mobile, startMedia, stopMedia];
 }
 function useMobileDevice(onChange) {
@@ -81,6 +82,7 @@ function useMobileDevice(onChange) {
       }
     }
   );
+  startMedia();
   return [mobileDevice, startMedia, stopMedia];
 }
 function useWindowListener(event, listener) {
@@ -316,11 +318,11 @@ function useComponentEvents(events, emit) {
 function useProOptions(props, name = "options") {
   const optionData = ref([]);
   const optionsProp = computed(() => getValue(props, name));
-  const reloadOptions = () => {
+  const reloadOptions = (params) => {
     if (optionsProp.value != null) {
       if (typeof optionsProp.value === "function") {
         optionData.value = [];
-        optionsProp.value().then((data) => {
+        optionsProp.value(params).then((data) => {
           optionData.value = data || [];
         });
         return;

package/es/utils/menu-util.d.ts

@@ -5,6 +5,14 @@ import { MenuItem } from '../ele-pro-layout/types';
  * 获取路由组件方法
  */
 export type GetComponent = (component?: string, menu?: MenuItem, name?: string) => (() => Promise<RouteComponent>) | RouteComponent | undefined;
+/**
+ * 获取内嵌页面路由组件
+ * @param menu 菜单数据
+ * @param name 组件名称
+ */
+export declare function getIframeRouteComponent(menu: MenuItem, name: string): import('vue').DefineComponent<{}, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
 /**
  * 菜单数据转为路由数据
  * @param menus 菜单数据

package/es/utils/menu-util.js

@@ -1,7 +1,30 @@
 import { defineComponent, ref, computed, h } from "vue";
 import { useRoute } from "vue-router";
 import { useProLayoutState, getIframeSrc } from "../ele-pro-layout/util";
-import { isExternalLink, findTree } from "./core";
+import { isExternalLink, findTree } from "./common";
+function getIframeRouteComponent(menu, name) {
+  return defineComponent({
+    name,
+    setup() {
+      var _a;
+      const proLayoutState = useProLayoutState();
+      const route = useRoute();
+      const { fullPath } = route;
+      const iframeSrc = ref(getIframeSrc(fullPath, menu.component));
+      const isAlive = ((_a = menu.meta) == null ? void 0 : _a.keepAlive) !== false;
+      const keepAlive = computed(() => !!proLayoutState.keepAlive);
+      return () => {
+        if (!isAlive || !keepAlive.value) {
+          return h("iframe", {
+            src: iframeSrc.value,
+            class: "ele-admin-iframe"
+          });
+        }
+        return h("div", { class: "ele-none", style: { display: "none" } });
+      };
+    }
+  });
+}
 function camelCase(str) {
   const val = str.replace(/[-|/](\w)/g, (_, c) => c ? c.toUpperCase() : "");
   return val.charAt(0).toUpperCase() + val.slice(1);
@@ -19,30 +42,7 @@ function getRouteComponent(menu, name, func) {
   if (!menu.component || !isExternalLink(menu.component)) {
     return { component: func(menu.component, menu, name) };
   }
-  return {
-    component: defineComponent({
-      name,
-      setup() {
-        var _a;
-        const proLayoutState = useProLayoutState();
-        const route = useRoute();
-        const { fullPath } = route;
-        const iframeSrc = ref(getIframeSrc(fullPath, menu.component));
-        const isAlive = ((_a = menu.meta) == null ? void 0 : _a.keepAlive) !== false;
-        const keepAlive = computed(() => !!proLayoutState.keepAlive);
-        return () => {
-          if (!isAlive || !keepAlive.value) {
-            return h("iframe", {
-              src: iframeSrc.value,
-              class: "ele-admin-iframe"
-            });
-          }
-          return h("div", { class: "ele-none", style: { display: "none" } });
-        };
-      }
-    }),
-    link: true
-  };
+  return { component: getIframeRouteComponent(menu, name), link: true };
 }
 function menuToRoutes(menus, getComponent, added) {
   if (!(menus == null ? void 0 : menus.length)) {
@@ -74,5 +74,6 @@ function menuToRoutes(menus, getComponent, added) {
   return routes;
 }
 export {
+  getIframeRouteComponent,
   menuToRoutes
 };

package/es/utils/message-box.js

@@ -3,7 +3,7 @@ import { ElMessageBox } from "element-plus";
 import { useGlobalProps } from "../ele-config-provider/receiver";
 import { useLayoutState } from "../ele-pro-layout/util";
 import MessageBoxIcon from "../ele-app/components/message-box-icon";
-import { omit } from "./core";
+import { omit } from "./common";
 function getWrapEl(bodyEl) {
   const parent = bodyEl || document.body;
   const className = "ele-message-box-wrapper";

package/es/utils/message.d.ts

@@ -61,6 +61,6 @@ export { EleMessage };
 export declare const MESSAGE_KEY: MessageKey;
 /**
  * 带当前上下文的消息提示
- * @param options 参数
+ * @param globalOpt 参数
  */
 export declare function useMessage(globalOpt?: MessageOptions): Message;

package/es/utils/message.js

@@ -3,7 +3,7 @@ import { ElMessage } from "element-plus";
 import { useGlobalProps } from "../ele-config-provider/receiver";
 import { useLayoutState } from "../ele-pro-layout/util";
 import MessageBody from "../ele-app/components/message-body";
-import { queryChild, omit } from "./core";
+import { omit, queryChild } from "./common";
 function blurCurrentFocus() {
   var _a;
   if (typeof ((_a = document == null ? void 0 : document.body) == null ? void 0 : _a.querySelector) === "function") {

package/es/utils/theme-util.d.ts

@@ -1,6 +1,54 @@
+/**
+ * 主题皮肤配置
+ */
+export interface SkinConfig {
+    /** 主题皮肤名称 */
+    name?: string;
+    /** 主题皮肤缩略图 */
+    cover?: string;
+    /** 自定义主题皮肤基于的默认主题皮肤名称 */
+    skinName?: string;
+    /** 主题色 */
+    color?: string;
+    /** 背景图片 */
+    wallpaper?: string;
+    /** 背景蒙层 */
+    maskColor?: string;
+    /** 顶栏背景 */
+    headerBg?: string;
+    /** 侧栏背景 */
+    sidebarBg?: string;
+    /** 卡片背景 */
+    cardBg?: string;
+    /** 弹层背景 */
+    overlayBg?: string;
+    /** 弹层背景蒙层 */
+    overlayMaskColor?: string;
+    /** 暗黑主题配置 */
+    darkConfig?: Omit<SkinConfig, 'name' | 'darkConfig'>;
+}
+/**
+ * 判断是否是颜色值
+ * @param value 颜色
+ */
+export declare function isColorValue(value?: string): boolean;
 /**
  * 切换主题色
  * @param color 颜色值
  * @param dark 是否暗黑模式
+ * @param isTransparent 是否是皮肤主题
+ * @param themeEl 主题节点
+ * @param themeSelector 主题变量选择器
+ * @param darkClass 暗黑主题节点类名
+ * @param darkSelector 暗黑主题变量选择器
+ */
+export declare function changeColor(color?: string | null, dark?: boolean, isTransparent?: boolean, themeEl?: HTMLElement, themeSelector?: string, darkClass?: string, darkSelector?: string): void;
+/**
+ * 切换主题皮肤
+ * @param skinConfig 主题皮肤配置
+ * @param dark 是否暗黑模式
+ * @param themeEl 主题节点
+ * @param themeSelector 主题变量选择器
+ * @param themeClass 主题节点类名
  */
-export declare function changeColor(color?: string | null, dark?: boolean): void;
+export declare function changeSkin(skinConfig?: SkinConfig | null, dark?: boolean, themeEl?: HTMLElement, themeSelector?: string, themeClass?: string): void;