subscription upd

lang/layout/fr-FR.js

@@ -8,7 +8,7 @@ export default (context, locale) => {
     a_materiel:'Un matériel',
     sen_email_letter:'Envoyez un email, un courrier, ou un SMS aux personnes de votre carnet d\'adresses',
     a_correspondence:'Une Correspondance',
-    add_an_event_course:'Ajoutez un évenement, un cour, une prestation pédagogique, un examen... à votre planning',
+    add_an_event_course:'Ajoutez un évenement, un cours, une prestation pédagogique, un examen... à votre planning',
     an_event:'Un évènement',
     add_new_person_student:'Ajoutez un nouveau membre parent, élève, professeur, personnel... à votre répertoire',
     a_person:'une personne',

pages/subscription.vue

@@ -4,9 +4,9 @@ Page 'Mon abonnement'
 @see https://ressources.opentalent.fr/display/SPEC/Mon+abonnement
 -->
 <template>
-  <v-row justify="center" align="center">
+  <LayoutContainer>
     <v-col cols="12" sm="12" md="12">
-      <h3>{{ $t('my_subscription') }}</h3>
+      <h3 class="margin-bottom-20">{{ $t('my_subscription') }}</h3>
 
       <v-expansion-panels focusable multiple :value="[0,1]">
         <UiExpansionPanel id="informations" icon="fa-info">
@@ -56,7 +56,7 @@ Page 'Mon abonnement'
         <UiExpansionPanel id="bills" icon="fa-file">
           <v-container fluid class="container">
             <v-row>
-              <v-simple-table v-if="dolibarrAccount.bills.length > 0">
+              <v-simple-table v-if="!dolibarAccountFetch.pending && dolibarrAccount.bills.length > 0">
                 <thead>
                   <tr>
                     <th>{{ $t('reference') }}</th>
@@ -331,7 +331,7 @@ Page 'Mon abonnement'
         </UiExpansionPanel>
       </v-expansion-panels>
     </v-col>
-  </v-row>
+  </LayoutContainer>
 </template>
 
 <script lang="ts">
@@ -350,7 +350,7 @@ export default defineComponent({
     const mobytStatus: Ref<MobytUserStatus | null> = ref(null)
 
     // fetch the dolibarr account's data
-    useFetch(async () => {
+    const {fetchState} = useFetch(async () => {
       try {
         const reponse:ApiResponse = await $dataProvider.invoke({
           type: QUERY_TYPE.DEFAULT,
@@ -380,7 +380,8 @@ export default defineComponent({
     return {
       organizationProfile,
       dolibarrAccount,
-      mobytStatus
+      mobytStatus,
+      dolibarAccountFetch : fetchState
     }
   }
 })