openaire-library/dashboard/plugins/utils/plugin-field-edit.component.ts

57 lines
2.7 KiB
TypeScript

import {Component, EventEmitter, Input, Output} from '@angular/core';
import {PluginEditEvent} from "./base-plugin.form.component";
@Component({
selector: 'plugin-field-edit',
template: `
<ng-container *ngIf="type=='boolean'">
<mat-slide-toggle [checked]="value" (change)="updateObject($event.checked)"></mat-slide-toggle>
</ng-container>
<ng-container *ngIf="type!='boolean'">
<!-- <a *ngIf="!editingModeOn" class="uk-float-right" (click)=" editClicked.emit({field: field, type: type}); editingModeOn = true ">Edit</a>-->
<ng-container *ngIf="editingModeOn">
<!-- <a *ngIf="editingModeOn" class="uk-float-right" (click)="editClicked.emit(null); editingModeOn = false ">close</a>-->
<!-- <br>-->
<!--<input id="checkAll" type="checkbox" (click)="selectAll()" class="uk-checkbox"
[ngModel]="getSelectedPages().length ==checkboxes.length"/>-->
<input *ngIf="type == 'checkbox'" [(ngModel)]="value" [checked]="value" (ngModelChange)="updateObject($event)" type="checkbox" class="uk-checkbox">
<div *ngIf="type == 'text'" input [value]="value" [placeholder]="placeholder?placeholder:field.toUpperCase()" type="text" (valueChange)="updateObject($event)" inputClass=" border-bottom "></div>
<!--<div *ngIf="type == 'URL'" input [value]="value" [placeholder]="name" type="URL" ></div>
<div *ngIf="type == 'HTML'" class="uk-width-1-1">
<ckeditor [readonly]="false"
debounce="500"
[formControl]="value"
[config]="{ extraAllowedContent: '* [uk-*](*) ; span', disallowedContent: 'script; *[on*]',
removeButtons: 'Save,NewPage,DocProps,Preview,Print,' +
'Form,Checkbox,Radio,TextField,Textarea,Select,Button,ImageButton,HiddenField,' +
'CreateDiv,Flash,PageBreak,' +
'Subscript,Superscript,Anchor,Smiley,Iframe,Styles,Font,About,Language',
extraPlugins: 'divarea'}">
</ckeditor>
</div>-->
</ng-container>
</ng-container>
`,
})
export class PluginFieldEditComponent {
@Input() type;
@Input() value;
@Input() field;
@Input() placeholder;
@Output() editClicked:EventEmitter<PluginEditEvent> = new EventEmitter<PluginEditEvent>();
@Output() changed:EventEmitter<PluginEditEvent> = new EventEmitter()
editingModeOn: boolean = true;
updateObject(value){
console.log(value)
this.value = value;
this.changed.emit({field:this.field, value: this.value, type: this.type});
}
}