--

taobao_mini/client/components/comgetcardpanel/comgetcardpanel.axml

 <view class="getcardpanel ">
-  <view class={{show?"p_show":"p_hide"}}>
+  <view class={{showCardBody?"p_show":"p_hide"}}>
     <image class="getcardcontinuebtn " a:if={{doJoinData.drawLotteryStatus==1}} onTap="hiddenPanelEvent" data-value="getcardpanel"  src={{resList['48d28917-741f-45d4-bcc9-322f29bcf5d8'].url}} />
     <image class="getcardopenboxbtn " a:if={{doJoinData.drawLotteryStatus==2}}  src={{resList['65d0f064-2527-4aef-8563-858eaf7ccf1e'].url}} />
     <image class="dim51 " src={{resList['8c31274b-1016-4b8c-b413-9fc98174e118'].url}} />
@@ -15,5 +15,5 @@
     </view>
   </view>
   
-  <canvas id="canvas" type="2d" onReady="onCanvasReady"></canvas>
+ 
 </view>
\ No newline at end of file

taobao_mini/client/components/comgetcardpanel/comgetcardpanel.js

@@ -42,59 +42,45 @@ Component({
     hiddenPanelEvent(e){
       this.props.onTapHiddenPanelEvent(e);
     },
-    onCanvasReady() {
-      try{
-        my.alert({
-          title:"",
-          content:"11"
-        });
-        if(!my.createCanvas){
-          my.alert({
-            title:"",
-            content:"33"
-          });
-        }
-        this.canvas=my.createCanvas({
-          id: 'canvas',  
-          success: (canvas) => {
-            my.alert({
-              title:"",
-              content:"22"
-            });
-            lottie.setup(canvas);
-            const context = canvas.getContext('2d')
-             let ani = lottie.loadAnimation({
-               loop: true,  autoplay: true,  
-               animationData: DataCenter.lottieData,
-               rendererSettings: {context: context},  
-             })
-             ani.onComplete=()=>{
-              //  this.setData({
-              //  show:true
-              //  })
-             }
-         },
-       });  
-       my.alert({
-        title:"",
-        content:JSON.stringify(this.canvas)
-       });
-      }catch(e){
-        my.alert({
-          title:"",
-          content:JSON.stringify(e)
-        });
-      }
-     
-   },
+  //   onCanvasReady() {
+  //     my.createCanvas({
+  //         id: 'canvas',  
+  //         success: (canvas) => {
+  //           my.alert({
+  //             title:"",
+  //             content:"22"
+  //           });
+  //           lottie.setup(canvas);
+  //           let context = canvas.getContext('2d')
+  //           let ani = lottie.loadAnimation({
+  //              loop: false,  autoplay: true,  
+  //              animationData: DataCenter.lottieData,
+  //              rendererSettings: {context: context},  
+  //           })
+  //            ani.onComplete=()=>{
+  //              this.setData({
+  //              show:true
+  //              })
+  //            }
+  //        },
+  //      });  
+  //  },
   },
   didMount(props) {
     console.log(DataCenter.doJoinData)
     this.setData({
       resList: resList,
+      showCardBody:false,
       doJoinData:DataCenter.doJoinData?DataCenter.doJoinData.data:{}
     });
 
+   
+    setTimeout(()=>{
+      this.setData({
+        showCardBody:true
+      })
+    },1500)
+
     // setTimeout(()=>{
     //   this.onCanvasReady()
     // },2000)

taobao_mini/client/components/comgetcardpanel/your.acss

@@ -21,7 +21,8 @@
 }
 .p_show{
     opacity:1;
+    transition: 0.5s all;
 }
 .p_hide{
-    opacity:1;
+    opacity:0;
 }
\ No newline at end of file

taobao_mini/client/pages/pageindexpage/pageindexpage.axml

@@ -82,5 +82,6 @@
           <image class="indexrulebtn " onTap="showPanelEvent" data-value="{{'rulepanel'}}" src={{resList['abc5f112-fa04-42fa-bfec-f633567807c8'].url}} />
           <image class="indexrecordbtn " src={{resList['5a6679e0-89f7-4582-a89b-116a35e9750a'].url}} />
         </view>
-       <panel showWinLists="{{showWinLists}}" CollectCardInfo={{CollectCardInfo}} onOpenTaskPanel="openTaskPanel" onTapHiddenPanelEvent="hiddenPanelEvent"/>
+       <panel showWinLists={{showWinLists}} CollectCardInfo={{CollectCardInfo}} onOpenTaskPanel="openTaskPanel" onTapHiddenPanelEvent="hiddenPanelEvent"/>
+        <canvas id="canvas" type="2d" onReady="onCanvasReady"></canvas>
       </view>
\ No newline at end of file

taobao_mini/client/pages/pageindexpage/pageindexpage.js

@@ -45,38 +45,37 @@ Page({
   data: {
       showWinLists:[],
       opacityState:"opacityShow",
+      showCardBody:false
   },
   onLoad(props) {
     this.setData({
       resList: resList,
       showPanel:this.showPanel
     });
-
-    loadCloud("cloud://4028B2AAA0799F6D94C6A0398B238DE3//开卡效果.json", (data)=>{
-       DataCenter.lottieData=data
-    }, ()=>{}) 
-
     //初始化首页信息
     this.getIndex()
-    
   },
-  // onCanvasReady() {
-  //    my.createCanvas({
-  //     id: 'canvas',  
-  //     success: (canvas) => {
-  //       lottie.setup(canvas);
-  //       const context = canvas.getContext('2d')
-  //       const { cloud } = getApp();
-  //       loadCloud("cloud://4028B2AAA0799F6D94C6A0398B238DE3//开卡效果.json", (data)=>{
-  //         let ani = lottie.loadAnimation({
-  //           loop: true,  autoplay: true,  
-  //            animationData: data,
-  //           rendererSettings: {  context: context,  },  
-  //         })  
-  //       }, ()=>{}) 
-  //    }  
-  //  });  
-  // },
+  onCanvasReady() {
+    my.createCanvas({
+        id: 'canvas',  
+        success: (canvas) => {
+          loadCloud("cloud://4028B2AAA0799F6D94C6A0398B238DE3//开卡效果.json", (data)=>{
+            lottie.setup(canvas);
+            let context = canvas.getContext('2d')
+            this.ani = lottie.loadAnimation({
+              loop: false,  autoplay: false,  
+              animationData: data,
+              rendererSettings: {context: context},  
+            })
+            // this.ani.onComplete=()=>{
+            //   this.setData({
+            //     showCardBody:true
+            //   })
+            // }
+          }, ()=>{}) 
+       },
+     });  
+ },
   /**
    * 获取主接口
    */
@@ -108,7 +107,6 @@ Page({
 
     DataCenter.CollectCardInfo = CollectCardInfo.data;
 
-
     this.setData({
       BaseInfo,
       CollectCardInfo,
@@ -163,7 +161,6 @@ Page({
     let CarouselList = await API.getAwardsCarouselList({ activityId }).catch(res => {
       commonToast(res && res.message);
     }) || {};
-
     let {list}=CarouselList.data;
     this.setData({
       CarouselListNow:list[0]
@@ -228,7 +225,6 @@ Page({
       this.showPanel("taskpanel")
     }
   },
-
   /**
    * 点击打开弹窗
    */
@@ -239,7 +235,6 @@ Page({
   //立即翻拍
   async doJoin(){
      //抽卡
-     this.showPanel("getcardpanel");
     const { activityId } = getApp();
     let doJoin = await API.doJoin({ activityId }).catch(res => {
       if(res&&res.code=="310003"){
@@ -255,6 +250,8 @@ Page({
 
     if(doJoin&&doJoin.success){
         DataCenter.doJoinData=doJoin;
+        this.ani&&this.ani.goToAndStop(0);
+        this.ani&&this.ani.play();
         this.showPanel("getcardpanel");
     }
   },

taobao_mini/client/pages/pageindexpage/your.acss

@@ -6,7 +6,16 @@
     position: relative !important;
     display: inline-block !important;
 }
-
+#canvas{
+    position:fixed;
+    top:0;
+    left:0;
+    bottom:0;
+    margin:auto;
+    width:750rpx;
+    height:1624rpx;
+    pointer-events: none;
+}
 .opacityShow{
   opacity:1;
   transition: 0.5s;