grales
This commit is contained in:
407
views/catalogo_pedimentos/crear.php
Normal file
407
views/catalogo_pedimentos/crear.php
Normal file
@@ -0,0 +1,407 @@
|
||||
<?php
|
||||
include __DIR__ . '/../partials/sidebar_importador.php';
|
||||
|
||||
// Verificar que el importador tenga información configurada
|
||||
if (!$importador) {
|
||||
echo '<div class="alert alert-warning">
|
||||
<i class="fas fa-exclamation-triangle"></i>
|
||||
<strong>Configuración requerida:</strong>
|
||||
Debe configurar su información general antes de crear pedimentos.
|
||||
<a href="/IMPORTADORES/configuracion" class="btn btn-sm btn-primary ms-2">Ir a Configuración</a>
|
||||
</div>';
|
||||
return;
|
||||
}
|
||||
|
||||
// Verificar que tenga claves de pedimentos configuradas
|
||||
if (empty($claves_pedimentos)) {
|
||||
echo '<div class="alert alert-info">
|
||||
<i class="fas fa-info-circle"></i>
|
||||
<strong>Claves de pedimentos:</strong>
|
||||
No tiene claves de pedimentos de importación configuradas.
|
||||
<a href="/IMPORTADORES/claves_pedimentos" class="btn btn-sm btn-success ms-2">Configurar Claves</a>
|
||||
</div>';
|
||||
}
|
||||
?>
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="es">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>📋 Nuevo Pedimento de Importación</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
||||
<!-- Font Awesome -->
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
|
||||
<!-- Animate.css -->
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css">
|
||||
<style>
|
||||
body { font-family: 'Segoe UI', sans-serif; background-color: #f4f6f9; }
|
||||
.sidebar { width: 220px; height: 100vh; background-color: #343a40; position: fixed; top: 0; left: 0; padding-top: 56px; z-index: 1040; }
|
||||
.sidebar .nav-link { font-weight: bold; color: white; transition: all 0.3s ease; }
|
||||
.sidebar .nav-link:hover,
|
||||
.sidebar .nav-link.active { background-color: #495057; color: #fff; }
|
||||
.content { margin-top: 56px; padding: 40px 20px; position: relative; z-index: 1; background-color: #f4f6f9; transition: margin-left 0.3s ease;}
|
||||
.navbar { position: fixed; top: 0; width: 100%; z-index: 1050; }
|
||||
/* A partir de dispositivos medianos (>=768px), deja espacio lateral */
|
||||
@media (min-width: 768px) { .content { margin-left: 250px; } }
|
||||
/* En móviles, sin margen lateral */
|
||||
@media (max-width: 767.98px) {
|
||||
.content { margin-left: 0; }
|
||||
.sidebar .nav-link { font-weight: normal; color: #343a40; background-color: transparent; }
|
||||
.sidebar .nav-link:hover,
|
||||
.sidebar .nav-link.active { background-color: #e9ecef; color: #212529; }
|
||||
}
|
||||
.card { border-radius: 12px; }
|
||||
.fade-in-up { animation: fadeInUp 0.8s ease-out; }
|
||||
@keyframes fadeInUp {
|
||||
from { opacity: 0; transform: translateY(30px); }
|
||||
to { opacity: 1; transform: translateY(0); }
|
||||
}
|
||||
.title-glow { text-shadow: 0 0 10px rgba(0, 123, 255, 0.3); }
|
||||
/* Efecto para botones */
|
||||
.btn-animated { transition: all 0.3s ease; position: relative; overflow: hidden; }
|
||||
.btn-animated:hover { transform: translateY(-2px); box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2); }
|
||||
.btn-animated::before { content: ''; position: absolute; top: 0; left: -100%; width: 100%; height: 100%;
|
||||
background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent); transition: left 0.5s; }
|
||||
.btn-animated:hover::before { left: 100%; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="content">
|
||||
<div class="d-flex justify-content-between align-items-center mb-4">
|
||||
<h4 class="animate__animated animate__fadeInDown title-glow">📋 Nuevo Pedimento de Importación</h4>
|
||||
<a href="/IMPORTADORES/catalogo_pedimentos/lista" class="btn btn-secondary btn-animated">
|
||||
<i class="fas fa-arrow-left"></i> Regresar a Lista
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="card fade-in-up">
|
||||
<div class="card-body">
|
||||
<form action="/IMPORTADORES/catalogo_pedimentos/guardar" method="POST" id="formPedimento">
|
||||
<div class="row">
|
||||
<!-- Información Básica -->
|
||||
<div class="col-md-6">
|
||||
<div class="card mb-3">
|
||||
<div class="card-header">
|
||||
<h5 class="mb-0"><i class="fas fa-info-circle"></i> Información del Pedimento</h5>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="mb-3">
|
||||
<label for="pedimento" class="form-label">Número de Pedimento <span class="text-danger">*</span></label>
|
||||
<input type="text" class="form-control" id="pedimento" name="pedimento" required
|
||||
placeholder="Ej: 23 47 3807 8001234"
|
||||
pattern="[0-9\s]+" title="Solo números y espacios">
|
||||
<div class="form-text">Formato estándar: AA AA AAAA AAAAAAA (año aduana sección número)</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="clave_ped" class="form-label">Clave de Pedimento <span class="text-danger">*</span></label>
|
||||
<select class="form-select" id="clave_ped" name="clave_ped" required>
|
||||
<option value="">Seleccionar clave...</option>
|
||||
<?php foreach ($claves_pedimentos as $clave): ?>
|
||||
<option value="<?= htmlspecialchars($clave['codigo']) ?>">
|
||||
<?= htmlspecialchars($clave['codigo']) ?> - <?= htmlspecialchars($clave['descripcion']) ?>
|
||||
</option>
|
||||
<?php endforeach; ?>
|
||||
</select>
|
||||
<?php if (empty($claves_pedimentos)): ?>
|
||||
<div class="form-text text-warning">
|
||||
<i class="fas fa-exclamation-triangle"></i>
|
||||
No tiene claves configuradas.
|
||||
<a href="/IMPORTADORES/claves_pedimentos/inicializar_claves_usuario">Inicializar claves por defecto</a>
|
||||
</div>
|
||||
<?php else: ?>
|
||||
<div class="form-text">
|
||||
Seleccione la clave que corresponda al tipo de importación
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="mb-3">
|
||||
<label for="tipo_operacion" class="form-label">Tipo de Operación</label>
|
||||
<select class="form-select" id="tipo_operacion" name="tipo_operacion">
|
||||
<option value="1" selected>Importación Definitiva</option>
|
||||
<option value="3">Importación Temporal</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="mb-3">
|
||||
<label for="tipo_pedimento" class="form-label">Tipo de Pedimento</label>
|
||||
<select class="form-select" id="tipo_pedimento" name="tipo_pedimento">
|
||||
<option value="1" selected>Normal</option>
|
||||
<option value="2">Consolidado</option>
|
||||
<option value="3">Rectificación</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="mb-3">
|
||||
<label for="regimen" class="form-label">Régimen</label>
|
||||
<input type="text" class="form-control" id="regimen" name="regimen"
|
||||
placeholder="Ej: IMD" maxlength="10">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="mb-3">
|
||||
<label for="destino" class="form-label">Destino</label>
|
||||
<input type="text" class="form-control" id="destino" name="destino"
|
||||
placeholder="Código de destino" maxlength="10">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Información del Importador (Automática) -->
|
||||
<div class="col-md-6">
|
||||
<div class="card mb-3 bg-light">
|
||||
<div class="card-header">
|
||||
<h5 class="mb-0"><i class="fas fa-building"></i> Información del Importador</h5>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<?php if ($importador): ?>
|
||||
<div class="mb-2">
|
||||
<strong>RFC:</strong>
|
||||
<span class="badge bg-primary"><?= htmlspecialchars($importador['rfc']) ?></span>
|
||||
</div>
|
||||
<div class="mb-2">
|
||||
<strong>Nombre/Razón Social:</strong><br>
|
||||
<span class="text-muted"><?= htmlspecialchars($importador['nombre']) ?></span>
|
||||
</div>
|
||||
<?php if (!empty($importador['correo'])): ?>
|
||||
<div class="mb-2">
|
||||
<strong>Correo:</strong><br>
|
||||
<span class="text-muted"><?= htmlspecialchars($importador['correo']) ?></span>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
<hr>
|
||||
<div class="alert alert-success alert-sm">
|
||||
<i class="fas fa-check-circle"></i>
|
||||
Esta información se incluirá automáticamente en el pedimento
|
||||
</div>
|
||||
<?php else: ?>
|
||||
<div class="alert alert-warning">
|
||||
<i class="fas fa-exclamation-triangle"></i>
|
||||
Configure su información general primero
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Fechas -->
|
||||
<div class="card mb-3">
|
||||
<div class="card-header">
|
||||
<h5 class="mb-0"><i class="fas fa-calendar"></i> Fechas</h5>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="mb-3">
|
||||
<label for="fecha_pedimento" class="form-label">Fecha del Pedimento</label>
|
||||
<input type="date" class="form-control" id="fecha_pedimento" name="fecha_pedimento"
|
||||
value="<?= date('Y-m-d') ?>">
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="mb-3">
|
||||
<label for="fecha_inicio" class="form-label">Fecha de Inicio</label>
|
||||
<input type="date" class="form-control" id="fecha_inicio" name="fecha_inicio">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="mb-3">
|
||||
<label for="fecha_final" class="form-label">Fecha Final</label>
|
||||
<input type="date" class="form-control" id="fecha_final" name="fecha_final">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Información Adicional -->
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="card mb-3">
|
||||
<div class="card-header">
|
||||
<h5 class="mb-0"><i class="fas fa-cogs"></i> Información Adicional</h5>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="mb-3">
|
||||
<label for="archivo_final_previo" class="form-label">Archivo Final Previo</label>
|
||||
<input type="text" class="form-control" id="archivo_final_previo" name="archivo_final_previo"
|
||||
placeholder="Nombre del archivo" maxlength="100">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="mb-3">
|
||||
<label for="acuse_cons" class="form-label">Acuse de Recibo</label>
|
||||
<input type="text" class="form-control" id="acuse_cons" name="acuse_cons"
|
||||
placeholder="Número de acuse" maxlength="20">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="mb-3">
|
||||
<label for="tipo" class="form-label">Tipo Adicional</label>
|
||||
<input type="text" class="form-control" id="tipo" name="tipo"
|
||||
placeholder="Información adicional" maxlength="10">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="mb-3">
|
||||
<label for="status" class="form-label">Estado</label>
|
||||
<select class="form-select" id="status" name="status">
|
||||
<option value="1" selected>Activo</option>
|
||||
<option value="0">Inactivo</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Botones -->
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="d-flex justify-content-end gap-2">
|
||||
<a href="/IMPORTADORES/catalogo_pedimentos/lista" class="btn btn-secondary btn-animated">
|
||||
<i class="fas fa-times"></i> Cancelar
|
||||
</a>
|
||||
<button type="submit" class="btn btn-success btn-animated" <?= empty($claves_pedimentos) ? 'disabled' : '' ?>>
|
||||
<i class="fas fa-save"></i> Guardar Pedimento
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- jQuery -->
|
||||
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
|
||||
<!-- SweetAlert2 -->
|
||||
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
|
||||
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
// Validación del formulario
|
||||
$('#formPedimento').on('submit', function(e) {
|
||||
var pedimento = $('#pedimento').val().trim();
|
||||
var clavePed = $('#clave_ped').val();
|
||||
|
||||
if (!pedimento) {
|
||||
e.preventDefault();
|
||||
Swal.fire({
|
||||
icon: 'warning',
|
||||
title: 'Campo obligatorio',
|
||||
text: 'El número de pedimento es obligatorio',
|
||||
confirmButtonColor: '#ffc107'
|
||||
});
|
||||
$('#pedimento').focus();
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!clavePed) {
|
||||
e.preventDefault();
|
||||
Swal.fire({
|
||||
icon: 'warning',
|
||||
title: 'Campo obligatorio',
|
||||
text: 'Debe seleccionar una clave de pedimento',
|
||||
confirmButtonColor: '#ffc107'
|
||||
});
|
||||
$('#clave_ped').focus();
|
||||
return false;
|
||||
}
|
||||
|
||||
// Validación básica del formato de pedimento
|
||||
var pedimentoLimpio = pedimento.replace(/\s+/g, '');
|
||||
if (pedimentoLimpio.length < 13) {
|
||||
e.preventDefault();
|
||||
Swal.fire({
|
||||
icon: 'error',
|
||||
title: 'Formato inválido',
|
||||
text: 'El número de pedimento debe tener al menos 13 dígitos',
|
||||
confirmButtonColor: '#dc3545'
|
||||
});
|
||||
$('#pedimento').focus();
|
||||
return false;
|
||||
}
|
||||
});
|
||||
|
||||
// Formateo automático del número de pedimento
|
||||
$('#pedimento').on('input', function() {
|
||||
var value = this.value.replace(/[^\d]/g, ''); // Solo números
|
||||
var formatted = '';
|
||||
|
||||
if (value.length >= 2) {
|
||||
formatted += value.substr(0, 2) + ' ';
|
||||
if (value.length >= 4) {
|
||||
formatted += value.substr(2, 2) + ' ';
|
||||
if (value.length >= 8) {
|
||||
formatted += value.substr(4, 4) + ' ';
|
||||
if (value.length > 8) {
|
||||
formatted += value.substr(8);
|
||||
}
|
||||
} else if (value.length > 4) {
|
||||
formatted += value.substr(4);
|
||||
}
|
||||
} else if (value.length > 2) {
|
||||
formatted += value.substr(2);
|
||||
}
|
||||
} else {
|
||||
formatted = value;
|
||||
}
|
||||
|
||||
this.value = formatted;
|
||||
});
|
||||
|
||||
// Validación de fechas
|
||||
$('#fecha_inicio, #fecha_final').on('change', function() {
|
||||
var fechaInicio = $('#fecha_inicio').val();
|
||||
var fechaFinal = $('#fecha_final').val();
|
||||
|
||||
if (fechaInicio && fechaFinal && fechaInicio > fechaFinal) {
|
||||
Swal.fire({
|
||||
icon: 'warning',
|
||||
title: 'Fechas incorrectas',
|
||||
text: 'La fecha de inicio no puede ser mayor que la fecha final',
|
||||
confirmButtonColor: '#ffc107'
|
||||
});
|
||||
$(this).val('');
|
||||
}
|
||||
});
|
||||
|
||||
// Información adicional sobre la clave seleccionada
|
||||
$('#clave_ped').on('change', function() {
|
||||
var selectedText = $(this).find('option:selected').text();
|
||||
if (selectedText && selectedText !== 'Seleccionar clave...') {
|
||||
var descripcion = selectedText.split(' - ')[1];
|
||||
if (descripcion) {
|
||||
$(this).next('.form-text').html('<i class="fas fa-info-circle text-primary"></i> ' + descripcion);
|
||||
}
|
||||
} else {
|
||||
$(this).next('.form-text').html('Seleccione la clave que corresponda al tipo de importación');
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user