From e6265eb801db67979a87ac417112544a95e400e8 Mon Sep 17 00:00:00 2001
From: jxxghp <jxxghp@gmail.com>
Date: Sun, 2 Jul 2023 15:39:48 +0800
Subject: [PATCH] =?UTF-8?q?=E6=90=9C=E7=B4=A2=E5=BC=B9=E7=AA=97?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../DefaultLayoutWithVerticalNav.vue          | 32 ++++++++++++++++---
 1 file changed, 28 insertions(+), 4 deletions(-)

diff --git a/src/layouts/components/DefaultLayoutWithVerticalNav.vue b/src/layouts/components/DefaultLayoutWithVerticalNav.vue
index fcbe73c5..1a791bf2 100644
--- a/src/layouts/components/DefaultLayoutWithVerticalNav.vue
+++ b/src/layouts/components/DefaultLayoutWithVerticalNav.vue
@@ -21,6 +21,7 @@ const search = () => {
   if (!searchWord.value) {
     return;
   }
+  searchDialog.value = false;
   router.push({
     path: "/browse/media/search",
     query: {
@@ -43,10 +44,33 @@ const search = () => {
         <!-- 👉 Search -->
         <div class="d-flex align-center cursor-pointer" style="user-select: none">
           <!-- 👉 Search Trigger button -->
-          <IconBtn class="d-lg-none">
-            <VDialog v-model="searchDialog" activator="parent" width="auto"> </VDialog>
-            <VIcon icon="mdi-magnify" />
-          </IconBtn>
+          <VDialog
+            v-model="searchDialog"
+            max-width="600"
+            transition="dialog-top-transition"
+          >
+            <!-- Dialog Activator -->
+            <template #activator="{ props }">
+              <IconBtn class="d-lg-none" v-bind="props">
+                <VIcon icon="mdi-magnify" />
+              </IconBtn>
+            </template>
+            <!-- Dialog Content -->
+            <VCard title="搜索">
+              <VCardText>
+                <VRow>
+                  <VCol cols="12">
+                    <VTextField v-model="searchWord" label="电影、电视剧名称" />
+                  </VCol>
+                </VRow>
+              </VCardText>
+
+              <VCardActions>
+                <VSpacer />
+                <VBtn @click="search" @keydown.enter="search"> 搜索 </VBtn>
+              </VCardActions>
+            </VCard>
+          </VDialog>
         </div>
 
         <span class="w-1/5">