@wlydfe/pro-ui 0.2.21 → 0.2.24

package/es/components/utils/index.d.ts

@@ -0,0 +1,144 @@
+import { RouteComponent, RouteRecordRedirectOption, RouteLocationNormalized, RouteRecordName, NavigationGuardWithThis, RouteMeta } from 'vue-router';
+import { SetupContext, Component, VNode, RendererNode, RendererElement } from 'vue';
+import { FieldValueType, RecordType, PlusColumn, PlusRouteRecordRaw } from '@wlydfe/pro-ui/es/types';
+
+export * from './format';
+export * from './is';
+/**
+ * 获取table key
+ * @param item
+ * @returns
+ */
+export declare const getTableKey: (item: PlusColumn, hasEditable?: boolean) => string;
+/**
+ *  获取tooltip
+ * @param tooltip
+ * @returns
+ */
+export declare const getTooltip: (tooltip: PlusColumn['tooltip']) => RecordType;
+/**
+ * 获取自定义的props 支持对象 函数 和 Promise
+ * @param props
+ * @param value
+ * @param row
+ * @returns
+ */
+export declare const getCustomProps: (props: RecordType | ((...arg: any) => RecordType | Promise<RecordType>) | undefined, value: FieldValueType | undefined, row: RecordType, index: number, type: 'formItemProps' | 'fieldProps' | 'formProps') => Promise<any>;
+/**
+ * 处理slots
+ */
+export declare const handleSlots: (slots: PlusColumn['slots'], value: FieldValueType | undefined, params: RecordType) => RecordType;
+/**
+ * 处理slot名称
+ */
+export declare const getSlotName: (type: string, prop?: string | number) => string;
+/**
+ * 处理form-item中的slot名称
+ */
+export declare const getFieldSlotName: (prop?: string | number) => string;
+/**
+ *   处理form-item中的label slot名称
+ */
+export declare const getLabelSlotName: (prop?: string | number) => string;
+/**
+ *   处理form-item中的 extra slot名称
+ */
+export declare const getExtraSlotName: (prop?: string | number) => string;
+/**
+ *   处理form-item中的 previous slot名称
+ */
+export declare const getPreviousSlotName: (prop?: string | number) => string;
+/**
+ *   处理form中的 每一步分组的 slot名称
+ */
+export declare const getFormGroupSlotName: (prop?: string | number) => string;
+/**
+ * 处理table中的 header slot名称
+ */
+export declare const getTableHeaderSlotName: (prop?: string | number) => string;
+/**
+ * 处理table中的 cell slot名称
+ */
+export declare const getTableCellSlotName: (prop?: string | number) => string;
+/**
+ * 处理el-descriptions-item 的  slot名称
+ */
+export declare const getDescSlotName: (prop?: string | number) => string;
+/**
+ * 处理el-descriptions-item  label的  slot名称
+ */
+export declare const getDescLabelSlotName: (prop?: string | number) => string;
+/**
+ * 过滤slots
+ * @param slots
+ * @param name
+ * @returns
+ */
+export declare const filterSlots: (slots: RecordType, name: string) => SetupContext['slots'];
+/**
+ *  获取值  支持 x.y.z
+ * @param target
+ * @param key
+ * @returns
+ */
+export declare const getValue: (target: RecordType, key: string) => any;
+/**
+ *  设置值  支持 x.y.z
+ * @param target
+ * @param key
+ * @returns
+ */
+export declare const setValue: (target: RecordType, key: string, value: any) => RecordType;
+/**
+ * 版本比较
+ * @param version1
+ * @param version2
+ * @returns
+ */
+export declare const compareVersion: (version1: string, version2: string) => 1 | -1 | 0;
+/**
+ * element-plus版本号是否小于'2.6.0'
+ */
+export declare const versionIsLessThan260: boolean;
+/**
+ * element-plus版本号是否小于'2.9.9'
+ */
+export declare const versionIsLessThan299: boolean;
+/**
+ * 获取label
+ * @param label
+ * @returns
+ */
+export declare const getLabel: (label: PlusColumn['label']) => string;
+/**
+ * 移除children字段
+ * @param item *
+ * @version 0.1.21
+ * @fixed https://github.com/plus-pro-components/plus-pro-components/issues/258
+ */
+export declare const removeChildrenField: (item: PlusRouteRecordRaw) => {
+    __children: PlusRouteRecordRaw[] | undefined;
+    end?: boolean | undefined;
+    sensitive?: boolean | undefined;
+    strict?: boolean | undefined;
+    component?: ( RouteComponent | (() => Promise< RouteComponent>)) | null | undefined;
+    components?: Record<string, RouteComponent | (() => Promise< RouteComponent>)> | null | undefined;
+    redirect?: RouteRecordRedirectOption | undefined;
+    props?: (boolean | Record<string, any> | ((to: RouteLocationNormalized) => Record<string, any>)) | Record<string, boolean | Record<string, any> | ((to: RouteLocationNormalized) => Record<string, any>)> | undefined;
+    path?: string | undefined;
+    alias?: string | string[] | undefined;
+    name?: RouteRecordName | undefined;
+    beforeEnter?: NavigationGuardWithThis<undefined> | NavigationGuardWithThis<undefined>[] | undefined;
+    meta?: ( RouteMeta & {
+        title?: string | undefined;
+        icon?: Component | VNode<RendererNode, RendererElement, {
+            [key: string]: any;
+        }> | ((route: PlusRouteRecordRaw) => VNode<RendererNode, RendererElement, {
+            [key: string]: any;
+        }>) | undefined;
+        sort?: number | undefined;
+        hideInMenu?: boolean | undefined;
+        hideInBreadcrumb?: boolean | undefined;
+        disabled?: boolean | undefined;
+    }) | undefined;
+};

