Paginate memberships and transactions

apps/member/views.py

@@ -130,10 +130,15 @@ class UserDetailView(ProtectQuerysetMixin, LoginRequiredMixin, DetailView):
         history_list = \
             Transaction.objects.all().filter(Q(source=user.note) | Q(destination=user.note)).order_by("-id")\
             .filter(PermissionBackend.filter_queryset(self.request.user, Transaction, "view"))
-        context['history_list'] = HistoryTable(history_list)
+        history_table = HistoryTable(history_list, prefix='transaction-')
+        history_table.paginate(per_page=20, page=self.request.GET.get("transaction-page", 1))
+        context['history_list'] = history_table
+
         club_list = Membership.objects.filter(user=user, date_end__gte=datetime.today())\
             .filter(PermissionBackend.filter_queryset(self.request.user, Membership, "view"))
-        context['club_list'] = MembershipTable(data=club_list)
+        membership_table = MembershipTable(data=club_list, prefix='membership-')
+        membership_table.paginate(per_page=10, page=self.request.GET.get("membership-page", 1))
+        context['club_list'] = membership_table
         return context
 
 
@@ -310,13 +315,17 @@ class ClubDetailView(ProtectQuerysetMixin, LoginRequiredMixin, DetailView):
 
         club_transactions = Transaction.objects.all().filter(Q(source=club.note) | Q(destination=club.note))\
             .filter(PermissionBackend.filter_queryset(self.request.user, Transaction, "view")).order_by('-id')
-        context['history_list'] = HistoryTable(club_transactions)
+        history_table = HistoryTable(club_transactions, prefix="history-")
+        history_table.paginate(per_page=20, page=self.request.GET.get('history-page', 1))
+        context['history_list'] = history_table
         club_member = Membership.objects.filter(
             club=club,
             date_end__gte=datetime.today(),
         ).filter(PermissionBackend.filter_queryset(self.request.user, Membership, "view"))
 
