feat(图层管理): 添加图层管理面板及功能

- 新增图层面板UI组件,支持显示/隐藏图层
- 实现图层列表动态更新和选择功能
- 为所有图层元素添加唯一标识和隐藏状态控制
- 移除原有删除按钮,改为通过图层管理
- 在保存/恢复状态时处理图层可见性
- 优化预览生成逻辑,跳过隐藏图层
This commit is contained in:
Zhukj
2026-04-25 09:31:21 +08:00
parent ef6010a8b2
commit a7d0ad8e51
3 changed files with 561 additions and 70 deletions

View File

@@ -19,6 +19,7 @@
<button class="toolbar-btn-icon" id="redoBtn" title="重做 (Ctrl+Y)">↪</button>
</div>
<div class="toolbar-divider-v divider-right"></div>
<button class="btn" id="layersBtn">图层</button>
<button class="btn btn-primary" id="saveBtn">保存/预览</button>
</div>
@@ -117,6 +118,19 @@
</div>
<!-- 图层面板 -->
<div class="layers-panel" id="layersPanel">
<div class="layers-header">
<span class="layers-title">图层</span>
<button class="layers-close" id="layersClose">×</button>
</div>
<div class="layers-list" id="layersList">
<!-- 图层项将动态生成 -->
</div>
<div class="layers-actions">
<button class="layers-btn" id="layerToggleVisible" title="显示/隐藏">👁</button>
</div>
</div>
</div>
<input type="file" id="fileInput" accept="image/*" hidden>