Commit f6ddbb1f by xuzhenghua

detail

parents 9002dfc5 0fcc93d2
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
right: 0; right: 0;
bottom: 0; bottom: 0;
background-color: rgba(0, 0, 0, .6); background-color: rgba(0, 0, 0, .6);
z-index: 2; z-index: 15;
.content { .content {
width: 300px; width: 300px;
......
...@@ -7,6 +7,7 @@ import {HeaderBar, CallApp} from '../../common' ...@@ -7,6 +7,7 @@ import {HeaderBar, CallApp} from '../../common'
import ShareRank from "./shareRank" import ShareRank from "./shareRank"
import Audition from "./audition" import Audition from "./audition"
import Single from "./single" import Single from "./single"
import SingleSuccess from './single/singleSuccess';
import BtnStatus from "./btnstatus" import BtnStatus from "./btnstatus"
import Carouselw from "./carousel" import Carouselw from "./carousel"
import {connect} from "react-redux" import {connect} from "react-redux"
...@@ -25,7 +26,10 @@ class Detail extends Component { ...@@ -25,7 +26,10 @@ class Detail extends Component {
isbuy: 0, isbuy: 0,
isvip: 0, isvip: 0,
auditionBox: false, auditionBox: false,
singleBox: false, singleBox: false,
singleType: 1,
shareRank: false, shareRank: false,
singMess: '', singMess: '',
barInfo: '', barInfo: '',
...@@ -39,6 +43,45 @@ class Detail extends Component { ...@@ -39,6 +43,45 @@ class Detail extends Component {
componentDidMount() { componentDidMount() {
this.fetchCourseInfo(); this.fetchCourseInfo();
const { location: { state = {} } } = this.props;
if(state.oid) {
this.check(state.oid);
}
}
// 判断支付是否成功
check = (oid) => {
http.get(`${API['base-api']}/class_order_status/${oid}`).then((res) => {
if (Number(res.data.data.errno) === 200) {
// 正常购买单集成功
this.setState({
singleType: 6,
})
} else if (Number(res.data.data.errno) === 201) {
// 0元参团
this.setState({
singleType: 4,
})
} else if (Number(res.data.data.errno) === 202) {
// 0元购
this.setState({
singleType: 3,
})
} else if (Number(res.data.data.errno) === 203) {
// 三天内特价
this.setState({
nowPrice: res.data.data.data.now_price,
laterPrice: res.data.data.data.three_day_later_price,
singleType: 2,
})
} else {
Toast.info(res.data.data.msg, 2)
}
})
} }
fetchCourseInfo = () => { fetchCourseInfo = () => {
...@@ -88,6 +131,7 @@ class Detail extends Component { ...@@ -88,6 +131,7 @@ class Detail extends Component {
} }
// 点击子组件单集购买按钮 // 点击子组件单集购买按钮
toSingleset = (item) => { toSingleset = (item) => {
console.log(this.props);
const {user} = this.props const {user} = this.props
const uid = user && user.data && user.data.uid const uid = user && user.data && user.data.uid
if (!uid) { if (!uid) {
...@@ -95,8 +139,9 @@ class Detail extends Component { ...@@ -95,8 +139,9 @@ class Detail extends Component {
} else { } else {
this.setState({ this.setState({
singleBox: true, singleBox: true,
singleType: 1,
singMess: item singMess: item
}) });
} }
} }
...@@ -207,11 +252,17 @@ class Detail extends Component { ...@@ -207,11 +252,17 @@ class Detail extends Component {
// 自组件传给父组件的boxHide // 自组件传给父组件的boxHide
boxHide = (val) => { boxHide = (val) => {
this.setState({auditionBox: val, singleBox: val}) this.setState({
auditionBox: val,
singleBox: val,
singleType: 1
})
this.props.history.push(`/detail?id=${getParam('id')}`);
} }
render() { render() {
const { course: { course_info={} }, barInfo } = this.state; const { course: { course_info={} }, barInfo, singleBox, singleType } = this.state;
console.log(course_info); console.log(course_info);
let courseInfo = '', let courseInfo = '',
service = '', service = '',
...@@ -225,8 +276,14 @@ class Detail extends Component { ...@@ -225,8 +276,14 @@ class Detail extends Component {
} }
// } // }
const {share, countdown, list, outList} = this.state; const {share, countdown, list, outList} = this.state;
const href = this.props.location && this.props.location.state? this.props.location.state.href : undefined; let href = this.props.location && this.props.location.state? this.props.location.state.href : undefined;
const { location: { state = {}} } = this.props;
if(state.oid) {
href='/classify'
}
return ( return (
<div>
<div className='detail-box'> <div className='detail-box'>
<HeaderBar <HeaderBar
title='课程详情' title='课程详情'
...@@ -302,15 +359,28 @@ class Detail extends Component { ...@@ -302,15 +359,28 @@ class Detail extends Component {
<Audition auditionBox={this.state.auditionBox} boxHide={this.boxHide}/> <Audition auditionBox={this.state.auditionBox} boxHide={this.boxHide}/>
{/*单集购买弹窗*/} {/*单集购买弹窗*/}
{
singleBox &&
<Single <Single
singleType={this.state.singleType}
singleBox={this.state.singleBox} singleBox={this.state.singleBox}
boxHide={this.boxHide} boxHide={this.boxHide}
data={this.state.singMess} data={this.state.singMess}
vcourseId={course_info.v_course_id} vcourseId={course_info.v_course_id}
videoId={this.state.singMess.video_id} videoId={this.state.singMess.video_id}
title={course_info.course_title} title={course_info.course_title}
/> check={this.check}
/>}
{/* 单集购买成功弹窗 */}
{
singleType != 1 &&
<SingleSuccess
boxHide={this.boxHide}
data={this.state.singMess}
singleType={singleType}
videoId={this.state.singMess.video_id}
/>
}
{/*分享赚钱*/} {/*分享赚钱*/}
{ {
course_info.is_dist && course_info.is_dist &&
...@@ -376,6 +446,7 @@ class Detail extends Component { ...@@ -376,6 +446,7 @@ class Detail extends Component {
) : null ) : null
} }
</div> </div>
</div>
) )
} }
......
...@@ -12,7 +12,7 @@ class Single extends Component { ...@@ -12,7 +12,7 @@ class Single extends Component {
constructor(props) { constructor(props) {
super(props) super(props)
this.state = { this.state = {
status: 1, // status: 1,
orderId: '', orderId: '',
nowPrice: '', nowPrice: '',
laterPrice: '', laterPrice: '',
...@@ -22,17 +22,26 @@ class Single extends Component { ...@@ -22,17 +22,26 @@ class Single extends Component {
endTime: '', endTime: '',
groupOrderId: '', groupOrderId: '',
payType: '0', // 1支付宝 0微信 payType: '0', // 1支付宝 0微信
// singleBox: false,
showSingleBox: false, showSingleBox: false,
} }
} }
componentDidMount() { componentDidMount() {
if (getParam('is_class') === 1 || getParam('weixinpay')) { // if (getParam('is_class') === 1 || getParam('weixinpay')) {
this.payCallback() // console.log(0);
} // this.payCallback()
if (browser.isWeixin) { // }
this.isweixinPay() // if (browser.isWeixin) {
} // this.isweixinPay()
// }
}
componentWillReceiveProps(nextProps, nextContext) {
// console.log(nextProps);
// this.setState({
// singleBox: nextProps.singleBox
// })
} }
// 选择支付方式 // 选择支付方式
...@@ -73,9 +82,11 @@ class Single extends Component { ...@@ -73,9 +82,11 @@ class Single extends Component {
} }
// 支付宝支付 // 支付宝支付
alipayPay = (orderId) => { alipayPay = (orderId) => {
const courseId = getParam('id');
http.get(`${API['base-api']}/pay/alipay/wap_charge_new/oid/${orderId}`).then((res) => { http.get(`${API['base-api']}/pay/alipay/wap_charge_new/oid/${orderId}`).then((res) => {
if (res.data.errno === 0) { if (res.data.errno === 0) {
window.location = res.data.data.url; window.location = res.data.data.url;
courseId && window.localStorage.setItem('payCourse', courseId);
} else { } else {
Toast.info(res.data.msg, 2) Toast.info(res.data.msg, 2)
} }
...@@ -173,7 +184,9 @@ class Single extends Component { ...@@ -173,7 +184,9 @@ class Single extends Component {
// 支付完成之后获取状态 // 支付完成之后获取状态
payCallback = () => { payCallback = () => {
const _this = this; const _this = this;
if(getParam('oid')) { if(!getParam('oid')) {
return;
}else{
_this.intervalPayStatus = setInterval(function () { _this.intervalPayStatus = setInterval(function () {
http.get(`${API['base-api']}/m/orderState/oid/${getParam('oid')}`).then(res => { http.get(`${API['base-api']}/m/orderState/oid/${getParam('oid')}`).then(res => {
if (res.data.errno === 401) { if (res.data.errno === 401) {
...@@ -304,14 +317,15 @@ class Single extends Component { ...@@ -304,14 +317,15 @@ class Single extends Component {
}) })
}, 1000) }, 1000)
} }
const { singleType } = this.props;
console.log(this.state.singleBox);
return ( return (
<div> <div>
{
this.props.singleBox &&
<div className='popup-box'> <div className='popup-box'>
{ {
this.state.status === 1 && singleType === 1 &&
<div className='content singleset-payment'> <div className='content singleset-payment'>
<div className='price-box'> <div className='price-box'>
<span>实付款:</span> <span>实付款:</span>
...@@ -345,83 +359,11 @@ class Single extends Component { ...@@ -345,83 +359,11 @@ class Single extends Component {
<div className='btn btn-18B4ED' onClick={this.toBuy}>确认购买</div> <div className='btn btn-18B4ED' onClick={this.toBuy}>确认购买</div>
</div> </div>
} }
</div>
}
{
showSingleBox &&
<div className='popup-box'>
{
this.state.status === 2 &&
<div className='content payment-success'>
<div className="header">
<i className='iconfont icondanseshixintubiao-5'></i>
<span>购买成功</span>
</div>
<div className="dec">· 3天内购买全集,可直接抵扣该集费用,{this.state.nowPrice}元购买。</div>
<div className="dec">· 超过3天,按照未够集数/全部集数等比例计费,{this.state.laterPrice}元购买全集。</div>
<Link to={`/play/video?id=${this.props.vcourseId}&video_id=${this.props.data.video_id}`} className='btn btn-18B4ED'>开始学习</Link>
<div className='btn btn-FF4000' onclick={this.toBuyAll()}>{this.state.nowPrice}购买全集
</div>
</div>
}
{
this.state.status === 3 &&
<div className='content zero'>
<div className="header">
<i className='iconfont icondanseshixintubiao-5'></i>
<span>购买成功</span>
</div>
<div className="dec">· 恭喜您获得0元拼团购买剩余课时的机会。</div>
<div className='btn btn-FF4000' onClick={this.zerogroupBuy}>0元参团</div>
</div>
}
{
this.state.status === 4 &&
<div className='content zero'>
<div className="header">
<i className='iconfont icondanseshixintubiao-5'></i>
<span>购买成功</span>
</div>
<div className="dec">· 恭喜您获得0元购买剩余课时的机会。</div>
<div className='btn btn-FF4000' onClick={this.zerobuyReceive}>0元购</div>
</div>
}
{
this.state.status === 6 &&
<div className='content zero'>
<div className="header">
<i className='iconfont icondanseshixintubiao-5'></i>
<span>购买成功</span>
</div>
<Link to={`/play/video?id=${this.props.vcourseId}&video_id=${this.props.data.video_id}`} className='btn btn-18B4ED'>去学习</Link>
</div>
}
{
this.state.status === 7 &&
<div className='content group'>
<div className="header">
<i className='iconfont icondanseshixintubiao-5'></i>
<span>参团成功</span>
</div>
<div className='group-img'>
<img src={this.props.user.data.avatar} alt=""/>
<img
src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/images/weekend/train7/ellipsis.png"
alt=""/>
<img
src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/images/weekend/train7/ellipsis.png"
alt=""/>
</div>
<div className='btn-l btn-FF4000' onClick={this.toGroup}>
剩余{String(this.state.hour).padStart(2, 0)}{String(this.state.min).padStart(2, 0)}{String(this.state.sec).padStart(2, 0)}
邀请好友参团
</div>
</div>
}
<i onClick={this.colse} className={'iconfont iconiconfront-2 close'}></i> <i onClick={this.colse} className={'iconfont iconiconfront-2 close'}></i>
</div> </div>
}
</div> </div>
); );
......
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
right: 0; right: 0;
bottom: 0; bottom: 0;
background-color: rgba(0, 0, 0, .6); background-color: rgba(0, 0, 0, .6);
z-index: 2; z-index: 5;
.content { .content {
width: 300px; width: 300px;
......
import React, { Component } from 'react'
import './index.scss'
import { getParam, http, browser } from "@/utils";
import { Toast } from 'antd-mobile';
import { Link, withRouter } from "react-router-dom";
import { compose } from "redux";
import { connect } from "react-redux";
import { differenceInHours, differenceInMinutes, differenceInSeconds } from "date-fns";
class Single extends Component {
constructor(props) {
super(props)
this.state = {
// status: 1,
orderId: '',
nowPrice: '',
laterPrice: '',
hour: '',
min: '',
sec: '',
endTime: '',
groupOrderId: '',
payType: '0', // 1支付宝 0微信
// singleBox: false,
}
}
componentDidMount() {
if (getParam('is_class') === 1 || getParam('weixinpay')) {
console.log(0);
this.payCallback()
}
if (browser.isWeixin) {
this.isweixinPay()
}
}
componentWillReceiveProps(nextProps, nextContext) {
// console.log(nextProps);
// this.setState({
// singleBox: nextProps.singleBox
// })
}
// 选择支付方式
check = (type) => {
this.setState({
payType: type
})
}
// 确定购买
toBuy = () => {
http.get(`${API.home}/sys/createClassOrder/${this.props.data.video_id}`).then((res) => {
if (res.data.code === 200) {
this.setState({
orderId: res.data.data.order_id
})
this.state.payType === '1' ? this.alipayPay(res.data.data.order_id) : this.weixinPay(res.data.data.order_id)
} else {
Toast.info(res.data.msg, 2)
}
})
}
// 微信支付
weixinPay = (orderId) => {
// 微信内部-支付
if (browser.isWeixin) {
window.location.href = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx23dac6775ac82877&redirect_uri=" + encodeURIComponent(window.location.href + "&aa=bb&oid=" + orderId).toLowerCase() + "&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect";
} else {
// 微信外部-支付
http.get(`${API['base-api']}/pay/wxpay/wap_charge/oid/${orderId}`).then((res) => {
if (res.data.errno === 0) {
window.location.href = res.data.data.url + "&redirect_url=" + encodeURIComponent(window.location.href + "&weixinpay=1&oid=" + orderId).toLowerCase();
} else {
Toast.info(res.data.msg, 2)
}
})
}
}
// 支付宝支付
alipayPay = (orderId) => {
const courseId = getParam('id');
http.get(`${API['base-api']}/pay/alipay/wap_charge_new/oid/${orderId}`).then((res) => {
if (res.data.errno === 0) {
window.location = res.data.data.url;
courseId && window.localStorage.setItem('payCourse', courseId);
} else {
Toast.info(res.data.msg, 2)
}
})
}
// 微信内部支付
isweixinPay = () => {
let _this = this;
let weixin_code = getParam('code')
if (weixin_code) {
if (!getParam('oid')) {
return
} else {
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', {
"appId": data.appId, //公众号名称,由商户传入
"timeStamp": data.timeStamp, //时间戳,自1970年以来的秒数
"nonceStr": data.nonceStr, //随机串
"package": data.package,
"signType": data.signType, //微信签名方式:
"paySign": data.paySign //微信签名
},
function (res) {
if (res.err_msg == "get_brand_wcpay_request:ok") {
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;
// 获取课程类型
http.get(`${API['base-api']}/class_order_status/${getParam('oid')}`).then((res) => {
if (Number(res.data.data.errno) === 200) {
// 正常购买单集成功
this.setState({
status: 6,
showSingleBox: true,
})
} else if (Number(res.data.data.errno) === 201) {
// 0元参团
this.setState({
status: 4,
showSingleBox: true,
})
} else if (Number(res.data.data.errno) === 202) {
// 0元购
this.setState({
status: 3,
showSingleBox: true,
})
} else if (Number(res.data.data.errno) === 203) {
// 三天内特价
this.setState({
nowPrice: res.data.data.data.now_price,
laterPrice: res.data.data.data.three_day_later_price,
status: 2,
showSingleBox: true,
})
} else {
Toast.info(res.data.data.msg, 2)
}
})
}
})
}, 1000)
} else {
alert('支付失败')
}
}
)
}
if (typeof WeixinJSBridge == "undefined") {
if (document.addEventListener) {
document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false)
} else if (document.attachEvent) {
document.attachEvent('WeixinJSBridgeReady', onBridgeReady)
document.attachEvent('onWeixinJSBridgeReady', onBridgeReady)
}
} else {
onBridgeReady()
}
} else {
Toast.info(res.data.msg, 2)
}
})
}
}
}
// 支付完成之后获取状态
payCallback = () => {
const _this = this;
if(getParam('oid')) {
_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;
// 获取课程类型
http.get(`${API['base-api']}/class_order_status/${getParam('oid')}`).then((res) => {
if (Number(res.data.data.errno) === 200) {
// 正常购买单集成功
this.setState({
status: 6,
showSingleBox: true,
})
} else if (Number(res.data.data.errno) === 201) {
// 0元参团
this.setState({
status: 4,
showSingleBox: true,
})
} else if (Number(res.data.data.errno) === 202) {
// 0元购
this.setState({
status: 3,
showSingleBox: true,
})
} else if (Number(res.data.data.errno) === 203) {
// 三天内特价
this.setState({
nowPrice: res.data.data.data.now_price,
laterPrice: res.data.data.data.three_day_later_price,
status: 2,
showSingleBox: true,
})
} else {
Toast.info(res.data.data.msg, 2)
}
})
}
})
}, 1000)
}
}
// 特价购买全集
toBuyAll = () => {
}
// 0元购买全集
zerobuyReceive = () => {
Toast.success('购买全集成功', 3)
this.colse()
}
// 0元参团
zerogroupBuy = () => {
this.getOrderId()
}
// 获取订单号-0元参团
getOrderId = () => {
let data = {
course_id: getParam('id')
}
http.post(`${API['base-api']}/pdd/sys`, data).then((res) => {
if (res.data.errno === 0) {
this.setState({
groupOrderId: res.data.data.order_id
})
this.getOrderStatus(res.data.data.order_id)
} else {
Toast.info(res.data.msg, 2)
}
})
}
// 获取订单状态-0元参团
getOrderStatus = (id) => {
http.get(`${API.home}/m/pdd/order_status/${id}`).then((res) => {
if (res.data.code === 200) {
this.getTime(res.data.data.pdd_order_id)
} else {
Toast.info(res.data.msg, 2)
}
})
}
// 获取倒计时-0元参团
getTime = (id) => {
http.get(`${API.home}/m/pdd_order_end_time/${id}`).then((res) => {
if (res.data.code === 200) {
this.setState({
endTime: res.data.data.end_time,
status: 7
})
} else {
Toast.info(res.data.msg, 2)
}
})
}
// 邀请好友参团
toGroup = () => {
this.props.history.push(`/togroup?id=${this.state.groupOrderId}`)
}
// 关闭弹窗
colse = () => {
this.props.boxHide(false);
this.setState({
status: 1
})
}
render() {
let {singleBox} = this.state;
if (this.state.endTime) {
let date = this.state.endTime * 1000
let now = Date.now()
setInterval(() => {
date -= 1000
let s = differenceInSeconds(new Date(date), now) % 60,
m = differenceInMinutes(new Date(date), now) % 60,
h = differenceInHours(new Date(date), now) % 24
this.setState({
hour: h,
min: m,
sec: s,
})
}, 1000)
}
const { singleType } = this.props;
console.log(this.state.singleBox);
return (
<div className='popup-box'>
{
singleType === 2 &&
<div className='content payment-success'>
<div className="header">
<i className='iconfont icondanseshixintubiao-5'></i>
<span>购买成功</span>
</div>
<div className="dec">· 3天内购买全集,可直接抵扣该集费用,{this.state.nowPrice}元购买。</div>
<div className="dec">· 超过3天,按照未够集数/全部集数等比例计费,{this.state.laterPrice}元购买全集。</div>
<Link to={`/play/video?id=${this.props.vcourseId}&video_id=${this.props.data.video_id}`} className='btn btn-18B4ED'>开始学习</Link>
<div className='btn btn-FF4000' onclick={this.toBuyAll()}>{this.state.nowPrice}购买全集
</div>
</div>
}
{
singleType === 3 &&
<div className='content zero'>
<div className="header">
<i className='iconfont icondanseshixintubiao-5'></i>
<span>购买成功</span>
</div>
<div className="dec">· 恭喜您获得0元拼团购买剩余课时的机会。</div>
<div className='btn btn-FF4000' onClick={this.zerogroupBuy}>0元参团</div>
</div>
}
{
singleType === 4 &&
<div className='content zero'>
<div className="header">
<i className='iconfont icondanseshixintubiao-5'></i>
<span>购买成功</span>
</div>
<div className="dec">· 恭喜您获得0元购买剩余课时的机会。</div>
<div className='btn btn-FF4000' onClick={this.zerobuyReceive}>0元购</div>
</div>
}
{
singleType === 6 &&
<div className='content zero'>
<div className="header">
<i className='iconfont icondanseshixintubiao-5'></i>
<span>购买成功</span>
</div>
<Link to={`/play/video?id=${this.props.vcourseId}&video_id=${this.props.data.video_id}`} className='btn btn-18B4ED'>去学习</Link>
</div>
}
{
singleType === 7 &&
<div className='content group'>
<div className="header">
<i className='iconfont icondanseshixintubiao-5'></i>
<span>参团成功</span>
</div>
<div className='group-img'>
<img src={this.props.user.data.avatar} alt=""/>
<img
src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/images/weekend/train7/ellipsis.png"
alt=""/>
<img
src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/images/weekend/train7/ellipsis.png"
alt=""/>
</div>
<div className='btn-l btn-FF4000' onClick={this.toGroup}>
剩余{String(this.state.hour).padStart(2, 0)}{String(this.state.min).padStart(2, 0)}{String(this.state.sec).padStart(2, 0)}
邀请好友参团
</div>
</div>
}
<i onClick={this.colse} className={'iconfont iconiconfront-2 close'}></i>
</div>
);
}
}
export default compose(
connect(
state => ({user: state.user}),
null
),
withRouter
)(Single)
...@@ -58,6 +58,10 @@ export default class PayOrder extends Component { ...@@ -58,6 +58,10 @@ export default class PayOrder extends Component {
// type订单类型 0普通订单 1团购 2小团 3砍价 4单集购买 5定金课定金 6定金课尾款 // type订单类型 0普通订单 1团购 2小团 3砍价 4单集购买 5定金课定金 6定金课尾款
if (parseInt(type, 10) === 2) { if (parseInt(type, 10) === 2) {
history.push(`/togroup?id=${oid}`); history.push(`/togroup?id=${oid}`);
}else if(parseInt(type, 10) === 4) {
courseId && window.localStorage.setItem('payCourse', courseId);
const courseId = window.localStorage.getItem('payCourse')
courseId && history.push(`/detail?id=${courseId}`,{oid});
} else { } else {
history.push('/purchased'); history.push('/purchased');
} }
......
...@@ -27,18 +27,20 @@ class Login extends Component { ...@@ -27,18 +27,20 @@ class Login extends Component {
const item = loginWays.find(item => item.text === method) const item = loginWays.find(item => item.text === method)
let {from} = location.state || {from: {pathname: '/', search: '', hash: ''}};
const redirectURI = window.location.origin + from.pathname + from.search + from.hash;
switch (method) { switch (method) {
case '账号登录': case '账号登录':
history.push('/passport/account-login', location.state) history.push('/passport/account-login', location.state)
break; break;
case '微信': case '微信':
let {from} = location.state || {from: {pathname: '/', search: '', hash: ''}}
const redirectURI = window.location.origin + from.pathname + from.search + from.hash
window.location.assign(`https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx23dac6775ac82877&redirect_uri=${encodeURIComponent(redirectURI)}&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect`) window.location.assign(`https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx23dac6775ac82877&redirect_uri=${encodeURIComponent(redirectURI)}&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect`)
break; break;
case 'QQ':
window.location.assign(`${API["passport-api"]}/mob/qqlogin?redirect_url=${encodeURIComponent(redirectURI)}`);
break;
default: default:
alert(item.url);
window.location.assign(item.url) window.location.assign(item.url)
} }
......
import React, { PureComponent } from 'react' import React, { PureComponent } from 'react'
import { SearchBar } from 'antd-mobile' import { SearchBar } from 'antd-mobile'
import { withRouter } from 'react-router-dom' import { withRouter } from 'react-router-dom'
import classnames from 'classnames';
import './search_header.scss' import './search_header.scss'
class SearchHead extends PureComponent { class SearchHead extends PureComponent {
state = {
isFocus: false
}
returnPage = () => { returnPage = () => {
this.props.history.go(-1) this.props.history.go(-1)
...@@ -24,8 +29,16 @@ class SearchHead extends PureComponent { ...@@ -24,8 +29,16 @@ class SearchHead extends PureComponent {
value && localStorage.setItem('searchHistory', JSON.stringify([...searchHistory, value])) value && localStorage.setItem('searchHistory', JSON.stringify([...searchHistory, value]))
} }
changeFontColor = (isFocus) => {
this.setState({
isFocus
});
}
render() { render() {
const { isFocus } = this.state;
const cls = classnames('submit-btn', {'submit-btn--active': isFocus})
console.log(isFocus);
return ( return (
<div className="search-head"> <div className="search-head">
...@@ -41,11 +54,13 @@ class SearchHead extends PureComponent { ...@@ -41,11 +54,13 @@ class SearchHead extends PureComponent {
ref="search" ref="search"
focus={true} focus={true}
onChange={this.props.handleChange} onChange={this.props.handleChange}
placeholder="搜索课程"/> placeholder="搜索课程"
onFocus={() => this.changeFontColor(true)}
onBlur={() => this.changeFontColor(false)}
/>
</div> </div>
<div className="right right-btn" onClick={this.search}> <div className="right right-btn" onClick={this.search}>
<div className="submit-btn">搜索 <div className={cls}>搜索</div>
</div>
</div> </div>
</div> </div>
) )
......
...@@ -66,6 +66,9 @@ ...@@ -66,6 +66,9 @@
font-size: $font_14; font-size: $font_14;
color: $color_333; color: $color_333;
} }
.submit-btn--active {
color: $active;
}
} }
} }
......
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