<?php $__env->startSection('title', 'Uploaded Transactions Report'); ?>
<?php $__env->startSection('page-title', 'Uploaded Transactions Log'); ?>
<?php $__env->startSection('breadcrumb', 'Main / Reports / Transactions'); ?>

<?php $__env->startSection('styles'); ?>
<style>
    :root {
        --teal:#00b09b; --teal-dk:#008f7a; --teal-lt:rgba(0,176,155,.10);
        --blue:#1a8fff; --blue-lt:rgba(26,143,255,.10);
        --red:#e74c3c; --red-lt:rgba(231,76,60,.10);
        --gold:#f5a623; --gold-lt:rgba(245,166,35,.10);
        --text:#2c3e50; --text-mid:#546e7a; --muted:#90a4ae;
        --border:#e0e7ef; --white:#fff; --bg:#f0f3f8;
        --sh:0 2px 10px rgba(0,0,0,.07);
    }

    /* Direction adjusted for English */
    .breadcrumb-bar { display:flex; align-items:center; gap:6px; font-size:12px; color:var(--muted); margin-bottom:18px; direction: ltr; }
    .breadcrumb-bar a { color:var(--teal); text-decoration:none; font-weight:600; }

    .pg-hdr { display:flex; align-items:center; justify-content:space-between; margin-bottom:20px; direction: ltr; }
    .pg-hdr-l h1 { font-size:20px; font-weight:900; color:var(--text); margin:0; }

    .stats-row { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:20px; direction: ltr; }
    .mini-stat { background:var(--white); border:1px solid var(--border); border-radius:12px; padding:14px 16px; display:flex; align-items:center; gap:12px; box-shadow:var(--sh); }
    .ms-icon { width:42px; height:42px; border-radius:10px; display:flex; align-items:center; justify-content:center; font-size:20px; }
    .ms-val { font-size:20px; font-weight:900; color:var(--text); }
    .ms-lbl { font-size:11px; color:var(--muted); }

    .tbl-card { background:var(--white); border:1px solid var(--border); border-radius:14px; overflow:hidden; box-shadow:var(--sh); direction: ltr; }
    .tbl-toolbar { display:flex; align-items:center; justify-content:space-between; padding:16px 20px; border-bottom:1px solid var(--border); }
    
    .data-table { width:100%; border-collapse:collapse; font-size:13px; text-align: left; }
    .data-table thead tr { background:var(--bg); }
    .data-table th { padding:12px 16px; color:var(--muted); font-size:11px; font-weight:700; border-bottom:1px solid var(--border); text-transform: uppercase; }
    .data-table td { padding:13px 16px; border-bottom:1px solid #f3f6fa; vertical-align:middle; }
    
    .amount-cell { font-weight:800; color:var(--text); font-family: 'Consolas', monospace; }
    .ref-text { font-size:11px; color:var(--teal); background:var(--teal-lt); padding:2px 6px; border-radius:5px; font-weight:700; }
    
    .pagination-wrap { padding:14px 20px; border-top:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; direction: ltr; }

    /* Search Button Styles */
    .btn-search-trigger {
        background: var(--white);
        border: 1px solid var(--teal);
        color: var(--teal);
        padding: 8px 16px;
        border-radius: 10px;
        cursor: pointer;
        font-weight: 700;
        transition: all 0.3s;
        display: flex;
        align-items: center;
        gap: 8px;
    }
    .btn-search-trigger:hover {
        background: var(--teal);
        color: #fff;
        box-shadow: 0 4px 12px rgba(0, 176, 155, 0.2);
    }
    /* Pagination Container */
    .pagination-wrap {
        padding: 20px;
        border-top: 1px solid var(--border);
        display: flex;
        align-items: center;
        justify-content: space-between;
        background: #fff;
    }

    /* Custom Pagination Styling */
    .custom-pagination .pagination {
        display: flex;
        gap: 6px;
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .custom-pagination .page-item .page-link {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 38px;
        height: 38px;
        border-radius: 8px !important; /* Square with slight roundness */
        border: 1px solid var(--border);
        background: var(--white);
        color: var(--text-mid);
        font-size: 14px;
        font-weight: 600;
        text-decoration: none;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    }

    /* Active State */
    .custom-pagination .page-item.active .page-link {
        background: var(--teal) !important;
        border-color: var(--teal) !important;
        color: #fff !important;
        box-shadow: 0 4px 10px rgba(0, 176, 155, 0.25);
        transform: translateY(-2px);
    }

    /* Hover State */
    .custom-pagination .page-item:hover:not(.active):not(.disabled) .page-link {
        background: var(--teal-lt);
        border-color: var(--teal);
        color: var(--teal);
    }

    /* Disabled State */
    .custom-pagination .page-item.disabled .page-link {
        opacity: 0.5;
        cursor: not-allowed;
        background: #f8f9fa;
    }

    /* Info Text */
    .pagination-info {
        font-size: 13px;
        color: var(--muted);
        font-weight: 500;
    }
    /* حاوية الأزرار تدفع نفسها لليمين */
.header-actions {
    margin-left: auto;
    display: flex;
    gap: 10px; /* المسافة بين الزرين */
}

/* تعديل عام للأزرار لضمان ثبات الحجم */
.btn-search-trigger {
    margin-left: 0 !important; /* إلغاء المارجن القديم */
    white-space: nowrap;
    height: 38px;
    display: inline-flex;
    align-items: center;
}

/* تنسيق خاص لزر التصدير لتمييزه باللون الأخضر */
.btn-export {
    border-color: #28a745 !important;
    color: #28a745 !important;
}

.btn-export:hover {
    background: #28a745 !important;
    color: #fff !important;
    box-shadow: 0 4px 12px rgba(40, 167, 69, 0.2) !important;
}
</style>

<?php $__env->stopSection(); ?>

<?php $__env->startSection('content'); ?>

<div class="breadcrumb-bar">
    <div style="display: flex; align-items: center; gap: 6px;">
        <a href="<?php echo e(route('admin.dashboard')); ?>"><i class="las la-home"></i> Dashboard</a>
        <i class="las la-angle-right" style="font-size:10px"></i>
        <span>Transaction Log</span>
    </div>

    <div class="header-actions">
        <button type="button" onclick="exportData()" class="btn-search-trigger btn-export">
            <i class="las la-file-excel"></i> Export Excel
        </button>
        <button type="button" onclick="showSearchPopup()" class="btn-search-trigger">
            <i class="las la-search"></i> Search
        </button>
    </div>
</div>
<div class="pg-hdr">
    <div class="pg-hdr-l">
        <h1>Uploaded Transactions Log</h1>
        <div style="font-size:12px;color:var(--muted)">Total records available: <?php echo e($transactions->total()); ?></div>
    </div>
</div>

<div class="stats-row">
    <div class="mini-stat">
        <div class="ms-icon" style="background:var(--teal-lt);color:var(--teal)"><i class="las la-database"></i></div>
        <div>
            <div class="ms-val"><?php echo e(number_format($totalCount)); ?></div>
            <div class="ms-lbl">Total Transactions</div>
        </div>
    </div>
    <div class="mini-stat">
        <div class="ms-icon" style="background:var(--blue-lt);color:var(--blue)"><i class="las la-clock"></i></div>
        <div>
            <div class="ms-val"><?php echo e(number_format($todayCount)); ?></div>
            <div class="ms-lbl">Today's Txns</div>
        </div>
    </div>
    <div class="mini-stat">
        <div class="ms-icon" style="background:var(--gold-lt);color:var(--gold)"><i class="las la-server"></i></div>
        <div>
            <div class="ms-val"><?php echo e($uniqueTerminals); ?></div>
            <div class="ms-lbl">Active Terminals</div>
        </div>
    </div>
    <div class="mini-stat">
        <div class="ms-icon" style="background:var(--red-lt);color:var(--red)"><i class="las la-wallet"></i></div>
        <div>
            <div class="ms-val" style="font-size:16px"><?php echo e(number_format($todayAmount, 0)); ?></div>
            <div class="ms-lbl">Today's Volume (IQD)</div>
        </div>
    </div>
</div>

<div class="tbl-card">
    <div class="tbl-toolbar">
        <div style="font-weight:800;font-size:14px"><i class="las la-list" style="color:var(--teal)"></i> Transaction Details</div>
    </div>
    
    <div style="overflow-x:auto">
        <table class="data-table" id="transTable">
            <thead>
                <tr>
                    <th>#</th>
                    <th> Date</th>
                    <th>Terminal ID</th>
                    <th>Terminal Name</th>
                    <th>Amount</th>
                    <th>Mobile No.</th>
                    <th>System Reference</th>
                    <th>Upload Date</th>
                </tr>
            </thead>
            <tbody>
                <?php $__empty_1 = true; $__currentLoopData = $transactions; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $transaction): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); $__empty_1 = false; ?>
                <tr>
                    <td><span style="color:var(--muted)"><?php echo e($transaction->id); ?></span></td>
                    <td style="font-weight:600"><?php echo e($transaction->transaction_date); ?></td>
                    <td><code><?php echo e($transaction->terminal_id); ?></code></td>
                    <td><?php echo e($transaction->terminal_name); ?></td>
                    <td class="amount-cell"><?php echo e(number_format($transaction->amount, 2)); ?></td>
                    <td><?php echo e($transaction->mobile); ?></td>
                    <td><span class="ref-text"><?php echo e($transaction->system_reference); ?></span></td>
                    <td style="font-size:11px;color:var(--muted)"><?php echo e($transaction->created_at->format('Y-m-d H:i')); ?></td>
                </tr>
                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); if ($__empty_1): ?>
                <tr>
                    <td colspan="8" style="text-align:center;padding:40px;color:var(--muted)">No transactions uploaded yet.</td>
                </tr>
                <?php endif; ?>
            </tbody>
        </table>
    </div>

    <?php if($transactions->hasPages()): ?>
    <div class="pagination-wrap">
        <div style="font-size:12px;color:var(--muted)">
            Showing <?php echo e($transactions->firstItem()); ?> to <?php echo e($transactions->lastItem()); ?> of <?php echo e($transactions->total()); ?> entries
        </div>
        <div class="custom-pagination">
           <?php echo e($transactions->appends(request()->query())->links('pagination::bootstrap-4')); ?>

        </div>
    </div>
    <?php endif; ?>
