feat: complete project workspace tags and notes UI

apps/senlinai-acro-react/src/pages/workspace-explore.tsx

@@ -0,0 +1,116 @@
+import { Button, Card, Empty, Grid, Space, Tag, Typography } from '@arco-design/web-react'
+import { IconBook, IconCompass, IconLink, IconLoop, IconRefresh, IconStar } from '@arco-design/web-react/icon'
+import type { ProjectWorkspace } from './projects/project-types'
+
+const { Row, Col } = Grid
+const { Title, Text, Paragraph } = Typography
+
+const rssSources = [
+  { name: '产品更新', url: 'https://example.com/product.xml', status: '运行中', count: 18, color: 'arcoblue' },
+  { name: '行业情报', url: 'https://example.com/market.xml', status: '运行中', count: 24, color: 'green' },
+  { name: '技术博客', url: 'https://example.com/engineering.xml', status: '待同步', count: 9, color: 'orange' },
+]
+
+export function WorkspaceExplorePage({ workspaces, onSelectItem }: { workspaces: ProjectWorkspace[]; onSelectItem: (title: string) => void }) {
+  const articles = workspaces.flatMap((workspace) => workspace.inbox.map((item) => ({ ...item, project: workspace.project })))
+  const selected = articles[0]
+  const pendingCount = articles.filter((item) => item.status === 'open').length
+  const sourceCount = rssSources.length
+
+  return (
+    <div className="workspace-explore-page overview-page">
+      <div className="overview-head">
+        <div>
+          <Title heading={4}>探索</Title>
+          <Text type="secondary">集中管理多个 RSS 源，采集外部内容、沉淀线索，并分发到对应项目。</Text>
+        </div>
+        <Space>
+          <Button icon={<IconRefresh />}>同步 RSS</Button>
+          <Button type="primary" icon={<IconLink />}>添加源</Button>
+        </Space>
+      </div>
+
+      <Row gutter={12}>
+        <Col span={8}>
+          <Card className="compact-card" bordered>
+            <Space><Tag color="arcoblue">{sourceCount}</Tag><Text>RSS 源</Text></Space>
+          </Card>
+        </Col>
+        <Col span={8}>
+          <Card className="compact-card" bordered>
+            <Space><Tag color="red">{pendingCount}</Tag><Text>待处理采集</Text></Space>
+          </Card>
+        </Col>
+        <Col span={8}>
+          <Card className="compact-card" bordered>
+            <Space><Tag color="green">{articles.length}</Tag><Text>采集条目</Text></Space>
+          </Card>
+        </Col>
+      </Row>
+
+      <Card className="queue-section" bordered>
+        <div className="section-header">
+          <Title heading={6}>RSS 源</Title>
+          <Button type="text" size="mini">按最近同步排序</Button>
+        </div>
+        {rssSources.map((source) => (
+          <button className="data-row rss-source-row" key={source.url} onClick={() => onSelectItem(source.name)}>
+            <span className="row-title"><IconLink /> {source.name}</span>
+            <Tag color={source.color}>{source.status}</Tag>
+            <span>{source.url}</span>
+            <span>{source.count} 条</span>
+          </button>
+        ))}
+      </Card>
+
+      {articles.length ? (
+        <div className="mail-layout">
+          <Card className="mail-list queue-section" bordered>
+            <div className="section-header">
+              <Title heading={6}>采集队列</Title>
+              <Button type="text" size="mini">全部标记已读</Button>
+            </div>
+            {articles.map((item, index) => (
+              <button
+                className={index === 0 ? 'mail-item active' : 'mail-item'}
+                key={`${item.project.id}-${item.id}`}
+                onClick={() => onSelectItem(item.title)}
+              >
+                <span><IconCompass /> {item.title}</span>
+                <Text type="secondary">{item.meta}</Text>
+                <div>
+                  <Tag color={item.project.urgent ? 'red' : 'arcoblue'}>{item.project.name}</Tag>
+                  <time>{item.time}</time>
+                </div>
+              </button>
+            ))}
+          </Card>
+
+          <Card className="mail-detail queue-section" bordered>
+            <div className="section-header">
+              <Title heading={6}>{selected.title}</Title>
+              <Space>
+                <Button type="text" icon={<IconStar />} />
+                <Button type="text" icon={<IconLoop />} />
+              </Space>
+            </div>
+            <Text type="secondary">{selected.meta} · {selected.project.name}</Text>
+            <Paragraph>{selected.summary || '暂无采集正文'}</Paragraph>
+            <div className="reply-box">
+              <Text type="secondary">归档到项目</Text>
+              <Space>
+                <Button icon={<IconBook />}>转为资料</Button>
+                <Button>生成任务</Button>
+                <Button type="primary">加入项目</Button>
+              </Space>
+            </div>
+          </Card>
+        </div>
+      ) : (
+        <Card className="queue-section" bordered>
+          <Empty description="暂无 RSS 采集条目" />
+        </Card>
+      )}
+    </div>
+  )
+}