tangning преди 1 година
родител
ревизия
91a3b76aa2

Файловите разлики са ограничени, защото са твърде много
+ 3610 - 1
public/viewer/static/lib/animate/animate.min.css


+ 44 - 21
src/app.vue

@@ -1,6 +1,6 @@
 <template>
   <LoadingLogo v-if="hadVideo" :thumb="true" />
-  <OpenVideo v-else @close="hadVideo = true" />
+  <OpenVideo v-else @close="handleCloseVideo" />
   <Guide />
 
   <div class="ui-view-layout" :class="{ show: show }" is-mobile="true">
@@ -131,10 +131,28 @@ const closetagtype = () => {
     }
   }
 };
+const handleCloseVideo = () => {
+  hadVideo.value = true
+  console.log('result1:',hadVideo.value);
+  let treTag = tags.value.find(res => res.type == 'coupon')
+  console.log('reasureTag.value',treTag);
+  if(treTag){
+    store.commit('tag/setTagClickType', {
+      type: 'treasure',
+      data: treTag,
+    })
+  }
+}
 const socket = computed(() => store.getters['rtc/socket']);
 
+const treasureTag = ref({
+  show:false,
+  tag:null
+})
+
 const tags = computed(() => {
-  return store.getters['tag/tags'] || [];
+  let list = store.getters['tag/tags'] || [];
+  return list
 });
 
 const isshoppingguide = computed(() => store.getters['shoppingguide']);
@@ -158,7 +176,7 @@ let VIDEOSCENELIST = [
   'KJ-eur-WR9V913f23',
   'KJ-eur-MBJF95ae80'
 ]
