From c9e16424aa006a2df6afe0543ae934e559d6ef28 Mon Sep 17 00:00:00 2001
From: xuhongjie <1943105267@qq.com>
Date: Mon, 21 Apr 2025 14:57:50 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E7=94=A8=E6=88=B7=E6=B7=BB=E5=8A=A0?=
 =?UTF-8?q?=E5=B8=B8=E7=94=A8=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/path/project.api.ts                |  18 +++
 src/enums/httpEnum.ts                      |   4 +-
 src/plugins/naive.ts                       |   6 +-
 src/views/AI/chat/index.vue                |  23 ++--
 src/views/AI/components/addIssue/index.vue | 133 ++++++++++++++-------
 src/views/AI/components/aiTable/index.vue  |   7 +-
 6 files changed, 135 insertions(+), 56 deletions(-)

diff --git a/src/api/path/project.api.ts b/src/api/path/project.api.ts
index 24383a0..aba7fee 100644
--- a/src/api/path/project.api.ts
+++ b/src/api/path/project.api.ts
@@ -14,6 +14,24 @@ export const projectListApi = async (data?: object) => {
   }
 }
 
+export const getDict =  async(data: object)=>{
+  try{
+    const res = await http(RequestHttpEnum.GET)(`${ModuleTypeEnum.DICT}`, data)
+    return res
+  }catch{
+    httpErrorHandle()
+  }
+}
+
+export const addIssue =  async(data: object)=>{
+  try{
+    const res = await http(RequestHttpEnum.POST)(`${ModuleTypeEnum.ISSUE}`, data)
+    return res
+  }catch{
+    httpErrorHandle()
+  }
+}
+
 
 // 新增聊天室历史记录
 
diff --git a/src/enums/httpEnum.ts b/src/enums/httpEnum.ts
index 1bbe91e..e0338d2 100644
--- a/src/enums/httpEnum.ts
+++ b/src/enums/httpEnum.ts
@@ -2,7 +2,9 @@
 export enum ModuleTypeEnum {
   SYSTEM = 'sys',
   PROJECT = 'project',
-  MESSAGE = 'tHistoricalReply'
+  MESSAGE = 'tHistoricalReply',
+  DICT = 'dictionary',
+  ISSUE= 'commonQuestion'
 }
 
 // 请求结果集
diff --git a/src/plugins/naive.ts b/src/plugins/naive.ts
index 0d004df..6523c84 100644
--- a/src/plugins/naive.ts
+++ b/src/plugins/naive.ts
@@ -100,7 +100,8 @@ import {
   NColorPicker,
   NWatermark,
   NEmpty,
-  NCollapseTransition
+  NCollapseTransition,
+  NPopconfirm
 } from 'naive-ui'
 
 const naive = create({
@@ -204,7 +205,8 @@ const naive = create({
     NColorPicker,
     NWatermark,
     NEmpty,
-    NCollapseTransition
+    NCollapseTransition,
+    NPopconfirm
   ]
 })
 
diff --git a/src/views/AI/chat/index.vue b/src/views/AI/chat/index.vue
index ba7038b..b0e234b 100644
--- a/src/views/AI/chat/index.vue
+++ b/src/views/AI/chat/index.vue
@@ -3,7 +3,7 @@
     <div class="chat-list" ref="scrollContainer">
     
       <AiHint></AiHint>
-
+      
       <div
         v-for="(item, index) in messageList"
         :key="index"
@@ -18,8 +18,7 @@
             <!-- 纯文本 -->
             <div class="text-ros">
               <span v-show="item.type == 'text'">{{ item.text }}</span>
-              <AddIssue v-show="item.add"></AddIssue>
-             
+              <AddIssue :issueText="item.text" :list="dictList" v-show="item.add"></AddIssue>
             </div>
             <!-- 图表 -->
             <section v-if="ehcatrsType.includes(item.type)">
@@ -40,7 +39,7 @@
               </div>
             </section>
             <!-- 表格 -->
-            <AiTable v-if="!item.type" :obj="item"></AiTable>
+            <AiTable v-if="item.type ==='table' " :obj="item"></AiTable>
             <!-- 思考 -->
             <div v-show="item.from === 'ai' && item.loading" class="ai-loading">
               <span>思考中</span> <n-spin size="small" content-class="spin-class" />
@@ -101,7 +100,7 @@ import aiIcon from '@/assets/images/ai/ai-icon.png'
 import { useMessage } from 'naive-ui'
 import useMessageRoomStore from '@/store/modules/messageRoom'
 import { canvasCut } from '@/utils'
-import { historyMessageRoomById } from '@/api/path'
+import { historyMessageRoomById,getDict } from '@/api/path'
 import { useRoute } from 'vue-router'
 
 const route = useRoute()
@@ -122,15 +121,25 @@ const echartsTheme = ['简约风', '商务风', '科技风']
 let stopWatch = null
 let isWatching = ref(false)
 const ehcatrsType = ['pie', 'line', 'bar']
+let dictList = ref( [])
 /**
  * 页面初始完成
  */
 onMounted(() => {
+  getDictListist()
   startWatching()
-
   getMessageInfo()
 })
 
+/**
+ * 字典
+ */
+const getDictListist =async ()=>{
+  const res =await getDict()
+  dictList.value = res.data.records
+
+}
+
 /**
  * 获取聊天详情
  */
@@ -185,7 +194,7 @@ const handleSend = async () => {
     time: moment().format('YYYY/MM/DD HH:mm:ss'),
     add: true
   })