package/es/components/utils/index.mjs

@@ -0,0 +1,126 @@
+import { version } from 'element-plus/es/version';
+import { get, set } from 'lodash-es';
+import { unref, isRef } from 'vue';
+import { isBoolean, isString, isPlainObject, toRawType, isFunction, isPromise, isEmptyObject } from './is.mjs';
+export { isArray, isDate, isMap, isObject, isRegExp, isSVGElement, isSet, isSymbol, isUrl, objectToString, toTypeString } from './is.mjs';
+export { formatDate, formatMoney } from './format.mjs';
+
+const getTableKey = (item, hasEditable = false) => hasEditable && isBoolean(item.editable) ? item.label + item.prop + item.editable : item.label + item.prop;
+const getTooltip = (tooltip) => {
+  const tooltipData = unref(tooltip);
+  if (isString(tooltipData)) {
+    return { content: tooltipData };
+  }
+  if (isPlainObject(tooltipData)) {
+    return tooltipData;
+  }
+  return { content: "" };
+};
+const throwError = (data, type) => {
+  if (!isPlainObject(data)) {
+    throw new Error(`${type} expected Object but got ${toRawType(data)}`);
+  }
+};
+const getCustomProps = async (props, value, row, index, type) => {
+  try {
+    let data = {};
+    const params = { row, index };
+    if (!props) {
+      data = {};
+    } else if (isRef(props)) {
+      data = props.value;
+    } else if (isPlainObject(props)) {
+      data = { ...props };
+    } else if (isFunction(props)) {
+      data = await props(value, params);
+    } else if (isPromise(props)) {
+      data = await props;
+    } else {
+      data = props;
+    }
+    throwError(data, type);
+    return data;
+  } catch (error) {
+    return Promise.reject(error);
+  }
+};
+const handleSlots = (slots, value, params) => {
+  if (!slots || !isPlainObject(slots) || isEmptyObject(slots)) {
+    return {};
+  }
+  const slotsRes = {};
+  if (slots && !isEmptyObject(slots)) {
+    Object.keys(slots).forEach((key) => {
+      const temp = (...arg) => {
+        return () => slots[key](...arg);
+      };
+      slotsRes[key] = temp(value, params);
+    });
+  }
+  return slotsRes;
+};
+const getSlotName = (type, prop) => {
+  return prop ? `plus-${type}-${prop}` : `plus-${type}`;
+};
+const getFieldSlotName = (prop) => {
+  return `${getSlotName("field", prop)}`;
+};
+const getLabelSlotName = (prop) => {
+  return `${getSlotName("label", prop)}`;
+};
+const getExtraSlotName = (prop) => {
+  return `${getSlotName("extra", prop)}`;
+};
+const getPreviousSlotName = (prop) => {
+  return `${getSlotName("previous", prop)}`;
+};
+const getFormGroupSlotName = (prop) => {
+  return `${getSlotName("group", prop)}`;
+};
+const getTableHeaderSlotName = (prop) => {
+  return `${getSlotName("header", prop)}`;
+};
+const getTableCellSlotName = (prop) => {
+  return `${getSlotName("cell", prop)}`;
+};
+const getDescSlotName = (prop) => {
+  return `${getSlotName("desc", prop)}`;
+};
+const getDescLabelSlotName = (prop) => {
+  return `${getSlotName("desc-label", prop)}`;
+};
+const filterSlots = (slots, name) => {
+  const data = {};
+  Object.keys(slots || {}).forEach((key) => {
+    if (key.startsWith(name)) {
+      data[key] = slots[key];
+    }
+  });
+  return data;
+};
+const getValue = (target, key) => {
+  return get(target, key);
+};
+const setValue = (target, key, value) => {
+  return set(target, key, value);
+};
+const compareVersion = (version1, version2) => {
+  const arr1 = version1.split(".").map((item) => Number(item));
+  const arr2 = version2.split(".").map((item) => Number(item));
+  const length = Math.max(arr1.length, arr2.length);
+  for (let i = 0; i < length; i++) {
+    if ((arr1[i] || 0) > (arr2[i] || 0)) return 1;
+    if ((arr1[i] || 0) < (arr2[i] || 0)) return -1;
+  }
+  return 0;
+};
+const versionIsLessThan260 = compareVersion(version, "2.6.0") < 0;
+const versionIsLessThan299 = compareVersion(version, "2.9.9") < 0;
+const getLabel = (label) => label ? unref(label) : "";
+const removeChildrenField = (item) => {
+  const { children, ...rest } = item;
+  const data = { ...rest, __children: children };
+  return data;
+};
+
+export { compareVersion, filterSlots, getCustomProps, getDescLabelSlotName, getDescSlotName, getExtraSlotName, getFieldSlotName, getFormGroupSlotName, getLabel, getLabelSlotName, getPreviousSlotName, getSlotName, getTableCellSlotName, getTableHeaderSlotName, getTableKey, getTooltip, getValue, handleSlots, isBoolean, isEmptyObject, isFunction, isPlainObject, isPromise, isString, removeChildrenField, setValue, toRawType, versionIsLessThan260, versionIsLessThan299 };

