piair/MyINPulse
2
0
Fork 0
Code Issues Pull Requests 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 +214 -190
6 changed files with 214 additions and 190 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 36db3c2968 - Show all commits

14
front/MyINPulse-front/src/components/AddProjectForm.vue
View File

@ -35,14 +35,13 @@
<button type="submit">Ajouter</button> <button type="submit">Ajouter</button>
</form> </form>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { ref } from "vue"; import { ref } from "vue";
import { postApi } from "@/services/api.ts"; import { postApi } from "@/services/api.ts";
const project = ref({ const project = ref({
idProject: 0,
projectName: "", projectName: "",
creationDate: "", creationDate: "",
logo: "to be discussed not yet fixed", logo: "to be discussed not yet fixed",
@ -54,6 +53,15 @@
</script> </script>
<style scoped> <style scoped>
h2{
font-size: 1.5rem;
color: #333;
margin-bottom: 1.2rem;
border-bottom: 2px solid #ddd;
padding-bottom: 0.5rem;
}
.add-project-form { .add-project-form {
max-width: 500px; max-width: 500px;
margin: 0 auto; margin: 0 auto;

50
front/MyINPulse-front/src/components/Agenda.vue → front/MyINPulse-front/src/components/AgendaComponent.vue
View File

@ -2,12 +2,22 @@
<div id="agenda"> <div id="agenda">
<h3>Rendez-vous</h3> <h3>Rendez-vous</h3>
<table> <table>
<tbody> <thead>
<tr v-for=" (p, index) in projectRDV" :key="index" > <tr>
<td>{{ p.projectName }} </td> <td>{{ p.date }}</td> <td>{{ p.lieu }}</td> <th>Projet</th>
<th>Date</th>
<th>Lieu</th>
</tr> </tr>
</tbody> </thead>
<tbody>
<tr v-for="(p, index) in projectRDV" :key="index">
<td>{{ p.projectName }}</td>
<td>{{ p.date }}</td>
<td>{{ p.lieu }}</td>
</tr>
</tbody>
</table> </table>
</div> </div>
</template> </template>
@ -19,17 +29,31 @@
date: string, date: string,
lieu: string, lieu: string,
} }
const props = defineProps<{ const props = defineProps<{
Theo commented 2025-04-23 10:39:28 +02:00
Review
Copy Link

où est-ce que les RDV sont récupérés ?

où est-ce que les RDV sont récupérés ?
projectRDV: rendezVous[] projectRDV: rendezVous[]
}>(); }>();
</script> </script>
piair commented 2025-04-23 10:02:15 +02:00
Review
Copy Link

same comment as before, most of the style here is not for this part only, so it should not be here

same comment as before, most of the style here is not for this part only, so it should not be here
<style scoped> <style scoped>
#agenda {
padding: 20px; h3{
font-size: 1.5rem;
color: #333;
margin-bottom: 1.2rem;
border-bottom: 2px solid #ddd;
padding-bottom: 0.5rem;
} }
#agenda {
padding: 20px;
background-color: white;
border-radius: 10px;
box-shadow: 0 4px 6px rgba(0,0,0,0.05);
}
/* Table Styling */ /* Table Styling */
table { table {
width: 100%; width: 100%;
@ -40,13 +64,13 @@
border: 1px solid #ccc; border: 1px solid #ccc;
} }
/* Header Row (if exists) */
th { th {
background-color: #f4f4f4; background-color: #f0f2f5;
padding: 12px; padding: 12px;
font-weight: bold; font-weight: 600;
border: 1px solid #ccc; color: #333;
} }
/* Table Body Rows */ /* Table Body Rows */
tbody tr { tbody tr {

29
front/MyINPulse-front/src/components/LoginComponent.vue
View File

@ -23,14 +23,24 @@ onMounted(() => {
if (roles.includes("MyINPulse-admin")) { if (roles.includes("MyINPulse-admin")) {
router.push("/"); router.push("/");
} else if (roles.includes("entrepreneur")) { } else if (roles.includes("MyINPulse-entrepreneur")) {
router.push("/entrepreneur"); router.push("/leanCanva");
} }
} catch (err) { } catch (err) {
console.error("Failed to decode token", err); console.error("Failed to decode token", err);
} }
} }
}); });
/*
piair commented 2025-04-23 10:06:26 +02:00
Review
Copy Link

should this commented part really stay

should this commented part really stay
const loading = ref(false);
const callApiWithLoading = async (path: string) => {
loading.value = true;
await callApi(path);
loading.value = false;
};
*/
</script> </script>
@ -170,4 +180,19 @@ h1 {
border: 1px solid #ccc; border: 1px solid #ccc;
border-radius: 6px; border-radius: 6px;
} }
/*
.status {
padding: 0.5rem 1rem;
border-radius: 8px;
display: inline-block;
background-color: #e0f7e9;
color: #2e7d32;
}
*/
.status.error {
background-color: #ffe2e2;
color: #c62828;
}
</style> </style>