-        context['member_list'] = MembershipTable(data=club_member)
+        membership_table = MembershipTable(data=club_member, prefix="membership-")
+        membership_table.paginate(per_page=20, page=self.request.GET.get('membership-page', 1))
+        context['member_list'] = membership_table
 
         # Check if the user has the right to create a membership, to display the button.
         empty_membership = Membership(

templates/member/club_detail.html

@@ -10,9 +10,11 @@
 
 {% block extrajavascript %}
     <script>
-    function refreshHistory() {
+        function refreshHistory() {
-        $("#history_list").load("{% url 'member:club_detail' pk=object.pk %} #history_list");
+            $("#history_list").load("{% url 'member:club_detail' pk=object.pk %} #history_list");
-        $("#profile_infos").load("{% url 'member:club_detail' pk=object.pk %} #profile_infos");
+            $("#profile_infos").load("{% url 'member:club_detail' pk=object.pk %} #profile_infos");
-    }
+        }
+
+        window.history.replaceState({}, document.title, location.pathname);
     </script>
 {% endblock %}

templates/member/club_info.html

@@ -55,7 +55,7 @@
             <a class="btn btn-primary btn-sm my-1" href="{% url 'member:club_update' pk=club.pk %}"> {% trans "Edit" %}</a>
         {% endif %}
         {% url 'member:club_detail' club.pk as club_detail_url %}
-        {%if request.get_full_path != club_detail_url %}
+        {%if request.path_info != club_detail_url %}
         <a class="btn btn-primary btn-sm my-1" href="{{ club_detail_url }}">{% trans 'View Profile' %}</a>
         {% endif %}    </div>
 </div>

templates/member/club_tables.html

@@ -1,31 +1,23 @@
 {% load render_table from django_tables2 %}
 {% load i18n %}
-<div class="accordion shadow" id="accordionProfile">
+<div class="card">
-    <div class="card">
+    <div class="card-header position-relative" id="clubListHeading">
-        <div class="card-header position-relative" id="clubListHeading">
+        <a class="btn btn-link stretched-link font-weight-bold">
-            <a class="btn btn-link stretched-link font-weight-bold"
+            <i class="fa fa-users"></i> {% trans "Member of the Club" %}
-               data-toggle="collapse" data-target="#clubListCollapse"
+        </a>
-               aria-expanded="true" aria-controls="clubListCollapse">
-                <i class="fa fa-users"></i> {% trans "Member of the Club" %}
-            </a>
-        </div>
-        <div id="clubListCollapse" class="collapse show" style="overflow:auto hidden" aria-labelledby="clubListHeading" data-parent="#accordionProfile">
-            {% render_table member_list %}
-        </div>
-    </div>
-
-    <div class="card">
-        <div class="card-header position-relative" id="historyListHeading">
-            <a class="btn btn-link stretched-link collapsed font-weight-bold"
-               data-toggle="collapse" data-target="#historyListCollapse"
-               aria-expanded="false" aria-controls="historyListCollapse">
-                <i class="fa fa-euro"></i> {% trans "Transaction history" %}
-            </a>
-        </div>
-        <div id="historyListCollapse" class="collapse" style="overflow:auto hidden" aria-labelledby="historyListHeading" data-parent="#accordionProfile">
-            <div id="history_list">
-                {% render_table history_list %}
-            </div>
-        </div>
     </div>
+        {% render_table member_list %}
+</div>
+
+<hr>
+
+<div class="card">
+    <div class="card-header position-relative" id="historyListHeading">
+        <a class="btn btn-link stretched-link font-weight-bold">
+            <i class="fa fa-euro"></i> {% trans "Transaction history" %}
+        </a>
+    </div>
+        <div id="history_list">
+            {% render_table history_list %}
+        </div>
 </div>

templates/member/profile_detail.html

@@ -7,3 +7,14 @@
 {% block profile_content %}
 {% include "member/profile_tables.html" %}
 {% endblock %}
+
+{% block extrajavascript %}
+    <script>
+        function refreshHistory() {
+            $("#history_list").load("{% url 'member:user_detail' pk=object.pk %} #history_list");
+            $("#profile_infos").load("{% url 'member:user_detail' pk=object.pk %} #profile_infos");
+        }
+
+        window.history.replaceState({}, document.title, location.pathname);
+    </script>
+{% endblock %}

templates/member/profile_info.html

@@ -44,7 +44,7 @@
     <div class="card-footer text-center">
         <a class="btn btn-primary btn-sm" href="{% url 'member:user_update_profile' object.pk %}">{% trans 'Update Profile' %}</a>
         {% url 'member:user_detail' object.pk as user_profile_url %}
-        {%if request.get_full_path != user_profile_url %}
+        {%if request.path_info != user_profile_url %}
         <a class="btn btn-primary btn-sm" href="{{ user_profile_url }}">{% trans 'View Profile' %}</a>
         {% endif %}
     </div>

templates/member/profile_tables.html

@@ -9,32 +9,26 @@
     </div>
 {% endif %}
 
-<div class="accordion shadow" id="accordionProfile">
+<div class="card">
-    <div class="card">
+    <div class="card-header position-relative" id="clubListHeading">
-        <div class="card-header position-relative" id="clubListHeading">
+        <a class="btn btn-link stretched-link font-weight-bold">
-            <a class="btn btn-link stretched-link font-weight-bold"
+            <i class="fa fa-users"></i> {% trans "View my memberships" %}
-               data-toggle="collapse" data-target="#clubListCollapse"
+        </a>
-               aria-expanded="true" aria-controls="clubListCollapse">
-                <i class="fa fa-users"></i> {% trans "View my memberships" %}
-            </a>
-        </div>
-        <div id="clubListCollapse" class="collapse show" style="overflow:auto hidden" aria-labelledby="clubListHeading" data-parent="#accordionProfile">
-            {% render_table club_list %}
-        </div>
     </div>
+    {% render_table club_list %}
+</div>
 
-    <div class="card">
+<hr>
-        <div class="card-header position-relative" id="historyListHeading">
+
-            <a class="btn btn-link stretched-link collapsed font-weight-bold"
+<div class="card">
-               data-toggle="collapse" data-target="#historyListCollapse"
+    <div class="card-header position-relative" id="historyListHeading">
-               aria-expanded="false" aria-controls="historyListCollapse">
+        <a class="btn btn-link stretched-link collapsed font-weight-bold"
-                <i class="fa fa-euro"></i> {% trans "Transaction history" %}
+           data-toggle="collapse" data-target="#historyListCollapse"
-            </a>
+           aria-expanded="true" aria-controls="historyListCollapse">
-        </div>
+            <i class="fa fa-euro"></i> {% trans "Transaction history" %}
-        <div id="historyListCollapse" class="collapse" style="overflow:auto hidden" aria-labelledby="historyListHeading" data-parent="#accordionProfile">
+        </a>
-            <div id="history_list">
+    </div>
-                {% render_table history_list %}
+    <div id="history_list">
-            </div>
+        {% render_table history_list %}
-        </div>
     </div>
 </div>