import React, {Component} from 'react';
import {api, getParam, http} from "@/utils";
import {Toast} from 'antd-mobile';
import {Link} from 'react-router-dom'
import {getCourses} from "@/components/detail/actions";
import {connect} from "react-redux";


import './index.scss'


class BtnStatus extends Component {
    constructor(props) {
        super(props)
        this.state = {
            isbuy: 1
        }
    }

    // 加入购物车
    toCart = () => {
        let data = {
            course_id: getParam('id')
        }
        http.post(`${api.home}/m/cart/add`, data).then((res) => {
            if (res.data.code === 200) {
                Toast.info('已加入购物车', 2);
                // window.location.reload()
                this.props.getCourses();
            } else {
                Toast.info(res.data.msg, 2);
            }
        })
    }

    render() {
        let info = ''
        if (this.props.data && this.props.data.course_info) {
            info = this.props.data.course_info
        }
        return (

            <div>
                {/*正常购买*/}
                {
                    info.is_baoming === 0 && info.group_status !== 3 &&
                    <div className='btns-box'>
                        <a className='consult consult-s' href="https://q.url.cn/AB8aue?_type=wpa&qidian=true">
                            <i className='iconfont iconerji'></i>
                            <span>课程咨询</span>
                        </a>
                        {
                            info.in_cart &&
                            <Link to='/shopcart' className='btn btn-s bg-FCCD05'>去购物车结算</Link>
                        }
                        {
                            !info.in_cart &&
                            <button className='btn btn-s bg-FCCD05' onClick={this.toCart}>加入购物车</button>

                        }
                        <Link to='/order' className='btn btn-s bg-FD7700'>立即报名</Link>
                    </div>
                }

                {/*已购买*/}
                {
                    info.is_baoming === 1 &&
                    <div className='btns-box'>
                        <a className='consult consult-m' href="https://q.url.cn/AB8aue?_type=wpa&qidian=true">
                            <i className='iconfont iconerji'></i>
                            <span>课程咨询</span>
                        </a>
                        <Link to={`/play?id=${getParam('id')}`} className='btn btn-m bg-09f'>开始学习</Link>
                    </div>
                }
                {/*拼团 未开团*/}
                {
                    info.is_baoming === 0 && info.group_status === 4&&
                    <div className='btns-box'>
                        <a className='consult consult-s' href="https://q.url.cn/AB8aue?_type=wpa&qidian=true">
                            <i className='iconfont iconerji'></i>
                            <span>课程咨询</span>
                        </a>
                        <button className='btn btn-s bg-F4AAA7'>
                            <span>¥149</span>
                            <span>直接购买</span>
                        </button>
                        <button className='btn btn-s bg-E02E24'>
                            <span>¥1</span>
                            <span>一键开团</span>
                        </button>
                    </div>
                }
                {/*拼团 已开团*/}
                {
                    info.is_baoming === 0 && info.group_status === 3 &&
                    <div className='btns-box'>
                        <a className='consult consult-s' href="https://q.url.cn/AB8aue?_type=wpa&qidian=true">
                            <i className='iconfont iconerji'></i>
                            <span>课程咨询</span>
                        </a>
                        <Link to={`/togroup`} className='btn btn-l bg-E02E24'>
                            邀请好友参团 23:32:23 后结束
                        </Link>
                    </div>
                }

                {/*砍价*/}
                {
                    this.props.status === 3 &&
                    <div className='btns-box'>
                        <a className='consult consult-s' href="https://q.url.cn/AB8aue?_type=wpa&qidian=true">
                            <i className='iconfont iconerji'></i>
                            <span>课程咨询</span>
                        </a>
                        <button className='btn btn-s bg-F4AAA7'>
                            <span>¥149</span>
                            <span>直接购买</span>
                        </button>
                        {
                            this.state.isbuy === 0 &&
                            <button className='btn btn-s bg-E02E24'>
                                我要砍价
                            </button>
                        }
                        {
                            this.state.isbuy === 1 &&
                            <button className='btn btn-s bg-E02E24'>
                                <span>¥1</span>
                                <span>去支付</span>
                            </button>
                        }
                    </div>
                }

                {/*特殊课程*/}
                {
                    this.state.isbuy === 20 &&
                    <div className='btns-box'>
                        <a className='consult-l' href="https://q.url.cn/AB8aue?_type=wpa&qidian=true">
                            <i className='iconfont iconerji'></i>
                            <span>课程咨询</span>
                        </a>
                    </div>
                }
            </div>
        )
    }
}

export default connect(
    null,
    {getCourses}
)(BtnStatus);