Display an icon when data are transmitted

This commit is contained in:
nemunaire 2022-09-02 13:35:16 +02:00
parent 24f0e82571
commit 967e3ae79d

View File

@ -130,11 +130,15 @@
} }
wsconnect(); wsconnect();
let displaySendInProgress = false;
function sendValue() { function sendValue() {
if (show_question && value && !nosend) { if (show_question && value && !nosend) {
displaySendInProgress = true;
survey.submitAnswers([{"id_question": show_question, "value": value}], $user.id_user).then((response) => { survey.submitAnswers([{"id_question": show_question, "value": value}], $user.id_user).then((response) => {
setTimeout(() => displaySendInProgress = false, 150);
console.log("Vos réponses ont bien étés sauvegardées."); console.log("Vos réponses ont bien étés sauvegardées.");
}, (error) => { }, (error) => {
displaySendInProgress = false;
value = null; value = null;
ToastsStore.addErrorToast({ ToastsStore.addErrorToast({
msg: "Une erreur s'est produite durant l'envoi de vos réponses : " + error + "\nVeuillez réessayer dans quelques instants.", msg: "Une erreur s'est produite durant l'envoi de vos réponses : " + error + "\nVeuillez réessayer dans quelques instants.",
@ -177,6 +181,17 @@
</script> </script>
{#await surveyP then unused} {#await surveyP then unused}
<div
style={"transition: opacity 150ms ease-out; opacity: " + (displaySendInProgress?1:0)}
class="ms-2 float-end"
>
<div style="position: relative; left: 25%; top: 4px">
<div style="position: absolute">
<i class="bi bi-save"></i>
</div>
</div>
<div class="spinner-border text-primary" role="status"></div>
</div>
{#if $user && $user.is_admin} {#if $user && $user.is_admin}
<a href="surveys/{survey.id}/admin" class="btn btn-primary ms-1 float-end" title="Aller à l'interface d'administration"><i class="bi bi-pencil"></i></a> <a href="surveys/{survey.id}/admin" class="btn btn-primary ms-1 float-end" title="Aller à l'interface d'administration"><i class="bi bi-pencil"></i></a>
<a href="surveys/{survey.id}/responses" class="btn btn-success ms-1 float-end" title="Voir les réponses"><i class="bi bi-files"></i></a> <a href="surveys/{survey.id}/responses" class="btn btn-success ms-1 float-end" title="Voir les réponses"><i class="bi bi-files"></i></a>