Merge branch 'master' into Max/Backend/Curriculum
This commit is contained in:
		@ -8,11 +8,13 @@
 | 
			
		||||
  import LoginPage from './Apps/Login.vue'
 | 
			
		||||
  import Inscription from "./Apps/Inscription.vue"
 | 
			
		||||
  import Profil from "./Apps/Profil.vue"
 | 
			
		||||
  import Courses from "./Apps/ManageCourses.vue" 
 | 
			
		||||
 | 
			
		||||
  const apps = {
 | 
			
		||||
  	'/login': LoginPage,
 | 
			
		||||
	'/inscription': Inscription,
 | 
			
		||||
  '/profil': Profil
 | 
			
		||||
  '/profil': Profil,
 | 
			
		||||
  '/manage-courses' : Courses,
 | 
			
		||||
  }
 | 
			
		||||
  const currentPath = ref(window.location.hash)
 | 
			
		||||
 | 
			
		||||
@ -39,7 +41,7 @@
 | 
			
		||||
      <ul class="horizontal">
 | 
			
		||||
        <li title=home>
 | 
			
		||||
            <a class="icon" href="#home">
 | 
			
		||||
                <img @click="draw" src="./assets/Clyde.png" style="width: 40px; height: auto; margin-top:4px">
 | 
			
		||||
                <img class="clyde" src="./assets/Clyde.png" style="width: 40px; height: auto; margin-top:4px">
 | 
			
		||||
            </a></li>
 | 
			
		||||
        <li title=home>
 | 
			
		||||
            <a class="icon" href="#home">
 | 
			
		||||
@ -57,7 +59,7 @@
 | 
			
		||||
            <a class="icon" >
 | 
			
		||||
                <div  class="fa-solid fa-gear"  style="margin-top: 7px; margin-bottom: 3px;"></div>
 | 
			
		||||
                <div v-if="active" class="dropdown">
 | 
			
		||||
                  <div class="dropdown-content">Langage</div>
 | 
			
		||||
                  <div class="dropdown-content">{{i18n("app.language")}}</div>
 | 
			
		||||
                  <ul style="list-style-type:none;">
 | 
			
		||||
                    <li style=" margin-bottom:10px;margin-right:20px;float:left; font-size:10px; color:black;">
 | 
			
		||||
                      <button @:click="setLang('en');" href="#home">EN</button>
 | 
			
		||||
@ -67,7 +69,7 @@
 | 
			
		||||
                  </ul>
 | 
			
		||||
                  <div style='align-items:center;'>
 | 
			
		||||
                  <a style="cursor:pointer;font-size:20px;" href="#/profil" class="dropdown-content">
 | 
			
		||||
                    Manage Profile
 | 
			
		||||
                    {{i18n("app.manage.profile")}}
 | 
			
		||||
                  </a>
 | 
			
		||||
                  </div>
 | 
			
		||||
 | 
			
		||||
@ -97,8 +99,12 @@
 | 
			
		||||
            <div class="fa-solid fa-envelope" style="font-size: 40px;" ></div>
 | 
			
		||||
            <div class="text">{{i18n("app.forum")}}</div></a></li>
 | 
			
		||||
        <li><a href="#/inscription">
 | 
			
		||||
            <div class="fa-solid fa-users" style="font-size: 40px;"></div>
 | 
			
		||||
            <div class="text">{{i18n("app.inscription.requests")}}</div></a></li>
 | 
			
		||||
            <div class="fa-solid fa-users" style="align-self:center;font-size: 40px;"></div>
 | 
			
		||||
            <div class="text" style="top:0;">{{i18n("app.inscription.requests")}}</div></a></li>
 | 
			
		||||
 | 
			
		||||
        <li><a href="#/manage-courses">
 | 
			
		||||
            <div class="fa-solid fa-book" style="align-self:center;font-size: 40px;overflow:none;"></div>
 | 
			
		||||
            <div class="text">{{i18n("app.manage.courses")}}</div></a></li>
 | 
			
		||||
    </ul>
 | 
			
		||||
 | 
			
		||||
    </div>
 | 
			
		||||
