From 96588ed2968b2e05d88911cfed6d274a4787c56e Mon Sep 17 00:00:00 2001
From: wangyupei <2311595895@qq.com>
Date: Thu, 14 Apr 2022 16:30:20 +0800
Subject: [PATCH] =?UTF-8?q?fix(AutoComplete):=20=E4=BF=AE=E5=A4=8DAutoComp?=
 =?UTF-8?q?lete=E6=B2=A1=E6=9C=89=E8=8E=B7=E5=8F=96=E7=84=A6=E7=82=B9?=
 =?UTF-8?q?=E6=97=B6=E8=BE=93=E5=85=A5=E6=A1=86=E9=AB=98=E4=BA=AE=E7=9A=84?=
 =?UTF-8?q?bug?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../devui-vue/devui/auto-complete/src/auto-complete.tsx  | 5 +++--
 .../auto-complete/src/composables/use-input-handle.ts    | 9 +++++++++
 2 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/packages/devui-vue/devui/auto-complete/src/auto-complete.tsx b/packages/devui-vue/devui/auto-complete/src/auto-complete.tsx
index b0c5fa13ec..9a4cb85727 100644
--- a/packages/devui-vue/devui/auto-complete/src/auto-complete.tsx
+++ b/packages/devui-vue/devui/auto-complete/src/auto-complete.tsx
@@ -42,7 +42,7 @@ export default defineComponent({
       searchFn,
       formatter
     );
-    const { onInput, onFocus, inputRef, visible, searchStatus, handleClose, toggleMenu } = useInputHandle(
+    const { onInput, onFocus, onBlur, inputRef, isFocus, visible, searchStatus, handleClose, toggleMenu } = useInputHandle(
       ctx,
       searchList,
       showNoResultItemTemplate,
@@ -137,10 +137,11 @@ export default defineComponent({
             disabled={disabled.value}
             type="text"
             onClick={toggleMenu}
-            class={['devui-form-control', 'devui-dropdown-origin', 'devui-dropdown-origin-open', disabled.value && 'disabled']}
+            class={['devui-form-control', 'devui-dropdown-origin', isFocus.value && 'devui-dropdown-origin-open', disabled.value && 'disabled']}
             placeholder="Search"
             onInput={onInput}
             onFocus={onFocus}
+            onBlur={onBlur}
             value={modelValue.value}
             ref={inputRef}
             onKeydown={handlekeyDown}
diff --git a/packages/devui-vue/devui/auto-complete/src/composables/use-input-handle.ts b/packages/devui-vue/devui/auto-complete/src/composables/use-input-handle.ts
index 4f08eb733e..e6e21f8f22 100644
--- a/packages/devui-vue/devui/auto-complete/src/composables/use-input-handle.ts
+++ b/packages/devui-vue/devui/auto-complete/src/composables/use-input-handle.ts
@@ -16,13 +16,16 @@ export default function useInputHandle(
     toggleMenu: () => void;
     onInput: (e: Event) => void;
     onFocus: () => void;
+    onBlur: () => void;
     inputRef: Ref;
+    isFocus: Ref<boolean>;
     visible: Ref<boolean>;
     searchStatus: Ref<boolean>;
   } {
   const visible = ref(false);
   const inputRef = ref();
   const searchStatus = ref(false);
+  const isFocus = ref(false);
   const debounce =(cb: InputDebounceCb,time: number) =>{
     let timer: NodeJS.Timeout | null;
     return (arg: string)=>{
@@ -49,10 +52,14 @@ export default function useInputHandle(
     onInputDebounce(inp.value);
   };
   const onFocus =() => {
+    isFocus.value = true;
     handleSearch(modelValue.value);
     recentlyFocus(latestSource?.value);
     transInputFocusEmit.value && transInputFocusEmit.value();
   };
+  const onBlur = ()=> {
+    isFocus.value = false;
+  };
   const handleClose = ()=>{
     visible.value=false;
     searchStatus.value=false;
@@ -75,6 +82,8 @@ export default function useInputHandle(
     toggleMenu,
     onInput,
     onFocus,
+    onBlur,
+    isFocus,
     inputRef,
     visible,
     searchStatus