Commit 64657828 authored by Edwise's avatar Edwise 🍷

搞搞搞

parent ef26df64
......@@ -8,8 +8,10 @@ import { CLOSE_POP, SHOW_POP } from "./EdPopAction";
import EdPopBgType from "./style/EdPopBgType";
import EdPopAnimType from "./style/EdPopAnimType";
import EdPopFun from "./EdpopFun";
import { EDPOP_TYPE } from "./EdPopConfig";
class EDPOP {
constructor() {
this.popType = EDPOP_TYPE.NORMAL;
EdPopStore.subscribe(this.renderPop);
this.createMainPopContainer();
}
......@@ -35,6 +37,12 @@ class EDPOP {
* isCenter:true, //是否剧中
*/
showPop(T, propty) {
switch (this.popType) {
case EDPOP_TYPE.SINGLE_POP:
this.closePop(true)
break;
default: break;
}
EdPopStore.dispatch(SHOW_POP({ com: T, propty }));
}
......@@ -59,7 +67,7 @@ class EDPOP {
* closeCall:null, //关闭弹窗时的回调函数
* isCenter:true, //是否剧中
*/
registerPop(T,proprty,level) {
registerPop(T, proprty, level) {
}
......@@ -68,6 +76,15 @@ class EDPOP {
}
/**设置弹窗模式类型 */
setPopType(type) {
if (!EDPOP_TYPE[type]) {
console.error('设置弹窗类型失败,不存在此类型,请检查代码!!!--->设置的弹窗类型为-->', type)
return;
}
this.popType = type;
}
/**禁止滚动 */
disScroll() {
document.body.style.overflow = 'hidden';
......@@ -89,7 +106,7 @@ class EDPOP {
proptyArr.push({ com: itm.com, propty: EdPop.getPropty(itm.propty) });
})
console.log('yef-->', EdPopStore.getState(), proptyArr);
if(proptyArr.length>0) this.disScroll();
if (proptyArr.length > 0) this.disScroll();
else this.enScroll();
return proptyArr;
}
......@@ -140,5 +157,7 @@ const defaultPropty = {
closeCall: () => { }, //关闭弹窗时的回调函数
isCenter: true, //是否弹窗是否剧中
}
export default EdPop;
/**
* @
*/
const EDPOP_TYPE = {
NORMAL: 'NORMAL',
SINGLE_POP:'SINGLE_POP'
}
export {
EDPOP_TYPE
}
\ No newline at end of file
......@@ -16,8 +16,8 @@
.Ed_zoom {
transform-origin: center !important;
animation: Ed_zoom 0.5s linear 0s 1;
-webkit-animation: Ed_zoom 0.5s linear 0s 1;
animation: Ed_zoom 0.5s linear 0s 1 forwards;
-webkit-animation: Ed_zoom 0.5s linear 0s 1 forwards;
}
@keyframes Ed_zoom {
......@@ -39,8 +39,8 @@
.Ed_push {
bottom: 0px !important;
animation: Ed_push 0.4s linear ;
-webkit-animation: Ed_push 0.4s linear ;
animation: Ed_push 0.4s linear forwards;
-webkit-animation: Ed_push 0.4s linear forwards;
}
@keyframes Ed_push {
......
......@@ -18,43 +18,12 @@ import Comwordcenterpop from "./components/comwordcenterpop/comwordcenterpop";
import EdPop from "./EdPop/EdPopRedux/EdPop";
import { EdPopStore } from "./EdPop/EdPopRedux/EdPopStore";
import { SHOW_POP } from "./EdPop/EdPopRedux/EdPopAction";
import Pagetest from "./pages/pagetest/pagetest";
// import {EdPopStore } from "./EdPop/EdPopRedux/EdPopRedux";
const test = {
a: 1,
b: '2'
}
class App extends Component {
componentDidMount() {
// EDPOP.showPop(Comolduserpop, { props: 20, })
// EDPOP.registerPop(Comrulepop)
// EDPOP.registerPop(Comselectpandapop)
// EDPOP.registerPop(Comcoindetailpop,89)
// EDPOP.registerPop(Comwordcenterpop,70,{animType:EdPopAnimType.push})
// setTimeout(()=>{
// EDPOP.cancelPop(Comselectpandapop)
// EDPOP.cancelPop(null,89)
// },1000)
// console.log(typeof(Comwordcenterpop))
// this.dh({ a: 1 })
// EdPopRedux();
// setInterval(()=>{
// EdPopStore.dispatch({type:'INCREMENT'})
// },1000)
setTimeout(()=>{
EdPop.showPop(Comolduserpop);
setTimeout(()=>{
EdPop.showPop(Comrulepop)
},2000)
},1000)
}
render() {
return (
// <Pageloading></Pageloading>
<div></div>
<Pagetest></Pagetest>
);
}
}
......
'use strict';
import React, { Component } from 'react';
import resList from '../../resconfig/resList';
import './comchangeworkpop.less';
class Comchangeworkpop extends Component {
constructor(props) {
super(props);
this.state = { resList: resList };
}
render() {
return (
<div className="changeworkpop ">
<img className="changeworkbg " src={this.state.resList['eb352ad0-b873-4b9d-971f-22c83d1c0cb1'].url} />
<img className="changeworkclose " src={this.state.resList['eec6ec93-1486-4877-9d65-005e5ead3157'].url} />
<span className="changeworktitle ">咦,你想让我换个工作嘛?</span>
<span className="changeworktips ">未完成打工赚不到金币哦</span>
<img className="changeworksure " src={this.state.resList['40731c5d-234b-4814-b14d-3c2e43d9971a'].url} />
<img className="changeworkno " src={this.state.resList['5ab17078-2b9e-4812-8a59-582721ffde81'].url} />
</div>
);
}
}
export default Comchangeworkpop;
.changeworkpop {
width: 654px;
height: 492px;
opacity: 1;
left: 72px;
top: 431px;
position: absolute;
.changeworkbg {
width: 606px;
height: 445px;
opacity: 1;
top: 47px;
position: absolute;
}
.changeworkclose {
width: 118px;
height: 118px;
opacity: 1;
left: 536px;
position: absolute;
}
.changeworktitle {
width: 388px;
height: 34px;
opacity: 1;
left: 103px;
top: 168px;
position: absolute;
font-size: 24px;
color: rgba(181, 79, 39, 1);
}
.changeworktips {
width: 313px;
height: 27px;
opacity: 1;
left: 147px;
top: 233px;
position: absolute;
font-size: 24px;
color: rgba(181, 79, 39, 1);
}
.changeworksure {
width: 254px;
height: 113px;
opacity: 1;
left: 42px;
top: 317px;
position: absolute;
}
.changeworkno {
width: 254px;
height: 113px;
opacity: 1;
left: 311px;
top: 317px;
position: absolute;
}
}
'use strict';
import React, { Component } from 'react';
import EDPOP from '../../EdPop/EdPop';
import resList from '../../resconfig/resList';
import './comcoindetailpop.less';
class Comcoindetailpop extends Component {
constructor(props) {
super(props);
this.state = { resList: resList };
}
componentDidMount(){
console.log('弹窗属性--->olduserpop',EDPOP.getPopData())
}
render() {
return (
<div className="coindetailpop ">
<img className="coindetailbg " src={this.state.resList['8959ccc1-5c59-4dce-96e2-42538e15f9be'].url} />
<img className="coindetailclose " onClick={()=>{EDPOP.closeCurPop()}} src={this.state.resList['99d0cffb-8947-413b-9046-aa2119574d3e'].url} />
<div className="coindetaillist ">
<div className="coindetailitem ">
<span className="coindetailitemname ">打工完成 卖萌唱歌</span>
<span className="coindetailitemcnt ">+20金币</span>
<span className="coindetailitemdate ">2021.01.08 13:20</span>
<img className="coindetailitemline " src={this.state.resList['c81604dc-669a-4ea0-b668-1410560d8d3a'].url} />
</div>
</div>
<span className="coindetailcurcoin ">当前金币数:200</span>
</div>
);
}
}
export default Comcoindetailpop;
.coindetailpop {
width: 655px;
height: 848px;
opacity: 1;
left: 72px;
top: 311px;
position: absolute;
.coindetailbg {
width: 606px;
height: 848px;
opacity: 1;
position: absolute;
}
.coindetailclose {
width: 119px;
height: 119px;
opacity: 1;
left: 536px;
top: 18px;
position: absolute;
}
.coindetaillist {
width: 575px;
height: 92px;
opacity: 1;
left: 16px;
top: 234px;
position: absolute;
.coindetailitem {
width: 575px;
height: 92px;
opacity: 1;
position: absolute;
.coindetailitemname {
width: 231px;
height: 28px;
opacity: 1;
left: 39px;
position: absolute;
font-size: 24.32072px;
color: rgba(255, 91, 0, 1);
}
.coindetailitemcnt {
width: 97px;
height: 26px;
opacity: 1;
left: 450px;
top: 2px;
position: absolute;
font-size: 24.32072px;
color: rgba(190, 102, 24, 1);
}
.coindetailitemdate {
width: 177px;
height: 18px;
opacity: 1;
left: 38px;
top: 42px;
position: absolute;
font-size: 21.61842px;
color: rgba(197, 125, 77, 1);
}
.coindetailitemline {
width: 575px;
height: 1px;
opacity: 0.45098039215686275;
top: 91px;
position: absolute;
}
}
}
.coindetailcurcoin {
width: 184px;
height: 25px;
opacity: 1;
left: 212px;
top: 157px;
position: absolute;
font-size: 26.16693px;
color: rgba(197, 125, 77, 1);
}
}
'use strict';
import React, { Component } from 'react';
import resList from '../../resconfig/resList';
import './comnewuserpop.less';
class Comnewuserpop extends Component {
constructor(props) {
super(props);
this.state = { resList: resList };
}
render() {
return (
<div className="newuserpop ">
<img className="newuserlight " src={this.state.resList['ca3ea540-2494-438f-b0f9-c48bb704a288'].url} />
<img className="newuserbamboo " src={this.state.resList['746b6019-76ee-490c-989c-1b21da2e7830'].url} />
<img className="newusertitle " src={this.state.resList['a17fac84-eb32-4fa6-8f9d-8be7650ffa58'].url} />
<span className="newusertips ">5g 竹子</span>
<img className="newuserbtn " src={this.state.resList['cf16e96a-ce27-43fd-80e8-a75c739b37fc'].url} />
</div>
);
}
}
export default Comnewuserpop;
.newuserpop {
width: 729px;
height: 843px;
opacity: 1;
left: 21px;
top: 220px;
position: absolute;
.newuserlight {
width: 729px;
height: 745px;
opacity: 0.7607843137254902;
position: absolute;
}
.newuserbamboo {
width: 373px;
height: 227px;
opacity: 1;
left: 184px;
top: 331px;
position: absolute;
}
.newusertitle {
width: 331px;
height: 85px;
opacity: 1;
left: 190px;
top: 183px;
position: absolute;
}
.newusertips {
width: 96px;
height: 31px;
opacity: 1;
left: 307px;
top: 599px;
position: absolute;
font-size: 26.68238px;
color: rgba(255, 247, 188, 1);
}
.newuserbtn {
width: 428px;
height: 140px;
opacity: 1;
left: 137px;
top: 703px;
position: absolute;
}
}
'use strict';
import React, { Component } from 'react';
import EDPOP from '../../EdPop/EdPop';
import EdPop from '../../EdPop/EdPopRedux/EdPop';
import resList from '../../resconfig/resList';
import './comolduserpop.less';
class Comolduserpop extends Component {
constructor(props) {
super(props);
this.state = { resList: resList };
}
componentDidMount(){
console.log('弹窗属性--->olduserpop',this.props)
}
componentWillUnmount(){
console.log('olduserpopixezaile----------->>>>>')
}
render() {
return (
<div className="olduserpop ">
<img className="olduserlight " src={this.state.resList['ca3ea540-2494-438f-b0f9-c48bb704a288'].url} />
<img className="olduserbamboo " src={this.state.resList['b04cf277-5588-49d7-8872-aded42ef17aa'].url} />
<img className="oldusertitle " src={this.state.resList['3e8155f6-5fda-4657-8166-fecb794e176f'].url} />
<span className="oldusertips ">5g 竹子</span>
<img className="olduserbtn " onClick={()=>{EdPop.closePop()}} src={this.state.resList['3efc781b-e73b-4cf7-bdd6-cf8cfdf50fd2'].url} />
</div>
);
}
}
export default Comolduserpop;
.olduserpop {
width: 729px;
height: 843px;
opacity: 1;
left: 21px;
top: 220px;
position: absolute;
.olduserlight {
width: 729px;
height: 745px;
opacity: 0.7607843137254902;
position: absolute;
}
.olduserbamboo {
width: 373px;
height: 227px;
opacity: 1;
left: 184px;
top: 331px;
position: absolute;
}
.oldusertitle {
width: 348px;
height: 84px;
opacity: 1;
left: 181px;
top: 184px;
position: absolute;
}
.oldusertips {
width: 96px;
height: 31px;
opacity: 1;
left: 307px;
top: 599px;
position: absolute;
font-size: 26.68238px;
color: rgba(255, 247, 188, 1);
}
.olduserbtn {
width: 428px;
height: 140px;
opacity: 1;
left: 137px;
top: 703px;
position: absolute;
}
}
'use strict';
import React, { Component } from 'react';
import EDPOP from '../../EdPop/EdPop';
import resList from '../../resconfig/resList';
import './comselectpandapop.less';
class Comselectpandapop extends Component {
constructor(props) {
super(props);
this.state = { resList: resList };
}
render() {
return (
<div className="selectpandapop ">
<img className="selectpandabg " src={this.state.resList['21b1ee51-be1b-4d18-99a6-294d55599f95'].url} />
<img className="selectpandaclose " onClick={()=>{EDPOP.closeCurPop()}} src={this.state.resList['99d0cffb-8947-413b-9046-aa2119574d3e'].url} />
<img className="selectpandatitle " src={this.state.resList['cfb47d0f-11a2-4475-8773-1a6145bef210'].url} />
<div className="selectpandainput ">
<img className="selectpandainputbg " src={this.state.resList['c33140fd-4050-433a-9f9c-3558369dfb5a'].url} />
<span className="selectpandainputlabel ">请输入昵称</span>
</div>
<img className="selectpandabtn " src={this.state.resList['4f483f66-cfd3-4f9e-9e44-019550bc0781'].url} />
<div className="selectpandaavatargroup ">
<div className="selecpandaavatargroupl ">
<img className="selecavatarlselect " src={this.state.resList['f42426f2-be18-42f5-98ea-91a6bfe48e7a'].url} />
<img className="selecavatarlsmall " src={this.state.resList['99c24df0-8c5d-43f1-abd1-27226dae91aa'].url} />
<img className="selecavatarlbig " src={this.state.resList['11cc2bd4-2192-4c5e-a181-7b3f6efe9199'].url} />
</div>
<div className="selecpandaavatargroupr ">
<img className="selecavatarrselect " src={this.state.resList['f42426f2-be18-42f5-98ea-91a6bfe48e7a'].url} />
<img className="selecavatarrsmall " src={this.state.resList['ba09f353-4c59-4f25-9aaa-206eac8199c3'].url} />
<img className="selecavatarrbig " src={this.state.resList['51558f7f-426d-45aa-8608-e4f97083c3cb'].url} />
</div>
<div className="selecpandaavatargroupm ">
<img className="selecavatarmselect " src={this.state.resList['f42426f2-be18-42f5-98ea-91a6bfe48e7a'].url} />
<img className="selecavatarmsmall " src={this.state.resList['e2808f4a-5282-405e-9b4f-aa71f76cada6'].url} />
<img className="selecavatarmbig " src={this.state.resList['989e13ab-c8da-4490-b363-4355e149b22f'].url} />
</div>
</div>
</div>
);
}
}
export default Comselectpandapop;
.selectpandapop {
width: 655px;
height: 736px;
opacity: 1;
left: 72px;
top: 431px;
position: absolute;
.selectpandabg {
width: 606px;
height: 689px;
opacity: 1;
top: 47px;
position: absolute;
}
.selectpandaclose {
width: 119px;
height: 119px;
opacity: 1;
left: 536px;
position: absolute;
}
.selectpandatitle {
width: 397px;
height: 85px;
opacity: 1;
left: 96px;
top: 123px;
position: absolute;
}
.selectpandainput {
width: 411px;
height: 79px;
opacity: 1;
left: 97px;
top: 430px;
position: absolute;
.selectpandainputbg {
width: 411px;
height: 79px;
opacity: 1;
position: absolute;
}
.selectpandainputlabel {
width: 118px;
height: 24px;
opacity: 1;
left: 147px;
top: 27px;
position: absolute;
font-size: 24px;
color: rgba(197, 125, 77, 1);
}
}
.selectpandabtn {
width: 428px;
height: 140px;
opacity: 1;
left: 82px;
top: 544px;
position: absolute;
}
.selectpandaavatargroup {
width: 496px;
height: 171px;
opacity: 1;
left: 54px;
top: 230px;
position: absolute;
.selecpandaavatargroupl {
width: 165px;
height: 165px;
opacity: 1;
top: 3px;
position: absolute;
.selecavatarlselect {
width: 165px;
height: 165px;
opacity: 1;
position: absolute;
}
.selecavatarlsmall {
width: 132px;
height: 132px;
opacity: 1;
left: 18px;
top: 22px;
position: absolute;
}
.selecavatarlbig {
width: 142px;
height: 142px;
opacity: 1;
left: 16px;
top: 16px;
position: absolute;
}
}
.selecpandaavatargroupr {
width: 165px;
height: 165px;
opacity: 1;
left: 331px;
position: absolute;
.selecavatarrselect {
width: 165px;
height: 165px;
opacity: 1;
position: absolute;
}
.selecavatarrsmall {
width: 131px;
height: 132px;
opacity: 1;
left: 17px;
top: 25px;
position: absolute;
}
.selecavatarrbig {
width: 141px;
height: 142px;
opacity: 1;
left: 16px;
top: 19px;
position: absolute;
}
}
.selecpandaavatargroupm {
width: 165px;
height: 165px;
opacity: 1;
left: 166px;
top: 6px;
position: absolute;
.selecavatarmselect {
width: 165px;
height: 165px;
opacity: 1;
position: absolute;
}
.selecavatarmsmall {
width: 131px;
height: 132px;
opacity: 1;
left: 16px;
top: 19px;
position: absolute;
}
.selecavatarmbig {
width: 142px;
height: 142px;
opacity: 1;
left: 12px;
top: 19px;
position: absolute;
}
}
}
}
'use strict';
import React, { Component } from 'react';
import resList from '../../resconfig/resList';
import './comtaskcenterpop.less';
class Comtaskcenterpop extends Component {
constructor(props) {
super(props);
this.state = { resList: resList };
}
render() {
return (
<div className="taskcenterpop ">
<img className="taskbg " src={this.state.resList['3b1fa373-c9e7-43f8-9c9c-36972088438b'].url} />
<img className="taskclose " src={this.state.resList['128610f9-027f-4989-8c04-9d444e1790fd'].url} />
<div className="tasklistgroup ">
<div className="tasklist ">
<div className="taskitem ">
<img className="taskitembg " src={this.state.resList['80bc2f88-b9c2-4958-be91-f665c219f1bc'].url} />
<img className="taskitemicon " src={this.state.resList['803d4a5a-d665-4472-b5de-a5941eef604a'].url} />
<img className="taskitemdonebtn " src={this.state.resList['b6637d66-d14d-4380-92ec-775c1f182338'].url} />
<img className="taskitemsharebtn " src={this.state.resList['b73069a5-4843-47d2-bb1a-a4b2c1d2ae64'].url} />
<span className="taskitemname ">分享好友(0/3)</span>
<span className="taskitemrecord ">奖励竹子+10g,每日3次</span>
<span className="taskitemtips ">每成功分享给1位好友</span>
<div className="taskitemprogressgroup ">
<img
className="taskitemprogressbg "
src={this.state.resList['045ad3d3-cf02-40a1-a035-22d8b87dca43'].url}
/>
<img
className="taskitemprogressfront "
src={this.state.resList['82ec79a8-96ad-4eb1-9e74-5c0617cf8075'].url}
/>
</div>
</div>
</div>
<img className="taskscrollbar " src={this.state.resList['a2e2bf23-bc53-4d8f-8518-fb6bbb4e7cb4'].url} />
</div>
<img className="tasksignbg " src={this.state.resList['bb795927-834d-4198-a944-cc0fe68f35be'].url} />
<img className="tasksignsignedbtn " src={this.state.resList['cee79f5c-779e-4d3d-b3e0-48a8fc294f38'].url} />
<img className="tasksigndosignbtn " src={this.state.resList['e79dd83c-c8f3-4e56-82e0-40405f7f12ca'].url} />
<img className="tasksignresignbtn " src={this.state.resList['b2e6a86c-02a4-4465-8d54-345ea4580012'].url} />
<div className="tasksignitem ">
<img
className="tasksignitemsignedicon "
src={this.state.resList['610bfd58-bee4-424d-9982-18caa6100ed0'].url}
/>
<div className="tasksignitemsmalbam ">
<img
className="tasksignitemsmalbamicon "
src={this.state.resList['c55153c1-fc8b-4abd-9652-e01777980dc0'].url}
/>
<span className="tasksignitemsmalbamcnt ">10g</span>
</div>
<div className="tasksignitemmidbam ">
<img
className="tasksignitemmidbamicon "
src={this.state.resList['b6864083-786d-4c32-8770-e76a0858a89f'].url}
/>
<span className="tasksignitemmidbamcnt ">20g</span>
</div>
<div className="tasksignitembigbam ">
<img
className="tasksignitembigbamicon "
src={this.state.resList['8560a8e5-9511-4fa0-a63f-e3044ddb8159'].url}
/>
<span className="tasksignitembigbamcnt ">50g</span>
</div>
<span className="tasksignitemday ">第1天</span>
</div>
</div>
);
}
}
export default Comtaskcenterpop;
.taskcenterpop {
width: 750px;
height: 1094px;
opacity: 1;
top: 530px;
position: absolute;
.taskbg {
width: 750px;
height: 1046px;
opacity: 1;
top: 48px;
position: absolute;
}
.taskclose {
width: 121px;
height: 122px;
opacity: 1;
left: 628px;
position: absolute;
}
.tasklistgroup {
width: 642px;
height: 274px;
opacity: 1;
left: 62px;
top: 307px;
position: absolute;
.tasklist {
width: 627px;
height: 170px;
opacity: 1;
position: absolute;
.taskitem {
width: 627px;
height: 170px;
opacity: 1;
position: absolute;
.taskitembg {
width: 627px;
height: 169px;
opacity: 1;
top: 1px;
position: absolute;
}
.taskitemicon {
width: 155px;
height: 156px;
opacity: 1;
left: 2px;
position: absolute;
}
.taskitemdonebtn {
width: 161px;
height: 75px;
opacity: 1;
left: 437px;
top: 48px;
position: absolute;
}
.taskitemsharebtn {
width: 161px;
height: 75px;
opacity: 1;
left: 437px;
top: 48px;
position: absolute;
}
.taskitemname {
width: 173px;
height: 28px;
opacity: 1;
left: 154px;
top: 33px;
position: absolute;
font-size: 26px;
color: rgba(197, 125, 77, 1);
}
.taskitemrecord {
width: 252px;
height: 26px;
opacity: 1;
left: 156px;
top: 74px;
position: absolute;
font-size: 24px;
color: rgba(255, 91, 0, 1);
}
.taskitemtips {
width: 224px;
height: 24px;
opacity: 1;
left: 155px;
top: 112px;
position: absolute;
font-size: 24px;
color: rgba(255, 91, 0, 1);
}
.taskitemprogressgroup {
width: 97px;
height: 14px;
opacity: 1;
left: 340px;
top: 40px;
position: absolute;
.taskitemprogressbg {
width: 97px;
height: 14px;
opacity: 1;
position: absolute;
}
.taskitemprogressfront {
width: 97px;
height: 14px;
opacity: 1;
position: absolute;
}
}
}
}
.taskscrollbar {
width: 12px;
height: 192px;
opacity: 1;
left: 630px;
top: 82px;
position: absolute;
}
}
.tasksignbg {
width: 461px;
height: 10px;
opacity: 1;
left: 76px;
top: 208px;
position: absolute;
}
.tasksignsignedbtn {
width: 131px;
height: 62px;
opacity: 1;
left: 581px;
top: 174px;
position: absolute;
}
.tasksigndosignbtn {
width: 131px;
height: 62px;
opacity: 1;
left: 581px;
top: 174px;
position: absolute;
}
.tasksignresignbtn {
width: 131px;
height: 62px;
opacity: 1;
left: 581px;
top: 174px;
position: absolute;
}
.tasksignitem {
width: 522px;
height: 95px;
opacity: 1;
left: 43px;
top: 169px;
position: absolute;
.tasksignitemsignedicon {
width: 54px;
height: 53px;
opacity: 1;
top: 17px;
position: absolute;
}
.tasksignitemsmalbam {
width: 53px;
height: 52px;
opacity: 1;
left: 68px;
top: 10px;
position: absolute;
.tasksignitemsmalbamicon {
width: 53px;
height: 52px;
opacity: 1;
position: absolute;
}
.tasksignitemsmalbamcnt {
width: 26px;
height: 15px;
opacity: 1;
left: 17px;
top: 35px;
position: absolute;
font-size: 17.28px;
color: rgba(255, 247, 229, 1);
}
}
.tasksignitemmidbam {
width: 70px;
height: 52px;
opacity: 1;
left: 138px;
top: 9px;
position: absolute;
.tasksignitemmidbamicon {
width: 70px;
height: 52px;
opacity: 1;
position: absolute;
}
.tasksignitemmidbamcnt {
width: 26px;
height: 15px;
opacity: 1;
left: 22px;
top: 35px;
position: absolute;
font-size: 17.28px;
color: rgba(255, 247, 229, 1);
}
}
.tasksignitembigbam {
width: 70px;
height: 62px;
opacity: 1;
left: 452px;
position: absolute;
.tasksignitembigbamicon {
width: 70px;
height: 62px;
opacity: 1;
position: absolute;
}
.tasksignitembigbamcnt {
width: 26px;
height: 15px;
opacity: 1;
left: 23px;
top: 45px;
position: absolute;
font-size: 17.28px;
color: rgba(255, 247, 229, 1);
}
}
.tasksignitemday {
width: 55px;
height: 21px;
opacity: 1;
top: 74px;
position: absolute;
font-size: 27.90252px;
color: rgba(209, 166, 108, 1);
}
}
}
'use strict';
import React, { Component } from 'react';
import EDPOP from '../../EdPop/EdPop';
import { useEdDebounce } from '../../hooksTest/EdDebounce';
import resList from '../../resconfig/resList';
import './comwordcenterpop.less';
class Comwordcenterpop extends Component {
constructor(props) {
super(props);
this.state = { resList: resList };
}
render() {
return (
<div className="wordcenterpop ">
<img className="wordcenterbg " src={this.state.resList['843978f3-f3f2-4ded-8dc9-b2cf82fbdbb8'].url} />
<span className="wordcenterusercoin ">当前金币数:200</span>
<div className="wordcenteritem ">
<img className="wordcenteritembg " src={this.state.resList['f8cbfed2-0ba1-4679-8fe3-bf5982353d36'].url} />
<img className="wordcenteritemimg " src={this.state.resList['a9e730dd-d407-4714-88f2-c60f573dd290'].url} />
<span className="wordcenteritemtime ">工作时长:5h</span>
<span className="wordcenteritemrecord ">薪酬:200金币</span>
<span className="wordcentername ">卖萌唱歌</span>
<img
className="wordcenteritemworking "
src={this.state.resList['67f5552a-7f12-4846-a953-0886b5bb77f9'].url}
/>
</div>
<img className="wordcenterclose " onClick={()=>{useEdDebounce(()=>{console.log('aaaa')})}} src={this.state.resList['5ed48e98-4aff-48b3-94ce-b1cc99426c02'].url} />
<img className="wordcenterscrollbar " src={this.state.resList['a2e2bf23-bc53-4d8f-8518-fb6bbb4e7cb4'].url} />
</div>
);
}
}
export default Comwordcenterpop;
.wordcenterpop {
width: 750px;
height: 1164px;
opacity: 1;
top: 460px;
position: absolute;
.wordcenterbg {
width: 750px;
height: 1164px;
opacity: 1;
position: absolute;
}
.wordcenterusercoin {
width: 258px;
height: 34px;
opacity: 1;
left: 81px;
top: 287px;
position: absolute;
font-size: 36px;
color: rgba(197, 125, 77, 1);
}
.wordcenteritem {
width: 270px;
height: 358px;
opacity: 1;
left: 80px;
top: 354px;
position: absolute;
.wordcenteritembg {
width: 270px;
height: 356px;
opacity: 1;
position: absolute;
}
.wordcenteritemimg {
width: 217px;
height: 170px;
opacity: 1;
left: 26px;
top: 62px;
position: absolute;
}
.wordcenteritemtime {
width: 149px;
height: 25px;
opacity: 1;
left: 35px;
top: 259px;
position: absolute;
font-size: 25.25242px;
color: rgba(197, 125, 77, 1);
}
.wordcenteritemrecord {
width: 158px;
height: 24px;
opacity: 1;
left: 38px;
top: 300px;
position: absolute;
font-size: 25.25242px;
color: rgba(197, 125, 77, 1);
}
.wordcentername {
width: 98px;
height: 24px;
opacity: 1;
left: 87px;
top: 10px;
position: absolute;
font-size: 25.25242px;
color: rgba(255, 255, 255, 1);
}
.wordcenteritemworking {
width: 270px;
height: 358px;
opacity: 1;
position: absolute;
}
}
.wordcenterclose {
width: 113px;
height: 121px;
opacity: 1;
left: 637px;
top: 19px;
position: absolute;
}
.wordcenterscrollbar {
width: 12px;
height: 192px;
opacity: 1;
left: 704px;
top: 400px;
position: absolute;
}
}
'use strict';
import React, { Component } from 'react';
import resList from '../../resconfig/resList';
import './comworksurepop.less';
class Comworksurepop extends Component {
constructor(props) {
super(props);
this.state = { resList: resList };
}
render() {
return (
<div className="worksurepop ">
<img className="worksurebg " src={this.state.resList['fa069fd7-5a8c-4bd2-af42-7da39f692d6d'].url} />
<img className="worksureclose " src={this.state.resList['eec6ec93-1486-4877-9d65-005e5ead3157'].url} />
<span className="worksurename ">开始卖萌唱歌了哦</span>
<span className="worksurerecord ">工作5h可赚取200金币</span>
<img className="worksureno " src={this.state.resList['57a12e6a-a051-40bc-a689-af7eee1a21f7'].url} />
<img className="worksurestart " src={this.state.resList['1176e8bc-fb74-4910-98c5-55a06d67b546'].url} />
</div>
);
}
}
export default Comworksurepop;
.worksurepop {
width: 654px;
height: 492px;
opacity: 1;
left: 72px;
top: 431px;
position: absolute;
.worksurebg {
width: 606px;
height: 445px;
opacity: 1;
top: 47px;
position: absolute;
}
.worksureclose {
width: 118px;
height: 118px;
opacity: 1;
left: 536px;
position: absolute;
}
.worksurename {
width: 332px;
height: 38px;
opacity: 1;
left: 130px;
top: 170px;
position: absolute;
font-size: 24px;
color: rgba(181, 79, 39, 1);
}
.worksurerecord {
width: 279px;
height: 27px;
opacity: 1;
left: 156px;
top: 233px;
position: absolute;
font-size: 24px;
color: rgba(181, 79, 39, 1);
}
.worksureno {
width: 254px;
height: 113px;
opacity: 1;
left: 42px;
top: 317px;
position: absolute;
}
.worksurestart {
width: 254px;
height: 113px;
opacity: 1;
left: 311px;
top: 317px;
position: absolute;
}
}
'use strict';
import React, { Component } from 'react';
import resList from '../../resconfig/resList';
//import API from '../../api';
import './pagetest.less';
class Pagetest extends Component {
constructor(props) {
super(props);
this.state = { resList: resList };
}
render() {
return (
<div className="test ">
</div>
);
}
}
export default Pagetest;
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