Client - add preferences for ascent related data

This commit is contained in:
Sam 2022-07-23 08:17:37 +02:00
parent 06b7af126a
commit 81efdf53d5
7 changed files with 46 additions and 5 deletions

View File

@ -15,6 +15,8 @@
) )
}} }}
</dd> </dd>
<dt>{{ $t('user.PROFILE.ASCENT_DATA') }}:</dt>
<dd>{{ $t(`common.${display_ascent}`) }}</dd>
</dl> </dl>
<div class="profile-buttons"> <div class="profile-buttons">
<button @click="$router.push('/profile/edit/preferences')"> <button @click="$router.push('/profile/edit/preferences')">
@ -28,11 +30,11 @@
<script setup lang="ts"> <script setup lang="ts">
import { computed } from 'vue' import { computed } from 'vue'
import { IUserProfile } from '@/types/user' import { IAuthUserProfile } from '@/types/user'
import { languageLabels } from '@/utils/locales' import { languageLabels } from '@/utils/locales'
interface Props { interface Props {
user: IUserProfile user: IAuthUserProfile
} }
const props = defineProps<Props>() const props = defineProps<Props>()
@ -45,4 +47,7 @@
const timezone = computed(() => const timezone = computed(() =>
props.user.timezone ? props.user.timezone : 'Europe/Paris' props.user.timezone ? props.user.timezone : 'Europe/Paris'
) )
const display_ascent = computed(() =>
props.user.display_ascent ? 'DISPLAYED' : 'HIDDEN'
)
</script> </script>

View File

