Merge branch 'dev' of https://github.com/AlineRinquin/organizee-front into blandine
This commit is contained in:
commit
a2fd96e6a4
5
package-lock.json
generated
5
package-lock.json
generated
@ -14184,6 +14184,11 @@
|
||||
"resolved": "https://registry.npmjs.org/bootstrap-icons/-/bootstrap-icons-1.8.1.tgz",
|
||||
"integrity": "sha512-IXUqislddPJfwq6H+2nTkHyr9epO9h6u1AG0OZCx616w+TgzeoCjfmI3qJMQqt1J586gN2IxzB4M99Ip4sTZ1w=="
|
||||
},
|
||||
"bootstrap-icons": {
|
||||
"version": "1.8.1",
|
||||
"resolved": "https://registry.npmjs.org/bootstrap-icons/-/bootstrap-icons-1.8.1.tgz",
|
||||
"integrity": "sha512-IXUqislddPJfwq6H+2nTkHyr9epO9h6u1AG0OZCx616w+TgzeoCjfmI3qJMQqt1J586gN2IxzB4M99Ip4sTZ1w=="
|
||||
},
|
||||
"brace-expansion": {
|
||||
"version": "1.1.11",
|
||||
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
|
||||
|
@ -7,6 +7,7 @@ import { PageAgendaComponent } from './pages/page-agenda/page-agenda.component';
|
||||
import { PageAjoutContactComponent } from './pages/page-ajout-contact/page-ajout-contact.component';
|
||||
import { PageCreationTeamComponent } from './pages/page-creation-team/page-creation-team.component';
|
||||
import { PageDashboardComponent } from './pages/page-dashboard/page-dashboard.component';
|
||||
import { PageDeleteAccountComponent } from './pages/page-delete-account/page-delete-account.component';
|
||||
import { PageDeleteMemberComponent } from './pages/page-delete-member/page-delete-member.component';
|
||||
import { PageForgotPasswordComponent } from './pages/page-forgot-password/page-forgot-password.component';
|
||||
import { PageMenuSemaineComponent } from './pages/page-menu-semaine/page-menu-semaine.component';
|
||||
@ -16,6 +17,7 @@ import { PageRepertoireComponent } from './pages/page-repertoire/page-repertoire
|
||||
import { PageResetPasswordComponent } from './pages/page-reset-password/page-reset-password.component';
|
||||
import { PageSignupComponent } from './pages/page-signup/page-signup.component';
|
||||
import { PageToDoListComponent } from './pages/page-to-do-list/page-to-do-list.component';
|
||||
import { PageUpdateAccountComponent } from './pages/page-update-account/page-update-account.component';
|
||||
import { PageUpdateMemberComponent } from './pages/page-update-member/page-update-member.component';
|
||||
|
||||
const routes: Routes = [
|
||||
@ -27,6 +29,7 @@ const routes: Routes = [
|
||||
{ path: 'agenda', component: PageAgendaComponent },
|
||||
{ path: 'tableau-de-bord', component: PageDashboardComponent },
|
||||
{ path: 'supprimer-membre', component: PageDeleteMemberComponent },
|
||||
{ path: 'supprimer-compte', component: PageDeleteAccountComponent },
|
||||
{ path: 'password-oublie', component: PageForgotPasswordComponent },
|
||||
{ path: 'menu', component: PageMenuSemaineComponent },
|
||||
{ path: 'repertoire', component: PageRepertoireComponent },
|
||||
@ -34,6 +37,7 @@ const routes: Routes = [
|
||||
{ path: 'creation-compte', component: PageSignupComponent },
|
||||
{ path: 'to-do-list', component: PageToDoListComponent },
|
||||
{ path: 'modifier-membre', component: PageUpdateMemberComponent },
|
||||
{ path: 'modifier-compte', component: PageUpdateAccountComponent },
|
||||
{ path: 'ajouter-contact', component: PageAjoutContactComponent },
|
||||
{ path: 'creation-team', component: PageCreationTeamComponent },
|
||||
{ path: '**', component: PageNotFoundComponent },
|
||||
|
@ -37,6 +37,8 @@ import { PageAjoutContactComponent } from './pages/page-ajout-contact/page-ajout
|
||||
import { PageModifierContactComponent } from './pages/page-modifier-contact/page-modifier-contact.component';
|
||||
import { PageCreationTeamComponent } from './pages/page-creation-team/page-creation-team.component';
|
||||
import { AutofocusFixModule } from 'ngx-autofocus-fix';
|
||||
import { PageDeleteAccountComponent } from './pages/page-delete-account/page-delete-account.component';
|
||||
import { PageUpdateAccountComponent } from './pages/page-update-account/page-update-account.component';
|
||||
import { EmoticonComponent } from './emoticon/emoticon.component';
|
||||
|
||||
|
||||
@ -75,6 +77,8 @@ import { EmoticonComponent } from './emoticon/emoticon.component';
|
||||
PageAjoutContactComponent,
|
||||
PageModifierContactComponent,
|
||||
PageCreationTeamComponent,
|
||||
PageDeleteAccountComponent,
|
||||
PageUpdateAccountComponent,
|
||||
EmoticonComponent,
|
||||
],
|
||||
imports: [
|
||||
|
@ -6,7 +6,7 @@
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-sm">
|
||||
<button class="w-100 btn btn-lg btn-rounded btn-secondary">
|
||||
<button class="w-100 btn btn-lg btn-rounded btn-secondary" (click)="onClickDelete(personne.id)">
|
||||
Supprimer
|
||||
</button>
|
||||
</div>
|
||||
|
@ -1,4 +1,4 @@
|
||||
import { Component, Input, OnInit } from '@angular/core';
|
||||
import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'app-fiche-contact',
|
||||
@ -7,8 +7,13 @@ import { Component, Input, OnInit } from '@angular/core';
|
||||
})
|
||||
export class FicheContactComponent implements OnInit {
|
||||
@Input() personne: any;
|
||||
@Output() clickDelete = new EventEmitter();
|
||||
|
||||
constructor() {}
|
||||
|
||||
ngOnInit(): void {}
|
||||
|
||||
onClickDelete(numPerson: number){
|
||||
this.clickDelete.emit(numPerson);
|
||||
}
|
||||
}
|
||||
|
@ -1,11 +1,29 @@
|
||||
<nav class="custom-side-bar flex-shrink-0 bg-white border-end">
|
||||
<div id="navbarNavAltMarkup">
|
||||
<div class="navbar-nav">
|
||||
<a routerLink="../compte" routerLinkActive="active-custom" class="nav-link">Ma Team</a>
|
||||
<a routerLink="../repertoire" routerLinkActive="active-custom" class="nav-link">Répertoire</a>
|
||||
<a routerLink="../to-do-list" routerLinkActive="active-custom" class="nav-link">To-Do-List</a>
|
||||
<a routerLink="../menu" routerLinkActive="active-custom" class="nav-link">Menus</a>
|
||||
<a routerLink="../agenda" routerLinkActive="active-custom" class="nav-link">Agenda</a>
|
||||
</div>
|
||||
</div>
|
||||
<nav class="wrapper">
|
||||
<ul class="nav flex-column">
|
||||
<li class="nav-item" ngbNavItem="maTeam" >
|
||||
<a routerLink="../compte" routerLinkActive="active-custom" class="nav-link">
|
||||
<i class="bi bi-people-fill"></i>
|
||||
Ma Team</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a routerLink="../repertoire" routerLinkActive="active-custom" class="nav-link">
|
||||
<i class="bi bi-person-rolodex"></i>
|
||||
Répertoire</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a routerLink="../to-do-list" routerLinkActive="active-custom" class="nav-link">
|
||||
<i class="bi bi-check2-square"></i>
|
||||
To-Do-List</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a routerLink="../menu" routerLinkActive="active-custom" class="nav-link">
|
||||
<i class='fas fa-pizza-slice'></i>
|
||||
Menus</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a routerLink="../agenda" routerLinkActive="active-custom" class="nav-link">
|
||||
<i class="bi bi-calendar-event"></i>
|
||||
Agenda</a>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
@ -0,0 +1,24 @@
|
||||
.wrapper {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: stretch;
|
||||
width: auto;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
background-color: rgb(238, 238, 238);
|
||||
|
||||
}
|
||||
.nav{
|
||||
margin-top: 20px;
|
||||
align-items: left;
|
||||
}
|
||||
|
||||
li {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
|
||||
a{
|
||||
color: black;
|
||||
font-weight: bold;
|
||||
}
|
@ -1,10 +1,40 @@
|
||||
<app-header></app-header>
|
||||
<app-side-bar></app-side-bar>
|
||||
<div class="meteo">
|
||||
<app-meteo></app-meteo>
|
||||
</div>
|
||||
<div class="d-flex justify-content-center">
|
||||
<button button type="button" class="btn btn-primary btn-lg"
|
||||
routerLink="../creation-team"
|
||||
routerLinkActive="active-custom">Créer ma team</button>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-auto">
|
||||
<app-side-bar></app-side-bar>
|
||||
</div>
|
||||
<div class=" col compte text-center">
|
||||
<h1>Ma Team</h1>
|
||||
<main class="contenu-compte">
|
||||
<div class="d-flex justify-content-center">
|
||||
<button button type="button" class="btn btn-primary btn-lg"
|
||||
routerLink="../creation-team"
|
||||
routerLinkActive="active-custom">Créer ma team</button>
|
||||
</div>
|
||||
<div class="d-flex justify-content-center">
|
||||
<button button type="button" class="btn btn-primary btn-lg"
|
||||
routerLink="../modifier-compte"
|
||||
routerLinkActive="active-custom">Modifier mon compte</button>
|
||||
</div>
|
||||
<div class="d-flex justify-content-center">
|
||||
<button button type="button" class="btn btn-primary btn-lg"
|
||||
routerLink="../supprimer-compte"
|
||||
routerLinkActive="active-custom">Supprimer mon compte</button>
|
||||
</div>
|
||||
<div class="d-flex justify-content-center">
|
||||
<button button type="button" class="btn btn-primary btn-lg"
|
||||
routerLink="../ajout-membre"
|
||||
routerLinkActive="active-custom">Ajouter un membre</button>
|
||||
</div>
|
||||
<div class="d-flex justify-content-center">
|
||||
<button button type="button" class="btn btn-primary btn-lg"
|
||||
routerLink="../modifier-membre"
|
||||
routerLinkActive="active-custom">Modifier ce membre</button>
|
||||
</div>
|
||||
<div class="d-flex justify-content-center">
|
||||
<button button type="button" class="btn btn-primary btn-lg"
|
||||
routerLink="../supprimer-membre"
|
||||
routerLinkActive="active-custom">Supprimer ce membre</button>
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
|
@ -1,5 +1,7 @@
|
||||
.meteo {
|
||||
.contenu.compte{
|
||||
display: flex;
|
||||
margin-left: 300px;
|
||||
margin-top: -60px;
|
||||
flex-direction: row;
|
||||
}
|
||||
button{
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
@ -1,101 +1,142 @@
|
||||
<app-header></app-header>
|
||||
<app-side-bar></app-side-bar>
|
||||
<div class="signup-form text-center">
|
||||
<main class="form-signup">
|
||||
<form (ngSubmit)="onSubmit()" [formGroup]="addMemberForm">
|
||||
<h1>J'inscris un nouveau membre</h1>
|
||||
<div class="form-floating">
|
||||
<input type="color" class="form-control" id="floatingInputcouleur" placeholder="" name="couleur"
|
||||
formControlName="couleurFc">
|
||||
<label for="floatingInputcouleur">Choisissez une couleur !</label>
|
||||
</div>
|
||||
<!-- <div class="form-floating">
|
||||
<input type="text"
|
||||
class="form-control"
|
||||
id="floatingInputlastName"
|
||||
placeholder=""
|
||||
name="lastName"
|
||||
formControlName="lastNameFc"
|
||||
[ngClass]="{'is-valid' : addMemberForm.controls['lastNameFc'].touched && addMemberForm.controls['lastNameFc'].valid,
|
||||
'is-invalid': addMemberForm.controls['lastNameFc'].touched && !addMemberForm.controls['lastNameFc'].valid}">
|
||||
<label for="floatingInputlastName">Avatar</label>
|
||||
</div> -->
|
||||
<div class="form-floating">
|
||||
<input type="text"
|
||||
class="form-control"
|
||||
id="floatingInputlastName"
|
||||
placeholder=""
|
||||
name="lastName"
|
||||
formControlName="lastNameFc"
|
||||
[ngClass]="{'is-valid' : addMemberForm.controls['lastNameFc'].touched && addMemberForm.controls['lastNameFc'].valid,
|
||||
'is-invalid': addMemberForm.controls['lastNameFc'].touched && !addMemberForm.controls['lastNameFc'].valid}">
|
||||
<label for="floatingInputlastName">Nom</label>
|
||||
</div>
|
||||
<div class="form-floating">
|
||||
<input type="text"
|
||||
class="form-control"
|
||||
id="floatingInputfirstName"
|
||||
placeholder=""
|
||||
name="firstName"
|
||||
formControlName="firstNameFc"
|
||||
[ngClass]="{'is-valid' : addMemberForm.controls['firstNameFc'].touched && addMemberForm.controls['firstNameFc'].valid,
|
||||
'is-invalid': addMemberForm.controls['firstNameFc'].touched && !addMemberForm.controls['firstNameFc'].valid}">
|
||||
<label for="floatingInputfirstName">Prénom</label>
|
||||
</div>
|
||||
<div class="form-floating">
|
||||
<input type="date"
|
||||
class="form-control"
|
||||
id="floatingInputdateNaissance"
|
||||
placeholder=""
|
||||
name="dateNaissance"
|
||||
formControlName="dateNaissanceFc"
|
||||
[ngClass]="{'is-valid' : addMemberForm.controls['dateNaissanceFc'].touched && addMemberForm.controls['dateNaissanceFc'].valid,
|
||||
'is-invalid': addMemberForm.controls['dateNaissanceFc'].touched && !addMemberForm.controls['dateNaissanceFc'].valid}">
|
||||
<label for="floatingInputfirstName">Date de naissance</label>
|
||||
</div>
|
||||
<div class="form-floating">
|
||||
<input type="email"
|
||||
class="form-control"
|
||||
id="floatingInput"
|
||||
placeholder=""
|
||||
name="email"
|
||||
formControlName="emailFc"
|
||||
[ngClass]="{'is-valid' : addMemberForm.controls['emailFc'].touched && addMemberForm.controls['emailFc'].valid,
|
||||
'is-invalid': addMemberForm.controls['emailFc'].touched && !addMemberForm.controls['emailFc'].valid}">
|
||||
<label for="floatingInput">Adresse email</label>
|
||||
</div>
|
||||
<div class="form-floating">
|
||||
<input type="password"
|
||||
class="form-control"
|
||||
id="floatingPassword"
|
||||
placeholder=""
|
||||
name="password"
|
||||
formControlName="passwordFc"
|
||||
[ngClass]="{'is-valid' : addMemberForm.controls['passwordFc'].touched && addMemberForm.controls['passwordFc'].valid,
|
||||
'is-invalid': addMemberForm.controls['passwordFc'].touched && !addMemberForm.controls['passwordFc'].valid}">
|
||||
<label for="floatingPassword">Mot de passe</label>
|
||||
</div>
|
||||
<div class="form-floating">
|
||||
<input type="passwordConfirm"
|
||||
class="form-control"
|
||||
id="floatingpasswordConfirm"
|
||||
placeholder=""
|
||||
name="passwordConfirm"
|
||||
formControlName="passwordConfirmFc"
|
||||
[ngClass]="{'is-valid' : addMemberForm.controls['passwordConfirmFc'].touched && addMemberForm.controls['passwordConfirmFc'].valid,
|
||||
'is-invalid': addMemberForm.controls['passwordConfirmFc'].touched && !addMemberForm.controls['passwordConfirmFc'].valid}">
|
||||
<label for="floatingPassword">Confirmer mot de passe</label>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-auto">
|
||||
<app-side-bar></app-side-bar>
|
||||
</div>
|
||||
|
||||
<button class="w-100 btn btn-lg btn-success"
|
||||
type="submit"
|
||||
[disabled]="addMemberForm.invalid">Je confirme l'ajout de ce membre à ma team !</button>
|
||||
<p>
|
||||
Value : {{ addMemberForm.value | json }}
|
||||
</p>
|
||||
<p>
|
||||
Form valid : {{ addMemberForm.valid }}
|
||||
</p>
|
||||
<div class=" col addMember-form text-center">
|
||||
<h1>Ajouter un membre</h1>
|
||||
<main class="form-addMember">
|
||||
<form (ngSubmit)="onSubmit()" [formGroup]="addMemberForm">
|
||||
<div class="form-floating">
|
||||
<input type="color"
|
||||
class="form-control"
|
||||
id="floatingInputcouleur"
|
||||
placeholder=""
|
||||
name="couleur"
|
||||
formControlName="couleurFc">
|
||||
</div>
|
||||
<div class="form-floating">
|
||||
<input
|
||||
type="text"
|
||||
class="form-control"
|
||||
id="floatingInputlastName"
|
||||
placeholder=""
|
||||
name="lastName"
|
||||
formControlName="lastNameFc"
|
||||
[ngClass]="{
|
||||
'is-valid':
|
||||
addMemberForm.controls['lastNameFc'].touched &&
|
||||
addMemberForm.controls['lastNameFc'].valid,
|
||||
'is-invalid':
|
||||
addMemberForm.controls['lastNameFc'].touched &&
|
||||
!addMemberForm.controls['lastNameFc'].valid
|
||||
}"
|
||||
/>
|
||||
<label for="floatingInputlastName">VOTRE NOM</label>
|
||||
</div>
|
||||
<div class="form-floating">
|
||||
<input
|
||||
type="text"
|
||||
class="form-control"
|
||||
id="floatingInputfirstName"
|
||||
placeholder=""
|
||||
name="firstName"
|
||||
formControlName="firstNameFc"
|
||||
[ngClass]="{
|
||||
'is-valid':
|
||||
addMemberForm.controls['firstNameFc'].touched &&
|
||||
addMemberForm.controls['firstNameFc'].valid,
|
||||
'is-invalid':
|
||||
addMemberForm.controls['firstNameFc'].touched &&
|
||||
!addMemberForm.controls['firstNameFc'].valid
|
||||
}"
|
||||
/>
|
||||
<label for="floatingInputfirstName">VOTRE PRENOM</label>
|
||||
</div>
|
||||
<div class="form-floating">
|
||||
<input
|
||||
type="date"
|
||||
class="form-control"
|
||||
id="floatingInputdateNaissance"
|
||||
placeholder=""
|
||||
name="dateNaissance"
|
||||
formControlName="dateNaissanceFc"
|
||||
[ngClass]="{
|
||||
'is-valid':
|
||||
addMemberForm.controls['dateNaissanceFc'].touched &&
|
||||
addMemberForm.controls['dateNaissanceFc'].valid,
|
||||
'is-invalid':
|
||||
addMemberForm.controls['dateNaissanceFc'].touched &&
|
||||
!addMemberForm.controls['dateNaissanceFc'].valid
|
||||
}"
|
||||
/>
|
||||
<label for="floatingInputdateNaissance">VOTRE DATE DE NAISSANCE</label>
|
||||
</div>
|
||||
<div class="form-floating">
|
||||
<input
|
||||
type="email"
|
||||
class="form-control"
|
||||
id="floatingInputemail"
|
||||
placeholder=""
|
||||
name="email"
|
||||
formControlName="emailFc"
|
||||
[ngClass]="{
|
||||
'is-valid':
|
||||
addMemberForm.controls['emailFc'].touched &&
|
||||
addMemberForm.controls['emailFc'].valid,
|
||||
'is-invalid':
|
||||
addMemberForm.controls['emailFc'].touched &&
|
||||
!addMemberForm.controls['emailFc'].valid
|
||||
}"
|
||||
/>
|
||||
<label for="floatingInputemail">VOTRE EMAIL</label>
|
||||
</div>
|
||||
<div class="form-floating">
|
||||
<input
|
||||
type="password"
|
||||
class="form-control"
|
||||
id="floatingPassword"
|
||||
placeholder=""
|
||||
name="password"
|
||||
formControlName="passwordFc"
|
||||
[ngClass]="{
|
||||
'is-valid':
|
||||
addMemberForm.controls['passwordFc'].touched &&
|
||||
addMemberForm.controls['passwordFc'].valid,
|
||||
'is-invalid':
|
||||
addMemberForm.controls['passwordFc'].touched &&
|
||||
!addMemberForm.controls['passwordFc'].valid
|
||||
}"
|
||||
/>
|
||||
<label for="floatingPassword">MOT DE PASSE</label>
|
||||
</div>
|
||||
<div class="form-floating">
|
||||
<input
|
||||
type="password"
|
||||
class="form-control"
|
||||
id="floatingpasswordConfirm"
|
||||
placeholder=""
|
||||
name="passwordConfirm"
|
||||
formControlName="passwordConfirmFc"
|
||||
[ngClass]="{
|
||||
'is-valid':
|
||||
addMemberForm.controls['passwordConfirmFc'].touched &&
|
||||
addMemberForm.controls['passwordConfirmFc'].valid,
|
||||
'is-invalid':
|
||||
addMemberForm.controls['passwordConfirmFc'].touched &&
|
||||
!addMemberForm.controls['passwordConfirmFc'].valid
|
||||
}"
|
||||
/>
|
||||
<label for="floatingPasswordConfirm">CONFIRMEZ VOTRE MOT DE PASSE</label>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
<button
|
||||
class="w-100 btn btn-lg btn-outline-success"
|
||||
type="submit"
|
||||
[disabled]="addMemberForm.invalid"
|
||||
>Ajouter le membre</button>
|
||||
</form>
|
||||
</main>
|
||||
</div>
|
||||
|
||||
|
@ -4,29 +4,72 @@
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
.form-signup {
|
||||
.form-addMember {
|
||||
width: 100%;
|
||||
max-width: 330px;
|
||||
padding: 15px;
|
||||
margin: auto;
|
||||
margin-top: 50px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
border: solid 1px;
|
||||
border-radius: 10px;
|
||||
background-color: #fcddec;
|
||||
border-color: #ef5da8;
|
||||
}
|
||||
|
||||
.form-signup .checkbox {
|
||||
.form-addMember .checkbox {
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.form-signup .form-floating:focus-within {
|
||||
.form-addMember .form-floating:focus-within {
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.form-signup input[type="email"] {
|
||||
margin-bottom: -1px;
|
||||
.form-addMember input[type="email"] {
|
||||
margin-bottom: 10px;
|
||||
border-bottom-right-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
|
||||
.form-signup input[type="password"] {
|
||||
.form-addMember input[type="color"] {
|
||||
border: none;
|
||||
margin-bottom: 10px;
|
||||
margin-top: -70px;
|
||||
margin-left: 100px;
|
||||
border-radius: 50%;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.form-addMember input[type="color"]::-webkit-color-swatch {
|
||||
border: none;
|
||||
margin-top: -15px;
|
||||
border-radius: 80%;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
}
|
||||
|
||||
.form-addMember input[type="text"] {
|
||||
margin-bottom: 10px;
|
||||
border-bottom-right-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
|
||||
.form-addMember input[type="date"] {
|
||||
margin-bottom: 10px;
|
||||
border-bottom-right-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
|
||||
.form-addMember input[type="password"] {
|
||||
margin-bottom: 10px;
|
||||
border-top-left-radius: 0;
|
||||
border-top-right-radius: 0;
|
||||
}
|
||||
|
||||
.btn-outline-success {
|
||||
margin-top: 10px;
|
||||
background-color: #ffff;
|
||||
color: #ef5da8 !important;
|
||||
border-color: #ef5da8 !important;
|
||||
}
|
||||
|
@ -3,6 +3,7 @@ import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms'
|
||||
import { Router } from '@angular/router';
|
||||
import { Membre } from 'src/app/models/membre';
|
||||
import { AuthService } from 'src/app/services/auth.service';
|
||||
import { MembreService } from 'src/app/services/membre.service';
|
||||
|
||||
@Component({
|
||||
selector: 'app-page-add-member',
|
||||
@ -13,6 +14,7 @@ export class PageAddMemberComponent implements OnInit {
|
||||
|
||||
public addMemberForm: FormGroup;
|
||||
constructor(
|
||||
private membreService: MembreService,
|
||||
private authService: AuthService,
|
||||
private router: Router,
|
||||
private fb: FormBuilder
|
||||
@ -27,7 +29,7 @@ export class PageAddMemberComponent implements OnInit {
|
||||
firstNameFc: new FormControl('', [Validators.required]),
|
||||
lastNameFc: new FormControl('', [Validators.required]),
|
||||
dateNaissanceFc: new FormControl('', [Validators.required]),
|
||||
couleurFc: new FormControl('', [Validators.required]),
|
||||
couleurFc: new FormControl('', []),
|
||||
emailFc: new FormControl('', [
|
||||
Validators.email,
|
||||
Validators.required,
|
||||
@ -74,7 +76,7 @@ export class PageAddMemberComponent implements OnInit {
|
||||
|
||||
if (membre.email !== '' && membre.password !== '') {
|
||||
this.authService.signup(membre).subscribe((resp) => {
|
||||
this.router.navigate(['account/signin']);
|
||||
this.router.navigate(['compte']);
|
||||
});
|
||||
} else {
|
||||
// affichage erreur
|
||||
|
@ -1,30 +1,27 @@
|
||||
<app-header></app-header>
|
||||
<app-side-bar></app-side-bar>
|
||||
<div class="signup-form text-center">
|
||||
<main class="form-signup">
|
||||
<form (ngSubmit)="onSubmit()" [formGroup]="teamForm">
|
||||
<h1>Créer votre team!</h1>
|
||||
<div class="form-floating">
|
||||
<input type="text"
|
||||
class="form-control"
|
||||
id="floatingInputName"
|
||||
placeholder=""
|
||||
name="name"
|
||||
formControlName="nameFc"
|
||||
[ngClass]="{'is-valid' : teamForm.controls['nameFc'].touched && teamForm.controls['nameFc'].valid,
|
||||
'is-invalid': teamForm.controls['nameFc'].touched && !teamForm.controls['nameFc'].valid}">
|
||||
<label for="floatingInputName">Nom</label>
|
||||
</div>
|
||||
<button class="w-100 btn btn-lg btn-success"
|
||||
type="submit"
|
||||
[disabled]="teamForm.invalid">Je crée ma team</button>
|
||||
<p>
|
||||
Value : {{ teamForm.value | json }}
|
||||
</p>
|
||||
<p>
|
||||
Form valid : {{ teamForm.valid }}
|
||||
</p>
|
||||
|
||||
</form>
|
||||
</main>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-auto">
|
||||
<app-side-bar></app-side-bar>
|
||||
</div>
|
||||
<div class=" col team-form text-center">
|
||||
<h1>Créer votre team</h1>
|
||||
<main class="form-team">
|
||||
<form (ngSubmit)="onSubmit()" [formGroup]="teamForm">
|
||||
<div class="form-floating">
|
||||
<input type="text"
|
||||
class="form-control"
|
||||
id="floatingInputName"
|
||||
placeholder=""
|
||||
name="name"
|
||||
formControlName="nameFc"
|
||||
[ngClass]="{'is-valid' : teamForm.controls['nameFc'].touched && teamForm.controls['nameFc'].valid,
|
||||
'is-invalid': teamForm.controls['nameFc'].touched && !teamForm.controls['nameFc'].valid}">
|
||||
<label for="floatingInputName">Nom</label>
|
||||
</div>
|
||||
<button class="w-100 btn btn-lg btn-success"
|
||||
type="submit"
|
||||
[disabled]="teamForm.invalid">Je crée ma team</button>
|
||||
</form>
|
||||
</main>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -1,31 +1,40 @@
|
||||
.team-form{
|
||||
margin-top: 20px;
|
||||
align-content: center;
|
||||
|
||||
}
|
||||
|
||||
button{
|
||||
margin-top: 10px;
|
||||
}
|
||||
.login-form {
|
||||
height: 100vh;
|
||||
padding-top: 40px;
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
.form-signup {
|
||||
.form-team {
|
||||
width: 100%;
|
||||
max-width: 330px;
|
||||
max-width: 500px;
|
||||
padding: 15px;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.form-signup .checkbox {
|
||||
.form-team .checkbox {
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.form-signup .form-floating:focus-within {
|
||||
.form-team .form-floating:focus-within {
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.form-signup input[type="email"] {
|
||||
.form-team input[type="email"] {
|
||||
margin-bottom: -1px;
|
||||
border-bottom-right-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
|
||||
.form-signup input[type="password"] {
|
||||
.form-team input[type="password"] {
|
||||
margin-bottom: 10px;
|
||||
border-top-left-radius: 0;
|
||||
border-top-right-radius: 0;
|
||||
|
@ -7,7 +7,7 @@ import {
|
||||
} from '@angular/forms';
|
||||
import { Router } from '@angular/router';
|
||||
import { Team } from 'src/app/models/team';
|
||||
import { AuthService } from '../../services/auth.service';
|
||||
import { TeamService } from 'src/app/services/team.service';
|
||||
|
||||
@Component({
|
||||
selector: 'app-page-creation-team',
|
||||
@ -17,7 +17,7 @@ import { AuthService } from '../../services/auth.service';
|
||||
export class PageCreationTeamComponent implements OnInit {
|
||||
public teamForm: FormGroup;
|
||||
constructor(
|
||||
private authService: AuthService,
|
||||
private teamService: TeamService,
|
||||
private router: Router,
|
||||
private fb: FormBuilder
|
||||
) {
|
||||
@ -43,7 +43,7 @@ export class PageCreationTeamComponent implements OnInit {
|
||||
|
||||
|
||||
if (team.nom !== '' ) {
|
||||
this.authService.creationTeam(team).subscribe((resp) => {
|
||||
this.teamService.addTeam(team).subscribe((resp) => {
|
||||
this.router.navigate(['compte']);
|
||||
});
|
||||
} else {
|
||||
|
@ -0,0 +1,12 @@
|
||||
<app-header></app-header>
|
||||
<div class="row">
|
||||
<div class="col-md-auto">
|
||||
<app-side-bar></app-side-bar>
|
||||
</div>
|
||||
<div class=" col compte text-center">
|
||||
<h1>Supprimer votre compte</h1>
|
||||
<main class="contenu-compte">
|
||||
|
||||
</main>
|
||||
</div>
|
||||
</div>
|
@ -0,0 +1,25 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { PageDeleteAccountComponent } from './page-delete-account.component';
|
||||
|
||||
describe('PageDeleteAccountComponent', () => {
|
||||
let component: PageDeleteAccountComponent;
|
||||
let fixture: ComponentFixture<PageDeleteAccountComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ PageDeleteAccountComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(PageDeleteAccountComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
@ -0,0 +1,15 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'app-page-delete-account',
|
||||
templateUrl: './page-delete-account.component.html',
|
||||
styleUrls: ['./page-delete-account.component.scss']
|
||||
})
|
||||
export class PageDeleteAccountComponent implements OnInit {
|
||||
|
||||
constructor() { }
|
||||
|
||||
ngOnInit(): void {
|
||||
}
|
||||
|
||||
}
|
@ -1 +1,12 @@
|
||||
<app-header></app-header>
|
||||
<div class="row">
|
||||
<div class="col-md-auto">
|
||||
<app-side-bar></app-side-bar>
|
||||
</div>
|
||||
<div class=" col compte text-center">
|
||||
<h1>Supprimer ce membre</h1>
|
||||
<main class="contenu-compte">
|
||||
|
||||
</main>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -1,5 +1,5 @@
|
||||
<app-header></app-header>
|
||||
|
||||
<app-side-bar></app-side-bar>
|
||||
<div>
|
||||
|
||||
<div class="ctn-link min-vh-100">
|
||||
|
@ -26,6 +26,6 @@
|
||||
<img style="max-height: 12% ; max-width: 12%" src="../../../assets/images/contact-1.png"/>
|
||||
<p class="fiche-contact" >{{ personne.prenom }} {{ personne.nom }}</p>
|
||||
</div>
|
||||
<div *ngIf="openDetails"><app-fiche-contact [personne]="openDetails"></app-fiche-contact></div>
|
||||
<div *ngIf="openDetails"><app-fiche-contact [personne]="openDetails" (clickDelete)="onClickDelete($event)"></app-fiche-contact></div>
|
||||
|
||||
</div>
|
||||
|
@ -69,7 +69,10 @@ export class PageRepertoireComponent implements OnInit {
|
||||
this.openDetails = personne;
|
||||
}
|
||||
|
||||
// this.repertoireService.deleteContact(contact).subscribe((resp) => {
|
||||
// this.router.navigate(['repertoire/']);
|
||||
// });
|
||||
|
||||
onClickDelete(contact: Contact){
|
||||
this.repertoireService.deleteContact(contact).subscribe((resp) => {
|
||||
this.router.navigate(['repertoire/']);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
@ -0,0 +1,12 @@
|
||||
<app-header></app-header>
|
||||
<div class="row">
|
||||
<div class="col-md-auto">
|
||||
<app-side-bar></app-side-bar>
|
||||
</div>
|
||||
<div class=" col compte text-center">
|
||||
<h1>Modifier votre compte</h1>
|
||||
<main class="contenu-compte">
|
||||
|
||||
</main>
|
||||
</div>
|
||||
</div>
|
@ -0,0 +1,25 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { PageUpdateAccountComponent } from './page-update-account.component';
|
||||
|
||||
describe('PageUpdateAccountComponent', () => {
|
||||
let component: PageUpdateAccountComponent;
|
||||
let fixture: ComponentFixture<PageUpdateAccountComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ PageUpdateAccountComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(PageUpdateAccountComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
@ -0,0 +1,15 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'app-page-update-account',
|
||||
templateUrl: './page-update-account.component.html',
|
||||
styleUrls: ['./page-update-account.component.scss']
|
||||
})
|
||||
export class PageUpdateAccountComponent implements OnInit {
|
||||
|
||||
constructor() { }
|
||||
|
||||
ngOnInit(): void {
|
||||
}
|
||||
|
||||
}
|
@ -1 +1,12 @@
|
||||
<app-header></app-header>
|
||||
<div class="row">
|
||||
<div class="col-md-auto">
|
||||
<app-side-bar></app-side-bar>
|
||||
</div>
|
||||
<div class=" col compte text-center">
|
||||
<h1>Modifier ce membre</h1>
|
||||
<main class="contenu-compte">
|
||||
|
||||
</main>
|
||||
</div>
|
||||
</div>
|
||||
|
16
src/app/services/membre.service.spec.ts
Normal file
16
src/app/services/membre.service.spec.ts
Normal file
@ -0,0 +1,16 @@
|
||||
import { TestBed } from '@angular/core/testing';
|
||||
|
||||
import { MembreService } from './membre.service';
|
||||
|
||||
describe('MembreService', () => {
|
||||
let service: MembreService;
|
||||
|
||||
beforeEach(() => {
|
||||
TestBed.configureTestingModule({});
|
||||
service = TestBed.inject(MembreService);
|
||||
});
|
||||
|
||||
it('should be created', () => {
|
||||
expect(service).toBeTruthy();
|
||||
});
|
||||
});
|
40
src/app/services/membre.service.ts
Normal file
40
src/app/services/membre.service.ts
Normal file
@ -0,0 +1,40 @@
|
||||
import { HttpClient } from '@angular/common/http';
|
||||
import { Injectable } from '@angular/core';
|
||||
import { Observable } from 'rxjs';
|
||||
import { environment } from 'src/environments/environment';
|
||||
import { Membre } from '../models/membre';
|
||||
|
||||
@Injectable({
|
||||
providedIn: 'root'
|
||||
})
|
||||
export class MembreService {
|
||||
apiUrl: string;
|
||||
tokenKey: string;
|
||||
|
||||
constructor(private http: HttpClient) {
|
||||
this.apiUrl = environment.apiUrl;
|
||||
this.tokenKey = environment.tokenKey;
|
||||
}
|
||||
|
||||
getMembres(): Observable<any> {
|
||||
return this.http.get(`${this.apiUrl}/membres/all`);
|
||||
}
|
||||
|
||||
getMembreId(id: any): Observable<any> {
|
||||
return this.http.get(`${this.apiUrl}/membres/1` + id);
|
||||
}
|
||||
|
||||
addMembre(membre: Membre): Observable<any> {
|
||||
console.log(membre);
|
||||
|
||||
return this.http.post(`${this.apiUrl}/membres/add`, membre);
|
||||
}
|
||||
|
||||
deleteMembre(membre: Membre): Observable<any> {
|
||||
return this.http.delete(`${this.apiUrl}/membres/delete/1`);
|
||||
}
|
||||
|
||||
updateMembre(membre: Membre): Observable<any> {
|
||||
return this.http.put(`${this.apiUrl}/membres/update/1`, membre);
|
||||
}
|
||||
}
|
16
src/app/services/team.service.spec.ts
Normal file
16
src/app/services/team.service.spec.ts
Normal file
@ -0,0 +1,16 @@
|
||||
import { TestBed } from '@angular/core/testing';
|
||||
|
||||
import { TeamService } from '../services/team.service';
|
||||
|
||||
describe('TeamService', () => {
|
||||
let service: TeamService;
|
||||
|
||||
beforeEach(() => {
|
||||
TestBed.configureTestingModule({});
|
||||
service = TestBed.inject(TeamService);
|
||||
});
|
||||
|
||||
it('should be created', () => {
|
||||
expect(service).toBeTruthy();
|
||||
});
|
||||
});
|
41
src/app/services/team.service.ts
Normal file
41
src/app/services/team.service.ts
Normal file
@ -0,0 +1,41 @@
|
||||
import { HttpClient } from '@angular/common/http';
|
||||
import { Injectable } from '@angular/core';
|
||||
import { Observable } from 'rxjs';
|
||||
import { environment } from 'src/environments/environment';
|
||||
import { Team } from '../models/team';
|
||||
|
||||
@Injectable({
|
||||
providedIn: 'root'
|
||||
})
|
||||
export class TeamService {
|
||||
apiUrl: string;
|
||||
tokenKey: string;
|
||||
|
||||
|
||||
constructor(private http: HttpClient) {
|
||||
this.apiUrl = environment.apiUrl;
|
||||
this.tokenKey = environment.tokenKey;
|
||||
}
|
||||
getTeams(): Observable<any> {
|
||||
return this.http.get(`${this.apiUrl}/teams/all`);
|
||||
}
|
||||
|
||||
getTeamById(id: any): Observable<any> {
|
||||
return this.http.get(`${this.apiUrl}/teams/1` + id);
|
||||
}
|
||||
|
||||
addTeam(team: Team): Observable<any> {
|
||||
console.log(team);
|
||||
|
||||
return this.http.post(`${this.apiUrl}/teams/add`, team);
|
||||
}
|
||||
|
||||
deleteTeam(team: Team): Observable<any> {
|
||||
return this.http.delete(`${this.apiUrl}/teams/delete/1`);
|
||||
}
|
||||
|
||||
updateTeam(team: Team): Observable<any> {
|
||||
return this.http.put(`${this.apiUrl}/teams/update/1`, team);
|
||||
}
|
||||
|
||||
}
|
@ -6,6 +6,8 @@
|
||||
<base href="/">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="icon" type="image/x-icon" href="favicon.ico">
|
||||
<!-- Pour accèder à la bibliothèque d'icons W3S-->
|
||||
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.0/css/all.css" integrity="sha384-lZN37f5QGtY3VHgisS14W3ExzMWZxybE1SJSEsQp9S+oqd12jhcu+A56Ebc1zFSJ" crossorigin="anonymous">
|
||||
</head>
|
||||
<body>
|
||||
<app-root></app-root>
|
||||
|
@ -1 +1,3 @@
|
||||
@import "~bootstrap/scss/bootstrap.scss";
|
||||
//Pour utiliser les icons ne fonctionne que si vous avez fait cette commande : npm i bootstrap-icons --save
|
||||
@import "~bootstrap-icons/font/bootstrap-icons.scss";
|
||||
|
Loading…
Reference in New Issue
Block a user