Connect React workspace to backend data

apps/senlinai-acro-react/src/pages/projects/project-tasks.tsx

@@ -1,23 +1,18 @@
 import { Button, Card, Progress, Space, Tag, Typography } from '@arco-design/web-react'
 import { IconCalendar, IconCheckCircle, IconPlus, IconUser } from '@arco-design/web-react/icon'
-import { tasks } from './project-data'
-import type { Project } from './project-types'
+import type { ProjectWorkspace, TaskItem } from './project-types'
 
 const { Title, Text } = Typography
 
-const lanes = [
-  { title: '待开始', color: 'gray', items: ['权限边界确认', '客户案例素材整理'] },
-  { title: '进行中', color: 'arcoblue', items: tasks.map((task) => task.title) },
-  { title: '已完成', color: 'green', items: ['项目模板初始化', '会议纪要归档'] },
-]
-
-export function ProjectTasks({ activeProject, onSelectItem }: { activeProject: Project; onSelectItem: (title: string) => void }) {
+export function ProjectTasks({ activeWorkspace, onSelectItem }: { activeWorkspace: ProjectWorkspace; onSelectItem: (title: string) => void }) {
+  const { tasks, project } = activeWorkspace
+  const lanes = makeLanes(tasks)
   return (
     <div className="project-channel-page project-tasks-page overview-page">
       <div className="overview-head">
         <div>
           <Title heading={4}>工作计划</Title>
-          <Text type="secondary">{activeProject.name} 的 TODO 计划、负责人和截止时间。</Text>
+          <Text type="secondary">{project.name} 的 TODO 计划、负责人和截止时间。</Text>
         </div>
         <Button type="primary" icon={<IconPlus />}>新建任务</Button>
       </div>
@@ -59,3 +54,13 @@ export function ProjectTasks({ activeProject, onSelectItem }: { activeProject: P
     </div>
   )
 }
+
+function makeLanes(tasks: TaskItem[]) {
+  const done = tasks.filter((task) => task.completed)
+  const active = tasks.filter((task) => !task.completed)
+  return [
+    { title: '待开始', color: 'gray', items: active.slice(0, 1).map((task) => task.title) },
+    { title: '进行中', color: 'arcoblue', items: active.map((task) => task.title) },
+    { title: '已完成', color: 'green', items: done.length ? done.map((task) => task.title) : ['暂无已完成任务'] },
+  ]
+}