update
This commit is contained in:
@@ -22,7 +22,7 @@ const props = defineProps({
|
||||
providers: { type: Array, default: () => [] },
|
||||
})
|
||||
|
||||
const emit = defineEmits(['select', 'create', 'formatClick', 'bausteineClick', 'cancelBausteine', 'resetBausteine', 'deleteTopic', 'deleteProject', 'cancelGuide', 'deleteGuide', 'dismissError', 'dismissUiError', 'preview', 'openElements', 'togglePin', 'sidebarLeave', 'toggleDark', 'setProvider'])
|
||||
const emit = defineEmits(['select', 'create', 'createThema', 'formatClick', 'bausteineClick', 'cancelBausteine', 'resetBausteine', 'deleteTopic', 'deleteProject', 'cancelGuide', 'deleteGuide', 'dismissError', 'dismissUiError', 'preview', 'openElements', 'togglePin', 'sidebarLeave', 'toggleDark', 'setProvider'])
|
||||
|
||||
function providerAvailable(id) {
|
||||
const p = props.providers.find((x) => x.id === id)
|
||||
@@ -176,13 +176,36 @@ function handleDelete(format) {
|
||||
})
|
||||
}
|
||||
|
||||
const newTopic = ref('')
|
||||
// Erstellen-Bereich: inline aufklappbar (Name + weitere Infos + Quellen-Typ).
|
||||
const dlg = ref(false)
|
||||
const form = ref({ name: '', instructions: '', sourceType: 'thema', sourceOrt: '' })
|
||||
const SOURCE_HINTS = {
|
||||
thema: 'Web-Recherche zum Thema.',
|
||||
link: 'Seite wird gecrawlt (gleiche Domain, begrenzt) — Klausur-Fokus.',
|
||||
projekt: 'Ordner wird gelesen — Architektur/Features verstehen.',
|
||||
uni: 'Ordner wird gelesen — Klausur-Vorbereitung.',
|
||||
}
|
||||
const sourceHint = computed(() => SOURCE_HINTS[form.value.sourceType])
|
||||
const canCreate = computed(() => {
|
||||
if (!form.value.name.trim()) return false
|
||||
if (['link', 'projekt', 'uni'].includes(form.value.sourceType)) return !!form.value.sourceOrt.trim()
|
||||
return true
|
||||
})
|
||||
|
||||
function submit() {
|
||||
const t = newTopic.value.trim()
|
||||
if (!t) return
|
||||
emit('create', t)
|
||||
newTopic.value = ''
|
||||
function toggleErstellen() {
|
||||
if (!dlg.value) form.value = { name: '', instructions: '', sourceType: 'thema', sourceOrt: '' }
|
||||
dlg.value = !dlg.value
|
||||
}
|
||||
|
||||
function createThema() {
|
||||
if (!canCreate.value) return
|
||||
emit('createThema', {
|
||||
topic: form.value.name.trim(),
|
||||
instructions: form.value.instructions.trim(),
|
||||
sourceType: form.value.sourceType,
|
||||
sourceOrt: form.value.sourceOrt.trim(),
|
||||
})
|
||||
dlg.value = false
|
||||
}
|
||||
|
||||
function confirmDeleteTopic(topic) {
|
||||
@@ -213,12 +236,34 @@ function confirmDeleteProject(name) {
|
||||
:title="dark ? 'Hellmodus' : 'Dunkelmodus'"
|
||||
@click="emit('toggleDark')"
|
||||
>{{ dark ? '☀' : '🌙' }}</button>
|
||||
<button class="new-topic-toggle" :class="{ active: dlg }" title="Thema erstellen" @click="toggleErstellen">+</button>
|
||||
</div>
|
||||
|
||||
<!-- Erstellen: inline aufklappbar (kein Modal) -->
|
||||
<div v-if="dlg" class="thema-panel">
|
||||
<input class="dlg-input" v-model="form.name" placeholder="Thema-Name…" @keyup.enter="createThema" autofocus />
|
||||
<textarea class="dlg-textarea" v-model="form.instructions" rows="3" placeholder="Weitere Informationen / Spezifikation (optional)…"></textarea>
|
||||
<div class="dlg-sources">
|
||||
<button :class="{ active: form.sourceType === 'thema' }" @click="form.sourceType = 'thema'; form.sourceOrt = ''">Thema</button>
|
||||
<button :class="{ active: form.sourceType === 'link' }" @click="form.sourceType = 'link'; form.sourceOrt = ''">Link</button>
|
||||
<button :class="{ active: form.sourceType === 'projekt' }" @click="form.sourceType = 'projekt'; form.sourceOrt = ''">Projekt</button>
|
||||
<button :class="{ active: form.sourceType === 'uni' }" @click="form.sourceType = 'uni'; form.sourceOrt = ''">Uni</button>
|
||||
</div>
|
||||
<input
|
||||
v-model="newTopic"
|
||||
placeholder="Neues Thema…"
|
||||
@keyup.enter="submit"
|
||||
v-if="form.sourceType === 'link'"
|
||||
class="dlg-input" v-model="form.sourceOrt"
|
||||
placeholder="https://…" @keyup.enter="createThema"
|
||||
/>
|
||||
<button @click="submit" :disabled="!newTopic.trim()">+</button>
|
||||
<input
|
||||
v-else-if="form.sourceType === 'projekt' || form.sourceType === 'uni'"
|
||||
class="dlg-input" v-model="form.sourceOrt"
|
||||
placeholder="Ordner ab ./ (z.B. projects/meinprojekt)" @keyup.enter="createThema"
|
||||
/>
|
||||
<p class="dlg-hint">{{ sourceHint }}</p>
|
||||
<div class="dlg-actions">
|
||||
<button class="dlg-cancel" @click="dlg = false">Abbrechen</button>
|
||||
<button class="dlg-create" :disabled="!canCreate" @click="createThema">Erstellen</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="provider-toggle" v-if="providers.length">
|
||||
<button
|
||||
@@ -853,4 +898,68 @@ function confirmDeleteProject(name) {
|
||||
50% { opacity: 0.65; }
|
||||
}
|
||||
|
||||
/* Erstellen — inline aufklappbar (kein Modal) */
|
||||
.new-topic-toggle {
|
||||
flex: 1;
|
||||
padding: 6px 8px;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 6px;
|
||||
background: var(--accent);
|
||||
color: var(--on-accent);
|
||||
cursor: pointer;
|
||||
font: inherit;
|
||||
font-size: 1.1rem;
|
||||
line-height: 1;
|
||||
text-align: center;
|
||||
}
|
||||
.new-topic-toggle:hover { background: var(--accent-hover); }
|
||||
.new-topic-toggle.active { background: var(--accent-hover); }
|
||||
.thema-panel {
|
||||
margin: 0.5rem 0;
|
||||
padding: 0.75rem;
|
||||
background: var(--panel-soft);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 10px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.55rem;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
.dlg-input, .dlg-textarea {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 0.5rem 0.6rem;
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 6px;
|
||||
background: var(--panel);
|
||||
color: var(--text);
|
||||
font: inherit;
|
||||
}
|
||||
.dlg-input:focus, .dlg-textarea:focus { outline: none; border-color: var(--accent); }
|
||||
.dlg-textarea { resize: vertical; min-height: 3rem; }
|
||||
.dlg-sources { display: flex; gap: 0.4rem; }
|
||||
.dlg-sources button {
|
||||
flex: 1;
|
||||
padding: 0.45rem 0.2rem;
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 6px;
|
||||
background: var(--panel-soft);
|
||||
color: var(--text);
|
||||
cursor: pointer;
|
||||
font-size: 0.82rem;
|
||||
}
|
||||
.dlg-sources button.active { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
|
||||
.dlg-hint { margin: 0; font-size: 0.75rem; color: var(--text-faint); }
|
||||
.dlg-actions { display: flex; justify-content: flex-end; gap: 0.5rem; margin-top: 0.3rem; }
|
||||
.dlg-actions button {
|
||||
padding: 0.45rem 0.9rem;
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 6px;
|
||||
background: var(--panel-soft);
|
||||
color: var(--text);
|
||||
cursor: pointer;
|
||||
}
|
||||
.dlg-create { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
|
||||
.dlg-create:disabled { opacity: 0.45; cursor: default; }
|
||||
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user