import React from 'react';
import style from './goodsSimpleElement.module.sass';
import {pathStaticGoodsImages} from "../../../../../../constants/images";
import {units} from "../../../../../../constants/units";
import {connect} from 'react-redux';
import {deleteOrdersAdmin, updateOrdersAdmin} from "../../../../../../actions/actionCreator";

const GoodsSimpleElement = (props) => {
    const {simpleGoodsData} = props;
    const {Good, valueAttribute, nameAttribute, imgUrlArray} = props.simpleGoodsData.GoodsAttribute;

    const encrementCountGoods = () => {

        props.updateOrdersAdmin([simpleGoodsData.id], {
           count: simpleGoodsData.count + 1
        });
    };
    const decrementCountGoods = () => {

        props.updateOrdersAdmin([simpleGoodsData.id], {
            count: simpleGoodsData.count - 1
        });
    };

    return (
        <div className={style.goodsElementContainer}>
            <img src={pathStaticGoodsImages + imgUrlArray[0]} alt={imgUrlArray[0]} />
            <ul className={style.simpleGoodsInfo}>
                <li>{Good.goodsName} / {Good.goodsDescription}</li>
                <li>{valueAttribute} {units[nameAttribute]}</li>
                <li>
                    <p onClick={encrementCountGoods}>Plus</p>
                    {simpleGoodsData.count} шт.
                    <p onClick={decrementCountGoods}>Minus</p>
                </li>
                <li>Идентификатор товара: {simpleGoodsData.goodsId}</li>
            </ul>
            <div onClick={() => props.deleteOrders(simpleGoodsData.id)}>del</div>
        </div>
    );
};

const mapStateToProps = state => {
    const {data} = state.adminOrdersReducers;

    return {
        data
    }
};

const mapDispatchToProps = dispatch => ({
    deleteOrders: idOrder => dispatch(deleteOrdersAdmin(idOrder)),
    updateOrdersAdmin: (ordersIdsArray, dataForUpdate) => (
        dispatch(updateOrdersAdmin(ordersIdsArray, dataForUpdate))
    )
});

export default connect(mapStateToProps, mapDispatchToProps)(GoodsSimpleElement);