From 37e793f34022c80b1981a39e84b465f3a044f169 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BE=9D=E7=91=AA=E8=B2=93?= <imacat@mail.imacat.idv.tw>
Date: Mon, 6 Jul 2020 23:58:47 +0800
Subject: [PATCH] Revised the cash report template.

---
 accounting/models.py                      |  7 ++
 accounting/templates/accounting/cash.html | 94 +++++++++++++++++------
 2 files changed, 77 insertions(+), 24 deletions(-)

diff --git a/accounting/models.py b/accounting/models.py
index daf340d..6ff2d4e 100644
--- a/accounting/models.py
+++ b/accounting/models.py
@@ -94,6 +94,13 @@ class Transaction(models.Model):
         credit_sum = sum([x.amount for x in self.credit_records])
         return debit_sum == credit_sum
 
+    @property
+    def has_order_hole(self):
+        """Whether the order of the transactions on this day is not
+        1, 2, 3, 4, 5..., and should be reordered. """
+        # TODO: To be done
+        return False
+
     @property
     def is_cash_income(self):
         """Whether this transaction is a cash income transaction."""
diff --git a/accounting/templates/accounting/cash.html b/accounting/templates/accounting/cash.html
index 92725f2..9139867 100644
--- a/accounting/templates/accounting/cash.html
+++ b/accounting/templates/accounting/cash.html
@@ -34,34 +34,80 @@ First written: 2020/7/1
   <p>{{ request.resolver_match.app_name }}</p>
 
 {% if records %}
-  <table class="table table-striped">
-  <thead>
-  <tr>
-    <th scope="col">{% trans "Date" context "Accounting|" %}</th>
-    <th scope="col">{% trans "Subject" context "Accounting|" %}</th>
-    <th scope="col">{% trans "Summary" context "Accounting|" %}</th>
-    <th scope="col">{% trans "Income" context "Accounting|" %}</th>
-    <th scope="col">{% trans "Expense" context "Accounting|" %}</th>
-    <th scope="col">{% trans "Balance" context "Accounting|" %}</th>
-    <th scope="col">{% trans "View" context "Accounting|" %}</th>
-  </tr>
-  </thead>
-  <tbody>
-    {% for record in records %}
+  {# The table for large screens #}
+  <table class="table table-striped table-hover d-none d-md-table general-journal-table">
+    <thead>
       <tr>
-      <td>{{ record.transaction.date|smart_date }}</td>
-      <td>{{ record.subject.title_zhtw }}</td>
-      <td>{{ record.summary }}</td>
-      <td>{{ record.credit_amount|default:""|intcomma:False }}</td>
-      <td>{{ record.debit_amount|default:""|intcomma:False }}</td>
-      <td>{{ record.amount|intcomma:False }}</td>
-      <td><a href="{{ record.transaction.get_absolute_url }}">{% trans "View" context "Accounting|" %}</a></td>
+        <th scope="col">{% trans "Date" context "Accounting|" %}</th>
+        <th scope="col">{% trans "Subject" context "Accounting|" %}</th>
+        <th scope="col">{% trans "Summary" context "Accounting|" %}</th>
+        <th class="amount" scope="col">{% trans "Income" context "Accounting|" %}</th>
+        <th class="amount" scope="col">{% trans "Expense" context "Accounting|" %}</th>
+        <th class="amount" scope="col">{% trans "Balance" context "Accounting|" %}</th>
+        <th class="actions" scope="col">{% trans "View" context "Accounting|" %}</th>
       </tr>
-    {% endfor %}
-  </tbody>
+    </thead>
+    <tbody>
+      {% for record in records %}
+        <tr class="{% if not record.transaction.is_balanced or record.transaction.has_order_hole %} table-danger {% endif %}">
+          <td>{{ record.transaction.date|smart_date }}</td>
+          <td>{{ record.subject.title_zhtw }}</td>
+          <td>{{ record.summary }}{% if not record.transaction.is_balanced %}
+            <span class="badge badge-danger badge-pill">
+              {% trans "Unbalanced" context "Accounting|" %}
+            </span>
+          {% endif %}{% if record.transaction.has_order_hole %}
+            <span class="badge badge-danger badge-pill">
+              {% trans "Need Reorder" context "Accounting|" %}
+            </span>
+          {% endif %}</td>
+          <td class="amount">{{ record.credit_amount|default:""|intcomma:False }}</td>
+          <td class="amount">{{ record.debit_amount|default:""|intcomma:False }}</td>
+          <td class="amount">{{ record.amount|intcomma:False }}</td>
+          <td class="actions">
+            <a href="{{ record.transaction.get_absolute_url }}" class="btn btn-info" role="button">
+              <i class="fas fa-eye"></i>
+              <span class="d-none d-lg-inline">{% trans "View" context "Accounting|" %}</span>
+            </a>
+          </td>
+        </tr>
+      {% endfor %}
+    </tbody>
   </table>
+
+  {# The list for small screens #}
+  <ul class="list-group d-md-none">
+    {% for record in records %}
+      <li class="list-group-item {% if not record.transaction.is_balanced or record.transaction.has_order_hole %} list-group-item-danger {% endif %}">
+        <a class="list-group-item-action" href="{{ record.transaction.get_absolute_url }}">
+          <div class="date-subject-line d-flex justify-content-between align-items-center">
+            {{ record.transaction.date|smart_date }} {{ record.subject.title_zhtw }}
+          </div>
+          <div class="d-flex justify-content-between align-items-center">
+            <div>
+              {{ record.summary }}
+              {% if not record.transaction.is_balanced %}
+                <span class="badge badge-danger badge-pill">
+                  {% trans "Unbalanced" context "Accounting|" %}
+                </span>
+              {% endif %}
+              {% if record.transaction.has_order_hole %}
+                <span class="badge badge-danger badge-pill">
+                  {% trans "Need Reorder" context "Accounting|" %}
+                </span>
+              {% endif %}
+            </div>
+          </div>
+          <div>
+            <span class="badge {% if not record.is_credit %} badge-warning {% else %} badge-success {% endif %} badge-pill">{{ record.amount|intcomma:False }}</span>
+            <span class="badge {% if record.balance < 0 %} badge-danger {% else %} badge-primary {% endif %} badge-pill">{{ record.balance|intcomma:False }}</span>
+          </div>
+        </a>
+      </li>
+    {% endfor %}
+  </ul>
 {% else %}
-  <p>No data.</p>
+  <p>{% trans "There is currently no data." %}</p>
 {% endif %}
 
 {% endblock %}