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

feat: contact fixed

Browse Source
This commit is contained in:
ALAMI Adnane
2025-04-21 19:29:25 +02:00
parent bca88a7b20
commit 4b6d501adc
3 changed files with 163 additions and 112 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1,36 +1,38 @@
<template>
<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">
<button class="contact-button" @click="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 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>
</header>
</div>
<RouterLink to="/" class="return-button">Retour</RouterLink>
</div>
</header>
</template>
<script setup lang="ts">
import { ref, onMounted } from "vue";
import { ref, onMounted, onBeforeUnmount } from "vue";
import axios from "axios";
const IS_MOCK_MODE = true;
const dropdownRef = ref<HTMLElement | null>(null); // ref pour le dropdown
const props = defineProps<{
projectId: number;
@ -153,7 +155,27 @@ const copyToClipboard = (email: string) => {
};
*/
onMounted(() => fetchEntrepreneurs(props.projectId, IS_MOCK_MODE));
// Cacher le menu si on clique en dehors
const handleClickOutside = (event: MouseEvent) => {
if (
isDropdownOpen.value &&
dropdownRef.value &&
!dropdownRef.value.contains(event.target as Node)
) {
isDropdownOpen.value = false;
}
};
onMounted(() => {
fetchEntrepreneurs(props.projectId, IS_MOCK_MODE);
document.addEventListener("click", handleClickOutside);
});
onBeforeUnmount(() => {
document.removeEventListener("click", handleClickOutside);
});
</script>
<style scoped>