From 1fc6a221adc4d7abcffa47153037144965820622 Mon Sep 17 00:00:00 2001
From: fit2cloud-chenyw <yawen.chen@fit2cloud.com>
Date: Tue, 28 Nov 2023 17:07:07 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E5=88=97=E8=A1=A8=E8=BF=87=E6=BB=A4?=
 =?UTF-8?q?=E5=99=A8=E6=A8=A1=E7=B3=8A=E6=90=9C=E7=B4=A2=E7=BC=BA=E5=B0=91?=
 =?UTF-8?q?=E9=80=89=E9=A1=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../widget/deWidget/DeSelectGrid.vue          | 34 +++++++++++++++----
 1 file changed, 27 insertions(+), 7 deletions(-)

diff --git a/core/frontend/src/components/widget/deWidget/DeSelectGrid.vue b/core/frontend/src/components/widget/deWidget/DeSelectGrid.vue
index 5c0e9188e2..9fdd8ae81d 100644
--- a/core/frontend/src/components/widget/deWidget/DeSelectGrid.vue
+++ b/core/frontend/src/components/widget/deWidget/DeSelectGrid.vue
@@ -12,6 +12,8 @@
         :size="size"
         prefix-icon="el-icon-search"
         clearable
+        @input="filterMethod"
+        @clear="filterMethod"
       />
     </div>
     <div class="list">
@@ -31,7 +33,7 @@
           v-model="value"
           @change="handleCheckedChange"
         >
-          <template v-for="item in data.filter(node => !keyWord || (node.id && node.id.toLocaleUpperCase().includes(keyWord.toLocaleUpperCase())))">
+          <template v-for="item in data">
             <el-checkbox
               :key="item.id"
               :label="item.id"
@@ -51,7 +53,7 @@
           @change="changeRadioBox"
         >
           <el-radio
-            v-for="(item, index) in data.filter(node => !keyWord || (node.id && node.id.toLocaleUpperCase().includes(keyWord.toLocaleUpperCase())))"
+            v-for="(item, index) in data"
             :key="index"
             :label="item.id"
             @click.native.prevent="testChange(item)"
@@ -118,7 +120,9 @@ export default {
       show: true,
       data: [],
       isIndeterminate: false,
-      checkAll: false
+      checkAll: false,
+      timeMachine: null,
+      changeIndex: 0
     }
   },
   computed: {
@@ -220,7 +224,7 @@ export default {
       if (!token && linkToken) {
         method = linkMultFieldValues
       }
-      const param = { fieldIds: this.element.options.attrs.fieldId.split(','), sort: this.element.options.attrs.sort }
+      const param = { fieldIds: this.element.options.attrs.fieldId.split(','), sort: this.element.options.attrs.sort, keyword: this.keyWord }
       if (this.panelInfo.proxy) {
         param.userId = this.panelInfo.proxy
       }
@@ -238,8 +242,7 @@ export default {
     cssArr: {
       handler: 'changeInputStyle',
       deep: true
-    },
-    keyWord: 'changeInputStyle'
+    }
   },
   created() {
     if (!this.element.options.attrs.sort) {
@@ -256,6 +259,23 @@ export default {
     bus.$off('reset-default-value', this.resetDefaultValue)
   },
   methods: {
+    searchWithKey(index) {
+      this.timeMachine = setTimeout(() => {
+        if (index === this.changeIndex) {
+          this.initOptions()
+        }
+        this.destroyTimeMachine()
+      }, 1500)
+    },
+    destroyTimeMachine() {
+      this.timeMachine && clearTimeout(this.timeMachine)
+      this.timeMachine = null
+    },
+    filterMethod() {
+      this.destroyTimeMachine()
+      this.changeIndex++
+      this.searchWithKey(this.changeIndex)
+    },
     clearDefault(optionList) {
       const emptyOption = !optionList?.length
 
@@ -334,7 +354,7 @@ export default {
         }
         method({
           fieldIds: this.element.options.attrs.fieldId.split(','),
-          sort: this.element.options.attrs.sort
+          sort: this.element.options.attrs.sort, keyword: this.keyWord
         }).then(res => {
           this.data = this.optionData(res.data)
           this.changeInputStyle()