package/es/components/utils/is.d.ts

@@ -0,0 +1,104 @@
+/**
+ * Object.prototype.toString 别名
+ */
+export declare const objectToString: () => string;
+/**
+ * 获取类型
+ * @param value
+ * @returns
+ */
+export declare const toTypeString: (value: any) => string;
+/**
+ * 拿到类型字符串
+ * @param value
+ * @returns
+ */
+export declare const toRawType: (value: any) => string;
+/**
+ * 判断是否是数组
+ */
+export declare const isArray: (arg: any) => arg is any[];
+/**
+ * 判断是否是Map
+ * @param val
+ * @returns
+ */
+export declare const isMap: (val: any) => val is Map<any, any>;
+/**
+ * 判断是否是Set
+ * @param val
+ * @returns
+ */
+export declare const isSet: (val: any) => val is Set<any>;
+/**
+ * 判断是否是Date
+ * @param val
+ * @returns
+ */
+export declare const isDate: (val: any) => val is Date;
+/**
+ * 判断是否是Reg
+ * @param val
+ * @returns
+ */
+export declare const isRegExp: (val: any) => val is RegExp;
+/**
+ * 判断是否是函数
+ * @param val
+ * @returns
+ */
+export declare const isFunction: (val: any) => val is Function;
+/**
+ * 判断是否是字符串
+ * @param val
+ * @returns
+ */
+export declare const isString: (val: any) => val is string;
+/**
+ * 判断是否是Symbol
+ * @param val
+ * @returns
+ */
+export declare const isSymbol: (val: any) => val is symbol;
+/**
+ * 判断是否是boolean
+ * @param val
+ * @returns
+ */
+export declare const isBoolean: (val: any) => val is boolean;
+/**
+ * 判断是否是object
+ * @param val
+ * @returns
+ */
+export declare const isObject: (val: any) => val is Record<string | number | symbol, any>;
+/**
+ * 判断是否是Promise
+ * @param val
+ * @returns
+ */
+export declare const isPromise: <T = any>(val: any) => val is Promise<T>;
+/**
+ * 判断是否是 纯对象 object
+ * @param val
+ * @returns
+ */
+export declare const isPlainObject: (val: any) => val is Record<string | number | symbol, any>;
+/**
+ * 是否是空对象
+ * @param val
+ * @returns
+ */
+export declare const isEmptyObject: (val: any) => val is Record<string | number | symbol, any>;
+/**
+ * 是否是链接
+ * @param url
+ * @returns
+ */
+export declare function isUrl(url: string): url is string;
+/**
+ * 是否是SVGElement
+ * @param tag
+ * @returns
+ */
+export declare const isSVGElement: (tag: any) => tag is SVGElement;

