Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

Desafio 1

Olá, Fiz um projeto do meu jeito, um pouco diferente do professor. No desafio 1, do jeito que estou fazendo não está funcionando a confirmação, gostaria de saber se alguém ver o motivo. Não queria simplesmente copiar e colar do professor.

function alterarStatus(id){
    let botaoClicado = document.getElementById(`game-${id}`);
    let imagem = botaoClicado.querySelector('.dashboard__item__img');
    let botao = botaoClicado.querySelector('.dashboard__item__button');
    let nomeJogo = botaoClicado.querySelector('.dashboard__item__name');

    if (botao.classList.contains('dashboard__item__button--return')) {
    if (confirm(`Você tem certeza que deseja devolver o jogo ${nomeJogo.textContent}?`)) {
        botao.classList.remove ('dashboard__item__button--return');
        botao.textContent = 'Alugar';
    }
    } else {
        botao.classList.add ('dashboard__item__button--return');
        botao.textContent = 'Devolver';
    }

    if (imagem.classList.contains ('dashboard__item__img--rented')) {
        imagem.classList.remove ('dashboard__item__img--rented');
    } else {
        imagem.classList.add ('dashboard__item__img--rented');

}
}
1 resposta
solução!

Olá Armando, como vai? Espero que esteja bem!

Pelo que pude observar no seu código, parece que a confirmação não está funcionando porque a classe 'dashboard__item__button--return' é removida ou adicionada independentemente do resultado da confirmação.

O que você pode fazer é mover a adição e remoção de classes para dentro do bloco de confirmação, assim a classe só será alterada se a pessoa usuária confirmar a ação. Veja como ficaria:

function alterarStatus(id){
    let botaoClicado = document.getElementById(`game-${id}`);
    let imagem = botaoClicado.querySelector('.dashboard__item__img');
    let botao = botaoClicado.querySelector('.dashboard__item__button');
    let nomeJogo = botaoClicado.querySelector('.dashboard__item__name');

    if (botao.classList.contains('dashboard__item__button--return')) {
        if (confirm(`Você tem certeza que deseja devolver o jogo ${nomeJogo.textContent}?`)) {
            botao.classList.remove ('dashboard__item__button--return');
            botao.textContent = 'Alugar';
            imagem.classList.remove ('dashboard__item__img--rented');
        }
    } else {
        botao.classList.add ('dashboard__item__button--return');
        botao.textContent = 'Devolver';
        imagem.classList.add ('dashboard__item__img--rented');
    }
}

Dessa forma, a classe só será alterada se a pessoa usuária confirmar a ação. Espero ter ajudado e bons estudos!