npm - jconsumer-shared - Versions diffs - 1.2.0 → 1.2.2 - Mend

jconsumer-shared 1.2.0 → 1.2.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (84) hide show

package/fesm2022/jconsumer-shared.mjs CHANGED Viewed

@@ -1692,30 +1692,6 @@ class ConsumerService {
         const url = 'consumer/providers/' + accountid;
         return this.servicemeta.httpDelete(url);
     }
-    doDeleteFavProvider(fav, cthis) {
-        return new Promise((resolve, reject) => {
-            this.deleteFavProvider(fav.id)
-                .then(data => {
-                resolve(data);
-            }, error => {
-                reject(error);
-            });
-        });
-    }
-    deleteFavProvider(id) {
-        return new Promise((resolve, reject) => {
-            this.removeProviderfromFavourite(id)
-                .subscribe(data => {
-                resolve('reloadlist');
-            }, error => {
-                reject(error);
-            });
-        });
-    }
-    addProvidertoFavourite(accountid) {
-        const url = 'consumer/providers/' + accountid;
-        return this.servicemeta.httpPost(url);
-    }
     changePasswordProfile(data, origin) {
         const url = origin + '/login/chpwd';
         return this.servicemeta.httpPut(url, data);
@@ -2150,20 +2126,20 @@ class ConsumerService {
         }
         return null;
     }
-    // getUserEstimatedWaitingTime(prov_arr) {
-    //     let str = '';
-    //     for (let i = 0; i < prov_arr.length; i++) {
-    //         if (str !== '') {
-    //             str += '%2C'; // comma
-    //         }
-    //         str += prov_arr[i];
-    //     }
-    //     if (str === '') {
-    //         return null;
-    //     }
-    //     const path = 'provider/waitlist/queues/providerWaitingTime/' + str;
-    //     return this.servicemeta.httpGet(path);
-    // }
+    getUserEstimatedWaitingTime(prov_arr) {
+        let str = '';
+        for (let i = 0; i < prov_arr.length; i++) {
+            if (str !== '') {
+                str += '%2C'; // comma
+            }
+            str += prov_arr[i];
+        }
+        if (str === '') {
+            return null;
+        }
+        const path = 'provider/waitlist/queues/providerWaitingTime/' + str;
+        return this.servicemeta.httpGet(path);
+    }
     // updateAnalytics(body) {
     //     const url = 'provider/analytics/update';
     //     return this.servicemeta.httpPost(url, body);
@@ -2962,11 +2938,11 @@ class FieldErrorDisplayComponent {
     displayError;
     errorMsgs;
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FieldErrorDisplayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: FieldErrorDisplayComponent, selector: "app-field-error-display", inputs: { errorMsg: "errorMsg", displayError: "displayError", errorMsgs: "errorMsgs" }, ngImport: i0, template: "<div *ngIf=\"displayError\" tabindex=\"-1\">\n  <div class=\"sts-msg error\">{{ errorMsg || errorMsgs }}</div>\n</div>\n\n", styles: [".error-msg{color:#a94442}.fix-error-icon{top:27px}\n"], dependencies: [{ kind: "directive", type: i13.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: FieldErrorDisplayComponent, selector: "app-field-error-display", inputs: { errorMsg: "errorMsg", displayError: "displayError", errorMsgs: "errorMsgs" }, ngImport: i0, template: "<div *ngIf=\"displayError\" tabindex=\"-1\">\r\n  <div class=\"sts-msg error\">{{ errorMsg || errorMsgs }}</div>\r\n</div>\r\n\r\n", styles: [".error-msg{color:#a94442}.fix-error-icon{top:27px}\n"], dependencies: [{ kind: "directive", type: i13.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FieldErrorDisplayComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-field-error-display', template: "<div *ngIf=\"displayError\" tabindex=\"-1\">\n  <div class=\"sts-msg error\">{{ errorMsg || errorMsgs }}</div>\n</div>\n\n", styles: [".error-msg{color:#a94442}.fix-error-icon{top:27px}\n"] }]
+            args: [{ selector: 'app-field-error-display', template: "<div *ngIf=\"displayError\" tabindex=\"-1\">\r\n  <div class=\"sts-msg error\">{{ errorMsg || errorMsgs }}</div>\r\n</div>\r\n\r\n", styles: [".error-msg{color:#a94442}.fix-error-icon{top:27px}\n"] }]
         }], propDecorators: { errorMsg: [{
                 type: Input
             }], displayError: [{
@@ -2979,11 +2955,11 @@ class FormSuccessDisplayComponent {
     successMsg;
     displayMsg;
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FormSuccessDisplayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: FormSuccessDisplayComponent, selector: "app-form-success-display", inputs: { successMsg: "successMsg", displayMsg: "displayMsg" }, ngImport: i0, template: "<div *ngIf=\"displayMsg\" >\n  <div class=\"sts-msg success\">\n    {{ successMsg }}\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i13.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: FormSuccessDisplayComponent, selector: "app-form-success-display", inputs: { successMsg: "successMsg", displayMsg: "displayMsg" }, ngImport: i0, template: "<div *ngIf=\"displayMsg\" >\r\n  <div class=\"sts-msg success\">\r\n    {{ successMsg }}\r\n  </div>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i13.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FormSuccessDisplayComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-form-success-display', template: "<div *ngIf=\"displayMsg\" >\n  <div class=\"sts-msg success\">\n    {{ successMsg }}\n  </div>\n</div>\n" }]
+            args: [{ selector: 'app-form-success-display', template: "<div *ngIf=\"displayMsg\" >\r\n  <div class=\"sts-msg success\">\r\n    {{ successMsg }}\r\n  </div>\r\n</div>\r\n" }]
         }], propDecorators: { successMsg: [{
                 type: Input
             }], displayMsg: [{
@@ -3121,11 +3097,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)\">\n  <h1 class=\"mat-dialog-title\">\n    <button #queue mat-dialog-close class=\"modal_close\" id=\"btnClose\">\n      <i class=\"fa fa-window-close\" aria-hidden=\"true\"></i>\n    </button>\n  </h1>\n  <div mat-dialog-content>\n    <p class=\"mb-4 fontsize\"> {{data.message}}</p>\n    <div *ngIf=\"data && data.cancelPolicy\" class=\"policies\">\n      <p-accordion [multiple]=\"true\">\n        <p-accordionTab>\n          <ng-template pTemplate=\"header\">\n            <h4>Cancellation Policies</h4>\n          </ng-template>\n          <p>You can cancel your {{data.book}}s any time until\n            <span *ngIf=\"data.wtlist.date\">{{data.wtlist.date| date:\n              newDateFormat}}</span><span *ngIf=\"data.wtlist.appmtDate\">{{data.wtlist.appmtDate| date:\n              newDateFormat}}</span><span *ngIf=\"data.wtlist.orderDate\">{{data.wtlist.orderDate| date:\n              newDateFormat}}</span>.<span\n              *ngIf=\"data.wtlist && data.wtlist.providerAccount && data.wtlist.providerAccount.businessName\">\n              If the system doesn\u2019t permit your cancellation,\n              contact your provider, {{data.wtlist.providerAccount.businessName}}.\n              It\u2019s important to note that the\n              provider may cancel your bookings at their discretion for their own reasons.\n              Jaldee will keep you informed promptly regarding the changes through timely notifications.\n            </span>\n          </p>\n        </p-accordionTab>\n        <p-accordionTab>\n          <ng-template pTemplate=\"header\">\n            <h4>Refund policy for Advance Payments(only)</h4>\n          </ng-template>\n          <p>\n            In the case of your cancellation, a 3% (payment gateway fee) will be deducted from the refund\n            of the advanced payment made. For same-day cancellations, kindly contact your service provider,\n            {{data.wtlist.providerAccount.businessName}} to initiate the refund. For any refund-related queries, reach\n            out to\n            {{data.wtlist.providerAccount.businessName}} for assistance.\n          </p>\n        </p-accordionTab>\n      </p-accordion>\n      <p class=\"mt-4\"> Are you sure you want to cancel this {{data.book}}? <br/></p>\n    </div>\n    <div *ngIf=\"data.book !== 'Order' && data.cancelPolicy\">\n      <div class=\"form-group\">\n        <label class=\"col-form-label\" for=\"displayName\">{{select_reason_cap}}*</label><br>\n        <mat-chip-list>\n          <mat-chip *ngFor=\"let cancel_reason of cancel_reasons\" class=\"me-2 mb-2\"\n            color=\"{{(cancel_reason.value === amForm.get('reason').value) ? 'primary' : ''}}\"\n            selected=\"{{(cancel_reason.value === amForm.get('reason').value) ? true : false}}\"\n            [class.selected]=\"(cancel_reason.value === amForm.get('reason').value) ? true : false\"\n            (click)=\"selectReason(cancel_reason)\">\n            {{cancel_reason.title}}\n          </mat-chip>\n        </mat-chip-list>\n      </div>\n      <div class=\"form-group mt-2\">\n        <mat-checkbox formControlName=\"send_message\">{{send_message_cap}} {{rep_username}}</mat-checkbox>\n      </div>\n      <div class=\"form-group reason-area\" *ngIf=\"amForm.get('send_message').value\">\n        <textarea  class=\"form-control\" rows=\"3\"  id=\"message\" maxlength=\"1000\" pInputTextarea placeholder=\"Message\" formControlName=\"message\"></textarea>\n        <app-field-error-display [displayError]=\"fed_service.isFieldValid(amForm,'message')\"\n          errorMsg=\"Please enter a message.\">\n        </app-field-error-display>\n      </div>\n    </div>\n  </div>\n  <div mat-dialog-actions *ngIf=\"data.book !== 'Order'&& data.cancelPolicy\" class=\"mb-2\">\n    <div class=\"col-md-12\" style=\"margin-top: 15px;display: inline-flex;\">\n      <button type=\"button\" mat-dialog-close class=\"cs-btn bt2\" id=\"btnCancel\">{{cancel_btn_cap}}</button>\n      <button type=\"submit\" mat-button [disabled]=\"!amForm.valid\" class=\"cs-btn bt1\" id=\"btnOk\">{{ok_btn_cap}}</button>\n    </div>\n  </div>\n  <app-field-error-display [displayError]=\"true\" *ngIf=\"api_error\" errorMsg=\"{{api_error}}\"></app-field-error-display>\n  <app-form-success-display [displayMsg]=\"true\" *ngIf=\"api_success\" successMsg=\"{{api_success}}\">\n  </app-form-success-display>\n  <div mat-dialog-actions class=\"paddingtop\" *ngIf=\"data.book !== 'Order' && !data.cancelPolicy\">\n    <button tabindex=\"-1\" (click)=\"onClick(0)\" class=\"cs-btn bt2\" id=\"btnCancel\">{{cancel_btn_cap}}</button>\n    <button tabindex=\"2\" (click)=\"onClick(1)\" id=\"btnOk\"\n      class=\"cs-btn bt1 reddelete checkavailabilitybutton\">{{ok_btn_cap}}</button>\n  </div>\n  <app-field-error-display [displayError]=\"true\" *ngIf=\"showError\" errorMsg=\"Department name is required\">\n  </app-field-error-display>\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: i13.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i13.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i13.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: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { 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.InputTextarea, selector: "[pInputTextarea]", inputs: ["autoResize", "variant"], outputs: ["onResize"] }, { kind: "pipe", type: i13.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}}? <br/></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><br>\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\" maxlength=\"1000\" 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: i13.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i13.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i13.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: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { 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.InputTextarea, selector: "[pInputTextarea]", inputs: ["autoResize", "variant"], outputs: ["onResize"] }, { kind: "pipe", type: i13.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)\">\n  <h1 class=\"mat-dialog-title\">\n    <button #queue mat-dialog-close class=\"modal_close\" id=\"btnClose\">\n      <i class=\"fa fa-window-close\" aria-hidden=\"true\"></i>\n    </button>\n  </h1>\n  <div mat-dialog-content>\n    <p class=\"mb-4 fontsize\"> {{data.message}}</p>\n    <div *ngIf=\"data && data.cancelPolicy\" class=\"policies\">\n      <p-accordion [multiple]=\"true\">\n        <p-accordionTab>\n          <ng-template pTemplate=\"header\">\n            <h4>Cancellation Policies</h4>\n          </ng-template>\n          <p>You can cancel your {{data.book}}s any time until\n            <span *ngIf=\"data.wtlist.date\">{{data.wtlist.date| date:\n              newDateFormat}}</span><span *ngIf=\"data.wtlist.appmtDate\">{{data.wtlist.appmtDate| date:\n              newDateFormat}}</span><span *ngIf=\"data.wtlist.orderDate\">{{data.wtlist.orderDate| date:\n              newDateFormat}}</span>.<span\n              *ngIf=\"data.wtlist && data.wtlist.providerAccount && data.wtlist.providerAccount.businessName\">\n              If the system doesn\u2019t permit your cancellation,\n              contact your provider, {{data.wtlist.providerAccount.businessName}}.\n              It\u2019s important to note that the\n              provider may cancel your bookings at their discretion for their own reasons.\n              Jaldee will keep you informed promptly regarding the changes through timely notifications.\n            </span>\n          </p>\n        </p-accordionTab>\n        <p-accordionTab>\n          <ng-template pTemplate=\"header\">\n            <h4>Refund policy for Advance Payments(only)</h4>\n          </ng-template>\n          <p>\n            In the case of your cancellation, a 3% (payment gateway fee) will be deducted from the refund\n            of the advanced payment made. For same-day cancellations, kindly contact your service provider,\n            {{data.wtlist.providerAccount.businessName}} to initiate the refund. For any refund-related queries, reach\n            out to\n            {{data.wtlist.providerAccount.businessName}} for assistance.\n          </p>\n        </p-accordionTab>\n      </p-accordion>\n      <p class=\"mt-4\"> Are you sure you want to cancel this {{data.book}}? <br/></p>\n    </div>\n    <div *ngIf=\"data.book !== 'Order' && data.cancelPolicy\">\n      <div class=\"form-group\">\n        <label class=\"col-form-label\" for=\"displayName\">{{select_reason_cap}}*</label><br>\n        <mat-chip-list>\n          <mat-chip *ngFor=\"let cancel_reason of cancel_reasons\" class=\"me-2 mb-2\"\n            color=\"{{(cancel_reason.value === amForm.get('reason').value) ? 'primary' : ''}}\"\n            selected=\"{{(cancel_reason.value === amForm.get('reason').value) ? true : false}}\"\n            [class.selected]=\"(cancel_reason.value === amForm.get('reason').value) ? true : false\"\n            (click)=\"selectReason(cancel_reason)\">\n            {{cancel_reason.title}}\n          </mat-chip>\n        </mat-chip-list>\n      </div>\n      <div class=\"form-group mt-2\">\n        <mat-checkbox formControlName=\"send_message\">{{send_message_cap}} {{rep_username}}</mat-checkbox>\n      </div>\n      <div class=\"form-group reason-area\" *ngIf=\"amForm.get('send_message').value\">\n        <textarea  class=\"form-control\" rows=\"3\"  id=\"message\" maxlength=\"1000\" pInputTextarea placeholder=\"Message\" formControlName=\"message\"></textarea>\n        <app-field-error-display [displayError]=\"fed_service.isFieldValid(amForm,'message')\"\n          errorMsg=\"Please enter a message.\">\n        </app-field-error-display>\n      </div>\n    </div>\n  </div>\n  <div mat-dialog-actions *ngIf=\"data.book !== 'Order'&& data.cancelPolicy\" class=\"mb-2\">\n    <div class=\"col-md-12\" style=\"margin-top: 15px;display: inline-flex;\">\n      <button type=\"button\" mat-dialog-close class=\"cs-btn bt2\" id=\"btnCancel\">{{cancel_btn_cap}}</button>\n      <button type=\"submit\" mat-button [disabled]=\"!amForm.valid\" class=\"cs-btn bt1\" id=\"btnOk\">{{ok_btn_cap}}</button>\n    </div>\n  </div>\n  <app-field-error-display [displayError]=\"true\" *ngIf=\"api_error\" errorMsg=\"{{api_error}}\"></app-field-error-display>\n  <app-form-success-display [displayMsg]=\"true\" *ngIf=\"api_success\" successMsg=\"{{api_success}}\">\n  </app-form-success-display>\n  <div mat-dialog-actions class=\"paddingtop\" *ngIf=\"data.book !== 'Order' && !data.cancelPolicy\">\n    <button tabindex=\"-1\" (click)=\"onClick(0)\" class=\"cs-btn bt2\" id=\"btnCancel\">{{cancel_btn_cap}}</button>\n    <button tabindex=\"2\" (click)=\"onClick(1)\" id=\"btnOk\"\n      class=\"cs-btn bt1 reddelete checkavailabilitybutton\">{{ok_btn_cap}}</button>\n  </div>\n  <app-field-error-display [displayError]=\"true\" *ngIf=\"showError\" errorMsg=\"Department name is required\">\n  </app-field-error-display>\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}}? <br/></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><br>\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\" maxlength=\"1000\" 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]
@@ -4848,6 +4824,206 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                 }]
         }], ctorParameters: () => [{ type: ServiceMeta }] });