package/es/components/utils/is.mjs

@@ -0,0 +1,30 @@
+const objectToString = Object.prototype.toString;
+const toTypeString = (value) => objectToString.call(value);
+const toRawType = (value) => {
+  return toTypeString(value).slice(8, -1);
+};
+const isArray = Array.isArray;
+const isMap = (val) => toTypeString(val) === "[object Map]";
+const isSet = (val) => toTypeString(val) === "[object Set]";
+const isDate = (val) => toTypeString(val) === "[object Date]";
+const isRegExp = (val) => toTypeString(val) === "[object RegExp]";
+const isFunction = (val) => typeof val === "function";
+const isString = (val) => typeof val === "string";
+const isSymbol = (val) => typeof val === "symbol";
+const isBoolean = (val) => typeof val === "boolean";
+const isObject = (val) => val !== null && typeof val === "object";
+const isPromise = (val) => {
+  return isObject(val) && isFunction(val.then) && isFunction(val.catch);
+};
+const isPlainObject = (val) => toTypeString(val) === "[object Object]";
+const isEmptyObject = (val) => isPlainObject(val) && Object.keys(val).length === 0;
+function isUrl(url) {
+  const regex = new RegExp(
+    "^(https?:\\/\\/)?((([a-z\\d]([a-z\\d-]*[a-z\\d])*)\\.)+[a-z]{2,}|((\\d{1,3}\\.){3}\\d{1,3}))(\\:\\d+)?(\\/[-a-z\\d%_.~+]*)*(\\?[;&a-z\\d%_.~+=-]*)?(\\#[-a-z\\d_]*)?$",
+    "i"
+  );
+  return regex.test(url);
+}
+const isSVGElement = (tag) => typeof SVGElement !== "undefined" && tag instanceof SVGElement;
+
+export { isArray, isBoolean, isDate, isEmptyObject, isFunction, isMap, isObject, isPlainObject, isPromise, isRegExp, isSVGElement, isSet, isString, isSymbol, isUrl, objectToString, toRawType, toTypeString };

package/es/constants/display-item.d.ts

@@ -0,0 +1,4 @@
+/**
+ * 需要显示成label的valueType列表
+ */
+export declare const selectValueTypeList: (string | undefined)[];

package/es/constants/display-item.mjs

@@ -0,0 +1,9 @@
+const selectValueTypeList = [
+  "select",
+  "radio",
+  "checkbox",
+  "select-v2",
+  "plus-radio"
+];
+
+export { selectValueTypeList };

