From a1d7e81859f554f3a53680cc35f0f49bf1f77098 Mon Sep 17 00:00:00 2001
From: wwf <1971391498@qq.com>
Date: 星期四, 14 五月 2026 14:37:02 +0800
Subject: [PATCH] 导入项目
---
src/views/ai/chat/index/components/message/MessageReasoning.vue | 89 ++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 89 insertions(+), 0 deletions(-)
diff --git a/src/views/ai/chat/index/components/message/MessageReasoning.vue b/src/views/ai/chat/index/components/message/MessageReasoning.vue
new file mode 100644
index 0000000..7cf615c
--- /dev/null
+++ b/src/views/ai/chat/index/components/message/MessageReasoning.vue
@@ -0,0 +1,89 @@
+<template>
+ <div v-if="shouldShowComponent" class="mt-10px">
+ <!-- 鎺ㄧ悊杩囩▼鏍囬鏍� -->
+ <div
+ class="flex items-center justify-between cursor-pointer p-8px rounded-t-8px bg-gradient-to-r from-blue-50 to-purple-50 border border-b-0 border-gray-200/60 hover:from-blue-100 hover:to-purple-100 transition-all duration-200"
+ @click="toggleExpanded"
+ >
+ <div class="flex items-center gap-6px text-14px font-medium text-gray-700">
+ <el-icon :size="16" class="text-blue-600">
+ <ChatDotSquare />
+ </el-icon>
+ <span>{{ titleText }}</span>
+ </div>
+ <el-icon
+ :size="14"
+ class="text-gray-500 transition-transform duration-200"
+ :class="{ 'transform rotate-180': isExpanded }"
+ >
+ <ArrowDown />
+ </el-icon>
+ </div>
+
+ <!-- 鎺ㄧ悊鍐呭鍖哄煙 -->
+ <div
+ v-show="isExpanded"
+ class="max-h-300px overflow-y-auto p-12px bg-white/70 backdrop-blur-sm border border-t-0 border-gray-200/60 rounded-b-8px shadow-sm"
+ >
+ <MarkdownView
+ v-if="props.reasoningContent"
+ class="text-gray-700 text-13px leading-relaxed"
+ :content="props.reasoningContent"
+ />
+ </div>
+ </div>
+</template>
+
+<script setup lang="ts">
+import { ref, computed } from 'vue'
+import { ArrowDown, ChatDotSquare } from '@element-plus/icons-vue'
+import MarkdownView from '@/components/MarkdownView/index.vue'
+
+// 瀹氫箟 props
+const props = defineProps<{
+ reasoningContent?: string
+ content?: string
+}>()
+
+const isExpanded = ref(true) // 榛樿灞曞紑
+
+/** 璁＄畻灞炴�э細鍒ゆ柇鏄惁搴旇鏄剧ず缁勪欢锛堟湁鎬濊�冨唴瀹规椂锛屽垯灞曠ず锛� */
+const shouldShowComponent = computed(() => {
+ return !(!props.reasoningContent || props.reasoningContent.trim() === '')
+})
+
+/** 璁＄畻灞炴�э細鏍囬鏂囨湰 */
+const titleText = computed(() => {
+ const hasReasoningContent = props.reasoningContent && props.reasoningContent.trim() !== ''
+ const hasContent = props.content && props.content.trim() !== ''
+ if (hasReasoningContent && !hasContent) {
+ return '娣卞害鎬濊�冧腑'
+ }
+ return '宸叉繁搴︽�濊��'
+})
+
+/** 鍒囨崲灞曞紑/鏀剁缉鐘舵�� */
+const toggleExpanded = () => {
+ isExpanded.value = !isExpanded.value
+}
+</script>
+
+<style scoped>
+/* 鑷畾涔夋粴鍔ㄦ潯鏍峰紡 */
+.max-h-300px::-webkit-scrollbar {
+ width: 4px;
+}
+
+.max-h-300px::-webkit-scrollbar-track {
+ background: transparent;
+}
+
+.max-h-300px::-webkit-scrollbar-thumb {
+ background: rgba(156, 163, 175, 0.4);
+ border-radius: 2px;
+}
+
+.max-h-300px::-webkit-scrollbar-thumb:hover {
+ background: rgba(156, 163, 175, 0.6);
+}
+</style>
--
Gitblit v1.8.0