Merge remote-tracking branch 'origin/Development' into Development
This commit is contained in:
commit
f373c9016e
|
@ -29,6 +29,7 @@
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.editor-wrapper :not(.disabled) {
|
||||||
.editor-wrapper:hover, ::ng-deep .angular-editor:hover {
|
.editor-wrapper:hover, ::ng-deep .angular-editor:hover {
|
||||||
border: 1px solid #000 !important;
|
border: 1px solid #000 !important;
|
||||||
}
|
}
|
||||||
|
@ -36,6 +37,15 @@
|
||||||
.editor-wrapper:focus-within, ::ng-deep .angular-editor:focus-within {
|
.editor-wrapper:focus-within, ::ng-deep .angular-editor:focus-within {
|
||||||
border: 1px solid #034459 !important;
|
border: 1px solid #034459 !important;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.editor-wrapper .disabled {
|
||||||
|
color: rgba(0, 0, 0, 0.38);
|
||||||
|
}
|
||||||
|
|
||||||
|
.editor-wrapper .disabled ::ng-deep button {
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
.required.editor-wrapper, .required .editor ::ng-deep .angular-editor {
|
.required.editor-wrapper, .required .editor ::ng-deep .angular-editor {
|
||||||
border: 1px solid #f44336 !important;
|
border: 1px solid #f44336 !important;
|
||||||
|
|
|
@ -6,7 +6,8 @@ import {FormControl} from "@angular/forms";
|
||||||
selector: 'rich-text-editor-component',
|
selector: 'rich-text-editor-component',
|
||||||
template: `
|
template: `
|
||||||
<div class="editor-wrapper" [class]="wrapperClasses" [formGroup]="parentFormGroup">
|
<div class="editor-wrapper" [class]="wrapperClasses" [formGroup]="parentFormGroup">
|
||||||
<angular-editor class="full-width editor" [id]="id" [config]="editorConfig" [formControlName]="controlName"
|
<angular-editor class="full-width editor" [ngClass]="editable ? '': 'disabled'" [id]="id"
|
||||||
|
[config]="editorConfig" [formControlName]="controlName"
|
||||||
placeholder="{{(placeholder? (placeholder | translate) : '') + (required ? ' *': '')}}"></angular-editor>
|
placeholder="{{(placeholder? (placeholder | translate) : '') + (required ? ' *': '')}}"></angular-editor>
|
||||||
<mat-icon *ngIf="formInput.value" (click)="formInput.patchValue('')" class="clear">close</mat-icon>
|
<mat-icon *ngIf="formInput.value" (click)="formInput.patchValue('')" class="clear">close</mat-icon>
|
||||||
</div>
|
</div>
|
||||||
|
@ -20,9 +21,10 @@ export class RichTextEditorComponent {
|
||||||
@Input() placeholder: string = "Enter text";
|
@Input() placeholder: string = "Enter text";
|
||||||
@Input() required: boolean = false;
|
@Input() required: boolean = false;
|
||||||
@Input() wrapperClasses: string = "";
|
@Input() wrapperClasses: string = "";
|
||||||
|
@Input() editable: boolean = true;
|
||||||
|
|
||||||
editorConfig: AngularEditorConfig = {
|
editorConfig: AngularEditorConfig = {
|
||||||
editable: true,
|
editable: this.editable,
|
||||||
spellcheck: true,
|
spellcheck: true,
|
||||||
height: 'auto',
|
height: 'auto',
|
||||||
minHeight: '0',
|
minHeight: '0',
|
||||||
|
@ -58,4 +60,8 @@ export class RichTextEditorComponent {
|
||||||
get formInput(): FormControl {
|
get formInput(): FormControl {
|
||||||
return this.parentFormGroup.get(this.controlName);
|
return this.parentFormGroup.get(this.controlName);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
ngAfterContentInit() {
|
||||||
|
this.editorConfig.editable = this.editable;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -159,9 +159,10 @@
|
||||||
<div class="full-width basic-info-input">
|
<div class="full-width basic-info-input">
|
||||||
<rich-text-editor-component [parentFormGroup]="form" [controlName]="'description'"
|
<rich-text-editor-component [parentFormGroup]="form" [controlName]="'description'"
|
||||||
[placeholder]="'DATASET-PROFILE-EDITOR.STEPS.GENERAL-INFO.DATASET-TEMPLATE-DESCRIPTION-PLACEHOLDER'"
|
[placeholder]="'DATASET-PROFILE-EDITOR.STEPS.GENERAL-INFO.DATASET-TEMPLATE-DESCRIPTION-PLACEHOLDER'"
|
||||||
[wrapperClasses]="(form.get('description').dirty && form.get('description').hasError('required')) ? 'required' : ''">
|
[wrapperClasses]="(form.get('description').touched && form.get('description').hasError('required')) ? 'required' : ''"
|
||||||
|
[editable]="form.controls['description'].status !== 'DISABLED'">
|
||||||
</rich-text-editor-component>
|
</rich-text-editor-component>
|
||||||
<div [class]="(form.get('description').dirty && form.get('description').hasError('required')) ? 'visible' : 'invisible'" class="mat-form-field form-field-subscript-wrapper">
|
<div [class]="(form.get('description').touched && form.get('description').hasError('required')) ? 'visible' : 'invisible'" class="mat-form-field form-field-subscript-wrapper">
|
||||||
<mat-error>
|
<mat-error>
|
||||||
{{'GENERAL.VALIDATION.REQUIRED'| translate}}
|
{{'GENERAL.VALIDATION.REQUIRED'| translate}}
|
||||||
</mat-error>
|
</mat-error>
|
||||||
|
|
|
@ -195,9 +195,9 @@ export class DatasetProfileEditorComponent extends CheckDeactivateBaseComponent
|
||||||
// this.isDeleted = this.masterItem.isActive === IsActive.Inactive;
|
// this.isDeleted = this.masterItem.isActive === IsActive.Inactive;
|
||||||
this.form = this.dataModel.buildForm();
|
this.form = this.dataModel.buildForm();
|
||||||
this.form.get('version').setValue(this.form.get('version').value + 1);
|
this.form.get('version').setValue(this.form.get('version').value + 1);
|
||||||
this.form.controls['label'].disable();
|
// this.form.controls['label'].disable();
|
||||||
this.form.controls['description'].disable();
|
// this.form.controls['description'].disable();
|
||||||
this.form.controls['language'].disable();
|
// this.form.controls['language'].disable();
|
||||||
this.prepareForm();
|
this.prepareForm();
|
||||||
} catch (error){
|
} catch (error){
|
||||||
this.logger.error('Could not parse MasterItem: ' + data);
|
this.logger.error('Could not parse MasterItem: ' + data);
|
||||||
|
|
|
@ -41,7 +41,7 @@
|
||||||
<ng-container cdkColumnDef="created">
|
<ng-container cdkColumnDef="created">
|
||||||
<mat-header-cell *matHeaderCellDef mat-sort-header="created">{{'DATASET-PROFILE-LISTING.COLUMNS.CREATED' |
|
<mat-header-cell *matHeaderCellDef mat-sort-header="created">{{'DATASET-PROFILE-LISTING.COLUMNS.CREATED' |
|
||||||
translate}}</mat-header-cell>
|
translate}}</mat-header-cell>
|
||||||
<mat-cell *matCellDef="let row">{{row.created | date:'shortDate'}}</mat-cell>
|
<mat-cell *matCellDef="let row">{{row.created | date:'short'}}</mat-cell>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
|
|
||||||
<!-- Column Definition: Status -->
|
<!-- Column Definition: Status -->
|
||||||
|
|
|
@ -32,9 +32,9 @@
|
||||||
<rich-text-editor-component [parentFormGroup]="formGroup" [controlName]="'description'"
|
<rich-text-editor-component [parentFormGroup]="formGroup" [controlName]="'description'"
|
||||||
[placeholder]="'DMP-EDITOR.PLACEHOLDER.DESCRIPTION'"
|
[placeholder]="'DMP-EDITOR.PLACEHOLDER.DESCRIPTION'"
|
||||||
[wrapperClasses]="'full-width editor ' +
|
[wrapperClasses]="'full-width editor ' +
|
||||||
((formGroup.get('description').dirty && (formGroup.get('description').hasError('required') || formGroup.get('description').hasError('backendError'))) ? 'required' : '')">
|
((formGroup.get('description').touched && (formGroup.get('description').hasError('required') || formGroup.get('description').hasError('backendError'))) ? 'required' : '')">
|
||||||
</rich-text-editor-component>
|
</rich-text-editor-component>
|
||||||
<div [class]="(formGroup.get('description').dirty && (formGroup.get('description').hasError('required') || formGroup.get('description').hasError('backendError'))) ? 'visible' : 'invisible'" class="mat-form-field form-field-subscript-wrapper">
|
<div [class]="(formGroup.get('description').touched && (formGroup.get('description').hasError('required') || formGroup.get('description').hasError('backendError'))) ? 'visible' : 'invisible'" class="mat-form-field form-field-subscript-wrapper">
|
||||||
<mat-error *ngIf="formGroup.get('description').hasError('backendError')">{{formGroup.get('description').getError('backendError').message}}</mat-error>
|
<mat-error *ngIf="formGroup.get('description').hasError('backendError')">{{formGroup.get('description').getError('backendError').message}}</mat-error>
|
||||||
<mat-error *ngIf="formGroup.get('description').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
<mat-error *ngIf="formGroup.get('description').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -21,13 +21,14 @@
|
||||||
</div>
|
</div>
|
||||||
<!-- Description field -->
|
<!-- Description field -->
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-12">
|
<div class="col-12 pb-4">
|
||||||
<div class="heading">{{'DMP-EDITOR.FIELDS.DESCRIPTION' | translate}}</div>
|
<div class="heading">{{'DMP-EDITOR.FIELDS.DESCRIPTION' | translate}}</div>
|
||||||
<div class="hint">{{'DMP-EDITOR.MAIN-INFO.HINT' | translate}}</div>
|
<div class="hint">{{'DMP-EDITOR.MAIN-INFO.HINT' | translate}}</div>
|
||||||
<div class="description-form">
|
<div class="full-width basic-info-input">
|
||||||
<mat-form-field>
|
<rich-text-editor-component [parentFormGroup]="data.formGroup" [controlName]="'description'"
|
||||||
<textarea rows="3" matInput class="description-area" placeholder="{{'DMP-EDITOR.PLACEHOLDER.DESCRIPTION' | translate}}" [formControl]="this.data.formGroup.get('description')"></textarea>
|
[placeholder]="'DMP-EDITOR.PLACEHOLDER.DESCRIPTION'"
|
||||||
</mat-form-field>
|
[editable]="data.formGroup.controls['description'].status !== 'DISABLED'">
|
||||||
|
</rich-text-editor-component>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -45,7 +45,7 @@ export class CloneDialogComponent extends BaseComponent {
|
||||||
};
|
};
|
||||||
|
|
||||||
if (this.data.isNewVersion) {
|
if (this.data.isNewVersion) {
|
||||||
this.data.formGroup.get('label').disable();
|
// this.data.formGroup.get('label').disable();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -3,9 +3,10 @@ import { FormsModule, ReactiveFormsModule } from '@angular/forms';
|
||||||
import { CommonUiModule } from '@common/ui/common-ui.module';
|
import { CommonUiModule } from '@common/ui/common-ui.module';
|
||||||
import { CloneDialogComponent } from './clone-dialog.component';
|
import { CloneDialogComponent } from './clone-dialog.component';
|
||||||
import { AutoCompleteModule } from '@app/library/auto-complete/auto-complete.module';
|
import { AutoCompleteModule } from '@app/library/auto-complete/auto-complete.module';
|
||||||
|
import {RichTextEditorModule} from "@app/library/rich-text-editor/rich-text-editor.module";
|
||||||
|
|
||||||
@NgModule({
|
@NgModule({
|
||||||
imports: [CommonUiModule, FormsModule, ReactiveFormsModule, AutoCompleteModule],
|
imports: [CommonUiModule, FormsModule, ReactiveFormsModule, AutoCompleteModule, RichTextEditorModule],
|
||||||
declarations: [CloneDialogComponent],
|
declarations: [CloneDialogComponent],
|
||||||
exports: [CloneDialogComponent],
|
exports: [CloneDialogComponent],
|
||||||
entryComponents: [CloneDialogComponent]
|
entryComponents: [CloneDialogComponent]
|
||||||
|
|
|
@ -114,10 +114,12 @@
|
||||||
[placeholder]="form.get('data').value.label"
|
[placeholder]="form.get('data').value.label"
|
||||||
[required]="form.get('validationRequired').value"
|
[required]="form.get('validationRequired').value"
|
||||||
[wrapperClasses]="'full-width editor ' +
|
[wrapperClasses]="'full-width editor ' +
|
||||||
((form.get('validationRequired').value) ? 'required' : '')">
|
((form.get('validationRequired').value && form.get('value').touched && form.get('value').hasError('required')) ? 'required' : '')">
|
||||||
</rich-text-editor-component>
|
</rich-text-editor-component>
|
||||||
<div [class]="(form.get('value')['errors'] && form.get('value').hasError('required')) ? 'visible' : 'invisible'" class="mat-form-field form-field-subscript-wrapper">
|
<div [class]="(form.get('value')['errors'] && form.get('value').hasError('required') && form.get('value').touched) ? 'visible' : 'invisible'" class="col-12">
|
||||||
<mat-error *ngIf="form.get('value')['errors'] && form.get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
<div class="mat-form-field form-field-subscript-wrapper">
|
||||||
|
<mat-error *ngIf="form.get('value')['errors'] && form.get('value').hasError('required') && form.get('value').touched">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
|
|
||||||
|
|
|
@ -255,8 +255,9 @@
|
||||||
|
|
||||||
// CSS for <angular-editor> (@kolkov/angular-editor)
|
// CSS for <angular-editor> (@kolkov/angular-editor)
|
||||||
.form-field-subscript-wrapper {
|
.form-field-subscript-wrapper {
|
||||||
font-size: 75%;
|
font-size: 75% !important;
|
||||||
padding-left: 12px;
|
//padding-left: 12px;
|
||||||
|
padding: 0 1em;
|
||||||
margin-top: 8px;
|
margin-top: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue