diff --git a/src/components/xt-chat/chat-view/components/right-view/index.vue b/src/components/xt-chat/chat-view/components/right-view/index.vue index 39e0f0c..ca682d1 100644 --- a/src/components/xt-chat/chat-view/components/right-view/index.vue +++ b/src/components/xt-chat/chat-view/components/right-view/index.vue @@ -11,12 +11,16 @@ import { FILE_TYPE } from '@/components/xt-chat/chat-view/constants'; export default { emits: ['close'], props: { - rightViewData: { + dataSource: { type: Array, default: () => [], }, + previewData: { + type: Object, + default: () => {}, + }, }, - setup(props: { rightViewData: any[] }, { emit, expose }) { + setup(props: { dataSource: any[]; previewData: any }, { emit, expose }) { const bubbleRef = ref(null); const md = markdownit({ @@ -26,21 +30,15 @@ export default { typographer: true, }); - console.log(props.rightViewData) - - const dataSource = computed(() => { - return props.rightViewData.find((v) => v.task_type === '任务管理') ?? {}; - }); - const tasks = computed(() => { - return dataSource.value.payload?.tasks ?? []; + return props.previewData.payload?.tasks ?? []; }); const isTaskManage = computed(() => { - return dataSource.value.task_type === '任务管理'; + return props.previewData.task_type === '任务管理'; }); const hasMediaCenter = computed(() => { - return props.rightViewData.some((v) => v.task_type === '素材中心') + return props.dataSource.some((v) => v.task_type === '素材中心'); }); const onDownload = () => { @@ -48,10 +46,11 @@ export default { message.success('下载成功！'); }; const onAddMediaCenter = () => { + const _data = props.dataSource.find((v) => v.task_type === '素材中心'); const { api: { endpoint, method }, payload, - } = dataSource.value; + } = _data; Http[method.toLowerCase()]?.(endpoint, payload).then((res) => { const { code } = res; if (code === 200) { @@ -60,10 +59,11 @@ export default { }); }; const onAddTaskManage = () => { + const _data = props.dataSource.find((v) => v.task_type === '任务管理'); const { api: { endpoint, method }, payload, - } = dataSource.value; + } = _data; Http[method.toLowerCase()]?.(endpoint, payload).then((res) => { const { code } = res; if (code === 200) { @@ -113,7 +113,7 @@ export default { ); }; const renderTaskManage = () => { - const { file_type } = dataSource.value; + const { file_type } = props.previewData; return tasks.value.map((item) => { const { params, execution_time, name } = item; if (file_type === FILE_TYPE.topic_only) { diff --git a/src/components/xt-chat/chat-view/constants.ts b/src/components/xt-chat/chat-view/constants.ts index a0a23a1..de31db9 100644 --- a/src/components/xt-chat/chat-view/constants.ts +++ b/src/components/xt-chat/chat-view/constants.ts @@ -9,7 +9,8 @@ export interface UseChatHandlerReturn { generateLoading?: Ref; conversationList?: Ref; showRightView?: Ref; - rightViewData?: Ref; + rightViewDataSource?: Ref; + rightPreviewData?: Ref; senderRef?: Ref } export enum EnumTeamRunStatus { @@ -39,7 +40,7 @@ export const ROLE_STYLE = { export const ANSWER_STYLE = { ...ROLE_STYLE, - paddingLeft: '12px', + paddingLeft: '14px', borderLeft: '1px solid #E6E6E8', position: 'relative', left: '6px', diff --git a/src/components/xt-chat/chat-view/index.vue b/src/components/xt-chat/chat-view/index.vue index b584aa3..3d3b113 100644 --- a/src/components/xt-chat/chat-view/index.vue +++ b/src/components/xt-chat/chat-view/index.vue @@ -108,7 +108,8 @@ export default { const { roles, showRightView, - rightViewData, + rightViewDataSource, + rightPreviewData, generateTeamRunTaskId, handleMessage, conversationList, @@ -149,7 +150,7 @@ export default { return () => (
-
+
(showRightView.value = false)} /> diff --git a/src/components/xt-chat/chat-view/useChatHandler.tsx b/src/components/xt-chat/chat-view/useChatHandler.tsx index 68a7a5c..71f50e7 100644 --- a/src/components/xt-chat/chat-view/useChatHandler.tsx +++ b/src/components/xt-chat/chat-view/useChatHandler.tsx @@ -48,7 +48,8 @@ export default function useChatHandler(options: UseChatHandlerOptions): UseChatH const generateTeamRunTaskId = ref(null); const showRightView = ref(false); - const rightViewData = ref({}); + const rightViewDataSource = ref([]); + const rightPreviewData = ref([]); // 初始化markdown const md = markdownit({ @@ -63,7 +64,7 @@ export default function useChatHandler(options: UseChatHandlerOptions): UseChatH [LOADING_ROLE]: { placement: 'start', variant: 'borderless', - style: { ...ROLE_STYLE, paddingLeft: '12px' }, + style: { ...ROLE_STYLE, paddingLeft: '20px' }, }, [INTELLECTUAL_THINKING_ROLE]: { placement: 'start', @@ -84,18 +85,28 @@ export default function useChatHandler(options: UseChatHandlerOptions): UseChatH placement: 'end', shape: 'round', style: ROLE_STYLE, + messageRender: (message: string) => { + return
+ {message} +
; + }, }, [REMOTE_USER_ROLE]: { placement: 'end', shape: 'round', style: ROLE_STYLE, + messageRender: (message: string) => { + return
+ {message} +
; + }, }, [REMOTE_ASSISTANT_ROLE]: { placement: 'start', variant: 'borderless', style: ROLE_STYLE, messageRender: (message: string) => { - return
; + return
; }, footer: (params) => { const { content, item } = params as { content: string; item: MESSAGE.Answer }; @@ -118,7 +129,7 @@ export default function useChatHandler(options: UseChatHandlerOptions): UseChatH // 下载处理 const onDownload = () => { - console.log('onDownload', rightViewData.value); + console.log('onDownload', rightViewDataSource.value); }; const onCopy = (content: string) => { @@ -208,7 +219,7 @@ export default function useChatHandler(options: UseChatHandlerOptions): UseChatH 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`; + let outputEleClass: string = `thought-chain-output border-l-#E6E6E8 border-l-1px pl-12px relative left-8px mb-4px`; !isLastRunTask(data) && (outputEleClass += ' hasLine pb-12px pt-4px'); return ( @@ -303,30 +314,35 @@ export default function useChatHandler(options: UseChatHandlerOptions): UseChatH // 含有思考过程，折叠思考过程，展示结果 if (_hasRunTask) { setRunTaskCollapse(teamRunTaskId, false); - if (extra_data) { + const _targetData = extra_data?.data?.find((item: any) => item.task_type === '任务管理') + if (_targetData) { showRightView.value = true; - rightViewData.value = extra_data.data; + rightViewDataSource.value = extra_data.data; + rightPreviewData.value = _targetData; } - _targetTask.content.customRender = () => ( - <> -
- {extra_data && ( -
- -
- - - 创建时间：{exactFormatTime(dayjs().unix())} - + _targetTask.content.customRender = () => { + return ( + <> +
+ {_targetData && ( +
+ +
+ + + 创建时间：{exactFormatTime(dayjs().unix())} + +
-
- )} - - ); + )} + + ); + } + } else { _targetTask.content.teamRunStatus = EnumTeamRunStatus.TeamRunCompleted; } @@ -391,6 +407,7 @@ export default function useChatHandler(options: UseChatHandlerOptions): UseChatH generateLoading, conversationList, showRightView, - rightViewData, + rightViewDataSource, + rightPreviewData }; } diff --git a/src/components/xt-chat/xt-bubble/style.scss b/src/components/xt-chat/xt-bubble/style.scss index d0d8381..af644f2 100644 --- a/src/components/xt-chat/xt-bubble/style.scss +++ b/src/components/xt-chat/xt-bubble/style.scss @@ -44,7 +44,7 @@ left: 0; width: 100%; height: 100%; - border-left: 1px solid #E6E6E8; + border-left: 1px solid #e6e6e8; } } } @@ -59,6 +59,8 @@ align-items: flex-start; min-width: 0; max-width: 100%; + min-height: 36px; + word-break: break-all; @include cts; &-filled { background-color: #f2f3f5; @@ -101,7 +103,7 @@ &-corner { border-radius: 4px; } - + :deep(table) { border-collapse: collapse; thead { @@ -109,9 +111,8 @@ th { @include cts; padding: 6px 8px; - border: 1px solid #E6E6E8; + border: 1px solid #e6e6e8; text-align: left; - } } } @@ -119,7 +120,7 @@ tr { td { @include cts; - border: 1px solid #E6E6E8; + border: 1px solid #e6e6e8; padding: 16px 8px; text-align: left; } @@ -142,5 +143,4 @@ display: inline-block; min-width: 36px; } - } diff --git a/src/layouts/Basic.vue b/src/layouts/Basic.vue index 4f31f77..6b8d78f 100644 --- a/src/layouts/Basic.vue +++ b/src/layouts/Basic.vue @@ -103,7 +103,7 @@ const checkHasInviteCode = () => { .layout-wrap { font-family: inherit; background: transparent; - min-width: 1200px; + min-width: $layout-min-width; .layout-header-wrap { background: transparent; height: $navbar-height; @@ -115,6 +115,7 @@ const checkHasInviteCode = () => { left: 0; z-index: 1000; width: 100%; + min-width: $layout-min-width; } .layout-content-wrap { width: 100%; diff --git a/src/layouts/components/navbar/components/middle-side/index.vue b/src/layouts/components/navbar/components/middle-side/index.vue index f1147f0..32b7782 100644 --- a/src/layouts/components/navbar/components/middle-side/index.vue +++ b/src/layouts/components/navbar/components/middle-side/index.vue @@ -14,7 +14,7 @@ export default { keyWord.value = ''; }; return () => ( -
+
+
+
-
+ -
+
+ +