small fixes

matsen-tool/src/app/contacts/contacts-detail/contacts-detail.component.html

@@ -3,22 +3,23 @@
         <div class="col-8">
             <h1>{{ contact.firstName }} {{ contact.lastName }}</h1>
             <dl>
-                <dt>Position:</dt>
-                <dd>{{ contact.position }}</dd>
-                <dt>Telefon:</dt>
-                <dd>{{ contact.phone }}</dd>
-                <dt>E-Mail:</dt>
-                <dd><a href="mailto:{{contact.email}}">{{ contact.email }}</a></dd>
-                <dt>Geburtstag:</dt>
-                <dd>{{ contact.birthday | date:'dd.MM.YYYY' }}</dd>
+                <dt *ngIf="contact.position">Position:</dt>
+                <dd *ngIf="contact.position">{{ contact.position }}</dd>
+                <dt *ngIf="contact.phone">Telefon:</dt>
+                <dd *ngIf="contact.phone">{{ contact.phone }}</dd>
+                <dt *ngIf="contact.email">E-Mail:</dt>
+                <dd *ngIf="contact.email"><a href="mailto:{{contact.email}}">{{ contact.email }}</a></dd>
+                <dt *ngIf="contact.birthday">Geburtstag:</dt>
+                <dd *ngIf="contact.birthday">{{ contact.birthday | date:'dd.MM.YYYY' }}</dd>
             </dl>
         </div>
         <div class="col-4">
-            <img *ngIf="contact.imageUrl !== null" src="{{contact.imageUrl}}" width="247"
+            <img *ngIf="contact.imageUrl !== null && contact.imageUrl !== undefined" ngSrc="{{contact.imageUrl}}" width="247"
                  height="94"
                  alt="{{contact.firstName}} {{contact.lastName}}" title="{{contact.firstName}} {{contact.lastName}}"/>
         </div>
-        <span class="position-absolute bi bi-pencil" data-type="user-tool" data-action="edit" (click)="openModalEditContact()"></span>
+        <span class="position-absolute bi bi-pencil" data-type="user-tool" data-action="edit"
+              (click)="openModalEditContact()"></span>
     </div>
 </div>
 
@@ -38,7 +39,8 @@
                     <h3>{{ post.headline }}</h3>
                     <p>{{ post.message }}</p>
                 </div>
-                <span *ngIf="post.owner === user?.id" class="position-absolute bi bi-pencil" data-type="user-tool" data-action="edit" (click)="openModalEditPosting(post)"></span>
+                <span *ngIf="post.owner === user?.id" class="position-absolute bi bi-pencil" data-type="user-tool"
+                      data-action="edit" (click)="openModalEditPosting(post)"></span>
             </div>
         </div>
         <div class="card ms-5" *ngFor="let comment of post.comments">
@@ -50,7 +52,8 @@
                 <div>
                     <p>{{ comment.message }}</p>
                 </div>
-                <span *ngIf="comment.owner === user?.id" class="position-absolute bi bi-pencil" data-type="user-tool" data-action="edit" (click)="openModalEditComment(comment)"></span>
+                <span *ngIf="comment.owner === user?.id" class="position-absolute bi bi-pencil" data-type="user-tool"
+                      data-action="edit" (click)="openModalEditComment(comment)"></span>
             </div>
         </div>
 

matsen-tool/src/app/contacts/contacts-detail/contacts-detail.component.ts

@@ -67,7 +67,7 @@ export class ContactsDetailComponent implements OnInit, AfterViewInit {
         });
         this.getContactData();
         this.getPostsData();
-        console.log(this.posts);
+        console.log(this.contact.imageUrl);
     }
 
     ngAfterViewInit() {

matsen-tool/src/app/partners/partners-detail/partners-detail.component.html

@@ -25,7 +25,7 @@
             </dl>
         </div>
         <div class="col-4">
-            <img *ngIf="partner.logoUrl !== null" src="{{partner.logoUrl}}" width="247"
+            <img *ngIf="partner.logoUrl !== null && partner.logoUrl !== undefined" src="{{partner.logoUrl}}" width="247"
                  height="94" alt="{{partner.name}}" title="{{partner.name}}"/>
         </div>
     </div>
@@ -46,7 +46,8 @@
                             {{ contact.position }}</p>
                     </div>
                     <div class="col-4">
-                        <img src="{{contact.imageUrl}}" width="247" height="94"
+                        <img *ngIf="contact.imageUrl !== null && contact.imageUrl !== undefined"
+                             ngSrc="{{contact.imageUrl}}" width="247" height="94"
                              alt="{{contact.firstName}} {{contact.lastName}}"
                              title="{{contact.firstName}} {{contact.lastName}}"/>
                     </div>

matsen-tool/src/app/partners/partners.component.html

@@ -14,6 +14,15 @@
         </td>
     </ng-container>
 
+    <ng-container matColumnDef="image">
+        <th mat-header-cell *matHeaderCellDef>
+            Logo
+        </th>
+        <td mat-cell *matCellDef="let element">
+            <img src="{{ element.logoUrl }}" (click)="navigateToPartnerDetails(element)" width="40" height="40" />
+        </td>
+    </ng-container>
+
     <ng-container matColumnDef="name">
         <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription="Nach Partner sortieren">
             Partner

matsen-tool/src/app/partners/partners.component.scss

@@ -1,5 +1,9 @@
 table {
   width: 100%;
+  img {
+    width: 40px;
+    height: auto;
+  }
 }
 
 th.mat-sort-header-sorted {

matsen-tool/src/app/partners/partners.component.ts

@@ -54,7 +54,7 @@ export class PartnersComponent implements OnInit, AfterViewInit {
 
         this.partnersSub = new Subscription();
         this.partners = [];
-        this.displayedColumns = ['pos', 'name', 'address', 'website'];
+        this.displayedColumns = ['pos', 'image', 'name', 'address', 'website'];
 
         this.nameOrderAsc = OrderFilter.Asc;
         this.cityOrderAsc = OrderFilter.Asc;