Skip to content

M
mr-julyedu
Commit 1a4760a9 by zhanghaozhe
Options

优化

parent c156b663
Showing with 241 additions and 194 deletions
src/App.js
...@@ -29,7 +29,7 @@ class App extends Component { ...@@ -29,7 +29,7 @@ class App extends Component {
super(props) super(props)
this.state = { this.state = {
isShowActivityEntry: 0, isShowActivityEntry: 0,
isShowChannel: 0 isShowChannel: 0,
} }
this.globalEntry = null this.globalEntry = null
} }
...@@ -66,11 +66,13 @@ class App extends Component { ...@@ -66,11 +66,13 @@ class App extends Component {
sessionStorage.setItem('enter_url', window.location.href) sessionStorage.setItem('enter_url', window.location.href)
} }
this.getUser()
this.utm() this.utm()
const {history} = this.props const {history} = this.props
this.getUser()
this.setNavigationRecord(this.props.location, this.props.history.action) this.setNavigationRecord(this.props.location, this.props.history.action)
this.setPreviousLocation() this.setPreviousLocation()
...@@ -95,9 +97,9 @@ class App extends Component { ...@@ -95,9 +97,9 @@ class App extends Component {
from: { from: {
pathname: this.previousLocation.pathname, pathname: this.previousLocation.pathname,
search: this.previousLocation.search, search: this.previousLocation.search,
hash: this.previousLocation.hash hash: this.previousLocation.hash,
} },
} },
} }
} else { } else {
this.removeShareCodeCookie() this.removeShareCodeCookie()
...@@ -114,7 +116,7 @@ class App extends Component { ...@@ -114,7 +116,7 @@ class App extends Component {
// treasure_stage，宝箱阶段，0-不在活动时间，1-活动时间内 // treasure_stage，宝箱阶段，0-不在活动时间，1-活动时间内
this.setState({ this.setState({
isShowActivityEntry: data.treasure_stage, isShowActivityEntry: data.treasure_stage,
isShowChannel: data.is_show_site_window_by_channel isShowChannel: data.is_show_site_window_by_channel,
}, () => { }, () => {
data.treasure_stage && this.bindGlobalEntry() data.treasure_stage && this.bindGlobalEntry()
}) })
...@@ -171,7 +173,7 @@ class App extends Component { ...@@ -171,7 +173,7 @@ class App extends Component {
if (zhihu_cb) { if (zhihu_cb) {
let data = { let data = {
'zhihu_cb': zhihu_cb 'zhihu_cb': zhihu_cb,
} }
http.post(`${API['home']}/sys/zhihu/firstRecord`, data) http.post(`${API['home']}/sys/zhihu/firstRecord`, data)
...@@ -220,11 +222,12 @@ class App extends Component { ...@@ -220,11 +222,12 @@ class App extends Component {
} else { } else {
http.get(`${API.home}/m/user_info_sample/0`).then(res => { if (this.props.location.pathname !== '/my') {
this.props.setCurrentUser(this.transformUser(res)) http.get(`${API.home}/m/user_info_sample/0`).then(res => {
}) this.props.setCurrentUser(this.transformUser(res))
})
}
} }
} }
componentDidUpdate() { componentDidUpdate() {
...@@ -253,8 +256,8 @@ class App extends Component { ...@@ -253,8 +256,8 @@ class App extends Component {
user_name: username, user_name: username,
is_vip: isVIP, is_vip: isVIP,
uid, uid,
code code,
} },
} = res.data } = res.data
payload = { payload = {
...@@ -265,15 +268,15 @@ class App extends Component { ...@@ -265,15 +268,15 @@ class App extends Component {
isVIP, isVIP,
avatar, avatar,
uid, uid,
code code,
} },
} }
} else { } else {
payload = { payload = {
hasError: true, hasError: true,
msg: res.data.msg, msg: res.data.msg,
code: res.data.code, code: res.data.code,
data: {} data: {},
} }
} }
return payload return payload
...@@ -284,7 +287,7 @@ class App extends Component { ...@@ -284,7 +287,7 @@ class App extends Component {
if (data.errno == 200) { if (data.errno == 200) {
//移除红包统计cookie //移除红包统计cookie
this.removeShareCodeCookie() this.removeShareCodeCookie()
let {uid, token, avatar_file: avatar, uname: username,} = data.data let {uid, token, avatar_file: avatar, uname: username} = data.data
return { return {
hasError: false, hasError: false,
...@@ -292,9 +295,9 @@ class App extends Component { ...@@ -292,9 +295,9 @@ class App extends Component {
uid, uid,
token, token,
avatar, avatar,
username username,
}, },
msg: data.msg msg: data.msg,
} }
} else { } else {
let {code, msg} = data.data let {code, msg} = data.data
...@@ -302,7 +305,7 @@ class App extends Component { ...@@ -302,7 +305,7 @@ class App extends Component {
code, code,
msg, msg,
hasError: true, hasError: true,
data: {} data: {},
} }
} }
} }
...@@ -338,7 +341,7 @@ class App extends Component { ...@@ -338,7 +341,7 @@ class App extends Component {
closeGlobalEntry = () => { closeGlobalEntry = () => {
localStorage.setItem('globalEntryClosedTime', Date.now().toString()) localStorage.setItem('globalEntryClosedTime', Date.now().toString())
this.setState({ this.setState({
isShowActivityEntry: 0 isShowActivityEntry: 0,
}) })
} }
...@@ -374,7 +377,7 @@ class App extends Component { ...@@ -374,7 +377,7 @@ class App extends Component {
export default compose( export default compose(
connect( connect(
state => ({user: state.user}), state => ({user: state.user}),
{setCurrentUser, startFetchUser} {setCurrentUser, startFetchUser},
), ),
withRouter withRouter,
)(App) )(App)
src/components/Index/index.js
...@@ -5,7 +5,7 @@ import { WithTab } from '@/HOCs' ...@@ -5,7 +5,7 @@ import { WithTab } from '@/HOCs'
// import Swiper from 'react-mobile-swiper' // import Swiper from 'react-mobile-swiper'
// import createStyle from './createStyle' // import createStyle from './createStyle'
import HomeCourseList from './course-list' import HomeCourseList from './course-list'
import { http } from '@/utils' import { http, isValidUrl } from '@/utils'
import LiveRoom from './liveRoom' import LiveRoom from './liveRoom'
import { Link } from "react-router-dom" import { Link } from "react-router-dom"
import { Toast } from 'antd-mobile' import { Toast } from 'antd-mobile'
...@@ -17,7 +17,7 @@ import AllCourseNavigation from "./all-course" ...@@ -17,7 +17,7 @@ import AllCourseNavigation from "./all-course"
// const animateTypes = Swiper.animateTypes // const animateTypes = Swiper.animateTypes
@connect(state => ({ @connect(state => ({
user: state.user user: state.user,
})) }))
class Index extends Component { class Index extends Component {
constructor(props) { constructor(props) {
...@@ -33,28 +33,28 @@ class Index extends Component { ...@@ -33,28 +33,28 @@ class Index extends Component {
{ {
'src': require('./image/freeclass_icon.png'), 'src': require('./image/freeclass_icon.png'),
'name': '公开课', 'name': '公开课',
'href': '/study/free-course' 'href': '/study/free-course',
}, },
{ {
'src': require('./image/jingpin_icon.png'), 'src': require('./image/jingpin_icon.png'),
'name': '精品特惠', 'name': '精品特惠',
'href': '/preferential' 'href': '/preferential',
}, },
{ {
'src': require('./image/zjxj_icon.png'), 'src': require('./image/zjxj_icon.png'),
'name': '赚奖学金', 'name': '赚奖学金',
'href': '/scholarship' 'href': '/scholarship',
}, },
{ {
'src': require('./image/mryt_icon.png'), 'src': require('./image/mryt_icon.png'),
'name': '每日一题', 'name': '每日一题',
'href': '/examination' 'href': '/examination',
}, },
{ {
'src': require('./image/shequ_icon.png'), 'src': require('./image/shequ_icon.png'),
'name': '社区', 'name': '社区',
'href': 'https://ask.julyedu.com' 'href': 'https://ask.julyedu.com',
} },
], ],
} }
} }
...@@ -72,7 +72,7 @@ class Index extends Component { ...@@ -72,7 +72,7 @@ class Index extends Component {
this.setState({ this.setState({
banner: data.banner, banner: data.banner,
lives: data.lives, lives: data.lives,
modules modules,
}) })
} else { } else {
Toast.info(res.data.msg, 2) Toast.info(res.data.msg, 2)
...@@ -93,7 +93,7 @@ class Index extends Component { ...@@ -93,7 +93,7 @@ class Index extends Component {
this.setState({ this.setState({
isShow: true, isShow: true,
islive: true, islive: true,
roomMess: item roomMess: item,
}) })
} else { } else {
window.location.href = `${window.location.href.includes('pre') ? 'http://www-pre.julyedu.com' : 'http://www.julyedu.com'}/live/m_room/${item.room_id}` window.location.href = `${window.location.href.includes('pre') ? 'http://www-pre.julyedu.com' : 'http://www.julyedu.com'}/live/m_room/${item.room_id}`
...@@ -147,10 +147,18 @@ class Index extends Component { ...@@ -147,10 +147,18 @@ class Index extends Component {
this.state.tabdata.map((item, index) => { this.state.tabdata.map((item, index) => {
return ( return (
<li key={index}> <li key={index}>
<a href={item.href}> {
<img src={item.src} alt=""/> isValidUrl(item.href)
<span>{item.name}</span> ? <a href={item.href}>
</a> <img src={item.src} alt=""/>
<span>{item.name}</span>
</a>
: <Link to={item.href}>
<img src={item.src} alt=""/>
<span>{item.name}</span>
</Link>
}
</li> </li>
) )
}) })
......
src/components/my/index.js
import React, {PureComponent} from 'react' import React, { PureComponent } from 'react'
import {Flex, WhiteSpace, List} from 'antd-mobile' import { Flex, WhiteSpace, List } from 'antd-mobile'
import './index.scss' import './index.scss'
import Avatar from './image/avatar.png' import Avatar from './image/avatar.png'
import Vip from './image/vip.png' import Vip from './image/vip.png'
import {WithTab} from '@/HOCs' import { WithTab } from '@/HOCs'
import {Link} from "react-router-dom" import { Link } from "react-router-dom"
import {connect} from "react-redux" import { connect } from "react-redux"
import {HeaderBar} from "@/common" import { HeaderBar } from "@/common"
import { http } from "@/utils" import { http } from "@/utils"
import {getCourses} from './../detail/actions'; import { getCourses } from './../detail/actions';
import { setCurrentUser, startFetchUser } from "@/store/userAction"
const Item = List.Item; const Item = List.Item;
const Brief = Item.Brief; const Brief = Item.Brief;
@connect(state => ({ @connect(state => ({
user: state.user user: state.user,
})) }), {startFetchUser, setCurrentUser})
class My extends PureComponent { class My extends PureComponent {
constructor(props) { constructor(props) {
super(props) super(props)
this.state = { this.state = {
data: [], data: [],
isVip: 0, isVip: 0,
}
}
componentDidMount() {
this.getUser()
}
getUser = () => {
this.props.startFetchUser()
http.get(`${API.home}/m/user_info_sample/1`).then(res => {
this.props.setCurrentUser(this.transformUser(res))
})
}
transformUser = res => {
let payload
if (res.data.code === 200) {
const {
msg, data: {
avatar_file: avatar,
user_name: username,
is_vip: isVIP,
uid,
code,
},
} = res.data
payload = {
hasError: false,
msg,
data: {
username,
isVIP,
avatar,
uid,
code,
},
}
} else {
payload = {
hasError: true,
msg: res.data.msg,
code: res.data.code,
data: {},
}
}
return payload
}
// 去登录
toLogin = () => {
this.props.history.push('/passport')
}
toCourseDetail = (id) => {
const {dispatch, history} = this.props;
// dispatch(getCourses(id, () => {
history.push(`/detail?id=${id}`);
return false;
// }));
}
render() {
const {user} = this.props
const uid = user && user.data && user.data.uid
const username = user && user.data && user.data.username
const avatar = user && user.data && user.data.avatar
const isVIP = user && user.data && user.data.isVIP
// const isVIP = this.state.isVip
let list
if (!uid) {
list = <List className="my-list">
<Item
className="avatar-wrap"
arrow="horizontal"
multipleLine
thumb={Avatar}
onClick={this.toLogin}>
<Brief>点击登录</Brief>
</Item>
</List>
} else {
list = <List className="my-list">
<Link to='/myedit'>
<Item
className="avatar-wrap"
arrow="horizontal"
multipleLine
thumb={avatar}
>
<Brief>
{username}
{
isVIP === 1 &&
<img src={Vip} className='vip' alt=""/>
}
</Brief>
<Brief style={{fontSize: "12px"}}>学号: {uid}</Brief>
</Item>
</Link>
{
!isVIP &&
<a href="javascript:;" className="my-isvip" onClick={() => this.toCourseDetail(139)}></a>
} }
</List>
} }
return (
<div className="flex-container">
<Flex>
<Flex.Item>
<HeaderBar title='我的' arrow={false} cart={false}></HeaderBar>
{list}
componentDidMount() { {
http.get(`${API.home}/m/user_info_sample/1`).then(res => { !uid &&
const {data,code} = res.data <div className="am-list-header"></div>
if (code === 200) {
this.setState({
isVip: data.is_vip
})
}
})
}
// 去登录 }
toLogin = () => {
this.props.history.push('/passport')
}
toCourseDetail = (id) => { <List className="my-list-content">
const { dispatch, history } = this.props; <Link to='/purchased'>
// dispatch(getCourses(id, () => { <Item arrow="horizontal">
history.push(`/detail?id=${id}`); <i className="iconfont iconiconfront-27"></i>
return false; 已购课程
// })); </Item>
} </Link>
<Link to='/shopcart'>
<Item arrow="horizontal">
<i className="iconfont icongouwuche-xianxing"></i>
购物车
</Item>
</Link>
<Link to='/myorders'>
<Item arrow="horizontal">
<i className="iconfont iconiconfront-24"></i>
课程订单
</Item>
</Link>
<Link to={{
pathname: '/coupons',
state: {
from: this.props.location.pathname,
},
}}>
<Item arrow="horizontal" className="no-border">
<i className="iconfont iconiconfront-52"></i>
优惠券
</Item>
</Link>
<div className="am-list-header"></div>
render() { <Link to='/scholarship'>
const {user} = this.props <Item arrow="horizontal" className='btm-scholarship'>
const uid = user && user.data && user.data.uid <i className="iconfont iconiconfront-51"></i>
const username = user && user.data && user.data.username 赚奖学金
const avatar = user && user.data && user.data.avatar
// const isVIP = user && user.data && user.data.isVIP
const isVIP = this.state.isVip
let list
if (!uid) {
list = <List className="my-list">
<Item
className="avatar-wrap"
arrow="horizontal"
multipleLine
thumb={Avatar}
onClick={this.toLogin}>
<Brief>点击登录</Brief>
</Item> </Item>
</Link>
</List> </List>
} else {
list = <List className="my-list"> </Flex.Item>
<Link to='/myedit'> </Flex>
<Item <WhiteSpace size="lg"/>
className="avatar-wrap" </div>
arrow="horizontal" )
multipleLine }
thumb={avatar}
>
<Brief>
{username}
{
isVIP === 1 &&
<img src={Vip} className='vip' alt=""/>
}
</Brief>
<Brief style={{fontSize: "12px"}}>学号: {uid}</Brief>
</Item>
</Link>
{
!isVIP &&
<a href="javascript:;" className="my-isvip" onClick={() => this.toCourseDetail(139)}></a>
}
</List>
}
return (
<div className="flex-container">
<Flex>
<Flex.Item>
<HeaderBar title='我的' arrow={false} cart={false}></HeaderBar>
{list}
{
!uid &&
<div className="am-list-header"></div>
}
<List className="my-list-content">
<Link to='/purchased'>
<Item arrow="horizontal">
<i className="iconfont iconiconfront-27"></i>
已购课程
</Item>
</Link>
<Link to='/shopcart'>
<Item arrow="horizontal">
<i className="iconfont icongouwuche-xianxing"></i>
购物车
</Item>
</Link>
<Link to='/myorders'>
<Item arrow="horizontal">
<i className="iconfont iconiconfront-24"></i>
课程订单
</Item>
</Link>
<Link to={{
pathname: '/coupons',
state: {
from: this.props.location.pathname
}
}}>
<Item arrow="horizontal" className="no-border">
<i className="iconfont iconiconfront-52"></i>
优惠券
</Item>
</Link>
<div className="am-list-header"></div>
<Link to='/scholarship'>
<Item arrow="horizontal" className='btm-scholarship'>
<i className="iconfont iconiconfront-51"></i>
赚奖学金
</Item>
</Link>
</List>
</Flex.Item>
</Flex>
<WhiteSpace size="lg"/>
</div>
)
}
} }
......
src/router/index.js
...@@ -2,16 +2,6 @@ import React from 'react' ...@@ -2,16 +2,6 @@ import React from 'react'
import { Switch, Route } from 'react-router-dom' import { Switch, Route } from 'react-router-dom'
import RouterConfig from './router-config' import RouterConfig from './router-config'
import PrivateRoute from './privateRoute' import PrivateRoute from './privateRoute'
// 动态改变title
// const RouteWithSubRoutes = route => {
// return (
// <Route
// exact
// {...route}
// onChange={document.title = route.name}
// />
// );
// };
export default function () { export default function () {
return ( return (
...@@ -21,8 +11,11 @@ export default function () { ...@@ -21,8 +11,11 @@ export default function () {
if (isPrivate) { if (isPrivate) {
return <PrivateRoute {...rest} key={index}/> return <PrivateRoute {...rest} key={index}/>
} else { } else {
const {component: Component, ...rest} = item
return ( return (
<Route {...rest} key={index}/> <Route {...rest} key={index} render={(props) => {
return <Component {...props}/>
}}/>
) )
} }
})} })}
......
src/utils/index.js
...@@ -3,7 +3,7 @@ import { ...@@ -3,7 +3,7 @@ import {
differenceInDays, differenceInDays,
differenceInHours, differenceInHours,
differenceInMinutes, differenceInMinutes,
differenceInSeconds differenceInSeconds,
} from 'date-fns' } from 'date-fns'
...@@ -15,7 +15,7 @@ export const getParam = (key, str) => { ...@@ -15,7 +15,7 @@ export const getParam = (key, str) => {
} }
const html = content => ({ const html = content => ({
__html: htmlDecode(content) __html: htmlDecode(content),
}) })
const htmlDecode = content => { const htmlDecode = content => {
...@@ -102,7 +102,7 @@ const browser = (function () { ...@@ -102,7 +102,7 @@ const browser = (function () {
isIOS: /\(i[^;]+;( U;)? CPU.+Mac OS X/i.test(ua), isIOS: /\(i[^;]+;( U;)? CPU.+Mac OS X/i.test(ua),
isIPad: /iPad/i.test(ua), isIPad: /iPad/i.test(ua),
isAndroidApp: /Android/i.test(ua) && getParam('version'), isAndroidApp: /Android/i.test(ua) && getParam('version'),
isIOSApp: /iPhone/i.test(ua) && getParam('version') isIOSApp: /iPhone/i.test(ua) && getParam('version'),
} }
})() })()
...@@ -119,17 +119,21 @@ const dateCountDown = (later, earlier) => { ...@@ -119,17 +119,21 @@ const dateCountDown = (later, earlier) => {
d, d,
h, h,
m, m,
s s,
} }
} }
const isValidUrl = (str) => {
return /https?:\/\/(www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_\+.~#?&//=]*)/.test(str)
}
export { export {
default as http default as http,
} }
from './http' from './http'
export { export {
default as wxShare default as wxShare,
} }
from './wechat/share' from './wechat/share'
export { export {
...@@ -141,8 +145,9 @@ export { ...@@ -141,8 +145,9 @@ export {
browser, browser,
isLogin, isLogin,
dateCountDown, dateCountDown,
isValidUrl
} }
export { export {
default as SendMessageToApp default as SendMessageToApp,
} }
from './app' from './app'
\ 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