update

packages/qjkankan-view/src/components/assembly/MobileTags/metas/metas-image.vue

@@ -7,17 +7,15 @@
           :pagination="{
             type: 'fraction',
           }"
-         
           :zoom="{
             maxRatio: 5,
             minRatio: 0.5,
-           
           }"
           class="mySwiper"
           :modules="modules"
           :slides-per-view="1"
           :free-mode="true"
-         
+          @zoomChange="zoomChange"
         >
           <swiper-slide v-for="(item, index) in currentTag.image" :key="index">
             <div class="swiper-zoom-container">
@@ -72,6 +70,14 @@ const hasImages = computed(
 onMounted(() => {});
 
 onUnmounted(() => {});
+const zoomChange = (swiper, scale, imageEl, slideEl) => {
+  console.log("zoomChange", scale, imageEl, slideEl);
+  setTimeout(() => {
+    const flag = `transition-duration: 300ms; transform: translate(0px, 0px) scale(${scale});`;
+    imageEl.style = flag;
+    console.log("hey", imageEl.style.transform);
+  }, 1000);
+};
 </script>
 
 <style lang="scss">
@@ -105,15 +111,17 @@ onUnmounted(() => {});
       width: 100%;
       height: 100%;
       object-fit: scale-down;
+      border: none;
     }
+    // .swiper-slide-zoomed .swiper-zoom-container img {
+    //   transform: translate(0px, 0px) scale(5) !important;
+    // }
     // .swiper-slide .main-img {
     //   // display: block;
     //   width: 100%;
     //   height: 100%;
     //   object-fit: contain;
     // }
-
-
   }
 }
 .swiper-pagination {
@@ -129,7 +137,7 @@ onUnmounted(() => {});
   display: flex;
   justify-content: center;
   align-items: center;
-  bottom: 34px;;
+  bottom: 34px;
   .swiper-pagination-total {
     color: #858586;
   }

packages/qjkankan-view/src/components/assembly/MobileTags/metas/metas-imagetext.vue

@@ -9,20 +9,21 @@
           }"
           :zoom="{
             maxRatio: 5,
-            minRatio:0.5,
+            minRatio: 0.5,
           }"
           class="mySwiper"
           :modules="modules"
           :slides-per-view="1"
           :free-mode="true"
           @paginationRender="handlePageRender"
+          @zoomChange="zoomChange"
         >
           <swiper-slide
             v-for="(item, index) in currentTag.imageTextInfo.imageList"
             :key="index"
           >
             <div class="swiper-zoom-container">
-              <img :src="item.ossPath" />
+              <img :src="item.ossPath + '?v=1111'" />
             </div>
           </swiper-slide>
         </Swiper>
@@ -172,6 +173,14 @@ function handlePageRender(_, el) {
     el.style.transform = "translateX(0)";
   }
 }
+const zoomChange = (swiper, scale, imageEl, slideEl) => {
+  console.log("zoomChange", scale, imageEl, slideEl);
+  setTimeout(() => {
+    const flag = `transition-duration: 300ms; transform: translate(0px, 0px) scale(${scale});`;
+    imageEl.style = flag;
+    console.log("hey", imageEl.style.transform);
+  }, 10);
+};
 </script>
 
 <style lang="scss">
@@ -207,12 +216,9 @@ function handlePageRender(_, el) {
       height: 100%;
       object-fit: scale-down;
     }
