infos statt fehler

components/fehler.svelte

@@ -1,21 +0,0 @@
-{#each fehler as f}
-{f}
-{/each}
-<script>
-  export let schueler, klasse, privat
-  const { Pool } = R('pg')
-  const pool = new Pool({ connectionString: privat.mein_bk_db})
-  let fehler = []
-  const update_fehler = async () => {
-    const query = `SELECT * FROM fehler`
-    try {
-      const res = await pool.query(query)
-      fehler = JSON.stringify(res.rows)
-      console.log(res.rows)
-    } catch(err) {
-      console.log(err.stack)
-    }
-  }
-  update_fehler()
-</script>
-

components/infos.svelte

@@ -0,0 +1,106 @@
+<div class="box">
+  <h4 class="title is-4">Neue Mitteilung erstellen</h4>
+  <div class="field">
+    <label class="label">Mitteilung</label>
+    <div class="control">
+      <textarea class="textarea" placeholder="Mitteilungstext" bind:value={neu.text}></textarea>
+    </div>
+  </div>
+  <div class="field">
+    <label class="label">Für Klassen</label>
+    <div class="control">
+      <input class="input" type="text" placeholder="z.B. C19A, B19b, ..." bind:value={neu.klasse}>
+    </div>
+  </div>
+  <div class="field">
+    <label class="label">Datum</label>
+    <div class="control">
+      <input class="input" type="text" disabled value={neu.timestamp}>
+    </div>
+  </div>
+  <div class="field is-grouped">
+    <div class="control">
+      <button class="button is-link" on:click={()=>save()}>Speichern</button>
+    </div>
+  </div>
+</div>
+
+<h4 class="title is-4">Bisherige Mitteilungen</h4>
+{#each info as i}
+  <div class="box">
+    <div class="field">
+      <label class="label">Mitteilung</label>
+      <div class="control">
+        <textarea class="textarea" placeholder="Mitteilungstext" bind:value={i.text}></textarea>
+      </div>
+    </div>
+    <div class="field">
+      <label class="label">Für Klassen</label>
+      <div class="control">
+        <input class="input" type="text" placeholder="z.B. C19A, B19b, ..." bind:value={i.klasse}>
+      </div>
+    </div>
+    <div class="field">
+      <label class="label">Datum</label>
+      <div class="control">
+        <input class="input" type="text" disabled value={i.timestamp}>
+      </div>
+    </div>
+  </div>
+  <div class="field is-grouped">
+    <div class="control">
+      <button class="button is-link" on:click={()=>update(i)}>Änderung speichern</button>
+    </div>
+    <div class="control">
+      <button class="button is-text" on:click={()=>remove(i.id)}>Löschen</button>
+    </div>
+  </div>
+{/each}
+
+<script>
+  export let privat
+  let neu = {}, info = []
+  const { Pool } = R('pg')
+  const pool = new Pool({ connectionString: privat.mein_bk_db})
+  const update = async i => {
+    const query = `UPDATE infos SET text = $1, klasse = $2, timestamp = $3 WHERE id = $4 RETURNING *`
+    const values = [i.text, i.klasse, new Date(), i.id]
+    try {
+      const res = await pool.query(query, values)
+      info = res.rows
+    } catch(err) {
+      console.log(err.stack)
+    }
+  }
+  const remove = async id => {
+    const query = `DELETE FROM infos WHERE id = $1 RETURNING *`
+    const values = [id]
+    try {
+      const res = await pool.query(query, values)
+      info = res.rows
+    } catch(err) {
+      console.log(err.stack)
+    }
+  }
+  const save = async () => {
+    const query = `INSERT INTO infos (text, klasse, timestamp) VALUES ($1, $2, $3) RETURNING *`
+    const values = [neu.text, neu.klasse, new Date()]
+    try {
+      const res = await pool.query(query, values)
+      info = res.rows
+    } catch(err) {
+      console.log(err.stack)
+    }
+  }
+  const get_infos = async () => {
+    const query = `SELECT * FROM infos`
+    try {
+      const res = await pool.query(query)
+      info = res.rows
+    } catch(err) {
+      console.log(err.stack)
+    }
+  }
+  get_infos()
+</script>
+

Übersicht.svelte

@@ -21,7 +21,7 @@
         <li class:is-active={active === ProjektwocheLehrer} on:click={() => active=ProjektwocheLehrer}>Projektwoche Lehrer</li>
         <li class:is-active={active === SVWahl} on:click={() => active=SVWahl}>SV-Wahl</li>
         <li class:is-active={active === Einstellungen} on:click={() => active=Einstellungen}>Einstellungen</li>
-        <li class:is-active={active === Fehler} on:click={() => active=Fehler}>Fehler</li>
+        <li class:is-active={active === Infos} on:click={() => active=Infos}>Infos</li>
       </ul>
     </div>
     <svelte:component this={active} schueler={schueler_filter} {privat} {einstellungen} {knexConfig}/>
@@ -59,7 +59,7 @@
   import ProjektwocheLehrer from './components/projektwoche-lehrer.svelte'
   import SVWahl from './components/svwahl.svelte'
   import Einstellungen from './components/einstellungen.svelte'
-  import Fehler from './components/fehler.svelte'
+  import Infos from './components/infos.svelte'
   export let schueler, knexConfig, privat
   let active
   let suche = ''