package/es/constants/form.d.ts

@@ -0,0 +1,28 @@
+/**
+ * 表格里表单的provide(inject) key
+ */
+export declare const TableFormRefInjectionKey: unique symbol;
+/**
+ * 表格里表单每一项 的provide(inject) key
+ */
+export declare const TableFormFieldRefInjectionKey: unique symbol;
+/**
+ * 表格里表单 表格行信息 provide(inject) key
+ */
+export declare const TableFormRowInfoInjectionKey: unique symbol;
+/**
+ *  表单ElDatePicker 组件 值是数组的type列表
+ */
+export declare const DatePickerValueIsArrayList: string[];
+/**
+ * 表单组件值是数字类型的valueType列表
+ */
+export declare const ValueIsNumberList: string[];
+/**
+ * 表单组件值是布尔类型的valueType列表
+ */
+export declare const ValueIsBooleanList: string[];
+/**
+ *  表单组件值是数组的valueType列表
+ */
+export declare const ValueIsArrayList: string[];

package/es/constants/form.mjs

@@ -0,0 +1,15 @@
+const TableFormRefInjectionKey = Symbol("tableFormRefInjectionKey");
+const TableFormFieldRefInjectionKey = Symbol("tableFormFieldRefInjectionKey");
+const TableFormRowInfoInjectionKey = Symbol("tableFormRowInfoInjectionKey");
+const DatePickerValueIsArrayList = ["datetimerange", "daterange", "monthrange"];
+const ValueIsNumberList = ["rate", "input-number", "slider"];
+const ValueIsBooleanList = ["switch"];
+const ValueIsArrayList = [
+  "checkbox",
+  "cascader",
+  "plus-date-picker",
+  "plus-input-tag",
+  "transfer"
+];
+
+export { DatePickerValueIsArrayList, TableFormFieldRefInjectionKey, TableFormRefInjectionKey, TableFormRowInfoInjectionKey, ValueIsArrayList, ValueIsBooleanList, ValueIsNumberList };

package/es/constants/index.d.ts

@@ -0,0 +1,3 @@
+export * from './page';
+export * from './form';
+export * from './display-item';

package/es/constants/index.mjs

@@ -0,0 +1,3 @@
+export { DefaultPageInfo, DefaultPageSizeList } from './page.mjs';
+export { DatePickerValueIsArrayList, TableFormFieldRefInjectionKey, TableFormRefInjectionKey, TableFormRowInfoInjectionKey, ValueIsArrayList, ValueIsBooleanList, ValueIsNumberList } from './form.mjs';
+export { selectValueTypeList } from './display-item.mjs';

package/es/constants/page.d.ts

@@ -0,0 +1,10 @@
+import { PageInfo } from '@wlydfe/pro-ui/es/types';
+
+/**
+ *默认的分页列表
+ */
+export declare const DefaultPageSizeList: number[];
+/**
+ * 默认的分页参数
+ */
+export declare const DefaultPageInfo: PageInfo;

package/es/constants/page.mjs

@@ -0,0 +1,7 @@
+const DefaultPageSizeList = [10, 20, 30, 40, 50, 100, 200, 300, 400, 500];
+const DefaultPageInfo = {
+  page: 1,
+  pageSize: 20
+};
+
+export { DefaultPageInfo, DefaultPageSizeList };

package/es/defaults.d.ts

@@ -0,0 +1,5 @@
+import { App } from 'vue';
+declare const _default: {
+    install: (app: App<any>) => void;
+};
+export default _default;

package/es/defaults.mjs

@@ -0,0 +1,6 @@
+import { makeInstaller } from './make-installer.mjs';
+import plugins from './component.mjs';
+
+var installer = makeInstaller([...plugins]);
+
+export { installer as default };

package/es/directives/click/index.d.ts

