mirror of
https://github.com/MarijnDoeve/TijdVoorDeTest.git
synced 2026-07-05 15:10:16 +02:00
feat: add question bank management, quiz finalization, and related backend/frontend functionality
This commit is contained in:
@@ -0,0 +1,55 @@
|
||||
{% extends 'backoffice/base.html.twig' %}
|
||||
|
||||
{% macro answer_row(answerForm) %}
|
||||
<div class="d-flex align-items-center gap-2 mb-2" data-collection-item>
|
||||
<div class="flex-grow-1">{{ form_widget(answerForm.text) }}</div>
|
||||
<div class="form-check">
|
||||
{{ form_widget(answerForm.isRightAnswer, {attr: {class: 'form-check-input'}}) }}
|
||||
{{ form_label(answerForm.isRightAnswer, null, {label_attr: {class: 'form-check-label'}}) }}
|
||||
</div>
|
||||
<button type="button" class="btn btn-sm btn-outline-danger"
|
||||
data-action="bo--form-collection#removeItem">×</button>
|
||||
</div>
|
||||
{% endmacro %}
|
||||
|
||||
{% block title %}{{ parent() }}{{ 'Question bank'|trans }}{% endblock %}
|
||||
|
||||
{% block breadcrumbs %}
|
||||
<nav aria-label="breadcrumb" class="mb-3">
|
||||
<ol class="breadcrumb">
|
||||
<li class="breadcrumb-item"><a href="{{ path('tvdt_backoffice_index') }}">{{ 'Home'|trans }}</a></li>
|
||||
<li class="breadcrumb-item"><a href="{{ path('tvdt_backoffice_season', {seasonCode: season.seasonCode}) }}">{{ season.name }}</a></li>
|
||||
<li class="breadcrumb-item"><a href="{{ path('tvdt_backoffice_question_bank', {seasonCode: season.seasonCode}) }}">{{ 'Question bank'|trans }}</a></li>
|
||||
<li class="breadcrumb-item active" aria-current="page">{{ bankQuestion is null ? 'Add question'|trans : 'Edit question'|trans }}</li>
|
||||
</ol>
|
||||
</nav>
|
||||
{% endblock %}
|
||||
|
||||
{% block body %}
|
||||
<div class="row">
|
||||
<div class="col-md-6 col-12">
|
||||
<h2 class="mb-3">{{ bankQuestion is null ? 'Add question'|trans : 'Edit question'|trans }}</h2>
|
||||
|
||||
{{ form_start(form) }}
|
||||
{{ form_row(form.question) }}
|
||||
{{ form_row(form.reusable) }}
|
||||
{{ form_row(form.labels) }}
|
||||
|
||||
<div data-controller="bo--form-collection"
|
||||
data-bo--form-collection-prototype-value="{{ _self.answer_row(form.answers.vars.prototype)|e('html_attr') }}">
|
||||
{{ form_label(form.answers) }}
|
||||
{{ form_errors(form.answers) }}
|
||||
<div data-bo--form-collection-target="collection">
|
||||
{% for answerForm in form.answers %}
|
||||
{{ _self.answer_row(answerForm) }}
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% do form.answers.setRendered %}
|
||||
<button type="button" class="btn btn-sm btn-outline-primary mb-3"
|
||||
data-action="bo--form-collection#addItem">{{ 'Add answer'|trans }}</button>
|
||||
</div>
|
||||
|
||||
{{ form_end(form) }}
|
||||
</div>
|
||||
</div>
|
||||
{% endblock body %}
|
||||
@@ -23,7 +23,16 @@
|
||||
{% endmacro %}
|
||||
|
||||
<div data-controller="bo--quiz">
|
||||
<h4 class="mb-3">{{ 'Quick actions'|trans }}</h4>
|
||||
<h4 class="mb-3">
|
||||
{{ 'Quick actions'|trans }}
|
||||
{% if quiz.isFinalized %}
|
||||
<span class="badge text-bg-success">{{ 'Finalized'|trans }}</span>
|
||||
{% elseif quiz.isLocked %}
|
||||
<span class="badge text-bg-warning">{{ 'Locked (answers given)'|trans }}</span>
|
||||
{% else %}
|
||||
<span class="badge text-bg-secondary">{{ 'Draft'|trans }}</span>
|
||||
{% endif %}
|
||||
</h4>
|
||||
<div class="mb-3 btn-group">
|
||||
|
||||
{% if quiz is same as (season.activeQuiz) %}
|
||||
@@ -36,11 +45,28 @@
|
||||
{% else %}
|
||||
<form action="{{ path('tvdt_backoffice_enable', {seasonCode: season.seasonCode, quiz: quiz.id}) }}" method="POST">
|
||||
<input type="hidden" name="_token" value="{{ csrf_token('enable_quiz') }}">
|
||||
<button type="submit" class="btn btn-primary rounded-0 rounded-start">
|
||||
<button type="submit" class="btn btn-primary rounded-0 rounded-start"
|
||||
{% if not quiz.isFinalized %}disabled data-bs-toggle="tooltip"
|
||||
title="{{ 'The quiz must be finalized before it can be activated'|trans }}"{% endif %}>
|
||||
{{ 'Make active'|trans }}
|
||||
</button>
|
||||
</form>
|
||||
{% endif %}
|
||||
{% if not quiz.isFinalized %}
|
||||
<form action="{{ path('tvdt_backoffice_quiz_finalize', {quiz: quiz.id}) }}" method="POST">
|
||||
<input type="hidden" name="_token" value="{{ csrf_token('finalize_quiz') }}">
|
||||
<button type="submit" class="btn btn-success rounded-0">
|
||||
{{ 'Finalize'|trans }}
|
||||
</button>
|
||||
</form>
|
||||
{% elseif not quiz.hasStartedCandidates and quiz is not same as (season.activeQuiz) %}
|
||||
<form action="{{ path('tvdt_backoffice_quiz_unfinalize', {quiz: quiz.id}) }}" method="POST">
|
||||
<input type="hidden" name="_token" value="{{ csrf_token('unfinalize_quiz') }}">
|
||||
<button type="submit" class="btn btn-outline-success rounded-0">
|
||||
{{ 'Undo finalization'|trans }}
|
||||
</button>
|
||||
</form>
|
||||
{% endif %}
|
||||
<button class="btn btn-danger" data-action="click->bo--quiz#clearQuiz">
|
||||
{{ 'Clear Quiz...'|trans }}
|
||||
</button>
|
||||
|
||||
@@ -11,39 +11,24 @@
|
||||
{% endblock %}
|
||||
|
||||
{% block body %}
|
||||
<h2 class="mb-3">{{ 'Season'|trans }}: {{ season.name }}</h2>
|
||||
<div class="row">
|
||||
<div class="col-md-6 col-12">
|
||||
<div class="d-flex align-items-center mb-3">
|
||||
<h4 class="mb-0 pe-2">{{ 'Quizzes'|trans }}</h4>
|
||||
<a class="link"
|
||||
href="{{ path('tvdt_backoffice_quiz_add', {seasonCode: season.seasonCode}) }}">{{ 'Add'|trans }}</a>
|
||||
</div>
|
||||
<div class="list-group mb-3">
|
||||
{% for quiz in season.quizzes %}
|
||||
<a class="list-group-item list-group-item-action{% if season.activeQuiz == quiz %} active{% endif %}"
|
||||
href="{{ path('tvdt_backoffice_quiz', {seasonCode: season.seasonCode, quiz: quiz.id}) }}">{{ quiz.name }}</a>
|
||||
{% else %}
|
||||
{{ 'No quizzes'|trans }}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3 col-12">
|
||||
<div class="d-flex align-items-center mb-3">
|
||||
<h4 class="mb-0 pe-2">{{ 'Candidates'|trans }}</h4>
|
||||
<a class="link"
|
||||
href="{{ path('tvdt_backoffice_add_candidates', {seasonCode: season.seasonCode}) }}">{{ 'Add Candidate'|trans }}
|
||||
</a>
|
||||
</div>
|
||||
<ul class="mb-3">
|
||||
{% for candidate in season.candidates %}
|
||||
<li>{{ candidate.name }}</li>{% endfor %}
|
||||
</ul>
|
||||
{% set tabs = [
|
||||
{id: 'tests', label: 'Quizzes'|trans, route: 'tvdt_backoffice_season'},
|
||||
{id: 'question-bank', label: 'Question bank'|trans, route: 'tvdt_backoffice_question_bank'},
|
||||
{id: 'candidates', label: 'Candidates'|trans, route: 'tvdt_backoffice_season_candidates'},
|
||||
{id: 'settings', label: 'Settings'|trans, route: 'tvdt_backoffice_season_settings'},
|
||||
] %}
|
||||
|
||||
<div class="d-flex align-items-center mb-3">
|
||||
<h4 class="mb-0 pe-2">{{ 'Settings'|trans }}</h4>
|
||||
</div>
|
||||
{{ form(form) }}
|
||||
</div>
|
||||
<h2 class="mb-3">{{ 'Season'|trans }}: {{ season.name }}</h2>
|
||||
<ul class="nav nav-tabs mb-3">
|
||||
{% for tab in tabs %}
|
||||
<li class="nav-item">
|
||||
<a class="nav-link{{ activeTab == tab.id ? ' active' }}" href="{{ path(tab.route, {seasonCode: season.seasonCode}) }}">
|
||||
{{ tab.label }}
|
||||
</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
<div class="pt-3">
|
||||
{{ include(template) }}
|
||||
</div>
|
||||
{% endblock body %}
|
||||
|
||||
@@ -0,0 +1,17 @@
|
||||
<div class="row">
|
||||
<div class="col-md-6 col-12">
|
||||
<div class="d-flex align-items-center mb-3">
|
||||
<h4 class="mb-0 pe-2">{{ 'Candidates'|trans }}</h4>
|
||||
<a class="link"
|
||||
href="{{ path('tvdt_backoffice_add_candidates', {seasonCode: season.seasonCode}) }}">{{ 'Add Candidate'|trans }}
|
||||
</a>
|
||||
</div>
|
||||
<ul class="mb-3">
|
||||
{% for candidate in season.candidates %}
|
||||
<li>{{ candidate.name }}</li>
|
||||
{% else %}
|
||||
{{ 'No candidates'|trans }}
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,109 @@
|
||||
<div class="d-flex align-items-center mb-3">
|
||||
<h4 class="mb-0 pe-2">{{ 'Question bank'|trans }}</h4>
|
||||
<a class="link" href="{{ path('tvdt_backoffice_question_bank_new', {seasonCode: season.seasonCode}) }}">{{ 'Add'|trans }}</a>
|
||||
</div>
|
||||
|
||||
<div class="d-flex align-items-center flex-wrap gap-2 mb-3">
|
||||
<a class="badge rounded-pill text-decoration-none{% if activeLabel is null %} text-bg-primary{% else %} text-bg-secondary{% endif %}"
|
||||
href="{{ path('tvdt_backoffice_question_bank', {seasonCode: season.seasonCode}) }}">{{ 'All'|trans }}</a>
|
||||
{% for label in season.questionLabels %}
|
||||
<span class="d-inline-flex align-items-center gap-1">
|
||||
<a class="badge rounded-pill text-decoration-none{% if activeLabel is same as (label) %} text-bg-primary{% else %} text-bg-secondary{% endif %}"
|
||||
href="{{ path('tvdt_backoffice_question_bank', {seasonCode: season.seasonCode, label: label.id}) }}">{{ label.name }}</a>
|
||||
<form action="{{ path('tvdt_backoffice_question_bank_label_delete', {seasonCode: season.seasonCode, label: label.id}) }}"
|
||||
method="POST" class="d-inline">
|
||||
<input type="hidden" name="_token" value="{{ csrf_token('delete_question_label') }}">
|
||||
<button type="submit" class="btn btn-sm btn-link p-0 text-danger" aria-label="{{ 'Remove label'|trans }}">×</button>
|
||||
</form>
|
||||
</span>
|
||||
{% endfor %}
|
||||
<form action="{{ path('tvdt_backoffice_question_bank_labels', {seasonCode: season.seasonCode}) }}"
|
||||
method="POST" class="d-inline-flex align-items-center gap-1">
|
||||
<input type="hidden" name="_token" value="{{ csrf_token('add_question_label') }}">
|
||||
<input type="text" class="form-control form-control-sm" name="name" maxlength="64"
|
||||
placeholder="{{ 'New label'|trans }}" required>
|
||||
<button type="submit" class="btn btn-sm btn-outline-primary">{{ 'Add label'|trans }}</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<table class="table align-middle">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>{{ 'Question'|trans }}</th>
|
||||
<th>{{ 'Labels'|trans }}</th>
|
||||
<th>{{ 'Reusable'|trans }}</th>
|
||||
<th>{{ 'Used in'|trans }}</th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for bankQuestion in bankQuestions %}
|
||||
<tr>
|
||||
<td>{{ bankQuestion.question }}</td>
|
||||
<td>
|
||||
{% for label in bankQuestion.labels %}
|
||||
<span class="badge rounded-pill text-bg-secondary">{{ label.name }}</span>
|
||||
{% endfor %}
|
||||
</td>
|
||||
<td>
|
||||
{% if bankQuestion.reusable %}
|
||||
<span class="badge text-bg-info">{{ 'Reusable'|trans }}</span>
|
||||
{% endif %}
|
||||
</td>
|
||||
<td>
|
||||
{{ bankQuestion.usages|map(usage => usage.quiz.name)|join(', ') }}
|
||||
</td>
|
||||
<td class="text-end">
|
||||
<div class="d-inline-flex align-items-center gap-2">
|
||||
{% if bankQuestion.canBeAssigned and assignableQuizzes|length > 0 %}
|
||||
<form action="{{ path('tvdt_backoffice_question_bank_assign', {seasonCode: season.seasonCode, bankQuestion: bankQuestion.id}) }}"
|
||||
method="POST" class="d-inline-flex align-items-center gap-1">
|
||||
<input type="hidden" name="_token" value="{{ csrf_token('assign_bank_question') }}">
|
||||
<select class="form-select form-select-sm" name="quiz" required>
|
||||
{% for quiz in assignableQuizzes %}
|
||||
<option value="{{ quiz.id }}">{{ quiz.name }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
<button type="submit" class="btn btn-sm btn-outline-primary">{{ 'Assign'|trans }}</button>
|
||||
</form>
|
||||
{% endif %}
|
||||
<a class="btn btn-sm btn-outline-secondary"
|
||||
href="{{ path('tvdt_backoffice_question_bank_edit', {seasonCode: season.seasonCode, bankQuestion: bankQuestion.id}) }}">{{ 'Edit'|trans }}</a>
|
||||
<button type="button" class="btn btn-sm btn-outline-danger" data-bs-toggle="modal"
|
||||
data-bs-target="#deleteBankQuestion-{{ bankQuestion.id }}">{{ 'Delete'|trans }}</button>
|
||||
</div>
|
||||
|
||||
<div class="modal fade" id="deleteBankQuestion-{{ bankQuestion.id }}" data-bs-backdrop="static"
|
||||
tabindex="-1" aria-labelledby="deleteBankQuestion-{{ bankQuestion.id }}Label" aria-hidden="true">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h1 class="modal-title fs-5" id="deleteBankQuestion-{{ bankQuestion.id }}Label">{{ 'Please Confirm'|trans }}</h1>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body text-start">
|
||||
{{ 'Are you sure you want to delete this question from the question bank?'|trans }}
|
||||
{% if bankQuestion.isUsed %}
|
||||
<br><strong>{{ 'This question has been used in a quiz. The copy in the quiz will not be affected.'|trans }}</strong>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">{{ 'No'|trans }}</button>
|
||||
<form action="{{ path('tvdt_backoffice_question_bank_delete', {seasonCode: season.seasonCode, bankQuestion: bankQuestion.id}) }}"
|
||||
method="POST">
|
||||
<input type="hidden" name="_token" value="{{ csrf_token('delete_bank_question') }}">
|
||||
<button type="submit" class="btn btn-danger">{{ 'Yes'|trans }}</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
{% else %}
|
||||
<tr>
|
||||
<td colspan="5">{{ 'No questions in the question bank yet'|trans }}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
@@ -0,0 +1,6 @@
|
||||
<div class="row">
|
||||
<div class="col-md-6 col-12">
|
||||
<h4 class="mb-3">{{ 'Settings'|trans }}</h4>
|
||||
{{ form(form) }}
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,22 @@
|
||||
<div class="row">
|
||||
<div class="col-md-6 col-12">
|
||||
<div class="d-flex align-items-center mb-3">
|
||||
<h4 class="mb-0 pe-2">{{ 'Quizzes'|trans }}</h4>
|
||||
<a class="link"
|
||||
href="{{ path('tvdt_backoffice_quiz_add', {seasonCode: season.seasonCode}) }}">{{ 'Add'|trans }}</a>
|
||||
</div>
|
||||
<div class="list-group mb-3">
|
||||
{% for quiz in season.quizzes %}
|
||||
<a class="list-group-item list-group-item-action{% if season.activeQuiz == quiz %} active{% endif %}"
|
||||
href="{{ path('tvdt_backoffice_quiz', {seasonCode: season.seasonCode, quiz: quiz.id}) }}">
|
||||
{{ quiz.name }}
|
||||
{% if quiz.isFinalized %}
|
||||
<span class="badge text-bg-success">{{ 'Finalized'|trans }}</span>
|
||||
{% endif %}
|
||||
</a>
|
||||
{% else %}
|
||||
{{ 'No quizzes'|trans }}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
Reference in New Issue
Block a user