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

Merge branch 'front_foundation' of https://gitea.piair.dev/piair/MyINPulse into front_foundation

Browse Source
This commit is contained in:
Mohamed Maoulainine Maoulainine 2025-02-25 22:53:26 +01:00
commit 0733f8d5af
4 changed files with 43 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
front/MyINPulse-front/fake_data/db.json
View File

@ -5,6 +5,6 @@
{ "id": 3, "name": "Charlie", "email": "charlie@example.com" } { "id": 3, "name": "Charlie", "email": "charlie@example.com" }
], ],
"data": [ "data": [
{ "data": "this is a fake data to test api" } { "canva_data": "this is a fake data to test api" }
] ]
} }

79
front/MyINPulse-front/src/components/canvas/CanvasItem.vue
View File

@ -16,7 +16,7 @@ import axios from "axios";
export default { export default {
props: { props: {
title: String, title: String,
description: String description: String,
}, },
setup(props) { setup(props) {
@ -26,7 +26,8 @@ export default {
const fetchData = async () => { const fetchData = async () => {
try { try {
const response = await axios.get("http://localhost:5000/data"); // to edit later! const response = await axios.get("http://localhost:5000/data"); // to edit later!
currentDescription.value = response.data.map(e => e.data); currentDescription.value = response.data[0].canva_data;
} catch (error) { } catch (error) {
console.error("Erreur lors de la récupération des données :", error); console.error("Erreur lors de la récupération des données :", error);
} }
@ -36,7 +37,7 @@ export default {
if (!expanded.value) { if (!expanded.value) {
await fetchData(); await fetchData();
} else { } else {
currentDescription.value = "3 problèmes essentiels à résoudre pour le client"; currentDescription.value = props.description;
} }
expanded.value = !expanded.value; expanded.value = !expanded.value;
}; };
@ -54,44 +55,44 @@ export default {
<style scoped> <style scoped>
@import "@/components/canvas/style-project.css"; @import "@/components/canvas/style-project.css";
.cell { .cell {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
text-align: center; text-align: center;
transition: all 0.3s ease; transition: all 0.3s ease;
cursor: pointer; cursor: pointer;
box-shadow: 0 4px 5px rgba(0, 0, 0, 0.1); box-shadow: 0 4px 5px rgba(0, 0, 0, 0.1);
} }
.cell:not(.expanded):hover { .cell:not(.expanded):hover {
transform: scale(1.05); transform: scale(1.05);
box-shadow: 0 8px 9px rgba(0, 0, 0, 0.2); box-shadow: 0 8px 9px rgba(0, 0, 0, 0.2);
} }
.cell h3 { .cell h3 {
font-size: 20px; font-size: 20px;
font-weight: 500; font-weight: 500;
/*margin-bottom: 10px;*/ /*margin-bottom: 10px;*/
} }
.cell p { .cell p {
font-size: 14px; font-size: 14px;
color: #666; color: #666;
} }
.expanded { .expanded {
position: fixed; position: fixed;
top: 0; top: 0;
left: 0; left: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
background: white; background: white;
z-index: 10; z-index: 10;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
} }
</style> </style>

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

@ -47,6 +47,7 @@ onMounted(fetchEntrepreneurs);
<style scoped> <style scoped>
@import "@/components/canvas/style-project.css";
header { header {
display: flex; display: flex;
@ -114,7 +115,4 @@ header img {
width: 100px; width: 100px;
height: auto; height: auto;
} }
@import "@/components/canvas/style-project.css";
</style> </style>

2
front/MyINPulse-front/src/components/canvas/LeanCanvas.vue
View File

@ -37,6 +37,7 @@ export default {
</script> </script>
<style scoped> <style scoped>
@import "@/components/canvas/style-project.css";
.canvas { .canvas {
display: grid; display: grid;
@ -61,5 +62,4 @@ export default {
.Indicateurs { grid-column: 3 / 5; grid-row: 3 / 5; } .Indicateurs { grid-column: 3 / 5; grid-row: 3 / 5; }
.Couts { grid-column: 1 / 6; grid-row: 5 / 7; } .Couts { grid-column: 1 / 6; grid-row: 5 / 7; }
.Revenus { grid-column: 6 / 11; grid-row: 5 / 7; } .Revenus { grid-column: 6 / 11; grid-row: 5 / 7; }
</style> </style>