import React from 'react'
import CouponFun from "./util";
import CouponItem from "./item";

class CouponCircle extends React.Component<any, any> {
    constructor(props) {
        super(props);
    }

    componentDidMount(): void {

    }

    render() {
        let vars = this.props.vars;
        if (vars && vars.length > 0) {
            return (
                <div>
                    {
                        vars.indexOf('circle1') != -1 ?
                            <span className={'circle1'}>
                                <i style={this.props.circleColor ? {'backgroundColor': this.props.circleColor} : {}}></i>
                            </span> : ''
                    }
                    {
                        vars.indexOf('circle2') != -1 ?
                            <span className={'circle2'}>
                            <i style={this.props.circleColor ? {'backgroundColor': this.props.circleColor} : {}}></i>
                        </span> : ''
                    }
                    {
                        vars.indexOf('leftCircle') != -1 ?
                            <div className={'leftCircle'}
                                 dangerouslySetInnerHTML={CouponFun.getCircle(this.props.circleColor)}></div> : ''
                    }
                    {
                        vars.indexOf('rightCircle') != -1 ?
                            <div className={'rightCircle'}
                                 dangerouslySetInnerHTML={CouponFun.getCircle(this.props.circleColor)}></div> : ''
                    }
                    {
                        vars.indexOf('topCircle') != -1 ?
                            <div className={'topCircle'}
                                 dangerouslySetInnerHTML={CouponFun.getCircle(this.props.circleColor)}></div> : ''
                    }

                    {
                        vars.indexOf('bottomCircle') != -1 ?
                            <div className={'bottomCircle'}
                                 dangerouslySetInnerHTML={CouponFun.getCircle(this.props.circleColor)}></div> : ''
                    }
                </div>

            );
        } else {
            return null;
        }

    }
}

export default CouponCircle;