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 +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>
piair commented 2025-04-23 10:00:43 +02:00
Outdated
Review
Copy Link

The h2 from this file is the same as the h3 from the next (AgendaComponent). It would be better to have a single css file for this part.

The h2 from this file is the same as the h3 from the next (AgendaComponent). It would be better to have a single css file for this part.
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 {
adnane marked this conversation as resolved Outdated
piair commented 2025-04-23 10:12:28 +02:00
Outdated
Review
Copy Link

I personally hate that, can't we use an error mesage in green ?

I personally hate that, can't we use an error mesage in green ?
adnane commented 2025-04-23 12:04:37 +02:00
Outdated
Review
Copy Link

ok

ok
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[] }[]>([]);
piair commented 2025-04-23 10:26:42 +02:00
Outdated
Review
Copy Link

remove this comment

remove this comment
@ -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>