Files
quiz-ius/lista/index.php
2026-04-07 20:46:59 +00:00

152 lines
6.4 KiB
PHP
Executable File

<?php
// exigir login para acessar a página
// include '../proteger.php';
// Conectar ao banco de dados MySQL
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "xcmg";
$conn = new mysqli($servername, $username, $password, $dbname);
if ($conn->connect_error) {
die("Conexão falhou: " . $conn->connect_error);
}
// Buscar cadastros não ativados
$sql = "SELECT id, nome, empresa, cargo, telefone, dados_adicionais, codigo FROM cadastros WHERE status = 0";
$result = $conn->query($sql);
?>
<!DOCTYPE html>
<html lang="pt">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Lista de Cadastros</title>
<?php include '../header.php'; ?>
<style>
body {
color: #000;
}
h2 {
color: #ccc;
}
</style>
</head>
<body class="p-6 bg-gray-100" app="lista">
<div class="flex items-center justify-between mb-6 bg-white p-4 rounded shadow">
<h2 class="text-xl font-bold !text-gray-800">Lista de Cadastros</h2>
<div class="flex items-center space-x-6">
<!-- Toggle Ativados -->
<label class="inline-flex items-center cursor-pointer">
<input type="checkbox" id="toggleAtvados" class="sr-only peer">
<div class="relative w-11 h-6 bg-gray-200 peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-green-300 rounded-full peer dark:bg-gray-700 peer-checked:after:translate-x-full rtl:peer-checked:after:-translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:start-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all dark:border-gray-600 peer-checked:bg-green-600"></div>
<span class="ms-3 text-sm font-medium text-gray-700">Mostrar Ativados</span>
</label>
<!-- Download Button -->
<a href="gerar_excel.php" class="bg-gray-800 hover:bg-gray-900 text-white px-4 py-2 rounded-lg text-sm font-medium transition flex items-center shadow-md">
<svg class="w-4 h-4 me-2" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"></path></svg>
Download Excel
</a>
</div>
</div>
<div id="cadastros">
<!-- Itens serão carregados via polling -->
</div>
<script src="../js/jquery.js"></script>
<script>
let showActivated = false;
function refreshList() {
$.getJSON("atualiza.php?rand=" + Math.random() + "&ativados=" + showActivated, function (data) {
const container = $("#cadastros");
container.empty();
if (data.length === 0) {
container.append('<p class="text-center text-gray-400 py-10 italic">Nenhum cadastro encontrado.</p>');
return;
}
$.each(data, function (key, val) {
const isActivated = val.status == 1;
const rowClass = isActivated ? 'opacity-50 grayscale bg-gray-50' : 'bg-white';
container.append(`
<div class="row-dados p-4 shadow rounded mb-2 flex justify-between items-center ${rowClass}" id="cadastro-${val.id}">
<div class="col-codigo text-gray-800">
<strong>${val.codigo}</strong>
</div>
<div class="col-dados flex-grow px-8">
<p class="text-gray-900 font-bold text-lg">${val.nome}</p>
<p class="text-gray-600">${val.empresa}</p>
${val.email ?
`<p class="text-sm text-gray-500">Email: <span class="font-medium">${val.email}</span></p>` :
`<p class="text-sm text-gray-400 italic">Email: (não informado)</p>`
}
</div>
<div class="col-acao">
${!isActivated ?
`<button class="bg-green-600 hover:bg-green-700 text-white px-6 py-2 rounded-lg font-bold shadow-sm activate" data-id="${val.id}">Ativar</button>` :
`<span class="text-green-700 font-bold bg-green-100 px-3 py-1 rounded-full text-sm">✓ Ativado</span>`
}
</div>
</div>
`);
});
// Reatribui eventos
bindEvents();
});
}
function bindEvents() {
$(".activate").off('click').on('click', function () {
let id = $(this).data("id");
let btn = $(this);
btn.prop('disabled', true).addClass('opacity-50');
$.post("ativar.php", { id: id }, function (response) {
if (response == "success") {
if (!showActivated) {
$("#cadastro-" + id).fadeOut(300);
} else {
refreshList();
}
} else {
alert("Erro ao ativar!");
btn.prop('disabled', false).removeClass('opacity-50');
}
});
});
}
$(document).ready(function () {
// Inicializa Polling
refreshList();
setInterval(refreshList, 5000); // Polling a cada 5 segundos
// Toggle Ativados
$("#toggleAtvados").on('change', function() {
showActivated = $(this).is(':checked');
refreshList();
});
});
</script>
<style>
body {
background: #111 !important;
}
.col-codigo {
font-size: 32px;
}
</style>
</body></html>