perf: 调整交互

This commit is contained in:
rd
2025-08-28 15:45:09 +08:00
parent 0c14a0caec
commit c49349257d
4 changed files with 35 additions and 23 deletions

View File

@ -40,7 +40,7 @@ export default {
const handleSubmit = () => {
emit('submit', localSearchValue.value);
localSearchValue.value = ''
// localSearchValue.value = ''
};
const handleCancel = () => {
emit('cancel');

View File

@ -30,6 +30,7 @@ export default {
const rightViewRef = ref(null);
const bubbleListRef = ref<any>(null);
const sseController = ref<any>(null);
const searchValue = ref<string>('');
const handleSubmit = (message: string) => {
if (generateLoading.value) {
@ -37,6 +38,8 @@ export default {
return;
}
searchValue.value = '';
conversationList.value.push({
role: QUESTION_ROLE,
content: message,
@ -50,7 +53,7 @@ export default {
sseController.value.abort?.();
sseController.value = null;
}
}
};
const handleCancel = () => {
if (generateLoading.value) {
@ -142,7 +145,7 @@ export default {
onUnmounted(() => {
clearSseController();
})
});
return () => (
<div class="chat-view-wrap w-full h-full flex">
@ -159,6 +162,7 @@ export default {
</div>
<div class="w-full flex flex-col justify-center items-center">
<SenderInput
v-model={searchValue.value}
ref={senderRef}
class="w-600px"
placeholder="继续追问..."

View File

@ -46,9 +46,9 @@ export default function useChatHandler(options: UseChatHandlerOptions): UseChatH
const conversationList = ref<MESSAGE.Answer[]>([]);
const generateLoading = ref<boolean>(false);
const generateTeamRunTaskId = ref<string | null>(null);
const showRightView = ref(false);
const rightViewData = ref<any>({});
const lastTeamRunTaskId = ref<string | null>(null); // 最近一个对话的id
// 初始化markdown
const md = markdownit({
@ -184,11 +184,13 @@ export default function useChatHandler(options: UseChatHandlerOptions): UseChatH
const getTeamRunTask = (teamRunTaskId: string) => {
return conversationList.value.find((item) => item.teamRunTaskId === teamRunTaskId);
};
const isLastRunTask = (run_id: string): boolean => {
return getLastRunTask(lastTeamRunTaskId.value).run_id === run_id;
const isLastRunTask = (data: MESSAGE.Answer): boolean => {
const { teamRunTaskId, run_id } = data;
return getLastRunTask(teamRunTaskId).run_id === run_id;
};
const isFirstRunTask = (run_id: string): boolean => {
return getFirstRunTask(lastTeamRunTaskId.value).run_id === run_id;
const isFirstRunTask = (data: MESSAGE.Answer): boolean => {
const { teamRunTaskId, run_id } = data;
return getFirstRunTask(teamRunTaskId).run_id === run_id;
};
// 过程节点开始
@ -198,23 +200,23 @@ export default function useChatHandler(options: UseChatHandlerOptions): UseChatH
conversationList.value.push({
run_id,
key: run_id,
teamRunTaskId: lastTeamRunTaskId.value,
content: { ...data, runStatus: EnumTeamRunStatus.RunStarted },
teamRunTaskId: generateTeamRunTaskId.value,
content: { ...data, runStatus: EnumTeamRunStatus.RunStarted, teamRunTaskId: generateTeamRunTaskId.value },
output: data.output,
role: ANSWER_ROLE,
messageRender: (data: MESSAGE.Answer) => {
const { node, output, runStatus, isCollapse = true, customRender } = data;
const { node, output, runStatus, isCollapse = true, customRender, teamRunTaskId } = data;
const isRulCompleted = runStatus === EnumTeamRunStatus.RunCompleted;
let outputEleClass: string = `thought-chain-output border-l-#E6E6E8 border-l-1px pl-12px relative left-6px mb-4px`;
!isLastRunTask(run_id) && (outputEleClass += ' hasLine pb-12px pt-4px');
!isLastRunTask(data) && (outputEleClass += ' hasLine pb-12px pt-4px');
return (
<>
{isFirstRunTask(run_id) && (
{isFirstRunTask(data) && (
<div
class="flex items-center mb-8px cursor-pointer"
onClick={() => setRunTaskCollapse(lastTeamRunTaskId.value, !isCollapse)}
onClick={() => setRunTaskCollapse(teamRunTaskId, !isCollapse)}
>
<span class="font-family-medium color-#211F24 text-14px font-400 lh-22px mr-4px"></span>
{isCollapse ? (
@ -265,14 +267,13 @@ export default function useChatHandler(options: UseChatHandlerOptions): UseChatH
// 任务开始
const handleTeamRunTaskStart = (data: MESSAGE.Answer) => {
const { run_id } = data;
lastTeamRunTaskId.value = run_id;
generateTeamRunTaskId.value = run_id;
conversationList.value.push({
run_id,
isTeamRunTask: true,
teamRunTaskId: lastTeamRunTaskId.value,
teamRunTaskId: generateTeamRunTaskId.value,
key: run_id,
content: { ...data, teamRunStatus: EnumTeamRunStatus.TeamRunStarted },
content: { ...data, teamRunStatus: EnumTeamRunStatus.TeamRunStarted, teamRunTaskId: run_id },
output: data.output,
role: ANSWER_ROLE,
messageRender: (data: MESSAGE.Answer) => {
@ -293,9 +294,10 @@ export default function useChatHandler(options: UseChatHandlerOptions): UseChatH
const handleTeamRunTaskEnd = (data: MESSAGE.Answer) => {
resetGenerateStatus();
const { run_id, extra_data, output } = data;
const _hasRunTask = hasRunTask(lastTeamRunTaskId.value);
const _targetTask = _hasRunTask ? getLastRunTask(run_id) : getTeamRunTask(lastTeamRunTaskId.value);
const { run_id: teamRunTaskId, extra_data, output } = data;
const _hasRunTask = hasRunTask(teamRunTaskId);
const _targetTask = _hasRunTask ? getLastRunTask(teamRunTaskId) : getTeamRunTask(teamRunTaskId);
if (isEmpty(_targetTask)) {
return;
@ -303,7 +305,7 @@ export default function useChatHandler(options: UseChatHandlerOptions): UseChatH
// 含有思考过程,折叠思考过程,展示结果
if (_hasRunTask) {
setRunTaskCollapse(lastTeamRunTaskId.value, false);
setRunTaskCollapse(teamRunTaskId, false);
if (extra_data) {
showRightView.value = true;
rightViewData.value = extra_data.data;
@ -333,7 +335,7 @@ export default function useChatHandler(options: UseChatHandlerOptions): UseChatH
}
_targetTask.footer = () => {
const isShow = conversationList.value[conversationList.value.length - 1].teamRunTaskId === run_id;
const isShow = conversationList.value[conversationList.value.length - 1].teamRunTaskId === teamRunTaskId;
return (
<div class="flex items-center">
{!extra_data && (
@ -347,7 +349,7 @@ export default function useChatHandler(options: UseChatHandlerOptions): UseChatH
</Tooltip>
)}
{isShow && (
<Tooltip title="重新生成" onClick={() => onRefresh(run_id)}>
<Tooltip title="重新生成" onClick={() => onRefresh(teamRunTaskId)}>
<IconRefresh size={16} class="color-#737478 cursor-pointer" />
</Tooltip>
)}

View File

@ -13,6 +13,7 @@ interface ConversationItem {
label: string | VNode;
icon?: string | VNode;
disabled?: boolean;
maxlength?: number;
[key: string]: any;
}
@ -54,6 +55,10 @@ export default defineComponent({
type: Array as () => ConversationItem[],
default: () => DEFAULT_MENU_CONFIG,
},
maxlength: {
type: Number,
default: 20,
},
},
emits: ['activeChange', 'menuClick', 'update:dataSource', 'update:modelValue', 'rename'],
setup(props, { emit, expose }) {
@ -109,6 +114,7 @@ export default defineComponent({
<Input
ref={inputRef}
v-model:value={item.label}
maxlength={props.maxlength}
onBlur={() => {
item.editing = false;
changeItems();