From d85049660135c360b3c56e43af605bb1a8c996bd Mon Sep 17 00:00:00 2001
From: xiaoxian521 <1923740402@qq.com>
Date: Mon, 12 Jun 2023 13:53:54 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0`=E9=98=B2=E6=8A=96`?=
 =?UTF-8?q?=E5=92=8C`=E8=8A=82=E6=B5=81`=E6=8C=87=E4=BB=A4=E5=B9=B6?=
 =?UTF-8?q?=E8=A7=84=E8=8C=83=E8=87=AA=E5=AE=9A=E4=B9=89=E6=8C=87=E4=BB=A4?=
 =?UTF-8?q?=E7=94=A8=E6=B3=95=E9=94=99=E8=AF=AF=E6=97=B6=E7=9A=84=E6=8F=90?=
 =?UTF-8?q?=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/directives/auth/index.ts     |  4 ++-
 src/directives/index.ts          |  1 +
 src/directives/optimize/index.ts | 55 ++++++++++++++++++++++++++++++++
 3 files changed, 59 insertions(+), 1 deletion(-)
 create mode 100644 src/directives/optimize/index.ts

diff --git a/src/directives/auth/index.ts b/src/directives/auth/index.ts
index 627ea896e..62ca87c2e 100644
--- a/src/directives/auth/index.ts
+++ b/src/directives/auth/index.ts
@@ -7,7 +7,9 @@ export const auth: Directive = {
     if (value) {
       !hasAuth(value) && el.parentNode?.removeChild(el);
     } else {
-      throw new Error("need auths! Like v-auth=\"['btn.add','btn.edit']\"");
+      throw new Error(
+        "[Directive: auth]: need auths! Like v-auth=\"['btn.add','btn.edit']\""
+      );
     }
   }
 };
diff --git a/src/directives/index.ts b/src/directives/index.ts
index 97ccf7649..f744f313d 100644
--- a/src/directives/index.ts
+++ b/src/directives/index.ts
@@ -1 +1,2 @@
 export * from "./auth";
+export * from "./optimize";
diff --git a/src/directives/optimize/index.ts b/src/directives/optimize/index.ts
new file mode 100644
index 000000000..d56f23b7c
--- /dev/null
+++ b/src/directives/optimize/index.ts
@@ -0,0 +1,55 @@
+import {
+  isFunction,
+  isObject,
+  isArray,
+  debounce,
+  throttle
+} from "@pureadmin/utils";
+import { useEventListener } from "@vueuse/core";
+import { Directive, type DirectiveBinding } from "vue";
+
+/** 防抖（v-optimize或v-optimize:debounce）、节流（v-optimize:throttle）指令 */
+export const optimize: Directive = {
+  mounted(el: HTMLElement, binding: DirectiveBinding) {
+    const { value } = binding;
+    const optimizeType = binding.arg ?? "debounce";
+    const type = ["debounce", "throttle"].find(t => t === optimizeType);
+    if (type) {
+      if (value && value.event && isFunction(value.fn)) {
+        let params = value?.params;
+        if (params) {
+          if (isArray(params) || isObject(params)) {
+            params = isObject(params) ? Array.of(params) : params;
+          } else {
+            throw new Error(
+              "[Directive: optimize]: `params` must be an array or object"
+            );
+          }
+        }
+        // Register using addEventListener on mounted, and removeEventListener automatically on unmounted
+        useEventListener(
+          el,
+          value.event,
+          type === "debounce"
+            ? debounce(
+                params ? () => value.fn(...params) : value.fn,
+                value?.timeout ?? 200,
+                value?.immediate ?? false
+              )
+            : throttle(
+                params ? () => value.fn(...params) : value.fn,
+                value?.timeout ?? 200
+              )
+        );
+      } else {
+        throw new Error(
+          "[Directive: optimize]: `event` and `fn` are required, and `fn` must be a function"
+        );
+      }
+    } else {
+      throw new Error(
+        "[Directive: optimize]: only `debounce` and `throttle` are supported"
+      );
+    }
+  }
+};