<?php
session_start();
ini_set('display_errors', 1);
ini_set('display_startup_errors', 1);
error_reporting(E_ALL);

include("check_installation.php");
include("fetch_settings.php");

if (!isset($_SESSION["adminid"])) {
    header("Location: login.php");
    exit;
}

// Pagination setup
$records_per_page = 10;
$current_page = isset($_GET['page']) && is_numeric($_GET['page']) ? (int)$_GET['page'] : 1;
$offset = ($current_page - 1) * $records_per_page;

// Fetch total number of transfers
$total_result = $con->query("SELECT COUNT(*) FROM transfers");
$total_rows = $total_result->fetch_row()[0];
$total_pages = ceil($total_rows / $records_per_page);

// Fetch transfers for the current page
$stmt = $con->prepare("SELECT * FROM transfers LIMIT ? OFFSET ?");
$stmt->bind_param('ii', $records_per_page, $offset);
$stmt->execute();
$result = $stmt->get_result();
$transfers = $result->fetch_all(MYSQLI_ASSOC);
$result->free();

?>

<!DOCTYPE html>
<html lang="en">
<head>
    <title>View Fund Transfers</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="author" content="">
    <meta name="description" content="">

    <link rel="icon" href="../<?= htmlspecialchars($system_favicon); ?>" type="image/<?= pathinfo($system_favicon, PATHINFO_EXTENSION); ?>">

    <link rel="preconnect" href="https://fonts.googleapis.com/">
    <link rel="preconnect" href="https://fonts.gstatic.com/" crossorigin>
    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;700&amp;family=Poppins:wght@400;500;700&amp;display=swap">

    <link rel="stylesheet" type="text/css" href="assets/vendor/font-awesome/css/all.min.css">
    <link rel="stylesheet" type="text/css" href="assets/vendor/bootstrap-icons/bootstrap-icons.css">
    <link rel="stylesheet" type="text/css" href="assets/vendor/overlay-scrollbar/css/overlayscrollbars.min.css">
    <link rel="stylesheet" type="text/css" href="assets/vendor/apexcharts/css/apexcharts.css">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/sweetalert2@11/dist/sweetalert2.min.css">
    <link rel="stylesheet" type="text/css" href="assets/css/style.css">
	<style>
.aa{
	color: #0b0a12;
	font-size:14px;
}
.modal-dialog {
    max-width: 480px;
}

.badge.rounded-pill {
    font-size: 0.75rem;
    padding: 0.5rem 1rem;
}

@media (max-width: 576px) {
   
    
    .h2 {
        font-size: 1.75rem;
    }
}

.fw-500 {
    font-weight: 500;
}
</style>
</head>
<body>

