Merge branch 'main' of gitcode.com:git_bot/ai-fe

archive/SearchHistory.vue

+<template>
+    <div class="flex flex-col overflow-hidden">
+        <div class="flex justify-between">
+            <UButton
+                class="flex-grow"
+                leading-icon="i-heroicons-magnifying-glass"
+                color="gray"
+                variant="ghost"
+                size="md"
+                label="搜索记录"
+                @click="handleOpen"
+            />
+            <UButton
+                v-if="$isSignIn"
+                label="清空"
+                size="md"
+                variant="link"
+                @click="handleClear"
+            />
+        </div>
+        <div v-if="$isSignIn" class="flex overflow-y-auto flex-col gap-1 border-l border-gray-200 dark:border-gray-800 pl-2 ml-5">
+            <template v-for="(item, index) in $searchHistory" :key="index">
+                <UButton
+                    class="flex group text-gray-400"
+                    color="gray"
+                    variant="ghost"
+                    size="xs"
+                    long
+                    :to="`/search/${item.c_id}`"
+                    @click="handleClickItem"
+                >
+                    <div class="flex-grow truncate">{{ item.title }}</div>
+                    <UButton
+                        class="hidden group-hover:flex"
+                        color="red"
+                        variant="ghost"
+                        size="xs"
+                        :padded="false"
+                        leading-icon="i-heroicons-x-mark-20-solid"
+                        @click.stop.prevent="handleRemoveRecordItem(item.c_id)"
+                    />
+                </UButton>
+            </template>
+        </div>
+    </div>
+    <UModal v-model="isOpenHistory" :ui="{ width: 'w-full sm:max-w-screen-md' }">
+        <div class="flex items-center p-2">
+            <UInput
+                class="w-full"
+                v-model="query"
+                :padded="false"
+                variant="none"
+                leading-icon="i-heroicons-magnifying-glass-20-solid"
+                placeholder="输入关键字搜索..."
+            />
+            <UButton
+                leading-icon="i-heroicons-x-mark-20-solid"
+                color="gray"
+                variant="ghost"
+                @click="handleClose"
+            />
+        </div>
+        <UDivider />
+        <div class="flex flex-col p-2">
+            <template v-for="(item, index) in $searchHistory" :key="index">
+                <UButton
+                    class="flex group"
+                    color="gray"
+                    variant="ghost"
+                    long
+                    leading-icon="i-heroicons-document-text"
+                    :to="`/search/${item.c_id}`"
+                    @click="handleClose"
+                >
+                    <div class="flex-grow truncate font-light">{{ item.title }}</div>
+                    <UButton
+                        class="hidden group-hover:flex"
+                        color="red"
+                        variant="ghost"
+                        :padded="false"
+                        leading-icon="i-heroicons-x-mark-20-solid"
+                        @click.stop.prevent="handleRemoveRecordItem(item.c_id)"
+                    />
+                </UButton>
+            </template>
+        </div>
+    </UModal>
+</template>
+<script setup>
+import { IConfirm } from '#components'
+const emits = defineEmits(['sign', 'clear'])
+const Layout = inject('Layout')
+const modal = useModal()
+const { $isSignIn } = storeToRefs(useUserStore())
+const { $searchHistory } = storeToRefs(useSearchStore())
+const { $getSearchHistory } = useSearchStore()
+const isOpenHistory = ref(false)
+const query = ref('')
+function handleClear () {
+    modal.open(IConfirm, {
+        title: '清空确认',
+        description: '确定要清空全部搜索记录吗？',
+        onSuccess () {
+            modal.close()
+            emits('clear')
+            handleRemoveRecords()
+        },
+        onCancel () {
+            modal.close()
+        }
+    })
+}
+function handleRemoveRecordItem (id) {
+    handleRemoveRecords([id])
+}
+async function handleRemoveRecords (ids) {
+    if (!ids) {
+        ids = $searchHistory.value.map(item => item.c_id)
+    }
+    const { data} = await useRequest('/v1/chat/completion/remove', {
+        method: 'post',
+        body: ids
+    })
+    if (data.value) {
+        $getSearchHistory()
+        navigateTo('/')
+    }
+}
+function handleOpen () {
+    if (!$isSignIn) emits('sign')
+    else {
+        isOpenHistory.value = true
+    }
+}
+function handleClose () {
+    isOpenHistory.value = false
+}
+function handleClickItem () {
+    Layout.handleCloseAside()
+}
+
+nextTick(() => {
+    $getSearchHistory()
+})
+</script>