+class JaldeeTimeService {
+    dateTimeProcessor;
+    moment;
+    constructor(dateTimeProcessor) {
+        this.dateTimeProcessor = dateTimeProcessor;
+        this.moment = this.dateTimeProcessor.getMoment();
+    }
+    /**
+     *
+     * @param interval
+     * @param startTime
+     * @param endTime
+     * @returns
+     */
+    getTimeSlotsFromQTimings(interval, startTime, endTime) {
+        const slotList = [];
+        // slotList.push(startTime);
+        const startTimeStr = this.moment(startTime, ['HH:mm A']).format('HH:mm A').toString();
+        let startingDTime = this.dateTimeProcessor.getDateFromTimeString(startTimeStr);
+        slotList.push(this.moment(startTime, ['HH:mm A']).format('hh:mm A').toString());
+        const endTimeStr = this.moment(endTime, ['HH:mm A']).format('HH:mm A').toString();
+        const endDTime = this.dateTimeProcessor.getDateFromTimeString(endTimeStr);
+        // tslint:disable-next-line:radix
+        const endDate = parseInt(this.moment(endDTime, ['DD']).format('DD').toString());
+        // let startingDTime = this.getDateFromTimeString(startTime);
+        let exitLoop = false;
+        while (!exitLoop) {
+            const nextTime = this.moment(startingDTime).add(interval, 'm');
+            // tslint:disable-next-line:radix
+            const nextDate = parseInt(nextTime.format('DD'));
+            const nextTimeDt = this.dateTimeProcessor.getDateFromTimeString(this.moment(nextTime, ['HH:mm A']).format('HH:mm A').toString());
+            if (nextDate === endDate) {
+                if (nextTimeDt.getTime() <= endDTime.getTime()) {
+                    slotList.push(this.moment(nextTime, ['HH:mm A']).format('hh:mm A').toString());
+                }
+                else {
+                    exitLoop = true;
+                }
+            }
+            else {
+                exitLoop = true;
+            }
+            startingDTime = nextTimeDt;
+        }
+        return slotList;
+    }
+    /**
+     *
+     * @param schedule_arr
+     * @returns
+     */
+    arrageScheduleforDisplay(schedule_arr) {
+        const timebase = [];
+        for (let i = 0; i < schedule_arr.length; i++) {
+            const timeindx = schedule_arr[i]['sTime'].replace(/\s+/, '') + schedule_arr[i]['eTime'].replace(/\s+/, '');
+            if (timebase[timeindx] === undefined) {
+                timebase[timeindx] = new Array();
+                timebase[timeindx].push(schedule_arr[i]);
+            }
+            else {
+                timebase[timeindx].push(schedule_arr[i]);
+            }
+        }
+        for (const obj in timebase) {
+            if (obj) {
+                const len = timebase[obj].length;
+                for (let i = 0; i < len; i++) {
+                    for (let j = i + 1; j < len; j++) {
+                        if (timebase[obj][j].day < timebase[obj][i].day) {
+                            const tempobj = timebase[obj][i];
+                            timebase[obj][i] = timebase[obj][j];
+                            timebase[obj][j] = tempobj;
+                        }
+                    }
+                }
+            }
+        }
+        const displaysch = [];
+        let pday = 0;
+        for (const obj in timebase) {
+            if (obj) {
+                let curstr = '';
+                let gap = 0;
+                for (let i = 0; i < timebase[obj].length; i++) {
+                    if (i === 0) {
+                        curstr = this.dateTimeProcessor.getDay(timebase[obj][i].day);
+                        pday = timebase[obj][i].day;
+                    }
+                    else {
+                        const diffs = timebase[obj][i].day - pday;
+                        if (diffs > 1) {
+                            if (gap >= 1) {
+                                if (curstr.includes((this.dateTimeProcessor.getDay(pday)))) {
+                                }
+                                else {
+                                    curstr = curstr + ' - ' + this.dateTimeProcessor.getDay(pday);
+                                }
+                            }
+                            curstr = curstr + ', ' + this.dateTimeProcessor.getDay(timebase[obj][i].day);
+                        }
+                        else {
+                            if (i === (timebase[obj].length - 1)) {
+                                curstr = curstr + ' - ' + this.dateTimeProcessor.getDay(timebase[obj][i].day);
+                            }
+                            gap++;
+                        }
+                        pday = timebase[obj][i].day;
+                    }
+                }
+                displaysch.push({ 'time': timebase[obj][0]['sTime'] + ' - ' + timebase[obj][0]['eTime'], 'dstr': curstr, 'indx': obj, 'recurrtype': timebase[obj][0]['recurrtype'] });
+            }
+        }
+        return displaysch;
+    }
+    getminutesOfDay(m) {
+        return parseInt(m.minute, 10) + parseInt(m.hour, 10) * 60;
+    }
+    getTimeinMin(time) {
+        const time_min = (time.hour * 60) + time.minute;
+        return (typeof (time_min) === 'number') ? time_min : 0;
+    }
+    prepareScheduleforSaving(schedule_arr) {
+        const timebase = [];
+        for (let i = 0; i < schedule_arr.length; i++) {
+            const timeindx = schedule_arr[i]['sTime'].replace(/\s+/, '') + schedule_arr[i]['eTime'].replace(/\s+/, '');
+            if (timebase[timeindx] === undefined) {
+                timebase[timeindx] = new Array();
+                timebase[timeindx].push(schedule_arr[i]);
+            }
+            else {
+                timebase[timeindx].push(schedule_arr[i]);
+            }
+        }
+        for (const obj in timebase) {
+            if (obj) {
+                const len = timebase[obj].length;
+                for (let i = 0; i < len; i++) {
+                    for (let j = i + 1; j < len; j++) {
+                        if (timebase[obj][j].day < timebase[obj][i].day) {
+                            const tempobj = timebase[obj][i];
+                            timebase[obj][i] = timebase[obj][j];
+                            timebase[obj][j] = tempobj;
+                        }
+                    }
+                }
+            }
+        }
+        const displaysch = [];
+        for (const obj in timebase) {
+            if (obj) {
+                const curstr = [];
+                for (let i = 0; i < timebase[obj].length; i++) {
+                    curstr.push(timebase[obj][i].day);
+                }
+                displaysch.push({ 'stime': timebase[obj][0]['sTime'], 'etime': timebase[obj][0]['eTime'], 'daystr': curstr });
+            }
+        }
+        return displaysch;
+    }
+    formatTime(hours, minutes) {
+        let sHours = hours.toString();
+        let sMinutes = minutes.toString();
+        if (hours < 10) {
+            sHours = '0' + sHours;
+        }
+        if (minutes < 10) {
+            sMinutes = '0' + sMinutes;
+        }
+        const time24 = sHours + ':' + sMinutes + ':00';
+        return time24;
+    }
+    AMHourto24Time(time12) {
+        const time = time12;
+        let hours = Number(time.match(/^(\d+)/)[1]);
+        const minutes = Number(time.match(/:(\d+)/)[1]);
+        const AMPM = time.match(/\s(.*)$/)[1];
+        if (AMPM === 'PM' && hours < 12) {
+            hours = hours + 12;
+        }
+        if (AMPM === 'AM' && hours === 12) {
+            hours = hours - 12;
+        }
+        let sHours = hours.toString();
+        let sMinutes = minutes.toString();
+        if (hours < 10) {
+            sHours = '0' + sHours;
+        }
+        if (minutes < 10) {
+            sMinutes = '0' + sMinutes;
+        }
+        const time24 = sHours + ':' + sMinutes + ':00';
+        return time24;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: JaldeeTimeService, deps: [{ token: DateTimeProcessor }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: JaldeeTimeService });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: JaldeeTimeService, decorators: [{
+            type: Injectable
+        }], ctorParameters: () => [{ type: DateTimeProcessor }] });
 class TimezoneConverter {
     constructor() {
     }
@@ -4900,11 +5076,11 @@ class SkeletonLoadingComponent {
     ngOnInit() {
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SkeletonLoadingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SkeletonLoadingComponent, selector: "app-skeleton-loading", ngImport: i0, template: "<ul class=\"o-vertical-spacing o-vertical-spacing--l\">\n  <li class=\"blog-post o-media\">\n    <div class=\"o-media__figure\">\n      <span class=\"skeleton-box\" style=\"width:100px;height:80px;\"></span>\n    </div>\n    <div class=\"o-media__body\">\n      <div class=\"o-vertical-spacing\">\n        <h3 class=\"blog-post__headline\">\n          <span class=\"skeleton-box\" style=\"width:55%;\"></span>\n        </h3>\n        <p>\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\n          <span class=\"skeleton-box\" style=\"width:90%;\"></span>\n          <span class=\"skeleton-box\" style=\"width:83%;\"></span>\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\n        </p>\n        <div class=\"blog-post__meta\">\n          <span class=\"skeleton-box\" style=\"width:70px;\"></span>\n        </div>\n      </div>\n    </div>\n  </li>\n  <li class=\"blog-post o-media\">\n    <div class=\"o-media__figure\">\n      <span class=\"skeleton-box\" style=\"width:100px;height:80px;\"></span>\n    </div>\n    <div class=\"o-media__body\">\n      <div class=\"o-vertical-spacing\">\n        <h3 class=\"blog-post__headline\">\n          <span class=\"skeleton-box\" style=\"width:55%;\"></span>\n        </h3>\n        <p>\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\n          <span class=\"skeleton-box\" style=\"width:90%;\"></span>\n          <span class=\"skeleton-box\" style=\"width:83%;\"></span>\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\n        </p>\n        <div class=\"blog-post__meta\">\n          <span class=\"skeleton-box\" style=\"width:70px;\"></span>\n        </div>\n      </div>\n    </div>\n  </li>\n  <li class=\"blog-post o-media\">\n    <div class=\"o-media__figure\">\n      <span class=\"skeleton-box\" style=\"width:100px;height:80px;\"></span>\n    </div>\n    <div class=\"o-media__body\">\n      <div class=\"o-vertical-spacing\">\n        <h3 class=\"blog-post__headline\">\n          <span class=\"skeleton-box\" style=\"width:55%;\"></span>\n        </h3>\n        <p>\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\n          <span class=\"skeleton-box\" style=\"width:90%;\"></span>\n          <span class=\"skeleton-box\" style=\"width:83%;\"></span>\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\n        </p>\n        <div class=\"blog-post__meta\">\n          <span class=\"skeleton-box\" style=\"width:70px;\"></span>\n        </div>\n      </div>\n    </div>\n  </li>\n  <li class=\"blog-post o-media\">\n    <div class=\"o-media__figure\">\n      <span class=\"skeleton-box\" style=\"width:100px;height:80px;\"></span>\n    </div>\n    <div class=\"o-media__body\">\n      <div class=\"o-vertical-spacing\">\n        <h3 class=\"blog-post__headline\">\n          <span class=\"skeleton-box\" style=\"width:55%;\"></span>\n        </h3>\n        <p>\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\n          <span class=\"skeleton-box\" style=\"width:90%;\"></span>\n          <span class=\"skeleton-box\" style=\"width:83%;\"></span>\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\n        </p>\n        <div class=\"blog-post__meta\">\n          <span class=\"skeleton-box\" style=\"width:70px;\"></span>\n        </div>\n      </div>\n    </div>\n  </li>\n  <li class=\"blog-post o-media\">\n    <div class=\"o-media__figure\">\n      <span class=\"skeleton-box\" style=\"width:100px;height:80px;\"></span>\n    </div>\n    <div class=\"o-media__body\">\n      <div class=\"o-vertical-spacing\">\n        <h3 class=\"blog-post__headline\">\n          <span class=\"skeleton-box\" style=\"width:55%;\"></span>\n        </h3>\n        <p>\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\n          <span class=\"skeleton-box\" style=\"width:90%;\"></span>\n          <span class=\"skeleton-box\" style=\"width:83%;\"></span>\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\n        </p>\n        <div class=\"blog-post__meta\">\n          <span class=\"skeleton-box\" style=\"width:70px;\"></span>\n        </div>\n      </div>\n    </div>\n  </li>\n\n</ul>\n", styles: [".skeleton-box{display:inline-block;height:1em;position:relative;overflow:hidden;background-color:#dddbdd}.skeleton-box:after{position:absolute;inset:0;transform:translate(-100%);background-image:linear-gradient(90deg,#fff0 0,#fff3 20%,#ffffff80 60%,#fff0);animation:shimmer 2s infinite;content:\"\"}@keyframes shimmer{to{transform:translate(100%)}}.blog-post__headline{font-size:1.25em;font-weight:700}.blog-post__meta{font-size:.85em;color:#6b6b6b}.o-media{display:flex}.o-media__body{flex-grow:1;margin-left:1em}.o-vertical-spacing>*+*{margin-top:.75em}.o-vertical-spacing--l>*+*{margin-top:2em}header h1{font-family:Rubik,sans-serif;font-weight:500;line-height:1.2;font-size:2em}header p:not(:first-child){margin-top:1em}\n"] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SkeletonLoadingComponent, selector: "app-skeleton-loading", ngImport: i0, template: "<ul class=\"o-vertical-spacing o-vertical-spacing--l\">\r\n  <li class=\"blog-post o-media\">\r\n    <div class=\"o-media__figure\">\r\n      <span class=\"skeleton-box\" style=\"width:100px;height:80px;\"></span>\r\n    </div>\r\n    <div class=\"o-media__body\">\r\n      <div class=\"o-vertical-spacing\">\r\n        <h3 class=\"blog-post__headline\">\r\n          <span class=\"skeleton-box\" style=\"width:55%;\"></span>\r\n        </h3>\r\n        <p>\r\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\r\n          <span class=\"skeleton-box\" style=\"width:90%;\"></span>\r\n          <span class=\"skeleton-box\" style=\"width:83%;\"></span>\r\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\r\n        </p>\r\n        <div class=\"blog-post__meta\">\r\n          <span class=\"skeleton-box\" style=\"width:70px;\"></span>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </li>\r\n  <li class=\"blog-post o-media\">\r\n    <div class=\"o-media__figure\">\r\n      <span class=\"skeleton-box\" style=\"width:100px;height:80px;\"></span>\r\n    </div>\r\n    <div class=\"o-media__body\">\r\n      <div class=\"o-vertical-spacing\">\r\n        <h3 class=\"blog-post__headline\">\r\n          <span class=\"skeleton-box\" style=\"width:55%;\"></span>\r\n        </h3>\r\n        <p>\r\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\r\n          <span class=\"skeleton-box\" style=\"width:90%;\"></span>\r\n          <span class=\"skeleton-box\" style=\"width:83%;\"></span>\r\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\r\n        </p>\r\n        <div class=\"blog-post__meta\">\r\n          <span class=\"skeleton-box\" style=\"width:70px;\"></span>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </li>\r\n  <li class=\"blog-post o-media\">\r\n    <div class=\"o-media__figure\">\r\n      <span class=\"skeleton-box\" style=\"width:100px;height:80px;\"></span>\r\n    </div>\r\n    <div class=\"o-media__body\">\r\n      <div class=\"o-vertical-spacing\">\r\n        <h3 class=\"blog-post__headline\">\r\n          <span class=\"skeleton-box\" style=\"width:55%;\"></span>\r\n        </h3>\r\n        <p>\r\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\r\n          <span class=\"skeleton-box\" style=\"width:90%;\"></span>\r\n          <span class=\"skeleton-box\" style=\"width:83%;\"></span>\r\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\r\n        </p>\r\n        <div class=\"blog-post__meta\">\r\n          <span class=\"skeleton-box\" style=\"width:70px;\"></span>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </li>\r\n  <li class=\"blog-post o-media\">\r\n    <div class=\"o-media__figure\">\r\n      <span class=\"skeleton-box\" style=\"width:100px;height:80px;\"></span>\r\n    </div>\r\n    <div class=\"o-media__body\">\r\n      <div class=\"o-vertical-spacing\">\r\n        <h3 class=\"blog-post__headline\">\r\n          <span class=\"skeleton-box\" style=\"width:55%;\"></span>\r\n        </h3>\r\n        <p>\r\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\r\n          <span class=\"skeleton-box\" style=\"width:90%;\"></span>\r\n          <span class=\"skeleton-box\" style=\"width:83%;\"></span>\r\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\r\n        </p>\r\n        <div class=\"blog-post__meta\">\r\n          <span class=\"skeleton-box\" style=\"width:70px;\"></span>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </li>\r\n  <li class=\"blog-post o-media\">\r\n    <div class=\"o-media__figure\">\r\n      <span class=\"skeleton-box\" style=\"width:100px;height:80px;\"></span>\r\n    </div>\r\n    <div class=\"o-media__body\">\r\n      <div class=\"o-vertical-spacing\">\r\n        <h3 class=\"blog-post__headline\">\r\n          <span class=\"skeleton-box\" style=\"width:55%;\"></span>\r\n        </h3>\r\n        <p>\r\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\r\n          <span class=\"skeleton-box\" style=\"width:90%;\"></span>\r\n          <span class=\"skeleton-box\" style=\"width:83%;\"></span>\r\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\r\n        </p>\r\n        <div class=\"blog-post__meta\">\r\n          <span class=\"skeleton-box\" style=\"width:70px;\"></span>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </li>\r\n\r\n</ul>\r\n", styles: [".skeleton-box{display:inline-block;height:1em;position:relative;overflow:hidden;background-color:#dddbdd}.skeleton-box:after{position:absolute;inset:0;transform:translate(-100%);background-image:linear-gradient(90deg,#fff0 0,#fff3 20%,#ffffff80 60%,#fff0);animation:shimmer 2s infinite;content:\"\"}@keyframes shimmer{to{transform:translate(100%)}}.blog-post__headline{font-size:1.25em;font-weight:700}.blog-post__meta{font-size:.85em;color:#6b6b6b}.o-media{display:flex}.o-media__body{flex-grow:1;margin-left:1em}.o-vertical-spacing>*+*{margin-top:.75em}.o-vertical-spacing--l>*+*{margin-top:2em}header h1{font-family:Rubik,sans-serif;font-weight:500;line-height:1.2;font-size:2em}header p:not(:first-child){margin-top:1em}\n"] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SkeletonLoadingComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-skeleton-loading', template: "<ul class=\"o-vertical-spacing o-vertical-spacing--l\">\n  <li class=\"blog-post o-media\">\n    <div class=\"o-media__figure\">\n      <span class=\"skeleton-box\" style=\"width:100px;height:80px;\"></span>\n    </div>\n    <div class=\"o-media__body\">\n      <div class=\"o-vertical-spacing\">\n        <h3 class=\"blog-post__headline\">\n          <span class=\"skeleton-box\" style=\"width:55%;\"></span>\n        </h3>\n        <p>\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\n          <span class=\"skeleton-box\" style=\"width:90%;\"></span>\n          <span class=\"skeleton-box\" style=\"width:83%;\"></span>\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\n        </p>\n        <div class=\"blog-post__meta\">\n          <span class=\"skeleton-box\" style=\"width:70px;\"></span>\n        </div>\n      </div>\n    </div>\n  </li>\n  <li class=\"blog-post o-media\">\n    <div class=\"o-media__figure\">\n      <span class=\"skeleton-box\" style=\"width:100px;height:80px;\"></span>\n    </div>\n    <div class=\"o-media__body\">\n      <div class=\"o-vertical-spacing\">\n        <h3 class=\"blog-post__headline\">\n          <span class=\"skeleton-box\" style=\"width:55%;\"></span>\n        </h3>\n        <p>\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\n          <span class=\"skeleton-box\" style=\"width:90%;\"></span>\n          <span class=\"skeleton-box\" style=\"width:83%;\"></span>\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\n        </p>\n        <div class=\"blog-post__meta\">\n          <span class=\"skeleton-box\" style=\"width:70px;\"></span>\n        </div>\n      </div>\n    </div>\n  </li>\n  <li class=\"blog-post o-media\">\n    <div class=\"o-media__figure\">\n      <span class=\"skeleton-box\" style=\"width:100px;height:80px;\"></span>\n    </div>\n    <div class=\"o-media__body\">\n      <div class=\"o-vertical-spacing\">\n        <h3 class=\"blog-post__headline\">\n          <span class=\"skeleton-box\" style=\"width:55%;\"></span>\n        </h3>\n        <p>\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\n          <span class=\"skeleton-box\" style=\"width:90%;\"></span>\n          <span class=\"skeleton-box\" style=\"width:83%;\"></span>\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\n        </p>\n        <div class=\"blog-post__meta\">\n          <span class=\"skeleton-box\" style=\"width:70px;\"></span>\n        </div>\n      </div>\n    </div>\n  </li>\n  <li class=\"blog-post o-media\">\n    <div class=\"o-media__figure\">\n      <span class=\"skeleton-box\" style=\"width:100px;height:80px;\"></span>\n    </div>\n    <div class=\"o-media__body\">\n      <div class=\"o-vertical-spacing\">\n        <h3 class=\"blog-post__headline\">\n          <span class=\"skeleton-box\" style=\"width:55%;\"></span>\n        </h3>\n        <p>\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\n          <span class=\"skeleton-box\" style=\"width:90%;\"></span>\n          <span class=\"skeleton-box\" style=\"width:83%;\"></span>\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\n        </p>\n        <div class=\"blog-post__meta\">\n          <span class=\"skeleton-box\" style=\"width:70px;\"></span>\n        </div>\n      </div>\n    </div>\n  </li>\n  <li class=\"blog-post o-media\">\n    <div class=\"o-media__figure\">\n      <span class=\"skeleton-box\" style=\"width:100px;height:80px;\"></span>\n    </div>\n    <div class=\"o-media__body\">\n      <div class=\"o-vertical-spacing\">\n        <h3 class=\"blog-post__headline\">\n          <span class=\"skeleton-box\" style=\"width:55%;\"></span>\n        </h3>\n        <p>\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\n          <span class=\"skeleton-box\" style=\"width:90%;\"></span>\n          <span class=\"skeleton-box\" style=\"width:83%;\"></span>\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\n        </p>\n        <div class=\"blog-post__meta\">\n          <span class=\"skeleton-box\" style=\"width:70px;\"></span>\n        </div>\n      </div>\n    </div>\n  </li>\n\n</ul>\n", styles: [".skeleton-box{display:inline-block;height:1em;position:relative;overflow:hidden;background-color:#dddbdd}.skeleton-box:after{position:absolute;inset:0;transform:translate(-100%);background-image:linear-gradient(90deg,#fff0 0,#fff3 20%,#ffffff80 60%,#fff0);animation:shimmer 2s infinite;content:\"\"}@keyframes shimmer{to{transform:translate(100%)}}.blog-post__headline{font-size:1.25em;font-weight:700}.blog-post__meta{font-size:.85em;color:#6b6b6b}.o-media{display:flex}.o-media__body{flex-grow:1;margin-left:1em}.o-vertical-spacing>*+*{margin-top:.75em}.o-vertical-spacing--l>*+*{margin-top:2em}header h1{font-family:Rubik,sans-serif;font-weight:500;line-height:1.2;font-size:2em}header p:not(:first-child){margin-top:1em}\n"] }]
+            args: [{ selector: 'app-skeleton-loading', template: "<ul class=\"o-vertical-spacing o-vertical-spacing--l\">\r\n  <li class=\"blog-post o-media\">\r\n    <div class=\"o-media__figure\">\r\n      <span class=\"skeleton-box\" style=\"width:100px;height:80px;\"></span>\r\n    </div>\r\n    <div class=\"o-media__body\">\r\n      <div class=\"o-vertical-spacing\">\r\n        <h3 class=\"blog-post__headline\">\r\n          <span class=\"skeleton-box\" style=\"width:55%;\"></span>\r\n        </h3>\r\n        <p>\r\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\r\n          <span class=\"skeleton-box\" style=\"width:90%;\"></span>\r\n          <span class=\"skeleton-box\" style=\"width:83%;\"></span>\r\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\r\n        </p>\r\n        <div class=\"blog-post__meta\">\r\n          <span class=\"skeleton-box\" style=\"width:70px;\"></span>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </li>\r\n  <li class=\"blog-post o-media\">\r\n    <div class=\"o-media__figure\">\r\n      <span class=\"skeleton-box\" style=\"width:100px;height:80px;\"></span>\r\n    </div>\r\n    <div class=\"o-media__body\">\r\n      <div class=\"o-vertical-spacing\">\r\n        <h3 class=\"blog-post__headline\">\r\n          <span class=\"skeleton-box\" style=\"width:55%;\"></span>\r\n        </h3>\r\n        <p>\r\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\r\n          <span class=\"skeleton-box\" style=\"width:90%;\"></span>\r\n          <span class=\"skeleton-box\" style=\"width:83%;\"></span>\r\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\r\n        </p>\r\n        <div class=\"blog-post__meta\">\r\n          <span class=\"skeleton-box\" style=\"width:70px;\"></span>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </li>\r\n  <li class=\"blog-post o-media\">\r\n    <div class=\"o-media__figure\">\r\n      <span class=\"skeleton-box\" style=\"width:100px;height:80px;\"></span>\r\n    </div>\r\n    <div class=\"o-media__body\">\r\n      <div class=\"o-vertical-spacing\">\r\n        <h3 class=\"blog-post__headline\">\r\n          <span class=\"skeleton-box\" style=\"width:55%;\"></span>\r\n        </h3>\r\n        <p>\r\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\r\n          <span class=\"skeleton-box\" style=\"width:90%;\"></span>\r\n          <span class=\"skeleton-box\" style=\"width:83%;\"></span>\r\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\r\n        </p>\r\n        <div class=\"blog-post__meta\">\r\n          <span class=\"skeleton-box\" style=\"width:70px;\"></span>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </li>\r\n  <li class=\"blog-post o-media\">\r\n    <div class=\"o-media__figure\">\r\n      <span class=\"skeleton-box\" style=\"width:100px;height:80px;\"></span>\r\n    </div>\r\n    <div class=\"o-media__body\">\r\n      <div class=\"o-vertical-spacing\">\r\n        <h3 class=\"blog-post__headline\">\r\n          <span class=\"skeleton-box\" style=\"width:55%;\"></span>\r\n        </h3>\r\n        <p>\r\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\r\n          <span class=\"skeleton-box\" style=\"width:90%;\"></span>\r\n          <span class=\"skeleton-box\" style=\"width:83%;\"></span>\r\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\r\n        </p>\r\n        <div class=\"blog-post__meta\">\r\n          <span class=\"skeleton-box\" style=\"width:70px;\"></span>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </li>\r\n  <li class=\"blog-post o-media\">\r\n    <div class=\"o-media__figure\">\r\n      <span class=\"skeleton-box\" style=\"width:100px;height:80px;\"></span>\r\n    </div>\r\n    <div class=\"o-media__body\">\r\n      <div class=\"o-vertical-spacing\">\r\n        <h3 class=\"blog-post__headline\">\r\n          <span class=\"skeleton-box\" style=\"width:55%;\"></span>\r\n        </h3>\r\n        <p>\r\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\r\n          <span class=\"skeleton-box\" style=\"width:90%;\"></span>\r\n          <span class=\"skeleton-box\" style=\"width:83%;\"></span>\r\n          <span class=\"skeleton-box\" style=\"width:80%;\"></span>\r\n        </p>\r\n        <div class=\"blog-post__meta\">\r\n          <span class=\"skeleton-box\" style=\"width:70px;\"></span>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </li>\r\n\r\n</ul>\r\n", styles: [".skeleton-box{display:inline-block;height:1em;position:relative;overflow:hidden;background-color:#dddbdd}.skeleton-box:after{position:absolute;inset:0;transform:translate(-100%);background-image:linear-gradient(90deg,#fff0 0,#fff3 20%,#ffffff80 60%,#fff0);animation:shimmer 2s infinite;content:\"\"}@keyframes shimmer{to{transform:translate(100%)}}.blog-post__headline{font-size:1.25em;font-weight:700}.blog-post__meta{font-size:.85em;color:#6b6b6b}.o-media{display:flex}.o-media__body{flex-grow:1;margin-left:1em}.o-vertical-spacing>*+*{margin-top:.75em}.o-vertical-spacing--l>*+*{margin-top:2em}header h1{font-family:Rubik,sans-serif;font-weight:500;line-height:1.2;font-size:2em}header p:not(:first-child){margin-top:1em}\n"] }]
         }], ctorParameters: () => [] });
 class SkeletonLoadingModule {
@@ -5102,11 +5278,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\">\n  <h1 class=\"mat-dialog-title\"> {{title}}\n    <button #locte mat-dialog-close class=\"modal_close\" tabindex=\"-1\" id=\"btnClose\">\n      <i class=\"fa fa-window-close\" aria-hidden=\"true\"></i>\n    </button>\n  </h1>\n  <div class=\"pad-20 image-scroll\">\n    <img style=\"width:100%;margin-top: -20px;\" [src]=\"details.url||details.s3path\" alt=\"\"\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'\n  ||details.type == 'bmp' ||details.type == 'png' ||details.type == 'gif' ||details.type == 'jpg' ||details.type == 'jpeg' ||details.type == 'webp'\" />\n    <video style=\"width:100%;height: 75vh;\" controls\n      *ngIf=\"(data.source === 'qnr' && type === 'video') || (data.source === 'mr' && details.type && details.type == 'video/mp4' || details.type == 'video/mpeg'||details.type == 'video/quicktime')\">\n      <source [src]=\"details.url\" />\n    </video>\n    <audio style=\"width:100%;\" controls\n      *ngIf=\"(data.source === 'qnr' && type === 'audio') || (data.source === 'mr' && details.type && details.type == 'audio/ogg'|| details.type == 'audio/mpeg'|| details.type == 'audio/mp3')\">\n      <source [src]=\"details.url\" />\n    </audio>\n  </div>\n</form>", styles: [".pad-20{padding:20px!important}\n"], dependencies: [{ kind: "directive", type: i13.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i13.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: i13.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i13.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\">\n  <h1 class=\"mat-dialog-title\"> {{title}}\n    <button #locte mat-dialog-close class=\"modal_close\" tabindex=\"-1\" id=\"btnClose\">\n      <i class=\"fa fa-window-close\" aria-hidden=\"true\"></i>\n    </button>\n  </h1>\n  <div class=\"pad-20 image-scroll\">\n    <img style=\"width:100%;margin-top: -20px;\" [src]=\"details.url||details.s3path\" alt=\"\"\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'\n  ||details.type == 'bmp' ||details.type == 'png' ||details.type == 'gif' ||details.type == 'jpg' ||details.type == 'jpeg' ||details.type == 'webp'\" />\n    <video style=\"width:100%;height: 75vh;\" controls\n      *ngIf=\"(data.source === 'qnr' && type === 'video') || (data.source === 'mr' && details.type && details.type == 'video/mp4' || details.type == 'video/mpeg'||details.type == 'video/quicktime')\">\n      <source [src]=\"details.url\" />\n    </video>\n    <audio style=\"width:100%;\" controls\n      *ngIf=\"(data.source === 'qnr' && type === 'audio') || (data.source === 'mr' && details.type && details.type == 'audio/ogg'|| details.type == 'audio/mpeg'|| details.type == 'audio/mp3')\">\n      <source [src]=\"details.url\" />\n    </audio>\n  </div>\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]
@@ -5146,11 +5322,11 @@ class JGalleryComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: JGalleryComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1$4.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: JGalleryComponent, selector: "app-j-gallery", host: { listeners: { "document:keydown": "handleKeyboardEvent($event)" } }, ngImport: i0, template: "<div class=\"modal-overlay\" (click)=\"close()\">\n    <div class=\"modal-content\" (click)=\"$event.stopPropagation()\">\n      <button class=\"close-btn\" (click)=\"close()\">\u2716</button>\n      <img [src]=\"data.images[currentIndex]['source']\" alt=\"Gallery Image\">\n      \n      <button class=\"nav-btn prev\" *ngIf=\"currentIndex > 0\" (click)=\"prevImage()\">&#10094;</button>\n      <button class=\"nav-btn next\" *ngIf=\"currentIndex < data.images.length - 1\" (click)=\"nextImage()\">&#10095;</button>\n    </div>\n  </div>", styles: [".modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000b3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;transition:opacity .3s ease-in-out}.modal-content{position:relative;width:100vw;height:100vh;display:flex;align-items:center;justify-content:center;border-radius:10px;background:#ffffff1a;padding:10px;animation:fadeIn .3s ease-in-out}img{max-width:100%;max-height:90vh;border-radius:8px;box-shadow:0 5px 15px #0000004d}.nav-btn{position:absolute;top:50%;transform:translateY(-50%);background:#fff3;border:none;color:#fff;font-size:30px;padding:10px;cursor:pointer;border-radius:10%;transition:background .3s}.nav-btn:hover{background:#ffffff80}.prev{left:10px}.next{right:10px}.close-btn{position:absolute;top:10px;right:10px;background:red;color:#fff;border:none;font-size:20px;cursor:pointer;padding:5px 10px;border-radius:50%;transition:background .3s}.close-btn:hover{background:#8b0000}@keyframes fadeIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}\n"], dependencies: [{ kind: "directive", type: i13.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: JGalleryComponent, selector: "app-j-gallery", host: { listeners: { "document:keydown": "handleKeyboardEvent($event)" } }, ngImport: i0, template: "<div class=\"modal-overlay\" (click)=\"close()\">\r\n    <div class=\"modal-content\" (click)=\"$event.stopPropagation()\">\r\n      <button class=\"close-btn\" (click)=\"close()\">\u2716</button>\r\n      <img [src]=\"data.images[currentIndex]['source']\" alt=\"Gallery Image\">\r\n      \r\n      <button class=\"nav-btn prev\" *ngIf=\"currentIndex > 0\" (click)=\"prevImage()\">&#10094;</button>\r\n      <button class=\"nav-btn next\" *ngIf=\"currentIndex < data.images.length - 1\" (click)=\"nextImage()\">&#10095;</button>\r\n    </div>\r\n  </div>", styles: [".modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000b3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;transition:opacity .3s ease-in-out}.modal-content{position:relative;width:100vw;height:100vh;display:flex;align-items:center;justify-content:center;border-radius:10px;background:#ffffff1a;padding:10px;animation:fadeIn .3s ease-in-out}img{max-width:100%;max-height:90vh;border-radius:8px;box-shadow:0 5px 15px #0000004d}.nav-btn{position:absolute;top:50%;transform:translateY(-50%);background:#fff3;border:none;color:#fff;font-size:30px;padding:10px;cursor:pointer;border-radius:10%;transition:background .3s}.nav-btn:hover{background:#ffffff80}.prev{left:10px}.next{right:10px}.close-btn{position:absolute;top:10px;right:10px;background:red;color:#fff;border:none;font-size:20px;cursor:pointer;padding:5px 10px;border-radius:50%;transition:background .3s}.close-btn:hover{background:#8b0000}@keyframes fadeIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}\n"], dependencies: [{ kind: "directive", type: i13.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: JGalleryComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-j-gallery', template: "<div class=\"modal-overlay\" (click)=\"close()\">\n    <div class=\"modal-content\" (click)=\"$event.stopPropagation()\">\n      <button class=\"close-btn\" (click)=\"close()\">\u2716</button>\n      <img [src]=\"data.images[currentIndex]['source']\" alt=\"Gallery Image\">\n      \n      <button class=\"nav-btn prev\" *ngIf=\"currentIndex > 0\" (click)=\"prevImage()\">&#10094;</button>\n      <button class=\"nav-btn next\" *ngIf=\"currentIndex < data.images.length - 1\" (click)=\"nextImage()\">&#10095;</button>\n    </div>\n  </div>", styles: [".modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000b3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;transition:opacity .3s ease-in-out}.modal-content{position:relative;width:100vw;height:100vh;display:flex;align-items:center;justify-content:center;border-radius:10px;background:#ffffff1a;padding:10px;animation:fadeIn .3s ease-in-out}img{max-width:100%;max-height:90vh;border-radius:8px;box-shadow:0 5px 15px #0000004d}.nav-btn{position:absolute;top:50%;transform:translateY(-50%);background:#fff3;border:none;color:#fff;font-size:30px;padding:10px;cursor:pointer;border-radius:10%;transition:background .3s}.nav-btn:hover{background:#ffffff80}.prev{left:10px}.next{right:10px}.close-btn{position:absolute;top:10px;right:10px;background:red;color:#fff;border:none;font-size:20px;cursor:pointer;padding:5px 10px;border-radius:50%;transition:background .3s}.close-btn:hover{background:#8b0000}@keyframes fadeIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}\n"] }]
+            args: [{ selector: 'app-j-gallery', template: "<div class=\"modal-overlay\" (click)=\"close()\">\r\n    <div class=\"modal-content\" (click)=\"$event.stopPropagation()\">\r\n      <button class=\"close-btn\" (click)=\"close()\">\u2716</button>\r\n      <img [src]=\"data.images[currentIndex]['source']\" alt=\"Gallery Image\">\r\n      \r\n      <button class=\"nav-btn prev\" *ngIf=\"currentIndex > 0\" (click)=\"prevImage()\">&#10094;</button>\r\n      <button class=\"nav-btn next\" *ngIf=\"currentIndex < data.images.length - 1\" (click)=\"nextImage()\">&#10095;</button>\r\n    </div>\r\n  </div>", styles: [".modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000b3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;transition:opacity .3s ease-in-out}.modal-content{position:relative;width:100vw;height:100vh;display:flex;align-items:center;justify-content:center;border-radius:10px;background:#ffffff1a;padding:10px;animation:fadeIn .3s ease-in-out}img{max-width:100%;max-height:90vh;border-radius:8px;box-shadow:0 5px 15px #0000004d}.nav-btn{position:absolute;top:50%;transform:translateY(-50%);background:#fff3;border:none;color:#fff;font-size:30px;padding:10px;cursor:pointer;border-radius:10%;transition:background .3s}.nav-btn:hover{background:#ffffff80}.prev{left:10px}.next{right:10px}.close-btn{position:absolute;top:10px;right:10px;background:red;color:#fff;border:none;font-size:20px;cursor:pointer;padding:5px 10px;border-radius:50%;transition:background .3s}.close-btn:hover{background:#8b0000}@keyframes fadeIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
@@ -6510,11 +6686,11 @@ class QuestionnaireComponent {
         this.galleryService.open(this.image_list_popup, 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: JGalleryService }, { token: i13.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 }], usesOnChanges: true, ngImport: i0, template: "<section class=\"cons-inbox no-padding-small\" *ngIf=\"!showservice\">\n  <div class=\"container consumer-dashhome p-0\" *ngIf=\"!type && source!='proLead'\">\n    <div class=\"card title-gb rounded-0\" *ngIf=\"uuid\">\n      <h5 class=\"mt-2 bold\">{{questionnaire_heading | capitalizeFirst}} <a class=\"pull-left me-4 back-btn\"\n          (click)=\"goBack()\"><i class=\"fa fa-arrow-left\"></i></a></h5>\n    </div>\n  </div>\n  <app-common-innerloading-spinner *ngIf=\"loading\"></app-common-innerloading-spinner>\n  <div class=\"d-flex flex-column-fluid pull-right me-2 mb-4\"\n    *ngIf=\"type !== 'qnrLinkProvider' && !buttonDisable && waitlistStatus\">\n    <button class=\"normal-btn edit\" mat-flat-button (click)=\"editQnr()\" id=\"btnEdit\">Edit</button>\n  </div>\n  <div class=\"d-flex flex-column-fluid width-100\" [class.qnrDisableState]=\"disableInput()\"\n    [class.p-0]=\"uuid && (source === 'consCheckin' || source === 'consAppt' || source === 'consOrder' || source === 'paper' || source === 'consDonationDetails' || source === 'ivr')\">\n    <div class=\"col-xl-12 force_center\" [class.p-0]=\"uuid\" [class.no-padding-small]=\"source && source=='ivr'\">\n      <div class=\"\">\n        <div class=\"qnrsec\" *ngFor=\"let qnr of groupedQnr | keyvalue: asIsOrder\"\n          [class.section-shadow]=\"getSectionCount() > 1\" [class.no-padding-small]=\"source && source=='ivr'\">\n          <div class=\"form-group card mgn-0\" *ngFor=\"let question of qnr.value\">\n            <label class=\"col-12 quest\">{{getQuestion(question).label}}\n              <i class=\"fa fa-plus-circle pull-right\" aria-hidden=\"true\"\n                [class.addicon]=\"!buttonDisable && !disableInput()\"\n                *ngIf=\"getQuestion(question).fieldDataType === 'dataGrid' && !showDataGrid[getQuestion(question).labelName]\"\n                (click)=\"!buttonDisable && !disableInput() && showDataGridAddSection(getQuestion(question), true)\"></i>\n              <div class=\"pro-only\" *ngIf=\"showProviderText(getQuestion(question))\">For Providers</div>\n              <span class=\"red\" *ngIf=\"getQuestion(question).mandatory\">*</span>\n              <div class=\"form-level-settings\" *ngIf=\"getQuestion(question).hint\"\n                [innerHTML]=\"getQuestion(question).hint | safeHtml\">\n              </div>\n            </label>\n            <!-- for file upload -->\n            <div class=\"col-12\" *ngIf=\"getQuestion(question).fieldDataType === 'fileUpload'\">\n              <mat-select multiple #deptsel [disabled]=\"buttonDisable || disableInput()\"\n                *ngIf=\"getQuestion(question).filePropertie.maxNoOfFile > 1 && getQuestion(question).filePropertie.minNoOfFile !== getQuestion(question).filePropertie.maxNoOfFile\"\n                [(ngModel)]=\"uploadFilesTemp[getQuestion(question).labelName]\" class=\"select-box\" placeholder=\"Select\">\n                <mat-option *ngFor=\"let document of getQuestion(question).filePropertie.allowedDocuments\"\n                  [value]=\"document\" (click)=\"changeImageSelected(getQuestion(question), document)\">\n                  {{document}}</mat-option>\n              </mat-select>\n              <div class=\"col-lg-12 col-12 col-md-12 col-sm-12 p-0 mt-4\"\n                *ngIf=\"getDocuments(getQuestion(question)) && getDocuments(getQuestion(question)).length > 0\">\n                <div class=\"dropzone dropzone-default dropzone-primary dz-clickable\"\n                  [class.single-file]=\"getQuestion(question).filePropertie.allowedDocuments.length==1\"\n                  style=\"cursor: auto;\">\n                  <ng-container *ngFor=\"let doc of getDocuments(getQuestion(question))\">\n                    <div class=\"dz-preview dz-processing dz-image-preview dz-error dz-complete\"\n                      *ngIf=\"getImg(getQuestion(question), doc)\">\n                      <div class=\"docname\" *ngIf=\"getQuestion(question).filePropertie.allowedDocuments.length > 1\">\n                        {{doc}}</div>\n                      <div class=\"dzimage pointer-cursor\" (click)=\"openAttachmentGallery(getQuestion(question), doc)\">\n                        <img alt=\"\" class=\"img_fit\" [src]=\"getImg(getQuestion(question), doc)\">\n                      </div>\n                      <input [disabled]=\"buttonDisable || disableInput()\" (blur)=\"onSubmit('inputChange');\"\n                        [(ngModel)]=\"comments[getQuestion(question).labelName + '=' + doc]\">\n                      <div class=\"gal_action\" *ngIf=\"!buttonDisable && !disableInput() && mode!=='read'\"\n                        (click)=\"changeImageSelected(getQuestion(question), doc)\">\n                        <i class=\"fa fa-times-circle\" aria-hidden=\"true\"></i>\n                      </div>\n                    </div>\n                    <div class=\"dz-preview dz-processing dz-image-preview dz-error dz-complete\"\n                      (click)=\"logofile1.click()\" *ngIf=\"!getImg(getQuestion(question), doc)\">\n                      <div class=\"docname\" *ngIf=\"getQuestion(question).filePropertie.allowedDocuments.length > 1\">\n                        {{doc}}</div>\n                      <div class=\"dz-image pointer-cursor\">\n                      </div>\n                      <input #logofile1 type=\"file\" accept=\"/*;capture=camera\" style=\"display:none;\"\n                        [disabled]=\"buttonDisable || disableInput()\"\n                        (change)=\"filesSelected($event, getQuestion(question), doc)\">\n                      <div class=\"dz-error-mark\">\n                        <a class=\"btn btn-icon btn-light-success btn-circle mr-2\"><i\n                            class=\"text-dark-50 flaticon-upload\"></i></a>\n                      </div>\n                    </div>\n                  </ng-container>\n                </div>\n              </div>\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\n                {{apiError[getQuestion(question).labelName]}}</div>\n            </div>\n            <!-- for checkbox -->\n            <div class=\"col-12\"\n              *ngIf=\"getQuestion(question).fieldDataType === 'list' && getQuestion(question).listPropertie.maxAnswers > 1\">\n              <div class=\"checkbox-list\">\n                <label class=\"checkbox\" *ngFor=\"let value of getQuestion(question).labelValues\">\n                  <input type=\"checkbox\" [checked]=\"isChecked(value, getQuestion(question))\"\n                    (change)=\"listChange($event, value, getQuestion(question))\"\n                    [disabled]=\"buttonDisable || disableInput()\">\n                  <span></span>\n                  {{value}}\n                </label>\n              </div>\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\n                {{apiError[getQuestion(question).labelName]}}</div>\n            </div>\n            <!-- for radio -->\n            <div class=\"col-12\"\n              *ngIf=\"getQuestion(question).fieldDataType === 'list' && getQuestion(question).listPropertie.maxAnswers === 1\">\n              <div class=\"radio-list\">\n                <label class=\"radio\" *ngFor=\"let value of getQuestion(question).labelValues\">\n                  <input type=\"radio\" [disabled]=\"buttonDisable || disableInput()\"\n                    [checked]=\"isChecked(value, getQuestion(question))\"\n                    (change)=\"listChange($event, value, getQuestion(question))\">\n                  <span></span>\n                  {{value}}\n                </label>\n              </div>\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\n                {{apiError[getQuestion(question).labelName]}}</div>\n            </div>\n            <!-- for toggel boolean -->\n            <div class=\"col-12\" *ngIf=\"getQuestion(question).fieldDataType === 'bool'\">\n              <div class=\"radio-list\">\n                <label class=\"radio\" *ngFor=\"let value of getQuestion(question).labelValues\">\n                  <input type=\"radio\" [disabled]=\"buttonDisable || disableInput()\"\n                    [checked]=\"isBooleanChecked(value, getQuestion(question))\"\n                    (change)=\"booleanChange($event, value, getQuestion(question))\">\n                  <span></span>\n                  {{value}}\n                </label>\n              </div>\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\n                {{apiError[getQuestion(question).labelName]}}</div>\n            </div>\n            <!-- for Text -->\n            <div class=\"col-12\" *ngIf=\"getQuestion(question).fieldDataType === 'plainText'\">\n              <input *ngIf=\"getQuestion(question).plainTextPropertie.maxNoOfLetter<=100\"\n                  [(ngModel)]=\"answers[getQuestion(question).labelName]\" (input)=\"onSubmit('inputChange');\"                  \n                  [minlength]=\"getQuestion(question).plainTextPropertie.minNoOfLetter\"\n                  [maxlength]=\"getQuestion(question).plainTextPropertie.maxNoOfLetter\"\n                  class=\"form-control1 form-control-solid\" type=\"text\" [disabled]=\"buttonDisable || disableInput()\">\n                <textarea rows=\"3\" *ngIf=\"getQuestion(question).plainTextPropertie.maxNoOfLetter>100\"\n                  [(ngModel)]=\"answers[getQuestion(question).labelName]\" (input)=\"onSubmit('inputChange');\"\n                  [minlength]=\"getQuestion(question).plainTextPropertie.minNoOfLetter\"\n                  [maxlength]=\"getQuestion(question).plainTextPropertie.maxNoOfLetter\" [disabled]=\"buttonDisable || disableInput()\"\n                  class=\"form-control2 form-control-solid\"></textarea>\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\n                {{apiError[getQuestion(question).labelName]}}</div>\n            </div>\n            <!-- for Number -->\n            <div class=\"col-12\" *ngIf=\"getQuestion(question).fieldDataType === 'number'\">\n              <input [(ngModel)]=\"answers[getQuestion(question).labelName]\" (input)=\"onSubmit('inputChange');\"\n                [min]=\"getQuestion(question).numberPropertie.start\" [max]=\"getQuestion(question).numberPropertie.end\"\n                [disabled]=\"buttonDisable || disableInput()\" class=\"form-control1 form-control-solid\" type=\"number\"\n                (keypress)=\"isNumeric($event)\">\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\n                {{apiError[getQuestion(question).labelName]}}</div>\n            </div>\n            <!-- for Date -->\n            <div class=\"col-12 d-flex\" *ngIf=\"getQuestion(question).fieldDataType === 'date'\">\n              <input class=\"form-control1\" [matDatepicker]=\"picker\" [max]=\"getMaxdate(question)\"\n                [min]=\"getMindate(question)\" [(ngModel)]=\"answers[getQuestion(question).labelName]\"\n                (dateChange)=\"onSubmit('inputChange')\" [disabled]=\"buttonDisable || disableInput()\"\n                (click)=\"picker.open()\">\n              <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\n              <mat-datepicker #picker [disabled]=\"buttonDisable || disableInput()\"></mat-datepicker>\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\n                {{apiError[getQuestion(question).labelName]}}</div>\n            </div>\n            <!-- for Datagrid -->\n            <div class=\"table-responsive1\"\n              *ngIf=\"getQuestion(question).fieldDataType === 'dataGrid' && dataGridColumnsAnswerList[getQuestion(question).labelName] && dataGridColumnsAnswerList[getQuestion(question).labelName].length > 0\">\n              <table class=\"table table-head-custom table-head-bg table-borderless table-vertical-center\">\n                <thead>\n                  <th *ngFor=\"let column of getQuestion(question).dataGridProperties.dataGridColumns\">\n                    {{column.columnId}}</th>\n                  <th *ngIf=\"!buttonDisable && !disableInput() && !showDataGrid[getQuestion(question).labelName]\">\n                  </th>\n                  <th *ngIf=\"!buttonDisable && !disableInput() && !showDataGrid[getQuestion(question).labelName]\">\n                  </th>\n                </thead>\n                <tbody>\n                  <tr *ngFor=\"let column of dataGridColumnsAnswerList[getQuestion(question).labelName];let i =index\">\n                    <td *ngFor=\"let data of column | keyvalue\">\n                      <div\n                        *ngIf=\"getColumnType(getQuestion(question).dataGridProperties.dataGridColumns, data.key) === 'date'\">\n                        {{data.value | date : newTimeDateFormat}}\n                      </div>\n                      <div\n                        *ngIf=\"getColumnType(getQuestion(question).dataGridProperties.dataGridColumns, data.key) === 'bool'\">\n                        {{getBoolValue(data.value)}}\n                      </div>\n                      <div\n                        *ngIf=\"getColumnType(getQuestion(question).dataGridProperties.dataGridColumns, data.key) !== 'date' && getColumnType(getQuestion(question).dataGridProperties.dataGridColumns, data.key) !== 'bool'\">\n                        {{data.value}}\n                      </div>\n                    </td>\n                    <td *ngIf=\"!buttonDisable && !disableInput() && !showDataGrid[getQuestion(question).labelName]\">\n                      <i class=\"fa fa-pen\" (click)=\"editDataGrid(getQuestion(question), column)\"></i>\n                    </td>\n                    <td *ngIf=\"!buttonDisable && !disableInput() && !showDataGrid[getQuestion(question).labelName]\">\n                      <i class=\"fa fa-trash\" (click)=\"deleteDataGrid(getQuestion(question), column)\"></i>\n                    </td>\n                  </tr>\n                </tbody>\n              </table>\n            </div>\n            <div class=\"gridSection\" *ngIf=\"showDataGrid[getQuestion(question).labelName]\">\n              <div class=\"gridColumn\" *ngFor=\"let column of getQuestion(question).dataGridProperties.dataGridColumns\">\n                <label>{{column.label}}\n                  <span class=\"red\" *ngIf=\"column.mandatory\">*</span>\n                </label>\n                <!-- for checkbox -->\n                <div class=\"col-12\" *ngIf=\"column.dataType === 'list'\">\n                  <div class=\"checkbox-list\">\n                    <label class=\"checkbox\" *ngFor=\"let value of column.listPropertie.values\">\n                      <input type=\"checkbox\" [checked]=\"isChecked(value, getQuestion(question), column)\"\n                        (change)=\"listChange($event, value, getQuestion(question), column)\"\n                        [disabled]=\"buttonDisable || disableInput()\">\n                      <span></span>\n                      {{value}}\n                    </label>\n                  </div>\n                </div>\n                <!-- for toggel boolean -->\n                <div class=\"col-12\" *ngIf=\"column.dataType === 'bool'\">\n                  <div class=\"radio-list\">\n                    <label class=\"radio\">\n                      <input type=\"radio\" [disabled]=\"buttonDisable || disableInput()\"\n                        [checked]=\"isBooleanChecked('yes', getQuestion(question), column)\"\n                        (change)=\"booleanChange($event, 'yes', getQuestion(question), column)\">\n                      <span></span>\n                      Yes\n                    </label>\n                    <label class=\"radio\">\n                      <input type=\"radio\" [disabled]=\"buttonDisable || disableInput()\"\n                        [checked]=\"isBooleanChecked('no', getQuestion(question), column)\"\n                        (change)=\"booleanChange($event, 'no', getQuestion(question), column)\">\n                      <span></span>\n                      No\n                    </label>\n                  </div>\n                </div>\n                <!-- for Text -->\n                <div class=\"col-12\" *ngIf=\"column.dataType === 'plainText'\">\n                  <input [(ngModel)]=\"dataGridColumns[getQuestion(question).labelName + '=' + column.order]\"\n                    [disabled]=\"buttonDisable || disableInput()\" class=\"form-control1 form-control-solid\" type=\"text\">\n                </div>\n                <!-- for Number -->\n                <div class=\"col-12\" *ngIf=\"column.dataType === 'number'\">\n                  <input [(ngModel)]=\"dataGridColumns[getQuestion(question).labelName + '=' + column.order]\"\n                    [disabled]=\"buttonDisable || disableInput()\" [min]=\"column.numberPropertie.start\"\n                    [max]=\"column.numberPropertie.end\" class=\"form-control1 form-control-solid\" type=\"number\">\n                </div>\n                <!-- for Date -->\n                <div class=\"col-12 d-flex\" *ngIf=\"column.dataType === 'date'\">\n                  <input class=\"form-control1\" [matDatepicker]=\"picker\" [max]=\"getMaxdate(question)\"\n                    [min]=\"getMindate(question)\"\n                    [(ngModel)]=\"dataGridColumns[getQuestion(question).labelName + '=' + column.order]\"\n                    [disabled]=\"buttonDisable || disableInput()\" (click)=\"picker.open()\">\n                  <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\n                  <mat-datepicker #picker [disabled]=\"buttonDisable || disableInput()\">\n                  </mat-datepicker>\n                </div>\n              </div>\n              <div class=\"act-btns\">\n                <button type=\"button\" class=\"btn btn-light-primary font-weight-bold\" id=\"btnCancelQ\"\n                  (click)=\"cancelAddorUpdate(getQuestion(question))\">\n                  Cancel\n                </button>\n                <button type=\"button\" class=\"btn btn-primary font-weight-bold\" id=\"btnSaveQ\"\n                  (click)=\"saveDataGridColumn(getQuestion(question))\">Add</button>\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n      <div class=\"col-md-12 col-12 col-sm-12 col-lg-12 p-0 submit-pad\"\n        *ngIf=\"type !== 'qnrLinkProvider' && source!=='proLead' && (uuid || source === 'customer-details' || source === 'proDonation') && !disableInput()\">\n        <button class=\"normal-btn\" mat-flat-button [class.spinner]=\"buttonDisable\" id=\"btnSubmit\"\n          [class.spinner-darker-success]=\"buttonDisable\" [class.spinner-center]=\"buttonDisable\"\n          (click)=\"!buttonDisable && onSubmit('submit')\" [disabled]=\"buttonDisable\"\n          [class.disabled]=\"buttonDisable\">{{(type == 'qnr-link') ? 'Submit' : 'Update'}}</button>\n      </div>\n    </div>\n  </div>\n</section>\n<section class=\"cons-inbox no-padding-small\" *ngIf=\"showservice\">\n  <div class=\"container consumer-dashhome\" *ngIf=\"!type\">\n    <div class=\"card title-gb rounded-0\" *ngIf=\"uuid\">\n      <h5 class=\"mt-2 bold\">{{questionnaire_heading | capitalizeFirst}} <a class=\"pull-left me-4 back-btn\"\n          (click)=\"goBack()\"><i class=\"fa fa-arrow-left\"></i></a></h5>\n    </div>\n  </div>\n  <app-common-innerloading-spinner *ngIf=\"loading\"></app-common-innerloading-spinner>\n  <div class=\"d-flex flex-column-fluid pull-right me-2 mb-4\"\n    *ngIf=\"type !== 'qnrLinkProvider' && !buttonDisable && waitlistStatus\">\n    <button class=\"normal-btn edit\" mat-flat-button (click)=\"editQnr()\" id=\"btnEditQNR\">Edit</button>\n  </div>\n  <div class=\"d-flex flex-column-fluid width-100\" [class.qnrDisableState]=\"disableInput()\"\n    [class.p-0]=\"uuid && (source === 'consCheckin' || source === 'consAppt' || source === 'consDonationDetails' )\">\n    <div class=\"col-xl-12 force_center p-0\" [class.p-0]=\"uuid\"\n      [class.no-padding-small]=\"source && source=='ivr'\">\n      <div class=\"\">\n        <div class=\"\" *ngFor=\"let qnr of groupedQnr | keyvalue\" [class.section-shadow]=\"getSectionCount() > 1\">\n          <div *ngIf=\"itemArray.length == 0 \">\n            <div class=\"form-group mgn-0 border-dashed text-center\" *ngFor=\"let question of qnr.value\">\n              <div class=\"qnr-section\" *ngIf=\"getSectionCount() > 1\">\n                {{getQuestion(question).question.sectionName}}</div>\n              <label class=\"col-12 quest pointer-cursor\"\n                (click)=\"showDataGridAddSectionn(getQuestion(question).question, true)\">\n                <div>\n                  <img src=\"{{cdnPath}}assets/images/service-options.svg\" alt=\"Service Options\" class=\"img-fluid pb-0\"\n                    width=\"300\" height=\"300\">\n                </div>\n                <div class=\"pro-only\" *ngIf=\"showProviderText(getQuestion(question).question)\">For Providers</div>\n                <span class=\"red\" *ngIf=\"getQuestion(question).question.mandatory\">*</span>\n                <div>\n                  <span class=\"text-primary font-weight-bold\">Please Choose your Pet</span>\n                </div>\n                <div class=\"mt-3\">\n                  <span class=\"btn btn-light font-weight-bold\">Continue</span>\n                </div>\n              </label>\n            </div>\n          </div>\n        </div>\n        <div class=\"col-md-12 col-12 col-sm-12 mb-4 p-0\" *ngIf=\"showItem\">\n          <div>\n            <div class=\"card-border\" *ngFor=\" let items of itemArray\">\n\n              <div class=\"d-flex justify-content-between\">\n                <div>\n                  <div class=\"text-capitalize\">\n                    <div class=\"\">\n                      <span class=\"text-primary\">\n                        {{items.item}}<br>\n                      </span>\n                    </div>\n                  </div>\n                </div>\n                <div class=\"d-flex border-apply px-0\">\n                  <div (click)=\"decrement(items);\" class=\"pointer-cursor quantity quantity-1\">\n                    <span class=\"p-10\">-</span>\n                  </div>\n                  <div class=\"mx-2 pointer-cursor\"><span class=\"quantity\"\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\">\n                      {{items.columnItem[0].answer.dataGridList[0].dataGridListColumn[0].quantity}}</span>\n                  </div>\n                  <div (click)=\"increment(items);\" class=\"pointer-cursor quantity quantity-1\">\n                    <span class=\"p-10\">+</span>\n                  </div>\n                </div>\n              </div>\n              <div>\n                <span class=\"text-primary\"><span><i class=\"fa fa-inr\"></i>\n                    {{items.price * getItemQuantity(items)}}/-\n                  </span>\n                </span>\n              </div>\n            </div>\n            <div class=\"clearfix\"></div>\n            <div *ngIf=\"showItem &&itemArray.length > 0\">\n              <div *ngFor=\"let qnr of groupedQnr | keyvalue\" [class.section-shadow]=\"getSectionCount() > 1\">\n                <div *ngFor=\"let question of qnr.value\">\n                  <label class=\"col-12 quest pointer-cursor\"\n                    (click)=\"showDataGridAddSectionn(getQuestion(question).question, true)\">\n                    <span class=\"btn btn-light font-weight-bold\"><i class=\"fa fa-plus text-white\"></i>Add</span>\n                  </label>\n                </div>\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\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: i13.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i13.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: i16.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i16.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i16.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: i17.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i18.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i19.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: i13.DatePipe, name: "date" }, { kind: "pipe", type: i13.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 }], 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 d-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 d-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<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: i13.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i13.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: i16.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i16.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i16.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: i17.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i18.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i19.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: i13.DatePipe, name: "date" }, { kind: "pipe", type: i13.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\">\n  <div class=\"container consumer-dashhome p-0\" *ngIf=\"!type && source!='proLead'\">\n    <div class=\"card title-gb rounded-0\" *ngIf=\"uuid\">\n      <h5 class=\"mt-2 bold\">{{questionnaire_heading | capitalizeFirst}} <a class=\"pull-left me-4 back-btn\"\n          (click)=\"goBack()\"><i class=\"fa fa-arrow-left\"></i></a></h5>\n    </div>\n  </div>\n  <app-common-innerloading-spinner *ngIf=\"loading\"></app-common-innerloading-spinner>\n  <div class=\"d-flex flex-column-fluid pull-right me-2 mb-4\"\n    *ngIf=\"type !== 'qnrLinkProvider' && !buttonDisable && waitlistStatus\">\n    <button class=\"normal-btn edit\" mat-flat-button (click)=\"editQnr()\" id=\"btnEdit\">Edit</button>\n  </div>\n  <div class=\"d-flex flex-column-fluid width-100\" [class.qnrDisableState]=\"disableInput()\"\n    [class.p-0]=\"uuid && (source === 'consCheckin' || source === 'consAppt' || source === 'consOrder' || source === 'paper' || source === 'consDonationDetails' || source === 'ivr')\">\n    <div class=\"col-xl-12 force_center\" [class.p-0]=\"uuid\" [class.no-padding-small]=\"source && source=='ivr'\">\n      <div class=\"\">\n        <div class=\"qnrsec\" *ngFor=\"let qnr of groupedQnr | keyvalue: asIsOrder\"\n          [class.section-shadow]=\"getSectionCount() > 1\" [class.no-padding-small]=\"source && source=='ivr'\">\n          <div class=\"form-group card mgn-0\" *ngFor=\"let question of qnr.value\">\n            <label class=\"col-12 quest\">{{getQuestion(question).label}}\n              <i class=\"fa fa-plus-circle pull-right\" aria-hidden=\"true\"\n                [class.addicon]=\"!buttonDisable && !disableInput()\"\n                *ngIf=\"getQuestion(question).fieldDataType === 'dataGrid' && !showDataGrid[getQuestion(question).labelName]\"\n                (click)=\"!buttonDisable && !disableInput() && showDataGridAddSection(getQuestion(question), true)\"></i>\n              <div class=\"pro-only\" *ngIf=\"showProviderText(getQuestion(question))\">For Providers</div>\n              <span class=\"red\" *ngIf=\"getQuestion(question).mandatory\">*</span>\n              <div class=\"form-level-settings\" *ngIf=\"getQuestion(question).hint\"\n                [innerHTML]=\"getQuestion(question).hint | safeHtml\">\n              </div>\n            </label>\n            <!-- for file upload -->\n            <div class=\"col-12\" *ngIf=\"getQuestion(question).fieldDataType === 'fileUpload'\">\n              <mat-select multiple #deptsel [disabled]=\"buttonDisable || disableInput()\"\n                *ngIf=\"getQuestion(question).filePropertie.maxNoOfFile > 1 && getQuestion(question).filePropertie.minNoOfFile !== getQuestion(question).filePropertie.maxNoOfFile\"\n                [(ngModel)]=\"uploadFilesTemp[getQuestion(question).labelName]\" class=\"select-box\" placeholder=\"Select\">\n                <mat-option *ngFor=\"let document of getQuestion(question).filePropertie.allowedDocuments\"\n                  [value]=\"document\" (click)=\"changeImageSelected(getQuestion(question), document)\">\n                  {{document}}</mat-option>\n              </mat-select>\n              <div class=\"col-lg-12 col-12 col-md-12 col-sm-12 p-0 mt-4\"\n                *ngIf=\"getDocuments(getQuestion(question)) && getDocuments(getQuestion(question)).length > 0\">\n                <div class=\"dropzone dropzone-default dropzone-primary dz-clickable\"\n                  [class.single-file]=\"getQuestion(question).filePropertie.allowedDocuments.length==1\"\n                  style=\"cursor: auto;\">\n                  <ng-container *ngFor=\"let doc of getDocuments(getQuestion(question))\">\n                    <div class=\"dz-preview dz-processing dz-image-preview dz-error dz-complete\"\n                      *ngIf=\"getImg(getQuestion(question), doc)\">\n                      <div class=\"docname\" *ngIf=\"getQuestion(question).filePropertie.allowedDocuments.length > 1\">\n                        {{doc}}</div>\n                      <div class=\"dzimage pointer-cursor\" (click)=\"openAttachmentGallery(getQuestion(question), doc)\">\n                        <img alt=\"\" class=\"img_fit\" [src]=\"getImg(getQuestion(question), doc)\">\n                      </div>\n                      <input [disabled]=\"buttonDisable || disableInput()\" (blur)=\"onSubmit('inputChange');\"\n                        [(ngModel)]=\"comments[getQuestion(question).labelName + '=' + doc]\">\n                      <div class=\"gal_action\" *ngIf=\"!buttonDisable && !disableInput() && mode!=='read'\"\n                        (click)=\"changeImageSelected(getQuestion(question), doc)\">\n                        <i class=\"fa fa-times-circle\" aria-hidden=\"true\"></i>\n                      </div>\n                    </div>\n                    <div class=\"dz-preview dz-processing dz-image-preview dz-error dz-complete\"\n                      (click)=\"logofile1.click()\" *ngIf=\"!getImg(getQuestion(question), doc)\">\n                      <div class=\"docname\" *ngIf=\"getQuestion(question).filePropertie.allowedDocuments.length > 1\">\n                        {{doc}}</div>\n                      <div class=\"dz-image pointer-cursor\">\n                      </div>\n                      <input #logofile1 type=\"file\" accept=\"/*;capture=camera\" style=\"display:none;\"\n                        [disabled]=\"buttonDisable || disableInput()\"\n                        (change)=\"filesSelected($event, getQuestion(question), doc)\">\n                      <div class=\"dz-error-mark\">\n                        <a class=\"btn btn-icon btn-light-success btn-circle mr-2\"><i\n                            class=\"text-dark-50 flaticon-upload\"></i></a>\n                      </div>\n                    </div>\n                  </ng-container>\n                </div>\n              </div>\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\n                {{apiError[getQuestion(question).labelName]}}</div>\n            </div>\n            <!-- for checkbox -->\n            <div class=\"col-12\"\n              *ngIf=\"getQuestion(question).fieldDataType === 'list' && getQuestion(question).listPropertie.maxAnswers > 1\">\n              <div class=\"checkbox-list\">\n                <label class=\"checkbox\" *ngFor=\"let value of getQuestion(question).labelValues\">\n                  <input type=\"checkbox\" [checked]=\"isChecked(value, getQuestion(question))\"\n                    (change)=\"listChange($event, value, getQuestion(question))\"\n                    [disabled]=\"buttonDisable || disableInput()\">\n                  <span></span>\n                  {{value}}\n                </label>\n              </div>\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\n                {{apiError[getQuestion(question).labelName]}}</div>\n            </div>\n            <!-- for radio -->\n            <div class=\"col-12\"\n              *ngIf=\"getQuestion(question).fieldDataType === 'list' && getQuestion(question).listPropertie.maxAnswers === 1\">\n              <div class=\"radio-list\">\n                <label class=\"radio\" *ngFor=\"let value of getQuestion(question).labelValues\">\n                  <input type=\"radio\" [disabled]=\"buttonDisable || disableInput()\"\n                    [checked]=\"isChecked(value, getQuestion(question))\"\n                    (change)=\"listChange($event, value, getQuestion(question))\">\n                  <span></span>\n                  {{value}}\n                </label>\n              </div>\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\n                {{apiError[getQuestion(question).labelName]}}</div>\n            </div>\n            <!-- for toggel boolean -->\n            <div class=\"col-12\" *ngIf=\"getQuestion(question).fieldDataType === 'bool'\">\n              <div class=\"radio-list\">\n                <label class=\"radio\" *ngFor=\"let value of getQuestion(question).labelValues\">\n                  <input type=\"radio\" [disabled]=\"buttonDisable || disableInput()\"\n                    [checked]=\"isBooleanChecked(value, getQuestion(question))\"\n                    (change)=\"booleanChange($event, value, getQuestion(question))\">\n                  <span></span>\n                  {{value}}\n                </label>\n              </div>\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\n                {{apiError[getQuestion(question).labelName]}}</div>\n            </div>\n            <!-- for Text -->\n            <div class=\"col-12\" *ngIf=\"getQuestion(question).fieldDataType === 'plainText'\">\n              <input *ngIf=\"getQuestion(question).plainTextPropertie.maxNoOfLetter<=100\"\n                  [(ngModel)]=\"answers[getQuestion(question).labelName]\" (input)=\"onSubmit('inputChange');\"                  \n                  [minlength]=\"getQuestion(question).plainTextPropertie.minNoOfLetter\"\n                  [maxlength]=\"getQuestion(question).plainTextPropertie.maxNoOfLetter\"\n                  class=\"form-control1 form-control-solid\" type=\"text\" [disabled]=\"buttonDisable || disableInput()\">\n                <textarea rows=\"3\" *ngIf=\"getQuestion(question).plainTextPropertie.maxNoOfLetter>100\"\n                  [(ngModel)]=\"answers[getQuestion(question).labelName]\" (input)=\"onSubmit('inputChange');\"\n                  [minlength]=\"getQuestion(question).plainTextPropertie.minNoOfLetter\"\n                  [maxlength]=\"getQuestion(question).plainTextPropertie.maxNoOfLetter\" [disabled]=\"buttonDisable || disableInput()\"\n                  class=\"form-control2 form-control-solid\"></textarea>\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\n                {{apiError[getQuestion(question).labelName]}}</div>\n            </div>\n            <!-- for Number -->\n            <div class=\"col-12\" *ngIf=\"getQuestion(question).fieldDataType === 'number'\">\n              <input [(ngModel)]=\"answers[getQuestion(question).labelName]\" (input)=\"onSubmit('inputChange');\"\n                [min]=\"getQuestion(question).numberPropertie.start\" [max]=\"getQuestion(question).numberPropertie.end\"\n                [disabled]=\"buttonDisable || disableInput()\" class=\"form-control1 form-control-solid\" type=\"number\"\n                (keypress)=\"isNumeric($event)\">\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\n                {{apiError[getQuestion(question).labelName]}}</div>\n            </div>\n            <!-- for Date -->\n            <div class=\"col-12 d-flex\" *ngIf=\"getQuestion(question).fieldDataType === 'date'\">\n              <input class=\"form-control1\" [matDatepicker]=\"picker\" [max]=\"getMaxdate(question)\"\n                [min]=\"getMindate(question)\" [(ngModel)]=\"answers[getQuestion(question).labelName]\"\n                (dateChange)=\"onSubmit('inputChange')\" [disabled]=\"buttonDisable || disableInput()\"\n                (click)=\"picker.open()\">\n              <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\n              <mat-datepicker #picker [disabled]=\"buttonDisable || disableInput()\"></mat-datepicker>\n              <div class=\"mt-2 text-danger\" *ngIf=\"apiError[getQuestion(question).labelName]\">\n                {{apiError[getQuestion(question).labelName]}}</div>\n            </div>\n            <!-- for Datagrid -->\n            <div class=\"table-responsive1\"\n              *ngIf=\"getQuestion(question).fieldDataType === 'dataGrid' && dataGridColumnsAnswerList[getQuestion(question).labelName] && dataGridColumnsAnswerList[getQuestion(question).labelName].length > 0\">\n              <table class=\"table table-head-custom table-head-bg table-borderless table-vertical-center\">\n                <thead>\n                  <th *ngFor=\"let column of getQuestion(question).dataGridProperties.dataGridColumns\">\n                    {{column.columnId}}</th>\n                  <th *ngIf=\"!buttonDisable && !disableInput() && !showDataGrid[getQuestion(question).labelName]\">\n                  </th>\n                  <th *ngIf=\"!buttonDisable && !disableInput() && !showDataGrid[getQuestion(question).labelName]\">\n                  </th>\n                </thead>\n                <tbody>\n                  <tr *ngFor=\"let column of dataGridColumnsAnswerList[getQuestion(question).labelName];let i =index\">\n                    <td *ngFor=\"let data of column | keyvalue\">\n                      <div\n                        *ngIf=\"getColumnType(getQuestion(question).dataGridProperties.dataGridColumns, data.key) === 'date'\">\n                        {{data.value | date : newTimeDateFormat}}\n                      </div>\n                      <div\n                        *ngIf=\"getColumnType(getQuestion(question).dataGridProperties.dataGridColumns, data.key) === 'bool'\">\n                        {{getBoolValue(data.value)}}\n                      </div>\n                      <div\n                        *ngIf=\"getColumnType(getQuestion(question).dataGridProperties.dataGridColumns, data.key) !== 'date' && getColumnType(getQuestion(question).dataGridProperties.dataGridColumns, data.key) !== 'bool'\">\n                        {{data.value}}\n                      </div>\n                    </td>\n                    <td *ngIf=\"!buttonDisable && !disableInput() && !showDataGrid[getQuestion(question).labelName]\">\n                      <i class=\"fa fa-pen\" (click)=\"editDataGrid(getQuestion(question), column)\"></i>\n                    </td>\n                    <td *ngIf=\"!buttonDisable && !disableInput() && !showDataGrid[getQuestion(question).labelName]\">\n                      <i class=\"fa fa-trash\" (click)=\"deleteDataGrid(getQuestion(question), column)\"></i>\n                    </td>\n                  </tr>\n                </tbody>\n              </table>\n            </div>\n            <div class=\"gridSection\" *ngIf=\"showDataGrid[getQuestion(question).labelName]\">\n              <div class=\"gridColumn\" *ngFor=\"let column of getQuestion(question).dataGridProperties.dataGridColumns\">\n                <label>{{column.label}}\n                  <span class=\"red\" *ngIf=\"column.mandatory\">*</span>\n                </label>\n                <!-- for checkbox -->\n                <div class=\"col-12\" *ngIf=\"column.dataType === 'list'\">\n                  <div class=\"checkbox-list\">\n                    <label class=\"checkbox\" *ngFor=\"let value of column.listPropertie.values\">\n                      <input type=\"checkbox\" [checked]=\"isChecked(value, getQuestion(question), column)\"\n                        (change)=\"listChange($event, value, getQuestion(question), column)\"\n                        [disabled]=\"buttonDisable || disableInput()\">\n                      <span></span>\n                      {{value}}\n                    </label>\n                  </div>\n                </div>\n                <!-- for toggel boolean -->\n                <div class=\"col-12\" *ngIf=\"column.dataType === 'bool'\">\n                  <div class=\"radio-list\">\n                    <label class=\"radio\">\n                      <input type=\"radio\" [disabled]=\"buttonDisable || disableInput()\"\n                        [checked]=\"isBooleanChecked('yes', getQuestion(question), column)\"\n                        (change)=\"booleanChange($event, 'yes', getQuestion(question), column)\">\n                      <span></span>\n                      Yes\n                    </label>\n                    <label class=\"radio\">\n                      <input type=\"radio\" [disabled]=\"buttonDisable || disableInput()\"\n                        [checked]=\"isBooleanChecked('no', getQuestion(question), column)\"\n                        (change)=\"booleanChange($event, 'no', getQuestion(question), column)\">\n                      <span></span>\n                      No\n                    </label>\n                  </div>\n                </div>\n                <!-- for Text -->\n                <div class=\"col-12\" *ngIf=\"column.dataType === 'plainText'\">\n                  <input [(ngModel)]=\"dataGridColumns[getQuestion(question).labelName + '=' + column.order]\"\n                    [disabled]=\"buttonDisable || disableInput()\" class=\"form-control1 form-control-solid\" type=\"text\">\n                </div>\n                <!-- for Number -->\n                <div class=\"col-12\" *ngIf=\"column.dataType === 'number'\">\n                  <input [(ngModel)]=\"dataGridColumns[getQuestion(question).labelName + '=' + column.order]\"\n                    [disabled]=\"buttonDisable || disableInput()\" [min]=\"column.numberPropertie.start\"\n                    [max]=\"column.numberPropertie.end\" class=\"form-control1 form-control-solid\" type=\"number\">\n                </div>\n                <!-- for Date -->\n                <div class=\"col-12 d-flex\" *ngIf=\"column.dataType === 'date'\">\n                  <input class=\"form-control1\" [matDatepicker]=\"picker\" [max]=\"getMaxdate(question)\"\n                    [min]=\"getMindate(question)\"\n                    [(ngModel)]=\"dataGridColumns[getQuestion(question).labelName + '=' + column.order]\"\n                    [disabled]=\"buttonDisable || disableInput()\" (click)=\"picker.open()\">\n                  <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\n                  <mat-datepicker #picker [disabled]=\"buttonDisable || disableInput()\">\n                  </mat-datepicker>\n                </div>\n              </div>\n              <div class=\"act-btns\">\n                <button type=\"button\" class=\"btn btn-light-primary font-weight-bold\" id=\"btnCancelQ\"\n                  (click)=\"cancelAddorUpdate(getQuestion(question))\">\n                  Cancel\n                </button>\n                <button type=\"button\" class=\"btn btn-primary font-weight-bold\" id=\"btnSaveQ\"\n                  (click)=\"saveDataGridColumn(getQuestion(question))\">Add</button>\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n      <div class=\"col-md-12 col-12 col-sm-12 col-lg-12 p-0 submit-pad\"\n        *ngIf=\"type !== 'qnrLinkProvider' && source!=='proLead' && (uuid || source === 'customer-details' || source === 'proDonation') && !disableInput()\">\n        <button class=\"normal-btn\" mat-flat-button [class.spinner]=\"buttonDisable\" id=\"btnSubmit\"\n          [class.spinner-darker-success]=\"buttonDisable\" [class.spinner-center]=\"buttonDisable\"\n          (click)=\"!buttonDisable && onSubmit('submit')\" [disabled]=\"buttonDisable\"\n          [class.disabled]=\"buttonDisable\">{{(type == 'qnr-link') ? 'Submit' : 'Update'}}</button>\n      </div>\n    </div>\n  </div>\n</section>\n<section class=\"cons-inbox no-padding-small\" *ngIf=\"showservice\">\n  <div class=\"container consumer-dashhome\" *ngIf=\"!type\">\n    <div class=\"card title-gb rounded-0\" *ngIf=\"uuid\">\n      <h5 class=\"mt-2 bold\">{{questionnaire_heading | capitalizeFirst}} <a class=\"pull-left me-4 back-btn\"\n          (click)=\"goBack()\"><i class=\"fa fa-arrow-left\"></i></a></h5>\n    </div>\n  </div>\n  <app-common-innerloading-spinner *ngIf=\"loading\"></app-common-innerloading-spinner>\n  <div class=\"d-flex flex-column-fluid pull-right me-2 mb-4\"\n    *ngIf=\"type !== 'qnrLinkProvider' && !buttonDisable && waitlistStatus\">\n    <button class=\"normal-btn edit\" mat-flat-button (click)=\"editQnr()\" id=\"btnEditQNR\">Edit</button>\n  </div>\n  <div class=\"d-flex flex-column-fluid width-100\" [class.qnrDisableState]=\"disableInput()\"\n    [class.p-0]=\"uuid && (source === 'consCheckin' || source === 'consAppt' || source === 'consDonationDetails' )\">\n    <div class=\"col-xl-12 force_center p-0\" [class.p-0]=\"uuid\"\n      [class.no-padding-small]=\"source && source=='ivr'\">\n      <div class=\"\">\n        <div class=\"\" *ngFor=\"let qnr of groupedQnr | keyvalue\" [class.section-shadow]=\"getSectionCount() > 1\">\n          <div *ngIf=\"itemArray.length == 0 \">\n            <div class=\"form-group mgn-0 border-dashed text-center\" *ngFor=\"let question of qnr.value\">\n              <div class=\"qnr-section\" *ngIf=\"getSectionCount() > 1\">\n                {{getQuestion(question).question.sectionName}}</div>\n              <label class=\"col-12 quest pointer-cursor\"\n                (click)=\"showDataGridAddSectionn(getQuestion(question).question, true)\">\n                <div>\n                  <img src=\"{{cdnPath}}assets/images/service-options.svg\" alt=\"Service Options\" class=\"img-fluid pb-0\"\n                    width=\"300\" height=\"300\">\n                </div>\n                <div class=\"pro-only\" *ngIf=\"showProviderText(getQuestion(question).question)\">For Providers</div>\n                <span class=\"red\" *ngIf=\"getQuestion(question).question.mandatory\">*</span>\n                <div>\n                  <span class=\"text-primary font-weight-bold\">Please Choose your Pet</span>\n                </div>\n                <div class=\"mt-3\">\n                  <span class=\"btn btn-light font-weight-bold\">Continue</span>\n                </div>\n              </label>\n            </div>\n          </div>\n        </div>\n        <div class=\"col-md-12 col-12 col-sm-12 mb-4 p-0\" *ngIf=\"showItem\">\n          <div>\n            <div class=\"card-border\" *ngFor=\" let items of itemArray\">\n\n              <div class=\"d-flex justify-content-between\">\n                <div>\n                  <div class=\"text-capitalize\">\n                    <div class=\"\">\n                      <span class=\"text-primary\">\n                        {{items.item}}<br>\n                      </span>\n                    </div>\n                  </div>\n                </div>\n                <div class=\"d-flex border-apply px-0\">\n                  <div (click)=\"decrement(items);\" class=\"pointer-cursor quantity quantity-1\">\n                    <span class=\"p-10\">-</span>\n                  </div>\n                  <div class=\"mx-2 pointer-cursor\"><span class=\"quantity\"\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\">\n                      {{items.columnItem[0].answer.dataGridList[0].dataGridListColumn[0].quantity}}</span>\n                  </div>\n                  <div (click)=\"increment(items);\" class=\"pointer-cursor quantity quantity-1\">\n                    <span class=\"p-10\">+</span>\n                  </div>\n                </div>\n              </div>\n              <div>\n                <span class=\"text-primary\"><span><i class=\"fa fa-inr\"></i>\n                    {{items.price * getItemQuantity(items)}}/-\n                  </span>\n                </span>\n              </div>\n            </div>\n            <div class=\"clearfix\"></div>\n            <div *ngIf=\"showItem &&itemArray.length > 0\">\n              <div *ngFor=\"let qnr of groupedQnr | keyvalue\" [class.section-shadow]=\"getSectionCount() > 1\">\n                <div *ngFor=\"let question of qnr.value\">\n                  <label class=\"col-12 quest pointer-cursor\"\n                    (click)=\"showDataGridAddSectionn(getQuestion(question).question, true)\">\n                    <span class=\"btn btn-light font-weight-bold\"><i class=\"fa fa-plus text-white\"></i>Add</span>\n                  </label>\n                </div>\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\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 d-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 d-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<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: JGalleryService }, { type: i13.Location }], propDecorators: { questionnaireList: [{
                 type: Input
             }], source: [{
@@ -6754,7 +6930,7 @@ class PhoneInputComponent {
                 useExisting: forwardRef(() => PhoneInputComponent),
                 multi: true
             }
-        ], viewQueries: [{ propertyName: "phoneInput", first: true, predicate: ["phoneInput"], descendants: true }, { propertyName: "ngModelRef", first: true, predicate: NgModel, descendants: true }], ngImport: i0, template: "<div class=\"phone-input-wrapper tel-input-container\">\n    <input #phoneInput type=\"tel\" [(ngModel)]=\"phoneNumber.number\"\n        name=\"phoneNumber\" [required]=\"true\" #phone=\"ngModel\"\n        [ngClass]=\"{'is-invalid': !validatePhoneNumber() && phone.touched}\">\n\n    <!-- Validation feedback -->\n    <!-- <div *ngIf=\"!validatePhoneNumber() && phone.touched\" class=\"text-danger\">\n        Invalid phone number.\n    </div> -->\n</div>", styles: ["::ng-deep .tel-input-container .iti{width:100%!important}::ng-deep .tel-input-container .iti--separate-dial-code .iti__selected-flag{background-color:transparent}::ng-deep .tel-input-container input::-webkit-input-placeholder{color:#ddd}::ng-deep .tel-input-container input:focus{outline:none;border-color:#e1e2e3}::ng-deep .tel-input-container input{height:40px;width:100%;background:#fff;border:1.39032px solid #E1E2E3;border-radius:4px;padding:15px;font-size:15px}::ng-deep .tel-input-container input.is-invalid{border:1.39032px solid #ff0000}::ng-deep .tel-input-container input::placeholder{color:#ddd}::ng-deep .tel-input-container input.custom:focus{color:#495057;background-color:#fff;border-color:#3c8dbc;outline:0;box-shadow:0 0 #fff}::ng-deep .tel-input-container .iti__country-list{z-index:3}\n"], dependencies: [{ kind: "directive", type: i13.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
+        ], viewQueries: [{ propertyName: "phoneInput", first: true, predicate: ["phoneInput"], descendants: true }, { propertyName: "ngModelRef", first: true, predicate: NgModel, descendants: true }], ngImport: i0, template: "<div class=\"phone-input-wrapper tel-input-container\">\r\n    <input #phoneInput type=\"tel\" [(ngModel)]=\"phoneNumber.number\"\r\n        name=\"phoneNumber\" [required]=\"true\" #phone=\"ngModel\"\r\n        [ngClass]=\"{'is-invalid': !validatePhoneNumber() && phone.touched}\">\r\n\r\n    <!-- Validation feedback -->\r\n    <!-- <div *ngIf=\"!validatePhoneNumber() && phone.touched\" class=\"text-danger\">\r\n        Invalid phone number.\r\n    </div> -->\r\n</div>", styles: ["::ng-deep .tel-input-container .iti{width:100%!important}::ng-deep .tel-input-container .iti--separate-dial-code .iti__selected-flag{background-color:transparent}::ng-deep .tel-input-container input::-webkit-input-placeholder{color:#ddd}::ng-deep .tel-input-container input:focus{outline:none;border-color:#e1e2e3}::ng-deep .tel-input-container input{height:40px;width:100%;background:#fff;border:1.39032px solid #E1E2E3;border-radius:4px;padding:15px;font-size:15px}::ng-deep .tel-input-container input.is-invalid{border:1.39032px solid #ff0000}::ng-deep .tel-input-container input::placeholder{color:#ddd}::ng-deep .tel-input-container input.custom:focus{color:#495057;background-color:#fff;border-color:#3c8dbc;outline:0;box-shadow:0 0 #fff}::ng-deep .tel-input-container .iti__country-list{z-index:3}\n"], dependencies: [{ kind: "directive", type: i13.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PhoneInputComponent, decorators: [{
             type: Component,
@@ -6764,7 +6940,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                             useExisting: forwardRef(() => PhoneInputComponent),
                             multi: true
                         }
-                    ], template: "<div class=\"phone-input-wrapper tel-input-container\">\n    <input #phoneInput type=\"tel\" [(ngModel)]=\"phoneNumber.number\"\n        name=\"phoneNumber\" [required]=\"true\" #phone=\"ngModel\"\n        [ngClass]=\"{'is-invalid': !validatePhoneNumber() && phone.touched}\">\n\n    <!-- Validation feedback -->\n    <!-- <div *ngIf=\"!validatePhoneNumber() && phone.touched\" class=\"text-danger\">\n        Invalid phone number.\n    </div> -->\n</div>", styles: ["::ng-deep .tel-input-container .iti{width:100%!important}::ng-deep .tel-input-container .iti--separate-dial-code .iti__selected-flag{background-color:transparent}::ng-deep .tel-input-container input::-webkit-input-placeholder{color:#ddd}::ng-deep .tel-input-container input:focus{outline:none;border-color:#e1e2e3}::ng-deep .tel-input-container input{height:40px;width:100%;background:#fff;border:1.39032px solid #E1E2E3;border-radius:4px;padding:15px;font-size:15px}::ng-deep .tel-input-container input.is-invalid{border:1.39032px solid #ff0000}::ng-deep .tel-input-container input::placeholder{color:#ddd}::ng-deep .tel-input-container input.custom:focus{color:#495057;background-color:#fff;border-color:#3c8dbc;outline:0;box-shadow:0 0 #fff}::ng-deep .tel-input-container .iti__country-list{z-index:3}\n"] }]
+                    ], template: "<div class=\"phone-input-wrapper tel-input-container\">\r\n    <input #phoneInput type=\"tel\" [(ngModel)]=\"phoneNumber.number\"\r\n        name=\"phoneNumber\" [required]=\"true\" #phone=\"ngModel\"\r\n        [ngClass]=\"{'is-invalid': !validatePhoneNumber() && phone.touched}\">\r\n\r\n    <!-- Validation feedback -->\r\n    <!-- <div *ngIf=\"!validatePhoneNumber() && phone.touched\" class=\"text-danger\">\r\n        Invalid phone number.\r\n    </div> -->\r\n</div>", styles: ["::ng-deep .tel-input-container .iti{width:100%!important}::ng-deep .tel-input-container .iti--separate-dial-code .iti__selected-flag{background-color:transparent}::ng-deep .tel-input-container input::-webkit-input-placeholder{color:#ddd}::ng-deep .tel-input-container input:focus{outline:none;border-color:#e1e2e3}::ng-deep .tel-input-container input{height:40px;width:100%;background:#fff;border:1.39032px solid #E1E2E3;border-radius:4px;padding:15px;font-size:15px}::ng-deep .tel-input-container input.is-invalid{border:1.39032px solid #ff0000}::ng-deep .tel-input-container input::placeholder{color:#ddd}::ng-deep .tel-input-container input.custom:focus{color:#495057;background-color:#fff;border-color:#3c8dbc;outline:0;box-shadow:0 0 #fff}::ng-deep .tel-input-container .iti__country-list{z-index:3}\n"] }]
         }], propDecorators: { initialCountry: [{
                 type: Input
             }], preferredCountries: [{
@@ -6873,11 +7049,11 @@ class PaymentModesComponent {
         this.modeSelected.emit(event);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PaymentModesComponent, deps: [{ token: SharedService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: PaymentModesComponent, selector: "app-payment-modes", inputs: { cashPay: "cashPay", paymentModes: "paymentModes" }, outputs: { modeSelected: "modeSelected" }, ngImport: i0, template: "<mat-radio-group class=\"text-center mx-auto payment-mode-fw\" name=\"paymentMode\" (change)=\"paymentModeSelected($event)\">\n    <div *ngFor=\"let modes of paymentModes\">\n        <mat-radio-button class=\"pay-rad mt-1 ml-auto\" [value]=\"modes.mode\" >\n            <div>\n                <div>\n                    <img class=\"pay-icons\" [src]=\"getImageSrc(modes.mode)\" alt=\"\">\n                </div>\n                <div class=\"modeName\">\n                    <div *ngIf=\"modes.modeDisplayName === 'UPI'\">                      \n                        <div>{{modes.modeDisplayName |uppercase }}</div>\n                    </div>\n                    <div *ngIf=\"modes.modeDisplayName === 'Credit Card'\">\n                        <div>{{modes.modeDisplayName |uppercase }}</div>\n                    </div>\n                    <div *ngIf=\"modes.modeDisplayName === 'Debit Card'\">\n                       <div> {{modes.modeDisplayName |uppercase }}</div>\n                    </div>\n                    <div *ngIf=\"modes.modeDisplayName === 'Net Banking'\">\n                       <div> {{modes.modeDisplayName |uppercase }}</div>\n                    </div>\n                    <div *ngIf=\"modes.modeDisplayName === 'Wallet'\">\n                       <div> {{modes.modeDisplayName |uppercase }} </div>\n                    </div>\n                    <div *ngIf=\"modes.mode === 'PAYLATER'\">\n                       <div> {{modes.modeDisplayName |uppercase }} </div>\n                    </div>                   \n                </div>\n            </div>\n        </mat-radio-button>        \n    </div>\n    <div>\n        <mat-radio-button class=\"pay-rad mt-1 ml-auto\" [value]=\"'cash'\" *ngIf=\"cashPay\">\n            <div class=\"clearfix\"></div>\n            <div class=\"col-12 p-0 pay-mode \">\n                <div class=\"d-flex\">\n                    <img class=\"pay-icons\" [src]=\"getImageSrc('PAYCASH')\" alt=\"\">\n                </div>\n                <div class=\"col-12 p-0 text-center\">\n                    Pay by Cash\n                </div>\n            </div>\n        </mat-radio-button>\n    </div>\n</mat-radio-group>", styles: [".pay-rad{width:26.5%;height:100px;float:left;border:1px solid #ddd;border-radius:10px;margin:5px;font-size:10px}.pay-icons{height:50px;object-fit:scale-down!important;margin-top:5px;width:100%}::ng-deep mat-radio-button.pay-rad .mat-mdc-radio-checked{box-shadow:0 4px 8px #0000001a,0 6px 20px #0000!important;background:#f1ffff!important;border:1.25px solid #45C3D3!important;border-radius:5px!important}@media (max-width: 768px){.pay-rad{width:30%;height:100%}}@media (min-width: 768px) and (max-width: 856px){.pay-rad{width:30%;height:120px}}.font-weight-normal{font-weight:400!important}@media (max-width: 768px){.font-weight-normal{font-weight:400!important;font-size:13px!important}}::ng-deep .pay-rad .mat-radio-outer-circle,::ng-deep .pay-rad .mat-radio-inner-circle{height:15px!important;width:15px!important}::ng-deep .pay-rad .mat-radio-label{display:block!important}::ng-deep .pay-rad .mat-radio-container{display:block!important;top:5px!important;right:5px;float:right}.modeName{font-size:12px;font-weight:600}::ng-deep .payment-mode-fw .mdc-form-field{flex-direction:row-reverse}@media (max-width: 575px){::ng-deep .payment-mode-fw mat-radio-button.pay-rad .mdc-form-field{flex-direction:column!important}.pay-icons{margin-top:-5px!important}}@media (max-width: 575px){::ng-deep .payment-mode-fw .mat-mdc-radio-button .mdc-radio{margin-right:-70px!important}}@media (min-width: 576px) and (max-width: 767px){::ng-deep .payment-mode-fw .mat-mdc-radio-button .mdc-radio{margin-right:-35px!important}}\n"], dependencies: [{ kind: "directive", type: i13.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i13.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i3.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "pipe", type: i13.UpperCasePipe, name: "uppercase" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: PaymentModesComponent, selector: "app-payment-modes", inputs: { cashPay: "cashPay", paymentModes: "paymentModes" }, outputs: { modeSelected: "modeSelected" }, ngImport: i0, template: "<mat-radio-group class=\"text-center mx-auto payment-mode-fw\" name=\"paymentMode\" (change)=\"paymentModeSelected($event)\">\r\n    <div *ngFor=\"let modes of paymentModes\">\r\n        <mat-radio-button class=\"pay-rad mt-1 ml-auto\" [value]=\"modes.mode\" >\r\n            <div>\r\n                <div>\r\n                    <img class=\"pay-icons\" [src]=\"getImageSrc(modes.mode)\" alt=\"\">\r\n                </div>\r\n                <div class=\"modeName\">\r\n                    <div *ngIf=\"modes.modeDisplayName === 'UPI'\">                      \r\n                        <div>{{modes.modeDisplayName |uppercase }}</div>\r\n                    </div>\r\n                    <div *ngIf=\"modes.modeDisplayName === 'Credit Card'\">\r\n                        <div>{{modes.modeDisplayName |uppercase }}</div>\r\n                    </div>\r\n                    <div *ngIf=\"modes.modeDisplayName === 'Debit Card'\">\r\n                       <div> {{modes.modeDisplayName |uppercase }}</div>\r\n                    </div>\r\n                    <div *ngIf=\"modes.modeDisplayName === 'Net Banking'\">\r\n                       <div> {{modes.modeDisplayName |uppercase }}</div>\r\n                    </div>\r\n                    <div *ngIf=\"modes.modeDisplayName === 'Wallet'\">\r\n                       <div> {{modes.modeDisplayName |uppercase }} </div>\r\n                    </div>\r\n                    <div *ngIf=\"modes.mode === 'PAYLATER'\">\r\n                       <div> {{modes.modeDisplayName |uppercase }} </div>\r\n                    </div>                   \r\n                </div>\r\n            </div>\r\n        </mat-radio-button>        \r\n    </div>\r\n    <div>\r\n        <mat-radio-button class=\"pay-rad mt-1 ml-auto\" [value]=\"'cash'\" *ngIf=\"cashPay\">\r\n            <div class=\"clearfix\"></div>\r\n            <div class=\"col-12 p-0 pay-mode \">\r\n                <div class=\"d-flex\">\r\n                    <img class=\"pay-icons\" [src]=\"getImageSrc('PAYCASH')\" alt=\"\">\r\n                </div>\r\n                <div class=\"col-12 p-0 text-center\">\r\n                    Pay by Cash\r\n                </div>\r\n            </div>\r\n        </mat-radio-button>\r\n    </div>\r\n</mat-radio-group>", styles: [".pay-rad{width:26.5%;height:100px;float:left;border:1px solid #ddd;border-radius:10px;margin:5px;font-size:10px}.pay-icons{height:50px;object-fit:scale-down!important;margin-top:5px;width:100%}::ng-deep mat-radio-button.pay-rad .mat-mdc-radio-checked{box-shadow:0 4px 8px #0000001a,0 6px 20px #0000!important;background:#f1ffff!important;border:1.25px solid #45C3D3!important;border-radius:5px!important}@media (max-width: 768px){.pay-rad{width:30%;height:100%}}@media (min-width: 768px) and (max-width: 856px){.pay-rad{width:30%;height:120px}}.font-weight-normal{font-weight:400!important}@media (max-width: 768px){.font-weight-normal{font-weight:400!important;font-size:13px!important}}::ng-deep .pay-rad .mat-radio-outer-circle,::ng-deep .pay-rad .mat-radio-inner-circle{height:15px!important;width:15px!important}::ng-deep .pay-rad .mat-radio-label{display:block!important}::ng-deep .pay-rad .mat-radio-container{display:block!important;top:5px!important;right:5px;float:right}.modeName{font-size:12px;font-weight:600}::ng-deep .payment-mode-fw .mdc-form-field{flex-direction:row-reverse}@media (max-width: 575px){::ng-deep .payment-mode-fw mat-radio-button.pay-rad .mdc-form-field{flex-direction:column!important}.pay-icons{margin-top:-5px!important}}@media (max-width: 575px){::ng-deep .payment-mode-fw .mat-mdc-radio-button .mdc-radio{margin-right:-70px!important}}@media (min-width: 576px) and (max-width: 767px){::ng-deep .payment-mode-fw .mat-mdc-radio-button .mdc-radio{margin-right:-35px!important}}\n"], dependencies: [{ kind: "directive", type: i13.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i13.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i3.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "pipe", type: i13.UpperCasePipe, name: "uppercase" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PaymentModesComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-payment-modes', template: "<mat-radio-group class=\"text-center mx-auto payment-mode-fw\" name=\"paymentMode\" (change)=\"paymentModeSelected($event)\">\n    <div *ngFor=\"let modes of paymentModes\">\n        <mat-radio-button class=\"pay-rad mt-1 ml-auto\" [value]=\"modes.mode\" >\n            <div>\n                <div>\n                    <img class=\"pay-icons\" [src]=\"getImageSrc(modes.mode)\" alt=\"\">\n                </div>\n                <div class=\"modeName\">\n                    <div *ngIf=\"modes.modeDisplayName === 'UPI'\">                      \n                        <div>{{modes.modeDisplayName |uppercase }}</div>\n                    </div>\n                    <div *ngIf=\"modes.modeDisplayName === 'Credit Card'\">\n                        <div>{{modes.modeDisplayName |uppercase }}</div>\n                    </div>\n                    <div *ngIf=\"modes.modeDisplayName === 'Debit Card'\">\n                       <div> {{modes.modeDisplayName |uppercase }}</div>\n                    </div>\n                    <div *ngIf=\"modes.modeDisplayName === 'Net Banking'\">\n                       <div> {{modes.modeDisplayName |uppercase }}</div>\n                    </div>\n                    <div *ngIf=\"modes.modeDisplayName === 'Wallet'\">\n                       <div> {{modes.modeDisplayName |uppercase }} </div>\n                    </div>\n                    <div *ngIf=\"modes.mode === 'PAYLATER'\">\n                       <div> {{modes.modeDisplayName |uppercase }} </div>\n                    </div>                   \n                </div>\n            </div>\n        </mat-radio-button>        \n    </div>\n    <div>\n        <mat-radio-button class=\"pay-rad mt-1 ml-auto\" [value]=\"'cash'\" *ngIf=\"cashPay\">\n            <div class=\"clearfix\"></div>\n            <div class=\"col-12 p-0 pay-mode \">\n                <div class=\"d-flex\">\n                    <img class=\"pay-icons\" [src]=\"getImageSrc('PAYCASH')\" alt=\"\">\n                </div>\n                <div class=\"col-12 p-0 text-center\">\n                    Pay by Cash\n                </div>\n            </div>\n        </mat-radio-button>\n    </div>\n</mat-radio-group>", styles: [".pay-rad{width:26.5%;height:100px;float:left;border:1px solid #ddd;border-radius:10px;margin:5px;font-size:10px}.pay-icons{height:50px;object-fit:scale-down!important;margin-top:5px;width:100%}::ng-deep mat-radio-button.pay-rad .mat-mdc-radio-checked{box-shadow:0 4px 8px #0000001a,0 6px 20px #0000!important;background:#f1ffff!important;border:1.25px solid #45C3D3!important;border-radius:5px!important}@media (max-width: 768px){.pay-rad{width:30%;height:100%}}@media (min-width: 768px) and (max-width: 856px){.pay-rad{width:30%;height:120px}}.font-weight-normal{font-weight:400!important}@media (max-width: 768px){.font-weight-normal{font-weight:400!important;font-size:13px!important}}::ng-deep .pay-rad .mat-radio-outer-circle,::ng-deep .pay-rad .mat-radio-inner-circle{height:15px!important;width:15px!important}::ng-deep .pay-rad .mat-radio-label{display:block!important}::ng-deep .pay-rad .mat-radio-container{display:block!important;top:5px!important;right:5px;float:right}.modeName{font-size:12px;font-weight:600}::ng-deep .payment-mode-fw .mdc-form-field{flex-direction:row-reverse}@media (max-width: 575px){::ng-deep .payment-mode-fw mat-radio-button.pay-rad .mdc-form-field{flex-direction:column!important}.pay-icons{margin-top:-5px!important}}@media (max-width: 575px){::ng-deep .payment-mode-fw .mat-mdc-radio-button .mdc-radio{margin-right:-70px!important}}@media (min-width: 576px) and (max-width: 767px){::ng-deep .payment-mode-fw .mat-mdc-radio-button .mdc-radio{margin-right:-35px!important}}\n"] }]
+            args: [{ selector: 'app-payment-modes', template: "<mat-radio-group class=\"text-center mx-auto payment-mode-fw\" name=\"paymentMode\" (change)=\"paymentModeSelected($event)\">\r\n    <div *ngFor=\"let modes of paymentModes\">\r\n        <mat-radio-button class=\"pay-rad mt-1 ml-auto\" [value]=\"modes.mode\" >\r\n            <div>\r\n                <div>\r\n                    <img class=\"pay-icons\" [src]=\"getImageSrc(modes.mode)\" alt=\"\">\r\n                </div>\r\n                <div class=\"modeName\">\r\n                    <div *ngIf=\"modes.modeDisplayName === 'UPI'\">                      \r\n                        <div>{{modes.modeDisplayName |uppercase }}</div>\r\n                    </div>\r\n                    <div *ngIf=\"modes.modeDisplayName === 'Credit Card'\">\r\n                        <div>{{modes.modeDisplayName |uppercase }}</div>\r\n                    </div>\r\n                    <div *ngIf=\"modes.modeDisplayName === 'Debit Card'\">\r\n                       <div> {{modes.modeDisplayName |uppercase }}</div>\r\n                    </div>\r\n                    <div *ngIf=\"modes.modeDisplayName === 'Net Banking'\">\r\n                       <div> {{modes.modeDisplayName |uppercase }}</div>\r\n                    </div>\r\n                    <div *ngIf=\"modes.modeDisplayName === 'Wallet'\">\r\n                       <div> {{modes.modeDisplayName |uppercase }} </div>\r\n                    </div>\r\n                    <div *ngIf=\"modes.mode === 'PAYLATER'\">\r\n                       <div> {{modes.modeDisplayName |uppercase }} </div>\r\n                    </div>                   \r\n                </div>\r\n            </div>\r\n        </mat-radio-button>        \r\n    </div>\r\n    <div>\r\n        <mat-radio-button class=\"pay-rad mt-1 ml-auto\" [value]=\"'cash'\" *ngIf=\"cashPay\">\r\n            <div class=\"clearfix\"></div>\r\n            <div class=\"col-12 p-0 pay-mode \">\r\n                <div class=\"d-flex\">\r\n                    <img class=\"pay-icons\" [src]=\"getImageSrc('PAYCASH')\" alt=\"\">\r\n                </div>\r\n                <div class=\"col-12 p-0 text-center\">\r\n                    Pay by Cash\r\n                </div>\r\n            </div>\r\n        </mat-radio-button>\r\n    </div>\r\n</mat-radio-group>", styles: [".pay-rad{width:26.5%;height:100px;float:left;border:1px solid #ddd;border-radius:10px;margin:5px;font-size:10px}.pay-icons{height:50px;object-fit:scale-down!important;margin-top:5px;width:100%}::ng-deep mat-radio-button.pay-rad .mat-mdc-radio-checked{box-shadow:0 4px 8px #0000001a,0 6px 20px #0000!important;background:#f1ffff!important;border:1.25px solid #45C3D3!important;border-radius:5px!important}@media (max-width: 768px){.pay-rad{width:30%;height:100%}}@media (min-width: 768px) and (max-width: 856px){.pay-rad{width:30%;height:120px}}.font-weight-normal{font-weight:400!important}@media (max-width: 768px){.font-weight-normal{font-weight:400!important;font-size:13px!important}}::ng-deep .pay-rad .mat-radio-outer-circle,::ng-deep .pay-rad .mat-radio-inner-circle{height:15px!important;width:15px!important}::ng-deep .pay-rad .mat-radio-label{display:block!important}::ng-deep .pay-rad .mat-radio-container{display:block!important;top:5px!important;right:5px;float:right}.modeName{font-size:12px;font-weight:600}::ng-deep .payment-mode-fw .mdc-form-field{flex-direction:row-reverse}@media (max-width: 575px){::ng-deep .payment-mode-fw mat-radio-button.pay-rad .mdc-form-field{flex-direction:column!important}.pay-icons{margin-top:-5px!important}}@media (max-width: 575px){::ng-deep .payment-mode-fw .mat-mdc-radio-button .mdc-radio{margin-right:-70px!important}}@media (min-width: 576px) and (max-width: 767px){::ng-deep .payment-mode-fw .mat-mdc-radio-button .mdc-radio{margin-right:-35px!important}}\n"] }]
         }], ctorParameters: () => [{ type: SharedService }], propDecorators: { cashPay: [{
                 type: Input
             }], paymentModes: [{
@@ -6940,11 +7116,11 @@ class RequestDialogComponent {
         this.dialogRef.close('success');
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RequestDialogComponent, deps: [{ token: i1$4.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: RequestDialogComponent, selector: "app-request-dialog", ngImport: i0, template: "<h1 class=\"mat-dialog-title head\" *ngIf=\"mode==='b-cam'\">\n    Your camera is blocked\n</h1>\n<h1 class=\"mat-dialog-title\" *ngIf=\"mode==='b-both'\">\n    Camera and microphone are blocked\n</h1>\n<h1 class=\"mat-dialog-title\" *ngIf=\"mode==='b-mic'\">\n    Your microphone are blocked\n</h1>\n<h1 class=\"mat-dialog-title\" *ngIf=\"mode==='sys-mic'\">\n    No audio devices found\n</h1>\n<h1 class=\"mat-dialog-title\" *ngIf=\"mode==='sys-cam'\">\n    No video devices found\n</h1>\n<h1 class=\"mat-dialog-title\" *ngIf=\"mode==='sys-both'\">\n    No audio/video devices found\n</h1>\n<div mat-dialog-content class=\"text-container\">\n    <div class=\"col-md-12 no-padding text-content\" *ngIf=\"mode==='b-both' || mode==='b-cam' || mode==='b-mic'\">\n        <div class=\"col-md-12 mgn-bt-20 no-padding text-content-text\">\n            Jaldee Videocall requires access to your camera/microphone so that other participants can hear/see\n            you.\n\n            To unblock,\n\n            <ul>\n                <li>\n                    Make sure you close any applications in your system that currently uses your microphone/camera.\n                </li>\n                <li style=\"list-style: none !important; margin-top: 10px;margin-bottom: 10px;\">Or</li>\n                <li>\n                    Click the camera blocked icon on your browser's address bar, allow access and refresh your page.\n                </li>\n                <li style=\"list-style: none !important; margin-top: 10px;margin-bottom: 10px;\">Or</li>\n                <li>\n                    Allow access to your microphone/camera in your in your App settings.\n                </li>\n            </ul>\n        </div>\n        <div class=\"col-md-12 no-padding\">\n            <a class=\"pull-right dismiss-action\" (click)=\"dismissModal()\">Dismiss</a>\n        </div>\n    </div>\n    <div class=\"col-md-12 no-padding text-content\" *ngIf=\"mode==='sys-both'\">\n        <div class=\"col-md-12 mgn-bt-20 no-padding text-content-text\">\n            Jaldee Videocall requires access to your camera and microphone so that other participants can see and hear\n            you, but no audio/video devices found.\n        </div>\n        <div class=\"col-md-12 no-padding\">\n            <a class=\"pull-right dismiss-action\" (click)=\"dismissModal()\">Dismiss</a>\n        </div>\n    </div>\n    <div class=\"col-md-12 no-padding text-content\" *ngIf=\"mode==='sys-cam'\">\n        <div class=\"col-md-12 mgn-bt-20 no-padding text-content-text\">\n            Jaldee Videocall requires access to your camera so that other participants can hear\n            you, but no video devices found.\n        </div>\n        <div class=\"col-md-12 no-padding\">\n            <a class=\"pull-right dismiss-action\" (click)=\"dismissModal()\">Dismiss</a>\n        </div>\n    </div>\n    <div class=\"col-md-12 no-padding text-content\" *ngIf=\"mode==='sys-mic'\">\n        <div class=\"col-md-12 mgn-bt-20 no-padding text-content-text\">\n            Jaldee Videocall requires access to your microphone so that other participants can hear\n            you but no audio devices found.\n        </div>\n        <div class=\"col-md-12 no-padding\">\n            <a class=\"pull-right dismiss-action\" (click)=\"dismissModal()\">Dismiss</a>\n        </div>\n    </div>\n</div>", styles: ["h1.mat-dialog-title,.head{font-size:1.3rem!important}.text-content{font-size:1.25rem!important;line-height:1.5!important;letter-spacing:.1px!important;text-align:justify!important}.text-container{padding:25px!important;font-size:1.25rem!important}.text-container div{font-size:1rem!important;color:#0000008a!important}a.dismiss-action{font-size:1rem!important;font-weight:600!important}\n"], dependencies: [{ kind: "directive", type: i1$4.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i13.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: RequestDialogComponent, selector: "app-request-dialog", ngImport: i0, template: "<h1 class=\"mat-dialog-title head\" *ngIf=\"mode==='b-cam'\">\r\n    Your camera is blocked\r\n</h1>\r\n<h1 class=\"mat-dialog-title\" *ngIf=\"mode==='b-both'\">\r\n    Camera and microphone are blocked\r\n</h1>\r\n<h1 class=\"mat-dialog-title\" *ngIf=\"mode==='b-mic'\">\r\n    Your microphone are blocked\r\n</h1>\r\n<h1 class=\"mat-dialog-title\" *ngIf=\"mode==='sys-mic'\">\r\n    No audio devices found\r\n</h1>\r\n<h1 class=\"mat-dialog-title\" *ngIf=\"mode==='sys-cam'\">\r\n    No video devices found\r\n</h1>\r\n<h1 class=\"mat-dialog-title\" *ngIf=\"mode==='sys-both'\">\r\n    No audio/video devices found\r\n</h1>\r\n<div mat-dialog-content class=\"text-container\">\r\n    <div class=\"col-md-12 no-padding text-content\" *ngIf=\"mode==='b-both' || mode==='b-cam' || mode==='b-mic'\">\r\n        <div class=\"col-md-12 mgn-bt-20 no-padding text-content-text\">\r\n            Jaldee Videocall requires access to your camera/microphone so that other participants can hear/see\r\n            you.\r\n\r\n            To unblock,\r\n\r\n            <ul>\r\n                <li>\r\n                    Make sure you close any applications in your system that currently uses your microphone/camera.\r\n                </li>\r\n                <li style=\"list-style: none !important; margin-top: 10px;margin-bottom: 10px;\">Or</li>\r\n                <li>\r\n                    Click the camera blocked icon on your browser's address bar, allow access and refresh your page.\r\n                </li>\r\n                <li style=\"list-style: none !important; margin-top: 10px;margin-bottom: 10px;\">Or</li>\r\n                <li>\r\n                    Allow access to your microphone/camera in your in your App settings.\r\n                </li>\r\n            </ul>\r\n        </div>\r\n        <div class=\"col-md-12 no-padding\">\r\n            <a class=\"pull-right dismiss-action\" (click)=\"dismissModal()\">Dismiss</a>\r\n        </div>\r\n    </div>\r\n    <div class=\"col-md-12 no-padding text-content\" *ngIf=\"mode==='sys-both'\">\r\n        <div class=\"col-md-12 mgn-bt-20 no-padding text-content-text\">\r\n            Jaldee Videocall requires access to your camera and microphone so that other participants can see and hear\r\n            you, but no audio/video devices found.\r\n        </div>\r\n        <div class=\"col-md-12 no-padding\">\r\n            <a class=\"pull-right dismiss-action\" (click)=\"dismissModal()\">Dismiss</a>\r\n        </div>\r\n    </div>\r\n    <div class=\"col-md-12 no-padding text-content\" *ngIf=\"mode==='sys-cam'\">\r\n        <div class=\"col-md-12 mgn-bt-20 no-padding text-content-text\">\r\n            Jaldee Videocall requires access to your camera so that other participants can hear\r\n            you, but no video devices found.\r\n        </div>\r\n        <div class=\"col-md-12 no-padding\">\r\n            <a class=\"pull-right dismiss-action\" (click)=\"dismissModal()\">Dismiss</a>\r\n        </div>\r\n    </div>\r\n    <div class=\"col-md-12 no-padding text-content\" *ngIf=\"mode==='sys-mic'\">\r\n        <div class=\"col-md-12 mgn-bt-20 no-padding text-content-text\">\r\n            Jaldee Videocall requires access to your microphone so that other participants can hear\r\n            you but no audio devices found.\r\n        </div>\r\n        <div class=\"col-md-12 no-padding\">\r\n            <a class=\"pull-right dismiss-action\" (click)=\"dismissModal()\">Dismiss</a>\r\n        </div>\r\n    </div>\r\n</div>", styles: ["h1.mat-dialog-title,.head{font-size:1.3rem!important}.text-content{font-size:1.25rem!important;line-height:1.5!important;letter-spacing:.1px!important;text-align:justify!important}.text-container{padding:25px!important;font-size:1.25rem!important}.text-container div{font-size:1rem!important;color:#0000008a!important}a.dismiss-action{font-size:1rem!important;font-weight:600!important}\n"], dependencies: [{ kind: "directive", type: i1$4.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i13.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RequestDialogComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-request-dialog', template: "<h1 class=\"mat-dialog-title head\" *ngIf=\"mode==='b-cam'\">\n    Your camera is blocked\n</h1>\n<h1 class=\"mat-dialog-title\" *ngIf=\"mode==='b-both'\">\n    Camera and microphone are blocked\n</h1>\n<h1 class=\"mat-dialog-title\" *ngIf=\"mode==='b-mic'\">\n    Your microphone are blocked\n</h1>\n<h1 class=\"mat-dialog-title\" *ngIf=\"mode==='sys-mic'\">\n    No audio devices found\n</h1>\n<h1 class=\"mat-dialog-title\" *ngIf=\"mode==='sys-cam'\">\n    No video devices found\n</h1>\n<h1 class=\"mat-dialog-title\" *ngIf=\"mode==='sys-both'\">\n    No audio/video devices found\n</h1>\n<div mat-dialog-content class=\"text-container\">\n    <div class=\"col-md-12 no-padding text-content\" *ngIf=\"mode==='b-both' || mode==='b-cam' || mode==='b-mic'\">\n        <div class=\"col-md-12 mgn-bt-20 no-padding text-content-text\">\n            Jaldee Videocall requires access to your camera/microphone so that other participants can hear/see\n            you.\n\n            To unblock,\n\n            <ul>\n                <li>\n                    Make sure you close any applications in your system that currently uses your microphone/camera.\n                </li>\n                <li style=\"list-style: none !important; margin-top: 10px;margin-bottom: 10px;\">Or</li>\n                <li>\n                    Click the camera blocked icon on your browser's address bar, allow access and refresh your page.\n                </li>\n                <li style=\"list-style: none !important; margin-top: 10px;margin-bottom: 10px;\">Or</li>\n                <li>\n                    Allow access to your microphone/camera in your in your App settings.\n                </li>\n            </ul>\n        </div>\n        <div class=\"col-md-12 no-padding\">\n            <a class=\"pull-right dismiss-action\" (click)=\"dismissModal()\">Dismiss</a>\n        </div>\n    </div>\n    <div class=\"col-md-12 no-padding text-content\" *ngIf=\"mode==='sys-both'\">\n        <div class=\"col-md-12 mgn-bt-20 no-padding text-content-text\">\n            Jaldee Videocall requires access to your camera and microphone so that other participants can see and hear\n            you, but no audio/video devices found.\n        </div>\n        <div class=\"col-md-12 no-padding\">\n            <a class=\"pull-right dismiss-action\" (click)=\"dismissModal()\">Dismiss</a>\n        </div>\n    </div>\n    <div class=\"col-md-12 no-padding text-content\" *ngIf=\"mode==='sys-cam'\">\n        <div class=\"col-md-12 mgn-bt-20 no-padding text-content-text\">\n            Jaldee Videocall requires access to your camera so that other participants can hear\n            you, but no video devices found.\n        </div>\n        <div class=\"col-md-12 no-padding\">\n            <a class=\"pull-right dismiss-action\" (click)=\"dismissModal()\">Dismiss</a>\n        </div>\n    </div>\n    <div class=\"col-md-12 no-padding text-content\" *ngIf=\"mode==='sys-mic'\">\n        <div class=\"col-md-12 mgn-bt-20 no-padding text-content-text\">\n            Jaldee Videocall requires access to your microphone so that other participants can hear\n            you but no audio devices found.\n        </div>\n        <div class=\"col-md-12 no-padding\">\n            <a class=\"pull-right dismiss-action\" (click)=\"dismissModal()\">Dismiss</a>\n        </div>\n    </div>\n</div>", styles: ["h1.mat-dialog-title,.head{font-size:1.3rem!important}.text-content{font-size:1.25rem!important;line-height:1.5!important;letter-spacing:.1px!important;text-align:justify!important}.text-container{padding:25px!important;font-size:1.25rem!important}.text-container div{font-size:1rem!important;color:#0000008a!important}a.dismiss-action{font-size:1rem!important;font-weight:600!important}\n"] }]
+            args: [{ selector: 'app-request-dialog', template: "<h1 class=\"mat-dialog-title head\" *ngIf=\"mode==='b-cam'\">\r\n    Your camera is blocked\r\n</h1>\r\n<h1 class=\"mat-dialog-title\" *ngIf=\"mode==='b-both'\">\r\n    Camera and microphone are blocked\r\n</h1>\r\n<h1 class=\"mat-dialog-title\" *ngIf=\"mode==='b-mic'\">\r\n    Your microphone are blocked\r\n</h1>\r\n<h1 class=\"mat-dialog-title\" *ngIf=\"mode==='sys-mic'\">\r\n    No audio devices found\r\n</h1>\r\n<h1 class=\"mat-dialog-title\" *ngIf=\"mode==='sys-cam'\">\r\n    No video devices found\r\n</h1>\r\n<h1 class=\"mat-dialog-title\" *ngIf=\"mode==='sys-both'\">\r\n    No audio/video devices found\r\n</h1>\r\n<div mat-dialog-content class=\"text-container\">\r\n    <div class=\"col-md-12 no-padding text-content\" *ngIf=\"mode==='b-both' || mode==='b-cam' || mode==='b-mic'\">\r\n        <div class=\"col-md-12 mgn-bt-20 no-padding text-content-text\">\r\n            Jaldee Videocall requires access to your camera/microphone so that other participants can hear/see\r\n            you.\r\n\r\n            To unblock,\r\n\r\n            <ul>\r\n                <li>\r\n                    Make sure you close any applications in your system that currently uses your microphone/camera.\r\n                </li>\r\n                <li style=\"list-style: none !important; margin-top: 10px;margin-bottom: 10px;\">Or</li>\r\n                <li>\r\n                    Click the camera blocked icon on your browser's address bar, allow access and refresh your page.\r\n                </li>\r\n                <li style=\"list-style: none !important; margin-top: 10px;margin-bottom: 10px;\">Or</li>\r\n                <li>\r\n                    Allow access to your microphone/camera in your in your App settings.\r\n                </li>\r\n            </ul>\r\n        </div>\r\n        <div class=\"col-md-12 no-padding\">\r\n            <a class=\"pull-right dismiss-action\" (click)=\"dismissModal()\">Dismiss</a>\r\n        </div>\r\n    </div>\r\n    <div class=\"col-md-12 no-padding text-content\" *ngIf=\"mode==='sys-both'\">\r\n        <div class=\"col-md-12 mgn-bt-20 no-padding text-content-text\">\r\n            Jaldee Videocall requires access to your camera and microphone so that other participants can see and hear\r\n            you, but no audio/video devices found.\r\n        </div>\r\n        <div class=\"col-md-12 no-padding\">\r\n            <a class=\"pull-right dismiss-action\" (click)=\"dismissModal()\">Dismiss</a>\r\n        </div>\r\n    </div>\r\n    <div class=\"col-md-12 no-padding text-content\" *ngIf=\"mode==='sys-cam'\">\r\n        <div class=\"col-md-12 mgn-bt-20 no-padding text-content-text\">\r\n            Jaldee Videocall requires access to your camera so that other participants can hear\r\n            you, but no video devices found.\r\n        </div>\r\n        <div class=\"col-md-12 no-padding\">\r\n            <a class=\"pull-right dismiss-action\" (click)=\"dismissModal()\">Dismiss</a>\r\n        </div>\r\n    </div>\r\n    <div class=\"col-md-12 no-padding text-content\" *ngIf=\"mode==='sys-mic'\">\r\n        <div class=\"col-md-12 mgn-bt-20 no-padding text-content-text\">\r\n            Jaldee Videocall requires access to your microphone so that other participants can hear\r\n            you but no audio devices found.\r\n        </div>\r\n        <div class=\"col-md-12 no-padding\">\r\n            <a class=\"pull-right dismiss-action\" (click)=\"dismissModal()\">Dismiss</a>\r\n        </div>\r\n    </div>\r\n</div>", styles: ["h1.mat-dialog-title,.head{font-size:1.3rem!important}.text-content{font-size:1.25rem!important;line-height:1.5!important;letter-spacing:.1px!important;text-align:justify!important}.text-container{padding:25px!important;font-size:1.25rem!important}.text-container div{font-size:1rem!important;color:#0000008a!important}a.dismiss-action{font-size:1rem!important;font-weight:600!important}\n"] }]
         }], ctorParameters: () => [{ type: i1$4.MatDialogRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
@@ -7533,5 +7709,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, FilterPipeModule, FormMessageDisplayModule, FormMessageDisplayService, FormSuccessDisplayComponent, GroupStorageService, HttpLoaderFactory, I8nModule, JGalleryComponent, JGalleryModule, JGalleryService, LoadingSpinnerComponent, LoadingSpinnerModule, LocalStorageService, MediaService, Messages, OrderService, PaymentModesComponent, PaymentModesModule, PaymentsModule, PaytmService, PhoneInputComponent, PhoneInputModule, QuestionaireService, QuestionnaireComponent, QuestionnaireModule, RazorpayService, RequestDialogComponent, RequestDialogModule, SafeHtmlModule, SafeHtmlPipe, ServiceMeta, SessionStorageService, SharedAccountGuard, SharedAccountResolver, SharedService, ShortFileNameModule, ShortFileNamePipe, ShowuploadfileComponent, ShowuploadfileModule, SkeletonLoadingComponent, SkeletonLoadingModule, StorageService, SubscriptionService, ThemeService, TimezoneConverter, ToastService, TruncateModule, TruncatePipe, TwilioService, WordProcessor, loadRemoteModuleWithCache, projectConstantsLocal, setupInjectionContextForLoadChildren };
+export { AccountService, AuthService, AutolinkPipe, AutolinkPipeModule, BookingService, CapitalizeFirstPipe, CapitalizeFirstPipeModule, CommonService, ConfirmBoxComponent, ConfirmBoxModule, ConsumerService, CurrencyService, DateFormatPipe, DateFormatPipeModule, DateTimeProcessor, EnvironmentService, ErrorMessagingService, ErrrorMessageModule, FieldErrorDisplayComponent, FileService, FilterPipe, FilterPipeModule, FormMessageDisplayModule, FormMessageDisplayService, FormSuccessDisplayComponent, GroupStorageService, HttpLoaderFactory, I8nModule, JGalleryComponent, JGalleryModule, JGalleryService, JaldeeTimeService, LoadingSpinnerComponent, LoadingSpinnerModule, LocalStorageService, MediaService, Messages, OrderService, PaymentModesComponent, PaymentModesModule, PaymentsModule, PaytmService, PhoneInputComponent, PhoneInputModule, QuestionaireService, QuestionnaireComponent, QuestionnaireModule, RazorpayService, RequestDialogComponent, RequestDialogModule, SafeHtmlModule, SafeHtmlPipe, ServiceMeta, SessionStorageService, SharedAccountGuard, SharedAccountResolver, SharedService, ShortFileNameModule, ShortFileNamePipe, ShowuploadfileComponent, ShowuploadfileModule, SkeletonLoadingComponent, SkeletonLoadingModule, StorageService, SubscriptionService, ThemeService, TimezoneConverter, ToastService, TruncateModule, TruncatePipe, TwilioService, WordProcessor, loadRemoteModuleWithCache, projectConstantsLocal, setupInjectionContextForLoadChildren };
 //# sourceMappingURL=jconsumer-shared.mjs.map