Skip to content

D
db-game-template
Commit 75c7487d authored by 李硕's avatar 李硕
Browse files
Options

提交

parent 31f86546
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 609 additions and 169 deletions
wishList/project/mock/common/interface.js
View file @ 75c7487d
......@@ -13,8 +13,8 @@ export const rule = {
export const index = {
"code": "",
"data": {
"newHandFlg": false,
"nicknameFlg": false,
"newHandFlg": true,
"nicknameFlg": true,
"wishCountFlg": false
},
"message": "",
......@@ -44,16 +44,27 @@ export const wishIndex = {
"code": "",
"data": {
"wishPool": [
{
"wishId": '',
"wishName": "",
"types": ""
}
{ "wishId": '1', "wishName": "一字成语", "types": "" },
{ "wishId": '2', "wishName": "22字成语", "types": "" },
{ "wishId": '3', "wishName": "33字成语", "types": "" },
{ "wishId": '4', "wishName": "44字成语", "types": "" },
{ "wishId": '5', "wishName": "55字成语", "types": "" },
{ "wishId": '6', "wishName": "66字成语", "types": "" },
{ "wishId": '7', "wishName": "77字成语", "types": "" },
{ "wishId": '8', "wishName": "88字成语", "types": "" },
{ "wishId": '9', "wishName": "99字成语", "types": "" },
{ "wishId": '10', "wishName": "00字成语", "types": "" },
{ "wishId": '11', "wishName": "11字成语", "types": "" },
{ "wishId": '12', "wishName": "12字成语", "types": "" },
{ "wishId": '13', "wishName": "13字成语", "types": "" },
{ "wishId": '14', "wishName": "14字成语", "types": "" },
],
"wishCountFlg": true
},
"message": "",
"success": false
"success": true
};
/**
* 抽奖接口
......@@ -69,9 +80,9 @@ export const join = {
"data": {
"optionId": "",
"prizeId": "",
"prizeName": "",
"url": "",
"icon": ""
"prizeName": "飞机飞机飞机机飞机飞机飞机",
"url": "http://www.taobao.com",
"icon": "12312"
},
"message": "",
"success": false
......@@ -84,27 +95,19 @@ export const join = {
* wishName
*/
export const myWishData = {
"wishCountFlg": false,
"nickName": "",
"wishData": {
"blessing": "",
"wishList": [
{
"wishId": "",
"wishName": "",
"types": ""
},
{
"wishId": "",
"wishName": "",
"types": ""
},
{
"wishId": "",
"wishName": "",
"types": ""
}
]
"data": {
"wishCountFlg": true,
"nickName": "中奖昵称",
"wishData": {
"blessing": "祝福之语祝福之语祝福之语祝福之语祝福之语祝福之语祝福之语祝福之语祝福之语祝福之语祝福之语祝福之语祝福之语祝福之语祝福之语祝福之语祝福之语祝福之语",
"wishList": [
{ "wishId": "", "wishName": "祝福一号", "types": "" },
{ "wishId": "", "wishName": "祝福二号", "types": "" },
{ "wishId": "", "wishName": "祝福三号", "types": "" },
{ "wishId": "", "wishName": "祝福四号", "types": "" },
{ "wishId": "", "wishName": "祝福一号祝福一号祝福", "types": "" }
]
}
},
"code": "",
"message": "",
......
wishList/project/public/index.html
View file @ 75c7487d
......@@ -7,7 +7,7 @@
<meta name="theme-color" content="#000000">
<script src="getTokenKey" id="scriptkey"></script>
<script id="scriptjs" src="//yun.duiba.com.cn/js-libs/px-token/0.0.4/px-token.min.js"></script>
<title>React App</title>
<title>广州工行心愿清单</title>
<script>
!(function (e, i) {
var t = e.documentElement,
......
wishList/project/src/BaseRouter.jsx
View file @ 75c7487d
......@@ -14,9 +14,6 @@ export class BaseRouter extends Component {
return (
<Router history={mHistory}>
<Switch>
{/*<Route path="/" component={App} exact children={() => {*/}
{/* return <Index/>*/}
{/*}}/>*/}
<Route path="/" exact component={Pagemainscene} />
<Route path="/a" exact component={Pagewishscene} />
<Route path="/b" exact component={Pageresultscene} />
......
wishList/project/src/components/comawardpanel/comawardpanel.jsx
View file @ 75c7487d
......@@ -17,7 +17,7 @@ class Comawardpanel extends Component {
<div className="awardmodal ">
<img className="awardShadow " />
<img className="awardbg " src={this.state.resList['23c6394c-27f6-4d97-a161-14c7c25576cb'].url} />
<img className="checkbtn " onClick={() => { jumpUrl(JUMP_URL.awardUrl) }} src={this.state.resList['27185466-4588-425b-b55d-bd663a6885a2'].url} />
<img className="checkbtn " onClick={() => { jumpUrl(JUMP_URL.AWARD_URL) }} src={this.state.resList['27185466-4588-425b-b55d-bd663a6885a2'].url} />
<img className="awardclose1 " onClick={onClose} src={this.state.resList['012e2a83-6e78-4f10-9ea7-c26dab7cb711'].url} />
<img className="prizeimg " src={prizeImg || this.state.resList[USE_IMG_RES.BACKUP_IMG].url} />
{/* <div className="prizeimg " /> */}
......
wishList/project/src/components/comguidepanel/comguidepanel.jsx
View file @ 75c7487d
......@@ -10,11 +10,12 @@ class Comguidepanel extends Component {
this.state = { resList: resList };
}
render() {
let { onClose } = this.props;
return (
<div className="guidepanel ">
<div className="guide ">
<img className="guidebg " src={this.state.resList['7a698ace-ce6e-4602-9a87-6535e80c087a'].url} />
<img className="guidebtn " src={this.state.resList['c60ec7de-fe4e-4c4d-9038-f249b078c456'].url} />
<img className="guidebtn " onClick={onClose} src={this.state.resList['c60ec7de-fe4e-4c4d-9038-f249b078c456'].url} />
<img className="hand " src={this.state.resList['1d1f4740-ef77-4f46-a74b-d7fd786cb69f'].url} />
</div>
</div>
......
wishList/project/src/components/comloadingscene/comloadingscene.jsx
View file @ 75c7487d
......@@ -14,7 +14,7 @@ class Comloadingscene extends Component {
}
componentDidMount() {
let { time, onClose } = this.props;
console.log('>>>>.........>', time, onClose);
// console.log('>>>>.........>', time, onClose);
this.fun(time);
}
fun(t) {
......@@ -22,11 +22,10 @@ class Comloadingscene extends Component {
requestAnimationFrame(() => {
if (Date.now() < t) {
this.fun(t);
console.log('----');
// console.log('----');
} else {
console.log('加载完毕');
onClose();
// cancelAnimationFrame(this.fun(t));
}
});
}
......@@ -34,7 +33,7 @@ class Comloadingscene extends Component {
let { onClose } = this.props;
return (
<div className="loadingscene ">
<img className="load " src={this.state.resList['a4f92f5b-4926-4db0-8e98-6348dda22c8a'].url} />
<img className="load " src={this.state.resList['a4f92f5b-4926-4db0-8e98-6348dda22c8a'].url} />
<div className="loadings " >
<img className="loadingbg " src={this.state.resList['ee411dfb-e92f-4316-a0bf-1abf0f877b04'].url} />
<img className="loading " src={this.state.resList['938c373e-0e9f-4e03-a8e3-314cae5267fc'].url} />
......
wishList/project/src/components/comnickpanel/comnickpanel.jsx
View file @ 75c7487d
......@@ -2,18 +2,52 @@
import React, { Component } from 'react';
import resList from '../../resconfig/resList';
import API from '../../api';
import { getPxToken } from '../../libs/spark_gettoken';
import './comnickpanel.less';
import { getModalHoc, Toast } from 'spark-design';
class Comnickpanel extends Component {
constructor(props) {
super(props);
this.state = {
resList: resList,
nickName: ""
nickName: "",
modalType: ""
};
}
/**
* 提交昵称
*/
postNickname(nickName) {
let { onClose } = this.props;
if (nickName) {
getPxToken(async token => {
let { success, message, data } = await API.saveNickName({ token: token, nickName: nickName });
if (success) {
console.log('接口调用成功', nickName);
onClose();
} else {
Toast(message)
}
})
} else {
Toast('请输入昵称')
}
}
onChangeInputValue() {
let inputValue = document.getElementById("nicknameInput").value;
console.log('>>>>>.......', inputValue);
this.setState({
nickName: inputValue,
})
}
render() {
let { onClose } = this.props;
let { nickName } = this.state;
return (
<div className="nickpanel ">
<div className="nickmodal ">
......@@ -22,10 +56,11 @@ class Comnickpanel extends Component {
<img className="closebtn " onClick={onClose} src={this.state.resList['012e2a83-6e78-4f10-9ea7-c26dab7cb711'].url} />
<img
className="kai_shi_chuang_jian_huan_qi "
onClick={() => { this.postNickname(nickName) }}
src={this.state.resList['08101bcc-ed92-4893-ae57-b0d2f53294c1'].url}
/>
<img className="nickinput " src={this.state.resList['4ef09ae1-195d-473e-8eaf-06eac70dd005'].url} />
<input className="nickInput" value={}></input>
<input className="nickInputLab" id="nicknameInput" placeholder="请输入(0/10)" onChange={() => { this.onChangeInputValue() }} maxLength="10"></input>
</div>
</div>
);
......
wishList/project/src/components/comnickpanel/comnickpanel.less
View file @ 75c7487d
......@@ -62,5 +62,19 @@
position: absolute;
transform-origin: 0px 0px 0px;
}
.nickInputLab {
width: 488px;
height: 81px;
position: relative;
border: 0px;
margin-top: 34vw;
margin-left: 12vw;
text-align: center;
font-size: 45px;
color: rgb(241, 140, 8);
// background-color:yellow;
}
}
}
\ No newline at end of file
wishList/project/src/components/comprizepanel/comprizepanel.jsx
View file @ 75c7487d
......@@ -15,13 +15,14 @@ class Comprizepanel extends Component {
getPrize() {
let { onClose } = this.props;
alert("开心收下奖品");
// alert("开心收下奖品");
onClose();
}
render() {
let { onClose, data } = this.props;
console.log('data========',data);
return (
<div className="prizepanel ">
<div className="prizemodal ">
......@@ -30,8 +31,8 @@ class Comprizepanel extends Component {
<img className="getawardbtn " onClick={() => { this.getPrize() }} src={this.state.resList['b8893125-a836-4af2-892b-b5b01fc56772'].url} />
<span className="awarddesc ">您的心愿树已长成，快去看看吧~</span>
<img className="awardclose " onClick={onClose} src={this.state.resList['ad393b2f-4146-4f93-83f8-9c76a933daff'].url} />
<img className="img " src={data.img || this.state.resList['32b67dd1-c9e3-4ff0-b5f5-243426b71e39'].url} />
<span className="prizename ">{data.name || '恭喜中奖!'}</span>
<img className="img " src={data.icon || this.state.resList['32b67dd1-c9e3-4ff0-b5f5-243426b71e39'].url} />
<span className="prizename ">{data.prizeName || '恭喜中奖!'}</span>
</div>
</div>
);
......
wishList/project/src/components/comprizepanel/comprizepanel.less
View file @ 75c7487d
......@@ -77,13 +77,14 @@
transform-origin: 0px 0px 0px;
}
.prizename {
width: 360px;
.prizename {
width: 420px;
height: 46px;
opacity: 1;
left: 305px;
left: 275px;
overflow-x: hidden;
top: 475px;
position: relative;
position: absolute;
transform-origin: 0px 0px 0px;
font-size: 30px;
color: rgba(148, 76, 18, 1);
......
wishList/project/src/constant.js
View file @ 75c7487d
......@@ -9,7 +9,7 @@ export const MODAL_TYPE = {
"prizeResult": 7
}
export const JUMP_URL = {
awardUrl: "http://www.baidu.com",
AWARD_URL: CFG.recordUrl || "http://www.baidu.com",
}
......
wishList/project/src/libs/spark_createposter.js 0 → 100644
View file @ 75c7487d
/**
* 截图方法封装
*
*
* 使用方法： npm install --save html2canvas
*
*
* import { createrPoster } from '../../libs/spark_createposter';
async createPoster()
{
let url = await createPoster("rule",{
x:window.innerWidth/4,
y:window.innerHeight/4,
width:window.innerWidth/2,
height:window.innerHeight/2
});
this.setState({
img_src:url
})
}
调用：this.createPoster();
jsx:
const {img_src=""} = this.state;
{img_src && <img src={img_src} style={{ width: '50vw', height: '50vw', position: "absolute", left: 0, top: 0 }} />}
*
*
* 注意事项：html2canvas有各种兼容问题
* 1：html2canvas 使用 1.0.0-rc.5 版本， ios 设备上会没有任何显示。then函数不会被回调也不会报错。请降级强制使用 1.0.0-rc.4 版本。（注意package.json 内的 "^1.0.0-rc.4" ^ 符号要去掉）
* 2：所有 dom 内的图片不能跨域，否则会导致白屏等奇怪问题。即使加上useCORS 与 allowTaint也无法解决，浏览器控制台直接会打印CORS相关报错。
* 3：生成的图片清晰度受原始图片的质量与width、height、windowWidth、windowHeight、scale 影响，请根据实际情况来调节这几个参数。
* 4：如果生成的base64图片过大，会导致图片无法显示，请相应减小3中的几个参数值。
* 5：不可将图片转换为Blob的形式，设备虽然可以正常显示图片，但是无法进行长按保存，保存下来的图片可能为一个空白的图像。
* 6：在指定dom来生成图片时，会受offsetTop与offsetLeft影响。例如 offsetTop 为 20 时，生成的图片顶部 20px(不一定为 20px)的距离会被所设置的backgroundColor(默认白色)颜色填充。这时，可使用 x与y参数进行校正。
* 7：如果一直出现跨域的情况，或者图片一直不出现的情况，可考虑将图片资源转换成 base64。例如就遇到二维码图片链接某些设备上一直不出现，则可以考虑接口直接返回二维码内容，由前端根据返回的内容来创建二维码。
* 8：当还出现一些奇奇怪怪的问题时，可尝试切换html2canvas版本。
*/
import html2Canvas from 'html2canvas';
/**
*
* @param {*} domId dom的id名，不传默认是body
* @param {*} options 重写的截图配置，具体参考html2canvas官方示例:http://html2canvas.hertzen.com/configuration
* @param {*} imgType 图片类型，默认是jpg
*/
const createPoster=async (domId,options={},imgType="image/jpeg")=>{
let dom = domId?document.getElementById(domId):document.body;
let defaultOptions={
useCORS:true,
scale:devicePixelRatio||1,
width:window.innerWidth,
height:window.innerHeight,
windowWidth:window.innerWidth,
windowHeight:window.innerHeight
}
options={
...defaultOptions,
...options
}
let canvas = await html2Canvas(dom,options).catch(err=>{console.error("截图失败:",err)})
return canvas.toDataURL(imgType);
}
export default createPoster;
\ No newline at end of file
wishList/project/src/libs/spark_gettoken.js 0 → 100644
View file @ 75c7487d
/**
* 两种获取token封装（getPxToken和getDuibaToken）
*
*
*/
/**
* @param {} callback
*/
if (!document.getElementById("scriptkey")) {
const scriptkey = document.createElement('script')
scriptkey.async = 'async';
scriptkey.src = `getTokenKey`;
scriptkey.id = "scriptkey";
document.getElementsByTagName('head')[0].appendChild(scriptkey);
const scriptjs = document.createElement('script')
scriptjs.async = 'async';
scriptjs.id = "scriptjs";
scriptjs.src = `//yun.duiba.com.cn/js-libs/px-token/0.0.3/px-token.min.js`;
document.getElementsByTagName('head')[0].appendChild(scriptjs);
scriptjs.onload = () => {
}
}
const getPxToken = (callback) => {
if (window.getPxToken) {
__getPxToken(callback);
return;
}
console.log("px-token.min.js尚未加载完成，请稍后再试")
// callback("waiting..."); //这里就不返回，不做处理
}
function __getPxToken(callback) {
console.info(location.origin)
if(location.origin == "http://localhost:8088"){
callback("11111");
}else{
if (window.getPxToken) {
window.getPxToken((e, token) => {
console.info('get px token:', e);
switch (e) {
case 'net error':
break;
case 'need reload':
break;
case 'need login':
break;
case 'state invalid':
break;
default:
callback(token);
}
})
}
}
}
/**
* @param {} resolve
* @param {} reject
* @param {} againOrderId
*/
const getDuibaToken=(resolve, reject,againOrderId)=>{
$.ajax({
url: '/ctoken/getToken',
type: 'post',
dataType: 'json',
success: function (res) {
if (res.success) {
var data = {
actId: CFG?.actId||"",
oaId: CFG?.oaId||""
};
eval(res.token);
var key = '';
data.token = window[key];
if (againOrderId) {
data.againOrderId = againOrderId;
}
resolve && resolve(data);
} else {
reject('systemError', { message: res.message });
}
},
error: function () {
reject('networkError');
}
});
}
module.exports={
getPxToken,
getDuibaToken
}
wishList/project/src/libs/spark_requstrolling.js 0 → 100644
View file @ 75c7487d
/**
* 接口轮询组件封装
*
* import startRolling from '../../libs/spark_requstrolling.js';
*
* async rollingTest() {
await startRolling(async() => {
return await API.getOrderStatusForThrough({});
}, 5, 1000, "data.lottery.id", 7489, (data) => {
console.log("success:", data);
}, (err) => {
console.log("error:", err);
});
}
调用：this.rollingTest();
*
*
*
* @param {*} fn API请求方法
* @param {*} count 轮询次数
* @param {*} delay 每次轮询的延迟时间（毫秒）
* @param {*} rollKey 断定轮询的条件 采用a.b.c.d结构，例如data.lottery.id
* @param {*} rollValue 断定轮询的值
* @param {*} resolve 成功回调
* @param {*} reject 失败回调
* @param {*} rollingIndex 起始次数，不用传，默认就好
*/
const startRolling = async (fn, count, delay, rollKey, rollValue, resolve, reject, rollingIndex = 1) => {
if (typeof fn !== "function") {
if(reject)reject()
return;
}
console.log("开始轮询，当前轮询次数",rollingIndex)
let result = await fn();
console.log(result);
if (result.success) {
rollingIndex = 1;
if (resolve) resolve(result);
} else {
if (rollKey) {
let rollKeyArr = rollKey.split(".");
let condition = result;
rollKeyArr.map(res => condition = condition[res])
if (condition == rollValue && rollingIndex < count) {
setTimeout(() => {
startRolling(fn, count, delay, rollKey, rollValue, resolve, reject, ++rollingIndex);
}, delay);
} else {
if (reject) reject(result);
}
} else {
if (reject) reject(result);
}
}
}
export default startRolling;
wishList/project/src/libs/spark_wxshare.js 0 → 100644
View file @ 75c7487d
/**
* 微信分享组件封装
*
* 使用方法：
* import wxShare from '../../libs/spark_wxshare'
* wxShare(options)
*
*
* options 参数(可选)
* appId: (必填) String, 公众号的唯一标识
* timestamp: (必填) String, 生成签名的时间戳
* nonceStr: (必填) String, 生成签名的时间戳
* signature: (必填) String, 签名
* jsApiList: (可选) Array, 调用接口列表，默认 ['onMenuShareTimeline', 'onMenuShareAppMessage', 'onMenuShareQQ']
* title: (可选) String, 分享标题，默认doucment.title
* desc: (可选) String, 分享描述，默认空
* shareUrl: (可选) String, 分享链接, 默认当前链接
* imgUrl: (可选) String, 分享图片，默认空
*
*/
const configBuilder = {
onMenuShareTimeline(config) {
return {
title: config.title,
desc: config.desc,
link: config.shareUrl,
imgUrl: config.imgUrl
}
},
onMenuShareAppMessage(config) {
return {
title: config.title,
desc: config.desc,
link: config.shareUrl,
imgUrl: config.imgUrl
}
},
onMenuShareQQ(config) {
return {
title: config.title,
desc: config.desc,
link: config.shareUrl,
imgUrl: config.imgUrl
}
}
}
export default function (config = {}) {
if (!/MicroMessenger/.test(window.navigator.userAgent)) {
return false
}
if(document.getElementById("jweixin"))
{
__handleReady(config);
return;
}
const script = document.createElement('script')
script.async = 'async';
script.id="jweixin";
script.src = `${document.location.protocol}//res.wx.qq.com/open/js/jweixin-1.2.0.js`
document.getElementsByTagName('head')[0].appendChild(script)
script.onload = () => {
__handleReady(config);
}
}
function __handleReady(config) {
if (typeof wx !== 'undefined') {
config.api = config.api || ['onMenuShareTimeline', 'onMenuShareAppMessage', 'onMenuShareQQ']
// 默认值
config.imgUrl = config.imgUrl || window.location.protocol + '//mmbiz.qpic.cn/mmbiz_png/UUn1BJoX4UlEbDXKVFqFsSLcmmagib3oQ31FewyWkLfIbpHgw0xYv02zKrgQJNPGytLpudpib45dWZbC0hnawu9Q/0?wx_fmt=png'
config.shareUrl = config.shareUrl || window.location.href
config.desc = config.desc || ''
config.title = config.title || document.title
wx.config({
// 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
debug: config.debug || false,
// 必填,公众号的唯一标识
appId: config.appid || config.appId || '',
// 必填,生成签名的时间戳
timestamp: config.timestamp || '',
// 必填,生成签名的随机串
nonceStr: config.nonceStr || '',
// 必填,签名,见附录1
signature: config.signature || '',
// 必填,需要使用的JS接口列表
jsApiList: [].concat(config.api)
})
wx.ready(() => {
// wx.checkJsApi({
// jsApiList: config.api
// })
config.api.forEach(key => {
wx[key](configBuilder[key](config))
})
})
}
}
wishList/project/src/pages/pagemainscene/pagemainscene.jsx
View file @ 75c7487d
......@@ -3,16 +3,12 @@
import React, { Component } from 'react';
import resList from '../../resconfig/resList';
import API from '../../api';
import { MODAL_NAME, MODAL_TYPE, modalControl } from "../../constant";
import { MODAL_NAME, MODAL_TYPE,JUMP_URL } from "../../constant";
import { Toast, Loading, getModalHoc } from 'spark-design';
import './pagemainscene.less';
import { } from "react-router-dom"
import ruleMoadl from '../../components/comrulepanel/comrulepanel.jsx';
import awardModal from "../../components/comawardpanel/comawardpanel.jsx";
import { mHistory } from '../../BaseRouter.jsx';
import { rule } from '../../../mock/common';
const RuleModal = getModalHoc(ruleMoadl);
const AwardModal = getModalHoc(awardModal);
class Pagemainscene extends Component {
constructor(props) {
super(props);
......@@ -85,12 +81,11 @@ class Pagemainscene extends Component {
<img className="bg12 " src={this.state.resList['0086550d-2ac4-4217-be82-bab2fb4587fe'].url} />
<div className="mainpage ">
<img className="mainbg " src={this.state.resList['264a6134-1735-43c6-87ae-4143bf11ffde'].url} />
<img className="awardbtn " onClick={() => { this.modalControl(MODAL_NAME.P_PRIZE_CHECK) }} src={this.state.resList['03f842be-59cf-42e9-b845-71aec8da2ef7'].url} />
<img className="awardbtn " onClick={() => { this.jumpUrl(JUMP_URL.AWARD_URL);}} src={this.state.resList['03f842be-59cf-42e9-b845-71aec8da2ef7'].url} />
<img className="rulebtn " onClick={() => { this.modalControl(MODAL_NAME.P_RULE) }} src={this.state.resList['f38cd0ee-a25a-49d7-b526-105c4129edbe'].url} />
<img className="startbtn " onClick={() => { this.scenceJump() }} src={this.state.resList['fd891b60-f234-44f2-a6a8-0e759f5e4a77'].url} />
</div>
{modalType == MODAL_TYPE[MODAL_NAME.P_RULE] && <RuleModal rule={rule} onClose={() => { this.modalControl() }}></RuleModal>}
{modalType == MODAL_TYPE[MODAL_NAME.P_PRIZE_CHECK] && <AwardModal jumpUrl={(url) => { this.jumpUrl(url) }} prizeImg={prizeImg} onClose={() => { this.modalControl() }}></AwardModal>}
</div>
);
}
......
wishList/project/src/pages/pageresultscene/pageresultscene.jsx
View file @ 75c7487d
......@@ -2,8 +2,8 @@
import React, { Component } from 'react';
import resList from '../../resconfig/resList';
//import API from '../../api';
import { MODAL_NAME, MODAL_TYPE } from '../../constant'
import API from '../../api';
import { MODAL_NAME, MODAL_TYPE, JUMP_URL } from '../../constant'
import './pageresultscene.less';
import { Toast, getModalHoc } from 'spark-design';
import openPrize from '../../components/comshowprizepanel/comshowprizepanel.jsx';
......@@ -11,6 +11,8 @@ import prizePanel from '../../components/comprizepanel/comprizepanel.jsx';
import { format } from 'prettier';
import ruleMoadl from '../../components/comrulepanel/comrulepanel.jsx';
import awardModal from "../../components/comawardpanel/comawardpanel.jsx";
import { getPxToken } from '../../libs/spark_gettoken';
import { mHistory } from '../../BaseRouter.jsx';
const RuleModal = getModalHoc(ruleMoadl);
const AwardModal = getModalHoc(awardModal);
const OpenPrize = getModalHoc(openPrize);
......@@ -21,21 +23,17 @@ class Pageresultscene extends Component {
this.state = {
resList: resList,
modalType: "",
resultList: [],
resultList: [{ wishName: "" }, { wishName: "" }, { wishName: "" }, { wishName: "" }, { wishName: "" }],
resultObj: {},
prizeData: {},
shareImg: "12"
shareImg: "12",
wishLimit: false,
rule: ""
};
}
componentDidMount() {
//播放开奖动画
// this.modalControl(MODAL_NAME.P_PRIZE_OPEN);//动画播放
this.modalControl(MODAL_NAME.P_PRIZE_RESULT);//出奖弹窗
this.getResultMsg();
console.log(">>>...........>>",this.props);
console.log(">>>...........>>", this.props);
}
modalControl(key) {
......@@ -45,27 +43,31 @@ class Pageresultscene extends Component {
console.log("========", key || "null", this.state.modalType);
}
getResultMsg() {
async getResultMsg() {
//获取接口的返回结果信息
//获取奖品接口
this.setState({
resultList: ["一字成语", "二字成语", "三字成语", "四字成语", "五字成语"],
resultObj: {
nickname: "昵称昵称昵称昵称昵称",
content: "内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容"
},
prizeData: {
name: "奖品奖品奖品奖品奖品奖品",
img: "121"
},
shareImg: ""
})
let { success, data, message, code } = await API.wishResultData();
if (success) {
console.log('许愿结果》》》', data.wishData.wishList);
let wishs = data.wishData.wishList;
//获取奖品接口
this.setState({
resultList: wishs,
resultObj: {
nickname: data.nickName,
content: data.wishData.blessing
},
wishLimit: data.wishCountFlg,
shareImg: "12"
})
} else {
Toast(message)
}
}
/**
* 跳转链接
* @param {*} url
*/
* 跳转链接
* @param {*} url
*/
jumpUrl(url) {
console.log('url---------', url);
this.state.isDo = true;
......@@ -88,18 +90,36 @@ class Pageresultscene extends Component {
}
againWish() {
alert("再次许愿============");
console.log('场景跳转---------');
let { wishLimit } = this.state;
if (wishLimit) {
Toast('今日许愿已达上限,请明日再来~');
} else {
console.log('场景跳转---------');
mHistory.push({ pathname: '/' })
}
}
async getRuleInfo() {
let { data, success, code } = await API.getRule();
if (success) {
this.setState({ rule: data });
this.modalControl(MODAL_NAME.P_RULE)
}
else {
Toast(message);
}
}
render() {
let { modalType, resultList, resultObj, prizeData, shareImg } = this.state;
let { modalType, resultList, resultObj, shareImg, rule } = this.state;
return (
<div className="resultscene ">
<img className="bg " src={this.state.resList['93ef9977-c6a5-4e96-ad2b-47b5b717dc19'].url} />
<img className="awardbtn2 " onClick={() => { this.modalControl(MODAL_NAME.P_PRIZE_CHECK) }} src={this.state.resList['df88f4c3-4e66-4936-84dc-654eb165ae93'].url} />
<img className="rulebtn2 " onClick={() => { this.modalControl(MODAL_NAME.P_RULE) }} src={this.state.resList['1b800919-334c-4223-a299-3946e453fc80'].url} />
<img className="awardbtn2 " onClick={() => { this.jumpUrl(JUMP_URL); }} src={this.state.resList['df88f4c3-4e66-4936-84dc-654eb165ae93'].url} />
<img className="rulebtn2 " onClick={() => { this.getRuleInfo() }} src={this.state.resList['1b800919-334c-4223-a299-3946e453fc80'].url} />
<img className="againbtn " onClick={() => { this.againWish() }} src={this.state.resList['442a4667-1ae0-43f7-b1f9-37a6cedf138f'].url} />
<img className="sharebtn " onClick={() => { Toast("快截图分享给好友吧!") }} src={this.state.resList['73f4c449-b3e1-4797-90ce-438b9ba415de'].url} />
<div className="wishresult ">
......@@ -108,34 +128,33 @@ class Pageresultscene extends Component {
<div className="wishtags ">
<div className="tag4 ">
<img className="tagb4 " src={this.state.resList['805e70ea-e0b5-44b2-989d-9da28a9920ae'].url} />
<span className="tagl4 ">{resultList[3]}</span>
<span className="tagl4 ">{resultList[3].wishName || "一帆风顺"}</span>
</div>
<div className="tag3 ">
<img className="tagb3 " src={this.state.resList['d9f830d6-cf5b-4998-9980-9a3cdec3fa54'].url} />
<span className="tagl3 ">{resultList[2]}</span>
<span className="tagl3 ">{resultList[2].wishName || "十全十美"}</span>
</div>
<div className="tag2 ">
<img className="tagb2 " src={this.state.resList['d9d55c57-c453-4e60-9244-5c55c3e67566'].url} />
<span className="tagl2 ">{resultList[1]}</span>
<span className="tagl2 ">{resultList[1].wishName || "心想事成"}</span>
</div>
<div className="tag1 ">
<img className="tagb1 " src={this.state.resList['25fbfc7d-467c-4850-b236-4249c4251299'].url} />
<span className="tagl1 ">{resultList[0]}</span>
<span className="tagl1 ">{resultList[0].wishName || "万事如意"}</span>
</div>
<div className="tag5 ">
<img className="tagb5 " src={this.state.resList['b38f3eab-7b10-444a-a46b-68a326918d10'].url} />
<span className="tagl5 ">{resultList[4]}</span>
<span className="tagl5 ">{resultList[4].wishName}</span>
</div>
</div>
<span className="nickname ">{resultObj.nickname || "全体员工"}</span>
<span className="wishcontent ">
{resultObj.content || "这个世界真的有人过着你想过的生活， 你要相信你也可以。 致敬2021，致敬你的梦想，祝心想事成！"}
</span>
</div>
{modalType == MODAL_TYPE[MODAL_NAME.P_PRIZE_OPEN] && <OpenPrize></OpenPrize>}
{modalType == MODAL_TYPE[MODAL_NAME.P_PRIZE_RESULT] && <PrizePanel onClose={() => { this.modalControl() }} data={prizeData}></PrizePanel>}
{modalType == MODAL_TYPE[MODAL_NAME.P_RULE] && <RuleModal onClose={() => { this.modalControl() }}></RuleModal>}
{/* {modalType == MODAL_TYPE[MODAL_NAME.P_PRIZE_RESULT] && <PrizePanel onClose={() => { this.modalControl() }} data={prizeData}></PrizePanel>} */}
{modalType == MODAL_TYPE[MODAL_NAME.P_RULE] && <RuleModal rule={rule} onClose={() => { this.modalControl() }}></RuleModal>}
{modalType == MODAL_TYPE[MODAL_NAME.P_PRIZE_CHECK] && <AwardModal jumpUrl={(url) => { this.jumpUrl(url) }} onClose={() => { this.modalControl() }}></AwardModal>}
</div>
);
......
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