feat: 完成带看热点

src/app.vue

@@ -1,6 +1,5 @@
 <template>
-  <LoadingLogo v-if="hadVideo" :thumb="true" />
-  <OpenVideo v-else @close="hadVideo = true" />
+  <LoadingLogo :thumb="true" />
   <Guide />
 
   <div class="ui-view-layout" :class="{ show: show }" is-mobile="true">
@@ -119,7 +118,6 @@ import Waterfall from "@/components/Tags/waterfall.vue";
 import Information from "@/components/Information";
 import Control from "@/components/Controls/Control.Mobile.vue";
 import LoadingLogo from "@/components/shared/Loading.vue";
-import OpenVideo from "@/components/openVideo/";
 import Guide from "@/components/shared/Guide.vue";
 import { Dialog } from "@/global_components/";
 
@@ -128,33 +126,11 @@ import { ref, onMounted, computed, nextTick, watch } from "vue";
 import { useStore } from "vuex";
 import browser from "@/utils/browser";
 import { useApp, getApp } from "@/app";
-import common from "@/utils/common";
-import { Cache } from "@/utils/index";
-import wxShare from "@/utils/wxshare";
 
-import * as apis from "@/apis/index.js";
 const store = useStore();
 
-let jumpNewScene = (sceneFirstView) => {
-  let url = window.location.href;
-
-  if (!browser.hasURLParam("pose")) {
-    url += `&${sceneFirstView.sceneview}`;
-  } else {
-    url = browser.replaceQueryString(
-      url,
-      "pose",
-      sceneFirstView.sceneview.replace("pose=", "")
-    );
-  }
-
-  url = browser.replaceQueryString(url, "m", sceneFirstView.num);
-  return url;
-};
-
 let visibilitychangeFn = () => {
   if (browser.isTabHidden()) {
-    apis.burying_point({ type: 1 });
   }
 };
 
@@ -204,23 +180,6 @@ const controls = computed(() => {
 const mode = computed(() => store.getters["mode"]);
 const showNavigations = computed(() => store.getters["showNavigations"]);
 const scene$ = ref(null);
-const hadVideo = ref(true);
-
-if (!Cache.get("HIDENVIDEOEXPIRES")) {
-  if (
-    browser.getURLParam("m") == "eur-KJ-z5ZEV22AeU" &&
-    browser.getURLParam("pose") == "pano:408,qua:-0.006,0.6299,0.0049,0.7766"
-  ) {
-    Cache.set("HIDENVIDEOEXPIRES", "yes", 60 * 8 * 60);
-    hadVideo.value = false;
-  } else {
-    hadVideo.value = true;
-  }
-}
-
-if (browser.getURLParam("role")) {
-  hadVideo.value = true;
-}
 
 const show = ref(false);
 const dataLoaded = ref(false);
@@ -244,23 +203,16 @@ const resize = () => {
 watch(
   () => isshoppingguide.value,
   (val, old) => {
-    
     let $minmap = document.querySelector("[xui_min_map]");
 
     if ($minmap) {
       setTimeout(async () => {
-          await nextTick();
+        await nextTick();
         if (browser.getURLParam("role") == "customer") {
           if (isshoppingguide.value) {
             $minmap.classList.add("gudieDisabled");
           } else {
             $minmap.classList.remove("gudieDisabled");
-            // wxShare({
-            //   title: `cdf澳門上葡京店~`,
-            //   desc: "cdf澳門上葡京店~",
-            //   link: window.location.href.split("#")[0],
-            //   imgUrl: "https://glp-vr.cdfmembers.com/cdf/file/91dd5305525f463286f03a31abd1c154.jpg",
-            // });
           }
         } else {
           $minmap.classList.remove("gudieDisabled");
@@ -359,17 +311,11 @@ const toggleMap = () => {
 const onClickTagInfo = (el) => {
   el.stopPropagation();
   let item = tags.value.find((item) => item.sid == el.target.dataset.id);
-  if (item.type == "commodity") {
-    guideclicktag(item);
-    store.commit("tag/setTagClickType", {
-      type: "goodlist",
-      data: item,
-    });
-  } else if (item.type == "link_scene") {
-    guideclicktag(item);
-    let sceneFirstView = item.hotContent.sceneFirstView;
-    window.location.href = jumpNewScene(sceneFirstView);
-  }
+  guideclicktag(item);
+  store.commit("tag/setTagClickType", {
+    type: "goodlist",
+    data: item,
+  });
 };
 
 const guideclicktag = (tag) => {
@@ -388,8 +334,6 @@ const guideclicktag = (tag) => {
 };
 
 onMounted(async () => {
-  apis.burying_point({ type: 0 });
-
   app = createApp({
     num: browser.getURLParam("m"),
     dom: scene$.value,
@@ -400,143 +344,50 @@ onMounted(async () => {
   app
     .use("TagView", {
       render(data) {
-        if (data.type == "waterfall") {
-          return `<span class="tag-icon waterfall animate" style="background-image:url({{icon}})"></span>`;
-        } else if (data.type == "coupon") {
-          return `<span class="tag-icon coupon animate" style="background-image:url({{icon}})"></span>`;
-        } else if (data.type == "applet_link") {
-          try {
-            data.hotContent = JSON.parse(data.hotContent);
-          } catch (error) {}
-          return `<span class="tag-icon applet_link animate" style="background-image:url(${
-            data.hotContent.liveIcon.src
-              ? common.changeUrl(data.hotContent.liveIcon.src)
-              : "{{icon}}"
-          })"></span>`;
-        } else if (data.type == "link_scene") {
+        if (data.media["image"] && data.media["image"].length) {
           return `<span class="tag-icon animate" style="background-image:url({{icon}})"></span>
                       <div class="tag-body">
-                        <div data-id="${data.sid}" class="tag-commodity tag-link_scene">
-                          <p class="tag-title">點擊前往下一個區域</p>
+                        <div data-id="${data.sid}" class="tag-commodity">
+                          <div  style="background-image:url(${ app.resource.getUserResourceURL(data.media["image"][0].src)+'&x-oss-process=image/resize,m_fill,w_80,h_80'})" class='tag-avatar'></div>
+                          <p class="tag-title">${data.title}</p>
+                          <p class="tag-info">查看</p>
                         </div>
                       </div>
                   `;
-        } else if (data.type == "commodity") {
-          let arr = data.products.map((item) => item.price);
-          let priceMin = isFinite(Math.min.apply(null, arr))
-            ? Math.min.apply(null, arr)
-            : 0;
-          let priceMax = isFinite(Math.max.apply(null, arr))
-            ? Math.max.apply(null, arr)
-            : 0;
-          let price =
-            priceMin == priceMax ? priceMax : `${priceMin}-${priceMax}`;
-          let range = `${
-            data.products[0] ? data.products[0].symbol : "MOP$"
-          } ${price}`;
-          return `<span class="tag-icon animate" style="background-image:url({{icon}})"></span>
+        }
+        return `<span class="tag-icon animate" style="background-image:url({{icon}})"></span>
                       <div class="tag-body">
                         <div data-id="${data.sid}" class="tag-commodity">
-                          <div  style="background-image:url(${
-                            data.products[0] ? data.products[0].pic : ""
-                          })" class='tag-avatar'>
-                          </div>
                           <p class="tag-title">${data.title}</p>
-                          <p class="tag-info">${range} | 查看 ></p>
+                          <p class="tag-info">查看</p>
                         </div>
                       </div>
                   `;
-        } else {
-          return `<span class="tag-icon animate" style="background-image:url({{icon}})"></span>`;
-        }
       },
     })
     .then((view) => {
       view.on("click", (e) => {
         var tag = e.data;
         // 聚焦當前點擊的熱點
-        view.focus(tag.sid).then(() => {
-          if (tag.type == "coupon") {
-            try {
-              if (isshoppingguide.value) {
-                return;
-              }
-              document.querySelector(
-                `[data-tag-id="${tag.sid}"] .tag-icon`
-              ).style.display = "none";
-              let hotcontent =
-                typeof tag.hotContent == "string"
-                  ? JSON.parse(tag.hotContent)
-                  : tag.hotContent;
-              browser.openLink(
-                "/subPackage/pages/activity/activity?pageId=" +
-                  hotcontent.couponLink,
-                `https://m.cdfmembers.com/shop/600667208/showactivity?pageId=${hotcontent.couponLink}`,
-                `/pages/showactivity/showactivity?pageId=${hotcontent.couponLink}`
-              );
-              apis.burying_point({ type: 2 });
-            } catch (error) {}
-          } else if (tag.type == "waterfall") {
-            store.commit("tag/setTagClickType", {
-              type: "waterfall",
-              data: tag,
-            });
-            guideclicktag(tag);
-          } else if (tag.type == "applet_link") {
-            try {
-              if (isshoppingguide.value) {
-                return;
-              }
-              let hotcontent =
-                typeof tag.hotContent == "string"
-                  ? JSON.parse(tag.hotContent)
-                  : tag.hotContent;
-              browser.openLink(
-                "/subPackage/pages/home/home?pageType=2&pageId=" +
-                  hotcontent.liveLink,
-                `https://m.cdfmembers.com/shop/600667208/showactivity?pageId=${hotcontent.liveLink}`,
-                `/pages/showactivity/showactivity?pageId=${hotcontent.liveLink}`
-              );
-            } catch (error) {}
-          } else if (tag.type == "link_scene") {
-            guideclicktag(tag);
-            let sceneFirstView = tag.hotContent.sceneFirstView;
-            window.location.href = jumpNewScene(sceneFirstView);
-          }
-        });
+        view.focus(tag.sid).then(() => {});
       });
 
       view.on("focus", (e) => {
         document.querySelectorAll("[xui_tags_view] >div").forEach((el) => {
-          if (
-            el.getAttribute("data-tag-type") == "link_scene" ||
-            el.getAttribute("data-tag-type") == "commodity"
-          ) {
-            el.querySelector(".tag-body").classList.remove("show");
-            el.style.zIndex = "auto";
-          }
+          el.querySelector(".tag-body").classList.remove("show");
+          el.style.zIndex = "auto";
         });
-        if (e.data.type == "commodity" || e.data.type == "link_scene") {
-          e.target.style.zIndex = "999";
-          e.target.querySelector(".tag-body").classList.add("show");
-          e.target
-            .querySelector(".tag-commodity")
-            .removeEventListener("click", onClickTagInfo);
-          e.target
-            .querySelector(".tag-commodity")
-            .addEventListener("click", onClickTagInfo);
-
-          if (tagid) {
-            document.querySelector(`[data-id="${tagid}"]`) &&
-              document.querySelector(`[data-id="${tagid}"]`).click();
-            tagid = null;
-          }
-        }
+        e.target.style.zIndex = "999";
+        e.target.querySelector(".tag-body").classList.add("show");
+        e.target
+          .querySelector(".tag-commodity")
+          .removeEventListener("click", onClickTagInfo);
+        e.target
+          .querySelector(".tag-commodity")
+          .addEventListener("click", onClickTagInfo);
       });
 
-      view.on("rendered", (e) => {
-        tagid && view.focus(tagid);
-      }); //dom渲染完成
+      view.on("rendered", (e) => {}); //dom渲染完成
     });
 
   app.use("TourPlayer");
@@ -607,13 +458,10 @@ onMounted(async () => {
     store.commit("setFlying", false);
     store.commit("setPanoId", targetPano.id);
     if (app.Scene.isCurrentPanoHasVideo) {
-      apis.burying_point({ type: 5 });
     }
   });
 
-  app.Camera.on("pano.chosen", (pano) => {
-    apis.burying_point({ type: 4 });
-  });
+  app.Camera.on("pano.chosen", (pano) => {});
   app.store.on("tour", async (tour) => {
     app.TourManager.load(tour);
     store.commit("tour/setData", {
@@ -732,8 +580,7 @@ onMounted(async () => {
     transform-origin: bottom;
     transition: all 0.3s cubic-bezier(0.35, 0.32, 0.65, 0.63);
     // pointer-events: none;
-    .tag-commodity,
-    .tag-link_scene {
+    .tag-commodity {
       min-width: 230px;
       height: 76px;
       background: rgba(255, 255, 255, 0.8);
@@ -792,57 +639,6 @@ onMounted(async () => {
     &.show {
       transform: translateX(-50%) scale(1);
     }
-
-    .tag-link_scene {
-      height: auto;
-      min-width: unset;
-      .tag-title {
-        padding: 10px;
-        width: auto;
-        text-align: center;
-      }
-    }
-  }
-
-  .coupon {
-    width: 84px !important;
-    height: 84px !important;
-    &::after {
-      content: "發現好禮";
-      width: 100%;
-      color: #ed5d18;
-      position: absolute;
-      bottom: -24px;
-      text-align: center;
-      font-size: 14px;
-    }
-  }
-
-  .waterfall {
-    width: 90px !important;
-    height: 90px !important;
-  }
-
-  .applet_link {
-    width: 64px !important;
-    height: 64px !important;
-    border-radius: 50%;
-    background-color: #fff;
-    border: 1px solid #ed5d18;
-    position: relative;
-    overflow: hidden;
-    &::after {
-      content: "直播中";
-      width: 100%;
-      height: 20px;
-      background: #ed5d18;
-      position: absolute;
-      bottom: 0;
-      text-align: center;
-      line-height: 1.2;
-      font-size: 12px;
-      border-radius: 26%;
-    }
   }
 }
 

src/components/Controls/Panel/Main.vue

@@ -40,7 +40,6 @@ import { useStore } from "vuex";
 import { onMounted, watch, computed, ref, nextTick } from "vue";
 import Panel from "@/views/Panel.vue";
 import { useApp, getApp } from "@/app";
-import * as apis from "@/apis/index.js";
 import browser from "@/utils/browser";
 
 const sync = ref(browser.getURLParam("sync"));
@@ -173,8 +172,6 @@ const onClickMenu = (item) => {
 };
 
 const getCategorylist = async () => {
-  let res = await apis.get_category_list({});
-  categorylist.value = res.data;
   brandScroll();
 };
 
@@ -219,18 +216,11 @@ watch(
 );
 
 const getShoplist = async () => {
-  let res = await apis.get_shop_list({
-    categoryId: currentCategory.value.id,
-  });
-  brandlist.value = res.data;
   brandScroll();
 };
 
 const getSearchList = async () => {
-  let res = await apis.get_shop_list({
-    shopName: searchKey.value,
-  });
-  searchList.value = res.data;
+
 };
 
 onMounted(() => {

src/components/RTC/PageRtcLive.vue

@@ -264,6 +264,10 @@ let getUrl = (href, queryArr) => {
 
   return href;
 };
+
+const tagclick = computed(() => store.getters["tag/tagClickType"]);
+const tagImageIndex = computed(() => store.getters["tag/tagImageIndex"]);
+
 const videoDeviceId = computed(() => store.getters["rtc/videoDeviceId"]);
 const audioDeviceId = computed(() => store.getters["rtc/audioDeviceId"]);
 
@@ -426,10 +430,10 @@ const setUserJoin = async (res) => {
     UserId: res.user.UserId,
     text: "进入房间",
   };
-  if(role.value == 'leader'){
+  if (role.value == "leader") {
     chatList.value.push(data);
   }
-  
+
   await nextTick();
   try {
     chatAutoScroll();
@@ -566,10 +570,10 @@ const onMemberLeave = async (res) => {
     UserId: res.user.UserId,
     text: "离开房间",
   };
-  if(role.value == 'leader'){
-      chatList.value.push(data);
+  if (role.value == "leader") {
+    chatList.value.push(data);
   }
-  
+
   await nextTick();
   try {
     chatAutoScroll();
@@ -643,7 +647,7 @@ const startFollow = (app) => {
       emit("closeSocket");
       return;
     }
-  
+
     connectStatus.value = 1;
     if (role.value == "customer") {
       socket.value.emit("action", { type: "ask-currentscene" });
@@ -731,6 +735,28 @@ const startFollow = (app) => {
       onGetOuT(data.data);
     } else if (data.type == "user-init") {
       app.Connect.follow.sync();
+      if (role.value == "leader") {
+        setTimeout(() => {
+          if (tagclick.value && tagclick.value.type == "goodlist") {
+            socket.value.emit("action", {
+              type: "tagclick",
+              data: {
+                sid: tagclick.value.data.sid,
+              },
+            });
+            if (tagImageIndex.value != null) {
+              setTimeout(() => {
+                socket.value.emit("action", {
+                  type: "tag-image-index",
+                  data: {
+                    index: tagImageIndex.value,
+                  },
+                });
+              }, 200);
+            }
+          }
+        }, 200);
+      }
     } else if (data.type == "user-paint") {
       onDraw(data.open);
       if (role.value == "customer") {
@@ -757,22 +783,10 @@ const startFollow = (app) => {
     } else if (data.type == "tagclick") {
       if (role.value == "customer") {
         let item = tags.value.find((item) => item.sid == data.data.sid);
-        if (item.type == "commodity") {
-          store.commit("tag/setTagClickType", {
-            type: "goodlist",
-            data: item,
-          });
-        } else if (item.type == "waterfall") {
-          store.commit("tag/setTagClickType", {
-            type: "waterfall",
-            data: item,
-          });
-        } else if (item.type == "link_scene") {
-          let sceneFirstView = item.hotContent.sceneFirstView;
-          window.location.href = jumpNewScene(sceneFirstView);
-        }
-        // document.querySelector(`[data-tag-id="${data.data.sid}"]`).click();
-        // console.log(data.data.sid);
+        store.commit("tag/setTagClickType", {
+          type: "goodlist",
+          data: item,
+        });
       }
     } else if (data.type == "tagclose") {
       if (role.value == "customer") {
@@ -781,6 +795,10 @@ const startFollow = (app) => {
           data: {},
         });
       }
+    } else if (data.type == "tag-image-index") {
+      if (role.value == "customer") {
+        store.commit("tag/setTagImageIndex", data.data.index);
+      }
     } else if (data.type == "ask-currentscene") {
       if (role.value == "leader") {
         socket.value.emit("action", {

src/components/Tags/goods-list.vue

@@ -1,77 +1,43 @@
 <template>
   <transition mode="out-in" appear>
     <div class="goodlist" v-show="tagclick.type == 'goodlist'">
-      <div class="head-pages">
-        <div>
-          <span>{{ current + 1 }}</span
-          ><span>/{{ tagclick.data.products ? tagclick.data.products.length : "-" }}</span>
-        </div>
-        <ui-icon @click.stop="close" type="state_f"></ui-icon>
-      </div>
-      <div class="swiper-container" id="goodlist">
-        <ul class="swiper-wrapper">
-          <li class="swiper-slide" v-for="(i, index) in tagclick.data.products" :key="index">
-            <viewimg :list="i.pics" :keyid="`viewimg_${index + 1}`" />
-
-            <div class="info">
-              <p>{{ i.name }}</p>
-              <div v-if="i.skus">
-                <span>{{ i.price[0].symbol }}</span
-                ><span>{{ i.currentSku.price }}</span>
+      <div>
+        <div id="goodlist">
+          <ul>
+            <li>
+              <div class="head-close">
+                <ui-icon @click.stop="close" type="state_f"></ui-icon>
+              </div>
+              <viewimg
+                v-if="tagImages"
+                :list="tagImages"
+                :keyid="`viewimg_1`"
+                :index="tagImageIndex"
+                @change="(index) => imageSwitch(index)"
+              />
+              <div class="info">
+                <p>{{ tagclick.data.title }}</p>
               </div>
-              <ul>
-                <li>
-                  <span>規格：</span>
-                  <ul>
-                    <li @click.stop="onClickSku(item)" :class="{ active: item.id == i.currentSku.id }" v-for="(item, idx) in i.skus" :key="idx">
-                      <span v-if="item.properties[0]">
-                        {{ item.properties[0].value }}
-                      </span>
-                    </li>
-                  </ul>
-                </li>
-                <li>
-                  <span>數量：</span>
-                  <div class="number">
-                    <ui-icon
-                      @click="
-                        () => {
-                          i.cartnum--;
-                          i.cartnum = Math.max(i.cartnum, 0);
-                        }
-                      "
-                      type="cad-neiqiang"
-                    ></ui-icon>
-                    <input maxlength="5" v-model="i.cartnum" type="number" />
-                    <ui-icon
-                      @click="
-                        () => {
-                          i.cartnum++;
-                          i.cartnum = Math.min(i.cartnum, 9999);
-                        }
-                      "
-                      type="add"
-                    ></ui-icon>
-                  </div>
-                </li>
-              </ul>
-            </div>
-            <div class="goods-button">
-              <span v-if="i.saleChannel == 1" class="tipss">僅供線下門店購買</span>
-              <template v-else>
-                <div @click.stop="viewDetail(i)">查看詳情</div>
-                <div @click.stop="addCart(i)">加入購物車</div>
-              </template>
-            </div>
-          </li>
-        </ul>
+              <div class="content" v-html="tagclick.data.content"></div>
+            </li>
+          </ul>
+        </div>
       </div>
     </div>
   </transition>
 </template>
 
 <script setup>
-import { onMounted, watch, toRaw, computed, defineEmits, ref, defineProps, nextTick } from "vue";
+import {
+  onMounted,
+  watch,
+  toRaw,
+  computed,
+  defineEmits,
+  ref,
+  defineProps,
+  nextTick,
+} from "vue";
 import { useApp, getApp } from "@/app";
 import { useStore } from "vuex";
 import * as apis from "@/apis/index.js";
@@ -81,170 +47,51 @@ import viewimg from "@/views/viewimg";
 
 // get_product_info
 const store = useStore();
+const role = computed(() => store.getters["rtc/role"]);
+const socket = computed(() => store.getters["rtc/socket"]);
 const isshoppingguide = computed(() => store.getters["shoppingguide"]);
 
 const tagclick = computed(() => store.getters["tag/tagClickType"]);
+const tagImageIndex = computed(() => store.getters["tag/tagImageIndex"]);
+
+const tagImages = computed(() => {
+  if (
+    tagclick.value &&
+    tagclick.value.data &&
+    tagclick.value.data.type == "image" &&
+    tagclick.value.data.media["image"]
+  ) {
+    return tagclick.value.data.media["image"];
+  }
+  return null;
+});
 
 const emit = defineEmits(["close"]);
 
 const current = ref(0);
 
-const mysw = ref(null);
-
-const viewDetail = (item) => {
+const imageSwitch = (index) => {
   if (isshoppingguide.value) {
-    return;
-  }
-  apis.burying_point({ type: 3, productId: item.id });
-  browser.openLink(
-    `/pages/item/item?productId=${item.id}`,
-    `https://m.cdfmembers.com/shop/600667208/item?productId=${item.id}`,
-    `/pages/item/item?productId=${item.id}`
-  );
-};
-
-const onClickSku = (item) => {
-  let tempData = toRaw(tagclick.value.data);
-
-  tempData.products[current.value] = {
-    ...tempData.products[current.value],
-    currentSku: { ...item },
-  };
-
-  store.commit("tag/setTagClickType", {
-    type: tagclick.value.type,
-    data: tempData,
-  });
-};
-
-const addCart = async (item) => {
-  if (isshoppingguide.value) {
-    return;
-  }
-  Loading.show();
-
-  let result = await apis.inCat({
-    AccessToken: browser.getURLParam("AccessToken"),
-    skuId: item.currentSku.id,
-    num: item.cartnum,
-    rnd: Math.random(),
-  });
-
-  Loading.hide();
-  if (result.code === 0) {
-    apis.burying_point({ type: 7, productId: item.id });
-    return Dialog.toast({ content: `添加成功`, type: "success" });
-  } else {
-    let callbackUrl = `${window.location.origin}${window.location.pathname}?m=${browser.getURLParam("m")}&${getApp().Camera.getPoseUrlParams()}`;
-
-    if (!browser.hasURLParam("tagid")) {
-      callbackUrl += `&tagid=${tagclick.value.data.sid}`;
-    } else {
-      callbackUrl = browser.replaceQueryString(callbackUrl, "tagid", tagclick.value.data.sid);
+    if (role.value == "leader") {
+      store.commit("tag/setTagImageIndex", index);
+      socket.value &&
+        socket.value.emit("action", {
+          type: "tag-image-index",
+          data: {
+            index: index,
+          },
+        });
     }
-    console.log(callbackUrl);
-    //  Dialog.toast({ content: `登錄狀態失效，請重新登錄`, type: 'error' })
-    browser.openLink(
-      `/pages/login/login?callbackHttpUrl=${encodeURIComponent(callbackUrl)}`,
-      `https://m.cdfmembers.com/shop/600667208/h5login?redirectUrl=${encodeURIComponent(callbackUrl)}`,
-      `/pages/login/login?callbackHttpUrl=${encodeURIComponent(callbackUrl)}`
-    );
   }
 };
 
 const close = () => {
   emit("close");
+   store.commit("tag/setTagImageIndex", null);
 };
-
-const updateProductsById = async (idx) => {
-  if (!tagclick.value.data.products[idx]) {
-    Dialog.toast({ content: `獲取商品詳情失敗，請稍後再試`, type: "error" });
-    close();
-    return;
-  }
-  Loading.show();
-  try {
-    let res = await apis.get_product_info({
-      // productId: 'p15677829'
-      productId: tagclick.value.data.products[idx].id,
-    });
-
-    let tempData = toRaw(tagclick.value.data);
-
-    tempData.products[idx] = {
-      ...tempData.products[idx],
-      ...res.data,
-      currentSku: res.data.skus[0] || {
-        price: "",
-        id: "",
-      },
-      cartnum: 1,
-    };
-
-    store.commit("tag/setTagClickType", {
-      type: tagclick.value.type,
-      data: tempData,
-    });
-    Loading.hide();
-  } catch (error) {
-    Loading.hide();
-  }
-};
-
-watch(
-  () => tagclick.value.type,
-  (val, old) => {
-    if (mysw.value) {
-      if (val === "goodlist") {
-        current.value = 0;
-        updateProductsById(current.value);
-      }
-      if (!val) {
-        mysw.value.slideTo(0);
-      }
-    }
-  }
-);
-
-const brandScroll = () => {
-  nextTick(() => {
-    let t = setTimeout(() => {
-      clearTimeout(t);
-      mysw.value = new Swiper("#goodlist", {
-        effect: "coverflow",
-        grabCursor: true,
-        centeredSlides: true,
-        slidesPerView: "auto",
-        coverflowEffect: {
-          rotate: 0,
-          stretch: -40,
-          depth: 100,
-          modifier: 1,
-          slideShadows: false,
-        },
-        on: {
-          touchMove(swiper, e) {
-            e.stopPropagation();
-            e.preventDefault();
-          },
-          slideChange() {
-            if (tagclick.value.type) {
-              current.value = this.activeIndex;
-              updateProductsById(current.value);
-            }
-          },
-        },
-      });
-    }, 100);
-  });
-};
-
-onMounted(() => {
-  brandScroll();
-});
 </script>
 
-<style lang="scss" scoped>
+<style lang="scss">
 .goodlist {
   position: fixed;
   width: 100%;
@@ -253,147 +100,62 @@ onMounted(() => {
   top: 0;
   right: 0;
   bottom: 0;
-  margin: 0 auto;
-  max-width: 500px;
   z-index: 101;
   background: rgba(0, 0, 0, 0.2);
-  display: flex;
-  align-items: center;
-  flex-direction: column;
-  justify-content: center;
-  .head-pages {
+  > div {
+    width: 100%;
+    height: 100%;
+    margin: 0 auto;
+    max-width: 500px;
     display: flex;
-    justify-content: space-between;
     align-items: center;
-    margin-bottom: 10px;
-    width: 76%;
-    > div {
-      span {
-        font-size: 14px;
-        &:last-of-type {
-          color: rgba(255, 255, 255, 0.5);
-        }
-      }
-    }
+    flex-direction: column;
+    justify-content: center;
+  }
+
+  .head-close {
+    position: absolute;
+    right: -21px;
+    top: -21px;
+    z-index: 10000;
     > i {
-      color: rgba(0, 0, 0, 1);
+      color: #fff;
       font-size: 20px;
     }
   }
   #goodlist {
     width: 100%;
-    overflow: hidden;
     padding-right: 2px;
     position: relative;
     > ul {
+      display: flex;
+      justify-content: center;
       > li {
         width: 76%;
         border-radius: 2px;
         position: relative;
         font-size: 0;
-        overflow: hidden;
         background: #fff;
         padding-bottom: 14px;
 
-        .info {
-          font-size: 14px;
+        .info,
+        .content {
           color: #131d34;
-          padding: 16px 20px;
-          > p {
+          padding: 14px 20px;
+          p {
             font-size: 16px;
             width: 100%;
             line-height: 1.5;
             word-break: break-all;
-          }
-          > div {
-            color: var(--editor-main-color);
-            padding: 8px 0px 10px;
-            border-bottom: 1px solid #ebebeb;
-            > span {
-              font-size: 16px;
-              &:first-of-type {
-                font-size: 12px;
-                margin-right: 4px;
-              }
-            }
-          }
-          > ul {
-            padding: 12px 0;
-            border-bottom: 1px solid #ebebeb;
-
-            > li {
-              margin: 10px 0;
-              color: #909090;
-              &:last-of-type {
-                display: flex;
-                justify-content: space-between;
-                align-items: center;
-              }
-              > span {
-                font-size: 12px;
-              }
-              > ul {
-                display: block;
-                > li {
-                  display: inline-block;
-                  > span {
-                    display: inline-block;
-                    border: 1px solid #ebebeb;
-                    padding: 2px 4px;
-                    min-width: 73px;
-                    height: 30px;
-                    line-height: 30px;
-                    margin: 8px 8px 0 0;
-                    text-align: center;
-                    border-radius: 4px;
-                    font-size: 12px;
-                  }
-                  &.active {
-                    > span {
-                      border: solid 1px var(--editor-main-color);
-                      color: var(--editor-main-color);
-                    }
-                  }
-                }
-              }
-              .number {
-                display: flex;
-                i {
-                  font-size: 12px;
-                  border: 1px solid #ebebeb;
-                  padding: 2px 8px;
-                  border-radius: 15px;
-                }
-                input {
-                  max-width: 40px;
-                  text-align: center;
-                  color: #131d34;
-                }
-              }
-            }
+            font-weight: bold;
           }
         }
-        .goods-button {
-          display: flex;
-          justify-content: space-between;
-          font-size: 16px;
-          padding: 0 20px;
-
-          > div {
-            height: 42px;
-            background: #ff8e24;
-            border-radius: 4px;
-            width: 48%;
-            text-align: center;
-            line-height: 42px;
-            &:last-of-type {
-              background: var(--editor-main-color);
-            }
-          }
-          .tipss {
-            color: #909090;
-            display: inline-block;
-            margin: 0 auto;
+        .content {
+          padding-top: 0;
+          p {
+            line-height: 20px;
+            color: #444;
+            font-weight: normal;
           }
         }
       }

src/components/Tags/waterfall.vue

@@ -27,7 +27,6 @@ import { onMounted, watch, defineEmits, computed, ref, nextTick, defineProps } f
 import { useApp, getApp } from "@/app";
 import { useStore } from "vuex";
 import browser from "@/utils/browser";
-import * as apis from "@/apis/index.js";
 
 const store = useStore();
 
@@ -39,8 +38,6 @@ const gotoGoods = (item) => {
   if (isshoppingguide.value) {
       return;
   }
-  apis.burying_point({ type: 3, productId: item.id });
-  browser.openLink(`/pages/item/item?productId=${item.id}`, `https://m.cdfmembers.com/shop/600667208/item?productId=${item.id}`,`/pages/item/item?productId=${item.id}`);
 };
 </script>
 

src/components/openVideo/index.vue

@@ -10,7 +10,7 @@
 </template>
 <script setup>
 import { ref, watch, defineEmits, computed, onMounted, nextTick, defineProps } from "vue";
-import * as apis from "@/apis/index.js";
+
 
 const openvideo$ = ref(null);
 
@@ -30,44 +30,7 @@ const bofang = () => {
 
 onMounted(() => {
   nextTick(async () => {
-    let res = await apis.get_video();
-    if (!res.data) {
-      return emit("close");
-    }
-    videourl.value = res.data.videoUrl;
-    openvideo$.value.addEventListener("ended", () => {
-      emit("close");
-    });
-
-    openvideo$.value.addEventListener("playing", () => {
-      if (bofanging.value) {
-        bofanging.value = false;
-      }
-      if (countdown.value >0 && !timer.value) {
-        timer.value = setInterval(() => {
-          if (countdown.value ==0) {
-            clearInterval(timer.value)
-            timer.value=null
-            return
-          }
-          countdown.value --
-        }, 1000);
-      }
-    });
 
-    openvideo$.value.addEventListener("pause", () => {
-      if (!bofanging.value) {
-        bofanging.value = true;
-      }
-    });
-    
-    document.addEventListener(
-      "WeixinJSBridgeReady",
-      () => {
-        openvideo$.value.play();
-      },
-      false
-    );
   });
 });
 </script>

src/store/modules/rtc.js

@@ -8,12 +8,12 @@ export default {
         return {
             socket: null,
             showdaogou: false,
-            sdkAppId: "1400709402",
+            sdkAppId: "1400685498",
             userId: '',
             roomId: '',
             role:'',
-            secretKey: 'def391b02e6423a6db15eea3d9a0c131f2abac921204246bbe3f36fcea7d111d',
-            userSig: 'eJw1jlELgjAURv-LnkPunXNToZceosB6SPsBwVbelrLpFCH675XW43c*Dpwnq4oyMpOjzrBcgkgBVjMbTcdyxiNgy*61vThHmuUoABRkAvjykDZtoCvNAsbAUaWA8u-R7YttFno-JNPou7LBuH0MQR6t2tp6cz-5sy75zrXV3heH9U8M1HySUCapirnC7PUGl3Ix6g__',
+            secretKey: '7500f8938c46c5d3c64621ae7826905eec9723bf218fbcf121242e056a4ee14f',
+            userSig: 'eJwtzcsOgjAQBdB-6RaDU2jLI3EhsrHRBdGNK2Po0IyvNAWJxvjvEmA5597c*bLj7hD26FnOohDYYrzJ4LOjhkZ*tejPd7wY9EJwnsV8brXmdnGODMu5AEggExBNSUcPHFQpnkopIJkU34784ApECjBvkB1e8MLJfWyLOAis06Wut4b0tVdL77RVTb35dGXby6o6rVfs9wdhLDRy',
             audioDeviceId: '',
             videoDeviceId: '',
             cameraList: [],

src/store/modules/tag.js

@@ -13,6 +13,7 @@ export default {
                 type:'',
                 data:{}
             },
+            tagImageIndex:null,
             timer: null,
             hotData: null,
             isEdit: false,
@@ -51,6 +52,7 @@ export default {
         isEdit: state => state.isEdit,
         isFixed: state => state.isFixed,
         tagClickType: state => state.tagClickType,
+        tagImageIndex:state => state.tagImageIndex,
         tags: (state, getters, rootState, rootGetters) => {
             let tags = state.tagsList
             if (!state.tags && tags) {
@@ -263,6 +265,12 @@ export default {
         },
         setTagClickType(state, payload) {
             state.tagClickType = payload.value || payload
+            if(!state.tagClickType.type){
+                state.tagImageIndex = null
+            }
+        },
+        setTagImageIndex(state, payload) {
+            state.tagImageIndex = payload
         },
         setTitle(state, payload) {
             state.hotData.title = payload

src/views/viewimg.vue

@@ -1,36 +1,64 @@
 <template>
   <div class="imgcon">
-    <div class="swiper-container" :class="keyid" >
-    <ul  class="swiper-wrapper imgul">
-      <li  class="swiper-slide img" v-for="(pic, picii) in list" :key="picii" :style="{ backgroundImage: `url(${pic})` }"></li>
-    </ul>
-    <ul class="pagination">
-      <li :class="{active:picii==current}" v-for="(pic, picii) in list" :key="picii"></li>
-    </ul>
-  </div>
+    <div class="swiper-container" :class="keyid">
+      <ul class="swiper-wrapper imgul">
+        <li
+          class="swiper-slide img"
+          v-for="(pic, picii) in list"
+          :key="picii"
+          :style="{ backgroundImage: `url(${imageURL(pic.src)})` }"
+        ></li>
+      </ul>
+      <ul class="pagination">
+        <li
+          :class="{ active: picii == current }"
+          v-for="(pic, picii) in list"
+          :key="picii"
+        ></li>
+      </ul>
+    </div>
   </div>
 </template>
 
 <script setup>
-import { ref, watch, defineEmits, computed, onMounted, nextTick, defineProps } from "vue";
-
-const current = ref(0)
-
+import { useStore } from "vuex";
+import {
+  ref,
+  watchEffect,
+  defineEmits,
+  computed,
+  onMounted,
+  onUnmounted,
+  nextTick,
+  defineProps,
+} from "vue";
+import { getApp } from "@/app";
+let swiper = null;
+const store = useStore();
+const emit = defineEmits(["change"]);
+const current = ref(0);
 const props = defineProps({
   list: {
     type: Array,
     default: [],
   },
-  keyid:{
+  keyid: {
     type: String,
-    default: 'keyid',
-  }
+    default: "keyid",
+  },
+  index: {
+    type: Number,
+    default: -1,
+  },
 });
+const imageURL = (name) => {
+  return getApp().resource.getUserResourceURL(name);
+};
 const initScroll = () => {
   nextTick(() => {
     let t = setTimeout(() => {
       clearTimeout(t);
-      new Swiper(`.${props.keyid}`, {
+      swiper = new Swiper(`.${props.keyid}`, {
         on: {
           touchMove(swiper, e) {
             e.stopPropagation();
@@ -38,52 +66,68 @@ const initScroll = () => {
           },
           slideChange() {
             current.value = this.activeIndex;
+            emit("change", current.value);
           },
         },
       });
     }, 100);
   });
 };
-
+watchEffect(() => {
+  if (props.index != -1 && props.index!=null) {
+    if (swiper) {
+      swiper.slideTo(props.index);
+    } else {
+      setTimeout(() => {
+        swiper && swiper.slideTo(props.index);
+      }, 200);
+    }
+  }
+});
 onMounted(() => {
   initScroll();
 });
+onUnmounted(()=>{
+  swiper = null
+})
 </script>
 
 <style lang="scss" scoped>
-.imgcon{
-    min-height: 34vh;
+.imgcon {
+  min-height: 34vh;
+  overflow: hidden;
 
-.swiper-container {
-  position: relative;
-  .imgul {
-    .img {
-      height: 34vh;
-      width: 100%;
-      background-size: auto 100%;
-      background-position: center;
+  .swiper-container {
+    position: relative;
+    .imgul {
+      .img {
+        height: 34vh;
+        width: 100% !important;
+        background: #000;
+        background-size: contain;
+        background-position: center center;
+        background-repeat: no-repeat;
+      }
     }
-  }
-
-  .pagination{
-    position: absolute;
-    left: 50%;
-    bottom: 10px;
-    transform: translateX(-50%);
-    z-index: 99;
-    >li{
-      width: 8px;
-      height: 8px;
-      margin: 0 4px;
-      display: inline-block;
-      border-radius: 50%;
-      background-color: rgba(0, 0, 0, 0.2);
-      &.active{
-      background-color: var(--editor-main-color);
 
+    .pagination {
+      position: absolute;
+      left: 50%;
+      bottom: 10px;
+      transform: translateX(-50%);
+      z-index: 99;
+      > li {
+        width: 8px;
+        height: 8px;
+        margin: 0 4px;
+        display: inline-block;
+        border-radius: 50%;
+        background-color: rgba(255, 255, 255, 0.5);
+        &.active {
+          background-color: var(--editor-main-color);
+        }
       }
     }
   }
 }
-}
 </style>