Initial working version with minor bugs

templates/trades/trade_offer_list.html

@@ -0,0 +1,62 @@
+{% extends '_base.html' %}
+{% load static %}
+{% load el_pagination_tags %}
+
+{% block title %}Trade Offer List{% endblock title %}
+
+{% block content %}
+<div class="d-flex justify-content-end mb-3">
+  <form method="get" class="d-flex align-items-center">
+    <div class="form-check me-3">
+      <input class="form-check-input" type="checkbox" name="show_completed" id="show_completed" value="true" {% if show_completed %}checked{% endif %}>
+      <label class="form-check-label" for="show_completed">
+        Only Completed
+      </label>
+    </div>
+    <button type="submit" class="btn btn-primary">Apply</button>
+  </form>
+</div>
+
+<h2>Trade Offers</h2>
+<table class="table">
+  <thead>
+    <tr>
+      <th>Offer</th>
+      <th>State</th>
+      <th>Updated At</th>
+    </tr>
+  </thead>
+  <tbody>
+    {% paginate 10 object_list as paginated_offers %}
+    {% for offer in paginated_offers %}
+    <tr>
+      <td>
+        <a href="{% url 'trade_offer_update' offer.id %}" class="d-flex align-items-center text-decoration-none">
+          <div class="flex-grow-1 text-start">
+            FT: {% for card in offer.cards_ft.all %}
+                {{ card.name }}{% if not forloop.last %}, {% endif %}
+            {% endfor %}
+          </div>
+          <div class="px-2 text-center" style="min-width: 50px;">&#x27F6;</div>
+          <div class="flex-grow-1 text-end">
+            LF: {% for card in offer.cards_lf.all %}
+                {{ card.name }}{% if not forloop.last %}, {% endif %}
+            {% endfor %}
+          </div>
+        </a>
+      </td>
+      <td>{{ offer.get_state_display }}</td>
+      <td>{{ offer.updated_at }}</td>
+    </tr>
+    {% empty %}
+    <tr>
+      <td colspan="3">No trade offers available.</td>
+    </tr>
+    {% endfor %}
+  </tbody>
+</table>
+<div class="pagination">
+    {% show_pages %}
+</div>
+<a href="{% url 'trade_offer_create' %}" class="btn btn-success">Create New Offer</a>
+{% endblock content %}