feat(LanguageAssistantView): add preset options for Ollama and OpenAI
All checks were successful
Deploy to production / deploy (push) Successful in 4m31s

- Introduced a new section for language assistant presets, allowing users to quickly apply configurations for Ollama and OpenAI.
- Implemented methods to set the base URL and model for each preset, enhancing user experience with one-click setup.
- Added styling for the preset buttons and hints to improve UI clarity and usability.
This commit is contained in:
Torsten Schulz (local)
2026-04-17 15:24:22 +02:00
parent 4205639de3
commit 776dea2584
2 changed files with 164 additions and 0 deletions

View File

@@ -28,6 +28,22 @@
<span>{{ $t('settings.languageAssistant.enabled') }}</span>
</label>
<div class="language-assistant-settings__presets">
<p class="language-assistant-settings__presets-title">Schnellstart (1-Klick)</p>
<div class="language-assistant-settings__preset-actions">
<button type="button" class="preset-btn" @click="applyOllamaPreset">
Kostenlos lokal (Ollama)
</button>
<button type="button" class="preset-btn preset-btn--secondary" @click="applyOpenAiPreset">
Standard (OpenAI-kompatibel)
</button>
</div>
<p class="language-assistant-settings__preset-hint">
Der Ollama-Preset setzt <code>http://127.0.0.1:11434/v1</code> und
<code>qwen2.5:7b-instruct</code>. Kein API-Key erforderlich.
</p>
</div>
<div class="language-assistant-settings__grid">
<label class="language-assistant-settings__field">
<span>{{ $t('settings.languageAssistant.baseUrl') }}</span>
@@ -118,6 +134,19 @@ export default {
await this.load();
},
methods: {
applyOllamaPreset() {
this.form.enabled = true;
this.form.baseUrl = 'http://127.0.0.1:11434/v1';
this.form.model = 'qwen2.5:7b-instruct';
this.form.apiKey = '';
this.form.clearKey = false;
},
applyOpenAiPreset() {
this.form.enabled = true;
this.form.baseUrl = '';
this.form.model = 'gpt-4o-mini';
this.form.clearKey = false;
},
async load() {
this.loadError = null;
try {
@@ -188,6 +217,39 @@ export default {
.language-assistant-settings__panel {
padding: 1.25rem 1.5rem;
}
.language-assistant-settings__presets {
margin-top: 1rem;
padding: 0.85rem 1rem;
border: 1px solid var(--color-border, #ccc);
border-radius: 8px;
background: color-mix(in srgb, var(--color-input-bg, #fff) 85%, #f6f8ff);
}
.language-assistant-settings__presets-title {
margin: 0 0 0.5rem;
font-weight: 700;
}
.language-assistant-settings__preset-actions {
display: flex;
gap: 0.5rem;
flex-wrap: wrap;
}
.preset-btn {
border: 1px solid var(--color-border, #ccc);
border-radius: 6px;
padding: 0.45rem 0.75rem;
cursor: pointer;
background: var(--color-input-bg, #fff);
color: inherit;
font-weight: 600;
}
.preset-btn--secondary {
opacity: 0.9;
}
.language-assistant-settings__preset-hint {
margin: 0.55rem 0 0;
font-size: 0.82rem;
opacity: 0.85;
}
.language-assistant-settings__grid {
display: grid;
gap: 1rem;