# 5.2.XX管理模块设计说明

## 5.2.1.XX设计说明。

### 5.2.1.1.模块描述。

本模块用于支持“拖拽式选择操作”，允许用户将目标转换/打开文件拖拽到操作区完成文件选择。  
当前项目已实现的核心场景为：

1. 在“文件管理”页面拖拽文件条目。
2. 在“侧边栏模型管理”操作区释放文件并触发打开流程。
3. 支持拖拽高亮、类型识别、路径解析、连接状态校验、结果通知。

对应实现位置：

1. `src/components/pages/FileManagementPage.vue`（拖拽源、拖拽数据封装）
2. `src/components/layout/CadSidebar.vue`（拖拽目标区、释放处理、业务执行）
3. `src/stores/cad.js`（CAD连接状态）

### ·5.2.1.2.功能·。

1. 支持拖拽进入操作区高亮反馈（`isDragOver` 控制 `drop-active/high-light` 样式）。
2. 支持内部拖拽数据传递：
   - 通过 `application/json` 与 `text/plain` 双通道写入 `dataTransfer`。
   - 传递字段：`filePath`、`filename`、`extension`。
3. 支持外部文件拖拽识别（OS -> 应用）：
   - 若可读取 `file.path`，可继续处理。
   - 若浏览器安全限制导致无完整路径，给出“不支持外部拖拽”提示。
4. 支持释放后业务联动：
   - 校验当前是否已连接 CAD。
   - 自动切换“打开模型文件”选项。
   - 当 CAD 为 Creo 时调用 `creoApi.openModelFile(filePath)` 打开。
5. 支持异常分支提示：
   - 文件路径无法识别。
   - 未连接 CAD。
   - 当前 CAD 不支持拖拽打开。
   - API 调用失败。

### 5.2.1.3.性能。

1. 拖拽事件处理为前端轻量逻辑，主要为状态切换与 JSON 解析，单次处理开销低。
2. 拖拽高亮只更新一个响应式状态（`isDragOver`），不会触发重计算链路。
3. 数据传输仅传递必要字段，不传输文件内容，降低序列化/反序列化开销。
4. 主要耗时在后端/API 打开模型阶段（网络与 CAD 软件响应），前端已通过通知反馈处理进度状态。

### 5.2.1.4.输入输出项·。

#### 1.字段输入输出。

输入字段：

1. `file.absolute_path`（拖拽源记录的绝对路径，映射为 `filePath`）
2. `file.filename`
3. `file.extension`
4. `event.dataTransfer.files`（外部拖拽文件列表）
5. `cadStore.currentCAD`（当前连接 CAD 对象）

输出字段：

1. `filePath`（释放后最终用于打开模型的路径）
2. `fileName`（通知展示名）
3. `openResult.success`（打开结果状态）
4. `modelResult.data`（成功后模型详情，用于展示）

#### 2.界面交互输入输出。

输入交互：

1. 用户在文件列表行触发 `dragstart`。
2. 用户在侧边栏操作区触发 `dragover`/`dragleave`/`drop`。

输出交互：

1. 拖拽悬停高亮显示。
2. 释放后弹出通知（进行中/成功/失败/警告）。
3. 成功时触发模型展示事件（`show-model-viewer`）。

### 5.2.1.5.算法

核心判定算法（释放阶段）：

1. 初始化 `filePath/fileName` 为空。
2. 若 `dataTransfer.files` 有值，按外部拖拽路径分支处理：
   - `file.path` 存在 -> 取路径。
   - `file.path` 不存在 -> 返回“不支持外部拖拽”。
3. 否则读取内部拖拽数据：
   - 先取 `application/json`，为空再取 `text/plain`。
   - JSON 反序列化并提取 `filePath`。
4. `filePath` 为空则终止并提示。
5. 校验 `cadStore.currentCAD`：
   - 未连接则终止并提示。
6. 若 CAD=Creo，调用打开接口并查询当前模型。
7. 其余 CAD 按统一拖拽打开流程执行并返回结果。

### 5.2.1.6.流程逻辑

1. 文件管理页拖拽开始 -> 封装 `{ filePath, filename, extension }`。
2. 目标区拖拽悬停 -> 显示高亮。
3. 释放事件触发 -> 读取并解析拖拽数据。
4. 校验数据完整性（路径）与系统状态（已连接 CAD）。
5. 执行具体 CAD 打开逻辑（当前为 Creo）。
6. 返回结果并更新 UI（通知、模型展示、当前项目名）。

### ·5.2.1.7.接口。

前端事件接口：

1. `handleDragStart(event, file)`：封装拖拽负载。
2. `handleDragOver(event)`：设置 `dropEffect='copy'` 与高亮状态。
3. `handleDragLeave(event)`：取消高亮状态。
4. `handleDrop(event)`：解析数据并触发打开流程。
5. `openModel(fileInfo)`：根据 CAD 类型执行打开。

后端/服务接口：

1. `creoApi.openModelFile(filePath)`：请求 Creo 打开模型文件。
2. `creoApi.getCurrentModel()`：获取当前模型详情。

状态接口：

1. `cadStore.currentCAD`：读取当前连接 CAD。
2. `cadStore.setCurrentProjectName(name)`：更新项目名。

### 5.2.1.8.注释设计

建议注释分层如下：

1. 事件层注释：标注“拖拽源/拖拽目标/释放处理”三段职责。
2. 兼容层注释：说明 `application/json` + `text/plain` 双 MIME 设计目的。
3. 安全层注释：说明外部拖拽无法获取完整路径的浏览器限制。
4. 业务层注释：说明多 CAD 拖拽打开的一致性流程与边界条件。

### 5.2.1.9.数据结构。

拖拽负载结构（内部协议）：

```
{
  "filePath": "D:\\CAD\\part.prt",
  "filename": "part.prt",
  "extension": ".prt"
}
```

运行时关键状态结构：

1. `isDragOver: boolean`（目标区高亮状态）
2. `currentCAD: { id, name, connected, ... } | null`
3. `openResult: { success: boolean, error?: string }`

模块约束说明：

1. 文件打开依赖“完整绝对路径”。
2. 多 CAD 场景均支持拖拽打开并执行标准校验流程。
3. 外部拖拽可读取路径与否取决于运行环境与安全策略。
