feat: let teamers fill in and read their questionnaire
This commit is contained in:
fromme committed
1 parent
2a041d25a0
commit
5e4e574076
11 files changed
+472
-2
No files matched your search
@@ -173,6 +173,38 @@
|
||||
{%- endif -%}
|
||||
{%- endblock pickup_choice_widget -%}
|
||||
|
||||
{#
|
||||
# A section of a questionnaire (App\Form\QuestionnaireType): its title and its questions. The
|
||||
# questions' rows carry data-question-key and, when conditional, data-show-if, which
|
||||
# assets/controllers/questionnaire_controller.js reads to show and hide them.
|
||||
#}
|
||||
{%- block questionnaire_section_row -%}
|
||||
<fieldset class="pb-8">
|
||||
{%- if label is not same as(false) -%}
|
||||
<legend class="text-xl font-bold pb-4">{{ label }}</legend>
|
||||
{%- endif -%}
|
||||
<div class="flex flex-col gap-y-6">
|
||||
{%- for child in form -%}
|
||||
{{- form_row(child) -}}
|
||||
{%- endfor -%}
|
||||
</div>
|
||||
</fieldset>
|
||||
{%- endblock questionnaire_section_row -%}
|
||||
|
||||
{# A 1-5 rating as a row of buttons, the radios themselves hidden. #}
|
||||
{%- block questionnaire_rating_widget -%}
|
||||
<div class="flex gap-x-2" role="radiogroup">
|
||||
{%- for child in form -%}
|
||||
<label class="cursor-pointer">
|
||||
{{- form_widget(child, { attr: { class: 'peer sr-only' } }) -}}
|
||||
<span class="{{ html_classes('flex h-10 w-10 items-center justify-center rounded-md text-sm font-bold ring-1 ring-inset peer-checked:bg-primary peer-checked:text-white peer-checked:ring-primary peer-focus-visible:ring-2', { 'ring-red-500 text-red-500': errors|length, 'ring-gray-300 text-gray-900': not errors|length }) }}">
|
||||
{{- child.vars.label -}}
|
||||
</span>
|
||||
</label>
|
||||
{%- endfor -%}
|
||||
</div>
|
||||
{%- endblock questionnaire_rating_widget -%}
|
||||
|
||||
{%- block birthday_widget -%}
|
||||
<div class="grid grid-cols-3 gap-x-1">
|
||||
{{ form_widget(form.children['day']) }}
|
||||
|
||||
@@ -0,0 +1,51 @@
|
||||
{#
|
||||
# A submitted questionnaire response, read-only. Expects `definition` (the version the response
|
||||
# was submitted under) and `response`. Questions that are hidden or were left open are skipped;
|
||||
# an answer the definition does not know (an option key since renamed) is shown as stored rather
|
||||
# than dropped.
|
||||
#}
|
||||
{% set answers = response.answers %}
|
||||
<div class="flex flex-col gap-y-8">
|
||||
{% for section in definition.sections %}
|
||||
{% set shown = section.questions|filter(question => answers[question.key] is defined and definition.isVisible(question, answers)) %}
|
||||
{% if shown is not empty %}
|
||||
<section>
|
||||
{% if section.title %}
|
||||
<h2 class="text-lg font-bold pb-2">
|
||||
{{ section.title }}
|
||||
</h2>
|
||||
{% endif %}
|
||||
<dl class="divide-y divide-gray-100">
|
||||
{% for question in shown %}
|
||||
{% set answer = answers[question.key] %}
|
||||
<div class="py-4 sm:grid sm:grid-cols-2 sm:gap-4">
|
||||
<dt class="text-sm font-bold leading-6 text-gray-900">
|
||||
{{ question.label|nl2br }}
|
||||
</dt>
|
||||
<dd class="mt-1 text-sm leading-6 text-gray-700 sm:mt-0">
|
||||
{% if question.type.value == 'rating' %}
|
||||
<span class="inline-flex items-center gap-x-2">
|
||||
<span class="inline-flex items-center">
|
||||
{% for grade in range(1, 5) %}
|
||||
{{ icon('star', html_classes('w-4 h-4', { 'text-gray-200': answer < grade, 'text-primary': answer >= grade })) }}
|
||||
{% endfor %}
|
||||
</span>
|
||||
{{ answer }} von 5
|
||||
</span>
|
||||
{% elseif question.type.value == 'choice' %}
|
||||
{{ (question.option(answer).label ?? answer) }}
|
||||
{% elseif question.type.value == 'multi' %}
|
||||
{{ answer|map(key => (question.option(key).label ?? key))|join(', ') }}
|
||||
{% elseif question.type.value == 'date' %}
|
||||
{{ answer|date('d.m.Y') }}
|
||||
{% else %}
|
||||
{{ answer|nl2br }}
|
||||
{% endif %}
|
||||
</dd>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</dl>
|
||||
</section>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
@@ -0,0 +1,23 @@
|
||||
{% extends 'teamer/layout.html.twig' %}
|
||||
|
||||
{% block title %}{{ definition.title }}{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<h1 class="text-2xl font-bold pb-4">
|
||||
{{ definition.title }}
|
||||
</h1>
|
||||
<p class="pb-8 text-gray-700">
|
||||
Abgeschickt am {{ response.submittedAt|date('d.m.Y, H:i') }} Uhr. Danke für dein Feedback!
|
||||
</p>
|
||||
<div class="grid lg:grid-cols-3 gap-8 items-start">
|
||||
<div class="lg:col-span-2">
|
||||
{% include 'questionnaire/_answers.html.twig' %}
|
||||
</div>
|
||||
<div>
|
||||
<h2 class="text-lg font-bold pb-4">
|
||||
Dein Einsatz
|
||||
</h2>
|
||||
{% include '_partials/_assignment_info.html.twig' with { 'assignment': disposition.assignment } %}
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,42 @@
|
||||
{% extends 'teamer/layout.html.twig' %}
|
||||
|
||||
{% block title %}{{ definition.title }}{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<h1 class="text-2xl font-bold pb-4">
|
||||
{{ definition.title }}
|
||||
</h1>
|
||||
{% if definition.description %}
|
||||
<p class="pb-8 text-gray-700">
|
||||
{{ definition.description|nl2br }}
|
||||
</p>
|
||||
{% endif %}
|
||||
<div class="grid lg:grid-cols-3 gap-8 items-start">
|
||||
<div class="lg:col-span-2">
|
||||
{{ form_start(form, { attr: { 'data-controller': 'questionnaire', 'data-action': 'change->questionnaire#update' } }) }}
|
||||
{% for child in form|filter(child => child.vars.name not in ['draft', 'submit']) %}
|
||||
{{ form_row(child) }}
|
||||
{% endfor %}
|
||||
<div class="flex flex-wrap items-center gap-4 pt-4">
|
||||
{{ form_widget(form.submit, { attr: { class: 'btn' } }) }}
|
||||
{{ form_widget(form.draft, { attr: { class: 'btn btn--secondary' } }) }}
|
||||
</div>
|
||||
<p class="pt-2 text-sm text-gray-500">
|
||||
Als Entwurf kannst du den Fragebogen jederzeit speichern und später weiter ausfüllen.
|
||||
Abgeschickt ist er endgültig.
|
||||
</p>
|
||||
{{ form_end(form) }}
|
||||
</div>
|
||||
<div>
|
||||
<h2 class="text-lg font-bold pb-4">
|
||||
Dein Einsatz
|
||||
</h2>
|
||||
{% include '_partials/_assignment_info.html.twig' with { 'assignment': disposition.assignment } %}
|
||||
{% if response %}
|
||||
<p class="pt-6 text-sm text-gray-500">
|
||||
Entwurf zuletzt gespeichert am {{ (response.updatedAt ?? response.createdAt)|date('d.m.Y, H:i') }} Uhr
|
||||
</p>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
Reference in new issue
Block a user