django-filters pagination

views.py
--------

class ComputerList(generic.ListView):
    model = Computer
    context_object_name = 'computers_list'
    template_name = 'isupport/computer_list.html'
    paginate_by = 20
    queryset = Computer.objects.all()

    def get_context_data(self, **kwargs):
        context = super().get_context_data(**kwargs)
        context['filter'] = ComputerFilter(self.request.GET, queryset=self.get_queryset())
        return context

filters.py
----------

class ComputerFilter(django_filters.FilterSet):

    computer_name = django_filters.CharFilter(label='Nombre', lookup_expr='icontains', widget=forms.TextInput(attrs={'class':'form-control col-sm-8'}))
    computer_sn = django_filters.CharFilter(label='Número de Serie', lookup_expr='icontains', widget=forms.TextInput(attrs={'class':'form-control col-sm-8'}))
    computer_saben = django_filters.CharFilter(label='Número de SABEN', lookup_expr='icontains', widget=forms.TextInput(attrs={'class':'form-control col-sm-8'}))
    computer_model = django_filters.ModelChoiceFilter(label='Modelo', queryset=ComputerModel.objects.all(), widget=forms.Select(attrs={'class':'form-control col-sm-8'}))
    computer_section = django_filters.ModelChoiceFilter(label='Ubicación', queryset=Section.objects.all(), widget=forms.Select(attrs={'class':'form-control col-sm-8'}))
    computer_ipv4_adress = django_filters.CharFilter(label='Dirección IPv4', lookup_expr='icontains', widget=forms.TextInput(attrs={'class':'form-control col-sm-8'}))
    computer_mac_adress = django_filters.CharFilter(label='Dirección MAC', lookup_expr='icontains', widget=forms.TextInput(attrs={'class':'form-control col-sm-8'}))
    computer_os = django_filters.ModelChoiceFilter(label='Sistema Operativo', queryset=ComputerOS.objects.all(), widget=forms.Select(attrs={'class':'form-control col-sm-8'}))
    computer_state = django_filters.ModelChoiceFilter(label='Estado', queryset=State.objects.all(), widget=forms.Select(attrs={'class':'form-control col-sm-8'}))
    computer_model__computermodel_type = django_filters.ModelChoiceFilter(label='Tipo', queryset=ComputerType.objects.all(), widget=forms.Select(attrs={'class':'form-control col-sm-8'}))
    computer_hd = django_filters.ModelChoiceFilter(label='Capacidad de Disco', queryset=ComputerHDModel.objects.all(), widget=forms.Select(attrs={'class':'form-control col-sm-8'}))
    computer_hd__computerhdmodel_type = django_filters.ModelChoiceFilter(label='Tipo de Disco', queryset=ComputerHDType.objects.all(), widget=forms.Select(attrs={'class':'form-control col-sm-8'}))

    class Meta:
        model = Computer
        fields = (
            'computer_name',
            'computer_sn',
            'computer_saben',
            'computer_model',
            'computer_os',
            'computer_section',
            'computer_state',
            'computer_ipv4_adress',
            'computer_mac_adress',
            'computer_model__computermodel_type',
            'computer_hd',
            'computer_hd__computerhdmodel_type',
        )



computers_list.html
-------------------

