meinbk-admin/Übersicht.svelte

<section class="section">
  <div class="container">
    <h1 class="title">Mein BK</h1>
    <div>
      <span class="tag is-success" on:click={()=>hole_lokale_schueler()} style="cursor: pointer;">
        {schueler_lokal.length} Schüler in der Datenbank
      </span>
    </div>
    <br>
    <div class="field">
      <div class="control">
        <input class="input" type="text" placeholder="Filter" bind:value={suche}>
      </div>
    </div>
  </div>
  <div class="container">
    <div class="tabs">
      <ul>
        <li class:is-active={active === Vouchers}><a on:click={() => active=Vouchers}>WLAN</a></li>
        <li class:is-active={active === ProjektwocheSchueler}><a on:click={() => active=ProjektwocheSchueler}>Projektwoche Schüler</a></li>
        <li class:is-active={active === ProjektwocheLehrer}><a on:click={() => active=ProjektwocheLehrer}>Projektwoche Lehrer</a></li>
        <li class:is-active={active === ProjektwocheUebersicht}><a on:click={() => active=ProjektwocheUebersicht}>Projektwoche Übersicht</a></li>
        <li class:is-active={active === SVWahl}><a on:click={() => active=SVWahl}>SV-Wahl</a></li>
      </ul>
    </div>
    <svelte:component this={active} schueler={schueler_filter} {privat} {einstellungen} {knexConfig}/>
  </div>
</section>

<style>
  @import 'node_modules/bulma/css/bulma.css';
</style>

<script>
  import Vouchers from './components/vouchers.svelte'
  import ProjektwocheSchueler from './components/projektwoche-schueler.svelte'
  import ProjektwocheLehrer from './components/projektwoche-lehrer.svelte'
  import ProjektwocheUebersicht from './components/projektwoche-uebersicht.svelte'
  import SVWahl from './components/svwahl.svelte'
  export let schueler, knexConfig, privat
  let active
  let suche = ''

  const { Pool } = R('pg')
  const _ = R('lodash')
  const mysql = R('mysql')
  let schueler_entfernt = [], schueler_lokal = []
  let einstellungen
  const postgres = new Pool({ connectionString: privat.mein_bk_db})
  postgres.query(`SELECT * FROM einstellungen`)
    .then(res => {
      einstellungen = res.rows[0]
      einstellungen || postgres.query(`INSERT INTO einstellungen DEFAULT VALUES RETURNING *`)
        .then(res => einstellungen = res.rows[0])
    })
  postgres.query(`SELECT schueler.*,
                    wlan.voucher,
                    wahlen.*
              FROM schueler
              LEFT JOIN wlan ON schueler.id = wlan.schueler_id
              LEFT JOIN wahlen ON schueler.id = wahlen.schueler_id`)
        .then(resp => {
          schueler_entfernt = resp.rows
        })
  const mysql_connection = mysql.createConnection(knexConfig.connection)
  mysql_connection.connect()
  function hole_lokale_schueler () {
    mysql_connection.query(`SELECT ID AS id, Name, Vorname, Klasse,
                              CONCAT (LOWER (Vorname), ' ', LOWER (Name)) AS vollname
                            FROM schueler
                            WHERE Status = 2 AND Geloescht = "-" AND Gesperrt = "-"
                            ORDER BY Klasse, Name ASC`,
      (e, res) => {
        schueler_lokal = res
      })
  }
  hole_lokale_schueler()
  $: merged = schueler_lokal.map(itm => ({
      ...schueler_entfernt.find((item) => (item.id === itm.id) && item),
      ...itm}))
  $: schueler_filter = _.groupBy(merged.filter(s => s.vollname.includes(suche.toLowerCase())), 'Klasse')
</script>