# Satisfactory 蓝图编辑器文档

## 项目概述

这个项目是一个用于《Satisfactory》游戏的蓝图编辑器，允许玩家上传、编辑和导出游戏蓝图文件(.sbp/.sbpcfg)。编辑器提供了JSON编辑和图形化编辑两种方式，让玩家可以轻松修改蓝图的各种属性。

## 功能特点

### 1. 蓝图文件导入
- 支持拖放上传或点击上传
- 支持.sbp（主蓝图文件）和.sbpcfg（配置文件）
- 显示上传文件的基本信息

### 2. JSON编辑器
- 将蓝图文件解析为可编辑的JSON格式
- 支持格式化JSON
- 可刷新和更新JSON数据
- 可选择是否显示Objects段（包含大量实体数据）

### 3. 图形化编辑器
- **基础编辑**：
  - 蓝图基本信息（名称、尺寸）
  - 配置信息（版本、图标、描述、颜色等）
  - 头部信息（版本号）
  - 物品消耗管理
  - 配方引用管理

- **进阶编辑**：
  - 实体列表浏览
  - 实体位置编辑（旋转、平移、缩放）
  - 属性编辑（添加/删除/修改属性）
  - 组件编辑
  - 附属组件编辑

### 4. 蓝图导出
- 将编辑后的JSON导出为.sbp和.sbpcfg文件
- 显示导出状态

## 技术栈

- **前端框架**：Vue 3
- **UI库**：DaisyUI (https://github.com/saadeghi/daisyui)
- **蓝图解析库**：@etothepii/satisfactory-file-parser (https://github.com/etothepii4/satisfactory-file-parser)

- **图标库**：Font Awesome

## 安装与使用

### 安装依赖
```bash
npm install
```

### 开发模式
```bash
npm run dev
```

### 生产构建
```bash
npm run build
```

## 项目结构

```
src/
├── components
├── App.vue (主组件)
└── main.js
```

## 主要组件说明

### BlueprintEditor.vue

这是应用的核心组件，包含所有蓝图编辑功能：

#### 状态管理
- `uploadedFiles`: 存储上传的文件
- `blueprintData`: 存储解析后的蓝图数据
- `rawObjects/newObjects`: 存储蓝图中的实体对象
- `isParsing/isExporting`: 处理状态标志

#### 主要方法
- `parseBlueprint()`: 解析上传的蓝图文件
- `exportBlueprint()`: 导出编辑后的蓝图
- `formatJson()`: 格式化JSON显示
- `updateDataFromJson()`: 从JSON更新数据

#### 实体编辑功能
- `selectEntity()`: 选择要编辑的实体
- `updateEntityFromJson()`: 更新实体数据
- `addProperty()`: 添加新属性
- `deleteProperty()`: 删除属性

## 注意事项

1. **Objects段警告**：Objects段包含大量实体数据，对于大型蓝图，开启此选项可能导致性能问题。

2. **文件格式**：仅支持Satisfactory U8+版本的蓝图文件。

3. **数据安全**：编辑蓝图时建议备份原始文件，以防意外修改导致蓝图损坏。