yuang-framework-ui-pc 1.1.42 → 1.1.44

package/lib/utils/core.d.ts

@@ -0,0 +1,168 @@
+import { Mutable } from '../ele-app/types';
+
+/**
+ * toTree 方法参数
+ */
+export interface ToTreeOption<T> {
+    /** 数据 */
+    data?: T[] | null;
+    /** id 字段名称 */
+    idField?: string | null;
+    /** parentId 字段名称 */
+    parentIdField?: string | null;
+    /** 生成的 children 字段名称 */
+    childrenField?: string | null;
+    /** 最顶级的 parentId 值 */
+    parentId?: number | string | (number | string)[] | null;
+    /** 是否添加包含所有父级 id 的字段 */
+    addParentIds?: boolean | null;
+    /** 包含所有父级 id 字段的名称 */
+    parentIdsField?: string | null;
+    /** 所有父级的 id */
+    parentIds?: (number | string)[] | null;
+}
+/**
+ * parentId 形式数据转 children 形式
+ * @param option ToTreeOption
+ */
+export declare function toTree<T>(option: ToTreeOption<T>): T[];
+/**
+ * 遍历 children 形式数据
+ * @param data 数据
+ * @param callback 回调
+ * @param childrenField children 字段名
+ * @param parent 当前的父级
+ */
+export declare function eachTree<T>(data?: T[], callback?: (item: T, index: number, parent?: T) => void | boolean, childrenField?: string, parent?: T): void;
+/**
+ * 格式化 children 形式数据
+ * @param data 数据
+ * @param formatter 格式器
+ * @param childrenField children 字段名
+ * @param resultChildrenField 返回后的 children 字段名
+ * @param parent 当前的父级
+ */
+export declare function mapTree<T, K>(data: T[] | undefined | null, formatter: (item: T, index?: number, parent?: K) => K | void | undefined, childrenField?: string, resultChildrenField?: string, parent?: K): K[];
+/**
+ * 查找树形数据
+ * @param data 数据
+ * @param predicate 查找条件
+ * @param childrenField children 字段名
+ */
+export declare function findTree<T>(data: T[] | undefined, predicate: (value: T, index: number) => unknown, childrenField?: string): T | undefined;
+/**
+ * 生成 m 到 n 的随机数
+ * @param m 最小值(包含)
+ * @param n 最大值(不包含)
+ */
+export declare function random(m: number, n: number): number;
+/**
+ * 生成随机字符串
+ * @param length 长度
+ * @param radix 基数
+ */
+export declare function uuid(length?: number, radix?: number): string;
+/**
+ * 数字千分位
+ * @param num 数字
+ */
+export declare function formatNumber(num?: number | null): string;
+/**
+ * 赋值不改变原字段
+ * @param target 目标对象
+ * @param source 源对象
+ * @param excludes 排除的字段
+ */
+export declare function assignObject<T extends {}, K extends {}>(target: T, source: K, excludes?: string[]): T;
+/**
+ * 判断是否是外链
+ * @param url 地址
+ */
+export declare function isExternalLink(url?: string | null): boolean;
+/**
+ * 查找直接子元素
+ * @param parentEl 父元素
+ * @param className 类名
+ * @param attr 属性
+ */
+export declare function queryChild(parentEl?: Element, className?: string, attr?: string[]): Element | undefined;
+/**
+ * 获取节点样式
+ * @param el 节点
+ */
+export declare function getCurrentStyle(el: Element): CSSStyleDeclaration;
+/**
+ * 判断元素内容是否溢出省略
+ * @param el 元素节点
+ * @param direction 只判断单个方向是否溢出
+ */
+export declare function contentIsEllipsis(el: HTMLElement, direction?: 'horizontal' | 'vertical'): boolean;
+/**
+ * 检查是否全屏
+ */
+export declare function checkFullscreen(): boolean;
+/**
+ * 退出全屏
+ */
+export declare function exitFullscreen(): void;
+/**
+ * 全屏
+ * @param el HTMLElement
+ */
+export declare function requestFullscreen(el?: HTMLElement): void;
+/**
+ * 经纬度坐标
+ */
+export interface Point {
+    /** 经度 */
+    lng: number;
+    /** 纬度 */
+    lat: number;
+}
+/**
+ * 百度地图坐标转高德地图坐标
+ * @param point 坐标
+ */
+export declare function bd09ToGcj02(point: Point): Point;
+/**
+ * 高德地图坐标转百度地图坐标
+ * @param point 坐标
+ */
+export declare function gcj02ToBd09(point: Point): Point;
+/**
+ * 复制字符串
+ * @param text 字符串
+ */
+export declare function copyText(text: string): Promise<undefined>;
+/**
+ * 根据字段路径获取值
+ * @param data 数据
+ * @param path 字段路径
+ * @param defaultValue 默认值
+ */
+export declare function getValue<T, K>(data?: K | null, path?: string | string[] | ((d: K) => T), defaultValue?: T): T | undefined;
+/**
+ * 防抖函数
+ * @param func 函数
+ * @param wait 等待时间
+ */
+export declare function debounce<T extends (...args: any) => any>(func: T, wait: number): (this: any) => void;
+/**
+ * 节流函数
+ * @param func 函数
+ * @param wait 等待时间
+ * @param trailing 是否在节流结束后调用
+ */
+export declare function throttle<T extends (...args: any) => any>(func: T, wait: number, trailing?: boolean): (this: any) => void;
+/**
+ * 忽略对象属性
+ * @param obj 来源对象
+ * @param fields 忽略的属性
+ */
+export declare function omit<T extends {}, K extends keyof T>(obj: T | null | undefined, fields: K[]): Mutable<Omit<T, K>>;
+/**
+ * 摘选对象属性
+ * @param obj 来源对象
+ * @param fields 摘选的属性
+ */
+export declare function pick<T extends object, K extends keyof T>(obj: T, fields: K[]): Mutable<Pick<T, K>>;

