This repository has been archived on 2024-03-28. You can view files and clone it, but cannot push or open issues or pull requests.
atsebay.t/atsebayt/src/components/SurveyAdmin.svelte

135 lines
4.5 KiB
Svelte

<script>
import { createEventDispatcher } from 'svelte';
import { goto } from '$app/navigation';
import { getQuestions } from '../lib/questions';
import { ToastsStore } from '../stores/toasts';
const dispatch = createEventDispatcher();
export let survey = null;
function saveSurvey() {
survey.save().then((response) => {
dispatch('saved');
}, (error) => {
ToastsStore.addErrorToast({
msg: error.errmsg,
});
})
}
function deleteSurvey() {
survey.delete().then((response) => {
goto(`surveys`);
}, (error) => {
ToastsStore.addErrorToast({
msg: error.errmsg,
});
})
}
function duplicateSurvey() {
survey.duplicate().then((response) => {
goto(`surveys/${response.id}`);
}).catch((error) => {
ToastsStore.addErrorToast({
msg: error.errmsg,
});
})
}
</script>
<form on:submit|preventDefault={saveSurvey}>
<div class="row">
<div class="col-sm-3 text-sm-end">
<label for="title" class="col-form-label col-form-label-sm">Titre du questionnaire</label>
</div>
<div class="col-sm-8">{survey.id}
<input type="text" class="form-control form-control-sm" id="title" bind:value={survey.title}>
</div>
</div>
<div class="row">
<div class="col-sm-3 text-sm-end">
<label for="promo" class="col-form-label col-form-label-sm">Promo</label>
</div>
<div class="col-sm-8 col-md-4 col-lg-2">
<input type="number" step="1" min="0" max="2068" class="form-control form-control-sm" id="promo" bind:value={survey.promo}>
</div>
</div>
<div class="row">
<div class="col-sm-3 text-sm-end">
<label for="group" class="col-form-label col-form-label-sm">Restreindre au groupe</label>
</div>
<div class="col-sm-8 col-md-4 col-lg-2">
<input class="form-control form-control-sm" id="group" bind:value={survey.group}>
</div>
</div>
<div class="row">
<div class="col-sm-3 text-sm-end">
<label for="direct" class="col-form-label col-form-label-sm">Question en direct</label>
</div>
<div class="col-sm-8">
{#await getQuestions(survey.id) then questions}
<select id="direct" class="form-select form-select-sm" bind:value={survey.direct}>
<option value={null}>Pas de direct</option>
<option value={0}>Pause</option>
{#each questions as question (question.id)}
<option value={question.id}>{question.id} - {question.title}</option>
{/each}
</select>
{/await}
</div>
</div>
<div class="row">
<div class="col-sm-3 text-sm-end">
<label for="start_availability" class="col-form-label col-form-label-sm">Date de début</label>
</div>
<div class="col-sm-8">
<input type="text" class="form-control form-control-sm" id="start_availability" bind:value={survey.start_availability}>
</div>
</div>
<div class="row">
<div class="col-sm-3 text-sm-end">
<label for="end_availability" class="col-form-label col-form-label-sm">Date de fin</label>
</div>
<div class="col-8">
<input type="text" class="form-control form-control-sm" id="end_availability" bind:value={survey.end_availability}>
</div>
</div>
<div class="row row-cols-3 mx-1 my-2">
<div class="form-check">
<input class="form-check-input" type="checkbox" id="shown" bind:checked={survey.shown}>
<label class="form-check-label" for="shown">
Afficher le questionnaire
</label>
</div>
<div class="form-check">
<input class="form-check-input" type="checkbox" id="corrected" bind:checked={survey.corrected}>
<label class="form-check-label" for="corrected">
Marqué comme corrigé
</label>
</div>
</div>
<div class="form-group row">
<div class="col-sm-10">
<button type="submit" class="btn btn-primary">Enregistrer</button>
{#if survey.id}
<button type="button" class="btn btn-danger" on:click={deleteSurvey}>Supprimer</button>
<button type="button" class="btn btn-secondary" on:click={duplicateSurvey}>Dupliquer avec ces nouveaux paramètres</button>
{/if}
</div>
</div>
</form>
<hr>