Add support for user's native language in VocabCourseListView
- Introduced a new option for selecting the user's native language in the course selection dropdown. - Implemented logic to load the user's native language based on the UI language and map it to the corresponding language ID. - Updated internationalization files to include strings for the user's native language in both German and English, enhancing the user experience.
This commit is contained in:
@@ -355,6 +355,7 @@
|
|||||||
"targetLanguage": "Zielsprache",
|
"targetLanguage": "Zielsprache",
|
||||||
"nativeLanguage": "Muttersprache",
|
"nativeLanguage": "Muttersprache",
|
||||||
"allNativeLanguages": "Alle Muttersprachen",
|
"allNativeLanguages": "Alle Muttersprachen",
|
||||||
|
"myNativeLanguage": "Meine Muttersprache",
|
||||||
"forAllLanguages": "Für alle Sprachen",
|
"forAllLanguages": "Für alle Sprachen",
|
||||||
"optional": "Optional",
|
"optional": "Optional",
|
||||||
"invalidCode": "Ungültiger Code",
|
"invalidCode": "Ungültiger Code",
|
||||||
|
|||||||
@@ -355,6 +355,7 @@
|
|||||||
"targetLanguage": "Target Language",
|
"targetLanguage": "Target Language",
|
||||||
"nativeLanguage": "Native Language",
|
"nativeLanguage": "Native Language",
|
||||||
"allNativeLanguages": "All Native Languages",
|
"allNativeLanguages": "All Native Languages",
|
||||||
|
"myNativeLanguage": "My Native Language",
|
||||||
"forAllLanguages": "For All Languages",
|
"forAllLanguages": "For All Languages",
|
||||||
"optional": "Optional",
|
"optional": "Optional",
|
||||||
"invalidCode": "Invalid code",
|
"invalidCode": "Invalid code",
|
||||||
|
|||||||
@@ -30,6 +30,7 @@
|
|||||||
<label>{{ $t('socialnetwork.vocab.courses.nativeLanguage') }}:</label>
|
<label>{{ $t('socialnetwork.vocab.courses.nativeLanguage') }}:</label>
|
||||||
<select v-model="selectedNativeLanguageId" @change="loadAllCourses">
|
<select v-model="selectedNativeLanguageId" @change="loadAllCourses">
|
||||||
<option value="">{{ $t('socialnetwork.vocab.courses.allNativeLanguages') }}</option>
|
<option value="">{{ $t('socialnetwork.vocab.courses.allNativeLanguages') }}</option>
|
||||||
|
<option v-if="myNativeLanguageId" value="my">{{ $t('socialnetwork.vocab.courses.myNativeLanguage') }}</option>
|
||||||
<option value="null">{{ $t('socialnetwork.vocab.courses.forAllLanguages') }}</option>
|
<option value="null">{{ $t('socialnetwork.vocab.courses.forAllLanguages') }}</option>
|
||||||
<option v-for="lang in languages" :key="lang.id" :value="lang.id">{{ lang.name }}</option>
|
<option v-for="lang in languages" :key="lang.id" :value="lang.id">{{ lang.name }}</option>
|
||||||
</select>
|
</select>
|
||||||
@@ -140,6 +141,7 @@ export default {
|
|||||||
loading: false,
|
loading: false,
|
||||||
courses: [],
|
courses: [],
|
||||||
languages: [],
|
languages: [],
|
||||||
|
myNativeLanguageId: null,
|
||||||
showCreateDialog: false,
|
showCreateDialog: false,
|
||||||
showShareCodeDialog: false,
|
showShareCodeDialog: false,
|
||||||
searchTerm: '',
|
searchTerm: '',
|
||||||
@@ -158,17 +160,44 @@ export default {
|
|||||||
};
|
};
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
...mapGetters(['user']),
|
...mapGetters(['user', 'language']),
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
async loadLanguages() {
|
async loadLanguages() {
|
||||||
try {
|
try {
|
||||||
const res = await apiClient.get('/api/vocab/languages');
|
const res = await apiClient.get('/api/vocab/languages');
|
||||||
this.languages = res.data?.languages || [];
|
this.languages = res.data?.languages || [];
|
||||||
|
|
||||||
|
// Lade die Muttersprache des Benutzers
|
||||||
|
await this.loadMyNativeLanguage();
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
console.error('Konnte Sprachen nicht laden:', e);
|
console.error('Konnte Sprachen nicht laden:', e);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
async loadMyNativeLanguage() {
|
||||||
|
try {
|
||||||
|
// Mappe UI-Sprache zu vocab_language Name
|
||||||
|
const languageMap = {
|
||||||
|
'de': 'Deutsch',
|
||||||
|
'en': 'Englisch',
|
||||||
|
'es': 'Spanisch',
|
||||||
|
'fr': 'Französisch',
|
||||||
|
'it': 'Italienisch',
|
||||||
|
'pt': 'Portugiesisch'
|
||||||
|
};
|
||||||
|
|
||||||
|
const uiLanguage = this.language || 'de';
|
||||||
|
const nativeLanguageName = languageMap[uiLanguage] || 'Deutsch';
|
||||||
|
|
||||||
|
// Finde die entsprechende vocab_language ID
|
||||||
|
const nativeLang = this.languages.find(lang => lang.name === nativeLanguageName);
|
||||||
|
if (nativeLang) {
|
||||||
|
this.myNativeLanguageId = nativeLang.id;
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
console.error('Konnte Muttersprache nicht laden:', e);
|
||||||
|
}
|
||||||
|
},
|
||||||
async loadAllCourses() {
|
async loadAllCourses() {
|
||||||
this.loading = true;
|
this.loading = true;
|
||||||
try {
|
try {
|
||||||
@@ -182,11 +211,15 @@ export default {
|
|||||||
// Nur nativeLanguageId senden, wenn explizit eine Sprache ausgewählt wurde
|
// Nur nativeLanguageId senden, wenn explizit eine Sprache ausgewählt wurde
|
||||||
// Leer bedeutet: zeige alle Kurse
|
// Leer bedeutet: zeige alle Kurse
|
||||||
// "null" bedeutet: zeige nur Kurse ohne Muttersprache
|
// "null" bedeutet: zeige nur Kurse ohne Muttersprache
|
||||||
|
// "my" bedeutet: verwende die Muttersprache des Benutzers
|
||||||
// Eine ID bedeutet: zeige nur Kurse für diese Muttersprache
|
// Eine ID bedeutet: zeige nur Kurse für diese Muttersprache
|
||||||
if (this.selectedNativeLanguageId !== '') {
|
if (this.selectedNativeLanguageId !== '') {
|
||||||
if (this.selectedNativeLanguageId === 'null') {
|
if (this.selectedNativeLanguageId === 'null') {
|
||||||
// Explizit Kurse ohne Muttersprache anfordern
|
// Explizit Kurse ohne Muttersprache anfordern
|
||||||
params.nativeLanguageId = null;
|
params.nativeLanguageId = null;
|
||||||
|
} else if (this.selectedNativeLanguageId === 'my') {
|
||||||
|
// Verwende die Muttersprache des Benutzers
|
||||||
|
params.nativeLanguageId = this.myNativeLanguageId;
|
||||||
} else {
|
} else {
|
||||||
// Spezifische Muttersprache
|
// Spezifische Muttersprache
|
||||||
params.nativeLanguageId = this.selectedNativeLanguageId;
|
params.nativeLanguageId = this.selectedNativeLanguageId;
|
||||||
|
|||||||
Reference in New Issue
Block a user