Files
zn-ai/src/renderer/views/home/index.vue
duanshuwen f8ddecc6dd feat(home): add task operation dialog component
Listen to OPERATION_CHANNEL events to open the dialog, enabling task operations from other components.
2026-04-06 19:55:16 +08:00

47 lines
1.4 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<layout>
<div class="flex h-full w-full flex-col md:flex-row">
<ChatHistory class="flex-none w-50" @new-chat="handleNewChat" @select-chat="handleSelectChat" />
<div class="flex-1 mr-2 overflow-hidden bg-white rounded-xl">
<ChatBox v-model:guide="guide" :conversationId="selectedConversationId" />
</div>
<TaskList />
</div>
<TaskOperationDialog ref="taskOperationDialogRef" />
</layout>
</template>
<script setup lang="ts">
import TaskList from '@renderer/components/TaskList/index.vue'
import TaskOperationDialog from '@renderer/views/home/components/TaskOperationDialog.vue'
import ChatHistory from './ChatHistory.vue'
import ChatBox from './ChatBox.vue'
import { ref } from 'vue'
import emitter from '@utils/emitter'
// 是否显示引导页
const guide = ref(true)
// 选择的历史会话ID
const selectedConversationId = ref('')
// 任务操作弹窗引用
const taskOperationDialogRef = ref()
/// 处理新对话事件切换到引导页并清空选中的历史会话ID
const handleNewChat = () => {
guide.value = true;
selectedConversationId.value = '';
};
/// 选择历史会话
const handleSelectChat = (conversationId: string) => {
guide.value = false;
selectedConversationId.value = conversationId;
};
// 监听任务操作弹窗关闭事件
emitter.on('OPERATION_CHANNEL', (item) => {
taskOperationDialogRef.value?.open(item);
});
</script>