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

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

    <main class="dashboard-main">
        <?php require './partials/header.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 Bank Details</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">
                                Add Account
                            </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>Account Name</th>
                                            <th>Bank Account</th>
                                            <th>Account Number</th>
                                            <th>Action</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <?php
                                        $query = "SELECT * FROM bankacctount ORDER BY dname ASC";
                                        $stmt = $conn->prepare($query);
                                        $stmt->execute();
                                        $result = $stmt->get_result();

                                        if ($result->num_rows > 0) {
                                            while ($row = $result->fetch_assoc()) {
                                        ?>
                                                <tr>
                                                    <td><?= $row['dname'] ?></td>
                                                    <td><?= $row['dbank'] ?></td>
                                                    <td><?= $row['dnumber'] ?></td>
                                                    <td>
                                                        <button class="btn btn-outline-primary radius-8 px-20 btn-xs light edit-btn"
                                                            onclick="showEditModal(
                                                                '<?= $row['bank_Id']; ?>', 
                                                                '<?= $row['dname']; ?>', 
                                                                '<?= $row['dbank']; ?>', 
                                                                '<?= $row['dnumber']; ?>'
                                                            )"
                                                            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['bank_Id']; ?>">Delete</button>
                                                    </td>
                                                </tr>
                                        <?php
                                            }
                                        } else {
                                            echo "<tr><td colspan='2' class='text-center'>
                                            <div class='alert alert-warning' role='alert'>
                                                No account found.
                                            </div>
                                          </td></tr>";
                                        }
                                        ?>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <?php require './partials/footer.php'; ?>
    </main>
    <!-- </?php require './successerror.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 Account</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>

                <!-- Form -->
                <form action="banklogic" method="POST">
                    <div class="modal-body">
                        <!-- Account Name Input -->
                        <div class="mb-3">
                            <label for="accountName" class="form-label">Account Name</label>
                            <input
                                type="text"
                                class="form-control"
                                id="accountName"
                                name="dname"
                                placeholder="Enter Account Name"
                                required>
                        </div>

                        <!-- Bank Name Input -->
                        <div class="mb-3">
                            <label for="bankName" class="form-label">Bank Name</label>
                            <input
                                type="text"
                                class="form-control"
                                id="bankName"
                                name="dbank"
                                placeholder="Enter Bank Name"
                                required>
                        </div>

                        <!-- Account Number Input -->
                        <div class="mb-3">
                            <label for="accountNumber" class="form-label">Account Number</label>
                            <input
                                type="text"
                                class="form-control"
                                id="accountNumber"
                                name="dnumber"
                                placeholder="Enter Account Number"
                                pattern="\d{10}"
                                title="Please enter a valid 10-digit account number"
                                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" id="submit-btn" class="btn btn-primary">Add Account</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 Account 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="dname" class="form-label">Account Name</label>
                            <input type="text" class="form-control" id="dname" name="dname" placeholder="Enter Account Name" required>
                        </div>
                        <div class="mb-3">
                            <label for="dbank" class="form-label">Bank Name</label>
                            <input type="text" class="form-control" id="dbank" name="dbank" placeholder="Enter Bank Name" required>
                        </div>
                        <div class="mb-3">
                            <label for="dnumber" class="form-label">Account Number</label>
                            <input type="number" class="form-control" id="dnumber" name="dnumber" placeholder="Enter Account Number" required>
                        </div>
                        <input type="hidden" id="bankId" name="bankId">
                        <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(bank_Id, dname, dbank, dnumber) {
            document.getElementById('walletModalTitle').innerText = 'Edit Account Details';
            document.getElementById('walletModalActionButton').innerText = 'Save Changes';

            document.getElementById('manageWalletForm').action = 'updateprocess/editbankdetails';

            document.getElementById('bankId').value = bank_Id;
            document.getElementById('dname').value = dname;
            document.getElementById('dbank').value = dbank;
            document.getElementById('dnumber').value = dnumber;

            const modal = new bootstrap.Modal(document.getElementById('manageCategoryModal'));
            modal.show();
        }

        function clearModalFields() {
            document.getElementById('bankId').value = '';
            document.getElementById('dname').value = '';
            document.getElementById('dbank').value = '';
            document.getElementById('dnumber').value = '';
        }


        document.querySelectorAll('.delete-btnn').forEach(button => {
            button.addEventListener('click', function() {
                const bank_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 = `./bankdelete?bank_Id=${bank_Id }`;
                    }
                });
            });
        });
    </script>
    <?php require './partials/scripts.php'; ?>
</body>

</html>