Skip to content

Commit

Permalink
Merge pull request #209 from ResidenciaTICBrisa/destaquebotoes
Browse files Browse the repository at this point in the history 
Mecanismos de sinalizacao de tabela selecionada
  • Loading branch information
@Max-Rohrer20
Max-Rohrer20 authored Aug 8, 2024
2 parents 8caef1e + 233cf97 commit bcf12ef
Show file tree
Hide file tree
Showing 3 changed files with 140 additions and 42 deletions.
35 changes: 30 additions & 5 deletions lgbtq_connect/includes/admin/admin_script.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -438,6 +438,13 @@ function abrirModalEdicao(dados) {
// Chama a função para adicionar o listener ao formulário quando o DOM estiver pronto
document.addEventListener('DOMContentLoaded', adicionarListenerFormulario);

document.addEventListener('DOMContentLoaded', function() {
var btnPendente = document.getElementById('botao_inicial');
if (btnPendente) {
btnPendente.click();
}
});

function fecharEditor() {
document.getElementById('editPopup').style.display = "none";
document.getElementById('editModal').style.display = "none";
Expand Down Expand Up @@ -549,13 +556,34 @@ function imprimirResultados(resultados) {
}
}
}
function destacarBotao(elemento, situacao){
// Remove a rotação de todos os ícones
document.querySelectorAll('button').forEach(btn => {
const icon = btn.querySelector('i');
if (icon) {
icon.classList.remove('lc_rotate');
}
btn.style.color = ''; // Restaura a cor padrão do texto
});

// Adiciona a rotação ao ícone do botão clicado
const icon = elemento.querySelector('i');
if (icon) {
icon.classList.add('lc_rotate');
}

elemento.style.color = 'black';

titulo_tabela = document.getElementById('titulo_tabela');
titulo_tabela.innerHTML = 'Formulários ' + situacao;
}

