初始化

2026-02-22 18:56:10 +08:00
commit 26677972a6
3112 changed files with 255972 additions and 0 deletions
--- a/easyflow-ui-usercenter/app/src/views/chatHistory/details/index.vue
+++ b/easyflow-ui-usercenter/app/src/views/chatHistory/details/index.vue
@@ -0,0 +1,168 @@
+<script setup lang="ts">
+import { onMounted, reactive, ref } from 'vue';
+import { useRoute } from 'vue-router';
+
+import { IconifyIcon } from '@easyflow/icons';
+import { copyToClipboard } from '@easyflow/utils';
+
+import { ArrowLeft, Delete, MoreFilled } from '@element-plus/icons-vue';
+import {
+  ElButton,
+  ElContainer,
+  ElDropdown,
+  ElDropdownItem,
+  ElHeader,
+  ElMain,
+  ElMessage,
+} from 'element-plus';
+import { tryit } from 'radash';
+
+import { api } from '#/api/request';
+import { ChatBubbleList } from '#/components/chat';
+import { router } from '#/router';
+
+const route = useRoute();
+
+const ids = reactive({
+  botId: '',
+  conversationId: '',
+});
+const conversationInfo = ref<any>();
+const messageList = ref<any[]>([]);
+const loading = ref(true);
+
+onMounted(() => {
+  if (route.params.id) {
+    ids.conversationId = route.params.id as string;
+    getConversationDetails();
+  }
+});
+
+function getConversationDetails() {
+  api
+    .get('/userCenter/botConversation/detail', {
+      params: {
+        id: ids.conversationId,
+      },
+    })
+    .then((res) => {
+      if (res.errorCode === 0) {
+        conversationInfo.value = res.data;
+        ids.botId = res.data.botId;
+        getMessageList();
+      }
+    });
+}
+function getMessageList() {
+  api
+    .get('/userCenter/botMessage/getMessages', {
+      params: ids,
+    })
+    .then((res) => {
+      if (res.errorCode === 0) {
+        messageList.value = res.data;
+        loading.value = false;
+      }
+    });
+}
+async function handleShare() {
+  const shareLink = import.meta.env.DEV
+    ? `${location.origin}/share/${ids.conversationId}`
+    : `${location.origin}/#/share/${ids.conversationId}`;
+  const { success, error } = await copyToClipboard(shareLink);
+
+  if (success) {
+    ElMessage.success('分享链接复制成功！');
+  } else {
+    ElMessage.error(error);
+  }
+}
+async function handleDelete() {
+  const [, res] = await tryit(api.post)('/userCenter/botConversation/remove', {
+    id: ids.conversationId,
+  });
+
+  if (res && res.errorCode === 0) {
+    ElMessage.success('删除成功');
+    router.back();
+  }
+}
+</script>
+
+<template>
+  <ElContainer class="bg-background h-full">
+    <ElHeader height="100px" class="border-border border-b !pr-10">
+      <div class="flex h-full w-full items-center justify-between">
+        <!-- Left -->
+        <div class="flex items-center gap-3">
+          <ElButton
+            link
+            style="font-size: 20px"
+            :icon="ArrowLeft"
+            @click="router.back()"
+          />
+          <div class="flex flex-col gap-2">
+            <div class="flex items-center gap-2">
+              <span class="text-lg font-medium">{{
+                conversationInfo?.title
+              }}</span>
+              <div
+                v-if="conversationInfo?.bot.title"
+                class="text-foreground/70 rounded bg-[var(--el-fill-color-light)] p-1 text-xs"
+              >
+                {{ conversationInfo.bot.title }}
+              </div>
+            </div>
+            <span class="text-foreground/50 text-sm">{{
+              conversationInfo?.created
+            }}</span>
+          </div>
+        </div>
+
+        <!-- Right -->
+        <div class="flex items-center gap-5">
+          <ElButton link style="font-size: 20px" @click="handleShare">
+            <template #icon>
+              <IconifyIcon icon="svg:share" />
+            </template>
+          </ElButton>
+          <ElDropdown>
+            <ElButton link style="font-size: 20px" :icon="MoreFilled" />
+
+            <template #dropdown>
+              <ElDropdownItem
+                style="color: var(--el-color-danger)"
+                :icon="Delete"
+                @click="handleDelete"
+              >
+                删除
+              </ElDropdownItem>
+            </template>
+          </ElDropdown>
+        </div>
+      </div>
+    </ElHeader>
+    <ElMain class="relative" v-loading="loading">
+      <div
+        class="absolute bottom-5 left-1/2 top-5 w-full max-w-[1000px] -translate-x-1/2"
+      >
+        <ChatBubbleList
+          :bot="conversationInfo?.bot"
+          :messages="messageList"
+          :editable="false"
+          :open-editor="() => {}"
+        />
+      </div>
+    </ElMain>
+  </ElContainer>
+</template>
+
+<style lang="css" scoped>
+:deep(.el-bubble-list) {
+  max-height: 100%;
+}
+
+:deep(.el-bubble-content-wrapper .el-bubble-content) {
+  --bubble-content-max-width: calc(100% - 52px);
+}
+</style>