hazza/dspace-angular
1
0
Fork 1
mirror of https://github.com/DSpace/dspace-angular.git synced 2025-10-07 10:04:11 +00:00
Code Issues Packages Projects Releases Wiki Activity

CST-12455 Itemfilter dropdown first refactoring just for layout

Browse Source
This commit is contained in:
Mattia Vianelli
2023-11-15 11:29:59 +01:00
parent cd5d509160
commit 754a6822a7
1 changed files with 306 additions and 292 deletions
Download Patch File Download Diff File Expand all files Collapse all files

80
src/app/admin/admin-ldn-services/ldn-service-form-edit/ldn-service-form-edit.component.html
View File

@@ -79,36 +79,41 @@
</div> </div>
<div *ngFor="let patternGroup of formModel.get('notifyServiceInboundPatterns')['controls']; let i = index" <div *ngFor="let patternGroup of formModel.get('notifyServiceInboundPatterns')['controls']; let i = index"
formGroupName="notifyServiceInboundPatterns" [class.marked-for-deletion]="markedForDeletionInboundPattern.includes(i)"> [class.marked-for-deletion]="markedForDeletionInboundPattern.includes(i)"
formGroupName="notifyServiceInboundPatterns">
<ng-container [formGroupName]="i"> <ng-container [formGroupName]="i">
<div class="row mb-1"> <div class="row mb-1">
<div class="col"> <div class="col">
<div ngbDropdown #inboundPatternDropdown="ngbDropdown" class="w-100" id="additionalInboundPattern{{i}}"> <div #inboundPatternDropdown="ngbDropdown" class="w-100" id="additionalInboundPattern{{i}}" ngbDropdown>
<div class="position-relative right-addon" role="combobox"> <div class="position-relative right-addon" role="combobox">
<i ngbDropdownToggle class="position-absolute scrollable-dropdown-toggle" <i aria-hidden="true" class="position-absolute scrollable-dropdown-toggle"
aria-hidden="true"></i> ngbDropdownToggle></i>
<input <input
formControlName="pattern"
type="text"
[readonly]="true"
ngbDropdownAnchor
class="form-control w-100 scrollable-dropdown-input"
[value]="selectedInboundPatterns"
(click)="inboundPatternDropdown.open();" (click)="inboundPatternDropdown.open();"
[readonly]="true"
[value]="selectedInboundPatterns"
class="form-control w-100 scrollable-dropdown-input"
formControlName="pattern"
id="inboundPatternDropdownButton" id="inboundPatternDropdownButton"
ngbDropdownAnchor
type="text"
/> />
<!-- Main label TODO: remove after developing done cause it will pick the selected value to show --> <!-- Main label TODO: remove after developing done cause it will pick the selected value to show -->
<div>{{ selectedInboundPatterns ? ('ldn-service.form.pattern.' + selectedInboundPatterns + '.label' | translate) : ('ldn-new-service.form.label.placeholder.outboundPattern' | translate) }}</div> <div>{{ selectedInboundPatterns ? ('ldn-service.form.pattern.' + selectedInboundPatterns + '.label' | translate) : ('ldn-new-service.form.label.placeholder.outboundPattern' | translate) }}</div>
<div class="small-text">{{ selectedInboundPatterns ? ('ldn-service.form.pattern.' + selectedInboundPatterns + '.description' | translate) : ('' | translate) }}</div> <div
class="small-text">{{ selectedInboundPatterns ? ('ldn-service.form.pattern.' + selectedInboundPatterns + '.description' | translate) : ('' | translate) }}</div>
<!-- TODO: infinite scroll with 3 selects --> <!-- TODO: infinite scroll with 3 selects -->
<div ngbDropdownMenu aria-labelledby="outboundPatternDropdownButton"> <div aria-labelledby="outboundPatternDropdownButton" ngbDropdownMenu>
<button type="button" ngbDropdownItem *ngFor="let pattern of inboundPatterns; let internalIndex = index" (click)="selectInboundPattern(pattern, i); $event.stopPropagation()"> <button (click)="selectInboundPattern(pattern, i); $event.stopPropagation()" *ngFor="let pattern of inboundPatterns; let internalIndex = index"
<div>{{ 'ldn-service.form.pattern.'+pattern+'.label' | translate }}</div> ngbDropdownItem
<div class="small-text">{{ 'ldn-service.form.pattern.'+pattern+'.description' | translate }}</div> type="button">
<div>{{ 'ldn-service.form.pattern.' + pattern + '.label' | translate }}</div>
<div
class="small-text">{{ 'ldn-service.form.pattern.' + pattern + '.description' | translate }}</div>
</button> </button>
</div> </div>
</div> </div>
@@ -125,7 +130,9 @@
</ng-container> </ng-container>
</div> </div>
<div [style.visibility]="formModel.get('notifyServiceInboundPatterns')['controls'][i].value ? 'visible' : 'hidden'" class="col-sm-1"> <div
[style.visibility]="formModel.get('notifyServiceInboundPatterns')['controls'][i].value ? 'visible' : 'hidden'"
class="col-sm-1">
<input formControlName="automatic" hidden id="automatic{{i}}" name="automatic{{i}}" <input formControlName="automatic" hidden id="automatic{{i}}" name="automatic{{i}}"
type="checkbox"> type="checkbox">
<div (click)="toggleAutomatic(i)" <div (click)="toggleAutomatic(i)"
@@ -143,7 +150,8 @@
</button> </button>
<button (click)="unmarkForInboundPatternDeletion(i)" *ngIf="markedForDeletionInboundPattern.includes(i)" class="btn btn-warning ml-2" <button (click)="unmarkForInboundPatternDeletion(i)" *ngIf="markedForDeletionInboundPattern.includes(i)"
class="btn btn-warning ml-2"
type="button"> type="button">
<i class="fas fa-undo"></i> <i class="fas fa-undo"></i>
</button> </button>
@@ -176,36 +184,41 @@
</div> </div>
<div *ngFor="let patternGroup of formModel.get('notifyServiceOutboundPatterns')['controls']; let i = index" <div *ngFor="let patternGroup of formModel.get('notifyServiceOutboundPatterns')['controls']; let i = index"
formGroupName="notifyServiceOutboundPatterns" [class.marked-for-deletion]="markedForDeletionOutboundPattern.includes(i)"> [class.marked-for-deletion]="markedForDeletionOutboundPattern.includes(i)"
formGroupName="notifyServiceOutboundPatterns">
<ng-container [formGroupName]="i"> <ng-container [formGroupName]="i">
<!-- Input elements in a separate row --> <!-- Input elements in a separate row -->
<div class="row mb-1"> <div class="row mb-1">
<div class="col"> <div class="col">
<div ngbDropdown #outboundPatternDropdown="ngbDropdown" class="w-100" id="additionalOutboundPattern{{i}}"> <div #outboundPatternDropdown="ngbDropdown" class="w-100" id="additionalOutboundPattern{{i}}" ngbDropdown>
<div class="position-relative right-addon" role="combobox"> <div class="position-relative right-addon" role="combobox">
<i ngbDropdownToggle class="position-absolute scrollable-dropdown-toggle" <i aria-hidden="true" class="position-absolute scrollable-dropdown-toggle"
aria-hidden="true"></i> ngbDropdownToggle></i>
<input <input
formControlName="pattern"
type="text"
[readonly]="true"
ngbDropdownAnchor
class="form-control w-100 scrollable-dropdown-input"
[value]="selectedOutboundPatterns"
(click)="outboundPatternDropdown.open();" (click)="outboundPatternDropdown.open();"
[readonly]="true"
[value]="selectedOutboundPatterns"
class="form-control w-100 scrollable-dropdown-input"
formControlName="pattern"
id="outboundPatternDropdownButton" id="outboundPatternDropdownButton"
ngbDropdownAnchor
type="text"
/> />
<!-- Main label TODO: remove after developing done cause it will pick the selected value to show --> <!-- Main label TODO: remove after developing done cause it will pick the selected value to show -->
<div>{{ selectedOutboundPatterns ? ('ldn-service.form.pattern.' + selectedOutboundPatterns + '.label' | translate) : ('ldn-new-service.form.label.placeholder.outboundPattern' | translate) }}</div> <div>{{ selectedOutboundPatterns ? ('ldn-service.form.pattern.' + selectedOutboundPatterns + '.label' | translate) : ('ldn-new-service.form.label.placeholder.outboundPattern' | translate) }}</div>
<div class="small-text">{{ selectedOutboundPatterns ? ('ldn-service.form.pattern.' + selectedOutboundPatterns + '.description' | translate) : ('' | translate) }}</div> <div
class="small-text">{{ selectedOutboundPatterns ? ('ldn-service.form.pattern.' + selectedOutboundPatterns + '.description' | translate) : ('' | translate) }}</div>
<!-- TODO: infinite scroll with 3-5 selects --> <!-- TODO: infinite scroll with 3-5 selects -->
<div ngbDropdownMenu aria-labelledby="outboundPatternDropdownButton"> <div aria-labelledby="outboundPatternDropdownButton" ngbDropdownMenu>
<button type="button" ngbDropdownItem *ngFor="let pattern of outboundPatterns; let internalIndex = index" (click)="selectOutboundPattern(pattern, i); $event.stopPropagation()"> <button (click)="selectOutboundPattern(pattern, i); $event.stopPropagation()" *ngFor="let pattern of outboundPatterns; let internalIndex = index"
<div>{{ 'ldn-service.form.pattern.'+pattern+'.label' | translate }}</div> ngbDropdownItem
<div class="small-text">{{ 'ldn-service.form.pattern.'+pattern+'.description' | translate }}</div> type="button">
<div>{{ 'ldn-service.form.pattern.' + pattern + '.label' | translate }}</div>
<div
class="small-text">{{ 'ldn-service.form.pattern.' + pattern + '.description' | translate }}</div>
</button> </button>
</div> </div>
</div> </div>
@@ -234,7 +247,8 @@
<button (click)="markForOutboundPatternDeletion(i)" class="btn btn-outline-dark trash-button" type="button"> <button (click)="markForOutboundPatternDeletion(i)" class="btn btn-outline-dark trash-button" type="button">
<i class="fas fa-trash"></i> <i class="fas fa-trash"></i>
</button> </button>
<button (click)="unmarkForOutboundPatternDeletion(i)" *ngIf="markedForDeletionOutboundPattern.includes(i)" class="btn btn-warning ml-2" <button (click)="unmarkForOutboundPatternDeletion(i)" *ngIf="markedForDeletionOutboundPattern.includes(i)"
class="btn btn-warning ml-2"
type="button"> type="button">
<i class="fas fa-undo"></i> <i class="fas fa-undo"></i>
</button> </button>