ele-admin-plus 1.0.1 → 1.0.2

package/lib/ele-pro-layout/props.js

@@ -87,10 +87,7 @@ const proLayoutProps = {
     default: false
   },
   // 是否固定侧栏
-  fixedSidebar: {
-    type: Boolean,
-    default: true
-  },
+  fixedSidebar: Boolean,
   // 是否固定内容区
   fixedBody: Boolean,
   // 内容区是否撑满
@@ -131,7 +128,7 @@ const proLayoutProps = {
   sidebarOpeneds: Array,
   // 是否支持页签右键菜单
   tabContextMenu: Boolean,
-  // 是否支持
+  // 是否支持页签拖动排序
   tabSortable: Boolean,
   // 固定主体时切换路由自动滚到顶部
   autoScrollTop: {

package/lib/ele-pro-layout/types/index.d.ts

@@ -10,7 +10,7 @@ export interface MenuMeta extends RouteMeta {
     /** 菜单标题 */
     title?: string;
     /** 菜单图标 */
-    icon?: string;
+    icon?: MenuItemProps['icon'];
     /** 菜单是否隐藏 */
     hide?: boolean;
     /** 选中其它菜单 */

package/lib/ele-pro-table/components/table-view.d.ts

@@ -79,10 +79,6 @@ declare const _default: import("vue").DefineComponent<{
     };
     lazy: BooleanConstructor;
     load: import("vue").PropType<((row: any, treeNode: import("element-plus/es/components/table/src/table/defaults").TreeNode, resolve: (data: any[]) => void) => void) | undefined>;
-    style: {
-        type: import("vue").PropType<import("vue").CSSProperties>;
-        default: () => {};
-    };
     className: {
         type: StringConstructor;
         default: string;
@@ -209,10 +205,6 @@ declare const _default: import("vue").DefineComponent<{
     };
     lazy: BooleanConstructor;
     load: import("vue").PropType<((row: any, treeNode: import("element-plus/es/components/table/src/table/defaults").TreeNode, resolve: (data: any[]) => void) => void) | undefined>;
-    style: {
-        type: import("vue").PropType<import("vue").CSSProperties>;
-        default: () => {};
-    };
     className: {
         type: StringConstructor;
         default: string;
@@ -246,13 +238,10 @@ declare const _default: import("vue").DefineComponent<{
     onHeaderDragend?: ((_width: number, _old: number, _column: import("../types").Column, _e: MouseEvent) => any) | undefined;
     onExpandChange?: ((_row: import("../types").DataItem, _expanded: boolean) => any) | undefined;
 }, {
-    className: string;
-    style: import("vue").CSSProperties;
-    stripe: boolean;
-    border: boolean;
-    loading: boolean;
     data: any[];
     fit: boolean;
+    stripe: boolean;
+    border: boolean;
     showHeader: boolean;
     showSummary: boolean;
     highlightCurrentRow: boolean;
@@ -264,8 +253,10 @@ declare const _default: import("vue").DefineComponent<{
         children?: string | undefined;
     } | undefined;
     lazy: boolean;
+    className: string;
     tableLayout: "fixed" | "auto";
     scrollbarAlwaysOn: boolean;
     flexible: boolean;
+    loading: boolean;
 }, {}>;
 export default _default;

package/lib/ele-pro-table/index.d.ts

@@ -139,10 +139,6 @@ declare const _sfc_main: import("vue").DefineComponent<{
     };
     lazy: BooleanConstructor;
     load: import("vue").PropType<((row: any, treeNode: import("element-plus/es/components/table/src/table/defaults").TreeNode, resolve: (data: any[]) => void) => void) | undefined>;
-    style: {
-        type: import("vue").PropType<CSSProperties>;
-        default: () => {};
-    };
     className: {
         type: StringConstructor;
         default: string;
@@ -187,16 +183,16 @@ declare const _sfc_main: import("vue").DefineComponent<{
         hideInTable?: boolean | undefined;
         hideInSetting?: boolean | undefined;
         children?: any[] | undefined;
-        type?: string | undefined;
         width?: string | number | undefined;
+        type?: string | undefined;
         minWidth?: string | number | undefined;
         sortable?: string | boolean | undefined;
         resizable?: boolean | undefined;
         reserveSelection?: boolean | undefined;
         filterMultiple?: boolean | undefined;
         sortOrders?: ("ascending" | "descending" | null)[] | undefined;
-        label?: string | undefined;
         className?: string | undefined;
+        label?: string | undefined;
         labelClassName?: string | undefined;
         property?: string | undefined;
         prop?: string | undefined;
@@ -346,7 +342,7 @@ declare const _sfc_main: import("vue").DefineComponent<{
     tableIndex: import("vue").ComputedRef<number>;
     paginationProps: import("vue").ComputedRef<Partial<PaginationProps> | null>;
     tableProps: import("vue").ComputedRef<Partial<TableViewProps>>;
-    tableStyle: import("vue").ComputedRef<CSSProperties>;
+    proTableStyle: import("vue").ComputedRef<CSSProperties>;
     tableTools: import("vue").ComputedRef<TableTool[]>;
     tableLoad: (row: DataItem, treeNode: import("element-plus/es/components/table/src/table/defaults").TreeNode, resolve: (data: DataItem[]) => void) => void;
     onRefresh: () => void;
@@ -543,10 +539,6 @@ declare const _sfc_main: import("vue").DefineComponent<{
     };
     lazy: BooleanConstructor;
     load: import("vue").PropType<((row: any, treeNode: import("element-plus/es/components/table/src/table/defaults").TreeNode, resolve: (data: any[]) => void) => void) | undefined>;
-    style: {
-        type: import("vue").PropType<CSSProperties>;
-        default: () => {};
-    };
     className: {
         type: StringConstructor;
         default: string;
@@ -587,10 +579,7 @@ declare const _sfc_main: import("vue").DefineComponent<{
     onMaximizedChange?: ((_maximized: boolean) => any) | undefined;
     onRefresh?: (() => any) | undefined;
 }, {
-    className: string;
-    style: CSSProperties;
     data: any[];
-    loading: boolean;
     fit: boolean;
     stripe: boolean;
     border: boolean;
@@ -605,9 +594,11 @@ declare const _sfc_main: import("vue").DefineComponent<{
         children?: string | undefined;
     } | undefined;
     lazy: boolean;
+    className: string;
     tableLayout: "fixed" | "auto";
     scrollbarAlwaysOn: boolean;
     flexible: boolean;
+    loading: boolean;
     loadOnCreated: boolean;
     loadOnChanged: boolean;
     toolbar: boolean | import("./types").TableToolbar;

package/lib/ele-pro-table/index.js

@@ -71,7 +71,7 @@ const _sfc_main = vue.defineComponent({
       };
       return Object.assign(core.pick(props$1, props.tablePropKeys), opt);
     });
-    const tableStyle = vue.computed(() => {
+    const proTableStyle = vue.computed(() => {
       if (!tableMaximized.value) {
         return {};
       }
@@ -475,7 +475,7 @@ const _sfc_main = vue.defineComponent({
       tableIndex,
       paginationProps,
       tableProps,
-      tableStyle,
+      proTableStyle,
       tableTools,
       tableLoad,
       onRefresh,
@@ -521,7 +521,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
       { "is-header-ellipsis": _ctx.headerEllipsis },
       { "is-maximized": _ctx.tableMaximized }
     ]),
-    style: vue.normalizeStyle(_ctx.tableStyle)
+    style: vue.normalizeStyle(_ctx.proTableStyle)
   }, [
     _ctx.toolbar ? (vue.openBlock(), vue.createBlock(_component_EleToolbar, vue.normalizeProps(vue.mergeProps({ key: 0 }, _ctx.toolbar === true ? {} : _ctx.toolbar)), {
       tools: vue.withCtx(() => [

package/lib/ele-pro-table/props.d.ts

@@ -1,6 +1,96 @@
 import type { PropType, CSSProperties, ExtractPropTypes } from 'vue';
-import tableProps from 'element-plus/es/components/table/src/table/defaults';
 import type { Column, Columns, DataItem, Where, Datasource, RequestOption, ResponseOption, ParseData, Sorter, Filter, DoneParams, TablePagination, TableToolbar, TableTool, TableSize, RowClickChecked, TableLocale } from './types';
+declare const tableProps: Omit<{
+    data: {
+        type: PropType<any[]>;
+        default: () => never[];
+    };
+    size: {
+        readonly type: PropType<import("element-plus/es/utils").EpPropMergeType<StringConstructor, "" | "default" | "small" | "large", never>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    width: (StringConstructor | NumberConstructor)[];
+    height: (StringConstructor | NumberConstructor)[];
+    maxHeight: (StringConstructor | NumberConstructor)[];
+    fit: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    stripe: BooleanConstructor;
+    border: BooleanConstructor;
+    rowKey: PropType<string | ((row: any) => string) | undefined>;
+    showHeader: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    showSummary: BooleanConstructor;
+    sumText: StringConstructor;
+    summaryMethod: PropType<import("element-plus/es/components/table/src/table/defaults").SummaryMethod<any> | undefined>;
+    rowClassName: PropType<import("element-plus/es/components/table/src/table/defaults").ColumnCls<any> | undefined>;
+    rowStyle: PropType<import("element-plus/es/components/table/src/table/defaults").ColumnStyle<any> | undefined>;
+    cellClassName: PropType<import("element-plus/es/components/table/src/table/defaults").CellCls<any> | undefined>;
+    cellStyle: PropType<import("element-plus/es/components/table/src/table/defaults").CellStyle<any> | undefined>;
+    headerRowClassName: PropType<import("element-plus/es/components/table/src/table/defaults").ColumnCls<any> | undefined>;
+    headerRowStyle: PropType<import("element-plus/es/components/table/src/table/defaults").ColumnStyle<any> | undefined>;
+    headerCellClassName: PropType<import("element-plus/es/components/table/src/table/defaults").CellCls<any> | undefined>;
+    headerCellStyle: PropType<import("element-plus/es/components/table/src/table/defaults").CellStyle<any> | undefined>;
+    highlightCurrentRow: BooleanConstructor;
+    currentRowKey: (StringConstructor | NumberConstructor)[];
+    emptyText: StringConstructor;
+    expandRowKeys: PropType<any[] | undefined>;
+    defaultExpandAll: BooleanConstructor;
+    defaultSort: PropType<import("element-plus/es/components/table/src/table/defaults").Sort | undefined>;
+    tooltipEffect: StringConstructor;
+    tooltipOptions: PropType<Partial<Pick<import("element-plus").ElTooltipProps, "showArrow" | "effect" | "enterable" | "popperClass" | "offset" | "placement" | "popperOptions" | "showAfter" | "hideAfter">> | undefined>;
+    spanMethod: PropType<((data: {
+        row: any;
+        rowIndex: number;
+        column: import("element-plus/es/components/table/src/table-column/defaults").TableColumnCtx<any>;
+        columnIndex: number;
+    }) => number[] | {
+        rowspan: number;
+        colspan: number;
+    } | undefined) | undefined>;
+    selectOnIndeterminate: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    indent: {
+        type: NumberConstructor;
+        default: number;
+    };
+    treeProps: {
+        type: PropType<{
+            hasChildren?: string | undefined;
+            children?: string | undefined;
+        } | undefined>;
+        default: () => {
+            hasChildren: string;
+            children: string;
+        };
+    };
+    lazy: BooleanConstructor;
+    load: PropType<((row: any, treeNode: import("element-plus/es/components/table/src/table/defaults").TreeNode, resolve: (data: any[]) => void) => void) | undefined>;
+    style: {
+        type: PropType<CSSProperties>;
+        default: () => {};
+    };
+    className: {
+        type: StringConstructor;
+        default: string;
+    };
+    tableLayout: {
+        type: PropType<"fixed" | "auto">;
+        default: string;
+    };
+    scrollbarAlwaysOn: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    flexible: BooleanConstructor;
+}, "style">;
 /**
  * 表格组件属性
  */
@@ -83,10 +173,6 @@ export declare const tableViewProps: {
     };
     lazy: BooleanConstructor;
     load: PropType<((row: any, treeNode: import("element-plus/es/components/table/src/table/defaults").TreeNode, resolve: (data: any[]) => void) => void) | undefined>;
-    style: {
-        type: PropType<CSSProperties>;
-        default: () => {};
-    };
     className: {
         type: StringConstructor;
         default: string;
@@ -239,10 +325,6 @@ export declare const proTableProps: {
     };
     lazy: BooleanConstructor;
     load: PropType<((row: any, treeNode: import("element-plus/es/components/table/src/table/defaults").TreeNode, resolve: (data: any[]) => void) => void) | undefined>;
-    style: {
-        type: PropType<CSSProperties>;
-        default: () => {};
-    };
     className: {
         type: StringConstructor;
         default: string;
@@ -321,3 +403,4 @@ export type TablePropKeys = Array<keyof typeof tableProps>;
  * 表格组件属性名
  */
 export declare const tablePropKeys: TablePropKeys;
+export {};

package/lib/ele-pro-table/props.js

@@ -1,6 +1,8 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const tableProps = require("element-plus/es/components/table/src/table/defaults");
+const elTableProps = require("element-plus/es/components/table/src/table/defaults");
+const core = require("../utils/core");
+const tableProps = core.omit(elTableProps, ["style"]);
 const tableViewProps = {
   ...tableProps,
   // 列配置

package/lib/ele-pro-table/style/index.scss

@@ -119,7 +119,7 @@
   & > .el-table__inner-wrapper > .el-table__header-wrapper {
     position: sticky;
     top: eleVar('table', 'sticky-top');
-    z-index: var(#{eleVarName('layout', 'index')}, 2);
+    z-index: 3;
   }
 }
 
@@ -133,7 +133,7 @@
 
 /* 全屏 */
 .ele-pro-table.is-maximized {
-  position: fixed;
+  position: fixed !important;
   top: 0;
   left: 0;
   width: 100vw;

package/lib/ele-segmented/index.js

@@ -27,7 +27,10 @@ const _export_sfc = (sfc, props2) => {
   }
   return target;
 };
-const _hoisted_1 = { class: "ele-segmented-item-label" };
+const _hoisted_1 = {
+  key: 1,
+  class: "ele-segmented-item-label"
+};
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_ElIcon = vue.resolveComponent("ElIcon");
   const _component_ElTabPane = vue.resolveComponent("ElTabPane");
@@ -62,7 +65,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
                 ]),
                 _: 2
               }, 1040)) : vue.createCommentVNode("", true),
-              vue.createElementVNode("div", _hoisted_1, vue.toDisplayString(item.label), 1)
+              item.label ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1, vue.toDisplayString(item.label), 1)) : vue.createCommentVNode("", true)
             ])
           ]),
           _: 2

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

@@ -8,7 +8,6 @@ declare const _sfc_main: import("vue").DefineComponent<{
     titleStyle: import("vue").PropType<import("vue").CSSProperties>;
     bodyStyle: import("vue").PropType<import("vue").CSSProperties>;
     toolsStyle: import("vue").PropType<import("vue").CSSProperties>;
-    form: BooleanConstructor;
 }, unknown, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     title: StringConstructor;
     subtitle: StringConstructor;
@@ -19,9 +18,7 @@ declare const _sfc_main: import("vue").DefineComponent<{
     titleStyle: import("vue").PropType<import("vue").CSSProperties>;
     bodyStyle: import("vue").PropType<import("vue").CSSProperties>;
     toolsStyle: import("vue").PropType<import("vue").CSSProperties>;
-    form: BooleanConstructor;
 }>>, {
     theme: import("./types").ToolbarTheme;
-    form: boolean;
 }, {}>;
 export default _sfc_main;

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

@@ -13,6 +13,5 @@ export declare const toolbarProps: {
     titleStyle: PropType<CSSProperties>;
     bodyStyle: PropType<CSSProperties>;
     toolsStyle: PropType<CSSProperties>;
-    form: BooleanConstructor;
 };
 export type ToolbarProps = ExtractPropTypes<typeof toolbarProps>;

package/lib/ele-toolbar/props.js

@@ -15,8 +15,6 @@ const toolbarProps = {
   // 内容区样式
   bodyStyle: Object,
   // 按钮区样式
-  toolsStyle: Object,
-  // 是否是表单
-  form: Boolean
+  toolsStyle: Object
 };
 exports.toolbarProps = toolbarProps;

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

@@ -9,8 +9,13 @@ declare const _sfc_main: import("vue").DefineComponent<{
     font: import("vue").PropType<import("./types").WatermarkFont>;
     gap: import("vue").PropType<import("./types").WatermarkGap>;
     offset: import("vue").PropType<import("./types").WatermarkOffset>;
+    customStyle: import("vue").PropType<CSSProperties>;
 }, {
-    imgStyle: import("vue").ComputedRef<CSSProperties>;
+    rootKey: import("vue").Ref<number>;
+    rootRef: import("vue").Ref<HTMLDivElement | null>;
+    imgKey: import("vue").Ref<number>;
+    imgRef: import("vue").Ref<HTMLDivElement | null>;
+    imgStyle: import("vue").Ref<CSSProperties | undefined>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     width: NumberConstructor;
     height: NumberConstructor;
@@ -21,5 +26,6 @@ declare const _sfc_main: import("vue").DefineComponent<{
     font: import("vue").PropType<import("./types").WatermarkFont>;
     gap: import("vue").PropType<import("./types").WatermarkGap>;
     offset: import("vue").PropType<import("./types").WatermarkOffset>;
+    customStyle: import("vue").PropType<CSSProperties>;
 }>>, {}, {}>;
 export default _sfc_main;

package/lib/ele-watermark/index.js

@@ -10,29 +10,61 @@ const _sfc_main = vue.defineComponent({
   props: props.watermarkProps,
   setup(props2) {
     const { authenticated } = receiver.useLicense();
-    const base64 = vue.ref(null);
-    const imgSize = vue.ref(null);
-    const imgStyle = vue.computed(() => {
+    const { observe, disconnect } = util.useMutation({
+      getRoot: () => rootRef.value,
+      getEl: () => imgRef.value,
+      onDeleted: () => {
+        disconnect();
+        rootKey.value = rootKey.value + 1;
+        vue.nextTick(() => {
+          observe();
+        });
+      },
+      onDalsified: () => {
+        disconnect();
+        imgKey.value = imgKey.value + 1;
+        vue.nextTick(() => {
+          observe();
+        });
+      }
+    });
+    const rootKey = vue.ref(1);
+    const rootRef = vue.ref(null);
+    const imgKey = vue.ref(1);
+    const imgRef = vue.ref(null);
+    const imgStyle = vue.ref();
+    const updateStyle = (base64, size) => {
       const style = {
-        position: "absolute",
-        top: 0,
-        left: 0,
-        width: "100%",
-        height: "100%",
-        pointerEvents: "none",
-        backgroundRepeat: "repeat"
+        position: "absolute !important",
+        top: "0 !important",
+        left: "0 !important",
+        right: "auto !important",
+        bottom: "auto !important",
+        width: "100% !important",
+        height: "100% !important",
+        pointerEvents: "none !important",
+        backgroundRepeat: "repeat !important",
+        opacity: "1 !important",
+        transform: "none !important",
+        filter: "none !important",
+        display: "block !important",
+        ...props2.customStyle
       };
-      if (!authenticated || !base64.value) {
-        style.display = "none";
+      if (!authenticated || !base64) {
+        style.display = "none !important";
       } else {
-        style.backgroundImage = `url('${base64.value}')`;
-        if (imgSize.value) {
-          style.backgroundSize = imgSize.value;
+        style.backgroundImage = `url('${base64}') !important`;
+        if (size) {
+          style.backgroundSize = `${size} !important`;
         }
-        style.zIndex = props2.zIndex ?? 9;
+        style.zIndex = `${props2.zIndex ?? 2147483647} !important`;
       }
-      return style;
-    });
+      disconnect();
+      imgStyle.value = style;
+      vue.nextTick(() => {
+        observe();
+      });
+    };
     const getDefaultWidth = (ctx) => {
       if (props2.image || !ctx.measureText) {
         return 120;
@@ -120,8 +152,7 @@ const _sfc_main = vue.defineComponent({
             drawWidth,
             drawHeight
           );
-          base64.value = canvas.toDataURL();
-          imgSize.value = `${(gapX + markWidth) * SIZE}px`;
+          updateStyle(canvas.toDataURL(), `${(gapX + markWidth) * SIZE}px`);
         };
         img.crossOrigin = "anonymous";
         img.referrerPolicy = "no-referrer";
@@ -131,13 +162,15 @@ const _sfc_main = vue.defineComponent({
         ctx.restore();
         util.rotateWatermark(ctx, alternateRotateX, alternateRotateY, rotate);
         fillTexts(ctx, alternateDrawX, alternateDrawY, drawWidth, drawHeight);
-        base64.value = canvas.toDataURL();
-        imgSize.value = `${(gapX + markWidth) * SIZE}px`;
+        updateStyle(canvas.toDataURL(), `${(gapX + markWidth) * SIZE}px`);
       }
     };
     vue.onMounted(() => {
       render();
     });
+    vue.onBeforeMount(() => {
+      disconnect();
+    });
     vue.watch(
       () => props2,
       () => {
@@ -145,7 +178,7 @@ const _sfc_main = vue.defineComponent({
       },
       { deep: true }
     );
-    return { imgStyle };
+    return { rootKey, rootRef, imgKey, imgRef, imgStyle };
   }
 });
 const _export_sfc = (sfc, props2) => {
@@ -155,13 +188,18 @@ const _export_sfc = (sfc, props2) => {
   }
   return target;
 };
-const _hoisted_1 = { style: { position: "relative" } };
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+  return vue.openBlock(), vue.createElementBlock("div", {
+    ref: "rootRef",
+    key: _ctx.rootKey,
+    style: { position: "relative" }
+  }, [
     vue.renderSlot(_ctx.$slots, "default"),
-    vue.createElementVNode("div", {
+    (vue.openBlock(), vue.createElementBlock("div", {
+      ref: "imgRef",
+      key: _ctx.imgKey,
       style: vue.normalizeStyle(_ctx.imgStyle)
-    }, null, 4)
+    }, null, 4))
   ]);
 }
 const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);

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

@@ -1,4 +1,4 @@
-import type { PropType, ExtractPropTypes } from 'vue';
+import type { PropType, ExtractPropTypes, CSSProperties } from 'vue';
 import type { WatermarkGap, WatermarkOffset, WatermarkFont } from './types';
 export declare const watermarkProps: {
     width: NumberConstructor;
@@ -10,5 +10,6 @@ export declare const watermarkProps: {
     font: PropType<WatermarkFont>;
     gap: PropType<WatermarkGap>;
     offset: PropType<WatermarkOffset>;
+    customStyle: PropType<CSSProperties>;
 };
 export type WatermarkProps = ExtractPropTypes<typeof watermarkProps>;

package/lib/ele-watermark/props.js

@@ -18,6 +18,8 @@ const watermarkProps = {
   // 间距
   gap: Array,
   // 距离左上角的偏移量
-  offset: Array
+  offset: Array,
+  // 自定义样式
+  customStyle: Object
 };
 exports.watermarkProps = watermarkProps;

package/lib/ele-watermark/types/index.d.ts

@@ -21,3 +21,16 @@ export interface WatermarkFont {
     /** 字体类型 */
     fontStyle?: 'none' | 'normal' | 'italic' | 'oblique';
 }
+/**
+ * 水印篡改观测参数
+ */
+export interface MutationOption {
+    /** 获取根节点 */
+    getRoot: () => HTMLElement | null;
+    /** 获取水印节点 */
+    getEl: () => HTMLElement | null;
+    /** 水印被删除回调 */
+    onDeleted: () => void;
+    /** 水印样式被篡改回调 */
+    onDalsified: () => void;
+}

package/lib/ele-watermark/util.d.ts

@@ -1,4 +1,4 @@
-import type { WatermarkGap, WatermarkFont } from './types';
+import type { WatermarkGap, WatermarkFont, MutationOption } from './types';
 /**
  * 获取文字样式
  */
@@ -15,3 +15,10 @@ export declare function getPixelRatio(): number;
  * 旋转水印
  */
 export declare function rotateWatermark(ctx: CanvasRenderingContext2D, rotateX: number, rotateY: number, rotate: number): void;
+/**
+ * 水印篡改观测
+ */
+export declare function useMutation(option: MutationOption): {
+    observe: () => void;
+    disconnect: () => void;
+};

package/lib/ele-watermark/util.js

@@ -22,7 +22,37 @@ function rotateWatermark(ctx, rotateX, rotateY, rotate) {
   ctx.rotate(Math.PI / 180 * Number(rotate));
   ctx.translate(-rotateX, -rotateY);
 }
+function useMutation(option) {
+  const { getRoot, getEl, onDeleted, onDalsified } = option;
+  const deletedObserver = new MutationObserver((mutations) => {
+    const el = getEl();
+    mutations.forEach((mutation) => {
+      if (mutation.type === "childList" && Array.from(mutation.removedNodes).some((n) => n === el)) {
+        onDeleted();
+      }
+    });
+  });
+  const falsifiedObserver = new MutationObserver(() => {
+    onDalsified();
+  });
+  const observe = () => {
+    const el = getEl();
+    if (el) {
+      falsifiedObserver.observe(el, { attributes: true });
+    }
+    const root = getRoot();
+    if (root) {
+      deletedObserver.observe(root, { childList: true });
+    }
+  };
+  const disconnect = () => {
+    falsifiedObserver.disconnect();
+    deletedObserver.disconnect();
+  };
+  return { observe, disconnect };
+}
 exports.getFont = getFont;
 exports.getGap = getGap;
 exports.getPixelRatio = getPixelRatio;
 exports.rotateWatermark = rotateWatermark;
+exports.useMutation = useMutation;

package/lib/utils/core.d.ts

@@ -50,7 +50,7 @@ export declare function random(m: number, n: number): number;
  */
 export declare function formatNumber(num?: number | null): string;
 /**
- * 赋值不改变字段原字段
+ * 赋值不改变原字段
  * @param target 目标对象
  * @param source 源对象
  * @param excludes 排除的字段