<template>
|
<div class="flex px-4 py-6 rounded-lg relative" :class="{ 'px-10': isShareCheck }">
|
<div class="absolute top-0 left-[72px] text-[#8d8e99]">{{ msg?.createTime }}</div>
|
|
<img class="rounded-full size-12 flex-0 mr-4" :src="roleImageMap[msg.role]" alt="" srcset="" />
|
<div class="flex-auto flex">
|
<div class="inline-flex flex-col w-full">
|
<div class="w-full">
|
<div class="rounded-[6px] p-4 leading-relaxed bg-white">
|
<!-- 意图分析 -->
|
<IntentAnalysis
|
v-if="msg?.stepList?.length > 0"
|
:stepList="msg.stepList"
|
:stepIsShow="msg.stepIsShow"
|
:isTalking="isTalking"
|
:msgIndex="msgIndex"
|
@toggleStepList="toggleStepList"
|
@askMoreClick="askMoreClick"
|
/>
|
|
<!-- 消息内容 -->
|
<MessageContent
|
v-if="msg.content?.values"
|
:content="msg.content"
|
:msg="msg"
|
:isTalking="isTalking"
|
:msgIndex="msgIndex"
|
@fixQuestionClick="fixQuestionClick"
|
@relativeQueryClick="relativeQueryClick"
|
/>
|
|
<!-- 附加内容 -->
|
<MessageExtra
|
:msg="msg"
|
:isTalking="isTalking"
|
/>
|
</div>
|
|
<!-- 消息操作 -->
|
<MessageActions
|
v-if="msg.role === RoleEnum.assistant && msg.content?.values && !isSharePage && !isShareCheck"
|
:msg="msg"
|
@copyClick="copyClick"
|
@shareClick="shareClick"
|
@likeClick="likeClick"
|
@unLikeClick="unLikeClick"
|
@feedbackClick="feedbackClick"
|
/>
|
</div>
|
</div>
|
</div>
|
</div>
|
</template>
|
|
<script setup lang="ts">
|
import { RoleEnum, roleImageMap } from '../model/types';
|
import type { ChatMessage } from '../model/types';
|
import IntentAnalysis from './message/IntentAnalysis.vue';
|
import MessageContent from './message/MessageContent.vue';
|
import MessageExtra from './message/MessageExtra.vue';
|
import MessageActions from './message/MessageActions.vue';
|
|
defineProps<{
|
msg: ChatMessage;
|
msgIndex: number;
|
isTalking: boolean;
|
isSharePage: boolean;
|
isShareCheck: boolean;
|
}>();
|
|
const emit = defineEmits<{
|
copyClick: [msg: ChatMessage];
|
shareClick: [msg: ChatMessage];
|
likeClick: [msg: ChatMessage];
|
unLikeClick: [msg: ChatMessage];
|
feedbackClick: [event: MouseEvent, msg: ChatMessage, index: number];
|
askMoreClick: [item: any];
|
fixQuestionClick: [question: string, origin: any];
|
relativeQueryClick: [val: any];
|
}>();
|
|
const copyClick = (msg: ChatMessage) => emit('copyClick', msg);
|
const shareClick = (msg: ChatMessage) => emit('shareClick', msg);
|
const likeClick = (msg: ChatMessage) => emit('likeClick', msg);
|
const unLikeClick = (msg: ChatMessage) => emit('unLikeClick', msg);
|
const feedbackClick = (event: MouseEvent, msg: ChatMessage, index: number) => emit('feedbackClick', event, msg, index);
|
const askMoreClick = (item: any) => emit('askMoreClick', item);
|
const fixQuestionClick = (question: string, origin: any) => emit('fixQuestionClick', question, origin);
|
const relativeQueryClick = (val: any) => emit('relativeQueryClick', val);
|
|
const toggleStepList = (msg: ChatMessage) => {
|
msg.stepIsShow = !msg.stepIsShow;
|
};
|
</script>
|
