add reference id exist condition in reference-editor-dialog

This commit is contained in:
amentis 2024-04-02 11:15:07 +03:00
parent 77d2dcdc39
commit ea97f8ca88
4 changed files with 64 additions and 25 deletions

View File

@ -12,8 +12,14 @@
<div class="col"> <div class="col">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{field}}</mat-label> <mat-label>{{field}}</mat-label>
<input matInput type="text" [name]="field" [formControl]="formGroup.get(field)" required> <input matInput type="text" [name]="field" [formControl]="formGroup.get(field)">
<mat-error *ngIf="formGroup.get(field).hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get(field).hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
<ng-container *ngIf="field == systemFields[0]">
<i matSuffix class="fa fa-spinner fa-spin" *ngIf="formGroup.get(field).pending && !referenceExists"></i>
<mat-icon *ngIf="!formGroup.get(field).pending && formGroup.get(field).dirty && formGroup.get(field).valid && !referenceExists" class="text-success" matSuffix>check</mat-icon>
<mat-icon *ngIf="!formGroup.get(field).pending && formGroup.get(field).dirty && formGroup.get(field).invalid || referenceExists" class="text-danger" matSuffix>clear</mat-icon>
<small *ngIf="referenceExists" class="text-danger">{{'REFERENCE-FIELD.REFERENCE-DIALOG-EDITOR.IDENTIFIER-EXISTS' | translate}}</small>
</ng-container>
</mat-form-field> </mat-form-field>
</div> </div>
</div> </div>
@ -22,17 +28,16 @@
<div class="col"> <div class="col">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{field.label}}</mat-label> <mat-label>{{field.label}}</mat-label>
<input matInput type="text" [name]="field.code" [formControl]="formGroup.get(field.code)" required> <input matInput type="text" [name]="field.code" [formControl]="formGroup.get(field.code)">
<mat-error *ngIf="formGroup.get(field.code).hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get(field.code).hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
</div> </div>
</ng-container> </ng-container>
{{formGroup.value | json}}
</div> </div>
<div mat-dialog-actions class="row"> <div mat-dialog-actions class="row">
<div class="ml-auto col-auto"><button mat-raised-button type="button" mat-dialog-close>Cancel</button></div> <div class="ml-auto col-auto"><button mat-raised-button type="button" mat-dialog-close>Cancel</button></div>
<div class="col-auto"><button mat-button color="primary" [disabled]="!formGroup.valid" (click)="send()" type="button">Save</button></div> <div class="col-auto"><button mat-button color="primary" [disabled]="!isFormValid" (click)="send()" type="button">Save</button></div>
</div> </div>
</form> </form>

View File

@ -19,6 +19,13 @@ export class ReferenceDialogEditorComponent extends BaseComponent implements OnI
referenceType: ReferenceType; referenceType: ReferenceType;
systemFields: string[]; systemFields: string[];
label: string = null label: string = null
private existingReferences: string[] = [];
get referenceExists(){
const reference = this.formGroup.get(this.systemFields[0]).value;
return this.existingReferences.find((r)=>r === reference)
}
constructor( constructor(
private referenceTypeService: ReferenceTypeService, private referenceTypeService: ReferenceTypeService,
@ -29,6 +36,7 @@ export class ReferenceDialogEditorComponent extends BaseComponent implements OnI
) { ) {
super(); super();
this.label = data.label; this.label = data.label;
this.existingReferences = data.existingReferences;
this.formGroup = this.fb.group({}); this.formGroup = this.fb.group({});
} }
@ -59,6 +67,10 @@ export class ReferenceDialogEditorComponent extends BaseComponent implements OnI
} }
isFormValid() {
return this.formGroup.valid && !this.referenceExists;
}
send() { send() {
this.formService.touchAllFormFields(this.formGroup); this.formService.touchAllFormFields(this.formGroup);
if (!this.formGroup.valid) { return; } if (!this.formGroup.valid) { return; }

View File

@ -9,7 +9,10 @@ import { SingleAutoCompleteConfiguration } from '@app/library/auto-complete/sing
import { BaseComponent } from '@common/base/base.component'; import { BaseComponent } from '@common/base/base.component';
import { takeUntil } from 'rxjs/operators'; import { takeUntil } from 'rxjs/operators';
import { ReferenceDialogEditorComponent } from './editor/reference-dialog-editor.component'; import { ReferenceDialogEditorComponent } from './editor/reference-dialog-editor.component';
import { ReferencePersist } from '@app/core/model/reference/reference'; import { Reference, ReferencePersist } from '@app/core/model/reference/reference';
import { ReferenceSearchLookup } from '@app/core/query/reference-search.lookup';
import { Guid } from '@common/types/guid';
import { nameof } from 'ts-simple-nameof';
@Component({ @Component({
selector: 'app-reference-field-component', selector: 'app-reference-field-component',
@ -44,25 +47,43 @@ export class ReferenceFieldComponent extends BaseComponent implements OnInit {
} }
addReference() { addReference() {
const dialogRef = this.dialog.open(ReferenceDialogEditorComponent, {
width: '500px',
restoreFocus: false,
data: {
referenceTypeId: this.referenceType.id,
label: this.label ?? this.referenceType.name
},
});
dialogRef.afterClosed()
.pipe(takeUntil(this._destroyed))
.subscribe(newResult => {
if (!newResult) { return; }
// const dataRepositoryModel = new ExternalDataRepositoryEditorModel(result.id, result.name, result.abbreviation, result.uri, result.pid, result.source);
// (<UntypedFormArray>this.formGroup.get('dataRepositories')).push(dataRepositoryModel.buildForm());
let results = this.form.value as ReferencePersist[]; this.referenceService.searchWithDefinition(this.buildAutocompleteSearchLookup(this.referenceType.id))
if (results == undefined) results = []; .pipe(takeUntil(this._destroyed))
results.push(newResult); .subscribe(
this.form.setValue(results); references => {
}); const dialogRef = this.dialog.open(ReferenceDialogEditorComponent, {
width: '500px',
restoreFocus: false,
data: {
referenceTypeId: this.referenceType.id,
label: this.label ?? this.referenceType.name,
existingReferences: references.map(x => x.reference)
},
});
dialogRef.afterClosed()
.pipe(takeUntil(this._destroyed))
.subscribe(newResult => {
if (!newResult) { return; }
let results = this.form.value as ReferencePersist[];
if (results == undefined) results = [];
results.push(newResult);
this.form.setValue(results);
});
}
);
}
private buildAutocompleteSearchLookup(typeId: Guid): ReferenceSearchLookup {
const lookup: ReferenceSearchLookup = new ReferenceSearchLookup();
lookup.page = { size: 100, offset: 0 };
lookup.project = {
fields: [
nameof<Reference>(x => x.reference),
]
};
lookup.typeId = typeId;
lookup.order = { items: [nameof<Reference>(x => x.label)] };
return lookup;
} }
} }

View File

@ -1354,7 +1354,8 @@
"INSERT-MANUALLY": "Insert it manually" "INSERT-MANUALLY": "Insert it manually"
}, },
"REFERENCE-DIALOG-EDITOR": { "REFERENCE-DIALOG-EDITOR": {
"TITLE": "Add a" "TITLE": "Add a",
"IDENTIFIER-EXISTS": "Reference Identifier Exists!"
} }
}, },
"DMP-CLONE-DIALOG": { "DMP-CLONE-DIALOG": {