From 10ede276711dcaf53891d8ac20be55b06c587378 Mon Sep 17 00:00:00 2001
From: tangly1024 <tlyong1992@hotmail.com>
Date: Thu, 3 Mar 2022 12:34:00 +0800
Subject: [PATCH] =?UTF-8?q?Hexo=20=E4=B8=BB=E9=A2=98=E6=90=9C=E7=B4=A2?=
 =?UTF-8?q?=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/search/[keyword].js           |  5 +++++
 pages/search/index.js               |  3 +++
 themes/Hexo/LayoutSearch.js         | 21 +++++++++++++++++++--
 themes/Hexo/components/SideRight.js |  2 +-
 4 files changed, 28 insertions(+), 3 deletions(-)

diff --git a/pages/search/[keyword].js b/pages/search/[keyword].js
index 3f6517bc..4bc6166e 100644
--- a/pages/search/[keyword].js
+++ b/pages/search/[keyword].js
@@ -4,6 +4,11 @@ import BLOG from '@/blog.config'
 import { useGlobal } from '@/lib/global'
 import { getDataFromCache } from '@/lib/cache/cache_manager'
 
+/**
+ * 服务端搜索
+ * @param {*} param0
+ * @returns
+ */
 export async function getServerSideProps ({ params: { keyword } }) {
   const {
     allPosts,
diff --git a/pages/search/index.js b/pages/search/index.js
index ef7cae89..fb1ffc89 100644
--- a/pages/search/index.js
+++ b/pages/search/index.js
@@ -4,6 +4,9 @@ import BLOG from '@/blog.config'
 import { useGlobal } from '@/lib/global'
 import { useRouter } from 'next/router'
 
+/**
+ * 浏览器前端搜索
+ */
 export async function getStaticProps () {
   const {
     allPosts,
diff --git a/themes/Hexo/LayoutSearch.js b/themes/Hexo/LayoutSearch.js
index 3b26ad57..c9ffc4b3 100644
--- a/themes/Hexo/LayoutSearch.js
+++ b/themes/Hexo/LayoutSearch.js
@@ -1,9 +1,26 @@
 
+import { useRouter } from 'next/router'
+import { useEffect } from 'react'
 import BlogPostListPage from './components/BlogPostListPage'
 import LayoutBase from './LayoutBase'
 
 export const LayoutSearch = (props) => {
-  return <LayoutBase {...props}>
-    <BlogPostListPage {...props}/>
+  const { keyword } = props
+  const router = useRouter()
+  const currentSearch = keyword || router?.query?.s
+  useEffect(() => {
+    setTimeout(() => {
+      const container = document.getElementById('container')
+      if (container && container.innerHTML) {
+        const re = new RegExp(`${currentSearch}`, 'gim')
+        container.innerHTML = container.innerHTML.replace(re, `<span class='text-red-500 border-b border-dashed'>${currentSearch}</span>`)
+      }
+    },
+    100)
+  })
+  return <LayoutBase {...props} currentSearch={currentSearch}>
+    <div ic='container'>
+      <BlogPostListPage {...props}/>
+    </div>
   </LayoutBase>
 }
diff --git a/themes/Hexo/components/SideRight.js b/themes/Hexo/components/SideRight.js
index 423481f6..3aafeb80 100644
--- a/themes/Hexo/components/SideRight.js
+++ b/themes/Hexo/components/SideRight.js
@@ -45,7 +45,7 @@ export default function SideRight (props) {
       </Card>
       <Card>
         <MenuButtonGroup {...props}/>
-        <SearchInput />
+        <SearchInput {...props}/>
       </Card>
       <Card>
         <div className='ml-2 mb-3 font-sans'>