<?php
declare(strict_types=1);

/* ================= AUTH ================= */
require_once __DIR__ . '/../security/auth_guard_web.php';
require_once __DIR__ . '/../partials/main.php';
?>
<!DOCTYPE html>
<html lang="en">
<head>
<?php includeFileWithVariables('../partials/title-meta.php', ['title' => 'Create Offer']); ?>
<?php include '../partials/head-css.php'; ?>
</head>

<body>
<div id="layout-wrapper">

<?php include '../partials/header.php'; ?>
<?php include '../partials/sidebar.php'; ?>
<?php include '../partials/horizontal.php'; ?>

<main class="app-wrapper">
<div class="container-fluid">

<?php includeFileWithVariables('../partials/page-title.php', [
    'title_sub' => 'CMS',
    'title'     => 'Create Offer'
]); ?>

<form id="offerForm" enctype="multipart/form-data">

<div class="card">
<div class="card-body">

<div class="row g-3">

<div class="col-md-6">
    <label class="form-label">Title *</label>
    <input type="text" name="title" class="form-control" required>
</div>

<div class="col-md-6">
    <label class="form-label">Offer Price *</label>
    <input type="number" step="0.01" name="offer_price" class="form-control" required>
</div>

<div class="col-md-12">
    <label class="form-label">Short Description *</label>
    <input type="text" name="short_description" class="form-control" required>
</div>

<div class="col-md-12">
    <label class="form-label">Description *</label>
    <textarea name="description" class="form-control" rows="4" required></textarea>
</div>

<div class="col-md-6">
    <label class="form-label">Start Date *</label>
    <input type="datetime-local" name="start_date" class="form-control" required>
</div>

<div class="col-md-6">
    <label class="form-label">End Date *</label>
    <input type="datetime-local" name="end_date" class="form-control" required>
</div>

<div class="col-md-12">
    <label class="form-label">Redirect URL *</label>
    <input type="text" name="redirect_url" class="form-control" required>
</div>

<div class="col-md-6">
    <label class="form-label">Desktop Image *</label>
    <input type="file" name="desktop_image" class="form-control" accept="image/*" required>
</div>

<div class="col-md-6">
    <label class="form-label">Mobile Image *</label>
    <input type="file" name="mobile_image" class="form-control" accept="image/*" required>
</div>

</div>

</div>

<div class="card-footer text-end">
    <a href="<?= ADMIN_BASE_URL ?>offers/index.php" class="btn btn-light me-2">
        Cancel
    </a>
    <button type="submit" class="btn btn-success">
        <i class="bi bi-check-lg me-1"></i> Create Offer
    </button>
</div>
</div>

</form>

</div>
</main>

<?php include '../partials/footer.php'; ?>
</div>

<?php include '../partials/vendor-scripts.php'; ?>

<script>
const API_CREATE = "<?= ADMIN_BASE_URL ?>api/offers/create.php";

document.getElementById('offerForm').addEventListener('submit', function (e) {
    e.preventDefault();

    const formData = new FormData(this);

    fetch(API_CREATE, {
        method: 'POST',
        credentials: 'include',
        body: formData
    })
    .then(r => r.json())
    .then(res => {
        if (res.status === 'success') {
            window.location.href = "<?= ADMIN_BASE_URL ?>offers/list.php";
        } else {
            alert(res.message || 'Failed to create offer');
        }
    })
    .catch(() => alert('Something went wrong'));
});
</script>

</body>
</html>
