Éditer sms/index.php

<?= $this->extend('dashboard/layout') ?>

<?= $this->section('content') ?>
<div class="container-fluid">
    
    <div class="row">
        <div class="col-xxl-3 col-xl-3 col-lg-6 col-md-6">
            <div class="card custom-card">
                <div class="card-body">
                    <div class="text-center">
                        <span class="avatar avatar-lg bg-primary">
                            <i class="fas fa-paper-plane fs-5"></i>
                        </span>
                        <h6 class="fw-semibold mt-3">Messages Envoyés</h6>
                        <h2 class="fw-semibold mb-0"><?= count(array_filter($logs, fn($log) => $log['status'] === 'success')) ?></h2>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xxl-3 col-xl-3 col-lg-6 col-md-6">
            <div class="card custom-card">
                <div class="card-body">
                    <div class="text-center">
                        <span class="avatar avatar-lg bg-danger">
                            <i class="fas fa-times fs-5"></i>
                        </span>
                        <h6 class="fw-semibold mt-3">Messages Échoués</h6>
                        <h2 class="fw-semibold mb-0"><?= count(array_filter($logs, fn($log) => $log['status'] === 'failed')) ?></h2>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xxl-3 col-xl-3 col-lg-6 col-md-6">
            <div class="card custom-card">
                <div class="card-body">
                    <div class="text-center">
                        <span class="avatar avatar-lg bg-warning">
                            <i class="fas fa-clock fs-5"></i>
                        </span>
                        <h6 class="fw-semibold mt-3">En Attente</h6>
                        <h2 class="fw-semibold mb-0">0</h2>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xxl-3 col-xl-3 col-lg-6 col-md-6">
            <div class="card custom-card">
                <div class="card-body">
                    <div class="text-center">
                        <span class="avatar avatar-lg bg-success">
                            <i class="fas fa-envelope fs-5"></i>
                        </span>
                        <h6 class="fw-semibold mt-3">Crédit SMS</h6>
                        <h2 class="fw-semibold mb-0">100</h2>
                    </div>
                </div>
            </div>
        </div>
    </div>
    
    <div class="row">
        <div class="col-xxl-3 col-xl-3 col-lg-6 col-md-6">
            <div class="card custom-card">
                <div class="card-body">
                    <div class="d-flex align-items-top">
                        <div class="me-3">
                            <span class="avatar avatar-sm shadow-sm avatar-rounded">
                                <svg xmlns="http://www.w3.org/2000/svg" class="svg-info" viewBox="0 0 128 128"><path d="M64 128C28.7 128 0 99.3 0 64S28.7 0 64 0s64 28.7 64 64-28.7 64-64 64z"></path><path fill="#fff" d="M94.3 71.4c-.5-3.6-2.3-6.4-5.4-8.2-1.4-.8-3.1-1.4-4.7-2.1.2-.1.3-.3.4-.3 7.9-4.1 7.2-16.3 1.5-20.5-2.3-1.7-4.9-2.8-7.7-3.4-2-.4-3.9-.7-6-1.1 0-3.5.1-8.5.1-12.4H65c0 3.8-.1 8.7-.1 12.1H59c0-3.5 0-8.3.1-12.1h-7.4c0 4-.1 8.8-.1 12.3-5.1 0-10-.1-15-.1 0 2.7 0 5.3-.1 7.9h3c.9 0 1.9 0 2.8.1 2.6.2 3.9 1.6 3.9 4.2l-.3 31.9c0 2.3-1 3.3-3.3 3.3h-5c-.5 3-1 5.9-1.6 8.9 5 .1 10 .1 15 .2 0 3.8 0 8.7-.1 12.7h7.4c0-4 .1-8.7.1-12.5 2.1.1 4 .1 5.9.2 0 3.8-.1 8.4-.1 12.3h7.4c0-4 .1-8.7.1-12.4.3 0 .5-.1.6-.1 3.5-.6 7.2-.9 10.6-1.7 4.5-1.1 8.1-3.7 9.9-8.2 1.7-3.6 2-7.2 1.5-11zM59 44.3c4.6 0 9.1-.4 13.4 1.5 2.8 1.2 4.2 3.5 4 6.3-.2 2.9-1.9 5-4.8 6-4.1 1.3-8.3 1.3-12.7 1.1 0-5 .1-9.8.1-14.9zm16.2 37.1c-4.1 1.8-8.5 1.8-12.8 1.9-1.2 0-2.4-.1-3.8-.1.1-5.5.1-10.9.2-16.4 5.6 0 11.2-.4 16.5 1.9 2.7 1.2 4.3 3.3 4.3 6.4 0 3.1-1.6 5.1-4.4 6.3z"></path></svg>
                            </span>
                        </div>
                        <div class="flex-fill">
                            <div class="d-flex flex-wrap align-items-center justify-content-between fs-14 mb-2">
                                <span class="flex-fill">Bitcoin</span>
                                <span class="ms-1 text-muted">BTC</span>
                            </div>
                            <div class="d-flex flex-wrap align-items-center justify-content-between">
                                <h5 class="fw-semibold mb-0">$12,800</h5>
                                <div class="flex-fill">
                                    <span class="ms-2 badge bg-success-transparent rounded-pill">+25.8%</span>
                                </div>
                                <div id="btcCoin"></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xxl-3 col-xl-3 col-lg-6 col-md-6">
            <div class="card custom-card">
                <div class="card-body">
                    <div class="d-flex align-items-top">
                        <div class="me-3">
                            <span class="avatar avatar-sm shadow-sm avatar-rounded">
                                <svg xmlns="http://www.w3.org/2000/svg" class="svg-success" viewBox="0 0 128 128"><path d="M64 128C28.7 128 0 99.3 0 64S28.7 0 64 0s64 28.7 64 64-28.7 64-64 64z"></path><path fill="#fff" d="M65.2 87.2v22.7l28.1-39.5zM92.3 63.1l-27.1-45v32.7zM65.2 53.3v28l26.9-15.7zM35.8 63.1l27-45v32.7zM62.8 53.3v28L35.9 65.6zM62.8 87.2v22.7L34.7 70.4z"></path></svg>
                            </span>
                        </div>
                        <div class="flex-fill">
                            <div class="d-flex flex-wrap align-items-center justify-content-between fs-14 mb-2">
                                <span class="flex-fill">Ethereum</span>
                                <span class="ms-1 text-muted">ETH</span>
                            </div>
                            <div class="d-flex flex-wrap align-items-center justify-content-between">
                                <h5 class="fw-semibold mb-0">$18,600</h5>
                                <div class="flex-fill">
                                    <span class="ms-2 badge bg-success-transparent rounded-pill">+12.9%</span>
                                </div>
                                <div id="ethCoin"></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    
    <div class="row">
        <div class="col-xl-12">
            <div class="card custom-card">
                <div class="card-header">
                    <div class="card-title">
                        Envoi de SMS
                    </div>
                </div>
                <div class="card-body">
                    <div id="alertContainer"></div>
                    <form id="smsForm" method="POST">
                        <div class="row gy-3">
                            <div class="col-xl-12">
                                <label class="form-label">Expéditeur (Sender ID)</label>
                                <input type="text" class="form-control" name="sender" required maxlength="11" placeholder="Ex: BCS">
                            </div>
                            <div class="col-xl-12">
                                <label class="form-label">Numéros de téléphone (séparés par des virgules)</label>
                                <textarea class="form-control" name="phones" rows="3" required placeholder="Ex: 243823783066, 243903729606"></textarea>
                            </div>
                            <div class="col-xl-12">
                                <label class="form-label">Message</label>
                                <textarea class="form-control" name="message" rows="5" required></textarea>
                            </div>
                            <div class="col-xl-12">
                                <button type="submit" class="btn btn-primary" id="sendButton">
                                    <span class="spinner-border spinner-border-sm d-none" role="status" aria-hidden="true"></span>
                                    Envoyer le SMS
                                </button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>

