Register API and form optimization [depend: backend /register] (#93)
Made the register api following the backend refactored the register form for more ergonomy **PS: Waiting for the backend to catch up** Reviewed-on: PGL/Clyde#93 Reviewed-by: Maxime <231026@umons.ac.be> Reviewed-by: Wal <karpinskiwal@gmail.com> Reviewed-by: LeoMoulin <leomoulin125@gmail.com> Co-authored-by: Anthony Debucquoy <debucquoy.anthony@gmail.com> Co-committed-by: Anthony Debucquoy <debucquoy.anthony@gmail.com>
This commit is contained in:
		| @ -7,23 +7,16 @@ | |||||||
|   const loginPage= ref(true) |   const loginPage= ref(true) | ||||||
|   const page = ref(0) |   const page = ref(0) | ||||||
|  |  | ||||||
|   const emailID=ref("") |  | ||||||
|   const passwordIN=ref("") |  | ||||||
|  |  | ||||||
|  |  | ||||||
|   const submitValue= ref(i18n("login.guest.submit")) |   const submitValue= ref(i18n("login.guest.submit")) | ||||||
|   const surname=ref("") |   const surname=ref("") | ||||||
|   const firstname=ref("") |   const firstname=ref("") | ||||||
|   const passwordOUT=ref("") |   const password=ref("") | ||||||
|   const passwordConfirm=ref("") |   const passwordConfirm=ref("") | ||||||
|   const birthday=ref("") |   const birthday=ref("") | ||||||
|   const emailOUT=ref("") |   const email=ref("") | ||||||
|   const address=ref("") |   const address=ref("") | ||||||
|   const country=ref("") |   const country=ref("") | ||||||
|   const cursus=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 imageSaved = ref(false) | ||||||
|   const ppData = ref(false) |   const ppData = ref(false) | ||||||
| @ -34,17 +27,17 @@ | |||||||
|       <div class='loginBox'> |       <div class='loginBox'> | ||||||
|  |  | ||||||
|         <div v-if="loginPage"> |         <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;"> |             <h1 style="color:rgb(239,60,168); font-family: sans-serif;"> | ||||||
|               {{i18n("login.guest.signin")}} |               {{i18n("login.guest.signin")}} | ||||||
|             </h1> |             </h1> | ||||||
|             <div class="inputBox"> |             <div class="inputBox"> | ||||||
|               <p>ID / {{i18n("login.guest.email")}}</p>  |               <p>ID / {{i18n("login.guest.email")}}</p>  | ||||||
|               <input type="text" v-model="emailID"> |               <input type="text" v-model="email"> | ||||||
|             </div> |             </div> | ||||||
|             <div class="inputBox"> |             <div class="inputBox"> | ||||||
|               <p>{{i18n("login.guest.password")}}</p> |               <p>{{i18n("login.guest.password")}}</p> | ||||||
|               <input type="password" v-model="passwordIN"> |               <input type="password" v-model="password"> | ||||||
|             </div> |             </div> | ||||||
|             <div class="register"> |             <div class="register"> | ||||||
|               <a @click="loginPage=!loginPage">{{i18n("login.guest.register")}}</a> |               <a @click="loginPage=!loginPage">{{i18n("login.guest.register")}}</a> | ||||||
| @ -56,7 +49,7 @@ | |||||||
|         </div> |         </div> | ||||||
|  |  | ||||||
|         <div v-else> |         <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;"> |             <h1 style="color:rgb(239,60,168); font-family: sans-serif; text-align:center;"> | ||||||
|               {{i18n("login.guest.welcome")}} |               {{i18n("login.guest.welcome")}} | ||||||
|             </h1> |             </h1> | ||||||
| @ -75,11 +68,12 @@ | |||||||
|               </div> |               </div> | ||||||
|               <div class="inputBox"> |               <div class="inputBox"> | ||||||
|                  <p>{{i18n("login.guest.password")}}</p> |                  <p>{{i18n("login.guest.password")}}</p> | ||||||
|                  <input type="password" v-model="passwordOUT"> |                  <input type="password" v-model="password"> | ||||||
|               </div> |               </div> | ||||||
|               <div class="inputBox"> |               <div class="inputBox"> | ||||||
|                 <p>{{i18n("login.guest.confirm")}} {{i18n("login.guest.password")}}</p> |                 <p>{{i18n("login.guest.confirm")}} {{i18n("login.guest.password")}}</p> | ||||||
|                  <input type="password" v-model="passwordConfirm"> |                  <input type="password" v-model="passwordConfirm"> | ||||||
|  | 				 <!-- TODO: Verify password is same as passwordConfirm --> | ||||||
|               </div> |               </div> | ||||||
|                |                | ||||||
|               <div class="switchpage"> |               <div class="switchpage"> | ||||||
| @ -93,7 +87,7 @@ | |||||||
|             <div v-else> |             <div v-else> | ||||||
|               <div class="inputBox"> |               <div class="inputBox"> | ||||||
|                 <p>{{i18n("login.guest.email")}}</p> |                 <p>{{i18n("login.guest.email")}}</p> | ||||||
|                 <input type="mail" v-model="emailOUT"> |                 <input type="mail" v-model="email"> | ||||||
|               </div> |               </div> | ||||||
|               <div class="inputBox"> |               <div class="inputBox"> | ||||||
|                 <p>{{i18n("login.guest.address")}}</p> |                 <p>{{i18n("login.guest.address")}}</p> | ||||||
|  | |||||||
| @ -4,8 +4,57 @@ export async function login(user, pass, exp){ | |||||||
| 	return restPost("/login", {identifier: user, password: pass, expirationDate: 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, | ||||||
|  | 	}); | ||||||
| } | } | ||||||
|  |  | ||||||
| /** | /** | ||||||
|  | |||||||
		Reference in New Issue
	
	Block a user