From 6803334b339c6cc174a2738a9eeb9e5d05e949ad Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Thu, 9 May 2019 11:38:33 +0800
Subject: [PATCH] =?UTF-8?q?:bug:=20=E6=90=9C=E7=B4=A2=E9=9D=A2=E6=9D=BF?=
 =?UTF-8?q?=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Former-commit-id: 954c685d9c6a7928a9f6b8c8f36879d6e8210e5a
---
 src/assets/style/animate/vue-transition.scss         |  4 ++--
 .../header-aside/components/panel-search/index.vue   |  6 +++++-
 src/layout/header-aside/layout.vue                   |  4 ++--
 src/layout/header-aside/mixins/search.js             | 12 ++++++++++--
 4 files changed, 19 insertions(+), 7 deletions(-)

diff --git a/src/assets/style/animate/vue-transition.scss b/src/assets/style/animate/vue-transition.scss
index a396d0b..8921a1e 100644
--- a/src/assets/style/animate/vue-transition.scss
+++ b/src/assets/style/animate/vue-transition.scss
@@ -15,7 +15,7 @@
 // 过渡动画 缩放渐变
 .fade-scale-leave-active,
 .fade-scale-enter-active {
-  transition: all .5s;
+  transition: all .3s;
 }
 .fade-scale-enter {
   opacity: 0;
@@ -24,4 +24,4 @@
 .fade-scale-leave-to {
   opacity: 0;
   transform: scale(0.8);
-}
\ No newline at end of file
+}
diff --git a/src/layout/header-aside/components/panel-search/index.vue b/src/layout/header-aside/components/panel-search/index.vue
index 8546b5a..335d692 100644
--- a/src/layout/header-aside/components/panel-search/index.vue
+++ b/src/layout/header-aside/components/panel-search/index.vue
@@ -122,7 +122,9 @@ export default {
     focus () {
       this.input = ''
       setTimeout(() => {
-        this.$refs.input.focus()
+        if (this.$refs.input) {
+          this.$refs.input.focus()
+        }
         // 还原
         this.searchText = ''
         this.results = []
@@ -185,6 +187,7 @@ export default {
 <style lang="scss" scoped>
 .panel-search {
   margin: 20px;
+  width: 100%;
   .panel-search__input-group {
     height: 240px;
     .panel-search__logo {
@@ -212,6 +215,7 @@ export default {
   }
   .panel-search__results-group {
     overflow: auto;
+    margin-bottom: -20px;
     .panel-search__results-group-inner {
       margin: -20px;
     }
diff --git a/src/layout/header-aside/layout.vue b/src/layout/header-aside/layout.vue
index c18e10d..7cfb107 100644
--- a/src/layout/header-aside/layout.vue
+++ b/src/layout/header-aside/layout.vue
@@ -51,7 +51,7 @@
         <div class="d2-theme-container-main" flex-box="1" flex>
           <!-- 搜索 -->
           <transition name="fade-scale">
-            <div v-show="searchActive" class="d2-theme-container-main-layer" flex="dir:top">
+            <div v-if="searchActive" class="d2-theme-container-main-layer" flex>
               <d2-panel-search
                 ref="panelSearch"
                 @close="searchPanelClose"/>
@@ -59,7 +59,7 @@
           </transition>
           <!-- 内容 -->
           <transition name="fade-scale">
-            <div v-show="!searchActive" class="d2-theme-container-main-layer" flex="dir:top">
+            <div v-if="!searchActive" class="d2-theme-container-main-layer" flex="dir:top">
               <!-- tab -->
               <div class="d2-theme-container-main-header" flex-box="0">
                 <d2-tabs/>
diff --git a/src/layout/header-aside/mixins/search.js b/src/layout/header-aside/mixins/search.js
index 807e6c8..1f89353 100644
--- a/src/layout/header-aside/mixins/search.js
+++ b/src/layout/header-aside/mixins/search.js
@@ -39,13 +39,21 @@ export default {
     handleSearchClick () {
       this.searchToggle()
       if (this.searchActive) {
-        this.$refs.panelSearch.focus()
+        setTimeout(() => {
+          if (this.$refs.panelSearch) {
+            this.$refs.panelSearch.focus()
+          }
+        }, 500)
       }
     },
     searchPanelOpen () {
       if (!this.searchActive) {
         this.searchSet(true)
-        this.$refs.panelSearch.focus()
+        setTimeout(() => {
+          if (this.$refs.panelSearch) {
+            this.$refs.panelSearch.focus()
+          }
+        }, 500)
       }
     },
     // 关闭搜索面板