budget/views/transactions.php

<section class="summary-strip">
    <div><span>Available this month</span><strong><?= h(Support::money($summary['gross_resources'], $symbol)) ?></strong></div>
    <div><span>Total spent</span><strong class="pink"><?= h(Support::money($summary['expenses'], $symbol)) ?></strong></div>
    <div><span>Remaining</span><strong class="<?= $summary['remaining'] >= 0 ? 'green' : 'red' ?>"><?= h(Support::money($summary['remaining'], $symbol)) ?></strong></div>
    <button class="button primary" type="button" data-dialog-open="expense-dialog">+ Record expense</button>
</section>

<article class="card">
    <div class="card-heading">
        <div><p class="eyebrow">Searchable ledger</p><h2>Expense history</h2></div>
        <label class="search-box"><span>⌕</span><input type="search" placeholder="Search expenses…" data-table-search="expense-table"></label>
    </div>
    <?php if ($transactions === []): ?>
        <div class="empty-state"><strong>No expenses recorded</strong><p>Record a payment to move a bill’s progress forward.</p></div>
    <?php else: ?>
        <div class="table-wrap">
            <table id="expense-table">
                <thead><tr><th>Date</th><th>Description</th><th>Category / item</th><th>Amount</th><th>Dormant pull</th><th></th></tr></thead>
                <tbody>
                <?php foreach ($transactions as $transaction): ?>
                    <tr>
                        <td data-label="Date"><?= h(date('M j, Y', strtotime($transaction['transacted_on']))) ?></td>
                        <td data-label="Description"><strong><?= h($transaction['merchant']) ?></strong><?php if ($transaction['notes']): ?><small><?= h($transaction['notes']) ?></small><?php endif; ?></td>
                        <td data-label="Category"><span class="pill"><i style="--dot:<?= h($transaction['category_color'] ?: '#718096') ?>"></i><?= h($transaction['category_name'] ?: 'Uncategorized') ?></span><?php if ($transaction['item_name']): ?><small><?= h($transaction['item_name']) ?></small><?php endif; ?></td>
                        <td data-label="Amount"><strong><?= h(Support::money($transaction['amount'], $symbol)) ?></strong></td>
                        <td data-label="Dormant pull"><?= h(Support::money($transaction['dead_pull_amount'], $symbol)) ?></td>
                        <td>
                            <form method="post" data-confirm="Delete this expense and reverse its dormant transfer?">
                                <?= csrf_field() ?><input type="hidden" name="action" value="transaction.delete"><input type="hidden" name="month" value="<?= h($month) ?>"><input type="hidden" name="id" value="<?= (int) $transaction['id'] ?>">
                                <button class="icon-button danger" type="submit" title="Delete">×</button>
                            </form>
                        </td>
                    </tr>
                <?php endforeach; ?>
                </tbody>
            </table>
        </div>
    <?php endif; ?>
</article>

<dialog id="expense-dialog">
    <form method="post" class="dialog-card">
        <?= csrf_field() ?><input type="hidden" name="action" value="transaction.add"><input type="hidden" name="month" value="<?= h($month) ?>">
        <div class="card-heading"><div><p class="eyebrow">Progress a target</p><h2>Record expense</h2></div><button class="icon-button" type="button" data-dialog-close>×</button></div>
        <div class="form-grid">
            <label class="span-2">Description<input type="text" name="merchant" required placeholder="Payment or merchant"></label>
            <label>Amount<div class="money-input"><span><?= h($symbol) ?></span><input type="number" name="amount" min="0.01" step="0.01" required></div></label>
            <label>Date<input type="date" name="transacted_on" value="<?= h(date('Y-m-d')) ?>" required></label>
            <label>Budget item<select name="budget_item_id"><option value="">General expense</option><?php foreach ($items as $item): ?><option value="<?= (int) $item['id'] ?>"><?= h($item['name']) ?> (<?= h(Support::money($item['remaining_amount'], $symbol)) ?> owing)</option><?php endforeach; ?></select></label>
            <label>Category<select name="category_id"><option value="">Use item / uncategorized</option><?php foreach ($categories as $category): ?><option value="<?= (int) $category['id'] ?>"><?= h($category['name']) ?></option><?php endforeach; ?></select></label>
            <label class="span-2">Notes<textarea name="notes" rows="2"></textarea></label>
        </div>
        <p class="form-note">A configured per-transaction amount or percentage will also be moved to the dormant account.</p>
        <button class="button primary full" type="submit">Record expense</button>
    </form>
</dialog>