<main>
    <?php include "include/sidebar.php" ?>
    <div class="page-content">
        <?php include "include/topbar.php" ?>
        <div class="page-content-wrapper p-xxl-4">

            <div class="row">
                <div class="col-12 mb-4 mb-sm-5">
                    <div class="d-sm-flex justify-content-between align-items-center">
                        <h1 class="h3 mb-2 mb-sm-0">View Fund Transfers</h1>
                    </div>
                </div>
            </div>

            <div class="card shadow">
                <div class="card-header border-bottom">
                    <h5 class="card-title mb-0">All Fund Transfers</h5>
                </div>
                <div class="card-body">
                    <div class="bg-light rounded p-3 d-none d-lg-block">
                        <div class="row g-4">
                            <div class="col-lg-3"><h6 class="mb-0">Receiver's Name</h6></div>
                            <div class="col-lg-3"><h6 class="mb-0">Bank</h6></div>
                            <div class="col-lg-2"><h6 class="mb-0">Amount</h6></div>
                            <div class="col-lg-2"><h6 class="mb-0">Status</h6></div>
                            <div class="col-lg-2"><h6 class="mb-0">Action</h6></div>
                        </div>
                    </div>

                    <?php if (!empty($transfers)): ?>
                        <?php foreach ($transfers as $transfer): ?>
                            <div class="row g-4 align-items-center border-bottom px-2 py-4">
                                <div class="col-6 col-lg-3">
                                    <h6 class="mb-0 fw-normal">
                                        <span class="d-lg-none">Receiver's Name: </span><?= htmlspecialchars($transfer['name']); ?>
                                    </h6>
                                </div>
                                <div class="col-6 col-lg-3">
                                    <h6 class="mb-0 fw-normal">
                                        <span class="d-lg-none">Bank: </span><?= htmlspecialchars($transfer['bank']); ?>
                                    </h6>
                                </div>
                                <div class="col-6 col-lg-2">
                                    <h6 class="mb-0 fw-normal">
                                        <span class="d-lg-none">Amount: </span><?= $cur . number_format($transfer['amount'], 2); ?>
                                    </h6>
                                </div>
                                <div class="col-6 col-lg-2">
                                    <?php
                                    $status_class = '';
                                    $status_text = '';
                                    switch ($transfer['status']) {
                                        case '0':
                                            $status_class = 'badge bg-danger bg-opacity-10 text-danger ';
                                            $status_text = 'Pending';
                                            break;
                                        case '1':
                                            $status_class = 'badge bg-success bg-opacity-10 text-success';
                                            $status_text = 'Successful';
                                            break;
                                        default:
                                            $status_class = 'badge bg-info bg-opacity-10 text-info';
                                            $status_text = 'Unknown';
                                            break;
                                    }
                                    ?>
                                    <span class="<?= $status_class; ?>"><?= $status_text; ?></span>
                                </div>
                                <div class="col-6 col-lg-2">
                                    <button class="btn btn-primary-soft btn-sm" data-bs-toggle="modal" data-bs-target="#transferModal" data-transfer='<?= json_encode($transfer); ?>'>
                                        More Info
                                    </button>
                                </div>
                            </div>
                        <?php endforeach; ?>
                    <?php else: ?>
                        <div class="row px-2 py-4 text-center">
                            <div class="col">
                                <p class="mb-0">No fund transfers found.</p>
                            </div>
                        </div>
                    <?php endif; ?>
                </div>
                
                <div class="card-footer pt-0">
                    <div class="d-sm-flex justify-content-sm-between align-items-sm-center">
                        <p class="mb-sm-0 text-center text-sm-start">
                            Showing <?= min($offset + 1, $total_rows); ?> to <?= min($offset + $records_per_page, $total_rows); ?> of <?= $total_rows; ?> entries
                        </p>
                        <nav class="mb-sm-0 d-flex justify-content-center" aria-label="navigation">
                            <ul class="pagination pagination-sm pagination-primary-soft mb-0">
                                <li class="page-item <?= ($current_page <= 1) ? 'disabled' : ''; ?>">
                                    <a class="page-link" href="?page=<?= max(1, $current_page - 1); ?>">Prev</a>
                                </li>
                                <?php
                                $start_page = max(1, $current_page - 2);
                                $end_page = min($total_pages, $current_page + 2);

                                if ($start_page > 1) {
                                    echo '<li class="page-item"><a class="page-link" href="?page=1">1</a></li>';
                                    if ($start_page > 2) {
                                        echo '<li class="page-item disabled"><span class="page-link">...</span></li>';
                                    }
                                }
                                for ($p = $start_page; $p <= $end_page; $p++): ?>
                                    <li class="page-item <?= ($p == $current_page) ? 'active' : ''; ?>">
                                        <a class="page-link" href="?page=<?= $p; ?>"><?= $p; ?></a>
                                    </li>
                                <?php endfor;
                                if ($end_page < $total_pages) {
                                    if ($end_page < $total_pages - 1) {
                                        echo '<li class="page-item disabled"><span class="page-link">...</span></li>';
                                    }
                                    echo '<li class="page-item"><a class="page-link" href="?page=' . $total_pages . '">' . $total_pages . '</a></li>';
                                }
                                ?>
                                <li class="page-item <?= ($current_page >= $total_pages) ? 'disabled' : ''; ?>">
                                    <a class="page-link" href="?page=<?= min($total_pages, $current_page + 1); ?>">Next</a>
                                </li>
                            </ul>
                        </nav>
                    </div>
                </div>
            </div>
            
            <div class="modal fade" id="transferModal" tabindex="-1" aria-labelledby="transferModalLabel" aria-hidden="true">
                <div class="modal-dialog modal-dialog-centered">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title" id="transferModalLabel">Transfer Details</h5>
                            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                        </div>
                       
					   <div class="modal-body">
    <!-- Amount Section -->
    <div class="text-center mb-4 pb-4 border-bottom">
        <div class="small mb-1">Transfer Amount</div>
        <div class="h5 fw-bold text-dark mb-1" id="modal-amount"></div>
        <div class="small" id="modal-date"></div>
        <div class="mt-2">
            <span id="modal-status" class="badge rounded-pill"></span>
        </div>
    </div>

    <!-- Details Section -->
    <div class="row g-4">
        <div class="col-6">
            <div class="d-flex align-items-center small text-primary mb-1">
                <svg class="me-2" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                    <path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"></path>
                    <circle cx="12" cy="7" r="4"></circle>
                </svg>
                Recipient
            </div>
            <div class="fw-500 aa" id="modal-name"></div>
        </div>
        <div class="col-6">
            <div class="d-flex align-items-center small text-primary mb-1">
                <svg class="me-2" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                    <rect x="1" y="4" width="22" height="16" rx="2" ry="2"></rect>
                    <line x1="1" y1="10" x2="23" y2="10"></line>
                </svg>
                Account Number
            </div>
            <div class="fw-500 aa" id="modal-receiver"></div>
        </div>
        <div class="col-6">
            <div class="d-flex align-items-center text-primary small mb-1">
                <svg class="me-2" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                    <path d="M3 21h18"></path>
                    <path d="M5 21V7l8-4v18"></path>
                    <path d="M19 21V11l-6-4"></path>
                </svg>
                Bank
            </div>
            <div class="fw-500 aa" id="modal-bank"></div>
        </div>
        <div class="col-6">
            <div class="d-flex align-items-center text-primary small mb-1">
                <svg class="me-2" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                    <path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"></path>
                    <circle cx="12" cy="10" r="3"></circle>
                </svg>
                Location
            </div>
            <div class="fw-500 aa" id="modal-address"></div>
        </div>
    </div>
