Merge pull request #208 from eReuse/feature/server-side-render-filter-#2838

Filter devices by type #2838

ereuse_devicehub/inventory/forms.py

@@ -51,6 +51,51 @@ from ereuse_devicehub.resources.tradedocument.models import TradeDocument
 from ereuse_devicehub.resources.user.exceptions import InsufficientPermission
 from ereuse_devicehub.resources.user.models import User
 
+DEVICES = {
+    "All": ["All"],
+    "Computer": [
+        "Desktop",
+        "Laptop",
+        "Server",
+    ],
+    "Monitor": ["ComputerMonitor", "Monitor", "TelevisionSet", "Projector"],
+    "Mobile, tablet & smartphone": ["Mobile", "Tablet", "Smartphone", "Cellphone"],
+    "DataStorage": ["HardDrive", "SolidStateDrive"],
+    "Accessories & Peripherals": [
+        "GraphicCard",
+        "Motherboard",
+        "NetworkAdapter",
+        "Processor",
+        "RamModule",
+        "SoundCard",
+        "Battery",
+        "Keyboard",
+        "Mouse",
+        "MemoryCardReader",
+    ],
+}
+
+
+class FilterForm(FlaskForm):
+    filter = SelectField(
+        '', choices=DEVICES, default="Computer", render_kw={'class': "form-select"}
+    )
+
+    def __init__(self, *args, **kwargs):
+        super().__init__(*args, **kwargs)
+        types_of_devices = [item for sublist in DEVICES.values() for item in sublist]
+        dev = request.args.get('filter')
+        self.device = dev if dev in types_of_devices else None
+        if self.device:
+            self.filter.data = self.device
+
+    def search(self):
+
+        if self.device:
+            return [self.device]
+
+        return ['Desktop', 'Laptop', 'Server']
+
 
 class LotDeviceForm(FlaskForm):
     lot = StringField('Lot', [validators.UUID()])

ereuse_devicehub/inventory/views.py

@@ -16,6 +16,7 @@ from ereuse_devicehub.db import db
 from ereuse_devicehub.inventory.forms import (
     AllocateForm,
     DataWipeForm,
+    FilterForm,
     LotDeviceForm,
     LotForm,
     NewActionForm,
@@ -60,9 +61,8 @@ class DeviceListMix(GenericMixView):
     template_name = 'inventory/device_list.html'
 
     def get_context(self, lot_id):
-        # TODO @cayop adding filter
-        # https://github.com/eReuse/devicehub-teal/blob/testing/ereuse_devicehub/resources/device/views.py#L56
-        filter_types = ['Desktop', 'Laptop', 'Server']
+        form_filter = FilterForm()
+        filter_types = form_filter.search()
         lots = self.get_lots()
         lot = None
         tags = (
@@ -72,8 +72,9 @@ class DeviceListMix(GenericMixView):
         )
 
         if lot_id:
-            # import pdb; pdb.set_trace()
             lot = lots.filter(Lot.id == lot_id).one()
+            devices = lot.devices
+            if "All" not in filter_types:
                 devices = [dev for dev in lot.devices if dev.type in filter_types]
             devices = sorted(devices, key=lambda x: x.updated, reverse=True)
             form_new_action = NewActionForm(lot=lot.id)
@@ -85,12 +86,20 @@ class DeviceListMix(GenericMixView):
                 user_from=g.user.email,
             )
         else:
+            if "All" in filter_types:
                 devices = (
                     Device.query.filter(Device.owner_id == current_user.id)
-                .filter(Device.type.in_(filter_types))
                     .filter_by(lots=None)
                     .order_by(Device.updated.desc())
                 )
+            else:
+                devices = (
+                    Device.query.filter(Device.owner_id == current_user.id)
+                    .filter_by(lots=None)
+                    .filter(Device.type.in_(filter_types))
+                    .order_by(Device.updated.desc())
+                )
+
             form_new_action = NewActionForm()
             form_new_allocate = AllocateForm()
             form_new_datawipe = DataWipeForm()
@@ -109,6 +118,7 @@ class DeviceListMix(GenericMixView):
             'form_new_allocate': form_new_allocate,
             'form_new_datawipe': form_new_datawipe,
             'form_new_trade': form_new_trade,
+            'form_filter': form_filter,
             'lot': lot,
             'tags': tags,
             'list_devices': list_devices,

ereuse_devicehub/templates/inventory/device_list.html

@@ -286,12 +286,24 @@
               {% endif %}
 
               <div class="tab-content pt-2">
+                <form method="get">
+                  <div class="d-flex mt-4 mb-4">
+                    {% for f in form_filter %}
+                      {{ f }}
+                    {% endfor %}
+                    <input type="submit" class="ms-2 btn btn-primary" value="Filter" />
+                  </div>
+                </form>
+
+                <p class="mt-3">
+                  Displaying devices of type
+                  <em>{{ form_filter.filter.data or "Computer" }}</em>
+                </p>
 
-                <h5 class="card-title">Computers</h5>
                 <table class="table">
                   <thead>
                     <tr>
-                      <th scope="col">Select all</th>
+                      <th scope="col">Select</th>
                       <th scope="col">Title</th>
                       <th scope="col">DHID</th>
                       <th scope="col">Tags</th>