@ -246,7 +252,6 @@
 | 
			
		||||
	  }
 | 
			
		||||
 | 
			
		||||
	  .text {
 | 
			
		||||
		position: absolute;
 | 
			
		||||
		right: 0%;
 | 
			
		||||
		width: 0%;
 | 
			
		||||
		opacity: 0;
 | 
			
		||||
@ -258,9 +263,13 @@
 | 
			
		||||
 | 
			
		||||
	  ul.vertical:hover .text {
 | 
			
		||||
		opacity: 1;
 | 
			
		||||
		width: 70%;
 | 
			
		||||
		width: 60%;
 | 
			
		||||
		transition-duration: .3s;
 | 
			
		||||
		padding-left: 5px;
 | 
			
		||||
		padding-left: 15px;
 | 
			
		||||
	  }
 | 
			
		||||
 | 
			
		||||
	  .clyde:hover{
 | 
			
		||||
		  content: url("./assets/angry_clyde.png")
 | 
			
		||||
	  }
 | 
			
		||||
    
 | 
			
		||||
</style>
 | 
			
		||||
 | 
			
		||||
@ -1,32 +1,10 @@
 | 
			
		||||
<script setup>
 | 
			
		||||
  import Req from "./Request.vue"
 | 
			
		||||
  const requests_example = [ {
 | 
			
		||||
  id:0,
 | 
			
		||||
  type:"Inscription",
 | 
			
		||||
  lastName:"DoefenschmirtzLEMAGNIFIQUE",
 | 
			
		||||
  firstName:"Jhon",
 | 
			
		||||
  address: "Radiator Springs",
 | 
			
		||||
  country: "USA",
 | 
			
		||||
  birthdate:"2004-02-02",
 | 
			
		||||
  email:"JohnDoe@gmail.com",
 | 
			
		||||
  cursus:"IT",
 | 
			
		||||
  degree:"BAC1",
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
  id:1,
 | 
			
		||||
  type:"ReInscription",
 | 
			
		||||
  lastName:"Doe",
 | 
			
		||||
  firstName:"Jane",
 | 
			
		||||
  address: "Radiator Springs",
 | 
			
		||||
  country: "USA",
 | 
			
		||||
  birthdate:"2004-03-03",
 | 
			
		||||
  email:"JaneDoe@gmail.com",
 | 
			
		||||
  cursus:"Psychology",
 | 
			
		||||
  degree:"BAC1",
 | 
			
		||||
}]
 | 
			
		||||
  import { getRegisters } from '@/rest/ServiceInscription.js'
 | 
			
		||||
 | 
			
		||||
  const requests_example = getRegisters();
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
<template>
 | 
			
		||||
  <Req v-for="item of requests_example" v-bind="item">
 | 
			
		||||
      </Req>
 | 
			
		||||
  <Req v-for="item of requests_example"/>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
@ -1,28 +1,25 @@
 | 
			
		||||
<script setup>
 | 
			
		||||
  import { login , register} from '@/rest/Users.js'
 | 
			
		||||
  import { ref } from 'vue'
 | 
			
		||||
  import i18n from '@/i18n.js'
 | 
			
		||||
  import { login , register } from '@/rest/Users.js'
 | 
			
		||||
  import { uploadProfilePicture } from '@/rest/uploads.js'
 | 
			
		||||
 | 
			
		||||
  const loginPage= ref(true)
 | 
			
		||||
  const page = ref(0)
 | 
			
		||||
 | 
			
		||||
  const emailID=ref("")
 | 
			
		||||
  const passwordIN=ref("")
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
  const submitValue= ref(i18n("login.guest.submit"))
 | 
			
		||||
  const surname=ref("")
 | 
			
		||||
  const firstname=ref("")
 | 
			
		||||
  const passwordOUT=ref("")
 | 
			
		||||
  const password=ref("")
 | 
			
		||||
  const passwordConfirm=ref("")
 | 
			
		||||
  const birthday=ref("")
 | 
			
		||||
  const emailOUT=ref("")
 | 
			
		||||
  const email=ref("")
 | 
			
		||||
  const address=ref("")
 | 
			
		||||
  const country=ref("")
 | 
			
		||||
  const cursus=ref("")
 | 
			
		||||
  const loginInfos = [{_emailID:emailID},{_passwordIN:passwordIN}]
 | 
			
		||||
  const registerInfos= [{_surname:surname},{_firstname:firstname},{_birthday:birthday},{_passwordOUT:passwordOUT},
 | 
			
		||||
  {_passwordConfirm:passwordConfirm},{_emailOUT:emailOUT},{_address:address},{_country:country},{_cursus:cursus}]
 | 
			
		||||
 
 | 
			
		||||
  const imageSaved = ref(false)
 | 
			
		||||
  const ppData = ref(false)
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
@ -30,17 +27,17 @@
 | 
			
		||||
      <div class='loginBox'>
 | 
			
		||||
 | 
			
		||||
        <div v-if="loginPage">
 | 
			
		||||
          <form @submit.prevent="login(emailID, passwordIN)"class="form">
 | 
			
		||||
          <form @submit.prevent="login(email, password)"class="form">
 | 
			
		||||
            <h1 style="color:rgb(239,60,168); font-family: sans-serif;">
 | 
			
		||||
              {{i18n("login.guest.signin")}}
 | 
			
		||||
            </h1>
 | 
			
		||||
            <div class="inputBox">
 | 
			
		||||
              <p>ID / {{i18n("login.guest.email")}}</p> 
 | 
			
		||||
              <input type="text" v-model="emailID">
 | 
			
		||||
              <input type="text" v-model="email">
 | 
			
		||||
            </div>
 | 
			
		||||
            <div class="inputBox">
 | 
			
		||||
              <p>{{i18n("login.guest.password")}}</p>
 | 
			
		||||
              <input type="password" v-model="passwordIN">
 | 
			
		||||
              <input type="password" v-model="password">
 | 
			
		||||
            </div>
 | 
			
		||||
            <div class="register">
 | 
			
		||||
              <a @click="loginPage=!loginPage">{{i18n("login.guest.register")}}</a>
 | 
			
		||||
@ -52,7 +49,7 @@
 | 
			
		||||
        </div>
 | 
			
		||||
 | 
			
		||||
        <div v-else>
 | 
			
		||||
          <form @submit.prevent="register(surname,firstname,emailOUT)" class="form">
 | 
			
		||||
          <form @submit.prevent="register(firstname, surname, birthday, password, mail, address, country, cursus)" class="form">
 | 
			
		||||
            <h1 style="color:rgb(239,60,168); font-family: sans-serif; text-align:center;">
 | 
			
		||||
              {{i18n("login.guest.welcome")}}
 | 
			
		||||
            </h1>
 | 
			
		||||
@ -71,11 +68,12 @@
 | 
			
		||||
              </div>
 | 
			
		||||
              <div class="inputBox">
 | 
			
		||||
                 <p>{{i18n("login.guest.password")}}</p>
 | 
			
		||||
                 <input type="password" v-model="passwordOUT">
 | 
			
		||||
                 <input type="password" v-model="password">
 | 
			
		||||
              </div>
 | 
			
		||||
              <div class="inputBox">
 | 
			
		||||
                <p>{{i18n("login.guest.confirm")}} {{i18n("login.guest.password")}}</p>
 | 
			
		||||
                 <input type="password" v-model="passwordConfirm">
 | 
			
		||||
				 <!-- TODO: Verify password is same as passwordConfirm -->
 | 
			
		||||
              </div>
 | 
			
		||||
              
 | 
			
		||||
              <div class="switchpage">
 | 
			
		||||
@ -89,7 +87,7 @@
 | 
			
		||||
            <div v-else>
 | 
			
		||||
              <div class="inputBox">
 | 
			
		||||
                <p>{{i18n("login.guest.email")}}</p>
 | 
			
		||||
                <input type="mail" v-model="emailOUT">
 | 
			
		||||
                <input type="mail" v-model="email">
 | 
			
		||||
              </div>
 | 
			
		||||
              <div class="inputBox">
 | 
			
		||||
                <p>{{i18n("login.guest.address")}}</p>
 | 
			
		||||
@ -99,8 +97,12 @@
 | 
			
		||||
                <p>{{i18n("login.guest.country")}}</p>
 | 
			
		||||
                <input type="text" v-model="country">
 | 
			
		||||
              </div>
 | 
			
		||||
              <form novalidate enctype="multipart/form-data" class="inputBox">
 | 
			
		||||
              	<p>ProfilePicture</p> 
 | 
			
		||||
				<input type="file" :disabled="imageSaved" @change="ppData = uploadProfilePicture($event.target.files); imageSaved = true;" accept="image/*">
 | 
			
		||||
              </form>
 | 
			
		||||
              <div class="inputBox">
 | 
			
		||||
                <p>CURSUS</p> 
 | 
			
		||||
                <p>{{i18n("curriculum").toUpperCase()}}</p> 
 | 
			
		||||
                  <select v-model="cursus">
 | 
			
		||||
                    <option value="Chemistry">Chemistry</option>
 | 
			
		||||
                    <option value="Psycho">Psychology</option>
 | 
			
		||||
@ -165,7 +167,6 @@
 | 
			
		||||
.inputBox input,button,select {
 | 
			
		||||
  
 | 
			
		||||
  width:100%;
 | 
			
		||||
  background:rgb(255, 0 255);
 | 
			
		||||
  border: none;
 | 
			
		||||
  margin-right: 50px;
 | 
			
		||||
  padding-left: 10px;
 | 
			
		||||
 | 
			
		||||
							
								
								
									
										279
									
								
								frontend/src/Apps/ManageCourses.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										279
									
								
								frontend/src/Apps/ManageCourses.vue
									
									
									
									
									
										Normal file
									
								
							@ -0,0 +1,279 @@
 | 
			
		||||
<script setup>
 | 
			
		||||
  import i18n from "@/i18n.js"
 | 
			
		||||
  import {ref} from 'vue'
 | 
			
		||||
const cursus=[
 | 
			
		||||
  {
 | 
			
		||||
  "id": 12,
 | 
			
		||||
  "name": "Math pour l'info",
 | 
			
		||||
  "credits": 11,
 | 
			
		||||
  "faculty": "science",
 | 
			
		||||
  "teacher": 42,
 | 
			
		||||
  "Assistants": []},
 | 
			
		||||
  {
 | 
			
		||||
  "id": 42,
 | 
			
		||||
  "name": "Operating Systems",
 | 
			
		||||
  "credits": 8,
 | 
			
		||||
  "faculty": "science",
 | 
			
		||||
  "teacher": 62,
 | 
			
		||||
  "Assistants": []},
 | 
			
		||||
  {
 | 
			
		||||
  "id": 52,
 | 
			
		||||
  "name": "Fonctionnement des ordinateurs",
 | 
			
		||||
  "credits": 11,
 | 
			
		||||
  "faculty": "science",
 | 
			
		||||
  "teacher": 59,
 | 
			
		||||
  "Assistants": []},
 | 
			
		||||
 | 
			
		||||
  ]
 | 
			
		||||
 | 
			
		||||
  const profList=[42,45,62,84,59]
 | 
			
		||||
 | 
			
		||||
  const createMod = ref(false)
 | 
			
		||||
  const deleteMod = ref(false)
 | 
			
		||||
 | 
			
		||||
  const editElementID = ref(""); 
 | 
			
		||||
 | 
			
		||||
  function editItem(id){
 | 
			
		||||
    editElementID = id;
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  //Juste pour montrer le Create Mode
 | 
			
		||||
  const pattern = {
 | 
			
		||||
 | 
			
		||||
  "id": 0,
 | 
			
		||||
  "name": null,
 | 
			
		||||
  "credits": null,
 | 
			
		||||
  "faculty": null,
 | 
			
		||||
  "teacher": null,
 | 
			
		||||
  "Assistants": []}
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
  let toAdd = Object.assign({}, pattern);
 | 
			
		||||
 | 
			
		||||
  function addToCourse (){
 | 
			
		||||
  if (cursus.length>0){
 | 
			
		||||
    toAdd.id=(cursus[cursus.length-1].id)-1;}
 | 
			
		||||
    else{
 | 
			
		||||
    toAdd.id=0;
 | 
			
		||||
    }
 | 
			
		||||
    let isnull= false;
 | 
			
		||||
    for(const [key, value] of Object.entries(toAdd)){
 | 
			
		||||
      if(value === null){
 | 
			
		||||
        isnull=true;
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
      if (!isnull){
 | 
			
		||||
      cursus.push(toAdd);
 | 
			
		||||
      }
 | 
			
		||||
      toAdd= Object.assign({},pattern);
 | 
			
		||||
    } 
 | 
			
		||||
  
 | 
			
		||||
 | 
			
		||||
  //Juste pour montrer le Delete Mode
 | 
			
		||||
  let toRemove;
 | 
			
		||||
 | 
			
		||||
  function removeCourse() {
 | 
			
		||||
  console.log("ok");
 | 
			
		||||
  console.log(toRemove);
 | 
			
		||||
  let rem=-1;
 | 
			
		||||
  for(const [key, value] of Object.entries(cursus)){
 | 
			
		||||
    console.log(key);
 | 
			
		||||
    console.log(value)
 | 
			
		||||
    if(value.name === toRemove){
 | 
			
		||||
         rem = key;
 | 
			
		||||
        break;
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
    console.log(rem)
 | 
			
		||||
  if (rem > -1){
 | 
			
		||||
    cursus.splice(rem, 1);}
 | 
			
		||||
  console.log(cursus);
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
</script>
 | 
			
		||||
<template>
 | 
			
		||||
  <div class="body">
 | 
			
		||||
    <div v-if="!deleteMod && !createMod" class="listTitle buttonGrid">
 | 
			
		||||
      <button class="create" @click="createMod = true">
 | 
			
		||||
        {{i18n("courses.createCourse")}}
 | 
			
		||||
      </button>
 | 
			
		||||
      <button class="delete" @click="deleteMod=true" >
 | 
			
		||||
        {{i18n("courses.deleteCourse")}}
 | 
			
		||||
      </button>
 | 
			
		||||
    </div>
 | 
			
		||||
    <div v-if="createMod">
 | 
			
		||||
      <form class="listElement">
 | 
			
		||||
        <div style="margin-bottom:20px;">
 | 
			
		||||
         {{i18n("name")}} : 
 | 
			
		||||
        <input v-model="toAdd.name">
 | 
			
		||||
        </div>
 | 
			
		||||
        <div style="margin-bottom:20px;">
 | 
			
		||||
          {{i18n("teacher")}} : 
 | 
			
		||||
         <select style="max-width:200px;" class="teacher" v-model="toAdd.teacher">
 | 
			
		||||
          <option v-for="item in profList">{{item}}</option>
 | 
			
		||||
        </select>
 | 
			
		||||
        </div>
 | 
			
		||||
        <div style="margin-bottom:20px;">
 | 
			
		||||
          {{i18n("credits")}} : 
 | 
			
		||||
        <input v-model="toAdd.credits">
 | 
			
		||||
        </div>
 | 
			
		||||
        <div style="margin-bottom:20px;">
 | 
			
		||||
          {{i18n("faculty")}} : 
 | 
			
		||||
        <input v-model="toAdd.faculty">
 | 
			
		||||
        </div>
 | 
			
		||||
      <button class="create" @click="createMod=!createMod; addToCourse();"> {{i18n("courses.confirm")}} </button>
 | 
			
		||||
      <button style="float:right;" @click="createMod=!createMod">{{i18n("courses.back")}}</button>
 | 
			
		||||
      </form>
 | 
			
		||||
    </div>
 | 
			
		||||
    <div v-if="deleteMod">
 | 
			
		||||
      <form class="listElement">
 | 
			
		||||
        <div style="margin-bottom:20px;">
 | 
			
		||||
          {{i18n("courses.toDelete")}} :
 | 
			
		||||
         <select style="max-width:200px;" class="teacher" v-model="toRemove">
 | 
			
		||||
          <option v-for="item in cursus">{{item.name}}</option>
 | 
			
		||||
          
 | 
			
		||||
        </select>
 | 
			
		||||
        </div>
 | 
			
		||||
        <div style="margin-bottom:20px;">
 | 
			
		||||
          {{i18n("login.password")}}: 
 | 
			
		||||
        <input >
 | 
			
		||||
        </div>
 | 
			
		||||
        <div style="margin-bottom:20px;">
 | 
			
		||||
          {{i18n("login.cPassword")}} : 
 | 
			
		||||
        <input>
 | 
			
		||||
        </div>
 | 
			
		||||
        <button class="delete" @click="deleteMod=!deleteMod;removeCourse();"> {{i18n("courses.deleteCourse")}} </button>
 | 
			
		||||
        <button style="float:right;" @click="deleteMod=!deleteMod"> {{i18n("courses.back")}}</button>
 | 
			
		||||
      </form>
 | 
			
		||||
    </div>
 | 
			
		||||
 | 
			
		||||
    <div v-if="!createMod && !deleteMod" v-for="item in cursus" :key="item.name">
 | 
			
		||||
      <div style ="padding:15px 15px 15px 15px;">
 | 
			
		||||
      <button  v-if="editElementID !== item.name"  @click="editElementID = item.name">
 | 
			
		||||
        {{i18n("courses.modify")}}
 | 
			
		||||
      </button>
 | 
			
		||||
      <button v-else @click="editElementID= ''"> {{i18n("courses.confirm")}} </button>
 | 
			
		||||
      </div>
 | 
			
		||||
      <div  class="listElement" > 
 | 
			
		||||
      <div class="containerElement" v-if="editElementID !== item.name" >
 | 
			
		||||
 | 
			
		||||
        <div class="name"> {{item.name}} </div>
 | 
			
		||||
        <div class="teacher">{{item.teacher}}</div> 
 | 
			
		||||
        <div class="credits">{{i18n("credits")}}:{{item.credits}}</div>  
 | 
			
		||||
      </div>
 | 
			
		||||
      <div class="containerElement"v-else>
 | 
			
		||||
        <input style="max-width:200px;" class="name" v-model="item.name">
 | 
			
		||||
        <select style="max-width:200px;" class="teacher" v-model="item.teacher">
 | 
			
		||||
          <option v-for="item in profList">{{item}}</option>
 | 
			
		||||
        </select>
 | 
			
		||||
        <input style="max-width:100px;"class="credits" v-model="item.credits">  
 | 
			
		||||
      </div>
 | 
			
		||||
    </div>
 | 
			
		||||
    </div>
 | 
			
		||||
  </div>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<style scoped>
 | 
			
		||||
.body {
 | 
			
		||||
    width:100%;
 | 
			
		||||
    margin-bottom:10px;
 | 
			
		||||
  }
 | 
			
		||||
 .containerElement{ 
 | 
			
		||||
   justify-content:center;
 | 
			
		||||
    display:grid;
 | 
			
		||||
    grid-template-columns:350px 350px 200px;
 | 
			
		||||
    grid-template-areas:
 | 
			
		||||
    "name teacher credits"; 
 | 
			
		||||
    column-gap:10px;
 | 
			
		||||
    
 | 
			
		||||
  }
 | 
			
		||||
  
 | 
			
		||||
  .name {
 | 
			
		||||
    grid-area:name;
 | 
			
		||||
    align-self:center;
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  .teacher{
 | 
			
		||||
    grid-area:teacher;
 | 
			
		||||
    align-self:center;
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  .credits{
 | 
			
		||||
    grid-area:credits;
 | 
			
		||||
    align-self:center;
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
.listElement{
 | 
			
		||||
  border:2px solid black;
 | 
			
		||||
  font-size:25px;
 | 
			
		||||
  color:white;
 | 
			
		||||
  padding:20px;
 | 
			
		||||
  background-color:rgb(50,50,50);
 | 
			
		||||
  border-radius:20px;
 | 
			
		||||
  margin-bottom:10px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.modify{
 | 
			
		||||
  font-size:25px;
 | 
			
		||||
  padding:10px 10px 10px 10px;
 | 
			
		||||
  background-color: rgb(239,60,168);
 | 
			
		||||
  cursor: pointer;
 | 
			
		||||
  border:none;
 | 
			
		||||
  border-radius:15px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
  input, select{
 | 
			
		||||
  padding:10px 10px 10px 10px; 
 | 
			
		||||
  font-size:25px;
 | 
			
		||||
  cursor: pointer;
 | 
			
		||||
  border:none;
 | 
			
		||||
  border-radius:15px;
 | 
			
		||||
  }
 | 
			
		||||
  button{
 | 
			
		||||
    font-size:15px;
 | 
			
		||||
     height:50px;
 | 
			
		||||
     width:100px;
 | 
			
		||||
    border:none;
 | 
			
		||||
    border-radius:20px;
 | 
			
		||||
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  .buttonGrid{
 | 
			
		||||
    display:grid;
 | 
			
		||||
    grid-template-columns: auto auto;
 | 
			
		||||
    column-gap:50px;
 | 
			
		||||
    grid-template-areas:
 | 
			
		||||
      "create delete";
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  .create{
 | 
			
		||||
    grid-area:create;
 | 
			
		||||
    
 | 
			
		||||
    background-color:rgb(0,200,0);
 | 
			
		||||
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  .delete{
 | 
			
		||||
    grid-area:delete;
 | 
			
		||||
    background-color:rgb(200,0,0);
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  .listTitle{
 | 
			
		||||
    display: flex;
 | 
			
		||||
    justify-content: center;
 | 
			
		||||
    align-items: center;
 | 
			
		||||
    width:400px;
 | 
			
		||||
    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;
 | 
			
		||||
 | 
			
		||||
    button:hover{
 | 
			
		||||
      opacity:0.8;
 | 
			
		||||
    }
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
@ -1,6 +1,7 @@
 | 
			
		||||
<script setup>
 | 
			
		||||
  import {reactive, ref} from 'vue'
 | 
			
		||||
  import {getUser} from '../rest/Users.js'
 | 
			
		||||
  import i18n from "@/i18n.js"
 | 
			
		||||
 /* 
 | 
			
		||||
  const user = getUser(); 
 | 
			
		||||
*/
 | 
			
		||||
@ -84,23 +85,23 @@ const toModify = Object.assign({}, user);
 | 
			
		||||
            E-mail: {{user.email}}      
 | 
			
		||||
          </div>
 | 
			
		||||
          <div v-if="user.role==='student'">
 | 
			
		||||
            {{user.option}} {{user.role.toUpperCase()}} 
 | 
			
		||||
            {{user.option}} {{i18n(user.role).toUpperCase()}} 
 | 
			
		||||
          </div>
 | 
			
		||||
          <div v-else>
 | 
			
		||||
            Faculty: {{user.faculty}} 
 | 
			
		||||
            Role: {{user.role}}
 | 
			
		||||
            {{i18n("faculty")}}: {{user.faculty}} 
 | 
			
		||||
            Role:  {{i18n(user.role).toUpperCase()}} 
 | 
			
		||||
          </div>
 | 
			
		||||
          <div>
 | 
			
		||||
            <button @click="modif=!modif"> Modifier données personnelles </button>
 | 
			
		||||
            <button @click="modif=!modif"> {{i18n("profile.modify.data")}} </button>
 | 
			
		||||
          </div>
 | 
			
		||||
          <div v-if="(user.role==='student')">
 | 
			
		||||
            <button>Réinscription</button>
 | 
			
		||||
            <button style="float:right;background-color:rgb(150,0,0);">Désinscription</button>
 | 
			
		||||
            <button>{{i18n("profile.reRegister")}}</button>
 | 
			
		||||
            <button style="float:right;background-color:rgb(150,0,0);">{{i18n("profile.unRegister")}}</button>
 | 
			
		||||
          </div>
 | 
			
		||||
        </div>
 | 
			
		||||
        <div v-else class="infosContainer">
 | 
			
		||||
          <div>
 | 
			
		||||
            Profil Picture
 | 
			
		||||
            {{i18n("profile.picture")}}:
 | 
			
		||||
            <input type="file">
 | 
			
		||||
          </div>
 | 
			
		||||
          <div>
 | 
			
		||||
@ -108,19 +109,19 @@ const toModify = Object.assign({}, user);
 | 
			
		||||
            <input type="mail" v-model="toModify.email" />
 | 
			
		||||
          </div>
 | 
			
		||||
          <div>
 | 
			
		||||
            Address:
 | 
			
		||||
            {{i18n("profile.address")}}:
 | 
			
		||||
            <input type="text" v-model="toModify.address">
 | 
			
		||||
          </div>
 | 
			
		||||
          <div>
 | 
			
		||||
            Password
 | 
			
		||||
            {{i18n("login.password")}}:
 | 
			
		||||
            <input type="password" v-model="toModify.password">
 | 
			
		||||
          </div>
 | 
			
		||||
          <div>
 | 
			
		||||
            Confirm Password
 | 
			
		||||
            {{i18n("login.cPassword")}}:
 | 
			
		||||
            <input type="password" id="confirm">
 | 
			
		||||
          </div>
 | 
			
		||||
          <div>
 | 
			
		||||
            <button @click=" modif=!modif">Confirm</button>
 | 
			
		||||
            <button @click=" modif=!modif">{{i18n("courses.confirm")}}</button>
 | 
			
		||||
          </div>
 | 
			
		||||
        </div>
 | 
			
		||||
      </div>
 | 
			
		||||
@ -128,7 +129,7 @@ const toModify = Object.assign({}, user);
 | 
			
		||||
 | 
			
		||||
        <div v-if="(user.role==='student')">
 | 
			
		||||
          <div class="listTitle">
 | 
			
		||||
           Liste des cours
 | 
			
		||||
            {{i18n("profile.course.list")}}
 | 
			
		||||
          </div>
 | 
			
		||||
        <div  class="listElement "
 | 
			
		||||
          v-for="item in user.cursus">
 | 
			
		||||
@ -145,7 +146,7 @@ const toModify = Object.assign({}, user);
 | 
			
		||||
    
 | 
			
		||||
      <div v-if="(user.role==='teacher')">
 | 
			
		||||
          <div class="listTitle">
 | 
			
		||||
           Liste des cours
 | 
			
		||||
            {{i18n("profile.course.list")}}
 | 
			
		||||
          </div>
 | 
			
		||||
          <div class="listElement " v-for="item in user.coursesOwned">
 | 
			
		||||
          {{item.name}}       
 | 
			
		||||
 | 
			
		||||
							
								
								
									
										
											BIN
										
									
								
								frontend/src/assets/angry_clyde.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										
											BIN
										
									
								
								frontend/src/assets/angry_clyde.png
									
									
									
									
									
										Normal file
									
								
							
										
											Binary file not shown.
										
									
								
							| 
		 After Width: | Height: | Size: 1.2 KiB  | 
@ -15,16 +15,22 @@ export async function createRegister(){
 | 
			
		||||
 | 
			
		||||
/**
 | 
			
		||||
 * list all register request in a list of Objects
 | 
			
		||||
 */
 | 
			
		||||
export async function getRegisters(){
 | 
			
		||||
	return restGet("/requests/register")
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
/**
 | 
			
		||||
 * Get info on a particular registering request
 | 
			
		||||
 * Shall return a list of
 | 
			
		||||
 * - id
 | 
			
		||||
 * - type
 | 
			
		||||
 * - lastName
 | 
			
		||||
 * - firstName
 | 
			
		||||
 * - address
 | 
			
		||||
 * - country
 | 
			
		||||
 * - birthdate
 | 
			
		||||
 * - email
 | 
			
		||||
 * - cursus
 | 
			
		||||
 * - degree
 | 
			
		||||
 */
 | 
			
		||||
export async function getRegisters(id){
 | 
			
		||||
	return restGet("/request/register/" + id);
 | 
			
		||||
	if(id != null)
 | 
			
		||||
		return restGet("/request/register/" + id);
 | 
			
		||||
	return restGet("/request/register")
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
/**
 | 
			
		||||
 | 
			
		||||
@ -4,8 +4,57 @@ export async function login(user, pass, exp){
 | 
			
		||||
	return restPost("/login", {identifier: user, password: pass, expirationDate: exp});
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
export async function register(user, pass, mail){
 | 
			
		||||
	return restPost("/user", {name: user, password: pass, mail: mail});
 | 
			
		||||
/**
 | 
			
		||||
 * Register a user (tokenless)
 | 
			
		||||
 * 
 | 
			
		||||
 * @param firstname
 | 
			
		||||
 * @param lastname
 | 
			
		||||
 * @param birthdate
 | 
			
		||||
 * @param password
 | 
			
		||||
 * @param mail
 | 
			
		||||
 * @param address
 | 
			
		||||
 * @param country
 | 
			
		||||
 * @param cursus
 | 
			
		||||
 * @param imageId	id of the image in database returned when uploaded
 | 
			
		||||
 */
 | 
			
		||||
export async function register(firstname, lastname, birthDate, password, email, address, country, cursus, imageId){
 | 
			
		||||
	return restPost("/register", {
 | 
			
		||||
		firstname: firstname,
 | 
			
		||||
		lastname: lastname,
 | 
			
		||||
		birthDate: birthDate,
 | 
			
		||||
		password: password,
 | 
			
		||||
		email: email,
 | 
			
		||||
		address: address,
 | 
			
		||||
		country: country,
 | 
			
		||||
		cursus: cursus
 | 
			
		||||
	});
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
/**
 | 
			
		||||
 * Register a user (by secretary)
 | 
			
		||||
 * 
 | 
			
		||||
 * @param firstname
 | 
			
		||||
 * @param lastname
 | 
			
		||||
 * @param birthdate
 | 
			
		||||
 * @param password
 | 
			
		||||
 * @param mail
 | 
			
		||||
 * @param address
 | 
			
		||||
 * @param country
 | 
			
		||||
 * @param imageId	id of the image in database returned when uploaded
 | 
			
		||||
 *
 | 
			
		||||
 * PS: the password is not is not required as it is generated by the backend and sent to the user
 | 
			
		||||
 * by mail. it's up to the user to change it if he cares about security
 | 
			
		||||
 */
 | 
			
		||||
export async function createUser(firstname, lastname, birthDate, email, address, country, role, imageId){
 | 
			
		||||
	return restPost("/user", {
 | 
			
		||||
		firstname: firstname,
 | 
			
		||||
		lastname: lastname,
 | 
			
		||||
		birthDate: birthDate,
 | 
			
		||||
		password: password,
 | 
			
		||||
		email: email,
 | 
			
		||||
		address: address,
 | 
			
		||||
		country: country,
 | 
			
		||||
	});
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
/**
 | 
			
		||||
 | 
			
		||||
@ -11,6 +11,11 @@ export async function restPost(endPoint, data) {
 | 
			
		||||
	return await _rest(endPoint, {method: "POST", credentials: 'include', body: JSON.stringify(data)});
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
export async function restPostFile(endPoint, file){
 | 
			
		||||
	let headers = new Headers();
 | 
			
		||||
	return await _rest(endPoint, {method: "POST", credentials: 'include', body: file, headers: headers });
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
export async function restDelete(endPoint, data) {
 | 
			
		||||
	return await _rest(endPoint, {method: "DELETE", credentials: 'include', body: JSON.stringify(data)});
 | 
			
		||||
}
 | 
			
		||||
@ -35,13 +40,14 @@ async function _rest(endPoint, config){
 | 
			
		||||
		'Authorization': session_token,
 | 
			
		||||
		'Content-Type': 'application/json',
 | 
			
		||||
	});
 | 
			
		||||
	config['headers'] = headers;
 | 
			
		||||
	config['headers'] = config['headers'] == null ? headers : config['headers'];
 | 
			
		||||
	return toast.promise(fetch(restURL + endPoint, config),
 | 
			
		||||
		{
 | 
			
		||||
			pending: config['pending'] != null ? config['pending'] : 'pending',
 | 
			
		||||
			error: config['error'] != null ? config['error'] : 'Network Failure...',
 | 
			
		||||
			success: config['success'] != null ? config['success'] : {render(res){
 | 
			
		||||
				return res.ok ? "Success" : "error";
 | 
			
		||||
				console.log(res);
 | 
			
		||||
				return res.data.ok ? "Success" : "error";
 | 
			
		||||
			}},
 | 
			
		||||
		})
 | 
			
		||||
		.then( e => e.json()).catch( e => e );
 | 
			
		||||
 | 
			
		||||
							
								
								
									
										11
									
								
								frontend/src/rest/uploads.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										11
									
								
								frontend/src/rest/uploads.js
									
									
									
									
									
										Normal file
									
								
							@ -0,0 +1,11 @@
 | 
			
		||||
import { restPostFile } from '@/rest/restConsumer.js'
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
/**
 | 
			
		||||
 * Upload a file to the server and return the url of this image
 | 
			
		||||
 */
 | 
			
		||||
export async function uploadProfilePicture(file){
 | 
			
		||||
	const formData = new FormData();
 | 
			
		||||
	formData.append("file", file[0]);
 | 
			
		||||
	return restPostFile("/upload/ProfilePicture", formData)
 | 
			
		||||
}
 | 
			
		||||
		Reference in New Issue
	
	Block a user