@openmrs/ngx-formentry 5.0.1-pre.421 → 5.0.1-pre.426
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -49,7 +49,8 @@ export class PatientIdentifierAdapter {
|
|
|
49
49
|
}
|
|
50
50
|
getPatientIdentifierTypeNodes(rootNode, array) {
|
|
51
51
|
if (rootNode.question.extras &&
|
|
52
|
-
rootNode.question.extras.type === 'patientIdentifier'
|
|
52
|
+
rootNode.question.extras.type === 'patientIdentifier' &&
|
|
53
|
+
rootNode.control.hidden === false) {
|
|
53
54
|
array.push(rootNode);
|
|
54
55
|
}
|
|
55
56
|
if (rootNode instanceof GroupNode) {
|
|
@@ -73,4 +74,4 @@ export class PatientIdentifierAdapter {
|
|
|
73
74
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PatientIdentifierAdapter, decorators: [{
|
|
74
75
|
type: Injectable
|
|
75
76
|
}] });
|
|
76
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
77
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGF0aWVudC1pZGVudGlmaWVyLmFkYXB0ZXIuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtZm9ybWVudHJ5L3NyYy9mb3JtLWVudHJ5L3ZhbHVlLWFkYXB0ZXJzL3BhdGllbnQtaWRlbnRpZmllci5hZGFwdGVyLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxVQUFVLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFFM0MsT0FBTyxFQUFFLFFBQVEsRUFBRSxTQUFTLEVBQUUsU0FBUyxFQUFFLE1BQU0sMkJBQTJCLENBQUM7O0FBSTNFLE1BQU0sT0FBTyx3QkFBd0I7SUFDbkMsbUJBQW1CLENBQUMsSUFBVSxFQUFFLFlBQW9CO1FBQ2xELE9BQU8sSUFBSSxDQUFDLG1CQUFtQixDQUFDLElBQUksQ0FBQyxRQUFRLEVBQUUsWUFBWSxDQUFDLENBQUM7SUFDL0QsQ0FBQztJQUVELG1CQUFtQixDQUFDLFFBQWtCLEVBQUUsWUFBb0I7UUFDMUQsTUFBTSxLQUFLLEdBQUcsSUFBSSxDQUFDLHlCQUF5QixDQUFDLFFBQVEsQ0FBQyxDQUFDO1FBQ3ZELE1BQU0sT0FBTyxHQUFHLEVBQUUsQ0FBQztRQUNuQixLQUFLLENBQUMsT0FBTyxDQUFDLENBQUMsSUFBSSxFQUFFLEVBQUU7WUFDckIsSUFDRSxJQUFJLENBQUMsT0FBTyxDQUFDLEtBQUssS0FBSyxJQUFJO2dCQUMzQixJQUFJLENBQUMsT0FBTyxDQUFDLEtBQUssS0FBSyxTQUFTO2dCQUNoQyxJQUFJLENBQUMsT0FBTyxDQUFDLEtBQUssS0FBSyxFQUFFLEVBQ3pCO2dCQUNBLE9BQU8sQ0FBQyxJQUFJLENBQUM7b0JBQ1gsY0FBYyxFQUFFLElBQUksQ0FBQyxRQUFRLENBQUMsTUFBTSxDQUFDLGVBQWUsQ0FBQyxjQUFjO29CQUNuRSxVQUFVLEVBQUUsSUFBSSxDQUFDLE9BQU8sQ0FBQyxLQUFLO29CQUM5QixRQUFRLEVBQUUsWUFBWTtvQkFDdEIsU0FBUyxFQUFFLEtBQUs7aUJBQ2pCLENBQUMsQ0FBQzthQUNKO1FBQ0gsQ0FBQyxDQUFDLENBQUM7UUFDSCxPQUFPLE9BQU8sQ0FBQztJQUNqQixDQUFDO0lBRUQsWUFBWSxDQUFDLElBQVUsRUFBRSxPQUFPO1FBQzlCLElBQUksQ0FBQyxZQUFZLENBQUMsSUFBSSxDQUFDLFFBQVEsRUFBRSxPQUFPLENBQUMsQ0FBQztJQUM1QyxDQUFDO0lBRUQsWUFBWSxDQUFDLFFBQWtCLEVBQUUsT0FBTztRQUN0QyxJQUFJLENBQUMsS0FBSyxDQUFDLE9BQU8sQ0FBQyxPQUFPLENBQUMsRUFBRTtZQUMzQixNQUFNLElBQUksS0FBSyxDQUFDLHlDQUF5QyxDQUFDLENBQUM7U0FDNUQ7UUFFRCxNQUFNLEtBQUssR0FBRyxJQUFJLENBQUMseUJBQXlCLENBQUMsUUFBUSxDQUFDLENBQUM7UUFFdkQsS0FBSyxDQUFDLE9BQU8sQ0FBQyxDQUFDLElBQUksRUFBRSxFQUFFO1lBQ3JCLE9BQU8sQ0FBQyxPQUFPLENBQUMsQ0FBQyxPQUFPLEVBQUUsRUFBRTtnQkFDMUIsSUFDRSxPQUFPLENBQUMsY0FBYyxDQUFDLElBQUk7b0JBQzNCLElBQUksQ0FBQyxRQUFRLENBQUMsTUFBTSxDQUFDLGVBQWUsQ0FBQyxjQUFjLEVBQ25EO29CQUNBLElBQUksT0FBTyxDQUFDLFVBQVUsRUFBRTt3QkFDdEIsSUFBSSxDQUFDLE9BQU8sQ0FBQyxRQUFRLENBQUMsT0FBTyxDQUFDLFVBQVUsQ0FBQyxDQUFDO3dCQUMxQyxJQUFJLENBQUMsWUFBWSxHQUFHLE9BQU8sQ0FBQyxVQUFVLENBQUM7cUJBQ3hDO2lCQUNGO1lBQ0gsQ0FBQyxDQUFDLENBQUM7UUFDTCxDQUFDLENBQUMsQ0FBQztJQUNMLENBQUM7SUFFRCx5QkFBeUIsQ0FBQyxRQUFrQjtRQUMxQyxNQUFNLE9BQU8sR0FBb0IsRUFBRSxDQUFDO1FBQ3BDLElBQUksQ0FBQyw2QkFBNkIsQ0FBQyxRQUFRLEVBQUUsT0FBTyxDQUFDLENBQUM7UUFDdEQsT0FBTyxPQUFPLENBQUM7SUFDakIsQ0FBQztJQUVPLDZCQUE2QixDQUNuQyxRQUFrQixFQUNsQixLQUFzQjtRQUV0QixJQUNFLFFBQVEsQ0FBQyxRQUFRLENBQUMsTUFBTTtZQUN4QixRQUFRLENBQUMsUUFBUSxDQUFDLE1BQU0sQ0FBQyxJQUFJLEtBQUssbUJBQW1CO1lBQ3JELFFBQVEsQ0FBQyxPQUFPLENBQUMsTUFBTSxLQUFLLEtBQUssRUFDakM7WUFDQSxLQUFLLENBQUMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxDQUFDO1NBQ3RCO1FBRUQsSUFBSSxRQUFRLFlBQVksU0FBUyxFQUFFO1lBQ2pDLE1BQU0sSUFBSSxHQUFHLFFBQXFCLENBQUM7WUFDbkMsS0FBSyxNQUFNLENBQUMsSUFBSSxJQUFJLENBQUMsUUFBUSxFQUFFO2dCQUM3QixJQUFJLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDLFlBQVksUUFBUSxFQUFFO29CQUN4QyxJQUFJLENBQUMsNkJBQTZCLENBQUMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUMsRUFBRSxLQUFLLENBQUMsQ0FBQztpQkFDN0Q7YUFDRjtTQUNGO1FBRUQsSUFBSSxRQUFRLFlBQVksU0FBUyxFQUFFO1lBQ2pDLE1BQU0sSUFBSSxHQUFHLFFBQXFCLENBQUM7WUFDbkMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxPQUFPLENBQUMsQ0FBQyxLQUFLLEVBQUUsRUFBRTtnQkFDOUIsSUFBSSxDQUFDLDZCQUE2QixDQUFDLEtBQUssRUFBRSxLQUFLLENBQUMsQ0FBQztZQUNuRCxDQUFDLENBQUMsQ0FBQztTQUNKO0lBQ0gsQ0FBQzsrR0FwRlUsd0JBQXdCO21IQUF4Qix3QkFBd0I7OzRGQUF4Qix3QkFBd0I7a0JBRHBDLFVBQVUiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBJbmplY3RhYmxlIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmltcG9ydCB7IE5vZGVCYXNlLCBHcm91cE5vZGUsIEFycmF5Tm9kZSB9IGZyb20gJy4uL2Zvcm0tZmFjdG9yeS9mb3JtLW5vZGUnO1xuaW1wb3J0IHsgRm9ybSB9IGZyb20gJy4uL2Zvcm0tZmFjdG9yeSc7XG5cbkBJbmplY3RhYmxlKClcbmV4cG9ydCBjbGFzcyBQYXRpZW50SWRlbnRpZmllckFkYXB0ZXIge1xuICBnZW5lcmF0ZUZvcm1QYXlsb2FkKGZvcm06IEZvcm0sIGxvY2F0aW9uVXVpZDogc3RyaW5nKSB7XG4gICAgcmV0dXJuIHRoaXMuZ2VuZXJhdGVOb2RlUGF5bG9hZChmb3JtLnJvb3ROb2RlLCBsb2NhdGlvblV1aWQpO1xuICB9XG5cbiAgZ2VuZXJhdGVOb2RlUGF5bG9hZChyb290Tm9kZTogTm9kZUJhc2UsIGxvY2F0aW9uVXVpZDogc3RyaW5nKSB7XG4gICAgY29uc3Qgbm9kZXMgPSB0aGlzLmdldFBhdGllbnRJZGVudGlmaWVyTm9kZXMocm9vdE5vZGUpO1xuICAgIGNvbnN0IHBheWxvYWQgPSBbXTtcbiAgICBub2Rlcy5mb3JFYWNoKChub2RlKSA9PiB7XG4gICAgICBpZiAoXG4gICAgICAgIG5vZGUuY29udHJvbC52YWx1ZSAhPT0gbnVsbCAmJlxuICAgICAgICBub2RlLmNvbnRyb2wudmFsdWUgIT09IHVuZGVmaW5lZCAmJlxuICAgICAgICBub2RlLmNvbnRyb2wudmFsdWUgIT09ICcnXG4gICAgICApIHtcbiAgICAgICAgcGF5bG9hZC5wdXNoKHtcbiAgICAgICAgICBpZGVudGlmaWVyVHlwZTogbm9kZS5xdWVzdGlvbi5leHRyYXMucXVlc3Rpb25PcHRpb25zLmlkZW50aWZpZXJUeXBlLFxuICAgICAgICAgIGlkZW50aWZpZXI6IG5vZGUuY29udHJvbC52YWx1ZSxcbiAgICAgICAgICBsb2NhdGlvbjogbG9jYXRpb25VdWlkLFxuICAgICAgICAgIHByZWZlcnJlZDogZmFsc2VcbiAgICAgICAgfSk7XG4gICAgICB9XG4gICAgfSk7XG4gICAgcmV0dXJuIHBheWxvYWQ7XG4gIH1cblxuICBwb3B1bGF0ZUZvcm0oZm9ybTogRm9ybSwgcGF5bG9hZCkge1xuICAgIHRoaXMucG9wdWxhdGVOb2RlKGZvcm0ucm9vdE5vZGUsIHBheWxvYWQpO1xuICB9XG5cbiAgcG9wdWxhdGVOb2RlKHJvb3ROb2RlOiBOb2RlQmFzZSwgcGF5bG9hZCkge1xuICAgIGlmICghQXJyYXkuaXNBcnJheShwYXlsb2FkKSkge1xuICAgICAgdGhyb3cgbmV3IEVycm9yKCdFeHBlY3RlZCBhbiBhcnJheSBvZiBwYXRpZW50IGlkZW50ZmllcnMnKTtcbiAgICB9XG5cbiAgICBjb25zdCBub2RlcyA9IHRoaXMuZ2V0UGF0aWVudElkZW50aWZpZXJOb2Rlcyhyb290Tm9kZSk7XG5cbiAgICBub2Rlcy5mb3JFYWNoKChub2RlKSA9PiB7XG4gICAgICBwYXlsb2FkLmZvckVhY2goKGVsZW1lbnQpID0+IHtcbiAgICAgICAgaWYgKFxuICAgICAgICAgIGVsZW1lbnQuaWRlbnRpZmllclR5cGUudXVpZCA9PT1cbiAgICAgICAgICBub2RlLnF1ZXN0aW9uLmV4dHJhcy5xdWVzdGlvbk9wdGlvbnMuaWRlbnRpZmllclR5cGVcbiAgICAgICAgKSB7XG4gICAgICAgICAgaWYgKGVsZW1lbnQuaWRlbnRpZmllcikge1xuICAgICAgICAgICAgbm9kZS5jb250cm9sLnNldFZhbHVlKGVsZW1lbnQuaWRlbnRpZmllcik7XG4gICAgICAgICAgICBub2RlLmluaXRpYWxWYWx1ZSA9IGVsZW1lbnQuaWRlbnRpZmllcjtcbiAgICAgICAgICB9XG4gICAgICAgIH1cbiAgICAgIH0pO1xuICAgIH0pO1xuICB9XG5cbiAgZ2V0UGF0aWVudElkZW50aWZpZXJOb2Rlcyhyb290Tm9kZTogTm9kZUJhc2UpOiBBcnJheTxOb2RlQmFzZT4ge1xuICAgIGNvbnN0IHJlc3VsdHM6IEFycmF5PE5vZGVCYXNlPiA9IFtdO1xuICAgIHRoaXMuZ2V0UGF0aWVudElkZW50aWZpZXJUeXBlTm9kZXMocm9vdE5vZGUsIHJlc3VsdHMpO1xuICAgIHJldHVybiByZXN1bHRzO1xuICB9XG5cbiAgcHJpdmF0ZSBnZXRQYXRpZW50SWRlbnRpZmllclR5cGVOb2RlcyhcbiAgICByb290Tm9kZTogTm9kZUJhc2UsXG4gICAgYXJyYXk6IEFycmF5PE5vZGVCYXNlPlxuICApIHtcbiAgICBpZiAoXG4gICAgICByb290Tm9kZS5xdWVzdGlvbi5leHRyYXMgJiZcbiAgICAgIHJvb3ROb2RlLnF1ZXN0aW9uLmV4dHJhcy50eXBlID09PSAncGF0aWVudElkZW50aWZpZXInICYmXG4gICAgICByb290Tm9kZS5jb250cm9sLmhpZGRlbiA9PT0gZmFsc2VcbiAgICApIHtcbiAgICAgIGFycmF5LnB1c2gocm9vdE5vZGUpO1xuICAgIH1cblxuICAgIGlmIChyb290Tm9kZSBpbnN0YW5jZW9mIEdyb3VwTm9kZSkge1xuICAgICAgY29uc3Qgbm9kZSA9IHJvb3ROb2RlIGFzIEdyb3VwTm9kZTtcbiAgICAgIGZvciAoY29uc3QgbyBpbiBub2RlLmNoaWxkcmVuKSB7XG4gICAgICAgIGlmIChub2RlLmNoaWxkcmVuW29dIGluc3RhbmNlb2YgTm9kZUJhc2UpIHtcbiAgICAgICAgICB0aGlzLmdldFBhdGllbnRJZGVudGlmaWVyVHlwZU5vZGVzKG5vZGUuY2hpbGRyZW5bb10sIGFycmF5KTtcbiAgICAgICAgfVxuICAgICAgfVxuICAgIH1cblxuICAgIGlmIChyb290Tm9kZSBpbnN0YW5jZW9mIEFycmF5Tm9kZSkge1xuICAgICAgY29uc3Qgbm9kZSA9IHJvb3ROb2RlIGFzIEFycmF5Tm9kZTtcbiAgICAgIG5vZGUuY2hpbGRyZW4uZm9yRWFjaCgoY2hpbGQpID0+IHtcbiAgICAgICAgdGhpcy5nZXRQYXRpZW50SWRlbnRpZmllclR5cGVOb2RlcyhjaGlsZCwgYXJyYXkpO1xuICAgICAgfSk7XG4gICAgfVxuICB9XG59XG4iXX0=
|
|
@@ -8773,11 +8773,11 @@ class FormRendererComponent {
|
|
|
8773
8773
|
return questionGroup.questions.indexOf(node.question);
|
|
8774
8774
|
}
|
|
8775
8775
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormRendererComponent, deps: [{ token: ValidationFactory }, { token: DataSources }, { token: FormErrorsService }, { token: i1.TranslateService }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8776
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormRendererComponent, selector: "ofe-form-renderer", inputs: { formSubmissionTemplate: "formSubmissionTemplate", parentComponent: "parentComponent", node: "node", parentGroup: "parentGroup", theme: "theme", labelMap: "labelMap", controlId: "controlId" }, usesOnChanges: true, ngImport: i0, template: "<!--CONTAINERS-->\n<div *ngIf=\"node.question.renderingType === 'form'\">\n <ofe-tab-set\n (tabSelect)=\"tabSelected($event)\"\n [selectedIndex]=\"activeTab\"\n [formSubmissionTemplate]=\"formSubmissionTemplate\"\n >\n <ofe-tab\n [tabTitle]=\"question.label | translate\"\n *ngFor=\"let question of node.question.questions; let i = index\"\n >\n <ofe-form-renderer\n [node]=\"node.children[question.key] | translate\"\n [parentComponent]=\"this\"\n [parentGroup]=\"node.control\"\n [labelMap]=\"labelMap\"\n >\n </ofe-form-renderer>\n\n <!-- Buttons for navigating between tabs -->\n <section *ngIf=\"this.hasMultiplePages\">\n <div class=\"button-set\">\n <button\n class=\"cds--btn cds--btn--ghost nav-button\"\n [disabled]=\"i === 0\"\n type=\"button\"\n >\n <a\n *ngIf=\"i > 0\"\n (click)=\"tabSelected(i - 1)\"\n class=\"nav-link\"\n [title]=\"node.question.questions[i - 1].label | translate\"\n >\n <label class=\"nav-label\">{{ 'previous' | translate }}</label>\n <span class=\"nav-link-text\">{{\n node.question.questions[i - 1].label | translate\n }}</span>\n </a>\n </button>\n <button\n class=\"cds--btn cds--btn--ghost nav-button\"\n [disabled]=\"i === node.question.questions.length - 1\"\n type=\"button\"\n >\n <a\n *ngIf=\"i < node.question.questions.length - 1\"\n (click)=\"tabSelected(i + 1)\"\n class=\"nav-link\"\n [title]=\"node.question.questions[i + 1].label | translate\"\n >\n <label class=\"nav-label\">{{ 'next' | translate }}</label>\n <span class=\"nav-link-text\">{{\n node.question.questions[i + 1].label | translate\n }}</span>\n </a>\n </button>\n </div>\n </section>\n </ofe-tab>\n\n <!-- TODO: Figure out why is this code doing the same thing as the ErrorRenderer component -->\n <div *ngIf=\"showErrors()\" class=\"container\">\n <div\n data-notification\n *ngFor=\"let errorNode of errorNodes\"\n class=\"cds--inline-notification cds--inline-notification--error cds--inline-notification--low-contrast pointer\"\n role=\"alert\"\n (click)=\"announceErrorField(errorNode)\"\n >\n <div class=\"cds--inline-notification__details\">\n <div class=\"cds--inline-notification__text-wrapper\">\n <p class=\"cds--inline-notification__title\">\n {{ errorNode.question.label | translate }}\n </p>\n <p class=\"cds--inline-notification__subtitle\">\n {{ getControlError(errorNode | translate) }}\n </p>\n </div>\n </div>\n <button\n tabindex=\"0\"\n class=\"cds--inline-notification__action-button cds--btn cds--btn--sm cds--btn--ghost\"\n type=\"button\"\n >\n {{ 'fix' | translate }}\n </button>\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n style=\"will-change: transform\"\n xmlns=\"http://www.w3.org/2000/svg\"\n class=\"cds--inline-notification__icon\"\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n aria-hidden=\"true\"\n >\n <path\n d=\"M10,1c-5,0-9,4-9,9s4,9,9,9s9-4,9-9S15,1,10,1z M13.5,14.5l-8-8l1-1l8,8L13.5,14.5z\"\n ></path>\n <path\n d=\"M13.5,14.5l-8-8l1-1l8,8L13.5,14.5z\"\n data-icon-path=\"inner-path\"\n opacity=\"0\"\n ></path>\n </svg>\n </div>\n </div>\n </ofe-tab-set>\n</div>\n\n<div *ngIf=\"node.question.renderingType === 'page'\">\n <!--Page Components-->\n <ofe-custom-component-wrapper\n [dark]=\"theme === 'light'\"\n [componentConfigs]=\"node.question.componentConfigs\"\n ></ofe-custom-component-wrapper>\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"parentGroup\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n</div>\n\n<div *ngIf=\"node.question.renderingType === 'section' && checkSection(node)\">\n <div class=\"cds--layout\">\n <ul class=\"cds--accordion cds--accordion--end\">\n <li\n class=\"cds--accordion__item accordion-content-override\"\n [ngClass]=\"{ 'cds--accordion__item--active': !isCollapsed }\"\n >\n <button\n type=\"button\"\n aria-controls=\"accordion-item-:r27:\"\n aria-expanded=\"false\"\n (click)=\"isCollapsed = !isCollapsed\"\n class=\"cds--accordion__heading\"\n >\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n aria-hidden=\"true\"\n class=\"cds--accordion__arrow\"\n >\n <path d=\"M11 8L6 13 5.3 12.3 9.6 8 5.3 3.7 6 3z\"></path>\n </svg>\n <div class=\"cds--accordion__title\">\n {{ node.question.label | translate }}\n </div>\n </button>\n <div id=\"accordion-item-:r27:\" class=\"cds--accordion__content\">\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"parentGroup\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n </div>\n </li>\n </ul>\n </div>\n</div>\n\n<!--CONTROLS-->\n\n<div\n *ngIf=\"node.question.controlType === 0\"\n [formGroup]=\"parentGroup\"\n [hidden]=\"node.control.hidden\"\n [ngClass]=\"{ disabled: node.control.disabled }\"\n>\n <ofe-custom-component-wrapper\n [dark]=\"!(theme === 'light')\"\n [componentConfigs]=\"node.question.componentConfigs\"\n ></ofe-custom-component-wrapper>\n <div class=\"cds--form-item\">\n <!--LEAF CONTROL-->\n <div class=\"question-area\">\n <a\n class=\"form-tooltip pull-right\"\n (click)=\"toggleInformation(node.question.extras.id)\"\n data-placement=\"right\"\n *ngIf=\"\n node.question &&\n node.question.extras.questionInfo &&\n node.question.extras.questionInfo !== '' &&\n node.question.extras.questionInfo !== ' '\n \"\n >\n <i class=\"glyphicon glyphicon-question-sign\" aria-hidden=\"true\"></i>\n </a>\n\n <label\n *ngIf=\"node.question.label\"\n [style.color]=\"hasErrors() ? 'red' : ''\"\n class=\"cds--label\"\n [attr.for]=\"node.question.key | translate\"\n >\n {{ node.question.required ? '*' : '' }}\n {{ node.question.prefix ? node.question.prefix + ' ' : '' }}\n {{ node.question.label | translate }}\n </label>\n\n <div\n *ngIf=\"\n node.question.extras.questionOptions.customControl;\n else nativeControls\n \"\n >\n <ofe-custom-control-wrapper\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n [question]=\"node.question\"\n ></ofe-custom-control-wrapper>\n </div>\n\n <ng-template #nativeControls>\n <div class=\"afe-control\" [ngSwitch]=\"node.question.renderingType\">\n <ofe-select\n [theme]=\"theme\"\n *ngSwitchCase=\"'select'\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n >\n <option\n *ngFor=\"let option of node.question.options\"\n [value]=\"option.value\"\n >\n {{ option.label | translate }}\n </option>\n </ofe-select>\n\n <div *ngSwitchCase=\"'file'\">\n <ofe-file-upload\n [dataSource]=\"dataSource\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n (fileChanged)=\"upload($event)\"\n ></ofe-file-upload>\n </div>\n\n <textarea\n [theme]=\"theme\"\n ofeTextAreaInput\n [ngClass]=\"{\n 'cds--text-area--light': theme === 'light',\n 'cds--text-area--invalid': !node.control.valid\n }\"\n [placeholder]=\"node.question.placeholder | translate\"\n [rows]=\"node.question.rows\"\n class=\"cds--text-area\"\n *ngSwitchCase=\"'textarea'\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n [readOnly]=\"node.question.extras.readOnly\"\n >\n </textarea>\n\n <ofe-remote-select\n [theme]=\"theme\"\n *ngSwitchCase=\"'remote-select'\"\n [placeholder]=\"node.question.placeholder | translate\"\n tabindex=\"0\"\n [dataSource]=\"dataSource\"\n [componentID]=\"node.question.key + 'id'\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n ></ofe-remote-select>\n\n <ofe-ngx-date-time-picker\n [weeks]=\"node.question.extras.questionOptions.weeksList\"\n [showWeeks]=\"node.question.showWeeksAdder\"\n [theme]=\"theme\"\n [id]=\"node.question.key + 'id'\"\n [formControlName]=\"node.question.key\"\n *ngSwitchCase=\"'date'\"\n [datePickerFormat]=\"node.question.datePickerFormat\"\n ></ofe-ngx-date-time-picker>\n\n <ng-select\n [ngClass]=\"{\n 'afe-custom': theme === 'light',\n invalid: node.control.touched && !node.control.valid ? true : null\n }\"\n [id]=\"node.question.key + 'id'\"\n *ngSwitchCase=\"'multi-select'\"\n [multiple]=\"true\"\n [appendTo]=\"'#' + node.question.key + 'id'\"\n placeholder=\"\"\n clearAllText=\"Clear\"\n [formControlName]=\"node.question.key\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n >\n <ng-option\n *ngFor=\"let option of node.question.options\"\n [value]=\"option.value\"\n >\n {{ option.label | translate }}\n </ng-option>\n </ng-select>\n\n <ng-select\n [ngClass]=\"{\n 'afe-custom': theme === 'light',\n invalid: node.control.touched && !node.control.valid ? true : null\n }\"\n [id]=\"node.question.key + 'id'\"\n *ngSwitchCase=\"'single-select'\"\n placeholder=\"\"\n clearAllText=\"Clear\"\n [formControlName]=\"node.question.key\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n >\n <ng-option\n *ngFor=\"let option of node.question.options\"\n [value]=\"option.value\"\n >\n {{ option.label | translate }}\n </ng-option>\n </ng-select>\n\n <ofe-number-input\n [theme]=\"theme\"\n *ngSwitchCase=\"'number'\"\n [id]=\"node.question.key + 'id'\"\n [min]=\"node.question.extras.questionOptions.min\"\n [max]=\"node.question.extras.questionOptions.max\"\n [maxlength]=\"node.question.extras.questionOptions.maxLength\"\n [minlength]=\"node.question.extras.questionOptions.minLength\"\n [formControlName]=\"node.question.key\"\n [attr.placeholder]=\"node.question.placeholder | translate\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n ></ofe-number-input>\n\n <ofe-number-input\n [theme]=\"theme\"\n *ngSwitchCase=\"'decimal'\"\n [id]=\"node.question.key + 'id'\"\n [min]=\"node.question.extras.questionOptions.min\"\n [max]=\"node.question.extras.questionOptions.max\"\n [formControlName]=\"node.question.key\"\n [attr.placeholder]=\"node.question.placeholder | translate\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n ></ofe-number-input>\n\n <div *ngSwitchCase=\"'workspace-launcher'\">\n <ofe-workspace-launcher\n [id]=\"node.question.key + 'id'\"\n [buttonLabel]=\"node.question.extras.questionOptions.buttonLabel\"\n [buttonType]=\"node.question.extras.questionOptions.buttonType\"\n [workspaceName]=\"\n node.question.extras.questionOptions.workspaceName\n \"\n ></ofe-workspace-launcher>\n </div>\n\n <input\n [theme]=\"theme\"\n class=\"cds--text-input\"\n ofeTextInput\n *ngSwitchDefault\n [formControlName]=\"node.question.key\"\n [attr.placeholder]=\"node.question.placeholder | translate\"\n [type]=\"node.question.renderingType\"\n [id]=\"node.question.key + 'id'\"\n [readOnly]=\"node.question.extras.readOnly\"\n />\n\n <div *ngSwitchCase=\"'radio'\">\n <ofe-radio-button\n [id]=\"node.question.key + 'id' + controlId\"\n [formControlName]=\"node.question.key\"\n [options]=\"node.question.options\"\n [allowUnselect]=\"node.question.allowUnselect\"\n [selected]=\"node.control.value\"\n [orientation]=\"node.question.orientation\"\n [readonly]=\"node.question.readOnly\"\n ></ofe-radio-button>\n </div>\n\n <div *ngSwitchCase=\"'checkbox'\">\n <ofe-checkbox\n [id]=\"node.question.key + 'id' + controlId\"\n [formControlName]=\"node.question.key\"\n [options]=\"node.question.options\"\n [selected]=\"node.control.value\"\n ></ofe-checkbox>\n </div>\n\n <div\n *ngIf=\"\n node.question.enableHistoricalValue &&\n node.question.historicalDisplay\n \"\n style=\"margin-top: 2px\"\n >\n <div class=\"container-fluid\">\n <div class=\"use-value\">\n <div class=\"col-xs-9\">\n <span class=\"text-warning\"\n >{{ 'previousValue' | translate }}:\n </span>\n <strong>{{ node.question.historicalDisplay?.text }}</strong>\n <span *ngIf=\"node.question.showHistoricalValueDate\">\n <span> | </span>\n <strong class=\"text-primary\"\n >{{ node.question.historicalDisplay?._date | date }}\n </strong>\n <span\n class=\"text-primary\"\n *ngIf=\"\n node.question.historicalDisplay &&\n node.question.historicalDisplay._date\n \"\n >\n ({{\n node.question.historicalDisplay._date | timeAgo\n }})</span\n >\n </span>\n </div>\n <button\n type=\"button\"\n [name]=\"'historyValue'\"\n class=\"cds--btn cds--btn--primary cds--btn--sm col-xs-3\"\n >\n {{ 'useValue' | translate }}\n </button>\n </div>\n </div>\n </div>\n <ofe-appointments-overview [node]=\"node\"></ofe-appointments-overview>\n <div class=\"error\" *ngIf=\"hasErrors()\">\n <div *ngFor=\"let e of errors()\">\n <span class=\"text-danger\">{{ e }}</span>\n </div>\n </div>\n </div>\n </ng-template>\n\n <div\n class=\"question-info col-md-12 col-lg-12 col-sm-12\"\n id=\"{{ node.question.extras.id }}\"\n *ngIf=\"\n node.question &&\n node.question.extras.questionInfo &&\n node.question.extras.questionInfo !== '' &&\n node.question.extras.questionInfo !== ' '\n \"\n >\n {{ node.question.extras.questionInfo | translate }}\n </div>\n </div>\n </div>\n</div>\n\n<!-- MESSAGES -->\n<label\n *ngIf=\"node.control && node.control.alert && node.control.alert !== ''\"\n class=\"cds--label text-warn warning\"\n>\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\"\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 32 32\"\n aria-hidden=\"true\"\n >\n <path\n fill=\"none\"\n d=\"M16,26a1.5,1.5,0,1,1,1.5-1.5A1.5,1.5,0,0,1,16,26Zm-1.125-5h2.25V12h-2.25Z\"\n data-icon-path=\"inner-path\"\n ></path>\n <path\n d=\"M16.002,6.1714h-.004L4.6487,27.9966,4.6506,28H27.3494l.0019-.0034ZM14.875,12h2.25v9h-2.25ZM16,26a1.5,1.5,0,1,1,1.5-1.5A1.5,1.5,0,0,1,16,26Z\"\n ></path>\n <path\n d=\"M29,30H3a1,1,0,0,1-.8872-1.4614l13-25a1,1,0,0,1,1.7744,0l13,25A1,1,0,0,1,29,30ZM4.6507,28H27.3493l.002-.0033L16.002,6.1714h-.004L4.6487,27.9967Z\"\n ></path>\n <title>Warning alt filled</title>\n </svg>\n {{ node.control.alert | translate }}\n</label>\n\n<div\n *ngIf=\"node.question.controlType === 1\"\n [hidden]=\"node.control.hidden\"\n [ngClass]=\"{ disabled: node.control.disabled }\"\n>\n <!--ARRAY CONTROL-->\n <div [ngSwitch]=\"node.question.renderingType\">\n <div class=\"well\" *ngSwitchCase=\"'repeating'\">\n <h4 style=\"margin: 2px; font-weight: bold\">\n {{ node.question.label | translate }}\n </h4>\n <div>\n <label\n class=\"cds--label\"\n *ngIf=\"node.question.extras.questionOptions.min\"\n style=\"margin-right: 2px\"\n >min: {{ node.question.extras.questionOptions.min }}</label\n >\n <label\n class=\"cds--label\"\n *ngIf=\"node.question.extras.questionOptions.max\"\n >max: {{ node.question.extras.questionOptions.max }}</label\n >\n </div>\n <hr class=\"divider\" />\n <div [ngSwitch]=\"node.question.extras.type\">\n <div *ngSwitchCase=\"'testOrder'\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n >\n </ofe-form-renderer>\n <div *ngIf=\"child.orderNumber\" class=\"order-number\">\n <span\n >{{ 'orderNumber' | translate }}: {{ child.orderNumber }}\n </span>\n </div>\n <div class=\"cds--layout\">\n <button\n type=\"button \"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n </div>\n <br />\n <hr class=\"divider\" />\n </div>\n </div>\n\n <div *ngSwitchCase=\"'diagnosis'\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n\n <button\n type=\"button \"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n <br />\n <hr class=\"divider\" />\n </div>\n </div>\n\n <div *ngSwitchCase=\"'obsGroup'\" style=\"margin-bottom: 20px\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n [controlId]=\"i\"\n ></ofe-form-renderer>\n\n <button\n type=\"button\"\n style=\"width: 100px\"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n <br />\n <hr class=\"divider\" />\n </div>\n </div>\n <div *ngSwitchCase=\"'diagnosisGroup'\" style=\"margin-bottom: 20px\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n [controlId]=\"i\"\n ></ofe-form-renderer>\n\n <button\n type=\"button\"\n style=\"width: 100px\"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n <br />\n <hr class=\"divider\" />\n </div>\n </div>\n </div>\n <button\n type=\"button\"\n class=\"cds--btn cds--btn--primary cds--btn--sm\"\n (click)=\"node.createChildNode()\"\n [ngClass]=\"{\n disabled:\n node.children.length >= node.question.extras.questionOptions.max\n }\"\n >\n {{ 'add' | translate }}\n </button>\n </div>\n </div>\n</div>\n\n<div\n *ngIf=\"node.question.controlType === 2\"\n [hidden]=\"node.control.hidden\"\n [ngClass]=\"{ disabled: node.control.disabled }\"\n>\n <!--GROUP-->\n <div [ngSwitch]=\"node.question.renderingType\">\n <div *ngSwitchCase=\"'group'\">\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"node.control\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n </div>\n <div\n *ngSwitchCase=\"'field-set'\"\n style=\"border: 1px solid #eeeeee; padding: 2px; margin: 2px\"\n >\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"node.control\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n </div>\n </div>\n</div>\n", styles: ["", ".button-set{margin-top:1rem}.nav-button{border-top:1px solid #dde1e6;height:5rem;max-width:50%;min-width:50%;padding-block:.25rem;align-items:center}.nav-link{min-width:100%;display:flex;align-items:flex-start;flex-direction:column}.nav-link-text{margin-top:.125rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:calc(100% - .25rem);font-size:var(--cds-heading-03-font-size, 1.25rem);font-weight:var(--cds-heading-03-font-weight, 400);line-height:var(--cds-heading-03-line-height, 1.4);letter-spacing:var(--cds-heading-03-letter-spacing, 0)}.nav-label{font-size:var(--cds-label-01-font-size, .75rem);font-weight:var(--cds-label-01-font-weight, 400);line-height:var(--cds-label-01-line-height, 1.33333);letter-spacing:var(--cds-label-01-letter-spacing, .32px)}ul{list-style-type:none;margin:2px auto;position:relative}li{display:block;padding:10px 20px;transition:all .3s ease-in;border-bottom:4px solid transparent}li:hover{border-bottom:4px solid white;opacity:.7;cursor:pointer}.owl-theme .owl-controls .owl-nav{position:absolute;width:100%;top:0}.owl-theme .owl-controls .owl-nav [class*=owl-]{position:absolute;background:none;color:#000}.owl-theme .owl-controls .owl-nav [class*=owl-]:hover{background:none;color:#000}.owl-theme .owl-controls .owl-nav .owl-next{right:0;transform:translate(120%)}.owl-theme .owl-controls .owl-nav .owl-prev{left:0;transform:translate(-120%)}.disabled{opacity:.5;pointer-events:none}.select2-container{margin-top:-5px}.btn{padding:0 12px!important}.form-tooltip{color:#337ab7;display:inline-block}.question-info{opacity:0;height:0px;display:none;transition-duration:opacity 1s ease-out;transition-delay:.5s;padding-top:2px;padding-bottom:2px;color:#696969;border-style:ridge;border-width:1px;border-color:#337ab7;margin-top:.25rem}.hide-info{display:none;height:0px}.form-tooltip:hover~.question-info{display:block;opacity:1;height:auto}.form-tooltip .tooltipcontent:after{content:\" \";position:absolute;bottom:100%;right:0%;margin-left:-5px;border-width:5px;border-style:solid;border-top-color:transparent;border-right-color:transparent;border-bottom-color:#337ab7;border-left-color:transparent}ng-select.form-control{padding-top:0;height:auto;padding-bottom:0}.forms-dropdown-menu{max-height:450px;overflow-y:scroll}.no-border{border:0;box-shadow:none}.text-danger{color:var(--cds-support-01, #da1e28)}.text-warn{color:#eea616}.error{margin-top:.25rem}.warning{display:flex;align-items:center;margin:0 .25rem .75rem}.warning svg{margin-right:.25rem}.afe-control{margin-bottom:.125rem}[hidden]{display:none!important}.accordion-content-dark{background-color:#f4f4f4;padding-right:1rem}.accordion-content-override{box-sizing:content-box;border-bottom:none;padding:0;overflow-wrap:break-word}.accordion-content-override:hover{opacity:unset;border-bottom:none}.question-area{margin-bottom:.5rem;width:100%;min-width:18rem}.question-area>label{overflow-wrap:break-word}.in-line{display:inline-block;padding-right:.5rem}.use-value{overflow-wrap:break-word}.custom-text-area{width:100%}.container .cds--inline-notification--error{display:flex;align-items:center}.container .cds--inline-notification--error svg{margin-left:1rem;margin-block-start:0}.container .cds--inline-notification--low-contrast:before{border-width:1px 1px 0 0}.divider{border-color:#e0e0e0;border-style:solid;border-bottom:none;margin:.75rem 0rem}.order-number{margin:1rem 0}.well{margin-bottom:1rem}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: i6.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i6.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i6.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: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i6.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i6.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i6.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i6.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: SelectComponent, selector: "ofe-select", inputs: ["display", "label", "helperText", "invalidText", "warn", "warnText", "id", "size", "disabled", "skeleton", "invalid", "theme", "ariaLabel", "value"], outputs: ["valueChange"] }, { kind: "component", type: i8.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "component", type: i8.NgOptionComponent, selector: "ng-option", inputs: ["value", "disabled"] }, { kind: "component", type: NumberInputComponent, selector: "ofe-number-input", inputs: ["theme", "disabled", "skeleton", "invalid", "id", "placeholder", "size", "required", "value", "min", "max", "maxlength", "minlength", "label", "helperText", "invalidText", "step", "precision", "warn", "warnText", "decrementLabel", "incrementLabel"], outputs: ["numberChange"] }, { kind: "directive", type: TextInputDirective, selector: "[ofeTextInput]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "directive", type: TextAreaDirective, selector: "[ofeTextAreaInput]", inputs: ["theme", "invalid", "skeleton"] }, { kind: "component", type: RemoteSelectComponent, selector: "ofe-remote-select", inputs: ["placeholder", "componentID", "disabled", "theme", "invalid", "dataSource"], outputs: ["done"] }, { kind: "component", type: FileUploadComponent, selector: "ofe-file-upload", inputs: ["dataSource"] }, { kind: "component", type: CheckboxControlComponent, selector: "ofe-checkbox", inputs: ["id", "options", "selected"] }, { kind: "component", type: RadioButtonControlComponent, selector: "ofe-radio-button", inputs: ["id", "options", "selected", "allowUnselect", "orientation", "readonly"] }, { kind: "component", type: WorkspaceLauncherComponent, selector: "ofe-workspace-launcher", inputs: ["id", "buttonLabel", "buttonType", "workspaceName"] }, { kind: "component", type: NgxDatetimeComponent, selector: "ofe-ngx-date-time-picker", inputs: ["id", "theme", "datePickerFormat", "showWeeks", "weeks"] }, { kind: "component", type: CustomControlWrapperComponent, selector: "ofe-custom-control-wrapper", inputs: ["question"] }, { kind: "component", type: CustomComponentWrapperComponent, selector: "ofe-custom-component-wrapper", inputs: ["componentConfigs", "dark"] }, { kind: "component", type: TabComponent, selector: "ofe-tab", inputs: ["tabTitle", "tabSubTitle", "active", "disabled", "bypassDOM", "customPaneClass"] }, { kind: "component", type: TabSetComponent, selector: "ofe-tab-set", inputs: ["disableStyle", "customNavClass", "customTabsClass", "selectedIndex", "formSubmissionTemplate"], outputs: ["tabSelect"] }, { kind: "component", type: FormRendererComponent, selector: "ofe-form-renderer", inputs: ["formSubmissionTemplate", "parentComponent", "node", "parentGroup", "theme", "labelMap", "controlId"] }, { kind: "component", type: AppointmentsOverviewComponent, selector: "ofe-appointments-overview", inputs: ["node"] }, { kind: "directive", type: HistoricalValueDirective, selector: "[node]", inputs: ["_node", "node"], outputs: ["_nodeChange"] }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "pipe", type: TimeAgoPipe, name: "timeAgo" }] }); }
|
|
8776
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormRendererComponent, selector: "ofe-form-renderer", inputs: { formSubmissionTemplate: "formSubmissionTemplate", parentComponent: "parentComponent", node: "node", parentGroup: "parentGroup", theme: "theme", labelMap: "labelMap", controlId: "controlId" }, usesOnChanges: true, ngImport: i0, template: "<!--CONTAINERS-->\n<div *ngIf=\"node.question.renderingType === 'form'\">\n <ofe-tab-set\n (tabSelect)=\"tabSelected($event)\"\n [selectedIndex]=\"activeTab\"\n [formSubmissionTemplate]=\"formSubmissionTemplate\"\n >\n <ofe-tab\n [tabTitle]=\"question.label | translate\"\n *ngFor=\"let question of node.question.questions; let i = index\"\n >\n <ofe-form-renderer\n [node]=\"node.children[question.key] | translate\"\n [parentComponent]=\"this\"\n [parentGroup]=\"node.control\"\n [labelMap]=\"labelMap\"\n >\n </ofe-form-renderer>\n\n <!-- Buttons for navigating between tabs -->\n <section *ngIf=\"this.hasMultiplePages\">\n <div class=\"button-set\">\n <button\n class=\"cds--btn cds--btn--ghost nav-button\"\n [disabled]=\"i === 0\"\n type=\"button\"\n >\n <a\n *ngIf=\"i > 0\"\n (click)=\"tabSelected(i - 1)\"\n class=\"nav-link\"\n [title]=\"node.question.questions[i - 1].label | translate\"\n >\n <label class=\"nav-label\">{{ 'previous' | translate }}</label>\n <span class=\"nav-link-text\">{{\n node.question.questions[i - 1].label | translate\n }}</span>\n </a>\n </button>\n <button\n class=\"cds--btn cds--btn--ghost nav-button\"\n [disabled]=\"i === node.question.questions.length - 1\"\n type=\"button\"\n >\n <a\n *ngIf=\"i < node.question.questions.length - 1\"\n (click)=\"tabSelected(i + 1)\"\n class=\"nav-link\"\n [title]=\"node.question.questions[i + 1].label | translate\"\n >\n <label class=\"nav-label\">{{ 'next' | translate }}</label>\n <span class=\"nav-link-text\">{{\n node.question.questions[i + 1].label | translate\n }}</span>\n </a>\n </button>\n </div>\n </section>\n </ofe-tab>\n\n <!-- TODO: Figure out why is this code doing the same thing as the ErrorRenderer component -->\n <div *ngIf=\"showErrors()\" class=\"container\">\n <div\n data-notification\n *ngFor=\"let errorNode of errorNodes\"\n class=\"cds--inline-notification cds--inline-notification--error cds--inline-notification--low-contrast pointer\"\n role=\"alert\"\n (click)=\"announceErrorField(errorNode)\"\n >\n <div class=\"cds--inline-notification__details\">\n <div class=\"cds--inline-notification__text-wrapper\">\n <p class=\"cds--inline-notification__title\">\n {{ errorNode.question.label | translate }}\n </p>\n <p class=\"cds--inline-notification__subtitle\">\n {{ getControlError(errorNode | translate) }}\n </p>\n </div>\n </div>\n <button\n tabindex=\"0\"\n class=\"cds--inline-notification__action-button cds--btn cds--btn--sm cds--btn--ghost\"\n type=\"button\"\n >\n {{ 'fix' | translate }}\n </button>\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n style=\"will-change: transform\"\n xmlns=\"http://www.w3.org/2000/svg\"\n class=\"cds--inline-notification__icon\"\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n aria-hidden=\"true\"\n >\n <path\n d=\"M10,1c-5,0-9,4-9,9s4,9,9,9s9-4,9-9S15,1,10,1z M13.5,14.5l-8-8l1-1l8,8L13.5,14.5z\"\n ></path>\n <path\n d=\"M13.5,14.5l-8-8l1-1l8,8L13.5,14.5z\"\n data-icon-path=\"inner-path\"\n opacity=\"0\"\n ></path>\n </svg>\n </div>\n </div>\n </ofe-tab-set>\n</div>\n\n<div *ngIf=\"node.question.renderingType === 'page'\">\n <!--Page Components-->\n <ofe-custom-component-wrapper\n [dark]=\"theme === 'light'\"\n [componentConfigs]=\"node.question.componentConfigs\"\n ></ofe-custom-component-wrapper>\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"parentGroup\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n</div>\n\n<div *ngIf=\"node.question.renderingType === 'section' && checkSection(node)\">\n <div class=\"cds--layout\">\n <ul class=\"cds--accordion cds--accordion--end\">\n <li\n class=\"cds--accordion__item accordion-content-override\"\n [ngClass]=\"{ 'cds--accordion__item--active': !isCollapsed }\"\n >\n <button\n type=\"button\"\n aria-controls=\"accordion-item-:r27:\"\n aria-expanded=\"false\"\n (click)=\"isCollapsed = !isCollapsed\"\n class=\"cds--accordion__heading\"\n >\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n aria-hidden=\"true\"\n class=\"cds--accordion__arrow\"\n >\n <path d=\"M11 8L6 13 5.3 12.3 9.6 8 5.3 3.7 6 3z\"></path>\n </svg>\n <div class=\"cds--accordion__title\">\n {{ node.question.label | translate }}\n </div>\n </button>\n <div id=\"accordion-item-:r27:\" class=\"cds--accordion__content\">\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"parentGroup\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n </div>\n </li>\n </ul>\n </div>\n</div>\n\n<!--CONTROLS-->\n\n<div\n *ngIf=\"node.question.controlType === 0\"\n [formGroup]=\"parentGroup\"\n [hidden]=\"node.control.hidden\"\n [ngClass]=\"{ disabled: node.control.disabled }\"\n>\n <ofe-custom-component-wrapper\n [dark]=\"!(theme === 'light')\"\n [componentConfigs]=\"node.question.componentConfigs\"\n ></ofe-custom-component-wrapper>\n <div class=\"cds--form-item\">\n <!--LEAF CONTROL-->\n <div class=\"question-area\">\n <a\n class=\"form-tooltip pull-right\"\n (click)=\"toggleInformation(node.question.extras.id)\"\n data-placement=\"right\"\n *ngIf=\"\n node.question &&\n node.question.extras.questionInfo &&\n node.question.extras.questionInfo !== '' &&\n node.question.extras.questionInfo !== ' '\n \"\n >\n <i class=\"glyphicon glyphicon-question-sign\" aria-hidden=\"true\"></i>\n </a>\n\n <label\n *ngIf=\"node.question.label\"\n [style.color]=\"hasErrors() ? 'red' : ''\"\n class=\"cds--label\"\n [attr.for]=\"node.question.key | translate\"\n >\n {{ node.question.required ? '*' : '' }}\n {{ node.question.prefix ? node.question.prefix + ' ' : '' }}\n {{ node.question.label | translate }}\n </label>\n\n <div\n *ngIf=\"\n node.question.extras.questionOptions.customControl;\n else nativeControls\n \"\n >\n <ofe-custom-control-wrapper\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n [question]=\"node.question\"\n ></ofe-custom-control-wrapper>\n </div>\n\n <ng-template #nativeControls>\n <div class=\"afe-control\" [ngSwitch]=\"node.question.renderingType\">\n <ofe-select\n [theme]=\"theme\"\n *ngSwitchCase=\"'select'\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n >\n <option\n *ngFor=\"let option of node.question.options\"\n [value]=\"option.value\"\n >\n {{ option.label | translate }}\n </option>\n </ofe-select>\n\n <div *ngSwitchCase=\"'file'\">\n <ofe-file-upload\n [dataSource]=\"dataSource\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n (fileChanged)=\"upload($event)\"\n ></ofe-file-upload>\n </div>\n\n <textarea\n [theme]=\"theme\"\n ofeTextAreaInput\n [ngClass]=\"{\n 'cds--text-area--light': theme === 'light',\n 'cds--text-area--invalid': !node.control.valid\n }\"\n [placeholder]=\"node.question.placeholder | translate\"\n [rows]=\"node.question.rows\"\n class=\"cds--text-area\"\n *ngSwitchCase=\"'textarea'\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n [readOnly]=\"node.question.extras.readOnly\"\n >\n </textarea>\n\n <ofe-remote-select\n [theme]=\"theme\"\n *ngSwitchCase=\"'remote-select'\"\n [placeholder]=\"node.question.placeholder | translate\"\n tabindex=\"0\"\n [dataSource]=\"dataSource\"\n [componentID]=\"node.question.key + 'id'\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n ></ofe-remote-select>\n\n <ofe-ngx-date-time-picker\n [weeks]=\"node.question.extras.questionOptions.weeksList\"\n [showWeeks]=\"node.question.showWeeksAdder\"\n [theme]=\"theme\"\n [id]=\"node.question.key + 'id'\"\n [formControlName]=\"node.question.key\"\n *ngSwitchCase=\"'date'\"\n [datePickerFormat]=\"node.question.datePickerFormat\"\n ></ofe-ngx-date-time-picker>\n\n <ng-select\n [ngClass]=\"{\n 'afe-custom': theme === 'light',\n invalid: node.control.touched && !node.control.valid ? true : null\n }\"\n [id]=\"node.question.key + 'id'\"\n *ngSwitchCase=\"'multi-select'\"\n [multiple]=\"true\"\n [appendTo]=\"'#' + node.question.key + 'id'\"\n placeholder=\"\"\n clearAllText=\"Clear\"\n [formControlName]=\"node.question.key\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n >\n <ng-option\n *ngFor=\"let option of node.question.options\"\n [value]=\"option.value\"\n >\n {{ option.label | translate }}\n </ng-option>\n </ng-select>\n\n <ng-select\n [ngClass]=\"{\n 'afe-custom': theme === 'light',\n invalid: node.control.touched && !node.control.valid ? true : null\n }\"\n [id]=\"node.question.key + 'id'\"\n *ngSwitchCase=\"'single-select'\"\n placeholder=\"\"\n clearAllText=\"Clear\"\n [formControlName]=\"node.question.key\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n >\n <ng-option\n *ngFor=\"let option of node.question.options\"\n [value]=\"option.value\"\n >\n {{ option.label | translate }}\n </ng-option>\n </ng-select>\n\n <ofe-number-input\n [theme]=\"theme\"\n *ngSwitchCase=\"'number'\"\n [id]=\"node.question.key + 'id'\"\n [min]=\"node.question.extras.questionOptions.min\"\n [max]=\"node.question.extras.questionOptions.max\"\n [maxlength]=\"node.question.extras.questionOptions.maxLength\"\n [minlength]=\"node.question.extras.questionOptions.minLength\"\n [formControlName]=\"node.question.key\"\n [attr.placeholder]=\"node.question.placeholder | translate\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n ></ofe-number-input>\n\n <ofe-number-input\n [theme]=\"theme\"\n *ngSwitchCase=\"'decimal'\"\n [id]=\"node.question.key + 'id'\"\n [min]=\"node.question.extras.questionOptions.min\"\n [max]=\"node.question.extras.questionOptions.max\"\n [formControlName]=\"node.question.key\"\n [attr.placeholder]=\"node.question.placeholder | translate\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n ></ofe-number-input>\n\n <div *ngSwitchCase=\"'workspace-launcher'\">\n <ofe-workspace-launcher\n [id]=\"node.question.key + 'id'\"\n [buttonLabel]=\"node.question.extras.questionOptions.buttonLabel\"\n [buttonType]=\"node.question.extras.questionOptions.buttonType\"\n [workspaceName]=\"\n node.question.extras.questionOptions.workspaceName\n \"\n ></ofe-workspace-launcher>\n </div>\n\n <input\n [theme]=\"theme\"\n class=\"cds--text-input\"\n ofeTextInput\n *ngSwitchDefault\n [formControlName]=\"node.question.key\"\n [attr.placeholder]=\"node.question.placeholder | translate\"\n [type]=\"node.question.renderingType\"\n [id]=\"node.question.key + 'id'\"\n [readOnly]=\"node.question.extras.readOnly\"\n />\n\n <div *ngSwitchCase=\"'radio'\">\n <ofe-radio-button\n [id]=\"node.question.key + 'id' + controlId\"\n [formControlName]=\"node.question.key\"\n [options]=\"node.question.options\"\n [allowUnselect]=\"node.question.allowUnselect\"\n [selected]=\"node.control.value\"\n [orientation]=\"node.question.orientation\"\n [readonly]=\"node.question.readOnly\"\n ></ofe-radio-button>\n </div>\n\n <div *ngSwitchCase=\"'checkbox'\">\n <ofe-checkbox\n [id]=\"node.question.key + 'id' + controlId\"\n [formControlName]=\"node.question.key\"\n [options]=\"node.question.options\"\n [selected]=\"node.control.value\"\n ></ofe-checkbox>\n </div>\n\n <div\n *ngIf=\"\n node.question.enableHistoricalValue &&\n node.question.historicalDisplay\n \"\n style=\"margin-top: 2px\"\n >\n <div class=\"container-fluid\">\n <div class=\"use-value\">\n <div class=\"col-xs-9\">\n <span class=\"text-warning\"\n >{{ 'previousValue' | translate }}:\n </span>\n <strong>{{ node.question.historicalDisplay?.text }}</strong>\n <span *ngIf=\"node.question.showHistoricalValueDate\">\n <span> | </span>\n <strong class=\"text-primary\"\n >{{ node.question.historicalDisplay?._date | date }}\n </strong>\n <span\n class=\"text-primary\"\n *ngIf=\"\n node.question.historicalDisplay &&\n node.question.historicalDisplay._date\n \"\n >\n ({{\n node.question.historicalDisplay._date | timeAgo\n }})</span\n >\n </span>\n </div>\n <button\n type=\"button\"\n [name]=\"'historyValue'\"\n class=\"cds--btn cds--btn--primary cds--btn--sm col-xs-3\"\n >\n {{ 'useValue' | translate }}\n </button>\n </div>\n </div>\n </div>\n <ofe-appointments-overview [node]=\"node\"></ofe-appointments-overview>\n <div class=\"error\" *ngIf=\"hasErrors()\">\n <div *ngFor=\"let e of errors()\">\n <span class=\"text-danger\">{{ e }}</span>\n </div>\n </div>\n </div>\n </ng-template>\n\n <div\n class=\"question-info col-md-12 col-lg-12 col-sm-12\"\n id=\"{{ node.question.extras.id }}\"\n *ngIf=\"\n node.question &&\n node.question.extras.questionInfo &&\n node.question.extras.questionInfo !== '' &&\n node.question.extras.questionInfo !== ' '\n \"\n >\n {{ node.question.extras.questionInfo | translate }}\n </div>\n </div>\n </div>\n</div>\n\n<!-- MESSAGES -->\n<label\n *ngIf=\"node.control && node.control.alert && node.control.alert !== ''\"\n class=\"cds--label text-warn warning\"\n>\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\"\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 32 32\"\n aria-hidden=\"true\"\n >\n <path\n fill=\"none\"\n d=\"M16,26a1.5,1.5,0,1,1,1.5-1.5A1.5,1.5,0,0,1,16,26Zm-1.125-5h2.25V12h-2.25Z\"\n data-icon-path=\"inner-path\"\n ></path>\n <path\n d=\"M16.002,6.1714h-.004L4.6487,27.9966,4.6506,28H27.3494l.0019-.0034ZM14.875,12h2.25v9h-2.25ZM16,26a1.5,1.5,0,1,1,1.5-1.5A1.5,1.5,0,0,1,16,26Z\"\n ></path>\n <path\n d=\"M29,30H3a1,1,0,0,1-.8872-1.4614l13-25a1,1,0,0,1,1.7744,0l13,25A1,1,0,0,1,29,30ZM4.6507,28H27.3493l.002-.0033L16.002,6.1714h-.004L4.6487,27.9967Z\"\n ></path>\n <title>Warning alt filled</title>\n </svg>\n {{ node.control.alert | translate }}\n</label>\n\n<div\n *ngIf=\"node.question.controlType === 1\"\n [hidden]=\"node.control.hidden\"\n [ngClass]=\"{ disabled: node.control.disabled }\"\n>\n <!--ARRAY CONTROL-->\n <div [ngSwitch]=\"node.question.renderingType\">\n <div class=\"well\" *ngSwitchCase=\"'repeating'\">\n <h4 style=\"margin: 2px; font-weight: bold\">\n {{ node.question.label | translate }}\n </h4>\n <div>\n <label\n class=\"cds--label\"\n *ngIf=\"node.question.extras.questionOptions.min\"\n style=\"margin-right: 2px\"\n >min: {{ node.question.extras.questionOptions.min }}</label\n >\n <label\n class=\"cds--label\"\n *ngIf=\"node.question.extras.questionOptions.max\"\n >max: {{ node.question.extras.questionOptions.max }}</label\n >\n </div>\n <hr class=\"divider\" />\n <div [ngSwitch]=\"node.question.extras.type\">\n <div *ngSwitchCase=\"'testOrder'\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n >\n </ofe-form-renderer>\n <div *ngIf=\"child.orderNumber\" class=\"order-number\">\n <span\n >{{ 'orderNumber' | translate }}: {{ child.orderNumber }}\n </span>\n </div>\n <div class=\"cds--layout\">\n <button\n type=\"button \"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n </div>\n <br />\n <hr class=\"divider\" />\n </div>\n </div>\n\n <div *ngSwitchCase=\"'diagnosis'\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n\n <button\n type=\"button \"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n <br />\n <hr class=\"divider\" />\n </div>\n </div>\n\n <div *ngSwitchCase=\"'obsGroup'\" style=\"margin-bottom: 20px\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n [controlId]=\"i\"\n ></ofe-form-renderer>\n\n <button\n type=\"button\"\n style=\"width: 100px\"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n <br />\n <hr class=\"divider\" />\n </div>\n </div>\n <div *ngSwitchCase=\"'diagnosisGroup'\" style=\"margin-bottom: 20px\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n [controlId]=\"i\"\n ></ofe-form-renderer>\n\n <button\n type=\"button\"\n style=\"width: 100px\"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n <br />\n <hr class=\"divider\" />\n </div>\n </div>\n </div>\n <button\n type=\"button\"\n class=\"cds--btn cds--btn--primary cds--btn--sm\"\n (click)=\"node.createChildNode()\"\n [ngClass]=\"{\n disabled:\n node.children.length >= node.question.extras.questionOptions.max\n }\"\n >\n {{ 'add' | translate }}\n </button>\n </div>\n </div>\n</div>\n\n<div\n *ngIf=\"node.question.controlType === 2\"\n [hidden]=\"node.control.hidden\"\n [ngClass]=\"{ disabled: node.control.disabled }\"\n>\n <!--GROUP-->\n <div [ngSwitch]=\"node.question.renderingType\">\n <div *ngSwitchCase=\"'group'\">\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"node.control\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n </div>\n <div\n *ngSwitchCase=\"'field-set'\"\n style=\"border: 1px solid #eeeeee; padding: 2px; margin: 2px\"\n >\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"node.control\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n </div>\n </div>\n</div>\n", styles: ["", ".button-set{margin-top:1rem}.nav-button{border-top:1px solid #dde1e6;height:5rem;max-width:50%;min-width:50%;padding-block:.25rem;align-items:center}.nav-link{min-width:100%;display:flex;align-items:flex-start;flex-direction:column}.nav-link-text{margin-top:.125rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:calc(100% - .25rem);font-size:var(--cds-body-01-font-size, .875rem);font-weight:var(--cds-body-01-font-weight, 400);line-height:var(--cds-body-01-line-height, 1.42857);letter-spacing:var(--cds-body-01-letter-spacing, .16px)}.nav-label{font-size:var(--cds-label-01-font-size, .75rem);font-weight:var(--cds-label-01-font-weight, 400);line-height:var(--cds-label-01-line-height, 1.33333);letter-spacing:var(--cds-label-01-letter-spacing, .32px);color:#525252}ul{list-style-type:none;margin:2px auto;position:relative}li{display:block;padding:10px 20px;transition:all .3s ease-in;border-bottom:4px solid transparent}li:hover{border-bottom:4px solid white;opacity:.7;cursor:pointer}.owl-theme .owl-controls .owl-nav{position:absolute;width:100%;top:0}.owl-theme .owl-controls .owl-nav [class*=owl-]{position:absolute;background:none;color:#000}.owl-theme .owl-controls .owl-nav [class*=owl-]:hover{background:none;color:#000}.owl-theme .owl-controls .owl-nav .owl-next{right:0;transform:translate(120%)}.owl-theme .owl-controls .owl-nav .owl-prev{left:0;transform:translate(-120%)}.disabled{opacity:.5;pointer-events:none}.select2-container{margin-top:-5px}.btn{padding:0 12px!important}.form-tooltip{color:#337ab7;display:inline-block}.question-info{opacity:0;height:0px;display:none;transition-duration:opacity 1s ease-out;transition-delay:.5s;padding-top:2px;padding-bottom:2px;color:#696969;border-style:ridge;border-width:1px;border-color:#337ab7;margin-top:.25rem}.hide-info{display:none;height:0px}.form-tooltip:hover~.question-info{display:block;opacity:1;height:auto}.form-tooltip .tooltipcontent:after{content:\" \";position:absolute;bottom:100%;right:0%;margin-left:-5px;border-width:5px;border-style:solid;border-top-color:transparent;border-right-color:transparent;border-bottom-color:#337ab7;border-left-color:transparent}ng-select.form-control{padding-top:0;height:auto;padding-bottom:0}.forms-dropdown-menu{max-height:450px;overflow-y:scroll}.no-border{border:0;box-shadow:none}.text-danger{color:var(--cds-support-01, #da1e28)}.text-warn{color:#eea616}.error{margin-top:.25rem}.warning{display:flex;align-items:center;margin:0 .25rem .75rem}.warning svg{margin-right:.25rem}.afe-control{margin-bottom:.125rem}[hidden]{display:none!important}.accordion-content-dark{background-color:#f4f4f4;padding-right:1rem}.accordion-content-override{box-sizing:content-box;border-bottom:none;padding:0;overflow-wrap:break-word}.accordion-content-override:hover{opacity:unset;border-bottom:none}.question-area{margin-bottom:.5rem;width:100%;min-width:18rem}.question-area>label{overflow-wrap:break-word}.in-line{display:inline-block;padding-right:.5rem}.use-value{overflow-wrap:break-word}.custom-text-area{width:100%}.container .cds--inline-notification--error{display:flex;align-items:center}.container .cds--inline-notification--error svg{margin-left:1rem;margin-block-start:0}.container .cds--inline-notification--low-contrast:before{border-width:1px 1px 0 0}.divider{border-color:#e0e0e0;border-style:solid;border-bottom:none;margin:.75rem 0rem}.order-number{margin:1rem 0}.well{margin-bottom:1rem}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: i6.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i6.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i6.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: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i6.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i6.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i6.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i6.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: SelectComponent, selector: "ofe-select", inputs: ["display", "label", "helperText", "invalidText", "warn", "warnText", "id", "size", "disabled", "skeleton", "invalid", "theme", "ariaLabel", "value"], outputs: ["valueChange"] }, { kind: "component", type: i8.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "component", type: i8.NgOptionComponent, selector: "ng-option", inputs: ["value", "disabled"] }, { kind: "component", type: NumberInputComponent, selector: "ofe-number-input", inputs: ["theme", "disabled", "skeleton", "invalid", "id", "placeholder", "size", "required", "value", "min", "max", "maxlength", "minlength", "label", "helperText", "invalidText", "step", "precision", "warn", "warnText", "decrementLabel", "incrementLabel"], outputs: ["numberChange"] }, { kind: "directive", type: TextInputDirective, selector: "[ofeTextInput]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "directive", type: TextAreaDirective, selector: "[ofeTextAreaInput]", inputs: ["theme", "invalid", "skeleton"] }, { kind: "component", type: RemoteSelectComponent, selector: "ofe-remote-select", inputs: ["placeholder", "componentID", "disabled", "theme", "invalid", "dataSource"], outputs: ["done"] }, { kind: "component", type: FileUploadComponent, selector: "ofe-file-upload", inputs: ["dataSource"] }, { kind: "component", type: CheckboxControlComponent, selector: "ofe-checkbox", inputs: ["id", "options", "selected"] }, { kind: "component", type: RadioButtonControlComponent, selector: "ofe-radio-button", inputs: ["id", "options", "selected", "allowUnselect", "orientation", "readonly"] }, { kind: "component", type: WorkspaceLauncherComponent, selector: "ofe-workspace-launcher", inputs: ["id", "buttonLabel", "buttonType", "workspaceName"] }, { kind: "component", type: NgxDatetimeComponent, selector: "ofe-ngx-date-time-picker", inputs: ["id", "theme", "datePickerFormat", "showWeeks", "weeks"] }, { kind: "component", type: CustomControlWrapperComponent, selector: "ofe-custom-control-wrapper", inputs: ["question"] }, { kind: "component", type: CustomComponentWrapperComponent, selector: "ofe-custom-component-wrapper", inputs: ["componentConfigs", "dark"] }, { kind: "component", type: TabComponent, selector: "ofe-tab", inputs: ["tabTitle", "tabSubTitle", "active", "disabled", "bypassDOM", "customPaneClass"] }, { kind: "component", type: TabSetComponent, selector: "ofe-tab-set", inputs: ["disableStyle", "customNavClass", "customTabsClass", "selectedIndex", "formSubmissionTemplate"], outputs: ["tabSelect"] }, { kind: "component", type: FormRendererComponent, selector: "ofe-form-renderer", inputs: ["formSubmissionTemplate", "parentComponent", "node", "parentGroup", "theme", "labelMap", "controlId"] }, { kind: "component", type: AppointmentsOverviewComponent, selector: "ofe-appointments-overview", inputs: ["node"] }, { kind: "directive", type: HistoricalValueDirective, selector: "[node]", inputs: ["_node", "node"], outputs: ["_nodeChange"] }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "pipe", type: TimeAgoPipe, name: "timeAgo" }] }); }
|
|
8777
8777
|
}
|
|
8778
8778
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormRendererComponent, decorators: [{
|
|
8779
8779
|
type: Component,
|
|
8780
|
-
args: [{ selector: 'ofe-form-renderer', template: "<!--CONTAINERS-->\n<div *ngIf=\"node.question.renderingType === 'form'\">\n <ofe-tab-set\n (tabSelect)=\"tabSelected($event)\"\n [selectedIndex]=\"activeTab\"\n [formSubmissionTemplate]=\"formSubmissionTemplate\"\n >\n <ofe-tab\n [tabTitle]=\"question.label | translate\"\n *ngFor=\"let question of node.question.questions; let i = index\"\n >\n <ofe-form-renderer\n [node]=\"node.children[question.key] | translate\"\n [parentComponent]=\"this\"\n [parentGroup]=\"node.control\"\n [labelMap]=\"labelMap\"\n >\n </ofe-form-renderer>\n\n <!-- Buttons for navigating between tabs -->\n <section *ngIf=\"this.hasMultiplePages\">\n <div class=\"button-set\">\n <button\n class=\"cds--btn cds--btn--ghost nav-button\"\n [disabled]=\"i === 0\"\n type=\"button\"\n >\n <a\n *ngIf=\"i > 0\"\n (click)=\"tabSelected(i - 1)\"\n class=\"nav-link\"\n [title]=\"node.question.questions[i - 1].label | translate\"\n >\n <label class=\"nav-label\">{{ 'previous' | translate }}</label>\n <span class=\"nav-link-text\">{{\n node.question.questions[i - 1].label | translate\n }}</span>\n </a>\n </button>\n <button\n class=\"cds--btn cds--btn--ghost nav-button\"\n [disabled]=\"i === node.question.questions.length - 1\"\n type=\"button\"\n >\n <a\n *ngIf=\"i < node.question.questions.length - 1\"\n (click)=\"tabSelected(i + 1)\"\n class=\"nav-link\"\n [title]=\"node.question.questions[i + 1].label | translate\"\n >\n <label class=\"nav-label\">{{ 'next' | translate }}</label>\n <span class=\"nav-link-text\">{{\n node.question.questions[i + 1].label | translate\n }}</span>\n </a>\n </button>\n </div>\n </section>\n </ofe-tab>\n\n <!-- TODO: Figure out why is this code doing the same thing as the ErrorRenderer component -->\n <div *ngIf=\"showErrors()\" class=\"container\">\n <div\n data-notification\n *ngFor=\"let errorNode of errorNodes\"\n class=\"cds--inline-notification cds--inline-notification--error cds--inline-notification--low-contrast pointer\"\n role=\"alert\"\n (click)=\"announceErrorField(errorNode)\"\n >\n <div class=\"cds--inline-notification__details\">\n <div class=\"cds--inline-notification__text-wrapper\">\n <p class=\"cds--inline-notification__title\">\n {{ errorNode.question.label | translate }}\n </p>\n <p class=\"cds--inline-notification__subtitle\">\n {{ getControlError(errorNode | translate) }}\n </p>\n </div>\n </div>\n <button\n tabindex=\"0\"\n class=\"cds--inline-notification__action-button cds--btn cds--btn--sm cds--btn--ghost\"\n type=\"button\"\n >\n {{ 'fix' | translate }}\n </button>\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n style=\"will-change: transform\"\n xmlns=\"http://www.w3.org/2000/svg\"\n class=\"cds--inline-notification__icon\"\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n aria-hidden=\"true\"\n >\n <path\n d=\"M10,1c-5,0-9,4-9,9s4,9,9,9s9-4,9-9S15,1,10,1z M13.5,14.5l-8-8l1-1l8,8L13.5,14.5z\"\n ></path>\n <path\n d=\"M13.5,14.5l-8-8l1-1l8,8L13.5,14.5z\"\n data-icon-path=\"inner-path\"\n opacity=\"0\"\n ></path>\n </svg>\n </div>\n </div>\n </ofe-tab-set>\n</div>\n\n<div *ngIf=\"node.question.renderingType === 'page'\">\n <!--Page Components-->\n <ofe-custom-component-wrapper\n [dark]=\"theme === 'light'\"\n [componentConfigs]=\"node.question.componentConfigs\"\n ></ofe-custom-component-wrapper>\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"parentGroup\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n</div>\n\n<div *ngIf=\"node.question.renderingType === 'section' && checkSection(node)\">\n <div class=\"cds--layout\">\n <ul class=\"cds--accordion cds--accordion--end\">\n <li\n class=\"cds--accordion__item accordion-content-override\"\n [ngClass]=\"{ 'cds--accordion__item--active': !isCollapsed }\"\n >\n <button\n type=\"button\"\n aria-controls=\"accordion-item-:r27:\"\n aria-expanded=\"false\"\n (click)=\"isCollapsed = !isCollapsed\"\n class=\"cds--accordion__heading\"\n >\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n aria-hidden=\"true\"\n class=\"cds--accordion__arrow\"\n >\n <path d=\"M11 8L6 13 5.3 12.3 9.6 8 5.3 3.7 6 3z\"></path>\n </svg>\n <div class=\"cds--accordion__title\">\n {{ node.question.label | translate }}\n </div>\n </button>\n <div id=\"accordion-item-:r27:\" class=\"cds--accordion__content\">\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"parentGroup\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n </div>\n </li>\n </ul>\n </div>\n</div>\n\n<!--CONTROLS-->\n\n<div\n *ngIf=\"node.question.controlType === 0\"\n [formGroup]=\"parentGroup\"\n [hidden]=\"node.control.hidden\"\n [ngClass]=\"{ disabled: node.control.disabled }\"\n>\n <ofe-custom-component-wrapper\n [dark]=\"!(theme === 'light')\"\n [componentConfigs]=\"node.question.componentConfigs\"\n ></ofe-custom-component-wrapper>\n <div class=\"cds--form-item\">\n <!--LEAF CONTROL-->\n <div class=\"question-area\">\n <a\n class=\"form-tooltip pull-right\"\n (click)=\"toggleInformation(node.question.extras.id)\"\n data-placement=\"right\"\n *ngIf=\"\n node.question &&\n node.question.extras.questionInfo &&\n node.question.extras.questionInfo !== '' &&\n node.question.extras.questionInfo !== ' '\n \"\n >\n <i class=\"glyphicon glyphicon-question-sign\" aria-hidden=\"true\"></i>\n </a>\n\n <label\n *ngIf=\"node.question.label\"\n [style.color]=\"hasErrors() ? 'red' : ''\"\n class=\"cds--label\"\n [attr.for]=\"node.question.key | translate\"\n >\n {{ node.question.required ? '*' : '' }}\n {{ node.question.prefix ? node.question.prefix + ' ' : '' }}\n {{ node.question.label | translate }}\n </label>\n\n <div\n *ngIf=\"\n node.question.extras.questionOptions.customControl;\n else nativeControls\n \"\n >\n <ofe-custom-control-wrapper\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n [question]=\"node.question\"\n ></ofe-custom-control-wrapper>\n </div>\n\n <ng-template #nativeControls>\n <div class=\"afe-control\" [ngSwitch]=\"node.question.renderingType\">\n <ofe-select\n [theme]=\"theme\"\n *ngSwitchCase=\"'select'\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n >\n <option\n *ngFor=\"let option of node.question.options\"\n [value]=\"option.value\"\n >\n {{ option.label | translate }}\n </option>\n </ofe-select>\n\n <div *ngSwitchCase=\"'file'\">\n <ofe-file-upload\n [dataSource]=\"dataSource\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n (fileChanged)=\"upload($event)\"\n ></ofe-file-upload>\n </div>\n\n <textarea\n [theme]=\"theme\"\n ofeTextAreaInput\n [ngClass]=\"{\n 'cds--text-area--light': theme === 'light',\n 'cds--text-area--invalid': !node.control.valid\n }\"\n [placeholder]=\"node.question.placeholder | translate\"\n [rows]=\"node.question.rows\"\n class=\"cds--text-area\"\n *ngSwitchCase=\"'textarea'\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n [readOnly]=\"node.question.extras.readOnly\"\n >\n </textarea>\n\n <ofe-remote-select\n [theme]=\"theme\"\n *ngSwitchCase=\"'remote-select'\"\n [placeholder]=\"node.question.placeholder | translate\"\n tabindex=\"0\"\n [dataSource]=\"dataSource\"\n [componentID]=\"node.question.key + 'id'\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n ></ofe-remote-select>\n\n <ofe-ngx-date-time-picker\n [weeks]=\"node.question.extras.questionOptions.weeksList\"\n [showWeeks]=\"node.question.showWeeksAdder\"\n [theme]=\"theme\"\n [id]=\"node.question.key + 'id'\"\n [formControlName]=\"node.question.key\"\n *ngSwitchCase=\"'date'\"\n [datePickerFormat]=\"node.question.datePickerFormat\"\n ></ofe-ngx-date-time-picker>\n\n <ng-select\n [ngClass]=\"{\n 'afe-custom': theme === 'light',\n invalid: node.control.touched && !node.control.valid ? true : null\n }\"\n [id]=\"node.question.key + 'id'\"\n *ngSwitchCase=\"'multi-select'\"\n [multiple]=\"true\"\n [appendTo]=\"'#' + node.question.key + 'id'\"\n placeholder=\"\"\n clearAllText=\"Clear\"\n [formControlName]=\"node.question.key\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n >\n <ng-option\n *ngFor=\"let option of node.question.options\"\n [value]=\"option.value\"\n >\n {{ option.label | translate }}\n </ng-option>\n </ng-select>\n\n <ng-select\n [ngClass]=\"{\n 'afe-custom': theme === 'light',\n invalid: node.control.touched && !node.control.valid ? true : null\n }\"\n [id]=\"node.question.key + 'id'\"\n *ngSwitchCase=\"'single-select'\"\n placeholder=\"\"\n clearAllText=\"Clear\"\n [formControlName]=\"node.question.key\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n >\n <ng-option\n *ngFor=\"let option of node.question.options\"\n [value]=\"option.value\"\n >\n {{ option.label | translate }}\n </ng-option>\n </ng-select>\n\n <ofe-number-input\n [theme]=\"theme\"\n *ngSwitchCase=\"'number'\"\n [id]=\"node.question.key + 'id'\"\n [min]=\"node.question.extras.questionOptions.min\"\n [max]=\"node.question.extras.questionOptions.max\"\n [maxlength]=\"node.question.extras.questionOptions.maxLength\"\n [minlength]=\"node.question.extras.questionOptions.minLength\"\n [formControlName]=\"node.question.key\"\n [attr.placeholder]=\"node.question.placeholder | translate\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n ></ofe-number-input>\n\n <ofe-number-input\n [theme]=\"theme\"\n *ngSwitchCase=\"'decimal'\"\n [id]=\"node.question.key + 'id'\"\n [min]=\"node.question.extras.questionOptions.min\"\n [max]=\"node.question.extras.questionOptions.max\"\n [formControlName]=\"node.question.key\"\n [attr.placeholder]=\"node.question.placeholder | translate\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n ></ofe-number-input>\n\n <div *ngSwitchCase=\"'workspace-launcher'\">\n <ofe-workspace-launcher\n [id]=\"node.question.key + 'id'\"\n [buttonLabel]=\"node.question.extras.questionOptions.buttonLabel\"\n [buttonType]=\"node.question.extras.questionOptions.buttonType\"\n [workspaceName]=\"\n node.question.extras.questionOptions.workspaceName\n \"\n ></ofe-workspace-launcher>\n </div>\n\n <input\n [theme]=\"theme\"\n class=\"cds--text-input\"\n ofeTextInput\n *ngSwitchDefault\n [formControlName]=\"node.question.key\"\n [attr.placeholder]=\"node.question.placeholder | translate\"\n [type]=\"node.question.renderingType\"\n [id]=\"node.question.key + 'id'\"\n [readOnly]=\"node.question.extras.readOnly\"\n />\n\n <div *ngSwitchCase=\"'radio'\">\n <ofe-radio-button\n [id]=\"node.question.key + 'id' + controlId\"\n [formControlName]=\"node.question.key\"\n [options]=\"node.question.options\"\n [allowUnselect]=\"node.question.allowUnselect\"\n [selected]=\"node.control.value\"\n [orientation]=\"node.question.orientation\"\n [readonly]=\"node.question.readOnly\"\n ></ofe-radio-button>\n </div>\n\n <div *ngSwitchCase=\"'checkbox'\">\n <ofe-checkbox\n [id]=\"node.question.key + 'id' + controlId\"\n [formControlName]=\"node.question.key\"\n [options]=\"node.question.options\"\n [selected]=\"node.control.value\"\n ></ofe-checkbox>\n </div>\n\n <div\n *ngIf=\"\n node.question.enableHistoricalValue &&\n node.question.historicalDisplay\n \"\n style=\"margin-top: 2px\"\n >\n <div class=\"container-fluid\">\n <div class=\"use-value\">\n <div class=\"col-xs-9\">\n <span class=\"text-warning\"\n >{{ 'previousValue' | translate }}:\n </span>\n <strong>{{ node.question.historicalDisplay?.text }}</strong>\n <span *ngIf=\"node.question.showHistoricalValueDate\">\n <span> | </span>\n <strong class=\"text-primary\"\n >{{ node.question.historicalDisplay?._date | date }}\n </strong>\n <span\n class=\"text-primary\"\n *ngIf=\"\n node.question.historicalDisplay &&\n node.question.historicalDisplay._date\n \"\n >\n ({{\n node.question.historicalDisplay._date | timeAgo\n }})</span\n >\n </span>\n </div>\n <button\n type=\"button\"\n [name]=\"'historyValue'\"\n class=\"cds--btn cds--btn--primary cds--btn--sm col-xs-3\"\n >\n {{ 'useValue' | translate }}\n </button>\n </div>\n </div>\n </div>\n <ofe-appointments-overview [node]=\"node\"></ofe-appointments-overview>\n <div class=\"error\" *ngIf=\"hasErrors()\">\n <div *ngFor=\"let e of errors()\">\n <span class=\"text-danger\">{{ e }}</span>\n </div>\n </div>\n </div>\n </ng-template>\n\n <div\n class=\"question-info col-md-12 col-lg-12 col-sm-12\"\n id=\"{{ node.question.extras.id }}\"\n *ngIf=\"\n node.question &&\n node.question.extras.questionInfo &&\n node.question.extras.questionInfo !== '' &&\n node.question.extras.questionInfo !== ' '\n \"\n >\n {{ node.question.extras.questionInfo | translate }}\n </div>\n </div>\n </div>\n</div>\n\n<!-- MESSAGES -->\n<label\n *ngIf=\"node.control && node.control.alert && node.control.alert !== ''\"\n class=\"cds--label text-warn warning\"\n>\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\"\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 32 32\"\n aria-hidden=\"true\"\n >\n <path\n fill=\"none\"\n d=\"M16,26a1.5,1.5,0,1,1,1.5-1.5A1.5,1.5,0,0,1,16,26Zm-1.125-5h2.25V12h-2.25Z\"\n data-icon-path=\"inner-path\"\n ></path>\n <path\n d=\"M16.002,6.1714h-.004L4.6487,27.9966,4.6506,28H27.3494l.0019-.0034ZM14.875,12h2.25v9h-2.25ZM16,26a1.5,1.5,0,1,1,1.5-1.5A1.5,1.5,0,0,1,16,26Z\"\n ></path>\n <path\n d=\"M29,30H3a1,1,0,0,1-.8872-1.4614l13-25a1,1,0,0,1,1.7744,0l13,25A1,1,0,0,1,29,30ZM4.6507,28H27.3493l.002-.0033L16.002,6.1714h-.004L4.6487,27.9967Z\"\n ></path>\n <title>Warning alt filled</title>\n </svg>\n {{ node.control.alert | translate }}\n</label>\n\n<div\n *ngIf=\"node.question.controlType === 1\"\n [hidden]=\"node.control.hidden\"\n [ngClass]=\"{ disabled: node.control.disabled }\"\n>\n <!--ARRAY CONTROL-->\n <div [ngSwitch]=\"node.question.renderingType\">\n <div class=\"well\" *ngSwitchCase=\"'repeating'\">\n <h4 style=\"margin: 2px; font-weight: bold\">\n {{ node.question.label | translate }}\n </h4>\n <div>\n <label\n class=\"cds--label\"\n *ngIf=\"node.question.extras.questionOptions.min\"\n style=\"margin-right: 2px\"\n >min: {{ node.question.extras.questionOptions.min }}</label\n >\n <label\n class=\"cds--label\"\n *ngIf=\"node.question.extras.questionOptions.max\"\n >max: {{ node.question.extras.questionOptions.max }}</label\n >\n </div>\n <hr class=\"divider\" />\n <div [ngSwitch]=\"node.question.extras.type\">\n <div *ngSwitchCase=\"'testOrder'\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n >\n </ofe-form-renderer>\n <div *ngIf=\"child.orderNumber\" class=\"order-number\">\n <span\n >{{ 'orderNumber' | translate }}: {{ child.orderNumber }}\n </span>\n </div>\n <div class=\"cds--layout\">\n <button\n type=\"button \"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n </div>\n <br />\n <hr class=\"divider\" />\n </div>\n </div>\n\n <div *ngSwitchCase=\"'diagnosis'\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n\n <button\n type=\"button \"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n <br />\n <hr class=\"divider\" />\n </div>\n </div>\n\n <div *ngSwitchCase=\"'obsGroup'\" style=\"margin-bottom: 20px\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n [controlId]=\"i\"\n ></ofe-form-renderer>\n\n <button\n type=\"button\"\n style=\"width: 100px\"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n <br />\n <hr class=\"divider\" />\n </div>\n </div>\n <div *ngSwitchCase=\"'diagnosisGroup'\" style=\"margin-bottom: 20px\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n [controlId]=\"i\"\n ></ofe-form-renderer>\n\n <button\n type=\"button\"\n style=\"width: 100px\"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n <br />\n <hr class=\"divider\" />\n </div>\n </div>\n </div>\n <button\n type=\"button\"\n class=\"cds--btn cds--btn--primary cds--btn--sm\"\n (click)=\"node.createChildNode()\"\n [ngClass]=\"{\n disabled:\n node.children.length >= node.question.extras.questionOptions.max\n }\"\n >\n {{ 'add' | translate }}\n </button>\n </div>\n </div>\n</div>\n\n<div\n *ngIf=\"node.question.controlType === 2\"\n [hidden]=\"node.control.hidden\"\n [ngClass]=\"{ disabled: node.control.disabled }\"\n>\n <!--GROUP-->\n <div [ngSwitch]=\"node.question.renderingType\">\n <div *ngSwitchCase=\"'group'\">\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"node.control\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n </div>\n <div\n *ngSwitchCase=\"'field-set'\"\n style=\"border: 1px solid #eeeeee; padding: 2px; margin: 2px\"\n >\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"node.control\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n </div>\n </div>\n</div>\n", styles: [".button-set{margin-top:1rem}.nav-button{border-top:1px solid #dde1e6;height:5rem;max-width:50%;min-width:50%;padding-block:.25rem;align-items:center}.nav-link{min-width:100%;display:flex;align-items:flex-start;flex-direction:column}.nav-link-text{margin-top:.125rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:calc(100% - .25rem);font-size:var(--cds-heading-03-font-size, 1.25rem);font-weight:var(--cds-heading-03-font-weight, 400);line-height:var(--cds-heading-03-line-height, 1.4);letter-spacing:var(--cds-heading-03-letter-spacing, 0)}.nav-label{font-size:var(--cds-label-01-font-size, .75rem);font-weight:var(--cds-label-01-font-weight, 400);line-height:var(--cds-label-01-line-height, 1.33333);letter-spacing:var(--cds-label-01-letter-spacing, .32px)}ul{list-style-type:none;margin:2px auto;position:relative}li{display:block;padding:10px 20px;transition:all .3s ease-in;border-bottom:4px solid transparent}li:hover{border-bottom:4px solid white;opacity:.7;cursor:pointer}.owl-theme .owl-controls .owl-nav{position:absolute;width:100%;top:0}.owl-theme .owl-controls .owl-nav [class*=owl-]{position:absolute;background:none;color:#000}.owl-theme .owl-controls .owl-nav [class*=owl-]:hover{background:none;color:#000}.owl-theme .owl-controls .owl-nav .owl-next{right:0;transform:translate(120%)}.owl-theme .owl-controls .owl-nav .owl-prev{left:0;transform:translate(-120%)}.disabled{opacity:.5;pointer-events:none}.select2-container{margin-top:-5px}.btn{padding:0 12px!important}.form-tooltip{color:#337ab7;display:inline-block}.question-info{opacity:0;height:0px;display:none;transition-duration:opacity 1s ease-out;transition-delay:.5s;padding-top:2px;padding-bottom:2px;color:#696969;border-style:ridge;border-width:1px;border-color:#337ab7;margin-top:.25rem}.hide-info{display:none;height:0px}.form-tooltip:hover~.question-info{display:block;opacity:1;height:auto}.form-tooltip .tooltipcontent:after{content:\" \";position:absolute;bottom:100%;right:0%;margin-left:-5px;border-width:5px;border-style:solid;border-top-color:transparent;border-right-color:transparent;border-bottom-color:#337ab7;border-left-color:transparent}ng-select.form-control{padding-top:0;height:auto;padding-bottom:0}.forms-dropdown-menu{max-height:450px;overflow-y:scroll}.no-border{border:0;box-shadow:none}.text-danger{color:var(--cds-support-01, #da1e28)}.text-warn{color:#eea616}.error{margin-top:.25rem}.warning{display:flex;align-items:center;margin:0 .25rem .75rem}.warning svg{margin-right:.25rem}.afe-control{margin-bottom:.125rem}[hidden]{display:none!important}.accordion-content-dark{background-color:#f4f4f4;padding-right:1rem}.accordion-content-override{box-sizing:content-box;border-bottom:none;padding:0;overflow-wrap:break-word}.accordion-content-override:hover{opacity:unset;border-bottom:none}.question-area{margin-bottom:.5rem;width:100%;min-width:18rem}.question-area>label{overflow-wrap:break-word}.in-line{display:inline-block;padding-right:.5rem}.use-value{overflow-wrap:break-word}.custom-text-area{width:100%}.container .cds--inline-notification--error{display:flex;align-items:center}.container .cds--inline-notification--error svg{margin-left:1rem;margin-block-start:0}.container .cds--inline-notification--low-contrast:before{border-width:1px 1px 0 0}.divider{border-color:#e0e0e0;border-style:solid;border-bottom:none;margin:.75rem 0rem}.order-number{margin:1rem 0}.well{margin-bottom:1rem}\n"] }]
|
|
8780
|
+
args: [{ selector: 'ofe-form-renderer', template: "<!--CONTAINERS-->\n<div *ngIf=\"node.question.renderingType === 'form'\">\n <ofe-tab-set\n (tabSelect)=\"tabSelected($event)\"\n [selectedIndex]=\"activeTab\"\n [formSubmissionTemplate]=\"formSubmissionTemplate\"\n >\n <ofe-tab\n [tabTitle]=\"question.label | translate\"\n *ngFor=\"let question of node.question.questions; let i = index\"\n >\n <ofe-form-renderer\n [node]=\"node.children[question.key] | translate\"\n [parentComponent]=\"this\"\n [parentGroup]=\"node.control\"\n [labelMap]=\"labelMap\"\n >\n </ofe-form-renderer>\n\n <!-- Buttons for navigating between tabs -->\n <section *ngIf=\"this.hasMultiplePages\">\n <div class=\"button-set\">\n <button\n class=\"cds--btn cds--btn--ghost nav-button\"\n [disabled]=\"i === 0\"\n type=\"button\"\n >\n <a\n *ngIf=\"i > 0\"\n (click)=\"tabSelected(i - 1)\"\n class=\"nav-link\"\n [title]=\"node.question.questions[i - 1].label | translate\"\n >\n <label class=\"nav-label\">{{ 'previous' | translate }}</label>\n <span class=\"nav-link-text\">{{\n node.question.questions[i - 1].label | translate\n }}</span>\n </a>\n </button>\n <button\n class=\"cds--btn cds--btn--ghost nav-button\"\n [disabled]=\"i === node.question.questions.length - 1\"\n type=\"button\"\n >\n <a\n *ngIf=\"i < node.question.questions.length - 1\"\n (click)=\"tabSelected(i + 1)\"\n class=\"nav-link\"\n [title]=\"node.question.questions[i + 1].label | translate\"\n >\n <label class=\"nav-label\">{{ 'next' | translate }}</label>\n <span class=\"nav-link-text\">{{\n node.question.questions[i + 1].label | translate\n }}</span>\n </a>\n </button>\n </div>\n </section>\n </ofe-tab>\n\n <!-- TODO: Figure out why is this code doing the same thing as the ErrorRenderer component -->\n <div *ngIf=\"showErrors()\" class=\"container\">\n <div\n data-notification\n *ngFor=\"let errorNode of errorNodes\"\n class=\"cds--inline-notification cds--inline-notification--error cds--inline-notification--low-contrast pointer\"\n role=\"alert\"\n (click)=\"announceErrorField(errorNode)\"\n >\n <div class=\"cds--inline-notification__details\">\n <div class=\"cds--inline-notification__text-wrapper\">\n <p class=\"cds--inline-notification__title\">\n {{ errorNode.question.label | translate }}\n </p>\n <p class=\"cds--inline-notification__subtitle\">\n {{ getControlError(errorNode | translate) }}\n </p>\n </div>\n </div>\n <button\n tabindex=\"0\"\n class=\"cds--inline-notification__action-button cds--btn cds--btn--sm cds--btn--ghost\"\n type=\"button\"\n >\n {{ 'fix' | translate }}\n </button>\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n style=\"will-change: transform\"\n xmlns=\"http://www.w3.org/2000/svg\"\n class=\"cds--inline-notification__icon\"\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n aria-hidden=\"true\"\n >\n <path\n d=\"M10,1c-5,0-9,4-9,9s4,9,9,9s9-4,9-9S15,1,10,1z M13.5,14.5l-8-8l1-1l8,8L13.5,14.5z\"\n ></path>\n <path\n d=\"M13.5,14.5l-8-8l1-1l8,8L13.5,14.5z\"\n data-icon-path=\"inner-path\"\n opacity=\"0\"\n ></path>\n </svg>\n </div>\n </div>\n </ofe-tab-set>\n</div>\n\n<div *ngIf=\"node.question.renderingType === 'page'\">\n <!--Page Components-->\n <ofe-custom-component-wrapper\n [dark]=\"theme === 'light'\"\n [componentConfigs]=\"node.question.componentConfigs\"\n ></ofe-custom-component-wrapper>\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"parentGroup\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n</div>\n\n<div *ngIf=\"node.question.renderingType === 'section' && checkSection(node)\">\n <div class=\"cds--layout\">\n <ul class=\"cds--accordion cds--accordion--end\">\n <li\n class=\"cds--accordion__item accordion-content-override\"\n [ngClass]=\"{ 'cds--accordion__item--active': !isCollapsed }\"\n >\n <button\n type=\"button\"\n aria-controls=\"accordion-item-:r27:\"\n aria-expanded=\"false\"\n (click)=\"isCollapsed = !isCollapsed\"\n class=\"cds--accordion__heading\"\n >\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n aria-hidden=\"true\"\n class=\"cds--accordion__arrow\"\n >\n <path d=\"M11 8L6 13 5.3 12.3 9.6 8 5.3 3.7 6 3z\"></path>\n </svg>\n <div class=\"cds--accordion__title\">\n {{ node.question.label | translate }}\n </div>\n </button>\n <div id=\"accordion-item-:r27:\" class=\"cds--accordion__content\">\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"parentGroup\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n </div>\n </li>\n </ul>\n </div>\n</div>\n\n<!--CONTROLS-->\n\n<div\n *ngIf=\"node.question.controlType === 0\"\n [formGroup]=\"parentGroup\"\n [hidden]=\"node.control.hidden\"\n [ngClass]=\"{ disabled: node.control.disabled }\"\n>\n <ofe-custom-component-wrapper\n [dark]=\"!(theme === 'light')\"\n [componentConfigs]=\"node.question.componentConfigs\"\n ></ofe-custom-component-wrapper>\n <div class=\"cds--form-item\">\n <!--LEAF CONTROL-->\n <div class=\"question-area\">\n <a\n class=\"form-tooltip pull-right\"\n (click)=\"toggleInformation(node.question.extras.id)\"\n data-placement=\"right\"\n *ngIf=\"\n node.question &&\n node.question.extras.questionInfo &&\n node.question.extras.questionInfo !== '' &&\n node.question.extras.questionInfo !== ' '\n \"\n >\n <i class=\"glyphicon glyphicon-question-sign\" aria-hidden=\"true\"></i>\n </a>\n\n <label\n *ngIf=\"node.question.label\"\n [style.color]=\"hasErrors() ? 'red' : ''\"\n class=\"cds--label\"\n [attr.for]=\"node.question.key | translate\"\n >\n {{ node.question.required ? '*' : '' }}\n {{ node.question.prefix ? node.question.prefix + ' ' : '' }}\n {{ node.question.label | translate }}\n </label>\n\n <div\n *ngIf=\"\n node.question.extras.questionOptions.customControl;\n else nativeControls\n \"\n >\n <ofe-custom-control-wrapper\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n [question]=\"node.question\"\n ></ofe-custom-control-wrapper>\n </div>\n\n <ng-template #nativeControls>\n <div class=\"afe-control\" [ngSwitch]=\"node.question.renderingType\">\n <ofe-select\n [theme]=\"theme\"\n *ngSwitchCase=\"'select'\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n >\n <option\n *ngFor=\"let option of node.question.options\"\n [value]=\"option.value\"\n >\n {{ option.label | translate }}\n </option>\n </ofe-select>\n\n <div *ngSwitchCase=\"'file'\">\n <ofe-file-upload\n [dataSource]=\"dataSource\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n (fileChanged)=\"upload($event)\"\n ></ofe-file-upload>\n </div>\n\n <textarea\n [theme]=\"theme\"\n ofeTextAreaInput\n [ngClass]=\"{\n 'cds--text-area--light': theme === 'light',\n 'cds--text-area--invalid': !node.control.valid\n }\"\n [placeholder]=\"node.question.placeholder | translate\"\n [rows]=\"node.question.rows\"\n class=\"cds--text-area\"\n *ngSwitchCase=\"'textarea'\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n [readOnly]=\"node.question.extras.readOnly\"\n >\n </textarea>\n\n <ofe-remote-select\n [theme]=\"theme\"\n *ngSwitchCase=\"'remote-select'\"\n [placeholder]=\"node.question.placeholder | translate\"\n tabindex=\"0\"\n [dataSource]=\"dataSource\"\n [componentID]=\"node.question.key + 'id'\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n ></ofe-remote-select>\n\n <ofe-ngx-date-time-picker\n [weeks]=\"node.question.extras.questionOptions.weeksList\"\n [showWeeks]=\"node.question.showWeeksAdder\"\n [theme]=\"theme\"\n [id]=\"node.question.key + 'id'\"\n [formControlName]=\"node.question.key\"\n *ngSwitchCase=\"'date'\"\n [datePickerFormat]=\"node.question.datePickerFormat\"\n ></ofe-ngx-date-time-picker>\n\n <ng-select\n [ngClass]=\"{\n 'afe-custom': theme === 'light',\n invalid: node.control.touched && !node.control.valid ? true : null\n }\"\n [id]=\"node.question.key + 'id'\"\n *ngSwitchCase=\"'multi-select'\"\n [multiple]=\"true\"\n [appendTo]=\"'#' + node.question.key + 'id'\"\n placeholder=\"\"\n clearAllText=\"Clear\"\n [formControlName]=\"node.question.key\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n >\n <ng-option\n *ngFor=\"let option of node.question.options\"\n [value]=\"option.value\"\n >\n {{ option.label | translate }}\n </ng-option>\n </ng-select>\n\n <ng-select\n [ngClass]=\"{\n 'afe-custom': theme === 'light',\n invalid: node.control.touched && !node.control.valid ? true : null\n }\"\n [id]=\"node.question.key + 'id'\"\n *ngSwitchCase=\"'single-select'\"\n placeholder=\"\"\n clearAllText=\"Clear\"\n [formControlName]=\"node.question.key\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n >\n <ng-option\n *ngFor=\"let option of node.question.options\"\n [value]=\"option.value\"\n >\n {{ option.label | translate }}\n </ng-option>\n </ng-select>\n\n <ofe-number-input\n [theme]=\"theme\"\n *ngSwitchCase=\"'number'\"\n [id]=\"node.question.key + 'id'\"\n [min]=\"node.question.extras.questionOptions.min\"\n [max]=\"node.question.extras.questionOptions.max\"\n [maxlength]=\"node.question.extras.questionOptions.maxLength\"\n [minlength]=\"node.question.extras.questionOptions.minLength\"\n [formControlName]=\"node.question.key\"\n [attr.placeholder]=\"node.question.placeholder | translate\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n ></ofe-number-input>\n\n <ofe-number-input\n [theme]=\"theme\"\n *ngSwitchCase=\"'decimal'\"\n [id]=\"node.question.key + 'id'\"\n [min]=\"node.question.extras.questionOptions.min\"\n [max]=\"node.question.extras.questionOptions.max\"\n [formControlName]=\"node.question.key\"\n [attr.placeholder]=\"node.question.placeholder | translate\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n ></ofe-number-input>\n\n <div *ngSwitchCase=\"'workspace-launcher'\">\n <ofe-workspace-launcher\n [id]=\"node.question.key + 'id'\"\n [buttonLabel]=\"node.question.extras.questionOptions.buttonLabel\"\n [buttonType]=\"node.question.extras.questionOptions.buttonType\"\n [workspaceName]=\"\n node.question.extras.questionOptions.workspaceName\n \"\n ></ofe-workspace-launcher>\n </div>\n\n <input\n [theme]=\"theme\"\n class=\"cds--text-input\"\n ofeTextInput\n *ngSwitchDefault\n [formControlName]=\"node.question.key\"\n [attr.placeholder]=\"node.question.placeholder | translate\"\n [type]=\"node.question.renderingType\"\n [id]=\"node.question.key + 'id'\"\n [readOnly]=\"node.question.extras.readOnly\"\n />\n\n <div *ngSwitchCase=\"'radio'\">\n <ofe-radio-button\n [id]=\"node.question.key + 'id' + controlId\"\n [formControlName]=\"node.question.key\"\n [options]=\"node.question.options\"\n [allowUnselect]=\"node.question.allowUnselect\"\n [selected]=\"node.control.value\"\n [orientation]=\"node.question.orientation\"\n [readonly]=\"node.question.readOnly\"\n ></ofe-radio-button>\n </div>\n\n <div *ngSwitchCase=\"'checkbox'\">\n <ofe-checkbox\n [id]=\"node.question.key + 'id' + controlId\"\n [formControlName]=\"node.question.key\"\n [options]=\"node.question.options\"\n [selected]=\"node.control.value\"\n ></ofe-checkbox>\n </div>\n\n <div\n *ngIf=\"\n node.question.enableHistoricalValue &&\n node.question.historicalDisplay\n \"\n style=\"margin-top: 2px\"\n >\n <div class=\"container-fluid\">\n <div class=\"use-value\">\n <div class=\"col-xs-9\">\n <span class=\"text-warning\"\n >{{ 'previousValue' | translate }}:\n </span>\n <strong>{{ node.question.historicalDisplay?.text }}</strong>\n <span *ngIf=\"node.question.showHistoricalValueDate\">\n <span> | </span>\n <strong class=\"text-primary\"\n >{{ node.question.historicalDisplay?._date | date }}\n </strong>\n <span\n class=\"text-primary\"\n *ngIf=\"\n node.question.historicalDisplay &&\n node.question.historicalDisplay._date\n \"\n >\n ({{\n node.question.historicalDisplay._date | timeAgo\n }})</span\n >\n </span>\n </div>\n <button\n type=\"button\"\n [name]=\"'historyValue'\"\n class=\"cds--btn cds--btn--primary cds--btn--sm col-xs-3\"\n >\n {{ 'useValue' | translate }}\n </button>\n </div>\n </div>\n </div>\n <ofe-appointments-overview [node]=\"node\"></ofe-appointments-overview>\n <div class=\"error\" *ngIf=\"hasErrors()\">\n <div *ngFor=\"let e of errors()\">\n <span class=\"text-danger\">{{ e }}</span>\n </div>\n </div>\n </div>\n </ng-template>\n\n <div\n class=\"question-info col-md-12 col-lg-12 col-sm-12\"\n id=\"{{ node.question.extras.id }}\"\n *ngIf=\"\n node.question &&\n node.question.extras.questionInfo &&\n node.question.extras.questionInfo !== '' &&\n node.question.extras.questionInfo !== ' '\n \"\n >\n {{ node.question.extras.questionInfo | translate }}\n </div>\n </div>\n </div>\n</div>\n\n<!-- MESSAGES -->\n<label\n *ngIf=\"node.control && node.control.alert && node.control.alert !== ''\"\n class=\"cds--label text-warn warning\"\n>\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\"\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 32 32\"\n aria-hidden=\"true\"\n >\n <path\n fill=\"none\"\n d=\"M16,26a1.5,1.5,0,1,1,1.5-1.5A1.5,1.5,0,0,1,16,26Zm-1.125-5h2.25V12h-2.25Z\"\n data-icon-path=\"inner-path\"\n ></path>\n <path\n d=\"M16.002,6.1714h-.004L4.6487,27.9966,4.6506,28H27.3494l.0019-.0034ZM14.875,12h2.25v9h-2.25ZM16,26a1.5,1.5,0,1,1,1.5-1.5A1.5,1.5,0,0,1,16,26Z\"\n ></path>\n <path\n d=\"M29,30H3a1,1,0,0,1-.8872-1.4614l13-25a1,1,0,0,1,1.7744,0l13,25A1,1,0,0,1,29,30ZM4.6507,28H27.3493l.002-.0033L16.002,6.1714h-.004L4.6487,27.9967Z\"\n ></path>\n <title>Warning alt filled</title>\n </svg>\n {{ node.control.alert | translate }}\n</label>\n\n<div\n *ngIf=\"node.question.controlType === 1\"\n [hidden]=\"node.control.hidden\"\n [ngClass]=\"{ disabled: node.control.disabled }\"\n>\n <!--ARRAY CONTROL-->\n <div [ngSwitch]=\"node.question.renderingType\">\n <div class=\"well\" *ngSwitchCase=\"'repeating'\">\n <h4 style=\"margin: 2px; font-weight: bold\">\n {{ node.question.label | translate }}\n </h4>\n <div>\n <label\n class=\"cds--label\"\n *ngIf=\"node.question.extras.questionOptions.min\"\n style=\"margin-right: 2px\"\n >min: {{ node.question.extras.questionOptions.min }}</label\n >\n <label\n class=\"cds--label\"\n *ngIf=\"node.question.extras.questionOptions.max\"\n >max: {{ node.question.extras.questionOptions.max }}</label\n >\n </div>\n <hr class=\"divider\" />\n <div [ngSwitch]=\"node.question.extras.type\">\n <div *ngSwitchCase=\"'testOrder'\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n >\n </ofe-form-renderer>\n <div *ngIf=\"child.orderNumber\" class=\"order-number\">\n <span\n >{{ 'orderNumber' | translate }}: {{ child.orderNumber }}\n </span>\n </div>\n <div class=\"cds--layout\">\n <button\n type=\"button \"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n </div>\n <br />\n <hr class=\"divider\" />\n </div>\n </div>\n\n <div *ngSwitchCase=\"'diagnosis'\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n\n <button\n type=\"button \"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n <br />\n <hr class=\"divider\" />\n </div>\n </div>\n\n <div *ngSwitchCase=\"'obsGroup'\" style=\"margin-bottom: 20px\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n [controlId]=\"i\"\n ></ofe-form-renderer>\n\n <button\n type=\"button\"\n style=\"width: 100px\"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n <br />\n <hr class=\"divider\" />\n </div>\n </div>\n <div *ngSwitchCase=\"'diagnosisGroup'\" style=\"margin-bottom: 20px\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n [controlId]=\"i\"\n ></ofe-form-renderer>\n\n <button\n type=\"button\"\n style=\"width: 100px\"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n <br />\n <hr class=\"divider\" />\n </div>\n </div>\n </div>\n <button\n type=\"button\"\n class=\"cds--btn cds--btn--primary cds--btn--sm\"\n (click)=\"node.createChildNode()\"\n [ngClass]=\"{\n disabled:\n node.children.length >= node.question.extras.questionOptions.max\n }\"\n >\n {{ 'add' | translate }}\n </button>\n </div>\n </div>\n</div>\n\n<div\n *ngIf=\"node.question.controlType === 2\"\n [hidden]=\"node.control.hidden\"\n [ngClass]=\"{ disabled: node.control.disabled }\"\n>\n <!--GROUP-->\n <div [ngSwitch]=\"node.question.renderingType\">\n <div *ngSwitchCase=\"'group'\">\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"node.control\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n </div>\n <div\n *ngSwitchCase=\"'field-set'\"\n style=\"border: 1px solid #eeeeee; padding: 2px; margin: 2px\"\n >\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"node.control\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n </div>\n </div>\n</div>\n", styles: [".button-set{margin-top:1rem}.nav-button{border-top:1px solid #dde1e6;height:5rem;max-width:50%;min-width:50%;padding-block:.25rem;align-items:center}.nav-link{min-width:100%;display:flex;align-items:flex-start;flex-direction:column}.nav-link-text{margin-top:.125rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:calc(100% - .25rem);font-size:var(--cds-body-01-font-size, .875rem);font-weight:var(--cds-body-01-font-weight, 400);line-height:var(--cds-body-01-line-height, 1.42857);letter-spacing:var(--cds-body-01-letter-spacing, .16px)}.nav-label{font-size:var(--cds-label-01-font-size, .75rem);font-weight:var(--cds-label-01-font-weight, 400);line-height:var(--cds-label-01-line-height, 1.33333);letter-spacing:var(--cds-label-01-letter-spacing, .32px);color:#525252}ul{list-style-type:none;margin:2px auto;position:relative}li{display:block;padding:10px 20px;transition:all .3s ease-in;border-bottom:4px solid transparent}li:hover{border-bottom:4px solid white;opacity:.7;cursor:pointer}.owl-theme .owl-controls .owl-nav{position:absolute;width:100%;top:0}.owl-theme .owl-controls .owl-nav [class*=owl-]{position:absolute;background:none;color:#000}.owl-theme .owl-controls .owl-nav [class*=owl-]:hover{background:none;color:#000}.owl-theme .owl-controls .owl-nav .owl-next{right:0;transform:translate(120%)}.owl-theme .owl-controls .owl-nav .owl-prev{left:0;transform:translate(-120%)}.disabled{opacity:.5;pointer-events:none}.select2-container{margin-top:-5px}.btn{padding:0 12px!important}.form-tooltip{color:#337ab7;display:inline-block}.question-info{opacity:0;height:0px;display:none;transition-duration:opacity 1s ease-out;transition-delay:.5s;padding-top:2px;padding-bottom:2px;color:#696969;border-style:ridge;border-width:1px;border-color:#337ab7;margin-top:.25rem}.hide-info{display:none;height:0px}.form-tooltip:hover~.question-info{display:block;opacity:1;height:auto}.form-tooltip .tooltipcontent:after{content:\" \";position:absolute;bottom:100%;right:0%;margin-left:-5px;border-width:5px;border-style:solid;border-top-color:transparent;border-right-color:transparent;border-bottom-color:#337ab7;border-left-color:transparent}ng-select.form-control{padding-top:0;height:auto;padding-bottom:0}.forms-dropdown-menu{max-height:450px;overflow-y:scroll}.no-border{border:0;box-shadow:none}.text-danger{color:var(--cds-support-01, #da1e28)}.text-warn{color:#eea616}.error{margin-top:.25rem}.warning{display:flex;align-items:center;margin:0 .25rem .75rem}.warning svg{margin-right:.25rem}.afe-control{margin-bottom:.125rem}[hidden]{display:none!important}.accordion-content-dark{background-color:#f4f4f4;padding-right:1rem}.accordion-content-override{box-sizing:content-box;border-bottom:none;padding:0;overflow-wrap:break-word}.accordion-content-override:hover{opacity:unset;border-bottom:none}.question-area{margin-bottom:.5rem;width:100%;min-width:18rem}.question-area>label{overflow-wrap:break-word}.in-line{display:inline-block;padding-right:.5rem}.use-value{overflow-wrap:break-word}.custom-text-area{width:100%}.container .cds--inline-notification--error{display:flex;align-items:center}.container .cds--inline-notification--error svg{margin-left:1rem;margin-block-start:0}.container .cds--inline-notification--low-contrast:before{border-width:1px 1px 0 0}.divider{border-color:#e0e0e0;border-style:solid;border-bottom:none;margin:.75rem 0rem}.order-number{margin:1rem 0}.well{margin-bottom:1rem}\n"] }]
|
|
8781
8781
|
}], ctorParameters: function () { return [{ type: ValidationFactory }, { type: DataSources }, { type: FormErrorsService }, { type: i1.TranslateService }, { type: Document, decorators: [{
|
|
8782
8782
|
type: Inject,
|
|
8783
8783
|
args: [DOCUMENT]
|
|
@@ -14817,7 +14817,8 @@ class PatientIdentifierAdapter {
|
|
|
14817
14817
|
}
|
|
14818
14818
|
getPatientIdentifierTypeNodes(rootNode, array) {
|
|
14819
14819
|
if (rootNode.question.extras &&
|
|
14820
|
-
rootNode.question.extras.type === 'patientIdentifier'
|
|
14820
|
+
rootNode.question.extras.type === 'patientIdentifier' &&
|
|
14821
|
+
rootNode.control.hidden === false) {
|
|
14821
14822
|
array.push(rootNode);
|
|
14822
14823
|
}
|
|
14823
14824
|
if (rootNode instanceof GroupNode) {
|