feat: align controlled AI sessions and MVP controls

apps/web_v1/src/pages/projects/project-ai.tsx

@@ -1,80 +1,134 @@
-import { Button, Card, Input, Space, Typography } from '@arco-design/web-react'
-import {
-  IconArrowUp,
-  IconAttachment,
-  IconPlusCircle,
-  IconRobot,
-} from '@arco-design/web-react/icon'
-import type { AISession, ProjectWorkspace } from './project-types'
+import { useEffect, useState } from 'react'
+import { Alert, Button, Card, Empty, Input, Space, Spin, Tag, Typography } from '@arco-design/web-react'
+import { IconPlusCircle, IconRobot } from '@arco-design/web-react/icon'
+import type { AISessionDTO, CreateAISessionInput } from '../../api/ai'
+import type { ProjectWorkspace } from './project-types'
 
 const { Title, Text } = Typography
 
-export function ProjectAi({ activeWorkspace, onSelectItem }: { activeWorkspace: ProjectWorkspace; onSelectItem: (title: string) => void }) {
-  const { aiSessions } = activeWorkspace
-  const groupedSessions = groupSessions(aiSessions)
+export function ProjectAi({
+  activeWorkspace,
+  onSelectItem,
+  onListSessions,
+  onCreateSession,
+}: {
+  activeWorkspace: ProjectWorkspace
+  onSelectItem: (title: string) => void
+  onListSessions: (projectId: string) => Promise<AISessionDTO[]>
+  onCreateSession: (projectId: string, input: CreateAISessionInput) => Promise<AISessionDTO>
+}) {
+  const [sessions, setSessions] = useState<AISessionDTO[]>([])
+  const [title, setTitle] = useState('')
+  const [context, setContext] = useState('')
+  const [loading, setLoading] = useState(true)
+  const [creating, setCreating] = useState(false)
+  const [error, setError] = useState('')
+  const projectId = activeWorkspace.project.id
+
+  useEffect(() => {
+    let current = true
+    setLoading(true)
+    setError('')
+    void onListSessions(projectId)
+      .then((items) => {
+        if (current) setSessions(items)
+      })
+      .catch((requestError: unknown) => {
+        if (current) setError(requestError instanceof Error ? requestError.message : 'AI 会话加载失败，请稍后重试')
+      })
+      .finally(() => {
+        if (current) setLoading(false)
+      })
+    return () => {
+      current = false
+    }
+  }, [onListSessions, projectId])
+
+  const createSession = async () => {
+    const trimmedTitle = title.trim()
+    if (!trimmedTitle) {
+      setError('请输入 AI 会话标题')
+      return
+    }
+    setCreating(true)
+    setError('')
+    try {
+      const created = await onCreateSession(projectId, {
+        title: trimmedTitle,
+        context: context.trim(),
+      })
+      setSessions((current) => [created, ...current.filter((session) => session.id !== created.id)])
+      setTitle('')
+      setContext('')
+      onSelectItem(created.title)
+    } catch (requestError) {
+      setError(requestError instanceof Error ? requestError.message : 'AI 会话创建失败，请稍后重试')
+    } finally {
+      setCreating(false)
+    }
+  }
 
   return (
     <div className="project-channel-page project-ai-page overview-page">
-      <div className="agent-chat-shell">
-        <Card className="agent-session-list queue-section" bordered>
-          <Button className="agent-new-chat" icon={<IconPlusCircle />}>
-            开启新对话
-          </Button>
+      <div className="overview-head">
+        <div>
+          <Title heading={4}>AI 助手</Title>
+          <Text type="secondary">创建项目内普通会话；不会自动生成任务、笔记或资料。</Text>
+        </div>
+      </div>
 
-          <div className="agent-session-groups">
-            {groupedSessions.length ? (
-              groupedSessions.map((group) => (
-                <section className="agent-session-group" key={group.label}>
-                  <Text type="secondary">{group.label}</Text>
-                  {group.items.map((session, index) => (
-                    <button
-                      className={index === 0 && group.label === groupedSessions[0]?.label ? 'agent-session active' : 'agent-session'}
-                      key={session.id}
-                      onClick={() => onSelectItem(session.title)}
-                    >
-                      {session.title}
-                    </button>
-                  ))}
-                </section>
-              ))
-            ) : (
-              <Text type="secondary">暂无对话</Text>
-            )}
-          </div>
+      {error ? <Alert className="agent-request-error" type="error" content={error} closable onClose={() => setError('')} /> : null}
+
+      <div className="agent-chat-shell">
+        <Card className="agent-session-list queue-section" bordered title="会话列表">
+          <Spin loading={loading} style={{ width: '100%' }}>
+            {sessions.length ? (
+              <div className="agent-session-groups">
+                {sessions.map((session) => (
+                  <button className="agent-session" key={session.id} onClick={() => onSelectItem(session.title)}>
+                    <span>{session.title}</span>
+                    <Tag size="small" color={session.status === 'ready' ? 'arcoblue' : 'gray'}>
+                      {sessionStatusLabel(session.status)}
+                    </Tag>
+                  </button>
+                ))}
+              </div>
+            ) : loading ? null : <Empty description="暂无 AI 会话" />}
+          </Spin>
         </Card>
 
         <Card className="agent-chat-panel queue-section" bordered>
-          <div className="agent-chat-main">
-            <Title heading={2}>选择专家，开始对话</Title>
-          </div>
-          <div className="agent-composer">
-            <Input.TextArea placeholder="给 DeepSeek 发送消息" autoSize={{ minRows: 3, maxRows: 6 }} />
-            <div className="agent-composer-footer">
-              <Button className="agent-model-chip" icon={<IconRobot />}>
-                DeepSeek V4.0 Flash
-              </Button>
-              <Space>
-                <Button type="text" icon={<IconAttachment />} />
-                <Button className="agent-send-button" type="primary" shape="circle" icon={<IconArrowUp />} />
-              </Space>
+          <Space direction="vertical" size={16} className="action-form">
+            <div>
+              <Title heading={5}>创建会话</Title>
+              <Text type="secondary">会话状态为“待开始”只表示入口已建立，不代表 AI 已完成处理。</Text>
             </div>
-          </div>
+            <label>
+              <Text>会话标题</Text>
+              <Input value={title} onChange={setTitle} placeholder="例如：报价分析" maxLength={120} />
+            </label>
+            <label>
+              <Text>项目上下文</Text>
+              <Input.TextArea
+                value={context}
+                onChange={setContext}
+                placeholder="描述本次会话要参考的项目背景"
+                autoSize={{ minRows: 5, maxRows: 10 }}
+              />
+            </label>
+            <Button type="primary" icon={<IconPlusCircle />} loading={creating} onClick={() => void createSession()}>
+              创建会话
+            </Button>
+            <Text type="secondary"><IconRobot /> AI 输出如需转为正式对象，必须另行确认。</Text>
+          </Space>
         </Card>
       </div>
     </div>
   )
 }
 
-function groupSessions(sessions: AISession[]) {
-  const labels = ['今天', '昨天', '7 天内']
-  return labels.map((label) => ({
-    label,
-    items: sessions.filter((session, index) => session.time.includes(label) || (!labels.some((item) => session.time.includes(item)) && labels.indexOf(label) === fallbackGroupIndex(index))),
-  })).filter((group) => group.items.length > 0)
-}
-
-function fallbackGroupIndex(index: number) {
-  if (index === 0) return 0
-  if (index === 1) return 1
-  return 2
+function sessionStatusLabel(status: string) {
+  if (status === 'ready') return '待开始'
+  if (status === 'failed') return '创建失败'
+  return status || '未知状态'
 }

apps/web_v1/src/pages/projects/project-channel-page.tsx

@@ -8,6 +8,7 @@ import type { ProjectTaskUpdate } from './project-task-edit-modal'
 import { ProjectTasks } from './project-tasks'
 import type { ChannelKey, InboxConfirmationOutcome, ProjectWorkspace } from './project-types'
 import type { InboxSuggestionDTO } from '../../api/inbox'
+import type { AISessionDTO, CreateAISessionInput } from '../../api/ai'
 
 export function ProjectChannelPage({
   activeChannel,
@@ -23,6 +24,8 @@ export function ProjectChannelPage({
   onUpdateTask,
   onAnalyzeInbox,
   onConfirmInbox,
+  onListAISessions,
+  onCreateAISession,
 }: {
   activeChannel: ChannelKey
   activeWorkspace: ProjectWorkspace
@@ -37,6 +40,8 @@ export function ProjectChannelPage({
   onUpdateTask: (update: ProjectTaskUpdate) => void
   onAnalyzeInbox: (inboxId: string) => Promise<InboxSuggestionDTO[]>
   onConfirmInbox: (inboxId: string, suggestionIds: string[]) => Promise<InboxConfirmationOutcome>
+  onListAISessions: (projectId: string) => Promise<AISessionDTO[]>
+  onCreateAISession: (projectId: string, input: CreateAISessionInput) => Promise<AISessionDTO>
 }) {
   switch (activeChannel) {
     case 'inbox':
@@ -44,7 +49,7 @@ export function ProjectChannelPage({
     case 'tasks':
       return <ProjectTasks activeWorkspace={activeWorkspace} activeTaskID={activeTaskID} onOpenTask={onOpenTask} onCloseTask={onCloseTask} onSelectItem={onSelectItem} onCreateTask={onCreateTask} onCreateProjectTag={onCreateProjectTag} onUpdateTask={onUpdateTask} />
     case 'ai':
-      return <ProjectAi activeWorkspace={activeWorkspace} onSelectItem={onSelectItem} />
+      return <ProjectAi activeWorkspace={activeWorkspace} onSelectItem={onSelectItem} onListSessions={onListAISessions} onCreateSession={onCreateAISession} />
     case 'notes':
       return <ProjectNotes activeWorkspace={activeWorkspace} onSelectItem={onSelectItem} onUploadSource={onUploadSource} />
     case 'cron':

apps/web_v1/src/pages/projects/project-cron.tsx

@@ -14,7 +14,7 @@ export function ProjectCron({ activeWorkspace, onSelectItem, onCreateCronPlan }:
       <div className="overview-head">
         <div>
           <Title heading={4}>计划任务</Title>
-          <Text type="secondary">{project.name} 的定时任务、自动检查和周期性 AI 工作。</Text>
+          <Text type="secondary">{project.name} 的计划任务元数据与提醒安排；当前不会自主执行 AI 工作。</Text>
         </div>
         <Button type="primary" icon={<IconPlus />} onClick={onCreateCronPlan}>新建计划</Button>
       </div>

apps/web_v1/src/pages/projects/project-new-channel.tsx

@@ -1,9 +1,7 @@
-import { Button, Card, Input, Select, Space, Tag, Typography } from '@arco-design/web-react'
-import { IconApps, IconLink, IconPlus } from '@arco-design/web-react/icon'
+import { Card, Empty, Typography } from '@arco-design/web-react'
 import type { ProjectWorkspace } from './project-types'
 
 const { Title, Text } = Typography
-const { TextArea } = Input
 
 export function ProjectNewChannel({ activeWorkspace }: { activeWorkspace: ProjectWorkspace }) {
   return (
@@ -11,51 +9,11 @@ export function ProjectNewChannel({ activeWorkspace }: { activeWorkspace: Projec
       <div className="overview-head">
         <div>
           <Title heading={4}>新建频道</Title>
-          <Text type="secondary">{activeWorkspace.project.name} 的频道入口配置，用于接入外部页面、资料集合或项目流程。</Text>
+          <Text type="secondary">{activeWorkspace.project.name} 暂不支持自定义频道或外部链接接入。</Text>
         </div>
-        <Button type="primary" icon={<IconPlus />}>保存频道</Button>
       </div>
-
-      <Card className="queue-section channel-editor-card" bordered>
-        <Space direction="vertical" size={12} className="action-form">
-          <label>
-            <Text>频道名称</Text>
-            <Input placeholder="例如：客户研究频道" />
-          </label>
-          <label>
-            <Text>频道类型</Text>
-            <Select defaultValue="link">
-              <Select.Option value="link">外部链接</Select.Option>
-              <Select.Option value="source">资料集合</Select.Option>
-              <Select.Option value="workflow">项目流程</Select.Option>
-            </Select>
-          </label>
-          <label>
-            <Text>图标</Text>
-            <Input placeholder="例如：link / user / file" prefix={<IconApps />} />
-          </label>
-          <label>
-            <Text>链接地址</Text>
-            <Input placeholder="https://example.com/channel" prefix={<IconLink />} />
-          </label>
-          <label>
-            <Text>说明</Text>
-            <TextArea rows={4} placeholder="频道用途、维护规则或采集说明" />
-          </label>
-        </Space>
-      </Card>
-
       <Card className="queue-section" bordered>
-        <div className="section-header">
-          <Title heading={6}>创建后可接入的内容</Title>
-          <Tag color="gray">配置预览</Tag>
-        </div>
-        <Space wrap>
-          <Tag color="arcoblue">外部资料库</Tag>
-          <Tag color="green">项目流程页</Tag>
-          <Tag color="orange">RSS/探索结果</Tag>
-          <Tag color="purple">AI智能体上下文</Tag>
-        </Space>
+        <Empty description="自定义频道暂未开放" />
       </Card>
     </div>
   )

apps/web_v1/src/pages/projects/project-statusbar.tsx

@@ -1,115 +1,19 @@
-import { useState } from 'react'
-import { Avatar, Button, Card, Form, Input, Layout, Modal, Radio, Space, Typography } from '@arco-design/web-react'
-import {
-  IconApps,
-  IconCalendar,
-  IconRobot,
-  IconStorage,
-  IconUser,
-} from '@arco-design/web-react/icon'
+import { Layout, Space } from '@arco-design/web-react'
+import { IconCheckCircle } from '@arco-design/web-react/icon'
 
 const { Footer } = Layout
-const { Text, Title } = Typography
-
-const plans = [
-  { id: 'starter', name: '基础版', price: '¥29/月', desc: '个人项目、基础智能体与 20GB 存储。' },
-  { id: 'pro', name: '专业版', price: '¥99/月', desc: '团队协作、高级智能体与 200GB 存储。' },
-  { id: 'team', name: '团队版', price: '¥299/月', desc: '成员管理、审计日志与私有化部署支持。' },
-]
 
 export function ProjectStatusbar() {
-  const [profileOpen, setProfileOpen] = useState(false)
-  const [upgradeOpen, setUpgradeOpen] = useState(false)
-  const [selectedPlan, setSelectedPlan] = useState('pro')
-
   return (
-    <>
-      <Footer className="statusbar">
-        <button className="status-user" type="button" onClick={() => setProfileOpen(true)}>
-          <Avatar size={24} style={{ backgroundColor: '#165DFF' }}>张</Avatar>
-          <span className="status-identity">
-            <Text className="status-name">张明</Text>
-            <span className="status-online-dot" aria-label="在线" title="在线" />
-          </span>
-          <Button className="status-upgrade" size="mini" type="primary" onClick={(event) => {
-            event.stopPropagation()
-            setUpgradeOpen(true)
-          }}>升级</Button>
-        </button>
-
-        <Space className="status-system" size={18}>
-          <span><IconInteractionFallback /> 3 个计划进行中</span>
-          <span><IconRobot /> AI 空闲</span>
-          <span><IconStorage /> 152GB 可用</span>
-          <span>状态 <b>正常</b></span>
-          <IconApps />
-        </Space>
-      </Footer>
-
-      <Modal
-        title="个人资料"
-        visible={profileOpen}
-        onCancel={() => setProfileOpen(false)}
-        onOk={() => setProfileOpen(false)}
-        okText="保存"
-        cancelText="取消"
-      >
-        <Form layout="vertical" className="status-modal-form">
-          <Form.Item label="头像">
-            <Space>
-              <Avatar size={42} style={{ backgroundColor: '#165DFF' }}>张</Avatar>
-              <Button icon={<IconUser />}>更换头像</Button>
-            </Space>
-          </Form.Item>
-          <Form.Item label="名称">
-            <Input defaultValue="张明" placeholder="请输入名称" />
-          </Form.Item>
-          <Form.Item label="邮箱">
-            <Input defaultValue="zhangming@senlin.ai" placeholder="请输入邮箱" />
-          </Form.Item>
-          <Form.Item label="当前密码">
-            <Input.Password placeholder="用于确认身份" />
-          </Form.Item>
-          <Form.Item label="新密码">
-            <Input.Password placeholder="不修改密码可留空" />
-          </Form.Item>
-        </Form>
-      </Modal>
-
-      <Modal
-        title="升级套餐"
-        visible={upgradeOpen}
-        onCancel={() => setUpgradeOpen(false)}
-        onOk={() => setUpgradeOpen(false)}
-        okText="去支付"
-        cancelText="取消"
-      >
-        <Radio.Group value={selectedPlan} onChange={setSelectedPlan} className="billing-plan-group">
-          {plans.map((plan) => (
-            <Card className={selectedPlan === plan.id ? 'billing-plan active' : 'billing-plan'} key={plan.id} bordered>
-              <Radio value={plan.id}>
-                <div>
-                  <Title heading={6}>{plan.name}</Title>
-                  <Text className="billing-price">{plan.price}</Text>
-                  <Text type="secondary">{plan.desc}</Text>
-                </div>
-              </Radio>
-            </Card>
-          ))}
-        </Radio.Group>
-        <div className="billing-payments">
-          <Text type="secondary">支付方式</Text>
-          <Space>
-            <Button>微信支付</Button>
-            <Button>支付宝</Button>
-            <Button>企业转账</Button>
-          </Space>
-        </div>
-      </Modal>
-    </>
+    <Footer className="statusbar">
+      <div className="status-user">
+        <span className="status-avatar" aria-hidden="true">森</span>
+        <span className="status-name">已登录</span>
+      </div>
+      <Space className="status-system" size={8}>
+        <IconCheckCircle />
+        <span>服务已连接</span>
+      </Space>
+    </Footer>
   )
 }
-
-function IconInteractionFallback() {
-  return <IconCalendar />
-}

apps/web_v1/src/pages/projects/project-topbar.tsx

@@ -28,7 +28,6 @@ export function ProjectTopbar({
   onSearch: () => void
   onSelectSearchResult: (result: SearchResultDTO) => void
 }) {
-  const desktop = isDesktopRuntime()
   const [popupVisible, setPopupVisible] = useState(false)
 
   useEffect(() => {
@@ -99,13 +98,6 @@ export function ProjectTopbar({
       </Dropdown>
       <Space className="topbar-actions">
         <Button aria-label={theme === 'dark' ? '切换浅色模式' : '切换深色模式'} icon={theme === 'dark' ? <IconSun /> : <IconMoon />} onClick={onToggleTheme} />
-        {desktop && (
-          <>
-            <Button aria-label="停靠左边" icon={<DockIcon side="left" />} />
-            <Button aria-label="停靠右边" icon={<DockIcon side="right" />} />
-          </>
-        )}
-        <Button icon={<IconApps />} />
       </Space>
     </Header>
   )
@@ -117,15 +109,3 @@ function searchTypeLabel(type: string) {
   if (type === 'note') return '笔记'
   return '未知'
 }
-
-function isDesktopRuntime() {
-  return typeof window !== 'undefined' && '__TAURI__' in window
-}
-
-function DockIcon({ side }: { side: 'left' | 'right' }) {
-  return (
-    <span className={`dock-icon dock-icon-${side}`} aria-hidden="true">
-      <span />
-    </span>
-  )
-}