@ -51,6 +51,22 @@
</option> </option>
</select> </select>
</label> </label>
<label class="form-items">
{{ $t('user.PROFILE.ASCENT_DATA') }}
<select
id="display_ascent"
v-model="userForm.display_ascent"
:disabled="loading"
>
<option
v-for="status in ascentData"
:value="status.value"
:key="status.value"
>
{{ $t(`common.${status.label}`) }}
</option>
</select>
</label>
<div class="form-buttons"> <div class="form-buttons">
<button class="confirm" type="submit"> <button class="confirm" type="submit">
{{ $t('buttons.SUBMIT') }} {{ $t('buttons.SUBMIT') }}
@ -72,18 +88,19 @@
import TimezoneDropdown from '@/components/User/ProfileEdition/TimezoneDropdown.vue' import TimezoneDropdown from '@/components/User/ProfileEdition/TimezoneDropdown.vue'
import { AUTH_USER_STORE, ROOT_STORE } from '@/store/constants' import { AUTH_USER_STORE, ROOT_STORE } from '@/store/constants'
import { IUserProfile, IUserPreferencesPayload } from '@/types/user' import { IUserPreferencesPayload, IAuthUserProfile } from '@/types/user'
import { useStore } from '@/use/useStore' import { useStore } from '@/use/useStore'
import { availableLanguages } from '@/utils/locales' import { availableLanguages } from '@/utils/locales'
interface Props { interface Props {
user: IUserProfile user: IAuthUserProfile
} }
const props = defineProps<Props>() const props = defineProps<Props>()
const store = useStore() const store = useStore()
const userForm: IUserPreferencesPayload = reactive({ const userForm: IUserPreferencesPayload = reactive({
display_ascent: true,
imperial_units: false, imperial_units: false,
language: '', language: '',
timezone: 'Europe/Paris', timezone: 'Europe/Paris',
@ -109,6 +126,16 @@
value: false, value: false,
}, },
] ]
const ascentData = [
{
label: 'DISPLAYED',
value: true,
},
{
label: 'HIDDEN',
value: false,
},
]
const loading = computed( const loading = computed(
() => store.getters[AUTH_USER_STORE.GETTERS.USER_LOADING] () => store.getters[AUTH_USER_STORE.GETTERS.USER_LOADING]
) )
@ -122,7 +149,8 @@
} }
}) })
function updateUserForm(user: IUserProfile) { function updateUserForm(user: IAuthUserProfile) {
userForm.display_ascent = user.display_ascent
userForm.imperial_units = user.imperial_units ? user.imperial_units : false userForm.imperial_units = user.imperial_units ? user.imperial_units : false
userForm.language = user.language ? user.language : 'en' userForm.language = user.language ? user.language : 'en'
userForm.timezone = user.timezone ? user.timezone : 'Europe/Paris' userForm.timezone = user.timezone ? user.timezone : 'Europe/Paris'

View File

@ -3,9 +3,11 @@
"CONFIRMATION": "Confirmation", "CONFIRMATION": "Confirmation",
"CONTACT": "contact", "CONTACT": "contact",
"DAY": "day | days", "DAY": "day | days",
"DISPLAYED": "Displayed",
"DOCUMENTATION": "documentation", "DOCUMENTATION": "documentation",
"HOME": "Home", "HOME": "Home",
"HERE": "here", "HERE": "here",
"HIDDEN": "Hidden",
"SELECTS": { "SELECTS": {
"ORDER_BY": { "ORDER_BY": {
"LABEL": "order by" "LABEL": "order by"

View File

@ -48,6 +48,7 @@
"PASSWORD_UPDATED": "Your password have been updated. Click {0} to log in.", "PASSWORD_UPDATED": "Your password have been updated. Click {0} to log in.",
"PROFILE": { "PROFILE": {
"ACCOUNT_EDITION": "Account edition", "ACCOUNT_EDITION": "Account edition",
"ASCENT_DATA": "Ascent-related data (records, total)",
"BACK_TO_PROFILE": "Back to profile", "BACK_TO_PROFILE": "Back to profile",
"BIO": "Bio", "BIO": "Bio",
"BIRTH_DATE": "Birth date", "BIRTH_DATE": "Birth date",

View File

@ -3,9 +3,11 @@
"CONFIRMATION": "Confirmation", "CONFIRMATION": "Confirmation",
"CONTACT": "contact", "CONTACT": "contact",
"DAY": "jour | jours", "DAY": "jour | jours",
"DISPLAYED": "Affiché",
"DOCUMENTATION": "documentation (en)", "DOCUMENTATION": "documentation (en)",
"HOME": "Accueil", "HOME": "Accueil",
"HERE": "ici", "HERE": "ici",
"HIDDEN": "Masqué",
"SELECTS": { "SELECTS": {
"ORDER_BY": { "ORDER_BY": {
"LABEL": "trier par " "LABEL": "trier par "

View File

@ -48,6 +48,7 @@
"PASSWORD_UPDATED": "Votre mot de passe a été mis à jour. Cliquez {0} pour vous connecter.", "PASSWORD_UPDATED": "Votre mot de passe a été mis à jour. Cliquez {0} pour vous connecter.",
"PROFILE": { "PROFILE": {
"ACCOUNT_EDITION": "Mise à jour du compte", "ACCOUNT_EDITION": "Mise à jour du compte",
"ASCENT_DATA": "Données relatives au dénivelé positif (records, total)",
"BACK_TO_PROFILE": "Revenir au profil", "BACK_TO_PROFILE": "Revenir au profil",
"BIO": "Bio", "BIO": "Bio",
"BIRTH_DATE": "Date de naissance", "BIRTH_DATE": "Date de naissance",

View File

@ -24,6 +24,7 @@ export interface IUserProfile {
} }
export interface IAuthUserProfile extends IUserProfile { export interface IAuthUserProfile extends IUserProfile {
display_ascent: boolean
imperial_units: boolean imperial_units: boolean
language: string | null language: string | null
timezone: string timezone: string
@ -58,6 +59,7 @@ export interface IAdminUserPayload {
} }
export interface IUserPreferencesPayload { export interface IUserPreferencesPayload {
display_ascent: boolean
imperial_units: boolean imperial_units: boolean
language: string language: string
timezone: string timezone: string