feat: helper 新增输入防抖，iconfont 修复配置无法修改的问题

mohuishou · Jun 21, 2021 · bb4fb6f · bb4fb6f
1 parent debbbde
commit bb4fb6f
Show file tree

Hide file tree

Showing 8 changed files with 77 additions and 25 deletions.
diff --git a/helper/package-lock.json b/helper/package-lock.json
diff --git a/helper/package.json b/helper/package.json
@@ -1,6 +1,6 @@
 {
   "name": "utools-helper",
-  "version": "2.0.0",
+  "version": "2.1.0",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "files": [
@@ -27,8 +27,12 @@
     "url": "https://github.com/mohuishou/utools.git"
   },
   "devDependencies": {
-    "@types/node": "^15.0.1",
+    "@types/node": "^15.12.4",
+    "@types/throttle-debounce": "^2.1.0",
     "typescript": "^4.2.4",
     "utools-api-types": "^2.0.3"
+  },
+  "dependencies": {
+    "throttle-debounce": "^3.0.1"
   }
 }
diff --git a/helper/src/plugin.ts b/helper/src/plugin.ts
@@ -10,12 +10,18 @@ import {
 import { IListItem } from "./listItem";
 import { ErrorIcon } from "./icon";
 import { Setting } from "./config";
+import { debounce } from "throttle-debounce";
 
 export interface Plugin {
   code: string;
   mode?: TplFeatureMode;
   placeholder?: string;
 
+  /**
+   * 节流延迟，默认 500ms，单位 ms
+   */
+  delay?: number;
+
   /**
    * 是否在 select 结束之后退出插件
    */
@@ -44,6 +50,8 @@ export interface Plugin {
 class Feature implements TplFeature {
   plugin: Plugin;
   mode: TplFeatureMode = "list";
+  delay: number = 500;
+  search: any;
 
   args: TplFeatureArgs = {
     placeholder: "请输入关键词查询",
@@ -65,8 +73,7 @@ class Feature implements TplFeature {
     search: async (action, word, cb) => {
       try {
         if (!this.plugin.search) return;
-        let items = await this.plugin.search(word, action);
-        if (items) return cb(items);
+        await this.search(word, action, cb);
         if (this.plugin.outPlugin) utools.outPlugin();
         if (this.plugin.hideMainWindow) utools.hideMainWindow();
       } catch (error) {
@@ -107,6 +114,15 @@ class Feature implements TplFeature {
     this.plugin = plugin;
     if (plugin.mode) this.mode = plugin.mode;
     if (plugin.placeholder) this.args.placeholder = plugin.placeholder;
+    if (plugin.delay) this.delay = plugin.delay;
+    this.search = debounce(
+      this.delay,
+      false,
+      async (word: string, action: Action, cb: CallbackSetList) => {
+        let items = await this.plugin.search(word, action);
+        if (items) return cb(items);
+      }
+    );
   }
 }
 

diff --git a/plugins/iconfont/package-lock.json b/plugins/iconfont/package-lock.json
diff --git a/plugins/iconfont/package.json b/plugins/iconfont/package.json
@@ -7,6 +7,11 @@
     "@types/mousetrap": "^1.6.3",
     "axios": "^0.21.1",
     "mousetrap": "^1.6.5",
-    "utools-helper": "^1.0.0"
+    "utools-helper": "^2.1.0"
+  },
+  "devDependencies": {
+    "@types/node": "^15.12.4",
+    "@types/throttle-debounce": "^2.1.0",
+    "utools-api-types": "^2.0.3"
   }
 }
diff --git a/plugins/iconfont/src/config.ts b/plugins/iconfont/src/config.ts
@@ -5,7 +5,7 @@ export const config: IConfigItem[] = [
     name: "featured",
     label: "是否精选",
     type: "select",
-    required: true,
+    required: false,
     default: "",
     options: [
       { label: "所有图标", value: "" },
@@ -16,7 +16,7 @@ export const config: IConfigItem[] = [
     name: "color",
     label: "颜色筛选",
     type: "select",
-    required: true,
+    required: false,
     default: "1",
     options: [
       { label: "单色", value: "0" },
@@ -28,7 +28,7 @@ export const config: IConfigItem[] = [
     label: "图标类型",
     type: "select",
     default: "",
-    required: true,
+    required: false,
     options: [
       { label: "全部", value: "" },
       { label: "线性", value: "line" },

diff --git a/plugins/iconfont/src/iconfont.ts b/plugins/iconfont/src/iconfont.ts
@@ -4,7 +4,6 @@ import { stringify } from "querystring";
 import { writeFileSync } from "fs";
 import { join } from "path";
 import { nativeImage } from "electron";
-
 interface keywordParams {
   [index: string]: { key: string; val: any };
 }
@@ -56,7 +55,6 @@ export class Iconfont implements Plugin {
 
   async search(keyword: string): Promise<ListItem[]> {
     let words = keyword.trim().split(/\s+/g);
-    console.log(keyword, words);
 
     const r = await this.request.post("api/icon/search.json", stringify(this.params(words)), {
       headers: {
@@ -65,13 +63,11 @@ export class Iconfont implements Plugin {
     });
 
     let icons = r.data.data.icons.map((icon: any) => {
-      console.log("替换前: " + icon.show_svg);
       if (Setting.Get("fill_color")) {
         icon.show_svg = icon.show_svg.replace(
           /fill="#.*?"/gim,
           `fill="${Setting.Get("fill_color")}"`
         );
-        console.log("替换后: " + icon.show_svg);
       }
 
       return {

diff --git a/plugins/iconfont/tsconfig.json b/plugins/iconfont/tsconfig.json
@@ -6,10 +6,6 @@
     "module": "commonjs",
     "target": "ES2018",
     "experimentalDecorators": true,
-    "types": [
-      "utools-helper/@types/utools",
-      "utools-helper/@types/electron",
-      "@types/node"
-    ]
+    "types": ["utools-api-types", "@types/node"]
   }
 }