jconsumer-shared 1.0.1 → 1.0.2

package/fesm2022/jconsumer-shared.mjs

@@ -1,3 +1,4 @@
+import { loadRemoteModule } from '@angular-architects/native-federation';
 import * as i0 from '@angular/core';
 import { Injectable, NgModule, Component, Input, Inject, Pipe, EventEmitter, Output, ViewChild, NO_ERRORS_SCHEMA, CUSTOM_ELEMENTS_SCHEMA, forwardRef, ENVIRONMENT_INITIALIZER, inject, Injector, runInInjectionContext } from '@angular/core';
 import * as i1 from '@angular/common/http';
@@ -46,6 +47,21 @@ import * as i3 from '@angular/material/radio';
 import { MatRadioModule } from '@angular/material/radio';
 import Video from 'twilio-video';
 
+const remoteEntryCache = {};
+/**
+ * Load remote module with caching to avoid redundant network requests
+ */
+function loadRemoteModuleWithCache(options) {
+    const { remoteEntry, exposedModule } = options;
+    if (!remoteEntryCache[remoteEntry]) {
+        remoteEntryCache[remoteEntry] = loadRemoteModule({
+            remoteEntry,
+            exposedModule,
+        });
+    }
+    return remoteEntryCache[remoteEntry];
+}
+
 class ServiceMeta {
     http;
     constructor(http) {
@@ -378,9 +394,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
         }], ctorParameters: () => [] });
 
 class ThemeService {
+    cdr;
     renderer;
     themeLinkElement = null;
-    constructor(rendererFactory) {
+    constructor(rendererFactory, cdr) {
+        this.cdr = cdr;
         this.renderer = rendererFactory.createRenderer(null, null);
     }
     loadTheme(themeName) {
@@ -394,8 +412,11 @@ class ThemeService {
         this.themeLinkElement.href = `./assets/scss/themes/${themeName}.scss`; // Path to your theme files
         // Append the new theme to the document head
         this.renderer.appendChild(document.head, this.themeLinkElement);
+        setTimeout(() => {
+            this.cdr.detectChanges(); // Force UI update
+        }, 100);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ThemeService, deps: [{ token: i0.RendererFactory2 }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ThemeService, deps: [{ token: i0.RendererFactory2 }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ThemeService, providedIn: 'root' });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ThemeService, decorators: [{
@@ -403,7 +424,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             args: [{
                     providedIn: 'root',
                 }]
-        }], ctorParameters: () => [{ type: i0.RendererFactory2 }] });
+        }], ctorParameters: () => [{ type: i0.RendererFactory2 }, { type: i0.ChangeDetectorRef }] });
 
 function HttpLoaderFactory(http, sharedService) {
     return new TranslateHttpLoader(http, sharedService.getI8nPath() + 'assets/i18n/', '.json');
@@ -3061,11 +3082,11 @@ class ConfirmBoxComponent {
         this.dialogRef.close(post_data);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ConfirmBoxComponent, deps: [{ token: i1$4.MatDialogRef }, { token: MAT_DIALOG_DATA }, { token: i2.FormBuilder }, { token: FormMessageDisplayService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ConfirmBoxComponent, selector: "app-confirm-box", ngImport: i0, template: "<form [formGroup]=\"amForm\" [ngClass]=\"this.data.theme\" novalidate (ngSubmit)=\"amForm.valid && onSubmit(amForm.value)\">\r\n  <h1 class=\"mat-dialog-title\">\r\n    <button #queue mat-dialog-close class=\"modal_close\">\r\n      <i class=\"fa fa-window-close\" aria-hidden=\"true\"></i>\r\n    </button>\r\n  </h1>\r\n  <div mat-dialog-content>\r\n    <p class=\"mb-4 fontsize\"> {{data.message}}</p>\r\n    <div *ngIf=\"data && data.cancelPolicy\" class=\"policies\">\r\n      <p-accordion [multiple]=\"true\">\r\n        <p-accordionTab>\r\n          <ng-template pTemplate=\"header\">\r\n            <h4>Cancellation Policies</h4>\r\n          </ng-template>\r\n          <p>You can cancel your {{data.book}}s any time until\r\n            <span *ngIf=\"data.wtlist.date\">{{data.wtlist.date| date:\r\n              newDateFormat}}</span><span *ngIf=\"data.wtlist.appmtDate\">{{data.wtlist.appmtDate| date:\r\n              newDateFormat}}</span><span *ngIf=\"data.wtlist.orderDate\">{{data.wtlist.orderDate| date:\r\n              newDateFormat}}</span>.<span\r\n              *ngIf=\"data.wtlist && data.wtlist.providerAccount && data.wtlist.providerAccount.businessName\">\r\n              If the system doesn\u2019t permit your cancellation,\r\n              contact your provider, {{data.wtlist.providerAccount.businessName}}.\r\n              It\u2019s important to note that the\r\n              provider may cancel your bookings at their discretion for their own reasons.\r\n              Jaldee will keep you informed promptly regarding the changes through timely notifications.\r\n            </span>\r\n          </p>\r\n        </p-accordionTab>\r\n        <p-accordionTab>\r\n          <ng-template pTemplate=\"header\">\r\n            <h4>Refund policy for Advance Payments(only)</h4>\r\n          </ng-template>\r\n          <p>\r\n            In the case of your cancellation, a 3% (payment gateway fee) will be deducted from the refund\r\n            of the advanced payment made. For same-day cancellations, kindly contact your service provider,\r\n            {{data.wtlist.providerAccount.businessName}} to initiate the refund. For any refund-related queries, reach\r\n            out to\r\n            {{data.wtlist.providerAccount.businessName}} for assistance.\r\n          </p>\r\n        </p-accordionTab>\r\n      </p-accordion>\r\n      <p class=\"mt-4\"> Are you sure you want to cancel this {{data.book}}? </p>\r\n    </div>\r\n    <div *ngIf=\"data.book !== 'Order' && data.cancelPolicy\">\r\n      <div class=\"form-group\">\r\n        <label class=\"col-form-label\" for=\"displayName\">{{select_reason_cap}}*</label>\r\n        <mat-chip-list>\r\n          <mat-chip *ngFor=\"let cancel_reason of cancel_reasons\" class=\"me-2 mb-2\"\r\n            color=\"{{(cancel_reason.value === amForm.get('reason').value) ? 'primary' : ''}}\"\r\n            selected=\"{{(cancel_reason.value === amForm.get('reason').value) ? true : false}}\"\r\n            [class.selected]=\"(cancel_reason.value === amForm.get('reason').value) ? true : false\"\r\n            (click)=\"selectReason(cancel_reason)\">\r\n            {{cancel_reason.title}}\r\n          </mat-chip>\r\n        </mat-chip-list>\r\n      </div>\r\n      <div class=\"form-group mt-2\">\r\n        <mat-checkbox formControlName=\"send_message\">{{send_message_cap}} {{rep_username}}</mat-checkbox>\r\n      </div>\r\n      <div class=\"form-group reason-area\" *ngIf=\"amForm.get('send_message').value\">\r\n        <textarea  class=\"form-control\" rows=\"3\"  id=\"message\" pInputTextarea placeholder=\"Message\" formControlName=\"message\"></textarea>\r\n        <app-field-error-display [displayError]=\"fed_service.isFieldValid(amForm,'message')\"\r\n          errorMsg=\"Please enter a message.\">\r\n        </app-field-error-display>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <div mat-dialog-actions *ngIf=\"data.book !== 'Order'&& data.cancelPolicy\" class=\"mb-2\">\r\n    <div class=\"col-md-12\" style=\"margin-top: 15px;display: inline-flex;\">\r\n      <button type=\"button\" mat-dialog-close class=\"cs-btn bt2\">{{cancel_btn_cap}}</button>\r\n      <button type=\"submit\" mat-button [disabled]=\"!amForm.valid\" class=\"cs-btn bt1\">{{ok_btn_cap}}</button>\r\n    </div>\r\n  </div>\r\n  <app-field-error-display [displayError]=\"true\" *ngIf=\"api_error\" errorMsg=\"{{api_error}}\"></app-field-error-display>\r\n  <app-form-success-display [displayMsg]=\"true\" *ngIf=\"api_success\" successMsg=\"{{api_success}}\">\r\n  </app-form-success-display>\r\n  <div mat-dialog-actions class=\"paddingtop\" *ngIf=\"data.book !== 'Order' && !data.cancelPolicy\">\r\n    <button tabindex=\"-1\" (click)=\"onClick(0)\" class=\"cs-btn bt2\">{{cancel_btn_cap}}</button>\r\n    <button tabindex=\"2\" (click)=\"onClick(1)\"\r\n      class=\"cs-btn bt1 reddelete checkavailabilitybutton\">{{ok_btn_cap}}</button>\r\n  </div>\r\n  <app-field-error-display [displayError]=\"true\" *ngIf=\"showError\" errorMsg=\"Department name is required\">\r\n  </app-field-error-display>\r\n</form>", styles: [".mat-dialog-actions button{padding:10px 25px!important}.mat-dialog-title{color:#222223;background:#183e79;height:50px!important}.mat-dialog-title{margin:0;padding:15px 20px}p{font-size:12px!important}ul{margin-top:0;margin-bottom:10px}.paddingtop{padding-top:20px}.mat-dialog-actions{display:flex;justify-content:center;border:none}.mat-dialog-actions:last-child{margin:0;padding:20px}.mat-dialog-actions{box-shadow:0 0 30px #0000001a;position:relative;z-index:99}.bt1{margin-left:10px}.reddelete{background:#08b363}.cs-btn{position:relative;display:inline-block;margin-bottom:0;text-align:center;vertical-align:middle;touch-action:manipulation;cursor:pointer;border:none;white-space:nowrap;outline:0;padding:10px 40px;font-size:inherit;line-height:1.4;z-index:2}.bt1,.bt2{border-radius:3px}.mat-dialog-content>.ng-star-inserted{margin-bottom:20px}ul{padding-left:40px}.reddelete{background:#183e79;color:#fff}::ng-deep .policies .p-accordion p-accordiontab .p-accordion-header .p-accordion-header-link{text-decoration:none!important}.fontsize{font-size:16px!important}\n"], dependencies: [{ kind: "directive", type: i12.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i12.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i12.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1$4.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1$4.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i5.Accordion, selector: "p-accordion", inputs: ["multiple", "style", "styleClass", "expandIcon", "collapseIcon", "activeIndex", "selectOnFocus", "headerAriaLevel"], outputs: ["onClose", "onOpen", "activeIndexChange"] }, { kind: "component", type: i5.AccordionTab, selector: "p-accordionTab", inputs: ["id", "header", "headerStyle", "tabStyle", "contentStyle", "tabStyleClass", "headerStyleClass", "contentStyleClass", "disabled", "cache", "transitionOptions", "iconPos", "selected", "headerAriaLevel"], outputs: ["selectedChange"] }, { kind: "directive", type: i1$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i7.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["role", "id", "aria-label", "aria-description", "value", "color", "removable", "highlighted", "disableRipple", "disabled"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "component", type: i8.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "component", type: i9.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: FieldErrorDisplayComponent, selector: "app-field-error-display", inputs: ["errorMsg", "displayError", "errorMsgs"] }, { kind: "component", type: FormSuccessDisplayComponent, selector: "app-form-success-display", inputs: ["successMsg", "displayMsg"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i12$1.InputTextarea, selector: "[pInputTextarea]", inputs: ["autoResize", "variant"], outputs: ["onResize"] }, { kind: "pipe", type: i12.DatePipe, name: "date" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ConfirmBoxComponent, selector: "app-confirm-box", ngImport: i0, template: "<form [formGroup]=\"amForm\" [ngClass]=\"this.data.theme\" novalidate (ngSubmit)=\"amForm.valid && onSubmit(amForm.value)\">\r\n  <h1 class=\"mat-dialog-title\">\r\n    <button #queue mat-dialog-close class=\"modal_close\" id=\"btnClose\">\r\n      <i class=\"fa fa-window-close\" aria-hidden=\"true\"></i>\r\n    </button>\r\n  </h1>\r\n  <div mat-dialog-content>\r\n    <p class=\"mb-4 fontsize\"> {{data.message}}</p>\r\n    <div *ngIf=\"data && data.cancelPolicy\" class=\"policies\">\r\n      <p-accordion [multiple]=\"true\">\r\n        <p-accordionTab>\r\n          <ng-template pTemplate=\"header\">\r\n            <h4>Cancellation Policies</h4>\r\n          </ng-template>\r\n          <p>You can cancel your {{data.book}}s any time until\r\n            <span *ngIf=\"data.wtlist.date\">{{data.wtlist.date| date:\r\n              newDateFormat}}</span><span *ngIf=\"data.wtlist.appmtDate\">{{data.wtlist.appmtDate| date:\r\n              newDateFormat}}</span><span *ngIf=\"data.wtlist.orderDate\">{{data.wtlist.orderDate| date:\r\n              newDateFormat}}</span>.<span\r\n              *ngIf=\"data.wtlist && data.wtlist.providerAccount && data.wtlist.providerAccount.businessName\">\r\n              If the system doesn\u2019t permit your cancellation,\r\n              contact your provider, {{data.wtlist.providerAccount.businessName}}.\r\n              It\u2019s important to note that the\r\n              provider may cancel your bookings at their discretion for their own reasons.\r\n              Jaldee will keep you informed promptly regarding the changes through timely notifications.\r\n            </span>\r\n          </p>\r\n        </p-accordionTab>\r\n        <p-accordionTab>\r\n          <ng-template pTemplate=\"header\">\r\n            <h4>Refund policy for Advance Payments(only)</h4>\r\n          </ng-template>\r\n          <p>\r\n            In the case of your cancellation, a 3% (payment gateway fee) will be deducted from the refund\r\n            of the advanced payment made. For same-day cancellations, kindly contact your service provider,\r\n            {{data.wtlist.providerAccount.businessName}} to initiate the refund. For any refund-related queries, reach\r\n            out to\r\n            {{data.wtlist.providerAccount.businessName}} for assistance.\r\n          </p>\r\n        </p-accordionTab>\r\n      </p-accordion>\r\n      <p class=\"mt-4\"> Are you sure you want to cancel this {{data.book}}? </p>\r\n    </div>\r\n    <div *ngIf=\"data.book !== 'Order' && data.cancelPolicy\">\r\n      <div class=\"form-group\">\r\n        <label class=\"col-form-label\" for=\"displayName\">{{select_reason_cap}}*</label>\r\n        <mat-chip-list>\r\n          <mat-chip *ngFor=\"let cancel_reason of cancel_reasons\" class=\"me-2 mb-2\"\r\n            color=\"{{(cancel_reason.value === amForm.get('reason').value) ? 'primary' : ''}}\"\r\n            selected=\"{{(cancel_reason.value === amForm.get('reason').value) ? true : false}}\"\r\n            [class.selected]=\"(cancel_reason.value === amForm.get('reason').value) ? true : false\"\r\n            (click)=\"selectReason(cancel_reason)\">\r\n            {{cancel_reason.title}}\r\n          </mat-chip>\r\n        </mat-chip-list>\r\n      </div>\r\n      <div class=\"form-group mt-2\">\r\n        <mat-checkbox formControlName=\"send_message\">{{send_message_cap}} {{rep_username}}</mat-checkbox>\r\n      </div>\r\n      <div class=\"form-group reason-area\" *ngIf=\"amForm.get('send_message').value\">\r\n        <textarea  class=\"form-control\" rows=\"3\"  id=\"message\" pInputTextarea placeholder=\"Message\" formControlName=\"message\"></textarea>\r\n        <app-field-error-display [displayError]=\"fed_service.isFieldValid(amForm,'message')\"\r\n          errorMsg=\"Please enter a message.\">\r\n        </app-field-error-display>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <div mat-dialog-actions *ngIf=\"data.book !== 'Order'&& data.cancelPolicy\" class=\"mb-2\">\r\n    <div class=\"col-md-12\" style=\"margin-top: 15px;display: inline-flex;\">\r\n      <button type=\"button\" mat-dialog-close class=\"cs-btn bt2\" id=\"btnCancel\">{{cancel_btn_cap}}</button>\r\n      <button type=\"submit\" mat-button [disabled]=\"!amForm.valid\" class=\"cs-btn bt1\" id=\"btnOk\">{{ok_btn_cap}}</button>\r\n    </div>\r\n  </div>\r\n  <app-field-error-display [displayError]=\"true\" *ngIf=\"api_error\" errorMsg=\"{{api_error}}\"></app-field-error-display>\r\n  <app-form-success-display [displayMsg]=\"true\" *ngIf=\"api_success\" successMsg=\"{{api_success}}\">\r\n  </app-form-success-display>\r\n  <div mat-dialog-actions class=\"paddingtop\" *ngIf=\"data.book !== 'Order' && !data.cancelPolicy\">\r\n    <button tabindex=\"-1\" (click)=\"onClick(0)\" class=\"cs-btn bt2\" id=\"btnCancel\">{{cancel_btn_cap}}</button>\r\n    <button tabindex=\"2\" (click)=\"onClick(1)\" id=\"btnOk\"\r\n      class=\"cs-btn bt1 reddelete checkavailabilitybutton\">{{ok_btn_cap}}</button>\r\n  </div>\r\n  <app-field-error-display [displayError]=\"true\" *ngIf=\"showError\" errorMsg=\"Department name is required\">\r\n  </app-field-error-display>\r\n</form>", styles: [".mat-dialog-actions button{padding:10px 25px!important}.mat-dialog-title{color:#222223;background:#183e79;height:50px!important}.mat-dialog-title{margin:0;padding:15px 20px}p{font-size:12px!important}ul{margin-top:0;margin-bottom:10px}.paddingtop{padding-top:20px}.mat-dialog-actions{display:flex;justify-content:center;border:none}.mat-dialog-actions:last-child{margin:0;padding:20px}.mat-dialog-actions{box-shadow:0 0 30px #0000001a;position:relative;z-index:99}.bt1{margin-left:10px}.reddelete{background:#08b363}.cs-btn{position:relative;display:inline-block;margin-bottom:0;text-align:center;vertical-align:middle;touch-action:manipulation;cursor:pointer;border:none;white-space:nowrap;outline:0;padding:10px 40px;font-size:inherit;line-height:1.4;z-index:2}.bt1,.bt2{border-radius:3px}.mat-dialog-content>.ng-star-inserted{margin-bottom:20px}ul{padding-left:40px}.reddelete{background:#183e79;color:#fff}::ng-deep .policies .p-accordion p-accordiontab .p-accordion-header .p-accordion-header-link{text-decoration:none!important}.fontsize{font-size:16px!important}\n"], dependencies: [{ kind: "directive", type: i12.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i12.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i12.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1$4.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1$4.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i5.Accordion, selector: "p-accordion", inputs: ["multiple", "style", "styleClass", "expandIcon", "collapseIcon", "activeIndex", "selectOnFocus", "headerAriaLevel"], outputs: ["onClose", "onOpen", "activeIndexChange"] }, { kind: "component", type: i5.AccordionTab, selector: "p-accordionTab", inputs: ["id", "header", "headerStyle", "tabStyle", "contentStyle", "tabStyleClass", "headerStyleClass", "contentStyleClass", "disabled", "cache", "transitionOptions", "iconPos", "selected", "headerAriaLevel"], outputs: ["selectedChange"] }, { kind: "directive", type: i1$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i7.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["role", "id", "aria-label", "aria-description", "value", "color", "removable", "highlighted", "disableRipple", "disabled"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "component", type: i8.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "component", type: i9.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: FieldErrorDisplayComponent, selector: "app-field-error-display", inputs: ["errorMsg", "displayError", "errorMsgs"] }, { kind: "component", type: FormSuccessDisplayComponent, selector: "app-form-success-display", inputs: ["successMsg", "displayMsg"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i12$1.InputTextarea, selector: "[pInputTextarea]", inputs: ["autoResize", "variant"], outputs: ["onResize"] }, { kind: "pipe", type: i12.DatePipe, name: "date" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ConfirmBoxComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-confirm-box', template: "<form [formGroup]=\"amForm\" [ngClass]=\"this.data.theme\" novalidate (ngSubmit)=\"amForm.valid && onSubmit(amForm.value)\">\r\n  <h1 class=\"mat-dialog-title\">\r\n    <button #queue mat-dialog-close class=\"modal_close\">\r\n      <i class=\"fa fa-window-close\" aria-hidden=\"true\"></i>\r\n    </button>\r\n  </h1>\r\n  <div mat-dialog-content>\r\n    <p class=\"mb-4 fontsize\"> {{data.message}}</p>\r\n    <div *ngIf=\"data && data.cancelPolicy\" class=\"policies\">\r\n      <p-accordion [multiple]=\"true\">\r\n        <p-accordionTab>\r\n          <ng-template pTemplate=\"header\">\r\n            <h4>Cancellation Policies</h4>\r\n          </ng-template>\r\n          <p>You can cancel your {{data.book}}s any time until\r\n            <span *ngIf=\"data.wtlist.date\">{{data.wtlist.date| date:\r\n              newDateFormat}}</span><span *ngIf=\"data.wtlist.appmtDate\">{{data.wtlist.appmtDate| date:\r\n              newDateFormat}}</span><span *ngIf=\"data.wtlist.orderDate\">{{data.wtlist.orderDate| date:\r\n              newDateFormat}}</span>.<span\r\n              *ngIf=\"data.wtlist && data.wtlist.providerAccount && data.wtlist.providerAccount.businessName\">\r\n              If the system doesn\u2019t permit your cancellation,\r\n              contact your provider, {{data.wtlist.providerAccount.businessName}}.\r\n              It\u2019s important to note that the\r\n              provider may cancel your bookings at their discretion for their own reasons.\r\n              Jaldee will keep you informed promptly regarding the changes through timely notifications.\r\n            </span>\r\n          </p>\r\n        </p-accordionTab>\r\n        <p-accordionTab>\r\n          <ng-template pTemplate=\"header\">\r\n            <h4>Refund policy for Advance Payments(only)</h4>\r\n          </ng-template>\r\n          <p>\r\n            In the case of your cancellation, a 3% (payment gateway fee) will be deducted from the refund\r\n            of the advanced payment made. For same-day cancellations, kindly contact your service provider,\r\n            {{data.wtlist.providerAccount.businessName}} to initiate the refund. For any refund-related queries, reach\r\n            out to\r\n            {{data.wtlist.providerAccount.businessName}} for assistance.\r\n          </p>\r\n        </p-accordionTab>\r\n      </p-accordion>\r\n      <p class=\"mt-4\"> Are you sure you want to cancel this {{data.book}}? </p>\r\n    </div>\r\n    <div *ngIf=\"data.book !== 'Order' && data.cancelPolicy\">\r\n      <div class=\"form-group\">\r\n        <label class=\"col-form-label\" for=\"displayName\">{{select_reason_cap}}*</label>\r\n        <mat-chip-list>\r\n          <mat-chip *ngFor=\"let cancel_reason of cancel_reasons\" class=\"me-2 mb-2\"\r\n            color=\"{{(cancel_reason.value === amForm.get('reason').value) ? 'primary' : ''}}\"\r\n            selected=\"{{(cancel_reason.value === amForm.get('reason').value) ? true : false}}\"\r\n            [class.selected]=\"(cancel_reason.value === amForm.get('reason').value) ? true : false\"\r\n            (click)=\"selectReason(cancel_reason)\">\r\n            {{cancel_reason.title}}\r\n          </mat-chip>\r\n        </mat-chip-list>\r\n      </div>\r\n      <div class=\"form-group mt-2\">\r\n        <mat-checkbox formControlName=\"send_message\">{{send_message_cap}} {{rep_username}}</mat-checkbox>\r\n      </div>\r\n      <div class=\"form-group reason-area\" *ngIf=\"amForm.get('send_message').value\">\r\n        <textarea  class=\"form-control\" rows=\"3\"  id=\"message\" pInputTextarea placeholder=\"Message\" formControlName=\"message\"></textarea>\r\n        <app-field-error-display [displayError]=\"fed_service.isFieldValid(amForm,'message')\"\r\n          errorMsg=\"Please enter a message.\">\r\n        </app-field-error-display>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <div mat-dialog-actions *ngIf=\"data.book !== 'Order'&& data.cancelPolicy\" class=\"mb-2\">\r\n    <div class=\"col-md-12\" style=\"margin-top: 15px;display: inline-flex;\">\r\n      <button type=\"button\" mat-dialog-close class=\"cs-btn bt2\">{{cancel_btn_cap}}</button>\r\n      <button type=\"submit\" mat-button [disabled]=\"!amForm.valid\" class=\"cs-btn bt1\">{{ok_btn_cap}}</button>\r\n    </div>\r\n  </div>\r\n  <app-field-error-display [displayError]=\"true\" *ngIf=\"api_error\" errorMsg=\"{{api_error}}\"></app-field-error-display>\r\n  <app-form-success-display [displayMsg]=\"true\" *ngIf=\"api_success\" successMsg=\"{{api_success}}\">\r\n  </app-form-success-display>\r\n  <div mat-dialog-actions class=\"paddingtop\" *ngIf=\"data.book !== 'Order' && !data.cancelPolicy\">\r\n    <button tabindex=\"-1\" (click)=\"onClick(0)\" class=\"cs-btn bt2\">{{cancel_btn_cap}}</button>\r\n    <button tabindex=\"2\" (click)=\"onClick(1)\"\r\n      class=\"cs-btn bt1 reddelete checkavailabilitybutton\">{{ok_btn_cap}}</button>\r\n  </div>\r\n  <app-field-error-display [displayError]=\"true\" *ngIf=\"showError\" errorMsg=\"Department name is required\">\r\n  </app-field-error-display>\r\n</form>", styles: [".mat-dialog-actions button{padding:10px 25px!important}.mat-dialog-title{color:#222223;background:#183e79;height:50px!important}.mat-dialog-title{margin:0;padding:15px 20px}p{font-size:12px!important}ul{margin-top:0;margin-bottom:10px}.paddingtop{padding-top:20px}.mat-dialog-actions{display:flex;justify-content:center;border:none}.mat-dialog-actions:last-child{margin:0;padding:20px}.mat-dialog-actions{box-shadow:0 0 30px #0000001a;position:relative;z-index:99}.bt1{margin-left:10px}.reddelete{background:#08b363}.cs-btn{position:relative;display:inline-block;margin-bottom:0;text-align:center;vertical-align:middle;touch-action:manipulation;cursor:pointer;border:none;white-space:nowrap;outline:0;padding:10px 40px;font-size:inherit;line-height:1.4;z-index:2}.bt1,.bt2{border-radius:3px}.mat-dialog-content>.ng-star-inserted{margin-bottom:20px}ul{padding-left:40px}.reddelete{background:#183e79;color:#fff}::ng-deep .policies .p-accordion p-accordiontab .p-accordion-header .p-accordion-header-link{text-decoration:none!important}.fontsize{font-size:16px!important}\n"] }]
+            args: [{ selector: 'app-confirm-box', template: "<form [formGroup]=\"amForm\" [ngClass]=\"this.data.theme\" novalidate (ngSubmit)=\"amForm.valid && onSubmit(amForm.value)\">\r\n  <h1 class=\"mat-dialog-title\">\r\n    <button #queue mat-dialog-close class=\"modal_close\" id=\"btnClose\">\r\n      <i class=\"fa fa-window-close\" aria-hidden=\"true\"></i>\r\n    </button>\r\n  </h1>\r\n  <div mat-dialog-content>\r\n    <p class=\"mb-4 fontsize\"> {{data.message}}</p>\r\n    <div *ngIf=\"data && data.cancelPolicy\" class=\"policies\">\r\n      <p-accordion [multiple]=\"true\">\r\n        <p-accordionTab>\r\n          <ng-template pTemplate=\"header\">\r\n            <h4>Cancellation Policies</h4>\r\n          </ng-template>\r\n          <p>You can cancel your {{data.book}}s any time until\r\n            <span *ngIf=\"data.wtlist.date\">{{data.wtlist.date| date:\r\n              newDateFormat}}</span><span *ngIf=\"data.wtlist.appmtDate\">{{data.wtlist.appmtDate| date:\r\n              newDateFormat}}</span><span *ngIf=\"data.wtlist.orderDate\">{{data.wtlist.orderDate| date:\r\n              newDateFormat}}</span>.<span\r\n              *ngIf=\"data.wtlist && data.wtlist.providerAccount && data.wtlist.providerAccount.businessName\">\r\n              If the system doesn\u2019t permit your cancellation,\r\n              contact your provider, {{data.wtlist.providerAccount.businessName}}.\r\n              It\u2019s important to note that the\r\n              provider may cancel your bookings at their discretion for their own reasons.\r\n              Jaldee will keep you informed promptly regarding the changes through timely notifications.\r\n            </span>\r\n          </p>\r\n        </p-accordionTab>\r\n        <p-accordionTab>\r\n          <ng-template pTemplate=\"header\">\r\n            <h4>Refund policy for Advance Payments(only)</h4>\r\n          </ng-template>\r\n          <p>\r\n            In the case of your cancellation, a 3% (payment gateway fee) will be deducted from the refund\r\n            of the advanced payment made. For same-day cancellations, kindly contact your service provider,\r\n            {{data.wtlist.providerAccount.businessName}} to initiate the refund. For any refund-related queries, reach\r\n            out to\r\n            {{data.wtlist.providerAccount.businessName}} for assistance.\r\n          </p>\r\n        </p-accordionTab>\r\n      </p-accordion>\r\n      <p class=\"mt-4\"> Are you sure you want to cancel this {{data.book}}? </p>\r\n    </div>\r\n    <div *ngIf=\"data.book !== 'Order' && data.cancelPolicy\">\r\n      <div class=\"form-group\">\r\n        <label class=\"col-form-label\" for=\"displayName\">{{select_reason_cap}}*</label>\r\n        <mat-chip-list>\r\n          <mat-chip *ngFor=\"let cancel_reason of cancel_reasons\" class=\"me-2 mb-2\"\r\n            color=\"{{(cancel_reason.value === amForm.get('reason').value) ? 'primary' : ''}}\"\r\n            selected=\"{{(cancel_reason.value === amForm.get('reason').value) ? true : false}}\"\r\n            [class.selected]=\"(cancel_reason.value === amForm.get('reason').value) ? true : false\"\r\n            (click)=\"selectReason(cancel_reason)\">\r\n            {{cancel_reason.title}}\r\n          </mat-chip>\r\n        </mat-chip-list>\r\n      </div>\r\n      <div class=\"form-group mt-2\">\r\n        <mat-checkbox formControlName=\"send_message\">{{send_message_cap}} {{rep_username}}</mat-checkbox>\r\n      </div>\r\n      <div class=\"form-group reason-area\" *ngIf=\"amForm.get('send_message').value\">\r\n        <textarea  class=\"form-control\" rows=\"3\"  id=\"message\" pInputTextarea placeholder=\"Message\" formControlName=\"message\"></textarea>\r\n        <app-field-error-display [displayError]=\"fed_service.isFieldValid(amForm,'message')\"\r\n          errorMsg=\"Please enter a message.\">\r\n        </app-field-error-display>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <div mat-dialog-actions *ngIf=\"data.book !== 'Order'&& data.cancelPolicy\" class=\"mb-2\">\r\n    <div class=\"col-md-12\" style=\"margin-top: 15px;display: inline-flex;\">\r\n      <button type=\"button\" mat-dialog-close class=\"cs-btn bt2\" id=\"btnCancel\">{{cancel_btn_cap}}</button>\r\n      <button type=\"submit\" mat-button [disabled]=\"!amForm.valid\" class=\"cs-btn bt1\" id=\"btnOk\">{{ok_btn_cap}}</button>\r\n    </div>\r\n  </div>\r\n  <app-field-error-display [displayError]=\"true\" *ngIf=\"api_error\" errorMsg=\"{{api_error}}\"></app-field-error-display>\r\n  <app-form-success-display [displayMsg]=\"true\" *ngIf=\"api_success\" successMsg=\"{{api_success}}\">\r\n  </app-form-success-display>\r\n  <div mat-dialog-actions class=\"paddingtop\" *ngIf=\"data.book !== 'Order' && !data.cancelPolicy\">\r\n    <button tabindex=\"-1\" (click)=\"onClick(0)\" class=\"cs-btn bt2\" id=\"btnCancel\">{{cancel_btn_cap}}</button>\r\n    <button tabindex=\"2\" (click)=\"onClick(1)\" id=\"btnOk\"\r\n      class=\"cs-btn bt1 reddelete checkavailabilitybutton\">{{ok_btn_cap}}</button>\r\n  </div>\r\n  <app-field-error-display [displayError]=\"true\" *ngIf=\"showError\" errorMsg=\"Department name is required\">\r\n  </app-field-error-display>\r\n</form>", styles: [".mat-dialog-actions button{padding:10px 25px!important}.mat-dialog-title{color:#222223;background:#183e79;height:50px!important}.mat-dialog-title{margin:0;padding:15px 20px}p{font-size:12px!important}ul{margin-top:0;margin-bottom:10px}.paddingtop{padding-top:20px}.mat-dialog-actions{display:flex;justify-content:center;border:none}.mat-dialog-actions:last-child{margin:0;padding:20px}.mat-dialog-actions{box-shadow:0 0 30px #0000001a;position:relative;z-index:99}.bt1{margin-left:10px}.reddelete{background:#08b363}.cs-btn{position:relative;display:inline-block;margin-bottom:0;text-align:center;vertical-align:middle;touch-action:manipulation;cursor:pointer;border:none;white-space:nowrap;outline:0;padding:10px 40px;font-size:inherit;line-height:1.4;z-index:2}.bt1,.bt2{border-radius:3px}.mat-dialog-content>.ng-star-inserted{margin-bottom:20px}ul{padding-left:40px}.reddelete{background:#183e79;color:#fff}::ng-deep .policies .p-accordion p-accordiontab .p-accordion-header .p-accordion-header-link{text-decoration:none!important}.fontsize{font-size:16px!important}\n"] }]
         }], ctorParameters: () => [{ type: i1$4.MatDialogRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
@@ -4956,11 +4977,11 @@ class ShowuploadfileComponent {
         this.dialogRef.close();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ShowuploadfileComponent, deps: [{ token: i1$4.MatDialogRef }, { token: CommonService }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ShowuploadfileComponent, selector: "app-showuploadfile", ngImport: i0, template: "<form [ngClass]=\"theme\">\r\n  <h1 class=\"mat-dialog-title\"> {{title}}\r\n    <button #locte mat-dialog-close class=\"modal_close\" tabindex=\"-1\">\r\n      <i class=\"fa fa-window-close\" aria-hidden=\"true\"></i>\r\n    </button>\r\n  </h1>\r\n  <div class=\"pad-20 image-scroll\">\r\n    <img style=\"width:100%;margin-top: -20px;\" [src]=\"details.url||details.s3path\" alt=\"\"\r\n      *ngIf=\"details.type && details.type == 'image/bmp'|| details.type =='image/png'|| details.type == 'image/gif' || details.type == 'image/jpg' ||details.type =='image/jpeg'||details.type == 'image/webp'\r\n  ||details.type == 'bmp' ||details.type == 'png' ||details.type == 'gif' ||details.type == 'jpg' ||details.type == 'jpeg' ||details.type == 'webp'\" />\r\n    <video style=\"width:100%;height: 75vh;\" controls\r\n      *ngIf=\"(data.source === 'qnr' && type === 'video') || (data.source === 'mr' && details.type && details.type == 'video/mp4' || details.type == 'video/mpeg'||details.type == 'video/quicktime')\">\r\n      <source [src]=\"details.url\" />\r\n    </video>\r\n    <audio style=\"width:100%;\" controls\r\n      *ngIf=\"(data.source === 'qnr' && type === 'audio') || (data.source === 'mr' && details.type && details.type == 'audio/ogg'|| details.type == 'audio/mpeg'|| details.type == 'audio/mp3')\">\r\n      <source [src]=\"details.url\" />\r\n    </audio>\r\n  </div>\r\n</form>", styles: [".pad-20{padding:20px!important}\n"], dependencies: [{ kind: "directive", type: i12.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i12.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ShowuploadfileComponent, selector: "app-showuploadfile", ngImport: i0, template: "<form [ngClass]=\"theme\">\r\n  <h1 class=\"mat-dialog-title\"> {{title}}\r\n    <button #locte mat-dialog-close class=\"modal_close\" tabindex=\"-1\" id=\"btnClose\">\r\n      <i class=\"fa fa-window-close\" aria-hidden=\"true\"></i>\r\n    </button>\r\n  </h1>\r\n  <div class=\"pad-20 image-scroll\">\r\n    <img style=\"width:100%;margin-top: -20px;\" [src]=\"details.url||details.s3path\" alt=\"\"\r\n      *ngIf=\"details.type && details.type == 'image/bmp'|| details.type =='image/png'|| details.type == 'image/gif' || details.type == 'image/jpg' ||details.type =='image/jpeg'||details.type == 'image/webp'\r\n  ||details.type == 'bmp' ||details.type == 'png' ||details.type == 'gif' ||details.type == 'jpg' ||details.type == 'jpeg' ||details.type == 'webp'\" />\r\n    <video style=\"width:100%;height: 75vh;\" controls\r\n      *ngIf=\"(data.source === 'qnr' && type === 'video') || (data.source === 'mr' && details.type && details.type == 'video/mp4' || details.type == 'video/mpeg'||details.type == 'video/quicktime')\">\r\n      <source [src]=\"details.url\" />\r\n    </video>\r\n    <audio style=\"width:100%;\" controls\r\n      *ngIf=\"(data.source === 'qnr' && type === 'audio') || (data.source === 'mr' && details.type && details.type == 'audio/ogg'|| details.type == 'audio/mpeg'|| details.type == 'audio/mp3')\">\r\n      <source [src]=\"details.url\" />\r\n    </audio>\r\n  </div>\r\n</form>", styles: [".pad-20{padding:20px!important}\n"], dependencies: [{ kind: "directive", type: i12.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i12.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ShowuploadfileComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-showuploadfile', template: "<form [ngClass]=\"theme\">\r\n  <h1 class=\"mat-dialog-title\"> {{title}}\r\n    <button #locte mat-dialog-close class=\"modal_close\" tabindex=\"-1\">\r\n      <i class=\"fa fa-window-close\" aria-hidden=\"true\"></i>\r\n    </button>\r\n  </h1>\r\n  <div class=\"pad-20 image-scroll\">\r\n    <img style=\"width:100%;margin-top: -20px;\" [src]=\"details.url||details.s3path\" alt=\"\"\r\n      *ngIf=\"details.type && details.type == 'image/bmp'|| details.type =='image/png'|| details.type == 'image/gif' || details.type == 'image/jpg' ||details.type =='image/jpeg'||details.type == 'image/webp'\r\n  ||details.type == 'bmp' ||details.type == 'png' ||details.type == 'gif' ||details.type == 'jpg' ||details.type == 'jpeg' ||details.type == 'webp'\" />\r\n    <video style=\"width:100%;height: 75vh;\" controls\r\n      *ngIf=\"(data.source === 'qnr' && type === 'video') || (data.source === 'mr' && details.type && details.type == 'video/mp4' || details.type == 'video/mpeg'||details.type == 'video/quicktime')\">\r\n      <source [src]=\"details.url\" />\r\n    </video>\r\n    <audio style=\"width:100%;\" controls\r\n      *ngIf=\"(data.source === 'qnr' && type === 'audio') || (data.source === 'mr' && details.type && details.type == 'audio/ogg'|| details.type == 'audio/mpeg'|| details.type == 'audio/mp3')\">\r\n      <source [src]=\"details.url\" />\r\n    </audio>\r\n  </div>\r\n</form>", styles: [".pad-20{padding:20px!important}\n"] }]
+            args: [{ selector: 'app-showuploadfile', template: "<form [ngClass]=\"theme\">\r\n  <h1 class=\"mat-dialog-title\"> {{title}}\r\n    <button #locte mat-dialog-close class=\"modal_close\" tabindex=\"-1\" id=\"btnClose\">\r\n      <i class=\"fa fa-window-close\" aria-hidden=\"true\"></i>\r\n    </button>\r\n  </h1>\r\n  <div class=\"pad-20 image-scroll\">\r\n    <img style=\"width:100%;margin-top: -20px;\" [src]=\"details.url||details.s3path\" alt=\"\"\r\n      *ngIf=\"details.type && details.type == 'image/bmp'|| details.type =='image/png'|| details.type == 'image/gif' || details.type == 'image/jpg' ||details.type =='image/jpeg'||details.type == 'image/webp'\r\n  ||details.type == 'bmp' ||details.type == 'png' ||details.type == 'gif' ||details.type == 'jpg' ||details.type == 'jpeg' ||details.type == 'webp'\" />\r\n    <video style=\"width:100%;height: 75vh;\" controls\r\n      *ngIf=\"(data.source === 'qnr' && type === 'video') || (data.source === 'mr' && details.type && details.type == 'video/mp4' || details.type == 'video/mpeg'||details.type == 'video/quicktime')\">\r\n      <source [src]=\"details.url\" />\r\n    </video>\r\n    <audio style=\"width:100%;\" controls\r\n      *ngIf=\"(data.source === 'qnr' && type === 'audio') || (data.source === 'mr' && details.type && details.type == 'audio/ogg'|| details.type == 'audio/mpeg'|| details.type == 'audio/mp3')\">\r\n      <source [src]=\"details.url\" />\r\n    </audio>\r\n  </div>\r\n</form>", styles: [".pad-20{padding:20px!important}\n"] }]
         }], ctorParameters: () => [{ type: i1$4.MatDialogRef }, { type: CommonService }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
@@ -6308,11 +6329,11 @@ class QuestionnaireComponent {
         lgInstance.openGallery(imageIndex);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: QuestionnaireComponent, deps: [{ token: i1$6.ActivatedRoute }, { token: WordProcessor }, { token: LocalStorageService }, { token: DateTimeProcessor }, { token: i1$4.MatDialog }, { token: FileService }, { token: CommonService }, { token: QuestionaireService }, { token: ErrorMessagingService }, { token: ToastService }, { token: SharedService }, { token: i12.Location }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: QuestionnaireComponent, selector: "app-questionnaire", inputs: { questionnaireList: "questionnaireList", source: "source", accountId: "accountId", questionAnswers: "questionAnswers", customerDetails: "customerDetails", uuid: "uuid", type: "type", waitlistStatus: "waitlistStatus", orderStatus: "orderStatus", donationDetails: "donationDetails", service: "service", mode: "mode", tempType: "tempType", bookingType: "bookingType" }, outputs: { fileChanged: "fileChanged", returnAnswers: "returnAnswers" }, viewQueries: [{ propertyName: "file2", first: true, predicate: ["logofile1"], descendants: true }, { propertyName: "lightGalleryContainer", first: true, predicate: ["lightGalleryContainer"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<section class=\"cons-inbox no-padding-small\" *ngIf=\"!showservice\">\r\n  <div class=\"container consumer-dashhome p-0\" *ngIf=\"!type && source!='proLead'\">\r\n    <div class=\"card title-gb rounded-0\" *ngIf=\"uuid\">\r\n      <h5 class=\"mt-2 bold\">{{questionnaire_heading | capitalizeFirst}} <a class=\"pull-left me-4 back-btn\"\r\n          (click)=\"goBack()\"><i class=\"fa fa-arrow-left\"></i></a></h5>\r\n    </div>\r\n  </div>\r\n  <app-common-innerloading-spinner *ngIf=\"loading\"></app-common-innerloading-spinner>\r\n  <div class=\"d-flex flex-column-fluid pull-right me-2 mb-4\"\r\n    *ngIf=\"type !== 'qnrLinkProvider' && !buttonDisable && waitlistStatus\">\r\n    <button class=\"normal-btn edit\" mat-flat-button (click)=\"editQnr()\">Edit</button>\r\n  </div>\r\n  <div class=\"d-flex flex-column-fluid width-100\" [class.qnrDisableState]=\"disableInput()\"\r\n    [class.p-0]=\"uuid && (source === 'consCheckin' || source === 'consAppt' || source === 'consOrder' || source === 'paper' || source === 'consDonationDetails' || source === 'ivr')\">\r\n    <div class=\"col-xl-12 force_center\" [class.p-0]=\"uuid\" [class.no-padding-small]=\"source && source=='ivr'\">\r\n      <div class=\"\">\r\n        <div class=\"qnrsec\" *ngFor=\"let qnr of groupedQnr | keyvalue: asIsOrder\"\r\n          [class.section-shadow]=\"getSectionCount() > 1\" [class.no-padding-small]=\"source && source=='ivr'\">\r\n          <div class=\"form-group card mgn-0\" *ngFor=\"let question of qnr.value\">\r\n            <label class=\"col-12 quest\">{{getQuestion(question).label}}\r\n              <i class=\"fa fa-plus-circle pull-right\" aria-hidden=\"true\"\r\n                [class.addicon]=\"!buttonDisable && !disableInput()\"\r\n                *ngIf=\"getQuestion(question).fieldDataType === 'dataGrid' && !showDataGrid[getQuestion(question).labelName]\"\r\n                (click)=\"!buttonDisable && !disableInput() && showDataGridAddSection(getQuestion(question), true)\"></i>\r\n              <div class=\"pro-only\" *ngIf=\"showProviderText(getQuestion(question))\">For Providers</div>\r\n              <span class=\"red\" *ngIf=\"getQuestion(question).mandatory\">*</span>\r\n              <div class=\"form-level-settings\" *ngIf=\"getQuestion(question).hint\"\r\n                [innerHTML]=\"getQuestion(question).hint | safeHtml\">\r\n              </div>\r\n            </label>\r\n            <!-- for file upload -->\r\n            <div class=\"col-12\" *ngIf=\"getQuestion(question).fieldDataType === 'fileUpload'\">\r\n              <mat-select multiple #deptsel [disabled]=\"buttonDisable || disableInput()\"\r\n                *ngIf=\"getQuestion(question).filePropertie.maxNoOfFile > 1 && getQuestion(question).filePropertie.minNoOfFile !== getQuestion(question).filePropertie.maxNoOfFile\"\r\n                [(ngModel)]=\"uploadFilesTemp[getQuestion(question).labelName]\" class=\"select-box\" placeholder=\"Select\">\r\n                <mat-option *ngFor=\"let document of getQuestion(question).filePropertie.allowedDocuments\"\r\n                  [value]=\"document\" (click)=\"changeImageSelected(getQuestion(question), document)\">\r\n                  {{document}}</mat-option>\r\n              </mat-select>\r\n              <div class=\"col-lg-12 col-12 col-md-12 col-sm-12 p-0 mt-4\"\r\n                *ngIf=\"getDocuments(getQuestion(question)) && getDocuments(getQuestion(question)).length > 0\">\r\n                <div class=\"dropzone dropzone-default dropzone-primary dz-clickable\"\r\n                  [class.single-file]=\"getQuestion(question).filePropertie.allowedDocuments.length==1\"\r\n                  style=\"cursor: auto;\">\r\n                  <ng-container *ngFor=\"let doc of getDocuments(getQuestion(question))\">\r\n                    <div class=\"dz-preview dz-processing dz-image-preview dz-error dz-complete\"\r\n                      *ngIf=\"getImg(getQuestion(question), doc)\">\r\n                      <div class=\"docname\" *ngIf=\"getQuestion(question).filePropertie.allowedDocuments.length > 1\">\r\n                        {{doc}}</div>\r\n                      <div class=\"dzimage pointer-cursor\" (click)=\"openAttachmentGallery(getQuestion(question), doc)\">\r\n                        <img alt=\"\" class=\"img_fit\" [src]=\"getImg(getQuestion(question), doc)\">\r\n                      </div>\r\n                      <input [disabled]=\"buttonDisable || disableInput()\" (blur)=\"onSubmit('inputChange');\"\r\n                        [(ngModel)]=\"comments[getQuestion(question).labelName + '=' + doc]\">\r\n                      <div class=\"gal_action\" *ngIf=\"!buttonDisable && !disableInput() && mode!=='read'\"\r\n                        (click)=\"changeImageSelected(getQuestion(question), doc)\">\r\n                        <i class=\"fa fa-times-circle\" aria-hidden=\"true\"></i>\r\n                      </div>\r\n                    </div>\r\n                    <div class=\"dz-preview dz-processing dz-image-preview dz-error dz-complete\"\r\n                      (click)=\"logofile1.click()\" *ngIf=\"!getImg(getQuestion(question), doc)\">\r\n                      <div class=\"docname\" *ngIf=\"getQuestion(question).filePropertie.allowedDocuments.length > 1\">\r\n                        {{doc}}</div>\r\n                      <div class=\"dz-image pointer-cursor\">\r\n                      </div>\r\n                      <input #logofile1 type=\"file\" accept=\"/*;capture=camera\" style=\"display:none;\"\r\n                        [disabled]=\"buttonDisable || disableInput()\"\r\n                        (change)=\"filesSelected($event, getQuestion(question), doc)\">\r\n                      <div class=\"dz-error-mark\">\r\n                        <a class=\"btn btn-icon btn-light-success btn-circle mr-2\"><i\r\n                            class=\"text-dark-50 flaticon-upload\"></i></a>\r\n                      </div>\r\n                    </div>\r\n                  </ng-container>\r\n                </div>\r\n              </div>\r\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\r\n                {{apiError[getQuestion(question).labelName]}}</div>\r\n            </div>\r\n            <!-- for checkbox -->\r\n            <div class=\"col-12\"\r\n              *ngIf=\"getQuestion(question).fieldDataType === 'list' && getQuestion(question).listPropertie.maxAnswers > 1\">\r\n              <div class=\"checkbox-list\">\r\n                <label class=\"checkbox\" *ngFor=\"let value of getQuestion(question).labelValues\">\r\n                  <input type=\"checkbox\" [checked]=\"isChecked(value, getQuestion(question))\"\r\n                    (change)=\"listChange($event, value, getQuestion(question))\"\r\n                    [disabled]=\"buttonDisable || disableInput()\">\r\n                  <span></span>\r\n                  {{value}}\r\n                </label>\r\n              </div>\r\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\r\n                {{apiError[getQuestion(question).labelName]}}</div>\r\n            </div>\r\n            <!-- for radio -->\r\n            <div class=\"col-12\"\r\n              *ngIf=\"getQuestion(question).fieldDataType === 'list' && getQuestion(question).listPropertie.maxAnswers === 1\">\r\n              <div class=\"radio-list\">\r\n                <label class=\"radio\" *ngFor=\"let value of getQuestion(question).labelValues\">\r\n                  <input type=\"radio\" [disabled]=\"buttonDisable || disableInput()\"\r\n                    [checked]=\"isChecked(value, getQuestion(question))\"\r\n                    (change)=\"listChange($event, value, getQuestion(question))\">\r\n                  <span></span>\r\n                  {{value}}\r\n                </label>\r\n              </div>\r\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\r\n                {{apiError[getQuestion(question).labelName]}}</div>\r\n            </div>\r\n            <!-- for toggel boolean -->\r\n            <div class=\"col-12\" *ngIf=\"getQuestion(question).fieldDataType === 'bool'\">\r\n              <div class=\"radio-list\">\r\n                <label class=\"radio\" *ngFor=\"let value of getQuestion(question).labelValues\">\r\n                  <input type=\"radio\" [disabled]=\"buttonDisable || disableInput()\"\r\n                    [checked]=\"isBooleanChecked(value, getQuestion(question))\"\r\n                    (change)=\"booleanChange($event, value, getQuestion(question))\">\r\n                  <span></span>\r\n                  {{value}}\r\n                </label>\r\n              </div>\r\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\r\n                {{apiError[getQuestion(question).labelName]}}</div>\r\n            </div>\r\n            <!-- for Text -->\r\n            <div class=\"col-12\" *ngIf=\"getQuestion(question).fieldDataType === 'plainText'\">\r\n              <input *ngIf=\"getQuestion(question).plainTextPropertie.maxNoOfLetter<=100\"\r\n                  [(ngModel)]=\"answers[getQuestion(question).labelName]\" (input)=\"onSubmit('inputChange');\"                  \r\n                  [minlength]=\"getQuestion(question).plainTextPropertie.minNoOfLetter\"\r\n                  [maxlength]=\"getQuestion(question).plainTextPropertie.maxNoOfLetter\"\r\n                  class=\"form-control1 form-control-solid\" type=\"text\" [disabled]=\"buttonDisable || disableInput()\">\r\n                <textarea rows=\"3\" *ngIf=\"getQuestion(question).plainTextPropertie.maxNoOfLetter>100\"\r\n                  [(ngModel)]=\"answers[getQuestion(question).labelName]\" (input)=\"onSubmit('inputChange');\"\r\n                  [minlength]=\"getQuestion(question).plainTextPropertie.minNoOfLetter\"\r\n                  [maxlength]=\"getQuestion(question).plainTextPropertie.maxNoOfLetter\" [disabled]=\"buttonDisable || disableInput()\"\r\n                  class=\"form-control2 form-control-solid\"></textarea>\r\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\r\n                {{apiError[getQuestion(question).labelName]}}</div>\r\n            </div>\r\n            <!-- for Number -->\r\n            <div class=\"col-12\" *ngIf=\"getQuestion(question).fieldDataType === 'number'\">\r\n              <input [(ngModel)]=\"answers[getQuestion(question).labelName]\" (input)=\"onSubmit('inputChange');\"\r\n                [min]=\"getQuestion(question).numberPropertie.start\" [max]=\"getQuestion(question).numberPropertie.end\"\r\n                [disabled]=\"buttonDisable || disableInput()\" class=\"form-control1 form-control-solid\" type=\"number\"\r\n                (keypress)=\"isNumeric($event)\">\r\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\r\n                {{apiError[getQuestion(question).labelName]}}</div>\r\n            </div>\r\n            <!-- for Date -->\r\n            <div class=\"col-12 disp-flex\" *ngIf=\"getQuestion(question).fieldDataType === 'date'\">\r\n              <input class=\"form-control1\" [matDatepicker]=\"picker\" [max]=\"getMaxdate(question)\"\r\n                [min]=\"getMindate(question)\" [(ngModel)]=\"answers[getQuestion(question).labelName]\"\r\n                (dateChange)=\"onSubmit('inputChange')\" [disabled]=\"buttonDisable || disableInput()\"\r\n                (click)=\"picker.open()\">\r\n              <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\r\n              <mat-datepicker #picker [disabled]=\"buttonDisable || disableInput()\"></mat-datepicker>\r\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\r\n                {{apiError[getQuestion(question).labelName]}}</div>\r\n            </div>\r\n            <!-- for Datagrid -->\r\n            <div class=\"table-responsive1\"\r\n              *ngIf=\"getQuestion(question).fieldDataType === 'dataGrid' && dataGridColumnsAnswerList[getQuestion(question).labelName] && dataGridColumnsAnswerList[getQuestion(question).labelName].length > 0\">\r\n              <table class=\"table table-head-custom table-head-bg table-borderless table-vertical-center\">\r\n                <thead>\r\n                  <th *ngFor=\"let column of getQuestion(question).dataGridProperties.dataGridColumns\">\r\n                    {{column.columnId}}</th>\r\n                  <th *ngIf=\"!buttonDisable && !disableInput() && !showDataGrid[getQuestion(question).labelName]\">\r\n                  </th>\r\n                  <th *ngIf=\"!buttonDisable && !disableInput() && !showDataGrid[getQuestion(question).labelName]\">\r\n                  </th>\r\n                </thead>\r\n                <tbody>\r\n                  <tr *ngFor=\"let column of dataGridColumnsAnswerList[getQuestion(question).labelName];let i =index\">\r\n                    <td *ngFor=\"let data of column | keyvalue\">\r\n                      <div\r\n                        *ngIf=\"getColumnType(getQuestion(question).dataGridProperties.dataGridColumns, data.key) === 'date'\">\r\n                        {{data.value | date : newTimeDateFormat}}\r\n                      </div>\r\n                      <div\r\n                        *ngIf=\"getColumnType(getQuestion(question).dataGridProperties.dataGridColumns, data.key) === 'bool'\">\r\n                        {{getBoolValue(data.value)}}\r\n                      </div>\r\n                      <div\r\n                        *ngIf=\"getColumnType(getQuestion(question).dataGridProperties.dataGridColumns, data.key) !== 'date' && getColumnType(getQuestion(question).dataGridProperties.dataGridColumns, data.key) !== 'bool'\">\r\n                        {{data.value}}\r\n                      </div>\r\n                    </td>\r\n                    <td *ngIf=\"!buttonDisable && !disableInput() && !showDataGrid[getQuestion(question).labelName]\">\r\n                      <i class=\"fa fa-pen\" (click)=\"editDataGrid(getQuestion(question), column)\"></i>\r\n                    </td>\r\n                    <td *ngIf=\"!buttonDisable && !disableInput() && !showDataGrid[getQuestion(question).labelName]\">\r\n                      <i class=\"fa fa-trash\" (click)=\"deleteDataGrid(getQuestion(question), column)\"></i>\r\n                    </td>\r\n                  </tr>\r\n                </tbody>\r\n              </table>\r\n            </div>\r\n            <div class=\"gridSection\" *ngIf=\"showDataGrid[getQuestion(question).labelName]\">\r\n              <div class=\"gridColumn\" *ngFor=\"let column of getQuestion(question).dataGridProperties.dataGridColumns\">\r\n                <label>{{column.label}}\r\n                  <span class=\"red\" *ngIf=\"column.mandatory\">*</span>\r\n                </label>\r\n                <!-- for checkbox -->\r\n                <div class=\"col-12\" *ngIf=\"column.dataType === 'list'\">\r\n                  <div class=\"checkbox-list\">\r\n                    <label class=\"checkbox\" *ngFor=\"let value of column.listPropertie.values\">\r\n                      <input type=\"checkbox\" [checked]=\"isChecked(value, getQuestion(question), column)\"\r\n                        (change)=\"listChange($event, value, getQuestion(question), column)\"\r\n                        [disabled]=\"buttonDisable || disableInput()\">\r\n                      <span></span>\r\n                      {{value}}\r\n                    </label>\r\n                  </div>\r\n                </div>\r\n                <!-- for toggel boolean -->\r\n                <div class=\"col-12\" *ngIf=\"column.dataType === 'bool'\">\r\n                  <div class=\"radio-list\">\r\n                    <label class=\"radio\">\r\n                      <input type=\"radio\" [disabled]=\"buttonDisable || disableInput()\"\r\n                        [checked]=\"isBooleanChecked('yes', getQuestion(question), column)\"\r\n                        (change)=\"booleanChange($event, 'yes', getQuestion(question), column)\">\r\n                      <span></span>\r\n                      Yes\r\n                    </label>\r\n                    <label class=\"radio\">\r\n                      <input type=\"radio\" [disabled]=\"buttonDisable || disableInput()\"\r\n                        [checked]=\"isBooleanChecked('no', getQuestion(question), column)\"\r\n                        (change)=\"booleanChange($event, 'no', getQuestion(question), column)\">\r\n                      <span></span>\r\n                      No\r\n                    </label>\r\n                  </div>\r\n                </div>\r\n                <!-- for Text -->\r\n                <div class=\"col-12\" *ngIf=\"column.dataType === 'plainText'\">\r\n                  <input [(ngModel)]=\"dataGridColumns[getQuestion(question).labelName + '=' + column.order]\"\r\n                    [disabled]=\"buttonDisable || disableInput()\" class=\"form-control1 form-control-solid\" type=\"text\">\r\n                </div>\r\n                <!-- for Number -->\r\n                <div class=\"col-12\" *ngIf=\"column.dataType === 'number'\">\r\n                  <input [(ngModel)]=\"dataGridColumns[getQuestion(question).labelName + '=' + column.order]\"\r\n                    [disabled]=\"buttonDisable || disableInput()\" [min]=\"column.numberPropertie.start\"\r\n                    [max]=\"column.numberPropertie.end\" class=\"form-control1 form-control-solid\" type=\"number\">\r\n                </div>\r\n                <!-- for Date -->\r\n                <div class=\"col-12 disp-flex\" *ngIf=\"column.dataType === 'date'\">\r\n                  <input class=\"form-control1\" [matDatepicker]=\"picker\" [max]=\"getMaxdate(question)\"\r\n                    [min]=\"getMindate(question)\"\r\n                    [(ngModel)]=\"dataGridColumns[getQuestion(question).labelName + '=' + column.order]\"\r\n                    [disabled]=\"buttonDisable || disableInput()\" (click)=\"picker.open()\">\r\n                  <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\r\n                  <mat-datepicker #picker [disabled]=\"buttonDisable || disableInput()\">\r\n                  </mat-datepicker>\r\n                </div>\r\n              </div>\r\n              <div class=\"act-btns\">\r\n                <button type=\"button\" class=\"btn btn-light-primary font-weight-bold\"\r\n                  (click)=\"cancelAddorUpdate(getQuestion(question))\">\r\n                  Cancel\r\n                </button>\r\n                <button type=\"button\" class=\"btn btn-primary font-weight-bold\"\r\n                  (click)=\"saveDataGridColumn(getQuestion(question))\">Add</button>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n      <div class=\"col-md-12 col-12 col-sm-12 col-lg-12 p-0 submit-pad\"\r\n        *ngIf=\"type !== 'qnrLinkProvider' && source!=='proLead' && (uuid || source === 'customer-details' || source === 'proDonation') && !disableInput()\">\r\n        <button class=\"normal-btn\" mat-flat-button [class.spinner]=\"buttonDisable\"\r\n          [class.spinner-darker-success]=\"buttonDisable\" [class.spinner-center]=\"buttonDisable\"\r\n          (click)=\"!buttonDisable && onSubmit('submit')\" [disabled]=\"buttonDisable\"\r\n          [class.disabled]=\"buttonDisable\">{{(type == 'qnr-link') ? 'Submit' : 'Update'}}</button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</section>\r\n<div #lightGalleryContainer style=\"display: none;\"></div>\r\n<section class=\"cons-inbox no-padding-small\" *ngIf=\"showservice\">\r\n  <div class=\"container consumer-dashhome\" *ngIf=\"!type\">\r\n    <div class=\"card title-gb rounded-0\" *ngIf=\"uuid\">\r\n      <h5 class=\"mt-2 bold\">{{questionnaire_heading | capitalizeFirst}} <a class=\"pull-left me-4 back-btn\"\r\n          (click)=\"goBack()\"><i class=\"fa fa-arrow-left\"></i></a></h5>\r\n    </div>\r\n  </div>\r\n  <app-common-innerloading-spinner *ngIf=\"loading\"></app-common-innerloading-spinner>\r\n  <div class=\"d-flex flex-column-fluid pull-right me-2 mb-4\"\r\n    *ngIf=\"type !== 'qnrLinkProvider' && !buttonDisable && waitlistStatus\">\r\n    <button class=\"normal-btn edit\" mat-flat-button (click)=\"editQnr()\">Edit</button>\r\n  </div>\r\n  <div class=\"d-flex flex-column-fluid width-100\" [class.qnrDisableState]=\"disableInput()\"\r\n    [class.p-0]=\"uuid && (source === 'consCheckin' || source === 'consAppt' || source === 'consDonationDetails' )\">\r\n    <div class=\"col-xl-12 force_center p-0\" [class.p-0]=\"uuid\"\r\n      [class.no-padding-small]=\"source && source=='ivr'\">\r\n      <div class=\"\">\r\n        <div class=\"\" *ngFor=\"let qnr of groupedQnr | keyvalue\" [class.section-shadow]=\"getSectionCount() > 1\">\r\n          <div *ngIf=\"itemArray.length == 0 \">\r\n            <div class=\"form-group mgn-0 border-dashed text-center\" *ngFor=\"let question of qnr.value\">\r\n              <div class=\"qnr-section\" *ngIf=\"getSectionCount() > 1\">\r\n                {{getQuestion(question).question.sectionName}}</div>\r\n              <label class=\"col-12 quest pointer-cursor\"\r\n                (click)=\"showDataGridAddSectionn(getQuestion(question).question, true)\">\r\n                <div>\r\n                  <img src=\"{{cdnPath}}assets/images/service-options.svg\" alt=\"Service Options\" class=\"img-fluid pb-0\"\r\n                    width=\"300\" height=\"300\">\r\n                </div>\r\n                <div class=\"pro-only\" *ngIf=\"showProviderText(getQuestion(question).question)\">For Providers</div>\r\n                <span class=\"red\" *ngIf=\"getQuestion(question).question.mandatory\">*</span>\r\n                <div>\r\n                  <span class=\"text-primary font-weight-bold\">Please Choose your Pet</span>\r\n                </div>\r\n                <div class=\"mt-3\">\r\n                  <span class=\"btn btn-light font-weight-bold\">Continue</span>\r\n                </div>\r\n              </label>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <div class=\"col-md-12 col-12 col-sm-12 mb-4 p-0\" *ngIf=\"showItem\">\r\n          <div>\r\n            <div class=\"card-border\" *ngFor=\" let items of itemArray\">\r\n\r\n              <div class=\"d-flex justify-content-between\">\r\n                <div>\r\n                  <div class=\"text-capitalize\">\r\n                    <div class=\"\">\r\n                      <span class=\"text-primary\">\r\n                        {{items.item}}<br>\r\n                      </span>\r\n                    </div>\r\n                  </div>\r\n                </div>\r\n                <div class=\"d-flex border-apply px-0\">\r\n                  <div (click)=\"decrement(items);\" class=\"pointer-cursor quantity quantity-1\">\r\n                    <span class=\"p-10\">-</span>\r\n                  </div>\r\n                  <div class=\"mx-2 pointer-cursor\"><span class=\"quantity\"\r\n                      *ngIf=\"items && items.columnItem && items.columnItem[0] && items.columnItem[0].answer && items.columnItem[0].answer.dataGridList && items.columnItem[0].answer.dataGridList[0] && items.columnItem[0].answer.dataGridList[0].dataGridListColumn && items.columnItem[0].answer.dataGridList[0].dataGridListColumn[0] && items.columnItem[0].answer.dataGridList[0].dataGridListColumn[0].quantity\">\r\n                      {{items.columnItem[0].answer.dataGridList[0].dataGridListColumn[0].quantity}}</span>\r\n                  </div>\r\n                  <div (click)=\"increment(items);\" class=\"pointer-cursor quantity quantity-1\">\r\n                    <span class=\"p-10\">+</span>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n              <div>\r\n                <span class=\"text-primary\"><span><i class=\"fa fa-inr\"></i>\r\n                    {{items.price * getItemQuantity(items)}}/-\r\n                  </span>\r\n                </span>\r\n              </div>\r\n            </div>\r\n            <div class=\"clearfix\"></div>\r\n            <div *ngIf=\"showItem &&itemArray.length > 0\">\r\n              <div *ngFor=\"let qnr of groupedQnr | keyvalue\" [class.section-shadow]=\"getSectionCount() > 1\">\r\n                <div *ngFor=\"let question of qnr.value\">\r\n                  <label class=\"col-12 quest pointer-cursor\"\r\n                    (click)=\"showDataGridAddSectionn(getQuestion(question).question, true)\">\r\n                    <span class=\"btn btn-light font-weight-bold\"><i class=\"fa fa-plus text-white\"></i>Add</span>\r\n                  </label>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</section>", styles: [".dropzone{min-height:auto!important}.question-box{margin-top:10px}.btn-light{background-color:#1e4079!important;padding:5px 25px!important;color:#fff!important}.quest-outer{padding:10px}.error-msg{color:red}.upload-btn{background:#fff;border:1px solid;font-size:small}.card-border{box-shadow:0 0 5px 5px #f0f0f0!important;padding:10px 30px!important;margin:20px 10px!important;cursor:pointer!important;border-radius:10px!important}.border-apply{border:2px solid #1e4079!important;border-radius:20px!important}.quantity{font-size:20px!important;font-weight:700!important}.quantity-1:hover{background-color:#1e4079!important;color:#fff!important;font-weight:700!important;border-radius:50%!important;padding:-2px 12px!important}::ng-deep .mat-checkbox-layout{font-weight:400!important}.force_center{margin-left:auto;margin-right:auto}.input-group-text{display:-webkit-box;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:.65rem 1rem;margin-bottom:0;font-size:1rem;font-weight:400;line-height:1.5;color:#3f4254;text-align:center;white-space:nowrap;background-color:#f3f6f9!important;border:1px solid #E4E6EF!important;border-radius:.42rem;border-top-left-radius:0;border-bottom-left-radius:0;cursor:pointer}.w_100{width:100%}.img_fit{width:120px;height:120px}.dropzone .dropzone-default{border:1px dashed #EBEDF3!important}.select-box{padding:10px!important;border:1px solid #E4E6EF!important;border-radius:.42rem!important}.normal-btn{padding:5px 20px;border:none!important}.edit{padding:3px 25px;border-radius:20px!important}.mgn-0{margin-left:0!important;margin-right:0!important;margin-bottom:10px!important}.quest{font-size:1.1rem!important}.mt-3 a:hover{text-decoration:underline!important}.dzimage,.dz-image{border:1px dashed #ccc}.gal_action{position:absolute;top:20px;right:-10px;background:#00000080;width:20px;height:20px;text-align:center;border-radius:50%;cursor:pointer}.single-file{padding:0!important;text-align:initial!important;border:none!important}.single-file .dz-preview{position:relative!important;display:inline-block!important;vertical-align:top!important;margin:16px!important;min-height:100px!important}.single-file .gal_action{top:-5px!important}.pro-only{float:right;color:red;font-size:.8rem}.qnrDisableState .card,.qnrDisableState .dropzone-default,.qnrDisableState .dz-image-preview{background:#eeeeee9e!important}.qnr-section{font-weight:700;padding-bottom:10px;text-transform:uppercase}.section-shadow{margin:20px 10px;padding:20px!important;box-shadow:0 0 10px #0000001f!important}.gridSection .gridColumn{padding:15px}.gridSection .gridColumn label{padding:0 12.5px!important;font-weight:400!important;color:#3f4254!important;font-size:.9rem!important}.gridSection .act-btns .btn{padding:5px 10px!important;margin:5px!important}.gridSection .act-btns{padding:0 20px}.fa-plus-circle{font-size:1.5rem!important}.addicon{color:#1e4079!important;cursor:pointer}.fa-trash,.fa-pen{color:#000!important;font-size:1rem!important}.dz-preview input{width:121px!important;border:1px solid #ccc}.submit-pad{padding:0 10px 20px!important}.form-group.card{border:1px solid #dadce063!important;border-radius:8px!important;padding:5px!important}.docname{width:120px;margin-bottom:5px;text-overflow:ellipsis!important;overflow:hidden!important;white-space:nowrap!important}@media (max-width: 750px){.normal-btn{padding:3px 10px;border:none!important}.edit{padding:2px 12px;border-radius:10px!important}}.col-xl-12,.col-12,.col-sm-12,.col-md-12,.col-lg-12{position:relative;width:100%;padding-right:12.5px;padding-left:12.5px}@media (min-width: 1200px){.col-xl-12{flex:0 0 100%;max-width:100%}}.qnrsec{padding:10px}.p-10{padding:8px!important}.form-control1{display:block!important;width:100%!important;height:calc(1.5em + 1.3rem + 2px)!important;padding:.65rem 1rem!important;font-size:1rem!important;font-weight:400!important;line-height:1.5!important;color:#3f4254!important;background-color:#fff!important;background-clip:padding-box!important;border:1px solid #E4E6EF!important;border-radius:.42rem!important;box-shadow:none!important;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out!important}.form-control2{display:block!important;width:100%!important;padding:.65rem 1rem!important;font-size:1rem!important;font-weight:400!important;line-height:1.5!important;color:#3f4254!important;background-color:#fff!important;background-clip:padding-box!important;border:1px solid #E4E6EF!important;border-radius:.42rem!important;box-shadow:none!important;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out!important}.form-group label{font-size:1rem;font-weight:400;color:#3f4254}label{display:inline-block;margin-bottom:.5rem}.col-12{flex:0 0 100%;max-width:100%}.radio-list .radio span{margin-right:.75rem}.radio>span{background-color:#ebedf3;border:1px solid transparent}.radio>span{height:18px;width:18px}.radio>span{border-radius:50%;background-color:none;display:flex;align-items:center;justify-content:center;flex-shrink:0}.radio-list .radio{margin-bottom:1rem}.radio{display:flex;align-items:center;position:relative;text-align:left;cursor:pointer;font-size:1rem;transition:all .3s ease;margin:0}.radio>input{position:absolute;z-index:-1;opacity:0}.card{position:relative;display:flex;flex-direction:column;min-width:0;word-wrap:break-word;background-color:#fff;background-clip:border-box;border:1px solid #EBEDF3;border-radius:.42rem}.radio-list .radio:last-child{margin-bottom:0}@media (min-width: 992px){.col-lg-12{flex:0 0 100%;max-width:100%}}.dropzone.dropzone-default .dz-preview .dz-image{border-radius:.42rem}.btn.btn-icon i{padding:0;margin:0}.btn i{font-size:1.3rem;padding-right:.35rem;vertical-align:middle;line-height:1;display:inline-flex}.btn i{transition:color .15s ease,background-color .15s ease,border-color .15s ease,box-shadow .15s ease}.text-dark-50{color:#7e8299!important}.btn.btn-icon.btn-circle{border-radius:50%}.btn.btn-light-success{color:#1bc5bd;background-color:#c9f7f5;border-color:transparent}.btn.btn-icon{display:inline-flex;align-items:center;justify-content:center;padding:0;height:calc(1.5em + 1.3rem + 2px);width:calc(1.5em + 1.3rem + 2px)}.btn{display:inline-block;font-weight:400;color:#3f4254;text-align:center;vertical-align:middle;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;background-color:transparent;border:1px solid transparent;padding:.65rem 1rem;font-size:1rem;line-height:1.5;border-radius:.42rem;transition:color .3s ease-in-out,background-color .3s ease-in-out,border-color .3s ease-in-out,box-shadow .3s ease-in-out}.radio>input:checked~span{background-color:#1e4079}.radio>input:checked~span:after{background-color:#fff;border-color:#fff}.radio>input:checked~span:after{display:block}.radio>span:after{width:6px;height:6px}.radio>span:after{content:\"\";border-radius:100%!important}i{font-size:1.25rem;color:#b5b5c3}.dropzone{min-height:auto}.btn.btn-light-primary{background-color:#f9e2a7;border-color:transparent}.checkbox-lis .checkbox span{margin-right:.75rem}.checkbox>span{background-color:#ebedf3;border:1px solid transparent}.checkbox>span{height:18px;width:18px}.checkbox>span{background-color:none;display:flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:.42rem}.checkbox>span:after{width:5px;height:10px}.checkbox>span:after{content:\"\";border-color:transparent;border-style:solid;border-width:0 2px 2px 0!important;transform:rotate(45deg);margin-top:-2px}.checkbox-list{display:flex;flex-direction:column}.checkbox>input{position:absolute;z-index:-1;opacity:0}.checkbox>input:checked~span{background-color:#1e4079}.checkbox>input:checked~span:after{border-color:#fff}.checkbox{display:flex;align-items:center;position:relative;text-align:left;cursor:pointer;font-size:1rem;transition:all .3s ease;margin:0}.add-plus{color:#fff!important}.border-dashed{padding:10px!important}.add-plus-black{color:#000!important}.plus-black .fa .fa-plus{color:#000!important;font-size:12px!important}.checkbox-list .checkbox{margin-bottom:1rem}.checkbox-list .checkbox span{margin-right:.75rem}.checkbox-list .checkbox:last-child{margin-bottom:0}.btn.btn-primary{color:#fff;background-color:#1e4079;border-color:#1e4079}.font-weight-bold{font-weight:500!important}button{font-family:inherit}.form-control1:focus{color:#3f4254!important;background-color:#fff!important;border-color:#69b3ff!important;outline:0!important}.table.table-head-bg thead th:first-child{border-radius:.42rem}.table.table-head-bg thead tr,.table.table-head-bg thead th{background-color:#f3f6f9;border-bottom:0;letter-spacing:1px}.table.table-head-custom thead tr,.table.table-head-custom thead th{font-weight:600;color:#b5b5c3!important;font-size:.9rem;text-transform:uppercase}.table thead th{font-weight:600;font-size:1rem;border-bottom-width:1px;padding-top:1rem;padding-bottom:1rem}.table th,.table td{padding:.75rem}.table.table-head-bg thead tr:last-child,.table.table-head-bg thead th:last-child{border-top-right-radius:.42rem;border-bottom-right-radius:.42rem}.table-responsive1{display:block;width:100%;overflow-x:auto}.text-white{color:#fff!important;font-size:15px!important}.details{border:2px solid #1e4079!important;border-radius:10px!important;max-width:13%}.text-primary{color:#1e4079!important}.text-link{color:#1a6888}@media (min-width: 300px) and (max-width: 750px){.item{font-size:10px!important}.item_price{font-size:9px!important}.details{border:2px solid #1e4079!important;border-radius:10px!important;max-width:23%}}@media (max-width: 450px){.item{font-size:10px!important}.item_price{font-size:9px!important}}@media (min-width: 600px) and (max-width: 992px){.items{font-size:18px!important}.item_prices{font-size:16px!important}}@media (max-width: 450px){.incre{border:2px solid blue!important;border-radius:100px!important;max-width:20.66667%!important}}.font-weight-bold{font-weight:700!important}@media (max-width: 750px){.incre{max-width:20.66667%!important}}.incre{border:2px solid blue!important;border-radius:100px!important;max-width:10.66667%}@media (max-width: 893px){.disp-none-small{display:none!important}}@media (min-width: 800px){.disp-none-large{display:none!important}}.fa-inr{font-size:15px!important;color:#1e4079!important}.text-primary{font-weight:700!important}.flaticon-upload:before{content:\"\\f11d\"}[class*=\" flaticon-\"]:before{font-family:Flaticon;font-style:normal;font-weight:400;font-feature-settings:normal;font-variant:normal;line-height:1;text-decoration:inherit;text-rendering:optimizeLegibility;text-transform:none;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-smoothing:antialiased}.dropzone{position:relative!important;display:inline-block!important;vertical-align:top!important;min-height:100px!important}.dz-image{border-radius:20px;overflow:hidden;width:120px;height:120px;position:relative;display:block;z-index:10}.dz-image{border:1px dashed #ccc}.dropzone .dz-preview .dz-success-mark,.dropzone .dz-preview .dz-error-mark{pointer-events:none;z-index:500;position:absolute;display:block;top:50%;left:50%;margin-left:-27px;margin-top:-27px}\n"], dependencies: [{ kind: "directive", type: i12.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i12.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.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: i2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i2.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: LoadingSpinnerComponent, selector: "app-common-innerloading-spinner", inputs: ["spinnerParams"] }, { kind: "component", type: i15.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i15.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i15.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: i16.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i17.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i18.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "pipe", type: i12.DatePipe, name: "date" }, { kind: "pipe", type: i12.KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: CapitalizeFirstPipe, name: "capitalizeFirst" }, { kind: "pipe", type: SafeHtmlPipe, name: "safeHtml" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: QuestionnaireComponent, selector: "app-questionnaire", inputs: { questionnaireList: "questionnaireList", source: "source", accountId: "accountId", questionAnswers: "questionAnswers", customerDetails: "customerDetails", uuid: "uuid", type: "type", waitlistStatus: "waitlistStatus", orderStatus: "orderStatus", donationDetails: "donationDetails", service: "service", mode: "mode", tempType: "tempType", bookingType: "bookingType" }, outputs: { fileChanged: "fileChanged", returnAnswers: "returnAnswers" }, viewQueries: [{ propertyName: "file2", first: true, predicate: ["logofile1"], descendants: true }, { propertyName: "lightGalleryContainer", first: true, predicate: ["lightGalleryContainer"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<section class=\"cons-inbox no-padding-small\" *ngIf=\"!showservice\">\r\n  <div class=\"container consumer-dashhome p-0\" *ngIf=\"!type && source!='proLead'\">\r\n    <div class=\"card title-gb rounded-0\" *ngIf=\"uuid\">\r\n      <h5 class=\"mt-2 bold\">{{questionnaire_heading | capitalizeFirst}} <a class=\"pull-left me-4 back-btn\"\r\n          (click)=\"goBack()\"><i class=\"fa fa-arrow-left\"></i></a></h5>\r\n    </div>\r\n  </div>\r\n  <app-common-innerloading-spinner *ngIf=\"loading\"></app-common-innerloading-spinner>\r\n  <div class=\"d-flex flex-column-fluid pull-right me-2 mb-4\"\r\n    *ngIf=\"type !== 'qnrLinkProvider' && !buttonDisable && waitlistStatus\">\r\n    <button class=\"normal-btn edit\" mat-flat-button (click)=\"editQnr()\" id=\"btnEdit\">Edit</button>\r\n  </div>\r\n  <div class=\"d-flex flex-column-fluid width-100\" [class.qnrDisableState]=\"disableInput()\"\r\n    [class.p-0]=\"uuid && (source === 'consCheckin' || source === 'consAppt' || source === 'consOrder' || source === 'paper' || source === 'consDonationDetails' || source === 'ivr')\">\r\n    <div class=\"col-xl-12 force_center\" [class.p-0]=\"uuid\" [class.no-padding-small]=\"source && source=='ivr'\">\r\n      <div class=\"\">\r\n        <div class=\"qnrsec\" *ngFor=\"let qnr of groupedQnr | keyvalue: asIsOrder\"\r\n          [class.section-shadow]=\"getSectionCount() > 1\" [class.no-padding-small]=\"source && source=='ivr'\">\r\n          <div class=\"form-group card mgn-0\" *ngFor=\"let question of qnr.value\">\r\n            <label class=\"col-12 quest\">{{getQuestion(question).label}}\r\n              <i class=\"fa fa-plus-circle pull-right\" aria-hidden=\"true\"\r\n                [class.addicon]=\"!buttonDisable && !disableInput()\"\r\n                *ngIf=\"getQuestion(question).fieldDataType === 'dataGrid' && !showDataGrid[getQuestion(question).labelName]\"\r\n                (click)=\"!buttonDisable && !disableInput() && showDataGridAddSection(getQuestion(question), true)\"></i>\r\n              <div class=\"pro-only\" *ngIf=\"showProviderText(getQuestion(question))\">For Providers</div>\r\n              <span class=\"red\" *ngIf=\"getQuestion(question).mandatory\">*</span>\r\n              <div class=\"form-level-settings\" *ngIf=\"getQuestion(question).hint\"\r\n                [innerHTML]=\"getQuestion(question).hint | safeHtml\">\r\n              </div>\r\n            </label>\r\n            <!-- for file upload -->\r\n            <div class=\"col-12\" *ngIf=\"getQuestion(question).fieldDataType === 'fileUpload'\">\r\n              <mat-select multiple #deptsel [disabled]=\"buttonDisable || disableInput()\"\r\n                *ngIf=\"getQuestion(question).filePropertie.maxNoOfFile > 1 && getQuestion(question).filePropertie.minNoOfFile !== getQuestion(question).filePropertie.maxNoOfFile\"\r\n                [(ngModel)]=\"uploadFilesTemp[getQuestion(question).labelName]\" class=\"select-box\" placeholder=\"Select\">\r\n                <mat-option *ngFor=\"let document of getQuestion(question).filePropertie.allowedDocuments\"\r\n                  [value]=\"document\" (click)=\"changeImageSelected(getQuestion(question), document)\">\r\n                  {{document}}</mat-option>\r\n              </mat-select>\r\n              <div class=\"col-lg-12 col-12 col-md-12 col-sm-12 p-0 mt-4\"\r\n                *ngIf=\"getDocuments(getQuestion(question)) && getDocuments(getQuestion(question)).length > 0\">\r\n                <div class=\"dropzone dropzone-default dropzone-primary dz-clickable\"\r\n                  [class.single-file]=\"getQuestion(question).filePropertie.allowedDocuments.length==1\"\r\n                  style=\"cursor: auto;\">\r\n                  <ng-container *ngFor=\"let doc of getDocuments(getQuestion(question))\">\r\n                    <div class=\"dz-preview dz-processing dz-image-preview dz-error dz-complete\"\r\n                      *ngIf=\"getImg(getQuestion(question), doc)\">\r\n                      <div class=\"docname\" *ngIf=\"getQuestion(question).filePropertie.allowedDocuments.length > 1\">\r\n                        {{doc}}</div>\r\n                      <div class=\"dzimage pointer-cursor\" (click)=\"openAttachmentGallery(getQuestion(question), doc)\">\r\n                        <img alt=\"\" class=\"img_fit\" [src]=\"getImg(getQuestion(question), doc)\">\r\n                      </div>\r\n                      <input [disabled]=\"buttonDisable || disableInput()\" (blur)=\"onSubmit('inputChange');\"\r\n                        [(ngModel)]=\"comments[getQuestion(question).labelName + '=' + doc]\">\r\n                      <div class=\"gal_action\" *ngIf=\"!buttonDisable && !disableInput() && mode!=='read'\"\r\n                        (click)=\"changeImageSelected(getQuestion(question), doc)\">\r\n                        <i class=\"fa fa-times-circle\" aria-hidden=\"true\"></i>\r\n                      </div>\r\n                    </div>\r\n                    <div class=\"dz-preview dz-processing dz-image-preview dz-error dz-complete\"\r\n                      (click)=\"logofile1.click()\" *ngIf=\"!getImg(getQuestion(question), doc)\">\r\n                      <div class=\"docname\" *ngIf=\"getQuestion(question).filePropertie.allowedDocuments.length > 1\">\r\n                        {{doc}}</div>\r\n                      <div class=\"dz-image pointer-cursor\">\r\n                      </div>\r\n                      <input #logofile1 type=\"file\" accept=\"/*;capture=camera\" style=\"display:none;\"\r\n                        [disabled]=\"buttonDisable || disableInput()\"\r\n                        (change)=\"filesSelected($event, getQuestion(question), doc)\">\r\n                      <div class=\"dz-error-mark\">\r\n                        <a class=\"btn btn-icon btn-light-success btn-circle mr-2\"><i\r\n                            class=\"text-dark-50 flaticon-upload\"></i></a>\r\n                      </div>\r\n                    </div>\r\n                  </ng-container>\r\n                </div>\r\n              </div>\r\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\r\n                {{apiError[getQuestion(question).labelName]}}</div>\r\n            </div>\r\n            <!-- for checkbox -->\r\n            <div class=\"col-12\"\r\n              *ngIf=\"getQuestion(question).fieldDataType === 'list' && getQuestion(question).listPropertie.maxAnswers > 1\">\r\n              <div class=\"checkbox-list\">\r\n                <label class=\"checkbox\" *ngFor=\"let value of getQuestion(question).labelValues\">\r\n                  <input type=\"checkbox\" [checked]=\"isChecked(value, getQuestion(question))\"\r\n                    (change)=\"listChange($event, value, getQuestion(question))\"\r\n                    [disabled]=\"buttonDisable || disableInput()\">\r\n                  <span></span>\r\n                  {{value}}\r\n                </label>\r\n              </div>\r\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\r\n                {{apiError[getQuestion(question).labelName]}}</div>\r\n            </div>\r\n            <!-- for radio -->\r\n            <div class=\"col-12\"\r\n              *ngIf=\"getQuestion(question).fieldDataType === 'list' && getQuestion(question).listPropertie.maxAnswers === 1\">\r\n              <div class=\"radio-list\">\r\n                <label class=\"radio\" *ngFor=\"let value of getQuestion(question).labelValues\">\r\n                  <input type=\"radio\" [disabled]=\"buttonDisable || disableInput()\"\r\n                    [checked]=\"isChecked(value, getQuestion(question))\"\r\n                    (change)=\"listChange($event, value, getQuestion(question))\">\r\n                  <span></span>\r\n                  {{value}}\r\n                </label>\r\n              </div>\r\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\r\n                {{apiError[getQuestion(question).labelName]}}</div>\r\n            </div>\r\n            <!-- for toggel boolean -->\r\n            <div class=\"col-12\" *ngIf=\"getQuestion(question).fieldDataType === 'bool'\">\r\n              <div class=\"radio-list\">\r\n                <label class=\"radio\" *ngFor=\"let value of getQuestion(question).labelValues\">\r\n                  <input type=\"radio\" [disabled]=\"buttonDisable || disableInput()\"\r\n                    [checked]=\"isBooleanChecked(value, getQuestion(question))\"\r\n                    (change)=\"booleanChange($event, value, getQuestion(question))\">\r\n                  <span></span>\r\n                  {{value}}\r\n                </label>\r\n              </div>\r\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\r\n                {{apiError[getQuestion(question).labelName]}}</div>\r\n            </div>\r\n            <!-- for Text -->\r\n            <div class=\"col-12\" *ngIf=\"getQuestion(question).fieldDataType === 'plainText'\">\r\n              <input *ngIf=\"getQuestion(question).plainTextPropertie.maxNoOfLetter<=100\"\r\n                  [(ngModel)]=\"answers[getQuestion(question).labelName]\" (input)=\"onSubmit('inputChange');\"                  \r\n                  [minlength]=\"getQuestion(question).plainTextPropertie.minNoOfLetter\"\r\n                  [maxlength]=\"getQuestion(question).plainTextPropertie.maxNoOfLetter\"\r\n                  class=\"form-control1 form-control-solid\" type=\"text\" [disabled]=\"buttonDisable || disableInput()\">\r\n                <textarea rows=\"3\" *ngIf=\"getQuestion(question).plainTextPropertie.maxNoOfLetter>100\"\r\n                  [(ngModel)]=\"answers[getQuestion(question).labelName]\" (input)=\"onSubmit('inputChange');\"\r\n                  [minlength]=\"getQuestion(question).plainTextPropertie.minNoOfLetter\"\r\n                  [maxlength]=\"getQuestion(question).plainTextPropertie.maxNoOfLetter\" [disabled]=\"buttonDisable || disableInput()\"\r\n                  class=\"form-control2 form-control-solid\"></textarea>\r\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\r\n                {{apiError[getQuestion(question).labelName]}}</div>\r\n            </div>\r\n            <!-- for Number -->\r\n            <div class=\"col-12\" *ngIf=\"getQuestion(question).fieldDataType === 'number'\">\r\n              <input [(ngModel)]=\"answers[getQuestion(question).labelName]\" (input)=\"onSubmit('inputChange');\"\r\n                [min]=\"getQuestion(question).numberPropertie.start\" [max]=\"getQuestion(question).numberPropertie.end\"\r\n                [disabled]=\"buttonDisable || disableInput()\" class=\"form-control1 form-control-solid\" type=\"number\"\r\n                (keypress)=\"isNumeric($event)\">\r\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\r\n                {{apiError[getQuestion(question).labelName]}}</div>\r\n            </div>\r\n            <!-- for Date -->\r\n            <div class=\"col-12 disp-flex\" *ngIf=\"getQuestion(question).fieldDataType === 'date'\">\r\n              <input class=\"form-control1\" [matDatepicker]=\"picker\" [max]=\"getMaxdate(question)\"\r\n                [min]=\"getMindate(question)\" [(ngModel)]=\"answers[getQuestion(question).labelName]\"\r\n                (dateChange)=\"onSubmit('inputChange')\" [disabled]=\"buttonDisable || disableInput()\"\r\n                (click)=\"picker.open()\">\r\n              <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\r\n              <mat-datepicker #picker [disabled]=\"buttonDisable || disableInput()\"></mat-datepicker>\r\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\r\n                {{apiError[getQuestion(question).labelName]}}</div>\r\n            </div>\r\n            <!-- for Datagrid -->\r\n            <div class=\"table-responsive1\"\r\n              *ngIf=\"getQuestion(question).fieldDataType === 'dataGrid' && dataGridColumnsAnswerList[getQuestion(question).labelName] && dataGridColumnsAnswerList[getQuestion(question).labelName].length > 0\">\r\n              <table class=\"table table-head-custom table-head-bg table-borderless table-vertical-center\">\r\n                <thead>\r\n                  <th *ngFor=\"let column of getQuestion(question).dataGridProperties.dataGridColumns\">\r\n                    {{column.columnId}}</th>\r\n                  <th *ngIf=\"!buttonDisable && !disableInput() && !showDataGrid[getQuestion(question).labelName]\">\r\n                  </th>\r\n                  <th *ngIf=\"!buttonDisable && !disableInput() && !showDataGrid[getQuestion(question).labelName]\">\r\n                  </th>\r\n                </thead>\r\n                <tbody>\r\n                  <tr *ngFor=\"let column of dataGridColumnsAnswerList[getQuestion(question).labelName];let i =index\">\r\n                    <td *ngFor=\"let data of column | keyvalue\">\r\n                      <div\r\n                        *ngIf=\"getColumnType(getQuestion(question).dataGridProperties.dataGridColumns, data.key) === 'date'\">\r\n                        {{data.value | date : newTimeDateFormat}}\r\n                      </div>\r\n                      <div\r\n                        *ngIf=\"getColumnType(getQuestion(question).dataGridProperties.dataGridColumns, data.key) === 'bool'\">\r\n                        {{getBoolValue(data.value)}}\r\n                      </div>\r\n                      <div\r\n                        *ngIf=\"getColumnType(getQuestion(question).dataGridProperties.dataGridColumns, data.key) !== 'date' && getColumnType(getQuestion(question).dataGridProperties.dataGridColumns, data.key) !== 'bool'\">\r\n                        {{data.value}}\r\n                      </div>\r\n                    </td>\r\n                    <td *ngIf=\"!buttonDisable && !disableInput() && !showDataGrid[getQuestion(question).labelName]\">\r\n                      <i class=\"fa fa-pen\" (click)=\"editDataGrid(getQuestion(question), column)\"></i>\r\n                    </td>\r\n                    <td *ngIf=\"!buttonDisable && !disableInput() && !showDataGrid[getQuestion(question).labelName]\">\r\n                      <i class=\"fa fa-trash\" (click)=\"deleteDataGrid(getQuestion(question), column)\"></i>\r\n                    </td>\r\n                  </tr>\r\n                </tbody>\r\n              </table>\r\n            </div>\r\n            <div class=\"gridSection\" *ngIf=\"showDataGrid[getQuestion(question).labelName]\">\r\n              <div class=\"gridColumn\" *ngFor=\"let column of getQuestion(question).dataGridProperties.dataGridColumns\">\r\n                <label>{{column.label}}\r\n                  <span class=\"red\" *ngIf=\"column.mandatory\">*</span>\r\n                </label>\r\n                <!-- for checkbox -->\r\n                <div class=\"col-12\" *ngIf=\"column.dataType === 'list'\">\r\n                  <div class=\"checkbox-list\">\r\n                    <label class=\"checkbox\" *ngFor=\"let value of column.listPropertie.values\">\r\n                      <input type=\"checkbox\" [checked]=\"isChecked(value, getQuestion(question), column)\"\r\n                        (change)=\"listChange($event, value, getQuestion(question), column)\"\r\n                        [disabled]=\"buttonDisable || disableInput()\">\r\n                      <span></span>\r\n                      {{value}}\r\n                    </label>\r\n                  </div>\r\n                </div>\r\n                <!-- for toggel boolean -->\r\n                <div class=\"col-12\" *ngIf=\"column.dataType === 'bool'\">\r\n                  <div class=\"radio-list\">\r\n                    <label class=\"radio\">\r\n                      <input type=\"radio\" [disabled]=\"buttonDisable || disableInput()\"\r\n                        [checked]=\"isBooleanChecked('yes', getQuestion(question), column)\"\r\n                        (change)=\"booleanChange($event, 'yes', getQuestion(question), column)\">\r\n                      <span></span>\r\n                      Yes\r\n                    </label>\r\n                    <label class=\"radio\">\r\n                      <input type=\"radio\" [disabled]=\"buttonDisable || disableInput()\"\r\n                        [checked]=\"isBooleanChecked('no', getQuestion(question), column)\"\r\n                        (change)=\"booleanChange($event, 'no', getQuestion(question), column)\">\r\n                      <span></span>\r\n                      No\r\n                    </label>\r\n                  </div>\r\n                </div>\r\n                <!-- for Text -->\r\n                <div class=\"col-12\" *ngIf=\"column.dataType === 'plainText'\">\r\n                  <input [(ngModel)]=\"dataGridColumns[getQuestion(question).labelName + '=' + column.order]\"\r\n                    [disabled]=\"buttonDisable || disableInput()\" class=\"form-control1 form-control-solid\" type=\"text\">\r\n                </div>\r\n                <!-- for Number -->\r\n                <div class=\"col-12\" *ngIf=\"column.dataType === 'number'\">\r\n                  <input [(ngModel)]=\"dataGridColumns[getQuestion(question).labelName + '=' + column.order]\"\r\n                    [disabled]=\"buttonDisable || disableInput()\" [min]=\"column.numberPropertie.start\"\r\n                    [max]=\"column.numberPropertie.end\" class=\"form-control1 form-control-solid\" type=\"number\">\r\n                </div>\r\n                <!-- for Date -->\r\n                <div class=\"col-12 disp-flex\" *ngIf=\"column.dataType === 'date'\">\r\n                  <input class=\"form-control1\" [matDatepicker]=\"picker\" [max]=\"getMaxdate(question)\"\r\n                    [min]=\"getMindate(question)\"\r\n                    [(ngModel)]=\"dataGridColumns[getQuestion(question).labelName + '=' + column.order]\"\r\n                    [disabled]=\"buttonDisable || disableInput()\" (click)=\"picker.open()\">\r\n                  <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\r\n                  <mat-datepicker #picker [disabled]=\"buttonDisable || disableInput()\">\r\n                  </mat-datepicker>\r\n                </div>\r\n              </div>\r\n              <div class=\"act-btns\">\r\n                <button type=\"button\" class=\"btn btn-light-primary font-weight-bold\" id=\"btnCancelQ\"\r\n                  (click)=\"cancelAddorUpdate(getQuestion(question))\">\r\n                  Cancel\r\n                </button>\r\n                <button type=\"button\" class=\"btn btn-primary font-weight-bold\" id=\"btnSaveQ\"\r\n                  (click)=\"saveDataGridColumn(getQuestion(question))\">Add</button>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n      <div class=\"col-md-12 col-12 col-sm-12 col-lg-12 p-0 submit-pad\"\r\n        *ngIf=\"type !== 'qnrLinkProvider' && source!=='proLead' && (uuid || source === 'customer-details' || source === 'proDonation') && !disableInput()\">\r\n        <button class=\"normal-btn\" mat-flat-button [class.spinner]=\"buttonDisable\" id=\"btnSubmit\"\r\n          [class.spinner-darker-success]=\"buttonDisable\" [class.spinner-center]=\"buttonDisable\"\r\n          (click)=\"!buttonDisable && onSubmit('submit')\" [disabled]=\"buttonDisable\"\r\n          [class.disabled]=\"buttonDisable\">{{(type == 'qnr-link') ? 'Submit' : 'Update'}}</button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</section>\r\n<div #lightGalleryContainer style=\"display: none;\"></div>\r\n<section class=\"cons-inbox no-padding-small\" *ngIf=\"showservice\">\r\n  <div class=\"container consumer-dashhome\" *ngIf=\"!type\">\r\n    <div class=\"card title-gb rounded-0\" *ngIf=\"uuid\">\r\n      <h5 class=\"mt-2 bold\">{{questionnaire_heading | capitalizeFirst}} <a class=\"pull-left me-4 back-btn\"\r\n          (click)=\"goBack()\"><i class=\"fa fa-arrow-left\"></i></a></h5>\r\n    </div>\r\n  </div>\r\n  <app-common-innerloading-spinner *ngIf=\"loading\"></app-common-innerloading-spinner>\r\n  <div class=\"d-flex flex-column-fluid pull-right me-2 mb-4\"\r\n    *ngIf=\"type !== 'qnrLinkProvider' && !buttonDisable && waitlistStatus\">\r\n    <button class=\"normal-btn edit\" mat-flat-button (click)=\"editQnr()\" id=\"btnEditQNR\">Edit</button>\r\n  </div>\r\n  <div class=\"d-flex flex-column-fluid width-100\" [class.qnrDisableState]=\"disableInput()\"\r\n    [class.p-0]=\"uuid && (source === 'consCheckin' || source === 'consAppt' || source === 'consDonationDetails' )\">\r\n    <div class=\"col-xl-12 force_center p-0\" [class.p-0]=\"uuid\"\r\n      [class.no-padding-small]=\"source && source=='ivr'\">\r\n      <div class=\"\">\r\n        <div class=\"\" *ngFor=\"let qnr of groupedQnr | keyvalue\" [class.section-shadow]=\"getSectionCount() > 1\">\r\n          <div *ngIf=\"itemArray.length == 0 \">\r\n            <div class=\"form-group mgn-0 border-dashed text-center\" *ngFor=\"let question of qnr.value\">\r\n              <div class=\"qnr-section\" *ngIf=\"getSectionCount() > 1\">\r\n                {{getQuestion(question).question.sectionName}}</div>\r\n              <label class=\"col-12 quest pointer-cursor\"\r\n                (click)=\"showDataGridAddSectionn(getQuestion(question).question, true)\">\r\n                <div>\r\n                  <img src=\"{{cdnPath}}assets/images/service-options.svg\" alt=\"Service Options\" class=\"img-fluid pb-0\"\r\n                    width=\"300\" height=\"300\">\r\n                </div>\r\n                <div class=\"pro-only\" *ngIf=\"showProviderText(getQuestion(question).question)\">For Providers</div>\r\n                <span class=\"red\" *ngIf=\"getQuestion(question).question.mandatory\">*</span>\r\n                <div>\r\n                  <span class=\"text-primary font-weight-bold\">Please Choose your Pet</span>\r\n                </div>\r\n                <div class=\"mt-3\">\r\n                  <span class=\"btn btn-light font-weight-bold\">Continue</span>\r\n                </div>\r\n              </label>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <div class=\"col-md-12 col-12 col-sm-12 mb-4 p-0\" *ngIf=\"showItem\">\r\n          <div>\r\n            <div class=\"card-border\" *ngFor=\" let items of itemArray\">\r\n\r\n              <div class=\"d-flex justify-content-between\">\r\n                <div>\r\n                  <div class=\"text-capitalize\">\r\n                    <div class=\"\">\r\n                      <span class=\"text-primary\">\r\n                        {{items.item}}<br>\r\n                      </span>\r\n                    </div>\r\n                  </div>\r\n                </div>\r\n                <div class=\"d-flex border-apply px-0\">\r\n                  <div (click)=\"decrement(items);\" class=\"pointer-cursor quantity quantity-1\">\r\n                    <span class=\"p-10\">-</span>\r\n                  </div>\r\n                  <div class=\"mx-2 pointer-cursor\"><span class=\"quantity\"\r\n                      *ngIf=\"items && items.columnItem && items.columnItem[0] && items.columnItem[0].answer && items.columnItem[0].answer.dataGridList && items.columnItem[0].answer.dataGridList[0] && items.columnItem[0].answer.dataGridList[0].dataGridListColumn && items.columnItem[0].answer.dataGridList[0].dataGridListColumn[0] && items.columnItem[0].answer.dataGridList[0].dataGridListColumn[0].quantity\">\r\n                      {{items.columnItem[0].answer.dataGridList[0].dataGridListColumn[0].quantity}}</span>\r\n                  </div>\r\n                  <div (click)=\"increment(items);\" class=\"pointer-cursor quantity quantity-1\">\r\n                    <span class=\"p-10\">+</span>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n              <div>\r\n                <span class=\"text-primary\"><span><i class=\"fa fa-inr\"></i>\r\n                    {{items.price * getItemQuantity(items)}}/-\r\n                  </span>\r\n                </span>\r\n              </div>\r\n            </div>\r\n            <div class=\"clearfix\"></div>\r\n            <div *ngIf=\"showItem &&itemArray.length > 0\">\r\n              <div *ngFor=\"let qnr of groupedQnr | keyvalue\" [class.section-shadow]=\"getSectionCount() > 1\">\r\n                <div *ngFor=\"let question of qnr.value\">\r\n                  <label class=\"col-12 quest pointer-cursor\"\r\n                    (click)=\"showDataGridAddSectionn(getQuestion(question).question, true)\">\r\n                    <span class=\"btn btn-light font-weight-bold\"><i class=\"fa fa-plus text-white\"></i>Add</span>\r\n                  </label>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</section>", styles: [".dropzone{min-height:auto!important}.question-box{margin-top:10px}.btn-light{background-color:#1e4079!important;padding:5px 25px!important;color:#fff!important}.quest-outer{padding:10px}.error-msg{color:red}.upload-btn{background:#fff;border:1px solid;font-size:small}.card-border{box-shadow:0 0 5px 5px #f0f0f0!important;padding:10px 30px!important;margin:20px 10px!important;cursor:pointer!important;border-radius:10px!important}.border-apply{border:2px solid #1e4079!important;border-radius:20px!important}.quantity{font-size:20px!important;font-weight:700!important}.quantity-1:hover{background-color:#1e4079!important;color:#fff!important;font-weight:700!important;border-radius:50%!important;padding:-2px 12px!important}::ng-deep .mat-checkbox-layout{font-weight:400!important}.force_center{margin-left:auto;margin-right:auto}.input-group-text{display:-webkit-box;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:.65rem 1rem;margin-bottom:0;font-size:1rem;font-weight:400;line-height:1.5;color:#3f4254;text-align:center;white-space:nowrap;background-color:#f3f6f9!important;border:1px solid #E4E6EF!important;border-radius:.42rem;border-top-left-radius:0;border-bottom-left-radius:0;cursor:pointer}.w_100{width:100%}.img_fit{width:120px;height:120px}.dropzone .dropzone-default{border:1px dashed #EBEDF3!important}.select-box{padding:10px!important;border:1px solid #E4E6EF!important;border-radius:.42rem!important}.normal-btn{padding:5px 20px;border:none!important}.edit{padding:3px 25px;border-radius:20px!important}.mgn-0{margin-left:0!important;margin-right:0!important;margin-bottom:10px!important}.quest{font-size:1.1rem!important}.mt-3 a:hover{text-decoration:underline!important}.dzimage,.dz-image{border:1px dashed #ccc}.gal_action{position:absolute;top:20px;right:-10px;background:#00000080;width:20px;height:20px;text-align:center;border-radius:50%;cursor:pointer}.single-file{padding:0!important;text-align:initial!important;border:none!important}.single-file .dz-preview{position:relative!important;display:inline-block!important;vertical-align:top!important;margin:16px!important;min-height:100px!important}.single-file .gal_action{top:-5px!important}.pro-only{float:right;color:red;font-size:.8rem}.qnrDisableState .card,.qnrDisableState .dropzone-default,.qnrDisableState .dz-image-preview{background:#eeeeee9e!important}.qnr-section{font-weight:700;padding-bottom:10px;text-transform:uppercase}.section-shadow{margin:20px 10px;padding:20px!important;box-shadow:0 0 10px #0000001f!important}.gridSection .gridColumn{padding:15px}.gridSection .gridColumn label{padding:0 12.5px!important;font-weight:400!important;color:#3f4254!important;font-size:.9rem!important}.gridSection .act-btns .btn{padding:5px 10px!important;margin:5px!important}.gridSection .act-btns{padding:0 20px}.fa-plus-circle{font-size:1.5rem!important}.addicon{color:#1e4079!important;cursor:pointer}.fa-trash,.fa-pen{color:#000!important;font-size:1rem!important}.dz-preview input{width:121px!important;border:1px solid #ccc}.submit-pad{padding:0 10px 20px!important}.form-group.card{border:1px solid #dadce063!important;border-radius:8px!important;padding:5px!important}.docname{width:120px;margin-bottom:5px;text-overflow:ellipsis!important;overflow:hidden!important;white-space:nowrap!important}@media (max-width: 750px){.normal-btn{padding:3px 10px;border:none!important}.edit{padding:2px 12px;border-radius:10px!important}}.col-xl-12,.col-12,.col-sm-12,.col-md-12,.col-lg-12{position:relative;width:100%;padding-right:12.5px;padding-left:12.5px}@media (min-width: 1200px){.col-xl-12{flex:0 0 100%;max-width:100%}}.qnrsec{padding:10px}.p-10{padding:8px!important}.form-control1{display:block!important;width:100%!important;height:calc(1.5em + 1.3rem + 2px)!important;padding:.65rem 1rem!important;font-size:1rem!important;font-weight:400!important;line-height:1.5!important;color:#3f4254!important;background-color:#fff!important;background-clip:padding-box!important;border:1px solid #E4E6EF!important;border-radius:.42rem!important;box-shadow:none!important;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out!important}.form-control2{display:block!important;width:100%!important;padding:.65rem 1rem!important;font-size:1rem!important;font-weight:400!important;line-height:1.5!important;color:#3f4254!important;background-color:#fff!important;background-clip:padding-box!important;border:1px solid #E4E6EF!important;border-radius:.42rem!important;box-shadow:none!important;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out!important}.form-group label{font-size:1rem;font-weight:400;color:#3f4254}label{display:inline-block;margin-bottom:.5rem}.col-12{flex:0 0 100%;max-width:100%}.radio-list .radio span{margin-right:.75rem}.radio>span{background-color:#ebedf3;border:1px solid transparent}.radio>span{height:18px;width:18px}.radio>span{border-radius:50%;background-color:none;display:flex;align-items:center;justify-content:center;flex-shrink:0}.radio-list .radio{margin-bottom:1rem}.radio{display:flex;align-items:center;position:relative;text-align:left;cursor:pointer;font-size:1rem;transition:all .3s ease;margin:0}.radio>input{position:absolute;z-index:-1;opacity:0}.card{position:relative;display:flex;flex-direction:column;min-width:0;word-wrap:break-word;background-color:#fff;background-clip:border-box;border:1px solid #EBEDF3;border-radius:.42rem}.radio-list .radio:last-child{margin-bottom:0}@media (min-width: 992px){.col-lg-12{flex:0 0 100%;max-width:100%}}.dropzone.dropzone-default .dz-preview .dz-image{border-radius:.42rem}.btn.btn-icon i{padding:0;margin:0}.btn i{font-size:1.3rem;padding-right:.35rem;vertical-align:middle;line-height:1;display:inline-flex}.btn i{transition:color .15s ease,background-color .15s ease,border-color .15s ease,box-shadow .15s ease}.text-dark-50{color:#7e8299!important}.btn.btn-icon.btn-circle{border-radius:50%}.btn.btn-light-success{color:#1bc5bd;background-color:#c9f7f5;border-color:transparent}.btn.btn-icon{display:inline-flex;align-items:center;justify-content:center;padding:0;height:calc(1.5em + 1.3rem + 2px);width:calc(1.5em + 1.3rem + 2px)}.btn{display:inline-block;font-weight:400;color:#3f4254;text-align:center;vertical-align:middle;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;background-color:transparent;border:1px solid transparent;padding:.65rem 1rem;font-size:1rem;line-height:1.5;border-radius:.42rem;transition:color .3s ease-in-out,background-color .3s ease-in-out,border-color .3s ease-in-out,box-shadow .3s ease-in-out}.radio>input:checked~span{background-color:#1e4079}.radio>input:checked~span:after{background-color:#fff;border-color:#fff}.radio>input:checked~span:after{display:block}.radio>span:after{width:6px;height:6px}.radio>span:after{content:\"\";border-radius:100%!important}i{font-size:1.25rem;color:#b5b5c3}.dropzone{min-height:auto}.btn.btn-light-primary{background-color:#f9e2a7;border-color:transparent}.checkbox-lis .checkbox span{margin-right:.75rem}.checkbox>span{background-color:#ebedf3;border:1px solid transparent}.checkbox>span{height:18px;width:18px}.checkbox>span{background-color:none;display:flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:.42rem}.checkbox>span:after{width:5px;height:10px}.checkbox>span:after{content:\"\";border-color:transparent;border-style:solid;border-width:0 2px 2px 0!important;transform:rotate(45deg);margin-top:-2px}.checkbox-list{display:flex;flex-direction:column}.checkbox>input{position:absolute;z-index:-1;opacity:0}.checkbox>input:checked~span{background-color:#1e4079}.checkbox>input:checked~span:after{border-color:#fff}.checkbox{display:flex;align-items:center;position:relative;text-align:left;cursor:pointer;font-size:1rem;transition:all .3s ease;margin:0}.add-plus{color:#fff!important}.border-dashed{padding:10px!important}.add-plus-black{color:#000!important}.plus-black .fa .fa-plus{color:#000!important;font-size:12px!important}.checkbox-list .checkbox{margin-bottom:1rem}.checkbox-list .checkbox span{margin-right:.75rem}.checkbox-list .checkbox:last-child{margin-bottom:0}.btn.btn-primary{color:#fff;background-color:#1e4079;border-color:#1e4079}.font-weight-bold{font-weight:500!important}button{font-family:inherit}.form-control1:focus{color:#3f4254!important;background-color:#fff!important;border-color:#69b3ff!important;outline:0!important}.table.table-head-bg thead th:first-child{border-radius:.42rem}.table.table-head-bg thead tr,.table.table-head-bg thead th{background-color:#f3f6f9;border-bottom:0;letter-spacing:1px}.table.table-head-custom thead tr,.table.table-head-custom thead th{font-weight:600;color:#b5b5c3!important;font-size:.9rem;text-transform:uppercase}.table thead th{font-weight:600;font-size:1rem;border-bottom-width:1px;padding-top:1rem;padding-bottom:1rem}.table th,.table td{padding:.75rem}.table.table-head-bg thead tr:last-child,.table.table-head-bg thead th:last-child{border-top-right-radius:.42rem;border-bottom-right-radius:.42rem}.table-responsive1{display:block;width:100%;overflow-x:auto}.text-white{color:#fff!important;font-size:15px!important}.details{border:2px solid #1e4079!important;border-radius:10px!important;max-width:13%}.text-primary{color:#1e4079!important}.text-link{color:#1a6888}@media (min-width: 300px) and (max-width: 750px){.item{font-size:10px!important}.item_price{font-size:9px!important}.details{border:2px solid #1e4079!important;border-radius:10px!important;max-width:23%}}@media (max-width: 450px){.item{font-size:10px!important}.item_price{font-size:9px!important}}@media (min-width: 600px) and (max-width: 992px){.items{font-size:18px!important}.item_prices{font-size:16px!important}}@media (max-width: 450px){.incre{border:2px solid blue!important;border-radius:100px!important;max-width:20.66667%!important}}.font-weight-bold{font-weight:700!important}@media (max-width: 750px){.incre{max-width:20.66667%!important}}.incre{border:2px solid blue!important;border-radius:100px!important;max-width:10.66667%}@media (max-width: 893px){.disp-none-small{display:none!important}}@media (min-width: 800px){.disp-none-large{display:none!important}}.fa-inr{font-size:15px!important;color:#1e4079!important}.text-primary{font-weight:700!important}.flaticon-upload:before{content:\"\\f11d\"}[class*=\" flaticon-\"]:before{font-family:Flaticon;font-style:normal;font-weight:400;font-feature-settings:normal;font-variant:normal;line-height:1;text-decoration:inherit;text-rendering:optimizeLegibility;text-transform:none;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-smoothing:antialiased}.dropzone{position:relative!important;display:inline-block!important;vertical-align:top!important;min-height:100px!important}.dz-image{border-radius:20px;overflow:hidden;width:120px;height:120px;position:relative;display:block;z-index:10}.dz-image{border:1px dashed #ccc}.dropzone .dz-preview .dz-success-mark,.dropzone .dz-preview .dz-error-mark{pointer-events:none;z-index:500;position:absolute;display:block;top:50%;left:50%;margin-left:-27px;margin-top:-27px}\n"], dependencies: [{ kind: "directive", type: i12.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i12.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.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: i2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i2.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: LoadingSpinnerComponent, selector: "app-common-innerloading-spinner", inputs: ["spinnerParams"] }, { kind: "component", type: i15.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i15.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i15.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: i16.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i17.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i18.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "pipe", type: i12.DatePipe, name: "date" }, { kind: "pipe", type: i12.KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: CapitalizeFirstPipe, name: "capitalizeFirst" }, { kind: "pipe", type: SafeHtmlPipe, name: "safeHtml" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: QuestionnaireComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-questionnaire', template: "<section class=\"cons-inbox no-padding-small\" *ngIf=\"!showservice\">\r\n  <div class=\"container consumer-dashhome p-0\" *ngIf=\"!type && source!='proLead'\">\r\n    <div class=\"card title-gb rounded-0\" *ngIf=\"uuid\">\r\n      <h5 class=\"mt-2 bold\">{{questionnaire_heading | capitalizeFirst}} <a class=\"pull-left me-4 back-btn\"\r\n          (click)=\"goBack()\"><i class=\"fa fa-arrow-left\"></i></a></h5>\r\n    </div>\r\n  </div>\r\n  <app-common-innerloading-spinner *ngIf=\"loading\"></app-common-innerloading-spinner>\r\n  <div class=\"d-flex flex-column-fluid pull-right me-2 mb-4\"\r\n    *ngIf=\"type !== 'qnrLinkProvider' && !buttonDisable && waitlistStatus\">\r\n    <button class=\"normal-btn edit\" mat-flat-button (click)=\"editQnr()\">Edit</button>\r\n  </div>\r\n  <div class=\"d-flex flex-column-fluid width-100\" [class.qnrDisableState]=\"disableInput()\"\r\n    [class.p-0]=\"uuid && (source === 'consCheckin' || source === 'consAppt' || source === 'consOrder' || source === 'paper' || source === 'consDonationDetails' || source === 'ivr')\">\r\n    <div class=\"col-xl-12 force_center\" [class.p-0]=\"uuid\" [class.no-padding-small]=\"source && source=='ivr'\">\r\n      <div class=\"\">\r\n        <div class=\"qnrsec\" *ngFor=\"let qnr of groupedQnr | keyvalue: asIsOrder\"\r\n          [class.section-shadow]=\"getSectionCount() > 1\" [class.no-padding-small]=\"source && source=='ivr'\">\r\n          <div class=\"form-group card mgn-0\" *ngFor=\"let question of qnr.value\">\r\n            <label class=\"col-12 quest\">{{getQuestion(question).label}}\r\n              <i class=\"fa fa-plus-circle pull-right\" aria-hidden=\"true\"\r\n                [class.addicon]=\"!buttonDisable && !disableInput()\"\r\n                *ngIf=\"getQuestion(question).fieldDataType === 'dataGrid' && !showDataGrid[getQuestion(question).labelName]\"\r\n                (click)=\"!buttonDisable && !disableInput() && showDataGridAddSection(getQuestion(question), true)\"></i>\r\n              <div class=\"pro-only\" *ngIf=\"showProviderText(getQuestion(question))\">For Providers</div>\r\n              <span class=\"red\" *ngIf=\"getQuestion(question).mandatory\">*</span>\r\n              <div class=\"form-level-settings\" *ngIf=\"getQuestion(question).hint\"\r\n                [innerHTML]=\"getQuestion(question).hint | safeHtml\">\r\n              </div>\r\n            </label>\r\n            <!-- for file upload -->\r\n            <div class=\"col-12\" *ngIf=\"getQuestion(question).fieldDataType === 'fileUpload'\">\r\n              <mat-select multiple #deptsel [disabled]=\"buttonDisable || disableInput()\"\r\n                *ngIf=\"getQuestion(question).filePropertie.maxNoOfFile > 1 && getQuestion(question).filePropertie.minNoOfFile !== getQuestion(question).filePropertie.maxNoOfFile\"\r\n                [(ngModel)]=\"uploadFilesTemp[getQuestion(question).labelName]\" class=\"select-box\" placeholder=\"Select\">\r\n                <mat-option *ngFor=\"let document of getQuestion(question).filePropertie.allowedDocuments\"\r\n                  [value]=\"document\" (click)=\"changeImageSelected(getQuestion(question), document)\">\r\n                  {{document}}</mat-option>\r\n              </mat-select>\r\n              <div class=\"col-lg-12 col-12 col-md-12 col-sm-12 p-0 mt-4\"\r\n                *ngIf=\"getDocuments(getQuestion(question)) && getDocuments(getQuestion(question)).length > 0\">\r\n                <div class=\"dropzone dropzone-default dropzone-primary dz-clickable\"\r\n                  [class.single-file]=\"getQuestion(question).filePropertie.allowedDocuments.length==1\"\r\n                  style=\"cursor: auto;\">\r\n                  <ng-container *ngFor=\"let doc of getDocuments(getQuestion(question))\">\r\n                    <div class=\"dz-preview dz-processing dz-image-preview dz-error dz-complete\"\r\n                      *ngIf=\"getImg(getQuestion(question), doc)\">\r\n                      <div class=\"docname\" *ngIf=\"getQuestion(question).filePropertie.allowedDocuments.length > 1\">\r\n                        {{doc}}</div>\r\n                      <div class=\"dzimage pointer-cursor\" (click)=\"openAttachmentGallery(getQuestion(question), doc)\">\r\n                        <img alt=\"\" class=\"img_fit\" [src]=\"getImg(getQuestion(question), doc)\">\r\n                      </div>\r\n                      <input [disabled]=\"buttonDisable || disableInput()\" (blur)=\"onSubmit('inputChange');\"\r\n                        [(ngModel)]=\"comments[getQuestion(question).labelName + '=' + doc]\">\r\n                      <div class=\"gal_action\" *ngIf=\"!buttonDisable && !disableInput() && mode!=='read'\"\r\n                        (click)=\"changeImageSelected(getQuestion(question), doc)\">\r\n                        <i class=\"fa fa-times-circle\" aria-hidden=\"true\"></i>\r\n                      </div>\r\n                    </div>\r\n                    <div class=\"dz-preview dz-processing dz-image-preview dz-error dz-complete\"\r\n                      (click)=\"logofile1.click()\" *ngIf=\"!getImg(getQuestion(question), doc)\">\r\n                      <div class=\"docname\" *ngIf=\"getQuestion(question).filePropertie.allowedDocuments.length > 1\">\r\n                        {{doc}}</div>\r\n                      <div class=\"dz-image pointer-cursor\">\r\n                      </div>\r\n                      <input #logofile1 type=\"file\" accept=\"/*;capture=camera\" style=\"display:none;\"\r\n                        [disabled]=\"buttonDisable || disableInput()\"\r\n                        (change)=\"filesSelected($event, getQuestion(question), doc)\">\r\n                      <div class=\"dz-error-mark\">\r\n                        <a class=\"btn btn-icon btn-light-success btn-circle mr-2\"><i\r\n                            class=\"text-dark-50 flaticon-upload\"></i></a>\r\n                      </div>\r\n                    </div>\r\n                  </ng-container>\r\n                </div>\r\n              </div>\r\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\r\n                {{apiError[getQuestion(question).labelName]}}</div>\r\n            </div>\r\n            <!-- for checkbox -->\r\n            <div class=\"col-12\"\r\n              *ngIf=\"getQuestion(question).fieldDataType === 'list' && getQuestion(question).listPropertie.maxAnswers > 1\">\r\n              <div class=\"checkbox-list\">\r\n                <label class=\"checkbox\" *ngFor=\"let value of getQuestion(question).labelValues\">\r\n                  <input type=\"checkbox\" [checked]=\"isChecked(value, getQuestion(question))\"\r\n                    (change)=\"listChange($event, value, getQuestion(question))\"\r\n                    [disabled]=\"buttonDisable || disableInput()\">\r\n                  <span></span>\r\n                  {{value}}\r\n                </label>\r\n              </div>\r\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\r\n                {{apiError[getQuestion(question).labelName]}}</div>\r\n            </div>\r\n            <!-- for radio -->\r\n            <div class=\"col-12\"\r\n              *ngIf=\"getQuestion(question).fieldDataType === 'list' && getQuestion(question).listPropertie.maxAnswers === 1\">\r\n              <div class=\"radio-list\">\r\n                <label class=\"radio\" *ngFor=\"let value of getQuestion(question).labelValues\">\r\n                  <input type=\"radio\" [disabled]=\"buttonDisable || disableInput()\"\r\n                    [checked]=\"isChecked(value, getQuestion(question))\"\r\n                    (change)=\"listChange($event, value, getQuestion(question))\">\r\n                  <span></span>\r\n                  {{value}}\r\n                </label>\r\n              </div>\r\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\r\n                {{apiError[getQuestion(question).labelName]}}</div>\r\n            </div>\r\n            <!-- for toggel boolean -->\r\n            <div class=\"col-12\" *ngIf=\"getQuestion(question).fieldDataType === 'bool'\">\r\n              <div class=\"radio-list\">\r\n                <label class=\"radio\" *ngFor=\"let value of getQuestion(question).labelValues\">\r\n                  <input type=\"radio\" [disabled]=\"buttonDisable || disableInput()\"\r\n                    [checked]=\"isBooleanChecked(value, getQuestion(question))\"\r\n                    (change)=\"booleanChange($event, value, getQuestion(question))\">\r\n                  <span></span>\r\n                  {{value}}\r\n                </label>\r\n              </div>\r\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\r\n                {{apiError[getQuestion(question).labelName]}}</div>\r\n            </div>\r\n            <!-- for Text -->\r\n            <div class=\"col-12\" *ngIf=\"getQuestion(question).fieldDataType === 'plainText'\">\r\n              <input *ngIf=\"getQuestion(question).plainTextPropertie.maxNoOfLetter<=100\"\r\n                  [(ngModel)]=\"answers[getQuestion(question).labelName]\" (input)=\"onSubmit('inputChange');\"                  \r\n                  [minlength]=\"getQuestion(question).plainTextPropertie.minNoOfLetter\"\r\n                  [maxlength]=\"getQuestion(question).plainTextPropertie.maxNoOfLetter\"\r\n                  class=\"form-control1 form-control-solid\" type=\"text\" [disabled]=\"buttonDisable || disableInput()\">\r\n                <textarea rows=\"3\" *ngIf=\"getQuestion(question).plainTextPropertie.maxNoOfLetter>100\"\r\n                  [(ngModel)]=\"answers[getQuestion(question).labelName]\" (input)=\"onSubmit('inputChange');\"\r\n                  [minlength]=\"getQuestion(question).plainTextPropertie.minNoOfLetter\"\r\n                  [maxlength]=\"getQuestion(question).plainTextPropertie.maxNoOfLetter\" [disabled]=\"buttonDisable || disableInput()\"\r\n                  class=\"form-control2 form-control-solid\"></textarea>\r\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\r\n                {{apiError[getQuestion(question).labelName]}}</div>\r\n            </div>\r\n            <!-- for Number -->\r\n            <div class=\"col-12\" *ngIf=\"getQuestion(question).fieldDataType === 'number'\">\r\n              <input [(ngModel)]=\"answers[getQuestion(question).labelName]\" (input)=\"onSubmit('inputChange');\"\r\n                [min]=\"getQuestion(question).numberPropertie.start\" [max]=\"getQuestion(question).numberPropertie.end\"\r\n                [disabled]=\"buttonDisable || disableInput()\" class=\"form-control1 form-control-solid\" type=\"number\"\r\n                (keypress)=\"isNumeric($event)\">\r\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\r\n                {{apiError[getQuestion(question).labelName]}}</div>\r\n            </div>\r\n            <!-- for Date -->\r\n            <div class=\"col-12 disp-flex\" *ngIf=\"getQuestion(question).fieldDataType === 'date'\">\r\n              <input class=\"form-control1\" [matDatepicker]=\"picker\" [max]=\"getMaxdate(question)\"\r\n                [min]=\"getMindate(question)\" [(ngModel)]=\"answers[getQuestion(question).labelName]\"\r\n                (dateChange)=\"onSubmit('inputChange')\" [disabled]=\"buttonDisable || disableInput()\"\r\n                (click)=\"picker.open()\">\r\n              <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\r\n              <mat-datepicker #picker [disabled]=\"buttonDisable || disableInput()\"></mat-datepicker>\r\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\r\n                {{apiError[getQuestion(question).labelName]}}</div>\r\n            </div>\r\n            <!-- for Datagrid -->\r\n            <div class=\"table-responsive1\"\r\n              *ngIf=\"getQuestion(question).fieldDataType === 'dataGrid' && dataGridColumnsAnswerList[getQuestion(question).labelName] && dataGridColumnsAnswerList[getQuestion(question).labelName].length > 0\">\r\n              <table class=\"table table-head-custom table-head-bg table-borderless table-vertical-center\">\r\n                <thead>\r\n                  <th *ngFor=\"let column of getQuestion(question).dataGridProperties.dataGridColumns\">\r\n                    {{column.columnId}}</th>\r\n                  <th *ngIf=\"!buttonDisable && !disableInput() && !showDataGrid[getQuestion(question).labelName]\">\r\n                  </th>\r\n                  <th *ngIf=\"!buttonDisable && !disableInput() && !showDataGrid[getQuestion(question).labelName]\">\r\n                  </th>\r\n                </thead>\r\n                <tbody>\r\n                  <tr *ngFor=\"let column of dataGridColumnsAnswerList[getQuestion(question).labelName];let i =index\">\r\n                    <td *ngFor=\"let data of column | keyvalue\">\r\n                      <div\r\n                        *ngIf=\"getColumnType(getQuestion(question).dataGridProperties.dataGridColumns, data.key) === 'date'\">\r\n                        {{data.value | date : newTimeDateFormat}}\r\n                      </div>\r\n                      <div\r\n                        *ngIf=\"getColumnType(getQuestion(question).dataGridProperties.dataGridColumns, data.key) === 'bool'\">\r\n                        {{getBoolValue(data.value)}}\r\n                      </div>\r\n                      <div\r\n                        *ngIf=\"getColumnType(getQuestion(question).dataGridProperties.dataGridColumns, data.key) !== 'date' && getColumnType(getQuestion(question).dataGridProperties.dataGridColumns, data.key) !== 'bool'\">\r\n                        {{data.value}}\r\n                      </div>\r\n                    </td>\r\n                    <td *ngIf=\"!buttonDisable && !disableInput() && !showDataGrid[getQuestion(question).labelName]\">\r\n                      <i class=\"fa fa-pen\" (click)=\"editDataGrid(getQuestion(question), column)\"></i>\r\n                    </td>\r\n                    <td *ngIf=\"!buttonDisable && !disableInput() && !showDataGrid[getQuestion(question).labelName]\">\r\n                      <i class=\"fa fa-trash\" (click)=\"deleteDataGrid(getQuestion(question), column)\"></i>\r\n                    </td>\r\n                  </tr>\r\n                </tbody>\r\n              </table>\r\n            </div>\r\n            <div class=\"gridSection\" *ngIf=\"showDataGrid[getQuestion(question).labelName]\">\r\n              <div class=\"gridColumn\" *ngFor=\"let column of getQuestion(question).dataGridProperties.dataGridColumns\">\r\n                <label>{{column.label}}\r\n                  <span class=\"red\" *ngIf=\"column.mandatory\">*</span>\r\n                </label>\r\n                <!-- for checkbox -->\r\n                <div class=\"col-12\" *ngIf=\"column.dataType === 'list'\">\r\n                  <div class=\"checkbox-list\">\r\n                    <label class=\"checkbox\" *ngFor=\"let value of column.listPropertie.values\">\r\n                      <input type=\"checkbox\" [checked]=\"isChecked(value, getQuestion(question), column)\"\r\n                        (change)=\"listChange($event, value, getQuestion(question), column)\"\r\n                        [disabled]=\"buttonDisable || disableInput()\">\r\n                      <span></span>\r\n                      {{value}}\r\n                    </label>\r\n                  </div>\r\n                </div>\r\n                <!-- for toggel boolean -->\r\n                <div class=\"col-12\" *ngIf=\"column.dataType === 'bool'\">\r\n                  <div class=\"radio-list\">\r\n                    <label class=\"radio\">\r\n                      <input type=\"radio\" [disabled]=\"buttonDisable || disableInput()\"\r\n                        [checked]=\"isBooleanChecked('yes', getQuestion(question), column)\"\r\n                        (change)=\"booleanChange($event, 'yes', getQuestion(question), column)\">\r\n                      <span></span>\r\n                      Yes\r\n                    </label>\r\n                    <label class=\"radio\">\r\n                      <input type=\"radio\" [disabled]=\"buttonDisable || disableInput()\"\r\n                        [checked]=\"isBooleanChecked('no', getQuestion(question), column)\"\r\n                        (change)=\"booleanChange($event, 'no', getQuestion(question), column)\">\r\n                      <span></span>\r\n                      No\r\n                    </label>\r\n                  </div>\r\n                </div>\r\n                <!-- for Text -->\r\n                <div class=\"col-12\" *ngIf=\"column.dataType === 'plainText'\">\r\n                  <input [(ngModel)]=\"dataGridColumns[getQuestion(question).labelName + '=' + column.order]\"\r\n                    [disabled]=\"buttonDisable || disableInput()\" class=\"form-control1 form-control-solid\" type=\"text\">\r\n                </div>\r\n                <!-- for Number -->\r\n                <div class=\"col-12\" *ngIf=\"column.dataType === 'number'\">\r\n                  <input [(ngModel)]=\"dataGridColumns[getQuestion(question).labelName + '=' + column.order]\"\r\n                    [disabled]=\"buttonDisable || disableInput()\" [min]=\"column.numberPropertie.start\"\r\n                    [max]=\"column.numberPropertie.end\" class=\"form-control1 form-control-solid\" type=\"number\">\r\n                </div>\r\n                <!-- for Date -->\r\n                <div class=\"col-12 disp-flex\" *ngIf=\"column.dataType === 'date'\">\r\n                  <input class=\"form-control1\" [matDatepicker]=\"picker\" [max]=\"getMaxdate(question)\"\r\n                    [min]=\"getMindate(question)\"\r\n                    [(ngModel)]=\"dataGridColumns[getQuestion(question).labelName + '=' + column.order]\"\r\n                    [disabled]=\"buttonDisable || disableInput()\" (click)=\"picker.open()\">\r\n                  <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\r\n                  <mat-datepicker #picker [disabled]=\"buttonDisable || disableInput()\">\r\n                  </mat-datepicker>\r\n                </div>\r\n              </div>\r\n              <div class=\"act-btns\">\r\n                <button type=\"button\" class=\"btn btn-light-primary font-weight-bold\"\r\n                  (click)=\"cancelAddorUpdate(getQuestion(question))\">\r\n                  Cancel\r\n                </button>\r\n                <button type=\"button\" class=\"btn btn-primary font-weight-bold\"\r\n                  (click)=\"saveDataGridColumn(getQuestion(question))\">Add</button>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n      <div class=\"col-md-12 col-12 col-sm-12 col-lg-12 p-0 submit-pad\"\r\n        *ngIf=\"type !== 'qnrLinkProvider' && source!=='proLead' && (uuid || source === 'customer-details' || source === 'proDonation') && !disableInput()\">\r\n        <button class=\"normal-btn\" mat-flat-button [class.spinner]=\"buttonDisable\"\r\n          [class.spinner-darker-success]=\"buttonDisable\" [class.spinner-center]=\"buttonDisable\"\r\n          (click)=\"!buttonDisable && onSubmit('submit')\" [disabled]=\"buttonDisable\"\r\n          [class.disabled]=\"buttonDisable\">{{(type == 'qnr-link') ? 'Submit' : 'Update'}}</button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</section>\r\n<div #lightGalleryContainer style=\"display: none;\"></div>\r\n<section class=\"cons-inbox no-padding-small\" *ngIf=\"showservice\">\r\n  <div class=\"container consumer-dashhome\" *ngIf=\"!type\">\r\n    <div class=\"card title-gb rounded-0\" *ngIf=\"uuid\">\r\n      <h5 class=\"mt-2 bold\">{{questionnaire_heading | capitalizeFirst}} <a class=\"pull-left me-4 back-btn\"\r\n          (click)=\"goBack()\"><i class=\"fa fa-arrow-left\"></i></a></h5>\r\n    </div>\r\n  </div>\r\n  <app-common-innerloading-spinner *ngIf=\"loading\"></app-common-innerloading-spinner>\r\n  <div class=\"d-flex flex-column-fluid pull-right me-2 mb-4\"\r\n    *ngIf=\"type !== 'qnrLinkProvider' && !buttonDisable && waitlistStatus\">\r\n    <button class=\"normal-btn edit\" mat-flat-button (click)=\"editQnr()\">Edit</button>\r\n  </div>\r\n  <div class=\"d-flex flex-column-fluid width-100\" [class.qnrDisableState]=\"disableInput()\"\r\n    [class.p-0]=\"uuid && (source === 'consCheckin' || source === 'consAppt' || source === 'consDonationDetails' )\">\r\n    <div class=\"col-xl-12 force_center p-0\" [class.p-0]=\"uuid\"\r\n      [class.no-padding-small]=\"source && source=='ivr'\">\r\n      <div class=\"\">\r\n        <div class=\"\" *ngFor=\"let qnr of groupedQnr | keyvalue\" [class.section-shadow]=\"getSectionCount() > 1\">\r\n          <div *ngIf=\"itemArray.length == 0 \">\r\n            <div class=\"form-group mgn-0 border-dashed text-center\" *ngFor=\"let question of qnr.value\">\r\n              <div class=\"qnr-section\" *ngIf=\"getSectionCount() > 1\">\r\n                {{getQuestion(question).question.sectionName}}</div>\r\n              <label class=\"col-12 quest pointer-cursor\"\r\n                (click)=\"showDataGridAddSectionn(getQuestion(question).question, true)\">\r\n                <div>\r\n                  <img src=\"{{cdnPath}}assets/images/service-options.svg\" alt=\"Service Options\" class=\"img-fluid pb-0\"\r\n                    width=\"300\" height=\"300\">\r\n                </div>\r\n                <div class=\"pro-only\" *ngIf=\"showProviderText(getQuestion(question).question)\">For Providers</div>\r\n                <span class=\"red\" *ngIf=\"getQuestion(question).question.mandatory\">*</span>\r\n                <div>\r\n                  <span class=\"text-primary font-weight-bold\">Please Choose your Pet</span>\r\n                </div>\r\n                <div class=\"mt-3\">\r\n                  <span class=\"btn btn-light font-weight-bold\">Continue</span>\r\n                </div>\r\n              </label>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <div class=\"col-md-12 col-12 col-sm-12 mb-4 p-0\" *ngIf=\"showItem\">\r\n          <div>\r\n            <div class=\"card-border\" *ngFor=\" let items of itemArray\">\r\n\r\n              <div class=\"d-flex justify-content-between\">\r\n                <div>\r\n                  <div class=\"text-capitalize\">\r\n                    <div class=\"\">\r\n                      <span class=\"text-primary\">\r\n                        {{items.item}}<br>\r\n                      </span>\r\n                    </div>\r\n                  </div>\r\n                </div>\r\n                <div class=\"d-flex border-apply px-0\">\r\n                  <div (click)=\"decrement(items);\" class=\"pointer-cursor quantity quantity-1\">\r\n                    <span class=\"p-10\">-</span>\r\n                  </div>\r\n                  <div class=\"mx-2 pointer-cursor\"><span class=\"quantity\"\r\n                      *ngIf=\"items && items.columnItem && items.columnItem[0] && items.columnItem[0].answer && items.columnItem[0].answer.dataGridList && items.columnItem[0].answer.dataGridList[0] && items.columnItem[0].answer.dataGridList[0].dataGridListColumn && items.columnItem[0].answer.dataGridList[0].dataGridListColumn[0] && items.columnItem[0].answer.dataGridList[0].dataGridListColumn[0].quantity\">\r\n                      {{items.columnItem[0].answer.dataGridList[0].dataGridListColumn[0].quantity}}</span>\r\n                  </div>\r\n                  <div (click)=\"increment(items);\" class=\"pointer-cursor quantity quantity-1\">\r\n                    <span class=\"p-10\">+</span>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n              <div>\r\n                <span class=\"text-primary\"><span><i class=\"fa fa-inr\"></i>\r\n                    {{items.price * getItemQuantity(items)}}/-\r\n                  </span>\r\n                </span>\r\n              </div>\r\n            </div>\r\n            <div class=\"clearfix\"></div>\r\n            <div *ngIf=\"showItem &&itemArray.length > 0\">\r\n              <div *ngFor=\"let qnr of groupedQnr | keyvalue\" [class.section-shadow]=\"getSectionCount() > 1\">\r\n                <div *ngFor=\"let question of qnr.value\">\r\n                  <label class=\"col-12 quest pointer-cursor\"\r\n                    (click)=\"showDataGridAddSectionn(getQuestion(question).question, true)\">\r\n                    <span class=\"btn btn-light font-weight-bold\"><i class=\"fa fa-plus text-white\"></i>Add</span>\r\n                  </label>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</section>", styles: [".dropzone{min-height:auto!important}.question-box{margin-top:10px}.btn-light{background-color:#1e4079!important;padding:5px 25px!important;color:#fff!important}.quest-outer{padding:10px}.error-msg{color:red}.upload-btn{background:#fff;border:1px solid;font-size:small}.card-border{box-shadow:0 0 5px 5px #f0f0f0!important;padding:10px 30px!important;margin:20px 10px!important;cursor:pointer!important;border-radius:10px!important}.border-apply{border:2px solid #1e4079!important;border-radius:20px!important}.quantity{font-size:20px!important;font-weight:700!important}.quantity-1:hover{background-color:#1e4079!important;color:#fff!important;font-weight:700!important;border-radius:50%!important;padding:-2px 12px!important}::ng-deep .mat-checkbox-layout{font-weight:400!important}.force_center{margin-left:auto;margin-right:auto}.input-group-text{display:-webkit-box;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:.65rem 1rem;margin-bottom:0;font-size:1rem;font-weight:400;line-height:1.5;color:#3f4254;text-align:center;white-space:nowrap;background-color:#f3f6f9!important;border:1px solid #E4E6EF!important;border-radius:.42rem;border-top-left-radius:0;border-bottom-left-radius:0;cursor:pointer}.w_100{width:100%}.img_fit{width:120px;height:120px}.dropzone .dropzone-default{border:1px dashed #EBEDF3!important}.select-box{padding:10px!important;border:1px solid #E4E6EF!important;border-radius:.42rem!important}.normal-btn{padding:5px 20px;border:none!important}.edit{padding:3px 25px;border-radius:20px!important}.mgn-0{margin-left:0!important;margin-right:0!important;margin-bottom:10px!important}.quest{font-size:1.1rem!important}.mt-3 a:hover{text-decoration:underline!important}.dzimage,.dz-image{border:1px dashed #ccc}.gal_action{position:absolute;top:20px;right:-10px;background:#00000080;width:20px;height:20px;text-align:center;border-radius:50%;cursor:pointer}.single-file{padding:0!important;text-align:initial!important;border:none!important}.single-file .dz-preview{position:relative!important;display:inline-block!important;vertical-align:top!important;margin:16px!important;min-height:100px!important}.single-file .gal_action{top:-5px!important}.pro-only{float:right;color:red;font-size:.8rem}.qnrDisableState .card,.qnrDisableState .dropzone-default,.qnrDisableState .dz-image-preview{background:#eeeeee9e!important}.qnr-section{font-weight:700;padding-bottom:10px;text-transform:uppercase}.section-shadow{margin:20px 10px;padding:20px!important;box-shadow:0 0 10px #0000001f!important}.gridSection .gridColumn{padding:15px}.gridSection .gridColumn label{padding:0 12.5px!important;font-weight:400!important;color:#3f4254!important;font-size:.9rem!important}.gridSection .act-btns .btn{padding:5px 10px!important;margin:5px!important}.gridSection .act-btns{padding:0 20px}.fa-plus-circle{font-size:1.5rem!important}.addicon{color:#1e4079!important;cursor:pointer}.fa-trash,.fa-pen{color:#000!important;font-size:1rem!important}.dz-preview input{width:121px!important;border:1px solid #ccc}.submit-pad{padding:0 10px 20px!important}.form-group.card{border:1px solid #dadce063!important;border-radius:8px!important;padding:5px!important}.docname{width:120px;margin-bottom:5px;text-overflow:ellipsis!important;overflow:hidden!important;white-space:nowrap!important}@media (max-width: 750px){.normal-btn{padding:3px 10px;border:none!important}.edit{padding:2px 12px;border-radius:10px!important}}.col-xl-12,.col-12,.col-sm-12,.col-md-12,.col-lg-12{position:relative;width:100%;padding-right:12.5px;padding-left:12.5px}@media (min-width: 1200px){.col-xl-12{flex:0 0 100%;max-width:100%}}.qnrsec{padding:10px}.p-10{padding:8px!important}.form-control1{display:block!important;width:100%!important;height:calc(1.5em + 1.3rem + 2px)!important;padding:.65rem 1rem!important;font-size:1rem!important;font-weight:400!important;line-height:1.5!important;color:#3f4254!important;background-color:#fff!important;background-clip:padding-box!important;border:1px solid #E4E6EF!important;border-radius:.42rem!important;box-shadow:none!important;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out!important}.form-control2{display:block!important;width:100%!important;padding:.65rem 1rem!important;font-size:1rem!important;font-weight:400!important;line-height:1.5!important;color:#3f4254!important;background-color:#fff!important;background-clip:padding-box!important;border:1px solid #E4E6EF!important;border-radius:.42rem!important;box-shadow:none!important;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out!important}.form-group label{font-size:1rem;font-weight:400;color:#3f4254}label{display:inline-block;margin-bottom:.5rem}.col-12{flex:0 0 100%;max-width:100%}.radio-list .radio span{margin-right:.75rem}.radio>span{background-color:#ebedf3;border:1px solid transparent}.radio>span{height:18px;width:18px}.radio>span{border-radius:50%;background-color:none;display:flex;align-items:center;justify-content:center;flex-shrink:0}.radio-list .radio{margin-bottom:1rem}.radio{display:flex;align-items:center;position:relative;text-align:left;cursor:pointer;font-size:1rem;transition:all .3s ease;margin:0}.radio>input{position:absolute;z-index:-1;opacity:0}.card{position:relative;display:flex;flex-direction:column;min-width:0;word-wrap:break-word;background-color:#fff;background-clip:border-box;border:1px solid #EBEDF3;border-radius:.42rem}.radio-list .radio:last-child{margin-bottom:0}@media (min-width: 992px){.col-lg-12{flex:0 0 100%;max-width:100%}}.dropzone.dropzone-default .dz-preview .dz-image{border-radius:.42rem}.btn.btn-icon i{padding:0;margin:0}.btn i{font-size:1.3rem;padding-right:.35rem;vertical-align:middle;line-height:1;display:inline-flex}.btn i{transition:color .15s ease,background-color .15s ease,border-color .15s ease,box-shadow .15s ease}.text-dark-50{color:#7e8299!important}.btn.btn-icon.btn-circle{border-radius:50%}.btn.btn-light-success{color:#1bc5bd;background-color:#c9f7f5;border-color:transparent}.btn.btn-icon{display:inline-flex;align-items:center;justify-content:center;padding:0;height:calc(1.5em + 1.3rem + 2px);width:calc(1.5em + 1.3rem + 2px)}.btn{display:inline-block;font-weight:400;color:#3f4254;text-align:center;vertical-align:middle;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;background-color:transparent;border:1px solid transparent;padding:.65rem 1rem;font-size:1rem;line-height:1.5;border-radius:.42rem;transition:color .3s ease-in-out,background-color .3s ease-in-out,border-color .3s ease-in-out,box-shadow .3s ease-in-out}.radio>input:checked~span{background-color:#1e4079}.radio>input:checked~span:after{background-color:#fff;border-color:#fff}.radio>input:checked~span:after{display:block}.radio>span:after{width:6px;height:6px}.radio>span:after{content:\"\";border-radius:100%!important}i{font-size:1.25rem;color:#b5b5c3}.dropzone{min-height:auto}.btn.btn-light-primary{background-color:#f9e2a7;border-color:transparent}.checkbox-lis .checkbox span{margin-right:.75rem}.checkbox>span{background-color:#ebedf3;border:1px solid transparent}.checkbox>span{height:18px;width:18px}.checkbox>span{background-color:none;display:flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:.42rem}.checkbox>span:after{width:5px;height:10px}.checkbox>span:after{content:\"\";border-color:transparent;border-style:solid;border-width:0 2px 2px 0!important;transform:rotate(45deg);margin-top:-2px}.checkbox-list{display:flex;flex-direction:column}.checkbox>input{position:absolute;z-index:-1;opacity:0}.checkbox>input:checked~span{background-color:#1e4079}.checkbox>input:checked~span:after{border-color:#fff}.checkbox{display:flex;align-items:center;position:relative;text-align:left;cursor:pointer;font-size:1rem;transition:all .3s ease;margin:0}.add-plus{color:#fff!important}.border-dashed{padding:10px!important}.add-plus-black{color:#000!important}.plus-black .fa .fa-plus{color:#000!important;font-size:12px!important}.checkbox-list .checkbox{margin-bottom:1rem}.checkbox-list .checkbox span{margin-right:.75rem}.checkbox-list .checkbox:last-child{margin-bottom:0}.btn.btn-primary{color:#fff;background-color:#1e4079;border-color:#1e4079}.font-weight-bold{font-weight:500!important}button{font-family:inherit}.form-control1:focus{color:#3f4254!important;background-color:#fff!important;border-color:#69b3ff!important;outline:0!important}.table.table-head-bg thead th:first-child{border-radius:.42rem}.table.table-head-bg thead tr,.table.table-head-bg thead th{background-color:#f3f6f9;border-bottom:0;letter-spacing:1px}.table.table-head-custom thead tr,.table.table-head-custom thead th{font-weight:600;color:#b5b5c3!important;font-size:.9rem;text-transform:uppercase}.table thead th{font-weight:600;font-size:1rem;border-bottom-width:1px;padding-top:1rem;padding-bottom:1rem}.table th,.table td{padding:.75rem}.table.table-head-bg thead tr:last-child,.table.table-head-bg thead th:last-child{border-top-right-radius:.42rem;border-bottom-right-radius:.42rem}.table-responsive1{display:block;width:100%;overflow-x:auto}.text-white{color:#fff!important;font-size:15px!important}.details{border:2px solid #1e4079!important;border-radius:10px!important;max-width:13%}.text-primary{color:#1e4079!important}.text-link{color:#1a6888}@media (min-width: 300px) and (max-width: 750px){.item{font-size:10px!important}.item_price{font-size:9px!important}.details{border:2px solid #1e4079!important;border-radius:10px!important;max-width:23%}}@media (max-width: 450px){.item{font-size:10px!important}.item_price{font-size:9px!important}}@media (min-width: 600px) and (max-width: 992px){.items{font-size:18px!important}.item_prices{font-size:16px!important}}@media (max-width: 450px){.incre{border:2px solid blue!important;border-radius:100px!important;max-width:20.66667%!important}}.font-weight-bold{font-weight:700!important}@media (max-width: 750px){.incre{max-width:20.66667%!important}}.incre{border:2px solid blue!important;border-radius:100px!important;max-width:10.66667%}@media (max-width: 893px){.disp-none-small{display:none!important}}@media (min-width: 800px){.disp-none-large{display:none!important}}.fa-inr{font-size:15px!important;color:#1e4079!important}.text-primary{font-weight:700!important}.flaticon-upload:before{content:\"\\f11d\"}[class*=\" flaticon-\"]:before{font-family:Flaticon;font-style:normal;font-weight:400;font-feature-settings:normal;font-variant:normal;line-height:1;text-decoration:inherit;text-rendering:optimizeLegibility;text-transform:none;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-smoothing:antialiased}.dropzone{position:relative!important;display:inline-block!important;vertical-align:top!important;min-height:100px!important}.dz-image{border-radius:20px;overflow:hidden;width:120px;height:120px;position:relative;display:block;z-index:10}.dz-image{border:1px dashed #ccc}.dropzone .dz-preview .dz-success-mark,.dropzone .dz-preview .dz-error-mark{pointer-events:none;z-index:500;position:absolute;display:block;top:50%;left:50%;margin-left:-27px;margin-top:-27px}\n"] }]
+            args: [{ selector: 'app-questionnaire', template: "<section class=\"cons-inbox no-padding-small\" *ngIf=\"!showservice\">\r\n  <div class=\"container consumer-dashhome p-0\" *ngIf=\"!type && source!='proLead'\">\r\n    <div class=\"card title-gb rounded-0\" *ngIf=\"uuid\">\r\n      <h5 class=\"mt-2 bold\">{{questionnaire_heading | capitalizeFirst}} <a class=\"pull-left me-4 back-btn\"\r\n          (click)=\"goBack()\"><i class=\"fa fa-arrow-left\"></i></a></h5>\r\n    </div>\r\n  </div>\r\n  <app-common-innerloading-spinner *ngIf=\"loading\"></app-common-innerloading-spinner>\r\n  <div class=\"d-flex flex-column-fluid pull-right me-2 mb-4\"\r\n    *ngIf=\"type !== 'qnrLinkProvider' && !buttonDisable && waitlistStatus\">\r\n    <button class=\"normal-btn edit\" mat-flat-button (click)=\"editQnr()\" id=\"btnEdit\">Edit</button>\r\n  </div>\r\n  <div class=\"d-flex flex-column-fluid width-100\" [class.qnrDisableState]=\"disableInput()\"\r\n    [class.p-0]=\"uuid && (source === 'consCheckin' || source === 'consAppt' || source === 'consOrder' || source === 'paper' || source === 'consDonationDetails' || source === 'ivr')\">\r\n    <div class=\"col-xl-12 force_center\" [class.p-0]=\"uuid\" [class.no-padding-small]=\"source && source=='ivr'\">\r\n      <div class=\"\">\r\n        <div class=\"qnrsec\" *ngFor=\"let qnr of groupedQnr | keyvalue: asIsOrder\"\r\n          [class.section-shadow]=\"getSectionCount() > 1\" [class.no-padding-small]=\"source && source=='ivr'\">\r\n          <div class=\"form-group card mgn-0\" *ngFor=\"let question of qnr.value\">\r\n            <label class=\"col-12 quest\">{{getQuestion(question).label}}\r\n              <i class=\"fa fa-plus-circle pull-right\" aria-hidden=\"true\"\r\n                [class.addicon]=\"!buttonDisable && !disableInput()\"\r\n                *ngIf=\"getQuestion(question).fieldDataType === 'dataGrid' && !showDataGrid[getQuestion(question).labelName]\"\r\n                (click)=\"!buttonDisable && !disableInput() && showDataGridAddSection(getQuestion(question), true)\"></i>\r\n              <div class=\"pro-only\" *ngIf=\"showProviderText(getQuestion(question))\">For Providers</div>\r\n              <span class=\"red\" *ngIf=\"getQuestion(question).mandatory\">*</span>\r\n              <div class=\"form-level-settings\" *ngIf=\"getQuestion(question).hint\"\r\n                [innerHTML]=\"getQuestion(question).hint | safeHtml\">\r\n              </div>\r\n            </label>\r\n            <!-- for file upload -->\r\n            <div class=\"col-12\" *ngIf=\"getQuestion(question).fieldDataType === 'fileUpload'\">\r\n              <mat-select multiple #deptsel [disabled]=\"buttonDisable || disableInput()\"\r\n                *ngIf=\"getQuestion(question).filePropertie.maxNoOfFile > 1 && getQuestion(question).filePropertie.minNoOfFile !== getQuestion(question).filePropertie.maxNoOfFile\"\r\n                [(ngModel)]=\"uploadFilesTemp[getQuestion(question).labelName]\" class=\"select-box\" placeholder=\"Select\">\r\n                <mat-option *ngFor=\"let document of getQuestion(question).filePropertie.allowedDocuments\"\r\n                  [value]=\"document\" (click)=\"changeImageSelected(getQuestion(question), document)\">\r\n                  {{document}}</mat-option>\r\n              </mat-select>\r\n              <div class=\"col-lg-12 col-12 col-md-12 col-sm-12 p-0 mt-4\"\r\n                *ngIf=\"getDocuments(getQuestion(question)) && getDocuments(getQuestion(question)).length > 0\">\r\n                <div class=\"dropzone dropzone-default dropzone-primary dz-clickable\"\r\n                  [class.single-file]=\"getQuestion(question).filePropertie.allowedDocuments.length==1\"\r\n                  style=\"cursor: auto;\">\r\n                  <ng-container *ngFor=\"let doc of getDocuments(getQuestion(question))\">\r\n                    <div class=\"dz-preview dz-processing dz-image-preview dz-error dz-complete\"\r\n                      *ngIf=\"getImg(getQuestion(question), doc)\">\r\n                      <div class=\"docname\" *ngIf=\"getQuestion(question).filePropertie.allowedDocuments.length > 1\">\r\n                        {{doc}}</div>\r\n                      <div class=\"dzimage pointer-cursor\" (click)=\"openAttachmentGallery(getQuestion(question), doc)\">\r\n                        <img alt=\"\" class=\"img_fit\" [src]=\"getImg(getQuestion(question), doc)\">\r\n                      </div>\r\n                      <input [disabled]=\"buttonDisable || disableInput()\" (blur)=\"onSubmit('inputChange');\"\r\n                        [(ngModel)]=\"comments[getQuestion(question).labelName + '=' + doc]\">\r\n                      <div class=\"gal_action\" *ngIf=\"!buttonDisable && !disableInput() && mode!=='read'\"\r\n                        (click)=\"changeImageSelected(getQuestion(question), doc)\">\r\n                        <i class=\"fa fa-times-circle\" aria-hidden=\"true\"></i>\r\n                      </div>\r\n                    </div>\r\n                    <div class=\"dz-preview dz-processing dz-image-preview dz-error dz-complete\"\r\n                      (click)=\"logofile1.click()\" *ngIf=\"!getImg(getQuestion(question), doc)\">\r\n                      <div class=\"docname\" *ngIf=\"getQuestion(question).filePropertie.allowedDocuments.length > 1\">\r\n                        {{doc}}</div>\r\n                      <div class=\"dz-image pointer-cursor\">\r\n                      </div>\r\n                      <input #logofile1 type=\"file\" accept=\"/*;capture=camera\" style=\"display:none;\"\r\n                        [disabled]=\"buttonDisable || disableInput()\"\r\n                        (change)=\"filesSelected($event, getQuestion(question), doc)\">\r\n                      <div class=\"dz-error-mark\">\r\n                        <a class=\"btn btn-icon btn-light-success btn-circle mr-2\"><i\r\n                            class=\"text-dark-50 flaticon-upload\"></i></a>\r\n                      </div>\r\n                    </div>\r\n                  </ng-container>\r\n                </div>\r\n              </div>\r\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\r\n                {{apiError[getQuestion(question).labelName]}}</div>\r\n            </div>\r\n            <!-- for checkbox -->\r\n            <div class=\"col-12\"\r\n              *ngIf=\"getQuestion(question).fieldDataType === 'list' && getQuestion(question).listPropertie.maxAnswers > 1\">\r\n              <div class=\"checkbox-list\">\r\n                <label class=\"checkbox\" *ngFor=\"let value of getQuestion(question).labelValues\">\r\n                  <input type=\"checkbox\" [checked]=\"isChecked(value, getQuestion(question))\"\r\n                    (change)=\"listChange($event, value, getQuestion(question))\"\r\n                    [disabled]=\"buttonDisable || disableInput()\">\r\n                  <span></span>\r\n                  {{value}}\r\n                </label>\r\n              </div>\r\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\r\n                {{apiError[getQuestion(question).labelName]}}</div>\r\n            </div>\r\n            <!-- for radio -->\r\n            <div class=\"col-12\"\r\n              *ngIf=\"getQuestion(question).fieldDataType === 'list' && getQuestion(question).listPropertie.maxAnswers === 1\">\r\n              <div class=\"radio-list\">\r\n                <label class=\"radio\" *ngFor=\"let value of getQuestion(question).labelValues\">\r\n                  <input type=\"radio\" [disabled]=\"buttonDisable || disableInput()\"\r\n                    [checked]=\"isChecked(value, getQuestion(question))\"\r\n                    (change)=\"listChange($event, value, getQuestion(question))\">\r\n                  <span></span>\r\n                  {{value}}\r\n                </label>\r\n              </div>\r\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\r\n                {{apiError[getQuestion(question).labelName]}}</div>\r\n            </div>\r\n            <!-- for toggel boolean -->\r\n            <div class=\"col-12\" *ngIf=\"getQuestion(question).fieldDataType === 'bool'\">\r\n              <div class=\"radio-list\">\r\n                <label class=\"radio\" *ngFor=\"let value of getQuestion(question).labelValues\">\r\n                  <input type=\"radio\" [disabled]=\"buttonDisable || disableInput()\"\r\n                    [checked]=\"isBooleanChecked(value, getQuestion(question))\"\r\n                    (change)=\"booleanChange($event, value, getQuestion(question))\">\r\n                  <span></span>\r\n                  {{value}}\r\n                </label>\r\n              </div>\r\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\r\n                {{apiError[getQuestion(question).labelName]}}</div>\r\n            </div>\r\n            <!-- for Text -->\r\n            <div class=\"col-12\" *ngIf=\"getQuestion(question).fieldDataType === 'plainText'\">\r\n              <input *ngIf=\"getQuestion(question).plainTextPropertie.maxNoOfLetter<=100\"\r\n                  [(ngModel)]=\"answers[getQuestion(question).labelName]\" (input)=\"onSubmit('inputChange');\"                  \r\n                  [minlength]=\"getQuestion(question).plainTextPropertie.minNoOfLetter\"\r\n                  [maxlength]=\"getQuestion(question).plainTextPropertie.maxNoOfLetter\"\r\n                  class=\"form-control1 form-control-solid\" type=\"text\" [disabled]=\"buttonDisable || disableInput()\">\r\n                <textarea rows=\"3\" *ngIf=\"getQuestion(question).plainTextPropertie.maxNoOfLetter>100\"\r\n                  [(ngModel)]=\"answers[getQuestion(question).labelName]\" (input)=\"onSubmit('inputChange');\"\r\n                  [minlength]=\"getQuestion(question).plainTextPropertie.minNoOfLetter\"\r\n                  [maxlength]=\"getQuestion(question).plainTextPropertie.maxNoOfLetter\" [disabled]=\"buttonDisable || disableInput()\"\r\n                  class=\"form-control2 form-control-solid\"></textarea>\r\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\r\n                {{apiError[getQuestion(question).labelName]}}</div>\r\n            </div>\r\n            <!-- for Number -->\r\n            <div class=\"col-12\" *ngIf=\"getQuestion(question).fieldDataType === 'number'\">\r\n              <input [(ngModel)]=\"answers[getQuestion(question).labelName]\" (input)=\"onSubmit('inputChange');\"\r\n                [min]=\"getQuestion(question).numberPropertie.start\" [max]=\"getQuestion(question).numberPropertie.end\"\r\n                [disabled]=\"buttonDisable || disableInput()\" class=\"form-control1 form-control-solid\" type=\"number\"\r\n                (keypress)=\"isNumeric($event)\">\r\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\r\n                {{apiError[getQuestion(question).labelName]}}</div>\r\n            </div>\r\n            <!-- for Date -->\r\n            <div class=\"col-12 disp-flex\" *ngIf=\"getQuestion(question).fieldDataType === 'date'\">\r\n              <input class=\"form-control1\" [matDatepicker]=\"picker\" [max]=\"getMaxdate(question)\"\r\n                [min]=\"getMindate(question)\" [(ngModel)]=\"answers[getQuestion(question).labelName]\"\r\n                (dateChange)=\"onSubmit('inputChange')\" [disabled]=\"buttonDisable || disableInput()\"\r\n                (click)=\"picker.open()\">\r\n              <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\r\n              <mat-datepicker #picker [disabled]=\"buttonDisable || disableInput()\"></mat-datepicker>\r\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\r\n                {{apiError[getQuestion(question).labelName]}}</div>\r\n            </div>\r\n            <!-- for Datagrid -->\r\n            <div class=\"table-responsive1\"\r\n              *ngIf=\"getQuestion(question).fieldDataType === 'dataGrid' && dataGridColumnsAnswerList[getQuestion(question).labelName] && dataGridColumnsAnswerList[getQuestion(question).labelName].length > 0\">\r\n              <table class=\"table table-head-custom table-head-bg table-borderless table-vertical-center\">\r\n                <thead>\r\n                  <th *ngFor=\"let column of getQuestion(question).dataGridProperties.dataGridColumns\">\r\n                    {{column.columnId}}</th>\r\n                  <th *ngIf=\"!buttonDisable && !disableInput() && !showDataGrid[getQuestion(question).labelName]\">\r\n                  </th>\r\n                  <th *ngIf=\"!buttonDisable && !disableInput() && !showDataGrid[getQuestion(question).labelName]\">\r\n                  </th>\r\n                </thead>\r\n                <tbody>\r\n                  <tr *ngFor=\"let column of dataGridColumnsAnswerList[getQuestion(question).labelName];let i =index\">\r\n                    <td *ngFor=\"let data of column | keyvalue\">\r\n                      <div\r\n                        *ngIf=\"getColumnType(getQuestion(question).dataGridProperties.dataGridColumns, data.key) === 'date'\">\r\n                        {{data.value | date : newTimeDateFormat}}\r\n                      </div>\r\n                      <div\r\n                        *ngIf=\"getColumnType(getQuestion(question).dataGridProperties.dataGridColumns, data.key) === 'bool'\">\r\n                        {{getBoolValue(data.value)}}\r\n                      </div>\r\n                      <div\r\n                        *ngIf=\"getColumnType(getQuestion(question).dataGridProperties.dataGridColumns, data.key) !== 'date' && getColumnType(getQuestion(question).dataGridProperties.dataGridColumns, data.key) !== 'bool'\">\r\n                        {{data.value}}\r\n                      </div>\r\n                    </td>\r\n                    <td *ngIf=\"!buttonDisable && !disableInput() && !showDataGrid[getQuestion(question).labelName]\">\r\n                      <i class=\"fa fa-pen\" (click)=\"editDataGrid(getQuestion(question), column)\"></i>\r\n                    </td>\r\n                    <td *ngIf=\"!buttonDisable && !disableInput() && !showDataGrid[getQuestion(question).labelName]\">\r\n                      <i class=\"fa fa-trash\" (click)=\"deleteDataGrid(getQuestion(question), column)\"></i>\r\n                    </td>\r\n                  </tr>\r\n                </tbody>\r\n              </table>\r\n            </div>\r\n            <div class=\"gridSection\" *ngIf=\"showDataGrid[getQuestion(question).labelName]\">\r\n              <div class=\"gridColumn\" *ngFor=\"let column of getQuestion(question).dataGridProperties.dataGridColumns\">\r\n                <label>{{column.label}}\r\n                  <span class=\"red\" *ngIf=\"column.mandatory\">*</span>\r\n                </label>\r\n                <!-- for checkbox -->\r\n                <div class=\"col-12\" *ngIf=\"column.dataType === 'list'\">\r\n                  <div class=\"checkbox-list\">\r\n                    <label class=\"checkbox\" *ngFor=\"let value of column.listPropertie.values\">\r\n                      <input type=\"checkbox\" [checked]=\"isChecked(value, getQuestion(question), column)\"\r\n                        (change)=\"listChange($event, value, getQuestion(question), column)\"\r\n                        [disabled]=\"buttonDisable || disableInput()\">\r\n                      <span></span>\r\n                      {{value}}\r\n                    </label>\r\n                  </div>\r\n                </div>\r\n                <!-- for toggel boolean -->\r\n                <div class=\"col-12\" *ngIf=\"column.dataType === 'bool'\">\r\n                  <div class=\"radio-list\">\r\n                    <label class=\"radio\">\r\n                      <input type=\"radio\" [disabled]=\"buttonDisable || disableInput()\"\r\n                        [checked]=\"isBooleanChecked('yes', getQuestion(question), column)\"\r\n                        (change)=\"booleanChange($event, 'yes', getQuestion(question), column)\">\r\n                      <span></span>\r\n                      Yes\r\n                    </label>\r\n                    <label class=\"radio\">\r\n                      <input type=\"radio\" [disabled]=\"buttonDisable || disableInput()\"\r\n                        [checked]=\"isBooleanChecked('no', getQuestion(question), column)\"\r\n                        (change)=\"booleanChange($event, 'no', getQuestion(question), column)\">\r\n                      <span></span>\r\n                      No\r\n                    </label>\r\n                  </div>\r\n                </div>\r\n                <!-- for Text -->\r\n                <div class=\"col-12\" *ngIf=\"column.dataType === 'plainText'\">\r\n                  <input [(ngModel)]=\"dataGridColumns[getQuestion(question).labelName + '=' + column.order]\"\r\n                    [disabled]=\"buttonDisable || disableInput()\" class=\"form-control1 form-control-solid\" type=\"text\">\r\n                </div>\r\n                <!-- for Number -->\r\n                <div class=\"col-12\" *ngIf=\"column.dataType === 'number'\">\r\n                  <input [(ngModel)]=\"dataGridColumns[getQuestion(question).labelName + '=' + column.order]\"\r\n                    [disabled]=\"buttonDisable || disableInput()\" [min]=\"column.numberPropertie.start\"\r\n                    [max]=\"column.numberPropertie.end\" class=\"form-control1 form-control-solid\" type=\"number\">\r\n                </div>\r\n                <!-- for Date -->\r\n                <div class=\"col-12 disp-flex\" *ngIf=\"column.dataType === 'date'\">\r\n                  <input class=\"form-control1\" [matDatepicker]=\"picker\" [max]=\"getMaxdate(question)\"\r\n                    [min]=\"getMindate(question)\"\r\n                    [(ngModel)]=\"dataGridColumns[getQuestion(question).labelName + '=' + column.order]\"\r\n                    [disabled]=\"buttonDisable || disableInput()\" (click)=\"picker.open()\">\r\n                  <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\r\n                  <mat-datepicker #picker [disabled]=\"buttonDisable || disableInput()\">\r\n                  </mat-datepicker>\r\n                </div>\r\n              </div>\r\n              <div class=\"act-btns\">\r\n                <button type=\"button\" class=\"btn btn-light-primary font-weight-bold\" id=\"btnCancelQ\"\r\n                  (click)=\"cancelAddorUpdate(getQuestion(question))\">\r\n                  Cancel\r\n                </button>\r\n                <button type=\"button\" class=\"btn btn-primary font-weight-bold\" id=\"btnSaveQ\"\r\n                  (click)=\"saveDataGridColumn(getQuestion(question))\">Add</button>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n      <div class=\"col-md-12 col-12 col-sm-12 col-lg-12 p-0 submit-pad\"\r\n        *ngIf=\"type !== 'qnrLinkProvider' && source!=='proLead' && (uuid || source === 'customer-details' || source === 'proDonation') && !disableInput()\">\r\n        <button class=\"normal-btn\" mat-flat-button [class.spinner]=\"buttonDisable\" id=\"btnSubmit\"\r\n          [class.spinner-darker-success]=\"buttonDisable\" [class.spinner-center]=\"buttonDisable\"\r\n          (click)=\"!buttonDisable && onSubmit('submit')\" [disabled]=\"buttonDisable\"\r\n          [class.disabled]=\"buttonDisable\">{{(type == 'qnr-link') ? 'Submit' : 'Update'}}</button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</section>\r\n<div #lightGalleryContainer style=\"display: none;\"></div>\r\n<section class=\"cons-inbox no-padding-small\" *ngIf=\"showservice\">\r\n  <div class=\"container consumer-dashhome\" *ngIf=\"!type\">\r\n    <div class=\"card title-gb rounded-0\" *ngIf=\"uuid\">\r\n      <h5 class=\"mt-2 bold\">{{questionnaire_heading | capitalizeFirst}} <a class=\"pull-left me-4 back-btn\"\r\n          (click)=\"goBack()\"><i class=\"fa fa-arrow-left\"></i></a></h5>\r\n    </div>\r\n  </div>\r\n  <app-common-innerloading-spinner *ngIf=\"loading\"></app-common-innerloading-spinner>\r\n  <div class=\"d-flex flex-column-fluid pull-right me-2 mb-4\"\r\n    *ngIf=\"type !== 'qnrLinkProvider' && !buttonDisable && waitlistStatus\">\r\n    <button class=\"normal-btn edit\" mat-flat-button (click)=\"editQnr()\" id=\"btnEditQNR\">Edit</button>\r\n  </div>\r\n  <div class=\"d-flex flex-column-fluid width-100\" [class.qnrDisableState]=\"disableInput()\"\r\n    [class.p-0]=\"uuid && (source === 'consCheckin' || source === 'consAppt' || source === 'consDonationDetails' )\">\r\n    <div class=\"col-xl-12 force_center p-0\" [class.p-0]=\"uuid\"\r\n      [class.no-padding-small]=\"source && source=='ivr'\">\r\n      <div class=\"\">\r\n        <div class=\"\" *ngFor=\"let qnr of groupedQnr | keyvalue\" [class.section-shadow]=\"getSectionCount() > 1\">\r\n          <div *ngIf=\"itemArray.length == 0 \">\r\n            <div class=\"form-group mgn-0 border-dashed text-center\" *ngFor=\"let question of qnr.value\">\r\n              <div class=\"qnr-section\" *ngIf=\"getSectionCount() > 1\">\r\n                {{getQuestion(question).question.sectionName}}</div>\r\n              <label class=\"col-12 quest pointer-cursor\"\r\n                (click)=\"showDataGridAddSectionn(getQuestion(question).question, true)\">\r\n                <div>\r\n                  <img src=\"{{cdnPath}}assets/images/service-options.svg\" alt=\"Service Options\" class=\"img-fluid pb-0\"\r\n                    width=\"300\" height=\"300\">\r\n                </div>\r\n                <div class=\"pro-only\" *ngIf=\"showProviderText(getQuestion(question).question)\">For Providers</div>\r\n                <span class=\"red\" *ngIf=\"getQuestion(question).question.mandatory\">*</span>\r\n                <div>\r\n                  <span class=\"text-primary font-weight-bold\">Please Choose your Pet</span>\r\n                </div>\r\n                <div class=\"mt-3\">\r\n                  <span class=\"btn btn-light font-weight-bold\">Continue</span>\r\n                </div>\r\n              </label>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <div class=\"col-md-12 col-12 col-sm-12 mb-4 p-0\" *ngIf=\"showItem\">\r\n          <div>\r\n            <div class=\"card-border\" *ngFor=\" let items of itemArray\">\r\n\r\n              <div class=\"d-flex justify-content-between\">\r\n                <div>\r\n                  <div class=\"text-capitalize\">\r\n                    <div class=\"\">\r\n                      <span class=\"text-primary\">\r\n                        {{items.item}}<br>\r\n                      </span>\r\n                    </div>\r\n                  </div>\r\n                </div>\r\n                <div class=\"d-flex border-apply px-0\">\r\n                  <div (click)=\"decrement(items);\" class=\"pointer-cursor quantity quantity-1\">\r\n                    <span class=\"p-10\">-</span>\r\n                  </div>\r\n                  <div class=\"mx-2 pointer-cursor\"><span class=\"quantity\"\r\n                      *ngIf=\"items && items.columnItem && items.columnItem[0] && items.columnItem[0].answer && items.columnItem[0].answer.dataGridList && items.columnItem[0].answer.dataGridList[0] && items.columnItem[0].answer.dataGridList[0].dataGridListColumn && items.columnItem[0].answer.dataGridList[0].dataGridListColumn[0] && items.columnItem[0].answer.dataGridList[0].dataGridListColumn[0].quantity\">\r\n                      {{items.columnItem[0].answer.dataGridList[0].dataGridListColumn[0].quantity}}</span>\r\n                  </div>\r\n                  <div (click)=\"increment(items);\" class=\"pointer-cursor quantity quantity-1\">\r\n                    <span class=\"p-10\">+</span>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n              <div>\r\n                <span class=\"text-primary\"><span><i class=\"fa fa-inr\"></i>\r\n                    {{items.price * getItemQuantity(items)}}/-\r\n                  </span>\r\n                </span>\r\n              </div>\r\n            </div>\r\n            <div class=\"clearfix\"></div>\r\n            <div *ngIf=\"showItem &&itemArray.length > 0\">\r\n              <div *ngFor=\"let qnr of groupedQnr | keyvalue\" [class.section-shadow]=\"getSectionCount() > 1\">\r\n                <div *ngFor=\"let question of qnr.value\">\r\n                  <label class=\"col-12 quest pointer-cursor\"\r\n                    (click)=\"showDataGridAddSectionn(getQuestion(question).question, true)\">\r\n                    <span class=\"btn btn-light font-weight-bold\"><i class=\"fa fa-plus text-white\"></i>Add</span>\r\n                  </label>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</section>", styles: [".dropzone{min-height:auto!important}.question-box{margin-top:10px}.btn-light{background-color:#1e4079!important;padding:5px 25px!important;color:#fff!important}.quest-outer{padding:10px}.error-msg{color:red}.upload-btn{background:#fff;border:1px solid;font-size:small}.card-border{box-shadow:0 0 5px 5px #f0f0f0!important;padding:10px 30px!important;margin:20px 10px!important;cursor:pointer!important;border-radius:10px!important}.border-apply{border:2px solid #1e4079!important;border-radius:20px!important}.quantity{font-size:20px!important;font-weight:700!important}.quantity-1:hover{background-color:#1e4079!important;color:#fff!important;font-weight:700!important;border-radius:50%!important;padding:-2px 12px!important}::ng-deep .mat-checkbox-layout{font-weight:400!important}.force_center{margin-left:auto;margin-right:auto}.input-group-text{display:-webkit-box;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:.65rem 1rem;margin-bottom:0;font-size:1rem;font-weight:400;line-height:1.5;color:#3f4254;text-align:center;white-space:nowrap;background-color:#f3f6f9!important;border:1px solid #E4E6EF!important;border-radius:.42rem;border-top-left-radius:0;border-bottom-left-radius:0;cursor:pointer}.w_100{width:100%}.img_fit{width:120px;height:120px}.dropzone .dropzone-default{border:1px dashed #EBEDF3!important}.select-box{padding:10px!important;border:1px solid #E4E6EF!important;border-radius:.42rem!important}.normal-btn{padding:5px 20px;border:none!important}.edit{padding:3px 25px;border-radius:20px!important}.mgn-0{margin-left:0!important;margin-right:0!important;margin-bottom:10px!important}.quest{font-size:1.1rem!important}.mt-3 a:hover{text-decoration:underline!important}.dzimage,.dz-image{border:1px dashed #ccc}.gal_action{position:absolute;top:20px;right:-10px;background:#00000080;width:20px;height:20px;text-align:center;border-radius:50%;cursor:pointer}.single-file{padding:0!important;text-align:initial!important;border:none!important}.single-file .dz-preview{position:relative!important;display:inline-block!important;vertical-align:top!important;margin:16px!important;min-height:100px!important}.single-file .gal_action{top:-5px!important}.pro-only{float:right;color:red;font-size:.8rem}.qnrDisableState .card,.qnrDisableState .dropzone-default,.qnrDisableState .dz-image-preview{background:#eeeeee9e!important}.qnr-section{font-weight:700;padding-bottom:10px;text-transform:uppercase}.section-shadow{margin:20px 10px;padding:20px!important;box-shadow:0 0 10px #0000001f!important}.gridSection .gridColumn{padding:15px}.gridSection .gridColumn label{padding:0 12.5px!important;font-weight:400!important;color:#3f4254!important;font-size:.9rem!important}.gridSection .act-btns .btn{padding:5px 10px!important;margin:5px!important}.gridSection .act-btns{padding:0 20px}.fa-plus-circle{font-size:1.5rem!important}.addicon{color:#1e4079!important;cursor:pointer}.fa-trash,.fa-pen{color:#000!important;font-size:1rem!important}.dz-preview input{width:121px!important;border:1px solid #ccc}.submit-pad{padding:0 10px 20px!important}.form-group.card{border:1px solid #dadce063!important;border-radius:8px!important;padding:5px!important}.docname{width:120px;margin-bottom:5px;text-overflow:ellipsis!important;overflow:hidden!important;white-space:nowrap!important}@media (max-width: 750px){.normal-btn{padding:3px 10px;border:none!important}.edit{padding:2px 12px;border-radius:10px!important}}.col-xl-12,.col-12,.col-sm-12,.col-md-12,.col-lg-12{position:relative;width:100%;padding-right:12.5px;padding-left:12.5px}@media (min-width: 1200px){.col-xl-12{flex:0 0 100%;max-width:100%}}.qnrsec{padding:10px}.p-10{padding:8px!important}.form-control1{display:block!important;width:100%!important;height:calc(1.5em + 1.3rem + 2px)!important;padding:.65rem 1rem!important;font-size:1rem!important;font-weight:400!important;line-height:1.5!important;color:#3f4254!important;background-color:#fff!important;background-clip:padding-box!important;border:1px solid #E4E6EF!important;border-radius:.42rem!important;box-shadow:none!important;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out!important}.form-control2{display:block!important;width:100%!important;padding:.65rem 1rem!important;font-size:1rem!important;font-weight:400!important;line-height:1.5!important;color:#3f4254!important;background-color:#fff!important;background-clip:padding-box!important;border:1px solid #E4E6EF!important;border-radius:.42rem!important;box-shadow:none!important;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out!important}.form-group label{font-size:1rem;font-weight:400;color:#3f4254}label{display:inline-block;margin-bottom:.5rem}.col-12{flex:0 0 100%;max-width:100%}.radio-list .radio span{margin-right:.75rem}.radio>span{background-color:#ebedf3;border:1px solid transparent}.radio>span{height:18px;width:18px}.radio>span{border-radius:50%;background-color:none;display:flex;align-items:center;justify-content:center;flex-shrink:0}.radio-list .radio{margin-bottom:1rem}.radio{display:flex;align-items:center;position:relative;text-align:left;cursor:pointer;font-size:1rem;transition:all .3s ease;margin:0}.radio>input{position:absolute;z-index:-1;opacity:0}.card{position:relative;display:flex;flex-direction:column;min-width:0;word-wrap:break-word;background-color:#fff;background-clip:border-box;border:1px solid #EBEDF3;border-radius:.42rem}.radio-list .radio:last-child{margin-bottom:0}@media (min-width: 992px){.col-lg-12{flex:0 0 100%;max-width:100%}}.dropzone.dropzone-default .dz-preview .dz-image{border-radius:.42rem}.btn.btn-icon i{padding:0;margin:0}.btn i{font-size:1.3rem;padding-right:.35rem;vertical-align:middle;line-height:1;display:inline-flex}.btn i{transition:color .15s ease,background-color .15s ease,border-color .15s ease,box-shadow .15s ease}.text-dark-50{color:#7e8299!important}.btn.btn-icon.btn-circle{border-radius:50%}.btn.btn-light-success{color:#1bc5bd;background-color:#c9f7f5;border-color:transparent}.btn.btn-icon{display:inline-flex;align-items:center;justify-content:center;padding:0;height:calc(1.5em + 1.3rem + 2px);width:calc(1.5em + 1.3rem + 2px)}.btn{display:inline-block;font-weight:400;color:#3f4254;text-align:center;vertical-align:middle;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;background-color:transparent;border:1px solid transparent;padding:.65rem 1rem;font-size:1rem;line-height:1.5;border-radius:.42rem;transition:color .3s ease-in-out,background-color .3s ease-in-out,border-color .3s ease-in-out,box-shadow .3s ease-in-out}.radio>input:checked~span{background-color:#1e4079}.radio>input:checked~span:after{background-color:#fff;border-color:#fff}.radio>input:checked~span:after{display:block}.radio>span:after{width:6px;height:6px}.radio>span:after{content:\"\";border-radius:100%!important}i{font-size:1.25rem;color:#b5b5c3}.dropzone{min-height:auto}.btn.btn-light-primary{background-color:#f9e2a7;border-color:transparent}.checkbox-lis .checkbox span{margin-right:.75rem}.checkbox>span{background-color:#ebedf3;border:1px solid transparent}.checkbox>span{height:18px;width:18px}.checkbox>span{background-color:none;display:flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:.42rem}.checkbox>span:after{width:5px;height:10px}.checkbox>span:after{content:\"\";border-color:transparent;border-style:solid;border-width:0 2px 2px 0!important;transform:rotate(45deg);margin-top:-2px}.checkbox-list{display:flex;flex-direction:column}.checkbox>input{position:absolute;z-index:-1;opacity:0}.checkbox>input:checked~span{background-color:#1e4079}.checkbox>input:checked~span:after{border-color:#fff}.checkbox{display:flex;align-items:center;position:relative;text-align:left;cursor:pointer;font-size:1rem;transition:all .3s ease;margin:0}.add-plus{color:#fff!important}.border-dashed{padding:10px!important}.add-plus-black{color:#000!important}.plus-black .fa .fa-plus{color:#000!important;font-size:12px!important}.checkbox-list .checkbox{margin-bottom:1rem}.checkbox-list .checkbox span{margin-right:.75rem}.checkbox-list .checkbox:last-child{margin-bottom:0}.btn.btn-primary{color:#fff;background-color:#1e4079;border-color:#1e4079}.font-weight-bold{font-weight:500!important}button{font-family:inherit}.form-control1:focus{color:#3f4254!important;background-color:#fff!important;border-color:#69b3ff!important;outline:0!important}.table.table-head-bg thead th:first-child{border-radius:.42rem}.table.table-head-bg thead tr,.table.table-head-bg thead th{background-color:#f3f6f9;border-bottom:0;letter-spacing:1px}.table.table-head-custom thead tr,.table.table-head-custom thead th{font-weight:600;color:#b5b5c3!important;font-size:.9rem;text-transform:uppercase}.table thead th{font-weight:600;font-size:1rem;border-bottom-width:1px;padding-top:1rem;padding-bottom:1rem}.table th,.table td{padding:.75rem}.table.table-head-bg thead tr:last-child,.table.table-head-bg thead th:last-child{border-top-right-radius:.42rem;border-bottom-right-radius:.42rem}.table-responsive1{display:block;width:100%;overflow-x:auto}.text-white{color:#fff!important;font-size:15px!important}.details{border:2px solid #1e4079!important;border-radius:10px!important;max-width:13%}.text-primary{color:#1e4079!important}.text-link{color:#1a6888}@media (min-width: 300px) and (max-width: 750px){.item{font-size:10px!important}.item_price{font-size:9px!important}.details{border:2px solid #1e4079!important;border-radius:10px!important;max-width:23%}}@media (max-width: 450px){.item{font-size:10px!important}.item_price{font-size:9px!important}}@media (min-width: 600px) and (max-width: 992px){.items{font-size:18px!important}.item_prices{font-size:16px!important}}@media (max-width: 450px){.incre{border:2px solid blue!important;border-radius:100px!important;max-width:20.66667%!important}}.font-weight-bold{font-weight:700!important}@media (max-width: 750px){.incre{max-width:20.66667%!important}}.incre{border:2px solid blue!important;border-radius:100px!important;max-width:10.66667%}@media (max-width: 893px){.disp-none-small{display:none!important}}@media (min-width: 800px){.disp-none-large{display:none!important}}.fa-inr{font-size:15px!important;color:#1e4079!important}.text-primary{font-weight:700!important}.flaticon-upload:before{content:\"\\f11d\"}[class*=\" flaticon-\"]:before{font-family:Flaticon;font-style:normal;font-weight:400;font-feature-settings:normal;font-variant:normal;line-height:1;text-decoration:inherit;text-rendering:optimizeLegibility;text-transform:none;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-smoothing:antialiased}.dropzone{position:relative!important;display:inline-block!important;vertical-align:top!important;min-height:100px!important}.dz-image{border-radius:20px;overflow:hidden;width:120px;height:120px;position:relative;display:block;z-index:10}.dz-image{border:1px dashed #ccc}.dropzone .dz-preview .dz-success-mark,.dropzone .dz-preview .dz-error-mark{pointer-events:none;z-index:500;position:absolute;display:block;top:50%;left:50%;margin-left:-27px;margin-top:-27px}\n"] }]
         }], ctorParameters: () => [{ type: i1$6.ActivatedRoute }, { type: WordProcessor }, { type: LocalStorageService }, { type: DateTimeProcessor }, { type: i1$4.MatDialog }, { type: FileService }, { type: CommonService }, { type: QuestionaireService }, { type: ErrorMessagingService }, { type: ToastService }, { type: SharedService }, { type: i12.Location }], propDecorators: { questionnaireList: [{
                 type: Input
             }], source: [{
@@ -7325,5 +7346,5 @@ function setupInjectionContextForLoadChildren(route) {
  * Generated bundle index. Do not edit.
  */
 
-export { AccountService, AuthService, AutolinkPipe, AutolinkPipeModule, BookingService, CapitalizeFirstPipe, CapitalizeFirstPipeModule, CommonService, ConfirmBoxComponent, ConfirmBoxModule, ConsumerService, CurrencyService, DateFormatPipe, DateFormatPipeModule, DateTimeProcessor, EnvironmentService, ErrorMessagingService, ErrrorMessageModule, FieldErrorDisplayComponent, FileService, FilterPipe, FormMessageDisplayModule, FormMessageDisplayService, FormSuccessDisplayComponent, GroupStorageService, HttpLoaderFactory, I8nModule, LoadingSpinnerComponent, LoadingSpinnerModule, LocalStorageService, MediaService, Messages, OrderService, PaymentModesComponent, PaymentModesModule, PaymentsModule, PaytmService, PhoneInputComponent, PhoneInputModule, QuestionaireService, QuestionnaireComponent, QuestionnaireModule, RazorpayService, RequestDialogComponent, RequestDialogModule, SafeHtmlPipe, ServiceMeta, SessionStorageService, SharedAccountGuard, SharedAccountResolver, SharedService, ShowuploadfileComponent, ShowuploadfileModule, SkeletonLoadingComponent, SkeletonLoadingModule, StorageService, SubscriptionService, ThemeService, TimezoneConverter, ToastService, TruncatePipe, TwilioService, WordProcessor, projectConstantsLocal, setupInjectionContextForLoadChildren };
+export { AccountService, AuthService, AutolinkPipe, AutolinkPipeModule, BookingService, CapitalizeFirstPipe, CapitalizeFirstPipeModule, CommonService, ConfirmBoxComponent, ConfirmBoxModule, ConsumerService, CurrencyService, DateFormatPipe, DateFormatPipeModule, DateTimeProcessor, EnvironmentService, ErrorMessagingService, ErrrorMessageModule, FieldErrorDisplayComponent, FileService, FilterPipe, FormMessageDisplayModule, FormMessageDisplayService, FormSuccessDisplayComponent, GroupStorageService, HttpLoaderFactory, I8nModule, LoadingSpinnerComponent, LoadingSpinnerModule, LocalStorageService, MediaService, Messages, OrderService, PaymentModesComponent, PaymentModesModule, PaymentsModule, PaytmService, PhoneInputComponent, PhoneInputModule, QuestionaireService, QuestionnaireComponent, QuestionnaireModule, RazorpayService, RequestDialogComponent, RequestDialogModule, SafeHtmlPipe, ServiceMeta, SessionStorageService, SharedAccountGuard, SharedAccountResolver, SharedService, ShowuploadfileComponent, ShowuploadfileModule, SkeletonLoadingComponent, SkeletonLoadingModule, StorageService, SubscriptionService, ThemeService, TimezoneConverter, ToastService, TruncatePipe, TwilioService, WordProcessor, loadRemoteModuleWithCache, projectConstantsLocal, setupInjectionContextForLoadChildren };
 //# sourceMappingURL=jconsumer-shared.mjs.map