jbourdon/social-media
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

CreatorFolio - Modal paiement, Homeview positionnement contenu

Browse Source
This commit is contained in:
PascalMarchesseault
2024-04-14 00:46:40 -04:00
parent 8e8b137dc1
commit 81cce3e496
3 changed files with 202 additions and 197 deletions
Download Patch File Download Diff File Expand all files Collapse all files

125
src/views/main/CreatorFolio.vue
View File

@@ -124,8 +124,8 @@
<v-list-item>
<v-dialog transition="dialog-top-transition" width="auto">
<template v-slot:activator="{ props: activatorProps }">
<v-btn v-bind="activatorProps" text class="d-flex align-start align-center main-background" elevation="0"
outlined="false">
<v-btn v-bind="activatorProps" text class="d-flex align-start align-center main-background"
elevation="0" outlined="false">
<v-icon left class="mr-4">mdi-wallet</v-icon>
<p @click="isActive.value = false">Bourse</p>
</v-btn>
@@ -137,7 +137,7 @@
<div class="text-center" style=" margin-top: 2%; margin-bottom: 2%;">
<v-icon left size="48">mdi-wallet</v-icon>
<v-toolbar title="PORTEFEUILLE"
style="color: white; width: 750px; background-color: #a30e79; margin-bottom: -6%;"></v-toolbar>
style="color: white; width: 750px; background-color: #a30e79; margin-bottom: -6%;"></v-toolbar>
</div>
<v-card-text class="text-h1 pa-12">
<v-row>
@@ -182,12 +182,12 @@
<v-card style="border-radius: 25px; margin-top: 3%; height: 30px;">
<v-row>
<v-col style="margin-right: -2%;" cols="1"
class="text-truncate text-center font-weight-bold">#T</v-col>
class="text-truncate text-center font-weight-bold">#T</v-col>
<v-col style="margin-right: -1%; background-color: #fbccee;" cols="1"
class="text-truncate text-center font-weight-bold">$</v-col>
class="text-truncate text-center font-weight-bold">$</v-col>
<v-col cols="2" class="text-truncate text-center font-weight-bold">Date</v-col>
<v-col cols="3" class="text-truncate text-center font-weight-bold"
style="margin-right: 2%; background-color: #fbccee">Name</v-col>
style="margin-right: 2%; background-color: #fbccee">Name</v-col>
<v-col cols="5" class="text-truncate text-center font-weight-bold">message</v-col>
</v-row>
</v-card>
@@ -196,10 +196,10 @@
<v-row>
<v-col style="margin-right: -2%;" cols="1" class="text-truncate">1</v-col>
<v-col style="margin-right: -1%; background-color: #fbccee;" cols="1"
class="text-truncate">10$</v-col>
class="text-truncate">10$</v-col>
<v-col cols="2" class="text-truncate">20-10-2025</v-col>
<v-col cols="3" class="text-truncate"
style="margin-right: 2%; background-color: #fbccee">Pascal</v-col>
style="margin-right: 2%; background-color: #fbccee">Pascal</v-col>
<v-col cols="5" class="text-truncate">Good Job</v-col>
</v-row>
@@ -453,14 +453,111 @@
<FooterLayout></FooterLayout>
<v-dialog v-model="accepted" max-width="500">
<template v-slot:activator="{ on }">
<div class="text-center pa-4">
<v-btn @click="accepted = true" v-on="on">
Approuve
</v-btn>
</div>
</template>
<!-- Your custom dialog content -->
<v-card class="custom-dialog" style="background-color: #f4f4f4;">
<v-container>
<v-row justify="center">
<v-col cols="12" class="text-center">
<v-icon color=#a30e79 size="250">mdi-check-circle</v-icon>
</v-col>
</v-row>
<v-row justify="center">
<v-col cols="12">
<v-card-text style="font-weight: 600;">
Paiement complété
</v-card-text>
<v-card-text style="margin-top: -24px;">
Transaction : #
</v-card-text>
<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;">
Guillaume Mousseau
</v-card-text>
</v-col>
</v-row>
<v-row>
<v-col cols="12">
<v-card-actions class="justify-end">
<v-btn text @click="accepted = false">Ok</v-btn>
</v-card-actions>
</v-col>
</v-row>
</v-container>
</v-card>
</v-dialog>
<v-dialog v-model="decline" max-width="500">
<template v-slot:activator="{ on }">
<div class="text-center pa-4">
<v-btn @click="decline = true" v-on="on">
Decline
</v-btn>
</div>
</template>
<!-- Your custom dialog content -->
<v-card class="custom-dialog" style="background-color: #f4f4f4;">
<v-container>
<v-row justify="center">
<v-col cols="12" class="text-center">
<v-icon color="black" size="250">mdi-cancel</v-icon>
</v-col>
</v-row>
<v-row justify="center">
<v-col cols="12">
<v-card-text style="font-size: 2rem; font-weight: 600; text-align: center;">
Paiement refusé
</v-card-text>
<v-card-text style="font-size: 1rem; text-align: center;">
Une erreur s'est produit
</v-card-text>
</v-col>
</v-row>
<v-row>
<v-col cols="12">
<v-card-actions class="justify-end">
<v-btn text @click="decline = false">Ok</v-btn>
</v-card-actions>
</v-col>
</v-row>
</v-container>
</v-card>
</v-dialog>
</div>
</template>
<script setup>
import DefaultLayout from '@/layouts/DefaultLayout.vue';
import FooterLayout from '@/layouts/FooterLayout.vue';
import { ref } from 'vue';
import StripePayment from '../StripePayment.vue';
const accepted = ref(false);
const decline = ref(false);
let imageSrc = '../../../images/guillaimeaime3x.png';
let profilePicture = '../../../images/guillaume.png';
@@ -469,9 +566,9 @@ let name = 'Guillaume Mousseau'
let title = 'Créateur de contenus'
let drawerbottom = false
let navigationItems = [
{ icon: 'mdi-home', text: 'Accueil', link: 'home' },
{ icon: 'mdi-account-group', text: 'Amis', link: '/contact' },
{ icon: 'mdi-file-document-outline', text: 'Contenu', link: '/creatorfolio' }
{ icon: 'mdi-home', text: 'Accueil', link: 'home' },
{ icon: 'mdi-account-group', text: 'Amis', link: '/contact' },
{ icon: 'mdi-file-document-outline', text: 'Contenu', link: '/creatorfolio' }
];
let tools = [
{ icon: 'mdi-wallet', text: 'Bourse', link: '/portefeuille' },
@@ -479,8 +576,8 @@ let tools = [
let items = [
{icon: "icon", text: "text"},
{icon: "icon2", text: "text2"},
{ icon: "icon", text: "text" },
{ icon: "icon2", text: "text2" },
]
</script>