translations

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

@@ -4,13 +4,13 @@
             <div class="col-8">
                 <h1>{{ contact.firstName }} {{ contact.lastName }}</h1>
                 <dl>
-                    <dt *ngIf="contact.position">Position:</dt>
+                    <dt *ngIf="contact.position">{{'form.position' | translate}}:</dt>
                     <dd *ngIf="contact.position">{{ contact.position }}</dd>
-                    <dt *ngIf="contact.phone">Telefon:</dt>
+                    <dt *ngIf="contact.phone">{{'form.phone' | translate}}:</dt>
                     <dd *ngIf="contact.phone">{{ contact.phone }}</dd>
-                    <dt *ngIf="contact.email">E-Mail:</dt>
+                    <dt *ngIf="contact.email">{{'form.email' | translate}}:</dt>
                     <dd *ngIf="contact.email"><a href="mailto:{{contact.email}}">{{ contact.email }}</a></dd>
-                    <dt *ngIf="contact.birthday">Geburtstag:</dt>
+                    <dt *ngIf="contact.birthday">{{'form.birthday' | translate}}:</dt>
                     <dd *ngIf="contact.birthday">{{ contact.birthday | date:'dd.MM.YYYY' }}</dd>
                 </dl>
             </div>
@@ -27,8 +27,8 @@
 <div class="spt-container">
     <div class="posts">
         <div class="d-flex justify-content-between align-items-start">
-            <h2>Notizen</h2>
-            <button class="btn btn-primary" (click)="openModalNewPosting()">Neue Notiz</button>
+            <h2>{{'basic.posts' | translate}}</h2>
+            <button class="btn btn-primary" (click)="openModalNewPosting()">{{'basic.new-post' | translate}}</button>
         </div>
         <div class="post mb-3" *ngFor="let post of posts">
             <div class="card">
@@ -60,7 +60,7 @@
             </div>
 
             <div class="d-flex justify-content-end mt-1">
-                <span role="button" class="badge bg-secondary p-2" (click)="openModalNewComment(post)">Kommentieren</span>
+                <span role="button" class="badge bg-secondary p-2" (click)="openModalNewComment(post)">{{'basic.comment-it' | translate}}</span>
             </div>
         </div>
         <mat-paginator *ngIf="posts.length > 0" class="rounded-1"

matsen-tool/src/app/contacts/new-contact/new-contact.component.html

@@ -1,47 +1,48 @@
-<h2>Neuer Kontakt</h2>
+<h2 *ngIf="!contact.id">{{'basic.new-contact' | translate}}</h2>
+<h2 *ngIf="contact.id">{{'basic.edit-contact' | translate}}</h2>
 <div class="spt-form">
     <form [formGroup]="contactForm" (ngSubmit)="onSubmit()">
         <div class="mb-3">
-            <label for="firstName" class="form-label">Vorname:</label>
+            <label for="firstName" class="form-label">{{'form.firstname' | translate}}:</label>
             <input type="text" class="form-control" id="firstName" formControlName="firstName" />
             <div class="form-text" *ngIf="contactForm.get('firstName')?.invalid && contactForm.get('firstName')?.touched">
-                Vorname ist erforderlich.
+                {{'form.firstname' | translate}} {{'form.mandatory' | translate}}.
             </div>
         </div>
 
         <div class="mb-3">
-            <label for="lastName" class="form-label">Nachname:</label>
+            <label for="lastName" class="form-label">{{'form.lastname' | translate}}:</label>
             <input type="text" class="form-control" id="lastName" formControlName="lastName" />
             <div class="form-text" *ngIf="contactForm.get('lastName')?.invalid && contactForm.get('lastName')?.touched">
-                Nachname ist erforderlich.
+                {{'form.lastname' | translate}} {{'form.mandatory' | translate}}.
             </div>
         </div>
 
         <div class="mb-3">
-            <label for="birthday" class="form-label">Geburtstag:</label>
+            <label for="birthday" class="form-label">{{'form.birthday' | translate}}:</label>
             <input type="date" class="form-control" id="birthday" formControlName="birthday" />
         </div>
 
         <div class="mb-3">
-            <label for="position" class="form-label">Position:</label>
+            <label for="position" class="form-label">{{'form.position' | translate}}:</label>
             <input type="text" class="form-control" id="position" formControlName="position" />
         </div>
 
         <div class="mb-3">
-            <label for="email" class="form-label">E-Mail:</label>
+            <label for="email" class="form-label">{{'form.email' | translate}}:</label>
             <input type="email" class="form-control" id="email" formControlName="email" />
             <div class="form-text" *ngIf="contactForm.get('email')?.invalid && contactForm.get('email')?.touched">
-                Geben Sie eine gültige E-Mail-Adresse ein.
+                {{'form.email-validation' | translate}}.
             </div>
         </div>
 
         <div class="mb-3">
