argos/dmp-frontend/src/app/ui/dmp/editor/available-profiles/available-profiles.componen...

63 lines
2.3 KiB
TypeScript
Raw Normal View History

2018-11-27 18:33:17 +01:00
import { Component, Inject, OnInit } from '@angular/core';
2018-05-28 11:50:42 +02:00
import { FormGroup } from '@angular/forms';
2019-09-23 10:17:03 +02:00
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { DataTableRequest } from '@app/core/model/data-table/data-table-request';
import { DatasetProfileModel } from '@app/core/model/dataset/dataset-profile';
import { DatasetProfileCriteria } from '@app/core/query/dataset-profile/dataset-profile-criteria';
import { DatasetService } from '@app/core/services/dataset/dataset.service';
import { BaseComponent } from '@common/base/base.component';
2018-11-27 18:33:17 +01:00
import { takeUntil } from 'rxjs/operators';
2018-05-28 11:50:42 +02:00
@Component({
Description boxes in admin forms replaced with rich text editor <angular-editor>. 1. dataset-profile-editor-composite-field.component.ts & dataset-profile-editor-section.component.ts & dataset-profile-editor.component.ts: Initialize AngularEditorConfig. 2. dataset-profile-editor-composite-field.component.html & dataset-profile-editor-section.component.html & dataset-profile-editor.component.html: Use <angular-editor> in description. 3. multiple-auto-complete.component.html & dataset-profile-listing.component.html & form-section.component.html: Show description as html. 4. dataset-profile.module.ts: Imported HttpClientModule, AngularEditorModule (needed for <angular-editor>). 5. available-profiles.component.html: Show description as html, under the Dataset Template title, not as tooltip (matTooltip does not receive html). 6. available-profiles.component.ts: Added styleUrls: ['available-profiles.component.scss']. 7. available-profiles.component.scss: [NEW] Added css for class "list-option" to cut description if too long. 8. form-composite-title.component.html: Show description and extendedDescription as html | Add view more/less functionality to show/hide extendedDescription. 9. form-composite-title.component.ts: Added "public showExtendedDescription: boolean = false;" field. 10. form-composite-title.component.scss: Added css for "more" class, to make "view more/less" seem like link. 11. assets/i18n/: In language files added DATASET-EDITOR.QUESTION.EXTENDED-DESCRIPTION.VIEW-MORE (-LESS). 12. assets/styles.css: Added css for <angular-editor>, to be similar to the other text areas and forms.
2021-10-12 17:14:22 +02:00
styleUrls: ['available-profiles.component.scss'],
2018-10-05 17:00:54 +02:00
selector: 'app-available-profiles-component',
templateUrl: 'available-profiles.component.html',
2018-05-28 11:50:42 +02:00
})
2018-11-27 18:33:17 +01:00
export class AvailableProfilesComponent extends BaseComponent implements OnInit {
2018-05-28 11:50:42 +02:00
2018-10-05 17:00:54 +02:00
public formGroup: FormGroup;
public profiles: DatasetProfileModel[] = [];
public selectedProfiles: DatasetProfileModel[] = [];
public selectedOptions: any;
constructor(
private datasetService: DatasetService,
2019-01-18 18:03:45 +01:00
private dialogRef: MatDialogRef<AvailableProfilesComponent>,
2018-10-05 17:00:54 +02:00
@Inject(MAT_DIALOG_DATA) public data: any
2018-11-27 18:33:17 +01:00
) { super(); }
2018-05-28 11:50:42 +02:00
2018-10-05 17:00:54 +02:00
ngOnInit(): void {
this.formGroup = this.data['profiles'];
const fields: Array<string> = new Array<string>();
fields.push('asc');
const profileRequestItem: DataTableRequest<DatasetProfileCriteria> = new DataTableRequest(0, null, { fields: fields });
profileRequestItem.criteria = new DatasetProfileCriteria();
profileRequestItem.criteria.like = '';
this.datasetService.getDatasetProfiles(profileRequestItem)
2018-11-27 18:33:17 +01:00
.pipe(takeUntil(this._destroyed))
.subscribe(data => {
const dataArray = data;
dataArray.sort((a,b)=> (a.label as string).localeCompare(b.label));
this.profiles = dataArray;
2018-11-27 18:33:17 +01:00
});
2018-10-05 17:00:54 +02:00
}
2018-05-28 11:50:42 +02:00
2018-10-05 17:00:54 +02:00
addProfiles(profiles) {
profiles.selectedOptions.selected.forEach(element => {
2019-01-18 18:03:45 +01:00
const selectedElement = {
id: element.value.id,
label: element.value.label,
description: element.value.description
2019-01-18 18:03:45 +01:00
}
2018-10-05 17:00:54 +02:00
this.selectedProfiles.push(selectedElement);
});
this.formGroup.setValue(this.selectedProfiles);
this.dialogRef.close();
}
2018-08-24 17:21:02 +02:00
2018-10-05 17:00:54 +02:00
isOptionSelected(profile: any) {
return this.formGroup.value ? this.formGroup.value.map(x => x.id).indexOf(profile.id) !== -1 : null;
2018-10-05 17:00:54 +02:00
}
2018-05-28 11:50:42 +02:00
}