web-map/docs/批量编辑功能使用说明.md

118 lines
3.6 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

# 批量编辑功能使用说明
## 🎯 功能概述
批量编辑功能允许用户在场景编辑器中同时选中多个点位和路线,并批量修改它们的属性,大大提升了编辑效率。
## ✨ 主要功能
### 1. 批量选中
- **鼠标拖动选中**:在编辑模式下,可以通过鼠标拖动框选多个点位和路线
- **实时计数**:工具栏会显示当前选中的元素数量
- **清除选择**:一键清除所有选中状态
### 2. 批量编辑点位
- **点位类型**:支持修改点位类型
- 普通点
- 等待点
- 避让点
- 临时避让点
- 库区点
- 电梯点
- 自动门点
- 充电点
- 停靠点
- 动作点
- 禁行点
### 3. 批量编辑路线
- **通行类型**
- 无限制
- 仅空载可通行
- 仅载货可通行
- 禁行
## 🚀 使用方法
### 步骤 1启用编辑器
1. 打开场景编辑器页面
2. 点击右上角的"启用编辑器"按钮
3. 编辑器工具栏和批量编辑工具栏将出现在页面上
### 步骤 2批量选中元素
1. 在画布上按住鼠标左键
2. 拖动鼠标框选需要编辑的点位和路线
3. 选中的元素会高亮显示
4. 批量编辑工具栏会显示选中元素的数量
### 步骤 3批量编辑
1. 点击"批量编辑"按钮打开编辑面板
2. 根据需要选择要修改的属性:
- 如果选中了点位,可以修改点位类型
- 如果选中了路线,可以修改路线类型、通行类型和方向
3. 在预览区域查看即将应用的更改
4. 点击"确定"应用更改,或点击"取消"放弃更改
### 步骤 4清除选择
- 点击"清除选择"按钮可以取消所有选中状态
- 或者直接点击画布空白区域也可以清除选择
## 🎨 界面说明
### 批量编辑工具栏
- 位置:页面顶部中央(仅在选中元素时显示)
- 功能:显示选中数量、打开批量编辑面板、清除选择
### 批量编辑面板
- **选中统计**:显示选中的点位和路线数量
- **点位编辑区**:当选中点位时显示,用于修改点位类型
- **路线编辑区**:当选中路线时显示,用于修改路线通行类型
- **预览区域**:显示即将应用的更改,方便确认
## 💡 使用技巧
1. **混合选择**:可以同时选中点位和路线进行批量编辑
2. **部分更新**:只修改需要更改的属性,其他属性保持不变
3. **预览确认**:在应用更改前,预览区域会显示所有即将修改的内容
4. **撤销支持**所有批量编辑操作都支持撤销Ctrl+Z
## 🔧 技术实现
- **响应式设计**:基于 Vue 3 Composition API
- **类型安全**:完整的 TypeScript 类型定义
- **性能优化**:批量更新减少渲染次数,自动触发画布重绘
- **用户体验**:实时预览和撤销支持,紧凑的弹框设计
## 📝 注意事项
1. 批量编辑功能仅在编辑模式下可用
2. 选中的元素必须是点位point或路线line类型
3. 区域area和机器人robot元素不支持批量编辑
4. 所有更改都会记录在编辑历史中,支持撤销操作
## 🐛 故障排除
### 问题:批量编辑按钮不可用
- **原因**:没有选中任何元素
- **解决**:先通过鼠标拖动选中需要编辑的点位或路线
### 问题:编辑面板中没有显示选项
- **原因**:选中的元素类型不支持该编辑选项
- **解决**:确保选中的是点位或路线类型的元素
### 问题:更改没有生效
- **原因**:可能没有点击"确定"按钮
- **解决**:在编辑面板中点击"确定"按钮应用更改