Merge branch 'UCL-INGI:main' into Feature-Assignement

UCL-INGI · Jul 29, 2024 · 3b0d5b9 · 3b0d5b9
2 parents 64b07aa + 811e32a
commit 3b0d5b9
Show file tree

Hide file tree

Showing 4 changed files with 70 additions and 0 deletions.
diff --git a/static/scripts/util.js b/static/scripts/util.js
@@ -105,4 +105,27 @@ $(document).on('click', '.remove-tag', function (e) {
  $(this).parent('.badge').remove();
 });
 
+$(document).on('click', '#filterIcon', function (e) {
+ e.preventDefault();
+ $('#filterRow').toggle();
+});
+
+$(document).on('keyup', '#filterRow input', function () {
+ // Get the index of the column from the data-column attribute of the input
+ let column = $(this).data('column');
+
+ // Get the value entered in the input and convert it to lowercase
+ let value = $(this).val().toLowerCase();
 
+ // Iterate through each row in the table body
+ $('table tbody tr').each(function () {
+ // Get the text content of the cell at the specified column index and convert it to lowercase
+ let cellText = $(this).find('td').eq(column).text().toLowerCase();
+
+ // Check if the cell text contains the searched value
+ let containsValue = cellText.indexOf(value) > -1;
+
+ // Show or hide the row based on whether the cell text contains the searched value
+ $(this).toggle(containsValue);
+ });
+});
diff --git a/templates/courses.html b/templates/courses.html
@@ -13,8 +13,23 @@
  <h2 class="mt-3">List of Courses</h2>
  <hr class="mb-3">
  {% include 'filter.html' %}
+ <div class="card">
+ <div class="card-header d-flex justify-content-between align-items-center">
+ <h4>Courses</h4>
+ <i class="fa-solid fa-filter" id="filterIcon" style="cursor: pointer;"></i>
+ </div>
+ <div class="card-body">
  <table class="table table-hover">
  <thead>
+ <tr id="filterRow" style="display: none;">
+ <th><input type="text" class="form-control form-control-sm" placeholder="Filter Title"
+ data-column="0"></th>
+ <th><input type="text" class="form-control form-control-sm" placeholder="Filter Teachers"
+ data-column="1"></th>
+ <th><input type="text" class="form-control form-control-sm" placeholder="Filter Organizations"
+ data-column="2"></th>
+ <th></th>
+ </tr>
  <tr>
  <th>Title</th>
  <th>Teachers</th>
@@ -57,6 +72,8 @@ <h2 class="mt-3">List of Courses</h2>
  </tbody>
  </table>
  </div>
+ </div>
+ </div>
 {% endblock %}
 {% block additionalfooter %}
  <script>

diff --git a/templates/home.html b/templates/home.html
@@ -1,6 +1,7 @@
 {% extends "layout.html" %}
 {% block pagetitle %}Home Page{% endblock %}
 {% block pagecontent %}
+ <br>
  <div class="toast-container top-0 start-50 translate-middle-x text-danger">
  {% with messages = get_flashed_messages(with_categories=true) %}
  {% if messages %}

diff --git a/templates/users.html b/templates/users.html
@@ -13,8 +13,35 @@
  <h2 class="mt-3">List of Users</h2>
  <hr class="mb-3">
  {% include 'filter.html' %}
+ <div class="card">
+ <div class="card-header d-flex justify-content-between align-items-center">
+ <h4>Users</h4>
+ <i class="fa-solid fa-filter" id="filterIcon" style="cursor: pointer;"></i>
+ </div>
+ <div class="card-body">
  <table class="table table-hover">
  <thead>
+ <tr id="filterRow" style="display: none;">
+ <th><input type="text" class="form-control form-control-sm" placeholder="Filter Last Name"
+ data-column="0"></th>
+ <th><input type="text" class="form-control form-control-sm" placeholder="Filter First Name"
+ data-column="1"></th>
+ <th><input type="text" class="form-control form-control-sm" placeholder="Filter Email"
+ data-column="2"></th>
+ <th><input type="text" class="form-control form-control-sm"
+ placeholder="Filter Organization Code" data-column="3"></th>
+ {% if user_type == 'researcher' %}
+ <th><input type="text" class="form-control form-control-sm" placeholder="Filter Status"
+ data-column="4"></th>
+ <th><input type="text" class="form-control form-control-sm" placeholder="Filter Max Load"
+ data-column="5"></th>
+ {% endif %}
+ {% if user_type == 'archived' %}
+ <th><input type="text" class="form-control form-control-sm" placeholder="Filter Type"
+ data-column="4"></th>
+ {% endif %}
+ <th></th>
+ </tr>
  <tr>
  <th>Last Name</th>
  <th>First Name</th>
@@ -70,6 +97,8 @@ <h2 class="mt-3">List of Users</h2>
  {% endfor %}
  </tbody>
  </table>
+ </div>
+ </div>
  <div id="errorPopup" class="modal fade">
  <div class="modal-dialog modal-dialog-centered">
  <div class="modal-content">