Create account list view

nummi/account/templates/account/account_list.html

@@ -0,0 +1,17 @@
+{% extends "main/list.html" %}
+{% load i18n main_extras account_extras %}
+{% block link %}
+  {{ block.super }}
+  {% css "main/css/table.css" %}
+  {% css "main/css/plot.css" %}
+  {% js "main/js/index.js" %}
+{% endblock link %}
+{% block name %}
+  {% translate "Account" %}
+{% endblock name %}
+{% block h2 %}
+  {% translate "Accounts" %}
+{% endblock h2 %}
+{% block table %}
+  <div class="split">{% account_table accounts %}</div>
+{% endblock table %}

nummi/account/templates/account/account_table.html

@@ -0,0 +1,41 @@
+{% load i18n main_extras %}
+<dl class="accounts">
+  {% for acc in accounts %}
+    <div class="account {% if acc.archived %}archived{% endif %}">
+      <dt>
+        <a href="{{ acc.get_absolute_url }}">{{ acc.icon|remix }}{{ acc }}</a>
+      </dt>
+      <dd class="value">
+        {% if acc.statement_set.first %}{{ acc.statement_set.first.value|value }}{% endif %}
+      </dd>
+    </div>
+  {% endfor %}
+  {% if index %}
+    <div class="more account">
+      <dt>
+        <a href="{% url "accounts" %}">{{ "gallery-view"|remixnl }}{% translate "All accounts" %}</a>
+      </dt>
+      {% if total %}
+        <dd class="value">
+          {{ total|value }}
+        </dd>
+      {% endif %}
+    </div>
+  {% else %}
+    <div class="more account">
+      <dt>
+        <label class="wi" for="show-archived-accounts">
+          {{ "archive"|remix }}{% translate "Show archived" %}
+        </label>
+      </dt>
+      <dd>
+        <input type="checkbox" class="show-archived" id="show-archived-accounts" />
+      </dd>
+    </div>
+    <div class="new account">
+      <dt>
+        <a href="{% url "new_account" %}">{{ "add-box"|remix }}{% translate "Create account" %}</a>
+      </dt>
+    </div>
+  {% endif %}
+</dl>

nummi/account/templatetags/account_extras.py

@@ -0,0 +1,10 @@
+from django import template
+
+register = template.Library()
+
+
+@register.inclusion_tag("account/account_table.html")
+def account_table(accounts, **kwargs):
+    return kwargs | {
+        "accounts": accounts,
+    }

nummi/account/urls.py

@@ -5,6 +5,7 @@ from transaction.views import TransactionMonthView, TransactionYearView
 from . import views
 
 urlpatterns = [
+    path("list", views.AccountListView.as_view(), name="accounts"),
     path("new", views.AccountCreateView.as_view(), name="new_account"),
     path("<account>", views.AccountDetailView.as_view(), name="account"),
     path("<account>/edit", views.AccountUpdateView.as_view(), name="edit_account"),

nummi/account/views.py

@@ -5,6 +5,7 @@ from main.views import (
     NummiCreateView,
     NummiDeleteView,
     NummiDetailView,
+    NummiListView,
     NummiUpdateView,
 )
 from statement.views import StatementListView
@@ -66,6 +67,11 @@ class AccountMixin:
         return super().get_context_data(**kwargs) | {"account": self.account}
 
 
+class AccountListView(NummiListView):
+    model = Account
+    context_object_name = "accounts"
+
+
 class AccountTListView(AccountMixin, TransactionListView):
     pass
 

nummi/main/static/main/css/main.css

@@ -336,35 +336,31 @@ ul.messages {
   }
 }
 
