#41 fix redirect and receipt info after PayementCompleted

src/views/PayementCompleted.vue

@@ -14,6 +14,10 @@
                   class="text-center">
                   Paiement complété
                 </v-card-text>
+
+                <v-text-field v-model="email" label="Email"></v-text-field>
+                <v-btn @click="getReceipt">Reçu</v-btn>
+
                 <v-row justify="center">
 
                   <!-- Icon Check -->
@@ -27,6 +31,9 @@
                     <v-card-text style="font-size: 1.2rem; text-align: center;">
                       Merci de supporter
                     </v-card-text>
+                    <v-card-text style="font-weight: 600; font-size: 1.6rem; text-align: center;">
+                      {{ creatorName }}
+                    </v-card-text>
                   </v-col>
                 </v-row>
                 <!-- Ok btn -->
@@ -35,7 +42,7 @@
                     <v-card-actions class="justify-center">
                       <v-btn color="white" outlined elevation="2"
                         style="font-size: 2rem; width: 250px; height: 50px; margin-bottom: 25px; background-color: #a30e79;"
-                        @click="router.push({ path: '/' })">Ok</v-btn>
+                        @click="router.push({ path: `/${creatorUserName}` })">Ok</v-btn>
                     </v-card-actions>
                   </v-col>
                 </v-row>
@@ -44,17 +51,54 @@
           </v-col>
         </v-row>
       </div>
+      <v-snackbar v-model="errorSnackBar">
+        Aucun reçu trouvé pour ce email.
+        <template v-slot:actions>
+          <v-btn color="red" variant="text" @click="errorSnackBar = false">Fermer</v-btn>
+        </template>
+      </v-snackbar>
     </v-container>
     <FooterLayout></FooterLayout>
 
   </body>
 </template>
 
-<script setup>
+<script async setup>
 import DefaultLayout from '@/layouts/DefaultLayout.vue';
 import FooterLayout from '@/layouts/FooterLayout.vue';
 import { useRouter } from 'vue-router';
+import { useClient } from '@/plugins/api.js';
+import {onBeforeMount, ref} from 'vue';
 const router = useRouter()
+const client = useClient();
+
+const queryString = window.location.search;
+const urlParams = new URLSearchParams(queryString);
+const creatorId = urlParams.get('creatorId')
+const creatorName = ref("");
+const creatorUserName = ref("");
+const email = ref("");
+const errorSnackBar = ref(false);
+
+
+onBeforeMount(async () => {
+  const creatorResponse = await client.get(`/api/Users?UserId=${creatorId}`);
+  creatorName.value = creatorResponse.data.firstName + " " + creatorResponse.data.lastName;
+  creatorUserName.value = creatorResponse.data.userName;
+})
+
+async function getReceipt() {
+  const receiptResponse = await client.get(`/api/Stripe/GetMyLastReceipt?CreatorId=${creatorId}&Email=${email.value}`);
+  const receiptUrl = receiptResponse.data.receiptUrl;
+
+  if (receiptUrl === "") {
+    errorSnackBar.value = true;
+    return;
+  }
+  window.open(receiptUrl);
+
+}
+
 
 </script>