<?php
require './partials/head.php';
?>
<body>
    <?php require './partials/sidebar.php'; ?>

    <main class="dashboard-main">
        <?php require './partials/header.php'; ?>
        <!-- </?php require './successerror.php'; ?> -->

        <div class="dashboard-main-body">
            <div class="d-flex flex-wrap align-items-center justify-content-between gap-3 mb-24">
                <h6 class="fw-semibold mb-0">Manage Shipping Type</h6>
                <ul class="d-flex align-items-center gap-2">
                    <li class="fw-medium">
                        <a href="dashboard" class="d-flex align-items-center gap-1 hover-text-primary">
                            <iconify-icon icon="solar:home-smile-angle-outline" class="icon text-lg"></iconify-icon>
                            Dashboard
                        </a>
                    </li>
                </ul>
            </div>
            <div class="row gy-4">
                <div class="col-lg-12">
                    <div class="card">
                        <div class="card-header d-sm-flex d-block align-items-center justify-content-between">
                            <h6 class="fw-semibold mb-0"></h6>
                            <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#addCaseModal">
                            <i class="fa fa-plus"></i>  Add Shipping Type
                            </button>
                        </div>
                        <div class="card-body">
                            <div class="table-responsive">
                                <table class="table table-hover style-1 bordered-table mb-0" id="dataTable">
                                    <thead>
                                        <tr>
                                            <th>Shiping Type</th>
                                            <th>Action</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <?php
                                        $query = "SELECT * FROM shippingtype";
                                        $stmt = $conn->prepare($query);
                                        $stmt->execute();
                                        $result = $stmt->get_result();

                                        if ($result->num_rows > 0) {
                                            while ($row = $result->fetch_assoc()) {
                                        ?>
                                                <tr>
                                                    <td><?= $row['shipping_type_name'] ?></td>
                                                    <td>
                                                        <button class="btn btn-outline-primary radius-8 px-20 btn-xs light edit-btn"
                                                            onclick="showEditModal(
                                                                '<?= $row['shipping_Id']; ?>', 
                                                                '<?= $row['shipping_type_name']; ?>'
                                                            )"
                                                            data-bs-toggle="modal" data-bs-target="#manageCategoryModal">
                                                            Edit
                                                        </button>

                                                        <button class="btn btn-outline-danger radius-8 px-20 btn-xs light delete-btnn" data-id="<?= $row['shipping_Id']; ?>">Delete</button>
                                                    </td>
                                                </tr>
                                        <?php
                                            }
                                        } else {
                                            echo "<tr><td colspan='2' class='text-center'>
                                            <div class='alert alert-warning' role='alert'>
                                               Opp! No shipping type found.
                                            </div>
                                          </td></tr>";
                                        }
                                        ?>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <?php require './partials/footer.php'; ?>
    </main>
    <?php require '../config/message/error_success.php' ?>
    <!-- Add Case Modal -->
    <div class="modal fade" id="addCaseModal" tabindex="-1" aria-labelledby="addCaseModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <!-- Modal Header -->
                <div class="modal-header">
                    <h5 class="modal-title" id="addCaseModalLabel">Add Shipping type</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <!-- Form -->
                <form action="../controller/model" method="POST">
                    <div class="modal-body">
                        <!-- Account Number Input -->
                        <div class="mb-3">
                            <label for="accountNumber" class="form-label">Shipping Type</label>
                            <input
                                type="text"
                                class="form-control"
                                name="shipping_type_name"
                                placeholder="Enter shipping type"
                                required>
                        </div>
                    </div>

                    <!-- Modal Footer -->
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                        <button type="submit" name="submit_shipping_type" id="submit-btn" class="btn btn-primary"><i class="fas fa-plus"></i>Add</button>
                    </div>
                </form>
            </div>
        </div>
    </div>


    <!-- edit category section -->
    <div class="modal fade" id="manageCategoryModal" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog modal-md">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="walletModalTitle">Edit Shipping type Details</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body">
                    <form id="manageWalletForm" method="post">
                        <div class="mb-3">
                            <label for="shipping_type_name" class="form-label">Shipping Type</label>
                            <input type="text" class="form-control" id="shipping_type_name" name="shipping_type_name" placeholder="Enter Deleivery Address" required>
                        </div>
                        <input type="hidden" id="shipping_Id" name="shipping_Id">
                        <div class="modal-footer">
                            <button type="button" class="btn btn-danger light" data-bs-dismiss="modal" onclick="clearModalFields()">Close</button>
                            <button type="submit" class="btn btn-primary" id="walletModalActionButton">Save changes</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

    <script>
        function showEditModal(shipping_Id, shipping_type_name) {
            document.getElementById('walletModalTitle').innerText = 'Edit shipping Details';
            document.getElementById('walletModalActionButton').innerText = 'Save Changes';
            document.getElementById('manageWalletForm').action = 'updateprocess/overdue-feedit';
            document.getElementById('shipping_Id').value = shipping_Id;
            document.getElementById('shipping_type_name').value = shipping_type_name;
            const modal = new bootstrap.Modal(document.getElementById('manageCategoryModal'));
            modal.show();
        }

        function clearModalFields() {
            document.getElementById('shipping_Id').value = '';
            document.getElementById('shipping_type_name').value = '';
        }


        document.querySelectorAll('.delete-btnn').forEach(button => {
            button.addEventListener('click', function() {
                const shipping_Id = this.getAttribute('data-id');
                Swal.fire({
                    title: 'Are you sure?',
                    text: "You won't be able to revert this!",
                    icon: 'warning',
                    showCancelButton: true,
                    confirmButtonColor: '#d33',
                    cancelButtonColor: '#3085d6',
                    confirmButtonText: 'Yes, delete it!',
                    cancelButtonText: 'No, cancel!'
                }).then((result) => {
                    if (result.isConfirmed) {
                        window.location.href = `./deleteprocess/overdue-feedel?shipping_Id=${shipping_Id }`;
                    }
                });
            });
        });
    </script>
    <?php require './partials/scripts.php'; ?>
</body>

</html>