<div class="card custom-card mt-3">
                <div class="card-header">
                    <div class="card-title">
                        Historique des SMS
                    </div>
                </div>
                <div class="card-body">
                    <div class="table-responsive">
                        <table class="table text-nowrap">
                            <thead>
                                <tr>
                                    <th>Date</th>
                                    <th>Numéros</th>
                                    <th>Message</th>
                                    <th>Statut</th>
                                    <th>Réponse</th>
                                </tr>
                            </thead>
                            <tbody>
                                <?php foreach ($logs as $log): ?>
                                <tr>
                                    <td><?= date('d/m/Y H:i', strtotime($log['created_at'] ?? '')) ?></td>
                                    <td><?= $log['phones'] ?? '-' ?></td>
                                    <td><?= $log['message'] ?? '' ?></td>
                                    <td>
                                        <span class="badge bg-<?= $log['status'] === 'success' ? 'success' : 'danger' ?>">
                                            <?= $log['status'] === 'success' ? 'Succès' : 'Échec' ?>
                                        </span>
                                    </td>
                                    <td><?= $log['response'] ?></td>
                                </tr>
                                <?php endforeach; ?>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

const button = document.getElementById('sendButton');
    const spinner = button.querySelector('.spinner-border');
    const alertContainer = document.getElementById('alertContainer');

spinner.classList.remove('d-none');
    button.disabled = true;

try {
        const response = await fetch('<?= base_url('dashboard/sms/send') ?>', {
            method: 'POST',
            body: new FormData(this)
        });

const result = await response.json();

alertContainer.innerHTML = `
            <div class="alert alert-${result.success ? 'success' : 'danger'}">
                ${result.message}
            </div>
        `;

if (result.success) {
            location.reload();
        }
    } catch (error) {
        alertContainer.innerHTML = `
            <div class="alert alert-danger">
                Une erreur est survenue lors de l'envoi
            </div>
        `;
    } finally {
        spinner.classList.add('d-none');
        button.disabled = false;
    }
});
</script>
<?= $this->endSection() ?>

Annuler

Dashboard

Éditer sms/index.php

Switcher