fix: 聊天侧边栏未滚动

This commit is contained in:
Archer
2023-03-17 22:06:43 +08:00
parent d85b4c0945
commit e6c9ca540a
3 changed files with 76 additions and 88 deletions

View File

@@ -45,12 +45,12 @@ const Navbar = ({
flexDirection={'column'} flexDirection={'column'}
alignItems={'center'} alignItems={'center'}
justifyContent={'center'} justifyContent={'center'}
onClick={() => onClick={() => {
!item.activeLink.includes(router.pathname) && if (item.link === router.pathname) return;
router.push(item.link, undefined, { router.push(item.link, undefined, {
shallow: true shallow: true
}) });
} }}
cursor={'pointer'} cursor={'pointer'}
fontSize={'sm'} fontSize={'sm'}
w={'60px'} w={'60px'}

View File

@@ -57,6 +57,7 @@ const NavbarPhone = ({
alignItems={'center'} alignItems={'center'}
justifyContent={'center'} justifyContent={'center'}
onClick={() => { onClick={() => {
if (item.link === router.pathname) return;
router.push(item.link); router.push(item.link);
onClose(); onClose();
}} }}

View File

@@ -80,29 +80,7 @@ const SlideBar = ({
<Box flex={'1 0 0'} w={0} className="textEllipsis"> <Box flex={'1 0 0'} w={0} className="textEllipsis">
{item.title} {item.title}
</Box> </Box>
{/* <Input
flex={'1 0 0'}
w={0}
value={item.title}
variant={'unstyled'}
disabled={editHistoryId !== item.windowId}
opacity={'1 !important'}
cursor={`${editHistoryId !== item.windowId ? 'pointer' : 'text'} !important`}
onChange={(e) => {
updateChatHistory(item.windowId, e.target.value);
}}
/> */}
<Box> <Box>
{/* <IconButton
icon={<EditIcon />}
variant={'unstyled'}
aria-label={'edit'}
size={'xs'}
onClick={(e) => {
console.log(e);
setEditHistoryId(item.windowId);
}}
/> */}
<IconButton <IconButton
icon={<DeleteIcon />} icon={<DeleteIcon />}
variant={'unstyled'} variant={'unstyled'}
@@ -120,7 +98,14 @@ const SlideBar = ({
); );
return ( return (
<Box w={'100%'} h={'100%'} p={3} backgroundColor={'blackAlpha.800'} color={'white'}> <Flex
flexDirection={'column'}
w={'100%'}
h={'100%'}
p={3}
backgroundColor={'blackAlpha.800'}
color={'white'}
>
{/* 新对话 */} {/* 新对话 */}
<Button <Button
w={'100%'} w={'100%'}
@@ -133,67 +118,69 @@ const SlideBar = ({
</Button> </Button>
{/* 我的模型 & 历史记录 折叠框*/} {/* 我的模型 & 历史记录 折叠框*/}
{isSuccess ? ( <Box flex={'1 0 0'} h={0} overflowY={'auto'}>
<Accordion defaultIndex={[0]} allowToggle> {isSuccess ? (
<AccordionItem borderTop={0} borderBottom={0}> <Accordion defaultIndex={[0]} allowToggle>
<AccordionButton borderRadius={'md'} pl={1}> <AccordionItem borderTop={0} borderBottom={0}>
<Box as="span" flex="1" textAlign="left"> <AccordionButton borderRadius={'md'} pl={1}>
<Box as="span" flex="1" textAlign="left">
</Box>
<AccordionIcon /> </Box>
</AccordionButton> <AccordionIcon />
<AccordionPanel pb={0} px={0}> </AccordionButton>
{hasReady && <RenderHistory />} <AccordionPanel pb={0} px={0}>
</AccordionPanel> {hasReady && <RenderHistory />}
</AccordionItem> </AccordionPanel>
<AccordionItem borderTop={0} borderBottom={0}> </AccordionItem>
<AccordionButton borderRadius={'md'} pl={1}> <AccordionItem borderTop={0} borderBottom={0}>
<Box as="span" flex="1" textAlign="left"> <AccordionButton borderRadius={'md'} pl={1}>
<Box as="span" flex="1" textAlign="left">
</Box>
<AccordionIcon /> </Box>
</AccordionButton> <AccordionIcon />
<AccordionPanel pb={4} px={0}> </AccordionButton>
{myModels.map((item) => ( <AccordionPanel pb={4} px={0}>
<Flex {myModels.map((item) => (
key={item._id} <Flex
alignItems={'center'} key={item._id}
p={3} alignItems={'center'}
borderRadius={'md'} p={3}
mb={2} borderRadius={'md'}
cursor={'pointer'} mb={2}
_hover={{ cursor={'pointer'}
backgroundColor: 'rgba(255,255,255,0.1)' _hover={{
}} backgroundColor: 'rgba(255,255,255,0.1)'
fontSize={'xs'} }}
border={'1px solid transparent'} fontSize={'xs'}
{...(item.name === name border={'1px solid transparent'}
? { {...(item.name === name
borderColor: 'rgba(255,255,255,0.5)', ? {
backgroundColor: 'rgba(255,255,255,0.1)' borderColor: 'rgba(255,255,255,0.5)',
} backgroundColor: 'rgba(255,255,255,0.1)'
: {})} }
onClick={async () => { : {})}
if (item.name === name) return; onClick={async () => {
router.push( if (item.name === name) return;
`/chat?chatId=${await generateChatWindow(item._id)}&timeStamp=${Date.now()}` router.push(
); `/chat?chatId=${await generateChatWindow(item._id)}&timeStamp=${Date.now()}`
onClose(); );
}} onClose();
> }}
<ChatIcon mr={2} /> >
<Box className={'textEllipsis'} flex={'1 0 0'} w={0}> <ChatIcon mr={2} />
{item.name} <Box className={'textEllipsis'} flex={'1 0 0'} w={0}>
</Box> {item.name}
</Flex> </Box>
))} </Flex>
</AccordionPanel> ))}
</AccordionItem> </AccordionPanel>
</Accordion> </AccordionItem>
) : ( </Accordion>
<RenderHistory /> ) : (
)} <RenderHistory />
</Box> )}
</Box>
</Flex>
); );
}; };