优惠券

src/components/coupons/Coupon/index.js.bak

+import React, { PureComponent } from 'react'
+import './coupon.scss'
+import classnames from 'classnames'
+
+class Coupon extends PureComponent {
+
+    VOUCHER = 1   //代金券
+    FREE = 2  //免单券
+    EXPAND = 4    //膨胀全
+
+
+    pick = () => {
+        let {useCoupon, invalid} = this.props
+        !invalid && useCoupon && useCoupon(this.props.id)
+
+    }
+
+    GoToUse = () => {
+        this.props.useCoupon(this.props.id)
+    }
+    ExchangeCourse = (e) => {
+        this.props.toExchangeCourse(e, this.props.code)
+    }
+
+    render() {
+        let {
+            ctype,
+            amount,
+            format_expire_time,
+            limit_course,
+            invalid,
+            course_title,
+            id,
+            code,
+            selectedCouponId,
+            showUseButton
+        } = this.props
+
+        return (
+            <li className='coupon' onClick={this.pick}>
+                <div className={classnames('coupon-info', invalid ? 'invalid' : `coupon-type${ctype}`)}>
+                    <p className='type'>{ctype === this.VOUCHER ? '代金券' : '课程券'}</p>
+                    {
+                        ctype === this.VOUCHER ? <p className='denomination'>{amount} <span>元</span></p>
+                            : <p className='course-title'>{course_title}</p>
+
+                    }
+                    <p className='expire'>有效期至：{format_expire_time}</p>
+                    {
+                        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">
+                    <span className='limit'>{
+                        limit_course === 0 ? '可用于大于代金券金额的课程' : `仅适用于《${course_title}》`
+                    }</span>
+                    {
+                        showUseButton && ctype == this.VOUCHER &&
+                        <button
+                            className='use'
+                            onClick={this.GoToUse}
+                        >立即使用
+                        </button>
+                    }
+                    {
+                        showUseButton && ctype == this.FREE &&
+                        <button
+                            className='use'
+                            onClick={(e) => this.ExchangeCourse(e)}
+                        >立即兑换
+                        </button>
+                    }
+
+                </div>
+            </li>
+        )
+    }
+}
+
+function BaseCoupon(
+    {
+        pick,
+        ctype,
+        invalid,
+        top,
+        VOUCHER,
+        FREE,
+        EXPAND,
+        limitMessage,
+        bottomButton
+    }) {
+    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}
+                <ul>
+                    {
+                        new Array(19).fill('a').map((item, index) => {
+                            return <li key={index}/>
+                        })
+                    }
+                </ul>
+            </div>
+            <div className="coupon-des">
+                <span className='limit'>
+                    {limitMessage}
+                </span>
+                {bottomButton}
+            </div>
+        </li>
+    )
+}
+
+export default Coupon

src/components/coupons/myCoupons/index.js

@@ -140,31 +140,36 @@ class UseCoupon extends PureComponent {
     getAllCoupons = () => {
         Promise.all([
             http.post(`${API.home}/m/coupon/select`, {course_id: this.state.courseId}),
-            http.get(`${API.home}/m/expansion`)
+            http.get(`${API.home}/m/coupon/expansion`)
         ]).then((coupons) => {
-
-        })
-        /*http.post(`${API.home}/m/coupon/select`, {course_id: this.state.courseId})
-            .then(res => {
-                const data = res.data
-                if (data.code === 200) {
-
-                    const inuse_coupon = data.data['inuse_coupon']
-
-
+            const [selectCoupons, expansionCoupons] = coupons
+            const {data: select} = selectCoupons
+            const {data: expansion} = expansionCoupons
+            if (select.code === 200) {
+                const inuse_coupon = select.data['inuse_coupon']
                 this.setState({
                     valid_coupons: inuse_coupon
-                            ? [...inuse_coupon, ...data.data.valid_coupons]
-                            : data.data.valid_coupons,
-                        invalid_coupons: data.data.invalid_coupons,
+                        ? [...inuse_coupon, ...select.data.valid_coupons]
+                        : select.data.valid_coupons,
+                    invalid_coupons: select.data.invalid_coupons,
                     selectedCouponId: inuse_coupon.length ? inuse_coupon[0].id : 0
                 })
 
             } else {
                 Toast.info(data.msg)
             }
-            })*/
-        // http.get(`${API.home}/m/expansion`)
+            if (expansion.code == 200) {
+                Array.isArray(expansion.data)
+                && (expansion.data = expansion.data.map(item => (item.ctype = 4, item)))
+                && (this.setState({
+                    valid_coupons: this.state.valid_coupons.concat(expansion.data)
+                }))
+            } else {
+                Toast.info(expansion.msg)
+            }
+
+
+        })
     }
 
     // 立即兑换课程