nngo/Personal-Finance-Management
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

06/02 Update Accounts page to separate Checking/Savings and Credit Card

Browse Source
This commit is contained in:
nngo
2026-06-02 11:30:32 -04:00
parent ae50e164cd
commit c429de7bcd
2 changed files with 76 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/templates/accounts/index.html
+56 -6
View File
@@ -7,12 +7,27 @@
{% endblock %}
{% block content %}
<!-- Tabs -->
<div class="d-flex gap-1 mb-3">
<a href="{{ url_for('accounts.index', tab='bank') }}"
class="btn btn-sm {% if tab=='bank' %}btn-primary{% else %}btn-outline-secondary{% endif %}" style="font-size:13px;">
<i class="bi bi-bank me-1"></i>Bank Accounts
<span class="badge ms-1" style="font-size:10px;background:{% if tab=='bank' %}rgba(255,255,255,.25){% else %}#e2e8f0;color:#475569{% endif %};">{{ bank_count }}</span>
</a>
<a href="{{ url_for('accounts.index', tab='credit') }}"
class="btn btn-sm {% if tab=='credit' %}btn-danger{% else %}btn-outline-secondary{% endif %}" style="font-size:13px;">
<i class="bi bi-credit-card me-1"></i>Credit Cards
<span class="badge ms-1" style="font-size:10px;background:{% if tab=='credit' %}rgba(255,255,255,.25){% else %}#fee2e2;color:#991b1b{% endif %};">{{ credit_count }}</span>
</a>
</div>
{% if accounts %}
<div class="row g-3">
{% for acct in accounts %}
<div class="col-12 col-md-6 col-xl-4">
<div class="pcard" style="border-left: 4px solid {{ acct.color }};">
<div class="d-flex justify-content-between align-items-start mb-3">
<div class="d-flex justify-content-between align-items-start">
<div class="d-flex align-items-center gap-2">
<div style="width:36px;height:36px;border-radius:9px;background:{{ acct.color }}22;color:{{ acct.color }};display:flex;align-items:center;justify-content:center;font-size:18px;">
<i class="bi {{ acct.icon }}"></i>
@@ -36,19 +51,54 @@
</ul>
</div>
</div>
{% if acct.notes %}
<div style="font-size:12px;color:var(--muted);margin-top:8px;">{{ acct.notes }}</div>
<div style="font-size:12px;color:var(--muted);margin-top:10px;">{{ acct.notes }}</div>
{% endif %}
{% if tab == 'credit' %}
<div class="d-flex gap-2 mt-3">
<a href="{{ url_for('transactions.index', tab='expense', account_id=acct.id) }}"
class="btn btn-sm flex-fill" style="font-size:11px;background:#fee2e2;color:#991b1b;border:none;">
<i class="bi bi-arrow-up-circle me-1"></i>Charges
</a>
<a href="{{ url_for('transactions.new', type='expense') }}"
class="btn btn-sm flex-fill" style="font-size:11px;background:#f1f5f9;color:#475569;border:none;">
<i class="bi bi-plus-lg me-1"></i>Add Charge
</a>
</div>
{% else %}
<div class="d-flex gap-2 mt-3">
<a href="{{ url_for('transactions.index', tab='expense', account_id=acct.id) }}"
class="btn btn-sm flex-fill" style="font-size:11px;background:#f1f5f9;color:#475569;border:none;">
<i class="bi bi-list-ul me-1"></i>Transactions
</a>
<a href="{{ url_for('transactions.new', type='income') }}"
class="btn btn-sm flex-fill" style="font-size:11px;background:#d1fae5;color:#065f46;border:none;">
<i class="bi bi-plus-lg me-1"></i>Add Income
</a>
</div>
{% endif %}
</div>
</div>
{% endfor %}
</div>
{% else %}
<div class="pcard text-center py-5">
<i class="bi bi-wallet2 text-muted" style="font-size:3rem;"></i>
<h5 class="mt-3 mb-1">No accounts yet</h5>
<p class="text-muted small mb-3">Add your bank accounts, cash, and credit cards.</p>
<a href="{{ url_for('accounts.new') }}" class="btn btn-primary btn-sm">Add Account</a>
{% if tab == 'credit' %}
<i class="bi bi-credit-card text-muted" style="font-size:3rem;"></i>
<h5 class="mt-3 mb-1">No credit cards yet</h5>
<p class="text-muted small mb-3">Add a credit card account to track charges and payments.</p>
{% else %}
<i class="bi bi-bank text-muted" style="font-size:3rem;"></i>
<h5 class="mt-3 mb-1">No bank accounts yet</h5>
<p class="text-muted small mb-3">Add your checking, savings, or cash accounts.</p>
{% endif %}
<a href="{{ url_for('accounts.new') }}" class="btn btn-primary btn-sm">
<i class="bi bi-plus-lg me-1"></i>New Account
</a>
</div>
{% endif %}
{% endblock %}