瀏覽代碼

添加商品试用功能;修复bug:从试用页面返回时,url即使带有参数tagid,也不会自动打开热点详情页。

任一存 1 年之前
父節點
當前提交
dbf68f5071
共有 5 個文件被更改,包括 23 次插入7 次删除
  1. 12 7
      src/app.vue
  2. 8 0
      src/components/Tags/goods-list.vue
  3. 1 0
      src/locales/en.json
  4. 1 0
      src/locales/zh_CN.json
  5. 1 0
      src/locales/zh_HK.json

+ 12 - 7
src/app.vue

@@ -280,7 +280,7 @@ const toggleMap = () => {
 };
 
 const onClickTagInfo = (el) => {
-  el.stopPropagation();
+    el.stopPropagation();
   let item = tags.value.find((item) => item.sid == el.target.dataset.id);
   if (item.type == 'commodity') {
     guideclicktag(item);
@@ -370,7 +370,7 @@ onMounted(async () => {
       },
     })
     .then((view) => {
-      view.on('click', (e) => {
+            view.on('click', (e) => {
         var tag = e.data;
         // 聚焦當前點擊的熱點
         view.focus(tag.sid).then(() => {
@@ -427,12 +427,17 @@ onMounted(async () => {
           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);
+                    e.target.querySelector('.tag-commodity').addEventListener('click', onClickTagInfo);
 
-          if (tagid) {
-            document.querySelector(`[data-id="${tagid}"]`) && document.querySelector(`[data-id="${tagid}"]`).click();
-            tagid = null;
-          }
+          setTimeout(() => {
+            if (tagid) {
+              const clickTarget = document.querySelector(`[data-id="${tagid}"]`)
+              if (clickTarget) {
+                clickTarget.click();
+              }
+              tagid = null;
+            }
+          }, 2000);
         }
       });
 

+ 8 - 0
src/components/Tags/goods-list.vue

@@ -62,6 +62,7 @@
                 <template v-else>
                   <div @click.stop="viewDetail(i)">{{$t('common.viewDetail')}}</div>
                   <div @click.stop="addCart(i)">{{$t('common.addCart')}}</div>
+                  <div v-if="i?.skuList?.length" @click.stop="onClickTryUse(i)">{{ $t('common.tryUse') }}</div>
                 </template>
               </div>
             </div>
@@ -125,6 +126,12 @@ const onClickSku = (item) => {
   });
 };
 
+function onClickTryUse(productInfo) {
+  const urlObj = new URL(productInfo.skuList[0].url)
+  urlObj.searchParams.set('tagid', tagclick.value.data.sid)
+  location.assign(urlObj.href)
+}
+
 const addCart = async (item) => {
   if (isshoppingguide.value) {
     return;
@@ -390,6 +397,7 @@ onMounted(() => {
             justify-content: space-between;
             font-size: 16px;
             padding: 0 20px;
+            gap: 10px;
 
             > div {
               height: 42px;

+ 1 - 0
src/locales/en.json

@@ -67,6 +67,7 @@
     "viewDetailFail": "Failed to get the product information; Please try again later",
     "addCart": "Add to cart",
     "viewDetail": "View details",
+    "tryUse": "Try it on!",
     "onlyOffLine":"Offline shopping only",
     "guige":"Specification:",
     "shuliang":"Quantity:",

+ 1 - 0
src/locales/zh_CN.json

@@ -67,6 +67,7 @@
     "viewDetailFail": "获取商品详情失败,请稍后再试",
     "addCart": "加入购物车",
     "viewDetail": "查看详情",
+    "tryUse": "AR试用",
     "onlyOffLine":"仅供线下门店购买",
     "guige":"规格:",
     "shuliang":"数量:",

+ 1 - 0
src/locales/zh_HK.json

@@ -67,6 +67,7 @@
     "viewDetailFail": "獲取商品詳情失敗,請稍後再試",
     "addCart": "加入購物車",
     "viewDetail": "查看詳情",
+    "tryUse": "AR試用",
     "onlyOffLine":"僅供線下門店購買",
     "guige":"規格:",
     "shuliang":"數量:",