const HotPromoLine=(props)=>{

    const {config,  baskets,  setBaskets, itemSelected, handleClose} = props

    const {Row, Col} = ReactBootstrap
    const discountTypeList = [
        {"id":1,"name":"Value"},
        {"id":2,"name":"Percent"}
    ]
    const [labelValue,setLabelValue] = useState("Value")
    const [discountType, setDiscountType] = useState(1)
    const [value, setValue] = useState()
    const [discountValue, setDiscountValue] = useState(0)
    const [discountTo, setDisCountTo] = useState(0)
    const [reason, setReason] =useState()
    useEffect(()=>{
        const lineDiscount=getLineDiscount(baskets, itemSelected?.promo_id, itemSelected?.item_code)
        if (lineDiscount){
            setDiscountType(lineDiscount?.discount_type)
            setValue(lineDiscount?.value)
            const amountDiscount = calculateAmountDiscount(lineDiscount?.discount_type,lineDiscount?.value)
            setDiscountValue(amountDiscount)
            setDisCountTo(itemSelected?.promotion_price-amountDiscount)
        }else{
            setDiscountType(1)
            setValue(0)
            setDiscountValue(0)
            setDisCountTo(0)
        }
    },[baskets])
    const getLineDiscount = (baskets, promo_id, item_code) => {
        // Duyệt qua từng item trong baskets.items
        for (const item of baskets?.items) {
            // Kiểm tra item_code có khớp không
            if (item.item_code === item_code) {
                // Nếu có line_discount, tìm kiếm theo promo_id
                const lineDiscount = item.line_discount?.find(discount => discount.promo_id === promo_id);
                return lineDiscount || null; // Trả về line_discount hoặc null nếu không tìm thấy
            }
        }
        return null; // Trả về null nếu không tìm thấy item_code
    };
    const handleApproveHotPromoLine = () => {        
        const updatedItems = baskets?.items?.map(item => {
            if (item.item_code === itemSelected?.item_code) {
                // Tìm đúng line_discount và cập nhật giá trị
                const updatedDiscounts = item?.line_discount?.map(discount => {
                    if (discount.promo_id === itemSelected.promo_id) {
                        return {
                            ...discount,
                            discount_type: discountType,
                            value:  parseInt(value || 0),
                            discount_value:parseInt(discountValue ||0),
                            reason:reason
                        };
                    }
                    return discount; // Trả lại discount nếu không khớp
                });

                return {
                    ...item,
                    line_discount: [{"promo_id":itemSelected?.promo_id, "discount_type":discountType,"value":parseInt(value || 0),"discount_value":parseInt(discountValue ||0),"reason":reason}]
                };
            }
            return item; // Trả lại item nếu không khớp
        });
        
        // Kiểm tra xem item trong selectedItem có tồn tại trong updatedItems không
        const itemExists = updatedItems?.some(item => item.item_code === itemSelected?.item_code);

        // Nếu không tồn tại, thêm mới item với line_discount
        if (!itemExists) {
            const newDiscountLine = {
                promo_id: itemSelected.promo_id,
                discount_type: discountType,
                value: value
            };

            updatedItems.push({
                item_code: itemSelected.item_code,
                qty: 1, // Hoặc giá trị khác nếu cần
                line_discount: [newDiscountLine] // Thêm mới line_discount
            });
        }

        // Cập nhật basketsSample với items đã được cập nhật  
        
        setBaskets({ ...baskets, items: updatedItems });
        handleClose()
    };

    const handleDiscountTypeChange=(e)=>{
        setDiscountType(e.target.value)
        setValue(0)
        setLabelValue(e.target.value==1?"Value":"Percent")
        setDiscountValue(0)
            setDisCountTo(0)
    }
    const handleValueChange=(e)=>{
        
        setValue(e.target.value)       
        const amountDiscount = calculateAmountDiscount(discountType,e.target.value)
        if(amountDiscount != discountValue){            
            setDiscountValue(amountDiscount)
            setDisCountTo(itemSelected?.promotion_price - amountDiscount)
        }
    }
    const calculateAmountDiscount=(discountType, value)=>{
        let amountDiscount = 0
        if (Number( discountType)==1){
            amountDiscount = value
        }if (Number( discountType)==2){            
            amountDiscount = (parseFloat(value)/100)*parseFloat(itemSelected?.promotion_price ||0)
        }
        return amountDiscount
    }
    const handleDiscountToChange=(e)=>{
        const valueOff = itemSelected?.promotion_price - parseInt(e.target.value) 
        if (valueOff != value){
            setValue(valueOff)
        }
        setDiscountValue(valueOff)
        setDisCountTo(e.target.value)
    }
    return (
        <>
            <Row>
                <Col xs={3}>               
                    <DropdownCtl
                    label="Discount Type"
                    options={discountTypeList}
                    value={discountType}
                    onChange={(e)=> handleDiscountTypeChange(e)}
                    valueFieldName='id'
                    labelFieldName='name'
                    feedback={null}
                    size="sm"
                    autoFocus = {true}
                    allowNull ={false}
                    />
                </Col>
               <Col sx={3}>               
                    <TextInputCtl
                        label={labelValue}
                        placeholder={labelValue}
                        value={value}
                        onChange={(e)=>handleValueChange(e)}
                        type='number'
                        required={false}
                        feedback={null}
                        onEnter = {null}
                        size="sm"
                        autoFocus = {false}
                        onFocus = {null}
                        style={{textAlign:'right'}}
                        min={0}
                        max={(discountType==1?1000000:100)}
                        styleInput={{textAlign:'right'}}
             
                    />
                </Col>
                <Col sx={3}>               
                    <TextInputCtl
                        label={config?.lang=='vi'?"Giá giảm":"Promotion Price "} 
                        placeholder={config?.lang=='vi'?"Giá giảm":"Promotion Price "} 
                        value={discountValue}
                        onChange={(e)=>setDiscountValue(e.target.value)}
                        type='number'
                        required={false}
                        feedback={null}
                        onEnter = {null}
                        size="sm"
                        autoFocus = {false}
                        onFocus = {null}
                        style={{textAlign:'right', display:(discountType=='1'?'none':'')}}
                        styleInput={{textAlign:'right'}}
                        disabled={(discountType==1?false:true)}
                    />
                </Col>
                <Col sx={3}>               
                    <TextInputCtl
                        label="Giảm còn"
                        placeholder="Giảm còn"
                        value={discountTo}
                        onChange={(e)=>handleDiscountToChange(e)}
                        type='number'
                        required={false}
                        feedback={null}
                        onEnter = {null}
                        size="sm"
                        autoFocus = {false}
                        onFocus = {null}
                        style={{textAlign:'right'}}
                        styleInput={{textAlign:'right'}}
                        disabled={(discountType==1?false:true)}
                    />
                </Col>
            </Row>
            <Row>
                <Col xs={12}>
                    <TextInputCtl
                        label="Reason"
                        placeholder="Reason"
                        value={reason}
                        onChange={(e)=>setReason(e.target.value)}
                        type='text'
                        required={false}
                        feedback={null}
                        onEnter = {null}
                        size="sm"
                        autoFocus = {false}
                        onFocus = {null}
                    />
                </Col>
            </Row>
            <Row>
                <Col xs={8}>
                </Col>
                <Col xs={4}>
                    <ButtonCtl
                        label={<i class="fa fa-window-close-o" style={{paddingRight:4}} aria-hidden="true">Cancel</i>}
                        onClick={handleClose}
                        variant='secondary'
                        type='button'
                        style={{float:'right', paddingRight:10}}
                        />
                    <ButtonCtl
                        label={<i class="fa fa-check-square-o" style={{paddingRight:4}} aria-hidden="true">OK</i>}
                        onClick={handleApproveHotPromoLine}
                        variant='success'
                        type='button'
                        style={{float:'right', paddingRight:10}}
                        />
                </Col>
            </Row>
        </>
    )
}