-return
+
   //先存储AI回答，作为交互提示，接口响应后再做更新
   setMessageItem(
     {
diff --git a/src/views/AI/components/addIssue/index.vue b/src/views/AI/components/addIssue/index.vue
index 966bf31..d59177d 100644
--- a/src/views/AI/components/addIssue/index.vue
+++ b/src/views/AI/components/addIssue/index.vue
@@ -1,65 +1,112 @@
 <template>
   <div>
-    <n-popconfirm v-model:show="showModal">
+    <n-popconfirm :show-icon="false" @positive-click="handlePositiveClick">
+      <!-- 按钮区 -->
       <template #trigger>
-        <n-button>引用</n-button>
+        <n-tooltip trigger="hover">
+          <template #trigger>
+            <n-button strong secondary size="tiny">
+              <template #icon>
+                <n-icon size="14" style="cursor: pointer">
+                  <svg
+                    xmlns="http://www.w3.org/2000/svg"
+                    xmlns:xlink="http://www.w3.org/1999/xlink"
+                    viewBox="0 0 12 12"
+                  >
+                    <g fill="none">
+                      <path
+                        d="M6.5 1.75a.75.75 0 0 0-1.5 0V5H1.75a.75.75 0 0 0 0 1.5H5v3.25a.75.75 0 0 0 1.5 0V6.5h3.25a.75.75 0 0 0 0-1.5H6.5V1.75z"
+                        fill="currentColor"
+                      ></path>
+                    </g>
+                  </svg>
+                </n-icon>
+              </template>
+            </n-button>
+          </template>
+          添加为常用问题
+        </n-tooltip>
       </template>
-      譬如，我或许可以就大象本身写一点什么，但对象的驯化却不知从何写起。
-      <template #action>
-        <n-button size="small" @click="showModal = false">
-          或许吧
-        </n-button>
-      </template>
-    </n-popconfirm>
-    <!-- <n-tooltip placement="bottom" trigger="hover">
-      <template #trigger>
-        <n-icon size="14" style="cursor: pointer" @click="handleAdd()">
-          <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 12 12">
-            <g fill="none">
-              <path
-                d="M6.5 1.75a.75.75 0 0 0-1.5 0V5H1.75a.75.75 0 0 0 0 1.5H5v3.25a.75.75 0 0 0 1.5 0V6.5h3.25a.75.75 0 0 0 0-1.5H6.5V1.75z"
-                fill="currentColor"
-              ></path>
-            </g>
-          </svg>
-        </n-icon>
-      </template>
-      <span> 添加为常用问题 </span>
-    </n-tooltip> -->
 
-    <!-- 弹窗信息 -->
-    <!-- <n-modal v-model:show="showModal">
-      <n-card style="width: 600px" title="添加常用问题" :bordered="false" size="huge" role="dialog" aria-modal="true">
-        <div class="issue-list">
-
-            <div class="issue-item"></div>
-            <div class="issue-item"></div>
-            <div class="issue-item"></div>
+      <!-- 内容区 -->
+      <div class="issue-list">
+        <div
+          class="issue-item"
+          :class="currentIndex == index ? 'active-type' : ''"
+          @click="handlerClick(item.dictKey, index)"
+          v-for="(item, index) in list"
+          :key="item.id"
+        >
+          {{ item.dictValue }}
         </div>
-        <template #footer> 尾部 </template>
-      </n-card>
-    </n-modal> -->
+      </div>
+    </n-popconfirm>
   </div>
 </template>
 
 <script setup>
-import { ref } from 'vue'
-let showModal = ref(true)
+import { addIssue } from '@/api/path'
+import { useMessage } from 'naive-ui'
+import { ref, reactive } from 'vue'
+import { useSystemStore } from '@/store/modules/systemStore/systemStore'
 
-const handleAdd = () => {
-  showModal.value = true
+const props = defineProps({
+  list: {
+    type: Array,
+    default: () => []
+  },
+  issueText: {
+    type: String,
+    default: ''
+  }
+})
+const systemStore = useSystemStore()
+let currentIndex = ref(null)
+const message = useMessage()
+let form = {
+  questionType: undefined,
+  content: undefined,
+  userId: undefined
+}
+
+const handlePositiveClick = async () => {
+  form.content = props.issueText
+  form.userId = systemStore.userInfo.userId || 1
+  try {
+    await addIssue(form)
+    currentIndex.value = null
+  } catch {
+    message.warning('保存出错！请联系管理员')
+  }
+}
+const handlerClick = (dictKey, index) => {
+  if (currentIndex.value != index) {
+    form.questionType = dictKey
+    currentIndex.value = index
+  }
 }
 </script>
 
 <style lang="scss" scoped>
 .issue-list {
+  width: 250px;
   display: grid;
   grid-template-columns: repeat(3, 1fr);
-  gap: 20px;
+  gap: 10px;
 
-  .issue-item{
-    height: 100px;
-    background-color: rgba(242, 242, 242, 1);
+  .issue-item {
+    padding: 10px 0;
+    color: '#fff';
+    text-align: center;
+    background-color: #3d424d;
+    border: 1px solid #474d59;
+    border-radius: 4px;
+    cursor: pointer;
+    font-size: 12px;
+    font-weight: 400;
+  }
+  .active-type {
+    border-color: #507afc;
   }
 }
 </style>
diff --git a/src/views/AI/components/aiTable/index.vue b/src/views/AI/components/aiTable/index.vue
index 8f56c8f..e863c31 100644
--- a/src/views/AI/components/aiTable/index.vue
+++ b/src/views/AI/components/aiTable/index.vue
@@ -29,23 +29,24 @@ const props = defineProps({
 
 <style lang="scss" scoped>
 .ai-table {
-  width: fit-content;
+//   width: fit-content;
 }
 .table-title{
+   
     font-size: 14px;
     font-weight: bold;
     margin-bottom: 8px;
     color: #fff;
 }
 .table-list {
+    min-width: 400px;
   display: flex;
   align-items: center;
   background-color: rgba(195, 202, 217, 0.5);
   gap: 1px;
   .list-item{
     flex: 1;
-    min-width: 150px;
-    max-width: 300px;
+    
   }
   .item-header {
     background-color: #507afc;