fetch and display data from dolibarr

lang/enum/fr-FR.js

@@ -1,5 +1,10 @@
 export default (context, locale) => {
   return ({
+    PRODUCT_ARTIST: 'Opentalent Artist',
+    PRODUCT_ARTIST_PREMIUM: 'Opentalent Artist Premium',
+    PRODUCT_SCHOOL: 'Opentalent School',
+    PRODUCT_SCHOOL_PREMIUM: 'Opentalent School Premium',
+    PRODUCT_MANAGER: 'Opentalent Manager',
     LOCAL_AUTHORITY: 'Collectivité territoriale (Mairie, SIVOM, SIVU, EPIC, …)',
     ASSOCIATION_LAW_1901: 'Association loi 1901 ou assimilée (Droit local, ...)',
     COMMERCIAL_SOCIETY: 'Entreprise commerciale (SARL, SAS, EURL, Autoentrepreneur, …)',

lang/layout/fr-FR.js

@@ -109,22 +109,31 @@ export default (context, locale) => {
     more_features: 'Plus de fonctionnalités',
     client_id: 'Numéro de client',
     version: 'Version',
+    services: 'Services',
+    bills: 'Factures',
+    paid: 'Payée',
+    unpaid: 'Impayée',
+    reference: 'Référence',
+    date: 'Date',
+    taxExcludedAmount: 'Montant H.T.',
+    taxIncludedAmount: 'Montant TTC',
+    status: 'Statut',
     paying_structure: 'Établissement payeur',
     my_account: 'Mon compte',
-    my_schedule_page: "Mon planning",
-    attendance_bookings_menu: "Gestion des absences & fiches de présence",
-    my_attendance: "Mes absences",
-    my_invitation: "Mes invitations",
-    my_students: "Mes élèves",
-    my_students_education_students: "Suivi pédagogique",
-    my_education_students: "Mes évaluations",
-    send_an_email: "Envoyer un email",
-    my_documents: "Mes documents",
-    my_profile: "Mon profil",
-    adherent_list: "Liste des adhérents avec leurs coordonnées",
-    my_subscription: "Mon abonnement",
-    my_bills: "Mes factures",
-    print_my_licence: "Imprimer ma licence CMF",
-    logout: "Se déconnecter",
+    my_schedule_page: 'Mon planning',
+    attendance_bookings_menu: 'Gestion des absences & fiches de présence',
+    my_attendance: 'Mes absences',
+    my_invitation: 'Mes invitations',
+    my_students: 'Mes élèves',
+    my_students_education_students: 'Suivi pédagogique',
+    my_education_students: 'Mes évaluations',
+    send_an_email: 'Envoyer un email',
+    my_documents: 'Mes documents',
+    my_profile: 'Mon profil',
+    adherent_list: 'Liste des adhérents avec leurs coordonnées',
+    my_subscription: 'Mon abonnement',
+    my_bills: 'Mes factures',
+    print_my_licence: 'Imprimer ma licence CMF',
+    logout: 'Se déconnecter'
   })
 }

pages/subscription.vue

@@ -16,11 +16,23 @@ Page 'Mon abonnement'
                 <tbody>
                   <tr>
                     <td>{{ $t('client_id') }}</td>
-                    <td></td>
+                    <td>{{ dolibarrAccount.clientNumber }}</td>
                   </tr>
                   <tr>
                     <td>{{ $t('version') }}</td>
-                    <td>{{ organizationProfile.product }}</td>
+                    <td>{{ $t(dolibarrAccount.product) }}</td>
+                  </tr>
+                  <tr v-if="dolibarrAccount.contract">
+                    <td>{{ $t('services') }}</td>
+                    <td>
+                      <div
+                        v-for="line in dolibarrAccount.contract.lines"
+                        :key="line.id"
+                        style="list-style: none;"
+                      >
+                        {{ line.serviceLabel }}
+                      </div>
+                    </td>
                   </tr>
                   <tr v-if="organizationProfile.isCmf() && organizationProfile.isArtistProduct()">
                     <td>{{ $t('paying_structure') }}</td>
@@ -34,6 +46,34 @@ Page 'Mon abonnement'
           </v-container>
         </UiExpansionPanel>
 
+        <UiExpansionPanel id="bills" icon="fa-file">
+          <v-container fluid class="container">
+            <v-row>
+              <v-simple-table>
+                <thead>
+                  <tr>
+                    <th>{{ $t('reference') }}</th>
+                    <th>{{ $t('date') }}</th>
+                    <th>{{ $t('taxExcludedAmount') }}</th>
+                    <th>{{ $t('status') }}</th>
+                  </tr>
+                </thead>
+                <tbody>
+                  <tr
+                    v-for="bill in dolibarrAccount.bills"
+                    :key="bill.id"
+                  >
+                    <td>{{ bill.ref }}</td>
+                    <td>{{ $moment(bill.date).format($moment.localeData($i18n.locale).longDateFormat('L')) }}</td>
+                    <td>{{ bill.taxExcludedAmount.toLocaleString($i18n.locale, { style: 'currency', currency: 'EUR' }) }}</td>
+                    <td>{{ bill.status === 1 ? $t('paid') : $t('unpaid') }}</td>
+                  </tr>
+                </tbody>
+              </v-simple-table>
+            </v-row>
+          </v-container>
+        </UiExpansionPanel>
+
         <UiExpansionPanel id="more_features" icon="fa-plus">
           <v-container id="products-section" fluid class="container">
             <v-row>
@@ -280,17 +320,27 @@ Page 'Mon abonnement'
 </template>
 
 <script lang="ts">
-import { defineComponent, useContext } from '@nuxtjs/composition-api'
+import { defineComponent, useAsync, useContext } from '@nuxtjs/composition-api'
 import { $organizationProfile } from '~/services/profile/organizationProfile'
+import { QUERY_TYPE } from '~/types/enums'
 
 export default defineComponent({
   name: 'Subscription',
   setup () {
-    const { store } = useContext()
+    const { store, $dataProvider } = useContext()
     const organizationProfile = $organizationProfile(store)
+    // const id: number = store.state.profile.organization.id
+
+    const dolibarrAccount = useAsync(
+      () => $dataProvider.invoke({
+        type: QUERY_TYPE.DEFAULT,
+        url: 'dolibarr/account/498'
+      })
+    )
 
     return {
-      organizationProfile
+      organizationProfile,
+      dolibarrAccount
     }
   }
 })