-    // .swiper-slide .main-img {
-    //   // display: block;
-    //   width: 100%;
-    //   height: 100%;
-    //   object-fit: contain;
-    // }
+    .swiper-slide-zoomed .swiper-zoom-container img {
+      border: 5px solid red;
+    }
 
     .audio-control {
       position: absolute;

packages/qjkankan-view/src/hooks/useWxshared.js

@@ -1,37 +1,34 @@
-import wxshare from '@/utils/wxshare'
-import { onMounted } from 'vue';
-
-const initWxShare = async => {
-    onMounted(async () => {
-        try {
-            await new Promise(r => setTimeout(r, 1000));
-            const title = document.title;
-            const link = window.location.href
-            // const desc = '测试微信分享'
-            const imgUrl = document.querySelector('meta[name="cover"]').content || '';
-            const desc = document.querySelector('meta[name="description"]').content || '';
-            // const imgUrl = document.document.querySelector('meta[name="description"]').content
-            // title, link, imgUrl, desc 
-            console.log('当前分享imgUrl', imgUrl)
-            await wxshare({
-                title,
-                link,
-                desc,
-                imgUrl
-            });
-        } catch (error) {
-            console.error(error)
-
-        }
-
-
-    })
-}
+import wxshare from "@/utils/wxshare";
+import { onMounted } from "vue";
 
+const initWxShare = async () => {
+  // onMounted(async () => {
+  try {
+    await new Promise((r) => setTimeout(r, 1000));
+    const title = document.title;
+    const link = window.location.href;
+    // const desc = '测试微信分享'
+    const imgUrl = document.querySelector('meta[name="cover"]').content || "";
+    const desc =
+      document.querySelector('meta[name="description"]').content || "";
+    // const imgUrl = document.document.querySelector('meta[name="description"]').content
+    // title, link, imgUrl, desc
+    console.log("当前分享imgUrl", imgUrl);
+    await wxshare({
+      title,
+      link,
+      desc,
+      imgUrl,
+    });
+  } catch (error) {
+    console.error(error);
+  }
 
+  // })
+};
 
 export function useWxShared() {
-    return {
-        initWxShare,
-    };
-}
+  return {
+    initWxShare,
+  };
+}

packages/qjkankan-view/src/pages/showMobile.vue

@@ -42,7 +42,6 @@ import { useI18n, getLocale } from "@/i18n";
 const { t } = useI18n({ useScope: "global" });
 
 const { initWxShare } = useWxShared();
-initWxShare();
 
 const coverInfo = ref({});
 
@@ -244,6 +243,8 @@ onMounted(async () => {
                 : currentScene.value.someData.hotspots;
           }
           app.Tags.initHotspot(hotspots, false);
+          initWxShare();
+          console.log("初始化微信分享");
         });
       }
       const { initDefaultAudio } = useAudio();

packages/qjkankan-view/src/utils/wxshare.js

@@ -22,38 +22,37 @@ function toConfigure() {
             "updateTimelineShareData",
             "onMenuShareAppMessage",
             "onMenuShareTimeline",
-            "updateTimelineShareData",
             "onMenuShareQQ",
             "onMenuShareWeibo",
-            "hideMenuItems",
-            "showMenuItems",
-            "hideAllNonBaseMenuItem",
-            "showAllNonBaseMenuItem",
-            "translateVoice",
-            "startRecord",
-            "stopRecord",
-            "onRecordEnd",
-            "playVoice",
-            "pauseVoice",
-            "stopVoice",
-            "uploadVoice",
-            "downloadVoice",
-            "chooseImage",
-            "previewImage",
-            "uploadImage",
-            "downloadImage",
-            "getNetworkType",
-            "openLocation",
-            "getLocation",
-            "hideOptionMenu",
-            "showOptionMenu",
-            "closeWindow",
-            "scanQRCode",
-            "chooseWXPay",
-            "openProductSpecificView",
-            "addCard",
-            "chooseCard",
-            "openCard",
+            // "hideMenuItems",
+            // "showMenuItems",
+            // "hideAllNonBaseMenuItem",
+            // "showAllNonBaseMenuItem",
+            // "translateVoice",
+            // "startRecord",
+            // "stopRecord",
+            // "onRecordEnd",
+            // "playVoice",
+            // "pauseVoice",
+            // "stopVoice",
+            // "uploadVoice",
+            // "downloadVoice",
+            // "chooseImage",
+            // "previewImage",
+            // "uploadImage",
+            // "downloadImage",
+            // "getNetworkType",
+            // "openLocation",
+            // "getLocation",
+            // "hideOptionMenu",
+            // "showOptionMenu",
+            // "closeWindow",
+            // "scanQRCode",
+            // "chooseWXPay",
+            // "openProductSpecificView",
+            // "addCard",
+            // "chooseCard",
+            // "openCard",
           ],
         });
         resolve();