package/lib/utils/hook.cjs

@@ -0,0 +1,264 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const vue = require("vue");
+function useTimer(ms, cb) {
+  let timer = null;
+  const waiting = vue.ref(false);
+  const stopTimer = () => {
+    if (timer != null) {
+      clearTimeout(timer);
+      timer = null;
+    }
+    waiting.value = false;
+  };
+  const startTimer = (callback, timeout) => {
+    stopTimer();
+    waiting.value = true;
+    const to = timeout ?? (typeof ms === "function" ? ms() : ms);
+    timer = setTimeout(() => {
+      const func = callback ?? cb;
+      func && func();
+      waiting.value = false;
+    }, to);
+  };
+  vue.onBeforeUnmount(() => {
+    stopTimer();
+  });
+  return [startTimer, stopTimer, waiting];
+}
+function useMediaQuery(query, onChange) {
+  const mediaQuery = window.matchMedia(query);
+  const handleChange = () => {
+    onChange && onChange();
+  };
+  const startWatch = () => {
+    stopWatch();
+    mediaQuery.addEventListener("change", handleChange);
+  };
+  const stopWatch = () => {
+    mediaQuery.removeEventListener("change", handleChange);
+    handleChange();
+  };
+  vue.onBeforeUnmount(() => {
+    stopWatch();
+  });
+  return [mediaQuery, startWatch, stopWatch];
+}
+function useWindowListener(event, listener) {
+  const eventName = typeof event === "string" ? event : "resize";
+  const callback = typeof event === "function" ? event : listener;
+  if (callback != null) {
+    window.addEventListener(eventName, callback);
+  }
+  vue.onBeforeUnmount(() => {
+    if (callback != null) {
+      window.removeEventListener(eventName, callback);
+    }
+  });
+}
+function useCollapseAnim() {
+  let enterHeight = 0;
+  const getHeight = (el, isEnter) => {
+    if (!isEnter) {
+      return Math.max(el.offsetHeight, el.scrollHeight);
+    }
+    return Math.max(el.offsetHeight, el.scrollHeight, enterHeight);
+  };
+  const handleBeforeEnter = (el) => {
+    el.dataset.oldPaddingTop = el.style.paddingTop;
+    el.dataset.oldPaddingBottom = el.style.paddingBottom;
+    el.style.maxHeight = "0px";
+    el.style.paddingTop = "0px";
+    el.style.paddingBottom = "0px";
+  };
+  const handleEnter = (el) => {
+    el.dataset.oldOverflow = el.style.overflow;
+    el.style.maxHeight = `${getHeight(el, true)}px`;
+    el.style.paddingTop = el.dataset.oldPaddingTop ?? "";
+    el.style.paddingBottom = el.dataset.oldPaddingBottom ?? "";
+    el.style.overflow = "hidden";
+  };
+  const handleAfterEnter = (el) => {
+    el.style.maxHeight = "";
+    el.style.overflow = el.dataset.oldOverflow ?? "";
+  };
+  const handleBeforeLeave = (el) => {
+    el.dataset.oldPaddingTop = el.style.paddingTop;
+    el.dataset.oldPaddingBottom = el.style.paddingBottom;
+    el.dataset.oldOverflow = el.style.overflow;
+    enterHeight = getHeight(el);
+    el.style.maxHeight = `${enterHeight}px`;
+    el.style.overflow = "hidden";
+  };
+  const handleLeave = (el) => {
+    el.style.maxHeight = "0px";
+    el.style.paddingTop = "0px";
+    el.style.paddingBottom = "0px";
+  };
+  const handleAfterLeave = (el) => {
+    el.style.maxHeight = "";
+    el.style.overflow = el.dataset.oldOverflow ?? "";
+    el.style.paddingTop = el.dataset.oldPaddingTop ?? "";
+    el.style.paddingBottom = el.dataset.oldPaddingBottom ?? "";
+  };
+  return {
+    handleBeforeEnter,
+    handleEnter,
+    handleAfterEnter,
+    handleBeforeLeave,
+    handleLeave,
+    handleAfterLeave
+  };
+}
+function useMousewheel(cb) {
+  const handleMousewheel = (e) => {
+    const delta = e.wheelDelta || e.detail;
+    cb && cb({ e, direction: delta > 0 ? "up" : "down" });
+  };
+  const handleFirefoxMousewheel = (e) => {
+    const delta = e.wheelDelta || e.detail;
+    cb && cb({ e, direction: delta < 0 ? "up" : "down" });
+  };
+  const bindMousewheel = (el) => {
+    el.addEventListener("mousewheel", handleMousewheel, { passive: false });
+    el.addEventListener("DOMMouseScroll", handleFirefoxMousewheel);
+  };
+  const unbindMousewheel = (el) => {
+    el.removeEventListener("mousewheel", handleMousewheel);
+    el.removeEventListener("DOMMouseScroll", handleFirefoxMousewheel);
+  };
+  return {
+    handleMousewheel,
+    handleFirefoxMousewheel,
+    bindMousewheel,
+    unbindMousewheel
+  };
+}
+function useTouchEvent(option) {
+  let startX = null;
+  let startY = null;
+  let distanceX = null;
+  let distanceY = null;
+  const handleTouchStart = (e) => {
+    startX = e.touches[0].clientX;
+    startY = e.touches[0].clientY;
+    if (option && option.start) {
+      option.start({ e, startX, startY });
+    }
+  };
+  const handleTouchMove = (e) => {
+    if (startX != null && startY != null) {
+      const currentX = e.touches[0].clientX;
+      const currentY = e.touches[0].clientY;
+      distanceX = currentX - startX;
+      distanceY = currentY - startY;
+      if (option && option.move) {
+        option.move({ e, startX, startY, distanceX, distanceY });
+      }
+    }
+  };
+  const handleTouchEnd = (e) => {
+    if (option && option.end) {
+      option.end({ e, startX, startY, distanceX, distanceY });
+    }
+    startX = null;
+    startY = null;
+    distanceX = null;
+    distanceY = null;
+  };
+  const bindTouchEvent = (el) => {
+    el.addEventListener("touchstart", handleTouchStart);
+    el.addEventListener("touchmove", handleTouchMove);
+    el.addEventListener("touchend", handleTouchEnd);
+  };
+  const unbindTouchEvent = (el) => {
+    el.removeEventListener("touchstart", handleTouchStart);
+    el.removeEventListener("touchmove", handleTouchMove);
+    el.removeEventListener("touchend", handleTouchEnd);
+  };
+  return {
+    handleTouchStart,
+    handleTouchMove,
+    handleTouchEnd,
+    bindTouchEvent,
+    unbindTouchEvent
+  };
+}
+function useMoveEvent(option) {
+  let startX = null;
+  let startY = null;
+  let distanceX = null;
+  let distanceY = null;
+  const unbindEvent = () => {
+    document.removeEventListener("mousemove", mousemoveFn);
+    document.removeEventListener("mouseup", mouseupFn);
+    document.removeEventListener("touchmove", touchmoveFn);
+    document.removeEventListener("touchend", touchendFn);
+  };
+  const emitStart = (clientX, clientY, e) => {
+    startX = clientX;
+    startY = clientY;
+    if (option && option.start) {
+      option.start({ e, startX, startY });
+    }
+  };
+  const emitMove = (currentX, currentY, e) => {
+    if (startX != null && startY != null) {
+      distanceX = currentX - startX;
+      distanceY = currentY - startY;
+      if (option && option.move) {
+        option.move({ e, startX, startY, distanceX, distanceY });
+      }
+    }
+  };
+  const emitEnd = (e) => {
+    unbindEvent();
+    if (option && option.end) {
+      option.end({ e, startX, startY, distanceX, distanceY });
+    }
+    startX = null;
+    startY = null;
+    distanceX = null;
+    distanceY = null;
+  };
+  const mousemoveFn = function(e) {
+    emitMove(e.clientX, e.clientY, e);
+  };
+  const touchmoveFn = function(e) {
+    emitMove(e.touches[0].clientX, e.touches[0].clientY, e);
+  };
+  const mouseupFn = (e) => {
+    emitEnd(e);
+  };
+  const touchendFn = (e) => {
+    emitEnd(e);
+  };
+  const handleMousedown = (e) => {
+    emitStart(e.clientX, e.clientY, e);
+    document.addEventListener("mousemove", mousemoveFn);
+    document.addEventListener("mouseup", mouseupFn);
+  };
+  const handleTouchstart = (e) => {
+    emitStart(e.touches[0].clientX, e.touches[0].clientY, e);
+    document.addEventListener(
+      "touchmove",
+      touchmoveFn,
+      option == null ? void 0 : option.touchmoveOptions
+    );
+    document.addEventListener("touchend", touchendFn);
+  };
+  vue.onBeforeUnmount(() => {
+    unbindEvent();
+  });
+  return {
+    handleMousedown,
+    handleTouchstart
+  };
+}
+exports.useCollapseAnim = useCollapseAnim;
+exports.useMediaQuery = useMediaQuery;
+exports.useMousewheel = useMousewheel;
+exports.useMoveEvent = useMoveEvent;
+exports.useTimer = useTimer;
+exports.useTouchEvent = useTouchEvent;
+exports.useWindowListener = useWindowListener;

