@shikshalokam/sl-questionnaire
Version:
Library to integrate questionnaire in SL Projects
64 lines • 14 kB
JavaScript
import { Output } from '@angular/core';
import { Input } from '@angular/core';
import { Component, EventEmitter } from '@angular/core';
import { UntypedFormControl } from '@angular/forms';
import * as i0 from "@angular/core";
import * as i1 from "../services/sl-questionnaire.service";
import * as i2 from "../services/translate.service";
import * as i3 from "@angular/common";
import * as i4 from "@angular/forms";
import * as i5 from "../shared/alert-modal/alert-modal.component";
export class RadioInputComponent {
constructor(qService, translate) {
this.qService = qService;
this.translate = translate;
this.dependentParent = new EventEmitter();
}
ngOnInit() {
this.hintCloseText = this.translate['frmelmnts'].btn?.close;
this.hintModalNote = this.translate['frmelmnts'].lbl?.hintModalNote;
setTimeout(() => {
this.questionnaireForm.addControl(this.question._id, new UntypedFormControl(this.question.value || null, this.qService.validate(this.question)));
this.question.startTime = this.question.startTime
? this.question.startTime
: Date.now();
if (this.question.value) {
if (this.question.children.length) {
this.dependentParent.emit(this.question);
}
}
});
}
get isValid() {
return this.questionnaireForm.controls[this.question._id].valid;
}
get isTouched() {
return this.questionnaireForm.controls[this.question._id].touched;
}
onChange(value) {
this.questionnaireForm.controls[this.question._id].setValue(value);
this.question.value = value;
this.question.endTime = Date.now();
if (this.question.children.length) {
this.dependentParent.emit(this.question);
}
}
closeHint() {
this.isDimmed = false;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RadioInputComponent, deps: [{ token: i1.SlQuestionnaireService }, { token: i2.SlTranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: RadioInputComponent, selector: "sl-radio-input", inputs: { options: "options", questionnaireForm: "questionnaireForm", question: "question" }, outputs: { dependentParent: "dependentParent" }, ngImport: i0, template: "<div *ngIf=\"questionnaireForm?.contains(question._id)\">\n <div\n *ngFor=\"let o of options; let optionIndex = index\"\n [formGroup]=\"questionnaireForm\"\n class=\"\n mb-15\n sb-radio-btn-checkbox sb-radio-btn-primary\n d-flex\n flex-ai-baseline\n \"\n >\n <input\n type=\"radio\"\n (change)=\"onChange(o.value)\"\n [name]=\"question._id\"\n [ngClass]=\"isValid && isTouched ? 'is-invalid' : 'is-valid'\"\n [value]=\"o.value\"\n [formControlName]=\"question._id\"\n id=\"{{question._id + o.value}}\"\n />\n <label for=\"{{question._id + o.value}}\">{{ o.label }}</label>\n <div *ngIf=\"options && options[optionIndex]?.hint\">\n <i\n class=\"icon large lightbulb\"\n (click)=\"\n isDimmed = !isDimmed; hint = options[optionIndex]?.hint\n \"\n ></i>\n </div>\n </div>\n</div>\n\n<sl-alert-modal [isDimmed]=\"isDimmed\" (closeHintEmitter)=\"closeHint()\" [hint]=\"hint\"></sl-alert-modal>\n\n", styles: [""], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i5.AlertModalComponent, selector: "sl-alert-modal", inputs: ["isDimmed", "hint"], outputs: ["closeHintEmitter"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RadioInputComponent, decorators: [{
type: Component,
args: [{ selector: 'sl-radio-input', template: "<div *ngIf=\"questionnaireForm?.contains(question._id)\">\n <div\n *ngFor=\"let o of options; let optionIndex = index\"\n [formGroup]=\"questionnaireForm\"\n class=\"\n mb-15\n sb-radio-btn-checkbox sb-radio-btn-primary\n d-flex\n flex-ai-baseline\n \"\n >\n <input\n type=\"radio\"\n (change)=\"onChange(o.value)\"\n [name]=\"question._id\"\n [ngClass]=\"isValid && isTouched ? 'is-invalid' : 'is-valid'\"\n [value]=\"o.value\"\n [formControlName]=\"question._id\"\n id=\"{{question._id + o.value}}\"\n />\n <label for=\"{{question._id + o.value}}\">{{ o.label }}</label>\n <div *ngIf=\"options && options[optionIndex]?.hint\">\n <i\n class=\"icon large lightbulb\"\n (click)=\"\n isDimmed = !isDimmed; hint = options[optionIndex]?.hint\n \"\n ></i>\n </div>\n </div>\n</div>\n\n<sl-alert-modal [isDimmed]=\"isDimmed\" (closeHintEmitter)=\"closeHint()\" [hint]=\"hint\"></sl-alert-modal>\n\n" }]
}], ctorParameters: function () { return [{ type: i1.SlQuestionnaireService }, { type: i2.SlTranslateService }]; }, propDecorators: { options: [{
type: Input
}], questionnaireForm: [{
type: Input
}], question: [{
type: Input
}], dependentParent: [{
type: Output
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicmFkaW8taW5wdXQuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvc2wtcXVlc3Rpb25uYWlyZS9zcmMvbGliL3JhZGlvLWlucHV0L3JhZGlvLWlucHV0LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3NsLXF1ZXN0aW9ubmFpcmUvc3JjL2xpYi9yYWRpby1pbnB1dC9yYWRpby1pbnB1dC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsTUFBTSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ3ZDLE9BQU8sRUFBRSxLQUFLLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDdEMsT0FBTyxFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQVUsTUFBTSxlQUFlLENBQUM7QUFDaEUsT0FBTyxFQUFvQixrQkFBa0IsRUFBRSxNQUFNLGdCQUFnQixDQUFDOzs7Ozs7O0FBVXRFLE1BQU0sT0FBTyxtQkFBbUI7SUFVOUIsWUFDUyxRQUFnQyxFQUNoQyxTQUE2QjtRQUQ3QixhQUFRLEdBQVIsUUFBUSxDQUF3QjtRQUNoQyxjQUFTLEdBQVQsU0FBUyxDQUFvQjtRQU41QixvQkFBZSxHQUFHLElBQUksWUFBWSxFQUFZLENBQUM7SUFPdEQsQ0FBQztJQUVKLFFBQVE7UUFDTixJQUFJLENBQUMsYUFBYSxHQUFHLElBQUksQ0FBQyxTQUFTLENBQUMsV0FBVyxDQUFDLENBQUMsR0FBRyxFQUFFLEtBQUssQ0FBQztRQUM1RCxJQUFJLENBQUMsYUFBYSxHQUFHLElBQUksQ0FBQyxTQUFTLENBQUMsV0FBVyxDQUFDLENBQUMsR0FBRyxFQUFFLGFBQWEsQ0FBQztRQUNwRSxVQUFVLENBQUMsR0FBRyxFQUFFO1lBQ2QsSUFBSSxDQUFDLGlCQUFpQixDQUFDLFVBQVUsQ0FDL0IsSUFBSSxDQUFDLFFBQVEsQ0FBQyxHQUFHLEVBQ2pCLElBQUksa0JBQWtCLENBQ3BCLElBQUksQ0FBQyxRQUFRLENBQUMsS0FBSyxJQUFJLElBQUksRUFDM0IsSUFBSSxDQUFDLFFBQVEsQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxDQUN0QyxDQUNGLENBQUM7WUFFRixJQUFJLENBQUMsUUFBUSxDQUFDLFNBQVMsR0FBRyxJQUFJLENBQUMsUUFBUSxDQUFDLFNBQVM7Z0JBQy9DLENBQUMsQ0FBQyxJQUFJLENBQUMsUUFBUSxDQUFDLFNBQVM7Z0JBQ3pCLENBQUMsQ0FBQyxJQUFJLENBQUMsR0FBRyxFQUFFLENBQUM7WUFDZixJQUFJLElBQUksQ0FBQyxRQUFRLENBQUMsS0FBSyxFQUFFO2dCQUN2QixJQUFJLElBQUksQ0FBQyxRQUFRLENBQUMsUUFBUSxDQUFDLE1BQU0sRUFBRTtvQkFDakMsSUFBSSxDQUFDLGVBQWUsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxDQUFDO2lCQUMxQzthQUNGO1FBQ0gsQ0FBQyxDQUFDLENBQUM7SUFDTCxDQUFDO0lBRUQsSUFBSSxPQUFPO1FBQ1QsT0FBTyxJQUFJLENBQUMsaUJBQWlCLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsR0FBRyxDQUFDLENBQUMsS0FBSyxDQUFDO0lBQ2xFLENBQUM7SUFFRCxJQUFJLFNBQVM7UUFDWCxPQUFPLElBQUksQ0FBQyxpQkFBaUIsQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxHQUFHLENBQUMsQ0FBQyxPQUFPLENBQUM7SUFDcEUsQ0FBQztJQUVELFFBQVEsQ0FBQyxLQUFLO1FBQ1osSUFBSSxDQUFDLGlCQUFpQixDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsUUFBUSxDQUFDLEdBQUcsQ0FBQyxDQUFDLFFBQVEsQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUNuRSxJQUFJLENBQUMsUUFBUSxDQUFDLEtBQUssR0FBRyxLQUFLLENBQUM7UUFDNUIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDLEdBQUcsRUFBRSxDQUFDO1FBQ25DLElBQUksSUFBSSxDQUFDLFFBQVEsQ0FBQyxRQUFRLENBQUMsTUFBTSxFQUFFO1lBQ2pDLElBQUksQ0FBQyxlQUFlLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQztTQUMxQztJQUNILENBQUM7SUFFRCxTQUFTO1FBQ1AsSUFBSSxDQUFDLFFBQVEsR0FBRyxLQUFLLENBQUM7SUFDeEIsQ0FBQzsrR0F6RFUsbUJBQW1CO21HQUFuQixtQkFBbUIscU1DYmhDLDIvQkFrQ0E7OzRGRHJCYSxtQkFBbUI7a0JBTC9CLFNBQVM7K0JBQ0UsZ0JBQWdCOzhJQUtqQixPQUFPO3NCQUFmLEtBQUs7Z0JBQ0csaUJBQWlCO3NCQUF6QixLQUFLO2dCQUNHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBR0ksZUFBZTtzQkFBeEIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IE91dHB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgSW5wdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBPbkluaXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFVudHlwZWRGb3JtR3JvdXAsIFVudHlwZWRGb3JtQ29udHJvbCB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcbmltcG9ydCB7IFF1ZXN0aW9uIH0gZnJvbSAnLi4vaW50ZXJmYWNlcy9xdWVzdGlvbm5haXJlLnR5cGUnO1xuaW1wb3J0IHsgU2xUcmFuc2xhdGVTZXJ2aWNlIH0gZnJvbSAnLi4vc2VydmljZXMvdHJhbnNsYXRlLnNlcnZpY2UnO1xuaW1wb3J0IHsgU2xRdWVzdGlvbm5haXJlU2VydmljZSB9IGZyb20gJy4uL3NlcnZpY2VzL3NsLXF1ZXN0aW9ubmFpcmUuc2VydmljZSc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3NsLXJhZGlvLWlucHV0JyxcbiAgdGVtcGxhdGVVcmw6ICcuL3JhZGlvLWlucHV0LmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vcmFkaW8taW5wdXQuY29tcG9uZW50LnNjc3MnXSxcbn0pXG5leHBvcnQgY2xhc3MgUmFkaW9JbnB1dENvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCB7XG4gIEBJbnB1dCgpIG9wdGlvbnM6IGFueTtcbiAgQElucHV0KCkgcXVlc3Rpb25uYWlyZUZvcm06IFVudHlwZWRGb3JtR3JvdXA7XG4gIEBJbnB1dCgpIHF1ZXN0aW9uOiBRdWVzdGlvbjtcbiAgaGludENsb3NlVGV4dDogc3RyaW5nO1xuICBoaW50TW9kYWxOb3RlOnN0cmluZztcbiAgQE91dHB1dCgpIGRlcGVuZGVudFBhcmVudCA9IG5ldyBFdmVudEVtaXR0ZXI8UXVlc3Rpb24+KCk7XG4gIGlzRGltbWVkOiBhbnk7XG4gIGhpbnQ6IGFueTtcblxuICBjb25zdHJ1Y3RvcihcbiAgICBwdWJsaWMgcVNlcnZpY2U6IFNsUXVlc3Rpb25uYWlyZVNlcnZpY2UsXG4gICAgcHVibGljIHRyYW5zbGF0ZTogU2xUcmFuc2xhdGVTZXJ2aWNlXG4gICkge31cblxuICBuZ09uSW5pdCgpIHtcbiAgICB0aGlzLmhpbnRDbG9zZVRleHQgPSB0aGlzLnRyYW5zbGF0ZVsnZnJtZWxtbnRzJ10uYnRuPy5jbG9zZTtcbiAgICB0aGlzLmhpbnRNb2RhbE5vdGUgPSB0aGlzLnRyYW5zbGF0ZVsnZnJtZWxtbnRzJ10ubGJsPy5oaW50TW9kYWxOb3RlO1xuICAgIHNldFRpbWVvdXQoKCkgPT4ge1xuICAgICAgdGhpcy5xdWVzdGlvbm5haXJlRm9ybS5hZGRDb250cm9sKFxuICAgICAgICB0aGlzLnF1ZXN0aW9uLl9pZCxcbiAgICAgICAgbmV3IFVudHlwZWRGb3JtQ29udHJvbChcbiAgICAgICAgICB0aGlzLnF1ZXN0aW9uLnZhbHVlIHx8IG51bGwsXG4gICAgICAgICAgdGhpcy5xU2VydmljZS52YWxpZGF0ZSh0aGlzLnF1ZXN0aW9uKVxuICAgICAgICApXG4gICAgICApO1xuXG4gICAgICB0aGlzLnF1ZXN0aW9uLnN0YXJ0VGltZSA9IHRoaXMucXVlc3Rpb24uc3RhcnRUaW1lXG4gICAgICAgID8gdGhpcy5xdWVzdGlvbi5zdGFydFRpbWVcbiAgICAgICAgOiBEYXRlLm5vdygpO1xuICAgICAgaWYgKHRoaXMucXVlc3Rpb24udmFsdWUpIHtcbiAgICAgICAgaWYgKHRoaXMucXVlc3Rpb24uY2hpbGRyZW4ubGVuZ3RoKSB7XG4gICAgICAgICAgdGhpcy5kZXBlbmRlbnRQYXJlbnQuZW1pdCh0aGlzLnF1ZXN0aW9uKTtcbiAgICAgICAgfVxuICAgICAgfVxuICAgIH0pO1xuICB9XG5cbiAgZ2V0IGlzVmFsaWQoKTogYm9vbGVhbiB7XG4gICAgcmV0dXJuIHRoaXMucXVlc3Rpb25uYWlyZUZvcm0uY29udHJvbHNbdGhpcy5xdWVzdGlvbi5faWRdLnZhbGlkO1xuICB9XG5cbiAgZ2V0IGlzVG91Y2hlZCgpOiBib29sZWFuIHtcbiAgICByZXR1cm4gdGhpcy5xdWVzdGlvbm5haXJlRm9ybS5jb250cm9sc1t0aGlzLnF1ZXN0aW9uLl9pZF0udG91Y2hlZDtcbiAgfVxuXG4gIG9uQ2hhbmdlKHZhbHVlKSB7XG4gICAgdGhpcy5xdWVzdGlvbm5haXJlRm9ybS5jb250cm9sc1t0aGlzLnF1ZXN0aW9uLl9pZF0uc2V0VmFsdWUodmFsdWUpO1xuICAgIHRoaXMucXVlc3Rpb24udmFsdWUgPSB2YWx1ZTtcbiAgICB0aGlzLnF1ZXN0aW9uLmVuZFRpbWUgPSBEYXRlLm5vdygpO1xuICAgIGlmICh0aGlzLnF1ZXN0aW9uLmNoaWxkcmVuLmxlbmd0aCkge1xuICAgICAgdGhpcy5kZXBlbmRlbnRQYXJlbnQuZW1pdCh0aGlzLnF1ZXN0aW9uKTtcbiAgICB9XG4gIH1cblxuICBjbG9zZUhpbnQoKXtcbiAgICB0aGlzLmlzRGltbWVkID0gZmFsc2U7XG4gIH1cbn1cbiIsIjxkaXYgKm5nSWY9XCJxdWVzdGlvbm5haXJlRm9ybT8uY29udGFpbnMocXVlc3Rpb24uX2lkKVwiPlxuICA8ZGl2XG4gICAgKm5nRm9yPVwibGV0IG8gb2Ygb3B0aW9uczsgbGV0IG9wdGlvbkluZGV4ID0gaW5kZXhcIlxuICAgIFtmb3JtR3JvdXBdPVwicXVlc3Rpb25uYWlyZUZvcm1cIlxuICAgIGNsYXNzPVwiXG4gICAgICBtYi0xNVxuICAgICAgc2ItcmFkaW8tYnRuLWNoZWNrYm94IHNiLXJhZGlvLWJ0bi1wcmltYXJ5XG4gICAgICBkLWZsZXhcbiAgICAgIGZsZXgtYWktYmFzZWxpbmVcbiAgICBcIlxuICA+XG4gICAgPGlucHV0XG4gICAgICB0eXBlPVwicmFkaW9cIlxuICAgICAgKGNoYW5nZSk9XCJvbkNoYW5nZShvLnZhbHVlKVwiXG4gICAgICBbbmFtZV09XCJxdWVzdGlvbi5faWRcIlxuICAgICAgW25nQ2xhc3NdPVwiaXNWYWxpZCAmJiBpc1RvdWNoZWQgPyAnaXMtaW52YWxpZCcgOiAnaXMtdmFsaWQnXCJcbiAgICAgIFt2YWx1ZV09XCJvLnZhbHVlXCJcbiAgICAgIFtmb3JtQ29udHJvbE5hbWVdPVwicXVlc3Rpb24uX2lkXCJcbiAgICAgIGlkPVwie3txdWVzdGlvbi5faWQgKyBvLnZhbHVlfX1cIlxuICAgIC8+XG4gICAgPGxhYmVsIGZvcj1cInt7cXVlc3Rpb24uX2lkICsgby52YWx1ZX19XCI+e3sgby5sYWJlbCB9fTwvbGFiZWw+XG4gICAgPGRpdiAqbmdJZj1cIm9wdGlvbnMgJiYgb3B0aW9uc1tvcHRpb25JbmRleF0/LmhpbnRcIj5cbiAgICAgIDxpXG4gICAgICAgIGNsYXNzPVwiaWNvbiBsYXJnZSBsaWdodGJ1bGJcIlxuICAgICAgICAoY2xpY2spPVwiXG4gICAgICAgICAgaXNEaW1tZWQgPSAhaXNEaW1tZWQ7IGhpbnQgPSBvcHRpb25zW29wdGlvbkluZGV4XT8uaGludFxuICAgICAgICBcIlxuICAgICAgPjwvaT5cbiAgICA8L2Rpdj5cbiAgPC9kaXY+XG48L2Rpdj5cblxuPHNsLWFsZXJ0LW1vZGFsIFtpc0RpbW1lZF09XCJpc0RpbW1lZFwiIChjbG9zZUhpbnRFbWl0dGVyKT1cImNsb3NlSGludCgpXCIgW2hpbnRdPVwiaGludFwiPjwvc2wtYWxlcnQtbW9kYWw+XG5cbiJdfQ==