Skip to content

M
mr-julyedu
Commit 767e285b by xuzhenghua
Options

分享

parent e3aa0c99
Showing with 912 additions and 127 deletions
build/service-worker.js
...@@ -14,7 +14,7 @@ ...@@ -14,7 +14,7 @@
importScripts("https://storage.googleapis.com/workbox-cdn/releases/3.6.3/workbox-sw.js"); importScripts("https://storage.googleapis.com/workbox-cdn/releases/3.6.3/workbox-sw.js");
importScripts( importScripts(
"/precache-manifest.c3bbff36d0586b3e9b18deeca76db489.js" "/precache-manifest.7434c0bc645273d8dd43e84c0163e429.js"
); );
workbox.clientsClaim(); workbox.clientsClaim();
......
src/components/activity/index.js 0 → 100644
import React, { Component } from 'react'
import {connect} from "react-redux";
import { http, getParam } from '@/utils';
import './index.scss';
import {Toast} from "antd-mobile";
import jsCookie from 'js-cookie';
class Activity extends Component {
constructor(props) {
super(props);
}
componentWillMount() {
jsCookie.set('blessing_invite_uid', getParam('shareuid'));
jsCookie.set('blessing_invite_code', getParam('code'));
}
getGift = () => {
if(this.props.user.hasError) {
this.props.history.push('/passport');
} else {
http.get(`${API.home}/sys/receive/reg/gift`).then(res => {
let {code, msg} = res.data;
if(code === 200) {
Toast.info('领取成功，你可前往七月在线官网/APP进行查看', 2);
}else{
Toast.info(msg, 2);
}
})
}
}
render() {
return (
<div className="activity__con">
<div className='banner__con'></div>
<div className='content__con'>
<div className="button__get" onClick={this.getGift}>立即领取</div>
</div>
</div>
)
}
}
export default connect(
state => ({user: state.user}),
null
)(Activity);
src/components/activity/index.scss 0 → 100644
.activity__con {
width: 100%;
height: 100vh;
background-color: #5327FA;
overflow: auto;
.banner__con {
width: 100%;
height: 170px;
background: url('./images/banner.png') center center no-repeat;
background-size: 100% 100%;
}
.content__con {
width: 100%;
height: 454px;
background: url('./images/dalibao_bj.png') center center no-repeat;
background-size: 100% 100%;
position: relative;
.button__get {
width:220px;
height:40px;
background:rgba(253,203,5,1);
border-radius:10px;
font-size:18px;
font-weight:400;
color:rgba(246,53,28,1);
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: 14px;
letter-spacing: 2px;
text-align: center;
line-height: 40px;
}
}
.invite__content {
color:rgba(255,255,255,1);
font-weight:400;
.content__one {
width: 100%;
padding: 0 50px;
font-size: 14px;
display: flex;
justify-content: center;
align-items: center;
height: 20px;
margin-bottom: 12px;
p {
display: flex;
align-items: center;
justify-content: center;
}
.img__con {
width: 88px;
height: 16px;
background: url('./images/value.png') center center no-repeat;
background-size: 100% 100%;
margin-left: 4px;
}
}
.content__two {
height:16px;
line-height: 16px;
font-size:16px;
text-align: center;
text-align-last: center;
margin-bottom: 14px;
}
.box__out {
width:345px;
height:106px;
background:linear-gradient(to bottom,rgba(255,169,67,1) 0%,rgba(250,94,39,1) 100%);
border-radius:10px;
margin: 0 auto;
display: flex;
justify-content: center;
align-items: center;
}
.box__middle {
width:333px;
height:94px;
background:rgba(255,255,255,1);
box-shadow:0px 1px 3px 0px rgba(133,75,2,0.1);
border-radius:8px;
display: flex;
justify-content: center;
align-items: center;
}
.box__inner {
width:327px;
height:88px;
background:rgba(255,223,4,1);
border:1px solid rgba(253,184,46,1);
box-shadow:0px 1px 3px 0px rgba(133,75,2,0.1);
border-radius:6px;
color: #F24000;
font-size: 16px;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
p {
font-size: 16px;
line-height: 16px;
margin-top: 12px;
color:rgba(242,64,0, .8);
font-weight: 400;
}
p.hot__value {
color: #FD3D24;
font-size: 20px;
font-weight:500;
line-height: 20px;
}
.hot__progress {
display: flex;
flex-direction: row;
max-height: 8px;
width: 280px;
align-items: center;
justify-content: center;
margin-top: 10px;
.progress__bar {
width:210px;
height:6px;
background:rgba(255,255,255,1);
border-radius:3px;
position: relative;
}
span {
display: flex;
justify-content: center;
align-items: center;
width: 48px;
height: 20px;
color: #5327FA;
font-size: 20px;
transform: scale(0.5);
}
.progress__point {
position: absolute;
height: 6px;
border-radius: 3px;
background:linear-gradient(90deg,rgba(83,39,250,1) 0%,rgba(168,39,250,1) 100%);
}
}
}
.but__con {
width:216px;
height:40px;
background:rgba(57,0,201,.5);
border-radius:8px;
margin: 20px auto 0;
display: flex;
justify-content: center;
align-items: center;
.button__content {
width:210px;
height:36px;
background:rgba(255,255,255,1);
border-radius:6px;
font-size:16px;
font-weight:400;
color:rgba(57,0,201,1);
display: flex;
justify-content: center;
align-items: center;
}
}
.list__title {
height:14px;
line-height: 14px;
font-size:14px;
font-weight:400;
color:rgba(255,255,255,1);
width: 240px;
background: url('./images/yaoqh_bj.png') center center no-repeat;
background-size: 100% 50%;
text-align: center;
text-align-last: center;
margin: 30px auto 10px;
}
.show__new {
font-size: 12px;
color: #A993FD;
text-align: center;
text-align-last: center;
}
.list__con {
width: 346px;
margin: 14px auto;
border: 1px solid rgba(255,255,255, .5);
// min-height: 190px;
border-radius:10px;
display: flex;
flex-wrap: wrap;
padding: 0 15px;
.user__item-info {
width: 156px;
height: 46px;
display: flex;
justify-content: flex-start;
align-items: center;
.item__con {
width: 100%;
height: 40px;
display: flex;
justify-content: flex-start;
align-items: center;
margin-left: 6px;
margin-right: 0;
border-bottom: 1px rgba(255, 255, 255, 0.6) dashed;
}
&:nth-child(2n+1) {
border-right: 1px solid rgba(169,147,253,1);
.item__con {
margin-right: 6px;
margin-left: 0;
}
}
.user_avatar {
width: 22px;
height: 22px;
border-radius: 50%;
margin-right: 10px;
}
.user_name {
width: 114px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
font-size: 12px;
font-weight: 400;
color: #fff;
}
}
.item__con-only {
width: 100%;
&:nth-child(2n+1) {
border-right: none;
}
.item__con {
width: 100%;
}
}
}
}
.share__mark {
position: fixed;
width: 100%;
height: 100%;
left: 0;
top: 0;
right: 0;
bottom: 0;
background-color: rgba(0, 0, 0, .4);
.share__tip {
width:290px;
height:62px;
background:rgba(255,255,255,1);
border-radius:10px;
display: flex;
justify-content: center;
align-items: center;
color: #525C65;
font-size: 16px;
position: absolute;
top: 78px;
left: 50%;
transform: translateX(-50%);
}
.share__row {
width: 60px;
height: 44px;
background: url('./images/throw_icon.png') center center no-repeat;
background-size: 100% 100%;
position: absolute;
right: 15px;
top: 10px;
}
}
}
\ No newline at end of file
src/components/activity/invite.js 0 → 100644
import React, { Component } from 'react';
import {connect} from "react-redux"
import './index.scss';
import { http, getParam, is_weixin, wxShare, getC } from '@/utils';
import {Toast} from "antd-mobile";
import jsCookie from 'js-cookie';
class Invite extends Component {
constructor(props) {
super(props);
this.state = {
isWeiXin: false,
showTip: false,
hotValue: 0,
userList: [],
}
}
componentWillMount() {
let uid = jsCookie.get('uid');
let shareuid = getParam('shareuid');
if(uid === shareuid) {
} else {
if(getParam('new')) {
this.props.history.push(`/activity?shareuid=${shareuid}&code=${inviteCode}`);
}
}
}
componentDidMount() {
if(!this.props.user.hasError) {
this.getUserList();
this.getHotValue();
}
}
componentWillReceiveProps(nextProps) {
if(!nextProps.user.hasError) {
this.getUserList();
this.getHotValue();
}
}
getUserList = () => {
http.get(`${API.home}/sys/user/invite/list`).then(res => {
let {code, data, msg} = res.data;
if(code === 200) {
this.setState({
userList: data
});
} else {
Toast.info(msg, 2);
}
});
}
getHotValue = () => {
http.get(`${API.home}/sys/user/hot/value`).then(res => {
let {code, data, msg} = res.data;
if(code === 200) {
this.setState({
hotValue: data.hot_value
});
} else {
Toast.info(msg, 2);
}
});
}
inviteFriends = () => {
// 未登录先去登录
if(this.props.user.hasError) {
this.props.history.push('/passport');
} else {
http.get(`${API.home}/sys/user/invite/link`).then(res => {
let {code, data, msg} = res;
if(code === 200) {
let inviteCode = data.blessing_invite_code;
if(is_weixin()) {
// TODO 这里需要运营确定文案
wxShare({
title: 'AI充电节，积福气享1折秒课，超10万元奖品来就送！！',
desc: '把这门超5万人报名的【Python基础入门 升级版】课程送给你，附200元红包，请笑纳！--七月在线',
link: encodeURI(location.origin + `/invite?shareuid=${jsCookie.get('uid')}&new=1&code=${inviteCode}`),
imgUrl: 'https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/active19_1111/m/index-share-img.png',
});
this.setState({
showTip: true,
isWeiXin: true,
});
}else{
history.replaceState(null,null,`invite?shareuid=${jsCookie.get('uid')}&new=1&code=${inviteCode}`)
this.setState({
showTip: true,
});
}
}else{
Toast.info(msg, 2);
}
});
}
}
closeMark = () => {
this.setState({
showTip: false,
});
}
render() {
let {userList, showTip, hotValue, isWeiXin} = this.state;
return (
<div className="activity__con">
<div className='banner__con'></div>
<div className="invite__content">
<div className="content__one">
<p>邀请好友注册，每增加1人可</p>
<div className="img__con"></div>
</div>
<div className="content__two">
福气值越高，热力值越高，中奖概率越大！
</div>
<div className="box__out">
<div className="box__middle">
<div className="box__inner">
<p>当前中奖热力值:</p>
<p className="hot__value">{hotValue}</p>
<div className="hot__progress">
<span>0</span>
<div className="progress__bar">
<div className="progress__point" style={{'width': hotValue + '%'}}></div>
</div>
<span>3600</span>
</div>
</div>
</div>
</div>
<div className="but__con">
<div className="button__content" onClick={this.inviteFriends}>
立即邀请
</div>
</div>
{
userList.length > 0 ? (
<>
<div className="list__title">
<span>邀请好友列表</span>
</div>
<p className="show__new">(仅显示新用户)</p>
</>
) : (null)
}
{
userList.length > 0 ? (
<div className="list__con">
{
userList.length === 1 && userList.map((item, index) => {
return (
<div className="user__item-info item__con-only" key={index}>
<div className="item__con">
<img className="user_avatar" src={item.avatar} />
<div className="user_name">{item.name}</div>
</div>
</div>
)
})
}
{
userList.length > 1 && userList.map((item, index) => {
return (
<div className="user__item-info" key={index}>
<div className="item__con">
<img className="user_avatar" src={item.avatar} />
<div className="user_name">{item.name}</div>
</div>
</div>
)
})
}
</div>
) : (
null
)
}
</div>
{
showTip && (
<div className="share__mark" onClick={this.closeMark}>
<div className="share__tip">
立即分享给好友增加中奖概率
</div>
{
isWeiXin ? (
<div className="share__row"></div>
) : (
null
)
}
</div>
)
}
</div>
)
}
}
export default connect(
state => ({user: state.user}),
null
)(Invite);
src/components/blessingPreheat/banner/index.js
...@@ -2,6 +2,100 @@ import React, { Component } from 'react'; ...@@ -2,6 +2,100 @@ import React, { Component } from 'react';
import './index.scss'; import './index.scss';
class Banner extends Component { class Banner extends Component {
navTop = 183
prevY = 0
state = {
navs: [
{
text: '积福气',
id: 'lucky-value'
},
{
text: '幸运大抽奖',
id: 'lucky-draw'
},
{
text: '预付定金',
id: 'deposit'
},
{
text: '精品特惠',
id: 'best-courses'
},
{
text: 'AI测试',
id: 'ai-test'
},
{
text: '大咖直播',
id: 'live'
},
],
index: 0,
}
// componentDidMount() {
// window.addEventListener('scroll', throttle(this.calcNavActive, 100))
// }
// componentWillUnmount() {
// window.removeEventListener('scroll', throttle(this.calcNavActive, 100))
// }
// calcNavActive = () => {
// const {navs, index} = this.state
// const y = window.scrollY
// let swipeDirection = y > this.prevY ? 'up' : 'down'
// let _index
// if (swipeDirection === 'up') {
// _index = (index + 1) >= navs.length ? index : index + 1
// } else {
// _index = (index - 1) <= 0 ? 0 : index - 1
// }
// let el = document.querySelector(`#${navs[_index].id}`)
// let nav = document.querySelector('#main-nav')
// if(el) {
// let top = el.offsetTop
// if (y <= this.navTop) {
// nav.classList.remove('fixed')
// } else {
// !nav.classList.contains('fixed') && nav.classList.add('fixed')
// }
// if (swipeDirection === 'up') {
// if (y + 30 + 30 >= top) {
// this.setState({
// index: _index
// })
// }
// } else {
// if (y + 30 + 20 <= top) {
// this.setState({
// index: _index
// })
// }
// }
// this.prevY = y
// }
// }
// toSection = (i, e) => {
// e.preventDefault()
// let top = document.querySelector(`#${this.state.navs[i].id}`).offsetTop
// this.setState({
// index: i
// })
// window.scrollTo({
// top: top - 60,
// left: 0
// })
// }
render() { render() {
const { toSection, navs, index } = this.props; const { toSection, navs, index } = this.props;
return ( return (
......
src/components/blessingPreheat/collectBlessing/index.js
...@@ -127,6 +127,8 @@ class CollectBlessing extends Component { ...@@ -127,6 +127,8 @@ class CollectBlessing extends Component {
handleToShowNotice, handleToShowNotice,
handleToShowList, handleToShowList,
handleToShowInvite, handleToShowInvite,
handleToShow,
toLogin,
toSection toSection
} = this.props; } = this.props;
const { rules, welfareRuleList, seconds } = this.state; const { rules, welfareRuleList, seconds } = this.state;
...@@ -140,7 +142,7 @@ class CollectBlessing extends Component { ...@@ -140,7 +142,7 @@ class CollectBlessing extends Component {
: ( : (
<ListHeader size="middle" styles={{margin: '20px 0 0 0'}} > <ListHeader size="middle" styles={{margin: '20px 0 0 0'}} >
<span className="text_nologin">我的福气值：</span> <span className="text_nologin">我的福气值：</span>
<Link to='/passport' className="login__btn">登录</Link> <span onClick={toLogin} className="login__btn">登录</span>
</ListHeader> </ListHeader>
) )
} }
...@@ -184,9 +186,9 @@ class CollectBlessing extends Component { ...@@ -184,9 +186,9 @@ class CollectBlessing extends Component {
} }
{ {
index === 0 && (!isLogin || !isSign) && index === 0 && (!isLogin || !isSign) &&
<Link to='/passport' className="collect-blessing__content"> <span onClick={toLogin} className="collect-blessing__content">
点击<br/>签到 点击<br/>签到
</Link> </span>
} }
{ {
index === 1 && index === 1 &&
......
src/components/blessingPreheat/courseList/index.js
...@@ -221,39 +221,45 @@ class CourseList extends Component { ...@@ -221,39 +221,45 @@ class CourseList extends Component {
} }
toReceiveCoupon(id, key = '') { toReceiveCoupon(id, key = '') {
http.post(`${API.home}/sys/activity/coupon/receive`, { const {isLogin, toLogin} = this.props;
course_id: id if(isLogin) {
}).then(res => { http.post(`${API.home}/sys/activity/coupon/receive`, {
const { code, msg } = res.data; course_id: id
if(code === 200) { }).then(res => {
Toast.info('领取成功～', 2, null, false); const { code, msg } = res.data;
let obj = {}; if(code === 200) {
obj[key] = { Toast.info('领取成功～', 2, null, false);
isMore: this.state[key]['isMore'], let obj = {};
course: this.state[key]['course'].map(item => { obj[key] = {
if(item.course_id === id) { isMore: this.state[key]['isMore'],
return Object.assign({}, item, { course: this.state[key]['course'].map(item => {
course_status: 2 if(item.course_id === id) {
}); return Object.assign({}, item, {
} course_status: 2
return item; });
}), }
courseList: this.state[key]['courseList'].map(item => { return item;
if(item.course_id === id) { }),
return Object.assign({}, item, { courseList: this.state[key]['courseList'].map(item => {
course_status: 2 if(item.course_id === id) {
}); return Object.assign({}, item, {
} course_status: 2
return item; });
}), }
return item;
}),
}
this.setState({
...obj
});
} else {
Toast.info(msg, 2, null, false);
} }
this.setState({ });
...obj }else{
}); toLogin();
} else { }
Toast.info(msg, 2, null, false);
}
});
} }
......
src/components/blessingPreheat/coursePopup/index.js
import React, { Component } from 'react'; import React, { Component } from 'react';
import { http } from "@/utils"; import { http, SendMessageToApp } from "@/utils";
import { Link } from 'react-router-dom'; import { Link } from 'react-router-dom';
import './index.scss'; import './index.scss';
import { getParam } from '../../../utils';
class CoursePopup extends Component { class CoursePopup extends Component {
constructor(props) { constructor(props) {
...@@ -37,6 +38,31 @@ class CoursePopup extends Component { ...@@ -37,6 +38,31 @@ class CoursePopup extends Component {
}); });
} }
toCourseDetail = (item) => {
console.log(this.props);
const {isLogin, history, toLogin} = this.props;
// to={`/detail?id=${item.course_id}&ac=11`}
if(isLogin) {
if(!getParam('version')) {
history.push(`/detail?id=${item.course_id}&ac=11`);
}else{
let type = 0;
if(item.blessing) {
type = 2;
}else{
type = 1;
}
let data = {
courseId: item.course_id,
type: type // 正常跳课程详情页type:0,积福气浏览课程详情页-没有浏览过type:1 已浏览过type:2
}
SendMessageToApp("toCourse", data);
}
}else{
toLogin();
}
}
render() { render() {
const { courseList } = this.state; const { courseList } = this.state;
const { handleToHide } = this.props; const { handleToHide } = this.props;
...@@ -47,17 +73,17 @@ class CoursePopup extends Component { ...@@ -47,17 +73,17 @@ class CoursePopup extends Component {
<div className="course-popup__list"> <div className="course-popup__list">
{ {
courseList.map(item => ( courseList.map(item => (
<Link <span
to={`/detail?id=${item.course_id}&ac=11`}
className="course-popup__item" className="course-popup__item"
key={item.course_id} key={item.course_id}
onClick={()=>{this.toCourseDetail(item)}}
> >
<span className="course-popup__name">{item.course_title}</span> <span className="course-popup__name">{item.course_title}</span>
{ {
item.blessing && item.blessing &&
<span>+2点</span> <span>+2点</span>
} }
</Link> </span>
)) ))
} }
</div> </div>
......
src/components/blessingPreheat/index.js
import React, { Component } from 'react'; import React, { Component } from 'react';
import QRCode from 'qrcode'; import QRCode from 'qrcode';
import { http } from '@/utils'; import { http, SendMessageToApp,wxShare,is_weixin} from '@/utils';
import { Link } from 'react-router-dom'; import { Link } from 'react-router-dom';
import { throttle, findIndex } from 'lodash'; import { throttle, findIndex } from 'lodash';
import RulePopup from './rulePopup/index' import RulePopup from './rulePopup/index'
...@@ -20,10 +20,11 @@ import {CopyToClipboard} from 'react-copy-to-clipboard' ...@@ -20,10 +20,11 @@ import {CopyToClipboard} from 'react-copy-to-clipboard'
import { Toast } from "antd-mobile" import { Toast } from "antd-mobile"
import Live from './live' import Live from './live'
import Banner from './banner' import Banner from './banner'
import { getParam } from '../../utils';
class BlessingPreheat extends Component { class BlessingPreheat extends Component {
constructor(props) { constructor(props) {
super(props) super(props)
this.navTop = 183; this.navTop = 183;
...@@ -75,6 +76,14 @@ class BlessingPreheat extends Component { ...@@ -75,6 +76,14 @@ class BlessingPreheat extends Component {
componentDidMount() { componentDidMount() {
this.fetchUserBlessing(); this.fetchUserBlessing();
window.addEventListener('scroll', throttle(this.calcNavActive, 100)); window.addEventListener('scroll', throttle(this.calcNavActive, 100));
if(is_weixin()) {
wxShare({
title: 'AI充电节，积福气享1折秒课，超10万元奖品来就送！！',
desc: '把这门超5万人报名的【Python基础入门 升级版】课程送给你，附200元红包，请笑纳！--七月在线',
link: window.location.href,
imgUrl: 'https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/active19_1111/m/index-share-img.png',
})
}
} }
initNav = (isFormal) => { initNav = (isFormal) => {
...@@ -92,6 +101,12 @@ class BlessingPreheat extends Component { ...@@ -92,6 +101,12 @@ class BlessingPreheat extends Component {
} }
fetchUserBlessing() { fetchUserBlessing() {
// 判断登录未登录 根据this.state.userInfo.isLogin
if(getParam('version')) {
// app 平台
}else{
// H5
}
const { userInfo } = this.state; const { userInfo } = this.state;
http.get(`${API.home}/sys/user/blessing`).then(res => { http.get(`${API.home}/sys/user/blessing`).then(res => {
const { code, data } = res.data; const { code, data } = res.data;
...@@ -135,10 +150,11 @@ class BlessingPreheat extends Component { ...@@ -135,10 +150,11 @@ class BlessingPreheat extends Component {
} }
handleToShow = (key, isLogin = false) => { handleToShow = (key, isLogin = false) => {
const { history } = this.props; const { userInfo } = this.state;
if(isLogin) { // 需要用户登录 并且用户未登录
history.push('/passport') if(isLogin && !userInfo.isLogin) {
}else { this.toLogin();
}else{
let obj = {}; let obj = {};
obj[key] = true; obj[key] = true;
this.setState({ this.setState({
...@@ -147,21 +163,37 @@ class BlessingPreheat extends Component { ...@@ -147,21 +163,37 @@ class BlessingPreheat extends Component {
} }
} }
// 邀请好友注册
handleToShowInvite = () => { handleToShowInvite = () => {
QRCode.toDataURL('http://m.julyedu.com/invite', { const { userInfo } = this.state;
width: 120, if(userInfo.isLogin) {
height: 120, if(!getParam('version')) {
margin: 1 QRCode.toDataURL('http://m.julyedu.com/invite', {
}) width: 120,
.then(url => { height: 120,
this.setState({ margin: 1
inviteUrl: url, })
inviteVisible: true .then(url => {
}); this.setState({
}) inviteUrl: url,
.catch(err => { inviteVisible: true
console.error(err) });
}); })
.catch(err => {
console.error(err)
});
}else{
let data = {
title: '11.11-11.13 AI充电节，预热来袭！重磅好课1折秒，超10万元奖品来就送-七月在线', // 标题
desc: '11.11-11.13 AI充电节，预热来袭！重磅好课1折秒，超10万元奖品来就送-七月在线', // 描述
imgUrl: 'https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/active19_717/m/717/shareimg.png', // 图片地址
link: 'https://m.julyedu.com/blessingPreheat' // url
}
SendMessageToApp("toShare", data)
}
} else {
this.toLogin();
}
} }
handleToShowNotice = () => { handleToShowNotice = () => {
...@@ -183,11 +215,20 @@ class BlessingPreheat extends Component { ...@@ -183,11 +215,20 @@ class BlessingPreheat extends Component {
console.error(err) console.error(err)
}); });
}else if(errno === 4030 || errno === 4040) { }else if(errno === 4030 || errno === 4040) {
location.href = `http://passport.julyedu.com/login?redirect=${encodeURI(document.URL)}`; this.toLogin();
} }
}); });
} }
toLogin = () => {
const { history } = this.props;
if(!getParam('version')) {
history.push('/passport');
}else{
SendMessageToApp("toLogin");
}
}
onCopy = () => { onCopy = () => {
Toast.info('复制成功', 2,null,false) Toast.info('复制成功', 2,null,false)
} }
...@@ -218,51 +259,54 @@ class BlessingPreheat extends Component { ...@@ -218,51 +259,54 @@ class BlessingPreheat extends Component {
} }
let el = document.querySelector(`#${navs[_index].id}`) let el = document.querySelector(`#${navs[_index].id}`)
let nav = document.querySelector('#main-nav') let nav = document.querySelector('#main-nav')
let top = el.offsetTop if(el) {
let top = el.offsetTop
if (y <= this.navTop) { if (y <= this.navTop) {
nav.classList.remove('fixed') nav.classList.remove('fixed')
} else { } else {
!nav.classList.contains('fixed') && nav.classList.add('fixed') !nav.classList.contains('fixed') && nav.classList.add('fixed')
}
if (swipeDirection === 'up') {
if (y + 30 + 30 >= top) {
this.setState({
index: _index
})
} }
} else {
if (y + 30 + 20 <= top) { if (swipeDirection === 'up') {
this.setState({ if (y + 30 + 30 >= top) {
index: _index this.setState({
}) index: _index
})
}
} else {
if (y + 30 + 20 <= top) {
this.setState({
index: _index
})
}
} }
this.prevY = y
} }
this.prevY = y
} }
render() { render() {
const { const {
navs, navs,
userInfo, userInfo,
isRule, isRule,
isCourse, isCourse,
inviteUrl, inviteUrl,
inviteVisible, inviteVisible,
isFormal, isFormal,
isServer, isServer,
serverUrl, serverUrl,
isSign, isSign,
showRecordList, showRecordList,
shareMark, shareMark,
index index
} = this.state; } = this.state;
const {history} = this.props;
return ( return (
<div id={'blessing-preheat'}> <div id={'blessing-preheat'}>
<Banner <Banner
isFormal={isFormal} isFormal={isFormal}
navs={navs} navs={navs}
toSection={this.toSection} toSection={this.toSection}
index={index} index={index}
/> />
...@@ -278,6 +322,7 @@ class BlessingPreheat extends Component { ...@@ -278,6 +322,7 @@ class BlessingPreheat extends Component {
handleToShowInvite={this.handleToShowInvite} handleToShowInvite={this.handleToShowInvite}
handleToShowNotice={this.handleToShowNotice} handleToShowNotice={this.handleToShowNotice}
handleToShow={this.handleToShow} handleToShow={this.handleToShow}
toLogin={this.toLogin}
handleToShowShare={() => this.handleToShow('shareMark')} handleToShowShare={() => this.handleToShow('shareMark')}
handleToHideShare={() => this.handleToHide('shareMark')} handleToHideShare={() => this.handleToHide('shareMark')}
/> />
...@@ -299,7 +344,7 @@ class BlessingPreheat extends Component { ...@@ -299,7 +344,7 @@ class BlessingPreheat extends Component {
{/* 精品课程特惠专区 */} {/* 精品课程特惠专区 */}
<ListHeader id={'best-courses'} text="精品课程特惠专区" styles={{margin: '30px 0 15px'}} /> <ListHeader id={'best-courses'} text="精品课程特惠专区" styles={{margin: '30px 0 15px'}} />
<CourseList isFormal={isFormal} /> <CourseList isFormal={isFormal} isLogin={userInfo.isLogin} toLogin={this.toLogin}/>
{ {
isRule && isRule &&
...@@ -307,7 +352,7 @@ class BlessingPreheat extends Component { ...@@ -307,7 +352,7 @@ class BlessingPreheat extends Component {
} }
{ {
isCourse && isCourse &&
<CoursePopup handleToHide={() => this.handleToHide('isCourse')}/> <CoursePopup toLogin={this.toLogin} history={history} isLogin={userInfo.isLogin} handleToHide={() => this.handleToHide('isCourse')}/>
} }
{ {
showRecordList && showRecordList &&
...@@ -336,7 +381,7 @@ class BlessingPreheat extends Component { ...@@ -336,7 +381,7 @@ class BlessingPreheat extends Component {
</Popup> </Popup>
<Popup visible={this.state.joinLotteryVisible} <Popup visible={this.state.joinLotteryVisible}
title={'你已成功参与本时段抽奖'} title={'你已成功参与本时段抽奖'}
...@@ -360,15 +405,15 @@ class BlessingPreheat extends Component { ...@@ -360,15 +405,15 @@ class BlessingPreheat extends Component {
<ListHeader id={'ai-test'} text="全国AI工程师水平测试" styles={{margin: '30px 0 15px'}} /> <ListHeader id={'ai-test'} text="全国AI工程师水平测试" styles={{margin: '30px 0 15px'}} />
<div className="test__record" onClick={() => this.handleToShow('showRecordList')}> <div className="test__record" onClick={() => this.handleToShow('showRecordList', true)}>
测试记录> 测试记录>
</div> </div>
<LevelTest></LevelTest> <LevelTest history={history} isLogin={userInfo.isLogin} toLogin={this.toLogin}></LevelTest>
<RankList></RankList> <RankList></RankList>
<Live></Live> <Live isFormal={isFormal}></Live>
</div> </div>
) )
} }
......
src/components/blessingPreheat/levelTest/index.js
import React, { Component } from 'react' import React, { Component } from 'react'
import './index.scss' import './index.scss'
import listFrame from './../listFrame/index'; import listFrame from './../listFrame/index';
import { http} from "@/utils" import { http, SendMessageToApp} from "@/utils"
class LevelTest extends Component { class LevelTest extends Component {
constructor(props) { constructor(props) {
...@@ -35,19 +35,28 @@ class LevelTest extends Component { ...@@ -35,19 +35,28 @@ class LevelTest extends Component {
} }
componentDidMount() { componentDidMount() {
http.get(`${API.home}/sys/ai_test/get_user_testinfo`).then(res => { const {isLogin} = this.props;
let {code, data: {user_test_total, user_residue_number}} = res.data; if(isLogin) {
if(code === 200) { http.get(`${API.home}/sys/ai_test/get_user_testinfo`).then(res => {
this.setState({ let {code, data: {user_test_total, user_residue_number}} = res.data;
testNumber: user_test_total, if(code === 200) {
number: user_residue_number this.setState({
}) testNumber: user_test_total,
} number: user_residue_number
}); })
}
});
}
} }
startTest = () => { startTest = () => {
console.log('startTest'); const {history, isLogin, toLogin} = this.props;
if(isLogin) {
history.push('/levelTest/testing');
}else{
toLogin();
}
} }
render() { render() {
...@@ -56,6 +65,7 @@ class LevelTest extends Component { ...@@ -56,6 +65,7 @@ class LevelTest extends Component {
number, number,
prizeListUrl, prizeListUrl,
} = this.state; } = this.state;
const {isLogin} = this.props;
return ( return (
<> <>
<div className="level__test_module"> <div className="level__test_module">
...@@ -63,7 +73,11 @@ class LevelTest extends Component { ...@@ -63,7 +73,11 @@ class LevelTest extends Component {
<img src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/active19_1111/m/test_icon.png" /> <img src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/active19_1111/m/test_icon.png" />
<div className="button__text"> <div className="button__text">
<p>点击测试</p> <p>点击测试</p>
<span>（剩余{number}次）</span> {
isLogin && (
<span>（剩余{number}次）</span>
)
}
</div> </div>
</div> </div>
<div className='test__number'> <div className='test__number'>
......
src/components/blessingPreheat/live/index.js
import React, { Component } from 'react' import React, { Component } from 'react'
import './index.scss' import './index.scss'
import { Tabs, Toast } from "antd-mobile" import { Tabs, Toast } from "antd-mobile"
import { http } from "@/utils" import { getParam, http, SendMessageToApp } from "@/utils"
import { Popup } from "@common/index" import { Popup } from "@common/index"
import QRCode from 'qrcode' import QRCode from 'qrcode'
import { uniqBy } from 'lodash' import { uniqBy } from 'lodash'
import { connect } from 'react-redux'
import { withRouter } from 'react-router-dom'
const isFormal = false
@connect(state => ({user: state.user}))
class Live extends Component { class Live extends Component {
state = { state = {
...@@ -16,7 +18,8 @@ class Live extends Component { ...@@ -16,7 +18,8 @@ class Live extends Component {
preheatLives: [], preheatLives: [],
visible: false, visible: false,
qrcode: '', qrcode: '',
today: '' today: '',
isApp: getParam('version')
} }
...@@ -36,7 +39,7 @@ class Live extends Component { ...@@ -36,7 +39,7 @@ class Live extends Component {
}, {}) }, {})
let tabs, today let tabs, today
if (isFormal) { if (this.props.isFormal) {
tabs = Object.keys(lives).map(item => ({title: item})) tabs = Object.keys(lives).map(item => ({title: item}))
today = uniqBy(data.data['data_active'], value => value.date).findIndex(item => item['is_today']) today = uniqBy(data.data['data_active'], value => value.date).findIndex(item => item['is_today'])
} else { } else {
...@@ -59,7 +62,19 @@ class Live extends Component { ...@@ -59,7 +62,19 @@ class Live extends Component {
}) })
} }
toLiveRoom = id => {
if (this.state.isApp) {
SendMessageToApp('toLiveRoom', id)
} else {
window.location.href = `${window.location.protocol}//www.julyedu.com/live/m_room/${id}`
}
}
makeSubscribe = id => { makeSubscribe = id => {
const {user, history} = this.props
if (user.hasError) {
history.push('/passport/login')
}
http.get(`${API.home}/sys/createLiveQrcode/${id}`) http.get(`${API.home}/sys/createLiveQrcode/${id}`)
.then(res => { .then(res => {
const {data} = res const {data} = res
...@@ -102,7 +117,7 @@ class Live extends Component { ...@@ -102,7 +117,7 @@ class Live extends Component {
initialPage={today} initialPage={today}
> >
{ {
isFormal this.props.isFormal
? tabs.map((item, index) => { ? tabs.map((item, index) => {
const todayLives = lives[item.title] const todayLives = lives[item.title]
return ( return (
...@@ -172,7 +187,7 @@ function LiveContent({item, makeSubscribe}) { ...@@ -172,7 +187,7 @@ function LiveContent({item, makeSubscribe}) {
</div> </div>
{ {
item['on_live'] item['on_live']
? <button className={'on-living'}>正在直播</button> ? <button className={'on-living'} onClick={this.toLiveRoom.bind(this, item['live_id'])}>正在直播</button>
: :
item['is_subscribe'] item['is_subscribe']
? <button className={'subscribed'}>已预约</button> ? <button className={'subscribed'}>已预约</button>
...@@ -183,4 +198,4 @@ function LiveContent({item, makeSubscribe}) { ...@@ -183,4 +198,4 @@ function LiveContent({item, makeSubscribe}) {
) )
} }
export default Live export default withRouter(Live)
src/components/expand/share.js
import React, {Component} from 'react' import React, {Component} from 'react'
import './share.scss' import './share.scss'
import {http, getParam, browser, wxShare} from '@/utils' import {http, getParam, browser, wxShare,is_weixin} from '@/utils'
import {Toast} from 'antd-mobile' import {Toast} from 'antd-mobile'
import {connect} from "react-redux"; import {connect} from "react-redux";
import {Link} from "react-router-dom"; import {Link} from "react-router-dom";
...@@ -21,13 +21,14 @@ class ExpandShare extends Component { ...@@ -21,13 +21,14 @@ class ExpandShare extends Component {
componentDidMount() { componentDidMount() {
this.getListorData() this.getListorData()
this.getCourseList() this.getCourseList()
if(is_weixin()) {
wxShare({ wxShare({
title: 'AI充电节，预热来袭！80元红包送你，手要快！', title: 'AI充电节，预热来袭！80元红包送给你，手要快！',
desc: '重磅好课1折秒，超10万元奖品来就送', desc: '积福气享1折秒课，超10万元奖品来就送--七月在线',
link: window.location.href, link: window.location.href,
imgUrl: 'https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/active19_717/m/717/shareimg.png', imgUrl: 'https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/active19_1111/m/dj-share-img.png',
}) })
}
} }
// 获取膨胀券相关 // 获取膨胀券相关
......
src/router/router-config.js
...@@ -33,6 +33,8 @@ const ShareCourse = loadable(() => import(/* webpackChunkName: 'ShareCourse'*/'@ ...@@ -33,6 +33,8 @@ const ShareCourse = loadable(() => import(/* webpackChunkName: 'ShareCourse'*/'@
const Country = loadable(() => import(/* webpackChunkName: 'Country' */'@/components/country/index')) const Country = loadable(() => import(/* webpackChunkName: 'Country' */'@/components/country/index'))
const ExpandCallback = loadable(() => import('@/components/expand/callback')) const ExpandCallback = loadable(() => import('@/components/expand/callback'))
const ExpandShare = loadable(() => import('@/components/expand/share')) const ExpandShare = loadable(() => import('@/components/expand/share'))
const Activity = loadable(() => import(/* webpackChunkName: 'Activity' */'@/components/activity/index'))
const Invite = loadable(() => import(/* webpackChunkName: 'Invite' */'@/components/activity/invite'))
export default [ export default [
{ {
path: '/', path: '/',
...@@ -211,5 +213,13 @@ export default [ ...@@ -211,5 +213,13 @@ export default [
{ {
path: '/toAppDemo', path: '/toAppDemo',
component: loadable(() => import(/* webpackChunkName: 'aist-share'*/'@/components/blessingPreheat/toAppDemo')) component: loadable(() => import(/* webpackChunkName: 'aist-share'*/'@/components/blessingPreheat/toAppDemo'))
},
{
path: '/activity',
component: Activity,
},
{
path: '/invite',
component: Invite,
} }
] ]
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