package/lib/utils/hook.d.ts

@@ -0,0 +1,113 @@
+import { Ref } from 'vue';
+
+/**
+ * useTimer 返回结果
+ */
+export type UseTimerResult = [
+    (callback?: () => void, timeout?: number) => void,
+    () => void,
+    Ref<boolean>
+];
+/**
+ * 定时器
+ * @param ms 等待时间
+ * @param cb 执行方法
+ */
+export declare function useTimer(ms?: number | (() => number), cb?: () => void): UseTimerResult;
+/**
+ * useMediaQuery 返回结果
+ */
+export type UseMediaQueryResult = [MediaQueryList, () => void, () => void];
+/**
+ * 媒体查询
+ * @param query 媒体查询字符串
+ * @param onChange 改变回调
+ */
+export declare function useMediaQuery(query: string, onChange?: () => void): UseMediaQueryResult;
+/**
+ * 窗口事件监听
+ * @param event 事件
+ * @param listener 回调
+ */
+export declare function useWindowListener(event: string | EventListenerOrEventListenerObject, listener?: EventListenerOrEventListenerObject): void;
+/**
+ * 折叠展开动画
+ */
+export declare function useCollapseAnim(): {
+    handleBeforeEnter: (el: HTMLElement) => void;
+    handleEnter: (el: HTMLElement) => void;
+    handleAfterEnter: (el: HTMLElement) => void;
+    handleBeforeLeave: (el: HTMLElement) => void;
+    handleLeave: (el: HTMLElement) => void;
+    handleAfterLeave: (el: HTMLElement) => void;
+};
+/**
+ * 鼠标滚轮事件回调方法参数
+ */
+export interface UseMousewheelCallbackParam {
+    /** 事件对象 */
+    e: MouseEvent;
+    /** 方向 */
+    direction: 'up' | 'down';
+}
+/**
+ * 鼠标滚轮事件
+ * @param cb 回调
+ */
+export declare function useMousewheel(cb?: (p: UseMousewheelCallbackParam) => void): {
+    handleMousewheel: (e: MouseEvent) => void;
+    handleFirefoxMousewheel: (e: MouseEvent) => void;
+    bindMousewheel: (el: HTMLElement) => void;
+    unbindMousewheel: (el: HTMLElement) => void;
+};
+/**
+ * 触摸事件回调参数
+ */
+export interface UseTouchEventCallbackParam<T> {
+    /** 事件对象 */
+    e: T;
+    /** 开始横向位置 */
+    startX: number | null;
+    /** 开始纵向位置 */
+    startY: number | null;
+    /** 横向移动距离 */
+    distanceX?: number | null;
+    /** 纵向移动距离 */
+    distanceY?: number | null;
+}
+/**
+ * 触摸事件参数
+ */
+export interface UseTouchEventOption<T> {
+    /** 触摸开始的回调 */
+    start?: (param: UseTouchEventCallbackParam<T>) => void;
+    /** 触摸移动的回调 */
+    move?: (param: UseTouchEventCallbackParam<T>) => void;
+    /** 触摸结束的回调 */
+    end?: (param: UseTouchEventCallbackParam<T>) => void;
+    /** touchmove 事件参数 */
+    touchmoveOptions?: any;
+}
+/**
+ * 触摸事件
+ * @param option 参数
+ */
+export declare function useTouchEvent(option?: UseTouchEventOption<TouchEvent>): {
+    handleTouchStart: (e: TouchEvent) => void;
+    handleTouchMove: (e: TouchEvent) => void;
+    handleTouchEnd: (e: TouchEvent) => void;
+    bindTouchEvent: (el: HTMLElement) => void;
+    unbindTouchEvent: (el: HTMLElement) => void;
+};
+/**
+ * 移动事件对象
+ */
+export type MoveEvent = MouseEvent | TouchEvent;
+/**
+ * 鼠标移动事件或触摸移动事件
+ * @param option 参数
+ */
+export declare function useMoveEvent(option?: UseTouchEventOption<MoveEvent>): {
+    handleMousedown: (e: MouseEvent) => void;
+    handleTouchstart: (e: TouchEvent) => void;
+};

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

