Refactor vocabulary search functionality in VocabService and update UI components

- Modified the searchVocabs method in VocabService to consolidate search parameters into a single query term for improved flexibility.
- Updated VocabSearchDialog to replace separate input fields for mother tongue and learning language with a unified search term input.
- Adjusted button logic to enable search only when a term is provided, enhancing user experience.
- Added new translations for the search term in both German and English locales to support the updated UI.
This commit is contained in:
Torsten Schulz (local)
2026-01-05 16:58:18 +01:00
parent f5e3a9a4a2
commit c17af04cbf
4 changed files with 19 additions and 24 deletions

View File

@@ -16,14 +16,10 @@
<div class="top">
<div class="row">
<label class="field">
{{ $t('socialnetwork.vocab.search.motherTongue') }}
<input v-model="motherTongue" type="text" @keydown.enter.prevent="runSearch" />
{{ $t('socialnetwork.vocab.search.term') }}
<input v-model="term" type="text" @keydown.enter.prevent="runSearch" />
</label>
<label class="field">
{{ learningLabel }}
<input v-model="learning" type="text" @keydown.enter.prevent="runSearch" />
</label>
<button class="btn" :disabled="loading || (!motherTongue.trim() && !learning.trim())" @click="runSearch">
<button class="btn" :disabled="loading || !term.trim()" @click="runSearch">
{{ loading ? $t('general.loading') : $t('socialnetwork.vocab.search.search') }}
</button>
</div>
@@ -66,8 +62,7 @@ export default {
return {
languageId: null,
languageName: '',
motherTongue: '',
learning: '',
term: '',
loading: false,
results: [],
error: '',
@@ -85,8 +80,7 @@ export default {
open({ languageId, languageName = '' } = {}) {
this.languageId = languageId;
this.languageName = languageName || '';
this.motherTongue = '';
this.learning = '';
this.term = '';
this.results = [];
this.error = '';
this.loading = false;
@@ -98,17 +92,15 @@ export default {
},
async runSearch() {
if (!this.languageId) return;
const mt = this.motherTongue.trim();
const l = this.learning.trim();
if (!mt && !l) return;
const q = this.term.trim();
if (!q) return;
this.loading = true;
this.error = '';
try {
const res = await apiClient.get(`/api/vocab/languages/${this.languageId}/search`, {
params: {
motherTongue: mt || undefined,
learning: l || undefined,
q,
},
});
this.results = res.data?.results || [];

View File

@@ -312,6 +312,7 @@
"search": {
"open": "Suche",
"title": "Vokabeln suchen",
"term": "Suchbegriff",
"motherTongue": "Muttersprache",
"learningLanguage": "Lernsprache",
"lesson": "Lektion",

View File

@@ -312,6 +312,7 @@
"search": {
"open": "Search",
"title": "Search vocabulary",
"term": "Search term",
"motherTongue": "Mother tongue",
"learningLanguage": "Learning language",
"lesson": "Lesson",