1
0
forked from PGL/Clyde

Requests setup

This commit is contained in:
Wawilski 2024-03-08 11:54:10 +01:00
parent 3c08022c20
commit 4111839852
4 changed files with 165 additions and 11 deletions

View File

@ -3,7 +3,10 @@
import { toast } from 'vue3-toastify';
import { ref } from 'vue'
import i18n from './i18n.js'
const test = ref();
import Inscription from "./Inscription.vue"
const test = ref();
async function draw(e) {
test.value = (await fetch("http://localhost:8080/ping"));
@ -11,6 +14,8 @@
toast(test.value['txt']);
}
</script>
@ -66,11 +71,16 @@
<li ><a href="#Forum">
<div class="fa-solid fa-envelope" style="font-size: 40px;" ></div>
<div class="text">Forum</div></a></li>
<li><a href="#Inscription">
<div class="fa-solid fa-users" style="font-size: 40px;"></div>
<div class="text">Inscription Requests</div></a></li>
</ul>
</div>
<div class="page">
<div style="background-color: rgb(239,50,168); margin:50px;">Il FAUDRA INSERER LA PAGE ICI</div>
<div style=" margin:50px;">
<Inscription></Inscription>
</div>
</div>
</div>
</template>

View File

@ -1,2 +1,32 @@
<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",
}]
</script>
<template>
<Req v-for="item of requests_example" v-bind="item">
</Req>
</template>

View File

@ -10,12 +10,13 @@
const surname=ref("")
const firstname=ref("")
const passwordOUT=ref("")
const passwordConfirm=ref("")
const emailOUT=ref("")
const address=ref("")
const country=ref("")
const cursus=ref("")
const inputs = [{_emailID:emailID},{_passwordIN:passwordIN}]
const outputs= [{_surname:surname},{_firstname:firstname},{_passwordOUT:passwordOUT},{_emailOUT:emailOUT},{_address:address},{_country:country},{_cursus:cursus}]
const loginInfos = [{_emailID:emailID},{_passwordIN:passwordIN}]
const registerInfos= [{_surname:surname},{_firstname:firstname},{_passwordOUT:passwordOUT},{_passwordConfirm:passwordConfirm},{_emailOUT:emailOUT},{_address:address},{_country:country},{_cursus:cursus}]
</script>
@ -69,13 +70,10 @@
<input type="password" v-model="passwordOUT">
</div>
<div class="inputBox">
<p>Cursus</p>
<select v-model="cursus">
<option value="Chemistry">Chemistry</option>
<option value="Psycho">Psychology</option>
<option value="IT">IT</option>
</select>
<p>CONFIRM {{i18n("login.guest.password")}}</p>
<input type="password" v-model="passwordConfirm">
</div>
<div class="switchpage">
<button @click="page++">{{i18n("login.guest.nextpage")}}</button>
@ -97,6 +95,14 @@
<p>{{i18n("login.guest.country")}}</p>
<input type="text" v-model="country">
</div>
<div class="inputBox">
<p>Cursus</p>
<select v-model="cursus">
<option value="Chemistry">Chemistry</option>
<option value="Psycho">Psychology</option>
<option value="IT">IT</option>
</select>
</div>
<div style="align-self:center;" class="inputBox">
<button style="margin-top:25px;" @click="console.log(outputs)">{{i18n("login.guest.submit")}}</button>
</div>
@ -117,8 +123,8 @@
<style scoped>
.Home{
position:absolute;
z-index:1;
display: flex;
z-index: 100;
padding: 8px 16px;
color:rgb(255, 255, 255);
text-decoration: none;

108
frontend/src/Request.vue Normal file
View File

@ -0,0 +1,108 @@
<script setup>
const props = defineProps({
id: Number,
type: String,
lastName: String,
firstName: String,
address: String,
country: String,
birthDate: String,
cursus:String,
degree:String,});
</script>
<template>
<div class="bodu">
<div class="container">
<div class="id"><a>{{id}}</a></div>
<div class="type"><a>{{type}}</a></div>
<div class="surname"><a>{{lastName}}</a></div>
<div class="firstname"><a>{{firstName}}</a></div>
<div class="infos"><button style="background-color:rgb(105,05,105);" > More infos </button></div>
<div class="accept"><button style="background-color:rgb(0,105,50);">Accept</button></div>
<div class="refuse"><button style="background-color:rgb(105,0,0);">Refuse</button></div>
</div>
</div>
</template>
<style scoped>
.container{
color:white;
height:100px;
font-size:20px;
display:grid;
grid-template-columns:[firstCol-start]100px[firstCol-end secondCol-start]150px[secondCol-end thirdCol-start]200px[thirdCol-end fourthCol-start]150px[fourthCol-end]150px[fifthCol-end]150px[sixthCol-end]150px[endCol];
grid-template-areas:
"id type surname firstname infos accept refuse";
column-gap:10px;
}
.infos {
grid-area:infos;
align-self:center;
}
.accept{
grid-area:accept;
align-self:center;
}
.refuse{
grid-area:refuse;
align-self:center;
}
.titles {
grid-area:titles;
background-color:rgb(215,215,215);
}
.id{
grid-area:id;
margin-left:40px;
align-self:center;
}
.type{
grid-area:type;
align-self:center;
}
.surname{
grid-area:surname;
align-self:center;
white-space: nowrap;
overflow: hidden;
text-overflow:ellipsis;
}
.firstname{
grid-area:firstname;
align-self:center;
white-space: nowrap;
overflow: hidden;
text-overflow:ellipsis;
}
button{
font-size:15px;
height:50px;
width:100px;
border:none;
border-radius:20px;
}
.bodu {
width:100%;
margin-bottom:10px;
border:2px solid black;
border-radius:9px;
background-color:rgb(50,50,50);
}
</style>