Skip to content

M
mr-julyedu
Commit 16d88d53 by wangshuo
Options

拉取新内容

parent c52d5a84
Showing with 228 additions and 136 deletions
README.md 100644 → 100755
File mode changed from 100644 to 100755
package-lock.json 100644 → 100755
File mode changed from 100644 to 100755
package.json 100644 → 100755
File mode changed from 100644 to 100755
src/components/activity/newyear-2019/common/prizes/index.js
......@@ -83,9 +83,10 @@ class Prizes extends Component {
const {
showSystemNotices
} = this.props
const {notices} = this.state
return (
<>
{showSystemNotices && <SystemBulletScreen bullets={this.state.notices}/>}
{(showSystemNotices && notices && notices.length) ? <SystemBulletScreen bullets={notices}/> : null}
<div className={'prizes-box'} ref={el => this.prizeBox = el}>
<a href="javascript:;" className='rule-btn' onClick={this.showRules}>活动规则 > </a>
<div className={`bg`} ref={el => this.bg = el}/>
......@@ -95,7 +96,14 @@ class Prizes extends Component {
this.state.prizes.map((item, index) => {
return (
<li key={index}>
<img src={item.img_name} alt=""/>
{
item.img_name
? <i className="prize-list__image" style={{
backgroundImage: `url(${item.img_name})`
}}/>
: <i className="prize-list__image"/>
}
{/* <img src={item.img_name} alt=""/> */}
{
item.is_captain != 0 && <span className='captain top-tag'>队长专属</span>
}
......
src/components/activity/newyear-2019/common/prizes/prizes.scss
......@@ -45,7 +45,7 @@
display: block;
width: 100%;
background: url($bg) no-repeat;
background-size: contain;
background-size: 100% auto;
}
&::before {
......@@ -56,12 +56,14 @@
&::after {
@include common-deco('https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/landing-box-footer.png');
height: 85px;
margin-top: -1px;
}
.bg {
@extend .trans-height;
width: 100%;
height: 115px;
margin-top: -1px;
overflow: hidden;
z-index: 10;
background: url("https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/landing-box-bg.png") repeat-y;
......@@ -100,6 +102,14 @@
margin-right: 10.5px;
margin-bottom: 6.5px;
.prize-list__image {
display: block;
width: 100%;
height: 100%;
background-position: center;
background-size: cover;
}
img {
width: 90px;
object-fit: contain;
......@@ -133,7 +143,7 @@
background: rgba(0, 0, 0, .8);
font-size: 12px;
color: #fff;
padding: 4px;
padding: 0 4px;
border-radius: 6px 0 0 0;
}
......@@ -156,7 +166,7 @@
flex: 0 1 45px;
height: 2px;
background: #fff;
border-radius: 1px;
.progress {
position: absolute;
right: 0;
......
src/components/activity/newyear-2019/common/system-bullet-screen/index.js
......@@ -62,7 +62,7 @@ class SystemBulletScreen extends Component {
} else {
setTimeout(() => {
++this.count;
swiper.slideNext()
(swiper && !swiper.destroyed) && swiper.slideNext()
}, 3000)
}
}
......@@ -93,27 +93,24 @@ class SystemBulletScreen extends Component {
render() {
const {
bullets = [
'第一条消息，第一条消息，第一条消息，第一条消息，第一条消息，第一条消息，',
'第二条消息，第二条消息，第二条消息，第二条消息，第二条消息，第二条消息，',
'第三条消息，第三条消息，第三条消息，第三条消息，第三条消息，第三条消息，',
]
bullets
} = this.props
return (
this.state.showNotices &&
<div id="system-bullet-screen" onTransitionEnd={this.removeSystemNotices} ref={el => this.sysNotice = el}>
<img className='avatar'
src='https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/system-avatar.png' alt=""/>
src='https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/system-notice-icon.png' alt=""/>
<div className='sys-bullet-screen-swiper-container'>
<ul className="swiper-wrapper">
{
bullets && bullets.length && bullets.map((item, index) => {
return (
<li className="swiper-slide" key={index}>
<span>{item}</span>
</li>
)
})
(bullets && bullets.length) ? bullets.map((item, index) => {
return (
<li className="swiper-slide" key={index}>
<span>{item}</span>
</li>
)
})
: null
}
</ul>
</div>
......
src/components/activity/newyear-2019/landing/index.js
......@@ -10,6 +10,7 @@ import { browser, getParam, http, wxShare, SendMessageToApp } from "@/utils"
import { Link } from "react-router-dom"
import QRCode from "qrcode"
import YearCourse from '../preheat/YearCourse'
import jsCookie from "js-cookie"
class Landing extends Component {
......@@ -116,6 +117,15 @@ class Landing extends Component {
})
}
handleToMyTreasure = () => {
this.joinSuccessPopup && this.joinSuccessPopup.remove()
if (getParam('version')) {
history.push(`/year/yearTreasure?id=${id}&version=${getParam('version')}`)
} else {
history.push(`/year/yearTreasure?id=${id}`)
}
}
joinSuccess = ({id, status, my_team: {team_num, lack_member, is_team, treasure_code}}) => {
const {history} = this.props
this.joinSuccessPopup = Popup({
......@@ -139,10 +149,7 @@ class Landing extends Component {
? <img style={{width: '150px', marginTop: '23px'}}
src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/PC/treasure-box.png"
alt=""
onClick={() => {
this.joinSuccessPopup && this.joinSuccessPopup.remove()
history.push(`/year/yearTreasure?id=${id}`)
}}
onClick={this.handleToMyTreasure}
/>
: is_team
? <button type='button'
......@@ -163,13 +170,21 @@ class Landing extends Component {
inviteMembers = treasure_code => {
const {history, match, user, location} = this.props
if (getParam('version')) {
let data = {
title: `@${user.data.username} 邀您一起组队拿豪礼！`,
desc: `加入我的队伍，机械键盘，纸质书籍等超多奖品等你拿！`,
link: `${window.location.origin}/${location.pathname}?treasure_code=${treasure_code}&origin=2`,
imgUrl: 'https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/wx-share-icon.png'
}
SendMessageToApp("toShare", data)
}
if (browser.isWeixin) {
wxShare({
title: `@${user.data.username} 邀您一起组队拿豪礼！`,
desc: `加入我的队伍，机械键盘，纸质书籍等超多奖品等你拿！`,
link: `${window.location.origin}/${location.pathname}?treasure_code=${treasure_code}&origin=2`,
//todo 分享图片更换
imgUrl: 'https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newIndex/community/tou5_bj.png'
imgUrl: 'https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/wx-share-icon.png'
})
}
sessionStorage.setItem('showShareTip', '1')
......@@ -261,17 +276,13 @@ class Landing extends Component {
showShareTip = () => {
const {user} = this.props
if (browser.isAndroidApp) {
} else if (browser.isIOSApp) {
if (browser.isAndroidApp || browser.isIOSApp) {
SendMessageToApp('toShare', {
title: `@${user.data.username} 邀您一起组队拿豪礼！`,
desc: `加入我的队伍，机械键盘，纸质书籍等超多奖品等你拿！`,
link: `${window.location.origin}/${location.pathname}?treasure_code=${getParam('treasure_code')}&origin=2`,
//todo 分享图片更换
imgUrl: 'https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newIndex/community/tou5_bj.png'
imgUrl: 'https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/wx-share-icon.png'
})
} else {
......
src/components/activity/newyear-2019/myTreasure/index.js
......@@ -8,10 +8,9 @@ import CreateSuccess from './../common/createSuccess/index';
import TreasureTeam from './team';
import PrizeStatus from './prize';
import SplitSuccess from './../common/splitSuccess/index';
import { http, getParam } from '@/utils';
import { http, getParam, SendMessageToApp } from '@/utils';
import Mask from './mask';
import './index.scss';
import { split } from 'react-ace';
@connect(({country, user}) => ({
country,
......@@ -37,18 +36,23 @@ class MyTreasure extends Component {
isCreate: false,
createInfo: {},
prizeName: '', // 当前商品的名字
treasureTime: '', // 宝箱活动结束时间
};
}
componentDidMount() {
const { isEnd } = this.state;
if (isEnd) {
this.startCountDown();
}
this.fetchMyTreasure();
this.fetchActivityStatus();
}
componentWillReceiveProps(nextProp) {
const { history } = this.props;
const { userInfo } = nextProp;
if(!userInfo.uid) {
history.push('/passport');
}
}
// 页面加载时，初始化当前需要绑定手机号的奖品名字
initPrizeName = (params) => {
const key = this.fetchCurrentTeamId(params);
......@@ -146,7 +150,6 @@ class MyTreasure extends Component {
http.post(`${API.home}/sys/split_treasure`, params).then(res => {
const { code, data } = res.data;
if(code === 200) {
// 拆宝箱弹窗--成功
this.showSuccessSplit(data);
......@@ -288,10 +291,13 @@ class MyTreasure extends Component {
http.get(`${API.home}/activity/stage`).then(res => {
const { code, data } = res.data;
if (code === 200) {
// treasure_stage，宝箱阶段，0-不在活动时间，1-活动时间内
if(data.treasure_stage === 0) {
this.startCountDown();
}
this.setState({
isEnd: data.treasure_stage === 0
isEnd: data.treasure_stage === 0,
treasureTime: data.treasure_stop_date
});
}
});
......@@ -324,7 +330,11 @@ class MyTreasure extends Component {
// 邀请好友
handleToInvite = (treasure_code) => {
const { history } = this.props;
history.push(`/activity/newyear-2019/landing?treasure_code=${treasure_code}&origin=1`);
if(getParam('version')){
history.push(`/activity/newyear-2019/landing?treasure_code=${treasure_code}&origin=1&version=${getParam('version')}`);
}else {
history.push(`/activity/newyear-2019/landing?treasure_code=${treasure_code}&origin=1`);
}
}
// 组队开宝箱
......@@ -352,25 +362,41 @@ class MyTreasure extends Component {
// 奖品，代金券碎片--合成
toComposeCoupon = () => {
const { history } = this.props;
history.push('/coupons/my-patch');
if(getParam('version')) {
SendMessageToApp("toCoupon")
}else {
history.push('/coupons/my-patch');
}
}
// 奖品，指定课程代金券--使用
toUseCoupon = (id) => {
const { history } = this.props;
history.push(`/detail?id=${id}`);
if(getParam('version')) {
SendMessageToApp("toCourse", id)
}else {
history.push(`/detail?id=${id}`);
}
}
// 第三：奖品，通用课程代金券--使用
toCourseList = () => {
const { history } = this.props;
history.push('/classify');
if(getParam('version')) {
SendMessageToApp('toQualityCourse')
}else {
history.push('/classify');
}
}
// 第三：奖品，现金红包--提现
toFecthMoney = () => {
const { history } = this.props;
history.push('/scholarship');
if(getParam('version')) {
SendMessageToApp('toAccount')
}else {
history.push('/scholarship');
}
}
// 弹窗--隐藏
......@@ -401,6 +427,7 @@ class MyTreasure extends Component {
createInfo,
prizeName,
rule,
treasureTime,
} = this.state;
return (
<div data-skip="treasure">
......@@ -486,8 +513,8 @@ class MyTreasure extends Component {
successBindPhone={this.successBindPhone}
desc={
<>
<p className="phone-treasure__desc">恭喜您获得 奖品名称（{prizeName}）</p>
<p className="phone-treasure__notice">为了您的账户安全，请于2019年12月31日前绑定手机号，过期将失效</p>
<p className="phone-treasure__desc">恭喜您获得 {prizeName}</p>
<p className="phone-treasure__notice">为了您的账户安全，请于{treasureTime}前绑定手机号，过期将失效</p>
</>
}
/>
......@@ -529,12 +556,17 @@ class MyTreasure extends Component {
</Mask>
</div>
}
<div className="activity-rule__header">
<i className="activity-rule__decorate"></i>
<h2 className="activity-rule__title">活动规则</h2>
<i className="activity-rule__decorate"></i>
</div>
<div className="activity-rule__body" dangerouslySetInnerHTML={{__html: rule}}></div>
{
rule &&
<>
<div className="activity-rule__header">
<i className="activity-rule__decorate"></i>
<h2 className="activity-rule__title">活动规则</h2>
<i className="activity-rule__decorate"></i>
</div>
<div className="activity-rule__body" dangerouslySetInnerHTML={{__html: rule}}></div>
</>
}
</div>
)
}
......
src/components/activity/newyear-2019/myTreasure/index.scss
[data-skip="treasure"] {
min-height: 100vh;
background-color: #0E7442;
min-height: 100vh;
background-color: #0E7442;
&+ .year19-index {
display: none;
}
.treasure-content {
padding: 16px 0 10px;
......
src/components/activity/newyear-2019/myTreasure/prize.js
......@@ -86,7 +86,8 @@ export default (props) => {
{/* 第三：奖品，任意线上课程兑换券 */}
{
(!bind_phone && !bind_address && prize_type === 5) &&
<a className="team-result">文案待定</a>
<a className="team-result">关注公众号“七月在线实验室” 回复“领课”
</a>
}
</>
)
......
src/components/activity/newyear-2019/myTreasure/team.scss
......@@ -155,7 +155,7 @@
height: 46px;
margin: 0 20px;
background-size: cover;
background-image: url('https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/PC/treasure-box.png');
background-image: url('https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/treasure-split.gif');
}
.team-icon {
......
src/components/activity/newyear-2019/preheat/YearCourse/index.js
......@@ -87,6 +87,8 @@ class YearCourse extends Component {
shouldComponentUpdate(nextProps, nextState, nextContext) {
if (this.props.isAppUpdate !== nextProps.isAppUpdate) {
this.getTeamInfo()
this.getLength()
this.fetchBigCourse()
this.fetchFreeCourse()
this.fetchGroupCourse()
......@@ -295,18 +297,15 @@ class YearCourse extends Component {
http.get(`${API['base-api']}/wx/user_temporary_qrcode/${_this.props.user.data.uid}`)
.then(res => {
const {errno, data, msg} = res.data
QRCode.toDataURL('http://weixin.qq.com/q/02mntn9j4xcw01_VSN1tc2', (err, url) => {
this.setState({
followBarcode: url,
if (errno == 0) {
QRCode.toDataURL(data.url, (err, url) => {
this.setState({
followBarcode: url,
})
})
})
// _this.followBarcode = "https://mp.weixin.qq.com/cgi-bin/showqrcode?ticket=gQEV8DwAAAAAAAAAAS5odHRwOi8vd2VpeGluLnFxLmNvbS9xLzAybW50bjlqNHhjdzAxX1ZTTjF0YzIAAgR5pfBdAwSAUQEA"
// if (errno == 0) {
// _this.followBarcode = data.url
// } else {
// Message.warning(msg)
// }
} else {
Toast.info(msg, 2)
}
})
}
......@@ -414,7 +413,11 @@ class YearCourse extends Component {
search = `?id=${currentId}`
}
if (isLogin) {
this.props.history.push(`/year/yearTreasure${search}`)
if (!getParam('version')) {
this.props.history.push(`/year/yearTreasure${search}`)
} else {
this.props.history.push(`/year/yearTreasure${search}?version=${getParam('version')}`)
}
} else {
this.toLogin()
}
......@@ -423,7 +426,12 @@ class YearCourse extends Component {
toYearWish = () => {
const isLogin = !this.props.user.hasError
if (isLogin) {
this.props.history.push('/year/yearWish')
if (!getParam('version')) {
this.props.history.push('/year/yearWish')
} else {
this.props.history.push(`/year/yearWish?version=${getParam('version')}`)
}
} else {
this.toLogin()
}
......@@ -482,7 +490,7 @@ class YearCourse extends Component {
{
(bigcourse.courseList && bigcourse.courseList.length > 4) &&
<button className="more-button" onClick={() => this.handleToMore('bigcourse')}>
{group.isMore ? '查看更多' : '收起'}
{bigcourse.isMore ? '查看更多' : '收起'}
</button>
}
</>
......@@ -520,7 +528,7 @@ class YearCourse extends Component {
{
(freecourse.courseList && freecourse.courseList.length > 4) &&
<button className="more-button" onClick={() => this.handleToMore('freecourse')}>
{group.isMore ? '查看更多' : '收起'}
{freecourse.isMore ? '查看更多' : '收起'}
</button>
}
</>
......@@ -591,7 +599,7 @@ class YearCourse extends Component {
{
(groupcourse.courseList && groupcourse.courseList.length > 4) &&
<button className="more-button" onClick={() => this.handleToMore('groupcourse')}>
{group.isMore ? '查看更多' : '收起'}
{groupcourse.isMore ? '查看更多' : '收起'}
</button>
}
</>
......
src/components/activity/newyear-2019/preheat/YearCourse/index.scss
......@@ -273,8 +273,8 @@
background-repeat: no-repeat;
background-size: cover;
position: fixed;
top: 50%;
right: 0;
bottom: 20%;
margin-top: -57px;
z-index: 22;
.nav-right__link {
......
src/components/activity/newyear-2019/treasure-box/rank.js
......@@ -21,18 +21,20 @@ class TreasureRank extends Component {
http.get(`${API.home}/sys/treasure/ranking`).then(res => {
const { code, data } = res.data;
if(code === 200) {
if(data.length > 5) {
this.setState({
rank: data.filter((item, index) => index < 5),
rankList: data,
isMore: true,
});
}else {
this.setState({
rank: data,
rankList: data,
isMore: false,
});
if(JSON.stringify(data) !== '{}') {
if(data.length > 5) {
this.setState({
rank: data.filter((item, index) => index < 5),
rankList: data,
isMore: true,
});
}else {
this.setState({
rank: data,
rankList: data,
isMore: false,
});
}
}
}
});
......@@ -56,52 +58,57 @@ class TreasureRank extends Component {
render() {
const { rank, isMore } = this.state;
return (
<div data-skip="rank">
<div className="rank-title">
<i className="rank-title__decorate"></i>
<h2 className="rank-title__txt">宝箱达人榜</h2>
<i className="rank-title__decorate"></i>
</div>
<p className="rank-desc">宝箱数量前50名可额外获得一份奖品，数量相同的用时短者排名在前</p>
<dl className="rank-header">
<dd className="rank-column">排名</dd>
<dd className="rank-column">用户</dd>
<dd className="rank-column">宝箱数量</dd>
<dd className="rank-column">奖品</dd>
</dl>
<div className="rank-body">
{
rank.map((item, index) => (
<dl className="rank-item" key={index}>
<dd className="rank-column">
{
index <= 2
? <span className="rank-column__number" data-num={index}></span>
: <span>{index+1}</span>
}
</dd>
<dd className="rank-column">
<span className="rank-column__name">{item.user_name}</span>
</dd>
<dd className="rank-column">
<span>{item.num}</span>
</dd>
<dd className="rank-column">
{
item.url
? <a className="rank-column__txt" href={item.url}>{item.prize_name}</a>
: <span className="rank-column__txt">{item.prize_name}</span>
}
</dd>
</dl>
))
}
<div className="rank-more" onClick={this.switchMoreRank}>
<span className="rank-more__txt">{isMore? '展开' : '收起'}</span>
<i className="rank-more__icon" data-more={isMore}></i>
<>
{
rank.length !== 0 &&
<div data-skip="rank">
<div className="rank-title">
<i className="rank-title__decorate"></i>
<h2 className="rank-title__txt">宝箱达人榜</h2>
<i className="rank-title__decorate"></i>
</div>
<p className="rank-desc">宝箱数量前50名可额外获得一份奖品，数量相同的用时短者排名在前</p>
<dl className="rank-header">
<dd className="rank-column">排名</dd>
<dd className="rank-column">用户</dd>
<dd className="rank-column">宝箱数量</dd>
<dd className="rank-column">奖品</dd>
</dl>
<div className="rank-body">
{
rank.map((item, index) => (
<dl className="rank-item" key={index}>
<dd className="rank-column">
{
index <= 2
? <span className="rank-column__number" data-num={index}></span>
: <span>{index+1}</span>
}
</dd>
<dd className="rank-column">
<span className="rank-column__name">{item.user_name}</span>
</dd>
<dd className="rank-column">
<span>{item.num}</span>
</dd>
<dd className="rank-column">
{
item.url
? <a className="rank-column__txt" href={item.url}>{item.prize_name}</a>
: <span className="rank-column__txt">{item.prize_name}</span>
}
</dd>
</dl>
))
}
<div className="rank-more" onClick={this.switchMoreRank}>
<span className="rank-more__txt">{isMore? '展开' : '收起'}</span>
<i className="rank-more__icon" data-more={isMore}></i>
</div>
</div>
</div>
</div>
</div>
}
</>
)
}
}
......
src/components/activity/newyear-2019/treasure-box/team.js
......@@ -64,9 +64,13 @@ class TeamInfo extends Component {
search = `?id=${current.id}`;
}
}
this.props.history.push(`/year/yearTreasure${search}`);
if (!getParam('version')) {
this.props.history.push(`/year/yearTreasure${search}`);
} else {
this.props.history.push(`/year/yearTreasure${search}?version=${getParam('version')}`);
}
}
}
// 去登录
......@@ -86,14 +90,24 @@ class TeamInfo extends Component {
const {is_my_team, my_team: {treasure_code}} = this.state;
if(is_my_team) { // 有自己的队伍
// 直接跳转
this.props.history.push('/activity/newyear-2019/landing?origin=1&treasure_code=' + treasure_code);
if (!getParam('version')) {
this.props.history.push('/activity/newyear-2019/landing?origin=1&treasure_code=' + treasure_code);
} else {
this.props.history.push('/activity/newyear-2019/landing?origin=1&treasure_code=' + treasure_code + '&version='+ getParam('version'));
}
}else{ // 没自己的队伍
// 请求创建队伍的接口
http.get(`${API.home}/sys/treasure/createMyTeam`).then(res => {
const { code, data, msg } = res.data;
if (code === 200) {
const { treasure_code } = data;
this.props.history.push('/activity/newyear-2019/landing?origin=1&treasure_code=' + treasure_code);
if (!getParam('version')) {
this.props.history.push('/activity/newyear-2019/landing?origin=1&treasure_code=' + treasure_code);
} else {
this.props.history.push('/activity/newyear-2019/landing?origin=1&treasure_code=' + treasure_code + '&version='+ getParam('version'));
}
} else {
Toast.info(msg);
}
......
src/components/activity/newyear-2019/year-wish/index.js
......@@ -120,7 +120,7 @@ class YarnWish extends Component {
{item.type == 2 ? '到手最低:¥' : '¥'}
<span
className="new-price">{item.type == 4 ? '0.01' : item.price2}</span>
<span className="old-price"> 现价：<s>¥{item.price1}</s></span>
<span className="old-price">{item.type == 2 ? '' : '现价：'}<s>¥{item.price1}</s></span>
</div>
<div className="status">
......
yarn.lock 100644 → 100755
File mode changed from 100644 to 100755
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