Skip to content

M
mr-julyedu
Commit 2a6cb5f4 by xuzhenghua
Options

Merge branch 'master' of gitlab.julyedu.com:baiguangyao/mr-julyedu

parents 21554483 47ab9226
Showing with 510 additions and 208 deletions
package.json
...@@ -4,6 +4,7 @@ ...@@ -4,6 +4,7 @@
"private": true, "private": true,
"dependencies": { "dependencies": {
"@babel/core": "7.2.2", "@babel/core": "7.2.2",
"@babel/plugin-proposal-decorators": "^7.4.4",
"@loadable/component": "^5.10.1", "@loadable/component": "^5.10.1",
"@svgr/webpack": "4.1.0", "@svgr/webpack": "4.1.0",
"antd-mobile": "^2.2.13", "antd-mobile": "^2.2.13",
...@@ -67,6 +68,7 @@ ...@@ -67,6 +68,7 @@
"redux": "^4.0.1", "redux": "^4.0.1",
"redux-immutable": "^4.0.0", "redux-immutable": "^4.0.0",
"redux-logger": "^3.0.6", "redux-logger": "^3.0.6",
"redux-persist": "^5.10.0",
"redux-thunk": "^2.3.0", "redux-thunk": "^2.3.0",
"resolve": "1.10.0", "resolve": "1.10.0",
"sass-loader": "^7.1.0", "sass-loader": "^7.1.0",
...@@ -146,6 +148,12 @@ ...@@ -146,6 +148,12 @@
], ],
"plugins": [ "plugins": [
[ [
"@babel/plugin-proposal-decorators",
{
"legacy": true
}
],
[
"import", "import",
{ {
"libraryName": "antd-mobile", "libraryName": "antd-mobile",
......
src/common/Course/index.js
...@@ -6,10 +6,12 @@ const Course = (props) => { ...@@ -6,10 +6,12 @@ const Course = (props) => {
return ( return (
<li className={`course-item ${props.className}`}> <li className={`course-item ${props.className}`}>
{props.top} {props.top}
<Link to={`/detail?id=${props.id}`}> <a onClick={() => props.toDetail(props.id)}>
{/* <Link to={`/detail?id=${props.id}`}> */}
<img src={props.img} alt=""/> <img src={props.img} alt=""/>
<p className={`course-title ${props.className}`}>{props.title}</p> <p className={`course-title ${props.className}`}>{props.title}</p>
</Link> {/* </Link> */}
</a>
{props.bottom} {props.bottom}
</li> </li>
); );
......
src/common/OrderList/index.js
...@@ -14,15 +14,15 @@ import {Link} from "react-router-dom"; ...@@ -14,15 +14,15 @@ import {Link} from "react-router-dom";
*/ */
const OrderItem = ({ info, tab, children, src,id, isaist, ...restProps }) => { const OrderItem = ({ info, tab, children, src,id, isaist, toDetail, ...restProps }) => {
return ( return (
<div className='public-list-item'> <div className='public-list-item'>
<div className="public-content"> <div className="public-content">
{tab} {tab}
<div className="public-cover" > <div className="public-cover" >
<Link to={`/detail?id=${id}`}> {/* <Link to={`/detail?id=${id}`}> */}
<img src={src} alt="" /> <img src={src} alt="" onClick={() => toDetail(id)} />
</Link> {/* </Link> */}
{ {
(isaist && (isaist &&
<span className='return_cash'></span> <span className='return_cash'></span>
......
src/common/VList/index.js
...@@ -8,9 +8,9 @@ const VList = (props) => { ...@@ -8,9 +8,9 @@ const VList = (props) => {
<div className="content"> <div className="content">
<div className="cover"> <div className="cover">
{props.status} {props.status}
<Link to={`/detail?id=${props.id}`}> {/* <Link to={`/detail?id=${props.id}`}> */}
<img src={props.img} alt=""/> <img src={props.img} alt="" onClick={() => props.toDetail(props.id)} />
</Link> {/* </Link> */}
</div> </div>
{props.info} {props.info}
</div> </div>
......
src/components/Index/index.js
...@@ -10,10 +10,14 @@ import LiveRoom from './liveRoom' ...@@ -10,10 +10,14 @@ 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'
import {connect} from "react-redux"; import {connect} from "react-redux";
import {getCourses} from './../detail/actions';
const animateTypes = Swiper.animateTypes const animateTypes = Swiper.animateTypes
@connect(state => ({
user: state.user
}))
class Index extends Component { class Index extends Component {
constructor(props) { constructor(props) {
super(props) super(props)
...@@ -104,6 +108,14 @@ class Index extends Component { ...@@ -104,6 +108,14 @@ class Index extends Component {
this.props.history.push('/search') this.props.history.push('/search')
} }
toCourseDetail = (id) => {
const { dispatch, history } = this.props;
dispatch(getCourses(id, () => {
history.push(`/detail?id=${id}`);
return false;
}));
}
render() { render() {
return ( return (
<div className='index-box'> <div className='index-box'>
...@@ -154,7 +166,7 @@ class Index extends Component { ...@@ -154,7 +166,7 @@ class Index extends Component {
(this.state.modules && this.state.modules.length > 0) ? this.state.modules.map((item, index) => { (this.state.modules && this.state.modules.length > 0) ? this.state.modules.map((item, index) => {
return ( return (
<div key={index}> <div key={index}>
<CourseList modules={item}/> <CourseList modules={item} toDetail={this.toCourseDetail}/>
<p className="borderTop"></p> <p className="borderTop"></p>
</div> </div>
) )
...@@ -166,6 +178,7 @@ class Index extends Component { ...@@ -166,6 +178,7 @@ class Index extends Component {
<p>查看全部课程</p> <p>查看全部课程</p>
<span>数学基础、数学结构、大数据实战、Python...</span> <span>数学基础、数学结构、大数据实战、Python...</span>
</Link> </Link>
</div> </div>
{/* 直播间预约 */} {/* 直播间预约 */}
...@@ -187,9 +200,11 @@ function TopSwiper({bannerList}) { ...@@ -187,9 +200,11 @@ function TopSwiper({bannerList}) {
<Swiper type={animateTypes.CARD} loop={true} height={168} autoPlay={true} typePro createStyle={createStyle}> <Swiper type={animateTypes.CARD} loop={true} height={168} autoPlay={true} typePro createStyle={createStyle}>
{bannerList && bannerList.length > 0 && bannerList.map((item, index) => { {bannerList && bannerList.length > 0 && bannerList.map((item, index) => {
return ( return (
<Link to={item.jump_url} key={index}> <a href={item.jump_url}>
{/* <Link to={item.jump_url} key={index}> */}
<img className="item" src={item.name} alt=""/> <img className="item" src={item.name} alt=""/>
</Link> {/* </Link> */}
</a>
) )
}) })
} }
...@@ -199,7 +214,7 @@ function TopSwiper({bannerList}) { ...@@ -199,7 +214,7 @@ function TopSwiper({bannerList}) {
// 课程模块儿公共组件 // 课程模块儿公共组件
// 课程数量是奇数第一个课程需要横着展示沾满一行，课程数量是偶数一行显示两个 // 课程数量是奇数第一个课程需要横着展示沾满一行，课程数量是偶数一行显示两个
function CourseList({modules}) { function CourseList({modules, toDetail}) {
let isOdd = modules.list.length % 2 === 0 let isOdd = modules.list.length % 2 === 0
// 数量为奇数时，第一个课程显示大图（如后台未上传，前台显示小图），课程数量为偶数时，均显示小图 // 数量为奇数时，第一个课程显示大图（如后台未上传，前台显示小图），课程数量为偶数时，均显示小图
let filterList = '' let filterList = ''
...@@ -223,10 +238,10 @@ function CourseList({modules}) { ...@@ -223,10 +238,10 @@ function CourseList({modules}) {
<ul className='index-course-detail'> <ul className='index-course-detail'>
{ {
!isOdd && modules.list[0].course_img!=='' && !isOdd && modules.list[0].course_img!=='' &&
<div className="category-vip"> <div className="category-vip" onClick={() => toDetail(modules.list[0].course_id)}>
<Link to={`/detail?id=${modules.list[0].course_id}`}> {/* <Link to={`/detail?id=${modules.list[0].course_id}`}> */}
<img src={modules.list[0].course_img_small} alt=""/> <img src={modules.list[0].course_img_small} alt=""/>
</Link> {/* </Link> */}
</div> </div>
} }
{ {
...@@ -255,9 +270,17 @@ function CourseList({modules}) { ...@@ -255,9 +270,17 @@ function CourseList({modules}) {
</div> </div>
) )
return ( return (
<Course key={index} top={top} data={item} bottom={bottom} img={item.course_img_small} <Course
title={item.course_title} id={item.course_id} key={index}
className='text-overflow-2'></Course> top={top}
data={item}
bottom={bottom}
img={item.course_img_small}
title={item.course_title}
id={item.course_id}
toDetail={toDetail}
className='text-overflow-2'
/>
) )
}) })
} }
...@@ -314,7 +337,4 @@ function ScrollBox(props) { ...@@ -314,7 +337,4 @@ function ScrollBox(props) {
} }
export default connect( export default WithTab(Index);
state => ({user: state.user}),
null
)(WithTab(Index))
src/components/classify/courselist.js
...@@ -3,12 +3,14 @@ import {VList} from '../../common' ...@@ -3,12 +3,14 @@ import {VList} from '../../common'
import {Tabs, WhiteSpace} from 'antd-mobile' import {Tabs, WhiteSpace} from 'antd-mobile'
import './courselist.scss' import './courselist.scss'
import HeaderSearch from '../../common/HeaderSearch/index' import HeaderSearch from '../../common/HeaderSearch/index'
import {http, api, getParam} from "@/utils" import {http, getParam} from "@/utils"
import {Toast} from 'antd-mobile' import {Toast} from 'antd-mobile'
import {Link} from 'react-router-dom' import {Link} from 'react-router-dom'
import Loading from '@/common/Loading' import Loading from '@/common/Loading'
import {connect} from 'react-redux';
import {getCourses} from './../detail/actions';
@connect()
class Classify extends Component { class Classify extends Component {
constructor(props) { constructor(props) {
super(props) super(props)
...@@ -102,6 +104,13 @@ class Classify extends Component { ...@@ -102,6 +104,13 @@ class Classify extends Component {
})) }))
} }
toCourseDetail = (id) => {
const { dispatch, history } = this.props;
dispatch(getCourses(id, () => {
history.push(`/detail?id=${id}`)
}));
}
render() { render() {
const bottom = ( const bottom = (
<i className={'iconfont iconiconfront-69 pull-down'}></i> <i className={'iconfont iconiconfront-69 pull-down'}></i>
...@@ -132,10 +141,10 @@ class Classify extends Component { ...@@ -132,10 +141,10 @@ class Classify extends Component {
{this.state.data && this.state.data.length > 0 && this.state.data.map((item, index) => { {this.state.data && this.state.data.length > 0 && this.state.data.map((item, index) => {
const Info = ( const Info = (
<div className="info"> <div className="info">
<p className='title'> <p className='title' onClick={() => this.toCourseDetail(item.course_id)}>
<Link to={`/detail?id=${item.course_id}`}> {/* <Link to={`/detail?id=${item.course_id}`}> */}
{item.course_title} {item.course_title}
</Link> {/* </Link> */}
</p> </p>
<p className='contact text-overflow-2'>{item.desc}</p> <p className='contact text-overflow-2'>{item.desc}</p>
<div className='des'> <div className='des'>
...@@ -164,9 +173,14 @@ class Classify extends Component { ...@@ -164,9 +173,14 @@ class Classify extends Component {
</div> </div>
) )
return ( return (
<VList key={index} status={status} <VList
img={item.image_name} id={item.course_id} key={index}
info={Info}></VList> status={status}
img={item.image_name}
id={item.course_id}
info={Info}
toDetail={this.toCourseDetail}
/>
) )
})} })}
</ul> </ul>
......
src/components/detail/actions.js
import {api, getParam, http} from "@/utils"; import {api, getParam, http} from "@/utils";
export const RECEIVE_COURSES_DETAIL = 'RECEIVE_COURSES_DETAIL' export const RECEIVE_COURSES_DETAIL = 'RECEIVE_COURSES_DETAIL'
export const ADD_COURSES_TO_CART = 'ADD_COURSES_TO_CART';
export const receiveCourseDetail = payload => ({ export const receiveCourseDetail = payload => ({
type: RECEIVE_COURSES_DETAIL, type: RECEIVE_COURSES_DETAIL,
payload payload
}) })
// 加入购物车
export const addCourseToCart = payload => ({
type: ADD_COURSES_TO_CART,
payload
})
export const fetchCoursesListIfNeeded = () => (dispatch, getState) => { export const fetchCoursesListIfNeeded = () => (dispatch, getState) => {
dispatch(getCourses({ dispatch(getCourses({
courseInfo: getState().detailInfo courseInfo: getState().detailInfo
})) }))
} }
export const getCourses = payload => dispatch => { export const getCourses = (id, cb) => dispatch => {
return http.get(`${API.home}/m/course/detail/${getParam('id')}`,).then((res) => { const courseId = id? id : getParam('id');
return http.get(`${API.home}/m/course/detail/${courseId}`,).then((res) => {
if (res.data.code === 200) { if (res.data.code === 200) {
dispatch(receiveCourseDetail({ dispatch(receiveCourseDetail({
...res.data.data ...res.data.data
})) }));
typeof cb === 'function' && cb();
} }
}) })
} }
src/components/detail/bargain/index.js
...@@ -135,25 +135,25 @@ class Bargain extends Component { ...@@ -135,25 +135,25 @@ class Bargain extends Component {
type: type, // 1 用户自己砍价 2 使用砍价神器 3 好友助力砍价 4 好友第二次助力 type: type, // 1 用户自己砍价 2 使用砍价神器 3 好友助力砍价 4 好友第二次助力
parent_uid: uid // 被助力人id 【自己本人操作传0】 parent_uid: uid // 被助力人id 【自己本人操作传0】
} }
const { history } = this.props;
http.post(`${API.home}/m/bargain/toBargain`, data).then((res) => { http.post(`${API.home}/m/bargain/toBargain`, data).then((res) => {
if (res.data.code === 200) { const { data: { data, code } } = res;
if (code === 200) {
if (type === 2) { if (type === 2) {
this.setState({ this.setState({
isShowOverlay: true, isShowOverlay: true,
status: 2, status: 2,
}) })
} else { } else {
if (res.data.data.user_status === 2) { if (data.user_status === 2) {
this.setState({ this.setState({
isShowOverlay: true, isShowOverlay: true,
status: 3, status: 3,
}) })
} else { } else {
// this.getBargainInfo() history.push(`/bargain-middle-page?id=${getParam('id')}&bargaincode=${data.bargain_code}&is_originator=1`)
document.location.reload()
} }
} }
} else { } else {
Toast.info(res.data.msg, 2) Toast.info(res.data.msg, 2)
} }
......
src/components/detail/btnstatus/index.js
...@@ -18,7 +18,7 @@ class BtnStatus extends Component { ...@@ -18,7 +18,7 @@ class BtnStatus extends Component {
group_status: 3, group_status: 3,
in_cart: false, in_cart: false,
countdown: 0, countdown: 0,
barInfo: '' // barInfo: ''
} }
} }
...@@ -40,9 +40,9 @@ class BtnStatus extends Component { ...@@ -40,9 +40,9 @@ class BtnStatus extends Component {
// } // }
componentWillReceiveProps(nextProps) { componentWillReceiveProps(nextProps) {
if(nextProps.data && nextProps.data.is_bargain) { // if(nextProps.data && nextProps.data.is_bargain) {
this.getBargainInfo() // this.getBargainInfo()
} // }
this.setState({ this.setState({
...nextProps.data.course_info, ...nextProps.data.course_info,
countdown: nextProps.countdown, countdown: nextProps.countdown,
...@@ -51,6 +51,7 @@ class BtnStatus extends Component { ...@@ -51,6 +51,7 @@ class BtnStatus extends Component {
// 加入购物车 type：1 加入购物车，2加入购物车并跳转到购物车页面去支付 // 加入购物车 type：1 加入购物车，2加入购物车并跳转到购物车页面去支付
toCart = (type) => { toCart = (type) => {
const { history, addCourseToCart } = this.props;
let data = { let data = {
course_id: getParam('id') course_id: getParam('id')
}; };
...@@ -59,14 +60,13 @@ class BtnStatus extends Component { ...@@ -59,14 +60,13 @@ class BtnStatus extends Component {
if (type === 1) { if (type === 1) {
Toast.info('已加入购物车', 2) Toast.info('已加入购物车', 2)
// this.props.getCourses() // this.props.getCourses()
document.location.reload() // document.location.reload()
addCourseToCart();
} else { } else {
this.props.history.replace('/shopcart'); history.replace('/shopcart');ß
} }
} else if (res.data.code === 15001) { } else if (res.data.code === 15001) {
this.props.history.replace('/shopcart'); history.replace('/shopcart');
} else { } else {
Toast.info(res.data.msg, 2); Toast.info(res.data.msg, 2);
} }
...@@ -110,12 +110,12 @@ class BtnStatus extends Component { ...@@ -110,12 +110,12 @@ class BtnStatus extends Component {
}; };
// 直接购买 // 直接购买
tobuy = () => { tobuy = () => {
const {user} = this.props const {user, barInfo} = this.props
const uid = user && user.data && user.data.uid const uid = user && user.data && user.data.uid
if (!uid) { if (!uid) {
this.props.history.push('/passport/login') this.props.history.push('/passport/login')
} else { } else {
if (this.state.barInfo.bargain_status === 2) { if (barInfo.bargain_status === 2) {
// this.toCart(2) // this.toCart(2)
// 新需求 不需要加入购物车 直接走普通课程的立即报名流程 跳到订单页 // 新需求 不需要加入购物车 直接走普通课程的立即报名流程 跳到订单页
this.simpleCourse(); this.simpleCourse();
...@@ -164,8 +164,15 @@ class BtnStatus extends Component { ...@@ -164,8 +164,15 @@ class BtnStatus extends Component {
isShowOverlay: false, isShowOverlay: false,
bargainStatus: '', bargainStatus: '',
}) })
http.get(`${API['base-api']}/m/cart/addtopreorder/[${getParam('id')}]`).then((res) => {
if (res.data.errno === 0) {
this.props.history.push(`/order?id=[${getParam('id')}]`, {simple: 1});
} else {
Toast.info(res.data.msg, 2);
}
})
// window.location.href = '/shopcart' // window.location.href = '/shopcart'
this.props.history.push(`/order?id=[${getParam('id')}]`, {simple: 1}) // this.props.history.push(`/order?id=[${getParam('id')}]`, {simple: 1})
} else { } else {
Toast.info(res.data.msg, 2) Toast.info(res.data.msg, 2)
} }
...@@ -179,22 +186,23 @@ class BtnStatus extends Component { ...@@ -179,22 +186,23 @@ class BtnStatus extends Component {
} }
// 砍价接口 // 砍价接口
toKanjia = () => { toKanjia = () => {
const {user} = this.props const {user, history} = this.props;
const uid = user && user.data && user.data.uid const uid = user && user.data && user.data.uid;
const course_id = getParam('id');
if (!uid) { if (!uid) {
this.props.history.push('/passport/login') this.props.history.push('/passport/login')
} else { } else {
let data = { let data = {
course_id: getParam('id'), course_id,
type: 1, // 1 用户自己砍价 2 使用砍价神器 3 好友助力砍价 4 好友第二次助力 type: 1, // 1 用户自己砍价 2 使用砍价神器 3 好友助力砍价 4 好友第二次助力
parent_uid: 0 // 被助力人id 【自己本人操作传0】 parent_uid: 0 // 被助力人id 【自己本人操作传0】
} }
http.post(`${API.home}/m/bargain/toBargain`, data).then((res) => { http.post(`${API.home}/m/bargain/toBargain`, data).then((res) => {
if (res.data.code === 200) { const {data: {data, code, msg}} = res;
// this.props.getBargainInfo() if (code === 200) {
document.location.reload() history.push(`/bargain-middle-page?id=${course_id}&bargaincode=${data.bargain_code}&is_originator=1`)
} else { } else {
Toast.info(res.data.msg, 2) Toast.info(msg, 2)
} }
}) })
} }
...@@ -227,7 +235,8 @@ class BtnStatus extends Component { ...@@ -227,7 +235,8 @@ class BtnStatus extends Component {
const {countdown} = this.state; const {countdown} = this.state;
const {user} = this.props const {user} = this.props
const uid = user && user.data && user.data.uid const uid = user && user.data && user.data.uid
const { barInfo = {} } = this.props;
console.log(this.props);
return ( return (
<div> <div>
...@@ -311,15 +320,15 @@ class BtnStatus extends Component { ...@@ -311,15 +320,15 @@ class BtnStatus extends Component {
<span onClick={this.tobuy}>直接购买</span> <span onClick={this.tobuy}>直接购买</span>
</button> </button>
{ {
(this.state.barInfo.bargain_status === 2 || !uid) && (barInfo.bargain_status === 2 || !uid) &&
<button className='btn btn-s bg-E02E24' onClick={this.toKanjia}> <button className='btn btn-s bg-E02E24' onClick={this.toKanjia}>
我要砍价 我要砍价
</button> </button>
} }
{ {
(this.state.barInfo.bargain_status === 0 || this.state.barInfo.bargain_status === 1) && (uid) && (barInfo.bargain_status === 0 || barInfo.bargain_status === 1) && (uid) &&
<button className='btn btn-s bg-E02E24'> <button className='btn btn-s bg-E02E24'>
<span>¥{this.state.barInfo.amount}</span> <span>¥{barInfo.amount}</span>
<span onClick={this.bargainToOrder}>去支付</span> <span onClick={this.bargainToOrder}>去支付</span>
</button> </button>
} }
......
src/components/detail/group/index.js
...@@ -2,7 +2,6 @@ import React, { Component } from 'react' ...@@ -2,7 +2,6 @@ import React, { Component } from 'react'
import './index.scss' import './index.scss'
import { getParam } from "@/utils" import { getParam } from "@/utils"
import { connect } from "react-redux" import { connect } from "react-redux"
import { Link } from "react-router-dom"
import { Flex } from 'antd-mobile' import { Flex } from 'antd-mobile'
import {browser} from "@/utils" import {browser} from "@/utils"
import {Toast} from 'antd-mobile' import {Toast} from 'antd-mobile'
......
src/components/detail/group/togroup.js
...@@ -33,7 +33,8 @@ class ToGroup extends Component { ...@@ -33,7 +33,8 @@ class ToGroup extends Component {
let shareData = { let shareData = {
title: `【仅剩${number}个名额】我${pdd_price}元拼了《${data.course_title}》`, title: `【仅剩${number}个名额】我${pdd_price}元拼了《${data.course_title}》`,
desc: data.course_title, // 分享描述 desc: data.course_title, // 分享描述
link: location.origin + `/detail??id=${data.course_id}`, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致 // 直接进入课程详情页，isIn: 1
link: location.origin + `/detail?id=${data.course_id}&isIn=1`, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: data.image_name, // 分享图标 imgUrl: data.image_name, // 分享图标
}; };
http.post(`${API['base-api']}/m/sale/signature`).then(res => { http.post(`${API['base-api']}/m/sale/signature`).then(res => {
...@@ -120,14 +121,22 @@ class ToGroup extends Component { ...@@ -120,14 +121,22 @@ class ToGroup extends Component {
}); });
} }
toCourseDetail = (id) => {
const { dispatch, history } = this.props;
dispatch(getCourses(id, () => {
history.push(`/detail?id=${id}`);
return false;
}));
}
render() { render() {
const { data: { course_id, course_title, simpledescription, price0, price1 }, pdd_price, is_success, person_num, groupon_member, course_list } = this.state; const { data: { course_id, course_title, simpledescription, price0, price1 }, pdd_price, is_success, person_num, groupon_member, course_list } = this.state;
const Info = ( const Info = (
<div className="info"> <div className="info">
<p className='title'> <p className='title' onClick={() => this.toCourseDetail(course_id)}>
<Link to={`/detail?id=${course_id}`}> {/* <Link to={`/detail?id=${course_id}`}> */}
{course_title} {course_title}
</Link> {/* </Link> */}
</p> </p>
<p className='contact text-overflow-2'>{simpledescription}</p> <p className='contact text-overflow-2'>{simpledescription}</p>
<div className='des'> <div className='des'>
...@@ -142,7 +151,13 @@ class ToGroup extends Component { ...@@ -142,7 +151,13 @@ class ToGroup extends Component {
<div className='to-group-box'> <div className='to-group-box'>
<HeaderBar title='拼团' arrow={true} cart={false}></HeaderBar> <HeaderBar title='拼团' arrow={true} cart={false}></HeaderBar>
{ {
!is_success && <VList img={this.state.data.image_name} id={this.state.data.course_id} info={Info}></VList> !is_success &&
<VList
img={this.state.data.image_name}
id={this.state.data.course_id}
info={Info}
toDetail={this.toCourseDetail}
/>
} }
<GorupContent data={this.state} invitedFriends={this.invitedFriends} /> <GorupContent data={this.state} invitedFriends={this.invitedFriends} />
...@@ -157,10 +172,10 @@ class ToGroup extends Component { ...@@ -157,10 +172,10 @@ class ToGroup extends Component {
(course_list && course_list.length > 0) && (course_list[0].course && course_list[0].course.length > 0) && course_list[0].course.slice(0, 4).map(item => { (course_list && course_list.length > 0) && (course_list[0].course && course_list[0].course.length > 0) && course_list[0].course.slice(0, 4).map(item => {
let weekInfo = <div className="info"> let weekInfo = <div className="info">
<p className='title'> <p className='title' onClick={() => this.toCourseDetail(item.course_id)}>
<Link to={`/detail?id=${item.course_id}`}> {/* <Link to={`/detail?id=${item.course_id}`}> */}
{item.course_title} {item.course_title}
</Link> {/* </Link> */}
</p> </p>
<p className='contact text-overflow-2'>{item.simpledescription}</p> <p className='contact text-overflow-2'>{item.simpledescription}</p>
<div className='des'> <div className='des'>
...@@ -170,7 +185,15 @@ class ToGroup extends Component { ...@@ -170,7 +185,15 @@ class ToGroup extends Component {
</p> </p>
</div> </div>
</div> </div>
return (<VList img={item.image_name} key={item.uid} id={item.course_id} info={weekInfo}></VList>) return (
<VList
img={item.image_name}
key={item.uid}
id={item.course_id}
info={weekInfo}
toDetail={this.toCourseDetail}
/>
)
}) })
} }
......
src/components/detail/index.js
...@@ -10,10 +10,10 @@ import Single from "./single" ...@@ -10,10 +10,10 @@ import Single from "./single"
import BtnStatus from "./btnstatus" import BtnStatus from "./btnstatus"
import Carouselw from "./carousel" import Carouselw from "./carousel"
import {connect} from "react-redux" import {connect} from "react-redux"
import {fetchCoursesListIfNeeded} from "./actions" import {getCourses, addCourseToCart} from "./actions"
import {getParam, http, browser} from "@/utils" import {getParam, http, browser} from "@/utils"
import {Toast} from 'antd-mobile' import {Toast} from 'antd-mobile'
import {compose} from "redux"; import {compose, bindActionCreators} from "redux";
class Detail extends Component { class Detail extends Component {
...@@ -33,7 +33,14 @@ class Detail extends Component { ...@@ -33,7 +33,14 @@ class Detail extends Component {
} }
componentDidMount() { componentDidMount() {
this.props.fetchCoursesListIfNeeded(); // 直接进入课程详情页，isIn: 1
if(getParam('isIn')) {
this.props.getCourses();
}
const { courseInfo } = this.props;
if(courseInfo.is_bargain) {
this.getBargainInfo();
}
} }
// 点击子组件试听按钮 // 点击子组件试听按钮
...@@ -248,7 +255,7 @@ class Detail extends Component { ...@@ -248,7 +255,7 @@ class Detail extends Component {
{/*分享赚钱*/} {/*分享赚钱*/}
{ {
courseInfo.is_dist && courseInfo.is_dist &&
<ShareRank/> <ShareRank courseInfo={courseInfo}/>
} }
{/*拼团*/} {/*拼团*/}
...@@ -272,8 +279,8 @@ class Detail extends Component { ...@@ -272,8 +279,8 @@ class Detail extends Component {
data={this.props.courseInfo} data={this.props.courseInfo}
user={this.props.user} user={this.props.user}
barInfo={this.state.barInfo} barInfo={this.state.barInfo}
getBargainInfo={this.getBargainInfo}
invitedFriends={this.invitedFriends} invitedFriends={this.invitedFriends}
addCourseToCart={this.props.addCourseToCart}
history={this.props.history}></BtnStatus> history={this.props.history}></BtnStatus>
{ {
...@@ -307,7 +314,18 @@ const mapStateToProps = (state) => { ...@@ -307,7 +314,18 @@ const mapStateToProps = (state) => {
} }
} }
const mapDispatchToProps = { // const mapDispatchToProps = {
fetchCoursesListIfNeeded // fetchCoursesListIfNeeded
// }
const mapDispatchToProps = (dispatch) => {
return bindActionCreators(
{
getCourses,
addCourseToCart
},
dispatch
)
} }
export default connect(mapStateToProps, mapDispatchToProps)(Detail) export default connect(mapStateToProps, mapDispatchToProps)(Detail)
\ No newline at end of file
src/components/detail/reducers.js
import {RECEIVE_COURSES_DETAIL} from './actions' import {RECEIVE_COURSES_DETAIL, ADD_COURSES_TO_CART} from './actions'
const initialState = { const initialState = {
...@@ -13,6 +13,12 @@ export default function detailInfo(state = initialState, action) { ...@@ -13,6 +13,12 @@ export default function detailInfo(state = initialState, action) {
...state, ...state,
...courseInfo ...courseInfo
} }
case ADD_COURSES_TO_CART:
const { course_info } = state;
const obj = {
course_info: Object.assign({}, course_info, {in_cart: true})
};
return Object.assign({}, state, obj);
default: default:
return state return state
} }
......
src/components/detail/shareRank/index.js
...@@ -18,6 +18,7 @@ class ShareRank extends Component { ...@@ -18,6 +18,7 @@ class ShareRank extends Component {
} }
componentDidMount() { componentDidMount() {
console.log(this.props);
this.getRankList() this.getRankList()
this.getCode() this.getCode()
} }
......
src/components/myOrders/index.js
...@@ -2,16 +2,18 @@ import React, {Component} from 'react' ...@@ -2,16 +2,18 @@ import React, {Component} from 'react'
import './index.scss' import './index.scss'
import {HeaderBar} from '../../common' import {HeaderBar} from '../../common'
import OrderList from '@/common/OrderList' import OrderList from '@/common/OrderList'
import {http, api} from "@/utils" import {http} from "@/utils"
import {Link} from 'react-router-dom' import {Link} from 'react-router-dom'
import {Modal, Toast} from 'antd-mobile' import {Modal, Toast} from 'antd-mobile'
import Loading from '@/common/Loading' import Loading from '@/common/Loading'
import InfiniteScroll from 'react-infinite-scroller' import InfiniteScroll from 'react-infinite-scroller'
import {debounce} from 'lodash' import {debounce} from 'lodash'
import {getCourses} from './../detail/actions';
import {connect} from 'react-redux';
const alert = Modal.alert const alert = Modal.alert
@connect()
class MyOrders extends Component { class MyOrders extends Component {
page = 1 page = 1
constructor(props) { constructor(props) {
...@@ -71,6 +73,14 @@ class MyOrders extends Component { ...@@ -71,6 +73,14 @@ class MyOrders extends Component {
]) ])
} }
toCourseDetail = (id) => {
const { dispatch, history } = this.props;
dispatch(getCourses(id, () => {
history.push(`/detail?id=${id}`);
return false;
}));
}
render() { render() {
...@@ -95,9 +105,10 @@ class MyOrders extends Component { ...@@ -95,9 +105,10 @@ class MyOrders extends Component {
item.course && item.course.length > 0 && item.course.map((item, index) => { item.course && item.course.length > 0 && item.course.map((item, index) => {
const Info = ( const Info = (
<div className="order-info"> <div className="order-info">
<p className='order-title text-overflow-one'> <p className='order-title text-overflow-one' onClick={() => this.toCourseDetail(item.course_id)}>
<Link {/* <Link to={`/detail?id=${item.course_id}`}> */}
to={`/detail?id=${item.course_id}`}>{item.course_title}</Link> {item.course_title}
{/* </Link> */}
</p> </p>
<p className='order-content text-overflow-2'>{item.description}</p> <p className='order-content text-overflow-2'>{item.description}</p>
<p className='order-des'> <p className='order-des'>
...@@ -110,9 +121,13 @@ class MyOrders extends Component { ...@@ -110,9 +121,13 @@ class MyOrders extends Component {
) )
return ( return (
<div className="order-wrap" key={index}> <div className="order-wrap" key={index}>
<OrderList info={Info} src={item.image_name} <OrderList
isSign={item.is_aist} info={Info}
id={item.course_id}></OrderList> src={item.image_name}
isSign={item.is_aist}
id={item.course_id}
toDetail={this.toCourseDetail}
/>
</div> </div>
) )
}) })
......
src/components/order/index.js
import React, { Component } from 'react'; import React, { Component } from 'react';
import { Flex, NavBar, List, WingBlank, Toast } from 'antd-mobile'; import { Flex, List, WingBlank, Toast } from 'antd-mobile';
import { OrderItem } from '@/common/index'; import { OrderItem } from '@/common/index';
import { Link } from 'react-router-dom'; import { Link } from 'react-router-dom';
import { http, getParam } from "@/utils"; import { http, getParam } from "@/utils";
import { throttle } from 'lodash'; import { throttle } from 'lodash';
import {HeaderBar} from '../../common'; import {HeaderBar} from '../../common';
import {connect} from 'react-redux';
import {getCourses} from './../detail/actions';
import "./order.scss" import "./order.scss"
...@@ -24,7 +26,19 @@ function OrderList(props) { ...@@ -24,7 +26,19 @@ function OrderList(props) {
} }
const Info = ( const Info = (
<div className="order-info"> <div className="order-info">
<Link to={`/detail?id=${course_id}`}><p className='order-title' style={{ overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>{course_title}</p></Link> {/* <Link to={`/detail?id=${course_id}`}> */}
<p
className='order-title'
style={{
overflow: 'hidden',
textOverflow: 'ellipsis',
whiteSpace: 'nowrap'
}}
onClick={() => props.toDetail(course_id)}
>
{course_title}
</p>
{/* </Link> */}
<p className='order-content' style={{ WebkitBoxOrient: 'vertical', WebkitLineClamp: '2', wordBreak: 'break-all', overflow: 'hidden', textOverflow: 'ellipsis', display: '-webkit-box' }}>{simpledescription}</p> <p className='order-content' style={{ WebkitBoxOrient: 'vertical', WebkitLineClamp: '2', wordBreak: 'break-all', overflow: 'hidden', textOverflow: 'ellipsis', display: '-webkit-box' }}>{simpledescription}</p>
<p className='order-des'> <p className='order-des'>
{/*// 这里根据类型判断 来显示什么价格 拼团还是砍价 还是特训营*/ } {/*// 这里根据类型判断 来显示什么价格 拼团还是砍价 还是特训营*/ }
...@@ -38,7 +52,15 @@ function OrderList(props) { ...@@ -38,7 +52,15 @@ function OrderList(props) {
); );
return ( return (
<OrderItem {...item} src={image_name} id={course_id} key={index} info={Info} isaist={props.isaist}> <OrderItem
{...item}
src={image_name}
id={course_id}
key={index}
info={Info}
isaist={props.isaist}
toDetail={props.toDetail}
>
{ {
(props.locationState && (props.locationState.type || props.locationState.simple)) ? ( (props.locationState && (props.locationState.type || props.locationState.simple)) ? (
<div className="order-prefer"> <div className="order-prefer">
...@@ -73,10 +95,12 @@ function OrderList(props) { ...@@ -73,10 +95,12 @@ function OrderList(props) {
); );
} }
@connect()
class Order extends Component { class Order extends Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.state = { this.state = {
groupPrice: '',
perfect: this.props.location.state, perfect: this.props.location.state,
user_account: 0.00, // 账户余额 user_account: 0.00, // 账户余额
total: 0.00, // 需要支付总金额 total: 0.00, // 需要支付总金额
...@@ -101,8 +125,8 @@ class Order extends Component { ...@@ -101,8 +125,8 @@ class Order extends Component {
http.post(`${API['base-api']}/pdd/m`, {course_id: getParam("id"),ischeck:this.state.useBalance}).then(res => { http.post(`${API['base-api']}/pdd/m`, {course_id: getParam("id"),ischeck:this.state.useBalance}).then(res => {
if(res.data.errno === 200) { if(res.data.errno === 200) {
sessionStorage.removeItem('orderUseCacheObj'); sessionStorage.removeItem('orderUseCacheObj');
if (res.data.data.is_free === 1) { if (res.data.data.pay_jump === 1) {
this.props.history.push(`/togroup?id=${res.data.data.order_id}`); this.props.history.push(`/togroup?id=${res.data.data.pdd_order_id}`);
return; return;
} }
this.props.history.replace(`/payorder?oid=${res.data.data.oid}`); this.props.history.replace(`/payorder?oid=${res.data.data.oid}`);
...@@ -201,9 +225,10 @@ class Order extends Component { ...@@ -201,9 +225,10 @@ class Order extends Component {
}; };
// 公共方法 存储数据 // 公共方法 存储数据
publicGetData = (res) => { publicGetData = (res) => {
let { course, total, user_account, user_info, discount } = res.data.data; let { course, total, user_account, user_info, discount } = res;
if(this.props.location.state && this.props.location.state.group === 1) { if(this.props.location.state && this.props.location.state.group === 1) {
total = this.groupPrice; console.log(this.state);
total = this.state.groupPrice;
} }
this.cacheObj = { this.cacheObj = {
perfect: user_info, perfect: user_info,
...@@ -237,66 +262,85 @@ class Order extends Component { ...@@ -237,66 +262,85 @@ class Order extends Component {
componentDidMount() { componentDidMount() {
let _this = this; let _this = this;
console.log(this.props.location.state); console.log(this.props.location.state);
console.log(0);
// type: 1,返现课程，simple: 1,正常购买 // type: 1,返现课程，simple: 1,正常购买
if(this.props.location.state && this.props.location.state.type === 1) { if(this.props.location.state && this.props.location.state.type === 1) {
http.get(`${API['base-api']}/m/order/preorder?type=1`).then((res) => { http.get(`${API['base-api']}/m/order/preorder?type=1`).then((res) => {
if(res.data.errno === 200) { if(res.data.errno === 200) {
this.publicGetData(res); this.publicGetData(res.data.data);
this.publicLocalStorage(); this.publicLocalStorage();
}else{ }else{
Toast.info(res.data.msg, 2); Toast.info(res.data.msg, 2);
} }
}) })
} else if (this.props.location.state && (this.props.location.state.simple === 1 || this.props.location.state.bargain === 1)) { } else if (this.props.location.state && (this.props.location.state.simple === 1 || this.props.location.state.bargain === 1)) {
console.log(1);
// 普通课程立即报名 不带 type = 1 // 普通课程立即报名 不带 type = 1
http.get(`${API['base-api']}/m/order/preorder`).then(res => { http.get(`${API['base-api']}/m/order/preorder`).then(res => {
if(res.data.errno === 200) { if(res.data.errno === 200) {
this.publicGetData(res); this.publicGetData(res.data.data);
this.publicLocalStorage(); this.publicLocalStorage();
}else{ }else{
Toast.info(res.data.msg, 2); Toast.info(res.data.msg, 2);
} }
}); });
} else if (this.props.location.state && this.props.location.state.group === 1){ } else if (this.props.location.state && this.props.location.state.group === 1){
console.log(2);
// 获取一键开团的课程 // 获取一键开团的课程
Promise.all([http.get(`${API.home}/m/del_cart_order/${getParam('id')}`),http.get(`${API['base-api']}/m/order/preorder`), http.get(`${API.home}/m/course/detail/${getParam('id')}`)]).then(resList => { Promise.all([http.get(`${API.home}/m/course/detail/${getParam('id')}`),http.get(`${API['base-api']}/m/order/preorder`)]).then(resList => {
console.log(resList); let courseInfo = resList[0],
let courseInfo = resList[1], orderInfo = resList[1];
orderInfo = resList[2];
console.log(courseInfo.data); console.log(courseInfo.data);
console.log(orderInfo.data); console.log(orderInfo.data);
if(courseInfo.data.errno === 200) { let newData = {};
if(orderInfo.data.errno === 200) {
newData = Object.assign({}, orderInfo.data.data, {course: []});
}else{ }else{
Toast.info(courseInfo.data.msg, 2); Toast.info(courseInfo.data.msg, 2);
return; return;
} }
if(orderInfo.data.code === 200) { if(courseInfo.data.code === 200) {
newData.course.push(courseInfo.data.data.course_info);
this.setState({
groupPrice: courseInfo.data.data.course_info.pdd_group_info.price
})
}else{ }else{
Toast.info(courseInfo.data.msg, 2); Toast.info(courseInfo.data.msg, 2);
return; return;
} }
this.groupPrice = orderInfo.data.data.course_info.pdd_group_info.price; // this.groupPrice = orderInfo.data.data.course_info.pdd_group_info.price;
if(courseInfo.data.data.course.length === 0) { // if(courseInfo.data.data.course.length === 0) {
courseInfo.data.data.course.push(orderInfo.data.data.course_info) // courseInfo.data.data.course.push(orderInfo.data.data.course_info)
} // }
this.publicGetData(courseInfo); this.publicGetData(newData);
this.publicLocalStorage(); this.publicLocalStorage();
}); });
} } else {
else{ // if(getParam('id')) {
http.get(`${API['base-api']}/m/order/preorder`).then((res) => { // Promise.all([http.get(`${API.home}/m/del_cart_order/${getParam('id')}`), http.get(`${API['base-api']}/m/order/preorder`)]).then(res => {
console.log('为了验证什么条件下会走这段代码'); // console.log(res);
if (res.data.errno !== 200) { // let preorder = res[1],
Toast.info(res.data.msg, 2); // orderList = preorder.data.data.course;
return; // if(preorder.data.errno !== 200) {
} // Toast.info(preorder.data.msg, 2);
// return;
// }
this.publicGetData(res); // this.publicGetData(preorder);
this.publicLocalStorage(); // this.publicLocalStorage();
}) // })
// }else{
http.get(`${API['base-api']}/m/order/preorder`).then((res) => {
console.log('为了验证什么条件下会走这段代码');
if (res.data.errno !== 200) {
Toast.info(res.data.msg, 2);
return;
}
this.publicGetData(res.data.data);
this.publicLocalStorage();
})
// }
} }
// else { // else {
// if(getParam('id')) { // if(getParam('id')) {
...@@ -326,6 +370,14 @@ class Order extends Component { ...@@ -326,6 +370,14 @@ class Order extends Component {
// } // }
// } // }
}; };
toCourseDetail = (id) => {
const { dispatch, history } = this.props;
dispatch(getCourses(id, () => {
history.push(`/detail?id=${id}`)
}));
}
render() { render() {
const { const {
perfect, perfect,
...@@ -336,6 +388,7 @@ class Order extends Component { ...@@ -336,6 +388,7 @@ class Order extends Component {
useBalance, useBalance,
info, info,
offset, offset,
groupPrice
} = this.state; } = this.state;
return ( return (
...@@ -386,7 +439,14 @@ class Order extends Component { ...@@ -386,7 +439,14 @@ class Order extends Component {
</div> </div>
} }
<div className="order-list"> <div className="order-list">
<OrderList list={orderList} compute={this.computedMoney} courseId={getParam('id')} locationState={this.props.location.state} groupPrice={this.groupPrice}/> <OrderList
list={orderList}
compute={this.computedMoney}
courseId={getParam('id')}
locationState={this.props.location.state}
groupPrice={groupPrice}
toDetail={this.toCourseDetail}
/>
</div> </div>
<div className="order-balance"> <div className="order-balance">
<List> <List>
......
src/components/preferential/index.js
...@@ -6,7 +6,11 @@ import HeaderSearch from '../../common/HeaderSearch/index' ...@@ -6,7 +6,11 @@ import HeaderSearch from '../../common/HeaderSearch/index'
import {http} from "@/utils" import {http} from "@/utils"
import {Link} from 'react-router-dom' import {Link} from 'react-router-dom'
import Loading from '@/common/Loading' import Loading from '@/common/Loading'
import {bindActionCreators} from 'redux';
import {connect} from 'react-redux';
import {getCourses} from './../detail/actions';
@connect()
class Preferential extends Component { class Preferential extends Component {
constructor(props) { constructor(props) {
super(props) super(props)
...@@ -74,6 +78,12 @@ class Preferential extends Component { ...@@ -74,6 +78,12 @@ class Preferential extends Component {
} }
} }
toCourseDetail = (id) => {
const { dispatch, history } = this.props;
dispatch(getCourses(id, () => {
history.push(`/detail?id=${id}`)
}));
}
render() { render() {
const tabs = [ const tabs = [
...@@ -98,10 +108,10 @@ class Preferential extends Component { ...@@ -98,10 +108,10 @@ class Preferential extends Component {
{this.state.dataList.map((item, index) => { {this.state.dataList.map((item, index) => {
const Info = ( const Info = (
<div className="info"> <div className="info">
<p className='title'> <p className='title' onClick={() => this.toCourseDetail(item.course_id)}>
<Link to={`/detail?id=${item.course_id}`}> {/* <Link to={`/detail?id=${item.course_id}`}> */}
{item.course_title} {item.course_title}
</Link> {/* </Link> */}
</p> </p>
<p className='contact text-overflow-2'>{item.course_desc}</p> <p className='contact text-overflow-2'>{item.course_desc}</p>
<div className='des'> <div className='des'>
...@@ -134,9 +144,14 @@ class Preferential extends Component { ...@@ -134,9 +144,14 @@ class Preferential extends Component {
</div> </div>
) )
return ( return (
<VList key={index} img={item.image_name} <VList
id={item.course_id} status={status} key={index}
info={Info}></VList> img={item.image_name}
id={item.course_id}
status={status}
info={Info}
toDetail={this.toCourseDetail}
/>
) )
})} })}
</ul> </ul>
...@@ -152,4 +167,4 @@ class Preferential extends Component { ...@@ -152,4 +167,4 @@ class Preferential extends Component {
} }
export default Preferential export default Preferential;
src/components/purchased/index.js
...@@ -5,6 +5,7 @@ import { http } from "@/utils"; ...@@ -5,6 +5,7 @@ import { http } from "@/utils";
import {Link} from 'react-router-dom' import {Link} from 'react-router-dom'
import {Toast} from 'antd-mobile' import {Toast} from 'antd-mobile'
import {connect} from "react-redux" import {connect} from "react-redux"
import {getCourses} from './../detail/actions';
import Loading from '@/common/Loading' import Loading from '@/common/Loading'
class Purchased extends Component { class Purchased extends Component {
...@@ -34,6 +35,13 @@ class Purchased extends Component { ...@@ -34,6 +35,13 @@ class Purchased extends Component {
}) })
} }
toCourseDetail = (id) => {
const { dispatch, history } = this.props;
dispatch(getCourses(id, () => {
history.push(`/detail?id=${id}`)
}));
}
render() { render() {
const {user} = this.props const {user} = this.props
...@@ -50,10 +58,10 @@ class Purchased extends Component { ...@@ -50,10 +58,10 @@ class Purchased extends Component {
this.state.data.map((item, index) => { this.state.data.map((item, index) => {
const Info = ( const Info = (
<div className="info"> <div className="info">
<p className='title'> <p className='title' onClick={() => this.toCourseDetail(item.course_id)}>
<Link to={`/detail?id=${item.course_id}`}> {/* <Link to={`/detail?id=${item.course_id}`}> */}
{item.course_title} {item.course_title}
</Link> {/* </Link> */}
</p> </p>
<p className='contact text-overflow-2'>{item.simpledescription}</p> <p className='contact text-overflow-2'>{item.simpledescription}</p>
{ {
...@@ -67,11 +75,13 @@ class Purchased extends Component { ...@@ -67,11 +75,13 @@ class Purchased extends Component {
item.is_aist && <span className='status'>返现</span> item.is_aist && <span className='status'>返现</span>
) )
return ( return (
<VList key={index} <VList
img={item.image_name} key={index}
id={item.course_id} img={item.image_name}
info={Info} id={item.course_id}
status={status} info={Info}
status={status}
toDetail={this.toCourseDetail}
/> />
) )
}) })
......
src/components/scholarship/CategoryItem/CategoryItem.js
...@@ -8,12 +8,12 @@ export default class CategoryItem extends Component { ...@@ -8,12 +8,12 @@ export default class CategoryItem extends Component {
super(props); super(props);
} }
render() { render() {
const {course_title, price1, price0, first_level_tip, image_name, upgrade, upgradeImg, course_id, share} = this.props; const {course_title, price1, price0, first_level_tip, image_name, upgrade, upgradeImg, course_id, share, toDetail} = this.props;
return ( return (
<WingBlank> <WingBlank>
<div className={'scholarship-category'}> <div className={'scholarship-category'}>
<Link to={`/detail?id=${course_id}`} > {/* <Link to={`/detail?id=${course_id}`} > */}
<div className={'imageContainer'}> <div className={'imageContainer'} onClick={() => toDetail(course_id)}>
<img className={'image'} src={image_name}></img> <img className={'image'} src={image_name}></img>
{ {
upgrade ? ( upgrade ? (
...@@ -21,10 +21,17 @@ export default class CategoryItem extends Component { ...@@ -21,10 +21,17 @@ export default class CategoryItem extends Component {
) : (null) ) : (null)
} }
</div> </div>
</Link> {/* </Link> */}
<div className={'content'}> <div className={'content'}>
<Flex direction='column' justify='around' align='start' style={{height: '90px'}}> <Flex direction='column' justify='around' align='start' style={{height: '90px'}}>
<Link to={`/detail?id=${course_id}`} ><p className={'text-overflow-one'}>{course_title}</p></Link> {/* <Link to={`/detail?id=${course_id}`} > */}
<p
className={'text-overflow-one'}
onClick={() => toDetail(course_id)}
>
{course_title}
</p>
{/* </Link> */}
<p><span className={'priceNow'}>{`￥${price1}`}</span><span className={'pricePrimary'}>{`￥${price0}`}</span></p> <p><span className={'priceNow'}>{`￥${price1}`}</span><span className={'pricePrimary'}>{`￥${price0}`}</span></p>
<div className={'shareMoney'} onClick={()=>{share(course_id, first_level_tip)}}>{`分享赚${first_level_tip}元`}</div> <div className={'shareMoney'} onClick={()=>{share(course_id, first_level_tip)}}>{`分享赚${first_level_tip}元`}</div>
</Flex> </Flex>
......
src/components/scholarship/index.js
import React, { Component } from 'react'; import React, { Component } from 'react';
import { Tabs, WhiteSpace, List, Flex, WingBlank, Modal, ListView, Toast } from 'antd-mobile'; import { Tabs, WhiteSpace, List, Flex, WingBlank, Modal, ListView, Toast } from 'antd-mobile';
import './scholarship.scss'; import './scholarship.scss';
import { is_weixin, http, api } from "@/utils"; import { is_weixin, http } from "@/utils";
import CategoryItem from './CategoryItem/CategoryItem.js'; import CategoryItem from './CategoryItem/CategoryItem.js';
import SortItem from './SortItem/SortItem.js'; import SortItem from './SortItem/SortItem.js';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import OpenApp from '@/common/CallApp'; import OpenApp from '@/common/CallApp';
import {getCourses} from './../detail/actions';
const Item = List.Item; const Item = List.Item;
@connect(state => ({
user: state.user
}))
class _Scholarship extends Component { class _Scholarship extends Component {
constructor(props) { constructor(props) {
super(props); super(props);
...@@ -156,12 +160,27 @@ class _Scholarship extends Component { ...@@ -156,12 +160,27 @@ class _Scholarship extends Component {
}); });
this.onEndReached(); this.onEndReached();
} }
toCourseDetail = (id) => {
const { dispatch, history } = this.props;
dispatch(getCourses(id, () => {
history.push(`/detail?id=${id}`)
}));
}
render() { render() {
const row = ( const row = (
rowData, rowData,
rowID rowID
) => { ) => {
return <CategoryItem {...rowData} key={rowID} share={this.shareCategory}/>; return (
<CategoryItem
{...rowData}
key={rowID}
share={this.shareCategory}
toDetail={this.toCourseDetail}
/>
);
}; };
const row1 = ( const row1 = (
...@@ -396,19 +415,21 @@ class _Scholarship extends Component { ...@@ -396,19 +415,21 @@ class _Scholarship extends Component {
) )
} }
} }
const mapStateToProps = (state) => { // const mapStateToProps = (state) => {
return { // return {
user: { // user: {
...state.user // ...state.user
}, // },
}; // };
}; // };
// const mapDispatchToProps = (dispatch) => {
// return {};
// };
const mapDispatchToProps = (dispatch) => { // export const Scholarship = connect(
return {}; // mapStateToProps,
}; // mapDispatchToProps
// )(_Scholarship);
export const Scholarship = connect( export default _Scholarship;
mapStateToProps,
mapDispatchToProps
)(_Scholarship);
src/components/search/recommendation/index.js
import React, { Component } from "react"; import React, { Component } from "react";
import {connect} from 'react-redux';
import './recommendation.scss' import './recommendation.scss'
import { Course } from "@/common"; import { Course } from "@/common";
import { api, http } from "@/utils"; import { http } from "@/utils";
import { Toast } from 'antd-mobile' import { Toast } from 'antd-mobile'
import {withRouter} from 'react-router-dom' import {withRouter} from 'react-router-dom'
import {getCourses} from './../../detail/actions';
@connect()
class Recommendation extends Component { class Recommendation extends Component {
state = { state = {
...@@ -26,11 +29,16 @@ class Recommendation extends Component { ...@@ -26,11 +29,16 @@ class Recommendation extends Component {
} }
handleClick = (id) => { // handleClick = (id) => {
this.props.history.push(`/detail?id=${id}`) // this.props.history.push(`/detail?id=${id}`)
} // }
toCourseDetail = (id) => {
const { dispatch, history } = this.props;
dispatch(getCourses(id, () => {
history.push(`/detail?id=${id}`)
}));
}
render() { render() {
const {courses} = this.state const {courses} = this.state
...@@ -40,12 +48,11 @@ class Recommendation extends Component { ...@@ -40,12 +48,11 @@ class Recommendation extends Component {
<div className="courses"> <div className="courses">
{ {
courses.length > 0 && courses.length > 0 &&
courses.map((item, index) => { courses.map((item) => {
const Bottom = ( const Bottom = (
<div className='bottom'> <div className='bottom'>
<span className='price'>¥{item['price1']}</span> <span className='price'>{item['price1']}</span>
<span className='old-price'>¥{item['price0']}</span> <span className='old-price'>{item['price0']}</span>
</div> </div>
) )
return ( return (
...@@ -56,7 +63,7 @@ class Recommendation extends Component { ...@@ -56,7 +63,7 @@ class Recommendation extends Component {
img={item['image_name']} img={item['image_name']}
title={item['course_title']} title={item['course_title']}
bottom={Bottom} bottom={Bottom}
handleClick={this.handleClick} toDetail={this.toCourseDetail}
/> />
) )
}) })
......
src/components/search/search-result.js
import React, { PureComponent } from 'react'; import React, { PureComponent } from 'react';
import {connect} from 'react-redux';
import SearchHeader from './searchHead' import SearchHeader from './searchHead'
import VList from '@/common/VList' import VList from '@/common/VList'
import { http, getParam } from '@/utils' import { http, getParam } from '@/utils'
import './search-result.scss' import './search-result.scss'
import Recommendation from './recommendation' import Recommendation from './recommendation'
import {getCourses} from './../detail/actions';
const Bottom = ({item}) => { const Bottom = ({item}) => {
return ( return (
...@@ -14,6 +16,7 @@ const Bottom = ({item}) => { ...@@ -14,6 +16,7 @@ const Bottom = ({item}) => {
) )
} }
@connect()
class SearchResult extends PureComponent { class SearchResult extends PureComponent {
state = { state = {
...@@ -52,6 +55,12 @@ class SearchResult extends PureComponent { ...@@ -52,6 +55,12 @@ class SearchResult extends PureComponent {
this.setState({value}) this.setState({value})
} }
toCourseDetail = (id) => {
const { dispatch, history } = this.props;
dispatch(getCourses(id, () => {
history.push(`/detail?id=${id}`)
}));
}
render() { render() {
const {courseList} = this.state const {courseList} = this.state
...@@ -90,12 +99,13 @@ class SearchResult extends PureComponent { ...@@ -90,12 +99,13 @@ class SearchResult extends PureComponent {
: null : null
) )
return ( return (
<VList img={item.image_name} <VList
handleClick={this.handleClick} img={item.image_name}
key={item.course_id} toDetail={this.toCourseDetail}
info={Info} key={item.course_id}
id={item['course_id']} info={Info}
status={status} id={item['course_id']}
status={status}
/> />
) )
}) })
...@@ -104,9 +114,8 @@ class SearchResult extends PureComponent { ...@@ -104,9 +114,8 @@ class SearchResult extends PureComponent {
: <div className="empty"> : <div className="empty">
抱歉！没有搜到相关内容 抱歉！没有搜到相关内容
</div> </div>
} }
<Recommendation/> <Recommendation />
</div> </div>
); );
} }
......
src/components/shopCart/cartItem.js
...@@ -22,8 +22,10 @@ class CartItem extends Component { ...@@ -22,8 +22,10 @@ class CartItem extends Component {
let item = this.props.item let item = this.props.item
const Info = ( const Info = (
<div className="order-info"> <div className="order-info">
<p className='order-title text-overflow-one'> <p className='order-title text-overflow-one' onClick={()=>this.props.toDetail(item.course_id)}>
<Link to={`/detail?id=${item.course_id}`}>{item.course_title}</Link> {/* <Link to={`/detail?id=${item.course_id}`}> */}
{item.course_title}
{/* </Link> */}
</p> </p>
<p className='order-content text-overflow-2'>{item.simpledescription}</p> <p className='order-content text-overflow-2'>{item.simpledescription}</p>
<p className='order-des'> <p className='order-des'>
...@@ -42,7 +44,12 @@ class CartItem extends Component { ...@@ -42,7 +44,12 @@ class CartItem extends Component {
</div> </div>
<div className="card-wrap"> <div className="card-wrap">
<OrderList info={Info} src={item.image_name} id={item.course_id}></OrderList> <OrderList
info={Info}
src={item.image_name}
id={item.course_id}
toDetail={this.props.toDetail}
></OrderList>
</div> </div>
</div> </div>
......
src/components/shopCart/cartList.js
import React, {Component} from 'react' import React, {Component} from 'react'
import {Link} from 'react-router-dom' import {Link} from 'react-router-dom'
import CartItem from './cartItem' import CartItem from './cartItem'
class cartList extends Component { class cartList extends Component {
render() { render() {
return ( return (
...@@ -19,7 +20,10 @@ class cartList extends Component { ...@@ -19,7 +20,10 @@ class cartList extends Component {
checkChange={(id, val) => { checkChange={(id, val) => {
this.props.checkChange(id, val) this.props.checkChange(id, val)
}} }}
key={index} item={item}/> key={index}
item={item}
toDetail={this.props.toDetail}
/>
) )
}) })
: <div className="cart-tip"> : <div className="cart-tip">
......
src/components/shopCart/index.js
...@@ -6,7 +6,8 @@ import Loading from '@/common/Loading' ...@@ -6,7 +6,8 @@ import Loading from '@/common/Loading'
import ShopCart from './cartList.js' import ShopCart from './cartList.js'
import './card.scss' import './card.scss'
import classnames from 'classnames' import classnames from 'classnames'
import {api, http} from "@/utils"; import {http} from "@/utils";
import {getCourses} from './../detail/actions';
const alert = Modal.alert; const alert = Modal.alert;
...@@ -164,6 +165,14 @@ class Cart extends Component { ...@@ -164,6 +165,14 @@ class Cart extends Component {
} }
toCourseDetail = (id) => {
console.log(id);
const { dispatch, history } = this.props;
dispatch(getCourses(id, () => {
history.push(`/detail?id=${id}`)
}));
}
render() { render() {
return ( return (
...@@ -172,7 +181,11 @@ class Cart extends Component { ...@@ -172,7 +181,11 @@ class Cart extends Component {
<Loading isLoading={this.state.isLoading}> <Loading isLoading={this.state.isLoading}>
<div className="cart-body"> <div className="cart-body">
<ShopCart checkChange={this.checkChange.bind(this)} data={this.state.data}/> <ShopCart
checkChange={this.checkChange.bind(this)}
data={this.state.data}
toDetail={this.toCourseDetail}
/>
<div className="cart-footer"> <div className="cart-footer">
<div className="cart-label"> <div className="cart-label">
......
src/components/study/myCourses/actions.js
...@@ -12,6 +12,7 @@ const PAGE_INTERVAL = 1 ...@@ -12,6 +12,7 @@ const PAGE_INTERVAL = 1
export const NUM_INTERVAL = 10 export const NUM_INTERVAL = 10
export const fetchCoursesListIfNeeded = () => (dispatch, getState) => { export const fetchCoursesListIfNeeded = () => (dispatch, getState) => {
const myCourses = getState().myCourses const myCourses = getState().myCourses
console.log(myCourses);
const {switchTab, page, noMore} = myCourses const {switchTab, page, noMore} = myCourses
if (!switchTab && !noMore) { if (!switchTab && !noMore) {
dispatch(getMyCourses({ dispatch(getMyCourses({
...@@ -26,11 +27,11 @@ export const getMyCourses = payload => dispatch => { ...@@ -26,11 +27,11 @@ export const getMyCourses = payload => dispatch => {
return http.get(`${API.home}/m/my_course/${payload.page}/${payload.num}`) return http.get(`${API.home}/m/my_course/${payload.page}/${payload.num}`)
.then(res => { .then(res => {
const {data, code, msg} = res.data const {data, code, msg} = res.data
if (data.length === 0) { if (code == 200 && data.length === 0) {
dispatch(nomoreCourse()) dispatch(nomoreCourse())
return return
} }
if (data.length % 10 !== 0) { if (code == 200 && data.length % 10 !== 0) {
dispatch(nomoreCourse()) dispatch(nomoreCourse())
} }
dispatch(receiveMyCourses({ dispatch(receiveMyCourses({
...@@ -50,8 +51,9 @@ export const switchTab = payload => ({ ...@@ -50,8 +51,9 @@ export const switchTab = payload => ({
}) })
export const NOMORE_COURSE = 'NOMORE_COURSES' export const NOMORE_COURSE = 'NOMORE_COURSES'
export const nomoreCourse = () => ({ export const nomoreCourse = (payload) => ({
type: NOMORE_COURSE type: NOMORE_COURSE,
payload
}) })
export const START_FETCHING_COURSES = 'START_FETCHING_COURSES' export const START_FETCHING_COURSES = 'START_FETCHING_COURSES'
......
src/components/study/myCourses/index.js
...@@ -99,15 +99,15 @@ class MyCourses extends PureComponent { ...@@ -99,15 +99,15 @@ class MyCourses extends PureComponent {
}, 200) }, 200)
render() { render() {
let list = this.props.courseList let {courseList, user} = this.props
return <Loading isLoading={this.props.isLoading}> return <Loading isLoading={this.props.isLoading}>
{ {
list && list.length !== 0 courseList && courseList.length !== 0
? ?
<> <>
<div className="my-course-uid"> <div className="my-course-uid">
{`加群请备注您的学号：${this.props.user.data.uid}`} {`加群请备注您的学号：${!user.hasError && this.props.user.data.uid}`}
</div> </div>
<InfiniteScroll <InfiniteScroll
pageStart={0} pageStart={0}
...@@ -117,7 +117,7 @@ class MyCourses extends PureComponent { ...@@ -117,7 +117,7 @@ class MyCourses extends PureComponent {
> >
<ul ref={el => this.list = el}> <ul ref={el => this.list = el}>
{ {
list.map((item, index) => { courseList.map((item, index) => {
const Info = ( const Info = (
<div className="info"> <div className="info">
...@@ -159,7 +159,7 @@ class MyCourses extends PureComponent { ...@@ -159,7 +159,7 @@ class MyCourses extends PureComponent {
</ul> </ul>
</InfiniteScroll> </InfiniteScroll>
{ {
list.length % 10 !== 0 ? courseList.length % 10 !== 0 ?
<AddCourse addCourseClick={this.addCourseClick}/> <AddCourse addCourseClick={this.addCourseClick}/>
: null : null
} }
......
src/components/study/myCourses/reducers.js
...@@ -4,6 +4,7 @@ import { ...@@ -4,6 +4,7 @@ import {
NOMORE_COURSE, NOMORE_COURSE,
START_FETCHING_COURSES START_FETCHING_COURSES
} from './actions' } from './actions'
import { SET_CURRENT_USER } from '@/store/userAction'
const initialState = { const initialState = {
switchTab: false, switchTab: false,
...@@ -17,20 +18,23 @@ const initialState = { ...@@ -17,20 +18,23 @@ const initialState = {
export default function myCourses(state = initialState, action) { export default function myCourses(state = initialState, action) {
switch (action.type) { const { type, payload=null } = action;
switch (type) {
case RECEIVE_MY_COURSES: case RECEIVE_MY_COURSES:
let {courseList, ...rest} = action.payload let {courseList, ...rest} = payload
return { return {
...state, ...rest, ...state, ...rest,
courseList: Object.keys(courseList).length === 0 ? state.courseList : state.courseList.concat(courseList), courseList: Object.keys(courseList).length === 0 ? state.courseList : state.courseList.concat(courseList),
isLoading: false isLoading: false
} }
case START_FETCHING_COURSES: case START_FETCHING_COURSES:
return {...state, ...action.payload} return {...state, ...payload}
case SWITCH_TAB: case SWITCH_TAB:
return {...state, switchTab: action.payload} return {...state, switchTab: payload}
case NOMORE_COURSE: case NOMORE_COURSE:
return {...state, noMore: true} return {...state, noMore: true}
case SET_CURRENT_USER:
return payload.hasError ? initialState : {...state, page: 0}
default: default:
return state return state
} }
......
src/components/video/index.js
import React, {Component} from 'react' import React, {Component} from 'react'
import HeaderBar from '@/common/HeaderBar' import HeaderBar from '@/common/HeaderBar'
import './video.scss' import './video.scss'
import {NavLink, Route, Redirect, Switch} from 'react-router-dom' import { NavLink, Route, Redirect, Switch } from 'react-router-dom'
import {http, api, getParam} from '@/utils' import { http, getParam } from '@/utils'
import Recommendation from './recommendation' import Recommendation from './recommendation'
import VideoCatalog from './video-catalog' import VideoCatalog from './video-catalog'
import DatumCatalog from './datum-catalog' import DatumCatalog from './datum-catalog'
......
src/components/video/recommendation/index.js
import React, { PureComponent } from 'react'; import React, { PureComponent } from 'react';
import {connect} from 'react-redux';
import {getCourses} from './../../detail/actions';
import './recommendation.scss' import './recommendation.scss'
import { http } from '@/utils' import { http } from '@/utils'
import { Toast } from "antd-mobile"; import { Toast } from "antd-mobile";
import VList from '@/common/v-list-base'; import VList from '@/common/v-list-base';
const Bottom = ({item}) => { const Bottom = ({item}) => {
return ( return (
<div className='bottom'> <div className='bottom'>
...@@ -15,8 +16,7 @@ const Bottom = ({item}) => { ...@@ -15,8 +16,7 @@ const Bottom = ({item}) => {
) )
} }
@connect()
class Recommendation extends PureComponent { class Recommendation extends PureComponent {
state = { state = {
num: 10, num: 10,
...@@ -24,7 +24,6 @@ class Recommendation extends PureComponent { ...@@ -24,7 +24,6 @@ class Recommendation extends PureComponent {
courseId: null courseId: null
} }
componentDidMount() { componentDidMount() {
this.getRecommendation() this.getRecommendation()
} }
...@@ -45,9 +44,11 @@ class Recommendation extends PureComponent { ...@@ -45,9 +44,11 @@ class Recommendation extends PureComponent {
}) })
} }
toCourseDetail = (id) => {
handleClick = id => { const { dispatch, history } = this.props;
this.props.history.push(`/detail?id=${id}`) dispatch(getCourses(id, () => {
history.push(`/detail?id=${id}`)
}));
} }
render() { render() {
...@@ -73,7 +74,7 @@ class Recommendation extends PureComponent { ...@@ -73,7 +74,7 @@ class Recommendation extends PureComponent {
<VList <VList
key={item.course_id} key={item.course_id}
img={item.image_name} img={item.image_name}
handleClick={this.handleClick} handleClick={this.toCourseDetail}
info={Info} info={Info}
id={item.course_id} id={item.course_id}
/> />
......
src/index.js
...@@ -7,6 +7,18 @@ import thunk from 'redux-thunk' ...@@ -7,6 +7,18 @@ import thunk from 'redux-thunk'
import logger from 'redux-logger' import logger from 'redux-logger'
import rootReducers from './store' import rootReducers from './store'
import App from './App' import App from './App'
import {persistStore, persistReducer} from 'redux-persist';
import storage from 'redux-persist/lib/storage';
import autoMergeLevel2 from 'redux-persist/lib/stateReconciler/autoMergeLevel2';
import {PersistGate} from 'redux-persist/lib/integration/react';
const persistConfig = {
key: 'root',
storage,
stateReconciler: autoMergeLevel2 // 查看 'Merge Process' 部分的具体情况
};
const myPersistReducer = persistReducer(persistConfig, rootReducers)
const reduxDevToolOptions = process.env.REACT_APP_BUILD_ENV === 'production' ? {} : { trace: true, traceLimit: 25 } const reduxDevToolOptions = process.env.REACT_APP_BUILD_ENV === 'production' ? {} : { trace: true, traceLimit: 25 }
...@@ -15,17 +27,20 @@ const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ && ...@@ -15,17 +27,20 @@ const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ &&
window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__(reduxDevToolOptions) || compose; window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__(reduxDevToolOptions) || compose;
const store = createStore( const store = createStore(
rootReducers, myPersistReducer,
composeEnhancers( composeEnhancers(
applyMiddleware(thunk, logger) applyMiddleware(thunk, logger)
) )
) )
const persistor = persistStore(store)
ReactDOM.render( ReactDOM.render(
<Provider store={store}> <Provider store={store}>
<PersistGate loading={null} persistor={persistor}>
<Router> <Router>
<App/> <App/>
</Router> </Router>
</PersistGate>
</Provider>, </Provider>,
document.getElementById('root')); document.getElementById('root'));
\ No newline at end of file
src/router/router-config.js
...@@ -4,7 +4,7 @@ import loadable from '@loadable/component' ...@@ -4,7 +4,7 @@ import loadable from '@loadable/component'
import Index from '@/components/Index'; import Index from '@/components/Index';
import My from '@/components/my'; import My from '@/components/my';
import Passport from '@/components/passport'; import Passport from '@/components/passport';
import { Scholarship } from '@/components/scholarship/index'; import Scholarship from '@/components/scholarship';
const Coupons = loadable(() => import(/* webpackChunkName: 'coupons'*/ '@/components/coupons')) const Coupons = loadable(() => import(/* webpackChunkName: 'coupons'*/ '@/components/coupons'))
const Study = loadable(() => import(/* webpackChunkName: 'study'*/'@/components/study')) const Study = loadable(() => import(/* webpackChunkName: 'study'*/'@/components/study'))
......
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