Skip to content

S
sdream-ai-fe
Commit 7a829213 by HoMeTown
Options

feat: history empty status

parent 6116c8f8
Showing with 163 additions and 30 deletions
src/assets/svg/empty.svg 0 → 100644
<?xml version="1.0" encoding="UTF-8"?>
<svg width="120px" height="120px" viewBox="0 0 120 120" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>矩形</title>
<defs>
<rect id="path-1" x="0" y="0" width="120" height="120"></rect>
<ellipse id="path-3" cx="60" cy="12" rx="60" ry="12"></ellipse>
<linearGradient x1="14.0746181%" y1="77.5732858%" x2="44.9791473%" y2="77.5732858%" id="linearGradient-5">
<stop stop-color="#ADE4FF" stop-opacity="0" offset="0%"></stop>
<stop stop-color="#C4ECFF" offset="63.6295345%"></stop>
<stop stop-color="#3FBCFB" offset="100%"></stop>
</linearGradient>
<filter x="-5.7%" y="-42.9%" width="111.3%" height="185.7%" filterUnits="objectBoundingBox" id="filter-6">
<feGaussianBlur stdDeviation="1.6" in="SourceGraphic"></feGaussianBlur>
</filter>
<linearGradient x1="50%" y1="28.9798328%" x2="50%" y2="100%" id="linearGradient-7">
<stop stop-color="#1989F5" offset="0%"></stop>
<stop stop-color="#004499" offset="100%"></stop>
</linearGradient>
<path d="M8.48821558,0 L59.5117844,0 C60.559976,1.71221528e-15 61.5321585,0.54708454 62.076147,1.4430656 L68,11.2 L68,11.2 L0,11.2 L5.92385303,1.4430656 C6.46784153,0.54708454 7.44002402,2.89988763e-15 8.48821558,0 Z" id="path-8"></path>
<linearGradient x1="50%" y1="0%" x2="50%" y2="41.1230266%" id="linearGradient-10">
<stop stop-color="#4CB6FF" offset="0%"></stop>
<stop stop-color="#006FDB" offset="100%"></stop>
</linearGradient>
<linearGradient x1="50%" y1="45.7499266%" x2="50%" y2="100%" id="linearGradient-11">
<stop stop-color="#E0F5FF" offset="0%"></stop>
<stop stop-color="#C6ECFF" offset="53.1299511%"></stop>
<stop stop-color="#9EDEFF" offset="100%"></stop>
</linearGradient>
<path d="M6,0 L34.8,0 C38.1137085,-6.08718376e-16 40.8,2.6862915 40.8,6 L40.8,19.6 C40.8,22.9137085 38.1137085,25.6 34.8,25.6 L24.4,25.6 L24.4,25.6 L21.8142136,28.1857864 C21.033165,28.966835 19.766835,28.966835 18.9857864,28.1857864 L16.4,25.6 L16.4,25.6 L6,25.6 C2.6862915,25.6 -2.97227892e-14,22.9137085 0,19.6 L0,6 C-4.05812251e-16,2.6862915 2.6862915,6.08718376e-16 6,0 Z" id="path-12"></path>
<filter x="-26.8%" y="-33.3%" width="153.6%" height="164.4%" filterUnits="objectBoundingBox" id="filter-14">
<feGaussianBlur stdDeviation="4" in="SourceGraphic"></feGaussianBlur>
</filter>
<linearGradient x1="50%" y1="61.8646155%" x2="50%" y2="100%" id="linearGradient-15">
<stop stop-color="#E7F7FF" offset="0%"></stop>
<stop stop-color="#D4F0FF" offset="49.39588%"></stop>
<stop stop-color="#B8E7FF" offset="100%"></stop>
</linearGradient>
<path d="M55.4,36 L84.2,36 C88.618278,36 92.2,39.581722 92.2,44 L92.2,60 C92.2,64.418278 88.618278,68 84.2,68 L73.8,68 L73.8,68 L71.2142136,70.5857864 C70.433165,71.366835 69.166835,71.366835 68.3857864,70.5857864 L65.8,68 L65.8,68 L55.4,68 C50.981722,68 47.4,64.418278 47.4,60 L47.4,44 C47.4,39.581722 50.981722,36 55.4,36 Z" id="path-16"></path>
<filter x="-2.2%" y="-2.8%" width="104.5%" height="103.3%" filterUnits="objectBoundingBox" id="filter-17">
<feGaussianBlur stdDeviation="0.5" in="SourceAlpha" result="shadowBlurInner1"></feGaussianBlur>
<feOffset dx="0" dy="1" in="shadowBlurInner1" result="shadowOffsetInner1"></feOffset>
<feComposite in="shadowOffsetInner1" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1" result="shadowInnerInner1"></feComposite>
<feColorMatrix values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.497311892 0" type="matrix" in="shadowInnerInner1"></feColorMatrix>
</filter>
<linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-18">
<stop stop-color="#29B6FD" offset="0%"></stop>
<stop stop-color="#2981FD" offset="100%"></stop>
</linearGradient>
<linearGradient x1="50%" y1="39.1833423%" x2="35.7698928%" y2="53.6173481%" id="linearGradient-19">
<stop stop-color="#C0E9FF" offset="0%"></stop>
<stop stop-color="#82C2FF" offset="62.4028116%"></stop>
<stop stop-color="#3C8DFD" offset="100%"></stop>
</linearGradient>
<path d="M27.5516862,75.2 L92.4483138,75.2 C93.3319694,75.2 94.0483138,75.9163444 94.0483138,76.8 C94.0483138,76.9053632 94.0379063,77.0104687 94.0172428,77.1137858 L89.0289713,102.055143 C88.4306684,105.046658 85.8040136,107.2 82.753255,107.2 L37.246745,107.2 C34.1959864,107.2 31.5693316,105.046658 30.9710287,102.055143 L25.9827572,77.1137858 C25.809458,76.2472902 26.3714048,75.40437 27.2379004,75.2310709 C27.3412175,75.2104075 27.4463231,75.2 27.5516862,75.2 Z" id="path-20"></path>
<filter x="-3.1%" y="-7.8%" width="106.2%" height="115.6%" filterUnits="objectBoundingBox" id="filter-21">
<feGaussianBlur stdDeviation="1.5" in="SourceAlpha" result="shadowBlurInner1"></feGaussianBlur>
<feOffset dx="-2" dy="0" in="shadowBlurInner1" result="shadowOffsetInner1"></feOffset>
<feComposite in="shadowOffsetInner1" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1" result="shadowInnerInner1"></feComposite>
<feColorMatrix values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.596355305 0" type="matrix" in="shadowInnerInner1" result="shadowMatrixInner1"></feColorMatrix>
<feGaussianBlur stdDeviation="1" in="SourceAlpha" result="shadowBlurInner2"></feGaussianBlur>
<feOffset dx="0" dy="1" in="shadowBlurInner2" result="shadowOffsetInner2"></feOffset>
<feComposite in="shadowOffsetInner2" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1" result="shadowInnerInner2"></feComposite>
<feColorMatrix values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.395767319 0" type="matrix" in="shadowInnerInner2" result="shadowMatrixInner2"></feColorMatrix>
<feMerge>
<feMergeNode in="shadowMatrixInner1"></feMergeNode>
<feMergeNode in="shadowMatrixInner2"></feMergeNode>
</feMerge>
</filter>
</defs>
<g id="晓得---PC端页面-草稿" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="晓得-PC端---历史对话-空" transform="translate(-146.000000, -462.000000)">
<g id="编组-2" transform="translate(80.000000, 152.000000)">
<g id="编组-10" transform="translate(66.000000, 310.000000)">
<mask id="mask-2" fill="white">
<use xlink:href="#path-1"></use>
</mask>
<g id="矩形"></g>
<g id="矩形" mask="url(#mask-2)">
<g transform="translate(0.000000, 96.000000)">
<mask id="mask-4" fill="white">
<use xlink:href="#path-3"></use>
</mask>
<use id="蒙版" stroke="none" fill-opacity="0.06" fill="#29B6FD" fill-rule="evenodd" xlink:href="#path-3"></use>
<rect id="矩形" stroke="none" fill="url(#linearGradient-5)" fill-rule="evenodd" filter="url(#filter-6)" mask="url(#mask-4)" x="0" y="0" width="84.8" height="11.2"></rect>
</g>
</g>
<g id="路径" mask="url(#mask-2)">
<g transform="translate(26.000000, 65.600000)">
<mask id="mask-9" fill="white">
<use xlink:href="#path-8"></use>
</mask>
<use id="蒙版" stroke="none" fill="url(#linearGradient-7)" fill-rule="evenodd" xlink:href="#path-8"></use>
<polygon id="路径" stroke="none" fill="url(#linearGradient-10)" fill-rule="evenodd" mask="url(#mask-9)" points="61.2 -2.27373675e-13 58 25.6 11.5 25.6 6.8 -2.27373675e-13"></polygon>
</g>
</g>
<g id="矩形备份-6" mask="url(#mask-2)">
<g transform="translate(31.800000, 45.600000)">
<mask id="mask-13" fill="white">
<use xlink:href="#path-12"></use>
</mask>
<use id="蒙版" stroke="none" fill="url(#linearGradient-11)" fill-rule="evenodd" xlink:href="#path-12"></use>
<path d="M21.6,-5.6 L50.4,-5.6 C54.818278,-5.6 58.4,-2.018278 58.4,2.4 L58.4,18.4 C58.4,22.818278 54.818278,26.4 50.4,26.4 L40,26.4 L40,26.4 L37.4142136,28.9857864 C36.633165,29.766835 35.366835,29.766835 34.5857864,28.9857864 L32,26.4 L32,26.4 L21.6,26.4 C17.181722,26.4 13.6,22.818278 13.6,18.4 L13.6,2.4 C13.6,-2.018278 17.181722,-5.6 21.6,-5.6 Z" id="矩形备份-6" stroke="none" fill-opacity="0.6" fill="#55BCF0" fill-rule="evenodd" filter="url(#filter-14)" mask="url(#mask-13)"></path>
</g>
</g>
<g id="矩形备份-6" mask="url(#mask-2)">
<use fill="url(#linearGradient-15)" fill-rule="evenodd" xlink:href="#path-16"></use>
<use fill="black" fill-opacity="1" filter="url(#filter-17)" xlink:href="#path-16"></use>
</g>
<rect id="矩形" fill-opacity="0.5981138" fill="#29B6FD" mask="url(#mask-2)" x="53.8" y="46" width="22.4" height="4" rx="2"></rect>
<rect id="矩形备份-7" fill-opacity="0.5981138" fill="#29B6FD" mask="url(#mask-2)" x="53.8" y="54" width="12.8" height="4" rx="2"></rect>
<g id="矩形" mask="url(#mask-2)">
<use fill="url(#linearGradient-18)" fill-rule="evenodd" xlink:href="#path-20"></use>
<use fill="black" fill-opacity="1" filter="url(#filter-21)" xlink:href="#path-20"></use>
<path stroke="url(#linearGradient-19)" stroke-width="0.5" d="M92.4483138,75.45 C92.821106,75.45 93.158606,75.6011039 93.4029079,75.8454058 C93.6420471,76.084545 93.7918856,76.4129847 93.7981119,76.7764133 L93.7981119,76.7764133 L88.7838262,102.006114 C88.4963603,103.443444 87.7216146,104.679415 86.6522868,105.556054 C85.582959,106.432693 84.2190492,106.95 82.753255,106.95 L82.753255,106.95 L37.246745,106.95 C35.7809508,106.95 34.417041,106.432693 33.3477132,105.556054 C32.2783854,104.679415 31.5036397,103.443444 31.2161738,102.006114 L31.2161738,102.006114 L26.2279023,77.0647568 C26.1547918,76.6992039 26.2367721,76.3386241 26.4284183,76.0511547 C26.6159993,75.7697833 26.9086429,75.5584536 27.263754,75.4810586 L27.263754,75.4810586 Z" stroke-linejoin="square"></path>
</g>
<rect id="矩形" stroke="#51BDFE" stroke-width="0.5" fill="#004CAC" mask="url(#mask-2)" x="49.05" y="83.45" width="21.9" height="4.3" rx="2.15"></rect>
<path d="M100.749684,0 C101.292309,9.84937585 97.4460316,16.285766 89.2108524,19.3091704 C76.8580836,23.8442769 86.4152576,15.0235114 93.5824709,12.6662782 C100.749684,10.309045 94.3334877,20.7779477 83.4897919,28.7578812" id="路径-3" stroke-opacity="0.299639935" stroke="#75CFFD" stroke-width="0.5" mask="url(#mask-2)"></path>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
src/layouts/HistoryBar/components/HistoryBarList/index.tsx
import { motion } from 'framer-motion' import { motion } from 'framer-motion'
import { Button } from '@nextui-org/react' import { Button } from '@nextui-org/react'
import { containerVariants, itemVariants } from '../../motionAnimate' import { containerVariants, itemVariants } from '../../motionAnimate'
import EmptyIcon from '@/assets/svg/empty.svg?react'
import { useAppSelector } from '@/store/hook' import { useAppSelector } from '@/store/hook'
export const HistoryBarList: React.FC = () => { export const HistoryBarList: React.FC = () => {
const { conversations } = useAppSelector(state => state.conversation) const { conversations } = useAppSelector(state => state.conversation)
return ( return (
<motion.ul conversations.length !== 0
variants={containerVariants} ? (
initial="hidden" <motion.ul
animate="visible" variants={containerVariants}
className="w-full flex flex-col gap-[6px]"
>
{
conversations.map((item, index) => (
<motion.li
key={`${item.conversationId}-${index}`}
custom={index}
variants={itemVariants}
initial="hidden" initial="hidden"
animate="visible" animate="visible"
exit="exit" className="w-full flex flex-col gap-[6px]"
layout
> >
{ {
item.conversationId conversations.map((item, index) => (
? ( <motion.li
<Button color="primary" variant="light" className="text-left w-full text-[#333] rounded-[23px] data-[hover=true]:bg-[#E5F6FF] data-[hover=true]:text-primary"> key={`${item.conversationId}-${index}`}
<div className="w-full text-nowrap text-ellipsis overflow-hidden"> custom={index}
<span>{item.conversationTitle}</span> variants={itemVariants}
</div> initial="hidden"
</Button> animate="visible"
) exit="exit"
: ( layout
<div className="mt-[32px] text-[13px] text-[#B1C6D2]">{item.conversationTitle}</div> >
) {
} item.conversationId
? (
<Button color="primary" variant="light" className="text-left w-full text-[#333] rounded-[23px] data-[hover=true]:bg-[#E5F6FF] data-[hover=true]:text-primary">
<div className="w-full text-nowrap text-ellipsis overflow-hidden">
<span>{item.conversationTitle}</span>
</div>
</Button>
)
: (
<div className="mt-[32px] text-[13px] text-[#B1C6D2]">{item.conversationTitle}</div>
)
}
</motion.li> </motion.li>
)) ))
} }
</motion.ul> </motion.ul>
)
: (
<div className="flex w-full h-full items-center justify-center flex-col">
<EmptyIcon />
<p className="text-[13px] text-[#27353C] mt-[16px]">暂无历史对话</p>
</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