front_foundation #9

Closed
mohamed_maoulainine wants to merge 181 commits from front_foundation into main
6 changed files with 204 additions and 158 deletions
Showing only changes of commit 7c8f3ba36a - Show all commits

View File

@ -35,14 +35,13 @@
<button type="submit">Ajouter</button>
</form>
</template>
</template>
<script setup lang="ts">
import { ref } from "vue";
import { ref } from "vue";
import { postApi } from "@/services/api.ts";
const project = ref({
idProject: 0,
projectName: "",
creationDate: "",
logo: "to be discussed not yet fixed",
@ -54,6 +53,15 @@
</script>
<style scoped>
Outdated
Review

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 {
max-width: 500px;
margin: 0 auto;

View File

@ -2,12 +2,22 @@
<div id="agenda">
<h3>Rendez-vous</h3>
<table>
<tbody>
<tr v-for=" (p, index) in projectRDV" :key="index" >
<td>{{ p.projectName }} </td> <td>{{ p.date }}</td> <td>{{ p.lieu }}</td>
<thead>
<tr>
<th>Projet</th>
<th>Date</th>
<th>Lieu</th>
</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>
</div>
</template>
@ -26,10 +36,23 @@
</script>
<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 {
width: 100%;
@ -40,13 +63,13 @@
border: 1px solid #ccc;
}
/* Header Row (if exists) */
th {
background-color: #f4f4f4;
padding: 12px;
font-weight: bold;
border: 1px solid #ccc;
}
background-color: #f0f2f5;
padding: 12px;
font-weight: 600;
color: #333;
}
/* Table Body Rows */
tbody tr {

View File

@ -23,14 +23,24 @@ onMounted(() => {
if (roles.includes("MyINPulse-admin")) {
router.push("/");
} else if (roles.includes("entrepreneur")) {
router.push("/entrepreneur");
} else if (roles.includes("MyINPulse-entrepreneur")) {
router.push("/leanCanva");
}
} catch (err) {
console.error("Failed to decode token", err);
}
}
});
Review

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>
@ -170,4 +180,19 @@ h1 {
border: 1px solid #ccc;
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>

View File

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

View File

@ -40,91 +40,70 @@ const goToLink = () => {
<style scoped>
.project {
adnane marked this conversation as resolved Outdated
Outdated
Review

It would be better to use an ENV variable

It would be better to use an ENV variable
background: linear-gradient(to right, #f4f4f4, #ffffff);
border: 1px solid #ddd;
border-radius: 10px;
padding: 20px;
margin: 20px 0;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
font-family: Arial, sans-serif;
}
/* 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;
}
.info-btn {
background-color: #4CAF50;
color: #fff;
}
.info-btn:hover {
background-color: #45a049;
transform: scale(1.05);
}
.contact-btn {
background-color: #007BFF;
color: #fff;
}
.contact-btn:hover {
background-color: #0056b3;
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;
}
button {
padding: 10px 15px;
background-color: #007bff;
color: white;
border: none;
background: linear-gradient(to right, #f8f9fb, #ffffff);
border: 1px solid #e0e0e0;
border-radius: 16px;
padding: 1.5rem;
margin: 1.5rem 0;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
transition: box-shadow 0.3s ease;
cursor: pointer;
border-radius: 5px;
}
button:hover {
background-color: #0056b3;
}
.project:hover {
box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
}
.project-header {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 0.5rem;
}
.project-header h2 {
font-size: 1.25rem;
color: #222;
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-radius: 8px;
font-size: 0.9rem;
font-weight: 500;
transition: background-color 0.2s ease, transform 0.2s ease;
}
.contact-btn:hover {
background-color: #0056b3;
transform: translateY(-2px);
}
adnane marked this conversation as resolved Outdated
Outdated
Review

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.
.project-body {
margin-top: 1rem;
}
.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;
}
</style>

View File

@ -118,10 +118,28 @@ const rendezVous = ref([
<style scoped>
#container {
margin: 0;
display: grid;
grid-template-columns: 3fr 1fr; /* Main body takes 3/4, agenda 1/4 */
height: 100vh; /* Full viewport height */
display: grid;
grid-template-columns: 3fr 1fr;
gap: 2rem;
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 {
@ -130,10 +148,19 @@ button {
color: white;
border: none;
cursor: pointer;
border-radius: 5px;
border-radius: 6px;
font-weight: 500;
transition: background-color 0.2s ease;
}
button:hover {
background-color: #0056b3;
}
/* Add spacing between project sections */
#main > * + * {
margin-top: 2rem;
}
</style>