Skip to content

M
mr-julyedu
Commit 5aedbc91 by xuzhenghua
Options

test

parents a5fbd668 ce46660f
Showing with 292 additions and 152 deletions
package-lock.json
......@@ -1973,9 +1973,9 @@
}
},
"antd-mobile": {
"version": "2.2.13",
"resolved": "https://registry.npmjs.org/antd-mobile/-/antd-mobile-2.2.13.tgz",
"integrity": "sha512-izBPlj5yvjPwzqvpjYYmKp9HOSoeIbqY4Z7gzFpxJXnDvaDoeY3ULr4AHQ1gdeJo6BpqjlcCHHw1IwX8DWN3JQ==",
"version": "2.3.1",
"resolved": "https://registry.npmjs.org/antd-mobile/-/antd-mobile-2.3.1.tgz",
"integrity": "sha512-CBegyQuQiNxmwQH4Ck619Y9UO7EVN8FuhnUlV7kmbSSxxy+V704dSGy7uLNn7AUePRK5UZfm6ifLsZix6khZfQ==",
"requires": {
"array-tree-filter": "~2.1.0",
"babel-runtime": "6.x",
......@@ -4105,9 +4105,9 @@
"integrity": "sha1-/aGedh/Ad+Af+/3G6f38WeiAbNg="
},
"css-animation": {
"version": "1.5.0",
"resolved": "https://registry.npmjs.org/css-animation/-/css-animation-1.5.0.tgz",
"integrity": "sha512-hWYoWiOZ7Vr20etzLh3kpWgtC454tW5vn4I6rLANDgpzNSkO7UfOqyCEeaoBSG9CYWQpRkFWTWbWW8o3uZrNLw==",
"version": "1.6.1",
"resolved": "https://registry.npmjs.org/css-animation/-/css-animation-1.6.1.tgz",
"integrity": "sha512-/48+/BaEaHRY6kNQ2OIPzKf9A6g8WjZYjhiNDNuIVbsm5tXCGIAsHDjB4Xu1C4vXJtUWZo26O68OQkDpNBaPog==",
"requires": {
"babel-runtime": "6.x",
"component-classes": "^1.2.5"
......@@ -4743,9 +4743,9 @@
}
},
"dom-align": {
"version": "1.8.3",
"resolved": "https://registry.npmjs.org/dom-align/-/dom-align-1.8.3.tgz",
"integrity": "sha512-thE1qB8mvtRZgwN4+IGFz1rv7zVsr08c2/IEYtOJIeTzW4YDadIOd5nQ4BpiiAvUWg55xTeGq7zLTDxDYWDrnw=="
"version": "1.10.2",
"resolved": "https://registry.npmjs.org/dom-align/-/dom-align-1.10.2.tgz",
"integrity": "sha512-AYZUzLepy05E9bCY4ExoqHrrIlM49PEak9oF93JEFoibqKL0F7w5DLM70/rosLOawerWZ3MlepQcl+EmHskOyw=="
},
"dom-converter": {
"version": "0.2.0",
......@@ -11927,15 +11927,16 @@
}
},
"rc-animate": {
"version": "2.8.3",
"resolved": "https://registry.npmjs.org/rc-animate/-/rc-animate-2.8.3.tgz",
"integrity": "sha512-VPSHJF/PW9zrPVCdQ94/YOI2lFfJVlaiAeQveJN2nlPVMivgvXkuFJyfe42GbZqm+qlnRjH9B4WbY9rCZz9miw==",
"version": "2.10.0",
"resolved": "https://registry.npmjs.org/rc-animate/-/rc-animate-2.10.0.tgz",
"integrity": "sha512-gZM3WteZO0e3X8B71KP0bs95EY2tAPRuiZyKnlhdLpOjTX/64SrhDZM3pT2Z8mJjKWNiiB5q2SSSf+BD8ljwVw==",
"requires": {
"babel-runtime": "6.x",
"classnames": "^2.2.6",
"css-animation": "^1.3.2",
"prop-types": "15.x",
"raf": "^3.4.0",
"rc-util": "^4.8.0",
"react-lifecycles-compat": "^3.0.4"
}
},
......@@ -12012,26 +12013,28 @@
}
},
"rc-trigger": {
"version": "2.6.2",
"resolved": "https://registry.npmjs.org/rc-trigger/-/rc-trigger-2.6.2.tgz",
"integrity": "sha512-op4xCu95/gdHVaysyxxiYxbY+Z+UcIBSUY9nQfLqm1FlitdtnAN+owD5iMPfnnsRXntgcQ5+RdYKNUFQT5DjzA==",
"version": "2.6.5",
"resolved": "https://registry.npmjs.org/rc-trigger/-/rc-trigger-2.6.5.tgz",
"integrity": "sha512-m6Cts9hLeZWsTvWnuMm7oElhf+03GOjOLfTuU0QmdB9ZrW7jR2IpI5rpNM7i9MvAAlMAmTx5Zr7g3uu/aMvZAw==",
"requires": {
"babel-runtime": "6.x",
"classnames": "^2.2.6",
"prop-types": "15.x",
"rc-align": "^2.4.0",
"rc-animate": "2.x",
"rc-util": "^4.4.0"
"rc-util": "^4.4.0",
"react-lifecycles-compat": "^3.0.4"
}
},
"rc-util": {
"version": "4.6.0",
"resolved": "https://registry.npmjs.org/rc-util/-/rc-util-4.6.0.tgz",
"integrity": "sha512-rbgrzm1/i8mgfwOI4t1CwWK7wGe+OwX+dNa7PVMgxZYPBADGh86eD4OcJO1UKGeajIMDUUKMluaZxvgraQIOmw==",
"version": "4.11.0",
"resolved": "https://registry.npmjs.org/rc-util/-/rc-util-4.11.0.tgz",
"integrity": "sha512-nB29kXOXsSVjBkWfH+Z1GVh6tRg7XGZtZ0Yfie+OI0stCDixGQ1cPrS6iYxlg+AV2St6COCK5MFrCmpTgghh0w==",
"requires": {
"add-dom-event-listener": "^1.1.0",
"babel-runtime": "6.x",
"prop-types": "^15.5.10",
"react-lifecycles-compat": "^3.0.4",
"shallowequal": "^0.2.2"
}
},
......@@ -12312,6 +12315,15 @@
"recompose": "0.27.1 - 0.30.0"
}
},
"react-sticky": {
"version": "6.0.3",
"resolved": "https://registry.npmjs.org/react-sticky/-/react-sticky-6.0.3.tgz",
"integrity": "sha512-LNH4UJlRatOqo29/VHxDZOf6fwbgfgcHO4mkEFvrie5FuaZCSTGtug5R8NGqJ0kSnX8gHw8qZN37FcvnFBJpTQ==",
"requires": {
"prop-types": "^15.5.8",
"raf": "^3.3.0"
}
},
"react-tween-state": {
"version": "0.1.5",
"resolved": "https://registry.npmjs.org/react-tween-state/-/react-tween-state-0.1.5.tgz",
......@@ -12769,9 +12781,9 @@
}
},
"rmc-date-picker": {
"version": "6.0.9",
"resolved": "https://registry.npmjs.org/rmc-date-picker/-/rmc-date-picker-6.0.9.tgz",
"integrity": "sha512-3XRfkTwBeDjJzQuAHq8VOKBaj8qZaqzbudg1KkvggVEdF67HAzIMEzjXrOH1MR2MmSJ7Z3NxTKJXY8P8WddYSg==",
"version": "6.0.10",
"resolved": "https://registry.npmjs.org/rmc-date-picker/-/rmc-date-picker-6.0.10.tgz",
"integrity": "sha512-/9+I6lm3EDEl6M7862V6++zFuxwsM0UEq8wSHbotYIPPmyB/65gx1cviblghOv2QfB0O9+U2w3qEJlRP/WsMrA==",
"requires": {
"babel-runtime": "6.x",
"rmc-picker": "~5.0.0"
......@@ -12850,9 +12862,9 @@
}
},
"rmc-picker": {
"version": "5.0.9",
"resolved": "https://registry.npmjs.org/rmc-picker/-/rmc-picker-5.0.9.tgz",
"integrity": "sha512-loulflyMa6SCReU/LcbWxNvy46gpoW5DEZW78GqkPuAEjwQVQjKtpvq/VzBND8Yt0SBetWUTAZ3AOKTVH3qxcQ==",
"version": "5.0.10",
"resolved": "https://registry.npmjs.org/rmc-picker/-/rmc-picker-5.0.10.tgz",
"integrity": "sha512-KZ70+WjcaZHnG5GyCxWCPFWAZ12s6NqyrbW73LeqH0WEqaTMMs0sOrk2f4mQAZ/CGT0XcFN6VZLw7Ozoxfn7LA==",
"requires": {
"babel-runtime": "6.x",
"classnames": "^2.2.6",
......
package.json
......@@ -7,7 +7,7 @@
"@babel/plugin-proposal-decorators": "^7.4.4",
"@loadable/component": "^5.10.1",
"@svgr/webpack": "4.1.0",
"antd-mobile": "^2.2.13",
"antd-mobile": "^2.3.1",
"autoprefixer": "^9.6.0",
"axios": "^0.19.0",
"babel-core": "7.0.0-bridge.0",
......@@ -65,6 +65,7 @@
"react-redux": "^7.0.2",
"react-router-dom": "^5.0.1",
"react-spinners": "^0.5.4",
"react-sticky": "^6.0.3",
"redux": "^4.0.1",
"redux-immutable": "^4.0.0",
"redux-logger": "^3.0.6",
......
src/common/VList/index.js
import React from 'react';
import './index.scss'
import {Link} from 'react-router-dom'
const VList = (props) => {
return (
<li className='v-list-item'>
<li className='v-list-item' onClick={() => props.toDetail(props.id)}>
<div className="content">
<div className="cover">
{props.status}
{/* <Link to={`/detail?id=${props.id}`}> */}
{props.toDetail
?(<img src={props.img} alt="" onClick={() => props.toDetail(props.id)} />)
:(<img src={props.img} alt="" />)
? (<img src={props.img} alt=""/>)
: (<img src={props.img} alt=""/>)
}
{/* </Link> */}
</div>
{props.info}
</div>
......
src/common/index.js
......@@ -7,5 +7,6 @@ export { default as CallApp } from './CallApp'
export { default as Captcha } from './Captcha'
export { default as ClearableInput } from "./ClearableInput";
export { default as Loading } from './Loading'
export { default as RenderTabBar } from './renderTabBar'
src/common/renderTabBar/index.js 0 → 100644
import { Sticky } from 'react-sticky'
import { Tabs } from "antd-mobile"
import React from "react"
export default function RenderTabBar({topOffset = 0,zIndex = 1, ...rest}) {
return (
<Sticky topOffset={topOffset}>
{({style}) => <div style={{...style, zIndex}}>
<Tabs.DefaultTabBar {...rest}/>
</div>}
</Sticky>
)
}
src/components/Index/index.js
......@@ -94,7 +94,7 @@ class Index extends Component {
roomMess: item
})
} else {
window.location.href = `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}`
}
}
}
......
src/components/ShareCourse/index.js
......@@ -3,15 +3,15 @@ import './index.scss';
import {HeaderBar, VList} from '@/common';
import {http, getParam, SendMessageToApp} from '@/utils';
import {Toast} from 'antd-mobile';
import {Link} from "react-router-dom";
import FollowQRcode from "../detail/followQRcode";
class ShareCourse extends Component {
constructor(props) {
super(props);
this.state = {list: []};
this.state = {
list: [],
fromApp: !getParam('from') ? false : true
};
}
componentDidMount() {
......@@ -27,11 +27,12 @@ class ShareCourse extends Component {
}
toCourseDetail = (id) => {
if (!getParam('from')) {
const _this = this
if (_this.state.fromApp) {
SendMessageToApp("toCourse", id)
} else {
const {history} = this.props;
history.push(`/detail?id=${id}`)
} else {
SendMessageToApp("toCourse", id)
}
}
......@@ -39,8 +40,11 @@ class ShareCourse extends Component {
const {list} = this.state;
return (
<div className={'share-course'}>
{
!this.state.fromApp &&
<HeaderBar title='分享领红包' arrow={true}/>
<FollowQRcode/>
}
{
list && list.length > 0 ? <div>
{
......@@ -53,10 +57,12 @@ class ShareCourse extends Component {
</div>
)
return (
<div key={index} onClick={() => this.toCourseDetail(item.course_id)}>
<div key={index}>
<VList
img={item.image_name}
info={Info}
id={item.course_id}
toDetail={this.toCourseDetail}
/>
</div>
......
src/components/classify/courselist.js
import React, {Component} from 'react'
import {VList} from '../../common'
import {Tabs, WhiteSpace} from 'antd-mobile'
import React, { Component } from 'react'
import { VList } from '../../common'
import { Tabs, WhiteSpace, Toast } from 'antd-mobile'
import './courselist.scss'
import HeaderSearch from '../../common/HeaderSearch/index'
import {http, getParam} from "@/utils"
import {Toast} from 'antd-mobile'
import {Link} from 'react-router-dom'
import { http, getParam } from "@/utils"
import Loading from '@/common/Loading'
import {connect} from 'react-redux';
import {getCourses} from './../detail/actions';
import { connect } from 'react-redux';
import { StickyContainer } from "react-sticky";
function stopScroll(e) {
e.preventDefault()
}
@connect(({user}) => ({
user
......@@ -33,6 +36,11 @@ class Classify extends Component {
this.getList()
}
componentWillUnmount() {
document.removeEventListener('touchmove', stopScroll)
}
// 获取tabs接口
getTabs = () => {
let data = 0
......@@ -93,7 +101,11 @@ class Classify extends Component {
this.setState(status => ({
ispull: !status.ispull,
display: status.ispull ? 'none' : 'block'
}));
}), () => {
this.state.ispull ? document.addEventListener('touchmove', stopScroll, {
passive: false
}) : document.removeEventListener('touchmove', stopScroll)
});
}
// 弹窗里面tab点击查询
......@@ -108,19 +120,19 @@ class Classify extends Component {
}
toCourseDetail = (id) => {
const { dispatch, history } = this.props;
const {dispatch, history} = this.props;
// dispatch(getCourses(id, () => {
history.push(`/detail?id=${id}`)
// }));
}
toClassify=()=>{
location.replace('/classify');
toClassify = () => {
this.props.history.replace('/classify');
}
render() {
const { user ={} } = this.props;
let isLogin = user.data && user.data.uid? true : false;
const {user = {}} = this.props;
let isLogin = user.data && user.data.uid ? true : false;
const bottom = (
<i className={'iconfont iconiconfront-69 pull-down'}></i>
)
......@@ -129,7 +141,6 @@ class Classify extends Component {
)
let page = this.state.allClass.findIndex((item) => item.title === this.state.activeTab)
return (
<div className='class-child'>
<HeaderSearch
......@@ -142,21 +153,24 @@ class Classify extends Component {
<div onClick={this.pulldown.bind(this)}>
{this.state.ispull ? top : bottom}
</div>
<StickyContainer>
<Tabs
tabs={this.state.allClass}
animated={false}
page={page}
onChange={(tab) => this.ontabclick(tab)}
renderTabBar={props => <div className={'custom-render-bar'}>
<Tabs.DefaultTabBar {...props}/>
</div>}
>
<div className='tabs'>
<ul>
{this.state.data && this.state.data.length > 0 && this.state.data.map((item, index) => {
const Info = (
<div className="info">
<p className='title' onClick={() => this.toCourseDetail(item.course_id)}>
{/* <Link to={`/detail?id=${item.course_id}`}> */}
<p className='title'
onClick={() => this.toCourseDetail(item.course_id)}>
{item.course_title}
{/* </Link> */}
</p>
<p className='contact text-overflow-2'>{item.desc}</p>
<div className='des'>
......@@ -172,6 +186,7 @@ class Classify extends Component {
</div>
)
const status = (
!item.is_buy &&
<div>
{item.bargain_num === 0 && item.groupon_num !== 0 &&
<p className='course-status'>拼团减{item.groupon_num}元</p>
......@@ -198,6 +213,8 @@ class Classify extends Component {
</ul>
</div>
</Tabs>
</StickyContainer>
<WhiteSpace/>
</div>
<div className='mbc-box' style={{display: this.state.display}}>
......
src/components/classify/courselist.scss
......@@ -5,10 +5,29 @@ html,body,#root {
position: relative;
height: 100%;
.preferential{
width: 100%;
height: 44px;
position: fixed;
top: 0;
left: 0;
z-index: 10;
}
.class-content {
padding: 0 12px;
padding: 88px 12px 0;
position: relative;
.custom-render-bar{
position: fixed;
top: 43px;
left: 0;
z-index: 10;
padding-left: 11px;
background: #fff;
}
.v-list-item {
padding: 10px 0 0;
......@@ -105,10 +124,10 @@ html,body,#root {
width: 32px;
height: 35px;
line-height: 35px;
position: absolute;
top: 4px;
position: fixed;
top: 48px;
right: 0;
z-index: 2;
z-index: 20;
background-color: $bg_fff;
color: $color_666;
}
......@@ -138,7 +157,7 @@ html,body,#root {
.mbc-box {
position: absolute;
left: 0;
top: 88px;
top: 87px;
right: 0;
bottom: 0;
background-color: rgba(0, 0, 0, .6);
......
src/components/detail/carousel/index.js → src/components/detail/barrage/index.js
import React, {Component} from 'react'
import {Carousel, WingBlank} from 'antd-mobile'
import {WingBlank} from 'antd-mobile'
import './index.scss'
import {api, getParam, http} from "@/utils"
// 课程页面滚动广告
class Carouselw extends Component {
timer
barageTimer
constructor(props) {
super(props)
this.state = {
list: []
list: [],
isShowBarrage: false
}
}
componentDidMount() {
const _this = this
_this.getList()
this.timer = setInterval(function () {
_this.getList()
}, 10000);
setupBarrage = () => {
const periods = [
{start: 0, end: 7, interval: 60000},
{start: 7, end: 8, interval: 30000},
{start: 8, end: 23, interval: 15000},
{start: 23, end: 24, interval: 30000},
]
const now = new Date(Date.now()).getHours()
for (let period of periods) {
if(now >= period.start && now <= period.end){
this.timer = setTimeout(() => {
this.getList()
this.setupBarrage()
}, period.interval)
break
}
}
}
componentDidUpdate(prevProps) {
const {isShow} = this.props
const {isShow: prevIsShow} = prevProps
if(prevIsShow !== isShow && isShow !== undefined){
if(isShow){
this.setupBarrage()
}
this.componentDidUpdate = null
}
}
componentWillUnmount() {
this.timer && clearTimeout(this.timer);
this.barageTimer && clearTimeout(this.barageTimer)
}
// 获取课程接口
......@@ -35,6 +62,11 @@ class Carouselw extends Component {
if (res.data.code === 200) {
this.setState({
list: res.data.data,
isShowBarrage: true
}, () => {
this.barageTimer = setTimeout(() => {
this.setState({isShowBarrage: !this.state.isShowBarrage})
}, 5000)
});
}
})
......@@ -43,6 +75,16 @@ class Carouselw extends Component {
render() {
return (
<WingBlank>
<div className="my-carousel" style={{opacity: this.state.isShowBarrage ? 1 : 0}}>
{
this.state.list &&
<div className="v-item text-overflow-one">
<img src={this.state.list.avatar} alt=""/>
{this.state.list.user_name} {this.state.list.live_msg}
</div>
}
</div>
{/*
<Carousel className="my-carousel"
vertical
dots={false}
......@@ -58,6 +100,7 @@ class Carouselw extends Component {
}
</Carousel>
*/}
</WingBlank>
)
}
......
src/components/detail/carousel/index.scss → src/components/detail/barrage/index.scss
......@@ -9,6 +9,8 @@
border-radius: 3px;
padding: 6px 9px;
z-index:99;
opacity: 0;
transition: opacity .3s;
img {
width: 18px;
height: 18px;
......
src/components/detail/index.js
import React, {Component} from 'react'
import React, { Component } from 'react'
import './index.scss'
import Bargain from './bargain'
import Group from './group'
import OutLine from './outline'
import {HeaderBar, CallApp} from '../../common'
import { HeaderBar, CallApp } from '../../common'
import ShareRank from "./shareRank"
import Audition from "./audition"
import Single from "./single"
import SingleSuccess from './single/singleSuccess';
import BtnStatus from "./btnstatus"
import Carouselw from "./carousel"
import {connect} from "react-redux"
import {getCourses, addCourseToCart} from "./actions"
import {getParam, http, browser,wxShare} from "@/utils"
import {Toast} from 'antd-mobile'
import {compose, bindActionCreators} from "redux";
import Barrage from './barrage'
import { connect } from "react-redux"
import { getCourses, addCourseToCart } from "./actions"
import { getParam, http, browser, wxShare } from "@/utils"
import { Toast } from 'antd-mobile'
import { bindActionCreators } from "redux";
class Detail extends Component {
......@@ -47,8 +47,8 @@ class Detail extends Component {
componentDidMount() {
this.fetchCourseInfo();
const { location: { state = {} } } = this.props;
if(state.oid) {
const {location: {state = {}}} = this.props;
if (state.oid) {
this.check(state.oid);
}
if (getParam('is_class') === 1 || getParam('weixinpay')) {
......@@ -60,16 +60,16 @@ class Detail extends Component {
}
componentDidUpdate(prevProps) {
if(prevProps.user.hasError !== this.props.user.hasError){
if (prevProps.user.hasError !== this.props.user.hasError) {
this.fetchCourseInfo()
}
}
payCallback =() => {
payCallback = () => {
const _this = this;
if(!getParam('oid')) {
if (!getParam('oid')) {
return;
}else{
} else {
this.setState({
singMess: JSON.parse(window.localStorage.getItem('singMess'))
})
......@@ -112,7 +112,7 @@ class Detail extends Component {
}, 1000)
}
};
isweixinPay =()=> {
isweixinPay = () => {
let _this = this;
let weixin_code = getParam('code');
if (weixin_code) {
......@@ -126,6 +126,7 @@ class Detail extends Component {
http.get(`${API['base-api']}/pay/wxpay/pub_charge/oid/${getParam('oid')}/code/${weixin_code}`).then((res) => {
if (res.data.errno === 0) {
const data = res.data.data;
function onBridgeReady() {
WeixinJSBridge.invoke(
'getBrandWCPayRequest', {
......@@ -182,6 +183,7 @@ class Detail extends Component {
}
)
}
if (typeof WeixinJSBridge == "undefined") {
if (document.addEventListener) {
document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false)
......@@ -239,13 +241,13 @@ class Detail extends Component {
payCallBack = (singleType, nowPrice, laterPrice) => {
// Toast.info(singleType, 2);
const _this = this;
if(singleType === 2) {
if (singleType === 2) {
_this.setState({
singleType,
nowPrice,
laterPrice
})
}else{
} else {
_this.setState({
singleType,
})
......@@ -282,7 +284,7 @@ class Detail extends Component {
title: course_info.course_title,
desc: course_info.index_description,
link: encodeURI(location.origin + '/detail?id=' + getParam('id')),
imgUrl:course_info.image_name
imgUrl: course_info.image_name
});
}
......@@ -343,7 +345,7 @@ class Detail extends Component {
// 加入购物车 type：1 加入购物车，2加入购物车并跳转到购物车页面去支付
toCart = (type) => {
const { history, addCourseToCart } = this.props;
const {history, addCourseToCart} = this.props;
let data = {
course_id: getParam('id')
};
......@@ -356,7 +358,8 @@ class Detail extends Component {
addCourseToCart();
this.fetchCourseInfo();
} else {
history.replace('/shopcart');ß
history.replace('/shopcart');
ß
}
} else if (res.data.code === 15001) {
history.replace('/shopcart');
......@@ -380,9 +383,9 @@ class Detail extends Component {
// } else {
// Toast.info('请在微信中使用分享功能！', 2);
// }
const { history } = this.props;
const { course = {} } = this.state;
if(course.course_info && course.course_info.self_oid) {
const {history} = this.props;
const {course = {}} = this.state;
if (course.course_info && course.course_info.self_oid) {
history.push(`/togroup?id=${course.course_info.self_oid}`);
}
}
......@@ -399,7 +402,7 @@ class Detail extends Component {
}
render() {
const { course: { course_info={} }, barInfo, singleBox, singleType } = this.state;
const {course: {course_info = {}}, barInfo, singleBox, singleType} = this.state;
let courseInfo = '',
service = '',
number = 0,
......@@ -413,15 +416,15 @@ class Detail extends Component {
// }
const {share, countdown, list, outList} = this.state;
let href = '';
const { location: { state = {}} } = this.props;
if(state.to && state.to === 'classify') {
const {location: {state = {}}} = this.props;
if (state.to && state.to === 'classify') {
href = '/classify'
}
if(state.oid) {
href='/classify'
if (state.oid) {
href = '/classify'
}
if(getParam('dist_code')) {
href='/'
if (getParam('dist_code')) {
href = '/'
}
return (
<div>
......@@ -432,18 +435,18 @@ class Detail extends Component {
cart={true}
toHref={href}
/>
<CallApp className='toapp' />
<CallApp className='toapp'/>
{/*弹幕*/}
<Carouselw />
<Barrage isShow={course_info.is_show}/>
{/*课程*/}
<div className='course-content'>
<div className='cover'>
<img src={course_info.image_name} alt="" />
<img src={course_info.image_name} alt=""/>
{
course_info.is_aist &&
<span className='return_cash' />
<span className='return_cash'/>
}
</div>
<div className="info">
......@@ -534,7 +537,7 @@ class Detail extends Component {
{/*分享赚钱*/}
{
course_info.is_dist &&
<ShareRank courseInfo={course_info} />
<ShareRank courseInfo={course_info}/>
}
{/**
......@@ -555,7 +558,7 @@ class Detail extends Component {
{/*砍价*/}
{
course_info.is_baoming === 0 && (!course_info.is_aist) && course_info.is_bargain &&
<Bargain />
<Bargain/>
}
{/*课程介绍、大纲*/}
......@@ -590,7 +593,7 @@ class Detail extends Component {
{`还差${number}人，分享到3个群，成团率高达98%`}
</div>
<div className='tipArrow'>
<i className='iconfont iconyindao' />
<i className='iconfont iconyindao'/>
</div>
</div>
) : null
......
src/components/detail/outline/index.js
import React, {Component} from 'react'
import {Link} from 'react-router-dom'
import {Tabs, WhiteSpace} from 'antd-mobile'
import React, { Component } from 'react'
import { Link } from 'react-router-dom'
import { Tabs, WhiteSpace } from 'antd-mobile'
import './index.scss'
import {api, getParam, http} from "@/utils"
import {Toast} from 'antd-mobile'
import { getParam, http } from "@/utils"
import { Toast } from 'antd-mobile'
import { StickyContainer } from "react-sticky";
import {RenderTabBar} from "@/common";
class OutLine extends Component {
constructor(props) {
......@@ -14,26 +15,22 @@ class OutLine extends Component {
}
}
componentDidMount() {
this.getList()
}
htmlDecode = (content) => {
// let e = document.createElement('div');
// e.innerHTML = content;
// return e.childNodes.length === 0 ? "" : e.childNodes[0].nodeValue;
if(content) {
content = content.replace(/&lt;/g , '<');
content = content.replace(/&gt;/g , '>');
content = content.replace(/&amp;gt;/g , '');
content = content.replace(/&quot;/g , '"');
content = content.replace(/&amp;nbsp;/g , '');
if (content) {
content = content.replace(/&lt;/g, '<');
content = content.replace(/&gt;/g, '>');
content = content.replace(/&amp;gt;/g, '');
content = content.replace(/&quot;/g, '"');
content = content.replace(/&amp;nbsp;/g, '');
}
return content;
}
tabchange = (tab, index) => {
if(index === 1) {
this.getList()
}
};
// 获取大纲数据
getList = () => {
http.get(`${API.home}/m/course/syllabuses/${getParam('id')}`).then((res) => {
......@@ -59,9 +56,11 @@ class OutLine extends Component {
return (
<div className='course-detail'>
<WhiteSpace/>
<StickyContainer>
<Tabs tabs={tabs}
initialPage={0}
onChange={(tab, index) => { this.tabchange(tab, index) }}
swipeable={false}
renderTabBar={RenderTabBar}
>
{/*介绍*/}
<div className='introduce'>
......@@ -118,13 +117,17 @@ class OutLine extends Component {
{
// 已购买直播结束已上传视频：正常播放按钮，点击播放课程
!introduce.is_aist && item.class_status === 2 &&
<Link to={`/play/video?id=${introduce.v_course_id + '&video_id=' + item.video_id}`} className='iconfont icondanseshixintubiao-23 icon-right-22'></Link>
<Link
to={`/play/video?id=${introduce.v_course_id + '&video_id=' + item.video_id}`}
className='iconfont icondanseshixintubiao-23 icon-right-22'></Link>
}
{
// 返现课程 是返现课程 未开课 已开课 是返现课程 未开课 已开课 已练习
introduce.is_aist && item.is_open && introduce.is_baoming === 1 &&
<Link to={`/play/video?id=${introduce.v_course_id + '&video_id=' + item.video_id}`} className='aist aist_open'></Link>
<Link
to={`/play/video?id=${introduce.v_course_id + '&video_id=' + item.video_id}`}
className='aist aist_open'></Link>
}
......@@ -163,7 +166,7 @@ class OutLine extends Component {
introduce.is_aist && item.practice.title !== "" && (!item.is_open || introduce.is_baoming === 0) &&
<span className='camp camp_test' key={index}>
<span>课后练习：{item.practice.title}</span>
<i className='exam exam_close' />
<i className='exam exam_close'/>
</span>
}
{
......@@ -184,7 +187,7 @@ class OutLine extends Component {
state: {from: `/detail${window.location.search}`}
}} className='camp camp_test' key={index}>
<span>课后练习：{item.practice.title}</span>
<i className='exam exam_open' />
<i className='exam exam_open'/>
</Link>
}
</>
......@@ -199,6 +202,7 @@ class OutLine extends Component {
}
</div>
</Tabs>
</StickyContainer>
<WhiteSpace/>
</div>
);
......
src/components/preferential/index.js
......@@ -4,11 +4,8 @@ import {Tabs, WhiteSpace, Toast} from 'antd-mobile'
import './index.scss'
import HeaderSearch from '../../common/HeaderSearch/index'
import {http} from "@/utils"
import {Link} from 'react-router-dom'
import Loading from '@/common/Loading'
import {bindActionCreators} from 'redux';
import {connect} from 'react-redux';
import {getCourses} from './../detail/actions';
@connect(({user}) => ({
user
......@@ -106,6 +103,10 @@ class Preferential extends Component {
tabs={tabs}
animated={false}
onChange={(tab, index) => this.ontabclick(tab, index)}
swipeable={false}
renderTabBar={props => <div className={'custom-tab-bar'}>
<Tabs.DefaultTabBar {...props}/>
</div>}
>
<div className='tabs'>
<ul>
......@@ -135,6 +136,7 @@ class Preferential extends Component {
</div>
)
const status = (
!item.is_buy &&
<div>
{this.state.courseStatus === 1 &&
<p className='course-status'>砍价减{item.bargain_price}元</p>
......
src/components/preferential/index.scss
.preferential {
padding-top: 88px;
.preferential{
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 44px;
z-index: 10;
padding-top: 0;
}
.custom-tab-bar{
width: 100%;
position: fixed;
top: 43px;
left: 0;
padding: 15px 0 15px 11px;
z-index: 10;
background: #fff;
}
.class-content {
padding: 0 12px;
position: relative;
......
src/router/router-config.js
......@@ -156,8 +156,7 @@ export default [
},
{
path: '/togroup',
component: ToGroup,
isPrivate: true
component: ToGroup
},
{
path: '/aist-share',
......
yarn.lock
......@@ -1567,10 +1567,10 @@ ansi-styles@^3.2.0, ansi-styles@^3.2.1:
dependencies:
color-convert "^1.9.0"
antd-mobile@^2.2.13:
version "2.2.13"
resolved "https://registry.yarnpkg.com/antd-mobile/-/antd-mobile-2.2.13.tgz#ae9a2b33ed8af52ed92127b50691af401ac4c8ce"
integrity sha512-izBPlj5yvjPwzqvpjYYmKp9HOSoeIbqY4Z7gzFpxJXnDvaDoeY3ULr4AHQ1gdeJo6BpqjlcCHHw1IwX8DWN3JQ==
antd-mobile@^2.3.1:
version "2.3.1"
resolved "https://registry.yarnpkg.com/antd-mobile/-/antd-mobile-2.3.1.tgz#04d8709c198eee27c3c41b903cb2ad77a16028e3"
integrity sha512-CBegyQuQiNxmwQH4Ck619Y9UO7EVN8FuhnUlV7kmbSSxxy+V704dSGy7uLNn7AUePRK5UZfm6ifLsZix6khZfQ==
dependencies:
array-tree-filter "~2.1.0"
babel-runtime "6.x"
......@@ -9076,7 +9076,7 @@ querystringify@^2.0.0:
resolved "https://registry.yarnpkg.com/querystringify/-/querystringify-2.1.1.tgz#60e5a5fd64a7f8bfa4d2ab2ed6fdf4c85bad154e"
integrity sha512-w7fLxIRCRT7U8Qu53jQnJyPkYZIaR4n5151KMfcJlO/A9397Wxb1amJvROTK6TOnp7PfoAmg/qXiNHI+08jRfA==
raf@3.4.1, raf@^3.1.0, raf@^3.3.2, raf@^3.4.0:
raf@3.4.1, raf@^3.1.0, raf@^3.3.0, raf@^3.3.2, raf@^3.4.0:
version "3.4.1"
resolved "https://registry.yarnpkg.com/raf/-/raf-3.4.1.tgz#0742e99a4a6552f445d73e3ee0328af0ff1ede39"
integrity sha512-Sq4CW4QhwOHE8ucn6J34MqtZCeWFP2aQSmrlroYgqAV1PjStIhJXxYuTgUIfkEk7zTLjmIjLmU5q+fbD1NnOJA==
......@@ -9390,6 +9390,14 @@ react-spinners@^0.5.4:
prop-types "^15.5.10"
recompose "0.27.1 - 0.30.0"
react-sticky@^6.0.3:
version "6.0.3"
resolved "https://registry.yarnpkg.com/react-sticky/-/react-sticky-6.0.3.tgz#7a18b643e1863da113d7f7036118d2a75d9ecde4"
integrity sha512-LNH4UJlRatOqo29/VHxDZOf6fwbgfgcHO4mkEFvrie5FuaZCSTGtug5R8NGqJ0kSnX8gHw8qZN37FcvnFBJpTQ==
dependencies:
prop-types "^15.5.8"
raf "^3.3.0"
react-tween-state@^0.1.5:
version "0.1.5"
resolved "https://registry.yarnpkg.com/react-tween-state/-/react-tween-state-0.1.5.tgz#e98b066551efb93cb92dd1be14995c2e3deae339"
......@@ -9519,11 +9527,6 @@ redux-logger@^3.0.6:
dependencies:
deep-diff "^0.3.5"
redux-persist@^5.10.0:
version "5.10.0"
resolved "https://registry.npm.taobao.org/redux-persist/download/redux-persist-5.10.0.tgz#5d8d802c5571e55924efc1c3a9b23575283be62b"
integrity sha1-XY2ALFVx5Vkk78HDqbI1dSg75is=
redux-thunk@^2.3.0:
version "2.3.0"
resolved "https://registry.yarnpkg.com/redux-thunk/-/redux-thunk-2.3.0.tgz#51c2c19a185ed5187aaa9a2d08b666d0d6467622"
......
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