@@ -0,0 +1,8 @@
+import { useClickControl } from './useClickControl';
+import { Directive } from 'vue';
+
+export interface ClickElement extends HTMLElement {
+    _clickHandler?: (event: Event) => void;
+    _clickControl?: ReturnType<typeof useClickControl>;
+}
+export declare const click: Directive;

package/es/directives/click/index.mjs

@@ -0,0 +1,52 @@
+import { watch } from 'vue';
+import { useClickControl } from './useClickControl.mjs';
+import { CLICK_CONST } from './type.mjs';
+
+const click = {
+  mounted(el, binding) {
+    const handler = binding.value;
+    if (!handler) {
+      console.warn(CLICK_CONST.ERROR_MESSAGE.NO_HANDLER);
+      return;
+    }
+    const delay = Object.keys(binding.modifiers).find((key) => /^\d+$/.test(key));
+    const mode = binding.modifiers[CLICK_CONST.MODIFIERS.DEBOUNCE] ? CLICK_CONST.MODIFIERS.DEBOUNCE : CLICK_CONST.MODIFIERS.THROTTLE;
+    el._clickControl = useClickControl();
+    el._clickHandler = (event) => {
+      var _a;
+      (_a = el._clickControl) == null ? void 0 : _a.executeHandler(() => handler(event), {
+        delay: delay ? parseInt(delay) : void 0,
+        mode
+      });
+    };
+    el.addEventListener("click", el._clickHandler);
+    const unwatch = watch(
+      () => {
+        var _a;
+        return (_a = el._clickControl) == null ? void 0 : _a.isProcessing.value;
+      },
+      (isProcessing) => {
+        if (isProcessing) {
+          el.classList.add("is-clicking");
+        } else {
+          el.classList.remove("is-clicking");
+        }
+      }
+    );
+    el._unwatchLoading = unwatch;
+  },
+  unmounted(el) {
+    if (el._clickHandler) {
+      el.removeEventListener("click", el._clickHandler);
+    }
+    if (el._clickControl) {
+      el._clickControl.cleanup();
+    }
+    if (el._unwatchLoading) {
+      ;
+      el._unwatchLoading();
+    }
+  }
+};
+
+export { click };

package/es/directives/click/type.d.ts

@@ -0,0 +1,16 @@
+export declare const CLICK_CONST: {
+    readonly MODIFIERS: {
+        readonly DEBOUNCE: "debounce";
+        readonly THROTTLE: "throttle";
+    };
+    readonly DEFAULT: {
+        readonly DELAY: 300;
+        readonly MODE: "throttle";
+    };
+    readonly ERROR_MESSAGE: {
+        readonly NO_HANDLER: "[v-click] handler is required";
+        readonly INVALID_HANDLER: "[v-click] handler must be a function";
+        readonly INVALID_DELAY: "[v-click] delay must be a positive number";
+    };
+};
+export type ClickMode = (typeof CLICK_CONST.MODIFIERS)[keyof typeof CLICK_CONST.MODIFIERS];

package/es/directives/click/type.mjs

@@ -0,0 +1,17 @@
+const CLICK_CONST = {
+  MODIFIERS: {
+    DEBOUNCE: "debounce",
+    THROTTLE: "throttle"
+  },
+  DEFAULT: {
+    DELAY: 300,
+    MODE: "throttle"
+  },
+  ERROR_MESSAGE: {
+    NO_HANDLER: "[v-click] handler is required",
+    INVALID_HANDLER: "[v-click] handler must be a function",
+    INVALID_DELAY: "[v-click] delay must be a positive number"
+  }
+};
+
+export { CLICK_CONST };

package/es/directives/click/useClickControl.d.ts

@@ -0,0 +1,13 @@
+import { Ref } from 'vue';
+import { ClickMode } from './type';
+
+interface ClickControlOptions {
+    delay?: number;
+    mode?: ClickMode;
+}
+export declare function useClickControl(): {
+    executeHandler: <T extends (...args: any[]) => any>(handler: T, options?: ClickControlOptions) => Promise<void>;
+    isProcessing: Ref<boolean>;
+    cleanup: () => void;
+};
+export {};