Merge branch 'feature/BTTF-62' into develop

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,33 @@ 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',
+    remaining_sms_credit: 'Crédit SMS restant',
     paying_structure: 'Établissement payeur',
+    no_bill_to_display: 'Aucune facture à afficher',
     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,13 +16,32 @@ 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="organizationProfile.isCmf() && organizationProfile.isArtistProduct()">
+                  <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="mobytStatus && mobytStatus.active">
+                    <td>{{ $t('remaining_sms_credit') }}</td>
+                    <td>
+                      {{ mobytStatus.money.toLocaleString($i18n.locale, { style: 'currency', currency: 'EUR' }) }}
+                      ({{ mobytStatus.amount }} SMS)
+                    </td>
+                  </tr>
+                  <tr v-if="organizationProfile.isCmf && organizationProfile.isArtistProduct">
                     <td>{{ $t('paying_structure') }}</td>
                     <td>
                       CMF
@@ -34,6 +53,37 @@ Page 'Mon abonnement'
           </v-container>
         </UiExpansionPanel>
 
+        <UiExpansionPanel id="bills" icon="fa-file">
+          <v-container fluid class="container">
+            <v-row>
+              <v-simple-table v-if="dolibarrAccount.bills.length > 0">
+                <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>
+              <div v-else class="ma-2">
+                <i>{{ $t('no_bill_to_display') }}</i>
+              </div>
+            </v-row>
+          </v-container>
+        </UiExpansionPanel>
+
         <UiExpansionPanel id="more_features" icon="fa-plus">
           <v-container id="products-section" fluid class="container">
             <v-row>
@@ -41,13 +91,13 @@ Page 'Mon abonnement'
                 <template #default>
                   <thead>
                     <tr>
-                      <th v-if="organizationProfile.isArtistProduct()">
+                      <th v-if="organizationProfile.isArtistProduct">
                         Opentalent Artist Premium
                       </th>
-                      <th v-if="organizationProfile.isArtist()">
+                      <th v-if="organizationProfile.isArtist">
                         Opentalent School
                       </th>
-                      <th v-if="organizationProfile.isSchoolProduct()">
+                      <th v-if="organizationProfile.isSchoolProduct">
                         Opentalent School Premium
                       </th>
                       <th>
@@ -59,14 +109,14 @@ Page 'Mon abonnement'
                     </tr>
                   </thead>
                   <tbody>
-                    <tr>
-                      <td v-if="organizationProfile.isArtistProduct()">
+                    <tr class="center-td-content">
+                      <td v-if="organizationProfile.isArtistProduct">
                         <nuxt-img src="/images/Artist-Square.jpg" />
                       </td>
-                      <td v-if="organizationProfile.isArtist()">
+                      <td v-if="organizationProfile.isArtist">
                         <nuxt-img src="/images/School-Square.jpg" />
                       </td>
-                      <td v-if="organizationProfile.isSchoolProduct()">
+                      <td v-if="organizationProfile.isSchoolProduct">
                         <nuxt-img src="/images/School-Square.jpg" />
                       </td>
                       <td>
@@ -78,7 +128,7 @@ Page 'Mon abonnement'
                     </tr>
                     <tr>
                       <!-- Opentalent Artist Premium -->
-                      <td v-if="organizationProfile.isArtistProduct()">
+                      <td v-if="organizationProfile.isArtistProduct">
                         <p>
                           Bénéficiez de plus de fonctionnalités avec la version
                           <b>Opentalent Artist Premium</b>
@@ -128,7 +178,7 @@ Page 'Mon abonnement'
                       </td>
 
                       <!-- Opentalent School -->
-                      <td v-if="organizationProfile.isArtist()">
+                      <td v-if="organizationProfile.isArtist">
                         <p>
                           Une solution économique adaptée à votre établissement d'enseignement
                           artistique
@@ -175,7 +225,7 @@ Page 'Mon abonnement'
                       </td>
 
                       <!-- Opentalent School Premium -->
