feat(画布): 添加图片旋转和镜像变换支持

新增 drawImageWithTransform 函数处理图片的旋转和镜像变换，修改图片绘制逻辑以支持这些效果

js/script.js

@@ -2479,15 +2479,25 @@
 
                 ctx.globalAlpha = overlayEl.style.opacity || 1;
 
+                // 获取旋转角度
+                const overlayTransform = overlayEl.style.transform || '';
+                const rotateMatch = overlayTransform.match(/rotate\(([-\d.]+)deg\)/);
+                const rotateDeg = rotateMatch ? parseFloat(rotateMatch[1]) : 0;
+
+                // 获取镜像状态
+                const imgTransform = imgEl.style.transform || '';
+                const isMirroredH = imgTransform.includes('scaleX(-1)');
+                const isMirroredV = imgTransform.includes('scaleY(-1)');
+
                 // 直接使用已加载的图片元素，避免重新加载导致质量下降
                 if (imgEl.complete && imgEl.naturalWidth > 0) {
-                    ctx.drawImage(imgEl, left, top, width, height);
+                    drawImageWithTransform(ctx, imgEl, left, top, width, height, rotateDeg, isMirroredH, isMirroredV);
                     ctx.globalAlpha = 1;
                     checkComplete();
                 } else {
                     // 如果图片未加载完成，等待加载
                     imgEl.onload = () => {
-                        ctx.drawImage(imgEl, left, top, width, height);
+                        drawImageWithTransform(ctx, imgEl, left, top, width, height, rotateDeg, isMirroredH, isMirroredV);
                         ctx.globalAlpha = 1;
                         checkComplete();
                     };
@@ -2500,6 +2510,31 @@
         });
     }
 
+    // 绘制带旋转和镜像变换的图片
+    function drawImageWithTransform(ctx, img, x, y, width, height, rotateDeg, isMirroredH, isMirroredV) {
+        ctx.save();
+        
+        // 移动到图片中心点
+        const centerX = x + width / 2;
+        const centerY = y + height / 2;
+        ctx.translate(centerX, centerY);
+        
+        // 应用旋转
+        if (rotateDeg !== 0) {
+            ctx.rotate(rotateDeg * Math.PI / 180);
+        }
+        
+        // 应用镜像
+        let scaleX = isMirroredH ? -1 : 1;
+        let scaleY = isMirroredV ? -1 : 1;
+        ctx.scale(scaleX, scaleY);
+        
+        // 绘制图片（从中心点偏移一半宽高）
+        ctx.drawImage(img, -width / 2, -height / 2, width, height);
+        
+        ctx.restore();
+    }
+
     // 在画布上绘制文字
     function drawTextOnCanvas(ctx, inputElement) {
         const deleteBtn = inputElement.querySelector('.text-delete-btn');