feat(qr): 添加二维码工具栏并优化交互体验

添加二维码编辑工具栏,支持透明度和缩放调整
优化选中状态和拖拽交互,增强用户体验
重构代码结构,提高可维护性
This commit is contained in:
Zhukj
2026-04-25 16:51:27 +08:00
parent 37aaec1e42
commit c7963cec6e
4 changed files with 363 additions and 99 deletions

View File

@@ -74,6 +74,20 @@
<div class="toolbar-divider"></div>
<button class="toolbar-btn mirror-btn" id="mirrorHBtn" title="水平镜像">↔</button>
</div>
<!-- 二维码编辑工具 -->
<div class="toolbar-group qr-tools" id="qrTools">
<label class="toolbar-label">
<span>透明度</span>
<input type="range" id="qrOpacitySlider" min="0" max="100" value="100" class="opacity-slider">
<span id="qrOpacityValue">100%</span>
</label>
<div class="toolbar-divider"></div>
<label class="toolbar-label">
<span>缩放</span>
<input type="range" id="qrScaleSlider" min="0" max="200" value="100" class="scale-slider">
<span id="qrScaleValue">100%</span>
</label>
</div>
<!-- 背景图编辑工具 -->
<div class="toolbar-group bg-tools" id="bgTools">
<label class="toolbar-label">