meinbk-admin/components/svwahl.svelte

<div class="field is-horizontal">
  <div class="field-body">
    <div class="field">
      <p class="control is-expanded has-icons-left">
        <label class="label is-small">Beginn der SV-Wahl</label>
        <input type="datetime-local" bind:value={wahlbeginn_sv} class="input is-small">
      </p>
    </div>
    <div class="field">
      <p class="control is-expanded has-icons-left">
        <label class="label is-small">Ende der SV-Wahl</label>
        <input type="datetime-local" bind:value={wahlende_sv} class="input is-small">
      </p>
    </div>
  </div>
</div>
<div class="field">
  <p class="control is-expanded has-icons-left">
    <label class="label is-small">Datum der ersten Schulkonferenz</label>
    <input type="datetime-local" bind:value={erste_schuko} class="input is-small">
  </p>
</div>
<div class="field">
  <button class="is-small button is-default" on:click={changeDate}> Wahlzeitraum ändern </button>
  {#if check}<span class="tag is-success">✓</span>{/if}
</div>

<div class="columns">
  <div class="column is-two-thirds">
    {#each Object.entries(schueler) as [klasse, schuelers]}
      <h3 class="title">{klasse}</h3>
      <table class="table is-striped">
        <thead>
          <tr>
            <th>ID</th>
            <th>Name</th>
            <th>Vorname</th>
            <th>Wahlstatus</th>
          </tr>
        </thead>
        <tbody>
          {#each schuelers as s,i}
            <tr>
              <td>{s.hashid}</td>
              <td>{s.Name}</td>
              <td>{s.Vorname}</td>
              <td class:has-background-success={s.schuko||s.sprecher}>
                Schuko: <input checked={s.schuko} type="checkbox" on:click={()=>check_aktiv(s, 'schuko')}>
                Sprecher: <input checked={s.sprecher} type="checkbox" on:click={()=>check_aktiv(s, 'sprecher')}>
              </td>
            </tr>
          {/each}
        </tbody>
      </table>
    {/each}
  </div>
</div>
<script>
  export let schueler, privat, einstellungen
  let check
  const { Pool } = R('pg')
  const pool = new Pool({ connectionString: privat.mein_bk_db})
  $: wahlbeginn_sv = wahlbeginn_sv || setDateTime(einstellungen.wahlbeginn_sv)
  $: wahlende_sv = wahlende_sv || setDateTime(einstellungen.wahlende_sv)
  $: erste_schuko = erste_schuko || setDateTime(einstellungen.erste_schuko)
  const changeDate = async _ => {
    const query = `UPDATE einstellungen
                   SET wahlbeginn_sv=$1, wahlende_sv=$2, erste_schuko=$3
                   RETURNING wahlbeginn_sv, wahlende_sv, erste_schuko`
    const values=[new Date(wahlbeginn_sv), new Date(wahlende_sv), new Date(erste_schuko)]
    try {
      const res = await pool.query(query, values)
      const data = res.rows[0]
      einstellungen.wahlbeginn_sv = data.wahlbeginn_sv
      einstellungen.wahlende_sv = data.wahlende_sv
      einstellungen.erste_schuko = data.erste_schuko
      einstellungen = einstellungen
      check = true
    } catch(err) {
      console.log(err.stack)
    }
  }
  const check_aktiv = async (s, art) => {
    const query = `UPDATE schueler SET ${art}=$1
                   WHERE hashid=$2
                   RETURNING ${art}`
    const values=[!s.schuko, s.hashid]
    try {
      const res = await pool.query(query, values)
      console.log(res)
      const data = res.rows[0]
      s[art] = data[art]
      schueler = schueler
    } catch(err) {
      console.log(err.stack)
    }
  }
  function setDateTime (date) {
    if (!date) return
    const d = new Date(date)
    return d.toISOString().replace('Z','')
  };
</script>