Show actual language instead of language code in Users admin view

Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
Thomas Citharel 2021-09-07 17:54:59 +02:00
parent 68065a611a
commit d81c479aa6
No known key found for this signature in database
GPG key ID: A061B9DDE0CA0773

View file

@ -78,7 +78,7 @@
:centered="true" :centered="true"
v-slot="props" v-slot="props"
> >
{{ props.row.locale }} {{ getLanguageNameForCode(props.row.locale) }}
</b-table-column> </b-table-column>
<template #detail="props"> <template #detail="props">
@ -114,6 +114,9 @@ import { Component, Vue } from "vue-property-decorator";
import { LIST_USERS } from "../../graphql/user"; import { LIST_USERS } from "../../graphql/user";
import RouteName from "../../router/name"; import RouteName from "../../router/name";
import VueRouter from "vue-router"; import VueRouter from "vue-router";
import { LANGUAGES_CODES } from "@/graphql/admin";
import { IUser } from "@/types/current-user.model";
import { Paginate } from "@/types/paginate";
const { isNavigationFailure, NavigationFailureType } = VueRouter; const { isNavigationFailure, NavigationFailureType } = VueRouter;
const USERS_PER_PAGE = 10; const USERS_PER_PAGE = 10;
@ -131,6 +134,17 @@ const USERS_PER_PAGE = 10;
}; };
}, },
}, },
languages: {
query: LANGUAGES_CODES,
variables() {
return {
codes: this.languagesCodes,
};
},
skip() {
return this.languagesCodes.length < 1;
},
},
}, },
metaInfo() { metaInfo() {
return { return {
@ -143,6 +157,9 @@ export default class Users extends Vue {
RouteName = RouteName; RouteName = RouteName;
users!: Paginate<IUser>;
languages!: Array<{ code: string; name: string }>;
get page(): number { get page(): number {
return parseInt((this.$route.query.page as string) || "1", 10); return parseInt((this.$route.query.page as string) || "1", 10);
} }
@ -159,6 +176,18 @@ export default class Users extends Vue {
this.pushRouter({ email }); this.pushRouter({ email });
} }
get languagesCodes(): string[] {
return (this.users?.elements || []).map((user: IUser) => user.locale);
}
getLanguageNameForCode(code: string): string {
return (
(this.languages || []).find(({ code: languageCode }) => {
return languageCode === code;
})?.name || code
);
}
async onPageChange(page: number): Promise<void> { async onPageChange(page: number): Promise<void> {
this.page = page; this.page = page;
await this.$apollo.queries.users.fetchMore({ await this.$apollo.queries.users.fetchMore({