93 lines
3.8 KiB
TypeScript
93 lines
3.8 KiB
TypeScript
|
import { Card, Empty, Grid, Space, Tag, Typography } from '@arco-design/web-react'
|
|||
|
|
import {
|
|||
|
|
IconCalendar,
|
|||
|
|
IconCheckCircleFill,
|
|||
|
|
IconDashboard,
|
|||
|
|
IconFile,
|
|||
|
|
IconRobot,
|
|||
|
|
} from '@arco-design/web-react/icon'
|
|||
|
|
import type { Project, ProjectWorkspace } from './projects/project-types'
|
|||
|
|
|
|||
|
|
const { Row, Col } = Grid
|
|||
|
|
const { Title, Text, Paragraph } = Typography
|
|||
|
|
|
|||
|
|
export function WorkspacePage({ workspaces, onOpenTask }: { workspaces: ProjectWorkspace[]; onOpenTask: (project: Project, taskID: string) => void }) {
|
|||
|
|
const projects = workspaces.map((workspace) => workspace.project)
|
|||
|
|
const unfinishedTasks = workspaces.flatMap((workspace) =>
|
|||
|
|
workspace.tasks
|
|||
|
|
.filter((task) => !task.completed)
|
|||
|
|
.map((task) => ({
|
|||
|
|
...task,
|
|||
|
|
project: workspace.project,
|
|||
|
|
})),
|
|||
|
|
)
|
|||
|
|
const aiSessions = workspaces.flatMap((workspace) => workspace.aiSessions)
|
|||
|
|
const notes = workspaces.flatMap((workspace) => workspace.notes)
|
|||
|
|
const urgentProjects = projects.filter((project) => project.urgent).length
|
|||
|
|
const workspaceMetrics = [
|
|||
|
|
{ title: '项目总数', value: projects.length, delta: `${urgentProjects} 个高优先级`, icon: <IconDashboard />, color: 'arcoblue' },
|
|||
|
|
{ title: '未完成任务', value: unfinishedTasks.length, delta: '跨项目聚合', icon: <IconCheckCircleFill />, color: 'green' },
|
|||
|
|
{ title: 'AI 会话', value: aiSessions.length, delta: '项目内上下文', icon: <IconRobot />, color: 'purple' },
|
|||
|
|
{ title: '知识资料', value: notes.length, delta: '笔记与资料合计', icon: <IconFile />, color: 'cyan' },
|
|||
|
|
]
|
|||
|
|
|
|||
|
|
return (
|
|||
|
|
<div className="workspace-page overview-page">
|
|||
|
|
<div className="overview-head">
|
|||
|
|
<div>
|
|||
|
|
<Title heading={4}>工作台</Title>
|
|||
|
|
<Text type="secondary">所有项目的统一工作台，汇总项目任务、AI 会话和知识资产。</Text>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<Row gutter={12} className="metric-row">
|
|||
|
|
{workspaceMetrics.map((metric) => (
|
|||
|
|
<Col span={24 / workspaceMetrics.length} key={metric.title}>
|
|||
|
|
<Card className="metric-card" bordered>
|
|||
|
|
<Space align="start">
|
|||
|
|
<Tag color={metric.color}>{metric.icon}</Tag>
|
|||
|
|
<div>
|
|||
|
|
<Text type="secondary">{metric.title}</Text>
|
|||
|
|
<Title heading={3}>{metric.value}</Title>
|
|||
|
|
<Text className="metric-delta">{metric.delta}</Text>
|
|||
|
|
</div>
|
|||
|
|
</Space>
|
|||
|
|
</Card>
|
|||
|
|
</Col>
|
|||
|
|
))}
|
|||
|
|
</Row>
|
|||
|
|
|
|||
|
|
<Card className="queue-section" bordered>
|
|||
|
|
<div className="section-header">
|
|||
|
|
<Title heading={6}>未完成的任务</Title>
|
|||
|
|
<Tag color="arcoblue">{unfinishedTasks.length}</Tag>
|
|||
|
|
</div>
|
|||
|
|
{unfinishedTasks.length ? (
|
|||
|
|
<div className="workspace-task-list">
|
|||
|
|
{unfinishedTasks.map((task) => (
|
|||
|
|
<button key={`${task.project.id}-${task.id}`} className="workspace-task-card" onClick={() => onOpenTask(task.project, task.id)}>
|
|||
|
|
<div className="workspace-task-main">
|
|||
|
|
<span className="workspace-task-title">
|
|||
|
|
<IconCheckCircleFill />
|
|||
|
|
{task.title}
|
|||
|
|
</span>
|
|||
|
|
<Paragraph ellipsis={{ rows: 2 }} type="secondary">
|
|||
|
|
{task.summary || '暂无任务说明'}
|
|||
|
|
</Paragraph>
|
|||
|
|
</div>
|
|||
|
|
<div className="workspace-task-meta">
|
|||
|
|
<Tag color={task.project.urgent ? 'red' : 'arcoblue'}>{task.project.name}</Tag>
|
|||
|
|
<span><IconCalendar /> {task.createdAt}</span>
|
|||
|
|
<Tag color="green">{task.tag}</Tag>
|
|||
|
|
</div>
|
|||
|
|
</button>
|
|||
|
|
))}
|
|||
|
|
</div>
|
|||
|
|
) : (
|
|||
|
|
<Empty description="暂无未完成任务" />
|
|||
|
|
)}
|
|||
|
|
</Card>
|
|||
|
|
</div>
|
|||
|
|
)
|
|||
|
|
}
|