marek/creator
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
team3
2026-06-12 17:46:30 +02:00
parent 0ba708dc54
commit a7fd345bb6
8 changed files with 136 additions and 77 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
frontend/src/api.js
View File

@@ -66,18 +66,18 @@ export async function fetchBausteinLernstand(topic) {
return jsonOrThrow(res)
}
export async function fetchVertiefung(topic, baustein) {
export async function fetchVertiefung(topic, baustein, art = 'vertiefung') {
const res = await fetch(
`${BASE}/bausteine/vertiefung?topic=${encodeURIComponent(topic)}&baustein=${encodeURIComponent(baustein)}`
`${BASE}/bausteine/vertiefung?topic=${encodeURIComponent(topic)}&baustein=${encodeURIComponent(baustein)}&art=${art}`
)
return jsonOrThrow(res)
}
export async function createVertiefung({ topic, baustein, section, provider }) {
export async function createVertiefung({ topic, baustein, section, art = 'vertiefung', provider }) {
const res = await fetch(`${BASE}/bausteine/vertiefung`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ topic, baustein, section, provider }),
body: JSON.stringify({ topic, baustein, section, art, provider }),
})
return jsonOrThrow(res)
}

70
frontend/src/components/BausteinPanel.vue
View File

@@ -15,47 +15,50 @@ const props = defineProps({
const emit = defineEmits(['statusChanged'])
const NOETIG = 3
const st = computed(() => props.status || { gute_antworten: 0, absolviert: false, vertiefung: false })
const st = computed(() => props.status || { gute_antworten: 0, absolviert: false, vertiefung: false, deepdive: false })
// --- Toggle-Bereich ---
const activeTab = ref(null) // null | 'vertiefung' | 'chat' | 'pruefung'
const activeTab = ref(null) // null | 'vertiefung' | 'deepdive' | 'chat' | 'pruefung'
function toggle(tab) {
activeTab.value = activeTab.value === tab ? null : tab
if (activeTab.value === 'vertiefung') openVertiefung()
if (activeTab.value === 'vertiefung' || activeTab.value === 'deepdive') openText(activeTab.value)
if (activeTab.value === 'pruefung') startPruefung()
}
// --- Vertiefung (persistiert) ---
const vert = ref(null)
const vertLoading = ref(false)
const vertError = ref('')
// --- Vertiefung (kurz) + Deep Dive (lang), beide persistiert ---
const texte = ref({
vertiefung: { md: null, loading: false, error: '' },
deepdive: { md: null, loading: false, error: '' },
})
async function openVertiefung() {
if (vert.value !== null || vertLoading.value || !st.value.vertiefung) return
vertLoading.value = true
vertError.value = ''
async function openText(art) {
const t = texte.value[art]
if (t.md !== null || t.loading || !st.value[art]) return
t.loading = true
t.error = ''
try {
vert.value = (await fetchVertiefung(props.topic, props.baustein)).md
t.md = (await fetchVertiefung(props.topic, props.baustein, art)).md
} catch (e) {
vertError.value = e.message
t.error = e.message
} finally {
vertLoading.value = false
t.loading = false
}
}
async function generateVertiefung() {
vertLoading.value = true
vertError.value = ''
async function generateText(art) {
const t = texte.value[art]
t.loading = true
t.error = ''
try {
vert.value = (await createVertiefung({
topic: props.topic, baustein: props.baustein, section: props.section, provider: props.provider,
t.md = (await createVertiefung({
topic: props.topic, baustein: props.baustein, section: props.section, art, provider: props.provider,
})).md
emit('statusChanged', { ...st.value, vertiefung: true })
emit('statusChanged', { ...st.value, [art]: true })
} catch (e) {
vertError.value = e.message
t.error = e.message
} finally {
vertLoading.value = false
t.loading = false
}
}
@@ -109,6 +112,9 @@ async function startPruefung() {
<button :class="{ active: activeTab === 'vertiefung' }" @click="toggle('vertiefung')">
Vertiefung
</button>
<button :class="{ active: activeTab === 'deepdive' }" @click="toggle('deepdive')">
Deep Dive
</button>
<button :class="{ active: activeTab === 'chat' }" @click="toggle('chat')">
Chat
</button>
@@ -120,18 +126,20 @@ async function startPruefung() {
</div>
<div v-if="activeTab" class="bp-panel">
<!-- Vertiefung -->
<div v-if="activeTab === 'vertiefung'">
<p v-if="vertLoading" class="bp-hint">{{ vert === null ? 'Generiere Vertiefung…' : 'Lade…' }}</p>
<template v-else-if="vert">
<div class="markdown" v-html="renderMarkdown(vert)"></div>
<button class="bp-action" @click="generateVertiefung">Neu generieren</button>
<!-- Vertiefung (kurz) / Deep Dive (lang) -->
<div v-if="activeTab === 'vertiefung' || activeTab === 'deepdive'">
<p v-if="texte[activeTab].loading" class="bp-hint">{{ texte[activeTab].md === null ? 'Generiere…' : 'Lade…' }}</p>
<template v-else-if="texte[activeTab].md">
<div class="markdown" v-html="renderMarkdown(texte[activeTab].md)"></div>
<button class="bp-action" @click="generateText(activeTab)">Neu generieren</button>
</template>
<template v-else>
<p class="bp-hint">Noch keine Vertiefung zu diesem Baustein.</p>
<button class="bp-action" @click="generateVertiefung">Vertiefung generieren</button>
<p class="bp-hint">{{ activeTab === 'deepdive' ? 'Noch kein Deep Dive zu diesem Baustein.' : 'Noch keine Vertiefung zu diesem Baustein.' }}</p>
<button class="bp-action" @click="generateText(activeTab)">
{{ activeTab === 'deepdive' ? 'Deep Dive generieren' : 'Vertiefung generieren' }}
</button>
</template>
<p v-if="vertError" class="bp-error">{{ vertError }}</p>
<p v-if="texte[activeTab].error" class="bp-error">{{ texte[activeTab].error }}</p>
</div>
<!-- Bausteinchat -->