From 43b3d1d379124037d33b18807634c557f6261b30 Mon Sep 17 00:00:00 2001
From: kuaifan <aipaw@live.cn>
Date: Tue, 4 Mar 2025 14:25:24 +0800
Subject: [PATCH] no message

---
 resources/assets/js/components/SearchBox.vue  | 16 ++++++-----
 .../assets/sass/components/search-box.scss    | 27 ++++++++++++-------
 2 files changed, 26 insertions(+), 17 deletions(-)

diff --git a/resources/assets/js/components/SearchBox.vue b/resources/assets/js/components/SearchBox.vue
index a4ebfa719..6bcf4cdee 100755
--- a/resources/assets/js/components/SearchBox.vue
+++ b/resources/assets/js/components/SearchBox.vue
@@ -34,10 +34,10 @@
                     <i v-if="tag.type === action" class="taskfont tag-close">&#xe747;</i>
                 </div>
             </div>
-            <template v-if="listLength === 0">
-                <div v-if="loadIng > 0 || !searchKey.trim()" class="search-empty">
+            <template v-if="total === 0">
+                <div v-if="(loadIng + loadPre) > 0 || !searchKey.trim()" class="search-empty">
                     <i class="taskfont">&#xe60b;</i>
-                    <span>{{ $L(loadIng > 0 ? '正在拼命搜索...' : '请输入关键字搜索') }}</span>
+                    <span>{{ $L((loadIng + loadPre) > 0 ? '正在拼命搜索...' : '请输入关键字搜索') }}</span>
                 </div>
                 <div v-else class="search-empty">
                     <i class="taskfont">&#xe60b;</i>
@@ -96,7 +96,9 @@ export default {
 
     data() {
         return {
+            loadPre: 0,
             loadIng: 0,
+
             searchKey: '',
             searchResults: [],
             searchTimer: null,
@@ -156,7 +158,7 @@ export default {
             return groups
         },
 
-        listLength({searchKey, searchResults, action}) {
+        total({searchKey, searchResults, action}) {
             const items = searchResults.filter(item => item.key === searchKey && (!action || item.type === action))
             return items.length
         },
@@ -275,15 +277,15 @@ export default {
             if (this.searchTimer) {
                 clearTimeout(this.searchTimer)
                 this.searchTimer = null;
-                this.loadIng--;
+                this.loadPre--;
             }
-            this.loadIng++;
+            this.loadPre++;
             this.searchTimer = setTimeout(() => {
                 if (this.searchKey.trim()) {
                     this.onSearch()
                 }
                 this.searchTimer = null;
-                this.loadIng--;
+                this.loadPre--;
             }, 500)
         },
 
diff --git a/resources/assets/sass/components/search-box.scss b/resources/assets/sass/components/search-box.scss
index 32de14184..7994ba668 100755
--- a/resources/assets/sass/components/search-box.scss
+++ b/resources/assets/sass/components/search-box.scss
@@ -105,34 +105,41 @@
                     .search-tags {
                         flex-shrink: 0;
                         display: flex;
-                        gap: 12px;
+                        gap: 16px;
                         overflow-x: auto;
                         overflow-y: hidden;
                         scroll-behavior: smooth;
                         -webkit-overflow-scrolling: touch;
-                        padding: 16px 20px 0;
+                        padding: 14px 20px 0;
 
                         &::-webkit-scrollbar {
                             display: none;
                         }
 
+                        @media (max-width: 768px) {
+                            gap: 12px;
+                        }
+
+                        @media (max-width: 576px) {
+                            gap: 8px;
+                        }
+
                         .tag-item {
                             flex-shrink: 0;
                             border: 1px solid #e4e4e4;
-                            border-radius: 8px;
+                            border-radius: 18px;
                             padding: 4px 12px;
                             line-height: 24px;
                             display: flex;
                             align-items: center;
                             justify-content: center;
-                            gap: 8px;
+                            gap: 6px;
                             cursor: pointer;
                             transition: all 0.2s ease;
 
                             .tag-close {
-                                font-size: 13px;
-                                margin-left: -3px;
-                                margin-right: -5px;
+                                margin-left: -1px;
+                                margin-right: -3px;
                             }
 
                             &.action {
@@ -149,7 +156,7 @@
                         align-items: center;
                         justify-content: center;
                         flex-direction: column;
-                        padding: 16px 24px 48px;
+                        padding: 14px 24px 48px;
 
                         > i {
                             font-size: 44px;
@@ -173,11 +180,11 @@
 
                     .search-list {
                         overflow: auto;
-                        max-height: calc(100vh - 306px);
+                        max-height: calc(100vh - 305px);
                         overscroll-behavior: contain;
 
                         @media (max-height: 900px) {
-                            max-height: calc(100vh - 176px);
+                            max-height: calc(100vh - 175px);
                         }
 
                         > ul {