Skip to content

S
sdream-ai-fe
Commit 1b59b918 by HoMeTown
Options

feat: 收藏的样式调整

parent cb22ff51
Showing with 58 additions and 22 deletions
src/assets/svg/aicon.svg 0 → 100644
<?xml version="1.0" encoding="UTF-8"?>
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>矩形备份 3</title>
<g id="晓得---PC端页面-草稿" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="晓得-PC端---登录" transform="translate(-518.000000, -208.000000)">
<g id="1" transform="translate(498.000000, 144.000000)">
<g id="A" transform="translate(20.000000, 64.000000)">
<path d="M12,0 C18.627417,-1.21743675e-15 24,5.372583 24,12 L24,21.8181818 C24,23.0231667 23.0231667,24 21.8181818,24 L12,24 C5.372583,24 8.11624501e-16,18.627417 0,12 C-8.11624501e-16,5.372583 5.372583,1.21743675e-15 12,0 Z" id="矩形备份-3" fill="#393D46"></path>
<path d="M8.8185823,18.5454545 L9.83740489,14.8425974 L14.143372,14.8425974 L15.1621946,18.5454545 L18.5454545,18.5454545 L14.6431718,5.45454545 L9.35682819,5.45454545 L5.45454545,18.5454545 L8.8185823,18.5454545 Z M13.5282339,12.5984416 L10.4525431,12.5984416 L11.9711654,7.11896104 L12.0096115,7.11896104 L13.5282339,12.5984416 Z" fill="#FFFFFF" fill-rule="nonzero"></path>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
src/assets/svg/qicon.svg 0 → 100644
<?xml version="1.0" encoding="UTF-8"?>
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>矩形</title>
<g id="晓得---PC端页面-草稿" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="晓得-PC端---登录" transform="translate(-518.000000, -164.000000)">
<g id="1" transform="translate(498.000000, 144.000000)">
<g id="Q" transform="translate(20.000000, 20.000000)">
<path d="M12,0 C18.627417,-1.21743675e-15 24,5.372583 24,12 L24,21.8181818 C24,23.0231667 23.0231667,24 21.8181818,24 L12,24 C5.372583,24 8.11624501e-16,18.627417 0,12 C-8.11624501e-16,5.372583 5.372583,1.21743675e-15 12,0 Z" id="矩形" fill="#29B6FD"></path>
<path d="M16.0398437,19.0909091 C15.7130248,18.3354897 15.4043626,17.6803995 15.113857,17.1256384 C16.2032531,16.6535013 17.047535,15.9305414 17.6467028,14.9567586 C18.2458706,13.9829758 18.5454545,12.8055839 18.5454545,11.4245829 C18.5454545,10.1498127 18.2700794,9.01668369 17.7193292,8.02519578 C17.168579,7.03370787 16.3878452,6.26648508 15.3771277,5.72352741 C14.3664103,5.18056974 13.2437271,4.90909091 12.0090783,4.90909091 C10.7139075,4.90909091 9.56701551,5.1835206 8.56840247,5.73237998 C7.56978943,6.28123936 6.80116001,7.05141301 6.26251418,8.04290092 C5.72386836,9.03438883 5.45454545,10.1616162 5.45454545,11.4245829 C5.45454545,12.7111565 5.71781616,13.8295313 6.24435758,14.7797072 C6.770899,15.7298831 7.53347623,16.4646465 8.53208927,16.9839973 C9.53070231,17.5033481 10.6896987,17.7630235 12.0090783,17.7630235 C12.1785399,17.7630235 12.4024713,17.7512201 12.6808725,17.7276132 C12.8624385,18.0699126 13.0863699,18.5243446 13.3526668,19.0909091 L13.3526668,19.0909091 L16.0398437,19.0909091 Z M12.0090783,15.567586 C11.2586055,15.567586 10.61102,15.3934854 10.066322,15.0452843 C9.52162401,14.6970832 9.09494389,14.2131427 8.78628168,13.5934627 C8.47761947,12.9737828 8.32328836,12.2508228 8.32328836,11.4245829 C8.32328836,10.6337533 8.48064557,9.91079333 8.79535998,9.2557031 C9.11007439,8.60061287 9.53978061,8.06945863 10.0844786,7.66224038 C10.6291766,7.25502213 11.2586055,7.05141301 11.9727651,7.05141301 C12.7353423,7.05141301 13.3920061,7.2638747 13.9427563,7.68879809 C14.4935065,8.11372148 14.9171605,8.65372829 15.2137183,9.30881852 C15.5102761,9.96390875 15.658555,10.6691635 15.658555,11.4245829 C15.658555,12.2508228 15.5042239,12.9737828 15.1955617,13.5934627 C14.8868995,14.2131427 14.4632455,14.6970832 13.9245997,15.0452843 C13.3859539,15.3934854 12.7474467,15.567586 12.0090783,15.567586 Z" stroke="#FFFFFF" fill="#FFFFFF" fill-rule="nonzero"></path>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
src/pages/Collect/Collect.tsx
import { useEffect, useState } from 'react'
import { Button, Modal, ModalBody, ModalContent, ModalFooter, ModalHeader, Spinner, Tooltip } from '@nextui-org/react'
import ReactMarkdown from 'react-markdown'
import rehypeRaw from 'rehype-raw'
import rehypeSanitize from 'rehype-sanitize'
import remarkGfm from 'remark-gfm'
import { motion } from 'framer-motion'
import { ChatMaskBar } from '../Chat/components/ChatMaskBar'
import { ChatSlogan } from '../Chat/components/ChatSlogan'
......@@ -16,6 +12,9 @@ import DeleteIcon from '@/assets/svg/delete.svg?react'
import type { Answer } from '@/types/chat'
import useToast from '@/hooks/useToast'
import { fetchDelCollection } from '@/api/chat'
import { MarkdownDetail } from '@/components/MarkdownDetail'
import AIcon from '@/assets/svg/aicon.svg?react'
import QIcon from '@/assets/svg/qicon.svg?react'
export const Collect: React.FC = () => {
const [isLoading, setIsLoading] = useState(false)
......@@ -104,26 +103,33 @@ export const Collect: React.FC = () => {
>
{
collectList.map((item: any, index: number) => (
<div className="w-full max-w-[1000px] mx-auto bg-white rounded-[20px] box-border px-[24px] py-[20px]" key={`${item.collectionId}_${index}`}>
<ReactMarkdown
rehypePlugins={[rehypeRaw, rehypeSanitize]}
remarkPlugins={[remarkGfm]}
className="markdown-content"
>
{formatMarkdown(item.answer || '')}
</ReactMarkdown>
{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]">
{item.collectionTime}
<div className="text-[#27353C] w-full max-w-[1000px] mx-auto bg-white rounded-[20px] box-border px-[24px] py-[20px]" key={`${item.collectionId}_${index}`}>
<div className="flex mb-[20px]">
<div className="mr-[20px]"><QIcon /></div>
<div className="font-bold text-[16px]">{item.question}</div>
</div>
<div className="flex">
<div className="mr-[20px]">
<AIcon />
</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>
<MarkdownDetail>
{formatMarkdown(item.answer || '')}
</MarkdownDetail>
{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]">
{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>
</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