components/i/Create.vue

@@ -51,7 +51,7 @@
 <script setup>
 const { $repos } = storeToRefs(useReposStore())
 const { $setRepo } = useReposStore()
-const { $getSearchHistory, $setFirstRecordTitle } = useSearchStore()
+const { $setFirstRecordTitle, $setSearchHistory } = useSearchStore()
 const emits = defineEmits([ 'search' ])
 const query = ref('')
 const selectedRepo = ref('')
@@ -82,11 +82,12 @@ const handleSearch = async () => {
     if (error.value) return
     // todo 临时存到pina给搜索使用
     $setFirstRecordTitle(query.value)
+    $setSearchHistory({
+        title: query.value,
+        c_id: data.value.data.c_id
+    })
     navigateTo(`/search/${data.value.data.c_id}`)
     emits('search')
-    nextTick(() => {
-        $getSearchHistory()
-    })  
 }
 function handleClearRepo () {
     selectedRepo.value = ''

components/i/Nav.vue

@@ -14,7 +14,7 @@
             color="gray"
             variant="ghost"
             size="md"
-            label="收藏夹"
+            label="主题"
             to="/library"
             @click="handleClickItem"
         />

components/i/SearchHistory.vue

 <template>
-    <div class="flex flex-col overflow-hidden">
+    <div class="flex flex-col overflow-hidden group">
         <div class="flex justify-between">
             <UButton
-                class="flex-grow"
+                class="flex-grow cursor-default"
                 leading-icon="i-heroicons-magnifying-glass"
                 color="gray"
                 variant="ghost"
                 size="md"
                 label="搜索记录"
-                @click="handleOpen"
             />
             <UButton
-                v-if="$isSignIn"
+                class="hidden group-hover:flex"
                 label="清空"
                 size="md"
                 variant="link"
                 @click="handleClear"
             />
         </div>
-        <div v-if="$isSignIn" class="flex overflow-y-auto flex-col gap-1 border-l border-gray-200 dark:border-gray-800 pl-2 ml-5">
-            <template v-for="(item, index) in $searchHistory" :key="index">
-                <UButton
-                    class="flex group text-gray-400"
-                    color="gray"
-                    variant="ghost"
-                    size="xs"
-                    long
-                    :to="`/search/${item.c_id}`"
-                    @click="handleClickItem"
-                >
-                    <div class="flex-grow truncate">{{ item.title }}</div>
+        <ClientOnly>
+            <div class="flex overflow-y-auto flex-col gap-1 border-l border-gray-200 dark:border-gray-800 pl-2 ml-5">
+                <template v-for="(item, index) in $searchHistory.reverse()" :key="index">
                     <UButton
-                        class="hidden group-hover:flex"
-                        color="red"
+                        class="flex text-gray-400"
+                        color="gray"
                         variant="ghost"
                         size="xs"
-                        :padded="false"
-                        leading-icon="i-heroicons-x-mark-20-solid"
-                        @click.stop.prevent="handleRemoveRecordItem(item.c_id)"
-                    />
-                </UButton>
-            </template>
-        </div>
+                        long
+                        :to="`/search/${item.c_id}`"
+                        @click="handleClickItem"
+                    >
+                        <div class="flex-grow truncate">{{ item.title }}</div>
+                    </UButton>
+                </template>
+            </div>
+        </ClientOnly>
     </div>
-    <UModal v-model="isOpenHistory" :ui="{ width: 'w-full sm:max-w-screen-md' }">
-        <div class="flex items-center p-2">
-            <UInput
-                class="w-full"
-                v-model="query"
-                :padded="false"
-                variant="none"
-                leading-icon="i-heroicons-magnifying-glass-20-solid"
-                placeholder="输入关键字搜索..."
-            />
-            <UButton
-                leading-icon="i-heroicons-x-mark-20-solid"
-                color="gray"
-                variant="ghost"
-                @click="handleClose"
-            />
-        </div>
-        <UDivider />
-        <div class="flex flex-col p-2">
-            <template v-for="(item, index) in $searchHistory" :key="index">
-                <UButton
-                    class="flex group"
-                    color="gray"
-                    variant="ghost"
-                    long
-                    leading-icon="i-heroicons-document-text"
-                    :to="`/search/${item.c_id}`"
-                    @click="handleClose"
-                >
-                    <div class="flex-grow truncate font-light">{{ item.title }}</div>
-                    <UButton
-                        class="hidden group-hover:flex"
-                        color="red"
-                        variant="ghost"
-                        :padded="false"
-                        leading-icon="i-heroicons-x-mark-20-solid"
-                        @click.stop.prevent="handleRemoveRecordItem(item.c_id)"
-                    />
-                </UButton>
-            </template>
-        </div>
-    </UModal>
 </template>
 <script setup>
-import { IConfirm } from '#components'
 const emits = defineEmits(['sign', 'clear'])
 const Layout = inject('Layout')
 const modal = useModal()
-const { $isSignIn } = storeToRefs(useUserStore())
 const { $searchHistory } = storeToRefs(useSearchStore())
-const { $getSearchHistory } = useSearchStore()
-const isOpenHistory = ref(false)
+const { $clearSearchHistory } = useSearchStore()
 const query = ref('')
 function handleClear () {
-    modal.open(IConfirm, {
-        title: '清空确认',
-        description: '确定要清空全部搜索记录吗？',
-        onSuccess () {
-            modal.close()
-            emits('clear')
-            handleRemoveRecords()
-        },
-        onCancel () {
-            modal.close()
-        }
-    })
-}
-function handleRemoveRecordItem (id) {
-    handleRemoveRecords([id])
-}
-async function handleRemoveRecords (ids) {
-    if (!ids) {
-        ids = $searchHistory.value.map(item => item.c_id)
-    }
-    const { data} = await useRequest('/v1/chat/completion/remove', {
-        method: 'post',
-        body: ids
-    })
-    if (data.value) {
-        $getSearchHistory()
-        navigateTo('/')
-    }
-}
-function handleOpen () {
-    if (!$isSignIn) emits('sign')
-    else {
-        isOpenHistory.value = true
-    }
-}
-function handleClose () {
-    isOpenHistory.value = false
+    $clearSearchHistory()
 }
 function handleClickItem () {
     Layout.handleCloseAside()
 }
-
-nextTick(() => {
-    $getSearchHistory()
-})
 </script>

pages/md.vue

-<template>
-    <div class="p-12">
-        <IMdMdc :content="code" />
-    </div>
-</template>
-<script setup>
-const code = ref('')
-async function getMockData () {
-    const data = await $fetch('/api/mock/test', { method: 'get' })
-    code.value = data
-}
-onMounted(() => {
-    getMockData()
-})
-</script>
\ No newline at end of file

pages/md2.vue

-<template>
-    <div class="p-12">
-        <IMdMdc :content="data" />
-    </div>
-</template>
-<script setup>
-const { data } = await useRequest('/api/mock/test')
-</script>
\ No newline at end of file

pages/test.vue

-<template>
-    <div>Test</div>
-    <div>{{ data }}</div>
-</template>
-<script setup>
-const { data } = await useRequest('/v1/chat/repository')
-</script>

stores/search.js

 import { defineStore } from 'pinia'
+import { useStorage } from '@vueuse/core'
+
+const searchHistory = useStorage('search-history', '')
 
 export const useSearchStore = defineStore('search', () => {
-    const { $isSignIn } = useUserStore()
-    const $searchHistory = ref([])
-    const $firstRecordTitle = ref('')
-    async function $getSearchHistory () {
-        if (!$isSignIn) return
-        const { data } = await useRequest('/v1/chat/completion/list')
-        $searchHistory.value = data.value.data
+    const $searchHistory = computed(() => searchHistory.value ? JSON.parse(searchHistory.value) : [])
+    function $setSearchHistory (item) {
+        const history = searchHistory.value ? JSON.parse(searchHistory.value) : []
+        history.push(item)
+        searchHistory.value = JSON.stringify(history)
+    }
+    function $clearSearchHistory () {
+        searchHistory.value = ''
     }
+
+    const $firstRecordTitle = ref('')
     function $setFirstRecordTitle (article) {
         $firstRecordTitle.value = article
     }
     return { 
-        $searchHistory, $getSearchHistory, 
-        $firstRecordTitle, $setFirstRecordTitle
+        $searchHistory,
+        $setSearchHistory,
+        $clearSearchHistory,
+        $firstRecordTitle,
+        $setFirstRecordTitle
     }
 })