233 lines
14 KiB
HTML
233 lines
14 KiB
HTML
<div class="tenant-editor">
|
|
<div class="row align-items-center mb-4" *ngIf="formGroup">
|
|
<div class="col-auto">
|
|
<h3 *ngIf="isNew && !isClone">{{'TENANT-EDITOR.NEW' | translate}}</h3>
|
|
<app-navigation-breadcrumb />
|
|
</div>
|
|
<div class="col-auto">
|
|
<button mat-button class="action-btn" (click)="cancel()" type="button">{{'TENANT-EDITOR.ACTIONS.CANCEL' | translate}}</button>
|
|
</div>
|
|
<div class="col-auto" *ngIf="!isNew">
|
|
<button mat-button class="action-btn" type="button" (click)="delete()">
|
|
<mat-icon>delete</mat-icon>
|
|
{{'TENANT-EDITOR.ACTIONS.DELETE' | translate}}
|
|
</button>
|
|
</div>
|
|
<div class="col-auto" *ngIf="canSave">
|
|
<button mat-button class="action-btn" (click)="formSubmit()">
|
|
<mat-icon>save</mat-icon>
|
|
{{'TENANT-EDITOR.ACTIONS.SAVE' | translate}}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<form *ngIf="formGroup" (ngSubmit)="formSubmit()">
|
|
<mat-card appearance="outlined">
|
|
<mat-card-header>
|
|
<mat-card-title *ngIf="isNew">{{'TENANT-EDITOR.NEW' | translate}}</mat-card-title>
|
|
</mat-card-header>
|
|
<mat-card-content>
|
|
<div class="row">
|
|
<div class="col-4">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>{{'TENANT-EDITOR.FIELDS.NAME' | translate}}</mat-label>
|
|
<input matInput type="text" name="name" [formControl]="formGroup.get('name')" required>
|
|
<mat-error *ngIf="formGroup.get('name').hasError('backendError')">{{formGroup.get('name').getError('backendError').message}}</mat-error>
|
|
<mat-error *ngIf="formGroup.get('name').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-4">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>{{'TENANT-EDITOR.FIELDS.CODE' | translate}}</mat-label>
|
|
<input matInput type="text" name="code" [formControl]="formGroup.get('code')" required>
|
|
<mat-error *ngIf="formGroup.get('code').hasError('backendError')">{{formGroup.get('code').getError('backendError').message}}</mat-error>
|
|
<mat-error *ngIf="formGroup.get('code').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-12">
|
|
<h3>{{'TENANT-EDITOR.FIELDS.DESCRIPTION' | translate}}</h3>
|
|
<div class="col-12">
|
|
<rich-text-editor-component [parentFormGroup]="formGroup" [controlName]="'description'" [placeholder]="'TENANT-EDITOR.FIELDS.DESCRIPTION-PLACEHOLDER'" [wrapperClasses]="(formGroup.get('description').touched && formGroup.get('description').hasError('required')) ? 'required' : ''" [editable]="formGroup.controls['description'].status !== 'DISABLED'">
|
|
</rich-text-editor-component>
|
|
<div [class]="(formGroup.get('description').touched && formGroup.get('description').hasError('required')) ? 'visible' : 'invisible'" class="mat-form-field formGroup-field-subscript-wrapper">
|
|
<mat-error *ngIf="formGroup.get('description').hasError('backendError')">{{formGroup.get('description').getError('backendError').message}}</mat-error>
|
|
<mat-error>{{'GENERAL.VALIDATION.REQUIRED'| translate}}</mat-error>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Deposit -->
|
|
<div class="col-12">
|
|
<h3>
|
|
{{'TENANT-EDITOR.FIELDS.DEPOSIT' | translate}}
|
|
<button mat-button class="action-btn" type="button" (click)="addDepositSource()" [disabled]="formGroup.disabled">{{'TENANT-EDITOR.ACTIONS.ADD-SOURCE' | translate}}</button>
|
|
</h3>
|
|
<div *ngFor="let source of formGroup.get('config').get('deposit').get('sources').controls; let sourceIndex=index;" class="row mb-3">
|
|
<div class="col-12">
|
|
<div class="row mb-3 d-flex align-items-center">
|
|
<div class="col-auto d-flex">
|
|
<mat-card-title>{{'TENANT-EDITOR.FIELDS.SOURCE' | translate}} {{sourceIndex + 1}}</mat-card-title>
|
|
</div>
|
|
<div class="col-auto d-flex">
|
|
<button mat-icon-button class="action-list-icon" matTooltip="{{'TENANT-EDITOR.ACTIONS.REMOVE-SOURCE' | translate}}" (click)="removeDepositSource(sourceIndex)" [disabled]="formGroup.disabled">
|
|
<mat-icon>delete</mat-icon>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div class="row" >
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>{{'TENANT-EDITOR.FIELDS.URL' | translate}}</mat-label>
|
|
<input matInput type="text" name="url" [formControl]="source.get('url')" required>
|
|
<mat-error *ngIf="source.get('url').hasError('backendError')">{{source.get('url').getError('backendError').message}}</mat-error>
|
|
<mat-error *ngIf="source.get('url').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>{{'TENANT-EDITOR.FIELDS.ISSUER-URL' | translate}}</mat-label>
|
|
<input matInput type="text" name="issuerUrl" [formControl]="source.get('issuerUrl')" required>
|
|
<mat-error *ngIf="source.get('issuerUrl').hasError('backendError')">{{source.get('issuerUrl').getError('backendError').message}}</mat-error>
|
|
<mat-error *ngIf="source.get('issuerUrl').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>{{'TENANT-EDITOR.FIELDS.CLIENT-ID' | translate}}</mat-label>
|
|
<input matInput type="text" name="clientId" [formControl]="source.get('clientId')" required>
|
|
<mat-error *ngIf="source.get('clientId').hasError('backendError')">{{source.get('clientId').getError('backendError').message}}</mat-error>
|
|
<mat-error *ngIf="source.get('clientId').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>{{'TENANT-EDITOR.FIELDS.CLIENT-SECRET' | translate}}</mat-label>
|
|
<input matInput type="text" name="clientSecret" [formControl]="source.get('clientSecret')" required>
|
|
<mat-error *ngIf="source.get('clientSecret').hasError('backendError')">{{source.get('clientSecret').getError('backendError').message}}</mat-error>
|
|
<mat-error *ngIf="source.get('clientSecret').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>{{'TENANT-EDITOR.FIELDS.SCOPE' | translate}}</mat-label>
|
|
<input matInput type="text" name="scope" [formControl]="source.get('scope')" required>
|
|
<mat-error *ngIf="source.get('scope').hasError('backendError')">{{source.get('scope').getError('backendError').message}}</mat-error>
|
|
<mat-error *ngIf="source.get('scope').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="chip-list">
|
|
<mat-label>{{'TENANT-EDITOR.FIELDS.CODES' | translate}}</mat-label>
|
|
<mat-chip-grid #chipGrid [formControl]="source.get('codes')">
|
|
<mat-chip-row *ngFor="let code of depositCodes"
|
|
(removed)="removeDepositCode(code)"
|
|
[editable]="true"
|
|
(edited)="editDepositCode(code, $event)">
|
|
{{code}}
|
|
<button matChipRemove>
|
|
<mat-icon>cancel</mat-icon>
|
|
</button>
|
|
</mat-chip-row>
|
|
<input placeholder="{{'TENANT-EDITOR.FIELDS.CODES-PLACEHOLDER' | translate}}"
|
|
[matChipInputFor]="chipGrid"
|
|
[matChipInputSeparatorKeyCodes]="separatorKeysCodes"
|
|
[matChipInputAddOnBlur]="true"
|
|
(matChipInputTokenEnd)="addDepositCode($event)"/>
|
|
</mat-chip-grid>
|
|
<mat-error *ngIf="source.get('codes').hasError('backendError')">{{source.get('codes').getError('backendError').message}}</mat-error>
|
|
<mat-error *ngIf="source.get('codes').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-12">
|
|
<h3>
|
|
{{'TENANT-EDITOR.FIELDS.FILE-TRANSFORMERS' | translate}}
|
|
<button mat-button class="action-btn" type="button" (click)="addFileSource()" [disabled]="formGroup.disabled">{{'TENANT-EDITOR.ACTIONS.ADD-SOURCE' | translate}}</button>
|
|
</h3>
|
|
<div *ngFor="let source of formGroup.get('config').get('fileTransformers').get('sources').controls; let sourceIndex=index;" class="row mb-3">
|
|
<div class="col-12">
|
|
<div class="row mb-3 d-flex align-items-center">
|
|
<div class="col-auto d-flex">
|
|
<mat-card-title>{{'TENANT-EDITOR.FIELDS.SOURCE' | translate}} {{sourceIndex + 1}}</mat-card-title>
|
|
</div>
|
|
<div class="col-auto d-flex">
|
|
<button mat-icon-button class="action-list-icon" matTooltip="{{'TENANT-EDITOR.ACTIONS.REMOVE-SOURCE' | translate}}" (click)="removeFileSource(sourceIndex)" [disabled]="formGroup.disabled">
|
|
<mat-icon>delete</mat-icon>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div class="row" >
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>{{'TENANT-EDITOR.FIELDS.URL' | translate}}</mat-label>
|
|
<input matInput type="text" name="url" [formControl]="source.get('url')" required>
|
|
<mat-error *ngIf="source.get('url').hasError('backendError')">{{source.get('url').getError('backendError').message}}</mat-error>
|
|
<mat-error *ngIf="source.get('url').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>{{'TENANT-EDITOR.FIELDS.ISSUER-URL' | translate}}</mat-label>
|
|
<input matInput type="text" name="issuerUrl" [formControl]="source.get('issuerUrl')" required>
|
|
<mat-error *ngIf="source.get('issuerUrl').hasError('backendError')">{{source.get('issuerUrl').getError('backendError').message}}</mat-error>
|
|
<mat-error *ngIf="source.get('issuerUrl').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>{{'TENANT-EDITOR.FIELDS.CLIENT-ID' | translate}}</mat-label>
|
|
<input matInput type="text" name="clientId" [formControl]="source.get('clientId')" required>
|
|
<mat-error *ngIf="source.get('clientId').hasError('backendError')">{{source.get('clientId').getError('backendError').message}}</mat-error>
|
|
<mat-error *ngIf="source.get('clientId').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>{{'TENANT-EDITOR.FIELDS.CLIENT-SECRET' | translate}}</mat-label>
|
|
<input matInput type="text" name="clientSecret" [formControl]="source.get('clientSecret')" required>
|
|
<mat-error *ngIf="source.get('clientSecret').hasError('backendError')">{{source.get('clientSecret').getError('backendError').message}}</mat-error>
|
|
<mat-error *ngIf="source.get('clientSecret').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>{{'TENANT-EDITOR.FIELDS.SCOPE' | translate}}</mat-label>
|
|
<input matInput type="text" name="scope" [formControl]="source.get('scope')" required>
|
|
<mat-error *ngIf="source.get('scope').hasError('backendError')">{{source.get('scope').getError('backendError').message}}</mat-error>
|
|
<mat-error *ngIf="source.get('scope').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="chip-list">
|
|
<mat-label>{{'TENANT-EDITOR.FIELDS.CODES' | translate}}</mat-label>
|
|
<mat-chip-grid #chipGrid [formControl]="source.get('codes')">
|
|
<mat-chip-row *ngFor="let code of fileTransformersCodes"
|
|
(removed)="removeFileCode(code)"
|
|
[editable]="true"
|
|
(edited)="editFileCode(code, $event)">
|
|
{{code}}
|
|
<button matChipRemove>
|
|
<mat-icon>cancel</mat-icon>
|
|
</button>
|
|
</mat-chip-row>
|
|
<input placeholder="{{'TENANT-EDITOR.FIELDS.CODES-PLACEHOLDER' | translate}}"
|
|
[matChipInputFor]="chipGrid"
|
|
[matChipInputSeparatorKeyCodes]="separatorKeysCodes"
|
|
[matChipInputAddOnBlur]="true"
|
|
(matChipInputTokenEnd)="addFileCode($event)"/>
|
|
</mat-chip-grid>
|
|
<mat-error *ngIf="source.get('codes').hasError('backendError')">{{source.get('codes').getError('backendError').message}}</mat-error>
|
|
<mat-error *ngIf="source.get('codes').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</mat-card-content>
|
|
</mat-card>
|
|
</form>
|
|
</div> |