<?php
include_once "../global.php";

$pageTitle = "WhatsApp Send - ";
include_once '../header.php';
?>

<h6 class="mb-0 text-uppercase">WhatsApp Send (Single)</h6>
<hr>
<div class="card">
    <div class="card-body p-4">
        <form id="waSendForm" class="row g-3" method="post">
            <div class="col-md-6">
                <label for="to" class="form-label">Recipient (E.164) <span>*</span></label>
                <input type="text" id="to" name="to" class="form-control" placeholder="+923001234567" required>
            </div>
            <div class="col-md-6">
                <label for="media" class="form-label">Media URL</label>
                <input type="url" id="media" name="media" class="form-control" placeholder="https://.../image.jpg">
            </div>
            <div class="col-md-6">
                <label for="body" class="form-label">Message <span>*</span></label>
                <textarea class="form-control" id="body" name="body" rows="3" required></textarea>
            </div>
            <div class="col-md-12">
                <button type="submit" class="btn btn-grd-primary px-4">Submit</button>
            </div>
        </form>
    </div>
</div>

<script>
    $("#waSendForm").submit(function(e) {
        e.preventDefault();
        var formData = new FormData(this);

        $.ajax({
            url: '<?php echo WEB_URL; ?>/ajax_call?page=sendWhatsAppMessage',
            type: 'POST',
            data: formData,
            processData: false,
            contentType: false,
            dataType: 'json',
            beforeSend: function() {
                $("#spinner-overlay").fadeIn('slow');
            },
            success: function(response) {
                showAlert(response.message);
                if (response.status === "success") {
                    setTimeout(() => {
                        location.reload();
                    }, 2000);
                }
            },
            error: function(xhr, status, errorThrown) {
                console.log(xhr.responseText);
            },
            complete: function() {
                $("#spinner-overlay").fadeOut('slow');
            }
        });
    });
</script>

<?php
include_once '../footer.php';
?>