Commit 6c0153bd authored by wangzhujun's avatar wangzhujun

1

parent d1f1ba3d
module.exports = {
"GET /main/index.do": {
"code": "Lorem",
"message": "cillum pariatur quis sit nostrud",
"success": true,
"data": {
"actStartTimestamp": -4048493.213529885,
"boxInfo": [
{
"boxId": "1",
"score": 100,
"receive": true,
"sendCount": 100
},
{
"boxId": "2",
"score": 500,
"receive": true,
"sendCount": 200
},
{
"boxId": "3",
"score": 1000,
"receive": false,
"sendCount": 300
},
{
"boxId": "4",
"score": 2000,
"receive": false,
"sendCount": 400
}
],
"historyMaxScore": 2259892.7346440405,
"currentTimestamp": 46409094.17754674,
"actEndTimestamp": 43535651.10143122
}
}
};
\ No newline at end of file
'use strict';
import React from 'react';
import { observer } from 'mobx-react';
import './barItem.less';
import modalStore from '@src/store/modal';
import store from '@src/store';
import { Button } from '../Button';
@observer
class BarItem extends React.Component {
constructor(props) {
super(props);
}
componentDidUpdate() {
console.log(this.props,"!@!@!@!@!@!@")
}
render() {
const { barInfo } = this.props;
return (
<div className="gamebar">
<span className="bardown"></span>
<span className="baron"></span>
{
barInfo?.map((item, index) => {
return (
<div key={"box" + index} className={"boxitem" + " box" + (index + 1)}>
<span className={(item.receive ? 'open' : 'close') + (index + 1)}></span>
<span className="score">{item.score}</span>
{
item.receive && <span className="prizebg"></span>
}
<span className="prize">{item.sendCount}青果</span>
</div>
)
})
}
</div>
);
}
}
export default BarItem;
@import "../../res.less";
.gamebar {
width: 571px;
height: 140px;
left: 88px;
top: 361px;
position: absolute;
.bardown {
width: 522px;
height: 49px;
left: 22px;
top: 49px;
position: absolute;
.sparkBg("homePahe/bardown.png");
}
.baron {
width: 486px;
height: 10px;
left: 36px;
top: 69px;
position: absolute;
.sparkBg("homePahe/baron.png");
}
.boxitem {
width: 102px;
height: 138px;
left: 0px;
top: 0px;
position: absolute;
.open1 {
width: 94px;
height: 93px;
left: 0px;
top: 23px;
position: absolute;
.sparkBg("homePahe/open1.png");
}
.close1 {
width: 75px;
height: 75px;
left: 10px;
top: 31px;
position: absolute;
.sparkBg("homePahe/close1.png");
}
.open2 {
width: 94px;
height: 93px;
left: 0px;
top: 23px;
position: absolute;
.sparkBg("homePahe/open2.png");
}
.close2 {
width: 75px;
height: 75px;
left: 10px;
top: 31px;
position: absolute;
.sparkBg("homePahe/close2.png");
}
.open3 {
width: 94px;
height: 93px;
left: 0px;
top: 23px;
position: absolute;
.sparkBg("homePahe/open3.png");
}
.close3 {
width: 75px;
height: 75px;
left: 10px;
top: 31px;
position: absolute;
.sparkBg("homePahe/close3.png");
}
.open4 {
width: 94px;
height: 93px;
left: 0px;
top: 23px;
position: absolute;
.sparkBg("homePahe/open4.png");
}
.close4 {
width: 75px;
height: 75px;
left: 10px;
top: 31px;
position: absolute;
.sparkBg("homePahe/close4.png");
}
.score {
width: 102px;
height: 20px;
left: 0px;
top: 0px;
text-align: center;
position: absolute;
font-size: 21px;
line-height: 20px;
color: rgba(255, 255, 255, 1);
}
.prizebg {
width: 101px;
height: 30px;
left: 1px;
top: 108px;
position: absolute;
.sparkBg("homePahe/prizebg.png");
}
.prize {
width: 102px;
height: 20px;
left: 0px;
top: 114px;
text-align: center;
position: absolute;
font-size: 20px;
line-height: 20px;
color: rgba(255, 255, 255, 1);
}
}
.box1 {
left: 0px;
top: 1px;
position: absolute;
}
.box2 {
left: 158px;
top: 0px;
position: absolute;
}
.box3 {
left: 326px;
top: 1px;
position: absolute;
}
.box4 {
left: 469px;
top: 1px;
position: absolute;
}
}
\ No newline at end of file
......@@ -8,12 +8,16 @@ import { Button } from '@src/components/Button';
import store from '@src/store';
import { PAGE_MAP } from '@src/utils/constants';
import { Toast } from '@spark/ui';
import BarItem from '@src/components/barItem/barItem';
@observer
class Homepahe extends React.Component {
constructor(props) {
super(props);
}
componentDidMount() {
store.getIndexInfo()
}
click_Rule() {
if (!store.checkTime(false)) {
return
......@@ -49,30 +53,10 @@ class Homepahe extends React.Component {
<span className="show"></span>
<div className="infobox">
<span className="infobg"></span>
<span className="lab">我最高赚了{store.homeInfo.historyMaxScore}</span>
<span className="lab">我最高赚了{store.homeInfo.historyMaxScore || 0}</span>
</div>
<span className="gamebarbg"></span>
<div className="gamebar">
<span className="bardown"></span>
<span className="baron"></span>
<div className="boxitem">
<span className="open1"></span>
<span className="close1"></span>
<span className="open2"></span>
<span className="close2"></span>
<span className="open3"></span>
<span className="close3"></span>
<span className="open4"></span>
<span className="close4"></span>
<span className="score">200分</span>
<span className="prizebg"></span>
<span className="prize">100青果</span>
</div>
<span className="box1"></span>
<span className="box2"></span>
<span className="box3"></span>
<span className="box4"></span>
</div>
<BarItem 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>
......
......@@ -36,10 +36,11 @@
.sparkBg("homePahe/infobg.png");
}
.lab {
width: 202px;
width: 704px;
height: 25px;
left: 265px;
left: 0px;
top: 71px;
text-align: center;
position: absolute;
font-size: 26px;
line-height: 25px;
......@@ -54,160 +55,7 @@
position: absolute;
.sparkBg("homePahe/gameBarbg.png");
}
.gamebar {
width: 571px;
height: 140px;
left: 88px;
top: 361px;
position: absolute;
.bardown {
width: 522px;
height: 49px;
left: 22px;
top: 49px;
position: absolute;
.sparkBg("homePahe/bardown.png");
}
.baron {
width: 486px;
height: 10px;
left: 36px;
top: 69px;
position: absolute;
.sparkBg("homePahe/baron.png");
}
.boxitem {
width: 102px;
height: 138px;
left: 0px;
top: 1px;
position: absolute;
.open1 {
width: 94px;
height: 93px;
left: 0px;
top: 23px;
position: absolute;
.sparkBg("homePahe/open1.png");
}
.close1 {
width: 75px;
height: 75px;
left: 10px;
top: 31px;
position: absolute;
.sparkBg("homePahe/close1.png");
}
.open2 {
width: 94px;
height: 93px;
left: 0px;
top: 23px;
position: absolute;
.sparkBg("homePahe/open2.png");
}
.close2 {
width: 75px;
height: 75px;
left: 10px;
top: 31px;
position: absolute;
.sparkBg("homePahe/close2.png");
}
.open3 {
width: 94px;
height: 93px;
left: 0px;
top: 23px;
position: absolute;
.sparkBg("homePahe/open3.png");
}
.close3 {
width: 75px;
height: 75px;
left: 10px;
top: 21px;
position: absolute;
.sparkBg("homePahe/close3.png");
}
.open4 {
width: 94px;
height: 93px;
left: 0px;
top: 23px;
position: absolute;
.sparkBg("homePahe/open4.png");
}
.close4 {
width: 75px;
height: 75px;
left: 10px;
top: 21px;
position: absolute;
.sparkBg("homePahe/close4.png");
}
.score {
width: 69px;
height: 20px;
left: 20px;
top: 0px;
position: absolute;
font-size: 21px;
line-height: 20px;
color: rgba(255, 255, 255, 1);
}
.prizebg {
width: 101px;
height: 30px;
left: 1px;
top: 108px;
position: absolute;
.sparkBg("homePahe/prizebg.png");
}
.prize {
width: 84px;
height: 20px;
left: 13px;
top: 114px;
position: absolute;
font-size: 20px;
line-height: 20px;
color: rgba(255, 255, 255, 1);
}
}
.box1 {
width: 102px;
height: 138px;
left: 0px;
top: 1px;
position: absolute;
.sparkBg("homePahe/box1.png");
}
.box2 {
width: 101px;
height: 140px;
left: 158px;
top: 0px;
position: absolute;
.sparkBg("homePahe/box2.png");
}
.box3 {
width: 101px;
height: 139px;
left: 326px;
top: 1px;
position: absolute;
.sparkBg("homePahe/box3.png");
}
.box4 {
width: 102px;
height: 139px;
left: 469px;
top: 1px;
position: absolute;
.sparkBg("homePahe/box4.png");
}
}
.startbtn {
width: 451px;
height: 128px;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment