feat:merge

mock/project/homeInfo.js

@@ -31,7 +31,7 @@ module.exports = {
                     "sendCount": 400
                 }
             ],
-            "historyMaxScore": 2259892.7346440405,
+            "historyMaxScore": 1900,
             "currentTimestamp": 46409094.17754674,
             "actEndTimestamp": 43535651.10143122
         }

src/api/index.js

@@ -38,7 +38,17 @@ const API = generateAPI({
     showMsg: false,
   },
   indexInfo:'main/index.do',
-  startGame:'main/start.do',
+  startGame: {
+    uri: 'main/start.do',
+    method: 'post',
+    withToken: true,  // 携带token
+  },
+
+  submitGame: {
+    uri:'main/submit.do',
+    method: 'post',
+    withToken: true,  // 携带token
+  },
 
 })
 

src/assetList.json

-<<<<<<< HEAD
-{"preLoadImg":[],"asyncLoadImg":["LoadingPage/loadingBg.jpg","LoadingPage/loadingFill.png","LoadingPage/loadingIp.png","gamePage/bg.jpg","gamePage/numberBg.png","gamePage/selectBg.png"]}
-=======
 {"preLoadImg":[],"asyncLoadImg":["LoadingPage/loadingBg.jpg","LoadingPage/loadingFill.png","LoadingPage/loadingIp.png","detailPage/back.png","detailPage/bg.png","detailPage/border.png","detailPage/headline.png","detailPage/l_bg.png","detailPage/line.png","failPop/bg.png","failPop/close.png","failPop/endbtn.png","failPop/goonbtn.png","homePahe/bardown.png","homePahe/baron.png","homePahe/bg.png","homePahe/box1.png","homePahe/box2.png","homePahe/box3.png","homePahe/box4.png","homePahe/close1.png","homePahe/close2.png","homePahe/close3.png","homePahe/close4.png","homePahe/detail.png","homePahe/gameBarbg.png","homePahe/infobg.png","homePahe/open1.png","homePahe/open2.png","homePahe/open3.png","homePahe/open4.png","homePahe/prizebg.png","homePahe/rank.png","homePahe/rule.png","homePahe/show.png","homePahe/startBtn.png","homePahe/title.png","loading/bardown.png","loading/baron.png","loading/bg.png","loading/ip.png","loading/title.png","rankPage/back.png","rankPage/bg.png","rankPage/border.png","rankPage/headnline.png","rankPage/l_bg.png","rankPage/line.png","rankPage/ownbg.png","rulePop/bg.png","rulePop/close.png","successPop/bar.png","successPop/barbg.png","successPop/bg.png","successPop/btn.png","successPop/close.png"]}
->>>>>>> 8e6fe2b438dea54386ff3a9bf337b208de2ce4c8

src/components/barItem/barItem.jsx

@@ -7,21 +7,54 @@ import modalStore from '@src/store/modal';
 import store from '@src/store';
 import { Button } from '../Button';
 
