import React, { useState, useEffect } from "react";
import PropTypes from "prop-types";
import Modal from 'antd/lib/modal';
import Spin from 'antd/lib/spin';
import Typography from 'antd/lib/typography';

const { Title } = Typography;

const JanelaStock = ({ produto, onClose }) => {
    const [ loading, setLoading ] = useState(false);
    const [ data, setData ] = useState([]);

    useEffect(() => {
        setLoading(true);
        const fail = ()=> {
            setLoading(false);
            notification["error"]({
                message: 'Lista de Stock',
                description: 'Houve uma falha ao carregar a lista de Stock...',
                style: {
                    marginTop: 100,
                }
            });
        };
        netuno.service({
            url: '/services/produtosLoja',
            method: 'POST',
            credentials: 'include',
            headers: {
                'Content-Type': 'application/json'
            },
            body: JSON.stringify({
                id: produto.id
            }),
            success: (response)=> {
                if (response.json) {
                    setData(response.json);
                    setLoading(false);
                } else {
                    fail();
                }
            },
            fail: ()=> {
                fail();
            }
        });
    }, []);
    return <Modal
        title="Stock"
        visible={true}
        onOk={()=> { onClose() } }
        onCancel={()=> { onClose() } }>
        { loading && <Spin /> }
        { data.length > 0 ?
            data.map(
                (item)=> (
                    <div>
                        <Title level={4}>{item.nome}</Title>
                        <p>Preço: {item.preco} €</p>
                        <p>Quantidade: {item.quantidade} {item.nome}s</p>
                        
                    </div>
                )
            )
        : <p>Sem Stock.</p> }
    </Modal>;
};

JanelaStock.propTypes = {
    produto: PropTypes.object.isRequired,
    onClose: PropTypes.func.isRequired
};

export default JanelaStock;

