update

2026-06-14 14:55:44 +02:00
parent 2b89e21cd3
commit 143e6d6f7c
7 changed files with 108 additions and 41 deletions
--- a/frontend/src/api.js
+++ b/frontend/src/api.js
@@ -93,12 +93,12 @@ export async function chatBaustein({ topic, baustein, section, messages, provide

 export async function pruefeBaustein({
  topic, baustein, section, provider,
-  aktion = 'frage', frage = '', letzte_bewertung = '', frage_schon_gut = false, messages = [],
+  aktion = 'frage', frage = '', letzte_bewertung = '', score_vor_frage = 0, tier2 = false, messages = [],
 }) {
  const res = await fetch(`${BASE}/bausteine/pruefung`, {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
-    body: JSON.stringify({ topic, baustein, section, aktion, frage, letzte_bewertung, frage_schon_gut, messages, provider }),
+    body: JSON.stringify({ topic, baustein, section, aktion, frage, letzte_bewertung, score_vor_frage, tier2, messages, provider }),
  })
  return jsonOrThrow(res)
 }
--- a/frontend/src/components/BausteinPanel.vue
+++ b/frontend/src/components/BausteinPanel.vue
@@ -9,13 +9,15 @@ const props = defineProps({
  baustein: { type: String, required: true },
  section: { type: String, default: '' },
  provider: { type: String, default: 'claude' },
-  status: { type: Object, default: null }, // {gute_antworten, absolviert, vertiefung}
+  status: { type: Object, default: null }, // {gute_antworten, absolviert, verstanden, vertiefung}
+  tier2: { type: Boolean, default: false }, // Mastery frei (ganzer Guide absolviert)
 })

 const emit = defineEmits(['statusChanged'])

-const NOETIG = 3
-const st = computed(() => props.status || { gute_antworten: 0, absolviert: false, vertiefung: false, deepdive: false })
+const NOETIG = 3   // absolviert
+const MAX = 10     // verstanden
+const st = computed(() => props.status || { gute_antworten: 0, absolviert: false, verstanden: false, vertiefung: false, deepdive: false })

 // --- Toggle-Bereich ---
 const activeTab = ref(null) // null | 'vertiefung' | 'deepdive' | 'chat' | 'pruefung'
@@ -75,13 +77,13 @@ const pruefPhase = ref('idle')
 const pruefLoading = ref(false)
 const aktuelleFrage = ref('')    // ankert Bewertung/Diskussion
 const letztesFeedback = ref('')  // Kontext für die Diskussion über eine Bewertung
-const frageSchonGut = ref(false) // diese Frage schon "gut" → nicht doppelt zählen
+const scoreVorFrage = ref(0)     // Score, als die aktuelle Frage gestellt wurde → driftfreies (Re-)Bewerten
 const pruefMessagesEl = ref(null)
 const pruefInputEl = ref(null)
 let pruefRun = 0

 function applyPruefung(res) {
-  emit('statusChanged', { ...st.value, gute_antworten: res.gute_antworten, absolviert: res.absolviert })
+  emit('statusChanged', { ...st.value, gute_antworten: res.gute_antworten, absolviert: res.absolviert, verstanden: res.verstanden })
 }

 async function pruefScroll() {
@@ -122,7 +124,7 @@ function frageAnfordern() {
  pruefSenden({ aktion: 'frage' }, (res) => {
    aktuelleFrage.value = res.frage
    letztesFeedback.value = ''
-    frageSchonGut.value = false
+    scoreVorFrage.value = res.gute_antworten // Basis für (Re-)Bewertung dieser Frage
    pruefMessages.value.push({ role: 'assistant', kind: 'frage', content: res.frage })
    pruefPhase.value = 'frage_offen'
  })
@@ -141,7 +143,6 @@ function nachfragen() {

 function bewerten(res) {
  letztesFeedback.value = res.feedback || ''
-  if (res.bewertung === 'gut') frageSchonGut.value = true
  pruefMessages.value.push({ role: 'assistant', kind: 'feedback', content: res.feedback || '', bewertung: res.bewertung })
  pruefPhase.value = 'bewertet'
 }
@@ -151,12 +152,12 @@ function antwortAbgeben() {
  if (!text || pruefLoading.value) return
  pruefMessages.value.push({ role: 'user', kind: 'antwort', content: text })
  pruefInput.value = ''
-  pruefSenden({ aktion: 'antwort', frage: aktuelleFrage.value, frage_schon_gut: frageSchonGut.value }, bewerten)
+  pruefSenden({ aktion: 'antwort', frage: aktuelleFrage.value, score_vor_frage: scoreVorFrage.value, tier2: props.tier2 }, bewerten)
 }

 function neuBewerten() {
  if (pruefLoading.value) return
-  pruefSenden({ aktion: 'antwort', frage: aktuelleFrage.value, frage_schon_gut: frageSchonGut.value }, bewerten)
+  pruefSenden({ aktion: 'antwort', frage: aktuelleFrage.value, score_vor_frage: scoreVorFrage.value, tier2: props.tier2 }, bewerten)
 }
 </script>

@@ -174,7 +175,9 @@ function neuBewerten() {
      </button>
      <button :class="{ active: activeTab === 'pruefung' }" @click="toggle('pruefung')">
        Prüfung
-        <span v-if="st.absolviert" class="bp-chip done">✓</span>
+        <span v-if="st.verstanden" class="bp-chip gold" title="Verstanden (10/10)">✓✓</span>
+        <span v-else-if="st.absolviert && tier2" class="bp-chip done">✓ {{ st.gute_antworten }}/{{ MAX }}</span>
+        <span v-else-if="st.absolviert" class="bp-chip done">✓</span>
        <span v-else-if="st.gute_antworten" class="bp-chip">{{ Math.min(st.gute_antworten, NOETIG) }}/{{ NOETIG }}</span>
      </button>
    </div>
@@ -223,7 +226,9 @@ function neuBewerten() {
      <!-- Prüfung: gesteuerter Dialog -->
      <div v-else>
        <p class="bp-hint">
-          <template v-if="st.absolviert">✓ Absolviert — du kannst dich weiter prüfen lassen.</template>
+          <template v-if="st.verstanden">✓✓ Verstanden ({{ st.gute_antworten }}/{{ MAX }}) — Gold bleibt dir.</template>
+          <template v-else-if="st.absolviert && tier2">Mastery: {{ st.gute_antworten }}/{{ MAX }}. Richtig = +1, falsch = −1 (nicht unter {{ NOETIG }}). Bei {{ MAX }} verstanden.</template>
+          <template v-else-if="st.absolviert">✓ Absolviert. Mehr ({{ NOETIG }}→{{ MAX }}) gibt's, sobald der ganze Guide absolviert ist.</template>
          <template v-else>{{ Math.min(st.gute_antworten, NOETIG) }}/{{ NOETIG }} guten Antworten. Frag nach, wenn etwas unklar ist — diskutieren ist erlaubt.</template>
        </p>

@@ -295,6 +300,7 @@ function neuBewerten() {
  color: var(--text-muted);
 }
 .bp-chip.done { background: var(--success-soft); border-color: var(--success-border); color: var(--success); }
+.bp-chip.gold { background: color-mix(in srgb, #d4af37 20%, var(--panel)); border-color: #d4af37; color: #8a6d12; }

 .bp-panel {
  margin-top: 0.6rem;
--- a/frontend/src/components/TopicDetail.vue
+++ b/frontend/src/components/TopicDetail.vue
@@ -55,6 +55,12 @@ function onBausteinStatus(baustein, status) {
  if (status.absolviert && !warAbsolviert) emit('progressChanged') // Locks/Stats neu laden
 }

+// Tier 2 (Mastery, Score 3→10) ist frei, sobald ALLE Bausteine des Guides absolviert sind.
+const guideAbsolviert = computed(() => {
+  const secs = (content.value?.chapters || []).flatMap((ch) => ch.sections)
+  return secs.length > 0 && secs.every((s) => lernstand.value[s.title]?.absolviert)
+})
+
 // --- Chat (Mechanik in useChat; Kontext-Extraktion bleibt hier) ---
 const chat = useChat((msgs) => {
  const { section, outline } = extractContext()
@@ -153,12 +159,13 @@ function extractContext() {
            <article
              v-for="s in ch.sections"
              :key="s.num"
-              :class="['section-card', isOnePager && s.key ? 'op-card op-' + s.key : '', lernstand[s.title]?.absolviert ? 'absolviert' : '']"
+              :class="['section-card', isOnePager && s.key ? 'op-card op-' + s.key : '', lernstand[s.title]?.verstanden ? 'verstanden' : (lernstand[s.title]?.absolviert ? 'absolviert' : '')]"
              :style="isOnePager && s.key ? { gridArea: s.key } : null"
            >
              <h3>
                {{ s.title }}
-                <span v-if="lernstand[s.title]?.absolviert" class="baustein-done" title="Prüfung bestanden">✓ Absolviert</span>
+                <span v-if="lernstand[s.title]?.verstanden" class="baustein-done verstanden" title="Vollständig verstanden (10/10)">✓✓ Verstanden</span>
+                <span v-else-if="lernstand[s.title]?.absolviert" class="baustein-done" title="Prüfung bestanden">✓ Absolviert</span>
              </h3>
              <div class="section-body markdown" v-html="renderMarkdown(s.md)"></div>
              <BausteinPanel
@@ -168,6 +175,7 @@ function extractContext() {
                :section="s.md"
                :provider="provider"
                :status="lernstand[s.title]"
+                :tier2="guideAbsolviert"
                @status-changed="(st) => onBausteinStatus(s.title, st)"
              />
            </article>
@@ -325,6 +333,18 @@ function extractContext() {
  background: color-mix(in srgb, var(--success) 5%, var(--panel));
 }

+/* Verstandene Bausteine (Mastery 10/10): Gold */
+.baustein-done.verstanden {
+  background: color-mix(in srgb, #d4af37 18%, var(--panel));
+  border-color: #d4af37;
+  color: #8a6d12;
+}
+.guide-content:not(.onepager) .section-card.verstanden {
+  border-color: #d4af37;
+  border-top: 3px solid #d4af37;
+  background: color-mix(in srgb, #d4af37 7%, var(--panel));
+}
+
 /* Guides: Karten tragen die Kapitel-Akzentfarbe (OnePager hat eigene op-card-Farben) */
 .guide-content:not(.onepager) .section-card {
  border-top: 3px solid color-mix(in srgb, var(--ch-accent, var(--accent)) 65%, transparent);