20 lines
1.3 KiB
TypeScript
20 lines
1.3 KiB
TypeScript
|
import { Avatar, Button, Layout, Space, Typography } from '@arco-design/web-react'
|
||
|
|
import { IconApps, IconCalendar, IconCheckCircleFill, IconMessage, IconRobot, IconSettings, IconStorage, IconThunderbolt, IconUserGroup } from '@arco-design/web-react/icon'
|
||
|
|
|
||
|
|
const { Footer } = Layout
|
||
|
|
const { Text } = Typography
|
||
|
|
|
||
|
|
export function ProjectStatusbar() {
|
||
|
|
return (
|
||
|
|
<Footer className="statusbar">
|
||
|
|
<div className="status-user"><Avatar size={26} style={{ backgroundColor: '#165DFF' }}>张</Avatar><div><Text className="status-name">张明</Text><Text className="status-online">在线</Text></div><Button type="text" icon={<IconUserGroup />}>好友</Button><Button type="text" icon={<IconMessage />}>私信</Button><Button type="text" icon={<IconSettings />}>设置</Button></div>
|
||
|
|
<Space className="status-tasks" size={28}><span><IconCheckCircleFill /> 同步完成</span><span><IconInteractionFallback /> 3 个任务进行中</span><span><IconRobot /> AI 队列空闲</span><span><IconThunderbolt /> 本地草稿已保存</span></Space>
|
||
|
|
<Space className="status-system" size={24}><span><IconStorage /> 系统存储 152GB 可用</span><span>系统健康 <b>正常</b></span><IconApps /></Space>
|
||
|
|
</Footer>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|
||
|
|
function IconInteractionFallback() {
|
||
|
|
return <IconCalendar />
|
||
|
|
}
|