About us pictures

This commit is contained in:
PascalMarchesseault
2024-05-18 02:06:24 -04:00
parent 66ed07239e
commit 8963a3262f
3 changed files with 30 additions and 53 deletions

View File

@@ -25,7 +25,7 @@
<!-- Dropdown Menu Profile/Connection -->
<v-list style="padding: 0;">
<v-list-item>
<v-list-item v-if="!currentUser">
<router-link :to="{ name: 'contact' }">
<v-btn class="full-width-btn" flat>Inscription</v-btn>
</router-link>
@@ -33,20 +33,25 @@
<v-list-item v-if="currentUser">
<v-dialog transition="dialog-top-transition" width="auto">
<template v-slot:activator="{ props: activatorProps }">
<v-btn v-bind="activatorProps" class="d-flex align-start align-center main-background"
elevation="0" outlined="false">
<v-icon left class="mr-4">mdi-wallet</v-icon>
<p>Bourse</p>
</v-btn>
<div class="d-flex justify-center">
<v-btn v-bind="activatorProps"
class="d-flex align-start align-center main-background full-width-btn" elevation="0"
outlined="false">
<v-icon left class="mr-4">mdi-wallet</v-icon>
<p>Bourse</p>
</v-btn>
</div>
</template>
<!-- Wallet Modale -->
<template v-slot:default="{ isActive }">
<v-card style="border-radius: 30px;">
<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>
@@ -54,59 +59,26 @@
<v-row>
<v-col cols="7">
<h1 style="margin-bottom: 4%; font-size: 1.3rem;">Balance actuelle</h1>
<h1 style="margin-bottom: 4%; font-size: 1.3rem;">Montant reçu</h1>
<h1 style="margin-bottom: 4%; font-size: 1.3rem;">Dernier don</h1>
</v-col>
<v-col>
<h1 style="margin-bottom: 4%; font-size: 1.3rem;">{{ currentUser.totalBalance }}$</h1>
<h1 style="margin-bottom: 4%; font-size: 1.3rem;">0$</h1>
<h1 style="margin-bottom: 4%; font-size: 1.3rem;">2024-10-04</h1>
<p></p>
</v-col>
</v-row>
</v-col>
<v-col>
<v-row>
<v-col cols="8">
<h1 style="margin-bottom: 4%; font-size: 1.2rem;">Dons</h1>
<h1 style="margin-bottom: 4%; font-size: 1.2rem;">Montant retiré</h1>
</v-col>
<v-col>
<h1 style="margin-bottom: 4%; font-size: 1.2rem;">0</h1>
<h1 style="margin-bottom: 4%; font-size: 1.2rem;">0$</h1>
<p></p>
</v-col>
</v-row>
</v-col>
</v-row>
</v-card-text>
<v-data-table-virtual :headers="headers" :items="currentUser.userTransactions" height="250"
item-value="name">
</v-data-table-virtual>
<v-card-actions class="justify-center">
<v-btn @click="isActive.value = false" text="Fermer"></v-btn>
</v-card-actions>
</v-card>
<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>
<v-col style="margin-right: -1%; background-color: #fbccee;" cols="1"
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">Message</v-col>
</v-row>
</v-card>
<v-card style=" border-radius: 25px; margin-top: .5%; max-height: 450px;">
<v-row v-for="(transaction, i) in currentUser.userTransactions" :key="i">
<v-col style="margin-right: -2%;" cols="1" class="text-truncate">{{ i + 1 }}</v-col>
<v-col style="margin-right: -1%; background-color: #fbccee;" cols="1"
class="text-truncate">{{ transaction.amount }}$</v-col>
<v-col cols="2" class="text-truncate">{{ transaction.created }}</v-col>
<v-col cols="5" class="text-truncate" style="margin-right: 2%; background-color: #fbccee">{{ transaction.tipMessage }}</v-col>
</v-row>
</v-card>
</template>
</v-dialog>
</v-list-item>
@@ -164,27 +136,34 @@
</template>
<script async setup>
import { onBeforeMount, ref } from 'vue';
import {useClient} from "@/plugins/api.js";
import MyUserModel from "@/models/myUserModel.js";
import { useClient } from "@/plugins/api.js";
import { onBeforeMount, ref } from 'vue';
const client = useClient();
const drawer = ref(false);
const currentUserName = ref("INVITÉ");
let currentUser = null;
const headers = ref([
{ title: 'Transaction', value: 'index', width: '10%' },
{ title: 'Montant', value: 'amount', width: '10%' },
{ title: 'Date', value: 'created', width: '10%' },
{ title: 'Message', value: 'tipMessage', width: '60%' }
]);
onBeforeMount(async () => {
try {
const myUser = await client.get("/api/GetMyUser");
const currentUserModel = MyUserModel.createFromApiResult(myUser.data);
currentUser = currentUserModel;
currentUserName.value = currentUserModel.firstName + " " + currentUserModel.lastName
} catch(error) {
} catch (error) {
console.log("User not logged")
}
})
function logout(){
function logout() {
localStorage.removeItem('jwt');
window.location.reload();
}

View File

@@ -35,9 +35,9 @@
<!-- Ok btn -->
<v-row>
<v-row style="margin-left: 30px; margin-right: 30px; margin-bottom: 10px;">
<v-text-field variant="underlined" style=" opacity: 0.80; margin-right: 10px;" v-model="email"
<v-text-field variant="underlined" style=" margin-right: 10px;" v-model="email"
label="Email"></v-text-field>
<v-btn variant="plain" style="margin-top: 10px;" @click="getReceipt">Reçu</v-btn>
<v-btn color="#6b0065" variant="outlined" style="margin-top: 10px;" @click="getReceipt">Reçu</v-btn>
</v-row>
<v-col cols="12">

View File

@@ -136,9 +136,7 @@
positive et enrichissante pour tous les utilisateurs.</v-typography>
</div>
</v-card>
</v-row>
<v-row justify="center">
<v-card max-width="250px" style="margin: 10px;">
<img class="member-profile-picture"
src="/images/hutopymedia/tospage/membersPictures/profileChloe.png"