mirror of
https://github.com/DSpace/dspace-angular.git
synced 2025-10-17 15:03:07 +00:00
Merged in CST-12179 (pull request #980)
CST-12179 Approved-by: Stefano Maffei
This commit is contained in:
Mattia Vianelli
@@ -1,284 +1,293 @@
|
||||
<div class="container">
|
||||
<form (ngSubmit)="onSubmit()" [formGroup]="formModel">
|
||||
<div class="d-flex">
|
||||
<h2 class="flex-grow-1">{{ 'ldn-edit-registered-service.title' | translate }}</h2>
|
||||
</div>
|
||||
<!-- In the toggle section -->
|
||||
<div class="toggle-switch-container">
|
||||
<label class="status-label" for="enabled">{{ 'ldn-service-status' | translate }}</label>
|
||||
<div>
|
||||
<input formControlName="enabled" hidden id="enabled" name="enabled" type="checkbox">
|
||||
<div (click)="toggleEnabled()" [class.checked]="formModel.get('enabled').value" class="toggle-switch">
|
||||
<div class="slider"></div>
|
||||
</div>
|
||||
</div>
|
||||
<form (ngSubmit)="onSubmit()" [formGroup]="formModel">
|
||||
<div class="d-flex">
|
||||
<h2 class="flex-grow-1">{{ 'ldn-edit-registered-service.title' | translate }}</h2>
|
||||
</div>
|
||||
<!-- In the toggle section -->
|
||||
<div class="toggle-switch-container">
|
||||
<label class="status-label" for="enabled">{{ 'ldn-service-status' | translate }}</label>
|
||||
<div>
|
||||
<input formControlName="enabled" hidden id="enabled" name="enabled" type="checkbox">
|
||||
<div (click)="toggleEnabled()" [class.checked]="formModel.get('enabled').value" class="toggle-switch">
|
||||
<div class="slider"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-2">
|
||||
<label for="name">{{ 'ldn-new-service.form.label.name' | translate }}</label>
|
||||
<input [class.invalid-field]="formModel.get('name').invalid && formModel.get('name').touched"
|
||||
[placeholder]="'ldn-new-service.form.placeholder.name' | translate" formControlName="name" id="name"
|
||||
name="name"
|
||||
type="text">
|
||||
</div>
|
||||
<div class="mb-5">
|
||||
<label for="name">{{ 'ldn-new-service.form.label.name' | translate }}</label>
|
||||
<input [class.invalid-field]="formModel.get('name').invalid && formModel.get('name').touched"
|
||||
[placeholder]="'ldn-new-service.form.placeholder.name' | translate" formControlName="name" id="name"
|
||||
name="name"
|
||||
type="text">
|
||||
<div *ngIf="formModel.get('name').invalid && formModel.get('name').touched" class="error-text">
|
||||
{{ 'ldn-new-service.form.error.name' | translate }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
|
||||
</div>
|
||||
<!-- In the description section -->
|
||||
<div class="mb-5 mt-5 d-flex flex-column">
|
||||
<label for="description">{{ 'ldn-new-service.form.label.description' | translate }}</label>
|
||||
<textarea [placeholder]="'ldn-new-service.form.placeholder.description' | translate"
|
||||
formControlName="description" id="description" name="description"></textarea>
|
||||
</div>
|
||||
|
||||
<!-- In the description section -->
|
||||
<div class="mb-2 d-flex flex-column">
|
||||
<label for="description">{{ 'ldn-new-service.form.label.description' | translate }}</label>
|
||||
<textarea [placeholder]="'ldn-new-service.form.placeholder.description' | translate"
|
||||
formControlName="description" id="description" name="description"></textarea>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
|
||||
</div>
|
||||
|
||||
<!-- In the url section -->
|
||||
<div class="mb-2">
|
||||
<label for="url">{{ 'ldn-new-service.form.label.url' | translate }}</label>
|
||||
<input [class.invalid-field]="formModel.get('url').invalid && formModel.get('url').touched"
|
||||
[placeholder]="'ldn-new-service.form.placeholder.url' | translate" formControlName="url" id="url"
|
||||
name="url"
|
||||
type="text">
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
|
||||
</div>
|
||||
|
||||
<!-- In the ldnUrl section -->
|
||||
<div class="mb-2">
|
||||
<label for="ldnUrl">{{ 'ldn-new-service.form.label.ldnUrl' | translate }}</label>
|
||||
<input [class.invalid-field]="formModel.get('ldnUrl').invalid && formModel.get('ldnUrl').touched"
|
||||
[placeholder]="'ldn-new-service.form.placeholder.ldnUrl' | translate" formControlName="ldnUrl"
|
||||
id="ldnUrl"
|
||||
name="ldnUrl"
|
||||
type="text">
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<label>{{ 'ldn-new-service.form.label.inboundPattern' | translate }} </label>
|
||||
</div>
|
||||
<div class="col">
|
||||
<label class="label-box">{{ 'ldn-new-service.form.label.ItemFilter' | translate }}</label>
|
||||
</div>
|
||||
<div class="col-sm1 ">
|
||||
<label class="label-box-2">{{ 'ldn-new-service.form.label.automatic' | translate }}</label>
|
||||
</div>
|
||||
<div class="col-sm-1">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div *ngFor="let patternGroup of formModel.get('notifyServiceInboundPatterns')['controls']; let i = index"
|
||||
formGroupName="notifyServiceInboundPatterns" [class.marked-for-deletion]="markedForDeletionInboundPattern.includes(i)">
|
||||
|
||||
<ng-container [formGroupName]="i">
|
||||
<!-- In the url section -->
|
||||
<div class="mb-5 mt-5">
|
||||
<label for="url">{{ 'ldn-new-service.form.label.url' | translate }}</label>
|
||||
<input [class.invalid-field]="formModel.get('url').invalid && formModel.get('url').touched"
|
||||
[placeholder]="'ldn-new-service.form.placeholder.url' | translate" formControlName="url" id="url"
|
||||
name="url"
|
||||
type="text">
|
||||
<div *ngIf="formModel.get('url').invalid && formModel.get('url').touched" class="error-text">
|
||||
{{ 'ldn-new-service.form.error.url' | translate }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="row mb-1">
|
||||
<div class="col">
|
||||
<select #inboundPattern formControlName="pattern" id="additionalInboundPattern{{i}}"
|
||||
name="additionalInboundPattern{{i}}" required>
|
||||
<option value="">{{ 'ldn-new-service.form.label.placeholder.inboundPattern' | translate }}</option>
|
||||
<option *ngFor="let pattern of inboundPatterns"
|
||||
[ngValue]="pattern.name">{{ pattern.name }}</option>
|
||||
</select>
|
||||
</div>
|
||||
<!-- In the ldnUrl section -->
|
||||
<div class="mb-5 mt-5">
|
||||
<label for="ldnUrl">{{ 'ldn-new-service.form.label.ldnUrl' | translate }}</label>
|
||||
<input [class.invalid-field]="formModel.get('ldnUrl').invalid && formModel.get('ldnUrl').touched"
|
||||
[placeholder]="'ldn-new-service.form.placeholder.ldnUrl' | translate" formControlName="ldnUrl"
|
||||
id="ldnUrl"
|
||||
name="ldnUrl"
|
||||
type="text">
|
||||
<div *ngIf="formModel.get('ldnUrl').invalid && formModel.get('ldnUrl').touched" class="error-text">
|
||||
{{ 'ldn-new-service.form.error.ldnurl' | translate }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col">
|
||||
<ng-container *ngIf="inboundPattern.value">
|
||||
<select formControlName="constraint" id="constraint{{i}}" name="constraint{{i}}">
|
||||
<option value="">{{ 'ldn-new-service.form.label.placeholder.selectedItemFilter' | translate }}</option>
|
||||
<option *ngFor="let itemFilter of (itemfiltersRD$ | async)?.payload?.page"
|
||||
[value]="itemFilter.id">{{ itemFilter.id }}</option>
|
||||
</select>
|
||||
</ng-container>
|
||||
</div>
|
||||
|
||||
<div [style.visibility]="inboundPattern.value ? 'visible' : 'hidden'" class="col-sm1">
|
||||
<input formControlName="automatic" hidden id="automatic{{i}}" name="automatic{{i}}"
|
||||
type="checkbox">
|
||||
<div (click)="toggleAutomatic(i)"
|
||||
[class.checked]="formModel.get('notifyServiceInboundPatterns.' + i + '.automatic').value"
|
||||
class="toggle-switch">
|
||||
<div class="slider"></div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- In the score section -->
|
||||
<div class="mb-2">
|
||||
<label for="score">{{ 'ldn-new-service.form.label.score' | translate }}</label>
|
||||
<input [class.invalid-field]="formModel.get('score').invalid && formModel.get('score').touched"
|
||||
[placeholder]="'ldn-new-service.form.placeholder.score' | translate" formControlName="score"
|
||||
id="score"
|
||||
name="score"
|
||||
type="text">
|
||||
<div *ngIf="formModel.get('score').invalid && formModel.get('score').touched" class="error-text">
|
||||
{{ 'ldn-new-service.form.error.score' | translate }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="col-sm-2">
|
||||
<button (click)="markForInboundPatternDeletion(i)" class="btn btn-outline-dark"
|
||||
type="button">
|
||||
<i class="fas fa-trash"></i>
|
||||
</button>
|
||||
<div class="row mb-1 mt-5">
|
||||
<div class="col">
|
||||
<label>{{ 'ldn-new-service.form.label.inboundPattern' | translate }} </label>
|
||||
</div>
|
||||
<div class="col">
|
||||
<label class="label-box">{{ 'ldn-new-service.form.label.ItemFilter' | translate }}</label>
|
||||
</div>
|
||||
<div class="col-sm1 ">
|
||||
<label class="label-box-2">{{ 'ldn-new-service.form.label.automatic' | translate }}</label>
|
||||
</div>
|
||||
<div class="col-sm-2">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div *ngFor="let patternGroup of formModel.get('notifyServiceInboundPatterns')['controls']; let i = index"
|
||||
[class.marked-for-deletion]="markedForDeletionInboundPattern.includes(i)"
|
||||
formGroupName="notifyServiceInboundPatterns">
|
||||
|
||||
<ng-container [formGroupName]="i">
|
||||
|
||||
|
||||
<button (click)="unmarkForInboundPatternDeletion(i)" *ngIf="markedForDeletionInboundPattern.includes(i)" class="btn btn-warning ml-2"
|
||||
type="button">
|
||||
<i class="fas fa-undo"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row mb-1">
|
||||
<div class="col">
|
||||
<select #inboundPattern formControlName="pattern" id="additionalInboundPattern{{i}}"
|
||||
name="additionalInboundPattern{{i}}" required>
|
||||
<option value="">{{ 'ldn-new-service.form.label.placeholder.inboundPattern' | translate }}</option>
|
||||
<option *ngFor="let pattern of inboundPatterns"
|
||||
[value]="pattern">{{ 'ldn-service.form.pattern.' + pattern + '.label' | translate }} </option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="col">
|
||||
<ng-container *ngIf="inboundPattern.value">
|
||||
<select formControlName="constraint" id="constraint{{i}}" name="constraint{{i}}">
|
||||
<option value="">{{ 'ldn-new-service.form.label.placeholder.selectedItemFilter' | translate }}</option>
|
||||
<option *ngFor="let itemFilter of (itemfiltersRD$ | async)?.payload?.page"
|
||||
[value]="itemFilter.id">{{ itemFilter.id }}</option>
|
||||
</select>
|
||||
</ng-container>
|
||||
</div>
|
||||
|
||||
<div [style.visibility]="inboundPattern.value ? 'visible' : 'hidden'" class="col-sm1">
|
||||
<input formControlName="automatic" hidden id="automatic{{i}}" name="automatic{{i}}"
|
||||
type="checkbox">
|
||||
<div (click)="toggleAutomatic(i)"
|
||||
[class.checked]="formModel.get('notifyServiceInboundPatterns.' + i + '.automatic').value"
|
||||
class="toggle-switch">
|
||||
<div class="slider"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="col-sm-2">
|
||||
<div class="btn-group">
|
||||
<button (click)="markForInboundPatternDeletion(i)" class="btn btn-outline-dark trash-button"
|
||||
type="button">
|
||||
<i class="fas fa-trash"></i>
|
||||
</button>
|
||||
<button (click)="unmarkForInboundPatternDeletion(i)" *ngIf="markedForDeletionInboundPattern.includes(i)"
|
||||
class="btn btn-warning"
|
||||
type="button">
|
||||
<i class="fas fa-undo"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ng-container>
|
||||
</div>
|
||||
|
||||
|
||||
<span (click)="addInboundPattern()"
|
||||
class="add-pattern-link mb-2">{{ 'ldn-new-service.form.label.addPattern' | translate }}</span>
|
||||
<span (click)="addInboundPattern()"
|
||||
class="add-pattern-link mb-2">{{ 'ldn-new-service.form.label.addPattern' | translate }}</span>
|
||||
|
||||
<div class="mb-4">
|
||||
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<label>{{ 'ldn-new-service.form.label.outboundPattern' | translate }}</label>
|
||||
</div>
|
||||
<div class="col">
|
||||
<label class="label-box-3">{{ 'ldn-new-service.form.label.ItemFilter' | translate }}</label>
|
||||
</div>
|
||||
<div class="col-sm-1 ">
|
||||
<label class="label-box-2"></label>
|
||||
</div>
|
||||
<div class="col-sm-1 ">
|
||||
</div>
|
||||
</div>
|
||||
<div class="row mb-1 mt-5">
|
||||
<div class="col">
|
||||
<label>{{ 'ldn-new-service.form.label.outboundPattern' | translate }} </label>
|
||||
</div>
|
||||
<div class="col">
|
||||
<label class="label-box">{{ 'ldn-new-service.form.label.ItemFilter' | translate }}</label>
|
||||
</div>
|
||||
<div class="col-sm1 ">
|
||||
<label class="label-box-2" style="visibility: hidden;">
|
||||
{{ 'ldn-new-service.form.label.automatic' | translate }}
|
||||
</label>
|
||||
</div>
|
||||
<div class="col-sm-2">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div *ngFor="let patternGroup of formModel.get('notifyServiceOutboundPatterns')['controls']; let i = index"
|
||||
formGroupName="notifyServiceOutboundPatterns" [class.marked-for-deletion]="markedForDeletionOutboundPattern.includes(i)">
|
||||
<div *ngFor="let patternGroup of formModel.get('notifyServiceOutboundPatterns')['controls']; let i = index"
|
||||
[class.marked-for-deletion]="markedForDeletionOutboundPattern.includes(i)"
|
||||
formGroupName="notifyServiceOutboundPatterns">
|
||||
|
||||
<ng-container [formGroupName]="i">
|
||||
<ng-container [formGroupName]="i">
|
||||
|
||||
<!-- Input elements in a separate row -->
|
||||
<div class="row mb-1">
|
||||
<div class="col">
|
||||
<select #outboundPattern formControlName="pattern" id="additionalOutboundPattern{{i}}"
|
||||
name="additionalOutboundPattern{{i}}"
|
||||
required>
|
||||
<option value="">{{ 'ldn-new-service.form.label.placeholder.outboundPattern' | translate }}</option>
|
||||
<option *ngFor="let pattern of outboundPatterns"
|
||||
[ngValue]="pattern.name">{{ pattern.name }}</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col">
|
||||
<ng-container *ngIf="outboundPattern.value">
|
||||
<select formControlName="constraint" id="constraint{{i}}" name="constraint{{i}}">
|
||||
<option value="">{{ 'ldn-new-service.form.label.placeholder.selectedItemFilter' | translate }}</option>
|
||||
<option *ngFor="let itemFilter of (itemfiltersRD$ | async)?.payload?.page"
|
||||
[value]="itemFilter.id">{{ itemFilter.id }}</option>
|
||||
</select>
|
||||
</ng-container>
|
||||
</div>
|
||||
|
||||
<div [style.visibility]="'hidden'" class="col-sm1">
|
||||
<input hidden id="automatic{{i}}" name="automatic{{i}}" type="checkbox">
|
||||
<div
|
||||
class="toggle-switch">
|
||||
<div class="slider"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-sm-2">
|
||||
<button (click)="markForOutboundPatternDeletion(i)" class="btn btn-outline-dark trash-button" type="button">
|
||||
<i class="fas fa-trash"></i>
|
||||
</button>
|
||||
<button (click)="unmarkForOutboundPatternDeletion(i)" *ngIf="markedForDeletionOutboundPattern.includes(i)" class="btn btn-warning ml-2"
|
||||
type="button">
|
||||
<i class="fas fa-undo"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Input elements in a separate row -->
|
||||
<div class="row mb-1">
|
||||
<div class="col">
|
||||
<select #outboundPattern formControlName="pattern" id="additionalOutboundPattern{{i}}"
|
||||
name="additionalOutboundPattern{{i}}"
|
||||
required>
|
||||
<option value="">{{ 'ldn-new-service.form.label.placeholder.outboundPattern' | translate }}</option>
|
||||
<option *ngFor="let pattern of outboundPatterns"
|
||||
[value]="pattern">{{ 'ldn-service.form.pattern.' + pattern + '.label' | translate }} </option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col">
|
||||
<ng-container *ngIf="outboundPattern.value">
|
||||
<select formControlName="constraint" id="constraint{{i}}" name="constraint{{i}}">
|
||||
<option value="">{{ 'ldn-new-service.form.label.placeholder.selectedItemFilter' | translate }}</option>
|
||||
<option *ngFor="let itemFilter of (itemfiltersRD$ | async)?.payload?.page"
|
||||
[value]="itemFilter.id">{{ itemFilter.id }}</option>
|
||||
</select>
|
||||
</ng-container>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<span
|
||||
(click)="addOutboundPattern()"
|
||||
class="add-pattern-link mb-2">{{ 'ldn-new-service.form.label.addPattern' | translate }}
|
||||
<div [style.visibility]="'hidden'" class="col-sm1">
|
||||
<input hidden id="automatic{{i}}" name="automatic{{i}}" type="checkbox">
|
||||
<div
|
||||
class="toggle-switch">
|
||||
<div class="slider"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-sm-2">
|
||||
<div class="btn-group">
|
||||
<button (click)="markForOutboundPatternDeletion(i)" class="btn btn-outline-dark trash-button"
|
||||
type="button">
|
||||
<i class="fas fa-trash"></i>
|
||||
</button>
|
||||
<button (click)="unmarkForOutboundPatternDeletion(i)" *ngIf="markedForDeletionOutboundPattern.includes(i)"
|
||||
class="btn btn-warning"
|
||||
type="button">
|
||||
<i class="fas fa-undo"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ng-container>
|
||||
</div>
|
||||
|
||||
<span
|
||||
(click)="addOutboundPattern()"
|
||||
class="add-pattern-link mb-2">{{ 'ldn-new-service.form.label.addPattern' | translate }}
|
||||
</span>
|
||||
|
||||
<div class="mb-5">
|
||||
|
||||
</div>
|
||||
<div aria-label="Basic example" class="submission-form-footer mt-1 mb-1 position-sticky" role="group">
|
||||
<button class="btn btn-primary" type="submit">
|
||||
<span><i class="fas fa-save"></i> {{ 'ldn-new-service.form.label.submit' | translate }}</span>
|
||||
</button>
|
||||
<div class="d-flex">
|
||||
<button (click)="this.openResetFormModal(this.resetFormModal)" class="btn btn-danger" type="button">
|
||||
<span><i class="fas fa-trash"></i> {{ 'submission.general.discard.submit' | translate }}</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
<div aria-label="Basic example" class="submission-form-footer mt-1 mb-1 position-sticky" role="group">
|
||||
<button class="btn btn-primary" type="submit">
|
||||
<span><i class="fas fa-save"></i> {{ 'ldn-new-service.form.label.submit' | translate }}</span>
|
||||
</button>
|
||||
<div class="d-flex">
|
||||
<button (click)="this.openResetFormModal(this.resetFormModal)" class="btn btn-danger" type="button">
|
||||
<span><i class="fas fa-trash"></i> {{ 'submission.general.discard.submit' | translate }}</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<ng-template #confirmModal>
|
||||
|
||||
<div>
|
||||
<div>
|
||||
|
||||
<div class="modal-header">
|
||||
<div>
|
||||
<h4>{{'service.overview.edit.modal' | translate }}</h4>
|
||||
</div>
|
||||
<button (click)="closeModal()" aria-label="Close"
|
||||
class="close" type="button">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="modal-body">
|
||||
<div>
|
||||
{{ 'service.overview.edit.body' | translate }}
|
||||
</div>
|
||||
<div class="mt-4">
|
||||
<button (click)="closeModal()" class="btn btn-danger mr-2"
|
||||
id="delete-confirm">{{ 'service.detail.return' | translate }}
|
||||
</button>
|
||||
<button (click)="this.patchService()"
|
||||
class="btn btn-primary custom-btn">{{ 'service.detail.update' | translate }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-header">
|
||||
<div>
|
||||
<h4>{{'service.overview.edit.modal' | translate }}</h4>
|
||||
</div>
|
||||
<button (click)="closeModal()" aria-label="Close"
|
||||
class="close" type="button">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="modal-body">
|
||||
<div>
|
||||
{{ 'service.overview.edit.body' | translate }}
|
||||
</div>
|
||||
<div class="mt-4">
|
||||
<button (click)="closeModal()" class="btn btn-danger mr-2"
|
||||
id="delete-confirm">{{ 'service.detail.return' | translate }}
|
||||
</button>
|
||||
<button (click)="this.patchService()"
|
||||
class="btn btn-primary custom-btn">{{ 'service.detail.update' | translate }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
|
||||
<ng-template #resetFormModal>
|
||||
|
||||
<div>
|
||||
<div>
|
||||
|
||||
<div class="modal-header">
|
||||
<div>
|
||||
<h4>{{'service.overview.reset-form.modal' | translate }}</h4>
|
||||
</div>
|
||||
<button (click)="closeModal()" aria-label="Close"
|
||||
class="close" type="button">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="modal-body">
|
||||
<div>
|
||||
{{ 'service.overview.reset-form.body' | translate }}
|
||||
</div>
|
||||
<div class="mt-4">
|
||||
<button (click)="closeModal()" class="mr-2 btn btn-danger"
|
||||
id="reset-delete">{{ 'service.overview.reset-form.reset-confirm' | translate }}
|
||||
</button>
|
||||
<button (click)="resetFormAndLeave()"
|
||||
class="btn btn-primary custom-btn"
|
||||
id="reset-confirm">{{ 'service.overview.reset-form.reset-return' | translate }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-header">
|
||||
<div>
|
||||
<h4>{{'service.overview.reset-form.modal' | translate }}</h4>
|
||||
</div>
|
||||
<button (click)="closeModal()" aria-label="Close"
|
||||
class="close" type="button">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="modal-body">
|
||||
<div>
|
||||
{{ 'service.overview.reset-form.body' | translate }}
|
||||
</div>
|
||||
<div class="mt-4">
|
||||
<button (click)="closeModal()" class="mr-2 btn btn-danger"
|
||||
id="reset-delete">{{ 'service.overview.reset-form.reset-confirm' | translate }}
|
||||
</button>
|
||||
<button (click)="resetFormAndLeave()"
|
||||
class="btn btn-primary custom-btn"
|
||||
id="reset-confirm">{{ 'service.overview.reset-form.reset-return' | translate }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
|
||||
|
||||
@@ -47,6 +47,12 @@ textarea {
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.error-text {
|
||||
color: red;
|
||||
font-size: 0.8em;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.toggle-switch {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
@@ -51,6 +51,7 @@ export class LdnServiceFormEditComponent implements OnInit {
|
||||
@Input() public description: string;
|
||||
@Input() public url: string;
|
||||
@Input() public ldnUrl: string;
|
||||
@Input() public score: number;
|
||||
@Input() public inboundPattern: string;
|
||||
@Input() public outboundPattern: string;
|
||||
@Input() public constraint: string;
|
||||
@@ -85,6 +86,7 @@ export class LdnServiceFormEditComponent implements OnInit {
|
||||
description: ['', Validators.required],
|
||||
url: ['', Validators.required],
|
||||
ldnUrl: ['', Validators.required],
|
||||
score: ['', [Validators.required, Validators.pattern('^0*(\.[0-9]+)?$|^1(\.0+)?$')]],
|
||||
inboundPattern: [''],
|
||||
outboundPattern: [''],
|
||||
constraintPattern: [''],
|
||||
@@ -124,6 +126,7 @@ export class LdnServiceFormEditComponent implements OnInit {
|
||||
name: this.service.name,
|
||||
description: this.service.description,
|
||||
url: this.service.url,
|
||||
score: this.service.score,
|
||||
ldnUrl: this.service.ldnUrl,
|
||||
type: this.service.type,
|
||||
enabled: this.service.enabled
|
||||
@@ -163,6 +166,8 @@ export class LdnServiceFormEditComponent implements OnInit {
|
||||
this.createReplaceOperation(patchOperations, 'description', '/description');
|
||||
this.createReplaceOperation(patchOperations, 'ldnUrl', '/ldnurl');
|
||||
this.createReplaceOperation(patchOperations, 'url', '/url');
|
||||
this.createReplaceOperation(patchOperations, 'score', '/score');
|
||||
|
||||
|
||||
this.handlePatterns(patchOperations, 'notifyServiceInboundPatterns');
|
||||
this.handlePatterns(patchOperations, 'notifyServiceOutboundPatterns');
|
||||
@@ -250,16 +255,18 @@ export class LdnServiceFormEditComponent implements OnInit {
|
||||
|
||||
this.ldnServicesService.patch(this.service, patchOperations).pipe(
|
||||
getFirstCompletedRemoteData()
|
||||
).subscribe(
|
||||
() => {
|
||||
|
||||
this.closeModal();
|
||||
this.sendBack();
|
||||
this.notificationService.success(this.translateService.get('admin.registries.services-formats.modify.success.head'),
|
||||
this.translateService.get('admin.registries.services-formats.modify.success.content'));
|
||||
}
|
||||
);
|
||||
|
||||
).subscribe((rd: RemoteData<LdnService>) => {
|
||||
if (rd.hasSucceeded) {
|
||||
this.closeModal();
|
||||
this.sendBack();
|
||||
this.notificationService.success(this.translateService.get('admin.registries.services-formats.modify.success.head'),
|
||||
this.translateService.get('admin.registries.services-formats.modify.success.content'));
|
||||
} else {
|
||||
this.notificationService.error(this.translateService.get('admin.registries.services-formats.modify.failure.head'),
|
||||
this.translateService.get('admin.registries.services-formats.modify.failure.content'));
|
||||
this.closeModal();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
resetFormAndLeave() {
|
||||
|
||||
@@ -1,266 +1,273 @@
|
||||
<div class="container">
|
||||
<form (ngSubmit)="onSubmit()" [formGroup]="formModel">
|
||||
<div class="d-flex">
|
||||
<h2 class="flex-grow-1">{{ 'ldn-create-service.title' | translate }}</h2>
|
||||
</div>
|
||||
<!-- In the name section -->
|
||||
<div class="mb-2">
|
||||
<label for="name">{{ 'ldn-new-service.form.label.name' | translate }}</label>
|
||||
<input [class.invalid-field]="formModel.get('name').invalid && formModel.get('name').touched"
|
||||
[placeholder]="'ldn-new-service.form.placeholder.name' | translate" formControlName="name" id="name"
|
||||
name="name"
|
||||
type="text">
|
||||
</div>
|
||||
<form (ngSubmit)="onSubmit()" [formGroup]="formModel">
|
||||
<div class="d-flex">
|
||||
<h2 class="flex-grow-1">{{ 'ldn-create-service.title' | translate }}</h2>
|
||||
</div>
|
||||
<!-- In the name section -->
|
||||
<div class="mb-5">
|
||||
<label for="name">{{ 'ldn-new-service.form.label.name' | translate }}</label>
|
||||
<input [class.invalid-field]="formModel.get('name').invalid && formModel.get('name').touched"
|
||||
[placeholder]="'ldn-new-service.form.placeholder.name' | translate" formControlName="name" id="name"
|
||||
name="name"
|
||||
type="text">
|
||||
<div *ngIf="formModel.get('name').invalid && formModel.get('name').touched" class="error-text">
|
||||
{{ 'ldn-new-service.form.error.name' | translate }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
|
||||
</div>
|
||||
|
||||
<!-- In the description section -->
|
||||
<div class="mb-2 d-flex flex-column">
|
||||
<label for="description">{{ 'ldn-new-service.form.label.description' | translate }}</label>
|
||||
<textarea [placeholder]="'ldn-new-service.form.placeholder.description' | translate"
|
||||
formControlName="description" id="description" name="description"></textarea>
|
||||
</div>
|
||||
<!-- In the description section -->
|
||||
<div class="mb-5 mt-5 d-flex flex-column">
|
||||
<label for="description">{{ 'ldn-new-service.form.label.description' | translate }}</label>
|
||||
<textarea [placeholder]="'ldn-new-service.form.placeholder.description' | translate"
|
||||
formControlName="description" id="description" name="description"></textarea>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
|
||||
</div>
|
||||
|
||||
<!-- In the url section -->
|
||||
<div class="mb-2">
|
||||
<label for="url">{{ 'ldn-new-service.form.label.url' | translate }}</label>
|
||||
<input [class.invalid-field]="formModel.get('url').invalid && formModel.get('url').touched"
|
||||
[placeholder]="'ldn-new-service.form.placeholder.url' | translate" formControlName="url" id="url"
|
||||
name="url"
|
||||
type="text">
|
||||
</div>
|
||||
<!-- In the url section -->
|
||||
<div class="mb-5 mt-5">
|
||||
<label for="url">{{ 'ldn-new-service.form.label.url' | translate }}</label>
|
||||
<input [class.invalid-field]="formModel.get('url').invalid && formModel.get('url').touched"
|
||||
[placeholder]="'ldn-new-service.form.placeholder.url' | translate" formControlName="url" id="url"
|
||||
name="url"
|
||||
type="text">
|
||||
<div *ngIf="formModel.get('url').invalid && formModel.get('url').touched" class="error-text">
|
||||
{{ 'ldn-new-service.form.error.url' | translate }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
|
||||
</div>
|
||||
|
||||
<!-- In the ldnUrl section -->
|
||||
<div class="mb-2">
|
||||
<label for="ldnUrl">{{ 'ldn-new-service.form.label.ldnUrl' | translate }}</label>
|
||||
<input [class.invalid-field]="formModel.get('ldnUrl').invalid && formModel.get('ldnUrl').touched"
|
||||
[placeholder]="'ldn-new-service.form.placeholder.ldnUrl' | translate" formControlName="ldnUrl"
|
||||
id="ldnUrl"
|
||||
name="ldnUrl"
|
||||
type="text">
|
||||
</div>
|
||||
<!-- In the ldnUrl section -->
|
||||
<div class="mb-5 mt-5">
|
||||
<label for="ldnUrl">{{ 'ldn-new-service.form.label.ldnUrl' | translate }}</label>
|
||||
<input [class.invalid-field]="formModel.get('ldnUrl').invalid && formModel.get('ldnUrl').touched"
|
||||
[placeholder]="'ldn-new-service.form.placeholder.ldnUrl' | translate" formControlName="ldnUrl"
|
||||
id="ldnUrl"
|
||||
name="ldnUrl"
|
||||
type="text">
|
||||
<div *ngIf="formModel.get('ldnUrl').invalid && formModel.get('ldnUrl').touched" class="error-text">
|
||||
{{ 'ldn-new-service.form.error.ldnurl' | translate }}
|
||||
</div>
|
||||
</div>
|
||||
<!-- In the score section -->
|
||||
<div class="mb-2">
|
||||
<label for="score">{{ 'ldn-new-service.form.label.score' | translate }}</label>
|
||||
<input [class.invalid-field]="formModel.get('score').invalid && formModel.get('score').touched"
|
||||
[placeholder]="'ldn-new-service.form.placeholder.score' | translate" formControlName="score"
|
||||
id="score"
|
||||
name="score"
|
||||
type="text">
|
||||
<div *ngIf="formModel.get('score').invalid && formModel.get('score').touched" class="error-text">
|
||||
{{ 'ldn-new-service.form.error.score' | translate }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
|
||||
</div>
|
||||
<!-- In the Inbound Patterns section -->
|
||||
<div class="row mb-2 mt-5">
|
||||
<div class="col">
|
||||
<label>{{ 'ldn-new-service.form.label.inboundPattern' | translate }} </label>
|
||||
</div>
|
||||
<div class="col">
|
||||
<label class="label-box">{{ 'ldn-new-service.form.label.ItemFilter' | translate }}</label>
|
||||
</div>
|
||||
<div class="col-sm1 ">
|
||||
<label class="label-box-2">{{ 'ldn-new-service.form.label.automatic' | translate }}</label>
|
||||
</div>
|
||||
<div class="col-sm-2">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- In the Inbound Patterns section -->
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<label>{{ 'ldn-new-service.form.label.inboundPattern' | translate }} </label>
|
||||
<div *ngFor="let patternGroup of formModel.get('notifyServiceInboundPatterns')['controls']; let i = index"
|
||||
formGroupName="notifyServiceInboundPatterns">
|
||||
|
||||
<ng-container [formGroupName]="i">
|
||||
|
||||
|
||||
<div class="row mb-1">
|
||||
<div class="col">
|
||||
<select #inboundPattern formControlName="pattern" id="additionalInboundPattern{{i}}"
|
||||
name="additionalInboundPattern{{i}}" required>
|
||||
<option value="">{{ 'ldn-new-service.form.label.placeholder.inboundPattern' | translate }}</option>
|
||||
<option *ngFor="let pattern of inboundPatterns"
|
||||
[value]="pattern">{{ 'ldn-service.form.pattern.' + pattern + '.label' | translate }} </option>
|
||||
</select>
|
||||
<div *ngIf="!patternSelected()" class="error-text">
|
||||
{{ 'ldn-new-service.form.error.patterns' | translate }}
|
||||
</div>
|
||||
<div class="col">
|
||||
<label class="label-box">{{ 'ldn-new-service.form.label.ItemFilter' | translate }}</label>
|
||||
</div>
|
||||
<div class="col-sm1 ">
|
||||
<label class="label-box-2">{{ 'ldn-new-service.form.label.automatic' | translate }}</label>
|
||||
</div>
|
||||
<div class="col-sm-1">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div *ngFor="let patternGroup of formModel.get('notifyServiceInboundPatterns')['controls']; let i = index"
|
||||
formGroupName="notifyServiceInboundPatterns">
|
||||
|
||||
<ng-container [formGroupName]="i">
|
||||
</div>
|
||||
|
||||
|
||||
<div class="row mb-1">
|
||||
<div class="col">
|
||||
<select #inboundPattern formControlName="pattern" id="additionalInboundPattern{{i}}"
|
||||
name="additionalInboundPattern{{i}}" required>
|
||||
<option value="">{{ 'ldn-new-service.form.label.placeholder.inboundPattern' | translate }}</option>
|
||||
<option *ngFor="let pattern of inboundPatterns"
|
||||
[ngValue]="pattern.name">{{ pattern.name }}</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="col">
|
||||
<ng-container *ngIf="inboundPattern.value">
|
||||
<select formControlName="constraint" id="constraint{{i}}" name="constraint{{i}}">
|
||||
<option value="">{{ 'ldn-new-service.form.label.placeholder.selectedItemFilter' | translate }}</option>
|
||||
<option *ngFor="let itemFilter of (itemfiltersRD$ | async)?.payload?.page"
|
||||
[value]="itemFilter.id">{{ itemFilter.id }}</option>
|
||||
</select>
|
||||
</ng-container>
|
||||
</div>
|
||||
|
||||
<div [style.visibility]="inboundPattern.value ? 'visible' : 'hidden'" class="col-sm-1">
|
||||
<input formControlName="automatic" hidden id="automatic{{i}}" name="automatic{{i}}"
|
||||
type="checkbox">
|
||||
<div (click)="toggleAutomatic(i)"
|
||||
[class.checked]="formModel.get('notifyServiceInboundPatterns.' + i + '.automatic').value"
|
||||
class="toggle-switch">
|
||||
<div class="slider"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-sm-1">
|
||||
<button (click)="removeInboundPattern(i)" class="btn btn-outline-dark trash-button">
|
||||
<i class="fas fa-trash"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<ng-container *ngIf="inboundPattern.value">
|
||||
<select formControlName="constraint" id="constraint{{i}}" name="constraint{{i}}">
|
||||
<option value="">{{ 'ldn-new-service.form.label.placeholder.selectedItemFilter' | translate }}</option>
|
||||
<option *ngFor="let itemFilter of (itemfiltersRD$ | async)?.payload?.page"
|
||||
[value]="itemFilter.id">{{ itemFilter.id }}</option>
|
||||
</select>
|
||||
</ng-container>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<span (click)="addInboundPattern()"
|
||||
class="add-pattern-link mb-2">{{ 'ldn-new-service.form.label.addPattern' | translate }}</span>
|
||||
|
||||
|
||||
<div class="mb-4">
|
||||
|
||||
</div>
|
||||
|
||||
<!-- In the Outbound Patterns section -->
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<label>{{ 'ldn-new-service.form.label.outboundPattern' | translate }}</label>
|
||||
<div [style.visibility]="inboundPattern.value ? 'visible' : 'hidden'" class="col-sm-1">
|
||||
<input formControlName="automatic" hidden id="automatic{{i}}" name="automatic{{i}}"
|
||||
type="checkbox">
|
||||
<div (click)="toggleAutomatic(i)"
|
||||
[class.checked]="formModel.get('notifyServiceInboundPatterns.' + i + '.automatic').value"
|
||||
class="toggle-switch">
|
||||
<div class="slider"></div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<label class="label-box">{{ 'ldn-new-service.form.label.ItemFilter' | translate }}</label>
|
||||
</div>
|
||||
<div class="col-sm-1 ">
|
||||
</div>
|
||||
<div class="col-sm-1 ">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div *ngFor="let patternGroup of formModel.get('notifyServiceOutboundPatterns')['controls']; let i = index"
|
||||
formGroupName="notifyServiceOutboundPatterns">
|
||||
|
||||
<ng-container [formGroupName]="i">
|
||||
|
||||
<!-- Input elements in a separate row -->
|
||||
<div class="row mb-1">
|
||||
<div class="col">
|
||||
<select #outboundPattern formControlName="pattern" id="additionalOutboundPattern{{i}}"
|
||||
name="additionalOutboundPattern{{i}}"
|
||||
required>
|
||||
<option value="">{{ 'ldn-new-service.form.label.placeholder.outboundPattern' | translate }}</option>
|
||||
<option *ngFor="let pattern of outboundPatterns"
|
||||
[ngValue]="pattern.name">{{ pattern.name }}</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col">
|
||||
<ng-container *ngIf="outboundPattern.value">
|
||||
<select formControlName="constraint" id="constraint{{i}}" name="constraint{{i}}">
|
||||
<option value="">{{ 'ldn-new-service.form.label.placeholder.selectedItemFilter' | translate }}</option>
|
||||
<option *ngFor="let itemFilter of (itemfiltersRD$ | async)?.payload?.page"
|
||||
[value]="itemFilter.id">{{ itemFilter.id }}</option>
|
||||
</select>
|
||||
</ng-container>
|
||||
</div>
|
||||
|
||||
<div [style.visibility]="'hidden'" class="col-sm1">
|
||||
<input hidden id="automatic{{i}}" name="automatic{{i}}" type="checkbox">
|
||||
<div
|
||||
class="toggle-switch">
|
||||
<div class="slider"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-sm-1">
|
||||
<button (click)="removeOutboundPattern(i)" class="btn btn-outline-dark trash-button">
|
||||
<i class="fas fa-trash"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</ng-container>
|
||||
|
||||
</div>
|
||||
|
||||
<span (click)="addOutboundPattern()"
|
||||
class="add-pattern-link">{{ 'ldn-new-service.form.label.addPattern' | translate }}
|
||||
</span>
|
||||
<div class="mb-4">
|
||||
|
||||
</div>
|
||||
|
||||
<div aria-label="Basic example" class="submission-form-footer mt-1 mb-1 position-sticky" role="group">
|
||||
<button class="btn btn-primary" type="submit">
|
||||
<span><i class="fas fa-save"></i> {{ 'ldn-new-service.form.label.submit' | translate }}</span>
|
||||
<div class="col-sm-1">
|
||||
<button (click)="removeInboundPattern(i)" class="btn btn-outline-dark trash-button">
|
||||
<i class="fas fa-trash"></i>
|
||||
</button>
|
||||
<div class="d-flex">
|
||||
<button (click)="this.openResetFormModal(this.resetFormModal)" class="btn btn-danger" type="button">
|
||||
<span><i class="fas fa-trash"></i> {{ 'submission.general.discard.submit' | translate }}</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ng-container>
|
||||
</div>
|
||||
|
||||
<span (click)="addInboundPattern()"
|
||||
class="add-pattern-link mb-4">{{ 'ldn-new-service.form.label.addPattern' | translate }}</span>
|
||||
|
||||
</form>
|
||||
<!-- In the Outbound Patterns section -->
|
||||
<div class="row mb-1 mt-5">
|
||||
<div class="col">
|
||||
<label>{{ 'ldn-new-service.form.label.outboundPattern' | translate }} </label>
|
||||
</div>
|
||||
<div class="col">
|
||||
<label class="label-box">{{ 'ldn-new-service.form.label.ItemFilter' | translate }}</label>
|
||||
</div>
|
||||
<div class="col-sm1 ">
|
||||
<label class="label-box-2" style="visibility: hidden;">
|
||||
{{ 'ldn-new-service.form.label.automatic' | translate }}
|
||||
</label>
|
||||
</div>
|
||||
<div class="col-sm-2">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div *ngFor="let patternGroup of formModel.get('notifyServiceOutboundPatterns')['controls']; let i = index"
|
||||
formGroupName="notifyServiceOutboundPatterns">
|
||||
|
||||
<ng-container [formGroupName]="i">
|
||||
|
||||
<!-- Input elements in a separate row -->
|
||||
<div class="row mb-1">
|
||||
<div class="col">
|
||||
<select #outboundPattern formControlName="pattern" id="additionalOutboundPattern{{i}}"
|
||||
name="additionalOutboundPattern{{i}}"
|
||||
required>
|
||||
<option value="">{{ 'ldn-new-service.form.label.placeholder.outboundPattern' | translate }}</option>
|
||||
<option *ngFor="let pattern of outboundPatterns"
|
||||
[value]="pattern">{{ 'ldn-service.form.pattern.' + pattern + '.label' | translate }}</option>
|
||||
</select>
|
||||
<div *ngIf="!patternSelected()" class="error-text">
|
||||
{{ 'ldn-new-service.form.error.patterns' | translate }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<ng-container *ngIf="outboundPattern.value">
|
||||
<select formControlName="constraint" id="constraint{{i}}" name="constraint{{i}}">
|
||||
<option value="">{{ 'ldn-new-service.form.label.placeholder.selectedItemFilter' | translate }}</option>
|
||||
<option *ngFor="let itemFilter of (itemfiltersRD$ | async)?.payload?.page"
|
||||
[value]="itemFilter.id">{{ itemFilter.id }}</option>
|
||||
</select>
|
||||
</ng-container>
|
||||
</div>
|
||||
|
||||
<div [style.visibility]="'hidden'" class="col-sm1">
|
||||
<input hidden id="automatic{{i}}" name="automatic{{i}}" type="checkbox">
|
||||
<div
|
||||
class="toggle-switch">
|
||||
<div class="slider"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-sm-1">
|
||||
<button (click)="removeOutboundPattern(i)" class="btn btn-outline-dark trash-button">
|
||||
<i class="fas fa-trash"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</ng-container>
|
||||
|
||||
</div>
|
||||
|
||||
<span (click)="addOutboundPattern()"
|
||||
class="add-pattern-link mb-4">{{ 'ldn-new-service.form.label.addPattern' | translate }}
|
||||
</span>
|
||||
|
||||
<div aria-label="Basic example" class="submission-form-footer mt-1 mb-1 position-sticky" role="group">
|
||||
<button class="btn btn-primary" type="submit">
|
||||
<span><i class="fas fa-save"></i> {{ 'ldn-new-service.form.label.submit' | translate }}</span>
|
||||
</button>
|
||||
<div class="d-flex">
|
||||
<button (click)="this.openResetFormModal(this.resetFormModal)" class="btn btn-danger" type="button">
|
||||
<span><i class="fas fa-trash"></i> {{ 'submission.general.discard.submit' | translate }}</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<ng-template #confirmModal>
|
||||
|
||||
<div>
|
||||
<div>
|
||||
|
||||
<div class="modal-header">
|
||||
<div>
|
||||
<h4>{{'service.overview.create.modal' | translate }}</h4>
|
||||
</div>
|
||||
<button (click)="closeModal()" aria-label="Close"
|
||||
class="close" type="button">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="modal-body">
|
||||
<div>
|
||||
{{ 'service.create.body' | translate }}
|
||||
</div>
|
||||
<div class="mt-4">
|
||||
<button (click)="closeModal()" class="btn btn-danger"
|
||||
id="delete-confirm">{{ 'service.refuse.create' | translate }}
|
||||
</button>
|
||||
<button (click)="createService()"
|
||||
class="btn btn-primary mr-2 custom-btn">{{ 'service.confirm.create' | translate }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-header">
|
||||
<div>
|
||||
<h4>{{'service.overview.create.modal' | translate }}</h4>
|
||||
</div>
|
||||
<button (click)="closeModal()" aria-label="Close"
|
||||
class="close" type="button">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="modal-body">
|
||||
<div>
|
||||
{{ 'service.create.body' | translate }}
|
||||
</div>
|
||||
<div class="mt-4">
|
||||
<button (click)="closeModal()" class="btn btn-danger"
|
||||
id="delete-confirm">{{ 'service.refuse.create' | translate }}
|
||||
</button>
|
||||
<button (click)="createService()"
|
||||
class="btn btn-primary mr-2 custom-btn">{{ 'service.confirm.create' | translate }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
|
||||
<ng-template #resetFormModal>
|
||||
|
||||
<div>
|
||||
<div>
|
||||
|
||||
<div class="modal-header">
|
||||
<div>
|
||||
<h4>{{'service.create.reset-form.modal' | translate }}</h4>
|
||||
</div>
|
||||
<button (click)="closeModal()" aria-label="Close"
|
||||
class="close" type="button">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="modal-body">
|
||||
<div>
|
||||
{{ 'service.create.reset-form.body' | translate }}
|
||||
</div>
|
||||
<div class="mt-4">
|
||||
<button (click)="resetFormAndLeave()"
|
||||
class="btn btn-primary mr-2 custom-btn"
|
||||
id="reset-confirm">{{ 'service.overview.reset-form.reset-return' | translate }}
|
||||
</button>
|
||||
<button (click)="closeModal()" class="btn btn-danger"
|
||||
id="reset-delete">{{ 'service.overview.reset-form.reset-confirm' | translate }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-header">
|
||||
<div>
|
||||
<h4>{{'service.create.reset-form.modal' | translate }}</h4>
|
||||
</div>
|
||||
<button (click)="closeModal()" aria-label="Close"
|
||||
class="close" type="button">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="modal-body">
|
||||
<div>
|
||||
{{ 'service.create.reset-form.body' | translate }}
|
||||
</div>
|
||||
<div class="mt-4">
|
||||
<button (click)="resetFormAndLeave()"
|
||||
class="btn btn-primary mr-2 custom-btn"
|
||||
id="reset-confirm">{{ 'service.overview.reset-form.reset-return' | translate }}
|
||||
</button>
|
||||
<button (click)="closeModal()" class="btn btn-danger"
|
||||
id="reset-delete">{{ 'service.overview.reset-form.reset-confirm' | translate }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
|
||||
|
||||
|
||||
@@ -1,8 +1,6 @@
|
||||
form {
|
||||
max-width: 800px;
|
||||
font-size: 14px;
|
||||
position: relative;
|
||||
|
||||
}
|
||||
|
||||
input[type="text"],
|
||||
@@ -49,6 +47,12 @@ textarea {
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.error-text {
|
||||
color: red;
|
||||
font-size: 0.8em;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.toggle-switch {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
@@ -58,6 +58,7 @@ export class LdnServiceFormComponent implements OnInit {
|
||||
@Input() public name: string;
|
||||
@Input() public description: string;
|
||||
@Input() public url: string;
|
||||
@Input() public score: string;
|
||||
@Input() public ldnUrl: string;
|
||||
@Input() public inboundPattern: string;
|
||||
@Input() public outboundPattern: string;
|
||||
@@ -67,6 +68,9 @@ export class LdnServiceFormComponent implements OnInit {
|
||||
@Output() submitForm: EventEmitter<any> = new EventEmitter();
|
||||
@Output() cancelForm: EventEmitter<any> = new EventEmitter();
|
||||
private modalRef: any;
|
||||
hasInboundPattern: boolean;
|
||||
hasOutboundPattern: boolean;
|
||||
isScoreValid: boolean;
|
||||
|
||||
constructor(
|
||||
private ldnServicesService: LdnServicesService,
|
||||
@@ -85,6 +89,7 @@ export class LdnServiceFormComponent implements OnInit {
|
||||
name: ['', Validators.required],
|
||||
description: [''],
|
||||
url: ['', Validators.required],
|
||||
score: ['', [Validators.required, Validators.pattern('^0*(\.[0-9]+)?$|^1(\.0+)?$')]],
|
||||
ldnUrl: ['', Validators.required],
|
||||
inboundPattern: [''],
|
||||
outboundPattern: [''],
|
||||
@@ -119,14 +124,21 @@ export class LdnServiceFormComponent implements OnInit {
|
||||
|
||||
createService() {
|
||||
this.formModel.get('name').markAsTouched();
|
||||
this.formModel.get('score').markAsTouched();
|
||||
this.formModel.get('url').markAsTouched();
|
||||
this.formModel.get('ldnUrl').markAsTouched();
|
||||
this.formModel.get('notifyServiceInboundPatterns').markAsTouched();
|
||||
this.formModel.get('notifyServiceOutboundPatterns').markAsTouched();
|
||||
|
||||
const name = this.formModel.get('name').value;
|
||||
const url = this.formModel.get('url').value;
|
||||
const score = this.formModel.get('score').value;
|
||||
const ldnUrl = this.formModel.get('ldnUrl').value;
|
||||
|
||||
if (!name || !url || !ldnUrl) {
|
||||
const hasInboundPattern = this.checkPatterns(this.formModel.get('notifyServiceInboundPatterns') as FormArray);
|
||||
const hasOutboundPattern = this.checkPatterns(this.formModel.get('notifyServiceOutboundPatterns') as FormArray);
|
||||
|
||||
if (!name || !url || !ldnUrl || !score || (!hasInboundPattern && !hasOutboundPattern)) {
|
||||
this.closeModal();
|
||||
return;
|
||||
}
|
||||
@@ -144,15 +156,26 @@ export class LdnServiceFormComponent implements OnInit {
|
||||
if (rd.hasSucceeded) {
|
||||
this.notificationsService.success(this.translateService.get('ldn-service-notification.created.success.title'),
|
||||
this.translateService.get('ldn-service-notification.created.success.body'));
|
||||
|
||||
this.sendBack();
|
||||
this.closeModal();
|
||||
} else {
|
||||
this.notificationsService.error(this.translateService.get('notification.created.failure'));
|
||||
this.notificationsService.error(this.translateService.get('ldn-service-notification.created.failure.title'),
|
||||
this.translateService.get('ldn-service-notification.created.failure.body'));
|
||||
this.closeModal();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
checkPatterns(formArray: FormArray): boolean {
|
||||
for (let i = 0; i < formArray.length; i++) {
|
||||
const pattern = formArray.at(i).get('pattern').value;
|
||||
if (pattern) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
|
||||
resetFormAndLeave() {
|
||||
this.sendBack();
|
||||
@@ -191,6 +214,22 @@ export class LdnServiceFormComponent implements OnInit {
|
||||
}
|
||||
}
|
||||
|
||||
patternSelected(): boolean {
|
||||
for (let pattern of this.formModel.get('notifyServiceInboundPatterns').value) {
|
||||
if (pattern.pattern !== '') {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
for (let pattern of this.formModel.get('notifyServiceOutboundPatterns').value) {
|
||||
if (pattern.pattern !== '') {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
private sendBack() {
|
||||
this.router.navigateByUrl('admin/ldn/services');
|
||||
}
|
||||
|
||||
@@ -32,6 +32,9 @@ export class LdnService extends CacheableObject {
|
||||
@autoserialize
|
||||
url: string;
|
||||
|
||||
@autoserialize
|
||||
score: number;
|
||||
|
||||
@autoserialize
|
||||
enabled: boolean;
|
||||
|
||||
|
||||
@@ -941,6 +941,12 @@
|
||||
"ldn-new-service.form.label.placeholder.selectedItemFilter": "No Item Filter Selected",
|
||||
"ldn-new-service.form.label.ItemFilter": "Item Filter",
|
||||
"ldn-new-service.form.label.automatic": "Automatic",
|
||||
"ldn-new-service.form.error.name": "Name is required",
|
||||
"ldn-new-service.form.error.url": "URL is required",
|
||||
"ldn-new-service.form.error.ldnurl": "LDN URL is required",
|
||||
"ldn-new-service.form.error.patterns": "At least a pattern is required",
|
||||
"ldn-new-service.form.error.score": "Please enter a valid score (between 0 and 1). Use the “.” as decimal separator",
|
||||
|
||||
"ldn-new-service.form.label.outboundPattern": "Outbound Patterns",
|
||||
"ldn-new-service.form.label.placeholder.outboundPattern": "Select an Outbound Pattern",
|
||||
"ldn-new-service.form.label.addPattern": "+ Add more",
|
||||
|
||||
Reference in New Issue
Block a user