优化详情页面图片预览实现，与买蛋标签页保持一致以解决滑动卡顿问题

pages/goods-detail/goods-detail.js

@@ -209,7 +209,6 @@ Page({
 
   // 预览图片
   previewImage(e) {
-    console.log('预览图片事件:', e);
     const { urls, index } = e.currentTarget.dataset;
     if (!urls || urls.length === 0) {
       wx.showToast({
@@ -239,19 +238,15 @@ Page({
   resetZoom() {
     this.setData({
       scale: 1,
+      lastScale: 1,
       offsetX: 0,
       offsetY: 0,
-      lastScale: 1,
-      startDistance: 0,
-      isScaling: false,
-      initialTouch: null,
-      lastTapTime: 0
+      initialTouch: null
     });
   },
 
   // 图片预览切换
   onPreviewImageChange(e) {
-    console.log('图片预览切换:', e);
     this.setData({
       previewImageIndex: e.detail.current
     });
@@ -261,7 +256,6 @@ Page({
 
   // 处理图片点击事件（单击/双击判断）
   handleImageTap(e) {
-    console.log('图片点击事件:', e);
     const currentTime = Date.now();
     const lastTapTime = this.data.lastTapTime || 0;
 
@@ -330,7 +324,6 @@ Page({
 
   // 处理触摸移动事件
   handleTouchMove(e) {
-    console.log('触摸移动事件:', e);
     const touches = e.touches;
 
     if (touches.length === 1 && this.data.initialTouch && this.data.scale !== 1) {
@@ -376,7 +369,6 @@ Page({
 
   // 处理触摸结束事件
   handleTouchEnd(e) {
-    console.log('触摸结束事件:', e);
     this.setData({
       isScaling: false,
       lastScale: this.data.scale,

pages/goods-detail/goods-detail.wxml

@@ -145,38 +145,33 @@
   </view>
 
   <!-- 图片预览弹窗 -->
-  <view class="image-preview-container" wx:if="{{showImagePreview}}">
-    <view class="preview-header">
-      <view class="preview-close" bindtap="closeImagePreview">
-        <text class="close-icon">×</text>
-      </view>
-      <view class="preview-indicator">
-        <text>{{previewImageIndex + 1}} / {{previewImageUrls.length}}</text>
-      </view>
-    </view>
+  <view class="image-preview-mask" wx:if="{{showImagePreview}}" style="position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.9); display: flex; justify-content: center; align-items: center; z-index: 10001;" catchtouchmove="true">
+    <view style="width: 100%; height: 100%; display: flex; justify-content: center; align-items: center;">
       <swiper 
-      class="preview-swiper"
+        style="width: 100%; height: 100%;" 
         current="{{previewImageIndex}}" 
         bindchange="onPreviewImageChange" 
-    >
-      <block wx:for="{{previewImageUrls}}" wx:key="index">
+        indicator-dots="true" 
+        indicator-color="rgba(255,255,255,0.5)" 
+        indicator-active-color="#fff">
+        <block wx:for="{{previewImageUrls}}" wx:key="*this">
           <swiper-item>
-          <view 
-            class="preview-image-wrapper"
+            <image 
+              src="{{item}}" 
+              mode="aspectFit" 
+              style="width: 100%; height: 100%; transform: scale({{scale}}) translate({{offsetX}}px, {{offsetY}}px); transition: {{isScaling ? 'none' : 'transform 0.3s'}};" 
               bindtap="handleImageTap" 
               bindtouchstart="handleTouchStart" 
               bindtouchmove="handleTouchMove" 
               bindtouchend="handleTouchEnd" 
-          >
-            <image 
-              src="{{item}}" 
-              mode="aspectFit"
-              class="preview-image"
-              style="transform: scale({{scale}}) translate({{offsetX}}px, {{offsetY}}px); transform-origin: center center; transition: transform 0.1s ease-out;"
-            />
-          </view>
+              bindtouchcancel="handleTouchEnd"
+            ></image>
           </swiper-item>
         </block>
       </swiper>
+      <view style="position: absolute; top: 40rpx; right: 40rpx; color: white; font-size: 40rpx;">
+        <text bindtap="closeImagePreview" style="background: rgba(0,0,0,0.5); padding: 10rpx 20rpx; border-radius: 50%;">×</text>
+      </view>
+    </view>
   </view>
 </view>