@@ -0,0 +1,14 @@
+import { RouteRecordRaw, _RouteRecordBase, RouteComponent } from 'vue-router';
+import { MenuItem } from '../ele-pro-layout/types';
+
+/**
+ * 获取路由组件方法
+ */
+export type GetComponent = (component?: string, menu?: MenuItem, name?: string) => (() => Promise<RouteComponent>) | RouteComponent | undefined;
+/**
+ * 菜单数据转为路由数据
+ * @param menus 菜单数据
+ * @param getComponent 加载组件的方法
+ * @param added 已添加的路由
+ */
+export declare function menuToRoutes(menus: MenuItem[] | undefined, getComponent: GetComponent, added?: _RouteRecordBase[]): RouteRecordRaw[] | undefined;

package/lib/utils/message-box.d.ts

@@ -0,0 +1,25 @@
+import { AppContext } from 'vue';
+import { ElMessageBoxOptions, MessageBoxData as ElMessageBoxData } from 'element-plus';
+
+/**
+ * 消息弹窗配置
+ */
+export interface MessageBoxOptions extends ElMessageBoxOptions {
+    /** 是否限制在主体内部 */
+    inner?: boolean;
+}
+/**
+ * 消息弹窗方法
+ */
+export type MessageBoxMethod = (message: ElMessageBoxOptions['message'], title: ElMessageBoxOptions['title'], options?: MessageBoxOptions, context?: AppContext | null) => Promise<ElMessageBoxData>;
+/**
+ * 消息弹窗
+ */
+export interface MessageBox {
+    (options?: MessageBoxOptions, context?: AppContext | null): Promise<ElMessageBoxData>;
+    alert: MessageBoxMethod;
+    confirm: MessageBoxMethod;
+    prompt: MessageBoxMethod;
+    close: () => void;
+}
+export declare function useMessageBox(globalOpt?: MessageBoxOptions): MessageBox;

