Ver Fonte

Implements artist premium trial request form

Implements the artist premium trial request form by:
- Refactors structure types and legal statuses into constants with labels.
- Updates the form to submit data to the configured API endpoint.
- Adds basic error handling and success messaging.
- Fixes a typo in the legal representative checkbox label.
Olivier Massot há 6 meses atrás
pai
commit
bfd23285a7
4 ficheiros alterados com 121 adições e 27 exclusões
  1. 40 27
      pages/shop/try/artist-premium.vue
  2. 2 0
      types/enum/enums.ts
  3. 21 0
      types/interface.d.ts
  4. 58 0
      types/types.ts

+ 40 - 27
pages/shop/try/artist-premium.vue

@@ -156,6 +156,8 @@
                       :rules="[validateRequired]"
                       label="Type de la structure*"
                       :items="structureTypes"
+                      item-value="value"
+                      item-title="title"
                       required
                     />
                   </v-col>
@@ -165,11 +167,15 @@
                       :rules="[validateRequired]"
                       label="Statut juridique*"
                       :items="legalStatuses"
+                      item-value="value"
+                      item-title="title"
                       required
                     />
                   </v-col>
                 </v-row>
 
+
+
                 <h2 class="section-title">Représentée par</h2>
 
                 <!-- Representative function -->
@@ -241,7 +247,7 @@
                 <v-checkbox
                   v-model="trialRequest.legalRepresentative"
                   :rules="[validateCheckbox]"
-                  label="J'agis en tant que représentant légal de l'association.*"
+                  label="J'agis en tant que représentant légal de l'association ou de la structure.*"
                   required
                 />
 
@@ -337,32 +343,24 @@
 import { useRouter } from 'vue-router'
 import type { Ref } from 'vue'
 import { reactive } from 'vue'
+import { useRuntimeConfig } from '#app'
 import type { TrialRequest } from '~/types/interface'
+import { STRUCTURE_TYPE, LEGAL_STATUS } from '~/types/types'
 
 const router = useRouter()
 
 const form: Ref<HTMLElement | null> = ref(null)
 
 // Structure types and legal statuses