function filtrar(elemento) {
let arr = [];

const filtro_nome = document.getElementById("busca_nome");
const filtro_servico = document.getElementById("selecao_servico");
const contador_resultados = document.getElementById("contador_resultados");
const filtro_servico = document.getElementById("selecao_servico");
if (elemento) {
Filtro.status = elemento.value;
}
Expand All @@ -568,9 +596,6 @@ function filtrar(elemento) {
Filtro.servico = filtro_servico.value;
}
arr = Filtro.realizarFiltragem(formularios_todos);
contador_resultados.innerHTML = `
<p>${arr.length} resultados encontrados<p>
`;

const tabela = document.getElementById("tabela");
const tabelaObj = new Tabela([], tabela);
Expand Down
80 changes: 45 additions & 35 deletions lgbtq_connect/includes/admin/pagina_administracao.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ function adicionar_pagina_administracao() {
'manage_options',
'lc_admin',
'mostrar_dados',
'dashicons-admin-users',
'dashicons-location',
6
);
}
Expand Down Expand Up @@ -106,44 +106,54 @@ function mostrar_dados() {
$negados = $wpdb->get_results($query_negados);
$pendentes = $wpdb->get_results($query_pendentes);
echo '<div class="button-container">';
echo '<button value="Pendente" class="btn-pendente" onclick="filtrar(this)">'
. count($pendentes) .
' novas solicitações
<i class="bi bi-arrow-right-circle"></i>
</button>';
echo '<button value="Negado" class="btn-negado" onclick="filtrar(this)">'
. count($negados) .
' solicitações negadas
<i class="bi bi-arrow-right-circle"></i>
</button>';
echo '<button value="Aprovado" class=" btn-aprovado" onclick="filtrar(this)">'
. count($aprovados) .
' solicitações aprovadas
<i class="bi bi-arrow-right-circle"></i>
</button>';
echo '<h2>Formulários</h2>';
echo '<button value="Pendente" id="botao_inicial" class="btn-pendente" onclick="filtrar(this); destacarBotao(this, \'Pendentes\')">
<div class="lc_loader-container">
<div class="lc_loader"></div>
<div class="lc_counter">' . count($pendentes) . '</div>
</div>
Pendentes
<i class="bi bi-arrow-right-circle"></i>
</button>';
echo '<button value="Aprovado" class=" btn-aprovado" onclick="filtrar(this); destacarBotao(this, \'Aprovados\')">
<div class="lc_loader-container">
<div class="lc_loader"></div>
<div class="lc_counter">'. count($aprovados) .'</div>
</div>
Aprovados
<i class="bi bi-arrow-right-circle"></i>
</button>';
echo '<button value="Negado" class="btn-negado" onclick="filtrar(this); destacarBotao(this, \'Negados\')">
<div class="lc_loader-container">
<div class="lc_loader"></div>
<div class="lc_counter">'. count($negados) . '</div>
</div>
Negados
<i class="bi bi-arrow-right-circle"></i>
</button>';
echo '</div>';
?>
</div>
</div>
<div id="contador_resultados">
</div>
<div id="filtros" >

<form method="post">
<div id="busca_nome_container" class="filtro">
<input type="text" id="busca_nome" placeholder="Pesquise pelo nome" oninput="filtrar()">
</div>
</form>
<select id="selecao_servico" class="filtro " onchange="filtrar()" required>
<option value="" selected disabled>Selecione...</option>
<option value="bar/restaurante">Bares/restaurantes</option>
<option value="entretenimento">Entretenimento</option>
<option value="beleza">Beleza</option>
<option value="hospedagem">Hospedagem</option>
<option value="ensino">Ensino</option>
<option value="academia">Academia</option>
<option value="">Todos</option>
</select>
<div id="filtros">
<h3 id="titulo_tabela"></h3>
<div style="display:flex; flex-direction: row; space-between:">
<form method="post">
<div id="busca_nome_container" class="filtro">
<input type="text" id="busca_nome" placeholder="Pesquise pelo nome" oninput="filtrar()">
</div>
</form>
<select id="selecao_servico" class="filtro " onchange="filtrar()" required>
<option value="" selected disabled>Selecione...</option>
<option value="bar/restaurante">Bares/restaurantes</option>
<option value="entretenimento">Entretenimento</option>
<option value="beleza">Beleza</option>
<option value="hospedagem">Hospedagem</option>
<option value="ensino">Ensino</option>
<option value="academia">Academia</option>
<option value="">Todos</option>
</select>
</div>
</div>
<div class="wrap">
<div id="confirmModal" class="modal" tabindex="-1">
Expand Down
67 changes: 65 additions & 2 deletions lgbtq_connect/includes/admin/style-admin.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,9 +22,11 @@

#filtros {
display: flex;
flex-direction: column;
align-items: center;
gap: 20px;
justify-content: center;

margin-top: 3em;
}

.filtro {
Expand All @@ -48,6 +50,7 @@

}
#selecao_servico{
margin-left: 2em;
border-radius: 10px;
width: 351.51px;
height: 40px;
Expand Down Expand Up @@ -385,7 +388,6 @@ table th:last-child {
flex-direction: column;
align-items: center;
gap: 10px;
margin-top: 50px;
}
.btn-aprovado, .btn-negado, .btn-pendente{
border-radius: 20px;
Expand Down Expand Up @@ -425,3 +427,64 @@ table th:last-child {
font-size: 18px;
}

.lc_rotate {
transform: rotate(90deg);
transition: transform 0.3s ease;
}

.lc_loader-container {
position: relative;
display: inline-block;
width: 50px;
height: 50px;
}

.lc_loader {
position: absolute;
width: 100%;
height: 100%;
border-radius: 50%;
animation: loader1776 2s linear infinite;
box-sizing: border-box;
}

.lc_loader::before, .lc_loader::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 50%;
box-sizing: border-box;
}

.lc_loader::before {
border: 5px solid;
border-color: rgb(235, 169, 47) transparent transparent rgb(43, 145, 87);
}

.lc_loader::after {
border: 5px solid;
border-color: transparent rgb(20, 102, 226) rgb(224, 71, 71) transparent;
animation: loader1776 2s linear infinite;
animation-delay: -1s; /* Slight delay for the second half of the border */
}

@keyframes loader1776 {
to {
transform: rotate(360deg);
}
}

.lc_counter {
font-weight: bold;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-size: 16px;
color: black;
z-index: 1;
text-align: center;
}

0 comments on commit bcf12ef

Please sign in to comment.