Client - add preferences for ascent related data
This commit is contained in:
		@@ -15,6 +15,8 @@
 | 
			
		||||
          )
 | 
			
		||||
        }}
 | 
			
		||||
      </dd>
 | 
			
		||||
      <dt>{{ $t('user.PROFILE.ASCENT_DATA') }}:</dt>
 | 
			
		||||
      <dd>{{ $t(`common.${display_ascent}`) }}</dd>
 | 
			
		||||
    </dl>
 | 
			
		||||
    <div class="profile-buttons">
 | 
			
		||||
      <button @click="$router.push('/profile/edit/preferences')">
 | 
			
		||||
@@ -28,11 +30,11 @@
 | 
			
		||||
<script setup lang="ts">
 | 
			
		||||
  import { computed } from 'vue'
 | 
			
		||||
 | 
			
		||||
  import { IUserProfile } from '@/types/user'
 | 
			
		||||
  import { IAuthUserProfile } from '@/types/user'
 | 
			
		||||
  import { languageLabels } from '@/utils/locales'
 | 
			
		||||
 | 
			
		||||
  interface Props {
 | 
			
		||||
    user: IUserProfile
 | 
			
		||||
    user: IAuthUserProfile
 | 
			
		||||
  }
 | 
			
		||||
  const props = defineProps<Props>()
 | 
			
		||||
 | 
			
		||||
@@ -45,4 +47,7 @@
 | 
			
		||||
  const timezone = computed(() =>
 | 
			
		||||
    props.user.timezone ? props.user.timezone : 'Europe/Paris'
 | 
			
		||||
  )
 | 
			
		||||
  const display_ascent = computed(() =>
 | 
			
		||||
    props.user.display_ascent ? 'DISPLAYED' : 'HIDDEN'
 | 
			
		||||
  )
 | 
			
		||||
</script>
 | 
			
		||||
 
 | 
			
		||||
@@ -51,6 +51,22 @@
 | 
			
		||||
            </option>
 | 
			
		||||
          </select>
 | 
			
		||||
        </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">
 | 
			
		||||
          <button class="confirm" type="submit">
 | 
			
		||||
            {{ $t('buttons.SUBMIT') }}
 | 
			
		||||
@@ -72,18 +88,19 @@
 | 
			
		||||
 | 
			
		||||
  import TimezoneDropdown from '@/components/User/ProfileEdition/TimezoneDropdown.vue'
 | 
			
		||||
  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 { availableLanguages } from '@/utils/locales'
 | 
			
		||||
 | 
			
		||||
  interface Props {
 | 
			
		||||
    user: IUserProfile
 | 
			
		||||
    user: IAuthUserProfile
 | 
			
		||||
  }
 | 
			
		||||
  const props = defineProps<Props>()
 | 
			
		||||
 | 
			
		||||
  const store = useStore()
 | 
			
		||||
 | 
			
		||||
  const userForm: IUserPreferencesPayload = reactive({
 | 
			
		||||
    display_ascent: true,
 | 
			
		||||
    imperial_units: false,
 | 
			
		||||
    language: '',
 | 
			
		||||
    timezone: 'Europe/Paris',
 | 
			
		||||
@@ -109,6 +126,16 @@
 | 
			
		||||
      value: false,
 | 
			
		||||
    },
 | 
			
		||||
  ]
 | 
			
		||||
  const ascentData = [
 | 
			
		||||
    {
 | 
			
		||||
      label: 'DISPLAYED',
 | 
			
		||||
      value: true,
 | 
			
		||||
    },
 | 
			
		||||
    {
 | 
			
		||||
      label: 'HIDDEN',
 | 
			
		||||
      value: false,
 | 
			
		||||
    },
 | 
			
		||||
  ]
 | 
			
		||||
  const loading = computed(
 | 
			
		||||
    () => 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.language = user.language ? user.language : 'en'
 | 
			
		||||
    userForm.timezone = user.timezone ? user.timezone : 'Europe/Paris'
 | 
			
		||||
 
 | 
			
		||||
@@ -3,9 +3,11 @@
 | 
			
		||||
  "CONFIRMATION": "Confirmation",
 | 
			
		||||
  "CONTACT": "contact",
 | 
			
		||||
  "DAY": "day | days",
 | 
			
		||||
  "DISPLAYED": "Displayed",
 | 
			
		||||
  "DOCUMENTATION": "documentation",
 | 
			
		||||
  "HOME": "Home",
 | 
			
		||||
  "HERE": "here",
 | 
			
		||||
  "HIDDEN": "Hidden",
 | 
			
		||||
  "SELECTS": {
 | 
			
		||||
    "ORDER_BY": {
 | 
			
		||||
      "LABEL": "order by"
 | 
			
		||||
 
 | 
			
		||||
@@ -48,6 +48,7 @@
 | 
			
		||||
  "PASSWORD_UPDATED": "Your password have been updated. Click {0} to log in.",
 | 
			
		||||
  "PROFILE": {
 | 
			
		||||
    "ACCOUNT_EDITION": "Account edition",
 | 
			
		||||
    "ASCENT_DATA": "Ascent-related data (records, total)",
 | 
			
		||||
    "BACK_TO_PROFILE": "Back to profile",
 | 
			
		||||
    "BIO": "Bio",
 | 
			
		||||
    "BIRTH_DATE": "Birth date",
 | 
			
		||||
 
 | 
			
		||||
@@ -3,9 +3,11 @@
 | 
			
		||||
  "CONFIRMATION": "Confirmation",
 | 
			
		||||
  "CONTACT": "contact",
 | 
			
		||||
  "DAY": "jour | jours",
 | 
			
		||||
  "DISPLAYED": "Affiché",
 | 
			
		||||
  "DOCUMENTATION": "documentation (en)",
 | 
			
		||||
  "HOME": "Accueil",
 | 
			
		||||
  "HERE": "ici",
 | 
			
		||||
  "HIDDEN": "Masqué",
 | 
			
		||||
  "SELECTS": {
 | 
			
		||||
    "ORDER_BY": {
 | 
			
		||||
      "LABEL": "trier par "
 | 
			
		||||
 
 | 
			
		||||
@@ -48,6 +48,7 @@
 | 
			
		||||
    "PASSWORD_UPDATED": "Votre mot de passe a été mis à jour. Cliquez {0} pour vous connecter.",
 | 
			
		||||
    "PROFILE": {
 | 
			
		||||
        "ACCOUNT_EDITION": "Mise à jour du compte",
 | 
			
		||||
        "ASCENT_DATA": "Données relatives au dénivelé positif (records, total)",
 | 
			
		||||
        "BACK_TO_PROFILE": "Revenir au profil",
 | 
			
		||||
        "BIO": "Bio",
 | 
			
		||||
        "BIRTH_DATE": "Date de naissance",
 | 
			
		||||
 
 | 
			
		||||
@@ -24,6 +24,7 @@ export interface IUserProfile {
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
export interface IAuthUserProfile extends IUserProfile {
 | 
			
		||||
  display_ascent: boolean
 | 
			
		||||
  imperial_units: boolean
 | 
			
		||||
  language: string | null
 | 
			
		||||
  timezone: string
 | 
			
		||||
@@ -58,6 +59,7 @@ export interface IAdminUserPayload {
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
export interface IUserPreferencesPayload {
 | 
			
		||||
  display_ascent: boolean
 | 
			
		||||
  imperial_units: boolean
 | 
			
		||||
  language: string
 | 
			
		||||
  timezone: string
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user