isa44.74
/
organizee-front
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #33 from AlineRinquin/aline 

Ajout des couleurs et un peu css
This commit is contained in:
AlineRinquin 2022-02-17 10:22:54 +01:00 committed by GitHub
parent e7b64f14fc 49049bc255
commit 30fa1f7de5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
8 changed files with 60 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
src/app/components/fiche-contact/fiche-contact.component.html
View File

@ -11,18 +11,32 @@
</button>
</div>
<div class="row align-items-center">
<div class="col-md-6 offset-md-3">
<p class="fiche-contact" >
{{ personne.couleur }}</p>
<p class="fiche-contact" >{{ personne.prenom }} {{ personne.nom }}</p>
<p class="fiche-contact" ><img style="max-height: 12% ; max-width: 12%" src="../../../assets/images/phone.png"/>
{{ personne.telephone }}</p>
<p class="fiche-contact" ><img style="max-height: 12% ; max-width: 12%" src="../../../assets/images/logo-gmail.png"/>
{{ personne.email }}</p>
<p class="fiche-contact" ><img style="max-height: 12% ; max-width: 12%" src="../../../assets/images/gateau.png"/>
{{ personne.dateNaissance }}</p>
<p class="fiche-contact" >
{{ personne.adresse }}</p>
<div class="col-md-12">
<div class="row d-flex justify-content-center flex-row">
<div class= "couleur col-4" [style.background-color]="personne.couleur"></div>
<span class="fiche-contact col-7" >{{ personne.prenom }} {{ personne.nom }} </span>
</div>
<div class="row d-flex justify-content-center flex-row">
<img class= "col-4" style="max-height: 12% ; max-width: 12%" src="../../../assets/images/phone.png"/>
<span class="fiche-contact col-7" >{{ personne.telephone }}</span>
</div>
<div class="row d-flex justify-content-center flex-row">
<img class= "col-4" style="max-height: 12% ; max-width: 12%" src="../../../assets/images/logo-gmail.png"/>
<span class="fiche-contact col-7" >{{ personne.email }}</span>
</div>
<div class="row d-flex justify-content-center flex-row">
<img class= "col-4" style="max-height: 12% ; max-width: 12%" src="../../../assets/images/gateau.png"/>
<span class="fiche-contact col-7" >{{ personne.dateNaissance }}</span>
</div>
<div class="row d-flex justify-content-center flex-row">
<p class="fiche-contact col-7" >{{ personne.adresse }}</p>
</div>
</div>
</div>

20
src/app/components/fiche-contact/fiche-contact.component.scss
View File

@ -7,6 +7,26 @@
margin: auto;
}
.couleur{
border: none;
margin-top: -15px;
border-radius: 80%;
width: 60px;
height: 60px;
flex-direction: row;
}
.info{
display:flex;
justify-content: center;
}
.fiche-contact{
display:flex;
justify-content: center;
flex-direction: row;
}
.container {
border: 1px solid 8c2e9b;
padding: 10px;

1
src/app/pages/page-ajout-contact/page-ajout-contact.component.ts
View File

@ -30,6 +30,7 @@ export class PageAjoutContactComponent implements OnInit {
ngOnInit(): void {
// *********************************pensser à changer group car déprécié********************************
this.ajoutContactForm = this.fb.group({
couleurFc: new FormControl('', [Validators.required]),
lastNameFc: new FormControl('', [Validators.required]),
firstNameFc: new FormControl('', [Validators.required]),
telephoneFc: new FormControl('', [Validators.required]),

2
src/app/pages/page-modifier-contact/page-modifier-contact.component.html
View File

@ -10,7 +10,7 @@
<div class="form-floating">
<input type="color" class="form-control" id="floatingInputcouleur" placeholder="" name="couleur"
formControlName="couleurFc">
formControlName="couleurFc" value= "{{ listContactInfo.couleur }}">
</div>
<div class="form-floating">

3
src/app/pages/page-modifier-contact/page-modifier-contact.component.ts
View File

@ -44,6 +44,7 @@ export class PageModifierContactComponent implements OnInit {
// *********************************pensser à changer group car déprécié********************************
this.modifContactForm = this.fb.group({
couleurFc: new FormControl('', [Validators.required]),
lastNameFc: new FormControl('', [Validators.required]),
firstNameFc: new FormControl('', [Validators.required]),
telephoneFc: new FormControl('', [Validators.required]),
@ -71,7 +72,7 @@ export class PageModifierContactComponent implements OnInit {
//Méthode qui envoie les champs modifiés pour mise à jour
public onSubmit(): void {
const couleurValue = this.modifContactForm.value[''];
const couleurValue = this.modifContactForm.value['couleurFc'];
const firstNameValue = this.modifContactForm.value['firstNameFc'];
const lastNameValue = this.modifContactForm.value['lastNameFc'];
const telephoneValue = this.modifContactForm.value['telephoneFc'];

2
src/app/pages/page-repertoire/page-repertoire.component.html
View File

@ -27,7 +27,7 @@
<div class="row justify-content-evenly">
<div class="col-4">
<div *ngFor="let personne of listContact" (click)="onClick(personne)">
<img style="max-height: 12% ; max-width: 12%" src="../../../assets/images/contact-1.png" />
<div class= "couleur" [style.background-color]="personne.couleur"></div>
<p class="fiche-contact">{{ personne.prenom }} {{ personne.nom }}</p>
</div>
</div>

8
src/app/pages/page-repertoire/page-repertoire.component.scss
View File

@ -16,6 +16,14 @@
flex-direction: row;
}
.couleur{
border: none;
margin-top: -15px;
border-radius: 80%;
width: 60px;
height: 60px;
flex-direction: row;
}
;h4 {
color: black;
font-weight: bold;

2
src/app/services/repertoire.service.ts
View File

@ -38,6 +38,6 @@ export class RepertoireService {
}
updateContact(contact: Contact): Observable<any> {
return this.http.put(`${this.apiUrl}/contacts/update/`, contact);
return this.http.put(`${this.apiUrl}/contacts/update/1`, contact);
}
}