From 1e8ef91a72c1ce1cabea2e9f741b1f0dd7360ff0 Mon Sep 17 00:00:00 2001
From: KUN1007 <yuyuyukunkunkun@gmail.com>
Date: Sat, 18 Nov 2023 00:37:57 +0800
Subject: [PATCH] pref: null search hint

---
 src/components/search/KUNGalgameSearchBox.vue | 12 ++++++++++++
 src/components/search/SearchHistory.vue       | 13 ++++++++++++-
 src/language/en.ts                            |  2 ++
 src/language/zh.ts                            |  2 ++
 4 files changed, 28 insertions(+), 1 deletion(-)

diff --git a/src/components/search/KUNGalgameSearchBox.vue b/src/components/search/KUNGalgameSearchBox.vue
index b54d5b51..f51431c3 100644
--- a/src/components/search/KUNGalgameSearchBox.vue
+++ b/src/components/search/KUNGalgameSearchBox.vue
@@ -83,6 +83,10 @@ onBeforeUnmount(() => {
           <SearchHistory v-if="!search.keywords" />
 
           <SearchResult :topics="topics" v-if="topics.length" />
+
+          <span class="empty" v-if="!topics.length && search.keywords">
+            {{ $tm('mainPage.header.emptyResult') }}
+          </span>
         </div>
       </div>
     </Transition>
@@ -123,6 +127,14 @@ onBeforeUnmount(() => {
   overflow-y: scroll;
 }
 
+.empty {
+  display: flex;
+  justify-content: center;
+  color: var(--kungalgame-blue-2);
+  font-style: oblique;
+  margin-top: 20px;
+}
+
 .search-enter-from {
   opacity: 0;
 }
diff --git a/src/components/search/SearchHistory.vue b/src/components/search/SearchHistory.vue
index f793f9d1..00b7c0d2 100644
--- a/src/components/search/SearchHistory.vue
+++ b/src/components/search/SearchHistory.vue
@@ -30,7 +30,7 @@ const handleDeleteHistory = (historyIndex: number) => {
       </span>
     </div>
 
-    <div class="history-container">
+    <div class="history-container" v-if="searchHistory.length">
       <div
         class="single-history"
         v-for="(history, index) in searchHistory"
@@ -47,6 +47,10 @@ const handleDeleteHistory = (historyIndex: number) => {
         </span>
       </div>
     </div>
+
+    <span class="empty" v-if="!searchHistory.length">
+      {{ $tm('mainPage.header.emptyHistory') }}
+    </span>
   </div>
 </template>
 
@@ -122,4 +126,11 @@ const handleDeleteHistory = (historyIndex: number) => {
   color: var(--kungalgame-font-color-0);
   display: none;
 }
+
+.empty {
+  display: flex;
+  justify-content: center;
+  color: var(--kungalgame-blue-2);
+  font-style: oblique;
+}
 </style>
diff --git a/src/language/en.ts b/src/language/en.ts
index f3d19ae6..6bce2fac 100644
--- a/src/language/en.ts
+++ b/src/language/en.ts
@@ -64,6 +64,8 @@ export default {
       search: 'Input to Auto Search',
       history: 'Search History',
       clear: 'Clear all history',
+      emptyHistory: `This loli hasn't searched for anything`,
+      emptyResult: 'No results found...',
     },
     asideActive: {
       fold: 'Fold Aside',
diff --git a/src/language/zh.ts b/src/language/zh.ts
index 5bf6d985..d12c6af3 100644
--- a/src/language/zh.ts
+++ b/src/language/zh.ts
@@ -64,6 +64,8 @@ export default {
       search: '输入内容以自动搜索',
       history: '搜索历史',
       clear: '清除所有历史',
+      emptyHistory: '这只萝莉什么也没搜索过',
+      emptyResult: '什么也没有搜索到。。。',
     },
     asideActive: {
       fold: '折叠左侧区域',