</div>


					   
					   
					   
                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </div>
</main>

<script src="assets/vendor/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<script src="assets/vendor/overlay-scrollbar/js/overlayscrollbars.min.js"></script>
<script src="assets/vendor/apexcharts/js/apexcharts.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11/dist/sweetalert2.all.min.js"></script>
<script src="assets/js/functions.js"></script>
<script>
document.addEventListener('DOMContentLoaded', function() {
    const transferModal = document.getElementById('transferModal');
    transferModal.addEventListener('show.bs.modal', function(event) {
        const button = event.relatedTarget;
        const transferData = JSON.parse(button.getAttribute('data-transfer'));
        
        document.getElementById('modal-name').textContent = transferData.name;
        document.getElementById('modal-bank').textContent = transferData.bank;
        document.getElementById('modal-address').textContent = transferData.address;
        document.getElementById('modal-receiver').textContent = transferData.receiver;
        
        // Format the amount with commas
        const formattedAmount = Number(transferData.amount).toLocaleString('en-US', { minimumFractionDigits: 2, maximumFractionDigits: 2 });
        document.getElementById('modal-amount').textContent = '<?= $cur; ?>' + formattedAmount;

        document.getElementById('modal-date').textContent = transferData.date;
        
        const statusSpan = document.getElementById('modal-status');
        let statusText = '';
        let statusClass = 'badge ';

        switch (transferData.status) {
    case 0:
        statusClass += 'bg-danger-soft text-danger';
        statusText = 'Pending';
        break;
    case 1:
        statusClass += 'bg-success-soft text-success';
        statusText = 'Successful';
        break;
    default:
        statusClass += 'bg-info text-white';
        statusText = 'Unknown';
        break;
}

        statusSpan.textContent = statusText;
        statusSpan.className = statusClass;
    });
});
</script>
</body>
</html>