430 lines
18 KiB
PHP
430 lines
18 KiB
PHP
<?php
|
|
include ("header.php");
|
|
include (__DIR__."/php/funciones.php");
|
|
|
|
$cursos = obtenerCursos();
|
|
$cupones = obtenerCupones();
|
|
function obtenerNombreCursoPorId($cursos, $idBuscado) {
|
|
foreach ($cursos as $curso) {
|
|
if (isset($curso['id']) && $curso['id'] === $idBuscado) {
|
|
return $curso['name'] ?? null;
|
|
}
|
|
}
|
|
return null; // Si no se encuentra
|
|
}
|
|
?>
|
|
<main class="app-main">
|
|
<!--begin::App Content Header-->
|
|
<section class="content">
|
|
<div class="container-fluid">
|
|
<div class="content-area">
|
|
<h1>Administración de Cupones</h1>
|
|
|
|
<?php if (isset($_SESSION['mensaje'])): ?>
|
|
<p style="color: green;"><?= $_SESSION['mensaje'] ?></p>
|
|
<?php unset($_SESSION['mensaje']); ?>
|
|
<?php endif; ?>
|
|
|
|
<!--modal editar cupon-->
|
|
<div id="modal-editar" class="modal" tabindex="-1">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title">Editar Cupón</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<form id="form-editar" method="POST">
|
|
<label>Codigo: <input type="text" id="editar-codigo" min="1" max="100" disabled></label><br>
|
|
<input type="hidden" id="editar-descuento" value="100"><br>
|
|
<label>Curso:
|
|
<select id="editar-curso_id">
|
|
<option value="1">Cupón para cualquier curso</option>
|
|
<?php foreach ($cursos as $curso): ?>
|
|
<option value="<?= $curso['id'] ?>"><?= $curso['name'] ?></option>
|
|
<?php endforeach; ?>
|
|
</select>
|
|
</label><br>
|
|
<label>Fecha Inicio: <input type="date" id="editar-fecha_inicio" required></label><br>
|
|
<label>Fecha Fin: <input type="date" id="editar-fecha_fin" required></label><br>
|
|
<label>Usos Máximos (0 para ilimitados): <input type="number" id="editar-usos_maximos" min="0" value="1"></label><br>
|
|
<label><input type="checkbox" id="editar-activo"> Activo</label><br>
|
|
|
|
|
|
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" id="editarCupon">Guardar Cambios</button>
|
|
<button type="button" id="cerrar-modal">Cancelar</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
</div>
|
|
<!--modal editar cupon-->
|
|
|
|
<!--modal eliminar-->
|
|
<div id="modalEliminar" class="modal" tabindex="-1">
|
|
|
|
<div class="modal-dialog modal-dialog-centered">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title">Confirmar eliminación</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Cerrar" onclick="cerrarModalEliminar()"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
¿Estás seguro de que deseas eliminar este elemento?
|
|
<input type="hidden" id="eliminarCodigo">
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal" onclick="cerrarModalEliminar()">Cancelar</button>
|
|
<button type="button" class="btn btn-danger" id="confirmarEliminar">Eliminar</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- modal elimnar-->
|
|
<!---->
|
|
<div class="accordion" id="accordionCupones">
|
|
<!-- Acordeón 1: Crear nuevo cupón -->
|
|
<div class="accordion-item">
|
|
<h2 class="accordion-header" id="headingCrear">
|
|
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseCrear" aria-expanded="false" aria-controls="collapseCrear">
|
|
Crear Nuevo Cupón
|
|
</button>
|
|
</h2>
|
|
<div id="collapseCrear" class="accordion-collapse collapse" aria-labelledby="headingCrear" data-bs-parent="#accordionCupones">
|
|
<div class="accordion-body">
|
|
<form method="POST">
|
|
<div class="card card-primary">
|
|
<div class="card-header">
|
|
<h3 class="card-title">Crear Cupón</h3>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="form-group">
|
|
<label for="codigo">Código</label>
|
|
<a href="javascript:void(0);" id="generaCodigo" class="btn btn-link btn-sm" title="Generar Código">
|
|
click aqui para codigo aleatorio
|
|
</a>
|
|
<input type="text" class="form-control" id="codigo" name="codigo" minlength="1" maxlength="100" required>
|
|
</div>
|
|
<div class="form-group">
|
|
|
|
<input type="hidden" class="form-control" id="descuento" name="descuento" value="100">
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="curso_id">Curso</label>
|
|
<select class="form-control" id="curso_id" name="curso_id">
|
|
<option value="1">Cupón para cualquier curso</option>
|
|
<?php foreach ($cursos as $curso): ?>
|
|
<option value="<?= $curso['id'] ?>"><?= $curso['name'] ?></option>
|
|
<?php endforeach; ?>
|
|
</select>
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="fecha_inicio">Fecha Inicio</label>
|
|
<input type="date" class="form-control" id="fecha_inicio" name="fecha_inicio" required>
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="fecha_fin">Fecha Fin</label>
|
|
<input type="date" class="form-control" id="fecha_fin" name="fecha_fin" required>
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="usos_maximos">Usos Máximos (0 para ilimitados)</label>
|
|
<input type="text" class="form-control" id="usos_maximos" name="usos_maximos" min="0" value="1">
|
|
</div>
|
|
</div>
|
|
<div class="card-footer">
|
|
<button type="button" name="crear_cupon" id="crear_cupon" class="btn btn-primary">Crear Cupón</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Acordeón 2: Cupones existentes -->
|
|
<div class="accordion-item">
|
|
<h2 class="accordion-header" id="headingExistentes">
|
|
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseExistentes" aria-expanded="false" aria-controls="collapseExistentes">
|
|
Cupones Existentes
|
|
</button>
|
|
</h2>
|
|
<div id="collapseExistentes" class="accordion-collapse collapse" aria-labelledby="headingExistentes" data-bs-parent="#accordionCupones">
|
|
<div class="accordion-body">
|
|
<table id="tablaCupon" class="table table-striped display responsive nowrap">
|
|
<thead>
|
|
<tr>
|
|
<th>Código</th>
|
|
<th>Curso</th>
|
|
<th>Válido Desde</th>
|
|
<th>Válido Hasta</th>
|
|
<th>Usos</th>
|
|
<th>Estado</th>
|
|
<th class="acciones">Acciones</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
|
|
<?php foreach ($cupones as $cupon): ?>
|
|
<?php $nombre = obtenerNombreCursoPorId($cursos, $cupon['curso_id']);?>
|
|
<tr>
|
|
<td><?= $cupon['codigo'] ?></td>
|
|
<td><?= $nombre ?? 'Cualquier curso' ?></td>
|
|
<td><?= $cupon['fecha_inicio'] ?></td>
|
|
<td><?= $cupon['fecha_fin'] ?></td>
|
|
<td><?= $cupon['usos_actuales'] ?>/<?= $cupon['usos_maximos'] == 0 ? '∞' : $cupon['usos_maximos'] ?></td>
|
|
<td><?= $cupon['activo'] ? 'Activo' : 'Inactivo' ?></td>
|
|
<td class="acciones">
|
|
<button class="btn btn-info editar-btn">Editar</button>
|
|
<button class="btn btn-danger eliminar-btn">Eliminar</button>
|
|
</td>
|
|
</tr>
|
|
<?php endforeach; ?>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!---->
|
|
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!--end::App Content-->
|
|
<div id="toast" class="toast"></div>
|
|
</main>
|
|
<script>
|
|
$(document).ready(function() {
|
|
// Evento cuando se hace clic en el mini botón
|
|
$('#generaCodigo').on('click', function() {
|
|
// Hacer una solicitud AJAX al archivo PHP
|
|
$.ajax({
|
|
url: '/php/funciones.php', // El archivo PHP que procesará la solicitud
|
|
type: 'GET', // Método GET
|
|
data: {accion: 'obtener_codigo'}, // Datos enviados al archivo PHP
|
|
success: function(response) {
|
|
// Mostrar el resultado (en este caso, lo que regrese el PHP)
|
|
$('#codigo').val(response); // Colocamos el valor devuelto en el input "codigo"
|
|
},
|
|
error: function() {
|
|
alert('Hubo un error al realizar la solicitud.');
|
|
}
|
|
});
|
|
});
|
|
});
|
|
</script>
|
|
<!--end::App Main-->
|
|
<?php include("footer.php");?>
|
|
<script>
|
|
|
|
document.querySelector('#crear_cupon').addEventListener('click', function() {
|
|
let codigo = $('#codigo').val();
|
|
let descuento = $('#descuento').val();
|
|
let curso_id = $('#curso_id').val();
|
|
let fecha_inicio = $('#fecha_inicio').val();
|
|
let fecha_fin = $('#fecha_fin').val();
|
|
let usos_maximos = $('#usos_maximos').val();
|
|
let datos = {
|
|
codigo: codigo,
|
|
descuento: descuento,
|
|
curso_id: curso_id,
|
|
fecha_inicio: fecha_inicio,
|
|
fecha_fin: fecha_fin,
|
|
usos_maximos: usos_maximos,
|
|
accion: 'anadir_codigo'
|
|
};
|
|
$.ajax({
|
|
url: '/php/funciones.php', // El archivo PHP que procesará la solicitud
|
|
type: 'POST', // Método GET
|
|
data: datos, // Datos enviados al archivo PHP
|
|
success: function(response) {
|
|
// Mostrar el resultado (en este caso, lo que regrese el PHP)
|
|
console.log(response);
|
|
response=JSON.parse(response);
|
|
if(response.success==true)
|
|
{
|
|
$('#modal-editar').hide();
|
|
showToast(response.message+' La pagina se recargara pronto', "success");
|
|
setTimeout(function() {
|
|
location.reload();
|
|
}, 3000); // 3000 milisegundos = 3 segundos
|
|
}
|
|
else
|
|
{
|
|
showToast(response.message, "error");
|
|
}
|
|
},
|
|
error: function() {
|
|
//alert('Hubo un error al realizar la solicitud.');
|
|
showToast("¡Hubo un error al realizar la solicitud!", "error");
|
|
}
|
|
});
|
|
|
|
|
|
});
|
|
function cerrarModalEliminar()
|
|
{
|
|
$('#modalEliminar').hide();
|
|
}
|
|
function showToast(message, type = 'success') {
|
|
const toast = document.getElementById("toast");
|
|
toast.className = `toast show ${type}`;
|
|
toast.innerText = message;
|
|
setTimeout(() => {
|
|
toast.className = toast.className.replace("show", "");
|
|
}, 3000); // se oculta después de 3 segundos
|
|
}
|
|
$(document).ready(function() {
|
|
// Inicializar el DataTable
|
|
var table = $('#tablaCupon').DataTable({
|
|
"paging": true, // Activar paginación
|
|
"searching": true, // Activar búsqueda
|
|
"ordering": true, // Activar ordenación
|
|
"info": true, // Mostrar información sobre la tabla
|
|
"responsive": true // Activar la responsividad
|
|
});
|
|
$('#tablaCupon').on('click', '.editar-btn', function() {
|
|
var data = table.row($(this).closest('tr')).data();
|
|
console.log(data); // Imprime los datos de la fila
|
|
$('#editar-codigo').val(data[0]);
|
|
$('#editar-curso_id').val(data[1]);
|
|
$('#editar-fecha_inicio').val(data[2]);
|
|
$('#editar-fecha_fin').val(data[3]);
|
|
$('#editar-usos_maximos').val(data[4]);
|
|
$('#editar-activo').prop('checked', data[5] == "Activo");
|
|
|
|
|
|
// Mostrar modal
|
|
$('#modal-editar').show();
|
|
});
|
|
$('#tablaCupon').on('click', '.eliminar-btn', function() {
|
|
var data = table.row($(this).closest('tr')).data();
|
|
console.log(data); // Imprime los datos de la fila
|
|
$('#eliminarCodigo').val(data[0]);
|
|
$('#modalEliminar').show();
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// Mostrar modal al hacer clic en Editar
|
|
document.querySelector('#cerrar-modal').addEventListener('click', function() {
|
|
$('#modal-editar').hide();
|
|
});
|
|
|
|
document.querySelector('#confirmarEliminar').addEventListener('click', function() {
|
|
let codigo = $('#eliminarCodigo').val();
|
|
let datos = {
|
|
codigo: codigo,
|
|
accion: 'elimnar_codigo'
|
|
};
|
|
$.ajax({
|
|
url: '/php/funciones.php', // El archivo PHP que procesará la solicitud
|
|
type: 'POST', // Método GET
|
|
data: datos, // Datos enviados al archivo PHP
|
|
success: function(response) {
|
|
// Mostrar el resultado (en este caso, lo que regrese el PHP)
|
|
console.log(response);
|
|
response=JSON.parse(response);
|
|
if(response.success==true)
|
|
{
|
|
$('#modal-editar').hide();
|
|
showToast(response.message+' La pagina se recargara pronto', "success");
|
|
setTimeout(function() {
|
|
location.reload();
|
|
}, 3000); // 3000 milisegundos = 3 segundos
|
|
}
|
|
else
|
|
{
|
|
showToast(response.message, "error");
|
|
}
|
|
},
|
|
error: function() {
|
|
//alert('Hubo un error al realizar la solicitud.');
|
|
showToast("¡Hubo un error al realizar la solicitud!", "error");
|
|
}
|
|
});
|
|
});
|
|
document.querySelector('#editarCupon').addEventListener('click', function()
|
|
{
|
|
|
|
let codigo = $('#editar-codigo').val();
|
|
let descuento = $('#editar-descuento').val();
|
|
let curso_id = $('#editar-curso_id').val();
|
|
let fecha_inicio = $('#editar-fecha_inicio').val();
|
|
let fecha_fin = $('#editar-fecha_fin').val();
|
|
let usos_maximos = $('#editar-usos_maximos').val();
|
|
|
|
if (!codigo || !descuento || !curso_id || !fecha_inicio || !fecha_fin || !usos_maximos) {
|
|
alert('Por favor, completa todos los campos obligatorios.');
|
|
return; // detiene el script
|
|
}
|
|
let checkbox = $('#editar-activo');
|
|
var valor=0;
|
|
if (checkbox.is(':checked')) {
|
|
valor = 1;
|
|
} else {
|
|
valor = 0;
|
|
}
|
|
|
|
let datos = {
|
|
codigo: $('#editar-codigo').val(),
|
|
descuento: $('#editar-descuento').val(),
|
|
curso_id: $('#editar-curso_id').val(),
|
|
fecha_inicio: $('#editar-fecha_inicio').val(),
|
|
fecha_fin: $('#editar-fecha_fin').val(),
|
|
usos_maximos: $('#editar-usos_maximos').val(),
|
|
activo: valor,
|
|
accion: 'editar_codigo'
|
|
};
|
|
$.ajax({
|
|
url: '/php/funciones.php', // El archivo PHP que procesará la solicitud
|
|
type: 'POST', // Método GET
|
|
data: datos, // Datos enviados al archivo PHP
|
|
success: function(response) {
|
|
// Mostrar el resultado (en este caso, lo que regrese el PHP)
|
|
console.log(response);
|
|
response=JSON.parse(response);
|
|
if(response.success==true)
|
|
{
|
|
$('#modal-editar').hide();
|
|
showToast(response.message+' La pagina se recargara pronto', "success");
|
|
setTimeout(function() {
|
|
location.reload();
|
|
}, 3000); // 3000 milisegundos = 3 segundos
|
|
}
|
|
else
|
|
{
|
|
showToast(response.message, "error");
|
|
}
|
|
},
|
|
error: function() {
|
|
//alert('Hubo un error al realizar la solicitud.');
|
|
showToast("¡Hubo un error al realizar la solicitud!", "error");
|
|
}
|
|
});
|
|
|
|
|
|
});
|
|
});
|
|
</script>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|