Validierung Part II, neue Komponenten
This commit is contained in:
@@ -60,8 +60,8 @@
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<app-validated-input label="First Name" name="firstname" [(ngModel)]="user.firstname" [required]="true" [validationMessage]="getValidationMessage('firstname')"></app-validated-input>
|
||||
<app-validated-input label="Last Name" name="lastname" [(ngModel)]="user.lastname" [required]="true" [validationMessage]="getValidationMessage('lastname')"></app-validated-input>
|
||||
<app-validated-input label="First Name" name="firstname" [(ngModel)]="user.firstname"></app-validated-input>
|
||||
<app-validated-input label="Last Name" name="lastname" [(ngModel)]="user.lastname"></app-validated-input>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
@@ -71,22 +71,15 @@
|
||||
<option *ngFor="let type of customerTypes" [value]="type">{{ type | titlecase }}</option>
|
||||
</select>
|
||||
</div> -->
|
||||
<app-validated-select
|
||||
label="Customer Type"
|
||||
id="customerType"
|
||||
name="customerType"
|
||||
[(ngModel)]="user.customerType"
|
||||
[required]="true"
|
||||
[validationMessage]="getValidationMessage('customerType')"
|
||||
[options]="customerTypeOptions"
|
||||
></app-validated-select>
|
||||
<app-validated-select label="Customer Type" name="customerType" [(ngModel)]="user.customerType" [options]="customerTypeOptions"></app-validated-select>
|
||||
@if (isProfessional){
|
||||
<div>
|
||||
<!-- <div>
|
||||
<label for="customerSubType" class="block text-sm font-medium text-gray-700">Professional Type</label>
|
||||
<select id="customerSubType" name="customerSubType" [(ngModel)]="user.customerSubType" required class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500">
|
||||
<option *ngFor="let subType of customerSubTypes" [value]="subType">{{ subType | titlecase }}</option>
|
||||
</select>
|
||||
</div>
|
||||
</div> -->
|
||||
<app-validated-select label="Professional Type" name="customerSubType" [(ngModel)]="user.customerSubType" [options]="customerSubTypeOptions"></app-validated-select>
|
||||
}
|
||||
</div>
|
||||
@if (isProfessional){
|
||||
@@ -116,11 +109,11 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<!-- <div>
|
||||
<label for="companyOverview" class="block text-sm font-medium text-gray-700">Company Overview</label>
|
||||
<quill-editor [(ngModel)]="user.companyOverview" name="companyOverview" [modules]="quillModules"></quill-editor>
|
||||
</div>
|
||||
|
||||
</div> -->
|
||||
<app-validated-quill label="Company Overview" name="companyOverview" [(ngModel)]="user.companyOverview" (ngModelChange)="test($event)"></app-validated-quill>
|
||||
<div>
|
||||
<label for="offeredServices" class="block text-sm font-medium text-gray-700">Services We Offer</label>
|
||||
<quill-editor [(ngModel)]="user.offeredServices" name="offeredServices" [modules]="quillModules"></quill-editor>
|
||||
|
||||
@@ -9,7 +9,7 @@ import { ImageCropperComponent } from 'ngx-image-cropper';
|
||||
import { QuillModule } from 'ngx-quill';
|
||||
import { lastValueFrom } from 'rxjs';
|
||||
import { User } from '../../../../../../bizmatch-server/src/models/db.model';
|
||||
import { AutoCompleteCompleteEvent, Invoice, Subscription, UploadParams, ValidationMessage, emailToDirName } from '../../../../../../bizmatch-server/src/models/main.model';
|
||||
import { AutoCompleteCompleteEvent, Invoice, Subscription, UploadParams, ValidationMessage, createDefaultUser, emailToDirName } from '../../../../../../bizmatch-server/src/models/main.model';
|
||||
import { environment } from '../../../../environments/environment';
|
||||
import { ConfirmationComponent } from '../../../components/confirmation/confirmation.component';
|
||||
import { ConfirmationService } from '../../../components/confirmation/confirmation.service';
|
||||
@@ -17,7 +17,9 @@ import { ImageCropAndUploadComponent, UploadReponse } from '../../../components/
|
||||
import { MessageComponent } from '../../../components/message/message.component';
|
||||
import { MessageService } from '../../../components/message/message.service';
|
||||
import { ValidatedInputComponent } from '../../../components/validated-input/validated-input.component';
|
||||
import { ValidatedQuillComponent } from '../../../components/validated-quill/validated-quill.component';
|
||||
import { ValidatedSelectComponent } from '../../../components/validated-select/validated-select.component';
|
||||
import { ValidationMessagesService } from '../../../components/validation-messages.service';
|
||||
import { GeoService } from '../../../services/geo.service';
|
||||
import { ImageService } from '../../../services/image.service';
|
||||
import { LoadingService } from '../../../services/loading.service';
|
||||
@@ -26,7 +28,7 @@ import { SharedService } from '../../../services/shared.service';
|
||||
import { SubscriptionsService } from '../../../services/subscriptions.service';
|
||||
import { UserService } from '../../../services/user.service';
|
||||
import { SharedModule } from '../../../shared/shared/shared.module';
|
||||
import { createDefaultUser, map2User } from '../../../utils/utils';
|
||||
import { map2User } from '../../../utils/utils';
|
||||
import { TOOLBAR_OPTIONS } from '../../utils/defaults';
|
||||
@Component({
|
||||
selector: 'app-account',
|
||||
@@ -42,6 +44,7 @@ import { TOOLBAR_OPTIONS } from '../../utils/defaults';
|
||||
MessageComponent,
|
||||
ValidatedInputComponent,
|
||||
ValidatedSelectComponent,
|
||||
ValidatedQuillComponent,
|
||||
],
|
||||
providers: [TitleCasePipe],
|
||||
templateUrl: './account.component.html',
|
||||
@@ -83,6 +86,7 @@ export class AccountComponent {
|
||||
private messageService: MessageService,
|
||||
private sharedService: SharedService,
|
||||
private titleCasePipe: TitleCasePipe,
|
||||
private validationMessagesService: ValidationMessagesService,
|
||||
) {}
|
||||
async ngOnInit() {
|
||||
if (this.id) {
|
||||
@@ -91,23 +95,7 @@ export class AccountComponent {
|
||||
const token = await this.keycloakService.getToken();
|
||||
const keycloakUser = map2User(token);
|
||||
const email = keycloakUser.email;
|
||||
try {
|
||||
this.user = await this.userService.getByMail(email);
|
||||
} catch (e) {
|
||||
this.user = {
|
||||
id: undefined,
|
||||
email,
|
||||
firstname: keycloakUser.firstName,
|
||||
lastname: keycloakUser.lastName,
|
||||
areasServed: [],
|
||||
licensedIn: [],
|
||||
companyOverview: '',
|
||||
offeredServices: '',
|
||||
customerType: 'professional',
|
||||
customerSubType: 'broker',
|
||||
};
|
||||
this.user = await this.userService.save(this.user);
|
||||
}
|
||||
this.user = await this.userService.getByMail(email);
|
||||
}
|
||||
|
||||
this.userSubscriptions = await lastValueFrom(this.subscriptionService.getAllSubscriptions(this.user.id));
|
||||
@@ -135,8 +123,20 @@ export class AccountComponent {
|
||||
this.imageService.deleteLogoImagesByMail(this.user.email);
|
||||
this.imageService.deleteProfileImagesByMail(this.user.email);
|
||||
}
|
||||
await this.userService.save(this.user);
|
||||
this.messageService.addMessage({ severity: 'success', text: 'Account changes have been persisted', duration: 3000 });
|
||||
try {
|
||||
await this.userService.save(this.user);
|
||||
this.messageService.addMessage({ severity: 'success', text: 'Account changes have been persisted', duration: 3000 });
|
||||
this.validationMessagesService.clearMessages(); // Löschen Sie alle bestehenden Validierungsnachrichten
|
||||
} catch (error) {
|
||||
this.messageService.addMessage({
|
||||
severity: 'danger',
|
||||
text: 'An error occurred while saving the profile',
|
||||
duration: 5000,
|
||||
});
|
||||
if (error.error && Array.isArray(error.error?.message)) {
|
||||
this.validationMessagesService.updateMessages(error.error.message);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
onUploadCompanyLogo(event: any) {
|
||||
@@ -214,4 +214,7 @@ export class AccountComponent {
|
||||
const message = this.validationMessages.find(msg => msg.field === fieldName);
|
||||
return message ? message.message : '';
|
||||
}
|
||||
test(value) {
|
||||
console.log(`--->${value}`);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -3,7 +3,7 @@ import { ActivatedRoute, NavigationEnd, Router } from '@angular/router';
|
||||
import { lastValueFrom } from 'rxjs';
|
||||
import { ListingsService } from '../../../services/listings.service';
|
||||
import { SelectOptionsService } from '../../../services/select-options.service';
|
||||
import { createDefaultBusinessListing, map2User, routeListingWithState } from '../../../utils/utils';
|
||||
import { map2User, routeListingWithState } from '../../../utils/utils';
|
||||
|
||||
import { DragDropModule } from '@angular/cdk/drag-drop';
|
||||
import { faTrash } from '@fortawesome/free-solid-svg-icons';
|
||||
@@ -13,7 +13,8 @@ import { QuillModule } from 'ngx-quill';
|
||||
import { NgSelectModule } from '@ng-select/ng-select';
|
||||
import { NgxCurrencyDirective } from 'ngx-currency';
|
||||
import { BusinessListing, CommercialPropertyListing, User } from '../../../../../../bizmatch-server/src/models/db.model';
|
||||
import { AutoCompleteCompleteEvent, ImageProperty, emailToDirName } from '../../../../../../bizmatch-server/src/models/main.model';
|
||||
import { AutoCompleteCompleteEvent, ImageProperty, createDefaultBusinessListing, emailToDirName } from '../../../../../../bizmatch-server/src/models/main.model';
|
||||
|
||||
import { environment } from '../../../../environments/environment';
|
||||
import { MessageService } from '../../../components/message/message.service';
|
||||
import { ArrayToStringPipe } from '../../../pipes/array-to-string.pipe';
|
||||
|
||||
@@ -3,7 +3,7 @@ import { ActivatedRoute, NavigationEnd, Router } from '@angular/router';
|
||||
import { lastValueFrom } from 'rxjs';
|
||||
import { ListingsService } from '../../../services/listings.service';
|
||||
import { SelectOptionsService } from '../../../services/select-options.service';
|
||||
import { createDefaultCommercialPropertyListing, map2User, routeListingWithState } from '../../../utils/utils';
|
||||
import { map2User, routeListingWithState } from '../../../utils/utils';
|
||||
|
||||
import { DragDropModule } from '@angular/cdk/drag-drop';
|
||||
import { ViewportRuler } from '@angular/cdk/scrolling';
|
||||
@@ -14,7 +14,8 @@ import { NgxCurrencyDirective } from 'ngx-currency';
|
||||
import { ImageCroppedEvent, ImageCropperComponent } from 'ngx-image-cropper';
|
||||
import { QuillModule } from 'ngx-quill';
|
||||
import { BusinessListing, CommercialPropertyListing, User } from '../../../../../../bizmatch-server/src/models/db.model';
|
||||
import { AutoCompleteCompleteEvent, ImageProperty, emailToDirName } from '../../../../../../bizmatch-server/src/models/main.model';
|
||||
import { AutoCompleteCompleteEvent, ImageProperty, createDefaultCommercialPropertyListing, emailToDirName } from '../../../../../../bizmatch-server/src/models/main.model';
|
||||
|
||||
import { environment } from '../../../../environments/environment';
|
||||
import { ConfirmationComponent } from '../../../components/confirmation/confirmation.component';
|
||||
import { ConfirmationService } from '../../../components/confirmation/confirmation.service';
|
||||
|
||||
Reference in New Issue
Block a user