Tul xxx Tul

Viewing: edit.php

<?php $error = $error ?? null; ?>

<!-- Breadcrumb -->
<nav aria-label="breadcrumb" class="mb-3">
    <ol class="breadcrumb" style="font-size: 0.85rem;">
        <li class="breadcrumb-item"><a href="<?= BASE_URL ?>/servicios" style="color: var(--primary);">Servicios</a></li>
        <li class="breadcrumb-item active">Editar Servicio</li>
    </ol>
</nav>

<?php if ($error): ?>
<div class="alert alert-danger alert-dismissible fade show d-flex align-items-center" role="alert" style="border: none; border-radius: 10px; border-left: 4px solid #ef476f;">
    <i class="bi bi-exclamation-circle-fill me-2"></i>
    <?= htmlspecialchars($error) ?>
    <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
</div>
<?php endif; ?>

<div class="card-custom">
    <div class="card-header-custom">
        <h5><i class="bi bi-pencil-square me-2"></i>Editar Servicio</h5>
    </div>
    <div class="card-body-custom">
        <form action="<?= BASE_URL ?>/servicios/update/<?= $servicio['id'] ?>" method="POST" enctype="multipart/form-data">
            <div class="row g-4">
                <!-- Nombre -->
                <div class="col-md-6">
                    <label for="nombre" class="form-label fw-semibold" style="font-size: 0.85rem;">
                        Nombre del Servicio <span class="text-danger">*</span>
                    </label>
                    <input type="text" class="form-control" id="nombre" name="nombre"
                           value="<?= htmlspecialchars($servicio['nombre']) ?>"
                           required style="border-radius: 8px; padding: 10px 14px;">
                </div>

                <!-- Precio -->
                <div class="col-md-6">
                    <label for="precio" class="form-label fw-semibold" style="font-size: 0.85rem;">
                        Precio <span class="text-danger">*</span>
                    </label>
                    <div class="input-group">
                        <span class="input-group-text" style="border-radius: 8px 0 0 8px;">$</span>
                        <input type="number" class="form-control" id="precio" name="precio"
                               value="<?= htmlspecialchars($servicio['precio']) ?>"
                               step="0.01" min="0"
                               required style="border-radius: 0 8px 8px 0; padding: 10px 14px;">
                    </div>
                </div>

                <!-- Descripción -->
                <div class="col-12">
                    <label for="descripcion" class="form-label fw-semibold" style="font-size: 0.85rem;">
                        Descripción
                    </label>
                    <textarea class="form-control" id="descripcion" name="descripcion" rows="4"
                              style="border-radius: 8px; padding: 10px 14px; resize: vertical;"><?= htmlspecialchars($servicio['descripcion'] ?? '') ?></textarea>
                </div>

                <!-- Imagen actual -->
                <div class="col-md-6">
                    <label class="form-label fw-semibold" style="font-size: 0.85rem;">Imagen Actual</label>
                    <div>
                        <?php if (!empty($servicio['imagen'])): ?>
                            <img src="<?= BASE_URL ?>/public/assets/uploads/servicios/<?= htmlspecialchars($servicio['imagen']) ?>"
                                 alt="Imagen actual"
                                 style="max-width: 200px; max-height: 150px; border-radius: 10px; border: 2px solid var(--border-color); object-fit: cover;">
                        <?php else: ?>
                            <div style="width: 200px; height: 120px; background: var(--bg-body); border-radius: 10px; display: flex; align-items: center; justify-content: center; border: 2px dashed var(--border-color);">
                                <span class="text-muted" style="font-size: 0.85rem;"><i class="bi bi-image me-1"></i>Sin imagen</span>
                            </div>
                        <?php endif; ?>
                    </div>
                </div>

                <!-- Nueva imagen -->
                <div class="col-md-6">
                    <label for="imagen" class="form-label fw-semibold" style="font-size: 0.85rem;">
                        Cambiar Imagen
                    </label>
                    <input type="file" class="form-control" id="imagen" name="imagen"
                           accept=".jpg,.jpeg,.png"
                           style="border-radius: 8px; padding: 8px 14px;">
                    <div class="form-text" style="font-size: 0.78rem;">JPG o PNG. Máximo 2MB. Dejar vacío para mantener la actual.</div>

                    <!-- Preview -->
                    <div id="imagePreview" class="mt-2" style="display: none;">
                        <img id="previewImg" src="" alt="Preview"
                             style="max-width: 200px; max-height: 150px; border-radius: 10px; border: 2px solid var(--border-color); object-fit: cover;">
                    </div>
                </div>
            </div>

            <!-- Botones -->
            <div class="d-flex gap-2 mt-4 pt-3" style="border-top: 1px solid var(--border-color);">
                <button type="submit" class="btn btn-primary-custom">
                    <i class="bi bi-check-lg me-1"></i> Actualizar Servicio
                </button>
                <a href="<?= BASE_URL ?>/servicios" class="btn btn-light" style="border-radius: 6px;">
                    <i class="bi bi-arrow-left me-1"></i> Cancelar
                </a>
            </div>
        </form>
    </div>
</div>

<script>
document.getElementById('imagen').addEventListener('change', function(e) {
    const file = e.target.files[0];
    const preview = document.getElementById('imagePreview');
    const previewImg = document.getElementById('previewImg');

    if (file) {
        const reader = new FileReader();
        reader.onload = function(e) {
            previewImg.src = e.target.result;
            preview.style.display = 'block';
        };
        reader.readAsDataURL(file);
    } else {
        preview.style.display = 'none';
    }
});
</script>
User / IP	: 216.73.216.217
Host / Server	: 45.84.207.204 / aircan.me
System	: Linux lt-bnk-web1726.main-hosting.eu 5.14.0-611.36.1.el9_7.x86_64 #1 SMP PREEMPT_DYNAMIC Tue Mar 3 11:23:52 EST 2026 x86_64