2022-02-28 09:52:27 +00:00
|
|
|
<script context="module">
|
2022-11-26 15:03:20 +00:00
|
|
|
import CorrectionPieChart from '$lib/components/CorrectionPieChart.svelte';
|
2022-11-18 14:38:50 +00:00
|
|
|
import { getSurvey } from '$lib/surveys';
|
|
|
|
import { getUsers } from '$lib/users';
|
2022-02-28 09:52:27 +00:00
|
|
|
|
|
|
|
export async function load({ params, stuff }) {
|
|
|
|
return {
|
|
|
|
props: {
|
|
|
|
surveyP: stuff.survey,
|
|
|
|
},
|
|
|
|
};
|
|
|
|
}
|
|
|
|
</script>
|
|
|
|
|
|
|
|
<script lang="ts">
|
2022-09-10 18:05:47 +00:00
|
|
|
import { goto } from '$app/navigation';
|
|
|
|
|
2022-11-18 14:38:50 +00:00
|
|
|
import { user } from '$lib/stores/user';
|
|
|
|
import StartStopLiveSurvey from '$lib/components/StartStopLiveSurvey.svelte';
|
|
|
|
import SurveyAdmin from '$lib/components/SurveyAdmin.svelte';
|
|
|
|
import SurveyBadge from '$lib/components/SurveyBadge.svelte';
|
|
|
|
import SurveyQuestions from '$lib/components/SurveyQuestions.svelte';
|
|
|
|
import { getQuestions } from '$lib/questions';
|
2022-02-28 09:52:27 +00:00
|
|
|
|
|
|
|
export let surveyP;
|
2022-09-20 17:54:53 +00:00
|
|
|
let usersP = null;
|
|
|
|
surveyP.then((s) => {
|
|
|
|
usersP = getUsers(s.promo, s.group);
|
|
|
|
})
|
2022-09-16 08:56:18 +00:00
|
|
|
let edit = false;
|
2022-11-26 15:03:20 +00:00
|
|
|
let exportview = false;
|
2022-11-27 23:32:09 +00:00
|
|
|
let exportview_list = false;
|
2022-12-02 10:48:10 +00:00
|
|
|
|
|
|
|
let sharing_link = null;
|
|
|
|
async function shareResults(survey) {
|
|
|
|
const res = await survey.share();
|
|
|
|
sharing_link = res;
|
|
|
|
|
|
|
|
const modal = new bootstrap.Modal(document.getElementById('shareModal'));
|
|
|
|
modal.show();
|
|
|
|
}
|
2022-02-28 09:52:27 +00:00
|
|
|
</script>
|
|
|
|
|
|
|
|
{#await surveyP then survey}
|
2022-09-16 08:56:18 +00:00
|
|
|
{#if $user && $user.is_admin}
|
|
|
|
<button class="btn btn-primary ms-1 float-end" on:click={() => { edit = !edit; } } title="Éditer"><i class="bi bi-pencil"></i></button>
|
|
|
|
<StartStopLiveSurvey
|
|
|
|
{survey}
|
|
|
|
class="ms-1 float-end"
|
|
|
|
on:update={() => goto(`surveys/${survey.id}/admin`)}
|
|
|
|
/>
|
2022-12-02 10:48:10 +00:00
|
|
|
<button
|
|
|
|
class="btn btn-outline-dark ms-1 float-end"
|
|
|
|
title="Partager les résultats"
|
|
|
|
on:click={() => shareResults(survey)}
|
|
|
|
><i class="bi bi-share-fill"></i></button>
|
2022-11-26 15:03:20 +00:00
|
|
|
<button
|
|
|
|
class="btn ms-1 float-end"
|
|
|
|
class:btn-dark={exportview}
|
|
|
|
class:btn-outline-dark={!exportview}
|
2022-11-27 23:32:09 +00:00
|
|
|
title="Afficher les graphiques"
|
2022-11-26 15:03:20 +00:00
|
|
|
on:click={() => { exportview = !exportview; } }
|
|
|
|
><i class="bi bi-activity"></i></button>
|
2022-11-27 23:32:09 +00:00
|
|
|
{#if exportview}
|
|
|
|
<button
|
|
|
|
class="btn ms-1 float-end"
|
|
|
|
class:btn-dark={exportview_list}
|
|
|
|
class:btn-outline-dark={!exportview_list}
|
|
|
|
title="Traiter les listes comme des textes : ne pas chercher à les regrouper sous un diagramme"
|
|
|
|
on:click={() => { exportview_list = !exportview_list; } }
|
|
|
|
><i class="bi bi-view-list"></i></button>
|
|
|
|
{/if}
|
2022-09-16 08:56:18 +00:00
|
|
|
{/if}
|
2022-02-28 09:52:27 +00:00
|
|
|
<div class="d-flex align-items-center">
|
|
|
|
<h2>
|
|
|
|
<a href="surveys/{survey.id}" class="text-muted" style="text-decoration: none"><</a>
|
|
|
|
{survey.title}
|
2022-11-26 15:03:20 +00:00
|
|
|
<small class="text-muted">{#if exportview}Réponses{:else}Corrections{/if}</small>
|
2022-02-28 09:52:27 +00:00
|
|
|
</h2>
|
|
|
|
<SurveyBadge class="ms-2" {survey} />
|
|
|
|
</div>
|
|
|
|
|
2022-09-16 08:56:18 +00:00
|
|
|
{#if $user && $user.is_admin && edit}
|
|
|
|
<SurveyAdmin {survey} on:saved={() => edit = false} />
|
|
|
|
{/if}
|
|
|
|
|
2022-02-28 09:52:27 +00:00
|
|
|
{#await getQuestions(survey.id)}
|
|
|
|
<div class="text-center">
|
|
|
|
<div class="spinner-border text-primary mx-3" role="status"></div>
|
|
|
|
<span>Chargement des questions …</span>
|
|
|
|
</div>
|
|
|
|
{:then questions}
|
2022-11-26 15:03:20 +00:00
|
|
|
{#if !exportview}
|
|
|
|
<div class="card mt-3 mb-5">
|
|
|
|
<table class="table table-hover table-striped mb-0">
|
|
|
|
<thead>
|
2022-09-20 17:47:32 +00:00
|
|
|
<tr>
|
2022-11-26 15:03:20 +00:00
|
|
|
<th>Question</th>
|
|
|
|
<th>Réponses</th>
|
|
|
|
<th>Moyenne</th>
|
2022-02-28 09:52:27 +00:00
|
|
|
</tr>
|
2022-11-26 15:03:20 +00:00
|
|
|
</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 …</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} %
|
|
|
|
{/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} %
|
|
|
|
{:else}
|
|
|
|
-- %
|
|
|
|
{/if}
|
|
|
|
</td>
|
|
|
|
{/await}
|
|
|
|
</tr>
|
|
|
|
{/each}
|
|
|
|
</tbody>
|
|
|
|
</table>
|
|
|
|
</div>
|
|
|
|
{:else}
|
|
|
|
{#each questions as question (question.id)}
|
|
|
|
<h3>{question.title}</h3>
|
2022-11-27 23:32:09 +00:00
|
|
|
{#if question.kind == "text" || (exportview_list && question.kind.indexOf("list") == 0)}
|
2022-11-26 15:03:20 +00:00
|
|
|
{#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}
|
2022-02-28 09:52:27 +00:00
|
|
|
{/await}
|
|
|
|
{/await}
|
2022-12-02 10:48:10 +00:00
|
|
|
|
|
|
|
<div class="modal fade" tabindex="-1" id="shareModal">
|
|
|
|
<div class="modal-dialog">
|
|
|
|
<div class="modal-content">
|
|
|
|
<div class="modal-header">
|
|
|
|
<h5 class="modal-title">Partage de résultats</h5>
|
|
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
|
|
</div>
|
|
|
|
<div class="modal-body">
|
|
|
|
<p>
|
|
|
|
Voici le lien de partage des résultats de ce sondage :
|
|
|
|
</p>
|
|
|
|
<pre>{sharing_link}</pre>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|