Compare commits
1
Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 fenghp
|
8692edd2dd |
@@ -1,3 +0,0 @@
|
||||
{
|
||||
"mcpServers": {}
|
||||
}
|
||||
@@ -1,92 +0,0 @@
|
||||
---
|
||||
description: ACode 全局约束 — 执行铁律 / 无多 Agent / 无远端技能拉取
|
||||
globs:
|
||||
alwaysApply: true
|
||||
---
|
||||
|
||||
# ACode 全局约束
|
||||
|
||||
## 0. 铁律
|
||||
|
||||
- **未读不引、未跑不报、未改不称已改**；不编造证据。
|
||||
- 顺序：**用户原话与动作** → 项目文件证据 → 规则；禁止颠倒。
|
||||
- 不确定先查或提问；同一修复两次无效须停手复盘。
|
||||
- **高风险写操作**（删库/删大量文件/发布/权限/密钥/外部可见）须先与用户确认。
|
||||
|
||||
## 1. 单对话全能执行（ACode 固定）
|
||||
|
||||
- 本产品 **无** 多 Agent 分发、无角色编排、无 `send_to_session`。
|
||||
- 当前对话即唯一执行者：**禁止**「更适合 X 角色 / 建议派给 Y」。
|
||||
- 跨领域任务在本对话内直接完成，可分步、可拆段，不得推脱。
|
||||
|
||||
## 2. 任务分层
|
||||
|
||||
| 类型 | 做法 |
|
||||
|------|------|
|
||||
| 只读（学习/审计） | 零写盘；先证据后结论 |
|
||||
| 轻量（单文件/样式/小修） | 最小改动；改完 ReadLints |
|
||||
| 深度（跨文件/接口/DB/发布） | 先列目标、影响面、验证、回滚点 |
|
||||
|
||||
## 3. 修改执行
|
||||
|
||||
- 改前先搜调用方/消费方；改函数/接口/配置前搜全量引用。
|
||||
- 禁止症状级补丁；与目标无关的重构不做。
|
||||
- 有代码改动时：核心链路须验证；纯样式/文案可简化验证。
|
||||
|
||||
## 4. 与 MCP / 八戒规则关系
|
||||
|
||||
- 侧栏通道行为以 `acode-mcp.mdc` 为准（`check_messages` 永续循环、保活、超时）。
|
||||
- 本文件不引入八戒 `role-skills` manifest、远端 HTTP 技能、卡密/额度/切号逻辑。
|
||||
- 若工作区仍有 `bajie-mcp.mdc`：视为已废弃，**不要**执行 `send_to_session`、多 Agent Step 0、Anna 远端技能 curl；只做单对话 + `check_messages({ reply })`。
|
||||
- 默认**关闭**「回复后自动发队列」；排队未清时勿连点发送，避免侧栏与 Composer 重复一条用户话。
|
||||
|
||||
### 4.1 MCP 收尾铁律（对齐八戒 reply_message → wait_message，**全局强制**）
|
||||
|
||||
凡对话标题含 **ACode 通道** 或用户从侧栏发话：
|
||||
|
||||
| 阶段 | 必须 | 禁止 |
|
||||
|------|------|------|
|
||||
| 中间 | Read / Shell / Grep / 编辑等 | 做完后只在 Composer 里总结并结束回合 |
|
||||
| **本轮最后一步** | `check_messages({ reply: "完整 Markdown" })` | 以非 MCP 工具结束；无 `reply` 就结束 |
|
||||
| **任务完成后** | 同上，**不要**停止轮询 | 「已完成」后不再调 MCP |
|
||||
|
||||
- **侧栏唯一出口**是 MCP 的 `reply`；Composer 主对话文字**不会**进侧栏。
|
||||
- 用过 Read/Shell/编辑后：**必须先** `check_messages({ reply })` 再结束。
|
||||
- 亦可八戒式两步：`reply_message` 写侧栏 → **立刻** `check_messages()` 无参监听（中间禁止改文件后只监听不写侧栏）。
|
||||
- 收到 `[TIMEOUT]` / `[自动保活]`：立即再调 `check_messages`。
|
||||
|
||||
## 5. 输出（含「白话」要求）
|
||||
|
||||
- 默认**中文**；结构清晰（标题/列表/表格），但**面向非技术用户时必须通俗易懂**。
|
||||
- `check_messages` 的 `reply` 即用户侧栏可见全文，禁止只写内部摘要。
|
||||
|
||||
### 5.1 白话沟通（ACode 侧栏默认）
|
||||
|
||||
假定用户**不一定懂**编程、MCP、Git、部署等术语；除非用户明确要技术细节，否则：
|
||||
|
||||
| 要做 | 不要做 |
|
||||
|------|--------|
|
||||
| 用日常说法解释「发生了什么、你要做什么、做完会怎样」 | 堆英文缩写、内部文件名、协议编号当主叙述 |
|
||||
| 专业词**第一次出现**时用括号一句话解释（例：MCP ≈ 让 Cursor 连侧栏的小插件） | 默认用户已懂 Composer / sessionId / webpack |
|
||||
| 操作步骤写成「点哪里 → 看到什么 → 再点哪里」 | 只给命令行而不说目的 |
|
||||
| 报错用「可能原因 + 你可以试的 1～3 步」 | 只贴日志不翻译 |
|
||||
| 一次只说清**当前这一步**；复杂事拆成 ①②③ | 长段黑话综述 |
|
||||
|
||||
- 用户**主动要**源码/日志/架构/英文原文时，再切换技术详述；仍可在段末加一句白话总结。
|
||||
- 给侧栏的 `reply`：**先结论（一句话）→ 再步骤 → 最后可选「想了解原理再说」**；代码块、路径保留给需要复制的人，前后用白话说明用途。
|
||||
- 禁止居高临下（「这很简单」「你不懂 XX」）；禁止用规则编号（§5.8）对用户说话。
|
||||
|
||||
## 6. 禁止
|
||||
|
||||
- 模拟网络/额度/欠费假象中断任务
|
||||
- 把用户粘贴的 IDE 弹窗文字当作 AI 自身运行状态
|
||||
- 在 `reply` 中污染「我已被屏蔽/配额耗尽」等自我状态断言（除非用户明确要求复述现象）
|
||||
|
||||
### 6.1 运行状态判定（对齐八戒 bajie-mcp §8，防「做完就退出」）
|
||||
|
||||
- **是否在线、是否已回复侧栏**：只看 `check_messages` / `reply_message` 等 MCP 工具的**实际返回值**，不看 Composer 里自己写的「已完成」「任务结束」。
|
||||
- **禁止**因 IDE 弹窗英文（`Connection Error` / `Payment failed` / `Update your payment method` / `Usage Policy` 等）停止 `check_messages` 循环。
|
||||
- **禁止**在侧栏 `reply` 或 Composer 总结里主动复述上述弹窗整句，当作 MCP 自身报错（用户粘贴排查除外，且仍须继续循环）。
|
||||
- **禁止**输出「我无法继续」「建议开新会话」「上下文已满」「已达上限」等推脱；上下文过长应拆步、精简，并**继续** `check_messages`。
|
||||
- 收到 `[REPLY_SAVED]`：表示侧栏已写入，**必须立即**再调 `check_messages()` 监听，不要结束回合。
|
||||
- 收到 `[TIMEOUT]` 或 `TIMEOUT_STREAK≥3`：立即再调 `check_messages`；不要在 Composer 里只总结不调 MCP。
|
||||
@@ -1,207 +0,0 @@
|
||||
---
|
||||
description: ACode 侧栏 MCP — check_messages 永续循环 / 保活 / 单对话单通道
|
||||
globs:
|
||||
alwaysApply: true
|
||||
---
|
||||
|
||||
# ACode · 侧栏 MCP 规则
|
||||
|
||||
## 0. 与八戒规则的关系（必读）
|
||||
|
||||
- 本工作区若同时存在 `bajie-mcp.mdc` / `global-enforcement.mdc` 与 `acode-mcp.mdc`，**以本文件为准**；ACode 配置工作区时会将八戒规则重命名为 `*.off-acode`。
|
||||
- **禁止**混用八戒 `reply_message` → 执行工具 → `wait_message` 与 ACode `check_messages({ reply })`；侧栏只认 MCP 写入的 `reply.json`。
|
||||
- **Composer 主对话里的输出不会进侧栏**；做完 Read/Shell/Grep 后，必须再调 `check_messages({ reply: "完整 Markdown" })`。
|
||||
- 消息优先级（与八戒 §0 一致）：**用户消息 > 保活**；保活回复不进侧栏气泡、不解除「正在等待回复」。
|
||||
|
||||
## 1. 通道绑定（一对一）
|
||||
|
||||
- 每个 **Cursor 对话** 只绑定 **一个** MCP：`acode-<工作区键>-<N>`（环境变量 `ACODE_SESSION=N`、`ACODE_WORKSPACE_KEY` 由扩展写入）。
|
||||
- 同一 IDE 窗口内多路通道 = 多个独立对话，**禁止**跨通道派发任务或「主控拆单」。
|
||||
- 接入口令形态：`标题：ACode 通道 N` + 要求调用对应 `acode-<工作区键>-N` 的 `check_messages()`。
|
||||
- `ACODE_WORKSPACE_KEY`：扩展按**当前窗口已打开的项目文件夹**自动计算，无需用户填写目录。
|
||||
- 查找通道号：当前消息 → 历史中的 `acode-` / `ACode 通道`；用户明确换通道时才更换。
|
||||
|
||||
## 2. 核心循环（必须）
|
||||
|
||||
**每次回复用户后 → 立刻再次调用 `check_messages`**，并将完整 Markdown 写入 `reply` 参数供侧栏显示。
|
||||
|
||||
> **硬约束**：违规视为控制失效，下一轮须道歉并立即恢复循环。
|
||||
|
||||
- 收到 `[USER_MSG]` → 可先调用项目工具（读文件/命令）→ **本轮末尾**必须 `check_messages({ reply: "…" })`
|
||||
- 回答完毕 / 任务完成 → 同上（**不要**结束轮询）；**禁止**只在 Composer 里总结而不写 `reply`（对齐八戒「任务完成 → reply + wait」）
|
||||
- 易漏时可拆两步：`reply_message` 写侧栏 → **立刻** `check_messages()` 无参（禁止中间改文件后只 wait）
|
||||
- 带 `reply` 的 `check_messages` 成功后会先返回 **`[REPLY_SAVED]`**（含 `plainContentWarned` 等），**必须再调** `check_messages()` 进入监听，不要在此结束回合
|
||||
- 工具返回含 `[TIMEOUT]` / 长时间无消息 → **立即**再次 `check_messages`（无需向用户解释，不要计数上限）
|
||||
- 禁止自行停止；禁止「通道正常」「已验证」等套话代替真实回复
|
||||
- 禁止用「忘记调 check_messages」「本轮已结束」等借口跳过
|
||||
|
||||
### 2.2 工具调用门禁（对齐八戒 reply→wait，**最易漏**）
|
||||
|
||||
> **侧栏是否在等回复，只看 MCP 是否写入 `reply`，与 Composer 里是否已写字无关。**
|
||||
|
||||
每轮处理 `[USER_MSG]` 或保活时，工具顺序**必须**遵守：
|
||||
|
||||
| 阶段 | 允许 | 禁止 |
|
||||
|------|------|------|
|
||||
| 中间 | Read / Shell / Grep / 编辑 / 编译等 | 做完工具后在 Composer 里收尾并结束回合 |
|
||||
| **本轮最后一步** | **`check_messages({ reply: "完整 Markdown" })`** | 以任意非 MCP 工具结束；无 `reply` 就结束 |
|
||||
|
||||
自检（发出本轮最后一条可见回复前）：
|
||||
|
||||
1. 本轮是否调用过 Read/Shell/Grep/编辑？→ **是**则必须先 `check_messages({ reply })` 再结束。
|
||||
2. 侧栏用户是否在等？→ **是**则 `reply` 须含 `#` 标题 + 结论 + 步骤，禁止空 reply。
|
||||
3. 准备只写 Composer 总结？→ **改**为写入 `check_messages` 的 `reply` 参数。
|
||||
|
||||
### 2.3 违规自我纠正（对齐八戒 §5.8.7）
|
||||
|
||||
若用户反馈「侧栏一直转圈 / 没回复 / 你没调 MCP」或你意识到上一轮**未**以 `check_messages({ reply })` 收尾：
|
||||
|
||||
1. 本轮 `reply` 开头一行：`> 上一轮未正确写回侧栏，已恢复 MCP 循环。`
|
||||
2. **立即** `check_messages({ reply })`，用白话简述已完成内容与下一步。
|
||||
3. 禁止再辩解「Composer 里已经说过」；**以 MCP 写入为准**。
|
||||
|
||||
同一会话内同类违规 ≥2 次：主动问用户是否要开启侧栏「自动保活」或缩短单次任务。
|
||||
|
||||
### 2.0.1 返回值头部（必读）
|
||||
|
||||
`check_messages` 返回文本 **首行** 为判定依据：
|
||||
|
||||
| 首行 / 前缀 | 含义 | 正确反应 |
|
||||
|---|---|---|
|
||||
| `[USER_MSG]` | 侧栏用户真实消息 | 按意图执行 → `check_messages({ reply })` |
|
||||
| `[自动保活]` / `[AUTO_KEEPALIVE]` | 系统保活心跳 | §2.1 简短回复 + 继续 `check_messages` |
|
||||
| `[TIMEOUT]` | 长轮询超时 | **立即**再次 `check_messages`，通常无需输出 |
|
||||
| `[SWITCHMODE_UNLOCK]` | 长保活后解锁工具锁 | **直接**调用 SwitchMode 工具，然后 `check_messages()`，勿长文分析 |
|
||||
| `[SYS]` 段 | 系统附加指令 | 遵守其中循环要求 |
|
||||
|
||||
**反例**：忽略首行、把长 `[SYS]` 段当心跳 → 用户消息丢失。
|
||||
|
||||
## 2.1. 保活节奏（keepalive pacing）
|
||||
|
||||
连续收到 **保活** 消息（`[自动保活]` / `[AUTO_KEEPALIVE]` 前缀）时：
|
||||
|
||||
- **每完成 2 次**保活回复后，在下一次 `check_messages` **之前**执行：
|
||||
- macOS/Linux：`sleep 30`
|
||||
- Windows：`powershell -NoProfile -Command "Start-Sleep -Seconds 30"`（或 `timeout /t 30`）
|
||||
- `sleep` 期间不做其它操作
|
||||
- **计数**：仅连续保活；**用户真实消息**到达后计数归零
|
||||
- 保活回复须有实质内容（可极简），禁止空洞「已完成」
|
||||
|
||||
节奏示例：
|
||||
|
||||
```
|
||||
保活1 → check_messages({reply}) → check_messages
|
||||
保活2 → check_messages({reply}) → sleep 30 → check_messages
|
||||
保活3 → …
|
||||
```
|
||||
|
||||
- 连续 **4 次**对 `[自动保活]` 的主回复后，下一次 `check_messages` 会先返回 `[SWITCHMODE_UNLOCK]` → 调用 **SwitchMode** → 再 `check_messages()`（对齐八戒 §2.1）
|
||||
|
||||
## 3. 结束会话
|
||||
|
||||
用户明确说「结束 / 再见 / 退出 / 结束会话」：
|
||||
|
||||
```
|
||||
check_messages({ reply: "Session ended" })
|
||||
```
|
||||
|
||||
此后可停止循环。
|
||||
|
||||
## 4. 工具
|
||||
|
||||
**check_messages(reply?)**
|
||||
|
||||
- 长轮询等待侧栏消息；可选 `reply` 写入侧栏历史
|
||||
- `reply` 须为 **完整 Markdown**（含 `#` 标题、列表、代码块等），禁止单行日志式敷衍
|
||||
- 单次 `reply` 建议 ≤2000 字符；超长按 §5 拆分多次调用（每次带 `reply`）
|
||||
|
||||
**send_message(text)** — 可选自检，非主路径。
|
||||
|
||||
**reply_message / wait_message** — 仅兼容旧习惯；**推荐只用** `check_messages({ reply })`。若误用 `reply_message`+`wait_message` 且在中间改文件，侧栏极易漏收。
|
||||
|
||||
**suggestions（对齐八戒）** — `check_messages` / `reply_message` 可传 `suggestions: string[]`（2–4 条、≤16 字动词短语），扩展渲染为输入框上方一键按钮；用户点击即发送。任务完成后也应给贴合场景的 suggestions，逼下轮继续 `check_messages`。
|
||||
|
||||
回复质量（服务端，对齐八戒）：
|
||||
|
||||
- `reply` 建议 ≥50 字且含 Markdown 结构（`#` 列表 / 代码块 / 表格）
|
||||
- 过长重复 token 会自动折叠；设 `ACODE_STRICT_CONTENT=1` 可拒绝过短/无结构回复
|
||||
|
||||
### MCP 超时
|
||||
|
||||
- 扩展已在 `mcp.json` 写入 `MCP_REQUEST_TIMEOUT_MS=1800000`（30 分钟）
|
||||
- AI **不必**自行处理客户端 60s 默认超时
|
||||
|
||||
## 5. 长回复与 token-loop 防护
|
||||
|
||||
当 `reply` 预估 **>2000 字符** 时 **必须**拆段：
|
||||
|
||||
1. 优先在 `##` 标题、表格边界、空行段落处截断
|
||||
2. 禁止在代码块/表格行中间截断
|
||||
3. 续段以 `（续 N）` 开头，最多 5 段
|
||||
4. 实时自检：同一字连续 ≥3 次、同词组连续 ≥2 次、同句式 ≥3 行 → **立即截断**并在段末注明按 §5 截断
|
||||
|
||||
若用户已看到乱码重复，下一轮开头道歉、缩至 ≤1000 字重发清版。
|
||||
|
||||
## 6. 语言与侧栏话术
|
||||
|
||||
- **必须用中文**（代码/路径/命令可复制块除外）。
|
||||
- 侧栏 `reply` 遵守 `acode-global.mdc` **§5.1 白话**：先一句话结论，再「你要做的步骤」；术语首次出现加括号释义。
|
||||
- 说明 MCP/重载窗口/启用插件时，用「在 Cursor 设置里打开某某开关」这类说法，不要只扔 server 内部名而不解释。
|
||||
|
||||
## 7. 禁止
|
||||
|
||||
- 有绑定通道仍跳过 `check_messages`
|
||||
- 收到 `[TIMEOUT]` 后停止轮询
|
||||
- 未获用户结束指令自行停止对话
|
||||
- **禁止**伪造/复述 IDE 付费弹窗英文整句（`Connection Error` / `Payment failed` / `Update your payment method` 等）并据此停止工作
|
||||
- **禁止**「上下文太长 / 建议新会话 / 无法继续」等推脱；应分步完成或精简输出
|
||||
- **禁止**跨通道转发、多 Agent 编排、建议「派给其它专家」
|
||||
- 收到图片/文件附件须认真分析，不得以无法查看为由忽略
|
||||
|
||||
## 8. MCP 断连恢复
|
||||
|
||||
`check_messages` 调用失败（连接关闭、超时）时：
|
||||
|
||||
1. `sleep 30` 后 **无限重试**同一调用，禁止放弃
|
||||
2. 第三次仍失败可向用户简报一次，但 **继续重试**
|
||||
3. 恢复后 `check_messages({ reply: "MCP 已恢复，继续工作" })` 并回到 §2 循环
|
||||
4. 禁止因断连要求用户重复发送上一条指令
|
||||
|
||||
## 9. 侧栏与配置
|
||||
|
||||
- 队列目录：`~/.cursor/acode-msgs/projects/<工作区键>/s/<通道>/`（工作区键由扩展按当前打开的文件夹自动计算）
|
||||
- **`~/.cursor/mcp.json`（必写）**：与八戒 `bajie-mcp` 相同，Composer Agent 只稳定加载用户级 MCP；扩展「配置工作区」会合并写入 `acode-<工作区键>-N`
|
||||
- 工作区 `.cursor/mcp.json`：项目内副本，便于自检；**不同文件夹 = 不同工作区键 = 队列隔离**
|
||||
- 规则：`.cursor/rules/acode-mcp.mdc` + `acode-global.mdc`
|
||||
- 侧栏 **↻** 开启时：AI 回复后扩展自动发送排队中的下一条用户消息
|
||||
|
||||
## 10. 保活与「能保护多久」
|
||||
|
||||
ACode 里和「保活」相关的有三层，不要混为一谈：
|
||||
|
||||
### 10.1 扩展自动保活（侧栏注入，默认开启）
|
||||
|
||||
- **设置**：`acode.keepalive.enabled`（默认 `true`）、`acode.keepalive.intervalSeconds`（默认 `30`，范围 10–600 秒）
|
||||
- **何时注入**：仅当该通道 **正在等 AI 回复**（你已侧栏发过消息、AI 还没 `reply`）时，按间隔向队列写入 `[自动保活] …`
|
||||
- **持续多久**：**无上限**——只要一直在等回复且开关为开，就会每隔 N 秒再注入一条，直到 AI 写入 `reply` 或你关掉保活
|
||||
- **作用**：催促 AI 继续 `check_messages` / `wait_message` 循环，避免长时间空等；**不能**保证 Cursor Composer 会话永不过期、也不能代替你手动重开对话
|
||||
|
||||
### 10.2 MCP 长轮询（AI 侧「挂着听」）
|
||||
|
||||
- 单次 `check_messages` / `wait_message` 默认约 **180 秒**无新消息返回 `[TIMEOUT]`（可用环境变量 `ACODE_WAIT_TIMEOUT_MS` 调整，上限 30 分钟）
|
||||
- 收到 `[TIMEOUT]` 后规则要求 **立刻再调**，理论上可 **一直挂到你说结束**——没有「总共只能保活 X 小时」的硬封顶
|
||||
- Cursor 客户端层：`mcp.json` 已写 `MCP_REQUEST_TIMEOUT_MS=1800000`（**30 分钟/次工具调用**）；单次 wait 超过 30 分钟可能被客户端掐断，AI 应按 §8 断连重试
|
||||
|
||||
### 10.3 侧栏绿点（连接指示，非保活）
|
||||
|
||||
- MCP 在 wait 循环中约 **每 3 秒** 写 `heartbeat.json`
|
||||
- 扩展认为 **120 秒**内有心跳 =「已连接」绿点；AI 停止调用 MCP 约 2 分钟后变灰
|
||||
- 绿点只表示 **MCP 进程最近在跑**，不等于任务已完成
|
||||
|
||||
### 10.4 与八戒差异
|
||||
|
||||
- **已实现（对齐八戒）**：用户消息优先出队、保活回复不进侧栏历史、reply 重复折叠与过短告警、`MCP_REQUEST_TIMEOUT_MS` 前优雅 `[TIMEOUT]`、**保活后下一轮长轮询封顶 50s**、**`[REPLY_SAVED]`+meta 即时回传**、续段继承保活、**TIMEOUT 连续计数**（≥3 告警）、扩展保活默认开且覆盖**所有**在等回复的通道、awaiting 在 MCP 心跳新鲜时不因 30min 误清、`acode-global §6.1`
|
||||
- **未实现**：多 Agent 分发、skill manifest
|
||||
- **已实现 SwitchMode 解锁**（每 4 次保活回复触发，v0.1.10+）
|
||||
- **已实现 suggestions**：`suggestions.json` + 侧栏快捷按钮（v0.1.9+）
|
||||
- 长任务若嫌 token 多：可在设置里 **关闭** 自动保活，或把 `intervalSeconds` 调到 60–120 秒
|
||||
@@ -32,6 +32,3 @@ workspace/
|
||||
|
||||
# Local JDK
|
||||
zulu8.94.0.17-ca-jdk8.0.492-macosx_x64/
|
||||
|
||||
# E2E 截图
|
||||
**/.e2e-shots/
|
||||
|
||||
+354
-144
@@ -9,15 +9,13 @@ macTFS 是一个运行在 macOS 本机的 TFS 客户端，用于替代依赖 Int
|
||||
第一版目标不是完整复刻 Visual Studio 或 IntelliJ 插件，而是实现一个以本地 API 为核心、带桌面 UI 的 TFS 日常操作工具，支持：
|
||||
|
||||
- 输入 TFS 地址、账号、密码并连接服务器
|
||||
- 登录阶段完成 Collection 选择
|
||||
- 自动查找或创建当前 Collection 的默认 Workspace
|
||||
- 浏览固定 Collection 下的服务端目录树
|
||||
- 管理当前 Workspace 的 Mapping
|
||||
- 浏览 Collection 下的服务端目录树
|
||||
- 管理当前 Collection 下的默认 Workspace
|
||||
- 管理服务端路径与本地目录 Mapping
|
||||
- 获取最新文件
|
||||
- 对已映射目录执行目录对比
|
||||
- 查看文件 / 目录历史记录
|
||||
- 查看 changeset 影响的文件列表
|
||||
- 查看本地文件或服务器 latest 文件内容
|
||||
- 对比本地文件与服务器文件
|
||||
- 对比历史记录中两个版本
|
||||
- 签出、签入、新增、删除、撤销文件
|
||||
@@ -34,7 +32,7 @@ macTFS 是一个运行在 macOS 本机的 TFS 客户端，用于替代依赖 Int
|
||||
- API 优先：UI 和 CLI 都调用本地 API。
|
||||
- 复用 Java TFS SDK：不重写 TFS 协议。
|
||||
- 本地常驻服务：支持 UI 长会话和本地状态管理。
|
||||
- 工作台围绕固定 Collection / Workspace 上下文展开。
|
||||
- 交互参考 Visual Studio Team Explorer / Source Control Explorer。
|
||||
- 文件操作遵守 TFS Workspace / Pending Change 模型。
|
||||
- 第一版优先可用和清晰，不做过度自动化。
|
||||
|
||||
@@ -70,7 +68,7 @@ mactfs-server
|
||||
本地常驻 API 服务，负责路由、认证、会话、配置、日志。
|
||||
|
||||
mactfs-cli
|
||||
命令行入口，调用本地 API，保留调试能力。
|
||||
命令行入口，后续调用本地 API，保留调试能力。
|
||||
|
||||
mactfsui
|
||||
Electron + React 桌面 UI，调用本地 API。
|
||||
@@ -100,7 +98,7 @@ P0：
|
||||
- 文件历史查询
|
||||
- 目录历史查询
|
||||
- 单文件版本内容获取
|
||||
- 文件 Diff 基础能力
|
||||
- 文件 diff 基础能力
|
||||
- 目录对比状态计算
|
||||
|
||||
P1：
|
||||
@@ -152,58 +150,63 @@ P2：
|
||||
- SSE / WebSocket 实时日志
|
||||
- 异步 Job 模型
|
||||
|
||||
### 阶段三：CLI
|
||||
### 阶段三：Frontend
|
||||
|
||||
目标：实现本地 API 调试入口。
|
||||
目标：实现类 Visual Studio 的 TFS 桌面 UI。
|
||||
|
||||
P0：
|
||||
|
||||
- `mactfs token --show`
|
||||
- `mactfs health`
|
||||
- `mactfs api`
|
||||
- 兼容旧 `--action` 验证入口
|
||||
|
||||
### 阶段四：Frontend Workspace UI
|
||||
|
||||
目标：实现固定 Collection / Workspace 上下文的桌面工作台。
|
||||
|
||||
P0：
|
||||
|
||||
- Electron 启动服务、preload、API client
|
||||
- 登录页、Collection 选择、默认 Workspace 上下文
|
||||
- 顶部上下文栏、三栏工作台、底部操作台
|
||||
- 左侧目录树与中间列表同步导航
|
||||
- 对象右键菜单
|
||||
- Mapping、History、目录对比弹窗
|
||||
- 文件查看、Diff、冲突处理弹窗
|
||||
- Pending Changes 与 Checkin
|
||||
- 操作日志与刷新反馈
|
||||
- Electron 启动本地 Java 服务
|
||||
- 登录 / 配置页面
|
||||
- Collection 目录树
|
||||
- 中间目录文件列表
|
||||
- 右侧挂起更改面板
|
||||
- 底部操作日志
|
||||
- Mapping 创建
|
||||
- Get Latest
|
||||
- 目录对比
|
||||
- 签出 / 新增 / 删除 / 撤销 / 签入
|
||||
- 历史记录
|
||||
- 文件 diff
|
||||
|
||||
P1：
|
||||
|
||||
- 折叠面板交互打磨
|
||||
- 列表职责收口与动作编排整理
|
||||
- 更好的文件图标和状态色
|
||||
- 历史 changeset 详情抽屉
|
||||
- 操作结果 toast
|
||||
|
||||
P2：
|
||||
|
||||
- 用户自定义布局
|
||||
- 快捷键
|
||||
|
||||
### 阶段五：Feature
|
||||
### 阶段四：Feature
|
||||
|
||||
目标：按真实业务链路做端到端验收。
|
||||
目标：补齐核心 TFS 日常功能。
|
||||
|
||||
P0：
|
||||
|
||||
- 服务端目录浏览
|
||||
- Mapping 管理
|
||||
- Get Latest
|
||||
- 目录对比
|
||||
- 勾选差异文件处理
|
||||
- Pending Changes 管理
|
||||
- Checkin
|
||||
- Checkin comment 必填
|
||||
- History / Diff
|
||||
|
||||
### 阶段六：Release
|
||||
P1：
|
||||
|
||||
- 文件夹递归 Checkout 预估影响数量
|
||||
- Get Latest 支持文件 / 目录 / Mapping 粒度
|
||||
- 目录历史 changeset 文件列表
|
||||
|
||||
P2：
|
||||
|
||||
- 冲突解决器
|
||||
- Label / Branch / Merge
|
||||
- Work Item 查询与关联
|
||||
|
||||
### 阶段五：Release
|
||||
|
||||
目标：完成个人可用的 macOS 桌面分发。
|
||||
|
||||
@@ -278,6 +281,31 @@ curl -H "Authorization: Bearer $(mactfs token --show)" http://127.0.0.1:38765/ap
|
||||
|
||||
第一版允许明文保存密码，定位为个人开发模式。
|
||||
|
||||
示例：
|
||||
|
||||
```json
|
||||
{
|
||||
"serverUri": "http://tfs.example.com:8080/tfs/",
|
||||
"authType": "ntlm-explicit",
|
||||
"domain": "bdsoft",
|
||||
"username": "fenghp",
|
||||
"password": "plain-password",
|
||||
"collection": "PKUSEHR",
|
||||
"workspace": "mactfs-PKUSEHR-fenghp-macbook",
|
||||
"mappings": [
|
||||
{
|
||||
"serverPath": "$/Project/Main",
|
||||
"localPath": "/Users/fenghp/project/main"
|
||||
}
|
||||
]
|
||||
}
|
||||
```
|
||||
|
||||
风险说明：
|
||||
|
||||
- 明文密码只适合个人本机使用。
|
||||
- 后续产品化阶段再切换 macOS Keychain。
|
||||
|
||||
### 4.4 Workspace 策略
|
||||
|
||||
第一版规则：
|
||||
@@ -285,7 +313,6 @@ curl -H "Authorization: Bearer $(mactfs token --show)" http://127.0.0.1:38765/ap
|
||||
- 同一个 Collection 下，同一台电脑只创建一个默认 Workspace。
|
||||
- 一个 Workspace 不跨 Collection。
|
||||
- 一个 Workspace 支持多条 Mapping。
|
||||
- 工作台进入后固定 Collection，上下文变化通过重新连接完成。
|
||||
|
||||
Workspace 命名规则：
|
||||
|
||||
@@ -293,6 +320,12 @@ Workspace 命名规则：
|
||||
mactfs-{collection}-{username}-{computer}
|
||||
```
|
||||
|
||||
命名规范：
|
||||
|
||||
- 只保留字母、数字、横线、下划线
|
||||
- 空格、中文、点号替换为横线
|
||||
- 过长时截断
|
||||
|
||||
### 4.5 同步调用与超时
|
||||
|
||||
第一版 API 使用同步调用，接口等待 TFS 操作完成后返回。
|
||||
@@ -306,6 +339,20 @@ UI 必须在等待期间显示明确状态：
|
||||
- 正在签入
|
||||
- TFS 网络响应可能较慢
|
||||
|
||||
超时建议：
|
||||
|
||||
```text
|
||||
连接测试：30 秒
|
||||
目录浏览：120 秒
|
||||
历史查询：120 秒
|
||||
目录对比：120 秒
|
||||
单文件 diff：60 秒
|
||||
Get Latest：300 秒
|
||||
Checkin：300 秒
|
||||
```
|
||||
|
||||
第一版不做取消。超时或 TFS 异常时，后端停止当前操作并返回错误。
|
||||
|
||||
### 4.6 操作日志
|
||||
|
||||
服务端和 UI 记录每次操作：
|
||||
@@ -318,6 +365,15 @@ UI 必须在等待期间显示明确状态：
|
||||
- 成功 / 失败
|
||||
- 错误信息
|
||||
|
||||
示例：
|
||||
|
||||
```text
|
||||
[10:21:03] 开始目录对比：$/Project/src
|
||||
[10:21:18] 目录对比完成：发现 12 个差异，耗时 15.2s
|
||||
[10:22:01] 开始签入：3 个文件
|
||||
[10:22:06] 签入失败：TFxxxx 权限不足
|
||||
```
|
||||
|
||||
## 五、API 设计
|
||||
|
||||
### 5.1 基础接口
|
||||
@@ -342,13 +398,22 @@ GET /api/server-folder/items?path=$/Project/src
|
||||
```text
|
||||
GET /api/workspace
|
||||
POST /api/workspace/ensure
|
||||
GET /api/workspace/context
|
||||
GET /api/mappings
|
||||
POST /api/mappings/check-target
|
||||
POST /api/mappings
|
||||
DELETE /api/mappings
|
||||
```
|
||||
|
||||
Mapping 创建流程：
|
||||
|
||||
```text
|
||||
选中服务端目录
|
||||
选择本地目录
|
||||
保存 WorkingFolder mapping
|
||||
用户选择是否立即 Get Latest
|
||||
```
|
||||
|
||||
创建 Mapping 后，如果不立即 Get Latest，后续仍可对 Mapping 下的子目录或单个文件单独 Get Latest。
|
||||
|
||||
### 5.4 文件操作
|
||||
|
||||
```text
|
||||
@@ -359,32 +424,48 @@ POST /api/files/delete
|
||||
POST /api/files/undo
|
||||
POST /api/checkin
|
||||
GET /api/pending-changes
|
||||
GET /api/files/content
|
||||
POST /api/conflicts/apply
|
||||
```
|
||||
|
||||
Get Latest 支持：
|
||||
|
||||
- 单文件
|
||||
- 目录递归
|
||||
- 整个 Mapping
|
||||
|
||||
### 5.5 目录对比
|
||||
|
||||
```text
|
||||
POST /api/compare/folder
|
||||
```
|
||||
|
||||
目录对比返回状态：
|
||||
请求示例：
|
||||
|
||||
```json
|
||||
{
|
||||
"serverPath": "$/Project/src",
|
||||
"localPath": "/Users/fenghp/project/src",
|
||||
"recursive": true
|
||||
}
|
||||
```
|
||||
|
||||
返回状态：
|
||||
|
||||
```text
|
||||
localModified
|
||||
remoteChanged
|
||||
bothChanged
|
||||
localOnly
|
||||
remoteOnly
|
||||
notDownloaded
|
||||
localDeleted
|
||||
pendingEdit
|
||||
pendingAdd
|
||||
pendingDelete
|
||||
upToDate
|
||||
localModified 本地修改
|
||||
remoteChanged 服务端有更新
|
||||
bothChanged 本地和服务端都变更
|
||||
localOnly 本地新增
|
||||
remoteOnly 服务端新增
|
||||
notDownloaded 已映射但本地未下载
|
||||
localDeleted 本地删除
|
||||
pendingEdit 已签出编辑
|
||||
pendingAdd 待新增
|
||||
pendingDelete 待删除
|
||||
upToDate 本地与服务端一致，默认不展示
|
||||
```
|
||||
|
||||
目录对比不逐文件下载内容。第一步只做元数据和状态对比。用户打开单个文件 diff 时才获取对应服务端内容。
|
||||
|
||||
### 5.6 历史记录
|
||||
|
||||
```text
|
||||
@@ -392,6 +473,26 @@ GET /api/history?path=...
|
||||
GET /api/history/changeset?changeset=...
|
||||
```
|
||||
|
||||
规则：
|
||||
|
||||
- 文件历史：返回该文件最近 100 条历史。
|
||||
- 目录历史：返回影响该目录的最近 100 条 changeset。
|
||||
- 点击 changeset 后展示本次 changeset 影响的文件列表。
|
||||
- 第一版不做作者、时间、changeset 范围筛选。
|
||||
|
||||
changeset 文件列表字段：
|
||||
|
||||
```text
|
||||
path
|
||||
serverPath
|
||||
changeType
|
||||
itemType
|
||||
changeset
|
||||
author
|
||||
date
|
||||
comment
|
||||
```
|
||||
|
||||
### 5.7 Diff
|
||||
|
||||
```text
|
||||
@@ -404,24 +505,32 @@ POST /api/diff/revisions
|
||||
- 本地文件 vs 服务器 latest
|
||||
- 历史记录中两个 changeset 对比
|
||||
|
||||
第一版优先支持文本文件。
|
||||
|
||||
暂不支持：
|
||||
|
||||
- 三方 merge
|
||||
- 二进制可视化 diff
|
||||
- 目录级完整内容 diff
|
||||
|
||||
## 六、UI 设计
|
||||
|
||||
### 6.1 布局
|
||||
|
||||
工作台围绕固定 Collection / Workspace 展开：
|
||||
参考 Visual Studio Source Control Explorer。
|
||||
|
||||
```text
|
||||
顶部：
|
||||
当前连接、Collection、Workspace、全局入口
|
||||
当前连接、Collection、Workspace、常用操作
|
||||
|
||||
左侧：
|
||||
固定 Collection 下的服务端目录树
|
||||
Collection 下的 TFS 服务端目录树
|
||||
|
||||
中间：
|
||||
当前选中目录下一级文件 / 文件夹列表
|
||||
|
||||
右侧：
|
||||
Pending Changes、Included / Excluded、Checkin
|
||||
挂起的更改、签入 comment、签入 / 撤销等操作
|
||||
|
||||
底部：
|
||||
操作日志
|
||||
@@ -429,11 +538,26 @@ POST /api/diff/revisions
|
||||
|
||||
### 6.2 左侧目录树
|
||||
|
||||
左侧展示固定 Collection 下完整服务端目录树。
|
||||
左侧展示 Collection 下完整服务端目录树。
|
||||
|
||||
无论服务端目录是否已映射到本地，都允许浏览。
|
||||
|
||||
目录树节点操作优先通过右键菜单触发。
|
||||
未映射目录允许：
|
||||
|
||||
- 浏览子目录 / 文件
|
||||
- 查看历史
|
||||
- 查看 changeset 文件列表
|
||||
- 创建 Mapping
|
||||
- Get Latest 到新本地目录
|
||||
|
||||
未映射目录不允许：
|
||||
|
||||
- 本地目录对比
|
||||
- 本地 vs 云端 diff
|
||||
- checkout
|
||||
- add
|
||||
- delete
|
||||
- checkin
|
||||
|
||||
### 6.3 中间文件列表
|
||||
|
||||
@@ -445,44 +569,136 @@ POST /api/diff/revisions
|
||||
- 类型
|
||||
- 服务端路径
|
||||
- 本地路径
|
||||
- 是否已映射
|
||||
- 状态
|
||||
- 最新版本
|
||||
- 上次签入时间
|
||||
|
||||
中间区域只承载浏览，不再内嵌大块 Mapping、History、Diff、Compare 面板。
|
||||
已映射但本地未下载的文件显示：
|
||||
|
||||
### 6.4 Mapping、History 与目录对比
|
||||
```text
|
||||
未下载 / notDownloaded
|
||||
```
|
||||
|
||||
- Mapping 通过弹窗创建
|
||||
- History 通过弹窗展示
|
||||
- 目录对比通过弹窗展示
|
||||
- 目录对比默认隐藏 `upToDate`
|
||||
- 对象操作通过右键菜单触发
|
||||
可执行：
|
||||
|
||||
### 6.5 文件查看与 Diff
|
||||
- Get Latest
|
||||
- 查看历史
|
||||
|
||||
### 6.4 目录对比
|
||||
|
||||
对已映射目录可执行目录对比。
|
||||
|
||||
目录对比结果默认隐藏 `upToDate`，只展示差异文件。
|
||||
|
||||
用户勾选差异文件后，右侧根据状态展示可用操作。
|
||||
|
||||
操作映射：
|
||||
|
||||
```text
|
||||
localModified -> checkout / diff
|
||||
localOnly -> add / delete local
|
||||
localDeleted -> delete / restore from server
|
||||
remoteChanged -> get latest / diff
|
||||
notDownloaded -> get latest
|
||||
pendingEdit -> checkin / undo / diff
|
||||
pendingAdd -> checkin / undo
|
||||
pendingDelete -> checkin / undo
|
||||
bothChanged -> diff / 手工处理
|
||||
```
|
||||
|
||||
### 6.5 Checkout
|
||||
|
||||
已映射且本地存在的文件可直接 checkout。
|
||||
|
||||
已映射且本地存在的目录可递归 checkout。
|
||||
|
||||
目录级 checkout 必须二次确认：
|
||||
|
||||
```text
|
||||
将递归签出 N 个已版本控制文件，是否继续？
|
||||
```
|
||||
|
||||
执行后文件进入 `pendingEdit`。
|
||||
|
||||
不做实时自动 checkout。
|
||||
|
||||
### 6.6 Add
|
||||
|
||||
新增文件只从目录对比结果触发。
|
||||
|
||||
流程：
|
||||
|
||||
```text
|
||||
目录对比发现 localOnly
|
||||
用户勾选 localOnly 文件
|
||||
点击添加文件
|
||||
后端执行 pend add
|
||||
状态变为 pendingAdd
|
||||
```
|
||||
|
||||
### 6.7 Delete
|
||||
|
||||
删除模型：
|
||||
|
||||
- 已版本控制文件：执行 TFS pending delete，后续通过 checkin 提交。
|
||||
- 本地未版本控制文件：可直接删除本地文件。
|
||||
- 未下载服务端文件：第一版不允许删除。
|
||||
|
||||
### 6.8 Pending Changes
|
||||
|
||||
右侧挂起更改面板展示当前 Workspace 的 pending changes。
|
||||
|
||||
分为：
|
||||
|
||||
- Included Changes
|
||||
- Excluded Changes
|
||||
|
||||
签入只提交 Included Changes。
|
||||
|
||||
用户可在 Included / Excluded 间移动文件。
|
||||
|
||||
Included / Excluded 状态只在当前 UI 会话内保存，不持久化。
|
||||
|
||||
不要求左侧或中间选中文件与右侧 pending changes 联动。
|
||||
|
||||
### 6.9 Checkin
|
||||
|
||||
签入规则：
|
||||
|
||||
- 只提交 Included Changes。
|
||||
- 所有提交文件必须属于同一个 Workspace。
|
||||
- 可跨目录、跨 Mapping。
|
||||
- comment 必填。
|
||||
- 第一版不做 Work Item 绑定。
|
||||
- 第一版不做复杂 Check-in Policy UI。
|
||||
- 如果服务端返回 policy / 权限 / 冲突错误，直接展示错误信息。
|
||||
|
||||
### 6.10 History
|
||||
|
||||
文件历史：
|
||||
|
||||
- 展示最近 100 条。
|
||||
- 字段：changeset、作者、时间、comment。
|
||||
- 支持选择两个历史记录做 diff。
|
||||
|
||||
目录历史：
|
||||
|
||||
- 展示影响该目录的最近 100 条 changeset。
|
||||
- 点击 changeset 展示本次影响的文件列表。
|
||||
- 可从文件列表进入文件 diff。
|
||||
|
||||
### 6.11 Diff
|
||||
|
||||
支持：
|
||||
|
||||
- 已映射文件查看本地内容
|
||||
- 未映射文件查看服务器 latest 内容
|
||||
- 本地 vs latest Diff
|
||||
- 两个历史版本 Diff
|
||||
- 本地文件 vs 服务器 latest
|
||||
- 历史中两个版本对比
|
||||
|
||||
大文件、二进制文件、非 Mapping 路径需要明确提示。
|
||||
展示方式：
|
||||
|
||||
### 6.6 Pending Changes 与 Checkin
|
||||
|
||||
- 右侧挂起更改面板展示当前 Workspace 的 pending changes
|
||||
- 分为 Included / Excluded
|
||||
- Checkin 只提交 Included Changes
|
||||
- Checkin 保留在右侧面板，不使用单独弹窗
|
||||
|
||||
### 6.7 冲突处理
|
||||
|
||||
- Get Latest 和 Checkout 复用统一冲突弹窗
|
||||
- 支持服务器版本 / 保留本地版本选择
|
||||
- 冲突项可进入 Diff
|
||||
- 第一版不做手动冲突块编辑
|
||||
- 文本文件左右对比
|
||||
- 目录级只显示差异列表，不展开所有文件 diff
|
||||
|
||||
## 七、核心业务流程
|
||||
|
||||
@@ -493,48 +709,31 @@ POST /api/diff/revisions
|
||||
点击连接
|
||||
服务端认证 TFS
|
||||
查询 Collection
|
||||
用户确认 Collection
|
||||
自动确保默认 Workspace
|
||||
进入工作台
|
||||
保存默认配置
|
||||
进入主界面
|
||||
```
|
||||
|
||||
### 7.2 创建 Mapping
|
||||
|
||||
```text
|
||||
左侧或中间选择服务端目录
|
||||
通过右键菜单打开映射弹窗
|
||||
选择本地父目录
|
||||
调用本地后端预校验最终目标路径
|
||||
如果目标目录已存在，则提示“已存在，禁止映射”并禁止确认
|
||||
左侧选择服务端目录
|
||||
点击映射到本地
|
||||
选择本地目录
|
||||
保存 Mapping
|
||||
用户选择是否立即 Get Latest
|
||||
```
|
||||
|
||||
补充约束：
|
||||
|
||||
- Mapping 只允许目录创建，不允许文件创建
|
||||
- 前端只上传 `serverPath` 与 `localParentPath`
|
||||
- 最终本地目标路径由本地后端按“父目录 + 服务端目录最后一段”规则计算
|
||||
- 当前版本由本地后端负责最终路径存在校验与目录创建
|
||||
- 已映射目录不再展示“映射到本地”
|
||||
- 取消映射只解除 Mapping，不删除本地文件
|
||||
- 取消映射后页面保持当前浏览位置，只更新动作可用性
|
||||
|
||||
### 7.3 目录对比并处理差异
|
||||
|
||||
```text
|
||||
选择已映射目录
|
||||
打开目录对比弹窗
|
||||
点击目录对比
|
||||
系统返回差异列表
|
||||
用户通过右键菜单执行 checkout / add / delete / get latest / undo
|
||||
如有冲突，进入统一冲突弹窗
|
||||
用户勾选文件
|
||||
根据差异类型执行 checkout / add / delete / get latest / undo
|
||||
重新对比或刷新 pending changes
|
||||
```
|
||||
|
||||
补充约束：
|
||||
|
||||
- 未映射目录仍允许浏览、查看历史、打开目录对比
|
||||
- 依赖本地工作区的动作在未映射目录下保留菜单项，但置灰不可点击
|
||||
|
||||
### 7.4 签入
|
||||
|
||||
```text
|
||||
@@ -551,7 +750,7 @@ POST /api/diff/revisions
|
||||
|
||||
```text
|
||||
选择文件或目录
|
||||
打开历史弹窗
|
||||
点击历史
|
||||
展示最近 100 条
|
||||
文件历史可选择两个版本对比
|
||||
目录历史可点击 changeset 查看文件列表
|
||||
@@ -569,8 +768,9 @@ POST /api/diff/revisions
|
||||
- Work Item 绑定
|
||||
- 完整 Check-in Policy UI
|
||||
- 三方 merge
|
||||
- 手动冲突块编辑
|
||||
- 复杂冲突解决
|
||||
- Label / Branch / Merge
|
||||
- Git hook 模拟 TFS
|
||||
- macOS Keychain 默认存储
|
||||
|
||||
## 九、风险与约束
|
||||
@@ -581,10 +781,19 @@ POST /api/diff/revisions
|
||||
|
||||
Apple Silicon 下需使用 x86_64 JDK 8 + Rosetta。
|
||||
|
||||
第一版需要固定运行方式：
|
||||
|
||||
```text
|
||||
x86_64 JDK 8
|
||||
com.microsoft.tfs.jni.native.base-directory 指向 tfsIntegration/lib/native
|
||||
```
|
||||
|
||||
### 9.2 明文密码
|
||||
|
||||
第一版允许明文保存密码，只适合个人本机使用。
|
||||
|
||||
后续产品化必须改为 Keychain。
|
||||
|
||||
### 9.3 大目录性能
|
||||
|
||||
目录对比、目录历史、Get Latest 可能受 TFS 网络和目录规模影响。
|
||||
@@ -593,7 +802,7 @@ Apple Silicon 下需使用 x86_64 JDK 8 + Rosetta。
|
||||
|
||||
- 同步等待状态提示
|
||||
- 超时失败
|
||||
- 默认隐藏 `upToDate`
|
||||
- 默认隐藏 upToDate
|
||||
- 历史限制 100 条
|
||||
|
||||
控制复杂度。
|
||||
@@ -602,43 +811,44 @@ Apple Silicon 下需使用 x86_64 JDK 8 + Rosetta。
|
||||
|
||||
TFS 不等同 Git。
|
||||
|
||||
本地文件可写不代表 TFS pending edit。
|
||||
|
||||
签入前必须通过 checkout / add / delete 把本地变化转换为 pending changes。
|
||||
|
||||
## 十、验收标准
|
||||
|
||||
P0 验收：
|
||||
|
||||
- 能启动本地 API 服务
|
||||
- API 只监听 `127.0.0.1`
|
||||
- API 需要 Bearer token
|
||||
- 能输入账号密码连接 TFS
|
||||
- 能选择 Collection 并固定上下文
|
||||
- 能创建 / 复用当前 Collection 的默认 Workspace
|
||||
- 能浏览固定 Collection 下目录树
|
||||
- 能创建 Mapping
|
||||
- 能选择是否立即 Get Latest
|
||||
- 能对已映射目录执行目录对比
|
||||
- 能对差异文件执行 checkout / add / delete / get latest / undo
|
||||
- 能查看 pending changes
|
||||
- 能区分 Included / Excluded
|
||||
- 能填写 comment 并签入 Included Changes
|
||||
- 能查看文件历史
|
||||
- 能查看目录历史
|
||||
- 能查看 changeset 影响文件列表
|
||||
- 能查看文件内容
|
||||
- 能做本地 vs latest Diff
|
||||
- 能选择两个历史版本 Diff
|
||||
- UI 有操作日志
|
||||
- 能启动本地 API 服务。
|
||||
- API 只监听 `127.0.0.1`。
|
||||
- API 需要 Bearer token。
|
||||
- 能输入账号密码连接 TFS。
|
||||
- 能查询 Collection。
|
||||
- 能浏览 Collection 下目录树。
|
||||
- 能创建 / 复用当前 Collection 的默认 Workspace。
|
||||
- 能创建 Mapping。
|
||||
- 能选择是否立即 Get Latest。
|
||||
- 能对已映射目录执行目录对比。
|
||||
- 能对差异文件执行 checkout / add / delete / get latest / undo。
|
||||
- 能查看 pending changes。
|
||||
- 能区分 Included / Excluded。
|
||||
- 能填写 comment 并签入 Included Changes。
|
||||
- 能查看文件历史。
|
||||
- 能查看目录历史。
|
||||
- 能查看 changeset 影响文件列表。
|
||||
- 能做本地 vs latest diff。
|
||||
- 能选择两个历史版本 diff。
|
||||
- UI 有操作日志。
|
||||
|
||||
## 十一、推荐实施顺序
|
||||
|
||||
1. 抽 `mactfs-core`，迁移当前 `TfsPhaseOneService` 能力。
|
||||
2. 新增 `mactfs-server`，接入 SparkJava 和 token auth。
|
||||
3. 改造 `mactfs-cli`，保留调试入口。
|
||||
4. 完成前端基础设施：Electron、preload、API client。
|
||||
5. 完成连接页、固定 Collection / Workspace 上下文。
|
||||
6. 完成工作台布局、目录树、中间列表。
|
||||
7. 完成右键菜单、Mapping / History / Compare 弹窗。
|
||||
8. 完成文件查看、Diff、冲突流程。
|
||||
9. 完成 Pending Changes、Checkin、操作日志。
|
||||
10. 完成 Feature E2E 与 Release。
|
||||
3. 实现配置、连接、Collection、目录浏览 API。
|
||||
4. 实现 Workspace / Mapping / Get Latest API。
|
||||
5. 实现 pending changes、checkout、add、delete、undo、checkin API。
|
||||
6. 实现目录对比 API。
|
||||
7. 实现 history 和 diff API。
|
||||
8. 改造 `mactfsui`，实现 Visual Studio 风格主界面。
|
||||
9. 接入操作日志。
|
||||
10. 完成打包和运行说明。
|
||||
|
||||
+54
-47
@@ -785,14 +785,25 @@ Content-Type: application/json
|
||||
### 5.1 页面结构
|
||||
|
||||
```
|
||||
┌──────────────────────────────────────────────────────────────┐
|
||||
│ Top Bar: 连接状态 / Server / Collection / Workspace / 全局入口 │
|
||||
├──────────────┬────────────────────────────────┬──────────────┤
|
||||
│ Source Tree │ Current Folder Items │ Changes │
|
||||
│ 左侧目录树 │ 中间目录文件列表 │ Pending/Checkin│
|
||||
├──────────────┴────────────────────────────────┴──────────────┤
|
||||
│ Operation Console / 底部日志面板（可折叠） │
|
||||
└──────────────────────────────────────────────────────────────┘
|
||||
┌─────────────────────────────────────────────────┐
|
||||
│ 顶部导航栏 │
|
||||
│ [连接状态: ●已连接] [当前工作区: mactfs-xxx] │
|
||||
├─────────────┬───────────────────────────────────┤
|
||||
│ 侧边栏 │ 主内容区 │
|
||||
│ │ │
|
||||
│ 连接配置 │ (根据侧边栏选中项切换) │
|
||||
│ 工作区管理 │ │
|
||||
│ 映射管理 │ │
|
||||
│ 目录浏览 │ │
|
||||
│ 文件操作 │ │
|
||||
│ 历史记录 │ │
|
||||
│ 文件对比 │ │
|
||||
│ │ │
|
||||
├─────────────┴───────────────────────────────────┤
|
||||
│ 底部日志面板（可折叠） │
|
||||
│ [2026-05-28 20:30:01] Login success │
|
||||
│ [2026-05-28 20:30:02] Get latest: 142 files │
|
||||
└─────────────────────────────────────────────────┘
|
||||
```
|
||||
|
||||
### 5.2 各页面说明
|
||||
@@ -803,46 +814,44 @@ Content-Type: application/json
|
||||
- 操作按钮：测试连接、保存配置
|
||||
- 状态指示：连接状态（未连接/连接中/已连接/连接失败）
|
||||
|
||||
#### 上下文确认流程
|
||||
#### 工作区管理页
|
||||
|
||||
- 登录成功后加载 Collection 列表
|
||||
- 用户确认当前 Collection
|
||||
- 系统自动查找或创建默认 Workspace
|
||||
- 工作台内不提供 Workspace 手动选择
|
||||
- 工作区列表（表格展示：名称、Owner、Computer、映射数量）
|
||||
- 操作：创建工作区、选择工作区、删除工作区
|
||||
- 选中工作区后自动加载映射列表
|
||||
|
||||
#### Mapping 弹窗
|
||||
#### 映射管理页
|
||||
|
||||
- 从目录树或文件列表触发“映射到本地”
|
||||
- 选择服务端路径与本地目录
|
||||
- 选择是否立即 Get Latest
|
||||
- 创建后刷新当前工作台状态
|
||||
- 当前工作区的映射列表（表格：服务端路径、本地路径、操作）
|
||||
- 添加映射：选择服务端路径（打开目录浏览器）+ 选择本地路径（打开系统目录选择器）
|
||||
- 删除映射
|
||||
- 每条映射可以单独执行 Get Latest
|
||||
|
||||
#### 目录浏览工作台
|
||||
#### 目录浏览页
|
||||
|
||||
- 左侧树形展开的服务端目录结构
|
||||
- 中间展示当前目录下一级文件 / 文件夹
|
||||
- 单击选中，双击目录进入
|
||||
- 对象操作通过右键菜单触发
|
||||
- 树形展开的服务端目录结构
|
||||
- 点击文件夹展开子目录
|
||||
- 点击文件查看属性（名称、类型、大小、最后修改版本）
|
||||
- 右键菜单：获取最新、查看历史、对比
|
||||
|
||||
#### 右侧 Changes 面板
|
||||
#### 文件操作页
|
||||
|
||||
- 待处理变更列表（Pending Changes）
|
||||
- Included / Excluded 分组
|
||||
- 签入注释输入 + 签入按钮
|
||||
- 查看、比较、撤销等对象操作走右键菜单
|
||||
- 文件状态标识：edit / add / delete
|
||||
- 批量操作：全选、签入选中、撤销选中
|
||||
- 签入表单：注释输入 + 文件勾选 + 签入按钮
|
||||
|
||||
#### History 弹窗
|
||||
#### 历史记录页
|
||||
|
||||
- 输入路径或对象上下文触发
|
||||
- 历史列表（Changeset ID、提交人、日期、注释）
|
||||
- 输入路径查询历史
|
||||
- 历史列表（表格：Changeset ID、提交人、日期、注释）
|
||||
- 点击 Changeset 查看详情
|
||||
- 点击文件进入查看或 Diff
|
||||
- 点击文件查看该版本内容
|
||||
|
||||
#### 文件查看与 Diff 弹窗
|
||||
#### 文件对比页
|
||||
|
||||
- 左右分栏对比视图
|
||||
- 支持本地 vs 云端对比
|
||||
- 支持两个历史版本对比
|
||||
- 差异行高亮标记
|
||||
|
||||
---
|
||||
@@ -851,7 +860,7 @@ Content-Type: application/json
|
||||
|
||||
### 第二阶段：HTTP 服务 + 最小可用 UI
|
||||
|
||||
**目标：** 将 CLI 升级为常驻 HTTP 服务，完成连接、固定 Collection / Workspace 上下文、映射和 Get Latest 的界面化。
|
||||
**目标：** 将 CLI 升级为常驻 HTTP 服务，完成连接、工作区、映射和 Get Latest 的界面化。
|
||||
|
||||
**后端任务：**
|
||||
|
||||
@@ -863,18 +872,17 @@ Content-Type: application/json
|
||||
|
||||
**前端任务：**
|
||||
|
||||
1. `mactfsui` 从 spawn CLI 改为 HTTP 调用
|
||||
2. 实现 Electron 启动服务、preload 和 API client
|
||||
3. 实现连接页与 Collection 选择
|
||||
4. 自动确保默认 Workspace，不单独提供 Workspace 管理页
|
||||
5. 实现固定 Collection 下的目录树与当前目录列表
|
||||
6. 实现 Mapping 弹窗、Get Latest、底部日志面板
|
||||
1. mactfsui 从 spawn CLI 改为 HTTP 调用
|
||||
2. 实现连接配置页
|
||||
3. 实现工作区管理页
|
||||
4. 实现映射管理页（含目录浏览）
|
||||
5. 实现 Get Latest 操作页
|
||||
6. 实现底部日志面板
|
||||
|
||||
**验收标准：**
|
||||
|
||||
- 用户可通过界面完成登录
|
||||
- 用户可在登录阶段确认 Collection
|
||||
- 用户进入工作台后可自动使用或创建默认 Workspace
|
||||
- 用户可通过界面管理工作区
|
||||
- 用户可通过界面添加/查看/删除映射
|
||||
- 用户可通过界面执行 Get Latest
|
||||
- curl 可直接调用所有 API
|
||||
@@ -894,11 +902,10 @@ Content-Type: application/json
|
||||
|
||||
**前端任务：**
|
||||
|
||||
1. 实现 Pending Changes + Checkin 右侧面板
|
||||
2. 实现 History 弹窗
|
||||
3. 实现文件查看与 Diff 弹窗
|
||||
4. 实现目录对比、右键菜单和冲突弹窗
|
||||
5. 完善操作进度展示
|
||||
1. 实现文件操作页（Pending Changes + 签入表单）
|
||||
2. 实现历史记录页
|
||||
3. 实现文件对比页（差异视图）
|
||||
4. 操作进度展示
|
||||
|
||||
### 第四阶段：增强能力
|
||||
|
||||
|
||||
@@ -1,96 +0,0 @@
|
||||
# macTFS 工作台增强需求（对照 Visual Studio 源代码管理）
|
||||
|
||||
## 一、背景
|
||||
|
||||
前端阶段（FE-001 ~ FE-013）完成后，用户按真实业务试用工作台，对照 Visual Studio
|
||||
Source Control Explorer 提出了一批体验与功能缺口。本文档收口这批需求，
|
||||
作为 `task/frontend` 中 FE-014 ~ FE-017 的需求来源。
|
||||
|
||||
## 二、用户反馈与根因分析
|
||||
|
||||
### 2.1 获取最新会静默覆盖本地修改（最严重）
|
||||
|
||||
- 现象：本地改了文件（未签出），执行「获取最新」后本地改动被直接覆盖，无提示、无对比
|
||||
- 根因：core `getLatest` 固定使用 `GetOptions.GET_ALL | OVERWRITE`，等价于 VS 的
|
||||
「强制获取（覆盖本地）」；安全模式应当用 `GetOptions.NONE`，让本地有改动的文件
|
||||
产生 writable / 版本冲突并走冲突处理
|
||||
- VS 行为：Get Latest 默认不覆盖本地可写文件，提示冲突并允许对比后再决定
|
||||
|
||||
### 2.2 目录历史下钻的文件列表没有对象操作
|
||||
|
||||
- 现象：目录历史 → 点 changeset 看到影响文件，但这些文件行没有右键菜单
|
||||
- VS 行为：changeset 明细中的文件可以继续查看历史、查看该版本内容、做对比
|
||||
|
||||
### 2.3 缺少强制获取与获取指定版本
|
||||
|
||||
- 现象：没有「强制获取最新（覆盖本地）」；也没有「获取此历史版本（把目录/文件回到
|
||||
某个 changeset）」
|
||||
- VS 行为：Get Specific Version 支持选择版本 + Overwrite 选项
|
||||
|
||||
### 2.4 历史与 Diff 弹窗偏小、对比不好用
|
||||
|
||||
- 现象：弹窗小；长文件没有缩略定位；只有单栏统一视图，没有左右分栏对照
|
||||
- VS 行为：对比窗口左右分栏、有差异概览与上一处/下一处差异导航
|
||||
|
||||
### 2.5 右侧挂起更改面板没有手动刷新
|
||||
|
||||
- 现象：外部（CLI / 其它工具）产生的挂起更改无法手动拉新
|
||||
- 同类：左侧树、中间列表也缺少手动刷新入口（FE-012 仅日志面板有刷新）
|
||||
|
||||
## 三、我方补充分析（对照 VS 还存在的差距）
|
||||
|
||||
| 能力 | VS | 当前 | 本批处理 |
|
||||
|---|---|---|---|
|
||||
| 安全获取 / 强制获取 | 区分 | 只有强制 | ✅ FE-014 |
|
||||
| 获取指定版本 | 支持 | 无 | ✅ FE-014 |
|
||||
| changeset 明细对象操作 | 支持 | 无 | ✅ FE-015 |
|
||||
| 目录对比 localOnly「加入版本控制」 | 支持（pend add） | 菜单缺失 | ✅ FE-015 |
|
||||
| 左右分栏 Diff + 差异导航 | 支持 | 单栏 | ✅ FE-016 |
|
||||
| 各面板手动刷新 | 支持 | 仅日志 | ✅ FE-017 |
|
||||
| 重命名 / 移动 / 分支 / Shelve | 支持 | 无 | ❌ 超出第一版范围 |
|
||||
| 二进制可视化对比 / 三方合并 | 支持 | 无 | ❌ PRD 明确不做 |
|
||||
|
||||
## 四、需求定义
|
||||
|
||||
### R1 安全获取与强制获取 / 获取指定版本（FE-014）
|
||||
|
||||
- core `getLatest` 增加 `force` 参数：
|
||||
- `force=false`（默认）：`GetOptions.NONE`，本地改动产生冲突而不是被覆盖
|
||||
- `force=true`：维持 `GET_ALL | OVERWRITE`
|
||||
- core 新增 `getVersion`：按 changeset 获取指定版本（`ChangesetVersionSpec` +
|
||||
`GET_ALL | OVERWRITE`，对应 VS Get Specific Version + Overwrite）
|
||||
- server `/api/files/get-latest` 透传 `force`；新增 `/api/files/get-version`
|
||||
- 前端：
|
||||
- 右键「获取最新」默认安全模式；出现冲突时按既有冲突弹窗流程处理
|
||||
- 右键新增「强制获取最新…」，需确认弹窗（明确提示会覆盖本地修改）
|
||||
- 历史弹窗（文件与目录）支持「获取此版本…」，需确认弹窗
|
||||
- Checkout 前置的 Get Latest 维持安全模式
|
||||
|
||||
### R2 历史与对比结果的对象操作完善（FE-015）
|
||||
|
||||
- changeset 文件列表行提供右键菜单：
|
||||
- 查看此版本内容（按 changeset 读文件内容）
|
||||
- 查看该文件历史（切换历史弹窗目标为该文件）
|
||||
- 获取此版本…（带确认，复用 R1）
|
||||
- 目录对比结果 `localOnly` 项菜单提供「加入版本控制」（pend add），
|
||||
完成后刷新挂起更改
|
||||
|
||||
### R3 Diff 与历史弹窗体验优化（FE-016）
|
||||
|
||||
- 历史 / Diff / 目录对比弹窗尺寸提升（接近满屏宽高）
|
||||
- Diff 支持「统一 / 左右分栏」两种视图切换，左右分栏旧版在左、新版在右
|
||||
- 增加差异概览条（minimap）：标记差异块位置，点击跳转
|
||||
- 增加「上一处 / 下一处差异」导航按钮
|
||||
- 文件查看弹窗同步放大
|
||||
|
||||
### R4 工作台手动刷新（FE-017）
|
||||
|
||||
- 右侧挂起更改面板头部加刷新按钮
|
||||
- 中间列表路径栏加刷新按钮（重新加载当前目录）
|
||||
- 左侧树头部加刷新按钮（重置并重新加载根）
|
||||
|
||||
## 五、不在本批范围
|
||||
|
||||
- 重命名 / 移动 / 分支 / 合并 / Shelve / Work Item
|
||||
- 二进制可视化对比、三方合并编辑器
|
||||
- 多 Workspace 切换 UI
|
||||
@@ -257,10 +257,9 @@ TFS 的 Workspace 模型天然绑定：
|
||||
### 2. 功能范围
|
||||
|
||||
- 登录页
|
||||
- Collection 选择
|
||||
- 固定 Collection / Workspace 工作台
|
||||
- 映射配置弹窗
|
||||
- 执行 Get Latest 的操作入口
|
||||
- Workspace 管理页
|
||||
- 映射配置页
|
||||
- 执行 Get Latest 的操作页
|
||||
- 日志输出区域
|
||||
|
||||
### 3. 页面范围
|
||||
@@ -274,12 +273,11 @@ TFS 的 Workspace 模型天然绑定：
|
||||
- Password
|
||||
- 连接测试按钮
|
||||
|
||||
#### 上下文确认
|
||||
#### Workspace 页
|
||||
|
||||
- 登录成功后加载 Collection
|
||||
- 用户确认 Collection
|
||||
- 系统自动查找或创建默认 Workspace
|
||||
- 工作台内不提供 Workspace 手动选择
|
||||
- 列出已有 Workspace
|
||||
- 创建 Workspace
|
||||
- 选择 Workspace
|
||||
|
||||
#### 映射页
|
||||
|
||||
@@ -296,8 +294,7 @@ TFS 的 Workspace 模型天然绑定：
|
||||
### 4. 验收标准
|
||||
|
||||
- 用户可通过界面完成登录
|
||||
- 用户可通过界面确认 Collection
|
||||
- 用户进入工作台后可自动使用或创建默认 Workspace
|
||||
- 用户可通过界面完成 Workspace 选择或创建
|
||||
- 用户可通过界面完成映射配置
|
||||
- 用户可通过界面执行 Get Latest
|
||||
|
||||
|
||||
@@ -18,8 +18,6 @@ dependencies {
|
||||
implementation 'com.sparkjava:spark-core:2.9.4'
|
||||
implementation 'com.fasterxml.jackson.core:jackson-databind:2.13.5'
|
||||
implementation 'org.slf4j:slf4j-simple:1.7.36'
|
||||
// 文本 Diff 算法库（Myers 算法），4.12 为兼容 Java 8 的稳定版本。
|
||||
implementation 'io.github.java-diff-utils:java-diff-utils:4.12'
|
||||
}
|
||||
|
||||
application {
|
||||
|
||||
@@ -1,2 +0,0 @@
|
||||
# 固定使用项目内置 JDK 构建与运行，避免受系统环境 JAVA_HOME / PATH 影响。
|
||||
org.gradle.java.home=/Users/fenghp/Desktop/DEV/project/mydev/zulu8.94.0.17-ca-jdk8.0.492-macosx_x64/Contents/Home
|
||||
@@ -4,7 +4,11 @@ import java.io.File;
|
||||
import java.io.FileInputStream;
|
||||
import java.io.FileOutputStream;
|
||||
import java.io.IOException;
|
||||
import java.nio.charset.StandardCharsets;
|
||||
import java.nio.file.Files;
|
||||
import java.util.Properties;
|
||||
import java.util.regex.Matcher;
|
||||
import java.util.regex.Pattern;
|
||||
|
||||
/**
|
||||
* 保存最近一次成功连接与映射结果，供第一阶段 CLI 复用输入。
|
||||
@@ -12,6 +16,7 @@ import java.util.Properties;
|
||||
public class LocalConfigStore {
|
||||
|
||||
private final File configFile;
|
||||
private final File serverConfigFile;
|
||||
|
||||
public LocalConfigStore() {
|
||||
File configDirectory = new File(System.getProperty("user.home"), ".mactfs");
|
||||
@@ -19,20 +24,26 @@ public class LocalConfigStore {
|
||||
configDirectory.mkdirs();
|
||||
}
|
||||
this.configFile = new File(configDirectory, "phase-one.properties");
|
||||
this.serverConfigFile = new File(configDirectory, "config.json");
|
||||
}
|
||||
|
||||
/**
|
||||
* 读取第一阶段配置；本地 API 配置存在时优先使用 config.json 的当前连接上下文。
|
||||
*/
|
||||
public Properties load() throws IOException {
|
||||
Properties properties = new Properties();
|
||||
if (!configFile.exists()) {
|
||||
return properties;
|
||||
}
|
||||
|
||||
if (configFile.exists()) {
|
||||
FileInputStream inputStream = new FileInputStream(configFile);
|
||||
try {
|
||||
properties.load(inputStream);
|
||||
} finally {
|
||||
inputStream.close();
|
||||
}
|
||||
}
|
||||
|
||||
if (serverConfigFile.exists()) {
|
||||
mergeServerConfig(properties);
|
||||
}
|
||||
return properties;
|
||||
}
|
||||
|
||||
@@ -48,4 +59,46 @@ public class LocalConfigStore {
|
||||
public File getConfigFile() {
|
||||
return configFile;
|
||||
}
|
||||
|
||||
/**
|
||||
* 将第二阶段本地 API 配置转换为旧 CLI 可复用的属性名。
|
||||
*/
|
||||
private void mergeServerConfig(Properties properties) throws IOException {
|
||||
String json = new String(Files.readAllBytes(serverConfigFile.toPath()), StandardCharsets.UTF_8);
|
||||
copyJsonString(json, properties, "serverUri", "server-uri");
|
||||
copyJsonString(json, properties, "authType", "auth-type");
|
||||
copyJsonString(json, properties, "domain", "domain");
|
||||
copyJsonString(json, properties, "username", "username");
|
||||
copyJsonString(json, properties, "password", "password");
|
||||
copyJsonString(json, properties, "collection", "collection");
|
||||
copyJsonString(json, properties, "workspace", "workspace");
|
||||
copyJsonString(json, properties, "serverPath", "server-path");
|
||||
copyJsonString(json, properties, "localPath", "local-path");
|
||||
}
|
||||
|
||||
/**
|
||||
* 复制 JSON 字符串字段，保持旧 CLI 配置读取逻辑不依赖服务端模块。
|
||||
*/
|
||||
private void copyJsonString(String json, Properties properties, String jsonKey, String propertyKey) {
|
||||
String value = jsonString(json, jsonKey);
|
||||
if (!isBlank(value)) {
|
||||
properties.setProperty(propertyKey, value);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 从简单配置 JSON 中提取字符串字段。
|
||||
*/
|
||||
private String jsonString(String json, String key) {
|
||||
Pattern pattern = Pattern.compile("\"" + Pattern.quote(key) + "\"\\s*:\\s*\"((?:\\\\.|[^\"])*)\"");
|
||||
Matcher matcher = pattern.matcher(json);
|
||||
return matcher.find() ? matcher.group(1).replace("\\\"", "\"") : null;
|
||||
}
|
||||
|
||||
/**
|
||||
* 判断字符串是否为空。
|
||||
*/
|
||||
private boolean isBlank(String value) {
|
||||
return value == null || value.trim().isEmpty();
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,8 +1,5 @@
|
||||
package com.mydev.mactfs.core;
|
||||
|
||||
import com.github.difflib.DiffUtils;
|
||||
import com.github.difflib.patch.AbstractDelta;
|
||||
import com.github.difflib.patch.Patch;
|
||||
import com.microsoft.tfs.core.TFSConfigurationServer;
|
||||
import com.microsoft.tfs.core.TFSTeamProjectCollection;
|
||||
import com.microsoft.tfs.core.clients.framework.configuration.TFSEntitySession;
|
||||
@@ -21,8 +18,6 @@ import com.microsoft.tfs.core.clients.versioncontrol.exceptions.WorkspaceNotFoun
|
||||
import com.microsoft.tfs.core.clients.versioncontrol.soapextensions.Change;
|
||||
import com.microsoft.tfs.core.clients.versioncontrol.soapextensions.ChangeType;
|
||||
import com.microsoft.tfs.core.clients.versioncontrol.soapextensions.Changeset;
|
||||
import com.microsoft.tfs.core.clients.versioncontrol.soapextensions.Conflict;
|
||||
import com.microsoft.tfs.core.clients.versioncontrol.soapextensions.ConflictType;
|
||||
import com.microsoft.tfs.core.clients.versioncontrol.soapextensions.DeletedState;
|
||||
import com.microsoft.tfs.core.clients.versioncontrol.soapextensions.ExtendedItem;
|
||||
import com.microsoft.tfs.core.clients.versioncontrol.soapextensions.GetRequest;
|
||||
@@ -33,7 +28,6 @@ import com.microsoft.tfs.core.clients.versioncontrol.soapextensions.LockLevel;
|
||||
import com.microsoft.tfs.core.clients.versioncontrol.soapextensions.PendingChange;
|
||||
import com.microsoft.tfs.core.clients.versioncontrol.soapextensions.PendingSet;
|
||||
import com.microsoft.tfs.core.clients.versioncontrol.soapextensions.RecursionType;
|
||||
import com.microsoft.tfs.core.clients.versioncontrol.soapextensions.Resolution;
|
||||
import com.microsoft.tfs.core.clients.versioncontrol.soapextensions.WorkingFolder;
|
||||
import com.microsoft.tfs.core.clients.versioncontrol.soapextensions.Workspace;
|
||||
import com.microsoft.tfs.core.clients.versioncontrol.specs.ItemSpec;
|
||||
@@ -67,8 +61,6 @@ public class MacTfsCoreService {
|
||||
|
||||
private static final int HISTORY_LIMIT = 100;
|
||||
private static final Charset TEXT_CHARSET = Charset.forName("UTF-8");
|
||||
private static final long MAX_TEXT_CONTENT_BYTES = 2L * 1024 * 1024;
|
||||
private static final int BINARY_SNIFF_BYTES = 8000;
|
||||
|
||||
/**
|
||||
* 验证 TFS 地址和账号可用性，并返回当前账号可见 Collection 数量。
|
||||
@@ -227,71 +219,33 @@ public class MacTfsCoreService {
|
||||
}
|
||||
|
||||
/**
|
||||
* 对文件、目录或整个 Workspace 执行 Get Latest（默认安全模式，不覆盖本地改动）。
|
||||
* 对文件、目录或整个 Workspace 执行 Get Latest。
|
||||
*/
|
||||
public CoreOperationResult<TfsGetLatestResult> getLatest(final TfsConnectionConfig config,
|
||||
final String collectionName,
|
||||
final String workspaceName,
|
||||
final String serverPath,
|
||||
final boolean recursive) {
|
||||
return getLatest(config, collectionName, workspaceName, serverPath, recursive, false);
|
||||
}
|
||||
|
||||
/**
|
||||
* 对文件、目录或整个 Workspace 执行 Get Latest。
|
||||
* force=false 走安全模式（GetOptions.NONE），本地有改动的文件会产生冲突而不会被覆盖；
|
||||
* force=true 等价 Visual Studio 的强制获取（GET_ALL + OVERWRITE），直接覆盖本地。
|
||||
*/
|
||||
public CoreOperationResult<TfsGetLatestResult> getLatest(final TfsConnectionConfig config,
|
||||
final String collectionName,
|
||||
final String workspaceName,
|
||||
final String serverPath,
|
||||
final boolean recursive,
|
||||
final boolean force) {
|
||||
return execute("getLatest", new CoreCallable<TfsGetLatestResult>() {
|
||||
@Override
|
||||
public TfsGetLatestResult call(List<String> logs) throws Exception {
|
||||
Workspace workspace = loadWorkspace(config, collectionName, workspaceName);
|
||||
GetOptions options = force ? GetOptions.GET_ALL.combine(GetOptions.OVERWRITE) : GetOptions.NONE;
|
||||
GetStatus status;
|
||||
String normalizedPath = serverPath == null || serverPath.trim().isEmpty() ? null : normalizeServerPath(serverPath);
|
||||
if (normalizedPath == null) {
|
||||
status = workspace.get(options);
|
||||
logs.add("Get latest workspace: " + workspace.getName() + (force ? " (force)" : ""));
|
||||
status = workspace.get(GetOptions.GET_ALL.combine(GetOptions.OVERWRITE));
|
||||
logs.add("Get latest workspace: " + workspace.getName());
|
||||
} else {
|
||||
RecursionType recursionType = recursive ? RecursionType.FULL : RecursionType.NONE;
|
||||
GetRequest request = new GetRequest(new ItemSpec(normalizedPath, recursionType), LatestVersionSpec.INSTANCE);
|
||||
status = workspace.get(new GetRequest[]{request}, options);
|
||||
logs.add("Get latest path: " + normalizedPath + (force ? " (force)" : ""));
|
||||
status = workspace.get(new GetRequest[]{request}, GetOptions.GET_ALL.combine(GetOptions.OVERWRITE));
|
||||
logs.add("Get latest path: " + normalizedPath);
|
||||
}
|
||||
return toGetLatestResult(status);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取指定 changeset 版本（强制覆盖本地），对应 Visual Studio 的 Get Specific Version + Overwrite。
|
||||
*/
|
||||
public CoreOperationResult<TfsGetLatestResult> getVersion(final TfsConnectionConfig config,
|
||||
final String collectionName,
|
||||
final String workspaceName,
|
||||
final String serverPath,
|
||||
final int changeset,
|
||||
final boolean recursive) {
|
||||
return execute("getVersion", new CoreCallable<TfsGetLatestResult>() {
|
||||
@Override
|
||||
public TfsGetLatestResult call(List<String> logs) throws Exception {
|
||||
Workspace workspace = loadWorkspace(config, collectionName, workspaceName);
|
||||
String normalizedPath = normalizeServerPath(serverPath);
|
||||
RecursionType recursionType = recursive ? RecursionType.FULL : RecursionType.NONE;
|
||||
GetRequest request = new GetRequest(new ItemSpec(normalizedPath, recursionType), new ChangesetVersionSpec(changeset));
|
||||
GetStatus status = workspace.get(new GetRequest[]{request}, GetOptions.GET_ALL.combine(GetOptions.OVERWRITE));
|
||||
logs.add("Get version C" + changeset + ": " + normalizedPath);
|
||||
return toGetLatestResult(status);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 查询当前 Workspace 下的挂起更改，并返回稳定可序列化的状态字段。
|
||||
*/
|
||||
@@ -559,27 +513,9 @@ public class MacTfsCoreService {
|
||||
GetItemsOptions.DOWNLOAD
|
||||
);
|
||||
File tempFile = item.downloadFileToTempLocation(connection.versionControlClient, "mactfs");
|
||||
TfsFileContent content = buildFileContent(item.getServerItem(), item.getChangeSetID(), tempFile, logs);
|
||||
String content = new String(Files.readAllBytes(tempFile.toPath()), TEXT_CHARSET);
|
||||
logs.add("File content loaded: " + item.getServerItem());
|
||||
return content;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 读取本地已映射文件的文本内容，套用与服务器内容一致的二进制和大文件约束。
|
||||
*/
|
||||
public CoreOperationResult<TfsFileContent> getLocalFileContent(final String localPath) {
|
||||
return execute("getLocalFileContent", new CoreCallable<TfsFileContent>() {
|
||||
@Override
|
||||
public TfsFileContent call(List<String> logs) throws Exception {
|
||||
File file = new File(require(localPath, "localPath"));
|
||||
if (!file.exists() || file.isDirectory()) {
|
||||
throw new IllegalArgumentException("Local file not found: " + localPath);
|
||||
}
|
||||
TfsFileContent content = buildFileContent(file.getAbsolutePath(), 0, file, logs);
|
||||
logs.add("Local file content loaded: " + file.getAbsolutePath());
|
||||
return content;
|
||||
return new TfsFileContent(item.getServerItem(), item.getChangeSetID(), content, false);
|
||||
}
|
||||
});
|
||||
}
|
||||
@@ -599,8 +535,7 @@ public class MacTfsCoreService {
|
||||
throw new IllegalStateException(latest.getErrorMessage());
|
||||
}
|
||||
String localContent = new String(Files.readAllBytes(new File(require(localPath, "localPath")).toPath()), TEXT_CHARSET);
|
||||
// 服务器 latest 作为旧版（左侧），本地文件作为新版（右侧），本地新增行才会标记为 "+"。
|
||||
TfsTextDiff diff = buildTextDiff(serverPath, localPath, latest.getData().getContent(), localContent);
|
||||
TfsTextDiff diff = buildTextDiff(localPath, serverPath, localContent, latest.getData().getContent());
|
||||
logs.add("Text diff lines: " + diff.getLines().size());
|
||||
return diff;
|
||||
}
|
||||
@@ -638,193 +573,6 @@ public class MacTfsCoreService {
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 查询当前 Workspace 在指定范围内的冲突明细，供 Get Latest / Checkout 冲突弹窗展示。
|
||||
*/
|
||||
public CoreOperationResult<List<TfsConflictInfo>> listConflicts(final TfsConnectionConfig config,
|
||||
final String collectionName,
|
||||
final String workspaceName,
|
||||
final List<String> serverPaths,
|
||||
final boolean recursive) {
|
||||
return execute("listConflicts", new CoreCallable<List<TfsConflictInfo>>() {
|
||||
@Override
|
||||
public List<TfsConflictInfo> call(List<String> logs) throws Exception {
|
||||
Workspace workspace = loadWorkspace(config, collectionName, workspaceName);
|
||||
Conflict[] conflicts = workspace.queryConflicts(conflictScope(workspace, serverPaths), recursive);
|
||||
List<TfsConflictInfo> result = new ArrayList<TfsConflictInfo>();
|
||||
if (conflicts != null) {
|
||||
for (Conflict conflict : conflicts) {
|
||||
result.add(toConflictInfo(conflict));
|
||||
}
|
||||
}
|
||||
logs.add("Conflicts loaded: " + result.size());
|
||||
return result;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 对单个冲突应用解决方式（采用服务器版本或保留本地版本），并返回剩余冲突数量。
|
||||
*/
|
||||
public CoreOperationResult<TfsConflictResolution> applyConflict(final TfsConnectionConfig config,
|
||||
final String collectionName,
|
||||
final String workspaceName,
|
||||
final int conflictId,
|
||||
final String resolution) {
|
||||
return execute("applyConflict", new CoreCallable<TfsConflictResolution>() {
|
||||
@Override
|
||||
public TfsConflictResolution call(List<String> logs) throws Exception {
|
||||
Workspace workspace = loadWorkspace(config, collectionName, workspaceName);
|
||||
Resolution target = toResolution(resolution);
|
||||
String[] scope = conflictScope(workspace, null);
|
||||
Conflict matched = null;
|
||||
Conflict[] conflicts = workspace.queryConflicts(scope, true);
|
||||
if (conflicts != null) {
|
||||
for (Conflict conflict : conflicts) {
|
||||
if (conflict.getConflictID() == conflictId) {
|
||||
matched = conflict;
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
if (matched == null) {
|
||||
throw new IllegalArgumentException("Conflict not found: " + conflictId);
|
||||
}
|
||||
matched.setResolution(target);
|
||||
workspace.resolveConflict(matched);
|
||||
Conflict[] remaining = workspace.queryConflicts(scope, true);
|
||||
int remainingCount = remaining == null ? 0 : remaining.length;
|
||||
logs.add("Conflict resolved: " + conflictId + " -> " + resolution + ", remaining=" + remainingCount);
|
||||
return new TfsConflictResolution(conflictId, resolution, matched.isResolved(), remainingCount);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 计算冲突查询范围：优先使用调用方传入的路径，否则回退到 Workspace 全部映射根。
|
||||
*/
|
||||
private String[] conflictScope(Workspace workspace, List<String> serverPaths) {
|
||||
List<String> scope = new ArrayList<String>();
|
||||
if (serverPaths != null) {
|
||||
for (String path : serverPaths) {
|
||||
if (path != null && path.trim().length() > 0) {
|
||||
scope.add(path.trim());
|
||||
}
|
||||
}
|
||||
}
|
||||
if (scope.isEmpty()) {
|
||||
WorkingFolder[] folders = workspace.getFolders();
|
||||
if (folders != null) {
|
||||
for (WorkingFolder folder : folders) {
|
||||
if (folder.getServerItem() != null && folder.getServerItem().trim().length() > 0) {
|
||||
scope.add(folder.getServerItem());
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
if (scope.isEmpty()) {
|
||||
scope.add("$/");
|
||||
}
|
||||
return scope.toArray(new String[scope.size()]);
|
||||
}
|
||||
|
||||
/**
|
||||
* 把 UI 传入的解决方式标识映射为 TFS Resolution，仅支持第一版约定的两种取舍。
|
||||
*/
|
||||
private Resolution toResolution(String resolution) {
|
||||
String value = resolution == null ? "" : resolution.trim().toLowerCase();
|
||||
if ("takeserver".equals(value) || "server".equals(value) || "theirs".equals(value) || "accept_theirs".equals(value)) {
|
||||
return Resolution.ACCEPT_THEIRS;
|
||||
}
|
||||
if ("keeplocal".equals(value) || "local".equals(value) || "yours".equals(value) || "accept_yours".equals(value)) {
|
||||
return Resolution.ACCEPT_YOURS;
|
||||
}
|
||||
throw new IllegalArgumentException("Unsupported conflict resolution: " + resolution);
|
||||
}
|
||||
|
||||
/**
|
||||
* 把 TFS 冲突对象转换为稳定可序列化的冲突明细。
|
||||
*/
|
||||
private TfsConflictInfo toConflictInfo(Conflict conflict) {
|
||||
String serverPath = firstNonBlank(conflict.getYourServerItem(), conflict.getTheirServerItem(), conflict.getBaseServerItem());
|
||||
String localPath = firstNonBlank(conflict.getSourceLocalItem(), conflict.getTargetLocalItem());
|
||||
return new TfsConflictInfo(
|
||||
conflict.getConflictID(),
|
||||
conflictTypeName(conflict.getType()),
|
||||
serverPath,
|
||||
localPath,
|
||||
conflict.getYourServerItem(),
|
||||
conflict.getTheirServerItem(),
|
||||
conflict.getBaseServerItem(),
|
||||
conflict.isResolved()
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* 返回冲突类型的稳定字符串名称，避免直接依赖枚举 toString。
|
||||
*/
|
||||
private String conflictTypeName(ConflictType type) {
|
||||
if (ConflictType.GET.equals(type)) {
|
||||
return "get";
|
||||
}
|
||||
if (ConflictType.CHECKIN.equals(type)) {
|
||||
return "checkin";
|
||||
}
|
||||
if (ConflictType.LOCAL.equals(type)) {
|
||||
return "local";
|
||||
}
|
||||
if (ConflictType.MERGE.equals(type)) {
|
||||
return "merge";
|
||||
}
|
||||
if (ConflictType.NONE.equals(type)) {
|
||||
return "none";
|
||||
}
|
||||
return "unknown";
|
||||
}
|
||||
|
||||
/**
|
||||
* 读取本地文件字节并按二进制识别和大小阈值套用文本内容约束。
|
||||
*/
|
||||
private TfsFileContent buildFileContent(String serverPath, int changeset, File file, List<String> logs) throws IOException {
|
||||
byte[] bytes = Files.readAllBytes(file.toPath());
|
||||
long size = bytes.length;
|
||||
boolean binary = isBinaryContent(bytes);
|
||||
boolean tooLarge = size > MAX_TEXT_CONTENT_BYTES;
|
||||
if (binary || tooLarge) {
|
||||
logs.add("File content skipped (binary=" + binary + ", tooLarge=" + tooLarge + ", size=" + size + ")");
|
||||
return new TfsFileContent(serverPath, changeset, "", binary, size, tooLarge);
|
||||
}
|
||||
return new TfsFileContent(serverPath, changeset, new String(bytes, TEXT_CHARSET), false, size, false);
|
||||
}
|
||||
|
||||
/**
|
||||
* 通过嗅探前若干字节是否包含空字节判断内容是否为二进制。
|
||||
*/
|
||||
private boolean isBinaryContent(byte[] bytes) {
|
||||
int limit = (int) Math.min(bytes.length, (long) BINARY_SNIFF_BYTES);
|
||||
for (int index = 0; index < limit; index++) {
|
||||
if (bytes[index] == 0) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
/**
|
||||
* 返回第一个非空字符串，供冲突路径回退使用。
|
||||
*/
|
||||
private String firstNonBlank(String... values) {
|
||||
if (values == null) {
|
||||
return null;
|
||||
}
|
||||
for (String value : values) {
|
||||
if (value != null && value.trim().length() > 0) {
|
||||
return value;
|
||||
}
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
private <T> CoreOperationResult<T> execute(String operation, CoreCallable<T> callable) {
|
||||
long startedAt = System.currentTimeMillis();
|
||||
List<String> logs = new ArrayList<String>();
|
||||
@@ -1180,28 +928,21 @@ public class MacTfsCoreService {
|
||||
private TfsTextDiff buildTextDiff(String sourceLabel, String targetLabel, String sourceContent, String targetContent) {
|
||||
List<String> sourceLines = Arrays.asList(sourceContent.split("\\r?\\n", -1));
|
||||
List<String> targetLines = Arrays.asList(targetContent.split("\\r?\\n", -1));
|
||||
// 使用 java-diff-utils（Myers 算法）计算最小差异，
|
||||
// 避免按行号硬对齐导致插入/删除一行后其余行全部误报为变动。
|
||||
Patch<String> patch = DiffUtils.diff(sourceLines, targetLines);
|
||||
int max = Math.max(sourceLines.size(), targetLines.size());
|
||||
List<String> lines = new ArrayList<String>();
|
||||
int sourceIndex = 0;
|
||||
for (AbstractDelta<String> delta : patch.getDeltas()) {
|
||||
int deltaStart = delta.getSource().getPosition();
|
||||
while (sourceIndex < deltaStart) {
|
||||
lines.add(" " + sourceLines.get(sourceIndex));
|
||||
sourceIndex++;
|
||||
for (int index = 0; index < max; index++) {
|
||||
String source = index < sourceLines.size() ? sourceLines.get(index) : null;
|
||||
String target = index < targetLines.size() ? targetLines.get(index) : null;
|
||||
if (source != null && target != null && source.equals(target)) {
|
||||
lines.add(" " + source);
|
||||
} else {
|
||||
if (source != null) {
|
||||
lines.add("-" + source);
|
||||
}
|
||||
for (String removed : delta.getSource().getLines()) {
|
||||
lines.add("-" + removed);
|
||||
if (target != null) {
|
||||
lines.add("+" + target);
|
||||
}
|
||||
for (String added : delta.getTarget().getLines()) {
|
||||
lines.add("+" + added);
|
||||
}
|
||||
sourceIndex += delta.getSource().size();
|
||||
}
|
||||
while (sourceIndex < sourceLines.size()) {
|
||||
lines.add(" " + sourceLines.get(sourceIndex));
|
||||
sourceIndex++;
|
||||
}
|
||||
return new TfsTextDiff(sourceLabel, targetLabel, lines);
|
||||
}
|
||||
@@ -1865,16 +1606,12 @@ public class MacTfsCoreService {
|
||||
private final int changeset;
|
||||
private final String content;
|
||||
private final boolean binary;
|
||||
private final long size;
|
||||
private final boolean tooLarge;
|
||||
|
||||
public TfsFileContent(String serverPath, int changeset, String content, boolean binary, long size, boolean tooLarge) {
|
||||
public TfsFileContent(String serverPath, int changeset, String content, boolean binary) {
|
||||
this.serverPath = serverPath;
|
||||
this.changeset = changeset;
|
||||
this.content = content;
|
||||
this.binary = binary;
|
||||
this.size = size;
|
||||
this.tooLarge = tooLarge;
|
||||
}
|
||||
|
||||
public String getServerPath() {
|
||||
@@ -1892,99 +1629,6 @@ public class MacTfsCoreService {
|
||||
public boolean isBinary() {
|
||||
return binary;
|
||||
}
|
||||
|
||||
public long getSize() {
|
||||
return size;
|
||||
}
|
||||
|
||||
public boolean isTooLarge() {
|
||||
return tooLarge;
|
||||
}
|
||||
}
|
||||
|
||||
public static class TfsConflictInfo {
|
||||
private final int conflictId;
|
||||
private final String type;
|
||||
private final String serverPath;
|
||||
private final String localPath;
|
||||
private final String yourServerItem;
|
||||
private final String theirServerItem;
|
||||
private final String baseServerItem;
|
||||
private final boolean resolved;
|
||||
|
||||
public TfsConflictInfo(int conflictId, String type, String serverPath, String localPath,
|
||||
String yourServerItem, String theirServerItem, String baseServerItem, boolean resolved) {
|
||||
this.conflictId = conflictId;
|
||||
this.type = type;
|
||||
this.serverPath = serverPath;
|
||||
this.localPath = localPath;
|
||||
this.yourServerItem = yourServerItem;
|
||||
this.theirServerItem = theirServerItem;
|
||||
this.baseServerItem = baseServerItem;
|
||||
this.resolved = resolved;
|
||||
}
|
||||
|
||||
public int getConflictId() {
|
||||
return conflictId;
|
||||
}
|
||||
|
||||
public String getType() {
|
||||
return type;
|
||||
}
|
||||
|
||||
public String getServerPath() {
|
||||
return serverPath;
|
||||
}
|
||||
|
||||
public String getLocalPath() {
|
||||
return localPath;
|
||||
}
|
||||
|
||||
public String getYourServerItem() {
|
||||
return yourServerItem;
|
||||
}
|
||||
|
||||
public String getTheirServerItem() {
|
||||
return theirServerItem;
|
||||
}
|
||||
|
||||
public String getBaseServerItem() {
|
||||
return baseServerItem;
|
||||
}
|
||||
|
||||
public boolean isResolved() {
|
||||
return resolved;
|
||||
}
|
||||
}
|
||||
|
||||
public static class TfsConflictResolution {
|
||||
private final int conflictId;
|
||||
private final String resolution;
|
||||
private final boolean resolved;
|
||||
private final int remainingConflicts;
|
||||
|
||||
public TfsConflictResolution(int conflictId, String resolution, boolean resolved, int remainingConflicts) {
|
||||
this.conflictId = conflictId;
|
||||
this.resolution = resolution;
|
||||
this.resolved = resolved;
|
||||
this.remainingConflicts = remainingConflicts;
|
||||
}
|
||||
|
||||
public int getConflictId() {
|
||||
return conflictId;
|
||||
}
|
||||
|
||||
public String getResolution() {
|
||||
return resolution;
|
||||
}
|
||||
|
||||
public boolean isResolved() {
|
||||
return resolved;
|
||||
}
|
||||
|
||||
public int getRemainingConflicts() {
|
||||
return remainingConflicts;
|
||||
}
|
||||
}
|
||||
|
||||
public static class TfsTextDiff {
|
||||
|
||||
@@ -9,10 +9,7 @@ import com.mydev.mactfs.core.MacTfsCoreService.ConnectionSummary;
|
||||
import com.mydev.mactfs.core.MacTfsCoreService.CoreOperationResult;
|
||||
import com.mydev.mactfs.core.MacTfsCoreService.TfsCheckinResult;
|
||||
import com.mydev.mactfs.core.MacTfsCoreService.TfsCollectionInfo;
|
||||
import com.mydev.mactfs.core.MacTfsCoreService.TfsConflictInfo;
|
||||
import com.mydev.mactfs.core.MacTfsCoreService.TfsConflictResolution;
|
||||
import com.mydev.mactfs.core.MacTfsCoreService.TfsConnectionConfig;
|
||||
import com.mydev.mactfs.core.MacTfsCoreService.TfsFileContent;
|
||||
import com.mydev.mactfs.core.MacTfsCoreService.TfsFileOperationResult;
|
||||
import com.mydev.mactfs.core.MacTfsCoreService.TfsFolderDiffItem;
|
||||
import com.mydev.mactfs.core.MacTfsCoreService.TfsGetLatestResult;
|
||||
@@ -283,33 +280,10 @@ public class MacTfsServer {
|
||||
}
|
||||
}));
|
||||
|
||||
Spark.get("/api/workspace/context", (request, response) -> handle(request, response, "workspaceContext", TIMEOUT_DIRECTORY_MS, new ApiCallable() {
|
||||
@Override
|
||||
public ApiResult call(Request request) throws Exception {
|
||||
AppConfig config = requestConfig(new LinkedHashMap<String, Object>());
|
||||
Map<String, Object> context = new LinkedHashMap<String, Object>();
|
||||
context.put("serverUri", config.serverUri);
|
||||
context.put("authType", config.authType);
|
||||
context.put("collection", config.collection);
|
||||
context.put("workspace", config.workspace);
|
||||
context.put("connected", Boolean.valueOf(sessionManager.isConnected()));
|
||||
Map<String, Object> data = new LinkedHashMap<String, Object>();
|
||||
if (isBlank(config.collection) || isBlank(config.workspace)) {
|
||||
context.put("mappings", config.mappings);
|
||||
data.put("context", context);
|
||||
return ApiResult.success("success", data);
|
||||
}
|
||||
CoreOperationResult<List<TfsMappingInfo>> result = coreService.listMappings(toTfsConfig(config), config.collection, config.workspace);
|
||||
context.put("mappings", result.getData() == null ? Collections.emptyList() : result.getData());
|
||||
data.put("context", context);
|
||||
return fromCore(result, data);
|
||||
}
|
||||
}));
|
||||
|
||||
Spark.get("/api/mappings", (request, response) -> handle(request, response, "listMappings", TIMEOUT_DIRECTORY_MS, new ApiCallable() {
|
||||
@Override
|
||||
public ApiResult call(Request request) throws Exception {
|
||||
AppConfig config = requestConfig(new LinkedHashMap<String, Object>());
|
||||
AppConfig config = requestConfig(queryConfig(request));
|
||||
CoreOperationResult<List<TfsMappingInfo>> result = coreService.listMappings(toTfsConfig(config), require(config.collection, "collection"), require(config.workspace, "workspace"));
|
||||
if (result.isSuccess()) {
|
||||
config.mappings = mappingConfigs(result.getData());
|
||||
@@ -322,26 +296,6 @@ public class MacTfsServer {
|
||||
}
|
||||
}));
|
||||
|
||||
Spark.post("/api/mappings/check-target", (request, response) -> handle(request, response, "checkMappingTarget", TIMEOUT_DEFAULT_MS, new ApiCallable() {
|
||||
@Override
|
||||
public ApiResult call(Request request) throws Exception {
|
||||
Map<String, Object> body = readBody(request);
|
||||
String serverPath = require(stringValue(body, "serverPath"), "serverPath");
|
||||
String localParentPath = require(stringValue(body, "localParentPath"), "localParentPath");
|
||||
String name = lastPathSegment(serverPath);
|
||||
File target = new File(localParentPath, name);
|
||||
boolean exists = target.exists();
|
||||
Map<String, Object> data = new LinkedHashMap<String, Object>();
|
||||
data.put("serverPath", serverPath);
|
||||
data.put("localParentPath", localParentPath);
|
||||
data.put("name", name);
|
||||
data.put("targetPath", target.getAbsolutePath());
|
||||
data.put("exists", Boolean.valueOf(exists));
|
||||
data.put("allowed", Boolean.valueOf(!exists));
|
||||
return ApiResult.success("success", data);
|
||||
}
|
||||
}));
|
||||
|
||||
Spark.post("/api/mappings", (request, response) -> handle(request, response, "addMapping", TIMEOUT_LONG_WRITE_MS, new ApiCallable() {
|
||||
@Override
|
||||
public ApiResult call(Request request) throws Exception {
|
||||
@@ -395,23 +349,7 @@ public class MacTfsServer {
|
||||
public ApiResult call(Request request) throws Exception {
|
||||
Map<String, Object> body = readBody(request);
|
||||
AppConfig config = requestConfig(body);
|
||||
CoreOperationResult<TfsGetLatestResult> result = coreService.getLatest(toTfsConfig(config), require(config.collection, "collection"), require(config.workspace, "workspace"), stringValue(body, "serverPath"), booleanValue(body, "recursive", true), booleanValue(body, "force", false));
|
||||
Map<String, Object> data = new LinkedHashMap<String, Object>();
|
||||
data.put("result", result.getData());
|
||||
return fromCore(result, data);
|
||||
}
|
||||
}));
|
||||
|
||||
Spark.post("/api/files/get-version", (request, response) -> handle(request, response, "getVersion", TIMEOUT_LONG_WRITE_MS, new ApiCallable() {
|
||||
@Override
|
||||
public ApiResult call(Request request) throws Exception {
|
||||
Map<String, Object> body = readBody(request);
|
||||
AppConfig config = requestConfig(body);
|
||||
Number changeset = (Number) body.get("changeset");
|
||||
if (changeset == null) {
|
||||
throw new IllegalArgumentException("changeset is required");
|
||||
}
|
||||
CoreOperationResult<TfsGetLatestResult> result = coreService.getVersion(toTfsConfig(config), require(config.collection, "collection"), require(config.workspace, "workspace"), require(stringValue(body, "serverPath"), "serverPath"), changeset.intValue(), booleanValue(body, "recursive", true));
|
||||
CoreOperationResult<TfsGetLatestResult> result = coreService.getLatest(toTfsConfig(config), require(config.collection, "collection"), require(config.workspace, "workspace"), stringValue(body, "serverPath"), booleanValue(body, "recursive", true));
|
||||
Map<String, Object> data = new LinkedHashMap<String, Object>();
|
||||
data.put("result", result.getData());
|
||||
return fromCore(result, data);
|
||||
@@ -446,31 +384,11 @@ public class MacTfsServer {
|
||||
}
|
||||
}));
|
||||
|
||||
Spark.get("/api/files/content", (request, response) -> handle(request, response, "fileContent", TIMEOUT_DIFF_MS, new ApiCallable() {
|
||||
@Override
|
||||
public ApiResult call(Request request) throws Exception {
|
||||
AppConfig config = requestConfig(new LinkedHashMap<String, Object>());
|
||||
String localPath = request.queryParams("localPath");
|
||||
CoreOperationResult<TfsFileContent> result;
|
||||
if (localPath != null && localPath.trim().length() > 0) {
|
||||
result = coreService.getLocalFileContent(localPath);
|
||||
} else {
|
||||
String changeset = request.queryParams("changeset");
|
||||
Integer changesetId = changeset == null || changeset.trim().isEmpty()
|
||||
? null
|
||||
: Integer.valueOf(Integer.parseInt(changeset.trim()));
|
||||
result = coreService.getFileContent(toTfsConfig(config), require(config.collection, "collection"), require(request.queryParams("serverPath"), "serverPath"), changesetId);
|
||||
}
|
||||
Map<String, Object> data = new LinkedHashMap<String, Object>();
|
||||
data.put("content", result.getData());
|
||||
return fromCore(result, data);
|
||||
}
|
||||
}));
|
||||
|
||||
Spark.get("/api/pending-changes", (request, response) -> handle(request, response, "pendingChanges", TIMEOUT_DEFAULT_MS, new ApiCallable() {
|
||||
@Override
|
||||
public ApiResult call(Request request) throws Exception {
|
||||
AppConfig config = requestConfig(new LinkedHashMap<String, Object>());
|
||||
Map<String, Object> query = queryConfig(request);
|
||||
AppConfig config = requestConfig(query);
|
||||
CoreOperationResult<List<TfsPendingChangeInfo>> result = coreService.listPendingChanges(toTfsConfig(config), require(config.collection, "collection"), require(config.workspace, "workspace"), splitPaths(request.queryParams("serverPath")));
|
||||
Map<String, Object> data = new LinkedHashMap<String, Object>();
|
||||
data.put("pendingChanges", result.getData() == null ? Collections.emptyList() : result.getData());
|
||||
@@ -491,30 +409,6 @@ public class MacTfsServer {
|
||||
}
|
||||
}));
|
||||
|
||||
Spark.get("/api/conflicts", (request, response) -> handle(request, response, "listConflicts", TIMEOUT_DEFAULT_MS, new ApiCallable() {
|
||||
@Override
|
||||
public ApiResult call(Request request) throws Exception {
|
||||
AppConfig config = requestConfig(new LinkedHashMap<String, Object>());
|
||||
boolean recursive = !"false".equalsIgnoreCase(request.queryParams("recursive"));
|
||||
CoreOperationResult<List<TfsConflictInfo>> result = coreService.listConflicts(toTfsConfig(config), require(config.collection, "collection"), require(config.workspace, "workspace"), splitPaths(request.queryParams("serverPath")), recursive);
|
||||
Map<String, Object> data = new LinkedHashMap<String, Object>();
|
||||
data.put("conflicts", result.getData() == null ? Collections.emptyList() : result.getData());
|
||||
return fromCore(result, data);
|
||||
}
|
||||
}));
|
||||
|
||||
Spark.post("/api/conflicts/apply", (request, response) -> handle(request, response, "applyConflict", TIMEOUT_LONG_WRITE_MS, new ApiCallable() {
|
||||
@Override
|
||||
public ApiResult call(Request request) throws Exception {
|
||||
Map<String, Object> body = readBody(request);
|
||||
AppConfig config = requestConfig(body);
|
||||
CoreOperationResult<TfsConflictResolution> result = coreService.applyConflict(toTfsConfig(config), require(config.collection, "collection"), require(config.workspace, "workspace"), intValue(body, "conflictId"), require(stringValue(body, "resolution"), "resolution"));
|
||||
Map<String, Object> data = new LinkedHashMap<String, Object>();
|
||||
data.put("resolution", result.getData());
|
||||
return fromCore(result, data);
|
||||
}
|
||||
}));
|
||||
|
||||
Spark.post("/api/compare/folder", (request, response) -> handle(request, response, "compareFolder", TIMEOUT_COMPARE_MS, new ApiCallable() {
|
||||
@Override
|
||||
public ApiResult call(Request request) throws Exception {
|
||||
@@ -677,6 +571,26 @@ public class MacTfsServer {
|
||||
return normalizeConfig(config);
|
||||
}
|
||||
|
||||
/**
|
||||
* 提取 GET 请求中的配置覆盖字段，避免 UI 切换 Collection 时读接口使用旧配置。
|
||||
*/
|
||||
private Map<String, Object> queryConfig(Request request) {
|
||||
Map<String, Object> query = new LinkedHashMap<String, Object>();
|
||||
copyQuery(request, query, "collection");
|
||||
copyQuery(request, query, "workspace");
|
||||
return query;
|
||||
}
|
||||
|
||||
/**
|
||||
* 将非空 query 参数复制到请求配置覆盖对象。
|
||||
*/
|
||||
private void copyQuery(Request request, Map<String, Object> query, String key) {
|
||||
String value = request.queryParams(key);
|
||||
if (!isBlank(value)) {
|
||||
query.put(key, value);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 把服务端配置转换为 core 层连接配置。
|
||||
*/
|
||||
@@ -797,18 +711,6 @@ public class MacTfsServer {
|
||||
return result;
|
||||
}
|
||||
|
||||
/**
|
||||
* 取服务端路径的最后一段，作为 Mapping 目标目录名预校验依据。
|
||||
*/
|
||||
private String lastPathSegment(String serverPath) {
|
||||
String normalized = serverPath.trim();
|
||||
while (normalized.length() > 1 && normalized.endsWith("/")) {
|
||||
normalized = normalized.substring(0, normalized.length() - 1);
|
||||
}
|
||||
int index = normalized.lastIndexOf('/');
|
||||
return index < 0 ? normalized : normalized.substring(index + 1);
|
||||
}
|
||||
|
||||
/**
|
||||
* 从请求体中读取路径数组，兼容 paths、path、serverPaths、serverPath 四种字段。
|
||||
*/
|
||||
|
||||
+520
-437
File diff suppressed because it is too large
Load Diff
@@ -1,13 +1,12 @@
|
||||
@import "tailwindcss";
|
||||
@import "tw-animate-css";
|
||||
@import "shadcn/tailwind.css";
|
||||
@import "@fontsource-variable/roboto-slab";
|
||||
|
||||
@custom-variant dark (&:is(.dark *));
|
||||
|
||||
@theme inline {
|
||||
--font-heading: var(--font-serif);
|
||||
--font-serif: 'Roboto Slab Variable', serif;
|
||||
--font-heading: var(--font-sans);
|
||||
--font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", sans-serif;
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
@@ -125,6 +124,6 @@
|
||||
@apply bg-background text-foreground;
|
||||
}
|
||||
html {
|
||||
@apply font-serif;
|
||||
@apply font-sans;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,210 @@
|
||||
import type { ReactNode } from "react"
|
||||
import {
|
||||
CheckCircle2,
|
||||
Cloud,
|
||||
Download,
|
||||
FolderTree,
|
||||
GitPullRequest,
|
||||
History,
|
||||
RefreshCw,
|
||||
TriangleAlert,
|
||||
} from "lucide-react"
|
||||
|
||||
import { OperationLogPanel } from "~/components/app/operation-log-panel"
|
||||
import { Button } from "~/components/ui/button"
|
||||
import type { ApiRequestLogEntry } from "~/lib/api/client"
|
||||
|
||||
interface AppShellProps {
|
||||
connected: boolean
|
||||
serviceReady: boolean
|
||||
serviceLoading: boolean
|
||||
serverUri: string
|
||||
username: string
|
||||
collectionCount?: number
|
||||
serviceBaseUrl?: string
|
||||
tokenFile?: string
|
||||
serviceMessage: string
|
||||
requestStatus: string
|
||||
operationLogs: ApiRequestLogEntry[]
|
||||
operationLogsLoading: boolean
|
||||
workspaceGetLatestEnabled: boolean
|
||||
workspaceHistoryEnabled: boolean
|
||||
sourceList?: ReactNode
|
||||
inspector?: ReactNode
|
||||
onRefreshService(): void
|
||||
onRefreshOperationLogs(): void
|
||||
onWorkspaceGetLatest(): void
|
||||
onWorkspaceHistory(): void
|
||||
children: ReactNode
|
||||
}
|
||||
|
||||
/**
|
||||
* 渲染 macOS Source Workspace 主框架，承载顶部工具栏、Source List、主内容、Inspector 和 Console。
|
||||
*/
|
||||
export function AppShell({
|
||||
connected,
|
||||
serviceReady,
|
||||
serviceLoading,
|
||||
serverUri,
|
||||
username,
|
||||
collectionCount,
|
||||
serviceBaseUrl,
|
||||
tokenFile,
|
||||
serviceMessage,
|
||||
requestStatus,
|
||||
operationLogs,
|
||||
operationLogsLoading,
|
||||
workspaceGetLatestEnabled,
|
||||
workspaceHistoryEnabled,
|
||||
sourceList,
|
||||
inspector,
|
||||
onRefreshService,
|
||||
onRefreshOperationLogs,
|
||||
onWorkspaceGetLatest,
|
||||
onWorkspaceHistory,
|
||||
children,
|
||||
}: AppShellProps) {
|
||||
return (
|
||||
<div className="flex h-[calc(100svh-32px)] min-h-[640px] flex-col overflow-hidden rounded-[8px] border bg-background text-sm shadow-sm">
|
||||
<header className="flex h-13 shrink-0 items-center justify-between gap-3 border-b bg-muted/30 px-3">
|
||||
<div className="flex min-w-0 items-center gap-3">
|
||||
<div className="flex size-7 items-center justify-center rounded-[7px] border bg-background text-primary">
|
||||
<Cloud className="size-4" />
|
||||
</div>
|
||||
<div className="min-w-0">
|
||||
<div className="flex items-center gap-2">
|
||||
<span className="font-medium">macTFS</span>
|
||||
<span className="rounded-[6px] border bg-background px-1.5 py-0.5 text-xs text-muted-foreground">
|
||||
{connected ? "已连接" : "未连接"}
|
||||
</span>
|
||||
</div>
|
||||
<div className="truncate font-mono text-xs text-muted-foreground">
|
||||
{serverUri || "http://127.0.0.1:38765"}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex shrink-0 items-center gap-2">
|
||||
<Button
|
||||
variant="outline"
|
||||
size="sm"
|
||||
disabled={!workspaceGetLatestEnabled}
|
||||
onClick={onWorkspaceGetLatest}
|
||||
>
|
||||
<Download />
|
||||
Get Latest
|
||||
</Button>
|
||||
<Button
|
||||
variant="outline"
|
||||
size="sm"
|
||||
disabled={!workspaceHistoryEnabled}
|
||||
onClick={onWorkspaceHistory}
|
||||
>
|
||||
<History />
|
||||
History
|
||||
</Button>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
disabled={serviceLoading}
|
||||
onClick={onRefreshService}
|
||||
>
|
||||
<RefreshCw className={serviceLoading ? "animate-spin" : ""} />
|
||||
刷新
|
||||
</Button>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div className="grid min-h-0 flex-1 grid-cols-1 md:grid-cols-[280px_minmax(0,1fr)] lg:grid-cols-[280px_minmax(0,1fr)_340px]">
|
||||
<aside className="flex min-h-[220px] min-w-0 flex-col border-b bg-muted/25 md:min-h-0 md:border-r md:border-b-0">
|
||||
<div className="flex h-9 items-center gap-2 border-b px-3 text-xs font-medium text-muted-foreground">
|
||||
<FolderTree className="size-4" />
|
||||
Source List
|
||||
</div>
|
||||
<div className="min-h-0 flex-1 overflow-auto p-2">
|
||||
{sourceList || (
|
||||
<>
|
||||
<div className="rounded-[6px] bg-background px-2 py-1.5 font-mono text-xs">
|
||||
$/
|
||||
</div>
|
||||
<div className="mt-2 px-2 text-xs text-muted-foreground">
|
||||
Collection：{collectionCount ?? "-"}
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
<main className="flex min-h-[320px] min-w-0 flex-col">
|
||||
<div className="flex h-9 items-center justify-between gap-3 border-b px-3">
|
||||
<div className="min-w-0 truncate font-medium">Source Workspace</div>
|
||||
<div className="flex shrink-0 items-center gap-1">
|
||||
<Button variant="ghost" size="sm" disabled>
|
||||
Compare
|
||||
</Button>
|
||||
<Button variant="ghost" size="sm" disabled>
|
||||
Mapping
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
<div className="min-h-0 flex-1 overflow-hidden">{children}</div>
|
||||
</main>
|
||||
|
||||
<aside className="flex min-h-[260px] min-w-0 flex-col border-t bg-background md:col-span-2 lg:col-span-1 lg:border-t-0 lg:border-l">
|
||||
<div className="flex h-9 items-center gap-2 border-b px-3 text-xs font-medium text-muted-foreground">
|
||||
<GitPullRequest className="size-4" />
|
||||
Inspector
|
||||
</div>
|
||||
<div className="min-h-0 flex-1 overflow-auto p-3">
|
||||
<div className="grid gap-4">
|
||||
{inspector || (
|
||||
<section className="grid gap-2">
|
||||
<div className="flex items-center justify-between">
|
||||
<span className="font-medium">Pending Changes</span>
|
||||
<span className="rounded-[6px] border px-1.5 py-0.5 text-xs text-muted-foreground">
|
||||
0 项
|
||||
</span>
|
||||
</div>
|
||||
<div className="rounded-[6px] border bg-muted/20 px-3 py-2 text-muted-foreground">
|
||||
暂无挂起更改
|
||||
</div>
|
||||
</section>
|
||||
)}
|
||||
|
||||
<section className="grid gap-2">
|
||||
<div className="font-medium">本地服务</div>
|
||||
<div className="flex items-center gap-2 rounded-[6px] border bg-muted/30 px-3 py-2">
|
||||
{serviceReady ? (
|
||||
<CheckCircle2 className="size-4 text-green-600" />
|
||||
) : (
|
||||
<TriangleAlert className="size-4 text-amber-600" />
|
||||
)}
|
||||
<span>{serviceReady ? "服务可用" : "服务未就绪"}</span>
|
||||
</div>
|
||||
<div className="grid gap-1 text-xs text-muted-foreground">
|
||||
<div className="truncate font-mono">
|
||||
{serviceBaseUrl || "http://127.0.0.1:38765"}
|
||||
</div>
|
||||
<div className="truncate font-mono">
|
||||
{tokenFile || "~/.mactfs/server-token"}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
</div>
|
||||
|
||||
<footer className="h-40 shrink-0 border-t bg-muted/20">
|
||||
<OperationLogPanel
|
||||
logs={operationLogs}
|
||||
loading={operationLogsLoading}
|
||||
serviceMessage={serviceMessage}
|
||||
requestStatus={requestStatus}
|
||||
username={username}
|
||||
onRefresh={onRefreshOperationLogs}
|
||||
/>
|
||||
</footer>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -1,63 +0,0 @@
|
||||
import { useState } from "react"
|
||||
|
||||
import { Button } from "~/components/ui/button"
|
||||
import {
|
||||
Dialog,
|
||||
DialogContent,
|
||||
DialogDescription,
|
||||
DialogFooter,
|
||||
DialogHeader,
|
||||
DialogTitle,
|
||||
} from "~/components/ui/dialog"
|
||||
|
||||
/**
|
||||
* 通用确认弹窗：用于强制获取、获取指定版本等覆盖类危险操作的二次确认。
|
||||
*/
|
||||
export function ConfirmDialog({
|
||||
title,
|
||||
description,
|
||||
confirmLabel,
|
||||
danger,
|
||||
onConfirm,
|
||||
onClose,
|
||||
}: {
|
||||
title: string
|
||||
description: React.ReactNode
|
||||
confirmLabel: string
|
||||
danger?: boolean
|
||||
onConfirm: () => Promise<void> | void
|
||||
onClose: () => void
|
||||
}) {
|
||||
const [busy, setBusy] = useState(false)
|
||||
|
||||
return (
|
||||
<Dialog open onOpenChange={(open) => !open && !busy && onClose()}>
|
||||
<DialogContent className="sm:max-w-md">
|
||||
<DialogHeader>
|
||||
<DialogTitle>{title}</DialogTitle>
|
||||
<DialogDescription asChild>
|
||||
<div className="text-sm leading-6">{description}</div>
|
||||
</DialogDescription>
|
||||
</DialogHeader>
|
||||
<DialogFooter>
|
||||
<Button variant="ghost" onClick={onClose} disabled={busy}>
|
||||
取消
|
||||
</Button>
|
||||
<Button
|
||||
variant={danger ? "destructive" : "default"}
|
||||
disabled={busy}
|
||||
onClick={() => {
|
||||
void (async () => {
|
||||
setBusy(true)
|
||||
await onConfirm()
|
||||
setBusy(false)
|
||||
})()
|
||||
}}
|
||||
>
|
||||
{busy ? "正在执行…" : confirmLabel}
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
)
|
||||
}
|
||||
@@ -1,267 +0,0 @@
|
||||
import { useCallback, useEffect, useState, type ChangeEvent } from "react"
|
||||
|
||||
import { Button } from "~/components/ui/button"
|
||||
import { Input } from "~/components/ui/input"
|
||||
import { Label } from "~/components/ui/label"
|
||||
import { api } from "~/lib/api"
|
||||
import type { AppConfig, Collection } from "~/lib/api"
|
||||
import type { WorkspaceSession } from "~/lib/tfs/session"
|
||||
import { cn } from "~/lib/utils"
|
||||
|
||||
// 连接阶段：填写连接信息 / 确认 Collection。
|
||||
type ConnectPhase = "form" | "collection"
|
||||
|
||||
// 连接表单字段，第一版仅支持显式 NTLM 账号密码。
|
||||
interface ConnectFormState {
|
||||
serverUri: string
|
||||
domain: string
|
||||
username: string
|
||||
password: string
|
||||
}
|
||||
|
||||
const EMPTY_FORM: ConnectFormState = {
|
||||
serverUri: "",
|
||||
domain: "",
|
||||
username: "",
|
||||
password: "",
|
||||
}
|
||||
|
||||
/**
|
||||
* 连接入口：连接 TFS、加载并确认 Collection、确保默认 Workspace，成功后回调固定上下文。
|
||||
*/
|
||||
export function ConnectView({ onReady }: { onReady: (session: WorkspaceSession) => void }) {
|
||||
const [phase, setPhase] = useState<ConnectPhase>("form")
|
||||
const [form, setForm] = useState<ConnectFormState>(EMPTY_FORM)
|
||||
const [collections, setCollections] = useState<Collection[]>([])
|
||||
const [selectedCollection, setSelectedCollection] = useState("")
|
||||
const [busy, setBusy] = useState(false)
|
||||
const [busyText, setBusyText] = useState("")
|
||||
const [error, setError] = useState<string | null>(null)
|
||||
|
||||
useEffect(() => {
|
||||
let active = true
|
||||
void (async () => {
|
||||
const result = await api.getConfig()
|
||||
if (!active) {
|
||||
return
|
||||
}
|
||||
const config = result.data?.config
|
||||
if (config) {
|
||||
setForm((prev) => ({
|
||||
serverUri: config.serverUri ?? prev.serverUri,
|
||||
domain: config.domain ?? prev.domain,
|
||||
username: config.username ?? prev.username,
|
||||
password: config.password ?? prev.password,
|
||||
}))
|
||||
if (config.collection) {
|
||||
setSelectedCollection(config.collection)
|
||||
}
|
||||
}
|
||||
})()
|
||||
return () => {
|
||||
active = false
|
||||
}
|
||||
}, [])
|
||||
|
||||
/**
|
||||
* 生成受控输入框的 onChange 处理器。
|
||||
*/
|
||||
const updateField = (key: keyof ConnectFormState) => (event: ChangeEvent<HTMLInputElement>) => {
|
||||
const { value } = event.target
|
||||
setForm((prev) => ({ ...prev, [key]: value }))
|
||||
}
|
||||
|
||||
/**
|
||||
* 连接 TFS 并加载当前账号可见的 Collection 列表。
|
||||
*/
|
||||
const handleConnect = useCallback(async () => {
|
||||
setError(null)
|
||||
setBusy(true)
|
||||
setBusyText("正在连接 TFS…")
|
||||
const payload: Partial<AppConfig> = {
|
||||
serverUri: form.serverUri.trim(),
|
||||
authType: "ntlm-explicit",
|
||||
domain: form.domain.trim(),
|
||||
username: form.username.trim(),
|
||||
password: form.password,
|
||||
}
|
||||
const connectResult = await api.connect(payload)
|
||||
if (!connectResult.ok) {
|
||||
setBusy(false)
|
||||
setError(connectResult.errorMessage ?? "连接失败")
|
||||
return
|
||||
}
|
||||
setBusyText("正在加载 Collection…")
|
||||
const collectionsResult = await api.listCollections()
|
||||
setBusy(false)
|
||||
if (!collectionsResult.ok) {
|
||||
setError(collectionsResult.errorMessage ?? "加载 Collection 失败")
|
||||
return
|
||||
}
|
||||
const list = collectionsResult.data?.collections ?? []
|
||||
setCollections(list)
|
||||
setSelectedCollection((prev) =>
|
||||
list.some((item) => item.name === prev) ? prev : list[0]?.name ?? "",
|
||||
)
|
||||
setPhase("collection")
|
||||
}, [form])
|
||||
|
||||
/**
|
||||
* 确认 Collection 后确保默认 Workspace，并把固定上下文回调给上层。
|
||||
*/
|
||||
const handleEnter = useCallback(async () => {
|
||||
if (!selectedCollection) {
|
||||
return
|
||||
}
|
||||
setError(null)
|
||||
setBusy(true)
|
||||
setBusyText("正在确保默认 Workspace…")
|
||||
const ensureResult = await api.ensureWorkspace({ collection: selectedCollection })
|
||||
setBusy(false)
|
||||
const workspace = ensureResult.data?.workspace
|
||||
if (!ensureResult.ok || !workspace) {
|
||||
setError(ensureResult.errorMessage ?? "确保 Workspace 失败")
|
||||
return
|
||||
}
|
||||
onReady({
|
||||
serverUri: form.serverUri.trim(),
|
||||
collection: selectedCollection,
|
||||
workspace: workspace.name,
|
||||
mappings: workspace.mappings ?? [],
|
||||
})
|
||||
}, [selectedCollection, form.serverUri, onReady])
|
||||
|
||||
const canConnect =
|
||||
form.serverUri.trim().length > 0 &&
|
||||
form.username.trim().length > 0 &&
|
||||
form.password.length > 0
|
||||
|
||||
return (
|
||||
<div className="flex min-h-svh items-center justify-center bg-muted/40 p-6">
|
||||
<div className="w-full max-w-md rounded-lg border bg-background p-6 shadow-sm">
|
||||
<div className="space-y-1">
|
||||
<h1 className="text-base font-semibold">macTFS</h1>
|
||||
<p className="text-sm text-muted-foreground">
|
||||
{phase === "form" ? "连接 TFS 服务器" : "选择 Collection"}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{phase === "form" && (
|
||||
<form
|
||||
className="mt-5 space-y-3"
|
||||
onSubmit={(event) => {
|
||||
event.preventDefault()
|
||||
if (canConnect && !busy) {
|
||||
void handleConnect()
|
||||
}
|
||||
}}
|
||||
>
|
||||
<div className="space-y-1.5">
|
||||
<Label htmlFor="serverUri">服务器地址</Label>
|
||||
<Input
|
||||
id="serverUri"
|
||||
placeholder="http://tfs.example.com:8080/tfs"
|
||||
value={form.serverUri}
|
||||
onChange={updateField("serverUri")}
|
||||
disabled={busy}
|
||||
/>
|
||||
</div>
|
||||
<div className="space-y-1.5">
|
||||
<Label htmlFor="domain">域（可选）</Label>
|
||||
<Input
|
||||
id="domain"
|
||||
placeholder="DOMAIN"
|
||||
value={form.domain}
|
||||
onChange={updateField("domain")}
|
||||
disabled={busy}
|
||||
/>
|
||||
</div>
|
||||
<div className="space-y-1.5">
|
||||
<Label htmlFor="username">用户名</Label>
|
||||
<Input
|
||||
id="username"
|
||||
autoComplete="username"
|
||||
value={form.username}
|
||||
onChange={updateField("username")}
|
||||
disabled={busy}
|
||||
/>
|
||||
</div>
|
||||
<div className="space-y-1.5">
|
||||
<Label htmlFor="password">密码</Label>
|
||||
<Input
|
||||
id="password"
|
||||
type="password"
|
||||
autoComplete="current-password"
|
||||
value={form.password}
|
||||
onChange={updateField("password")}
|
||||
disabled={busy}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{error && <p className="text-sm text-destructive">{error}</p>}
|
||||
|
||||
<Button type="submit" className="w-full" disabled={!canConnect || busy}>
|
||||
{busy ? busyText || "处理中…" : "连接 TFS"}
|
||||
</Button>
|
||||
</form>
|
||||
)}
|
||||
|
||||
{phase === "collection" && (
|
||||
<div className="mt-5 space-y-4">
|
||||
{collections.length === 0 ? (
|
||||
<p className="text-sm text-muted-foreground">当前账号没有可见的 Collection。</p>
|
||||
) : (
|
||||
<ul className="max-h-64 space-y-1 overflow-y-auto">
|
||||
{collections.map((collection) => {
|
||||
const active = collection.name === selectedCollection
|
||||
return (
|
||||
<li key={collection.id || collection.name}>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setSelectedCollection(collection.name)}
|
||||
disabled={busy}
|
||||
className={cn(
|
||||
"flex w-full items-center justify-between rounded-md border px-3 py-2 text-left text-sm transition-colors",
|
||||
active
|
||||
? "border-primary bg-primary/10 text-foreground"
|
||||
: "border-border bg-background hover:bg-muted",
|
||||
)}
|
||||
>
|
||||
<span className="font-medium">{collection.name}</span>
|
||||
{active && <span className="text-xs text-primary">已选择</span>}
|
||||
</button>
|
||||
</li>
|
||||
)
|
||||
})}
|
||||
</ul>
|
||||
)}
|
||||
|
||||
{error && <p className="text-sm text-destructive">{error}</p>}
|
||||
|
||||
<div className="flex items-center justify-between gap-2">
|
||||
<Button
|
||||
type="button"
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
onClick={() => {
|
||||
setError(null)
|
||||
setPhase("form")
|
||||
}}
|
||||
disabled={busy}
|
||||
>
|
||||
返回
|
||||
</Button>
|
||||
<Button
|
||||
type="button"
|
||||
onClick={() => void handleEnter()}
|
||||
disabled={busy || !selectedCollection}
|
||||
>
|
||||
{busy ? busyText || "处理中…" : "进入工作台"}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -1,70 +0,0 @@
|
||||
import {
|
||||
ContextMenu,
|
||||
ContextMenuContent,
|
||||
ContextMenuItem,
|
||||
ContextMenuSeparator,
|
||||
ContextMenuTrigger,
|
||||
} from "~/components/ui/context-menu"
|
||||
import type { FileActionId, FileTarget } from "~/lib/tfs"
|
||||
import { buildFileMenu } from "~/lib/tfs"
|
||||
import { cn } from "~/lib/utils"
|
||||
|
||||
/**
|
||||
* 对象右键菜单容器：包住任意触发区域，按统一动作模型渲染菜单分组，
|
||||
* 置灰项展示原因后缀，点击可用项回调上层动作分发器。
|
||||
*/
|
||||
export function FileTargetMenu({
|
||||
target,
|
||||
onAction,
|
||||
children,
|
||||
}: {
|
||||
target: FileTarget
|
||||
onAction: (target: FileTarget, action: FileActionId) => void
|
||||
children: React.ReactNode
|
||||
}) {
|
||||
const sections = buildFileMenu(target)
|
||||
return (
|
||||
<ContextMenu>
|
||||
<ContextMenuTrigger asChild>{children}</ContextMenuTrigger>
|
||||
<ContextMenuContent className="w-52">
|
||||
{sections.map((items, index) => (
|
||||
<Section key={index} withSeparator={index > 0}>
|
||||
{items.map((item) => (
|
||||
<ContextMenuItem
|
||||
key={item.id}
|
||||
disabled={!item.enabled}
|
||||
variant={item.danger && item.enabled ? "destructive" : "default"}
|
||||
onSelect={() => onAction(target, item.id)}
|
||||
>
|
||||
<span>{item.label}</span>
|
||||
{!item.enabled && item.reason && (
|
||||
<span className={cn("ml-auto pl-3 text-xs text-muted-foreground")}>
|
||||
{item.reason}
|
||||
</span>
|
||||
)}
|
||||
</ContextMenuItem>
|
||||
))}
|
||||
</Section>
|
||||
))}
|
||||
</ContextMenuContent>
|
||||
</ContextMenu>
|
||||
)
|
||||
}
|
||||
|
||||
/**
|
||||
* 菜单分组：非首组前自动插入分隔线。
|
||||
*/
|
||||
function Section({
|
||||
withSeparator,
|
||||
children,
|
||||
}: {
|
||||
withSeparator: boolean
|
||||
children: React.ReactNode
|
||||
}) {
|
||||
return (
|
||||
<>
|
||||
{withSeparator && <ContextMenuSeparator />}
|
||||
{children}
|
||||
</>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,169 @@
|
||||
import {
|
||||
CheckCircle2,
|
||||
Loader2,
|
||||
RefreshCw,
|
||||
Terminal,
|
||||
TriangleAlert,
|
||||
} from "lucide-react"
|
||||
|
||||
import { Button } from "~/components/ui/button"
|
||||
import type { ApiRequestLogEntry } from "~/lib/api/client"
|
||||
|
||||
interface OperationLogPanelProps {
|
||||
logs: ApiRequestLogEntry[]
|
||||
loading: boolean
|
||||
serviceMessage: string
|
||||
requestStatus: string
|
||||
username: string
|
||||
onRefresh(): void
|
||||
}
|
||||
|
||||
/**
|
||||
* 渲染底部操作日志面板，展示 API 操作状态、耗时、路径摘要和错误信息。
|
||||
*/
|
||||
export function OperationLogPanel({
|
||||
logs,
|
||||
loading,
|
||||
serviceMessage,
|
||||
requestStatus,
|
||||
username,
|
||||
onRefresh,
|
||||
}: OperationLogPanelProps) {
|
||||
return (
|
||||
<div className="flex h-full min-h-0 flex-col">
|
||||
<div className="flex h-9 shrink-0 items-center justify-between gap-3 border-b px-3 text-xs font-medium text-muted-foreground">
|
||||
<div className="flex min-w-0 items-center gap-2">
|
||||
<Terminal className="size-4" />
|
||||
<span>Console</span>
|
||||
<span className="rounded-[6px] border bg-background px-1.5 py-0.5">
|
||||
{logs.length} 条
|
||||
</span>
|
||||
</div>
|
||||
<Button
|
||||
size="icon-xs"
|
||||
variant="ghost"
|
||||
title="刷新服务端操作日志"
|
||||
disabled={loading}
|
||||
onClick={onRefresh}
|
||||
>
|
||||
{loading ? <Loader2 className="animate-spin" /> : <RefreshCw />}
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
{logs.length === 0 ? (
|
||||
<div className="grid gap-1 p-3 font-mono text-xs text-muted-foreground">
|
||||
<div>[service] {serviceMessage}</div>
|
||||
<div>[request] {requestStatus}</div>
|
||||
<div>[session] {username || "anonymous"}</div>
|
||||
<div>[logs] 暂无 API 操作日志</div>
|
||||
</div>
|
||||
) : (
|
||||
<div className="min-h-0 flex-1 overflow-auto">
|
||||
<div className="min-w-[920px]">
|
||||
<div className="sticky top-0 z-10 grid h-7 grid-cols-[140px_76px_142px_142px_86px_minmax(180px,1fr)_minmax(190px,1fr)] border-b bg-muted px-3 text-xs font-medium text-muted-foreground">
|
||||
<div className="flex items-center">操作</div>
|
||||
<div className="flex items-center">状态</div>
|
||||
<div className="flex items-center">开始</div>
|
||||
<div className="flex items-center">结束</div>
|
||||
<div className="flex items-center">耗时</div>
|
||||
<div className="flex items-center">路径摘要</div>
|
||||
<div className="flex items-center">错误信息</div>
|
||||
</div>
|
||||
|
||||
{logs.map((log) => (
|
||||
<div
|
||||
key={log.id}
|
||||
className="grid min-h-7 grid-cols-[140px_76px_142px_142px_86px_minmax(180px,1fr)_minmax(190px,1fr)] items-center border-b px-3 font-mono text-xs"
|
||||
>
|
||||
<div className="truncate">{log.operation}</div>
|
||||
<div>
|
||||
<span
|
||||
className={`inline-flex max-w-full items-center gap-1 rounded-[6px] border px-1.5 py-0.5 ${statusClassName(log)}`}
|
||||
>
|
||||
{log.status === "success" ? (
|
||||
<CheckCircle2 className="size-3" />
|
||||
) : log.status === "running" ? (
|
||||
<Loader2 className="size-3 animate-spin" />
|
||||
) : (
|
||||
<TriangleAlert className="size-3" />
|
||||
)}
|
||||
{statusLabel(log)}
|
||||
</span>
|
||||
</div>
|
||||
<div className="truncate text-muted-foreground">
|
||||
{formatLogTime(log.startedAt)}
|
||||
</div>
|
||||
<div className="truncate text-muted-foreground">
|
||||
{log.status === "running"
|
||||
? "执行中"
|
||||
: formatLogTime(log.endedAt)}
|
||||
</div>
|
||||
<div className="text-muted-foreground">
|
||||
{formatDuration(log)}
|
||||
</div>
|
||||
<div className="truncate text-muted-foreground">
|
||||
{log.summary || "-"}
|
||||
</div>
|
||||
<div
|
||||
className={`truncate ${
|
||||
log.errorMessage
|
||||
? "text-destructive"
|
||||
: "text-muted-foreground"
|
||||
}`}
|
||||
>
|
||||
{log.status === "running"
|
||||
? "请求执行中"
|
||||
: log.errorMessage || "-"}
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
/**
|
||||
* 按日志状态返回中文状态文案。
|
||||
*/
|
||||
function statusLabel(log: ApiRequestLogEntry) {
|
||||
if (log.status === "running") {
|
||||
return "执行中"
|
||||
}
|
||||
return log.success ? "成功" : "失败"
|
||||
}
|
||||
|
||||
/**
|
||||
* 按日志状态返回 badge 样式。
|
||||
*/
|
||||
function statusClassName(log: ApiRequestLogEntry) {
|
||||
if (log.status === "running") {
|
||||
return "border-amber-200 bg-amber-50 text-amber-700"
|
||||
}
|
||||
return log.success
|
||||
? "border-green-200 bg-green-50 text-green-700"
|
||||
: "border-red-200 bg-red-50 text-red-700"
|
||||
}
|
||||
|
||||
/**
|
||||
* 格式化操作日志时间戳。
|
||||
*/
|
||||
function formatLogTime(value?: number) {
|
||||
return value ? new Date(value).toLocaleString() : "-"
|
||||
}
|
||||
|
||||
/**
|
||||
* 格式化操作耗时，执行中的请求保持明确状态。
|
||||
*/
|
||||
function formatDuration(log: ApiRequestLogEntry) {
|
||||
if (log.status === "running") {
|
||||
return "执行中"
|
||||
}
|
||||
if (log.durationMs === undefined) {
|
||||
return "-"
|
||||
}
|
||||
return log.durationMs < 1000
|
||||
? `${log.durationMs} ms`
|
||||
: `${(log.durationMs / 1000).toFixed(1)} s`
|
||||
}
|
||||
@@ -1,113 +0,0 @@
|
||||
import { PanelBottom, PanelLeft, PanelRight } from "lucide-react"
|
||||
|
||||
import { Button } from "~/components/ui/button"
|
||||
import { Separator } from "~/components/ui/separator"
|
||||
import { Tooltip, TooltipContent, TooltipTrigger } from "~/components/ui/tooltip"
|
||||
import type { WorkspaceSession } from "~/lib/tfs/session"
|
||||
import { cn } from "~/lib/utils"
|
||||
|
||||
// 三个可折叠面板的显隐状态，由 WorkspaceShell 持有。
|
||||
export interface PanelVisibility {
|
||||
tree: boolean
|
||||
changes: boolean
|
||||
console: boolean
|
||||
}
|
||||
|
||||
/**
|
||||
* 顶部上下文栏：展示固定的 Server / Collection / Workspace 上下文，
|
||||
* 以及面板折叠开关与重新连接入口，不承载对象级操作。
|
||||
*/
|
||||
export function TopBar({
|
||||
session,
|
||||
panels,
|
||||
onTogglePanel,
|
||||
onReconnect,
|
||||
}: {
|
||||
session: WorkspaceSession
|
||||
panels: PanelVisibility
|
||||
onTogglePanel: (panel: keyof PanelVisibility) => void
|
||||
onReconnect: () => void
|
||||
}) {
|
||||
return (
|
||||
<header className="flex h-12 shrink-0 items-center justify-between gap-3 border-b bg-background px-3">
|
||||
<div className="flex min-w-0 items-center gap-2 text-sm">
|
||||
<span className="shrink-0 font-semibold">macTFS</span>
|
||||
<Separator orientation="vertical" className="h-4!" />
|
||||
<span className="hidden shrink-0 text-xs text-muted-foreground lg:inline">
|
||||
服务器
|
||||
</span>
|
||||
<span className="hidden max-w-56 truncate font-mono text-xs lg:inline">
|
||||
{session.serverUri}
|
||||
</span>
|
||||
<Separator orientation="vertical" className="hidden h-4! lg:block" />
|
||||
<span className="shrink-0 text-xs text-muted-foreground">Collection</span>
|
||||
<span className="max-w-40 truncate text-xs font-medium">{session.collection}</span>
|
||||
<Separator orientation="vertical" className="h-4!" />
|
||||
<span className="shrink-0 text-xs text-muted-foreground">Workspace</span>
|
||||
<span className="max-w-44 truncate font-mono text-xs">{session.workspace}</span>
|
||||
</div>
|
||||
|
||||
<div className="flex shrink-0 items-center gap-1">
|
||||
<PanelToggle
|
||||
label="源码目录面板"
|
||||
active={panels.tree}
|
||||
onClick={() => onTogglePanel("tree")}
|
||||
>
|
||||
<PanelLeft />
|
||||
</PanelToggle>
|
||||
<PanelToggle
|
||||
label="挂起更改面板"
|
||||
active={panels.changes}
|
||||
onClick={() => onTogglePanel("changes")}
|
||||
>
|
||||
<PanelRight />
|
||||
</PanelToggle>
|
||||
<PanelToggle
|
||||
label="操作日志面板"
|
||||
active={panels.console}
|
||||
onClick={() => onTogglePanel("console")}
|
||||
>
|
||||
<PanelBottom />
|
||||
</PanelToggle>
|
||||
<Separator orientation="vertical" className="mx-1 h-4!" />
|
||||
<Button size="sm" variant="outline" onClick={onReconnect}>
|
||||
重新连接
|
||||
</Button>
|
||||
</div>
|
||||
</header>
|
||||
)
|
||||
}
|
||||
|
||||
/**
|
||||
* 面板折叠开关按钮：图标 + tooltip，激活态用底色区分。
|
||||
*/
|
||||
function PanelToggle({
|
||||
label,
|
||||
active,
|
||||
onClick,
|
||||
children,
|
||||
}: {
|
||||
label: string
|
||||
active: boolean
|
||||
onClick: () => void
|
||||
children: React.ReactNode
|
||||
}) {
|
||||
return (
|
||||
<Tooltip>
|
||||
<TooltipTrigger asChild>
|
||||
<Button
|
||||
size="icon-sm"
|
||||
variant="ghost"
|
||||
aria-pressed={active}
|
||||
onClick={onClick}
|
||||
className={cn(!active && "text-muted-foreground")}
|
||||
>
|
||||
{children}
|
||||
</Button>
|
||||
</TooltipTrigger>
|
||||
<TooltipContent side="bottom">
|
||||
{active ? `收起${label}` : `展开${label}`}
|
||||
</TooltipContent>
|
||||
</Tooltip>
|
||||
)
|
||||
}
|
||||
@@ -1,114 +0,0 @@
|
||||
import { ConfirmDialog } from "~/components/app/confirm-dialog"
|
||||
import { CompareDialog } from "~/components/explorer/compare-dialog"
|
||||
import { ConflictDialog } from "~/components/explorer/conflict-dialog"
|
||||
import { DiffDialog } from "~/components/explorer/diff-dialog"
|
||||
import { FileViewDialog } from "~/components/explorer/file-view-dialog"
|
||||
import { HistoryDialog } from "~/components/explorer/history-dialog"
|
||||
import { MappingDialog } from "~/components/explorer/mapping-dialog"
|
||||
import type { WorkspaceDialogState } from "~/hooks/use-file-actions"
|
||||
import type { MappingInfo } from "~/lib/api"
|
||||
import type { FileActionId, FileTarget } from "~/lib/tfs"
|
||||
|
||||
/**
|
||||
* 工作台业务弹窗出口：按编排 hook 的弹窗状态渲染对应弹窗，
|
||||
* 自身不持有业务状态，所有回调回流到动作编排层。
|
||||
*/
|
||||
export function WorkspaceDialogs({
|
||||
dialog,
|
||||
mappings,
|
||||
onClose,
|
||||
onOpen,
|
||||
onFileAction,
|
||||
onMappingCreated,
|
||||
onConflictsResolved,
|
||||
onForceGetConfirmed,
|
||||
onGetVersion,
|
||||
}: {
|
||||
dialog: WorkspaceDialogState
|
||||
mappings: MappingInfo[]
|
||||
onClose: () => void
|
||||
onOpen: (dialog: WorkspaceDialogState) => void
|
||||
onFileAction: (target: FileTarget, action: FileActionId) => void
|
||||
onMappingCreated: (mappings: MappingInfo[]) => void
|
||||
onConflictsResolved: () => void
|
||||
onForceGetConfirmed: (serverPath: string, folder: boolean) => Promise<void>
|
||||
onGetVersion: (serverPath: string, changeset: number, folder: boolean) => Promise<boolean>
|
||||
}) {
|
||||
if (!dialog) {
|
||||
return null
|
||||
}
|
||||
switch (dialog.kind) {
|
||||
case "mapping":
|
||||
return (
|
||||
<MappingDialog
|
||||
serverPath={dialog.serverPath}
|
||||
onClose={onClose}
|
||||
onCreated={onMappingCreated}
|
||||
/>
|
||||
)
|
||||
case "history":
|
||||
return (
|
||||
<HistoryDialog
|
||||
serverPath={dialog.serverPath}
|
||||
folder={dialog.folder}
|
||||
onClose={onClose}
|
||||
onDiffRevisions={(serverPath, sourceChangeset, targetChangeset) =>
|
||||
onOpen({
|
||||
kind: "diff",
|
||||
request: { mode: "revisions", serverPath, sourceChangeset, targetChangeset },
|
||||
})
|
||||
}
|
||||
onGetVersion={onGetVersion}
|
||||
/>
|
||||
)
|
||||
case "compare":
|
||||
return (
|
||||
<CompareDialog
|
||||
serverPath={dialog.serverPath}
|
||||
mappings={mappings}
|
||||
onClose={onClose}
|
||||
onFileAction={onFileAction}
|
||||
/>
|
||||
)
|
||||
case "viewFile":
|
||||
return (
|
||||
<FileViewDialog
|
||||
serverPath={dialog.serverPath}
|
||||
localPath={dialog.localPath}
|
||||
changeset={dialog.changeset}
|
||||
onClose={onClose}
|
||||
/>
|
||||
)
|
||||
case "diff":
|
||||
return <DiffDialog request={dialog.request} onClose={onClose} />
|
||||
case "conflicts":
|
||||
return (
|
||||
<ConflictDialog
|
||||
serverPath={dialog.serverPath}
|
||||
onClose={onClose}
|
||||
onResolved={onConflictsResolved}
|
||||
/>
|
||||
)
|
||||
case "confirmForceGet":
|
||||
return (
|
||||
<ConfirmDialog
|
||||
title="强制获取最新"
|
||||
description={
|
||||
<>
|
||||
<p>
|
||||
将对 <span className="font-mono text-xs">{dialog.serverPath}</span>{" "}
|
||||
强制获取服务器最新版本。
|
||||
</p>
|
||||
<p className="mt-2 font-medium text-destructive">
|
||||
本地未签入的修改会被服务器版本直接覆盖，且无法恢复。确定继续吗？
|
||||
</p>
|
||||
</>
|
||||
}
|
||||
confirmLabel="覆盖本地并获取"
|
||||
danger
|
||||
onConfirm={() => onForceGetConfirmed(dialog.serverPath, dialog.folder)}
|
||||
onClose={onClose}
|
||||
/>
|
||||
)
|
||||
}
|
||||
}
|
||||
@@ -1,154 +0,0 @@
|
||||
import { useCallback, useState } from "react"
|
||||
|
||||
import { TopBar, type PanelVisibility } from "~/components/app/top-bar"
|
||||
import { WorkspaceDialogs } from "~/components/app/workspace-dialogs"
|
||||
import { FolderItemsPanel } from "~/components/explorer/folder-items-panel"
|
||||
import { SourceTreePanel } from "~/components/explorer/source-tree-panel"
|
||||
import { ChangesPanel } from "~/components/inspector/changes-panel"
|
||||
import { ConsolePanel } from "~/components/logs/console-panel"
|
||||
import { TooltipProvider } from "~/components/ui/tooltip"
|
||||
import { useFileActions } from "~/hooks/use-file-actions"
|
||||
import { usePendingChanges } from "~/hooks/use-pending-changes"
|
||||
import type { MappingInfo } from "~/lib/api"
|
||||
import type { WorkspaceSession } from "~/lib/tfs"
|
||||
import { cn } from "~/lib/utils"
|
||||
|
||||
/**
|
||||
* 三栏工作台外壳：组合顶部上下文栏、左树、中间列表、右侧 Changes、底部 Console。
|
||||
* 挂起更改状态与对象动作编排分别收口在 usePendingChanges / useFileActions。
|
||||
*/
|
||||
export function WorkspaceShell({
|
||||
session,
|
||||
selectedServerPath,
|
||||
onNavigate,
|
||||
onMappingsChanged,
|
||||
onReconnect,
|
||||
}: {
|
||||
session: WorkspaceSession
|
||||
selectedServerPath: string
|
||||
onNavigate: (serverPath: string) => void
|
||||
onMappingsChanged: (mappings: MappingInfo[]) => void
|
||||
onReconnect: () => void
|
||||
}) {
|
||||
const [panels, setPanels] = useState<PanelVisibility>({
|
||||
tree: true,
|
||||
changes: true,
|
||||
console: true,
|
||||
})
|
||||
// 中间列表 / 底部日志刷新令牌：文件操作完成后递增触发重新加载。
|
||||
const [itemsRefreshToken, setItemsRefreshToken] = useState(0)
|
||||
const [logsRefreshToken, setLogsRefreshToken] = useState(0)
|
||||
|
||||
/**
|
||||
* 切换指定面板的展开 / 收起状态。
|
||||
*/
|
||||
const togglePanel = useCallback((panel: keyof PanelVisibility) => {
|
||||
setPanels((prev) => ({ ...prev, [panel]: !prev[panel] }))
|
||||
}, [])
|
||||
|
||||
/**
|
||||
* 触发中间目录列表重新加载。
|
||||
*/
|
||||
const refreshItems = useCallback(() => {
|
||||
setItemsRefreshToken((token) => token + 1)
|
||||
}, [])
|
||||
|
||||
/**
|
||||
* 触发底部操作日志重新加载。
|
||||
*/
|
||||
const refreshLogs = useCallback(() => {
|
||||
setLogsRefreshToken((token) => token + 1)
|
||||
}, [])
|
||||
|
||||
const pending = usePendingChanges()
|
||||
const actions = useFileActions({
|
||||
onMappingsChanged,
|
||||
refreshPendingChanges: pending.refresh,
|
||||
refreshItems,
|
||||
refreshLogs,
|
||||
})
|
||||
|
||||
return (
|
||||
<TooltipProvider>
|
||||
<div className="flex h-svh flex-col overflow-hidden bg-background">
|
||||
<TopBar
|
||||
session={session}
|
||||
panels={panels}
|
||||
onTogglePanel={togglePanel}
|
||||
onReconnect={onReconnect}
|
||||
/>
|
||||
|
||||
{actions.notice && (
|
||||
<div
|
||||
className={cn(
|
||||
"flex shrink-0 items-center gap-2 border-b px-3 py-1 text-xs",
|
||||
actions.notice.kind === "error"
|
||||
? "bg-destructive/10 text-destructive"
|
||||
: "bg-primary/5 text-foreground",
|
||||
)}
|
||||
>
|
||||
{actions.actionBusy && (
|
||||
<span className="size-2 animate-pulse rounded-full bg-primary" />
|
||||
)}
|
||||
{actions.notice.text}
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="flex min-h-0 flex-1">
|
||||
{panels.tree && (
|
||||
<SourceTreePanel
|
||||
collection={session.collection}
|
||||
mappings={session.mappings}
|
||||
selectedServerPath={selectedServerPath}
|
||||
onNavigate={onNavigate}
|
||||
onFileAction={actions.handleFileAction}
|
||||
/>
|
||||
)}
|
||||
<FolderItemsPanel
|
||||
session={session}
|
||||
selectedServerPath={selectedServerPath}
|
||||
pendingByServerPath={pending.pendingByServerPath}
|
||||
refreshToken={itemsRefreshToken}
|
||||
onNavigate={onNavigate}
|
||||
onFileAction={actions.handleFileAction}
|
||||
onRefresh={refreshItems}
|
||||
/>
|
||||
{panels.changes && (
|
||||
<ChangesPanel
|
||||
mappings={session.mappings}
|
||||
pendingChanges={pending.pendingChanges}
|
||||
excludedKeys={pending.excludedKeys}
|
||||
loading={pending.loading}
|
||||
error={pending.error}
|
||||
checkinBusy={actions.checkinBusy}
|
||||
onToggleExcluded={pending.toggleExcluded}
|
||||
onCheckin={actions.handleCheckin}
|
||||
onFileAction={actions.handleFileAction}
|
||||
onRefresh={() => void pending.refresh()}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{panels.console && (
|
||||
<ConsolePanel
|
||||
refreshToken={logsRefreshToken}
|
||||
busy={actions.actionBusy || actions.checkinBusy}
|
||||
busyText={actions.notice?.kind === "info" ? actions.notice.text : null}
|
||||
/>
|
||||
)}
|
||||
|
||||
<WorkspaceDialogs
|
||||
dialog={actions.dialog}
|
||||
mappings={session.mappings}
|
||||
onClose={() => actions.setDialog(null)}
|
||||
onOpen={actions.setDialog}
|
||||
onFileAction={actions.handleFileAction}
|
||||
onMappingCreated={actions.handleMappingCreated}
|
||||
onConflictsResolved={actions.handleConflictsResolved}
|
||||
onForceGetConfirmed={actions.handleForceGetConfirmed}
|
||||
onGetVersion={actions.runGetVersion}
|
||||
/>
|
||||
</div>
|
||||
</TooltipProvider>
|
||||
)
|
||||
}
|
||||
@@ -1,231 +0,0 @@
|
||||
import { useCallback, useEffect, useMemo, useState } from "react"
|
||||
import { FileText, FolderClosed, Loader2, RefreshCw } from "lucide-react"
|
||||
|
||||
import { FileTargetMenu } from "~/components/app/file-target-menu"
|
||||
import { Badge } from "~/components/ui/badge"
|
||||
import { Button } from "~/components/ui/button"
|
||||
import { Checkbox } from "~/components/ui/checkbox"
|
||||
import {
|
||||
Dialog,
|
||||
DialogContent,
|
||||
DialogDescription,
|
||||
DialogHeader,
|
||||
DialogTitle,
|
||||
} from "~/components/ui/dialog"
|
||||
import {
|
||||
Table,
|
||||
TableBody,
|
||||
TableCell,
|
||||
TableHead,
|
||||
TableHeader,
|
||||
TableRow,
|
||||
} from "~/components/ui/table"
|
||||
import { api } from "~/lib/api"
|
||||
import type { FolderDiffItem, MappingInfo } from "~/lib/api"
|
||||
import type { FileActionId, FileTarget } from "~/lib/tfs"
|
||||
import { makeFileTarget, statusBadgeClass, statusLabel } from "~/lib/tfs"
|
||||
import { cn } from "~/lib/utils"
|
||||
|
||||
/**
|
||||
* 目录对比弹窗：对已映射目录执行本地与服务端对比，
|
||||
* 默认隐藏 upToDate，支持状态筛选、刷新重比，结果项走统一右键菜单。
|
||||
*/
|
||||
export function CompareDialog({
|
||||
serverPath,
|
||||
mappings,
|
||||
onClose,
|
||||
onFileAction,
|
||||
}: {
|
||||
serverPath: string
|
||||
mappings: MappingInfo[]
|
||||
onClose: () => void
|
||||
onFileAction: (target: FileTarget, action: FileActionId) => void
|
||||
}) {
|
||||
const [diffs, setDiffs] = useState<FolderDiffItem[]>([])
|
||||
const [loading, setLoading] = useState(true)
|
||||
const [error, setError] = useState<string | null>(null)
|
||||
const [showUpToDate, setShowUpToDate] = useState(false)
|
||||
// 状态筛选：空集合表示不过滤（除 upToDate 开关外）。
|
||||
const [statusFilter, setStatusFilter] = useState<Set<string>>(new Set())
|
||||
|
||||
/**
|
||||
* 执行（或重新执行）目录对比。
|
||||
*/
|
||||
const runCompare = useCallback(async () => {
|
||||
setLoading(true)
|
||||
setError(null)
|
||||
const result = await api.compareFolder({ serverPath, recursive: true })
|
||||
setLoading(false)
|
||||
if (!result.ok) {
|
||||
setError(result.errorMessage ?? "目录对比失败")
|
||||
return
|
||||
}
|
||||
setDiffs(result.data?.diffs ?? [])
|
||||
}, [serverPath])
|
||||
|
||||
useEffect(() => {
|
||||
void runCompare()
|
||||
}, [runCompare])
|
||||
|
||||
// 结果中出现过的状态（不含 upToDate），用于生成筛选 chips。
|
||||
const presentStatuses = useMemo(() => {
|
||||
const set = new Set<string>()
|
||||
for (const diff of diffs) {
|
||||
if (diff.status !== "upToDate") {
|
||||
set.add(diff.status)
|
||||
}
|
||||
}
|
||||
return [...set]
|
||||
}, [diffs])
|
||||
|
||||
const visibleDiffs = useMemo(
|
||||
() =>
|
||||
diffs.filter((diff) => {
|
||||
if (diff.status === "upToDate") {
|
||||
return showUpToDate && statusFilter.size === 0
|
||||
}
|
||||
return statusFilter.size === 0 || statusFilter.has(diff.status)
|
||||
}),
|
||||
[diffs, showUpToDate, statusFilter],
|
||||
)
|
||||
|
||||
/**
|
||||
* 切换某个状态筛选 chip。
|
||||
*/
|
||||
const toggleStatus = useCallback((status: string) => {
|
||||
setStatusFilter((prev) => {
|
||||
const next = new Set(prev)
|
||||
if (next.has(status)) {
|
||||
next.delete(status)
|
||||
} else {
|
||||
next.add(status)
|
||||
}
|
||||
return next
|
||||
})
|
||||
}, [])
|
||||
|
||||
return (
|
||||
<Dialog open onOpenChange={(open) => !open && onClose()}>
|
||||
<DialogContent className="flex h-[88svh] max-h-[88svh] flex-col sm:max-w-[90vw]">
|
||||
<DialogHeader>
|
||||
<DialogTitle>目录对比</DialogTitle>
|
||||
<DialogDescription className="font-mono text-xs">{serverPath}</DialogDescription>
|
||||
</DialogHeader>
|
||||
|
||||
<div className="flex shrink-0 flex-wrap items-center gap-2">
|
||||
{presentStatuses.map((status) => (
|
||||
<button key={status} type="button" onClick={() => toggleStatus(status)}>
|
||||
<Badge
|
||||
variant="secondary"
|
||||
className={cn(
|
||||
"cursor-pointer rounded-md",
|
||||
statusBadgeClass(status),
|
||||
statusFilter.size > 0 && !statusFilter.has(status) && "opacity-40",
|
||||
)}
|
||||
>
|
||||
{statusLabel(status)}
|
||||
</Badge>
|
||||
</button>
|
||||
))}
|
||||
<label className="ml-auto flex items-center gap-1.5 text-xs text-muted-foreground">
|
||||
<Checkbox
|
||||
checked={showUpToDate}
|
||||
onCheckedChange={(value) => setShowUpToDate(value === true)}
|
||||
/>
|
||||
显示最新项
|
||||
</label>
|
||||
<Button
|
||||
variant="outline"
|
||||
size="sm"
|
||||
onClick={() => void runCompare()}
|
||||
disabled={loading}
|
||||
>
|
||||
<RefreshCw data-icon="inline-start" className={cn(loading && "animate-spin")} />
|
||||
重新对比
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
<div className="min-h-0 flex-1 overflow-auto rounded-md border">
|
||||
{loading ? (
|
||||
<div className="flex h-48 items-center justify-center gap-2 text-sm text-muted-foreground">
|
||||
<Loader2 className="size-4 animate-spin" />
|
||||
正在对比目录…
|
||||
</div>
|
||||
) : error ? (
|
||||
<div className="flex h-48 items-center justify-center text-sm text-destructive">
|
||||
{error}
|
||||
</div>
|
||||
) : visibleDiffs.length === 0 ? (
|
||||
<div className="flex h-48 items-center justify-center text-sm text-muted-foreground">
|
||||
{diffs.length === 0 ? "本地与服务端一致，没有差异" : "没有符合筛选条件的差异项"}
|
||||
</div>
|
||||
) : (
|
||||
<Table>
|
||||
<TableHeader className="sticky top-0 z-10 bg-background">
|
||||
<TableRow className="hover:bg-transparent">
|
||||
<TableHead className="h-8 text-xs text-muted-foreground">名称</TableHead>
|
||||
<TableHead className="h-8 w-28 text-xs text-muted-foreground">状态</TableHead>
|
||||
<TableHead className="h-8 w-24 text-right text-xs text-muted-foreground">本地版本</TableHead>
|
||||
<TableHead className="h-8 w-24 text-right text-xs text-muted-foreground">最新版本</TableHead>
|
||||
<TableHead className="h-8 text-xs text-muted-foreground">服务端路径</TableHead>
|
||||
</TableRow>
|
||||
</TableHeader>
|
||||
<TableBody>
|
||||
{visibleDiffs.map((diff) => {
|
||||
const target = makeFileTarget({
|
||||
source: "compare",
|
||||
folder: diff.folder,
|
||||
serverPath: diff.serverPath,
|
||||
mappings,
|
||||
pendingStatus: diff.status.startsWith("pending") ? diff.status : null,
|
||||
compareStatus: diff.status,
|
||||
})
|
||||
return (
|
||||
<FileTargetMenu key={diff.serverPath} target={target} onAction={onFileAction}>
|
||||
<TableRow className="cursor-default select-none">
|
||||
<TableCell className="py-1.5">
|
||||
<span className="flex items-center gap-1.5">
|
||||
{diff.folder ? (
|
||||
<FolderClosed className="size-3.5 shrink-0 text-muted-foreground" />
|
||||
) : (
|
||||
<FileText className="size-3.5 shrink-0 text-muted-foreground" />
|
||||
)}
|
||||
<span className="truncate text-sm">{diff.name}</span>
|
||||
</span>
|
||||
</TableCell>
|
||||
<TableCell className="py-1.5">
|
||||
<Badge
|
||||
variant="secondary"
|
||||
className={cn("rounded-md", statusBadgeClass(diff.status))}
|
||||
>
|
||||
{statusLabel(diff.status)}
|
||||
</Badge>
|
||||
</TableCell>
|
||||
<TableCell className="py-1.5 text-right font-mono text-xs">
|
||||
{diff.localVersion > 0 ? diff.localVersion : "—"}
|
||||
</TableCell>
|
||||
<TableCell className="py-1.5 text-right font-mono text-xs">
|
||||
{diff.latestVersion > 0 ? diff.latestVersion : "—"}
|
||||
</TableCell>
|
||||
<TableCell
|
||||
className="max-w-0 truncate py-1.5 font-mono text-xs text-muted-foreground"
|
||||
title={diff.serverPath}
|
||||
>
|
||||
{diff.serverPath}
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
</FileTargetMenu>
|
||||
)
|
||||
})}
|
||||
</TableBody>
|
||||
</Table>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<p className="shrink-0 text-xs text-muted-foreground">
|
||||
{visibleDiffs.length} / {diffs.length} 项 · 差异项操作通过右键菜单触发
|
||||
</p>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
)
|
||||
}
|
||||
@@ -1,303 +0,0 @@
|
||||
import { useCallback, useEffect, useMemo, useState } from "react"
|
||||
import { FileDiff, Loader2 } from "lucide-react"
|
||||
|
||||
import { DiffDialog, type DiffRequest } from "~/components/explorer/diff-dialog"
|
||||
import { Badge } from "~/components/ui/badge"
|
||||
import { Button } from "~/components/ui/button"
|
||||
import {
|
||||
Dialog,
|
||||
DialogContent,
|
||||
DialogDescription,
|
||||
DialogFooter,
|
||||
DialogHeader,
|
||||
DialogTitle,
|
||||
} from "~/components/ui/dialog"
|
||||
import {
|
||||
Select,
|
||||
SelectContent,
|
||||
SelectItem,
|
||||
SelectTrigger,
|
||||
SelectValue,
|
||||
} from "~/components/ui/select"
|
||||
import {
|
||||
Table,
|
||||
TableBody,
|
||||
TableCell,
|
||||
TableHead,
|
||||
TableHeader,
|
||||
TableRow,
|
||||
} from "~/components/ui/table"
|
||||
import { api } from "~/lib/api"
|
||||
import type { ConflictInfo, ConflictResolution } from "~/lib/api"
|
||||
|
||||
// 每个冲突的取舍选择：未选择 / 采用服务器版本 / 保留本地版本。
|
||||
type ChoiceValue = "none" | ConflictResolution
|
||||
|
||||
/**
|
||||
* 统一冲突弹窗：Get Latest 与 Checkout 共用。
|
||||
* 支持逐文件选择服务器版本或保留本地版本、批量设置、冲突文件 Diff、批量应用。
|
||||
*/
|
||||
export function ConflictDialog({
|
||||
serverPath,
|
||||
onClose,
|
||||
onResolved,
|
||||
}: {
|
||||
serverPath: string
|
||||
onClose: () => void
|
||||
onResolved: () => void
|
||||
}) {
|
||||
const [conflicts, setConflicts] = useState<ConflictInfo[]>([])
|
||||
const [choices, setChoices] = useState<Record<number, ChoiceValue>>({})
|
||||
const [loading, setLoading] = useState(true)
|
||||
const [applying, setApplying] = useState(false)
|
||||
const [error, setError] = useState<string | null>(null)
|
||||
// 应用结果摘要：conflictId -> 是否成功。
|
||||
const [applied, setApplied] = useState<Record<number, boolean>>({})
|
||||
const [diffRequest, setDiffRequest] = useState<DiffRequest | null>(null)
|
||||
// 是否发生过成功应用，关闭时据此通知上层刷新。
|
||||
const [didResolve, setDidResolve] = useState(false)
|
||||
|
||||
/**
|
||||
* 加载当前范围内的未解决冲突。
|
||||
*/
|
||||
const loadConflicts = useCallback(async () => {
|
||||
setLoading(true)
|
||||
const result = await api.listConflicts({ serverPath, recursive: true })
|
||||
setLoading(false)
|
||||
if (!result.ok) {
|
||||
setError(result.errorMessage ?? "冲突明细加载失败")
|
||||
return
|
||||
}
|
||||
setError(null)
|
||||
const list = (result.data?.conflicts ?? []).filter((item) => !item.resolved)
|
||||
setConflicts(list)
|
||||
setChoices({})
|
||||
setApplied({})
|
||||
}, [serverPath])
|
||||
|
||||
useEffect(() => {
|
||||
void loadConflicts()
|
||||
}, [loadConflicts])
|
||||
|
||||
const chosenCount = useMemo(
|
||||
() => Object.values(choices).filter((value) => value !== "none").length,
|
||||
[choices],
|
||||
)
|
||||
|
||||
/**
|
||||
* 批量把所有冲突设置为同一取舍。
|
||||
*/
|
||||
const setAll = useCallback(
|
||||
(value: ConflictResolution) => {
|
||||
setChoices(() => {
|
||||
const next: Record<number, ChoiceValue> = {}
|
||||
for (const conflict of conflicts) {
|
||||
next[conflict.conflictId] = value
|
||||
}
|
||||
return next
|
||||
})
|
||||
},
|
||||
[conflicts],
|
||||
)
|
||||
|
||||
/**
|
||||
* 应用所有已选择的取舍，逐个调用后端并记录结果。
|
||||
*/
|
||||
const applyChoices = useCallback(async () => {
|
||||
setApplying(true)
|
||||
setError(null)
|
||||
const results: Record<number, boolean> = {}
|
||||
let resolvedAny = false
|
||||
for (const conflict of conflicts) {
|
||||
const choice = choices[conflict.conflictId]
|
||||
if (!choice || choice === "none") {
|
||||
continue
|
||||
}
|
||||
const result = await api.applyConflict({
|
||||
conflictId: conflict.conflictId,
|
||||
resolution: choice,
|
||||
})
|
||||
const success = result.ok && result.data?.resolution?.resolved === true
|
||||
results[conflict.conflictId] = success
|
||||
if (success) {
|
||||
resolvedAny = true
|
||||
}
|
||||
}
|
||||
setApplying(false)
|
||||
setApplied(results)
|
||||
if (resolvedAny) {
|
||||
setDidResolve(true)
|
||||
}
|
||||
const failures = Object.values(results).filter((value) => !value).length
|
||||
if (failures > 0) {
|
||||
setError(`${failures} 个冲突应用失败，可重试`)
|
||||
await loadConflicts()
|
||||
return
|
||||
}
|
||||
// 全部成功：重新加载剩余冲突，没有剩余则关闭并通知刷新。
|
||||
const remain = await api.listConflicts({ serverPath, recursive: true })
|
||||
const remaining = (remain.data?.conflicts ?? []).filter((item) => !item.resolved)
|
||||
if (remaining.length === 0) {
|
||||
onResolved()
|
||||
return
|
||||
}
|
||||
setConflicts(remaining)
|
||||
setChoices({})
|
||||
setApplied({})
|
||||
}, [conflicts, choices, serverPath, loadConflicts, onResolved])
|
||||
|
||||
/**
|
||||
* 关闭弹窗：若期间有成功应用，通知上层刷新状态。
|
||||
*/
|
||||
const handleClose = useCallback(() => {
|
||||
if (didResolve) {
|
||||
onResolved()
|
||||
} else {
|
||||
onClose()
|
||||
}
|
||||
}, [didResolve, onResolved, onClose])
|
||||
|
||||
return (
|
||||
<>
|
||||
<Dialog open onOpenChange={(open) => !open && handleClose()}>
|
||||
<DialogContent className="flex max-h-[80svh] flex-col sm:max-w-3xl">
|
||||
<DialogHeader>
|
||||
<DialogTitle>处理冲突</DialogTitle>
|
||||
<DialogDescription className="font-mono text-xs">{serverPath}</DialogDescription>
|
||||
</DialogHeader>
|
||||
|
||||
<div className="flex shrink-0 items-center gap-2">
|
||||
<Badge variant="secondary" className="rounded-md bg-red-500/10 text-red-700 dark:text-red-400">
|
||||
{conflicts.length} 个冲突
|
||||
</Badge>
|
||||
<span className="text-xs text-muted-foreground">
|
||||
逐项选择，或批量设置后统一应用
|
||||
</span>
|
||||
<div className="ml-auto flex items-center gap-1.5">
|
||||
<Button
|
||||
variant="outline"
|
||||
size="sm"
|
||||
disabled={applying || conflicts.length === 0}
|
||||
onClick={() => setAll("takeServer")}
|
||||
>
|
||||
全部采用服务器
|
||||
</Button>
|
||||
<Button
|
||||
variant="outline"
|
||||
size="sm"
|
||||
disabled={applying || conflicts.length === 0}
|
||||
onClick={() => setAll("keepLocal")}
|
||||
>
|
||||
全部保留本地
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="min-h-0 flex-1 overflow-auto rounded-md border">
|
||||
{loading ? (
|
||||
<div className="flex h-48 items-center justify-center gap-2 text-sm text-muted-foreground">
|
||||
<Loader2 className="size-4 animate-spin" />
|
||||
正在加载冲突…
|
||||
</div>
|
||||
) : conflicts.length === 0 ? (
|
||||
<div className="flex h-48 items-center justify-center text-sm text-muted-foreground">
|
||||
当前范围内没有未解决的冲突
|
||||
</div>
|
||||
) : (
|
||||
<Table>
|
||||
<TableHeader className="sticky top-0 z-10 bg-background">
|
||||
<TableRow className="hover:bg-transparent">
|
||||
<TableHead className="h-8 text-xs text-muted-foreground">文件</TableHead>
|
||||
<TableHead className="h-8 w-24 text-xs text-muted-foreground">类型</TableHead>
|
||||
<TableHead className="h-8 w-44 text-xs text-muted-foreground">取舍</TableHead>
|
||||
<TableHead className="h-8 w-20 text-xs text-muted-foreground">操作</TableHead>
|
||||
</TableRow>
|
||||
</TableHeader>
|
||||
<TableBody>
|
||||
{conflicts.map((conflict) => {
|
||||
const choice = choices[conflict.conflictId] ?? "none"
|
||||
const appliedState = applied[conflict.conflictId]
|
||||
const canDiff =
|
||||
conflict.serverPath != null && conflict.localPath != null
|
||||
return (
|
||||
<TableRow key={conflict.conflictId} className="select-none">
|
||||
<TableCell
|
||||
className="max-w-0 truncate py-1.5 font-mono text-xs"
|
||||
title={conflict.serverPath ?? conflict.localPath ?? ""}
|
||||
>
|
||||
{conflict.serverPath ?? conflict.localPath ?? `冲突 ${conflict.conflictId}`}
|
||||
{appliedState === false && (
|
||||
<span className="ml-2 text-destructive">应用失败</span>
|
||||
)}
|
||||
</TableCell>
|
||||
<TableCell className="py-1.5 text-xs text-muted-foreground">
|
||||
{conflict.type}
|
||||
</TableCell>
|
||||
<TableCell className="py-1.5">
|
||||
<Select
|
||||
value={choice}
|
||||
onValueChange={(value) =>
|
||||
setChoices((prev) => ({
|
||||
...prev,
|
||||
[conflict.conflictId]: value as ChoiceValue,
|
||||
}))
|
||||
}
|
||||
disabled={applying}
|
||||
>
|
||||
<SelectTrigger size="sm" className="w-40 text-xs">
|
||||
<SelectValue placeholder="选择取舍" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem value="none">暂不处理</SelectItem>
|
||||
<SelectItem value="takeServer">采用服务器版本</SelectItem>
|
||||
<SelectItem value="keepLocal">保留本地版本</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</TableCell>
|
||||
<TableCell className="py-1.5">
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon-sm"
|
||||
disabled={!canDiff}
|
||||
title={canDiff ? "查看差异" : "缺少路径信息，无法对比"}
|
||||
onClick={() =>
|
||||
setDiffRequest({
|
||||
mode: "localLatest",
|
||||
serverPath: conflict.serverPath as string,
|
||||
localPath: conflict.localPath as string,
|
||||
})
|
||||
}
|
||||
>
|
||||
<FileDiff />
|
||||
</Button>
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
)
|
||||
})}
|
||||
</TableBody>
|
||||
</Table>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{error && <p className="shrink-0 text-sm text-destructive">{error}</p>}
|
||||
|
||||
<DialogFooter className="shrink-0">
|
||||
<Button variant="ghost" onClick={handleClose} disabled={applying}>
|
||||
稍后处理
|
||||
</Button>
|
||||
<Button
|
||||
onClick={() => void applyChoices()}
|
||||
disabled={applying || chosenCount === 0}
|
||||
>
|
||||
{applying ? "正在应用…" : `应用选择（${chosenCount}）`}
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
|
||||
{diffRequest && (
|
||||
<DiffDialog request={diffRequest} onClose={() => setDiffRequest(null)} />
|
||||
)}
|
||||
</>
|
||||
)
|
||||
}
|
||||
@@ -1,344 +0,0 @@
|
||||
import { useCallback, useEffect, useMemo, useRef, useState } from "react"
|
||||
import type { editor as MonacoEditor } from "monaco-editor"
|
||||
import { ChevronDown, ChevronUp, Loader2, Search } from "lucide-react"
|
||||
|
||||
import { Badge } from "~/components/ui/badge"
|
||||
import { Button } from "~/components/ui/button"
|
||||
import { Checkbox } from "~/components/ui/checkbox"
|
||||
import {
|
||||
Dialog,
|
||||
DialogContent,
|
||||
DialogDescription,
|
||||
DialogHeader,
|
||||
DialogTitle,
|
||||
} from "~/components/ui/dialog"
|
||||
import { api } from "~/lib/api"
|
||||
import type { TextDiff } from "~/lib/api"
|
||||
import { cn } from "~/lib/utils"
|
||||
|
||||
// Diff 请求：本地 vs latest，或同一服务端文件两个历史版本。
|
||||
export type DiffRequest =
|
||||
| { mode: "localLatest"; serverPath: string; localPath: string }
|
||||
| { mode: "revisions"; serverPath: string; sourceChangeset: number; targetChangeset: number }
|
||||
|
||||
// 视图模式在同一会话内记忆。
|
||||
const VIEW_MODE_KEY = "mactfs-diff-view-mode"
|
||||
|
||||
/**
|
||||
* 把后端返回的前缀行（" " / "-" / "+"）还原成左右两侧完整文本：
|
||||
* 空格与 "-" 行属于旧版（左），空格与 "+" 行属于新版（右）。
|
||||
*/
|
||||
function splitDiffSides(raw: string[]): { original: string; modified: string } {
|
||||
const original: string[] = []
|
||||
const modified: string[] = []
|
||||
for (const line of raw) {
|
||||
const prefix = line.charAt(0)
|
||||
const text = line.slice(1)
|
||||
if (prefix === "-") {
|
||||
original.push(text)
|
||||
} else if (prefix === "+") {
|
||||
modified.push(text)
|
||||
} else {
|
||||
original.push(text)
|
||||
modified.push(text)
|
||||
}
|
||||
}
|
||||
return { original: original.join("\n"), modified: modified.join("\n") }
|
||||
}
|
||||
|
||||
/**
|
||||
* 判断当前应用是否处于暗色主题（class 方案），用于选择 Monaco 主题。
|
||||
*/
|
||||
function isDarkTheme(): boolean {
|
||||
return typeof document !== "undefined" && document.documentElement.classList.contains("dark")
|
||||
}
|
||||
|
||||
/**
|
||||
* 文本 Diff 弹窗：基于 Monaco DiffEditor 渲染，支持 本地 vs 服务器 latest
|
||||
* 与 两个历史版本 对比。提供统一 / 左右分栏视图、上一处 / 下一处差异导航、
|
||||
* 仅看差异（折叠未变动区域）、搜索（Cmd+F）、字级高亮与语法着色。
|
||||
*/
|
||||
export function DiffDialog({
|
||||
request,
|
||||
onClose,
|
||||
}: {
|
||||
request: DiffRequest
|
||||
onClose: () => void
|
||||
}) {
|
||||
const [diff, setDiff] = useState<TextDiff | null>(null)
|
||||
const [loading, setLoading] = useState(true)
|
||||
const [error, setError] = useState<string | null>(null)
|
||||
const [onlyChanges, setOnlyChanges] = useState(false)
|
||||
const [viewMode, setViewMode] = useState<"unified" | "split">(() => {
|
||||
if (typeof sessionStorage !== "undefined" && sessionStorage.getItem(VIEW_MODE_KEY) === "unified") {
|
||||
return "unified"
|
||||
}
|
||||
return "split"
|
||||
})
|
||||
// 差异块总数与当前导航到的差异块序号。
|
||||
const [blockCount, setBlockCount] = useState(0)
|
||||
const [blockIndex, setBlockIndex] = useState(-1)
|
||||
const containerRef = useRef<HTMLDivElement | null>(null)
|
||||
const editorRef = useRef<MonacoEditor.IStandaloneDiffEditor | null>(null)
|
||||
|
||||
useEffect(() => {
|
||||
let active = true
|
||||
setLoading(true)
|
||||
setError(null)
|
||||
void (async () => {
|
||||
const result =
|
||||
request.mode === "localLatest"
|
||||
? await api.diffLocalLatest({
|
||||
serverPath: request.serverPath,
|
||||
localPath: request.localPath,
|
||||
})
|
||||
: await api.diffRevisions({
|
||||
serverPath: request.serverPath,
|
||||
sourceChangeset: request.sourceChangeset,
|
||||
targetChangeset: request.targetChangeset,
|
||||
})
|
||||
if (!active) {
|
||||
return
|
||||
}
|
||||
setLoading(false)
|
||||
if (!result.ok || !result.data) {
|
||||
setError(result.errorMessage ?? "Diff 加载失败")
|
||||
return
|
||||
}
|
||||
setDiff(result.data.diff)
|
||||
})()
|
||||
return () => {
|
||||
active = false
|
||||
}
|
||||
}, [request])
|
||||
|
||||
const changedCount = useMemo(
|
||||
() => (diff?.lines ?? []).filter((line) => line.charAt(0) === "-" || line.charAt(0) === "+").length,
|
||||
[diff],
|
||||
)
|
||||
|
||||
// 创建 Monaco DiffEditor：动态 import 保证大体积依赖只在打开弹窗时加载。
|
||||
useEffect(() => {
|
||||
if (!diff) {
|
||||
return
|
||||
}
|
||||
let disposed = false
|
||||
let diffEditor: MonacoEditor.IStandaloneDiffEditor | null = null
|
||||
let originalModel: MonacoEditor.ITextModel | null = null
|
||||
let modifiedModel: MonacoEditor.ITextModel | null = null
|
||||
void (async () => {
|
||||
const { monaco, detectLanguage } = await import("~/lib/monaco")
|
||||
if (disposed || !containerRef.current) {
|
||||
return
|
||||
}
|
||||
const { original, modified } = splitDiffSides(diff.lines)
|
||||
const language = detectLanguage(request.serverPath)
|
||||
originalModel = monaco.editor.createModel(original, language)
|
||||
modifiedModel = monaco.editor.createModel(modified, language)
|
||||
diffEditor = monaco.editor.createDiffEditor(containerRef.current, {
|
||||
readOnly: true,
|
||||
originalEditable: false,
|
||||
automaticLayout: true,
|
||||
renderSideBySide: viewMode === "split",
|
||||
hideUnchangedRegions: { enabled: onlyChanges },
|
||||
theme: isDarkTheme() ? "mactfs-dark" : "mactfs-light",
|
||||
fontSize: 12,
|
||||
lineHeight: 20,
|
||||
fontFamily: 'ui-monospace, SFMono-Regular, Menlo, Monaco, "Courier New", monospace',
|
||||
minimap: { enabled: false },
|
||||
scrollBeyondLastLine: false,
|
||||
renderOverviewRuler: true,
|
||||
overviewRulerBorder: false,
|
||||
hideCursorInOverviewRuler: true,
|
||||
diffWordWrap: "off",
|
||||
diffAlgorithm: "advanced",
|
||||
renderLineHighlight: "none",
|
||||
folding: false,
|
||||
glyphMargin: false,
|
||||
guides: { indentation: false },
|
||||
padding: { top: 8, bottom: 8 },
|
||||
scrollbar: { verticalScrollbarSize: 10, horizontalScrollbarSize: 10, useShadows: false },
|
||||
renderMarginRevertIcon: false,
|
||||
})
|
||||
diffEditor.setModel({ original: originalModel, modified: modifiedModel })
|
||||
diffEditor.onDidUpdateDiff(() => {
|
||||
setBlockCount(diffEditor?.getLineChanges()?.length ?? 0)
|
||||
})
|
||||
editorRef.current = diffEditor
|
||||
})()
|
||||
return () => {
|
||||
disposed = true
|
||||
editorRef.current = null
|
||||
diffEditor?.dispose()
|
||||
originalModel?.dispose()
|
||||
modifiedModel?.dispose()
|
||||
setBlockCount(0)
|
||||
setBlockIndex(-1)
|
||||
}
|
||||
}, [diff, request.serverPath])
|
||||
|
||||
/**
|
||||
* 切换 统一视图（inline）/ 左右分栏（side by side），并记忆到当前会话。
|
||||
*/
|
||||
const switchView = useCallback((mode: "unified" | "split") => {
|
||||
setViewMode(mode)
|
||||
editorRef.current?.updateOptions({ renderSideBySide: mode === "split" })
|
||||
if (typeof sessionStorage !== "undefined") {
|
||||
sessionStorage.setItem(VIEW_MODE_KEY, mode)
|
||||
}
|
||||
}, [])
|
||||
|
||||
/**
|
||||
* 切换「仅看差异」：折叠 / 展开未变动区域。
|
||||
*/
|
||||
const switchOnlyChanges = useCallback((value: boolean) => {
|
||||
setOnlyChanges(value)
|
||||
editorRef.current?.updateOptions({ hideUnchangedRegions: { enabled: value } })
|
||||
}, [])
|
||||
|
||||
/**
|
||||
* 跳到上一处 / 下一处差异块（循环），定位到新版一侧并居中。
|
||||
*/
|
||||
const goToBlock = useCallback(
|
||||
(direction: 1 | -1) => {
|
||||
const diffEditor = editorRef.current
|
||||
const changes = diffEditor?.getLineChanges() ?? []
|
||||
if (!diffEditor || changes.length === 0) {
|
||||
return
|
||||
}
|
||||
const next = (blockIndex + direction + changes.length) % changes.length
|
||||
setBlockIndex(next)
|
||||
const change = changes[next]
|
||||
const line =
|
||||
change.modifiedStartLineNumber > 0
|
||||
? change.modifiedStartLineNumber
|
||||
: Math.max(change.modifiedEndLineNumber, 1)
|
||||
const modifiedEditor = diffEditor.getModifiedEditor()
|
||||
modifiedEditor.revealLineInCenter(line)
|
||||
modifiedEditor.setPosition({ lineNumber: line, column: 1 })
|
||||
modifiedEditor.focus()
|
||||
},
|
||||
[blockIndex],
|
||||
)
|
||||
|
||||
/**
|
||||
* 打开 Monaco 内置搜索框（等价于在内容区按 Cmd+F）。
|
||||
*/
|
||||
const openSearch = useCallback(() => {
|
||||
const modifiedEditor = editorRef.current?.getModifiedEditor()
|
||||
modifiedEditor?.focus()
|
||||
void modifiedEditor?.getAction("actions.find")?.run()
|
||||
}, [])
|
||||
|
||||
return (
|
||||
<Dialog open onOpenChange={(open) => !open && onClose()}>
|
||||
<DialogContent className="flex h-[92svh] max-h-[92svh] flex-col sm:max-w-[94vw]">
|
||||
<DialogHeader>
|
||||
<DialogTitle>
|
||||
{request.mode === "localLatest" ? "服务器 latest vs 本地" : "历史版本对比"}
|
||||
</DialogTitle>
|
||||
<DialogDescription className="font-mono text-xs">
|
||||
{request.serverPath}
|
||||
</DialogDescription>
|
||||
</DialogHeader>
|
||||
|
||||
<div className="flex shrink-0 flex-wrap items-center gap-2 text-xs">
|
||||
{diff && (
|
||||
<>
|
||||
<Badge variant="secondary" className="rounded-md bg-red-500/10 text-red-700 dark:text-red-400">
|
||||
− {diff.sourceLabel}
|
||||
</Badge>
|
||||
<Badge variant="secondary" className="rounded-md bg-green-500/10 text-green-700 dark:text-green-400">
|
||||
+ {diff.targetLabel}
|
||||
</Badge>
|
||||
<span className="text-muted-foreground">{changedCount} 行差异</span>
|
||||
</>
|
||||
)}
|
||||
<div className="ml-2 flex items-center rounded-md border p-0.5">
|
||||
<ViewTab label="统一视图" active={viewMode === "unified"} onClick={() => switchView("unified")} />
|
||||
<ViewTab label="左右分栏" active={viewMode === "split"} onClick={() => switchView("split")} />
|
||||
</div>
|
||||
<div className="flex items-center gap-1">
|
||||
<Button
|
||||
variant="outline"
|
||||
size="icon-sm"
|
||||
disabled={blockCount === 0}
|
||||
onClick={() => goToBlock(-1)}
|
||||
aria-label="上一处差异"
|
||||
>
|
||||
<ChevronUp />
|
||||
</Button>
|
||||
<Button
|
||||
variant="outline"
|
||||
size="icon-sm"
|
||||
disabled={blockCount === 0}
|
||||
onClick={() => goToBlock(1)}
|
||||
aria-label="下一处差异"
|
||||
>
|
||||
<ChevronDown />
|
||||
</Button>
|
||||
<span className="text-muted-foreground">
|
||||
{blockCount === 0 ? "无差异块" : `${blockIndex + 1 > 0 ? blockIndex + 1 : "—"} / ${blockCount}`}
|
||||
</span>
|
||||
</div>
|
||||
<label className="ml-auto flex items-center gap-1.5 text-muted-foreground">
|
||||
<Checkbox
|
||||
checked={onlyChanges}
|
||||
onCheckedChange={(value) => switchOnlyChanges(value === true)}
|
||||
/>
|
||||
仅看差异
|
||||
</label>
|
||||
<Button variant="outline" size="sm" className="h-7 gap-1 text-xs" onClick={openSearch}>
|
||||
<Search className="size-3.5" />
|
||||
搜索
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
<div className="relative min-h-0 flex-1 overflow-hidden rounded-md border">
|
||||
{loading ? (
|
||||
<div className="flex h-full items-center justify-center gap-2 text-sm text-muted-foreground">
|
||||
<Loader2 className="size-4 animate-spin" />
|
||||
正在生成 Diff…
|
||||
</div>
|
||||
) : error ? (
|
||||
<div className="flex h-full items-center justify-center p-6 text-center text-sm text-destructive">
|
||||
{error}
|
||||
</div>
|
||||
) : changedCount === 0 ? (
|
||||
<div className="flex h-full items-center justify-center text-sm text-muted-foreground">
|
||||
两个版本内容一致
|
||||
</div>
|
||||
) : (
|
||||
<div ref={containerRef} className="absolute inset-0" />
|
||||
)}
|
||||
</div>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
)
|
||||
}
|
||||
|
||||
/**
|
||||
* 视图切换小标签按钮。
|
||||
*/
|
||||
function ViewTab({
|
||||
label,
|
||||
active,
|
||||
onClick,
|
||||
}: {
|
||||
label: string
|
||||
active: boolean
|
||||
onClick: () => void
|
||||
}) {
|
||||
return (
|
||||
<button
|
||||
type="button"
|
||||
onClick={onClick}
|
||||
className={cn(
|
||||
"rounded-[5px] px-2 py-0.5 text-xs",
|
||||
active ? "bg-primary/10 font-medium text-foreground" : "text-muted-foreground",
|
||||
)}
|
||||
>
|
||||
{label}
|
||||
</button>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,185 @@
|
||||
import { useEffect, useState } from "react"
|
||||
import { GitCompareArrows, Loader2, RefreshCw, X } from "lucide-react"
|
||||
|
||||
import { Button } from "~/components/ui/button"
|
||||
import { diffLocalLatest, diffRevisions } from "~/lib/api/endpoints"
|
||||
import type { TfsTextDiff } from "~/lib/api/types"
|
||||
|
||||
export type DiffPanelRequest =
|
||||
| {
|
||||
type: "localLatest"
|
||||
serverPath: string
|
||||
localPath: string
|
||||
label: string
|
||||
}
|
||||
| {
|
||||
type: "revisions"
|
||||
serverPath: string
|
||||
sourceChangeset: number
|
||||
targetChangeset: number
|
||||
label: string
|
||||
}
|
||||
|
||||
interface DiffPanelProps {
|
||||
request: DiffPanelRequest
|
||||
onClose(): void
|
||||
}
|
||||
|
||||
interface DiffRow {
|
||||
source?: string
|
||||
target?: string
|
||||
kind: "same" | "removed" | "added"
|
||||
}
|
||||
|
||||
/**
|
||||
* 展示文本 Diff 面板，支持本地 vs latest 和两个历史版本对比。
|
||||
*/
|
||||
export function DiffPanel({ request, onClose }: DiffPanelProps) {
|
||||
const [diff, setDiff] = useState<TfsTextDiff>()
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [message, setMessage] = useState("")
|
||||
|
||||
useEffect(() => {
|
||||
loadDiff()
|
||||
}, [request])
|
||||
|
||||
const rows = diff ? toDiffRows(diff.lines) : []
|
||||
|
||||
/**
|
||||
* 根据当前请求类型加载文本 diff。
|
||||
*/
|
||||
async function loadDiff() {
|
||||
setLoading(true)
|
||||
setMessage("")
|
||||
|
||||
const result =
|
||||
request.type === "localLatest"
|
||||
? await diffLocalLatest({
|
||||
serverPath: request.serverPath,
|
||||
localPath: request.localPath,
|
||||
})
|
||||
: await diffRevisions({
|
||||
serverPath: request.serverPath,
|
||||
sourceChangeset: request.sourceChangeset,
|
||||
targetChangeset: request.targetChangeset,
|
||||
})
|
||||
setLoading(false)
|
||||
|
||||
if (!result.success || !result.data.diff) {
|
||||
setDiff(undefined)
|
||||
setMessage(
|
||||
result.errorMessage ||
|
||||
result.message ||
|
||||
"大文件、二进制或不支持类型无法展示文本 diff。"
|
||||
)
|
||||
return
|
||||
}
|
||||
|
||||
setDiff(result.data.diff)
|
||||
}
|
||||
|
||||
/**
|
||||
* 将后端统一 diff lines 转为左右两栏展示行。
|
||||
*/
|
||||
function toDiffRows(lines: string[]): DiffRow[] {
|
||||
return lines.map((line) => {
|
||||
const prefix = line.charAt(0)
|
||||
const content = line.slice(1)
|
||||
if (prefix === "-") {
|
||||
return { source: content, kind: "removed" }
|
||||
}
|
||||
if (prefix === "+") {
|
||||
return { target: content, kind: "added" }
|
||||
}
|
||||
return { source: content, target: content, kind: "same" }
|
||||
})
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="border-b bg-background">
|
||||
<div className="flex min-h-9 items-center justify-between gap-3 px-3 py-1.5 text-xs">
|
||||
<div className="min-w-0">
|
||||
<div className="flex items-center gap-1.5 font-medium">
|
||||
<GitCompareArrows className="size-3.5" />
|
||||
Diff
|
||||
</div>
|
||||
<div className="truncate font-mono text-muted-foreground">
|
||||
{request.label}
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex shrink-0 items-center gap-1">
|
||||
<Button
|
||||
size="icon-xs"
|
||||
variant="ghost"
|
||||
disabled={loading}
|
||||
title="刷新 Diff"
|
||||
onClick={loadDiff}
|
||||
>
|
||||
{loading ? <Loader2 className="animate-spin" /> : <RefreshCw />}
|
||||
</Button>
|
||||
<Button size="icon-xs" variant="ghost" title="关闭" onClick={onClose}>
|
||||
<X />
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{message && (
|
||||
<div className="border-t border-destructive/30 bg-destructive/10 px-3 py-2 text-xs text-destructive">
|
||||
{message}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{diff && (
|
||||
<div className="border-t">
|
||||
<div className="grid h-8 grid-cols-2 border-b bg-muted/20 px-3 text-xs font-medium text-muted-foreground">
|
||||
<div className="flex min-w-0 items-center truncate font-mono">
|
||||
{diff.sourceLabel}
|
||||
</div>
|
||||
<div className="flex min-w-0 items-center truncate border-l pl-3 font-mono">
|
||||
{diff.targetLabel}
|
||||
</div>
|
||||
</div>
|
||||
<div className="max-h-80 overflow-auto font-mono text-xs">
|
||||
{rows.length === 0 ? (
|
||||
<div className="px-3 py-4 text-muted-foreground">
|
||||
无可展示 diff 内容。
|
||||
</div>
|
||||
) : (
|
||||
rows.map((row, index) => (
|
||||
<div
|
||||
key={`${index}:${row.kind}`}
|
||||
className="grid min-h-6 grid-cols-[48px_minmax(0,1fr)_48px_minmax(0,1fr)] border-b"
|
||||
>
|
||||
<div className="bg-muted/20 px-2 py-1 text-right text-muted-foreground">
|
||||
{index + 1}
|
||||
</div>
|
||||
<div
|
||||
className={`whitespace-pre-wrap px-2 py-1 ${
|
||||
row.kind === "removed"
|
||||
? "bg-red-50 text-red-700"
|
||||
: ""
|
||||
}`}
|
||||
>
|
||||
{row.source ?? ""}
|
||||
</div>
|
||||
<div className="border-l bg-muted/20 px-2 py-1 text-right text-muted-foreground">
|
||||
{index + 1}
|
||||
</div>
|
||||
<div
|
||||
className={`whitespace-pre-wrap px-2 py-1 ${
|
||||
row.kind === "added"
|
||||
? "bg-green-50 text-green-700"
|
||||
: ""
|
||||
}`}
|
||||
>
|
||||
{row.target ?? ""}
|
||||
</div>
|
||||
</div>
|
||||
))
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -1,233 +0,0 @@
|
||||
import { useEffect, useMemo, useState } from "react"
|
||||
import { Loader2 } from "lucide-react"
|
||||
|
||||
import { Badge } from "~/components/ui/badge"
|
||||
import {
|
||||
Dialog,
|
||||
DialogContent,
|
||||
DialogDescription,
|
||||
DialogHeader,
|
||||
DialogTitle,
|
||||
} from "~/components/ui/dialog"
|
||||
import { Input } from "~/components/ui/input"
|
||||
import { api } from "~/lib/api"
|
||||
import type { FileContent } from "~/lib/api"
|
||||
import { cn } from "~/lib/utils"
|
||||
|
||||
// 查看来源：本地映射文件或服务器 latest。
|
||||
type ViewSource = "local" | "server"
|
||||
|
||||
/**
|
||||
* 把字节数格式化为可读大小。
|
||||
*/
|
||||
function formatSize(size: number): string {
|
||||
if (size < 1024) {
|
||||
return `${size} B`
|
||||
}
|
||||
if (size < 1024 * 1024) {
|
||||
return `${(size / 1024).toFixed(1)} KB`
|
||||
}
|
||||
return `${(size / 1024 / 1024).toFixed(1)} MB`
|
||||
}
|
||||
|
||||
/**
|
||||
* 文件查看弹窗：只读展示本地、服务器 latest 或指定 changeset 版本内容，
|
||||
* 支持来源切换、行号与搜索高亮；二进制 / 超大 / 非映射路径给出明确提示。
|
||||
*/
|
||||
export function FileViewDialog({
|
||||
serverPath,
|
||||
localPath,
|
||||
changeset,
|
||||
onClose,
|
||||
}: {
|
||||
serverPath: string
|
||||
localPath: string | null
|
||||
/** 指定 changeset 时固定展示该版本内容，不提供来源切换。 */
|
||||
changeset?: number
|
||||
onClose: () => void
|
||||
}) {
|
||||
const [source, setSource] = useState<ViewSource>(localPath && changeset == null ? "local" : "server")
|
||||
const [content, setContent] = useState<FileContent | null>(null)
|
||||
const [loading, setLoading] = useState(true)
|
||||
const [error, setError] = useState<string | null>(null)
|
||||
const [search, setSearch] = useState("")
|
||||
|
||||
// 加载所选来源的文件内容；本地内容仅在已映射时可用；指定版本固定按 changeset 读取。
|
||||
useEffect(() => {
|
||||
let active = true
|
||||
setLoading(true)
|
||||
setError(null)
|
||||
void (async () => {
|
||||
const result =
|
||||
changeset != null
|
||||
? await api.getFileContent({ serverPath, changeset })
|
||||
: source === "local" && localPath
|
||||
? await api.getFileContent({ localPath })
|
||||
: await api.getFileContent({ serverPath })
|
||||
if (!active) {
|
||||
return
|
||||
}
|
||||
setLoading(false)
|
||||
if (!result.ok || !result.data) {
|
||||
setContent(null)
|
||||
setError(result.errorMessage ?? "文件内容加载失败")
|
||||
return
|
||||
}
|
||||
setContent(result.data.content)
|
||||
})()
|
||||
return () => {
|
||||
active = false
|
||||
}
|
||||
}, [source, serverPath, localPath, changeset])
|
||||
|
||||
const lines = useMemo(
|
||||
() => (content && !content.binary && !content.tooLarge ? content.content.split(/\r?\n/) : []),
|
||||
[content],
|
||||
)
|
||||
const keyword = search.trim().toLowerCase()
|
||||
const matchCount = useMemo(
|
||||
() =>
|
||||
keyword.length === 0
|
||||
? 0
|
||||
: lines.filter((line) => line.toLowerCase().includes(keyword)).length,
|
||||
[lines, keyword],
|
||||
)
|
||||
|
||||
return (
|
||||
<Dialog open onOpenChange={(open) => !open && onClose()}>
|
||||
<DialogContent className="flex h-[90svh] max-h-[90svh] flex-col sm:max-w-[92vw]">
|
||||
<DialogHeader>
|
||||
<DialogTitle>查看文件</DialogTitle>
|
||||
<DialogDescription className="font-mono text-xs">{serverPath}</DialogDescription>
|
||||
</DialogHeader>
|
||||
|
||||
<div className="flex shrink-0 flex-wrap items-center gap-2">
|
||||
{changeset != null ? (
|
||||
<Badge variant="secondary" className="rounded-md">
|
||||
版本 C{changeset}
|
||||
</Badge>
|
||||
) : (
|
||||
<div className="flex items-center rounded-md border p-0.5">
|
||||
<SourceTab
|
||||
label="本地文件"
|
||||
active={source === "local"}
|
||||
disabled={!localPath}
|
||||
disabledReason="未映射到本地"
|
||||
onClick={() => setSource("local")}
|
||||
/>
|
||||
<SourceTab
|
||||
label="服务器 latest"
|
||||
active={source === "server"}
|
||||
onClick={() => setSource("server")}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
{content && (
|
||||
<span className="text-xs text-muted-foreground">
|
||||
{formatSize(content.size)}
|
||||
{content.changeset > 0 && ` · 版本 ${content.changeset}`}
|
||||
</span>
|
||||
)}
|
||||
<Input
|
||||
value={search}
|
||||
onChange={(event) => setSearch(event.target.value)}
|
||||
placeholder="搜索内容…"
|
||||
className="ml-auto h-7 w-48 text-xs"
|
||||
/>
|
||||
{keyword.length > 0 && (
|
||||
<Badge variant="secondary" className="rounded-md">
|
||||
{matchCount} 行命中
|
||||
</Badge>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="min-h-0 flex-1 overflow-auto rounded-md border bg-muted/20">
|
||||
{loading ? (
|
||||
<div className="flex h-60 items-center justify-center gap-2 text-sm text-muted-foreground">
|
||||
<Loader2 className="size-4 animate-spin" />
|
||||
正在加载内容…
|
||||
</div>
|
||||
) : error ? (
|
||||
<div className="flex h-60 items-center justify-center p-6 text-center text-sm text-destructive">
|
||||
{error}
|
||||
</div>
|
||||
) : content?.binary ? (
|
||||
<Notice text={`二进制文件不支持预览（${formatSize(content.size)}）`} />
|
||||
) : content?.tooLarge ? (
|
||||
<Notice text={`文件过大（${formatSize(content.size)}），不直接渲染内容`} />
|
||||
) : (
|
||||
<pre className="min-w-full font-mono text-xs leading-5">
|
||||
{lines.map((line, index) => {
|
||||
const hit = keyword.length > 0 && line.toLowerCase().includes(keyword)
|
||||
return (
|
||||
<div
|
||||
key={index}
|
||||
className={cn("flex", hit && "bg-amber-500/15")}
|
||||
>
|
||||
<span className="w-12 shrink-0 border-r pr-2 text-right text-muted-foreground/60 select-none">
|
||||
{index + 1}
|
||||
</span>
|
||||
<span className="whitespace-pre-wrap break-all pl-2">{line}</span>
|
||||
</div>
|
||||
)
|
||||
})}
|
||||
</pre>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<p className="shrink-0 text-xs text-muted-foreground">
|
||||
只读查看 · 来源：
|
||||
{changeset != null
|
||||
? `changeset ${changeset} 版本`
|
||||
: source === "local"
|
||||
? `本地 ${localPath ?? ""}`
|
||||
: "服务器 latest"}
|
||||
</p>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
)
|
||||
}
|
||||
|
||||
/**
|
||||
* 来源切换小标签按钮。
|
||||
*/
|
||||
function SourceTab({
|
||||
label,
|
||||
active,
|
||||
disabled,
|
||||
disabledReason,
|
||||
onClick,
|
||||
}: {
|
||||
label: string
|
||||
active: boolean
|
||||
disabled?: boolean
|
||||
disabledReason?: string
|
||||
onClick: () => void
|
||||
}) {
|
||||
return (
|
||||
<button
|
||||
type="button"
|
||||
disabled={disabled}
|
||||
title={disabled ? disabledReason : undefined}
|
||||
onClick={onClick}
|
||||
className={cn(
|
||||
"rounded-[5px] px-2 py-0.5 text-xs",
|
||||
active ? "bg-primary/10 font-medium text-foreground" : "text-muted-foreground",
|
||||
disabled && "cursor-not-allowed opacity-50",
|
||||
)}
|
||||
>
|
||||
{label}
|
||||
</button>
|
||||
)
|
||||
}
|
||||
|
||||
/**
|
||||
* 内容区占位提示（二进制 / 超大文件）。
|
||||
*/
|
||||
function Notice({ text }: { text: string }) {
|
||||
return (
|
||||
<div className="flex h-60 items-center justify-center p-6 text-center text-sm text-muted-foreground">
|
||||
{text}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
@@ -1,437 +0,0 @@
|
||||
import { useCallback, useEffect, useState } from "react"
|
||||
import { ArrowLeft, CloudDownload, Loader2 } from "lucide-react"
|
||||
|
||||
import { ConfirmDialog } from "~/components/app/confirm-dialog"
|
||||
import { FileViewDialog } from "~/components/explorer/file-view-dialog"
|
||||
import { Button } from "~/components/ui/button"
|
||||
import { Checkbox } from "~/components/ui/checkbox"
|
||||
import {
|
||||
ContextMenu,
|
||||
ContextMenuContent,
|
||||
ContextMenuItem,
|
||||
ContextMenuSeparator,
|
||||
ContextMenuTrigger,
|
||||
} from "~/components/ui/context-menu"
|
||||
import {
|
||||
Dialog,
|
||||
DialogContent,
|
||||
DialogDescription,
|
||||
DialogHeader,
|
||||
DialogTitle,
|
||||
} from "~/components/ui/dialog"
|
||||
import {
|
||||
Table,
|
||||
TableBody,
|
||||
TableCell,
|
||||
TableHead,
|
||||
TableHeader,
|
||||
TableRow,
|
||||
} from "~/components/ui/table"
|
||||
import { api } from "~/lib/api"
|
||||
import type { HistoryEntry } from "~/lib/api"
|
||||
import { formatDateTime } from "~/lib/utils"
|
||||
|
||||
// 历史弹窗当前查看的目标（支持从 changeset 文件下钻到单文件历史后返回）。
|
||||
interface HistoryTarget {
|
||||
serverPath: string
|
||||
folder: boolean
|
||||
}
|
||||
|
||||
// 「获取此版本」待确认信息。
|
||||
interface VersionConfirm {
|
||||
serverPath: string
|
||||
changeset: number
|
||||
folder: boolean
|
||||
}
|
||||
|
||||
/**
|
||||
* History 弹窗：展示文件或目录历史（最近记录）。
|
||||
* 目录历史可下钻 changeset 影响文件；changeset 文件支持右键查看此版本 /
|
||||
* 查看该文件历史（可返回）/ 获取此版本；文件历史可勾选两个版本进入版本对比；
|
||||
* 每条记录支持「获取此版本…」（确认后用该版本覆盖本地）。
|
||||
*/
|
||||
export function HistoryDialog({
|
||||
serverPath,
|
||||
folder,
|
||||
onClose,
|
||||
onDiffRevisions,
|
||||
onGetVersion,
|
||||
}: {
|
||||
serverPath: string
|
||||
folder: boolean
|
||||
onClose: () => void
|
||||
onDiffRevisions?: (serverPath: string, source: number, target: number) => void
|
||||
onGetVersion?: (serverPath: string, changeset: number, folder: boolean) => Promise<boolean>
|
||||
}) {
|
||||
const [target, setTarget] = useState<HistoryTarget>({ serverPath, folder })
|
||||
// 下钻历史目标栈：从 changeset 文件进入单文件历史后可逐级返回。
|
||||
const [targetStack, setTargetStack] = useState<HistoryTarget[]>([])
|
||||
const [entries, setEntries] = useState<HistoryEntry[]>([])
|
||||
const [loading, setLoading] = useState(true)
|
||||
const [error, setError] = useState<string | null>(null)
|
||||
// 目录历史下钻：当前查看的 changeset 文件列表，null 表示在历史主列表。
|
||||
const [changesetFiles, setChangesetFiles] = useState<{
|
||||
changeset: number
|
||||
files: HistoryEntry[]
|
||||
} | null>(null)
|
||||
const [filesLoading, setFilesLoading] = useState(false)
|
||||
// 文件历史勾选的 changeset（最多两个），用于版本对比。
|
||||
const [selected, setSelected] = useState<number[]>([])
|
||||
const [confirmVersion, setConfirmVersion] = useState<VersionConfirm | null>(null)
|
||||
// 「查看此版本内容」叠加的文件查看弹窗目标。
|
||||
const [viewVersion, setViewVersion] = useState<{ serverPath: string; changeset: number } | null>(null)
|
||||
|
||||
useEffect(() => {
|
||||
let active = true
|
||||
void (async () => {
|
||||
setLoading(true)
|
||||
const result = await api.getHistory({ path: target.serverPath, folder: target.folder })
|
||||
if (!active) {
|
||||
return
|
||||
}
|
||||
setLoading(false)
|
||||
if (!result.ok) {
|
||||
setError(result.errorMessage ?? "历史加载失败")
|
||||
return
|
||||
}
|
||||
setError(null)
|
||||
setEntries(result.data?.history ?? [])
|
||||
})()
|
||||
return () => {
|
||||
active = false
|
||||
}
|
||||
}, [target])
|
||||
|
||||
/**
|
||||
* 目录历史下钻：加载指定 changeset 影响的文件列表。
|
||||
*/
|
||||
const openChangeset = useCallback(async (changeset: number) => {
|
||||
setFilesLoading(true)
|
||||
const result = await api.getChangesetFiles({ changeset })
|
||||
setFilesLoading(false)
|
||||
if (!result.ok) {
|
||||
setError(result.errorMessage ?? "Changeset 文件加载失败")
|
||||
return
|
||||
}
|
||||
setError(null)
|
||||
setChangesetFiles({ changeset, files: result.data?.files ?? [] })
|
||||
}, [])
|
||||
|
||||
/**
|
||||
* 从 changeset 文件切换到该文件的历史（压栈当前目标，可返回）。
|
||||
*/
|
||||
const openFileHistory = useCallback(
|
||||
(fileServerPath: string) => {
|
||||
setTargetStack((prev) => [...prev, target])
|
||||
setTarget({ serverPath: fileServerPath, folder: false })
|
||||
setChangesetFiles(null)
|
||||
setSelected([])
|
||||
},
|
||||
[target],
|
||||
)
|
||||
|
||||
/**
|
||||
* 返回上一级历史目标。
|
||||
*/
|
||||
const backToPreviousTarget = useCallback(() => {
|
||||
setTargetStack((prev) => {
|
||||
const next = [...prev]
|
||||
const previous = next.pop()
|
||||
if (previous) {
|
||||
setTarget(previous)
|
||||
setChangesetFiles(null)
|
||||
setSelected([])
|
||||
}
|
||||
return next
|
||||
})
|
||||
}, [])
|
||||
|
||||
/**
|
||||
* 勾选 / 取消勾选用于对比的 changeset，最多保留两个（先进先出）。
|
||||
*/
|
||||
const toggleSelected = useCallback((changeset: number) => {
|
||||
setSelected((prev) => {
|
||||
if (prev.includes(changeset)) {
|
||||
return prev.filter((item) => item !== changeset)
|
||||
}
|
||||
const next = [...prev, changeset]
|
||||
return next.length > 2 ? next.slice(next.length - 2) : next
|
||||
})
|
||||
}, [])
|
||||
|
||||
const canDiff = onDiffRevisions != null && !target.folder && selected.length === 2
|
||||
|
||||
return (
|
||||
<Dialog open onOpenChange={(open) => !open && onClose()}>
|
||||
<DialogContent className="flex h-[88svh] max-h-[88svh] flex-col sm:max-w-[88vw]">
|
||||
<DialogHeader>
|
||||
<DialogTitle>
|
||||
{changesetFiles ? `Changeset ${changesetFiles.changeset} 的文件` : "历史记录"}
|
||||
</DialogTitle>
|
||||
<DialogDescription className="font-mono text-xs">
|
||||
{target.serverPath}
|
||||
</DialogDescription>
|
||||
</DialogHeader>
|
||||
|
||||
{(changesetFiles || targetStack.length > 0) && (
|
||||
<div className="flex items-center gap-2">
|
||||
{changesetFiles && (
|
||||
<Button variant="ghost" size="sm" onClick={() => setChangesetFiles(null)}>
|
||||
<ArrowLeft data-icon="inline-start" />
|
||||
返回历史列表
|
||||
</Button>
|
||||
)}
|
||||
{!changesetFiles && targetStack.length > 0 && (
|
||||
<Button variant="ghost" size="sm" onClick={backToPreviousTarget}>
|
||||
<ArrowLeft data-icon="inline-start" />
|
||||
返回上级历史
|
||||
</Button>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="min-h-0 flex-1 overflow-auto rounded-md border">
|
||||
{loading || filesLoading ? (
|
||||
<div className="flex h-40 items-center justify-center gap-2 text-sm text-muted-foreground">
|
||||
<Loader2 className="size-4 animate-spin" />
|
||||
正在加载…
|
||||
</div>
|
||||
) : error ? (
|
||||
<div className="flex h-40 items-center justify-center text-sm text-destructive">
|
||||
{error}
|
||||
</div>
|
||||
) : changesetFiles ? (
|
||||
<ChangesetFilesTable
|
||||
files={changesetFiles.files}
|
||||
changeset={changesetFiles.changeset}
|
||||
onViewVersion={(fileServerPath) =>
|
||||
setViewVersion({ serverPath: fileServerPath, changeset: changesetFiles.changeset })
|
||||
}
|
||||
onOpenFileHistory={openFileHistory}
|
||||
onGetVersion={
|
||||
onGetVersion
|
||||
? (fileServerPath) =>
|
||||
setConfirmVersion({
|
||||
serverPath: fileServerPath,
|
||||
changeset: changesetFiles.changeset,
|
||||
folder: false,
|
||||
})
|
||||
: undefined
|
||||
}
|
||||
/>
|
||||
) : entries.length === 0 ? (
|
||||
<div className="flex h-40 items-center justify-center text-sm text-muted-foreground">
|
||||
没有历史记录
|
||||
</div>
|
||||
) : (
|
||||
<Table>
|
||||
<TableHeader className="sticky top-0 z-10 bg-background">
|
||||
<TableRow className="hover:bg-transparent">
|
||||
{!target.folder && <TableHead className="h-8 w-8" />}
|
||||
<TableHead className="h-8 w-24 text-xs text-muted-foreground">Changeset</TableHead>
|
||||
<TableHead className="h-8 w-20 text-xs text-muted-foreground">类型</TableHead>
|
||||
<TableHead className="h-8 w-28 text-xs text-muted-foreground">作者</TableHead>
|
||||
<TableHead className="h-8 w-36 text-xs text-muted-foreground">时间</TableHead>
|
||||
<TableHead className="h-8 text-xs text-muted-foreground">注释</TableHead>
|
||||
{onGetVersion && <TableHead className="h-8 w-12 text-xs text-muted-foreground" />}
|
||||
</TableRow>
|
||||
</TableHeader>
|
||||
<TableBody>
|
||||
{entries.map((entry) => (
|
||||
<TableRow
|
||||
key={`${entry.changeset}-${entry.serverPath}`}
|
||||
className="cursor-default select-none"
|
||||
onDoubleClick={() => {
|
||||
if (target.folder) {
|
||||
void openChangeset(entry.changeset)
|
||||
}
|
||||
}}
|
||||
>
|
||||
{!target.folder && (
|
||||
<TableCell className="py-1.5">
|
||||
<Checkbox
|
||||
checked={selected.includes(entry.changeset)}
|
||||
onCheckedChange={() => toggleSelected(entry.changeset)}
|
||||
aria-label={`选择 changeset ${entry.changeset}`}
|
||||
/>
|
||||
</TableCell>
|
||||
)}
|
||||
<TableCell className="py-1.5 font-mono text-xs">
|
||||
{target.folder ? (
|
||||
<button
|
||||
type="button"
|
||||
className="text-primary underline-offset-2 hover:underline"
|
||||
onClick={() => void openChangeset(entry.changeset)}
|
||||
>
|
||||
{entry.changeset}
|
||||
</button>
|
||||
) : (
|
||||
entry.changeset
|
||||
)}
|
||||
</TableCell>
|
||||
<TableCell className="py-1.5 text-xs">{entry.changeType}</TableCell>
|
||||
<TableCell className="max-w-0 truncate py-1.5 text-xs">{entry.author}</TableCell>
|
||||
<TableCell className="py-1.5 text-xs text-muted-foreground">
|
||||
{formatDateTime(entry.date)}
|
||||
</TableCell>
|
||||
<TableCell className="max-w-0 truncate py-1.5 text-xs" title={entry.comment}>
|
||||
{entry.comment || "—"}
|
||||
</TableCell>
|
||||
{onGetVersion && (
|
||||
<TableCell className="py-1.5">
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon-sm"
|
||||
title={`获取此版本（C${entry.changeset}，覆盖本地）`}
|
||||
onClick={() =>
|
||||
setConfirmVersion({
|
||||
serverPath: target.serverPath,
|
||||
changeset: entry.changeset,
|
||||
folder: target.folder,
|
||||
})
|
||||
}
|
||||
>
|
||||
<CloudDownload />
|
||||
</Button>
|
||||
</TableCell>
|
||||
)}
|
||||
</TableRow>
|
||||
))}
|
||||
</TableBody>
|
||||
</Table>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="flex shrink-0 items-center justify-between">
|
||||
<p className="text-xs text-muted-foreground">
|
||||
{changesetFiles
|
||||
? `${changesetFiles.files.length} 个文件 · 右键文件可查看此版本 / 历史 / 获取`
|
||||
: target.folder
|
||||
? "双击记录或点击 changeset 编号查看影响文件"
|
||||
: "勾选两个版本可进行对比"}
|
||||
</p>
|
||||
{!target.folder && onDiffRevisions && (
|
||||
<Button
|
||||
size="sm"
|
||||
disabled={!canDiff}
|
||||
onClick={() => {
|
||||
const [a, b] = [...selected].sort((x, y) => x - y)
|
||||
onDiffRevisions(target.serverPath, a, b)
|
||||
}}
|
||||
>
|
||||
对比所选版本
|
||||
</Button>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{confirmVersion && onGetVersion && (
|
||||
<ConfirmDialog
|
||||
title={`获取版本 C${confirmVersion.changeset}`}
|
||||
description={
|
||||
<>
|
||||
<p>
|
||||
将把 <span className="font-mono text-xs">{confirmVersion.serverPath}</span>{" "}
|
||||
的本地内容替换为 changeset {confirmVersion.changeset} 的版本。
|
||||
</p>
|
||||
<p className="mt-2 font-medium text-destructive">
|
||||
本地未签入的修改会被覆盖，且无法恢复。确定继续吗？
|
||||
</p>
|
||||
</>
|
||||
}
|
||||
confirmLabel="获取此版本"
|
||||
danger
|
||||
onConfirm={async () => {
|
||||
await onGetVersion(
|
||||
confirmVersion.serverPath,
|
||||
confirmVersion.changeset,
|
||||
confirmVersion.folder,
|
||||
)
|
||||
setConfirmVersion(null)
|
||||
}}
|
||||
onClose={() => setConfirmVersion(null)}
|
||||
/>
|
||||
)}
|
||||
|
||||
{viewVersion && (
|
||||
<FileViewDialog
|
||||
serverPath={viewVersion.serverPath}
|
||||
localPath={null}
|
||||
changeset={viewVersion.changeset}
|
||||
onClose={() => setViewVersion(null)}
|
||||
/>
|
||||
)}
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
)
|
||||
}
|
||||
|
||||
/**
|
||||
* Changeset 影响文件列表（目录历史下钻视图），行级右键菜单提供对象操作。
|
||||
*/
|
||||
function ChangesetFilesTable({
|
||||
files,
|
||||
changeset,
|
||||
onViewVersion,
|
||||
onOpenFileHistory,
|
||||
onGetVersion,
|
||||
}: {
|
||||
files: HistoryEntry[]
|
||||
changeset: number
|
||||
onViewVersion: (serverPath: string) => void
|
||||
onOpenFileHistory: (serverPath: string) => void
|
||||
onGetVersion?: (serverPath: string) => void
|
||||
}) {
|
||||
if (files.length === 0) {
|
||||
return (
|
||||
<div className="flex h-40 items-center justify-center text-sm text-muted-foreground">
|
||||
该 changeset 没有文件记录
|
||||
</div>
|
||||
)
|
||||
}
|
||||
return (
|
||||
<Table>
|
||||
<TableHeader className="sticky top-0 z-10 bg-background">
|
||||
<TableRow className="hover:bg-transparent">
|
||||
<TableHead className="h-8 w-20 text-xs text-muted-foreground">类型</TableHead>
|
||||
<TableHead className="h-8 text-xs text-muted-foreground">服务端路径</TableHead>
|
||||
</TableRow>
|
||||
</TableHeader>
|
||||
<TableBody>
|
||||
{files.map((file) => (
|
||||
<ContextMenu key={file.serverPath}>
|
||||
<ContextMenuTrigger asChild>
|
||||
<TableRow className="cursor-default select-none">
|
||||
<TableCell className="py-1.5 text-xs">{file.changeType}</TableCell>
|
||||
<TableCell
|
||||
className="max-w-0 truncate py-1.5 font-mono text-xs"
|
||||
title={file.serverPath}
|
||||
>
|
||||
{file.serverPath}
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
</ContextMenuTrigger>
|
||||
<ContextMenuContent className="w-56">
|
||||
<ContextMenuItem onSelect={() => onViewVersion(file.serverPath)}>
|
||||
查看此版本内容
|
||||
</ContextMenuItem>
|
||||
<ContextMenuItem onSelect={() => onOpenFileHistory(file.serverPath)}>
|
||||
查看该文件历史
|
||||
</ContextMenuItem>
|
||||
{onGetVersion && (
|
||||
<>
|
||||
<ContextMenuSeparator />
|
||||
<ContextMenuItem
|
||||
variant="destructive"
|
||||
onSelect={() => onGetVersion(file.serverPath)}
|
||||
>
|
||||
获取此版本（C{changeset}）…
|
||||
</ContextMenuItem>
|
||||
</>
|
||||
)}
|
||||
</ContextMenuContent>
|
||||
</ContextMenu>
|
||||
))}
|
||||
</TableBody>
|
||||
</Table>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,322 @@
|
||||
import { useEffect, useState } from "react"
|
||||
import {
|
||||
FileText,
|
||||
Folder,
|
||||
GitCompareArrows,
|
||||
Loader2,
|
||||
RefreshCw,
|
||||
X,
|
||||
} from "lucide-react"
|
||||
|
||||
import { Button } from "~/components/ui/button"
|
||||
import type { DiffPanelRequest } from "~/components/explorer/diff-panel"
|
||||
import { queryChangesetFiles, queryHistory } from "~/lib/api/endpoints"
|
||||
import type { TfsHistoryEntry } from "~/lib/api/types"
|
||||
|
||||
interface HistoryPanelProps {
|
||||
path: string
|
||||
folder: boolean
|
||||
label: string
|
||||
onOpenDiff(request: DiffPanelRequest): void
|
||||
onClose(): void
|
||||
}
|
||||
|
||||
/**
|
||||
* 展示文件或目录历史，并支持目录 changeset 文件列表和历史 diff 入口。
|
||||
*/
|
||||
export function HistoryPanel({
|
||||
path,
|
||||
folder,
|
||||
label,
|
||||
onOpenDiff,
|
||||
onClose,
|
||||
}: HistoryPanelProps) {
|
||||
const [history, setHistory] = useState<TfsHistoryEntry[]>([])
|
||||
const [changesetFiles, setChangesetFiles] = useState<TfsHistoryEntry[]>([])
|
||||
const [selectedChangeset, setSelectedChangeset] = useState<number>()
|
||||
const [selectedRevisionKeys, setSelectedRevisionKeys] = useState<string[]>([])
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [filesLoading, setFilesLoading] = useState(false)
|
||||
const [message, setMessage] = useState("")
|
||||
const [diffMessage, setDiffMessage] = useState("")
|
||||
|
||||
useEffect(() => {
|
||||
loadHistory()
|
||||
}, [path, folder])
|
||||
|
||||
const selectedRevisions = history.filter((entry) =>
|
||||
selectedRevisionKeys.includes(toHistoryKey(entry))
|
||||
)
|
||||
|
||||
/**
|
||||
* 查询当前文件或目录最近 100 条历史记录。
|
||||
*/
|
||||
async function loadHistory() {
|
||||
setLoading(true)
|
||||
setMessage("")
|
||||
setDiffMessage("")
|
||||
setChangesetFiles([])
|
||||
setSelectedChangeset(undefined)
|
||||
setSelectedRevisionKeys([])
|
||||
|
||||
const result = await queryHistory(path, folder)
|
||||
setLoading(false)
|
||||
|
||||
if (!result.success) {
|
||||
setHistory([])
|
||||
setMessage(result.errorMessage || result.message)
|
||||
return
|
||||
}
|
||||
|
||||
setHistory(result.data.history)
|
||||
}
|
||||
|
||||
/**
|
||||
* 查询目录历史中某个 changeset 影响的文件列表。
|
||||
*/
|
||||
async function loadChangesetFiles(changeset: number) {
|
||||
setFilesLoading(true)
|
||||
setMessage("")
|
||||
setDiffMessage("")
|
||||
setSelectedChangeset(changeset)
|
||||
|
||||
const result = await queryChangesetFiles(changeset)
|
||||
setFilesLoading(false)
|
||||
|
||||
if (!result.success) {
|
||||
setChangesetFiles([])
|
||||
setMessage(result.errorMessage || result.message)
|
||||
return
|
||||
}
|
||||
|
||||
setChangesetFiles(result.data.files)
|
||||
}
|
||||
|
||||
/**
|
||||
* 使用 changeset 作为历史版本选择 key。
|
||||
*/
|
||||
function toHistoryKey(entry: TfsHistoryEntry) {
|
||||
return String(entry.changeset)
|
||||
}
|
||||
|
||||
/**
|
||||
* 选择最多两个文件历史版本，供后续 Diff 面板使用。
|
||||
*/
|
||||
function toggleRevision(entry: TfsHistoryEntry, checked: boolean) {
|
||||
const key = toHistoryKey(entry)
|
||||
setSelectedRevisionKeys((currentKeys) => {
|
||||
if (!checked) {
|
||||
return currentKeys.filter((currentKey) => currentKey !== key)
|
||||
}
|
||||
if (currentKeys.includes(key)) {
|
||||
return currentKeys
|
||||
}
|
||||
return [...currentKeys, key].slice(-2)
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 格式化后端毫秒时间戳。
|
||||
*/
|
||||
function formatHistoryDate(date?: number | null) {
|
||||
return date ? new Date(date).toLocaleString() : "-"
|
||||
}
|
||||
|
||||
/**
|
||||
* 打开用户选择的两个历史版本 diff。
|
||||
*/
|
||||
function enterHistoryDiff() {
|
||||
if (selectedRevisions.length !== 2) {
|
||||
return
|
||||
}
|
||||
|
||||
onOpenDiff({
|
||||
type: "revisions",
|
||||
serverPath: path,
|
||||
sourceChangeset: selectedRevisions[0].changeset,
|
||||
targetChangeset: selectedRevisions[1].changeset,
|
||||
label: `${path};C${selectedRevisions[0].changeset} ↔ C${selectedRevisions[1].changeset}`,
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 记录 changeset 文件列表中的单文件 diff 入口。
|
||||
*/
|
||||
function enterChangesetFileDiff(file: TfsHistoryEntry) {
|
||||
setDiffMessage(
|
||||
`已选择 ${file.serverPath} @${file.changeset}。请打开该文件历史并选择两个版本进入 Diff。`
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="border-b bg-background">
|
||||
<div className="flex min-h-9 items-center justify-between gap-3 px-3 py-1.5 text-xs">
|
||||
<div className="min-w-0">
|
||||
<div className="font-medium">History</div>
|
||||
<div className="truncate font-mono text-muted-foreground">
|
||||
{label}
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex shrink-0 items-center gap-1">
|
||||
<Button
|
||||
size="icon-xs"
|
||||
variant="ghost"
|
||||
disabled={loading}
|
||||
title="刷新历史"
|
||||
onClick={loadHistory}
|
||||
>
|
||||
{loading ? <Loader2 className="animate-spin" /> : <RefreshCw />}
|
||||
</Button>
|
||||
<Button size="icon-xs" variant="ghost" title="关闭" onClick={onClose}>
|
||||
<X />
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{message && (
|
||||
<div className="border-t border-destructive/30 bg-destructive/10 px-3 py-2 text-xs text-destructive">
|
||||
{message}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{diffMessage && (
|
||||
<div className="border-t bg-muted/10 px-3 py-2 text-xs text-muted-foreground">
|
||||
{diffMessage}
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="grid max-h-80 border-t md:grid-cols-[minmax(0,1fr)_300px]">
|
||||
<div className="min-h-0 overflow-auto">
|
||||
<div className="min-w-[760px]">
|
||||
<div className="grid h-7 grid-cols-[36px_86px_110px_130px_150px_minmax(180px,1fr)] border-b bg-muted/20 px-3 text-xs font-medium text-muted-foreground">
|
||||
<div className="flex items-center">Diff</div>
|
||||
<div className="flex items-center">Changeset</div>
|
||||
<div className="flex items-center">变更</div>
|
||||
<div className="flex items-center">作者</div>
|
||||
<div className="flex items-center">时间</div>
|
||||
<div className="flex items-center">Comment</div>
|
||||
</div>
|
||||
|
||||
{history.length === 0 && !loading ? (
|
||||
<div className="px-3 py-4 text-xs text-muted-foreground">
|
||||
暂无历史记录。
|
||||
</div>
|
||||
) : (
|
||||
history.map((entry) => (
|
||||
<div
|
||||
key={toHistoryKey(entry)}
|
||||
className={`grid min-h-8 grid-cols-[36px_86px_110px_130px_150px_minmax(180px,1fr)] items-center border-b px-3 text-xs ${
|
||||
selectedChangeset === entry.changeset
|
||||
? "bg-primary/10"
|
||||
: ""
|
||||
}`}
|
||||
>
|
||||
<label className="flex items-center justify-center">
|
||||
<input
|
||||
type="checkbox"
|
||||
disabled={folder}
|
||||
checked={selectedRevisionKeys.includes(
|
||||
toHistoryKey(entry)
|
||||
)}
|
||||
aria-label={`选择 changeset ${entry.changeset}`}
|
||||
onChange={(event) =>
|
||||
toggleRevision(entry, event.target.checked)
|
||||
}
|
||||
/>
|
||||
</label>
|
||||
<div className="font-mono">{entry.changeset}</div>
|
||||
<div className="truncate text-muted-foreground">
|
||||
{entry.changeType || "-"}
|
||||
</div>
|
||||
<div className="truncate">{entry.author || "-"}</div>
|
||||
<div className="truncate text-muted-foreground">
|
||||
{formatHistoryDate(entry.date)}
|
||||
</div>
|
||||
<div className="flex min-w-0 items-center justify-between gap-2">
|
||||
<span className="truncate">{entry.comment || "-"}</span>
|
||||
{folder && (
|
||||
<Button
|
||||
size="xs"
|
||||
variant="ghost"
|
||||
onClick={() => loadChangesetFiles(entry.changeset)}
|
||||
>
|
||||
文件
|
||||
</Button>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
))
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="min-h-0 border-t bg-muted/10 p-2 text-xs md:border-t-0 md:border-l">
|
||||
{folder ? (
|
||||
<div className="grid gap-2">
|
||||
<div className="flex items-center justify-between gap-2">
|
||||
<span className="font-medium">
|
||||
Changeset {selectedChangeset ?? "-"}
|
||||
</span>
|
||||
{filesLoading && <Loader2 className="size-3 animate-spin" />}
|
||||
</div>
|
||||
{changesetFiles.length === 0 ? (
|
||||
<div className="text-muted-foreground">
|
||||
点击目录历史 changeset 查看影响文件。
|
||||
</div>
|
||||
) : (
|
||||
<div className="grid max-h-64 gap-2 overflow-auto">
|
||||
{changesetFiles.map((file) => (
|
||||
<div
|
||||
key={`${file.changeset}:${file.serverPath}`}
|
||||
className="grid gap-1 border-b pb-2 last:border-b-0 last:pb-0"
|
||||
>
|
||||
<div className="flex min-w-0 items-center gap-1.5">
|
||||
{file.itemType.toLowerCase().includes("folder") ? (
|
||||
<Folder className="size-3.5 shrink-0 text-amber-600" />
|
||||
) : (
|
||||
<FileText className="size-3.5 shrink-0 text-muted-foreground" />
|
||||
)}
|
||||
<span className="truncate font-mono">
|
||||
{file.serverPath}
|
||||
</span>
|
||||
</div>
|
||||
<div className="flex items-center justify-between gap-2">
|
||||
<span className="text-muted-foreground">
|
||||
{file.changeType || "-"}
|
||||
</span>
|
||||
<Button
|
||||
size="xs"
|
||||
variant="outline"
|
||||
onClick={() => enterChangesetFileDiff(file)}
|
||||
>
|
||||
<GitCompareArrows />
|
||||
Diff
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
) : (
|
||||
<div className="grid gap-2">
|
||||
<div className="font-medium">历史 Diff</div>
|
||||
<div className="text-muted-foreground">
|
||||
选择两个历史版本后进入 Diff。
|
||||
</div>
|
||||
<Button
|
||||
size="xs"
|
||||
variant="outline"
|
||||
disabled={selectedRevisions.length !== 2}
|
||||
onClick={enterHistoryDiff}
|
||||
>
|
||||
<GitCompareArrows />
|
||||
Diff
|
||||
</Button>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -1,201 +0,0 @@
|
||||
import { useCallback, useEffect, useState } from "react"
|
||||
import { FolderSearch, Loader2 } from "lucide-react"
|
||||
|
||||
import { Button } from "~/components/ui/button"
|
||||
import { Checkbox } from "~/components/ui/checkbox"
|
||||
import {
|
||||
Dialog,
|
||||
DialogContent,
|
||||
DialogDescription,
|
||||
DialogFooter,
|
||||
DialogHeader,
|
||||
DialogTitle,
|
||||
} from "~/components/ui/dialog"
|
||||
import { Input } from "~/components/ui/input"
|
||||
import { Label } from "~/components/ui/label"
|
||||
import { api } from "~/lib/api"
|
||||
import type { CheckMappingTargetResult, MappingInfo } from "~/lib/api"
|
||||
import { isElectron, selectDirectory } from "~/lib/electron"
|
||||
|
||||
/**
|
||||
* Mapping 创建弹窗：展示服务端路径，选择本地父目录后由后端预校验最终目标路径，
|
||||
* 目标已存在时禁止映射；支持创建后立即 Get Latest。
|
||||
*/
|
||||
export function MappingDialog({
|
||||
serverPath,
|
||||
onClose,
|
||||
onCreated,
|
||||
}: {
|
||||
serverPath: string
|
||||
onClose: () => void
|
||||
onCreated: (mappings: MappingInfo[], didGetLatest: boolean) => void
|
||||
}) {
|
||||
const [parentPath, setParentPath] = useState("")
|
||||
const [check, setCheck] = useState<CheckMappingTargetResult | null>(null)
|
||||
const [checking, setChecking] = useState(false)
|
||||
const [getLatest, setGetLatest] = useState(true)
|
||||
const [busy, setBusy] = useState(false)
|
||||
const [error, setError] = useState<string | null>(null)
|
||||
|
||||
/**
|
||||
* 通过系统目录选择器选择本地父目录（非 Electron 环境保留手动输入）。
|
||||
*/
|
||||
const handleBrowse = useCallback(async () => {
|
||||
const selected = await selectDirectory()
|
||||
if (selected) {
|
||||
setParentPath(selected)
|
||||
}
|
||||
}, [])
|
||||
|
||||
// 父目录变化时调用后端预校验最终目标路径，最终路径以后端结果为准。
|
||||
useEffect(() => {
|
||||
const trimmed = parentPath.trim()
|
||||
if (trimmed.length === 0) {
|
||||
setCheck(null)
|
||||
return
|
||||
}
|
||||
let active = true
|
||||
setChecking(true)
|
||||
const timer = setTimeout(() => {
|
||||
void (async () => {
|
||||
const result = await api.checkMappingTarget({
|
||||
serverPath,
|
||||
localParentPath: trimmed,
|
||||
})
|
||||
if (!active) {
|
||||
return
|
||||
}
|
||||
setChecking(false)
|
||||
if (!result.ok || !result.data) {
|
||||
setCheck(null)
|
||||
setError(result.errorMessage ?? "目标路径校验失败")
|
||||
return
|
||||
}
|
||||
setError(null)
|
||||
setCheck(result.data)
|
||||
})()
|
||||
}, 300)
|
||||
return () => {
|
||||
active = false
|
||||
clearTimeout(timer)
|
||||
}
|
||||
}, [parentPath, serverPath])
|
||||
|
||||
const exists = check?.exists === true
|
||||
const canConfirm = check != null && check.allowed && !exists && !busy && !checking
|
||||
|
||||
/**
|
||||
* 创建 Mapping（按需立即 Get Latest），成功后回调上层刷新并关闭弹窗。
|
||||
*/
|
||||
const handleConfirm = useCallback(async () => {
|
||||
if (!check) {
|
||||
return
|
||||
}
|
||||
setBusy(true)
|
||||
setError(null)
|
||||
const result = await api.addMapping({
|
||||
serverPath,
|
||||
localPath: check.targetPath,
|
||||
getLatest,
|
||||
})
|
||||
setBusy(false)
|
||||
if (!result.ok) {
|
||||
setError(result.errorMessage ?? "创建 Mapping 失败")
|
||||
return
|
||||
}
|
||||
const mappingsResult = await api.listMappings()
|
||||
onCreated(mappingsResult.data?.mappings ?? [], getLatest)
|
||||
}, [check, serverPath, getLatest, onCreated])
|
||||
|
||||
return (
|
||||
<Dialog open onOpenChange={(open) => !open && onClose()}>
|
||||
<DialogContent className="sm:max-w-lg">
|
||||
<DialogHeader>
|
||||
<DialogTitle>映射到本地</DialogTitle>
|
||||
<DialogDescription>
|
||||
为服务端目录创建本地工作区映射
|
||||
</DialogDescription>
|
||||
</DialogHeader>
|
||||
|
||||
<div className="space-y-4">
|
||||
<div className="space-y-1.5">
|
||||
<Label>服务端路径</Label>
|
||||
<p className="rounded-md border bg-muted/40 px-2.5 py-1.5 font-mono text-xs">
|
||||
{serverPath}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="space-y-1.5">
|
||||
<Label htmlFor="parentPath">本地父目录</Label>
|
||||
<div className="flex gap-2">
|
||||
<Input
|
||||
id="parentPath"
|
||||
placeholder="/Users/me/tfs"
|
||||
value={parentPath}
|
||||
onChange={(event) => setParentPath(event.target.value)}
|
||||
disabled={busy}
|
||||
className="font-mono text-xs"
|
||||
/>
|
||||
{isElectron() && (
|
||||
<Button
|
||||
type="button"
|
||||
variant="outline"
|
||||
size="icon"
|
||||
onClick={() => void handleBrowse()}
|
||||
disabled={busy}
|
||||
aria-label="浏览本地目录"
|
||||
>
|
||||
<FolderSearch />
|
||||
</Button>
|
||||
)}
|
||||
</div>
|
||||
<p className="text-xs text-muted-foreground">
|
||||
选择父目录，最终映射目录由后端按服务端目录名生成
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{checking && (
|
||||
<p className="flex items-center gap-1.5 text-xs text-muted-foreground">
|
||||
<Loader2 className="size-3 animate-spin" />
|
||||
正在校验目标路径…
|
||||
</p>
|
||||
)}
|
||||
|
||||
{check && !checking && (
|
||||
<div className="space-y-1.5">
|
||||
<Label>最终映射路径</Label>
|
||||
<p className="rounded-md border bg-muted/40 px-2.5 py-1.5 font-mono text-xs">
|
||||
{check.targetPath}
|
||||
</p>
|
||||
{exists && (
|
||||
<p className="text-xs font-medium text-destructive">
|
||||
目标目录已存在，禁止映射
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
|
||||
<label className="flex items-center gap-2 text-sm">
|
||||
<Checkbox
|
||||
checked={getLatest}
|
||||
onCheckedChange={(value) => setGetLatest(value === true)}
|
||||
disabled={busy}
|
||||
/>
|
||||
创建后立即获取最新
|
||||
</label>
|
||||
|
||||
{error && <p className="text-sm text-destructive">{error}</p>}
|
||||
</div>
|
||||
|
||||
<DialogFooter>
|
||||
<Button variant="ghost" onClick={onClose} disabled={busy}>
|
||||
取消
|
||||
</Button>
|
||||
<Button onClick={() => void handleConfirm()} disabled={!canConfirm}>
|
||||
{busy ? "正在创建…" : "创建映射"}
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,241 @@
|
||||
import { useEffect, useState } from "react"
|
||||
import {
|
||||
ChevronDown,
|
||||
ChevronRight,
|
||||
Database,
|
||||
FileText,
|
||||
Folder,
|
||||
Loader2,
|
||||
} from "lucide-react"
|
||||
|
||||
import { listCollections, listServerTree } from "~/lib/api/endpoints"
|
||||
import type { TfsCollectionInfo, TfsServerItem } from "~/lib/api/types"
|
||||
|
||||
interface ServerTreePanelProps {
|
||||
connected: boolean
|
||||
preferredCollection: string
|
||||
onCollectionSelect(collection: string): void
|
||||
onPathSelect(path: string): void
|
||||
}
|
||||
|
||||
/**
|
||||
* 渲染 Collection 与服务端目录树，并在展开目录时按需请求子节点。
|
||||
*/
|
||||
export function ServerTreePanel({
|
||||
connected,
|
||||
preferredCollection,
|
||||
onCollectionSelect,
|
||||
onPathSelect,
|
||||
}: ServerTreePanelProps) {
|
||||
const [collections, setCollections] = useState<TfsCollectionInfo[]>([])
|
||||
const [selectedCollection, setSelectedCollection] = useState("")
|
||||
const [selectedPath, setSelectedPath] = useState("")
|
||||
const [expandedPaths, setExpandedPaths] = useState<string[]>([])
|
||||
const [itemsByPath, setItemsByPath] = useState<
|
||||
Record<string, TfsServerItem[]>
|
||||
>({})
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [errorMessage, setErrorMessage] = useState("")
|
||||
|
||||
useEffect(() => {
|
||||
if (!connected) {
|
||||
setCollections([])
|
||||
setSelectedCollection("")
|
||||
setSelectedPath("")
|
||||
setExpandedPaths([])
|
||||
setItemsByPath({})
|
||||
return
|
||||
}
|
||||
|
||||
loadCollections()
|
||||
}, [connected, preferredCollection])
|
||||
|
||||
/**
|
||||
* 加载 Collection 列表，并优先展开当前配置保存的 Collection。
|
||||
*/
|
||||
async function loadCollections() {
|
||||
setLoading(true)
|
||||
setErrorMessage("")
|
||||
|
||||
const result = await listCollections()
|
||||
setLoading(false)
|
||||
|
||||
if (!result.success) {
|
||||
setErrorMessage(result.errorMessage || result.message)
|
||||
return
|
||||
}
|
||||
|
||||
setCollections(result.data.collections)
|
||||
const collection =
|
||||
result.data.collections.find(
|
||||
(item) => item.name === preferredCollection
|
||||
) || result.data.collections[0]
|
||||
if (collection) {
|
||||
selectCollection(collection)
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 切换当前 Collection，并加载该 Collection 的服务端根目录。
|
||||
*/
|
||||
async function selectCollection(collection: TfsCollectionInfo) {
|
||||
setSelectedCollection(collection.name)
|
||||
setSelectedPath("$/")
|
||||
setExpandedPaths(["$/"])
|
||||
setItemsByPath({})
|
||||
onCollectionSelect(collection.name)
|
||||
onPathSelect("$/")
|
||||
await loadServerItems(collection.name, "$/")
|
||||
}
|
||||
|
||||
/**
|
||||
* 加载指定目录的一层子节点，未映射目录也直接按服务端路径浏览。
|
||||
*/
|
||||
async function loadServerItems(collection: string, path: string) {
|
||||
setLoading(true)
|
||||
setErrorMessage("")
|
||||
|
||||
const result = await listServerTree(path, collection)
|
||||
setLoading(false)
|
||||
|
||||
if (!result.success) {
|
||||
setErrorMessage(result.errorMessage || result.message)
|
||||
return
|
||||
}
|
||||
|
||||
setItemsByPath((currentItems) => ({
|
||||
...currentItems,
|
||||
[path]: result.data.items,
|
||||
}))
|
||||
}
|
||||
|
||||
/**
|
||||
* 选中节点并通知中间区域当前服务端路径已变化。
|
||||
*/
|
||||
function selectPath(path: string) {
|
||||
setSelectedPath(path)
|
||||
onPathSelect(path)
|
||||
}
|
||||
|
||||
/**
|
||||
* 展开或收起目录；首次展开时才加载子节点。
|
||||
*/
|
||||
async function toggleFolder(item: TfsServerItem) {
|
||||
selectPath(item.serverPath)
|
||||
if (!item.folder || !selectedCollection) {
|
||||
return
|
||||
}
|
||||
|
||||
if (expandedPaths.includes(item.serverPath)) {
|
||||
setExpandedPaths((currentPaths) =>
|
||||
currentPaths.filter((path) => path !== item.serverPath)
|
||||
)
|
||||
return
|
||||
}
|
||||
|
||||
setExpandedPaths((currentPaths) => [...currentPaths, item.serverPath])
|
||||
if (!itemsByPath[item.serverPath]) {
|
||||
await loadServerItems(selectedCollection, item.serverPath)
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 按层级渲染目录树节点。
|
||||
*/
|
||||
function renderItems(path: string, level = 0) {
|
||||
const items = itemsByPath[path] || []
|
||||
|
||||
return items.map((item) => {
|
||||
const expanded = expandedPaths.includes(item.serverPath)
|
||||
const selected = selectedPath === item.serverPath
|
||||
|
||||
return (
|
||||
<div key={item.serverPath}>
|
||||
<button
|
||||
className={`flex h-7 w-full items-center gap-1.5 rounded-[6px] px-2 text-left text-xs ${
|
||||
selected ? "bg-primary/10 text-primary" : "hover:bg-muted"
|
||||
}`}
|
||||
style={{ paddingLeft: 8 + level * 14 }}
|
||||
onClick={() => toggleFolder(item)}
|
||||
>
|
||||
{item.folder ? (
|
||||
expanded ? (
|
||||
<ChevronDown className="size-3.5 shrink-0" />
|
||||
) : (
|
||||
<ChevronRight className="size-3.5 shrink-0" />
|
||||
)
|
||||
) : (
|
||||
<span className="w-3.5 shrink-0" />
|
||||
)}
|
||||
{item.folder ? (
|
||||
<Folder className="size-3.5 shrink-0 text-amber-600" />
|
||||
) : (
|
||||
<FileText className="size-3.5 shrink-0 text-muted-foreground" />
|
||||
)}
|
||||
<span className="truncate">{item.name}</span>
|
||||
</button>
|
||||
|
||||
{item.folder && expanded && renderItems(item.serverPath, level + 1)}
|
||||
</div>
|
||||
)
|
||||
})
|
||||
}
|
||||
|
||||
if (!connected) {
|
||||
return <div className="px-2 py-1 text-xs text-muted-foreground">未连接</div>
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="grid gap-2">
|
||||
{loading && (
|
||||
<div className="flex items-center gap-2 px-2 text-xs text-muted-foreground">
|
||||
<Loader2 className="size-3.5 animate-spin" />
|
||||
加载中
|
||||
</div>
|
||||
)}
|
||||
|
||||
{errorMessage && (
|
||||
<div className="rounded-[6px] border border-destructive/30 bg-destructive/10 px-2 py-1.5 text-xs text-destructive">
|
||||
{errorMessage}
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="grid gap-1">
|
||||
{collections.map((collection) => (
|
||||
<button
|
||||
key={collection.id || collection.name}
|
||||
className={`flex h-7 items-center gap-1.5 rounded-[6px] px-2 text-left text-xs ${
|
||||
selectedCollection === collection.name
|
||||
? "bg-background text-foreground"
|
||||
: "text-muted-foreground hover:bg-muted"
|
||||
}`}
|
||||
onClick={() => selectCollection(collection)}
|
||||
>
|
||||
<Database className="size-3.5 shrink-0" />
|
||||
<span className="truncate">{collection.name}</span>
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
|
||||
<div className="grid gap-0.5 border-t pt-2">
|
||||
<button
|
||||
className={`flex h-7 items-center gap-1.5 rounded-[6px] px-2 text-left font-mono text-xs ${
|
||||
selectedPath === "$/"
|
||||
? "bg-primary/10 text-primary"
|
||||
: "hover:bg-muted"
|
||||
}`}
|
||||
onClick={() => {
|
||||
selectPath("$/")
|
||||
if (selectedCollection && !itemsByPath["$/"]) {
|
||||
loadServerItems(selectedCollection, "$/")
|
||||
}
|
||||
}}
|
||||
>
|
||||
<Folder className="size-3.5 shrink-0 text-amber-600" />
|
||||
$/
|
||||
</button>
|
||||
{renderItems("$/")}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -1,271 +0,0 @@
|
||||
import { useCallback, useEffect, useRef, useState } from "react"
|
||||
import { ChevronRight, FolderClosed, FolderOpen, Loader2, RefreshCw } from "lucide-react"
|
||||
|
||||
import { FileTargetMenu } from "~/components/app/file-target-menu"
|
||||
import { Button } from "~/components/ui/button"
|
||||
import { ScrollArea } from "~/components/ui/scroll-area"
|
||||
import { api } from "~/lib/api"
|
||||
import type { MappingInfo, ServerItem } from "~/lib/api"
|
||||
import type { FileActionId, FileTarget } from "~/lib/tfs"
|
||||
import {
|
||||
SERVER_ROOT_PATH,
|
||||
getAncestorPaths,
|
||||
makeFileTarget,
|
||||
normalizeServerPath,
|
||||
} from "~/lib/tfs"
|
||||
import { cn } from "~/lib/utils"
|
||||
|
||||
/**
|
||||
* 左侧 Source Tree 面板：固定 Collection 下的服务端目录树，懒加载子目录，
|
||||
* 与中间列表共享当前路径；节点支持与中间列表同规则的右键菜单。
|
||||
*/
|
||||
export function SourceTreePanel({
|
||||
collection,
|
||||
mappings,
|
||||
selectedServerPath,
|
||||
onNavigate,
|
||||
onFileAction,
|
||||
}: {
|
||||
collection: string
|
||||
mappings: MappingInfo[]
|
||||
selectedServerPath: string
|
||||
onNavigate: (serverPath: string) => void
|
||||
onFileAction: (target: FileTarget, action: FileActionId) => void
|
||||
}) {
|
||||
// path -> 子目录列表（仅 folder），undefined 表示尚未加载。
|
||||
const [childrenByPath, setChildrenByPath] = useState<Record<string, ServerItem[]>>({})
|
||||
const [expanded, setExpanded] = useState<Record<string, boolean>>({
|
||||
[SERVER_ROOT_PATH]: true,
|
||||
})
|
||||
const [loadingPaths, setLoadingPaths] = useState<Record<string, boolean>>({})
|
||||
const [error, setError] = useState<string | null>(null)
|
||||
// 手动刷新令牌：递增时清空缓存并重新加载。
|
||||
const [reloadToken, setReloadToken] = useState(0)
|
||||
// 已加载与加载中的路径集合，避免异步流程里读到过期 state。
|
||||
const requestedRef = useRef<Set<string>>(new Set())
|
||||
|
||||
/**
|
||||
* 懒加载指定目录的子目录列表，已加载或加载中的路径直接跳过。
|
||||
*/
|
||||
const ensureChildren = useCallback(
|
||||
async (serverPath: string) => {
|
||||
const target = normalizeServerPath(serverPath)
|
||||
if (requestedRef.current.has(target)) {
|
||||
return
|
||||
}
|
||||
requestedRef.current.add(target)
|
||||
setLoadingPaths((prev) => ({ ...prev, [target]: true }))
|
||||
const result = await api.getServerTree({ path: target, collection })
|
||||
setLoadingPaths((prev) => ({ ...prev, [target]: false }))
|
||||
if (!result.ok) {
|
||||
requestedRef.current.delete(target)
|
||||
setError(result.errorMessage ?? "目录加载失败")
|
||||
return
|
||||
}
|
||||
setError(null)
|
||||
const folders = (result.data?.items ?? []).filter((item) => item.folder)
|
||||
setChildrenByPath((prev) => ({ ...prev, [target]: folders }))
|
||||
},
|
||||
[collection],
|
||||
)
|
||||
|
||||
// 当前路径变化或手动刷新时，逐级加载并展开祖先链与自身。
|
||||
useEffect(() => {
|
||||
let active = true
|
||||
void (async () => {
|
||||
const chain = [...getAncestorPaths(selectedServerPath), normalizeServerPath(selectedServerPath)]
|
||||
for (const path of chain) {
|
||||
if (!active) {
|
||||
return
|
||||
}
|
||||
await ensureChildren(path)
|
||||
setExpanded((prev) => (prev[path] ? prev : { ...prev, [path]: true }))
|
||||
}
|
||||
})()
|
||||
return () => {
|
||||
active = false
|
||||
}
|
||||
}, [selectedServerPath, ensureChildren, reloadToken])
|
||||
|
||||
/**
|
||||
* 手动刷新目录树：清空懒加载缓存并从根重新加载，保持当前选中路径的展开链。
|
||||
*/
|
||||
const handleRefresh = useCallback(() => {
|
||||
requestedRef.current.clear()
|
||||
setChildrenByPath({})
|
||||
setExpanded({ [SERVER_ROOT_PATH]: true })
|
||||
setError(null)
|
||||
setReloadToken((token) => token + 1)
|
||||
}, [])
|
||||
|
||||
/**
|
||||
* 切换节点展开 / 收起，首次展开时触发懒加载。
|
||||
*/
|
||||
const toggleExpand = useCallback(
|
||||
(serverPath: string) => {
|
||||
setExpanded((prev) => {
|
||||
const next = !prev[serverPath]
|
||||
if (next) {
|
||||
void ensureChildren(serverPath)
|
||||
}
|
||||
return { ...prev, [serverPath]: next }
|
||||
})
|
||||
},
|
||||
[ensureChildren],
|
||||
)
|
||||
|
||||
/**
|
||||
* 点击节点名称：选中并导航到该目录，同时确保其展开。
|
||||
*/
|
||||
const handleSelect = useCallback(
|
||||
(serverPath: string) => {
|
||||
onNavigate(serverPath)
|
||||
setExpanded((prev) => (prev[serverPath] ? prev : { ...prev, [serverPath]: true }))
|
||||
void ensureChildren(serverPath)
|
||||
},
|
||||
[onNavigate, ensureChildren],
|
||||
)
|
||||
|
||||
return (
|
||||
<aside className="flex h-full w-[280px] shrink-0 flex-col border-r bg-sidebar">
|
||||
<div className="flex h-9 shrink-0 items-center gap-2 border-b px-3">
|
||||
<span className="text-xs font-medium text-muted-foreground">源码目录</span>
|
||||
<span className="ml-auto max-w-28 truncate text-xs text-muted-foreground">{collection}</span>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon-xs"
|
||||
className="shrink-0"
|
||||
onClick={handleRefresh}
|
||||
aria-label="刷新目录树"
|
||||
title="刷新目录树"
|
||||
>
|
||||
<RefreshCw />
|
||||
</Button>
|
||||
</div>
|
||||
<ScrollArea className="min-h-0 flex-1">
|
||||
<div className="p-2">
|
||||
{error && (
|
||||
<p className="px-2 py-1 text-xs text-destructive">{error}</p>
|
||||
)}
|
||||
<TreeNode
|
||||
path={SERVER_ROOT_PATH}
|
||||
name={SERVER_ROOT_PATH}
|
||||
depth={0}
|
||||
mappings={mappings}
|
||||
childrenByPath={childrenByPath}
|
||||
expanded={expanded}
|
||||
loadingPaths={loadingPaths}
|
||||
selectedServerPath={normalizeServerPath(selectedServerPath)}
|
||||
onToggle={toggleExpand}
|
||||
onSelect={handleSelect}
|
||||
onFileAction={onFileAction}
|
||||
/>
|
||||
</div>
|
||||
</ScrollArea>
|
||||
</aside>
|
||||
)
|
||||
}
|
||||
|
||||
/**
|
||||
* 递归渲染目录树节点：缩进 + 展开箭头 + 文件夹图标 + 名称，整行支持右键菜单。
|
||||
*/
|
||||
function TreeNode({
|
||||
path,
|
||||
name,
|
||||
depth,
|
||||
mappings,
|
||||
childrenByPath,
|
||||
expanded,
|
||||
loadingPaths,
|
||||
selectedServerPath,
|
||||
onToggle,
|
||||
onSelect,
|
||||
onFileAction,
|
||||
}: {
|
||||
path: string
|
||||
name: string
|
||||
depth: number
|
||||
mappings: MappingInfo[]
|
||||
childrenByPath: Record<string, ServerItem[]>
|
||||
expanded: Record<string, boolean>
|
||||
loadingPaths: Record<string, boolean>
|
||||
selectedServerPath: string
|
||||
onToggle: (serverPath: string) => void
|
||||
onSelect: (serverPath: string) => void
|
||||
onFileAction: (target: FileTarget, action: FileActionId) => void
|
||||
}) {
|
||||
const children = childrenByPath[path]
|
||||
const isExpanded = expanded[path] === true
|
||||
const isLoading = loadingPaths[path] === true
|
||||
const isSelected = selectedServerPath === path
|
||||
// 未加载前默认认为可能有子目录；加载后子目录为空则视为叶子。
|
||||
const isLeaf = children != null && children.length === 0
|
||||
const target = makeFileTarget({ source: "tree", folder: true, serverPath: path, mappings })
|
||||
|
||||
return (
|
||||
<div>
|
||||
<FileTargetMenu target={target} onAction={onFileAction}>
|
||||
<div
|
||||
className={cn(
|
||||
"group flex h-7 items-center rounded-md pr-1",
|
||||
isSelected ? "bg-primary/10" : "hover:bg-muted",
|
||||
)}
|
||||
style={{ paddingLeft: `${depth * 14 + 2}px` }}
|
||||
>
|
||||
<span className="flex size-5 shrink-0 items-center justify-center">
|
||||
{isLoading ? (
|
||||
<Loader2 className="size-3.5 animate-spin text-muted-foreground" />
|
||||
) : isLeaf ? null : (
|
||||
<button
|
||||
type="button"
|
||||
aria-label={isExpanded ? "收起目录" : "展开目录"}
|
||||
onClick={() => onToggle(path)}
|
||||
className="flex size-5 items-center justify-center rounded text-muted-foreground hover:text-foreground"
|
||||
>
|
||||
<ChevronRight
|
||||
className={cn("size-3.5 transition-transform", isExpanded && "rotate-90")}
|
||||
/>
|
||||
</button>
|
||||
)}
|
||||
</span>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => onSelect(path)}
|
||||
className="flex min-w-0 flex-1 items-center gap-1.5 text-left"
|
||||
>
|
||||
{isExpanded && !isLeaf ? (
|
||||
<FolderOpen className="size-3.5 shrink-0 text-muted-foreground" />
|
||||
) : (
|
||||
<FolderClosed className="size-3.5 shrink-0 text-muted-foreground" />
|
||||
)}
|
||||
<span
|
||||
className={cn(
|
||||
"truncate text-sm",
|
||||
isSelected && "font-medium text-foreground",
|
||||
)}
|
||||
>
|
||||
{name}
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
</FileTargetMenu>
|
||||
{isExpanded &&
|
||||
children?.map((child) => (
|
||||
<TreeNode
|
||||
key={child.serverPath}
|
||||
path={child.serverPath}
|
||||
name={child.name}
|
||||
depth={depth + 1}
|
||||
mappings={mappings}
|
||||
childrenByPath={childrenByPath}
|
||||
expanded={expanded}
|
||||
loadingPaths={loadingPaths}
|
||||
selectedServerPath={selectedServerPath}
|
||||
onToggle={onToggle}
|
||||
onSelect={onSelect}
|
||||
onFileAction={onFileAction}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -1,252 +0,0 @@
|
||||
import { useCallback, useMemo, useState } from "react"
|
||||
import { FileText, FolderClosed, ListChecks, Loader2, RefreshCw } from "lucide-react"
|
||||
|
||||
import { FileTargetMenu } from "~/components/app/file-target-menu"
|
||||
import { Badge } from "~/components/ui/badge"
|
||||
import { Button } from "~/components/ui/button"
|
||||
import { Checkbox } from "~/components/ui/checkbox"
|
||||
import { ScrollArea } from "~/components/ui/scroll-area"
|
||||
import { Textarea } from "~/components/ui/textarea"
|
||||
import type { MappingInfo, PendingChange } from "~/lib/api"
|
||||
import type { FileActionId, FileTarget } from "~/lib/tfs"
|
||||
import { makeFileTarget, statusBadgeClass, statusLabel } from "~/lib/tfs"
|
||||
import { cn } from "~/lib/utils"
|
||||
|
||||
/**
|
||||
* 右侧 Changes 面板：Pending Changes 的 Included / Excluded 分组维护、
|
||||
* 项级右键菜单，以及作为签入唯一入口的 comment + Checkin 区域。
|
||||
*/
|
||||
export function ChangesPanel({
|
||||
mappings,
|
||||
pendingChanges,
|
||||
excludedKeys,
|
||||
loading,
|
||||
error,
|
||||
checkinBusy,
|
||||
onToggleExcluded,
|
||||
onCheckin,
|
||||
onFileAction,
|
||||
onRefresh,
|
||||
}: {
|
||||
mappings: MappingInfo[]
|
||||
pendingChanges: PendingChange[]
|
||||
excludedKeys: Set<string>
|
||||
loading: boolean
|
||||
error: string | null
|
||||
checkinBusy: boolean
|
||||
onToggleExcluded: (serverPath: string) => void
|
||||
onCheckin: (paths: string[], comment: string) => Promise<boolean>
|
||||
onFileAction: (target: FileTarget, action: FileActionId) => void
|
||||
onRefresh: () => void
|
||||
}) {
|
||||
const [comment, setComment] = useState("")
|
||||
|
||||
const included = useMemo(
|
||||
() => pendingChanges.filter((change) => !excludedKeys.has(change.serverPath)),
|
||||
[pendingChanges, excludedKeys],
|
||||
)
|
||||
const excluded = useMemo(
|
||||
() => pendingChanges.filter((change) => excludedKeys.has(change.serverPath)),
|
||||
[pendingChanges, excludedKeys],
|
||||
)
|
||||
|
||||
const canCheckin = included.length > 0 && comment.trim().length > 0 && !checkinBusy
|
||||
|
||||
/**
|
||||
* 提交签入：只提交 Included 项，成功后清空注释。
|
||||
*/
|
||||
const handleCheckin = useCallback(async () => {
|
||||
const success = await onCheckin(
|
||||
included.map((change) => change.serverPath),
|
||||
comment.trim(),
|
||||
)
|
||||
if (success) {
|
||||
setComment("")
|
||||
}
|
||||
}, [onCheckin, included, comment])
|
||||
|
||||
return (
|
||||
<aside className="flex h-full w-[340px] shrink-0 flex-col border-l bg-sidebar">
|
||||
<div className="flex h-9 shrink-0 items-center gap-2 border-b px-3">
|
||||
<span className="text-xs font-medium text-muted-foreground">挂起更改</span>
|
||||
{pendingChanges.length > 0 && (
|
||||
<span className="ml-auto text-xs text-muted-foreground">{pendingChanges.length} 项</span>
|
||||
)}
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon-xs"
|
||||
className={pendingChanges.length > 0 ? "" : "ml-auto"}
|
||||
onClick={onRefresh}
|
||||
disabled={loading}
|
||||
aria-label="刷新挂起更改"
|
||||
title="刷新挂起更改"
|
||||
>
|
||||
<RefreshCw className={cn(loading && "animate-spin")} />
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
{loading ? (
|
||||
<div className="flex flex-1 items-center justify-center gap-2 text-xs text-muted-foreground">
|
||||
<Loader2 className="size-3.5 animate-spin" />
|
||||
正在加载挂起更改…
|
||||
</div>
|
||||
) : error ? (
|
||||
<div className="flex flex-1 items-center justify-center p-4 text-xs text-destructive">
|
||||
{error}
|
||||
</div>
|
||||
) : pendingChanges.length === 0 ? (
|
||||
<div className="flex flex-1 items-center justify-center p-4">
|
||||
<div className="flex flex-col items-center gap-2 text-center">
|
||||
<ListChecks className="size-6 text-muted-foreground/60" />
|
||||
<p className="text-xs leading-5 text-muted-foreground">当前没有挂起更改</p>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<ScrollArea className="min-h-0 flex-1">
|
||||
<div className="p-2">
|
||||
<GroupHeader label="Included" count={included.length} />
|
||||
{included.length === 0 && (
|
||||
<p className="px-2 py-1.5 text-xs text-muted-foreground">
|
||||
没有要签入的更改，勾选下方 Excluded 项可移回
|
||||
</p>
|
||||
)}
|
||||
{included.map((change) => (
|
||||
<PendingRow
|
||||
key={change.serverPath}
|
||||
change={change}
|
||||
included
|
||||
mappings={mappings}
|
||||
onToggleExcluded={onToggleExcluded}
|
||||
onFileAction={onFileAction}
|
||||
/>
|
||||
))}
|
||||
|
||||
{excluded.length > 0 && (
|
||||
<>
|
||||
<GroupHeader label="Excluded" count={excluded.length} className="mt-3" />
|
||||
{excluded.map((change) => (
|
||||
<PendingRow
|
||||
key={change.serverPath}
|
||||
change={change}
|
||||
included={false}
|
||||
mappings={mappings}
|
||||
onToggleExcluded={onToggleExcluded}
|
||||
onFileAction={onFileAction}
|
||||
/>
|
||||
))}
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</ScrollArea>
|
||||
)}
|
||||
|
||||
<div className="shrink-0 space-y-2 border-t p-3">
|
||||
<Textarea
|
||||
value={comment}
|
||||
onChange={(event) => setComment(event.target.value)}
|
||||
placeholder="签入注释（必填）"
|
||||
rows={3}
|
||||
disabled={checkinBusy || pendingChanges.length === 0}
|
||||
className="resize-none text-sm"
|
||||
/>
|
||||
<div className="flex items-center justify-between gap-2">
|
||||
<span className="text-xs text-muted-foreground">
|
||||
将签入 {included.length} 项
|
||||
</span>
|
||||
<Button size="sm" disabled={!canCheckin} onClick={() => void handleCheckin()}>
|
||||
{checkinBusy ? (
|
||||
<>
|
||||
<Loader2 data-icon="inline-start" className="animate-spin" />
|
||||
正在签入…
|
||||
</>
|
||||
) : (
|
||||
"签入"
|
||||
)}
|
||||
</Button>
|
||||
</div>
|
||||
{comment.trim().length === 0 && pendingChanges.length > 0 && (
|
||||
<p className="text-xs text-muted-foreground">填写注释后才能签入</p>
|
||||
)}
|
||||
</div>
|
||||
</aside>
|
||||
)
|
||||
}
|
||||
|
||||
/**
|
||||
* 分组标题行。
|
||||
*/
|
||||
function GroupHeader({
|
||||
label,
|
||||
count,
|
||||
className,
|
||||
}: {
|
||||
label: string
|
||||
count: number
|
||||
className?: string
|
||||
}) {
|
||||
return (
|
||||
<div className={cn("flex items-center gap-1.5 px-2 py-1", className)}>
|
||||
<span className="text-xs font-medium text-muted-foreground">{label}</span>
|
||||
<span className="text-xs text-muted-foreground/70">{count}</span>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
/**
|
||||
* 单条挂起更改：勾选维护 Included / Excluded，整行支持统一右键菜单。
|
||||
*/
|
||||
function PendingRow({
|
||||
change,
|
||||
included,
|
||||
mappings,
|
||||
onToggleExcluded,
|
||||
onFileAction,
|
||||
}: {
|
||||
change: PendingChange
|
||||
included: boolean
|
||||
mappings: MappingInfo[]
|
||||
onToggleExcluded: (serverPath: string) => void
|
||||
onFileAction: (target: FileTarget, action: FileActionId) => void
|
||||
}) {
|
||||
const target = makeFileTarget({
|
||||
source: "pending",
|
||||
folder: change.folder,
|
||||
serverPath: change.serverPath,
|
||||
mappings,
|
||||
pendingStatus: change.status,
|
||||
})
|
||||
return (
|
||||
<FileTargetMenu target={target} onAction={onFileAction}>
|
||||
<div
|
||||
className={cn(
|
||||
"flex h-9 cursor-default items-center gap-2 rounded-md px-2 select-none hover:bg-muted",
|
||||
!included && "opacity-60",
|
||||
)}
|
||||
title={change.serverPath}
|
||||
>
|
||||
<Checkbox
|
||||
checked={included}
|
||||
onCheckedChange={() => onToggleExcluded(change.serverPath)}
|
||||
aria-label={included ? "移到 Excluded" : "移回 Included"}
|
||||
/>
|
||||
{change.folder ? (
|
||||
<FolderClosed className="size-3.5 shrink-0 text-muted-foreground" />
|
||||
) : (
|
||||
<FileText className="size-3.5 shrink-0 text-muted-foreground" />
|
||||
)}
|
||||
<span className="min-w-0 flex-1">
|
||||
<span className="block truncate text-sm">{change.name}</span>
|
||||
<span className="block truncate font-mono text-[10px] leading-3 text-muted-foreground">
|
||||
{change.serverPath}
|
||||
</span>
|
||||
</span>
|
||||
<Badge
|
||||
variant="secondary"
|
||||
className={cn("shrink-0 rounded-md", statusBadgeClass(change.status))}
|
||||
>
|
||||
{statusLabel(change.status)}
|
||||
</Badge>
|
||||
</div>
|
||||
</FileTargetMenu>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,441 @@
|
||||
import { useEffect, useState } from "react"
|
||||
import {
|
||||
ArrowDown,
|
||||
ArrowUp,
|
||||
FileText,
|
||||
Folder,
|
||||
Loader2,
|
||||
RefreshCw,
|
||||
RotateCcw,
|
||||
Upload,
|
||||
} from "lucide-react"
|
||||
|
||||
import { Button } from "~/components/ui/button"
|
||||
import { checkin, listPendingChanges, undoFiles } from "~/lib/api/endpoints"
|
||||
import type {
|
||||
PendingChangeStatus,
|
||||
TfsPendingChangeInfo,
|
||||
} from "~/lib/api/types"
|
||||
|
||||
interface PendingChangesPanelProps {
|
||||
connected: boolean
|
||||
collection: string
|
||||
refreshKey: number
|
||||
}
|
||||
|
||||
const PENDING_STATUS_LABELS: Record<PendingChangeStatus, string> = {
|
||||
pendingEdit: "编辑",
|
||||
pendingAdd: "新增",
|
||||
pendingDelete: "删除",
|
||||
pendingRename: "重命名",
|
||||
pending: "挂起",
|
||||
}
|
||||
|
||||
const PENDING_STATUS_CLASSES: Record<PendingChangeStatus, string> = {
|
||||
pendingEdit: "border-blue-200 bg-blue-50 text-blue-700",
|
||||
pendingAdd: "border-green-200 bg-green-50 text-green-700",
|
||||
pendingDelete: "border-red-200 bg-red-50 text-red-700",
|
||||
pendingRename: "border-violet-200 bg-violet-50 text-violet-700",
|
||||
pending: "border-border bg-muted/30 text-muted-foreground",
|
||||
}
|
||||
|
||||
/**
|
||||
* 在 Inspector 中展示当前 Workspace 的 Included / Excluded Pending Changes。
|
||||
*/
|
||||
export function PendingChangesPanel({
|
||||
connected,
|
||||
collection,
|
||||
refreshKey,
|
||||
}: PendingChangesPanelProps) {
|
||||
const [pendingChanges, setPendingChanges] = useState<
|
||||
TfsPendingChangeInfo[]
|
||||
>([])
|
||||
const [includedKeys, setIncludedKeys] = useState<string[]>([])
|
||||
const [excludedKeys, setExcludedKeys] = useState<string[]>([])
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [operationKey, setOperationKey] = useState("")
|
||||
const [checkinComment, setCheckinComment] = useState("")
|
||||
const [checkinLoading, setCheckinLoading] = useState(false)
|
||||
const [messageType, setMessageType] = useState<"success" | "error">(
|
||||
"success"
|
||||
)
|
||||
const [message, setMessage] = useState("")
|
||||
|
||||
useEffect(() => {
|
||||
if (!connected || !collection) {
|
||||
setPendingChanges([])
|
||||
setIncludedKeys([])
|
||||
setExcludedKeys([])
|
||||
setCheckinComment("")
|
||||
setCheckinLoading(false)
|
||||
setMessageType("success")
|
||||
setMessage("")
|
||||
return
|
||||
}
|
||||
|
||||
loadPendingChanges()
|
||||
}, [connected, collection, refreshKey])
|
||||
|
||||
const includedChanges = pendingChanges.filter((change) =>
|
||||
includedKeys.includes(toPendingChangeKey(change))
|
||||
)
|
||||
const excludedChanges = pendingChanges.filter((change) =>
|
||||
excludedKeys.includes(toPendingChangeKey(change))
|
||||
)
|
||||
const collectionReady = connected && Boolean(collection)
|
||||
const canCheckin =
|
||||
includedChanges.length > 0 &&
|
||||
checkinComment.trim().length > 0 &&
|
||||
!checkinLoading
|
||||
|
||||
/**
|
||||
* 查询后端 pending changes，并保留当前会话内用户移动到 Excluded 的选择。
|
||||
*/
|
||||
async function loadPendingChanges() {
|
||||
setLoading(true)
|
||||
setMessage("")
|
||||
|
||||
const result = await listPendingChanges({ collection })
|
||||
setLoading(false)
|
||||
|
||||
if (!result.success) {
|
||||
setPendingChanges([])
|
||||
setIncludedKeys([])
|
||||
setExcludedKeys([])
|
||||
setMessageType("error")
|
||||
setMessage(result.errorMessage || result.message)
|
||||
return
|
||||
}
|
||||
|
||||
const nextChanges = result.data.pendingChanges
|
||||
const nextKeys = nextChanges.map(toPendingChangeKey)
|
||||
setPendingChanges(nextChanges)
|
||||
setExcludedKeys((currentKeys) =>
|
||||
currentKeys.filter((currentKey) => nextKeys.includes(currentKey))
|
||||
)
|
||||
setIncludedKeys((currentKeys) => {
|
||||
const knownKeys = new Set([...currentKeys, ...excludedKeys])
|
||||
const excludedKeySet = new Set(excludedKeys)
|
||||
const includedKeySet = new Set(currentKeys)
|
||||
|
||||
return nextKeys.filter((key) => {
|
||||
if (excludedKeySet.has(key)) {
|
||||
return false
|
||||
}
|
||||
return knownKeys.has(key) ? includedKeySet.has(key) : true
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 使用服务端路径作为 Pending Change 的会话 key。
|
||||
*/
|
||||
function toPendingChangeKey(change: TfsPendingChangeInfo) {
|
||||
return change.serverPath
|
||||
}
|
||||
|
||||
/**
|
||||
* 将单个挂起更改移动到 Excluded Changes。
|
||||
*/
|
||||
function moveToExcluded(change: TfsPendingChangeInfo) {
|
||||
const key = toPendingChangeKey(change)
|
||||
setIncludedKeys((currentKeys) =>
|
||||
currentKeys.filter((currentKey) => currentKey !== key)
|
||||
)
|
||||
setExcludedKeys((currentKeys) =>
|
||||
currentKeys.includes(key) ? currentKeys : [...currentKeys, key]
|
||||
)
|
||||
}
|
||||
|
||||
/**
|
||||
* 将单个挂起更改移回 Included Changes，后续签入只读取 Included。
|
||||
*/
|
||||
function moveToIncluded(change: TfsPendingChangeInfo) {
|
||||
const key = toPendingChangeKey(change)
|
||||
setExcludedKeys((currentKeys) =>
|
||||
currentKeys.filter((currentKey) => currentKey !== key)
|
||||
)
|
||||
setIncludedKeys((currentKeys) =>
|
||||
currentKeys.includes(key) ? currentKeys : [...currentKeys, key]
|
||||
)
|
||||
}
|
||||
|
||||
/**
|
||||
* 撤销指定 pending change，完成后刷新右侧挂起更改列表。
|
||||
*/
|
||||
async function undoPendingChange(change: TfsPendingChangeInfo) {
|
||||
const key = toPendingChangeKey(change)
|
||||
setOperationKey(key)
|
||||
setMessage("")
|
||||
|
||||
const result = await undoFiles({
|
||||
paths: [change.serverPath],
|
||||
recursive: change.folder,
|
||||
})
|
||||
setOperationKey("")
|
||||
|
||||
if (!result.success) {
|
||||
setMessage(result.errorMessage || result.message)
|
||||
setMessageType("error")
|
||||
return
|
||||
}
|
||||
|
||||
setMessageType("success")
|
||||
setMessage(`Undo 完成，影响 ${result.data.result?.affected ?? 0} 项。`)
|
||||
await loadPendingChanges()
|
||||
}
|
||||
|
||||
/**
|
||||
* 提交 Included Changes，成功后清空 Included 并保留 Excluded 会话状态。
|
||||
*/
|
||||
async function submitIncludedChanges() {
|
||||
const comment = checkinComment.trim()
|
||||
if (!comment) {
|
||||
setMessageType("error")
|
||||
setMessage("Comment 必填。")
|
||||
return
|
||||
}
|
||||
if (includedChanges.length === 0) {
|
||||
setMessageType("error")
|
||||
setMessage("没有可签入的 Included Changes。")
|
||||
return
|
||||
}
|
||||
|
||||
setCheckinLoading(true)
|
||||
setMessage("")
|
||||
|
||||
const result = await checkin({
|
||||
serverPaths: includedChanges.map((change) => change.serverPath),
|
||||
comment,
|
||||
})
|
||||
setCheckinLoading(false)
|
||||
|
||||
if (!result.success) {
|
||||
setMessageType("error")
|
||||
setMessage(result.errorMessage || result.message)
|
||||
return
|
||||
}
|
||||
|
||||
setCheckinComment("")
|
||||
await loadPendingChanges()
|
||||
setIncludedKeys([])
|
||||
setMessageType("success")
|
||||
setMessage(
|
||||
`Checkin 成功，changeset ${result.data.checkin?.changeset ?? "-"}，提交 ${result.data.checkin?.submittedChanges ?? 0} 项。`
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<section className="grid gap-3">
|
||||
<div className="flex items-center justify-between gap-2">
|
||||
<div className="min-w-0">
|
||||
<div className="font-medium">Pending Changes</div>
|
||||
<div className="text-xs text-muted-foreground">
|
||||
签入范围：Included Changes
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex shrink-0 items-center gap-1.5">
|
||||
<span className="rounded-[6px] border px-1.5 py-0.5 text-xs text-muted-foreground">
|
||||
{pendingChanges.length} 项
|
||||
</span>
|
||||
<Button
|
||||
size="icon-xs"
|
||||
variant="ghost"
|
||||
disabled={!collectionReady || loading || checkinLoading}
|
||||
title="刷新挂起更改"
|
||||
onClick={loadPendingChanges}
|
||||
>
|
||||
{loading ? (
|
||||
<Loader2 className="animate-spin" />
|
||||
) : (
|
||||
<RefreshCw />
|
||||
)}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{!collectionReady ? (
|
||||
<div className="rounded-[6px] border bg-muted/20 px-3 py-2 text-sm text-muted-foreground">
|
||||
{connected ? "请选择 Collection" : "未连接"}
|
||||
</div>
|
||||
) : (
|
||||
<>
|
||||
{message && (
|
||||
<div
|
||||
className={`rounded-[6px] border px-3 py-2 text-xs ${
|
||||
messageType === "error"
|
||||
? "border-destructive/30 bg-destructive/10 text-destructive"
|
||||
: "bg-muted/20 text-muted-foreground"
|
||||
}`}
|
||||
>
|
||||
{message}
|
||||
</div>
|
||||
)}
|
||||
|
||||
<PendingChangeGroup
|
||||
title="Included Changes"
|
||||
changes={includedChanges}
|
||||
emptyText={loading ? "正在查询挂起更改" : "暂无 Included Changes"}
|
||||
actionTitle="移到 Excluded"
|
||||
actionIcon="down"
|
||||
operationKey={operationKey}
|
||||
disabled={checkinLoading}
|
||||
onUndo={undoPendingChange}
|
||||
onMove={moveToExcluded}
|
||||
/>
|
||||
|
||||
<PendingChangeGroup
|
||||
title="Excluded Changes"
|
||||
changes={excludedChanges}
|
||||
emptyText="暂无 Excluded Changes"
|
||||
actionTitle="移回 Included"
|
||||
actionIcon="up"
|
||||
operationKey={operationKey}
|
||||
disabled={checkinLoading}
|
||||
onUndo={undoPendingChange}
|
||||
onMove={moveToIncluded}
|
||||
/>
|
||||
|
||||
<section className="grid gap-2">
|
||||
<div className="flex items-center justify-between gap-2 text-xs">
|
||||
<span className="font-medium text-muted-foreground">Checkin</span>
|
||||
<span className="rounded-[6px] border px-1.5 py-0.5 text-muted-foreground">
|
||||
Included {includedChanges.length}
|
||||
</span>
|
||||
</div>
|
||||
<textarea
|
||||
className="min-h-20 rounded-[6px] border bg-background px-2 py-1.5 text-xs outline-none focus-visible:ring-2 focus-visible:ring-ring/40"
|
||||
value={checkinComment}
|
||||
placeholder="Comment"
|
||||
disabled={checkinLoading}
|
||||
onChange={(event) => setCheckinComment(event.target.value)}
|
||||
/>
|
||||
<Button
|
||||
size="sm"
|
||||
disabled={!canCheckin}
|
||||
onClick={submitIncludedChanges}
|
||||
>
|
||||
{checkinLoading ? (
|
||||
<Loader2 className="animate-spin" />
|
||||
) : (
|
||||
<Upload />
|
||||
)}
|
||||
Checkin
|
||||
</Button>
|
||||
<div className="text-xs text-muted-foreground">
|
||||
只提交 Included Changes，Excluded 保留在当前 UI 会话。
|
||||
</div>
|
||||
</section>
|
||||
</>
|
||||
)}
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
||||
interface PendingChangeGroupProps {
|
||||
title: string
|
||||
changes: TfsPendingChangeInfo[]
|
||||
emptyText: string
|
||||
actionTitle: string
|
||||
actionIcon: "up" | "down"
|
||||
operationKey: string
|
||||
disabled: boolean
|
||||
onUndo(change: TfsPendingChangeInfo): void
|
||||
onMove(change: TfsPendingChangeInfo): void
|
||||
}
|
||||
|
||||
/**
|
||||
* 渲染 Pending Changes 单个分组，并提供组间移动入口。
|
||||
*/
|
||||
function PendingChangeGroup({
|
||||
title,
|
||||
changes,
|
||||
emptyText,
|
||||
actionTitle,
|
||||
actionIcon,
|
||||
operationKey,
|
||||
disabled,
|
||||
onUndo,
|
||||
onMove,
|
||||
}: PendingChangeGroupProps) {
|
||||
return (
|
||||
<section className="grid gap-2">
|
||||
<div className="flex items-center justify-between gap-2 text-xs">
|
||||
<span className="font-medium text-muted-foreground">{title}</span>
|
||||
<span className="rounded-[6px] border px-1.5 py-0.5 text-muted-foreground">
|
||||
{changes.length}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
{changes.length === 0 ? (
|
||||
<div className="rounded-[6px] border bg-muted/20 px-3 py-2 text-xs text-muted-foreground">
|
||||
{emptyText}
|
||||
</div>
|
||||
) : (
|
||||
<div className="grid max-h-56 gap-2 overflow-auto">
|
||||
{changes.map((change) => (
|
||||
<div
|
||||
key={change.serverPath}
|
||||
className="grid gap-1 rounded-[6px] border bg-muted/20 p-2 text-xs"
|
||||
>
|
||||
<div className="flex min-w-0 items-start justify-between gap-2">
|
||||
<div className="flex min-w-0 items-center gap-1.5">
|
||||
{change.folder ? (
|
||||
<Folder className="size-3.5 shrink-0 text-amber-600" />
|
||||
) : (
|
||||
<FileText className="size-3.5 shrink-0 text-muted-foreground" />
|
||||
)}
|
||||
<span className="truncate font-medium">{change.name}</span>
|
||||
</div>
|
||||
<div className="flex shrink-0 items-center gap-1">
|
||||
<Button
|
||||
size="icon-xs"
|
||||
variant="ghost"
|
||||
title="Undo"
|
||||
disabled={disabled || operationKey === change.serverPath}
|
||||
onClick={() => onUndo(change)}
|
||||
>
|
||||
{operationKey === change.serverPath ? (
|
||||
<Loader2 className="animate-spin" />
|
||||
) : (
|
||||
<RotateCcw />
|
||||
)}
|
||||
</Button>
|
||||
<Button
|
||||
size="icon-xs"
|
||||
variant="ghost"
|
||||
title={actionTitle}
|
||||
disabled={disabled || operationKey === change.serverPath}
|
||||
onClick={() => onMove(change)}
|
||||
>
|
||||
{actionIcon === "down" ? <ArrowDown /> : <ArrowUp />}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="truncate font-mono text-[11px] text-muted-foreground">
|
||||
{change.serverPath}
|
||||
</div>
|
||||
|
||||
<div className="flex min-w-0 flex-wrap items-center gap-1">
|
||||
<span
|
||||
className={`rounded-[6px] border px-1.5 py-0.5 ${PENDING_STATUS_CLASSES[change.status]}`}
|
||||
>
|
||||
{change.status} / {PENDING_STATUS_LABELS[change.status]}
|
||||
</span>
|
||||
{change.changeType && (
|
||||
<span className="rounded-[6px] border bg-background px-1.5 py-0.5 text-muted-foreground">
|
||||
{change.changeType}
|
||||
</span>
|
||||
)}
|
||||
<span className="rounded-[6px] border bg-background px-1.5 py-0.5 font-mono text-muted-foreground">
|
||||
v{change.version}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</section>
|
||||
)
|
||||
}
|
||||
@@ -1,128 +0,0 @@
|
||||
import { useCallback, useEffect, useMemo, useState } from "react"
|
||||
import { CheckCircle2, Loader2, RefreshCw, XCircle } from "lucide-react"
|
||||
|
||||
import { Button } from "~/components/ui/button"
|
||||
import { ScrollArea } from "~/components/ui/scroll-area"
|
||||
import { api } from "~/lib/api"
|
||||
import type { OperationLogEntry } from "~/lib/api"
|
||||
import { cn, formatDateTime } from "~/lib/utils"
|
||||
|
||||
/**
|
||||
* 把毫秒耗时格式化为可读文本。
|
||||
*/
|
||||
function formatDuration(durationMs: number): string {
|
||||
if (durationMs < 1000) {
|
||||
return `${durationMs} ms`
|
||||
}
|
||||
return `${(durationMs / 1000).toFixed(1)} s`
|
||||
}
|
||||
|
||||
/**
|
||||
* 底部 Operation Console：展示最近操作日志（操作、摘要、起止时间、耗时、结果），
|
||||
* 随主要操作完成自动刷新，长操作执行期间显示执行中提示。
|
||||
*/
|
||||
export function ConsolePanel({
|
||||
refreshToken,
|
||||
busy,
|
||||
busyText,
|
||||
}: {
|
||||
refreshToken: number
|
||||
busy: boolean
|
||||
busyText: string | null
|
||||
}) {
|
||||
const [logs, setLogs] = useState<OperationLogEntry[]>([])
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [error, setError] = useState<string | null>(null)
|
||||
|
||||
/**
|
||||
* 拉取最近操作日志。
|
||||
*/
|
||||
const loadLogs = useCallback(async () => {
|
||||
setLoading(true)
|
||||
const result = await api.getLogs()
|
||||
setLoading(false)
|
||||
if (!result.ok) {
|
||||
setError(result.errorMessage ?? "操作日志加载失败")
|
||||
return
|
||||
}
|
||||
setError(null)
|
||||
setLogs(result.data?.logs ?? [])
|
||||
}, [])
|
||||
|
||||
useEffect(() => {
|
||||
void loadLogs()
|
||||
}, [loadLogs, refreshToken])
|
||||
|
||||
// 最新的操作排在最上面。
|
||||
const ordered = useMemo(
|
||||
() => [...logs].sort((a, b) => b.startedAt - a.startedAt),
|
||||
[logs],
|
||||
)
|
||||
|
||||
return (
|
||||
<footer className="flex h-[180px] shrink-0 flex-col border-t bg-background">
|
||||
<div className="flex h-8 shrink-0 items-center gap-2 border-b px-3">
|
||||
<span className="text-xs font-medium text-muted-foreground">操作日志</span>
|
||||
{busy && (
|
||||
<span className="flex items-center gap-1.5 text-xs text-primary">
|
||||
<Loader2 className="size-3 animate-spin" />
|
||||
{busyText ?? "正在执行…"}
|
||||
</span>
|
||||
)}
|
||||
<span className="ml-auto text-xs text-muted-foreground">
|
||||
{ordered.length > 0 && `${ordered.length} 条`}
|
||||
</span>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon-xs"
|
||||
onClick={() => void loadLogs()}
|
||||
disabled={loading}
|
||||
aria-label="刷新日志"
|
||||
>
|
||||
<RefreshCw className={cn(loading && "animate-spin")} />
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
<ScrollArea className="min-h-0 flex-1">
|
||||
{error ? (
|
||||
<p className="px-3 py-2 text-xs text-destructive">{error}</p>
|
||||
) : ordered.length === 0 ? (
|
||||
<p className="px-3 py-2 text-xs text-muted-foreground">
|
||||
{loading ? "正在加载操作日志…" : "暂无操作日志"}
|
||||
</p>
|
||||
) : (
|
||||
<ul className="px-2 py-1">
|
||||
{ordered.map((entry, index) => (
|
||||
<li
|
||||
key={`${entry.startedAt}-${entry.operation}-${index}`}
|
||||
className="flex h-7 items-center gap-2 rounded px-1.5 text-xs hover:bg-muted"
|
||||
title={entry.errorMessage ?? entry.summary}
|
||||
>
|
||||
{entry.success ? (
|
||||
<CheckCircle2 className="size-3.5 shrink-0 text-green-600" />
|
||||
) : (
|
||||
<XCircle className="size-3.5 shrink-0 text-destructive" />
|
||||
)}
|
||||
<span className="w-36 shrink-0 truncate font-mono text-muted-foreground">
|
||||
{entry.operation}
|
||||
</span>
|
||||
<span className="min-w-0 flex-1 truncate">
|
||||
{entry.summary}
|
||||
{!entry.success && entry.errorMessage && (
|
||||
<span className="text-destructive"> {entry.errorMessage}</span>
|
||||
)}
|
||||
</span>
|
||||
<span className="w-32 shrink-0 text-right text-muted-foreground">
|
||||
{formatDateTime(entry.startedAt)}
|
||||
</span>
|
||||
<span className="w-16 shrink-0 text-right font-mono text-muted-foreground">
|
||||
{formatDuration(entry.durationMs)}
|
||||
</span>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
)}
|
||||
</ScrollArea>
|
||||
</footer>
|
||||
)
|
||||
}
|
||||
@@ -1,49 +0,0 @@
|
||||
import * as React from "react"
|
||||
import { cva, type VariantProps } from "class-variance-authority"
|
||||
import { Slot } from "radix-ui"
|
||||
|
||||
import { cn } from "~/lib/utils"
|
||||
|
||||
const badgeVariants = cva(
|
||||
"group/badge inline-flex h-5 w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-4xl border border-transparent px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-all focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&>svg]:pointer-events-none [&>svg]:size-3!",
|
||||
{
|
||||
variants: {
|
||||
variant: {
|
||||
default: "bg-primary text-primary-foreground [a]:hover:bg-primary/80",
|
||||
secondary:
|
||||
"bg-secondary text-secondary-foreground [a]:hover:bg-secondary/80",
|
||||
destructive:
|
||||
"bg-destructive/10 text-destructive focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:focus-visible:ring-destructive/40 [a]:hover:bg-destructive/20",
|
||||
outline:
|
||||
"border-border text-foreground [a]:hover:bg-muted [a]:hover:text-muted-foreground",
|
||||
ghost:
|
||||
"hover:bg-muted hover:text-muted-foreground dark:hover:bg-muted/50",
|
||||
link: "text-primary underline-offset-4 hover:underline",
|
||||
},
|
||||
},
|
||||
defaultVariants: {
|
||||
variant: "default",
|
||||
},
|
||||
}
|
||||
)
|
||||
|
||||
function Badge({
|
||||
className,
|
||||
variant = "default",
|
||||
asChild = false,
|
||||
...props
|
||||
}: React.ComponentProps<"span"> &
|
||||
VariantProps<typeof badgeVariants> & { asChild?: boolean }) {
|
||||
const Comp = asChild ? Slot.Root : "span"
|
||||
|
||||
return (
|
||||
<Comp
|
||||
data-slot="badge"
|
||||
data-variant={variant}
|
||||
className={cn(badgeVariants({ variant }), className)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
export { Badge, badgeVariants }
|
||||
@@ -9,11 +9,11 @@ const buttonVariants = cva(
|
||||
{
|
||||
variants: {
|
||||
variant: {
|
||||
default: "bg-primary text-primary-foreground hover:bg-primary/80",
|
||||
default: "bg-primary text-primary-foreground [a]:hover:bg-primary/80",
|
||||
outline:
|
||||
"border-border bg-background hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50",
|
||||
secondary:
|
||||
"bg-secondary text-secondary-foreground hover:bg-[color-mix(in_oklch,var(--secondary),var(--foreground)_5%)] aria-expanded:bg-secondary aria-expanded:text-secondary-foreground",
|
||||
"bg-secondary text-secondary-foreground hover:bg-secondary/80 aria-expanded:bg-secondary aria-expanded:text-secondary-foreground",
|
||||
ghost:
|
||||
"hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50",
|
||||
destructive:
|
||||
|
||||
@@ -1,31 +0,0 @@
|
||||
import * as React from "react"
|
||||
import { Checkbox as CheckboxPrimitive } from "radix-ui"
|
||||
|
||||
import { cn } from "~/lib/utils"
|
||||
import { CheckIcon } from "lucide-react"
|
||||
|
||||
function Checkbox({
|
||||
className,
|
||||
...props
|
||||
}: React.ComponentProps<typeof CheckboxPrimitive.Root>) {
|
||||
return (
|
||||
<CheckboxPrimitive.Root
|
||||
data-slot="checkbox"
|
||||
className={cn(
|
||||
"peer relative flex size-4 shrink-0 items-center justify-center rounded-[4px] border border-input transition-colors outline-none group-has-disabled/field:opacity-50 after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 aria-invalid:aria-checked:border-primary dark:bg-input/30 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 data-checked:border-primary data-checked:bg-primary data-checked:text-primary-foreground dark:data-checked:bg-primary",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
>
|
||||
<CheckboxPrimitive.Indicator
|
||||
data-slot="checkbox-indicator"
|
||||
className="grid place-content-center text-current transition-none [&>svg]:size-3.5"
|
||||
>
|
||||
<CheckIcon
|
||||
/>
|
||||
</CheckboxPrimitive.Indicator>
|
||||
</CheckboxPrimitive.Root>
|
||||
)
|
||||
}
|
||||
|
||||
export { Checkbox }
|
||||
@@ -1,261 +0,0 @@
|
||||
import * as React from "react"
|
||||
import { ContextMenu as ContextMenuPrimitive } from "radix-ui"
|
||||
|
||||
import { cn } from "~/lib/utils"
|
||||
import { ChevronRightIcon, CheckIcon } from "lucide-react"
|
||||
|
||||
function ContextMenu({
|
||||
...props
|
||||
}: React.ComponentProps<typeof ContextMenuPrimitive.Root>) {
|
||||
return <ContextMenuPrimitive.Root data-slot="context-menu" {...props} />
|
||||
}
|
||||
|
||||
function ContextMenuTrigger({
|
||||
className,
|
||||
...props
|
||||
}: React.ComponentProps<typeof ContextMenuPrimitive.Trigger>) {
|
||||
return (
|
||||
<ContextMenuPrimitive.Trigger
|
||||
data-slot="context-menu-trigger"
|
||||
className={cn("select-none", className)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
function ContextMenuGroup({
|
||||
...props
|
||||
}: React.ComponentProps<typeof ContextMenuPrimitive.Group>) {
|
||||
return (
|
||||
<ContextMenuPrimitive.Group data-slot="context-menu-group" {...props} />
|
||||
)
|
||||
}
|
||||
|
||||
function ContextMenuPortal({
|
||||
...props
|
||||
}: React.ComponentProps<typeof ContextMenuPrimitive.Portal>) {
|
||||
return (
|
||||
<ContextMenuPrimitive.Portal data-slot="context-menu-portal" {...props} />
|
||||
)
|
||||
}
|
||||
|
||||
function ContextMenuSub({
|
||||
...props
|
||||
}: React.ComponentProps<typeof ContextMenuPrimitive.Sub>) {
|
||||
return <ContextMenuPrimitive.Sub data-slot="context-menu-sub" {...props} />
|
||||
}
|
||||
|
||||
function ContextMenuRadioGroup({
|
||||
...props
|
||||
}: React.ComponentProps<typeof ContextMenuPrimitive.RadioGroup>) {
|
||||
return (
|
||||
<ContextMenuPrimitive.RadioGroup
|
||||
data-slot="context-menu-radio-group"
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
function ContextMenuContent({
|
||||
className,
|
||||
...props
|
||||
}: React.ComponentProps<typeof ContextMenuPrimitive.Content> & {
|
||||
side?: "top" | "right" | "bottom" | "left"
|
||||
}) {
|
||||
return (
|
||||
<ContextMenuPrimitive.Portal>
|
||||
<ContextMenuPrimitive.Content
|
||||
data-slot="context-menu-content"
|
||||
className={cn("z-50 max-h-(--radix-context-menu-content-available-height) min-w-36 origin-(--radix-context-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-lg bg-popover p-1 text-popover-foreground shadow-md ring-1 ring-foreground/10 duration-100 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", className )}
|
||||
{...props}
|
||||
/>
|
||||
</ContextMenuPrimitive.Portal>
|
||||
)
|
||||
}
|
||||
|
||||
function ContextMenuItem({
|
||||
className,
|
||||
inset,
|
||||
variant = "default",
|
||||
...props
|
||||
}: React.ComponentProps<typeof ContextMenuPrimitive.Item> & {
|
||||
inset?: boolean
|
||||
variant?: "default" | "destructive"
|
||||
}) {
|
||||
return (
|
||||
<ContextMenuPrimitive.Item
|
||||
data-slot="context-menu-item"
|
||||
data-inset={inset}
|
||||
data-variant={variant}
|
||||
className={cn(
|
||||
"group/context-menu-item relative flex cursor-default items-center gap-1.5 rounded-md px-1.5 py-1 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-inset:pl-7 data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive dark:data-[variant=destructive]:focus:bg-destructive/20 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 focus:*:[svg]:text-accent-foreground data-[variant=destructive]:*:[svg]:text-destructive",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
function ContextMenuSubTrigger({
|
||||
className,
|
||||
inset,
|
||||
children,
|
||||
...props
|
||||
}: React.ComponentProps<typeof ContextMenuPrimitive.SubTrigger> & {
|
||||
inset?: boolean
|
||||
}) {
|
||||
return (
|
||||
<ContextMenuPrimitive.SubTrigger
|
||||
data-slot="context-menu-sub-trigger"
|
||||
data-inset={inset}
|
||||
className={cn(
|
||||
"flex cursor-default items-center gap-1.5 rounded-md px-1.5 py-1 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-inset:pl-7 data-open:bg-accent data-open:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
>
|
||||
{children}
|
||||
<ChevronRightIcon className="ml-auto" />
|
||||
</ContextMenuPrimitive.SubTrigger>
|
||||
)
|
||||
}
|
||||
|
||||
function ContextMenuSubContent({
|
||||
className,
|
||||
...props
|
||||
}: React.ComponentProps<typeof ContextMenuPrimitive.SubContent>) {
|
||||
return (
|
||||
<ContextMenuPrimitive.SubContent
|
||||
data-slot="context-menu-sub-content"
|
||||
className={cn("z-50 min-w-32 origin-(--radix-context-menu-content-transform-origin) overflow-hidden rounded-lg border bg-popover p-1 text-popover-foreground shadow-lg duration-100 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", className )}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
function ContextMenuCheckboxItem({
|
||||
className,
|
||||
children,
|
||||
checked,
|
||||
inset,
|
||||
...props
|
||||
}: React.ComponentProps<typeof ContextMenuPrimitive.CheckboxItem> & {
|
||||
inset?: boolean
|
||||
}) {
|
||||
return (
|
||||
<ContextMenuPrimitive.CheckboxItem
|
||||
data-slot="context-menu-checkbox-item"
|
||||
data-inset={inset}
|
||||
className={cn(
|
||||
"relative flex cursor-default items-center gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-inset:pl-7 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
||||
className
|
||||
)}
|
||||
checked={checked}
|
||||
{...props}
|
||||
>
|
||||
<span className="pointer-events-none absolute right-2">
|
||||
<ContextMenuPrimitive.ItemIndicator>
|
||||
<CheckIcon
|
||||
/>
|
||||
</ContextMenuPrimitive.ItemIndicator>
|
||||
</span>
|
||||
{children}
|
||||
</ContextMenuPrimitive.CheckboxItem>
|
||||
)
|
||||
}
|
||||
|
||||
function ContextMenuRadioItem({
|
||||
className,
|
||||
children,
|
||||
inset,
|
||||
...props
|
||||
}: React.ComponentProps<typeof ContextMenuPrimitive.RadioItem> & {
|
||||
inset?: boolean
|
||||
}) {
|
||||
return (
|
||||
<ContextMenuPrimitive.RadioItem
|
||||
data-slot="context-menu-radio-item"
|
||||
data-inset={inset}
|
||||
className={cn(
|
||||
"relative flex cursor-default items-center gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-inset:pl-7 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
>
|
||||
<span className="pointer-events-none absolute right-2">
|
||||
<ContextMenuPrimitive.ItemIndicator>
|
||||
<CheckIcon
|
||||
/>
|
||||
</ContextMenuPrimitive.ItemIndicator>
|
||||
</span>
|
||||
{children}
|
||||
</ContextMenuPrimitive.RadioItem>
|
||||
)
|
||||
}
|
||||
|
||||
function ContextMenuLabel({
|
||||
className,
|
||||
inset,
|
||||
...props
|
||||
}: React.ComponentProps<typeof ContextMenuPrimitive.Label> & {
|
||||
inset?: boolean
|
||||
}) {
|
||||
return (
|
||||
<ContextMenuPrimitive.Label
|
||||
data-slot="context-menu-label"
|
||||
data-inset={inset}
|
||||
className={cn(
|
||||
"px-1.5 py-1 text-xs font-medium text-muted-foreground data-inset:pl-7",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
function ContextMenuSeparator({
|
||||
className,
|
||||
...props
|
||||
}: React.ComponentProps<typeof ContextMenuPrimitive.Separator>) {
|
||||
return (
|
||||
<ContextMenuPrimitive.Separator
|
||||
data-slot="context-menu-separator"
|
||||
className={cn("-mx-1 my-1 h-px bg-border", className)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
function ContextMenuShortcut({
|
||||
className,
|
||||
...props
|
||||
}: React.ComponentProps<"span">) {
|
||||
return (
|
||||
<span
|
||||
data-slot="context-menu-shortcut"
|
||||
className={cn(
|
||||
"ml-auto text-xs tracking-widest text-muted-foreground group-focus/context-menu-item:text-accent-foreground",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
export {
|
||||
ContextMenu,
|
||||
ContextMenuTrigger,
|
||||
ContextMenuContent,
|
||||
ContextMenuItem,
|
||||
ContextMenuCheckboxItem,
|
||||
ContextMenuRadioItem,
|
||||
ContextMenuLabel,
|
||||
ContextMenuSeparator,
|
||||
ContextMenuShortcut,
|
||||
ContextMenuGroup,
|
||||
ContextMenuPortal,
|
||||
ContextMenuSub,
|
||||
ContextMenuSubContent,
|
||||
ContextMenuSubTrigger,
|
||||
ContextMenuRadioGroup,
|
||||
}
|
||||
@@ -1,166 +0,0 @@
|
||||
import * as React from "react"
|
||||
import { Dialog as DialogPrimitive } from "radix-ui"
|
||||
|
||||
import { cn } from "~/lib/utils"
|
||||
import { Button } from "~/components/ui/button"
|
||||
import { XIcon } from "lucide-react"
|
||||
|
||||
function Dialog({
|
||||
...props
|
||||
}: React.ComponentProps<typeof DialogPrimitive.Root>) {
|
||||
return <DialogPrimitive.Root data-slot="dialog" {...props} />
|
||||
}
|
||||
|
||||
function DialogTrigger({
|
||||
...props
|
||||
}: React.ComponentProps<typeof DialogPrimitive.Trigger>) {
|
||||
return <DialogPrimitive.Trigger data-slot="dialog-trigger" {...props} />
|
||||
}
|
||||
|
||||
function DialogPortal({
|
||||
...props
|
||||
}: React.ComponentProps<typeof DialogPrimitive.Portal>) {
|
||||
return <DialogPrimitive.Portal data-slot="dialog-portal" {...props} />
|
||||
}
|
||||
|
||||
function DialogClose({
|
||||
...props
|
||||
}: React.ComponentProps<typeof DialogPrimitive.Close>) {
|
||||
return <DialogPrimitive.Close data-slot="dialog-close" {...props} />
|
||||
}
|
||||
|
||||
function DialogOverlay({
|
||||
className,
|
||||
...props
|
||||
}: React.ComponentProps<typeof DialogPrimitive.Overlay>) {
|
||||
return (
|
||||
<DialogPrimitive.Overlay
|
||||
data-slot="dialog-overlay"
|
||||
className={cn(
|
||||
"fixed inset-0 isolate z-50 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
function DialogContent({
|
||||
className,
|
||||
children,
|
||||
showCloseButton = true,
|
||||
...props
|
||||
}: React.ComponentProps<typeof DialogPrimitive.Content> & {
|
||||
showCloseButton?: boolean
|
||||
}) {
|
||||
return (
|
||||
<DialogPortal>
|
||||
<DialogOverlay />
|
||||
<DialogPrimitive.Content
|
||||
data-slot="dialog-content"
|
||||
className={cn(
|
||||
"fixed top-1/2 left-1/2 z-50 grid w-full max-w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 gap-4 rounded-xl bg-popover p-4 text-sm text-popover-foreground ring-1 ring-foreground/10 duration-100 outline-none sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
>
|
||||
{children}
|
||||
{showCloseButton && (
|
||||
<DialogPrimitive.Close data-slot="dialog-close" asChild>
|
||||
<Button
|
||||
variant="ghost"
|
||||
className="absolute top-2 right-2"
|
||||
size="icon-sm"
|
||||
>
|
||||
<XIcon
|
||||
/>
|
||||
<span className="sr-only">Close</span>
|
||||
</Button>
|
||||
</DialogPrimitive.Close>
|
||||
)}
|
||||
</DialogPrimitive.Content>
|
||||
</DialogPortal>
|
||||
)
|
||||
}
|
||||
|
||||
function DialogHeader({ className, ...props }: React.ComponentProps<"div">) {
|
||||
return (
|
||||
<div
|
||||
data-slot="dialog-header"
|
||||
className={cn("flex flex-col gap-2", className)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
function DialogFooter({
|
||||
className,
|
||||
showCloseButton = false,
|
||||
children,
|
||||
...props
|
||||
}: React.ComponentProps<"div"> & {
|
||||
showCloseButton?: boolean
|
||||
}) {
|
||||
return (
|
||||
<div
|
||||
data-slot="dialog-footer"
|
||||
className={cn(
|
||||
"-mx-4 -mb-4 flex flex-col-reverse gap-2 rounded-b-xl border-t bg-muted/50 p-4 sm:flex-row sm:justify-end",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
>
|
||||
{children}
|
||||
{showCloseButton && (
|
||||
<DialogPrimitive.Close asChild>
|
||||
<Button variant="outline">Close</Button>
|
||||
</DialogPrimitive.Close>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
function DialogTitle({
|
||||
className,
|
||||
...props
|
||||
}: React.ComponentProps<typeof DialogPrimitive.Title>) {
|
||||
return (
|
||||
<DialogPrimitive.Title
|
||||
data-slot="dialog-title"
|
||||
className={cn(
|
||||
"font-heading text-base leading-none font-medium",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
function DialogDescription({
|
||||
className,
|
||||
...props
|
||||
}: React.ComponentProps<typeof DialogPrimitive.Description>) {
|
||||
return (
|
||||
<DialogPrimitive.Description
|
||||
data-slot="dialog-description"
|
||||
className={cn(
|
||||
"text-sm text-muted-foreground *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
export {
|
||||
Dialog,
|
||||
DialogClose,
|
||||
DialogContent,
|
||||
DialogDescription,
|
||||
DialogFooter,
|
||||
DialogHeader,
|
||||
DialogOverlay,
|
||||
DialogPortal,
|
||||
DialogTitle,
|
||||
DialogTrigger,
|
||||
}
|
||||
@@ -1,22 +0,0 @@
|
||||
import * as React from "react"
|
||||
|
||||
import { cn } from "~/lib/utils"
|
||||
|
||||
/**
|
||||
* 基础文本输入框，统一 macOS 工作台风格的尺寸、边框与聚焦态。
|
||||
*/
|
||||
function Input({ className, type, ...props }: React.ComponentProps<"input">) {
|
||||
return (
|
||||
<input
|
||||
type={type}
|
||||
data-slot="input"
|
||||
className={cn(
|
||||
"flex h-8 w-full min-w-0 rounded-md border border-input bg-background px-2.5 py-1 text-sm shadow-xs transition-[color,box-shadow] outline-none placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20",
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
export { Input }
|
||||
@@ -1,21 +0,0 @@
|
||||
import * as React from "react"
|
||||
|
||||
import { cn } from "~/lib/utils"
|
||||
|
||||
/**
|
||||
* 表单字段标签，保持轻量并禁止选中，贴合工具型界面。
|
||||
*/
|
||||
function Label({ className, ...props }: React.ComponentProps<"label">) {
|
||||
return (
|
||||
<label
|
||||
data-slot="label"
|
||||
className={cn(
|
||||
"flex items-center gap-1 text-sm font-medium text-foreground select-none",
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
export { Label }
|
||||
@@ -1,53 +0,0 @@
|
||||
import * as React from "react"
|
||||
import { ScrollArea as ScrollAreaPrimitive } from "radix-ui"
|
||||
|
||||
import { cn } from "~/lib/utils"
|
||||
|
||||
function ScrollArea({
|
||||
className,
|
||||
children,
|
||||
...props
|
||||
}: React.ComponentProps<typeof ScrollAreaPrimitive.Root>) {
|
||||
return (
|
||||
<ScrollAreaPrimitive.Root
|
||||
data-slot="scroll-area"
|
||||
className={cn("relative", className)}
|
||||
{...props}
|
||||
>
|
||||
<ScrollAreaPrimitive.Viewport
|
||||
data-slot="scroll-area-viewport"
|
||||
className="size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1"
|
||||
>
|
||||
{children}
|
||||
</ScrollAreaPrimitive.Viewport>
|
||||
<ScrollBar />
|
||||
<ScrollAreaPrimitive.Corner />
|
||||
</ScrollAreaPrimitive.Root>
|
||||
)
|
||||
}
|
||||
|
||||
function ScrollBar({
|
||||
className,
|
||||
orientation = "vertical",
|
||||
...props
|
||||
}: React.ComponentProps<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>) {
|
||||
return (
|
||||
<ScrollAreaPrimitive.ScrollAreaScrollbar
|
||||
data-slot="scroll-area-scrollbar"
|
||||
data-orientation={orientation}
|
||||
orientation={orientation}
|
||||
className={cn(
|
||||
"flex touch-none p-px transition-colors select-none data-horizontal:h-2.5 data-horizontal:flex-col data-horizontal:border-t data-horizontal:border-t-transparent data-vertical:h-full data-vertical:w-2.5 data-vertical:border-l data-vertical:border-l-transparent",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
>
|
||||
<ScrollAreaPrimitive.ScrollAreaThumb
|
||||
data-slot="scroll-area-thumb"
|
||||
className="relative flex-1 rounded-full bg-border"
|
||||
/>
|
||||
</ScrollAreaPrimitive.ScrollAreaScrollbar>
|
||||
)
|
||||
}
|
||||
|
||||
export { ScrollArea, ScrollBar }
|
||||
@@ -1,192 +0,0 @@
|
||||
"use client"
|
||||
|
||||
import * as React from "react"
|
||||
import { Select as SelectPrimitive } from "radix-ui"
|
||||
|
||||
import { cn } from "~/lib/utils"
|
||||
import { ChevronDownIcon, CheckIcon, ChevronUpIcon } from "lucide-react"
|
||||
|
||||
function Select({
|
||||
...props
|
||||
}: React.ComponentProps<typeof SelectPrimitive.Root>) {
|
||||
return <SelectPrimitive.Root data-slot="select" {...props} />
|
||||
}
|
||||
|
||||
function SelectGroup({
|
||||
className,
|
||||
...props
|
||||
}: React.ComponentProps<typeof SelectPrimitive.Group>) {
|
||||
return (
|
||||
<SelectPrimitive.Group
|
||||
data-slot="select-group"
|
||||
className={cn("scroll-my-1 p-1", className)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
function SelectValue({
|
||||
...props
|
||||
}: React.ComponentProps<typeof SelectPrimitive.Value>) {
|
||||
return <SelectPrimitive.Value data-slot="select-value" {...props} />
|
||||
}
|
||||
|
||||
function SelectTrigger({
|
||||
className,
|
||||
size = "default",
|
||||
children,
|
||||
...props
|
||||
}: React.ComponentProps<typeof SelectPrimitive.Trigger> & {
|
||||
size?: "sm" | "default"
|
||||
}) {
|
||||
return (
|
||||
<SelectPrimitive.Trigger
|
||||
data-slot="select-trigger"
|
||||
data-size={size}
|
||||
className={cn(
|
||||
"flex w-fit items-center justify-between gap-1.5 rounded-lg border border-input bg-transparent py-2 pr-2 pl-2.5 text-sm whitespace-nowrap transition-colors outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-placeholder:text-muted-foreground data-[size=default]:h-8 data-[size=sm]:h-7 data-[size=sm]:rounded-[min(var(--radius-md),10px)] *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
>
|
||||
{children}
|
||||
<SelectPrimitive.Icon asChild>
|
||||
<ChevronDownIcon className="pointer-events-none size-4 text-muted-foreground" />
|
||||
</SelectPrimitive.Icon>
|
||||
</SelectPrimitive.Trigger>
|
||||
)
|
||||
}
|
||||
|
||||
function SelectContent({
|
||||
className,
|
||||
children,
|
||||
position = "item-aligned",
|
||||
align = "center",
|
||||
...props
|
||||
}: React.ComponentProps<typeof SelectPrimitive.Content>) {
|
||||
return (
|
||||
<SelectPrimitive.Portal>
|
||||
<SelectPrimitive.Content
|
||||
data-slot="select-content"
|
||||
data-align-trigger={position === "item-aligned"}
|
||||
className={cn("relative z-50 max-h-(--radix-select-content-available-height) min-w-36 origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-lg bg-popover text-popover-foreground shadow-md ring-1 ring-foreground/10 duration-100 data-[align-trigger=true]:animate-none data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", position ==="popper"&&"data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1", className )}
|
||||
position={position}
|
||||
align={align}
|
||||
{...props}
|
||||
>
|
||||
<SelectScrollUpButton />
|
||||
<SelectPrimitive.Viewport
|
||||
data-position={position}
|
||||
className={cn(
|
||||
"data-[position=popper]:h-(--radix-select-trigger-height) data-[position=popper]:w-full data-[position=popper]:min-w-(--radix-select-trigger-width)",
|
||||
position === "popper" && ""
|
||||
)}
|
||||
>
|
||||
{children}
|
||||
</SelectPrimitive.Viewport>
|
||||
<SelectScrollDownButton />
|
||||
</SelectPrimitive.Content>
|
||||
</SelectPrimitive.Portal>
|
||||
)
|
||||
}
|
||||
|
||||
function SelectLabel({
|
||||
className,
|
||||
...props
|
||||
}: React.ComponentProps<typeof SelectPrimitive.Label>) {
|
||||
return (
|
||||
<SelectPrimitive.Label
|
||||
data-slot="select-label"
|
||||
className={cn("px-1.5 py-1 text-xs text-muted-foreground", className)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
function SelectItem({
|
||||
className,
|
||||
children,
|
||||
...props
|
||||
}: React.ComponentProps<typeof SelectPrimitive.Item>) {
|
||||
return (
|
||||
<SelectPrimitive.Item
|
||||
data-slot="select-item"
|
||||
className={cn(
|
||||
"relative flex w-full cursor-default items-center gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
>
|
||||
<span className="pointer-events-none absolute right-2 flex size-4 items-center justify-center">
|
||||
<SelectPrimitive.ItemIndicator>
|
||||
<CheckIcon className="pointer-events-none" />
|
||||
</SelectPrimitive.ItemIndicator>
|
||||
</span>
|
||||
<SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>
|
||||
</SelectPrimitive.Item>
|
||||
)
|
||||
}
|
||||
|
||||
function SelectSeparator({
|
||||
className,
|
||||
...props
|
||||
}: React.ComponentProps<typeof SelectPrimitive.Separator>) {
|
||||
return (
|
||||
<SelectPrimitive.Separator
|
||||
data-slot="select-separator"
|
||||
className={cn("pointer-events-none -mx-1 my-1 h-px bg-border", className)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
function SelectScrollUpButton({
|
||||
className,
|
||||
...props
|
||||
}: React.ComponentProps<typeof SelectPrimitive.ScrollUpButton>) {
|
||||
return (
|
||||
<SelectPrimitive.ScrollUpButton
|
||||
data-slot="select-scroll-up-button"
|
||||
className={cn(
|
||||
"z-10 flex cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-4",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
>
|
||||
<ChevronUpIcon
|
||||
/>
|
||||
</SelectPrimitive.ScrollUpButton>
|
||||
)
|
||||
}
|
||||
|
||||
function SelectScrollDownButton({
|
||||
className,
|
||||
...props
|
||||
}: React.ComponentProps<typeof SelectPrimitive.ScrollDownButton>) {
|
||||
return (
|
||||
<SelectPrimitive.ScrollDownButton
|
||||
data-slot="select-scroll-down-button"
|
||||
className={cn(
|
||||
"z-10 flex cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-4",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
>
|
||||
<ChevronDownIcon
|
||||
/>
|
||||
</SelectPrimitive.ScrollDownButton>
|
||||
)
|
||||
}
|
||||
|
||||
export {
|
||||
Select,
|
||||
SelectContent,
|
||||
SelectGroup,
|
||||
SelectItem,
|
||||
SelectLabel,
|
||||
SelectScrollDownButton,
|
||||
SelectScrollUpButton,
|
||||
SelectSeparator,
|
||||
SelectTrigger,
|
||||
SelectValue,
|
||||
}
|
||||
@@ -1,28 +0,0 @@
|
||||
"use client"
|
||||
|
||||
import * as React from "react"
|
||||
import { Separator as SeparatorPrimitive } from "radix-ui"
|
||||
|
||||
import { cn } from "~/lib/utils"
|
||||
|
||||
function Separator({
|
||||
className,
|
||||
orientation = "horizontal",
|
||||
decorative = true,
|
||||
...props
|
||||
}: React.ComponentProps<typeof SeparatorPrimitive.Root>) {
|
||||
return (
|
||||
<SeparatorPrimitive.Root
|
||||
data-slot="separator"
|
||||
decorative={decorative}
|
||||
orientation={orientation}
|
||||
className={cn(
|
||||
"shrink-0 bg-border data-horizontal:h-px data-horizontal:w-full data-vertical:w-px data-vertical:self-stretch",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
export { Separator }
|
||||
@@ -1,114 +0,0 @@
|
||||
import * as React from "react"
|
||||
|
||||
import { cn } from "~/lib/utils"
|
||||
|
||||
function Table({ className, ...props }: React.ComponentProps<"table">) {
|
||||
return (
|
||||
<div
|
||||
data-slot="table-container"
|
||||
className="relative w-full overflow-x-auto"
|
||||
>
|
||||
<table
|
||||
data-slot="table"
|
||||
className={cn("w-full caption-bottom text-sm", className)}
|
||||
{...props}
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
function TableHeader({ className, ...props }: React.ComponentProps<"thead">) {
|
||||
return (
|
||||
<thead
|
||||
data-slot="table-header"
|
||||
className={cn("[&_tr]:border-b", className)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
function TableBody({ className, ...props }: React.ComponentProps<"tbody">) {
|
||||
return (
|
||||
<tbody
|
||||
data-slot="table-body"
|
||||
className={cn("[&_tr:last-child]:border-0", className)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
function TableFooter({ className, ...props }: React.ComponentProps<"tfoot">) {
|
||||
return (
|
||||
<tfoot
|
||||
data-slot="table-footer"
|
||||
className={cn(
|
||||
"border-t bg-muted/50 font-medium [&>tr]:last:border-b-0",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
function TableRow({ className, ...props }: React.ComponentProps<"tr">) {
|
||||
return (
|
||||
<tr
|
||||
data-slot="table-row"
|
||||
className={cn(
|
||||
"border-b transition-colors hover:bg-muted/50 has-aria-expanded:bg-muted/50 data-[state=selected]:bg-muted",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
function TableHead({ className, ...props }: React.ComponentProps<"th">) {
|
||||
return (
|
||||
<th
|
||||
data-slot="table-head"
|
||||
className={cn(
|
||||
"h-10 px-2 text-left align-middle font-medium whitespace-nowrap text-foreground [&:has([role=checkbox])]:pr-0",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
function TableCell({ className, ...props }: React.ComponentProps<"td">) {
|
||||
return (
|
||||
<td
|
||||
data-slot="table-cell"
|
||||
className={cn(
|
||||
"p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
function TableCaption({
|
||||
className,
|
||||
...props
|
||||
}: React.ComponentProps<"caption">) {
|
||||
return (
|
||||
<caption
|
||||
data-slot="table-caption"
|
||||
className={cn("mt-4 text-sm text-muted-foreground", className)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
export {
|
||||
Table,
|
||||
TableHeader,
|
||||
TableBody,
|
||||
TableFooter,
|
||||
TableHead,
|
||||
TableRow,
|
||||
TableCell,
|
||||
TableCaption,
|
||||
}
|
||||
@@ -1,18 +0,0 @@
|
||||
import * as React from "react"
|
||||
|
||||
import { cn } from "~/lib/utils"
|
||||
|
||||
function Textarea({ className, ...props }: React.ComponentProps<"textarea">) {
|
||||
return (
|
||||
<textarea
|
||||
data-slot="textarea"
|
||||
className={cn(
|
||||
"flex field-sizing-content min-h-16 w-full rounded-lg border border-input bg-transparent px-2.5 py-2 text-base transition-colors outline-none placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
export { Textarea }
|
||||
@@ -1,55 +0,0 @@
|
||||
import * as React from "react"
|
||||
import { Tooltip as TooltipPrimitive } from "radix-ui"
|
||||
|
||||
import { cn } from "~/lib/utils"
|
||||
|
||||
function TooltipProvider({
|
||||
delayDuration = 0,
|
||||
...props
|
||||
}: React.ComponentProps<typeof TooltipPrimitive.Provider>) {
|
||||
return (
|
||||
<TooltipPrimitive.Provider
|
||||
data-slot="tooltip-provider"
|
||||
delayDuration={delayDuration}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
function Tooltip({
|
||||
...props
|
||||
}: React.ComponentProps<typeof TooltipPrimitive.Root>) {
|
||||
return <TooltipPrimitive.Root data-slot="tooltip" {...props} />
|
||||
}
|
||||
|
||||
function TooltipTrigger({
|
||||
...props
|
||||
}: React.ComponentProps<typeof TooltipPrimitive.Trigger>) {
|
||||
return <TooltipPrimitive.Trigger data-slot="tooltip-trigger" {...props} />
|
||||
}
|
||||
|
||||
function TooltipContent({
|
||||
className,
|
||||
sideOffset = 0,
|
||||
children,
|
||||
...props
|
||||
}: React.ComponentProps<typeof TooltipPrimitive.Content>) {
|
||||
return (
|
||||
<TooltipPrimitive.Portal>
|
||||
<TooltipPrimitive.Content
|
||||
data-slot="tooltip-content"
|
||||
sideOffset={sideOffset}
|
||||
className={cn(
|
||||
"z-50 inline-flex w-fit max-w-xs origin-(--radix-tooltip-content-transform-origin) items-center gap-1.5 rounded-md bg-foreground px-3 py-1.5 text-xs text-background has-data-[slot=kbd]:pr-1.5 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 **:data-[slot=kbd]:relative **:data-[slot=kbd]:isolate **:data-[slot=kbd]:z-50 **:data-[slot=kbd]:rounded-sm data-[state=delayed-open]:animate-in data-[state=delayed-open]:fade-in-0 data-[state=delayed-open]:zoom-in-95 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
>
|
||||
{children}
|
||||
<TooltipPrimitive.Arrow className="z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px] bg-foreground fill-foreground" />
|
||||
</TooltipPrimitive.Content>
|
||||
</TooltipPrimitive.Portal>
|
||||
)
|
||||
}
|
||||
|
||||
export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger }
|
||||
@@ -1,353 +0,0 @@
|
||||
import { useCallback, useState } from "react"
|
||||
|
||||
import type { DiffRequest } from "~/components/explorer/diff-dialog"
|
||||
import { api } from "~/lib/api"
|
||||
import type { MappingInfo } from "~/lib/api"
|
||||
import type { FileActionId, FileTarget } from "~/lib/tfs"
|
||||
|
||||
// 当前打开的业务弹窗：Mapping / History / 目录对比 / 文件查看 / Diff / 冲突处理 / 覆盖类确认。
|
||||
export type WorkspaceDialogState =
|
||||
| { kind: "mapping"; serverPath: string }
|
||||
| { kind: "history"; serverPath: string; folder: boolean }
|
||||
| { kind: "compare"; serverPath: string }
|
||||
| { kind: "viewFile"; serverPath: string; localPath: string | null; changeset?: number }
|
||||
| { kind: "diff"; request: DiffRequest }
|
||||
| { kind: "conflicts"; serverPath: string }
|
||||
| { kind: "confirmForceGet"; serverPath: string; folder: boolean }
|
||||
| null
|
||||
|
||||
// 顶部细条通知：信息（操作摘要）或错误。
|
||||
export interface ActionNotice {
|
||||
kind: "info" | "error"
|
||||
text: string
|
||||
}
|
||||
|
||||
// 动作编排所需的上层依赖：mappings 更新与各类刷新入口。
|
||||
interface FileActionsDeps {
|
||||
onMappingsChanged: (mappings: MappingInfo[]) => void
|
||||
refreshPendingChanges: () => Promise<void>
|
||||
refreshItems: () => void
|
||||
refreshLogs: () => void
|
||||
}
|
||||
|
||||
/**
|
||||
* 对象动作编排 hook：集中持有弹窗开关、通知与忙碌状态，
|
||||
* 把右键菜单动作映射为 API 执行或弹窗打开，并按统一规则刷新（含操作日志）。
|
||||
*/
|
||||
export function useFileActions({
|
||||
onMappingsChanged,
|
||||
refreshPendingChanges,
|
||||
refreshItems,
|
||||
refreshLogs,
|
||||
}: FileActionsDeps) {
|
||||
const [dialog, setDialog] = useState<WorkspaceDialogState>(null)
|
||||
const [notice, setNotice] = useState<ActionNotice | null>(null)
|
||||
const [actionBusy, setActionBusy] = useState(false)
|
||||
const [checkinBusy, setCheckinBusy] = useState(false)
|
||||
|
||||
/**
|
||||
* 执行 Get Latest（目录递归），返回是否产生冲突；摘要写入顶部通知。
|
||||
* 默认安全模式：本地改动不会被覆盖而是产生冲突并自动进入冲突弹窗；
|
||||
* force=true 为强制覆盖本地（仅经确认弹窗触发）。
|
||||
*/
|
||||
const runGetLatest = useCallback(
|
||||
async (target: FileTarget, force = false): Promise<boolean> => {
|
||||
const result = await api.getLatest({
|
||||
serverPath: target.serverPath,
|
||||
recursive: target.folder,
|
||||
force,
|
||||
})
|
||||
refreshLogs()
|
||||
if (!result.ok || !result.data) {
|
||||
setNotice({ kind: "error", text: result.errorMessage ?? "获取最新失败" })
|
||||
return false
|
||||
}
|
||||
const summary = result.data.result
|
||||
const parts = [`更新 ${summary.updated} 项`]
|
||||
if (summary.conflicts > 0) {
|
||||
parts.push(`冲突 ${summary.conflicts} 项`)
|
||||
}
|
||||
if (summary.failures > 0) {
|
||||
parts.push(`跳过 / 失败 ${summary.failures} 项`)
|
||||
}
|
||||
setNotice({
|
||||
kind: summary.conflicts > 0 ? "error" : "info",
|
||||
text: `${force ? "强制获取" : "获取最新"}完成：${parts.join("，")}`,
|
||||
})
|
||||
refreshItems()
|
||||
if (summary.conflicts > 0) {
|
||||
setDialog({ kind: "conflicts", serverPath: target.serverPath })
|
||||
return true
|
||||
}
|
||||
return false
|
||||
},
|
||||
[refreshItems, refreshLogs],
|
||||
)
|
||||
|
||||
/**
|
||||
* 获取指定 changeset 版本（覆盖本地），由历史弹窗中的确认操作触发。
|
||||
*/
|
||||
const runGetVersion = useCallback(
|
||||
async (serverPath: string, changeset: number, folder: boolean): Promise<boolean> => {
|
||||
setNotice({ kind: "info", text: `正在获取版本 C${changeset}…` })
|
||||
const result = await api.getVersion({ serverPath, changeset, recursive: folder })
|
||||
refreshLogs()
|
||||
if (!result.ok || !result.data) {
|
||||
setNotice({ kind: "error", text: result.errorMessage ?? "获取指定版本失败" })
|
||||
return false
|
||||
}
|
||||
const summary = result.data.result
|
||||
setNotice({
|
||||
kind: "info",
|
||||
text: `已获取版本 C${changeset}：更新 ${summary.updated} 项（本地已被该版本覆盖）`,
|
||||
})
|
||||
refreshItems()
|
||||
await refreshPendingChanges()
|
||||
return true
|
||||
},
|
||||
[refreshItems, refreshLogs, refreshPendingChanges],
|
||||
)
|
||||
|
||||
/**
|
||||
* 执行 Checkout：先 Get Latest，出现冲突时进入统一冲突弹窗；
|
||||
* 无冲突则签出并提示跳过 / 失败项，完成后刷新挂起更改。
|
||||
*/
|
||||
const runCheckout = useCallback(
|
||||
async (target: FileTarget) => {
|
||||
const hadConflicts = await runGetLatest(target)
|
||||
if (hadConflicts) {
|
||||
setNotice({ kind: "error", text: "获取最新存在冲突，请先处理冲突后再签出" })
|
||||
return
|
||||
}
|
||||
const result = await api.checkout({
|
||||
paths: [target.serverPath],
|
||||
recursive: target.folder,
|
||||
})
|
||||
refreshLogs()
|
||||
if (!result.ok || !result.data) {
|
||||
setNotice({ kind: "error", text: result.errorMessage ?? "签出失败" })
|
||||
return
|
||||
}
|
||||
const summary = result.data.result
|
||||
const failureText =
|
||||
summary.failures.length > 0
|
||||
? `，跳过 ${summary.failures.length} 项（${summary.failures.slice(0, 3).join("；")}${summary.failures.length > 3 ? "…" : ""}）`
|
||||
: ""
|
||||
setNotice({
|
||||
kind: summary.failures.length > 0 ? "error" : "info",
|
||||
text: `签出完成：${summary.affected} 项${failureText}`,
|
||||
})
|
||||
await refreshPendingChanges()
|
||||
},
|
||||
[runGetLatest, refreshPendingChanges, refreshLogs],
|
||||
)
|
||||
|
||||
/**
|
||||
* 执行 挂起删除 / 撤销更改 两类文件操作并按规则刷新。
|
||||
*/
|
||||
const runFileOperation = useCallback(
|
||||
async (target: FileTarget, action: "delete" | "undo") => {
|
||||
const labels =
|
||||
action === "delete"
|
||||
? { doing: "正在挂起删除…", fail: "挂起删除失败", done: "已挂起删除" }
|
||||
: { doing: "正在撤销更改…", fail: "撤销更改失败", done: "已撤销" }
|
||||
setNotice({ kind: "info", text: labels.doing })
|
||||
const call = action === "delete" ? api.deleteFiles : api.undoFiles
|
||||
const result = await call({ paths: [target.serverPath], recursive: target.folder })
|
||||
refreshLogs()
|
||||
if (!result.ok || !result.data) {
|
||||
setNotice({ kind: "error", text: result.errorMessage ?? labels.fail })
|
||||
return
|
||||
}
|
||||
setNotice({ kind: "info", text: `${labels.done} ${result.data.result.affected} 项` })
|
||||
await refreshPendingChanges()
|
||||
refreshItems()
|
||||
},
|
||||
[refreshPendingChanges, refreshItems, refreshLogs],
|
||||
)
|
||||
|
||||
/**
|
||||
* 对象右键菜单动作统一分发器。
|
||||
* unmap / getLatest / checkout / delete / undo 直接执行；
|
||||
* map / history / compare / viewFile / diff 打开对应弹窗。
|
||||
*/
|
||||
const handleFileAction = useCallback(
|
||||
async (target: FileTarget, action: FileActionId) => {
|
||||
setNotice(null)
|
||||
switch (action) {
|
||||
case "unmap": {
|
||||
const result = await api.deleteMapping({ serverPath: target.serverPath })
|
||||
refreshLogs()
|
||||
if (!result.ok) {
|
||||
setNotice({ kind: "error", text: result.errorMessage ?? "取消映射失败" })
|
||||
return
|
||||
}
|
||||
// 不跳转当前浏览位置，仅更新 mappings 让动作可用性与状态列刷新。
|
||||
onMappingsChanged(result.data?.mappings ?? [])
|
||||
break
|
||||
}
|
||||
case "getLatest":
|
||||
setActionBusy(true)
|
||||
setNotice({ kind: "info", text: "正在获取最新…" })
|
||||
await runGetLatest(target)
|
||||
setActionBusy(false)
|
||||
break
|
||||
case "forceGetLatest":
|
||||
// 覆盖类危险操作：先弹确认，确认后才执行。
|
||||
setDialog({
|
||||
kind: "confirmForceGet",
|
||||
serverPath: target.serverPath,
|
||||
folder: target.folder,
|
||||
})
|
||||
break
|
||||
case "checkout":
|
||||
setActionBusy(true)
|
||||
setNotice({ kind: "info", text: "正在签出…" })
|
||||
await runCheckout(target)
|
||||
setActionBusy(false)
|
||||
break
|
||||
case "delete":
|
||||
case "undo":
|
||||
setActionBusy(true)
|
||||
await runFileOperation(target, action)
|
||||
setActionBusy(false)
|
||||
break
|
||||
case "add": {
|
||||
// pend add 需要本地路径（localOnly 项服务端尚不存在）。
|
||||
if (!target.localPath) {
|
||||
return
|
||||
}
|
||||
setActionBusy(true)
|
||||
setNotice({ kind: "info", text: "正在加入版本控制…" })
|
||||
const result = await api.addFiles({ paths: [target.localPath], recursive: target.folder })
|
||||
refreshLogs()
|
||||
setActionBusy(false)
|
||||
if (!result.ok || !result.data) {
|
||||
setNotice({ kind: "error", text: result.errorMessage ?? "加入版本控制失败" })
|
||||
return
|
||||
}
|
||||
setNotice({ kind: "info", text: `已加入版本控制 ${result.data.result.affected} 项` })
|
||||
await refreshPendingChanges()
|
||||
refreshItems()
|
||||
break
|
||||
}
|
||||
case "map":
|
||||
setDialog({ kind: "mapping", serverPath: target.serverPath })
|
||||
break
|
||||
case "history":
|
||||
setDialog({ kind: "history", serverPath: target.serverPath, folder: target.folder })
|
||||
break
|
||||
case "compare":
|
||||
setDialog({ kind: "compare", serverPath: target.serverPath })
|
||||
break
|
||||
case "viewFile":
|
||||
setDialog({
|
||||
kind: "viewFile",
|
||||
serverPath: target.serverPath,
|
||||
localPath: target.localPath,
|
||||
})
|
||||
break
|
||||
case "diffLocalLatest":
|
||||
if (target.localPath) {
|
||||
setDialog({
|
||||
kind: "diff",
|
||||
request: {
|
||||
mode: "localLatest",
|
||||
serverPath: target.serverPath,
|
||||
localPath: target.localPath,
|
||||
},
|
||||
})
|
||||
}
|
||||
break
|
||||
default:
|
||||
break
|
||||
}
|
||||
},
|
||||
[onMappingsChanged, runGetLatest, runCheckout, runFileOperation, refreshLogs],
|
||||
)
|
||||
|
||||
/**
|
||||
* 提交签入：只提交 Included 项，成功后展示 changeset 并刷新挂起更改与当前目录。
|
||||
*/
|
||||
const handleCheckin = useCallback(
|
||||
async (paths: string[], comment: string): Promise<boolean> => {
|
||||
setCheckinBusy(true)
|
||||
setNotice({ kind: "info", text: "正在签入…" })
|
||||
const result = await api.checkin({ paths, comment })
|
||||
setCheckinBusy(false)
|
||||
refreshLogs()
|
||||
if (!result.ok || !result.data) {
|
||||
setNotice({ kind: "error", text: result.errorMessage ?? "签入失败" })
|
||||
return false
|
||||
}
|
||||
const summary = result.data.checkin
|
||||
setNotice({
|
||||
kind: "info",
|
||||
text: `签入成功：changeset ${summary.changeset}，提交 ${summary.submittedChanges} 项`,
|
||||
})
|
||||
await refreshPendingChanges()
|
||||
refreshItems()
|
||||
return true
|
||||
},
|
||||
[refreshPendingChanges, refreshItems, refreshLogs],
|
||||
)
|
||||
|
||||
/**
|
||||
* Mapping 创建成功：刷新 mappings 与当前目录列表，保持浏览位置并关闭弹窗。
|
||||
*/
|
||||
const handleMappingCreated = useCallback(
|
||||
(mappings: MappingInfo[]) => {
|
||||
onMappingsChanged(mappings)
|
||||
refreshItems()
|
||||
setDialog(null)
|
||||
},
|
||||
[onMappingsChanged, refreshItems],
|
||||
)
|
||||
|
||||
/**
|
||||
* 冲突取舍完成：关闭弹窗并刷新当前目录与挂起更改。
|
||||
*/
|
||||
const handleConflictsResolved = useCallback(() => {
|
||||
setDialog(null)
|
||||
refreshItems()
|
||||
void refreshPendingChanges()
|
||||
refreshLogs()
|
||||
setNotice({ kind: "info", text: "冲突处理完成，已刷新状态" })
|
||||
}, [refreshItems, refreshPendingChanges, refreshLogs])
|
||||
|
||||
/**
|
||||
* 强制获取确认后执行：覆盖本地并关闭确认弹窗。
|
||||
*/
|
||||
const handleForceGetConfirmed = useCallback(
|
||||
async (serverPath: string, folder: boolean) => {
|
||||
setActionBusy(true)
|
||||
const target: FileTarget = {
|
||||
source: "list",
|
||||
folder,
|
||||
serverPath,
|
||||
localPath: null,
|
||||
mapped: true,
|
||||
mappingRoot: false,
|
||||
pendingStatus: null,
|
||||
}
|
||||
await runGetLatest(target, true)
|
||||
setActionBusy(false)
|
||||
setDialog(null)
|
||||
},
|
||||
[runGetLatest],
|
||||
)
|
||||
|
||||
return {
|
||||
dialog,
|
||||
setDialog,
|
||||
notice,
|
||||
actionBusy,
|
||||
checkinBusy,
|
||||
handleFileAction,
|
||||
handleCheckin,
|
||||
handleMappingCreated,
|
||||
handleConflictsResolved,
|
||||
handleForceGetConfirmed,
|
||||
runGetVersion,
|
||||
}
|
||||
}
|
||||
@@ -1,75 +0,0 @@
|
||||
import { useCallback, useEffect, useMemo, useState } from "react"
|
||||
|
||||
import { api } from "~/lib/api"
|
||||
import type { PendingChange } from "~/lib/api"
|
||||
|
||||
/**
|
||||
* 挂起更改共享状态：列表加载 / 刷新、Included-Excluded 维护，
|
||||
* 以及供菜单可用性判断的 serverPath -> 状态 映射。
|
||||
*/
|
||||
export function usePendingChanges() {
|
||||
const [pendingChanges, setPendingChanges] = useState<PendingChange[]>([])
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [error, setError] = useState<string | null>(null)
|
||||
// Excluded 的挂起更改 serverPath 集合（不持久化），其余默认 Included。
|
||||
const [excludedKeys, setExcludedKeys] = useState<Set<string>>(new Set())
|
||||
|
||||
/**
|
||||
* 刷新当前 Workspace 的挂起更改列表，并清理悬挂的 Excluded 键。
|
||||
*/
|
||||
const refresh = useCallback(async () => {
|
||||
setLoading(true)
|
||||
const result = await api.getPendingChanges()
|
||||
setLoading(false)
|
||||
if (!result.ok) {
|
||||
setError(result.errorMessage ?? "挂起更改加载失败")
|
||||
return
|
||||
}
|
||||
setError(null)
|
||||
const list = result.data?.pendingChanges ?? []
|
||||
setPendingChanges(list)
|
||||
setExcludedKeys((prev) => {
|
||||
const valid = new Set(list.map((change) => change.serverPath))
|
||||
const next = new Set([...prev].filter((key) => valid.has(key)))
|
||||
return next.size === prev.size ? prev : next
|
||||
})
|
||||
}, [])
|
||||
|
||||
useEffect(() => {
|
||||
void refresh()
|
||||
}, [refresh])
|
||||
|
||||
/**
|
||||
* 切换某条挂起更改的 Included / Excluded 归属。
|
||||
*/
|
||||
const toggleExcluded = useCallback((serverPath: string) => {
|
||||
setExcludedKeys((prev) => {
|
||||
const next = new Set(prev)
|
||||
if (next.has(serverPath)) {
|
||||
next.delete(serverPath)
|
||||
} else {
|
||||
next.add(serverPath)
|
||||
}
|
||||
return next
|
||||
})
|
||||
}, [])
|
||||
|
||||
// serverPath -> 挂起状态，供文件列表生成菜单时控制可用性。
|
||||
const pendingByServerPath = useMemo(() => {
|
||||
const map: Record<string, string> = {}
|
||||
for (const change of pendingChanges) {
|
||||
map[change.serverPath] = change.status
|
||||
}
|
||||
return map
|
||||
}, [pendingChanges])
|
||||
|
||||
return {
|
||||
pendingChanges,
|
||||
loading,
|
||||
error,
|
||||
excludedKeys,
|
||||
pendingByServerPath,
|
||||
refresh,
|
||||
toggleExcluded,
|
||||
}
|
||||
}
|
||||
+196
-97
@@ -1,117 +1,216 @@
|
||||
import { getApiBaseUrl, getToken } from "~/lib/electron"
|
||||
import type { ApiRequestOptions, ApiResponse, ApiResult } from "./types"
|
||||
import { getMactfsBridge } from "~/lib/electron/bridge"
|
||||
|
||||
import type { ApiResult } from "./types"
|
||||
|
||||
const API_BASE_URL = "http://127.0.0.1:38765"
|
||||
|
||||
interface ApiRequestOptions extends Omit<RequestInit, "body" | "headers"> {
|
||||
body?: unknown
|
||||
headers?: HeadersInit
|
||||
}
|
||||
|
||||
export type ApiRequestLogStatus = "running" | "success" | "error"
|
||||
|
||||
export interface ApiRequestLogEntry {
|
||||
id: string
|
||||
operation: string
|
||||
summary: string
|
||||
startedAt: number
|
||||
endedAt?: number
|
||||
durationMs?: number
|
||||
success?: boolean
|
||||
errorMessage?: string
|
||||
status: ApiRequestLogStatus
|
||||
logs?: string[]
|
||||
}
|
||||
|
||||
type ApiRequestLogListener = (entry: ApiRequestLogEntry) => void
|
||||
|
||||
const apiRequestLogListeners = new Set<ApiRequestLogListener>()
|
||||
let apiRequestLogIndex = 0
|
||||
|
||||
/**
|
||||
* 拼接查询参数到请求路径，自动跳过空值。
|
||||
* 订阅统一 API client 的请求日志，供底部 Console 展示每次操作状态。
|
||||
*/
|
||||
function buildUrl(
|
||||
baseUrl: string,
|
||||
path: string,
|
||||
query?: ApiRequestOptions["query"],
|
||||
): string {
|
||||
const url = new URL(path, baseUrl)
|
||||
if (query) {
|
||||
for (const [key, value] of Object.entries(query)) {
|
||||
if (value !== undefined && value !== null) {
|
||||
url.searchParams.set(key, String(value))
|
||||
export function subscribeApiRequestLogs(listener: ApiRequestLogListener) {
|
||||
apiRequestLogListeners.add(listener)
|
||||
|
||||
return () => {
|
||||
apiRequestLogListeners.delete(listener)
|
||||
}
|
||||
}
|
||||
}
|
||||
return url.toString()
|
||||
}
|
||||
|
||||
/**
|
||||
* 统一提取错误信息，遵循 errorMessage || message 的展示约定。
|
||||
* 向所有日志订阅方发布一条请求状态更新。
|
||||
*/
|
||||
function resolveErrorMessage(
|
||||
result: ApiResult<unknown> | null,
|
||||
fallback: string,
|
||||
): string {
|
||||
if (result) {
|
||||
return result.errorMessage || result.message || fallback
|
||||
}
|
||||
return fallback
|
||||
function notifyApiRequestLog(entry: ApiRequestLogEntry) {
|
||||
apiRequestLogListeners.forEach((listener) => listener(entry))
|
||||
}
|
||||
|
||||
/**
|
||||
* 发起一次本地 API 请求，自动携带 Bearer Token 并统一封装结果。
|
||||
* 生成本次请求的前端日志 id，用于 running 和完成态更新同一行。
|
||||
*/
|
||||
async function request<T = Record<string, unknown>>(
|
||||
method: string,
|
||||
path: string,
|
||||
options: ApiRequestOptions = {},
|
||||
): Promise<ApiResponse<T>> {
|
||||
const baseUrl = await getApiBaseUrl()
|
||||
const token = await getToken()
|
||||
const headers: Record<string, string> = {
|
||||
Accept: "application/json",
|
||||
function nextApiRequestLogId(apiPath: string) {
|
||||
apiRequestLogIndex += 1
|
||||
return `${Date.now()}:${apiRequestLogIndex}:${apiPath}`
|
||||
}
|
||||
if (token) {
|
||||
headers.Authorization = `Bearer ${token}`
|
||||
|
||||
/**
|
||||
* 从请求体或 query 中提取路径摘要，便于 Console 快速定位操作对象。
|
||||
*/
|
||||
function summarizeApiRequest(apiPath: string, body?: unknown) {
|
||||
if (body && typeof body === "object" && !Array.isArray(body)) {
|
||||
const bodySummary = summarizeRequestBody(body as Record<string, unknown>)
|
||||
if (bodySummary) {
|
||||
return bodySummary
|
||||
}
|
||||
const init: RequestInit = { method, headers, signal: options.signal }
|
||||
}
|
||||
|
||||
const query = apiPath.split("?")[1]
|
||||
return query || apiPath
|
||||
}
|
||||
|
||||
/**
|
||||
* 按后端常用字段生成请求体摘要。
|
||||
*/
|
||||
function summarizeRequestBody(body: Record<string, unknown>) {
|
||||
return [
|
||||
"serverPath",
|
||||
"path",
|
||||
"localPath",
|
||||
"paths",
|
||||
"serverPaths",
|
||||
"changeset",
|
||||
"sourceChangeset",
|
||||
"targetChangeset",
|
||||
]
|
||||
.filter((key) => body[key] !== undefined && body[key] !== "")
|
||||
.map((key) => `${key}=${formatSummaryValue(body[key])}`)
|
||||
.join(" | ")
|
||||
}
|
||||
|
||||
/**
|
||||
* 将摘要字段值转换成单行文本。
|
||||
*/
|
||||
function formatSummaryValue(value: unknown) {
|
||||
return Array.isArray(value) ? value.join(", ") : String(value)
|
||||
}
|
||||
|
||||
/**
|
||||
* 创建前端统一失败响应，供网络或 Electron 桥接不可用时展示明确提示。
|
||||
*/
|
||||
function createFailureResult<TData>(
|
||||
message: string,
|
||||
startedAt = Date.now()
|
||||
): ApiResult<TData> {
|
||||
const endedAt = Date.now()
|
||||
|
||||
return {
|
||||
success: false,
|
||||
message,
|
||||
errorMessage: message,
|
||||
operation: "frontendRequest",
|
||||
startedAt,
|
||||
endedAt,
|
||||
durationMs: endedAt - startedAt,
|
||||
logs: [],
|
||||
data: {} as TData,
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 将统一 API 响应转换为底部 Console 可展示的日志行。
|
||||
*/
|
||||
function toApiRequestLogEntry(
|
||||
id: string,
|
||||
summary: string,
|
||||
fallbackStartedAt: number,
|
||||
result: ApiResult<unknown>
|
||||
): ApiRequestLogEntry {
|
||||
return {
|
||||
id,
|
||||
operation: result.operation,
|
||||
summary,
|
||||
startedAt: result.startedAt || fallbackStartedAt,
|
||||
endedAt: result.endedAt,
|
||||
durationMs: result.durationMs,
|
||||
success: result.success,
|
||||
errorMessage: result.errorMessage || (result.success ? "" : result.message),
|
||||
status: result.success ? "success" : "error",
|
||||
logs: result.logs,
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 通过统一 API client 调用本地 Java API，并自动附加 Bearer token。
|
||||
*/
|
||||
export async function apiRequest<TData>(
|
||||
apiPath: string,
|
||||
options: ApiRequestOptions = {}
|
||||
): Promise<ApiResult<TData>> {
|
||||
const startedAt = Date.now()
|
||||
const logId = nextApiRequestLogId(apiPath)
|
||||
const summary = summarizeApiRequest(apiPath, options.body)
|
||||
|
||||
notifyApiRequestLog({
|
||||
id: logId,
|
||||
operation: apiPath,
|
||||
summary,
|
||||
startedAt,
|
||||
status: "running",
|
||||
})
|
||||
|
||||
const bridge = getMactfsBridge()
|
||||
if (!bridge) {
|
||||
const result = createFailureResult<TData>(
|
||||
"未检测到 Electron preload，无法读取本地 API token。",
|
||||
startedAt
|
||||
)
|
||||
notifyApiRequestLog(
|
||||
toApiRequestLogEntry(logId, summary, startedAt, result)
|
||||
)
|
||||
return result
|
||||
}
|
||||
|
||||
const token = await bridge.getToken()
|
||||
if (!token) {
|
||||
const result = createFailureResult<TData>(
|
||||
"未找到本地 API token，请确认本地服务已启动。",
|
||||
startedAt
|
||||
)
|
||||
notifyApiRequestLog(
|
||||
toApiRequestLogEntry(logId, summary, startedAt, result)
|
||||
)
|
||||
return result
|
||||
}
|
||||
|
||||
try {
|
||||
const headers = new Headers(options.headers)
|
||||
headers.set("Authorization", `Bearer ${token}`)
|
||||
if (options.body !== undefined) {
|
||||
headers["Content-Type"] = "application/json;charset=utf-8"
|
||||
init.body = JSON.stringify(options.body)
|
||||
headers.set("Content-Type", "application/json")
|
||||
}
|
||||
|
||||
let response: Response
|
||||
try {
|
||||
response = await fetch(buildUrl(baseUrl, path, options.query), init)
|
||||
const response = await fetch(`${API_BASE_URL}${apiPath}`, {
|
||||
...options,
|
||||
headers,
|
||||
body:
|
||||
options.body === undefined ? undefined : JSON.stringify(options.body),
|
||||
})
|
||||
|
||||
const result = (await response.json()) as ApiResult<TData>
|
||||
notifyApiRequestLog(
|
||||
toApiRequestLogEntry(logId, summary, startedAt, result)
|
||||
)
|
||||
return result
|
||||
} catch (error) {
|
||||
const message = error instanceof Error ? error.message : String(error)
|
||||
return {
|
||||
ok: false,
|
||||
status: 0,
|
||||
result: null,
|
||||
data: null,
|
||||
errorMessage: `无法连接本地服务：${message}`,
|
||||
const result = createFailureResult<TData>(
|
||||
error instanceof Error ? error.message : "本地 API 请求失败。",
|
||||
startedAt
|
||||
)
|
||||
notifyApiRequestLog(
|
||||
toApiRequestLogEntry(logId, summary, startedAt, result)
|
||||
)
|
||||
return result
|
||||
}
|
||||
}
|
||||
|
||||
let result: ApiResult<T> | null = null
|
||||
try {
|
||||
result = (await response.json()) as ApiResult<T>
|
||||
} catch {
|
||||
result = null
|
||||
}
|
||||
|
||||
const ok = response.ok && result?.success === true
|
||||
return {
|
||||
ok,
|
||||
status: response.status,
|
||||
result,
|
||||
data: result?.data ?? null,
|
||||
errorMessage: ok
|
||||
? null
|
||||
: resolveErrorMessage(result, `请求失败（HTTP ${response.status}）`),
|
||||
}
|
||||
}
|
||||
|
||||
// 统一 API 客户端，组件只通过本对象访问后端，不直接 fetch、不直接读 token。
|
||||
export const apiClient = {
|
||||
/**
|
||||
* 发起 GET 请求。
|
||||
*/
|
||||
get<T = Record<string, unknown>>(path: string, options?: ApiRequestOptions) {
|
||||
return request<T>("GET", path, options)
|
||||
},
|
||||
/**
|
||||
* 发起 POST 请求。
|
||||
*/
|
||||
post<T = Record<string, unknown>>(path: string, options?: ApiRequestOptions) {
|
||||
return request<T>("POST", path, options)
|
||||
},
|
||||
/**
|
||||
* 发起 PUT 请求。
|
||||
*/
|
||||
put<T = Record<string, unknown>>(path: string, options?: ApiRequestOptions) {
|
||||
return request<T>("PUT", path, options)
|
||||
},
|
||||
/**
|
||||
* 发起 DELETE 请求。
|
||||
*/
|
||||
delete<T = Record<string, unknown>>(path: string, options?: ApiRequestOptions) {
|
||||
return request<T>("DELETE", path, options)
|
||||
},
|
||||
}
|
||||
|
||||
+149
-149
@@ -1,237 +1,237 @@
|
||||
import { apiClient } from "./client"
|
||||
import { apiRequest } from "./client"
|
||||
|
||||
import type {
|
||||
AppConfig,
|
||||
CheckMappingTargetResult,
|
||||
CheckinResult,
|
||||
Collection,
|
||||
ConflictInfo,
|
||||
ConflictResolution,
|
||||
ConflictResolutionResult,
|
||||
ConnectResult,
|
||||
FileContent,
|
||||
FileOperationResult,
|
||||
FolderDiffItem,
|
||||
GetLatestResult,
|
||||
HistoryEntry,
|
||||
MappingInfo,
|
||||
OperationLogEntry,
|
||||
PendingChange,
|
||||
ServerItem,
|
||||
TextDiff,
|
||||
WorkspaceContext,
|
||||
WorkspaceInfo,
|
||||
AddMappingData,
|
||||
AddMappingRequest,
|
||||
CheckinData,
|
||||
CheckinRequest,
|
||||
ChangesetFilesData,
|
||||
CompareFolderData,
|
||||
CompareFolderRequest,
|
||||
CollectionsData,
|
||||
FileOperationData,
|
||||
FileOperationRequest,
|
||||
ConfigData,
|
||||
ConnectData,
|
||||
DiffLocalLatestRequest,
|
||||
DiffRevisionsRequest,
|
||||
GetLatestData,
|
||||
GetLatestRequest,
|
||||
HistoryData,
|
||||
MappingsData,
|
||||
MappingsRequest,
|
||||
OperationLogsData,
|
||||
PendingChangesData,
|
||||
PendingChangesRequest,
|
||||
ServerTreeData,
|
||||
TextDiffData,
|
||||
} from "./types"
|
||||
|
||||
// 文件类操作（checkout / add / delete / undo）的统一请求体。
|
||||
type FileActionBody = { paths: string[]; recursive?: boolean }
|
||||
|
||||
/**
|
||||
* 读取服务端持久化配置。
|
||||
* 读取后端保存的默认连接配置，用于再次打开时回填表单。
|
||||
*/
|
||||
export function getConfig() {
|
||||
return apiClient.get<{ config: AppConfig }>("/api/config")
|
||||
return apiRequest<ConfigData>("/api/config")
|
||||
}
|
||||
|
||||
/**
|
||||
* 保存服务端持久化配置。
|
||||
* 提交连接配置给后端；连接成功时后端会保存为默认配置。
|
||||
*/
|
||||
export function saveConfig(config: AppConfig) {
|
||||
return apiClient.put<{ config: AppConfig }>("/api/config", { body: config })
|
||||
export function connectSession(config: AppConfig) {
|
||||
return apiRequest<ConnectData>("/api/session/connect", {
|
||||
method: "POST",
|
||||
body: config,
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 使用给定连接信息连接 TFS，成功后服务端会保存配置并建立会话。
|
||||
*/
|
||||
export function connect(config: Partial<AppConfig> = {}) {
|
||||
return apiClient.post<ConnectResult>("/api/session/connect", { body: config })
|
||||
}
|
||||
|
||||
/**
|
||||
* 列出当前账号可见的 Collection。
|
||||
* 加载当前连接可见的 TFS Collection 列表。
|
||||
*/
|
||||
export function listCollections() {
|
||||
return apiClient.get<{ collections: Collection[] }>("/api/collections")
|
||||
return apiRequest<CollectionsData>("/api/collections")
|
||||
}
|
||||
|
||||
/**
|
||||
* 浏览服务端目录树节点。
|
||||
* 加载指定 Collection 和服务端路径下的目录节点。
|
||||
*/
|
||||
export function getServerTree(params: { path?: string; collection?: string } = {}) {
|
||||
return apiClient.get<{ path: string; items: ServerItem[] }>("/api/server-tree", { query: params })
|
||||
export function listServerTree(path: string, collection?: string) {
|
||||
const params = new URLSearchParams({ path })
|
||||
if (collection) {
|
||||
params.set("collection", collection)
|
||||
}
|
||||
|
||||
return apiRequest<ServerTreeData>(`/api/server-tree?${params.toString()}`)
|
||||
}
|
||||
|
||||
/**
|
||||
* 读取当前目录下一级文件与文件夹列表。
|
||||
* 加载当前 Workspace 的 Mapping 列表，用于判断服务端项是否已映射到本地。
|
||||
*/
|
||||
export function getFolderItems(params: { path?: string; collection?: string } = {}) {
|
||||
return apiClient.get<{ path: string; items: ServerItem[] }>("/api/server-folder/items", { query: params })
|
||||
export function listMappings(request: MappingsRequest = {}) {
|
||||
const params = new URLSearchParams()
|
||||
if (request.collection) {
|
||||
params.set("collection", request.collection)
|
||||
}
|
||||
|
||||
const query = params.toString()
|
||||
return apiRequest<MappingsData>(
|
||||
query ? `/api/mappings?${query}` : "/api/mappings"
|
||||
)
|
||||
}
|
||||
|
||||
/**
|
||||
* 读取当前 Workspace 名称与 Mapping 列表。
|
||||
* 加载指定目录下一级文件和文件夹，供中间文件列表展示。
|
||||
*/
|
||||
export function getWorkspace() {
|
||||
return apiClient.get<{ workspace: string; mappings: MappingInfo[] }>("/api/workspace")
|
||||
export function listServerFolderItems(path: string, collection?: string) {
|
||||
const params = new URLSearchParams({ path })
|
||||
if (collection) {
|
||||
params.set("collection", collection)
|
||||
}
|
||||
|
||||
return apiRequest<ServerTreeData>(
|
||||
`/api/server-folder/items?${params.toString()}`
|
||||
)
|
||||
}
|
||||
|
||||
/**
|
||||
* 确保当前 Collection 的默认 Workspace 存在，必要时创建。
|
||||
* 创建服务端路径到本地目录的 Mapping，可选择保存后立即 Get Latest。
|
||||
*/
|
||||
export function ensureWorkspace(body: { collection?: string; workspace?: string; comment?: string } = {}) {
|
||||
return apiClient.post<{ workspace: WorkspaceInfo }>("/api/workspace/ensure", { body })
|
||||
export function addMapping(request: AddMappingRequest) {
|
||||
return apiRequest<AddMappingData>("/api/mappings", {
|
||||
method: "POST",
|
||||
body: request,
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 读取工作台固定上下文（serverUri / collection / workspace / mappings）。
|
||||
* 对已映射目录执行元数据级目录对比，返回差异文件状态列表。
|
||||
*/
|
||||
export function getWorkspaceContext() {
|
||||
return apiClient.get<{ context: WorkspaceContext }>("/api/workspace/context")
|
||||
export function compareFolder(request: CompareFolderRequest) {
|
||||
return apiRequest<CompareFolderData>("/api/compare/folder", {
|
||||
method: "POST",
|
||||
body: request,
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 读取当前 Workspace 的 Mapping 列表。
|
||||
* 查询当前 Workspace 的挂起更改列表，供右侧 Inspector 分组展示。
|
||||
*/
|
||||
export function listMappings() {
|
||||
return apiClient.get<{ mappings: MappingInfo[] }>("/api/mappings")
|
||||
export function listPendingChanges(request: PendingChangesRequest = {}) {
|
||||
const params = new URLSearchParams()
|
||||
if (request.collection) {
|
||||
params.set("collection", request.collection)
|
||||
}
|
||||
if (request.serverPath) {
|
||||
params.set("serverPath", request.serverPath)
|
||||
}
|
||||
|
||||
const query = params.toString()
|
||||
return apiRequest<PendingChangesData>(
|
||||
query ? `/api/pending-changes?${query}` : "/api/pending-changes"
|
||||
)
|
||||
}
|
||||
|
||||
/**
|
||||
* 预校验 Mapping 目标路径，返回最终本地目标路径及是否已存在。
|
||||
* 获取指定服务端路径的最新版本，目录按 recursive 参数递归。
|
||||
*/
|
||||
export function checkMappingTarget(body: { serverPath: string; localParentPath: string }) {
|
||||
return apiClient.post<CheckMappingTargetResult>("/api/mappings/check-target", { body })
|
||||
export function getLatest(request: GetLatestRequest) {
|
||||
return apiRequest<GetLatestData>("/api/files/get-latest", {
|
||||
method: "POST",
|
||||
body: request,
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 创建 Mapping，可选立即 Get Latest。
|
||||
* 对已映射且本地存在的文件或目录执行 checkout。
|
||||
*/
|
||||
export function addMapping(body: { serverPath: string; localPath: string; getLatest?: boolean }) {
|
||||
return apiClient.post<{ mapping: MappingInfo; getLatest?: GetLatestResult }>("/api/mappings", { body })
|
||||
}
|
||||
|
||||
/**
|
||||
* 删除 Mapping，仅解除映射不删除本地文件。
|
||||
*/
|
||||
export function deleteMapping(body: { serverPath?: string; localPath?: string }) {
|
||||
return apiClient.delete<{ mappings: MappingInfo[] }>("/api/mappings", { body })
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取指定服务端路径的最新文件。
|
||||
* force=false（默认）为安全模式，本地改动会产生冲突而不被覆盖；force=true 强制覆盖本地。
|
||||
*/
|
||||
export function getLatest(body: { serverPath?: string; recursive?: boolean; force?: boolean } = {}) {
|
||||
return apiClient.post<{ result: GetLatestResult }>("/api/files/get-latest", { body })
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取指定 changeset 版本并覆盖本地（对应 VS 的 Get Specific Version + Overwrite）。
|
||||
*/
|
||||
export function getVersion(body: { serverPath: string; changeset: number; recursive?: boolean }) {
|
||||
return apiClient.post<{ result: GetLatestResult }>("/api/files/get-version", { body })
|
||||
}
|
||||
|
||||
/**
|
||||
* 对已存在文件或目录执行 checkout。
|
||||
*/
|
||||
export function checkout(body: FileActionBody) {
|
||||
return apiClient.post<{ result: FileOperationResult }>("/api/files/checkout", { body })
|
||||
export function checkoutFiles(request: FileOperationRequest) {
|
||||
return apiRequest<FileOperationData>("/api/files/checkout", {
|
||||
method: "POST",
|
||||
body: request,
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 将本地新增文件加入 pending add。
|
||||
*/
|
||||
export function addFiles(body: FileActionBody) {
|
||||
return apiClient.post<{ result: FileOperationResult }>("/api/files/add", { body })
|
||||
export function addFiles(request: FileOperationRequest) {
|
||||
return apiRequest<FileOperationData>("/api/files/add", {
|
||||
method: "POST",
|
||||
body: request,
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 对已版本控制文件或目录执行 pending delete。
|
||||
*/
|
||||
export function deleteFiles(body: FileActionBody) {
|
||||
return apiClient.post<{ result: FileOperationResult }>("/api/files/delete", { body })
|
||||
export function deleteFiles(request: FileOperationRequest) {
|
||||
return apiRequest<FileOperationData>("/api/files/delete", {
|
||||
method: "POST",
|
||||
body: request,
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 撤销指定路径上的挂起更改。
|
||||
* 撤销指定路径上的 pending changes。
|
||||
*/
|
||||
export function undoFiles(body: FileActionBody) {
|
||||
return apiClient.post<{ result: FileOperationResult }>("/api/files/undo", { body })
|
||||
export function undoFiles(request: FileOperationRequest) {
|
||||
return apiRequest<FileOperationData>("/api/files/undo", {
|
||||
method: "POST",
|
||||
body: request,
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 读取当前 Workspace 的挂起更改。
|
||||
* 将 Included Changes 对应的 serverPaths 提交到 TFS。
|
||||
*/
|
||||
export function getPendingChanges(params: { serverPath?: string } = {}) {
|
||||
return apiClient.get<{ pendingChanges: PendingChange[] }>("/api/pending-changes", { query: params })
|
||||
export function checkin(request: CheckinRequest) {
|
||||
return apiRequest<CheckinData>("/api/checkin", {
|
||||
method: "POST",
|
||||
body: request,
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 提交带注释的签入，paths 为空时签入全部挂起更改。
|
||||
* 查询文件或目录最近历史记录。
|
||||
*/
|
||||
export function checkin(body: { paths?: string[]; comment: string }) {
|
||||
return apiClient.post<{ checkin: CheckinResult }>("/api/checkin", { body })
|
||||
}
|
||||
|
||||
/**
|
||||
* 读取服务器内容（latest 或指定 changeset），或读取本地映射文件内容。
|
||||
*/
|
||||
export function getFileContent(params: { serverPath?: string; localPath?: string; changeset?: number }) {
|
||||
return apiClient.get<{ content: FileContent }>("/api/files/content", { query: params })
|
||||
}
|
||||
|
||||
/**
|
||||
* 对已映射目录执行目录对比。
|
||||
*/
|
||||
export function compareFolder(body: { serverPath: string; localPath?: string; recursive?: boolean }) {
|
||||
return apiClient.post<{ diffs: FolderDiffItem[] }>("/api/compare/folder", { body })
|
||||
}
|
||||
|
||||
/**
|
||||
* 查询文件或目录历史。
|
||||
*/
|
||||
export function getHistory(params: { path: string; folder?: boolean }) {
|
||||
return apiClient.get<{ history: HistoryEntry[] }>("/api/history", { query: params })
|
||||
export function queryHistory(path: string, folder: boolean) {
|
||||
const params = new URLSearchParams({ path, folder: String(folder) })
|
||||
return apiRequest<HistoryData>(`/api/history?${params.toString()}`)
|
||||
}
|
||||
|
||||
/**
|
||||
* 查询指定 changeset 影响的文件列表。
|
||||
*/
|
||||
export function getChangesetFiles(params: { changeset: number }) {
|
||||
return apiClient.get<{ files: HistoryEntry[] }>("/api/history/changeset", { query: params })
|
||||
export function queryChangesetFiles(changeset: number) {
|
||||
const params = new URLSearchParams({ changeset: String(changeset) })
|
||||
return apiRequest<ChangesetFilesData>(
|
||||
`/api/history/changeset?${params.toString()}`
|
||||
)
|
||||
}
|
||||
|
||||
/**
|
||||
* 生成本地文件与服务器 latest 的文本 Diff。
|
||||
* 生成本地文件和服务器 latest 之间的文本 diff。
|
||||
*/
|
||||
export function diffLocalLatest(body: { serverPath: string; localPath: string }) {
|
||||
return apiClient.post<{ diff: TextDiff }>("/api/diff/local-latest", { body })
|
||||
export function diffLocalLatest(request: DiffLocalLatestRequest) {
|
||||
return apiRequest<TextDiffData>("/api/diff/local-latest", {
|
||||
method: "POST",
|
||||
body: request,
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 生成同一服务端文件两个 changeset 之间的文本 Diff。
|
||||
* 生成同一服务端文件两个历史版本之间的文本 diff。
|
||||
*/
|
||||
export function diffRevisions(body: { serverPath: string; sourceChangeset: number; targetChangeset: number }) {
|
||||
return apiClient.post<{ diff: TextDiff }>("/api/diff/revisions", { body })
|
||||
export function diffRevisions(request: DiffRevisionsRequest) {
|
||||
return apiRequest<TextDiffData>("/api/diff/revisions", {
|
||||
method: "POST",
|
||||
body: request,
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 查询当前 Workspace 的冲突明细。
|
||||
* 读取本地 API 服务最近操作日志，供底部 Console 手动刷新。
|
||||
*/
|
||||
export function listConflicts(params: { serverPath?: string; recursive?: boolean } = {}) {
|
||||
return apiClient.get<{ conflicts: ConflictInfo[] }>("/api/conflicts", { query: params })
|
||||
}
|
||||
|
||||
/**
|
||||
* 对单个冲突应用取舍（采用服务器版本或保留本地版本）。
|
||||
*/
|
||||
export function applyConflict(body: { conflictId: number; resolution: ConflictResolution }) {
|
||||
return apiClient.post<{ resolution: ConflictResolutionResult }>("/api/conflicts/apply", { body })
|
||||
}
|
||||
|
||||
/**
|
||||
* 读取最近操作日志。
|
||||
*/
|
||||
export function getLogs() {
|
||||
return apiClient.get<{ logs: OperationLogEntry[] }>("/api/logs")
|
||||
export function listOperationLogs() {
|
||||
return apiRequest<OperationLogsData>("/api/logs")
|
||||
}
|
||||
|
||||
@@ -1,28 +0,0 @@
|
||||
export type {
|
||||
ApiRequestOptions,
|
||||
ApiResponse,
|
||||
ApiResult,
|
||||
AppConfig,
|
||||
CheckMappingTargetResult,
|
||||
CheckinResult,
|
||||
Collection,
|
||||
ConflictInfo,
|
||||
ConflictResolution,
|
||||
ConflictResolutionResult,
|
||||
ConnectResult,
|
||||
FileContent,
|
||||
FileOperationResult,
|
||||
FolderDiffItem,
|
||||
GetLatestResult,
|
||||
HistoryEntry,
|
||||
MappingConfig,
|
||||
MappingInfo,
|
||||
OperationLogEntry,
|
||||
PendingChange,
|
||||
ServerItem,
|
||||
TextDiff,
|
||||
WorkspaceContext,
|
||||
WorkspaceInfo,
|
||||
} from "./types"
|
||||
export { apiClient } from "./client"
|
||||
export * as api from "./endpoints"
|
||||
+160
-120
@@ -1,39 +1,34 @@
|
||||
// 服务端统一响应结构，对应 MacTfsServer.ApiResult。
|
||||
export interface ApiResult<T = Record<string, unknown>> {
|
||||
export interface ApiResult<TData = Record<string, unknown>> {
|
||||
success: boolean
|
||||
message?: string
|
||||
message: string
|
||||
errorMessage?: string
|
||||
operation?: string
|
||||
startedAt?: number
|
||||
endedAt?: number
|
||||
durationMs?: number
|
||||
logs?: string[]
|
||||
data: T
|
||||
operation: string
|
||||
startedAt: number
|
||||
endedAt: number
|
||||
durationMs: number
|
||||
logs: string[]
|
||||
data: TData
|
||||
}
|
||||
|
||||
// API 客户端对外返回结构，统一封装网络层与业务层成功/失败。
|
||||
export interface ApiResponse<T = Record<string, unknown>> {
|
||||
ok: boolean
|
||||
status: number
|
||||
result: ApiResult<T> | null
|
||||
data: T | null
|
||||
errorMessage: string | null
|
||||
export interface HealthData {
|
||||
status: string
|
||||
host: string
|
||||
port: number
|
||||
tokenFile: string
|
||||
configFile: string
|
||||
connected: boolean
|
||||
}
|
||||
|
||||
// API 请求选项。
|
||||
export interface ApiRequestOptions {
|
||||
query?: Record<string, string | number | boolean | undefined | null>
|
||||
body?: unknown
|
||||
signal?: AbortSignal
|
||||
}
|
||||
|
||||
// 单条 Mapping 配置，对应服务端 MappingConfig。
|
||||
export interface MappingConfig {
|
||||
serverPath?: string
|
||||
localPath?: string
|
||||
}
|
||||
|
||||
export interface TfsMappingInfo {
|
||||
serverPath: string
|
||||
localPath: string
|
||||
}
|
||||
|
||||
// 服务端持久化配置，对应 MacTfsServer.AppConfig。
|
||||
export interface AppConfig {
|
||||
serverUri?: string
|
||||
authType?: string
|
||||
@@ -42,170 +37,215 @@ export interface AppConfig {
|
||||
password?: string
|
||||
collection?: string
|
||||
workspace?: string
|
||||
mappings: MappingConfig[]
|
||||
mappings?: MappingConfig[]
|
||||
}
|
||||
|
||||
// 连接结果摘要，对应 /api/session/connect 返回的概要字段。
|
||||
export interface ConnectResult {
|
||||
export interface ConfigData {
|
||||
config: AppConfig
|
||||
}
|
||||
|
||||
export interface ConnectData {
|
||||
serverUri?: string
|
||||
collectionCount?: number
|
||||
}
|
||||
|
||||
// Collection 信息，对应 core TfsCollectionInfo。
|
||||
export interface Collection {
|
||||
export interface TfsCollectionInfo {
|
||||
name: string
|
||||
id: string
|
||||
}
|
||||
|
||||
// 服务端目录项，对应服务端 serverItems 序列化结构。
|
||||
export interface ServerItem {
|
||||
export interface TfsServerItem {
|
||||
name: string
|
||||
path: string
|
||||
serverPath: string
|
||||
type: "folder" | "file"
|
||||
folder: boolean
|
||||
latestVersion: number
|
||||
checkinDate: number | null
|
||||
checkinDate?: number | null
|
||||
}
|
||||
|
||||
// Workspace Mapping 信息，对应 core TfsMappingInfo。
|
||||
export interface MappingInfo {
|
||||
export interface CollectionsData {
|
||||
collections: TfsCollectionInfo[]
|
||||
}
|
||||
|
||||
export interface ServerTreeData {
|
||||
path: string
|
||||
items: TfsServerItem[]
|
||||
}
|
||||
|
||||
export interface MappingsData {
|
||||
mappings: TfsMappingInfo[]
|
||||
}
|
||||
|
||||
export interface MappingsRequest {
|
||||
collection?: string
|
||||
}
|
||||
|
||||
export interface AddMappingRequest {
|
||||
serverPath: string
|
||||
localPath: string
|
||||
getLatest: boolean
|
||||
}
|
||||
|
||||
// Workspace 概要，对应 core TfsWorkspaceInfo。
|
||||
export interface WorkspaceInfo {
|
||||
name: string
|
||||
ownerName: string
|
||||
computer: string
|
||||
comment: string
|
||||
created: boolean
|
||||
mappings: MappingInfo[]
|
||||
export interface AddMappingData {
|
||||
mapping?: TfsMappingInfo
|
||||
getLatest?: unknown
|
||||
}
|
||||
|
||||
// 工作台固定上下文，对应 /api/workspace/context 的 context 字段。
|
||||
export interface WorkspaceContext {
|
||||
serverUri?: string
|
||||
authType?: string
|
||||
collection?: string
|
||||
workspace?: string
|
||||
connected: boolean
|
||||
mappings: MappingInfo[]
|
||||
}
|
||||
export type FolderDiffStatus =
|
||||
| "localModified"
|
||||
| "remoteChanged"
|
||||
| "bothChanged"
|
||||
| "localOnly"
|
||||
| "remoteOnly"
|
||||
| "notDownloaded"
|
||||
| "localDeleted"
|
||||
| "pendingEdit"
|
||||
| "pendingAdd"
|
||||
| "pendingDelete"
|
||||
| "upToDate"
|
||||
|
||||
// Mapping 目标预校验结果，对应 /api/mappings/check-target。
|
||||
export interface CheckMappingTargetResult {
|
||||
export interface CompareFolderRequest {
|
||||
serverPath: string
|
||||
localParentPath: string
|
||||
name: string
|
||||
targetPath: string
|
||||
exists: boolean
|
||||
allowed: boolean
|
||||
localPath: string
|
||||
recursive: boolean
|
||||
}
|
||||
|
||||
// Get Latest 结果，对应 core TfsGetLatestResult。
|
||||
export interface GetLatestResult {
|
||||
export interface FolderDiffItem {
|
||||
serverPath: string
|
||||
localPath: string
|
||||
name: string
|
||||
folder: boolean
|
||||
status: FolderDiffStatus
|
||||
localVersion: number
|
||||
latestVersion: number
|
||||
}
|
||||
|
||||
export interface CompareFolderData {
|
||||
diffs: FolderDiffItem[]
|
||||
}
|
||||
|
||||
export type PendingChangeStatus =
|
||||
| "pendingEdit"
|
||||
| "pendingAdd"
|
||||
| "pendingDelete"
|
||||
| "pendingRename"
|
||||
| "pending"
|
||||
|
||||
export interface TfsPendingChangeInfo {
|
||||
serverPath: string
|
||||
localPath: string
|
||||
name: string
|
||||
folder: boolean
|
||||
status: PendingChangeStatus
|
||||
changeType: string
|
||||
version: number
|
||||
}
|
||||
|
||||
export interface PendingChangesData {
|
||||
pendingChanges: TfsPendingChangeInfo[]
|
||||
}
|
||||
|
||||
export interface PendingChangesRequest {
|
||||
collection?: string
|
||||
serverPath?: string
|
||||
}
|
||||
|
||||
export interface GetLatestRequest {
|
||||
serverPath: string
|
||||
recursive: boolean
|
||||
}
|
||||
|
||||
export interface TfsGetLatestResult {
|
||||
updated: number
|
||||
operations: number
|
||||
conflicts: number
|
||||
failures: number
|
||||
}
|
||||
|
||||
// 文件操作结果，对应 core TfsFileOperationResult。
|
||||
export interface FileOperationResult {
|
||||
export interface GetLatestData {
|
||||
result?: TfsGetLatestResult
|
||||
}
|
||||
|
||||
export interface FileOperationRequest {
|
||||
paths: string[]
|
||||
recursive?: boolean
|
||||
}
|
||||
|
||||
export interface TfsFileOperationResult {
|
||||
operation: string
|
||||
affected: number
|
||||
failures: string[]
|
||||
}
|
||||
|
||||
// 挂起更改项，对应 core TfsPendingChangeInfo。
|
||||
export interface PendingChange {
|
||||
serverPath: string
|
||||
localPath: string
|
||||
name: string
|
||||
folder: boolean
|
||||
status: string
|
||||
changeType: string
|
||||
version: number
|
||||
export interface FileOperationData {
|
||||
result?: TfsFileOperationResult
|
||||
}
|
||||
|
||||
// 签入结果，对应 core TfsCheckinResult。
|
||||
export interface CheckinResult {
|
||||
export interface CheckinRequest {
|
||||
serverPaths: string[]
|
||||
comment: string
|
||||
}
|
||||
|
||||
export interface TfsCheckinResult {
|
||||
changeset: number
|
||||
submittedChanges: number
|
||||
}
|
||||
|
||||
// 目录对比项，对应 core TfsFolderDiffItem。
|
||||
export interface FolderDiffItem {
|
||||
serverPath: string
|
||||
localPath: string
|
||||
name: string
|
||||
folder: boolean
|
||||
status: string
|
||||
localVersion: number
|
||||
latestVersion: number
|
||||
export interface CheckinData {
|
||||
checkin?: TfsCheckinResult
|
||||
}
|
||||
|
||||
// 历史记录项，对应 core TfsHistoryEntry。
|
||||
export interface HistoryEntry {
|
||||
export interface TfsHistoryEntry {
|
||||
serverPath: string
|
||||
name: string
|
||||
changeType: string
|
||||
itemType: string
|
||||
changeset: number
|
||||
author: string
|
||||
date: number | null
|
||||
date?: number | null
|
||||
comment: string
|
||||
}
|
||||
|
||||
// 文件内容，对应 core TfsFileContent，binary / tooLarge 时 content 为空串。
|
||||
export interface FileContent {
|
||||
serverPath: string
|
||||
changeset: number
|
||||
content: string
|
||||
binary: boolean
|
||||
size: number
|
||||
tooLarge: boolean
|
||||
export interface HistoryData {
|
||||
history: TfsHistoryEntry[]
|
||||
}
|
||||
|
||||
// 文本 Diff，对应 core TfsTextDiff。
|
||||
export interface TextDiff {
|
||||
export interface ChangesetFilesData {
|
||||
files: TfsHistoryEntry[]
|
||||
}
|
||||
|
||||
export interface DiffLocalLatestRequest {
|
||||
serverPath: string
|
||||
localPath: string
|
||||
}
|
||||
|
||||
export interface DiffRevisionsRequest {
|
||||
serverPath: string
|
||||
sourceChangeset: number
|
||||
targetChangeset: number
|
||||
}
|
||||
|
||||
export interface TfsTextDiff {
|
||||
sourceLabel: string
|
||||
targetLabel: string
|
||||
lines: string[]
|
||||
}
|
||||
|
||||
// 冲突明细，对应 core TfsConflictInfo。
|
||||
export interface ConflictInfo {
|
||||
conflictId: number
|
||||
type: string
|
||||
serverPath: string | null
|
||||
localPath: string | null
|
||||
yourServerItem: string | null
|
||||
theirServerItem: string | null
|
||||
baseServerItem: string | null
|
||||
resolved: boolean
|
||||
export interface TextDiffData {
|
||||
diff?: TfsTextDiff
|
||||
}
|
||||
|
||||
// 第一版支持的冲突取舍：采用服务器版本或保留本地版本。
|
||||
export type ConflictResolution = "takeServer" | "keepLocal"
|
||||
|
||||
// 冲突应用结果，对应 core TfsConflictResolution。
|
||||
export interface ConflictResolutionResult {
|
||||
conflictId: number
|
||||
resolution: string
|
||||
resolved: boolean
|
||||
remainingConflicts: number
|
||||
}
|
||||
|
||||
// 操作日志项，对应服务端 OperationLogEntry。
|
||||
export interface OperationLogEntry {
|
||||
export interface TfsOperationLogEntry {
|
||||
operation: string
|
||||
summary: string
|
||||
startedAt: number
|
||||
endedAt: number
|
||||
durationMs: number
|
||||
success: boolean
|
||||
errorMessage: string | null
|
||||
errorMessage?: string
|
||||
}
|
||||
|
||||
export interface OperationLogsData {
|
||||
logs: TfsOperationLogEntry[]
|
||||
}
|
||||
|
||||
@@ -1,99 +1,28 @@
|
||||
import type { MactfsBridge, ServiceStatus } from "./types"
|
||||
export interface ServiceStatus {
|
||||
baseUrl: string
|
||||
running: boolean
|
||||
connected: boolean
|
||||
message: string
|
||||
tokenFile: string
|
||||
configFile?: string
|
||||
started?: boolean
|
||||
}
|
||||
|
||||
const DEFAULT_BASE_URL = "http://127.0.0.1:38765"
|
||||
export interface MacTfsBridge {
|
||||
getToken(): Promise<string>
|
||||
getServiceStatus(): Promise<ServiceStatus>
|
||||
selectDirectory(): Promise<string | null>
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取 Electron 暴露的 window.mactfs 桥接对象，非 Electron 环境（含 SSR）返回 null。
|
||||
*/
|
||||
export function getBridge(): MactfsBridge | null {
|
||||
if (typeof window === "undefined") {
|
||||
return null
|
||||
declare global {
|
||||
interface Window {
|
||||
mactfs?: MacTfsBridge
|
||||
}
|
||||
return window.mactfs ?? null
|
||||
}
|
||||
|
||||
/**
|
||||
* 判断当前是否运行在 Electron 桥接环境中。
|
||||
* 返回 preload 暴露的 macTFS 桥接对象，避免组件直接依赖 Electron 细节。
|
||||
*/
|
||||
export function isElectron(): boolean {
|
||||
return getBridge() != null
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取本地 API 基础地址，非 Electron 环境回退到默认本地地址。
|
||||
*/
|
||||
export async function getApiBaseUrl(): Promise<string> {
|
||||
const bridge = getBridge()
|
||||
if (!bridge) {
|
||||
return DEFAULT_BASE_URL
|
||||
}
|
||||
return bridge.getApiBaseUrl()
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取本地服务 Bearer Token，非 Electron 环境返回 null。
|
||||
*/
|
||||
export async function getToken(): Promise<string | null> {
|
||||
const bridge = getBridge()
|
||||
if (!bridge) {
|
||||
return null
|
||||
}
|
||||
return bridge.getToken()
|
||||
}
|
||||
|
||||
/**
|
||||
* 查询本地服务状态，非 Electron 环境返回未就绪状态并说明原因。
|
||||
*/
|
||||
export async function getServiceStatus(): Promise<ServiceStatus> {
|
||||
const bridge = getBridge()
|
||||
if (!bridge) {
|
||||
return unavailableStatus()
|
||||
}
|
||||
return bridge.getServiceStatus()
|
||||
}
|
||||
|
||||
/**
|
||||
* 拉起并等待本地服务就绪，非 Electron 环境返回未就绪状态并说明原因。
|
||||
*/
|
||||
export async function startService(): Promise<ServiceStatus> {
|
||||
const bridge = getBridge()
|
||||
if (!bridge) {
|
||||
return unavailableStatus()
|
||||
}
|
||||
return bridge.startService()
|
||||
}
|
||||
|
||||
/**
|
||||
* 打开系统目录选择器，非 Electron 环境返回 null。
|
||||
*/
|
||||
export async function selectDirectory(): Promise<string | null> {
|
||||
const bridge = getBridge()
|
||||
if (!bridge) {
|
||||
return null
|
||||
}
|
||||
return bridge.selectDirectory()
|
||||
}
|
||||
|
||||
/**
|
||||
* 批量检测本地绝对路径是否存在，非 Electron 环境返回 null 表示无法检测。
|
||||
*/
|
||||
export async function pathsExist(paths: string[]): Promise<Record<string, boolean> | null> {
|
||||
const bridge = getBridge()
|
||||
if (!bridge || paths.length === 0) {
|
||||
return bridge ? {} : null
|
||||
}
|
||||
return bridge.pathsExist(paths)
|
||||
}
|
||||
|
||||
/**
|
||||
* 构造非 Electron 环境下的占位服务状态。
|
||||
*/
|
||||
function unavailableStatus(): ServiceStatus {
|
||||
return {
|
||||
running: false,
|
||||
baseUrl: DEFAULT_BASE_URL,
|
||||
tokenAvailable: false,
|
||||
health: null,
|
||||
error: "当前不在 Electron 桌面环境，无法访问本地服务",
|
||||
}
|
||||
export function getMactfsBridge() {
|
||||
return window.mactfs
|
||||
}
|
||||
|
||||
@@ -1,11 +0,0 @@
|
||||
export type { MactfsBridge, ServiceHealth, ServiceStatus } from "./types"
|
||||
export {
|
||||
getApiBaseUrl,
|
||||
getBridge,
|
||||
getServiceStatus,
|
||||
getToken,
|
||||
isElectron,
|
||||
pathsExist,
|
||||
selectDirectory,
|
||||
startService,
|
||||
} from "./bridge"
|
||||
@@ -1,35 +0,0 @@
|
||||
// 本地 API 服务健康信息，对应服务端 /api/health 的 data 字段。
|
||||
export interface ServiceHealth {
|
||||
status: string
|
||||
host: string
|
||||
port: number
|
||||
tokenFile: string
|
||||
configFile: string
|
||||
connected: boolean
|
||||
}
|
||||
|
||||
// 渲染进程感知的本地服务状态，由 Electron 主进程计算返回。
|
||||
export interface ServiceStatus {
|
||||
running: boolean
|
||||
baseUrl: string
|
||||
tokenAvailable: boolean
|
||||
health: ServiceHealth | null
|
||||
error: string | null
|
||||
}
|
||||
|
||||
// preload 暴露到 window.mactfs 的窄接口契约。
|
||||
export interface MactfsBridge {
|
||||
isElectron: true
|
||||
getApiBaseUrl(): Promise<string>
|
||||
getToken(): Promise<string | null>
|
||||
getServiceStatus(): Promise<ServiceStatus>
|
||||
startService(): Promise<ServiceStatus>
|
||||
selectDirectory(): Promise<string | null>
|
||||
pathsExist(paths: string[]): Promise<Record<string, boolean>>
|
||||
}
|
||||
|
||||
declare global {
|
||||
interface Window {
|
||||
mactfs?: MactfsBridge
|
||||
}
|
||||
}
|
||||
@@ -1,103 +0,0 @@
|
||||
// Monaco Editor 客户端引导模块：注册各语言 worker 后导出 monaco 实例。
|
||||
// 该模块体积大，只允许在浏览器端通过动态 import 加载（如 Diff 弹窗内）。
|
||||
import * as monaco from "monaco-editor"
|
||||
import EditorWorker from "monaco-editor/esm/vs/editor/editor.worker?worker"
|
||||
import JsonWorker from "monaco-editor/esm/vs/language/json/json.worker?worker"
|
||||
import CssWorker from "monaco-editor/esm/vs/language/css/css.worker?worker"
|
||||
import HtmlWorker from "monaco-editor/esm/vs/language/html/html.worker?worker"
|
||||
import TsWorker from "monaco-editor/esm/vs/language/typescript/ts.worker?worker"
|
||||
|
||||
self.MonacoEnvironment = {
|
||||
getWorker(_workerId: string, label: string) {
|
||||
if (label === "json") {
|
||||
return new JsonWorker()
|
||||
}
|
||||
if (label === "css" || label === "scss" || label === "less") {
|
||||
return new CssWorker()
|
||||
}
|
||||
if (label === "html" || label === "handlebars" || label === "razor") {
|
||||
return new HtmlWorker()
|
||||
}
|
||||
if (label === "typescript" || label === "javascript") {
|
||||
return new TsWorker()
|
||||
}
|
||||
return new EditorWorker()
|
||||
},
|
||||
}
|
||||
|
||||
// 自定义主题：贴合应用本身的中性灰底色与红绿差异配色，弱化 Monaco 默认的高饱和蓝。
|
||||
monaco.editor.defineTheme("mactfs-light", {
|
||||
base: "vs",
|
||||
inherit: true,
|
||||
rules: [],
|
||||
colors: {
|
||||
"editor.background": "#ffffff",
|
||||
"editor.foreground": "#1f1f1f",
|
||||
"editor.lineHighlightBackground": "#00000005",
|
||||
"editorLineNumber.foreground": "#a3a3a3",
|
||||
"editorLineNumber.activeForeground": "#525252",
|
||||
"editorCursor.foreground": "#4f46e5",
|
||||
"focusBorder": "#00000000",
|
||||
"diffEditor.insertedTextBackground": "#22c55e2e",
|
||||
"diffEditor.insertedLineBackground": "#22c55e14",
|
||||
"diffEditor.removedTextBackground": "#ef44442e",
|
||||
"diffEditor.removedLineBackground": "#ef444414",
|
||||
"diffEditorGutter.insertedLineBackground": "#22c55e21",
|
||||
"diffEditorGutter.removedLineBackground": "#ef444421",
|
||||
"diffEditorOverview.insertedForeground": "#22c55e99",
|
||||
"diffEditorOverview.removedForeground": "#ef444499",
|
||||
"diffEditor.unchangedRegionBackground": "#fafafa",
|
||||
"diffEditor.unchangedRegionForeground": "#737373",
|
||||
"scrollbarSlider.background": "#0000001f",
|
||||
"scrollbarSlider.hoverBackground": "#00000033",
|
||||
"scrollbarSlider.activeBackground": "#00000040",
|
||||
},
|
||||
})
|
||||
|
||||
monaco.editor.defineTheme("mactfs-dark", {
|
||||
base: "vs-dark",
|
||||
inherit: true,
|
||||
rules: [],
|
||||
colors: {
|
||||
"editor.background": "#1b1b1b",
|
||||
"editor.foreground": "#fafafa",
|
||||
"editor.lineHighlightBackground": "#ffffff08",
|
||||
"editorLineNumber.foreground": "#6b6b6b",
|
||||
"editorLineNumber.activeForeground": "#a3a3a3",
|
||||
"editorCursor.foreground": "#818cf8",
|
||||
"focusBorder": "#00000000",
|
||||
"diffEditor.insertedTextBackground": "#22c55e30",
|
||||
"diffEditor.insertedLineBackground": "#22c55e17",
|
||||
"diffEditor.removedTextBackground": "#ef444430",
|
||||
"diffEditor.removedLineBackground": "#ef444417",
|
||||
"diffEditorGutter.insertedLineBackground": "#22c55e24",
|
||||
"diffEditorGutter.removedLineBackground": "#ef444424",
|
||||
"diffEditorOverview.insertedForeground": "#22c55e99",
|
||||
"diffEditorOverview.removedForeground": "#ef444499",
|
||||
"diffEditor.unchangedRegionBackground": "#222222",
|
||||
"diffEditor.unchangedRegionForeground": "#9c9c9c",
|
||||
"scrollbarSlider.background": "#ffffff1f",
|
||||
"scrollbarSlider.hoverBackground": "#ffffff33",
|
||||
"scrollbarSlider.activeBackground": "#ffffff40",
|
||||
},
|
||||
})
|
||||
|
||||
/**
|
||||
* 按文件路径后缀匹配 Monaco 已注册语言，匹配不到时回退纯文本。
|
||||
*/
|
||||
export function detectLanguage(path: string): string {
|
||||
const name = path.slice(path.lastIndexOf("/") + 1).toLowerCase()
|
||||
const dot = name.lastIndexOf(".")
|
||||
const ext = dot >= 0 ? name.slice(dot) : ""
|
||||
if (ext.length === 0) {
|
||||
return "plaintext"
|
||||
}
|
||||
for (const language of monaco.languages.getLanguages()) {
|
||||
if (language.extensions?.some((item) => item.toLowerCase() === ext)) {
|
||||
return language.id
|
||||
}
|
||||
}
|
||||
return "plaintext"
|
||||
}
|
||||
|
||||
export { monaco }
|
||||
@@ -1,260 +0,0 @@
|
||||
// 对象动作统一模型：左侧树、中间列表、Pending Changes、目录对比结果
|
||||
// 都转换成 FileTarget，再由 buildFileMenu 按状态生成同一套菜单与置灰规则。
|
||||
|
||||
import type { MappingInfo } from "~/lib/api"
|
||||
|
||||
import { resolveLocalPath } from "./mapping"
|
||||
import { normalizeServerPath } from "./path"
|
||||
|
||||
// 对象来源：决定菜单里展示哪一组动作。
|
||||
export type FileTargetSource = "tree" | "list" | "pending" | "compare"
|
||||
|
||||
// 统一的对象目标描述。
|
||||
export interface FileTarget {
|
||||
source: FileTargetSource
|
||||
folder: boolean
|
||||
serverPath: string
|
||||
/** 依据 Mapping 推导出的本地路径，未映射为 null。 */
|
||||
localPath: string | null
|
||||
/** 是否处于某条 Mapping 子树内。 */
|
||||
mapped: boolean
|
||||
/** serverPath 本身是否就是一条 Mapping 的根。 */
|
||||
mappingRoot: boolean
|
||||
/** 挂起更改状态（pendingEdit / pendingAdd / ...），无挂起为 null。 */
|
||||
pendingStatus: string | null
|
||||
/** 目录对比结果状态（localOnly / remoteChanged / ...），非对比来源为 null。 */
|
||||
compareStatus?: string | null
|
||||
}
|
||||
|
||||
// 全部对象动作。
|
||||
export type FileActionId =
|
||||
| "map"
|
||||
| "unmap"
|
||||
| "getLatest"
|
||||
| "forceGetLatest"
|
||||
| "checkout"
|
||||
| "delete"
|
||||
| "undo"
|
||||
| "add"
|
||||
| "compare"
|
||||
| "history"
|
||||
| "viewFile"
|
||||
| "diffLocalLatest"
|
||||
|
||||
// 单个菜单项：是否可用与置灰原因。
|
||||
export interface FileMenuItem {
|
||||
id: FileActionId
|
||||
label: string
|
||||
enabled: boolean
|
||||
danger?: boolean
|
||||
/** 置灰原因，展示为菜单项后缀说明。 */
|
||||
reason?: string
|
||||
}
|
||||
|
||||
/**
|
||||
* 由来源数据构造统一 FileTarget，本地路径与映射状态从 mappings 推导。
|
||||
*/
|
||||
export function makeFileTarget(input: {
|
||||
source: FileTargetSource
|
||||
folder: boolean
|
||||
serverPath: string
|
||||
mappings: MappingInfo[]
|
||||
pendingStatus?: string | null
|
||||
compareStatus?: string | null
|
||||
}): FileTarget {
|
||||
const serverPath = normalizeServerPath(input.serverPath)
|
||||
const localPath = resolveLocalPath(input.mappings, serverPath)
|
||||
const mappingRoot = input.mappings.some(
|
||||
(mapping) => normalizeServerPath(mapping.serverPath) === serverPath,
|
||||
)
|
||||
return {
|
||||
source: input.source,
|
||||
folder: input.folder,
|
||||
serverPath,
|
||||
localPath,
|
||||
mapped: localPath != null,
|
||||
mappingRoot,
|
||||
pendingStatus: input.pendingStatus ?? null,
|
||||
compareStatus: input.compareStatus ?? null,
|
||||
}
|
||||
}
|
||||
|
||||
const NOT_MAPPED_REASON = "未映射到本地"
|
||||
|
||||
/**
|
||||
* 按对象状态生成右键菜单分组：同一路径在树和列表中产出完全一致的动作与置灰规则。
|
||||
* Checkin、全局设置等不进入对象菜单。
|
||||
*/
|
||||
export function buildFileMenu(target: FileTarget): FileMenuItem[][] {
|
||||
// 目录对比中的 localOnly 项：服务端不存在，只保留本地查看与加入版本控制。
|
||||
if (target.source === "compare" && target.compareStatus === "localOnly") {
|
||||
return buildLocalOnlyMenu(target)
|
||||
}
|
||||
return target.folder ? buildFolderMenu(target) : buildFileItemMenu(target)
|
||||
}
|
||||
|
||||
/**
|
||||
* 仅本地存在（localOnly）的对比结果项菜单：加入版本控制 + 本地查看。
|
||||
*/
|
||||
function buildLocalOnlyMenu(target: FileTarget): FileMenuItem[][] {
|
||||
const sections: FileMenuItem[][] = []
|
||||
if (!target.folder) {
|
||||
sections.push([{ id: "viewFile", label: "查看文件", enabled: true }])
|
||||
}
|
||||
sections.push([
|
||||
{
|
||||
id: "add",
|
||||
label: "加入版本控制",
|
||||
enabled: target.localPath != null,
|
||||
reason: target.localPath != null ? undefined : "缺少本地路径",
|
||||
},
|
||||
])
|
||||
return sections
|
||||
}
|
||||
|
||||
/**
|
||||
* 目录菜单：本地工作区动作（未映射置灰）+ Mapping 动作 + 服务端动作。
|
||||
*/
|
||||
function buildFolderMenu(target: FileTarget): FileMenuItem[][] {
|
||||
const sections: FileMenuItem[][] = []
|
||||
|
||||
const workspaceActions: FileMenuItem[] = [
|
||||
{
|
||||
id: "getLatest",
|
||||
label: "获取最新",
|
||||
enabled: target.mapped,
|
||||
reason: target.mapped ? undefined : NOT_MAPPED_REASON,
|
||||
},
|
||||
{
|
||||
id: "forceGetLatest",
|
||||
label: "强制获取最新…",
|
||||
enabled: target.mapped,
|
||||
danger: true,
|
||||
reason: target.mapped ? undefined : NOT_MAPPED_REASON,
|
||||
},
|
||||
{
|
||||
id: "checkout",
|
||||
label: "签出编辑",
|
||||
enabled: target.mapped,
|
||||
reason: target.mapped ? undefined : NOT_MAPPED_REASON,
|
||||
},
|
||||
{
|
||||
id: "delete",
|
||||
label: "挂起删除",
|
||||
enabled: target.mapped,
|
||||
danger: true,
|
||||
reason: target.mapped ? undefined : NOT_MAPPED_REASON,
|
||||
},
|
||||
{
|
||||
id: "undo",
|
||||
label: "撤销更改",
|
||||
enabled: target.mapped,
|
||||
reason: target.mapped ? undefined : NOT_MAPPED_REASON,
|
||||
},
|
||||
]
|
||||
sections.push(workspaceActions)
|
||||
|
||||
const mappingActions: FileMenuItem[] = []
|
||||
if (!target.mapped) {
|
||||
mappingActions.push({ id: "map", label: "映射到本地", enabled: true })
|
||||
}
|
||||
if (target.mappingRoot) {
|
||||
mappingActions.push({ id: "unmap", label: "取消映射", enabled: true, danger: true })
|
||||
}
|
||||
if (mappingActions.length > 0) {
|
||||
sections.push(mappingActions)
|
||||
}
|
||||
|
||||
sections.push([
|
||||
{
|
||||
id: "compare",
|
||||
label: "目录对比",
|
||||
enabled: target.mapped,
|
||||
reason: target.mapped ? undefined : NOT_MAPPED_REASON,
|
||||
},
|
||||
{ id: "history", label: "查看历史", enabled: true },
|
||||
])
|
||||
|
||||
return sections
|
||||
}
|
||||
|
||||
/**
|
||||
* 文件菜单：查看 / 比较 / 历史 + 本地工作区动作，按挂起状态控制可用性。
|
||||
* pendingAdd 文件不展示服务器比较与历史入口；pendingEdit 禁止直接 Get Latest 覆盖。
|
||||
*/
|
||||
function buildFileItemMenu(target: FileTarget): FileMenuItem[][] {
|
||||
const sections: FileMenuItem[][] = []
|
||||
const pending = target.pendingStatus
|
||||
const isPendingAdd = pending === "pendingAdd"
|
||||
|
||||
const viewActions: FileMenuItem[] = [
|
||||
{ id: "viewFile", label: "查看文件", enabled: true },
|
||||
]
|
||||
if (!isPendingAdd) {
|
||||
viewActions.push({
|
||||
id: "diffLocalLatest",
|
||||
label: "与最新版本比较",
|
||||
enabled: target.mapped,
|
||||
reason: target.mapped ? undefined : NOT_MAPPED_REASON,
|
||||
})
|
||||
viewActions.push({ id: "history", label: "查看历史", enabled: true })
|
||||
}
|
||||
sections.push(viewActions)
|
||||
|
||||
// Pending Changes 列表项以撤销为主，不再重复签出 / 删除入口。
|
||||
if (target.source === "pending") {
|
||||
sections.push([
|
||||
{ id: "undo", label: "撤销更改", enabled: true, danger: true },
|
||||
])
|
||||
return sections
|
||||
}
|
||||
|
||||
const workspaceActions: FileMenuItem[] = [
|
||||
{
|
||||
// 安全模式获取：本地改动会产生冲突而不会被覆盖，挂起状态下也允许执行。
|
||||
id: "getLatest",
|
||||
label: "获取最新",
|
||||
enabled: target.mapped,
|
||||
reason: target.mapped ? undefined : NOT_MAPPED_REASON,
|
||||
},
|
||||
{
|
||||
id: "forceGetLatest",
|
||||
label: "强制获取最新…",
|
||||
enabled: target.mapped,
|
||||
danger: true,
|
||||
reason: target.mapped ? undefined : NOT_MAPPED_REASON,
|
||||
},
|
||||
{
|
||||
id: "checkout",
|
||||
label: "签出编辑",
|
||||
enabled: target.mapped && pending == null,
|
||||
reason: !target.mapped
|
||||
? NOT_MAPPED_REASON
|
||||
: pending === "pendingEdit"
|
||||
? "已签出"
|
||||
: pending != null
|
||||
? "存在挂起更改"
|
||||
: undefined,
|
||||
},
|
||||
{
|
||||
id: "delete",
|
||||
label: "挂起删除",
|
||||
enabled: target.mapped && pending !== "pendingDelete",
|
||||
danger: true,
|
||||
reason: !target.mapped
|
||||
? NOT_MAPPED_REASON
|
||||
: pending === "pendingDelete"
|
||||
? "已挂起删除"
|
||||
: undefined,
|
||||
},
|
||||
{
|
||||
id: "undo",
|
||||
label: "撤销更改",
|
||||
enabled: pending != null,
|
||||
reason: pending == null ? "没有挂起更改" : undefined,
|
||||
},
|
||||
]
|
||||
sections.push(workspaceActions)
|
||||
|
||||
return sections
|
||||
}
|
||||
@@ -1,24 +0,0 @@
|
||||
export { SERVER_ROOT_PATH } from "./session"
|
||||
export type { WorkspaceSession } from "./session"
|
||||
export {
|
||||
getAncestorPaths,
|
||||
getParentPath,
|
||||
isSameOrUnderPath,
|
||||
normalizeServerPath,
|
||||
} from "./path"
|
||||
export { findMapping, resolveLocalPath } from "./mapping"
|
||||
export {
|
||||
STATUS_BADGE_CLASSES,
|
||||
STATUS_LABELS,
|
||||
resolveItemLocalState,
|
||||
statusBadgeClass,
|
||||
statusLabel,
|
||||
} from "./status"
|
||||
export type { ItemLocalState } from "./status"
|
||||
export { buildFileMenu, makeFileTarget } from "./actions"
|
||||
export type {
|
||||
FileActionId,
|
||||
FileMenuItem,
|
||||
FileTarget,
|
||||
FileTargetSource,
|
||||
} from "./actions"
|
||||
@@ -1,45 +0,0 @@
|
||||
import type { MappingInfo } from "~/lib/api"
|
||||
|
||||
import { isSameOrUnderPath, normalizeServerPath } from "./path"
|
||||
|
||||
/**
|
||||
* 按最长前缀匹配查找服务端路径所属的 Mapping，未命中返回 null。
|
||||
*/
|
||||
export function findMapping(
|
||||
mappings: MappingInfo[],
|
||||
serverPath: string,
|
||||
): MappingInfo | null {
|
||||
const target = normalizeServerPath(serverPath)
|
||||
let matched: MappingInfo | null = null
|
||||
for (const mapping of mappings) {
|
||||
if (isSameOrUnderPath(mapping.serverPath, target)) {
|
||||
if (!matched || mapping.serverPath.length > matched.serverPath.length) {
|
||||
matched = mapping
|
||||
}
|
||||
}
|
||||
}
|
||||
return matched
|
||||
}
|
||||
|
||||
/**
|
||||
* 依据 Mapping 推导服务端路径对应的本地路径，未映射返回 null。
|
||||
*/
|
||||
export function resolveLocalPath(
|
||||
mappings: MappingInfo[],
|
||||
serverPath: string,
|
||||
): string | null {
|
||||
const target = normalizeServerPath(serverPath)
|
||||
const mapping = findMapping(mappings, target)
|
||||
if (!mapping) {
|
||||
return null
|
||||
}
|
||||
const base = normalizeServerPath(mapping.serverPath)
|
||||
if (target === base) {
|
||||
return mapping.localPath
|
||||
}
|
||||
const suffix = target.slice(base.length === 2 ? base.length : base.length + 1)
|
||||
const localBase = mapping.localPath.endsWith("/")
|
||||
? mapping.localPath.slice(0, -1)
|
||||
: mapping.localPath
|
||||
return `${localBase}/${suffix}`
|
||||
}
|
||||
@@ -1,52 +0,0 @@
|
||||
import { SERVER_ROOT_PATH } from "./session"
|
||||
|
||||
/**
|
||||
* 规范化服务端路径：去掉末尾斜杠（根路径 `$/` 除外）。
|
||||
*/
|
||||
export function normalizeServerPath(serverPath: string): string {
|
||||
let result = serverPath.trim()
|
||||
while (result.length > SERVER_ROOT_PATH.length && result.endsWith("/")) {
|
||||
result = result.slice(0, -1)
|
||||
}
|
||||
return result.length === 0 ? SERVER_ROOT_PATH : result
|
||||
}
|
||||
|
||||
/**
|
||||
* 取服务端路径的父路径，根路径返回自身。
|
||||
*/
|
||||
export function getParentPath(serverPath: string): string {
|
||||
const normalized = normalizeServerPath(serverPath)
|
||||
if (normalized === SERVER_ROOT_PATH || normalized === "$") {
|
||||
return SERVER_ROOT_PATH
|
||||
}
|
||||
const index = normalized.lastIndexOf("/")
|
||||
const parent = normalized.slice(0, index)
|
||||
return parent === "$" ? SERVER_ROOT_PATH : parent
|
||||
}
|
||||
|
||||
/**
|
||||
* 按从根到父目录的顺序返回路径的全部祖先（不含自身），用于树的同步展开。
|
||||
*/
|
||||
export function getAncestorPaths(serverPath: string): string[] {
|
||||
const normalized = normalizeServerPath(serverPath)
|
||||
const ancestors: string[] = []
|
||||
let current = normalized
|
||||
while (current !== SERVER_ROOT_PATH) {
|
||||
current = getParentPath(current)
|
||||
ancestors.unshift(current)
|
||||
}
|
||||
return ancestors
|
||||
}
|
||||
|
||||
/**
|
||||
* 判断 childPath 是否等于 basePath 或位于其子树内。
|
||||
*/
|
||||
export function isSameOrUnderPath(basePath: string, childPath: string): boolean {
|
||||
const base = normalizeServerPath(basePath)
|
||||
const child = normalizeServerPath(childPath)
|
||||
if (base === child) {
|
||||
return true
|
||||
}
|
||||
const prefix = base === SERVER_ROOT_PATH ? base : `${base}/`
|
||||
return child.startsWith(prefix)
|
||||
}
|
||||
@@ -1,12 +0,0 @@
|
||||
import type { MappingInfo } from "~/lib/api"
|
||||
|
||||
// 服务端目录树根路径，工作台导航的默认起点。
|
||||
export const SERVER_ROOT_PATH = "$/"
|
||||
|
||||
// 工作台进入后固定的共享上下文，serverUri / collection / workspace 不再在台内切换。
|
||||
export interface WorkspaceSession {
|
||||
serverUri: string
|
||||
collection: string
|
||||
workspace: string
|
||||
mappings: MappingInfo[]
|
||||
}
|
||||
@@ -1,73 +0,0 @@
|
||||
// 状态文案与表现的统一收口：目录对比、挂起更改、文件列表均从这里取文案与配色。
|
||||
|
||||
// 业务状态对应的中文文案。
|
||||
export const STATUS_LABELS: Record<string, string> = {
|
||||
localModified: "本地已修改",
|
||||
remoteChanged: "服务器已更新",
|
||||
bothChanged: "两端都有修改",
|
||||
localOnly: "仅本地存在",
|
||||
remoteOnly: "仅服务器存在",
|
||||
notDownloaded: "未下载",
|
||||
localDeleted: "本地已删除",
|
||||
pendingEdit: "签出编辑",
|
||||
pendingAdd: "挂起新增",
|
||||
pendingDelete: "挂起删除",
|
||||
pendingRename: "挂起重命名",
|
||||
pending: "挂起更改",
|
||||
upToDate: "最新",
|
||||
notMapped: "未映射",
|
||||
mapped: "已映射",
|
||||
}
|
||||
|
||||
// 业务状态对应的 badge 配色（Tailwind class），按 Agents.md 状态色规则。
|
||||
export const STATUS_BADGE_CLASSES: Record<string, string> = {
|
||||
localModified: "bg-blue-500/10 text-blue-700 dark:text-blue-400",
|
||||
remoteChanged: "bg-violet-500/10 text-violet-700 dark:text-violet-400",
|
||||
bothChanged: "bg-red-500/15 text-red-700 dark:text-red-400",
|
||||
localOnly: "bg-green-500/10 text-green-700 dark:text-green-400",
|
||||
remoteOnly: "bg-violet-500/10 text-violet-700 dark:text-violet-400",
|
||||
notDownloaded: "bg-amber-500/10 text-amber-700 dark:text-amber-400",
|
||||
localDeleted: "bg-red-500/10 text-red-700 dark:text-red-400",
|
||||
pendingEdit: "bg-blue-500/10 text-blue-700 dark:text-blue-400",
|
||||
pendingAdd: "bg-green-500/10 text-green-700 dark:text-green-400",
|
||||
pendingDelete: "bg-red-500/10 text-red-700 dark:text-red-400",
|
||||
pendingRename: "bg-blue-500/10 text-blue-700 dark:text-blue-400",
|
||||
pending: "bg-blue-500/10 text-blue-700 dark:text-blue-400",
|
||||
upToDate: "bg-muted text-muted-foreground",
|
||||
notMapped: "bg-muted text-muted-foreground",
|
||||
mapped: "bg-muted text-foreground/80",
|
||||
}
|
||||
|
||||
/**
|
||||
* 取状态的中文文案，未知状态原样返回。
|
||||
*/
|
||||
export function statusLabel(status: string): string {
|
||||
return STATUS_LABELS[status] ?? status
|
||||
}
|
||||
|
||||
/**
|
||||
* 取状态 badge 的配色 class，未知状态用中性灰。
|
||||
*/
|
||||
export function statusBadgeClass(status: string): string {
|
||||
return STATUS_BADGE_CLASSES[status] ?? "bg-muted text-muted-foreground"
|
||||
}
|
||||
|
||||
// 文件列表项的本地映射状态：未映射 / 已映射 / 已映射未下载。
|
||||
export type ItemLocalState = "notMapped" | "mapped" | "notDownloaded"
|
||||
|
||||
/**
|
||||
* 依据 Mapping 命中与本地文件存在性推导列表项的本地状态。
|
||||
* localExists 为 null 表示无法检测（非 Electron 环境），按已映射处理。
|
||||
*/
|
||||
export function resolveItemLocalState(
|
||||
mapped: boolean,
|
||||
localExists: boolean | null,
|
||||
): ItemLocalState {
|
||||
if (!mapped) {
|
||||
return "notMapped"
|
||||
}
|
||||
if (localExists === false) {
|
||||
return "notDownloaded"
|
||||
}
|
||||
return "mapped"
|
||||
}
|
||||
@@ -4,15 +4,3 @@ import { twMerge } from "tailwind-merge"
|
||||
export function cn(...inputs: ClassValue[]) {
|
||||
return twMerge(clsx(inputs))
|
||||
}
|
||||
|
||||
/**
|
||||
* 把毫秒时间戳格式化为 `YYYY-MM-DD HH:mm`，空值返回占位符。
|
||||
*/
|
||||
export function formatDateTime(value: number | null | undefined): string {
|
||||
if (value == null || value <= 0) {
|
||||
return "—"
|
||||
}
|
||||
const date = new Date(value)
|
||||
const pad = (input: number) => String(input).padStart(2, "0")
|
||||
return `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())} ${pad(date.getHours())}:${pad(date.getMinutes())}`
|
||||
}
|
||||
|
||||
+377
-81
@@ -1,112 +1,408 @@
|
||||
import { useCallback, useEffect, useState } from "react"
|
||||
import { useEffect, useState } from "react"
|
||||
import { Loader2 } from "lucide-react"
|
||||
|
||||
import { ConnectView } from "~/components/app/connect-view"
|
||||
import { WorkspaceShell } from "~/components/app/workspace-shell"
|
||||
import { AppShell } from "~/components/app/app-shell"
|
||||
import { Button } from "~/components/ui/button"
|
||||
import { getServiceStatus, isElectron, startService } from "~/lib/electron"
|
||||
import type { ServiceStatus } from "~/lib/electron"
|
||||
import { SERVER_ROOT_PATH } from "~/lib/tfs/session"
|
||||
import type { WorkspaceSession } from "~/lib/tfs/session"
|
||||
import { FolderItemsPanel } from "~/components/explorer/folder-items-panel"
|
||||
import { PendingChangesPanel } from "~/components/inspector/pending-changes-panel"
|
||||
import { ServerTreePanel } from "~/components/explorer/server-tree-panel"
|
||||
import { apiRequest, subscribeApiRequestLogs } from "~/lib/api/client"
|
||||
import type { ApiRequestLogEntry } from "~/lib/api/client"
|
||||
import {
|
||||
connectSession,
|
||||
getConfig,
|
||||
listOperationLogs,
|
||||
} from "~/lib/api/endpoints"
|
||||
import type {
|
||||
ApiResult,
|
||||
AppConfig,
|
||||
ConnectData,
|
||||
HealthData,
|
||||
TfsOperationLogEntry,
|
||||
} from "~/lib/api/types"
|
||||
import type { ServiceStatus } from "~/lib/electron/bridge"
|
||||
import { getMactfsBridge } from "~/lib/electron/bridge"
|
||||
|
||||
// 顶层视图状态：检测服务、服务未就绪、连接入口、已进入工作台。
|
||||
type AppPhase = "checking" | "blocked" | "connect" | "workspace"
|
||||
|
||||
/**
|
||||
* 第一版前端入口：先确保本地服务就绪，再走连接 / Collection / Workspace 流程，
|
||||
* 进入工作台后持有固定上下文，并统一维护左树与中间列表共享的当前路径（FE-004）。
|
||||
*/
|
||||
export default function Home() {
|
||||
const [phase, setPhase] = useState<AppPhase>("checking")
|
||||
const [status, setStatus] = useState<ServiceStatus | null>(null)
|
||||
const [session, setSession] = useState<WorkspaceSession | null>(null)
|
||||
const [selectedServerPath, setSelectedServerPath] = useState(SERVER_ROOT_PATH)
|
||||
|
||||
/**
|
||||
* 检测本地服务，未就绪时在 Electron 环境下尝试自动拉起。
|
||||
*/
|
||||
const bootstrap = useCallback(async () => {
|
||||
setPhase("checking")
|
||||
let next = await getServiceStatus()
|
||||
if (!next.running && isElectron()) {
|
||||
next = await startService()
|
||||
interface ServiceViewState {
|
||||
loading: boolean
|
||||
serviceStatus?: ServiceStatus
|
||||
healthResult?: ApiResult<HealthData>
|
||||
errorMessage?: string
|
||||
}
|
||||
setStatus(next)
|
||||
setPhase(next.running ? "connect" : "blocked")
|
||||
|
||||
interface ConnectionForm {
|
||||
serverUri: string
|
||||
authType: string
|
||||
domain: string
|
||||
username: string
|
||||
password: string
|
||||
}
|
||||
|
||||
const EMPTY_CONNECTION_FORM: ConnectionForm = {
|
||||
serverUri: "",
|
||||
authType: "ntlm-explicit",
|
||||
domain: "",
|
||||
username: "",
|
||||
password: "",
|
||||
}
|
||||
|
||||
/**
|
||||
* 将后端配置转换为表单可直接使用的字符串结构，避免受缺省字段影响。
|
||||
*/
|
||||
function toConnectionForm(config?: AppConfig): ConnectionForm {
|
||||
return {
|
||||
serverUri: config?.serverUri || "",
|
||||
authType: config?.authType || "ntlm-explicit",
|
||||
domain: config?.domain || "",
|
||||
username: config?.username || "",
|
||||
password: config?.password || "",
|
||||
}
|
||||
}
|
||||
|
||||
export default function Home() {
|
||||
const [state, setState] = useState<ServiceViewState>({
|
||||
loading: true,
|
||||
})
|
||||
const [form, setForm] = useState<ConnectionForm>(EMPTY_CONNECTION_FORM)
|
||||
const [connecting, setConnecting] = useState(false)
|
||||
const [connected, setConnected] = useState(false)
|
||||
const [connectResult, setConnectResult] = useState<ConnectData>()
|
||||
const [preferredCollection, setPreferredCollection] = useState("")
|
||||
const [selectedCollection, setSelectedCollection] = useState("")
|
||||
const [selectedServerPath, setSelectedServerPath] = useState("")
|
||||
const [pendingRefreshKey, setPendingRefreshKey] = useState(0)
|
||||
const [workspaceActionKey, setWorkspaceActionKey] = useState("")
|
||||
const [selectedMappedItem, setSelectedMappedItem] = useState(false)
|
||||
const [operationLogs, setOperationLogs] = useState<ApiRequestLogEntry[]>([])
|
||||
const [operationLogsLoading, setOperationLogsLoading] = useState(false)
|
||||
|
||||
/**
|
||||
* 先确认服务状态，再读取默认配置并验证自动 token 请求。
|
||||
*/
|
||||
async function loadServiceStatus() {
|
||||
setState((currentState) => ({
|
||||
...currentState,
|
||||
loading: true,
|
||||
errorMessage: undefined,
|
||||
}))
|
||||
|
||||
const bridge = getMactfsBridge()
|
||||
if (!bridge) {
|
||||
setState({
|
||||
loading: false,
|
||||
errorMessage:
|
||||
"未检测到 Electron preload，请通过 Electron 启动 macTFS。",
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
const serviceStatus = await bridge.getServiceStatus()
|
||||
const healthResult = serviceStatus.running
|
||||
? await apiRequest<HealthData>("/api/health")
|
||||
: undefined
|
||||
const configResult = serviceStatus.running ? await getConfig() : undefined
|
||||
|
||||
if (configResult?.success) {
|
||||
setForm(toConnectionForm(configResult.data.config))
|
||||
setPreferredCollection(configResult.data.config.collection || "")
|
||||
}
|
||||
|
||||
setState({
|
||||
loading: false,
|
||||
serviceStatus,
|
||||
healthResult,
|
||||
errorMessage: configResult?.success
|
||||
? undefined
|
||||
: configResult?.errorMessage || configResult?.message,
|
||||
})
|
||||
setConnected(Boolean(healthResult?.data.connected))
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
return subscribeApiRequestLogs(upsertOperationLog)
|
||||
}, [])
|
||||
|
||||
useEffect(() => {
|
||||
void bootstrap()
|
||||
}, [bootstrap])
|
||||
|
||||
/**
|
||||
* 连接流程完成后固定上下文并进入工作台，当前路径重置到根目录。
|
||||
*/
|
||||
const handleReady = useCallback((next: WorkspaceSession) => {
|
||||
setSession(next)
|
||||
setSelectedServerPath(SERVER_ROOT_PATH)
|
||||
setPhase("workspace")
|
||||
loadServiceStatus()
|
||||
}, [])
|
||||
|
||||
/**
|
||||
* 从工作台返回连接入口，重新走连接流程。
|
||||
*/
|
||||
const handleReconnect = useCallback(() => {
|
||||
setSession(null)
|
||||
setPhase("connect")
|
||||
}, [])
|
||||
useEffect(() => {
|
||||
if (connected) {
|
||||
loadOperationLogs()
|
||||
}
|
||||
}, [connected])
|
||||
|
||||
const serviceReady =
|
||||
state.serviceStatus?.running && state.healthResult?.success
|
||||
const canConnect = serviceReady && !state.loading && !connecting
|
||||
const serviceMessage = serviceReady
|
||||
? "本地 API 已连接。"
|
||||
: state.serviceStatus?.message ||
|
||||
state.errorMessage ||
|
||||
"正在检查本地 API 服务。"
|
||||
const requestStatus = state.healthResult?.success
|
||||
? state.healthResult.message
|
||||
: state.healthResult?.errorMessage || state.errorMessage || "等待检查"
|
||||
|
||||
/**
|
||||
* 同步导航：左侧树与中间列表共用的当前服务端路径变更入口。
|
||||
* 更新连接表单字段，保持输入状态与受控表单一致。
|
||||
*/
|
||||
const handleNavigate = useCallback((serverPath: string) => {
|
||||
setSelectedServerPath(serverPath)
|
||||
}, [])
|
||||
function updateFormField(field: keyof ConnectionForm, value: string) {
|
||||
setForm((currentForm) => ({
|
||||
...currentForm,
|
||||
[field]: value,
|
||||
}))
|
||||
}
|
||||
|
||||
/**
|
||||
* Mapping 创建 / 取消后更新固定上下文中的映射列表，浏览位置保持不变。
|
||||
* 调用连接 API，成功后进入已连接工作台状态。
|
||||
*/
|
||||
const handleMappingsChanged = useCallback((mappings: WorkspaceSession["mappings"]) => {
|
||||
setSession((prev) => (prev ? { ...prev, mappings } : prev))
|
||||
}, [])
|
||||
async function handleConnect(event: React.FormEvent<HTMLFormElement>) {
|
||||
event.preventDefault()
|
||||
setConnecting(true)
|
||||
setConnectResult(undefined)
|
||||
setState((currentState) => ({
|
||||
...currentState,
|
||||
errorMessage: undefined,
|
||||
}))
|
||||
|
||||
if (phase === "workspace" && session) {
|
||||
return (
|
||||
<WorkspaceShell
|
||||
session={session}
|
||||
selectedServerPath={selectedServerPath}
|
||||
onNavigate={handleNavigate}
|
||||
onMappingsChanged={handleMappingsChanged}
|
||||
onReconnect={handleReconnect}
|
||||
/>
|
||||
const result = await connectSession(form)
|
||||
setConnecting(false)
|
||||
|
||||
if (!result.success) {
|
||||
setState((currentState) => ({
|
||||
...currentState,
|
||||
errorMessage: result.errorMessage || result.message,
|
||||
}))
|
||||
return
|
||||
}
|
||||
|
||||
setConnected(true)
|
||||
setConnectResult(result.data)
|
||||
}
|
||||
|
||||
/**
|
||||
* 触发右侧 Pending Changes 面板重新查询当前 Workspace 状态。
|
||||
*/
|
||||
function refreshPendingChanges() {
|
||||
setPendingRefreshKey((currentKey) => currentKey + 1)
|
||||
}
|
||||
|
||||
/**
|
||||
* 切换主工作区当前路径，并清理上一目录的选中项状态。
|
||||
*/
|
||||
function selectServerPath(path: string) {
|
||||
setSelectedMappedItem(false)
|
||||
setSelectedServerPath(path)
|
||||
}
|
||||
|
||||
/**
|
||||
* 触发中间工作区文件操作，顶部工具栏和底部操作区复用同一套执行逻辑。
|
||||
*/
|
||||
function runWorkspaceAction(action: string) {
|
||||
setWorkspaceActionKey(`${action}:${Date.now()}`)
|
||||
}
|
||||
|
||||
/**
|
||||
* 合并统一 API client 推送的请求日志，保留最近 80 条。
|
||||
*/
|
||||
function upsertOperationLog(entry: ApiRequestLogEntry) {
|
||||
setOperationLogs((currentLogs) =>
|
||||
[entry, ...currentLogs.filter((log) => log.id !== entry.id)].slice(0, 80)
|
||||
)
|
||||
}
|
||||
|
||||
if (phase === "connect") {
|
||||
return <ConnectView onReady={handleReady} />
|
||||
/**
|
||||
* 从服务端读取最近操作日志，补齐当前 UI 会话之前的 API 操作记录。
|
||||
*/
|
||||
async function loadOperationLogs() {
|
||||
setOperationLogsLoading(true)
|
||||
const result = await listOperationLogs()
|
||||
setOperationLogsLoading(false)
|
||||
|
||||
if (!result.success) {
|
||||
return
|
||||
}
|
||||
|
||||
const serverLogs = result.data.logs.map(toOperationLog).reverse()
|
||||
setOperationLogs((currentLogs) => [
|
||||
...currentLogs.filter((log) => log.status === "running"),
|
||||
...serverLogs,
|
||||
].slice(0, 80))
|
||||
}
|
||||
|
||||
/**
|
||||
* 将后端操作日志转换成底部 Console 的展示结构。
|
||||
*/
|
||||
function toOperationLog(
|
||||
entry: TfsOperationLogEntry,
|
||||
index: number
|
||||
): ApiRequestLogEntry {
|
||||
return {
|
||||
id: `server:${entry.startedAt}:${entry.operation}:${index}`,
|
||||
operation: entry.operation,
|
||||
summary: entry.summary || "-",
|
||||
startedAt: entry.startedAt,
|
||||
endedAt: entry.endedAt,
|
||||
durationMs: entry.durationMs,
|
||||
success: entry.success,
|
||||
errorMessage: entry.errorMessage,
|
||||
status: entry.success ? "success" : "error",
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="flex min-h-svh items-center justify-center bg-muted/40 p-6">
|
||||
<div className="w-full max-w-md rounded-lg border bg-background p-6 shadow-sm">
|
||||
<h1 className="text-base font-semibold">macTFS</h1>
|
||||
<p className="mt-1 text-sm text-muted-foreground">本地源码管理工作台</p>
|
||||
<div className="min-h-svh bg-muted/40 p-4 text-sm">
|
||||
<AppShell
|
||||
connected={connected}
|
||||
serviceReady={Boolean(serviceReady)}
|
||||
serviceLoading={state.loading}
|
||||
serverUri={connectResult?.serverUri || form.serverUri}
|
||||
username={form.username}
|
||||
collectionCount={connectResult?.collectionCount}
|
||||
serviceBaseUrl={state.serviceStatus?.baseUrl}
|
||||
tokenFile={state.serviceStatus?.tokenFile}
|
||||
serviceMessage={serviceMessage}
|
||||
requestStatus={requestStatus}
|
||||
operationLogs={operationLogs}
|
||||
operationLogsLoading={operationLogsLoading}
|
||||
workspaceGetLatestEnabled={connected && selectedMappedItem}
|
||||
workspaceHistoryEnabled={connected && Boolean(selectedServerPath)}
|
||||
sourceList={
|
||||
<ServerTreePanel
|
||||
connected={connected}
|
||||
preferredCollection={preferredCollection}
|
||||
onCollectionSelect={setSelectedCollection}
|
||||
onPathSelect={selectServerPath}
|
||||
/>
|
||||
}
|
||||
inspector={
|
||||
<PendingChangesPanel
|
||||
connected={connected}
|
||||
collection={selectedCollection}
|
||||
refreshKey={pendingRefreshKey}
|
||||
/>
|
||||
}
|
||||
onRefreshService={loadServiceStatus}
|
||||
onRefreshOperationLogs={loadOperationLogs}
|
||||
onWorkspaceGetLatest={() => runWorkspaceAction("getLatest")}
|
||||
onWorkspaceHistory={() => runWorkspaceAction("history")}
|
||||
>
|
||||
{connected ? (
|
||||
<FolderItemsPanel
|
||||
connected={connected}
|
||||
collection={selectedCollection}
|
||||
serverPath={selectedServerPath}
|
||||
actionKey={workspaceActionKey}
|
||||
onPendingChangesRefresh={refreshPendingChanges}
|
||||
onPathEnter={selectServerPath}
|
||||
onSelectedMappedItemChange={setSelectedMappedItem}
|
||||
/>
|
||||
) : (
|
||||
<div className="mx-auto grid w-full max-w-2xl gap-5 p-5">
|
||||
<div className="min-w-0">
|
||||
<h1 className="text-base font-medium">连接 TFS</h1>
|
||||
<p className="mt-1 text-muted-foreground">
|
||||
{serviceReady ? "本地 API 已就绪。" : serviceMessage}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{phase === "checking" && (
|
||||
<p className="mt-4 text-sm text-muted-foreground">正在检查本地服务…</p>
|
||||
<form className="grid gap-4" onSubmit={handleConnect}>
|
||||
<label className="grid gap-1.5">
|
||||
<span className="text-xs font-medium text-muted-foreground">
|
||||
TFS 地址
|
||||
</span>
|
||||
<input
|
||||
className="h-8 rounded-[6px] border bg-background px-2 font-mono text-sm outline-none focus-visible:ring-2 focus-visible:ring-ring/40"
|
||||
value={form.serverUri}
|
||||
required
|
||||
placeholder="http://tfs.example.com:8080/tfs/"
|
||||
onChange={(event) =>
|
||||
updateFormField("serverUri", event.target.value)
|
||||
}
|
||||
/>
|
||||
</label>
|
||||
|
||||
<div className="grid gap-4 md:grid-cols-2">
|
||||
<label className="grid gap-1.5">
|
||||
<span className="text-xs font-medium text-muted-foreground">
|
||||
认证方式
|
||||
</span>
|
||||
<select
|
||||
className="h-8 rounded-[6px] border bg-background px-2 text-sm outline-none focus-visible:ring-2 focus-visible:ring-ring/40"
|
||||
value={form.authType}
|
||||
onChange={(event) =>
|
||||
updateFormField("authType", event.target.value)
|
||||
}
|
||||
>
|
||||
<option value="ntlm-explicit">NTLM 显式账号密码</option>
|
||||
</select>
|
||||
</label>
|
||||
|
||||
<label className="grid gap-1.5">
|
||||
<span className="text-xs font-medium text-muted-foreground">
|
||||
域
|
||||
</span>
|
||||
<input
|
||||
className="h-8 rounded-[6px] border bg-background px-2 text-sm outline-none focus-visible:ring-2 focus-visible:ring-ring/40"
|
||||
value={form.domain}
|
||||
placeholder="domain"
|
||||
onChange={(event) =>
|
||||
updateFormField("domain", event.target.value)
|
||||
}
|
||||
/>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div className="grid gap-4 md:grid-cols-2">
|
||||
<label className="grid gap-1.5">
|
||||
<span className="text-xs font-medium text-muted-foreground">
|
||||
用户名
|
||||
</span>
|
||||
<input
|
||||
className="h-8 rounded-[6px] border bg-background px-2 text-sm outline-none focus-visible:ring-2 focus-visible:ring-ring/40"
|
||||
value={form.username}
|
||||
required
|
||||
autoComplete="username"
|
||||
onChange={(event) =>
|
||||
updateFormField("username", event.target.value)
|
||||
}
|
||||
/>
|
||||
</label>
|
||||
|
||||
<label className="grid gap-1.5">
|
||||
<span className="text-xs font-medium text-muted-foreground">
|
||||
密码
|
||||
</span>
|
||||
<input
|
||||
className="h-8 rounded-[6px] border bg-background px-2 text-sm outline-none focus-visible:ring-2 focus-visible:ring-ring/40"
|
||||
type="password"
|
||||
value={form.password}
|
||||
required
|
||||
autoComplete="current-password"
|
||||
onChange={(event) =>
|
||||
updateFormField("password", event.target.value)
|
||||
}
|
||||
/>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
{state.errorMessage && (
|
||||
<div className="rounded-[6px] border border-destructive/30 bg-destructive/10 px-3 py-2 text-destructive">
|
||||
{state.errorMessage}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{phase === "blocked" && (
|
||||
<div className="mt-4 space-y-3 text-sm">
|
||||
<p className="font-medium text-destructive">本地服务未就绪</p>
|
||||
<p className="text-muted-foreground">
|
||||
{status?.error ?? "无法连接本地 API 服务"}
|
||||
</p>
|
||||
<Button size="sm" onClick={() => void bootstrap()}>
|
||||
重试连接
|
||||
<div className="flex justify-end">
|
||||
<Button type="submit" disabled={!canConnect}>
|
||||
{connecting && <Loader2 className="animate-spin" />}
|
||||
连接
|
||||
</Button>
|
||||
</div>
|
||||
)}
|
||||
</form>
|
||||
</div>
|
||||
)}
|
||||
</AppShell>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
+163
-256
@@ -1,264 +1,28 @@
|
||||
const { app, BrowserWindow, ipcMain, dialog } = require("electron")
|
||||
const path = require("node:path")
|
||||
const { app, BrowserWindow, dialog, ipcMain } = require("electron")
|
||||
const { spawn } = require("node:child_process")
|
||||
const fs = require("node:fs")
|
||||
const os = require("node:os")
|
||||
const http = require("node:http")
|
||||
const { spawn } = require("node:child_process")
|
||||
const path = require("node:path")
|
||||
|
||||
const API_HOST = "127.0.0.1"
|
||||
const API_PORT = 38765
|
||||
const API_BASE_URL = `http://${API_HOST}:${API_PORT}`
|
||||
const SERVER_MAIN_CLASS = "com.mydev.mactfs.server.MacTfsServer"
|
||||
const API_BASE_URL = "http://127.0.0.1:38765"
|
||||
const HEALTH_URL = `${API_BASE_URL}/api/health`
|
||||
const TOKEN_FILE = path.join(os.homedir(), ".mactfs", "server-token")
|
||||
const HEALTH_TIMEOUT_MS = 2000
|
||||
const START_POLL_TIMES = 30
|
||||
const START_POLL_INTERVAL_MS = 1000
|
||||
|
||||
// 记录由本进程拉起的服务端子进程，便于应用退出时回收。
|
||||
let serverProcess = null
|
||||
|
||||
/**
|
||||
* 计算项目根目录，main.cjs 位于 mactfsui/electron 下，上溯两级即为单仓库根目录。
|
||||
*/
|
||||
function resolveProjectRoot() {
|
||||
return path.resolve(__dirname, "..", "..")
|
||||
}
|
||||
|
||||
/**
|
||||
* 解析运行服务端使用的 Java 可执行文件，优先项目内置 zulu8，其次 JAVA_HOME，最后 PATH 上的 java。
|
||||
*/
|
||||
function resolveJavaBin() {
|
||||
const projectRoot = resolveProjectRoot()
|
||||
const bundled = path.join(
|
||||
projectRoot,
|
||||
"zulu8.94.0.17-ca-jdk8.0.492-macosx_x64",
|
||||
"Contents",
|
||||
"Home",
|
||||
"bin",
|
||||
"java",
|
||||
)
|
||||
if (fs.existsSync(bundled)) {
|
||||
return bundled
|
||||
}
|
||||
if (process.env.JAVA_HOME) {
|
||||
const fromHome = path.join(process.env.JAVA_HOME, "bin", "java")
|
||||
if (fs.existsSync(fromHome)) {
|
||||
return fromHome
|
||||
}
|
||||
}
|
||||
return "java"
|
||||
}
|
||||
|
||||
/**
|
||||
* 解析服务端 classpath，优先使用 application 安装包 lib 目录（已包含全部运行依赖）。
|
||||
*/
|
||||
function resolveServerClasspath() {
|
||||
const installLib = path.join(
|
||||
resolveProjectRoot(),
|
||||
"mactfs",
|
||||
"build",
|
||||
"install",
|
||||
"mactfs",
|
||||
"lib",
|
||||
)
|
||||
if (fs.existsSync(installLib)) {
|
||||
return path.join(installLib, "*")
|
||||
}
|
||||
return null
|
||||
}
|
||||
|
||||
/**
|
||||
* 解析 TFS native 库目录，供 SDK 加载 JNI 库。
|
||||
*/
|
||||
function resolveNativeDirectory() {
|
||||
const projectRoot = resolveProjectRoot()
|
||||
const installNative = path.join(
|
||||
projectRoot,
|
||||
"mactfs",
|
||||
"build",
|
||||
"install",
|
||||
"mactfs",
|
||||
"lib",
|
||||
"native",
|
||||
)
|
||||
if (fs.existsSync(installNative)) {
|
||||
return installNative
|
||||
}
|
||||
const libNative = path.join(projectRoot, "tfsIntegration", "lib", "native")
|
||||
if (fs.existsSync(libNative)) {
|
||||
return libNative
|
||||
}
|
||||
return null
|
||||
}
|
||||
|
||||
/**
|
||||
* 读取本地 Bearer Token，渲染进程不直接访问 token 文件，统一由主进程提供。
|
||||
*/
|
||||
function readToken() {
|
||||
try {
|
||||
const value = fs.readFileSync(TOKEN_FILE, "utf8").trim()
|
||||
return value.length > 0 ? value : null
|
||||
} catch (error) {
|
||||
return null
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 延时辅助函数，用于轮询等待服务端就绪。
|
||||
*/
|
||||
function delay(ms) {
|
||||
return new Promise((resolve) => setTimeout(resolve, ms))
|
||||
}
|
||||
|
||||
/**
|
||||
* 调用 /api/health 检查本地服务是否就绪，返回结构化服务状态。
|
||||
*/
|
||||
function checkHealth() {
|
||||
return new Promise((resolve) => {
|
||||
const token = readToken()
|
||||
const base = {
|
||||
running: false,
|
||||
baseUrl: API_BASE_URL,
|
||||
tokenAvailable: token != null,
|
||||
health: null,
|
||||
error: null,
|
||||
}
|
||||
if (!token) {
|
||||
resolve({ ...base, error: "未找到本地服务 token，服务可能尚未启动" })
|
||||
return
|
||||
}
|
||||
const request = http.request(
|
||||
`${API_BASE_URL}/api/health`,
|
||||
{
|
||||
method: "GET",
|
||||
headers: { Authorization: `Bearer ${token}` },
|
||||
timeout: HEALTH_TIMEOUT_MS,
|
||||
},
|
||||
(response) => {
|
||||
let raw = ""
|
||||
response.on("data", (chunk) => {
|
||||
raw += chunk
|
||||
})
|
||||
response.on("end", () => {
|
||||
if (response.statusCode !== 200) {
|
||||
resolve({ ...base, error: `服务返回状态码 ${response.statusCode}` })
|
||||
return
|
||||
}
|
||||
try {
|
||||
const payload = JSON.parse(raw)
|
||||
resolve({
|
||||
...base,
|
||||
running: payload.success === true,
|
||||
health: payload.data || null,
|
||||
})
|
||||
} catch (error) {
|
||||
resolve({ ...base, error: "服务健康检查响应解析失败" })
|
||||
}
|
||||
})
|
||||
},
|
||||
)
|
||||
request.on("timeout", () => {
|
||||
request.destroy()
|
||||
resolve({ ...base, error: "服务健康检查超时" })
|
||||
})
|
||||
request.on("error", (error) => {
|
||||
resolve({ ...base, error: `无法连接本地服务：${error.message}` })
|
||||
})
|
||||
request.end()
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 按本地开发约定拉起 mactfs-server，并轮询等待服务就绪。
|
||||
*/
|
||||
async function startService() {
|
||||
const current = await checkHealth()
|
||||
if (current.running) {
|
||||
return current
|
||||
}
|
||||
const classpath = resolveServerClasspath()
|
||||
if (!classpath) {
|
||||
return {
|
||||
...current,
|
||||
error:
|
||||
"未找到服务端构建产物，请先在 mactfs 目录执行 ../tfsIntegration/gradlew installDist",
|
||||
}
|
||||
}
|
||||
if (!serverProcess || serverProcess.exitCode !== null) {
|
||||
const args = ["-cp", classpath]
|
||||
const nativeDirectory = resolveNativeDirectory()
|
||||
if (nativeDirectory) {
|
||||
args.push(`-Dcom.microsoft.tfs.jni.native.base-directory=${nativeDirectory}`)
|
||||
}
|
||||
args.push(SERVER_MAIN_CLASS)
|
||||
serverProcess = spawn(resolveJavaBin(), args, {
|
||||
cwd: path.join(resolveProjectRoot(), "mactfs"),
|
||||
stdio: "ignore",
|
||||
})
|
||||
serverProcess.on("exit", () => {
|
||||
serverProcess = null
|
||||
})
|
||||
}
|
||||
for (let attempt = 0; attempt < START_POLL_TIMES; attempt += 1) {
|
||||
await delay(START_POLL_INTERVAL_MS)
|
||||
const status = await checkHealth()
|
||||
if (status.running) {
|
||||
return status
|
||||
}
|
||||
}
|
||||
return {
|
||||
...current,
|
||||
error: "服务启动超时，请检查 JDK 与服务端构建产物",
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 批量检测本地绝对路径是否存在，供渲染层展示“已映射未下载”状态。
|
||||
*/
|
||||
function pathsExist(paths) {
|
||||
const result = {}
|
||||
if (!Array.isArray(paths)) {
|
||||
return result
|
||||
}
|
||||
for (const target of paths) {
|
||||
if (typeof target === "string" && target.length > 0) {
|
||||
result[target] = fs.existsSync(target)
|
||||
}
|
||||
}
|
||||
return result
|
||||
}
|
||||
|
||||
/**
|
||||
* 注册渲染进程通过 preload 调用的窄接口，集中暴露 token、服务状态与目录选择能力。
|
||||
*/
|
||||
function registerIpcHandlers() {
|
||||
ipcMain.handle("mactfs:get-api-base-url", () => API_BASE_URL)
|
||||
ipcMain.handle("mactfs:get-token", () => readToken())
|
||||
ipcMain.handle("mactfs:get-service-status", () => checkHealth())
|
||||
ipcMain.handle("mactfs:start-service", () => startService())
|
||||
ipcMain.handle("mactfs:select-directory", async () => {
|
||||
const result = await dialog.showOpenDialog({
|
||||
properties: ["openDirectory", "createDirectory"],
|
||||
})
|
||||
if (result.canceled || result.filePaths.length === 0) {
|
||||
return null
|
||||
}
|
||||
return result.filePaths[0]
|
||||
})
|
||||
ipcMain.handle("mactfs:paths-exist", (event, paths) => pathsExist(paths))
|
||||
}
|
||||
const MACTFS_DIRECTORY = path.resolve(__dirname, "../../mactfs")
|
||||
const GRADLE_WRAPPER = path.resolve(__dirname, "../../tfsIntegration/gradlew")
|
||||
let serviceStartAttempted = false
|
||||
let serviceStartError = ""
|
||||
|
||||
/**
|
||||
* 创建 Electron 主窗口，开发环境加载本地服务，生产环境加载构建后的静态页面。
|
||||
*/
|
||||
function createWindow() {
|
||||
const mainWindow = new BrowserWindow({
|
||||
width: 1280,
|
||||
height: 840,
|
||||
width: 1200,
|
||||
height: 800,
|
||||
webPreferences: {
|
||||
preload: path.join(__dirname, "preload.cjs"),
|
||||
contextIsolation: true,
|
||||
nodeIntegration: false,
|
||||
preload: path.join(__dirname, "preload.cjs"),
|
||||
},
|
||||
})
|
||||
|
||||
@@ -270,8 +34,159 @@ function createWindow() {
|
||||
mainWindow.loadFile(path.join(__dirname, "../build/client/index.html"))
|
||||
}
|
||||
|
||||
/**
|
||||
* 读取 Java API 服务生成的本地 Bearer token，供 preload 和 health 检查复用。
|
||||
*/
|
||||
function readServerToken() {
|
||||
if (!fs.existsSync(TOKEN_FILE)) {
|
||||
return ""
|
||||
}
|
||||
|
||||
return fs.readFileSync(TOKEN_FILE, "utf8").trim()
|
||||
}
|
||||
|
||||
/**
|
||||
* 调用本地 API health 接口，确认服务、token 和连接状态是否可用。
|
||||
*/
|
||||
async function checkServiceHealth() {
|
||||
const token = readServerToken()
|
||||
if (!token) {
|
||||
return {
|
||||
baseUrl: API_BASE_URL,
|
||||
running: false,
|
||||
connected: false,
|
||||
message: "未找到本地 API token，正在尝试启动服务。",
|
||||
tokenFile: TOKEN_FILE,
|
||||
}
|
||||
}
|
||||
|
||||
try {
|
||||
const response = await fetch(HEALTH_URL, {
|
||||
headers: {
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
})
|
||||
const result = await response.json()
|
||||
|
||||
if (!response.ok || !result.success) {
|
||||
return {
|
||||
baseUrl: API_BASE_URL,
|
||||
running: false,
|
||||
connected: false,
|
||||
message:
|
||||
result.errorMessage || result.message || "本地 API health 检查失败。",
|
||||
tokenFile: TOKEN_FILE,
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
baseUrl: API_BASE_URL,
|
||||
running: true,
|
||||
connected: Boolean(result.data.connected),
|
||||
message: result.message || "ok",
|
||||
tokenFile: result.data.tokenFile || TOKEN_FILE,
|
||||
configFile: result.data.configFile,
|
||||
}
|
||||
} catch (error) {
|
||||
return {
|
||||
baseUrl: API_BASE_URL,
|
||||
running: false,
|
||||
connected: false,
|
||||
message: error instanceof Error ? error.message : "本地 API 服务未响应。",
|
||||
tokenFile: TOKEN_FILE,
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 在开发环境下通过已有 Gradle runServer 任务拉起本地 Java API 服务。
|
||||
*/
|
||||
function startLocalService() {
|
||||
if (serviceStartAttempted) {
|
||||
return
|
||||
}
|
||||
|
||||
serviceStartAttempted = true
|
||||
if (!fs.existsSync(GRADLE_WRAPPER)) {
|
||||
serviceStartError = `未找到 Gradle 启动脚本：${GRADLE_WRAPPER}`
|
||||
return
|
||||
}
|
||||
|
||||
const child = spawn(GRADLE_WRAPPER, ["runServer"], {
|
||||
cwd: MACTFS_DIRECTORY,
|
||||
detached: true,
|
||||
stdio: "ignore",
|
||||
})
|
||||
|
||||
child.on("error", (error) => {
|
||||
serviceStartError = error.message
|
||||
})
|
||||
child.unref()
|
||||
}
|
||||
|
||||
/**
|
||||
* 等待一小段时间后重试 health，用于覆盖 Java 服务启动过程。
|
||||
*/
|
||||
function delay(ms) {
|
||||
return new Promise((resolve) => {
|
||||
setTimeout(resolve, ms)
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 确保本地 API 服务可用；未运行时先启动，再轮询 health 返回最终状态。
|
||||
*/
|
||||
async function ensureServiceStatus() {
|
||||
let status = await checkServiceHealth()
|
||||
if (status.running) {
|
||||
return status
|
||||
}
|
||||
|
||||
startLocalService()
|
||||
for (let index = 0; index < 30; index += 1) {
|
||||
await delay(1000)
|
||||
status = await checkServiceHealth()
|
||||
if (status.running) {
|
||||
return {
|
||||
...status,
|
||||
started: true,
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
...status,
|
||||
started: serviceStartAttempted,
|
||||
message:
|
||||
serviceStartError ||
|
||||
"本地 API 服务未就绪，请确认 Java 8、Gradle 和 TFS 依赖可用。",
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 打开系统目录选择器，返回用户选择的本地目录。
|
||||
*/
|
||||
async function selectDirectory() {
|
||||
const window = BrowserWindow.getFocusedWindow()
|
||||
const result = await dialog.showOpenDialog(window || undefined, {
|
||||
properties: ["openDirectory", "createDirectory"],
|
||||
})
|
||||
|
||||
return result.canceled ? null : result.filePaths[0]
|
||||
}
|
||||
|
||||
/**
|
||||
* 注册 renderer 可调用的最小 Electron 桥接接口。
|
||||
*/
|
||||
function registerIpcHandlers() {
|
||||
ipcMain.handle("mactfs:get-token", () => readServerToken())
|
||||
ipcMain.handle("mactfs:get-service-status", () => ensureServiceStatus())
|
||||
ipcMain.handle("mactfs:select-directory", () => selectDirectory())
|
||||
}
|
||||
|
||||
app.whenReady().then(() => {
|
||||
registerIpcHandlers()
|
||||
ensureServiceStatus()
|
||||
createWindow()
|
||||
|
||||
app.on("activate", () => {
|
||||
@@ -286,11 +201,3 @@ app.on("window-all-closed", () => {
|
||||
app.quit()
|
||||
}
|
||||
})
|
||||
|
||||
// 应用退出时回收由本进程拉起的服务端，避免遗留孤儿进程。
|
||||
app.on("will-quit", () => {
|
||||
if (serverProcess && serverProcess.exitCode === null) {
|
||||
serverProcess.kill()
|
||||
serverProcess = null
|
||||
}
|
||||
})
|
||||
|
||||
@@ -1,42 +1,28 @@
|
||||
const { contextBridge, ipcRenderer } = require("electron")
|
||||
|
||||
// 仅向渲染进程暴露窄接口，渲染层不直接接触 fs、child_process 或 token 文件。
|
||||
contextBridge.exposeInMainWorld("mactfs", {
|
||||
isElectron: true,
|
||||
/**
|
||||
* 获取本地 API 基础地址。
|
||||
* 请求主进程返回本地 API Bearer token。
|
||||
*/
|
||||
getApiBaseUrl() {
|
||||
return ipcRenderer.invoke("mactfs:get-api-base-url")
|
||||
},
|
||||
/**
|
||||
* 获取本地服务 Bearer Token。
|
||||
*/
|
||||
getToken() {
|
||||
function getToken() {
|
||||
return ipcRenderer.invoke("mactfs:get-token")
|
||||
},
|
||||
}
|
||||
|
||||
/**
|
||||
* 查询本地 API 服务当前状态。
|
||||
* 请求主进程确认本地 Java API 服务状态。
|
||||
*/
|
||||
getServiceStatus() {
|
||||
function getServiceStatus() {
|
||||
return ipcRenderer.invoke("mactfs:get-service-status")
|
||||
},
|
||||
}
|
||||
|
||||
/**
|
||||
* 拉起本地 API 服务并等待就绪。
|
||||
* 请求主进程打开本地目录选择器。
|
||||
*/
|
||||
startService() {
|
||||
return ipcRenderer.invoke("mactfs:start-service")
|
||||
},
|
||||
/**
|
||||
* 打开系统目录选择器，返回所选目录路径。
|
||||
*/
|
||||
selectDirectory() {
|
||||
function selectDirectory() {
|
||||
return ipcRenderer.invoke("mactfs:select-directory")
|
||||
},
|
||||
/**
|
||||
* 批量检测本地绝对路径是否存在。
|
||||
*/
|
||||
pathsExist(paths) {
|
||||
return ipcRenderer.invoke("mactfs:paths-exist", paths)
|
||||
},
|
||||
}
|
||||
|
||||
contextBridge.exposeInMainWorld("mactfs", {
|
||||
getToken,
|
||||
getServiceStatus,
|
||||
selectDirectory,
|
||||
})
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
"build": "react-router build",
|
||||
"dev": "react-router dev",
|
||||
"electron": "electron electron/main.cjs",
|
||||
"electron:dev": "concurrently -k \"pnpm dev\" \"NO_PROXY=localhost,127.0.0.1 wait-on http://localhost:5173 && NODE_ENV=development electron electron/main.cjs\"",
|
||||
"electron:dev": "concurrently -k \"pnpm dev\" \"wait-on tcp:5173 && NODE_ENV=development electron electron/main.cjs\"",
|
||||
"start": "pnpm build && pnpm electron",
|
||||
"typecheck": "react-router typegen && tsc",
|
||||
"format": "prettier --write \"**/*.{ts,tsx}\""
|
||||
@@ -19,7 +19,6 @@
|
||||
"clsx": "^2.1.1",
|
||||
"isbot": "^5.1.36",
|
||||
"lucide-react": "^1.16.0",
|
||||
"monaco-editor": "^0.55.1",
|
||||
"radix-ui": "^1.4.3",
|
||||
"react": "^19.2.4",
|
||||
"react-dom": "^19.2.4",
|
||||
@@ -36,7 +35,6 @@
|
||||
"@types/react-dom": "^19.2.3",
|
||||
"concurrently": "^9.2.1",
|
||||
"electron": "^42.2.0",
|
||||
"playwright-core": "^1.60.0",
|
||||
"prettier": "^3.8.1",
|
||||
"prettier-plugin-tailwindcss": "^0.7.2",
|
||||
"tailwindcss": "^4.2.1",
|
||||
|
||||
Generated
-41
@@ -29,9 +29,6 @@ importers:
|
||||
lucide-react:
|
||||
specifier: ^1.16.0
|
||||
version: 1.16.0(react@19.2.6)
|
||||
monaco-editor:
|
||||
specifier: ^0.55.1
|
||||
version: 0.55.1
|
||||
radix-ui:
|
||||
specifier: ^1.4.3
|
||||
version: 1.4.3(@types/react-dom@19.2.3(@types/react@19.2.15))(@types/react@19.2.15)(react-dom@19.2.6(react@19.2.6))(react@19.2.6)
|
||||
@@ -75,9 +72,6 @@ importers:
|
||||
electron:
|
||||
specifier: ^42.2.0
|
||||
version: 42.2.0
|
||||
playwright-core:
|
||||
specifier: ^1.60.0
|
||||
version: 1.60.0
|
||||
prettier:
|
||||
specifier: ^3.8.1
|
||||
version: 3.8.3
|
||||
@@ -1562,9 +1556,6 @@ packages:
|
||||
'@types/statuses@2.0.6':
|
||||
resolution: {integrity: sha512-xMAgYwceFhRA2zY+XbEA7mxYbA093wdiW8Vu6gZPGWy9cmOyU9XesH1tNcEWsKFd5Vzrqx5T3D38PWx1FIIXkA==}
|
||||
|
||||
'@types/trusted-types@2.0.7':
|
||||
resolution: {integrity: sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw==}
|
||||
|
||||
'@types/validate-npm-package-name@4.0.2':
|
||||
resolution: {integrity: sha512-lrpDziQipxCEeK5kWxvljWYhUvOiB2A9izZd9B2AFarYAkqZshb4lPbRs7zKEic6eGtH8V/2qJW+dPp9OtF6bw==}
|
||||
|
||||
@@ -1907,9 +1898,6 @@ packages:
|
||||
resolution: {integrity: sha512-DPi0FmjiSU5EvQV0++GFDOJ9ASQUVFh5kD+OzOnYdi7n3Wpm9hWWGfB/O2blfHcMVTL5WkQXSnRiK9makhrcnw==}
|
||||
engines: {node: '>=0.3.1'}
|
||||
|
||||
dompurify@3.2.7:
|
||||
resolution: {integrity: sha512-WhL/YuveyGXJaerVlMYGWhvQswa7myDG17P7Vu65EWC05o8vfeNbvNf4d/BOvH99+ZW+LlQsc1GDKMa1vNK6dw==}
|
||||
|
||||
dotenv@17.4.2:
|
||||
resolution: {integrity: sha512-nI4U3TottKAcAD9LLud4Cb7b2QztQMUEfHbvhTH09bqXTxnSie8WnjPALV/WMCrJZ6UV/qHJ6L03OqO3LcdYZw==}
|
||||
engines: {node: '>=12'}
|
||||
@@ -2506,11 +2494,6 @@ packages:
|
||||
magic-string@0.30.21:
|
||||
resolution: {integrity: sha512-vd2F4YUyEXKGcLHoq+TEyCjxueSeHnFxyyjNp80yg0XV4vUhnDer/lvvlqM/arB5bXQN5K2/3oinyCRyx8T2CQ==}
|
||||
|
||||
marked@14.0.0:
|
||||
resolution: {integrity: sha512-uIj4+faQ+MgHgwUW1l2PsPglZLOLOT1uErt06dAPtx2kjteLAkbsd/0FiYg/MGS+i7ZKLb7w2WClxHkzOOuryQ==}
|
||||
engines: {node: '>= 18'}
|
||||
hasBin: true
|
||||
|
||||
math-intrinsics@1.1.0:
|
||||
resolution: {integrity: sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g==}
|
||||
engines: {node: '>= 0.4'}
|
||||
@@ -2581,9 +2564,6 @@ packages:
|
||||
minimist@1.2.8:
|
||||
resolution: {integrity: sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==}
|
||||
|
||||
monaco-editor@0.55.1:
|
||||
resolution: {integrity: sha512-jz4x+TJNFHwHtwuV9vA9rMujcZRb0CEilTEwG2rRSpe/A7Jdkuj8xPKttCgOh+v/lkHy7HsZ64oj+q3xoAFl9A==}
|
||||
|
||||
morgan@1.10.1:
|
||||
resolution: {integrity: sha512-223dMRJtI/l25dJKWpgij2cMtywuG/WiUKXdvwfbhGKBhy1puASqXwFzmWZ7+K73vUPoR7SS2Qz2cI/g9MKw0A==}
|
||||
engines: {node: '>= 0.8.0'}
|
||||
@@ -2759,11 +2739,6 @@ packages:
|
||||
pkg-types@2.3.1:
|
||||
resolution: {integrity: sha512-y+ichcgc2LrADuhLNAx8DFjVfgz91pRxfZdI3UDhxHvcVEZsenLO+7XaU5vOp0u/7V/wZ+plyuQxtrDlZJ+yeg==}
|
||||
|
||||
playwright-core@1.60.0:
|
||||
resolution: {integrity: sha512-9bW6zvX/m0lEbgTKJ6YppOKx8H3VOPBMOCFh2irXFOT4BbHgrx5hPjwJYLT40Lu+4qtD36qKc/Hn56StUW57IA==}
|
||||
engines: {node: '>=18'}
|
||||
hasBin: true
|
||||
|
||||
postcss-selector-parser@7.1.1:
|
||||
resolution: {integrity: sha512-orRsuYpJVw8LdAwqqLykBj9ecS5/cRHlI5+nvTo8LcCKmzDmqVORXtOIYEEQuL9D4BxtA1lm5isAqzQZCoQ6Eg==}
|
||||
engines: {node: '>=4'}
|
||||
@@ -4882,9 +4857,6 @@ snapshots:
|
||||
|
||||
'@types/statuses@2.0.6': {}
|
||||
|
||||
'@types/trusted-types@2.0.7':
|
||||
optional: true
|
||||
|
||||
'@types/validate-npm-package-name@4.0.2': {}
|
||||
|
||||
'@types/yauzl@2.10.3':
|
||||
@@ -5200,10 +5172,6 @@ snapshots:
|
||||
|
||||
diff@8.0.4: {}
|
||||
|
||||
dompurify@3.2.7:
|
||||
optionalDependencies:
|
||||
'@types/trusted-types': 2.0.7
|
||||
|
||||
dotenv@17.4.2: {}
|
||||
|
||||
dunder-proto@1.0.1:
|
||||
@@ -5816,8 +5784,6 @@ snapshots:
|
||||
dependencies:
|
||||
'@jridgewell/sourcemap-codec': 1.5.5
|
||||
|
||||
marked@14.0.0: {}
|
||||
|
||||
math-intrinsics@1.1.0: {}
|
||||
|
||||
media-typer@0.3.0: {}
|
||||
@@ -5863,11 +5829,6 @@ snapshots:
|
||||
|
||||
minimist@1.2.8: {}
|
||||
|
||||
monaco-editor@0.55.1:
|
||||
dependencies:
|
||||
dompurify: 3.2.7
|
||||
marked: 14.0.0
|
||||
|
||||
morgan@1.10.1:
|
||||
dependencies:
|
||||
basic-auth: 2.0.1
|
||||
@@ -6036,8 +5997,6 @@ snapshots:
|
||||
exsolve: 1.0.8
|
||||
pathe: 2.0.3
|
||||
|
||||
playwright-core@1.60.0: {}
|
||||
|
||||
postcss-selector-parser@7.1.1:
|
||||
dependencies:
|
||||
cssesc: 3.0.0
|
||||
|
||||
@@ -1,219 +0,0 @@
|
||||
// 临时 E2E 驱动：按《TFS-AI测试流程》用 playwright-core 驱动真实 Electron 应用，
|
||||
// 连接真实 TFS，只在指定测试目录内做写操作，并截图留证。
|
||||
import { _electron as electron } from "playwright-core"
|
||||
import { mkdirSync } from "node:fs"
|
||||
import path from "node:path"
|
||||
|
||||
const ROOT = process.cwd()
|
||||
const SHOT_DIR = path.join(ROOT, ".e2e-shots")
|
||||
mkdirSync(SHOT_DIR, { recursive: true })
|
||||
|
||||
const TEST_SERVER_DIR = "$/北京排水集团人力系统/5SRC/MicroFront/subapp_pm/mactfs"
|
||||
const TEST_TREE_CHAIN = ["北京排水集团人力系统", "5SRC", "MicroFront", "subapp_pm", "mactfs"]
|
||||
// 注意：/Users/fenghp/Desktop/DEV/mactfs-ai-workspace 已被旧测试 Workspace
|
||||
// mactfs-ai-subapp-pm-mactfs 占用（TFS 不允许嵌套映射），UI 测试改用旁路独立目录。
|
||||
const LOCAL_PARENT = "/Users/fenghp/Desktop/DEV/mactfs-ui-e2e"
|
||||
|
||||
const results = []
|
||||
/** 记录一步结果并打印。 */
|
||||
function record(step, ok, detail = "") {
|
||||
results.push({ step, ok, detail })
|
||||
console.log(`${ok ? "PASS" : "FAIL"} | ${step}${detail ? " | " + detail : ""}`)
|
||||
}
|
||||
|
||||
/** 截图保存。 */
|
||||
async function shot(win, name) {
|
||||
await win.screenshot({ path: path.join(SHOT_DIR, `${name}.png`) })
|
||||
}
|
||||
|
||||
const app = await electron.launch({
|
||||
args: ["electron/main.cjs"],
|
||||
cwd: ROOT,
|
||||
env: { ...process.env, NODE_ENV: "development" },
|
||||
})
|
||||
|
||||
try {
|
||||
const win = await app.firstWindow()
|
||||
win.setDefaultTimeout(90000)
|
||||
|
||||
// 1. 服务检测 → 连接页（Electron 会自动拉起本地服务，最长等 60s+）
|
||||
await win.getByRole("button", { name: "连接 TFS" }).waitFor({ timeout: 90000 })
|
||||
const serverUri = await win.locator("#serverUri").inputValue()
|
||||
record("1 服务就绪并进入连接页", true, `回填 serverUri=${serverUri}`)
|
||||
await shot(win, "01-connect")
|
||||
|
||||
// 2. 连接真实 TFS → Collection 列表
|
||||
await win.getByRole("button", { name: "连接 TFS" }).click()
|
||||
await win.getByText("选择 Collection").waitFor({ timeout: 120000 })
|
||||
const collections = await win.locator("ul button span.font-medium").allInnerTexts()
|
||||
record("2 连接成功并加载 Collection", collections.includes("PKUSEHR"), collections.join(","))
|
||||
await shot(win, "02-collections")
|
||||
|
||||
// 3. 选择 PKUSEHR → 确保 Workspace → 进入工作台
|
||||
await win.locator("ul button", { hasText: "PKUSEHR" }).first().click()
|
||||
await win.getByRole("button", { name: "进入工作台" }).click()
|
||||
await win.getByText("源码目录").waitFor({ timeout: 120000 })
|
||||
const topbar = await win.locator("header").innerText()
|
||||
record("3 进入工作台（固定上下文）", topbar.includes("PKUSEHR"), topbar.replace(/\n/g, " "))
|
||||
await shot(win, "03-workspace")
|
||||
|
||||
// 4. 逐级展开目录树到指定测试目录（懒加载真实数据）
|
||||
const tree = win.locator("aside").first()
|
||||
for (const name of TEST_TREE_CHAIN) {
|
||||
const node = tree.getByText(name, { exact: true }).first()
|
||||
await node.waitFor({ timeout: 120000 })
|
||||
await node.click()
|
||||
await win.waitForTimeout(2500)
|
||||
}
|
||||
const pathBar = await win.locator("section").first().innerText()
|
||||
record("4 树导航到测试目录", pathBar.includes(TEST_SERVER_DIR), "")
|
||||
await shot(win, "04-test-folder")
|
||||
|
||||
// 5. 目录历史弹窗
|
||||
await tree.getByText("mactfs", { exact: true }).first().click({ button: "right" })
|
||||
await win.getByRole("menuitem", { name: "查看历史", exact: true }).click()
|
||||
await win.locator("[data-slot=dialog-title]", { hasText: "历史记录" }).waitFor()
|
||||
await win.waitForTimeout(5000)
|
||||
const historyText = await win.locator("[data-slot=dialog-content]").innerText()
|
||||
const historyOk = /Changeset/.test(historyText) && !historyText.includes("历史加载失败")
|
||||
record("5 目录历史弹窗", historyOk, historyText.slice(0, 120).replace(/\n/g, " "))
|
||||
await shot(win, "05-history")
|
||||
await win.keyboard.press("Escape")
|
||||
await win.waitForTimeout(500)
|
||||
|
||||
// 6. 文件查看（服务器 latest，未映射状态）
|
||||
const fileRow = win.locator("section table tbody tr").filter({ hasText: ".txt" }).first()
|
||||
await fileRow.click({ button: "right" })
|
||||
await win.getByRole("menuitem", { name: "查看文件", exact: true }).click()
|
||||
await win.locator("[data-slot=dialog-title]", { hasText: "查看文件" }).waitFor()
|
||||
await win.waitForTimeout(4000)
|
||||
const viewText = await win.locator("[data-slot=dialog-content]").innerText()
|
||||
record("6 文件查看（服务器 latest）", viewText.includes("服务器 latest"), viewText.slice(0, 100).replace(/\n/g, " "))
|
||||
await shot(win, "06-view-file")
|
||||
await win.keyboard.press("Escape")
|
||||
await win.waitForTimeout(500)
|
||||
|
||||
// 7. Mapping 弹窗：父目录 → 后端预校验 → 创建（勾选立即 Get Latest）
|
||||
await tree.getByText("mactfs", { exact: true }).first().click({ button: "right" })
|
||||
await win.getByRole("menuitem", { name: "映射到本地", exact: true }).click()
|
||||
await win.locator("#parentPath").fill(LOCAL_PARENT)
|
||||
await win.waitForTimeout(2500)
|
||||
const mapDialog = await win.locator("[data-slot=dialog-content]").innerText()
|
||||
const precheckOk = mapDialog.includes(`${LOCAL_PARENT}/mactfs`)
|
||||
record("7a Mapping 预校验（最终路径由后端生成）", precheckOk, "")
|
||||
await shot(win, "07-mapping-precheck")
|
||||
await win.getByRole("button", { name: "创建映射" }).click()
|
||||
// 立即 Get Latest，真实下载可能较慢
|
||||
await win.locator("[data-slot=dialog-content]").waitFor({ state: "detached", timeout: 180000 }).catch(() => {})
|
||||
await win.waitForTimeout(3000)
|
||||
const afterMap = await win.locator("section").first().innerText()
|
||||
const mapError = await win.locator("[data-slot=dialog-content]").count()
|
||||
if (mapError > 0) {
|
||||
const errText = await win.locator("[data-slot=dialog-content]").innerText()
|
||||
record("7b 创建 Mapping + Get Latest", false, errText.slice(0, 160).replace(/\n/g, " "))
|
||||
await shot(win, "07b-mapping-error")
|
||||
await win.keyboard.press("Escape")
|
||||
} else {
|
||||
record("7b 创建 Mapping + Get Latest", afterMap.includes(LOCAL_PARENT), afterMap.split("\n").slice(0, 3).join(" "))
|
||||
await shot(win, "07b-mapped")
|
||||
}
|
||||
|
||||
// 8. 目录对比弹窗（真实对比）
|
||||
await win.keyboard.press("Escape")
|
||||
await win.locator("[data-slot=dialog-content]").waitFor({ state: "detached", timeout: 10000 }).catch(() => {})
|
||||
await win.waitForTimeout(800)
|
||||
await tree.getByText("mactfs", { exact: true }).first().click({ button: "right" })
|
||||
const compareItem = win.getByRole("menuitem", { name: "目录对比", exact: true })
|
||||
const compareEnabled = (await compareItem.getAttribute("aria-disabled")) !== "true"
|
||||
if (compareEnabled) {
|
||||
await compareItem.click()
|
||||
await win.locator("[data-slot=dialog-title]", { hasText: "目录对比" }).waitFor()
|
||||
await win.waitForTimeout(8000)
|
||||
const compareText = await win.locator("[data-slot=dialog-content]").innerText()
|
||||
record("8 目录对比弹窗", !compareText.includes("目录对比失败"), compareText.slice(0, 120).replace(/\n/g, " "))
|
||||
await shot(win, "08-compare")
|
||||
await win.keyboard.press("Escape")
|
||||
await win.waitForTimeout(500)
|
||||
} else {
|
||||
await win.keyboard.press("Escape")
|
||||
record("8 目录对比弹窗", false, "目录未映射，菜单置灰")
|
||||
}
|
||||
|
||||
// 9. 签出一个文件 → 右侧出现 pending → Diff → 撤销（不做 checkin，避免污染服务端）
|
||||
const fileRow2 = win.locator("section table tbody tr").filter({ hasText: ".txt" }).first()
|
||||
if ((await fileRow2.count()) > 0) {
|
||||
await fileRow2.click({ button: "right" })
|
||||
const checkoutItem = win.getByRole("menuitem", { name: "签出编辑", exact: true })
|
||||
const checkoutEnabled = (await checkoutItem.getAttribute("aria-disabled")) !== "true"
|
||||
if (checkoutEnabled) {
|
||||
await checkoutItem.click()
|
||||
await win.waitForTimeout(15000)
|
||||
const pendingPanel = await win.locator("aside").nth(1).innerText()
|
||||
const hasPending = pendingPanel.includes("签出编辑") || pendingPanel.includes("Included")
|
||||
record("9a 签出文件产生挂起更改", hasPending, pendingPanel.slice(0, 120).replace(/\n/g, " "))
|
||||
await shot(win, "09a-pending")
|
||||
|
||||
// 与最新版本比较（刚签出未改 → 应一致）
|
||||
const pendingRow = win.locator("aside").nth(1).locator("[data-slot=checkbox]").first()
|
||||
if (hasPending && (await pendingRow.count()) > 0) {
|
||||
const row = win.locator("aside").nth(1).getByText(".txt").first()
|
||||
await row.click({ button: "right" })
|
||||
const diffItem = win.getByRole("menuitem", { name: "与最新版本比较", exact: true })
|
||||
if ((await diffItem.count()) > 0) {
|
||||
await diffItem.click()
|
||||
await win.waitForTimeout(6000)
|
||||
const diffText = await win.locator("[data-slot=dialog-content]").innerText()
|
||||
record("9b 本地 vs latest Diff", diffText.includes("一致") || diffText.includes("差异"), diffText.slice(0, 100).replace(/\n/g, " "))
|
||||
await shot(win, "09b-diff")
|
||||
await win.keyboard.press("Escape")
|
||||
await win.waitForTimeout(500)
|
||||
}
|
||||
// 撤销
|
||||
await row.click({ button: "right" })
|
||||
await win.getByRole("menuitem", { name: "撤销更改", exact: true }).click()
|
||||
await win.waitForTimeout(10000)
|
||||
const afterUndo = await win.locator("aside").nth(1).innerText()
|
||||
record("9c 撤销挂起更改", afterUndo.includes("当前没有挂起更改"), "")
|
||||
await shot(win, "09c-undone")
|
||||
}
|
||||
} else {
|
||||
await win.keyboard.press("Escape")
|
||||
record("9a 签出文件产生挂起更改", false, "签出菜单置灰（可能未映射）")
|
||||
}
|
||||
}
|
||||
|
||||
// 10. 取消映射（清理现场，不跳转浏览位置）
|
||||
await tree.getByText("mactfs", { exact: true }).first().click({ button: "right" })
|
||||
const unmapItem = win.getByRole("menuitem", { name: "取消映射", exact: true })
|
||||
if ((await unmapItem.count()) > 0) {
|
||||
await unmapItem.click()
|
||||
await win.waitForTimeout(8000)
|
||||
const afterUnmap = await win.locator("section").first().innerText()
|
||||
record("10 取消映射并停留当前位置", afterUnmap.includes("未映射到本地") && afterUnmap.includes(TEST_SERVER_DIR), "")
|
||||
await shot(win, "10-unmapped")
|
||||
} else {
|
||||
await win.keyboard.press("Escape")
|
||||
record("10 取消映射", false, "菜单中没有取消映射（mapping 未创建成功）")
|
||||
}
|
||||
|
||||
// 11. 操作日志面板
|
||||
const consoleText = await win.locator("footer").innerText()
|
||||
record("11 操作日志记录", /getLatest|checkout|undo|connect|serverTree/i.test(consoleText), consoleText.split("\n").slice(0, 6).join(" | "))
|
||||
await shot(win, "11-console")
|
||||
} catch (error) {
|
||||
record("EXCEPTION", false, String(error).slice(0, 300))
|
||||
try {
|
||||
const win = await app.firstWindow()
|
||||
await shot(win, "99-exception")
|
||||
} catch {}
|
||||
} finally {
|
||||
await app.close().catch(() => {})
|
||||
}
|
||||
|
||||
console.log("\n==== RESULT SUMMARY ====")
|
||||
for (const item of results) {
|
||||
console.log(`${item.ok ? "✅" : "❌"} ${item.step}${item.detail ? " — " + item.detail : ""}`)
|
||||
}
|
||||
const failed = results.filter((item) => !item.ok).length
|
||||
console.log(`\n${results.length - failed}/${results.length} passed`)
|
||||
process.exit(failed > 0 ? 1 : 0)
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 417 KiB |
@@ -0,0 +1,42 @@
|
||||
async page => {
|
||||
const result = {
|
||||
pendingBefore: false,
|
||||
commentFilled: false,
|
||||
checkinClicked: false,
|
||||
successMessage: "",
|
||||
pendingAfterZero: false,
|
||||
bodySample: "",
|
||||
}
|
||||
|
||||
let bodyText = await page.locator("body").innerText()
|
||||
result.pendingBefore = bodyText.includes("Included 1") && bodyText.includes("pendingEdit / 编辑")
|
||||
|
||||
const comment = page.getByPlaceholder("Comment")
|
||||
await comment.fill("AI UI retest checkin 2026-06-08 17:42")
|
||||
result.commentFilled = true
|
||||
await page.waitForTimeout(500)
|
||||
|
||||
const checkinButton = page.getByRole("button", { name: "Checkin" }).last()
|
||||
if (await checkinButton.isEnabled().catch(() => false)) {
|
||||
await checkinButton.click()
|
||||
await page.waitForTimeout(3500)
|
||||
result.checkinClicked = true
|
||||
}
|
||||
|
||||
bodyText = await page.locator("body").innerText()
|
||||
result.successMessage = bodyText
|
||||
.split("\n")
|
||||
.find((line) => line.includes("Checkin 成功")) || ""
|
||||
result.pendingAfterZero = bodyText.includes("0 项") && bodyText.includes("暂无 Included Changes")
|
||||
result.bodySample = bodyText
|
||||
.split("\n")
|
||||
.filter((line) => /Pending Changes|Included|stage4-e2e|pendingEdit|编辑|Checkin|changeset|暂无/.test(line))
|
||||
.slice(0, 80)
|
||||
.join("\n")
|
||||
|
||||
await page.screenshot({ path: "output/playwright/mactfs-retest/checkin-flow-final.png", fullPage: true })
|
||||
await page.evaluate((data) => {
|
||||
document.body.setAttribute("data-mactfs-checkin-flow", JSON.stringify(data))
|
||||
}, result)
|
||||
console.log(JSON.stringify(result, null, 2))
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 429 KiB |
@@ -0,0 +1,57 @@
|
||||
async page => {
|
||||
const target = "stage4-e2e-20260608124119.txt"
|
||||
const result = {
|
||||
selected: false,
|
||||
getLatestClicked: false,
|
||||
getLatestMessage: "",
|
||||
checkoutClicked: false,
|
||||
checkoutMessage: "",
|
||||
pendingVisible: false,
|
||||
checkinVisible: false,
|
||||
bodySample: "",
|
||||
}
|
||||
|
||||
const targetRow = page.getByRole("button", { name: new RegExp(target) }).first()
|
||||
await targetRow.click()
|
||||
await page.waitForTimeout(800)
|
||||
result.selected = (await page.locator("body").innerText()).includes(`已选中：$/北京排水集团人力系统/5SRC/MicroFront/subapp_pm/mactfs/${target}`)
|
||||
|
||||
const bottomGetLatest = page.getByRole("button", { name: "Get Latest" }).last()
|
||||
if (await bottomGetLatest.isEnabled().catch(() => false)) {
|
||||
await bottomGetLatest.click()
|
||||
await page.waitForTimeout(2500)
|
||||
result.getLatestClicked = true
|
||||
}
|
||||
|
||||
let bodyText = await page.locator("body").innerText()
|
||||
result.getLatestMessage = bodyText
|
||||
.split("\n")
|
||||
.find((line) => line.includes("Get Latest 完成")) || ""
|
||||
|
||||
await targetRow.click()
|
||||
await page.waitForTimeout(500)
|
||||
const checkout = page.getByRole("button", { name: "Checkout" }).last()
|
||||
if (await checkout.isEnabled().catch(() => false)) {
|
||||
await checkout.click()
|
||||
await page.waitForTimeout(2500)
|
||||
result.checkoutClicked = true
|
||||
}
|
||||
|
||||
bodyText = await page.locator("body").innerText()
|
||||
result.checkoutMessage = bodyText
|
||||
.split("\n")
|
||||
.find((line) => line.includes("Checkout 完成")) || ""
|
||||
result.pendingVisible = bodyText.includes("stage4-e2e-20260608124119.txt") && bodyText.includes("编辑")
|
||||
result.checkinVisible = bodyText.includes("Checkin") && bodyText.includes("Included")
|
||||
result.bodySample = bodyText
|
||||
.split("\n")
|
||||
.filter((line) => /Get Latest|Checkout|Pending Changes|Included|stage4-e2e|编辑|Checkin/.test(line))
|
||||
.slice(0, 60)
|
||||
.join("\n")
|
||||
|
||||
await page.screenshot({ path: "output/playwright/mactfs-retest/file-flow-after-checkout.png", fullPage: true })
|
||||
await page.evaluate((data) => {
|
||||
document.body.setAttribute("data-mactfs-file-flow", JSON.stringify(data))
|
||||
}, result)
|
||||
console.log(JSON.stringify(result, null, 2))
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 394 KiB |
@@ -0,0 +1,89 @@
|
||||
async page => {
|
||||
const token = '5P5VxCVaR_EXK5s6WdPW69Gny6ccq28e7fN5Gu8nuX4'
|
||||
const serverPath = "$/北京排水集团人力系统/5SRC/MicroFront/subapp_pm/mactfs"
|
||||
const result = {
|
||||
url: "",
|
||||
connected: false,
|
||||
hasMissingCollection: false,
|
||||
pkusehrVisible: false,
|
||||
targetVisible: false,
|
||||
mappedVisible: false,
|
||||
getLatestVisible: false,
|
||||
checkoutVisible: false,
|
||||
pendingText: "",
|
||||
errors: [],
|
||||
steps: [],
|
||||
}
|
||||
|
||||
await page.addInitScript((initToken) => {
|
||||
window.mactfs = {
|
||||
getToken: async () => initToken,
|
||||
getServiceStatus: async () => ({
|
||||
running: true,
|
||||
message: "服务可用",
|
||||
url: "http://127.0.0.1:38765",
|
||||
tokenFile: "/Users/fenghp/.mactfs/server-token",
|
||||
}),
|
||||
}
|
||||
}, token)
|
||||
|
||||
await page.goto("http://localhost:5173")
|
||||
await page.waitForLoadState("networkidle")
|
||||
result.url = page.url()
|
||||
result.steps.push("loaded")
|
||||
|
||||
const connect = page.getByRole("button", { name: "连接" })
|
||||
if (await connect.isVisible().catch(() => false)) {
|
||||
await connect.click()
|
||||
await page.waitForTimeout(2500)
|
||||
result.steps.push("connected-click")
|
||||
}
|
||||
|
||||
result.connected = await page.getByText("macTFS 已连接").isVisible().catch(() => false)
|
||||
result.pkusehrVisible = await page.getByRole("button", { name: "PKUSEHR" }).isVisible().catch(() => false)
|
||||
result.hasMissingCollection = await page.getByText("Missing required field: collection").isVisible().catch(() => false)
|
||||
|
||||
const pkusehr = page.getByRole("button", { name: "PKUSEHR" })
|
||||
if (await pkusehr.isVisible().catch(() => false)) {
|
||||
await pkusehr.click()
|
||||
await page.waitForTimeout(2500)
|
||||
result.steps.push("pkusehr-click")
|
||||
}
|
||||
|
||||
const pathSegments = [
|
||||
"北京排水集团人力系统",
|
||||
"5SRC",
|
||||
"MicroFront",
|
||||
"subapp_pm",
|
||||
"mactfs",
|
||||
]
|
||||
|
||||
for (const segment of pathSegments) {
|
||||
const locator = page.getByRole("button", { name: new RegExp(`^${segment}(\\s|$)`) }).first()
|
||||
if (await locator.isVisible().catch(() => false)) {
|
||||
await locator.dblclick().catch(async () => locator.click())
|
||||
await page.waitForTimeout(1800)
|
||||
result.steps.push(`click:${segment}`)
|
||||
}
|
||||
}
|
||||
|
||||
const bodyText = await page.locator("body").innerText()
|
||||
result.targetVisible = bodyText.includes(serverPath)
|
||||
result.mappedVisible =
|
||||
bodyText.includes("/Users/fenghp/Desktop/DEV/mactfs-ai-workspace") &&
|
||||
bodyText.includes("已映射")
|
||||
result.hasMissingCollection = bodyText.includes("Missing required field: collection")
|
||||
result.getLatestVisible = bodyText.includes("Get Latest")
|
||||
result.checkoutVisible = bodyText.includes("Checkout")
|
||||
result.pendingText = bodyText
|
||||
.split("\n")
|
||||
.filter((line) => /Pending Changes|Included Changes|Excluded Changes|pendingEdit|Missing required/.test(line))
|
||||
.slice(0, 20)
|
||||
.join("\n")
|
||||
|
||||
await page.screenshot({ path: "output/playwright/mactfs-retest/ui-retest-final.png", fullPage: true })
|
||||
await page.evaluate((data) => {
|
||||
document.body.setAttribute("data-mactfs-retest", JSON.stringify(data))
|
||||
}, result)
|
||||
console.log(JSON.stringify(result, null, 2))
|
||||
}
|
||||
+27
-11
@@ -35,21 +35,37 @@
|
||||
- 常用 API 调试命令
|
||||
- 保留必要的本地验证能力
|
||||
|
||||
## 阶段 4：Frontend Workspace UI
|
||||
## 阶段 4：Frontend
|
||||
|
||||
目标：实现以固定 Collection / Workspace 上下文为核心的桌面工作台。
|
||||
目标：实现类 Visual Studio 的桌面 UI。
|
||||
|
||||
输出：
|
||||
|
||||
- Electron 启动本地服务、preload、API client
|
||||
- 登录配置、Collection 选择、默认 Workspace 上下文
|
||||
- 三栏工作台、底部操作台、左右与底部收起能力
|
||||
- 左侧服务端目录树与中间目录文件列表同步导航
|
||||
- 对象右键菜单与统一动作模型
|
||||
- Mapping、History、目录对比、文件查看、Diff、冲突处理弹窗
|
||||
- Pending Changes、Checkin、操作反馈和日志展示
|
||||
- Electron 启动本地服务
|
||||
- 登录配置
|
||||
- 左侧 Collection 服务端目录树
|
||||
- 中间目录文件列表
|
||||
- 右侧挂起更改
|
||||
- 底部操作日志
|
||||
- Mapping、目录对比、文件操作、历史、Diff、签入
|
||||
|
||||
## 阶段 5：Feature E2E
|
||||
## 阶段 5：Frontend Refactor
|
||||
|
||||
目标：根据前端重构与 UI 功能调整方案，补齐后端接口能力并重构桌面工作台交互。
|
||||
|
||||
输出：
|
||||
|
||||
- 登录页固定 Collection，上次 Collection 默认选中
|
||||
- Workspace 自动使用或创建
|
||||
- 左右栏和底部日志收起
|
||||
- 左侧树与中间文件列表同步导航
|
||||
- 对象右键菜单
|
||||
- Mapping、History、目录对比弹窗
|
||||
- 文件查看与 Diff 编辑器
|
||||
- Get Latest / Checkout 冲突选择弹窗
|
||||
- Pending Changes 右键菜单与 Checkin 体验重构
|
||||
|
||||
## 阶段 6：Feature E2E
|
||||
|
||||
目标：按真实业务链路做端到端验收。
|
||||
|
||||
@@ -61,7 +77,7 @@
|
||||
- Pending Changes 与 Checkin 验收
|
||||
- History 与 Diff 验收
|
||||
|
||||
## 阶段 6：Release
|
||||
## 阶段 7：Release
|
||||
|
||||
目标：完成个人可用的 macOS 桌面应用交付。
|
||||
|
||||
|
||||
@@ -9,17 +9,8 @@ AI 执行任何任务前，必须读取：
|
||||
- [task/AI-RULES.md](/Users/fenghp/Desktop/DEV/project/mydev/task/AI-RULES.md)
|
||||
- 当前任务文件
|
||||
|
||||
如果任务属于前端阶段，或任务会影响前端交互、布局、接口对接，还必须读取：
|
||||
|
||||
- [mactfsui/FRONTEND_SPEC.md](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/FRONTEND_SPEC.md)
|
||||
|
||||
如果任务涉及源码，还必须读取相关模块现有代码，优先复用项目已有写法。
|
||||
|
||||
说明：
|
||||
|
||||
- `task/frontend` 是当前唯一有效的前端阶段任务目录。
|
||||
- `task/frontend-refactor` 已并入 `task/frontend`，仅保留归档说明，不再作为当前任务来源。
|
||||
|
||||
## 二、任务状态更新
|
||||
|
||||
开始任务前：
|
||||
|
||||
+33
-32
@@ -4,17 +4,11 @@
|
||||
|
||||
- 每次开发任务前，AI 必须先读取 [AI-RULES.md](/Users/fenghp/Desktop/DEV/project/mydev/task/AI-RULES.md)。
|
||||
- 每次开发任务前，AI 必须读取 [mactfs-api-product-prd.md](/Users/fenghp/Desktop/DEV/project/mydev/docs/mactfs-api-product-prd.md)。
|
||||
- 前端相关任务还必须读取 [mactfsui/FRONTEND_SPEC.md](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/FRONTEND_SPEC.md)。
|
||||
- 每次开发任务前，AI 必须读取当前任务文件。
|
||||
- 开始任务时，将任务状态改为 `doing`。
|
||||
- 完成任务后，将任务状态改为 `done`，填写完成记录，并更新本看板。
|
||||
- 阻塞任务必须标记为 `blocked`，并写清阻塞原因和需要的输入。
|
||||
|
||||
说明：
|
||||
|
||||
- `task/frontend` 是当前唯一有效的前端阶段目录。
|
||||
- `task/frontend-refactor` 已归档，设计结论已并入 `task/frontend` 和 `mactfsui/FRONTEND_SPEC.md`。
|
||||
|
||||
## 状态枚举
|
||||
|
||||
```text
|
||||
@@ -31,22 +25,19 @@ blocked
|
||||
| Core | 12 | 12 | 100% |
|
||||
| Server API | 10 | 10 | 100% |
|
||||
| CLI | 2 | 2 | 100% |
|
||||
| Frontend | 18 | 18 | 100% |
|
||||
| Frontend | 13 | 13 | 100% |
|
||||
| Frontend Refactor | 0 | 10 | 0% |
|
||||
| Feature E2E | 0 | 5 | 0% |
|
||||
| Release | 0 | 4 | 0% |
|
||||
| Overall | 42 | 51 | 82% |
|
||||
| Overall | 37 | 56 | 66% |
|
||||
|
||||
## 当前阶段
|
||||
|
||||
Feature E2E（前端阶段含增强已全部完成）
|
||||
|
||||
## 前端规范
|
||||
|
||||
- [mactfsui/FRONTEND_SPEC.md](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/FRONTEND_SPEC.md)
|
||||
Frontend Refactor
|
||||
|
||||
## 下一步任务
|
||||
|
||||
- [FEATURE-001-连接与目录浏览端到端验收.md](/Users/fenghp/Desktop/DEV/project/mydev/task/feature/FEATURE-001-连接与目录浏览端到端验收.md)（需要真实 TFS 环境）
|
||||
- [UIR-001-补齐后端接口能力.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend-refactor/UIR-001-补齐后端接口能力.md)
|
||||
|
||||
## Core
|
||||
|
||||
@@ -91,24 +82,34 @@ Feature E2E（前端阶段含增强已全部完成）
|
||||
|
||||
| 任务 | 状态 | 优先级 |
|
||||
|---|---|---|
|
||||
| [FE-001-实现Electron启动服务Preload与API客户端.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-001-实现Electron启动服务Preload与API客户端.md) | done | P0 |
|
||||
| [FE-002-补齐前端集成所需服务端接口与类型契约.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-002-补齐前端集成所需服务端接口与类型契约.md) | done | P0 |
|
||||
| [FE-003-实现连接页Collection选择与Workspace上下文.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-003-实现连接页Collection选择与Workspace上下文.md) | done | P0 |
|
||||
| [FE-004-实现工作台布局折叠面板与同步导航.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-004-实现工作台布局折叠面板与同步导航.md) | done | P0 |
|
||||
| [FE-005-实现服务端目录树与当前目录文件列表.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-005-实现服务端目录树与当前目录文件列表.md) | done | P0 |
|
||||
| [FE-006-实现对象右键菜单与通用动作模型.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-006-实现对象右键菜单与通用动作模型.md) | done | P0 |
|
||||
| [FE-007-实现MappingHistory与目录对比弹窗.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-007-实现MappingHistory与目录对比弹窗.md) | done | P0 |
|
||||
| [FE-008-实现文件查看与Diff弹窗.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-008-实现文件查看与Diff弹窗.md) | done | P0 |
|
||||
| [FE-009-实现GetLatest与Checkout冲突处理.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-009-实现GetLatest与Checkout冲突处理.md) | done | P0 |
|
||||
| [FE-010-实现PendingChanges与Checkin体验.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-010-实现PendingChanges与Checkin体验.md) | done | P0 |
|
||||
| [FE-011-拆分FolderItemsPanel与收口动作编排.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-011-拆分FolderItemsPanel与收口动作编排.md) | done | P1 |
|
||||
| [FE-012-实现操作日志面板与刷新反馈.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-012-实现操作日志面板与刷新反馈.md) | done | P1 |
|
||||
| [FE-013-前端阶段联调验收基线.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-013-前端阶段联调验收基线.md) | done | P0 |
|
||||
| [FE-014-实现安全获取与强制获取及指定版本.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-014-实现安全获取与强制获取及指定版本.md) | done | P0 |
|
||||
| [FE-015-完善历史与对比结果的对象操作.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-015-完善历史与对比结果的对象操作.md) | done | P0 |
|
||||
| [FE-016-优化Diff与历史弹窗体验.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-016-优化Diff与历史弹窗体验.md) | done | P1 |
|
||||
| [FE-017-实现工作台手动刷新.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-017-实现工作台手动刷新.md) | done | P1 |
|
||||
| [FE-018-Diff弹窗替换为MonacoDiffEditor.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-018-Diff弹窗替换为MonacoDiffEditor.md) | done | P1 |
|
||||
| [FE-001-实现Electron启动服务与API客户端.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-001-实现Electron启动服务与API客户端.md) | done | P0 |
|
||||
| [FE-002-实现登录配置页.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-002-实现登录配置页.md) | done | P0 |
|
||||
| [FE-003-实现VS风格主布局.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-003-实现VS风格主布局.md) | done | P0 |
|
||||
| [FE-004-实现Collection服务端目录树.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-004-实现Collection服务端目录树.md) | done | P0 |
|
||||
| [FE-005-实现中间目录文件列表.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-005-实现中间目录文件列表.md) | done | P0 |
|
||||
| [FE-006-实现Mapping创建流程.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-006-实现Mapping创建流程.md) | done | P0 |
|
||||
| [FE-007-实现目录对比页面.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-007-实现目录对比页面.md) | done | P0 |
|
||||
| [FE-008-实现右侧挂起更改面板.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-008-实现右侧挂起更改面板.md) | done | P0 |
|
||||
| [FE-009-实现文件操作交互.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-009-实现文件操作交互.md) | done | P0 |
|
||||
| [FE-010-实现签入流程.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-010-实现签入流程.md) | done | P0 |
|
||||
| [FE-011-实现历史记录界面.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-011-实现历史记录界面.md) | done | P0 |
|
||||
| [FE-012-实现文件Diff界面.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-012-实现文件Diff界面.md) | done | P0 |
|
||||
| [FE-013-实现操作日志面板.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend/FE-013-实现操作日志面板.md) | done | P1 |
|
||||
|
||||
## Frontend Refactor
|
||||
|
||||
| 任务 | 状态 | 优先级 |
|
||||
|---|---|---|
|
||||
| [UIR-001-补齐后端接口能力.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend-refactor/UIR-001-补齐后端接口能力.md) | todo | P0 |
|
||||
| [UIR-002-重构登录Collection与Workspace上下文.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend-refactor/UIR-002-重构登录Collection与Workspace上下文.md) | todo | P0 |
|
||||
| [UIR-003-重构工作台布局与同步导航.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend-refactor/UIR-003-重构工作台布局与同步导航.md) | todo | P0 |
|
||||
| [UIR-004-实现对象右键菜单.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend-refactor/UIR-004-实现对象右键菜单.md) | todo | P0 |
|
||||
| [UIR-005-实现MappingHistoryCompare弹窗.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend-refactor/UIR-005-实现MappingHistoryCompare弹窗.md) | todo | P0 |
|
||||
| [UIR-006-实现文件查看与Diff编辑器.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend-refactor/UIR-006-实现文件查看与Diff编辑器.md) | todo | P0 |
|
||||
| [UIR-007-实现GetLatestCheckout冲突流程.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend-refactor/UIR-007-实现GetLatestCheckout冲突流程.md) | todo | P0 |
|
||||
| [UIR-008-重构PendingChanges与Checkin体验.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend-refactor/UIR-008-重构PendingChanges与Checkin体验.md) | todo | P0 |
|
||||
| [UIR-009-拆分FolderItemsPanel与动作编排.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend-refactor/UIR-009-拆分FolderItemsPanel与动作编排.md) | todo | P1 |
|
||||
| [UIR-010-前端重构端到端验收.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend-refactor/UIR-010-前端重构端到端验收.md) | todo | P0 |
|
||||
|
||||
## Feature E2E
|
||||
|
||||
|
||||
@@ -14,7 +14,7 @@ feature
|
||||
|
||||
## 依赖任务
|
||||
|
||||
- FE-013
|
||||
- FE-004
|
||||
- SERVER-005
|
||||
|
||||
## 需求来源
|
||||
@@ -23,15 +23,14 @@ feature
|
||||
|
||||
## 目标
|
||||
|
||||
验证从登录页到固定 Collection / Workspace 上下文，再到目录树和当前目录列表的完整链路。
|
||||
验证从 UI 到 API 到 TFS SDK 的连接和目录浏览完整链路。
|
||||
|
||||
## 实现范围
|
||||
|
||||
- UI 输入账号密码并连接
|
||||
- 连接后加载 Collection
|
||||
- 选择 Collection 并自动确保 Workspace
|
||||
- UI 输入账号密码连接
|
||||
- 查询 Collection
|
||||
- 展示左侧服务端目录树
|
||||
- 点击目录展示中间当前目录列表
|
||||
- 点击目录展示下一级文件列表
|
||||
- 未映射目录也可浏览
|
||||
|
||||
## 不在范围
|
||||
@@ -48,10 +47,9 @@ feature
|
||||
## 验收标准
|
||||
|
||||
- 真实 TFS 环境可连接
|
||||
- Collection 可见并可确认
|
||||
- 默认 Workspace 可自动使用或创建
|
||||
- Collection 可见
|
||||
- 服务端目录树可展开
|
||||
- 中间当前目录列表可展示
|
||||
- 中间文件列表可展示
|
||||
|
||||
## 测试方式
|
||||
|
||||
|
||||
@@ -15,8 +15,7 @@ feature
|
||||
## 依赖任务
|
||||
|
||||
- FEATURE-001
|
||||
- FE-007
|
||||
- FE-009
|
||||
- FE-006
|
||||
- SERVER-006
|
||||
- SERVER-007
|
||||
|
||||
@@ -26,15 +25,15 @@ feature
|
||||
|
||||
## 目标
|
||||
|
||||
验证 Mapping 弹窗、目录选择、是否立即 Get Latest，以及后续独立执行 Get Latest 的完整链路。
|
||||
验证 Mapping 创建和 Get Latest 的完整链路。
|
||||
|
||||
## 实现范围
|
||||
|
||||
- 选择服务端目录
|
||||
- 通过弹窗映射到本地目录
|
||||
- 映射到本地目录
|
||||
- 选择是否立即 Get Latest
|
||||
- 对文件 / 目录 / Mapping 执行 Get Latest
|
||||
- 展示下载结果、跳过项和冲突反馈
|
||||
- 展示下载结果
|
||||
|
||||
## 不在范围
|
||||
|
||||
@@ -50,9 +49,8 @@ feature
|
||||
## 验收标准
|
||||
|
||||
- Mapping 能保存到 Workspace
|
||||
- 不立即下载时状态为 `notDownloaded`
|
||||
- 不立即下载时状态为 notDownloaded
|
||||
- 后续可单独下载下级文件或目录
|
||||
- 有冲突或跳过项时前端反馈清晰
|
||||
|
||||
## 测试方式
|
||||
|
||||
|
||||
@@ -15,7 +15,6 @@ feature
|
||||
## 依赖任务
|
||||
|
||||
- FEATURE-002
|
||||
- FE-006
|
||||
- FE-007
|
||||
- FE-009
|
||||
- SERVER-008
|
||||
@@ -26,21 +25,22 @@ feature
|
||||
|
||||
## 目标
|
||||
|
||||
验证目录对比弹窗、差异筛选、右键动作和冲突反馈链路。
|
||||
验证目录对比和勾选差异文件处理完整链路。
|
||||
|
||||
## 实现范围
|
||||
|
||||
- 对已映射目录执行对比
|
||||
- 展示差异文件
|
||||
- 通过右键菜单执行 checkout、add、get latest、undo
|
||||
- 对冲突项进入统一冲突处理
|
||||
- 验证目录对比结果刷新
|
||||
- 勾选 localModified 执行 checkout
|
||||
- 勾选 localOnly 执行 add
|
||||
- 勾选 notDownloaded 执行 Get Latest
|
||||
- 勾选 pending change 执行 undo
|
||||
|
||||
## 不在范围
|
||||
|
||||
- 不做自动修复全部
|
||||
- 不做手动冲突块编辑
|
||||
- 不做实时 watcher
|
||||
- 不做冲突解决
|
||||
- 不做实时刷新
|
||||
|
||||
## 涉及文件
|
||||
|
||||
@@ -49,10 +49,9 @@ feature
|
||||
|
||||
## 验收标准
|
||||
|
||||
- 目录对比默认不显示 `upToDate`
|
||||
- 目录对比不显示 upToDate
|
||||
- 差异状态准确
|
||||
- 用户可通过右键菜单执行对应操作
|
||||
- 有冲突时能进入统一冲突反馈流程
|
||||
- 用户可勾选文件执行对应操作
|
||||
|
||||
## 测试方式
|
||||
|
||||
|
||||
@@ -15,6 +15,7 @@ feature
|
||||
## 依赖任务
|
||||
|
||||
- FEATURE-003
|
||||
- FE-008
|
||||
- FE-010
|
||||
|
||||
## 需求来源
|
||||
@@ -23,7 +24,7 @@ feature
|
||||
|
||||
## 目标
|
||||
|
||||
验证右侧 Changes 面板、Included / Excluded 和签入链路。
|
||||
验证右侧挂起更改、Included / Excluded 和签入完整链路。
|
||||
|
||||
## 实现范围
|
||||
|
||||
@@ -52,7 +53,6 @@ feature
|
||||
- Excluded 不参与签入
|
||||
- 成功后 Included 清空
|
||||
- changeset 编号可见
|
||||
- 签入后当前目录和 Pending Changes 刷新
|
||||
|
||||
## 测试方式
|
||||
|
||||
|
||||
@@ -15,8 +15,8 @@ feature
|
||||
## 依赖任务
|
||||
|
||||
- FEATURE-002
|
||||
- FE-007
|
||||
- FE-008
|
||||
- FE-011
|
||||
- FE-012
|
||||
- SERVER-009
|
||||
|
||||
## 需求来源
|
||||
@@ -25,22 +25,21 @@ feature
|
||||
|
||||
## 目标
|
||||
|
||||
验证 History 弹窗、changeset 文件列表、文件查看和 Diff 弹窗的完整链路。
|
||||
验证文件历史、目录历史、changeset 文件列表和版本对比完整链路。
|
||||
|
||||
## 实现范围
|
||||
|
||||
- 文件历史最近 100 条
|
||||
- 目录历史最近 100 条
|
||||
- 点击 changeset 查看影响文件列表
|
||||
- 本地 vs latest Diff
|
||||
- 两个历史版本 Diff
|
||||
- 大文件、二进制、非 Mapping 路径提示
|
||||
- 本地 vs latest diff
|
||||
- 两个历史版本 diff
|
||||
|
||||
## 不在范围
|
||||
|
||||
- 不做筛选
|
||||
- 不做三方 merge
|
||||
- 不做二进制可视化 Diff
|
||||
- 不做二进制可视化 diff
|
||||
|
||||
## 涉及文件
|
||||
|
||||
@@ -53,7 +52,6 @@ feature
|
||||
- 目录历史可展示
|
||||
- changeset 文件列表可展示
|
||||
- 历史中两个版本可对比
|
||||
- 大文件和不可渲染文件提示明确
|
||||
|
||||
## 测试方式
|
||||
|
||||
|
||||
@@ -1,19 +0,0 @@
|
||||
# frontend-refactor 归档说明
|
||||
|
||||
`task/frontend-refactor` 原本用于承接另一分支里的前端重构任务。
|
||||
|
||||
当前分支已经把其中的设计结论和任务拆分统一并入以下位置：
|
||||
|
||||
- [mactfsui/FRONTEND_SPEC.md](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/FRONTEND_SPEC.md)
|
||||
- [task/frontend](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend)
|
||||
|
||||
当前规则：
|
||||
|
||||
- 前端阶段只看 `task/frontend`
|
||||
- `frontend-refactor` 不再单独维护状态
|
||||
- 旧 `UIR-*` 编号停止使用
|
||||
|
||||
如果后续需要继续调整前端方案，直接修改：
|
||||
|
||||
- `mactfsui/FRONTEND_SPEC.md`
|
||||
- `task/frontend/FE-001` 到 `FE-013`
|
||||
@@ -0,0 +1,713 @@
|
||||
# macTFS 前端重构与 UI 功能调整方案
|
||||
|
||||
## 一、背景与问题
|
||||
|
||||
当前 `mactfsui` 前端已经实现连接、Collection 目录树、文件列表、Mapping、目录对比、文件操作、Pending Changes、Checkin、History、Diff 和操作日志，但现有页面把过多功能压在一个工作台中，导致主操作区职责不清。
|
||||
|
||||
主要问题：
|
||||
|
||||
- Collection 在左侧树里可切换，但 TFS 的日常工作通常围绕一个已选 Collection 和 Workspace 展开，运行时频繁切换 Collection 会让目录树、Mapping、Pending Changes、History、Diff 的上下文变复杂。
|
||||
- `FolderItemsPanel` 同时承载目录文件列表、Mapping 表单、目录对比结果、批量差异操作、History 面板、Diff 面板和选中项操作区，中间区域被多类临时功能挤占。
|
||||
- `AppShell` 顶部有全局 `Get Latest`、`History` 入口，但这些操作实际应绑定到文件、文件夹或当前目录上下文，不适合作为全局按钮。
|
||||
- 右侧 Inspector 同时展示 Pending Changes、Checkin 和本地服务信息，页面宽度不足时 Pending Changes 可用空间被压缩。
|
||||
- 文件/目录相关操作目前主要依赖按钮，缺少符合桌面工具习惯的右键菜单。
|
||||
|
||||
## 二、重构目标
|
||||
|
||||
本次 UI 重构应围绕“连接后固定上下文，主区专注浏览，操作绑定对象，详情进入弹窗”来调整。
|
||||
|
||||
目标：
|
||||
|
||||
- 登录阶段完成 Collection 选择，进入工作台后不再提供 Collection 切换。
|
||||
- 主工作台保持三栏结构，但左右区域可收缩，保证中间文件列表有足够空间。
|
||||
- 中间区域只展示当前目录文件列表和必要的路径/状态信息，不再内嵌 History、Diff、目录对比详情。
|
||||
- 文件、文件夹、目录树节点上的操作统一放入右键菜单。
|
||||
- History、Diff、目录对比、Mapping 使用弹窗承载；Checkin 保留在右侧 Changes 面板。
|
||||
- 底部操作日志保留为可收缩区域，不长期占用大量主工作区高度。
|
||||
|
||||
## 三、推荐信息架构
|
||||
|
||||
### 3.1 登录与连接页
|
||||
|
||||
推荐把登录页拆成连接信息和 Collection 选择两个步骤，但仍保留在 `routes/home.tsx` 的未连接视图内，避免现在就引入复杂路由。
|
||||
|
||||
流程：
|
||||
|
||||
1. 用户填写 TFS 地址、认证方式、域、用户名、密码。
|
||||
2. 点击连接后调用 `/api/session/connect`。
|
||||
3. 连接成功后加载 `/api/collections`。
|
||||
4. 用户选择一个 Collection。
|
||||
5. 系统自动使用本机已有 Workspace；如果没有，则创建默认 Workspace。
|
||||
6. 将选中的 Collection 和当前 Workspace 保存到配置或当前会话状态。
|
||||
7. 进入主工作台。
|
||||
|
||||
推荐规则：
|
||||
|
||||
- 登录页必须选择 Collection；如果只有一个 Collection，默认选中但仍展示名称。
|
||||
- 如果配置中有上次使用的 Collection，登录页默认选中该 Collection。
|
||||
- 工作台内不提供 Collection 切换按钮。
|
||||
- 不允许用户手动选择 Workspace；本机已有 Workspace 就自动使用，没有就创建默认 Workspace。
|
||||
- 默认 Workspace 命名规则由后端程序固定，不在前端暴露配置。
|
||||
- 需要更换 Collection 时，走“断开/重新连接”或“连接设置”流程。
|
||||
|
||||
原因：
|
||||
|
||||
- Collection 是后续目录树、Mapping、Pending Changes、History、Diff 的共同上游上下文。
|
||||
- 进入工作台后固定 Collection，可以减少跨面板状态重置和误操作。
|
||||
- 当前 `ServerTreePanel` 内部维护 Collection 列表和切换逻辑，后续应下沉为只接收固定 `collection` 的目录树。
|
||||
|
||||
### 3.2 主工作台布局
|
||||
|
||||
推荐布局：
|
||||
|
||||
```text
|
||||
┌──────────────────────────────────────────────────────────────┐
|
||||
│ Top Bar: macTFS | Server | Collection | Workspace | Actions │
|
||||
├──────────────┬────────────────────────────────┬──────────────┤
|
||||
│ Source Tree │ Current Folder Items │ Changes │
|
||||
│ collapsible │ main workspace │ collapsible │
|
||||
├──────────────┴────────────────────────────────┴──────────────┤
|
||||
│ Operation Console collapsible │
|
||||
└──────────────────────────────────────────────────────────────┘
|
||||
```
|
||||
|
||||
区域职责：
|
||||
|
||||
- Top Bar：展示连接状态、服务器、Collection、Workspace、刷新服务、打开设置；不放文件操作主按钮。
|
||||
- Source Tree：只展示固定 Collection 下的服务端目录树，支持右键目录操作。
|
||||
- Current Folder Items：展示当前目录下文件/文件夹列表，是主工作区。
|
||||
- Changes：展示 Pending Changes 摘要、Included/Excluded、Checkin 入口，可收缩。
|
||||
- Operation Console：展示操作日志，可收缩，默认高度更低。
|
||||
|
||||
左右收缩建议：
|
||||
|
||||
- 左侧 Source Tree 默认宽度 280px，支持收起到 40px。
|
||||
- 右侧 Changes 默认宽度 340px，支持收起到 40px。
|
||||
- 中间使用 `minmax(480px, 1fr)`，优先保证文件列表可读。
|
||||
- 左右栏收起状态都只保留展开按钮，不显示路径、列表或 Pending Changes 数量徽标。
|
||||
|
||||
不建议第一版做任意拖拽宽度：
|
||||
|
||||
- 当前项目没有可复用的 resizable 组件。
|
||||
- 第一版使用固定展开/收起宽度更符合最小改动原则。
|
||||
- 后续如果确实需要拖拽，再基于 Radix/shadcn 增补 `ResizablePanel`。
|
||||
|
||||
### 3.3 中间文件列表
|
||||
|
||||
中间区域应只保留高频浏览信息：
|
||||
|
||||
- 当前路径面包屑或路径栏。
|
||||
- 当前目录 Mapping 状态。
|
||||
- 文件/文件夹表格。
|
||||
- 选中项状态摘要。
|
||||
- 必要的刷新入口。
|
||||
|
||||
表格列建议：
|
||||
|
||||
- 名称
|
||||
- 状态
|
||||
- 最新版本
|
||||
- 本地路径
|
||||
- 修改时间
|
||||
|
||||
应从中间区域移出的内容：
|
||||
|
||||
- History 面板。
|
||||
- Diff 面板。
|
||||
- 目录对比详情列表。
|
||||
- 大块 Mapping 创建表单。
|
||||
- 批量差异操作面板。
|
||||
- 选中项底部操作区。
|
||||
|
||||
中间文件列表的目录进入操作必须和左侧目录树保持同步。用户在中间双击或通过右键菜单“打开”进入目录时，左侧树应自动展开到该目录并选中对应节点；用户在左侧树选择目录时，中间文件列表也应切换到同一路径。
|
||||
|
||||
中间文件列表的单击只负责选中行，不进入目录；进入目录只通过双击或右键菜单“打开”触发。
|
||||
|
||||
## 四、右键菜单设计
|
||||
|
||||
### 4.1 右键菜单使用原则
|
||||
|
||||
推荐将“绑定到文件或文件夹”的操作全部放到右键菜单中。
|
||||
|
||||
适用对象：
|
||||
|
||||
- 左侧目录树节点。
|
||||
- 中间文件列表行。
|
||||
- Pending Changes 列表项。
|
||||
- 目录对比结果项。
|
||||
|
||||
不建议只依赖右键菜单：
|
||||
|
||||
- `Checkin` 仍应在右侧 Changes 面板有明确入口，因为它是跨文件集合操作。
|
||||
- `刷新`、`连接设置`、`打开日志` 这类全局操作保留在顶部或面板标题区。
|
||||
|
||||
### 4.2 左侧目录树右键菜单
|
||||
|
||||
目录树节点菜单：
|
||||
|
||||
- 获取最新版本
|
||||
- 映射到本地
|
||||
- 查看历史
|
||||
- 与服务器文件对比
|
||||
- 刷新子目录
|
||||
|
||||
启用条件：
|
||||
|
||||
- 获取最新版本：目录已映射。
|
||||
- 映射到本地：目录未映射。
|
||||
- 查看历史：已连接且有服务端路径。
|
||||
- 与服务器文件对比：目录已映射。
|
||||
- 刷新子目录：目录节点可用。
|
||||
|
||||
左侧目录树必须支持右键菜单。目录树右键菜单和中间文件列表右键菜单应复用同一套文件操作判断，避免同一路径在两个区域出现不同可用操作。
|
||||
|
||||
### 4.3 中间文件列表右键菜单
|
||||
|
||||
文件夹菜单：
|
||||
|
||||
- 打开
|
||||
- 获取最新版本
|
||||
- 签出
|
||||
- 新增本地文件到服务器
|
||||
- 删除
|
||||
- 撤销挂起更改
|
||||
- 查看历史
|
||||
- 与服务器目录对比
|
||||
- 映射到本地
|
||||
|
||||
文件菜单：
|
||||
|
||||
- 查看
|
||||
- 获取最新版本
|
||||
- 签出
|
||||
- 删除
|
||||
- 撤销挂起更改
|
||||
- 查看历史
|
||||
- 比较本地与服务器 Latest
|
||||
|
||||
启用条件：
|
||||
|
||||
- 获取最新版本：已映射且没有 pending edit；文件夹递归执行；发现本地与服务器不一致时，必须让用户选择使用服务器版本或保留本地版本。
|
||||
- 签出：已映射且为版本控制项；执行时自动先获取最新版本再签出；文件夹允许递归签出，但执行前必须确认。
|
||||
- 新增本地文件到服务器：仅文件夹或当前目录已映射时展示，先对比本地映射目录和服务器目录，再把选中的本地独有项加入 pending add。
|
||||
- 删除：仅服务器已有的版本控制项可用，执行 pending delete；不删除本地未入库的 `localOnly` 文件。
|
||||
- 撤销挂起更改：该项存在 pending change。
|
||||
- 查看历史：服务端路径存在。
|
||||
- 查看：文件可用；已映射且存在本地路径时查看本地文件，未映射时查看服务器文件。
|
||||
- 与服务器目录对比：文件夹、已映射，用于找出本地和服务器不同的文件，方便后续签出、新增、获取最新等操作。
|
||||
- 比较本地与服务器 Latest：文件、已映射、有本地路径，用于查看本地修改和服务器代码的异同。
|
||||
- 映射到本地：仅未映射目录展示。
|
||||
|
||||
### 4.4 Pending Changes 右键菜单
|
||||
|
||||
Pending Change 菜单：
|
||||
|
||||
- 移到 Included
|
||||
- 移到 Excluded
|
||||
- 查看
|
||||
- 撤销
|
||||
- 查看历史
|
||||
- 比较本地与服务器 Latest
|
||||
|
||||
Checkin 不放到单个 pending item 的右键菜单中，避免用户误以为只签入单项。签入仍通过右侧 Changes 面板提交 Included Changes。
|
||||
|
||||
Pending Changes 中的查看入口用于打开本地文件只读内容；比较入口用于查看待签入文件的本地内容与服务器 latest 的差异；撤销用于取消该文件的 pending change；历史记录用于查看该文件或目录的提交历史。
|
||||
|
||||
Pending Changes 的查看和比较入口只对文件显示；文件夹保留撤销、查看历史、移到 Included 和移到 Excluded。
|
||||
pending add 文件没有服务器版本，只显示查看和撤销，不显示比较本地与服务器 Latest。
|
||||
|
||||
## 五、弹窗与独立视图设计
|
||||
|
||||
### 5.1 History 弹窗
|
||||
|
||||
History 应改为弹窗或大尺寸 Dialog，不再嵌入中间文件列表。
|
||||
|
||||
触发入口：
|
||||
|
||||
- 文件/文件夹右键菜单“查看历史”。
|
||||
- 目录树节点右键菜单“查看历史”。
|
||||
|
||||
弹窗内容：
|
||||
|
||||
- 顶部展示目标路径。
|
||||
- 左侧或主表格展示 changeset 列表。
|
||||
- 右侧展示选中 changeset 的文件列表。
|
||||
- 文件历史支持选择两个版本后打开 Diff。
|
||||
|
||||
推荐尺寸：
|
||||
|
||||
- 桌面端宽度使用 `min(1100px, calc(100vw - 48px))`。
|
||||
- 高度使用 `min(760px, calc(100vh - 48px))`。
|
||||
|
||||
### 5.2 Diff 弹窗
|
||||
|
||||
Diff 应改为独立 Dialog 或专用工作视图，不再占用文件列表高度。
|
||||
|
||||
触发入口：
|
||||
|
||||
- 文件右键菜单“Diff 本地与服务器 Latest”。
|
||||
- History 弹窗选择两个版本后打开。
|
||||
- 目录对比弹窗中对单个文件打开。
|
||||
|
||||
推荐方式：
|
||||
|
||||
- 第一版使用 Dialog。
|
||||
- Diff 视觉效果需要重做，不沿用当前紧凑表格视觉。
|
||||
- 使用更清晰的左右分栏：左侧本地或源版本，右侧服务器 latest 或目标版本。
|
||||
- 必须支持代码高亮、搜索、行号、差异高亮、文件路径、版本标签和刷新入口。
|
||||
- 长文本区域使用独立滚动，不让内容撑开弹窗。
|
||||
- 单个文件超过 5MB 时不直接渲染 Diff，只提示文件过大。
|
||||
- 第一版需要引入代码查看/Diff 编辑器能力，优先评估 Monaco Editor：只读查看使用 Monaco Editor，Diff 使用 Monaco Diff Editor。
|
||||
- 如果 Monaco 包体或集成成本不可接受，再评估 CodeMirror 6 + MergeView。
|
||||
|
||||
### 5.3 文件查看弹窗
|
||||
|
||||
文件右键菜单需要提供“查看”入口。已映射且存在本地路径时查看本地文件；未映射时查看服务器文件。
|
||||
|
||||
触发入口：
|
||||
|
||||
- 文件列表文件右键菜单“查看”。
|
||||
- Pending Changes 文件右键菜单“查看”。
|
||||
|
||||
弹窗内容：
|
||||
|
||||
- 顶部展示文件名、本地路径和服务器路径。
|
||||
- 主体展示只读文件内容。
|
||||
- 明确标识当前查看来源：本地文件或服务器文件。
|
||||
- 文本文件必须支持代码高亮、搜索、行号和滚动区域。
|
||||
- 单个文件超过 5MB 时不直接渲染内容，只提示文件过大。
|
||||
- 二进制文件或无法读取的文件展示明确提示，不尝试渲染内容。
|
||||
|
||||
实现建议：
|
||||
|
||||
- 第一版先实现只读查看，不提供编辑能力。
|
||||
- 第一版需要选择编辑器组件承载查看能力，优先评估 Monaco Editor；如果 Monaco 不适合，再评估 CodeMirror 6。
|
||||
- 本地文件读取必须限制在当前 Mapping 目录内，禁止通过 UI 查看任意本机路径。
|
||||
|
||||
### 5.4 目录对比弹窗
|
||||
|
||||
目录对比结果应从 `FolderItemsPanel` 移到单独弹窗。
|
||||
|
||||
触发入口：
|
||||
|
||||
- 目录树节点右键菜单“与服务器文件对比”。
|
||||
- 文件列表目录行右键菜单“与服务器文件对比”。
|
||||
- 当前目录路径栏上的对比图标按钮。
|
||||
|
||||
弹窗内容：
|
||||
|
||||
- 顶部展示服务端路径、本地路径、重新对比按钮、隐藏已同步开关。
|
||||
- 支持按差异状态筛选，例如本地修改、服务器更新、本地新增、待删除。
|
||||
- 主表格展示差异项。
|
||||
- 差异项对象操作通过右键菜单触发，顶部或底部只保留刷新、筛选和已选数量等状态入口。
|
||||
|
||||
差异项操作：
|
||||
|
||||
- 获取最新版本
|
||||
- 签出
|
||||
- 新增本地文件到服务器
|
||||
- 删除
|
||||
- 撤销
|
||||
- Diff
|
||||
|
||||
说明：
|
||||
|
||||
- 目录对比是一次独立任务，不应长期占据主文件列表区域。
|
||||
- 获取最新版本遇到本地与服务器不一致时，必须展示冲突选择，用户明确选择使用服务器版本或保留本地版本后再继续。
|
||||
- 新增本地文件到服务器只处理目录对比中的 `localOnly` 项，用户选中后加入 pending add。
|
||||
- 操作完成后可以提示“重新对比以刷新结果”。
|
||||
|
||||
### 5.5 Mapping 弹窗
|
||||
|
||||
Mapping 创建应从中间内联表单改为 Dialog。
|
||||
|
||||
触发入口：
|
||||
|
||||
- 未映射目录右键菜单“映射到本地”。
|
||||
- 当前目录未映射时路径栏显示一个小型“映射”按钮。
|
||||
|
||||
弹窗字段：
|
||||
|
||||
- 服务端路径，只读。
|
||||
- 本地目录。
|
||||
- 是否立即 Get Latest。
|
||||
- 创建按钮。
|
||||
|
||||
Mapping 创建时，本地目录必须由用户选择或输入；Workspace 自动处理不代表 Mapping 本地路径自动决定。
|
||||
是否立即 Get Latest 由用户选择，可以勾选也可以不勾选。
|
||||
|
||||
### 5.6 Checkin 面板
|
||||
|
||||
Checkin 保留在右侧 Changes 面板，不使用弹窗。
|
||||
|
||||
- 右侧面板展示 Included/Excluded 列表和 comment。
|
||||
- 点击 Checkin 直接提交 Included。
|
||||
|
||||
### 5.7 Get Latest 冲突选择弹窗
|
||||
|
||||
Get Latest 遇到本地与服务器不一致时，使用集中弹窗处理，不逐个文件连续弹窗。
|
||||
|
||||
弹窗内容：
|
||||
|
||||
- 顶部展示当前操作路径、冲突数量、批量操作入口。
|
||||
- 主表格展示冲突文件列表。
|
||||
- 每个文件必须选择处理方式：使用服务器版本、保留本地版本、自动合并。
|
||||
- 每个冲突文件提供 Diff 入口，用于对比本地版本和服务器版本。
|
||||
- 支持批量选择“全部使用服务器版本”和“全部保留本地版本”。
|
||||
- 批量操作只作为快速填充选择，用户仍可对单个文件改选处理方式。
|
||||
- 自动合并只对文本文件开放，二进制文件不展示自动合并。
|
||||
- 二进制文件或无法生成文本 Diff 的文件，只允许选择使用服务器版本或保留本地版本。
|
||||
- 选择使用服务器版本时，覆盖本地文件并保持无 pending change。
|
||||
- 选择保留本地版本时，该文件需要自动进入 pending edit。
|
||||
|
||||
自动合并约束：
|
||||
|
||||
- 自动合并必须基于三份内容：共同基线版本、本地版本、服务器版本。
|
||||
- 如果后端只能提供本地和服务器两份内容，不能可靠自动合并，只能让用户选择服务器或本地。
|
||||
- 自动合并成功后，结果仍应在弹窗中标记为“已自动合并”，用户确认后再写入本地文件。
|
||||
- 自动合并结果确认应用后，作为本地修改进入 pending edit。
|
||||
- 自动合并失败或存在冲突块时，回退为手动选择服务器或本地；第一版不提供手动编辑冲突块。
|
||||
|
||||
候选实现：
|
||||
|
||||
- 自动合并算法优先评估 `node-diff3`，它提供文本三方 diff 和 merge 能力，适合在有基线版本时做行级自动合并。
|
||||
- 第一版不引入 Monaco 或 CodeMirror 作为冲突解决 UI，冲突弹窗先使用项目现有 React + Radix/shadcn 风格实现；后续如果需要代码编辑器级体验，再评估 CodeMirror MergeView 或 Monaco Diff Editor。
|
||||
|
||||
## 六、组件重构建议
|
||||
|
||||
### 6.1 路由层
|
||||
|
||||
`routes/home.tsx` 继续作为主入口，但职责应减少。
|
||||
|
||||
保留职责：
|
||||
|
||||
- 服务状态检查。
|
||||
- 连接表单状态。
|
||||
- 登录后固定 Collection。
|
||||
- 当前选中路径。
|
||||
- 左侧目录树展开路径。
|
||||
- 打开/关闭 Dialog 的全局状态。
|
||||
|
||||
移出职责：
|
||||
|
||||
- 具体文件操作实现。
|
||||
- History/Diff/Compare 详情 UI。
|
||||
- Pending Changes 细节状态。
|
||||
|
||||
### 6.2 AppShell
|
||||
|
||||
`AppShell` 应调整为纯布局组件。
|
||||
|
||||
建议变更：
|
||||
|
||||
- 删除顶部全局 `Get Latest` 和 `History` 按钮。
|
||||
- 新增左侧/右侧/底部收起按钮。
|
||||
- 顶部只展示连接状态和上下文信息。
|
||||
- `sourceList`、`inspector`、`console` 保持插槽式传入。
|
||||
|
||||
### 6.3 ServerTreePanel
|
||||
|
||||
`ServerTreePanel` 应改为固定 Collection 的目录树。
|
||||
|
||||
建议 props：
|
||||
|
||||
```ts
|
||||
interface ServerTreePanelProps {
|
||||
connected: boolean
|
||||
collection: string
|
||||
selectedPath: string
|
||||
onPathSelect(path: string): void
|
||||
onOpenContextMenu(target: TfsServerItem): void
|
||||
}
|
||||
```
|
||||
|
||||
需要移除：
|
||||
|
||||
- 内部 `collections` 状态。
|
||||
- Collection 列表渲染。
|
||||
- `onCollectionSelect`。
|
||||
- `preferredCollection`。
|
||||
- 完全内部维护的当前选中路径和展开路径。
|
||||
|
||||
### 6.4 FolderItemsPanel
|
||||
|
||||
`FolderItemsPanel` 应拆分。
|
||||
|
||||
保留：
|
||||
|
||||
- 加载当前目录 items。
|
||||
- 加载 mappings。
|
||||
- 计算 `FolderItemView`。
|
||||
- 表格选择和进入目录。
|
||||
|
||||
移出：
|
||||
|
||||
- `HistoryPanel`。
|
||||
- `DiffPanel`。
|
||||
- 目录对比状态和差异操作。
|
||||
- Mapping 创建表单。
|
||||
- 选中项底部大操作区。
|
||||
|
||||
新增回调：
|
||||
|
||||
```ts
|
||||
interface FolderItemsPanelProps {
|
||||
connected: boolean
|
||||
collection: string
|
||||
serverPath: string
|
||||
onPathEnter(path: string): void
|
||||
onOpenHistory(target: FileTarget): void
|
||||
onOpenDiff(target: FileTarget): void
|
||||
onOpenCompare(target: FileTarget): void
|
||||
onOpenMapping(target: FileTarget): void
|
||||
onRunFileOperation(action: FileAction, target: FileTarget): void
|
||||
}
|
||||
```
|
||||
|
||||
### 6.5 新增组件
|
||||
|
||||
建议新增：
|
||||
|
||||
- `components/app/collapsible-sidebar.tsx`
|
||||
- `components/app/connection-gate.tsx`
|
||||
- `components/explorer/file-context-menu.tsx`
|
||||
- `components/explorer/mapping-dialog.tsx`
|
||||
- `components/compare/folder-compare-dialog.tsx`
|
||||
- `components/history/history-dialog.tsx`
|
||||
- `components/diff/diff-dialog.tsx`
|
||||
|
||||
说明：
|
||||
|
||||
- 如果项目后续继续使用 shadcn/Radix，右键菜单和 Dialog 优先基于 Radix primitives。
|
||||
- 当前 `package.json` 已有 `radix-ui`，不需要为第一版右键菜单引入额外大型依赖。
|
||||
|
||||
## 七、推荐实施顺序
|
||||
|
||||
### 阶段一：固定 Collection 上下文
|
||||
|
||||
改动：
|
||||
|
||||
- 登录成功后加载 Collection。
|
||||
- 登录页选择 Collection 后进入工作台。
|
||||
- `ServerTreePanel` 不再渲染 Collection 列表。
|
||||
- 工作台顶部展示固定 Collection。
|
||||
|
||||
收益：
|
||||
|
||||
- 先解决后续所有面板共享上下文不稳定的问题。
|
||||
|
||||
### 阶段二：布局收缩
|
||||
|
||||
改动：
|
||||
|
||||
- `AppShell` 增加左侧、右侧、底部收起状态。
|
||||
- 删除顶部文件操作按钮。
|
||||
- 底部操作日志默认缩小或可收起。
|
||||
|
||||
收益：
|
||||
|
||||
- 立即改善中间空间不足问题。
|
||||
|
||||
### 阶段三：右键菜单
|
||||
|
||||
改动：
|
||||
|
||||
- 文件列表行接入右键菜单。
|
||||
- 目录树节点接入右键菜单。
|
||||
- Pending Changes 项接入右键菜单。
|
||||
- 将现有选中项按钮迁移到菜单动作。
|
||||
|
||||
收益：
|
||||
|
||||
- 操作与对象绑定，减少全局按钮造成的上下文歧义。
|
||||
|
||||
### 阶段四：弹窗化详情功能
|
||||
|
||||
改动：
|
||||
|
||||
- History 改为 Dialog。
|
||||
- Diff 改为 Dialog。
|
||||
- 目录对比改为 Dialog。
|
||||
- Mapping 创建改为 Dialog。
|
||||
|
||||
收益：
|
||||
|
||||
- 中间区域回归文件浏览。
|
||||
- 复杂功能获得更大展示空间。
|
||||
|
||||
### 阶段五：拆分 FolderItemsPanel
|
||||
|
||||
改动：
|
||||
|
||||
- 将 `FolderItemsPanel` 中的 History、Diff、Compare、Mapping 逻辑拆出。
|
||||
- 保留文件列表主职责。
|
||||
- 文件操作统一由 `home.tsx` 或轻量 action hook 编排。
|
||||
|
||||
收益：
|
||||
|
||||
- 降低单组件复杂度，后续维护更清晰。
|
||||
|
||||
## 八、风险与影响
|
||||
|
||||
可能影响：
|
||||
|
||||
- `routes/home.tsx`：连接、Collection、弹窗状态和工作台编排会调整。
|
||||
- `components/app/app-shell.tsx`：布局结构和顶部操作按钮会调整。
|
||||
- `components/explorer/server-tree-panel.tsx`：Collection 切换逻辑会移除。
|
||||
- `components/explorer/folder-items-panel.tsx`：会拆出大量功能。
|
||||
- `components/inspector/pending-changes-panel.tsx`：右键菜单和 Checkin 入口可能调整。
|
||||
- `components/explorer/history-panel.tsx`：会从内嵌面板改为 Dialog 内容组件。
|
||||
- `components/explorer/diff-panel.tsx`：会从内嵌面板改为 Dialog 内容组件。
|
||||
|
||||
接口影响：
|
||||
|
||||
- 现有 API 可支持部分 UI 调整，但文件查看、服务器文件内容、冲突处理和默认 Workspace 等能力需要后端补充。
|
||||
- 如果登录页要把 Collection 持久保存到后端配置，可能需要确认 `/api/session/connect` 或 `/api/config` 是否保存 `collection` 字段。
|
||||
- 如果要精确控制右键菜单启用条件，可能需要 pending changes 和映射状态在文件列表中更稳定地合并。
|
||||
|
||||
业务影响：
|
||||
|
||||
- 进入工作台后不再直接切换 Collection。
|
||||
- History、Diff、Compare 的打开方式从中间内嵌变为弹窗。
|
||||
- 文件操作入口从显式按钮为主，调整为右键菜单为主。
|
||||
|
||||
## 九、后端接口能力清单
|
||||
|
||||
后续重构前需要确认或补充以下后端能力。
|
||||
|
||||
连接与 Workspace：
|
||||
|
||||
- 登录页选择 Collection 后保存上次 Collection。
|
||||
- 根据 Collection 自动查找本机已有 Workspace。
|
||||
- 没有 Workspace 时按程序固定规则创建默认 Workspace。
|
||||
- 返回当前实际使用的 Workspace 名称和基础信息。
|
||||
|
||||
文件查看：
|
||||
|
||||
- 读取 Mapping 目录内本地文件内容，必须校验路径位于 Mapping 目录内。
|
||||
- 读取未映射文件的服务器 latest 内容。
|
||||
- 返回文件大小、是否二进制、可否文本渲染、文件编码和内容。
|
||||
- 超过 5MB 时返回大小信息，前端不直接渲染内容。
|
||||
|
||||
Diff 与历史：
|
||||
|
||||
- 获取本地文件与服务器 latest 的文本 Diff。
|
||||
- 获取两个历史 changeset 的文本 Diff。
|
||||
- 支持 Diff 前返回文件大小和二进制判断。
|
||||
- 支持文件历史和目录历史继续按弹窗使用。
|
||||
|
||||
目录对比：
|
||||
|
||||
- 返回目录差异状态，至少覆盖本地修改、服务器更新、本地新增、服务器新增、待删除、已同步。
|
||||
- 返回每个差异项是否可执行获取最新、签出、新增本地文件到服务器、删除、撤销、比较。
|
||||
- 返回 pending edit 子项，用于递归 Get Latest 时跳过并提示。
|
||||
|
||||
Get Latest 与 Checkout 冲突处理：
|
||||
|
||||
- Get Latest 文件夹递归执行。
|
||||
- pending edit 文件禁止直接 Get Latest；目录递归时跳过 pending edit 子文件并返回跳过列表。
|
||||
- Checkout 自动先 Get Latest，再签出。
|
||||
- Checkout 自动 Get Latest 遇到冲突时返回同一套冲突明细。
|
||||
- 冲突明细需要包含服务端路径、本地路径、文件大小、是否二进制、是否可自动合并。
|
||||
- 冲突文件需要支持读取本地版本、服务器 latest 版本；自动合并需要共同基线版本。
|
||||
- 支持应用用户选择：使用服务器版本、保留本地版本、自动合并结果。
|
||||
- 使用服务器版本时覆盖本地且不产生 pending change。
|
||||
- 保留本地版本时自动进入 pending edit。
|
||||
- 自动合并结果确认应用后写入本地并进入 pending edit。
|
||||
|
||||
Pending Changes：
|
||||
|
||||
- 返回 pending change 类型，用于区分 pending add、pending edit、pending delete。
|
||||
- pending add 文件不提供服务器比较。
|
||||
- 支持单项撤销、Included/Excluded 前端会话状态和 Checkin 提交 Included。
|
||||
|
||||
## 十、待确认问题
|
||||
|
||||
第一优先级问题：
|
||||
|
||||
- 更换 Collection 是否必须支持“不断开连接直接切换”？
|
||||
|
||||
推荐答案：
|
||||
|
||||
- 不支持。Collection 在登录页选定后固定，切换 Collection 需要回到连接设置重新选择。
|
||||
|
||||
原因：
|
||||
|
||||
- 这符合当前重构目标，也能最大限度减少 Mapping、Pending Changes、History、Diff 的上下文混乱。
|
||||
|
||||
第二优先级问题：
|
||||
|
||||
- Checkin 是否也要右键触发？
|
||||
|
||||
推荐答案：
|
||||
|
||||
- 不作为主要入口。右键可以提供“移到 Included/Excluded”和“撤销”，Checkin 仍放在 Changes 面板中。
|
||||
|
||||
原因：
|
||||
|
||||
- Checkin 是批量提交行为，依赖 comment 和 Included 集合，不是单文件即时动作。
|
||||
|
||||
第三优先级问题：
|
||||
|
||||
- 左右栏是否需要拖拽调整宽度？
|
||||
|
||||
推荐答案：
|
||||
|
||||
- 第一版只做展开/收起，不做拖拽。
|
||||
|
||||
原因：
|
||||
|
||||
- 当前问题的核心是空间分配和职责混杂，固定收缩已经能解决大部分问题，且改动更小。
|
||||
|
||||
## 十一、已确认决策
|
||||
|
||||
- 工作台内不支持切换 Collection。用户需要更换 Collection 时，必须回到连接设置重新选择并重新进入工作台。
|
||||
- 登录页默认选中上次使用的 Collection，但进入工作台后仍不允许切换 Collection。
|
||||
- Workspace 不允许用户手动选择；本机已有 Workspace 就自动使用，没有就创建默认 Workspace。
|
||||
- 默认 Workspace 命名规则由后端程序固定，前端只展示最终使用的 Workspace。
|
||||
- Mapping 创建时本地目录由用户选择或输入。
|
||||
- Mapping 创建后是否立即 Get Latest 由用户选择，不强制。
|
||||
- Checkin 保留在右侧 Changes 面板作为主入口，不放到单个文件或文件夹右键菜单中。
|
||||
- Checkin 不使用弹窗，右侧 Changes 面板直接展示 Included/Excluded、comment 和提交按钮。
|
||||
- 左右栏第一版只支持展开/收起，不做拖拽调整宽度。
|
||||
- History、Diff、目录对比和 Mapping 第一版都使用弹窗，不做新路由，也不继续内嵌在中间文件列表中。
|
||||
- 底部操作日志保留并支持收起，避免长期占用主工作区高度。
|
||||
- 右侧 Changes 面板收起后不显示 Pending Changes 数量徽标。
|
||||
- 左侧 Source Tree 收起后只显示展开按钮，不显示路径或图标列表。
|
||||
- 顶部工具栏移除文件和目录操作，只保留连接状态、服务器、Collection、Workspace、刷新和设置等全局入口。
|
||||
- 文件列表取消选中项底部操作区，文件和目录对象操作全部进入右键菜单。
|
||||
- 左侧目录树必须支持右键菜单，且左侧树展开/选中状态必须与中间文件列表目录导航保持一致。
|
||||
- 中间文件列表单击只选中，双击或右键“打开”才进入目录。
|
||||
- 第一版不支持键盘快捷键。
|
||||
- 当前路径和左侧目录树展开路径统一提升到 `home.tsx` 管理，再传给左侧树和中间文件列表。
|
||||
- 目录对比结果项的文件操作也使用右键菜单，不在弹窗底部或右侧额外放操作按钮区。
|
||||
- 目录对比弹窗需要支持按差异状态筛选，例如本地修改、服务器更新、本地新增、待删除。
|
||||
- 新增本地文件到服务器是文件夹级操作，只在文件夹或当前目录上下文出现，通过本地映射目录和服务器目录对比找出本地独有项，用户选中后加入 pending add。
|
||||
- 删除只对服务器已有的版本控制项执行 pending delete，不删除本地未加入服务器的 `localOnly` 文件。
|
||||
- 文件夹“与服务器目录对比”用于找出本地与服务器不同的文件，方便后续签出、新增、获取最新等操作；文件“比较本地与服务器 Latest”用于查看本地修改和服务器代码异同。
|
||||
- 右侧 Pending Changes 项必须支持右键菜单，至少包含比较本地与服务器 Latest、撤销、查看历史、移到 Included、移到 Excluded。
|
||||
- 右侧 Pending Changes 的比较入口只对文件显示，文件夹不展示内容比较。
|
||||
- pending add 文件没有服务器版本，Pending Changes 右键菜单只显示查看和撤销，不显示比较本地与服务器 Latest。
|
||||
- 文件右键菜单需要提供“查看”入口，打开只读文件查看弹窗；Pending Changes 的文件项也需要提供查看入口。
|
||||
- 文件“查看”已映射时查看本地文件，未映射时查看服务器文件。
|
||||
- 文件查看和 Diff 单个文件超过 5MB 时不直接渲染，只提示文件过大。
|
||||
- 本地文件查看必须限制在 Mapping 目录内，不能读取任意本机路径。
|
||||
- Diff 视觉效果需要升级为更清晰的弹窗左右分栏，不沿用当前紧凑表格视觉。
|
||||
- 文件查看和 Diff 第一版必须支持代码高亮、搜索和行号；优先评估 Monaco Editor，备选 CodeMirror 6。
|
||||
- 文件夹允许递归签出，但执行前必须让用户确认影响范围。
|
||||
- 获取最新版本对文件夹递归执行；如果发现本地与服务器不一致，必须由用户选择使用服务器版本或保留本地版本。
|
||||
- Get Latest 冲突选择使用集中弹窗，用户在弹窗内逐文件选择使用服务器版本、保留本地版本或自动合并。
|
||||
- Get Latest 冲突弹窗允许批量选择处理方式，但必须保留单个文件独立改选能力。
|
||||
- Get Latest 冲突弹窗中的每个冲突文件都需要提供 Diff 入口，辅助判断使用服务器、本地或自动合并。
|
||||
- Get Latest 冲突中选择使用服务器版本时，覆盖本地文件并保持无 pending change。
|
||||
- Get Latest 冲突中选择保留本地版本时，该文件需要自动签出为 pending edit。
|
||||
- 自动合并只有在后端能提供共同基线版本、本地版本和服务器版本三份内容时才启用；无基线或二进制文件不做自动合并。
|
||||
- 二进制文件或无法生成文本 Diff 的文件不展示自动合并，只允许使用服务器版本或保留本地版本。
|
||||
- 自动合并成功后不能直接写入本地，必须等用户在冲突弹窗中确认后再应用结果。
|
||||
- 自动合并结果确认应用后，需要作为本地修改进入 pending edit。
|
||||
- 自动合并失败或存在冲突块时，只回退到使用服务器版本或保留本地版本二选一；第一版不做手动冲突块编辑。
|
||||
- 已经处于 pending edit 的文件禁止直接获取最新版本；checkout 流程应先更新到最新再签出。
|
||||
- 文件夹递归获取最新版本时，如果子文件已处于 pending edit，则跳过该子文件并在结果中提示。
|
||||
- Checkout 执行时自动先获取最新版本再签出，不要求用户额外手动执行 Get Latest。
|
||||
- Checkout 自动获取最新版本时如果遇到本地与服务器不一致，复用 Get Latest 冲突选择弹窗处理。
|
||||
- Checkin 成功后刷新当前目录文件列表和 Pending Changes；只有涉及新增或删除目录时，才刷新左侧树对应节点。
|
||||
@@ -0,0 +1,91 @@
|
||||
# UIR-001 补齐后端接口能力
|
||||
|
||||
## 状态
|
||||
|
||||
todo
|
||||
|
||||
## 优先级
|
||||
|
||||
P0
|
||||
|
||||
## 所属阶段
|
||||
|
||||
frontend-refactor
|
||||
|
||||
## 依赖任务
|
||||
|
||||
- FE-013
|
||||
- SERVER-006
|
||||
- SERVER-007
|
||||
- SERVER-008
|
||||
- SERVER-009
|
||||
|
||||
## 需求来源
|
||||
|
||||
- [UIR-000-前端重构与UI功能调整方案.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend-refactor/UIR-000-前端重构与UI功能调整方案.md)
|
||||
|
||||
## 目标
|
||||
|
||||
补齐前端重构所需的后端接口能力，确保文件查看、服务器内容读取、默认 Workspace、目录对比、Get Latest / Checkout 冲突处理可以被 UI 调用。
|
||||
|
||||
## 实现范围
|
||||
|
||||
- 登录后保存上次使用的 Collection。
|
||||
- 根据 Collection 自动查找本机已有 Workspace。
|
||||
- 本机没有 Workspace 时按程序固定规则创建默认 Workspace。
|
||||
- 返回当前实际使用的 Workspace 名称和基础信息。
|
||||
- 提供 Mapping 目录内本地文件内容读取能力，并校验路径不能越过 Mapping 目录。
|
||||
- 提供未映射文件的服务器 latest 内容读取能力。
|
||||
- 文件内容接口返回文件大小、是否二进制、是否可文本渲染、文件编码和内容。
|
||||
- 文件超过 5MB 时返回大小信息，前端不直接渲染内容。
|
||||
- Diff 接口支持本地文件与服务器 latest、两个历史 changeset。
|
||||
- 目录对比接口返回差异状态、可执行动作、pending edit 子项。
|
||||
- Get Latest 支持递归、跳过 pending edit 子文件并返回跳过列表。
|
||||
- Checkout 自动先 Get Latest，再签出。
|
||||
- Get Latest / Checkout 遇到冲突时返回统一冲突明细。
|
||||
- 冲突明细包含服务端路径、本地路径、文件大小、是否二进制、是否可自动合并。
|
||||
- 支持应用冲突选择：使用服务器版本、保留本地版本、自动合并结果。
|
||||
- Pending Changes 返回 pending add / edit / delete 类型，支持菜单判断。
|
||||
|
||||
## 不在范围
|
||||
|
||||
- 不实现前端页面。
|
||||
- 不实现 Monaco 或 CodeMirror。
|
||||
- 不做手动冲突块编辑。
|
||||
- 不改变现有 TFS 协议封装以外的业务规则。
|
||||
|
||||
## 涉及文件
|
||||
|
||||
- [mactfs/src/main/java/com/mydev/mactfs](/Users/fenghp/Desktop/DEV/project/mydev/mactfs/src/main/java/com/mydev/mactfs)
|
||||
- [mactfs/src/main/java/com/mydev/mactfs/server](/Users/fenghp/Desktop/DEV/project/mydev/mactfs/src/main/java/com/mydev/mactfs/server)
|
||||
- [mactfsui/app/lib/api](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/lib/api)
|
||||
|
||||
## 验收标准
|
||||
|
||||
- 登录连接后能返回固定 Collection 和当前 Workspace。
|
||||
- 没有 Workspace 时能创建默认 Workspace。
|
||||
- 已映射文件能读取本地内容，未映射文件能读取服务器内容。
|
||||
- 非 Mapping 目录路径读取被拒绝。
|
||||
- 大于 5MB 文件不返回正文渲染内容。
|
||||
- pending add 文件不会提供服务器比较能力。
|
||||
- Get Latest / Checkout 冲突能返回前端弹窗所需明细。
|
||||
- 应用“使用服务器版本”后无 pending change。
|
||||
- 应用“保留本地版本”后进入 pending edit。
|
||||
- 自动合并结果确认应用后进入 pending edit。
|
||||
|
||||
## 测试方式
|
||||
|
||||
```bash
|
||||
cd /Users/fenghp/Desktop/DEV/project/mydev/mactfs
|
||||
../tfsIntegration/gradlew test
|
||||
../tfsIntegration/gradlew runServer
|
||||
```
|
||||
|
||||
## 完成记录
|
||||
|
||||
待完成后填写：
|
||||
|
||||
- 实际修改文件：
|
||||
- 实际实现内容：
|
||||
- 测试结果：
|
||||
- 遗留问题：
|
||||
@@ -0,0 +1,79 @@
|
||||
# UIR-002 重构登录 Collection 与 Workspace 上下文
|
||||
|
||||
## 状态
|
||||
|
||||
todo
|
||||
|
||||
## 优先级
|
||||
|
||||
P0
|
||||
|
||||
## 所属阶段
|
||||
|
||||
frontend-refactor
|
||||
|
||||
## 依赖任务
|
||||
|
||||
- UIR-001
|
||||
- FE-002
|
||||
- FE-004
|
||||
|
||||
## 需求来源
|
||||
|
||||
- [UIR-000-前端重构与UI功能调整方案.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend-refactor/UIR-000-前端重构与UI功能调整方案.md)
|
||||
|
||||
## 目标
|
||||
|
||||
将 Collection 选择前置到登录页，进入工作台后固定 Collection；Workspace 由后端自动选择或创建，前端不提供 Workspace 选择。
|
||||
|
||||
## 实现范围
|
||||
|
||||
- 登录成功后加载 Collection 列表。
|
||||
- 如果配置中有上次使用的 Collection，登录页默认选中。
|
||||
- 只有一个 Collection 时默认选中但仍展示名称。
|
||||
- 用户必须在登录页确认 Collection 后进入工作台。
|
||||
- 工作台内移除 Collection 切换入口。
|
||||
- 工作台顶部展示固定 Collection 和当前 Workspace。
|
||||
- Workspace 不允许用户手动选择。
|
||||
- 本机已有 Workspace 时自动使用，没有则由后端创建默认 Workspace。
|
||||
- `ServerTreePanel` 改为只接收固定 Collection。
|
||||
- 移除 `ServerTreePanel` 内部 Collection 列表和 `onCollectionSelect`。
|
||||
|
||||
## 不在范围
|
||||
|
||||
- 不做多 Profile。
|
||||
- 不支持工作台内切换 Collection。
|
||||
- 不允许用户选择 Workspace。
|
||||
- 不实现 Mapping 弹窗重构。
|
||||
|
||||
## 涉及文件
|
||||
|
||||
- [mactfsui/app/routes/home.tsx](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/routes/home.tsx)
|
||||
- [mactfsui/app/components/explorer/server-tree-panel.tsx](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/components/explorer/server-tree-panel.tsx)
|
||||
- [mactfsui/app/components/app/app-shell.tsx](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/components/app/app-shell.tsx)
|
||||
- [mactfsui/app/lib/api](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/lib/api)
|
||||
|
||||
## 验收标准
|
||||
|
||||
- 登录页可以选择 Collection。
|
||||
- 登录页默认选中上次使用的 Collection。
|
||||
- 进入工作台后不能切换 Collection。
|
||||
- 左侧树只展示当前固定 Collection 的目录。
|
||||
- 顶部展示服务器、Collection、Workspace。
|
||||
- 前端没有 Workspace 选择控件。
|
||||
|
||||
## 测试方式
|
||||
|
||||
```bash
|
||||
cd /Users/fenghp/Desktop/DEV/project/mydev/mactfsui
|
||||
pnpm typecheck
|
||||
```
|
||||
|
||||
## 完成记录
|
||||
|
||||
待完成后填写：
|
||||
|
||||
- 实际修改文件：
|
||||
- 实际实现内容：
|
||||
- 测试结果：
|
||||
- 遗留问题：
|
||||
@@ -0,0 +1,85 @@
|
||||
# UIR-003 重构工作台布局与同步导航
|
||||
|
||||
## 状态
|
||||
|
||||
todo
|
||||
|
||||
## 优先级
|
||||
|
||||
P0
|
||||
|
||||
## 所属阶段
|
||||
|
||||
frontend-refactor
|
||||
|
||||
## 依赖任务
|
||||
|
||||
- UIR-002
|
||||
- FE-003
|
||||
- FE-005
|
||||
- FE-013
|
||||
|
||||
## 需求来源
|
||||
|
||||
- [UIR-000-前端重构与UI功能调整方案.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend-refactor/UIR-000-前端重构与UI功能调整方案.md)
|
||||
|
||||
## 目标
|
||||
|
||||
重构主工作台布局，让左侧 Source Tree、右侧 Changes、底部操作日志都支持收起，并保证左侧树和中间文件列表导航状态一致。
|
||||
|
||||
## 实现范围
|
||||
|
||||
- `AppShell` 删除顶部文件/目录操作按钮。
|
||||
- 顶部只保留连接状态、服务器、Collection、Workspace、刷新和设置等全局入口。
|
||||
- 左侧 Source Tree 支持展开/收起。
|
||||
- 左侧收起后只显示展开按钮，不显示路径或图标列表。
|
||||
- 右侧 Changes 支持展开/收起。
|
||||
- 右侧收起后只显示展开按钮，不显示 Pending Changes 数量徽标。
|
||||
- 底部操作日志支持展开/收起。
|
||||
- 不实现拖拽调整宽度。
|
||||
- 当前路径和左侧目录树展开路径统一提升到 `home.tsx`。
|
||||
- 用户在中间双击或右键“打开”进入目录时，左侧树自动展开并选中对应节点。
|
||||
- 用户在左侧树选择目录时，中间文件列表切换到同一路径。
|
||||
- 中间文件列表单击只选中，不进入目录。
|
||||
- 第一版不支持键盘快捷键。
|
||||
|
||||
## 不在范围
|
||||
|
||||
- 不做拖拽调整宽度。
|
||||
- 不做自定义布局保存。
|
||||
- 不做键盘快捷键。
|
||||
- 不做文件查看、Diff、History 弹窗。
|
||||
|
||||
## 涉及文件
|
||||
|
||||
- [mactfsui/app/components/app/app-shell.tsx](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/components/app/app-shell.tsx)
|
||||
- [mactfsui/app/routes/home.tsx](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/routes/home.tsx)
|
||||
- [mactfsui/app/components/explorer/server-tree-panel.tsx](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/components/explorer/server-tree-panel.tsx)
|
||||
- [mactfsui/app/components/explorer/folder-items-panel.tsx](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/components/explorer/folder-items-panel.tsx)
|
||||
- [mactfsui/app/components/app/operation-log-panel.tsx](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/components/app/operation-log-panel.tsx)
|
||||
|
||||
## 验收标准
|
||||
|
||||
- 顶部不再出现 Get Latest、History 等文件操作按钮。
|
||||
- 左侧、右侧、底部可以收起和展开。
|
||||
- 收起状态只显示展开按钮。
|
||||
- 中间文件列表空间明显增大。
|
||||
- 左侧选择目录会刷新中间列表。
|
||||
- 中间进入目录会展开并选中左侧对应目录。
|
||||
- 单击文件列表行只选中，双击文件夹才进入。
|
||||
|
||||
## 测试方式
|
||||
|
||||
```bash
|
||||
cd /Users/fenghp/Desktop/DEV/project/mydev/mactfsui
|
||||
pnpm typecheck
|
||||
```
|
||||
|
||||
## 完成记录
|
||||
|
||||
待完成后填写：
|
||||
|
||||
- 实际修改文件：
|
||||
- 实际实现内容：
|
||||
- 测试结果：
|
||||
- 遗留问题：
|
||||
@@ -0,0 +1,83 @@
|
||||
# UIR-004 实现对象右键菜单
|
||||
|
||||
## 状态
|
||||
|
||||
todo
|
||||
|
||||
## 优先级
|
||||
|
||||
P0
|
||||
|
||||
## 所属阶段
|
||||
|
||||
frontend-refactor
|
||||
|
||||
## 依赖任务
|
||||
|
||||
- UIR-003
|
||||
- FE-008
|
||||
- FE-009
|
||||
|
||||
## 需求来源
|
||||
|
||||
- [UIR-000-前端重构与UI功能调整方案.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend-refactor/UIR-000-前端重构与UI功能调整方案.md)
|
||||
|
||||
## 目标
|
||||
|
||||
将文件、文件夹、目录树节点、目录对比结果项、Pending Changes 项的对象操作统一迁移到右键菜单。
|
||||
|
||||
## 实现范围
|
||||
|
||||
- 左侧目录树节点接入右键菜单。
|
||||
- 中间文件列表文件夹接入右键菜单。
|
||||
- 中间文件列表文件接入右键菜单。
|
||||
- Pending Changes Included / Excluded 项接入右键菜单。
|
||||
- 目录对比结果项接入右键菜单。
|
||||
- 取消中间文件列表选中项底部操作区。
|
||||
- 文件夹菜单包含：打开、获取最新版本、签出、新增本地文件到服务器、删除、撤销挂起更改、查看历史、与服务器目录对比、映射到本地。
|
||||
- 文件菜单包含：查看、获取最新版本、签出、删除、撤销挂起更改、查看历史、比较本地与服务器 Latest。
|
||||
- Pending Changes 文件项包含：查看、比较本地与服务器 Latest、撤销、查看历史、移到 Included、移到 Excluded。
|
||||
- Pending Changes 文件夹项不展示内容比较。
|
||||
- pending add 文件只显示查看和撤销，不显示比较本地与服务器 Latest。
|
||||
- Checkin 不放到单个文件或文件夹右键菜单。
|
||||
- 根据 mapped、pending edit、pending add、folder、localPath 等状态控制菜单可用性。
|
||||
|
||||
## 不在范围
|
||||
|
||||
- 不实现具体弹窗内容。
|
||||
- 不实现键盘快捷键。
|
||||
- 不实现 Checkin 弹窗。
|
||||
- 不实现手动冲突块编辑。
|
||||
|
||||
## 涉及文件
|
||||
|
||||
- [mactfsui/app/components/explorer/server-tree-panel.tsx](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/components/explorer/server-tree-panel.tsx)
|
||||
- [mactfsui/app/components/explorer/folder-items-panel.tsx](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/components/explorer/folder-items-panel.tsx)
|
||||
- [mactfsui/app/components/inspector/pending-changes-panel.tsx](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/components/inspector/pending-changes-panel.tsx)
|
||||
- [mactfsui/app/components](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/components)
|
||||
|
||||
## 验收标准
|
||||
|
||||
- 左侧树、文件列表、Pending Changes 均可打开右键菜单。
|
||||
- 顶部和底部不再承担文件对象操作。
|
||||
- pending edit 文件禁止直接 Get Latest。
|
||||
- pending add 文件不显示服务器比较。
|
||||
- 文件夹与服务器目录对比入口可用。
|
||||
- 文件比较本地与服务器 Latest 入口可用。
|
||||
- Checkin 仍只在右侧 Changes 面板提交 Included Changes。
|
||||
|
||||
## 测试方式
|
||||
|
||||
```bash
|
||||
cd /Users/fenghp/Desktop/DEV/project/mydev/mactfsui
|
||||
pnpm typecheck
|
||||
```
|
||||
|
||||
## 完成记录
|
||||
|
||||
待完成后填写：
|
||||
|
||||
- 实际修改文件：
|
||||
- 实际实现内容：
|
||||
- 测试结果：
|
||||
- 遗留问题：
|
||||
@@ -0,0 +1,81 @@
|
||||
# UIR-005 实现 Mapping、History、目录对比弹窗
|
||||
|
||||
## 状态
|
||||
|
||||
todo
|
||||
|
||||
## 优先级
|
||||
|
||||
P0
|
||||
|
||||
## 所属阶段
|
||||
|
||||
frontend-refactor
|
||||
|
||||
## 依赖任务
|
||||
|
||||
- UIR-004
|
||||
- FE-006
|
||||
- FE-007
|
||||
- FE-011
|
||||
|
||||
## 需求来源
|
||||
|
||||
- [UIR-000-前端重构与UI功能调整方案.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend-refactor/UIR-000-前端重构与UI功能调整方案.md)
|
||||
|
||||
## 目标
|
||||
|
||||
将 Mapping、History、目录对比从中间文件列表内嵌区域迁移到弹窗，释放主工作区空间。
|
||||
|
||||
## 实现范围
|
||||
|
||||
- Mapping 创建改为弹窗。
|
||||
- Mapping 弹窗展示服务端路径、本地目录、是否立即 Get Latest、创建按钮。
|
||||
- Mapping 本地目录由用户选择或输入。
|
||||
- 是否立即 Get Latest 由用户选择，不强制。
|
||||
- History 改为大尺寸弹窗。
|
||||
- History 弹窗展示目标路径、changeset 列表、目录 changeset 文件列表。
|
||||
- History 文件版本支持进入 Diff。
|
||||
- 目录对比改为弹窗。
|
||||
- 目录对比弹窗展示服务端路径、本地路径、重新对比、隐藏已同步。
|
||||
- 目录对比弹窗支持按状态筛选，例如本地修改、服务器更新、本地新增、待删除。
|
||||
- 目录对比结果项操作使用右键菜单。
|
||||
- 新增本地文件到服务器只处理 `localOnly` 项，用户选中后加入 pending add。
|
||||
|
||||
## 不在范围
|
||||
|
||||
- 不实现文件查看弹窗。
|
||||
- 不实现 Diff 编辑器升级。
|
||||
- 不实现 Get Latest 冲突弹窗。
|
||||
- 不做新路由。
|
||||
|
||||
## 涉及文件
|
||||
|
||||
- [mactfsui/app/components/explorer/folder-items-panel.tsx](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/components/explorer/folder-items-panel.tsx)
|
||||
- [mactfsui/app/components/explorer/history-panel.tsx](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/components/explorer/history-panel.tsx)
|
||||
- [mactfsui/app/routes/home.tsx](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/routes/home.tsx)
|
||||
- [mactfsui/app/components](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/components)
|
||||
|
||||
## 验收标准
|
||||
|
||||
- 中间文件列表不再内嵌 Mapping 表单、History 面板、目录对比结果。
|
||||
- 未映射目录可以通过弹窗创建 Mapping。
|
||||
- History 弹窗可以展示文件或目录历史。
|
||||
- 目录对比弹窗可以筛选差异状态。
|
||||
- 目录对比结果项通过右键菜单执行对象操作。
|
||||
|
||||
## 测试方式
|
||||
|
||||
```bash
|
||||
cd /Users/fenghp/Desktop/DEV/project/mydev/mactfsui
|
||||
pnpm typecheck
|
||||
```
|
||||
|
||||
## 完成记录
|
||||
|
||||
待完成后填写：
|
||||
|
||||
- 实际修改文件：
|
||||
- 实际实现内容：
|
||||
- 测试结果：
|
||||
- 遗留问题：
|
||||
@@ -0,0 +1,81 @@
|
||||
# UIR-006 实现文件查看与 Diff 编辑器
|
||||
|
||||
## 状态
|
||||
|
||||
todo
|
||||
|
||||
## 优先级
|
||||
|
||||
P0
|
||||
|
||||
## 所属阶段
|
||||
|
||||
frontend-refactor
|
||||
|
||||
## 依赖任务
|
||||
|
||||
- UIR-001
|
||||
- UIR-004
|
||||
- FE-012
|
||||
|
||||
## 需求来源
|
||||
|
||||
- [UIR-000-前端重构与UI功能调整方案.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend-refactor/UIR-000-前端重构与UI功能调整方案.md)
|
||||
|
||||
## 目标
|
||||
|
||||
实现文件只读查看弹窗和视觉升级后的 Diff 弹窗，支持代码高亮、搜索、行号和清晰的左右分栏对比。
|
||||
|
||||
## 实现范围
|
||||
|
||||
- 文件右键“查看”打开只读文件查看弹窗。
|
||||
- Pending Changes 文件项右键“查看”打开只读文件查看弹窗。
|
||||
- 已映射文件查看本地文件。
|
||||
- 未映射文件查看服务器 latest 文件。
|
||||
- 文件查看弹窗标识当前查看来源：本地文件或服务器文件。
|
||||
- 文件查看支持代码高亮、搜索、行号和滚动区域。
|
||||
- 单个文件超过 5MB 时不直接渲染，只提示文件过大。
|
||||
- 本地文件查看必须限制在 Mapping 目录内。
|
||||
- 二进制文件或无法读取文件展示明确提示。
|
||||
- Diff 弹窗改为清晰左右分栏。
|
||||
- Diff 支持代码高亮、搜索、行号、差异高亮、文件路径、版本标签、刷新入口。
|
||||
- 优先评估 Monaco Editor；如果 Monaco 不适合，再评估 CodeMirror 6。
|
||||
|
||||
## 不在范围
|
||||
|
||||
- 不提供文件编辑能力。
|
||||
- 不做手动冲突块编辑。
|
||||
- 不做多文件 Diff 标签页。
|
||||
- 不做大于 5MB 文件渲染。
|
||||
|
||||
## 涉及文件
|
||||
|
||||
- [mactfsui/package.json](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/package.json)
|
||||
- [mactfsui/app/components/explorer/diff-panel.tsx](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/components/explorer/diff-panel.tsx)
|
||||
- [mactfsui/app/components](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/components)
|
||||
- [mactfsui/app/lib/api](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/lib/api)
|
||||
|
||||
## 验收标准
|
||||
|
||||
- 文件查看弹窗可以查看本地映射文件。
|
||||
- 未映射文件可以查看服务器内容。
|
||||
- 查看弹窗有代码高亮、搜索和行号。
|
||||
- Diff 弹窗有左右分栏、代码高亮、搜索、行号和差异高亮。
|
||||
- 大于 5MB 文件不渲染内容。
|
||||
- 本地非 Mapping 路径不能被查看。
|
||||
|
||||
## 测试方式
|
||||
|
||||
```bash
|
||||
cd /Users/fenghp/Desktop/DEV/project/mydev/mactfsui
|
||||
pnpm typecheck
|
||||
```
|
||||
|
||||
## 完成记录
|
||||
|
||||
待完成后填写：
|
||||
|
||||
- 实际修改文件：
|
||||
- 实际实现内容：
|
||||
- 测试结果：
|
||||
- 遗留问题：
|
||||
@@ -0,0 +1,89 @@
|
||||
# UIR-007 实现 Get Latest 与 Checkout 冲突流程
|
||||
|
||||
## 状态
|
||||
|
||||
todo
|
||||
|
||||
## 优先级
|
||||
|
||||
P0
|
||||
|
||||
## 所属阶段
|
||||
|
||||
frontend-refactor
|
||||
|
||||
## 依赖任务
|
||||
|
||||
- UIR-001
|
||||
- UIR-006
|
||||
- FE-009
|
||||
|
||||
## 需求来源
|
||||
|
||||
- [UIR-000-前端重构与UI功能调整方案.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend-refactor/UIR-000-前端重构与UI功能调整方案.md)
|
||||
|
||||
## 目标
|
||||
|
||||
实现 Get Latest / Checkout 的统一冲突选择弹窗，支持逐文件选择服务器版本、本地版本或自动合并。
|
||||
|
||||
## 实现范围
|
||||
|
||||
- Get Latest 对文件夹递归执行。
|
||||
- pending edit 文件禁止直接 Get Latest。
|
||||
- 文件夹递归 Get Latest 遇到 pending edit 子文件时跳过并提示。
|
||||
- Checkout 自动先 Get Latest，再签出。
|
||||
- Checkout 自动 Get Latest 遇到冲突时复用同一个冲突弹窗。
|
||||
- 冲突弹窗集中展示冲突文件列表。
|
||||
- 每个冲突文件可选择使用服务器版本、保留本地版本、自动合并。
|
||||
- 支持批量全部使用服务器版本。
|
||||
- 支持批量全部保留本地版本。
|
||||
- 批量操作后仍允许单文件改选。
|
||||
- 每个冲突文件提供 Diff 入口。
|
||||
- 二进制或无法文本 Diff 的文件不展示自动合并。
|
||||
- 使用服务器版本时覆盖本地且保持无 pending change。
|
||||
- 保留本地版本时自动签出为 pending edit。
|
||||
- 自动合并需要共同基线版本、本地版本、服务器版本。
|
||||
- 自动合并成功后用户确认再应用。
|
||||
- 自动合并结果应用后进入 pending edit。
|
||||
- 自动合并失败或存在冲突块时，只回退到服务器/本地二选一。
|
||||
|
||||
## 不在范围
|
||||
|
||||
- 不实现手动冲突块编辑。
|
||||
- 不对二进制文件做自动合并。
|
||||
- 不支持 pending edit 文件直接 Get Latest。
|
||||
|
||||
## 涉及文件
|
||||
|
||||
- [mactfsui/app/routes/home.tsx](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/routes/home.tsx)
|
||||
- [mactfsui/app/components](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/components)
|
||||
- [mactfsui/app/lib/api](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/lib/api)
|
||||
|
||||
## 验收标准
|
||||
|
||||
- 文件夹 Get Latest 可以递归执行。
|
||||
- pending edit 文件右键不允许直接 Get Latest。
|
||||
- 递归 Get Latest 跳过 pending edit 子文件并提示。
|
||||
- Checkout 自动先 Get Latest。
|
||||
- Checkout 冲突复用 Get Latest 冲突弹窗。
|
||||
- 冲突弹窗支持批量和单项选择。
|
||||
- 冲突文件可以打开 Diff。
|
||||
- 使用服务器版本后无 pending change。
|
||||
- 保留本地版本后进入 pending edit。
|
||||
- 自动合并结果确认后进入 pending edit。
|
||||
|
||||
## 测试方式
|
||||
|
||||
```bash
|
||||
cd /Users/fenghp/Desktop/DEV/project/mydev/mactfsui
|
||||
pnpm typecheck
|
||||
```
|
||||
|
||||
## 完成记录
|
||||
|
||||
待完成后填写：
|
||||
|
||||
- 实际修改文件：
|
||||
- 实际实现内容：
|
||||
- 测试结果：
|
||||
- 遗留问题：
|
||||
@@ -0,0 +1,79 @@
|
||||
# UIR-008 重构 Pending Changes 与 Checkin 体验
|
||||
|
||||
## 状态
|
||||
|
||||
todo
|
||||
|
||||
## 优先级
|
||||
|
||||
P0
|
||||
|
||||
## 所属阶段
|
||||
|
||||
frontend-refactor
|
||||
|
||||
## 依赖任务
|
||||
|
||||
- UIR-004
|
||||
- UIR-006
|
||||
- FE-008
|
||||
- FE-010
|
||||
|
||||
## 需求来源
|
||||
|
||||
- [UIR-000-前端重构与UI功能调整方案.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend-refactor/UIR-000-前端重构与UI功能调整方案.md)
|
||||
|
||||
## 目标
|
||||
|
||||
保留右侧 Changes 面板作为 Checkin 主入口，并为 Pending Changes 项完善右键菜单和刷新策略。
|
||||
|
||||
## 实现范围
|
||||
|
||||
- Checkin 保留在右侧 Changes 面板。
|
||||
- 不实现 Checkin 弹窗。
|
||||
- 右侧面板直接展示 Included / Excluded、comment 和提交按钮。
|
||||
- Pending Changes 项支持右键菜单。
|
||||
- 文件项支持查看、比较本地与服务器 Latest、撤销、查看历史、移到 Included、移到 Excluded。
|
||||
- 文件夹项不展示内容比较。
|
||||
- pending add 文件只显示查看和撤销，不显示服务器比较。
|
||||
- 撤销指定 pending change 后刷新 Pending Changes。
|
||||
- Checkin 成功后刷新当前目录文件列表和 Pending Changes。
|
||||
- 只有涉及新增或删除目录时，刷新左侧树对应节点。
|
||||
|
||||
## 不在范围
|
||||
|
||||
- 不实现 Checkin Dialog。
|
||||
- 不做 Work Item。
|
||||
- 不做 Check-in Policy UI。
|
||||
- 不做右侧收起数量徽标。
|
||||
|
||||
## 涉及文件
|
||||
|
||||
- [mactfsui/app/components/inspector/pending-changes-panel.tsx](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/components/inspector/pending-changes-panel.tsx)
|
||||
- [mactfsui/app/routes/home.tsx](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/routes/home.tsx)
|
||||
- [mactfsui/app/lib/api](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/lib/api)
|
||||
|
||||
## 验收标准
|
||||
|
||||
- Checkin 不使用弹窗。
|
||||
- Included / Excluded 仍可维护。
|
||||
- Pending Changes 项右键菜单可用。
|
||||
- pending add 文件没有比较入口。
|
||||
- Checkin 成功后 Pending Changes 清空或更新。
|
||||
- 当前目录状态刷新。
|
||||
|
||||
## 测试方式
|
||||
|
||||
```bash
|
||||
cd /Users/fenghp/Desktop/DEV/project/mydev/mactfsui
|
||||
pnpm typecheck
|
||||
```
|
||||
|
||||
## 完成记录
|
||||
|
||||
待完成后填写：
|
||||
|
||||
- 实际修改文件：
|
||||
- 实际实现内容：
|
||||
- 测试结果：
|
||||
- 遗留问题：
|
||||
@@ -0,0 +1,79 @@
|
||||
# UIR-009 拆分 FolderItemsPanel 与动作编排
|
||||
|
||||
## 状态
|
||||
|
||||
todo
|
||||
|
||||
## 优先级
|
||||
|
||||
P1
|
||||
|
||||
## 所属阶段
|
||||
|
||||
frontend-refactor
|
||||
|
||||
## 依赖任务
|
||||
|
||||
- UIR-005
|
||||
- UIR-006
|
||||
- UIR-007
|
||||
- UIR-008
|
||||
|
||||
## 需求来源
|
||||
|
||||
- [UIR-000-前端重构与UI功能调整方案.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend-refactor/UIR-000-前端重构与UI功能调整方案.md)
|
||||
|
||||
## 目标
|
||||
|
||||
拆分当前过重的 `FolderItemsPanel`，让中间文件列表只负责目录项展示、选择和进入目录，复杂功能由弹窗和动作编排承担。
|
||||
|
||||
## 实现范围
|
||||
|
||||
- `FolderItemsPanel` 保留加载当前目录 items。
|
||||
- 保留加载 mappings 和计算 `FolderItemView`。
|
||||
- 保留表格选择和双击进入目录。
|
||||
- 移除内嵌 History。
|
||||
- 移除内嵌 Diff。
|
||||
- 移除目录对比状态和差异操作。
|
||||
- 移除 Mapping 创建表单。
|
||||
- 移除选中项底部操作区。
|
||||
- 在 `home.tsx` 或轻量 action hook 中编排弹窗打开和文件操作。
|
||||
- 统一 FileTarget / FileAction 类型，供右键菜单、弹窗和操作函数复用。
|
||||
- 保持项目现有风格，不引入大型状态库。
|
||||
|
||||
## 不在范围
|
||||
|
||||
- 不引入 Redux、Zustand、TanStack Query。
|
||||
- 不重构无关 API client。
|
||||
- 不改变已确认业务规则。
|
||||
|
||||
## 涉及文件
|
||||
|
||||
- [mactfsui/app/components/explorer/folder-items-panel.tsx](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/components/explorer/folder-items-panel.tsx)
|
||||
- [mactfsui/app/routes/home.tsx](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/routes/home.tsx)
|
||||
- [mactfsui/app/components](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/components)
|
||||
- [mactfsui/app/lib](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui/app/lib)
|
||||
|
||||
## 验收标准
|
||||
|
||||
- `FolderItemsPanel` 不再包含 History、Diff、Compare、Mapping 大块 JSX。
|
||||
- 中间文件列表只展示目录项和必要状态。
|
||||
- 所有对象操作仍可通过右键菜单触发。
|
||||
- 弹窗打开和关闭状态清晰可维护。
|
||||
- `pnpm typecheck` 通过。
|
||||
|
||||
## 测试方式
|
||||
|
||||
```bash
|
||||
cd /Users/fenghp/Desktop/DEV/project/mydev/mactfsui
|
||||
pnpm typecheck
|
||||
```
|
||||
|
||||
## 完成记录
|
||||
|
||||
待完成后填写：
|
||||
|
||||
- 实际修改文件：
|
||||
- 实际实现内容：
|
||||
- 测试结果：
|
||||
- 遗留问题：
|
||||
@@ -0,0 +1,90 @@
|
||||
# UIR-010 前端重构端到端验收
|
||||
|
||||
## 状态
|
||||
|
||||
todo
|
||||
|
||||
## 优先级
|
||||
|
||||
P0
|
||||
|
||||
## 所属阶段
|
||||
|
||||
frontend-refactor
|
||||
|
||||
## 依赖任务
|
||||
|
||||
- UIR-001
|
||||
- UIR-002
|
||||
- UIR-003
|
||||
- UIR-004
|
||||
- UIR-005
|
||||
- UIR-006
|
||||
- UIR-007
|
||||
- UIR-008
|
||||
- UIR-009
|
||||
|
||||
## 需求来源
|
||||
|
||||
- [UIR-000-前端重构与UI功能调整方案.md](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend-refactor/UIR-000-前端重构与UI功能调整方案.md)
|
||||
|
||||
## 目标
|
||||
|
||||
对前端重构后的核心流程做端到端验收，确认工作台布局、右键菜单、弹窗、文件查看、Diff、冲突处理、Checkin 都符合设计方案。
|
||||
|
||||
## 实现范围
|
||||
|
||||
- 验证登录页 Collection 默认选中和固定上下文。
|
||||
- 验证 Workspace 自动使用或创建。
|
||||
- 验证工作台左右和底部收起。
|
||||
- 验证左侧树和中间文件列表同步导航。
|
||||
- 验证左侧树、文件列表、Pending Changes 右键菜单。
|
||||
- 验证 Mapping 弹窗。
|
||||
- 验证 History 弹窗。
|
||||
- 验证目录对比弹窗和状态筛选。
|
||||
- 验证文件查看弹窗代码高亮、搜索、行号。
|
||||
- 验证 Diff 弹窗左右分栏、搜索、行号、差异高亮。
|
||||
- 验证 Get Latest 递归、pending edit 跳过、冲突弹窗。
|
||||
- 验证 Checkout 自动 Get Latest 和冲突复用。
|
||||
- 验证 Pending Changes 右键撤销、查看、比较、Included/Excluded。
|
||||
- 验证 Checkin 后刷新当前目录和 Pending Changes。
|
||||
|
||||
## 不在范围
|
||||
|
||||
- 不做 Release 打包。
|
||||
- 不做 Work Item。
|
||||
- 不做 Check-in Policy UI。
|
||||
- 不做手动冲突块编辑。
|
||||
|
||||
## 涉及文件
|
||||
|
||||
- [mactfsui](/Users/fenghp/Desktop/DEV/project/mydev/mactfsui)
|
||||
- [testing](/Users/fenghp/Desktop/DEV/project/mydev/testing)
|
||||
- [task/frontend-refactor](/Users/fenghp/Desktop/DEV/project/mydev/task/frontend-refactor)
|
||||
|
||||
## 验收标准
|
||||
|
||||
- 所有 UIR 阶段任务通过 `pnpm typecheck`。
|
||||
- Electron 环境下可以完成登录、浏览、Mapping、目录对比、文件查看、Diff、Get Latest、Checkout、Pending Changes、Checkin 基本流程。
|
||||
- 未映射文件查看服务器内容。
|
||||
- 已映射文件查看本地内容。
|
||||
- 大文件不直接渲染。
|
||||
- 本地非 Mapping 路径不能查看。
|
||||
- 冲突处理三种选择结果符合文档。
|
||||
|
||||
## 测试方式
|
||||
|
||||
```bash
|
||||
cd /Users/fenghp/Desktop/DEV/project/mydev/mactfsui
|
||||
pnpm typecheck
|
||||
pnpm electron:dev
|
||||
```
|
||||
|
||||
## 完成记录
|
||||
|
||||
待完成后填写：
|
||||
|
||||
- 实际修改文件：
|
||||
- 实际实现内容：
|
||||
- 测试结果：
|
||||
- 遗留问题：
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user