1
resposta

Excluir apenas a td que cliquei e imcrementar uma função

Bom dia,estou com duas dúvidas simples

class View {

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

    template(model) {
        return `
            <table class="table">
                <thead class="thead-dark">
                <tr>
                    <th scope="col">ID</th>
                    <th scope="col">Nome</th>
                    <th scope="col">IMC</th>
                </tr>
                </thead>
                <tbody>
                ${model.pacientes.map(n => {
                    return `
                        <tr class="linha-tabela">
                            <th scope="row">${n.posicao()}</th>
                            <td>${n.nome}</td>
                            <td>${n.imc}</td>
                        </tr>

                        </tbody>
                    `
                }).join('')}
            </table>
        `
    }


    update(model) {
        this._elemento.innerHTML = this.template(model)
    }

}

No método _removeUsuario() queria que ele removesse o target mas ele sempre exclui o último item

class Controller {
    constructor() {
        let $ = document.querySelector.bind(document);
        this._inputNome = $("#nome") ;
        this._inputPeso = $("#peso");
        this._inputAltura = $("#altura");
        this._listaPacientes = new ListaPacientes();
        this._view = new View($(".adiciona-form"));
        this._view.update(this._listaPacientes);      
    }

    _limpaFormulario() {
        this._inputNome.value = "";
        this._inputPeso.value = "";
        this._inputAltura.value = "";

        this._inputNome.focus();
    }

    _removeUsuario() {
        $(".linha-tabela").dblclick(function() {
            this.remove();
        })
    }

    adiciona(event) {
        event.preventDefault();

        let modelo = new Model(
            this._inputNome.value,
            this._inputPeso.value,
            this._inputAltura.value,
        )

        this._listaPacientes.adiciona(modelo);
        this._view.update(this._listaPacientes);
        this._limpaFormulario();
        this._removeUsuario();
        console.log(this._listaPacientes.pacientes);       
    }  
}

e no método posicao() queria que ele colocasse de 0 a 10 como id a cada usuario que eu adicionar

class Model {

    constructor(nome, peso, altura) {
        this._nome = nome;
        this._peso = peso;
        this._altura = altura;
        Object.freeze(this);
    }

    get nome() {
        return this._nome;
    }

    get peso() {
        return this._peso;
    }

    get altura() {
        return this._altura
    }

    get imc() {
        return  Math.round(this._peso / (this._altura * this._altura));
    }

    posicao() {
        let ordem = [1,2,3,4,5,6,7,8,9,10];
        for(var i = 0; i < 10 ; i++) {
           return  ordem[i];
        }    
    }
}
1 resposta

Boa noite, Yuri! Como vai?

No método _removeUsuario() queria que ele removesse o target mas ele sempre exclui o último item

Vc poderia tentar usar event delegation pra resolver isso como mostrado nesse tópico. Vc chegou a testar essa solução? Funcionou como vc queria?

e no método posicao() queria que ele colocasse de 0 a 10 como id a cada usuario que eu adicionar

Não entendi muito bem essa parte da sua dúvida! Vc quer adicionar um ID aos pacientes da lista, é isso? Se sim, eu sugiro que vc adicione uma propriedade id na classe Model. Depois, na classe Controller, sempre for adicionar um novo paciente, atribua ao id o tamanho da lista de pacientes atual. Ficaria mais ou menos assim ( considerando que o primeiro passo de criar a propriedade id já tenha sido implementado ):

class Controller {
    // Restante do código omitido.

    adiciona(event) {
        event.preventDefault();

        let modelo = new Model(
            this._listaPacientes.pacientes.length,
            this._inputNome.value,
            this._inputPeso.value,
            this._inputAltura.value,
        );

        this._listaPacientes.adiciona(modelo);
        this._view.update(this._listaPacientes);
        this._limpaFormulario();
        this._removeUsuario();
        console.log(this._listaPacientes.pacientes);       
    }  
}

Assim, quando vc adicionar o primeiro paciente, como o array de pacientes terá tamanho 0, o ID dele será 0. Ao adicionar o segundo paciente, seu ID será 1. E assim por diante!

Pegou a ideia? Qualquer coisa é só falar!

Grande abraço e bons estudos, meu aluno!