From 965baf70495b99f68af6de3ee1c34c73544b7d9d Mon Sep 17 00:00:00 2001
From: ocean-gao <gaopandyx@163.com>
Date: Tue, 10 May 2022 16:10:40 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=B0=B4=E5=8D=B0=E5=85=B3=E9=97=AD?=
 =?UTF-8?q?=E9=80=BB=E8=BE=91=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 docs/reference/plugin/plugins/watermark.md    | 13 ++----
 .../fes-plugin-watermark/src/runtime/core.js  | 42 +++++++------------
 2 files changed, 18 insertions(+), 37 deletions(-)

diff --git a/docs/reference/plugin/plugins/watermark.md b/docs/reference/plugin/plugins/watermark.md
index 53c777b0..0d22f565 100644
--- a/docs/reference/plugin/plugins/watermark.md
+++ b/docs/reference/plugin/plugins/watermark.md
@@ -43,19 +43,12 @@ export default {
 ### createWatermark
 
 创建水印功能，通过 `@fesjs/fes` 导入 API：
-```js
-import { createWatermark } from '@fesjs/fes'
-
-createWatermark({ content: '我是水印' });
-```
-
-若需要动态关闭和重新打开水印，则：
 
 ```js
-const { close, open } = createWatermark({ content: '我是水印' });
+import { createWatermark, destroyWatermark } from '@fesjs/fes';
 
-close(); // 关闭水印
-open(); // 重新打开水印
+createWatermark({ content: '我是水印' }); // 生成水印
+destroyWatermark(); // 销毁水印
 ```
 
 默认参数是：
diff --git a/packages/fes-plugin-watermark/src/runtime/core.js b/packages/fes-plugin-watermark/src/runtime/core.js
index f76c51e9..5b2c6ee4 100644
--- a/packages/fes-plugin-watermark/src/runtime/core.js
+++ b/packages/fes-plugin-watermark/src/runtime/core.js
@@ -30,14 +30,11 @@ function timeFormat(date, format = 'YYYY-MM-DD') {
     return format.replace(/Y+|M+|D+|H+|h+|m+|s+|S+|Q/g, str => String(map[str]));
 }
 
-let _wmEnable = true; // 开关控制
+let param = null; // 配置项
 let _wmMo = null; // MutationObserver
 let _wmTimer = null; // timestamp
 
-function _close(param) {
-    // 开关关闭
-    _wmEnable = false;
-
+function _destroyWatermark() {
     // 监听器关闭
     _wmMo && _wmMo.disconnect();
     _wmMo = null;
@@ -46,18 +43,8 @@ function _close(param) {
 
     // 删除水印元素
     const __wm = document.querySelector('.__wm');
-    __wm && param.container.removeChild(__wm);
-}
-function _open(param) {
-    // 避免重复触发
-    _close(param);
-
-    // 开关打开
-    _wmEnable = true;
-
-    // 生成水印
-    // eslint-disable-next-line no-use-before-define
-    createWatermark(param);
+    __wm && param && param.container.removeChild(__wm);
+    param = null;
 }
 
 // canvas 实现 watermark
@@ -79,10 +66,11 @@ export function createWatermark({
     if (WATERMARK_DISABLED) {
         return;
     }
-    if (!_wmEnable) {
-        return;
-    }
-    const param = {
+
+    // 为避免多次调用 createWatermark 触发重复监听，这里先执行销毁水印操作
+    _destroyWatermark();
+
+    param = {
         container,
         width,
         height,
@@ -169,13 +157,13 @@ export function createWatermark({
         }
 
         _wmTimer = window.setTimeout(() => {
-            // 触发MutationObserver
+            // 触发 MutationObserver
             watermarkDiv.style.bottom = '0';
         }, timeout);
     }
-
-    return {
-        close: () => _close(param),
-        open: () => _open(param)
-    };
+}
+
+// 销毁水印
+export function destroyWatermark() {
+    _destroyWatermark();
 }