-            <label for="phone" class="form-label">Telefon:</label>
+            <label for="phone" class="form-label">{{'form.phone' | translate}}:</label>
             <input type="text" class="form-control" id="phone" formControlName="phone" />
         </div>
 
         <div class="mb-3">
-            <label for="image" class="form-label">Bild hochladen:</label>
+            <label for="image" class="form-label">{{'form.upload-image' | translate}}:</label>
             <input type="file" class="form-control" id="image" (change)="onFileSelected($event)" accept="image/*" />
         </div>
 
@@ -51,7 +52,7 @@
             </div>
         </div>
 
-        <button type="submit" class="btn btn-primary" [disabled]="contactForm.invalid">Abschicken</button>
+        <button type="submit" class="btn btn-primary" [disabled]="contactForm.invalid">{{'form.send' | translate}}</button>
     </form>
 </div>
 

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

@@ -1,14 +1,14 @@
 <div class="spt-container">
     <div class="d-flex justify-content-between align-items-start">
-        <h2>Dokumente</h2>
-        <button class="btn btn-primary" (click)="openModalNewDocument()">Neues Dokument</button>
+        <h2>{{ 'basic.documents' | translate }}</h2>
+        <button class="btn btn-primary" (click)="openModalNewDocument()">{{'basic.new-document' | translate}}</button>
     </div>
     <table mat-table [dataSource]="dataSource" matSort (matSortChange)="onSortChange($event)"
            class="mat-elevation-z8 mb-3">
 
         <ng-container matColumnDef="pos">
             <th mat-header-cell *matHeaderCellDef>
-                Nr.
+                {{ 'overview.number' | translate }}
             </th>
             <td mat-cell
                 *matCellDef="let element">{{ (pageSize * pageIndex) + dataSource.filteredData.indexOf(element) + 1 }}
@@ -16,24 +16,24 @@
         </ng-container>
 
         <ng-container matColumnDef="name">
-            <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription="Nach Dokument sortieren">
-                Dokument
+            <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription="{{ 'overview.sort' | translate }}: {{ 'overview.document' | translate }}">
+                {{ 'overview.document' | translate }}
             </th>
             <td mat-cell *matCellDef="let element"><span (click)="navigateToDocumentFile(element)">{{ element.name }}</span>
             </td>
         </ng-container>
 
         <ng-container matColumnDef="type">
-            <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription="Nach Typ sortieren">
-                Typ
+            <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription="{{ 'overview.sort' | translate }}: {{ 'overview.type' | translate }}">
+                {{ 'overview.type' | translate }}
             </th>
             <td mat-cell *matCellDef="let element">{{ element.storage }}
             </td>
         </ng-container>
 
         <ng-container matColumnDef="date">
-            <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription="Nach Hochgeladen am sortieren">
-                Hochgeladen am
+            <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription="{{ 'overview.sort' | translate }}: {{ 'overview.uploaded' | translate }}">
+                {{ 'overview.uploaded' | translate }}
             </th>
             <td mat-cell *matCellDef="let element"><a href="{{ element.number }}" target="_blank">{{ element.website }}</a>
             </td>

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

@@ -10,13 +10,14 @@ import {NgIf} from "@angular/common";
 import {ModalComponent} from "@app/_components/modal/modal.component";
 import {NgbModal} from "@ng-bootstrap/ng-bootstrap";
 import {NewDocumentComponent} from "@app/documents/new-document/new-document.component";
+import {TranslateModule} from "@ngx-translate/core";
 
 @Component({
     selector: 'app-documents',
     templateUrl: './documents.component.html',
     styleUrl: './documents.component.scss',
     standalone: true,
-    imports: [MatTableModule, MatSortModule, MatPaginatorModule, RouterLink, RouterLinkActive, NgIf],
+    imports: [MatTableModule, MatSortModule, MatPaginatorModule, RouterLink, RouterLinkActive, NgIf, TranslateModule],
 })
 export class DocumentsComponent {
     @ViewChild(MatSort) sort;

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

@@ -1,8 +1,8 @@
 <div class="home-container pb-5">
     <div class="pt-4">
         <div class="container">
-            <h1>Hi {{ user?.firstName }}!</h1>
-            <p><a routerLink="/users">Manage Users</a></p>
+            <h1>{{'user.hello' | translate}} {{ user?.firstName }}!</h1>
+            <p *ngIf="userIsAdmin"><a routerLink="/users">Manage Users</a></p>
         </div>
     </div>
 
@@ -11,21 +11,21 @@
             <div class="col d-flex">
                 <a class="card" routerLink="/customer" routerLinkActive="active">
                     <div class="card-body position-relative bi bi-emoji-heart-eyes">
-                        <h3 class="position-absolute m-0">Kunden</h3>
+                        <h3 class="position-absolute m-0">{{'basic.customer' | translate}}</h3>
                     </div>
                 </a>
             </div>
             <div class="col d-flex">
                 <a class="card" routerLink="/supplier" routerLinkActive="active">
                     <div class="card-body position-relative bi bi-emoji-kiss">
-                        <h3 class="position-absolute m-0">Dienstleister</h3>
+                        <h3 class="position-absolute m-0">{{'basic.supplier' | translate}}</h3>
                     </div>
                 </a>
             </div>
             <div class="col d-flex">
                 <a class="card" routerLink="/service" routerLinkActive="active">
                     <div class="card-body position-relative bi bi-emoji-smile">
-                        <h3 class="position-absolute m-0">Lieferanten</h3>
+                        <h3 class="position-absolute m-0">{{'basic.service' | translate}}</h3>
                     </div>
                 </a>
             </div>
@@ -37,21 +37,21 @@
             <div class="col d-flex">
                 <a class="card" routerLink="/products" routerLinkActive="active">
                     <div class="card-body position-relative bi bi-droplet-fill">
-                        <h3 class="position-absolute m-0">Produkte</h3>
+                        <h3 class="position-absolute m-0">{{'basic.products' | translate}}</h3>
                     </div>
                 </a>
             </div>
             <div class="col d-flex">
                 <a class="card" routerLink="/tasks" routerLinkActive="active">
                     <div class="card-body position-relative bi bi-list-check">
-                        <h3 class="position-absolute m-0">Aufgaben</h3>
+                        <h3 class="position-absolute m-0">{{'basic.tasks' | translate}}</h3>
                     </div>
                 </a>
             </div>
             <div class="col d-flex">
                 <a class="card" routerLink="/documents" routerLinkActive="active">
                     <div class="card-body position-relative bi bi-journals">
-                        <h3 class="position-absolute m-0">Dokumente</h3>
+                        <h3 class="position-absolute m-0">{{'basic.documents' | translate}}</h3>
                     </div>
                 </a>
             </div>

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

@@ -17,6 +17,8 @@ export class HomeComponent implements OnInit {
     protected usersSub: Subscription;
     protected users: Array<UserJsonld>;
 
+    protected userIsAdmin: boolean;
+
     constructor(
         private accountService: AccountService,
         private postService: PostService,
@@ -29,9 +31,15 @@ export class HomeComponent implements OnInit {
 
         this.usersSub = new Subscription();
         this.users = [];
+
+        this.userIsAdmin = false;
     }
 
     ngOnInit(): void {
+        console.log(this.user);
+        if (this.user) {
+            this.userIsAdmin = this.user.roles ? this.user.roles.includes('ROLE_ADMIN') : false;
+        }
         this.postSub = this.postService.postsGetCollection().subscribe(
             data => {
                 this.posts = data["hydra:member"];

matsen-tool/src/app/layout/two-column/two-column.component.html

@@ -4,42 +4,42 @@
             <li class="nav-item mb-3">
                 <a class="card" routerLink="/customer" routerLinkActive="active">
                     <div class="card-body position-relative bi bi-emoji-heart-eyes">
-                        <h3 class="position-absolute m-0">Kunden</h3>
+                        <h3 class="position-absolute m-0">{{'basic.customer' | translate}}</h3>
                     </div>
                 </a>
             </li>
             <li class="nav-item mb-3">
                 <a class="card" routerLink="/supplier" routerLinkActive="active">
                     <div class="card-body position-relative bi bi-emoji-kiss">
-                        <h3 class="position-absolute m-0">Dienstleister</h3>
+                        <h3 class="position-absolute m-0">{{'basic.supplier' | translate}}</h3>
                     </div>
                 </a>
             </li>
             <li class="nav-item mb-3">
                 <a class="card" routerLink="/service" routerLinkActive="active">
                     <div class="card-body position-relative bi bi-emoji-smile">
-                        <h3 class="position-absolute m-0">Lieferanten</h3>
+                        <h3 class="position-absolute m-0">{{'basic.service' | translate}}</h3>
                     </div>
                 </a>
             </li>
             <li class="nav-item mb-3">
                 <a class="card" routerLink="/products" routerLinkActive="active">
                     <div class="card-body position-relative bi bi-droplet-fill">
-                        <h3 class="position-absolute m-0">Produkte</h3>
+                        <h3 class="position-absolute m-0">{{'basic.products' | translate}}</h3>
                     </div>
                 </a>
             </li>
             <li class="nav-item mb-3">
                 <a class="card" routerLink="/tasks" routerLinkActive="active">
                     <div class="card-body position-relative bi bi-list-check">
-                        <h3 class="position-absolute m-0">Aufgaben</h3>
+                        <h3 class="position-absolute m-0">{{'basic.tasks' | translate}}</h3>
                     </div>
                 </a>
             </li>
             <li class="nav-item mb-3">
                 <a class="card" routerLink="/documents" routerLinkActive="active">
                     <div class="card-body position-relative bi bi-journals">
-                        <h3 class="position-absolute m-0">Dokumente</h3>
+                        <h3 class="position-absolute m-0">{{'basic.documents' | translate}}</h3>
                     </div>
                 </a>
             </li>
@@ -47,7 +47,7 @@
     </div>
     <div class="col-10">
         <div class="pe-3 pt-3">
-            <button class="btn btn-secondary mb-3" (click)="goBack()">Zurück</button>
+            <button class="btn btn-secondary mb-3" (click)="goBack()">{{'basic.back' | translate}}</button>
             <router-outlet></router-outlet>
         </div>
     </div>

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

@@ -1,46 +1,47 @@
-<h2>Neuer Partner</h2>
+<h2 *ngIf="!partner.id">{{'basic.new' | translate}} {{ partnerNameOne }}</h2>
+<h2 *ngIf="partner.id">{{'basic.edit-before' | translate}} {{ partnerNameOne }} {{'basic.edit-after' | translate}}</h2>
 <div class="spt-form">
     <form [formGroup]="partnerForm" (ngSubmit)="onSubmit()">
         <div class="mb-3">
-            <label for="name" class="form-label">Name:</label>
+            <label for="name" class="form-label">{{'form.name' | translate}}:</label>
             <input type="text" class="form-control" id="name" formControlName="name" />
             <div class="form-text" *ngIf="partnerForm.get('name')?.invalid && partnerForm.get('name')?.touched">
-                Name ist erforderlich.
+                {{'form.name' | translate}} {{'form.mandatory' | translate}}.
             </div>
         </div>
 
         <div class="mb-3">
-            <label for="street" class="form-label">Straße:</label>
+            <label for="street" class="form-label">{{'form.street' | translate}}:</label>
             <input type="text" class="form-control" id="street" formControlName="street" />
         </div>
 
         <div class="mb-3">
-            <label for="streetNo" class="form-label">Hausnummer:</label>
+            <label for="streetNo" class="form-label">{{'form.street-no' | translate}}:</label>
             <input type="text" class="form-control" id="streetNo" formControlName="streetNo" />
         </div>
 
         <div class="mb-3">
-            <label for="zip" class="form-label">PLZ:</label>
+            <label for="zip" class="form-label">{{'form.zip' | translate}}:</label>
             <input type="text" class="form-control" id="zip" formControlName="zip" />
         </div>
 
         <div class="mb-3">
-            <label for="city" class="form-label">Stadt:</label>
+            <label for="city" class="form-label">{{'form.city' | translate}}:</label>
             <input type="text" class="form-control" id="city" formControlName="city" />
         </div>
 
         <div class="mb-3">
-            <label for="country" class="form-label">Land:</label>
+            <label for="country" class="form-label">{{'form.country' | translate}}:</label>
             <input type="text" class="form-control" id="country" formControlName="country" />
         </div>
 
         <div class="mb-3">
-            <label for="website" class="form-label">Website:</label>
+            <label for="website" class="form-label">{{'form.website' | translate}}:</label>
             <input type="text" class="form-control" id="website" formControlName="website" />
         </div>
 
         <div class="mb-3">
-            <label for="logo" class="form-label">Bild hochladen:</label>
+            <label for="logo" class="form-label">{{'form.upload-image' | translate}}:</label>
             <input type="file" class="form-control" id="logo" (change)="onFileSelected($event)" accept="image/*" />
         </div>
 
@@ -50,7 +51,7 @@
             </div>
         </div>
 
-        <button type="submit" class="btn btn-primary" [disabled]="partnerForm.invalid">Abschicken</button>
+        <button type="submit" class="btn btn-primary" [disabled]="partnerForm.invalid">{{'form.send' | translate}}</button>
     </form>
 </div>
 

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

@@ -22,6 +22,8 @@ export class NewPartnerComponent implements OnInit {
     protected partnerSub: Subscription;
     protected mediaSub: Subscription;
 
+    protected partnerNameOne: string;
+
     constructor(
         private partnerService: PartnerService,
         private mediaService: MediaService,
@@ -32,10 +34,15 @@ export class NewPartnerComponent implements OnInit {
 
         this.partnerSub = new Subscription();
         this.mediaSub = new Subscription();
+
+        this.partnerNameOne = "";
     }
 
     ngOnInit(): void {
         this.partnerForm = FormGroupInitializer.initFormGroup(this.partnerForm, this.partner);
+        this.translateService.get('basic.' + this.partner.type + 'One').subscribe((translation: string) => {
+            this.partnerNameOne = translation;
+        });
     }
 
     // On submit form: Check if image is set

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

@@ -37,8 +37,8 @@
 <div class="spt-container">
     <div class="contacts">
         <div class="d-flex justify-content-between align-items-start">
-            <h2>Kontakte</h2>
-            <button class="btn btn-primary" (click)="openModalNewContact()">Neuer Kontakt</button>
+            <h2>{{'basic.contacts' | translate}}</h2>
+            <button class="btn btn-primary" (click)="openModalNewContact()">{{'basic.new-contact' | translate}}</button>
         </div>
         <div class="row">
             <div class="col-4" *ngFor="let contact of contacts">
@@ -59,7 +59,7 @@
                     </div>
                 </div>
                 <div class="d-flex justify-content-end mt-1 mb-4">
-                    <span role="button" (click)="navigateToContactDetails(contact)" class="badge bg-secondary p-2">Details</span>
+                    <span role="button" (click)="navigateToContactDetails(contact)" class="badge bg-secondary p-2">{{'basic.details' | translate}}</span>
                 </div>
             </div>
         </div>
@@ -101,8 +101,8 @@
 <div class="spt-container">
     <div class="spt-accordion">
         <div class="d-flex justify-content-between align-items-start">
-            <h2>Aufgaben</h2>
-            <button class="btn btn-primary" (click)="openModalNewTask()">Neue Aufgabe</button>
+            <h2>{{'basic.tasks' | translate}}</h2>
+            <button class="btn btn-primary" (click)="openModalNewTask()">{{'basic.new-task' | translate}}</button>
         </div>
         <div class="card mb-3 p-3">
             <div class="position-relative" data-bs-toggle="collapse" data-bs-target="#collapseExample"
@@ -154,8 +154,8 @@
 <div class="spt-container">
     <div class="posts">
         <div class="d-flex justify-content-between align-items-start">
-            <h2>Notizen</h2>
-            <button class="btn btn-primary" (click)="openModalNewPosting()">Neue Notiz</button>
+            <h2>{{'basic.posts' | translate}}</h2>
+            <button class="btn btn-primary" (click)="openModalNewPosting()">{{'basic.new-post' | translate}}</button>
         </div>
         <div class="post mb-3" *ngFor="let post of posts">
             <div class="card">
@@ -187,7 +187,7 @@
             </div>
 
             <div class="d-flex justify-content-end mt-1">
-                <span role="button" class="badge bg-secondary p-2" (click)="openModalNewComment(post)">Kommentieren</span>
+                <span role="button" class="badge bg-secondary p-2" (click)="openModalNewComment(post)">{{'basic.comment-it' | translate}}</span>
             </div>
         </div>
         <mat-paginator *ngIf="posts.length > 0" class="rounded-1"

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

@@ -1,14 +1,16 @@
 <div class="spt-container">
     <div class="d-flex justify-content-between align-items-start">
         <h2>{{ partnerName }}</h2>
-        <button class="btn btn-primary" (click)="openModalNewPartner()">Neuer {{ partnerNameOne }}</button>
+        <button class="btn btn-primary"
+                (click)="openModalNewPartner()">{{ 'basic.new' | translate }} {{ partnerNameOne }}
+        </button>
     </div>
     <table mat-table [dataSource]="dataSource" matSort (matSortChange)="onSortChange($event)"
            class="mat-elevation-z8 mb-3">
 
         <ng-container matColumnDef="pos">
             <th mat-header-cell *matHeaderCellDef>
-                Nr.
+                {{ 'overview.number' | translate }}
             </th>
             <td mat-cell
                 *matCellDef="let element">{{ (pageSize * pageIndex) + dataSource.filteredData.indexOf(element) + 1 }}
@@ -17,24 +19,27 @@
 
         <ng-container matColumnDef="image">
             <th mat-header-cell *matHeaderCellDef>
-                Logo
+                {{ 'overview.logo' | translate }}
             </th>
             <td mat-cell *matCellDef="let element">
-                <img role="button" src="{{ element.logoUrl }}" (click)="navigateToPartnerDetails(element)" width="40" height="40" />
+                <img role="button" 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
+            <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription="{{ 'overview.sort' | translate }}: {{ partnerNameOne }}">
+                {{ partnerNameOne }}
             </th>
             <td mat-cell *matCellDef="let element"><span role="button"
-                    (click)="navigateToPartnerDetails(element)">{{ element.name }}</span></td>
+                                                         (click)="navigateToPartnerDetails(element)">{{ element.name }}</span>
+            </td>
         </ng-container>
 
         <ng-container matColumnDef="address">
-            <th mat-header-cell *matHeaderCellDef mat-sort-header="address" sortActionDescription="Nach Adresse sortieren">
-                Adresse
+            <th mat-header-cell *matHeaderCellDef mat-sort-header="address"
+                sortActionDescription="{{ 'overview.sort' | translate }}: {{ 'overview.address' | translate }}">
+                {{ 'overview.address' | translate }}
             </th>
             <td mat-cell *matCellDef="let element">{{ element.street }} {{ element.streetNo }}
                 <br/>{{ element.zip }} {{ element.city }}
@@ -43,10 +48,11 @@
         </ng-container>
 
         <ng-container matColumnDef="website">
-            <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription="Nach Website sortieren">
-                Website
+            <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription="{{ 'overview.sort' | translate }}: {{ 'overview.website' | translate }}">
+                {{ 'overview.website' | translate }}
             </th>
-            <td mat-cell *matCellDef="let element"><a href="{{ element.website }}" target="_blank">{{ element.website }}</a>
+            <td mat-cell *matCellDef="let element"><a href="{{ element.website }}"
+                                                      target="_blank">{{ element.website }}</a>
             </td>
         </ng-container>
 

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

@@ -3,16 +3,14 @@ import {MatSort, Sort, MatSortModule} from "@angular/material/sort";
 import {MatTableDataSource, MatTableModule} from "@angular/material/table";
 import {ActivatedRoute, Router, RouterLink, RouterLinkActive} from "@angular/router";
 import {Subscription} from "rxjs";
-import {ContactJsonld, PartnerJsonld, PartnerService} from "@app/core/api/v1";
+import {PartnerJsonld, PartnerService} from "@app/core/api/v1";
 import {MatPaginator, MatPaginatorIntl, MatPaginatorModule, PageEvent} from "@angular/material/paginator";
 import {OrderFilter} from "@app/_models/orderFilter";
 import {ApiConverter} from "@app/_helpers/api.converter";
 import {NgIf} from "@angular/common";
-import {ModalComponent} from "@app/_components/modal/modal.component";
 import {NgbModal, NgbModalOptions} from "@ng-bootstrap/ng-bootstrap";
 import {NewPartnerComponent} from "@app/partners/new-partner/new-partner.component";
 import {TranslateModule, TranslateService} from "@ngx-translate/core";
-import {NewContactComponent} from "@app/contacts/new-contact/new-contact.component";
 import {ModalStatus} from "@app/_helpers/modal.states";
 import TypeEnum = PartnerJsonld.TypeEnum;
 

matsen-tool/src/app/postings/new-comment/new-comment.component.html

@@ -1,15 +1,16 @@
-<h2>Neuer Kommentar</h2>
+<h2 *ngIf="!comment.id">{{'basic.new-comment' | translate}}</h2>
+<h2 *ngIf="comment.id">{{'basic.edit-comment' | translate}}</h2>
 <div class="spt-form">
     <form [formGroup]="commentForm" (ngSubmit)="onSubmit()">
         <div class="mb-3">
-            <label for="message" class="form-label">Kommentar:</label>
+            <label for="message" class="form-label">{{'form.comment' | translate}}:</label>
             <input type="text" class="form-control" id="message" formControlName="message" />
             <div class="form-text" *ngIf="commentForm.get('message')?.invalid && commentForm.get('message')?.touched">
-                Kommentar ist erforderlich.
+                {{'form.comment' | translate}} {{'form.mandatory' | translate}}.
             </div>
         </div>
 
-        <button type="submit" class="btn btn-primary" [disabled]="commentForm.invalid">Abschicken</button>
+        <button type="submit" class="btn btn-primary" [disabled]="commentForm.invalid">{{'form.send' | translate}}</button>
     </form>
 </div>
 

matsen-tool/src/app/postings/new-posting/new-posting.component.html

@@ -1,23 +1,24 @@
-<h2>Neue Notiz</h2>
+<h2 *ngIf="!posting.id">{{'basic.new-post' | translate}}</h2>
+<h2 *ngIf="posting.id">{{'basic.edit-post' | translate}}</h2>
 <div class="spt-form">
     <form [formGroup]="postForm" (ngSubmit)="onSubmit()">
         <div class="mb-3">
-            <label for="headline" class="form-label">Überschrift:</label>
+            <label for="headline" class="form-label">{{'form.headline' | translate}}:</label>
             <input type="text" class="form-control" id="headline" formControlName="headline" />
             <div class="form-text" *ngIf="postForm.get('headline')?.invalid && postForm.get('headline')?.touched">
-                Überschrift ist erforderlich.
+                {{'form.headline' | translate}} {{'form.mandatory' | translate}}.
             </div>
         </div>
 
         <div class="mb-3">
-            <label for="message" class="form-label">Nachricht:</label>
+            <label for="message" class="form-label">{{'form.message' | translate}}:</label>
             <input type="text" class="form-control" id="message" formControlName="message" />
             <div class="form-text" *ngIf="postForm.get('message')?.invalid && postForm.get('message')?.touched">
-                Nachricht ist erforderlich.
+                {{'form.message' | translate}} {{'form.mandatory' | translate}}.
             </div>
         </div>
 
-        <button type="submit" class="btn btn-primary" [disabled]="postForm.invalid">Abschicken</button>
+        <button type="submit" class="btn btn-primary" [disabled]="postForm.invalid">{{'form.send' | translate}}</button>
     </form>
 </div>
 

matsen-tool/src/app/products/new-product/new-product.component.html

@@ -1,24 +1,25 @@
-<h2>Neues Produkt</h2>
+<h2 *ngIf="!product.id">{{'basic.new-product' | translate}}</h2>
+<h2 *ngIf="product.id">{{'basic.edit-product' | translate}}</h2>
 <div class="spt-form">
     <form [formGroup]="productForm" (ngSubmit)="onSubmit()">
         <div class="mb-3">
-            <label for="name" class="form-label">Überschrift:</label>
+            <label for="name" class="form-label">{{'form.name' | translate}}:</label>
             <input type="text" class="form-control" id="name" formControlName="name" />
             <div class="form-text" *ngIf="productForm.get('name')?.invalid && productForm.get('name')?.touched">
-                Überschrift ist erforderlich.
+                {{'form.name' | translate}} {{'form.mandatory' | translate}}.
             </div>
         </div>
 
         <div class="mb-3">
-            <label for="description" class="form-label">Nachricht:</label>
+            <label for="description" class="form-label">{{'form.description' | translate}}:</label>
             <input type="text" class="form-control" id="description" formControlName="description" />
             <div class="form-text" *ngIf="productForm.get('description')?.invalid && productForm.get('description')?.touched">
-                Nachricht ist erforderlich.
+                {{'form.description' | translate}} {{'form.mandatory' | translate}}.
             </div>
         </div>
 
         <div class="mb-3">
-            <label for="image" class="form-label">Bild hochladen:</label>
+            <label for="image" class="form-label">{{'form.upload-image' | translate}}:</label>
             <input type="file" class="form-control" id="image" (change)="onFileSelected($event)" accept="image/*" />
         </div>
 
@@ -28,6 +29,6 @@
             </div>
         </div>
 
-        <button type="submit" class="btn btn-primary" [disabled]="productForm.invalid">Abschicken</button>
+        <button type="submit" class="btn btn-primary" [disabled]="productForm.invalid">{{'form.send' | translate}}</button>
     </form>
 </div>

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

@@ -1,14 +1,14 @@
 <div class="spt-container">
     <div class="d-flex justify-content-between align-items-start">
-        <h2>Produkte</h2>
-        <button class="btn btn-primary" (click)="openModalNewProduct()">Neues Produkt</button>
+        <h2>{{ 'basic.products' | translate }}</h2>
+        <button class="btn btn-primary" (click)="openModalNewProduct()">{{ 'basic.new-product' | translate }}</button>
     </div>
     <table mat-table [dataSource]="productsDataSource" matSort (matSortChange)="onSortChange($event)"
            class="mat-elevation-z8 mb-3">
 
         <ng-container matColumnDef="pos">
             <th mat-header-cell *matHeaderCellDef>
-                Nr.
+                {{ 'overview.number' | translate }}
             </th>
             <td mat-cell
                 *matCellDef="let element">{{ (productsPageSize * productPageIndex) + productsDataSource.filteredData.indexOf(element) + 1 }}
@@ -17,32 +17,37 @@
 
         <ng-container matColumnDef="image">
             <th mat-header-cell *matHeaderCellDef>
-                Logo
+                {{ 'overview.image' | translate }}
             </th>
             <td mat-cell *matCellDef="let element">
-                <img role="button" src="{{ element.imageUrl }}" (click)="navigateToProductDetails(element)" width="40" height="40" />
+                <img role="button" src="{{ element.imageUrl }}" (click)="navigateToProductDetails(element)" width="40"
+                     height="40"/>
             </td>
         </ng-container>
 
         <ng-container matColumnDef="name">
-            <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription="Nach Produktname sortieren">
-                Produktname
+            <th mat-header-cell *matHeaderCellDef mat-sort-header
+                sortActionDescription="{{ 'overview.sort' | translate }}: {{ 'overview.productname' | translate }}">
+                {{ 'overview.productname' | translate }}
             </th>
             <td mat-cell *matCellDef="let element"><span role="button"
-                    (click)="navigateToProductDetails(element)">{{ element.name }}</span></td>
+                                                         (click)="navigateToProductDetails(element)">{{ element.name }}</span>
+            </td>
         </ng-container>
 
         <ng-container matColumnDef="storage">
-            <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription="Nach Lagerbestand sortieren">
-                Lagerbestand
+            <th mat-header-cell *matHeaderCellDef mat-sort-header
+                sortActionDescription="{{ 'overview.sort' | translate }}: {{ 'overview.storage' | translate }}">
+                {{ 'overview.storage' | translate }}
             </th>
             <td mat-cell *matCellDef="let element">{{ element.storage }}
             </td>
         </ng-container>
 
         <ng-container matColumnDef="number">
-            <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription="Nach Nummer sortieren">
-                Nummer
+            <th mat-header-cell *matHeaderCellDef mat-sort-header
+                sortActionDescription="{{ 'overview.sort' | translate }}: {{ 'overview.number-long' | translate }}">
+                {{ 'overview.number-long' | translate }}
             </th>
             <td mat-cell *matCellDef="let element">{{ element.number }}
             </td>

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

@@ -2,24 +2,23 @@ import {AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild} from '@a
 import {MatSort, MatSortModule, Sort} from "@angular/material/sort";
 import {MatPaginator, MatPaginatorIntl, MatPaginatorModule, PageEvent} from "@angular/material/paginator";
 import {MatTableDataSource, MatTableModule} from "@angular/material/table";
-import {CommentJsonld, ContactJsonld, PartnerJsonld, ProductJsonld, ProductService} from "@app/core/api/v1";
+import {ProductJsonld, ProductService} from "@app/core/api/v1";
 import {OrderFilter} from "@app/_models/orderFilter";
 import {ApiConverter} from "@app/_helpers/api.converter";
 import {Router, RouterLink, RouterLinkActive} from "@angular/router";
 import {NgIf} from "@angular/common";
 import {Subscription} from "rxjs";
-import {ModalComponent} from "@app/_components/modal/modal.component";
 import {NgbModal, NgbModalOptions} from "@ng-bootstrap/ng-bootstrap";
 import {NewProductComponent} from "@app/products/new-product/new-product.component";
-import {NewCommentComponent} from "@app/postings/new-comment/new-comment.component";
 import {ModalStatus} from "@app/_helpers/modal.states";
+import {TranslateModule} from "@ngx-translate/core";
 
 @Component({
     selector: 'app-products',
     templateUrl: './products.component.html',
     styleUrl: './products.component.scss',
     standalone: true,
-    imports: [MatTableModule, MatSortModule, MatPaginatorModule, RouterLink, RouterLinkActive, NgIf],
+    imports: [MatTableModule, MatSortModule, MatPaginatorModule, RouterLink, RouterLinkActive, NgIf, TranslateModule],
 })
 export class ProductsComponent implements OnInit, AfterViewInit {
     @ViewChild(MatSort) sort;

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

@@ -1,5 +1,5 @@
 <div class="d-flex justify-content-between align-items-start">
-    <h2>Aufgaben</h2>
-    <button class="btn btn-primary" (click)="openModalNewTask()">Neue Aufgabe</button>
+    <h2>{{'basic.tasks' | translate}}</h2>
+    <button class="btn btn-primary" (click)="openModalNewTask()">{{'basic.new-product' | translate}}</button>
 </div>
 <p>tasks works!</p>

matsen-tool/src/assets/i18n/de.json

@@ -12,6 +12,73 @@
     "service": "Lieferanten",
     "customerOne": "Kunde",
     "supplierOne": "Dienstleister",
-    "serviceOne": "Lieferant"
+    "serviceOne": "Lieferant",
+    "products": "Produkte",
+    "documents": "Dokumente",
+    "tasks": "Aufgaben",
+    "contacts": "Kontakte",
+    "posts": "Notizen",
+    "comments": "Kommentare",
+    "new": "Neuer",
+    "new-product": "Neues Produkt",
+    "new-document": "Neues Dokument",
+    "new-task": "Neue Aufgabe",
+    "new-contact": "Neuer Kontakt",
+    "new-post": "Neue Notiz",
+    "new-comment": "Neuer Kommentar",
+    "edit-before": "",
+    "edit-after": "bearbeiten",
+    "edit-product": "Produkt bearbeiten",
+    "edit-document": "Dokument bearbeiten",
+    "edit-task": "Aufgabe bearbeiten",
+    "edit-contact": "Kontakt bearbeiten",
+    "edit-post": "Notiz bearbeiten",
+    "edit-comment": "Kommentar bearbeiten",
+    "details": "Details",
+    "comment-it": "Kommentieren",
+    "back": "Zurück"
+  },
+  "user":
+  {
+    "hello": "Hi"
+  },
+  "overview":
+  {
+    "sort": "Sortierung",
+    "number": "Nr.",
+    "logo": "Logo",
+    "address": "Adresse",
+    "website": "Website",
+    "image": "Bild",
+    "productname": "Produktname",
+    "storage": "Lagerbestand",
+    "number-long": "Nummer",
+    "document": "Dokument",
+    "type": "Typ",
+    "uploaded": "Hochgeladen am"
+  },
+  "form":
+  {
+    "mandatory": "ist erforderlich",
+    "email-validation": "Geben Sie eine gültige E-Mail-Adresse ein",
+    "name": "Name",
+    "street": "Straße",
+    "street-no": "Hausnummer",
+    "zip": "PLZ",
+    "city": "Stadt",
+    "country": "Land",
+    "website": "Website",
+    "upload-image": "Bild hochladen",
+    "firstname": "Vorname",
+    "lastname": "Nachname",
+    "birthday": "Geburtstag",
+    "position": "Position",
+    "email": "E-Mail",
+    "phone": "Telefon",
+    "description": "Beschreibung",
+    "headline": "Überschrift",
+    "message": "Nachricht",
+    "comment": "Kommentar",
+    "send": "Abschicken"
   }
 }