File "ENTREFIRMA.PHP.bak"
Full Path: C:/wamp64/www/APPSST/firmadot/ENTREFIRMA.PHP.bak
File size: 11.13 KB
MIME-type: text/x-php
Charset: utf-8
<?PHP
session_start();
header("Cache-control: private"); // Arregla IE 6
//*******Datos de Conexion Base de Datos************
include("../bd/conexion.php");
// Procesar búsqueda
$cedula_busqueda = isset($_GET['cedula']) ? $_GET['cedula'] : '';
$resultados = [];
if (!empty($cedula_busqueda)) {
// Modificada la consulta para mostrar todos los registros y ordenarlos por FIRMA (NULL primero)
$query = "SELECT * FROM entregasst WHERE cedula = '$cedula_busqueda' ORDER BY FIRMA IS NULL DESC, fEntrega DESC";
$result = $conexion->query($query);
if ($result) {
$resultados = $result->fetch_all(MYSQLI_ASSOC);
}
}
?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Registro de Entrega EPP</title>
<link rel="icon" type="image/png" href="../img/icono.png">
<!-- Estilos y scripts -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet">
<style>
body {
background-image: linear-gradient(to right, #e2e2e2, #ffe5c9);
padding: 20px;
}
.container {
max-width: 1000px;
margin: 20px auto;
}
.signature-container {
border: 1px solid #ddd;
margin: 20px 0;
}
#signature-pad {
width: 100%;
height: 200px;
background-color: white;
border: 1px solid #e0e0e0;
touch-action: none;
}
.signature-display {
max-width: 300px;
max-height: 100px;
}
.table-responsive {
overflow-x: auto;
}
.btn-group-sm > .btn, .btn-sm {
padding: 0.25rem 0.5rem;
font-size: 0.75rem;
}
.status-pending {
background-color: #fff3cd;
}
.status-signed {
background-color: #d1e7dd;
}
</style>
</head>
<body>
<div class="container">
<h2 class="text-center mb-4"
<h2> </h2>
<a href="../dotacion/MENUP.PHP" class="btn btn-secondary"><i class="fas fa-home"></i> Menú Principal</a>
<!-- Formulario de búsqueda -->
<div class="card mb-4">
<div <div class="card-header" style="background-color: #FF8A37; color: white;">
<h2>REGISTRO DE ENTREGA EPP PERSONAL</h2>
<hr>
<h5>Buscar Operario</h5>
</div>
<div class="card-body">
<form method="get" class="row g-3">
<div class="col-md-8">
<input type="text" class="form-control" name="cedula" placeholder="Ingrese número de cédula" value="<?= htmlspecialchars($cedula_busqueda) ?>">
</div>
<div class="col-md-4">
<button type="submit" class="btn w-100" style="background-color: #FF8A37; color: white;">
<i class="fas fa-search"></i> Buscar
</button>
</div>
</form>
</div>
</div>
<!-- Resultados de búsqueda -->
<?php if (!empty($cedula_busqueda)): ?>
<div class="card">
<div class="card-header bg-info text-white">
<h5>Resultados para: <?= htmlspecialchars($cedula_busqueda) ?></h5>
</div>
<div class="card-body">
<?php if (empty($resultados)): ?>
<div class="alert alert-warning">
No se encontraron entregas para este operario.
</div>
<?php else: ?>
<div class="table-responsive">
<table class="table table-striped">
<thead>
<tr>
<th>Cédula</th>
<th>Nombre</th>
<th>Fecha Entrega</th>
<th>Tipo Entrega</th>
<th>Estado</th>
<th>Devolutivo</th>
<th>Entrega EPP</th>
<th>Quien Entrego EPP</th>
<th>Firma</th>
<th>Acción</th>
<th>Formato</th>
</tr>
</thead>
<tbody>
<?php foreach ($resultados as $entrega):
$tieneFirma = !empty($entrega['FIRMA']);
$rowClass = $tieneFirma ? 'status-signed' : 'status-pending';
?>
<tr class="<?= $rowClass ?>">
<td><?= htmlspecialchars($entrega['cedula']) ?></td>
<td><?= htmlspecialchars($entrega['nombre'] ?? '') ?></td>
<td><?= htmlspecialchars($entrega['fEntrega']) ?></td>
<td><?= htmlspecialchars($entrega['tpEntrega']) ?></td>
<td><?= htmlspecialchars($entrega['tpEstado']) ?></td>
<td><?= htmlspecialchars($entrega['tpDevolutivo']) ?></td>
<td><?= htmlspecialchars($entrega['epp']) ?></td>
<td><?= htmlspecialchars($entrega['userEntrega']) ?></td>
<td>
<?php if ($tieneFirma): ?>
<img src="<?= htmlspecialchars($entrega['FIRMA']) ?>" class="signature-display">
<?php else: ?>
<span class="text-muted">Pendiente</span>
<?php endif; ?>
</td>
<td>
<?php if (!$tieneFirma): ?>
<button class="btn btn-sm btn-success btn-firmar"
data-id="<?= $entrega['ID'] ?>"
data-cedula="<?= htmlspecialchars($entrega['cedula']) ?>">
<i class="fas fa-signature"></i> Firmar
</button>
<?php else: ?>
<span class="text-success">Firmado</span>
<?php endif; ?>
</td>
<td>
<?php if ($tieneFirma): ?>
<a href="FORMFIRM.PHP?id=<?= $entrega['ID'] ?>" class="btn btn-sm btn-primary" target="_blank">
<i class="fas fa-file-alt"></i> Ver Formato
</a>
<?php else: ?>
<button class="btn btn-sm btn-secondary" disabled>
<i class="fas fa-file-alt"></i> Pendiente
</button>
<?php endif; ?>
</td>
</tr>
<?php endforeach; ?>
</tbody>
</table>
</div>
<?php endif; ?>
</div>
</div>
<?php endif; ?>
</div>
<!-- Modal para firma -->
<div class="modal fade" id="firmaModal" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header bg-primary text-white">
<h5 class="modal-title">Firma Digital</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="signature-container">
<canvas id="signature-pad" class="signature-pad"></canvas>
</div>
<div class="text-center mt-2">
<button id="clear-signature" class="btn btn-warning btn-sm">
<i class="fas fa-eraser"></i> Limpiar
</button>
</div>
</div>
<div class="modal-footer">
<input type="hidden" id="id-firma">
<input type="hidden" id="cedula-firma">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancelar</button>
<button type="button" id="guardar-firma" class="btn btn-primary">
<i class="fas fa-save"></i> Guardar Firma
</button>
</div>
</div>
</div>
</div>
<!-- Scripts -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/signature_pad@4.1.5/dist/signature_pad.umd.min.js"></script>
<script>
$(document).ready(function() {
let signaturePad;
// Inicializar el pad de firma cuando se muestra el modal
$('#firmaModal').on('shown.bs.modal', function() {
const canvas = document.getElementById('signature-pad');
// Ajustar el tamaño del canvas al contenedor
canvas.width = canvas.offsetWidth;
canvas.height = canvas.offsetHeight;
// Inicializar SignaturePad
signaturePad = new SignaturePad(canvas, {
backgroundColor: 'rgb(255, 255, 255)',
penColor: 'rgb(0, 0, 0)'
});
});
// Limpiar la firma
$('#clear-signature').click(function() {
if (signaturePad) {
signaturePad.clear();
}
});
// Manejar botón de firmar
$('.btn-firmar').click(function() {
const id = $(this).data('id');
const cedula = $(this).data('cedula');
$('#id-firma').val(id);
$('#cedula-firma').val(cedula);
$('#firmaModal').modal('show');
});
// Guardar firma
$('#guardar-firma').click(function() {
if (!signaturePad || signaturePad.isEmpty()) {
alert('Por favor realice su firma antes de guardar');
return;
}
const id = $('#id-firma').val();
const cedula = $('#cedula-firma').val();
const firmaData = signaturePad.toDataURL('image/png');
$(this).prop('disabled', true).html('<i class="fas fa-spinner fa-spin"></i> Guardando...');
$.ajax({
url: 'guardar_firma.php',
method: 'POST',
data: {
id: id,
cedula: cedula,
firma: firmaData
},
dataType: 'json',
success: function(response) {
$('#guardar-firma').prop('disabled', false).html('<i class="fas fa-save"></i> Guardar Firma');
if (response.success) {
alert(response.message);
$('#firmaModal').modal('hide');
// Redireccionar a FORMFIRM.PHP con el ID de la entrega
if (response.redirect) {
window.location.href = response.redirect;
} else {
location.reload();
}
} else {
alert('Error: ' + response.message);
}
},
error: function(xhr, status, error) {
$('#guardar-firma').prop('disabled', false).html('<i class="fas fa-save"></i> Guardar Firma');
alert('Error al comunicarse con el servidor: ' + error);
console.error(xhr.responseText);
}
});
});
// Ajustar el tamaño del canvas cuando cambia el tamaño de la ventana
$(window).resize(function() {
if (signaturePad) {
const canvas = document.getElementById('signature-pad');
const ratio = Math.max(window.devicePixelRatio || 1, 1);
// Guardar la firma actual
const data = signaturePad.toDataURL();
// Redimensionar el canvas
canvas.width = canvas.offsetWidth * ratio;
canvas.height = canvas.offsetHeight * ratio;
canvas.getContext('2d').scale(ratio, ratio);
// Limpiar y restaurar la firma
signaturePad.clear();
if (data) {
signaturePad.fromDataURL(data);
}
}
});
});
</script>
</body>
</html>