88
front/MyINPulse-front/src/components/PendingProjectComponent.vue
View File

@ -5,7 +5,7 @@
<h2>{{ projectName }}</h2> <h2>{{ projectName }}</h2>
<p>Projet mis le: {{ creationDate }}</p> <p>Projet mis le: {{ creationDate }}</p>
</div> </div>
<div class="project-button"> <div class="project-buttons">
<button id="accept" @click="acceptProject">Accepter</button> <button id="accept" @click="acceptProject">Accepter</button>
<button id="refus" @click="refuseProject">Refuser</button> <button id="refus" @click="refuseProject">Refuser</button>
</div> </div>
@ -56,20 +56,26 @@ const refuseProject = () => sendDecision("false");
<style scoped> <style scoped>
.project { .project {
background: linear-gradient(to right, #f4f4f4, #ffffff); background: linear-gradient(to right, #f8f9fb, #ffffff);
border: 1px solid #ddd; border: 1px solid #e0e0e0;
border-radius: 10px; border-radius: 16px;
padding: 20px; padding: 1.5rem;
margin: 20px 0; margin: 1.5rem 0;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
font-family: Arial, sans-serif; font-family: Arial, sans-serif;
transition: box-shadow 0.3s ease;
}
.project:hover {
box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
} }
/* Header Styling */
.project-header { .project-header {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: flex-start; align-items: center;
flex-wrap: wrap;
gap: 1rem;
} }
.project-title { .project-title {
@ -78,72 +84,50 @@ const refuseProject = () => sendDecision("false");
} }
.project-title h2 { .project-title h2 {
font-size: 20px; font-size: 1.25rem;
color: #333; color: #222;
margin: 0; margin: 0;
font-weight: 600;
} }
.project-title p { .project-title p {
font-size: 14px; font-size: 0.9rem;
color: #777; color: #666;
margin-top: 4px; margin-top: 0.25rem;
} }
/* Button Container */
.project-buttons { .project-buttons {
display: flex; display: flex;
gap: 10px; gap: 0.75rem;
}
#accept {
background-color: #45a049;
}
#refus {
background-color: red;
} }
button { button {
padding: 10px 15px; padding: 0.5rem 1.1rem;
color: white; color: white;
border: none; border: none;
border-radius: 8px;
font-size: 0.9rem;
font-weight: 500;
cursor: pointer; cursor: pointer;
border-radius: 5px; transition: background-color 0.2s ease, transform 0.2s ease;
} }
button:hover { #accept {
transform: scale(1.05); background-color: #4CAF50;
} }
#accept:hover { #accept:hover {
background-color: #3e8e41; background-color: #3e8e41;
transform: translateY(-2px);
}
#refus {
background-color: #e74c3c;
} }
#refus:hover { #refus:hover {
background-color: darkred; background-color: #c0392b;
} transform: translateY(-2px);
/* Project Body (unchanged) */
.project-body {
margin-top: 15px;
}
.project-body p {
font-size: 16px;
color: #555;
margin-bottom: 10px;
}
.project-body ul {
list-style-type: disc;
margin: 0;
padding-left: 20px;
}
.project-body ul li {
font-size: 14px;
color: #666;
line-height: 1.6;
} }
</style> </style>

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

