Solucionado (ver solução)
Solucionado
(ver solução)
6
respostas

Erro coluna Data a inserir o item

Quando incluo o item da lista a coluna data fica assim: "${data.getDate()}/${data.getMonth()+1}/${data.getFullYear()}"

DateHelper

lass DateHelper{

    constructor(){
       throw new Error('Esta classe não pode ser instanciado') ;
    }

    static dataParaTexto(data){
        return '${data.getDate()}/${data.getMonth()+1}/${data.getFullYear()}'

    }

    static textoParaData(texto){

        if (!/\d{4}-\d{2}-\d{2}/.test(texto)){
            throw new Error('Deve ser no formato aaa-mm-dd');
        }
        return new Date(...texto.split('-') .map((item, indice) => item - indice % 2));
    }
}

NegociacoesView

class NegociacoesView{

    constructor(elemento){
        this._elemento = elemento;
    }

    _template(model){
        return `<table class="table table-hover table-bordered">
                    <thead>
                        <tr>
                            <th>DATA</th>
                            <th>QUANTIDADE</th>
                            <th>VALOR</th>
                            <th>VOLUME</th>
                        </tr>
                    </thead>

                    <tbody>
                        ${model.negociacoes.map(n => {
                            return `
                                <tr>
                                    <td>${DateHelper.dataParaTexto(n.data)}</td>
                                    <td>${n.quantidade}</td>
                                    <td>${n.valor}</td>
                                    <td>${n.volume}</td>
                                </tr>
                            `
                        }).join('')} 

                    </tbody>

                    <tfoot>
                    </tfoot>
                </table>`;
    }

    //com o join vira uma string

    update(model){
        this._elemento.innerHTML = this._template(model);
    }
}

NegociacaoController

class NegociacaoController {

    //criado a classe para ele buscar no DOM somente uma vez, melhorando assim a performance
    constructor(){
        //let $ = document.querySelector; nesse caso ele não mantém associação com o document, então usar o bind
        let $ = document.querySelector.bind(document);
        this._inputData = $('#data');
        this._inputQuantidade = $('#quantidade');
        this._inputValor = $('#valor');
        this._listaNegociacoes = new ListaNegociacoes();
        this._negociacoesView = new NegociacoesView($('#negociacoesView'));

        this._negociacoesView.update(this._listaNegociacoes);
    }

    adiciona(event){
        event.preventDefault();
        this._listaNegociacoes.adiciona(this._criarNegociacao());
        this._negociacoesView.update(this._listaNegociacoes);
        this._limpaFormulario();
    }

    _criarNegociacao(){
        return new Negociacao(
            DateHelper.textoParaData(this._inputData.value),
            this._inputQuantidade.value,
            this._inputValor.value);
    }

    _limpaFormulario(){
        this._inputData.value = '';
        this._inputQuantidade.value = 1;
        this._inputValor = 0.0;
        this._inputData.focus();
    }
}
6 respostas

Oi Cauê tudo bem?

Poderia colocar seu projeto no github, por gentileza, assim a gente tem certeza que estão todos os arquivos e fica mais fácil de analisar e também de te mostrar as alterações.

solução!

Encontrei o erro . Você usou aspas simples, deveria ter usado o backtick (acento da crase) . Veja se funciona agora. Se der mais erros sobe o projeto no github que a gente arruma até dar certo.

Olá André, em que lugar você diz ?

Aqui

        return '${data.getDate()}/${data.getMonth()+1}/${data.getFullYear()}'

Maravilha, obrigado André...

Disponha e bons estudos!!!