Skip to content

M
mr-julyedu
Commit a73c3fea by FE
Options

formal activity basic complete

parent 44da469c
Showing with 467 additions and 565 deletions
src/components/activity/newyear-2019/common/commonContainer/index.scss
...@@ -49,11 +49,12 @@ ...@@ -49,11 +49,12 @@
width: 100%; width: 100%;
height: 22px; height: 22px;
} }
.container_content { .container_content {
background: url("https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/m_middle_bj.png"); background: url("https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/m_middle_bj.png");
background-size: contain; background-size: contain;
width: 100%; width: 100%;
min-height: 25px; min-height: 25px;
padding: 5px 20px; padding: 5px 15px;
} }
} }
src/components/activity/newyear-2019/preheat/YearCourse/index.js
...@@ -473,7 +473,7 @@ class YearCourse extends Component { ...@@ -473,7 +473,7 @@ class YearCourse extends Component {
} }
isCountDown = (condition, val) => { isCountDown = (condition, val) => {
if (condition == 1) { if (condition) {
return val; return val;
} }
return ''; return '';
...@@ -536,6 +536,63 @@ class YearCourse extends Component { ...@@ -536,6 +536,63 @@ class YearCourse extends Component {
return data; return data;
} }
toCart = (id) => {
const { history } = this.props;
http.post(`${API.home}/m/cart/add`, {
course_id: id
}).then((res) => {
const { code, msg } = res.data;
// code 15001 已加入购物车
if (code === 200 || code === 15001) {
if(getParam('version')) {
SendMessageToApp('toShoppingCart')
}else {
history.push('/shopcart');
}
} else if (code === 4030 || code === 4040) {
this.toLogin();
} else {
Toast.info(msg, 2);
}
})
};
toContinueBargain = (id, code) => {
const { history } = this.props;
if(getParam('version')) {
let data = {
title: 'AI充电节，积福气享1折秒课，超10万元奖品来就送！！',
desc: '把这门超5万人报名的【Python基础入门 升级版】课程送给你，附200元红包，请笑纳！--七月在线',
link: `https://m.julyedu.com/bargain-middle-page?id=${id}&bargaincode=${code}&is_originator=1`,
imgUrl: 'https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/active19_1111/m/index-share-img.png',
}
SendMessageToApp("toShare", data)
}else {
history.push(`/bargain-middle-page?id=${id}&bargaincode=${code}&is_originator=1`);
}
}
// 砍完价去支付
bargainToOrder = (id) => {
const { history, user } = this.props;
if(user.hasError) {
this.toLogin();
}else{
if(getParam('version')) {
SendMessageToApp('toPay', id)
}else {
http.get(`${API['base-api']}/m/cart/addtopreorder/[${id}]`).then((res) => {
const { errno, msg } = res.data;
if (errno === 0) {
history.push(`/order?id=[${id}]`, {bargain: 1});
} else {
Toast.info(msg, 2);
}
})
}
}
}
render() { render() {
const { const {
bigcourse, bigcourse,
...@@ -679,7 +736,7 @@ class YearCourse extends Component { ...@@ -679,7 +736,7 @@ class YearCourse extends Component {
image={item.image_name} image={item.image_name}
key={item.course_id} key={item.course_id}
id={item.course_id} id={item.course_id}
time={this.isCountDown(item.is_assemble, item.add_time)} time={this.isCountDown(item.is_assemble === 1, item.add_time)}
toCourse={this.toCourse} toCourse={this.toCourse}
> >
<div className="coupon-course__footer"> <div className="coupon-course__footer">
...@@ -707,7 +764,7 @@ class YearCourse extends Component { ...@@ -707,7 +764,7 @@ class YearCourse extends Component {
<span className="tag" data-color="green">拼团价</span> <span className="tag" data-color="green">拼团价</span>
</div> </div>
<div className="price price-group"> <div className="price price-group">
¥ <span className="price-label">¥</span>
<span className="new-price">0.01</span> <span className="new-price">0.01</span>
<span className="old-price"> <span className="old-price">
<s>¥{item.price1}</s> <s>¥{item.price1}</s>
...@@ -784,18 +841,54 @@ class YearCourse extends Component { ...@@ -784,18 +841,54 @@ class YearCourse extends Component {
image={val.image_name} image={val.image_name}
key={val.course_id} key={val.course_id}
id={val.course_id} id={val.course_id}
time={this.isCountDown(val.type === 2, val.end_time)}
toCourse={this.toCourse} toCourse={this.toCourse}
> >
<div className="coupon-course__footer"> <div className="coupon-course__footer">
{ {
val.type === 4 &&
<div className="bargain-price">已砍{val.already_bargain}元</div>
}
{
val.type === 0 &&
<>
<div className="type">
<span className="tag" data-color="green">活动价</span>
</div>
<div className="price price-group">
<span className="price-label">¥</span>
<span className="new-price">{val.original_price}</span>
<span className="old-price">
<s>¥{val.original_price}</s>
</span>
</div>
</>
}
{
(val.type === 1 || val.type === 2) &&
<>
<div className="type">
<span className="tag" data-color="green">拼团价</span>
</div>
<div className="price price-group">
<span className="price-label">¥</span>
<span className="new-price">{val.pdd_price}</span>
<span className="old-price">
<s>¥{val.original_price}</s>
</span>
</div>
</>
}
{
(val.type === 3 || val.type === 4) && (val.type === 3 || val.type === 4) &&
<> <>
<div className="type"> <div className="type">
<span className="tag" data-color="green">好友帮帮砍</span> <span className="tag" data-color="green">好友帮帮砍</span>
</div> </div>
<div className="price price-group"> <div className="price price-group">
到手最低价：¥ <span className="price-label">到手最低：¥</span>
<span className="new-price">{val.low_prize}</span> <span className="new-price">{val.low_prize}</span>
<span className="old-price"> <span className="old-price">
<s>¥{val.original_price}</s> <s>¥{val.original_price}</s>
...@@ -803,27 +896,33 @@ class YearCourse extends Component { ...@@ -803,27 +896,33 @@ class YearCourse extends Component {
</div> </div>
</> </>
} }
{
val.type === 6 &&
<p className={'course-title text-overflow-1'}>
{val.course_title}
</p>
}
<div className="status"> <div className="status">
{/* type 1 立即参团 2 已参团 3 我要砍价 4 待支付 5 马上抢 6 开始学习 */} {/* type 1 立即参团 2 已参团 3 我要砍价 4 待支付 5 马上抢 6 开始学习 */}
{ {
val.type === 0 && val.type === 0 &&
<a <a
onClick={() => this.toCourse(item.course_id)} onClick={() => this.toCart(val.course_id)}
className="status-btn to-group" className="status-btn to-group"
>立即购买</a> >立即购买</a>
} }
{ {
val.type === 1 && val.type === 1 &&
<a <a
onClick={() => this.toCourse(item.course_id)} onClick={() => this.toCourse(val.course_id)}
className="status-btn to-group" className="status-btn to-group"
>立即参与拼团</a> >立即参与拼团</a>
} }
{ {
val.type === 2 && val.type === 2 &&
<a <a
onClick={() => this.toInviteFriends(item.order_id)} onClick={() => this.toInviteFriends(val.order_id)}
className="status-btn to-group" className="status-btn to-group"
data-status="done" data-status="done"
>已参团，邀请好友参团</a> >已参团，邀请好友参团</a>
...@@ -839,27 +938,23 @@ class YearCourse extends Component { ...@@ -839,27 +938,23 @@ class YearCourse extends Component {
val.type === 4 && val.type === 4 &&
<> <>
<a <a
onClick={() => this.toCourse(item.course_id)} onClick={() => this.toContinueBargain(val.bargain_code)}
className="status-btn to-group" className="status-btn to-group"
>继续砍价</a> >继续砍价</a>
<a <a
onClick={() => this.toCourse(item.course_id)} onClick={() => this.bargainToOrder(val.course_id)}
className="status-btn to-group" className="status-btn to-group"
>支付1元</a> >支付{val.actual_payment}元</a>
</> </>
} }
{ {
val.type === 6 && val.type === 6 &&
<a <a
onClick={() => this.toCourse(item.course_id)} onClick={() => this.toCourse(val.course_id)}
className="btn to-group" className="btn to-group"
data-status="study" data-status="study"
>开始学习</a> >开始学习</a>
} }
</div> </div>
</div> </div>
</CourseItem> </CourseItem>
...@@ -880,429 +975,6 @@ class YearCourse extends Component { ...@@ -880,429 +975,6 @@ class YearCourse extends Component {
) )
}) })
} }
{/* <h4 className="ai-course__subtitle">基础</h4>
{
(basic.course && basic.course.length > 0) &&
<>
<div className='groupcourse course-box'>
{
basic.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 &&
<>
<p className={'course-title text-overflow-1'}>
{item.course_title}
</p>
<a
onClick={() => this.toCourse(item.course_id)}
className="btn to-study"
>开始学习</a>
</>
}
{
item.is_buy == 0 &&
<>
<div className="type">
{
item.type == 0 &&
<>
<span className="tag">活动价</span>
<span className="time">12.23开始</span>
</>
}
{
item.type == 1 &&
<>
<span className="tag">拼团价</span>
<span className="time">12.23开团</span>
</>
}
{
item.type == 2 &&
<>
<span className="tag">好友帮帮砍</span>
<span className="time">12.23开砍</span>
</>
}
</div>
<div className="price">
{item.type == 2 ? '到手最低:¥' : '¥'}
<span className="new-price">{item.price2}</span>
<span className="old-price">
{item.type == 2 ? '' : '现价：'}
<s>¥{item.price1}</s>
</span>
</div>
<div className="status">
<a
onClick={() => this.toCourse(item.course_id)}
className="status-btn to-buy"
>直接购买</a>
{
item.is_join == 1 &&
<a className="status-btn add-wish">
<img
src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/PC/add-success.png"
alt=""
/>
已加心愿单
</a>
}
{
item.is_join == 0 &&
<a
onClick={() => this.addWishList(item.course_id, '1')}
className="status-btn add-wish-success"
>
<img
src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/like_icon.png"
alt=""
/>
加入心愿单
</a>
}
</div>
</>
}
</div>
</CourseItem>
))
}
</div>
{
(basic.courseList && basic.courseList.length > 4) &&
<button
className="more-button"
onClick={() => this.handleToMore('basic')}
>{basic.isMore ? '查看更多' : '收起'}</button>
}
</>
}
<h4 className="ai-course__subtitle">进阶</h4>
{
(advanced.course && advanced.course.length > 0) &&
<>
<div className='groupcourse course-box'>
{
advanced.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 &&
<>
<p className={'course-title text-overflow-1'}>
{item.course_title}
</p>
<a
onClick={() => this.toCourse(item.course_id)}
className="btn to-study"
>开始学习</a>
</>
}
{
item.is_buy == 0 &&
<>
<div className="type">
{
item.type == 0 &&
<>
<span className="tag">活动价</span>
<span className="time">12.23开始</span>
</>
}
{
item.type == 1 &&
<>
<span className="tag">拼团价</span>
<span className="time">12.23开团</span>
</>
}
{
item.type == 2 &&
<>
<span className="tag">好友帮帮砍</span>
<span className="time">12.23开砍</span>
</>
}
</div>
<div className="price">
{item.type == 2 ? '到手最低:¥' : '¥'}
<span className="new-price">{item.price2}</span>
<span className="old-price">
{item.type == 2 ? '' : '现价：'}
<s>¥{item.price1}</s>
</span>
</div>
<div className="status">
<a
onClick={() => this.toCourse(item.course_id)}
className="status-btn to-buy"
>直接购买</a>
{
item.is_join == 1 &&
<a className="status-btn add-wish">
<img
src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/PC/add-success.png"
alt=""
/>
已加心愿单
</a>
}
{
item.is_join == 0 &&
<a
onClick={() => this.addWishList(item.course_id, '2')}
className="status-btn add-wish-success"
>
<img
src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/like_icon.png"
alt=""
/>
加入心愿单
</a>
}
</div>
</>
}
</div>
</CourseItem>
))
}
</div>
{
(advanced.courseList && advanced.courseList.length > 4) &&
<button
className="more-button"
onClick={() => this.handleToMore('advanced')}
>
{advanced.isMore ? '查看更多' : '收起'}
</button>
}
</>
}
<h4 className="ai-course__subtitle">高阶</h4>
{
(higher.course && higher.course.length > 0) &&
<>
<div className='groupcourse course-box'>
{
higher.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 &&
<>
<p className={'course-title text-overflow-1'}>
{item.course_title}
</p>
<a
onClick={() => this.toCourse(item.course_id)}
className="btn to-study"
>开始学习</a>
</>
}
{
item.is_buy == 0 &&
<>
<div className="type">
{
item.type == 0 &&
<>
<span className="tag">活动价</span>
<span className="time">12.23开始</span>
</>
}
{
item.type == 1 &&
<>
<span className="tag">拼团价</span>
<span className="time">12.23开团</span>
</>
}
{
item.type == 2 &&
<>
<span className="tag">好友帮帮砍</span>
<span className="time">12.23开砍</span>
</>
}
</div>
<div className="price">
{item.type == 2 ? '到手最低:¥' : '¥'}
<span className="new-price">{item.price2}</span>
<span className="old-price">
{item.type == 2 ? '' : '现价：'}
<s>¥{item.price1}</s>
</span>
</div>
<div className="status">
<a
onClick={() => this.toCourse(item.course_id)}
className="status-btn to-buy"
>直接购买</a>
{
item.is_join == 1 &&
<a className="status-btn add-wish">
<img
src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/PC/add-success.png"
alt=""
/>
已加心愿单
</a>
}
{
item.is_join == 0 &&
<a
onClick={() => this.addWishList(item.course_id, '3')}
className="status-btn add-wish-success"
>
<img
src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/like_icon.png"
alt=""
/>
加入心愿单
</a>
}
</div>
</>
}
</div>
</CourseItem>
))
}
</div>
{
(higher.courseList && higher.courseList.length > 4) &&
<button
className="more-button"
onClick={() => this.handleToMore('higher')}
>{higher.isMore ? '查看更多' : '收起'}</button>
}
</>
}
<h4 className="ai-course__subtitle">扩展</h4>
{
(expand.course && expand.course.length > 0) &&
<>
<div className='groupcourse course-box'>
{
expand.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 &&
<>
<p className={'course-title text-overflow-1'}>
{item.course_title}
</p>
<a
onClick={() => this.toCourse(item.course_id)}
className="btn to-study"
>开始学习</a>
</>
}
{
item.is_buy == 0 &&
<>
<div className="type">
{
item.type == 0 &&
<>
<span className="tag">活动价</span>
<span className="time">12.23开始</span>
</>
}
{
item.type == 1 &&
<>
<span className="tag">拼团价</span>
<span className="time">12.23开团</span>
</>
}
{
item.type == 2 &&
<>
<span className="tag">好友帮帮砍</span>
<span className="time">12.23开砍</span>
</>
}
</div>
<div className="price">
{item.type == 2 ? '到手最低:¥' : '¥'}
<span className="new-price">{item.price2}</span>
<span className="old-price">
{item.type == 2 ? '' : '现价：'}
<s>¥{item.price1}</s>
</span>
</div>
<div className="status">
<a
onClick={() => this.toCourse(item.course_id)}
className="status-btn to-buy"
>直接购买</a>
{
item.is_join == 1 &&
<a className="status-btn add-wish">
<img
src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/PC/add-success.png"
alt=""
/>
已加心愿单
</a>
}
{
item.is_join == 0 &&
<a
onClick={() => this.addWishList(item.course_id, '4')}
className="status-btn add-wish-success"
>
<img
src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/like_icon.png"
alt=""
/>
加入心愿单
</a>
}
</div>
</>
}
</div>
</CourseItem>
))
}
</div>
{
(expand.courseList && expand.courseList.length > 4) &&
<button
className="more-button"
onClick={() => this.handleToMore('expand')}
>{expand.isMore ? '查看更多' : '收起'}</button>
}
</>
} */}
</CommonContainer> </CommonContainer>
</> </>
} }
......
src/components/activity/newyear-2019/preheat/YearCourse/index.scss
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
flex-wrap: wrap; flex-wrap: wrap;
.course-container { .course-container {
width: 158px; width: 168px;
margin: 15px 0 0 0; margin: 15px 0 0 0;
text-align: center; text-align: center;
position: relative; position: relative;
...@@ -27,6 +27,20 @@ ...@@ -27,6 +27,20 @@
text-align: center; text-align: center;
} }
.bargain-price {
position: absolute;
left: 4px;
top: 10px;
margin: 0;
height: 18px;
padding: 0 8px;
border-radius: 0 9px 9px 0;
font-size: 12px;
color: #fff;
line-height: 18px;
background-color: #F01D0E;
}
.coupon-course__footer { .coupon-course__footer {
.course-title { .course-title {
padding-left: 10px; padding-left: 10px;
...@@ -144,58 +158,29 @@ ...@@ -144,58 +158,29 @@
} }
.price { .price {
text-align: left;
padding-left: 5px;
margin-top: 3px; margin-top: 3px;
color: #FF0002; padding-left: 4px;
font-size: 12px; font-size: 12px;
color: #FF0002;
text-align: left;
&.price-group { &.price-group {
font-size: 0;
height: 30px; height: 30px;
} }
.price-label {
font-size: 12px;
}
.new-price { .new-price {
font-size: 18px; font-size: 16px;
} }
.old-price { .old-price {
margin-left: 2px;
font-size: 12px; font-size: 12px;
color: #666; color: #666;
margin-left: 8px;
}
}
.price-label {
position: relative;
width: 49px;
height: 14px;
margin: 5px 0 0 19px;
line-height: 14px;
background-color: #357345;
span {
font-size: 12px;
color: #fff;
}
&::before {
content: '';
position: absolute;
top: 0;
left: -14px;
border: 7px solid;
border-color: transparent #357345 #357345 transparent;
}
&::after {
content: '';
position: absolute;
top: 0;
right: -14px;
border: 7px solid;
border-color: #357345 transparent transparent #357345;
} }
} }
......
src/components/activity/newyear-2019/year-wish/index.js
...@@ -60,106 +60,312 @@ class YarnWish extends Component { ...@@ -60,106 +60,312 @@ class YarnWish extends Component {
} }
} }
render() { toInviteFriends = (oid) => {
const {list, activityStage} = this.state const { history } = this.props
if (getParam('version')) {
let data = {
title: 'AI充电节，积福气享1折秒课，超10万元奖品来就送！！',
desc: '把这门超5万人报名的【Python基础入门 升级版】课程送给你，附200元红包，请笑纳！--七月在线',
link: `https://m.julyedu.com/togroup?id=${oid}`,
imgUrl: 'https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/active19_1111/m/index-share-img.png',
}
SendMessageToApp("toShare", data)
} else {
history.push(`/togroup?id=${oid}`);
}
}
toCart = (id) => {
const { history } = this.props;
http.post(`${API.home}/m/cart/add`, {
course_id: id
}).then((res) => {
const { code, msg } = res.data;
// code 15001 已加入购物车
if (code === 200 || code === 15001) {
if(getParam('version')) {
SendMessageToApp('toShoppingCart')
}else {
history.push('/shopcart');
}
} else if (code === 4030 || code === 4040) {
this.toLogin();
} else {
Toast.info(msg, 2);
}
})
};
render() {
const { list, activityStage } = this.state
console.log(activityStage);
return ( return (
<div className='year-wish'> <div className='year-wish'>
<div className="banner"><img <div className="banner">
src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/xy_banner_bj.png" alt=""/></div> <img src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/xy_banner_bj.png" alt=""/>
</div>
{ {
list.length > 0 ? <CommonContainer> list.length > 0
<div className='groupcourse course-box'> ? <>
{ {
list && list.length > 0 && list.map(item => ( activityStage === 2 &&
<CourseItem image={item.image_name} key={item.course_id} id={item.course_id} <>
toCourse={this.toCourse}>
<CommonContainer>
<div className='groupcourse course-box'>
{
list.map(item => (
<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 开始学习
*/}
<div className="coupon-course__footer">
{ {
item.type == 4 && item.is_buy != 1 && item.type === 4 &&
<div className="group-num">限量300个</div> <div className="bargain-price">已砍{item.already_bargain}元</div>
} }
{
item.type === 0 &&
<>
<div className="type">
<span className="tag" data-color="green">活动价</span>
</div>
<div className="price price-group">
<span className="price-label">¥</span>
<span className="new-price">{item.original_price}</span>
<span className="old-price">
<s>¥{item.original_price}</s>
</span>
</div>
</>
}
{
(item.type === 1 || item.type === 2) &&
<>
<div className="type">
<span className="tag" data-color="green">拼团价</span>
</div>
<div className="price price-group">
<span className="price-label">¥</span>
<span className="new-price">{item.pdd_price}</span>
<span className="old-price">
<s>¥{item.original_price}</s>
</span>
</div>
</>
}
{
(item.type === 5 || item.type === 7) &&
<>
<div className="type">
<span className="tag" data-color="green">拼团价</span>
</div>
<div className="price price-group">
<span className="price-label">¥</span>
<span className="new-price">0.01</span>
<span className="old-price">
<s>¥{item.original_price}</s>
</span>
</div>
</>
}
{
(item.type === 3 || item.type === 4) &&
<>
<div className="type">
<span className="tag" data-color="green">好友帮帮砍</span>
</div>
<div className="price price-group">
<span className="price-label">到手最低：¥</span>
<span className="new-price">{item.low_prize}</span>
<span className="old-price">
<s>¥{item.original_price}</s>
</span>
</div>
</>
}
{
item.type === 6 &&
<p className={'course-title text-overflow-1'}>
{item.course_title}
</p>
}
<div className="coupon-course__footer"> <div className="status">
{
item.is_buy == 1 &&
<>
<p className={'course-title text-overflow-1'}>{item.course_title}</p>
<a onClick={() => this.toCourse(item.course_id)}
className="btn to-study">开始学习</a>
</>
}
{
item.is_buy == 0 &&
<>
<div className="type">
{ {
item.type == 0 && item.type === 0 &&
<> <a
<span className="tag">活动价</span> onClick={() => this.toCart(item.course_id)}
<span className="time">12.23开始</span> className="status-btn to-group"
</> >立即购买</a>
} }
{ {
(item.type == 1 || item.type == 4) && item.type === 1 &&
<> <a
<span className="tag">拼团价</span> onClick={() => this.toCourse(item.course_id)}
<span className="time">12.23开团</span> className="status-btn to-group"
</> >立即参与拼团</a>
} }
{ {
item.type == 2 && (item.type === 2 || item.type === 7) &&
<> <a
<span className="tag">好友帮帮砍</span> onClick={() => this.toInviteFriends(item.order_id)}
<span className="time">12.23开砍</span> className="status-btn to-group"
</> data-status="done"
>已参团，邀请好友参团</a>
} }
</div>
<div className="price">
{item.type == 2 ? '到手最低:¥' : '¥'}
<span
className="new-price">{item.type == 4 ? '0.01' : item.price2}</span>
<span className="old-price">{item.type == 2 ? '' : '现价：'}<s>¥{item.price1}</s></span>
</div>
<div className="status">
<a onClick={() => this.toCourse(item.course_id)}
className="status-btn to-buy">直接购买</a>
{ {
item.is_join == 1 && item.type === 3 &&
<a className="status-btn add-wish"><img <a
src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/PC/add-success.png" onClick={() => this.toCourse(item.course_id)}
alt=""/>已加心愿单</a> className="status-btn to-group"
>我要砍价</a>
} }
{ {
item.is_join == 0 && item.type === 5 &&
<a <a
onClick={() => this.addWishList(item.course_id)} onClick={() => this.toCourse(item.course_id)}
className="status-btn add-wish-success"> className="status-btn to-group"
<img >马上抢>></a>
src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/like_icon.png" }
alt=""/>加入心愿单 {
</a> item.type === 6 &&
<a
onClick={() => this.toCourse(item.course_id)}
className="btn to-group"
data-status="study"
>开始学习</a>
} }
</div> </div>
</> </div>
} </CourseItem>
))
</div> }
</CourseItem> </div>
)) </CommonContainer>
} </>
</div> }
</CommonContainer> {
: <div className="notData"> activityStage !== 2 &&
<>
<CommonContainer>
<div className='groupcourse course-box'>
{
list.map(item => (
<CourseItem
image={item.image_name}
key={item.course_id}
id={item.course_id}
toCourse={this.toCourse}
>
{
item.type == 4 && item.is_buy != 1 &&
<div className="group-num">限量300个</div>
}
<div className="coupon-course__footer">
{
item.is_buy == 1 &&
<>
<p className={'course-title text-overflow-1'}>{item.course_title}</p>
<a
onClick={() => this.toCourse(item.course_id)}
className="btn to-study"
>开始学习</a>
</>
}
{
item.is_buy == 0 &&
<>
<div className="type">
{
item.type == 0 &&
<>
<span className="tag">活动价</span>
<span className="time">12.23开始</span>
</>
}
{
(item.type == 1 || item.type == 4) &&
<>
<span className="tag">拼团价</span>
<span className="time">12.23开团</span>
</>
}
{
item.type == 2 &&
<>
<span className="tag">好友帮帮砍</span>
<span className="time">12.23开砍</span>
</>
}
</div>
<div className="price">
{item.type == 2 ? '到手最低:¥' : '¥'}
<span
className="new-price">{item.type == 4 ? '0.01' : item.price2}</span>
<span className="old-price">{item.type == 2 ? '' : '现价：'}<s>¥{item.price1}</s></span>
</div>
<div className="status">
<a
onClick={() => this.toCourse(item.course_id)}
className="status-btn to-buy"
>直接购买</a>
{
item.is_join == 1 &&
<a className="status-btn add-wish">
<img
src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/PC/add-success.png"
alt=""
/>
已加心愿单
</a>
}
{
item.is_join == 0 &&
<a
onClick={() => this.addWishList(item.course_id)}
className="status-btn add-wish-success"
>
<img
src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/H5/like_icon.png"
alt=""
/>
加入心愿单
</a>
}
</div>
</>
}
</div>
</CourseItem>
))
}
</div>
</CommonContainer>
</>
}
</>
: (
<div className="notData">
<img src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/PC/icon-empty.png" alt=""/> <img src="https://julyedu-cdn.oss-cn-beijing.aliyuncs.com/newyear20/PC/icon-empty.png" alt=""/>
{ {
activityStage == 1 ? <p>你的心愿单目前空空如也，<br/>快去挑选更多优惠课程吧～</p> activityStage == 1
: <p>你的心愿单没有课程哦，<br/>感兴趣的课程可在双旦主会场直接购买！</p> ? <p>你的心愿单目前空空如也，<br/>快去挑选更多优惠课程吧～</p>
: <p>你的心愿单没有课程哦，<br/>感兴趣的课程可在双旦主会场直接购买！</p>
} }
</div> </div>
)
} }
</div> </div>
) )
......
src/components/activity/newyear-2019/year-wish/index.scss
...@@ -18,7 +18,7 @@ html, body, #root { ...@@ -18,7 +18,7 @@ html, body, #root {
flex-wrap: wrap; flex-wrap: wrap;
.course-container { .course-container {
width: 158px; width: 168px;
margin: 15px 0 0 0; margin: 15px 0 0 0;
text-align: center; text-align: center;
position: relative; position: relative;
...@@ -148,31 +148,46 @@ html, body, #root { ...@@ -148,31 +148,46 @@ html, body, #root {
transform: skewX(-20deg); transform: skewX(-20deg);
z-index: -1; z-index: -1;
} }
.tag[data-color="green"]:before {
background-color: #357345;
}
} }
.price { .price {
text-align: left;
padding-left: 5px;
margin-top: 3px; margin-top: 3px;
padding-left: 4px;
font-size: 12;
color: #FF0002; color: #FF0002;
font-size: 12px; text-align: left;
&.price-group {
font-size: 0;
height: 30px;
}
.price-label {
font-size: 12px;
}
.new-price { .new-price {
font-size: 18px; font-size: 16px;
} }
.old-price { .old-price {
margin-left: 2px;
font-size: 12px; font-size: 12px;
color: #666; color: #666;
margin-left: 8px;
} }
} }
.status { .status {
text-align: left;
padding-left: 5px;
position: absolute; position: absolute;
left: 0;
bottom: 10px; bottom: 10px;
right: 0;
padding: 0 5px;
text-align: left;
.status-btn { .status-btn {
display: inline-block; display: inline-block;
...@@ -189,6 +204,30 @@ html, body, #root { ...@@ -189,6 +204,30 @@ html, body, #root {
background-color: #FF8080; background-color: #FF8080;
} }
.to-group {
display: block;
width: 100%;
height: 22px;
border-radius: 11px;
box-sizing: border-box;
font-size: 14px;
color: #fff;
text-align: center;
line-height: 22px;
background: linear-gradient(-90deg,rgba(235,22,18,1) 0%,rgba(255,0,2,1) 100%);
&[data-status="study"] {
background: #0099FF;
}
&[data-status="done"] {
border: 1px solid #090F08;
font-size: 12px;
color: #090F08;
background: #FEE41D;
}
}
} }
} }
......
src/components/detail/index.js
...@@ -447,7 +447,6 @@ class Detail extends Component { ...@@ -447,7 +447,6 @@ class Detail extends Component {
this.fetchCourseInfo(); this.fetchCourseInfo();
} else { } else {
history.replace('/shopcart'); history.replace('/shopcart');
ß
} }
} else if (res.data.code === 15001) { } else if (res.data.code === 15001) {
history.replace('/shopcart'); history.replace('/shopcart');
......
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