From 2a14e5a8d0ba675e99fbfc6af7b0fbec75d86c76 Mon Sep 17 00:00:00 2001
From: zhuangchong <zhuang.kerwin@gmail.com>
Date: Thu, 4 Jan 2024 17:01:06 +0800
Subject: [PATCH] cherry-pick optimize add select filter (#15378) #15379

---
 .../definition/components/start-modal.tsx     | 27 +++++++++++--------
 .../definition/components/timing-modal.tsx    | 27 +++++++++++--------
 .../components/worker-group-modal.tsx         |  1 +
 3 files changed, 33 insertions(+), 22 deletions(-)

diff --git a/dolphinscheduler-ui/src/views/projects/workflow/definition/components/start-modal.tsx b/dolphinscheduler-ui/src/views/projects/workflow/definition/components/start-modal.tsx
index de66b31f0bf1b..3247f1bb13792 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/definition/components/start-modal.tsx
+++ b/dolphinscheduler-ui/src/views/projects/workflow/definition/components/start-modal.tsx
@@ -309,6 +309,7 @@ export default defineComponent({
               options={this.workerGroups}
               onUpdateValue={this.updateWorkerGroup}
               v-model:value={this.startForm.workerGroup}
+              filterable
             />
           </NFormItem>
           <NFormItem
@@ -321,19 +322,23 @@ export default defineComponent({
               )}
               v-model:value={this.startForm.environmentCode}
               clearable
+              filterable
             />
           </NFormItem>
-          <NFormItem
-            label={t('project.workflow.alarm_group')}
-            path='warningGroupId'
-          >
-            <NSelect
-              options={this.alertGroups}
-              placeholder={t('project.workflow.please_choose')}
-              v-model:value={this.startForm.warningGroupId}
-              clearable
-            />
-          </NFormItem>
+          {this.startForm.warningType !== 'NONE' && (
+            <NFormItem
+              label={t('project.workflow.alarm_group')}
+              path='warningGroupId'
+            >
+              <NSelect
+                options={this.alertGroups}
+                placeholder={t('project.workflow.please_choose')}
+                v-model:value={this.startForm.warningGroupId}
+                clearable
+                filterable
+              />
+            </NFormItem>
+          )}
           <NFormItem
             label={t('project.workflow.complement_data')}
             path='complement_data'
diff --git a/dolphinscheduler-ui/src/views/projects/workflow/definition/components/timing-modal.tsx b/dolphinscheduler-ui/src/views/projects/workflow/definition/components/timing-modal.tsx
index 1e1a933fe5cca..eadc959591a02 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/definition/components/timing-modal.tsx
+++ b/dolphinscheduler-ui/src/views/projects/workflow/definition/components/timing-modal.tsx
@@ -366,6 +366,7 @@ export default defineComponent({
               options={this.workerGroups}
               onUpdateValue={this.updateWorkerGroup}
               v-model:value={this.timingForm.workerGroup}
+              filterable
             />
           </NFormItem>
           <NFormItem
@@ -376,19 +377,23 @@ export default defineComponent({
               options={this.environmentOptions}
               v-model:value={this.timingForm.environmentCode}
               clearable
+              filterable
             />
           </NFormItem>
-          <NFormItem
-            label={t('project.workflow.alarm_group')}
-            path='warningGroupId'
-          >
-            <NSelect
-              options={this.alertGroups}
-              placeholder={t('project.workflow.please_choose')}
-              v-model:value={this.timingForm.warningGroupId}
-              clearable
-            />
-          </NFormItem>
+          {this.timingForm.warningType !== 'NONE' && (
+            <NFormItem
+              label={t('project.workflow.alarm_group')}
+              path='warningGroupId'
+            >
+              <NSelect
+                options={this.alertGroups}
+                placeholder={t('project.workflow.please_choose')}
+                v-model:value={this.timingForm.warningGroupId}
+                clearable
+                filterable
+              />
+            </NFormItem>
+          )}
         </NForm>
       </Modal>
     )
diff --git a/dolphinscheduler-ui/src/views/security/worker-group-manage/components/worker-group-modal.tsx b/dolphinscheduler-ui/src/views/security/worker-group-manage/components/worker-group-modal.tsx
index 156810e21df1a..b51e841c8d39c 100644
--- a/dolphinscheduler-ui/src/views/security/worker-group-manage/components/worker-group-modal.tsx
+++ b/dolphinscheduler-ui/src/views/security/worker-group-manage/components/worker-group-modal.tsx
@@ -137,6 +137,7 @@ const WorkerGroupModal = defineComponent({
                   <NSelect
                     class='select-worker-address'
                     multiple
+                    filterable
                     placeholder={t(
                       'security.worker_group.worker_addresses_tips'
                     )}