Skip to content

M
mr-julyedu
Commit 4d506145 by xuzhenghua
Options

ml小课优化

parent acf4003d
Showing with 133 additions and 49 deletions
src/common/WxLogin/index.js 0 → 100755
import React, {Component} from 'react'
import './index.scss'
class WxLogin extends Component {
constructor(props) {
super(props)
}
// 提示微信登录还是账号登录，微信授权登录不需要绑定手机号
wxLogin = () => {
let url = window.location.href
if (url.includes('code=') && url.includes('state=STATE')) {
let index = url.lastIndexOf('code=')
url = url.substr(0, index - 1)
}
window.location.href = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx23dac6775ac82877&redirect_uri=" + encodeURIComponent(url + "&aa=bb").toLowerCase() + "&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect"
}
zhLogin = () => {
this.props.history.push('/passport')
}
render() {
return (
<div className="change-login-type">
<div className="login-type-content">
<div className="wx-login" onClick={this.wxLogin}>
<img src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/mlCourse/m/wx-icon.png" alt=""/>
<span>微信登录</span>
</div>
<div className="zh-login" onClick={this.zhLogin}>
<img src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/mlCourse/m/zh-icon.png" alt=""/>
<span>账号登录</span>
</div>
</div>
</div>
)
}
}
export default WxLogin
src/common/WxLogin/index.scss 0 → 100755
.change-login-type {
background: rgba(0, 0, 0, .5);
position: fixed;
left: 0;
top: 0;
right: 0;
bottom: 0;
z-index: 100;
.login-type-content {
width: 290px;
height: 138px;
background-color: #fff;
border-radius: 8px;
position: relative;
left: 50%;
top: 50%;
margin-left: -145px;
margin-top: -69px;
padding: 40px 70px;
display: flex;
justify-content: space-between;
}
.wx-login, .zh-login {
text-align: center;
img {
width: 34px;
height: 34px;
}
span {
display: block;
color: #525C65;
font-size: 14px;
margin-top: 3px;
}
}
}
\ No newline at end of file
src/common/index.js
......@@ -9,5 +9,6 @@ export { default as ClearableInput } from "./ClearableInput"
export { default as Loading } from './Loading'
export { default as RenderTabBar } from './renderTabBar'
export { default as Popup } from './closable-popup'
export { default as WxLogin } from './WxLogin'
src/components/ml/index.js
......@@ -7,6 +7,7 @@ import {addDays} from "date-fns"
import cookie from "js-cookie"
import {setCurrentUser, startFetchUser} from "@/store/userAction"
import {Toast} from "antd-mobile"
import {WxLogin} from "@common/index"
@connect(state => ({
......@@ -22,6 +23,7 @@ class ML extends Component {
userInfoList: [],
isAppUpdate: false,
backwardVersion: false, // 默认是新版本
isWxlogin: false
}
}
......@@ -35,7 +37,7 @@ class ML extends Component {
}
if (browser.isWeixin) {
if (browser.isWeixin && getParam('oid')) {
this.isweixinPay()
}
if (getParam('weixinpay')) {
......@@ -45,15 +47,15 @@ class ML extends Component {
// 微信内部支付回调
isweixinPay = () => {
let _this = this;
let weixin_code = getParam('code');
let _this = this
let weixin_code = getParam('code')
if (weixin_code) {
if (getParam('oid') === undefined) {
return
} else {
http.get(`${API['base-api']}/pay/wxpay/pub_charge/oid/${getParam('oid')}/code/${weixin_code}`).then((res) => {
if (res.data.errno === 0) {
let data = res.data.data;
let data = res.data.data
function onBridgeReady() {
WeixinJSBridge.invoke(
......@@ -67,18 +69,18 @@ class ML extends Component {
},
function (res) {
if (res.err_msg == "get_brand_wcpsys/order_status/ay_request:ok") {
Toast.info('支付成功', 2);
Toast.info('支付成功', 2)
_this.intervalPayStatus = setInterval(function () {
http.get(`${API['base-api']}/m/orderState/oid/${getParam('oid')}`).then(res => {
if (res.data.errno === 401) {
clearInterval(_this.intervalPayStatus);
_this.intervalPayStatus = null;
clearInterval(_this.intervalPayStatus)
_this.intervalPayStatus = null
location.reload()
}
})
}, 1000)
} else {
Toast.info('支付失败', 2);
Toast.info('支付失败', 2)
}
}
)
......@@ -88,14 +90,12 @@ class ML extends Component {
if (document.addEventListener) {
document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false)
} else if (document.attachEvent) {
document.attachEvent('WeixinJSBridgeReady', onBridgeReady);
document.attachEvent('WeixinJSBridgeReady', onBridgeReady)
document.attachEvent('onWeixinJSBridgeReady', onBridgeReady)
}
} else {
onBridgeReady();
onBridgeReady()
}
} else {
Toast.info(res.data.msg, 2)
}
})
}
......@@ -103,20 +103,23 @@ class ML extends Component {
}
// 支付完成之后获取状态
payCallback = () => {
const _this = this;
const _this = this
// 支付回调
// 定时器轮训获取订单状态
_this.intervalPayStatus = setInterval(function () {
http.get(`${API['base-api']}/m/orderState/oid/${getParam('oid')}`).then(res => {
if (res.data.errno === 401) {
clearInterval(_this.intervalPayStatus);
_this.intervalPayStatus = null;
clearInterval(_this.intervalPayStatus)
_this.intervalPayStatus = null
location.reload()
}
})
}, 1000)
}
isWxloginFun = (val) => {
this.setState({isWxlogin: val})
}
// 获取app登录数据
loginInfo = (result) => {
this.setState({
......@@ -145,10 +148,10 @@ class ML extends Component {
this.setState({
isAppUpdate: true
})
this.fetchCourseInfo();
this.fetchCourseInfo()
}
this.props.setCurrentUser(this.transformUser(this.state.userInfoList));
this.props.setCurrentUser(this.transformUser(this.state.userInfoList))
}
transformUser = res => {
......@@ -177,22 +180,22 @@ class ML extends Component {
const {data, code} = res.data
if (code === 200) {
let version = getParam('version')
if(version) {
if (version) {
version = version.replace(/\./g, '').slice(0, 3)
if(browser.isAndroidApp && version < 453) { // 安卓的低版本
if (browser.isAndroidApp && version < 453) { // 安卓的低版本
this.setState({
backwardVersion: true,
isPay: 0,
})
}else if(browser.isIOSApp && version < 380) { // ISO的低版本
} else if (browser.isIOSApp && version < 380) { // ISO的低版本
this.setState({
backwardVersion: true,
isPay: 0,
})
}else{ // 安卓/IOS 的高版本
if(data.course_info.is_pay === 1) { // 在APP内未登录-去登陆-登录后还显示此页；如果是已购买的用户 就需要跳转到 APP已购买的原生页面
SendMessageToApp('toSyllabusChapter', id); // 跳转到APP的已购买详情页 id 是课程ID
return;
} else { // 安卓/IOS 的高版本
if (data.course_info.is_pay === 1) { // 在APP内未登录-去登陆-登录后还显示此页；如果是已购买的用户 就需要跳转到 APP已购买的原生页面
SendMessageToApp('toSyllabusChapter', id) // 跳转到APP的已购买详情页 id 是课程ID
return
}
this.setState({
backwardVersion: false,
......@@ -210,7 +213,7 @@ class ML extends Component {
}
render() {
const {isPay, isAppUpdate, backwardVersion} = this.state;
const {isPay, isAppUpdate, backwardVersion, isWxlogin} = this.state
// 旧版本 无论购买未购买 都跳转到 未购买的详情页； 如果是已购买就提示更新APP
return (
<div>
......@@ -218,6 +221,7 @@ class ML extends Component {
isPay === 0 && (
<PythonDes
backwardVersion={backwardVersion}
isWxloginFun={this.isWxloginFun.bind(this)}
history={this.props.history}
isAppUpdate={isAppUpdate}
isPay={isPay}
......@@ -225,8 +229,14 @@ class ML extends Component {
)
}
{
(isPay === 1 && !getParam('version')) && <PythonStudy isAppUpdate={isAppUpdate}/>
(isPay === 1 && !getParam('version')) && <PythonStudy isAppUpdate={isAppUpdate} />
}
{
isWxlogin &&
<WxLogin history={this.props.history}/>
}
</div>
)
}
......
src/components/ml/pythomDes/index.js
......@@ -45,18 +45,24 @@ class PythonDes extends Component {
// }
// }
// 立即体验、免费试学
// 立即体验type=1、立即报名type=3、9.9特价试学type=2
tryLearn = type => {
this.statistics(type)
// 已登录
if (!this.props.user.hasError) {
this.creatOid()
this.creatOid(type)
} else {// 未登录
this.toLogin()
}
}
creatOid = () => {
http.post(`${API['base-api']}/sys/trial_create`, {course_id: getParam('id')}).then(res => {
creatOid = (type) => {
let url = ''
if (type == 3) {
url = `${API['base-api']}/sys/it_baoming/create`
} else {
url = `${API['base-api']}/sys/trial_create`
}
http.post(url, {course_id: getParam('id')}).then(res => {
const {errno, data, msg} = res.data
if (errno === 200) {
this.setState({
......@@ -140,27 +146,15 @@ class PythonDes extends Component {
toLogin = () => {
if (!getParam('version')) { // H5
this.changeLoginType()
if (browser.isWeixin) {
this.props.isWxloginFun(true);
} else {
this.props.history.push('/passport')
}
} else { // APP
SendMessageToApp("toLogin")
}
}
// 点击登录 提示微信登录还是账号登录，微信授权登录不需要绑定手机号
changeLoginType = () => {
// 微信登录
if (browser.isWeixin) {
// tool.setCookie('redirect_url', window.location.href);
let url = window.location.href
if (url.includes('code=') && url.includes('state=STATE')) {
let index = url.lastIndexOf('code=')
url = url.substr(0, index - 1)
}
window.location.href = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx23dac6775ac82877&redirect_uri=" + encodeURIComponent(url).toLowerCase() + "&aa=bb&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect";
} else {
// 账号登录
this.props.history.push('/passport')
}
}
showAll = (key) => {
if (key === 1) {
......
src/components/ml/pythonStudy/index.js
......@@ -17,7 +17,6 @@ class PythonStudy extends Component {
syllabus: '',
learning: '',
isShowChannel: window.sessionStorage.getItem('isShowSiteWindowByChannel')
}
}
......@@ -84,7 +83,7 @@ class PythonStudy extends Component {
}
creatOid=()=>{
http.post(`${API['base-api']}/sys/trial_create`, {course_id: getParam('id')}).then(res => {
http.post(`${API['base-api']}/sys/it_baoming/create`, {course_id: getParam('id')}).then(res => {
const {errno, data, msg} = res.data
if (errno === 200) {
this.setState({
......
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