mirror of
https://github.com/labring/FastGPT.git
synced 2025-07-23 21:13:50 +00:00
fix: response modal (#2228)
This commit is contained in:
@@ -170,81 +170,77 @@ export const ResponseBox = React.memo(function ResponseBox({
|
|||||||
</Box>
|
</Box>
|
||||||
</Flex>
|
</Flex>
|
||||||
) : (
|
) : (
|
||||||
<>
|
<Box h={'100%'} overflow={'auto'}>
|
||||||
<Box position={'relative'} overflow={isOpenMobileModal ? 'hidden' : ''}>
|
{!isOpenMobileModal && (
|
||||||
{!isOpenMobileModal && (
|
<WholeResponseSideTab
|
||||||
<Box height={'100%'}>
|
response={sideResponse}
|
||||||
<WholeResponseSideTab
|
value={currentNodeId}
|
||||||
response={sideResponse}
|
onChange={(item: string) => {
|
||||||
value={currentNodeId}
|
setCurrentNodeId(item);
|
||||||
onChange={(item: string) => {
|
onOpenMobileModal();
|
||||||
setCurrentNodeId(item);
|
}}
|
||||||
onOpenMobileModal();
|
isMobile={true}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
{isOpenMobileModal && (
|
||||||
|
<Flex flexDirection={'column'} h={'100%'}>
|
||||||
|
<Flex
|
||||||
|
align={'center'}
|
||||||
|
justifyContent={'center'}
|
||||||
|
px={2}
|
||||||
|
py={2}
|
||||||
|
borderBottom={'sm'}
|
||||||
|
position={'relative'}
|
||||||
|
height={'40px'}
|
||||||
|
>
|
||||||
|
<MyIcon
|
||||||
|
width={4}
|
||||||
|
height={4}
|
||||||
|
name="common/backLight"
|
||||||
|
onClick={(e) => {
|
||||||
|
e.stopPropagation();
|
||||||
|
onCloseMobileModal();
|
||||||
}}
|
}}
|
||||||
isMobile={true}
|
position={'absolute'}
|
||||||
|
left={2}
|
||||||
|
top={'50%'}
|
||||||
|
transform={'translateY(-50%)'}
|
||||||
|
cursor={'pointer'}
|
||||||
|
_hover={{ color: 'primary.500' }}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<Avatar
|
||||||
|
src={
|
||||||
|
activeModule.moduleLogo ||
|
||||||
|
moduleTemplatesFlat.find(
|
||||||
|
(template) => activeModule.moduleType === template.flowNodeType
|
||||||
|
)?.avatar
|
||||||
|
}
|
||||||
|
w={'1.25rem'}
|
||||||
|
h={'1.25rem'}
|
||||||
|
borderRadius={'sm'}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<Box ml={1.5} lineHeight={'1.25rem'} alignItems={'center'}>
|
||||||
|
{t(activeModule.moduleName as any)}
|
||||||
|
</Box>
|
||||||
|
</Flex>
|
||||||
|
<Box flex={'1 0 0'} overflow={'auto'}>
|
||||||
|
<WholeResponseContent
|
||||||
|
activeModule={activeModule}
|
||||||
|
hideTabs={hideTabs}
|
||||||
|
showDetail={showDetail}
|
||||||
/>
|
/>
|
||||||
</Box>
|
</Box>
|
||||||
)}
|
</Flex>
|
||||||
{isOpenMobileModal && (
|
)}
|
||||||
<Box h={'100%'} w={'100%'} zIndex={10} background={'white'}>
|
</Box>
|
||||||
<Flex
|
|
||||||
align={'center'}
|
|
||||||
justifyContent={'center'}
|
|
||||||
px={2}
|
|
||||||
py={2}
|
|
||||||
borderBottom={'sm'}
|
|
||||||
position={'relative'}
|
|
||||||
height={'40px'}
|
|
||||||
>
|
|
||||||
<MyIcon
|
|
||||||
width={4}
|
|
||||||
height={4}
|
|
||||||
name="common/backLight"
|
|
||||||
onClick={(e) => {
|
|
||||||
e.stopPropagation();
|
|
||||||
onCloseMobileModal();
|
|
||||||
}}
|
|
||||||
position={'absolute'}
|
|
||||||
left={2}
|
|
||||||
top={'50%'}
|
|
||||||
transform={'translateY(-50%)'}
|
|
||||||
cursor={'pointer'}
|
|
||||||
_hover={{ color: 'primary.500' }}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<Avatar
|
|
||||||
src={
|
|
||||||
activeModule.moduleLogo ||
|
|
||||||
moduleTemplatesFlat.find(
|
|
||||||
(template) => activeModule.moduleType === template.flowNodeType
|
|
||||||
)?.avatar
|
|
||||||
}
|
|
||||||
w={'1.25rem'}
|
|
||||||
h={'1.25rem'}
|
|
||||||
borderRadius={'sm'}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<Box ml={1.5} lineHeight={'1.25rem'} alignItems={'center'}>
|
|
||||||
{t(activeModule.moduleName as any)}
|
|
||||||
</Box>
|
|
||||||
</Flex>
|
|
||||||
<Box overflow={'auto'} height={'calc(100% - 40px)'}>
|
|
||||||
<WholeResponseContent
|
|
||||||
activeModule={activeModule}
|
|
||||||
hideTabs={hideTabs}
|
|
||||||
showDetail={showDetail}
|
|
||||||
/>
|
|
||||||
</Box>
|
|
||||||
</Box>
|
|
||||||
)}
|
|
||||||
</Box>
|
|
||||||
</>
|
|
||||||
)}
|
)}
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
const WholeResponseContent = ({
|
export const WholeResponseContent = ({
|
||||||
activeModule,
|
activeModule,
|
||||||
hideTabs,
|
hideTabs,
|
||||||
showDetail
|
showDetail
|
||||||
|
@@ -25,7 +25,7 @@ import { QuestionOutlineIcon } from '@chakra-ui/icons';
|
|||||||
import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
|
import MyTooltip from '@fastgpt/web/components/common/MyTooltip';
|
||||||
import { useRequest2 } from '@fastgpt/web/hooks/useRequest';
|
import { useRequest2 } from '@fastgpt/web/hooks/useRequest';
|
||||||
import { useWorkflowUtils } from '../../hooks/useUtils';
|
import { useWorkflowUtils } from '../../hooks/useUtils';
|
||||||
import { ResponseBox } from '@/components/core/chat/components/WholeResponseModal';
|
import { WholeResponseContent } from '@/components/core/chat/components/WholeResponseModal';
|
||||||
|
|
||||||
type Props = FlowNodeItemType & {
|
type Props = FlowNodeItemType & {
|
||||||
children?: React.ReactNode | React.ReactNode[] | string;
|
children?: React.ReactNode | React.ReactNode[] | string;
|
||||||
@@ -623,9 +623,7 @@ const NodeDebugResponse = React.memo(function NodeDebugResponse({
|
|||||||
{debugResult.message}
|
{debugResult.message}
|
||||||
</Box>
|
</Box>
|
||||||
)}
|
)}
|
||||||
{response && (
|
{response && <WholeResponseContent activeModule={response} showDetail />}
|
||||||
<ResponseBox useMobile={true} response={[response]} showDetail hideTabs />
|
|
||||||
)}
|
|
||||||
</Box>
|
</Box>
|
||||||
</Card>
|
</Card>
|
||||||
)}
|
)}
|
||||||
|
Reference in New Issue
Block a user