new contact form apiform

matsen-tool/openapi.yaml

@@ -1500,6 +1500,7 @@ components:
             - string
             - 'null'
         owner:
+          'owl:maxCardinality': 1
           type:
             - string
             - 'null'
@@ -1511,6 +1512,7 @@ components:
             - string
             - 'null'
         posting:
+          'owl:maxCardinality': 1
           type:
             - string
             - 'null'
@@ -1543,6 +1545,7 @@ components:
             - string
             - 'null'
         owner:
+          'owl:maxCardinality': 1
           type:
             - string
             - 'null'
@@ -1554,6 +1557,7 @@ components:
             - string
             - 'null'
         posting:
+          'owl:maxCardinality': 1
           type:
             - string
             - 'null'
@@ -1600,6 +1604,7 @@ components:
             - string
             - 'null'
         owner:
+          'owl:maxCardinality': 1
           type:
             - string
             - 'null'
@@ -1611,6 +1616,7 @@ components:
             - string
             - 'null'
         posting:
+          'owl:maxCardinality': 1
           type:
             - string
             - 'null'
@@ -1639,6 +1645,7 @@ components:
             - string
             - 'null'
         partner:
+          'owl:maxCardinality': 1
           type:
             - string
             - 'null'
@@ -1650,6 +1657,7 @@ components:
             - 'null'
           format: date-time
         image:
+          'owl:maxCardinality': 1
           type:
             - string
             - 'null'
@@ -1669,6 +1677,9 @@ components:
             - string
             - 'null'
         email:
+          format: email
+          externalDocs:
+            url: 'https://schema.org/email'
           type:
             - string
             - 'null'
@@ -1709,6 +1720,7 @@ components:
             - string
             - 'null'
         partner:
+          'owl:maxCardinality': 1
           type:
             - string
             - 'null'
@@ -1720,6 +1732,7 @@ components:
             - 'null'
           format: date-time
         image:
+          'owl:maxCardinality': 1
           type:
             - string
             - 'null'
@@ -1739,6 +1752,9 @@ components:
             - string
             - 'null'
         email:
+          format: email
+          externalDocs:
+            url: 'https://schema.org/email'
           type:
             - string
             - 'null'
@@ -1793,6 +1809,7 @@ components:
             - string
             - 'null'
         partner:
+          'owl:maxCardinality': 1
           type:
             - string
             - 'null'
@@ -1804,6 +1821,7 @@ components:
             - 'null'
           format: date-time
         image:
+          'owl:maxCardinality': 1
           type:
             - string
             - 'null'
@@ -1823,6 +1841,9 @@ components:
             - string
             - 'null'
         email:
+          format: email
+          externalDocs:
+            url: 'https://schema.org/email'
           type:
             - string
             - 'null'
@@ -1949,6 +1970,7 @@ components:
             - string
             - 'null'
         logo:
+          'owl:maxCardinality': 1
           type:
             - string
             - 'null'
@@ -2020,6 +2042,7 @@ components:
             - string
             - 'null'
         logo:
+          'owl:maxCardinality': 1
           type:
             - string
             - 'null'
@@ -2105,6 +2128,7 @@ components:
             - string
             - 'null'
         logo:
+          'owl:maxCardinality': 1
           type:
             - string
             - 'null'
@@ -2143,6 +2167,7 @@ components:
             - string
             - 'null'
         owner:
+          'owl:maxCardinality': 1
           type:
             - string
             - 'null'
@@ -2154,12 +2179,14 @@ components:
             - string
             - 'null'
         partner:
+          'owl:maxCardinality': 1
           type:
             - string
             - 'null'
           format: iri-reference
           example: 'https://example.com/'
         contact:
+          'owl:maxCardinality': 1
           type:
             - string
             - 'null'
@@ -2201,6 +2228,7 @@ components:
             - string
             - 'null'
         owner:
+          'owl:maxCardinality': 1
           type:
             - string
             - 'null'
@@ -2212,12 +2240,14 @@ components:
             - string
             - 'null'
         partner:
+          'owl:maxCardinality': 1
           type:
             - string
             - 'null'
           format: iri-reference
           example: 'https://example.com/'
         contact:
+          'owl:maxCardinality': 1
           type:
             - string
             - 'null'
@@ -2273,6 +2303,7 @@ components:
             - string
             - 'null'
         owner:
+          'owl:maxCardinality': 1
           type:
             - string
             - 'null'
@@ -2284,12 +2315,14 @@ components:
             - string
             - 'null'
         partner:
+          'owl:maxCardinality': 1
           type:
             - string
             - 'null'
           format: iri-reference
           example: 'https://example.com/'
         contact:
+          'owl:maxCardinality': 1
           type:
             - string
             - 'null'

matsen-tool/src/app/_forms/apiForms.ts

@@ -34,7 +34,7 @@ export const contactForm = new FormGroup({
   imageUrl: new FormControl(null, []),
   position: new FormControl(null, []),
   phone: new FormControl(null, []),
-  email: new FormControl(null, []),
+  email: new FormControl(null, [Validators.email]),
   postings: new FormControl(null, []),
   createdAt: new FormControl(null, [])
 });
@@ -49,7 +49,7 @@ export const contactJsonhalForm = new FormGroup({
   imageUrl: new FormControl(null, []),
   position: new FormControl(null, []),
   phone: new FormControl(null, []),
-  email: new FormControl(null, []),
+  email: new FormControl(null, [Validators.email]),
   postings: new FormControl(null, []),
   createdAt: new FormControl(null, [])
 });
