Skip to content

M
mr-julyedu
Commit d4d59f7d by xuzhenghua
Options

checkout

parent 707a460c
Showing with 178 additions and 2533 deletions
package-lock.json
......@@ -1027,17 +1027,17 @@
}
},
"@babel/runtime": {
"version": "7.7.2",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.7.2.tgz",
"integrity": "sha512-JONRbXbTXc9WQE2mAZd1p0Z3DZ/6vaQIkgYMSTP3KjRCyd7rCZCcfhCyX+YjwcKxcZ82UrxbRD358bpExNgrjw==",
"version": "7.3.1",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.3.1.tgz",
"integrity": "sha512-7jGW8ppV0ant637pIqAcFfQDDH1orEPGJb8aXfUozuCU3QqX7rX4DA8iwrbPrR1hcH0FTTHz47yQnk+bl5xHQA==",
"requires": {
"regenerator-runtime": "^0.13.2"
"regenerator-runtime": "^0.12.0"
},
"dependencies": {
"regenerator-runtime": {
"version": "0.13.3",
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.3.tgz",
"integrity": "sha512-naKIZz2GQ8JWh///G7L3X6LaQUAMp2lvb1rvwwsURe/VXwD6VMfr+/1NuNw3ag8v2kY1aQ/go5SNn79O9JU7yw=="
"version": "0.12.1",
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.12.1.tgz",
"integrity": "sha512-odxIc1/vDlo4iZcfXqRYFj0vpXFNoGdKMAUieAlFYO6m/nl5e9KR/beGf41z4a1FI+aQgtjhuaSlDxQ0hmkrHg=="
}
}
},
......@@ -1846,11 +1846,6 @@
"negotiator": "0.6.1"
}
},
"ace-builds": {
"version": "1.4.7",
"resolved": "https://registry.npmjs.org/ace-builds/-/ace-builds-1.4.7.tgz",
"integrity": "sha512-gwQGVFewBopRLho08BfahyvRa9FlB43JUig5ItAKTYc9kJJsbA9QNz75p28QtQomoPQ9rJx82ymL21x4ZSZmdg=="
},
"acorn": {
"version": "5.7.3",
"resolved": "https://registry.npmjs.org/acorn/-/acorn-5.7.3.tgz",
......@@ -2852,14 +2847,6 @@
"@babel/plugin-transform-typescript": "^7.1.0"
}
},
"@babel/runtime": {
"version": "7.3.1",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.3.1.tgz",
"integrity": "sha512-7jGW8ppV0ant637pIqAcFfQDDH1orEPGJb8aXfUozuCU3QqX7rX4DA8iwrbPrR1hcH0FTTHz47yQnk+bl5xHQA==",
"requires": {
"regenerator-runtime": "^0.12.0"
}
},
"babel-loader": {
"version": "8.0.5",
"resolved": "https://registry.npmjs.org/babel-loader/-/babel-loader-8.0.5.tgz",
......@@ -2884,11 +2871,6 @@
"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.1.tgz",
"integrity": "sha512-tgp+dl5cGk28utYktBsrFqA7HKgrhgPsg6Z/EfhWI4gl1Hwq8B/GmY/0oXZ6nF8hDVesS/FpnYaD/kOWhYQvyg=="
},
"regenerator-runtime": {
"version": "0.12.1",
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.12.1.tgz",
"integrity": "sha512-odxIc1/vDlo4iZcfXqRYFj0vpXFNoGdKMAUieAlFYO6m/nl5e9KR/beGf41z4a1FI+aQgtjhuaSlDxQ0hmkrHg=="
},
"source-map": {
"version": "0.5.7",
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
......@@ -4704,11 +4686,6 @@
"resolved": "https://registry.npmjs.org/diff/-/diff-3.5.0.tgz",
"integrity": "sha512-A46qtFgd+g7pDZinpnwiRJtxbC1hpgf0uzP3iG89scHk0AUC7A1TGxf5OiiOUv/JMZR8GOt8hL900hV0bOy5xA=="
},
"diff-match-patch": {
"version": "1.0.4",
"resolved": "https://registry.npmjs.org/diff-match-patch/-/diff-match-patch-1.0.4.tgz",
"integrity": "sha512-Uv3SW8bmH9nAtHKaKSanOQmj2DnlH65fUpcrMdfdaOxUG02QQ4YGZ8AE7kKOMisF7UqvOlGKVYWRvezdncW9lg=="
},
"diffie-hellman": {
"version": "5.0.3",
"resolved": "https://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.3.tgz",
......@@ -9258,11 +9235,6 @@
"resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz",
"integrity": "sha1-gteb/zCmfEAF/9XiUVMArZyk168="
},
"lodash.get": {
"version": "4.4.2",
"resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz",
"integrity": "sha1-LRd/ZS+jHpObRDjVNBSZ36OCXpk="
},
"lodash.isarguments": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/lodash.isarguments/-/lodash.isarguments-3.1.0.tgz",
......@@ -9273,11 +9245,6 @@
"resolved": "https://registry.npmjs.org/lodash.isarray/-/lodash.isarray-3.0.4.tgz",
"integrity": "sha1-eeTriMNqgSKvhvhEqpvNhRtfu1U="
},
"lodash.isequal": {
"version": "4.5.0",
"resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz",
"integrity": "sha1-QVxEePK8wwEgwizhDtMib30+GOA="
},
"lodash.keys": {
"version": "3.1.2",
"resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-3.1.2.tgz",
......@@ -12084,18 +12051,6 @@
"scheduler": "^0.13.6"
}
},
"react-ace": {
"version": "8.0.0",
"resolved": "https://registry.npmjs.org/react-ace/-/react-ace-8.0.0.tgz",
"integrity": "sha512-EvU14vXbZpAenb1ZVKdn8yTQs/shZ9RghFulHtt67bBXT6sjrNHcfOEXHYtSEmwMb6pQVVNNuulzzd8o+Uouig==",
"requires": {
"ace-builds": "^1.4.6",
"diff-match-patch": "^1.0.4",
"lodash.get": "^4.4.2",
"lodash.isequal": "^4.5.0",
"prop-types": "^15.7.2"
}
},
"react-app-polyfill": {
"version": "0.2.2",
"resolved": "https://registry.npmjs.org/react-app-polyfill/-/react-app-polyfill-0.2.2.tgz",
......
package.json
......@@ -57,7 +57,6 @@
"qrcode": "^1.3.3",
"qs": "^6.7.0",
"react": "^16.8.6",
"react-ace": "^8.0.0",
"react-app-polyfill": "^0.2.2",
"react-copy-to-clipboard": "^5.0.1",
"react-dev-utils": "^8.0.0",
......@@ -168,7 +167,6 @@
]
},
"devDependencies": {
"@babel/runtime": "^7.7.2",
"babel-plugin-import": "^1.11.0",
"browserslist": "^4.6.6",
"caniuse-lite": "^1.0.30000989",
......
src/App.js
......@@ -32,13 +32,13 @@ class App extends Component {
pathnameBlacklist = ['/country', '/passport']
firstLoad = true
componentWillMount(){
this.getqimoClientId()
}
componentDidMount() {
this.umengStatistic()
//平台信息
cookie.set('plat', '5', {domain: '.julyedu.com'})
......@@ -166,7 +166,7 @@ class App extends Component {
return
}
http.get(`${API["passport-api"]}/m/wx_loginInfo/code/${code}?redirect=${encodeURIComponent(window.location.href)}`)
http.get(`${API['home']}/m/wx_loginInfo/code/${code}?redirect=${encodeURIComponent(window.location.href)}`)
.then(res => {
let data = res.data
if (data.errno == 200) {
......@@ -203,10 +203,6 @@ class App extends Component {
if (!this.props.user.hasError && getParam('redirect')) {
window.location.href = getParam('redirect')
}
this.QimoClient()
}
setPreviousLocation = () => {
......@@ -280,48 +276,13 @@ class App extends Component {
}
}
// 七陌客服代码 start
getqimoClientId =()=>{
http.post(`${API['home']}/qiMoUserId`)
.then(res => {
if (res.data.code == 200) {
window.qimoClientId = res.data.data.userId
}
})
.catch(function () {
})
}
QimoClient=()=>{
let utm_source = getParam('utm_source')
let utm_medium = getParam('utm_medium')
let utm_campaign = getParam('utm_campaign')
let utm_content = getParam('utm_content')
let utm_term = getParam('utm_term')
var src = ''
// 知乎投放
if (utm_term && utm_source && utm_medium && utm_campaign && utm_content) {
src = 'https://webchat.7moor.com/javascripts/7moorInit.js?accessId=e2ca4f90-2d04-11ea-84c3-43908ae47640&autoShow=true&language=ZHCN'
} else {
// m端
src = 'https://webchat.7moor.com/javascripts/7moorInit.js?accessId=fbcf9aa0-2d03-11ea-84c3-43908ae47640&autoShow=true&language=ZHCN'
}
var script = document.createElement('script')
script.type = 'text/javascript'
script.src = src
script.async = 'async'
document.body.appendChild(script)
}
// 七陌客服代码 end
render() {
return <Routes/>
return <>
<Routes/>
<Link className={'year19-index'} to="/year/yearindex">
<img src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/gift-package.png" alt=""/>
</Link>
</>
}
}
......
src/assets/css/index.scss
......@@ -512,3 +512,18 @@ input[type="radio"]:checked:before {
color: #333;
font-size: 15px;
}
.year19-index {
display: block;
width: 58px;
height: 70px;
position: fixed;
top: 50%;
right: 0;
margin-top: -35px;
z-index: 9;
img {
width: 100%;
height: 100%;
}
}
\ No newline at end of file
src/common/HeaderBar/index.js
......@@ -33,7 +33,7 @@ class HeaderBar extends Component {
}
render() {
const { toHref, home } = this.props;
const { toHref } = this.props
return (
<div className="detail-header" style={{...this.props.style}}>
{
......@@ -57,10 +57,6 @@ class HeaderBar extends Component {
this.props.delete &&
<i className='iconfont iconiconfront-56' onClick={this.props.toDelete}></i>
}
{
home &&
<i className="iconfont iconshouye-xianxing"></i>
}
</div>
);
}
......
src/common/v-list-base/index.js
......@@ -3,7 +3,7 @@ import './index.scss'
const VList = (props) => {
return (
<li className='v-list-base-item' onClick={props.handleClick.bind(this, props.id, props.item)}>
<li className='v-list-base-item' onClick={props.handleClick.bind(this, props.id)}>
<div className="content">
<div className="cover">
{props.status}
......@@ -16,4 +16,4 @@ const VList = (props) => {
);
};
export default VList;
export default VList;
\ No newline at end of file
src/components/Index/index.scss
#chatBtn {
bottom: 60px!important;
}
.index-box {
overflow: hidden;
background-color: $bg_fff;
......
src/components/activity/newyear-2019/landing/index.js
......@@ -38,7 +38,6 @@ class Landing extends Component {
}
componentDidMount() {
this.getStage();
this.fetchPageData()
window.showFollowAlert = this.remind.bind(this, 'create')
document.title = '七月在线年终大回馈，幸运宝箱随你开，100%有奖！'
......@@ -65,23 +64,8 @@ class Landing extends Component {
this.shareTipPopup && this.shareTipPopup.remove()
}
// 获取活动以及宝箱的阶段
getStage = () => {
http.get(`${API.home}/activity/stage`).then(res => {
const {code, data, msg} = res.data
if (code === 200) {
if(Number(data.activity_stage) === 0) {
this.props.history.push('/');
return;
}
} else {
Toast.info(msg, 2)
}
})
}
createMeta = (title,dec,imgname) => {
let meta = document.createElement('meta');
createMeta = (title, dec, imgname) => {
let meta = document.createElement('meta')
meta.setAttribute('name', 'description')
meta.setAttribute('itemprop', 'description')
meta.setAttribute('content', dec)
......
src/components/activity/newyear-2019/myTreasure/index.js
......@@ -51,8 +51,6 @@ class MyTreasure extends Component {
const {userInfo} = nextProp
if (!userInfo.uid) {
history.push('/passport')
}else {
this.fetchMyTreasure();
}
}
......@@ -309,10 +307,6 @@ class MyTreasure extends Component {
http.get(`${API.home}/activity/stage`).then(res => {
const {code, data} = res.data
if (code === 200) {
if(Number(data.activity_stage) === 0) {
this.props.history.push('/');
return;
}
// treasure_stage，宝箱阶段，0-不在活动时间，1-活动时间内
if (data.treasure_stage === 0) {
this.startCountDown()
......
src/components/activity/newyear-2019/preheat/LiveRoom/index.js
......@@ -66,7 +66,7 @@ class LiveRoom extends Component {
}
});
}
}
// 已预约 给提示
tip = () => {
......@@ -88,7 +88,7 @@ class LiveRoom extends Component {
this.toLogin();
}else{
const vCourseId = url.split('/')[0];
window.location.href = `/play/video?id=${vCourseId}`
history.push(`/play/video?id=${vCourseId}`)
}
}
// 关闭弹框
......@@ -140,7 +140,7 @@ class LiveRoom extends Component {
</CommonPopup>
)
}
<CommonContainer title='大咖直播' id="year-live">
<ul className='live__list'>
{
......@@ -177,7 +177,7 @@ class LiveRoom extends Component {
item.on_live == 0 && item.is_end == 0 && item.is_subscribe == 1 && (
<span onClick={this.tip} className="order__btn subscribed">已预约</span>
)
}
}
{
item.on_live == 1 && item.is_end == 0 && (
<span onClick={()=>this.toLivingRoom(item.room_url)} className="order__btn living">正在直播</span>
......
src/components/activity/newyear-2019/preheat/YearCourse/index.js
......@@ -605,46 +605,27 @@ class YearCourse extends Component {
removable,
sum,
} = this.state
const { stage,treasureStage } = this.props
const { stage } = this.props
return (
<div className={'year-index-course'}>
{/*浮框*/}
{
Number(treasureStage) === 1 &&
<div className='nav-right'>
<span onClick={this.toBoxList} className='nav-right__link'>
<div className='nav-right'>
<span onClick={this.toBoxList} className='nav-right__link'>
未开宝箱
{
removable > 0 &&
<i className="nav-right__number">{removable}</i>
}
</span>
<a onClick={() => this.toYearWish()} className='nav-right__link'>
心愿单
{
sum > 0 &&
<i className="nav-right__number">{sum}</i>
}
</a>
</div>
}
{
Number(treasureStage) === 0 &&
<div className='nav-right-wish nav-right'>
<a onClick={() => this.toYearWish()} className='nav-right__link'>
心愿单
{
sum > 0 &&
<i className="nav-right__number">{sum}</i>
}
</a>
</div>
}
{
removable > 0 &&
<i className="nav-right__number">{removable}</i>
}
</span>
<a onClick={() => this.toYearWish()} className='nav-right__link'>
心愿单
{
sum > 0 &&
<i className="nav-right__number">{sum}</i>
}
</a>
</div>
{/* 重磅好课 */}
<CommonContainer title='重磅好课' id='year-course'>
......@@ -692,60 +673,57 @@ class YearCourse extends Component {
</CommonContainer>
{/* 人气好课免费学 */}
{
Number(stage) !== 3 &&
<CommonContainer title='人气好课免费学' id='year-free'>
<a className='boss__add' href="/active/givecourse?activename=shuangdan">更有42本技术书籍免费送</a>
{
(freecourse.course && freecourse.course.length > 0) &&
<>
<div className='freecourse course-box'>
{
freecourse.course.map(item => (
<CourseItem
image={item.image_name}
key={item.course_id}
id={item.course_id}
toCourse={this.toCourse}
>
<div className="coupon-course__footer">
{
item.is_buy == 1 &&
<a
onClick={() => this.toCourse(item.course_id)}
className="btn to-study"
>开始学习</a>
}
{
item.is_buy == 0 &&
<a
onClick={() => this.freeStudy()}
className="btn free-study"
>点击免费学</a>
}
<p className="free-course-num">
已送出<span>{item.act_num}</span>个课程
</p>
</div>
</CourseItem>
))
}
</div>
<CommonContainer title='人气好课免费学' id='year-free'>
<a className='boss__add' href="/active/givecourse?activename=shuangdan">更有42本技术书籍免费送</a>
{
(freecourse.course && freecourse.course.length > 0) &&
<>
<div className='freecourse course-box'>
{
(freecourse.courseList && freecourse.courseList.length > 4) &&
<button
className="more-button"
onClick={() => this.handleToMore('freecourse')}
>{freecourse.isMore ? '查看更多' : '收起'}</button>
freecourse.course.map(item => (
<CourseItem
image={item.image_name}
key={item.course_id}
id={item.course_id}
toCourse={this.toCourse}
>
<div className="coupon-course__footer">
{
item.is_buy == 1 &&
<a
onClick={() => this.toCourse(item.course_id)}
className="btn to-study"
>开始学习</a>
}
{
item.is_buy == 0 &&
<a
onClick={() => this.freeStudy()}
className="btn free-study"
>点击免费学</a>
}
<p className="free-course-num">
已送出<span>{item.act_num}</span>个课程
</p>
</div>
</CourseItem>
))
}
</>
}
</CommonContainer>
}
</div>
{
(freecourse.courseList && freecourse.courseList.length > 4) &&
<button
className="more-button"
onClick={() => this.handleToMore('freecourse')}
>{freecourse.isMore ? '查看更多' : '收起'}</button>
}
</>
}
</CommonContainer>
{/* stage，活动阶段 0-不在活动时间 1-预热 2-正式 3-返场 */}
{
Number(stage) !== 1 &&
Number(stage) === 2 &&
<>
{/* 精品好课1分开抢 */}
<CommonContainer title='精品好课1分开抢' id='year-group'>
......@@ -1020,7 +998,7 @@ class YearCourse extends Component {
</>
}
{
Number(stage) === 1 &&
Number(stage) !== 2 &&
<>
{/* 精品好课1分开抢 */}
<CommonContainer title='精品好课1分开抢' id='year-group'>
......
src/components/activity/newyear-2019/preheat/YearCourse/index.scss
......@@ -296,7 +296,7 @@
.groupcourse[data-stage="2"] .course-container {
height: 215px;
}
.progree-and-sale {
display: flex;
......@@ -416,12 +416,5 @@
line-height: 14px;
}
}
.nav-right-wish {
background-image: url("https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/fanc-bx.png");
.nav-right__link{
top: 60px;
left: 10px;
}
}
}
\ No newline at end of file
src/components/activity/newyear-2019/preheat/index.js
......@@ -110,25 +110,11 @@ export default class index extends Component {
http.get(`${API.home}/activity/stage`).then(res => {
const {code, data, msg} = res.data
if (code === 200) {
if(Number(data.activity_stage) === 0) {
this.props.history.push('/');
return;
}
// treasure_stage，宝箱阶段，0-不在活动时间，1-活动时间内
this.setState({
activity_stage: data.activity_stage,
treasure_stage: data.treasure_stage
})
if(data.activity_stage == 3){
this.setState({
banner: 'https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/m_banner_fc.png',
})
} else {
this.setState({
banner: 'https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/m_banner_bj%402x.png',
})
}
} else {
Toast.info(msg, 2)
}
......@@ -137,8 +123,8 @@ export default class index extends Component {
render() {
const {
banner,
activity_stage,
banner,
activity_stage,
treasure_stage,
} = this.state
return (
......@@ -147,7 +133,7 @@ export default class index extends Component {
<div id="banner" className="banner-treasure__header"
style={{backgroundImage: `url(${banner})`}}></div>
<div className="banner-treasure__nav">
<TreasureNav id="banner" treasure_stage={treasure_stage} activeStage={activity_stage}/>
<TreasureNav id="banner" treasure_stage={treasure_stage}/>
</div>
<div className="banner-treasure__decorate"></div>
</div>
......@@ -157,12 +143,12 @@ export default class index extends Component {
{/* 组队开宝箱 */}
{
treasure_stage === 1 &&
treasure_stage === 1 &&
<TreasureBox isAppUpdate={this.state.isAppUpdate} getRemovable={this.getRemovable}/>
}
{/* 课程 */}
<YearCourse stage={activity_stage} treasureStage={treasure_stage} isAppUpdate={this.state.isAppUpdate} />
<YearCourse stage={activity_stage} isAppUpdate={this.state.isAppUpdate} />
{/*好友加入队伍提醒；获得宝箱提醒；开售提醒弹窗，需要自取，注意修改文案*/}
{
......@@ -195,9 +181,6 @@ export default class index extends Component {
</div>
</CommonPopup>
}
<div className={'btm-rule'}>* 本活动解释权归北京七月在线科技有限公司所有 *</div>
</div>
)
}
......
src/components/activity/newyear-2019/preheat/index.scss
......@@ -59,12 +59,6 @@
}
}
.btm-rule {
color: #fff;
font-size: 12px;
width: 100%;
text-align: center;
}
}
.year-index + .year19-index {
......
src/components/activity/newyear-2019/preheat/nav.js
......@@ -48,22 +48,21 @@ class TreasureNav extends Component {
}
componentWillReceiveProps(nextProps) {
this.initNav(nextProps.treasure_stage,nextProps.activeStage);
this.initNav(nextProps.treasure_stage);
}
initNav = (treasure_stage,activeStage) => {
initNav = (treasure_stage) => {
let {navs} = this.state;
// treasure_stage，宝箱阶段，0-不在活动时间，1-活动时间内
let data = this.state.navs
if(treasure_stage === 0) {
data = navs.filter(item => item.id !== 'year-treasure')
}
if(activeStage === 3) {
data = data.filter(item => item.id !== 'year-free')
this.setState({
formatNavs: navs.filter(item => item.id !== 'year-treasure')
});
}else {
this.setState({
formatNavs: navs
})
}
this.setState({
formatNavs: data
})
}
calcNavActive = () => {
......@@ -109,9 +108,9 @@ class TreasureNav extends Component {
<div className={classnames("treasure-nav", {'fixed': isFixed})} data-skip="nav">
{
formatNavs.map((item, index) => (
<a
href={`#${item.id}`}
className={classnames("treasure-nav__item", {'active': index === curIndex})}
<a
href={`#${item.id}`}
className={classnames("treasure-nav__item", {'active': index === curIndex})}
key={item.id}
onClick={() => this.selectToNav(index)}
>{item.name}</a>
......
src/components/activity/newyear-2019/year-wish/index.js
......@@ -46,11 +46,6 @@ class YarnWish extends Component {
http.get(`${API.home}/activity/stage`).then(res => {
const {code, data} = res.data
if (code === 200) {
if(Number(data.activity_stage) === 0) {
this.props.history.push('/');
return;
}
this.setState({
activityStage: data.activity_stage // 0-不在活动时间 1-预热 2-正式 3-返场
})
......@@ -154,25 +149,25 @@ class YarnWish extends Component {
list.length > 0
? <>
{
activityStage !== 1 &&
activityStage === 2 &&
<>
<CommonContainer>
<div className='groupcourse course-box'>
{
list.map(item => (
<CourseItem
image={item.image_name}
key={item.course_id}
<CourseItem
image={item.image_name}
key={item.course_id}
id={item.course_id}
time={item.type === 2 || item.type === 7? item.end_time : ''}
toCourse={this.toCourse}
>
{/*
{/*
* 拼团，正常：未开团1 已开2；一分：未开团5 已开7
* type 1 立即参团 2 已参团 3 我要砍价 4 已参加砍价 可以继续砍价 5 马上抢 6 开始学习 7 已参加一分钱拼团 8 砍价待支付
*/}
<div className="coupon-course__footer">
{
......@@ -311,7 +306,7 @@ class YarnWish extends Component {
}
{
item.type === 6 &&
<a
<a
onClick={() => this.toCourse(item.course_id)}
className="btn to-group"
data-status="study"
......@@ -327,15 +322,15 @@ class YarnWish extends Component {
</>
}
{
activityStage === 1 &&
activityStage !== 2 &&
<>
<CommonContainer>
<div className='groupcourse course-box'>
{
list.map(item => (
<CourseItem
image={item.image_name}
key={item.course_id}
<CourseItem
image={item.image_name}
key={item.course_id}
id={item.course_id}
toCourse={this.toCourse}
>
......@@ -348,7 +343,7 @@ class YarnWish extends Component {
item.is_buy == 1 &&
<>
<p className={'course-title text-overflow-1'}>{item.course_title}</p>
<a
<a
onClick={() => this.toCourse(item.course_id)}
className="btn to-study"
>开始学习</a>
......@@ -387,7 +382,7 @@ class YarnWish extends Component {
<span className="old-price">{item.type == 2 ? '' : '现价：'}<s>¥{item.price1}</s></span>
</div>
<div className="status">
<a
<a
onClick={() => this.toCourse(item.course_id)}
className="status-btn to-buy"
>直接购买</a>
......@@ -430,7 +425,7 @@ class YarnWish extends Component {
<div className="notData">
<img src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/PC/icon-empty.png" alt=""/>
{
activityStage == 1
activityStage == 1
? <p>你的心愿单目前空空如也，<br/>快去挑选更多优惠课程吧～</p>
: <p>你的心愿单没有课程哦，<br/>感兴趣的课程可在双旦主会场直接购买！</p>
}
......
src/components/detail/btnstatus/index.js
......@@ -23,7 +23,7 @@ class BtnStatus extends Component {
bindPhone: false,
bindConfrm: false,
bindInfo: {}, // 冲突信息
formInfo: {},
formInfo: {},
}
}
......@@ -314,17 +314,14 @@ class BtnStatus extends Component {
});
}
qimoChatClick=()=>{
qimoChatClick()
}
render() {
// data 课程信息；barInfo 砍价信息
const { user = {}, toCart, country } = this.props;
const {
const {
countdown,
barInfo,
courseInfo: info = {},
bindPhone,
barInfo,
courseInfo: info = {},
bindPhone,
bindConfrm,
bindInfo,
formInfo,
......@@ -334,7 +331,7 @@ class BtnStatus extends Component {
<div>
{/* 绑定手机号 */}
<Mask visible={bindPhone} handleToHide={() => this.handleToHide('bindPhone')}>
<BindPhone
<BindPhone
country={country}
handleToBargain={this.toKanjia}
confirmBindPhone={this.confirmBindPhone}
......@@ -343,19 +340,19 @@ class BtnStatus extends Component {
{/* 绑定手机号--确认 */}
<Mask visible={bindConfrm} handleToHide={() => this.handleToHide('bindConfrm')}>
<BargainConfirmBind
<BargainConfirmBind
data={formInfo}
bindInfo={bindInfo}
handleToHide={() => this.handleToHide('bindConfrm')}
handleToBargain={this.toKanjia}
/>
</Mask>
{/*正常购买*/}
{
info.is_baoming === 0 && info.group_status !== 3 &&
<div className='btns-box'>
<a className='consult consult-s' onClick={()=>this.qimoChatClick()}>
<a className='consult consult-s' href="https://q.url.cn/AB8aue?_type=wpa&qidian=true">
<i className='iconfont iconerji'></i>
<span>课程咨询</span>
</a>
......@@ -376,7 +373,7 @@ class BtnStatus extends Component {
{
info.is_baoming === 0 && info.is_deposit != 0 &&
<div className='btns-box'>
<a className='consult consult-m' onClick={()=>this.qimoChatClick()}>
<a className='consult consult-m' href="https://q.url.cn/AB8aue?_type=wpa&qidian=true">
<i className='iconfont iconerji' />
<span>课程咨询</span>
</a>
......@@ -390,7 +387,7 @@ class BtnStatus extends Component {
{
info.is_baoming === 1 &&
<div className='btns-box'>
<a className='consult consult-m' onClick={()=>this.qimoChatClick()}>
<a className='consult consult-m' href="https://q.url.cn/AB8aue?_type=wpa&qidian=true">
<i className='iconfont iconerji' />
<span>课程咨询</span>
</a>
......@@ -403,7 +400,7 @@ class BtnStatus extends Component {
{
info.is_baoming === 0 && info.group_status === 3 &&
<div className='btns-box'>
<a className='consult consult-s' onClick={()=>this.qimoChatClick()}>
<a className='consult consult-s' href="https://q.url.cn/AB8aue?_type=wpa&qidian=true">
<i className='iconfont iconerji'></i>
<span>课程咨询</span>
</a>
......@@ -424,7 +421,7 @@ class BtnStatus extends Component {
{
info.is_baoming === 0 && info.group_status === 4 &&
<div className='btns-box'>
<a className='consult consult-s' onClick={()=>this.qimoChatClick()}>
<a className='consult consult-s' href="https://q.url.cn/AB8aue?_type=wpa&qidian=true">
<i className='iconfont iconerji'></i>
<span>课程咨询</span>
</a>
......@@ -438,7 +435,7 @@ class BtnStatus extends Component {
{
info.is_baoming === 0 && this.props.data && this.props.data.is_bargain &&
<div className='btns-box'>
<a className='consult consult-s' onClick={()=>this.qimoChatClick()}>
<a className='consult consult-s' href="https://q.url.cn/AB8aue?_type=wpa&qidian=true">
<i className='iconfont iconerji'></i>
<span>课程咨询</span>
</a>
......@@ -466,7 +463,7 @@ class BtnStatus extends Component {
{
this.state.isbuy === 20 &&
<div className='btns-box'>
<a className='consult-l' onClick={()=>this.qimoChatClick()}>
<a className='consult-l' href="https://q.url.cn/AB8aue?_type=wpa&qidian=true">
<i className='iconfont iconerji'></i>
<span>课程咨询</span>
</a>
......@@ -477,7 +474,7 @@ class BtnStatus extends Component {
{
(info.is_aist && (this.props.user.hasError || info.is_baoming === 0)) &&
<div className='btns-box'>
<a className='consult consult-m' onClick={()=>this.qimoChatClick()}>
<a className='consult consult-m' href="https://q.url.cn/AB8aue?_type=wpa&qidian=true">
<i className='iconfont iconerji'></i>
<span>课程咨询</span>
</a>
......@@ -491,7 +488,7 @@ class BtnStatus extends Component {
{
info.is_aist && !this.props.user.hasError && info.is_baoming === 1 &&
<div className='btns-box'>
<a className='consult consult-m' onClick={()=>this.qimoChatClick()}>
<a className='consult consult-m' href="https://q.url.cn/AB8aue?_type=wpa&qidian=true">
<i className='iconfont iconerji'></i>
<span>课程咨询</span>
</a>
......
src/components/detail/index.js
......@@ -340,10 +340,6 @@ class Detail extends Component {
course: data
});
if (data.course_info) {
if(data.course_info.is_it_course == 1){
this.props.history.push(`/python?id=${id}`)
}
let course_info = data.course_info;
document.title = `${course_info.course_title} - 七月在线`;
if (course_info.group_status === 3 || course_info.group_status === 4) {
......
src/components/python/index.js deleted 100644 → 0
import React, {Component} from 'react'
import {http, getParam, SendMessageToApp} from '@/utils'
import PythonDes from './pythomDes'
import PythonStudy from './pythonStudy'
import {connect} from "react-redux"
import {addDays} from "date-fns"
import cookie from "js-cookie"
import {setCurrentUser, startFetchUser} from "@/store/userAction"
@connect(state => ({
user: state.user
}),
{setCurrentUser, startFetchUser}
)
class Python extends Component {
constructor(props) {
super(props)
this.state = {
isPay: '',
userInfoList: [],
isAppUpdate: false
}
}
componentDidMount() {
const _this = this
this.fetchCourseInfo()
// 获取App登录信息
window['loginInfo'] = result => {
_this.loginInfo(result)
}
}
// 获取app登录数据
loginInfo = (result) => {
this.setState({
userInfoList: result
}, () => {
if (this.state.userInfoList.length) {
this.props.startFetchUser()
this.appLogin()
}
})
}
// 保存cookie
appLogin = () => {
let expires = addDays(new Date(), 90)
this.state.userInfoList.map((item, index) => {
cookie.set("token", item.token, {expires, path: '/', domain: '.julyedu.com'})
cookie.set("plat", item.plat, {expires, path: '/', domain: '.julyedu.com'})
cookie.set("uid", item.uid, {expires, path: '/', domain: '.julyedu.com'})
cookie.set("uname", item.uname, {expires, path: '/', domain: '.julyedu.com'})
cookie.set("avatar_file", item.avatar_file, {expires, path: '/', domain: '.julyedu.com'})
})
if (cookie.get("token") && cookie.get("uid")) {
this.setState({
isAppUpdate: true
})
}
this.props.setCurrentUser(this.transformUser(this.state.userInfoList))
}
transformUser = res => {
let payload
res.map((item, index) => {
payload = {
hasError: false,
data: {
username: item.uname,
avatar: item.avatar_file,
token: item.token,
uid: item.uid
},
isFetching: false
}
})
return payload
}
fetchCourseInfo = () => {
const id = getParam('id')
http.get(`${API.home}/m/course/detail/${id}`).then((res) => {
const {data, code} = res.data
if (code === 200) {
this.setState({
isPay: data.course_info.is_pay
})
}
})
}
render() {
const {isPay, isAppUpdate} = this.state
return (
<div>
{
isPay === 0 && <PythonDes history={this.props.history} isAppUpdate={isAppUpdate}></PythonDes>
}
{
(isPay === 1 && !getParam('version')) && <PythonStudy isAppUpdate={isAppUpdate}/>
}
</div>
)
}
}
export default Python
src/components/python/poup/index.js deleted 100644 → 0
import React, { Component } from 'react'
import './index.scss'
import {CallApp} from './../../../common'
export default class Poup extends Component {
render() {
return (
<div className={'mask_container'}>
<div className={'content'}>
<p className={'title'}>温馨提示</p>
{
this.props.type === 1 ? (
<>
<p className={'tip'}>当前环境暂不支持该课程模式，您可前往七月在线PC端或者APP体验课程。</p>
<CallApp className='btn btn-18B4ED' text={'前往APP体验课程'}></CallApp>
</>
) : (
<>
<p className={'tip'}>当前环境暂不支持该课程模式，您可前往七月在线PC端或者APP学习课程。</p>
<CallApp className='btn btn-18B4ED' text={'前往APP学习课程'}></CallApp>
</>
)
}
<img onClick={this.props.closePop} className={'close_btn'} src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/h5_python_class/bottom_close.png" alt=""/>
</div>
</div>
)
}
}
src/components/python/poup/index.scss deleted 100644 → 0
.mask_container {
position: fixed;
left: 0;
bottom: 0;
right: 0;
top: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.8);
z-index: 100;
.close_btn {
width: 30px;
height: 30px;
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: -62px;
}
.content {
width: 300px;
height: 196px;
background: rgba(255, 255, 255, 1);
border-radius: 4px;
position: absolute;
left: 50%;
transform: translateX(-50%);
top: 170px;
.title {
font-size: 18px;
line-height: 18px;
color: rgba(0, 153, 255, 1);
margin: 24px auto 0;
text-align: center;
}
.tip {
font-size: 14px;
color: rgba(102, 102, 102, 1);
line-height: 20px;
margin: 20px auto 0;
width: 260px;
}
.btn {
width: 260px;
height: 36px;
line-height: 36px;
text-align: center;
background: rgba(0, 153, 255, 1);
border-radius: 3px;
font-size: 16px;
color: rgba(255, 255, 255, 1);
margin: 36px auto 0;
}
}
}
src/components/python/pythomDes/Description/index.js deleted 100644 → 0
import React, { Component } from 'react'
import './index.scss'
export default class Description extends Component {
render() {
return (
<div className={'description'}>
<img className={'left'} src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/h5_python_class/left.png" alt=""/>
<img className={'right'} src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/h5_python_class/right.png" alt=""/>
<p className={'title'}>课 / 程 / 介 / 绍</p>
<p className={'sub__title'}>对话式交互教学+课后实操，17节课全面掌握Python基础语法</p>
<img src={'https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/h5_python_class/diannao.png'} />
{
this.props.list.map((item, index)=>{
return <DesList item={item} key={index}></DesList>
})
}
</div>
)
}
}
function DesList(props) {
const {url, title, subTitle} = props.item;
return (
<div className={'des__container'}>
<img src={url} alt=""/>
<div>
<p className={'item__title'}>{title}</p>
<p className={'item__sub'}>{subTitle}</p>
</div>
</div>
)
}
src/components/python/pythomDes/Description/index.scss deleted 100644 → 0
.description {
width: 100%;
background: #0099ff;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
padding: 32px 0 38px 0;
position: relative;
.left {
position: absolute;
width: 50px;
height: 144px;
left: 0;
top: 18px;
}
.right {
position: absolute;
right: 0;
bottom: 4px;
width: 48px;
height: 132px;
}
.title {
font-size: 22px;
font-weight: 600;
color: rgba(255, 255, 255, 1);
margin-bottom: 12px;
}
.sub__title {
font-size: 12px;
font-weight: 300;
color: rgba(255, 255, 255, 1);
margin-bottom: 40px;
}
img {
width: 290px;
height: 170px;
}
.des__container {
width: 100%;
height: 64px;
display: flex;
justify-content: flex-start;
align-items: center;
padding-left: 50px;
margin-top: 28px;
img {
width: 64px;
height: 64px;
margin-right: 12px;
}
.item__title {
font-size: 16px;
font-weight: 600;
color: rgba(255, 255, 255, 1);
margin-bottom: 10px;
line-height: 16px;
}
.item__sub {
font-size: 12px;
font-weight: 400;
color: rgba(255, 255, 255, 1);
line-height: 12px;
}
}
}
src/components/python/pythomDes/Experience/index.js deleted 100644 → 0
import React, { Component } from 'react'
import './index.scss'
export default class Experience extends Component {
render() {
const { isOnline, tryLearn } = this.props;
return (
<div className={'experience_container'}>
<p className={'title'}>试 / 学 / 体 / 验</p>
{
isOnline
? (
<>
<div className={'experience'}>
<img src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/h5_python_class/L%402x.png" alt=""/>
<div>
<p>限时福利免费试学</p>
<p>开始颠覆你想象的学习</p>
</div>
<img src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/h5_python_class/r%402x.png" alt=""/>
</div>
<div className={'btn'} onClick={tryLearn}>立即体验</div>
</>
)
: (
<>
<div className={'experience'}>
<img src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/h5_python_class/L%402x.png" alt=""/>
<div>
<p>上架后可免费试学</p>
<p>体验颠覆你想象的学习</p>
</div>
<img src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/h5_python_class/r%402x.png" alt=""/>
</div>
<div className={'btn btn--online'}>即将上架敬请期待</div>
</>
)
}
</div>
)
}
}
src/components/python/pythomDes/Experience/index.scss deleted 100644 → 0
.experience_container {
padding-top: 32px;
padding-bottom: 40px;
.title {
font-size: 22px;
line-height: 22px;
font-weight: 600;
color: rgba(0, 153, 255, 1);
text-align: center;
}
.experience {
display: flex;
justify-content: space-between;
align-items: center;
width: 250px;
margin: 22px auto 28px;
img {
width: 16px;
height: 56px;
}
p {
font-size: 16px;
font-weight: 600;
color: rgba(82, 92, 101, 1);
line-height: 30px;
text-align: center;
letter-spacing: 4px;
}
}
.btn {
width: 150px;
height: 36px;
margin: 0 auto;
border-radius: 18px;
font-size: 16px;
font-weight: 600;
color: rgba(255, 255, 255, 1);
text-align: center;
line-height: 36px;
background: rgba(0, 153, 255, 1);
box-shadow: 0px 6px 12px 0px rgba(0, 153, 255, 0.06);
}
.btn--online {
width: 200px;
font-size: 15px;
color: #fff;
letter-spacing: 4px;
background-color: rgba(82,92,101,.6);
}
}
src/components/python/pythomDes/NoWorry/index.js deleted 100644 → 0
import React, { Component } from 'react'
import './index.scss'
export default class NoWorry extends Component {
render() {
return (
<div className={'worry__container'}>
<img className={'left'} src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/h5_python_class/worry_left.png" alt=""/>
<p className={'title'}>你 / 的 / 担 / 忧</p>
<p className={'sub__title'}>全新的课程形式，轻松、有趣的课程内容，解除你所有的担忧</p>
{
this.props.list.map((item, index)=>{
return (
<WorryItem item={item} key={index}></WorryItem>
)
})
}
</div>
)
}
}
function WorryItem(props) {
const {url, title, subTitle} = props.item
return (
<div className={'item__container'}>
<div className={'head'}></div>
<img src={url} alt=""/>
<p className={'title'}>{title}</p>
<p className={'des'}>{subTitle}</p>
</div>
)
}
src/components/python/pythomDes/NoWorry/index.scss deleted 100644 → 0
.worry__container {
padding: 32px 0 44px 0;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
position: relative;
.left {
position: absolute;
left: 0;
top: 150px;
width: 40px;
height: 220px;
}
.title {
font-size: 22px;
line-height: 22px;
font-weight: 600;
color: rgba(0, 153, 255, 1);
margin-bottom: 12px;
}
.sub__title {
font-size: 12px;
line-height: 12px;
font-weight: 300;
color: rgba(0, 153, 255, 1);
margin-bottom: 40px;
}
.item__container {
width: 310px;
height: 214px;
background: rgba(255, 255, 255, 1);
box-shadow: 0px 6px 12px 0px rgba(0, 0, 0, 0.03);
border-radius: 4px;
margin-bottom: 22px;
display: flex;
flex-direction: column;
justify-content: flex-start;
padding: 0 26px;
align-items: center;
z-index: 9;
.head {
width: 310px;
height: 4px;
background: rgba(0, 153, 255, 1);
border-radius: 4px 4px 0 0;
margin-bottom: 12px;
}
img {
width: 58px;
height: 58px;
}
.title {
font-size: 16px;
line-height: 16px;
font-weight: 600;
color: rgba(82, 92, 101, 1);
margin: 16px 0 12px 0;
}
.des {
font-size: 12px;
font-weight: 400;
color: rgba(82, 92, 101, 1);
line-height: 20px;
}
}
}
src/components/python/pythomDes/Progream/index.js deleted 100644 → 0
import React, { Component } from 'react'
import './index.scss'
export default class Progream extends Component {
constructor(props) {
super(props);
this.state = {
list: [
{
q: '课程学习周期是多久？',
a: '每天学习1小时，课程采用通关制解锁的方式，根据自己的时间和学习速度灵活调整。'
},{
q: '我没有Python基础可以学习吗？',
a: '我们的课程是面向零基础的小伙伴设计的，课程通过故事叙述的方式由浅入深，层层递进，尽可能帮助大家理解并且掌握所学知识，没有任何基础是可以学习的。'
},{
q: '学习过程中遇到了困难怎么办？',
a: '我们为学员配备了专门的助教，有问题随时可以咨询助教老师。'
},{
q: '需要自己安装代码运行环境吗？',
a: '在平台上学习不需要安装任何环境，该课程包含的知识点实操以及课后实操都可以在平台上完成。'
}
]
}
}
render() {
const {list} = this.state;
return (
<div className={'pro_container'}>
<img src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/h5_python_class/pro_left.png" alt=""/>
<p>常 / 见 / 问 / 题</p>
<ul>
{
list.map((item, index)=>{
return (<li key={index} className={'q_item'}>
<div className={'q'}> <p>{`Q：${item.q}`}</p> <span></span></div>
<div className={'a__container'}>
<div>A：</div>
<p>{item.a}</p>
</div>
</li>)
})
}
</ul>
</div>
)
}
}
src/components/python/pythomDes/Progream/index.scss deleted 100644 → 0
.pro_container {
padding-top: 32px;
padding-bottom: 30px;
background: #0096ff;
position: relative;
img {
position: absolute;
width: 76px;
height: 174px;
left: 0;
bottom: 50px;
}
p {
font-size: 22px;
line-height: 22px;
font-weight: 600;
color: rgba(255, 255, 255, 1);
text-align: center;
}
.q_item {
width: 340px;
min-height: 86px;
background: rgba(255, 255, 255, 1);
box-shadow: 0px 0px 5px 0px rgba(153, 153, 153, 0.06);
border-radius: 2px;
margin: 0 auto 12px;
padding: 14px 15px 10px;
&:first-child {
margin-top: 18px;
}
.q {
position: relative;
display: inline-block;
p {
font-size: 14px;
line-height: 14px;
font-weight: 600;
color: rgba(82, 92, 101, 1);
text-align: left;
z-index: 9;
position: relative;
}
span {
position: absolute;
width: 70%;
height: 4px;
background:rgba(255,214,103,1);
left: 0;
bottom: 0;
z-index: 0;
}
}
.a__container {
display: flex;
justify-content: flex-start;
align-content: flex-start;
margin-top: 10px;
div {
font-size: 12px;
color:rgba(82,92,101,1);
font-weight:600;
}
p {
font-size: 12px;
font-weight: 400;
color: rgba(82, 92, 101, 0.8);
line-height: 16px;
text-align: left;
}
}
}
}
src/components/python/pythomDes/Study/index.js deleted 100644 → 0
import React, { Component } from 'react'
import './index.scss'
export default class Study extends Component {
Change = (data) => {
let cn = ["一", "二", "三", "四", "五", "六", "七", "八", "九", '十'];
let newStr = ''
let str = data.toString()
let ci = Number(str) % 10
let cs = Math.floor(Number(str) / 10)
let cv = ''
if (str.length > 1) {
if(cs==1){
cv = ci >= 1 ? cn[9] + cn[ci - 1] : cn[9]
} else {
cv = ci > 1 ? cn[cs - 1] + cn[9] + cn[ci - 1] : cn[cs - 1] + cn[9]
}
} else {
cv = cn[ci - 1]
}
newStr = str.replace(str, cv)
return newStr;
}
render() {
return (
<div className={'study__container'}>
<img className={'learn_left'} src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/h5_python_class/learn_left.png" alt=""/>
<img className={'learn_bottom'} src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/h5_python_class/learn_bottom.png" alt=""/>
<p className={'title'}>阶 / 梯 / 学 / 习</p>
<p className={'sub__title'}>17节课堂教学，带你掌握Python技术入门知识</p>
<div className={'step__container'}>
<div className={'item__container'}>
<img src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/h5_python_class/wanzheng.png" alt=""/>
<p>完整的Python基础知识体系</p>
<div className={'item__line'}></div>
</div>
<div className={'item__container'}>
<img src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/h5_python_class/siwei.png" alt=""/>
<p>灵活的编程思维和实操技巧</p>
<div className={'item__line'}></div>
</div>
<div className={'item__container'}>
<img src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/h5_python_class/shicao.png" alt=""/>
<p>丰富有趣的实操训练</p>
</div>
</div>
<div className={'table__container'}>
<div className={'table__head'}>
<div className={'head_title order_number'}>序号</div>
<div className={'head_title chapter'}>章节</div>
<div className={'head_title points'}>知识点</div>
</div>
<div className={'table__body'}>
{
this.props.syllabus.map((item, index)=>{
return (
<div className={'item__container'} key={index}>
<div className={'item__title'}>{
'第' + this.Change(index + 1) + '阶段 ' +item.name}</div>
{
item.lessons.map((item, index)=>{
return (
<div className={'item__content'} key={index}>
<div className={'content order_number number_center'}>{item.number}</div>
<div className={'content chapter'}>{item.name}</div>
<div className={'content points'}>{item.info.name}</div>
</div>
)
})
}
</div>
)
})
}
</div>
<div className={'table__bottom'}>
{
this.props.allSyllabusShow ? (
<div onClick={() => this.props.hide(1)}>
<p>收起</p>
<img src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/h5_python_class/shouqi.png" alt=""/>
</div>
) : (
<div onClick={() => this.props.show(1)}>
<p>展开更多</p>
<img src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/h5_python_class/zhankai.png" alt=""/>
</div>
)
}
</div>
</div>
</div>
)
}
}
src/components/python/pythomDes/Study/index.scss deleted 100644 → 0
.study__container {
background: #0096ff;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
padding: 32px 0 30px 0;
position: relative;
.learn_left {
position: absolute;
left: 0;
top: 36px;
width: 46px;
height: 126px;
}
.learn_bottom {
position: absolute;
left: 0;
bottom: 0;
width: 156px;
height: 234px;
}
.title {
font-size: 20px;
font-weight: 600;
color: rgba(255, 255, 255, 1);
line-height: 20px;
}
.sub__title {
font-size: 12px;
line-height: 12px;
font-weight: 300;
color: rgba(255, 255, 255, 1);
margin: 12px 0 22px 0;
}
.step__container {
display: flex;
flex-direction: row;
justify-content: space-around;
align-items: center;
position: relative;
.item__container {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
margin-left: 28px;
width: 80px;
position: relative;
&:first-child {
margin-left: 0;
}
img {
width: 34px;
height: 34px;
margin-bottom: 10px;
}
p {
text-align: center;
font-size: 12px;
line-height: 12px;
font-weight: 400;
color: rgba(255, 255, 255, 1);
line-height: 16px;
}
.item__line {
width: 34px;
height: 1px;
background: rgba(255, 255, 255, 1);
opacity: 0.4;
border-radius: 0px;
position: absolute;
top: 18px;
right: -34px;
}
}
}
.table__container {
width: 358px;
color: #fff;
background: #005ac6;
margin-top: 22px;
position: relative;
.order_number {
width: 50px;
}
.chapter {
width: 158px;
border-left: 1px solid #0099ff;
border-right: 1px solid #0099ff;
}
.points {
width: 150px;
}
.table__head {
width: 100%;
height: 32px;
background: #ffd75d;
display: flex;
justify-content: space-between;
align-items: center;
border-radius: 4px 4px 0 0;
.head_title {
height: 32px;
display: flex;
justify-content: center;
align-items: center;
font-size: 12px;
font-weight: 600;
color: rgba(0, 93, 195, 1);
}
}
.table__body {
width: 100%;
.item__container {
.item__title {
height: 36px;
display: flex;
justify-content: center;
align-items: center;
font-size: 14px;
font-weight: 500;
color: rgba(255, 214, 103, 1);
}
}
.item__content {
display: flex;
justify-content: space-between;
align-items: center;
border-top: 1px solid #0099FF;
&:last-child {
border-bottom: 1px solid #0099FF;
}
.content {
height: 36px;
box-sizing: border-box;
display: flex;
justify-content: flex-start;
align-items: center;
padding-left: 6px;
padding-right: 6px;
}
.number_center {
display: flex;
justify-content: center;
padding-left: 0;
}
}
}
.table__bottom {
height: 36px;
display: flex;
justify-content: center;
align-items: center;
color: #fff;
font-size: 12px;
font-weight: 400;
div {
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
}
img {
width: 9px;
height: 9px;
margin-left: 6px;
}
}
}
}
src/components/python/pythomDes/Team/index.js deleted 100644 → 0
import React, { Component } from 'react'
import './index.scss'
export default class Team extends Component {
constructor(props) {
super(props);
this.state = {
teacherList: [
{
avatar: 'https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/h5_python_class/teacher1.png',
name: '陈博士',
des: '七月在线AI Lab负责人兼科学家。历任浪潮集团数据科学家，国家电网人工智能行业应用方向团队负责人。参与过一国家863项目，且曾主持一山东省自主创新及成果转化专项，发明专利十余项，专业论文十余篇。'
},
{
avatar: 'https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/h5_python_class/teacher2.png',
name: '孙老师',
des: '10多年开发经验，先后任职国内知名互联网企业，从事人工智能方向的实施，擅长全栈开发，将机器学习/深度学习结合到实际生产运营中。'
},
{
avatar: 'https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/h5_python_class/teacher3.png',
name: '史老师',
des: '计算机专业毕业，多年开发经验，熟悉 Python，熟悉 linux 环境下系统编程，具有多年的 Web 后端开发经验，授课思路清晰明了，通俗易懂，幽默风趣的讲课方式将枯燥的知识以通俗的方式展现，深受学生好评。'
},
{
avatar: 'https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/h5_python_class/teacher4.png',
name: '珊酱',
des: '班主任的工作是一项非常辛苦和琐碎的工作，不付出艰辛的劳动和辛苦的汗水是不会有收获的。历经数万名学员的一对一服务，始终坚持给学员做到最好的服务和最严格的要求，学员的点滴进步和成长就是我最大的期望！'
}
]
}
}
render() {
const {teacherList} = this.state;
return (
<div className={'team_container'}>
<img className={'team_top'} src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/h5_python_class/team_top.png" alt=""/>
<img className={'team_bottom'} src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/h5_python_class/team_bottom.png" alt=""/>
<p className={'title'}>教/学/团/队</p>
<p className={'sub_title'}>讲师+助教+班主任全程陪伴，哪里不会问哪里</p>
<ul>
{
teacherList.map((item,index)=>{
return (
<li key={index} className={'item_li'}>
<img className={'item_image'} src={item.avatar} alt=""/>
<div className={'item_info'}>
<span className={'name'}>{item.name}</span>
<p className={'des'}>{item.des}</p>
</div>
</li>
)
})
}
</ul>
</div>
)
}
}
src/components/python/pythomDes/Team/index.scss deleted 100644 → 0
.team_container {
padding-top: 32px;
background: #0096ff;
padding-bottom: 46px;
position: relative;
.team_top {
position: absolute;
left: 0;
top: 0;
width: 78px;
height: 76px;
}
.team_bottom {
position: absolute;
right: 0;
bottom: 0;
width: 238px;
height: 246px;
}
p {
text-align: center;
text-align-last: center;
}
.title {
font-size: 22px;
line-height: 22px;
font-weight: 600;
color: rgba(255, 255, 255, 1);
}
.sub_title {
font-size: 12px;
line-height: 12px;
font-weight: 300;
color: rgba(255, 255, 255, 1);
margin: 12px auto 18px;
}
.item_li {
width: 352px;
background: rgba(255, 255, 255, 1);
border-radius: 4px;
display: flex;
justify-content: flex-start;
align-items: flex-start;
margin: 0 auto 12px;
padding: 12px 14px 14px 12px;
.item_image {
width: 44px;
height: 44px;
border-radius: 22px;
background: #0099ff;
flex: 0 0 auto;
margin-right: 14px;
}
.item_info {
.name {
font-size: 16px;
line-height: 16px;
font-weight: 600;
color: rgba(82, 92, 101, 1);
}
.des {
font-size: 12px;
line-height: 15px;
font-weight: 300;
color: rgba(82, 92, 101, 0.8);
text-align: left;
text-align-last: left;
margin-top: 6px;
width: 266px;
display: -webkit-box;
overflow: hidden;
-webkit-line-clamp: 5;
/*! autoprefixer: off */
-webkit-box-orient: vertical;
}
}
}
}
src/components/python/pythomDes/Test/index.js deleted 100644 → 0
import React, { Component } from 'react'
import './index.scss'
export default class Test extends Component {
Change = (data) => {
let cn = ["一", "二", "三", "四", "五", "六", "七", "八", "九", '十'];
let newStr = ''
let str = data.toString()
let ci = Number(str) % 10
let cs = Math.floor(Number(str) / 10)
let cv = ''
if (str.length > 1) {
if(cs==1){
cv = ci >= 1 ? cn[9] + cn[ci - 1] : cn[9]
} else {
cv = ci > 1 ? cn[cs - 1] + cn[9] + cn[ci - 1] : cn[cs - 1] + cn[9]
}
} else {
cv = cn[ci - 1]
}
newStr = str.replace(str, cv)
return newStr;
}
render() {
return (
<div className={'test_container'}>
<p className={'title'}>课 / 后 / 实 / 操</p>
<p className={'sub_title'}>涵盖完整知识体系，让你掌握实用高效的编程技巧</p>
<div className={'table_container'}>
<div className={'table_head'}>
<span>序号</span>
<span>实操项目</span>
</div>
<div className={'table_body'}>
{
this.props.practice.map((item, index)=>{
return <div key={index}>
<div className='stage'>{`第${this.Change(item.stage)}阶段 ${item.name}`}</div>
{
item.questions.map((question, index)=>{
return <div key={index} className={'line'}>
<span>{question.number}</span>
<div className={'test_name'}>
<img src={question.icon} alt=""/>
<p>{question.name}</p>
</div>
</div>
})
}
</div>
})
}
</div>
<div className={'table_bottom'}>
{
this.props.allPracticeShow ? (
<div onClick={()=>this.props.hide(2)}>
<p>收起</p>
<img src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/h5_python_class/shouqi.png" alt=""/>
</div>
) : (
<div onClick={()=>this.props.show(2)}>
<p>展开更多</p>
<img src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/h5_python_class/zhankai.png" alt=""/>
</div>
)
}
</div>
</div>
</div>
)
}
}
src/components/python/pythomDes/Test/index.scss deleted 100644 → 0
.test_container {
background: #fff;
padding-top: 30px;
padding-bottom: 44px;
.title {
font-size: 22px;
line-height: 22px;
font-weight: 600;
color: rgba(0, 153, 255, 1);
text-align: center;
text-align-last: center;
}
.sub_title {
font-size: 12px;
line-height: 12px;
font-weight: 300;
color: rgba(0, 153, 255, 1);
margin: 12px auto 24px;
text-align: center;
text-align-last: center;
}
.table_container {
width: 358px;
margin: 0 auto;
.table_head {
background: #ffd667;
height: 32px;
display: flex;
justify-content: center;
align-items: center;
border-radius: 4px 4px 0 0;
span {
display: flex;
justify-content: center;
align-items: center;
width: 50px;
height: 32px;
&:last-child {
width: 308px;
border-left: 1px solid #0099ff;
}
}
}
.table_body {
background: #34AFFF;
.stage {
height: 38px;
font-size: 14px;
line-height: 14px;
font-weight: 500;
color: rgba(255, 255, 255, 1);
display: flex;
justify-content: center;
align-items: center;
}
.line {
display: flex;
justify-content: space-between;
align-items: center;
height: 36px;
border-top: 1px solid #0099FF;
color: #FFF;
font-size: 12px;
span {
display: flex;
justify-content: center;
align-items: center;
width: 50px;
}
.test_name {
width: 308px;
display: flex;
justify-content: flex-start;
align-items: center;
border-left: 1px solid #0099FF;
height: 36px;
img {
width: 20px;
height: 20px;
border-radius: 5px;
margin: 0 10px;
}
}
}
}
.table_bottom {
height: 36px;
background: #3DB1FF;
border-top: 1px solid #0099FF;
div {
display: flex;
justify-content: center;
align-items: center;
height: 36px;
color: #FFF;
font-size: 12px;
}
img {
width: 9px;
height: 9px;
margin-left: 6px;
}
}
}
}
src/components/python/pythomDes/index.scss deleted 100644 → 0
.python__des {
width: 100vw;
height: 100vh;
padding-bottom: 60px;
overflow: auto;
.des__start {
width: 100%;
height: 258px;
background: url("https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/h5_python_class/head_img.png")
center center no-repeat;
background-size: contain;
}
.python__define {
position: relative;
padding-top: 28px;
.define__title {
font-size: 22px;
line-height: 22px;
font-weight: 600;
color: rgba(0, 153, 255, 1);
text-align: center;
text-align-last: center;
margin: 0 auto 40px;
}
.number_one {
width: 100%;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
margin-bottom: 30px;
}
// 公共
.trophy {
width: 75px;
height: 75px;
margin-bottom: 12px;
}
.item__title {
font-size: 16px;
line-height: 16px;
font-weight: 600;
color: rgba(82, 92, 101, 1);
margin-bottom: 12px;
}
.item__subtitle {
font-size: 12px;
font-weight: 400;
color: rgba(82, 92, 101, 0.8);
text-align: center;
text-align-last: center;
margin-bottom: 16px;
}
.left__decorate {
position: absolute;
left: 0;
top: -50px;
width: 60px;
height: 216px;
}
.right__decorate {
position: absolute;
right: 0;
top: 156px;
width: 44px;
height: 180px;
}
}
.bottom__btn_group {
width: 100%;
height: 56px;
display: flex;
justify-content: space-between;
align-items: center;
position: fixed;
bottom: 0;
left: 0;
right: 0;
z-index: 99;
padding: 0 14px;
background: #fff;
.online__label {
font-size: 18px;
font-weight: 600;
color: #525C65;
}
.online__button {
width: 160px;
height: 37px;
border-style: none;
border-radius: 19px;
font-size: 15px;
font-weight: 600;
color: #fff;
background-color: rgba(82,92,101,.6);
outline: none;
}
.course__price {
width: 100px;
font-size: 24px;
font-weight: 600;
color: rgba(255, 33, 33, 1);
position: relative;
}
.discount {
width: 54px;
height: 22px;
background: rgba(248, 60, 46, 1);
border-radius: 2px;
display: flex;
justify-content: center;
align-items: center;
font-size: 10px;
font-weight: 500;
color: rgba(255, 255, 255, 1);
position: absolute;
left: 46px;
top: -18px;
.triangle {
width: 0;
height: 0;
border-left: 5px solid transparent;
border-right: 10px solid transparent;
border-top: 10px solid #FB3A22;
position: absolute;
bottom: -5px;
left: 8px;
}
}
.btn__group {
display: flex;
justify-content: center;
align-items: center;
.try__study {
width: 100px;
height: 38px;
border: 1px solid rgba(0, 153, 255, 1);
border-radius: 19px;
box-sizing: border-box;
font-size: 16px;
font-weight: 600;
color: rgba(0, 153, 255, 1);
display: flex;
justify-content: center;
align-items: center;
}
.sign__now {
width: 100px;
height: 38px;
background: rgba(0, 153, 255, 1);
border-radius: 19px;
box-sizing: border-box;
font-size: 16px;
font-weight: 600;
color: rgba(255, 255, 255, 1);
display: flex;
justify-content: center;
align-items: center;
margin-left: 12px;
}
}
}
}
src/components/python/pythonStudy/index.scss deleted 100644 → 0
html, body, #root {
height: 100%;
}
.am-accordion.python-study__stage .am-accordion-item .am-accordion-header {
height: 44px;
padding-left: 13px;
font-size: 15px;
font-weight: 600;
color: #333;
background-color: #CFDBE5;
border-radius: 4px;
}
.am-accordion.python-study__stage .am-accordion-item-active .am-accordion-header{
border-radius: 4px 4px 0 0;
}
html:not([data-scale]) .am-accordion::before {
background-color: #F4F5F6;
}
.am-accordion.python-study__stage .am-accordion-item {
margin-top: 15px;
.am-accordion-content {
padding-bottom: 10px;
border-radius: 0 0 4px 4px;
}
}
.am-accordion.python-study__stage {
.am-accordion-item:first-child {
margin-top: 0;
}
}
html:not([data-scale]) .am-accordion.python-study__stage .am-accordion-item .am-accordion-content .am-accordion-content-box::after {
display: none;
}
.am-accordion.python-study__stage .am-accordion-item .am-accordion-header i {
background-image: url('https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/pythonCourse/h5/subject-icon-arrow.png');
}
.python-study {
height: 100%;
background-color: #F4F5F6;
padding-bottom: 15px;
}
.python-study__header {
margin: 10px 10px 18px;
border-radius: 5px;
background-color: #fff;
overflow: hidden;
}
.python-study__course {
display: flex;
align-items: center;
justify-content: space-between;
height: 55px;
padding: 0 12px;
background-color: #1A9BFC;
}
.python-study__course-name {
font-size: 15px;
font-weight: 600;
color: #fff;
}
.python-study__course-contact {
display: inline-flex;
flex-direction: column;
align-items: flex-end;
font-size: 12px;
color: rgba(255, 255, 255, .8);
}
.python-study__progress {
color: rgba(255,255,255,.8);
}
.python-study__progress {
height: 66px;
padding: 0 12px;
}
.python-study__progress-title {
font-size: 14px;
font-weight: 600;
color: rgba(51, 51, 51, .6);
line-height: 39px;
}
.python-study__progress-bar {
position: relative;
height: 3px;
margin: 18px 0 15px;
border-radius: 2px;
background-color: rgba(207, 219, 229, .6);
i {
position: absolute;
width: 10%;
height: 100%;
border-radius: 2px;
background-color: #1A9BFC;
}
}
.python-study__progress-tip {
position: absolute;
top: -26px;
width: 36px;
margin-left: -18px;
border-radius: 4px;
font-size: 12px;
font-weight: 600;
color: #fff;
text-align: center;
line-height: 18px;
background-color: #1A9BFC;
&::after {
content: '';
position: absolute;
left: 50%;
bottom: -8px;
margin-left: -4px;
border: 4px solid;
border-color: #1A9BFC transparent transparent;
}
}
.python-study__stage {
padding: 0 10px 60px;
border-radius: 4px;
overflow: hidden;
background-color: #F4F5F6;
}
.python-study__pass {
margin: 0 13px;
padding-top: 7px;
font-size: 14px;
font-weight: 600;
color: #333;
line-height: 40px;
}
.python-study__pass-tag {
display: inline-block;
width: 62px;
margin-left: 6px;
border-radius: 11px;
font-size: 12px;
font-style: normal;
font-weight: 600;
color: rgba(26, 155, 252, 1);
text-align: center;
line-height: 21px;
background-color: rgba(26, 155, 252, .1);;
}
.python-study__subject {
height: 67px;
margin: 0 8px 8px;
padding: 6px;
border-radius: 4px;
box-sizing: border-box;
background-color: rgba(247, 248, 249, 1);
&[data-status="lock"] {
background-color: rgba(247, 248, 249, .6);
}
}
.python-study__subject-icon {
float: left;
width: 55px;
height: 55px;
border-radius: 4px;
background-color: #fff;
overflow: hidden;
}
.python-study__subject-status {
position: absolute;
right: 17px;
width: 21px;
height: 21px;
background-size: cover;
&[data-status="complete"] {
background-image: url('https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/pythonCourse/h5/subject-icon-0.png');
}
&[data-status="lock"] {
background-image: url('https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/pythonCourse/h5/subject-icon-1.png');
}
}
.python-study__subject-content {
height: 100%;
margin-left: 55px;
padding: 0 33px 0 12px;
position: relative;
}
.python-study__subject-title {
max-width: 220px;
width: 228px;
}
.python-study__subject-title {
font-size: 14px;
color: #333;
line-height: 18px;
&[data-status="lock"] {
color: #525C65;
}
}
.python-study__subject-tag {
display: inline-block;
padding: 0 4px;
border-radius: 2px;
font-size: 12px;
color: #525C65;
line-height: 18px;
background-color: rgba(82, 92, 101, .1);
position: absolute;
bottom: 0;
}
.python-study__button {
position: fixed;
bottom: 0;
width: 100%;
height: 50px;
line-height: 50px;
border-style: none;
box-sizing: border-box;
font-size: 16px;
font-weight: 600;
color: #fff;
text-align: center;
background-color: #1A9BFC;
z-index: 1;
}
.python-study__over {
background-color: #ccc;
}
\ No newline at end of file
src/components/pythonShare/index.js deleted 100644 → 0
import React, { Component } from 'react';
import { Link } from 'react-router-dom';
import {CopyToClipboard} from 'react-copy-to-clipboard';
import AceEditor from 'react-ace';
import { Toast } from "antd-mobile"
import {HeaderBar} from '@/common';
import { browser, http, getParam, wxShare } from '@/utils';
import './index.scss';
import 'ace-builds/src-noconflict/mode-python';
import 'ace-builds/src-noconflict/theme-dracula';
class PythonClass extends Component {
constructor(props) {
super(props);
this.state = {
isWechat: browser.isWeixin,
isShare: true,
type: '1', // 1:课后习题，2:课堂习题
entryMode: 0, // 0：扫码页，1:落地页
isGuide: false, // 是否展示引导
isExecute: false,
isCopy: false,
command: '',
data: {}
}
}
componentDidMount() {
this.handleFetchInfo();
this.initPageStatus();
this.initCommand();
}
initCommand = () => {
this.setState({
command: `${API.m}/pythonShare?id=${getParam('id')}&type=${getParam('type')}&ques=${getParam('ques')}&origin=python`
})
}
initPageStatus = () => {
if(getParam('origin') === 'barcode') {
this.setState({
entryMode: 0
});
}
if(getParam('origin') === 'python') {
this.setState({
entryMode: 1
});
}
if(getParam('type') === '1') {
this.setState({
isShare: true
});
}
if(getParam('type') === '2') {
this.setState({
isShare: false
});
}
this.setState({
type: getParam('ques') || '1'
});
}
handleFetchInfo = () => {
const id = getParam('id') || 10;
// http.get(`${API.home}/web/python/share/help/${id}`).then(res => {
http.get(`${API.home}/m/it/share/show`, {
params: {
id
}
}).then(res => {
const { code, data } = res.data;
if(code === 200) {
this.setState({
data,
});
}
})
}
handleToSend = (params) => {
const { history } = this.props;
const { isShare, entryMode } = this.state;
if(browser.isWeixin) {
history.push(`/pythonShare?id=${getParam('id')}&type=${getParam('type')}&ques=${getParam('ques')}&origin=python`);
this.setState({
isGuide: true
});
let title = '';
let labelName = this.formatTitle(params);
if(entryMode !== 0 && !isShare) {
title = `我在${params.course_name}的${labelName}遇到了困难`;
}
if(entryMode !== 0 && isShare) {
title = `我已在【${params.course_name}】上运行了行代码了${params.code_lines}`
}
wxShare({
title,
desc: labelName,
link: encodeURI(location.href),
imgUrl: params.course_img,
});
}
}
formatTitle = (params) => {
const { type } = this.state;
if(type === '1') {
return `练习-${params.ques_name}`;
}
if(type === '2') {
return `课堂-${params.video_name}`;
}
}
copyToSuccess = () => {
Toast.info('已复制链接，快去粘贴发给好友吧～');
this.setState({
isCopy: true
});
}
handleToExecute = () => {
this.setState({
isExecute: true
});
}
handleToHide = () => {
this.setState({
isGuide: false
});
}
render() {
const { isWechat, isShare, isExecute, entryMode, command, isCopy, isGuide, data } = this.state;
return (
<>
<HeaderBar
title='Python基础语法'
arrow={true}
home={true}
/>
<PythonContent
isWechat={isWechat}
isShare={isShare}
isExecute={isExecute}
entryMode={entryMode}
isGuide={isGuide}
isCopy={isCopy}
command={command}
data={data}
labelName={this.formatTitle(data)}
handleToExecute={this.handleToExecute}
handleToSend={this.handleToSend}
copyToSuccess={this.copyToSuccess}
handleToHide={this.handleToHide}
/>
</>
);
}
}
function SelfAceEditor(props) {
return (
<AceEditor
mode="python"
theme="dracula"
readOnly={true}
showPrintMargin={false}
value={props.code}
style={{
width: '100%',
height: '100%'
}}
/>
)
}
function PythonContent(props) {
const {
isWechat,
isShare,
isExecute,
entryMode,
isCopy,
command,
labelName,
isGuide,
data: { head_img, nickname, code_lines, code, result, course_name, course_id },
handleToSend,
copyToSuccess,
handleToExecute,
handleToHide
} = props;
return (
<div className="python-container">
{
isGuide &&
<div className="python-popup" onClick={handleToHide}>
<div className="python-header">
<p className="python-wechat__title">请点击右上角分享</p>
<i className="iconfont iconyindao"></i>
</div>
</div>
}
<div className="python-content">
<div className="python-user">
<i className="python-user__portrait" style={{backgroundImage: `url(${head_img})`}}></i>
<h2 className="python-user__id">{nickname}</h2>
{/* 分享 */}
{
(entryMode === 0 && isShare) &&
<p className="python-user__desc">
完成了
<span>【{labelName}】</span>
</p>
}
{
(entryMode === 1 && isShare) &&
<p className="python-user__desc">
在
<span>【{course_name}】</span>完成了<br />
{labelName}
</p>
}
{/* 求助 */}
{
(entryMode === 0 && !isShare) &&
<p className="python-user__desc">
在
<span>【{labelName}】</span>
遇到了困难
</p>
}
{
(entryMode === 1 && !isShare) &&
<p className="python-user__desc">
在
<span>【{course_name}】</span>的<br />
<span>{labelName}</span>遇到了困难
</p>
}
</div>
<h4 className="python-code__title">
{entryMode === 1 && isShare? `这是Ta的第${code_lines}行代码` : '运行结果'}
</h4>
<div className="python-code__content">
<SelfAceEditor code={entryMode === 1 && isShare? code : result} />
</div>
<h4 className="python-code__title">
{entryMode === 1 && isShare? '运行结果' : '代码'}
</h4>
<div className="python-code__content">
{
entryMode === 1 && isShare
? <SelfAceEditor code={isExecute? result : ''} />
: <SelfAceEditor code={code} />
}
{
(entryMode === 1 && isShare && !isExecute) &&
<button className="python-button python-button__execute" onClick={handleToExecute}>运行看看</button>
}
</div>
</div>
{
(entryMode === 0 && isWechat) &&
<button className="python-button python-button__study" onClick={handleToSend}>
{isShare? '分享给好友' : '发给好友求助'}
</button>
}
{
(entryMode === 0 && !isWechat && !isCopy) &&
<CopyToClipboard
text={command}
onCopy={copyToSuccess}
>
<button className="python-button python-button__study">
{isShare? '分享给好友' : '发给好友求助'}
</button>
</CopyToClipboard>
}
{
(entryMode === 0 && !isWechat && isCopy) &&
<p className="python-button__tip">已复制链接，快去粘贴发给好友吧～</p>
}
{
entryMode === 1 &&
<Link className="python-button python-button__study" to={`/python?id=${course_id}`}>我也要学Python</Link>
}
</div>
);
}
export default PythonClass;
\ No newline at end of file
src/components/pythonShare/index.scss deleted 100644 → 0
.python-container {
padding: 50px 8px 29px;
background-image: url('https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/pythonCourse/h5/python-bg.png');
background-size: cover;
}
.python-container--page {
// padding-top: 50px;
}
.python-header {
position: relative;
height: 100px;
padding-top: 34px;
box-sizing: border-box;
.iconfont {
position: absolute;
top: -6px;
right: 40px;
font-size: 38px;
color: #fff;
}
}
.python-wechat__title {
margin: 0;
font-size: 17px;
color: #FCFF1D;
text-align: center;
line-height: 1;
}
.python-content {
padding-bottom: 37px;
background-image: url('https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/pythonCourse/h5/python-content-bg.png');
background-size: cover;
}
.python-user {
position: relative;
margin: 0 5px;
padding-top: 45px;
border-bottom: 1px dashed #000;
}
.python-user__portrait {
position: absolute;
top: -30px;
left: 0;
right: 0;
width: 60px;
height: 60px;
margin: auto;
padding: 5px;
border-radius: 50%;
box-sizing: border-box;
background-color: #fff;
background-size: cover;
img {
display: block;
width: 100%;
}
}
.python-user__id {
margin: 0;
font-size: 15px;
font-weight: 500;
color: #111;
text-align: center;
line-height: 1;
}
.python-user__desc {
height: 48px;
margin: 4px 0;
font-size: 16px;
color: #333;
text-align: center;
span {
color: #2D57F0;
}
}
.python-code__title {
position: relative;
margin: 32px 16px 21px;
padding-left: 16px;
font-size: 17px;
font-weight: 600;
color: #2D56F0;
line-height: 1;
&:after {
content: '';
position: absolute;
top: 0;
left: 0;
bottom: 0;
width: 4px;
height: 12px;
margin: auto 0;
background-color: #2D56F0;
}
}
.python-code__content {
position: relative;
height: 171px;
margin: 0 16px;
padding: 0 10px;
border-radius: 5px;
border: 1px solid #67E4FF;
box-sizing: border-box;
font-size: 14px;
color: #fff;
background-color: #272822;
}
.python-button {
padding: 0;
border-style: none;
cursor: pointer;
outline: none;
}
.python-button__study {
display: block;
width: 233px;
height: 44px;
margin: 35px auto 0;
border-radius: 22px;
font-size: 16px;
font-weight: 500;
color: #2D56F0;
line-height: 44px;
text-align: center;
background-color: #FFF95B;
box-shadow: 0px 5px 0px rgba(255,210,0,1);
}
.python-button__tip {
margin: 35px 0 0;
font-size: 15px;
font-weight: 500;
color: #fff;
line-height: 44px;
text-align: center;
}
.python-button__execute {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
width: 110px;
height: 32px;
margin: auto;
border-radius: 16px;
font-size: 15px;
color: #fff;
line-height: 32px;
background-color: #0099FF;
}
.python-popup {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, .3);
z-index: 99;
}
.ace_mobile-menu {
display: none;
}
\ No newline at end of file
src/components/study/myCourses/index.js
......@@ -76,14 +76,8 @@ class MyCourses extends Component {
isLoading: true
}
handleClick = (id, item) => {
const {history} = this.props
const {mode, course_id} = item
if(mode && mode == 6){
history.push(`/python?id=${course_id}`)
return
}
history.push(`/play/video?id=${id}`)
handleClick = id => {
this.props.history.push(`/play/video?id=${id}`)
}
addCourseClick = () => {
this.props.history.push('/classify')
......@@ -170,7 +164,6 @@ class MyCourses extends Component {
info={Info}
status={status}
courseExpire={courseExpire}
item={item}
id={item['v_course_id']}
/>
)
......@@ -207,4 +200,4 @@ export default connect(
{
fetchCoursesListIfNeeded,
switchTab
})(MyCourses)
})(MyCourses)
\ No newline at end of file
src/router/router-config.js
......@@ -250,18 +250,5 @@ export default [
{
path: '/year/yearWish',
component: loadable(() => import(/* webpackChunkName: 'newyear-yearIndex' */ '@components/activity/newyear-2019/year-wish/index'))
},
// python 小课页面
{
path: '/python',
component: loadable(() => import(/* webpackChunkName: 'python-class'*/'@/components/python'))
},
{
path: '/pythonShare',
component: loadable(() => import('@/components/pythonShare'))
},
{
path: '/pythonStudy',
component: loadable(() => import('@/components/python/pythonStudy'))
},
}
]
yarn.lock
......@@ -1237,16 +1237,16 @@
"@types/unist" "*"
"@types/vfile-message" "*"
"@videojs/http-streaming@1.10.6":
version "1.10.6"
resolved "https://registry.npm.taobao.org/@videojs/http-streaming/download/@videojs/http-streaming-1.10.6.tgz#a9119b1828b354c5cc17b42ea051cc7bcce2dca0"
integrity sha1-qRGbGCizVMXMF7QuoFHMe8zi3KA=
"@videojs/http-streaming@1.10.3":
version "1.10.3"
resolved "https://registry.yarnpkg.com/@videojs/http-streaming/-/http-streaming-1.10.3.tgz#0c028443b9a3c96da85e5995748ed94280884584"
integrity sha512-fxXtwVrQBdhOFh6GymPAPCb4utCI01Zs5fdyZgtR6FSsaz/zGmnzfNS5GvNjBi/hZviMsbNPFaOTTFMMNLNA3A==
dependencies:
aes-decrypter "3.0.0"
global "^4.3.0"
m3u8-parser "4.4.0"
m3u8-parser "4.3.0"
mpd-parser "0.8.1"
mux.js "5.2.1"
mux.js "5.1.3"
url-toolkit "^2.1.3"
video.js "^6.8.0 || ^7.0.0"
......@@ -1434,11 +1434,6 @@ accepts@~1.3.4, accepts@~1.3.5:
mime-types "~2.1.18"
negotiator "0.6.1"
ace-builds@^1.4.6:
version "1.4.6"
resolved "https://registry.npm.taobao.org/ace-builds/download/ace-builds-1.4.6.tgz#ff6abd5f31472f33c1958ab99e0de6b63db3c964"
integrity sha1-/2q9XzFHLzPBlYq5ng3mtj2zyWQ=
acorn-dynamic-import@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/acorn-dynamic-import/-/acorn-dynamic-import-3.0.0.tgz#901ceee4c7faaef7e07ad2a47e890675da50a278"
......@@ -3686,11 +3681,6 @@ detect-port-alt@1.1.6:
address "^1.0.1"
debug "^2.6.0"
diff-match-patch@^1.0.4:
version "1.0.4"
resolved "https://registry.npm.taobao.org/diff-match-patch/download/diff-match-patch-1.0.4.tgz#6ac4b55237463761c4daf0dc603eb869124744b1"
integrity sha1-asS1UjdGN2HE2vDcYD64aRJHRLE=
diff@^3.2.0:
version "3.5.0"
resolved "https://registry.yarnpkg.com/diff/-/diff-3.5.0.tgz#800c0dd1e0a8bfbc95835c202ad220fe317e5a12"
......@@ -6827,11 +6817,6 @@ lodash.debounce@^4.0.0:
resolved "https://registry.yarnpkg.com/lodash.debounce/-/lodash.debounce-4.0.8.tgz#82d79bff30a67c4005ffd5e2515300ad9ca4d7af"
integrity sha1-gteb/zCmfEAF/9XiUVMArZyk168=
lodash.get@^4.4.2:
version "4.4.2"
resolved "https://registry.npm.taobao.org/lodash.get/download/lodash.get-4.4.2.tgz#2d177f652fa31e939b4438d5341499dfa3825e99"
integrity sha1-LRd/ZS+jHpObRDjVNBSZ36OCXpk=
lodash.isarguments@^3.0.0:
version "3.1.0"
resolved "https://registry.yarnpkg.com/lodash.isarguments/-/lodash.isarguments-3.1.0.tgz#2f573d85c6a24289ff00663b491c1d338ff3458a"
......@@ -6842,11 +6827,6 @@ lodash.isarray@^3.0.0:
resolved "https://registry.yarnpkg.com/lodash.isarray/-/lodash.isarray-3.0.4.tgz#79e4eb88c36a8122af86f844aa9bcd851b5fbb55"
integrity sha1-eeTriMNqgSKvhvhEqpvNhRtfu1U=
lodash.isequal@^4.5.0:
version "4.5.0"
resolved "https://registry.npm.taobao.org/lodash.isequal/download/lodash.isequal-4.5.0.tgz#415c4478f2bcc30120c22ce10ed3226f7d3e18e0"
integrity sha1-QVxEePK8wwEgwizhDtMib30+GOA=
lodash.keys@^3.1.2:
version "3.1.2"
resolved "https://registry.yarnpkg.com/lodash.keys/-/lodash.keys-3.1.2.tgz#4dbc0472b156be50a0b286855d1bd0b0c656098a"
......@@ -6953,13 +6933,6 @@ m3u8-parser@4.3.0:
dependencies:
global "^4.3.2"
m3u8-parser@4.4.0:
version "4.4.0"
resolved "https://registry.npm.taobao.org/m3u8-parser/download/m3u8-parser-4.4.0.tgz#adf606c0af6d97f6750095a42006c2ae03dde177"
integrity sha1-rfYGwK9tl/Z1AJWkIAbCrgPd4Xc=
dependencies:
global "^4.3.2"
make-dir@^2.0.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/make-dir/-/make-dir-2.1.0.tgz#5f0310e18b8be898cc07009295a30ae41e91e6f5"
......@@ -7361,10 +7334,10 @@ mux.js@5.1.1:
resolved "https://registry.yarnpkg.com/mux.js/-/mux.js-5.1.1.tgz#0e95f048b4ac51d413c9ddc2d78e4cefad8d06de"
integrity sha512-Mf/UYmh5b8jvUP+jmrTbETnyFZprMdbT0RxKm/lJ/4d2Q3xdc5GaHaRPI1zVV5D3+6uxArVPm78QEb1RsrmaQw==
mux.js@5.2.1:
version "5.2.1"
resolved "https://registry.npm.taobao.org/mux.js/download/mux.js-5.2.1.tgz#6698761fc88da5acecea0758ac25f11d3a08bee8"
integrity sha1-Zph2H8iNpazs6gdYrCXxHToIvug=
mux.js@5.1.3:
version "5.1.3"
resolved "https://registry.yarnpkg.com/mux.js/-/mux.js-5.1.3.tgz#1a59b8979a6780be5bcb63983c7e883c90cd615b"
integrity sha512-FhDcysLvAkO9H8ftBJ2sK1O4Rmz0AWnMS+2uqP7WjrnaAyE/ox11GEiZkRzrWIdp8at9R9qBHDqdURY3/h/xTg==
nan@^2.12.1:
version "2.13.2"
......@@ -9264,17 +9237,6 @@ rc@^1.2.7:
minimist "^1.2.0"
strip-json-comments "~2.0.1"
react-ace@^8.0.0:
version "8.0.0"
resolved "https://registry.npm.taobao.org/react-ace/download/react-ace-8.0.0.tgz#e6fc155ec3cf240e92bdf2e156a50458a78ed0a4"
integrity sha1-5vwVXsPPJA6SvfLhVqUEWKeO0KQ=
dependencies:
ace-builds "^1.4.6"
diff-match-patch "^1.0.4"
lodash.get "^4.4.2"
lodash.isequal "^4.5.0"
prop-types "^15.7.2"
react-app-polyfill@^0.2.2:
version "0.2.2"
resolved "https://registry.yarnpkg.com/react-app-polyfill/-/react-app-polyfill-0.2.2.tgz#a903b61a8bfd9c5e5f16fc63bebe44d6922a44fb"
......@@ -11535,16 +11497,17 @@ vfile@^4.0.0:
videojs-vtt.js "0.14.1"
xhr "2.4.0"
video.js@^7.6.5:
version "7.6.6"
resolved "https://registry.npm.taobao.org/video.js/download/video.js-7.6.6.tgz#e7c9163d53f9b0e05ccb5ac0f79d02fa49b4d3ac"
integrity sha1-58kWPVP5sOBcy1rA950C+km006w=
video.js@^7.6.0:
version "7.6.0"
resolved "https://registry.yarnpkg.com/video.js/-/video.js-7.6.0.tgz#556c151004e27d340be3a732a14bf7c1aaf7e8b4"
integrity sha512-A0HSKzAmcYkd1xyExqUlM6n8bkghcX54iCvW08bPvvl3UHt8d8zijuylfIWu8vo1Z8fYyk9HPOFs1i3Cldr/cw==
dependencies:
"@babel/runtime" "^7.4.5"
"@videojs/http-streaming" "1.10.6"
"@videojs/http-streaming" "1.10.3"
global "4.3.2"
keycode "^2.2.0"
safe-json-parse "4.0.0"
tsml "1.0.1"
videojs-font "3.2.0"
videojs-vtt.js "^0.14.1"
xhr "2.4.0"
......
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