update

frontend/src/components/BausteinPanel.vue

@@ -2,7 +2,7 @@
 import { computed, nextTick, ref } from 'vue'
 import { chatBaustein, createVertiefung, fetchVertiefung, pruefeBaustein } from '../api.js'
 import { renderMarkdown } from '../markdown.js'
-import { useChat } from '../composables/useChat.js'
+import { useChat, istUnten } from '../composables/useChat.js'
 
 const props = defineProps({
   topic: { type: String, required: true },
@@ -80,15 +80,20 @@ const letztesFeedback = ref('')  // Kontext für die Diskussion über eine Bewer
 const scoreVorFrage = ref(0)     // Score, als die aktuelle Frage gestellt wurde → driftfreies (Re-)Bewerten
 const pruefMessagesEl = ref(null)
 const pruefInputEl = ref(null)
+const pruefStick = ref(true)     // nur auto-scrollen, wenn der Nutzer (fast) unten ist
 let pruefRun = 0
 
+function onPruefScroll() {
+  if (pruefMessagesEl.value) pruefStick.value = istUnten(pruefMessagesEl.value)
+}
+
 function applyPruefung(res) {
   emit('statusChanged', { ...st.value, gute_antworten: res.gute_antworten, absolviert: res.absolviert, verstanden: res.verstanden })
 }
 
 async function pruefScroll() {
   await nextTick()
-  if (pruefMessagesEl.value) pruefMessagesEl.value.scrollTop = pruefMessagesEl.value.scrollHeight
+  if (pruefMessagesEl.value && pruefStick.value) pruefMessagesEl.value.scrollTop = pruefMessagesEl.value.scrollHeight
 }
 
 // Nur echte Gesprächs-Turns ans Backend; Feedback bleibt reines UI-Artefakt.
@@ -201,7 +206,7 @@ function neuBewerten() {
 
       <!-- Bausteinchat -->
       <div v-else-if="activeTab === 'chat'">
-        <div :ref="chat.messagesEl" class="bp-messages">
+        <div :ref="chat.messagesEl" class="bp-messages" @scroll="chat.onScroll">
           <p v-if="!chat.messages.value.length" class="bp-hint">Frag etwas zu diesem Baustein. Der Verlauf wird nicht gespeichert.</p>
           <template v-for="(m, i) in chat.messages.value" :key="i">
             <div v-if="m.role === 'assistant'" class="bp-msg assistant markdown" v-html="renderMarkdown(m.content)"></div>
@@ -232,7 +237,7 @@ function neuBewerten() {
           <template v-else>{{ Math.min(st.gute_antworten, NOETIG) }}/{{ NOETIG }} guten Antworten. Frag nach, wenn etwas unklar ist — diskutieren ist erlaubt.</template>
         </p>
 
-        <div v-if="pruefMessages.length" :ref="pruefMessagesEl" class="bp-messages">
+        <div v-if="pruefMessages.length" :ref="pruefMessagesEl" class="bp-messages" @scroll="onPruefScroll">
           <template v-for="(m, i) in pruefMessages" :key="i">
             <div v-if="m.kind === 'feedback'" class="bp-feedback" :class="m.bewertung">{{ m.content }}</div>
             <div v-else-if="m.kind === 'fehler'" class="bp-error">{{ m.content }}</div>