feat(课程详情页): 添加富文本图片点击预览功能

在课程介绍富文本区域添加点击事件处理，当点击图片时调用vant的图片预览组件

@@ -13,6 +13,8 @@
     "MaybeRefOrGetter": true,
     "MaybeRefOrGetter": true,
     "PropType": true,
     "PropType": true,
     "Ref": true,
     "Ref": true,
+    "Slot": true,
+    "Slots": true,
     "VNode": true,
     "VNode": true,
     "WritableComputedRef": true,
     "WritableComputedRef": true,
     "computed": true,
     "computed": true,
@@ -74,8 +76,6 @@
     "watch": true,
     "watch": true,
     "watchEffect": true,
     "watchEffect": true,
     "watchPostEffect": true,
     "watchPostEffect": true,
-    "watchSyncEffect": true,
-    "Slot": true,
-    "Slots": true
+    "watchSyncEffect": true
   }
   }
 }
 }

@@ -69,7 +69,7 @@
               <div v-html="course?.feature"></div>
               <div v-html="course?.feature"></div>
             </div> -->
             </div> -->
 
 
-            <div v-if="activeTab === '课程介绍'">
+            <div v-if="activeTab === '课程介绍'" @click="handleIntroduceClick">
               <!-- <p v-html="course?.introduce" class="text-gray-700 whitespace-pre-line"></p> -->
               <!-- <p v-html="course?.introduce" class="text-gray-700 whitespace-pre-line"></p> -->
               <p v-html="course?.introduce" class="text-gray-700"></p>
               <p v-html="course?.introduce" class="text-gray-700"></p>
             </div>
             </div>
@@ -337,7 +337,7 @@ import { useRoute, useRouter } from 'vue-router'
 import { useCart } from '@/contexts/cart'
 import { useCart } from '@/contexts/cart'
 import { useAuth } from '@/contexts/auth'
 import { useAuth } from '@/contexts/auth'
 import { useTitle } from '@vueuse/core';
 import { useTitle } from '@vueuse/core';
-import { showToast, showDialog } from 'vant';
+import { showToast, showDialog, showImagePreview } from 'vant';
 import { formatDate } from '@/utils/tools'
 import { formatDate } from '@/utils/tools'
 
 
 import AppLayout from '@/components/layout/AppLayout.vue'
 import AppLayout from '@/components/layout/AppLayout.vue'
@@ -367,6 +367,22 @@ const isPurchased = ref(false)
 const isReviewed = ref(false)
 const isReviewed = ref(false)
 const showReviewPopup = ref(false)
 const showReviewPopup = ref(false)
 
 
+// 处理富文本点击事件，实现图片预览
+const handleIntroduceClick = (event) => {
+  const target = event.target;
+  if (target.tagName === 'IMG') {
+    // 阻止默认行为（如果需要）
+    event.preventDefault();
+
+    // 调用 vant 的图片预览
+    showImagePreview({
+      images: [target.src],
+      closeable: true,
+      showIndex: false, // 单张图片不显示索引
+    });
+  }
+};
+
 // 打卡相关状态
 // 打卡相关状态
 const task_list = ref([])
 const task_list = ref([])
 const timeout_task_list = ref([])
 const timeout_task_list = ref([])