-.accounts {
-  display: grid;
-  grid-auto-rows: min-content;
+dl.accounts {
+  margin: 0;
 
-  dl {
+  dt,
+  dd {
     margin: 0;
-    dt,
-    dd {
-      margin: 0;
-    }
-    .account {
-      padding: 0.5rem;
-      margin-bottom: 0.5rem;
-      border: 1px solid var(--gray);
+  }
+  .account {
+    padding: 0.5rem;
+    margin-bottom: 0.5rem;
+    border: 1px solid var(--gray);
 
-      display: grid;
-      grid-template-columns: 1fr min-content;
-      &.new,
-      &.more {
-        border-style: dashed;
-      }
-      &.more label {
-        display: block;
-      }
+    display: grid;
+    grid-template-columns: 1fr min-content;
+    &.new,
+    &.more {
+      border-style: dashed;
     }
-    &:not(.show-archive) .account.archived {
-      display: none;
+    &.more label {
+      display: block;
     }
   }
+  &:not(.show-archive) .account.archived {
+    display: none;
+  }
 }
 
 ul.statements,

nummi/main/static/main/js/index.js

@@ -1,10 +1,9 @@
-let accounts = document.querySelector(".accounts");
+let accounts = document.querySelector("dl.accounts");
 let toggle = accounts.querySelector("input#show-archived-accounts");
-let dl = accounts.querySelector("dl");
 
-dl.classList.toggle("show-archive", toggle.checked);
+accounts.classList.toggle("show-archive", toggle.checked);
 if (toggle) {
   toggle.addEventListener("change", (event) => {
-    dl.classList.toggle("show-archive", toggle.checked);
+    accounts.classList.toggle("show-archive", toggle.checked);
   });
 }

nummi/main/templates/main/index.html

@@ -1,6 +1,6 @@
 {% extends "main/base.html" %}
 {% load static %}
-{% load main_extras %}
+{% load main_extras account_extras %}
 {% load i18n %}
 {% block link %}
   {{ block.super }}
@@ -10,42 +10,16 @@
 {% endblock link %}
 {% block body %}
   <div class="split">
-    <section class="accounts">
+    <section>
       <h2>{% translate "Accounts" %}</h2>
-      <dl>
-        {% for acc in accounts %}
-          <div class="account {% if acc.archived %}archived{% endif %}">
-            <dt>
-              <a href="{{ acc.get_absolute_url }}">{{ acc.icon|remix }}{{ acc }}</a>
-            </dt>
-            <dd>
-              {% if acc.statement_set.first %}{{ acc.statement_set.first.value|value }}{% endif %}
-            </dd>
-          </div>
-        {% endfor %}
-        <div class="more account">
-          <dt>
-            <label class="wi" for="show-archived-accounts">
-              {{ "archive"|remix }}{% translate "Show archived" %}
-            </label>
-          </dt>
-          <dd>
-            <input type="checkbox" class="show-archived" id="show-archived-accounts" />
-          </dd>
-        </div>
-        <div class="new account">
-          <dt>
-            <a href="{% url "new_account" %}">{{ "add-box"|remix }}{% translate "Create account" %}</a>
-          </dt>
-        </div>
-      </dl>
+      {% account_table accounts index=True total=accounts|balance %}
     </section>
-    <section class="statements">
+    <section>
       <h2>{% translate "Statements" %}</h2>
       {% include "statement/statement_table.html" %}
     </section>
   </div>
-  <section class="categories">
+  <section>
     <h2>{% translate "Categories" %}</h2>
     {% spaceless %}
       <p>

nummi/main/views.py

@@ -105,4 +105,4 @@ class LogoutView(auth_views.LogoutView):
 
 
 class NummiListView(UserMixin, ListView):
-    paginate_by = 96
+    pass

nummi/statement/views.py

@@ -84,6 +84,7 @@ class StatementDetailView(NummiDetailView):
 class StatementListView(NummiListView):
     model = Statement
     context_object_name = "statements"
+    paginate_by = 32
 
 
 class StatementMixin:

nummi/transaction/views.py

@@ -124,6 +124,7 @@ class InvoiceDeleteView(NummiDeleteView):
 class TransactionListView(NummiListView):
     model = Transaction
     context_object_name = "transactions"
+    paginate_by = 50
 
 
 class TransactionACMixin: