update

pnpm-lock.yaml

@@ -4460,7 +4460,7 @@ packages:
       typescript: '>=4.8.4'
 
   tslib@2.8.1:
-    resolution: {integrity: sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==}
+    resolution: {integrity: sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==, tarball: http://npm.dui88.com:80/tslib/-/tslib-2.8.1.tgz}
 
   tweedle.js@2.1.0:
     resolution: {integrity: sha512-0ReQgVjepoZkE6t0upWNgCRbplHkQJQYk1LStXugwSR728GLFmGDRuaQJlxeC/iBlxud6+P1RdODjaO25vHAqw==}

src/pages/HomePage/HomePage.tsx

@@ -16,6 +16,7 @@ import MyPrize from '../MyPrize/MyPrize.js';
 import shareStore from '@/store/share.js';
 import { LOG_KEY, MatterShareOpt, MatterViewDuration, MatterViewOpt, pageView, sensorLog } from "@/utils/sensors.js";
 import { CHANNEL_PARAMS, extranceName } from '@/utils/constants.js';
+import RankPrizePop from '@/panels/RankPrizePop/RankPrizePop.js';
 
 @observer
 class Homepage extends React.Component {
@@ -26,9 +27,11 @@ class Homepage extends React.Component {
   }
 
   async componentDidMount() {
+    // ModalCtrl.showModal(RankPrizePop);
     await store.updateIndex()
     await shareStore.doAssist();
     this.initSensor();
+
   }
 
   handleButtonClick = _asyncThrottle(async (number) => {

src/pages/RankPrizePop/RankPrizePop.less

-@import "../../res.less";
-.rankPrizePop {
-  width: 750px;
-  height: 100%;
-  left: 0px;
-  top: 0px;
-  position: absolute;
-  overflow-y: auto;
-  overflow-x: hidden;
-  .bg {
-    width: 750px;
-    height: 4882px;
-    left: 0px;
-    top: 0px;
-    position: absolute;
-    // .sparkBg("rulePage/bg.png");
-  }
-  .back {
-    left: 20px;
-    top: 60px;
-    width: 28px;
-    height: 43px;
-    position: absolute;
-    .webpBg("MyPrize/返回.png");
-  }
-}
\ No newline at end of file

src/pages/RankPrizePop/RankPrizePop.tsx

-import React from 'react';
-import { observer } from 'mobx-react';
-import './RankPrizePop.less';
-import API from "@/api";
-import { PageCtrl } from "@/core/ctrls/PageCtrl.tsx";
-import store from "@/store/store.ts";
-import HomePage from '../HomePage/HomePage';
-
-@observer
-class RankPrizePop extends React.Component<any, any> {
-
-    clickBack = () => {
-        PageCtrl.changePage(HomePage);
-    }
-
-    render() {
-        const { ruleImg } = store.frontVariable;
-        return <div className="rankPrizePop">
-            <img className="bg"
-                src={ruleImg}
-            />
-            <span className="back" onClick={this.clickBack}></span>
-        </div>;
-    }
-}
-
-export default RankPrizePop;
\ No newline at end of file

src/panels/RankPrizePop/RankPrizePop.less

+@import "../../res.less";
+.rankPrizePop {
+  width: 750px;
+  height: 100%;
+  left: 0px;
+  top: 0px;
+  position: absolute;
+  overflow-y: auto;
+  overflow-x: hidden;
+  .bg {
+    width: 646px;
+    height: 852px;
+    left: 35px;
+    top: 260px;
+    position: absolute;
+    .sparkBg("ranknoprizepop/bg2.png");
+  }
+  .prizeImg{
+    width:217px;
+    height: 217px;
+    position: absolute;
+    background-color: #ffd271;
+    border-radius: 20px;
+    top:540px;
+    left:255px;
+    img{
+      width: 100%;
+      height: 100%;
+      border-radius: 20px;
+    }
+  }
+  .prizename{
+    width:400px;
+    position: absolute;
+    top:780px;
+    font-size: 30px;
+    color: #99391b;
+    text-align: center;
+    left:160px;
+    .lineClamp1();
+  }
+  .btn{
+    width:263px;
+    height: 92px;
+    position: absolute;
+    top:850px;
+    left:230px;
+    .sparkBg("ranknoprizepop/kaixinshouxia.png");
+  }
+
+  .back {
+    left: 320px;
+    top: 1150px;
+    width: 65px;
+    height: 65px;
+    position: absolute;
+    .webpBg("ranknoprizepop/close.png");
+  }
+}
\ No newline at end of file

src/panels/RankPrizePop/RankPrizePop.tsx

+import React from 'react';
+import { observer } from 'mobx-react';
+import './RankPrizePop.less';
+import API from "@/api";
+import { PageCtrl } from "@/core/ctrls/PageCtrl.tsx";
+import store from "@/store/store.ts";
+import HomePage from '../../pages/HomePage/HomePage';
+import { ModalCtrl } from '@/core/ctrls/ModalCtrl';
+import { LOG_KEY, MatterShareOpt, MatterViewOpt, pageView, sensorLog,MatterViewDuration } from '../../utils/sensors.js';
+
+@observer
+class RankPrizePop extends React.Component<any, any> {
+
+    componentDidMount(): void {
+        pageView("b14288", {
+            page_name: "排行榜中奖弹窗",
+        });
+    
+        sensorLog(LOG_KEY.exposure, "b14288", "d14289", {
+            page_name: "排行榜中奖弹窗",
+            button_name: "开心收下按钮",
+        });
+    }
+    clickBack = () => {
+        ModalCtrl.closeModal();
+    }
+    clickBack2 = () => {
+        sensorLog(LOG_KEY.click, "b14288", "d14289", {
+            page_name: "排行榜中奖弹窗",
+            button_name: "开心收下按钮",
+        });
+        ModalCtrl.closeModal();
+    }
+
+    render() {
+       const { prize } = this.props;
+        return <div className="rankPrizePop">
+            <div className="bg"></div>
+            <div className="prizeImg">
+                <img src={prize?.prizeImg} alt="" />
+            </div>
+            <div className="prizename">{prize?.prizeName}</div>
+            <div className="btn"  onClick={this.clickBack2}></div>
+            <span className="back" onClick={this.clickBack}></span>
+        </div>;
+    }
+}
+
+export default RankPrizePop;
\ No newline at end of file