-console.log('result:',isMobile, Cache.get('HIDENVIDEOEXPIRES'));
+console.log('result:',isMobile, !Cache.get('HIDENVIDEOEXPIRES'),browser.getURLParam('role'));
 
 if (!Cache.get('HIDENVIDEOEXPIRES') && isMobile) {
   // if ((VIDEOSCENELIST.includes(browser.getURLParam('m')) && (browser.getURLParam('pose') == 'pano:188,qua:0.0013,-0.6099,0.001,0.7925'))||
@@ -166,10 +184,11 @@ if (!Cache.get('HIDENVIDEOEXPIRES') && isMobile) {
     // Cache.set('HIDENVIDEOEXPIRES', 'yes', 1);
     Cache.set('HIDENVIDEOEXPIRES', 'yes', 60 * 8 * 60);
     hadVideo.value = false;
+    console.log('result:',hadVideo.value);
   } else {
     hadVideo.value = true;
   }
-// }
+
 
 if (browser.getURLParam('role')) {
   hadVideo.value = true;
@@ -373,7 +392,8 @@ onMounted(async () => {
       render(data) {
         console.log('dataTagView',data);
         if (data.type == 'waterfall' || data.type == 'exhibits') {
-          return `<span class="tag-icon ${data.type == 'waterfall'?'waterfall':''} animate" style="background-image:url({{icon}})"></span>`;
+          return `<span class="tag-icon animate ${data.type == 'waterfall'?'waterfall':''}" style="background-image:url(${data.brand?.brandLogo?data.brand.brandLogo : data.icon})"></span>
+                  <span class="tag-icon animate ${data.type == 'waterfall'?'waterfall':''}" style="display:${data.brand?.outlineImage?'inline-block':'none'};background-image:url(${data.brand && data.brand.outlineImage});position: absolute;top: 0;left: 0;"></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') {
@@ -395,8 +415,10 @@ onMounted(async () => {
           let priceMax = isFinite(Math.max.apply(null, arr)) ? Math.max.apply(null, arr) : 0;
           let price = priceMin == priceMax ? priceMax : `${priceMin}-${priceMax}`;
           let range = price==0?'':`${data.products[0] ? data.products[0].symbol : 'MOP$'} ${price} |`;
-          return `<span class="tag-icon animate" style="background-image:url(${data.brand?.brandLogo?data.brand.brandLogo : data.icon})"></span>
-                  <span class="tag-icon animate" style="display:${data.brand?.outlineImage?'inline-block':'none'};background-image:url(${data.brand && data.brand.outlineImage});position: absolute;top: 0;left: 0;"></span>
+          // <span class="tag-icon animate" style="display:${data.brand?.outlineImage?'inline-block':'none'};background-image:url(${data.brand && data.brand.outlineImage});position: absolute;top: 0;left: 0;"></span>
+          // return `<span class="tag-icon animate" style="background-image:url(${data.brand?.brandLogo?data.brand.brandLogo : data.icon})"></span>
+          //         <span class="tag-icon animate" style="display:${data.brand?.outlineImage?'inline-block':'none'};background-image:url(${data.brand && data.brand.outlineImage});position: absolute;top: 0;left: 0;"></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'>
@@ -548,20 +570,21 @@ onMounted(async () => {
     if (browser.getURLParam('roomId')) {
       store.commit('showShoppingguide', true);
     } else {
-      if (!localStorage.getItem('user_guide')) {
-        Dialog.confirm({
-          showCloseIcon: false,
-          okText: t('common.know'),
-          content: "<span style='font-size: 16px; line-height: 1.5;'>" + t('common.notice') + '<span/>',
-          title: `${t('common.tips')}:`,
-          single: true,
-          func: (state) => {
-            if (state == 'ok') {
-              localStorage.setItem('user_guide', Date.now());
-            }
-          },
-        });
-      }
+      //项目经理要求去掉
+      // if (!localStorage.getItem('user_guide')) {
+      //   Dialog.confirm({
+      //     showCloseIcon: false,
+      //     okText: t('common.know'),
+      //     content: "<span style='font-size: 16px; line-height: 1.5;'>" + t('common.notice') + '<span/>',
+      //     title: `${t('common.tips')}:`,
+      //     single: true,
+      //     func: (state) => {
+      //       if (state == 'ok') {
+      //         localStorage.setItem('user_guide', Date.now());
+      //       }
+      //     },
+      //   });
+      // }
     }
 
     // app.resource.tags(`https://glp-vr.cdfmembers.com/cdf/hot/${browser.getURLParam('m')}/hot.json?rnd=${Math.random()}`);

+ 56 - 12
src/components/Controls/Panel/Main.vue

@@ -8,13 +8,23 @@
       <div class="othermenu" :style="{visibility:otherShow?'initial':'hidden'}">
         <ul :class="player.lang" @touchmove.stop v-show="otherShow">
           <li>
-            <ui-icon type="icon_other_on" @click.stop="onMusicClick"></ui-icon>
+            <!-- <ui-icon type="icon_other_on" @click.stop="onMusicClick"></ui-icon> -->
+            
+            <img class="iconImg" @click.stop="onMusicClick" :src="require(`@/assets/images/christmas/icon_other_on@3x.png`)" alt="">
             <div>{{$t('mode.music')}}</div>
           </li>
 
           <!-- 一起逛 -->
           <li v-if="showdaogou">
-            <ui-icon
+            
+            <img class="iconImg" @click.stop="
+                onClickMenu({
+                  icon: 'guided_shopping',
+                  id: 'heguided_shoppinglp',
+                  name: $t('common.mode'),
+                })
+              " :src="require(`@/assets/images/christmas/icon_shopping@3x.png`)" alt="">
+            <!-- <ui-icon
               type="icon_shopping"
               @click.stop="
                 onClickMenu({
@@ -23,18 +33,26 @@
                   name: $t('common.mode'),
                 })
               "
-            ></ui-icon>
+            ></ui-icon> -->
             <div>{{ $t('common.mode') }}</div>
           </li>
           <!-- //帮助 -->
           <li>
-            <ui-icon type="icon_help" @click.stop="
+            <img class="iconImg" @click.stop="
                 onClickMenu({
                   icon: 'help',
                   id: 'help',
                   name: t('common.help'),
                 })
-              "></ui-icon>
+              " :src="require(`@/assets/images/christmas/icon_help@3x.png`)" alt="">
+            
+            <!-- <ui-icon type="icon_help" @click.stop="
+                onClickMenu({
+                  icon: 'help',
+                  id: 'help',
+                  name: t('common.help'),
+                })
+              "></ui-icon> -->
             <div>{{$t('common.help')}}</div>
           </li>
           </ul>
@@ -54,8 +72,9 @@
             <ui-icon type="preview" @click.stop="playTour"></ui-icon>
             <div>{{$t('common.tour')}}</div>
           </li>
-          <li @click.stop="onClickMenu(item)" v-for="(item, i) in menulist" :key="i">
-            <ui-icon :type="item.icon"></ui-icon>
+          <li v-show="metadata.cdfProductSource.region == 'AM'" @click.stop="onClickMenu(item)" v-for="(item, i) in menulist" :key="i">
+            <!-- <ui-icon :type="item.icon"></ui-icon> -->
+            <img class="iconImg" :src="require(`@/assets/images/christmas/icon_customer_service@3x.png`)" alt="">
             <div>{{ item.name }}</div>
           </li>
 
@@ -74,7 +93,14 @@
             <div>{{ $t('common.mode') }}</div>
           </li> -->
           <li>
-            <ui-icon
+            <img class="iconImg" @click.stop="
+                onClickMenu({
+                  icon: 'shopping',
+                  id: 'shopping',
+                  name: $t('common.shopping'),
+                })
+              " :src="require(`@/assets/images/christmas/icon_shopping@3x.png`)" alt="">
+            <!-- <ui-icon
               type="icon_shopping"
               @click.stop="
                 onClickMenu({
@@ -83,14 +109,16 @@
                   name: $t('common.shopping'),
                 })
               "
-            ></ui-icon>
+            ></ui-icon> -->
             <div>{{ $t('common.shopping') }}</div>
           </li>
           <li>
-            <ui-icon
+            
+            <img class="iconImg" @click.stop="otherShow = !otherShow" :src="require(`@/assets/images/christmas/icon_other@3x.png`)" alt="">
+            <!-- <ui-icon
               type="icon_other"
               @click.stop="otherShow = !otherShow"
-            ></ui-icon>
+            ></ui-icon> -->
             <div>{{ $t('common.other') }}</div>
           </li>
         </ul>
@@ -426,6 +454,12 @@ const getSearchList = async () => {
 
 onMounted(() => {
   useApp().then((app) => {
+    app.Scene.on("loaded", () => {
+      console.log('treasureTag',treasureTag.value);
+    if(treasureTag.value.show){
+      handleTreasure()
+    }
+  });
     // getCategorylist();
     // getShoplist();
   });
@@ -435,6 +469,10 @@ musicPlayer.on('pause', () => (showMusicPlaying.value = false))
 </script>
 
 <style lang="scss" scoped>
+.iconImg{
+  height: 18px;
+  width: 18px;
+}
 .plandiv{
   position: fixed;
   bottom: 1.17rem;
@@ -448,6 +486,12 @@ musicPlayer.on('pause', () => (showMusicPlaying.value = false))
 .swiper-wrapper{
   flex-wrap: wrap;
   flex-direction: column;
+  scrollbar-width: none; /* firefox */
+  -ms-overflow-style: none; /* IE 10+ */
+  &::-webkit-scrollbar {
+    display: none; /* Chrome Safari */
+  }
+  overflow-x: auto;
 }
 .santaClausDiv{
   position: fixed;
@@ -790,7 +834,7 @@ musicPlayer.on('pause', () => (showMusicPlaying.value = false))
       }
     }
     .searchKeyList{
-        // overflow-y: auto;
+        overflow-y: auto;
         height: 100%;
       .searchKeyItem{
         padding: 7px 14px;

+ 1 - 1
src/components/Header/state.js

@@ -27,7 +27,7 @@ const player = {
     showMore: false,
     showDescription: false,
     showToolbar: true,
-    showUserGuide: true,
+    showUserGuide: false,
     /**
      * VR展示
      */

+ 39 - 3
src/components/Tags/treasure.vue

@@ -60,7 +60,7 @@ const zhixieShow = ref(false)
 const emit = defineEmits(["close"]);
 onMounted(() => {
   nextTick(() => {
-    partyRef.value.addEventListener("click", function (e) {
+    partyRef.value && partyRef.value.addEventListener("click", function (e) {
       party.confetti(this,{
         count: party.variation.range(10, 60),
         size: party.variation.range(0.5, 2),
@@ -85,7 +85,9 @@ watch(
           // partyRef.value.dispatchEvent(e);
           // partyRef.value.dispatchEvent(e);
         },1000)
-      })
+      }
+      
+       )
     }
 })
 const confetti = (e) =>{
@@ -138,6 +140,7 @@ const goto_now = (e) => {
     text-align: center;
     width: 10rem;
     max-width: 13.4rem;
+    animation: .5s showConnet linear 1 normal;
     .liwutext {
       position: absolute;
       top: 1.5rem;
@@ -191,8 +194,10 @@ const goto_now = (e) => {
       color: #ffffff;
       line-height: 0.8rem;
       position: relative;
+      animation-fill-mode:both;
       z-index: 2;
-      top: 100px;
+      top: 0;
+      // animation: 1s flipOutX linear 1 normal;
     }
   }
 
@@ -204,6 +209,17 @@ const goto_now = (e) => {
     color: #fff;
   }
 }
+
+@keyframes showConnet {
+  0% {
+    transform: scale(0,0);
+    -webkit-transform: scale(0,0);
+  }
+  100% {    
+    transform: scale(1,1);
+    -webkit-transform: scale(1,1);
+  }
+}
 @keyframes gift {
   0% {
     transform: rotate(0deg);
@@ -214,4 +230,24 @@ const goto_now = (e) => {
     -webkit-transform: rotate(360deg);
   }
 }
+@keyframes flipOutX {
+    0% {
+        -webkit-transform: perspective(400px);
+        transform: perspective(400px);
+        opacity: 0
+    }
+
+    30% {
+        -webkit-transform: perspective(400px) rotateX(-20deg);
+        transform: perspective(400px) rotateX(-20deg);
+        opacity: 1
+        // opacity: 0.3
+    }
+
+    to {
+        -webkit-transform: perspective(400px) rotateX(90deg);
+        transform: perspective(400px) rotateX(90deg);
+        opacity: 1
+    }
+}
 </style>

+ 10 - 1
src/components/Tags/waterfall.vue

@@ -4,7 +4,9 @@
       <div class="waterfallcon">
         <div class="wfheader">
           <!-- <img :src="require(`@/assets/images/icon/${tagclick.data.type==='exhibits'?'exhibits':'top5'}.png`)" alt="" /> -->
-          <img class="" :src="tagclick.data.icon" alt="" draggable="false">
+          <img class="" :src="tagclick.data.brand?.brandLogo?tagclick.data.brand.brandLogo : tagclick.data.icon" alt="" draggable="false">
+          <img class="borderImg" v-if="tagclick.data.brand?.outlineImage" :src="tagclick.data.brand?.outlineImage" alt="" draggable="false">
+          <!-- <img class="" :src="tagclick.data.icon" alt="" draggable="false"> -->
           <ui-icon @click="emit('close')" type="close"></ui-icon>
         </div>
         <ul class="wfcon">
@@ -39,6 +41,7 @@ const { t } = useI18n({ useScope: 'global' })
 const store = useStore();
 
 const tagclick = computed(() => store.getters["tag/tagClickType"]);
+console.log('{{ tagclick }}',tagclick);
 const isshoppingguide = computed(() => store.getters["shoppingguide"]);
 
 const emit = defineEmits(["close"]);
@@ -100,6 +103,12 @@ const gotoGoods = (item) => {
       justify-content: space-between;
       width: 100%;
       align-items: center;
+      position: relative;
+      .borderImg{
+        position: absolute;
+        left: 0;
+        z-index: 1;
+      }
       > img {
         width: 80px;
         max-height: 80px;

+ 2 - 1
src/components/openVideo/index.vue

@@ -4,7 +4,7 @@
       <!-- <div class="vmask"></div> -->
       <video x5-playsinline="true" playsinline="true" webkit-playsinline="true" class="video" ref="openvideo$" preload autoplay :src="videourl"></video>
       <div v-show="videourl && !bofanging" @click.stop="countdown==0&&emit('close')" class="jump">{{countdown>0?$t('common.jumpTips',{second:countdown}):$t('common.jump')}}</div>
-      <img v-show="videourl && bofanging" @click.stop="bofang" class="bofang" :src="require('@/assets/images/icon/start_vr.png')" alt="" />
+      <!-- <img v-show="videourl && bofanging" @click.stop="bofang" class="bofang" :src="require('@/assets/images/icon/start_vr.png')" alt="" /> -->
     </div>
   </transition>
 </template>
@@ -50,6 +50,7 @@ onMounted(() => {
       return emit("close");
     }
     videourl.value = res.data.videoUrl;
+    openvideo$.value.volume = 0;
     openvideo$.value && openvideo$.value.play();
     openvideo$.value.addEventListener("ended", () => {
       emit("close");

+ 1 - 1
src/components/shared/Guide.vue

@@ -38,7 +38,7 @@ const getTips = (tips) => {
 useApp().then((app) => {
   app.Scene.on("loaded", () => {
     if (!localStorage.getItem("user_guide")) {
-      store.commit("showUserGuide", true);
+      // store.commit("showUserGuide", true);
     }
   });
 });

BIN
香港展示端正式1.zip