-const structureTypes: Array<string> = [
-  'Orchestre',
-  'Chorale',
-  'Compagnie de théâtre',
-  'Compagnie de danse',
-  'Compagnie de cirque',
-  'Autre',
-]
-
-const legalStatuses: Array<string> = [
-  'Association loi 1901',
-  'SARL',
-  'SAS',
-  'EURL',
-  'Auto-entrepreneur',
-  'Établissement public',
-  'Collectivité territoriale',
-  'Autre',
-]
+const structureTypes = Object.values(STRUCTURE_TYPE).map((item) => ({
+  value: item.key,
+  title: item.label,
+})).sort((a, b) => (a.title > b.title ? 1 : -1))
+
+const legalStatuses = Object.values(LEGAL_STATUS).map((item) => ({
+  value: item.key,
+  title: item.label,
+})).sort((a, b) => (a.title > b.title ? 1 : -1))
 
 // Trial request data
 const trialRequest = reactive<TrialRequest>({
@@ -372,8 +370,8 @@ const trialRequest = reactive<TrialRequest>({
   postalCode: '',
   city: '',
   structureEmail: '',
-  structureType: '',
-  legalStatus: '',
+  structureType: 'ARTISTIC_PRACTICE_ONLY',
+  legalStatus: 'ASSOCIATION_LAW_1901',
   siren: '',
   representativeFirstName: '',
   representativeLastName: '',
@@ -418,12 +416,26 @@ const submit = async (): Promise<void> => {
   }
 
   try {
-    // Here you would normally send the data to your backend
-    // For now, we'll just simulate a successful submission
-    console.log('Trial request submitted:', trialRequest)
+    const config = useRuntimeConfig()
+    const apiUrl = `${config.public.apiBaseUrl}/trial/artists_premium`
+
+    console.log('Sending trial request to:', apiUrl)
+
+    // Send the data to the API
+    const response = await fetch(apiUrl, {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json',
+      },
+      body: JSON.stringify(trialRequest),
+    })
+
+    if (!response.ok) {
+      throw new Error(`API request failed with status ${response.status}`)
+    }
 
-    // Simulate API call delay
-    await new Promise((resolve) => setTimeout(resolve, 1000))
+    const data = await response.json()
+    console.log('Trial request submitted successfully:', data)
 
     trialRequestSent.value = true
     errorMsg.value = null
@@ -431,6 +443,7 @@ const submit = async (): Promise<void> => {
     // Scroll to top to show confirmation message
     setTimeout(() => router.push({ path: '', hash: '#anchor' }), 30)
   } catch (e) {
+    console.error('Error submitting trial request:', e)
     errorMsg.value =
       "Une erreur s'est produite lors de l'activation de votre essai. Veuillez réessayer plus tard ou nous contacter directement."
   }

+ 2 - 0
types/enum/enums.ts

@@ -1,4 +1,5 @@
 export const enum PRODUCT {
+  FREEMIUM = 'freemium',
   SCHOOL = 'school',
   SCHOOL_PREMIUM = 'school-premium',
   ARTIST = 'artist',
@@ -35,3 +36,4 @@ export const enum COOKIE_CONSENT_CHOICE {
   CUSTOMIZED = 'customized',
   NONE = 'none',
 }
+

+ 21 - 0
types/interface.d.ts

@@ -1,5 +1,6 @@
 import { ActionMenuItemType } from '~/types/enum/layout'
 import { COOKIE_CONSENT_CHOICE } from '~/types/enum/enums'
+import { STRUCTURE_TYPE_KEYS, LEGAL_STATUS_KEYS } from '~/types/types'
 
 interface ActionMenuItem {
   type: ActionMenuItemType
@@ -182,3 +183,23 @@ interface Article {
   btnTitle?: string
   btnHref?: string
 }
+
+interface TrialRequest {
+  structureName: string
+  address: string
+  addressComplement: string
+  postalCode: string
+  city: string
+  structureEmail: string
+  structureType: STRUCTURE_TYPE_KEYS
+  legalStatus: LEGAL_STATUS_KEYS
+  siren: string
+  representativeFirstName: string
+  representativeLastName: string
+  representativeFunction: string
+  representativeEmail: string
+  representativePhone: string
+  termsAccepted: boolean
+  legalRepresentative: boolean
+  newsletterSubscription: boolean
+}

+ 58 - 0
types/types.ts

@@ -0,0 +1,58 @@
+
+export const STRUCTURE_TYPE = {
+  NATIONAL_FEDERATION: {
+    key: 'NATIONAL_FEDERATION',
+    label: 'Fédération nationale',
+  },
+  REGIONAL_FEDERATION: {
+    key: 'REGIONAL_FEDERATION',
+    label: 'Fédération régionale',
+  },
+  DEPARTEMENTAL_FEDERATION: {
+    key: 'DEPARTEMENTAL_FEDERATION',
+    label: 'Fédération départementale',
+  },
+  LOCAL_FEDERATION: {
+    key: 'LOCAL_FEDERATION',
+    label: 'Fédération locale',
+  },
+  GROUPMENT: {
+    key: 'GROUPMENT',
+    label: 'Groupement',
+  },
+  DELEGATION: {
+    key: 'DELEGATION',
+    label: 'Délégation',
+  },
+  ARTISTIC_EDUCATION_ONLY: {
+    key: 'ARTISTIC_EDUCATION_ONLY',
+    label: 'Enseignement artistique uniquement',
+  },
+  ARTISTIC_PRACTICE_ONLY: {
+    key: 'ARTISTIC_PRACTICE_ONLY',
+    label: 'Pratique artistique uniquement',
+  },
+  ARTISTIC_PRACTICE_EDUCATION: {
+    key: 'ARTISTIC_PRACTICE_EDUCATION',
+    label: 'Pratique et enseignement artistique',
+  },
+} as const
+
+export type STRUCTURE_TYPE_KEYS = keyof typeof STRUCTURE_TYPE
+
+export const LEGAL_STATUS = {
+  LOCAL_AUTHORITY: {
+    key: 'LOCAL_AUTHORITY',
+    label: 'Collectivité territoriale',
+  },
+  ASSOCIATION_LAW_1901: {
+    key: 'ASSOCIATION_LAW_1901',
+    label: 'Association loi 1901',
+  },
+  COMMERCIAL_SOCIETY: {
+    key: 'COMMERCIAL_SOCIETY',
+    label: 'Société commerciale',
+  },
+} as const
+
+export type LEGAL_STATUS_KEYS = keyof typeof LEGAL_STATUS