Commit d888037e by wangshuo

H5体验课程弹框 吊起APP

parent 0aca4cf9
......@@ -1027,17 +1027,17 @@
}
},
"@babel/runtime": {
"version": "7.3.1",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.3.1.tgz",
"integrity": "sha512-7jGW8ppV0ant637pIqAcFfQDDH1orEPGJb8aXfUozuCU3QqX7rX4DA8iwrbPrR1hcH0FTTHz47yQnk+bl5xHQA==",
"version": "7.7.2",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.7.2.tgz",
"integrity": "sha512-JONRbXbTXc9WQE2mAZd1p0Z3DZ/6vaQIkgYMSTP3KjRCyd7rCZCcfhCyX+YjwcKxcZ82UrxbRD358bpExNgrjw==",
"requires": {
"regenerator-runtime": "^0.12.0"
"regenerator-runtime": "^0.13.2"
},
"dependencies": {
"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=="
"version": "0.13.3",
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.3.tgz",
"integrity": "sha512-naKIZz2GQ8JWh///G7L3X6LaQUAMp2lvb1rvwwsURe/VXwD6VMfr+/1NuNw3ag8v2kY1aQ/go5SNn79O9JU7yw=="
}
}
},
......@@ -2852,6 +2852,14 @@
"@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",
......@@ -2876,6 +2884,11 @@
"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",
......
......@@ -168,6 +168,7 @@
]
},
"devDependencies": {
"@babel/runtime": "^7.7.2",
"babel-plugin-import": "^1.11.0",
"browserslist": "^4.6.6",
"caniuse-lite": "^1.0.30000989",
......
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>
)
}
}
.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;
}
}
}
......@@ -7,6 +7,7 @@ import Test from './Test/index.js';
import Team from './Team/index.js';
import Experience from './Experience/index.js'
import Progream from './Progream/index.js'
import Mask from './../poup/index.js'
import {http, getParam, SendMessageToApp, } from '@/utils'
import { connect } from 'react-redux';
import { Toast } from "antd-mobile";
......@@ -23,6 +24,7 @@ class PythonDes extends Component {
practice: [], // 课后实操
allPractice: [], // 课后实操
allPracticeShow: false,
toApp: false,
defineList: [
{
titleUrl: 'https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/h5_python_class/trophy.png',
......@@ -94,13 +96,21 @@ class PythonDes extends Component {
toLearn = () => {
const id = getParam('id');
if (!getParam('version')) { // H5
Toast.info('H5是要提醒去PC端吗');
this.setState({
toApp: true
})
} else { // APP
Toast.info('APP待定');
// SendMessageToApp("toCourse", id); // TODO 待定 需要APP确认
}
}
closePop = () => {
this.setState({
toApp: false
})
}
toDetail = () => {
const id = getParam('id');
if (!getParam('version')) { // H5
......@@ -170,7 +180,7 @@ class PythonDes extends Component {
}
render() {
const {defineList, desList, worryList, syllabus, practice, allSyllabusShow, allPracticeShow} = this.state;
const {defineList, desList, worryList, syllabus, practice, allSyllabusShow, allPracticeShow, toApp} = this.state;
return (
<div className={'python__des'}>
<div className={'des__start'}></div>
......@@ -207,6 +217,9 @@ class PythonDes extends Component {
<Experience tryLearn={this.tryLearn} />
<img style={{display: 'block', width: '100%', height: '8px'}} src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/h5_python_class/changjian.png" alt=""/>
<Progream />
{
toApp && (<Mask type={1} closePop={this.closePop} />)
}
</div>
)
}
......
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