Commit 00e84e8a authored by Jérémy Destin's avatar Jérémy Destin
Browse files

fix: Rename focus button into Details. Rename export button into Export GnpIS...

fix: Rename focus button into Details. Rename export button into Export GnpIS Plant Material. Move the display of selected element above the search box in large facets. Fix the display of the germplasm result page when unselect Germplasm and when select other criterion in facet type. GNP-4309
parent 5e11bf65
......@@ -12,18 +12,22 @@
</ng-template>
<ng-container *ngIf="facet.terms.length && facet.terms.length > 8">
<div class="mb-2">
<span class="badge badge-pill badge-secondary mr-1"
<div class="card mb-1">
<div class="card-body">
<h3 class="card-title">{{ facet.field }}</h3>
<div class="mb-2">
<span class="badge badge-pill badge-secondary mr-1 selectedElem"
style="font-size: smaller"
*ngFor="let term of selectedTerms[facet.field]" tabindex="0"
(keydown.delete)="removeKey(term)"
(keydown.backspace)="removeKey(term)"> {{ displaySourceName(term) }}
<button tabindex="-1" type="button" class="btn btn-link"
(click)="removeKey(term)">&times;</button>
</span>
</div>
<div class="card mb-1">
<div class="card-body">
<h3 class="card-title">{{ facet.field }}</h3>
</div>
<input #typeahead class="form-control" [formControl]="criterion"
[ngbTypeahead]="search"
(selectItem)="selectKey($event)" [resultTemplate]="resultTemplate"
......
<ng-template #germplasmDetailsPopup>
<div class="card ngb-popover-window ">
<br>
This is a button to view more information about the germplasm
(germplasm name, accession number, genus species, institute name * , biological status.)
that are return by your research. <br>
You can also download the data in GnpIS Plant Material standard.<br>
<br>
* The name of the institute which store the accession.
</div>
</ng-template>
<div class="card mb-1" *ngIf="facet.terms.length && facet.terms.length <= 8">
<div class="card-body">
<h3 class="card-title">{{ facet.field }}</h3>
......@@ -15,10 +29,11 @@
<div id="germplasmSearch"
title="Focus on germplasm details with export data link"
style="margin-top: 5px"
*ngIf="term.term == 'Germplasm' && !criteriaIsEmpty">
<label for="selectSwitchButton" style="margin-right: 5px"
id="switchTitle">
Focus
Details
</label>
<label class="switch" id="switchButton">
<input type="checkbox" id="selectSwitchButton"
......@@ -26,6 +41,13 @@
(change)="switchToGermplasmResult()">
<span class="slider round"></span>
</label>
<a class="btn popovers" data-boundary="window" placement="auto"
[autoClose]="'outside'"
[ngbPopover]="germplasmDetailsPopup"
[popoverTitle]="'Details button help.'" container="body">
<img src="assets/faidare/images/question-mark.png" alt="help" title=""
height="20px" style="margin-top: -10px"/>
</a>
</div>
</div>
</form>
......
......@@ -7,6 +7,9 @@
.card h3 {
font-weight: bold;
}
.popovers{
cursor: pointer;
}
#switchTitle {
cursor: pointer;
......
......@@ -74,6 +74,13 @@ export class SmallFacetsComponent implements OnInit {
this.checkBoxes.valueChanges.subscribe(values => {
const selectedTerms = Object.keys(values).filter(key => values[key]);
const multiSelection = Object.keys(values).filter(key => values[key] && key != 'Germplasm');
const unselectGermplasm = Object.keys(values).filter(key => key == 'Germplasm' && !values[key]);
if (multiSelection.length > 0 || unselectGermplasm.length > 0) {
this.displayGermplasmResult$.next(false);
}
this.showAndHideAdvanceGermplasmSearch(selectedTerms);
if (this.criteria$) {
this.localCriteria = {
......
......@@ -22,7 +22,7 @@
<button type="button" class="btn btn-outline-success mb-2"
(click)="exportPlantMaterial(localCriteria)">
Export
Export GnpIS Plant Material
<img src="assets/faidare/images/csv-logo.png" alt="csv logo" title=""
height="20px"/>
</button>
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment