|
|
@@ -35,7 +35,7 @@
|
|
|
<div class="dp_clearArea">
|
|
|
<div class="dp_clear_btn"
|
|
|
v-if="!sendMessageLoading && !dialogueLoading"
|
|
|
- @click.stop="clearChatHistory"
|
|
|
+ @click.stop="openClearConfirm"
|
|
|
title="清空聊天记录">
|
|
|
<svg
|
|
|
width="20"
|
|
|
@@ -144,6 +144,27 @@
|
|
|
<div class="dialogueLoading" v-if="dialogueLoading">
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="currentColor" d="M12,1A11,11,0,1,0,23,12,11,11,0,0,0,12,1Zm0,19a8,8,0,1,1,8-8A8,8,0,0,1,12,20Z" opacity=".25"/><path fill="currentColor" d="M10.14,1.16a11,11,0,0,0-9,8.92A1.59,1.59,0,0,0,2.46,12,1.52,1.52,0,0,0,4.11,10.7a8,8,0,0,1,6.66-6.61A1.42,1.42,0,0,0,12,2.69h0A1.57,1.57,0,0,0,10.14,1.16Z"><animateTransform attributeName="transform" dur="0.75s" repeatCount="indefinite" type="rotate" values="0 12 12;360 12 12"/></path></svg>
|
|
|
</div>
|
|
|
+
|
|
|
+ <!-- 清空聊天记录确认弹窗 -->
|
|
|
+ <Modal
|
|
|
+ :visible="clearConfirmVisible"
|
|
|
+ :width="420"
|
|
|
+ :closeButton="true"
|
|
|
+ :closeOnClickMask="false"
|
|
|
+ :closeOnEsc="false"
|
|
|
+ @update:visible="val => clearConfirmVisible = val"
|
|
|
+ >
|
|
|
+ <div class="clear-confirm">
|
|
|
+ <div class="clear-confirm__title">清空聊天记录</div>
|
|
|
+ <div class="clear-confirm__content">
|
|
|
+ 确定要清空所有聊天记录吗?此操作不可恢复。
|
|
|
+ </div>
|
|
|
+ <div class="clear-confirm__footer">
|
|
|
+ <Button type="default" @click="clearConfirmVisible = false">取消</Button>
|
|
|
+ <Button type="primary" @click="handleConfirmClear">确认清空</Button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </Modal>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
@@ -154,6 +175,8 @@ import { fetchEventSource } from '@microsoft/fetch-event-source'
|
|
|
import MarkdownIt from 'markdown-it'
|
|
|
import api from '../../../services/course'
|
|
|
import message from '@/utils/message'
|
|
|
+import Modal from '@/components/Modal.vue'
|
|
|
+import Button from '@/components/Button.vue'
|
|
|
|
|
|
|
|
|
|
|
|
@@ -208,9 +231,12 @@ const curRequestController = ref<AbortController | null>(null)
|
|
|
// 用户名称
|
|
|
const userName = ref<string>('')
|
|
|
|
|
|
-// 清空聊天记录loading
|
|
|
+// 代理配置 / 会话信息
|
|
|
const agentData = ref<any>({})
|
|
|
|
|
|
+// 清空聊天记录二次确认弹窗
|
|
|
+const clearConfirmVisible = ref(false)
|
|
|
+
|
|
|
const htmlContent = computed(() => {
|
|
|
const md = new MarkdownIt()
|
|
|
return (_md:string) => {
|
|
|
@@ -395,32 +421,33 @@ const getMessageList = () => {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
-// 清空聊天记录
|
|
|
+// 打开清空聊天记录确认弹窗
|
|
|
+const openClearConfirm = () => {
|
|
|
+ if (dialogueLoading.value) return
|
|
|
+ clearConfirmVisible.value = true
|
|
|
+}
|
|
|
+
|
|
|
+// 实际执行清空聊天记录
|
|
|
const clearChatHistory = async () => {
|
|
|
if (dialogueLoading.value) return
|
|
|
console.log(agentData.value)
|
|
|
-
|
|
|
- // 确认对话框
|
|
|
- if (!confirm('确定要清空所有聊天记录吗?此操作不可恢复。')) {
|
|
|
- return
|
|
|
- }
|
|
|
-
|
|
|
+
|
|
|
dialogueLoading.value = true
|
|
|
-
|
|
|
+
|
|
|
try {
|
|
|
const params = {
|
|
|
model: 'open-gpt-4.1',
|
|
|
thread_id: agentData.value.thread_id,
|
|
|
groupid: `${props.courseid?.slice(0, 31)}${props.userid?.slice(0, 5)}`,
|
|
|
- userid: props.userid
|
|
|
+ userid: props.userid,
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
const response = await api.clearDialogue(params)
|
|
|
-
|
|
|
+
|
|
|
if (response) {
|
|
|
// 清空本地消息列表,只保留初始欢迎消息
|
|
|
messageList.splice(1) // 保留第一个欢迎消息
|
|
|
-
|
|
|
+
|
|
|
// 重置消息列表为初始状态
|
|
|
messageList[0] = {
|
|
|
id: '1',
|
|
|
@@ -431,7 +458,7 @@ const clearChatHistory = async () => {
|
|
|
aiName: 'AI助手',
|
|
|
loading: false,
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
console.log('聊天记录清空成功')
|
|
|
message.success('聊天记录已清空')
|
|
|
}
|
|
|
@@ -448,6 +475,12 @@ const clearChatHistory = async () => {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
+// 确认弹窗中点击“确认清空”
|
|
|
+const handleConfirmClear = async () => {
|
|
|
+ clearConfirmVisible.value = false
|
|
|
+ await clearChatHistory()
|
|
|
+}
|
|
|
+
|
|
|
const getAgentData = () => {
|
|
|
dialogueLoading.value = true
|
|
|
api.getAgentData({
|
|
|
@@ -693,6 +726,31 @@ onMounted(() => {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
+// 清空聊天记录确认弹窗样式
|
|
|
+.clear-confirm {
|
|
|
+ padding-top: 4px;
|
|
|
+
|
|
|
+ &__title {
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 600;
|
|
|
+ margin-bottom: 12px;
|
|
|
+ color: #333;
|
|
|
+ }
|
|
|
+
|
|
|
+ &__content {
|
|
|
+ font-size: 14px;
|
|
|
+ color: #666;
|
|
|
+ line-height: 1.6;
|
|
|
+ margin-bottom: 20px;
|
|
|
+ }
|
|
|
+
|
|
|
+ &__footer {
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-end;
|
|
|
+ gap: 8px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
@keyframes spin {
|
|
|
0% { transform: rotate(0deg); }
|
|
|
100% { transform: rotate(360deg); }
|