piair/MyINPulse
2
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

front_foundation #9

Closed
mohamed_maoulainine wants to merge 181 commits from front_foundation into main
pull from: front_foundation
merge into: piair:main
Conversation 6 Commits 181 Files Changed 93 +79 -80
2 changed files with 79 additions and 80 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 6226c9f632 - Show all commits

110
front/MyINPulse-front/src/components/ProjectComponent.vue
View File

@ -1,40 +1,39 @@
<template>
<div class="project">
<div class="project-header">
<h2 @click="goToLink">{{ projectName }}</h2>
<div class="header-actions">
<div class="dropdown-wrapper">
<!-- Empêche la propagation du clic vers le parent -->
<button class="contact-button" @click.stop="toggleDropdown">
Contact
</button>
<div class="project">
<div class="project-header">
<h2 @click="goToLink">{{ projectName }}</h2>
<div class="header-actions">
<div class="dropdown-wrapper">
<!-- Empêche la propagation du clic vers le parent -->
<button class="contact-button" @click.stop="toggleDropdown">
Contact
</button>
<div class="dropdown-menu" v-if="isDropdownOpen">
<button @click.stop="contactAll">Contacter tous</button>
<button
v-for="(email, index) in entrepreneurEmails"
:key="index"
@click.stop="contactSingle(email)"
>
{{ email }}
</button>
</div>
<div v-if="isDropdownOpen" class="dropdown-menu">
<button @click.stop="contactAll">Contacter tous</button>
<button
v-for="(email, index) in entrepreneurEmails"
:key="index"
@click.stop="contactSingle(email)"
>
{{ email }}
</button>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Toute cette partie est cliquable -->
<div class="project-body" @click="goToLink">
<ul>
<li v-for="(name, index) in listName" :key="index">
{{ name }}
</li>
</ul>
<!-- Toute cette partie est cliquable -->
<div class="project-body" @click="goToLink">
<ul>
<li v-for="(name, index) in listName" :key="index">
{{ name }}
</li>
</ul>
</div>
</div>
</div>
</template>
<script setup lang="ts">
import { defineProps, ref, onMounted, onBeforeUnmount } from "vue";
import { useRouter } from "vue-router";
@ -87,7 +86,7 @@ const fetchEntrepreneurs = async (
) => {
try {
const responseData: Entrepreneur[] = useMock
? await mockFetchEntrepreneurs(projectId)
? await mockFetchEntrepreneurs(/*projectId*/)
: (
await axios.get(
adnane marked this conversation as resolved Outdated
piair commented 2025-04-23 10:10:29 +02:00
Outdated
Review
Copy Link

We should not use axios.get EVER, it does not send the authentication token.

We should not use axios.get EVER, it does not send the authentication token.
`http://localhost:5000/shared/projects/entrepreneurs/${projectId}`
@ -98,7 +97,10 @@ const fetchEntrepreneurs = async (
(item: Entrepreneur) => item.primaryMail
);
} catch (error) {
console.error("Erreur lors de la récupération des entrepreneurs :", error);
console.error(
"Erreur lors de la récupération des entrepreneurs :",
error
);
}
};
@ -114,7 +116,7 @@ type Entrepreneur = {
sneeStatus: boolean;
};
adnane marked this conversation as resolved Outdated
piair commented 2025-04-23 10:11:36 +02:00
Outdated
Review
Copy Link

I don't love the fact that the mock tests are in the code here, it should be better to have a server. It's not a big probleme though

I don't love the fact that the mock tests are in the code here, it should be better to have a server. It's not a big probleme though
const mockFetchEntrepreneurs = async (projectId: number) => {
const mockFetchEntrepreneurs = async (/*projectId: number*/) => {
return new Promise<Entrepreneur[]>((resolve) => {
setTimeout(() => {
resolve([
@ -244,35 +246,35 @@ button:hover {
}
.dropdown-wrapper {
position: relative;
position: relative;
}
.dropdown-menu {
position: absolute;
top: 100%; /* juste en dessous du bouton */
right: 0;
background-color: white;
border: 1px solid #ccc;
padding: 0.5rem;
z-index: 1000;
display: flex;
flex-direction: column;
gap: 0.5rem;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
border-radius: 0.25rem;
min-width: 150px;
position: absolute;
top: 100%; /* juste en dessous du bouton */
right: 0;
background-color: white;
border: 1px solid #ccc;
padding: 0.5rem;
z-index: 1000;
display: flex;
flex-direction: column;
gap: 0.5rem;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
border-radius: 0.25rem;
min-width: 150px;
}
.dropdown-menu button {
text-align: left;
padding: 0.3rem 0.5rem;
background: none;
border: none;
cursor: pointer;
transition: background-color 0.2s;
text-align: left;
padding: 0.3rem 0.5rem;
background: none;
border: none;
cursor: pointer;
transition: background-color 0.2s;
}
.dropdown-menu button:hover {
background-color: #f0f0f0;
background-color: #f0f0f0;
}
</style>

49
front/MyINPulse-front/src/components/canvas/HeaderCanvas.vue
View File

@ -1,32 +1,31 @@
<template>
adnane marked this conversation as resolved
piair commented 2025-04-23 10:19:37 +02:00
Review
Copy Link

Doesn't this header overlap with the main app canvas ?

Doesn't this header overlap with the main app canvas ?
<header class="header">
<img src="../icons/logo inpulse.png" alt="INPulse Logo" class="logo" />
<header class="header">
<img src="../icons/logo inpulse.png" alt="INPulse Logo" class="logo" />
<div class="header-actions">
<div class="dropdown-wrapper" ref="dropdownRef">
<button class="contact-button" @click.stop="toggleDropdown">
Contact
</button>
<div
class="contact-dropdown"
:class="{ 'dropdown-visible': isDropdownOpen }"
>
<button @click="contactAll">Contacter tous</button>
<button
v-for="(email, index) in entrepreneurEmails"
:key="index"
@click="contactSingle(email)"
>
{{ email }}
</button>
<div class="header-actions">
<div ref="dropdownRef" class="dropdown-wrapper">
<button class="contact-button" @click.stop="toggleDropdown">
Contact
</button>
<div
class="contact-dropdown"
:class="{ 'dropdown-visible': isDropdownOpen }"
>
<button @click="contactAll">Contacter tous</button>
<button
v-for="(email, index) in entrepreneurEmails"
:key="index"
@click="contactSingle(email)"
>
{{ email }}
</button>
</div>
</div>
<RouterLink to="/" class="return-button">Retour</RouterLink>
</div>
</div>
<RouterLink to="/" class="return-button">Retour</RouterLink>
</div>
</header>
</header>
</template>
<script setup lang="ts">
import { ref, onMounted, onBeforeUnmount } from "vue";
import axios from "axios";
adnane marked this conversation as resolved Outdated
piair commented 2025-04-23 10:19:52 +02:00
Outdated
Review
Copy Link

I won't talk again about axios

I won't talk again about axios
@ -171,11 +170,9 @@ onMounted(() => {
document.addEventListener("click", handleClickOutside);
});
onBeforeUnmount(() => {
document.removeEventListener("click", handleClickOutside);
});
</script>
<style scoped>