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

ui: Use $lib in imports

Browse source
This commit is contained in:
nemunaire 2022-11-18 15:38:50 +01:00
commit d6f620bc0d
54 changed files with 146 additions and 146 deletions
Download patch file Download diff file Expand all files Collapse all files

134
ui/src/lib/components/QuestionProposals.svelte Normal file
View file

@ -0,0 +1,134 @@
<script>
import { createEventDispatcher } from 'svelte';
import { QuestionProposal } from '$lib/questions';
export let edit = false;
export let proposals = [];
export let live = false;
export let kind = 'mcq';
export let prefixid = '';
export let readonly = false;
export let corrections = null;
export let id_question = 0;
export let value;
let valueCheck = [];
$: {
if (value) {
valueCheck = value.split(',');
}
}
const dispatch = createEventDispatcher();
function addProposal() {
const p = new QuestionProposal();
p.id_question = id_question;
proposals.push(p);
proposals = proposals;
}
</script>
<div class:d-flex={live} class:justify-content-around={live}>
{#each proposals as proposal, pid (proposal.id)}
<div class="form-check">
{#if kind == 'mcq'}
<input
type="checkbox"
class:btn-check={live}
class:form-check-input={!live}
disabled={readonly}
name={prefixid + 'proposal' + proposal.id_question}
id={prefixid + 'p' + proposal.id}
bind:group={valueCheck}
value={proposal.id?proposal.id.toString():''}
on:change={() => { value = valueCheck.join(','); dispatch("change"); }}
>
{:else}
<input
type="radio"
class:btn-check={live}
class:form-check-input={!live}
disabled={readonly}
name={prefixid + 'proposal' + proposal.id_question}
id={prefixid + 'p' + proposal.id}
bind:group={value}
value={proposal.id?proposal.id.toString():''}
on:change={() => { dispatch("change"); }}
>
{/if}
{#if edit}
<form on:submit|preventDefault={() => { proposal.save().then(() => proposal = proposal); } }>
<div class="input-group input-group-sm mb-2">
<input
type="text"
class="form-control"
bind:value={proposal.label}
on:input={() => proposal.changed = true}
>
<button
type="button"
class="btn btn-outline-danger"
tabindex="-1"
disabled={!proposal.id}
on:click={() => { proposal.delete().then(() => { proposals.splice(pid, 1); proposals = proposals; }); }}
>
<i class="bi bi-trash"></i>
</button>
<button
type="submit"
class="btn"
class:btn-success={proposal.changed}
class:btn-outline-success={!proposal.changed}
disabled={!proposal.changed}
>
<i class="bi bi-check"></i>
</button>
</div>
</form>
{:else}
<label
class:form-check-label={!live}
class:btn={live}
class:btn-lg={live}
class:btn-primary={live && !corrections && value && value.indexOf(proposal.id.toString()) != -1}
class:btn-outline-primary={live && !corrections && (!value || value.indexOf(proposal.id.toString()) == -1)}
class:btn-success={live && corrections && corrections[proposal.id] == 0}
class:btn-warning={live && corrections && corrections[proposal.id] != 0 && corrections[proposal.id] != -100 && value && value.indexOf(proposal.id.toString()) != -1}
class:btn-danger={live && corrections && corrections[proposal.id] == -100 && value && value.indexOf(proposal.id.toString()) != -1}
class:btn-outline-warning={live && corrections && corrections[proposal.id] != 0 && corrections[proposal.id] != -100 && (!value || value.indexOf(proposal.id.toString()) == -1)}
class:btn-outline-danger={live && corrections && corrections[proposal.id] == -100 && (!value || value.indexOf(proposal.id.toString()) == -1)}
for={prefixid + 'p' + proposal.id}
>
{proposal.label}
</label>
{/if}
</div>
{/each}
</div>
{#if edit}
{#if kind == 'mcq'}
<input
type="checkbox"
class="form-check-input"
disabled
checked
>
{:else}
<input
type="radio"
class="form-check-input"
disabled
checked
>
{/if}
<button
type="button"
class="btn btn-sm btn-link"
disabled={proposals.length > 0 && !proposals[proposals.length-1].id}
on:click={addProposal}
>
ajouter
</button>
{/if}