Ajoute le détail des demandes d'inscriptions (big update)
This commit is contained in:
		
							
								
								
									
										141
									
								
								frontend/src/Apps/AboutRequest.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										141
									
								
								frontend/src/Apps/AboutRequest.vue
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,141 @@ | ||||
| <script setup> | ||||
| import i18n from "@/i18n.js" | ||||
| import {getUser} from '../rest/Users.js' | ||||
| import {getcurriculum, getSomeonesCurriculumList} from "@/rest/curriculum.js"; | ||||
| import {getRegisters} from "@/rest/ServiceInscription.js"; | ||||
|  | ||||
| const props = defineProps(['target']); | ||||
| let request = await getRegisters(props.target); | ||||
| const cursus = await getcurriculum(request.curriculum); | ||||
|  | ||||
| function getPP(){ | ||||
|   if(request.profilePicture === null){ | ||||
|     return "/Clyde.png" | ||||
|   } | ||||
|   return request.profilePicture; | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <template> | ||||
|   <div class="body"> | ||||
|     <div class="container"> | ||||
|       <div class="profilPic"> | ||||
|         <img class="subContainter" :src=getPP()> | ||||
|       </div> | ||||
|       <div class = "globalInfos"> | ||||
|         <div class="infosContainer"> | ||||
|           <div> | ||||
|             FirstName/Name : {{request.firstName}} {{request.lastName}} | ||||
|           </div> | ||||
|           <div> | ||||
|             E-mail: {{request.email}} | ||||
|           </div> | ||||
|           <div> | ||||
|             Adresse : {{request.address}} | ||||
|           </div> | ||||
|           <div> | ||||
|             Pays : {{request.country}} | ||||
|           </div> | ||||
|           <div> | ||||
|             Date de naissance : {{request.birthDate}} | ||||
|           </div> | ||||
|           <div> | ||||
|             Cursus voulu : BAB {{cursus.year}} {{cursus.option}} | ||||
|           </div> | ||||
|         </div> | ||||
|       </div> | ||||
|     </div> | ||||
|   </div> | ||||
|  | ||||
| </template> | ||||
|  | ||||
|  | ||||
| <style scoped> | ||||
| .container{ | ||||
|   display:grid; | ||||
|   grid-template-columns:200px 900px; | ||||
|   grid-template-rows:200px auto; | ||||
|   column-gap:30px; | ||||
|   row-gap:45px; | ||||
|   grid-template-areas: | ||||
|   "profilPic globalInfos" | ||||
|   "minfos minfos"; | ||||
| } | ||||
|  | ||||
| .profilPic{ | ||||
|   grid-area:profilPic; | ||||
| } | ||||
|  | ||||
| .globalInfos { | ||||
|   grid-area:globalInfos; | ||||
|   align-self :center; | ||||
|  | ||||
| } | ||||
|  | ||||
| .body { | ||||
|   width:100%; | ||||
|   margin-bottom:10px; | ||||
| } | ||||
|  | ||||
| .subContainter{ | ||||
|   width:100%; | ||||
|   background-color:rgb(50,50,50); | ||||
|   border-radius:20px; | ||||
|   border:4px solid black; | ||||
| } | ||||
|  | ||||
| .infosContainer { | ||||
|   padding-bottom:50px; | ||||
|   border:2px solid black; | ||||
|   font-size:25px; | ||||
|   color:white; | ||||
|   padding:20px; | ||||
|   background-color:rgb(50,50,50); | ||||
|   border-radius:20px; | ||||
| } | ||||
|  | ||||
| .moreInfos { | ||||
|   display:grid; | ||||
|   grid-template-rows:200px auto; | ||||
|   column-gap:50px; | ||||
|   row-gap:45px; | ||||
|   grid-template-areas: | ||||
|   "minfos minfos"; | ||||
|   grid-template-columns:600px 600px; | ||||
| } | ||||
|  | ||||
| .listTitle{ | ||||
|   display: flex; | ||||
|   justify-content: center; | ||||
|   align-items: center; | ||||
|   width:250px; | ||||
|   margin-left:auto; | ||||
|   margin-right:auto; | ||||
|   border:2px solid black; | ||||
|   font-size:25px; | ||||
|   color:white; | ||||
|   padding:20px; | ||||
|   background-color:rgb(50,50,50); | ||||
|   border-radius:20px;margin-bottom:10px; | ||||
| } | ||||
|  | ||||
| .listElement{ | ||||
|   border:2px solid black; | ||||
|   font-size:25px; | ||||
|   color:white; | ||||
|   padding:20px; | ||||
|   background-color:rgb(50,50,50); | ||||
|   border-radius:20px; | ||||
|   margin-bottom:10px; | ||||
| } | ||||
|  | ||||
| .containerElement{ | ||||
|   justify-content:center; | ||||
|   display:grid; | ||||
|   grid-template-columns:100px 100px 300px; | ||||
|   grid-template-areas: | ||||
|     "year option dateyear"; | ||||
|   column-gap:40px; | ||||
|   padding-left: 25px; | ||||
| } | ||||
| </style> | ||||
| @ -2,9 +2,13 @@ | ||||
|   import i18n from "@/i18n.js" | ||||
|   import {ref} from 'vue' | ||||
|   import {validateRegister, getAllRegisters } from '@/rest/ServiceInscription.js' | ||||
|   import AboutRequest from "@/Apps/AboutRequest.vue"; | ||||
|  | ||||
|   const requests = ref(await getAllRegisters()); | ||||
|   console.log(requests); | ||||
|   let targetId = ""; | ||||
|  | ||||
|   //0 = liste, 1 = détails, 2 = sure? | ||||
|   let windowsState = ref(0); | ||||
|  | ||||
|   async function upPage(id,review){ | ||||
|     await validateRegister(id,review); | ||||
| @ -16,19 +20,29 @@ | ||||
|  | ||||
|  | ||||
| <template> | ||||
|   <div v-if="windowsState === 1"> | ||||
|     <AboutRequest :target="targetId"></AboutRequest> | ||||
|     <button style="background-color:rgb(105,05,105);" @click="windowsState=0;">Retour</button> | ||||
|   </div> | ||||
|   <div v-if="windowsState === 0"> | ||||
|     <div  v-for="item of requests"> | ||||
|     <div class="bodu" v-if="item.state === 'Pending'"> | ||||
|     <div class="container"> | ||||
|   | ||||
|       <div class="id"><a>{{item.id}}</a></div> | ||||
|       <div class="surname"><a>{{item.lastName}}</a></div> | ||||
|       <div class="firstname"><a>{{item.firstName}}</a></div> | ||||
|     <div class="infos"><button style="background-color:rgb(105,05,105);" >{{i18n("request.moreInfos")}}</button></div> | ||||
|     <div class="accept"><button @click="upPage(item.id,'Accepted')" style="background-color:rgb(0,105,50);">{{i18n("request.accept")}}</button></div> | ||||
|       <div class="infos"><button style="background-color:rgb(105,05,105);" @click="targetId=item.id;windowsState=1;">{{i18n("request.moreInfos")}}</button></div> | ||||
|       <div class="accept"><button @click="windowsState=2;targetId=item.id;" style="background-color:rgb(0,105,50);">{{i18n("request.accept")}}</button></div> | ||||
|       <div class="refuse"><button @click="upPage(item.id,'Refused')" style="background-color:rgb(105,0,0);">{{i18n("request.refuse")}}</button></div> | ||||
|     </div> | ||||
|     </div> | ||||
|     </div> | ||||
|   </div> | ||||
|   <div v-if="windowsState === 2"> | ||||
|     <p>Etes vous sur de vouloir accepter cette demande ?</p> | ||||
|     <button style="background-color:rgb(105,05,105);" @click="upPage(targetId,'Accepted');windowsState=0;">Valider</button> | ||||
|     <button style="background-color:rgb(105,05,105);" @click="windowsState=0;">Retour</button> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <style scoped> | ||||
|  | ||||
		Reference in New Issue
	
	Block a user