Compare commits
2
Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 xuhdandClaude Sonnet 4.6
|
719ff6f210 | ||
|
xuhdandClaude Sonnet 4.6
|
1f74586032 |
No files matched your search
@@ -1,32 +0,0 @@
|
|||||||
---
|
|
||||||
name: deerflow-ui-guard
|
|
||||||
description: Improve or review UI in the DeerFlow Vite/React frontend while preserving its light, dark-blue, and light-blue themes, Radix/shadcn-style primitives, Chinese enterprise density, embedded routes, and Chrome 109 compatibility. Use for visual refinements, new frontend pages/components, UI reviews, token cleanup, or design-system work under frontend-web/.
|
|
||||||
---
|
|
||||||
|
|
||||||
# DeerFlow UI Guard
|
|
||||||
|
|
||||||
Use this skill only in this repository. Preserve the product's existing visual system; do not replace it with a generic SaaS template or a new component library.
|
|
||||||
|
|
||||||
## Read the relevant sources first
|
|
||||||
|
|
||||||
1. Read `references/project-sources.md`, then the relevant theme specification.
|
|
||||||
2. Inspect the page and the nearest existing components before proposing or changing UI.
|
|
||||||
3. Read `frontend-web/src/styles/globals.css` and the affected primitives under `frontend-web/src/components/ui/` before changing tokens, shared styles, or variants.
|
|
||||||
|
|
||||||
## Design and implementation rules
|
|
||||||
|
|
||||||
- Reuse the existing Radix/shadcn-style primitives, `lucide-react`, Tailwind v4, and established CSS variables. Do not add Ant Design, another component system, or a visual-effects package unless the user explicitly asks.
|
|
||||||
- Keep all three themes correct: light/red, dark/blue, and light-blue. Prefer semantic classes and existing variables over raw color values. When a new token is necessary, define matching values for every theme.
|
|
||||||
- Preserve Chinese enterprise-product density and task completion speed. Make hierarchy, primary action, status, empty states, error recovery, and keyboard focus clearer before adding decoration.
|
|
||||||
- Keep the shell, deep links, authentication, embed/isolation behavior, sidebar menu semantics, and responsive layout unchanged unless the request explicitly targets them.
|
|
||||||
- Avoid unscoped global overrides and `!important`; place page-specific styling beside the feature and make selectors local.
|
|
||||||
- Support the Chrome 109 constraint. Do not introduce unguarded `oklch()`, `oklab()`, `lab()`, `lch()`, or `color-mix()` values.
|
|
||||||
- Preserve accessible names, keyboard interaction, visible `:focus-visible` states, sufficient contrast, and reduced-motion behavior for new or changed controls.
|
|
||||||
|
|
||||||
## Delivery workflow
|
|
||||||
|
|
||||||
1. State which existing theme and UI primitives the work will reuse.
|
|
||||||
2. Make the smallest coherent change; do not perform an unrelated visual sweep.
|
|
||||||
3. Validate with `pnpm typecheck`; when CSS or built UI changes, also run `pnpm build` and `pnpm check:chrome109-css` from `frontend-web/` when practical.
|
|
||||||
4. If a browser is available, inspect screenshots in light, dark, and light-blue modes. Otherwise say that visual verification remains outstanding.
|
|
||||||
5. For a review-only request, use `web-design-guidelines` as an additional quality gate when it is available, then distinguish confirmed issues from visual checks that still need a browser.
|
|
||||||
@@ -1,4 +0,0 @@
|
|||||||
interface:
|
|
||||||
display_name: "DeerFlow UI Guard"
|
|
||||||
short_description: "Apply DeerFlow themes and UI safety checks."
|
|
||||||
default_prompt: "Use $deerflow-ui-guard to improve this DeerFlow UI without breaking its themes or legacy-browser support."
|
|
||||||
@@ -1,23 +0,0 @@
|
|||||||
# DeerFlow UI sources
|
|
||||||
|
|
||||||
Read only the files relevant to the requested surface.
|
|
||||||
|
|
||||||
## Canonical themes
|
|
||||||
|
|
||||||
- Light/red: `frontend-web/docs/浅红色UI规范/README.md` and its focused section files.
|
|
||||||
- Dark/blue: `frontend-web/docs/ui规范-深蓝/README.md` and its focused section files.
|
|
||||||
- Light-blue: `frontend-web/docs/ui规范-浅蓝/浅蓝色ui规范.md`.
|
|
||||||
- Runtime tokens and browser fallbacks: `frontend-web/src/styles/globals.css`.
|
|
||||||
|
|
||||||
## Shared implementation
|
|
||||||
|
|
||||||
- UI primitives: `frontend-web/src/components/ui/`.
|
|
||||||
- Theme selection: `frontend-web/src/contexts/ThemeContext.tsx` and `frontend-web/src/App.tsx`.
|
|
||||||
- Application shell and embed behavior: `frontend-web/src/pages/PageRoutes.tsx`.
|
|
||||||
- Dynamic navigation: `frontend-web/src/core/page-layout/use-sidebar-menu.ts`.
|
|
||||||
|
|
||||||
## Required constraints
|
|
||||||
|
|
||||||
- Use `pnpm` in `frontend-web/`.
|
|
||||||
- Retain Chrome 109 compatibility; validate CSS with `pnpm check:chrome109-css` after a build.
|
|
||||||
- Do not move or replace public assets, route behavior, or authentication as part of a visual-only change.
|
|
||||||
+2
-17
@@ -77,14 +77,8 @@ offline-backend-20260512/backend/.deer-flow/*
|
|||||||
|
|
||||||
# Per-user skill_evolution overrides — runtime data written by the API
|
# Per-user skill_evolution overrides — runtime data written by the API
|
||||||
offline-backend-20260512/backend/skill_evolution.json
|
offline-backend-20260512/backend/skill_evolution.json
|
||||||
skills/
|
skills/
|
||||||
# Keep the project-local Codex UI guard under version control. The broad
|
hermes-agent-main/
|
||||||
# skills/ rule above still excludes runtime skill directories elsewhere.
|
|
||||||
!.codex/
|
|
||||||
!.codex/skills/
|
|
||||||
!.codex/skills/deerflow-ui-guard/
|
|
||||||
!.codex/skills/deerflow-ui-guard/**
|
|
||||||
hermes-agent-main/
|
|
||||||
.gitignore
|
.gitignore
|
||||||
offline-backend-20260512/backend/tests/*
|
offline-backend-20260512/backend/tests/*
|
||||||
deploy
|
deploy
|
||||||
@@ -110,12 +104,3 @@ docs/backups
|
|||||||
|
|
||||||
# uv lockfile (not tracked per project preference)
|
# uv lockfile (not tracked per project preference)
|
||||||
offline-backend-20260512/backend/uv.lock
|
offline-backend-20260512/backend/uv.lock
|
||||||
|
|
||||||
# Local-only scratch directory (not committed)
|
|
||||||
0622/
|
|
||||||
|
|
||||||
# Python bytecode cache
|
|
||||||
__pycache__/
|
|
||||||
|
|
||||||
# misc
|
|
||||||
.DS_Store
|
|
||||||
@@ -1,103 +0,0 @@
|
|||||||
# AGENTS.md
|
|
||||||
|
|
||||||
This file provides guidance to Codex (Codex.ai/code) when working with code in this repository.
|
|
||||||
|
|
||||||
## Project Overview
|
|
||||||
|
|
||||||
This is a customized offline deployment of **DeerFlow** — a LangGraph-based AI super agent platform. The repo contains two sub-projects:
|
|
||||||
|
|
||||||
- `offline-backend-20260512/backend/` — Python backend (FastAPI Gateway + LangGraph agent runtime)
|
|
||||||
- `frontend-web/` — Vite + React 19 frontend (TypeScript, pnpm)
|
|
||||||
|
|
||||||
Managed together via shell scripts in `scripts/`.
|
|
||||||
|
|
||||||
## Commands
|
|
||||||
|
|
||||||
### Full Application (from repo root)
|
|
||||||
|
|
||||||
```bash
|
|
||||||
./scripts/start-all.sh # Start backend + frontend as background daemons
|
|
||||||
./scripts/stop-all.sh # Stop both
|
|
||||||
./scripts/restart-all.sh # Restart both
|
|
||||||
./scripts/status.sh # Check running status
|
|
||||||
```
|
|
||||||
|
|
||||||
Logs and PID files are written to `.runtime/logs/` and `.runtime/pids/`.
|
|
||||||
|
|
||||||
### Backend Only (from `offline-backend-20260512/backend/`)
|
|
||||||
|
|
||||||
```bash
|
|
||||||
make install # Install Python dependencies (uv)
|
|
||||||
make dev # Run Gateway API with hot-reload on port 8001
|
|
||||||
make gateway # Run Gateway API without reload
|
|
||||||
make test # Run all tests: PYTHONPATH=. uv run pytest tests/ -v
|
|
||||||
make lint # Lint with ruff
|
|
||||||
make format # Format with ruff
|
|
||||||
```
|
|
||||||
|
|
||||||
Run a single test file:
|
|
||||||
```bash
|
|
||||||
PYTHONPATH=. uv run pytest tests/test_<feature>.py -v
|
|
||||||
```
|
|
||||||
|
|
||||||
### Frontend Only (from `frontend-web/`)
|
|
||||||
|
|
||||||
```bash
|
|
||||||
pnpm install # Install dependencies
|
|
||||||
pnpm dev # Start Vite dev server on port 5174
|
|
||||||
pnpm build # Production build
|
|
||||||
pnpm typecheck # TypeScript type checking (tsc --noEmit)
|
|
||||||
```
|
|
||||||
|
|
||||||
## Service Ports
|
|
||||||
|
|
||||||
| Service | Port | Notes |
|
|
||||||
|---------|------|-------|
|
|
||||||
| Backend (Gateway API) | 8001 | FastAPI + LangGraph runtime |
|
|
||||||
| Frontend (Vite) | 5174 | React SPA |
|
|
||||||
|
|
||||||
Frontend connects to backend via env vars `VITE_BACKEND_BASE_URL` and `VITE_LANGGRAPH_BASE_URL` (injected by `scripts/start-frontend.sh`).
|
|
||||||
|
|
||||||
## Architecture
|
|
||||||
|
|
||||||
### Backend
|
|
||||||
|
|
||||||
The backend (`offline-backend-20260512/backend/`) is split into two layers:
|
|
||||||
|
|
||||||
- **`packages/harness/deerflow/`** — publishable agent framework (`deerflow.*` imports): LangGraph lead agent, middleware chain, sandbox, tools, MCP, memory, models, skills. **Never imports from `app.*`.**
|
|
||||||
- **`app/`** — application layer (`app.*` imports): FastAPI Gateway routers, IM channel integrations (Feishu, Slack, Telegram, DingTalk).
|
|
||||||
|
|
||||||
The **Lead Agent** (`deerflow/agents/lead_agent/`) is the single LangGraph graph entry point. It wraps a middleware chain (~18 middlewares assembled in strict order) around LLM calls, handling: thread isolation, sandbox lifecycle, uploads, memory, plan mode, vision, subagent delegation, and loop detection.
|
|
||||||
|
|
||||||
**Middleware order matters** — middlewares are appended in a fixed sequence; `ClarificationMiddleware` must always be last. See `offline-backend-20260512/backend/AGENTS.md` for the full ordered list.
|
|
||||||
|
|
||||||
**Harness → App import firewall** is enforced by `tests/test_harness_boundary.py` (runs in CI).
|
|
||||||
|
|
||||||
### Frontend
|
|
||||||
|
|
||||||
The frontend (`frontend-web/`) is a React 19 + Vite SPA:
|
|
||||||
|
|
||||||
- **Routing**: React Router v7; top-level routes in `src/pages/PageRoutes.tsx`, workspace sub-routes in `src/pages/WorkspaceRoutes.tsx`
|
|
||||||
- **Pages**: `ChatPage` (thread chat), `AgentChatPage` (custom agent chat), `AgentsPage`/`NewAgentPage` (agent management), `ScheduledTasksPage`/`ScheduledTaskRunDetailPage` (scheduled tasks), `LightAppManagementPage`/`LightAppListPage`/`LightAppIframeView` (轻应用中心 — register/list/embed mini-apps)
|
|
||||||
- **AI 写作·对话版（对话驱动写作台）**: a **parallel new entry** beside the classic AI-writing page (classic page/routes untouched) — route `/page/canvas/ai-writing-chat`, sidebar 「问答管理 → 课题研究(对话版)」. Page `open-canvas/pages/AIWritingChatPage.tsx` reuses the engine (`AIWritingContext` + `useStream` + `AIWritingDraftPanel`); **idle keeps the classic setup layout** (`WritingSetupChat` + collapsible form) and switches to the chat workbench once writing starts; left panel `components/ai-writing-chat/WritingChatPanel.tsx` = **unified chronological feed** (`ChatFlowTimeline.tsx`, chat bubbles anchor-interleaved into the progress timeline so triggered events render below the user's message) + button-only intervention cards (`ChatInterventionCards.tsx`, inline textareas removed) + bottom unified smart composer. Intent resolution: frontend fast path + `POST /api/ai-writing/sessions/{id}/intent` → `deerflow/agents/ai_writing/intent_router.py` (per-pause action whitelist, high-cost confidence gates, payload cleaning); supports QA bypass, clarify follow-ups, control intents, and material-stage auto re-search + pending-intent resume. Tests `tests/test_ai_writing_intent.py`; plan doc `frontend-web/docs/ai-writing-对话驱动写作台-实现方案.md`.
|
|
||||||
- **轻应用中心 (Light App Center)**: a sibling of 任务管理 in the sidebar with two pages — 应用管理 (admin registers `window_open` or `iframe` mini-apps with a route-param builder: login params resolved from `localStorage.userInfo`, theme params literal) and 应用列表 (card grid of `window_open` apps, `window.open` launch). `iframe` apps are mounted under a chosen parent menu (XK/PG/TY/综合管理) and **dynamically injected into the sidebar** by `core/page-layout/use-sidebar-menu.ts` (`useSidebarMenuItems`), opening in the `LightAppIframeView` host. Client + React Query hooks in `strategy-components/api/light-apps.ts`; URL builder/constants in `strategy-components/lib/light-app.ts`. Backend: `/api/light-apps` (global/shared, admin-gated writes).
|
|
||||||
- **菜单管理 (Menu Management, admin-only)**: an **overlay** over the static sidebar menu — `MenuManagementPage` (`pages/MenuManagementPage.tsx`, route `/page/strategy/admin/menu-management`, opened from the admin-only 「菜单管理」 item in the **bottom-left settings dropdown** of `components/page-sidebar.tsx`). Admins rename / 停用·启用 / reorder (↑↓ or @dnd-kit drag) / re-parent (horizontal drag **or** the edit dialog's 「移动到」parent selector) any node across 一级/二级/三级, **including injected iframe light-app nodes** (`light-app-<appId>`). The static tree (`core/page-layout/sidebar-menu.ts`) stays the source of icons/routes; only per-node deltas (`label`/`disabled`/`parentId`/`sortOrder`) persist to the backend. Merge logic in `core/page-layout/menu-overrides.ts` (`applyMenuOverrides`, applied in `use-sidebar-menu.ts` after light-app injection, before role filter; disabling a node hides its whole subtree) — strict **3-level cap** (`wouldExceedDepth`). Client `strategy-components/api/menu-overrides.ts`. Backend: `/api/menu-overrides` (global/shared; open read, admin atomic replace-all).
|
|
||||||
- **敏感词管理 (Sensitive Word Management)**: configures the **展示层脱敏映射** (原始词 → 替换词). **Gated on the username `lqq`** (not the admin role) — `getAccountDisplayName().toLowerCase() === "lqq"` (username = email `@` prefix, else `user_id`, same as the profile page); the dropdown entry, the route guard, and the page-level guard all use this check. `src/lib/desensitize.ts` ships a frozen seed map `SEED_DESENSITIZE_MAP` (the deployment seed) plus a live mutable `DESENSITIZE_MAP` (initialized from the seed so `desensitize()` works before any fetch). `DesensitizeWordsLoader` (mounted in `App.tsx` `AppProviders`) fetches `/api/sensitive-words` on startup and, if non-empty, calls `replaceDesensitizeMap(...)` to make the backend config the source of truth (empty/failed → keep seed). Page `SensitiveWordsPage.tsx` (route `/page/strategy/admin/sensitive-words`, opened from the 「敏感词管理」 item in the **bottom-left settings dropdown** of `components/page-sidebar.tsx`, present in **both** full + collapsed sidebar modes) lists/adds/edits/启停/deletes words and saves the **whole set atomically** (replace-all); a 「导入种子词」 button merges any missing `SEED_DESENSITIZE_MAP` entries into the editor. Client + hooks in `strategy-components/api/sensitive-words.ts` (`wordsToMap` folds enabled rows into the runtime map). Backend: `/api/sensitive-words` (global/shared; open read, write allowed for admin **or** the `lqq` account), mirroring 菜单管理's store shape. **侧边栏 + 导航栏 menu labels are desensitized** at the data source: `useSidebarMenuItems`/`useActiveThirdLevel` (`core/page-layout/use-sidebar-menu.ts`) map every node's `label` through a desensitizer built **directly from the `/api/sensitive-words` query** (`makeDesensitizer(wordsToMap(words))`, falling back to the global seed `desensitize` while empty) — this sidesteps the `replaceDesensitizeMap` effect-timing race. Only `label` is rewritten; `path`/`id`/`icon` are untouched so routing/highlight are unaffected. All nav surfaces (`page-sidebar.tsx`, `page-sidebar-dark.tsx`, `page-sidebar-v1.tsx`, `strategy-components/Header.tsx`, `PageRoutes.tsx`) consume this hook and are covered; `MenuManagementPage` uses the raw tree so admins still edit real labels.
|
|
||||||
- **技能地址管理 (Skill Address Management, admin-only)**: 扫描运行中的技能（`skills/{public,custom}` 下所有 `.md`/`.py`）里的 **http(s) URL 与 IP/IP:端口**，按唯一地址聚合全部出现位置（跨 .md/.py），支持**批量替换**（如把 UAT 地址一次性改成生产）。主体抽成可复用组件 `SkillAddressesPanel`（`pages/SkillAddressesPage.tsx` 导出，默认导出 `SkillAddressesPage` 仍保留旧路由 `/page/strategy/admin/skill-addresses` 作直链回退），**作为「技能地址管理」标签页嵌入管理员「技能管理」页 `pages/AdminSkillsPage.tsx`**（该页加 Tabs：「技能列表」+「技能地址管理」；入口在「设置和更多」下拉的「技能管理」`workspace-nav-menu.tsx` → `/page/workspace/admin/skills`，不再单列于 `components/page-sidebar.tsx` 左下角设置下拉）：打开自动扫描并带**进度条**（扫描逐技能 / 应用逐文件 X/N，应对 150+ 技能），URL/IP 类型过滤 + 搜索 + 「片段批量套用」（如所有 `uat.4.cn` → `prod.4.cn`）、每地址「替换为」输入框（可展开看 `file:line` 片段）、内联**预览**、**应用**、**多关键词检索**（空格分隔全部命中），以及**修改记录**面板——每次应用生成一条记录（显示时间/改了哪些地址 from→to/文件数/处数），可**针对单次记录回退**（二次确认）。client + NDJSON 流式解析在 `strategy-components/api/skill-addresses.ts`。后端 `/api/skill-addresses`（**仅管理员**）：所有文件 IO 走 `asyncio.to_thread` 不阻塞事件循环；`GET /scan`(+`/scan/stream`)、`POST /preview`、`POST /apply`(+`/apply/stream`)、`GET /backups`、`POST /rollback/{id}`；**子串安全替换**（基于 token span，不会误伤子串）、`expected_total` 乐观锁（409）、写前自动磁盘备份到 `{skills_root}/.address-edits/`（同时写一份 `{id}.manifest.json` 记录本次替换明细，供修改记录展示）、应用后刷新技能系统提示缓存。纯引擎 `deerflow/skills/address_scan.py`，router `app/gateway/routers/skill_addresses.py`，tests `tests/test_skill_addresses.py`。范围仅运行中技能，不动 `deploy/minimal/skills/`。
|
|
||||||
- **按钮管理 (Task Button Management, admin-only)**: configures the **可配置跳转按钮** rendered in the left task panel of the task deep-link workspaces (rwfx / 3qfx / xdfx, see `TaskFxWorkspace`). Each button = `{business, label, linkType, target, appendTaskId, idParam, idKind, enabled, sortOrder}`; `linkType` is `url` (外链 `window.open`, optional append of `?{idParam}={id}` — **`idParam` is the editable query-param name**, e.g. `id`/`task_id`), `business` (内部切换到另一业务, reuses `resolveTaskDeeplinkTarget`, always task id), or `purpose` (弹出当前任务的「任务目的」表格 via the shared `TaskPurposeDialog`, no target — configurable for any page incl. xdfx). **`idKind` (`task`/`action`) only matters for xdfx**: its deep-link `?taskId=` is an 行动id and the 任务id is resolved at login (`fetchTaskIdFromAction`) — `TaskContext` now also stashes the raw `actionId`, so a url button can append either (default `task`). Page `TaskButtonsPage.tsx` (route `/page/strategy/admin/task-buttons`, **admin-gated**, entry「按钮管理」in the bottom-left settings dropdown of `components/page-sidebar.tsx`, both full + collapsed modes) has per-business tabs, edits name/type/target/启停/排序/增删, saves the **whole set atomically** (replace-all), plus 「导入默认」 to merge code-seed defaults. **Seed/fallback** (like 敏感词管理): only when the whole table is empty (fresh deploy, never saved) do the workspace + page fall back to `defaultTaskButtons(cfg)` — rwfx's url buttons (编辑/下一步/3q详情) built from the **live** `/api/public/config/task-deeplink` plus cross-business switch buttons for **all three** businesses (each switches to the other two — rwfx→三情/行动, 3qfx→任务/行动, xdfx→任务/三情). Once saved, the store is the sole source of truth. The old hardcoded jump buttons were migrated out: `TaskFxWorkspace` no longer hardcodes 切换到三情分析, `TaskActionsPanel` keeps only the non-jump 清除记录, and `TaskPurposePanel` dropped its 3q详情 button (now configurable) **and defaults the 目的树 table to collapsed** (chevron toggle). Helpers `core/auth/task-buttons.ts` (`TaskButton`, `defaultTaskButtons`, `resolveTaskButtons`, `buttonsForBusiness`, `runTaskButton`), client+hooks `strategy-components/api/task-buttons.ts`. Backend: `/api/task-buttons` (global/shared; open read, admin replace-all), store `deerflow.persistence.task_buttons` (table `task_buttons`, auto-created by `create_all`), wired `app.state.task_button_store`. Tests: `tests/test_task_buttons.py`.
|
|
||||||
- **State**: TanStack Query for server state, context providers (`SubtasksProvider`, `ArtifactsProvider`, `PromptInputProvider`) scoped to `WorkspaceRoutes`
|
|
||||||
- **LLM streaming**: `@langchain/langgraph-sdk` streams messages from the backend via SSE
|
|
||||||
- **UI**: Radix UI primitives + TailwindCSS v4 + shadcn-style components in `src/components/ui/`
|
|
||||||
- **Shims**: `src/shims/` provides `next/link` and `next/navigation` polyfills (original code was Next.js)
|
|
||||||
- **Login URL params** (`LoginPage.tsx`, frontend-only — the backend never sees these): besides the auth params (`ticket`/`userId`/`env`/`theme`/`yUserId`/`token`/`access_token`/`authToken`/`password`), the page supports a **task deep-link** via `?taskId=&goPath=`. After login it calls the consumer API `GET {VITE_AIPI_CONSUMER_URL}/taskAnalyseSearch/cop-task-detail?taskId=` (header `Authorization: Bearer admin`, auto-injected by `utils/request.ts`), stashes the full `data` (`id/overview/taskDirection/taskName/taskContent`) into `sessionStorage["login.copTaskDetail"]`, then routes by `goPath`: base codes `3qfx`/`rwfx`/`xdfx` → that business's configured **single agent** Q&A inside a **任务工作区** (resolved via `/api/business-mapping`; `resolveTaskDeeplinkTarget` calls `persistTaskContext({taskId, agentId, openingText})` and navigates to the `…/chats` **index**, which opens the latest task conversation or 新建 — a 1:N task↔对话 workspace, NOT `pendingAgentMessage`); the `-A` suffix (`3qfx-A`/…) → **multi-agent roundtable** with `roundtablePrefill.businessCode` so the page auto-selects the configured 业务链条. **xdfx's deep-link `?taskId=` is actually an 行动id, not a 任务id** — `resolveDeeplinkTaskId(goPath, rawId)` (called in `LoginPage` before everything) detects `xdfx`/`xdfx-A` and resolves it via `GET {action_detail_url}/{actionId}` → `data.taskId` (`fetchTaskIdFromAction`; `action_test`+`mock.action_detail` for offline testing); the resolved 任务id then drives `cop-task-detail`, the purpose tree, and the 1:N binding (other businesses pass the id through unchanged). **xdfx additionally partitions its chat records by 行动id (action_id), NOT by task_id**: `resolveTaskDeeplinkTarget` sets `partitionByAction:true` + keeps the raw action_id as `TaskContext.actionId`, so new threads are tagged `metadata.{taskId,actionId}` (taskId kept only to preserve the backend「任务深链对话全局共享」semantics, which keys off `metadata.taskId`) and the conversation list filters by `actionId` (+`agent_id`) — different actions of the same task get separate lists. xdfx's first-question opening text also appends `行动id（action_id）为…` (see `buildOpeningText` / `taskThreadMetadata`). goPath→businessCode: `3qfx`→`3Q`, `rwfx`→`6BF`, `xdfx`→`7BF`. The roundtable target also threads the URL `taskId` into `roundtablePrefill.taskId` (`resolveTaskDeeplinkTarget(goPath, detail, taskId)`), which turns on two taskId-scoped behaviors: (1) **separate, unpartitioned per-task storage** — taskId 会商聊天记录 live in their **own** store/table (`roundtable_task_drafts`), keyed **only by `task_id`** (one taskId = many records, shared across users, **no user 分权** at all; `created_by` is audit-only), kept entirely out of the per-user personal store (`roundtable_drafts`, now strictly per-user) so the two never mix. Backend router `/api/roundtable-task-drafts` (`GET /by-task/{id}` + `/by-task/{id}/latest`, `POST`, `GET/PUT/DELETE /{id}` — all user-agnostic); frontend client `roundtable-planning/api/task-drafts.ts`, and `useDraftPersistence`/`useRoundtableDrafts` route **all** CRUD to it when a `taskId` is present (else the personal `drafts.ts`). The matching **background jobs** are shared by task too: `roundtable_jobs.task_id` marks a task job; reads/dedup/stream/resume/cancel pass `?task_id=` so any user opening the task sees the same running 研讨 (progress/flowchart), and the executor writes the final report back to the task-draft store. Existing rows are moved over by `scripts/migrate_roundtable_task_drafts.py` (migration `20260618_01`). The history dropdown filters to the task and 新建 keeps the binding; (2) **Step-3 auto structured output** — after the `roundtable-summary` agent writes the Markdown report it automatically runs a second round emitting a `flow-json` flowchart (`useStep3Summary` `autoFlow`+`chainLevels`), whose hierarchy follows the business chain's stage goals (任务 → 目的 → 行为体 → …; coordinatorPrompt-specified hierarchy wins) and whose nodes never carry 阶段编号/阶段名 (the prior bug). **Both targets render embedded under the 任务管理 layout** — nested routes under `task-management/<business-path>/{roundtable,agent/:agent_id/chats}` in `StrategyRoutes.tsx` (`<business-path>` = `plan-task-sentiment` / `plan-task/plan-task-fx` / `plan-task/plan-task-action`, matching the COH中任务 menu paths in `sidebar-menu.ts`) so the global sidebar keeps 任务管理 → COH中任务 → the matching business highlighted. **All three single-agent businesses share `TaskFxWorkspace`** (`task-components/TaskFxWorkspace.tsx`): left = a「当前任务」card (`readCopTaskDetail()` 任务名称 + 简介, desensitized, 留存 above 新建对话) + per-task 1:N conversation list (`useTaskThreads(taskId, agentId, actionId?)` — filtered by **both** `metadata.taskId` AND `metadata.agent_id` so the three businesses' conversations staLine truncated
|
|
||||||
- **iframe 嵌入模式 (外部系统用 iframe 套用深链问答/会商)** — 三个**按标签页**开关，全部由深链 URL 参数开启、存进同一份 `sessionStorage` 会话（`embed.session`，键名常量在 `core/embed/embed-session.ts`），跨登录跳转/刷新/页内导航存活，**绝不跨标签污染**同浏览器另开的正常系统页。核心隔离手法：用 `sessionStorage`（按标签页/浏览上下文隔离，iframe 即便同源也有独立一份）而非 `localStorage`（跨标签共享）。开关：(1) **`?embed=1`（可带 `&theme=`）** — 去全局 chrome（`PageLayout` 的 `pageSidebarAllowed && !isEmbedActive()` → 隐藏 Header + PageSidebar）+ 按外部主题色**强制**明/暗：走 next-themes 的 `forcedTheme`（`App.tsx` `AppProviders` 调 `resolveForcedEmbedTheme`，**不写** localStorage `strategy-theme`），离散映射 `dark-blue`/`dark`→深、其余→浅；嵌入侧**绝不**调 `setTheme`/`persistSidebarEnabled`（那俩落 localStorage 跨标签污染，`LoginPage` 据 `readEmbedParam` 跳过）。(2) **`?hideJump=1`** — 隐藏深链底部「快捷跳转」栏 `TaskJumpBar` 的两部分（底部「下一步」等按钮 + 右侧垂直居中悬浮菜单），单智能体问答 + 会商共用该栏，`isJumpBarHidden()` 为真时整条 `return null`。(3) **登录用户隔离** — 嵌入态下鉴权/身份键（`deerflow.auth` token、`userInfo`、`login.*`、`tools_token`、maxkey/userDetail token）全部经 `core/auth/scoped-storage.ts` 的 `authStorage()`（嵌入→sessionStorage / 正常→localStorage）读写，使 iframe 里登录的用户与正常登录用户**完全隔离**、互不覆盖；所有 token 读取都过 `getStoredAuth()`/`getAuthorizationHeaderValue()`（API 客户端 `core/api/*` 全走这俩），改中心函数即让全体调用方自动隔离；跨标签账号变更监听 `AuthSyncWatcher`（`core/auth/sync.tsx`）在嵌入态禁用。嵌入会话在 `main.tsx` 渲染前 `syncEmbedSessionFromCurrentUrl()` 同步启用（早于任何鉴权写入，避免首帧 effect 顺序漏写 localStorage）；`AppProviders` 的 effect 再按 SPA 导航同步。`embed=0`/`hideJump=0` 可显式关闭。正常（非嵌入）标签页所有 `isXxx()` 恒 false，行为**零变化**。第三个开关 `?isolate=1`（**独立登录会话**）把同一套**登录用户隔离**单独提供给**普通（带 chrome）标签页**——只切换鉴权存储、不去 chrome / 不强制主题 / 不动跳转栏：`authStorage()` 的条件从「仅嵌入」放宽为 `isEmbedActive() || isIsolatedSession()`，`AuthSyncWatcher` 的跨标签监听对嵌入态**或**独立态都即时忽略（handler 内实时判，运行时开关也即刻生效）。除 URL 参数外，**设置 → 外观 →「登录会话」** 有一个 Switch「独立登录会话（本标签页）」运行时切换（`setIsolatedSession`，`appearance-settings-page.tsx`）：**开启时先 `migrateAuthToSession()`**（`scoped-storage.ts`，把 localStorage 的受保护键 `deerflow.auth`/`userInfo`/`userId`/`tools_token` + `login.*` 前缀快照搬进 sessionStorage）再翻标志，故无感不登出；此后本标签页登录态独立——别处登录/换号影响不到它，它换号也影响不到别人，但关掉该标签即结束（需重登）。开启给 toast 提示。
|
|
||||||
|
|
||||||
### Configuration
|
|
||||||
|
|
||||||
Backend config lives in `offline-backend-20260512/backend/config.yaml`. Values starting with `$` resolve as environment variables (e.g., `$OPENAI_API_KEY`). MCP servers and skills are configured in `extensions_config.json` in the same directory.
|
|
||||||
|
|
||||||
## Detailed Backend Reference
|
|
||||||
|
|
||||||
The backend has its own comprehensive documentation at:
|
|
||||||
- `offline-backend-20260512/backend/AGENTS.md` — architecture, middleware chain, all API routes, config schema, sandbox/memory/subagent systems
|
|
||||||
- `offline-backend-20260512/backend/README.md` — setup guide, technology stack
|
|
||||||
@@ -79,23 +79,12 @@ The frontend (`frontend-web/`) is a React 19 + Vite SPA:
|
|||||||
|
|
||||||
- **Routing**: React Router v7; top-level routes in `src/pages/PageRoutes.tsx`, workspace sub-routes in `src/pages/WorkspaceRoutes.tsx`
|
- **Routing**: React Router v7; top-level routes in `src/pages/PageRoutes.tsx`, workspace sub-routes in `src/pages/WorkspaceRoutes.tsx`
|
||||||
- **Pages**: `ChatPage` (thread chat), `AgentChatPage` (custom agent chat), `AgentsPage`/`NewAgentPage` (agent management), `ScheduledTasksPage`/`ScheduledTaskRunDetailPage` (scheduled tasks), `LightAppManagementPage`/`LightAppListPage`/`LightAppIframeView` (轻应用中心 — register/list/embed mini-apps)
|
- **Pages**: `ChatPage` (thread chat), `AgentChatPage` (custom agent chat), `AgentsPage`/`NewAgentPage` (agent management), `ScheduledTasksPage`/`ScheduledTaskRunDetailPage` (scheduled tasks), `LightAppManagementPage`/`LightAppListPage`/`LightAppIframeView` (轻应用中心 — register/list/embed mini-apps)
|
||||||
- **定时任务「JSON → HTML 模板填充」(模板数据转换器)**: a third scheduled-task execution mode. In the create/edit dialog (`ScheduledTasksPage.tsx`), selecting the built-in agent **「模板数据转换器」** (`execution_agent_name === "template-json-builder"`, `TEMPLATE_BUILDER_AGENT_ID`) reveals a 「HTML模板」 select (`useHtmlTemplates` → `GET /api/scheduled-tasks/html-templates`) + a **.json 上传** button (reads the file's text into the prompt box) and **hides** the 必须生成 HTML/Markdown switches (this mode always outputs HTML). The chosen template persists as `execution_context.template_config.template_id` (`TemplateFillConfig` in `core/scheduled-tasks/types.ts`). At run time the backend converts the source JSON (the task prompt) into that template's `DATA` structure, validates (retry-on-fail), fills the template, and stores an HTML page previewable via the existing run-detail HTML preview. The source can be **pure JSON, plain text, or text-with-embedded-JSON** — the backend pre-extracts any embedded JSON and the agent's `SOUL.md` maps it (or the plain text's semantics) to the template's schema skeleton. **Chat-page debug entry (only this agent's `AgentChatPage`)**: when `agent_id === "template-json-builder"`, the chat header shows a 「页面模板」 select + a 「渲染预览」 button — after a normal Q&A run, the button takes the **latest AI reply**, POSTs it to `POST /api/scheduled-tasks/template-fill/render` (`renderTemplateFill`), and pops a dialog rendering the filled HTML in a `sandbox="allow-scripts"` iframe plus the structure-validation status/errors/gaps — for debugging the agent's conversion effect without creating a scheduled task. Gated strictly on the agent id, so other agents' chat pages are untouched. See the backend CLAUDE.md「Template-fill mode」for the engine (`deerflow/runtime/scheduler/template_fill.py`), agent seed, dispatch, and the render API.
|
|
||||||
- **AI 写作·对话版（对话驱动写作台）**: a **parallel new entry** beside the classic AI-writing page (classic page/routes untouched) — route `/page/canvas/ai-writing-chat` (`OpenCanvasRoutes.tsx`), sidebar 「问答管理 → 课题研究(对话版)」. Page `open-canvas/pages/AIWritingChatPage.tsx` fully **reuses the engine** (`AIWritingContext` state machine + LangGraph `useStream`, `AIWritingHistoryProvider`, right-side `AIWritingDraftPanel`) but replaces the presentation: left = `components/ai-writing-chat/WritingChatPanel.tsx` (timeline + **button-only intervention cards** `ChatInterventionCards.tsx` — the five pause cards copied from `InterventionCard.tsx` with all inline textareas removed, confirm/action buttons kept — plus a bottom **unified smart composer**). Free text goes through two-level intent resolution (`open-canvas/api/ai-writing-intent.ts`): deterministic short-phrase fast path (确认/继续/重新搜索/重写大纲…; high-cost actions never fast-pathed) then `POST /api/ai-writing/sessions/{id}/intent` — the backend reads the graph checkpoint (authoritative pause point from the pending interrupt) and routes via `deerflow/agents/ai_writing/intent_router.py` (LLM + strict per-pause action whitelist aligned to the graph's real resume actions, confidence gates: finalize/force_finalize/覆盖式 re_search need ≥0.85 else clarify, payload key-whitelist cleaning). Results map to `submitIntervention`/control (暂停/继续/后台挂起)/QA bypass (`answer` rendered as a chat bubble, never touches graph state)/clarify (amber follow-up bubble with multi-turn context). **Two-state layout**: idle (未开始写作) renders the **classic setup experience unchanged** — `WritingSetupChat` + collapsible `AIWritingPanel` form under `WritingFormProvider` (same as `AIWritingPage`'s idle branch); once writing starts (or history view opens) it switches to the chat workbench. **Unified chronological feed** (`ChatFlowTimeline.tsx`): intent-layer chat bubbles are interleaved INTO the progress-event timeline by anchor (= `progressEvents.length` at message creation), so events triggered by a user message render **below** it (Google-AI-Studio-style single stream, not timeline-above/chat-below); composer-driven interventions suppress the duplicate 「我的要求」card (`suppressedRequirementIndices`). **素材不足自动续跑** only at `material_confirm` (the only pause the graph supports re-search from): needResearch caches the payload as a pending intent, submits `re_search + userQuery`, and auto-submits the pending intent when the new material-confirm pause arrives (cancellable pill). Stage chips + per-stage placeholder + 「当前交互对象」status badge. Backend tests `tests/test_ai_writing_intent.py`. Plan doc: `frontend-web/docs/ai-writing-对话驱动写作台-实现方案.md`.
|
|
||||||
- **轻应用中心 (Light App Center)**: a sibling of 任务管理 in the sidebar with two pages — 应用管理 (admin registers `window_open` or `iframe` mini-apps with a route-param builder: login params resolved from `localStorage.userInfo`, theme params literal) and 应用列表 (card grid of `window_open` apps, `window.open` launch). `iframe` apps are mounted under a chosen parent menu (XK/PG/TY/综合管理) and **dynamically injected into the sidebar** by `core/page-layout/use-sidebar-menu.ts` (`useSidebarMenuItems`), opening in the `LightAppIframeView` host. Client + React Query hooks in `strategy-components/api/light-apps.ts`; URL builder/constants in `strategy-components/lib/light-app.ts`. Backend: `/api/light-apps` (global/shared, admin-gated writes).
|
- **轻应用中心 (Light App Center)**: a sibling of 任务管理 in the sidebar with two pages — 应用管理 (admin registers `window_open` or `iframe` mini-apps with a route-param builder: login params resolved from `localStorage.userInfo`, theme params literal) and 应用列表 (card grid of `window_open` apps, `window.open` launch). `iframe` apps are mounted under a chosen parent menu (XK/PG/TY/综合管理) and **dynamically injected into the sidebar** by `core/page-layout/use-sidebar-menu.ts` (`useSidebarMenuItems`), opening in the `LightAppIframeView` host. Client + React Query hooks in `strategy-components/api/light-apps.ts`; URL builder/constants in `strategy-components/lib/light-app.ts`. Backend: `/api/light-apps` (global/shared, admin-gated writes).
|
||||||
- **菜单管理 (Menu Management, admin-only)**: an **overlay** over the static sidebar menu — `MenuManagementPage` (`pages/MenuManagementPage.tsx`, route `/page/strategy/admin/menu-management`, opened from the admin-only 「菜单管理」 item in the **bottom-left settings dropdown** of `components/page-sidebar.tsx`). Admins rename / 停用·启用 / reorder (↑↓ or @dnd-kit drag) / re-parent (horizontal drag **or** the edit dialog's 「移动到」parent selector) any node across 一级/二级/三级, **including injected iframe light-app nodes** (`light-app-<appId>`). The static tree (`core/page-layout/sidebar-menu.ts`) stays the source of icons/routes; only per-node deltas (`label`/`disabled`/`parentId`/`sortOrder`) persist to the backend. Merge logic in `core/page-layout/menu-overrides.ts` (`applyMenuOverrides`, applied in `use-sidebar-menu.ts` after light-app injection, before role filter; disabling a node hides its whole subtree) — strict **3-level cap** (`wouldExceedDepth`). Client `strategy-components/api/menu-overrides.ts`. Backend: `/api/menu-overrides` (global/shared; open read, admin atomic replace-all).
|
|
||||||
- **白名单管理 (Login Whitelist, admin-only)**: gates **who may log in**, run as a **blocklist (黑名单模式)**. Two pieces: a global master switch (`system_settings.json → login_whitelist.enabled`, surfaced by **admin-only** `GET|PUT /api/system-settings/login-whitelist`) + a per-user **放行** flag (`users.approved` column, migration `20260625_02`). Users **self-register** as usual and **every new account defaults to `approved=True`** — so a user who has never logged into this system before is allowed straight through; the switch only blocks users an admin has explicitly **取消放行** (`approved=False`). (`create_user`/`User`/`UserRow` all default `approved=True`; admins are always approved; existing rows are backfilled `True`.) Login interception is the single helper `enforce_user_approved(user)` in `app/gateway/routers/auth.py`, called in all three login endpoints (`/login/{local,username,token}`) **after** the account is resolved/created and **before** the JWT is issued: switch off → everyone passes; `system_role=="admin"` → always passes (anti-lockout); else `approved=False` (admin-revoked) → 403 `{code:"PENDING_APPROVAL"}` (the frontend's `extractErrorMessage` surfaces the message and login throws before writing any auth state, so no half-login). Admin approves on `pages/LoginWhitelistPage.tsx` (route `/page/strategy/admin/login-whitelist`, entry「白名单管理」in the bottom-left settings dropdown of `components/page-sidebar.tsx`, both sidebar modes): a top master-switch + a list of all registered users (`GET /api/v1/auth/users`, now carrying `approved`) with a per-row 放行 Switch (`PUT /api/v1/auth/users/{id}/approval`, admin-only; revoking only blocks the **next** login — `token_version` is left untouched, existing sessions are not force-killed). Client/hooks: switch in `strategy-components/api/login-whitelist.ts`, user list + approval in `core/auth/{api,hooks}.ts` (`useSetUserApproval`). Backend tests: `tests/test_login_approval.py`. **账号级「登录口令」(per-account password — 临时开通)**: the same page also lets an admin assign one specific account an individual **plaintext** password (`users.login_password` column, migration `20260625_04`, nullable; auto-added on startup by `_ensure_orm_columns_sync`). Once set, **that account's** username login (`POST /api/v1/auth/login/username`) **requires** `?password=` to exactly match it and that personal password **takes precedence over** the global shared-password gate (`username_login.require_password`); accounts without one keep today's shared-gate / passwordless behavior. The user then logs in via the **existing** frontend URL `#/login/<用户名>?password=xxxx` (LoginPage already forwards `?password=`; `<用户名>` = the account's email `@`-prefix). **Plaintext is intentional** — the password rides in the URL query anyway, so storing it readably lets the admin re-copy the full login link from the page; it is exposed only on the **admin-only** `GET /api/v1/auth/users` (`UserListItem.login_password`) and the new admin-only `PUT /api/v1/auth/users/{id}/login-password` (set non-empty / clear with null·empty; doesn't touch `token_version`). The whitelist page renders a per-user 「登录口令」 column with a set/修改 editor + a live 「复制登录链接」 button (`useSetUserLoginPassword` in `core/auth/hooks.ts`, `setUserLoginPassword` in `core/auth/api.ts`). Backend gate helper `_lookup_user_by_username` (lookup-only, no auto-register) in `routers/auth.py`; tests `tests/test_login_personal_password.py`.
|
|
||||||
- **敏感词管理 (Sensitive Word Management)**: configures the **展示层脱敏映射** (原始词 → 替换词). **Gated on the username `lqq`** (not the admin role) — `getAccountDisplayName().toLowerCase() === "lqq"` (username = email `@` prefix, else `user_id`, same as the profile page); the dropdown entry, the route guard, and the page-level guard all use this check. `src/lib/desensitize.ts` ships a frozen seed map `SEED_DESENSITIZE_MAP` (the deployment seed) plus a live mutable `DESENSITIZE_MAP` (initialized from the seed so `desensitize()` works before any fetch). `DesensitizeWordsLoader` (mounted in `App.tsx` `AppProviders`) fetches `/api/sensitive-words` on startup and, if non-empty, calls `replaceDesensitizeMap(...)` to make the backend config the source of truth (empty/failed → keep seed). Page `SensitiveWordsPage.tsx` (route `/page/strategy/admin/sensitive-words`, opened from the 「敏感词管理」 item in the **bottom-left settings dropdown** of `components/page-sidebar.tsx`, present in **both** full + collapsed sidebar modes) lists/adds/edits/启停/deletes words and saves the **whole set atomically** (replace-all); a 「导入种子词」 button merges any missing `SEED_DESENSITIZE_MAP` entries into the editor. Client + hooks in `strategy-components/api/sensitive-words.ts` (`wordsToMap` folds enabled rows into the runtime map). Backend: `/api/sensitive-words` (global/shared; open read, write allowed for admin **or** the `lqq` account), mirroring 菜单管理's store shape. **侧边栏 + 导航栏 menu labels are desensitized** at the data source: `useSidebarMenuItems`/`useActiveThirdLevel` (`core/page-layout/use-sidebar-menu.ts`) map every node's `label` through a desensitizer built **directly from the `/api/sensitive-words` query** (`makeDesensitizer(wordsToMap(words))`, falling back to the global seed `desensitize` while empty) — this sidesteps the `replaceDesensitizeMap` effect-timing race. Only `label` is rewritten; `path`/`id`/`icon` are untouched so routing/highlight are unaffected. All nav surfaces (`page-sidebar.tsx`, `page-sidebar-dark.tsx`, `page-sidebar-v1.tsx`, `strategy-components/Header.tsx`, `PageRoutes.tsx`) consume this hook and are covered; `MenuManagementPage` uses the raw tree so admins still edit real labels.
|
|
||||||
- **技能地址管理 (Skill Address Management, admin-only)**: 扫描运行中的技能（`skills/{public,custom}` 下所有 `.md`/`.py`）里的 **http(s) URL 与 IP/IP:端口**，按唯一地址聚合全部出现位置（跨 .md/.py），支持**批量替换**（如把 UAT 地址一次性改成生产）。主体抽成可复用组件 `SkillAddressesPanel`（`pages/SkillAddressesPage.tsx` 导出，默认导出 `SkillAddressesPage` 仍保留旧路由 `/page/strategy/admin/skill-addresses` 作直链回退），**作为「技能地址管理」标签页嵌入管理员「技能管理」页 `pages/AdminSkillsPage.tsx`**（该页加 Tabs：「技能列表」+「技能地址管理」；入口在「设置和更多」下拉的「技能管理」`workspace-nav-menu.tsx` → `/page/workspace/admin/skills`，不再单列于 `components/page-sidebar.tsx` 左下角设置下拉）：打开自动扫描并带**进度条**（扫描逐技能 / 应用逐文件 X/N，应对 150+ 技能），URL/IP 类型过滤 + 搜索 + 「片段批量套用」（如所有 `uat.4.cn` → `prod.4.cn`）、每地址「替换为」输入框（可展开看 `file:line` 片段）、内联**预览**、**应用**、**多关键词检索**（空格分隔全部命中），以及**修改记录**面板——每次应用生成一条记录（显示时间/改了哪些地址 from→to/文件数/处数），可**针对单次记录回退**（二次确认）。client + NDJSON 流式解析在 `strategy-components/api/skill-addresses.ts`。后端 `/api/skill-addresses`（**仅管理员**）：所有文件 IO 走 `asyncio.to_thread` 不阻塞事件循环；`GET /scan`(+`/scan/stream`)、`POST /preview`、`POST /apply`(+`/apply/stream`)、`GET /backups`、`POST /rollback/{id}`；**子串安全替换**（基于 token span，不会误伤子串）、`expected_total` 乐观锁（409）、写前自动磁盘备份到 `{skills_root}/.address-edits/`（同时写一份 `{id}.manifest.json` 记录本次替换明细，供修改记录展示）、应用后刷新技能系统提示缓存。纯引擎 `deerflow/skills/address_scan.py`，router `app/gateway/routers/skill_addresses.py`，tests `tests/test_skill_addresses.py`。范围仅运行中技能，不动 `deploy/minimal/skills/`。
|
|
||||||
- **按钮管理 (Task Button Management, admin-only)**: configures the **可配置跳转按钮** rendered in the left task panel of the task deep-link workspaces (rwfx / 3qfx / xdfx, see `TaskFxWorkspace`). Each button = `{business, label, linkType, target, appendTaskId, idParam, idKind, openMode, loginParams, appendAuth, authTokenParam, authNameParam, enabled, sortOrder}`; `linkType` is `url` (外链 `window.open`, optional append of `?{idParam}={id}` — **`idParam` is the editable query-param name**, e.g. `id`/`task_id`), `business` (内部切换到另一业务, reuses `resolveTaskDeeplinkTarget`, always task id), or `purpose` (弹出当前任务的「任务目的」表格 via the shared `TaskPurposeDialog`, no target — configurable for any page incl. xdfx). **`url` buttons support two independent, coexisting login-append mechanisms**: (1) **`loginParams` (追加登录参数, like 应用管理/Light App Center)** — a list of `{key, source, customValue}` resolved at click time: `runTaskButton` reads `userInfo` (via `readUserInfo` from `strategy-components/lib/light-app`, embed-isolated through `authStorage`) and appends `?{key}={value}` for each (`source` = a userInfo field such as `accessToken`/`yUserId`, or `other` → literal `customValue`); empty list = nothing appended. Reuses `LOGIN_SOURCE_OPTIONS` from light-app; stored as JSON column `task_buttons.login_params_json` (`PortableJSON`, migration `20260625_01`). (2) **`appendAuth` (追加登录态)** — appends `?{authTokenParam}={token1}&{authNameParam}={username}` (default param names `token`/`username`) so the跳转目标外部系统 can identify the current user — e.g. `…/action/sentiment?token=<JWT>&username=lizhaoxing`. **Gated on token login**: `token1` = the `?authToken=` used by token-exchange login; `username` = the raw login name the backend resolved from `getTokenInfo`. Both are stashed at login by `persistLoginCredentials` into `login.token1`/`login.username` (`core/auth/login-credentials.ts`, scoped via [[scoped-storage]] so嵌入/独立会话隔离 + 随独立会话迁移). Only token login writes them → a non-token-login session has no `token1`, so `runTaskButton` silently skips the auth append (the jump still works, just without those two params). The frontend reads `username` straight from the new `UsernameLoginResponse.username` field (the stored email local-part is lossy — lowercased/normalized — so not used), **not** by decoding the JWT. Stored as columns `task_buttons.{append_auth, auth_token_param, auth_name_param}` (migration `20260625_02`). The admin page renders both editors for `url` buttons (loginParams 虚线框 + 追加登录态 switch). **`idKind` (`task`/`action`) only matters for xdfx**: its deep-link `?taskId=` is an 行动id and the 任务id is resolved at login (`fetchTaskIdFromAction`) — `TaskContext` now also stashes the raw `actionId`, so a url button can append either (default `task`). Page `TaskButtonsPage.tsx` (route `/page/strategy/admin/task-buttons`, **admin-gated**, entry「按钮管理」in the bottom-left settings dropdown of `components/page-sidebar.tsx`, both full + collapsed modes) has per-business tabs, edits name/type/target/启停/排序/增删, saves the **whole set atomically** (replace-all), plus 「导入默认」 to merge code-seed defaults. **Seed/fallback** (like 敏感词管理): only when the whole table is empty (fresh deploy, never saved) do the workspace + page fall back to `defaultTaskButtons(cfg)` — rwfx's url buttons (编辑/上一步/下一步/3q详情) built from the **live** `/api/public/config/task-deeplink` plus cross-business switch buttons for **all three** businesses (each switches to the other two — rwfx→三情/行动, 3qfx→任务/行动, xdfx→任务/三情). Once saved, the store is the sole source of truth. **Bottom 快捷跳转 bar groups by prev/next**: `TaskJumpBar` renders only「上一步/下一步」-type buttons in the bottom bar — a `prev` group (id 含 `prev` 或文案「上一步」, 描边次要样式 + ←图标) rendered **左侧**, then a `next` group (id 含 `next` 或文案「下一步」, 实心主色) on the **右侧** (container `justify-end`); everything else goes to the right-edge floating menu. The default 上一步 button (`rwfx-prev`, `url`, target = `DASHBOARD_AGENT_ROUTE` `/page/strategy/dashboard-agent`, `appendTaskId` + `idParam=taskId` → `?taskId=任务id`, `openMode=self`) 默认指向**应用内**「大屏绘制」页，在 **both** 单智能体 (`TaskFxWorkspace`) 与 多智能体会商 (`RoundtablePlanningPage` 深链 rwfx-A) 都显示（共用 `TaskJumpBar`）。**`runTaskButton` 的 `url` 类型支持应用内路由**：target 以单个 `/` 开头时按内部路由处理——`self` 走 react-router 同窗导航（不刷新），`blank` 拼成当前源的 hash 路由新标签打开；外链行为不变。 The old hardcoded jump buttons were migrated out: `TaskFxWorkspace` no longer hardcodes 切换到三Line truncated
|
|
||||||
- **实时并发监控 (Concurrency / System-Pressure Monitor, admin-only)**: a live panel mounted at the **top of the admin 排行榜 page** (`components/workspace/admin/concurrency-monitor.tsx` `ConcurrencyMonitorPanel`, rendered in `pages/AdminUserLeaderboardPage.tsx`) showing **当前并发的大模型调用数 + 列表（用户/智能体/类型/已运行时长）**, each row with a 「停止」button (and a 「全部停止」) that **truly aborts** that run's in-flight model stream via `RunManager.cancel` (`POST /api/admin/active-runs/{run_id}/cancel`) — to relieve pressure when 使用人数过多. Two line charts (minute/hour toggle): **并发量折线图** (peak/avg, `GET /api/admin/active-runs/concurrency`, fed by a lightweight background sampler into `concurrency_samples`) and **大模型出字速度折线图** (tokens/sec, `GET /api/admin/active-runs/token-speed`, aggregated from `llm_call_metrics`) so a dip pinpoints where the bottleneck is. A **「后台采样」Switch** (`system_settings.json → concurrency_monitor.enabled`, **default off / opt-in**, `GET|PUT /api/admin/active-runs/settings`) turns the background sampling on/off **at runtime, no restart** (the live concurrency count + 「停止」 work even while sampling is off — only the 并发量 history chart needs it on); everything is designed to **never impact production** (one tiny INSERT/15s, retention-purged, best-effort). Client/hooks: `core/admin/active-runs.ts` + `core/admin/hooks.ts` (`useActiveRuns`/`useConcurrencySeries`/`useTokenSpeedSeries`/`useCancel*`/`useMonitorSettings`). See the backend CLAUDE.md「Admin Concurrency Monitor」.
|
|
||||||
- **会话冲突 409 中文化**: when a user submits a new question while the previous turn is still streaming, the backend's `RunManager.create_or_reject` rejects with HTTP 409 (`services.py` now returns a **Chinese** detail「当前对话还在生成回答…」). `core/threads/hooks.ts` `onError` detects the conflict (`isActiveRunConflictError`: 409 / "already has an active run" / the Chinese text) and shows a friendly `toast.info` instead of a raw error.
|
|
||||||
- **State**: TanStack Query for server state, context providers (`SubtasksProvider`, `ArtifactsProvider`, `PromptInputProvider`) scoped to `WorkspaceRoutes`
|
- **State**: TanStack Query for server state, context providers (`SubtasksProvider`, `ArtifactsProvider`, `PromptInputProvider`) scoped to `WorkspaceRoutes`
|
||||||
- **LLM streaming**: `@langchain/langgraph-sdk` streams messages from the backend via SSE
|
- **LLM streaming**: `@langchain/langgraph-sdk` streams messages from the backend via SSE
|
||||||
- **UI**: Radix UI primitives + TailwindCSS v4 + shadcn-style components in `src/components/ui/`
|
- **UI**: Radix UI primitives + TailwindCSS v4 + shadcn-style components in `src/components/ui/`
|
||||||
- **Shims**: `src/shims/` provides `next/link` and `next/navigation` polyfills (original code was Next.js)
|
- **Shims**: `src/shims/` provides `next/link` and `next/navigation` polyfills (original code was Next.js)
|
||||||
- **Login URL params** (`LoginPage.tsx`, frontend-only — the backend never sees these): besides the auth params (`ticket`/`userId`/`env`/`theme`/`yUserId`/`token`/`access_token`/`authToken`/`password`), the page supports a **task deep-link** via `?taskId=&goPath=`. After login it calls the consumer API `GET {VITE_AIPI_CONSUMER_URL}/taskAnalyseSearch/cop-task-detail?taskId=` (header `Authorization: Bearer admin`, auto-injected by `utils/request.ts`), stashes the full `data` (`id/overview/taskDirection/taskName/taskContent`) into `sessionStorage["login.copTaskDetail"]`, then routes by `goPath`: base codes `3qfx`/`rwfx`/`xdfx` → that business's configured **single agent** Q&A inside a **任务工作区** (resolved via `/api/business-mapping`; `resolveTaskDeeplinkTarget` calls `persistTaskContext({taskId, agentId, openingText})` and navigates to the `…/chats` **index**, which opens the latest task conversation or 新建 — a 1:N task↔对话 workspace, NOT `pendingAgentMessage`); the `-A` suffix (`3qfx-A`/…) → **multi-agent roundtable** with `roundtablePrefill.businessCode` so the page auto-selects the configured 业务链条. **xdfx's deep-link `?taskId=` is actually an 行动id, not a 任务id** — `resolveDeeplinkTaskId(goPath, rawId)` (called in `LoginPage` before everything) detects `xdfx`/`xdfx-A` and resolves it via `GET {action_detail_url}/{actionId}` → `data.taskId` (`fetchTaskIdFromAction`; `action_test`+`mock.action_detail` for offline testing); the resolved 任务id then drives `cop-task-detail`, the purpose tree, and the 1:N binding (other businesses pass the id through unchanged). **xdfx additionally partitions its chat records by 行动id (action_id), NOT by task_id**: `resolveTaskDeeplinkTarget` sets `partitionByAction:true` + keeps the raw action_id as `TaskContext.actionId`, so new threads are tagged `metadata.{taskId,actionId}` (taskId kept only to preserve the backend「任务深链对话全局共享」semantics, which keys off `metadata.taskId`) and the conversation list filters by `actionId` (+`agent_id`) — different actions of the same task get separate lists. xdfx's first-question opening text also appends `行动id（action_id）为…` (see `buildOpeningText` / `taskThreadMetadata`). goPath→businessCode: `3qfx`→`3Q`, `rwfx`→`6BF`, `xdfx`→`7BF`. The roundtable target also threads the URL `taskId` into `roundtablePrefill.taskId` (`resolveTaskDeeplinkTarget(goPath, detail, taskId)`), which turns on two taskId-scoped behaviors: (1) **separate, unpartitioned per-task storage** — taskId 会商聊天记录 live in their **own** store/table (`roundtable_task_drafts`), keyed **only by `task_id`** (one taskId = many records, shared across users, **no user 分权** at all; `created_by` is audit-only), kept entirely out of the per-user personal store (`roundtable_drafts`, now strictly per-user) so the two never mix. Backend router `/api/roundtable-task-drafts` (`GET /by-task/{id}` + `/by-task/{id}/latest`, `POST`, `GET/PUT/DELETE /{id}` — all user-agnostic); frontend client `roundtable-planning/api/task-drafts.ts`, and `useDraftPersistence`/`useRoundtableDrafts` route **all** CRUD to it when a `taskId` is present (else the personal `drafts.ts`). The matching **background jobs** are shared by task too: `roundtable_jobs.task_id` marks a task job; reads/dedup/stream/resume/cancel pass `?task_id=` so any user opening the task sees the same running 研讨 (progress/flowchart), and the executor writes the final report back to the task-draft store. Existing rows are moved over by `scripts/migrate_roundtable_task_drafts.py` (migration `20260618_01`). The history dropdown filters to the task and 新建 keeps the binding; (2) **Step-3 auto structured output** — after the `roundtable-summary` agent writes the Markdown report it automatically runs a second round emitting a `flow-json` flowchart (`useStep3Summary` `autoFlow`+`chainLevels`), whose hierarchy follows the business chain's stage goals (任务 → 目的 → 行为体 → …; coordinatorPrompt-specified hierarchy wins) and whose nodes never carry 阶段编号/阶段名 (the prior bug). **Both targets render embedded under the 任务管理 layout** — nested routes under `task-management/<business-path>/{roundtable,agent/:agent_id/chats}` in `StrategyRoutes.tsx` (`<business-path>` = `plan-task-sentiment` / `plan-task/plan-task-fx` / `plan-task/plan-task-action`, matching the COH中任务 menu paths in `sidebar-menu.ts`) so the global sidebar keeps 任务管理 → COH中任务 → the matching business highlighted. **All three single-agent businesses share `TaskFxWorkspace`** (`task-components/TaskFxWorkspace.tsx`): left = a「当前任务」card (`readCopTaskDetail()` 任务名称 + 简介, desensitized, 留存 above 新建对话) + per-task 1:N conversation list (`useTaskThreads(taskId, agentId, actionId?)` — filtered by **both** `metadata.taskId` AND `metadata.agent_id` so the three businesses' conversations staLine truncated
|
- **Login URL params** (`LoginPage.tsx`, frontend-only — the backend never sees these): besides the auth params (`ticket`/`userId`/`env`/`theme`/`yUserId`/`token`/`access_token`/`authToken`/`password`), the page supports a **task deep-link** via `?taskId=&goPath=`. After login it calls the consumer API `GET {VITE_AIPI_CONSUMER_URL}/taskAnalyseSearch/cop-task-detail?taskId=` (header `Authorization: Bearer admin`, auto-injected by `utils/request.ts`), stashes the full `data` (`id/overview/taskDirection/taskName/taskContent`) into `sessionStorage["login.copTaskDetail"]`, then routes by `goPath`: base codes `3qfx`/`rwfx`/`xdfx` → that business's configured **single agent** Q&A (resolved via `/api/business-mapping`, opening message in `sessionStorage.pendingAgentMessage`); the `-A` suffix (`3qfx-A`/…) → **multi-agent roundtable** with `roundtablePrefill.businessCode` so the page auto-selects the configured 业务链条. goPath→businessCode: `3qfx`→`3Q`, `rwfx`→`6BF`, `xdfx`→`7BF`. **Both targets render embedded under the 任务管理 layout** — nested routes under `task-management/<business-path>/{roundtable,agent/:agent_id/chats/:thread_id}` in `StrategyRoutes.tsx` (`<business-path>` = `plan-task-sentiment` / `plan-task/plan-task-fx` / `plan-task/plan-task-action`, matching the COH中任务 menu paths in `sidebar-menu.ts`) so the global sidebar keeps 任务管理 → COH中任务 → the matching business highlighted. The agent chat is rendered via `TaskEmbeddedAgentChat`, which passes `AgentChatPage`'s `chatBasePath` prop so the post-send URL rewrite + new-chat button stay in the task-management context (instead of the standalone `/agents/...` route). Any failure (no consumer URL / fetch error / unmapped goPath / no configured agent) silently falls back to the default home. Helpers: `core/auth/task-deeplink.ts`.
|
||||||
- **iframe 嵌入模式 (外部系统用 iframe 套用深链问答/会商)** — 三个**按标签页**开关，全部由深链 URL 参数开启、存进同一份 `sessionStorage` 会话（`embed.session`，键名常量在 `core/embed/embed-session.ts`），跨登录跳转/刷新/页内导航存活，**绝不跨标签污染**同浏览器另开的正常系统页。核心隔离手法：用 `sessionStorage`（按标签页/浏览上下文隔离，iframe 即便同源也有独立一份）而非 `localStorage`（跨标签共享）。开关：(1) **`?embed=1`（可带 `&theme=`）** — 去全局 chrome（`PageLayout` 的 `pageSidebarAllowed && !isEmbedActive()` → 隐藏 Header + PageSidebar）+ 按外部主题色**强制**明/暗：走 next-themes 的 `forcedTheme`（`App.tsx` `AppProviders` 调 `resolveForcedEmbedTheme`，**不写** localStorage `strategy-theme`），离散映射 `dark-blue`/`dark`→深、其余→浅；嵌入侧**绝不**调 `setTheme`/`persistSidebarEnabled`（那俩落 localStorage 跨标签污染，`LoginPage` 据 `readEmbedParam` 跳过）。(2) **`?hideJump=1`** — 隐藏深链底部「快捷跳转」栏 `TaskJumpBar` 的两部分（底部「下一步」等按钮 + 右侧垂直居中悬浮菜单），单智能体问答 + 会商共用该栏，`isJumpBarHidden()` 为真时整条 `return null`。(2.5) **`?hideChrome=1`** — **仅**去全局 chrome（Header 导航栏 + PageSidebar 侧边栏），**不**强制主题、**不**隔离鉴权（区别于 `embed`：只想要一个干净全屏页面，如「大屏绘制」`/page/strategy/dashboard-agent?taskId=…&hideChrome=1`）。新增 `EmbedSession.hideChrome` 字段 + `readHideChromeParam()` + `isChromeHidden()`（取 `embed || hideChrome` 之并），与 `hideJump` 完全对称；`PageRoutes.tsx` 的 `PageLayout` 把 `chromeHidden`（`isChromeHidden() || readHideChromeParam(location.search)==="on"`）并入 `pageSidebarAllowed`，且其**优先级高于** dashboard-agent 路由原本的强制全局 chrome（`forceChromeForDashboardAgent`）。`hideChrome=0` 可显式关闭。(3) **登录用户隔离** — 嵌入态下鉴权/身份键（`deerflow.auth` token、`userInfo`、`login.*`、`tools_token`、maxkey/userDetail token）全部经 `core/auth/scoped-storage.ts` 的 `authStorage()`（嵌入→sessionStorage / 正常→localStorage）读写，使 iframe 里登录的用户与正常登录用户**完全隔离**、互不覆盖；所有 token 读取都过 `getStoredAuth()`/`getAuthorizationHeaderValue()`（API 客户端 `core/api/*` 全走这俩），改中心函数即让全体调用方自动隔离；跨标签账号变更监听 `AuthSyncWatcher`（`core/auth/sync.tsx`）在嵌入态禁用。嵌入会话在 `main.tsx` 渲染前 `syncEmbedSessionFromCurrentUrl()` 同步启用（早于任何鉴权写入，避免首帧 effect 顺序漏写 localStorage）；`AppProviders` 的 effect 再按 SPA 导航同步。`embed=0`/`hideJump=0` 可显式关闭。正常（非嵌入）标签页所有 `isXxx()` 恒 false，行为**零变化**。第三个开关 `?isolate=1`（**独立登录会话**）把同一套**登录用户隔离**单独提供给**普通（带 chrome）标签页**——只切换鉴权存储、不去 chrome / 不强制主题 / 不动跳转栏：`authStorage()` 的条件从「仅嵌入」放宽为 `isEmbedActive() || isIsolatedSession()`，`AuthSyncWatcher` 的跨标签监听对嵌入态**或**独立态都即时忽略（handler 内实时判，运行时开关也即刻生效）。除 URL 参数外，**设置 → 外观 →「登录会话」** 有一个 Switch「独立登录会话（本标签页）」运行时切换（`setIsolatedSession`，`appearance-settings-page.tsx`）：**开启时先 `migrateAuthToSession()`**（`scoped-storage.ts`，把 localStorage 的受保护键 `deerflow.auth`/`userInfo`/`userId`/`tools_token` + `login.*` 前缀快照搬进 sessionStorage）再翻标志，故无感不登出；此后本标签页登录态独立——别处登录/换号影响不到它，它换号也影响不到别人，但关掉该标签即结束（需重登）。开启给 toast 提示。
|
|
||||||
- **操作日志（Y-Log）上报** — 用户的关键操作（登录登出/查询/查看/增删改/启停/导入导出/问答等）成功后，**前端直连**外部接口 `POST {write_url}`（默认 `https://ch1.b.uat.4.cn/api/y-log/write`）记一条审计日志。核心模块 `src/core/log/`：`y-log.ts`（`writeYLog(params)` + `OptType` 枚举 0/1/3..12；**异步即发即忘、永不 await、永不抛错、失败静默**，自动把完整 url 转相对路径去 ip/host、对象入参/返回自动 `JSON.stringify` + 50k 裁剪、`optResult` 恒 0 只报成功），`y-log-config.ts`（从公开只读 `GET /api/public/config/y-log` 拉 `{enabled, writeUrl}`，模块级缓存 + 去重 + 默认兜底；`App.tsx` `AppProviders` 启动预热 `fetchYLogConfig()`），`y-log-token.ts`（token1 = token 登录的 `?authToken=`，经 [[scoped-storage]] 的 `authStorage*` 存取，嵌入态自动隔离）。**双门控**：仅当①存在 token1（即用 token 登录，`LoginPage` 成功后 `persistYLogToken(authToken)`，登出 `account-settings-page.tsx` 先报后清 token1）且②配置 `enabled && writeUrl` 才上报；否则一律不发。`optDetail` 统一「CM助手-全量-…」（**禁内部框架名**）。埋点**广覆盖**各 API client 的成功路径——原则是「一个用户操作（查看/查询/新增/编辑/删除/启停/导入导出）= 一条日志」，每个 API client 的**单条详情 GET（查看→view 4）/ 列表查询 GET（search 3）/ 新增 POST（create 9）/ 改 PUT·PATCH（edit 5）/ 删 DELETE（delete 6）/ 启停（enabled 11 / disabled 10）/ 导入导出（import 7 / export 8）**都各落一条，仅跳过高频 typeahead/状态轮询/纯 bootstrap config 读。覆盖文件：`strategy-components/api/{sensitive-words,menu-overrides,task-buttons,skill-addresses,light-apps,business-mapping}.ts`、`roundtable-planning/api/{drafts,task-drafts,roundtable-jobs,recommend,chains,multi-agent,dashboard-sessions}.ts`、`core/{agents,scheduled-tasks,knowledge,positions,tags,studio,system-settings,memory,mcp,models,custom-prompts,user-preferences,notifications,recommended-questions,user-qa,curator,admin,thread-shares,roundtable-draft-shares,tool-metrics,llm-metrics,note,artifacts}/api.ts`、`core/api/markdown-docx-export.ts`。**问答（Q&A）改为「一次大模型调用 = 一条日志」**：在共享的 `core/threads/hooks.ts` `useThreadStream` 的 `onLangChainEvent` 里监听 `on_chat_model_end`，每次模型调用结束就上报一条（optType 12，`reqParam` 取本次 input 的最后一条 user 文本 + 模型名，`returnParam` 取本次输出文本）——一个问答轮次里 lead agent / 子代理的**每次** LLM 调用都各记一条，覆盖所有走 `useThreadStream` 的页面（`ChatPage`/`AgentChatPage`/创建智能体/iframe/会商等）；`ChatPage`/`AgentChatPage` 的 `onFinish` 仍额外保留一条轮次汇总。后端仅新增公开只读配置：`deerflow/config/y_log_config.py`（`YLogConfig{enabled,write_url}`）挂到 `AppConfig.y_log`，`app/gateway/routers/public_config.py` 加 `GET /api/public/config/y-log`，地址写在 `config.yaml` 的 `y_log` 段（mtime 热重载，前端无需重建）；**不做后端代理**。Tests：`tests/test_y_log_config.py`。
|
|
||||||
|
|
||||||
### Configuration
|
### Configuration
|
||||||
|
|
||||||
|
|||||||
@@ -1,48 +0,0 @@
|
|||||||
# Design QA — skills card list
|
|
||||||
|
|
||||||
## Scope
|
|
||||||
|
|
||||||
Only the skill-card list presentation was changed. The page header, summary cards, filters, top actions, sidebar, and existing interactions were left intact.
|
|
||||||
|
|
||||||
## Visual evidence
|
|
||||||
|
|
||||||
- Source visual truth: `C:\Users\admin\AppData\Local\Temp\codex-clipboard-8ca03817-ebd4-43e1-9d7c-2119e87d331c.png`
|
|
||||||
- Implementation URL: `http://localhost:5173/#/page/workspace/skills`
|
|
||||||
- Implementation capture: `F:\react01\deeflow-code\deerflow-server\skills-card-list-implementation.png`
|
|
||||||
- Focused source/implementation comparison: `F:\react01\deeflow-code\deerflow-server\skills-card-list-comparison.png`
|
|
||||||
- Viewport and state: Edge, desktop light theme, default list mode. The supplied reference contains three sample skills; the live implementation currently exposes one skill, so the comparison focuses on the first card row rather than fabricated data.
|
|
||||||
|
|
||||||
## Findings
|
|
||||||
|
|
||||||
No actionable P0, P1, or P2 visual issue remains within the requested list-card scope.
|
|
||||||
|
|
||||||
- **Hierarchy and layout:** the card now begins with a large semantic skill icon, then groups name, existing status badges, description, and publisher before the existing tag, use-count, state, activity, and action areas. The five-column grid keeps the important skill identity visible while preserving the original live fields.
|
|
||||||
- **Typography and spacing:** the title, description, metadata, and tags use the existing product type scale with a compact 12px card radius and consistent horizontal rhythm. The row remains responsive and collapses cleanly on narrower widths.
|
|
||||||
- **Color and surfaces:** category icons use restrained solid blue/green/violet/amber surfaces, tags remain subdued, and enabled status uses a quiet green pill. Borders and hover surfaces follow the existing neutral card treatment; no gradients were introduced.
|
|
||||||
- **Image and icon fidelity:** the source uses symbolic skill artwork. The implementation uses the closest existing Lucide workflow, globe, file, and upload icons in colored circular surfaces rather than adding screenshot-derived artwork or a new custom asset.
|
|
||||||
- **Feature fidelity:** all pre-existing action controls, view modes, and list metadata stay visible. The reference's toggle was not copied as a fake interactive control because this page had no enable/disable mutation; its existing `enabled` data is shown as a read-only status pill instead.
|
|
||||||
|
|
||||||
## Comparison history
|
|
||||||
|
|
||||||
1. **[P1, fixed] The original live skill row had little identity or information hierarchy.**
|
|
||||||
- Earlier state: title, description, metadata, and the action cluster were visually detached, with no category icon or clear scanning order.
|
|
||||||
- Fix: rebuilt only the list/card row layout around existing data and handlers, added semantic colored icon surfaces, compact state/use/activity columns, and a unified action cluster.
|
|
||||||
- Evidence: `skills-card-list-comparison.png` contains the reference card row and the live implementation card row in one focused comparison.
|
|
||||||
|
|
||||||
## Interaction and engineering checks
|
|
||||||
|
|
||||||
- Edge interaction check: passed. The live row retains 7 existing action buttons; opening the details action displays its dialog.
|
|
||||||
- View-mode behavior: passed. The existing list/card view control still switches to card mode (`aria-pressed=true`); the card view uses the same restyled visual language.
|
|
||||||
- Browser runtime: two guest-bootstrap resource requests returned `401 Unauthorized` after reload. They are unrelated to the skill-card styling and did not prevent the list, details dialog, or view-mode control from working.
|
|
||||||
- `pnpm build`: passed. The project still emits the pre-existing `/images/deer.svg` runtime-resolution warning.
|
|
||||||
- `git diff --check`: passed; only existing line-ending notices were emitted for unrelated files.
|
|
||||||
|
|
||||||
## Implementation checklist
|
|
||||||
|
|
||||||
- [x] Skill-card list restyled without changing page chrome or filtering controls
|
|
||||||
- [x] Existing skill actions, metadata, and view modes retained
|
|
||||||
- [x] Live `enabled` data displayed without inventing a new mutation control
|
|
||||||
- [x] Source and implementation reviewed in a single focused comparison image
|
|
||||||
- [x] Edge interaction and production build verified
|
|
||||||
|
|
||||||
final result: passed
|
|
||||||
@@ -5,13 +5,7 @@
|
|||||||
VITE_USE_REAL_DATA=true
|
VITE_USE_REAL_DATA=true
|
||||||
|
|
||||||
# 任务详情（登录深链 cop-task-detail）数据源：默认真实接口；改成 true 走本地假数据（consumer 外网不可达时调试用）。
|
# 任务详情（登录深链 cop-task-detail）数据源：默认真实接口；改成 true 走本地假数据（consumer 外网不可达时调试用）。
|
||||||
VITE_MOCK_COP_TASK_DETAIL=true
|
VITE_MOCK_COP_TASK_DETAIL=false
|
||||||
|
|
||||||
# 研判情报报告（大屏绘制智能体深链 selectSqReport）数据源：true 走本地样例假数据（真实接口未就绪时调试用）；联调通过后置 false。
|
|
||||||
VITE_MOCK_SQ_REPORT=true
|
|
||||||
|
|
||||||
# 深链任务详情（cop-task-detail：任务名称/描述）数据源：true 走本地假数据（真实接口未就绪时调试用）；联调通过后置 false。
|
|
||||||
VITE_MOCK_COP_TASK_DETAIL=true
|
|
||||||
|
|
||||||
# Gateway / DeerFlow API
|
# Gateway / DeerFlow API
|
||||||
VITE_BACKEND_BASE_URL=http://127.0.0.1:8001
|
VITE_BACKEND_BASE_URL=http://127.0.0.1:8001
|
||||||
|
|||||||
@@ -7,15 +7,9 @@ VITE_USE_REAL_DATA=true
|
|||||||
# 任务详情（登录深链 cop-task-detail）数据源：默认真实接口；改成 true 走本地假数据（调试用）。
|
# 任务详情（登录深链 cop-task-detail）数据源：默认真实接口；改成 true 走本地假数据（调试用）。
|
||||||
VITE_MOCK_COP_TASK_DETAIL=false
|
VITE_MOCK_COP_TASK_DETAIL=false
|
||||||
|
|
||||||
# 研判情报报告（大屏绘制智能体深链 selectSqReport）数据源：默认真实接口；真实接口未就绪可改 true 走本地样例假数据。
|
|
||||||
VITE_MOCK_SQ_REPORT=false
|
|
||||||
|
|
||||||
# 深链任务详情（cop-task-detail）数据源：默认真实接口；真实接口未就绪可改 true 走本地假数据。
|
|
||||||
VITE_MOCK_COP_TASK_DETAIL=false
|
|
||||||
|
|
||||||
# Gateway / DeerFlow API
|
# Gateway / DeerFlow API
|
||||||
VITE_BACKEND_BASE_URL=http://10.19.200.5:2026
|
VITE_BACKEND_BASE_URL=http://47.88.25.99:7001
|
||||||
VITE_LANGGRAPH_BASE_URL=http://10.19.200.5:2026/api
|
VITE_LANGGRAPH_BASE_URL=http://47.88.25.99:7001/api
|
||||||
|
|
||||||
# 轻应用「新建笔记」系列接口
|
# 轻应用「新建笔记」系列接口
|
||||||
VITE_NOTE_API_BASE_URL=http://47.88.25.99:8000
|
VITE_NOTE_API_BASE_URL=http://47.88.25.99:8000
|
||||||
@@ -42,7 +36,7 @@ VITE_AIPI_BACKENP_URL=http://47.88.25.99:8000
|
|||||||
# VITE_AIPI_FRONTEND_URL=https://knowledgetoolserver.b.uat.4.cn
|
# VITE_AIPI_FRONTEND_URL=https://knowledgetoolserver.b.uat.4.cn
|
||||||
VITE_NOTEBOOK_API_BASE_URL=http://47.88.25.99:8000
|
VITE_NOTEBOOK_API_BASE_URL=http://47.88.25.99:8000
|
||||||
VITE_AIPI_FRONTEND_URL=http://47.88.25.99:3000
|
VITE_AIPI_FRONTEND_URL=http://47.88.25.99:3000
|
||||||
VITE_AIPI_CONSUMER_URL=http://10.19.200.5:8002/consumer
|
VITE_AIPI_CONSUMER_URL=https://ch1.b.uat.4.cn/consumer
|
||||||
# A 系统跳转地址（人物/组织/事件等列表项打开链接）
|
# A 系统跳转地址（人物/组织/事件等列表项打开链接）
|
||||||
VITE_AIPI_PRESENT_URL=http://present.a.uat.4.cn/present/domain
|
VITE_AIPI_PRESENT_URL=http://present.a.uat.4.cn/present/domain
|
||||||
# B 系统知识库 iframe 根地址
|
# B 系统知识库 iframe 根地址
|
||||||
|
|||||||
@@ -7,9 +7,6 @@ VITE_USE_REAL_DATA=true
|
|||||||
# 任务详情（登录深链 cop-task-detail）数据源：默认真实接口；改成 true 走本地假数据（调试用）。
|
# 任务详情（登录深链 cop-task-detail）数据源：默认真实接口；改成 true 走本地假数据（调试用）。
|
||||||
VITE_MOCK_COP_TASK_DETAIL=false
|
VITE_MOCK_COP_TASK_DETAIL=false
|
||||||
|
|
||||||
# 研判情报报告（大屏绘制智能体深链 selectSqReport）数据源：默认真实接口；真实接口未就绪可改 true 走本地样例假数据。
|
|
||||||
VITE_MOCK_SQ_REPORT=false
|
|
||||||
|
|
||||||
# Gateway / DeerFlow API
|
# Gateway / DeerFlow API
|
||||||
VITE_BACKEND_BASE_URL=https://ch1.b.uat.4.cn/deerflow
|
VITE_BACKEND_BASE_URL=https://ch1.b.uat.4.cn/deerflow
|
||||||
VITE_LANGGRAPH_BASE_URL=https://ch1.b.uat.4.cn/deerflow/api
|
VITE_LANGGRAPH_BASE_URL=https://ch1.b.uat.4.cn/deerflow/api
|
||||||
|
|||||||
@@ -7,12 +7,6 @@ VITE_USE_REAL_DATA=true
|
|||||||
# 任务详情（登录深链 cop-task-detail）数据源：默认真实接口；改成 true 走本地假数据（调试用）。
|
# 任务详情（登录深链 cop-task-detail）数据源：默认真实接口；改成 true 走本地假数据（调试用）。
|
||||||
VITE_MOCK_COP_TASK_DETAIL=false
|
VITE_MOCK_COP_TASK_DETAIL=false
|
||||||
|
|
||||||
# 研判情报报告（大屏绘制智能体深链 selectSqReport）数据源：默认真实接口；真实接口未就绪可改 true 走本地样例假数据。
|
|
||||||
VITE_MOCK_SQ_REPORT=false
|
|
||||||
|
|
||||||
# 深链任务详情（cop-task-detail）数据源：默认真实接口；真实接口未就绪可改 true 走本地假数据。
|
|
||||||
VITE_MOCK_COP_TASK_DETAIL=false
|
|
||||||
|
|
||||||
# Gateway / DeerFlow API
|
# Gateway / DeerFlow API
|
||||||
VITE_BACKEND_BASE_URL=https://ch1.b.sit.4.cn/deerflow
|
VITE_BACKEND_BASE_URL=https://ch1.b.sit.4.cn/deerflow
|
||||||
VITE_LANGGRAPH_BASE_URL=https://ch1.b.sit.4.cn/deerflow/api
|
VITE_LANGGRAPH_BASE_URL=https://ch1.b.sit.4.cn/deerflow/api
|
||||||
|
|||||||
@@ -1,507 +0,0 @@
|
|||||||
# AI 写作「对话驱动写作台」实现方案（可落地版）
|
|
||||||
|
|
||||||
> 需求：**复制**现有 AI 写作代码，新增一个独立页面（**原页面/原路由零改动**）。在新页面里
|
|
||||||
> **大改交互流程**——去掉「素材收集 / 大纲规划 / 作家写作 / 编辑审核」四个阶段干预卡里的**输入框**，
|
|
||||||
> 只**保留原来的确认按钮**；在页面**底部新增一个统一的多行智能输入框**，具备**强意图理解**能力：
|
|
||||||
> 重新搜索、新增检索词、添加检索素材、重新规划大纲、按要求改大纲、提修改意见、审核意见、
|
|
||||||
> 素材不足继续搜集、对写作内容提问……**覆盖现有全部交互甚至更多**。
|
|
||||||
>
|
|
||||||
> 交互节奏不变：**一步一确认**——进行到某个专家阶段时，交互就针对该专家（阶段作用域）；
|
|
||||||
> 用户可以**点原来的确认按钮**，也可以**在底部输入框里发「继续下一步」的意图**推进。
|
|
||||||
> 意图**拿不准时**主动向用户**发起协助/澄清**，绝不盲目触发高代价动作（定稿 / 重搜等）。
|
|
||||||
|
|
||||||
本文是**实现指引**，落地时按第 9 节路线图分阶段推进。文中所有文件路径、符号名均对齐当前代码。
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 1. 现状梳理（改造地基）
|
|
||||||
|
|
||||||
现有 AI 写作是一套**独立 LangGraph 子系统**（不是 lead_agent），前后端都已成型、可复用。
|
|
||||||
|
|
||||||
### 1.1 后端 `ai_writing` graph
|
|
||||||
|
|
||||||
- 图工厂：`offline-backend-20260512/backend/packages/harness/deerflow/agents/ai_writing/graph.py`
|
|
||||||
（`make_ai_writing_graph`，registered as `assistant_id="ai_writing"`）
|
|
||||||
- 状态：`.../ai_writing/state.py`（`AIWritingState`）
|
|
||||||
- 四个「阶段大脑」节点：
|
|
||||||
|
|
||||||
| 阶段 | 节点 | 文件 |
|
|
||||||
|------|------|------|
|
|
||||||
| 素材收集 | `researcher` | `nodes/researcher.py` |
|
|
||||||
| 大纲规划 | `writer_outline` | `nodes/writer_outline.py` |
|
|
||||||
| 作家写作 | `writer_draft` | `nodes/writer_draft.py` |
|
|
||||||
| 编辑审核 | `editor` | `nodes/editor.py` |
|
|
||||||
|
|
||||||
- **五个暂停点**（`interrupt()`，`Command(resume=payload)` 续跑）——这是对话改造的核心可复用资产：
|
|
||||||
|
|
||||||
| pause_point | 语义 | 现有 action |
|
|
||||||
|-------------|------|-------------|
|
|
||||||
| `material_confirm` | 素材确认 | `confirm` / `re_search` / `enable_skill_search` |
|
|
||||||
| `outline_confirm` | 大纲确认 | `confirm` / `re_outline` |
|
|
||||||
| `draft_confirm` | 草稿确认 | `to_editor` / `finalize` / `user_revise` |
|
|
||||||
| `review_confirm` | 编辑打回确认 | `accept_review` / `force_finalize` |
|
|
||||||
| `section_help` | 素材不足求助 | `section_help`(+`sectionDecisions`) |
|
|
||||||
|
|
||||||
- resume 载荷（`UserInterventionPayload`，`types/ai-writing.ts`）字段：`action`、`approvedMaterialIds`、
|
|
||||||
`userQuery`（自然语言补充检索）、`editedOutline`、`outlineFeedback`、`userRevisionNotes`、
|
|
||||||
`overrideVerdict`、`selectedIssueIndices`、`sectionDecisions`。
|
|
||||||
**协议已同时支持「自然语言 + 结构化 action」**——这是对话层能复用的关键。
|
|
||||||
|
|
||||||
> 结论：**状态机 / 流式 / 暂停·续跑协议 / 持久化都可复用**，无需重写引擎。改造本质是
|
|
||||||
> 「把分散在干预卡里的输入框，换成一个底部智能输入框 + 意图路由层」，再把意图翻译回**现有
|
|
||||||
> `action + payload`**；仅少量新意图（对内容提问、素材不足自动回退重搜、追加审核意见）需新增能力。
|
|
||||||
|
|
||||||
### 1.2 前端 `open-canvas` 子系统
|
|
||||||
|
|
||||||
- 主页面：`frontend-web/src/open-canvas/pages/AIWritingPage.tsx`
|
|
||||||
- 路由注册：`open-canvas/routes/OpenCanvasRoutes.tsx`（`/page/canvas/ai-writing/*`）、
|
|
||||||
`pages/WorkspaceRoutes.tsx`（`/page/workspace/ai-writing/*`）、`pages/NotebookAIWritingPage.tsx`
|
|
||||||
- 状态机 + 流式：`contexts/AIWritingContext.tsx`（`useReducer` + LangGraph `useStream`，`assistantId:'ai_writing'`）
|
|
||||||
- 事件翻译 / reducer：`hooks/useAIWritingStream.ts`
|
|
||||||
- 类型：`types/ai-writing.ts`
|
|
||||||
- **左栏面板**：`components/ai-writing/AIWritingPanel.tsx`（时间线 + 干预卡 + 状态栏；idle 时挂启动表单）
|
|
||||||
- **要改造的输入 UI**（本次重点）：
|
|
||||||
- 干预卡 `components/ai-writing/InterventionCard.tsx`：内含
|
|
||||||
`MaterialConfirmCard`（素材：有 `MaterialsToolbar` 输入框）、
|
|
||||||
`OutlineConfirmCard`（大纲：有 feedback textarea）、
|
|
||||||
`DraftConfirmCard`（草稿：有「修改意见」textarea）、
|
|
||||||
`ReviewConfirmCard`（审核：有「补充修改指令」textarea）、
|
|
||||||
`SectionHelpCard`（素材不足：按钮组）。
|
|
||||||
**每张卡里都既有输入框又有确认/动作按钮**——本次要**去掉输入框、保留按钮**。
|
|
||||||
- 启动表单 `components/ai-writing/AIWritingForm.tsx`（idle 阶段的配置表单）——本次由底部输入框接管启动。
|
|
||||||
- **已存在的对话原型**（可借鉴）：`components/ai-writing/WritingSetupChat.tsx`
|
|
||||||
（`useThreadStream` 起 lead_agent 线程 + `setup_writing` 审批卡回填表单；仅管启动前配置，不直接复用）。
|
|
||||||
- 底部输入框可直接复用 UI 组件：`@/components/ai-elements/prompt-input`
|
|
||||||
（`PromptInput` / `PromptInputTextarea` / `PromptInputSubmit` / `PromptInputFooter`，见 `WritingSetupChat`）。
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 2. 目标与范围
|
|
||||||
|
|
||||||
### 2.1 必须满足
|
|
||||||
|
|
||||||
1. **复制式新增**：新目录 / 新路由 / 新侧边栏入口，**旧页面、旧路由、旧组件零改动**（「初始的不用动」）。
|
|
||||||
2. 页面**底部单一多行智能输入框**接管全流程交互；四个阶段干预卡里的**输入框全部移除**。
|
|
||||||
3. **保留确认按钮**：每个阶段到达暂停点时，消息流里仍渲染**产物卡 + 原来的确认/动作按钮**
|
|
||||||
（素材「确认素材」、大纲「确认大纲」、草稿「让编辑审核 / 确认定稿」、审核「按编辑意见修改 / 强制定稿」、
|
|
||||||
素材不足的三选一按钮）。用户**点按钮**或**在底部输入框发自然语言意图**二选一均可推进。
|
|
||||||
4. **强意图理解**：把用户自由文本准确路由到正确动作，**覆盖现有全部交互 + 更多**（见 3.2）。
|
|
||||||
5. **阶段作用域**：意图解析必须知道「当前停在哪个专家阶段」，把同一句话按当前阶段翻译成对应 action。
|
|
||||||
6. **素材不足自动回退重搜**：修改意见需要的信息现有素材没有时，先重搜补素材、补完自动继续原意图。
|
|
||||||
7. **拿不准就协助**：低置信意图**不猜着执行**，走澄清追问（clarify）或用户协助。
|
|
||||||
8. 保留右侧草稿实时预览（可编辑）与时间线 / 进度展示。
|
|
||||||
|
|
||||||
### 2.2 明确不做（本期）
|
|
||||||
|
|
||||||
- 不改旧 `AIWritingPage` 及其 `AIWritingForm` / `InterventionCard`（这两个是要在**副本**里改的）。
|
|
||||||
- 不替换 `ai_writing` graph 四个阶段大脑逻辑，不动五个暂停点 / checkpoint / 持久化。
|
|
||||||
- 不引新状态管理库（继续 `useReducer` + `useStream`）。
|
|
||||||
|
|
||||||
### 2.3 复制策略（关键决策）
|
|
||||||
|
|
||||||
「复制一份」= **复制会被大改的表现层组件**（页面 + 干预卡 + 面板），**复用不改的引擎层**：
|
|
||||||
|
|
||||||
| 复制（新建副本，大改） | 复用（原样，不改；仅对 `types` 做**追加式**扩展） |
|
|
||||||
|------------------------|--------------------------------------------------|
|
|
||||||
| 新页面 `AIWritingChatPage.tsx` | `contexts/AIWritingContext.tsx`（状态机 + 流式） |
|
|
||||||
| 新面板 `WritingChatPanel.tsx`（消息流 + 底部输入框） | `hooks/useAIWritingStream.ts`（事件 → state） |
|
|
||||||
| 新消息卡 `chat-cards/*`（产物卡+确认按钮，**无输入框**） | `components/ai-writing/AIWritingDraftPanel.tsx`（右侧草稿预览） |
|
|
||||||
| 新意图客户端 `api/ai-writing-intent.ts` | 各流式展示子组件（`MaterialsCard`/`OutlineCard`/`ReviewCard`/`SkillStepsCard`…） |
|
|
||||||
| （可选）新 `contexts/WritingChatContext.tsx` 包一层「pending 意图 / 澄清态」 | `types/ai-writing.ts`（**只加字段不改旧字段**，保证旧页面不受影响） |
|
|
||||||
|
|
||||||
> **不复用、也不改** 的三个「输入框组件」：`AIWritingForm` / `InterventionCard` / `WritingFormContext`——
|
|
||||||
> 旧页面继续用它们，新页面完全不引用它们。这样「初始的不用动」得到硬保证。
|
|
||||||
>
|
|
||||||
> 为什么复用 `AIWritingContext` 而不复制它？它**不含任何输入框 UI**，只是「状态机 + 与后端 graph 的
|
|
||||||
> 流式桥」，复用它**不会改动旧页面的任何呈现**（旧页面照常在自己的 Provider 实例里跑）。复用能显著
|
|
||||||
> 降低维护成本、避免两套引擎漂移。若要绝对物理隔离，也可整目录复制 `AIWritingContext` +
|
|
||||||
> `useAIWritingStream` 到新目录——**推荐先复用**，仅当后续需要给对话态加大量图内新协议时再分叉。
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 3. 核心设计
|
|
||||||
|
|
||||||
### 3.1 三层结构
|
|
||||||
|
|
||||||
```
|
|
||||||
┌──────────────────────────────────────────────────────────────┐
|
|
||||||
│ 对话 UI 层（新） WritingChatPanel │
|
|
||||||
│ - 消息流：用户消息 + AI 阶段产物卡（含【保留的确认按钮】）+ 进度 │
|
|
||||||
│ - 底部：统一多行智能输入框（唯一自由输入入口） │
|
|
||||||
│ - 右侧：草稿实时预览（复用 AIWritingDraftPanel） │
|
|
||||||
└───────────────┬──────────────────────────────────────────────┘
|
|
||||||
│ 用户自然语言（+ 当前 status/pausePoint 上下文）
|
|
||||||
▼
|
|
||||||
┌──────────────────────────────────────────────────────────────┐
|
|
||||||
│ 意图解析层（新，核心） POST /api/ai-writing/sessions/{id}/intent │
|
|
||||||
│ 输出：{ intent, pausePoint, action, payload, │
|
|
||||||
│ needResearch, researchQuery, answer, confidence, clarify }│
|
|
||||||
└───────────────┬──────────────────────────────────────────────┘
|
|
||||||
│ 结构化 action + payload
|
|
||||||
▼
|
|
||||||
┌──────────────────────────────────────────────────────────────┐
|
|
||||||
│ 执行层（复用现有 AIWritingContext） │
|
|
||||||
│ idle → startWriting(AIWritingRequest) │
|
|
||||||
│ 暂停 → submitIntervention(UserInterventionPayload) │
|
|
||||||
│ 问答 → 旁路回答（不改写作状态） │
|
|
||||||
│ 素材不足 → 先重搜、缓存 pending、补完自动续跑 │
|
|
||||||
└──────────────────────────────────────────────────────────────┘
|
|
||||||
```
|
|
||||||
|
|
||||||
**设计原则**：意图解析层是「翻译官」——把自由文本翻译成**执行层已经懂的指令**。能复用
|
|
||||||
`action + payload` 的绝不新造协议；确认按钮点击**直接走执行层**（不经意图层，零延迟、零误判）。
|
|
||||||
|
|
||||||
### 3.2 意图分类体系（覆盖全流程 + 更多）
|
|
||||||
|
|
||||||
按「意图 → 触发时机（当前 status/pausePoint）→ 映射执行」组织，即意图解析引擎的目标 schema。
|
|
||||||
**「甚至更多」** = G（问答）、H（控制）、以及 B/C/D/E 里的「素材不足自动回退重搜」。
|
|
||||||
|
|
||||||
#### A. 启动类（status = `idle`）
|
|
||||||
| 意图 | 用户说法示例 | 映射 |
|
|
||||||
|------|-------------|------|
|
|
||||||
| `start_writing` | 「写一篇关于新能源出口的深度分析，2000 字」 | 解析成 `AIWritingRequest` → `startWriting()` |
|
|
||||||
| `start_with_outline` | 「按这个大纲写：…」 | `AIWritingRequest.userOutline` |
|
|
||||||
| `start_imitate` | 「仿照这篇样文写…」 | `writingModeType='imitate'` + `sampleText` |
|
|
||||||
|
|
||||||
#### B. 素材类（pausePoint = `material_confirm`）
|
|
||||||
| 意图 | 示例 | 映射 |
|
|
||||||
|------|------|------|
|
|
||||||
| `confirm_materials` | 「素材可以，继续 / 下一步」 | `{action:'confirm', approvedMaterialIds}` |
|
|
||||||
| `research_again` | 「重新搜索素材」 | `{action:'re_search'}`（无 userQuery=覆盖式重检） |
|
|
||||||
| `add_material`/`add_keyword` | 「再补点关于 X 的素材」「加个关键词 Y」 | `{action:'re_search', userQuery:'X/Y'}`（追加） |
|
|
||||||
| `select_materials` | 「只用第 1、3 条」 | `{action:'confirm', approvedMaterialIds:[…]}` |
|
|
||||||
| `drop_materials` | 「去掉第 2 条」 | 同上（反选后的子集） |
|
|
||||||
|
|
||||||
#### C. 大纲类（pausePoint = `outline_confirm`）
|
|
||||||
| 意图 | 示例 | 映射 |
|
|
||||||
|------|------|------|
|
|
||||||
| `confirm_outline` | 「大纲 OK，开始写」 | `{action:'confirm'}` |
|
|
||||||
| `reoutline` | 「重写大纲」 | `{action:'re_outline'}`（feedback 可空） |
|
|
||||||
| `revise_outline` | 「第二章拆成两节」「调整顺序」 | `{action:'re_outline', outlineFeedback:自然语言}` |
|
|
||||||
|
|
||||||
#### D. 写作 / 草稿类（pausePoint = `draft_confirm`）
|
|
||||||
| 意图 | 示例 | 映射 |
|
|
||||||
|------|------|------|
|
|
||||||
| `to_editor` | 「交给编辑审核」 | `{action:'to_editor'}` |
|
|
||||||
| `finalize` | 「就这样定稿」 | `{action:'finalize'}` **（高代价：低置信必澄清）** |
|
|
||||||
| `revise_draft` | 「第三段太啰嗦，精简」「补个 2024 案例」 | `{action:'user_revise', userRevisionNotes:意见}` |
|
|
||||||
| `rewrite_section` | 「重写第二章」 | `user_revise` + 章节定位写进 notes |
|
|
||||||
| `change_tone/style` | 「更口语一点 / 更正式」 | `user_revise` + notes |
|
|
||||||
| `apply_review`（若已有审核结果） | 「按编辑意见改」「只接受第 1、2 条」 | `{action:'user_revise', selectedIssueIndices:[…]}` |
|
|
||||||
|
|
||||||
#### E. 编辑审核类（pausePoint = `review_confirm`）
|
|
||||||
| 意图 | 示例 | 映射 |
|
|
||||||
|------|------|------|
|
|
||||||
| `accept_review` | 「按编辑意见改」 | `{action:'accept_review', selectedIssueIndices}` |
|
|
||||||
| `partial_accept_review` | 「只接受第 1、2 条」 | `accept_review` + `selectedIssueIndices` 子集 |
|
|
||||||
| `add_review_opinion` | 「再补一条：核查数据准确性」 | `accept_review` + `userRevisionNotes`（并入补充指令，现协议已支持） |
|
|
||||||
| `force_finalize` | 「不改了，强制定稿」 | `{action:'force_finalize', overrideVerdict:true}` **（高代价：必澄清）** |
|
|
||||||
|
|
||||||
#### F. 素材不足求助类（pausePoint = `section_help`）
|
|
||||||
| 意图 | 映射 |
|
|
||||||
|------|------|
|
|
||||||
| `section_supplement` | `{action:'section_help', sectionDecisions:[…'supplement']}` |
|
|
||||||
| `section_loose` | `sectionDecisions:[…'loose']` |
|
|
||||||
| `section_delete` | `sectionDecisions:[…'delete']` |
|
|
||||||
|
|
||||||
#### G. 问答类（**新**；任意 status；旁路，不改写作状态）
|
|
||||||
| 意图 | 示例 | 映射 |
|
|
||||||
|------|------|------|
|
|
||||||
| `ask_about_content` | 「第二章讲了啥？」「为什么用这个论点？」 | 意图节点直接带回 `answer`，对话流渲染（见 5.4） |
|
|
||||||
| `ask_meta` | 「现在到哪步了？」「用了哪些素材？」 | 读当前 state 直接回答，不走图 |
|
|
||||||
|
|
||||||
#### H. 控制类（**新 / 半新**）
|
|
||||||
| 意图 | 映射 |
|
|
||||||
|------|------|
|
|
||||||
| `next_step`（通用「继续/下一步」） | 按**当前 pausePoint** 映射到该阶段的默认确认（material/outline→`confirm`，draft→`to_editor`…；等价点确认按钮） |
|
|
||||||
| `restart_stage` | 重跑当前阶段（复用 `resumeWriting()` 空 command 续跑） |
|
|
||||||
| `run_background` | 转后台自动跑：`suspendAIWritingToBackground()` |
|
|
||||||
| `cancel` | `pauseWriting()`（`stream.stop()`） |
|
|
||||||
| `unknown/clarify` | 无法判定 → 反问澄清 / 用户协助（**防误触发硬指标**） |
|
|
||||||
|
|
||||||
### 3.3 「素材不足自动重搜」判定与回退（用户强调点）
|
|
||||||
|
|
||||||
触发：用户在**大纲/草稿/审核**阶段提出修改意见，但意见需要的信息现有素材里没有。
|
|
||||||
|
|
||||||
判定来源（组合）：
|
|
||||||
1. **意图节点直接判**：把「素材摘要（keywords + 每条 title/source）」喂给意图 prompt，让它判断
|
|
||||||
「这条意见能否用现有素材满足」；不能 → `needResearch=true` + `researchQuery`。
|
|
||||||
2. **执行阶段兜底**：`writer_draft` 严格模式已有 `blocked_sections` → `section_help` 暂停点，
|
|
||||||
对话层把它翻译成「素材不足，是否重搜？」的追问。
|
|
||||||
|
|
||||||
回退动作（**首期纯前端实现，不动后端协议**）：`needResearch=true` 时，前端把用户的修改
|
|
||||||
`payload` 缓存为 `pendingIntent`，先 `submitIntervention({action:'re_search', userQuery:researchQuery})`
|
|
||||||
补素材；监听到新一轮 `material_confirm`（素材追加完成）后，**自动提交** `pendingIntent`。
|
|
||||||
需处理「重搜期间用户又改主意」→ 允许覆盖 pending。
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 4. 意图解析引擎：方案与契约
|
|
||||||
|
|
||||||
**采用方案 A：后端 LLM 意图节点（独立 REST）**，叠加高频短句**规则快路径**优化。
|
|
||||||
|
|
||||||
理由：`needResearch` 判定需要**完整写作上下文**（素材/大纲/草稿），后端天然持有 checkpoint state；
|
|
||||||
与 `setup_writing` 一脉相承，离线模型选择策略统一；输出 schema 稳定、前端只消费。
|
|
||||||
|
|
||||||
### 4.1 后端入口
|
|
||||||
|
|
||||||
`app/gateway/routers/ai_writing.py` 新增：
|
|
||||||
|
|
||||||
```
|
|
||||||
POST /api/ai-writing/sessions/{session_id}/intent
|
|
||||||
Body: { text: string, status: string, pausePoint?: string }
|
|
||||||
Resp: IntentResult（见 4.3）
|
|
||||||
```
|
|
||||||
|
|
||||||
实现：读该 session 的 checkpoint state（素材摘要 / 大纲纲要 / 草稿字数·章节 / 审核意见）→
|
|
||||||
用 `ai_writing` 配置模型（复用 `intent_parser.py` 同套 `create_chat_model` + `parse_json` +
|
|
||||||
模型容错 `_model_fallback`）解析 → 返回结构化契约。**不改图拓扑**。
|
|
||||||
|
|
||||||
新增 prompt：`agents/ai_writing/prompts/intent_router_prompts.py`
|
|
||||||
- 输入：用户文本、`current_status`/`pause_point`、素材摘要、大纲纲要、草稿字数+章节标题、审核意见列表。
|
|
||||||
- 输出：严格 JSON（4.3 契约）。硬要求：**只在证据充分时给高 confidence，否则给 `clarify`**；
|
|
||||||
`finalize`/`force_finalize`/`re_search` 等高代价意图**必须**高置信才不澄清。
|
|
||||||
|
|
||||||
### 4.2 前端快路径（先跑规则，未命中再调后端）
|
|
||||||
|
|
||||||
`api/ai-writing-intent.ts` 里对**当前 pausePoint** 做少量确定性短语命中，直接产出 payload，省一次往返：
|
|
||||||
- 「继续/下一步/确认/可以/ok/好的」→ 当前阶段默认 `confirm`（draft 阶段=`to_editor`）。
|
|
||||||
- 「重新搜索/重搜」（material）→ `re_search`。「重写大纲」（outline）→ `re_outline`。
|
|
||||||
- 「定稿/强制定稿」→ **不进快路径**（高代价，一律走后端 + 可能澄清）。
|
|
||||||
- 命中即执行；未命中 → 调后端 `intent` 接口。
|
|
||||||
|
|
||||||
### 4.3 意图解析输出契约
|
|
||||||
|
|
||||||
```jsonc
|
|
||||||
{
|
|
||||||
"intent": "revise_draft", // 见 3.2 分类
|
|
||||||
"pausePoint": "draft_confirm", // 需要 resume 时；否则 null
|
|
||||||
"action": "user_revise", // 映射到现有 action
|
|
||||||
"payload": { // 直接可喂 submitIntervention 的字段（camelCase）
|
|
||||||
"userRevisionNotes": "第三段精简，并补一个 2024 年的案例"
|
|
||||||
},
|
|
||||||
"needResearch": true, // 素材是否不足
|
|
||||||
"researchQuery": "2024 行业案例", // needResearch 时的检索意图
|
|
||||||
"answer": null, // 问答类意图的直接回答（旁路）
|
|
||||||
"confidence": 0.86,
|
|
||||||
"clarify": null // 低置信时的反问话术（非空则不执行、只追问）
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
前端消费顺序：
|
|
||||||
1. `answer` 非空 → 对话流渲染回答（问答旁路，不动写作状态）。
|
|
||||||
2. `clarify` 非空 **或** `confidence < 阈值(建议 0.6)` → 渲染反问气泡，等用户澄清（**防误触发**）。
|
|
||||||
3. `needResearch=true` → 缓存 `pendingIntent=payload`，先重搜，收到新素材后自动提交。
|
|
||||||
4. 否则 → `idle` 走 `startWriting(...)`；暂停态走 `submitIntervention({action, ...payload})`。
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 5. 前端改造方案
|
|
||||||
|
|
||||||
### 5.1 新页面与路由（复制式）
|
|
||||||
|
|
||||||
- 新页面：`open-canvas/pages/AIWritingChatPage.tsx`
|
|
||||||
（骨架照抄 `AIWritingPage.tsx` 的 Provider 包裹与左右分栏；左栏换成 `WritingChatPanel`，右栏仍
|
|
||||||
`AIWritingDraftPanel`；idle 不再挂 `AIWritingForm`，改由底部输入框启动）。
|
|
||||||
- 路由注册（**新增，不动旧行**）：
|
|
||||||
- `open-canvas/routes/OpenCanvasRoutes.tsx` 加 `path="ai-writing-chat/*"`。
|
|
||||||
- 侧边栏 `core/page-layout/sidebar-menu.ts`：在 `qa-research` 旁新增
|
|
||||||
`{ id:"qa-research-chat", label:"AI写作(对话版)", icon:FileText, path:"/page/canvas/ai-writing-chat" }`。
|
|
||||||
（或先不加、内部灰度直链验证。）
|
|
||||||
|
|
||||||
### 5.2 新面板 `WritingChatPanel.tsx`（左栏主体）
|
|
||||||
|
|
||||||
职责 = 消息流容器 + 底部输入框，替代 `AIWritingPanel` 里的「时间线 + InterventionCard + 状态栏」。
|
|
||||||
复用 `useAIWriting()` 读 state / 调 `startWriting` / `submitIntervention` / `pauseWriting` /
|
|
||||||
`suspendAIWritingToBackground`。
|
|
||||||
|
|
||||||
消息流渲染（把 `ProgressEvent` / 阶段产物适配成消息卡，复用现有展示子组件）：
|
|
||||||
- 运行中：`research_progress`/`outline_chunk`/`draft_chunk`/`review_chunk` → 进度 / 流式卡
|
|
||||||
（复用 `SkillStepsCard`/`OutlineStreamingView`/`DraftGeneratingView`/`ReviewStreamingView` 的展示部分）。
|
|
||||||
- 到达暂停点：渲染 **产物卡 + 保留的确认按钮**（见 5.3），不再有输入框。
|
|
||||||
- 用户消息、AI 澄清追问、问答回答：普通气泡。
|
|
||||||
|
|
||||||
底部输入框：直接复用 `@/components/ai-elements/prompt-input`（`PromptInput`+`PromptInputTextarea`+
|
|
||||||
`PromptInputSubmit`），Enter 发送、Shift+Enter 换行；发送时读当前 `state.status`/`currentPause?.pausePoint`
|
|
||||||
交给意图路由（见 5.5）。运行中（非暂停点）可禁用发送或转「排队/提示当前在生成」。
|
|
||||||
|
|
||||||
### 5.3 新消息卡 `chat-cards/*`（**保留按钮、去掉输入框**）
|
|
||||||
|
|
||||||
把 `InterventionCard.tsx` 的五张卡各复制一份到 `open-canvas/components/ai-writing-chat/chat-cards/`，
|
|
||||||
**删掉其中的 textarea / MaterialsToolbar 输入部分，保留产物展示 + 确认/动作按钮**：
|
|
||||||
|
|
||||||
| 新卡 | 展示（复用） | 保留的按钮 | 删除的输入 |
|
|
||||||
|------|-------------|-----------|-----------|
|
|
||||||
| `MaterialConfirmChatCard` | `MaterialsCard`（勾选保留）+ `SkillStepsCard` | 「确认素材，规划大纲」「重新搜索」 | `MaterialsToolbar` 的 userQuery 输入框 |
|
|
||||||
| `OutlineConfirmChatCard` | `OutlineCard`（可点标题微调保留） | 「确认大纲，开始写作」 | feedback textarea + 发送 |
|
|
||||||
| `DraftConfirmChatCard` | `ReviewCard`（若有审核，勾选保留） | 「按编辑审核意见修改」「让编辑继续审核」「确认定稿」 | 「修改意见」textarea |
|
|
||||||
| `ReviewConfirmChatCard` | `ReviewCard`（勾选保留） | 「按编辑意见修改」「强制定稿」 | 「补充修改指令」textarea |
|
|
||||||
| `SectionHelpChatCard` | 章节 + 三选一按钮组 | 三选一 + 「提交并继续」 | （本就无自由输入，原样保留） |
|
|
||||||
|
|
||||||
> 勾选态（素材/审核意见）**保留**——它是「点按钮」路径的一部分，不算自由输入框。用户想用自然语言
|
|
||||||
> 「只用第 1、3 条」也能走底部输入框（意图层产出 `approvedMaterialIds`/`selectedIssueIndices`）。
|
|
||||||
> 按钮点击 **直接调 `submitIntervention`**，与旧卡完全一致，零改动风险。
|
|
||||||
|
|
||||||
### 5.4 问答旁路（新能力）
|
|
||||||
|
|
||||||
「对写作内容提问」不改写作 state。首期**轻量实现**：意图节点检出 `ask_*` 时读 state 直接带回 `answer`，
|
|
||||||
前端在消息流渲染为普通 AI 气泡即可（一次调用出答案）。完整版（后续）可另起只读 lead_agent 线程注入
|
|
||||||
草稿/大纲作背景，类似 `WritingSetupChat` 的 `useThreadStream`。
|
|
||||||
|
|
||||||
### 5.5 交互流程（对话版）串起来
|
|
||||||
|
|
||||||
1. **空闲**：底部输入「写一篇关于 X 的深度分析，2000 字」→ 意图 `start_writing` → 组 `AIWritingRequest`
|
|
||||||
→ `startWriting()`。（缺关键字段时先 `clarify` 追问字数/读者/类型。）
|
|
||||||
2. **运行中**：进度/流式卡渲染。
|
|
||||||
3. **到暂停点**：渲染产物卡 + 按钮 + 一句提示「你可以点上面的按钮，或直接说：确认继续 / 补充素材 / 改大纲…」。
|
|
||||||
- **点按钮** → 直接 `submitIntervention`（旧逻辑）。
|
|
||||||
- **发文字** → `resolveIntent(text, status, pausePoint)`（先快路径、后后端）→ 按 4.3 消费。
|
|
||||||
4. **问答**：任意时刻提问 → 旁路 `answer`，不打断写作。
|
|
||||||
5. **素材不足**：`needResearch` 或 `section_help` → 追问/执行「重搜 → 自动续跑 pending 意图」。
|
|
||||||
6. **拿不准**：`clarify`/低置信 → 反问气泡，不执行。
|
|
||||||
|
|
||||||
### 5.6 pending 意图 & 澄清态（新增本地状态）
|
|
||||||
|
|
||||||
在 `WritingChatPanel`（或新 `WritingChatContext`）维护：
|
|
||||||
- `pendingIntent: UserInterventionPayload | null` —— 素材不足重搜完成后自动提交。
|
|
||||||
- `awaitingClarify: { originalText: string } | null` —— 澄清态，用户下一句与上一句拼接再解析。
|
|
||||||
- pending 生命周期：设置 → 提交 `re_search` → 监听 reducer 里新一轮 `awaiting_material_confirm`
|
|
||||||
（`state.status` 从 `researching` 回到 `awaiting_material_confirm`）→ 自动 `submitIntervention(pending)` → 清空。
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 6. 后端改造方案
|
|
||||||
|
|
||||||
### 6.1 意图解析入口（新增，唯一后端改动主体）
|
|
||||||
|
|
||||||
- `app/gateway/routers/ai_writing.py`：新增 `POST /sessions/{id}/intent`（见 4.1）。
|
|
||||||
读 checkpoint state 用 `app.state.checkpointer` + `make_ai_writing_graph().aget_state(...)`
|
|
||||||
（参照 `ai_writing_job_executor.py` 的读法）取素材/大纲/草稿/审核摘要。
|
|
||||||
- `agents/ai_writing/prompts/intent_router_prompts.py`：新增意图 prompt（见 4.1）。
|
|
||||||
- 复用 `nodes/intent_parser.py` 的模型创建 / `parse_json` / `_model_fallback` 容错。
|
|
||||||
|
|
||||||
### 6.2 不需要改的部分
|
|
||||||
|
|
||||||
- 四个阶段大脑节点、五个暂停点、checkpoint、StreamBridge、持久化、sessions/transcript REST——**全不动**。
|
|
||||||
- 「素材不足自动续跑」「问答旁路」首期都在**前端 / 意图节点**实现，**不扩 resume 协议**。
|
|
||||||
|
|
||||||
### 6.3 可选增强（阶段 3，按需）
|
|
||||||
|
|
||||||
- `add_review_opinion` 完整版：`review_confirm` resume 增字段 `extra_review_notes`（首期已用现有
|
|
||||||
`userRevisionNotes` 降级承载，够用）。
|
|
||||||
- `resume_intent` 后端化（把「重搜完自动续跑」搬到后端，减少前端状态机复杂度）。
|
|
||||||
- undo / 回退到上一暂停点（依赖 checkpoint 回滚）。
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 7. 数据流时序（改稿 + 素材不足自动重搜）
|
|
||||||
|
|
||||||
```
|
|
||||||
用户（draft_confirm 暂停）: "第三段补个2024年的行业案例"
|
|
||||||
│ 底部输入框 → resolveIntent(text, status='awaiting_draft_confirm', pausePoint='draft_confirm')
|
|
||||||
▼ POST /api/ai-writing/sessions/{id}/intent { text, status, pausePoint }
|
|
||||||
后端: 读 state(素材摘要) + LLM 解析
|
|
||||||
│ 返回 { intent:revise_draft, action:user_revise,
|
|
||||||
│ payload:{userRevisionNotes:"第三段…补2024案例"},
|
|
||||||
│ needResearch:true, researchQuery:"2024 行业案例", confidence:0.9 }
|
|
||||||
▼
|
|
||||||
前端: needResearch=true → pendingIntent = payload
|
|
||||||
│ submitIntervention({action:'re_search', userQuery:"2024 行业案例"})
|
|
||||||
▼ LangGraph resume → researcher 追加素材 → status 回到 awaiting_material_confirm
|
|
||||||
前端: 监听到新一轮素材确认 → 自动提交 pendingIntent
|
|
||||||
│ submitIntervention({action:'user_revise', userRevisionNotes:"第三段…补2024案例"})
|
|
||||||
▼ writer_draft 用新素材改稿 → draft_chunk… → draft_ready → draft_confirm
|
|
||||||
前端: 消息流展示新草稿卡 + "已按你的意见改写并补充了 2024 案例"
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 8. 关键实现细节与坑
|
|
||||||
|
|
||||||
1. **阶段作用域**：`resolveIntent` 必须带 `state.currentPause?.pausePoint` + `state.status`——
|
|
||||||
同一句「重新来」在 material 是重搜、在 outline 是重写大纲。`AIWritingContext` 已有这两个字段，直接读。
|
|
||||||
2. **确认按钮零改动**：新卡的按钮 `onClick` 原样调 `submitIntervention(payload)`，与旧卡逐字一致，
|
|
||||||
风险最低；**只删输入框**。
|
|
||||||
3. **防误触发**：低置信（<0.6）或 `clarify` 非空一律追问；`finalize`/`force_finalize`/`re_search`
|
|
||||||
即使命中也要求高置信，否则澄清。绝不盲目定稿/覆盖重搜。
|
|
||||||
4. **pending 意图队列**：素材不足是「先插重搜、再回原意图」，用 5.6 的小状态机；重搜完成前允许覆盖 pending。
|
|
||||||
5. **问答不污染 transcript**：问答/澄清消息在前端标记 `kind:'qa'|'clarify'`，与写作进度事件区分（
|
|
||||||
`AIWritingContext` 的 transcript 只存 progressEvents/completedInterventions，问答气泡是纯前端消息，
|
|
||||||
默认不入 transcript，避免历史回看错乱）。
|
|
||||||
6. **流式产物→消息卡**：复用 `OutlineStreamingView`/`DraftGeneratingView`/`ReviewStreamingView`/
|
|
||||||
`SkillStepsCard` 的**展示部分**，套进消息容器，不重写渲染。
|
|
||||||
7. **右侧草稿预览**：`AIWritingDraftPanel` + `DraftSync` 原样复用（`DraftSync` 依据 status/markdown
|
|
||||||
同步右侧画布）。
|
|
||||||
8. **离线内网**：意图模型走 `config.yaml → ai_writing` 配置模型；检索仍走技能/内网 ES，不联网。
|
|
||||||
9. **模型选择透传**：`submitIntervention` 的 resume 已把 `state.request?.modelName` 一并回传（见
|
|
||||||
`AIWritingContext`），新页面沿用即可。
|
|
||||||
10. **旧页面隔离验证**：改完后回归旧 `/page/canvas/ai-writing` 与 `/page/workspace/ai-writing`、
|
|
||||||
笔记本嵌入页，确认零变化（新代码不 import 旧的 `AIWritingForm`/`InterventionCard`/`WritingFormContext`）。
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 9. 分阶段实施路线图
|
|
||||||
|
|
||||||
**阶段 0 — 骨架（不含意图）**
|
|
||||||
- 复制 `AIWritingChatPage` + 注册新路由 + 侧边栏入口；复用 `AIWritingContext`/`useStream`/`DraftPanel`。
|
|
||||||
- 复制五张 `chat-cards`（删输入框、留按钮）；底部输入框先只做 idle 直发 `start_writing`
|
|
||||||
（文本原样当 `userIntent`，其余字段取默认）+ 暂停点靠按钮推进。端到端跑通。
|
|
||||||
|
|
||||||
**阶段 1 — 意图解析（核心）**
|
|
||||||
- 后端 `POST /sessions/{id}/intent` + `intent_router_prompts.py`，返回 4.3 契约。
|
|
||||||
- 前端 `api/ai-writing-intent.ts`（快路径 + 后端）接入 `WritingChatPanel`，覆盖 A~F 类意图。
|
|
||||||
- 低置信 `clarify` 澄清态（5.6）。
|
|
||||||
|
|
||||||
**阶段 2 — 问答旁路 + 素材不足自动重搜**
|
|
||||||
- G 类问答（意图节点直接带 `answer`）。
|
|
||||||
- `needResearch` + pending 意图机制（前端实现重搜后自动续跑，5.6）。
|
|
||||||
|
|
||||||
**阶段 3 — 增强（按需）**
|
|
||||||
- `add_review_opinion` 扩协议、`resume_intent` 后端化、undo/回退、完整问答只读线程。
|
|
||||||
|
|
||||||
**阶段 4 — 打磨**
|
|
||||||
- 消息卡视觉、历史回看（transcript）、后台挂起入口、灰度到侧边栏。
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 10. 关键文件清单（落地对照）
|
|
||||||
|
|
||||||
### 新增（前端）
|
|
||||||
- `open-canvas/pages/AIWritingChatPage.tsx` — 新页面（复制 `AIWritingPage` 骨架改造）
|
|
||||||
- `open-canvas/components/ai-writing-chat/WritingChatPanel.tsx` — 消息流 + 底部输入框
|
|
||||||
- `open-canvas/components/ai-writing-chat/chat-cards/{MaterialConfirmChatCard,OutlineConfirmChatCard,DraftConfirmChatCard,ReviewConfirmChatCard,SectionHelpChatCard}.tsx` — 保留按钮、去掉输入框
|
|
||||||
- `open-canvas/components/ai-writing-chat/progressToMessage.ts` — `ProgressEvent` → 消息卡适配
|
|
||||||
- `open-canvas/api/ai-writing-intent.ts` — 意图解析客户端（快路径 + `POST …/intent`）
|
|
||||||
- （可选）`open-canvas/contexts/WritingChatContext.tsx` — pending 意图 / 澄清态
|
|
||||||
|
|
||||||
### 修改（前端，仅追加，不动旧逻辑）
|
|
||||||
- `open-canvas/routes/OpenCanvasRoutes.tsx` — 加一条 `ai-writing-chat/*` 路由
|
|
||||||
- `core/page-layout/sidebar-menu.ts` — 加一个侧边栏入口（可选）
|
|
||||||
- `open-canvas/types/ai-writing.ts` — **仅追加** `IntentResult` 等新类型，不改旧字段
|
|
||||||
|
|
||||||
### 新增（后端）
|
|
||||||
- `app/gateway/routers/ai_writing.py` — 加 `POST /sessions/{id}/intent`
|
|
||||||
- `agents/ai_writing/prompts/intent_router_prompts.py` — 意图 prompt
|
|
||||||
- `tests/test_ai_writing_intent.py` — 意图接口单测（TDD 强制）
|
|
||||||
|
|
||||||
### 复用（不改）
|
|
||||||
- `open-canvas/contexts/AIWritingContext.tsx`、`hooks/useAIWritingStream.ts`
|
|
||||||
- `open-canvas/components/ai-writing/{AIWritingDraftPanel,DraftSync,MaterialsCard,OutlineCard,ReviewCard,SkillStepsCard,OutlineStreamingView,DraftGeneratingView,ReviewStreamingView}.tsx`
|
|
||||||
- `agents/ai_writing/graph.py`、四个阶段节点、五个暂停点、`nodes/intent_parser.py`
|
|
||||||
|
|
||||||
### 绝不动（保证「初始的不用动」）
|
|
||||||
- `open-canvas/pages/AIWritingPage.tsx` 及其引用的
|
|
||||||
`components/ai-writing/{AIWritingForm,InterventionCard}.tsx`、`contexts/WritingFormContext.tsx`
|
|
||||||
- 旧路由 `/page/canvas/ai-writing`、`/page/workspace/ai-writing`、笔记本嵌入页
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 11. 待确认（默认取值已给出，可直接推进）
|
|
||||||
|
|
||||||
1. 意图引擎：**后端 LLM 节点（方案 A）+ 前端短句快路径** —— 默认采用。
|
|
||||||
2. `AIWritingContext` / `useAIWritingStream`：**复用**（不物理复制）——默认采用；需绝对隔离可改为复制。
|
|
||||||
3. 新页面入口：**侧边栏新增「AI写作(对话版)」** —— 默认加；若要先灰度可只留直链。
|
|
||||||
4. 「素材不足自动重搜」：**首期前端 pending 续跑**（不动后端 resume 协议）——默认采用。
|
|
||||||
5. 问答旁路：**首期意图节点直接带 `answer`** —— 默认采用。
|
|
||||||
|
|
||||||
> 以上默认按「A + 复用引擎 + 侧边栏入口 + 前端 pending + 意图节点带答案」推进，如需调整请指出。
|
|
||||||
@@ -1,454 +0,0 @@
|
|||||||
# AI 写作「对话驱动 + 意图解析」改造方案
|
|
||||||
|
|
||||||
> 目标：在**不动现有 AI 写作页面**的前提下，新建一个「对话驱动」的写作工作台。
|
|
||||||
> 去掉素材收集 / 大纲规划 / 作家写作 / 编辑审核各阶段**分散的输入框/表单**，
|
|
||||||
> 用**底部一个统一的智能输入框**接管全流程交互；该输入框具备**强意图解析**能力，
|
|
||||||
> 能准确识别用户意图（重新搜索、加素材、加关键词、重写大纲、按要求改大纲、改写作、
|
|
||||||
> 改编辑、提编辑意见、对写作内容提问……），并在**素材不足**时自动回退去重新检索素材。
|
|
||||||
|
|
||||||
本文只做**方案与实现指引**，不含代码改动。落地时按第 9 节的路线图分阶段推进。
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 1. 现状梳理（改造的地基）
|
|
||||||
|
|
||||||
现有 AI 写作是一套**独立的 LangGraph 子系统**（不是 lead_agent），前后端都已成型。
|
|
||||||
|
|
||||||
### 1.1 后端：`ai_writing` graph
|
|
||||||
|
|
||||||
- 图工厂：`offline-backend-20260512/backend/packages/harness/deerflow/agents/ai_writing/graph.py`
|
|
||||||
- 状态：`.../agents/ai_writing/state.py`（`AIWritingState` + `UserInterventionPayload`）
|
|
||||||
- 注册：`offline-backend-20260512/backend/langgraph.json` → `assistant_id = "ai_writing"`
|
|
||||||
- 执行：与 lead agent **共用** RunManager + StreamBridge + checkpointer（`app/gateway/services.py` 里 `assistant_id=="ai_writing"` 分发到 `make_ai_writing_graph`）
|
|
||||||
|
|
||||||
节点拓扑（实际）：
|
|
||||||
|
|
||||||
```
|
|
||||||
sample_analyzer → intent_parser → researcher
|
|
||||||
→ [cond] pause_material | writer_draft
|
|
||||||
→ writer_outline → pause_outline
|
|
||||||
→ writer_draft → [cond] pause_section_help | pause_draft | END
|
|
||||||
→ editor → [cond] pause_draft | pause_review
|
|
||||||
→ pause_review → END | writer_draft
|
|
||||||
```
|
|
||||||
|
|
||||||
四个「阶段大脑」节点：
|
|
||||||
|
|
||||||
| 阶段 | 节点 | 文件 |
|
|
||||||
|------|------|------|
|
|
||||||
| 素材收集 | `researcher` | `nodes/researcher.py` |
|
|
||||||
| 大纲规划 | `writer_outline` | `nodes/writer_outline.py` |
|
|
||||||
| 作家写作 | `writer_draft` | `nodes/writer_draft.py` |
|
|
||||||
| 编辑审核 | `editor` | `nodes/editor.py` |
|
|
||||||
|
|
||||||
五个**暂停点**（`interrupt()`，靠 `Command(resume=payload)` 续跑）：
|
|
||||||
|
|
||||||
| pause_point | 语义 | 可用 action（现有） |
|
|
||||||
|-------------|------|---------------------|
|
|
||||||
| `material_confirm` | 素材确认 | `confirm` / `re_search` / `supplement_search` / `enable_skill_search` |
|
|
||||||
| `outline_confirm` | 大纲确认 | `confirm` / `re_outline` |
|
|
||||||
| `draft_confirm` | 草稿确认 | `to_editor` / `finalize` / `user_revise` / `custom_revise` |
|
|
||||||
| `review_confirm` | 编辑打回确认 | `accept_review` / `force_finalize` |
|
|
||||||
| `section_help` | 素材不足求助 | `supplement` / `loose` / `delete` |
|
|
||||||
|
|
||||||
> resume 载荷字段（`UserInterventionPayload`）：`action`、`approved_material_ids`、
|
|
||||||
> `extra_keywords`、`user_query`(自然语言补充检索)、`edited_outline`、`outline_feedback`、
|
|
||||||
> `user_revision_notes`、`override_verdict`、`selected_issue_indices`、`section_decisions`。
|
|
||||||
> **关键点**：现有协议已经支持「自然语言 + 结构化 action」，这是对话改造的核心可复用资产。
|
|
||||||
|
|
||||||
REST（业务元数据，非图执行）：`app/gateway/routers/ai_writing.py`，前缀 `/api/ai-writing`
|
|
||||||
（sessions CRUD、transcript 保存、article-types、后台挂起 `/background` + `/progress` 等）。
|
|
||||||
|
|
||||||
持久化：`ai_writing_sessions` 表（`transcript` 为 `PortableLongText`）
|
|
||||||
+ `ai_writing_article_types`（`deerflow/persistence/...`）。
|
|
||||||
|
|
||||||
配置：`config.yaml → ai_writing`（`keyword_model`、`rank_model`、`max_materials`、
|
|
||||||
`use_builtin_agents.{researcher,outliner,writer,editor}` 等）。
|
|
||||||
|
|
||||||
### 1.2 前端：`open-canvas` 子系统
|
|
||||||
|
|
||||||
- 主页面：`frontend-web/src/open-canvas/pages/AIWritingPage.tsx`
|
|
||||||
- 路由：`/page/canvas/ai-writing`、`/page/workspace/ai-writing`
|
|
||||||
- 状态机：`contexts/AIWritingContext.tsx`（`useReducer` + LangGraph `useStream`）
|
|
||||||
- 事件翻译/reducer：`hooks/useAIWritingStream.ts`
|
|
||||||
- 类型：`types/ai-writing.ts`（`WritingStatus`、`ProgressEvent`、`UserInterventionPayload`、`AIWritingRequest`…）
|
|
||||||
- 流式：LangGraph `useStream`，`assistantId: 'ai_writing'`，`streamMode: ['values','updates','custom','messages-tuple']`
|
|
||||||
- **要去掉的输入 UI**（改造重点）：
|
|
||||||
- 启动表单 `components/ai-writing/AIWritingForm.tsx` + `WritingFormContext`
|
|
||||||
- 阶段暂停输入 `components/ai-writing/InterventionCard.tsx`（素材/大纲/草稿/审核四套内嵌表单）
|
|
||||||
- **已存在的对话原型**：`components/ai-writing/WritingSetupChat.tsx`
|
|
||||||
（用 `useThreadStream` 起一条 lead_agent 线程 + `setup_writing` 工具审批卡回填表单）——
|
|
||||||
这是「对话 → 结构化配置」的现成范式，可借鉴但**不直接复用**（它只管启动前配置）。
|
|
||||||
|
|
||||||
### 1.3 结论
|
|
||||||
|
|
||||||
- **状态机、流式、暂停/续跑协议、持久化都可复用**，无需重写引擎。
|
|
||||||
- 改造本质 = **把「分散表单」换成「一个对话输入框 + 意图路由层」**，
|
|
||||||
再把意图映射回**现有的 `action + payload`**（大部分场景），
|
|
||||||
少量新意图（如「对内容提问」「素材不足自动重搜」）需要**新增协议/节点**。
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 2. 目标与范围
|
|
||||||
|
|
||||||
### 2.1 必须满足
|
|
||||||
|
|
||||||
1. 新页面/新路由，**旧页面零改动**（用户要求「初始的不用动」）。
|
|
||||||
2. 底部**单一对话输入框**控制所有阶段交互，移除各阶段独立输入框。
|
|
||||||
3. **强意图解析**：准确识别用户自然语言意图并路由到正确动作，覆盖全流程 + 更多。
|
|
||||||
4. 用户给修改意见后，**若现有素材不足以满足要求 → 自动/建议重新检索素材**再继续。
|
|
||||||
5. 保留右侧草稿实时预览（可编辑）与时间线/进度展示。
|
|
||||||
|
|
||||||
### 2.2 明确不做（本期）
|
|
||||||
|
|
||||||
- 不改旧 `AIWritingPage` 及其表单/干预卡组件。
|
|
||||||
- 不替换底层 `ai_writing` graph 的四个阶段大脑逻辑（只加意图层与少量新协议）。
|
|
||||||
- 不引入新的状态管理库（继续 `useReducer` + `useStream`）。
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 3. 核心设计
|
|
||||||
|
|
||||||
### 3.1 总体思路：三层结构
|
|
||||||
|
|
||||||
```
|
|
||||||
┌─────────────────────────────────────────────────────────┐
|
|
||||||
│ 对话 UI 层（新） │
|
|
||||||
│ - 左：消息流（用户消息 + AI 阶段产物卡片 + 进度） │
|
|
||||||
│ - 底：统一智能输入框（唯一交互入口） │
|
|
||||||
│ - 右：草稿实时预览（复用 AIWritingDraftPanel） │
|
|
||||||
└───────────────┬─────────────────────────────────────────┘
|
|
||||||
│ 用户自然语言
|
|
||||||
▼
|
|
||||||
┌─────────────────────────────────────────────────────────┐
|
|
||||||
│ 意图解析层（新，核心） │
|
|
||||||
│ - 输入：用户文本 + 当前 WritingStatus + 上下文快照 │
|
|
||||||
│ - 输出：{ intent, action, payload, needResearch, ... } │
|
|
||||||
└───────────────┬─────────────────────────────────────────┘
|
|
||||||
│ 结构化 action + payload
|
|
||||||
▼
|
|
||||||
┌─────────────────────────────────────────────────────────┐
|
|
||||||
│ 执行层（复用现有） │
|
|
||||||
│ - 空闲态：startWriting(AIWritingRequest) │
|
|
||||||
│ - 暂停态：submitIntervention(UserInterventionPayload) │
|
|
||||||
│ - 运行中：stream.stop() → 续跑 / 新命令 │
|
|
||||||
│ - 提问态：旁路问答（不改写作状态） │
|
|
||||||
└─────────────────────────────────────────────────────────┘
|
|
||||||
```
|
|
||||||
|
|
||||||
**设计原则**：意图解析层是「翻译官」——把自由文本翻译成**现有执行层已经懂的指令**。
|
|
||||||
能复用 `action + payload` 的绝不新造协议；只有现有协议表达不了的才扩展。
|
|
||||||
|
|
||||||
### 3.2 意图分类体系（覆盖用户全流程 + 更多）
|
|
||||||
|
|
||||||
按「意图类别 → 触发时机（当前 status）→ 映射到的执行」组织。这是**意图解析引擎的目标 schema**。
|
|
||||||
|
|
||||||
#### A. 启动类（status = idle）
|
|
||||||
|
|
||||||
| 意图 | 说明 | 映射 |
|
|
||||||
|------|------|------|
|
|
||||||
| `start_writing` | 用户描述要写什么 | 解析成 `AIWritingRequest` → `startWriting()` |
|
|
||||||
| `start_with_outline` | 用户自带大纲 | `AIWritingRequest.userOutline` |
|
|
||||||
| `start_imitate` | 样文仿写 | `writingModeType=imitate` + 样文 |
|
|
||||||
|
|
||||||
#### B. 素材类（status ≈ awaiting_material_confirm / 运行中）
|
|
||||||
|
|
||||||
| 意图 | 用户说法示例 | 映射 |
|
|
||||||
|------|-------------|------|
|
|
||||||
| `confirm_materials` | 「素材可以，继续」 | `material_confirm` + `confirm`（可带勾选 ids） |
|
|
||||||
| `research_again` | 「重新搜索素材」 | `material_confirm` + `re_search` |
|
|
||||||
| `add_material` / `add_keyword` | 「补充关于 X 的素材」「加个关键词 Y」 | `material_confirm` + `supplement_search`，`user_query`=X/Y |
|
|
||||||
| `use_skill_search` | 「用 XX 技能查」 | `material_confirm` + `enable_skill_search`，`user_query`=技能/来源 |
|
|
||||||
| `select_materials` | 「只用第 1、3 条」 | `confirm` + `approved_material_ids` 子集 |
|
|
||||||
| `drop_materials` | 「去掉第 2 条」 | 同上，反选后 `approved_material_ids` |
|
|
||||||
|
|
||||||
#### C. 大纲类（status ≈ awaiting_outline_confirm）
|
|
||||||
|
|
||||||
| 意图 | 示例 | 映射 |
|
|
||||||
|------|------|------|
|
|
||||||
| `confirm_outline` | 「大纲 OK」 | `outline_confirm` + `confirm` |
|
|
||||||
| `reoutline` | 「重写大纲」 | `outline_confirm` + `re_outline`（`outline_feedback` 可空） |
|
|
||||||
| `revise_outline` | 「第二章拆成两节」「调整顺序」 | `re_outline` + `outline_feedback`=自然语言 |
|
|
||||||
| `edit_outline_manually` | 用户直接给出新大纲文本 | 解析成 `edited_outline` |
|
|
||||||
|
|
||||||
#### D. 写作/草稿类（status ≈ awaiting_draft_confirm / writing_draft）
|
|
||||||
|
|
||||||
| 意图 | 示例 | 映射 |
|
|
||||||
|------|------|------|
|
|
||||||
| `to_editor` | 「交给编辑审核」 | `draft_confirm` + `to_editor` |
|
|
||||||
| `finalize` | 「就这样定稿」 | `draft_confirm` + `finalize` |
|
|
||||||
| `revise_draft` | 「第三段太啰嗦，精简」「补个案例」 | `draft_confirm` + `user_revise`，`user_revision_notes`=意见 |
|
|
||||||
| `rewrite_section` | 「重写第二章」 | `user_revise` + 定位信息（章节）写进 notes |
|
|
||||||
| `change_tone/style` | 「更口语一点」 | `user_revise` + notes |
|
|
||||||
|
|
||||||
#### E. 编辑审核类（status ≈ awaiting_review_confirm）
|
|
||||||
|
|
||||||
| 意图 | 示例 | 映射 |
|
|
||||||
|------|------|------|
|
|
||||||
| `accept_review` | 「按编辑意见改」 | `review_confirm` + `accept_review`（可带 `selected_issue_indices`） |
|
|
||||||
| `partial_accept_review` | 「只接受第 1、2 条意见」 | `accept_review` + `selected_issue_indices` |
|
|
||||||
| `force_finalize` | 「不改了，强制定稿」 | `review_confirm` + `force_finalize` |
|
|
||||||
| `add_review_opinion` | 「你再补一条：检查数据准确性」 | 追加自定义审核意见（见 5.3 扩展） |
|
|
||||||
|
|
||||||
#### F. 素材不足求助类（status = awaiting_section_help）
|
|
||||||
|
|
||||||
| 意图 | 映射 |
|
|
||||||
|------|------|
|
|
||||||
| `section_supplement` | `section_help` + `supplement`（去重搜） |
|
|
||||||
| `section_loose` | `section_help` + `loose`（放宽续写） |
|
|
||||||
| `section_delete` | `section_help` + `delete` |
|
|
||||||
|
|
||||||
#### G. 问答类（**新**，任意 status，旁路，不改写作状态）
|
|
||||||
|
|
||||||
| 意图 | 示例 | 映射 |
|
|
||||||
|------|------|------|
|
|
||||||
| `ask_about_content` | 「第二章讲了啥？」「为什么用这个论点？」 | 旁路问答（见 5.4） |
|
|
||||||
| `ask_meta` | 「现在进行到哪一步？」「用了哪些素材？」 | 读当前 state 直接回答，不走图 |
|
|
||||||
|
|
||||||
#### H. 控制类（**新/半新**）
|
|
||||||
|
|
||||||
| 意图 | 映射 |
|
|
||||||
|------|------|
|
|
||||||
| `undo/back` | 回退到上一暂停点（依赖 checkpoint 回滚，见 8.4） |
|
|
||||||
| `restart_stage` | 重跑当前阶段 |
|
|
||||||
| `run_background` | 挂起后台自动跑 → `POST /sessions/{id}/background` |
|
|
||||||
| `cancel` | `stream.stop()` |
|
|
||||||
| `unknown/clarify` | 无法判定 → 反问澄清（对话追问，不误触发） |
|
|
||||||
|
|
||||||
> **覆盖「甚至更多」**：G（问答）、H（控制）、以及 D/E 里「素材不足自动回退重搜」都是超出原表单能力的新增。
|
|
||||||
|
|
||||||
### 3.3 「素材不足自动重搜」的判定与回退（用户强调的重点）
|
|
||||||
|
|
||||||
触发场景：用户在**大纲/草稿/审核**阶段提出修改意见，但意见需要的**信息现有素材里没有**。
|
|
||||||
|
|
||||||
判定放在**意图解析层**输出一个 `needResearch: boolean` + `researchQuery`，判定来源二选一（推荐组合）：
|
|
||||||
|
|
||||||
1. **意图解析 LLM 直接判断**：把「当前素材摘要（keywords + 每条 title/来源）」喂给意图解析
|
|
||||||
prompt，让它判断「用户这条意见能否用现有素材满足」。不能 → `needResearch=true` 并给出检索词。
|
|
||||||
2. **执行阶段兜底**：`writer_draft` 严格模式本就有 `blocked_sections` → `pause_section_help`，
|
|
||||||
这是**已有的**素材不足闸门；对话层把它翻译成「素材不足，是否重新检索？」的对话追问。
|
|
||||||
|
|
||||||
回退动作：`needResearch=true` 时，先走 `material_confirm + supplement_search`（或新的
|
|
||||||
「带目标的重搜」协议，见 8.3）补素材，**补完自动继续**用户原本的修改意图（需要在对话层
|
|
||||||
记住「pending 修改意图」，重搜结束后再提交）。
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 4. 意图解析引擎：方案对比与推荐
|
|
||||||
|
|
||||||
| 方案 | 做法 | 优点 | 缺点 |
|
|
||||||
|------|------|------|------|
|
|
||||||
| **A. 后端 LLM 意图节点**（推荐） | 新增 `/api/ai-writing/intent/parse`（或图内新节点），后端用 LLM 把 `{text, status, contextSnapshot}` → 结构化意图 JSON | 能吃到完整 state（素材/大纲/草稿）；可判 `needResearch`；prompt/模型集中可控；离线内网可用配置模型 | 多一次网络往返（可接受，交互本就等待） |
|
|
||||||
| B. 前端调模型接口分类 | 前端直接调现有 `/api/models` 聊天做分类 | 少一层后端改动 | 前端难拿全后端 state 快照；prompt 分散；鉴权/模型选择复杂 |
|
|
||||||
| C. 规则 + LLM 混合 | 常见短句走关键词规则快路径，兜底 LLM | 快、省 token | 规则易漏、维护成本高；中文表达多样命中率低 |
|
|
||||||
|
|
||||||
**推荐 A（后端 LLM 意图节点）**，并在其上**叠加 C 的快路径**做优化（如「确认/继续/定稿」等
|
|
||||||
高频短句先走轻量规则，未命中再调 LLM）。理由：
|
|
||||||
|
|
||||||
- 意图判定需要**当前写作上下文**（尤其 `needResearch` 判定），后端天然持有 state/checkpoint。
|
|
||||||
- 与现有「配置助手 `setup_writing`」一脉相承，模型选择/离线部署策略统一。
|
|
||||||
- 输出 schema 稳定，前端只消费结构化结果，UI 简单。
|
|
||||||
|
|
||||||
### 4.1 意图解析输出契约（建议）
|
|
||||||
|
|
||||||
```jsonc
|
|
||||||
{
|
|
||||||
"intent": "revise_draft", // 见第 3.2 分类
|
|
||||||
"pausePoint": "draft_confirm", // 若需 resume；否则 null
|
|
||||||
"action": "user_revise", // 映射到现有 action；新意图可为新值
|
|
||||||
"payload": { // 直接可喂 submitIntervention 的字段
|
|
||||||
"userRevisionNotes": "第三段精简，并补一个 2024 年的案例"
|
|
||||||
},
|
|
||||||
"needResearch": true, // 素材是否不足
|
|
||||||
"researchQuery": "2024 行业案例", // needResearch 时的检索意图
|
|
||||||
"answer": null, // 问答类意图的直接回答（旁路）
|
|
||||||
"confidence": 0.86,
|
|
||||||
"clarify": null // 低置信时的反问话术
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
前端拿到后：
|
|
||||||
- `answer` 非空 → 直接在对话流渲染回答（问答旁路，不动写作状态）。
|
|
||||||
- `clarify` 非空或 `confidence` 低 → 渲染反问，等用户澄清（**防误触发**）。
|
|
||||||
- `needResearch=true` → 先重搜，缓存 `payload` 为 pending，重搜完再提交。
|
|
||||||
- 否则 → `submitIntervention({action, ...payload})` 或 `startWriting(...)`。
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 5. 前端改造方案
|
|
||||||
|
|
||||||
### 5.1 新页面与路由
|
|
||||||
|
|
||||||
- 新目录：`frontend-web/src/open-canvas/pages/AIWritingChatPage.tsx`（或 `conversational/` 子目录）。
|
|
||||||
- 新路由：`/page/canvas/ai-writing-chat`（在 `OpenCanvasRoutes.tsx` 注册；旧路由保留）。
|
|
||||||
- 侧边栏：`sidebar-menu.ts` 加一个入口（如「AI 写作（对话版）」），或先不加、内部灰度。
|
|
||||||
|
|
||||||
### 5.2 复用 vs 新建
|
|
||||||
|
|
||||||
| 复用（尽量不改） | 新建 |
|
|
||||||
|------------------|------|
|
|
||||||
| `AIWritingContext` / `useAIWritingStream`（状态机 + 流式） | 统一对话输入框组件 `WritingChatComposer` |
|
|
||||||
| `AIWritingDraftPanel`（右侧草稿预览） | 消息流容器 `WritingChatThread`（渲染阶段产物为消息卡片） |
|
|
||||||
| `types/ai-writing.ts`（按需扩展） | 意图解析客户端 `api/ai-writing-intent.ts` |
|
|
||||||
| `ProgressEvent` 事件模型 | 阶段产物 → 消息卡片的适配器 `progressToMessage.ts` |
|
|
||||||
| 会话持久化 REST | 「pending 意图」暂存逻辑（重搜后续跑） |
|
|
||||||
|
|
||||||
**不复用**：`AIWritingForm` / `WritingFormContext` / `InterventionCard`（这三个就是要去掉的表单）。
|
|
||||||
|
|
||||||
### 5.3 交互流程（对话版）
|
|
||||||
|
|
||||||
1. 空闲：用户在底部输入「写一篇关于 X 的深度分析，2000 字」→ 意图解析 `start_writing`
|
|
||||||
→ 组装 `AIWritingRequest` → `startWriting()`。
|
|
||||||
2. 运行中：`ProgressEvent`（`research_progress`/`outline_chunk`/`draft_chunk`…）
|
|
||||||
→ 适配成消息流里的**进度卡片/流式卡片**（复用现有流式视图组件的展示部分）。
|
|
||||||
3. 到达暂停点：不再弹 `InterventionCard`，而是在消息流里展示**阶段产物卡片**
|
|
||||||
（素材列表 / 大纲 / 草稿 / 审核结果）+ 一句提示「你可以说：确认继续 / 补充素材 / 改大纲…」。
|
|
||||||
用户下一句自然语言 → 意图解析 → `submitIntervention`。
|
|
||||||
4. 问答：任意时刻用户提问 → 旁路回答，不打断写作状态。
|
|
||||||
5. 素材不足：意图解析 `needResearch` 或后端 `section_help` → 对话追问「素材不足，帮你重搜？」
|
|
||||||
→ 确认后重搜 → 自动续跑 pending 意图。
|
|
||||||
|
|
||||||
### 5.4 问答旁路（新能力）
|
|
||||||
|
|
||||||
「对写作内容提问」不应改写作 state。两种实现：
|
|
||||||
|
|
||||||
- **轻量（推荐先做）**：意图解析节点直接带回 `answer`（后端能读 state，一次调用出答案）。
|
|
||||||
- **完整**：新起一条**只读**问答线程（lead_agent，context 注入当前草稿/大纲作为背景），
|
|
||||||
类似 `WritingSetupChat` 的 `useThreadStream` 模式，但只读不回填。
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 6. 后端改造方案
|
|
||||||
|
|
||||||
### 6.1 意图解析入口（二选一）
|
|
||||||
|
|
||||||
- **方案 A1（推荐，独立 REST）**：`app/gateway/routers/ai_writing.py` 新增
|
|
||||||
`POST /api/ai-writing/sessions/{id}/intent`，入参 `{text}`，后端读该 session 的
|
|
||||||
checkpoint state（素材/大纲/草稿摘要）+ 用 `ai_writing` 配置模型解析，返回第 4.1 的契约。
|
|
||||||
- 好处：不改图拓扑；前端拿到结果后再决定调 `startWriting`/`submitIntervention`。
|
|
||||||
- 方案 A2（图内节点）：在图里加 `conversation_router` 节点。改动大、状态耦合高，**不推荐**首期。
|
|
||||||
|
|
||||||
### 6.2 意图解析 prompt
|
|
||||||
|
|
||||||
新增 `agents/ai_writing/prompts/intent_router_prompts.py`（或复用/扩展 `intent_parser.py`）：
|
|
||||||
- 输入：用户文本、`current_status`、素材摘要（keywords + 每条 title/source）、大纲纲要、
|
|
||||||
草稿字数/章节标题、审核意见列表。
|
|
||||||
- 输出：严格 JSON（第 4.1 契约）。要求模型**只在证据充分时给高 confidence**，
|
|
||||||
否则给 `clarify`（防误触发是硬指标）。
|
|
||||||
|
|
||||||
### 6.3 「带目标的重搜」协议扩展（可选增强）
|
|
||||||
|
|
||||||
现有 `supplement_search` 用 `user_query` 追加检索。为支持「改稿意见 → 缺素材 → 重搜 → 自动续跑」，
|
|
||||||
建议在 `material_confirm` 的 resume 里新增可选字段 `resume_intent`（重搜完成后要自动执行的原始意图）。
|
|
||||||
- 前端也可**纯前端**实现（重搜完成事件回来后再自动提交缓存的 pending payload），**首期优先前端实现**，避免动后端协议。
|
|
||||||
|
|
||||||
### 6.4 追加自定义审核意见（`add_review_opinion`）
|
|
||||||
|
|
||||||
`editor`/`pause_review` 目前只接受「接受/强制定稿」。要支持「你再补一条审核意见」，
|
|
||||||
需在 `review_confirm` resume 里接受 `extra_review_notes`，`editor` 或 `writer_draft`
|
|
||||||
修订时并入。首期可先降级为 `user_revise` + notes（把用户的审核诉求当作改稿意见），
|
|
||||||
**完整版**再扩协议。
|
|
||||||
|
|
||||||
### 6.5 不需要改的部分
|
|
||||||
|
|
||||||
- 四个阶段大脑节点（researcher/writer_outline/writer_draft/editor）逻辑不动。
|
|
||||||
- 五个暂停点、checkpoint、StreamBridge、持久化不动。
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 7. 数据流时序（改稿 + 素材不足自动重搜）
|
|
||||||
|
|
||||||
```
|
|
||||||
用户: "第三段补个2024年的行业案例"
|
|
||||||
│
|
|
||||||
▼ POST /api/ai-writing/sessions/{id}/intent { text }
|
|
||||||
后端: 读 state(素材摘要) + LLM 解析
|
|
||||||
│ 返回 { intent:revise_draft, action:user_revise,
|
|
||||||
│ payload:{userRevisionNotes:...},
|
|
||||||
│ needResearch:true, researchQuery:"2024 行业案例" }
|
|
||||||
▼
|
|
||||||
前端: needResearch=true → 缓存 pending=payload
|
|
||||||
│ 对话追问/直接执行: submitIntervention(material_confirm, supplement_search, user_query="2024 行业案例")
|
|
||||||
▼ LangGraph resume → researcher 补素材 → materials_ready
|
|
||||||
前端: 收到新素材 → 自动提交 pending
|
|
||||||
│ submitIntervention(draft_confirm, user_revise, userRevisionNotes=...)
|
|
||||||
▼ writer_draft 用新素材改稿 → draft_chunk... → draft_ready → pause_draft
|
|
||||||
前端: 消息流展示新草稿 + "已按你的意见改写并补充了案例"
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 8. 关键实现细节与坑
|
|
||||||
|
|
||||||
1. **暂停态识别**：对话层必须知道「现在停在哪个 pause_point」才能正确映射 action。
|
|
||||||
`AIWritingContext` 已有 `currentPause`/`status`，直接读。
|
|
||||||
2. **防误触发**：低置信意图一律走 `clarify` 反问，绝不猜着执行（尤其 `finalize`/`re_search` 这种代价大的）。
|
|
||||||
3. **pending 意图队列**：素材不足重搜是「先插一段、再回原意图」，需要一个小状态机记住 pending，
|
|
||||||
并处理「重搜后用户又改主意」的情况（重搜完成前允许覆盖 pending）。
|
|
||||||
4. **回退/undo（H 类）**：依赖 checkpoint 回滚，`runtime/runs/worker.py` 有 `rollback` 概念，
|
|
||||||
首期可**不做**或只做「重跑当前阶段」。
|
|
||||||
5. **问答旁路不污染 transcript**：问答消息可标记 `kind:'qa'`，与写作进度事件区分持久化。
|
|
||||||
6. **流式产物→消息卡片**：复用现有 `OutlineStreamingView`/`DraftStreamingPreview` 等的**展示部分**，
|
|
||||||
套进消息气泡即可，不必重写渲染。
|
|
||||||
7. **离线内网**：意图解析模型走 `config.yaml → ai_writing` 里的配置模型；检索仍走技能/内网 ES，
|
|
||||||
不联网（与现有并行席位「禁 web_search」的离线策略一致）。
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 9. 分阶段实施路线图
|
|
||||||
|
|
||||||
**阶段 0 — 骨架（不含意图）**
|
|
||||||
- 新路由 + 新页面 `AIWritingChatPage`，复用 `AIWritingContext`/`useStream`/`DraftPanel`。
|
|
||||||
- 底部对话框先只做「空闲 `start_writing` + 暂停点固定按钮」跑通端到端（相当于把干预卡换成消息）。
|
|
||||||
|
|
||||||
**阶段 1 — 意图解析（核心）**
|
|
||||||
- 后端 `POST /sessions/{id}/intent` + intent prompt，返回第 4.1 契约。
|
|
||||||
- 前端接入：自然语言 → 意图 → `startWriting`/`submitIntervention`，覆盖 A~F 类意图。
|
|
||||||
- 加高频短句规则快路径 + 低置信 `clarify` 反问。
|
|
||||||
|
|
||||||
**阶段 2 — 问答旁路 + 素材不足自动重搜**
|
|
||||||
- G 类问答（先用 intent 节点直接带 `answer`）。
|
|
||||||
- `needResearch` + pending 意图机制（前端实现重搜后自动续跑）。
|
|
||||||
|
|
||||||
**阶段 3 — 增强协议（按需）**
|
|
||||||
- `add_review_opinion` 扩 `review_confirm` 协议、`resume_intent` 后端化、undo/回退。
|
|
||||||
|
|
||||||
**阶段 4 — 打磨**
|
|
||||||
- 消息卡片视觉、历史回看（复用 transcript）、后台挂起入口、灰度到侧边栏。
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 10. 关键文件清单（落地时对照）
|
|
||||||
|
|
||||||
### 新增（前端）
|
|
||||||
- `open-canvas/pages/AIWritingChatPage.tsx` — 新页面
|
|
||||||
- `open-canvas/components/ai-writing-chat/WritingChatComposer.tsx` — 统一输入框
|
|
||||||
- `open-canvas/components/ai-writing-chat/WritingChatThread.tsx` — 消息流
|
|
||||||
- `open-canvas/components/ai-writing-chat/progressToMessage.ts` — 事件→消息适配
|
|
||||||
- `open-canvas/api/ai-writing-intent.ts` — 意图解析客户端
|
|
||||||
- 路由注册：`open-canvas/OpenCanvasRoutes.tsx`（+ 可选 `sidebar-menu.ts`）
|
|
||||||
|
|
||||||
### 新增（后端）
|
|
||||||
- `app/gateway/routers/ai_writing.py` — 加 `POST /sessions/{id}/intent`
|
|
||||||
- `agents/ai_writing/prompts/intent_router_prompts.py` — 意图 prompt
|
|
||||||
- （阶段 3）`state.py` / `nodes/*` — 扩 `review_confirm`、`resume_intent`
|
|
||||||
|
|
||||||
### 复用（尽量不改）
|
|
||||||
- `open-canvas/contexts/AIWritingContext.tsx`、`hooks/useAIWritingStream.ts`
|
|
||||||
- `open-canvas/components/ai-writing/AIWritingDraftPanel.tsx` 及各流式展示组件
|
|
||||||
- `open-canvas/types/ai-writing.ts`（按需扩字段）
|
|
||||||
- `agents/ai_writing/graph.py`、四个阶段节点、五个暂停点
|
|
||||||
|
|
||||||
### 不动
|
|
||||||
- 旧 `open-canvas/pages/AIWritingPage.tsx` 及 `AIWritingForm`/`WritingFormContext`/`InterventionCard`
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 11. 待确认
|
|
||||||
|
|
||||||
1. 意图解析引擎是否采用**推荐的方案 A（后端 LLM 节点）**？
|
|
||||||
2. 新页面是**独立入口**（侧边栏新增）还是先**内部灰度**（仅直链）？
|
|
||||||
3. 「素材不足自动重搜」首期是否接受**前端实现 pending 续跑**（不动后端 resume 协议）？
|
|
||||||
4. 问答旁路首期是否接受**意图节点直接带答案**（不新起只读线程）？
|
|
||||||
|
|
||||||
> 以上默认按「A / 内部灰度 / 前端 pending / 意图节点带答案」推进，如需调整请指出。
|
|
||||||
@@ -1,148 +0,0 @@
|
|||||||
# 定时任务 — 模板填充「源数据抽取」手工测试清单
|
|
||||||
|
|
||||||
> 覆盖功能：定时任务「模板数据转换器」内置 agent —— 把用户传入的源数据转换成 HTML
|
|
||||||
> 模板的 `DATA` 结构并填充生成可预览页面。**重点测「源数据抽取」**：源可能是
|
|
||||||
> ① 纯 JSON、② 含 JSON 的文本、③ 纯文本，三种形态都要正确处理。
|
|
||||||
>
|
|
||||||
> 测试环境：后端 `http://localhost:8001`（`make dev`），前端 `http://localhost:5174`（`pnpm dev`）。
|
|
||||||
> 相关代码：`deerflow/runtime/scheduler/template_fill.py`（`extract_embedded_json`）、
|
|
||||||
> `service.py`（`_run_template_fill_attempt` / `_build_conversion_prompt`）、
|
|
||||||
> `pages/ScheduledTasksPage.tsx`。
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 前置 — 进入表单
|
|
||||||
|
|
||||||
| # | 步骤 | 预期结果 |
|
|
||||||
|---|------|----------|
|
|
||||||
| 0.1 | 任务管理 → 新建定时任务 | 弹出「新建定时任务」对话框 |
|
|
||||||
| 0.2 | 「执行智能体」下拉选择 **模板数据转换器** | 表单出现「HTML 模板」下拉；「必须生成 HTML/Markdown」两个开关隐藏 |
|
|
||||||
| 0.3 | 「HTML 模板」下拉选择 **no.1** | 下方出现「上传 .json」按钮 + 源数据文本框；说明含「未提供源 JSON 时，将直接展示该模板的默认数据」|
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## T1 — 源形态①：纯 JSON
|
|
||||||
|
|
||||||
| # | 步骤 / 输入 | 预期结果 |
|
|
||||||
|---|------|----------|
|
|
||||||
| 1.1 | 在源数据框粘贴纯 JSON（示例见下「样例 A」） | 文本框正常接收，无报错 |
|
|
||||||
| 1.2 | 保存任务 → 「立即执行」 | 执行记录新增一条，状态最终 succeeded |
|
|
||||||
| 1.3 | 打开执行记录 → HTML 预览 | 渲染出 no.1 大屏，**总览指标/各列表数据来自粘贴的 JSON**（而非模板默认值）|
|
|
||||||
| 1.4 | 执行记录正文 | 文案为「已根据源数据填充模板「no.1」生成页面」|
|
|
||||||
|
|
||||||
## T2 — 源形态②：含 JSON 的文本（抽取重点）
|
|
||||||
|
|
||||||
| # | 步骤 / 输入 | 预期结果 |
|
|
||||||
|---|------|----------|
|
|
||||||
| 2.1 | 粘贴「样例 B」（前后是中文说明，中间夹一段 JSON） | 文本框正常接收 |
|
|
||||||
| 2.2 | 保存 → 立即执行 → 查看 HTML | 页面数据以**夹带的 JSON 为准**填充；正文里的补充说明（如「重点突出 X」）被一并参考 |
|
|
||||||
| 2.3 | 验证抽取正确性：JSON 字符串值里含 `}`（如 `"备注": "进度 80%}尚未完成"`） | 不会被误判为 JSON 块提前结束，整段 JSON 被完整抽取 |
|
|
||||||
|
|
||||||
## T3 — 源形态③：纯文本（无 JSON）
|
|
||||||
|
|
||||||
| # | 步骤 / 输入 | 预期结果 |
|
|
||||||
|---|------|----------|
|
|
||||||
| 3.1 | 粘贴「样例 C」（一段纯中文描述，无任何 JSON） | 文本框正常接收 |
|
|
||||||
| 3.2 | 保存 → 立即执行 → 查看 HTML | 智能体**理解文本语义**后据实填充模板，产出完整可预览页面（数据可能较稀疏但结构完整）|
|
|
||||||
| 3.3 | 不应报「未返回 JSON」类硬失败（除非模型彻底失败重试耗尽）| 状态 succeeded |
|
|
||||||
|
|
||||||
## T4 — 空源 → 模板默认数据
|
|
||||||
|
|
||||||
| # | 步骤 | 预期结果 |
|
|
||||||
|---|------|----------|
|
|
||||||
| 4.1 | 源数据框留空，保存 → 立即执行 | **不调用模型**，直接用 no.1 模板自带的默认数据生成 |
|
|
||||||
| 4.2 | 执行记录正文 | 「未提供源数据，已用模板「no.1」的默认数据生成页面」|
|
|
||||||
| 4.3 | HTML 预览 | 展示模板内置的默认大屏 |
|
|
||||||
|
|
||||||
## T5 — 上传 .json 文件
|
|
||||||
|
|
||||||
| # | 步骤 | 预期结果 |
|
|
||||||
|---|------|----------|
|
|
||||||
| 5.1 | 点击「上传 .json 文件」，选一个合法 `.json` | 文件内容被读入源数据文本框 |
|
|
||||||
| 5.2 | 上传一个非法 JSON 内容的文件 | toast 提示「文件不是合法 JSON，已填入文本框请检查」，内容仍填入（可手改）|
|
|
||||||
| 5.3 | 连续上传同一个文件两次 | 第二次仍能触发读取（input 已被重置 value）|
|
|
||||||
|
|
||||||
## T6 — no.2（只展示模板）
|
|
||||||
|
|
||||||
| # | 步骤 | 预期结果 |
|
|
||||||
|---|------|----------|
|
|
||||||
| 6.1 | 「HTML 模板」下拉选 **no.2** | **隐藏**上传按钮与源数据文本框；显示「该模板暂为直接展示已有数据，无需填写」|
|
|
||||||
| 6.2 | 即使之前填过源数据，保存 → 立即执行 | 忽略源数据，**原样输出** no.2 现有页面 |
|
|
||||||
| 6.3 | 执行记录正文 | 「已展示模板「no.2」的现有数据」|
|
|
||||||
|
|
||||||
## T7 — 编辑回显
|
|
||||||
|
|
||||||
| # | 步骤 | 预期结果 |
|
|
||||||
|---|------|----------|
|
|
||||||
| 7.1 | 对已保存的模板任务点「编辑」 | 「执行智能体」「HTML 模板」「源数据」均正确回显 |
|
|
||||||
| 7.2 | 把模板从 no.1 改成 no.2 再保存 | 切到 no.2 时源数据区即时隐藏；保存后执行走只展示分支 |
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 样例数据（可直接复制粘贴到源数据框）
|
|
||||||
|
|
||||||
### 样例 A — 纯 JSON
|
|
||||||
|
|
||||||
```json
|
|
||||||
{
|
|
||||||
"overview": {
|
|
||||||
"核心指标": [
|
|
||||||
{ "名称": "综合区域", "数值": 7, "单位": "区", "说明": "测试数据" },
|
|
||||||
{ "名称": "组织与单位", "数值": 188, "单位": "个", "说明": "测试数据" }
|
|
||||||
]
|
|
||||||
},
|
|
||||||
"regions": [
|
|
||||||
{ "name": "测试区域甲", "scope": "本岛西岸" }
|
|
||||||
],
|
|
||||||
"equipment": [
|
|
||||||
{ "name_zh": "测试装备X", "category": "无人系统", "status": "列装" }
|
|
||||||
]
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
> 预期：总览第一项「综合区域」显示 **7**，「组织与单位」显示 **188**，区域/装备出现「测试区域甲」「测试装备X」。
|
|
||||||
|
|
||||||
### 样例 B — 含 JSON 的文本
|
|
||||||
|
|
||||||
```
|
|
||||||
这是本月台海态势数据，请据此填充大屏，重点突出离岛防卫：
|
|
||||||
|
|
||||||
{"overview": {"核心指标": [{"名称": "综合区域", "数值": 9, "单位": "区", "说明": "含离岛"}]}, "regions": [{"name": "离岛防区", "scope": "外岛", "备注": "进度 80%}尚未完成"}]}
|
|
||||||
|
|
||||||
以上数据来自 6 月例会，务必准确，不要臆造未提供的字段。
|
|
||||||
```
|
|
||||||
|
|
||||||
> 预期：① 数据以中间 JSON 为准（综合区域=9、出现「离岛防区」）；② 字符串里的 `}`（`进度 80%}`）不破坏抽取；③ 前后的「重点突出离岛防卫」「务必准确」作为补充说明被模型参考。
|
|
||||||
|
|
||||||
### 样例 C — 纯文本
|
|
||||||
|
|
||||||
```
|
|
||||||
请整理一份台湾滨海防卫概览：覆盖本岛沿岸 9 个综合区域，组织与单位约 280 个，
|
|
||||||
装备条目近百项（含无人系统、防空、海军平台等类别），并列出若干关键节点与近期演习。
|
|
||||||
数据以离线知识为准，没有的字段留空即可。
|
|
||||||
```
|
|
||||||
|
|
||||||
> 预期：智能体理解语义后据实填充，产出结构完整的页面（具体数值取决于模型，可较稀疏），不报硬失败。
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 后端单元测试（自动化补充）
|
|
||||||
|
|
||||||
```bash
|
|
||||||
# 在 offline-backend-20260512/backend/ 下运行
|
|
||||||
PYTHONPATH=. uv run --no-sync pytest tests/test_template_fill.py -v # 引擎：抽取/校验/填充/注册表
|
|
||||||
PYTHONPATH=. uv run --no-sync pytest tests/test_template_fill_attempt.py -v # 调度器执行分支：三形态/默认/只展示/重试
|
|
||||||
PYTHONPATH=. uv run --no-sync pytest tests/test_template_builder_seed.py -v # 内置 agent 种子
|
|
||||||
```
|
|
||||||
|
|
||||||
抽取相关关键用例：
|
|
||||||
- `test_extract_embedded_json_pure_object` / `_pure_array` —— 纯 JSON。
|
|
||||||
- `test_extract_embedded_json_text_with_json` / `_fenced` —— 含 JSON 的文本 / ```json 围栏。
|
|
||||||
- `test_extract_embedded_json_plain_text_returns_none` —— 纯文本返回 None。
|
|
||||||
- `test_extract_embedded_json_ignores_braces_in_strings` —— 引号内 `}` 不误判。
|
|
||||||
- `test_text_with_embedded_json_surfaced_in_prompt` —— 转换 prompt 单独标注「识别到的结构化数据」。
|
|
||||||
- `test_plain_text_source_converts` —— 纯文本仍照常转换。
|
|
||||||
- `test_empty_source_uses_template_default` —— 空源用模板默认数据。
|
|
||||||
- `test_display_only_template_renders_as_is` —— no.2 原样输出。
|
|
||||||
|
|
||||||
三个文件应全部通过（0 failed）。
|
|
||||||
@@ -15,9 +15,8 @@
|
|||||||
</script>
|
</script>
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||||
<title>CM 助手</title>
|
<title>CM 助手</title>
|
||||||
<script src="/runtime-config.js"></script>
|
</head>
|
||||||
</head>
|
|
||||||
<body>
|
<body>
|
||||||
<div id="root"></div>
|
<div id="root"></div>
|
||||||
<script type="module" src="/src/main.tsx"></script>
|
<script type="module" src="/src/main.tsx"></script>
|
||||||
|
|||||||
@@ -7,12 +7,9 @@
|
|||||||
"dev": "vite",
|
"dev": "vite",
|
||||||
"build": "node --max-old-space-size=8192 ./node_modules/vite/bin/vite.js build",
|
"build": "node --max-old-space-size=8192 ./node_modules/vite/bin/vite.js build",
|
||||||
"build:sit": "node --max-old-space-size=8192 ./node_modules/vite/bin/vite.js build --mode sit",
|
"build:sit": "node --max-old-space-size=8192 ./node_modules/vite/bin/vite.js build --mode sit",
|
||||||
"build:test": "node --max-old-space-size=8192 ./node_modules/vite/bin/vite.js build --mode test",
|
|
||||||
"build:network": "node --max-old-space-size=8192 ./node_modules/vite/bin/vite.js build --mode network",
|
"build:network": "node --max-old-space-size=8192 ./node_modules/vite/bin/vite.js build --mode network",
|
||||||
"preview": "vite preview",
|
"preview": "vite preview",
|
||||||
"typecheck": "tsc --noEmit",
|
"typecheck": "tsc --noEmit"
|
||||||
"check:chrome109-css": "node scripts/check-chrome109-css.mjs",
|
|
||||||
"check:legacy-chrome-css": "node scripts/check-chrome109-css.mjs"
|
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@codemirror/lang-css": "^6.3.1",
|
"@codemirror/lang-css": "^6.3.1",
|
||||||
@@ -112,7 +109,6 @@
|
|||||||
"@types/react": "^19.0.0",
|
"@types/react": "^19.0.0",
|
||||||
"@types/react-dom": "^19.0.0",
|
"@types/react-dom": "^19.0.0",
|
||||||
"@vitejs/plugin-react": "^5.0.4",
|
"@vitejs/plugin-react": "^5.0.4",
|
||||||
"lightningcss": "^1.30.2",
|
|
||||||
"postcss": "^8.5.3",
|
"postcss": "^8.5.3",
|
||||||
"tailwindcss": "^4.0.15",
|
"tailwindcss": "^4.0.15",
|
||||||
"tw-animate-css": "^1.4.0",
|
"tw-animate-css": "^1.4.0",
|
||||||
|
|||||||
@@ -1,11 +1,5 @@
|
|||||||
import tailwindcss from "@tailwindcss/postcss";
|
export default {
|
||||||
import legacyColorFallback from "./scripts/postcss-legacy-color-fallback.mjs";
|
plugins: {
|
||||||
import lightningCssLegacyChrome from "./scripts/postcss-lightningcss-chrome109.mjs";
|
"@tailwindcss/postcss": {},
|
||||||
|
},
|
||||||
export default {
|
};
|
||||||
plugins: [
|
|
||||||
tailwindcss(),
|
|
||||||
legacyColorFallback(),
|
|
||||||
lightningCssLegacyChrome(),
|
|
||||||
],
|
|
||||||
};
|
|
||||||
Binary file not shown.
|
Before Width: | Height: | Size: 951 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 967 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1000 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 959 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 310 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 543 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 582 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 53 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 966 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 33 KiB |
@@ -1,28 +0,0 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" role="img" aria-labelledby="title">
|
|
||||||
<title id="title">CM 助手</title>
|
|
||||||
<defs>
|
|
||||||
<linearGradient id="logoTopLeft" x1="7" y1="7" x2="25" y2="20" gradientUnits="userSpaceOnUse">
|
|
||||||
<stop stop-color="#5DB5FF"/>
|
|
||||||
<stop offset="1" stop-color="#328AF2"/>
|
|
||||||
</linearGradient>
|
|
||||||
<linearGradient id="logoTopRight" x1="24" y1="3" x2="43" y2="19" gradientUnits="userSpaceOnUse">
|
|
||||||
<stop stop-color="#62B2FF"/>
|
|
||||||
<stop offset="1" stop-color="#4B98F4"/>
|
|
||||||
</linearGradient>
|
|
||||||
<linearGradient id="logoLeft" x1="5" y1="14" x2="24" y2="45" gradientUnits="userSpaceOnUse">
|
|
||||||
<stop stop-color="#2C7CF0"/>
|
|
||||||
<stop offset="1" stop-color="#1F5EDA"/>
|
|
||||||
</linearGradient>
|
|
||||||
<linearGradient id="logoBottom" x1="9" y1="31" x2="43" y2="40" gradientUnits="userSpaceOnUse">
|
|
||||||
<stop stop-color="#276DE3"/>
|
|
||||||
<stop offset="1" stop-color="#4E9DF5"/>
|
|
||||||
</linearGradient>
|
|
||||||
</defs>
|
|
||||||
|
|
||||||
<!-- The mark is drawn as four independent folded faces. Together they form
|
|
||||||
the open C-shaped cube used in the product reference. -->
|
|
||||||
<path d="M5 13.5 24 3v10L14 18.5 5 13.5Z" fill="url(#logoTopLeft)"/>
|
|
||||||
<path d="M24 3 43 13.5 34 18.5 24 13V3Z" fill="url(#logoTopRight)"/>
|
|
||||||
<path d="M5 13.5 14 18.5v11L24 35v10L5 34.5v-21Z" fill="url(#logoLeft)"/>
|
|
||||||
<path d="M14 29.5 24 35l10-5.5 9 5L24 45 5 34.5l9-5Z" fill="url(#logoBottom)"/>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 1.4 KiB |
@@ -1,96 +0,0 @@
|
|||||||
// 前端运行时配置文件
|
|
||||||
//
|
|
||||||
// 说明：
|
|
||||||
// 1. 本文件会在打包时原样复制到 dist/runtime-config.js。
|
|
||||||
// 2. 应用启动时会优先读取 window.__CM_RUNTIME_CONFIG__ 里的配置。
|
|
||||||
// 3. 部署后如果需要切换接口地址，直接修改 dist/runtime-config.js 即可，不需要重新 pnpm build。
|
|
||||||
// 4. 这里的默认值来自 .env.network；如某个环境不用某项，可以留空字符串。
|
|
||||||
// 5. 布尔开关也用字符串形式填写："true" / "false"。
|
|
||||||
window.__CM_RUNTIME_CONFIG__ = {
|
|
||||||
// DeerFlow Gateway 地址：前端自有后端接口，例如 /api/agents、/api/auth、/api/threads 等。
|
|
||||||
// VITE_BACKEND_BASE_URL: "http://10.19.200.5:2026",
|
|
||||||
|
|
||||||
// LangGraph 流式对话接口地址：普通问答、智能体对话等流式能力使用。
|
|
||||||
// VITE_LANGGRAPH_BASE_URL: "http://10.19.200.5:2026/api",
|
|
||||||
|
|
||||||
// Canvas/AI 写作独立 LangGraph 地址：为空时前端会回退使用 VITE_LANGGRAPH_BASE_URL。
|
|
||||||
VITE_CANVAS_LANGGRAPH_BASE_URL: "",
|
|
||||||
|
|
||||||
// 轻应用「新建笔记」系列接口地址。
|
|
||||||
VITE_NOTE_API_BASE_URL: "http://47.88.25.99:8000",
|
|
||||||
|
|
||||||
// CMZS 后端接口：任务管理、任务分析、三情分析、行动分析等业务接口。
|
|
||||||
VITE_API_BASE_URL: "https://ch1.b.uat.4.cn/zncm",
|
|
||||||
|
|
||||||
// 佳来模型对话接口。
|
|
||||||
VITE_AIPI_CHAT_URL: "https://ch1.b.uat.4.cn/gpt",
|
|
||||||
|
|
||||||
// 多轮检索/生成接口。
|
|
||||||
VITE_AIPI_GENERATE_CHAT_URL: "https://ch1.b.uat.4.cn/jialai_b1_chat",
|
|
||||||
|
|
||||||
// 任务问答接口。
|
|
||||||
VITE_AIPI_TASK_CHAT_URL: "https://ch1.b.uat.4.cn/qq_b1_chat",
|
|
||||||
|
|
||||||
// B 系统知识库前端地址：用于打开知识详情、原文详情等。
|
|
||||||
VITE_AIPI_KNOWLEDGE_URL: "https://chlib.b.uat.4.cn/knowlibrary",
|
|
||||||
|
|
||||||
// B1 COH 系统地址。
|
|
||||||
VITE_AIPI_B1COH_URL: "https://ch1.b.uat.4.cn/web",
|
|
||||||
|
|
||||||
// B2 行为体/网络资源系统地址。
|
|
||||||
VITE_AIPI_B2ACTOR_URL: "https://ty.b.uat.4.cn",
|
|
||||||
|
|
||||||
// B2 网络 XWT iframe 路径。
|
|
||||||
VITE_AIPI_B2ACTOR_XWT_PATH: "/fromB/toXWT?isFrame=1",
|
|
||||||
|
|
||||||
// 知识库 iframe 地址换取接口。
|
|
||||||
VITE_AIPI_KNOWLEDGE_IFRAME_API_URL: "https://ch1.b.uat.4.cn/knowes/api/iframeKnowledgeUrl",
|
|
||||||
|
|
||||||
// 知识库 iframe 皮肤参数。
|
|
||||||
VITE_AIPI_KNOWLEDGE_IFRAME_SKIN: "red",
|
|
||||||
|
|
||||||
// MopeChat 接口地址。
|
|
||||||
VITE_AIPI_MOPECHAT_URL: "https://ch1.b.uat.4.cn/likun_b1_mope",
|
|
||||||
|
|
||||||
// 工作室/空间后端接口：空间列表、空间详情、素材上传等使用。
|
|
||||||
VITE_AIPI_BACKENP_URL: "http://47.88.25.99:8000",
|
|
||||||
|
|
||||||
// 工作室/空间后端别名：兼容旧配置命名，通常与 VITE_AIPI_BACKENP_URL 保持一致。
|
|
||||||
VITE_NOTEBOOK_API_BASE_URL: "http://47.88.25.99:8000",
|
|
||||||
|
|
||||||
// 工作室/空间前端地址：用于 auth/callback、新建对话等跳转。
|
|
||||||
VITE_AIPI_FRONTEND_URL: "http://47.88.25.99:3000",
|
|
||||||
|
|
||||||
// Consumer 接口：深链任务详情 cop-task-detail、研判情报报告 selectSqReport 等使用。
|
|
||||||
VITE_AIPI_CONSUMER_URL: "http://10.19.200.5:8002/consumer",
|
|
||||||
|
|
||||||
// A 系统跳转地址：人物、组织、事件等列表项打开链接使用。
|
|
||||||
VITE_AIPI_PRESENT_URL: "http://present.a.uat.4.cn/present/domain",
|
|
||||||
|
|
||||||
// B 系统 knowes 根地址。
|
|
||||||
VITE_AIPI_KNOWES_URL: "http://ch1.b.uat.4.cn/knowes",
|
|
||||||
|
|
||||||
// MaxKey 鉴权地址：onlineTicket 换 token 使用。
|
|
||||||
VITE_AUTH_BASE_URL: "https://auth.y.sit.4.cn",
|
|
||||||
|
|
||||||
// PG 中任务 iframe 地址。
|
|
||||||
VITE_AIPI_PGLINKTO_URL: "https://pg.b.uat.4.cn",
|
|
||||||
|
|
||||||
// XK 中任务 iframe 地址。
|
|
||||||
VITE_AIPI_XKLINKTO_URL: "https://kz.b.uat.4.cn",
|
|
||||||
|
|
||||||
// 是否使用真实任务看板数据：true=真实接口；false=本地 mock。
|
|
||||||
VITE_USE_REAL_DATA: "true",
|
|
||||||
|
|
||||||
// 登录深链任务详情是否使用本地 mock：false=真实接口；true=本地 mock。
|
|
||||||
VITE_MOCK_COP_TASK_DETAIL: "false",
|
|
||||||
|
|
||||||
// 大屏绘制 selectSqReport 是否使用本地 mock：不在运行时强制覆盖，
|
|
||||||
// 由各环境的 .env 文件决定（开发环境为 true，生产环境为 false）。
|
|
||||||
|
|
||||||
// 静态站点模式开关；一般部署业务系统时保持 false。
|
|
||||||
VITE_STATIC_WEBSITE_ONLY: "false",
|
|
||||||
|
|
||||||
// GitHub OAuth Token；不使用 GitHub 相关能力时留空。
|
|
||||||
VITE_GITHUB_OAUTH_TOKEN: "",
|
|
||||||
};
|
|
||||||
@@ -1,109 +0,0 @@
|
|||||||
import fs from "node:fs";
|
|
||||||
import path from "node:path";
|
|
||||||
import postcss from "postcss";
|
|
||||||
|
|
||||||
const unsupportedColor = /(?:color-mix|oklch|oklab|lab|lch)\(/i;
|
|
||||||
const assetsDir = path.resolve("dist/assets");
|
|
||||||
|
|
||||||
if (!fs.existsSync(assetsDir)) {
|
|
||||||
throw new Error("dist/assets 不存在，请先运行 pnpm build");
|
|
||||||
}
|
|
||||||
|
|
||||||
const cssFiles = fs
|
|
||||||
.readdirSync(assetsDir)
|
|
||||||
.filter((file) => file.endsWith(".css"));
|
|
||||||
|
|
||||||
if (cssFiles.length === 0) {
|
|
||||||
throw new Error("dist/assets 中没有 CSS 构建产物");
|
|
||||||
}
|
|
||||||
|
|
||||||
const failures = [];
|
|
||||||
let modernDeclarations = 0;
|
|
||||||
|
|
||||||
const requiredLegacyFallbacks = [
|
|
||||||
{
|
|
||||||
file: "src/components/ui/textarea.tsx",
|
|
||||||
pattern: /rows=\{rows\s*\?\?\s*3\}/,
|
|
||||||
description: "Textarea needs a native rows fallback",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
file: "src/components/ai-elements/prompt-input.tsx",
|
|
||||||
pattern: /<InputGroup className="h-auto min-h-16">/,
|
|
||||||
description: "Prompt textarea must not rely on :has() for its parent height",
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
for (const file of cssFiles) {
|
|
||||||
const root = postcss.parse(
|
|
||||||
fs.readFileSync(path.join(assetsDir, file), "utf8"),
|
|
||||||
{ from: file },
|
|
||||||
);
|
|
||||||
|
|
||||||
root.walkDecls((declaration) => {
|
|
||||||
if (!unsupportedColor.test(declaration.value)) return;
|
|
||||||
modernDeclarations += 1;
|
|
||||||
|
|
||||||
let ancestor = declaration.parent;
|
|
||||||
while (ancestor) {
|
|
||||||
if (
|
|
||||||
ancestor.type === "atrule" &&
|
|
||||||
ancestor.name === "supports" &&
|
|
||||||
unsupportedColor.test(ancestor.params)
|
|
||||||
) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
ancestor = ancestor.parent;
|
|
||||||
}
|
|
||||||
|
|
||||||
let previous = declaration.prev();
|
|
||||||
while (previous?.type === "comment") previous = previous.prev();
|
|
||||||
const hasSafeFallback =
|
|
||||||
!declaration.prop.startsWith("--") &&
|
|
||||||
previous?.type === "decl" &&
|
|
||||||
previous.prop === declaration.prop &&
|
|
||||||
!unsupportedColor.test(previous.value);
|
|
||||||
|
|
||||||
if (!hasSafeFallback) {
|
|
||||||
failures.push(
|
|
||||||
`${file}:${declaration.source?.start?.line ?? "?"} ${declaration.prop}: ${declaration.value}`,
|
|
||||||
);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function walk(directory) {
|
|
||||||
return fs.readdirSync(directory, { withFileTypes: true }).flatMap((entry) => {
|
|
||||||
const fullPath = path.join(directory, entry.name);
|
|
||||||
return entry.isDirectory() ? walk(fullPath) : [fullPath];
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
for (const file of walk(path.resolve("src"))) {
|
|
||||||
if (!/\.[jt]sx?$/.test(file)) continue;
|
|
||||||
const source = fs.readFileSync(file, "utf8");
|
|
||||||
if (unsupportedColor.test(source)) {
|
|
||||||
failures.push(
|
|
||||||
`${path.relative(process.cwd(), file)} contains a runtime-only modern color function`,
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
for (const fallback of requiredLegacyFallbacks) {
|
|
||||||
const source = fs.readFileSync(path.resolve(fallback.file), "utf8");
|
|
||||||
if (!fallback.pattern.test(source)) {
|
|
||||||
failures.push(`${fallback.file}: ${fallback.description}`);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if (failures.length > 0) {
|
|
||||||
console.error("Legacy Chrome CSS compatibility check failed:\n");
|
|
||||||
console.error(failures.slice(0, 50).join("\n"));
|
|
||||||
if (failures.length > 50) {
|
|
||||||
console.error(`... and ${failures.length - 50} more`);
|
|
||||||
}
|
|
||||||
process.exit(1);
|
|
||||||
}
|
|
||||||
|
|
||||||
console.log(
|
|
||||||
`Legacy Chrome (100+) CSS compatibility check passed (${modernDeclarations} guarded modern declarations).`,
|
|
||||||
);
|
|
||||||
@@ -1,70 +0,0 @@
|
|||||||
/**
|
|
||||||
* Tailwind 4 gracefully falls back from color-mix() to the base semantic
|
|
||||||
* color, but that turns utilities such as bg-primary/5 into an opaque fill on
|
|
||||||
* Chrome 109. Replace that fallback with an sRGB-channel based alpha color.
|
|
||||||
* The modern color-mix() declaration remains in its @supports block.
|
|
||||||
*/
|
|
||||||
|
|
||||||
const LEGACY_RGB_TOKENS = new Set([
|
|
||||||
"accent",
|
|
||||||
"background",
|
|
||||||
"border",
|
|
||||||
"brand-200",
|
|
||||||
"card",
|
|
||||||
"destructive",
|
|
||||||
"foreground",
|
|
||||||
"input",
|
|
||||||
"muted",
|
|
||||||
"muted-foreground",
|
|
||||||
"primary",
|
|
||||||
"primary-foreground",
|
|
||||||
"ring",
|
|
||||||
"secondary",
|
|
||||||
"sidebar-accent",
|
|
||||||
"sidebar-border",
|
|
||||||
"sidebar-foreground",
|
|
||||||
"workspace-brand",
|
|
||||||
]);
|
|
||||||
|
|
||||||
const TRANSPARENT_MIX_RE =
|
|
||||||
/color-mix\(\s*in\s+[\w-]+\s*,\s*var\(--([\w-]+)\)\s+([\d.]+)%\s*,\s*transparent\s*\)/i;
|
|
||||||
|
|
||||||
function legacyAlphaColor(value) {
|
|
||||||
const match = value.match(TRANSPARENT_MIX_RE);
|
|
||||||
if (!match || !LEGACY_RGB_TOKENS.has(match[1])) return null;
|
|
||||||
|
|
||||||
const [, token, percentage] = match;
|
|
||||||
return `rgb(var(--legacy-${token}-rgb) / ${percentage}%)`;
|
|
||||||
}
|
|
||||||
|
|
||||||
export default function legacyColorFallback() {
|
|
||||||
return {
|
|
||||||
postcssPlugin: "postcss-legacy-color-fallback",
|
|
||||||
OnceExit(root) {
|
|
||||||
root.walkAtRules("supports", (atRule) => {
|
|
||||||
if (!atRule.params.includes("color-mix")) return;
|
|
||||||
|
|
||||||
atRule.walkDecls((modernDeclaration) => {
|
|
||||||
const fallbackValue = legacyAlphaColor(modernDeclaration.value);
|
|
||||||
if (!fallbackValue) return;
|
|
||||||
|
|
||||||
// Tailwind emits the old-browser declaration immediately before
|
|
||||||
// the nested @supports block, in the same utility/variant rule.
|
|
||||||
let fallbackDeclaration = atRule.prev();
|
|
||||||
while (fallbackDeclaration?.type === "comment") {
|
|
||||||
fallbackDeclaration = fallbackDeclaration.prev();
|
|
||||||
}
|
|
||||||
|
|
||||||
if (
|
|
||||||
fallbackDeclaration?.type === "decl" &&
|
|
||||||
fallbackDeclaration.prop === modernDeclaration.prop
|
|
||||||
) {
|
|
||||||
fallbackDeclaration.value = fallbackValue;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
});
|
|
||||||
},
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
legacyColorFallback.postcss = true;
|
|
||||||
@@ -1,33 +0,0 @@
|
|||||||
import postcss from "postcss";
|
|
||||||
import { transform } from "lightningcss";
|
|
||||||
|
|
||||||
const LEGACY_CHROME = 100 << 16;
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Keep Vite's PostCSS pipeline (required by Tailwind 4), then compile the
|
|
||||||
* resulting CSS to Chrome 100-compatible syntax for both dev and production.
|
|
||||||
*/
|
|
||||||
export default function lightningCssLegacyChrome() {
|
|
||||||
return {
|
|
||||||
postcssPlugin: "postcss-lightningcss-legacy-chrome",
|
|
||||||
OnceExit(root, { result }) {
|
|
||||||
const filename = root.source?.input.file ?? result.opts.from ?? "style.css";
|
|
||||||
const output = transform({
|
|
||||||
filename,
|
|
||||||
code: Buffer.from(root.toString()),
|
|
||||||
targets: { chrome: LEGACY_CHROME },
|
|
||||||
minify: false,
|
|
||||||
});
|
|
||||||
const compiled = postcss.parse(output.code.toString(), { from: filename });
|
|
||||||
|
|
||||||
root.removeAll();
|
|
||||||
root.append(compiled.nodes);
|
|
||||||
|
|
||||||
for (const warning of output.warnings) {
|
|
||||||
result.warn(warning.message, { plugin: "lightningcss" });
|
|
||||||
}
|
|
||||||
},
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
lightningCssLegacyChrome.postcss = true;
|
|
||||||
@@ -1,13 +1,11 @@
|
|||||||
import { useEffect, useMemo } from "react";
|
import { useMemo } from "react";
|
||||||
import { Navigate, Route, Routes } from "react-router-dom";
|
import { Navigate, Route, Routes } from "react-router-dom";
|
||||||
import { ThemeProvider as NextThemesProvider } from "next-themes";
|
import { ThemeProvider as NextThemesProvider } from "next-themes";
|
||||||
|
|
||||||
import { DesensitizeWordsLoader } from "@/components/desensitize-words-loader";
|
|
||||||
import { FontScaleApplier } from "@/components/font-scale";
|
import { FontScaleApplier } from "@/components/font-scale";
|
||||||
import { QueryClientProvider } from "@/components/query-client-provider";
|
import { QueryClientProvider } from "@/components/query-client-provider";
|
||||||
import { AuthSyncWatcher } from "@/core/auth/sync";
|
import { AuthSyncWatcher } from "@/core/auth/sync";
|
||||||
import { I18nProvider } from "@/core/i18n/context";
|
import { I18nProvider } from "@/core/i18n/context";
|
||||||
import { fetchYLogConfig } from "@/core/log/y-log-config";
|
|
||||||
import { detectLocale } from "@/core/i18n/locale";
|
import { detectLocale } from "@/core/i18n/locale";
|
||||||
import { resolveForcedThemeForPath } from "@/core/page-layout/chats-iframe-route";
|
import { resolveForcedThemeForPath } from "@/core/page-layout/chats-iframe-route";
|
||||||
import { ChatProvider } from "@/contexts/ChatContext";
|
import { ChatProvider } from "@/contexts/ChatContext";
|
||||||
@@ -18,10 +16,6 @@ import {
|
|||||||
} from "@/core/embed/params";
|
} from "@/core/embed/params";
|
||||||
import { usePublicEmbedTheme } from "@/core/embed/background";
|
import { usePublicEmbedTheme } from "@/core/embed/background";
|
||||||
import { readWujieProps } from "@/core/embed/wujie";
|
import { readWujieProps } from "@/core/embed/wujie";
|
||||||
import {
|
|
||||||
resolveForcedEmbedTheme,
|
|
||||||
syncEmbedSessionFromSearch,
|
|
||||||
} from "@/core/embed/embed-session";
|
|
||||||
|
|
||||||
import { HashRouter, useLocation } from "react-router-dom";
|
import { HashRouter, useLocation } from "react-router-dom";
|
||||||
|
|
||||||
@@ -46,21 +40,7 @@ function AppProviders({ children }: { children: React.ReactNode }) {
|
|||||||
const locale = useMemo(() => detectLocale(), []);
|
const locale = useMemo(() => detectLocale(), []);
|
||||||
const location = useLocation();
|
const location = useLocation();
|
||||||
const publicEmbedTheme = usePublicEmbedTheme();
|
const publicEmbedTheme = usePublicEmbedTheme();
|
||||||
// iframe 嵌入会话（按标签页 sessionStorage）集中在此同步：任何带 `&embed=1` 的入口（深链登录页
|
|
||||||
// 或直接深链路由）一进来就启用、`embed=0` 关闭，后续干净路由靠会话维持去 chrome + 强制主题。
|
|
||||||
useEffect(() => {
|
|
||||||
syncEmbedSessionFromSearch(location.search);
|
|
||||||
}, [location.search]);
|
|
||||||
// 操作日志(Y-Log)：启动早期预热上报配置，使 writeYLog 同步读缓存即可工作
|
|
||||||
// （刷新后 module 缓存清空，token 登录用户也能继续上报）。失败静默。
|
|
||||||
useEffect(() => {
|
|
||||||
void fetchYLogConfig();
|
|
||||||
}, []);
|
|
||||||
const forcedTheme = useMemo(() => {
|
const forcedTheme = useMemo(() => {
|
||||||
// iframe 嵌入模式（外部系统 `&embed=1`）最高优先：按本标签页的嵌入主题强制明/暗。
|
|
||||||
// 走 next-themes forcedTheme（不写 localStorage）→ 同浏览器另开的正常系统页不受影响。
|
|
||||||
const embedTheme = resolveForcedEmbedTheme(location.search);
|
|
||||||
if (embedTheme) return embedTheme;
|
|
||||||
const routeTheme = resolveForcedThemeForPath(location.pathname);
|
const routeTheme = resolveForcedThemeForPath(location.pathname);
|
||||||
if (routeTheme) return routeTheme;
|
if (routeTheme) return routeTheme;
|
||||||
if (location.pathname === "/embed/roundtable") {
|
if (location.pathname === "/embed/roundtable") {
|
||||||
@@ -96,7 +76,6 @@ function AppProviders({ children }: { children: React.ReactNode }) {
|
|||||||
<ThemeProvider>
|
<ThemeProvider>
|
||||||
<ChatProvider>
|
<ChatProvider>
|
||||||
<AuthSyncWatcher />
|
<AuthSyncWatcher />
|
||||||
<DesensitizeWordsLoader />
|
|
||||||
<FontScaleApplier />
|
<FontScaleApplier />
|
||||||
{children}
|
{children}
|
||||||
</ChatProvider>
|
</ChatProvider>
|
||||||
|
|||||||
@@ -1,8 +1,7 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
import { Button } from "@/components/ui/button";
|
import { Button } from "@/components/ui/button";
|
||||||
import { copyTextToClipboard } from "@/core/clipboard";
|
import { cn } from "@/lib/utils";
|
||||||
import { cn } from "@/lib/utils";
|
|
||||||
import { CheckIcon, CopyIcon } from "lucide-react";
|
import { CheckIcon, CopyIcon } from "lucide-react";
|
||||||
import {
|
import {
|
||||||
type ComponentProps,
|
type ComponentProps,
|
||||||
@@ -145,13 +144,18 @@ export const CodeBlockCopyButton = ({
|
|||||||
...props
|
...props
|
||||||
}: CodeBlockCopyButtonProps) => {
|
}: CodeBlockCopyButtonProps) => {
|
||||||
const [isCopied, setIsCopied] = useState(false);
|
const [isCopied, setIsCopied] = useState(false);
|
||||||
const { code } = useContext(CodeBlockContext);
|
const { code } = useContext(CodeBlockContext);
|
||||||
|
|
||||||
const copyToClipboard = async () => {
|
const copyToClipboard = async () => {
|
||||||
try {
|
if (typeof window === "undefined" || !navigator?.clipboard?.writeText) {
|
||||||
await copyTextToClipboard(code);
|
onError?.(new Error("Clipboard API not available"));
|
||||||
setIsCopied(true);
|
return;
|
||||||
onCopy?.();
|
}
|
||||||
|
|
||||||
|
try {
|
||||||
|
await navigator.clipboard.writeText(code);
|
||||||
|
setIsCopied(true);
|
||||||
|
onCopy?.();
|
||||||
setTimeout(() => setIsCopied(false), timeout);
|
setTimeout(() => setIsCopied(false), timeout);
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
onError?.(error as Error);
|
onError?.(error as Error);
|
||||||
|
|||||||
@@ -846,10 +846,7 @@ export const PromptInput = ({
|
|||||||
ref={formRef}
|
ref={formRef}
|
||||||
{...props}
|
{...props}
|
||||||
>
|
>
|
||||||
{/* Do not rely on InputGroup's :has(textarea) selector here: Chrome
|
<InputGroup>{children}</InputGroup>
|
||||||
versions before 105 ignore :has(), retain h-9, and clip the whole
|
|
||||||
multi-line composer to a single row. */}
|
|
||||||
<InputGroup className="h-auto min-h-16">{children}</InputGroup>
|
|
||||||
</form>
|
</form>
|
||||||
</PromptInputValidationContext.Provider>
|
</PromptInputValidationContext.Provider>
|
||||||
);
|
);
|
||||||
@@ -876,48 +873,16 @@ export type PromptInputTextareaProps = ComponentProps<
|
|||||||
typeof InputGroupTextarea
|
typeof InputGroupTextarea
|
||||||
>;
|
>;
|
||||||
|
|
||||||
export const PromptInputTextarea = ({
|
export const PromptInputTextarea = ({
|
||||||
onChange,
|
onChange,
|
||||||
onInput,
|
className,
|
||||||
className,
|
placeholder = "What would you like to know?",
|
||||||
placeholder = "What would you like to know?",
|
...props
|
||||||
...props
|
}: PromptInputTextareaProps) => {
|
||||||
}: PromptInputTextareaProps) => {
|
const controller = useOptionalPromptInputController();
|
||||||
const controller = useOptionalPromptInputController();
|
const attachments = usePromptInputAttachments();
|
||||||
const attachments = usePromptInputAttachments();
|
const sanitizeIncomingFiles = usePromptInputValidation();
|
||||||
const sanitizeIncomingFiles = usePromptInputValidation();
|
const [isComposing, setIsComposing] = useState(false);
|
||||||
const [isComposing, setIsComposing] = useState(false);
|
|
||||||
const textareaRef = useRef<HTMLTextAreaElement | null>(null);
|
|
||||||
|
|
||||||
const resizeForLegacyChrome = useCallback((textarea: HTMLTextAreaElement) => {
|
|
||||||
if (
|
|
||||||
typeof CSS !== "undefined" &&
|
|
||||||
typeof CSS.supports === "function" &&
|
|
||||||
CSS.supports("field-sizing", "content")
|
|
||||||
) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Chrome 109 ignores field-sizing: content. Preserve the same 4rem–12rem
|
|
||||||
// autosize range used by min-h-16/max-h-48 instead of leaving the prompt
|
|
||||||
// stuck at its minimum height.
|
|
||||||
textarea.style.height = "auto";
|
|
||||||
const height = Math.max(64, Math.min(textarea.scrollHeight, 192));
|
|
||||||
textarea.style.height = `${height}px`;
|
|
||||||
textarea.style.overflowY = textarea.scrollHeight > 192 ? "auto" : "hidden";
|
|
||||||
}, []);
|
|
||||||
|
|
||||||
// onInput does not run for a controlled value filled by a suggested question
|
|
||||||
// or restored draft. Resize once after every render in legacy Chrome too.
|
|
||||||
useEffect(() => {
|
|
||||||
const textarea = textareaRef.current;
|
|
||||||
if (!textarea) return;
|
|
||||||
|
|
||||||
const frame = window.requestAnimationFrame(() => {
|
|
||||||
resizeForLegacyChrome(textarea);
|
|
||||||
});
|
|
||||||
return () => window.cancelAnimationFrame(frame);
|
|
||||||
}, [controller?.textInput.value, resizeForLegacyChrome]);
|
|
||||||
|
|
||||||
const handleKeyDown: KeyboardEventHandler<HTMLTextAreaElement> = (e) => {
|
const handleKeyDown: KeyboardEventHandler<HTMLTextAreaElement> = (e) => {
|
||||||
if (e.key === "Enter") {
|
if (e.key === "Enter") {
|
||||||
@@ -997,18 +962,12 @@ export const PromptInputTextarea = ({
|
|||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<InputGroupTextarea
|
<InputGroupTextarea
|
||||||
className={cn("field-sizing-content max-h-48 min-h-16", className)}
|
className={cn("field-sizing-content max-h-48 min-h-16", className)}
|
||||||
name="message"
|
name="message"
|
||||||
ref={textareaRef}
|
|
||||||
rows={3}
|
|
||||||
onCompositionEnd={() => setIsComposing(false)}
|
onCompositionEnd={() => setIsComposing(false)}
|
||||||
onCompositionStart={() => setIsComposing(true)}
|
onCompositionStart={() => setIsComposing(true)}
|
||||||
onKeyDown={handleKeyDown}
|
onKeyDown={handleKeyDown}
|
||||||
onInput={(event) => {
|
|
||||||
resizeForLegacyChrome(event.currentTarget);
|
|
||||||
onInput?.(event);
|
|
||||||
}}
|
|
||||||
onPaste={handlePaste}
|
onPaste={handlePaste}
|
||||||
placeholder={placeholder}
|
placeholder={placeholder}
|
||||||
{...props}
|
{...props}
|
||||||
|
|||||||
@@ -26,7 +26,6 @@ import {
|
|||||||
import { Button } from "@/components/ui/button";
|
import { Button } from "@/components/ui/button";
|
||||||
import { toast } from "sonner";
|
import { toast } from "sonner";
|
||||||
import { getStoredAuth } from "@/core/auth";
|
import { getStoredAuth } from "@/core/auth";
|
||||||
import { readRuntimeEnv } from "@/env";
|
|
||||||
import { queryClient } from "@/components/query-client-provider";
|
import { queryClient } from "@/components/query-client-provider";
|
||||||
import { Checkbox } from "@/components/ui/checkbox";
|
import { Checkbox } from "@/components/ui/checkbox";
|
||||||
import Empty from "./empty";
|
import Empty from "./empty";
|
||||||
@@ -304,11 +303,11 @@ const DocumentUploadPopupContent: FC<{
|
|||||||
const searchSpaceId = String(searchSpace?.id);
|
const searchSpaceId = String(searchSpace?.id);
|
||||||
|
|
||||||
// 从环境变量获取配置
|
// 从环境变量获取配置
|
||||||
const backendUrl = readRuntimeEnv("VITE_AIPI_BACKENP_URL") || "http://localhost:8001";
|
const backendUrl = import.meta.env.VITE_AIPI_BACKENP_URL || "http://localhost:8001";
|
||||||
const consumerUrl = readRuntimeEnv("VITE_AIPI_CONSUMER_URL") || "http://ch1.b.uat.4.cn/consumer";
|
const consumerUrl = import.meta.env.VITE_AIPI_CONSUMER_URL || "http://ch1.b.uat.4.cn/consumer";
|
||||||
const presentUrl = readRuntimeEnv("VITE_AIPI_PRESENT_URL") || "http://present.a.uat.4.cn/present/domain";
|
const presentUrl = import.meta.env.VITE_AIPI_PRESENT_URL || "http://present.a.uat.4.cn/present/domain";
|
||||||
const knowesUrl = readRuntimeEnv("VITE_AIPI_KNOWES_URL") || "http://ch1.b.uat.4.cn/knowes";
|
const knowesUrl = import.meta.env.VITE_AIPI_KNOWES_URL || "http://ch1.b.uat.4.cn/knowes";
|
||||||
const knowledgeUrl = readRuntimeEnv("VITE_AIPI_KNOWLEDGE_URL") || "http://chlib.b.uat.4.cn/knowlibrary";
|
const knowledgeUrl = import.meta.env.VITE_AIPI_KNOWLEDGE_URL || "http://chlib.b.uat.4.cn/knowlibrary";
|
||||||
|
|
||||||
const [searchText, setSearchText] = useState("");
|
const [searchText, setSearchText] = useState("");
|
||||||
const [searchValue, setSearchValue] = useState("");
|
const [searchValue, setSearchValue] = useState("");
|
||||||
@@ -406,15 +405,8 @@ const DocumentUploadPopupContent: FC<{
|
|||||||
if (response.ok) {
|
if (response.ok) {
|
||||||
const data = await response.json() as { imported_count?: number };
|
const data = await response.json() as { imported_count?: number };
|
||||||
toast.success(`成功导入 ${data.imported_count || dataList.length} 个来源`);
|
toast.success(`成功导入 ${data.imported_count || dataList.length} 个来源`);
|
||||||
onUploadComplete?.(
|
setListData([]);
|
||||||
selectedSearchSources.map((s) => ({
|
handleBatchDelete();
|
||||||
id: undefined,
|
|
||||||
title: s.title,
|
|
||||||
task_id: undefined,
|
|
||||||
status: "success" as const,
|
|
||||||
}))
|
|
||||||
);
|
|
||||||
onOpenChange(false);
|
|
||||||
} else {
|
} else {
|
||||||
const errorData = await response.json() as { detail?: string };
|
const errorData = await response.json() as { detail?: string };
|
||||||
toast.error(errorData.detail || "导入失败，请重试");
|
toast.error(errorData.detail || "导入失败，请重试");
|
||||||
|
|||||||
@@ -11,7 +11,6 @@ import { Button } from "@/components/ui/button";
|
|||||||
import { toast } from "sonner";
|
import { toast } from "sonner";
|
||||||
import { getStoredAuth } from "@/core/auth";
|
import { getStoredAuth } from "@/core/auth";
|
||||||
import { authenticatedFetch } from "@/components/assistant-ui/document-upload-popup";
|
import { authenticatedFetch } from "@/components/assistant-ui/document-upload-popup";
|
||||||
import { readRuntimeEnv } from "@/env";
|
|
||||||
|
|
||||||
|
|
||||||
interface NetworkActorProps {
|
interface NetworkActorProps {
|
||||||
@@ -187,9 +186,9 @@ export function NetworkActor({ inputValue, searchSpaceId, onSuccess }: NetworkAc
|
|||||||
const [actorCount, setActorCount] = useState<number>(0);
|
const [actorCount, setActorCount] = useState<number>(0);
|
||||||
const [directionType, setDirectionType] = useState<string>('TW');
|
const [directionType, setDirectionType] = useState<string>('TW');
|
||||||
const directionValue = useRef<string>('TW');
|
const directionValue = useRef<string>('TW');
|
||||||
const consumerUrl = readRuntimeEnv("VITE_AIPI_CONSUMER_URL") || 'https://ch1.b.uat.4.cn/consumer';
|
const consumerUrl = import.meta.env.VITE_AIPI_CONSUMER_URL || 'https://ch1.b.uat.4.cn/consumer';
|
||||||
const backendUrl = typeof window !== 'undefined'
|
const backendUrl = typeof window !== 'undefined'
|
||||||
? (readRuntimeEnv("VITE_BACKEND_BASE_URL") || 'http://localhost:8001')
|
? (import.meta.env.VITE_BACKEND_BASE_URL || 'http://localhost:8001')
|
||||||
: 'http://localhost:8001';
|
: 'http://localhost:8001';
|
||||||
const [selectedSearchSources, setSelectedSearchSources] = useState<UserDataItem[]>([]);
|
const [selectedSearchSources, setSelectedSearchSources] = useState<UserDataItem[]>([]);
|
||||||
const [isImporting, setIsImporting] = useState(false);
|
const [isImporting, setIsImporting] = useState(false);
|
||||||
|
|||||||
@@ -1,27 +0,0 @@
|
|||||||
import { useEffect } from "react";
|
|
||||||
|
|
||||||
import { replaceDesensitizeMap } from "@/lib/desensitize";
|
|
||||||
import { useSensitiveWords, wordsToMap } from "@/strategy-components/api/sensitive-words";
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 启动时把后台「敏感词管理」配置加载进运行时脱敏映射表。
|
|
||||||
*
|
|
||||||
* - 后台返回**非空**时：用其中「启用」的词条整体替换运行时映射
|
|
||||||
* （{@link replaceDesensitizeMap}），后台即唯一真源，被删除的词不再生效。
|
|
||||||
* - 后台为空（全新部署还没配置）或拉取失败：什么都不做，保持使用
|
|
||||||
* `src/lib/desensitize.ts` 内置的种子映射。
|
|
||||||
*
|
|
||||||
* 渲染 `null`；挂在 `AppProviders` 里（QueryClientProvider 之内）。与「敏感词管理」
|
|
||||||
* 页共享同一份 React Query 缓存，保存后会自动刷新并回灌运行时映射。
|
|
||||||
*/
|
|
||||||
export function DesensitizeWordsLoader() {
|
|
||||||
const { data } = useSensitiveWords();
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
if (data && data.length > 0) {
|
|
||||||
replaceDesensitizeMap(wordsToMap(data));
|
|
||||||
}
|
|
||||||
}, [data]);
|
|
||||||
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
@@ -508,9 +508,8 @@ export default function ProgressiveSkillsAnimation() {
|
|||||||
"deploying",
|
"deploying",
|
||||||
"done",
|
"done",
|
||||||
].includes(phase) && (
|
].includes(phase) && (
|
||||||
<div className="flex items-center gap-2 text-base text-zinc-300">
|
<div className="text-base text-zinc-300">
|
||||||
<Sparkles size={16} className="text-purple-400" />
|
<span className="text-purple-400">✨</span> Found 3 skills
|
||||||
<span>Found 3 skills</span>
|
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
@@ -527,9 +526,8 @@ export default function ProgressiveSkillsAnimation() {
|
|||||||
].includes(phase) && (
|
].includes(phase) && (
|
||||||
<div className="mt-4">
|
<div className="mt-4">
|
||||||
<hr className="mb-3 border-zinc-700" />
|
<hr className="mb-3 border-zinc-700" />
|
||||||
<div className="mb-3 inline-flex items-center gap-2 text-zinc-300">
|
<div className="mb-3 text-zinc-300">
|
||||||
<Search size={16} className="text-blue-400" />
|
🔬 Researching...
|
||||||
<span>Researching...</span>
|
|
||||||
</div>
|
</div>
|
||||||
<div className="mb-3 space-y-2">
|
<div className="mb-3 space-y-2">
|
||||||
{/* Loading SKILL.md */}
|
{/* Loading SKILL.md */}
|
||||||
@@ -625,10 +623,7 @@ export default function ProgressiveSkillsAnimation() {
|
|||||||
className="mt-4"
|
className="mt-4"
|
||||||
>
|
>
|
||||||
<hr className="mb-3 border-zinc-700" />
|
<hr className="mb-3 border-zinc-700" />
|
||||||
<div className="mb-3 inline-flex items-center gap-2 text-zinc-300">
|
<div className="mb-3 text-zinc-300">🔨 Building...</div>
|
||||||
<FileText size={16} className="text-zinc-400" />
|
|
||||||
<span>Building...</span>
|
|
||||||
</div>
|
|
||||||
<div className="mb-3 flex items-center gap-2 pl-4 text-zinc-400">
|
<div className="mb-3 flex items-center gap-2 pl-4 text-zinc-400">
|
||||||
<FileText size={16} />
|
<FileText size={16} />
|
||||||
<span>Loading frontend-design/SKILL.md...</span>
|
<span>Loading frontend-design/SKILL.md...</span>
|
||||||
@@ -658,10 +653,7 @@ export default function ProgressiveSkillsAnimation() {
|
|||||||
className="mt-4"
|
className="mt-4"
|
||||||
>
|
>
|
||||||
<hr className="mb-3 border-zinc-700" />
|
<hr className="mb-3 border-zinc-700" />
|
||||||
<div className="mb-3 inline-flex items-center gap-2 text-zinc-300">
|
<div className="mb-3 text-zinc-300">🚀 Deploying...</div>
|
||||||
<Terminal size={16} className="text-zinc-400" />
|
|
||||||
<span>Deploying...</span>
|
|
||||||
</div>
|
|
||||||
<div className="mb-3 space-y-2">
|
<div className="mb-3 space-y-2">
|
||||||
<div className="flex items-center gap-2 pl-4 text-zinc-400">
|
<div className="flex items-center gap-2 pl-4 text-zinc-400">
|
||||||
<FileText size={16} />
|
<FileText size={16} />
|
||||||
@@ -684,9 +676,8 @@ export default function ProgressiveSkillsAnimation() {
|
|||||||
animate={{ opacity: 1, scale: 1 }}
|
animate={{ opacity: 1, scale: 1 }}
|
||||||
className="mt-4 rounded-xl border border-green-500/30 bg-green-500/10 p-4"
|
className="mt-4 rounded-xl border border-green-500/30 bg-green-500/10 p-4"
|
||||||
>
|
>
|
||||||
<div className="inline-flex items-center gap-2 text-lg font-medium text-green-500">
|
<div className="text-lg font-medium text-green-500">
|
||||||
<Check size={18} />
|
✅ Live at biotech-startup.vercel.app
|
||||||
<span>Live at biotech-startup.vercel.app</span>
|
|
||||||
</div>
|
</div>
|
||||||
</motion.div>
|
</motion.div>
|
||||||
)}
|
)}
|
||||||
|
|||||||
@@ -35,27 +35,27 @@ export function SandboxSection({ className }: { className?: string }) {
|
|||||||
$ pip install -r requirements.txt
|
$ pip install -r requirements.txt
|
||||||
</TypingAnimation>
|
</TypingAnimation>
|
||||||
<AnimatedSpan delay={2000} className="text-green-500">
|
<AnimatedSpan delay={2000} className="text-green-500">
|
||||||
[ok] Installed pygame
|
✔ Installed pygame
|
||||||
</AnimatedSpan>
|
</AnimatedSpan>
|
||||||
|
|
||||||
<TypingAnimation delay={2400}>
|
<TypingAnimation delay={2400}>
|
||||||
$ write game.py --lines 156
|
$ write game.py --lines 156
|
||||||
</TypingAnimation>
|
</TypingAnimation>
|
||||||
<AnimatedSpan delay={3200} className="text-blue-500">
|
<AnimatedSpan delay={3200} className="text-blue-500">
|
||||||
[ok] Written 156 lines
|
✔ Written 156 lines
|
||||||
</AnimatedSpan>
|
</AnimatedSpan>
|
||||||
|
|
||||||
<TypingAnimation delay={3600}>
|
<TypingAnimation delay={3600}>
|
||||||
$ python game.py --test
|
$ python game.py --test
|
||||||
</TypingAnimation>
|
</TypingAnimation>
|
||||||
<AnimatedSpan delay={4200} className="text-green-500">
|
<AnimatedSpan delay={4200} className="text-green-500">
|
||||||
[ok] All sprites loaded
|
✔ All sprites loaded
|
||||||
</AnimatedSpan>
|
</AnimatedSpan>
|
||||||
<AnimatedSpan delay={4500} className="text-green-500">
|
<AnimatedSpan delay={4500} className="text-green-500">
|
||||||
[ok] Physics engine OK
|
✔ Physics engine OK
|
||||||
</AnimatedSpan>
|
</AnimatedSpan>
|
||||||
<AnimatedSpan delay={4800} className="text-green-500">
|
<AnimatedSpan delay={4800} className="text-green-500">
|
||||||
[ok] 60 FPS stable
|
✔ 60 FPS stable
|
||||||
</AnimatedSpan>
|
</AnimatedSpan>
|
||||||
|
|
||||||
{/* Scene 2: Data Analysis */}
|
{/* Scene 2: Data Analysis */}
|
||||||
|
|||||||
@@ -6,8 +6,6 @@ import { getStoredAuth } from "@/core/auth";
|
|||||||
import { isWujieEnv } from "@/core/embed/wujie";
|
import { isWujieEnv } from "@/core/embed/wujie";
|
||||||
import {
|
import {
|
||||||
defaultExpandedIds,
|
defaultExpandedIds,
|
||||||
menuItemContainsPath,
|
|
||||||
menuItemMatchesPath,
|
|
||||||
type MenuItem,
|
type MenuItem,
|
||||||
} from "@/core/page-layout/sidebar-menu";
|
} from "@/core/page-layout/sidebar-menu";
|
||||||
import { useSidebarMenuItems } from "@/core/page-layout/use-sidebar-menu";
|
import { useSidebarMenuItems } from "@/core/page-layout/use-sidebar-menu";
|
||||||
@@ -55,7 +53,13 @@ export function PageSidebarDark({ collapsed, onToggleCollapsed }: PageSidebarDar
|
|||||||
}, 180);
|
}, 180);
|
||||||
};
|
};
|
||||||
|
|
||||||
const hasActiveChild = (item: MenuItem): boolean => menuItemContainsPath(item, pathname);
|
const hasActiveChild = (item: MenuItem): boolean => {
|
||||||
|
if (item.path && (pathname === item.path || pathname.startsWith(item.path + "/"))) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
return item.children?.some(hasActiveChild) ?? false;
|
||||||
|
};
|
||||||
|
|
||||||
// lazy init：仅在首次 render 计算一次 active id；之后由下面的 useEffect 跟随 pathname 同步
|
// lazy init：仅在首次 render 计算一次 active id；之后由下面的 useEffect 跟随 pathname 同步
|
||||||
const [activeTopId, setActiveTopId] = useState<string>(
|
const [activeTopId, setActiveTopId] = useState<string>(
|
||||||
@@ -148,9 +152,9 @@ export function PageSidebarDark({ collapsed, onToggleCollapsed }: PageSidebarDar
|
|||||||
const isSidebarItemActive = (item: MenuItem) =>
|
const isSidebarItemActive = (item: MenuItem) =>
|
||||||
inWujieEnv
|
inWujieEnv
|
||||||
? item.id === activeTopId
|
? item.id === activeTopId
|
||||||
: item.path || item.aliasPaths?.length
|
: item.path
|
||||||
? menuItemMatchesPath(item, pathname)
|
? pathname === item.path || pathname.startsWith(item.path + "/")
|
||||||
: menuItemContainsPath(item, pathname);
|
: hasActiveChild(item);
|
||||||
const handleSidebarItemClick = (item: MenuItem) => {
|
const handleSidebarItemClick = (item: MenuItem) => {
|
||||||
if (inWujieEnv) {
|
if (inWujieEnv) {
|
||||||
handleTopItemClick(item);
|
handleTopItemClick(item);
|
||||||
@@ -172,9 +176,7 @@ export function PageSidebarDark({ collapsed, onToggleCollapsed }: PageSidebarDar
|
|||||||
{items.map((item) => {
|
{items.map((item) => {
|
||||||
const hasChildren = !!item.children?.length;
|
const hasChildren = !!item.children?.length;
|
||||||
const isExpanded = expandedIds.has(item.id);
|
const isExpanded = expandedIds.has(item.id);
|
||||||
const isSelected = item.path || item.aliasPaths?.length
|
const isSelected = item.path ? pathname === item.path : hasActiveChild(item);
|
||||||
? menuItemMatchesPath(item, pathname)
|
|
||||||
: hasActiveChild(item);
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
|
|||||||
@@ -7,12 +7,7 @@ import {
|
|||||||
ChevronsUpDown,
|
ChevronsUpDown,
|
||||||
Folder,
|
Folder,
|
||||||
FolderOpen,
|
FolderOpen,
|
||||||
Gauge,
|
|
||||||
ListTree,
|
|
||||||
MousePointerClick,
|
|
||||||
Settings,
|
Settings,
|
||||||
ShieldAlert,
|
|
||||||
ShieldCheck,
|
|
||||||
User,
|
User,
|
||||||
Wrench,
|
Wrench,
|
||||||
} from "lucide-react";
|
} from "lucide-react";
|
||||||
@@ -26,20 +21,13 @@ import {
|
|||||||
import { NotificationDialog } from "@/components/workspace/notification-dialog";
|
import { NotificationDialog } from "@/components/workspace/notification-dialog";
|
||||||
import { SettingsDialog } from "@/components/workspace/settings";
|
import { SettingsDialog } from "@/components/workspace/settings";
|
||||||
import { useTheme } from "@/contexts/ThemeContext";
|
import { useTheme } from "@/contexts/ThemeContext";
|
||||||
import { getAccountDisplayName, getStoredAuth } from "@/core/auth";
|
import { getStoredAuth } from "@/core/auth";
|
||||||
|
|
||||||
/** 敏感词管理仅对用户名为 lqq 的账号可见（用户名 = 设置→个人信息页展示名）。 */
|
|
||||||
const SENSITIVE_WORDS_USERNAME = "lqq";
|
|
||||||
const canManageSensitiveWords = () =>
|
|
||||||
getAccountDisplayName().toLowerCase() === SENSITIVE_WORDS_USERNAME;
|
|
||||||
import { isWujieEnv } from "@/core/embed/wujie";
|
import { isWujieEnv } from "@/core/embed/wujie";
|
||||||
import { useI18n } from "@/core/i18n/hooks";
|
import { useI18n } from "@/core/i18n/hooks";
|
||||||
import { useUnreadCount } from "@/core/notifications";
|
import { useUnreadCount } from "@/core/notifications";
|
||||||
import {
|
import {
|
||||||
defaultExpandedIds,
|
defaultExpandedIds,
|
||||||
getActiveThirdLevelItems,
|
getActiveThirdLevelItems,
|
||||||
menuItemContainsPath,
|
|
||||||
menuItemMatchesPath,
|
|
||||||
type MenuItem,
|
type MenuItem,
|
||||||
} from "@/core/page-layout/sidebar-menu";
|
} from "@/core/page-layout/sidebar-menu";
|
||||||
import { useSidebarMenuItems } from "@/core/page-layout/use-sidebar-menu";
|
import { useSidebarMenuItems } from "@/core/page-layout/use-sidebar-menu";
|
||||||
@@ -53,8 +41,12 @@ type PageSidebarProps = {
|
|||||||
|
|
||||||
type SettingsSection = "account" | "appearance" | "memory" | "tools" | "about";
|
type SettingsSection = "account" | "appearance" | "memory" | "tools" | "about";
|
||||||
|
|
||||||
const hasActiveChild = (item: MenuItem, pathname: string): boolean =>
|
const hasActiveChild = (item: MenuItem, pathname: string): boolean => {
|
||||||
menuItemContainsPath(item, pathname);
|
if (item.path && (pathname === item.path || pathname.startsWith(item.path + "/"))) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
return item.children?.some((child) => hasActiveChild(child, pathname)) ?? false;
|
||||||
|
};
|
||||||
|
|
||||||
const findFirstRoutePath = (items?: MenuItem[]): string | null => {
|
const findFirstRoutePath = (items?: MenuItem[]): string | null => {
|
||||||
if (!items?.length) {
|
if (!items?.length) {
|
||||||
@@ -124,9 +116,9 @@ function SecondaryNavSidebar() {
|
|||||||
const secondaryItems = activeTopItem?.children ?? [];
|
const secondaryItems = activeTopItem?.children ?? [];
|
||||||
|
|
||||||
const isItemActive = (item: MenuItem) =>
|
const isItemActive = (item: MenuItem) =>
|
||||||
item.path || item.aliasPaths?.length
|
item.path
|
||||||
? menuItemMatchesPath(item, pathname)
|
? pathname === item.path || pathname.startsWith(item.path + "/")
|
||||||
: menuItemContainsPath(item, pathname);
|
: hasActiveChild(item, pathname);
|
||||||
|
|
||||||
const handleItemClick = (item: MenuItem) => {
|
const handleItemClick = (item: MenuItem) => {
|
||||||
const path = item.path ?? findFirstRoutePath(item.children);
|
const path = item.path ?? findFirstRoutePath(item.children);
|
||||||
@@ -208,46 +200,6 @@ function SecondaryNavSidebar() {
|
|||||||
<User className="size-4" />
|
<User className="size-4" />
|
||||||
个人信息
|
个人信息
|
||||||
</DropdownMenuItem>
|
</DropdownMenuItem>
|
||||||
{isAdmin && (
|
|
||||||
<DropdownMenuItem
|
|
||||||
onClick={() => navigate("/page/strategy/admin/menu-management")}
|
|
||||||
>
|
|
||||||
<ListTree className="size-4" />
|
|
||||||
菜单管理
|
|
||||||
</DropdownMenuItem>
|
|
||||||
)}
|
|
||||||
{isAdmin && (
|
|
||||||
<DropdownMenuItem
|
|
||||||
onClick={() => navigate("/page/strategy/admin/task-buttons")}
|
|
||||||
>
|
|
||||||
<MousePointerClick className="size-4" />
|
|
||||||
按钮管理
|
|
||||||
</DropdownMenuItem>
|
|
||||||
)}
|
|
||||||
{isAdmin && (
|
|
||||||
<DropdownMenuItem
|
|
||||||
onClick={() => navigate("/page/strategy/admin/login-whitelist")}
|
|
||||||
>
|
|
||||||
<ShieldCheck className="size-4" />
|
|
||||||
白名单管理
|
|
||||||
</DropdownMenuItem>
|
|
||||||
)}
|
|
||||||
{isAdmin && (
|
|
||||||
<DropdownMenuItem
|
|
||||||
onClick={() => navigate("/page/strategy/settings/model-concurrency")}
|
|
||||||
>
|
|
||||||
<Gauge className="size-4" />
|
|
||||||
模型并发限制
|
|
||||||
</DropdownMenuItem>
|
|
||||||
)}
|
|
||||||
{canManageSensitiveWords() && (
|
|
||||||
<DropdownMenuItem
|
|
||||||
onClick={() => navigate("/page/strategy/admin/sensitive-words")}
|
|
||||||
>
|
|
||||||
<ShieldAlert className="size-4" />
|
|
||||||
敏感词管理
|
|
||||||
</DropdownMenuItem>
|
|
||||||
)}
|
|
||||||
</DropdownMenuContent>
|
</DropdownMenuContent>
|
||||||
</DropdownMenu>
|
</DropdownMenu>
|
||||||
) : null}
|
) : null}
|
||||||
@@ -259,8 +211,9 @@ function SecondaryNavSidebar() {
|
|||||||
<nav className="light-sidebar-subnav" aria-label="三级菜单">
|
<nav className="light-sidebar-subnav" aria-label="三级菜单">
|
||||||
{thirdItems.map((child) => {
|
{thirdItems.map((child) => {
|
||||||
const ChildIcon = child.icon;
|
const ChildIcon = child.icon;
|
||||||
const childActive = menuItemMatchesPath(child, pathname)
|
const childActive = child.path
|
||||||
|| (child.children?.length ? menuItemContainsPath(child, pathname) : false);
|
? pathname === child.path || pathname.startsWith(child.path + "/")
|
||||||
|
: hasActiveChild(child, pathname);
|
||||||
return (
|
return (
|
||||||
<button
|
<button
|
||||||
key={child.id}
|
key={child.id}
|
||||||
@@ -348,7 +301,7 @@ function LegacyAccordionSidebar({
|
|||||||
|
|
||||||
const renderLeaf = (item: MenuItem, depth = 0) => {
|
const renderLeaf = (item: MenuItem, depth = 0) => {
|
||||||
const Icon = item.icon;
|
const Icon = item.icon;
|
||||||
const isActive = menuItemMatchesPath(item, pathname);
|
const isActive = !!item.path && pathname === item.path;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<button
|
<button
|
||||||
@@ -514,30 +467,6 @@ function LegacyAccordionSidebar({
|
|||||||
<User className="size-4" />
|
<User className="size-4" />
|
||||||
个人信息
|
个人信息
|
||||||
</DropdownMenuItem>
|
</DropdownMenuItem>
|
||||||
{isAdmin && (
|
|
||||||
<DropdownMenuItem onClick={() => navigate("/page/strategy/admin/menu-management")}>
|
|
||||||
<ListTree className="size-4" />
|
|
||||||
菜单管理
|
|
||||||
</DropdownMenuItem>
|
|
||||||
)}
|
|
||||||
{isAdmin && (
|
|
||||||
<DropdownMenuItem onClick={() => navigate("/page/strategy/admin/task-buttons")}>
|
|
||||||
<MousePointerClick className="size-4" />
|
|
||||||
按钮管理
|
|
||||||
</DropdownMenuItem>
|
|
||||||
)}
|
|
||||||
{isAdmin && (
|
|
||||||
<DropdownMenuItem onClick={() => navigate("/page/strategy/admin/login-whitelist")}>
|
|
||||||
<ShieldCheck className="size-4" />
|
|
||||||
白名单管理
|
|
||||||
</DropdownMenuItem>
|
|
||||||
)}
|
|
||||||
{canManageSensitiveWords() && (
|
|
||||||
<DropdownMenuItem onClick={() => navigate("/page/strategy/admin/sensitive-words")}>
|
|
||||||
<ShieldAlert className="size-4" />
|
|
||||||
敏感词管理
|
|
||||||
</DropdownMenuItem>
|
|
||||||
)}
|
|
||||||
</DropdownMenuContent>
|
</DropdownMenuContent>
|
||||||
</DropdownMenu>
|
</DropdownMenu>
|
||||||
) : (
|
) : (
|
||||||
|
|||||||
@@ -1,59 +0,0 @@
|
|||||||
import * as React from "react";
|
|
||||||
|
|
||||||
export interface AutoGrowTextareaProps
|
|
||||||
extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {
|
|
||||||
/** 内容增长高度上限(px)，超过后框内滚动。默认 200。 */
|
|
||||||
maxHeight?: number;
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 自适应高度的多行输入框。
|
|
||||||
*
|
|
||||||
* 内容增多时自动扩展高度（输入框处于底部布局时即「向上扩展」），到 `maxHeight` 后框内滚动。
|
|
||||||
* 体验对齐通用问答页（`/page/strategy/qa/general`）的 tdesign `autosize` 输入框，但保留原生
|
|
||||||
* `<textarea>`，从而沿用各调用处自带的 Tailwind 样式 / 边框 / 占位色，无需 TDesign 包裹层。
|
|
||||||
*
|
|
||||||
* 用法：当成普通受控 `<textarea>` 用（传 `value` + `onChange`）。高度在布局阶段随 `value` 重算，
|
|
||||||
* 也在 `onChange` 时即时重算（兼顾非受控/输入法场景）。最小高度交给调用方的 `min-h-*` className
|
|
||||||
* 或 `rows` 控制——本组件不强加最小高度。换行/发送（Enter/Shift+Enter）逻辑由调用方的
|
|
||||||
* `onKeyDown` 决定。
|
|
||||||
*/
|
|
||||||
export const AutoGrowTextarea = React.forwardRef<
|
|
||||||
HTMLTextAreaElement,
|
|
||||||
AutoGrowTextareaProps
|
|
||||||
>(function AutoGrowTextarea(
|
|
||||||
{ maxHeight = 200, value, onChange, onInput, style, rows = 1, ...rest },
|
|
||||||
ref,
|
|
||||||
) {
|
|
||||||
const innerRef = React.useRef<HTMLTextAreaElement | null>(null);
|
|
||||||
React.useImperativeHandle(ref, () => innerRef.current as HTMLTextAreaElement);
|
|
||||||
|
|
||||||
const resize = React.useCallback(() => {
|
|
||||||
const el = innerRef.current;
|
|
||||||
if (!el) return;
|
|
||||||
el.style.height = "auto";
|
|
||||||
const next = Math.min(el.scrollHeight, maxHeight);
|
|
||||||
el.style.height = `${next}px`;
|
|
||||||
el.style.overflowY = el.scrollHeight > maxHeight ? "auto" : "hidden";
|
|
||||||
}, [maxHeight]);
|
|
||||||
|
|
||||||
// 受控值变化（含外部清空、粘贴大段文本）后在布局阶段重算，避免闪烁。
|
|
||||||
React.useLayoutEffect(() => {
|
|
||||||
resize();
|
|
||||||
}, [resize, value]);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<textarea
|
|
||||||
ref={innerRef}
|
|
||||||
rows={rows}
|
|
||||||
value={value}
|
|
||||||
onChange={onChange}
|
|
||||||
onInput={(e) => {
|
|
||||||
onInput?.(e);
|
|
||||||
resize();
|
|
||||||
}}
|
|
||||||
style={{ resize: "none", ...style }}
|
|
||||||
{...rest}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
});
|
|
||||||
@@ -144,24 +144,21 @@ function InputGroupInput({
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
const InputGroupTextarea = React.forwardRef<
|
function InputGroupTextarea({
|
||||||
HTMLTextAreaElement,
|
className,
|
||||||
React.ComponentProps<"textarea">
|
...props
|
||||||
>(function InputGroupTextarea({ className, ...props }, ref) {
|
}: React.ComponentProps<"textarea">) {
|
||||||
return (
|
return (
|
||||||
<Textarea
|
<Textarea
|
||||||
data-slot="input-group-control"
|
data-slot="input-group-control"
|
||||||
ref={ref}
|
|
||||||
className={cn(
|
className={cn(
|
||||||
"flex-1 resize-none rounded-none border-0 bg-transparent py-3 shadow-none focus-visible:ring-0 dark:bg-transparent",
|
"flex-1 resize-none rounded-none border-0 bg-transparent py-3 shadow-none focus-visible:ring-0 dark:bg-transparent",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
{...props}
|
{...props}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
});
|
}
|
||||||
|
|
||||||
InputGroupTextarea.displayName = "InputGroupTextarea";
|
|
||||||
|
|
||||||
export {
|
export {
|
||||||
InputGroup,
|
InputGroup,
|
||||||
|
|||||||
@@ -2,28 +2,19 @@ import * as React from "react";
|
|||||||
|
|
||||||
import { cn } from "@/lib/utils";
|
import { cn } from "@/lib/utils";
|
||||||
|
|
||||||
const Textarea = React.forwardRef<
|
function Textarea({ className, ...props }: React.ComponentProps<"textarea">) {
|
||||||
HTMLTextAreaElement,
|
return (
|
||||||
React.ComponentProps<"textarea">
|
<textarea
|
||||||
>(function Textarea({ className, rows, ...props }, ref) {
|
data-slot="textarea"
|
||||||
// `field-sizing` is not available in older Chrome. Keep a native rows
|
className={cn(
|
||||||
// fallback so a multi-line editor never collapses into a single line.
|
"border-input placeholder:text-muted-foreground/60 flex field-sizing-content min-h-16 w-full rounded-md border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
|
||||||
return (
|
|
||||||
<textarea
|
|
||||||
data-slot="textarea"
|
|
||||||
ref={ref}
|
|
||||||
rows={rows ?? 3}
|
|
||||||
className={cn(
|
|
||||||
"border-input placeholder:text-muted-foreground/60 flex min-h-16 w-full rounded-md border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
|
|
||||||
"dark:border-[#1B477E] dark:bg-[#022248] dark:text-[#AACEFF] ",
|
"dark:border-[#1B477E] dark:bg-[#022248] dark:text-[#AACEFF] ",
|
||||||
"focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
|
"focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
{...props}
|
{...props}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
});
|
}
|
||||||
|
|
||||||
Textarea.displayName = "Textarea";
|
|
||||||
|
|
||||||
export { Textarea };
|
export { Textarea };
|
||||||
@@ -3,7 +3,7 @@ export function EmptyDocumentState() {
|
|||||||
return (
|
return (
|
||||||
<div className="flex h-full items-center justify-center bg-white px-6 text-center dark:bg-slate-900">
|
<div className="flex h-full items-center justify-center bg-white px-6 text-center dark:bg-slate-900">
|
||||||
<div className="rounded-2xl border border-dashed border-slate-300 bg-slate-50 px-10 py-12 sm:px-12 dark:border-slate-700 dark:bg-slate-800/50">
|
<div className="rounded-2xl border border-dashed border-slate-300 bg-slate-50 px-10 py-12 sm:px-12 dark:border-slate-700 dark:bg-slate-800/50">
|
||||||
<div className="mb-4 text-[28px] font-semibold leading-none text-slate-500 dark:text-slate-300">文档</div>
|
<div className="mb-4 text-[40px] leading-none">📚</div>
|
||||||
<div className="mb-2 text-lg font-bold text-slate-700 dark:text-slate-200">
|
<div className="mb-2 text-lg font-bold text-slate-700 dark:text-slate-200">
|
||||||
选择一篇文档开始阅读
|
选择一篇文档开始阅读
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -1,556 +0,0 @@
|
|||||||
"use client";
|
|
||||||
|
|
||||||
import {
|
|
||||||
Activity,
|
|
||||||
Gauge,
|
|
||||||
Loader2,
|
|
||||||
OctagonX,
|
|
||||||
RefreshCw,
|
|
||||||
Square,
|
|
||||||
Zap,
|
|
||||||
} from "lucide-react";
|
|
||||||
import { useId, useMemo, useState } from "react";
|
|
||||||
import { toast } from "sonner";
|
|
||||||
|
|
||||||
import { Badge } from "@/components/ui/badge";
|
|
||||||
import { Button } from "@/components/ui/button";
|
|
||||||
import { Switch } from "@/components/ui/switch";
|
|
||||||
import type {
|
|
||||||
ActiveRunItem,
|
|
||||||
ConcurrencyPoint,
|
|
||||||
Granularity,
|
|
||||||
TokenSpeedPoint,
|
|
||||||
} from "@/core/admin/active-runs";
|
|
||||||
import {
|
|
||||||
useActiveRuns,
|
|
||||||
useCancelActiveRun,
|
|
||||||
useCancelAllActiveRuns,
|
|
||||||
useConcurrencySeries,
|
|
||||||
useMonitorSettings,
|
|
||||||
useTokenSpeedSeries,
|
|
||||||
useUpdateMonitorSettings,
|
|
||||||
} from "@/core/admin/hooks";
|
|
||||||
import { cn } from "@/lib/utils";
|
|
||||||
|
|
||||||
/** lookback window (hours) per granularity. */
|
|
||||||
const LOOKBACK: Record<Granularity, number> = { minute: 3, hour: 48 };
|
|
||||||
|
|
||||||
function fmtBucket(iso: string, granularity: Granularity): string {
|
|
||||||
const date = new Date(iso);
|
|
||||||
if (Number.isNaN(date.getTime())) return iso;
|
|
||||||
const mm = String(date.getMonth() + 1).padStart(2, "0");
|
|
||||||
const dd = String(date.getDate()).padStart(2, "0");
|
|
||||||
const hh = String(date.getHours()).padStart(2, "0");
|
|
||||||
const mi = String(date.getMinutes()).padStart(2, "0");
|
|
||||||
return granularity === "hour" ? `${mm}-${dd} ${hh}:00` : `${hh}:${mi}`;
|
|
||||||
}
|
|
||||||
|
|
||||||
function fmtElapsed(seconds: number): string {
|
|
||||||
if (seconds < 60) return `${seconds}s`;
|
|
||||||
const m = Math.floor(seconds / 60);
|
|
||||||
const s = seconds % 60;
|
|
||||||
if (m < 60) return `${m}m${s.toString().padStart(2, "0")}s`;
|
|
||||||
const h = Math.floor(m / 60);
|
|
||||||
return `${h}h${(m % 60).toString().padStart(2, "0")}m`;
|
|
||||||
}
|
|
||||||
|
|
||||||
interface LineSeries {
|
|
||||||
name: string;
|
|
||||||
color: string;
|
|
||||||
values: (number | null)[];
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Round a value up to a "nice" axis ceiling (1 / 2 / 5 × 10ⁿ). */
|
|
||||||
function niceCeil(v: number): number {
|
|
||||||
if (!Number.isFinite(v) || v <= 0) return 1;
|
|
||||||
const exp = Math.floor(Math.log10(v));
|
|
||||||
const base = 10 ** exp;
|
|
||||||
const f = v / base;
|
|
||||||
const nice = f <= 1 ? 1 : f <= 2 ? 2 : f <= 5 ? 5 : 10;
|
|
||||||
return nice * base;
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Build distinct axis ticks from the data max. For integer series (并发量) this
|
|
||||||
* yields whole-number ticks with no duplicate labels (fixes the「0 0 0 1 1」
|
|
||||||
* axis when the max is 1); for floats it uses a nice ceiling at quarters.
|
|
||||||
*/
|
|
||||||
function buildTicks(dataMax: number, integer: boolean): number[] {
|
|
||||||
if (!Number.isFinite(dataMax) || dataMax <= 0) return [0, 1];
|
|
||||||
if (integer) {
|
|
||||||
const niceMax = Math.max(1, Math.ceil(dataMax));
|
|
||||||
const step = Math.max(1, Math.ceil(niceMax / 4)); // ≤5 integer ticks
|
|
||||||
const top = Math.ceil(niceMax / step) * step;
|
|
||||||
const ticks: number[] = [];
|
|
||||||
for (let v = 0; v <= top; v += step) ticks.push(v);
|
|
||||||
return ticks;
|
|
||||||
}
|
|
||||||
const niceMax = niceCeil(dataMax);
|
|
||||||
return [0, 0.25, 0.5, 0.75, 1].map((r) => niceMax * r);
|
|
||||||
}
|
|
||||||
|
|
||||||
function fmtAxis(v: number, integer: boolean): string {
|
|
||||||
if (integer) return String(Math.round(v));
|
|
||||||
if (v === 0) return "0";
|
|
||||||
return v < 10 ? v.toFixed(1) : String(Math.round(v));
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Last non-null value of a series (for the legend's current reading). */
|
|
||||||
function latestOf(values: (number | null)[]): number | null {
|
|
||||||
for (let i = values.length - 1; i >= 0; i -= 1) {
|
|
||||||
if (values[i] != null) return values[i] as number;
|
|
||||||
}
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Minimal dependency-free SVG line chart: legend + 1–2 series + area + caption. */
|
|
||||||
function LineChart({
|
|
||||||
labels,
|
|
||||||
series,
|
|
||||||
unit,
|
|
||||||
integer = false,
|
|
||||||
note,
|
|
||||||
emptyHint,
|
|
||||||
}: {
|
|
||||||
labels: string[];
|
|
||||||
series: LineSeries[];
|
|
||||||
unit: string;
|
|
||||||
integer?: boolean;
|
|
||||||
note?: string;
|
|
||||||
emptyHint: string;
|
|
||||||
}) {
|
|
||||||
const gradId = `cm-area-${useId().replace(/:/g, "")}`;
|
|
||||||
const width = 760;
|
|
||||||
const height = 220;
|
|
||||||
const pad = { top: 16, right: 16, bottom: 26, left: 44 };
|
|
||||||
const cw = width - pad.left - pad.right;
|
|
||||||
const ch = height - pad.top - pad.bottom;
|
|
||||||
const n = labels.length;
|
|
||||||
|
|
||||||
const allValues = series.flatMap((s) => s.values.filter((v): v is number => v != null));
|
|
||||||
const dataMax = allValues.length ? Math.max(...allValues) : 0;
|
|
||||||
const ticks = buildTicks(dataMax, integer);
|
|
||||||
const axisMax = ticks[ticks.length - 1] || 1;
|
|
||||||
|
|
||||||
// Legend always renders (even with no data) so the lines are self-explanatory.
|
|
||||||
const legend = (
|
|
||||||
<div className="mb-2 flex flex-wrap items-center gap-x-4 gap-y-1">
|
|
||||||
{series.map((s) => {
|
|
||||||
const latest = latestOf(s.values);
|
|
||||||
return (
|
|
||||||
<span key={s.name} className="flex items-center gap-1.5 text-xs text-[#5F6368] dark:text-slate-300">
|
|
||||||
<span className="inline-block h-[3px] w-4 rounded-full" style={{ backgroundColor: s.color }} />
|
|
||||||
{s.name}
|
|
||||||
{latest != null && (
|
|
||||||
<span className="font-semibold tabular-nums text-[#231815] dark:text-white">
|
|
||||||
{Number.isInteger(latest) ? latest : latest.toFixed(1)}
|
|
||||||
{unit}
|
|
||||||
</span>
|
|
||||||
)}
|
|
||||||
</span>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
|
|
||||||
const caption = note ? (
|
|
||||||
<p className="mt-2 text-[11px] leading-4 text-[#8B6B6B] dark:text-[#7FACF2]">{note}</p>
|
|
||||||
) : null;
|
|
||||||
|
|
||||||
if (n === 0) {
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
{legend}
|
|
||||||
<div className="flex h-[160px] items-center justify-center rounded-lg border border-dashed border-[#F1D6D6] text-sm text-[#5F6368] dark:border-[#213D5E] dark:text-slate-400">
|
|
||||||
{emptyHint}
|
|
||||||
</div>
|
|
||||||
{caption}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
const xFor = (i: number) => pad.left + (n <= 1 ? cw / 2 : (i / (n - 1)) * cw);
|
|
||||||
const yFor = (v: number) => pad.top + ch - (v / axisMax) * ch;
|
|
||||||
|
|
||||||
const linePath = (vals: (number | null)[]) => {
|
|
||||||
let d = "";
|
|
||||||
let started = false;
|
|
||||||
vals.forEach((v, i) => {
|
|
||||||
if (v == null) {
|
|
||||||
started = false;
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
d += `${started ? "L" : "M"} ${xFor(i).toFixed(1)} ${yFor(v).toFixed(1)} `;
|
|
||||||
started = true;
|
|
||||||
});
|
|
||||||
return d.trim();
|
|
||||||
};
|
|
||||||
|
|
||||||
const first = series[0];
|
|
||||||
const areaPath = (() => {
|
|
||||||
if (!first) return "";
|
|
||||||
const line = linePath(first.values);
|
|
||||||
if (!line) return "";
|
|
||||||
return `${line} L ${xFor(n - 1).toFixed(1)} ${(pad.top + ch).toFixed(1)} L ${xFor(0).toFixed(1)} ${(pad.top + ch).toFixed(1)} Z`;
|
|
||||||
})();
|
|
||||||
|
|
||||||
const labelStep = Math.max(1, Math.ceil(n / 7));
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
{legend}
|
|
||||||
<svg viewBox={`0 0 ${width} ${height}`} className="w-full" role="img" aria-label="时序折线图">
|
|
||||||
<defs>
|
|
||||||
<linearGradient id={gradId} x1="0" x2="0" y1="0" y2="1">
|
|
||||||
<stop offset="0%" stopColor={first?.color ?? "#C1121F"} stopOpacity="0.18" />
|
|
||||||
<stop offset="100%" stopColor={first?.color ?? "#C1121F"} stopOpacity="0.02" />
|
|
||||||
</linearGradient>
|
|
||||||
</defs>
|
|
||||||
{ticks.map((t) => {
|
|
||||||
const y = yFor(t);
|
|
||||||
return (
|
|
||||||
<g key={t}>
|
|
||||||
<line
|
|
||||||
x1={pad.left}
|
|
||||||
x2={width - pad.right}
|
|
||||||
y1={y}
|
|
||||||
y2={y}
|
|
||||||
stroke="currentColor"
|
|
||||||
className="text-[#E5E7EB] dark:text-[#3F3F46]"
|
|
||||||
strokeWidth="1"
|
|
||||||
/>
|
|
||||||
<text x={pad.left - 6} y={y + 3} textAnchor="end" className="fill-[#9CA3AF] text-[10px]">
|
|
||||||
{fmtAxis(t, integer)}
|
|
||||||
</text>
|
|
||||||
</g>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
{areaPath && <path d={areaPath} fill={`url(#${gradId})`} />}
|
|
||||||
{series.map((s) => (
|
|
||||||
<path
|
|
||||||
key={s.name}
|
|
||||||
d={linePath(s.values)}
|
|
||||||
fill="none"
|
|
||||||
stroke={s.color}
|
|
||||||
strokeWidth="2"
|
|
||||||
strokeLinecap="round"
|
|
||||||
strokeLinejoin="round"
|
|
||||||
/>
|
|
||||||
))}
|
|
||||||
{labels.map((label, i) => {
|
|
||||||
if (i !== 0 && i !== n - 1 && i % labelStep !== 0) return null;
|
|
||||||
return (
|
|
||||||
<text key={`${label}-${i}`} x={xFor(i)} y={height - 8} textAnchor="middle" className="fill-[#6B7280] text-[10px]">
|
|
||||||
{label}
|
|
||||||
</text>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
{series.map((s) =>
|
|
||||||
s.values.map((v, i) =>
|
|
||||||
v == null ? null : (
|
|
||||||
<circle key={`${s.name}-${i}`} cx={xFor(i)} cy={yFor(v)} r={2.5} fill={s.color}>
|
|
||||||
<title>{`${labels[i]} · ${s.name}: ${v}${unit}`}</title>
|
|
||||||
</circle>
|
|
||||||
),
|
|
||||||
),
|
|
||||||
)}
|
|
||||||
</svg>
|
|
||||||
{caption}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
function ChartCard({
|
|
||||||
icon: Icon,
|
|
||||||
title,
|
|
||||||
subtitle,
|
|
||||||
children,
|
|
||||||
}: {
|
|
||||||
icon: typeof Activity;
|
|
||||||
title: string;
|
|
||||||
subtitle: string;
|
|
||||||
children: React.ReactNode;
|
|
||||||
}) {
|
|
||||||
return (
|
|
||||||
<section className="rounded-lg border border-[#F1D6D6] bg-white p-4 shadow-sm dark:border-[#213D5E] dark:bg-[#02244C]">
|
|
||||||
<div className="mb-3 flex items-center gap-2">
|
|
||||||
<Icon className="size-4 text-[#C1121F] dark:text-[#7FACF2]" />
|
|
||||||
<h3 className="font-semibold text-[#231815] dark:text-white">{title}</h3>
|
|
||||||
<span className="ml-auto text-xs text-[#8B6B6B] dark:text-[#7FACF2]">{subtitle}</span>
|
|
||||||
</div>
|
|
||||||
{children}
|
|
||||||
</section>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
function ActiveRunRow({
|
|
||||||
run,
|
|
||||||
onStop,
|
|
||||||
stopping,
|
|
||||||
}: {
|
|
||||||
run: ActiveRunItem;
|
|
||||||
onStop: (runId: string) => void;
|
|
||||||
stopping: boolean;
|
|
||||||
}) {
|
|
||||||
return (
|
|
||||||
<div className="grid grid-cols-[minmax(0,1.4fr)_minmax(0,1.2fr)_72px_64px_64px_72px] items-center gap-3 border-b border-[#F1D6D6] px-3 py-2 text-sm last:border-b-0 dark:border-[#213D5E]">
|
|
||||||
<div className="min-w-0">
|
|
||||||
<div className="truncate font-medium text-[#202124] dark:text-white">{run.user_name || "未知用户"}</div>
|
|
||||||
<div className="truncate text-xs text-[#5F6368] dark:text-slate-400" title={run.thread_title}>
|
|
||||||
{run.thread_title || run.thread_id}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="min-w-0 truncate text-[#202124] dark:text-slate-100">{run.agent_name}</div>
|
|
||||||
<Badge variant="outline" className="justify-center">
|
|
||||||
{run.kind}
|
|
||||||
</Badge>
|
|
||||||
<span
|
|
||||||
className={cn(
|
|
||||||
"text-center text-xs font-medium",
|
|
||||||
run.status === "running" ? "text-[#0F766E] dark:text-teal-300" : "text-[#B45309] dark:text-amber-300",
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
{run.status === "running" ? "运行中" : "排队中"}
|
|
||||||
</span>
|
|
||||||
<span className="text-center text-xs tabular-nums text-[#5F6368] dark:text-slate-400">
|
|
||||||
{fmtElapsed(run.elapsed_seconds)}
|
|
||||||
</span>
|
|
||||||
<Button
|
|
||||||
size="sm"
|
|
||||||
variant="outline"
|
|
||||||
className="h-7 border-[#C1121F]/40 text-[#C1121F] hover:bg-[#FFF1F1] dark:border-rose-400/40 dark:text-rose-200"
|
|
||||||
disabled={stopping}
|
|
||||||
onClick={() => onStop(run.run_id)}
|
|
||||||
>
|
|
||||||
{stopping ? <Loader2 className="size-3.5 animate-spin" /> : <Square className="size-3.5" />}
|
|
||||||
停止
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export function ConcurrencyMonitorPanel() {
|
|
||||||
const [open, setOpen] = useState(true);
|
|
||||||
const [granularity, setGranularity] = useState<Granularity>("minute");
|
|
||||||
|
|
||||||
const { data: live, isLoading: liveLoading, refetch, isRefetching } = useActiveRuns(open);
|
|
||||||
const concurrency = useConcurrencySeries(granularity, LOOKBACK[granularity], open);
|
|
||||||
const tokenSpeed = useTokenSpeedSeries(granularity, LOOKBACK[granularity], open);
|
|
||||||
const { data: settings } = useMonitorSettings();
|
|
||||||
const updateSettings = useUpdateMonitorSettings();
|
|
||||||
const cancelOne = useCancelActiveRun();
|
|
||||||
const cancelAll = useCancelAllActiveRuns();
|
|
||||||
|
|
||||||
const [stoppingId, setStoppingId] = useState<string | null>(null);
|
|
||||||
|
|
||||||
const count = live?.count ?? 0;
|
|
||||||
const runs = live?.runs ?? [];
|
|
||||||
const samplerOn = settings?.enabled ?? false;
|
|
||||||
|
|
||||||
const concurrencyChart = useMemo(() => {
|
|
||||||
const points: ConcurrencyPoint[] = concurrency.data?.points ?? [];
|
|
||||||
return {
|
|
||||||
labels: points.map((p) => fmtBucket(p.bucket, granularity)),
|
|
||||||
series: [
|
|
||||||
{ name: "峰值并发", color: "#C1121F", values: points.map((p) => p.peak) },
|
|
||||||
{ name: "平均并发", color: "#F59E0B", values: points.map((p) => p.avg) },
|
|
||||||
] as LineSeries[],
|
|
||||||
};
|
|
||||||
}, [concurrency.data, granularity]);
|
|
||||||
|
|
||||||
const tokenChart = useMemo(() => {
|
|
||||||
const points: TokenSpeedPoint[] = tokenSpeed.data?.points ?? [];
|
|
||||||
return {
|
|
||||||
labels: points.map((p) => fmtBucket(p.bucket, granularity)),
|
|
||||||
series: [
|
|
||||||
{ name: "平均速度", color: "#2563EB", values: points.map((p) => p.avg_tokens_per_sec) },
|
|
||||||
{ name: "最慢", color: "#9333EA", values: points.map((p) => p.min_tokens_per_sec) },
|
|
||||||
] as LineSeries[],
|
|
||||||
};
|
|
||||||
}, [tokenSpeed.data, granularity]);
|
|
||||||
|
|
||||||
const handleStop = async (runId: string) => {
|
|
||||||
setStoppingId(runId);
|
|
||||||
try {
|
|
||||||
const res = await cancelOne.mutateAsync(runId);
|
|
||||||
toast[res.cancelled ? "success" : "info"](res.cancelled ? "已停止该对话调用" : "该调用已结束或不存在");
|
|
||||||
} catch (e) {
|
|
||||||
toast.error(e instanceof Error ? e.message : "停止失败");
|
|
||||||
} finally {
|
|
||||||
setStoppingId(null);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleStopAll = async () => {
|
|
||||||
if (runs.length === 0) return;
|
|
||||||
if (!window.confirm(`确定要停止当前全部 ${count} 个并发调用吗？这会中断这些用户正在生成的回答。`)) return;
|
|
||||||
try {
|
|
||||||
const res = await cancelAll.mutateAsync();
|
|
||||||
toast.success(`已停止 ${res.cancelled_count} 个调用`);
|
|
||||||
} catch (e) {
|
|
||||||
toast.error(e instanceof Error ? e.message : "全部停止失败");
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleToggleSampler = async (next: boolean) => {
|
|
||||||
try {
|
|
||||||
await updateSettings.mutateAsync(next);
|
|
||||||
toast.success(next ? "已开启并发采样" : "已关闭并发采样（折线图不再新增历史点）");
|
|
||||||
} catch (e) {
|
|
||||||
toast.error(e instanceof Error ? e.message : "切换失败");
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
|
||||||
<section className="space-y-4 rounded-xl border border-[#F1D6D6] bg-[#FFF7F7] p-4 shadow-sm dark:border-[#213D5E] dark:bg-[#011226]">
|
|
||||||
{/* header */}
|
|
||||||
<div className="flex flex-wrap items-center gap-3">
|
|
||||||
<div className="flex items-center gap-2">
|
|
||||||
<span className="flex size-9 items-center justify-center rounded-lg bg-[#C1121F] text-white dark:bg-[#2563EB]">
|
|
||||||
<Activity className="size-5" />
|
|
||||||
</span>
|
|
||||||
<div>
|
|
||||||
<div className="font-semibold text-[#231815] dark:text-white">实时并发监控</div>
|
|
||||||
<div className="text-xs text-[#8B6B6B] dark:text-[#7FACF2]">
|
|
||||||
监控大模型并发压力，可直接停止任意对话调用
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="ml-auto flex flex-wrap items-center gap-3">
|
|
||||||
<div className="flex items-center gap-2 rounded-lg border border-[#F1D6D6] bg-white px-3 py-1.5 dark:border-[#213D5E] dark:bg-[#02244C]">
|
|
||||||
<span className="text-xs text-[#5F6368] dark:text-slate-300">当前并发</span>
|
|
||||||
<span
|
|
||||||
className={cn(
|
|
||||||
"text-2xl font-semibold tabular-nums",
|
|
||||||
count > 0 ? "text-[#C1121F] dark:text-[#7FACF2]" : "text-[#202124] dark:text-white",
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
{count}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div className="flex items-center gap-2 rounded-lg border border-[#F1D6D6] bg-white px-3 py-1.5 dark:border-[#213D5E] dark:bg-[#02244C]">
|
|
||||||
<span className="text-xs text-[#5F6368] dark:text-slate-300">后台采样</span>
|
|
||||||
<Switch checked={samplerOn} onCheckedChange={handleToggleSampler} disabled={updateSettings.isPending} />
|
|
||||||
</div>
|
|
||||||
<Button variant="outline" size="sm" onClick={() => refetch()} disabled={isRefetching}>
|
|
||||||
<RefreshCw className={cn("mr-1 size-4", isRefetching && "animate-spin")} />
|
|
||||||
刷新
|
|
||||||
</Button>
|
|
||||||
<Button
|
|
||||||
variant="outline"
|
|
||||||
size="sm"
|
|
||||||
className="border-[#C1121F]/50 text-[#C1121F] hover:bg-[#FFF1F1] dark:border-rose-400/40 dark:text-rose-200"
|
|
||||||
onClick={handleStopAll}
|
|
||||||
disabled={cancelAll.isPending || runs.length === 0}
|
|
||||||
>
|
|
||||||
<OctagonX className="mr-1 size-4" />
|
|
||||||
全部停止
|
|
||||||
</Button>
|
|
||||||
<Button variant="ghost" size="sm" onClick={() => setOpen((v) => !v)}>
|
|
||||||
{open ? "收起" : "展开"}
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{open && (
|
|
||||||
<>
|
|
||||||
{!samplerOn && (
|
|
||||||
<div className="rounded-lg border border-amber-300/60 bg-amber-50 px-3 py-2 text-xs text-amber-800 dark:border-amber-300/30 dark:bg-amber-300/10 dark:text-amber-100">
|
|
||||||
后台采样默认关闭：实时并发数与「停止」功能始终可用。需要并发量历史折线图时，打开右上角「后台采样」开关即可开始记录（对线上服务影响极小，可随时关闭）。
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{/* granularity toggle */}
|
|
||||||
<div className="flex items-center gap-2">
|
|
||||||
<span className="text-xs text-[#5F6368] dark:text-slate-300">统计粒度</span>
|
|
||||||
{(["minute", "hour"] as Granularity[]).map((g) => (
|
|
||||||
<Button
|
|
||||||
key={g}
|
|
||||||
size="sm"
|
|
||||||
variant={granularity === g ? "default" : "outline"}
|
|
||||||
className={cn("h-7", granularity === g && "bg-[#C1121F] hover:bg-[#A50F1A] dark:bg-[#2563EB]")}
|
|
||||||
onClick={() => setGranularity(g)}
|
|
||||||
>
|
|
||||||
{g === "minute" ? "按分钟" : "按小时"}
|
|
||||||
</Button>
|
|
||||||
))}
|
|
||||||
<span className="text-xs text-[#8B6B6B] dark:text-[#7FACF2]">
|
|
||||||
{granularity === "minute" ? "近 3 小时" : "近 48 小时"}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* charts */}
|
|
||||||
<div className="grid gap-3 xl:grid-cols-2">
|
|
||||||
<ChartCard icon={Gauge} title="并发量（系统压力）" subtitle={`每${granularity === "hour" ? "小时" : "分钟"}一个点`}>
|
|
||||||
{concurrency.isLoading ? (
|
|
||||||
<div className="flex h-[220px] items-center justify-center text-sm text-[#5F6368] dark:text-slate-400">
|
|
||||||
<Loader2 className="mr-2 size-4 animate-spin" /> 加载中
|
|
||||||
</div>
|
|
||||||
) : (
|
|
||||||
<LineChart
|
|
||||||
labels={concurrencyChart.labels}
|
|
||||||
series={concurrencyChart.series}
|
|
||||||
unit=" 个"
|
|
||||||
integer
|
|
||||||
note="红线=该时段同时进行的最多调用数（峰值）；橙线=该时段平均值。数值越高、越靠上，说明同时打大模型的请求越多、系统压力越大。"
|
|
||||||
emptyHint="暂无并发采样数据（需打开「后台采样」开关后才开始记录）"
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
</ChartCard>
|
|
||||||
<ChartCard icon={Zap} title="大模型出字速度" subtitle={`每${granularity === "hour" ? "小时" : "分钟"}一个点`}>
|
|
||||||
{tokenSpeed.isLoading ? (
|
|
||||||
<div className="flex h-[220px] items-center justify-center text-sm text-[#5F6368] dark:text-slate-400">
|
|
||||||
<Loader2 className="mr-2 size-4 animate-spin" /> 加载中
|
|
||||||
</div>
|
|
||||||
) : (
|
|
||||||
<LineChart
|
|
||||||
labels={tokenChart.labels}
|
|
||||||
series={tokenChart.series}
|
|
||||||
unit=" t/s"
|
|
||||||
note="蓝线=该时段所有大模型调用的平均出字速度（tokens/秒，越高越快）；紫线=该时段最慢的一次调用。某段时间线明显下凹，说明那会儿模型/供应商变慢，是压力或瓶颈所在。"
|
|
||||||
emptyHint="暂无大模型调用记录"
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
</ChartCard>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* active run list */}
|
|
||||||
<section className="rounded-lg border border-[#F1D6D6] bg-white dark:border-[#213D5E] dark:bg-[#02244C]">
|
|
||||||
<div className="flex items-center gap-2 border-b border-[#F1D6D6] px-3 py-2 dark:border-[#213D5E]">
|
|
||||||
<span className="font-semibold text-[#231815] dark:text-white">正在进行的调用</span>
|
|
||||||
<Badge variant="outline">{count}</Badge>
|
|
||||||
{liveLoading && <Loader2 className="size-3.5 animate-spin text-[#8B6B6B]" />}
|
|
||||||
</div>
|
|
||||||
{runs.length === 0 ? (
|
|
||||||
<div className="py-10 text-center text-sm text-[#5F6368] dark:text-slate-400">
|
|
||||||
当前没有正在进行的大模型调用
|
|
||||||
</div>
|
|
||||||
) : (
|
|
||||||
<div>
|
|
||||||
<div className="grid grid-cols-[minmax(0,1.4fr)_minmax(0,1.2fr)_72px_64px_64px_72px] gap-3 border-b border-[#F1D6D6] px-3 py-2 text-xs text-[#8B6B6B] dark:border-[#213D5E] dark:text-[#7FACF2]">
|
|
||||||
<span>用户 / 会话</span>
|
|
||||||
<span>智能体</span>
|
|
||||||
<span className="text-center">类型</span>
|
|
||||||
<span className="text-center">状态</span>
|
|
||||||
<span className="text-center">已运行</span>
|
|
||||||
<span className="text-center">操作</span>
|
|
||||||
</div>
|
|
||||||
{runs.map((run) => (
|
|
||||||
<ActiveRunRow
|
|
||||||
key={run.run_id}
|
|
||||||
run={run}
|
|
||||||
onStop={handleStop}
|
|
||||||
stopping={stoppingId === run.run_id}
|
|
||||||
/>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</section>
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
</section>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export default ConcurrencyMonitorPanel;
|
|
||||||
@@ -401,7 +401,7 @@ export function PositionManagementPage() {
|
|||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="flex size-full min-h-0 flex-col gap-4 overflow-auto p-6">
|
<div className="flex flex-col gap-4 p-6">
|
||||||
<div className="flex items-center justify-between">
|
<div className="flex items-center justify-between">
|
||||||
<div>
|
<div>
|
||||||
<h1 className="text-lg font-semibold">岗位管理</h1>
|
<h1 className="text-lg font-semibold">岗位管理</h1>
|
||||||
|
|||||||
@@ -213,7 +213,7 @@ const errorToastDarkOptions = {
|
|||||||
</div>
|
</div>
|
||||||
<div className="flex flex-1 flex-wrap items-center gap-1.5">
|
<div className="flex flex-1 flex-wrap items-center gap-1.5">
|
||||||
{summary && Object.keys(summary.by_category).length === 0 && (
|
{summary && Object.keys(summary.by_category).length === 0 && (
|
||||||
<span className="text-muted-foreground text-sm">暂无失败记录</span>
|
<span className="text-muted-foreground text-sm">暂无失败记录 🎉</span>
|
||||||
)}
|
)}
|
||||||
{summary &&
|
{summary &&
|
||||||
Object.entries(summary.by_category)
|
Object.entries(summary.by_category)
|
||||||
|
|||||||
@@ -12,7 +12,7 @@ export function UserManagementPage() {
|
|||||||
const { data: users, isLoading, error } = useAllUsers(true);
|
const { data: users, isLoading, error } = useAllUsers(true);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="flex size-full min-h-0 flex-col gap-6 overflow-auto p-6">
|
<div className="flex flex-col gap-6 p-6">
|
||||||
<SettingsSection
|
<SettingsSection
|
||||||
title={t.adminUsers.title}
|
title={t.adminUsers.title}
|
||||||
description={t.adminUsers.description}
|
description={t.adminUsers.description}
|
||||||
|
|||||||
@@ -1,35 +0,0 @@
|
|||||||
/**
|
|
||||||
* 智能体图标底色 —— 按 id 稳定散列到一组主题色，复刻参考图的彩色方块。
|
|
||||||
*
|
|
||||||
* 浅色模式沿用原高彩度彩色（不改）；深蓝主题改用《深蓝 UI 规范》§1.1.7/§1.1.8 的蓝-青系
|
|
||||||
* （docs/ui规范-深蓝，克制、不刺眼），仅深蓝主题下生效，互不影响。
|
|
||||||
*
|
|
||||||
* 全量版通用问答左栏（GeneralQaSidebar）与 zzJC/zzXD 模块左栏（AgentModuleSidebar）共用，
|
|
||||||
* 保证彩色卡片配色完全一致。
|
|
||||||
*/
|
|
||||||
|
|
||||||
const AGENT_COLORS_LIGHT = [
|
|
||||||
{ from: "#fb7185", to: "#ef4444" },
|
|
||||||
{ from: "#60a5fa", to: "#3b82f6" },
|
|
||||||
{ from: "#fbbf24", to: "#f59e0b" },
|
|
||||||
{ from: "#34d399", to: "#10b981" },
|
|
||||||
{ from: "#a78bfa", to: "#8b5cf6" },
|
|
||||||
] as const;
|
|
||||||
|
|
||||||
const AGENT_COLORS_DARK = [
|
|
||||||
{ from: "#4096FF", to: "#1677FF" }, // 蓝（链接蓝 → 主色）
|
|
||||||
{ from: "#36CFC9", to: "#13C2C2" }, // 青（辅色）
|
|
||||||
{ from: "#6388FF", to: "#0958D9" }, // 紫蓝（装饰紫 → 主色深一档）
|
|
||||||
{ from: "#5CDBD3", to: "#08979C" }, // 浅青 → 深青
|
|
||||||
{ from: "#69B1FF", to: "#003EB3" }, // 浅蓝 → 主色按下
|
|
||||||
] as const;
|
|
||||||
|
|
||||||
/** 按 agent id 稳定散列出一对渐变色（from → to）。`isDark` 切换深蓝/浅色调色板。 */
|
|
||||||
export function agentColor(id: string, isDark: boolean) {
|
|
||||||
let hash = 0;
|
|
||||||
for (let i = 0; i < id.length; i++) {
|
|
||||||
hash = (hash * 31 + id.charCodeAt(i)) >>> 0;
|
|
||||||
}
|
|
||||||
const palette = isDark ? AGENT_COLORS_DARK : AGENT_COLORS_LIGHT;
|
|
||||||
return palette[hash % palette.length]!;
|
|
||||||
}
|
|
||||||
@@ -35,7 +35,7 @@ export function AgentWelcome({
|
|||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<div className="agent-avatar bg-primary/10 ring-primary/15 mb-2 flex h-[72px] w-[72px] items-center justify-center rounded-3xl ring-1">
|
<div className="bg-primary/10 ring-primary/15 mb-2 flex h-[72px] w-[72px] items-center justify-center rounded-3xl ring-1">
|
||||||
<BotIcon className="text-primary h-9 w-9" />
|
<BotIcon className="text-primary h-9 w-9" />
|
||||||
</div>
|
</div>
|
||||||
<div className="text-3xl font-bold tracking-tight">
|
<div className="text-3xl font-bold tracking-tight">
|
||||||
|
|||||||
@@ -1,90 +0,0 @@
|
|||||||
"use client";
|
|
||||||
|
|
||||||
import { BotIcon, SparklesIcon } from "lucide-react";
|
|
||||||
|
|
||||||
import { cn } from "@/lib/utils";
|
|
||||||
|
|
||||||
type AgentBrandIconProps = {
|
|
||||||
className?: string;
|
|
||||||
size?: "nav" | "sm" | "md" | "lg";
|
|
||||||
};
|
|
||||||
|
|
||||||
const SIZE_STYLES = {
|
|
||||||
nav: {
|
|
||||||
frame: "size-[22px] rounded-md",
|
|
||||||
bot: "size-3.5",
|
|
||||||
badge: "-right-1 -top-1 size-2.5",
|
|
||||||
sparkle: "size-1.5",
|
|
||||||
},
|
|
||||||
sm: {
|
|
||||||
frame: "size-10 rounded-full",
|
|
||||||
bot: "size-[18px]",
|
|
||||||
badge: "-right-1 -top-1 size-3.5",
|
|
||||||
sparkle: "size-2",
|
|
||||||
},
|
|
||||||
md: {
|
|
||||||
frame: "size-12 rounded-full",
|
|
||||||
bot: "size-6",
|
|
||||||
badge: "-right-1 -top-1 size-4",
|
|
||||||
sparkle: "size-2.5",
|
|
||||||
},
|
|
||||||
lg: {
|
|
||||||
frame: "size-16 rounded-full",
|
|
||||||
bot: "size-7",
|
|
||||||
badge: "-right-1 -top-1 size-[18px]",
|
|
||||||
sparkle: "size-3",
|
|
||||||
},
|
|
||||||
} as const;
|
|
||||||
|
|
||||||
export function AgentBrandIcon({
|
|
||||||
className,
|
|
||||||
size = "md",
|
|
||||||
}: AgentBrandIconProps) {
|
|
||||||
const styles = SIZE_STYLES[size];
|
|
||||||
const showBadge = size === "nav";
|
|
||||||
|
|
||||||
if (size !== "nav") {
|
|
||||||
return (
|
|
||||||
<span
|
|
||||||
aria-hidden="true"
|
|
||||||
data-agent-brand-icon={size}
|
|
||||||
className={cn(
|
|
||||||
"relative inline-flex shrink-0 overflow-hidden rounded-full",
|
|
||||||
styles.frame,
|
|
||||||
className,
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
<img
|
|
||||||
src="/agent-avatar.png"
|
|
||||||
alt=""
|
|
||||||
className="size-full object-contain"
|
|
||||||
draggable={false}
|
|
||||||
/>
|
|
||||||
</span>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<span
|
|
||||||
aria-hidden="true"
|
|
||||||
data-agent-brand-icon={size}
|
|
||||||
className={cn(
|
|
||||||
"relative inline-flex shrink-0 items-center justify-center border border-blue-100 bg-[radial-gradient(circle_at_35%_30%,#ffffff_0%,#edf4ff_46%,#dce9ff_100%)] text-[#1f5fdb] shadow-[0_8px_22px_rgba(37,99,235,0.13),inset_0_1px_0_rgba(255,255,255,0.9)] dark:border-blue-400/30 dark:bg-blue-500/20 dark:text-blue-300",
|
|
||||||
styles.frame,
|
|
||||||
className,
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
<BotIcon className={styles.bot} strokeWidth={1.9} />
|
|
||||||
{showBadge && (
|
|
||||||
<span
|
|
||||||
className={cn(
|
|
||||||
"absolute flex items-center justify-center rounded-full bg-gradient-to-br from-[#4b91ff] to-[#1858db] text-white shadow-sm ring-2 ring-white dark:ring-slate-950",
|
|
||||||
styles.badge,
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
<SparklesIcon className={styles.sparkle} strokeWidth={2.4} />
|
|
||||||
</span>
|
|
||||||
)}
|
|
||||||
</span>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@@ -1,13 +1,13 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
import {
|
import {
|
||||||
|
BotIcon,
|
||||||
ClockIcon,
|
ClockIcon,
|
||||||
CopyIcon,
|
CopyIcon,
|
||||||
EyeOffIcon,
|
EyeOffIcon,
|
||||||
GlobeIcon,
|
GlobeIcon,
|
||||||
LockIcon,
|
LockIcon,
|
||||||
MessageSquareIcon,
|
MessageSquareIcon,
|
||||||
MoreHorizontalIcon,
|
|
||||||
PinIcon,
|
PinIcon,
|
||||||
ShieldIcon,
|
ShieldIcon,
|
||||||
SparklesIcon,
|
SparklesIcon,
|
||||||
@@ -28,7 +28,7 @@ import {
|
|||||||
} from "react";
|
} from "react";
|
||||||
import { toast } from "sonner";
|
import { toast } from "sonner";
|
||||||
|
|
||||||
import { Badge } from "@/components/ui/badge";
|
import { Badge } from "@/components/ui/badge";
|
||||||
import { Button } from "@/components/ui/button";
|
import { Button } from "@/components/ui/button";
|
||||||
import {
|
import {
|
||||||
Card,
|
Card,
|
||||||
@@ -38,21 +38,14 @@ import {
|
|||||||
CardHeader,
|
CardHeader,
|
||||||
CardTitle,
|
CardTitle,
|
||||||
} from "@/components/ui/card";
|
} from "@/components/ui/card";
|
||||||
import {
|
import {
|
||||||
Dialog,
|
Dialog,
|
||||||
DialogContent,
|
DialogContent,
|
||||||
DialogDescription,
|
DialogDescription,
|
||||||
DialogFooter,
|
DialogFooter,
|
||||||
DialogHeader,
|
DialogHeader,
|
||||||
DialogTitle,
|
DialogTitle,
|
||||||
} from "@/components/ui/dialog";
|
} from "@/components/ui/dialog";
|
||||||
import {
|
|
||||||
DropdownMenu,
|
|
||||||
DropdownMenuContent,
|
|
||||||
DropdownMenuItem,
|
|
||||||
DropdownMenuSeparator,
|
|
||||||
DropdownMenuTrigger,
|
|
||||||
} from "@/components/ui/dropdown-menu";
|
|
||||||
import { Input } from "@/components/ui/input";
|
import { Input } from "@/components/ui/input";
|
||||||
import {
|
import {
|
||||||
Select,
|
Select,
|
||||||
@@ -66,8 +59,7 @@ import { Textarea } from "@/components/ui/textarea";
|
|||||||
import { usePublishSquares } from "@/core/system-settings/hooks";
|
import { usePublishSquares } from "@/core/system-settings/hooks";
|
||||||
import { PublishSquarePickerDialog } from "@/components/workspace/publish-square-picker-dialog";
|
import { PublishSquarePickerDialog } from "@/components/workspace/publish-square-picker-dialog";
|
||||||
import { SkillDetailDialog } from "@/components/workspace/skills/skill-detail-dialog";
|
import { SkillDetailDialog } from "@/components/workspace/skills/skill-detail-dialog";
|
||||||
import { AgentQuestionEditor } from "@/components/workspace/agents/agent-question-editor";
|
import { AgentQuestionEditor } from "@/components/workspace/agents/agent-question-editor";
|
||||||
import { AgentBrandIcon } from "@/components/workspace/agents/agent-brand-icon";
|
|
||||||
import { SkillTransferSelector } from "@/components/workspace/agents/skill-transfer-selector";
|
import { SkillTransferSelector } from "@/components/workspace/agents/skill-transfer-selector";
|
||||||
import { TagChipList } from "@/components/workspace/tags/tag-chip";
|
import { TagChipList } from "@/components/workspace/tags/tag-chip";
|
||||||
import { TagPickerDialog } from "@/components/workspace/tags/tag-picker-dialog";
|
import { TagPickerDialog } from "@/components/workspace/tags/tag-picker-dialog";
|
||||||
@@ -85,7 +77,6 @@ import {
|
|||||||
import { getAgent } from "@/core/agents/api";
|
import { getAgent } from "@/core/agents/api";
|
||||||
import type { Agent, AgentQuestion, UpdateAgentRequest } from "@/core/agents";
|
import type { Agent, AgentQuestion, UpdateAgentRequest } from "@/core/agents";
|
||||||
import { getStoredAuth } from "@/core/auth";
|
import { getStoredAuth } from "@/core/auth";
|
||||||
import { useLiveAccount } from "@/core/auth/use-live-account";
|
|
||||||
import { useI18n } from "@/core/i18n/hooks";
|
import { useI18n } from "@/core/i18n/hooks";
|
||||||
import { useSkills } from "@/core/skills/hooks";
|
import { useSkills } from "@/core/skills/hooks";
|
||||||
import { formatDateTime } from "@/core/utils/datetime";
|
import { formatDateTime } from "@/core/utils/datetime";
|
||||||
@@ -238,10 +229,6 @@ export function AgentCard({ agent, layout = "card", onPublisherClick }: AgentCar
|
|||||||
);
|
);
|
||||||
const [editPublished, setEditPublished] = useState(agent.published);
|
const [editPublished, setEditPublished] = useState(agent.published);
|
||||||
const [editIsPrivate, setEditIsPrivate] = useState(agent.is_private);
|
const [editIsPrivate, setEditIsPrivate] = useState(agent.is_private);
|
||||||
// 会商席位「技能识别强化」开关（弱模型补偿）。默认关。
|
|
||||||
const [editSeatSkillDirective, setEditSeatSkillDirective] = useState(
|
|
||||||
agent.seat_skill_directive ?? false,
|
|
||||||
);
|
|
||||||
const [editSquareId, setEditSquareId] = useState(agent.square_id ?? "");
|
const [editSquareId, setEditSquareId] = useState(agent.square_id ?? "");
|
||||||
const [publishPickerOpen, setPublishPickerOpen] = useState(false);
|
const [publishPickerOpen, setPublishPickerOpen] = useState(false);
|
||||||
const { data: publishSquares } = usePublishSquares();
|
const { data: publishSquares } = usePublishSquares();
|
||||||
@@ -259,8 +246,6 @@ export function AgentCard({ agent, layout = "card", onPublisherClick }: AgentCar
|
|||||||
|
|
||||||
const storedAuth = useMemo(() => getStoredAuth(), []);
|
const storedAuth = useMemo(() => getStoredAuth(), []);
|
||||||
const currentUserId = storedAuth?.user_id ?? null;
|
const currentUserId = storedAuth?.user_id ?? null;
|
||||||
// 发布请求实际以「实时」token 执行 —— 用 live 账号来提示发布者并检测账号是否被切换。
|
|
||||||
const live = useLiveAccount();
|
|
||||||
const isAdmin = storedAuth?.system_role === "admin";
|
const isAdmin = storedAuth?.system_role === "admin";
|
||||||
const isBuiltin = agent.builtin;
|
const isBuiltin = agent.builtin;
|
||||||
const isOwned =
|
const isOwned =
|
||||||
@@ -289,7 +274,6 @@ export function AgentCard({ agent, layout = "card", onPublisherClick }: AgentCar
|
|||||||
setEditSquareId(agent.square_id ?? "");
|
setEditSquareId(agent.square_id ?? "");
|
||||||
setSelectedSkills(agent.skills ?? []);
|
setSelectedSkills(agent.skills ?? []);
|
||||||
setEditCommonQuestions(normalizeAgentQuestions(agent.common_questions));
|
setEditCommonQuestions(normalizeAgentQuestions(agent.common_questions));
|
||||||
setEditSeatSkillDirective(agent.seat_skill_directive ?? false);
|
|
||||||
}, [
|
}, [
|
||||||
agent.common_questions,
|
agent.common_questions,
|
||||||
agent.description,
|
agent.description,
|
||||||
@@ -298,7 +282,6 @@ export function AgentCard({ agent, layout = "card", onPublisherClick }: AgentCar
|
|||||||
agent.published,
|
agent.published,
|
||||||
agent.square_id,
|
agent.square_id,
|
||||||
agent.skills,
|
agent.skills,
|
||||||
agent.seat_skill_directive,
|
|
||||||
editOpen,
|
editOpen,
|
||||||
]);
|
]);
|
||||||
|
|
||||||
@@ -312,8 +295,6 @@ export function AgentCard({ agent, layout = "card", onPublisherClick }: AgentCar
|
|||||||
if (agentDetail) {
|
if (agentDetail) {
|
||||||
setEditSoul(agentDetail.soul ?? "");
|
setEditSoul(agentDetail.soul ?? "");
|
||||||
setEditCommonQuestions(normalizeAgentQuestions(agentDetail.common_questions));
|
setEditCommonQuestions(normalizeAgentQuestions(agentDetail.common_questions));
|
||||||
// 列表响应不带 config 额外字段（seat_skill_directive 为 null），详情才有真值。
|
|
||||||
setEditSeatSkillDirective(agentDetail.seat_skill_directive ?? false);
|
|
||||||
} else {
|
} else {
|
||||||
setEditSoul(agent.soul ?? "");
|
setEditSoul(agent.soul ?? "");
|
||||||
}
|
}
|
||||||
@@ -405,8 +386,6 @@ export function AgentCard({ agent, layout = "card", onPublisherClick }: AgentCar
|
|||||||
request.skills = selectedSkills;
|
request.skills = selectedSkills;
|
||||||
if (JSON.stringify(nextQuestions) !== JSON.stringify(baselineQuestions))
|
if (JSON.stringify(nextQuestions) !== JSON.stringify(baselineQuestions))
|
||||||
request.common_questions = nextQuestions;
|
request.common_questions = nextQuestions;
|
||||||
if (editSeatSkillDirective !== ((agentDetail?.seat_skill_directive ?? agent.seat_skill_directive) ?? false))
|
|
||||||
request.seat_skill_directive = editSeatSkillDirective;
|
|
||||||
|
|
||||||
if (Object.keys(request).length === 0) {
|
if (Object.keys(request).length === 0) {
|
||||||
setEditOpen(false);
|
setEditOpen(false);
|
||||||
@@ -435,38 +414,18 @@ export function AgentCard({ agent, layout = "card", onPublisherClick }: AgentCar
|
|||||||
setPublishPickerOpen(true);
|
setPublishPickerOpen(true);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
if (!warnIfAccountSwitched()) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
try {
|
try {
|
||||||
await updateAgent.mutateAsync({
|
await updateAgent.mutateAsync({
|
||||||
id: agent.id,
|
id: agent.id,
|
||||||
request: { published: !agent.published },
|
request: { published: !agent.published },
|
||||||
});
|
});
|
||||||
toast.success(
|
toast.success(agent.published ? "已取消发布" : "已发布");
|
||||||
agent.published ? "已取消发布" : `已发布（操作账号：${live.displayName}）`,
|
|
||||||
);
|
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
toast.error(err instanceof Error ? err.message : String(err));
|
toast.error(err instanceof Error ? err.message : String(err));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// 发布操作以实时 token 执行。若会话中途账号被切换（常见于另一标签页登录了别的
|
|
||||||
// 账号），先弹一次确认 —— 避免误以本人之外的账号执行发布。返回 false = 用户取消。
|
|
||||||
function warnIfAccountSwitched(): boolean {
|
|
||||||
if (!live.switched) {
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
return window.confirm(
|
|
||||||
`当前登录账号已从「${live.mountDisplayName}」切换为「${live.displayName}」。\n` +
|
|
||||||
`本次发布将以「${live.displayName}」执行。如需以「${live.mountDisplayName}」操作，请取消并刷新页面。\n\n仍要继续吗？`,
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
async function handlePublishToSquare(squareId: string) {
|
async function handlePublishToSquare(squareId: string) {
|
||||||
if (!warnIfAccountSwitched()) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
try {
|
try {
|
||||||
await updateAgent.mutateAsync({
|
await updateAgent.mutateAsync({
|
||||||
id: agent.id,
|
id: agent.id,
|
||||||
@@ -474,7 +433,7 @@ export function AgentCard({ agent, layout = "card", onPublisherClick }: AgentCar
|
|||||||
});
|
});
|
||||||
const sqName =
|
const sqName =
|
||||||
publishSquares?.squares.find((s) => s.id === squareId)?.name ?? "广场";
|
publishSquares?.squares.find((s) => s.id === squareId)?.name ?? "广场";
|
||||||
toast.success(`已发布到「${sqName}」（操作账号：${live.displayName}）`);
|
toast.success(`已发布到「${sqName}」`);
|
||||||
setPublishPickerOpen(false);
|
setPublishPickerOpen(false);
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
toast.error(err instanceof Error ? err.message : String(err));
|
toast.error(err instanceof Error ? err.message : String(err));
|
||||||
@@ -556,10 +515,10 @@ export function AgentCard({ agent, layout = "card", onPublisherClick }: AgentCar
|
|||||||
内置
|
内置
|
||||||
</Badge>
|
</Badge>
|
||||||
)}
|
)}
|
||||||
{isOwned && (
|
{isOwned && (
|
||||||
<Badge
|
<Badge
|
||||||
variant="default"
|
variant="default"
|
||||||
className="border border-emerald-200 bg-emerald-50 text-xs text-emerald-700 hover:bg-emerald-50 dark:border-emerald-800 dark:bg-emerald-500/15 dark:text-emerald-300"
|
className="bg-emerald-500/15 text-emerald-700 hover:bg-emerald-500/15 dark:text-emerald-300 text-xs"
|
||||||
>
|
>
|
||||||
我的
|
我的
|
||||||
</Badge>
|
</Badge>
|
||||||
@@ -567,7 +526,7 @@ export function AgentCard({ agent, layout = "card", onPublisherClick }: AgentCar
|
|||||||
{isFromOthers && (
|
{isFromOthers && (
|
||||||
<Badge
|
<Badge
|
||||||
variant="outline"
|
variant="outline"
|
||||||
className="border-blue-200 bg-blue-50/60 text-xs text-blue-700 dark:border-blue-800 dark:bg-blue-500/10 dark:text-blue-300"
|
className="border-blue-500/30 text-blue-700 dark:text-blue-300 text-xs"
|
||||||
title={agent.user_id ? `来自用户 ${agent.user_id}` : "已发布"}
|
title={agent.user_id ? `来自用户 ${agent.user_id}` : "已发布"}
|
||||||
>
|
>
|
||||||
来自他人
|
来自他人
|
||||||
@@ -576,7 +535,7 @@ export function AgentCard({ agent, layout = "card", onPublisherClick }: AgentCar
|
|||||||
{(isOwned || isAdmin) && !isBuiltin && agent.published && !agent.is_private && (
|
{(isOwned || isAdmin) && !isBuiltin && agent.published && !agent.is_private && (
|
||||||
<Badge
|
<Badge
|
||||||
variant="outline"
|
variant="outline"
|
||||||
className="border-sky-200 bg-sky-50/60 text-xs text-sky-700 dark:border-sky-800 dark:bg-sky-500/10 dark:text-sky-300"
|
className="border-sky-500/30 text-sky-700 dark:text-sky-300 text-xs"
|
||||||
title="该智能体已对所有用户可见"
|
title="该智能体已对所有用户可见"
|
||||||
>
|
>
|
||||||
<GlobeIcon className="size-3" />
|
<GlobeIcon className="size-3" />
|
||||||
@@ -671,12 +630,8 @@ export function AgentCard({ agent, layout = "card", onPublisherClick }: AgentCar
|
|||||||
const skillBadgeItems = [
|
const skillBadgeItems = [
|
||||||
...(agent.tool_groups ?? []).map((group) => ({
|
...(agent.tool_groups ?? []).map((group) => ({
|
||||||
key: `tg:${group}`,
|
key: `tg:${group}`,
|
||||||
node: (
|
node: (
|
||||||
<Badge
|
<Badge key={`tg:${group}`} variant="outline" className="text-xs">
|
||||||
key={`tg:${group}`}
|
|
||||||
variant="outline"
|
|
||||||
className="border-0 bg-[#f1f5ff] px-2.5 py-1 text-xs font-normal text-[#2166e8] hover:bg-[#e9f0ff]"
|
|
||||||
>
|
|
||||||
{desensitize(group)}
|
{desensitize(group)}
|
||||||
</Badge>
|
</Badge>
|
||||||
),
|
),
|
||||||
@@ -686,8 +641,8 @@ export function AgentCard({ agent, layout = "card", onPublisherClick }: AgentCar
|
|||||||
node: (
|
node: (
|
||||||
<Badge
|
<Badge
|
||||||
key={`sk:${skill}`}
|
key={`sk:${skill}`}
|
||||||
variant="secondary"
|
variant="secondary"
|
||||||
className="cursor-pointer border-0 bg-[#f1f5ff] px-2.5 py-1 text-xs font-normal text-[#2166e8] hover:bg-[#e9f0ff]"
|
className="hover:bg-secondary/70 cursor-pointer text-xs"
|
||||||
title={t.settings.skills.viewDetailAction}
|
title={t.settings.skills.viewDetailAction}
|
||||||
onClick={(e) => {
|
onClick={(e) => {
|
||||||
e.stopPropagation();
|
e.stopPropagation();
|
||||||
@@ -835,181 +790,80 @@ export function AgentCard({ agent, layout = "card", onPublisherClick }: AgentCar
|
|||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
|
|
||||||
const chatButton = (
|
const chatButton = (
|
||||||
<Button
|
<Button
|
||||||
variant={isList ? "default" : "outline"}
|
size="sm"
|
||||||
size="sm"
|
className={cn(isList ? "shrink-0" : "w-full")}
|
||||||
className={cn(
|
onClick={handleChat}
|
||||||
isList
|
|
||||||
? "shrink-0 rounded-xl bg-[#1f63e9] px-4 font-medium text-white hover:bg-[#1857d4]"
|
|
||||||
: "h-11 w-full rounded-lg border-[#b9d1ff] bg-white font-medium text-[#135ee8] shadow-none hover:border-[#79a8ff] hover:bg-[#f7faff] hover:text-[#135ee8] dark:border-blue-700 dark:bg-slate-900 dark:text-blue-300",
|
|
||||||
)}
|
|
||||||
onClick={handleChat}
|
|
||||||
>
|
>
|
||||||
<MessageSquareIcon className="mr-1.5 h-3.5 w-3.5" />
|
<MessageSquareIcon className="mr-1.5 h-3.5 w-3.5" />
|
||||||
开始对话
|
{t.agents.chat}
|
||||||
</Button>
|
</Button>
|
||||||
);
|
);
|
||||||
|
|
||||||
const cardStatusBadge = agent.is_private ? (
|
|
||||||
<Badge className="border-0 bg-purple-50 px-2.5 py-1 text-xs font-normal text-purple-600 hover:bg-purple-50 dark:bg-purple-500/15 dark:text-purple-300">
|
|
||||||
<span className="mr-1.5 size-1.5 rounded-full bg-purple-500" />
|
|
||||||
私密
|
|
||||||
</Badge>
|
|
||||||
) : agent.published || isBuiltin ? (
|
|
||||||
<Badge className="border-0 bg-blue-50 px-2.5 py-1 text-xs font-normal text-blue-600 hover:bg-blue-50 dark:bg-blue-500/15 dark:text-blue-300">
|
|
||||||
<span className="mr-1.5 size-1.5 rounded-full bg-blue-500" />
|
|
||||||
已发布
|
|
||||||
</Badge>
|
|
||||||
) : (
|
|
||||||
<Badge className="border-0 bg-emerald-50 px-2.5 py-1 text-xs font-normal text-emerald-600 hover:bg-emerald-50 dark:bg-emerald-500/15 dark:text-emerald-300">
|
|
||||||
<span className="mr-1.5 size-1.5 rounded-full bg-emerald-500" />
|
|
||||||
运行中
|
|
||||||
</Badge>
|
|
||||||
);
|
|
||||||
|
|
||||||
const updatedAtText = formatDateTime(agent.updated_at ?? agent.created_at);
|
|
||||||
const cardActionsMenu = (
|
|
||||||
<DropdownMenu>
|
|
||||||
<DropdownMenuTrigger asChild>
|
|
||||||
<Button
|
|
||||||
size="icon"
|
|
||||||
variant="ghost"
|
|
||||||
className="size-8 rounded-lg text-slate-500 hover:bg-slate-100 hover:text-slate-900 dark:hover:bg-slate-800 dark:hover:text-white"
|
|
||||||
title="更多操作"
|
|
||||||
>
|
|
||||||
<MoreHorizontalIcon className="size-5" />
|
|
||||||
</Button>
|
|
||||||
</DropdownMenuTrigger>
|
|
||||||
<DropdownMenuContent align="end" className="w-44">
|
|
||||||
{canFavorite && (
|
|
||||||
<DropdownMenuItem onSelect={() => void handleToggleFavorite()}>
|
|
||||||
<StarIcon className={cn("size-4", isFavorite && "fill-current text-amber-500")} />
|
|
||||||
{isFavorite ? "取消收藏" : "收藏到我的"}
|
|
||||||
</DropdownMenuItem>
|
|
||||||
)}
|
|
||||||
<DropdownMenuItem onSelect={() => void handleTogglePin()}>
|
|
||||||
<PinIcon className={cn("size-4", isPinned && "fill-current text-emerald-600")} />
|
|
||||||
{isPinned ? "取消置顶" : "置顶"}
|
|
||||||
</DropdownMenuItem>
|
|
||||||
{isAdmin && (
|
|
||||||
<DropdownMenuItem onSelect={() => void handleToggleFeatured()}>
|
|
||||||
<SparklesIcon className="size-4" />
|
|
||||||
{agent.featured_order != null ? "取消推荐" : "设为推荐"}
|
|
||||||
</DropdownMenuItem>
|
|
||||||
)}
|
|
||||||
<DropdownMenuItem onSelect={() => setTagPickerOpen(true)}>
|
|
||||||
<TagsIcon className="size-4" />
|
|
||||||
{t.adminTags.manageTags}
|
|
||||||
</DropdownMenuItem>
|
|
||||||
{isOwned && (
|
|
||||||
<DropdownMenuItem onSelect={() => void handleTogglePublished()}>
|
|
||||||
{agent.published ? <LockIcon className="size-4" /> : <GlobeIcon className="size-4" />}
|
|
||||||
{agent.published ? "取消发布" : "发布"}
|
|
||||||
</DropdownMenuItem>
|
|
||||||
)}
|
|
||||||
{(isOwned || isAdmin) && (
|
|
||||||
<DropdownMenuItem onSelect={() => void handleTogglePrivate()}>
|
|
||||||
<ShieldIcon className="size-4" />
|
|
||||||
{agent.is_private ? "移出私密广场" : "放入私密广场"}
|
|
||||||
</DropdownMenuItem>
|
|
||||||
)}
|
|
||||||
<DropdownMenuSeparator />
|
|
||||||
<DropdownMenuItem onSelect={() => void handleDuplicate()}>
|
|
||||||
<CopyIcon className="size-4" />
|
|
||||||
复制智能体
|
|
||||||
</DropdownMenuItem>
|
|
||||||
{canEdit && (
|
|
||||||
<DropdownMenuItem onSelect={() => setEditOpen(true)}>
|
|
||||||
<SquarePenIcon className="size-4" />
|
|
||||||
编辑智能体
|
|
||||||
</DropdownMenuItem>
|
|
||||||
)}
|
|
||||||
{canDelete && (
|
|
||||||
<>
|
|
||||||
<DropdownMenuSeparator />
|
|
||||||
<DropdownMenuItem
|
|
||||||
className="text-destructive focus:text-destructive"
|
|
||||||
onSelect={() => setDeleteOpen(true)}
|
|
||||||
>
|
|
||||||
<Trash2Icon className="size-4" />
|
|
||||||
{t.agents.delete}
|
|
||||||
</DropdownMenuItem>
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
</DropdownMenuContent>
|
|
||||||
</DropdownMenu>
|
|
||||||
);
|
|
||||||
|
|
||||||
const cardLayout = (
|
const cardLayout = (
|
||||||
<Card
|
<Card className="group flex min-w-0 flex-col transition-shadow hover:shadow-md">
|
||||||
className={cn(
|
<CardHeader className="min-w-0 pb-2">
|
||||||
"group flex min-h-[366px] min-w-0 flex-col gap-0 overflow-hidden rounded-2xl border-slate-200/90 bg-white py-0 shadow-[0_5px_18px_rgba(15,23,42,0.035)] transition-[background-color,border-color,box-shadow] duration-200 hover:!border-[#b8d1ff] hover:!bg-[linear-gradient(135deg,rgba(239,246,255,0.92)_0%,rgba(255,255,255,0.98)_48%,#fff_100%)] hover:!ring-1 hover:!ring-[#e2edff] hover:shadow-[0_8px_24px_rgba(37,99,235,0.07)] dark:border-slate-800 dark:bg-slate-900",
|
<div className="flex min-w-0 items-start justify-between gap-2">
|
||||||
agent.featured_order != null && "border-blue-300 ring-1 ring-blue-100 dark:border-blue-700 dark:ring-blue-900/40",
|
<div className="flex min-w-0 flex-1 items-center gap-2 overflow-hidden">
|
||||||
)}
|
<div className="bg-primary/10 text-primary flex h-9 w-9 shrink-0 items-center justify-center rounded-lg">
|
||||||
>
|
<BotIcon className="h-5 w-5" />
|
||||||
<CardHeader className="min-w-0 gap-0 px-5 pt-5 pb-2">
|
</div>
|
||||||
{agent.featured_order != null ? (
|
<div className="min-w-0 flex-1 overflow-hidden">
|
||||||
<>
|
<CardTitle
|
||||||
<div className="mb-1 flex h-7 items-center justify-between">
|
className="block w-full min-w-0 overflow-hidden text-base text-ellipsis whitespace-nowrap"
|
||||||
<Badge className="border border-blue-200 bg-blue-50 px-2.5 py-1 text-xs font-medium text-blue-600 hover:bg-blue-50 dark:border-blue-800 dark:bg-blue-500/15 dark:text-blue-300">
|
title={desensitize(agent.name)}
|
||||||
<SparklesIcon className="mr-1 size-3.5 fill-current" />
|
>
|
||||||
推荐
|
{desensitize(agent.name)}
|
||||||
</Badge>
|
</CardTitle>
|
||||||
{cardActionsMenu}
|
{agent.model && (
|
||||||
</div>
|
<Badge variant="secondary" className="mt-0.5 text-xs">
|
||||||
<AgentBrandIcon size="lg" />
|
{desensitize(agent.model)}
|
||||||
</>
|
</Badge>
|
||||||
) : (
|
)}
|
||||||
<div className="flex items-start justify-between">
|
</div>
|
||||||
<AgentBrandIcon size="lg" />
|
</div>
|
||||||
{cardActionsMenu}
|
<div className="flex shrink-0 flex-wrap items-center justify-end gap-1">
|
||||||
</div>
|
{statusBadges}
|
||||||
)}
|
</div>
|
||||||
<CardTitle
|
</div>
|
||||||
className="mt-3 block w-full min-w-0 overflow-hidden text-[18px] leading-6 font-semibold tracking-[-0.015em] text-ellipsis whitespace-nowrap text-slate-950 dark:text-white"
|
{agent.description && (
|
||||||
title={desensitize(agent.name)}
|
<CardDescription className="mt-2 line-clamp-2 text-sm">
|
||||||
>
|
{desensitize(agent.description)}
|
||||||
{desensitize(agent.name)}
|
</CardDescription>
|
||||||
</CardTitle>
|
)}
|
||||||
{agent.description && (
|
{publisherNode && <div className="mt-2">{publisherNode}</div>}
|
||||||
<CardDescription className="mt-1.5 min-h-11 line-clamp-2 text-[14px] leading-[22px] text-slate-600 dark:text-slate-400">
|
{createdAtNode && <div className="mt-1">{createdAtNode}</div>}
|
||||||
{desensitize(agent.description)}
|
</CardHeader>
|
||||||
</CardDescription>
|
|
||||||
)}
|
{(agent.tags?.length ?? 0) > 0 && (
|
||||||
</CardHeader>
|
<CardContent className="pt-0 pb-2">
|
||||||
|
<TagChipList tags={agent.tags!} />
|
||||||
{(agent.tags?.length ?? 0) > 0 && (
|
|
||||||
<CardContent className="px-5 pt-0 pb-1.5">
|
|
||||||
<TagChipList tags={agent.tags!} />
|
|
||||||
</CardContent>
|
</CardContent>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{hasSkillsOrTools && (
|
{hasSkillsOrTools && (
|
||||||
<CardContent className="px-5 pt-0 pb-2">
|
<CardContent className="pt-0 pb-2">
|
||||||
<ClampedBadgeRow items={skillBadgeItems} />
|
<ClampedBadgeRow items={skillBadgeItems} />
|
||||||
</CardContent>
|
</CardContent>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
<CardFooter className="mt-auto flex flex-col items-stretch gap-10 px-5 pt-2 pb-4">
|
<CardFooter className="mt-auto flex flex-col items-stretch gap-2 pt-2">
|
||||||
<div className="flex min-w-0 items-center gap-3">
|
{showActionRow && (
|
||||||
{cardStatusBadge}
|
<div className="flex flex-wrap items-center justify-end gap-1">
|
||||||
<span
|
{actionButtons}
|
||||||
className="min-w-0 truncate text-xs text-slate-400"
|
</div>
|
||||||
title={updatedAtText ? `更新于 ${updatedAtText}` : undefined}
|
)}
|
||||||
>
|
{chatButton}
|
||||||
{updatedAtText ? `更新于 ${updatedAtText}` : "最近更新"}
|
</CardFooter>
|
||||||
{publisherLabel ? ` · 由 ${publisherLabel} 更新` : isBuiltin ? " · 由系统更新" : ""}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
{chatButton}
|
|
||||||
</CardFooter>
|
|
||||||
</Card>
|
</Card>
|
||||||
);
|
);
|
||||||
|
|
||||||
const listLayout = (
|
const listLayout = (
|
||||||
<div className="group flex min-w-0 items-center gap-4 rounded-2xl border border-slate-200/90 bg-white p-4 shadow-[0_8px_24px_rgba(15,23,42,0.04)] transition-all hover:border-blue-200 hover:shadow-[0_12px_32px_rgba(37,99,235,0.09)] dark:border-slate-800 dark:bg-slate-900">
|
<div className="group flex min-w-0 items-center gap-3 rounded-lg border p-2.5 transition-shadow hover:shadow-sm dark:border-[#213D5E] dark:bg-[#02244C]">
|
||||||
<AgentBrandIcon className="agent-avatar" size="md" />
|
<div className="bg-primary/10 text-primary flex h-9 w-9 shrink-0 items-center justify-center rounded-lg">
|
||||||
|
<BotIcon className="h-5 w-5" />
|
||||||
|
</div>
|
||||||
<div className="min-w-0 flex-1 overflow-hidden">
|
<div className="min-w-0 flex-1 overflow-hidden">
|
||||||
<div className="flex min-w-0 items-center gap-2">
|
<div className="flex min-w-0 items-center gap-2">
|
||||||
<span
|
<span
|
||||||
@@ -1093,7 +947,7 @@ export function AgentCard({ agent, layout = "card", onPublisherClick }: AgentCar
|
|||||||
? "正在加载 SOUL.md..."
|
? "正在加载 SOUL.md..."
|
||||||
: "输入 SOUL.md 内容"
|
: "输入 SOUL.md 内容"
|
||||||
}
|
}
|
||||||
className="max-h-[45vh] min-h-48 resize-y text-xs"
|
className="max-h-[45vh] min-h-48 resize-y font-mono text-xs"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div className="space-y-2">
|
<div className="space-y-2">
|
||||||
@@ -1106,19 +960,6 @@ export function AgentCard({ agent, layout = "card", onPublisherClick }: AgentCar
|
|||||||
onChange={setEditCommonQuestions}
|
onChange={setEditCommonQuestions}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div className="flex items-center justify-between gap-3 rounded-md border p-3">
|
|
||||||
<div>
|
|
||||||
<p className="text-sm font-medium">会商技能识别强化</p>
|
|
||||||
<p className="text-muted-foreground text-xs">
|
|
||||||
作为会商席位时，把已配置技能（含 SKILL.md 路径与「先 read_file
|
|
||||||
再用」硬指令）拼进任务，补偿弱模型不识别技能。也可在业务链条配置里打开（任一即生效）。
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<Switch
|
|
||||||
checked={editSeatSkillDirective}
|
|
||||||
onCheckedChange={setEditSeatSkillDirective}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div className="flex items-center justify-between rounded-md border p-3">
|
<div className="flex items-center justify-between rounded-md border p-3">
|
||||||
<div>
|
<div>
|
||||||
<p className="text-sm font-medium">公开发布</p>
|
<p className="text-sm font-medium">公开发布</p>
|
||||||
@@ -1253,23 +1094,6 @@ export function AgentCard({ agent, layout = "card", onPublisherClick }: AgentCar
|
|||||||
loading={updateAgent.isPending}
|
loading={updateAgent.isPending}
|
||||||
onConfirm={(squareId) => void handlePublishToSquare(squareId)}
|
onConfirm={(squareId) => void handlePublishToSquare(squareId)}
|
||||||
description="请选择要把该智能体发布到哪个广场。每个智能体只能归属一个广场，不会重复出现。"
|
description="请选择要把该智能体发布到哪个广场。每个智能体只能归属一个广场，不会重复出现。"
|
||||||
accountNotice={
|
|
||||||
<div className="text-xs">
|
|
||||||
<p className="text-muted-foreground">
|
|
||||||
发布操作账号：
|
|
||||||
<span className="text-foreground font-medium">
|
|
||||||
「{live.displayName}」
|
|
||||||
</span>
|
|
||||||
</p>
|
|
||||||
{live.switched && (
|
|
||||||
<p className="text-destructive mt-1">
|
|
||||||
⚠ 当前登录账号已从「{live.mountDisplayName}」切换为「
|
|
||||||
{live.displayName}」。如需以「{live.mountDisplayName}
|
|
||||||
」操作，请刷新页面确认。
|
|
||||||
</p>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
/>
|
/>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -1,664 +0,0 @@
|
|||||||
"use client";
|
|
||||||
|
|
||||||
import {
|
|
||||||
Bot,
|
|
||||||
ChevronDown,
|
|
||||||
Download,
|
|
||||||
FileJson,
|
|
||||||
FileText,
|
|
||||||
Loader2,
|
|
||||||
MessageSquare,
|
|
||||||
MoreHorizontal,
|
|
||||||
Pencil,
|
|
||||||
Pin,
|
|
||||||
PinOff,
|
|
||||||
Search,
|
|
||||||
Share2,
|
|
||||||
Star,
|
|
||||||
Trash2,
|
|
||||||
X,
|
|
||||||
} from "lucide-react";
|
|
||||||
import Link from "next/link";
|
|
||||||
import { useParams, usePathname, useRouter } from "next/navigation";
|
|
||||||
import { useCallback, useEffect, useMemo, useState } from "react";
|
|
||||||
import { toast } from "sonner";
|
|
||||||
|
|
||||||
import { agentColor } from "@/components/workspace/agent-icon-color";
|
|
||||||
import { Button } from "@/components/ui/button";
|
|
||||||
import {
|
|
||||||
Dialog,
|
|
||||||
DialogContent,
|
|
||||||
DialogFooter,
|
|
||||||
DialogHeader,
|
|
||||||
DialogTitle,
|
|
||||||
} from "@/components/ui/dialog";
|
|
||||||
import {
|
|
||||||
DropdownMenu,
|
|
||||||
DropdownMenuContent,
|
|
||||||
DropdownMenuItem,
|
|
||||||
DropdownMenuSeparator,
|
|
||||||
DropdownMenuSub,
|
|
||||||
DropdownMenuSubContent,
|
|
||||||
DropdownMenuSubTrigger,
|
|
||||||
DropdownMenuTrigger,
|
|
||||||
} from "@/components/ui/dropdown-menu";
|
|
||||||
import { Input } from "@/components/ui/input";
|
|
||||||
import {
|
|
||||||
Select,
|
|
||||||
SelectContent,
|
|
||||||
SelectItem,
|
|
||||||
SelectTrigger,
|
|
||||||
SelectValue,
|
|
||||||
} from "@/components/ui/select";
|
|
||||||
import { ShareConversationDialog } from "@/components/workspace/thread-share-dialogs";
|
|
||||||
import { useTheme } from "@/contexts/ThemeContext";
|
|
||||||
import { useAgentsPaginated } from "@/core/agents";
|
|
||||||
import { getAPIClient } from "@/core/api";
|
|
||||||
import { useI18n } from "@/core/i18n/hooks";
|
|
||||||
import { useRouteBase } from "@/core/route-base";
|
|
||||||
import { usePublishSquares } from "@/core/system-settings/hooks";
|
|
||||||
import {
|
|
||||||
exportThreadAsJSON,
|
|
||||||
exportThreadAsMarkdown,
|
|
||||||
} from "@/core/threads/export";
|
|
||||||
import {
|
|
||||||
useDeleteThread,
|
|
||||||
useRenameThread,
|
|
||||||
useThreads,
|
|
||||||
useToggleThreadFavorite,
|
|
||||||
useToggleThreadPin,
|
|
||||||
} from "@/core/threads/hooks";
|
|
||||||
import type { AgentThread, AgentThreadState } from "@/core/threads/types";
|
|
||||||
import {
|
|
||||||
bootstrapResumePath,
|
|
||||||
isBootstrapThread,
|
|
||||||
isThreadFavorite,
|
|
||||||
isThreadPinned,
|
|
||||||
sortThreadsPinnedFirst,
|
|
||||||
titleOfThread,
|
|
||||||
usePathOfThread,
|
|
||||||
} from "@/core/threads/utils";
|
|
||||||
import { env } from "@/env";
|
|
||||||
import { desensitize } from "@/lib/desensitize";
|
|
||||||
import { isIMEComposing } from "@/lib/ime";
|
|
||||||
import { cn } from "@/lib/utils";
|
|
||||||
|
|
||||||
/** 「我的」作用域的下拉选项值；其余选项值为各发布广场（publish square）的 id。 */
|
|
||||||
const MINE_SCOPE = "mine";
|
|
||||||
|
|
||||||
// 列表一次拉取的条数。超出时底部出现「查看全部」入口，跳到完整的智能体管理页，
|
|
||||||
// 避免静默截断。侧边栏只做快速切换，不在此分页。
|
|
||||||
const LIST_PAGE_SIZE = 50;
|
|
||||||
|
|
||||||
// 「最近的对话」未搜索时最多展示条数（与首页「通用问答」左栏一致）。
|
|
||||||
const MAX_RECENT_CHATS = 10;
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 智能体问答页左侧「智能体列表 + 最近对话」栏（参考首页通用问答左栏）。
|
|
||||||
*
|
|
||||||
* 自上而下：
|
|
||||||
* 1. 顶部下拉：选「我的」（默认，= 我创建/收藏的）或任一「广场」（发布广场），
|
|
||||||
* 与「智能体管理」页主标签一致；下方为智能体名称模糊搜索框。
|
|
||||||
* 2. 智能体列表：所选作用域下的智能体；点击进入该智能体的新对话。当前智能体高亮。
|
|
||||||
* 3. 最近的对话：跨智能体的近期会话（参考首页），点击打开；支持重命名/置顶/收藏/
|
|
||||||
* 分享/导出/删除。当前会话高亮。
|
|
||||||
*
|
|
||||||
* 仅在独立的智能体问答整页展示；任务工作区 / zzJC·zzXD 模块 / 嵌入态不展示。
|
|
||||||
*/
|
|
||||||
export function AgentChatSidebar({ activeAgentId }: { activeAgentId?: string }) {
|
|
||||||
const { t } = useI18n();
|
|
||||||
const routeBase = useRouteBase();
|
|
||||||
const { theme } = useTheme();
|
|
||||||
const isDark = theme === "dark";
|
|
||||||
|
|
||||||
const { data: publishSquares } = usePublishSquares();
|
|
||||||
// 每个发布广场对应一个下拉选项；后端至少返回一个内置默认广场。
|
|
||||||
const squares = useMemo(
|
|
||||||
() => publishSquares?.squares ?? [],
|
|
||||||
[publishSquares?.squares],
|
|
||||||
);
|
|
||||||
|
|
||||||
// 作用域：MINE_SCOPE 或某个广场 id。默认「我的」。
|
|
||||||
const [scope, setScope] = useState<string>(MINE_SCOPE);
|
|
||||||
|
|
||||||
// 模糊搜索智能体名称：防抖 300ms 后走服务端 search（后端按原始名 / 脱敏名匹配），
|
|
||||||
// 在当前来源（我的 / 某广场）内过滤，能搜全量而非仅当前 50 条。
|
|
||||||
const [searchInput, setSearchInput] = useState("");
|
|
||||||
const [search, setSearch] = useState("");
|
|
||||||
useEffect(() => {
|
|
||||||
const timer = setTimeout(() => setSearch(searchInput.trim()), 300);
|
|
||||||
return () => clearTimeout(timer);
|
|
||||||
}, [searchInput]);
|
|
||||||
|
|
||||||
// 「智能体」区可收起（持久化）；收起后只留标题栏，下方「最近的对话」占满剩余空间。
|
|
||||||
const [agentsCollapsed, setAgentsCollapsed] = useState(
|
|
||||||
() =>
|
|
||||||
typeof window !== "undefined" &&
|
|
||||||
localStorage.getItem("agent-chat-sidebar:agents-collapsed") === "true",
|
|
||||||
);
|
|
||||||
const toggleAgents = () =>
|
|
||||||
setAgentsCollapsed((v) => {
|
|
||||||
localStorage.setItem("agent-chat-sidebar:agents-collapsed", String(!v));
|
|
||||||
return !v;
|
|
||||||
});
|
|
||||||
|
|
||||||
// 若所选广场被管理员删除，回退到「我的」，避免指向不存在的广场。
|
|
||||||
useEffect(() => {
|
|
||||||
if (
|
|
||||||
scope !== MINE_SCOPE &&
|
|
||||||
squares.length > 0 &&
|
|
||||||
!squares.some((sq) => sq.id === scope)
|
|
||||||
) {
|
|
||||||
setScope(MINE_SCOPE);
|
|
||||||
}
|
|
||||||
}, [scope, squares]);
|
|
||||||
|
|
||||||
const isMine = scope === MINE_SCOPE;
|
|
||||||
const { agents, total, isLoading, isFetching } = useAgentsPaginated({
|
|
||||||
scope: isMine ? "mine" : "square",
|
|
||||||
sort: "time_desc",
|
|
||||||
page: 1,
|
|
||||||
pageSize: LIST_PAGE_SIZE,
|
|
||||||
square: isMine ? undefined : scope,
|
|
||||||
search: search || undefined,
|
|
||||||
});
|
|
||||||
|
|
||||||
return (
|
|
||||||
// 配色与 AgentModuleSidebar 一致：浅色白底，深蓝主题半透明深蓝玻璃面板。
|
|
||||||
<aside className="flex h-full w-(--sidebar-width) shrink-0 flex-col overflow-hidden border-r border-border/70 bg-white text-foreground backdrop-blur-md dark:border-[#2b8ffe]/45 dark:bg-[#032650]/80">
|
|
||||||
{/* 智能体（上半，可收起）。展开时：标题栏 + 来源下拉/名称搜索 + 列表；
|
|
||||||
收起时只留标题栏，下方「最近的对话」占满剩余空间。 */}
|
|
||||||
<div
|
|
||||||
className={cn(
|
|
||||||
"flex flex-col",
|
|
||||||
agentsCollapsed ? "shrink-0" : "min-h-0 flex-[3]",
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
onClick={toggleAgents}
|
|
||||||
className="text-foreground/80 hover:bg-accent/40 flex shrink-0 items-center justify-between border-b border-border/60 px-3 py-2.5 text-[12px] font-semibold transition-colors select-none"
|
|
||||||
title={agentsCollapsed ? "展开智能体" : "收起智能体"}
|
|
||||||
>
|
|
||||||
<span>智能体</span>
|
|
||||||
<ChevronDown
|
|
||||||
className={cn(
|
|
||||||
"text-muted-foreground size-4 shrink-0 transition-transform duration-200",
|
|
||||||
agentsCollapsed && "-rotate-90",
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
</button>
|
|
||||||
|
|
||||||
{!agentsCollapsed && (
|
|
||||||
<>
|
|
||||||
{/* 来源下拉（我的 / 各广场）+ 智能体名称模糊搜索 */}
|
|
||||||
<div className="shrink-0 space-y-2 border-b border-border/60 px-3 py-2.5">
|
|
||||||
<Select value={scope} onValueChange={setScope}>
|
|
||||||
<SelectTrigger className="h-9 w-full text-sm" title="切换智能体来源">
|
|
||||||
<SelectValue />
|
|
||||||
</SelectTrigger>
|
|
||||||
<SelectContent position="popper" side="bottom" sideOffset={4}>
|
|
||||||
<SelectItem value={MINE_SCOPE}>我的</SelectItem>
|
|
||||||
{squares.map((sq) => (
|
|
||||||
<SelectItem key={sq.id} value={sq.id}>
|
|
||||||
{sq.name}
|
|
||||||
</SelectItem>
|
|
||||||
))}
|
|
||||||
</SelectContent>
|
|
||||||
</Select>
|
|
||||||
<div className="relative">
|
|
||||||
<Search className="text-muted-foreground pointer-events-none absolute top-1/2 left-2.5 size-3.5 -translate-y-1/2" />
|
|
||||||
<Input
|
|
||||||
value={searchInput}
|
|
||||||
onChange={(e) => setSearchInput(e.target.value)}
|
|
||||||
placeholder="搜索智能体名称"
|
|
||||||
className="h-9 pl-8 pr-8 text-sm"
|
|
||||||
aria-label="搜索智能体名称"
|
|
||||||
/>
|
|
||||||
{searchInput && (
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
onClick={() => setSearchInput("")}
|
|
||||||
className="text-muted-foreground hover:text-foreground absolute top-1/2 right-2 -translate-y-1/2"
|
|
||||||
title="清除"
|
|
||||||
aria-label="清除搜索"
|
|
||||||
>
|
|
||||||
<X className="size-3.5" />
|
|
||||||
</button>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* 智能体列表（独立滚动） */}
|
|
||||||
<div className="flex min-h-0 flex-1 flex-col overflow-y-auto px-2 py-3">
|
|
||||||
{isLoading && agents.length === 0 ? (
|
|
||||||
<div className="text-muted-foreground flex h-24 items-center justify-center gap-2 text-xs">
|
|
||||||
<Loader2 className="size-3.5 animate-spin" />
|
|
||||||
加载中…
|
|
||||||
</div>
|
|
||||||
) : agents.length === 0 ? (
|
|
||||||
<p className="px-3 py-1.5 text-xs text-muted-foreground/70">
|
|
||||||
{search
|
|
||||||
? "未找到匹配的智能体"
|
|
||||||
: isMine
|
|
||||||
? "暂无智能体"
|
|
||||||
: "该广场暂无智能体"}
|
|
||||||
</p>
|
|
||||||
) : (
|
|
||||||
<div
|
|
||||||
className={cn(
|
|
||||||
"flex flex-col gap-1 transition-opacity",
|
|
||||||
isFetching && "opacity-60",
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
{agents.map((agent) => {
|
|
||||||
const href = `${routeBase}/agents/${agent.id}/chats/new`;
|
|
||||||
const isActive = agent.id === activeAgentId;
|
|
||||||
const { from, to } = agentColor(agent.id, isDark);
|
|
||||||
return (
|
|
||||||
<Link
|
|
||||||
key={agent.id}
|
|
||||||
href={href}
|
|
||||||
className={cn(
|
|
||||||
"group relative flex w-full items-start gap-3 rounded-xl border px-3 py-2.5 transition-all duration-150",
|
|
||||||
isActive
|
|
||||||
? isDark
|
|
||||||
? "border-[#2b8ffe] bg-[#0b4fae]/65 shadow-[0_0_0_1px_rgba(43,143,254,0.5),0_12px_28px_rgba(37,128,255,0.25)]"
|
|
||||||
: "agent-sidebar-card--active border-primary/50 bg-primary/10 shadow-sm"
|
|
||||||
: isDark
|
|
||||||
? "border-[#2b8ffe]/20 bg-[#042b59]/35 hover:border-[#2b8ffe]/60 hover:bg-[#063b77]/60"
|
|
||||||
: "border-transparent hover:border-border hover:bg-accent/50",
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
<span
|
|
||||||
className={cn(
|
|
||||||
"mt-0.5 flex size-10 shrink-0 items-center justify-center rounded-lg text-white shadow-sm",
|
|
||||||
isDark &&
|
|
||||||
isActive &&
|
|
||||||
"ring-2 ring-[#83c1ff]/35 shadow-[0_0_18px_rgba(43,143,254,0.45)]",
|
|
||||||
)}
|
|
||||||
style={{
|
|
||||||
backgroundImage: `linear-gradient(135deg, ${from}, ${to})`,
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<Bot className="size-[19px]" />
|
|
||||||
</span>
|
|
||||||
<span className="min-w-0 flex-1">
|
|
||||||
<span
|
|
||||||
className={cn(
|
|
||||||
"block truncate text-[16px] leading-5 font-bold",
|
|
||||||
isActive
|
|
||||||
? isDark
|
|
||||||
? "text-white"
|
|
||||||
: "text-primary"
|
|
||||||
: isDark
|
|
||||||
? "text-white/95"
|
|
||||||
: "text-foreground",
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
{desensitize(agent.name)}
|
|
||||||
</span>
|
|
||||||
<span
|
|
||||||
className={cn(
|
|
||||||
"mt-1 block truncate text-[13px] leading-[1.35]",
|
|
||||||
isDark
|
|
||||||
? isActive
|
|
||||||
? "text-[#d6eaff]"
|
|
||||||
: "text-[#9ebfe2]"
|
|
||||||
: "text-muted-foreground",
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
{agent.description
|
|
||||||
? desensitize(agent.description)
|
|
||||||
: "智能体助手"}
|
|
||||||
</span>
|
|
||||||
</span>
|
|
||||||
{isActive && (
|
|
||||||
<span
|
|
||||||
className={cn(
|
|
||||||
"absolute top-1/2 right-1.5 h-8 w-1.5 -translate-y-1/2 rounded-full",
|
|
||||||
isDark
|
|
||||||
? "bg-[#2b8ffe] shadow-[0_0_14px_rgba(43,143,254,0.85)]"
|
|
||||||
: "bg-primary",
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
</Link>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
{/* 超出一页时引导到完整的智能体管理页（不在侧边栏静默截断） */}
|
|
||||||
{total > agents.length && (
|
|
||||||
<Link
|
|
||||||
href={`${routeBase}/agents`}
|
|
||||||
className="text-muted-foreground hover:text-foreground hover:bg-accent/50 mt-0.5 rounded-lg px-3 py-1.5 text-center text-xs transition-colors"
|
|
||||||
>
|
|
||||||
共 {total} 个，查看全部 →
|
|
||||||
</Link>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* 最近的对话（下半，独立滚动）—— 参考首页通用问答左栏 */}
|
|
||||||
<RecentChatsPane activeAgentId={activeAgentId} />
|
|
||||||
</aside>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 「最近的对话」面板（参考首页 GeneralQaSidebar 的「最近的对话」区块）。
|
|
||||||
* 跨智能体的近期会话，点击打开；支持重命名/置顶/收藏/分享/导出/删除。
|
|
||||||
*/
|
|
||||||
function RecentChatsPane({ activeAgentId }: { activeAgentId?: string }) {
|
|
||||||
const { t } = useI18n();
|
|
||||||
const pathname = usePathname();
|
|
||||||
const router = useRouter();
|
|
||||||
const pathOf = usePathOfThread();
|
|
||||||
|
|
||||||
const { thread_id: threadIdFromPath } = useParams<{ thread_id: string }>();
|
|
||||||
const { data: threads = [] } = useThreads();
|
|
||||||
const { mutate: deleteThread } = useDeleteThread();
|
|
||||||
const { mutate: renameThread } = useRenameThread();
|
|
||||||
const { toggle: togglePin } = useToggleThreadPin();
|
|
||||||
const { toggle: toggleFavorite } = useToggleThreadFavorite();
|
|
||||||
|
|
||||||
const [query, setQuery] = useState("");
|
|
||||||
const [renameDialogOpen, setRenameDialogOpen] = useState(false);
|
|
||||||
const [renameThreadId, setRenameThreadId] = useState<string | null>(null);
|
|
||||||
const [renameValue, setRenameValue] = useState("");
|
|
||||||
const [shareThreadId, setShareThreadId] = useState<string | null>(null);
|
|
||||||
|
|
||||||
// 排除调度/会商类系统会话，与首页一致；智能体创建（bootstrap）会话保留展示
|
|
||||||
// （带机器人图标、点击回创建页）；置顶优先。
|
|
||||||
const visibleThreads = useMemo(
|
|
||||||
() =>
|
|
||||||
sortThreadsPinnedFirst(
|
|
||||||
threads.filter(
|
|
||||||
(thread) =>
|
|
||||||
thread.metadata?.thread_type !== "scheduler" &&
|
|
||||||
thread.metadata?.thread_type !== "roundtable",
|
|
||||||
),
|
|
||||||
),
|
|
||||||
[threads],
|
|
||||||
);
|
|
||||||
|
|
||||||
const filteredThreads = useMemo(() => {
|
|
||||||
const q = query.trim().toLowerCase();
|
|
||||||
const list = q
|
|
||||||
? visibleThreads.filter((thread) =>
|
|
||||||
titleOfThread(thread, t.pages.newChat).toLowerCase().includes(q),
|
|
||||||
)
|
|
||||||
: visibleThreads;
|
|
||||||
return q ? list : list.slice(0, MAX_RECENT_CHATS);
|
|
||||||
}, [visibleThreads, query, t.pages.newChat]);
|
|
||||||
|
|
||||||
const handleDelete = useCallback(
|
|
||||||
(threadId: string) => {
|
|
||||||
deleteThread({ threadId });
|
|
||||||
if (threadId === threadIdFromPath) {
|
|
||||||
const threadIndex = threads.findIndex((th) => th.thread_id === threadId);
|
|
||||||
let nextThreadPath = pathOf("new", { agent_id: activeAgentId });
|
|
||||||
if (threadIndex > -1) {
|
|
||||||
if (threads[threadIndex + 1]) {
|
|
||||||
nextThreadPath = pathOf(threads[threadIndex + 1]!);
|
|
||||||
} else if (threads[threadIndex - 1]) {
|
|
||||||
nextThreadPath = pathOf(threads[threadIndex - 1]!);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
void router.push(nextThreadPath);
|
|
||||||
}
|
|
||||||
},
|
|
||||||
[activeAgentId, deleteThread, pathOf, router, threadIdFromPath, threads],
|
|
||||||
);
|
|
||||||
|
|
||||||
const handleRenameClick = useCallback(
|
|
||||||
(threadId: string, currentTitle: string) => {
|
|
||||||
setRenameThreadId(threadId);
|
|
||||||
setRenameValue(currentTitle);
|
|
||||||
setRenameDialogOpen(true);
|
|
||||||
},
|
|
||||||
[],
|
|
||||||
);
|
|
||||||
|
|
||||||
const handleRenameSubmit = useCallback(() => {
|
|
||||||
if (renameThreadId && renameValue.trim()) {
|
|
||||||
renameThread({ threadId: renameThreadId, title: renameValue.trim() });
|
|
||||||
setRenameDialogOpen(false);
|
|
||||||
setRenameThreadId(null);
|
|
||||||
setRenameValue("");
|
|
||||||
}
|
|
||||||
}, [renameThread, renameThreadId, renameValue]);
|
|
||||||
|
|
||||||
const handleExport = useCallback(
|
|
||||||
async (thread: AgentThread, format: "markdown" | "json") => {
|
|
||||||
try {
|
|
||||||
const apiClient = getAPIClient();
|
|
||||||
const state = await apiClient.threads.getState<AgentThreadState>(
|
|
||||||
thread.thread_id,
|
|
||||||
);
|
|
||||||
const messages = state.values?.messages ?? [];
|
|
||||||
if (messages.length === 0) {
|
|
||||||
toast.error(t.conversation.noMessages);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
if (format === "markdown") exportThreadAsMarkdown(thread, messages);
|
|
||||||
else exportThreadAsJSON(thread, messages);
|
|
||||||
toast.success(t.common.exportSuccess);
|
|
||||||
} catch {
|
|
||||||
toast.error("Failed to export conversation");
|
|
||||||
}
|
|
||||||
},
|
|
||||||
[t],
|
|
||||||
);
|
|
||||||
|
|
||||||
const isStatic = env.NEXT_PUBLIC_STATIC_WEBSITE_ONLY === "true";
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="flex min-h-0 flex-[2] flex-col overflow-y-auto border-t border-border/60 px-2 py-3">
|
|
||||||
<h2 className="mb-1 flex items-center gap-1.5 px-3 py-1 text-[11px] font-semibold tracking-[0.04em] text-muted-foreground/80 select-none">
|
|
||||||
<span>{t.sidebar.recentChats}</span>
|
|
||||||
<span className="rounded-full bg-muted px-1.5 py-0.5 text-[10px] font-normal text-muted-foreground tabular-nums">
|
|
||||||
{visibleThreads.length}
|
|
||||||
</span>
|
|
||||||
</h2>
|
|
||||||
|
|
||||||
{/* 历史会话搜索框 */}
|
|
||||||
<div className="relative mb-1.5 px-1">
|
|
||||||
<Search className="text-muted-foreground/60 pointer-events-none absolute top-1/2 left-3.5 size-3.5 -translate-y-1/2" />
|
|
||||||
<Input
|
|
||||||
value={query}
|
|
||||||
onChange={(e) => setQuery(e.target.value)}
|
|
||||||
placeholder="搜索历史会话…"
|
|
||||||
className="h-8 rounded-lg border-border bg-card pl-8 text-[12px]"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="flex flex-col gap-0.5">
|
|
||||||
{filteredThreads.length === 0 ? (
|
|
||||||
<div className="text-muted-foreground/70 px-3 py-4 text-center text-[12px]">
|
|
||||||
{query ? "没有匹配的会话" : t.chats.noChats}
|
|
||||||
</div>
|
|
||||||
) : (
|
|
||||||
filteredThreads.map((thread) => {
|
|
||||||
const isBoot = isBootstrapThread(thread);
|
|
||||||
const href = isBoot ? bootstrapResumePath(thread.thread_id) : pathOf(thread);
|
|
||||||
const isActive = href === pathname;
|
|
||||||
const pinned = isThreadPinned(thread);
|
|
||||||
const favorited = isThreadFavorite(thread);
|
|
||||||
return (
|
|
||||||
<div
|
|
||||||
key={thread.thread_id}
|
|
||||||
className="group/item relative flex items-center"
|
|
||||||
>
|
|
||||||
<Link
|
|
||||||
href={href}
|
|
||||||
className={cn(
|
|
||||||
"relative flex h-9 min-w-0 flex-1 items-center gap-2 rounded-lg px-2.5 text-[13px] transition-colors",
|
|
||||||
isActive
|
|
||||||
? "border border-primary/40 bg-primary/5 font-medium text-primary"
|
|
||||||
: "text-muted-foreground hover:bg-accent/60 hover:text-foreground",
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
{isBoot ? (
|
|
||||||
<Bot
|
|
||||||
className={cn(
|
|
||||||
"size-3.5 shrink-0",
|
|
||||||
isActive ? "text-primary" : "text-muted-foreground/70",
|
|
||||||
)}
|
|
||||||
aria-label="智能体创建会话"
|
|
||||||
/>
|
|
||||||
) : (
|
|
||||||
<MessageSquare
|
|
||||||
className={cn(
|
|
||||||
"size-3.5 shrink-0",
|
|
||||||
isActive ? "text-primary" : "text-muted-foreground/70",
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
{pinned && (
|
|
||||||
<Pin className="text-muted-foreground/70 size-3 shrink-0" />
|
|
||||||
)}
|
|
||||||
<span className="truncate">
|
|
||||||
{desensitize(titleOfThread(thread, t.pages.newChat))}
|
|
||||||
</span>
|
|
||||||
{isActive && (
|
|
||||||
<span className="absolute top-1/2 right-1 h-5 w-1 -translate-y-1/2 rounded-full bg-primary" />
|
|
||||||
)}
|
|
||||||
</Link>
|
|
||||||
{!isStatic && (
|
|
||||||
<DropdownMenu>
|
|
||||||
<DropdownMenuTrigger asChild>
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
className="text-muted-foreground hover:bg-background group-hover/item:opacity-100 data-[state=open]:opacity-100 absolute right-1 flex size-6 items-center justify-center rounded-md opacity-0 transition-opacity"
|
|
||||||
>
|
|
||||||
<MoreHorizontal className="size-4" />
|
|
||||||
<span className="sr-only">{t.common.more}</span>
|
|
||||||
</button>
|
|
||||||
</DropdownMenuTrigger>
|
|
||||||
<DropdownMenuContent
|
|
||||||
className="w-48 rounded-lg"
|
|
||||||
side="right"
|
|
||||||
align="start"
|
|
||||||
>
|
|
||||||
<DropdownMenuItem
|
|
||||||
onSelect={() =>
|
|
||||||
handleRenameClick(
|
|
||||||
thread.thread_id,
|
|
||||||
titleOfThread(thread, t.pages.newChat),
|
|
||||||
)
|
|
||||||
}
|
|
||||||
>
|
|
||||||
<Pencil className="text-muted-foreground" />
|
|
||||||
<span>{t.common.rename}</span>
|
|
||||||
</DropdownMenuItem>
|
|
||||||
<DropdownMenuItem
|
|
||||||
onSelect={() => togglePin(thread.thread_id, !pinned)}
|
|
||||||
>
|
|
||||||
{pinned ? (
|
|
||||||
<PinOff className="text-muted-foreground" />
|
|
||||||
) : (
|
|
||||||
<Pin className="text-muted-foreground" />
|
|
||||||
)}
|
|
||||||
<span>{pinned ? t.common.unpin : t.common.pin}</span>
|
|
||||||
</DropdownMenuItem>
|
|
||||||
<DropdownMenuItem
|
|
||||||
onSelect={() =>
|
|
||||||
toggleFavorite(thread.thread_id, !favorited)
|
|
||||||
}
|
|
||||||
>
|
|
||||||
<Star
|
|
||||||
className={
|
|
||||||
favorited
|
|
||||||
? "fill-amber-400 text-amber-400"
|
|
||||||
: "text-muted-foreground"
|
|
||||||
}
|
|
||||||
/>
|
|
||||||
<span>
|
|
||||||
{favorited ? t.common.unfavorite : t.common.favorite}
|
|
||||||
</span>
|
|
||||||
</DropdownMenuItem>
|
|
||||||
<DropdownMenuItem
|
|
||||||
onSelect={() => setShareThreadId(thread.thread_id)}
|
|
||||||
>
|
|
||||||
<Share2 className="text-muted-foreground" />
|
|
||||||
<span>{t.common.share}</span>
|
|
||||||
</DropdownMenuItem>
|
|
||||||
<DropdownMenuSub>
|
|
||||||
<DropdownMenuSubTrigger>
|
|
||||||
<Download className="text-muted-foreground" />
|
|
||||||
<span>{t.common.export}</span>
|
|
||||||
</DropdownMenuSubTrigger>
|
|
||||||
<DropdownMenuSubContent>
|
|
||||||
<DropdownMenuItem
|
|
||||||
onSelect={() => handleExport(thread, "markdown")}
|
|
||||||
>
|
|
||||||
<FileText className="text-muted-foreground" />
|
|
||||||
<span>{t.common.exportAsMarkdown}</span>
|
|
||||||
</DropdownMenuItem>
|
|
||||||
<DropdownMenuItem
|
|
||||||
onSelect={() => handleExport(thread, "json")}
|
|
||||||
>
|
|
||||||
<FileJson className="text-muted-foreground" />
|
|
||||||
<span>{t.common.exportAsJSON}</span>
|
|
||||||
</DropdownMenuItem>
|
|
||||||
</DropdownMenuSubContent>
|
|
||||||
</DropdownMenuSub>
|
|
||||||
<DropdownMenuSeparator />
|
|
||||||
<DropdownMenuItem
|
|
||||||
onSelect={() => handleDelete(thread.thread_id)}
|
|
||||||
>
|
|
||||||
<Trash2 className="text-muted-foreground" />
|
|
||||||
<span>{t.common.delete}</span>
|
|
||||||
</DropdownMenuItem>
|
|
||||||
</DropdownMenuContent>
|
|
||||||
</DropdownMenu>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
})
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* 重命名弹窗 */}
|
|
||||||
<Dialog open={renameDialogOpen} onOpenChange={setRenameDialogOpen}>
|
|
||||||
<DialogContent className="sm:max-w-[425px]">
|
|
||||||
<DialogHeader>
|
|
||||||
<DialogTitle>{t.common.rename}</DialogTitle>
|
|
||||||
</DialogHeader>
|
|
||||||
<div className="py-4">
|
|
||||||
<Input
|
|
||||||
value={renameValue}
|
|
||||||
onChange={(e) => setRenameValue(e.target.value)}
|
|
||||||
placeholder={t.common.rename}
|
|
||||||
onKeyDown={(e) => {
|
|
||||||
if (e.key === "Enter" && !isIMEComposing(e)) {
|
|
||||||
e.preventDefault();
|
|
||||||
handleRenameSubmit();
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<DialogFooter>
|
|
||||||
<Button variant="outline" onClick={() => setRenameDialogOpen(false)}>
|
|
||||||
{t.common.cancel}
|
|
||||||
</Button>
|
|
||||||
<Button onClick={handleRenameSubmit}>{t.common.save}</Button>
|
|
||||||
</DialogFooter>
|
|
||||||
</DialogContent>
|
|
||||||
</Dialog>
|
|
||||||
|
|
||||||
{/* 分享弹窗 */}
|
|
||||||
<ShareConversationDialog
|
|
||||||
threadId={shareThreadId}
|
|
||||||
open={shareThreadId !== null}
|
|
||||||
onOpenChange={(o) => {
|
|
||||||
if (!o) setShareThreadId(null);
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@@ -1,6 +1,7 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
import {
|
import {
|
||||||
|
BotIcon,
|
||||||
CheckIcon,
|
CheckIcon,
|
||||||
GlobeIcon,
|
GlobeIcon,
|
||||||
InfoIcon,
|
InfoIcon,
|
||||||
@@ -42,8 +43,6 @@ import {
|
|||||||
import { Switch } from "@/components/ui/switch";
|
import { Switch } from "@/components/ui/switch";
|
||||||
import { Textarea } from "@/components/ui/textarea";
|
import { Textarea } from "@/components/ui/textarea";
|
||||||
import { AgentQuestionEditor } from "@/components/workspace/agents/agent-question-editor";
|
import { AgentQuestionEditor } from "@/components/workspace/agents/agent-question-editor";
|
||||||
import { AgentBrandIcon } from "@/components/workspace/agents/agent-brand-icon";
|
|
||||||
import { AgentRecentChats } from "@/components/workspace/agents/agent-recent-chats";
|
|
||||||
import { useArtifactsOptional } from "@/components/workspace/artifacts";
|
import { useArtifactsOptional } from "@/components/workspace/artifacts";
|
||||||
import { EnabledSkillList } from "@/components/workspace/agents/enabled-skill-list";
|
import { EnabledSkillList } from "@/components/workspace/agents/enabled-skill-list";
|
||||||
import { SkillPickerSheet } from "@/components/workspace/agents/skill-picker-sheet";
|
import { SkillPickerSheet } from "@/components/workspace/agents/skill-picker-sheet";
|
||||||
@@ -60,7 +59,6 @@ import {
|
|||||||
type UpdateAgentRequest,
|
type UpdateAgentRequest,
|
||||||
} from "@/core/agents";
|
} from "@/core/agents";
|
||||||
import { getStoredAuth } from "@/core/auth";
|
import { getStoredAuth } from "@/core/auth";
|
||||||
import { useLiveAccount } from "@/core/auth/use-live-account";
|
|
||||||
import { isAgentSkillCandidate } from "@/core/skills";
|
import { isAgentSkillCandidate } from "@/core/skills";
|
||||||
import { useSkills } from "@/core/skills/hooks";
|
import { useSkills } from "@/core/skills/hooks";
|
||||||
import { usePublishSquares } from "@/core/system-settings/hooks";
|
import { usePublishSquares } from "@/core/system-settings/hooks";
|
||||||
@@ -78,8 +76,6 @@ interface AgentDraft {
|
|||||||
published: boolean;
|
published: boolean;
|
||||||
featured: boolean;
|
featured: boolean;
|
||||||
templateName: string;
|
templateName: string;
|
||||||
/** 会商席位「技能识别强化」开关。 */
|
|
||||||
seatSkillDirective: boolean;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function draftFromAgent(agent: Agent): AgentDraft {
|
function draftFromAgent(agent: Agent): AgentDraft {
|
||||||
@@ -92,7 +88,6 @@ function draftFromAgent(agent: Agent): AgentDraft {
|
|||||||
published: agent.published,
|
published: agent.published,
|
||||||
featured: agent.featured_order != null,
|
featured: agent.featured_order != null,
|
||||||
templateName: agent.template_name ?? "",
|
templateName: agent.template_name ?? "",
|
||||||
seatSkillDirective: agent.seat_skill_directive ?? false,
|
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -136,23 +131,14 @@ export function AgentDetailPanel({
|
|||||||
agentName,
|
agentName,
|
||||||
onAskQuestion,
|
onAskQuestion,
|
||||||
disabled,
|
disabled,
|
||||||
defaultCollapsed,
|
|
||||||
showRecentChats,
|
|
||||||
compactAppearanceActions,
|
|
||||||
}: {
|
}: {
|
||||||
agent: Agent | null | undefined;
|
agent: Agent | null | undefined;
|
||||||
agentName: string;
|
agentName: string;
|
||||||
onAskQuestion: (text: string) => void;
|
onAskQuestion: (text: string) => void;
|
||||||
disabled?: boolean;
|
disabled?: boolean;
|
||||||
/** 初始收起（任务工作区进入时默认收起智能体信息面板）。 */
|
|
||||||
defaultCollapsed?: boolean;
|
|
||||||
/** 在面板底部展示「有关此智能体的最近对话」（仅智能体问答页开启，任务工作区不展示）。 */
|
|
||||||
showRecentChats?: boolean;
|
|
||||||
/** 简洁模式下挂在右上角收起/展开按钮左侧的外观控件。 */
|
|
||||||
compactAppearanceActions?: ReactNode;
|
|
||||||
}) {
|
}) {
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const [collapsed, setCollapsed] = useState(defaultCollapsed ?? false);
|
const [collapsed, setCollapsed] = useState(false);
|
||||||
const [mobileOpen, setMobileOpen] = useState(false);
|
const [mobileOpen, setMobileOpen] = useState(false);
|
||||||
const [editing, setEditing] = useState(false);
|
const [editing, setEditing] = useState(false);
|
||||||
const [draft, setDraft] = useState<AgentDraft | null>(null);
|
const [draft, setDraft] = useState<AgentDraft | null>(null);
|
||||||
@@ -167,8 +153,6 @@ export function AgentDetailPanel({
|
|||||||
const [deleteOpen, setDeleteOpen] = useState(false);
|
const [deleteOpen, setDeleteOpen] = useState(false);
|
||||||
const [publishPickerOpen, setPublishPickerOpen] = useState(false);
|
const [publishPickerOpen, setPublishPickerOpen] = useState(false);
|
||||||
const [detailSkillName, setDetailSkillName] = useState<string | null>(null);
|
const [detailSkillName, setDetailSkillName] = useState<string | null>(null);
|
||||||
// 发布以实时 token 执行 —— 用 live 账号提示发布者并检测账号是否被切换。
|
|
||||||
const live = useLiveAccount();
|
|
||||||
|
|
||||||
const updateAgent = useUpdateAgent();
|
const updateAgent = useUpdateAgent();
|
||||||
const deleteAgent = useDeleteAgent();
|
const deleteAgent = useDeleteAgent();
|
||||||
@@ -308,8 +292,6 @@ export function AgentDetailPanel({
|
|||||||
if (draft.soul !== (agent.soul ?? "")) request.soul = draft.soul;
|
if (draft.soul !== (agent.soul ?? "")) request.soul = draft.soul;
|
||||||
if (draft.templateName.trim() !== (agent.template_name ?? ""))
|
if (draft.templateName.trim() !== (agent.template_name ?? ""))
|
||||||
request.template_name = draft.templateName.trim();
|
request.template_name = draft.templateName.trim();
|
||||||
if (draft.seatSkillDirective !== (agent.seat_skill_directive ?? false))
|
|
||||||
request.seat_skill_directive = draft.seatSkillDirective;
|
|
||||||
if (nextPublished !== agent.published) request.published = nextPublished;
|
if (nextPublished !== agent.published) request.published = nextPublished;
|
||||||
if (JSON.stringify(draft.skills) !== JSON.stringify(agent.skills ?? []))
|
if (JSON.stringify(draft.skills) !== JSON.stringify(agent.skills ?? []))
|
||||||
request.skills = draft.skills;
|
request.skills = draft.skills;
|
||||||
@@ -353,39 +335,19 @@ export function AgentDetailPanel({
|
|||||||
setPublishPickerOpen(true);
|
setPublishPickerOpen(true);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
if (!warnIfAccountSwitched()) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
try {
|
try {
|
||||||
await updateAgent.mutateAsync({
|
await updateAgent.mutateAsync({
|
||||||
id: agent.id,
|
id: agent.id,
|
||||||
request: { published: !agent.published },
|
request: { published: !agent.published },
|
||||||
});
|
});
|
||||||
toast.success(
|
toast.success(agent.published ? "已下架" : "已发布");
|
||||||
agent.published ? "已下架" : `已发布（操作账号：${live.displayName}）`,
|
|
||||||
);
|
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
toast.error(err instanceof Error ? err.message : String(err));
|
toast.error(err instanceof Error ? err.message : String(err));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// 发布以实时 token 执行。会话中途账号被切换（常见于另一标签页登录了别的账号）时
|
|
||||||
// 先弹确认，避免误以本人之外的账号执行发布。返回 false = 用户取消。
|
|
||||||
function warnIfAccountSwitched(): boolean {
|
|
||||||
if (!live.switched) {
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
return window.confirm(
|
|
||||||
`当前登录账号已从「${live.mountDisplayName}」切换为「${live.displayName}」。\n` +
|
|
||||||
`本次发布将以「${live.displayName}」执行。如需以「${live.mountDisplayName}」操作，请取消并刷新页面。\n\n仍要继续吗？`,
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
async function handlePublishToSquare(squareId: string) {
|
async function handlePublishToSquare(squareId: string) {
|
||||||
if (!agent) return;
|
if (!agent) return;
|
||||||
if (!warnIfAccountSwitched()) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
try {
|
try {
|
||||||
await updateAgent.mutateAsync({
|
await updateAgent.mutateAsync({
|
||||||
id: agent.id,
|
id: agent.id,
|
||||||
@@ -393,7 +355,7 @@ export function AgentDetailPanel({
|
|||||||
});
|
});
|
||||||
const sqName =
|
const sqName =
|
||||||
publishSquares?.squares.find((s) => s.id === squareId)?.name ?? "广场";
|
publishSquares?.squares.find((s) => s.id === squareId)?.name ?? "广场";
|
||||||
toast.success(`已发布到「${sqName}」（操作账号：${live.displayName}）`);
|
toast.success(`已发布到「${sqName}」`);
|
||||||
setPublishPickerOpen(false);
|
setPublishPickerOpen(false);
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
toast.error(err instanceof Error ? err.message : String(err));
|
toast.error(err instanceof Error ? err.message : String(err));
|
||||||
@@ -520,7 +482,9 @@ export function AgentDetailPanel({
|
|||||||
{/* ── Identity / 基础信息 ─────────────────────────────────────────── */}
|
{/* ── Identity / 基础信息 ─────────────────────────────────────────── */}
|
||||||
<section className="bg-card/60 rounded-xl border p-4">
|
<section className="bg-card/60 rounded-xl border p-4">
|
||||||
<div className="flex items-start gap-3">
|
<div className="flex items-start gap-3">
|
||||||
<AgentBrandIcon className="agent-avatar" size="lg" />
|
<div className="bg-primary/10 ring-primary/15 flex size-12 shrink-0 items-center justify-center rounded-2xl ring-1">
|
||||||
|
<BotIcon className="text-primary size-6" />
|
||||||
|
</div>
|
||||||
<div className="min-w-0 flex-1 space-y-1.5">
|
<div className="min-w-0 flex-1 space-y-1.5">
|
||||||
{editing && draft ? (
|
{editing && draft ? (
|
||||||
<Input
|
<Input
|
||||||
@@ -594,21 +558,6 @@ export function AgentDetailPanel({
|
|||||||
配置后，对话生成的 Markdown 文件可一键发布到知识入库接口。
|
配置后，对话生成的 Markdown 文件可一键发布到知识入库接口。
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<div className="bg-background/60 flex items-center justify-between rounded-lg border px-3 py-2">
|
|
||||||
<div className="pr-3">
|
|
||||||
<p className="text-sm font-medium">会商技能识别强化</p>
|
|
||||||
<p className="text-muted-foreground text-xs">
|
|
||||||
作为会商席位时，把已配置技能（含 SKILL.md 路径与「先 read_file
|
|
||||||
再用」硬指令）拼进任务，补偿弱模型不识别技能。也可在业务链条配置中打开（任一即生效）。
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<Switch
|
|
||||||
checked={draft.seatSkillDirective}
|
|
||||||
onCheckedChange={(checked) =>
|
|
||||||
setDraft({ ...draft, seatSkillDirective: checked })
|
|
||||||
}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div className="bg-background/60 flex items-center justify-between rounded-lg border px-3 py-2">
|
<div className="bg-background/60 flex items-center justify-between rounded-lg border px-3 py-2">
|
||||||
<div>
|
<div>
|
||||||
<p className="text-sm font-medium">公开发布</p>
|
<p className="text-sm font-medium">公开发布</p>
|
||||||
@@ -819,19 +768,15 @@ export function AgentDetailPanel({
|
|||||||
onViewDetail={setDetailSkillName}
|
onViewDetail={setDetailSkillName}
|
||||||
/>
|
/>
|
||||||
</Section>
|
</Section>
|
||||||
|
|
||||||
{/* ── 最近对话（右下角，仅智能体问答页展示，编辑态隐藏）──────────── */}
|
|
||||||
{showRecentChats && !editing && <AgentRecentChats agentId={agent.id} />}
|
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|
||||||
const panelChrome = (collapseButton: ReactNode) => (
|
const panelChrome = (collapseButton: ReactNode) => (
|
||||||
<>
|
<>
|
||||||
<div className="flex h-12 shrink-0 items-center justify-between border-b px-4">
|
<div className="flex h-12 shrink-0 items-center justify-between border-b px-4">
|
||||||
<span className="shrink-0 whitespace-nowrap text-sm font-semibold">智能体信息</span>
|
<span className="text-sm font-semibold">智能体信息</span>
|
||||||
<div className="flex min-w-0 items-center gap-1">
|
<div className="flex items-center gap-1">
|
||||||
{headerActions}
|
{headerActions}
|
||||||
{compactAppearanceActions}
|
|
||||||
{collapseButton}
|
{collapseButton}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -843,20 +788,17 @@ export function AgentDetailPanel({
|
|||||||
<>
|
<>
|
||||||
{/* ── Desktop (lg+): inline aside, collapsible to a rail ───────────── */}
|
{/* ── Desktop (lg+): inline aside, collapsible to a rail ───────────── */}
|
||||||
{collapsed ? (
|
{collapsed ? (
|
||||||
<div className="hidden shrink-0 items-start border-l px-2 pt-3 lg:flex">
|
<div className="hidden shrink-0 flex-col items-center border-l pt-3 lg:flex">
|
||||||
<div className="flex items-center gap-1">
|
<Tooltip content="智能体信息">
|
||||||
{compactAppearanceActions}
|
<Button
|
||||||
<Tooltip content="智能体信息">
|
variant="ghost"
|
||||||
<Button
|
size="icon-sm"
|
||||||
variant="ghost"
|
onClick={() => setCollapsed(false)}
|
||||||
size="icon-sm"
|
aria-label="展开智能体信息"
|
||||||
onClick={() => setCollapsed(false)}
|
>
|
||||||
aria-label="展开智能体信息"
|
<PanelRightOpenIcon className="size-4" />
|
||||||
>
|
</Button>
|
||||||
<PanelRightOpenIcon className="size-4" />
|
</Tooltip>
|
||||||
</Button>
|
|
||||||
</Tooltip>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
) : (
|
) : (
|
||||||
<aside className="bg-card/40 hidden h-full w-[360px] shrink-0 flex-col border-l lg:flex">
|
<aside className="bg-card/40 hidden h-full w-[360px] shrink-0 flex-col border-l lg:flex">
|
||||||
@@ -956,23 +898,6 @@ export function AgentDetailPanel({
|
|||||||
loading={updateAgent.isPending}
|
loading={updateAgent.isPending}
|
||||||
onConfirm={(squareId) => void handlePublishToSquare(squareId)}
|
onConfirm={(squareId) => void handlePublishToSquare(squareId)}
|
||||||
description="请选择要把该智能体发布到哪个广场。每个智能体只能归属一个广场，不会重复出现。"
|
description="请选择要把该智能体发布到哪个广场。每个智能体只能归属一个广场，不会重复出现。"
|
||||||
accountNotice={
|
|
||||||
<div className="text-xs">
|
|
||||||
<p className="text-muted-foreground">
|
|
||||||
发布操作账号：
|
|
||||||
<span className="text-foreground font-medium">
|
|
||||||
「{live.displayName}」
|
|
||||||
</span>
|
|
||||||
</p>
|
|
||||||
{live.switched && (
|
|
||||||
<p className="text-destructive mt-1">
|
|
||||||
⚠ 当前登录账号已从「{live.mountDisplayName}」切换为「
|
|
||||||
{live.displayName}」。如需以「{live.mountDisplayName}
|
|
||||||
」操作，请刷新页面确认。
|
|
||||||
</p>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
/>
|
/>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -1,15 +1,6 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
import {
|
import { ArrowDownUpIcon, BotIcon, Loader2, LockIcon, PlusIcon, ShieldIcon, XIcon } from "lucide-react";
|
||||||
ArrowDownUpIcon,
|
|
||||||
BotIcon,
|
|
||||||
Loader2,
|
|
||||||
LockIcon,
|
|
||||||
PlusIcon,
|
|
||||||
SearchIcon,
|
|
||||||
ShieldIcon,
|
|
||||||
XIcon,
|
|
||||||
} from "lucide-react";
|
|
||||||
import { useRouter } from "next/navigation";
|
import { useRouter } from "next/navigation";
|
||||||
import { useEffect, useState } from "react";
|
import { useEffect, useState } from "react";
|
||||||
import { toast } from "sonner";
|
import { toast } from "sonner";
|
||||||
@@ -19,17 +10,17 @@ import { Input } from "@/components/ui/input";
|
|||||||
import { Pagination } from "@/components/ui/pagination";
|
import { Pagination } from "@/components/ui/pagination";
|
||||||
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
|
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
|
||||||
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
|
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
|
||||||
import { AgentBrandIcon } from "@/components/workspace/agents/agent-brand-icon";
|
import { TagSearchBar } from "@/components/workspace/tags/tag-search-bar";
|
||||||
|
import { ViewModeToggle } from "@/components/workspace/view-mode-toggle";
|
||||||
import { getStoredAuth } from "@/core/auth";
|
import { getStoredAuth } from "@/core/auth";
|
||||||
import { useAgentsPaginated, usePrivateAgentsPaginated } from "@/core/agents";
|
import { useAgentsPaginated, usePrivateAgentsPaginated } from "@/core/agents";
|
||||||
import type { Agent, AgentSort } from "@/core/agents";
|
import type { Agent, AgentSort } from "@/core/agents";
|
||||||
import { useI18n } from "@/core/i18n/hooks";
|
import { useI18n } from "@/core/i18n/hooks";
|
||||||
import { usePrivateSquareStatus, usePublishSquares } from "@/core/system-settings/hooks";
|
import { usePrivateSquareStatus, usePublishSquares, useViewMode } from "@/core/system-settings/hooks";
|
||||||
|
|
||||||
import { AgentCard } from "./agent-card";
|
import { AgentCard } from "./agent-card";
|
||||||
|
|
||||||
const PAGE_SIZE = 12;
|
const PAGE_SIZE = 12;
|
||||||
type AgentStatusFilter = "all" | "published" | "draft" | "private" | "builtin";
|
|
||||||
|
|
||||||
// Within a single tab the verified password is kept in sessionStorage so a
|
// Within a single tab the verified password is kept in sessionStorage so a
|
||||||
// refresh / route navigation does not re-prompt. Cleared on tab close, so the
|
// refresh / route navigation does not re-prompt. Cleared on tab close, so the
|
||||||
@@ -41,10 +32,11 @@ export function AgentGallery() {
|
|||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
// 「内置智能体」筛选仅管理员可见（后端 scope=builtin 也做了 admin 闸门兜底）。
|
// 「内置智能体」筛选仅管理员可见（后端 scope=builtin 也做了 admin 闸门兜底）。
|
||||||
const isAdmin = getStoredAuth()?.system_role === "admin";
|
const isAdmin = getStoredAuth()?.system_role === "admin";
|
||||||
|
const [viewMode, setViewMode] = useViewMode("agent");
|
||||||
const [activeTab, setActiveTab] = useState<string>("mine");
|
const [activeTab, setActiveTab] = useState<string>("mine");
|
||||||
const [search, setSearch] = useState("");
|
const [search, setSearch] = useState("");
|
||||||
|
const [tagIds, setTagIds] = useState<string[]>([]);
|
||||||
const [sort, setSort] = useState<AgentSort>("time_desc");
|
const [sort, setSort] = useState<AgentSort>("time_desc");
|
||||||
const [statusFilter, setStatusFilter] = useState<AgentStatusFilter>("all");
|
|
||||||
const { data: publishSquares } = usePublishSquares();
|
const { data: publishSquares } = usePublishSquares();
|
||||||
// Each configured publish square (发布广场) becomes its own browse tab; the
|
// Each configured publish square (发布广场) becomes its own browse tab; the
|
||||||
// backend always returns at least one (the built-in default).
|
// backend always returns at least one (the built-in default).
|
||||||
@@ -61,9 +53,10 @@ export function AgentGallery() {
|
|||||||
// frontend's desensitize map, so typing the displayed abbreviation (e.g.
|
// frontend's desensitize map, so typing the displayed abbreviation (e.g.
|
||||||
// "TS") still matches the stored raw name (e.g. "态势分析"). Whenever the
|
// "TS") still matches the stored raw name (e.g. "态势分析"). Whenever the
|
||||||
// filters change, every tab returns to its first page.
|
// filters change, every tab returns to its first page.
|
||||||
|
const tagKey = tagIds.join(",");
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
setPages({});
|
setPages({});
|
||||||
}, [search, sort, publisher?.id, statusFilter]);
|
}, [search, tagKey, sort, publisher?.id]);
|
||||||
|
|
||||||
// If the active square tab disappears (admin removed that square), fall back
|
// If the active square tab disappears (admin removed that square), fall back
|
||||||
// to "我的" so the gallery never points at a dead tab.
|
// to "我的" so the gallery never points at a dead tab.
|
||||||
@@ -115,6 +108,7 @@ export function AgentGallery() {
|
|||||||
} = useAgentsPaginated({
|
} = useAgentsPaginated({
|
||||||
scope: mainScope,
|
scope: mainScope,
|
||||||
search,
|
search,
|
||||||
|
tagIds,
|
||||||
sort,
|
sort,
|
||||||
page: mainPage,
|
page: mainPage,
|
||||||
pageSize: PAGE_SIZE,
|
pageSize: PAGE_SIZE,
|
||||||
@@ -132,6 +126,7 @@ export function AgentGallery() {
|
|||||||
error: privateError,
|
error: privateError,
|
||||||
} = usePrivateAgentsPaginated(privatePassword, {
|
} = usePrivateAgentsPaginated(privatePassword, {
|
||||||
search,
|
search,
|
||||||
|
tagIds,
|
||||||
sort,
|
sort,
|
||||||
page: pages.private ?? 1,
|
page: pages.private ?? 1,
|
||||||
pageSize: PAGE_SIZE,
|
pageSize: PAGE_SIZE,
|
||||||
@@ -182,22 +177,21 @@ export function AgentGallery() {
|
|||||||
const handlePublisherClick = (p: { id: string; label: string }) =>
|
const handlePublisherClick = (p: { id: string; label: string }) =>
|
||||||
setPublisher(p);
|
setPublisher(p);
|
||||||
|
|
||||||
const filterByStatus = (agent: Agent) => {
|
const renderGrid = (list: Agent[]) =>
|
||||||
if (statusFilter === "published") return agent.published && !agent.is_private;
|
viewMode === "list" ? (
|
||||||
if (statusFilter === "draft") return !agent.published && !agent.is_private && !agent.builtin;
|
<div className="flex flex-col gap-2">
|
||||||
if (statusFilter === "private") return agent.is_private;
|
{list.map((agent) => (
|
||||||
if (statusFilter === "builtin") return agent.builtin;
|
<AgentCard
|
||||||
return true;
|
key={agent.id}
|
||||||
};
|
agent={agent}
|
||||||
|
layout="list"
|
||||||
const renderGrid = (list: Agent[]) => {
|
onPublisherClick={handlePublisherClick}
|
||||||
const visibleAgents = list.filter(filterByStatus);
|
/>
|
||||||
if (visibleAgents.length === 0 && list.length > 0) {
|
))}
|
||||||
return renderEmpty("当前状态筛选下没有智能体。");
|
</div>
|
||||||
}
|
) : (
|
||||||
return (
|
<div className="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4">
|
||||||
<div className="grid grid-cols-1 gap-4 md:grid-cols-2 xl:grid-cols-3">
|
{list.map((agent) => (
|
||||||
{visibleAgents.map((agent) => (
|
|
||||||
<AgentCard
|
<AgentCard
|
||||||
key={agent.id}
|
key={agent.id}
|
||||||
agent={agent}
|
agent={agent}
|
||||||
@@ -206,7 +200,6 @@ export function AgentGallery() {
|
|||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
};
|
|
||||||
|
|
||||||
/** Loading / empty / (grid + pagination) for one paginated tab. */
|
/** Loading / empty / (grid + pagination) for one paginated tab. */
|
||||||
const renderListBody = (opts: {
|
const renderListBody = (opts: {
|
||||||
@@ -271,8 +264,10 @@ export function AgentGallery() {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const renderEmpty = (description: string, showNewButton = false) => (
|
const renderEmpty = (description: string, showNewButton = false) => (
|
||||||
<div className="flex h-72 flex-col items-center justify-center gap-3 rounded-2xl border border-dashed border-blue-200 bg-white/70 text-center shadow-[0_12px_36px_rgba(37,99,235,0.05)] dark:border-blue-900 dark:bg-slate-900/70">
|
<div className="flex h-64 flex-col items-center justify-center gap-3 text-center">
|
||||||
<AgentBrandIcon size="lg" />
|
<div className="bg-muted flex h-14 w-14 items-center justify-center rounded-full dark:bg-[#022248]">
|
||||||
|
<BotIcon className="text-muted-foreground h-7 w-7 dark:text-[#AACEFF]" />
|
||||||
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<p className="font-medium dark:text-[#AACEFF]">{t.agents.emptyTitle}</p>
|
<p className="font-medium dark:text-[#AACEFF]">{t.agents.emptyTitle}</p>
|
||||||
<p className="text-muted-foreground mt-1 text-sm dark:text-[#55A6FE]">
|
<p className="text-muted-foreground mt-1 text-sm dark:text-[#55A6FE]">
|
||||||
@@ -281,7 +276,8 @@ export function AgentGallery() {
|
|||||||
</div>
|
</div>
|
||||||
{showNewButton && (
|
{showNewButton && (
|
||||||
<Button
|
<Button
|
||||||
className="mt-2 rounded-xl bg-[#1f63e9] px-5 shadow-[0_8px_20px_rgba(31,99,233,0.22)] hover:bg-[#1857d4] dark:border-[#2580FF] dark:bg-[#2580FF] dark:text-white dark:hover:border-[#2580FF] dark:hover:bg-[#2580FF]/90 dark:hover:text-white"
|
variant="outline"
|
||||||
|
className="mt-2 dark:border-[#2580FF] dark:bg-[#2580FF] dark:text-white dark:hover:border-[#2580FF] dark:hover:bg-[#2580FF]/90 dark:hover:text-white"
|
||||||
onClick={handleNewAgent}
|
onClick={handleNewAgent}
|
||||||
>
|
>
|
||||||
<PlusIcon className="mr-1.5 h-4 w-4" />
|
<PlusIcon className="mr-1.5 h-4 w-4" />
|
||||||
@@ -368,22 +364,17 @@ export function AgentGallery() {
|
|||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="flex size-full min-h-0 flex-col overflow-hidden border-y border-r border-slate-200/80 bg-white dark:border-slate-800 dark:bg-slate-950">
|
<div className="flex size-full flex-col">
|
||||||
{/* Page header */}
|
{/* Page header */}
|
||||||
<div className="flex shrink-0 items-start justify-between px-[38px] pt-[45px] pb-[38px]">
|
<div className="flex items-center justify-between border-b px-6 py-4">
|
||||||
<div>
|
<div>
|
||||||
<h1 className="text-[28px] leading-none font-semibold tracking-[-0.03em] text-slate-950 dark:text-white">
|
<h1 className="text-xl font-semibold">{t.agents.title}</h1>
|
||||||
{t.agents.title}
|
<p className="text-muted-foreground mt-0.5 text-sm">
|
||||||
</h1>
|
{t.agents.description}
|
||||||
<p className="mt-4 text-[15px] text-slate-500 dark:text-slate-400">
|
|
||||||
创建并管理专属的 AI 智能体，助力更高效的工作与决策。
|
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<Button
|
<Button onClick={handleNewAgent}>
|
||||||
onClick={handleNewAgent}
|
<PlusIcon className="mr-1.5 h-4 w-4" />
|
||||||
className="h-12 w-[154px] rounded-lg bg-gradient-to-r from-[#2467ea] to-[#0f54ed] px-0 text-[15px] font-medium shadow-[0_9px_22px_rgba(31,99,233,0.22)] hover:brightness-105"
|
|
||||||
>
|
|
||||||
<PlusIcon className="mr-2 h-[18px] w-[18px]" />
|
|
||||||
{t.agents.newAgent}
|
{t.agents.newAgent}
|
||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
@@ -393,99 +384,43 @@ export function AgentGallery() {
|
|||||||
value={activeTab}
|
value={activeTab}
|
||||||
onValueChange={(v) => {
|
onValueChange={(v) => {
|
||||||
setActiveTab(v);
|
setActiveTab(v);
|
||||||
// Each tab starts from a clean slate instead of carrying filters over.
|
// Each tab starts from a clean slate: switching tabs clears the
|
||||||
|
// keyword / tag / sort / publisher filters instead of carrying them
|
||||||
|
// over. The TagSearchBar's own input box is reset via its key below.
|
||||||
setSearch("");
|
setSearch("");
|
||||||
|
setTagIds([]);
|
||||||
setSort("time_desc");
|
setSort("time_desc");
|
||||||
setStatusFilter("all");
|
|
||||||
setPublisher(null);
|
setPublisher(null);
|
||||||
}}
|
}}
|
||||||
className="flex min-h-0 flex-1 flex-col overflow-hidden"
|
className="flex flex-1 flex-col overflow-hidden"
|
||||||
>
|
>
|
||||||
<div className="shrink-0 px-[38px]">
|
<div className="mx-6 mt-4 flex flex-col gap-3">
|
||||||
<div className="flex min-h-14 flex-col gap-3 border-b border-slate-200/90 lg:flex-row lg:items-end lg:justify-between dark:border-slate-800">
|
<div className="flex items-center justify-between gap-3">
|
||||||
<TabsList variant="line" className="h-auto w-auto max-w-full flex-wrap justify-start self-start rounded-none border-0 bg-transparent p-0">
|
<TabsList className="w-auto max-w-full flex-wrap justify-start self-start">
|
||||||
<TabsTrigger
|
<TabsTrigger value="mine">我的</TabsTrigger>
|
||||||
value="mine"
|
|
||||||
className="h-14 rounded-none border-x-0 border-t-0 border-b-2 border-transparent bg-transparent px-3 text-[15px] shadow-none after:hidden data-[state=active]:border-x-0 data-[state=active]:border-t-0 data-[state=active]:!border-b-[#2166e8] data-[state=active]:bg-transparent data-[state=active]:text-[#2166e8] data-[state=active]:!shadow-none"
|
|
||||||
>
|
|
||||||
我的
|
|
||||||
</TabsTrigger>
|
|
||||||
{squareTabs.map((sq) => (
|
{squareTabs.map((sq) => (
|
||||||
<TabsTrigger
|
<TabsTrigger key={sq.id} value={sq.id} title={sq.description || sq.name}>
|
||||||
key={sq.id}
|
|
||||||
value={sq.id}
|
|
||||||
title={sq.description || sq.name}
|
|
||||||
className="h-14 rounded-none border-x-0 border-t-0 border-b-2 border-transparent bg-transparent px-5 text-[15px] shadow-none after:hidden data-[state=active]:border-x-0 data-[state=active]:border-t-0 data-[state=active]:!border-b-[#2166e8] data-[state=active]:bg-transparent data-[state=active]:text-[#2166e8] data-[state=active]:!shadow-none"
|
|
||||||
>
|
|
||||||
{sq.name}
|
{sq.name}
|
||||||
</TabsTrigger>
|
</TabsTrigger>
|
||||||
))}
|
))}
|
||||||
{privateFeatureAvailable && (
|
{privateFeatureAvailable && (
|
||||||
<TabsTrigger
|
<TabsTrigger value="private">
|
||||||
value="private"
|
|
||||||
className="h-14 rounded-none border-x-0 border-t-0 border-b-2 border-transparent bg-transparent px-5 text-[15px] shadow-none after:hidden data-[state=active]:border-x-0 data-[state=active]:border-t-0 data-[state=active]:!border-b-[#2166e8] data-[state=active]:bg-transparent data-[state=active]:text-[#2166e8] data-[state=active]:!shadow-none"
|
|
||||||
>
|
|
||||||
<LockIcon className="mr-1 h-3.5 w-3.5" />
|
<LockIcon className="mr-1 h-3.5 w-3.5" />
|
||||||
私密广场
|
私密广场
|
||||||
</TabsTrigger>
|
</TabsTrigger>
|
||||||
)}
|
)}
|
||||||
{isAdmin && (
|
{isAdmin && (
|
||||||
<TabsTrigger
|
<TabsTrigger value="builtin" title="内置/功能型智能体（仅管理员可见）">
|
||||||
value="builtin"
|
|
||||||
title="内置/功能型智能体（仅管理员可见）"
|
|
||||||
className="h-14 rounded-none border-x-0 border-t-0 border-b-2 border-transparent bg-transparent px-5 text-[15px] shadow-none after:hidden data-[state=active]:border-x-0 data-[state=active]:border-t-0 data-[state=active]:!border-b-[#2166e8] data-[state=active]:bg-transparent data-[state=active]:text-[#2166e8] data-[state=active]:!shadow-none"
|
|
||||||
>
|
|
||||||
<BotIcon className="mr-1 h-3.5 w-3.5" />
|
<BotIcon className="mr-1 h-3.5 w-3.5" />
|
||||||
内置智能体
|
内置智能体
|
||||||
</TabsTrigger>
|
</TabsTrigger>
|
||||||
)}
|
)}
|
||||||
</TabsList>
|
</TabsList>
|
||||||
{showSearchBar && (
|
<div className="flex items-center gap-3">
|
||||||
<div className="flex flex-wrap items-center justify-end gap-5 pb-2.5">
|
<span className="text-muted-foreground text-sm whitespace-nowrap">
|
||||||
<div className="relative w-[350px] max-w-full">
|
共 {activeTotal} 个
|
||||||
<SearchIcon className="pointer-events-none absolute top-1/2 left-3.5 size-[18px] -translate-y-1/2 text-slate-500" />
|
</span>
|
||||||
<Input
|
<ViewModeToggle value={viewMode} onChange={setViewMode} />
|
||||||
value={search}
|
|
||||||
onChange={(event) => setSearch(event.target.value)}
|
|
||||||
placeholder="搜索智能体名称或描述"
|
|
||||||
className="h-12 rounded-xl border-slate-200 bg-white pl-11 text-sm shadow-none placeholder:text-slate-400 focus-visible:border-blue-400 focus-visible:ring-blue-100 dark:border-slate-700 dark:bg-slate-900"
|
|
||||||
/>
|
|
||||||
{(activeTab === "private" ? isPrivateFetching : mainFetching) && (
|
|
||||||
<Loader2 className="absolute top-1/2 right-3.5 size-4 -translate-y-1/2 animate-spin text-blue-500" />
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
<Select
|
|
||||||
value={statusFilter}
|
|
||||||
onValueChange={(value) => setStatusFilter(value as AgentStatusFilter)}
|
|
||||||
>
|
|
||||||
<SelectTrigger className="h-12 w-[156px] rounded-xl border-slate-200 px-4 text-sm shadow-none dark:border-slate-700">
|
|
||||||
<SelectValue />
|
|
||||||
</SelectTrigger>
|
|
||||||
<SelectContent position="popper" side="bottom" sideOffset={4}>
|
|
||||||
<SelectItem value="all">全部状态</SelectItem>
|
|
||||||
<SelectItem value="published">已发布</SelectItem>
|
|
||||||
<SelectItem value="draft">未发布</SelectItem>
|
|
||||||
<SelectItem value="private">私密</SelectItem>
|
|
||||||
<SelectItem value="builtin">内置</SelectItem>
|
|
||||||
</SelectContent>
|
|
||||||
</Select>
|
|
||||||
<Select value={sort} onValueChange={(v) => setSort(v as AgentSort)}>
|
|
||||||
<SelectTrigger
|
|
||||||
className="h-12 w-[156px] rounded-xl border-slate-200 px-4 text-sm shadow-none dark:border-slate-700"
|
|
||||||
title="排序"
|
|
||||||
>
|
|
||||||
<ArrowDownUpIcon className="mr-1 size-4 text-slate-500" />
|
|
||||||
<SelectValue />
|
|
||||||
</SelectTrigger>
|
|
||||||
<SelectContent position="popper" side="bottom" sideOffset={4}>
|
|
||||||
<SelectItem value="time_desc">更新时间</SelectItem>
|
|
||||||
<SelectItem value="time_asc">最早创建</SelectItem>
|
|
||||||
<SelectItem value="updated_desc">最近更新</SelectItem>
|
|
||||||
<SelectItem value="updated_asc">最早更新</SelectItem>
|
|
||||||
<SelectItem value="name_asc">名称 A-Z</SelectItem>
|
|
||||||
<SelectItem value="name_desc">名称 Z-A</SelectItem>
|
|
||||||
</SelectContent>
|
|
||||||
</Select>
|
|
||||||
{activeTab === "private" && privatePassword && (
|
{activeTab === "private" && privatePassword && (
|
||||||
<Button
|
<Button
|
||||||
variant="outline"
|
variant="outline"
|
||||||
@@ -497,16 +432,48 @@ export function AgentGallery() {
|
|||||||
锁定
|
锁定
|
||||||
</Button>
|
</Button>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
)}
|
|
||||||
</div>
|
</div>
|
||||||
|
{showSearchBar && (
|
||||||
|
<TagSearchBar
|
||||||
|
// Remount per tab so the internal keyword input / 展开 state also
|
||||||
|
// resets when the parent-owned filters are cleared on tab switch.
|
||||||
|
key={activeTab}
|
||||||
|
targetType="agent"
|
||||||
|
searching={
|
||||||
|
activeTab === "private" ? isPrivateFetching : mainFetching
|
||||||
|
}
|
||||||
|
onSearchChange={setSearch}
|
||||||
|
tagIds={tagIds}
|
||||||
|
onTagIdsChange={setTagIds}
|
||||||
|
actions={
|
||||||
|
<Select value={sort} onValueChange={(v) => setSort(v as AgentSort)}>
|
||||||
|
<SelectTrigger
|
||||||
|
className="h-9 w-full gap-2 px-3 text-xs sm:w-[148px]"
|
||||||
|
title="排序"
|
||||||
|
>
|
||||||
|
<ArrowDownUpIcon className="text-muted-foreground size-3.5" />
|
||||||
|
<SelectValue />
|
||||||
|
</SelectTrigger>
|
||||||
|
<SelectContent position="popper" side="bottom" sideOffset={4}>
|
||||||
|
<SelectItem value="time_desc">最新创建</SelectItem>
|
||||||
|
<SelectItem value="time_asc">最早创建</SelectItem>
|
||||||
|
<SelectItem value="updated_desc">最近更新</SelectItem>
|
||||||
|
<SelectItem value="updated_asc">最早更新</SelectItem>
|
||||||
|
<SelectItem value="name_asc">名称 A-Z</SelectItem>
|
||||||
|
<SelectItem value="name_desc">名称 Z-A</SelectItem>
|
||||||
|
</SelectContent>
|
||||||
|
</Select>
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
{publisher && (
|
{publisher && (
|
||||||
<div className="mt-3 flex items-center gap-2">
|
<div className="flex items-center gap-2">
|
||||||
<span className="text-muted-foreground text-xs">筛选发布者：</span>
|
<span className="text-muted-foreground text-xs">筛选发布者：</span>
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
onClick={() => setPublisher(null)}
|
onClick={() => setPublisher(null)}
|
||||||
className="inline-flex items-center gap-1 rounded-full bg-blue-50 px-3 py-1 text-xs font-medium text-blue-700 transition-colors hover:bg-blue-100 dark:bg-blue-500/15 dark:text-blue-300"
|
className="bg-primary/10 text-primary hover:bg-primary/20 inline-flex items-center gap-1 rounded-full px-3 py-1 text-xs font-medium transition-colors"
|
||||||
title="点击清除发布者筛选"
|
title="点击清除发布者筛选"
|
||||||
>
|
>
|
||||||
{publisher.label}
|
{publisher.label}
|
||||||
@@ -514,16 +481,13 @@ export function AgentGallery() {
|
|||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
<div className="py-5 text-[15px] text-slate-600 dark:text-slate-300">
|
|
||||||
共 {activeTotal} 个智能体
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{squareTabs.map((sq) => (
|
{squareTabs.map((sq) => (
|
||||||
<TabsContent
|
<TabsContent
|
||||||
key={sq.id}
|
key={sq.id}
|
||||||
value={sq.id}
|
value={sq.id}
|
||||||
className="mt-0 flex-1 overflow-y-auto px-[38px] pb-8"
|
className="flex-1 overflow-y-auto p-6 mt-0"
|
||||||
>
|
>
|
||||||
{renderListBody({
|
{renderListBody({
|
||||||
list: mainAgents,
|
list: mainAgents,
|
||||||
@@ -536,7 +500,7 @@ export function AgentGallery() {
|
|||||||
</TabsContent>
|
</TabsContent>
|
||||||
))}
|
))}
|
||||||
|
|
||||||
<TabsContent value="mine" className="mt-0 flex-1 overflow-y-auto px-[38px] pb-8">
|
<TabsContent value="mine" className="flex-1 overflow-y-auto p-6 mt-0">
|
||||||
{renderListBody({
|
{renderListBody({
|
||||||
list: mainAgents,
|
list: mainAgents,
|
||||||
total: mainTotal,
|
total: mainTotal,
|
||||||
@@ -549,7 +513,7 @@ export function AgentGallery() {
|
|||||||
</TabsContent>
|
</TabsContent>
|
||||||
|
|
||||||
{isAdmin && (
|
{isAdmin && (
|
||||||
<TabsContent value="builtin" className="mt-0 flex-1 overflow-y-auto px-[38px] pb-8">
|
<TabsContent value="builtin" className="flex-1 overflow-y-auto p-6 mt-0">
|
||||||
{renderListBody({
|
{renderListBody({
|
||||||
list: mainAgents,
|
list: mainAgents,
|
||||||
total: mainTotal,
|
total: mainTotal,
|
||||||
@@ -564,7 +528,7 @@ export function AgentGallery() {
|
|||||||
{privateFeatureAvailable && (
|
{privateFeatureAvailable && (
|
||||||
<TabsContent
|
<TabsContent
|
||||||
value="private"
|
value="private"
|
||||||
className="mt-0 flex-1 overflow-y-auto px-[38px] pb-8"
|
className="flex-1 overflow-y-auto p-6 mt-0"
|
||||||
>
|
>
|
||||||
{renderPrivateTab()}
|
{renderPrivateTab()}
|
||||||
</TabsContent>
|
</TabsContent>
|
||||||
|
|||||||
@@ -138,7 +138,7 @@ export function AgentModuleSettingsDialog({
|
|||||||
key={agent.id}
|
key={agent.id}
|
||||||
className="flex items-start gap-3 rounded-xl border border-border/60 bg-card p-3"
|
className="flex items-start gap-3 rounded-xl border border-border/60 bg-card p-3"
|
||||||
>
|
>
|
||||||
<div className="agent-avatar bg-primary/10 text-primary mt-0.5 flex size-8 shrink-0 items-center justify-center rounded-lg">
|
<div className="bg-primary/10 text-primary mt-0.5 flex size-8 shrink-0 items-center justify-center rounded-lg">
|
||||||
<Bot className="size-4" />
|
<Bot className="size-4" />
|
||||||
</div>
|
</div>
|
||||||
<div className="min-w-0 flex-1">
|
<div className="min-w-0 flex-1">
|
||||||
|
|||||||
@@ -5,8 +5,6 @@ import Link from "next/link";
|
|||||||
import { usePathname } from "next/navigation";
|
import { usePathname } from "next/navigation";
|
||||||
import { useMemo, useState } from "react";
|
import { useMemo, useState } from "react";
|
||||||
|
|
||||||
import { agentColor } from "@/components/workspace/agent-icon-color";
|
|
||||||
import { useTheme } from "@/contexts/ThemeContext";
|
|
||||||
import { useAgents } from "@/core/agents";
|
import { useAgents } from "@/core/agents";
|
||||||
import type { Agent } from "@/core/agents";
|
import type { Agent } from "@/core/agents";
|
||||||
import { useAgentModuleConfig } from "@/core/system-settings/hooks";
|
import { useAgentModuleConfig } from "@/core/system-settings/hooks";
|
||||||
@@ -107,11 +105,30 @@ function groupAgentsByTag(agents: Agent[], allowedTagIds: string[]): AgentGroup[
|
|||||||
return groups;
|
return groups;
|
||||||
}
|
}
|
||||||
|
|
||||||
export function useAgentModuleSidebarData(moduleKey: string) {
|
/**
|
||||||
const { agents, isLoading: agentsLoading } = useAgents();
|
* 「按类型聚合智能体 + 聊天记录」左栏（需求 0616 #3 zzJC / #4 zzXD）。
|
||||||
|
*
|
||||||
|
* - 上半：可见智能体按标签（类型）分组、可折叠；点击进入该智能体对话（保持当前路由
|
||||||
|
* 命名空间，全量模式下为 /page/strategy）。
|
||||||
|
* - 下半：聊天记录 —— 仅与本模块智能体（即左栏列出的智能体）的会话，按 metadata.agent_id 过滤。
|
||||||
|
* - 宽度与通用问答左栏一致（``--sidebar-width``）。
|
||||||
|
*/
|
||||||
|
export function AgentModuleSidebar({
|
||||||
|
moduleKey,
|
||||||
|
activeAgentId,
|
||||||
|
onOpenSettings,
|
||||||
|
}: {
|
||||||
|
moduleKey: string;
|
||||||
|
activeAgentId?: string;
|
||||||
|
/** 传入则在左栏顶部显示设置齿轮（admin）。 */
|
||||||
|
onOpenSettings?: () => void;
|
||||||
|
}) {
|
||||||
|
const routeBase = useRouteBase();
|
||||||
|
const pathname = usePathname();
|
||||||
|
const { agents } = useAgents();
|
||||||
const { data: threads = [] } = useThreads();
|
const { data: threads = [] } = useThreads();
|
||||||
const { data: moduleConfig, isLoading: configLoading } =
|
const { data: moduleConfig } = useAgentModuleConfig(moduleKey);
|
||||||
useAgentModuleConfig(moduleKey);
|
const [collapsed, setCollapsed] = useState<Set<string>>(() => new Set());
|
||||||
|
|
||||||
const allowedTagIds = useMemo(
|
const allowedTagIds = useMemo(
|
||||||
() => moduleConfig?.tag_ids ?? [],
|
() => moduleConfig?.tag_ids ?? [],
|
||||||
@@ -139,56 +156,6 @@ export function useAgentModuleSidebarData(moduleKey: string) {
|
|||||||
[threads, moduleAgentIds],
|
[threads, moduleAgentIds],
|
||||||
);
|
);
|
||||||
|
|
||||||
return {
|
|
||||||
groups,
|
|
||||||
moduleAgentIds,
|
|
||||||
moduleThreads,
|
|
||||||
allowedTagIds,
|
|
||||||
// admin 是否已确认该模块展示的智能体类型（配置了标签）。
|
|
||||||
hasConfiguredType: allowedTagIds.length > 0,
|
|
||||||
isLoading: agentsLoading || configLoading,
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 「按类型聚合智能体 + 聊天记录」左栏（需求 0616 #3 zzJC / #4 zzXD）。
|
|
||||||
*
|
|
||||||
* - 上半：可见智能体按标签（类型）分组、可折叠；点击进入该智能体对话（保持当前路由
|
|
||||||
* 命名空间，全量模式下为 /page/strategy）。
|
|
||||||
* - 下半：聊天记录 —— 仅与本模块智能体（即左栏列出的智能体）的会话，按 metadata.agent_id 过滤。
|
|
||||||
* - 宽度与通用问答左栏一致（``--sidebar-width``）。
|
|
||||||
*/
|
|
||||||
export function AgentModuleSidebar({
|
|
||||||
moduleKey,
|
|
||||||
activeAgentId,
|
|
||||||
activeThreadId,
|
|
||||||
routeBase: routeBaseProp,
|
|
||||||
headerTitle = "智能体",
|
|
||||||
className,
|
|
||||||
onOpenSettings,
|
|
||||||
}: {
|
|
||||||
moduleKey: string;
|
|
||||||
activeAgentId?: string;
|
|
||||||
activeThreadId?: string;
|
|
||||||
routeBase?: string;
|
|
||||||
headerTitle?: string;
|
|
||||||
className?: string;
|
|
||||||
/** 传入则在左栏顶部显示设置齿轮（admin）。 */
|
|
||||||
onOpenSettings?: () => void;
|
|
||||||
}) {
|
|
||||||
const contextRouteBase = useRouteBase();
|
|
||||||
const routeBase = routeBaseProp ?? contextRouteBase;
|
|
||||||
const pathname = usePathname();
|
|
||||||
// 智能体图标配色分主题：深蓝主题用规范蓝-青系，其它（浅色）保持原高彩度色，互不影响。
|
|
||||||
const { theme } = useTheme();
|
|
||||||
const isDark = theme === "dark";
|
|
||||||
const [collapsed, setCollapsed] = useState<Set<string>>(() => new Set());
|
|
||||||
const { groups, moduleThreads, hasConfiguredType } =
|
|
||||||
useAgentModuleSidebarData(moduleKey);
|
|
||||||
// 已确认智能体类型时，允许把上半「智能体类型」整块收起，把空间让给下半聊天记录。
|
|
||||||
const [agentsSectionCollapsed, setAgentsSectionCollapsed] = useState(false);
|
|
||||||
const agentsCollapsed = hasConfiguredType && agentsSectionCollapsed;
|
|
||||||
|
|
||||||
const toggleGroup = (key: string) =>
|
const toggleGroup = (key: string) =>
|
||||||
setCollapsed((prev) => {
|
setCollapsed((prev) => {
|
||||||
const next = new Set(prev);
|
const next = new Set(prev);
|
||||||
@@ -197,267 +164,109 @@ export function AgentModuleSidebar({
|
|||||||
return next;
|
return next;
|
||||||
});
|
});
|
||||||
|
|
||||||
// 已确认类型时把所有分组的智能体拍平（单选类型一般只有一个分组），
|
|
||||||
// 标题行直接显示该类型名 + 数量，去掉额外的分组行。
|
|
||||||
const flatAgents = useMemo(() => groups.flatMap((g) => g.agents), [groups]);
|
|
||||||
const configuredTypeLabel =
|
|
||||||
groups.length === 1 ? (groups[0]?.label ?? "智能体类型") : "智能体类型";
|
|
||||||
|
|
||||||
const renderAgentCard = (agent: Agent, keyPrefix: string) => {
|
|
||||||
const href = `${routeBase}/agents/${agent.id}/chats/new`;
|
|
||||||
const isActive = agent.id === activeAgentId;
|
|
||||||
const { from, to } = agentColor(agent.id, isDark);
|
|
||||||
return (
|
|
||||||
<Link
|
|
||||||
key={`${keyPrefix}:${agent.id}`}
|
|
||||||
href={href}
|
|
||||||
onClick={() => {
|
|
||||||
try {
|
|
||||||
sessionStorage.setItem(`agent-module:${moduleKey}:last-agent`, agent.id);
|
|
||||||
} catch {
|
|
||||||
// Ignore storage failures; route navigation is the source of truth.
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
className={cn(
|
|
||||||
"group relative flex w-full items-start gap-3 rounded-xl border px-3 py-2.5 transition-all duration-150",
|
|
||||||
isActive
|
|
||||||
? isDark
|
|
||||||
? "border-[#2b8ffe] bg-[#0b4fae]/65 shadow-[0_0_0_1px_rgba(43,143,254,0.5),0_12px_28px_rgba(37,128,255,0.25)]"
|
|
||||||
: "agent-sidebar-card--active border-primary/50 bg-primary/10 shadow-sm"
|
|
||||||
: isDark
|
|
||||||
? "border-[#2b8ffe]/20 bg-[#042b59]/35 hover:border-[#2b8ffe]/60 hover:bg-[#063b77]/60"
|
|
||||||
: "border-transparent hover:border-border hover:bg-accent/50",
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
<span
|
|
||||||
className={cn(
|
|
||||||
"mt-0.5 flex size-10 shrink-0 items-center justify-center rounded-lg text-white shadow-sm",
|
|
||||||
isDark &&
|
|
||||||
isActive &&
|
|
||||||
"ring-2 ring-[#83c1ff]/35 shadow-[0_0_18px_rgba(43,143,254,0.45)]",
|
|
||||||
)}
|
|
||||||
style={{ backgroundImage: `linear-gradient(135deg, ${from}, ${to})` }}
|
|
||||||
>
|
|
||||||
<Bot className="size-[19px]" />
|
|
||||||
</span>
|
|
||||||
<span className="min-w-0 flex-1">
|
|
||||||
<span
|
|
||||||
className={cn(
|
|
||||||
"block truncate text-[16px] leading-5 font-bold",
|
|
||||||
isActive
|
|
||||||
? isDark
|
|
||||||
? "text-white"
|
|
||||||
: "text-primary"
|
|
||||||
: isDark
|
|
||||||
? "text-white/95"
|
|
||||||
: "text-foreground",
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
{desensitize(agent.name)}
|
|
||||||
</span>
|
|
||||||
<span
|
|
||||||
className={cn(
|
|
||||||
"mt-1 block truncate text-[13px] leading-[1.35]",
|
|
||||||
isDark
|
|
||||||
? isActive
|
|
||||||
? "text-[#d6eaff]"
|
|
||||||
: "text-[#9ebfe2]"
|
|
||||||
: "text-muted-foreground",
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
{agent.description ? desensitize(agent.description) : "智能体助手"}
|
|
||||||
</span>
|
|
||||||
</span>
|
|
||||||
{isActive && (
|
|
||||||
<span
|
|
||||||
className={cn(
|
|
||||||
"absolute top-1/2 right-1.5 h-8 w-1.5 -translate-y-1/2 rounded-full",
|
|
||||||
isDark
|
|
||||||
? "bg-[#2b8ffe] shadow-[0_0_14px_rgba(43,143,254,0.85)]"
|
|
||||||
: "bg-primary",
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
</Link>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
// 原有布局不变，仅做配色适配：深色下左栏改为半透明深蓝玻璃面板（对齐 .sidebar-contents：
|
<aside className="flex h-full w-(--sidebar-width) shrink-0 flex-col overflow-hidden border-r border-border/70 bg-card/60 backdrop-blur-sm">
|
||||||
// bg rgba(3,38,80,.8) + 蓝色发光边框），叠 backdrop-blur 让外壳的深蓝底图朦胧透出；
|
|
||||||
// 浅色保持白底。其余颜色已走语义 token 自适配。
|
|
||||||
<aside
|
|
||||||
className={cn(
|
|
||||||
"flex h-full w-(--sidebar-width) shrink-0 flex-col overflow-hidden border-r border-border/70 bg-white text-foreground backdrop-blur-md dark:border-[#2b8ffe]/45 dark:bg-[#032650]/80",
|
|
||||||
className,
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
{onOpenSettings && (
|
{onOpenSettings && (
|
||||||
<div className="flex shrink-0 items-center justify-between border-b border-border/60 px-3 py-2">
|
<div className="flex shrink-0 items-center justify-between border-b border-border/60 px-3 py-2">
|
||||||
<span className="text-xs font-semibold text-foreground/80">
|
<span className="text-xs font-semibold text-foreground/80">智能体</span>
|
||||||
{headerTitle}
|
|
||||||
</span>
|
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
onClick={onOpenSettings}
|
onClick={onOpenSettings}
|
||||||
title="模块设置"
|
title="模块设置"
|
||||||
aria-label="模块设置"
|
aria-label="模块设置"
|
||||||
className="text-muted-foreground hover:text-foreground rounded-md p-1 transition-colors hover:bg-accent/60"
|
className="text-muted-foreground hover:text-foreground rounded-md p-1 transition-colors hover:bg-sidebar-accent/60"
|
||||||
>
|
>
|
||||||
<Settings className="size-4" />
|
<Settings className="size-4" />
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{/* 上半：智能体列表。
|
{/* 上半：按类型分组的智能体 */}
|
||||||
- 未确认类型：按类型分组、可逐组折叠（与全量版一致）。
|
<div className="flex min-h-0 flex-[3] flex-col overflow-y-auto px-2 py-3">
|
||||||
- 已确认类型：标题行直接显示该类型名 + 数量（去掉单独的分组行），
|
<h2 className="text-muted-foreground/70 px-2 mb-1.5 text-[10px] font-semibold tracking-[0.12em] uppercase select-none">
|
||||||
扁平列出该类型下的智能体，并可整块收起（grid 行高过渡动画），
|
智能体类型
|
||||||
收起后只留标题、把高度让给下半聊天记录。 */}
|
</h2>
|
||||||
<div
|
{groups.length === 0 ? (
|
||||||
className={cn(
|
<p className="px-2 py-1.5 text-xs text-muted-foreground/70">暂无智能体</p>
|
||||||
"flex flex-col px-2 py-3",
|
|
||||||
agentsCollapsed ? "shrink-0" : "min-h-0 flex-[3]",
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
{hasConfiguredType ? (
|
|
||||||
<>
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
onClick={() => setAgentsSectionCollapsed((prev) => !prev)}
|
|
||||||
title={agentsCollapsed ? "展开智能体" : "收起智能体"}
|
|
||||||
className="flex shrink-0 items-center justify-between px-3 py-1 text-[11px] font-semibold tracking-[0.04em] text-muted-foreground/80 transition-colors hover:text-muted-foreground select-none"
|
|
||||||
>
|
|
||||||
<span className="flex items-center gap-1.5 truncate">
|
|
||||||
<span className="truncate">{configuredTypeLabel}</span>
|
|
||||||
<span className="rounded-full bg-muted px-1.5 py-0.5 text-[10px] font-normal text-muted-foreground tabular-nums">
|
|
||||||
{flatAgents.length}
|
|
||||||
</span>
|
|
||||||
</span>
|
|
||||||
<ChevronDown
|
|
||||||
className={cn(
|
|
||||||
"size-3.5 shrink-0 transition-transform duration-300",
|
|
||||||
agentsCollapsed && "-rotate-90",
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
</button>
|
|
||||||
<div
|
|
||||||
className={cn(
|
|
||||||
"grid transition-[grid-template-rows] duration-300 ease-in-out",
|
|
||||||
agentsCollapsed
|
|
||||||
? "grid-rows-[0fr]"
|
|
||||||
: "mt-1 min-h-0 flex-1 grid-rows-[1fr]",
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
<div
|
|
||||||
className={cn(
|
|
||||||
"min-h-0",
|
|
||||||
agentsCollapsed
|
|
||||||
? "overflow-hidden"
|
|
||||||
: "overflow-y-auto overflow-x-hidden",
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
{flatAgents.length === 0 ? (
|
|
||||||
<p className="px-3 py-1.5 text-xs text-muted-foreground/70">
|
|
||||||
暂无智能体
|
|
||||||
</p>
|
|
||||||
) : (
|
|
||||||
<div className="flex flex-col gap-1">
|
|
||||||
{flatAgents.map((agent) =>
|
|
||||||
renderAgentCard(agent, "configured"),
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
) : (
|
) : (
|
||||||
<>
|
<div className="flex flex-col gap-0.5">
|
||||||
<h2 className="mb-1 shrink-0 px-3 py-1 text-[11px] font-semibold tracking-[0.04em] text-muted-foreground/80 select-none">
|
{groups.map((group) => {
|
||||||
智能体类型
|
const isCollapsed = collapsed.has(group.key);
|
||||||
</h2>
|
return (
|
||||||
<div className="min-h-0 flex-1 overflow-y-auto overflow-x-hidden">
|
<div key={group.key}>
|
||||||
{groups.length === 0 ? (
|
<button
|
||||||
<p className="px-3 py-1.5 text-xs text-muted-foreground/70">
|
type="button"
|
||||||
暂无智能体
|
onClick={() => toggleGroup(group.key)}
|
||||||
</p>
|
className="flex w-full items-center justify-between gap-1 rounded-lg px-2 py-1.5 text-xs font-semibold text-foreground/80 hover:bg-sidebar-accent/60"
|
||||||
) : (
|
>
|
||||||
<div className="flex flex-col gap-1.5">
|
<span className="flex items-center gap-1.5 truncate">
|
||||||
{groups.map((group) => {
|
<span className="truncate">{group.label}</span>
|
||||||
const isCollapsed = collapsed.has(group.key);
|
<span className="text-muted-foreground/60 text-[10px] font-normal tabular-nums">
|
||||||
return (
|
{group.agents.length}
|
||||||
<div key={group.key}>
|
</span>
|
||||||
<button
|
</span>
|
||||||
type="button"
|
<ChevronDown
|
||||||
onClick={() => toggleGroup(group.key)}
|
className={cn(
|
||||||
className="flex w-full items-center justify-between px-3 py-1 text-[11px] font-semibold tracking-[0.04em] text-muted-foreground/80 transition-colors hover:text-muted-foreground select-none"
|
"size-3.5 shrink-0 transition-transform duration-200",
|
||||||
>
|
isCollapsed && "-rotate-90",
|
||||||
<span className="flex items-center gap-1.5 truncate">
|
)}
|
||||||
<span className="truncate">{group.label}</span>
|
/>
|
||||||
<span className="rounded-full bg-muted px-1.5 py-0.5 text-[10px] font-normal text-muted-foreground tabular-nums">
|
</button>
|
||||||
{group.agents.length}
|
{!isCollapsed && (
|
||||||
</span>
|
<div className="mt-0.5 flex flex-col gap-0.5 pl-1">
|
||||||
</span>
|
{group.agents.map((agent) => {
|
||||||
<ChevronDown
|
const href = `${routeBase}/agents/${agent.id}/chats/new`;
|
||||||
|
const isActive = agent.id === activeAgentId;
|
||||||
|
return (
|
||||||
|
<Link
|
||||||
|
key={`${group.key}:${agent.id}`}
|
||||||
|
href={href}
|
||||||
className={cn(
|
className={cn(
|
||||||
"size-3.5 shrink-0 transition-transform duration-200",
|
"flex items-center gap-2 rounded-lg px-2.5 py-1.5 text-[13px] text-muted-foreground hover:text-foreground hover:bg-sidebar-accent/60",
|
||||||
isCollapsed && "-rotate-90",
|
isActive &&
|
||||||
|
"bg-primary/10 text-primary hover:bg-primary/15 hover:text-primary",
|
||||||
)}
|
)}
|
||||||
/>
|
>
|
||||||
</button>
|
<Bot className="size-3.5 shrink-0 text-muted-foreground/70" />
|
||||||
{!isCollapsed && (
|
<span className="truncate">{desensitize(agent.name)}</span>
|
||||||
<div className="mt-1 flex flex-col gap-1">
|
</Link>
|
||||||
{group.agents.map((agent) =>
|
);
|
||||||
renderAgentCard(agent, group.key),
|
})}
|
||||||
)}
|
</div>
|
||||||
</div>
|
)}
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
</div>
|
</div>
|
||||||
)}
|
);
|
||||||
</div>
|
})}
|
||||||
</>
|
</div>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* 下半：聊天记录（仅本模块智能体会话），简单列表、配色与全量版统一 */}
|
{/* 下半：聊天记录（仅本模块智能体会话） */}
|
||||||
<div className="flex min-h-0 flex-[2] flex-col overflow-y-auto border-t border-border/60 px-2 py-3">
|
<div className="flex min-h-0 flex-[2] flex-col overflow-y-auto border-t border-border/60 px-2 py-3">
|
||||||
<h2 className="mb-1 px-3 py-1 text-[11px] font-semibold tracking-[0.04em] text-muted-foreground/80 select-none">
|
<h2 className="text-muted-foreground/70 px-2 mb-1.5 text-[10px] font-semibold tracking-[0.12em] uppercase select-none">
|
||||||
聊天记录
|
聊天记录
|
||||||
</h2>
|
</h2>
|
||||||
{moduleThreads.length === 0 ? (
|
{moduleThreads.length === 0 ? (
|
||||||
<p className="px-3 py-1.5 text-xs text-muted-foreground/70">暂无聊天记录</p>
|
<p className="px-2 py-1.5 text-xs text-muted-foreground/70">暂无聊天记录</p>
|
||||||
) : (
|
) : (
|
||||||
<div className="flex flex-col gap-0.5">
|
<div className="flex flex-col gap-0.5">
|
||||||
{moduleThreads.map((thread) => {
|
{moduleThreads.map((thread) => {
|
||||||
const href = pathOfThread(thread, undefined, routeBase);
|
const href = pathOfThread(thread, undefined, routeBase);
|
||||||
const isActive =
|
const isActive = href === pathname;
|
||||||
thread.thread_id === activeThreadId || href === pathname;
|
|
||||||
return (
|
return (
|
||||||
<Link
|
<Link
|
||||||
key={thread.thread_id}
|
key={thread.thread_id}
|
||||||
href={href}
|
href={href}
|
||||||
className={cn(
|
className={cn(
|
||||||
"relative flex h-9 min-w-0 items-center gap-2 rounded-lg px-2.5 text-[13px] transition-colors",
|
"flex items-center gap-2 rounded-lg px-2.5 py-1.5 text-[13px] text-muted-foreground hover:text-foreground hover:bg-sidebar-accent/60",
|
||||||
isActive
|
isActive &&
|
||||||
? "border border-primary/40 bg-primary/5 font-medium text-primary"
|
"bg-primary/10 text-primary hover:bg-primary/15 hover:text-primary",
|
||||||
: "text-muted-foreground hover:bg-accent/60 hover:text-foreground",
|
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<MessageSquare
|
<MessageSquare className="size-3.5 shrink-0 text-muted-foreground/70" />
|
||||||
className={cn(
|
|
||||||
"size-3.5 shrink-0",
|
|
||||||
isActive ? "text-primary" : "text-muted-foreground/70",
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
<span className="truncate">
|
<span className="truncate">
|
||||||
{desensitize(titleOfThread(thread, "未命名对话"))}
|
{desensitize(titleOfThread(thread, "未命名对话"))}
|
||||||
</span>
|
</span>
|
||||||
{isActive && (
|
|
||||||
<span className="absolute top-1/2 right-1 h-5 w-1 -translate-y-1/2 rounded-full bg-primary" />
|
|
||||||
)}
|
|
||||||
</Link>
|
</Link>
|
||||||
);
|
);
|
||||||
})}
|
})}
|
||||||
|
|||||||
@@ -1,79 +0,0 @@
|
|||||||
"use client";
|
|
||||||
|
|
||||||
import { MessageSquareIcon } from "lucide-react";
|
|
||||||
import Link from "next/link";
|
|
||||||
import { usePathname } from "next/navigation";
|
|
||||||
|
|
||||||
import { useThreadsPage } from "@/core/threads/hooks";
|
|
||||||
import { pathOfThread, titleOfThread } from "@/core/threads/utils";
|
|
||||||
import { desensitize } from "@/lib/desensitize";
|
|
||||||
import { cn } from "@/lib/utils";
|
|
||||||
|
|
||||||
const RECENT_LIMIT = 8;
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 「有关此智能体的最近对话」—— 渲染在智能体详情面板底部（右下角）。
|
|
||||||
* 按 `metadata.agent_id` 过滤出该智能体的会话，点击直接打开对应对话。
|
|
||||||
*/
|
|
||||||
export function AgentRecentChats({ agentId }: { agentId: string }) {
|
|
||||||
const pathname = usePathname();
|
|
||||||
const { data } = useThreadsPage({
|
|
||||||
page: 1,
|
|
||||||
pageSize: RECENT_LIMIT,
|
|
||||||
metadata: { agent_id: agentId },
|
|
||||||
});
|
|
||||||
// 该智能体的会话里同样排除调度 / 引导 / 会商类系统会话。
|
|
||||||
const threads = (data?.threads ?? []).filter(
|
|
||||||
(th) =>
|
|
||||||
th.metadata?.thread_type !== "bootstrap" &&
|
|
||||||
th.metadata?.thread_type !== "scheduler" &&
|
|
||||||
th.metadata?.thread_type !== "roundtable",
|
|
||||||
);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<section className="bg-card/60 rounded-xl border p-4">
|
|
||||||
<div className="mb-3 flex items-center justify-between gap-2">
|
|
||||||
<h4 className="text-foreground flex items-center gap-1.5 text-sm font-semibold">
|
|
||||||
<MessageSquareIcon className="size-3.5" />
|
|
||||||
最近对话
|
|
||||||
</h4>
|
|
||||||
<span className="text-muted-foreground text-xs tabular-nums">
|
|
||||||
{threads.length} 个
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
{threads.length === 0 ? (
|
|
||||||
<p className="text-muted-foreground/60 text-sm">暂无对话</p>
|
|
||||||
) : (
|
|
||||||
<div className="flex flex-col gap-1">
|
|
||||||
{threads.map((thread) => {
|
|
||||||
const href = pathOfThread(thread);
|
|
||||||
const isActive = href === pathname;
|
|
||||||
return (
|
|
||||||
<Link
|
|
||||||
key={thread.thread_id}
|
|
||||||
href={href}
|
|
||||||
title={desensitize(titleOfThread(thread, "新对话"))}
|
|
||||||
className={cn(
|
|
||||||
"flex min-w-0 items-center gap-2 rounded-lg px-2 py-1.5 text-sm transition-colors",
|
|
||||||
isActive
|
|
||||||
? "bg-primary/5 text-primary font-medium"
|
|
||||||
: "text-muted-foreground hover:bg-accent hover:text-foreground",
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
<MessageSquareIcon
|
|
||||||
className={cn(
|
|
||||||
"size-3.5 shrink-0",
|
|
||||||
isActive ? "text-primary" : "text-muted-foreground/70",
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
<span className="truncate">
|
|
||||||
{desensitize(titleOfThread(thread, "新对话"))}
|
|
||||||
</span>
|
|
||||||
</Link>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</section>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@@ -20,7 +20,6 @@ import {
|
|||||||
} from "@/components/ui/dialog";
|
} from "@/components/ui/dialog";
|
||||||
import { PromptInputButton } from "@/components/ai-elements/prompt-input";
|
import { PromptInputButton } from "@/components/ai-elements/prompt-input";
|
||||||
import { AgentManageDialog } from "@/components/workspace/agents/agent-manage-dialog";
|
import { AgentManageDialog } from "@/components/workspace/agents/agent-manage-dialog";
|
||||||
import { Tooltip } from "@/components/workspace/tooltip";
|
|
||||||
import { useAgentSelector, useAgentsPaginated } from "@/core/agents";
|
import { useAgentSelector, useAgentsPaginated } from "@/core/agents";
|
||||||
import type { Agent } from "@/core/agents";
|
import type { Agent } from "@/core/agents";
|
||||||
import { getStoredAuth } from "@/core/auth";
|
import { getStoredAuth } from "@/core/auth";
|
||||||
@@ -33,10 +32,6 @@ interface AgentSelectorProps {
|
|||||||
disabled?: boolean;
|
disabled?: boolean;
|
||||||
/** 紧凑模式（CM 参考图）：触发器改为灰底胶囊 + 主色机器人图标。 */
|
/** 紧凑模式（CM 参考图）：触发器改为灰底胶囊 + 主色机器人图标。 */
|
||||||
compact?: boolean;
|
compact?: boolean;
|
||||||
/** 图标模式：用于 iframe 等底栏场景，仅显示机器人图标和可选清空按钮。 */
|
|
||||||
triggerVariant?: "default" | "icon";
|
|
||||||
iconButtonClassName?: string;
|
|
||||||
iconActiveClassName?: string;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -53,9 +48,6 @@ export function AgentSelector({
|
|||||||
onAgentChange,
|
onAgentChange,
|
||||||
disabled,
|
disabled,
|
||||||
compact = false,
|
compact = false,
|
||||||
triggerVariant = "default",
|
|
||||||
iconButtonClassName,
|
|
||||||
iconActiveClassName,
|
|
||||||
}: AgentSelectorProps) {
|
}: AgentSelectorProps) {
|
||||||
const [open, setOpen] = useState(false);
|
const [open, setOpen] = useState(false);
|
||||||
const [manageOpen, setManageOpen] = useState(false);
|
const [manageOpen, setManageOpen] = useState(false);
|
||||||
@@ -87,87 +79,48 @@ export function AgentSelector({
|
|||||||
};
|
};
|
||||||
|
|
||||||
const triggerLabel = selectedAgent ? desensitize(selectedAgent.name) : "选择 Agent";
|
const triggerLabel = selectedAgent ? desensitize(selectedAgent.name) : "选择 Agent";
|
||||||
const iconTooltipLabel = selectedAgent ? triggerLabel : "未选择";
|
|
||||||
const iconMode = triggerVariant === "icon";
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Dialog open={open} onOpenChange={setOpen}>
|
<Dialog open={open} onOpenChange={setOpen}>
|
||||||
<DialogTrigger asChild>
|
<DialogTrigger asChild>
|
||||||
{iconMode ? (
|
<PromptInputButton
|
||||||
<Tooltip content={iconTooltipLabel}>
|
type="button"
|
||||||
<Button
|
disabled={disabled}
|
||||||
type="button"
|
className={cn(
|
||||||
variant="ghost"
|
"gap-1.5! rounded-full border px-3! shadow-none transition-colors",
|
||||||
size="icon"
|
compact && "rounded-lg px-2.5! py-1! text-[11px] font-medium",
|
||||||
disabled={disabled}
|
compact
|
||||||
aria-label={selectedAgent ? `已选择智能体：${triggerLabel}` : "选择智能体"}
|
? "border-transparent bg-gray-50/60 text-gray-600 hover:bg-gray-100/80 hover:text-gray-800 dark:bg-slate-700/50 dark:text-slate-300 dark:hover:bg-slate-700"
|
||||||
className={cn(
|
: selectedAgent
|
||||||
"relative size-9 rounded-full text-muted-foreground shadow-none hover:bg-muted/60 hover:text-foreground",
|
? "border-[#d6a868] bg-[#fff3df] text-[#7a5417] hover:bg-[#ffe8c4]"
|
||||||
selectedAgent && "text-amber-600 hover:text-amber-700",
|
: "border-[#eee3d5] bg-[#fffaf5] text-[#7e6a57] hover:bg-white dark:border-slate-600 dark:bg-slate-700/50 dark:text-slate-300 dark:hover:bg-slate-700",
|
||||||
selectedAgent && iconActiveClassName,
|
)}
|
||||||
iconButtonClassName,
|
>
|
||||||
)}
|
<BotIcon
|
||||||
|
className={cn("size-3", compact && "text-[var(--primary)]")}
|
||||||
|
/>
|
||||||
|
<span className="max-w-[140px] truncate text-xs font-normal">
|
||||||
|
{triggerLabel}
|
||||||
|
</span>
|
||||||
|
{selectedAgent && (
|
||||||
|
<span
|
||||||
|
role="button"
|
||||||
|
tabIndex={0}
|
||||||
|
aria-label="清除已选 agent"
|
||||||
|
className="ml-0.5 inline-flex items-center justify-center rounded-full p-0.5 hover:bg-[#ffd9a7]"
|
||||||
|
onClick={handleClear}
|
||||||
|
onKeyDown={(e) => {
|
||||||
|
if (e.key === "Enter" || e.key === " ") {
|
||||||
|
e.preventDefault();
|
||||||
|
onAgentChange(null);
|
||||||
|
}
|
||||||
|
}}
|
||||||
>
|
>
|
||||||
<BotIcon className="size-4" />
|
<XIcon className="size-3" />
|
||||||
{selectedAgent && (
|
|
||||||
<span
|
|
||||||
role="button"
|
|
||||||
tabIndex={0}
|
|
||||||
aria-label="清除已选 agent"
|
|
||||||
className="absolute -right-1 -top-1 inline-flex size-4 items-center justify-center rounded-full border bg-background text-foreground shadow-sm hover:bg-muted"
|
|
||||||
onClick={handleClear}
|
|
||||||
onKeyDown={(e) => {
|
|
||||||
if (e.key === "Enter" || e.key === " ") {
|
|
||||||
e.preventDefault();
|
|
||||||
onAgentChange(null);
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<XIcon className="size-2.5" />
|
|
||||||
</span>
|
|
||||||
)}
|
|
||||||
</Button>
|
|
||||||
</Tooltip>
|
|
||||||
) : (
|
|
||||||
<PromptInputButton
|
|
||||||
type="button"
|
|
||||||
disabled={disabled}
|
|
||||||
className={cn(
|
|
||||||
"gap-1.5! rounded-full border px-3! shadow-none transition-colors",
|
|
||||||
compact && "rounded-lg px-2.5! py-1! text-[11px] font-medium",
|
|
||||||
compact
|
|
||||||
? "border-transparent bg-gray-50/60 text-gray-600 hover:bg-gray-100/80 hover:text-gray-800 dark:bg-slate-700/50 dark:text-slate-300 dark:hover:bg-slate-700"
|
|
||||||
: selectedAgent
|
|
||||||
? "border-[#d6a868] bg-[#fff3df] text-[#7a5417] hover:bg-[#ffe8c4]"
|
|
||||||
: "border-[#eee3d5] bg-[#fffaf5] text-[#7e6a57] hover:bg-white dark:border-slate-600 dark:bg-slate-700/50 dark:text-slate-300 dark:hover:bg-slate-700",
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
<BotIcon
|
|
||||||
className={cn("size-3", compact && "text-[var(--primary)]")}
|
|
||||||
/>
|
|
||||||
<span className="max-w-[140px] truncate text-xs font-normal">
|
|
||||||
{triggerLabel}
|
|
||||||
</span>
|
</span>
|
||||||
{selectedAgent && (
|
)}
|
||||||
<span
|
</PromptInputButton>
|
||||||
role="button"
|
|
||||||
tabIndex={0}
|
|
||||||
aria-label="清除已选 agent"
|
|
||||||
className="ml-0.5 inline-flex items-center justify-center rounded-full p-0.5 hover:bg-[#ffd9a7]"
|
|
||||||
onClick={handleClear}
|
|
||||||
onKeyDown={(e) => {
|
|
||||||
if (e.key === "Enter" || e.key === " ") {
|
|
||||||
e.preventDefault();
|
|
||||||
onAgentChange(null);
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<XIcon className="size-3" />
|
|
||||||
</span>
|
|
||||||
)}
|
|
||||||
</PromptInputButton>
|
|
||||||
)}
|
|
||||||
</DialogTrigger>
|
</DialogTrigger>
|
||||||
<DialogContent className="overflow-hidden p-0 sm:max-w-md">
|
<DialogContent className="overflow-hidden p-0 sm:max-w-md">
|
||||||
<DialogTitle className="sr-only">选择 Agent</DialogTitle>
|
<DialogTitle className="sr-only">选择 Agent</DialogTitle>
|
||||||
|
|||||||
@@ -1,233 +0,0 @@
|
|||||||
"use client";
|
|
||||||
|
|
||||||
import { Check, ExternalLink, LayoutIcon, PanelLeftIcon, Shirt } from "lucide-react";
|
|
||||||
import { useEffect, useRef, useState } from "react";
|
|
||||||
import { useNavigate } from "react-router-dom";
|
|
||||||
|
|
||||||
import { Button } from "@/components/ui/button";
|
|
||||||
import {
|
|
||||||
DropdownMenu,
|
|
||||||
DropdownMenuContent,
|
|
||||||
DropdownMenuItem,
|
|
||||||
DropdownMenuLabel,
|
|
||||||
DropdownMenuSeparator,
|
|
||||||
DropdownMenuTrigger,
|
|
||||||
} from "@/components/ui/dropdown-menu";
|
|
||||||
import { useTheme, type ThemeType } from "@/contexts/ThemeContext";
|
|
||||||
import { useAppearanceSettings, useLayoutMode } from "@/core/system-settings/hooks";
|
|
||||||
import { cn } from "@/lib/utils";
|
|
||||||
import { buildLightAppUrl } from "@/strategy-components/lib/light-app";
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 换肤 / 界面模式 顶栏控件。深色顶栏（Header）与简洁模式页面级顶栏（ChatPage 等）共用，
|
|
||||||
* 通过 `tone` 适配不同底色：
|
|
||||||
* - "banner-dark" / "banner-light"：Header 落在主题 banner 上（白字 / 浅色 hover）。
|
|
||||||
* - "content"：简洁模式聊天页浅底顶栏，走 foreground / muted-foreground。
|
|
||||||
*/
|
|
||||||
export type AppearanceControlTone = "banner-dark" | "banner-light" | "content";
|
|
||||||
|
|
||||||
// 换肤色板：红色=红白主题(light)，蓝色=浅蓝主题(lightblue)，深蓝色=深色主题(dark)
|
|
||||||
export const THEME_SWATCHES: { id: ThemeType; label: string; color: string }[] = [
|
|
||||||
{ id: "light", label: "红色", color: "#cf1322" },
|
|
||||||
{ id: "lightblue", label: "蓝色", color: "#0062d9" },
|
|
||||||
{ id: "dark", label: "深蓝色", color: "#002466" },
|
|
||||||
];
|
|
||||||
|
|
||||||
const triggerToneClass = (tone: AppearanceControlTone) =>
|
|
||||||
tone === "banner-dark"
|
|
||||||
? "text-slate-400 hover:bg-slate-800/50 hover:text-slate-400"
|
|
||||||
: tone === "banner-light"
|
|
||||||
? "text-white hover:bg-[var(--brand-950)] hover:text-white active:bg-[#8a0618]"
|
|
||||||
: "text-muted-foreground hover:bg-muted hover:text-foreground";
|
|
||||||
|
|
||||||
export function CompactShortcutButtons({ tone }: { tone: AppearanceControlTone }) {
|
|
||||||
const { data: appearance } = useAppearanceSettings();
|
|
||||||
const buttons = (appearance?.compact_shortcut_buttons ?? [])
|
|
||||||
.filter((button) => button.enabled && button.label.trim() && button.url.trim())
|
|
||||||
.sort((a, b) => a.sort_order - b.sort_order);
|
|
||||||
|
|
||||||
if (buttons.length === 0) return null;
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
{buttons.map((button) => (
|
|
||||||
<Button
|
|
||||||
key={button.id}
|
|
||||||
type="button"
|
|
||||||
variant="ghost"
|
|
||||||
size="sm"
|
|
||||||
className={cn(
|
|
||||||
"h-8 max-w-[168px] shrink-0 gap-1.5 rounded-sm px-2 text-xs font-medium",
|
|
||||||
triggerToneClass(tone),
|
|
||||||
)}
|
|
||||||
title={button.label}
|
|
||||||
onClick={() => {
|
|
||||||
const url = buildLightAppUrl({
|
|
||||||
url: button.url,
|
|
||||||
routeParams: button.route_params.map((param) => ({ ...param })),
|
|
||||||
});
|
|
||||||
window.open(url, "_blank", "noopener,noreferrer");
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<ExternalLink className="size-4 shrink-0" />
|
|
||||||
<span className="truncate">{button.label}</span>
|
|
||||||
</Button>
|
|
||||||
))}
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export function ThemeSwitcher({ tone }: { tone: AppearanceControlTone }) {
|
|
||||||
const { theme, setTheme } = useTheme();
|
|
||||||
const [open, setOpen] = useState(false);
|
|
||||||
const closeTimer = useRef<ReturnType<typeof setTimeout> | null>(null);
|
|
||||||
|
|
||||||
const cancelClose = () => {
|
|
||||||
if (closeTimer.current) {
|
|
||||||
clearTimeout(closeTimer.current);
|
|
||||||
closeTimer.current = null;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
const scheduleClose = () => {
|
|
||||||
cancelClose();
|
|
||||||
closeTimer.current = setTimeout(() => setOpen(false), 120);
|
|
||||||
};
|
|
||||||
|
|
||||||
useEffect(() => () => cancelClose(), []);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div
|
|
||||||
className="relative"
|
|
||||||
onMouseEnter={() => {
|
|
||||||
cancelClose();
|
|
||||||
setOpen(true);
|
|
||||||
}}
|
|
||||||
onMouseLeave={scheduleClose}
|
|
||||||
>
|
|
||||||
<Button
|
|
||||||
type="button"
|
|
||||||
variant="ghost"
|
|
||||||
size="icon-sm"
|
|
||||||
className={cn("size-8 shrink-0 rounded-sm", triggerToneClass(tone))}
|
|
||||||
title="换肤"
|
|
||||||
aria-haspopup="true"
|
|
||||||
aria-expanded={open}
|
|
||||||
>
|
|
||||||
<Shirt className="size-4" />
|
|
||||||
</Button>
|
|
||||||
{open ? (
|
|
||||||
<div className="absolute top-full left-1/2 z-50 -translate-x-1/2 pt-2">
|
|
||||||
<div className="relative flex items-center gap-2 rounded-lg border border-black/5 bg-white px-2.5 py-1.5 shadow-lg">
|
|
||||||
<div className="absolute -top-1 left-1/2 size-2 -translate-x-1/2 rotate-45 rounded-[1px] border-t border-l border-black/5 bg-white" />
|
|
||||||
{THEME_SWATCHES.map((swatch) => {
|
|
||||||
const active = theme === swatch.id;
|
|
||||||
return (
|
|
||||||
<button
|
|
||||||
key={swatch.id}
|
|
||||||
type="button"
|
|
||||||
title={swatch.label}
|
|
||||||
aria-label={swatch.label}
|
|
||||||
aria-pressed={active}
|
|
||||||
onClick={() => {
|
|
||||||
setTheme(swatch.id);
|
|
||||||
setOpen(false);
|
|
||||||
}}
|
|
||||||
className="size-5 rounded-full transition-transform hover:scale-110"
|
|
||||||
style={{
|
|
||||||
backgroundColor: swatch.color,
|
|
||||||
boxShadow: active
|
|
||||||
? `0 0 0 1.5px #ffffff, 0 0 0 3px ${swatch.color}`
|
|
||||||
: undefined,
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
) : null}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
const LAYOUT_OPTIONS = [
|
|
||||||
{
|
|
||||||
id: "full" as const,
|
|
||||||
label: "全量模式",
|
|
||||||
description: "展示侧边栏与顶栏导航",
|
|
||||||
icon: PanelLeftIcon,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "compact" as const,
|
|
||||||
label: "简洁模式",
|
|
||||||
description: "隐藏侧边栏与顶栏，获得更大工作区",
|
|
||||||
icon: LayoutIcon,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 界面模式（全量 / 简洁）下拉切换。换肤旁并排，图标 + 下拉：
|
|
||||||
* - 简洁模式 ChatPage 顶栏（全局顶栏被隐藏）。
|
|
||||||
* - 全量模式 Header 右上角。
|
|
||||||
* 用户未显式设置过界面模式时（mode === undefined），当前态按调用方所在的实际界面
|
|
||||||
* 兜底——`fallback` 指明这一回退值（Header 传 "full"，ChatPage 传 "compact"）。
|
|
||||||
*/
|
|
||||||
export function LayoutModeSwitcher({
|
|
||||||
tone,
|
|
||||||
fallback = "compact",
|
|
||||||
navigateTo = "/page/workspace/chats/new",
|
|
||||||
}: {
|
|
||||||
tone: AppearanceControlTone;
|
|
||||||
fallback?: "full" | "compact";
|
|
||||||
navigateTo?: string | null;
|
|
||||||
}) {
|
|
||||||
const [mode, setLayoutMode] = useLayoutMode();
|
|
||||||
const navigate = useNavigate();
|
|
||||||
const current = mode ?? fallback;
|
|
||||||
const TriggerIcon = current === "full" ? PanelLeftIcon : LayoutIcon;
|
|
||||||
|
|
||||||
return (
|
|
||||||
<DropdownMenu>
|
|
||||||
<DropdownMenuTrigger asChild>
|
|
||||||
<Button
|
|
||||||
type="button"
|
|
||||||
variant="ghost"
|
|
||||||
size="icon-sm"
|
|
||||||
className={cn("size-8 shrink-0 rounded-sm", triggerToneClass(tone))}
|
|
||||||
title="界面模式"
|
|
||||||
aria-label="界面模式"
|
|
||||||
>
|
|
||||||
<TriggerIcon className="size-4" />
|
|
||||||
</Button>
|
|
||||||
</DropdownMenuTrigger>
|
|
||||||
<DropdownMenuContent align="end" sideOffset={8} className="min-w-56 rounded-lg">
|
|
||||||
<DropdownMenuLabel>界面模式</DropdownMenuLabel>
|
|
||||||
<DropdownMenuSeparator />
|
|
||||||
{LAYOUT_OPTIONS.map((option) => {
|
|
||||||
const Icon = option.icon;
|
|
||||||
const active = current === option.id;
|
|
||||||
return (
|
|
||||||
<DropdownMenuItem
|
|
||||||
key={option.id}
|
|
||||||
onClick={() => {
|
|
||||||
setLayoutMode(option.id);
|
|
||||||
if (navigateTo) {
|
|
||||||
navigate(navigateTo);
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
className="gap-2"
|
|
||||||
>
|
|
||||||
<Icon className="size-4 shrink-0" />
|
|
||||||
<div className="flex min-w-0 flex-col">
|
|
||||||
<span className="text-sm leading-tight">{option.label}</span>
|
|
||||||
<span className="text-muted-foreground text-xs leading-tight">
|
|
||||||
{option.description}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
{active && <Check className="ml-auto size-4 shrink-0" />}
|
|
||||||
</DropdownMenuItem>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
</DropdownMenuContent>
|
|
||||||
</DropdownMenu>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@@ -11,7 +11,6 @@ import {
|
|||||||
LoaderIcon,
|
LoaderIcon,
|
||||||
PackageIcon,
|
PackageIcon,
|
||||||
SaveIcon,
|
SaveIcon,
|
||||||
SparklesIcon,
|
|
||||||
UploadCloudIcon,
|
UploadCloudIcon,
|
||||||
XIcon,
|
XIcon,
|
||||||
} from "lucide-react";
|
} from "lucide-react";
|
||||||
@@ -29,7 +28,7 @@ import {
|
|||||||
ArtifactHeader,
|
ArtifactHeader,
|
||||||
ArtifactTitle,
|
ArtifactTitle,
|
||||||
} from "@/components/ai-elements/artifact";
|
} from "@/components/ai-elements/artifact";
|
||||||
import { Select, SelectItem } from "@/components/ui/select";
|
import { Select, SelectItem } from "@/components/ui/select";
|
||||||
import {
|
import {
|
||||||
SelectContent,
|
SelectContent,
|
||||||
SelectGroup,
|
SelectGroup,
|
||||||
@@ -38,11 +37,9 @@ import {
|
|||||||
} from "@/components/ui/select";
|
} from "@/components/ui/select";
|
||||||
import { ToggleGroup, ToggleGroupItem } from "@/components/ui/toggle-group";
|
import { ToggleGroup, ToggleGroupItem } from "@/components/ui/toggle-group";
|
||||||
import { CodeEditor } from "@/components/workspace/code-editor";
|
import { CodeEditor } from "@/components/workspace/code-editor";
|
||||||
import { MarkdownAiEditor } from "@/open-canvas/components/artifact/MarkdownAiEditor";
|
|
||||||
import { publishArtifactToKnowledge } from "@/core/agents/api";
|
import { publishArtifactToKnowledge } from "@/core/agents/api";
|
||||||
import { useAgent } from "@/core/agents/hooks";
|
import { useAgent } from "@/core/agents/hooks";
|
||||||
import { apiFetch } from "@/core/api";
|
import { apiFetch } from "@/core/api";
|
||||||
import { copyTextToClipboard } from "@/core/clipboard";
|
|
||||||
import {
|
import {
|
||||||
downloadArtifactFile,
|
downloadArtifactFile,
|
||||||
} from "@/core/artifacts/download";
|
} from "@/core/artifacts/download";
|
||||||
@@ -52,8 +49,9 @@ import {
|
|||||||
} from "@/core/artifacts/hooks";
|
} from "@/core/artifacts/hooks";
|
||||||
import { resolveArtifactURL, urlOfArtifact } from "@/core/artifacts/utils";
|
import { resolveArtifactURL, urlOfArtifact } from "@/core/artifacts/utils";
|
||||||
import { useI18n } from "@/core/i18n/hooks";
|
import { useI18n } from "@/core/i18n/hooks";
|
||||||
import { downloadMarkdownAsDocx } from "@/core/scheduled-tasks/markdown-docx";
|
import { downloadMarkdownAsDocx } from "@/core/scheduled-tasks/markdown-docx";
|
||||||
import { streamdownPlugins } from "@/core/streamdown";
|
import { installSkill } from "@/core/skills/api";
|
||||||
|
import { streamdownPlugins } from "@/core/streamdown";
|
||||||
import {
|
import {
|
||||||
checkCodeFile,
|
checkCodeFile,
|
||||||
getFileName,
|
getFileName,
|
||||||
@@ -81,8 +79,7 @@ import { useThread } from "../messages/context";
|
|||||||
import { Tooltip } from "../tooltip";
|
import { Tooltip } from "../tooltip";
|
||||||
|
|
||||||
import { useArtifacts } from "./context";
|
import { useArtifacts } from "./context";
|
||||||
import { SpreadsheetPreview } from "./spreadsheet-preview";
|
import { SpreadsheetPreview } from "./spreadsheet-preview";
|
||||||
import { SkillInstallDialog } from "./skill-install-dialog";
|
|
||||||
|
|
||||||
const SANDBOX_RESUME_EVENT = "workspace:sandbox-resume-autoscroll";
|
const SANDBOX_RESUME_EVENT = "workspace:sandbox-resume-autoscroll";
|
||||||
|
|
||||||
@@ -216,10 +213,6 @@ export function ArtifactFileDetail({
|
|||||||
!useWriteFileStreaming &&
|
!useWriteFileStreaming &&
|
||||||
!isSkillFile &&
|
!isSkillFile &&
|
||||||
!isMock;
|
!isMock;
|
||||||
// 「AI 写作」md 展示开关：只要是可编辑的 markdown 就提供「AI 写作」视图（在 源码/预览 旁多一个
|
|
||||||
// 切换项），用户可随时切过去体验划词「AI 改写」。默认仍是「预览」，避免编辑器在内容加载期间
|
|
||||||
// 挂载导致白屏 + 避免复杂 md(表格/公式/HTML)误入有损编辑。
|
|
||||||
const canUseAiEditor = canEditArtifact;
|
|
||||||
const [draftContent, setDraftContent] = useState("");
|
const [draftContent, setDraftContent] = useState("");
|
||||||
const [hasLocalEdits, setHasLocalEdits] = useState(false);
|
const [hasLocalEdits, setHasLocalEdits] = useState(false);
|
||||||
const updateArtifact = useUpdateArtifactContent();
|
const updateArtifact = useUpdateArtifactContent();
|
||||||
@@ -237,9 +230,9 @@ export function ArtifactFileDetail({
|
|||||||
return "FILE";
|
return "FILE";
|
||||||
}, [filepath, isSkillFile, isSpreadsheetFile, language]);
|
}, [filepath, isSkillFile, isSpreadsheetFile, language]);
|
||||||
|
|
||||||
const [viewMode, setViewMode] = useState<"code" | "preview" | "edit">("code");
|
const [viewMode, setViewMode] = useState<"code" | "preview">("code");
|
||||||
const [allowAutoViewSwitch, setAllowAutoViewSwitch] = useState(true);
|
const [allowAutoViewSwitch, setAllowAutoViewSwitch] = useState(true);
|
||||||
const [installDialogOpen, setInstallDialogOpen] = useState(false);
|
const [isInstalling, setIsInstalling] = useState(false);
|
||||||
const [showPreviewSwitchPulse, setShowPreviewSwitchPulse] = useState(false);
|
const [showPreviewSwitchPulse, setShowPreviewSwitchPulse] = useState(false);
|
||||||
const [autoScrollEnabled, setAutoScrollEnabled] = useState(true);
|
const [autoScrollEnabled, setAutoScrollEnabled] = useState(true);
|
||||||
const [showResumeAutoScroll, setShowResumeAutoScroll] = useState(false);
|
const [showResumeAutoScroll, setShowResumeAutoScroll] = useState(false);
|
||||||
@@ -274,7 +267,6 @@ export function ArtifactFileDetail({
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
// md/mermaid 默认预览（AI 写作视图作为可选切换项，由用户手动进入）。
|
|
||||||
if (isSupportPreview) {
|
if (isSupportPreview) {
|
||||||
setViewMode("preview");
|
setViewMode("preview");
|
||||||
return;
|
return;
|
||||||
@@ -440,7 +432,29 @@ export function ArtifactFileDetail({
|
|||||||
}, 1600);
|
}, 1600);
|
||||||
}, [scrollArtifactToBottom]);
|
}, [scrollArtifactToBottom]);
|
||||||
|
|
||||||
const handleSaveArtifact = useCallback(async () => {
|
const handleInstallSkill = useCallback(async () => {
|
||||||
|
if (isInstalling) return;
|
||||||
|
|
||||||
|
setIsInstalling(true);
|
||||||
|
try {
|
||||||
|
const result = await installSkill({
|
||||||
|
thread_id: threadId,
|
||||||
|
path: filepath,
|
||||||
|
});
|
||||||
|
if (result.success) {
|
||||||
|
toast.success(result.message);
|
||||||
|
} else {
|
||||||
|
toast.error(result.message ?? "Failed to install skill");
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error("Failed to install skill:", error);
|
||||||
|
toast.error("Failed to install skill");
|
||||||
|
} finally {
|
||||||
|
setIsInstalling(false);
|
||||||
|
}
|
||||||
|
}, [threadId, filepath, isInstalling]);
|
||||||
|
|
||||||
|
const handleSaveArtifact = useCallback(async () => {
|
||||||
if (!canEditArtifact || updateArtifact.isPending) {
|
if (!canEditArtifact || updateArtifact.isPending) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
@@ -584,9 +598,7 @@ export function ArtifactFileDetail({
|
|||||||
{fileTypeLabel}
|
{fileTypeLabel}
|
||||||
</span>
|
</span>
|
||||||
<ArtifactTitle className="min-w-0">
|
<ArtifactTitle className="min-w-0">
|
||||||
{/* markdown：隐藏文件名（仅留 MD 徽标），把横向空间让给工具栏，避免窄面板下
|
{useWriteFileStreaming ? (
|
||||||
工具栏换行错位；多文件仍保留切换下拉（靠它切文件）。文件名仍可在下载/另存为时取到。 */}
|
|
||||||
{language === "markdown" && !hasMultipleArtifacts ? null : useWriteFileStreaming ? (
|
|
||||||
<div className="truncate px-3">{getFileName(filepath)}</div>
|
<div className="truncate px-3">{getFileName(filepath)}</div>
|
||||||
) : hasMultipleArtifacts ? (
|
) : hasMultipleArtifacts ? (
|
||||||
<Select value={filepath} onValueChange={select}>
|
<Select value={filepath} onValueChange={select}>
|
||||||
@@ -626,19 +638,10 @@ export function ArtifactFileDetail({
|
|||||||
onValueChange={(value) => {
|
onValueChange={(value) => {
|
||||||
if (value) {
|
if (value) {
|
||||||
setAllowAutoViewSwitch(false);
|
setAllowAutoViewSwitch(false);
|
||||||
setViewMode(value as "code" | "preview" | "edit");
|
setViewMode(value as "code" | "preview");
|
||||||
}
|
}
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{canUseAiEditor && (
|
|
||||||
<ToggleGroupItem
|
|
||||||
className="text-muted-foreground h-8 min-w-10 rounded-full border-0 bg-transparent px-3 shadow-none data-[state=on]:bg-background data-[state=on]:text-foreground data-[state=on]:shadow-[0_6px_14px_-10px_rgba(15,23,42,0.35)]"
|
|
||||||
value="edit"
|
|
||||||
aria-label="AI 写作编辑"
|
|
||||||
>
|
|
||||||
<SparklesIcon />
|
|
||||||
</ToggleGroupItem>
|
|
||||||
)}
|
|
||||||
<ToggleGroupItem
|
<ToggleGroupItem
|
||||||
className="text-muted-foreground h-8 min-w-10 rounded-full border-0 bg-transparent px-3 shadow-none data-[state=on]:bg-background data-[state=on]:text-foreground data-[state=on]:shadow-[0_6px_14px_-10px_rgba(15,23,42,0.35)]"
|
className="text-muted-foreground h-8 min-w-10 rounded-full border-0 bg-transparent px-3 shadow-none data-[state=on]:bg-background data-[state=on]:text-foreground data-[state=on]:shadow-[0_6px_14px_-10px_rgba(15,23,42,0.35)]"
|
||||||
value="code"
|
value="code"
|
||||||
@@ -683,17 +686,18 @@ export function ArtifactFileDetail({
|
|||||||
)}
|
)}
|
||||||
{!useWriteFileStreaming && filepath.endsWith(".skill") && (
|
{!useWriteFileStreaming && filepath.endsWith(".skill") && (
|
||||||
<Tooltip content={t.toolCalls.skillInstallTooltip}>
|
<Tooltip content={t.toolCalls.skillInstallTooltip}>
|
||||||
<ArtifactAction
|
<ArtifactAction
|
||||||
icon={PackageIcon}
|
icon={isInstalling ? LoaderIcon : PackageIcon}
|
||||||
label={t.common.install}
|
label={t.common.install}
|
||||||
tooltip={t.common.install}
|
tooltip={t.common.install}
|
||||||
disabled={
|
disabled={
|
||||||
env.NEXT_PUBLIC_STATIC_WEBSITE_ONLY === "true"
|
isInstalling ||
|
||||||
}
|
env.NEXT_PUBLIC_STATIC_WEBSITE_ONLY === "true"
|
||||||
onClick={() => setInstallDialogOpen(true)}
|
}
|
||||||
/>
|
onClick={handleInstallSkill}
|
||||||
</Tooltip>
|
/>
|
||||||
)}
|
</Tooltip>
|
||||||
|
)}
|
||||||
{isCodeFile && (
|
{isCodeFile && (
|
||||||
<ArtifactAction
|
<ArtifactAction
|
||||||
icon={CopyIcon}
|
icon={CopyIcon}
|
||||||
@@ -701,7 +705,7 @@ export function ArtifactFileDetail({
|
|||||||
disabled={!content}
|
disabled={!content}
|
||||||
onClick={async () => {
|
onClick={async () => {
|
||||||
try {
|
try {
|
||||||
await copyTextToClipboard(displayContent ?? "");
|
await navigator.clipboard.writeText(displayContent ?? "");
|
||||||
toast.success(t.clipboard.copiedToClipboard);
|
toast.success(t.clipboard.copiedToClipboard);
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
toast.error("Failed to copy to clipboard");
|
toast.error("Failed to copy to clipboard");
|
||||||
@@ -711,7 +715,7 @@ export function ArtifactFileDetail({
|
|||||||
tooltip={t.clipboard.copyToClipboard}
|
tooltip={t.clipboard.copyToClipboard}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
{language === "markdown" && (
|
{!useWriteFileStreaming && language === "markdown" && (
|
||||||
<ArtifactAction
|
<ArtifactAction
|
||||||
icon={isExportingWord ? LoaderIcon : FileType2Icon}
|
icon={isExportingWord ? LoaderIcon : FileType2Icon}
|
||||||
label="另存为 Word"
|
label="另存为 Word"
|
||||||
@@ -778,7 +782,7 @@ export function ArtifactFileDetail({
|
|||||||
</ArtifactActions>
|
</ArtifactActions>
|
||||||
</div>
|
</div>
|
||||||
</ArtifactHeader>
|
</ArtifactHeader>
|
||||||
<ArtifactContent
|
<ArtifactContent
|
||||||
ref={artifactContentRef}
|
ref={artifactContentRef}
|
||||||
className="relative p-0"
|
className="relative p-0"
|
||||||
onWheelCapture={handlePauseAutoScroll}
|
onWheelCapture={handlePauseAutoScroll}
|
||||||
@@ -799,17 +803,6 @@ export function ArtifactFileDetail({
|
|||||||
滑动到底部并继续自动下滑
|
滑动到底部并继续自动下滑
|
||||||
</button>
|
</button>
|
||||||
)}
|
)}
|
||||||
{viewMode === "edit" && canUseAiEditor && (
|
|
||||||
<MarkdownAiEditor
|
|
||||||
// 编辑用原始内容（与源码模式一致，不脱敏）；保存仍走头部「保存 Markdown」按钮。
|
|
||||||
markdown={displayContent ?? ""}
|
|
||||||
onChange={(value) => {
|
|
||||||
setDraftContent(value);
|
|
||||||
setHasLocalEdits(true);
|
|
||||||
}}
|
|
||||||
threadId={threadId}
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
{isSupportPreview &&
|
{isSupportPreview &&
|
||||||
viewMode === "preview" &&
|
viewMode === "preview" &&
|
||||||
(language === "markdown" ||
|
(language === "markdown" ||
|
||||||
@@ -866,16 +859,10 @@ export function ArtifactFileDetail({
|
|||||||
{t.common.loading}
|
{t.common.loading}
|
||||||
</div>
|
</div>
|
||||||
))}
|
))}
|
||||||
</ArtifactContent>
|
</ArtifactContent>
|
||||||
<SkillInstallDialog
|
</Artifact>
|
||||||
open={installDialogOpen}
|
);
|
||||||
onOpenChange={setInstallDialogOpen}
|
}
|
||||||
threadId={threadId}
|
|
||||||
filepath={filepath}
|
|
||||||
/>
|
|
||||||
</Artifact>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
function SandboxPreviewImage({
|
function SandboxPreviewImage({
|
||||||
src,
|
src,
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
import { DownloadIcon, LoaderIcon, PackageIcon } from "lucide-react";
|
import { DownloadIcon, LoaderIcon, PackageIcon } from "lucide-react";
|
||||||
import { useCallback, useState } from "react";
|
import { useCallback, useState } from "react";
|
||||||
import { toast } from "sonner";
|
import { toast } from "sonner";
|
||||||
|
|
||||||
import { Button } from "@/components/ui/button";
|
import { Button } from "@/components/ui/button";
|
||||||
import {
|
import {
|
||||||
@@ -10,18 +10,18 @@ import {
|
|||||||
CardHeader,
|
CardHeader,
|
||||||
CardTitle,
|
CardTitle,
|
||||||
} from "@/components/ui/card";
|
} from "@/components/ui/card";
|
||||||
import { downloadArtifactFile } from "@/core/artifacts/download";
|
import { downloadArtifactFile } from "@/core/artifacts/download";
|
||||||
import { useI18n } from "@/core/i18n/hooks";
|
import { useI18n } from "@/core/i18n/hooks";
|
||||||
import {
|
import { installSkill } from "@/core/skills/api";
|
||||||
getFileExtensionDisplayName,
|
import {
|
||||||
getFileIcon,
|
getFileExtensionDisplayName,
|
||||||
getFileName,
|
getFileIcon,
|
||||||
} from "@/core/utils/files";
|
getFileName,
|
||||||
|
} from "@/core/utils/files";
|
||||||
import { cn } from "@/lib/utils";
|
import { cn } from "@/lib/utils";
|
||||||
|
|
||||||
import { useThread } from "../messages/context";
|
import { useThread } from "../messages/context";
|
||||||
import { useArtifacts } from "./context";
|
import { useArtifacts } from "./context";
|
||||||
import { SkillInstallDialog } from "./skill-install-dialog";
|
|
||||||
|
|
||||||
export function ArtifactFileList({
|
export function ArtifactFileList({
|
||||||
className,
|
className,
|
||||||
@@ -32,11 +32,11 @@ export function ArtifactFileList({
|
|||||||
files: string[];
|
files: string[];
|
||||||
threadId: string;
|
threadId: string;
|
||||||
}) {
|
}) {
|
||||||
const { t } = useI18n();
|
const { t } = useI18n();
|
||||||
const { isMock, publicShareCode } = useThread();
|
const { isMock, publicShareCode } = useThread();
|
||||||
const { select: selectArtifact, setOpen } = useArtifacts();
|
const { select: selectArtifact, setOpen } = useArtifacts();
|
||||||
const [installFile, setInstallFile] = useState<string | null>(null);
|
const [installingFile, setInstallingFile] = useState<string | null>(null);
|
||||||
const [downloadingFile, setDownloadingFile] = useState<string | null>(null);
|
const [downloadingFile, setDownloadingFile] = useState<string | null>(null);
|
||||||
|
|
||||||
const handleClick = useCallback(
|
const handleClick = useCallback(
|
||||||
(filepath: string) => {
|
(filepath: string) => {
|
||||||
@@ -46,14 +46,33 @@ export function ArtifactFileList({
|
|||||||
[selectArtifact, setOpen],
|
[selectArtifact, setOpen],
|
||||||
);
|
);
|
||||||
|
|
||||||
const handleInstallSkill = useCallback(
|
const handleInstallSkill = useCallback(
|
||||||
(e: React.MouseEvent, filepath: string) => {
|
async (e: React.MouseEvent, filepath: string) => {
|
||||||
e.stopPropagation();
|
e.stopPropagation();
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
setInstallFile(filepath);
|
|
||||||
},
|
if (installingFile) return;
|
||||||
[],
|
|
||||||
);
|
setInstallingFile(filepath);
|
||||||
|
try {
|
||||||
|
const result = await installSkill({
|
||||||
|
thread_id: threadId,
|
||||||
|
path: filepath,
|
||||||
|
});
|
||||||
|
if (result.success) {
|
||||||
|
toast.success(result.message);
|
||||||
|
} else {
|
||||||
|
toast.error(result.message || "Failed to install skill");
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error("Failed to install skill:", error);
|
||||||
|
toast.error("Failed to install skill");
|
||||||
|
} finally {
|
||||||
|
setInstallingFile(null);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
[threadId, installingFile],
|
||||||
|
);
|
||||||
|
|
||||||
const handleDownload = useCallback(
|
const handleDownload = useCallback(
|
||||||
async (e: React.MouseEvent, filepath: string) => {
|
async (e: React.MouseEvent, filepath: string) => {
|
||||||
@@ -94,15 +113,20 @@ export function ArtifactFileList({
|
|||||||
{getFileExtensionDisplayName(file)} file
|
{getFileExtensionDisplayName(file)} file
|
||||||
</CardDescription>
|
</CardDescription>
|
||||||
<CardAction className="row-span-1 self-center">
|
<CardAction className="row-span-1 self-center">
|
||||||
{file.endsWith(".skill") && (
|
{file.endsWith(".skill") && (
|
||||||
<Button
|
<Button
|
||||||
variant="ghost"
|
variant="ghost"
|
||||||
onClick={(e) => handleInstallSkill(e, file)}
|
disabled={installingFile === file}
|
||||||
>
|
onClick={(e) => handleInstallSkill(e, file)}
|
||||||
<PackageIcon className="size-4" />
|
>
|
||||||
{t.common.install}
|
{installingFile === file ? (
|
||||||
</Button>
|
<LoaderIcon className="size-4 animate-spin" />
|
||||||
)}
|
) : (
|
||||||
|
<PackageIcon className="size-4" />
|
||||||
|
)}
|
||||||
|
{t.common.install}
|
||||||
|
</Button>
|
||||||
|
)}
|
||||||
<Button
|
<Button
|
||||||
variant="ghost"
|
variant="ghost"
|
||||||
disabled={downloadingFile === file}
|
disabled={downloadingFile === file}
|
||||||
@@ -118,15 +142,7 @@ export function ArtifactFileList({
|
|||||||
</CardAction>
|
</CardAction>
|
||||||
</CardHeader>
|
</CardHeader>
|
||||||
</Card>
|
</Card>
|
||||||
))}
|
))}
|
||||||
<SkillInstallDialog
|
</ul>
|
||||||
open={!!installFile}
|
);
|
||||||
onOpenChange={(open) => {
|
}
|
||||||
if (!open) setInstallFile(null);
|
|
||||||
}}
|
|
||||||
threadId={threadId}
|
|
||||||
filepath={installFile}
|
|
||||||
/>
|
|
||||||
</ul>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@@ -1,178 +0,0 @@
|
|||||||
"use client";
|
|
||||||
|
|
||||||
import { AlertCircleIcon, Loader2Icon, PackageIcon } from "lucide-react";
|
|
||||||
import { useEffect, useMemo, useState } from "react";
|
|
||||||
import { toast } from "sonner";
|
|
||||||
|
|
||||||
import { Button } from "@/components/ui/button";
|
|
||||||
import {
|
|
||||||
Dialog,
|
|
||||||
DialogContent,
|
|
||||||
DialogDescription,
|
|
||||||
DialogFooter,
|
|
||||||
DialogHeader,
|
|
||||||
DialogTitle,
|
|
||||||
} from "@/components/ui/dialog";
|
|
||||||
import { Input } from "@/components/ui/input";
|
|
||||||
import {
|
|
||||||
installSkill,
|
|
||||||
previewSkillInstall,
|
|
||||||
type PreviewSkillInstallResponse,
|
|
||||||
} from "@/core/skills/api";
|
|
||||||
|
|
||||||
export function SkillInstallDialog({
|
|
||||||
open,
|
|
||||||
onOpenChange,
|
|
||||||
threadId,
|
|
||||||
filepath,
|
|
||||||
onInstalled,
|
|
||||||
}: {
|
|
||||||
open: boolean;
|
|
||||||
onOpenChange: (open: boolean) => void;
|
|
||||||
threadId: string;
|
|
||||||
filepath: string | null;
|
|
||||||
onInstalled?: (skillName: string) => void;
|
|
||||||
}) {
|
|
||||||
const [preview, setPreview] = useState<PreviewSkillInstallResponse | null>(null);
|
|
||||||
const [installName, setInstallName] = useState("");
|
|
||||||
const [loading, setLoading] = useState(false);
|
|
||||||
const [installing, setInstalling] = useState(false);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
if (!open || !filepath) {
|
|
||||||
setPreview(null);
|
|
||||||
setInstallName("");
|
|
||||||
setLoading(false);
|
|
||||||
setInstalling(false);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
let cancelled = false;
|
|
||||||
setLoading(true);
|
|
||||||
setPreview(null);
|
|
||||||
setInstallName("");
|
|
||||||
|
|
||||||
void previewSkillInstall({ thread_id: threadId, path: filepath })
|
|
||||||
.then((result) => {
|
|
||||||
if (cancelled) return;
|
|
||||||
setPreview(result);
|
|
||||||
setInstallName(result.skill_name);
|
|
||||||
})
|
|
||||||
.catch((error) => {
|
|
||||||
if (cancelled) return;
|
|
||||||
toast.error(error instanceof Error ? error.message : "Failed to preview skill install");
|
|
||||||
onOpenChange(false);
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
if (!cancelled) setLoading(false);
|
|
||||||
});
|
|
||||||
|
|
||||||
return () => {
|
|
||||||
cancelled = true;
|
|
||||||
};
|
|
||||||
}, [filepath, onOpenChange, open, threadId]);
|
|
||||||
|
|
||||||
const trimmedName = installName.trim();
|
|
||||||
const unchangedConflict = useMemo(() => {
|
|
||||||
if (!preview) return false;
|
|
||||||
return trimmedName === preview.skill_name && !preview.can_install_as_is;
|
|
||||||
}, [preview, trimmedName]);
|
|
||||||
|
|
||||||
async function handleInstall() {
|
|
||||||
if (!filepath || !trimmedName || installing) return;
|
|
||||||
setInstalling(true);
|
|
||||||
try {
|
|
||||||
const result = await installSkill({
|
|
||||||
thread_id: threadId,
|
|
||||||
path: filepath,
|
|
||||||
skill_name: trimmedName,
|
|
||||||
});
|
|
||||||
if (!result.success) {
|
|
||||||
toast.error(result.message || "Failed to install skill");
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
toast.success(result.message);
|
|
||||||
onInstalled?.(result.skill_name);
|
|
||||||
onOpenChange(false);
|
|
||||||
} catch (error) {
|
|
||||||
toast.error(error instanceof Error ? error.message : "Failed to install skill");
|
|
||||||
} finally {
|
|
||||||
setInstalling(false);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const helperText = preview?.owned_by_other
|
|
||||||
? `该技能名已被 ${preview.owner_username || "其他用户"} 安装。你可以换个名字继续安装。`
|
|
||||||
: preview?.owned_by_me
|
|
||||||
? "你已经安装过这个技能了；如果想保留一份新副本，可以换个名字安装。"
|
|
||||||
: preview?.builtin_conflict
|
|
||||||
? "这个名字已被公共技能占用，请换个名字安装。"
|
|
||||||
: "可以直接安装，也可以先改一个更适合自己的名字。";
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Dialog open={open} onOpenChange={onOpenChange}>
|
|
||||||
<DialogContent className="sm:max-w-md">
|
|
||||||
<DialogHeader>
|
|
||||||
<DialogTitle>安装技能</DialogTitle>
|
|
||||||
<DialogDescription>安装前会校验技能归属；如果名字已被占用，可以改名后继续安装。</DialogDescription>
|
|
||||||
</DialogHeader>
|
|
||||||
|
|
||||||
{loading ? (
|
|
||||||
<div className="text-muted-foreground flex items-center justify-center gap-2 py-8 text-sm">
|
|
||||||
<Loader2Icon className="size-4 animate-spin" />
|
|
||||||
正在检查技能安装权限…
|
|
||||||
</div>
|
|
||||||
) : preview ? (
|
|
||||||
<div className="space-y-4">
|
|
||||||
<div className="rounded-xl border bg-muted/35 p-3 text-sm">
|
|
||||||
<div className="font-medium">{preview.skill_name}</div>
|
|
||||||
{preview.description ? (
|
|
||||||
<div className="text-muted-foreground mt-1 line-clamp-3">{preview.description}</div>
|
|
||||||
) : null}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="space-y-2">
|
|
||||||
<div className="text-sm font-medium">安装名称</div>
|
|
||||||
<Input
|
|
||||||
value={installName}
|
|
||||||
onChange={(e) => setInstallName(e.currentTarget.value)}
|
|
||||||
placeholder="请输入技能名称"
|
|
||||||
/>
|
|
||||||
<div className="text-muted-foreground text-xs">{helperText}</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{!preview.can_install_as_is && (
|
|
||||||
<div className="flex gap-2 rounded-xl border border-amber-300/60 bg-amber-50 px-3 py-2 text-sm text-amber-900">
|
|
||||||
<AlertCircleIcon className="mt-0.5 size-4 shrink-0" />
|
|
||||||
<div>{preview.message}</div>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{preview.warnings.length > 0 && (
|
|
||||||
<div className="text-muted-foreground rounded-xl border px-3 py-2 text-xs">
|
|
||||||
{preview.warnings.join(" ")}
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
) : null}
|
|
||||||
|
|
||||||
<DialogFooter>
|
|
||||||
<Button variant="outline" onClick={() => onOpenChange(false)} disabled={installing}>
|
|
||||||
取消
|
|
||||||
</Button>
|
|
||||||
<Button
|
|
||||||
onClick={() => void handleInstall()}
|
|
||||||
disabled={loading || installing || !trimmedName || unchangedConflict}
|
|
||||||
>
|
|
||||||
{installing ? (
|
|
||||||
<Loader2Icon className="size-4 animate-spin" />
|
|
||||||
) : (
|
|
||||||
<PackageIcon className="size-4" />
|
|
||||||
)}
|
|
||||||
安装
|
|
||||||
</Button>
|
|
||||||
</DialogFooter>
|
|
||||||
</DialogContent>
|
|
||||||
</Dialog>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@@ -423,7 +423,6 @@ const ChatBox: React.FC<{
|
|||||||
className="size-full"
|
className="size-full"
|
||||||
filepath={selectedArtifact}
|
filepath={selectedArtifact}
|
||||||
threadId={threadId}
|
threadId={threadId}
|
||||||
allowVirtualMarkdownEdit
|
|
||||||
/>
|
/>
|
||||||
</TabsContent>
|
</TabsContent>
|
||||||
<TabsContent value="references" className="min-h-0 flex-1 overflow-y-auto p-0">
|
<TabsContent value="references" className="min-h-0 flex-1 overflow-y-auto p-0">
|
||||||
@@ -438,7 +437,6 @@ const ChatBox: React.FC<{
|
|||||||
className="size-full"
|
className="size-full"
|
||||||
filepath={selectedArtifact}
|
filepath={selectedArtifact}
|
||||||
threadId={threadId}
|
threadId={threadId}
|
||||||
allowVirtualMarkdownEdit
|
|
||||||
/>
|
/>
|
||||||
) : hasCitationReferences ? (
|
) : hasCitationReferences ? (
|
||||||
<div className="relative size-full overflow-hidden">
|
<div className="relative size-full overflow-hidden">
|
||||||
|
|||||||
@@ -1,204 +0,0 @@
|
|||||||
"use client";
|
|
||||||
|
|
||||||
import {
|
|
||||||
BookOpenCheck,
|
|
||||||
Brain,
|
|
||||||
CalendarClock,
|
|
||||||
MessageSquare,
|
|
||||||
MessageSquarePlus,
|
|
||||||
PanelLeftClose,
|
|
||||||
PenLine,
|
|
||||||
Settings,
|
|
||||||
Sparkles,
|
|
||||||
UsersRound,
|
|
||||||
} from "lucide-react";
|
|
||||||
import Link from "next/link";
|
|
||||||
import { usePathname } from "next/navigation";
|
|
||||||
import type { MouseEvent } from "react";
|
|
||||||
import { useNavigate } from "react-router-dom";
|
|
||||||
|
|
||||||
import { cn } from "@/lib/utils";
|
|
||||||
|
|
||||||
import { AgentBrandIcon } from "./agents/agent-brand-icon";
|
|
||||||
import { RecentChatList } from "./recent-chat-list";
|
|
||||||
import { WorkspaceNavMenu } from "./workspace-nav-menu";
|
|
||||||
|
|
||||||
const NEW_CHAT_PATH = "/page/workspace/chats/new";
|
|
||||||
|
|
||||||
type NavItem = {
|
|
||||||
label: string;
|
|
||||||
href: string;
|
|
||||||
icon: typeof MessageSquare;
|
|
||||||
match: string;
|
|
||||||
};
|
|
||||||
|
|
||||||
const NAV_ITEMS: NavItem[] = [
|
|
||||||
{ label: "新建对话", href: NEW_CHAT_PATH, icon: MessageSquarePlus, match: NEW_CHAT_PATH },
|
|
||||||
{ label: "对话", href: "/page/workspace/chats", icon: MessageSquare, match: "/page/workspace/chats" },
|
|
||||||
{ label: "智能体", href: "/page/workspace/agents", icon: Sparkles, match: "/page/workspace/agents" },
|
|
||||||
{ label: "技能", href: "/page/workspace/skills", icon: Sparkles, match: "/page/workspace/skills" },
|
|
||||||
{ label: "记忆", href: "/page/workspace/memory", icon: Brain, match: "/page/workspace/memory" },
|
|
||||||
{ label: "AI 写作", href: "/page/workspace/ai-writing", icon: PenLine, match: "/page/workspace/ai-writing" },
|
|
||||||
{
|
|
||||||
label: "多智能体规划",
|
|
||||||
href: "/page/workspace/roundtable/planning",
|
|
||||||
icon: UsersRound,
|
|
||||||
match: "/page/workspace/roundtable",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "定时任务",
|
|
||||||
href: "/page/workspace/scheduled/tasks",
|
|
||||||
icon: CalendarClock,
|
|
||||||
match: "/page/workspace/scheduled",
|
|
||||||
},
|
|
||||||
{ label: "问答梳理", href: "/page/workspace/knowledge", icon: BookOpenCheck, match: "/page/workspace/knowledge" },
|
|
||||||
] as const;
|
|
||||||
|
|
||||||
export function CmChatSidebar({
|
|
||||||
onCollapse,
|
|
||||||
collapsed = false,
|
|
||||||
}: {
|
|
||||||
onCollapse?: () => void;
|
|
||||||
collapsed?: boolean;
|
|
||||||
}) {
|
|
||||||
const pathname = usePathname();
|
|
||||||
const navigate = useNavigate();
|
|
||||||
|
|
||||||
const handleNewChat = (event: MouseEvent<HTMLAnchorElement>) => {
|
|
||||||
if (event.metaKey || event.ctrlKey || event.shiftKey || event.button === 1) return;
|
|
||||||
event.preventDefault();
|
|
||||||
navigate(NEW_CHAT_PATH, { replace: true, state: { resetAt: Date.now() } });
|
|
||||||
};
|
|
||||||
|
|
||||||
if (collapsed) {
|
|
||||||
return (
|
|
||||||
<aside className="flex h-full min-h-0 w-14 flex-col border-r border-slate-200/80 bg-white text-slate-700 dark:border-slate-800 dark:bg-slate-950 dark:text-slate-200">
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
onClick={onCollapse}
|
|
||||||
aria-label="展开侧边栏"
|
|
||||||
title="展开侧边栏"
|
|
||||||
className="mx-auto mt-2 flex size-11 shrink-0 items-center justify-center rounded-xl transition-colors hover:bg-slate-100 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500/40 dark:hover:bg-slate-900"
|
|
||||||
>
|
|
||||||
<img
|
|
||||||
src="/cm-assistant-logo.png"
|
|
||||||
alt="CM 助手"
|
|
||||||
className="size-10 object-contain"
|
|
||||||
/>
|
|
||||||
</button>
|
|
||||||
<div className="mx-2 mt-2 h-px shrink-0 bg-slate-200/80 dark:bg-slate-800" />
|
|
||||||
|
|
||||||
<nav className="flex shrink-0 flex-col items-center gap-1 px-2 py-3" aria-label="工作台导航">
|
|
||||||
{NAV_ITEMS.map((item) => {
|
|
||||||
const active = item.href === NEW_CHAT_PATH
|
|
||||||
? pathname === NEW_CHAT_PATH
|
|
||||||
: item.href === "/page/workspace/chats"
|
|
||||||
? pathname.startsWith(item.match) && pathname !== NEW_CHAT_PATH
|
|
||||||
: pathname.startsWith(item.match);
|
|
||||||
const Icon = item.icon;
|
|
||||||
return (
|
|
||||||
<Link
|
|
||||||
key={item.href}
|
|
||||||
href={item.href}
|
|
||||||
onClick={item.href === NEW_CHAT_PATH ? handleNewChat : undefined}
|
|
||||||
aria-current={active ? "page" : undefined}
|
|
||||||
aria-label={item.label}
|
|
||||||
title={item.label}
|
|
||||||
className={cn(
|
|
||||||
"flex size-10 items-center justify-center rounded-xl transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500/40",
|
|
||||||
active
|
|
||||||
? "bg-[#edf4ff] text-[#165ee8] dark:bg-blue-500/15 dark:text-blue-300"
|
|
||||||
: "text-slate-600 hover:bg-slate-100 hover:text-slate-950 dark:text-slate-300 dark:hover:bg-slate-900 dark:hover:text-white",
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
{item.href === "/page/workspace/agents" ? (
|
|
||||||
<AgentBrandIcon size="nav" />
|
|
||||||
) : (
|
|
||||||
<Icon className="size-[19px]" strokeWidth={1.8} />
|
|
||||||
)}
|
|
||||||
<span className="sr-only">{item.label}</span>
|
|
||||||
</Link>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
</nav>
|
|
||||||
|
|
||||||
<div className="mt-auto flex shrink-0 justify-center border-t border-slate-200/80 py-3 dark:border-slate-800">
|
|
||||||
<Link
|
|
||||||
href="/page/workspace/settings"
|
|
||||||
aria-label="设置和更多"
|
|
||||||
title="设置和更多"
|
|
||||||
className="flex size-10 items-center justify-center rounded-xl text-slate-600 transition-colors hover:bg-slate-100 hover:text-slate-950 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500/40 dark:text-slate-300 dark:hover:bg-slate-900 dark:hover:text-white"
|
|
||||||
>
|
|
||||||
<Settings className="size-[19px]" strokeWidth={1.8} />
|
|
||||||
</Link>
|
|
||||||
</div>
|
|
||||||
</aside>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="flex h-full min-h-0 flex-col overflow-hidden border-r border-slate-200/80 bg-white text-slate-900 dark:border-slate-800 dark:bg-slate-950 dark:text-slate-100">
|
|
||||||
<div className="flex shrink-0 items-center gap-2 px-6 pt-4 pb-3">
|
|
||||||
<Link href={NEW_CHAT_PATH} className="flex min-w-0 flex-1 items-center gap-3.5 outline-none focus-visible:ring-2 focus-visible:ring-blue-500/40">
|
|
||||||
<img
|
|
||||||
src="/cm-assistant-logo.png"
|
|
||||||
alt="CM 助手"
|
|
||||||
className="size-10 shrink-0 object-contain"
|
|
||||||
/>
|
|
||||||
<span className="truncate text-[20px] font-semibold tracking-[-0.025em]">CM 助手</span>
|
|
||||||
</Link>
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
onClick={onCollapse}
|
|
||||||
aria-label="收起侧边栏"
|
|
||||||
title="收起侧边栏"
|
|
||||||
className="flex size-8 shrink-0 items-center justify-center rounded-md text-slate-500 transition-colors hover:bg-slate-100 hover:text-slate-900 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500/40 dark:hover:bg-slate-900 dark:hover:text-white"
|
|
||||||
>
|
|
||||||
<PanelLeftClose className="size-[18px]" strokeWidth={1.8} />
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<nav className="shrink-0 px-4 pt-1" aria-label="工作台导航">
|
|
||||||
<div className="space-y-1">
|
|
||||||
{NAV_ITEMS.map((item) => {
|
|
||||||
const active = item.href === NEW_CHAT_PATH
|
|
||||||
? pathname === NEW_CHAT_PATH
|
|
||||||
: item.href === "/page/workspace/chats"
|
|
||||||
? pathname.startsWith(item.match) && pathname !== NEW_CHAT_PATH
|
|
||||||
: pathname.startsWith(item.match);
|
|
||||||
const Icon = item.icon;
|
|
||||||
return (
|
|
||||||
<Link
|
|
||||||
key={item.href}
|
|
||||||
href={item.href}
|
|
||||||
onClick={item.href === NEW_CHAT_PATH ? handleNewChat : undefined}
|
|
||||||
aria-current={active ? "page" : undefined}
|
|
||||||
className={cn(
|
|
||||||
"flex h-11 items-center gap-3 rounded-xl px-4 text-[14px] font-medium transition-colors",
|
|
||||||
active
|
|
||||||
? "bg-[#edf4ff] text-[#165ee8] dark:bg-blue-500/15 dark:text-blue-300"
|
|
||||||
: "text-slate-600 hover:bg-slate-100 hover:text-slate-950 dark:text-slate-300 dark:hover:bg-slate-900 dark:hover:text-white",
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
{item.href === "/page/workspace/agents" ? (
|
|
||||||
<AgentBrandIcon size="nav" />
|
|
||||||
) : (
|
|
||||||
<Icon className="size-[18px] shrink-0" strokeWidth={1.8} />
|
|
||||||
)}
|
|
||||||
<span>{item.label}</span>
|
|
||||||
</Link>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
</div>
|
|
||||||
</nav>
|
|
||||||
|
|
||||||
<div className="min-h-0 flex-1 overflow-y-auto px-1">
|
|
||||||
<RecentChatList compact limit={5} moreHref="/page/workspace/chats" />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="shrink-0 border-t border-slate-200/80 px-3 py-3 dark:border-slate-800">
|
|
||||||
<WorkspaceNavMenu />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@@ -11,15 +11,38 @@ export function CompactWelcome({ className }: { className?: string }) {
|
|||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
className={cn(
|
className={cn(
|
||||||
"mx-auto flex w-full flex-col items-center justify-center text-center",
|
"mx-auto flex w-full flex-col items-center justify-center text-center select-none",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<h1 className="flex items-center justify-center text-[34px] font-semibold tracking-[-0.035em] text-slate-950 dark:text-slate-50">
|
{/* CM logo：浅底圆环 + 主色渐变圆角方块 */}
|
||||||
你好，欢迎使用 CM 助手
|
<div
|
||||||
|
className="mb-3.5 inline-flex items-center justify-center rounded-full p-3"
|
||||||
|
style={{
|
||||||
|
backgroundColor:
|
||||||
|
"color-mix(in srgb, var(--workspace-brand) 5%, transparent)",
|
||||||
|
border:
|
||||||
|
"1px solid color-mix(in srgb, var(--workspace-brand) 12%, transparent)",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
className="flex size-14 items-center justify-center rounded-2xl shadow-md"
|
||||||
|
style={{
|
||||||
|
backgroundImage:
|
||||||
|
"linear-gradient(to top right, var(--workspace-brand), color-mix(in srgb, var(--workspace-brand) 55%, white))",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<span className="text-2xl font-black tracking-wide text-white italic">
|
||||||
|
CM
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<h1 className="flex items-center justify-center gap-2 text-2xl font-bold tracking-tight text-foreground/90">
|
||||||
|
<span className="text-2xl">👋</span> 欢迎使用CM助手
|
||||||
</h1>
|
</h1>
|
||||||
<p className="mx-auto mt-2.5 max-w-xl text-[15px] leading-6 text-slate-500 dark:text-slate-400">
|
<p className="text-muted-foreground mx-auto mt-2 max-w-sm text-xs leading-relaxed">
|
||||||
我可以帮你写作、问答、分析和规划各类内容，让工作更高效
|
基于先进深度推理模型，为您提供高效的市场分析、专业报告撰写、调研设计与协同脑暴支持。
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -1,10 +1,8 @@
|
|||||||
import { CheckIcon, CopyIcon } from "lucide-react";
|
import { CheckIcon, CopyIcon } from "lucide-react";
|
||||||
import { useCallback, useState, type ComponentProps } from "react";
|
import { useCallback, useState, type ComponentProps } from "react";
|
||||||
import { toast } from "sonner";
|
|
||||||
|
import { Button } from "@/components/ui/button";
|
||||||
import { Button } from "@/components/ui/button";
|
import { useI18n } from "@/core/i18n/hooks";
|
||||||
import { copyTextToClipboard } from "@/core/clipboard";
|
|
||||||
import { useI18n } from "@/core/i18n/hooks";
|
|
||||||
|
|
||||||
import { Tooltip } from "./tooltip";
|
import { Tooltip } from "./tooltip";
|
||||||
|
|
||||||
@@ -14,18 +12,14 @@ export function CopyButton({
|
|||||||
}: ComponentProps<typeof Button> & {
|
}: ComponentProps<typeof Button> & {
|
||||||
clipboardData: string;
|
clipboardData: string;
|
||||||
}) {
|
}) {
|
||||||
const { t } = useI18n();
|
const { t } = useI18n();
|
||||||
const [copied, setCopied] = useState(false);
|
const [copied, setCopied] = useState(false);
|
||||||
const handleCopy = useCallback(async () => {
|
const handleCopy = useCallback(() => {
|
||||||
try {
|
void navigator.clipboard.writeText(clipboardData);
|
||||||
await copyTextToClipboard(clipboardData);
|
setCopied(true);
|
||||||
setCopied(true);
|
setTimeout(() => setCopied(false), 2000);
|
||||||
setTimeout(() => setCopied(false), 2000);
|
}, [clipboardData]);
|
||||||
} catch {
|
return (
|
||||||
toast.error(t.clipboard.failedToCopyToClipboard);
|
|
||||||
}
|
|
||||||
}, [clipboardData, t.clipboard.failedToCopyToClipboard]);
|
|
||||||
return (
|
|
||||||
<Tooltip content={t.clipboard.copyToClipboard}>
|
<Tooltip content={t.clipboard.copyToClipboard}>
|
||||||
<Button
|
<Button
|
||||||
size="icon-sm"
|
size="icon-sm"
|
||||||
|
|||||||
@@ -46,12 +46,10 @@ export function CustomPromptBar({
|
|||||||
onInsert,
|
onInsert,
|
||||||
className,
|
className,
|
||||||
currentAgentId,
|
currentAgentId,
|
||||||
compact = false,
|
|
||||||
}: {
|
}: {
|
||||||
onInsert: (content: string) => void;
|
onInsert: (content: string) => void;
|
||||||
className?: string;
|
className?: string;
|
||||||
currentAgentId?: string | null;
|
currentAgentId?: string | null;
|
||||||
compact?: boolean;
|
|
||||||
}) {
|
}) {
|
||||||
const allPrompts = useCustomPrompts();
|
const allPrompts = useCustomPrompts();
|
||||||
const prompts = allPrompts.filter(
|
const prompts = allPrompts.filter(
|
||||||
@@ -83,13 +81,7 @@ export function CustomPromptBar({
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div
|
<div className={cn("flex min-w-0 items-center gap-1", className)}>
|
||||||
className={cn(
|
|
||||||
"flex min-w-0 items-center gap-1",
|
|
||||||
compact && "min-h-9 justify-end",
|
|
||||||
className,
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
{prompts.length > 0 && (
|
{prompts.length > 0 && (
|
||||||
<>
|
<>
|
||||||
{overflowing && (
|
{overflowing && (
|
||||||
@@ -119,7 +111,6 @@ export function CustomPromptBar({
|
|||||||
title={prompt.content}
|
title={prompt.content}
|
||||||
className={cn(
|
className={cn(
|
||||||
"border-border/60 bg-muted/40 text-foreground/80 hover:bg-muted hover:text-foreground hover:border-border max-w-[200px] shrink-0 truncate rounded-full border px-3 py-1 text-xs font-medium shadow-sm transition-colors",
|
"border-border/60 bg-muted/40 text-foreground/80 hover:bg-muted hover:text-foreground hover:border-border max-w-[200px] shrink-0 truncate rounded-full border px-3 py-1 text-xs font-medium shadow-sm transition-colors",
|
||||||
compact && "border-slate-200 bg-white px-3.5 py-1.5 text-[12px] text-slate-600 shadow-none hover:border-blue-200 hover:bg-blue-50/60 hover:text-blue-700",
|
|
||||||
"dark:border-slate-600/70 dark:bg-slate-700/40 dark:text-slate-200 dark:hover:bg-slate-700",
|
"dark:border-slate-600/70 dark:bg-slate-700/40 dark:text-slate-200 dark:hover:bg-slate-700",
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
@@ -148,11 +139,7 @@ export function CustomPromptBar({
|
|||||||
type="button"
|
type="button"
|
||||||
variant="ghost"
|
variant="ghost"
|
||||||
size="icon"
|
size="icon"
|
||||||
className={cn(
|
className="text-muted-foreground hover:text-foreground hover:bg-muted/70 h-7 w-7 shrink-0 rounded-full"
|
||||||
"text-muted-foreground hover:text-foreground hover:bg-muted/70 h-7 w-7 shrink-0 rounded-full",
|
|
||||||
compact &&
|
|
||||||
"h-9 w-9 rounded-xl border border-slate-200 bg-white text-slate-600 shadow-[0_6px_18px_-14px_rgba(15,23,42,0.4)] hover:border-blue-200 hover:bg-blue-50 hover:text-blue-700 dark:border-slate-700 dark:bg-slate-900",
|
|
||||||
)}
|
|
||||||
title="管理常用提示词"
|
title="管理常用提示词"
|
||||||
aria-label="管理常用提示词"
|
aria-label="管理常用提示词"
|
||||||
onClick={() => setManageOpen(true)}
|
onClick={() => setManageOpen(true)}
|
||||||
|
|||||||
@@ -75,10 +75,8 @@ import {
|
|||||||
} from "@/core/threads/hooks";
|
} from "@/core/threads/hooks";
|
||||||
import type { AgentThread, AgentThreadState } from "@/core/threads/types";
|
import type { AgentThread, AgentThreadState } from "@/core/threads/types";
|
||||||
import {
|
import {
|
||||||
isBootstrapThread,
|
|
||||||
isThreadFavorite,
|
isThreadFavorite,
|
||||||
isThreadPinned,
|
isThreadPinned,
|
||||||
listPathOfThread,
|
|
||||||
pathOfThread,
|
pathOfThread,
|
||||||
sortThreadsPinnedFirst,
|
sortThreadsPinnedFirst,
|
||||||
titleOfThread,
|
titleOfThread,
|
||||||
@@ -88,7 +86,6 @@ import { desensitize } from "@/lib/desensitize";
|
|||||||
import { isIMEComposing } from "@/lib/ime";
|
import { isIMEComposing } from "@/lib/ime";
|
||||||
import { cn } from "@/lib/utils";
|
import { cn } from "@/lib/utils";
|
||||||
|
|
||||||
import { agentColor } from "./agent-icon-color";
|
|
||||||
import { SidebarCollapseButton } from "./workspace-header";
|
import { SidebarCollapseButton } from "./workspace-header";
|
||||||
|
|
||||||
const NEW_CHAT_PATH = "/page/workspace/chats/new";
|
const NEW_CHAT_PATH = "/page/workspace/chats/new";
|
||||||
@@ -99,8 +96,33 @@ const MORE_CHATS_HREF = "/page/workspace/chats";
|
|||||||
/** 常用智能体最多展示个数。 */
|
/** 常用智能体最多展示个数。 */
|
||||||
const MAX_FREQUENT = 4;
|
const MAX_FREQUENT = 4;
|
||||||
|
|
||||||
// 智能体图标配色（按 id 稳定散列、分主题）抽到共享模块 ./agent-icon-color，
|
// 智能体图标统一用 Bot 机器人图标；底色按 id 稳定散列到一组主题色，复刻参考图的彩色方块。
|
||||||
// 与 zzJC/zzXD 模块左栏（AgentModuleSidebar）共用，保证彩色卡片配色完全一致。
|
// 浅色模式沿用原高彩度彩色（不改）；深蓝主题改用《深蓝 UI 规范》§1.1.7/§1.1.8 的蓝-青系
|
||||||
|
// （docs/ui规范-深蓝，克制、不刺眼），仅深蓝主题下生效，互不影响。
|
||||||
|
const AGENT_COLORS_LIGHT = [
|
||||||
|
{ from: "#fb7185", to: "#ef4444" },
|
||||||
|
{ from: "#60a5fa", to: "#3b82f6" },
|
||||||
|
{ from: "#fbbf24", to: "#f59e0b" },
|
||||||
|
{ from: "#34d399", to: "#10b981" },
|
||||||
|
{ from: "#a78bfa", to: "#8b5cf6" },
|
||||||
|
] as const;
|
||||||
|
|
||||||
|
const AGENT_COLORS_DARK = [
|
||||||
|
{ from: "#4096FF", to: "#1677FF" }, // 蓝（链接蓝 → 主色）
|
||||||
|
{ from: "#36CFC9", to: "#13C2C2" }, // 青（辅色）
|
||||||
|
{ from: "#6388FF", to: "#0958D9" }, // 紫蓝（装饰紫 → 主色深一档）
|
||||||
|
{ from: "#5CDBD3", to: "#08979C" }, // 浅青 → 深青
|
||||||
|
{ from: "#69B1FF", to: "#003EB3" }, // 浅蓝 → 主色按下
|
||||||
|
] as const;
|
||||||
|
|
||||||
|
function agentColor(id: string, isDark: boolean) {
|
||||||
|
let hash = 0;
|
||||||
|
for (let i = 0; i < id.length; i++) {
|
||||||
|
hash = (hash * 31 + id.charCodeAt(i)) >>> 0;
|
||||||
|
}
|
||||||
|
const palette = isDark ? AGENT_COLORS_DARK : AGENT_COLORS_LIGHT;
|
||||||
|
return palette[hash % palette.length]!;
|
||||||
|
}
|
||||||
|
|
||||||
/** 折叠区块标题（带 chevron 与可选计数徽标）。 */
|
/** 折叠区块标题（带 chevron 与可选计数徽标）。 */
|
||||||
function SectionLabel({
|
function SectionLabel({
|
||||||
@@ -215,12 +237,11 @@ export function GeneralQaSidebar() {
|
|||||||
|
|
||||||
const visibleThreads = useMemo(
|
const visibleThreads = useMemo(
|
||||||
() =>
|
() =>
|
||||||
// 智能体创建（bootstrap）会话也展示（带机器人图标、点击回创建页）；
|
|
||||||
// 仅排除调度 / 会商类系统会话。
|
|
||||||
sortThreadsPinnedFirst(
|
sortThreadsPinnedFirst(
|
||||||
threads.filter(
|
threads.filter(
|
||||||
(thread) =>
|
(thread) =>
|
||||||
thread.metadata?.thread_type !== "scheduler" &&
|
thread.metadata?.thread_type !== "scheduler" &&
|
||||||
|
thread.metadata?.thread_type !== "bootstrap" &&
|
||||||
thread.metadata?.thread_type !== "roundtable",
|
thread.metadata?.thread_type !== "roundtable",
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
@@ -252,9 +273,9 @@ export function GeneralQaSidebar() {
|
|||||||
let nextThreadPath = pathOfThread("new", { agent_id: agentIdFromPath });
|
let nextThreadPath = pathOfThread("new", { agent_id: agentIdFromPath });
|
||||||
if (threadIndex > -1) {
|
if (threadIndex > -1) {
|
||||||
if (threads[threadIndex + 1]) {
|
if (threads[threadIndex + 1]) {
|
||||||
nextThreadPath = listPathOfThread(threads[threadIndex + 1]!);
|
nextThreadPath = pathOfThread(threads[threadIndex + 1]!);
|
||||||
} else if (threads[threadIndex - 1]) {
|
} else if (threads[threadIndex - 1]) {
|
||||||
nextThreadPath = listPathOfThread(threads[threadIndex - 1]!);
|
nextThreadPath = pathOfThread(threads[threadIndex - 1]!);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
void router.push(nextThreadPath);
|
void router.push(nextThreadPath);
|
||||||
@@ -303,10 +324,8 @@ export function GeneralQaSidebar() {
|
|||||||
const isStatic = env.NEXT_PUBLIC_STATIC_WEBSITE_ONLY === "true";
|
const isStatic = env.NEXT_PUBLIC_STATIC_WEBSITE_ONLY === "true";
|
||||||
|
|
||||||
return (
|
return (
|
||||||
// 背景走 sidebar token（浅主题=白、浅蓝主题=浅蓝）；深蓝(.dark)主题下由 gq-sidebar
|
// 背景走 sidebar token（浅主题=白、深蓝主题=深蓝），不要写死 bg-white，否则全量版深蓝主题下侧栏仍是白底。
|
||||||
// 改为「深蓝主题底图 + 半透明蓝罩」玻璃面板（见 globals.css），与右侧 workspace-chat-bg
|
<div className="flex h-full min-h-0 flex-col bg-sidebar text-sidebar-foreground">
|
||||||
// 主区同底图、略深一档作面板区分，不要写死 bg-white。
|
|
||||||
<div className="gq-sidebar flex h-full min-h-0 flex-col bg-sidebar text-sidebar-foreground">
|
|
||||||
{/* ── 顶部：新对话胶囊 + 收起按钮 ── */}
|
{/* ── 顶部：新对话胶囊 + 收起按钮 ── */}
|
||||||
<div className="flex items-center gap-2 px-3 pt-3 pb-2">
|
<div className="flex items-center gap-2 px-3 pt-3 pb-2">
|
||||||
{/* 新对话按钮：完全自定义样式（不复用 Button variant）。borderColor / color 走
|
{/* 新对话按钮：完全自定义样式（不复用 Button variant）。borderColor / color 走
|
||||||
@@ -320,7 +339,7 @@ export function GeneralQaSidebar() {
|
|||||||
className={cn(
|
className={cn(
|
||||||
"flex h-10 min-w-0 flex-1 items-center justify-center gap-1.5 rounded-[5px] text-[14px] font-semibold transition-colors",
|
"flex h-10 min-w-0 flex-1 items-center justify-center gap-1.5 rounded-[5px] text-[14px] font-semibold transition-colors",
|
||||||
"border border-solid",
|
"border border-solid",
|
||||||
"bg-[rgb(var(--legacy-primary-rgb)/14%)] hover:bg-[rgb(var(--legacy-primary-rgb)/24%)]",
|
"bg-[color-mix(in_srgb,var(--primary)_14%,transparent)] hover:bg-[color-mix(in_srgb,var(--primary)_24%,transparent)]",
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<Plus className="size-4 stroke-[2.5]" />
|
<Plus className="size-4 stroke-[2.5]" />
|
||||||
@@ -349,64 +368,33 @@ export function GeneralQaSidebar() {
|
|||||||
type="button"
|
type="button"
|
||||||
onClick={() => handleSelectAgent(agent.id)}
|
onClick={() => handleSelectAgent(agent.id)}
|
||||||
className={cn(
|
className={cn(
|
||||||
"group relative flex w-full items-start gap-3 rounded-xl border px-3 py-2.5 text-left transition-all duration-150",
|
"group relative flex w-full items-start gap-2.5 rounded-xl border px-2.5 py-2 text-left transition-colors",
|
||||||
isActive
|
isActive
|
||||||
? isDark
|
? "border-primary/40 bg-primary/5"
|
||||||
? "border-[#2b8ffe] bg-[#0b4fae]/65 shadow-[0_0_0_1px_rgba(43,143,254,0.5),0_12px_28px_rgba(37,128,255,0.25)]"
|
: "border-transparent hover:border-border hover:bg-accent/50",
|
||||||
: "agent-sidebar-card--active border-primary/50 bg-primary/10 shadow-sm"
|
|
||||||
: isDark
|
|
||||||
? "border-[#2b8ffe]/20 bg-[#042b59]/35 hover:border-[#2b8ffe]/60 hover:bg-[#063b77]/60"
|
|
||||||
: "border-transparent hover:border-border hover:bg-accent/50",
|
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<span
|
<span
|
||||||
className={cn(
|
className="mt-0.5 flex size-9 shrink-0 items-center justify-center rounded-lg text-white shadow-sm"
|
||||||
"mt-0.5 flex size-10 shrink-0 items-center justify-center rounded-lg text-white shadow-sm",
|
|
||||||
isDark &&
|
|
||||||
isActive &&
|
|
||||||
"ring-2 ring-[#83c1ff]/35 shadow-[0_0_18px_rgba(43,143,254,0.45)]",
|
|
||||||
)}
|
|
||||||
style={{ backgroundImage: `linear-gradient(135deg, ${from}, ${to})` }}
|
style={{ backgroundImage: `linear-gradient(135deg, ${from}, ${to})` }}
|
||||||
>
|
>
|
||||||
<Bot className="size-[19px]" />
|
<Bot className="size-[18px]" />
|
||||||
</span>
|
</span>
|
||||||
<span className="min-w-0 flex-1">
|
<span className="min-w-0 flex-1">
|
||||||
<span
|
<span
|
||||||
className={cn(
|
className={cn(
|
||||||
"block truncate text-[16px] leading-5 font-bold",
|
"block truncate text-[13px] font-semibold",
|
||||||
isActive
|
isActive ? "text-primary" : "text-foreground",
|
||||||
? isDark
|
|
||||||
? "text-white"
|
|
||||||
: "text-primary"
|
|
||||||
: isDark
|
|
||||||
? "text-white/95"
|
|
||||||
: "text-foreground",
|
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
{desensitize(agent.name)}
|
{desensitize(agent.name)}
|
||||||
</span>
|
</span>
|
||||||
<span
|
<span className="mt-0.5 block truncate text-[11px] leading-snug text-muted-foreground">
|
||||||
className={cn(
|
|
||||||
"mt-1 block truncate text-[13px] leading-[1.35]",
|
|
||||||
isDark
|
|
||||||
? isActive
|
|
||||||
? "text-[#d6eaff]"
|
|
||||||
: "text-[#9ebfe2]"
|
|
||||||
: "text-muted-foreground",
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
{agent.description ? desensitize(agent.description) : "智能体助手"}
|
{agent.description ? desensitize(agent.description) : "智能体助手"}
|
||||||
</span>
|
</span>
|
||||||
</span>
|
</span>
|
||||||
{isActive && (
|
{isActive && (
|
||||||
<span
|
<span className="absolute top-1/2 right-1 h-6 w-1 -translate-y-1/2 rounded-full bg-primary" />
|
||||||
className={cn(
|
|
||||||
"absolute top-1/2 right-1.5 h-8 w-1.5 -translate-y-1/2 rounded-full",
|
|
||||||
isDark
|
|
||||||
? "bg-[#2b8ffe] shadow-[0_0_14px_rgba(43,143,254,0.85)]"
|
|
||||||
: "bg-primary",
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
)}
|
)}
|
||||||
</button>
|
</button>
|
||||||
);
|
);
|
||||||
@@ -451,9 +439,7 @@ export function GeneralQaSidebar() {
|
|||||||
</div>
|
</div>
|
||||||
) : (
|
) : (
|
||||||
filteredThreads.map((thread) => {
|
filteredThreads.map((thread) => {
|
||||||
const href = listPathOfThread(thread);
|
const isActive = pathOfThread(thread) === pathname;
|
||||||
const isActive = href === pathname;
|
|
||||||
const isBoot = isBootstrapThread(thread);
|
|
||||||
const pinned = isThreadPinned(thread);
|
const pinned = isThreadPinned(thread);
|
||||||
const favorited = isThreadFavorite(thread);
|
const favorited = isThreadFavorite(thread);
|
||||||
return (
|
return (
|
||||||
@@ -462,7 +448,7 @@ export function GeneralQaSidebar() {
|
|||||||
className="group/item relative flex items-center"
|
className="group/item relative flex items-center"
|
||||||
>
|
>
|
||||||
<Link
|
<Link
|
||||||
href={href}
|
href={pathOfThread(thread)}
|
||||||
className={cn(
|
className={cn(
|
||||||
"relative flex h-9 min-w-0 flex-1 items-center gap-2 rounded-lg px-2.5 text-[13px] transition-colors",
|
"relative flex h-9 min-w-0 flex-1 items-center gap-2 rounded-lg px-2.5 text-[13px] transition-colors",
|
||||||
isActive
|
isActive
|
||||||
@@ -470,22 +456,12 @@ export function GeneralQaSidebar() {
|
|||||||
: "text-muted-foreground hover:bg-accent/60 hover:text-foreground",
|
: "text-muted-foreground hover:bg-accent/60 hover:text-foreground",
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
{isBoot ? (
|
<MessageSquare
|
||||||
<Bot
|
className={cn(
|
||||||
className={cn(
|
"size-3.5 shrink-0",
|
||||||
"size-3.5 shrink-0",
|
isActive ? "text-primary" : "text-muted-foreground/70",
|
||||||
isActive ? "text-primary" : "text-muted-foreground/70",
|
)}
|
||||||
)}
|
/>
|
||||||
aria-label="智能体创建会话"
|
|
||||||
/>
|
|
||||||
) : (
|
|
||||||
<MessageSquare
|
|
||||||
className={cn(
|
|
||||||
"size-3.5 shrink-0",
|
|
||||||
isActive ? "text-primary" : "text-muted-foreground/70",
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
{pinned && (
|
{pinned && (
|
||||||
<Pin className="size-3 shrink-0 text-muted-foreground/70" />
|
<Pin className="size-3 shrink-0 text-muted-foreground/70" />
|
||||||
)}
|
)}
|
||||||
|
|||||||
@@ -1,20 +1,16 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
import type { ChatStatus } from "ai";
|
import type { ChatStatus } from "ai";
|
||||||
import {
|
import {
|
||||||
BarChart3Icon,
|
BrainCircuitIcon,
|
||||||
BrainCircuitIcon,
|
BookMarkedIcon,
|
||||||
BookMarkedIcon,
|
CheckIcon,
|
||||||
CheckIcon,
|
FileTextIcon,
|
||||||
ClipboardCheckIcon,
|
GraduationCapIcon,
|
||||||
FileTextIcon,
|
LightbulbIcon,
|
||||||
GraduationCapIcon,
|
PaperclipIcon,
|
||||||
LightbulbIcon,
|
PlusIcon,
|
||||||
MessageCircleQuestionIcon,
|
ShrinkIcon,
|
||||||
PaperclipIcon,
|
|
||||||
PlusIcon,
|
|
||||||
RefreshCwIcon,
|
|
||||||
ShrinkIcon,
|
|
||||||
SparklesIcon,
|
SparklesIcon,
|
||||||
RocketIcon,
|
RocketIcon,
|
||||||
XIcon,
|
XIcon,
|
||||||
@@ -65,9 +61,8 @@ import {
|
|||||||
} from "@/components/ui/dropdown-menu";
|
} from "@/components/ui/dropdown-menu";
|
||||||
import { apiFetch } from "@/core/api";
|
import { apiFetch } from "@/core/api";
|
||||||
import { getBackendBaseURL } from "@/core/config";
|
import { getBackendBaseURL } from "@/core/config";
|
||||||
import { useI18n } from "@/core/i18n/hooks";
|
import { useI18n } from "@/core/i18n/hooks";
|
||||||
import { isHiddenFromUIMessage } from "@/core/messages/utils";
|
import { useModels } from "@/core/models/hooks";
|
||||||
import { useModels } from "@/core/models/hooks";
|
|
||||||
import type { AgentThreadContext } from "@/core/threads";
|
import type { AgentThreadContext } from "@/core/threads";
|
||||||
import { textOfMessage } from "@/core/threads/utils";
|
import { textOfMessage } from "@/core/threads/utils";
|
||||||
import { desensitize } from "@/lib/desensitize";
|
import { desensitize } from "@/lib/desensitize";
|
||||||
@@ -106,58 +101,7 @@ import { useThread } from "./messages/context";
|
|||||||
import { ModeHoverGuide } from "./mode-hover-guide";
|
import { ModeHoverGuide } from "./mode-hover-guide";
|
||||||
import { Tooltip } from "./tooltip";
|
import { Tooltip } from "./tooltip";
|
||||||
|
|
||||||
type InputMode = "flash" | "thinking" | "pro" | "ultra";
|
type InputMode = "flash" | "thinking" | "pro" | "ultra";
|
||||||
|
|
||||||
const COMPACT_QUICK_STARTS = [
|
|
||||||
{
|
|
||||||
id: "report",
|
|
||||||
title: "撰写报告",
|
|
||||||
content: "请帮我撰写一份结构清晰的专业报告，先向我确认主题、受众和篇幅要求。",
|
|
||||||
icon: FileTextIcon,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "knowledge",
|
|
||||||
title: "知识问答",
|
|
||||||
content: "请基于已有资料回答我的问题，并明确区分已知事实、推断和需要补充的信息。",
|
|
||||||
icon: MessageCircleQuestionIcon,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "planning",
|
|
||||||
title: "任务规划",
|
|
||||||
content: "请把我的目标拆解为可执行的任务计划，列出优先级、里程碑和风险。",
|
|
||||||
icon: ClipboardCheckIcon,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "analysis",
|
|
||||||
title: "数据分析",
|
|
||||||
content: "请帮我分析数据中的关键趋势、异常和可能原因，并给出下一步验证建议。",
|
|
||||||
icon: BarChart3Icon,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "solution",
|
|
||||||
title: "方案策划",
|
|
||||||
content: "请围绕我的目标设计一套完整方案，包含背景、目标、实施步骤、资源需求和风险预案。",
|
|
||||||
icon: LightbulbIcon,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "summary",
|
|
||||||
title: "内容总结",
|
|
||||||
content: "请提炼我提供内容的核心观点、关键结论和待办事项，并按重要程度整理。",
|
|
||||||
icon: BookMarkedIcon,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "research",
|
|
||||||
title: "调研提纲",
|
|
||||||
content: "请根据我的调研主题生成一份结构完整的调研提纲，覆盖对象、问题、方法和输出形式。",
|
|
||||||
icon: GraduationCapIcon,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "polish",
|
|
||||||
title: "文案润色",
|
|
||||||
content: "请在不改变原意的前提下润色我提供的内容，使表达更清晰、专业、简洁。",
|
|
||||||
icon: SparklesIcon,
|
|
||||||
},
|
|
||||||
] as const;
|
|
||||||
|
|
||||||
|
|
||||||
function getResolvedMode(
|
function getResolvedMode(
|
||||||
@@ -265,41 +209,17 @@ export function InputBox({
|
|||||||
const lastGeneratedForAiIdRef = useRef<string | null>(null);
|
const lastGeneratedForAiIdRef = useRef<string | null>(null);
|
||||||
const wasStreamingRef = useRef(false);
|
const wasStreamingRef = useRef(false);
|
||||||
|
|
||||||
const [confirmOpen, setConfirmOpen] = useState(false);
|
const [confirmOpen, setConfirmOpen] = useState(false);
|
||||||
const [compactPromptOrder, setCompactPromptOrder] = useState(0);
|
|
||||||
const [pendingSuggestion, setPendingSuggestion] = useState<string | null>(
|
const [pendingSuggestion, setPendingSuggestion] = useState<string | null>(
|
||||||
null,
|
null,
|
||||||
);
|
);
|
||||||
|
|
||||||
const { questions: recommendedQuestions } = useRecommendedQuestions();
|
const { questions: recommendedQuestions } = useRecommendedQuestions();
|
||||||
const userPreferences = useUserPreferences();
|
const userPreferences = useUserPreferences();
|
||||||
const showAdminRecommendedQuestions =
|
const showAdminRecommendedQuestions =
|
||||||
!hideAdminRecommendedQuestions &&
|
!hideAdminRecommendedQuestions &&
|
||||||
!userPreferences.hide_admin_prompt_prefix &&
|
!userPreferences.hide_admin_prompt_prefix &&
|
||||||
recommendedQuestions.length > 0;
|
recommendedQuestions.length > 0;
|
||||||
const compactQuickStarts = useMemo(() => {
|
|
||||||
if (!hideAdminRecommendedQuestions && recommendedQuestions.length > 0) {
|
|
||||||
return recommendedQuestions.map((configured, index) => {
|
|
||||||
const fallback =
|
|
||||||
COMPACT_QUICK_STARTS[index % COMPACT_QUICK_STARTS.length]!;
|
|
||||||
return {
|
|
||||||
...fallback,
|
|
||||||
id: configured.id,
|
|
||||||
title: desensitize(configured.title) || `提示词 ${index + 1}`,
|
|
||||||
content: configured.content || fallback.content,
|
|
||||||
};
|
|
||||||
});
|
|
||||||
}
|
|
||||||
return [...COMPACT_QUICK_STARTS];
|
|
||||||
}, [hideAdminRecommendedQuestions, recommendedQuestions]);
|
|
||||||
const orderedCompactQuickStarts = useMemo(() => {
|
|
||||||
if (compactQuickStarts.length < 2) return compactQuickStarts;
|
|
||||||
const offset = compactPromptOrder % compactQuickStarts.length;
|
|
||||||
return [
|
|
||||||
...compactQuickStarts.slice(offset),
|
|
||||||
...compactQuickStarts.slice(0, offset),
|
|
||||||
];
|
|
||||||
}, [compactPromptOrder, compactQuickStarts]);
|
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (models.length === 0) {
|
if (models.length === 0) {
|
||||||
@@ -331,11 +251,10 @@ export function InputBox({
|
|||||||
|
|
||||||
const resolvedModelName = selectedModel?.name;
|
const resolvedModelName = selectedModel?.name;
|
||||||
|
|
||||||
const supportThinking = useMemo(
|
const supportThinking = useMemo(
|
||||||
() => selectedModel?.supports_thinking ?? false,
|
() => selectedModel?.supports_thinking ?? false,
|
||||||
[selectedModel],
|
[selectedModel],
|
||||||
);
|
);
|
||||||
const effectiveMode = getResolvedMode(context.mode, supportThinking);
|
|
||||||
|
|
||||||
const supportReasoningEffort = useMemo(
|
const supportReasoningEffort = useMemo(
|
||||||
() => selectedModel?.supports_reasoning_effort ?? false,
|
() => selectedModel?.supports_reasoning_effort ?? false,
|
||||||
@@ -548,15 +467,14 @@ export function InputBox({
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
const visibleMessages = thread.messages.filter((m) => !isHiddenFromUIMessage(m));
|
const lastAi = [...thread.messages].reverse().find((m) => m.type === "ai");
|
||||||
const lastAi = [...visibleMessages].reverse().find((m) => m.type === "ai");
|
|
||||||
const lastAiId = lastAi?.id ?? null;
|
const lastAiId = lastAi?.id ?? null;
|
||||||
if (!lastAiId || lastAiId === lastGeneratedForAiIdRef.current) {
|
if (!lastAiId || lastAiId === lastGeneratedForAiIdRef.current) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
lastGeneratedForAiIdRef.current = lastAiId;
|
lastGeneratedForAiIdRef.current = lastAiId;
|
||||||
|
|
||||||
const recent = visibleMessages
|
const recent = thread.messages
|
||||||
.filter((m) => m.type === "human" || m.type === "ai")
|
.filter((m) => m.type === "human" || m.type === "ai")
|
||||||
.map((m) => {
|
.map((m) => {
|
||||||
const role = m.type === "human" ? "user" : "assistant";
|
const role = m.type === "human" ? "user" : "assistant";
|
||||||
@@ -609,68 +527,14 @@ export function InputBox({
|
|||||||
}, [context.model_name, disabled, isMock, status, thread.messages, threadId]);
|
}, [context.model_name, disabled, isMock, status, thread.messages, threadId]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div
|
<div ref={promptRootRef} className="relative flex flex-col gap-6">
|
||||||
ref={promptRootRef}
|
|
||||||
className={cn(
|
|
||||||
"relative flex flex-col",
|
|
||||||
compact ? "gap-[clamp(32px,6vh,58px)]" : "gap-6",
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
{extraHeader && (
|
{extraHeader && (
|
||||||
<div className="flex items-center justify-center">
|
<div className="flex items-center justify-center">
|
||||||
{extraHeader}
|
{extraHeader}
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{isNewThread && searchParams.get("mode") !== "skill" && compact && (
|
{isNewThread && searchParams.get("mode") !== "skill" && showAdminRecommendedQuestions && (
|
||||||
<section className="px-2" aria-labelledby="recommended-prompts-title">
|
|
||||||
<div className="mb-3 flex items-center justify-center gap-1.5">
|
|
||||||
<h2
|
|
||||||
id="recommended-prompts-title"
|
|
||||||
className="text-[14px] font-normal text-slate-400 dark:text-slate-500"
|
|
||||||
>
|
|
||||||
你可以这样问我
|
|
||||||
</h2>
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
data-prompt-order-refresh="true"
|
|
||||||
title="调整提示词顺序"
|
|
||||||
aria-label="调整提示词顺序"
|
|
||||||
onClick={() => setCompactPromptOrder((current) => current + 1)}
|
|
||||||
className="flex size-7 items-center justify-center rounded-full text-slate-400 transition-colors hover:bg-slate-100 hover:text-blue-600 focus-visible:outline-none focus-visible:ring-4 focus-visible:ring-blue-500/15 dark:hover:bg-slate-800 dark:hover:text-blue-300"
|
|
||||||
>
|
|
||||||
<RefreshCwIcon className="size-3.5" strokeWidth={1.8} />
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
<div className="mx-auto flex max-w-[900px] flex-wrap justify-center gap-x-3 gap-y-3">
|
|
||||||
{orderedCompactQuickStarts.map((item) => {
|
|
||||||
return (
|
|
||||||
<button
|
|
||||||
key={item.id}
|
|
||||||
type="button"
|
|
||||||
data-quick-prompt={item.id}
|
|
||||||
title={item.content}
|
|
||||||
className="inline-flex min-h-11 max-w-full items-center justify-center rounded-xl border border-[#e5e7eb] bg-white px-4 py-2 text-center text-[14px] font-normal leading-5 text-slate-700 shadow-[0_2px_6px_rgba(15,23,42,0.025)] transition-[background-color,border-color,box-shadow] hover:border-slate-300 hover:bg-slate-50 hover:text-slate-900 hover:shadow-[0_4px_10px_rgba(15,23,42,0.04)] focus-visible:outline-none focus-visible:ring-4 focus-visible:ring-blue-500/15 dark:border-slate-700 dark:bg-slate-900 dark:text-slate-200 dark:hover:border-slate-600 dark:hover:bg-slate-800"
|
|
||||||
onClick={() => {
|
|
||||||
textInput.setInput(item.content);
|
|
||||||
requestAnimationFrame(() =>
|
|
||||||
document
|
|
||||||
.querySelector<HTMLTextAreaElement>(
|
|
||||||
"textarea[name='message']",
|
|
||||||
)
|
|
||||||
?.focus(),
|
|
||||||
);
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<span className="max-w-full whitespace-normal">{item.title}</span>
|
|
||||||
</button>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{isNewThread && searchParams.get("mode") !== "skill" && !compact && showAdminRecommendedQuestions && (
|
|
||||||
<div className="flex flex-wrap justify-center gap-2.5 px-4 mb-[10px]">
|
<div className="flex flex-wrap justify-center gap-2.5 px-4 mb-[10px]">
|
||||||
{recommendedQuestions.map((q) => (
|
{recommendedQuestions.map((q) => (
|
||||||
<button
|
<button
|
||||||
@@ -721,10 +585,9 @@ export function InputBox({
|
|||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
<div className="flex flex-col gap-1.5">
|
<div className="flex flex-col gap-1.5">
|
||||||
{isNewThread && (
|
{isNewThread && (
|
||||||
<CustomPromptBar
|
<CustomPromptBar
|
||||||
compact={compact}
|
className="px-1"
|
||||||
className={cn(compact ? "px-2" : "px-1")}
|
|
||||||
currentAgentId={agentSelector?.selectedAgentId ?? assistantId ?? null}
|
currentAgentId={agentSelector?.selectedAgentId ?? assistantId ?? null}
|
||||||
onInsert={(content) => {
|
onInsert={(content) => {
|
||||||
const current = textInput.value?.trim() ?? "";
|
const current = textInput.value?.trim() ?? "";
|
||||||
@@ -747,8 +610,8 @@ export function InputBox({
|
|||||||
? "*:data-[slot='input-group']:rounded-2xl *:data-[slot='input-group']:border-0 *:data-[slot='input-group']:bg-transparent *:data-[slot='input-group']:shadow-none"
|
? "*:data-[slot='input-group']:rounded-2xl *:data-[slot='input-group']:border-0 *:data-[slot='input-group']:bg-transparent *:data-[slot='input-group']:shadow-none"
|
||||||
: "*:data-[slot='input-group']:rounded-3xl",
|
: "*:data-[slot='input-group']:rounded-3xl",
|
||||||
// 紧凑落地态（CM 参考图）：白卡 + 细边 + 轻阴影 + 主色聚焦环（无旋转彩边）
|
// 紧凑落地态（CM 参考图）：白卡 + 细边 + 轻阴影 + 主色聚焦环（无旋转彩边）
|
||||||
compact && isNewThread
|
compact && isNewThread
|
||||||
? "overflow-hidden rounded-[24px] border border-slate-200/90 bg-white shadow-[0_18px_50px_-32px_rgba(37,99,235,0.6),0_8px_24px_-20px_rgba(15,23,42,0.35)] transition-all duration-300 focus-within:border-blue-300 focus-within:ring-4 focus-within:ring-blue-500/10 dark:border-slate-700 dark:bg-slate-800"
|
? "rounded-2xl border border-gray-200/70 bg-white overflow-hidden shadow-[0_4.5px_22px_rgba(0,0,0,0.025)] transition-all duration-300 focus-within:border-[color-mix(in_srgb,var(--primary)_35%,transparent)] focus-within:ring-4 focus-within:ring-[color-mix(in_srgb,var(--primary)_5%,transparent)] focus-within:shadow-[0_10px_35px_color-mix(in_srgb,var(--primary)_4%,transparent)] dark:border-slate-700 dark:bg-slate-800"
|
||||||
: // landing 态：透明，让外层 gemini-gradient-border 提供白卡 + 旋转描边
|
: // landing 态：透明，让外层 gemini-gradient-border 提供白卡 + 旋转描边
|
||||||
// 对话态：常规白卡 + 中性边框 + 轻阴影
|
// 对话态：常规白卡 + 中性边框 + 轻阴影
|
||||||
isNewThread
|
isNewThread
|
||||||
@@ -772,8 +635,7 @@ export function InputBox({
|
|||||||
className={cn(
|
className={cn(
|
||||||
"size-full px-2 py-1 text-[15px] leading-7 placeholder:text-muted-foreground/60",
|
"size-full px-2 py-1 text-[15px] leading-7 placeholder:text-muted-foreground/60",
|
||||||
isNewThread && "min-h-[110px]!",
|
isNewThread && "min-h-[110px]!",
|
||||||
compact &&
|
compact && "min-h-[84px]! px-3 pt-3 pb-1 text-[14px]",
|
||||||
"min-h-[clamp(150px,18vh,176px)]! px-7 pt-7 pb-2 text-[15px]",
|
|
||||||
)}
|
)}
|
||||||
disabled={disabled}
|
disabled={disabled}
|
||||||
placeholder={t.inputBox.placeholder}
|
placeholder={t.inputBox.placeholder}
|
||||||
@@ -784,7 +646,7 @@ export function InputBox({
|
|||||||
<PromptInputFooter
|
<PromptInputFooter
|
||||||
className={cn(
|
className={cn(
|
||||||
"flex items-center border-t-0 px-2 pt-1 pb-1.5",
|
"flex items-center border-t-0 px-2 pt-1 pb-1.5",
|
||||||
compact && "gap-2 px-6 pt-2 pb-5",
|
compact && "gap-2 px-3 pt-1.5 pb-3",
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<PromptInputTools
|
<PromptInputTools
|
||||||
@@ -816,21 +678,18 @@ export function InputBox({
|
|||||||
<PromptInputButton
|
<PromptInputButton
|
||||||
className={cn(
|
className={cn(
|
||||||
"gap-1.5! rounded-full px-3! shadow-none",
|
"gap-1.5! rounded-full px-3! shadow-none",
|
||||||
compact && "rounded-lg px-2.5! py-1! text-[11px] font-medium",
|
compact && "rounded-lg px-2.5! py-1! text-[11px] font-medium",
|
||||||
context.writing_mode
|
context.writing_mode
|
||||||
? "border border-amber-300 bg-amber-50 text-amber-700 ring-1 ring-amber-300/35 hover:bg-amber-100 dark:border-amber-300/70 dark:bg-amber-400/20 dark:text-amber-100 dark:ring-amber-300/35 dark:shadow-[0_0_0_1px_rgba(251,191,36,0.18),0_0_18px_rgba(251,191,36,0.18)] dark:hover:bg-amber-400/25"
|
? "border border-amber-300 bg-amber-50 text-amber-700 hover:bg-amber-100 dark:border-amber-700 dark:bg-amber-950/40 dark:text-amber-200"
|
||||||
: compact
|
: compact
|
||||||
? "border border-transparent bg-muted/40 text-muted-foreground hover:bg-muted hover:text-foreground"
|
? "border border-transparent bg-muted/40 text-muted-foreground hover:bg-muted hover:text-foreground"
|
||||||
: "border-0 bg-transparent text-muted-foreground hover:bg-muted/70 hover:text-foreground dark:text-slate-400 dark:hover:bg-slate-700/70 dark:hover:text-slate-100",
|
: "border-0 bg-transparent text-muted-foreground hover:bg-muted/70 hover:text-foreground dark:text-slate-400 dark:hover:bg-slate-700/70 dark:hover:text-slate-100",
|
||||||
)}
|
)}
|
||||||
onClick={handleWritingModeToggle}
|
onClick={handleWritingModeToggle}
|
||||||
>
|
>
|
||||||
{context.writing_mode && (
|
<FileTextIcon className="size-3" />
|
||||||
<CheckIcon className="size-3 text-amber-700 dark:text-amber-100" />
|
<span className="text-xs font-normal">写作</span>
|
||||||
)}
|
</PromptInputButton>
|
||||||
<FileTextIcon className="size-3" />
|
|
||||||
<span className="text-xs font-normal">写作</span>
|
|
||||||
</PromptInputButton>
|
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
<Tooltip
|
<Tooltip
|
||||||
content={
|
content={
|
||||||
@@ -841,22 +700,19 @@ export function InputBox({
|
|||||||
>
|
>
|
||||||
<PromptInputButton
|
<PromptInputButton
|
||||||
className={cn(
|
className={cn(
|
||||||
"gap-1.5! rounded-full px-3! shadow-none",
|
"gap-1.5! rounded-full px-3! shadow-none",
|
||||||
compact && "rounded-lg px-2.5! py-1! text-[11px] font-medium",
|
compact && "rounded-lg px-2.5! py-1! text-[11px] font-medium",
|
||||||
memoryInjectionEnabled
|
memoryInjectionEnabled
|
||||||
? "border border-blue-300 bg-blue-50 text-blue-700 ring-1 ring-blue-300/35 hover:bg-blue-100 dark:border-cyan-300/70 dark:bg-cyan-400/20 dark:text-cyan-50 dark:ring-cyan-300/35 dark:shadow-[0_0_0_1px_rgba(34,211,238,0.18),0_0_18px_rgba(34,211,238,0.18)] dark:hover:bg-cyan-400/25"
|
? "border border-blue-300 bg-blue-50 text-blue-700 hover:bg-blue-100 dark:border-blue-700 dark:bg-blue-950/40 dark:text-blue-200"
|
||||||
: compact
|
: compact
|
||||||
? "border border-transparent bg-muted/40 text-muted-foreground hover:bg-muted hover:text-foreground"
|
? "border border-transparent bg-muted/40 text-muted-foreground hover:bg-muted hover:text-foreground"
|
||||||
: "border-0 bg-transparent text-muted-foreground hover:bg-muted/70 hover:text-foreground dark:text-slate-400 dark:hover:bg-slate-700/70 dark:hover:text-slate-100",
|
: "border-0 bg-transparent text-muted-foreground hover:bg-muted/70 hover:text-foreground dark:text-slate-400 dark:hover:bg-slate-700/70 dark:hover:text-slate-100",
|
||||||
)}
|
)}
|
||||||
onClick={handleMemoryInjectionToggle}
|
onClick={handleMemoryInjectionToggle}
|
||||||
>
|
>
|
||||||
{memoryInjectionEnabled && (
|
<BrainCircuitIcon className="size-3" />
|
||||||
<CheckIcon className="size-3 text-blue-700 dark:text-cyan-50" />
|
<span className="text-xs font-normal">记忆</span>
|
||||||
)}
|
</PromptInputButton>
|
||||||
<BrainCircuitIcon className="size-3" />
|
|
||||||
<span className="text-xs font-normal">记忆</span>
|
|
||||||
</PromptInputButton>
|
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
<Tooltip
|
<Tooltip
|
||||||
content={
|
content={
|
||||||
@@ -919,47 +775,52 @@ export function InputBox({
|
|||||||
</Tooltip>
|
</Tooltip>
|
||||||
<PromptInputActionMenu>
|
<PromptInputActionMenu>
|
||||||
<ModeHoverGuide
|
<ModeHoverGuide
|
||||||
mode={
|
mode={
|
||||||
effectiveMode
|
context.mode === "flash" ||
|
||||||
}
|
context.mode === "thinking" ||
|
||||||
|
context.mode === "pro" ||
|
||||||
|
context.mode === "ultra"
|
||||||
|
? context.mode
|
||||||
|
: "flash"
|
||||||
|
}
|
||||||
>
|
>
|
||||||
<PromptInputActionMenuTrigger
|
<PromptInputActionMenuTrigger
|
||||||
className={cn(
|
className={cn(
|
||||||
"gap-1.5! rounded-full border-0 bg-transparent px-3! text-muted-foreground shadow-none hover:bg-muted/70 hover:text-foreground dark:text-slate-400 dark:hover:bg-slate-700/70 dark:hover:text-slate-100",
|
"gap-1.5! rounded-full border-0 bg-transparent px-3! text-muted-foreground shadow-none hover:bg-muted/70 hover:text-foreground dark:text-slate-400 dark:hover:bg-slate-700/70 dark:hover:text-slate-100",
|
||||||
compact && "rounded-lg border px-2.5! py-1! text-[11px] font-medium",
|
compact && "rounded-lg border px-2.5! py-1! text-[11px] font-medium",
|
||||||
compact &&
|
compact &&
|
||||||
(effectiveMode === "thinking"
|
(context.mode === "thinking"
|
||||||
? "border-indigo-200 bg-indigo-50/60 text-indigo-700 hover:bg-indigo-100 dark:border-indigo-700 dark:bg-indigo-950/40 dark:text-indigo-200"
|
? "border-indigo-200 bg-indigo-50/60 text-indigo-700 hover:bg-indigo-100 dark:border-indigo-700 dark:bg-indigo-950/40 dark:text-indigo-200"
|
||||||
: effectiveMode === "pro"
|
: context.mode === "pro"
|
||||||
? "border-violet-200 bg-violet-50/60 text-violet-700 hover:bg-violet-100 dark:border-violet-700 dark:bg-violet-950/40 dark:text-violet-200"
|
? "border-violet-200 bg-violet-50/60 text-violet-700 hover:bg-violet-100 dark:border-violet-700 dark:bg-violet-950/40 dark:text-violet-200"
|
||||||
: effectiveMode === "ultra"
|
: context.mode === "ultra"
|
||||||
? "border-amber-200 bg-amber-50/60 text-amber-700 hover:bg-amber-100 dark:border-amber-700 dark:bg-amber-950/40 dark:text-amber-200"
|
? "border-amber-200 bg-amber-50/60 text-amber-700 hover:bg-amber-100 dark:border-amber-700 dark:bg-amber-950/40 dark:text-amber-200"
|
||||||
: "border-transparent bg-muted/40 hover:bg-muted hover:text-foreground"),
|
: "border-transparent bg-muted/40 hover:bg-muted hover:text-foreground"),
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<div>
|
<div>
|
||||||
{effectiveMode === "flash" && <ZapIcon className="size-3" />}
|
{context.mode === "flash" && <ZapIcon className="size-3" />}
|
||||||
{effectiveMode === "thinking" && (
|
{context.mode === "thinking" && (
|
||||||
<LightbulbIcon className="size-3" />
|
<LightbulbIcon className="size-3" />
|
||||||
)}
|
)}
|
||||||
{effectiveMode === "pro" && (
|
{context.mode === "pro" && (
|
||||||
<GraduationCapIcon className="size-3" />
|
<GraduationCapIcon className="size-3" />
|
||||||
)}
|
)}
|
||||||
{effectiveMode === "ultra" && (
|
{context.mode === "ultra" && (
|
||||||
<RocketIcon className="size-3 text-[#dabb5e]" />
|
<RocketIcon className="size-3 text-[#dabb5e]" />
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
className={cn(
|
className={cn(
|
||||||
"text-xs font-normal",
|
"text-xs font-normal",
|
||||||
effectiveMode === "ultra" ? "golden-text" : "",
|
context.mode === "ultra" ? "golden-text" : "",
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
{(effectiveMode === "flash" && t.inputBox.flashMode) ||
|
{(context.mode === "flash" && t.inputBox.flashMode) ||
|
||||||
(effectiveMode === "thinking" &&
|
(context.mode === "thinking" &&
|
||||||
t.inputBox.reasoningMode) ||
|
t.inputBox.reasoningMode) ||
|
||||||
(effectiveMode === "pro" && t.inputBox.proMode) ||
|
(context.mode === "pro" && t.inputBox.proMode) ||
|
||||||
(effectiveMode === "ultra" && t.inputBox.ultraMode)}
|
(context.mode === "ultra" && t.inputBox.ultraMode)}
|
||||||
</div>
|
</div>
|
||||||
</PromptInputActionMenuTrigger>
|
</PromptInputActionMenuTrigger>
|
||||||
</ModeHoverGuide>
|
</ModeHoverGuide>
|
||||||
@@ -1255,10 +1116,8 @@ export function InputBox({
|
|||||||
onOpenChange={setModelDialogOpen}
|
onOpenChange={setModelDialogOpen}
|
||||||
>
|
>
|
||||||
<ModelSelectorTrigger asChild>
|
<ModelSelectorTrigger asChild>
|
||||||
<PromptInputButton
|
<PromptInputButton
|
||||||
disabled={models.length === 0}
|
className={cn(
|
||||||
aria-label="模型选择"
|
|
||||||
className={cn(
|
|
||||||
"rounded-full border-0 bg-transparent px-3 shadow-none text-muted-foreground hover:bg-muted/70 hover:text-foreground dark:text-slate-400 dark:hover:bg-slate-700/70 dark:hover:text-slate-100",
|
"rounded-full border-0 bg-transparent px-3 shadow-none text-muted-foreground hover:bg-muted/70 hover:text-foreground dark:text-slate-400 dark:hover:bg-slate-700/70 dark:hover:text-slate-100",
|
||||||
compact &&
|
compact &&
|
||||||
"rounded-lg border border-transparent bg-gray-50/60 px-2.5! py-1! font-mono text-gray-600 hover:bg-gray-100/80 hover:text-gray-800 dark:bg-slate-700/50 dark:text-slate-300 dark:hover:bg-slate-700",
|
"rounded-lg border border-transparent bg-gray-50/60 px-2.5! py-1! font-mono text-gray-600 hover:bg-gray-100/80 hover:text-gray-800 dark:bg-slate-700/50 dark:text-slate-300 dark:hover:bg-slate-700",
|
||||||
@@ -1271,7 +1130,7 @@ export function InputBox({
|
|||||||
compact && "text-[11px]",
|
compact && "text-[11px]",
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
{selectedModel?.display_name || "默认模型"}
|
{selectedModel?.display_name}
|
||||||
</ModelSelectorName>
|
</ModelSelectorName>
|
||||||
</div>
|
</div>
|
||||||
</PromptInputButton>
|
</PromptInputButton>
|
||||||
@@ -1304,8 +1163,8 @@ export function InputBox({
|
|||||||
<PromptInputSubmit
|
<PromptInputSubmit
|
||||||
className={cn(
|
className={cn(
|
||||||
"rounded-full border-border bg-background shadow-sm hover:bg-muted dark:bg-blue-500 dark:border-blue-500 dark:text-white dark:hover:bg-blue-400 dark:shadow-none",
|
"rounded-full border-border bg-background shadow-sm hover:bg-muted dark:bg-blue-500 dark:border-blue-500 dark:text-white dark:hover:bg-blue-400 dark:shadow-none",
|
||||||
compact &&
|
compact &&
|
||||||
"size-10 rounded-full border-0 bg-blue-600 text-white shadow-[0_8px_18px_-10px_rgba(37,99,235,0.9)] hover:bg-blue-700 disabled:bg-muted disabled:text-muted-foreground/40 dark:border-0 dark:bg-blue-500 dark:text-white dark:hover:bg-blue-400 dark:disabled:bg-muted",
|
"size-7 rounded-lg border-0 bg-[var(--primary)] text-[var(--primary-foreground)] hover:bg-[color-mix(in_srgb,var(--primary)_88%,black)] disabled:bg-muted disabled:text-muted-foreground/40 dark:bg-[var(--primary)] dark:border-0 dark:text-[var(--primary-foreground)] dark:hover:bg-[color-mix(in_srgb,var(--primary)_88%,black)] dark:disabled:bg-muted",
|
||||||
)}
|
)}
|
||||||
disabled={disabled}
|
disabled={disabled}
|
||||||
variant="outline"
|
variant="outline"
|
||||||
|
|||||||
@@ -65,10 +65,7 @@ import { cn } from "@/lib/utils";
|
|||||||
import { useArtifactsOptional } from "../artifacts";
|
import { useArtifactsOptional } from "../artifacts";
|
||||||
import { FlipDisplay } from "../flip-display";
|
import { FlipDisplay } from "../flip-display";
|
||||||
import { Tooltip } from "../tooltip";
|
import { Tooltip } from "../tooltip";
|
||||||
import {
|
import { SourceCard } from "../skill-display-sources";
|
||||||
isWeKnoraSourcePreviewUrl,
|
|
||||||
SourceCard,
|
|
||||||
} from "../skill-display-sources";
|
|
||||||
|
|
||||||
import { MarkdownContent } from "./markdown-content";
|
import { MarkdownContent } from "./markdown-content";
|
||||||
|
|
||||||
@@ -642,43 +639,19 @@ function DisplayResultsList({ results }: { results: RuntimeDisplaySource[] }) {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
function SearchResultCard({ item }: { item: SearchResultItem }) {
|
function SearchResultCard({ item }: { item: SearchResultItem }) {
|
||||||
const [open, setOpen] = useState(false);
|
const [open, setOpen] = useState(false);
|
||||||
const content = item.snippet ?? item.content;
|
const content = item.snippet ?? item.content;
|
||||||
const date = item.published_date ?? item.publishedDate ?? item.date;
|
const date = item.published_date ?? item.publishedDate ?? item.date;
|
||||||
let sourceLabel: string | undefined = item.source;
|
let sourceLabel: string | undefined = item.source;
|
||||||
if (item.url) {
|
if (item.url) {
|
||||||
try {
|
try {
|
||||||
sourceLabel = new URL(item.url).hostname.replace(/^www\./, "");
|
sourceLabel = new URL(item.url).hostname.replace(/^www\./, "");
|
||||||
} catch {
|
} catch {
|
||||||
sourceLabel = sourceLabel ?? item.url;
|
sourceLabel = sourceLabel ?? item.url;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
return (
|
||||||
// MCP retrieval tools without a configured display adapter fall back to this
|
|
||||||
// generic result card. Preserve the normal web-search UI, but route our
|
|
||||||
// credential-free WeKnora pointer through SourceCard so its dialog exposes a
|
|
||||||
// deliberate “查看原文” action rather than rendering the internal route text.
|
|
||||||
if (isWeKnoraSourcePreviewUrl(item.url)) {
|
|
||||||
const weknoraSource: RuntimeDisplaySource = {
|
|
||||||
id: item.id ?? item.uuid ?? item.docId,
|
|
||||||
title: item.title ?? "检索结果",
|
|
||||||
type: item.source ?? "document",
|
|
||||||
snippet: item.snippet ?? item.content ?? "",
|
|
||||||
content,
|
|
||||||
source: item.source,
|
|
||||||
author: item.author,
|
|
||||||
time: date,
|
|
||||||
url: item.url,
|
|
||||||
index: 0,
|
|
||||||
skillName: "weknora-knowledge-search",
|
|
||||||
mode: "list",
|
|
||||||
raw: { ...item },
|
|
||||||
};
|
|
||||||
return <SourceCard source={weknoraSource} />;
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
<>
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
|
|||||||
@@ -138,7 +138,6 @@ export function MessageListItem({
|
|||||||
extraRehypePlugins,
|
extraRehypePlugins,
|
||||||
onEditResubmit,
|
onEditResubmit,
|
||||||
onMessageDeleted,
|
onMessageDeleted,
|
||||||
turnTime,
|
|
||||||
}: {
|
}: {
|
||||||
className?: string;
|
className?: string;
|
||||||
fitRowToContent?: boolean;
|
fitRowToContent?: boolean;
|
||||||
@@ -155,13 +154,6 @@ export function MessageListItem({
|
|||||||
extraRehypePlugins?: ReturnType<typeof useRehypeSplitWordsIntoSpans>;
|
extraRehypePlugins?: ReturnType<typeof useRehypeSplitWordsIntoSpans>;
|
||||||
onEditResubmit?: (text: string) => void;
|
onEditResubmit?: (text: string) => void;
|
||||||
onMessageDeleted?: (deletedIds: string[]) => void;
|
onMessageDeleted?: (deletedIds: string[]) => void;
|
||||||
/**
|
|
||||||
* Durable ask time of the turn this message belongs to (the preceding
|
|
||||||
* question's `client_ts`). Used to time-stamp the AI answer, which carries no
|
|
||||||
* timestamp of its own — without it the answer would fall back to the current
|
|
||||||
* wall clock at render time and appear to "drift" to now on every reload.
|
|
||||||
*/
|
|
||||||
turnTime?: string;
|
|
||||||
}) {
|
}) {
|
||||||
const isHuman = message.type === 'human';
|
const isHuman = message.type === 'human';
|
||||||
const messageMarkdown =
|
const messageMarkdown =
|
||||||
@@ -190,7 +182,6 @@ export function MessageListItem({
|
|||||||
extraRehypePlugins={extraRehypePlugins}
|
extraRehypePlugins={extraRehypePlugins}
|
||||||
onEditResubmit={onEditResubmit}
|
onEditResubmit={onEditResubmit}
|
||||||
onMessageDeleted={onMessageDeleted}
|
onMessageDeleted={onMessageDeleted}
|
||||||
turnTime={turnTime}
|
|
||||||
/>
|
/>
|
||||||
{/*
|
{/*
|
||||||
Human messages carry their own inline copy/edit toolbar inside
|
Human messages carry their own inline copy/edit toolbar inside
|
||||||
@@ -399,7 +390,6 @@ function MessageContent_({
|
|||||||
extraRehypePlugins,
|
extraRehypePlugins,
|
||||||
onEditResubmit,
|
onEditResubmit,
|
||||||
onMessageDeleted,
|
onMessageDeleted,
|
||||||
turnTime,
|
|
||||||
}: {
|
}: {
|
||||||
className?: string;
|
className?: string;
|
||||||
message: Message;
|
message: Message;
|
||||||
@@ -410,7 +400,6 @@ function MessageContent_({
|
|||||||
extraRehypePlugins?: ReturnType<typeof useRehypeSplitWordsIntoSpans>;
|
extraRehypePlugins?: ReturnType<typeof useRehypeSplitWordsIntoSpans>;
|
||||||
onEditResubmit?: (text: string) => void;
|
onEditResubmit?: (text: string) => void;
|
||||||
onMessageDeleted?: (deletedIds: string[]) => void;
|
onMessageDeleted?: (deletedIds: string[]) => void;
|
||||||
turnTime?: string;
|
|
||||||
}) {
|
}) {
|
||||||
const baseRehypePlugins = useRehypeSplitWordsIntoSpans(isLoading);
|
const baseRehypePlugins = useRehypeSplitWordsIntoSpans(isLoading);
|
||||||
|
|
||||||
@@ -467,15 +456,9 @@ function MessageContent_({
|
|||||||
[threadId, resolveArtifact],
|
[threadId, resolveArtifact],
|
||||||
);
|
);
|
||||||
|
|
||||||
// Question carries its own `client_ts` (round-trips through the checkpoint).
|
|
||||||
// The AI answer has no timestamp of its own, so it inherits the turn's ask
|
|
||||||
// time (its question's `client_ts`, threaded down as `turnTime`). This is
|
|
||||||
// durable and turn-accurate, and — unlike the old per-id `now` fallback —
|
|
||||||
// never drifts to the current clock when an unfinished answer is reloaded.
|
|
||||||
const ownAskTime = message.id ? askTimes[message.id] : undefined;
|
|
||||||
const messageTime = formatAskedTime(
|
const messageTime = formatAskedTime(
|
||||||
message.additional_kwargs?.client_ts ??
|
message.additional_kwargs?.client_ts ??
|
||||||
(isHuman ? ownAskTime : (turnTime ?? ownAskTime)),
|
(message.id ? askTimes[message.id] : undefined),
|
||||||
);
|
);
|
||||||
|
|
||||||
const rawContent = extractContentFromMessage(message);
|
const rawContent = extractContentFromMessage(message);
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
import type { Message } from "@langchain/langgraph-sdk";
|
import type { Message } from "@langchain/langgraph-sdk";
|
||||||
import type { BaseStream } from "@langchain/langgraph-sdk/react";
|
import type { BaseStream } from "@langchain/langgraph-sdk/react";
|
||||||
import { CheckIcon, PenLineIcon, SendIcon, XIcon } from "lucide-react";
|
import { CheckIcon, SendIcon, XIcon } from "lucide-react";
|
||||||
import { useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
|
import { useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
|
||||||
import { useStickToBottomContext } from "use-stick-to-bottom";
|
import { useStickToBottomContext } from "use-stick-to-bottom";
|
||||||
|
|
||||||
@@ -11,7 +11,7 @@ import {
|
|||||||
} from "@/components/ai-elements/conversation";
|
} from "@/components/ai-elements/conversation";
|
||||||
import { Button } from "@/components/ui/button";
|
import { Button } from "@/components/ui/button";
|
||||||
import { Textarea } from "@/components/ui/textarea";
|
import { Textarea } from "@/components/ui/textarea";
|
||||||
import { rememberAskTimes, useChatAskTimes } from "@/core/chat-timestamps";
|
import { rememberAskTimes } from "@/core/chat-timestamps";
|
||||||
import { useI18n } from "@/core/i18n/hooks";
|
import { useI18n } from "@/core/i18n/hooks";
|
||||||
import {
|
import {
|
||||||
extractContentFromMessage,
|
extractContentFromMessage,
|
||||||
@@ -22,7 +22,6 @@ import {
|
|||||||
hasPresentFiles,
|
hasPresentFiles,
|
||||||
hasReasoning,
|
hasReasoning,
|
||||||
hasToolCalls,
|
hasToolCalls,
|
||||||
isHiddenFromUIMessage,
|
|
||||||
} from "@/core/messages/utils";
|
} from "@/core/messages/utils";
|
||||||
import { useRehypeSplitWordsIntoSpans } from "@/core/rehype";
|
import { useRehypeSplitWordsIntoSpans } from "@/core/rehype";
|
||||||
import { isThreadRagModeLocked, useLocalSettings } from "@/core/settings";
|
import { isThreadRagModeLocked, useLocalSettings } from "@/core/settings";
|
||||||
@@ -103,7 +102,6 @@ export function MessageList({
|
|||||||
onSetupAgentReject,
|
onSetupAgentReject,
|
||||||
onSetupWritingApprove,
|
onSetupWritingApprove,
|
||||||
onSetupWritingReject,
|
onSetupWritingReject,
|
||||||
onSetupWritingStart,
|
|
||||||
}: {
|
}: {
|
||||||
className?: string;
|
className?: string;
|
||||||
contentClassName?: string;
|
contentClassName?: string;
|
||||||
@@ -121,8 +119,6 @@ export function MessageList({
|
|||||||
onSetupAgentReject?: (payload: SetupAgentApprovalPayload) => void | Promise<void>;
|
onSetupAgentReject?: (payload: SetupAgentApprovalPayload) => void | Promise<void>;
|
||||||
onSetupWritingApprove?: (payload: SetupWritingApprovalPayload) => void | Promise<void>;
|
onSetupWritingApprove?: (payload: SetupWritingApprovalPayload) => void | Promise<void>;
|
||||||
onSetupWritingReject?: (payload: SetupWritingApprovalPayload) => void | Promise<void>;
|
onSetupWritingReject?: (payload: SetupWritingApprovalPayload) => void | Promise<void>;
|
||||||
/** 审批卡「直接开始写作」回调：应用配置（含已确认大纲）并立即启动写作流程（仅写作页提供，模板编辑等场景缺省隐藏该按钮）。 */
|
|
||||||
onSetupWritingStart?: (payload: SetupWritingApprovalPayload) => void | Promise<void>;
|
|
||||||
}) {
|
}) {
|
||||||
const baseRehypePlugins = useRehypeSplitWordsIntoSpans(thread.isLoading);
|
const baseRehypePlugins = useRehypeSplitWordsIntoSpans(thread.isLoading);
|
||||||
const rehypePlugins = useMemo(
|
const rehypePlugins = useMemo(
|
||||||
@@ -155,10 +151,7 @@ export function MessageList({
|
|||||||
});
|
});
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
const allMessages = useMemo(
|
const allMessages = thread.messages;
|
||||||
() => thread.messages.filter((m) => !isHiddenFromUIMessage(m)),
|
|
||||||
[thread.messages],
|
|
||||||
);
|
|
||||||
const messages = useMemo(
|
const messages = useMemo(
|
||||||
() =>
|
() =>
|
||||||
hiddenMessageIds.size === 0
|
hiddenMessageIds.size === 0
|
||||||
@@ -167,24 +160,15 @@ export function MessageList({
|
|||||||
[allMessages, hiddenMessageIds],
|
[allMessages, hiddenMessageIds],
|
||||||
);
|
);
|
||||||
|
|
||||||
const askTimes = useChatAskTimes();
|
// Stamp a wall-clock time onto every question/answer the first time it is
|
||||||
|
// seen, in a single batched commit. Questions sent this session already carry
|
||||||
// Stamp a wall-clock time onto every *question* the first time it is seen, in
|
// an accurate time (see useThreadStream); this also covers assistant answers
|
||||||
// a single batched commit. Questions sent this session already carry an
|
// and messages loaded from history. First-write-wins keeps the earliest time.
|
||||||
// accurate `client_ts` (see useThreadStream) and are skipped; this only backs
|
|
||||||
// up legacy questions loaded from history that predate `client_ts`.
|
|
||||||
// First-write-wins keeps the earliest time.
|
|
||||||
//
|
|
||||||
// AI answers are deliberately NOT stamped here: they carry no timestamp of
|
|
||||||
// their own, so a `now` stamp would be the *load* time, not the answer time —
|
|
||||||
// and for an unfinished/interrupted turn that re-stamps to the current clock
|
|
||||||
// on every reload. Instead the answer inherits its question's durable time
|
|
||||||
// via `turnTimes` below.
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const now = new Date().toISOString();
|
const now = new Date().toISOString();
|
||||||
const entries: Record<string, string> = {};
|
const entries: Record<string, string> = {};
|
||||||
for (const message of messages) {
|
for (const message of messages) {
|
||||||
if (message.type !== "human") continue;
|
if (message.type !== "human" && message.type !== "ai") continue;
|
||||||
if (!message.id || message.id.startsWith("opt-")) continue;
|
if (!message.id || message.id.startsWith("opt-")) continue;
|
||||||
if (typeof message.additional_kwargs?.client_ts === "string") continue;
|
if (typeof message.additional_kwargs?.client_ts === "string") continue;
|
||||||
entries[message.id] = now;
|
entries[message.id] = now;
|
||||||
@@ -192,24 +176,6 @@ export function MessageList({
|
|||||||
if (Object.keys(entries).length > 0) rememberAskTimes(entries);
|
if (Object.keys(entries).length > 0) rememberAskTimes(entries);
|
||||||
}, [messages]);
|
}, [messages]);
|
||||||
|
|
||||||
// Durable ask time per message id, used to time-stamp the AI answer (which has
|
|
||||||
// no timestamp of its own) with the time of the question that triggered it.
|
|
||||||
const turnTimes = useMemo(() => {
|
|
||||||
const map = new Map<string, string>();
|
|
||||||
let lastQuestionTime: string | undefined;
|
|
||||||
for (const message of messages) {
|
|
||||||
if (message.type === "human") {
|
|
||||||
const ts = message.additional_kwargs?.client_ts;
|
|
||||||
const fromAskTimes = message.id ? askTimes[message.id] : undefined;
|
|
||||||
lastQuestionTime =
|
|
||||||
typeof ts === "string" && ts ? ts : fromAskTimes;
|
|
||||||
} else if (message.type === "ai" && message.id && lastQuestionTime) {
|
|
||||||
map.set(message.id, lastQuestionTime);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return map;
|
|
||||||
}, [messages, askTimes]);
|
|
||||||
|
|
||||||
const [settings] = useLocalSettings();
|
const [settings] = useLocalSettings();
|
||||||
const ragModeEnabled =
|
const ragModeEnabled =
|
||||||
settings.display.ragModeEnabled || isThreadRagModeLocked(threadId);
|
settings.display.ragModeEnabled || isThreadRagModeLocked(threadId);
|
||||||
@@ -385,7 +351,6 @@ export function MessageList({
|
|||||||
onMessageDeleted={
|
onMessageDeleted={
|
||||||
allowDelete ? handleMessageDeleted : undefined
|
allowDelete ? handleMessageDeleted : undefined
|
||||||
}
|
}
|
||||||
turnTime={msg.id ? turnTimes.get(msg.id) : undefined}
|
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
@@ -461,7 +426,6 @@ export function MessageList({
|
|||||||
message={message}
|
message={message}
|
||||||
onApprove={onSetupWritingApprove}
|
onApprove={onSetupWritingApprove}
|
||||||
onReject={onSetupWritingReject}
|
onReject={onSetupWritingReject}
|
||||||
onStart={onSetupWritingStart}
|
|
||||||
/>
|
/>
|
||||||
<MessageTokenUsageList
|
<MessageTokenUsageList
|
||||||
enabled={tokenUsageEnabled}
|
enabled={tokenUsageEnabled}
|
||||||
@@ -661,8 +625,6 @@ export type SetupAgentApprovalPayload = {
|
|||||||
export type SetupWritingApprovalPayload = {
|
export type SetupWritingApprovalPayload = {
|
||||||
user_intent?: string;
|
user_intent?: string;
|
||||||
article_type?: string;
|
article_type?: string;
|
||||||
/** 当 article_type 是已有类型库里没有的新类型时，模型识别出的一句话特征说明（命中已有类型时为空）。 */
|
|
||||||
article_type_detail?: string;
|
|
||||||
word_count_target?: number | null;
|
word_count_target?: number | null;
|
||||||
target_audience?: string;
|
target_audience?: string;
|
||||||
writing_mode?: string;
|
writing_mode?: string;
|
||||||
@@ -854,16 +816,14 @@ function SetupWritingApprovalCard({
|
|||||||
message,
|
message,
|
||||||
onApprove,
|
onApprove,
|
||||||
onReject,
|
onReject,
|
||||||
onStart,
|
|
||||||
}: {
|
}: {
|
||||||
disabled: boolean;
|
disabled: boolean;
|
||||||
message: unknown;
|
message: unknown;
|
||||||
onApprove?: (payload: SetupWritingApprovalPayload) => void | Promise<void>;
|
onApprove?: (payload: SetupWritingApprovalPayload) => void | Promise<void>;
|
||||||
onReject?: (payload: SetupWritingApprovalPayload) => void | Promise<void>;
|
onReject?: (payload: SetupWritingApprovalPayload) => void | Promise<void>;
|
||||||
onStart?: (payload: SetupWritingApprovalPayload) => void | Promise<void>;
|
|
||||||
}) {
|
}) {
|
||||||
const payload = getSetupWritingApprovalPayload(message);
|
const payload = getSetupWritingApprovalPayload(message);
|
||||||
const [submitting, setSubmitting] = useState<"approve" | "reject" | "start" | null>(
|
const [submitting, setSubmitting] = useState<"approve" | "reject" | null>(
|
||||||
null,
|
null,
|
||||||
);
|
);
|
||||||
|
|
||||||
@@ -874,7 +834,7 @@ function SetupWritingApprovalCard({
|
|||||||
const approvalPayload = payload;
|
const approvalPayload = payload;
|
||||||
const busy = disabled || submitting !== null;
|
const busy = disabled || submitting !== null;
|
||||||
|
|
||||||
async function run(action: "approve" | "reject" | "start") {
|
async function run(action: "approve" | "reject") {
|
||||||
if (busy) {
|
if (busy) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
@@ -882,8 +842,6 @@ function SetupWritingApprovalCard({
|
|||||||
try {
|
try {
|
||||||
if (action === "approve") {
|
if (action === "approve") {
|
||||||
await onApprove?.(approvalPayload);
|
await onApprove?.(approvalPayload);
|
||||||
} else if (action === "start") {
|
|
||||||
await onStart?.(approvalPayload);
|
|
||||||
} else {
|
} else {
|
||||||
await onReject?.(approvalPayload);
|
await onReject?.(approvalPayload);
|
||||||
}
|
}
|
||||||
@@ -892,14 +850,9 @@ function SetupWritingApprovalCard({
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const hasNewType = !!approvalPayload.article_type_detail?.trim();
|
|
||||||
const rows: Array<{ label: string; value: string }> = [];
|
const rows: Array<{ label: string; value: string }> = [];
|
||||||
if (approvalPayload.article_type) {
|
if (approvalPayload.article_type) {
|
||||||
rows.push({
|
rows.push({ label: "文章类型", value: approvalPayload.article_type });
|
||||||
label: "文章类型",
|
|
||||||
// 新类型（列表外）标注「· 新」，让用户知道这是模型新识别的类型。
|
|
||||||
value: hasNewType ? `${approvalPayload.article_type} · 新` : approvalPayload.article_type,
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
if (typeof approvalPayload.word_count_target === "number") {
|
if (typeof approvalPayload.word_count_target === "number") {
|
||||||
rows.push({ label: "目标字数", value: `${approvalPayload.word_count_target} 字` });
|
rows.push({ label: "目标字数", value: `${approvalPayload.word_count_target} 字` });
|
||||||
@@ -946,13 +899,6 @@ function SetupWritingApprovalCard({
|
|||||||
</div>
|
</div>
|
||||||
) : null}
|
) : null}
|
||||||
|
|
||||||
{hasNewType ? (
|
|
||||||
<div className="space-y-1">
|
|
||||||
<div className="text-muted-foreground text-xs">新类型说明</div>
|
|
||||||
<p className="text-sm leading-6">{approvalPayload.article_type_detail}</p>
|
|
||||||
</div>
|
|
||||||
) : null}
|
|
||||||
|
|
||||||
{approvalPayload.outline ? (
|
{approvalPayload.outline ? (
|
||||||
<div className="space-y-1">
|
<div className="space-y-1">
|
||||||
<div className="text-muted-foreground text-xs">已有大纲</div>
|
<div className="text-muted-foreground text-xs">已有大纲</div>
|
||||||
@@ -976,7 +922,6 @@ function SetupWritingApprovalCard({
|
|||||||
</Button>
|
</Button>
|
||||||
<Button
|
<Button
|
||||||
type="button"
|
type="button"
|
||||||
variant={onStart ? "outline" : "default"}
|
|
||||||
size="sm"
|
size="sm"
|
||||||
disabled={busy || !onApprove}
|
disabled={busy || !onApprove}
|
||||||
onClick={() => void run("approve")}
|
onClick={() => void run("approve")}
|
||||||
@@ -984,17 +929,6 @@ function SetupWritingApprovalCard({
|
|||||||
<CheckIcon className="h-4 w-4" />
|
<CheckIcon className="h-4 w-4" />
|
||||||
应用到表单
|
应用到表单
|
||||||
</Button>
|
</Button>
|
||||||
{onStart ? (
|
|
||||||
<Button
|
|
||||||
type="button"
|
|
||||||
size="sm"
|
|
||||||
disabled={busy}
|
|
||||||
onClick={() => void run("start")}
|
|
||||||
>
|
|
||||||
<PenLineIcon className="h-4 w-4" />
|
|
||||||
直接开始写作
|
|
||||||
</Button>
|
|
||||||
) : null}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -31,48 +31,6 @@ export function formatDuration(ms: number): string {
|
|||||||
return `${mins}m ${secs}s`;
|
return `${mins}m ${secs}s`;
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
|
||||||
* 速度条颜色含义图例 —— 生成结束后显示在速度条下方一行，向用户解释当前
|
|
||||||
* 进度条颜色代表的「模型生成延迟」状态。进度条本身仍是 5 档(极快/流畅/一般/
|
|
||||||
* 偏慢/缓慢)的连续配色;这里把它归并成用户视角的 3 类延迟 + 「无响应」:
|
|
||||||
* 绿(#16a34a，极快/流畅) → 延迟正常
|
|
||||||
* 黄(#eab308，一般) → 延迟微长
|
|
||||||
* 红(#ef4444，偏慢/缓慢) → 延迟长，可能失败
|
|
||||||
* 灰(#9ca3af) → 无响应(无进度条/0 tok/s)，任务失败，请重试
|
|
||||||
* 根据本次问答的实际速度，只显示对应那一档的提示。
|
|
||||||
*/
|
|
||||||
function legendForSpeed(tps: number): { color: string; label: string } {
|
|
||||||
if (tps <= 0) return { color: "#9ca3af", label: "无响应，任务失败，请重试" };
|
|
||||||
if (tps >= 30) return { color: "#16a34a", label: "延迟正常" };
|
|
||||||
if (tps >= 15) return { color: "#eab308", label: "延迟微长" };
|
|
||||||
return { color: "#ef4444", label: "延迟长，可能失败" };
|
|
||||||
}
|
|
||||||
|
|
||||||
export function SpeedLegend({
|
|
||||||
className,
|
|
||||||
tokensPerSec,
|
|
||||||
}: {
|
|
||||||
className?: string;
|
|
||||||
tokensPerSec: number;
|
|
||||||
}) {
|
|
||||||
const item = legendForSpeed(tokensPerSec);
|
|
||||||
return (
|
|
||||||
<span
|
|
||||||
className={cn(
|
|
||||||
"text-muted-foreground inline-flex items-center gap-1",
|
|
||||||
className,
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
<span
|
|
||||||
aria-hidden
|
|
||||||
className="inline-block size-2 shrink-0 rounded-full"
|
|
||||||
style={{ backgroundColor: item.color }}
|
|
||||||
/>
|
|
||||||
{item.label}
|
|
||||||
</span>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export function SpeedPill({ metric }: { metric: MessageMetric }) {
|
export function SpeedPill({ metric }: { metric: MessageMetric }) {
|
||||||
const fill = Math.max(0, Math.min(1, metric.tokensPerSec / FULL_SCALE_TOKENS_PER_SEC));
|
const fill = Math.max(0, Math.min(1, metric.tokensPerSec / FULL_SCALE_TOKENS_PER_SEC));
|
||||||
const { color, label } = classifySpeed(metric.tokensPerSec);
|
const { color, label } = classifySpeed(metric.tokensPerSec);
|
||||||
@@ -174,13 +132,6 @@ export function MessageTokenUsage({
|
|||||||
{formatDuration(resolvedMetric.durationMs)}
|
{formatDuration(resolvedMetric.durationMs)}
|
||||||
</span>
|
</span>
|
||||||
)}
|
)}
|
||||||
{/* 生成结束(非流式中)后只显示与本次速度对应那一档的颜色含义说明。 */}
|
|
||||||
{!resolvedMetric.isActive && (
|
|
||||||
<SpeedLegend
|
|
||||||
className="basis-full"
|
|
||||||
tokensPerSec={resolvedMetric.tokensPerSec}
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
</>
|
</>
|
||||||
) : null}
|
) : null}
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
import { CheckIcon } from "lucide-react";
|
import { CheckIcon } from "lucide-react";
|
||||||
import { type ReactNode, useEffect, useState } from "react";
|
import { useEffect, useState } from "react";
|
||||||
|
|
||||||
import { Button } from "@/components/ui/button";
|
import { Button } from "@/components/ui/button";
|
||||||
import {
|
import {
|
||||||
@@ -26,8 +26,6 @@ interface PublishSquarePickerDialogProps {
|
|||||||
loading?: boolean;
|
loading?: boolean;
|
||||||
title?: string;
|
title?: string;
|
||||||
description?: string;
|
description?: string;
|
||||||
/** 可选提示节点，渲染在描述下方 —— 用于显示「本次发布将以哪个账号进行」及账号切换告警。 */
|
|
||||||
accountNotice?: ReactNode;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/** A "publish to which square (发布广场)?" chooser. Squares are rendered as a
|
/** A "publish to which square (发布广场)?" chooser. Squares are rendered as a
|
||||||
@@ -41,7 +39,6 @@ export function PublishSquarePickerDialog({
|
|||||||
loading,
|
loading,
|
||||||
title = "选择发布广场",
|
title = "选择发布广场",
|
||||||
description = "请选择要把它发布到哪个广场。每个项目只能归属一个广场，不会重复出现。",
|
description = "请选择要把它发布到哪个广场。每个项目只能归属一个广场，不会重复出现。",
|
||||||
accountNotice,
|
|
||||||
}: PublishSquarePickerDialogProps) {
|
}: PublishSquarePickerDialogProps) {
|
||||||
const [selected, setSelected] = useState<string>(
|
const [selected, setSelected] = useState<string>(
|
||||||
defaultSquareId || squares[0]?.id || "",
|
defaultSquareId || squares[0]?.id || "",
|
||||||
@@ -61,7 +58,6 @@ export function PublishSquarePickerDialog({
|
|||||||
<DialogTitle>{title}</DialogTitle>
|
<DialogTitle>{title}</DialogTitle>
|
||||||
<DialogDescription>{description}</DialogDescription>
|
<DialogDescription>{description}</DialogDescription>
|
||||||
</DialogHeader>
|
</DialogHeader>
|
||||||
{accountNotice}
|
|
||||||
<div className="max-h-[50vh] space-y-1.5 overflow-y-auto py-1">
|
<div className="max-h-[50vh] space-y-1.5 overflow-y-auto py-1">
|
||||||
{squares.map((sq) => {
|
{squares.map((sq) => {
|
||||||
const active = selected === sq.id;
|
const active = selected === sq.id;
|
||||||
|
|||||||
@@ -1,7 +1,6 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
import {
|
import {
|
||||||
Bot,
|
|
||||||
ChevronDown,
|
ChevronDown,
|
||||||
ChevronRight,
|
ChevronRight,
|
||||||
Download,
|
Download,
|
||||||
@@ -65,10 +64,8 @@ import {
|
|||||||
} from "@/core/threads/hooks";
|
} from "@/core/threads/hooks";
|
||||||
import type { AgentThread, AgentThreadState } from "@/core/threads/types";
|
import type { AgentThread, AgentThreadState } from "@/core/threads/types";
|
||||||
import {
|
import {
|
||||||
isBootstrapThread,
|
|
||||||
isThreadFavorite,
|
isThreadFavorite,
|
||||||
isThreadPinned,
|
isThreadPinned,
|
||||||
listPathOfThread,
|
|
||||||
pathOfThread,
|
pathOfThread,
|
||||||
sortThreadsPinnedFirst,
|
sortThreadsPinnedFirst,
|
||||||
titleOfThread,
|
titleOfThread,
|
||||||
@@ -133,9 +130,9 @@ export function RecentChatList({
|
|||||||
});
|
});
|
||||||
if (threadIndex > -1) {
|
if (threadIndex > -1) {
|
||||||
if (threads[threadIndex + 1]) {
|
if (threads[threadIndex + 1]) {
|
||||||
nextThreadPath = listPathOfThread(threads[threadIndex + 1]!);
|
nextThreadPath = pathOfThread(threads[threadIndex + 1]!);
|
||||||
} else if (threads[threadIndex - 1]) {
|
} else if (threads[threadIndex - 1]) {
|
||||||
nextThreadPath = listPathOfThread(threads[threadIndex - 1]!);
|
nextThreadPath = pathOfThread(threads[threadIndex - 1]!);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
void router.push(nextThreadPath);
|
void router.push(nextThreadPath);
|
||||||
@@ -192,12 +189,11 @@ export function RecentChatList({
|
|||||||
[t],
|
[t],
|
||||||
);
|
);
|
||||||
|
|
||||||
// 智能体创建（bootstrap）会话也展示在常用对话里（带机器人图标、点击回创建页）；
|
|
||||||
// 仅排除调度 / 会商类系统会话。
|
|
||||||
const visibleThreads = sortThreadsPinnedFirst(
|
const visibleThreads = sortThreadsPinnedFirst(
|
||||||
threads.filter(
|
threads.filter(
|
||||||
(thread) =>
|
(thread) =>
|
||||||
thread.metadata?.thread_type !== "scheduler" &&
|
thread.metadata?.thread_type !== "scheduler" &&
|
||||||
|
thread.metadata?.thread_type !== "bootstrap" &&
|
||||||
thread.metadata?.thread_type !== "roundtable",
|
thread.metadata?.thread_type !== "roundtable",
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
@@ -243,9 +239,7 @@ export function RecentChatList({
|
|||||||
<SidebarMenu>
|
<SidebarMenu>
|
||||||
<div className="flex w-full flex-col gap-0.5">
|
<div className="flex w-full flex-col gap-0.5">
|
||||||
{shownThreads.map((thread) => {
|
{shownThreads.map((thread) => {
|
||||||
const href = listPathOfThread(thread);
|
const isActive = pathOfThread(thread) === pathname;
|
||||||
const isActive = href === pathname;
|
|
||||||
const isBoot = isBootstrapThread(thread);
|
|
||||||
const pinned = isThreadPinned(thread);
|
const pinned = isThreadPinned(thread);
|
||||||
const favorited = isThreadFavorite(thread);
|
const favorited = isThreadFavorite(thread);
|
||||||
return (
|
return (
|
||||||
@@ -267,29 +261,17 @@ export function RecentChatList({
|
|||||||
>
|
>
|
||||||
<Link
|
<Link
|
||||||
className="flex w-full items-center gap-1 whitespace-nowrap group-hover/side-menu-item:overflow-hidden"
|
className="flex w-full items-center gap-1 whitespace-nowrap group-hover/side-menu-item:overflow-hidden"
|
||||||
href={href}
|
href={pathOfThread(thread)}
|
||||||
>
|
>
|
||||||
{isBoot ? (
|
{compact && (
|
||||||
<Bot
|
<MessageSquare
|
||||||
className={
|
className={
|
||||||
"size-3.5 shrink-0 " +
|
"size-3.5 shrink-0 " +
|
||||||
(isActive
|
(isActive
|
||||||
? "text-[var(--primary)]"
|
? "text-[var(--primary)]"
|
||||||
: "text-muted-foreground/70")
|
: "text-muted-foreground/70")
|
||||||
}
|
}
|
||||||
aria-label="智能体创建会话"
|
|
||||||
/>
|
/>
|
||||||
) : (
|
|
||||||
compact && (
|
|
||||||
<MessageSquare
|
|
||||||
className={
|
|
||||||
"size-3.5 shrink-0 " +
|
|
||||||
(isActive
|
|
||||||
? "text-[var(--primary)]"
|
|
||||||
: "text-muted-foreground/70")
|
|
||||||
}
|
|
||||||
/>
|
|
||||||
)
|
|
||||||
)}
|
)}
|
||||||
{pinned && (
|
{pinned && (
|
||||||
<Pin className="size-3 shrink-0 text-muted-foreground/70" />
|
<Pin className="size-3 shrink-0 text-muted-foreground/70" />
|
||||||
|
|||||||
@@ -71,10 +71,9 @@ function StatusBadge({ draft }: { draft: DraftMeta }) {
|
|||||||
if (draft.status === "error") {
|
if (draft.status === "error") {
|
||||||
return <span className="text-[10px] font-medium text-rose-500">出错</span>;
|
return <span className="text-[10px] font-medium text-rose-500">出错</span>;
|
||||||
}
|
}
|
||||||
// 非进行中/待澄清/出错时，展示本次会商所用业务链（无链条 → 自由模式）。
|
|
||||||
return (
|
return (
|
||||||
<span className="text-[10px] font-medium text-muted-foreground">
|
<span className="text-[10px] font-medium text-muted-foreground">
|
||||||
{draft.chainTitle || "自由模式"}
|
第 {draft.furthestStep} 步
|
||||||
</span>
|
</span>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
@@ -112,7 +111,7 @@ export function RecentRoundtableList() {
|
|||||||
}
|
}
|
||||||
try {
|
try {
|
||||||
await rename(id, title);
|
await rename(id, title);
|
||||||
toast.success("已重命名");
|
toast.success("✏️ 已重命名");
|
||||||
} catch {
|
} catch {
|
||||||
toast.error("重命名失败，请重试");
|
toast.error("重命名失败，请重试");
|
||||||
} finally {
|
} finally {
|
||||||
@@ -126,7 +125,7 @@ export function RecentRoundtableList() {
|
|||||||
if (!window.confirm("确定删除这条会商记录吗？此操作不可恢复。")) return;
|
if (!window.confirm("确定删除这条会商记录吗？此操作不可恢复。")) return;
|
||||||
try {
|
try {
|
||||||
await remove(draft.id);
|
await remove(draft.id);
|
||||||
toast.success("已删除会商记录");
|
toast.success("🗑 已删除会商记录");
|
||||||
} catch {
|
} catch {
|
||||||
toast.error("删除失败，请重试");
|
toast.error("删除失败，请重试");
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -8,7 +8,7 @@ CM Assistant is an internal super-agent platform that orchestrates sub-agents, m
|
|||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
## Core Features
|
## 🚀 Core Features
|
||||||
|
|
||||||
* **Skills & Tools**: With built-in and extensible skills and tools, CM Assistant can do almost anything.
|
* **Skills & Tools**: With built-in and extensible skills and tools, CM Assistant can do almost anything.
|
||||||
* **Sub-Agents**: Sub-Agents help the main agent to do the tasks that are too complex to be done by the main agent.
|
* **Sub-Agents**: Sub-Agents help the main agent to do the tasks that are too complex to be done by the main agent.
|
||||||
|
|||||||
@@ -1,14 +1,12 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
|
import { useMemo } from "react";
|
||||||
import { CopyIcon, LogOutIcon, UserIcon } from "lucide-react";
|
import { CopyIcon, LogOutIcon, UserIcon } from "lucide-react";
|
||||||
import { toast } from "sonner";
|
import { toast } from "sonner";
|
||||||
|
|
||||||
import { Badge } from "@/components/ui/badge";
|
import { Badge } from "@/components/ui/badge";
|
||||||
import { Button } from "@/components/ui/button";
|
import { Button } from "@/components/ui/button";
|
||||||
import { clearStoredAuth, getAccountDisplayName, getStoredAuth } from "@/core/auth";
|
import { clearStoredAuth, getStoredAuth } from "@/core/auth";
|
||||||
import { useLiveAccount } from "@/core/auth/use-live-account";
|
|
||||||
import { OptType, writeYLog } from "@/core/log/y-log";
|
|
||||||
import { clearYLogToken } from "@/core/log/y-log-token";
|
|
||||||
|
|
||||||
import { SettingsSection } from "./settings-section";
|
import { SettingsSection } from "./settings-section";
|
||||||
|
|
||||||
@@ -27,10 +25,7 @@ function copy(text: string, hint = "已复制") {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export function AccountSettingsPage() {
|
export function AccountSettingsPage() {
|
||||||
// Subscribe to same-tab and cross-tab auth changes. The dialog may stay open
|
const auth = useMemo(() => getStoredAuth(), []);
|
||||||
// while the active account is switched elsewhere.
|
|
||||||
useLiveAccount();
|
|
||||||
const auth = getStoredAuth();
|
|
||||||
|
|
||||||
if (!auth) {
|
if (!auth) {
|
||||||
return (
|
return (
|
||||||
@@ -42,18 +37,11 @@ export function AccountSettingsPage() {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
const displayName = getAccountDisplayName(auth);
|
const usernameFromEmail = (auth.email ?? "").split("@")[0] ?? "";
|
||||||
|
const displayName = usernameFromEmail || auth.user_id;
|
||||||
|
|
||||||
const handleLogout = () => {
|
const handleLogout = () => {
|
||||||
// 操作日志(Y-Log)：在清除 token1 之前上报登出（此时 token1 还在），keepalive 保证发出。
|
|
||||||
writeYLog({
|
|
||||||
optType: OptType.logout,
|
|
||||||
optDetail: "CM助手-全量-登出",
|
|
||||||
url: "/api/v1/auth/logout",
|
|
||||||
keepalive: true,
|
|
||||||
});
|
|
||||||
clearStoredAuth();
|
clearStoredAuth();
|
||||||
clearYLogToken();
|
|
||||||
// Match the rest of the app's logout flow: blow away the cookie session
|
// Match the rest of the app's logout flow: blow away the cookie session
|
||||||
// by hitting the gateway logout endpoint and then forcing a full reload
|
// by hitting the gateway logout endpoint and then forcing a full reload
|
||||||
// so any cached query state goes too.
|
// so any cached query state goes too.
|
||||||
|
|||||||
@@ -1,30 +1,16 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
import {
|
import { DropletIcon, LayoutGridIcon, LayoutIcon, ListIcon, MoonIcon, PanelLeftIcon, SunIcon } from "lucide-react";
|
||||||
ArrowDown,
|
import { useMemo, type ComponentType, type SVGProps } from "react";
|
||||||
ArrowUp,
|
|
||||||
DropletIcon,
|
|
||||||
ExternalLink,
|
|
||||||
LayoutGridIcon,
|
|
||||||
LayoutIcon,
|
|
||||||
ListIcon,
|
|
||||||
MoonIcon,
|
|
||||||
PanelLeftIcon,
|
|
||||||
Plus,
|
|
||||||
SunIcon,
|
|
||||||
Trash2,
|
|
||||||
} from "lucide-react";
|
|
||||||
import { useEffect, useMemo, useState, type ComponentType, type SVGProps } from "react";
|
|
||||||
import { useNavigate } from "react-router-dom";
|
import { useNavigate } from "react-router-dom";
|
||||||
import { toast } from "sonner";
|
import { toast } from "sonner";
|
||||||
|
|
||||||
import { useTheme } from "@/contexts/ThemeContext";
|
import { useTheme } from "@/contexts/ThemeContext";
|
||||||
|
|
||||||
import { FONT_SCALE_OPTIONS } from "@/components/font-scale";
|
import { FONT_SCALE_OPTIONS } from "@/components/font-scale";
|
||||||
import { Button } from "@/components/ui/button";
|
import { Button } from "@/components/ui/button";
|
||||||
import { Input } from "@/components/ui/input";
|
import {
|
||||||
import {
|
Select,
|
||||||
Select,
|
|
||||||
SelectContent,
|
SelectContent,
|
||||||
SelectItem,
|
SelectItem,
|
||||||
SelectTrigger,
|
SelectTrigger,
|
||||||
@@ -34,29 +20,17 @@ import { Separator } from "@/components/ui/separator";
|
|||||||
import { Switch } from "@/components/ui/switch";
|
import { Switch } from "@/components/ui/switch";
|
||||||
import { Textarea } from "@/components/ui/textarea";
|
import { Textarea } from "@/components/ui/textarea";
|
||||||
import { getStoredAuth } from "@/core/auth";
|
import { getStoredAuth } from "@/core/auth";
|
||||||
import { migrateAuthToSession } from "@/core/auth/scoped-storage";
|
|
||||||
import { isIsolatedSession, setIsolatedSession } from "@/core/embed/embed-session";
|
|
||||||
import { enUS, isLocale, zhCN, type Locale } from "@/core/i18n";
|
import { enUS, isLocale, zhCN, type Locale } from "@/core/i18n";
|
||||||
import { useI18n } from "@/core/i18n/hooks";
|
import { useI18n } from "@/core/i18n/hooks";
|
||||||
import { useLocalSettings } from "@/core/settings";
|
import { useLocalSettings } from "@/core/settings";
|
||||||
import {
|
import {
|
||||||
useAppearanceSettings,
|
useAppearanceSettings,
|
||||||
useCitationDisplaySettings,
|
useCitationDisplaySettings,
|
||||||
useLayoutMode,
|
useLayoutMode,
|
||||||
useUpdateAppearanceSettings,
|
useUpdateAppearanceSettings,
|
||||||
useUpdateCitationDisplaySettings,
|
useUpdateCitationDisplaySettings,
|
||||||
} from "@/core/system-settings/hooks";
|
} from "@/core/system-settings/hooks";
|
||||||
import type {
|
import { cn } from "@/lib/utils";
|
||||||
CompactShortcutButton,
|
|
||||||
CompactShortcutRouteParam,
|
|
||||||
} from "@/core/system-settings/api";
|
|
||||||
import { cn } from "@/lib/utils";
|
|
||||||
import {
|
|
||||||
APP_THEME_COLORS,
|
|
||||||
LOGIN_SOURCE_OPTIONS,
|
|
||||||
parseThemeMap,
|
|
||||||
stringifyThemeMap,
|
|
||||||
} from "@/strategy-components/lib/light-app";
|
|
||||||
|
|
||||||
import PrivateSquareSettingsPage from "@/pages/PrivateSquareSettingsPage";
|
import PrivateSquareSettingsPage from "@/pages/PrivateSquareSettingsPage";
|
||||||
import PublishSquaresSettingsPage from "@/pages/PublishSquaresSettingsPage";
|
import PublishSquaresSettingsPage from "@/pages/PublishSquaresSettingsPage";
|
||||||
@@ -65,101 +39,10 @@ import SkillCompressionSettingsPage from "@/pages/SkillCompressionSettingsPage";
|
|||||||
|
|
||||||
import { SettingsSection } from "./settings-section";
|
import { SettingsSection } from "./settings-section";
|
||||||
|
|
||||||
const languageOptions: { value: Locale; label: string }[] = [
|
const languageOptions: { value: Locale; label: string }[] = [
|
||||||
{ value: "en-US", label: enUS.locale.localName },
|
{ value: "en-US", label: enUS.locale.localName },
|
||||||
{ value: "zh-CN", label: zhCN.locale.localName },
|
{ value: "zh-CN", label: zhCN.locale.localName },
|
||||||
];
|
];
|
||||||
|
|
||||||
const DEFAULT_SHORTCUT_THEME_MAP = "red=red;blue=blue;dark-blue=dark-blue";
|
|
||||||
|
|
||||||
function makeShortcutId() {
|
|
||||||
if (typeof crypto !== "undefined" && "randomUUID" in crypto) {
|
|
||||||
return crypto.randomUUID();
|
|
||||||
}
|
|
||||||
return `shortcut-${Date.now()}-${Math.random().toString(16).slice(2)}`;
|
|
||||||
}
|
|
||||||
|
|
||||||
function newShortcutParam(): CompactShortcutRouteParam {
|
|
||||||
return {
|
|
||||||
key: "access_token",
|
|
||||||
paramType: "login",
|
|
||||||
source: "access_token",
|
|
||||||
customValue: "",
|
|
||||||
themeValue: DEFAULT_SHORTCUT_THEME_MAP,
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
function newShortcutButton(): CompactShortcutButton {
|
|
||||||
return {
|
|
||||||
id: makeShortcutId(),
|
|
||||||
label: "快捷入口",
|
|
||||||
url: "",
|
|
||||||
route_params: [newShortcutParam()],
|
|
||||||
enabled: true,
|
|
||||||
sort_order: 0,
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
function normalizeShortcutDraft(
|
|
||||||
buttons: CompactShortcutButton[] | undefined,
|
|
||||||
): CompactShortcutButton[] {
|
|
||||||
const source = buttons?.length ? buttons : [newShortcutButton()];
|
|
||||||
return [...source]
|
|
||||||
.sort((a, b) => a.sort_order - b.sort_order)
|
|
||||||
.map((button, index) => ({
|
|
||||||
...button,
|
|
||||||
id: button.id || makeShortcutId(),
|
|
||||||
label: button.label || "快捷入口",
|
|
||||||
url: button.url || "",
|
|
||||||
route_params: (button.route_params?.length
|
|
||||||
? button.route_params
|
|
||||||
: [newShortcutParam()]
|
|
||||||
).map((param) => ({
|
|
||||||
key: param.key || "",
|
|
||||||
paramType: param.paramType || "login",
|
|
||||||
source: param.source || "access_token",
|
|
||||||
customValue: param.customValue ?? "",
|
|
||||||
themeValue: param.themeValue || DEFAULT_SHORTCUT_THEME_MAP,
|
|
||||||
})),
|
|
||||||
enabled: button.enabled ?? true,
|
|
||||||
sort_order: index,
|
|
||||||
}));
|
|
||||||
}
|
|
||||||
|
|
||||||
function cleanShortcutParams(
|
|
||||||
params: CompactShortcutRouteParam[],
|
|
||||||
): CompactShortcutRouteParam[] {
|
|
||||||
return params
|
|
||||||
.filter((param) => param.key.trim())
|
|
||||||
.map((param) => {
|
|
||||||
const base: CompactShortcutRouteParam = {
|
|
||||||
key: param.key.trim(),
|
|
||||||
paramType: param.paramType,
|
|
||||||
};
|
|
||||||
if (param.paramType === "theme") {
|
|
||||||
base.themeValue = stringifyThemeMap(parseThemeMap(param.themeValue));
|
|
||||||
return base;
|
|
||||||
}
|
|
||||||
base.source = param.source || "access_token";
|
|
||||||
if (base.source === "other") {
|
|
||||||
base.customValue = (param.customValue ?? "").trim();
|
|
||||||
}
|
|
||||||
return base;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function cleanShortcutButtons(
|
|
||||||
buttons: CompactShortcutButton[],
|
|
||||||
): CompactShortcutButton[] {
|
|
||||||
return buttons.map((button, index) => ({
|
|
||||||
id: button.id || makeShortcutId(),
|
|
||||||
label: button.label.trim() || "快捷入口",
|
|
||||||
url: button.url.trim(),
|
|
||||||
route_params: cleanShortcutParams(button.route_params),
|
|
||||||
enabled: button.enabled,
|
|
||||||
sort_order: index,
|
|
||||||
}));
|
|
||||||
}
|
|
||||||
|
|
||||||
export function AppearanceSettingsPage({ onClose }: { onClose?: () => void }) {
|
export function AppearanceSettingsPage({ onClose }: { onClose?: () => void }) {
|
||||||
const { t, locale, changeLocale } = useI18n();
|
const { t, locale, changeLocale } = useI18n();
|
||||||
@@ -167,11 +50,10 @@ export function AppearanceSettingsPage({ onClose }: { onClose?: () => void }) {
|
|||||||
const navigate = useNavigate();
|
const navigate = useNavigate();
|
||||||
const currentTheme = theme;
|
const currentTheme = theme;
|
||||||
const [settings, setSettings] = useLocalSettings();
|
const [settings, setSettings] = useLocalSettings();
|
||||||
const isAdmin = getStoredAuth()?.system_role === "admin";
|
const isAdmin = getStoredAuth()?.system_role === "admin";
|
||||||
const { data: appearance } = useAppearanceSettings();
|
const { data: appearance } = useAppearanceSettings();
|
||||||
const updateAppearance = useUpdateAppearanceSettings();
|
const updateAppearance = useUpdateAppearanceSettings();
|
||||||
const [shortcutDraft, setShortcutDraft] = useState<CompactShortcutButton[]>([]);
|
const { data: citationDisplay } = useCitationDisplaySettings();
|
||||||
const { data: citationDisplay } = useCitationDisplaySettings();
|
|
||||||
const updateCitationDisplay = useUpdateCitationDisplaySettings();
|
const updateCitationDisplay = useUpdateCitationDisplaySettings();
|
||||||
const globalDefault = appearance?.default_theme ?? "light";
|
const globalDefault = appearance?.default_theme ?? "light";
|
||||||
const globalSkillView = appearance?.default_skill_view ?? "list";
|
const globalSkillView = appearance?.default_skill_view ?? "list";
|
||||||
@@ -179,37 +61,8 @@ export function AppearanceSettingsPage({ onClose }: { onClose?: () => void }) {
|
|||||||
const globalLayoutMode = appearance?.default_layout_mode ?? "full";
|
const globalLayoutMode = appearance?.default_layout_mode ?? "full";
|
||||||
// 有效界面模式：用户自己选过则以其为准，否则跟随管理员系统默认（再否则会话级回退）。
|
// 有效界面模式：用户自己选过则以其为准，否则跟随管理员系统默认（再否则会话级回退）。
|
||||||
const [effectiveLayoutMode, setLayoutMode] = useLayoutMode();
|
const [effectiveLayoutMode, setLayoutMode] = useLayoutMode();
|
||||||
const cleanupWords =
|
const cleanupWords =
|
||||||
citationDisplay?.cleanup_words ?? settings.display.citationCleanupWords ?? [];
|
citationDisplay?.cleanup_words ?? settings.display.citationCleanupWords ?? [];
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
setShortcutDraft(
|
|
||||||
normalizeShortcutDraft(appearance?.compact_shortcut_buttons),
|
|
||||||
);
|
|
||||||
}, [appearance?.compact_shortcut_buttons]);
|
|
||||||
|
|
||||||
// 独立登录会话（本标签页）：开关切换鉴权存储 localStorage ↔ sessionStorage（见 scoped-storage）。
|
|
||||||
const [isolatedSession, setIsolatedSessionState] = useState(() => isIsolatedSession());
|
|
||||||
const handleToggleIsolatedSession = (checked: boolean) => {
|
|
||||||
if (checked) {
|
|
||||||
// 先把当前账号从 localStorage 快照搬进 sessionStorage，再翻标志，避免切换存储后被登出。
|
|
||||||
migrateAuthToSession();
|
|
||||||
setIsolatedSession(true);
|
|
||||||
setIsolatedSessionState(true);
|
|
||||||
toast.success("已开启独立登录会话", {
|
|
||||||
description:
|
|
||||||
"本标签页的登录已与其它标签页隔离：在别的窗口登录或切换其它账号都不会影响这里，你也可以在此单独登录另一个账号。该独立会话只存在于当前标签页，关闭此标签后即结束（需重新登录）。",
|
|
||||||
duration: 9000,
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
setIsolatedSession(false);
|
|
||||||
setIsolatedSessionState(false);
|
|
||||||
toast.info("已关闭独立登录会话", {
|
|
||||||
description: "本标签页恢复与其它标签页共享同一登录。如页面显示未及时同步，请刷新本页。",
|
|
||||||
duration: 6000,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleSetGlobalDefault = async (
|
const handleSetGlobalDefault = async (
|
||||||
value: "light" | "dark" | "lightblue",
|
value: "light" | "dark" | "lightblue",
|
||||||
@@ -237,7 +90,7 @@ export function AppearanceSettingsPage({ onClose }: { onClose?: () => void }) {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleSetDefaultView = async (
|
const handleSetDefaultView = async (
|
||||||
kind: "skill" | "agent",
|
kind: "skill" | "agent",
|
||||||
value: "card" | "list",
|
value: "card" | "list",
|
||||||
) => {
|
) => {
|
||||||
@@ -256,103 +109,7 @@ export function AppearanceSettingsPage({ onClose }: { onClose?: () => void }) {
|
|||||||
} catch (e) {
|
} catch (e) {
|
||||||
toast.error(e instanceof Error ? e.message : "保存失败");
|
toast.error(e instanceof Error ? e.message : "保存失败");
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
const patchShortcut = (
|
|
||||||
id: string,
|
|
||||||
patch: Partial<CompactShortcutButton>,
|
|
||||||
) => {
|
|
||||||
setShortcutDraft((items) =>
|
|
||||||
items.map((item) => (item.id === id ? { ...item, ...patch } : item)),
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
const patchShortcutParam = (
|
|
||||||
id: string,
|
|
||||||
index: number,
|
|
||||||
patch: Partial<CompactShortcutRouteParam>,
|
|
||||||
) => {
|
|
||||||
setShortcutDraft((items) =>
|
|
||||||
items.map((item) =>
|
|
||||||
item.id === id
|
|
||||||
? {
|
|
||||||
...item,
|
|
||||||
route_params: item.route_params.map((param, paramIndex) =>
|
|
||||||
paramIndex === index ? { ...param, ...patch } : param,
|
|
||||||
),
|
|
||||||
}
|
|
||||||
: item,
|
|
||||||
),
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
const moveShortcut = (id: string, direction: -1 | 1) => {
|
|
||||||
setShortcutDraft((items) => {
|
|
||||||
const index = items.findIndex((item) => item.id === id);
|
|
||||||
const target = index + direction;
|
|
||||||
if (index < 0 || target < 0 || target >= items.length) return items;
|
|
||||||
const next = [...items];
|
|
||||||
[next[index], next[target]] = [next[target]!, next[index]!];
|
|
||||||
return next.map((item, order) => ({ ...item, sort_order: order }));
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
const addShortcutParam = (id: string) => {
|
|
||||||
setShortcutDraft((items) =>
|
|
||||||
items.map((item) =>
|
|
||||||
item.id === id
|
|
||||||
? {
|
|
||||||
...item,
|
|
||||||
route_params: [...item.route_params, newShortcutParam()],
|
|
||||||
}
|
|
||||||
: item,
|
|
||||||
),
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
const removeShortcutParam = (id: string, index: number) => {
|
|
||||||
setShortcutDraft((items) =>
|
|
||||||
items.map((item) =>
|
|
||||||
item.id === id
|
|
||||||
? {
|
|
||||||
...item,
|
|
||||||
route_params: item.route_params.filter((_, paramIndex) => paramIndex !== index),
|
|
||||||
}
|
|
||||||
: item,
|
|
||||||
),
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleSaveShortcuts = async () => {
|
|
||||||
for (const item of shortcutDraft) {
|
|
||||||
if (item.enabled && !item.url.trim()) {
|
|
||||||
toast.error(`请填写「${item.label.trim() || "快捷入口"}」的跳转链接，或先关闭该按钮`);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
for (const param of item.route_params) {
|
|
||||||
if (!param.key.trim()) {
|
|
||||||
toast.error("路由参数键名不可为空");
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
if (
|
|
||||||
param.paramType === "login" &&
|
|
||||||
param.source === "other" &&
|
|
||||||
!param.customValue?.trim()
|
|
||||||
) {
|
|
||||||
toast.error("登录参数自定义值不可为空");
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
try {
|
|
||||||
await updateAppearance.mutateAsync({
|
|
||||||
compact_shortcut_buttons: cleanShortcutButtons(shortcutDraft),
|
|
||||||
});
|
|
||||||
toast.success("顶部快捷按钮已保存");
|
|
||||||
} catch (e) {
|
|
||||||
toast.error(e instanceof Error ? e.message : "保存失败");
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const themeOptions = useMemo(
|
const themeOptions = useMemo(
|
||||||
() => [
|
() => [
|
||||||
@@ -442,11 +199,11 @@ export function AppearanceSettingsPage({ onClose }: { onClose?: () => void }) {
|
|||||||
</div>
|
</div>
|
||||||
</SettingsSection>
|
</SettingsSection>
|
||||||
|
|
||||||
{isAdmin && (
|
{isAdmin && (
|
||||||
<>
|
<>
|
||||||
<Separator />
|
<Separator />
|
||||||
<SettingsSection
|
<SettingsSection
|
||||||
title="系统默认界面模式（管理员）"
|
title="系统默认界面模式（管理员）"
|
||||||
description="给所有还没有手动切换过界面模式的用户的默认；已经自己切换过的用户保留其个人选择不受影响。"
|
description="给所有还没有手动切换过界面模式的用户的默认；已经自己切换过的用户保留其个人选择不受影响。"
|
||||||
>
|
>
|
||||||
<div className="flex flex-wrap items-center gap-2">
|
<div className="flex flex-wrap items-center gap-2">
|
||||||
@@ -475,47 +232,13 @@ export function AppearanceSettingsPage({ onClose }: { onClose?: () => void }) {
|
|||||||
{globalLayoutMode === "full" ? "全量模式" : "简洁模式"}
|
{globalLayoutMode === "full" ? "全量模式" : "简洁模式"}
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</SettingsSection>
|
</SettingsSection>
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{isAdmin && (
|
{isAdmin && (
|
||||||
<>
|
<>
|
||||||
<Separator />
|
<Separator />
|
||||||
<SettingsSection
|
|
||||||
title="顶部快捷按钮（管理员）"
|
|
||||||
description="配置全量/简洁模式右上角、换肤按钮左侧显示的跳转按钮。支持多个按钮、启停和与应用管理一致的登录/主题参数。"
|
|
||||||
>
|
|
||||||
<CompactShortcutSettings
|
|
||||||
buttons={shortcutDraft}
|
|
||||||
saving={updateAppearance.isPending}
|
|
||||||
onAdd={() =>
|
|
||||||
setShortcutDraft((items) => [
|
|
||||||
...items,
|
|
||||||
{ ...newShortcutButton(), sort_order: items.length },
|
|
||||||
])
|
|
||||||
}
|
|
||||||
onPatch={patchShortcut}
|
|
||||||
onMove={moveShortcut}
|
|
||||||
onRemove={(id) =>
|
|
||||||
setShortcutDraft((items) =>
|
|
||||||
items
|
|
||||||
.filter((item) => item.id !== id)
|
|
||||||
.map((item, index) => ({ ...item, sort_order: index })),
|
|
||||||
)
|
|
||||||
}
|
|
||||||
onAddParam={addShortcutParam}
|
|
||||||
onPatchParam={patchShortcutParam}
|
|
||||||
onRemoveParam={removeShortcutParam}
|
|
||||||
onSave={handleSaveShortcuts}
|
|
||||||
/>
|
|
||||||
</SettingsSection>
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{isAdmin && (
|
|
||||||
<>
|
|
||||||
<Separator />
|
|
||||||
<SettingsSection
|
<SettingsSection
|
||||||
title="系统默认主题（管理员）"
|
title="系统默认主题（管理员）"
|
||||||
description="给所有还没有手动切换过主题的用户的默认主题；已经自己切换过的用户保留其个人设置不受影响。"
|
description="给所有还没有手动切换过主题的用户的默认主题；已经自己切换过的用户保留其个人设置不受影响。"
|
||||||
@@ -672,28 +395,6 @@ export function AppearanceSettingsPage({ onClose }: { onClose?: () => void }) {
|
|||||||
|
|
||||||
<Separator />
|
<Separator />
|
||||||
|
|
||||||
<SettingsSection
|
|
||||||
title="登录会话"
|
|
||||||
description="控制本标签页的登录身份是否与浏览器其它标签页隔离。"
|
|
||||||
>
|
|
||||||
<div className="flex items-start justify-between gap-4 rounded-lg border p-4">
|
|
||||||
<div>
|
|
||||||
<div className="text-sm font-medium">独立登录会话（本标签页）</div>
|
|
||||||
<p className="text-muted-foreground mt-1 max-w-md text-xs leading-relaxed">
|
|
||||||
开启后，本标签页的登录状态仅保存在当前标签页：在别的窗口登录或切换其它账号都不会影响这里，
|
|
||||||
你也可以在此单独登录另一个账号。关闭浏览器标签后该独立会话即结束（需重新登录）。
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<Switch
|
|
||||||
checked={isolatedSession}
|
|
||||||
onCheckedChange={handleToggleIsolatedSession}
|
|
||||||
aria-label="独立登录会话"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</SettingsSection>
|
|
||||||
|
|
||||||
<Separator />
|
|
||||||
|
|
||||||
<SettingsSection
|
<SettingsSection
|
||||||
title="对话体验"
|
title="对话体验"
|
||||||
description="问答过程中的辅助显示。"
|
description="问答过程中的辅助显示。"
|
||||||
@@ -767,304 +468,12 @@ export function AppearanceSettingsPage({ onClose }: { onClose?: () => void }) {
|
|||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
function CompactShortcutSettings({
|
function ThemePreviewCard({
|
||||||
buttons,
|
icon: Icon,
|
||||||
saving,
|
label,
|
||||||
onAdd,
|
|
||||||
onPatch,
|
|
||||||
onMove,
|
|
||||||
onRemove,
|
|
||||||
onAddParam,
|
|
||||||
onPatchParam,
|
|
||||||
onRemoveParam,
|
|
||||||
onSave,
|
|
||||||
}: {
|
|
||||||
buttons: CompactShortcutButton[];
|
|
||||||
saving: boolean;
|
|
||||||
onAdd: () => void;
|
|
||||||
onPatch: (id: string, patch: Partial<CompactShortcutButton>) => void;
|
|
||||||
onMove: (id: string, direction: -1 | 1) => void;
|
|
||||||
onRemove: (id: string) => void;
|
|
||||||
onAddParam: (id: string) => void;
|
|
||||||
onPatchParam: (
|
|
||||||
id: string,
|
|
||||||
index: number,
|
|
||||||
patch: Partial<CompactShortcutRouteParam>,
|
|
||||||
) => void;
|
|
||||||
onRemoveParam: (id: string, index: number) => void;
|
|
||||||
onSave: () => void;
|
|
||||||
}) {
|
|
||||||
return (
|
|
||||||
<div className="space-y-3">
|
|
||||||
<div className="flex flex-wrap items-center justify-between gap-2">
|
|
||||||
<p className="text-muted-foreground text-xs">
|
|
||||||
已配置 {buttons.length} 个按钮；只有启用且填写了跳转链接的按钮会显示。
|
|
||||||
</p>
|
|
||||||
<div className="flex items-center gap-2">
|
|
||||||
<Button type="button" variant="outline" size="sm" onClick={onAdd}>
|
|
||||||
<Plus className="mr-1.5 size-4" />
|
|
||||||
添加按钮
|
|
||||||
</Button>
|
|
||||||
<Button
|
|
||||||
type="button"
|
|
||||||
size="sm"
|
|
||||||
onClick={onSave}
|
|
||||||
disabled={saving}
|
|
||||||
>
|
|
||||||
保存按钮配置
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{buttons.length === 0 ? (
|
|
||||||
<div className="text-muted-foreground rounded-lg border border-dashed p-6 text-center text-sm">
|
|
||||||
暂无按钮，点击“添加按钮”创建一个。
|
|
||||||
</div>
|
|
||||||
) : (
|
|
||||||
<div className="space-y-3">
|
|
||||||
{buttons.map((button, index) => (
|
|
||||||
<div key={button.id} className="space-y-4 rounded-lg border p-4">
|
|
||||||
<div className="flex flex-col gap-3 xl:flex-row xl:items-start">
|
|
||||||
<div className="flex items-center gap-2 pt-6">
|
|
||||||
<Switch
|
|
||||||
checked={button.enabled}
|
|
||||||
onCheckedChange={(checked) =>
|
|
||||||
onPatch(button.id, { enabled: checked })
|
|
||||||
}
|
|
||||||
aria-label="启用快捷按钮"
|
|
||||||
/>
|
|
||||||
<span className="text-muted-foreground text-xs">
|
|
||||||
{button.enabled ? "启用" : "停用"}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div className="grid min-w-0 flex-1 gap-3 md:grid-cols-[220px_minmax(0,1fr)]">
|
|
||||||
<div className="space-y-1.5">
|
|
||||||
<div className="text-xs font-medium">按钮名称</div>
|
|
||||||
<Input
|
|
||||||
value={button.label}
|
|
||||||
onChange={(event) =>
|
|
||||||
onPatch(button.id, { label: event.target.value })
|
|
||||||
}
|
|
||||||
placeholder="如：业务系统"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div className="space-y-1.5">
|
|
||||||
<div className="text-xs font-medium">跳转链接</div>
|
|
||||||
<Input
|
|
||||||
value={button.url}
|
|
||||||
onChange={(event) =>
|
|
||||||
onPatch(button.id, { url: event.target.value })
|
|
||||||
}
|
|
||||||
placeholder="https://example.com/page"
|
|
||||||
className="font-mono"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="flex shrink-0 items-center gap-1 pt-6">
|
|
||||||
<Button
|
|
||||||
type="button"
|
|
||||||
variant="ghost"
|
|
||||||
size="icon-sm"
|
|
||||||
onClick={() => onMove(button.id, -1)}
|
|
||||||
disabled={index === 0}
|
|
||||||
title="上移"
|
|
||||||
>
|
|
||||||
<ArrowUp className="size-4" />
|
|
||||||
</Button>
|
|
||||||
<Button
|
|
||||||
type="button"
|
|
||||||
variant="ghost"
|
|
||||||
size="icon-sm"
|
|
||||||
onClick={() => onMove(button.id, 1)}
|
|
||||||
disabled={index === buttons.length - 1}
|
|
||||||
title="下移"
|
|
||||||
>
|
|
||||||
<ArrowDown className="size-4" />
|
|
||||||
</Button>
|
|
||||||
<Button
|
|
||||||
type="button"
|
|
||||||
variant="ghost"
|
|
||||||
size="icon-sm"
|
|
||||||
className="text-destructive hover:text-destructive"
|
|
||||||
onClick={() => onRemove(button.id)}
|
|
||||||
title="删除"
|
|
||||||
>
|
|
||||||
<Trash2 className="size-4" />
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="rounded-lg border bg-muted/20 p-3">
|
|
||||||
<div className="mb-2 flex items-center justify-between gap-2">
|
|
||||||
<div className="flex items-center gap-1.5 text-sm font-medium">
|
|
||||||
<ExternalLink className="size-4" />
|
|
||||||
路由参数
|
|
||||||
</div>
|
|
||||||
<Button
|
|
||||||
type="button"
|
|
||||||
variant="outline"
|
|
||||||
size="sm"
|
|
||||||
onClick={() => onAddParam(button.id)}
|
|
||||||
>
|
|
||||||
<Plus className="mr-1.5 size-4" />
|
|
||||||
添加参数
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{button.route_params.length === 0 ? (
|
|
||||||
<div className="text-muted-foreground rounded-md border border-dashed bg-background/70 p-4 text-center text-xs">
|
|
||||||
不追加额外参数。
|
|
||||||
</div>
|
|
||||||
) : (
|
|
||||||
<div className="space-y-2">
|
|
||||||
{button.route_params.map((param, paramIndex) => {
|
|
||||||
const themeMap =
|
|
||||||
param.paramType === "theme"
|
|
||||||
? parseThemeMap(param.themeValue)
|
|
||||||
: {};
|
|
||||||
return (
|
|
||||||
<div
|
|
||||||
key={`${button.id}-${paramIndex}`}
|
|
||||||
className="space-y-2 rounded-md border bg-background p-2"
|
|
||||||
>
|
|
||||||
<div className="grid gap-2 md:grid-cols-[minmax(120px,1fr)_130px_minmax(180px,1.4fr)_32px]">
|
|
||||||
<Input
|
|
||||||
value={param.key}
|
|
||||||
onChange={(event) =>
|
|
||||||
onPatchParam(button.id, paramIndex, {
|
|
||||||
key: event.target.value,
|
|
||||||
})
|
|
||||||
}
|
|
||||||
placeholder="参数名 key"
|
|
||||||
className="font-mono text-xs"
|
|
||||||
/>
|
|
||||||
<Select
|
|
||||||
value={param.paramType}
|
|
||||||
onValueChange={(value) =>
|
|
||||||
onPatchParam(button.id, paramIndex, {
|
|
||||||
paramType: value as "login" | "theme",
|
|
||||||
source:
|
|
||||||
value === "login"
|
|
||||||
? param.source || "access_token"
|
|
||||||
: undefined,
|
|
||||||
})
|
|
||||||
}
|
|
||||||
>
|
|
||||||
<SelectTrigger>
|
|
||||||
<SelectValue />
|
|
||||||
</SelectTrigger>
|
|
||||||
<SelectContent>
|
|
||||||
<SelectItem value="login">登录参数</SelectItem>
|
|
||||||
<SelectItem value="theme">主题参数</SelectItem>
|
|
||||||
</SelectContent>
|
|
||||||
</Select>
|
|
||||||
{param.paramType === "login" ? (
|
|
||||||
<div className="flex min-w-0 gap-2">
|
|
||||||
<Select
|
|
||||||
value={param.source || "access_token"}
|
|
||||||
onValueChange={(value) =>
|
|
||||||
onPatchParam(button.id, paramIndex, {
|
|
||||||
source: value,
|
|
||||||
})
|
|
||||||
}
|
|
||||||
>
|
|
||||||
<SelectTrigger className="min-w-0 flex-1">
|
|
||||||
<SelectValue />
|
|
||||||
</SelectTrigger>
|
|
||||||
<SelectContent>
|
|
||||||
{LOGIN_SOURCE_OPTIONS.map((option) => (
|
|
||||||
<SelectItem
|
|
||||||
key={option.value}
|
|
||||||
value={option.value}
|
|
||||||
>
|
|
||||||
{option.label}
|
|
||||||
</SelectItem>
|
|
||||||
))}
|
|
||||||
</SelectContent>
|
|
||||||
</Select>
|
|
||||||
{param.source === "other" && (
|
|
||||||
<Input
|
|
||||||
value={param.customValue ?? ""}
|
|
||||||
onChange={(event) =>
|
|
||||||
onPatchParam(button.id, paramIndex, {
|
|
||||||
customValue: event.target.value,
|
|
||||||
})
|
|
||||||
}
|
|
||||||
placeholder="自定义值"
|
|
||||||
className="w-32 text-xs"
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
) : (
|
|
||||||
<div className="text-muted-foreground flex items-center text-xs">
|
|
||||||
按当前主题取值
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
<Button
|
|
||||||
type="button"
|
|
||||||
variant="ghost"
|
|
||||||
size="icon-sm"
|
|
||||||
className="text-destructive hover:text-destructive"
|
|
||||||
onClick={() =>
|
|
||||||
onRemoveParam(button.id, paramIndex)
|
|
||||||
}
|
|
||||||
title="删除参数"
|
|
||||||
>
|
|
||||||
<Trash2 className="size-4" />
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{param.paramType === "theme" && (
|
|
||||||
<div className="grid gap-2 rounded-md bg-muted/40 p-2 md:grid-cols-3">
|
|
||||||
{APP_THEME_COLORS.map((color) => (
|
|
||||||
<label
|
|
||||||
key={color.key}
|
|
||||||
className="flex min-w-0 items-center gap-2"
|
|
||||||
>
|
|
||||||
<span
|
|
||||||
className="size-2.5 shrink-0 rounded-full"
|
|
||||||
style={{ backgroundColor: color.dot }}
|
|
||||||
/>
|
|
||||||
<span className="text-muted-foreground shrink-0 text-xs">
|
|
||||||
{color.label}
|
|
||||||
</span>
|
|
||||||
<Input
|
|
||||||
value={themeMap[color.key] ?? color.key}
|
|
||||||
onChange={(event) =>
|
|
||||||
onPatchParam(button.id, paramIndex, {
|
|
||||||
themeValue: stringifyThemeMap({
|
|
||||||
...themeMap,
|
|
||||||
[color.key]: event.target.value,
|
|
||||||
}),
|
|
||||||
})
|
|
||||||
}
|
|
||||||
placeholder={color.key}
|
|
||||||
className="h-8 min-w-0 font-mono text-xs"
|
|
||||||
/>
|
|
||||||
</label>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
function ThemePreviewCard({
|
|
||||||
icon: Icon,
|
|
||||||
label,
|
|
||||||
description,
|
description,
|
||||||
active,
|
active,
|
||||||
mode,
|
mode,
|
||||||
|
|||||||
@@ -23,11 +23,10 @@ import {
|
|||||||
SparklesIcon,
|
SparklesIcon,
|
||||||
TagsIcon,
|
TagsIcon,
|
||||||
Trash2Icon,
|
Trash2Icon,
|
||||||
TrendingUpIcon,
|
TrendingUpIcon,
|
||||||
Upload,
|
Upload,
|
||||||
UserIcon,
|
UserIcon,
|
||||||
WorkflowIcon,
|
XIcon,
|
||||||
XIcon,
|
|
||||||
} from "lucide-react";
|
} from "lucide-react";
|
||||||
import { useRouter } from "next/navigation";
|
import { useRouter } from "next/navigation";
|
||||||
import { useCallback, useEffect, useMemo, useRef, useState } from "react";
|
import { useCallback, useEffect, useMemo, useRef, useState } from "react";
|
||||||
@@ -51,6 +50,13 @@ import {
|
|||||||
EmptyTitle,
|
EmptyTitle,
|
||||||
} from "@/components/ui/empty";
|
} from "@/components/ui/empty";
|
||||||
|
|
||||||
|
import {
|
||||||
|
Item,
|
||||||
|
ItemActions,
|
||||||
|
ItemTitle,
|
||||||
|
ItemContent,
|
||||||
|
ItemDescription,
|
||||||
|
} from "@/components/ui/item";
|
||||||
import { Input } from "@/components/ui/input";
|
import { Input } from "@/components/ui/input";
|
||||||
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
|
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
|
||||||
import { Tabs, TabsList, TabsTrigger } from "@/components/ui/tabs";
|
import { Tabs, TabsList, TabsTrigger } from "@/components/ui/tabs";
|
||||||
@@ -736,9 +742,9 @@ export function SkillRow({
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const badgeGroup = (
|
const badgeGroup = (
|
||||||
<div className="flex flex-wrap items-center gap-2">
|
<div className="flex flex-wrap items-center gap-2">
|
||||||
<span className="min-w-0 truncate text-[15px] font-semibold tracking-[-0.01em] text-slate-900 dark:text-slate-100">
|
<span className={cn(isCard && "truncate font-medium")}>
|
||||||
{skill.name_zh?.trim() ? skill.name_zh : desensitize(skill.name)}
|
{skill.name_zh?.trim() ? skill.name_zh : desensitize(skill.name)}
|
||||||
</span>
|
</span>
|
||||||
{skill.name_zh?.trim() && (
|
{skill.name_zh?.trim() && (
|
||||||
@@ -896,12 +902,12 @@ export function SkillRow({
|
|||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
|
|
||||||
const actionButtons = (
|
const actionButtons = (
|
||||||
<>
|
<>
|
||||||
<Button
|
<Button
|
||||||
size="icon"
|
size="icon"
|
||||||
variant="ghost"
|
variant="ghost"
|
||||||
className="h-8 w-8 shrink-0 rounded-lg text-slate-500 hover:bg-slate-100 hover:text-slate-950 dark:text-slate-400 dark:hover:bg-slate-800 dark:hover:text-white"
|
className="h-8 w-8 shrink-0"
|
||||||
onClick={() => setTagPickerOpen(true)}
|
onClick={() => setTagPickerOpen(true)}
|
||||||
title={t.adminTags.manageTags}
|
title={t.adminTags.manageTags}
|
||||||
>
|
>
|
||||||
@@ -911,8 +917,8 @@ export function SkillRow({
|
|||||||
<Button
|
<Button
|
||||||
size="icon"
|
size="icon"
|
||||||
variant="ghost"
|
variant="ghost"
|
||||||
className={cn(
|
className={cn(
|
||||||
"h-8 w-8 shrink-0 rounded-lg text-slate-500 hover:bg-slate-100 hover:text-slate-950 dark:text-slate-400 dark:hover:bg-slate-800 dark:hover:text-white",
|
"h-8 w-8 shrink-0",
|
||||||
skill.featured && "text-amber-600 hover:text-amber-700",
|
skill.featured && "text-amber-600 hover:text-amber-700",
|
||||||
)}
|
)}
|
||||||
disabled={setFeatured.isPending}
|
disabled={setFeatured.isPending}
|
||||||
@@ -932,8 +938,8 @@ export function SkillRow({
|
|||||||
<Button
|
<Button
|
||||||
size="icon"
|
size="icon"
|
||||||
variant="ghost"
|
variant="ghost"
|
||||||
className={cn(
|
className={cn(
|
||||||
"h-8 w-8 shrink-0 rounded-lg text-slate-500 hover:bg-slate-100 hover:text-slate-950 dark:text-slate-400 dark:hover:bg-slate-800 dark:hover:text-white",
|
"h-8 w-8 shrink-0",
|
||||||
skill.pinned && "text-emerald-600 hover:text-emerald-700",
|
skill.pinned && "text-emerald-600 hover:text-emerald-700",
|
||||||
)}
|
)}
|
||||||
disabled={setPinned.isPending}
|
disabled={setPinned.isPending}
|
||||||
@@ -953,8 +959,8 @@ export function SkillRow({
|
|||||||
<Button
|
<Button
|
||||||
size="icon"
|
size="icon"
|
||||||
variant="ghost"
|
variant="ghost"
|
||||||
className={cn(
|
className={cn(
|
||||||
"h-8 w-8 shrink-0 rounded-lg text-slate-500 hover:bg-slate-100 hover:text-slate-950 dark:text-slate-400 dark:hover:bg-slate-800 dark:hover:text-white",
|
"h-8 w-8 shrink-0",
|
||||||
skill.always_on && "text-amber-600 hover:text-amber-700",
|
skill.always_on && "text-amber-600 hover:text-amber-700",
|
||||||
)}
|
)}
|
||||||
disabled={setAlwaysOn.isPending}
|
disabled={setAlwaysOn.isPending}
|
||||||
@@ -991,9 +997,9 @@ export function SkillRow({
|
|||||||
</Button>
|
</Button>
|
||||||
)}
|
)}
|
||||||
<Button
|
<Button
|
||||||
size="icon"
|
size="icon"
|
||||||
variant="ghost"
|
variant="ghost"
|
||||||
className="h-8 w-8 shrink-0 rounded-lg text-slate-500 hover:bg-slate-100 hover:text-slate-950 dark:text-slate-400 dark:hover:bg-slate-800 dark:hover:text-white"
|
className="h-8 w-8 shrink-0"
|
||||||
disabled={duplicateSkillMutation.isPending}
|
disabled={duplicateSkillMutation.isPending}
|
||||||
onClick={handleOpenDuplicate}
|
onClick={handleOpenDuplicate}
|
||||||
title="复制为新技能"
|
title="复制为新技能"
|
||||||
@@ -1002,9 +1008,9 @@ export function SkillRow({
|
|||||||
</Button>
|
</Button>
|
||||||
{canManage && (
|
{canManage && (
|
||||||
<Button
|
<Button
|
||||||
size="icon"
|
size="icon"
|
||||||
variant="ghost"
|
variant="ghost"
|
||||||
className="text-destructive hover:text-destructive h-8 w-8 shrink-0 rounded-lg hover:bg-red-50 dark:hover:bg-red-950/30"
|
className="text-destructive hover:text-destructive h-8 w-8 shrink-0"
|
||||||
onClick={() => setConfirmDeleteOpen(true)}
|
onClick={() => setConfirmDeleteOpen(true)}
|
||||||
title={t.settings.skills.deleteAction}
|
title={t.settings.skills.deleteAction}
|
||||||
>
|
>
|
||||||
@@ -1012,124 +1018,41 @@ export function SkillRow({
|
|||||||
</Button>
|
</Button>
|
||||||
)}
|
)}
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
|
|
||||||
const iconStyle = skill.name.includes("web") || skill.name.includes("search")
|
|
||||||
? {
|
|
||||||
Icon: GlobeIcon,
|
|
||||||
className: "bg-emerald-600 text-white shadow-[0_6px_16px_rgba(22,163,74,0.22)]",
|
|
||||||
}
|
|
||||||
: skill.name.includes("doc") || skill.name.includes("file")
|
|
||||||
? {
|
|
||||||
Icon: FileArchive,
|
|
||||||
className: "bg-violet-600 text-white shadow-[0_6px_16px_rgba(124,58,237,0.22)]",
|
|
||||||
}
|
|
||||||
: skill.source === "agent"
|
|
||||||
? {
|
|
||||||
Icon: WorkflowIcon,
|
|
||||||
className: "bg-[#2166e8] text-white shadow-[0_6px_16px_rgba(37,99,235,0.22)]",
|
|
||||||
}
|
|
||||||
: {
|
|
||||||
Icon: Upload,
|
|
||||||
className: "bg-amber-500 text-white shadow-[0_6px_16px_rgba(245,158,11,0.22)]",
|
|
||||||
};
|
|
||||||
const SkillIcon = iconStyle.Icon;
|
|
||||||
const activityAt = formatDateTime(skill.last_activity_at ?? skill.created_at);
|
|
||||||
const actionArea = (
|
|
||||||
<div className="flex flex-wrap items-center justify-end gap-1" onClick={(event) => event.stopPropagation()}>
|
|
||||||
{actionButtons}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
{isCard ? (
|
{isCard ? (
|
||||||
<div className="flex h-full min-w-0 flex-col rounded-xl border border-slate-200 bg-white p-5 shadow-[0_5px_18px_rgba(15,23,42,0.035)] transition-[border-color,box-shadow] hover:border-blue-200 hover:shadow-[0_10px_28px_rgba(37,99,235,0.07)] dark:border-slate-800 dark:bg-slate-900 dark:text-white">
|
<div className="flex h-full min-w-0 flex-col rounded-lg border p-3 transition-shadow hover:shadow-sm dark:border-[#213D5E] dark:bg-[#02244C] dark:text-white">
|
||||||
<div
|
<div
|
||||||
className="min-w-0 flex-1 cursor-pointer"
|
className="min-w-0 flex-1 cursor-pointer"
|
||||||
onClick={() => setDetailOpen(true)}
|
onClick={() => setDetailOpen(true)}
|
||||||
>
|
>
|
||||||
<div className="flex items-start gap-3.5">
|
{badgeGroup}
|
||||||
<div className={cn("flex size-12 shrink-0 items-center justify-center rounded-full", iconStyle.className)}>
|
<p className="text-muted-foreground mt-1 line-clamp-3 text-sm">
|
||||||
<SkillIcon className="size-6" />
|
{desensitize(skill.description ?? "")}
|
||||||
</div>
|
</p>
|
||||||
<div className="min-w-0 flex-1">
|
{metaNodes}
|
||||||
{badgeGroup}
|
</div>
|
||||||
<p className="mt-1.5 line-clamp-3 text-sm leading-6 text-slate-600 dark:text-slate-400">
|
<div className="mt-2 flex flex-wrap items-center justify-end gap-1 border-t pt-2 dark:border-[#213D5E]">
|
||||||
{desensitize(skill.description ?? "")}
|
{actionButtons}
|
||||||
</p>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
) : (
|
||||||
<div className="mt-4 flex flex-wrap items-center gap-2">
|
<Item className="w-full dark:border-[#213D5E] dark:bg-[#02244C] dark:text-white" variant="outline">
|
||||||
<Badge className={cn("border-0 px-2.5 py-1 text-xs font-normal", skill.enabled ? "bg-emerald-50 text-emerald-600 hover:bg-emerald-50 dark:bg-emerald-500/15 dark:text-emerald-300" : "bg-slate-100 text-slate-500 hover:bg-slate-100 dark:bg-slate-800 dark:text-slate-400")}>
|
<ItemContent
|
||||||
<span className={cn("mr-1.5 size-1.5 rounded-full", skill.enabled ? "bg-emerald-500" : "bg-slate-400")} />
|
className="cursor-pointer"
|
||||||
{skill.enabled ? "已启用" : "未启用"}
|
onClick={() => setDetailOpen(true)}
|
||||||
</Badge>
|
>
|
||||||
<span className="text-xs text-slate-400">{skill.use_count ? `调用 ${skill.use_count} 次` : "暂无调用"}</span>
|
<ItemTitle>{badgeGroup}</ItemTitle>
|
||||||
{activityAt && <span className="text-xs text-slate-400">更新于 {activityAt}</span>}
|
<ItemDescription className="line-clamp-4">
|
||||||
</div>
|
{desensitize(skill.description ?? "")}
|
||||||
{(skill.tags?.length ?? 0) > 0 && <TagChipList tags={skill.tags!} className="mt-3" />}
|
</ItemDescription>
|
||||||
</div>
|
{metaNodes}
|
||||||
<div className="mt-4 border-t border-slate-100 pt-3 dark:border-slate-800">
|
</ItemContent>
|
||||||
{actionArea}
|
<ItemActions>{actionButtons}</ItemActions>
|
||||||
</div>
|
</Item>
|
||||||
</div>
|
)}
|
||||||
) : (
|
|
||||||
<div className="group/skill-card w-full rounded-xl border border-slate-200 bg-white px-5 py-4 shadow-[0_5px_18px_rgba(15,23,42,0.03)] transition-[border-color,box-shadow] hover:border-blue-200 hover:shadow-[0_10px_28px_rgba(37,99,235,0.07)] dark:border-slate-800 dark:bg-slate-900 dark:text-white">
|
|
||||||
<div className="grid min-w-0 grid-cols-1 gap-4 xl:grid-cols-[minmax(0,1.65fr)_minmax(150px,0.72fr)_minmax(100px,0.42fr)_minmax(132px,0.58fr)_auto] xl:items-center xl:gap-x-6">
|
|
||||||
<div className="flex min-w-0 cursor-pointer items-start gap-4" onClick={() => setDetailOpen(true)}>
|
|
||||||
<div className={cn("flex size-[60px] shrink-0 items-center justify-center rounded-full", iconStyle.className)}>
|
|
||||||
<SkillIcon className="size-7" />
|
|
||||||
</div>
|
|
||||||
<div className="min-w-0 flex-1 pt-0.5">
|
|
||||||
{badgeGroup}
|
|
||||||
<p className="mt-1.5 line-clamp-2 text-sm leading-5 text-slate-600 dark:text-slate-400">
|
|
||||||
{desensitize(skill.description ?? "")}
|
|
||||||
</p>
|
|
||||||
{!isBuiltin && skill.owner_username && (
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
disabled={!skill.owner_user_id || !onPublisherClick}
|
|
||||||
onClick={(event) => {
|
|
||||||
event.stopPropagation();
|
|
||||||
if (!skill.owner_user_id || !onPublisherClick) return;
|
|
||||||
onPublisherClick({ id: skill.owner_user_id, label: desensitize(skill.owner_username!) });
|
|
||||||
}}
|
|
||||||
className={cn(
|
|
||||||
"mt-2 flex max-w-full items-center gap-1 text-xs text-slate-400",
|
|
||||||
skill.owner_user_id && onPublisherClick && "cursor-pointer hover:text-blue-600 hover:underline",
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
<UserIcon className="size-3.5 shrink-0" />
|
|
||||||
<span className="truncate">发布者：{desensitize(skill.owner_username)}</span>
|
|
||||||
</button>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="min-w-0 xl:border-l xl:border-slate-100 xl:pl-5 xl:dark:border-slate-800">
|
|
||||||
{(skill.tags?.length ?? 0) > 0 ? (
|
|
||||||
<TagChipList tags={skill.tags!} />
|
|
||||||
) : (
|
|
||||||
<span className="text-xs text-slate-400">未设置标签</span>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
<div className="min-w-0 text-sm text-slate-600 dark:text-slate-300">
|
|
||||||
<span className="block text-xs text-slate-400 xl:hidden">使用次数</span>
|
|
||||||
{skill.use_count ? `${skill.use_count} 次` : "暂无调用"}
|
|
||||||
</div>
|
|
||||||
<div className="min-w-0">
|
|
||||||
<Badge className={cn("border-0 px-2.5 py-1 text-xs font-normal", skill.enabled ? "bg-emerald-50 text-emerald-600 hover:bg-emerald-50 dark:bg-emerald-500/15 dark:text-emerald-300" : "bg-slate-100 text-slate-500 hover:bg-slate-100 dark:bg-slate-800 dark:text-slate-400")}>
|
|
||||||
<span className={cn("mr-1.5 size-1.5 rounded-full", skill.enabled ? "bg-emerald-500" : "bg-slate-400")} />
|
|
||||||
{skill.enabled ? "已启用" : "未启用"}
|
|
||||||
</Badge>
|
|
||||||
{activityAt && <p className="mt-2 truncate text-xs text-slate-400" title={activityAt}>更新于 {activityAt}</p>}
|
|
||||||
</div>
|
|
||||||
<div className="min-w-0 border-t border-slate-100 pt-3 xl:border-t-0 xl:pt-0 dark:border-slate-800">
|
|
||||||
{actionArea}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
<Dialog open={duplicateOpen} onOpenChange={setDuplicateOpen}>
|
<Dialog open={duplicateOpen} onOpenChange={setDuplicateOpen}>
|
||||||
<DialogContent>
|
<DialogContent>
|
||||||
<DialogHeader>
|
<DialogHeader>
|
||||||
|
|||||||
@@ -1,4 +1,4 @@
|
|||||||
import { ExternalLinkIcon, FileTextIcon, LoaderCircle } from "lucide-react";
|
import { ExternalLinkIcon } from "lucide-react";
|
||||||
|
|
||||||
import { Button } from "@/components/ui/button";
|
import { Button } from "@/components/ui/button";
|
||||||
import {
|
import {
|
||||||
@@ -9,12 +9,10 @@ import {
|
|||||||
DialogTitle,
|
DialogTitle,
|
||||||
} from "@/components/ui/dialog";
|
} from "@/components/ui/dialog";
|
||||||
import type { RuntimeDisplaySource } from "@/core/skill-display/runtime";
|
import type { RuntimeDisplaySource } from "@/core/skill-display/runtime";
|
||||||
import { apiFetch } from "@/core/api/fetch-client";
|
|
||||||
import { getBackendBaseURL } from "@/core/config";
|
|
||||||
import { useLocalSettings } from "@/core/settings";
|
import { useLocalSettings } from "@/core/settings";
|
||||||
import { useCitationDisplaySettings } from "@/core/system-settings/hooks";
|
import { useCitationDisplaySettings } from "@/core/system-settings/hooks";
|
||||||
import { cn } from "@/lib/utils";
|
import { cn } from "@/lib/utils";
|
||||||
import { useEffect, useState } from "react";
|
import { useState } from "react";
|
||||||
|
|
||||||
export function SkillDisplaySources({
|
export function SkillDisplaySources({
|
||||||
highlightedReferenceId,
|
highlightedReferenceId,
|
||||||
@@ -53,10 +51,6 @@ export function SourceCard({
|
|||||||
referenceTarget?: boolean;
|
referenceTarget?: boolean;
|
||||||
}) {
|
}) {
|
||||||
const [open, setOpen] = useState(false);
|
const [open, setOpen] = useState(false);
|
||||||
const [showOriginal, setShowOriginal] = useState(false);
|
|
||||||
const [context, setContext] = useState<WeKnoraSourceContext | null>(null);
|
|
||||||
const [contextLoading, setContextLoading] = useState(false);
|
|
||||||
const [contextError, setContextError] = useState<string | null>(null);
|
|
||||||
const [settings] = useLocalSettings();
|
const [settings] = useLocalSettings();
|
||||||
const { data: citationDisplay } = useCitationDisplaySettings();
|
const { data: citationDisplay } = useCitationDisplaySettings();
|
||||||
const cleanupWords =
|
const cleanupWords =
|
||||||
@@ -79,44 +73,6 @@ export function SourceCard({
|
|||||||
].filter(Boolean);
|
].filter(Boolean);
|
||||||
const isCitation = source.mode === "citation";
|
const isCitation = source.mode === "citation";
|
||||||
const showReferenceNumber = isCitation;
|
const showReferenceNumber = isCitation;
|
||||||
const previewTarget = parseWeKnoraPreviewUrl(source.url);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
if (!open || !showOriginal || !previewTarget) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
let cancelled = false;
|
|
||||||
setContext(null);
|
|
||||||
setContextError(null);
|
|
||||||
setContextLoading(true);
|
|
||||||
const params = new URLSearchParams({
|
|
||||||
knowledge_base_id: previewTarget.knowledgeBaseId,
|
|
||||||
chunk_id: previewTarget.chunkId,
|
|
||||||
});
|
|
||||||
void apiFetch(`${getBackendBaseURL()}/api/weknora/source-context?${params}`)
|
|
||||||
.then(async (response) => {
|
|
||||||
const payload = (await response.json().catch(() => null)) as unknown;
|
|
||||||
if (!response.ok || !isWeKnoraSourceContextResponse(payload)) {
|
|
||||||
throw new Error(readPreviewError(payload, response.status));
|
|
||||||
}
|
|
||||||
if (!cancelled) {
|
|
||||||
setContext(payload.data);
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.catch((error: unknown) => {
|
|
||||||
if (!cancelled) {
|
|
||||||
setContextError(error instanceof Error ? error.message : "无法加载原文上下文");
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
if (!cancelled) {
|
|
||||||
setContextLoading(false);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
return () => {
|
|
||||||
cancelled = true;
|
|
||||||
};
|
|
||||||
}, [open, showOriginal, previewTarget?.chunkId, previewTarget?.knowledgeBaseId]);
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
@@ -129,10 +85,7 @@ export function SourceCard({
|
|||||||
highlighted &&
|
highlighted &&
|
||||||
"border-amber-300 bg-amber-50/80 shadow-[0_0_0_2px_rgba(251,191,36,0.14)]",
|
"border-amber-300 bg-amber-50/80 shadow-[0_0_0_2px_rgba(251,191,36,0.14)]",
|
||||||
)}
|
)}
|
||||||
onClick={() => {
|
onClick={() => setOpen(true)}
|
||||||
setShowOriginal(false);
|
|
||||||
setOpen(true);
|
|
||||||
}}
|
|
||||||
>
|
>
|
||||||
<div className="flex items-start gap-3">
|
<div className="flex items-start gap-3">
|
||||||
{showReferenceNumber && (
|
{showReferenceNumber && (
|
||||||
@@ -161,26 +114,11 @@ export function SourceCard({
|
|||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
{source.url && (
|
{source.url && (
|
||||||
previewTarget ? (
|
<ExternalLinkIcon className="text-muted-foreground/60 group-hover:text-primary mt-1 size-3.5 shrink-0 transition-colors" />
|
||||||
<span className="text-primary bg-primary/10 mt-0.5 inline-flex shrink-0 items-center gap-1 rounded-md px-1.5 py-1 text-[11px] font-medium">
|
|
||||||
<FileTextIcon className="size-3.5" />
|
|
||||||
查看原文
|
|
||||||
</span>
|
|
||||||
) : (
|
|
||||||
<ExternalLinkIcon className="text-muted-foreground/60 group-hover:text-primary mt-1 size-3.5 shrink-0 transition-colors" />
|
|
||||||
)
|
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
</button>
|
</button>
|
||||||
<Dialog
|
<Dialog open={open} onOpenChange={setOpen}>
|
||||||
open={open}
|
|
||||||
onOpenChange={(nextOpen) => {
|
|
||||||
setOpen(nextOpen);
|
|
||||||
if (!nextOpen) {
|
|
||||||
setShowOriginal(false);
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<DialogContent className="max-w-2xl">
|
<DialogContent className="max-w-2xl">
|
||||||
<DialogHeader>
|
<DialogHeader>
|
||||||
<div className="flex items-start justify-between gap-3 pr-8">
|
<div className="flex items-start justify-between gap-3 pr-8">
|
||||||
@@ -203,7 +141,7 @@ export function SourceCard({
|
|||||||
</DialogDescription>
|
</DialogDescription>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
{source.url && !previewTarget && (
|
{source.url && (
|
||||||
<Button size="icon-sm" variant="outline" asChild>
|
<Button size="icon-sm" variant="outline" asChild>
|
||||||
<a
|
<a
|
||||||
href={source.url}
|
href={source.url}
|
||||||
@@ -217,33 +155,7 @@ export function SourceCard({
|
|||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
</DialogHeader>
|
</DialogHeader>
|
||||||
{previewTarget && (
|
{paragraphs.length > 0 && (
|
||||||
<div className="border-b pb-3">
|
|
||||||
<div className="flex flex-wrap items-center justify-between gap-2">
|
|
||||||
<span className="text-muted-foreground text-xs">
|
|
||||||
{showOriginal
|
|
||||||
? "正在查看命中文段及其前后上下文"
|
|
||||||
: "当前为检索命中的片段，可继续查看原文上下文"}
|
|
||||||
</span>
|
|
||||||
<Button
|
|
||||||
type="button"
|
|
||||||
size="sm"
|
|
||||||
variant={showOriginal ? "outline" : "default"}
|
|
||||||
onClick={() => setShowOriginal((current) => !current)}
|
|
||||||
>
|
|
||||||
<FileTextIcon className="size-3.5" />
|
|
||||||
{showOriginal ? "返回检索片段" : "查看原文"}
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
{previewTarget && showOriginal ? (
|
|
||||||
<WeKnoraSourceContextPanel
|
|
||||||
context={context}
|
|
||||||
loading={contextLoading}
|
|
||||||
error={contextError}
|
|
||||||
/>
|
|
||||||
) : paragraphs.length > 0 ? (
|
|
||||||
<div className="text-foreground max-h-[55vh] space-y-3 overflow-y-auto text-sm leading-relaxed">
|
<div className="text-foreground max-h-[55vh] space-y-3 overflow-y-auto text-sm leading-relaxed">
|
||||||
{paragraphs.map((paragraph, index) => (
|
{paragraphs.map((paragraph, index) => (
|
||||||
<p key={index} className="whitespace-pre-wrap">
|
<p key={index} className="whitespace-pre-wrap">
|
||||||
@@ -251,8 +163,8 @@ export function SourceCard({
|
|||||||
</p>
|
</p>
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
) : null}
|
)}
|
||||||
{source.url && !previewTarget && (
|
{source.url && (
|
||||||
<div className="text-muted-foreground border-t pt-3 text-xs break-all">
|
<div className="text-muted-foreground border-t pt-3 text-xs break-all">
|
||||||
{source.url}
|
{source.url}
|
||||||
</div>
|
</div>
|
||||||
@@ -263,133 +175,6 @@ export function SourceCard({
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
type WeKnoraPreviewTarget = {
|
|
||||||
knowledgeBaseId: string;
|
|
||||||
chunkId: string;
|
|
||||||
};
|
|
||||||
|
|
||||||
type WeKnoraSourceContext = {
|
|
||||||
knowledge_base_name?: string;
|
|
||||||
document_title?: string;
|
|
||||||
document_file_name?: string;
|
|
||||||
focus_chunk_id: string;
|
|
||||||
chunks: Array<{
|
|
||||||
id: string;
|
|
||||||
chunk_index?: number;
|
|
||||||
content: string;
|
|
||||||
is_focus: boolean;
|
|
||||||
}>;
|
|
||||||
};
|
|
||||||
|
|
||||||
export function isWeKnoraSourcePreviewUrl(url?: string): boolean {
|
|
||||||
return parseWeKnoraPreviewUrl(url) !== null;
|
|
||||||
}
|
|
||||||
|
|
||||||
function parseWeKnoraPreviewUrl(url?: string): WeKnoraPreviewTarget | null {
|
|
||||||
const normalizedUrl = url
|
|
||||||
?.trim()
|
|
||||||
.replace(/^[\u200B-\u200D\uFEFF]+/, "");
|
|
||||||
const marker = "/weknora-source-preview?";
|
|
||||||
const start = normalizedUrl?.indexOf(marker) ?? -1;
|
|
||||||
if (start < 0) {
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
// Some MCP tool results wrap the relative pointer in formatting characters
|
|
||||||
// or append a newline. Keep accepting that safe internal path, but never
|
|
||||||
// treat a normal external URL as an original-document preview.
|
|
||||||
const previewUrl = normalizedUrl!
|
|
||||||
.slice(start)
|
|
||||||
.split(/[\r\n\s]/, 1)[0];
|
|
||||||
const queryIndex = previewUrl.indexOf("?");
|
|
||||||
const params = new URLSearchParams(previewUrl.slice(queryIndex + 1));
|
|
||||||
const knowledgeBaseId = params.get("knowledge_base_id")?.trim();
|
|
||||||
const chunkId = params.get("chunk_id")?.trim();
|
|
||||||
return knowledgeBaseId && chunkId ? { knowledgeBaseId, chunkId } : null;
|
|
||||||
}
|
|
||||||
|
|
||||||
function isWeKnoraSourceContextResponse(
|
|
||||||
value: unknown,
|
|
||||||
): value is { success: true; data: WeKnoraSourceContext } {
|
|
||||||
if (!value || typeof value !== "object") {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
const data = (value as { data?: unknown }).data;
|
|
||||||
return (
|
|
||||||
(value as { success?: unknown }).success === true &&
|
|
||||||
!!data &&
|
|
||||||
typeof data === "object" &&
|
|
||||||
Array.isArray((data as WeKnoraSourceContext).chunks)
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
function readPreviewError(payload: unknown, status: number): string {
|
|
||||||
if (payload && typeof payload === "object") {
|
|
||||||
const detail = (payload as { detail?: unknown }).detail;
|
|
||||||
if (typeof detail === "string" && detail) {
|
|
||||||
return detail;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return status === 404 ? "原文已不可用" : "无法加载原文上下文";
|
|
||||||
}
|
|
||||||
|
|
||||||
function WeKnoraSourceContextPanel({
|
|
||||||
context,
|
|
||||||
loading,
|
|
||||||
error,
|
|
||||||
}: {
|
|
||||||
context: WeKnoraSourceContext | null;
|
|
||||||
loading: boolean;
|
|
||||||
error: string | null;
|
|
||||||
}) {
|
|
||||||
if (loading) {
|
|
||||||
return (
|
|
||||||
<div className="text-muted-foreground flex min-h-36 items-center justify-center gap-2 text-sm">
|
|
||||||
<LoaderCircle className="size-4 animate-spin" />
|
|
||||||
正在加载原文上下文…
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
if (error) {
|
|
||||||
return (
|
|
||||||
<div className="border-destructive/30 bg-destructive/5 text-destructive rounded-lg border p-3 text-sm">
|
|
||||||
{error}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
if (!context) {
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
return (
|
|
||||||
<div className="max-h-[55vh] space-y-3 overflow-y-auto pr-1">
|
|
||||||
<div className="bg-muted/60 text-muted-foreground rounded-lg px-3 py-2 text-xs">
|
|
||||||
<span>{context.knowledge_base_name || "WeKnora 知识库"}</span>
|
|
||||||
{context.document_title && <span> · {context.document_title}</span>}
|
|
||||||
</div>
|
|
||||||
{context.chunks.map((chunk) => (
|
|
||||||
<section
|
|
||||||
key={chunk.id}
|
|
||||||
className={cn(
|
|
||||||
"rounded-lg border p-3 text-sm leading-relaxed",
|
|
||||||
chunk.is_focus
|
|
||||||
? "border-primary/50 bg-primary/5 shadow-sm"
|
|
||||||
: "bg-muted/20",
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
<div className="text-muted-foreground mb-2 flex items-center gap-2 text-xs">
|
|
||||||
<span>分段 {typeof chunk.chunk_index === "number" ? chunk.chunk_index + 1 : "-"}</span>
|
|
||||||
{chunk.is_focus && (
|
|
||||||
<span className="bg-primary text-primary-foreground rounded px-1.5 py-0.5 font-medium">
|
|
||||||
检索命中
|
|
||||||
</span>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
<p className="whitespace-pre-wrap">{chunk.content}</p>
|
|
||||||
</section>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
function cleanReferenceText(
|
function cleanReferenceText(
|
||||||
raw: string | undefined,
|
raw: string | undefined,
|
||||||
cleanupWords: string[],
|
cleanupWords: string[],
|
||||||
|
|||||||
@@ -1,73 +0,0 @@
|
|||||||
"use client";
|
|
||||||
|
|
||||||
import { UserRound } from "lucide-react";
|
|
||||||
|
|
||||||
import { useLiveAccount } from "@/core/auth/use-live-account";
|
|
||||||
import { useMyPosition } from "@/core/positions";
|
|
||||||
import { cn } from "@/lib/utils";
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 名称 + 岗位 用户标识。全量模式由 strategy-components/Header.tsx 顶栏右侧展示；
|
|
||||||
* 紧凑模式（不带全局顶栏）无处承载，故抽成共享组件，复用同一套数据来源
|
|
||||||
* （实时 auth 展示名；岗位取 `useMyPosition`），
|
|
||||||
* 供页面级顶栏（如 ChatPage）右侧复用，保证两套布局一致。
|
|
||||||
*
|
|
||||||
* 配色按当前内容区前景色（foreground / muted-foreground），适配聊天页浅底顶栏，
|
|
||||||
* 而非 Header 的白字贴 banner 方案。
|
|
||||||
*/
|
|
||||||
export function UserIdentityBadge({
|
|
||||||
className,
|
|
||||||
variant = "plain",
|
|
||||||
}: {
|
|
||||||
className?: string;
|
|
||||||
variant?: "plain" | "topbar";
|
|
||||||
}) {
|
|
||||||
// userInfo belongs to external-app route parameters and can legitimately
|
|
||||||
// outlive a login switch. The visible account name must instead match the
|
|
||||||
// settings page's current auth identity.
|
|
||||||
const liveAccount = useLiveAccount();
|
|
||||||
const { data: myPosition } = useMyPosition();
|
|
||||||
const positionName = myPosition?.name?.trim() || "";
|
|
||||||
const displayName = liveAccount.displayName;
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div
|
|
||||||
data-workspace-user={variant}
|
|
||||||
className={cn(
|
|
||||||
"flex shrink-0 items-center gap-2",
|
|
||||||
variant === "topbar" &&
|
|
||||||
"h-10 max-w-[240px] rounded-lg px-1.5 py-1 text-slate-700 dark:text-slate-200",
|
|
||||||
className,
|
|
||||||
)}
|
|
||||||
title={positionName ? `${displayName}·${positionName}` : displayName}
|
|
||||||
>
|
|
||||||
<div
|
|
||||||
className={cn(
|
|
||||||
"bg-muted text-muted-foreground relative flex size-7 shrink-0 items-center justify-center rounded-full",
|
|
||||||
variant === "topbar" &&
|
|
||||||
"size-8 bg-gradient-to-br from-blue-500 to-indigo-600 text-white shadow-[0_4px_12px_-6px_rgba(37,99,235,0.8)] ring-1 ring-blue-500/10 dark:from-blue-400 dark:to-indigo-500",
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
<UserRound className={cn("size-3.5", variant === "topbar" && "size-4")} />
|
|
||||||
{variant === "topbar" && (
|
|
||||||
<span className="absolute right-0 bottom-0 size-2.5 rounded-full border-2 border-white bg-emerald-500 dark:border-slate-950" />
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
className={cn(
|
|
||||||
"hidden min-w-0 text-left sm:block",
|
|
||||||
variant === "topbar" && "max-w-[165px]",
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
<p className="text-foreground truncate text-sm font-medium leading-tight">
|
|
||||||
{displayName}
|
|
||||||
</p>
|
|
||||||
{positionName && (
|
|
||||||
<p className="text-muted-foreground truncate text-[11px] leading-tight">
|
|
||||||
{positionName}
|
|
||||||
</p>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@@ -1,14 +1,16 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
import { useSearchParams } from "next/navigation";
|
import { useSearchParams } from "next/navigation";
|
||||||
import { useMemo } from "react";
|
import { useEffect, useMemo } from "react";
|
||||||
|
|
||||||
import { useI18n } from "@/core/i18n/hooks";
|
import { useI18n } from "@/core/i18n/hooks";
|
||||||
import { cn } from "@/lib/utils";
|
import { cn } from "@/lib/utils";
|
||||||
|
|
||||||
import { AuroraText } from "../ui/aurora-text";
|
import { AuroraText } from "../ui/aurora-text";
|
||||||
|
|
||||||
export function Welcome({
|
let waved = false;
|
||||||
|
|
||||||
|
export function Welcome({
|
||||||
className,
|
className,
|
||||||
mode,
|
mode,
|
||||||
}: {
|
}: {
|
||||||
@@ -24,7 +26,10 @@ export function Welcome({
|
|||||||
}
|
}
|
||||||
return ["var(--color-foreground)"];
|
return ["var(--color-foreground)"];
|
||||||
}, [isUltra]);
|
}, [isUltra]);
|
||||||
return (
|
useEffect(() => {
|
||||||
|
waved = true;
|
||||||
|
}, []);
|
||||||
|
return (
|
||||||
<div
|
<div
|
||||||
className={cn(
|
className={cn(
|
||||||
"mx-auto flex w-full flex-col items-center justify-center gap-2 px-8 py-4 text-center",
|
"mx-auto flex w-full flex-col items-center justify-center gap-2 px-8 py-4 text-center",
|
||||||
@@ -32,12 +37,15 @@ export function Welcome({
|
|||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<div className="text-[26px] font-medium tracking-tight text-foreground/85">
|
<div className="text-[26px] font-medium tracking-tight text-foreground/85">
|
||||||
{searchParams.get("mode") === "skill" ? (
|
{searchParams.get("mode") === "skill" ? (
|
||||||
t.welcome.createYourOwnSkill
|
`✨ ${t.welcome.createYourOwnSkill} ✨`
|
||||||
) : (
|
) : (
|
||||||
<div className="flex items-center">
|
<div className="flex items-center gap-2.5">
|
||||||
<AuroraText colors={colors}>{t.welcome.greeting}</AuroraText>
|
<div className={cn("inline-block text-2xl", !waved ? "animate-wave" : "")}>
|
||||||
</div>
|
{isUltra ? "🚀" : "👋"}
|
||||||
|
</div>
|
||||||
|
<AuroraText colors={colors}>{t.welcome.greeting}</AuroraText>
|
||||||
|
</div>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
{searchParams.get("mode") === "skill" ? (
|
{searchParams.get("mode") === "skill" ? (
|
||||||
|
|||||||
@@ -1,8 +1,8 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
import Link from "next/link";
|
import Link from "next/link";
|
||||||
import { usePathname } from "next/navigation";
|
import { usePathname } from "next/navigation";
|
||||||
import { type ReactNode, useMemo } from "react";
|
import { useMemo } from "react";
|
||||||
|
|
||||||
import {
|
import {
|
||||||
Breadcrumb,
|
Breadcrumb,
|
||||||
@@ -12,10 +12,8 @@ import {
|
|||||||
BreadcrumbPage,
|
BreadcrumbPage,
|
||||||
BreadcrumbSeparator,
|
BreadcrumbSeparator,
|
||||||
} from "@/components/ui/breadcrumb";
|
} from "@/components/ui/breadcrumb";
|
||||||
import { useI18n } from "@/core/i18n/hooks";
|
import { useI18n } from "@/core/i18n/hooks";
|
||||||
import { cn } from "@/lib/utils";
|
import { cn } from "@/lib/utils";
|
||||||
import { ThemeSwitcher } from "@/components/workspace/appearance-controls";
|
|
||||||
import { UserIdentityBadge } from "@/components/workspace/user-identity-badge";
|
|
||||||
|
|
||||||
export function WorkspaceContainer({
|
export function WorkspaceContainer({
|
||||||
className,
|
className,
|
||||||
@@ -32,14 +30,11 @@ export function WorkspaceContainer({
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
export function WorkspaceHeader({
|
export function WorkspaceHeader({
|
||||||
className,
|
className,
|
||||||
children,
|
children,
|
||||||
rightActions,
|
...props
|
||||||
...props
|
}: React.ComponentProps<"header">) {
|
||||||
}: React.ComponentProps<"header"> & {
|
|
||||||
rightActions?: ReactNode;
|
|
||||||
}) {
|
|
||||||
const { t } = useI18n();
|
const { t } = useI18n();
|
||||||
const pathname = usePathname();
|
const pathname = usePathname();
|
||||||
const segments = useMemo(() => {
|
const segments = useMemo(() => {
|
||||||
@@ -56,8 +51,8 @@ export function WorkspaceHeader({
|
|||||||
)}
|
)}
|
||||||
{...props}
|
{...props}
|
||||||
>
|
>
|
||||||
<div className="flex items-center gap-2 px-4">
|
<div className="flex items-center gap-2 px-4">
|
||||||
<Breadcrumb>
|
<Breadcrumb>
|
||||||
<BreadcrumbList>
|
<BreadcrumbList>
|
||||||
{segments?.[0] && (
|
{segments?.[0] && (
|
||||||
<BreadcrumbItem className="hidden md:block">
|
<BreadcrumbItem className="hidden md:block">
|
||||||
@@ -93,20 +88,11 @@ export function WorkspaceHeader({
|
|||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
</BreadcrumbList>
|
</BreadcrumbList>
|
||||||
</Breadcrumb>
|
</Breadcrumb>
|
||||||
</div>
|
</div>
|
||||||
<div className="flex items-center gap-2 px-4">
|
</header>
|
||||||
{rightActions}
|
);
|
||||||
<ThemeSwitcher tone="content" />
|
}
|
||||||
<div
|
|
||||||
aria-hidden="true"
|
|
||||||
className="mx-1 h-6 w-px bg-slate-200 dark:bg-slate-700"
|
|
||||||
/>
|
|
||||||
<UserIdentityBadge variant="topbar" />
|
|
||||||
</div>
|
|
||||||
</header>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export function WorkspaceBody({
|
export function WorkspaceBody({
|
||||||
className,
|
className,
|
||||||
@@ -131,8 +117,7 @@ function nameOfSegment(
|
|||||||
t: ReturnType<typeof useI18n>["t"],
|
t: ReturnType<typeof useI18n>["t"],
|
||||||
) {
|
) {
|
||||||
if (!segment) return t.common.home;
|
if (!segment) return t.common.home;
|
||||||
if (segment === "workspace") return t.breadcrumb.workspace;
|
if (segment === "workspace") return t.breadcrumb.workspace;
|
||||||
if (segment === "chats") return t.breadcrumb.chats;
|
if (segment === "chats") return t.breadcrumb.chats;
|
||||||
if (segment === "agents") return t.agents.title;
|
return segment[0]?.toUpperCase() + segment.slice(1);
|
||||||
return segment[0]?.toUpperCase() + segment.slice(1);
|
}
|
||||||
}
|
|
||||||
@@ -36,8 +36,8 @@ const NEW_CHAT_CLASS =
|
|||||||
// 紧凑模式（CM 参考图）：白卡描边、居中、主色 + 图标
|
// 紧凑模式（CM 参考图）：白卡描边、居中、主色 + 图标
|
||||||
const NEW_CHAT_COMPACT_CLASS =
|
const NEW_CHAT_COMPACT_CLASS =
|
||||||
"h-9 justify-center gap-2 rounded-xl bg-card text-[13px] font-semibold text-foreground transition-colors " +
|
"h-9 justify-center gap-2 rounded-xl bg-card text-[13px] font-semibold text-foreground transition-colors " +
|
||||||
"border border-[rgb(var(--legacy-primary-rgb)/18%)] " +
|
"border border-[color-mix(in_srgb,var(--primary)_18%,transparent)] " +
|
||||||
"hover:bg-[rgb(var(--legacy-primary-rgb)/4%)] hover:text-[var(--primary)] hover:border-[rgb(var(--legacy-primary-rgb)/32%)] " +
|
"hover:bg-[color-mix(in_srgb,var(--primary)_4%,transparent)] hover:text-[var(--primary)] hover:border-[color-mix(in_srgb,var(--primary)_32%,transparent)] " +
|
||||||
"data-[active=true]:bg-card data-[active=true]:text-[var(--primary)] data-[active=true]:shadow-none";
|
"data-[active=true]:bg-card data-[active=true]:text-[var(--primary)] data-[active=true]:shadow-none";
|
||||||
|
|
||||||
export function WorkspaceNavChatList({
|
export function WorkspaceNavChatList({
|
||||||
|
|||||||
@@ -1,277 +1,268 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
import {
|
import {
|
||||||
BellIcon,
|
BellIcon,
|
||||||
BotIcon,
|
BotIcon,
|
||||||
BrainIcon,
|
BrainIcon,
|
||||||
BriefcaseIcon,
|
BriefcaseIcon,
|
||||||
CalendarClockIcon,
|
CalendarClockIcon,
|
||||||
ChevronsUpDown,
|
ChevronsUpDown,
|
||||||
DatabaseZapIcon,
|
DatabaseZapIcon,
|
||||||
GaugeIcon,
|
GaugeIcon,
|
||||||
HistoryIcon,
|
HistoryIcon,
|
||||||
MessageCircleQuestionIcon,
|
MessageCircleQuestionIcon,
|
||||||
PlugIcon,
|
ScrollTextIcon,
|
||||||
ScrollTextIcon,
|
Settings2Icon,
|
||||||
Settings2Icon,
|
SettingsIcon,
|
||||||
SettingsIcon,
|
SparklesIcon,
|
||||||
SparklesIcon,
|
TagsIcon,
|
||||||
TagsIcon,
|
TrophyIcon,
|
||||||
TrophyIcon,
|
} from "lucide-react";
|
||||||
} from "lucide-react";
|
import { useEffect, useState } from "react";
|
||||||
import { useEffect, useState } from "react";
|
|
||||||
|
import {
|
||||||
import {
|
DropdownMenu,
|
||||||
DropdownMenu,
|
DropdownMenuContent,
|
||||||
DropdownMenuContent,
|
DropdownMenuGroup,
|
||||||
DropdownMenuGroup,
|
DropdownMenuItem,
|
||||||
DropdownMenuItem,
|
DropdownMenuSeparator,
|
||||||
DropdownMenuSeparator,
|
DropdownMenuTrigger,
|
||||||
DropdownMenuTrigger,
|
} from "@/components/ui/dropdown-menu";
|
||||||
} from "@/components/ui/dropdown-menu";
|
import {
|
||||||
import {
|
SidebarMenu,
|
||||||
SidebarMenu,
|
SidebarMenuButton,
|
||||||
SidebarMenuButton,
|
SidebarMenuItem,
|
||||||
SidebarMenuItem,
|
useSidebar,
|
||||||
useSidebar,
|
} from "@/components/ui/sidebar";
|
||||||
} from "@/components/ui/sidebar";
|
import { getStoredAuth } from "@/core/auth";
|
||||||
import { getStoredAuth } from "@/core/auth";
|
import { useI18n } from "@/core/i18n/hooks";
|
||||||
import { useI18n } from "@/core/i18n/hooks";
|
import { useUnreadCount } from "@/core/notifications";
|
||||||
import { useUnreadCount } from "@/core/notifications";
|
import {
|
||||||
import {
|
loadLogSystemSettings,
|
||||||
loadLogSystemSettings,
|
type LogSystemSettings,
|
||||||
type LogSystemSettings,
|
} from "@/core/system-settings/api";
|
||||||
} from "@/core/system-settings/api";
|
|
||||||
|
import { NotificationDialog } from "./notification-dialog";
|
||||||
import { NotificationDialog } from "./notification-dialog";
|
import { useNavigate } from "react-router-dom";
|
||||||
import { useNavigate } from "react-router-dom";
|
|
||||||
|
import { SettingsDialog } from "./settings";
|
||||||
import { SettingsDialog } from "./settings";
|
|
||||||
|
function NavMenuButtonContent({
|
||||||
function NavMenuButtonContent({
|
isSidebarOpen,
|
||||||
isSidebarOpen,
|
t,
|
||||||
t,
|
}: {
|
||||||
}: {
|
isSidebarOpen: boolean;
|
||||||
isSidebarOpen: boolean;
|
t: ReturnType<typeof useI18n>["t"];
|
||||||
t: ReturnType<typeof useI18n>["t"];
|
}) {
|
||||||
}) {
|
return isSidebarOpen ? (
|
||||||
return isSidebarOpen ? (
|
<div className="text-sidebar-foreground/85 flex w-full items-center gap-2 text-left text-sm">
|
||||||
<div className="text-sidebar-foreground/85 flex w-full items-center gap-2 text-left text-sm">
|
<SettingsIcon className="size-4" />
|
||||||
<SettingsIcon className="size-4" />
|
<span>{t.workspace.settingsAndMore}</span>
|
||||||
<span>{t.workspace.settingsAndMore}</span>
|
<ChevronsUpDown className="text-sidebar-foreground/55 ml-auto size-4" />
|
||||||
<ChevronsUpDown className="text-sidebar-foreground/55 ml-auto size-4" />
|
</div>
|
||||||
</div>
|
) : (
|
||||||
) : (
|
<div className="flex size-full items-center justify-center">
|
||||||
<div className="flex size-full items-center justify-center">
|
<SettingsIcon className="text-sidebar-foreground/80 size-4" />
|
||||||
<SettingsIcon className="text-sidebar-foreground/80 size-4" />
|
</div>
|
||||||
</div>
|
);
|
||||||
);
|
}
|
||||||
}
|
|
||||||
|
export function WorkspaceNavMenu() {
|
||||||
export function WorkspaceNavMenu() {
|
const navigate = useNavigate();
|
||||||
const navigate = useNavigate();
|
const isAdmin = getStoredAuth()?.system_role === "admin";
|
||||||
const isAdmin = getStoredAuth()?.system_role === "admin";
|
const [settingsOpen, setSettingsOpen] = useState(false);
|
||||||
const [settingsOpen, setSettingsOpen] = useState(false);
|
const [settingsDefaultSection, setSettingsDefaultSection] = useState<
|
||||||
const [settingsDefaultSection, setSettingsDefaultSection] = useState<
|
"appearance" | "memory" | "tools" | "about"
|
||||||
"appearance" | "memory" | "tools" | "about"
|
>("appearance");
|
||||||
>("appearance");
|
const [notificationOpen, setNotificationOpen] = useState(false);
|
||||||
const [notificationOpen, setNotificationOpen] = useState(false);
|
const [mounted, setMounted] = useState(false);
|
||||||
const [mounted, setMounted] = useState(false);
|
const [logSystem, setLogSystem] = useState<LogSystemSettings | null>(null);
|
||||||
const [logSystem, setLogSystem] = useState<LogSystemSettings | null>(null);
|
const { open: isSidebarOpen } = useSidebar();
|
||||||
const { open: isSidebarOpen } = useSidebar();
|
const { t } = useI18n();
|
||||||
const { t } = useI18n();
|
const { data: unreadCount = 0 } = useUnreadCount();
|
||||||
const { data: unreadCount = 0 } = useUnreadCount();
|
|
||||||
|
useEffect(() => {
|
||||||
useEffect(() => {
|
setMounted(true);
|
||||||
setMounted(true);
|
}, []);
|
||||||
}, []);
|
|
||||||
|
useEffect(() => {
|
||||||
useEffect(() => {
|
if (!isAdmin) return;
|
||||||
if (!isAdmin) return;
|
let cancelled = false;
|
||||||
let cancelled = false;
|
loadLogSystemSettings()
|
||||||
loadLogSystemSettings()
|
.then((settings) => {
|
||||||
.then((settings) => {
|
if (!cancelled) setLogSystem(settings);
|
||||||
if (!cancelled) setLogSystem(settings);
|
})
|
||||||
})
|
.catch(() => {
|
||||||
.catch(() => {
|
if (!cancelled) setLogSystem(null);
|
||||||
if (!cancelled) setLogSystem(null);
|
});
|
||||||
});
|
return () => {
|
||||||
return () => {
|
cancelled = true;
|
||||||
cancelled = true;
|
};
|
||||||
};
|
}, [isAdmin]);
|
||||||
}, [isAdmin]);
|
|
||||||
|
return (
|
||||||
return (
|
<>
|
||||||
<>
|
<SettingsDialog
|
||||||
<SettingsDialog
|
open={settingsOpen}
|
||||||
open={settingsOpen}
|
onOpenChange={setSettingsOpen}
|
||||||
onOpenChange={setSettingsOpen}
|
defaultSection={settingsDefaultSection}
|
||||||
defaultSection={settingsDefaultSection}
|
/>
|
||||||
/>
|
<NotificationDialog
|
||||||
<NotificationDialog
|
open={notificationOpen}
|
||||||
open={notificationOpen}
|
onOpenChange={setNotificationOpen}
|
||||||
onOpenChange={setNotificationOpen}
|
/>
|
||||||
/>
|
<SidebarMenu className="w-full">
|
||||||
<SidebarMenu className="w-full">
|
<SidebarMenuItem>
|
||||||
<SidebarMenuItem>
|
{mounted ? (
|
||||||
{mounted ? (
|
<DropdownMenu>
|
||||||
<DropdownMenu>
|
<DropdownMenuTrigger asChild>
|
||||||
<DropdownMenuTrigger asChild>
|
<SidebarMenuButton
|
||||||
<SidebarMenuButton
|
size="lg"
|
||||||
size="lg"
|
className="data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground"
|
||||||
className="data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground"
|
>
|
||||||
>
|
<NavMenuButtonContent isSidebarOpen={isSidebarOpen} t={t} />
|
||||||
<NavMenuButtonContent isSidebarOpen={isSidebarOpen} t={t} />
|
</SidebarMenuButton>
|
||||||
</SidebarMenuButton>
|
</DropdownMenuTrigger>
|
||||||
</DropdownMenuTrigger>
|
<DropdownMenuContent
|
||||||
<DropdownMenuContent
|
className="w-(--radix-dropdown-menu-trigger-width) min-w-56 rounded-lg"
|
||||||
className="w-(--radix-dropdown-menu-trigger-width) min-w-56 rounded-lg"
|
align="end"
|
||||||
align="end"
|
sideOffset={4}
|
||||||
sideOffset={4}
|
>
|
||||||
>
|
<DropdownMenuGroup>
|
||||||
<DropdownMenuGroup>
|
<DropdownMenuItem onClick={() => setNotificationOpen(true)}>
|
||||||
<DropdownMenuItem onClick={() => setNotificationOpen(true)}>
|
<BellIcon />
|
||||||
<BellIcon />
|
{t.notifications.title}
|
||||||
{t.notifications.title}
|
{unreadCount > 0 && (
|
||||||
{unreadCount > 0 && (
|
<span className="ml-auto flex h-4 min-w-4 items-center justify-center rounded-full bg-red-500 px-1 text-[10px] font-medium leading-none text-white">
|
||||||
<span className="ml-auto flex h-4 min-w-4 items-center justify-center rounded-full bg-red-500 px-1 text-[10px] font-medium leading-none text-white">
|
{unreadCount > 99 ? "99+" : unreadCount}
|
||||||
{unreadCount > 99 ? "99+" : unreadCount}
|
</span>
|
||||||
</span>
|
)}
|
||||||
)}
|
</DropdownMenuItem>
|
||||||
</DropdownMenuItem>
|
<DropdownMenuItem
|
||||||
<DropdownMenuItem
|
onClick={() => {
|
||||||
onClick={() => {
|
setSettingsDefaultSection("appearance");
|
||||||
setSettingsDefaultSection("appearance");
|
setSettingsOpen(true);
|
||||||
setSettingsOpen(true);
|
}}
|
||||||
}}
|
>
|
||||||
>
|
<Settings2Icon />
|
||||||
<Settings2Icon />
|
{t.common.settings}
|
||||||
{t.common.settings}
|
</DropdownMenuItem>
|
||||||
</DropdownMenuItem>
|
{isAdmin && (
|
||||||
{isAdmin && (
|
<DropdownMenuItem
|
||||||
<DropdownMenuItem
|
onClick={() =>
|
||||||
onClick={() =>
|
navigate("/page/workspace/settings/llm-metrics")
|
||||||
navigate("/page/workspace/settings/llm-metrics")
|
}
|
||||||
}
|
>
|
||||||
>
|
<GaugeIcon />
|
||||||
<GaugeIcon />
|
大模型调用统计
|
||||||
大模型调用统计
|
</DropdownMenuItem>
|
||||||
</DropdownMenuItem>
|
)}
|
||||||
)}
|
{isAdmin && (
|
||||||
{isAdmin && (
|
<DropdownMenuItem
|
||||||
<DropdownMenuItem
|
onClick={() =>
|
||||||
onClick={() =>
|
navigate("/page/workspace/settings/checkpoint-migration")
|
||||||
navigate("/page/workspace/settings/checkpoint-migration")
|
}
|
||||||
}
|
>
|
||||||
>
|
<DatabaseZapIcon />
|
||||||
<DatabaseZapIcon />
|
Checkpoint 迁移
|
||||||
Checkpoint 迁移
|
</DropdownMenuItem>
|
||||||
</DropdownMenuItem>
|
)}
|
||||||
)}
|
{isAdmin ? (
|
||||||
{isAdmin ? (
|
<DropdownMenuItem
|
||||||
<DropdownMenuItem
|
onClick={() =>
|
||||||
onClick={() =>
|
navigate("/page/strategy/admin/user-leaderboard")
|
||||||
navigate("/page/strategy/admin/user-leaderboard")
|
}
|
||||||
}
|
>
|
||||||
>
|
<TrophyIcon />
|
||||||
<TrophyIcon />
|
用户排行榜
|
||||||
用户排行榜
|
</DropdownMenuItem>
|
||||||
</DropdownMenuItem>
|
) : (
|
||||||
) : (
|
<DropdownMenuItem
|
||||||
<DropdownMenuItem
|
onClick={() =>
|
||||||
onClick={() =>
|
navigate("/page/strategy/user-leaderboard")
|
||||||
navigate("/page/strategy/user-leaderboard")
|
}
|
||||||
}
|
>
|
||||||
>
|
<TrophyIcon />
|
||||||
<TrophyIcon />
|
用户排行榜
|
||||||
用户排行榜
|
</DropdownMenuItem>
|
||||||
</DropdownMenuItem>
|
)}
|
||||||
)}
|
{isAdmin && (
|
||||||
{isAdmin && (
|
<DropdownMenuItem
|
||||||
<DropdownMenuItem
|
onClick={() =>
|
||||||
onClick={() =>
|
navigate("/page/workspace/admin/scheduled-tasks")
|
||||||
navigate("/page/workspace/admin/scheduled-tasks")
|
}
|
||||||
}
|
>
|
||||||
>
|
<CalendarClockIcon />
|
||||||
<CalendarClockIcon />
|
定时任务管理
|
||||||
定时任务管理
|
</DropdownMenuItem>
|
||||||
</DropdownMenuItem>
|
)}
|
||||||
)}
|
{isAdmin && (
|
||||||
{isAdmin && (
|
<DropdownMenuItem
|
||||||
<DropdownMenuItem
|
onClick={() => navigate("/page/workspace/admin/agents")}
|
||||||
onClick={() => navigate("/page/workspace/admin/agents")}
|
>
|
||||||
>
|
<BotIcon />
|
||||||
<BotIcon />
|
智能体管理
|
||||||
智能体管理
|
</DropdownMenuItem>
|
||||||
</DropdownMenuItem>
|
)}
|
||||||
)}
|
{isAdmin && (
|
||||||
{isAdmin && (
|
<DropdownMenuItem
|
||||||
<DropdownMenuItem
|
onClick={() => navigate("/page/workspace/admin/skills")}
|
||||||
onClick={() => navigate("/page/workspace/admin/skills")}
|
>
|
||||||
>
|
<SparklesIcon />
|
||||||
<SparklesIcon />
|
技能管理
|
||||||
技能管理
|
</DropdownMenuItem>
|
||||||
</DropdownMenuItem>
|
)}
|
||||||
)}
|
<DropdownMenuItem
|
||||||
<DropdownMenuItem
|
onClick={() => navigate("/page/workspace/admin/tags")}
|
||||||
onClick={() => navigate("/page/workspace/admin/tags")}
|
>
|
||||||
>
|
<TagsIcon />
|
||||||
<TagsIcon />
|
{t.adminTags.title}
|
||||||
{t.adminTags.title}
|
</DropdownMenuItem>
|
||||||
</DropdownMenuItem>
|
{isAdmin && (
|
||||||
{isAdmin && (
|
<DropdownMenuItem
|
||||||
<DropdownMenuItem
|
onClick={() => navigate("/page/workspace/admin/positions")}
|
||||||
onClick={() => navigate("/page/workspace/admin/plugins")}
|
>
|
||||||
>
|
<BriefcaseIcon />
|
||||||
<PlugIcon />
|
岗位管理
|
||||||
插件管理
|
</DropdownMenuItem>
|
||||||
</DropdownMenuItem>
|
)}
|
||||||
)}
|
{isAdmin && (
|
||||||
{isAdmin && (
|
<DropdownMenuItem
|
||||||
<DropdownMenuItem
|
onClick={() =>
|
||||||
onClick={() => navigate("/page/workspace/admin/positions")}
|
navigate(
|
||||||
>
|
"/page/workspace/settings/recommended-questions",
|
||||||
<BriefcaseIcon />
|
)
|
||||||
岗位管理
|
}
|
||||||
</DropdownMenuItem>
|
>
|
||||||
)}
|
<MessageCircleQuestionIcon />
|
||||||
{isAdmin && (
|
推荐问题配置
|
||||||
<DropdownMenuItem
|
</DropdownMenuItem>
|
||||||
onClick={() =>
|
)}
|
||||||
navigate(
|
{isAdmin && logSystem?.enabled && logSystem.url && (
|
||||||
"/page/workspace/settings/recommended-questions",
|
<DropdownMenuItem
|
||||||
)
|
onClick={() =>
|
||||||
}
|
window.open(
|
||||||
>
|
logSystem.url,
|
||||||
<MessageCircleQuestionIcon />
|
"_blank",
|
||||||
推荐问题配置
|
"noopener,noreferrer",
|
||||||
</DropdownMenuItem>
|
)
|
||||||
)}
|
}
|
||||||
{isAdmin && logSystem?.enabled && logSystem.url && (
|
>
|
||||||
<DropdownMenuItem
|
<ScrollTextIcon />
|
||||||
onClick={() =>
|
{logSystem.label || "日志系统"}
|
||||||
window.open(
|
</DropdownMenuItem>
|
||||||
logSystem.url,
|
)}
|
||||||
"_blank",
|
</DropdownMenuGroup>
|
||||||
"noopener,noreferrer",
|
<DropdownMenuSeparator />
|
||||||
)
|
</DropdownMenuContent>
|
||||||
}
|
</DropdownMenu>
|
||||||
>
|
) : (
|
||||||
<ScrollTextIcon />
|
<SidebarMenuButton size="lg" className="pointer-events-none">
|
||||||
{logSystem.label || "日志系统"}
|
<NavMenuButtonContent isSidebarOpen={isSidebarOpen} t={t} />
|
||||||
</DropdownMenuItem>
|
</SidebarMenuButton>
|
||||||
)}
|
)}
|
||||||
</DropdownMenuGroup>
|
</SidebarMenuItem>
|
||||||
<DropdownMenuSeparator />
|
</SidebarMenu>
|
||||||
</DropdownMenuContent>
|
</>
|
||||||
</DropdownMenu>
|
);
|
||||||
) : (
|
}
|
||||||
<SidebarMenuButton size="lg" className="pointer-events-none">
|
|
||||||
<NavMenuButtonContent isSidebarOpen={isSidebarOpen} t={t} />
|
|
||||||
</SidebarMenuButton>
|
|
||||||
)}
|
|
||||||
</SidebarMenuItem>
|
|
||||||
</SidebarMenu>
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@@ -1,44 +1,118 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
import {
|
import {
|
||||||
Sidebar,
|
Sidebar,
|
||||||
SidebarContent,
|
SidebarHeader,
|
||||||
useSidebar,
|
SidebarContent,
|
||||||
} from "@/components/ui/sidebar";
|
SidebarFooter,
|
||||||
import { cn } from "@/lib/utils";
|
SidebarRail,
|
||||||
|
useSidebar,
|
||||||
import { CmChatSidebar } from "./cm-chat-sidebar";
|
} from "@/components/ui/sidebar";
|
||||||
|
import { useTheme } from "@/contexts/ThemeContext";
|
||||||
export function WorkspaceSidebar({
|
import { cn } from "@/lib/utils";
|
||||||
className,
|
import { usePathname } from "next/navigation";
|
||||||
compactChrome: _compactChrome,
|
|
||||||
...props
|
import { GeneralQaSidebar } from "./general-qa-sidebar";
|
||||||
}: React.ComponentProps<typeof Sidebar> & { compactChrome?: boolean }) {
|
import { RecentChatList } from "./recent-chat-list";
|
||||||
const { open: isSidebarOpen, toggleSidebar } = useSidebar();
|
import { RecentRoundtableList } from "./recent-roundtable-list";
|
||||||
|
import { RecentWritingList } from "./recent-writing-list";
|
||||||
return (
|
import { WorkspaceHeader } from "./workspace-header";
|
||||||
<div
|
import { WorkspaceNavChatList } from "./workspace-nav-chat-list";
|
||||||
aria-hidden={false}
|
import { WorkspaceNavMenu } from "./workspace-nav-menu";
|
||||||
className={cn(
|
|
||||||
"h-full shrink-0 overflow-hidden transition-[width] duration-200 ease-out",
|
export function WorkspaceSidebar({
|
||||||
isSidebarOpen ? "w-(--sidebar-width)" : "w-14",
|
compactChrome = false,
|
||||||
)}
|
className,
|
||||||
>
|
...props
|
||||||
<Sidebar
|
}: React.ComponentProps<typeof Sidebar> & { compactChrome?: boolean }) {
|
||||||
variant="sidebar"
|
const { open: isSidebarOpen } = useSidebar();
|
||||||
collapsible="none"
|
const { theme } = useTheme();
|
||||||
className={cn(
|
const pathname = usePathname();
|
||||||
"h-full border-r border-border",
|
const useWhiteSidebar = compactChrome && theme === "light";
|
||||||
isSidebarOpen ? "w-(--sidebar-width)" : "w-14",
|
// 通用问答（全量模式）左栏：新建回答 → 常用智能体 → 聊天记录（需求 0616 #1）。
|
||||||
"[&_[data-slot=sidebar-container]]:bg-white [&_[data-slot=sidebar-inner]]:bg-white",
|
// 仅在通用问答（/page/workspace/chats*）下启用三块式布局；点击常用智能体后是
|
||||||
className,
|
// 「原地嵌入」（停留在 /chats/new?agent=...，仅右侧问答区换成智能体对话），左侧栏不变。
|
||||||
)}
|
const isGeneralQa = pathname.startsWith("/page/workspace/chats");
|
||||||
{...props}
|
|
||||||
>
|
// 紧凑模式：用「外层定宽容器 + transition-[width]」做展开/收起过渡动画。
|
||||||
<SidebarContent>
|
// collapsible="none" 的 Sidebar 是普通 in-flow 定宽块（非 absolute，故不受本布局对
|
||||||
<CmChatSidebar onCollapse={toggleSidebar} collapsed={!isSidebarOpen} />
|
// sidebar-container 的 absolute/left-0 覆盖影响），外层 overflow-hidden 把它从
|
||||||
</SidebarContent>
|
// --sidebar-width 裁到 0、聊天区随宽度平滑回流；收起后整列不接收指针。
|
||||||
</Sidebar>
|
if (compactChrome) {
|
||||||
</div>
|
return (
|
||||||
);
|
<div
|
||||||
}
|
aria-hidden={!isSidebarOpen}
|
||||||
|
className={cn(
|
||||||
|
"h-full shrink-0 overflow-hidden transition-[width] duration-200 ease-out",
|
||||||
|
isSidebarOpen ? "w-(--sidebar-width)" : "w-0 pointer-events-none",
|
||||||
|
)}
|
||||||
|
>
|
||||||
|
<Sidebar
|
||||||
|
variant="sidebar"
|
||||||
|
collapsible="none"
|
||||||
|
className={cn(
|
||||||
|
"h-full w-(--sidebar-width) border-r border-border",
|
||||||
|
useWhiteSidebar &&
|
||||||
|
"[&_[data-slot=sidebar-inner]]:bg-white [&_[data-slot=sidebar-container]]:bg-white",
|
||||||
|
className,
|
||||||
|
)}
|
||||||
|
{...props}
|
||||||
|
>
|
||||||
|
<SidebarContent>
|
||||||
|
{isGeneralQa ? (
|
||||||
|
// 全量版通用问答（/page/workspace/chats*）：新建对话侧栏独立成
|
||||||
|
// GeneralQaSidebar（按 0616 样式参考图重画），与其余 workspace 页解耦。
|
||||||
|
<GeneralQaSidebar />
|
||||||
|
) : (
|
||||||
|
<>
|
||||||
|
<WorkspaceNavChatList showCollapseTrigger compact />
|
||||||
|
<RecentChatList compact />
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
</SidebarContent>
|
||||||
|
<SidebarRail />
|
||||||
|
</Sidebar>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Sidebar
|
||||||
|
variant="sidebar"
|
||||||
|
// 紧凑模式：展开时为固定宽度整列（none，无内置折叠），收起由上面的条件渲染处理；
|
||||||
|
// 非紧凑沿用 icon。
|
||||||
|
collapsible={compactChrome ? "none" : "icon"}
|
||||||
|
className={cn(
|
||||||
|
useWhiteSidebar &&
|
||||||
|
"[&_[data-slot=sidebar-inner]]:bg-white [&_[data-slot=sidebar-container]]:bg-white",
|
||||||
|
className,
|
||||||
|
)}
|
||||||
|
{...props}
|
||||||
|
>
|
||||||
|
{!compactChrome && (
|
||||||
|
<SidebarHeader className="py-0">
|
||||||
|
<WorkspaceHeader />
|
||||||
|
</SidebarHeader>
|
||||||
|
)}
|
||||||
|
<SidebarContent>
|
||||||
|
<WorkspaceNavChatList
|
||||||
|
showCollapseTrigger={compactChrome}
|
||||||
|
compact={compactChrome}
|
||||||
|
/>
|
||||||
|
{isSidebarOpen && <RecentChatList compact={compactChrome} />}
|
||||||
|
{/* 「多智能体会商」「最近写作」与「智能体/技能」等菜单项保持一致的显隐：
|
||||||
|
仅在非紧凑模式(!compactChrome)下展示，紧凑模式（有外层页面侧栏时）一并隐藏。 */}
|
||||||
|
{isSidebarOpen && !compactChrome && <RecentRoundtableList />}
|
||||||
|
{isSidebarOpen && !compactChrome && <RecentWritingList />}
|
||||||
|
</SidebarContent>
|
||||||
|
{!compactChrome && (
|
||||||
|
<SidebarFooter>
|
||||||
|
<WorkspaceNavMenu />
|
||||||
|
</SidebarFooter>
|
||||||
|
)}
|
||||||
|
<SidebarRail />
|
||||||
|
</Sidebar>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
@@ -1,159 +0,0 @@
|
|||||||
import { apiFetch } from "@/core/api";
|
|
||||||
import { getBackendBaseURL } from "@/core/config";
|
|
||||||
import { OptType, writeYLog } from "@/core/log/y-log";
|
|
||||||
|
|
||||||
/** One in-flight model run as seen by the admin concurrency monitor. */
|
|
||||||
export interface ActiveRunItem {
|
|
||||||
run_id: string;
|
|
||||||
thread_id: string;
|
|
||||||
status: string;
|
|
||||||
created_at: string;
|
|
||||||
elapsed_seconds: number;
|
|
||||||
user_id: string;
|
|
||||||
user_name: string;
|
|
||||||
agent_id: string;
|
|
||||||
agent_name: string;
|
|
||||||
thread_title: string;
|
|
||||||
kind: string;
|
|
||||||
multitask_strategy: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
export interface ActiveRunsResponse {
|
|
||||||
count: number;
|
|
||||||
server_time: string;
|
|
||||||
runs: ActiveRunItem[];
|
|
||||||
}
|
|
||||||
|
|
||||||
export interface ConcurrencyPoint {
|
|
||||||
bucket: string;
|
|
||||||
peak: number;
|
|
||||||
avg: number;
|
|
||||||
samples: number;
|
|
||||||
}
|
|
||||||
|
|
||||||
export interface ConcurrencySeriesResponse {
|
|
||||||
granularity: string;
|
|
||||||
since: string;
|
|
||||||
until: string;
|
|
||||||
enabled: boolean;
|
|
||||||
points: ConcurrencyPoint[];
|
|
||||||
}
|
|
||||||
|
|
||||||
export interface TokenSpeedPoint {
|
|
||||||
bucket: string;
|
|
||||||
avg_tokens_per_sec: number;
|
|
||||||
min_tokens_per_sec: number;
|
|
||||||
max_tokens_per_sec: number;
|
|
||||||
samples: number;
|
|
||||||
}
|
|
||||||
|
|
||||||
export interface TokenSpeedSeriesResponse {
|
|
||||||
granularity: string;
|
|
||||||
since: string;
|
|
||||||
until: string;
|
|
||||||
points: TokenSpeedPoint[];
|
|
||||||
}
|
|
||||||
|
|
||||||
export type Granularity = "minute" | "hour";
|
|
||||||
|
|
||||||
const base = () => `${getBackendBaseURL()}/api/admin/active-runs`;
|
|
||||||
|
|
||||||
async function parse<T>(res: Response, what: string): Promise<T> {
|
|
||||||
if (!res.ok) {
|
|
||||||
const err = (await res.json().catch(() => ({}))) as { detail?: string };
|
|
||||||
throw new Error(err.detail ?? `${what} (HTTP ${res.status})`);
|
|
||||||
}
|
|
||||||
return res.json() as Promise<T>;
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Live snapshot of all in-flight runs. Polled — intentionally NOT y-logged. */
|
|
||||||
export async function loadActiveRuns(): Promise<ActiveRunsResponse> {
|
|
||||||
return parse<ActiveRunsResponse>(await apiFetch(base()), "Failed to load active runs");
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Concurrency time-series (peak/avg per minute|hour). Polled — not y-logged. */
|
|
||||||
export async function loadConcurrencySeries(
|
|
||||||
granularity: Granularity,
|
|
||||||
hours?: number,
|
|
||||||
): Promise<ConcurrencySeriesResponse> {
|
|
||||||
const params = new URLSearchParams({ granularity });
|
|
||||||
if (hours) params.set("hours", String(hours));
|
|
||||||
return parse<ConcurrencySeriesResponse>(
|
|
||||||
await apiFetch(`${base()}/concurrency?${params}`),
|
|
||||||
"Failed to load concurrency series",
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Token-speed time-series (tokens/sec per minute|hour). Polled — not y-logged. */
|
|
||||||
export async function loadTokenSpeedSeries(
|
|
||||||
granularity: Granularity,
|
|
||||||
hours?: number,
|
|
||||||
): Promise<TokenSpeedSeriesResponse> {
|
|
||||||
const params = new URLSearchParams({ granularity });
|
|
||||||
if (hours) params.set("hours", String(hours));
|
|
||||||
return parse<TokenSpeedSeriesResponse>(
|
|
||||||
await apiFetch(`${base()}/token-speed?${params}`),
|
|
||||||
"Failed to load token speed series",
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Truly stop one in-flight run (cancels the live model stream). */
|
|
||||||
export async function cancelActiveRun(runId: string): Promise<{ run_id: string; cancelled: boolean }> {
|
|
||||||
const url = `${base()}/${encodeURIComponent(runId)}/cancel`;
|
|
||||||
const result = await parse<{ run_id: string; cancelled: boolean }>(
|
|
||||||
await apiFetch(url, { method: "POST" }),
|
|
||||||
"Failed to cancel run",
|
|
||||||
);
|
|
||||||
writeYLog({
|
|
||||||
optType: OptType.other,
|
|
||||||
optDetail: "CM助手-全量-并发监控-停止对话调用",
|
|
||||||
url,
|
|
||||||
reqParam: { runId },
|
|
||||||
returnParam: result,
|
|
||||||
});
|
|
||||||
return result;
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Stop every in-flight run at once. */
|
|
||||||
export async function cancelAllActiveRuns(): Promise<{ cancelled_count: number }> {
|
|
||||||
const url = `${base()}/cancel-all`;
|
|
||||||
const result = await parse<{ cancelled_count: number }>(
|
|
||||||
await apiFetch(url, { method: "POST" }),
|
|
||||||
"Failed to cancel all runs",
|
|
||||||
);
|
|
||||||
writeYLog({
|
|
||||||
optType: OptType.other,
|
|
||||||
optDetail: "CM助手-全量-并发监控-全部停止",
|
|
||||||
url,
|
|
||||||
returnParam: result,
|
|
||||||
});
|
|
||||||
return result;
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Read the background-sampler on/off switch. */
|
|
||||||
export async function getMonitorSettings(): Promise<{ enabled: boolean }> {
|
|
||||||
return parse<{ enabled: boolean }>(
|
|
||||||
await apiFetch(`${base()}/settings`),
|
|
||||||
"Failed to load monitor settings",
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
/** Toggle the background concurrency sampler (admin only, no restart). */
|
|
||||||
export async function updateMonitorSettings(enabled: boolean): Promise<{ enabled: boolean }> {
|
|
||||||
const url = `${base()}/settings`;
|
|
||||||
const result = await parse<{ enabled: boolean }>(
|
|
||||||
await apiFetch(url, {
|
|
||||||
method: "PUT",
|
|
||||||
headers: { "Content-Type": "application/json" },
|
|
||||||
body: JSON.stringify({ enabled }),
|
|
||||||
}),
|
|
||||||
"Failed to update monitor settings",
|
|
||||||
);
|
|
||||||
writeYLog({
|
|
||||||
optType: enabled ? OptType.enabled : OptType.disabled,
|
|
||||||
optDetail: `CM助手-全量-并发监控-${enabled ? "开启" : "关闭"}采样`,
|
|
||||||
url,
|
|
||||||
reqParam: { enabled },
|
|
||||||
});
|
|
||||||
return result;
|
|
||||||
}
|
|
||||||
@@ -1,6 +1,5 @@
|
|||||||
import { apiFetch } from "@/core/api";
|
import { apiFetch } from "@/core/api";
|
||||||
import { getBackendBaseURL } from "@/core/config";
|
import { getBackendBaseURL } from "@/core/config";
|
||||||
import { OptType, writeYLog } from "@/core/log/y-log";
|
|
||||||
|
|
||||||
/** A conversation thread owned by some user (admin view). */
|
/** A conversation thread owned by some user (admin view). */
|
||||||
export interface AdminThread {
|
export interface AdminThread {
|
||||||
@@ -173,32 +172,22 @@ async function parse<T>(res: Response, what: string): Promise<T> {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export async function listUserThreads(userId: string): Promise<AdminThread[]> {
|
export async function listUserThreads(userId: string): Promise<AdminThread[]> {
|
||||||
const url = `${base()}/${encodeURIComponent(userId)}/threads?limit=200`;
|
return parse(
|
||||||
const result = await parse<AdminThread[]>(await apiFetch(url), "Failed to load threads");
|
await apiFetch(`${base()}/${encodeURIComponent(userId)}/threads?limit=200`),
|
||||||
writeYLog({
|
"Failed to load threads",
|
||||||
optType: OptType.search,
|
);
|
||||||
optDetail: "CM助手-全量-管理后台-查询用户会话列表",
|
|
||||||
url,
|
|
||||||
reqParam: { userId },
|
|
||||||
returnParam: { count: result.length },
|
|
||||||
});
|
|
||||||
return result;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function listUserThreadMessages(
|
export async function listUserThreadMessages(
|
||||||
userId: string,
|
userId: string,
|
||||||
threadId: string,
|
threadId: string,
|
||||||
): Promise<AdminMessage[]> {
|
): Promise<AdminMessage[]> {
|
||||||
const url = `${base()}/${encodeURIComponent(userId)}/threads/${encodeURIComponent(threadId)}/messages`;
|
return parse(
|
||||||
const result = await parse<AdminMessage[]>(await apiFetch(url), "Failed to load messages");
|
await apiFetch(
|
||||||
writeYLog({
|
`${base()}/${encodeURIComponent(userId)}/threads/${encodeURIComponent(threadId)}/messages`,
|
||||||
optType: OptType.view,
|
),
|
||||||
optDetail: "CM助手-全量-管理后台-查看会话消息",
|
"Failed to load messages",
|
||||||
url,
|
);
|
||||||
reqParam: { userId, threadId },
|
|
||||||
returnParam: { count: result.length },
|
|
||||||
});
|
|
||||||
return result;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function listUserQa(
|
export async function listUserQa(
|
||||||
@@ -211,30 +200,19 @@ export async function listUserQa(
|
|||||||
});
|
});
|
||||||
const query = (params.q ?? "").trim();
|
const query = (params.q ?? "").trim();
|
||||||
if (query) search.set("q", query);
|
if (query) search.set("q", query);
|
||||||
const url = `${base()}/${encodeURIComponent(userId)}/qa?${search}`;
|
return parse(
|
||||||
const result = await parse<AdminUserQaPageResponse>(await apiFetch(url), "Failed to load user Q&A");
|
await apiFetch(`${base()}/${encodeURIComponent(userId)}/qa?${search}`),
|
||||||
writeYLog({
|
"Failed to load user Q&A",
|
||||||
optType: OptType.search,
|
);
|
||||||
optDetail: "CM助手-全量-管理后台-查询用户问答",
|
|
||||||
url,
|
|
||||||
reqParam: { userId, ...params },
|
|
||||||
returnParam: { total: result.total, count: result.items.length },
|
|
||||||
});
|
|
||||||
return result;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function getUserMemory(
|
export async function getUserMemory(
|
||||||
userId: string,
|
userId: string,
|
||||||
): Promise<AdminMemoryResponse> {
|
): Promise<AdminMemoryResponse> {
|
||||||
const url = `${base()}/${encodeURIComponent(userId)}/memory`;
|
return parse(
|
||||||
const result = await parse<AdminMemoryResponse>(await apiFetch(url), "Failed to load memory");
|
await apiFetch(`${base()}/${encodeURIComponent(userId)}/memory`),
|
||||||
writeYLog({
|
"Failed to load memory",
|
||||||
optType: OptType.view,
|
);
|
||||||
optDetail: "CM助手-全量-管理后台-查看用户记忆",
|
|
||||||
url,
|
|
||||||
reqParam: { userId },
|
|
||||||
});
|
|
||||||
return result;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function getUserLeaderboard(
|
export async function getUserLeaderboard(
|
||||||
@@ -251,15 +229,10 @@ export async function getUserLeaderboard(
|
|||||||
until: range.until,
|
until: range.until,
|
||||||
limit: String(limit),
|
limit: String(limit),
|
||||||
});
|
});
|
||||||
const url = `${base()}/leaderboard?${params}`;
|
return parse(
|
||||||
const result = await parse<AdminLeaderboardResponse>(await apiFetch(url), "Failed to load leaderboard");
|
await apiFetch(`${base()}/leaderboard?${params}`),
|
||||||
writeYLog({
|
"Failed to load leaderboard",
|
||||||
optType: OptType.search,
|
);
|
||||||
optDetail: "CM助手-全量-管理后台-查询用户排行榜",
|
|
||||||
url,
|
|
||||||
reqParam: { ...range, limit },
|
|
||||||
});
|
|
||||||
return result;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -280,18 +253,12 @@ export async function refreshTodayLeaderboard(
|
|||||||
until: range.until,
|
until: range.until,
|
||||||
limit: String(limit),
|
limit: String(limit),
|
||||||
});
|
});
|
||||||
const url = `${base()}/leaderboard/refresh-today?${params}`;
|
return parse(
|
||||||
const result = await parse<AdminLeaderboardResponse>(
|
await apiFetch(`${base()}/leaderboard/refresh-today?${params}`, {
|
||||||
await apiFetch(url, { method: "POST" }),
|
method: "POST",
|
||||||
|
}),
|
||||||
"Failed to refresh today's leaderboard",
|
"Failed to refresh today's leaderboard",
|
||||||
);
|
);
|
||||||
writeYLog({
|
|
||||||
optType: OptType.other,
|
|
||||||
optDetail: "CM助手-全量-管理后台-刷新今日排行榜",
|
|
||||||
url,
|
|
||||||
reqParam: { ...range, limit },
|
|
||||||
});
|
|
||||||
return result;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function getUserAnalytics(
|
export async function getUserAnalytics(
|
||||||
@@ -305,15 +272,10 @@ export async function getUserAnalytics(
|
|||||||
until: range.until,
|
until: range.until,
|
||||||
limit: String(limit),
|
limit: String(limit),
|
||||||
});
|
});
|
||||||
const url = `${base()}/${encodeURIComponent(userId)}/analytics?${params}`;
|
return parse(
|
||||||
const result = await parse<AdminUserAnalyticsResponse>(await apiFetch(url), "Failed to load user analytics");
|
await apiFetch(`${base()}/${encodeURIComponent(userId)}/analytics?${params}`),
|
||||||
writeYLog({
|
"Failed to load user analytics",
|
||||||
optType: OptType.view,
|
);
|
||||||
optDetail: "CM助手-全量-管理后台-查看用户分析",
|
|
||||||
url,
|
|
||||||
reqParam: { userId, ...range, limit },
|
|
||||||
});
|
|
||||||
return result;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function generateUserLeaderboardReport(
|
export async function generateUserLeaderboardReport(
|
||||||
@@ -328,19 +290,12 @@ export async function generateUserLeaderboardReport(
|
|||||||
limit: String(limit),
|
limit: String(limit),
|
||||||
});
|
});
|
||||||
if (modelName) params.set("model_name", modelName);
|
if (modelName) params.set("model_name", modelName);
|
||||||
const url = `${base()}/leaderboard/report?${params}`;
|
return parse(
|
||||||
const result = await parse<AdminLeaderboardReportResponse>(
|
await apiFetch(`${base()}/leaderboard/report?${params}`, {
|
||||||
await apiFetch(url, { method: "POST" }),
|
method: "POST",
|
||||||
|
}),
|
||||||
"Failed to generate leaderboard report",
|
"Failed to generate leaderboard report",
|
||||||
);
|
);
|
||||||
writeYLog({
|
|
||||||
optType: OptType.other,
|
|
||||||
optDetail: "CM助手-全量-管理后台-生成排行榜报告",
|
|
||||||
url,
|
|
||||||
reqParam: { ...range, limit, modelName },
|
|
||||||
returnParam: { generated_at: result.generated_at, model_name: result.model_name },
|
|
||||||
});
|
|
||||||
return result;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function parseSseFrame(frame: string): AdminLeaderboardReportStreamEvent | null {
|
function parseSseFrame(frame: string): AdminLeaderboardReportStreamEvent | null {
|
||||||
@@ -380,8 +335,7 @@ export async function streamUserLeaderboardReport({
|
|||||||
limit: String(limit),
|
limit: String(limit),
|
||||||
});
|
});
|
||||||
if (modelName) params.set("model_name", modelName);
|
if (modelName) params.set("model_name", modelName);
|
||||||
const url = `${base()}/leaderboard/report/stream?${params}`;
|
const response = await apiFetch(`${base()}/leaderboard/report/stream?${params}`, {
|
||||||
const response = await apiFetch(url, {
|
|
||||||
method: "POST",
|
method: "POST",
|
||||||
signal,
|
signal,
|
||||||
});
|
});
|
||||||
@@ -412,12 +366,6 @@ export async function streamUserLeaderboardReport({
|
|||||||
const parsed = parseSseFrame(tail);
|
const parsed = parseSseFrame(tail);
|
||||||
if (parsed) onEvent(parsed);
|
if (parsed) onEvent(parsed);
|
||||||
}
|
}
|
||||||
writeYLog({
|
|
||||||
optType: OptType.other,
|
|
||||||
optDetail: "CM助手-全量-管理后台-流式生成排行榜报告",
|
|
||||||
url,
|
|
||||||
reqParam: { ...range, limit, modelName },
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function addAdminMemoryEntry(
|
export async function addAdminMemoryEntry(
|
||||||
@@ -425,22 +373,14 @@ export async function addAdminMemoryEntry(
|
|||||||
content: string,
|
content: string,
|
||||||
agent: string | null,
|
agent: string | null,
|
||||||
): Promise<AdminMemoryBucket> {
|
): Promise<AdminMemoryBucket> {
|
||||||
const url = `${base()}/${encodeURIComponent(userId)}/memory/entries`;
|
return parse(
|
||||||
const result = await parse<AdminMemoryBucket>(
|
await apiFetch(`${base()}/${encodeURIComponent(userId)}/memory/entries`, {
|
||||||
await apiFetch(url, {
|
|
||||||
method: "POST",
|
method: "POST",
|
||||||
headers: { "Content-Type": "application/json" },
|
headers: { "Content-Type": "application/json" },
|
||||||
body: JSON.stringify({ content, agent }),
|
body: JSON.stringify({ content, agent }),
|
||||||
}),
|
}),
|
||||||
"Failed to add memory entry",
|
"Failed to add memory entry",
|
||||||
);
|
);
|
||||||
writeYLog({
|
|
||||||
optType: OptType.create,
|
|
||||||
optDetail: "CM助手-全量-管理后台-新增记忆条目",
|
|
||||||
url,
|
|
||||||
reqParam: { userId, content, agent },
|
|
||||||
});
|
|
||||||
return result;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function replaceAdminMemoryEntry(
|
export async function replaceAdminMemoryEntry(
|
||||||
@@ -449,22 +389,14 @@ export async function replaceAdminMemoryEntry(
|
|||||||
content: string,
|
content: string,
|
||||||
agent: string | null,
|
agent: string | null,
|
||||||
): Promise<AdminMemoryBucket> {
|
): Promise<AdminMemoryBucket> {
|
||||||
const url = `${base()}/${encodeURIComponent(userId)}/memory/entries`;
|
return parse(
|
||||||
const result = await parse<AdminMemoryBucket>(
|
await apiFetch(`${base()}/${encodeURIComponent(userId)}/memory/entries`, {
|
||||||
await apiFetch(url, {
|
|
||||||
method: "PUT",
|
method: "PUT",
|
||||||
headers: { "Content-Type": "application/json" },
|
headers: { "Content-Type": "application/json" },
|
||||||
body: JSON.stringify({ old_text: oldText, content, agent }),
|
body: JSON.stringify({ old_text: oldText, content, agent }),
|
||||||
}),
|
}),
|
||||||
"Failed to replace memory entry",
|
"Failed to replace memory entry",
|
||||||
);
|
);
|
||||||
writeYLog({
|
|
||||||
optType: OptType.edit,
|
|
||||||
optDetail: "CM助手-全量-管理后台-编辑记忆条目",
|
|
||||||
url,
|
|
||||||
reqParam: { userId, old_text: oldText, content, agent },
|
|
||||||
});
|
|
||||||
return result;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function deleteAdminMemoryEntry(
|
export async function deleteAdminMemoryEntry(
|
||||||
@@ -474,18 +406,13 @@ export async function deleteAdminMemoryEntry(
|
|||||||
): Promise<AdminMemoryBucket> {
|
): Promise<AdminMemoryBucket> {
|
||||||
const params = new URLSearchParams({ old_text: oldText });
|
const params = new URLSearchParams({ old_text: oldText });
|
||||||
if (agent) params.set("agent", agent);
|
if (agent) params.set("agent", agent);
|
||||||
const url = `${base()}/${encodeURIComponent(userId)}/memory/entries?${params}`;
|
return parse(
|
||||||
const result = await parse<AdminMemoryBucket>(
|
await apiFetch(
|
||||||
await apiFetch(url, { method: "DELETE" }),
|
`${base()}/${encodeURIComponent(userId)}/memory/entries?${params}`,
|
||||||
|
{ method: "DELETE" },
|
||||||
|
),
|
||||||
"Failed to delete memory entry",
|
"Failed to delete memory entry",
|
||||||
);
|
);
|
||||||
writeYLog({
|
|
||||||
optType: OptType.delete,
|
|
||||||
optDetail: "CM助手-全量-管理后台-删除记忆条目",
|
|
||||||
url,
|
|
||||||
reqParam: { userId, old_text: oldText, agent },
|
|
||||||
});
|
|
||||||
return result;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// ── V1 Memory CRUD ──────────────────────────────────────────────────────────
|
// ── V1 Memory CRUD ──────────────────────────────────────────────────────────
|
||||||
@@ -497,22 +424,14 @@ export async function updateAdminV1Section(
|
|||||||
summary: string,
|
summary: string,
|
||||||
agent: string | null,
|
agent: string | null,
|
||||||
): Promise<AdminMemoryBucket> {
|
): Promise<AdminMemoryBucket> {
|
||||||
const url = `${base()}/${encodeURIComponent(userId)}/memory/v1/sections`;
|
return parse(
|
||||||
const result = await parse<AdminMemoryBucket>(
|
await apiFetch(`${base()}/${encodeURIComponent(userId)}/memory/v1/sections`, {
|
||||||
await apiFetch(url, {
|
|
||||||
method: "PUT",
|
method: "PUT",
|
||||||
headers: { "Content-Type": "application/json" },
|
headers: { "Content-Type": "application/json" },
|
||||||
body: JSON.stringify({ section_type: sectionType, field, summary, agent }),
|
body: JSON.stringify({ section_type: sectionType, field, summary, agent }),
|
||||||
}),
|
}),
|
||||||
"Failed to update V1 section",
|
"Failed to update V1 section",
|
||||||
);
|
);
|
||||||
writeYLog({
|
|
||||||
optType: OptType.edit,
|
|
||||||
optDetail: "CM助手-全量-管理后台-编辑记忆段落",
|
|
||||||
url,
|
|
||||||
reqParam: { userId, section_type: sectionType, field, summary, agent },
|
|
||||||
});
|
|
||||||
return result;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function addAdminV1Fact(
|
export async function addAdminV1Fact(
|
||||||
@@ -522,22 +441,14 @@ export async function addAdminV1Fact(
|
|||||||
confidence: number,
|
confidence: number,
|
||||||
agent: string | null,
|
agent: string | null,
|
||||||
): Promise<AdminMemoryBucket> {
|
): Promise<AdminMemoryBucket> {
|
||||||
const url = `${base()}/${encodeURIComponent(userId)}/memory/v1/facts`;
|
return parse(
|
||||||
const result = await parse<AdminMemoryBucket>(
|
await apiFetch(`${base()}/${encodeURIComponent(userId)}/memory/v1/facts`, {
|
||||||
await apiFetch(url, {
|
|
||||||
method: "POST",
|
method: "POST",
|
||||||
headers: { "Content-Type": "application/json" },
|
headers: { "Content-Type": "application/json" },
|
||||||
body: JSON.stringify({ content, category, confidence, agent }),
|
body: JSON.stringify({ content, category, confidence, agent }),
|
||||||
}),
|
}),
|
||||||
"Failed to add V1 fact",
|
"Failed to add V1 fact",
|
||||||
);
|
);
|
||||||
writeYLog({
|
|
||||||
optType: OptType.create,
|
|
||||||
optDetail: "CM助手-全量-管理后台-新增记忆事实",
|
|
||||||
url,
|
|
||||||
reqParam: { userId, content, category, confidence, agent },
|
|
||||||
});
|
|
||||||
return result;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function updateAdminV1Fact(
|
export async function updateAdminV1Fact(
|
||||||
@@ -546,22 +457,14 @@ export async function updateAdminV1Fact(
|
|||||||
updates: { content?: string; category?: string; confidence?: number },
|
updates: { content?: string; category?: string; confidence?: number },
|
||||||
agent: string | null,
|
agent: string | null,
|
||||||
): Promise<AdminMemoryBucket> {
|
): Promise<AdminMemoryBucket> {
|
||||||
const url = `${base()}/${encodeURIComponent(userId)}/memory/v1/facts/${encodeURIComponent(factId)}`;
|
return parse(
|
||||||
const result = await parse<AdminMemoryBucket>(
|
await apiFetch(`${base()}/${encodeURIComponent(userId)}/memory/v1/facts/${encodeURIComponent(factId)}`, {
|
||||||
await apiFetch(url, {
|
|
||||||
method: "PUT",
|
method: "PUT",
|
||||||
headers: { "Content-Type": "application/json" },
|
headers: { "Content-Type": "application/json" },
|
||||||
body: JSON.stringify({ ...updates, agent }),
|
body: JSON.stringify({ ...updates, agent }),
|
||||||
}),
|
}),
|
||||||
"Failed to update V1 fact",
|
"Failed to update V1 fact",
|
||||||
);
|
);
|
||||||
writeYLog({
|
|
||||||
optType: OptType.edit,
|
|
||||||
optDetail: "CM助手-全量-管理后台-编辑记忆事实",
|
|
||||||
url,
|
|
||||||
reqParam: { userId, factId, ...updates, agent },
|
|
||||||
});
|
|
||||||
return result;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function deleteAdminV1Fact(
|
export async function deleteAdminV1Fact(
|
||||||
@@ -572,16 +475,11 @@ export async function deleteAdminV1Fact(
|
|||||||
const params = new URLSearchParams();
|
const params = new URLSearchParams();
|
||||||
if (agent) params.set("agent", agent);
|
if (agent) params.set("agent", agent);
|
||||||
const qs = params.toString() ? `?${params}` : "";
|
const qs = params.toString() ? `?${params}` : "";
|
||||||
const url = `${base()}/${encodeURIComponent(userId)}/memory/v1/facts/${encodeURIComponent(factId)}${qs}`;
|
return parse(
|
||||||
const result = await parse<AdminMemoryBucket>(
|
await apiFetch(
|
||||||
await apiFetch(url, { method: "DELETE" }),
|
`${base()}/${encodeURIComponent(userId)}/memory/v1/facts/${encodeURIComponent(factId)}${qs}`,
|
||||||
|
{ method: "DELETE" },
|
||||||
|
),
|
||||||
"Failed to delete V1 fact",
|
"Failed to delete V1 fact",
|
||||||
);
|
);
|
||||||
writeYLog({
|
|
||||||
optType: OptType.delete,
|
|
||||||
optDetail: "CM助手-全量-管理后台-删除记忆事实",
|
|
||||||
url,
|
|
||||||
reqParam: { userId, factId, agent },
|
|
||||||
});
|
|
||||||
return result;
|
|
||||||
}
|
}
|
||||||
@@ -17,96 +17,6 @@ import {
|
|||||||
updateAdminV1Fact,
|
updateAdminV1Fact,
|
||||||
updateAdminV1Section,
|
updateAdminV1Section,
|
||||||
} from "./api";
|
} from "./api";
|
||||||
import {
|
|
||||||
cancelActiveRun,
|
|
||||||
cancelAllActiveRuns,
|
|
||||||
getMonitorSettings,
|
|
||||||
loadActiveRuns,
|
|
||||||
loadConcurrencySeries,
|
|
||||||
loadTokenSpeedSeries,
|
|
||||||
updateMonitorSettings,
|
|
||||||
type Granularity,
|
|
||||||
} from "./active-runs";
|
|
||||||
|
|
||||||
// ── 实时并发监控 (admin) ─────────────────────────────────────────────────────
|
|
||||||
|
|
||||||
/** Live snapshot of in-flight runs. Polls every `intervalMs` while `enabled`. */
|
|
||||||
export function useActiveRuns(enabled = true, intervalMs = 4000) {
|
|
||||||
return useQuery({
|
|
||||||
queryKey: ["admin-active-runs", "live"],
|
|
||||||
queryFn: loadActiveRuns,
|
|
||||||
enabled,
|
|
||||||
refetchInterval: enabled ? intervalMs : false,
|
|
||||||
refetchOnWindowFocus: false,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/** 并发量时序 (peak/avg per minute|hour). */
|
|
||||||
export function useConcurrencySeries(
|
|
||||||
granularity: Granularity,
|
|
||||||
hours: number | undefined,
|
|
||||||
enabled = true,
|
|
||||||
intervalMs = 15000,
|
|
||||||
) {
|
|
||||||
return useQuery({
|
|
||||||
queryKey: ["admin-active-runs", "concurrency", granularity, hours ?? null],
|
|
||||||
queryFn: () => loadConcurrencySeries(granularity, hours),
|
|
||||||
enabled,
|
|
||||||
refetchInterval: enabled ? intervalMs : false,
|
|
||||||
refetchOnWindowFocus: false,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/** 大模型 token 出字速度时序 (tokens/sec per minute|hour). */
|
|
||||||
export function useTokenSpeedSeries(
|
|
||||||
granularity: Granularity,
|
|
||||||
hours: number | undefined,
|
|
||||||
enabled = true,
|
|
||||||
intervalMs = 15000,
|
|
||||||
) {
|
|
||||||
return useQuery({
|
|
||||||
queryKey: ["admin-active-runs", "token-speed", granularity, hours ?? null],
|
|
||||||
queryFn: () => loadTokenSpeedSeries(granularity, hours),
|
|
||||||
enabled,
|
|
||||||
refetchInterval: enabled ? intervalMs : false,
|
|
||||||
refetchOnWindowFocus: false,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
export function useCancelActiveRun() {
|
|
||||||
const qc = useQueryClient();
|
|
||||||
return useMutation({
|
|
||||||
mutationFn: (runId: string) => cancelActiveRun(runId),
|
|
||||||
onSuccess: () => qc.invalidateQueries({ queryKey: ["admin-active-runs", "live"] }),
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
export function useCancelAllActiveRuns() {
|
|
||||||
const qc = useQueryClient();
|
|
||||||
return useMutation({
|
|
||||||
mutationFn: () => cancelAllActiveRuns(),
|
|
||||||
onSuccess: () => qc.invalidateQueries({ queryKey: ["admin-active-runs", "live"] }),
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
export function useMonitorSettings(enabled = true) {
|
|
||||||
return useQuery({
|
|
||||||
queryKey: ["admin-active-runs", "settings"],
|
|
||||||
queryFn: getMonitorSettings,
|
|
||||||
enabled,
|
|
||||||
refetchOnWindowFocus: false,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
export function useUpdateMonitorSettings() {
|
|
||||||
const qc = useQueryClient();
|
|
||||||
return useMutation({
|
|
||||||
mutationFn: (nextEnabled: boolean) => updateMonitorSettings(nextEnabled),
|
|
||||||
onSuccess: (data) => {
|
|
||||||
qc.setQueryData(["admin-active-runs", "settings"], data);
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
export function useUserLeaderboard(
|
export function useUserLeaderboard(
|
||||||
range: {
|
range: {
|
||||||
|
|||||||
@@ -1,6 +1,5 @@
|
|||||||
import { getBackendBaseURL } from "@/core/config";
|
import { getBackendBaseURL } from "@/core/config";
|
||||||
import { apiFetch } from "@/core/api";
|
import { apiFetch } from "@/core/api";
|
||||||
import { OptType, writeYLog } from "@/core/log/y-log";
|
|
||||||
|
|
||||||
import type {
|
import type {
|
||||||
Agent,
|
Agent,
|
||||||
@@ -59,13 +58,6 @@ export async function listAgents(params: ListAgentsParams = {}): Promise<Agent[]
|
|||||||
);
|
);
|
||||||
if (!res.ok) throw new Error(`Failed to load agents: ${res.statusText}`);
|
if (!res.ok) throw new Error(`Failed to load agents: ${res.statusText}`);
|
||||||
const data = (await res.json()) as { agents: Agent[] };
|
const data = (await res.json()) as { agents: Agent[] };
|
||||||
writeYLog({
|
|
||||||
optType: OptType.search,
|
|
||||||
optDetail: "CM助手-全量-智能体列表",
|
|
||||||
url: `/api/agents${query ? `?${query}` : ""}`,
|
|
||||||
reqParam: params,
|
|
||||||
returnParam: data.agents,
|
|
||||||
});
|
|
||||||
return data.agents;
|
return data.agents;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -84,20 +76,12 @@ export async function listAgentsPaginated(
|
|||||||
page?: number;
|
page?: number;
|
||||||
page_size?: number;
|
page_size?: number;
|
||||||
};
|
};
|
||||||
const result: PaginatedAgents = {
|
return {
|
||||||
agents: data.agents,
|
agents: data.agents,
|
||||||
total: data.total ?? data.agents.length,
|
total: data.total ?? data.agents.length,
|
||||||
page: data.page ?? params.page ?? 1,
|
page: data.page ?? params.page ?? 1,
|
||||||
pageSize: data.page_size ?? params.pageSize ?? data.agents.length,
|
pageSize: data.page_size ?? params.pageSize ?? data.agents.length,
|
||||||
};
|
};
|
||||||
writeYLog({
|
|
||||||
optType: OptType.search,
|
|
||||||
optDetail: "CM助手-全量-智能体列表",
|
|
||||||
url: `/api/agents${query ? `?${query}` : ""}`,
|
|
||||||
reqParam: params,
|
|
||||||
returnParam: result,
|
|
||||||
});
|
|
||||||
return result;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function listAllAgentsAdmin(): Promise<Agent[]> {
|
export async function listAllAgentsAdmin(): Promise<Agent[]> {
|
||||||
@@ -107,27 +91,13 @@ export async function listAllAgentsAdmin(): Promise<Agent[]> {
|
|||||||
throw new Error(err.detail ?? `Failed to load agents: ${res.statusText}`);
|
throw new Error(err.detail ?? `Failed to load agents: ${res.statusText}`);
|
||||||
}
|
}
|
||||||
const data = (await res.json()) as { agents: Agent[] };
|
const data = (await res.json()) as { agents: Agent[] };
|
||||||
writeYLog({
|
|
||||||
optType: OptType.search,
|
|
||||||
optDetail: "CM助手-全量-智能体列表",
|
|
||||||
url: `/api/agents?admin=true`,
|
|
||||||
returnParam: data.agents,
|
|
||||||
});
|
|
||||||
return data.agents;
|
return data.agents;
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function getAgent(id: string): Promise<Agent> {
|
export async function getAgent(id: string): Promise<Agent> {
|
||||||
const res = await apiFetch(`${getBackendBaseURL()}/api/agents/${id}`);
|
const res = await apiFetch(`${getBackendBaseURL()}/api/agents/${id}`);
|
||||||
if (!res.ok) throw new Error(`Agent '${id}' not found`);
|
if (!res.ok) throw new Error(`Agent '${id}' not found`);
|
||||||
const agent = (await res.json()) as Agent;
|
return res.json() as Promise<Agent>;
|
||||||
writeYLog({
|
|
||||||
optType: OptType.view,
|
|
||||||
optDetail: "CM助手-全量-智能体-查看",
|
|
||||||
url: `/api/agents/${id}`,
|
|
||||||
reqParam: { id },
|
|
||||||
returnParam: agent,
|
|
||||||
});
|
|
||||||
return agent;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function createAgent(request: CreateAgentRequest): Promise<Agent> {
|
export async function createAgent(request: CreateAgentRequest): Promise<Agent> {
|
||||||
@@ -140,15 +110,7 @@ export async function createAgent(request: CreateAgentRequest): Promise<Agent> {
|
|||||||
const err = (await res.json().catch(() => ({}))) as { detail?: string };
|
const err = (await res.json().catch(() => ({}))) as { detail?: string };
|
||||||
throw new Error(err.detail ?? `Failed to create agent: ${res.statusText}`);
|
throw new Error(err.detail ?? `Failed to create agent: ${res.statusText}`);
|
||||||
}
|
}
|
||||||
const created = (await res.json()) as Agent;
|
return res.json() as Promise<Agent>;
|
||||||
writeYLog({
|
|
||||||
optType: OptType.create,
|
|
||||||
optDetail: "CM助手-全量-智能体-新建",
|
|
||||||
url: `/api/agents`,
|
|
||||||
reqParam: request,
|
|
||||||
returnParam: created,
|
|
||||||
});
|
|
||||||
return created;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function updateAgent(
|
export async function updateAgent(
|
||||||
@@ -164,15 +126,7 @@ export async function updateAgent(
|
|||||||
const err = (await res.json().catch(() => ({}))) as { detail?: string };
|
const err = (await res.json().catch(() => ({}))) as { detail?: string };
|
||||||
throw new Error(err.detail ?? `Failed to update agent: ${res.statusText}`);
|
throw new Error(err.detail ?? `Failed to update agent: ${res.statusText}`);
|
||||||
}
|
}
|
||||||
const updated = (await res.json()) as Agent;
|
return res.json() as Promise<Agent>;
|
||||||
writeYLog({
|
|
||||||
optType: OptType.edit,
|
|
||||||
optDetail: "CM助手-全量-智能体-修改",
|
|
||||||
url: `/api/agents/${id}`,
|
|
||||||
reqParam: { id, ...request },
|
|
||||||
returnParam: updated,
|
|
||||||
});
|
|
||||||
return updated;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function deleteAgent(id: string): Promise<void> {
|
export async function deleteAgent(id: string): Promise<void> {
|
||||||
@@ -180,25 +134,12 @@ export async function deleteAgent(id: string): Promise<void> {
|
|||||||
method: "DELETE",
|
method: "DELETE",
|
||||||
});
|
});
|
||||||
if (!res.ok) throw new Error(`Failed to delete agent: ${res.statusText}`);
|
if (!res.ok) throw new Error(`Failed to delete agent: ${res.statusText}`);
|
||||||
writeYLog({
|
|
||||||
optType: OptType.delete,
|
|
||||||
optDetail: "CM助手-全量-智能体-删除",
|
|
||||||
url: `/api/agents/${id}`,
|
|
||||||
reqParam: { id },
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function getAgentSelector(): Promise<AgentSelectorResponse> {
|
export async function getAgentSelector(): Promise<AgentSelectorResponse> {
|
||||||
const res = await apiFetch(`${getBackendBaseURL()}/api/agents/selector`);
|
const res = await apiFetch(`${getBackendBaseURL()}/api/agents/selector`);
|
||||||
if (!res.ok) throw new Error(`Failed to load agent selector: ${res.statusText}`);
|
if (!res.ok) throw new Error(`Failed to load agent selector: ${res.statusText}`);
|
||||||
const selector = (await res.json()) as AgentSelectorResponse;
|
return res.json() as Promise<AgentSelectorResponse>;
|
||||||
writeYLog({
|
|
||||||
optType: OptType.search,
|
|
||||||
optDetail: "CM助手-全量-智能体-选择器",
|
|
||||||
url: `/api/agents/selector`,
|
|
||||||
returnParam: selector,
|
|
||||||
});
|
|
||||||
return selector;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function favoriteAgent(id: string): Promise<void> {
|
export async function favoriteAgent(id: string): Promise<void> {
|
||||||
@@ -209,12 +150,6 @@ export async function favoriteAgent(id: string): Promise<void> {
|
|||||||
const err = (await res.json().catch(() => ({}))) as { detail?: string };
|
const err = (await res.json().catch(() => ({}))) as { detail?: string };
|
||||||
throw new Error(err.detail ?? `Failed to favorite agent: ${res.statusText}`);
|
throw new Error(err.detail ?? `Failed to favorite agent: ${res.statusText}`);
|
||||||
}
|
}
|
||||||
writeYLog({
|
|
||||||
optType: OptType.edit,
|
|
||||||
optDetail: "CM助手-全量-智能体-收藏",
|
|
||||||
url: `/api/agents/${id}/favorite`,
|
|
||||||
reqParam: { id },
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function unfavoriteAgent(id: string): Promise<void> {
|
export async function unfavoriteAgent(id: string): Promise<void> {
|
||||||
@@ -225,12 +160,6 @@ export async function unfavoriteAgent(id: string): Promise<void> {
|
|||||||
const err = (await res.json().catch(() => ({}))) as { detail?: string };
|
const err = (await res.json().catch(() => ({}))) as { detail?: string };
|
||||||
throw new Error(err.detail ?? `Failed to unfavorite agent: ${res.statusText}`);
|
throw new Error(err.detail ?? `Failed to unfavorite agent: ${res.statusText}`);
|
||||||
}
|
}
|
||||||
writeYLog({
|
|
||||||
optType: OptType.edit,
|
|
||||||
optDetail: "CM助手-全量-智能体-取消收藏",
|
|
||||||
url: `/api/agents/${id}/favorite`,
|
|
||||||
reqParam: { id },
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function pinAgent(id: string): Promise<void> {
|
export async function pinAgent(id: string): Promise<void> {
|
||||||
@@ -241,12 +170,6 @@ export async function pinAgent(id: string): Promise<void> {
|
|||||||
const err = (await res.json().catch(() => ({}))) as { detail?: string };
|
const err = (await res.json().catch(() => ({}))) as { detail?: string };
|
||||||
throw new Error(err.detail ?? `Failed to pin agent: ${res.statusText}`);
|
throw new Error(err.detail ?? `Failed to pin agent: ${res.statusText}`);
|
||||||
}
|
}
|
||||||
writeYLog({
|
|
||||||
optType: OptType.edit,
|
|
||||||
optDetail: "CM助手-全量-智能体-置顶",
|
|
||||||
url: `/api/agents/${id}/pin`,
|
|
||||||
reqParam: { id },
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function unpinAgent(id: string): Promise<void> {
|
export async function unpinAgent(id: string): Promise<void> {
|
||||||
@@ -257,12 +180,6 @@ export async function unpinAgent(id: string): Promise<void> {
|
|||||||
const err = (await res.json().catch(() => ({}))) as { detail?: string };
|
const err = (await res.json().catch(() => ({}))) as { detail?: string };
|
||||||
throw new Error(err.detail ?? `Failed to unpin agent: ${res.statusText}`);
|
throw new Error(err.detail ?? `Failed to unpin agent: ${res.statusText}`);
|
||||||
}
|
}
|
||||||
writeYLog({
|
|
||||||
optType: OptType.edit,
|
|
||||||
optDetail: "CM助手-全量-智能体-取消置顶",
|
|
||||||
url: `/api/agents/${id}/pin`,
|
|
||||||
reqParam: { id },
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function reorderFeaturedAgents(agentIds: string[]): Promise<void> {
|
export async function reorderFeaturedAgents(agentIds: string[]): Promise<void> {
|
||||||
@@ -280,12 +197,6 @@ export async function reorderFeaturedAgents(agentIds: string[]): Promise<void> {
|
|||||||
err.detail ?? `Failed to reorder featured agents: ${res.statusText}`,
|
err.detail ?? `Failed to reorder featured agents: ${res.statusText}`,
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
writeYLog({
|
|
||||||
optType: OptType.edit,
|
|
||||||
optDetail: "CM助手-全量-智能体-精选排序",
|
|
||||||
url: `/api/agents/featured/order`,
|
|
||||||
reqParam: { agent_ids: agentIds },
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function listPrivateAgents(password: string): Promise<Agent[]> {
|
export async function listPrivateAgents(password: string): Promise<Agent[]> {
|
||||||
@@ -304,12 +215,6 @@ export async function listPrivateAgents(password: string): Promise<Agent[]> {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
const data = (await res.json()) as { agents: Agent[] };
|
const data = (await res.json()) as { agents: Agent[] };
|
||||||
writeYLog({
|
|
||||||
optType: OptType.search,
|
|
||||||
optDetail: "CM助手-全量-私有广场智能体列表",
|
|
||||||
url: `/api/agents/private-square/list`,
|
|
||||||
returnParam: data.agents,
|
|
||||||
});
|
|
||||||
return data.agents;
|
return data.agents;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -356,20 +261,12 @@ export async function listPrivateAgentsPaginated(
|
|||||||
page?: number;
|
page?: number;
|
||||||
page_size?: number;
|
page_size?: number;
|
||||||
};
|
};
|
||||||
const result: PaginatedAgents = {
|
return {
|
||||||
agents: data.agents,
|
agents: data.agents,
|
||||||
total: data.total ?? data.agents.length,
|
total: data.total ?? data.agents.length,
|
||||||
page: data.page ?? params.page ?? 1,
|
page: data.page ?? params.page ?? 1,
|
||||||
pageSize: data.page_size ?? params.pageSize ?? data.agents.length,
|
pageSize: data.page_size ?? params.pageSize ?? data.agents.length,
|
||||||
};
|
};
|
||||||
writeYLog({
|
|
||||||
optType: OptType.search,
|
|
||||||
optDetail: "CM助手-全量-私有广场智能体列表",
|
|
||||||
url: `/api/agents/private-square/list`,
|
|
||||||
reqParam: { ...params, password: undefined },
|
|
||||||
returnParam: result,
|
|
||||||
});
|
|
||||||
return result;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function setAgentPrivate(
|
export async function setAgentPrivate(
|
||||||
@@ -390,15 +287,7 @@ export async function setAgentPrivate(
|
|||||||
err.detail ?? `Failed to update agent privacy: ${res.statusText}`,
|
err.detail ?? `Failed to update agent privacy: ${res.statusText}`,
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
const updated = (await res.json()) as Agent;
|
return res.json() as Promise<Agent>;
|
||||||
writeYLog({
|
|
||||||
optType: OptType.edit,
|
|
||||||
optDetail: "CM助手-全量-智能体-设置私有",
|
|
||||||
url: `/api/agents/${id}/private`,
|
|
||||||
reqParam: { id, is_private: isPrivate },
|
|
||||||
returnParam: updated,
|
|
||||||
});
|
|
||||||
return updated;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function setAgentFeatured(
|
export async function setAgentFeatured(
|
||||||
@@ -419,15 +308,7 @@ export async function setAgentFeatured(
|
|||||||
err.detail ?? `Failed to set featured: ${res.statusText}`,
|
err.detail ?? `Failed to set featured: ${res.statusText}`,
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
const updated = (await res.json()) as Agent;
|
return res.json() as Promise<Agent>;
|
||||||
writeYLog({
|
|
||||||
optType: OptType.edit,
|
|
||||||
optDetail: "CM助手-全量-智能体-设置精选",
|
|
||||||
url: `/api/agents/${id}/featured`,
|
|
||||||
reqParam: { id, order },
|
|
||||||
returnParam: updated,
|
|
||||||
});
|
|
||||||
return updated;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface AgentSkillsSyncRemoval {
|
export interface AgentSkillsSyncRemoval {
|
||||||
@@ -452,14 +333,7 @@ export async function adminSyncAgentSkills(): Promise<AgentSkillsSyncResult> {
|
|||||||
const err = (await res.json().catch(() => ({}))) as { detail?: string };
|
const err = (await res.json().catch(() => ({}))) as { detail?: string };
|
||||||
throw new Error(err.detail ?? `Failed to sync agent skills: ${res.statusText}`);
|
throw new Error(err.detail ?? `Failed to sync agent skills: ${res.statusText}`);
|
||||||
}
|
}
|
||||||
const result = (await res.json()) as AgentSkillsSyncResult;
|
return res.json() as Promise<AgentSkillsSyncResult>;
|
||||||
writeYLog({
|
|
||||||
optType: OptType.edit,
|
|
||||||
optDetail: "CM助手-全量-智能体-同步技能",
|
|
||||||
url: `/api/agents/admin/sync-skills`,
|
|
||||||
returnParam: result,
|
|
||||||
});
|
|
||||||
return result;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface KnowledgeIngestAttempt {
|
export interface KnowledgeIngestAttempt {
|
||||||
@@ -497,15 +371,7 @@ export async function publishArtifactToKnowledge(request: {
|
|||||||
const err = (await res.json().catch(() => ({}))) as { detail?: string };
|
const err = (await res.json().catch(() => ({}))) as { detail?: string };
|
||||||
throw new Error(err.detail ?? `发布入库失败: ${res.statusText}`);
|
throw new Error(err.detail ?? `发布入库失败: ${res.statusText}`);
|
||||||
}
|
}
|
||||||
const result = (await res.json()) as KnowledgeIngestPublishResult;
|
return res.json() as Promise<KnowledgeIngestPublishResult>;
|
||||||
writeYLog({
|
|
||||||
optType: OptType.export,
|
|
||||||
optDetail: "CM助手-全量-智能体-产物发布入库",
|
|
||||||
url: `/api/knowledge-ingest/publish`,
|
|
||||||
reqParam: request,
|
|
||||||
returnParam: result,
|
|
||||||
});
|
|
||||||
return result;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function checkAgentName(
|
export async function checkAgentName(
|
||||||
|
|||||||
@@ -58,10 +58,6 @@ export interface Agent {
|
|||||||
/** 入库模板名（外部知识入库接口的 templateName）。配置后该智能体会话中的
|
/** 入库模板名（外部知识入库接口的 templateName）。配置后该智能体会话中的
|
||||||
* Markdown 产物右上角出现"发布入库"按钮。空/缺省 = 不支持入库。 */
|
* Markdown 产物右上角出现"发布入库"按钮。空/缺省 = 不支持入库。 */
|
||||||
template_name?: string | null;
|
template_name?: string | null;
|
||||||
/** 会商席位「技能识别强化」开关。作为会商席位运行时，是否把本智能体配置的技能
|
|
||||||
* (名称 + SKILL.md 路径 + 必须先 read_file 的硬指令) 拼进本轮任务以补偿弱模型。
|
|
||||||
* 与业务链条同名开关取 OR。null/false = 关 (默认)。 */
|
|
||||||
seat_skill_directive?: boolean | null;
|
|
||||||
tags?: Tag[];
|
tags?: Tag[];
|
||||||
featured_order?: number | null;
|
featured_order?: number | null;
|
||||||
/** Whether the current user has favorited (收藏) this agent. */
|
/** Whether the current user has favorited (收藏) this agent. */
|
||||||
@@ -95,8 +91,6 @@ export interface CreateAgentRequest {
|
|||||||
tool_groups?: string[] | null;
|
tool_groups?: string[] | null;
|
||||||
common_questions?: AgentQuestion[] | null;
|
common_questions?: AgentQuestion[] | null;
|
||||||
template_name?: string | null;
|
template_name?: string | null;
|
||||||
/** 会商席位「技能识别强化」开关；缺省/false = 关。 */
|
|
||||||
seat_skill_directive?: boolean | null;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface UpdateAgentRequest {
|
export interface UpdateAgentRequest {
|
||||||
@@ -112,6 +106,4 @@ export interface UpdateAgentRequest {
|
|||||||
common_questions?: AgentQuestion[] | null;
|
common_questions?: AgentQuestion[] | null;
|
||||||
/** 入库模板名；传空字符串表示清除。 */
|
/** 入库模板名；传空字符串表示清除。 */
|
||||||
template_name?: string | null;
|
template_name?: string | null;
|
||||||
/** 会商席位「技能识别强化」开关；缺省/false = 关。 */
|
|
||||||
seat_skill_directive?: boolean | null;
|
|
||||||
}
|
}
|
||||||
@@ -1,6 +1,5 @@
|
|||||||
import { apiFetch } from "@/core/api/fetch-client";
|
import { apiFetch } from "@/core/api/fetch-client";
|
||||||
import { getBackendBaseURL } from "@/core/config";
|
import { getBackendBaseURL } from "@/core/config";
|
||||||
import { OptType, writeYLog } from "@/core/log/y-log";
|
|
||||||
import { downloadMarkdownAsDocx } from "@/core/scheduled-tasks/markdown-docx";
|
import { downloadMarkdownAsDocx } from "@/core/scheduled-tasks/markdown-docx";
|
||||||
|
|
||||||
function filenameFromContentDisposition(header: string | null): string | null {
|
function filenameFromContentDisposition(header: string | null): string | null {
|
||||||
@@ -80,31 +79,13 @@ export async function downloadMarkdownDocxFromBackend(options: {
|
|||||||
|
|
||||||
if (response.status === 404) {
|
if (response.status === 404) {
|
||||||
await downloadMarkdownAsDocx(markdown, options.title?.trim() || "document", options.title);
|
await downloadMarkdownAsDocx(markdown, options.title?.trim() || "document", options.title);
|
||||||
writeYLog({
|
|
||||||
optType: OptType.export,
|
|
||||||
optDetail: "CM助手-全量-导出-Word",
|
|
||||||
url: `${getBackendBaseURL()}/api/writing/export/docx`,
|
|
||||||
reqParam: { title: options.title?.trim() || undefined },
|
|
||||||
});
|
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
await downloadBlobResponse(response, fallbackFilename);
|
await downloadBlobResponse(response, fallbackFilename);
|
||||||
writeYLog({
|
|
||||||
optType: OptType.export,
|
|
||||||
optDetail: "CM助手-全量-导出-Word",
|
|
||||||
url: `${getBackendBaseURL()}/api/writing/export/docx`,
|
|
||||||
reqParam: { title: options.title?.trim() || undefined },
|
|
||||||
});
|
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
if (err instanceof TypeError) {
|
if (err instanceof TypeError) {
|
||||||
await downloadMarkdownAsDocx(markdown, options.title?.trim() || "document", options.title);
|
await downloadMarkdownAsDocx(markdown, options.title?.trim() || "document", options.title);
|
||||||
writeYLog({
|
|
||||||
optType: OptType.export,
|
|
||||||
optDetail: "CM助手-全量-导出-Word",
|
|
||||||
url: `${getBackendBaseURL()}/api/writing/export/docx`,
|
|
||||||
reqParam: { title: options.title?.trim() || undefined },
|
|
||||||
});
|
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
throw err;
|
throw err;
|
||||||
|
|||||||
@@ -1,5 +1,4 @@
|
|||||||
import { apiFetch } from "@/core/api";
|
import { apiFetch } from "@/core/api";
|
||||||
import { OptType, writeYLog } from "@/core/log/y-log";
|
|
||||||
|
|
||||||
import { urlOfArtifact } from "./utils";
|
import { urlOfArtifact } from "./utils";
|
||||||
|
|
||||||
@@ -27,8 +26,7 @@ export async function updateArtifactContent({
|
|||||||
content: string;
|
content: string;
|
||||||
isMock?: boolean;
|
isMock?: boolean;
|
||||||
}) {
|
}) {
|
||||||
const url = urlOfArtifact({ filepath, threadId, isMock });
|
const res = await apiFetch(urlOfArtifact({ filepath, threadId, isMock }), {
|
||||||
const res = await apiFetch(url, {
|
|
||||||
method: "PATCH",
|
method: "PATCH",
|
||||||
headers: {
|
headers: {
|
||||||
"Content-Type": "application/json",
|
"Content-Type": "application/json",
|
||||||
@@ -38,11 +36,5 @@ export async function updateArtifactContent({
|
|||||||
if (!res.ok) {
|
if (!res.ok) {
|
||||||
throw new Error(await errorMessageFromResponse(res));
|
throw new Error(await errorMessageFromResponse(res));
|
||||||
}
|
}
|
||||||
writeYLog({
|
|
||||||
optType: OptType.edit,
|
|
||||||
optDetail: "CM助手-全量-产物-编辑产物内容",
|
|
||||||
url,
|
|
||||||
reqParam: { filepath, threadId },
|
|
||||||
});
|
|
||||||
return res.text();
|
return res.text();
|
||||||
}
|
}
|
||||||
@@ -11,14 +11,6 @@ export interface UserListItem {
|
|||||||
agent_count: number;
|
agent_count: number;
|
||||||
/** 问答次数：用户提问的次数（一次提问算一次）。 */
|
/** 问答次数：用户提问的次数（一次提问算一次）。 */
|
||||||
qa_count: number;
|
qa_count: number;
|
||||||
/** 登录白名单放行标记：开关开启后仅 approved 用户（或 admin）可登录。 */
|
|
||||||
approved: boolean;
|
|
||||||
/**
|
|
||||||
* 账号级「登录口令」（明文，仅管理员可见）。非空 → 该账号用户名直登必须带匹配的
|
|
||||||
* `?password=`；为空/null → 走原有共享口令门/免口令逻辑。管理员据此拼出登录链接
|
|
||||||
* `…/login/<用户名>?password=xxxx` 发给用户。
|
|
||||||
*/
|
|
||||||
login_password: string | null;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function listAllUsers(): Promise<UserListItem[]> {
|
export async function listAllUsers(): Promise<UserListItem[]> {
|
||||||
@@ -27,39 +19,6 @@ export async function listAllUsers(): Promise<UserListItem[]> {
|
|||||||
return res.json() as Promise<UserListItem[]>;
|
return res.json() as Promise<UserListItem[]>;
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 放行 / 取消放行某个注册用户（登录白名单）。Admin only。 */
|
|
||||||
export async function setUserApproval(userId: string, approved: boolean): Promise<UserListItem> {
|
|
||||||
const res = await apiFetch(`${getBackendBaseURL()}/api/v1/auth/users/${encodeURIComponent(userId)}/approval`, {
|
|
||||||
method: "PUT",
|
|
||||||
headers: { "Content-Type": "application/json" },
|
|
||||||
body: JSON.stringify({ approved }),
|
|
||||||
});
|
|
||||||
if (!res.ok) {
|
|
||||||
const data = await res.json().catch(() => null);
|
|
||||||
throw new Error(extractErrorMessage(data, "保存失败"));
|
|
||||||
}
|
|
||||||
return res.json() as Promise<UserListItem>;
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 设置 / 清除某个账号的「登录口令」（明文）。Admin only。
|
|
||||||
*
|
|
||||||
* 传非空字符串 → 设置；传 `null` 或空字符串 → 清除。设置后该账号用户名直登需带匹配的
|
|
||||||
* `?password=`。返回更新后的用户项（含明文 `login_password`）。
|
|
||||||
*/
|
|
||||||
export async function setUserLoginPassword(userId: string, password: string | null): Promise<UserListItem> {
|
|
||||||
const res = await apiFetch(`${getBackendBaseURL()}/api/v1/auth/users/${encodeURIComponent(userId)}/login-password`, {
|
|
||||||
method: "PUT",
|
|
||||||
headers: { "Content-Type": "application/json" },
|
|
||||||
body: JSON.stringify({ password }),
|
|
||||||
});
|
|
||||||
if (!res.ok) {
|
|
||||||
const data = await res.json().catch(() => null);
|
|
||||||
throw new Error(extractErrorMessage(data, "保存失败"));
|
|
||||||
}
|
|
||||||
return res.json() as Promise<UserListItem>;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Normalize a FastAPI error body into a human-readable string. `detail` may be
|
// Normalize a FastAPI error body into a human-readable string. `detail` may be
|
||||||
// a plain string, an object like AuthErrorResponse ({ code, message }), or an
|
// a plain string, an object like AuthErrorResponse ({ code, message }), or an
|
||||||
// array of validation errors — anything but a string would otherwise render as
|
// array of validation errors — anything but a string would otherwise render as
|
||||||
|
|||||||
@@ -1,108 +0,0 @@
|
|||||||
/**
|
|
||||||
* 大屏绘制智能体的任务输入适配层。
|
|
||||||
*
|
|
||||||
* 报告详情由 Gateway 的 `/api/task-reports/by-task/{taskId}` 提供，返回格式
|
|
||||||
* 与原 `selectSqReport` 一致：`{state, msg, data}`。每条 `contentJson` 是
|
|
||||||
* JSON 字符串，本模块将其按 `categoryType` 解析为智能体和大屏页面可直接使用的
|
|
||||||
* 结构化输入。
|
|
||||||
*/
|
|
||||||
|
|
||||||
import { getTaskReport } from "@/strategy-components/api/task-reports";
|
|
||||||
import { readRuntimeFlag } from "@/env";
|
|
||||||
import { SQ_REPORT_MOCK_RESPONSE } from "@/strategy-components/components/task-components/sq-report-mock-data";
|
|
||||||
|
|
||||||
/** 保留给既有调用方的 sessionStorage key；报告本身不再使用 mock 缓存。 */
|
|
||||||
export const DASHBOARD_INPUT_STORAGE_KEY = "dashboard.inputJson";
|
|
||||||
|
|
||||||
function parseContentJson(raw: unknown): unknown {
|
|
||||||
if (typeof raw !== "string") return raw ?? null;
|
|
||||||
const text = raw.trim();
|
|
||||||
if (!text) return null;
|
|
||||||
try {
|
|
||||||
return JSON.parse(text);
|
|
||||||
} catch {
|
|
||||||
// 非 JSON 字符串仍透传给智能体，避免因单条异常让整份报告不可用。
|
|
||||||
return text;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function categoryKey(categoryType: unknown, index: number): string {
|
|
||||||
const raw = typeof categoryType === "string" ? categoryType.trim() : "";
|
|
||||||
const cleaned = raw.replace(/\s*JSON\s*$/i, "").trim();
|
|
||||||
return cleaned || `分类${index + 1}`;
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 将接口 envelope 提取为 `{ taskId, source, categories }`。
|
|
||||||
* 返回 null 表示该任务尚未保存可用的报告内容。
|
|
||||||
*/
|
|
||||||
export function extractSqReport(body: unknown, taskId: string): unknown | null {
|
|
||||||
const data = (body && typeof body === "object" ? (body as { data?: unknown }).data : null) as
|
|
||||||
| Array<Record<string, unknown>>
|
|
||||||
| undefined;
|
|
||||||
if (!Array.isArray(data) || data.length === 0) return null;
|
|
||||||
|
|
||||||
const categories: Record<string, unknown> = {};
|
|
||||||
data.forEach((item, index) => {
|
|
||||||
const content = parseContentJson(item?.contentJson);
|
|
||||||
if (content == null) return;
|
|
||||||
let key = categoryKey(item?.categoryType, index);
|
|
||||||
if (key in categories) key = `${key}（${index + 1}）`;
|
|
||||||
categories[key] = content;
|
|
||||||
});
|
|
||||||
if (Object.keys(categories).length === 0) return null;
|
|
||||||
return { taskId, source: "api/task-reports", categories };
|
|
||||||
}
|
|
||||||
|
|
||||||
/** 兼容旧调用方：报告由接口实时读取，不再在浏览器中缓存。 */
|
|
||||||
export function readDashboardInputJson(): unknown | null {
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
|
|
||||||
/** 兼容旧调用方：报告数据只由后端接口维护。 */
|
|
||||||
export function persistDashboardInputJson(_data: unknown): void {
|
|
||||||
// noop
|
|
||||||
}
|
|
||||||
|
|
||||||
/** 查询并提取当前任务的报告详情；失败或空数据均返回 null。 */
|
|
||||||
export async function fetchDashboardInputJson(
|
|
||||||
taskId: string,
|
|
||||||
_opts?: { forceRefresh?: boolean },
|
|
||||||
): Promise<unknown | null> {
|
|
||||||
if (!taskId) return null;
|
|
||||||
// 开发演示模式使用与 Gateway 接口同形的本地样例；这样不依赖报告库是否已为
|
|
||||||
// 当前深链 taskId 写入数据，同时真实/生产环境仍始终从 Gateway 读取。
|
|
||||||
if (readRuntimeFlag("VITE_MOCK_SQ_REPORT")) {
|
|
||||||
return extractSqReport(
|
|
||||||
{
|
|
||||||
...SQ_REPORT_MOCK_RESPONSE,
|
|
||||||
data: SQ_REPORT_MOCK_RESPONSE.data.map((item) => ({ ...item, taskId })),
|
|
||||||
},
|
|
||||||
taskId,
|
|
||||||
);
|
|
||||||
}
|
|
||||||
const body = await getTaskReport(taskId);
|
|
||||||
return extractSqReport(body, taskId);
|
|
||||||
}
|
|
||||||
|
|
||||||
export type SqReportStatus = "complete" | "incomplete" | "unknown";
|
|
||||||
|
|
||||||
export interface SqReportCheckResult {
|
|
||||||
status: SqReportStatus;
|
|
||||||
report?: unknown;
|
|
||||||
}
|
|
||||||
|
|
||||||
/** rwfx 进入前检查：任务已有可解析报告则 complete，否则 incomplete。 */
|
|
||||||
export async function fetchSqReportCheck(taskId: string): Promise<SqReportCheckResult> {
|
|
||||||
if (!taskId) return { status: "unknown" };
|
|
||||||
try {
|
|
||||||
const report = await fetchDashboardInputJson(taskId);
|
|
||||||
return report ? { status: "complete", report } : { status: "incomplete" };
|
|
||||||
} catch {
|
|
||||||
return { status: "unknown" };
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export async function fetchSqReportStatus(taskId: string): Promise<SqReportStatus> {
|
|
||||||
return (await fetchSqReportCheck(taskId)).status;
|
|
||||||
}
|
|
||||||
Loaded 100 of 1294 files, more files were not shown because too many files have changed in this diff.
Show more
Reference in new issue
Block a user