package/lib/utils/message.d.ts

@@ -0,0 +1,66 @@
+import { AppContext, InjectionKey } from 'vue';
+import { MessageHandler as ElMessageHandler, MessageOptions as ElMessageOptions, MessageFn as ElMessageFn } from 'element-plus/es/components/message';
+
+/**
+ * 消息提示配置
+ */
+export interface MessageOptions extends ElMessageOptions {
+    /** 是否为原始风格 */
+    original?: boolean | 'plain';
+    /** 是否显示遮罩层 */
+    mask?: boolean;
+    /** 是否居中显示 */
+    centered?: boolean;
+    /** 是否限制在主体内部 */
+    inner?: boolean;
+    /** 限制在主体内部的分组标识 */
+    groupKey?: string;
+}
+/**
+ * 消息提示方法参数
+ */
+export type MessageParams = MessageOptions | ElMessageOptions['message'];
+/**
+ * 消息提示方法
+ */
+export type MessageFn = (options?: MessageParams, context?: null | AppContext) => ElMessageHandler;
+/**
+ * 消息提示
+ */
+export interface Message extends MessageFn {
+    closeAll: ElMessageFn['closeAll'];
+    success: MessageFn;
+    warning: MessageFn;
+    error: MessageFn;
+    info: MessageFn;
+    loading: MessageFn;
+}
+/**
+ * 消息提示依赖注入
+ */
+interface MessageProvide {
+    /** 限制在主体内部的分组标识 */
+    groupKey: string;
+    /** 获取限制在主体内部的容器 */
+    getInnerWrap: () => HTMLElement;
+}
+/**
+ * 消息提示依赖注入key
+ */
+type MessageKey = InjectionKey<MessageProvide>;
+/**
+ * 提供各种调用方法
+ * @param options 参数
+ * @param context 上下文
+ */
+declare const EleMessage: Message;
+export { EleMessage };
+/**
+ * 消息提示依赖注入key
+ */
+export declare const MESSAGE_KEY: MessageKey;
+/**
+ * 带当前上下文的消息提示
+ * @param options 参数
+ */
+export declare function useMessage(globalOpt?: MessageOptions): Message;

