Skip to content

M
mr-julyedu
Commit e2ecada9 by wangshuo
Options

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

parents 6bac8218 904554c4
Showing with 371 additions and 119 deletions
src/assets/css/variable.scss
......@@ -4,7 +4,7 @@
$active: #09f;
$white: #fff;
$black: #000;
$red: #f21;
$red: #FF2121;
$redprice: #ff3131;
$color_333: #333;
$color_555: #555;
......@@ -72,6 +72,7 @@ $bg_F4AAA7: #F4AAA7;
$bg_E02E24: #E02E24;
$bg_007FD0: #007FD0;
$bg_FF0000: #FF0000;
$bg_FFF4CE: #FFF4CE;
/*
......
src/common/Course/index.js
import React from 'react';
import './course.scss'
import {Link} from "react-router-dom";
const Course = (props) => {
return (
<li className='course-item'>
{props.top}
<a href="/#">
<Link to={`/detail?id=${props.id}`}>
<img src={props.img} alt=""/>
<p className="course-title text-overflow-2">{props.title}</p>
</a>
</Link>
{props.bottom}
</li>
);
......
src/common/VList/index.js
import React from 'react';
import './index.scss'
import {Link} from 'react-router-dom'
const VList = (props) => {
return (
......@@ -7,7 +8,9 @@ const VList = (props) => {
<div className="content">
<div className="cover">
{props.status}
<img src={props.img} alt=""/>
<Link to={`/detail?id=${props.id}`}>
<img src={props.img} alt=""/>
</Link>
</div>
{props.info}
</div>
......
src/components/Index/index.js
......@@ -8,6 +8,7 @@ import LazyLoad from 'react-lazy-load'
import {http, api} from '@/utils'
import LiveRoom from './liveRoom'
import {Link} from "react-router-dom";
import {Toast} from 'antd-mobile'
const animateTypes = Swiper.animateTypes
......@@ -26,27 +27,27 @@ class Index extends Component {
{
'src': require('./image/freeclass_icon.png'),
'name': '公开课',
'href':''
'href': '/study/free-course'
},
{
'src': require('./image/jingpin_icon.png'),
'name': '精品特惠',
'href':'/preferential'
'href': '/preferential'
},
{
'src': require('./image/zjxj_icon.png'),
'name': '赚奖学金',
'href':''
'href': '/scholarship'
},
{
'src': require('./image/mryt_icon.png'),
'name': '每日一题',
'href':''
'href': '/examination'
},
{
'src': require('./image/qynx_icon.png'),
'name': '企业内训',
'href':''
'href': 'http://m-active.julyedu.com'
}
]
}
......@@ -61,7 +62,10 @@ class Index extends Component {
lives: res.data.data.lives,
modules: res.data.data.modules
})
} else {
Toast.info(res.data.msg, 2)
}
})
}
......@@ -168,6 +172,7 @@ function TopSwiper({bannerList}) {
</Swiper>
)
}
function CourseList({modules}) {
let isOdd = modules.list.length % 2 === 0
let filterList = isOdd ? modules.list : modules.list.slice(1)
......@@ -176,11 +181,11 @@ function CourseList({modules}) {
<h2 className="title">{modules.name}</h2>
{
modules.show_more === 1 &&
<a className="more" href="/#">更多 ></a>
<a className="more" href='/classify'>更多 ></a>
}
{
modules.show_more === 2 &&
<a className="more" href="/#">更多 ></a>
<a className="more" href={modules.more_page}>更多 ></a>
}
<LazyLoad offset={50}>
<ul className='course-detail'>
......@@ -215,7 +220,8 @@ function CourseList({modules}) {
</div>
)
return (
<Course key={index} top={top} data={item} bottom={bottom} img={item.course_img_small} title={item.course_title}></Course>
<Course key={index} top={top} data={item} bottom={bottom} img={item.course_img_small}
title={item.course_title} id={item.course_id}></Course>
)
})
}
......
src/components/classify/courselist.js
......@@ -4,6 +4,8 @@ import {Tabs, WhiteSpace} from 'antd-mobile';
import './courselist.scss';
import HeaderSearch from '../../common/HeaderSearch/index'
import {http, api, getParam} from "@/utils";
import {Toast} from 'antd-mobile'
import {Link} from 'react-router-dom'
class Classify extends Component {
......@@ -47,7 +49,10 @@ class Classify extends Component {
allClass: arr3
})
}
} else {
Toast.info(res.data.msg, 2)
}
})
.catch(err => {
console.log(err)
......@@ -127,15 +132,19 @@ class Classify extends Component {
{this.state.data && this.state.data.length > 0 && this.state.data.map((item, index) => {
const Info = (
<div className="info">
<p className='title'>{item.course_title}</p>
<p className='title'>
<Link to={`/detail?id=${item.course_id}`}>
{item.course_title}
</Link>
</p>
<p className='contact text-overflow-2'>{item.desc}</p>
<div className='des'>
{item.is_buy === 0 && <p className="course-price">
{!item.is_buy && <p className="course-price">
<span className="new">¥{item.price0}</span>
<span className="old">¥{item.price1}</span>
</p>
}
{item.is_buy === 1 &&
{item.is_buy &&
<a href="/#" className="isbuy">已购买</a>
}
</div>
......
src/components/classify/index.js
......@@ -2,7 +2,8 @@ import React, {Component} from 'react';
import {WithTab} from '@/HOCs'
import './index.scss';
import {http, api} from "@/utils";
import { Link } from 'react-router-dom'
import {Link} from 'react-router-dom'
import {Toast} from 'antd-mobile'
class Classify extends Component {
constructor(props) {
......@@ -34,8 +35,10 @@ class Classify extends Component {
special: res.data.data.special[2],
})
}
} else {
Toast.info(res.data.msg, 2)
}
})
}
......@@ -43,9 +46,9 @@ class Classify extends Component {
return (
<div className='class-box'>
<div className="class-title">分类</div>
<ClassCourseBox data={this.state.camp.list} title={this.state.camp.name} type={1} />
<ClassCourseBox data={this.state.camp.list} title={this.state.camp.name} type={1}/>
<ClassCourseBox data={this.state.employment.list} title={this.state.employment.name} type={1}/>
<ClassCourseBox data={this.state.basics.list} title={this.state.basics.name} type={2}/>
<ClassCourseBox data={this.state.basics.list} title={this.state.basics.name} type={2}/>
<ClassCourseBox data={this.state.advanced.list} title={this.state.advanced.name} type={2}/>
<div className="vip">
{this.state.special.list && this.state.special.list.length > 0 && this.state.special.list.map((item, index) => {
......@@ -69,7 +72,8 @@ function ClassCourseA({data}) {
{
data && data.length > 0 && data.map((item, index) => {
return (
<Link to={`/detail?id=${item.course_id}`} key={index} className='item-banner'><img src={item.course_img} alt=""/></Link>
<Link to={`/detail?id=${item.course_id}`} key={index} className='item-banner'><img
src={item.course_img} alt=""/></Link>
)
})
}
......
src/components/classify/index.scss
.class-box {
background-color: $bg_fff;
.class-title {
width: 100%;
height: 44px;
line-height: 44px;
text-align: center;
background-color: #F7F9FC;
font-size: 16px;
color: $color_333;
}
.class-course {
width: 100%;
margin-top: 20px;
padding: 0 15px;
.course-items-title {
font-size: 14px;
.class-title {
width: 100%;
height: 44px;
line-height: 44px;
text-align: center;
background-color: #F7F9FC;
font-size: 16px;
color: $color_333;
img {
margin-right: 8px;
width: 10px;
height: 11px;
}
}
.items-box {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
.class-course {
width: 100%;
margin-top: 20px;
padding: 0 15px;
.item-banner {
display: inline-block;
width: 30.5%;
height: 76px;
margin-top: 10px;
.course-items-title {
font-size: 14px;
color: $color_333;
img {
width: 100%;
height: 100%;
border-radius: 3px;
margin-right: 8px;
width: 10px;
height: 11px;
}
}
.item-label {
display: inline-block;
width: 30.5%;
height: 30px;
line-height: 30px;
text-align: center;
background-color: $bg_f4f4f4;
border-radius: 15px;
margin-top: 15px;
margin-bottom: -5px;
.items-box {
display: flex;
flex-wrap: wrap;
.item-banner {
display: inline-block;
width: 30.5%;
height: 76px;
margin-top: 10px;
img {
width: 100%;
height: 100%;
border-radius: 3px;
}
}
.item-label {
display: inline-block;
width: 30.5%;
height: 30px;
line-height: 30px;
text-align: center;
background-color: $bg_f4f4f4;
border-radius: 15px;
margin-top: 15px;
margin-bottom: -5px;
margin-right: 12px;
}
:nth-of-type(3n) {
margin-right: 0;
}
}
}
}
.vip {
width: 100%;
height: 130px;
border-radius: 5px;
margin-top: 20px;
margin-bottom: 50px;
padding: 0 15px;
}
img {
.vip {
width: 100%;
height: 106px;
height: 130px;
border-radius: 5px;
margin-top: 20px;
margin-bottom: 50px;
padding: 0 15px;
img {
width: 100%;
height: 106px;
border-radius: 5px;
}
}
}
}
src/components/detail/btnstatus/index.js
......@@ -135,7 +135,7 @@ class BtnStatus extends Component {
{/*特殊课程*/}
{
info.isbaoming === 0 &&
this.state.isbuy === 20 &&
<div className='btns-box'>
<a className='consult-l' href="https://q.url.cn/AB8aue?_type=wpa&qidian=true">
<i className='iconfont iconerji'></i>
......
src/components/my/index.js
import React, { PureComponent } from 'react';
import { Flex, WhiteSpace, NavBar, List } from 'antd-mobile';
import React, {PureComponent} from 'react';
import {Flex, WhiteSpace, NavBar, List} from 'antd-mobile';
import './index.scss';
import Avatar from './image/avatar.png';
import Vip from './image/vip.png';
import { WithTab } from '@/HOCs'
import { Link } from "react-router-dom";
import {WithTab} from '@/HOCs'
import {Link} from "react-router-dom";
// import UnVip from './image/unVIP.png';
......@@ -12,7 +12,12 @@ const Item = List.Item;
const Brief = Item.Brief;
class My extends PureComponent {
constructor(props) {
super(props)
this.state = {
data: []
}
}
render() {
let { history } = this.props;
return (
......@@ -26,10 +31,10 @@ class My extends PureComponent {
我的
</NavBar>
{/* <List className="my-list">
<Item
className="avatar-wrap"
arrow="horizontal"
multipleLine
<Item
className="avatar-wrap"
arrow="horizontal"
multipleLine
thumb={Avatar}
onClick={() => { }}>
<Brief>点击登录</Brief>
......@@ -61,22 +66,26 @@ class My extends PureComponent {
<i className="iconfont iconiconfront-27"></i>
已购课程
</Item>
<Item
arrow="horizontal"
onClick={() => {
}}
>
<i className="iconfont icongouwuche"></i>
购物车
</Item>
<Item
arrow="horizontal"
onClick={() => {
}}
>
<i className="iconfont iconiconfront-24"></i>
课程订单
</Item>
<Link to='/shopcart'>
<Item
arrow="horizontal"
onClick={() => {
}}
>
<i className="iconfont icongouwuche"></i>
购物车
</Item>
</Link>
<Link to='/myorders'>
<Item
arrow="horizontal"
onClick={() => {
}}
>
<i className="iconfont iconiconfront-24"></i>
课程订单
</Item>
</Link>
<Link to={{
pathname: '/coupons',
state: {
......@@ -91,17 +100,20 @@ class My extends PureComponent {
</Item>
</Link>
</List>
<List renderHeader={() => ''}>
<Item
arrow="horizontal"
onClick={() => { history.push('/scholarship') }}
>
<i className="iconfont iconiconfront-51"></i>
赚奖学金
</Item>
</List>
<Link to='/scholarship'>
<List renderHeader={() => ''}>
<Item
arrow="horizontal"
onClick={() => {
}}
>
<i className="iconfont iconiconfront-51"></i>
赚奖学金
</Item>
</List>
</Link>
</Flex.Item>
</Flex>
<WhiteSpace size="lg"/>
......
src/components/myOrders/index.js
......@@ -44,7 +44,7 @@ class MyOrders extends Component {
let data = {
order_id: oid
}
http.post(`${api.home}/m/live/free_list`, data).then((res) => {
http.post(`${api.home}/m/cancel_order`, data).then((res) => {
if (res.data.code === 200) {
this.getList()
} else {
......@@ -74,7 +74,7 @@ class MyOrders extends Component {
<p className='order-title text-overflow-one'>
<Link to={`/detail?id=${item.course_id}`}>{item.course_title}</Link>
</p>
<p className='order-content text-overflow-2'>item.simpledescription</p>
<p className='order-content text-overflow-2'>{item.description}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.pay_amount}</span>
<span className='order-price'>¥{item.price0}</span>
......
src/components/preferential/index.js
......@@ -4,6 +4,8 @@ import {Tabs, WhiteSpace} from 'antd-mobile'
import './index.scss'
import HeaderSearch from '../../common/HeaderSearch/index'
import {http, api} from "@/utils"
import {Link} from 'react-router-dom'
import {Toast} from 'antd-mobile'
class Preferential extends Component {
constructor(props) {
......@@ -25,7 +27,10 @@ class Preferential extends Component {
this.setState({
dataList: res.data.data
})
} else {
Toast.info(res.data.msg, 2)
}
})
}
// 砍价专区
......@@ -35,6 +40,8 @@ class Preferential extends Component {
this.setState({
dataList: res.data.data
})
} else {
Toast.info(res.data.msg, 2)
}
})
}
......@@ -45,6 +52,8 @@ class Preferential extends Component {
this.setState({
dataList: res.data.data
})
} else {
Toast.info(res.data.msg, 2)
}
})
}
......@@ -90,7 +99,11 @@ class Preferential extends Component {
{this.state.dataList.map((item, index) => {
const Info = (
<div className="info">
<p className='title'>{item.course_title}</p>
<p className='title'>
<Link to={`/detail?id=${item.course_id}`}>
{item.course_title}
</Link>
</p>
<p className='contact text-overflow-2'>{item.course_desc}</p>
<div className='des'>
{item.is_buy &&
......
src/components/preferential/index.scss
......@@ -22,7 +22,6 @@
.course-status {
background-color: rgba(224, 46, 36, 0.6);
}
}
}
......@@ -38,6 +37,8 @@
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
height: 16px;
line-height: 16px;
}
.contact {
......
src/components/purchased/index.js 0 → 100644
import React, {Component} from 'react';
import './index.scss';
import {HeaderBar} from '../../common'
import {VList} from '../../common'
import {http, api} from "@/utils";
import {Link} from 'react-router-dom'
import {Toast} from 'antd-mobile'
import {connect} from "react-redux";
class Purchased extends Component {
constructor(props) {
super(props)
this.state = {
data: []
}
}
componentDidMount() {
this.getList()
}
componentDidUpdate(prevProps, prevState) {
const {user} = this.props
console.log(user && user.data && user.data.uid);
}
// 获取订单
getList = () => {
http.get(`${api.home}/m/my/courses`,).then((res) => {
if (res.data.code === 200) {
this.setState({
data: res.data.data
})
} else {
Toast.info(res.data.msg, 2);
}
})
}
render() {
const {user} = this.props
const uid = user && user.data && user.data.uid
return (
<div className='purchased-box'>
<HeaderBar title={'已购课程'}></HeaderBar>
{
this.state.data && this.state.data.length > 0 ?
<div className="purchased-body">
<div className='tip'>加群请备注您的学号：{uid}</div>
{
this.state.data.map((item, index) => {
const Info = (
<div className="info">
<p className='title'>
<Link to={`/detail?id=${item.course_id}`}>
{item.course_title}
</Link>
</p>
<p className='contact text-overflow-2'>{item.simpledescription}</p>
<div className='des'>
QQ群：{item.course_qq}
</div>
</div>
)
return (
<VList key={index} img={item.image_name}
id={item.course_id}
info={Info}></VList>
)
})
}
</div>
: <div className="cart-tip">
<p><i className='iconfont iconfridge'></i></p>
<p className='cart-mess'>您还没有课程哦，快去逛逛吧~</p>
<Link to='/classify'>去逛逛</Link>
</div>
}
</div>
)
}
}
export default connect(
state => ({user: state.user}),
null
)(Purchased)
src/components/purchased/index.scss 0 → 100644
.purchased-box {
width: 100%;
height: 100%;
background-color: $bg_f5f5f5;
.tip {
width: 100%;
height: 30px;
line-height: 30px;
font-size: 12px;
color: $color_333;
text-align: center;
background-color: $bg_FFF4CE;
margin-bottom: 10px;
}
.purchased-body {
background-color: $bg_fff;
}
.v-list-item {
background-color: #fff;
.content {
padding-bottom: 10px;
border-bottom: 1px solid #e7eaf1;
.cover {
flex: inherit;
width: 42.2%;
img {
width: 100%;
}
}
}
.info {
width: 52.3%;
position: relative;
display: block;
.title {
font-size: 16px;
color: $color_333;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
height: 16px;
line-height: 16px;
}
.contact {
font-size: 14px;
color: $color_666;
margin-top: 14px;
}
.des {
position: absolute;
bottom: 5px;
color: $red;
font-size: 14px;
height: 14px;
line-height: 14px;
}
}
}
.cart-tip {
color: #555;
margin-top: 140px;
text-align: center;
.iconfridge {
font-size: 21px;
}
.cart-mess {
font-size: 12px;
color: $color_666;
}
a {
display: inline-block;
width: 130px;
height: 30px;
border: 1px solid $bg_active;
border-radius: 15px;
font-size: 16px;
margin-top: 30px;
color: $active;
text-align: center;
line-height: 28px;
}
}
}
\ No newline at end of file
src/components/shopCart/cartList.js
......@@ -27,7 +27,7 @@ class cartList extends Component {
: <div className="cart-tip">
<p><i className='iconfont iconfridge'></i></p>
<p className='cart-mess'>这里是空的，快去逛逛吧~</p>
<Link to='/'>去逛逛</Link>
<Link to='/classify'>去逛逛</Link>
</div>
}
</div>
......
src/router/router-config.js
......@@ -24,6 +24,7 @@ const Study = loadable(() => import(/* webpackChunkName: 'study'*/'@/components/
const Video = loadable(() => import(/* webpackChunkName: 'video'*/'@/components/video'))
const sharePoster = loadable(() => import(/* webpackChunkName: 'shareposter'*/'@/components/sharePoster'))
const myOrders = loadable(() => import(/* webpackChunkName: 'myorders'*/'@/components/myOrders'))
const Purchased = loadable(() => import(/* webpackChunkName: 'purchased'*/'@/components/purchased'))
export default [
{
path: '/',
......@@ -111,7 +112,13 @@ export default [
},
{
path: '/myorders',
component: myOrders
component: myOrders,
isPrivate: true
},
{
path: '/purchased',
component: Purchased,
isPrivate: true
},
{
path: '/payOrder',
......
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