-                      <td v-if="organizationProfile.isSchoolProduct()">
+                      <td v-if="organizationProfile.isSchoolProduct">
                         <p>
                           Passez à la version <b>Opentalent School Premium</b> et bénéficiez:
                         </p>
@@ -255,15 +305,20 @@ Page 'Mon abonnement'
                         </p>
 
                         <p>Exemple:</p>
-
                         <table>
                           <tr>
-                            <td>Nom de domaine</td>
-                            <td>ma-structure.fr</td>
+                            <td style="width: 200px;">
+                              Nom de domaine:
+                            </td>
+                            <td>
+                              <i>ma-structure.fr</i>
+                            </td>
                           </tr>
                           <tr>
-                            <td>Adresse email associée</td>
-                            <td>contact@NomDeMaStructure.fr</td>
+                            <td>Adresse email associée: </td>
+                            <td>
+                              <i>contact@NomDeMaStructure.fr</i>
+                            </td>
                           </tr>
                         </table>
                       </td>
@@ -280,17 +335,50 @@ Page 'Mon abonnement'
 </template>
 
 <script lang="ts">
-import { defineComponent, useContext } from '@nuxtjs/composition-api'
+import { defineComponent, useFetch, useContext, ref, Ref } from '@nuxtjs/composition-api'
 import { $organizationProfile } from '~/services/profile/organizationProfile'
+import { QUERY_TYPE } from '~/types/enums'
+import { DolibarrAccount, MobytUserStatus } from '~/types/interfaces'
 
 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: Ref<DolibarrAccount | null> = ref(null)
+    const mobytStatus: Ref<MobytUserStatus | null> = ref(null)
+
+    // fetch the dolibarr account's data
+    useFetch(async () => {
+      try {
+        dolibarrAccount.value = await $dataProvider.invoke({
+          type: QUERY_TYPE.DEFAULT,
+          url: 'dolibarr/account/' + id
+        })
+      } catch (Error) {
+        // eslint-disable-next-line no-console
+        console.error('Error: Dolibarr account not found')
+      }
+    })
+
+    // fetch the mobyt status
+    useFetch(async () => {
+      try {
+        mobytStatus.value = await $dataProvider.invoke({
+          type: QUERY_TYPE.DEFAULT,
+          url: 'mobyt/status/' + id
+        })
+      } catch (Error) {
+        // eslint-disable-next-line no-console
+        console.error('Error: Mobyt status not found')
+      }
+    })
 
     return {
-      organizationProfile
+      organizationProfile,
+      dolibarrAccount,
+      mobytStatus
     }
   }
 })
@@ -307,7 +395,7 @@ export default defineComponent({
     max-width: 100%;
   }
 
-  #products-section tr:first-child td {
+  #products-section tr.center-td-content td {
     text-align: center;
   }
 

types/interfaces.d.ts

@@ -192,3 +192,44 @@ interface Denormalizer {
   denormalize(data: any): any,
 }
 
+interface DolibarrContractLine {
+  id: number,
+  contractId: number,
+  dateStart: Date,
+  dateEnd: Date,
+  serviceRef: string,
+  serviceLabel: string
+}
+
+interface DolibarrContract {
+  ref: string,
+  socId: number,
+  lines: Array<DolibarrContractLine>
+}
+
+interface DolibarrBill {
+  id: number,
+  ref: string,
+  socId: number,
+  date: Date,
+  taxExcludedAmount: number,
+  taxIncludedAmount: number,
+  paid: boolean
+}
+
+interface DolibarrAccount {
+  organizationId: number,
+  socId: number,
+  clientNumber: string,
+  product: 'PRODUCT_ARTIST' | 'PRODUCT_ARTIST_PREMIUM' | 'PRODUCT_SCHOOL' |
+           'PRODUCT_SCHOOL_PREMIUM' | 'PRODUCT_MANAGER',
+  contract: DolibarrContract,
+  bills: Array<DolibarrBill>
+}
+
+interface MobytUserStatus {
+  organizationId: number,
+  active: boolean,
+  amount: number,
+  money: number
+}