Explorar el Código

添加问题轮播功能

yangg hace 6 meses
padre
commit
9e977b30c5
Se han modificado 1 ficheros con 113 adiciones y 15 borrados
  1. 113 15
      src/views/report.vue

+ 113 - 15
src/views/report.vue

@@ -74,9 +74,14 @@
               </div>
               <p class="card-subtitle">What are you interested in?</p>
               <div class="suggestion-items">
-                <div class="suggestion-item">What's new in X?</div>
-                <div class="suggestion-item">What's AGI?</div>
-                <div class="suggestion-item">Where is the doc?</div>
+                <div 
+                  v-for="(qa, index) in currentQaPairs" 
+                  :key="index" 
+                  class="suggestion-item"
+                  @click="handleQaClick(qa)"
+                >
+                  {{ qa.question }}
+                </div>
               </div>
             </div>
 
@@ -92,17 +97,13 @@
               </div>
               <p class="card-subtitle">How to design a good product?</p>
               <div class="suggestion-items">
-                <div class="suggestion-item">
-                  <!-- <HeartOutlined /> -->
-                  Know the well
-                </div>
-                <div class="suggestion-item">
-                  <!-- <SmileOutlined /> -->
-                  Set the AI role
-                </div>
-                <div class="suggestion-item">
-                  <!--  <CommentOutlined /> -->
-                  Express the feeling
+                <div 
+                  v-for="(guide, index) in currentDesignGuides" 
+                  :key="index" 
+                  class="suggestion-item"
+                  @click="handleQaClick(guide)"
+                >
+                  {{ guide.question }}
                 </div>
               </div>
             </div>
@@ -380,7 +381,7 @@
 </template>
 
 <script setup>
-import { ref, reactive, nextTick, onUnmounted } from "vue";
+import { ref, reactive, nextTick, onUnmounted, onMounted } from "vue";
 import {
   PlusOutlined,
   FireOutlined,
@@ -457,6 +458,101 @@ const currentPlayingId = ref(null);
 // 添加新的响应式变量
 const isUploading = ref(false);
 
+// 添加新的响应式状态
+const documentSummary = ref(null);
+const isLoadingSummary = ref(false);
+const currentQaPairs = ref([]);
+const currentDesignGuides = ref([]);
+let rotationInterval = null;
+
+// 修改获取文档摘要的方法
+const fetchDocumentSummary = async () => {
+  isLoadingSummary.value = true;
+  try {
+    const response = await axios.get(`http://192.168.66.187:8084/document/content/query/`);
+    console.log('API Response:', response.data);
+    
+    if (response.data.code === 200) {
+      documentSummary.value = response.data.data;
+      console.log('Document Summary:', documentSummary.value);
+      startRotation();
+    }
+  } catch (error) {
+    console.error('获取文档摘要失败:', error);
+  } finally {
+    isLoadingSummary.value = false;
+  }
+};
+
+// 修改轮换显示逻辑
+const startRotation = () => {
+  if (rotationInterval) {
+    clearInterval(rotationInterval);
+  }
+
+  const updateItems = () => {
+    if (!documentSummary.value?.length) {
+      console.log('No document summary data available');
+      return;
+    }
+    
+    // 处理第一项数据(Hot Topics)
+    try {
+      const hotTopicsData = documentSummary.value[0];
+      if (hotTopicsData?.qa_pairs) {
+        const parsedQaPairs = JSON.parse(hotTopicsData.qa_pairs.replace(/'/g, '"'));
+        const formattedQaPairs = parsedQaPairs.map(question => ({ question }));
+        // 随机选择3个问题
+        const shuffled = [...formattedQaPairs].sort(() => 0.5 - Math.random());
+        currentQaPairs.value = shuffled.slice(0, 3);
+      }
+    } catch (error) {
+      console.error('解析 Hot Topics 失败:', error);
+    }
+
+    // 处理第二项数据(Design Guide)
+    try {
+      const designGuideData = documentSummary.value[1];
+      if (designGuideData?.qa_pairs) {
+        const parsedGuides = JSON.parse(designGuideData.qa_pairs.replace(/'/g, '"'));
+        const formattedGuides = parsedGuides.map(question => ({ question }));
+        // 随机选择3个指南
+        const shuffled = [...formattedGuides].sort(() => 0.5 - Math.random());
+        currentDesignGuides.value = shuffled.slice(0, 3);
+      }
+    } catch (error) {
+      console.error('解析 Design Guide 失败:', error);
+    }
+  };
+
+  // 初始更新
+  updateItems();
+  
+  // 每5秒更新一次
+  rotationInterval = setInterval(updateItems, 5000);
+};
+
+// 处理QA点击事件
+const handleQaClick = (qa) => {
+  console.log('QA clicked:', qa); // 添加日志
+  if (qa?.question) {
+    inputContent.value = qa.question;
+    sendMessage();
+  }
+};
+
+// 在组件卸载时清理定时器
+onUnmounted(() => {
+  if (rotationInterval) {
+    clearInterval(rotationInterval);
+  }
+});
+
+// 在组件挂载时获取摘要
+onMounted(() => {
+  fetchDocumentSummary();
+});
+
 // 方法
 const toggleAttachments = () => {
   showAttachments.value = !showAttachments.value;
@@ -1468,11 +1564,13 @@ const renderMarkdown = (content) => {
   align-items: center;
   gap: 8px;
   cursor: pointer;
+  transition: opacity 0.3s ease;
 }
 
 .suggestion-item:hover {
   background: #e8e8e8;
 }
+
 .tab-icon {
   width: 16px;
 }