import React from "react"
import style from './index.less'
import { CheckCircleFilled } from "@ant-design/icons"


/**
 * 投放方式
 * @param param0 
 * @returns 
 */
const DeliveryMethod: React.FC<PULLIN.FormItemDataNewProps<string>> = ({ data, value, onChange }) => {


    return <div className={style.marketingGoal}>
        <div className={style.marketingGoal_row}>
            {
                data.map(item => <div
                    key={item.value}
                    onClick={() => {
                        if (!item.disabled) {
                            onChange?.(item.value)
                        }
                    }}
                    className={`${style.marketingGoal_col} ${value === item.value ? style.marketingGoal_active : ''} ${item.disabled ? style.marketingGoal_disable : ''}`}
                    style={{ height:  60, width: 200, alignItems: 'flex-start', padding: '0 10px' }}
                >
                    {value === item.value ? <>
                        <div><CheckCircleFilled /></div>
                    </> : null}
                    <span>{item.label}</span>
                    <p style={{}}>{item.desc}</p>
                </div>)
            }
        </div>
    </div>
}

export default React.memo(DeliveryMethod)