format on save, resolve compile errors, functionality 1. stage
This commit is contained in:
@@ -1,49 +1,33 @@
|
||||
import { HttpEventType } from '@angular/common/http';
|
||||
import { ChangeDetectorRef, Component, ViewChild } from '@angular/core';
|
||||
import { ButtonModule } from 'primeng/button';
|
||||
import { CheckboxModule } from 'primeng/checkbox';
|
||||
import { InputTextModule } from 'primeng/inputtext';
|
||||
import { StyleClassModule } from 'primeng/styleclass';
|
||||
import { SelectOptionsService } from '../../../services/select-options.service';
|
||||
import { DropdownModule } from 'primeng/dropdown';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { ToggleButtonModule } from 'primeng/togglebutton';
|
||||
import { TagModule } from 'primeng/tag';
|
||||
import { ActivatedRoute } from '@angular/router';
|
||||
import { InputTextareaModule } from 'primeng/inputtextarea';
|
||||
import { ChipModule } from 'primeng/chip';
|
||||
import { MenuAccountComponent } from '../../menu-account/menu-account.component';
|
||||
import { DividerModule } from 'primeng/divider';
|
||||
import { TableModule } from 'primeng/table';
|
||||
import { HttpClient, HttpEventType } from '@angular/common/http';
|
||||
import { UserService } from '../../../services/user.service';
|
||||
import { SharedModule } from '../../../shared/shared/shared.module';
|
||||
import { SubscriptionsService } from '../../../services/subscriptions.service';
|
||||
import { lastValueFrom } from 'rxjs';
|
||||
import { AngularCropperjsModule } from 'angular-cropperjs';
|
||||
import { MessageService } from 'primeng/api';
|
||||
import { environment } from '../../../../environments/environment';
|
||||
import { FileUpload, FileUploadModule } from 'primeng/fileupload';
|
||||
import { GeoService } from '../../../services/geo.service';
|
||||
import { ChangeDetectionStrategy } from '@angular/compiler';
|
||||
import { EditorModule } from 'primeng/editor';
|
||||
import { LoadingService } from '../../../services/loading.service';
|
||||
import { AngularCropperjsModule, CropperComponent } from 'angular-cropperjs';
|
||||
import { ImageService } from '../../../services/image.service';
|
||||
import { DialogModule } from 'primeng/dialog';
|
||||
import { SelectButtonModule } from 'primeng/selectbutton';
|
||||
import { DialogService, DynamicDialogModule, DynamicDialogRef } from 'primeng/dynamicdialog';
|
||||
import { ImageCropperComponent, stateOptions } from '../../../components/image-cropper/image-cropper.component';
|
||||
import Quill from 'quill'
|
||||
import { TOOLBAR_OPTIONS } from '../../utils/defaults';
|
||||
import { EditorModule } from 'primeng/editor';
|
||||
import { FileUpload, FileUploadModule } from 'primeng/fileupload';
|
||||
import { SelectButtonModule } from 'primeng/selectbutton';
|
||||
import { lastValueFrom } from 'rxjs';
|
||||
import { User } from '../../../../../../bizmatch-server/src/models/db.model';
|
||||
import { AutoCompleteCompleteEvent, Invoice, KeyValue, Subscription } from '../../../../../../bizmatch-server/src/models/main.model';
|
||||
import { environment } from '../../../../environments/environment';
|
||||
import { ImageCropperComponent, stateOptions } from '../../../components/image-cropper/image-cropper.component';
|
||||
import { GeoService } from '../../../services/geo.service';
|
||||
import { ImageService } from '../../../services/image.service';
|
||||
import { LoadingService } from '../../../services/loading.service';
|
||||
import { SelectOptionsService } from '../../../services/select-options.service';
|
||||
import { SubscriptionsService } from '../../../services/subscriptions.service';
|
||||
import { UserService } from '../../../services/user.service';
|
||||
import { SharedModule } from '../../../shared/shared/shared.module';
|
||||
import { TOOLBAR_OPTIONS } from '../../utils/defaults';
|
||||
@Component({
|
||||
selector: 'app-account',
|
||||
standalone: true,
|
||||
imports: [SharedModule, FileUploadModule, EditorModule, AngularCropperjsModule, DialogModule, SelectButtonModule, DynamicDialogModule],
|
||||
providers: [MessageService, DialogService],
|
||||
templateUrl: './account.component.html',
|
||||
styleUrl: './account.component.scss'
|
||||
styleUrl: './account.component.scss',
|
||||
})
|
||||
export class AccountComponent {
|
||||
@ViewChild('companyUpload') public companyUpload: FileUpload;
|
||||
@@ -55,12 +39,13 @@ export class AccountComponent {
|
||||
maxFileSize = 1000000;
|
||||
companyLogoUrl: string;
|
||||
profileUrl: string;
|
||||
type: 'company' | 'profile'
|
||||
type: 'company' | 'profile';
|
||||
dialogRef: DynamicDialogRef | undefined;
|
||||
environment = environment
|
||||
editorModules = TOOLBAR_OPTIONS
|
||||
userLicensedIn :KeyValue[]
|
||||
constructor(public userService: UserService,
|
||||
environment = environment;
|
||||
editorModules = TOOLBAR_OPTIONS;
|
||||
userLicensedIn: KeyValue[];
|
||||
constructor(
|
||||
public userService: UserService,
|
||||
private subscriptionService: SubscriptionsService,
|
||||
private messageService: MessageService,
|
||||
private geoService: GeoService,
|
||||
@@ -69,42 +54,43 @@ export class AccountComponent {
|
||||
private activatedRoute: ActivatedRoute,
|
||||
private loadingService: LoadingService,
|
||||
private imageUploadService: ImageService,
|
||||
public dialogService: DialogService) {}
|
||||
public dialogService: DialogService,
|
||||
) {}
|
||||
async ngOnInit() {
|
||||
this.user = await this.userService.getById(this.id);
|
||||
this.userLicensedIn = this.user.licensedIn.map(l=>{return {name:l.split('|')[0],value:l.split('|')[1]}})
|
||||
const email = this.userService.getUser().email;
|
||||
this.user = await this.userService.getByMail(email);
|
||||
this.userLicensedIn = this.user.licensedIn.map(l => {
|
||||
return { name: l.split('|')[0], value: l.split('|')[1] };
|
||||
});
|
||||
this.userSubscriptions = await lastValueFrom(this.subscriptionService.getAllSubscriptions());
|
||||
if (!this.user.licensedIn || this.user.licensedIn?.length === 0) {
|
||||
this.user.licensedIn = ['']
|
||||
this.user.licensedIn = [''];
|
||||
}
|
||||
this.user = await this.userService.getById(this.user.id);
|
||||
this.profileUrl = this.user.hasProfile ? `${environment.apiBaseUrl}/profile/${this.user.id}.avif` : `/assets/images/placeholder.png`
|
||||
this.companyLogoUrl = this.user.hasCompanyLogo ? `${environment.apiBaseUrl}/logo/${this.user.id}.avif` : `/assets/images/placeholder.png`
|
||||
this.profileUrl = this.user.hasProfile ? `${environment.apiBaseUrl}/profile/${this.user.id}.avif` : `/assets/images/placeholder.png`;
|
||||
this.companyLogoUrl = this.user.hasCompanyLogo ? `${environment.apiBaseUrl}/logo/${this.user.id}.avif` : `/assets/images/placeholder.png`;
|
||||
}
|
||||
printInvoice(invoice: Invoice) { }
|
||||
printInvoice(invoice: Invoice) {}
|
||||
|
||||
async updateProfile(user: User) {
|
||||
await this.userService.save(this.user);
|
||||
}
|
||||
|
||||
|
||||
onUploadCompanyLogo(event: any) {
|
||||
const uniqueSuffix = '?_ts=' + new Date().getTime();
|
||||
this.companyLogoUrl = `${environment.apiBaseUrl}/logo/${this.user.id}${uniqueSuffix}` //`http://IhrServer:Port/${newImagePath}${uniqueSuffix}`;
|
||||
this.companyLogoUrl = `${environment.apiBaseUrl}/logo/${this.user.id}${uniqueSuffix}`; //`http://IhrServer:Port/${newImagePath}${uniqueSuffix}`;
|
||||
}
|
||||
onUploadProfilePicture(event: any) {
|
||||
const uniqueSuffix = '?_ts=' + new Date().getTime();
|
||||
this.profileUrl = `${environment.apiBaseUrl}/profile/${this.user.id}${uniqueSuffix}` //`http://IhrServer:Port/${newImagePath}${uniqueSuffix}`;
|
||||
this.profileUrl = `${environment.apiBaseUrl}/profile/${this.user.id}${uniqueSuffix}`; //`http://IhrServer:Port/${newImagePath}${uniqueSuffix}`;
|
||||
}
|
||||
setImageToFallback(event: Event) {
|
||||
(event.target as HTMLImageElement).src = `/assets/images/placeholder.png`; // Pfad zum Platzhalterbild
|
||||
}
|
||||
|
||||
|
||||
suggestions: string[] | undefined;
|
||||
|
||||
async search(event: AutoCompleteCompleteEvent) {
|
||||
const result = await lastValueFrom(this.geoService.findCitiesStartingWith(event.query))
|
||||
const result = await lastValueFrom(this.geoService.findCitiesStartingWith(event.query));
|
||||
this.suggestions = result.map(r => `${r.city} - ${r.state_code}`).slice(0, 5);
|
||||
}
|
||||
addLicence() {
|
||||
@@ -116,14 +102,14 @@ export class AccountComponent {
|
||||
|
||||
select(event: any, type: 'company' | 'profile') {
|
||||
const imageUrl = URL.createObjectURL(event.files[0]);
|
||||
this.type = type
|
||||
const config = { aspectRatio: type === 'company' ? stateOptions[0].value : stateOptions[2].value }
|
||||
this.type = type;
|
||||
const config = { aspectRatio: type === 'company' ? stateOptions[0].value : stateOptions[2].value };
|
||||
this.dialogRef = this.dialogService.open(ImageCropperComponent, {
|
||||
data: {
|
||||
imageUrl: imageUrl,
|
||||
fileUpload: type === 'company' ? this.companyUpload : this.profileUpload,
|
||||
config: config,
|
||||
ratioVariable: type === 'company' ? true : false
|
||||
ratioVariable: type === 'company' ? true : false,
|
||||
},
|
||||
header: 'Edit Image',
|
||||
width: '50vw',
|
||||
@@ -133,27 +119,30 @@ export class AccountComponent {
|
||||
closable: false,
|
||||
breakpoints: {
|
||||
'960px': '75vw',
|
||||
'640px': '90vw'
|
||||
'640px': '90vw',
|
||||
},
|
||||
});
|
||||
this.dialogRef.onClose.subscribe(cropper => {
|
||||
if (cropper){
|
||||
this.loadingService.startLoading('uploadImage');
|
||||
cropper.getCroppedCanvas().toBlob(async (blob) => {
|
||||
this.imageUploadService.uploadImage(blob, type==='company'?'uploadCompanyLogo':'uploadProfile',this.user.id).subscribe(async(event) => {
|
||||
if (event.type === HttpEventType.Response) {
|
||||
this.loadingService.stopLoading('uploadImage');
|
||||
if (this.type==='company'){
|
||||
this.user.hasCompanyLogo=true;//
|
||||
this.companyLogoUrl=`${environment.apiBaseUrl}/logo/${this.user.id}.avif?_ts=${new Date().getTime()}`
|
||||
} else {
|
||||
this.user.hasProfile=true;
|
||||
this.profileUrl=`${environment.apiBaseUrl}/profile/${this.user.id}.avif?_ts=${new Date().getTime()}`
|
||||
if (cropper) {
|
||||
this.loadingService.startLoading('uploadImage');
|
||||
cropper.getCroppedCanvas().toBlob(async blob => {
|
||||
this.imageUploadService.uploadImage(blob, type === 'company' ? 'uploadCompanyLogo' : 'uploadProfile', this.user.id).subscribe(
|
||||
async event => {
|
||||
if (event.type === HttpEventType.Response) {
|
||||
this.loadingService.stopLoading('uploadImage');
|
||||
if (this.type === 'company') {
|
||||
this.user.hasCompanyLogo = true; //
|
||||
this.companyLogoUrl = `${environment.apiBaseUrl}/logo/${this.user.id}.avif?_ts=${new Date().getTime()}`;
|
||||
} else {
|
||||
this.user.hasProfile = true;
|
||||
this.profileUrl = `${environment.apiBaseUrl}/profile/${this.user.id}.avif?_ts=${new Date().getTime()}`;
|
||||
}
|
||||
}
|
||||
}
|
||||
}, error => console.error('Fehler beim Upload:', error));
|
||||
})
|
||||
},
|
||||
error => console.error('Fehler beim Upload:', error),
|
||||
);
|
||||
});
|
||||
}
|
||||
})
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user