Skip to content

S
sdream-ai-fe
Commit 9bef3d84 by HoMeTown
Options

feat: 收藏的样式

parent 8ea0a622
Showing with 42 additions and 33 deletions
src/pages/Collect/Collect.tsx
...@@ -87,41 +87,50 @@ export const Collect: React.FC = () => { ...@@ -87,41 +87,50 @@ export const Collect: React.FC = () => {
<ChatMaskBar /> <ChatMaskBar />
<div className="content h-full overflow-y-auto"> <div className="content h-full overflow-y-auto">
<motion.div <motion.div
initial={{ opacity: 0, y: -10 }}
animate={{ opacity: 1, y: 0 }}
transition={{
duration: 0.3,
opacity: { duration: 0.1 },
}}
className={`${styles.collectScrollable} scrollbar-hide`} className={`${styles.collectScrollable} scrollbar-hide`}
> >
<div className={`${styles.inter} gap-[32px]`}> <div className={`${styles.inter}`}>
{ {
collectList.map((item: any, index: number) => ( collectList.length !== 0 && (
<div className="w-full max-w-[1000px] mx-auto bg-white rounded-[20px] box-border px-[24px] py-[20px]" key={`${item.collectionId}_${index}`}> <motion.div
<ReactMarkdown initial={{ opacity: 0, y: -10 }}
rehypePlugins={[rehypeRaw, rehypeSanitize]} animate={{ opacity: 1, y: 0 }}
remarkPlugins={[remarkGfm]} transition={{
className="markdown-content" duration: 0.3,
> opacity: { duration: 0.1 },
{formatMarkdown(item.answer || '')} }}
</ReactMarkdown> className="flex flex-col gap-[24px]"
{item.attachmentList && item.attachmentList?.length !== 0 && <ChatAnswerAttachment answer={item} />} >
<div className="mt-[12px] flex gap-[4px] justify-between items-center"> {
<div className="text-12px text-[#B2B8C1]"> collectList.map((item: any, index: number) => (
{item.collectionTime} <div className="w-full max-w-[1000px] mx-auto bg-white rounded-[20px] box-border px-[24px] py-[20px]" key={`${item.collectionId}_${index}`}>
</div> <ReactMarkdown
<div> rehypePlugins={[rehypeRaw, rehypeSanitize]}
<Tooltip color="foreground" content="复制" className="capitalize"> remarkPlugins={[remarkGfm]}
<Button variant="light" isIconOnly aria-label="CopyIcon" onClick={() => handleCopy(item)}><CopyIcon /></Button> className="markdown-content"
</Tooltip> >
<Tooltip color="foreground" content="删除" className="capitalize"> {formatMarkdown(item.answer || '')}
<Button variant="light" isIconOnly aria-label="DeleteIcon" onClick={() => handleDelete(item)}><DeleteIcon /></Button> </ReactMarkdown>
</Tooltip> {item.attachmentList && item.attachmentList?.length !== 0 && <ChatAnswerAttachment answer={item} />}
</div> <div className="mt-[12px] flex gap-[4px] justify-between items-center">
</div> <div className="text-12px text-[#B2B8C1]">
</div> {item.collectionTime}
)) </div>
<div>
<Tooltip color="foreground" content="复制" className="capitalize">
<Button variant="light" isIconOnly aria-label="CopyIcon" onClick={() => handleCopy(item)}><CopyIcon /></Button>
</Tooltip>
<Tooltip color="foreground" content="删除" className="capitalize">
<Button variant="light" isIconOnly aria-label="DeleteIcon" onClick={() => handleDelete(item)}><DeleteIcon /></Button>
</Tooltip>
</div>
</div>
</div>
))
}
</motion.div>
)
} }
{isLoading && <div className="w-full flex justify-center"><Spinner /></div>} {isLoading && <div className="w-full flex justify-center"><Spinner /></div>}
{ {
...@@ -135,7 +144,7 @@ export const Collect: React.FC = () => { ...@@ -135,7 +144,7 @@ export const Collect: React.FC = () => {
} }
{ {
collectList.length === total && collectList.length !== 0 && ( collectList.length === total && collectList.length !== 0 && (
<div className="w-full max-w-[1000px] mx-auto flex justify-center text-[#8D9795]">到底啦~</div> <div className="w-full mt-[24px] max-w-[1000px] mx-auto flex justify-center text-[#8D9795]">到底啦~</div>
) )
} }
</div> </div>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment