diff --git a/fittrackee_client/src/components/Administration/AdminUsers.vue b/fittrackee_client/src/components/Administration/AdminUsers.vue index d78309e7..9c091bb2 100644 --- a/fittrackee_client/src/components/Administration/AdminUsers.vue +++ b/fittrackee_client/src/components/Administration/AdminUsers.vue @@ -6,6 +6,7 @@ + -
+
+ {{ $t('user.NO_USERS_FOUND') }} +
+
@@ -119,6 +123,7 @@ import { format } from 'date-fns' import { ComputedRef, + Ref, computed, reactive, watch, @@ -131,6 +136,7 @@ import FilterSelects from '@/components/Common/FilterSelects.vue' import Pagination from '@/components/Common/Pagination.vue' import UserPicture from '@/components/User/UserPicture.vue' + import UsersNameFilter from '@/components/Users/UsersNameFilter.vue' import { AUTH_USER_STORE, ROOT_STORE, USERS_STORE } from '@/store/constants' import { IPagination, TPaginationPayload } from '@/types/api' import { IAuthUserProfile, IUserProfile } from '@/types/user' @@ -170,6 +176,10 @@ function loadUsers(queryParams: TPaginationPayload) { store.dispatch(USERS_STORE.ACTIONS.GET_USERS, queryParams) } + function searchUsers(username: Ref) { + reloadUsers('q', username.value) + } + function updateUser(username: string, admin: boolean) { store.dispatch(USERS_STORE.ACTIONS.UPDATE_USER, { username, @@ -203,6 +213,14 @@ .top-button { display: none; } + + .no-users { + display: flex; + justify-content: center; + padding: $default-padding * 2 0; + font-weight: bold; + } + table { td { font-size: 1.1em; diff --git a/fittrackee_client/src/components/Common/Pagination.vue b/fittrackee_client/src/components/Common/Pagination.vue index 052c6186..33c8366f 100644 --- a/fittrackee_client/src/components/Common/Pagination.vue +++ b/fittrackee_client/src/components/Common/Pagination.vue @@ -45,20 +45,23 @@ + + diff --git a/fittrackee_client/src/locales/en/user.json b/fittrackee_client/src/locales/en/user.json index 9ce4a3a9..520275a8 100644 --- a/fittrackee_client/src/locales/en/user.json +++ b/fittrackee_client/src/locales/en/user.json @@ -6,6 +6,7 @@ "EMAIL": "Email", "EMAIL_INFO": "Enter a valid email address.", "ENTER_PASSWORD": "Enter a password", + "FILTER_ON_USERNAME": "Filter on username", "HIDE_PASSWORD": "hide password", "INVALID_TOKEN": "Invalid token, please request a new password reset.", "LANGUAGE": "Language", @@ -13,6 +14,7 @@ "LOGIN": "Login", "LOGOUT": "Logout", "NEW_PASSWORD": "New password", + "NO_USERS_FOUND": "No users found.", "PASSWORD": "Password", "PASSWORD_INFO": "At least 8 characters required.", "PASSWORD_FORGOTTEN": "Forgot password?", diff --git a/fittrackee_client/src/locales/fr/user.json b/fittrackee_client/src/locales/fr/user.json index 493f0c83..01be70a2 100644 --- a/fittrackee_client/src/locales/fr/user.json +++ b/fittrackee_client/src/locales/fr/user.json @@ -6,6 +6,7 @@ "EMAIL": "Email", "EMAIL_INFO": "Saisir une adresse email valide.", "ENTER_PASSWORD": "Saisir un mot de passe", + "FILTER_ON_USERNAME": "Filtrer sur le nom d'utilisateur", "HIDE_PASSWORD": "masquer le mot de passe", "INVALID_TOKEN": "Jeton invalide, veuillez demander une nouvelle réinitialisation de mot de passe.", "LANGUAGE": "Langue", @@ -13,6 +14,7 @@ "LOGIN": "Se connecter", "LOGOUT": "Se déconnecter", "NEW_PASSWORD": "Nouveau mot de passe", + "NO_USERS_FOUND": "Aucun utilisateur trouvé.", "PASSWORD": "Mot de passe", "PASSWORD_INFO": "8 caractères minimum.", "PASSWORD_FORGOTTEN": "Mot de passe oublié ?", diff --git a/fittrackee_client/src/types/api.ts b/fittrackee_client/src/types/api.ts index 853377a8..f74e239f 100644 --- a/fittrackee_client/src/types/api.ts +++ b/fittrackee_client/src/types/api.ts @@ -7,11 +7,12 @@ export interface IPagination { } export type TPaginationPayload = { - [key: string]: string | number + [key: string]: string | number | undefined order: string order_by: string per_page: number page: number + q?: string } export interface IQueryOptions { diff --git a/fittrackee_client/src/utils/api.ts b/fittrackee_client/src/utils/api.ts index a7fe3233..e70b3981 100644 --- a/fittrackee_client/src/utils/api.ts +++ b/fittrackee_client/src/utils/api.ts @@ -45,6 +45,11 @@ export const getQuery = ( orderByList, defaultOrderBy ) + if (typeof locationQuery.q === 'string') { + query.q = locationQuery.q + } else { + delete query.q + } return query }