added type filter

TOPetit · Jan 27, 2023 · 1974a78 · 1974a78
1 parent 9e3189c
commit 1974a78
Show file tree

Hide file tree

Showing 2 changed files with 36 additions and 5 deletions.
diff --git a/frontend/src/lib/data/MessageContainer.svelte b/frontend/src/lib/data/MessageContainer.svelte
@@ -30,7 +30,7 @@
 
     let options: Options = {
         senders: { Jodie: true, Matthieu: true, Théo: true },
-        type: { 1: true, 2: true, 3: true, 4: true },
+        type: { 0: true, 1: true, 2: true, 3: true, 4: true },
         content: "",
         dateWindow: { start: "*", end: "*" },
         page_number: 1,
@@ -46,6 +46,7 @@
             display_this =
                 display_this &&
                 (options.content == "" || options.content == message.content);
+            display_this = display_this && options.type[message.type];
             if (display_this) {
                 displayed_data = [...displayed_data, message];
             }

diff --git a/frontend/src/lib/data/Sorter.svelte b/frontend/src/lib/data/Sorter.svelte
@@ -8,13 +8,21 @@
         page_size: number;
     };
 
+    const types: { [key: number]: string } = {
+        0: "Non défini",
+        1: "Correct",
+        2: "Erreur",
+        3: "Coeur Bleu",
+        4: "Duplicat",
+    };
+
     export let options: Options;
 
     $: options.page_number = options.page_number < 1 ? 1 : options.page_number;
 </script>
 
 <div class="sorter">
-    <div id="senders">
+    <div class="filter" id="senders">
         {#each Object.keys(options.senders) as sender}
             <label>
                 <input type="checkbox" bind:checked={options.senders[sender]} />
@@ -23,10 +31,19 @@
             >
         {/each}
     </div>
-    <div id="content">
+    <div class="filter" id="content">
         Contenu du message : <input type="text" bind:value={options.content} />
     </div>
-    <div id="page_manager">
+    <div class="filter" id="type">
+        {#each Object.keys(options.type) as type}
+            <label>
+                <input type="checkbox" bind:checked={options.type[type]} />
+                <!-- svelte-ignore a11y-label-has-associated-control -->
+                {types[Number(type)]}</label
+            >
+        {/each}
+    </div>
+    <div class="filter" id="page_manager">
         <div class="item" id="page_size">
             Nombre de lignes affichées : <input
                 type="number"
@@ -46,7 +63,7 @@
             <!-- svelte-ignore a11y-click-events-have-key-events -->
         </div>
     </div>
-    <div id="reset">
+    <div class="filter" id="reset">
         <button
             on:click={() => {
                 options = {
@@ -75,6 +92,19 @@
         gap: 15px;
     }
 
+    .filter {
+        display: flex;
+        gap: 15px;
+        align-items: center;
+        justify-content: center;
+    }
+
+    .filter > label {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+    }
+
     #page_manager {
         display: flex;
         gap: 10px;