From 3c3fa0c5737b1016eeaa7b1c6424b11391f74319 Mon Sep 17 00:00:00 2001
From: Aresn <admin@aresn.com>
Date: Thu, 30 May 2024 14:32:33 +0800
Subject: [PATCH] =?UTF-8?q?=E6=94=B6=E8=97=8F=E5=A4=B9=E6=94=BE=E5=88=B0?=
 =?UTF-8?q?=E8=8F=A0=E8=90=9D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/i/library/create.vue | 10 +++++-----
 components/i/library/select.vue | 13 ++++++-------
 components/i/library/thread.vue |  4 ++--
 components/i/search/Header.vue  |  9 ++++++++-
 layouts/default.vue             |  2 ++
 pages/library.vue               | 15 +++------------
 stores/library.js               | 30 ++++++++++++++++++++++++++++++
 7 files changed, 56 insertions(+), 27 deletions(-)
 create mode 100644 stores/library.js

diff --git a/components/i/library/create.vue b/components/i/library/create.vue
index 5e10479..c47b093 100644
--- a/components/i/library/create.vue
+++ b/components/i/library/create.vue
@@ -1,5 +1,5 @@
 <template>
-    <UModal v-model="isOpenCreate" :ui="{ width: 'w-96 sm:max-w-screen-md' }">
+    <UModal v-model="$isLibraryCreateOpen" :ui="{ width: 'w-96 sm:max-w-screen-md' }">
         <UCard :ui="{ ring: '', divide: 'divide-y divide-gray-100 dark:divide-gray-800' }">
             <template #header>
                 <div class="flex items-center justify-between">
@@ -49,14 +49,14 @@
     </UModal>
 </template>
 <script setup>
-const isOpenCreate = ref(false)
+const { $isLibraryCreateOpen } = storeToRefs(useLibraryStore())
+const { $openLibraryCreate, $closeLibraryCreate } = useLibraryStore()
 const title = ref('')
 const description = ref('')
 function handleClose () {
-    isOpenCreate.value = false
+    $closeLibraryCreate()
 }
 function handleOpen () {
-    isOpenCreate.value = true
+    $openLibraryCreate
 }
-defineExpose({ handleOpen })
 </script>
diff --git a/components/i/library/select.vue b/components/i/library/select.vue
index e363c18..ce357dc 100644
--- a/components/i/library/select.vue
+++ b/components/i/library/select.vue
@@ -1,5 +1,5 @@
 <template>
-    <UModal v-model="isOpenSelect" :ui="{ width: 'w-96 sm:max-w-screen-md' }">
+    <UModal v-model="$isLibrarySelectOpen" :ui="{ width: 'w-96 sm:max-w-screen-md' }">
         <UCard :ui="{ ring: '', divide: 'divide-y divide-gray-100 dark:divide-gray-800' }">
             <template #header>
                 <div class="flex items-center justify-between">
@@ -37,17 +37,16 @@
     </UModal>
 </template>
 <script setup>
-const Library = inject('Library')
-const isOpenSelect = ref(false)
+const { $isLibrarySelectOpen } = storeToRefs(useLibraryStore())
+const { $openLibrarySelect, $closeLibrarySelect, $openLibraryCreate } = useLibraryStore()
 function handleClose () {
-    isOpenSelect.value = false
+    $closeLibrarySelect()
 }
 function handleOpen (id) {
-    isOpenSelect.value = true
+    $openLibrarySelect()
 }
-defineExpose({ handleOpen })
 function handleOpenCreate () {
     handleClose()
-    Library.handleOpenCreateLibrary()
+    $openLibraryCreate()
 }
 </script>
diff --git a/components/i/library/thread.vue b/components/i/library/thread.vue
index d301976..341a8a9 100644
--- a/components/i/library/thread.vue
+++ b/components/i/library/thread.vue
@@ -56,7 +56,7 @@
     <UDivider />
 </template>
 <script setup>
-const Library = inject('Library')
+const { $openLibrarySelect } = useLibraryStore()
 const textColor = 'text-gray-500 dark:text-gray-400'
 const actionItems = [
     [
@@ -85,6 +85,6 @@ const actionItems = [
     ]
 ]
 function handleOpenSelect (id) {
-    Library.handleOpenSelect(id)
+    $openLibrarySelect(id)
 }
 </script>
\ No newline at end of file
diff --git a/components/i/search/Header.vue b/components/i/search/Header.vue
index 92a2f3f..ab620f5 100644
--- a/components/i/search/Header.vue
+++ b/components/i/search/Header.vue
@@ -13,7 +13,13 @@
                     @blur="handleBlurTitle"
                 />
                 <span>/</span>
-                <UButton color="gray" variant="ghost" leading-icon="i-heroicons-plus-20-solid">收藏</UButton>
+                <UButton
+                    color="gray"
+                    variant="ghost"
+                    leading-icon="i-heroicons-plus-20-solid"
+                    label="收藏"
+                    @click="handleOpenSelect"
+                />
             </div>
             <div class="flex gap-2">
                 <ClientOnly>
@@ -68,6 +74,7 @@
         </div>
         <UDivider />
     </header>
+
 </template>
 <script setup>
 const toast = useToast()
diff --git a/layouts/default.vue b/layouts/default.vue
index 0cff00e..3e9e143 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -29,6 +29,8 @@
             <IAside />
         </USlideover>
     </div>
+    <ILibraryCreate />
+    <ILibrarySelect />
 </template>
 <script setup>
 const isOpenAside = ref(false)
diff --git a/pages/library.vue b/pages/library.vue
index 58bded2..fa9ffab 100644
--- a/pages/library.vue
+++ b/pages/library.vue
@@ -52,21 +52,12 @@
             </div>
         </div>
     </div>
-    <ILibraryCreate ref="refCreate" />
-    <ILibrarySelect ref="refSelect" />
 </template>
 <script setup>
+const { $openLibraryCreate } = useLibraryStore()
 const searchQuery = ref('')
-const refCreate = ref(null)
 function handleOpenCreateLibrary () {
-    refCreate.value.handleOpen()
+    $openLibraryCreate()
 }
-const refSelect = ref(null)
-function handleOpenSelect (id) {
-    refSelect.value.handleOpen(id)
-}
-provide('Library', {
-    handleOpenSelect,
-    handleOpenCreateLibrary
-})
+
 </script>
diff --git a/stores/library.js b/stores/library.js
new file mode 100644
index 0000000..beed002
--- /dev/null
+++ b/stores/library.js
@@ -0,0 +1,30 @@
+import { defineStore } from 'pinia'
+
+export const useLibraryStore = defineStore('library', () => {
+    const $isLibraryCreateOpen = ref(false)
+    const $isLibrarySelectOpen = ref(false)
+    const $selectThreadId = ref('')
+
+    function $openLibraryCreate () {
+        $isLibraryCreateOpen.value = true
+    }
+    function $closeLibraryCreate () {
+        $isLibraryCreateOpen.value = false
+    }
+    function $openLibrarySelect (id) {
+        $isLibrarySelectOpen.value = true
+        if (id) $selectThreadId.value = id
+    }
+    function $closeLibrarySelect () {
+        $isLibrarySelectOpen.value = false
+    }
+
+    return {
+        $isLibraryCreateOpen,
+        $isLibrarySelectOpen,
+        $openLibraryCreate,
+        $closeLibraryCreate,
+        $openLibrarySelect,
+        $closeLibrarySelect
+    }
+})
-- 
GitLab