post User by secretary

frontend/src/Apps/AboutUser.vue

@@ -3,36 +3,37 @@ import i18n from "../i18n.js";
 import {ref} from "vue";
 import {fetchAllResearchers} from "@/rest/ScientificPublications/ManageResearch.js";
 import {deleteResearcher, postResearcher} from "@/rest/ScientificPublications/ResearcherProfile.js";
+import {patchUser} from "@/rest/Users.js";
 const props = defineProps(['user'])
 const modifying =ref(false)
 const toModify = Object.assign({},{})
 const toCreate = Object.assign({},{})
 const allResearcher = ref( await fetchAllResearchers())
 const researcher = ref()
-const user = props.user
+const user = ref(props.user)
 const isResearcher = ref(false)
 const creating = ref(false)
 
 for (let i = 0; i < allResearcher.value.length; i++) {
-  if (user.regNo === allResearcher.value[i].user.regNo){
+  if (user.value.regNo === allResearcher.value[i].user.regNo){
     researcher.value = allResearcher.value[i]
     isResearcher.value = true
   }
 }
 
 function getPP(){
-  if(user.profilePictureUrl === null){
+  if(user.value.profilePictureUrl === null){
     return "/Clyde.png"
   }
-  return user.profilePictureUrl
+  return user.value.profilePictureUrl
 }
 
 async function createResearcher(){
-  toCreate.user = user
+  toCreate.user = user.value
   await postResearcher(toCreate)
   creating.value = false
   for (let i = 0; i < allResearcher.value.length; i++) {
-    if (user.regNo === allResearcher.value[i].user.regNo){
+    if (user.value.regNo === allResearcher.value[i].user.regNo){
       researcher.value = allResearcher.value[i]
       isResearcher.value = true
     }
@@ -46,6 +47,13 @@ async function deleteResearcherById(){
   allResearcher.value = await fetchAllResearchers()
 }
 
+async function modify(){
+  if (modifying.value){
+    user.value = await patchUser(user.value.regNo, toModify)
+  }
+  modifying.value =!modifying.value
+}
+
 </script>
 
 <template>
@@ -89,7 +97,7 @@ async function deleteResearcherById(){
         </div>
       </div>
       <div></div>
-      <button id="ModifyButton" @click="modifying= !modifying"> {{i18n("Modify.Data")}}</button>
+      <button id="ModifyButton" @click="modify"> {{i18n("Modify.Data")}}</button>
       <div></div>
       <div>
         <button v-if="isResearcher" id="deleteButton" @click="deleteResearcherById"> {{i18n("Researcher.Delete")}}</button>
@@ -111,8 +119,6 @@ async function deleteResearcherById(){
             {{i18n("Domain")}} :
             <input type="text" v-model="toCreate.domain"></li>
         </ul>
-
-
       </div>
     </div>
   </div>
@@ -133,6 +139,7 @@ async function deleteResearcherById(){
 }
 
 .container{
+  margin-top: 25px;
   min-width:675px;
   display:grid;
   grid-template-columns:10vw 50vw;

frontend/src/Apps/CreateUser.vue

@@ -0,0 +1,117 @@
+<script setup>
+
+import i18n from "@/i18n.js";
+import {uploadProfilePicture} from "@/rest/uploads.js";
+import {postUser} from "@/rest/Users.js";
+import {ref} from "vue";
+let toCreate = Object.assign({},{})
+const today =  new Date()
+const date = today.getFullYear() +"-" + ("0" + (today.getMonth()+1)).slice(-2) + "-" + ("0" + today.getDate()).slice(-2);
+
+
+async function createUser(){
+
+  if (toCreate.lastName === null || toCreate.birthDate === null || toCreate.firstName === null ||
+      toCreate.email === null || toCreate.address === null || toCreate.role === null || toCreate.password === null)
+    return
+
+  await postUser(toCreate)
+  toCreate = Object.assign({},{})
+}
+
+async function getProfilePic(data){
+  const pp= await uploadProfilePicture(data)
+  toCreate.profilePictureUrl = pp.url
+}
+
+</script>
+
+<template>
+  <div class="body">
+    <div class="container">
+      <div class = "globalInfos">
+        <div class="infosContainer">
+          <ul>
+            <li>{{i18n("LastName")}} : <input type="text" v-model="toCreate.lastName"></li>
+            <li>{{i18n("FirstName")}} : <input type="text" v-model="toCreate.firstName"></li>
+            <li> E-mail : <input type="text" v-model="toCreate.email"></li>
+            <li>{{i18n("Country")}} : <input type="text" v-model="toCreate.country"></li>
+            <li>{{i18n("Address")}} : <input type="text" v-model="toCreate.address"></li>
+            <li>{{i18n("BirthDate")}} : <input type="date" min="1924-01-01" :max="date" v-model="toCreate.birthDate"></li>
+
+            <li>{{i18n("Profile.Picture")}} :
+              <input  type="file" @change="getProfilePic($event.target.files);" accept="image/*">
+            </li>
+
+
+            <li>{{i18n("Role")}} :
+            <select  v-model="toCreate.role">
+              <option value="Student">{{i18n("Student")}}</option>
+              <option value="Teacher">{{i18n("Teacher")}}</option>
+              <option value="Secretary">{{i18n("Secretary")}}</option>
+              <option value="InscriptionService">{{i18n("InscriptionService")}}</option>
+            </select>
+            </li>
+
+            <li>{{i18n("Password")}} : <input type="password" v-model="toCreate.password"></li>
+
+          </ul>
+          <div style="text-align: end"> <button id="createButton" @click="createUser"> {{i18n("Create.User")}}</button></div>
+        </div>
+    </div>
+  </div>
+  </div>
+</template>
+
+<style scoped>
+
+.container{
+  margin-top: 25px;
+  min-width:675px;
+  display:grid;
+  grid-template-columns:10vw 50vw;
+  grid-template-rows:200px auto;
+  column-gap:2.7%;
+  row-gap:45px;
+  grid-template-areas:
+  "profilPic globalInfos"
+  "minfos minfos";
+}
+.globalInfos {
+  grid-area:globalInfos;
+  align-self :center;
+
+}
+
+.body {
+  min-width:960px;
+  width:100%;
+  display:flex;
+  align-items:center;
+  justify-content:center;
+  margin-top:5%;
+}
+
+
+.infosContainer {
+  border:2px solid black;
+  font-size:23px;
+  color:white;
+  background-color:rgb(50,50,50);
+  border-radius:10px;
+}
+
+#createButton{
+  align-self: center;
+  text-align: center;
+  border: 2px solid black;
+  color: white;
+  font-size: x-large;
+  background-color: #07bc0c;
+  border-radius: 20px
+}
+#createButton:hover{
+  background: #4cd964;
+}
+
+</style>