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

Importar negociações

// CLASSE LISTANEGOCIACOES
class ListaNegociacoes {
  constructor() {
    this._negociacoes = [];
  }
  adiciona(negociacao) {
    this._negociacoes.push(negociacao);
  }
  get negociacoes() {
    return [].concat(this._negociacoes);
  }
  esvazia() {
    this._negociacoes = [];     
  }
}

// CONTROLLER
class NegociacaoController {
    constructor() {
        let $ = document.querySelector.bind(document); // salva o querySelector em $ mantendo a associação à document.

        this._inputData         = $('#data');
        this._inputQuantidade   = $('#quantidade');
        this._inputValor        = $('#valor');

        this._listaNegociacoes  = new Bind(
            new ListaNegociacoes(),
            new NegociacoesView($('#negociacoesView')),
            'adiciona','esvazia'
        );
        this._mensagem = new Bind(
            new Mensagem(), 
            new MensagemView($('#mensagemView')), 
            'texto'
        );        
    }

    adiciona(event) {
        event.preventDefault();

        this._listaNegociacoes.adiciona(this._criaNegociacao());
        this._mensagem.texto = 'Negociação adicionada com sucesso.';
        this._limpaFormulario();
    }

    importaNegociacoes() {
        let xhr = new XMLHttpRequest();

        xhr.open('GET', 'negociacoes/semana');

        // CONFIGURAÇÕES
        xhr.onreadystatechange = () => {
            /*
                ESTADOS DE REQUISIÇÕES AJAX

                0: requisição ainda não iniciada
                1: conexão com o servidor estabelecida
                2: requisição recebida
                3: processando requisição
                4: requisição concluída e a resposta está pronta
            */
            if(xhr.readyState == 4) {
                if(xhr.status == 200) {                   
                   JSON.parse(xhr.responseText)
                    .map(objeto => new Negociacao(new Date(objeto.data), objeto.quantidade, objeto.valor))
                    .forEach((obj) => {
                        console.log(obj); // objeto OK
                        this._listaNegociacoes.adiciona(obj); // obj undefined
                    });
                } else {
                   console.log('deu ruim');                    
                }
            }
        };

        xhr.send();
    }

    apaga() {
        this._listaNegociacoes.esvazia();
        this._mensagem.texto = 'Negociações apagadas com sucesso.';
    }

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

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

Salve galera! Alguém pode dar uma ajuda? No console.log o obj está certo, mas quando é feita a tentativa de adicionar à _listaNegociacoes.adiciona é undefined. Como assim?

11 respostas

Willian Piantkoski,

Você criou essa this._listaNegociacoes? vc Deu um new ou algo do tipo? Essa lista é um tipo classe não é? Se for você precisa instanciar essa variável do tipo classe ListaNegociacoes.

Att. Fabiano Farah

Foi criada sim Fabiano. Já a utilizo para inserir uma nova negociação à lista e ela funciona. Só tem problema nesse caso.

Obrigado!

Você precisa postar o código do seu controller completo, inclusive de ListaNegociacoes.

Ok Flavio. Já editei o código acima com a classe e o controller. Obrigado!

Agora que passa sua classe Negociacao. O código anterior esta ok.

Vi que você mudou o nome do método da classe DateHelper. Não é esse o problema, mas sugiro fazer isso no final. É meio deselegante a gente perder um tempo considerável procurando erros quando eles são resultantes de renomeações que podem ficar faltando. Não parece ser o seu caso, mas aguardo o código Negociacao.

class Negociacao {
  constructor(data, quantidade, valor) {
    this._data = new Date(data.getTime());
    this._quantidade = quantidade;
    this._valor = valor;
    Object.freeze(this);
  }

  get data() {
    return new Date(this._data.getTime());
  }

  get quantidade() {
    return this._quantidade;
  }

  get valor() {
    return this._valor;
  }

  get volume() {
    return this._quantidade * this._valor;
  }
}

Segue o código da classe Negociação

Wilian, estou achando que você omitiu sem querer alguma mensagem importante de erro.

Vou pedir para você executar novamente sua aplicação, ir no console do Chrome e colar a mensagem de erro, mesmo que gigante para mim.

Se tiver repositório de git e quiser compartilhar o endereço do seu projeto seria ideal.

Pode ficar tranquilo que mais de 700 pessoas já passaram dessa parte sem problema algum. Vamos descobrir, estou curioso.

Aguardo o código de erro completo.

Este é o erro do console.

/*
Uncaught TypeError: Cannot read property 'getDate' of undefined
    at Function.dateToText (http://localhost:3000/js/app/helpers/DateHelper.js:7:19)
    at model.negociacoes.map.n (http://localhost:3000/js/app/views/NegociacoesView.js:21:32)
    at Array.map (native)
    at NegociacoesView.template (http://localhost:3000/js/app/views/NegociacoesView.js:19:31)
    at NegociacoesView.update (http://localhost:3000/js/app/views/View.js:11:37)
    at Bind.ProxyFactory.create.model (http://localhost:3000/js/app/helpers/Bind.js:3:65)
    at Proxy.<anonymous> (http://localhost:3000/js/app/service/ProxyFactory.js:8:28)
    at JSON.parse.map.forEach (http://localhost:3000/js/app/controllers/NegociacaoController.js:52:48)
    at Array.forEach (native)
    at XMLHttpRequest.xhr.onreadystatechange (http://localhost:3000/js/app/controllers/NegociacaoController.js:50:22)
*/

e aqui o repositório: https://github.com/wjpiantkoski/js6

solução!

Agora sim! :) O problema esta no seu template, de NegociacoesView.

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

Você esta fazendo n.date, o correto é n.data.

Putz, é verdade! Eu tinha deixado todos como date, mas mudei para data e esqueci desse cara. Valeu Flavio. Agradeço muito a atenção!

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software