split first name / last name in filter search person (#270)

lblod · Mar 9, 2022 · 66c15d1 · 66c15d1
1 parent 2fba8c5
commit 66c15d1
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 9 deletions.
diff --git a/app/controllers/people/index.js b/app/controllers/people/index.js
@@ -5,14 +5,23 @@ import { tracked } from '@glimmer/tracking';
 
 export default class PeopleIndexController extends Controller {
   @service router;
-  queryParams = ['page', 'size', 'name', 'organization', 'status', 'position'];
+  queryParams = [
+    'page',
+    'size',
+    'given_name',
+    'family_name',
+    'organization',
+    'status',
+    'position',
+  ];
   @tracked status = true;
   @tracked position;
 
   @tracked page = 0;
   size = 25;
   @tracked sort = 'family_name';
-  @tracked name = '';
+  @tracked given_name = '';
+  @tracked family_name = '';
   @tracked organization;
   @tracked selectedOrganization;
 

diff --git a/app/routes/people/index.js b/app/routes/people/index.js
@@ -11,7 +11,8 @@ export default class PeopleIndexRoute extends Route {
     organization: { replace: true },
     status: { refreshModel: true },
     position: { refreshModel: true },
-    name: { replace: true },
+    given_name: { replace: true },
+    family_name: { replace: true },
   };
 
   model(params) {
@@ -24,10 +25,11 @@ export default class PeopleIndexRoute extends Route {
   @dropTask({ cancelOn: 'deactivate' })
   *loadPeopleTask(params) {
     const filter = {};
-    if (params.name) {
-      filter[
-        ':query:given_name'
-      ] = `(given_name:${params.name}~)  OR (family_name:${params.name}~ ) `;
+    if (params.given_name) {
+      filter[':prefix:given_name'] = `${params.given_name.toLowerCase()}`;
+    }
+    if (params.family_name) {
+      filter[':prefix:family_name'] = `${params.family_name.toLowerCase()}`;
     }
     if (params.status) {
       let date = new Date().toISOString().slice(0, -5);

diff --git a/app/templates/people/index.hbs b/app/templates/people/index.hbs
@@ -4,13 +4,21 @@
       <div class="au-c-sidebar__content au-o-box">
         <form {{on "submit" this.search}} class="au-o-grid au-o-grid--small">
           <p class="au-o-grid__item">
-            <AuLabel for="filter-given-name">Naam</AuLabel>
+            <AuLabel for="filter-given-name">Voornaam</AuLabel>
             <AuInput
               @width="block"
-              @value={{this.name}}
+              @value={{this.given_name}}
               id="filter-given-name"
             />
           </p>
+          <p class="au-o-grid__item">
+            <AuLabel for="filter-family-name">Achternaam</AuLabel>
+            <AuInput
+              @width="block"
+              @value={{this.family_name}}
+              id="filter-family-name"
+            />
+          </p>
           <p class="au-o-grid__item">
             <AuLabel for="filter-organization">Organisatie</AuLabel>
             <AdministrativeUnitSelect