teach/atsebay.t
Archived
1
0
Fork 0
Code Issues Pull Requests Releases Activity

New view to aggregate survey responses
All checks were successful
continuous-integration/drone/push Build is passing
Details

Browse Source
This commit is contained in:
nemunaire 2022-11-26 16:03:20 +01:00
parent 4be5503af9
commit 0cab193d6c
1 changed files with 74 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

117
ui/src/routes/surveys/[sid]/responses/index.svelte
View File

@ -1,4 +1,5 @@
<script context="module">
import CorrectionPieChart from '$lib/components/CorrectionPieChart.svelte';
import { getSurvey } from '$lib/surveys';
import { getUsers } from '$lib/users';
@ -27,6 +28,7 @@
usersP = getUsers(s.promo, s.group);
})
let edit = false;
let exportview = false;
</script>
{#await surveyP then survey}
@ -37,12 +39,19 @@
class="ms-1 float-end"
on:update={() => goto(`surveys/${survey.id}/admin`)}
/>
<button
class="btn ms-1 float-end"
class:btn-dark={exportview}
class:btn-outline-dark={!exportview}
title="Éditer"
on:click={() => { exportview = !exportview; } }
><i class="bi bi-activity"></i></button>
{/if}
<div class="d-flex align-items-center">
<h2>
<a href="surveys/{survey.id}" class="text-muted" style="text-decoration: none">&lt;</a>
{survey.title}
<small class="text-muted">Corrections</small>
<small class="text-muted">{#if exportview}Réponses{:else}Corrections{/if}</small>
</h2>
<SurveyBadge class="ms-2" {survey} />
</div>
@ -57,49 +66,71 @@
<span>Chargement des questions &hellip;</span>
</div>
{:then questions}
<div class="card mt-3 mb-5">
<table class="table table-hover table-striped mb-0">
<thead>
<tr>
<th>Question</th>
<th>Réponses</th>
<th>Moyenne</th>
</tr>
</thead>
<tbody ng-controller="SurveyGradesController">
{#each questions as question (question.id)}
{#if !exportview}
<div class="card mt-3 mb-5">
<table class="table table-hover table-striped mb-0">
<thead>
<tr>
<td><a href="surveys/{survey.id}/responses/{question.id}">{question.title}</a></td>
{#await question.getResponses()}
<td colspan="2" class="text-center">
<div class="spinner-border mx-3" role="status"></div>
<span>Chargement &hellip;</span>
</td>
{:then responses}
<td>
{#if responses}
{responses.filter((r) => !r.time_scored || (r.time_reported && r.time_reported >= r.time_scored)).length} /
{responses.length}
{#await usersP then users}
<br>
{Math.trunc(responses.length/users.length*1000)/10}&nbsp;%
{/await}
{:else}
0
{/if}
</td>
<td>
{#if responses && responses.filter((r) => r.time_scored).length}
{Math.trunc(responses.reduce((p, c) => (p + (c.score?c.score:0)), 0)/responses.filter((r) => r.time_scored).length*10)/10}&nbsp;%
{:else}
--&nbsp;%
{/if}
</td>
{/await}
<th>Question</th>
<th>Réponses</th>
<th>Moyenne</th>
</tr>
{/each}
</tbody>
</table>
</div>
</thead>
<tbody ng-controller="SurveyGradesController">
{#each questions as question (question.id)}
<tr>
<td><a href="surveys/{survey.id}/responses/{question.id}">{question.title}</a></td>
{#await question.getResponses()}
<td colspan="2" class="text-center">
<div class="spinner-border mx-3" role="status"></div>
<span>Chargement &hellip;</span>
</td>
{:then responses}
<td>
{#if responses}
{responses.filter((r) => !r.time_scored || (r.time_reported && r.time_reported >= r.time_scored)).length} /
{responses.length}
{#await usersP then users}
<br>
{Math.trunc(responses.length/users.length*1000)/10}&nbsp;%
{/await}
{:else}
0
{/if}
</td>
<td>
{#if responses && responses.filter((r) => r.time_scored).length}
{Math.trunc(responses.reduce((p, c) => (p + (c.score?c.score:0)), 0)/responses.filter((r) => r.time_scored).length*10)/10}&nbsp;%
{:else}
--&nbsp;%
{/if}
</td>
{/await}
</tr>
{/each}
</tbody>
</table>
</div>
{:else}
{#each questions as question (question.id)}
<h3>{question.title}</h3>
{#if question.kind == "text"}
{#await question.getResponses() then responses}
{#each responses as response (response.id)}
<div class="card mb-2">
<div class="card-body">
<p class="card-text" style:white-space="pre-line">
{response.value}
</p>
</div>
</div>
{/each}
{/await}
{:else}
<CorrectionPieChart {question} />
{/if}
<hr class="mb-3">
{/each}
{/if}
{/await}
{/await}