File
Index
Properties
|
|
Methods
|
|
Outputs
|
|
Constructor
constructor(fb: FormBuilder, modalRef: BsModalRef)
|
Parameters :
Name |
Type |
Optional |
fb |
FormBuilder
|
No
|
modalRef |
BsModalRef
|
No
|
|
Outputs
onAddCustomColumn
|
Type : EventEmitter<CustomColumnConfig>
|
Methods
comparator
|
comparator(val1, val2)
|
Parameters :
Name |
Optional |
val1 |
No
|
val2 |
No
|
|
form
|
Type : NgForm
|
Decorators :
@ViewChild('columnConfigForm', {static: false})
|
formGroup
|
Type : FormGroup
|
Default value : this.fb.group({
header: [''],
path: [''],
addAnother: [false]
})
|
Public
modalRef
|
Type : BsModalRef
|
Readonly
SIMPLE_JSON_PATH_REGEX
|
Default value : /^[^.\s]+(\.\S+)*$/
|
<div class="viewport-modal">
<div class="modal-header separator-bottom">
<h3 translate>Configure custom column</h3>
</div>
<form class="d-contents" #columnConfigForm="ngForm" [formGroup]="formGroup">
<div class="modal-inner-scroll">
<div class="modal-body">
<c8y-form-group>
<label for="header" translate>Header</label>
<input
id="header"
formControlName="header"
class="form-control"
autocomplete="off"
[placeholder]="'e.g. Agent name' | translate"
[required]="true"
uniqueByPath
[collection]="columns"
path="header"
[comparator]="comparator"
/>
<c8y-messages>
<c8y-message
name="uniqueByPath"
[text]="'Column\'s header name must be unique' | translate"
></c8y-message>
</c8y-messages>
</c8y-form-group>
<c8y-form-group>
<label for="fragmentPath" translate>Fragment path</label>
<input
id="fragmentPath"
formControlName="path"
class="form-control"
autocomplete="off"
[placeholder]="'e.g. {{ example }}' | translate: { example: 'c8y_Agent.name' }"
[required]="true"
[pattern]="SIMPLE_JSON_PATH_REGEX"
/>
<c8y-messages>
<c8y-message
name="pattern"
[text]="'Must be a valid JSON path' | translate"
></c8y-message>
</c8y-messages>
</c8y-form-group>
<label class="c8y-switch" [title]="'Add another column after saving this one' | translate">
<input type="checkbox" formControlName="addAnother" class="form-control" />
<span></span>
<span translate>Add another column after saving this one</span>
</label>
</div>
</div>
<div class="modal-footer">
<button title="{{ 'Cancel' | translate }}" class="btn btn-default" (click)="modalRef.hide()">
{{ 'Cancel' | translate }}
</button>
<button
title="{{ 'Save' | translate }}"
class="btn btn-primary"
[disabled]="columnConfigForm.form.pristine || !columnConfigForm.form.valid"
(click)="addColumn()"
>
{{ 'Save' | translate }}
</button>
</div>
</form>
</div>