@@ -63,7 +63,7 @@ export const contactJsonldForm = new FormGroup({
   imageUrl: new FormControl(null, []),
   position: new FormControl(null, []),
   phone: new FormControl(null, []),
-  email: new FormControl(null, []),
+  email: new FormControl(null, [Validators.email]),
   postings: new FormControl(null, []),
   createdAt: new FormControl(null, [])
 });

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

@@ -1,9 +1,9 @@
 import {Component, OnInit} from '@angular/core';
-
 import {AccountService} from './_services';
 import {User} from './_models';
 import {PostService} from "@app/core/api/v1";
 import {TranslateService} from "@ngx-translate/core";
+import {environment} from "@environments/environment";
 
 @Component({
     selector: 'app-root',
@@ -11,9 +11,14 @@ import {TranslateService} from "@ngx-translate/core";
     styleUrl: 'app.component.scss'
 })
 export class AppComponent implements OnInit {
-    user?: User | null;
+    protected readonly environment = environment;
+    protected user?: User | null;
 
-    constructor(private postService: PostService, private accountService: AccountService, translate: TranslateService) {
+    constructor(
+        private postService: PostService,
+        private accountService: AccountService,
+        translate: TranslateService
+    ) {
         translate.setDefaultLang('de');
         translate.use('de');
         this.accountService.user.subscribe(x => this.user = x);
@@ -27,6 +32,7 @@ export class AppComponent implements OnInit {
         this.accountService.logout();
     }
 
+    // TODO: Hilfsfunktion - entfernen
     copyTokenToClipboard() {
         const el = document.createElement('textarea');
         el.value = this.user?.token !== undefined ? this.user.token : "";

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

@@ -1,45 +1,50 @@
 <h2>Neuer Kontakt</h2>
 <div>
     <form [formGroup]="contactForm" (ngSubmit)="onSubmit()">
-        <div>
-            <label for="firstName">Vorname:</label>
-            <input type="text" id="firstName" formControlName="firstName" />
-            <div *ngIf="contactForm.get('firstName')?.invalid && contactForm.get('firstName')?.touched">
+        <div class="mb-3">
+            <label for="firstName" class="form-label">Vorname:</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.
             </div>
         </div>
 
-        <div>
-            <label for="lastName">Nachname:</label>
-            <input type="text" id="lastName" formControlName="lastName" />
-            <div *ngIf="contactForm.get('lastName')?.invalid && contactForm.get('lastName')?.touched">
+        <div class="mb-3">
+            <label for="lastName" class="form-label">Nachname:</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.
             </div>
         </div>
 
-        <div>
-            <label for="email">E-Mail:</label>
-            <input type="email" id="email" formControlName="email" />
-            <div *ngIf="contactForm.get('email')?.invalid && contactForm.get('email')?.touched">
-                Geben Sie eine gültige E-Mail-Adresse ein.
-            </div>
+        <div class="mb-3">
+            <label for="lastName" class="form-label">Geburtstag:</label>
+            <input type="text" class="form-control" id="birthday" formControlName="birthday" />
+        </div>
+
+        <div class="mb-3">
+            <label for="lastName" class="form-label">Position:</label>
+            <input type="text" class="form-control" id="position" formControlName="position" />
         </div>
 
-        <div>
-            <label for="lastName">Telefon:</label>
-            <input type="text" id="phone" formControlName="phone" />
+        <div class="mb-3">
+            <label for="email" class="form-label">E-Mail:</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.
+            </div>
         </div>
 
-        <div>
-            <label for="lastName">Position:</label>
-            <input type="text" id="position" formControlName="position" />
+        <div class="mb-3">
+            <label for="lastName" class="form-label">Telefon:</label>
+            <input type="text" class="form-control" id="phone" formControlName="phone" />
         </div>
 
-        <div>
-            <label for="image">Bild hochladen:</label>
-            <input type="file" id="image" (change)="onFileSelected($event)" accept="image/*" />
+        <div class="mb-3">
+            <label for="image" class="form-label">Bild hochladen:</label>
+            <input type="file" class="form-control" id="image" (change)="onFileSelected($event)" accept="image/*" />
         </div>
 
-        <button type="submit" [disabled]="contactForm.invalid">Abschicken</button>
+        <button type="submit" class="btn btn-primary" [disabled]="contactForm.invalid">Abschicken</button>
     </form>
 </div>

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

@@ -1,5 +1,6 @@
 import {Component} from '@angular/core';
 import {FormBuilder, FormGroup, Validators} from "@angular/forms";
+import {contactForm} from "@app/_forms/apiForms";
 
 @Component({
     selector: 'app-new-contact',
@@ -12,13 +13,7 @@ export class NewContactComponent {
     constructor(
         private fb: FormBuilder
     ) {
-        this.contactForm = this.fb.group({
-            firstName: ['', [Validators.required]],
-            lastName: ['', [Validators.required]],
-            email: ['', [Validators.required, Validators.email]],
-            phone: [''],
-            position: [''],
-        });
+        this.contactForm = contactForm;
         this.selectedImage = null;
     }
 

matsen-tool/src/environments/environment.prod.ts

@@ -1,5 +1,5 @@
 export const environment = {
     production: true,
-    apiUrl: 'https://matsen-tool-be.ddev.site:8443',
-    basePath: 'https://matsen-tool-be.ddev.site:8443'
+    basePath: 'https://matsen-tool-be.ddev.site:8443',
+    apiUrl: 'https://matsen-tool-be.ddev.site:8443/api'
 };