Tul xxx Tul

Viewing: panels.php

<?php
$db = getDB();
$panels = $db->query('SELECT * FROM info_panels ORDER BY sort_order ASC')->fetchAll();
?>

<div class="admin-card">
    <div class="card-header">
        <div class="card-title"><i class="ph-fill ph-cards"></i> Paneles Informativos</div>
        <button class="btn btn-primary" onclick="openPanelModal()">
            <i class="ph-bold ph-plus"></i> Nuevo Panel
        </button>
    </div>
    <table class="admin-table">
        <thead>
            <tr><th>Orden</th><th>Icono</th><th>Título</th><th>Subtítulo</th><th>Acciones</th></tr>
        </thead>
        <tbody>
            <?php foreach ($panels as $p): ?>
            <tr>
                <td><span class="badge badge-gold"><?= $p['sort_order'] ?></span></td>
                <td><i class="<?= htmlspecialchars($p['icon']) ?>" style="font-size:1.3rem;color:var(--admin-purple-light)"></i></td>
                <td style="font-weight:600;"><?= htmlspecialchars($p['title']) ?></td>
                <td style="color:var(--admin-text-muted);"><?= htmlspecialchars($p['subtitle']) ?></td>
                <td>
                    <div style="display:flex;gap:.4rem;">
                        <button class="btn-icon" onclick='editPanel(<?= json_encode($p) ?>)' title="Editar">
                            <i class="ph-bold ph-pencil-simple"></i>
                        </button>
                        <button class="btn-icon danger" onclick="confirmDelete('panel',<?= $p['id'] ?>, deletePanel)">
                            <i class="ph-bold ph-trash"></i>
                        </button>
                    </div>
                </td>
            </tr>
            <?php endforeach; ?>
        </tbody>
    </table>
</div>

<div class="admin-modal" id="panelModal">
    <div class="modal-dialog">
        <div class="modal-header">
            <div class="modal-title"><i class="ph-fill ph-card"></i> <span id="pnModalTitle">Nuevo Panel</span></div>
            <button class="modal-close" onclick="closeModal('panelModal')"><i class="ph-bold ph-x"></i></button>
        </div>
        <form id="panelForm" onsubmit="savePanel(event)">
            <div class="modal-body">
                <input type="hidden" id="pnId" value="">
                <div class="form-row">
                    <div class="form-group">
                        <label class="form-label">Icono (clase Phosphor)</label>
                        <input type="text" id="pnIcon" class="form-control" value="ph-fill ph-star">
                    </div>
                    <div class="form-group">
                        <label class="form-label">Orden</label>
                        <input type="number" id="pnOrder" class="form-control" value="1" min="1">
                    </div>
                </div>
                <div class="form-group">
                    <label class="form-label">Título</label>
                    <input type="text" id="pnTitle" class="form-control" required>
                </div>
                <div class="form-group">
                    <label class="form-label">Subtítulo</label>
                    <input type="text" id="pnSubtitle" class="form-control">
                </div>
                <div class="form-group">
                    <label class="form-label">Descripción</label>
                    <textarea id="pnDescription" class="form-control"></textarea>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-outline" onclick="closeModal('panelModal')">Cancelar</button>
                <button type="submit" class="btn btn-primary">Guardar</button>
            </div>
        </form>
    </div>
</div>

<script>
function openPanelModal() {
    document.getElementById('panelForm').reset();
    document.getElementById('pnId').value = '';
    document.getElementById('pnModalTitle').textContent = 'Nuevo Panel';
    openModal('panelModal');
}

function editPanel(p) {
    document.getElementById('pnId').value = p.id;
    document.getElementById('pnIcon').value = p.icon;
    document.getElementById('pnTitle').value = p.title;
    document.getElementById('pnSubtitle').value = p.subtitle;
    document.getElementById('pnDescription').value = p.description;
    document.getElementById('pnOrder').value = p.sort_order;
    document.getElementById('pnModalTitle').textContent = 'Editar Panel';
    openModal('panelModal');
}

async function savePanel(e) {
    e.preventDefault();
    const result = await adminFetch('save_panel', {
        id: document.getElementById('pnId').value,
        icon: document.getElementById('pnIcon').value,
        title: document.getElementById('pnTitle').value,
        subtitle: document.getElementById('pnSubtitle').value,
        description: document.getElementById('pnDescription').value,
        sort_order: document.getElementById('pnOrder').value
    });
    if (result.success) { closeModal('panelModal'); setTimeout(()=>location.reload(),500); }
}

async function deletePanel(id) {
    const result = await adminFetch('delete_panel', { id });
    if (result.success) setTimeout(()=>location.reload(),500);
}
</script>
User / IP	: 216.73.216.159
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