</div>

<?php $__env->stopSection(); ?>

<?php $__env->startSection('scripts'); ?>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<script>
function showSearchPopup() {
    Swal.fire({
        title: 'Filter Search Results',
        html: `
            <form id="searchForm" class="swal-form" style="text-align: left; direction: ltr;">
                <div style="display: grid; grid-template-columns: 1fr 1fr; gap: 15px;">
                    <div>
                        <label style="display:block; font-size:12px; margin-bottom:5px; font-weight:600;">Date From</label>
                        <input type="date" id="swal_date_from" class="swal2-input" style="margin:0; width:100%" value="<?php echo e(request('date_from')); ?>">
                    </div>
                    <div>
                        <label style="display:block; font-size:12px; margin-bottom:5px; font-weight:600;">Date To</label>
                        <input type="date" id="swal_date_to" class="swal2-input" style="margin:0; width:100%" value="<?php echo e(request('date_to')); ?>">
                    </div>
                    <div>
                        <label style="display:block; font-size:12px; margin-bottom:5px; font-weight:600;">Terminal ID</label>
                        <input type="text" id="swal_terminal_id" class="swal2-input" style="margin:0; width:100%" placeholder="100xxx" value="<?php echo e(request('terminal_id')); ?>">
                    </div>
                    <div>
                        <label style="display:block; font-size:12px; margin-bottom:5px; font-weight:600;">Terminal Name</label>
                        <input type="text" id="swal_terminal_name" class="swal2-input" style="margin:0; width:100%" placeholder="Search name..." value="<?php echo e(request('terminal_name')); ?>">
                    </div>
                    <div style="grid-column: span 2;">
                        <label style="display:block; font-size:12px; margin-bottom:5px; font-weight:600;">Mobile Number</label>
                        <input type="text" id="swal_mobile" class="swal2-input" style="margin:0; width:100%" placeholder="07xxxxxxxx" value="<?php echo e(request('mobile')); ?>">
                    </div>
                </div>
            </form>
        `,
        confirmButtonText: 'Search Now',
        confirmButtonColor: '#00b09b',
        showCancelButton: true,
        cancelButtonText: 'Cancel',
        focusConfirm: false,
        preConfirm: () => {
            const date_from = document.getElementById('swal_date_from').value;
            const date_to = document.getElementById('swal_date_to').value;
            const terminal_id = document.getElementById('swal_terminal_id').value;
            const terminal_name = document.getElementById('swal_terminal_name').value;
            const mobile = document.getElementById('swal_mobile').value;

            let url = new URL("<?php echo e(route('reports.index')); ?>", window.location.origin);
            if(date_from) url.searchParams.append('date_from', date_from);
            if(date_to) url.searchParams.append('date_to', date_to);
            if(terminal_id) url.searchParams.append('terminal_id', terminal_id);
            if(terminal_name) url.searchParams.append('terminal_name', terminal_name);
            if(mobile) url.searchParams.append('mobile', mobile);

            window.location.href = url.href;
        }
    });
}
function exportData() {
    // جلب الفلاتر الحالية من رابط الصفحة
    let urlParams = new URLSearchParams(window.location.search);
    let exportUrl = new URL("<?php echo e(route('reports.export')); ?>", window.location.origin);
    
    // دمج الفلاتر مع رابط التصدير
    urlParams.forEach((value, key) => {
        exportUrl.searchParams.append(key, value);
    });

    // تنفيذ التحميل
    window.location.href = exportUrl.href;
}
</script>

<?php $__env->stopSection(); ?>
<?php echo $__env->make('admin.layouts.app', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH /home/gamcoiraq/sctlold.gamcoiraq.com/resources/views/admin/transactions/index.blade.php ENDPATH**/ ?>