Skip to content

M
mr-julyedu
Commit 7b0f6787 by zhanghaozhe
Options

Merge branch 'deposit-migrate' into deposit-coupons 

# Conflicts:
#	src/components/coupons/myCoupons/index.js
parents ecf63dbe 79670735
Showing with 202 additions and 188 deletions
src/components/coupons/Coupon/index.js
...@@ -3,210 +3,221 @@ import './coupon.scss' ...@@ -3,210 +3,221 @@ import './coupon.scss'
import classnames from 'classnames' import classnames from 'classnames'
import { http } from "@/utils" import { http } from "@/utils"
import showAlert from '@common/deposit/end-expansion-alert' import showAlert from '@common/deposit/end-expansion-alert'
import {Toast} from 'antd-mobile' import { Toast } from 'antd-mobile'
import { withRouter } from "react-router-dom"
class Coupon extends PureComponent {
VOUCHER = 1 //代金券
FREE = 2 //免单券
EXPAND = 4 //膨胀全
class Coupon extends PureComponent {
pick = () => { VOUCHER = 1 //代金券
let {useCoupon, invalid} = this.props FREE = 2 //免单券
!invalid && useCoupon && useCoupon(this.props.id) EXPAND = 4 //膨胀全
}
GoToUse = () => { pick = (e) => {
this.props.useCoupon(this.props.id) let {useCoupon, invalid, start_amount, id, location, history, code} = this.props
const {state} = location
if(state && state.from && state.from === '/my'){
history.push(`/expand/index?deposit_code=${code}`)
return
} }
ExchangeCourse = (e) => { if (start_amount) {
this.props.toExchangeCourse(e, this.props.code) this.stopExpanding(id, e)
} else {
!invalid && useCoupon && useCoupon(this.props.id)
} }
stopExpanding = (id, e) => { }
const {amount, limit_amount} = this.props
e.stopPropagation() GoToUse = () => {
showAlert({ this.props.useCoupon(this.props.id)
amount, }
limit_amount, ExchangeCourse = (e) => {
onConfirm: () => { this.props.toExchangeCourse(e, this.props.code)
http.post(`${API.home}/m/end_expansion`, { }
id
}) stopExpanding = (id, e) => {
.then(res => { const {amount, limit_amount} = this.props
const {data} = res e.stopPropagation()
if (data.code == 200) { showAlert({
this.props.endExpansion(id) amount,
}else { limit_amount,
Toast.info(data.msg) onConfirm: () => {
} http.post(`${API.home}/m/end_expansion`, {
}) id
}
}) })
.then(res => {
const {data} = res
if (data.code == 200) {
this.props.endExpansion(id, data.data.coupon_id)
} else {
Toast.info(data.msg)
}
})
}
})
}
render() {
let {
ctype,
amount,
course_title,
showUseButton,
id,
format_expire_time,
start_amount,
limit_amount
} = this.props
let top, bottom
switch (ctype) {
case this.VOUCHER:
top = (
<>
<p className='denomination'>{amount} <span>元</span></p>
<p className='expire'>有效期至：{format_expire_time}</p>
</>
} )
bottom = (
<>
<span className={'limit'}>可用于大于代金券金额的课程</span>
{
showUseButton && ctype == this.VOUCHER &&
<button
className='use'
onClick={this.GoToUse}
>立即使用
</button>
}
</>
)
break
case this.FREE:
top = (
<>
<p className='course-title'>{course_title}</p>
<p className='expire'>有效期至：{format_expire_time}</p>
</>
)
bottom = (
<>
<span className={'limit'}>{`仅适用于《${course_title}》`}</span>
{
showUseButton && ctype == this.FREE &&
<button
className='use'
onClick={(e) => this.ExchangeCourse(e)}
>立即兑换
</button>
}
</>
render() { )
let { break
ctype, case this.EXPAND:
amount, if (!start_amount) {
course_title, top = (
showUseButton, <>
id, <p className='denomination'>{amount} <span>元</span></p>
format_expire_time, <p className='expire'>有效期至：{format_expire_time}</p>
start_amount, </>
limit_amount )
} = this.props
} else {
let top, bottom top = (
<>
switch (ctype) { <div className="progress-container">
case this.VOUCHER: <p className='denomination'>{amount} <span>元</span></p>
top = ( <div className={'progress-bar-container'}>
<>
<p className='denomination'>{amount} <span>元</span></p>
<p className='expire'>有效期至：{format_expire_time}</p>
</>
)
bottom = (
<>
<span className={'limit'}>可用于大于代金券金额的课程</span>
{
showUseButton && ctype == this.VOUCHER &&
<button
className='use'
onClick={this.GoToUse}
>立即使用
</button>
}
</>
)
break
case this.FREE:
top = (
<>
<p className='course-title'>{course_title}</p>
<p className='expire'>有效期至：{format_expire_time}</p>
</>
)
bottom = (
<>
<span className={'limit'}>{`仅适用于《${course_title}》`}</span>
{
showUseButton && ctype == this.FREE &&
<button
className='use'
onClick={(e) => this.ExchangeCourse(e)}
>立即兑换
</button>
}
</>
)
break
case this.EXPAND:
if (!start_amount) {
top = (
<>
<p className='denomination'>{amount} <span>元</span></p>
<p className='expire'>有效期至：{format_expire_time}</p>
</>
)
} else {
top = (
<>
<div className="progress-container">
<p className='denomination'>{amount} <span>元</span></p>
<div className={'progress-bar-container'}>
<span className={'progress-bar'} <span className={'progress-bar'}
style={{width: `${Math.round((amount - start_amount) / limit_amount * 100)}%`}} style={{width: `${Math.round((amount - start_amount) / limit_amount * 100)}%`}}
></span> ></span>
</div> </div>
<div className={'money'}> <div className={'money'}>
<span>{start_amount}元</span> <span>{start_amount}元</span>
<span>{limit_amount}元</span> <span>{limit_amount}元</span>
</div> </div>
</div> </div>
</> </>
) )
}
bottom = (
<>
<span className={'limit'}>全场通用</span>
{
start_amount
&& <button className='stop-expanding'
onClick={this.stopExpanding.bind(this, id)}>立即结束膨胀</button>
}
</>
)
break
} }
bottom = (
<>
<span className={'limit'}>全场通用</span>
{
start_amount
&& <button className='stop-expanding'
onClick={this.stopExpanding.bind(this, id)}>立即结束膨胀</button>
}
</>
return (
<BaseCoupon
{...this.props}
top={top}
VOUCHER={this.VOUCHER}
FREE={this.FREE}
EXPAND={this.EXPAND}
pick={this.pick}
bottom={bottom}
/>
) )
break
} }
}
function BaseCoupon(
{
pick,
ctype,
invalid,
top,
VOUCHER,
FREE,
EXPAND,
selectedCouponId,
id,
bottom
}) {
let couponTypes = {
[VOUCHER]: '代金券',
[FREE]: '课程券',
[EXPAND]: '膨胀券'
}
return ( return (
<li className='coupon' onClick={pick}> <BaseCoupon
<div className={classnames('coupon-info', invalid ? 'invalid' : `coupon-type${ctype}`)}> {...this.props}
<p className='type'>{couponTypes[ctype]}</p> top={top}
{top} VOUCHER={this.VOUCHER}
{ FREE={this.FREE}
selectedCouponId === id && EXPAND={this.EXPAND}
<i className={classnames('iconfont icondanseshixintubiao-5', { pick={this.pick}
check: !invalid bottom={bottom}
})} />
/>
}
<ul>
{
new Array(19).fill('a').map((item, index) => {
return <li key={index}/>
})
}
</ul>
</div>
<div className="coupon-des">
{bottom}
</div>
</li>
) )
}
}
function BaseCoupon(
{
pick,
ctype,
invalid,
top,
VOUCHER,
FREE,
EXPAND,
selectedCouponId,
id,
bottom
}) {
let couponTypes = {
[VOUCHER]: '代金券',
[FREE]: '课程券',
[EXPAND]: '膨胀券'
}
return (
<li className='coupon' onClick={pick}>
<div className={classnames('coupon-info', invalid ? 'invalid' : `coupon-type${ctype}`)}>
<p className='type'>{couponTypes[ctype]}</p>
{top}
{
selectedCouponId === id &&
<i className={classnames('iconfont icondanseshixintubiao-5', {
check: !invalid
})}
/>
}
<ul>
{
new Array(19).fill('a').map((item, index) => {
return <li key={index}/>
})
}
</ul>
</div>
<div className="coupon-des">
{bottom}
</div>
</li>
)
} }
export default Coupon export default withRouter(Coupon)
src/components/coupons/myCoupons/index.js
...@@ -276,11 +276,12 @@ class UseCoupon extends PureComponent { ...@@ -276,11 +276,12 @@ class UseCoupon extends PureComponent {
}) })
} }
endExpansion = id => { endExpansion = (id, validId) => {
this.setState({ this.setState({
couponList: this.state.couponList.map(item => { valid_coupons: this.state.valid_coupons.map(item => {
if (item.id === id) { if (item.id === id) {
delete item.start_amount delete item.start_amount
item.id = validId
} }
return item return item
}) })
......
src/components/detail/index.scss
...@@ -60,6 +60,7 @@ ...@@ -60,6 +60,7 @@
font-size: 14px; font-size: 14px;
color: $color_666; color: $color_666;
margin-top: 10px; margin-top: 10px;
line-height: 16px;
} }
.des { .des {
......
src/components/expand/share.js
...@@ -164,8 +164,7 @@ class ExpandShare extends Component { ...@@ -164,8 +164,7 @@ class ExpandShare extends Component {
step: 2, step: 2,
helpData: data helpData: data
}) })
this.getListorData()
console.log(data)
} else if (errno === 17018 || errno === 17020) { } else if (errno === 17018 || errno === 17020) {
this.setState({ this.setState({
isShow: true, isShow: true,
......
src/components/expand/share.scss
...@@ -569,6 +569,7 @@ ...@@ -569,6 +569,7 @@
color: #fff; color: #fff;
font-size: 15px; font-size: 15px;
margin-top: 20px; margin-top: 20px;
border: none;
} }
} }
...@@ -596,6 +597,7 @@ ...@@ -596,6 +597,7 @@
border-radius: 17px; border-radius: 17px;
color: #fff; color: #fff;
font-size: 15px; font-size: 15px;
border: none;
} }
} }
......
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