clean code

This commit is contained in:
Chneemann 2024-03-28 08:13:27 +01:00
parent fb6aa4c354
commit a659bb98ae
4 changed files with 25 additions and 14 deletions

View file

@ -4,28 +4,31 @@
<div class="blue-bar"></div> <div class="blue-bar"></div>
<div class="metrics-txt">Better with a team</div> <div class="metrics-txt">Better with a team</div>
</div> </div>
@if (paramsId) { @if (currentUserId) {
<div <div
class="contact-details" class="contact-details"
[ngClass]="{ [ngClass]="{
'animation-coming-in': paramsId 'animation-coming-in': currentUserId
}" }"
> >
<div class="header"> <div class="header">
<div <div
class="circle" class="circle"
[ngStyle]="{ [ngStyle]="{
'background-color': userService.displayUserDetails(paramsId, 'color') 'background-color': userService.displayUserDetails(
currentUserId,
'color'
)
}" }"
> >
<div class="initials"> <div class="initials">
{{ userService.displayUserDetails(paramsId, "initials") }} {{ userService.displayUserDetails(currentUserId, "initials") }}
</div> </div>
</div> </div>
<div class="details"> <div class="details">
<div class="name"> <div class="name">
{{ userService.displayUserDetails(paramsId, "firstName") }} {{ userService.displayUserDetails(currentUserId, "firstName") }}
{{ userService.displayUserDetails(paramsId, "lastName") }} {{ userService.displayUserDetails(currentUserId, "lastName") }}
</div> </div>
<div class="btns"> <div class="btns">
<div class="btn"> <div class="btn">
@ -43,12 +46,20 @@
<div class="headline">Contact Information</div> <div class="headline">Contact Information</div>
<div class="info"> <div class="info">
<p>Email:</p> <p>Email:</p>
<a [href]="'mail:' + userService.displayUserDetails(paramsId, 'email')"> <a
{{ userService.displayUserDetails(paramsId, "email") }} [href]="
'mail:' + userService.displayUserDetails(currentUserId, 'email')
"
>
{{ userService.displayUserDetails(currentUserId, "email") }}
</a> </a>
<p>Phone:</p> <p>Phone:</p>
<a [href]="'tel:' + userService.displayUserDetails(paramsId, 'phone')"> <a
{{ userService.displayUserDetails(paramsId, "phone") }} [href]="
'tel:' + userService.displayUserDetails(currentUserId, 'phone')
"
>
{{ userService.displayUserDetails(currentUserId, "phone") }}
</a> </a>
</div> </div>
</div> </div>

View file

@ -12,7 +12,7 @@ import { ContactsComponent } from '../contacts.component';
styleUrl: './contact-detail.component.scss', styleUrl: './contact-detail.component.scss',
}) })
export class ContactDetailComponent { export class ContactDetailComponent {
@Input() paramsId: string = ''; @Input() currentUserId: string = '';
constructor(public userService: UserService) {} constructor(public userService: UserService) {}
} }

View file

@ -68,5 +68,5 @@
} } } }
</div> </div>
</div> </div>
<app-contact-detail [paramsId]="paramsId"></app-contact-detail> <app-contact-detail [currentUserId]="currentUserId"></app-contact-detail>
</section> </section>

View file

@ -16,7 +16,7 @@ export class ContactsComponent {
allUsers: User[] = []; allUsers: User[] = [];
usersFirstLetter: string[] = []; usersFirstLetter: string[] = [];
usersByFirstLetter: { [key: string]: string[] } = {}; usersByFirstLetter: { [key: string]: string[] } = {};
paramsId: string = ''; currentUserId: string = '';
constructor(public userService: UserService, private route: ActivatedRoute) { constructor(public userService: UserService, private route: ActivatedRoute) {
this.userService.subUserList().subscribe(() => { this.userService.subUserList().subscribe(() => {
@ -34,7 +34,7 @@ export class ContactsComponent {
routeUserId() { routeUserId() {
if (this.route.params.subscribe()) { if (this.route.params.subscribe()) {
this.route.params.subscribe((params) => { this.route.params.subscribe((params) => {
this.paramsId = params['id']; this.currentUserId = params['id'];
}); });
} }
} }