Commit c7daced4 by zhanghaozhe

双旦落地页加loading

parent e65902dd
...@@ -3,6 +3,7 @@ import Routes from './router' ...@@ -3,6 +3,7 @@ import Routes from './router'
import cookie from 'js-cookie' import cookie from 'js-cookie'
import { connect } from "react-redux" import { connect } from "react-redux"
import { setCurrentUser, startFetchUser } from "@/store/userAction" import { setCurrentUser, startFetchUser } from "@/store/userAction"
import {initialState} from "@/store/userReducer"
import { withRouter, Link } from 'react-router-dom' import { withRouter, Link } from 'react-router-dom'
import { compose } from 'redux' import { compose } from 'redux'
import { getParam, http, browser } from "@/utils" import { getParam, http, browser } from "@/utils"
...@@ -153,13 +154,10 @@ class App extends Component { ...@@ -153,13 +154,10 @@ class App extends Component {
getUser = () => { getUser = () => {
//获取用户信息 //获取用户信息
this.props.startFetchUser() this.props.startFetchUser()
http.get(`${API.home}/m/user_info`).then(res => {
this.props.setCurrentUser(this.transformUser(res))
})
//微信 //微信
let code = getParam('code') let code = getParam('code')
let oid = getParam('oid') let oid = getParam('oid')
if (code && !oid) { if (code && !oid) {
//针对2019双旦活动特殊处理,活动结束后删掉 //针对2019双旦活动特殊处理,活动结束后删掉
...@@ -185,11 +183,17 @@ class App extends Component { ...@@ -185,11 +183,17 @@ class App extends Component {
} }
} else { } else {
Toast.info(data.msg) Toast.info(data.msg)
this.props.setCurrentUser(initialState)
} }
}) })
} else {
http.get(`${API.home}/m/user_info`).then(res => {
this.props.setCurrentUser(this.transformUser(res))
})
} }
} }
componentDidUpdate() { componentDidUpdate() {
......
...@@ -9,6 +9,7 @@ import './landing.scss' ...@@ -9,6 +9,7 @@ import './landing.scss'
import { browser, getParam, http, wxShare, SendMessageToApp } from "@/utils" import { browser, getParam, http, wxShare, SendMessageToApp } from "@/utils"
import QRCode from "qrcode" import QRCode from "qrcode"
import YearCourse from '../preheat/YearCourse' import YearCourse from '../preheat/YearCourse'
import { FadeLoader } from "react-spinners"
class Landing extends Component { class Landing extends Component {
...@@ -32,7 +33,8 @@ class Landing extends Component { ...@@ -32,7 +33,8 @@ class Landing extends Component {
activityEnd: false, activityEnd: false,
notices: [], notices: [],
rule: '', rule: '',
isCaptain: getParam('origin') == 1 isCaptain: getParam('origin') == 1,
isLoading: this.props.user.isFetching
} }
componentDidMount() { componentDidMount() {
...@@ -41,7 +43,7 @@ class Landing extends Component { ...@@ -41,7 +43,7 @@ class Landing extends Component {
document.title = '七月在线年终大回馈,幸运宝箱随你开,100%有奖!' document.title = '七月在线年终大回馈,幸运宝箱随你开,100%有奖!'
const landing = document.querySelector('#landing') const landing = document.querySelector('#landing')
const boxContainer = document.querySelector('.box-container') const boxContainer = document.querySelector('.box-container')
if(boxContainer.offsetHeight < window.innerHeight){ if (boxContainer.offsetHeight < window.innerHeight) {
landing.style.minHeight = `${window.innerHeight}px` landing.style.minHeight = `${window.innerHeight}px`
boxContainer.style.minHeight = `${window.innerHeight}px` boxContainer.style.minHeight = `${window.innerHeight}px`
} }
...@@ -51,30 +53,35 @@ class Landing extends Component { ...@@ -51,30 +53,35 @@ class Landing extends Component {
if (prevProps.user.hasError !== this.props.user.hasError && !this.props.user.hasError) { if (prevProps.user.hasError !== this.props.user.hasError && !this.props.user.hasError) {
this.fetchPageData() this.fetchPageData()
} }
if(prevProps.user.isFetching !== this.props.user.isFetching && !this.props.user.isFetching){
this.setState({
isLoading: this.props.user.isFetching
})
}
} }
componentWillUnmount() { componentWillUnmount() {
this.shareTipPopup && this.shareTipPopup.remove() this.shareTipPopup && this.shareTipPopup.remove()
} }
createMeta = (title,dec,imgname) => { createMeta = (title, dec, imgname) => {
let meta = document.createElement('meta'); let meta = document.createElement('meta')
meta.setAttribute('name', 'description') meta.setAttribute('name', 'description')
meta.setAttribute('itemprop', 'description') meta.setAttribute('itemprop', 'description')
meta.setAttribute('content', dec) meta.setAttribute('content', dec)
let meta2 = document.createElement('meta'); let meta2 = document.createElement('meta')
meta2.setAttribute('itemprop', 'name') meta2.setAttribute('itemprop', 'name')
meta2.setAttribute('content', title) meta2.setAttribute('content', title)
let meta3 = document.createElement('meta'); let meta3 = document.createElement('meta')
meta3.setAttribute('itemprop', 'image') meta3.setAttribute('itemprop', 'image')
meta3.setAttribute('content', imgname) meta3.setAttribute('content', imgname)
let head = document.getElementsByTagName('head')[0]; let head = document.getElementsByTagName('head')[0]
head.appendChild(meta); head.appendChild(meta)
head.appendChild(meta2); head.appendChild(meta2)
head.appendChild(meta3); head.appendChild(meta3)
} }
fetchPageData = ({origin = this.state.origin, treasure_code = this.state.treasure_code} = {}) => { fetchPageData = ({origin = this.state.origin, treasure_code = this.state.treasure_code} = {}) => {
...@@ -104,8 +111,8 @@ class Landing extends Component { ...@@ -104,8 +111,8 @@ class Landing extends Component {
}) })
// history.replace(`${match.url}?treasure_code=${getParam('treasure_code')}&origin=2`) // history.replace(`${match.url}?treasure_code=${getParam('treasure_code')}&origin=2`)
} else { } else {
this.createMeta(this.shareTitle,this.shareDesc,'https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/wx-share-icon.png'); this.createMeta(this.shareTitle, this.shareDesc, 'https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/wx-share-icon.png')
} }
let searchParams = new URLSearchParams(window.location.search) let searchParams = new URLSearchParams(window.location.search)
if (searchParams.get('origin') === '1' && !browser.isWeixin) { if (searchParams.get('origin') === '1' && !browser.isWeixin) {
...@@ -305,6 +312,7 @@ class Landing extends Component { ...@@ -305,6 +312,7 @@ class Landing extends Component {
remind = (type = 'create', treasure_code, origin = 1) => { remind = (type = 'create', treasure_code, origin = 1) => {
const {user} = this.props const {user} = this.props
return
http.get(`${API["base-api"]}/wx/user_temporary_qrcode/${user.data.uid}`) http.get(`${API["base-api"]}/wx/user_temporary_qrcode/${user.data.uid}`)
.then(res => { .then(res => {
const {data} = res.data const {data} = res.data
...@@ -413,7 +421,6 @@ class Landing extends Component { ...@@ -413,7 +421,6 @@ class Landing extends Component {
} }
} }
render() { render() {
const { const {
teamData: { teamData: {
...@@ -427,7 +434,8 @@ class Landing extends Component { ...@@ -427,7 +434,8 @@ class Landing extends Component {
standby_plan standby_plan
}, },
activityEnd, activityEnd,
isCaptain isCaptain,
isLoading
} = this.state } = this.state
/* /*
* status * status
...@@ -565,7 +573,8 @@ class Landing extends Component { ...@@ -565,7 +573,8 @@ class Landing extends Component {
</> </>
} }
{ {
!(standby_plan && browser.isWeixin) && status === 2 && !activityEnd && < button type='button' className={'invite-btn'} onClick={this.joinTeam}> !(standby_plan && browser.isWeixin) && status === 2 && !activityEnd &&
< button type='button' className={'invite-btn'} onClick={this.joinTeam}>
同意加入队伍 同意加入队伍
</button> </button>
} }
...@@ -593,6 +602,14 @@ class Landing extends Component { ...@@ -593,6 +602,14 @@ class Landing extends Component {
}}/> }}/>
</> </>
} }
{
isLoading && <div className="loading" style={{width: window.innerWidth + 'px', height: window.innerHeight + 'px'}}>
<FadeLoader
color={'#fff'}
loading={isLoading}
/>
</div>
}
</div> </div>
) )
} }
......
...@@ -233,6 +233,20 @@ ...@@ -233,6 +233,20 @@
.am-whitespace.am-whitespace-xl { .am-whitespace.am-whitespace-xl {
height: 35px; height: 35px;
} }
.loading{
transform: scale(1);
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0,0,0,.8);
z-index: 1000;
display: flex;
align-items: center;
justify-content: center;
}
} }
.popup-container { .popup-container {
......
...@@ -115,6 +115,7 @@ class TeamInfo extends Component { ...@@ -115,6 +115,7 @@ class TeamInfo extends Component {
if (code === 200) { if (code === 200) {
const { treasure_code } = data; const { treasure_code } = data;
if (!getParam('version')) { if (!getParam('version')) {
// this.props.history.push('/activity/newyear-2019/landing?origin=1&treasure_code=' + treasure_code);
window.location.assign('https://h5.julyedu.com/activity/newyear-2019/landing?origin=1&treasure_code=' + treasure_code); window.location.assign('https://h5.julyedu.com/activity/newyear-2019/landing?origin=1&treasure_code=' + treasure_code);
} else { } else {
window.location.assign('https://h5.julyedu.com/activity/newyear-2019/landing?origin=1&treasure_code=' + treasure_code + '&version='+ getParam('version')); window.location.assign('https://h5.julyedu.com/activity/newyear-2019/landing?origin=1&treasure_code=' + treasure_code + '&version='+ getParam('version'));
......
...@@ -3,7 +3,7 @@ import { merge } from 'lodash' ...@@ -3,7 +3,7 @@ import { merge } from 'lodash'
const notLoggedIn = 4030 const notLoggedIn = 4030
const initialState = { export const initialState = {
hasError: true, hasError: true,
code: notLoggedIn, code: notLoggedIn,
msg: '', msg: '',
...@@ -30,4 +30,4 @@ export default function (state = initialState, action) { ...@@ -30,4 +30,4 @@ export default function (state = initialState, action) {
default: default:
return state return state
} }
} }
\ No newline at end of file
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