feature: 添加相关问题组件

components/i/search/RecommendQuestion.vue

+<template>
+    <div class="text-xl flex items-center space-x-1">
+        <UIcon name="i-heroicons-rectangle-group-20-solid" />
+        <span>相关问题</span>
+    </div>
+    <div class="flex flex-col gap-2">
+        <UButton
+            v-for="item in recommendQuestions"
+            color="gray"
+            size="md"
+            @click="handleClick(item.title)"
+        >
+            <div class="justify-between w-full flex items-center">
+                <div class="truncate">{{ item.title }}</div>
+                <UIcon name="i-heroicons-plus-20-solid" class="text-base" />
+            </div>
+        </UButton>
+    </div>
+</template>
+<script setup>
+defineProps({
+    recommendQuestions: {
+        type: Array,
+        default: () => []
+    }
+})
+const emits = defineEmits(['click'])
+function  handleClick(title) {
+    emits('click', title)
+}
+</script>
\ No newline at end of file

pages/search/[id].vue

@@ -104,25 +104,11 @@
                 </template>
                 <UDivider v-if="index !== data.length - 1" class="pt-3 pb-2" />
             </template>
-
-            <div class="text-xl flex items-center space-x-1" v-if="recommendQuestions.length > 0 && !asking">
-                <UIcon name="i-heroicons-rectangle-group-20-solid" />
-                <span>相关问题</span>
-            </div>
-            <div class="flex flex-col gap-2">
-                <UButton
-                    v-if="!asking"
-                    v-for="item in recommendQuestions"
-                    color="gray"
-                    size="md"
-                    @click="handleContinueAsk(item.title)"
-                >
-                    <div class="justify-between w-full flex items-center">
-                        <div class="truncate">{{ item.title }}</div>
-                        <UIcon name="i-heroicons-plus-20-solid" class="text-base" />
-                    </div>
-                </UButton>
-            </div>
+            <ISearchRecommendQuestion
+                v-if="recommendQuestions.length > 0 && !asking"
+                :recommend-questions="recommendQuestions"
+                @click="handleContinueAsk"
+            />
         </div>
         <div class="container max-w-screen-lg sticky bottom-2 flex pl-6 pr-6">
             <ISearchAsk :asking="asking" @stop="handleStopGenerate" @ask="handleContinueAsk" />