{% if object_list %}

    <table id="computers_list" class="table table-hover table-striped">
        <thead class="table-primary">
            <tr>
                <th>Nombre</th>
                <th>Modelo</th>
                <th class="d-none d-md-table-cell">Sistema Operativo</th>
                <th class="d-none d-md-table-cell">Ubicación</th>
                <th>Estado</th>
                <th>SABEN</th>
                <th class="d-none d-md-table-cell">Dirección IP</th>
                <th class="d-none d-md-table-cell">Dirección MAC</th>
                <th class="d-none d-md-table-cell"></th>
            </tr>
        </thead>

        <tbody>
            {% for computer in filter.qs %}

                {% if computer.computer_status == 'Baja' %}

                    <tr class="table-danger">

                {% else %}

                    <tr>

                {% endif  %}

                    <td><a href="{% url 'isupport:computer_update' computer.computer_id %}">{{ computer.computer_name | upper }}</a></td>
                    <td>{{ computer.computer_model }}</td>
                    <td class="d-none d-md-table-cell">{{ computer.computer_os }}</td>
                    <td class="d-none d-md-table-cell">{{ computer.computer_section }}</td>


                    {% if computer.computer_status == "Activo" %}

                        <td class="text-success">{{ computer.computer_status }}</td>

                    {% elif computer.computer_status == "Inactivo" %}

                        <td class="text-secondary">{{ computer.computer_status }}</td>

                    {% elif computer.computer_status == "Baja" %}

                        <td>{{ computer.computer_status }}</td>

                    {% elif computer.computer_status == "Rota" %}

                        <td class="text-danger">{{ computer.computer_status }}</td>

                    {% elif computer.computer_status == "En Transito" %}

                        <td class="text-warning">{{ computer.computer_status }}</td>

                    {% else %}

                        <td>{{ computer.computer_status }}</td>

                    {% endif %}


                    <td>{{ computer.computer_saben }}</td>

                    {% if computer.computer_ipv4_adress == None %}

                        <td class="d-none d-md-table-cell">DHCP</td>

                    {% else %}

                        <td class="d-none d-md-table-cell">{{ computer.computer_ipv4_adress }}</td>

                    {% endif %}

                    {% if computer.computer_mac_adress is None %}

                        <td  class="d-none d-md-table-cell text-warning">N/A</td>

                    {% else %}

                        <td class="d-none d-md-table-cell">{{ computer.computer_mac_adress | upper }}</td>

                    {% endif %}

                    <td class="d-none d-md-table-cell"><a href="{% url 'isupport:computer_delete' computer.computer_id %}">Eliminar</a></td>

                </tr>

            {% endfor %}

        </tbody>

    </table>

    {% if is_paginated %}
        <nav aria-label="Page navigation">
            <ul class="pagination pagination-sm">
                {% if page_obj.has_previus %}
                    <li class="page-item">
                        <a class="page-link" href="?page={{ page_obj.previus_page_number }}">Anterior</a>
                    </li>
                {% else %}
                    <li class="page-item disabled">
                        <a class="page-link" href="#" tabindex="-1">Anterior</a>
                    </li>
                {% endif %}
                {% for i in paginator.page_range %}
                    <li class="page-item {% if page_obj.number == i %}active{% endif %}">
                        <a class="page-link" href="?page={{ i }}">{{ i }}</a>
                    </li>
                {% endfor %}
                {% if page_obj.has_next %}
                    <li class="page-item">
                        <a class="page-link" href="?page={{ page_obj.next_page_number }}">Siguiente</a>
                    </li>
                {% else %}
                    <li class="page-item disabled">
                        <a class="page-link" href="#" tabindex="-1">Siguiente</a>
                    </li>
                {% endif %}
            </ul>
        </nav>
    {% endif %}

{% else %}

    <p>No hay registros</p>

{% endif %}

<div class="modal fade" id="modal_search">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title">Buscar</h4>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">

                <form method="GET" class="form-group" enctype="multipart/form-data">

                    {% for field in filter.form %}

                        <div class="fieldWrapper">
                            {{ field.errors }}
                            <div class="form-inline">
                            <label class="col-sm-4 control-label">{{ field.label_tag }}</label>
                            <div class="col-sm-8">{{ field }}</div>
                            </div>
                            {% if field.help_text %}
                                <p class="help">{{ field.help_text|safe }}</p>
                            {% endif %}
                            <p></p>
                        </div>

                    {% endfor %}

            </div>

            <div class="modal-footer">
                <button type="submit" class="btn btn-primary">Buscar</button>
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Cerrar</button>
            </form>
            </div>
        </div>
    </div>
</div>