class tarjetaTiradasPrecio {
    
    constructor(domItem, id, tirada, precio, precio_unidad) {
        this.domItem = domItem;
        this.id = id;
        this.tirada = tirada;
        this.precio = precio;
        this.precio_unidad = precio_unidad;

        this.card = this.#generateHTML(id, tirada, precio, precio_unidad);
        this.domItem.append(this.card);
    }

    #generateHTML(id, tirada, precio, precio_unidad) {

        let $html = $('<div>', {
            id: id,
            class: 'list-group mb-2 tarjeta-tiradas-precios'
        });

        let $link = $('<a>', {
            href: 'javascript:void(0);',
            class: 'list-group-item'
        });

        let $liWrapper = $('<div>', {
            class: 'li-wrapper d-flex justify-content-start align-items-center'
        });

        let $listContent = $('<div>', {
            class: 'list-content'
        });

        const formattedPrecio = precio.toString().replace('.', ',');
        const formattedPrecioUnidad = precio_unidad.toString().replace('.', ',');

        $listContent.append($('<h7>', {
            id: 'ud_' + id,
            class: 'mb-1 tarjeta-tiradas-precios-tirada',
            text: tirada + ' ud.'
        }).attr('data', tirada));

        $listContent.append($('<h6>', {
            id: 'tot_' + id,
            class: 'mb-1 tarjeta-tiradas-precios-precio',
            text: 'Total: ' + formattedPrecio + '€'
        }).attr('data', precio));

        $listContent.append($('<h7>', {
            id: 'pu_' + id,
            class: 'mb-1 tarjeta-tiradas-precios-precio-unidad',
            text: formattedPrecioUnidad + '€/ud'
        }).attr('data', precio_unidad));

        $liWrapper.append($listContent);
        $link.append($liWrapper);
        $html.append($link);

        return $html;
    }
}

export default tarjetaTiradasPrecio;