+const barPoint = [-451, -290, -126]
 @observer
 class BarItem extends React.Component {
   constructor(props) {
     super(props);
+    this.state = {
+      left: -486
+    }
   }
   componentDidUpdate() {
-    console.log(this.props,"!@!@!@!@!@!@")
+    console.log(this.props, "!@!@!@!@!@!@")
+
+
+  }
+  updateLength() {
+    const { barInfo, nowScore } = this.props;
+    let left = 0;
+    if (barInfo && barInfo.length > 0) {
+      if (nowScore <= barInfo[0].score) {
+        left = -486
+      } else if (barInfo[3].score <= nowScore) {
+        left = 0
+      } else {
+        for (let i = 0; i < barInfo.length; i++) {
+          if (nowScore <= barInfo[i].score) {
+            let num = nowScore - barInfo[i - 1].score
+            let length = barInfo[i].score - barInfo[i - 1].score
+            console.log(i, barInfo[i - 1].score, num, length, "left", "num,length")
+            left = barPoint[i - 1] + num / length * (i == 3 ? 100 : 113)
+            break
+          }
+        }
+      }
+      console.log(left, "left")
+      return left
+    }
   }
 
   render() {
-    const { barInfo } = this.props;
+    const { barInfo, left, top, scaleNum } = this.props;
     return (
-      <div className="gamebar">
+      <div className="gamebar" style={{ left: left / 100 + "rem", top: top / 100 + "rem", transform: `scale(${scaleNum})` }}>
         <span className="bardown"></span>
-        <span className="baron"></span>
+        <div className='barbox'>
+          <span className="baron" style={{
+            left: this.updateLength() / 100 + "rem"
+          }}></span>
+        </div>
         {
           barInfo?.map((item, index) => {
             return (
@@ -32,7 +65,7 @@ class BarItem extends React.Component {
                   item.receive && <span className="prizebg"></span>
                 }
                 <span className="prize">{item.sendCount}青果</span>
-              </div>     
+              </div>
             )
           })
         }

src/components/barItem/barItem.less

@@ -2,8 +2,8 @@
 .gamebar {
   width: 571px;
   height: 140px;
-  left: 88px;
-  top: 361px;
+  left: 0px;
+  top: 0px;
   position: absolute;
   .bardown {
     width: 522px;
@@ -13,12 +13,20 @@
     position: absolute;
     .sparkBg("homePahe/bardown.png");
   }
-  .baron {
+  .barbox {
     width: 486px;
     height: 10px;
     left: 36px;
     top: 69px;
     position: absolute;
+    overflow: hidden;
+  }
+  .baron {
+    width: 486px;
+    height: 10px;
+    left: 0px;
+    top: 0px;
+    position: absolute;
     .sparkBg("homePahe/baron.png");
   }
   .boxitem {

src/components/failpop/failpop.jsx

@@ -6,6 +6,7 @@ import './failpop.less';
 import modalStore from '@src/store/modal';
 import store from '@src/store';
 import { Button } from '../Button';
+import { PAGE_MAP } from '@src/utils/constants';
 
 @observer
 class Failpop extends React.Component {
@@ -16,6 +17,7 @@ class Failpop extends React.Component {
     modalStore.closePop()
   }
   async restartGame() {
+    store.changePage(PAGE_MAP.HOME_PAGE);
     await store.startGame();
     modalStore.closePop()
   }

src/components/successpop/successpop.jsx

@@ -5,13 +5,15 @@ import { observer } from 'mobx-react';
 import './successpop.less';
 import modalStore from '@src/store/modal';
 import { Button } from '../Button';
+import BarItem from '../barItem/barItem';
+import store from '@src/store';
 
 @observer
 class Successpop extends React.Component {
   constructor(props) {
     super(props);
   }
-  closePop(){
+  closePop() {
     modalStore.closePop("Successpop")
   }
   render() {
@@ -21,7 +23,8 @@ class Successpop extends React.Component {
         <span className="bg"></span>
         <div className="barbox">
           <span className="barbg"></span>
-          <span className="bar"></span>
+          {/* <span className="bar"></span> */}
+          <BarItem left={-10} top={20} scaleNum={0.95} barInfo={store.homeInfo?.boxInfo} nowScore={this.props.popData.score}></BarItem>
         </div>
         <Button className="btn" onClick={this.closePop}></Button>
         <span className="score"><p>本次我赚了{this.props.popData.score}</p><p>获得{this.props.popData.sendCount}青果</p></span>

src/pages/gamePage/gamePage.jsx

@@ -2,6 +2,8 @@ import React, { Component } from 'react';
 import './gamePage.less';
 import { minusProbability, plusProbability } from './gameData';
 import modalStore from '@src/store/modal';
+import store from '@src/store';
+import { second2Date } from '@src/utils/utils';
 
 class GamePage extends Component {
 
@@ -31,7 +33,8 @@ class GamePage extends Component {
     currentNum: 1,
     numElements: [{
       top: '3.71rem'
-    }]
+    }],
+    seconds: '00:59'
     // fen1: 1,
     // fen2: 1,
     // fen3: 1,
@@ -43,11 +46,39 @@ class GamePage extends Component {
   componentDidMount() {
     
     this.createAddition();
-    // modalStore.pushPop("GuideModal", {doCount: this.doCount})
+    if(store.startInfo?.guide) {
+      modalStore.pushPop("GuideModal", {doCount: this.doCount})
+    } else {
+      this.doCount();
+    }
   }
 
+  countdownSeconds = store.startInfo?.countdownSeconds || 60 * 1000;
+
+  gameOver = false;
   doCount = () => {
-  
+    const timeObj = second2Date(this.countdownSeconds);
+    // 倒计时结束提交
+
+    setTimeout(() => {
+
+      if(this.countdownSeconds <= 0) {
+        store.submitScore(this.currentNumber);
+        this.gameOver = true;
+        this.setState({
+          seconds: '00:00'
+        })
+        return;
+      }
+      this.countdownSeconds -= 1000;
+
+      this.setState({
+        seconds: `${timeObj.minute}:${timeObj.second}`
+      })
+
+
+    }, 1000);
+
   }
 
   // 生成加减
@@ -247,6 +278,8 @@ class GamePage extends Component {
   // 选择数字
   chooseNumber = (index) => {
 
+    if(this.gameOver) return;
+
     if(!this.canChoose) return
     this.canChoose = false
 

src/pages/homepahe/homepahe.jsx

@@ -17,6 +17,13 @@ class Homepahe extends React.Component {
   }
   componentDidMount() {
     store.getIndexInfo()
+    let data = {
+      boxId: 2,
+      score: 600,
+      sendCount: 500
+    }
+    // modalStore.pushPop("Failpop",data)
+    // modalStore.pushPop("Successpop", data)
   }
   click_Rule() {
     if (!store.checkTime(false)) {
@@ -59,7 +66,7 @@ class Homepahe extends React.Component {
           </div>
         }
         <span className="gamebarbg"></span>
-        <BarItem barInfo={store.homeInfo?.boxInfo} nowScore={store.homeInfo.historyMaxScore}></BarItem>
+        <BarItem left={88} top={361} scaleNum={1} barInfo={store.homeInfo?.boxInfo} nowScore={store.homeInfo.historyMaxScore}></BarItem>
         <Button className="startbtn" onClick={this.click_StartBtn}></Button>
         <span className="title"></span>
         <Button className="rule" onClick={this.click_Rule}></Button>

src/store/index.js

@@ -3,6 +3,8 @@ import { makeAutoObservable } from 'mobx';
 import API from '../api/index';
 import { GetCurrSkinId, getCustomShareId } from "@src/utils/utils";
 import { Toast } from '@spark/ui';
+import modalStore from './modal';
+import { AESEncrypt } from '@src/utils/Crypto';
 
 const skinId = GetCurrSkinId() || getCustomShareId();
 
@@ -45,8 +47,8 @@ const store = makeAutoObservable({
     this.frontVariable = data || {};
     console.log('前端开发配置', data)
   },
-  timeStamp:'',
-  homeInfo:{},
+  timeStamp: '',
+  homeInfo: {},
   async getIndexInfo() {
     const { success, data } = await API.indexInfo()
     if (success && data) {
@@ -56,7 +58,7 @@ const store = makeAutoObservable({
   },
   checkTime(checkEnd = true) {
     if (store.homeInfo?.actStartTimestamp > store.timeStamp) {
-      Toast("活动未开始")
+      Toasts("活动未开始")
       return false
     }
     if (checkEnd && store.homeInfo?.actEndTimestamp < store.timeStamp) {
@@ -65,14 +67,43 @@ const store = makeAutoObservable({
     }
     return true
   },
-  startInfo:{},
-  async startGame(){
+  startInfo: {},
+  async startGame() {
+    this.submitFlag = false
     const { success, data } = await API.startGame()
-    if(success){
+    if (success) {
       this.startInfo = data
       // TODO 游戏页面
       store.changePage(PAGE_MAP.GAME_PAGE)
     }
+  },
+  submitFlag: false,
+  async submitScore(score) {
+
+    if(this.submitFlag) return;
+    this.submitFlag = true;
+
+    const obj = {
+      recordId: store.startInfo?.recordId,
+      score,
+      timestamp: Date.now(), // 毫秒数
+    }
+    const param = AESEncrypt(obj, '3C8C48E792E9241B', 'cDOiBC1n2QrkAY2P');
+
+    const res = await API.submitGame({ 
+      score,
+      param
+     })
+
+    if(!res || !res.success || !res.data) return;
+
+    if(res.data?.sendCount > 0) {
+      modalStore.pushPop("Successpop", res.data)
+    } else {
+      modalStore.pushPop("Failpop", res.data)
+    }
+    // modalStore.pushPop("Successpop", data)
+    // modalStore.pushPop("Failpop", data)
   }
 
 })