From 0e7a0be7042cba489488a62a53e4c1a386f29d7e Mon Sep 17 00:00:00 2001
From: bbonf <b.bonfil@uu.nl>
Date: Fri, 15 Nov 2024 16:12:43 +0100
Subject: [PATCH] show experiment criteria in demographics view

---
 .../participants/ParticipantDemographics.vue      | 15 ++++++++++++++-
 ...riteria_snippit.html => criteria_snippet.html} |  0
 .../templates/experiments/detail_parts/info.html  |  2 +-
 ...ippit.html => experiment_actions_snippet.html} |  0
 lab/experiments/templates/experiments/index.html  |  2 +-
 lab/experiments/urls/experiments_urls/__init__.py |  2 ++
 lab/experiments/views/experiment_views.py         | 12 ++++++++++++
 7 files changed, 30 insertions(+), 3 deletions(-)
 rename lab/experiments/templates/experiments/{criteria_snippit.html => criteria_snippet.html} (100%)
 rename lab/experiments/templates/experiments/{experiment_actions_snippit.html => experiment_actions_snippet.html} (100%)

diff --git a/babex-vue/src/components/participants/ParticipantDemographics.vue b/babex-vue/src/components/participants/ParticipantDemographics.vue
index ff4415ca..77316cd5 100644
--- a/babex-vue/src/components/participants/ParticipantDemographics.vue
+++ b/babex-vue/src/components/participants/ParticipantDemographics.vue
@@ -17,6 +17,9 @@
         premature_no: true,
     });
 
+
+    let criteriaSnippet = ref('');
+
     defineProps(['experiments']);
 
     let request = null;
@@ -127,6 +130,15 @@
         d3.select('.graph svg').remove();
         loading.value = true;
         makeGraph('.graph');
+
+        if (experiment) {
+            fetch(`/experiments/${experiment.value}/criteria/`, {
+                credentials: 'include',
+                method: 'GET',
+            }).then(async (response) => {
+                criteriaSnippet.value = await response.text()
+            });
+        }
     }, {deep: true});
 </script>
 
@@ -145,7 +157,8 @@
         </div>
         <div class="col-3">
             <div>{{ _('Criteria:') }}</div>
-            <div class="criteria" :class="experiment && 'disabled'">
+            <div v-if="experiment" v-html="criteriaSnippet"></div>
+            <div class="criteria" v-if="!experiment">
                 <div>
                     {{ _('Parent with Dyslexia') }}
                     <div class="float-end">
diff --git a/lab/experiments/templates/experiments/criteria_snippit.html b/lab/experiments/templates/experiments/criteria_snippet.html
similarity index 100%
rename from lab/experiments/templates/experiments/criteria_snippit.html
rename to lab/experiments/templates/experiments/criteria_snippet.html
diff --git a/lab/experiments/templates/experiments/detail_parts/info.html b/lab/experiments/templates/experiments/detail_parts/info.html
index 298fbc1f..e39e64fb 100644
--- a/lab/experiments/templates/experiments/detail_parts/info.html
+++ b/lab/experiments/templates/experiments/detail_parts/info.html
@@ -135,7 +135,7 @@ <h3 class="d-inline">
         </div>
     </div>
     <div class="tab-pane fade" id="criteria" role="tabpanel">
-        {% include 'experiments/criteria_snippit.html' %}
+        {% include 'experiments/criteria_snippet.html' %}
         <div class="p-2">
             <a class="btn btn-secondary" href="{% url 'experiments:default_criteria' experiment.pk %}?next={{ request.path }}">
                 {% trans 'experiments:detail:edit_default_criteria' %}
diff --git a/lab/experiments/templates/experiments/experiment_actions_snippit.html b/lab/experiments/templates/experiments/experiment_actions_snippet.html
similarity index 100%
rename from lab/experiments/templates/experiments/experiment_actions_snippit.html
rename to lab/experiments/templates/experiments/experiment_actions_snippet.html
diff --git a/lab/experiments/templates/experiments/index.html b/lab/experiments/templates/experiments/index.html
index d72975dc..a8a50682 100644
--- a/lab/experiments/templates/experiments/index.html
+++ b/lab/experiments/templates/experiments/index.html
@@ -83,7 +83,7 @@ <h1 class="h2">
                                    class="icon-phone" title="{% trans 'experiments:home:invite:title'  %}" ></a>
                             </div>
                             <div>
-                                {% include 'experiments/experiment_actions_snippit.html' %}
+                                {% include 'experiments/experiment_actions_snippet.html' %}
                             </div>
                             </div>
                         </td>
diff --git a/lab/experiments/urls/experiments_urls/__init__.py b/lab/experiments/urls/experiments_urls/__init__.py
index 0293c003..124b7bbe 100644
--- a/lab/experiments/urls/experiments_urls/__init__.py
+++ b/lab/experiments/urls/experiments_urls/__init__.py
@@ -3,6 +3,7 @@
 from experiments.views import (
     ExperimentAttachmentView,
     ExperimentCreateView,
+    ExperimentCriteriaView,
     ExperimentDeleteView,
     ExperimentDetailView,
     ExperimentHomeView,
@@ -16,4 +17,5 @@
     path("<int:pk>/update/", ExperimentUpdateView.as_view(), name="update"),
     path("<int:pk>/delete/", ExperimentDeleteView.as_view(), name="delete"),
     path("<int:pk>/attachment/<int:attachment>", ExperimentAttachmentView.as_view(), name="attachment"),
+    path("<int:pk>/criteria/", ExperimentCriteriaView.as_view(), name="criteria"),
 ]
diff --git a/lab/experiments/views/experiment_views.py b/lab/experiments/views/experiment_views.py
index 080107c3..fe1ffb70 100644
--- a/lab/experiments/views/experiment_views.py
+++ b/lab/experiments/views/experiment_views.py
@@ -136,3 +136,15 @@ def get(self, request, *args, **kwargs):
         response = HttpResponse(attachment.file, content_type=attachment.file.content_type)
         response["Content-Disposition"] = "attachment; filename=" + attachment.filename
         return response
+
+
+class ExperimentCriteriaView(LabManagerMixin, ExperimentObjectMixin, generic.TemplateView):
+    """used to display an html table with filter criteria on the demographics view"""
+
+    experiment_kwargs_name = "pk"
+    template_name = "experiments/criteria_snippet.html"
+
+    def get_context_data(self, *args, **kwargs):
+        context = super().get_context_data(*args, **kwargs)
+        context["experiment"] = self.experiment
+        return context