|
|
|
@ -4,12 +4,20 @@ import {
|
|
|
|
|
Inject,
|
|
|
|
|
OnDestroy
|
|
|
|
|
} from '@angular/core';
|
|
|
|
|
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
|
|
|
|
|
import {
|
|
|
|
|
AbstractControl,
|
|
|
|
|
FormBuilder,
|
|
|
|
|
FormGroup,
|
|
|
|
|
ValidatorFn,
|
|
|
|
|
Validators
|
|
|
|
|
} from '@angular/forms';
|
|
|
|
|
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
|
|
|
|
|
import { CreateAccountDto } from '@ghostfolio/api/app/account/create-account.dto';
|
|
|
|
|
import { UpdateAccountDto } from '@ghostfolio/api/app/account/update-account.dto';
|
|
|
|
|
import { DataService } from '@ghostfolio/client/services/data.service';
|
|
|
|
|
import { Subject } from 'rxjs';
|
|
|
|
|
import { Platform } from '@prisma/client';
|
|
|
|
|
import { Observable, Subject } from 'rxjs';
|
|
|
|
|
import { map, startWith } from 'rxjs/operators';
|
|
|
|
|
|
|
|
|
|
import { CreateOrUpdateAccountDialogParams } from './interfaces/interfaces';
|
|
|
|
|
|
|
|
|
@ -23,7 +31,8 @@ import { CreateOrUpdateAccountDialogParams } from './interfaces/interfaces';
|
|
|
|
|
export class CreateOrUpdateAccountDialog implements OnDestroy {
|
|
|
|
|
public accountForm: FormGroup;
|
|
|
|
|
public currencies: string[] = [];
|
|
|
|
|
public platforms: { id: string; name: string }[];
|
|
|
|
|
public filteredPlatforms: Observable<Platform[]>;
|
|
|
|
|
public platforms: Platform[];
|
|
|
|
|
|
|
|
|
|
private unsubscribeSubject = new Subject<void>();
|
|
|
|
|
|
|
|
|
@ -34,7 +43,7 @@ export class CreateOrUpdateAccountDialog implements OnDestroy {
|
|
|
|
|
private formBuilder: FormBuilder
|
|
|
|
|
) {}
|
|
|
|
|
|
|
|
|
|
ngOnInit() {
|
|
|
|
|
public ngOnInit() {
|
|
|
|
|
const { currencies, platforms } = this.dataService.fetchInfo();
|
|
|
|
|
|
|
|
|
|
this.currencies = currencies;
|
|
|
|
@ -47,8 +56,41 @@ export class CreateOrUpdateAccountDialog implements OnDestroy {
|
|
|
|
|
currency: [this.data.account.currency, Validators.required],
|
|
|
|
|
isExcluded: [this.data.account.isExcluded],
|
|
|
|
|
name: [this.data.account.name, Validators.required],
|
|
|
|
|
platformId: [this.data.account.platformId]
|
|
|
|
|
platformId: [
|
|
|
|
|
this.platforms.find(({ id }) => {
|
|
|
|
|
return id === this.data.account.platformId;
|
|
|
|
|
}),
|
|
|
|
|
this.autocompleteObjectValidator()
|
|
|
|
|
]
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
this.filteredPlatforms = this.accountForm
|
|
|
|
|
.get('platformId')
|
|
|
|
|
.valueChanges.pipe(
|
|
|
|
|
startWith(''),
|
|
|
|
|
map((value) => {
|
|
|
|
|
const name = typeof value === 'string' ? value : value?.name;
|
|
|
|
|
return name ? this.filter(name as string) : this.platforms.slice();
|
|
|
|
|
})
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
public autoCompleteCheck() {
|
|
|
|
|
const inputValue = this.accountForm.controls['platformId'].value;
|
|
|
|
|
|
|
|
|
|
if (typeof inputValue === 'string') {
|
|
|
|
|
const matchingEntry = this.platforms.find(({ name }) => {
|
|
|
|
|
return name === inputValue;
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
if (matchingEntry) {
|
|
|
|
|
this.accountForm.controls['platformId'].setValue(matchingEntry);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
public displayFn(platform: Platform) {
|
|
|
|
|
return platform?.name ?? '';
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
public onCancel() {
|
|
|
|
@ -63,7 +105,7 @@ export class CreateOrUpdateAccountDialog implements OnDestroy {
|
|
|
|
|
id: this.accountForm.controls['accountId'].value,
|
|
|
|
|
isExcluded: this.accountForm.controls['isExcluded'].value,
|
|
|
|
|
name: this.accountForm.controls['name'].value,
|
|
|
|
|
platformId: this.accountForm.controls['platformId'].value
|
|
|
|
|
platformId: this.accountForm.controls['platformId'].value?.id ?? null
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
if (this.data.account.id) {
|
|
|
|
@ -79,4 +121,22 @@ export class CreateOrUpdateAccountDialog implements OnDestroy {
|
|
|
|
|
this.unsubscribeSubject.next();
|
|
|
|
|
this.unsubscribeSubject.complete();
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
private autocompleteObjectValidator(): ValidatorFn {
|
|
|
|
|
return (control: AbstractControl) => {
|
|
|
|
|
if (control.value && typeof control.value === 'string') {
|
|
|
|
|
return { invalidAutocompleteObject: { value: control.value } };
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
return null;
|
|
|
|
|
};
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
private filter(value: string): Platform[] {
|
|
|
|
|
const filterValue = value.toLowerCase();
|
|
|
|
|
|
|
|
|
|
return this.platforms.filter(({ name }) => {
|
|
|
|
|
return name.toLowerCase().startsWith(filterValue);
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|