package/lib/utils/resolvers.cjs

@@ -0,0 +1,50 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+function getSideEffects(path, options) {
+  const importStyle = options == null ? void 0 : options.importStyle;
+  if (!importStyle) {
+    return;
+  }
+  if (importStyle === "css") {
+    return `${path}/style/css`;
+  }
+  return `${path}/style/index`;
+}
+function getStylePath(namePath, packageName, path) {
+  if (!path) {
+    return `${packageName}/es/${namePath}`;
+  }
+  if (path === "/es/core") {
+    return `${packageName}/es/${namePath}`;
+  }
+  if (path === "/lib/core") {
+    return `${packageName}/lib/${namePath}`;
+  }
+  return `${packageName}${path}/${namePath}`;
+}
+function EleAdminResolver(options) {
+  return {
+    type: "component",
+    resolve: (name) => {
+      var _a;
+      const { path, exclude } = options || {};
+      if ((name.match(/^Ele[A-Z]/) || name.match(/^Yu[A-Z]/)) && !((_a = exclude == null ? void 0 : exclude.includes) == null ? void 0 : _a.call(exclude, name))) {
+        const packageName = "yuang-framework-ui-pc";
+        const namePath = name.replace(/([A-Z])/g, " $1").trim().split(" ").join("-").toLowerCase();
+        const stylePath = getStylePath(namePath, packageName, path);
+        if (!path || path === "/es/core" || path === "/lib/core") {
+          return {
+            name,
+            from: `${packageName}${path ?? "/es"}`,
+            sideEffects: getSideEffects(stylePath, options)
+          };
+        }
+        return {
+          from: `${packageName}${path}/${namePath}/index`,
+          sideEffects: getSideEffects(stylePath, options)
+        };
+      }
+    }
+  };
+}
+exports.EleAdminResolver = EleAdminResolver;