<?php 
$this->load->view('layouts/header');
$this->load->helper('layout');
?>

    <!-- App Header -->
    <div class="appHeader">
        <div class="left">
            <a href="<?php echo base_url('accounts/view/' . $account->id); ?>" class="headerButton">
                <ion-icon name="chevron-back-outline"></ion-icon>
            </a>
        </div>
        <div class="pageTitle">Account Statement</div>
        <div class="right">
            <a href="#" class="headerButton" onclick="downloadStatement()">
                <ion-icon name="download-outline"></ion-icon>
            </a>
        </div>
    </div>

    <!-- App Capsule -->
    <div id="appCapsule">
        
        <!-- Account Info -->
        <div class="section mt-2">
            <div class="card">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center">
                        <div>
                            <h4 class="mb-0"><?php echo $account->account_number; ?></h4>
                            <p class="text-muted mb-0"><?php echo htmlspecialchars($account->account_name); ?></p>
                        </div>
                        <span class="badge badge-primary"><?php echo ucfirst($account->account_type); ?></span>
                    </div>
                </div>
            </div>
        </div>

        <!-- Date Filter -->
        <div class="section mt-2">
            <div class="card">
                <div class="card-body">
                    <form action="" method="GET" class="row">
                        <div class="col-5">
                            <div class="form-group basic">
                                <label class="label">From</label>
                                <input type="date" class="form-control" name="from" value="<?php echo $date_from; ?>">
                            </div>
                        </div>
                        <div class="col-5">
                            <div class="form-group basic">
                                <label class="label">To</label>
                                <input type="date" class="form-control" name="to" value="<?php echo $date_to; ?>">
                            </div>
                        </div>
                        <div class="col-2 d-flex align-items-end pb-1">
                            <button type="submit" class="btn btn-primary btn-sm">
                                <ion-icon name="search-outline"></ion-icon>
                            </button>
                        </div>
                    </form>
                </div>
            </div>
        </div>

        <!-- Summary -->
        <div class="section mt-2">
            <?php
            // Calculate totals based on whether account is source or destination
            $total_credits = 0;
            $total_debits = 0;
            foreach ($transactions as $t) {
                if ($t->destination_account_id == $account->id) {
                    $total_credits += $t->amount;
                } else {
                    $total_debits += $t->amount;
                }
            }
            ?>
            <div class="row">
                <div class="col-6">
                    <div class="card bg-success text-white">
                        <div class="card-body py-2">
                            <p class="mb-0 small">Total Credits</p>
                            <h4 class="mb-0"><?php echo format_money($total_credits, $account->currency); ?></h4>
                        </div>
                    </div>
                </div>
                <div class="col-6">
                    <div class="card bg-danger text-white">
                        <div class="card-body py-2">
                            <p class="mb-0 small">Total Debits</p>
                            <h4 class="mb-0"><?php echo format_money($total_debits, $account->currency); ?></h4>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- Transactions -->
        <div class="section mt-3 mb-3">
            <div class="section-title">
                Transactions (<?php echo count($transactions); ?>)
            </div>
            
            <?php if (empty($transactions)): ?>
            <div class="card">
                <div class="card-body text-center py-4">
                    <ion-icon name="receipt-outline" style="font-size: 48px; color: #ccc;"></ion-icon>
                    <p class="text-muted mt-2 mb-0">No transactions found for this period</p>
                </div>
            </div>
            <?php else: ?>
            
            <?php 
            $grouped = [];
            foreach ($transactions as $txn) {
                $date = date('Y-m-d', strtotime($txn->created_at));
                if (!isset($grouped[$date])) {
                    $grouped[$date] = [];
                }
                $grouped[$date][] = $txn;
            }
            ?>
            
            <?php foreach ($grouped as $date => $txns): ?>
            <div class="listview-title mt-2"><?php echo date('F d, Y', strtotime($date)); ?></div>
            <div class="transactions">
                <?php foreach ($txns as $txn): ?>
                <?php 
                // Determine if transaction is credit (incoming) or debit (outgoing) for this account
                $is_credit = ($txn->destination_account_id == $account->id);
                ?>
                <a href="<?php echo base_url('transactions/view/' . $txn->id); ?>" class="item p-2">
                    <div class="detail">
                        <div class="rounded-circle bg-<?php echo $is_credit ? 'success' : 'danger'; ?> d-flex align-items-center justify-content-center" style="width: 42px; height: 42px; min-width: 42px;">
                            <ion-icon name="<?php echo $is_credit ? 'arrow-down' : 'arrow-up'; ?>-outline" class="text-white" style="font-size: 20px;"></ion-icon>
                        </div>
                        <div class="ms-2">
                            <strong><?php echo ucfirst($txn->type); ?></strong>
                            <p class="text-muted mb-0" style="font-size: 12px;"><?php echo $txn->reference; ?></p>
                        </div>
                    </div>
                    <div class="right text-end">
                        <div class="price text-<?php echo $is_credit ? 'success' : 'danger'; ?>" style="font-weight: 600;">
                            <?php echo $is_credit ? '+ ' : '- '; ?>
                            <?php echo format_money($txn->amount, $txn->currency); ?>
                        </div>
                        <p class="small text-muted mb-0"><?php echo date('H:i', strtotime($txn->created_at)); ?></p>
                    </div>
                </a>
                <?php endforeach; ?>
            </div>
            <?php endforeach; ?>
            
            <?php endif; ?>
        </div>
    </div>

    <!-- App Bottom Menu -->
    <?php echo get_bottom_menu('accounts'); ?>

    <script>
    function downloadStatement() {
        var from = document.querySelector('input[name="from"]').value;
        var to = document.querySelector('input[name="to"]').value;
        var url = '<?php echo base_url('accounts/download_statement/' . $account->id); ?>?from=' + from + '&to=' + to;
        window.open(url, '_blank');
    }
    </script>

<?php $this->load->view('layouts/footer'); ?>