@ -151,127 +151,83 @@ onMounted(() => fetchEntrepreneurs(props.projectId, IS_MOCK_MODE));
<style scoped> <style scoped>
.project { .project {
background: linear-gradient(to right, #f4f4f4, #ffffff); background: linear-gradient(to right, #f8f9fb, #ffffff);
border: 1px solid #ddd; border: 1px solid #e0e0e0;
border-radius: 10px; border-radius: 16px;
padding: 20px; padding: 1.5rem;
margin: 20px 0; margin: 1.5rem 0;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
font-family: Arial, sans-serif; transition: box-shadow 0.3s ease;
} cursor: pointer;
}
/* Header Styling */
.project-header {
display: flex;
justify-content: space-between;
align-items: center;
}
.project-header h2 {
font-size: 20px;
color: #333;
margin: 0;
}
/* Button Container */
.project-buttons {
display: flex;
gap: 10px;
}
.project:hover {
box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
}
.info-btn { .project-header {
background-color: #4CAF50;
color: #fff;
}
.info-btn:hover {
background-color: #45a049;
transform: scale(1.05);
}
.project-body {
margin-top: 15px;
}
.project-body p {
font-size: 16px;
color: #555;
margin-bottom: 10px;
}
.project-body ul {
list-style-type: disc;
margin: 0;
padding-left: 20px;
}
.project-body ul li {
font-size: 14px;
color: #666;
line-height: 1.6;
}
.header-actions {
display: flex; display: flex;
justify-content: space-between;
align-items: center; align-items: center;
gap: 20px; flex-wrap: wrap;
position: relative; gap: 0.5rem;
} }
.contact-button, .project-header h2 {
.return-button { font-size: 1.25rem;
background-color: #009CDE; color: #222;
color: white; margin: 0;
font-weight: 600;
}
.project-buttons {
display: flex;
gap: 0.5rem;
}
.contact-btn {
background-color: #007bff;
color: #fff;
padding: 0.5rem 1rem;
border: none; border: none;
padding: 10px 15px;
cursor: pointer;
font-size: 14px;
border-radius: 5px;
text-decoration: none;
transition: background-color 0.2s ease;
font-family: Arial, sans-serif;
}
.return-button:hover,
.contact-button:hover {
background-color: #007bad;
}
.contact-dropdown {
position: absolute;
top: 100%;
left: 0;
background-color: #000;
color: white;
box-shadow: 0px 4px 8px rgba(255, 255, 255, 0.2);
border-radius: 8px; border-radius: 8px;
padding: 10px; font-size: 0.9rem;
margin-top: 5px; font-weight: 500;
z-index: 1000; transition: background-color 0.2s ease, transform 0.2s ease;
min-width: 200px;
display: none;
} }
.contact-dropdown button { .contact-btn:hover {
display: block; background-color: #0056b3;
width: 100%; transform: translateY(-2px);
padding: 5px; }
text-align: left;
border: none; .project-body {
background: none; margin-top: 1rem;
cursor: pointer; }
.project-body ul {
list-style-type: disc;
padding-left: 1.25rem;
margin: 0;
}
.project-body ul li {
font-size: 0.95rem;
color: #555;
line-height: 1.6;
}
button {
padding: 10px 15px;
background-color: #007bff;
color: white; color: white;
border: none;
cursor: pointer;
border-radius: 5px;
} }
button:hover {
.contact-dropdown button:hover { background-color: #0056b3;
background-color: #009CDE; }
}
.contact-dropdown.dropdown-visible {
display: block;
}
</style> </style>

47
front/MyINPulse-front/src/views/AdminMain.vue
View File

@ -33,17 +33,17 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { ref, onMounted } from "vue"; import { ref/*, onMounted*/ } from "vue";
import { callApi } from "@/services/api"; //import { callApi } from "@/services/api";
import Header from "../components/HeaderComponent.vue"; import Header from "../components/HeaderComponent.vue";
import Agenda from "../components/Agenda.vue"; import Agenda from "../components/AgendaComponent.vue";
import ProjectComp from "../components/ProjectComponent.vue"; import ProjectComp from "../components/ProjectComponent.vue";
import PendingProjectComponent from "@/components/PendingProjectComponent.vue"; import PendingProjectComponent from "@/components/PendingProjectComponent.vue";
import AddProjectForm from "@/components/AddProjectForm.vue"; import AddProjectForm from "@/components/AddProjectForm.vue";
const PORT = "8081"; //const PORT = "8081";
const URI = `http://localhost:${PORT}`; //const URI = `http://localhost:${PORT}`;
//const projects = ref<{ name: string; link: string; members: string[] }[]>([]); //const projects = ref<{ name: string; link: string; members: string[] }[]>([]);
@ -119,10 +119,28 @@ const rendezVous = ref([
<style scoped> <style scoped>
#container { #container {
margin: 0; display: grid;
display: grid; grid-template-columns: 3fr 1fr;
grid-template-columns: 3fr 1fr; /* Main body takes 3/4, agenda 1/4 */ gap: 2rem;
height: 100vh; /* Full viewport height */ padding: 2rem;
background-color: #f4f6f9;
min-height: 100vh;
box-sizing: border-box;
}
#main {
background-color: #fff;
padding: 2rem;
border-radius: 12px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}
h3 {
font-size: 1.5rem;
color: #333;
margin-bottom: 1.2rem;
border-bottom: 2px solid #ddd;
padding-bottom: 0.5rem;
} }
button { button {
@ -131,10 +149,19 @@ button {
color: white; color: white;
border: none; border: none;
cursor: pointer; cursor: pointer;
border-radius: 5px; border-radius: 6px;
font-weight: 500;
transition: background-color 0.2s ease;
} }
button:hover { button:hover {
background-color: #0056b3; background-color: #0056b3;
} }
/* Add spacing between project sections */
#main > * + * {
margin-top: 2rem;
}
</style> </style>