tango-app-ui-analyse-trax 3.6.2-bulktask-8 → 3.6.2-bulktask-9

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 (13) hide show
  1. package/esm2022/lib/components/add-multitask/add-multitask.component.mjs +3 -3
  2. package/esm2022/lib/components/add-multitask/bulkcreationmodel/bulkcreationmodel.component.mjs +18 -40
  3. package/esm2022/lib/components/gallery/gallery.component.mjs +20 -11
  4. package/esm2022/lib/services/trax.service.mjs +4 -1
  5. package/fesm2022/{tango-app-ui-analyse-trax-eye-test-audit.module-BpJbNOps.mjs → tango-app-ui-analyse-trax-eye-test-audit.module-DjDVouY5.mjs} +2 -2
  6. package/fesm2022/{tango-app-ui-analyse-trax-eye-test-audit.module-BpJbNOps.mjs.map → tango-app-ui-analyse-trax-eye-test-audit.module-DjDVouY5.mjs.map} +1 -1
  7. package/fesm2022/{tango-app-ui-analyse-trax-tango-app-ui-analyse-trax-CeNuiihn.mjs → tango-app-ui-analyse-trax-tango-app-ui-analyse-trax-fgU4Z8FP.mjs} +43 -53
  8. package/fesm2022/tango-app-ui-analyse-trax-tango-app-ui-analyse-trax-fgU4Z8FP.mjs.map +1 -0
  9. package/fesm2022/tango-app-ui-analyse-trax.mjs +1 -1
  10. package/lib/components/add-multitask/bulkcreationmodel/bulkcreationmodel.component.d.ts +1 -0
  11. package/lib/services/trax.service.d.ts +1 -0
  12. package/package.json +1 -1
  13. package/fesm2022/tango-app-ui-analyse-trax-tango-app-ui-analyse-trax-CeNuiihn.mjs.map +0 -1
package/fesm2022/{tango-app-ui-analyse-trax-tango-app-ui-analyse-trax-CeNuiihn.mjs → tango-app-ui-analyse-trax-tango-app-ui-analyse-trax-fgU4Z8FP.mjs} RENAMED
@@ -582,6 +582,9 @@ class TraxService {
582
582
  activityLogList(data) {
583
583
  return this.http.post(`${this.activitylogUrl}/listLog`, data);
584
584
  }
585
+ downloadtemplate(data) {
586
+ return this.http.post(`${this.galleryApiUrl}/exportTemplate`, data, { responseType: 'arraybuffer' });
587
+ }
585
588
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TraxService, deps: [{ token: i1$1.HttpClient }, { token: i2$2.GlobalStateService }], target: i0.ɵɵFactoryTarget.Injectable });
586
589
  static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TraxService, providedIn: 'root' });
587
590
  }
@@ -9197,11 +9200,11 @@ class AddMultitaskComponent {
9197
9200
  this.destroy$.complete();
9198
9201
  }
9199
9202
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AddMultitaskComponent, deps: [{ token: i1.FormBuilder }, { token: i2.NgbActiveModal }, { token: i2$2.GlobalStateService }, { token: TraxService }, { token: i0.ChangeDetectorRef }, { token: i2.NgbModal }, { token: i1$2.Router }, { token: i3.ToastService }], target: i0.ɵɵFactoryTarget.Component });
9200
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: AddMultitaskComponent, selector: "lib-add-multitask", inputs: { type: "type", sourceCheckList_id: "sourceCheckList_id", filtertype: "filtertype", showcomment: "showcomment", excelData: "excelData", payload: "payload", taskDetails: "taskDetails", checklistInfo: "checklistInfo" }, host: { listeners: { "document:click": "closeDropdown($event)" } }, viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], ngImport: i0, template: "<div class=\"card group-delete py-0\">\r\n <div *ngIf=\"type ==='task'\" class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"modal-header px-0 py-5 \">\r\n <div class=\"symbol symbol-75px symbol-circle d-flex\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M30 18H22C21.4696 18 20.9609 18.2107 20.5858 18.5858C20.2107 18.9609 20 19.4696 20 20V36C20 36.5304 20.2107 37.0391 20.5858 37.4142C20.9609 37.7893 21.4696 38 22 38H34C34.5304 38 35.0391 37.7893 35.4142 37.4142C35.7893 37.0391 36 36.5304 36 36V24M30 18L36 24M30 18V24H36M28 34V28M25 31H31\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <h3 class=\"text-capitalize mx-3 mt-5\"> {{type}}</h3>\r\n\r\n </div>\r\n </div>\r\n\r\n <div class=\"modal-body scroll-y w-100 p-1 scroll custom-scroll\">\r\n <form [formGroup]=\"taskForm\">\r\n <ng-container *ngFor=\"let section of getSections?.controls; let i = index\">\r\n <ng-container [formGroup]=\"section\">\r\n <ng-container *ngFor=\"let question of getQuestions(i)?.controls; let j = index\">\r\n <ng-container [formGroup]=\"question\">\r\n <div class=\"fv-row mb-3 fv-plugins-icon-container\">\r\n <div class=\"text-gray-600\">This Task is linked to </div>\r\n <div class=\"d-flex mt-3\">\r\n <div>Checklist Name :</div>\r\n <div>\r\n <h4> {{payload.checklistName}}</h4>\r\n </div>\r\n </div>\r\n <div class=\"d-flex mt-3\">\r\n <div>Question :</div>\r\n <div><span class=\"text-wrap\"> {{question.get('qno')?.value}}.\r\n {{question.get('qname')?.value}}</span></div>\r\n </div>\r\n <div class=\"d-flex mt-3 mb-3\" *ngIf=\"payload.coverage==='store'\">\r\n <div>Stores Selected :</div>\r\n <div>\r\n <h4>{{payload.selectedStores.length}} stores</h4>\r\n </div>\r\n </div>\r\n <div class=\"d-flex mt-3 mb-3\" *ngIf=\"payload.coverage==='user'\">\r\n <div>users Selected :</div>\r\n <div>\r\n <h4>{{payload.selectedUsers.length}} users</h4>\r\n </div>\r\n </div>\r\n <label class=\"label-name my-2\">\r\n Task Name<span class=\"text-danger\">*</span>\r\n </label>\r\n <input [formControl]=\"taskForm.controls.checklistName\" type=\"text\"\r\n placeholder=\"Enter Task Name\" class=\"form-control mb-5\">\r\n <div\r\n class=\"fv-plugins-message-container fv-plugins-message-container--enabled invalid-feedback\">\r\n </div>\r\n </div>\r\n\r\n\r\n\r\n <!-- <div class=\"row px-5\" *ngIf=\"payload.inputData.answerType==='video'\">\r\n \r\n <div class=\"carousel\">\r\n <div class=\"carousel-inner\">\r\n <div\r\n class=\"carousel-item\"\r\n *ngFor=\"let group of payload.refImage; let i = index\"\r\n [class.active]=\"i === currentIndex\"\r\n >\r\n <div class=\"row\">\r\n \r\n <img src=\"{{environment.TraxAnswerCDN}}{{group}}\"\r\n class=\"image-thumb mb-8 d-block w-100 cursor-pointer\"\r\n alt=\"Image {{ i + 1 }}\" />\r\n </div>\r\n </div>\r\n </div>\r\n <button class=\"carousel-control-prev\" *ngIf=\"currentIndex > 0\" (click)=\"prevSlide()\">\r\n <span class=\"carousel-control-prev-icon\"></span>\r\n </button>\r\n \r\n <button class=\"carousel-control-next\" *ngIf=\"currentIndex < payload.refImage.length - 1\" (click)=\"nextSlide()\">\r\n <span class=\"carousel-control-next-icon\"></span>\r\n </button>\r\n \r\n <div *ngIf=\"payload.refImage.length > 1\" class=\"row\">\r\n <ul class=\"carousel-indicators\">\r\n <li *ngFor=\"let group of payload.refImage; let i = index\"\r\n [class.active]=\"i === currentIndex\"\r\n (click)=\"goToSlide(i)\">\r\n </li>\r\n </ul>\r\n </div>\r\n \r\n </div>\r\n </div>\r\n <div class=\"row px-5\"\r\n *ngIf=\"payload.inputData.answerType==='image'||payload.inputData.answerType==='descriptiveImage'||payload.inputData.answerType==='multipleImage'\">\r\n \r\n <div class=\"carousel\">\r\n <div class=\"carousel-inner\">\r\n <div\r\n class=\"carousel-item\"\r\n *ngFor=\"let group of payload.refImage; let i = index\"\r\n [class.active]=\"i === currentIndex\"\r\n >\r\n <div class=\"row\">\r\n \r\n <img src=\"{{environment.TraxAnswerCDN}}{{group}}\"\r\n class=\"image-thumb mb-8 d-block w-100 cursor-pointer\"\r\n alt=\"Image {{ i + 1 }}\" />\r\n </div>\r\n </div>\r\n </div>\r\n <button class=\"carousel-control-prev\" *ngIf=\"currentIndex > 0\" (click)=\"prevSlide()\">\r\n <span class=\"carousel-control-prev-icon\"></span>\r\n </button>\r\n \r\n <button class=\"carousel-control-next\" *ngIf=\"currentIndex < payload.refImage.length - 1\" (click)=\"nextSlide()\">\r\n <span class=\"carousel-control-next-icon\"></span>\r\n </button>\r\n \r\n <div *ngIf=\"payload.refImage.length > 1\" class=\"row\">\r\n <ul class=\"carousel-indicators\">\r\n <li *ngFor=\"let group of payload.refImage; let i = index\"\r\n [class.active]=\"i === currentIndex\"\r\n (click)=\"goToSlide(i)\">\r\n </li>\r\n </ul>\r\n </div>\r\n \r\n </div>\r\n </div>\r\n <div class=\"row px-5\"\r\n *ngIf=\"payload.inputData.answerType==='multiplechoicesingle'||payload.inputData.answerType==='yes/no'||payload.inputData.answerType==='date'||payload.inputData.answerType==='time' ||payload.inputData.answerType==='multiplechoicemultiple'||payload.inputData.answerType==='linearscale'||payload.inputData.answerType==='descriptive' \">\r\n <div class=\"row\" *ngFor=\"let item of payload.inputData.userAnswer\">\r\n <span class=\"mt-1\">{{item.answer}}</span>\r\n </div>\r\n </div> -->\r\n <div class=\"fv-row mb-3 fv-plugins-icon-container\" *ngIf=\"showcomment\">\r\n <label class=\"label-name my-2\">\r\n Task Comment\r\n </label>\r\n <textarea [formControl]=\"taskForm.controls.checklistDescription\"\r\n class=\"form-control form-control\" placeholder=\"Enter a comment\"\r\n name=\"Main entrance signage is cracked, and lights are flickering. Please retake the image\"\r\n rows=\"4\"></textarea>\r\n </div>\r\n <h3 class=\"mt-3 mb-3\">Configurations</h3>\r\n <div class=\"fv-row mb-3 fv-plugins-icon-container\">\r\n <label class=\"label-name my-2\">\r\n Response Type\r\n </label>\r\n <select (change)=\"onQuestionChange($event, i, j)\" formControlName=\"answerType\"\r\n class=\"form-select mb-5\">\r\n <option *ngFor=\"let answer of answerTypes\" [value]=\"answer.value\">\r\n {{answer.label}}</option>\r\n </select>\r\n\r\n </div>\r\n <div class=\"fv-row mb-3 fv-plugins-icon-container\"\r\n *ngIf=\"question.get('answerType')?.value !=='time'&&question.get('answerType')?.value !=='date'\">\r\n <label class=\"label-name1 my-3\">\r\n Answer Options\r\n </label>\r\n <div [id]=\"'question-' + i + j\" class=\"question-container mb-10\">\r\n <ng-container *ngIf=\"question.get('answerType')?.value === 'descriptive'\">\r\n <div class=\"d-flex mb-5\">\r\n <div class=\"form-check\">\r\n <input formControlName=\"descriptivetype\"\r\n class=\"form-check-input cursor-pointer\" type=\"radio\"\r\n value=\"text\" [id]=\"'descriptivetype_text' + i + j\">\r\n <label class=\"cursor-pointer dscriptiveType\"\r\n [for]=\"'descriptivetype_text' + i + j\">Text</label>\r\n </div>\r\n <div class=\"form-check ms-5\">\r\n <input formControlName=\"descriptivetype\"\r\n class=\"form-check-input cursor-pointer\" type=\"radio\"\r\n value=\"number\" [id]=\"'descriptivetype_number' + i + j\">\r\n <label class=\"cursor-pointer dscriptiveType\"\r\n [for]=\"'descriptivetype_number' + i + j\">Number</label>\r\n </div>\r\n </div>\r\n\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"question.get('answerType')?.value === 'yes/no'\">\r\n <ng-container\r\n *ngFor=\"let answer of getAnswers(i, j).controls; let k = index\">\r\n <ng-container [formGroup]=\"answer\">\r\n <div class=\"row\">\r\n <div class=\"col-12 mb-5\">\r\n <div class=\"input-group \">\r\n <input formControlName=\"answer\" type=\"text\"\r\n class=\"form-control\"\r\n placeholder=\"Enter answer here\">\r\n\r\n </div>\r\n <ng-container\r\n *ngIf=\"answer.get('answer')?.invalid && answer.get('answer')?.touched\">\r\n <div *ngIf=\"answer.get('answer')?.hasError('required')|| answer.get('answer')?.hasError('whitespace')\"\r\n class=\"text-danger mt-2\">* Answer is required</div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container\r\n *ngIf=\"question.get('answerType')?.value === 'multiplechoicesingle' || question.get('answerType')?.value === 'multiplechoicemultiple'\">\r\n <ng-container\r\n *ngFor=\"let answer of getAnswers(i, j).controls; let k = index\">\r\n <ng-container [formGroup]=\"answer\">\r\n <div class=\"row\">\r\n <div class=\"col-12 mb-5\">\r\n <div class=\"input-group \">\r\n <input formControlName=\"answer\" type=\"text\"\r\n class=\"form-control\"\r\n placeholder=\"Enter answer here\">\r\n\r\n <button *ngIf=\"isInvalidAnswer(i,j)\"\r\n class=\"btn btn-outline\" type=\"button\">\r\n <svg class=\"cursor-pointer\"\r\n (click)=\"onAnswerDelete(i, j, k)\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n matTooltip=\"Delete answer\"\r\n matTooltipPosition=\"above\"\r\n matTooltipClass=\"custom-test\" width=\"20\"\r\n height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path _ngcontent-ng-c1491044170=\"\"\r\n d=\"M15 5L5 15M5 5L15 15\" stroke=\"#667085\"\r\n stroke-width=\"1.66667\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </svg>\r\n </button>\r\n </div>\r\n <ng-container\r\n *ngIf=\"answer.get('answer')?.invalid && answer.get('answer')?.touched\">\r\n <div *ngIf=\"answer.get('answer')?.hasError('required')||answer.get('answer')?.hasError('whitespace')\"\r\n class=\"text-danger mt-2\">* Answer is required</div>\r\n </ng-container>\r\n </div>\r\n\r\n\r\n\r\n\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n\r\n\r\n <div (click)=\"addNewAnswer(i, j, 'multiplechoicesingle')\"\r\n class=\"add-reference-btn mb-5 d-flex justify-content-center\">\r\n Add More Answer\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container\r\n *ngIf=\"question.get('answerType')?.value === 'descriptiveImage' || question.get('answerType')?.value === 'image'\">\r\n\r\n\r\n\r\n <ng-container\r\n *ngFor=\"let answer of getAnswers(i, j).controls; let k = index\">\r\n <ng-container [formGroup]=\"answer\">\r\n <div class=\"row\">\r\n <div class=\"col-12 mb-5\">\r\n\r\n\r\n\r\n\r\n <div class=\"row\">\r\n <div class=\"col-6\">\r\n <div\r\n class=\"d-flex align-items-center justify-content-between\">\r\n\r\n\r\n <div>\r\n <div class=\"form-check form-switch ps-0\">\r\n <input\r\n [formControl]=\"question.controls.allowUploadfromGallery\"\r\n class=\"form-check-input me-3\"\r\n type=\"checkbox\" role=\"switch\"\r\n [id]=\"'allow_upload_from_gallery' + i + j\">\r\n <label\r\n class=\"form-check-label check-label\"\r\n [for]=\"'allow_upload_from_gallery' + i + j\">Allow\r\n upload from gallery</label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n\r\n\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"question.get('answerType')?.value === 'video'\">\r\n <div class=\"row\">\r\n <div class=\"col-12 mb-5\">\r\n <div class=\"form-check form-switch ps-0\">\r\n <input formControlName=\"allowUploadfromGallery\"\r\n class=\"form-check-input me-3\" type=\"checkbox\" role=\"switch\"\r\n [id]=\"'allow_upload_from_gallery' + i + j\">\r\n <label class=\"form-check-label check-label\"\r\n [for]=\"'allow_upload_from_gallery' + i + j\">Allow\r\n upload from gallery</label>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"question.get('answerType')?.value === 'multipleImage'\">\r\n <ng-container\r\n *ngFor=\"let answer of getAnswers(i, j).controls; let k = index\">\r\n <ng-container [formGroup]=\"answer\">\r\n <div class=\"row\">\r\n <div class=\"col-12 mb-5\">\r\n <div class=\"row\">\r\n <div class=\"col-6\">\r\n <div\r\n class=\"d-flex align-items-center justify-content-between\">\r\n <div>\r\n <div class=\"form-check form-switch ps-0\">\r\n <input\r\n [formControl]=\"question.controls.allowUploadfromGallery\"\r\n class=\"form-check-input me-3\"\r\n type=\"checkbox\" role=\"switch\"\r\n [id]=\"'allow_upload_from_gallery' + i + j\">\r\n <label\r\n class=\"form-check-label check-label\"\r\n [for]=\"'allow_upload_from_gallery' + i + j\">Allow\r\n upload from gallery</label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-6\"\r\n *ngIf=\"question.controls.descriptivetype\">\r\n <div class=\"d-flex align-items-center h-100\">\r\n <div class=\"form-check\">\r\n <input\r\n [formControl]=\"question.controls.descriptivetype\"\r\n class=\"form-check-input cursor-pointer\"\r\n type=\"radio\" value=\"text\"\r\n [id]=\"'descriptive_answer_validation_text' + i + j + k\">\r\n <label class=\"cursor-pointer dscriptiveType\"\r\n [for]=\"'descriptive_answer_validation_text' + i + j + k\">Text</label>\r\n </div>\r\n <div class=\"form-check ms-5\">\r\n <input\r\n [formControl]=\"question.controls.descriptivetype\"\r\n class=\"form-check-input cursor-pointer\"\r\n type=\"radio\" value=\"number\"\r\n [id]=\"'descriptive_answer_validation_number' + i + j + k\">\r\n <label class=\"cursor-pointer dscriptiveType\"\r\n [for]=\"'descriptive_answer_validation_number' + i + j + k\">Number</label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n\r\n\r\n </ng-container>\r\n\r\n <ng-container\r\n *ngIf=\"question.get('answerType')?.value === 'date' || question.get('answerType')?.value === 'time'\">\r\n\r\n\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"question.get('answerType')?.value === 'linearscale'\">\r\n <ng-container\r\n *ngFor=\"let answer of getAnswers(i, j).controls; let k = index\">\r\n <ng-container [formGroup]=\"answer\">\r\n <div class=\"col-4\">\r\n <div class=\"d-flex justify-content-between align-items-center \">\r\n <div class=\"me-2\">\r\n <input type=\"number\" formControlName=\"rangeStart\"\r\n class=\"form-control\">\r\n </div>\r\n <div class=\"me-2 check-label\">\r\n to\r\n </div>\r\n <div>\r\n <input type=\"number\" formControlName=\"rangeEnd\"\r\n class=\"form-control\">\r\n </div>\r\n\r\n </div>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n\r\n\r\n </div>\r\n\r\n\r\n\r\n\r\n\r\n\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n <div class=\"row mb-3 fv-plugins-icon-container \">\r\n <div class=\"col-md-6\">\r\n <label class=\"label-name my-2\">\r\n Due date\r\n </label>\r\n\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"\r\n fill=\"none\">\r\n <path\r\n d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <input class=\"fx-date-range form-control ps-14\" type=\"text\" matInput ngxDaterangepickerMd\r\n [drops]=\"'down'\" [opens]=\"'right'\" [showCustomRangeLabel]=\"false\"\r\n [alwaysShowCalendars]=\"false\" [autoApply]=\"true\" [singleDatePicker]=\"true\"\r\n [ngModelOptions]=\"{standalone: true}\" [keepCalendarOpeningWithRange]=\"true\"\r\n [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDate\"\r\n (startDateChanged)=\"onStartDateChange($event)\" [isCustomDate]=\"isCustomDate\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n (datesUpdated)=\"datechange($event)\" name=\"daterange\" [readonly]=\"true\" />\r\n </div>\r\n </div>\r\n <div class=\"col-md-6\">\r\n <label class=\"label-name my-2\">Due time</label>\r\n <div class=\"position-relative w-100\">\r\n <button type=\"button\" (click)=\"openDropdown($event)\"\r\n class=\"btn btn-default w-100 btn-outline btn-outline-default rounded-3 mt-1 text-nowrap border-val d-flex justify-content-between h-45px\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"\r\n fill=\"none\">\r\n <path\r\n d=\"M13.3333 1.6665V4.99984M6.66667 1.6665V4.99984M2.5 8.33317H17.5M4.16667 3.33317H15.8333C16.7538 3.33317 17.5 4.07936 17.5 4.99984V16.6665C17.5 17.587 16.7538 18.3332 15.8333 18.3332H4.16667C3.24619 18.3332 2.5 17.587 2.5 16.6665V4.99984C2.5 4.07936 3.24619 3.33317 4.16667 3.33317Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span class=\"ps-12\">{{ selectedItem }}</span>\r\n </button>\r\n <div *ngIf=\"dropDown\"\r\n class=\"card py-1 w-100 position-absolute z-1 h-200px scroll-y top-50px end-0\">\r\n <ul class=\"list-unstyled\">\r\n <li *ngFor=\"let item of timeDetails\"\r\n [ngClass]=\"selectedItem === item.text ? 'active' : ''\"\r\n class=\"camera px-5 items fw-semibold cursor-pointer py-2\"\r\n [class.disabled]=\"isDisabled(item.text)\" (click)=\"selectItem(item.text)\">\r\n {{ item.text }}\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n <div class=\"fv-row row mb-3 fv-plugins-icon-container\">\r\n <div class=\"col-md-6\">\r\n <label class=\"label-name my-2\">\r\n Priority\r\n </label>\r\n \r\n <lib-reactive-select [formControl]=\"selectedlistselectControl\" [idField]=\"'value'\" [nameField]=\"'label'\"\r\n [data]=\"priorityTypeList\" (itemChange)=\"filterChange($event)\"></lib-reactive-select>\r\n </div>\r\n <div class=\"col-md-6\">\r\n\r\n <label class=\"label-name my-2\">\r\n Assign to\r\n </label>\r\n\r\n <div *ngIf=\"filtertype==='Teams'\">\r\n <lib-disabled-select [items]=\"payload.selectedUsers\" [multi]=\"true\"\r\n [searchField]=\"'userName'\" [idField]=\"'userName'\" [dropDowndisabled]=\"true\"\r\n [selectedValues]=\"payload.selectedUsers\"></lib-disabled-select>\r\n </div>\r\n <div *ngIf=\"filtertype==='Clusters'\">\r\n <lib-disabled-select [items]=\"payload.selectedStores\" [multi]=\"true\"\r\n [searchField]=\"'storeName'\" [idField]=\"'storeName'\" [dropDowndisabled]=\"true\"\r\n [selectedValues]=\"payload.selectedStores\"></lib-disabled-select>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"fv-row my-3 fv-plugins-icon-container\">\r\n <div class=\"border-attach col-md-3 cursor-pointer\" *ngIf=\"this.uploadedFiles.length<3\"\r\n (click)=\"fileInput.click()\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M17.8666 9.2081L10.2082 16.8664C9.27005 17.8046 7.99757 18.3317 6.67075 18.3317C5.34393 18.3317 4.07145 17.8046 3.13325 16.8664C2.19505 15.9282 1.66797 14.6558 1.66797 13.3289C1.66797 12.0021 2.19505 10.7296 3.13325 9.79144L10.7916 2.1331C11.4171 1.50763 12.2654 1.15625 13.1499 1.15625C14.0345 1.15625 14.8828 1.50763 15.5082 2.1331C16.1337 2.75857 16.4851 3.60689 16.4851 4.49144C16.4851 5.37598 16.1337 6.2243 15.5082 6.84977L7.84158 14.5081C7.52885 14.8208 7.10469 14.9965 6.66242 14.9965C6.22014 14.9965 5.79598 14.8208 5.48325 14.5081C5.17051 14.1954 4.99482 13.7712 4.99482 13.3289C4.99482 12.8867 5.17051 12.4625 5.48325 12.1498L12.5582 5.0831\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"ms-3\">Add Attachment</span>\r\n <input #fileInput type=\"file\" accept=\".png, .jpg, .jpeg, .svg, .gif\"\r\n (change)=\"uploadFile($event,0,0,0)\" hidden />\r\n </div>\r\n <div class=\"row\">\r\n <div class=\"col-md-4 image-preview mt-2\" *ngFor=\"let item of uploadedFiles; let i = index\">\r\n <button class=\"remove-icon\" (click)=\"removeImage(i)\">\u2716</button>\r\n <img [src]=\"item\" alt=\"Preview\" />\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"mt-3\">\r\n <div class=\"form-check mb-3 p-3 border rounded option-box\"\r\n [ngClass]=\"{ 'active-option': allowedStoreLocation}\">\r\n <div class=\"form-check form-switch ps-0 my-2\">\r\n <input class=\"form-check-input my-5 mx-3 cursor-pointer ps-0\" type=\"checkbox\"\r\n id=\"flexSwitchCheckDefault\" [checked]=\"allowedStoreLocation\"\r\n (change)=\"togglegeofencing($event)\">\r\n <span class=\"fw-bold\" for=\"sameComment\"> Geo fencing</span>\r\n <div class=\"text-muted medium mt-1 ms-10\">\r\n By enabling, the checklist can be filled by the user only when inside the store.\r\n </div>\r\n </div>\r\n\r\n\r\n </div>\r\n\r\n <div class=\"form-check p-3 border rounded option-box\"\r\n [ngClass]=\"{ 'active-option': restrictAttendance }\">\r\n <div class=\"form-check form-switch ps-0 my-2\">\r\n <input class=\"form-check-input my-5 mx-3 form-switch ps-0\" type=\"checkbox\"\r\n id=\"flexSwitchCheckDefault\" [checked]=\"restrictAttendance\"\r\n (change)=\"toggleAttendance($event)\">\r\n <span class=\"fw-bold\" for=\"sameComment\">Restrict attendance</span>\r\n <div class=\"text-muted medium mt-1 ms-10\">\r\n By enabling, user can't be able to clockout without completing the task.\r\n </div>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n\r\n </form>\r\n\r\n </div>\r\n <div class=\" w-100 modal-footer px-0 pt-3 pb-5\">\r\n <div role=\"group\" class=\"d-flex mt-3 w-100\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button id=\"alert-toast\" class=\"btn btn-primary w-100 ms-3\" [disabled]=\"!this.taskForm.valid||submitted||payload.selectedStores.length===0&&payload.selectedUsers.length===0\"\r\n (click)=\"onSubmit()\">Create\r\n Task</button>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n <div *ngIf=\"type ==='redo'\" class=\"card-body py-0 d-flex flex-start flex-column p-9 scroll \">\r\n <div class=\"my-5\">\r\n <div class=\"symbol symbol-75px symbol-circle d-flex \">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M39 19.9996V25.9996M39 25.9996H33M39 25.9996L34.36 21.6396C33.2853 20.5643 31.9556 19.7788 30.4952 19.3564C29.0348 18.9339 27.4911 18.8883 26.0083 19.2238C24.5255 19.5594 23.1518 20.265 22.0155 21.275C20.8791 22.285 20.0172 23.5664 19.51 24.9996M17 35.9996V29.9996M17 29.9996H23M17 29.9996L21.64 34.3596C22.7147 35.4349 24.0444 36.2204 25.5048 36.6428C26.9652 37.0652 28.5089 37.1108 29.9917 36.7753C31.4745 36.4398 32.8482 35.7342 33.9845 34.7242C35.1209 33.7142 35.9828 32.4328 36.49 30.9996\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <h3 class=\"text-capitalize mx-3 mt-3\"> {{type}}</h3>\r\n </div>\r\n </div>\r\n <ng-container *ngFor=\"let section of getSections?.controls; let i = index\">\r\n <ng-container [formGroup]=\"section\">\r\n <ng-container *ngFor=\"let question of getQuestions(i)?.controls; let j = index\">\r\n <ng-container [formGroup]=\"question\">\r\n\r\n <div class=\"modal-body scroll-y w-100 p-1\">\r\n <h5 class=\"label-name1 my-2\">\r\n Redo\r\n </h5>\r\n <div class=\"fv-row mb-3 fv-plugins-icon-container\">\r\n <div class=\"text-gray-600\">This Task is linked to </div>\r\n <div class=\"d-flex mt-3\">\r\n <div>Checklist Name :</div>\r\n <div>\r\n <h4> {{payload.checklistName}}</h4>\r\n </div>\r\n </div>\r\n <div class=\"d-flex mt-3\">\r\n <div>Question :</div>\r\n <div><span class=\"text-wrap\"> {{question.get('qno')?.value}}.\r\n {{question.get('qname')?.value}}</span></div>\r\n </div>\r\n <div class=\"d-flex mt-3 mb-3\" *ngIf=\"payload.coverage==='store'\">\r\n <div>Stores Selected :</div>\r\n <div>\r\n <h4>{{payload.selectedStores.length}} stores</h4>\r\n </div>\r\n </div>\r\n <div class=\"d-flex mt-3 mb-3\" *ngIf=\"payload.coverage==='user'\">\r\n <div>users Selected :</div>\r\n <div>\r\n <h4>{{payload.selectedUsers.length}} users</h4>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n <form [formGroup]=\"taskForm\">\r\n\r\n <div class=\"fv-row mb-3 fv-plugins-icon-container\" *ngIf=\"showcomment\">\r\n <label class=\"label-name my-2\">\r\n Your Comment\r\n </label>\r\n <textarea [formControl]=\"taskForm.controls.checklistDescription\"\r\n class=\"form-control form-control\" placeholder=\"Enter a comment\"\r\n name=\"Main entrance signage is cracked, and lights are flickering. Please retake the image\"\r\n rows=\"4\"></textarea>\r\n </div>\r\n\r\n\r\n <div class=\"fv-row mb-3 fv-plugins-icon-container\">\r\n <label class=\"label-name my-2\">\r\n Assign to\r\n </label>\r\n <!-- <input type=\"text\" class=\"form-control\" [value]=\"this.checklistInfo?.submittedBy\"\r\n [disabled]=\"true\"> -->\r\n <div *ngIf=\"filtertype==='Teams'\">\r\n <lib-disabled-select [items]=\"payload.selectedUsers\" [multi]=\"true\"\r\n [searchField]=\"'userName'\" [idField]=\"'userName'\" [dropDowndisabled]=\"true\"\r\n [selectedValues]=\"payload.selectedUsers\"></lib-disabled-select>\r\n </div>\r\n <div *ngIf=\"filtertype==='Clusters'\">\r\n <lib-disabled-select [items]=\"payload.selectedStores\" [multi]=\"true\"\r\n [searchField]=\"'storeName'\" [idField]=\"'storeName'\"\r\n [dropDowndisabled]=\"true\"\r\n [selectedValues]=\"payload.selectedStores\"></lib-disabled-select>\r\n </div>\r\n\r\n </div>\r\n <div class=\"mt-5 w-100\">\r\n <div role=\"group\" class=\"d-flex mt-3 mb-15\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button id=\"alert-toast\" class=\"btn btn-primary w-100 ms-3\"\r\n [disabled]=\"submitted||payload.selectedStores.length===0&&payload.selectedUsers.length===0\" (click)=\"onSubmit()\">Submit</button>\r\n </div>\r\n </div>\r\n\r\n\r\n </form>\r\n\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n\r\n </div>\r\n</div>", styles: [".carousel{position:relative}.carousel-item{display:none;transition:opacity .5s}.carousel-item.active{display:block;opacity:1}.option-box{transition:border-color .3s,background-color .3s;cursor:pointer}.option-box:hover{border-color:#008edf}.active-option{border-color:#008edf!important;color:#008edf!important;background-color:#e7f1ff}.carousel-control-prev,.carousel-control-next{position:absolute;top:50%;transform:translateY(-50%);border:none;padding:10px;cursor:pointer}.carousel-control-prev{left:0}.carousel-control-next{right:0}.carousel-indicators{position:absolute;left:35%;transform:translate(-50%);gap:10px}.carousel-indicators li{list-style:none!important;width:10px;height:10px;background-color:#ddd;border-radius:50%;cursor:pointer;transition:background-color .3s}.carousel-indicators li.active{background-color:#007bff}.carousel-control-prev-icon,.carousel-control-next-icon{display:inline-block;width:25rem!important;height:25rem!important;background-repeat:no-repeat;background-position:50%;background-size:100% 100%}.image-thumb{height:auto;border-radius:8px}.dropselect{color:var(--Gray-500, #344054);font-family:Inter;font-size:14px;font-style:normal;font-weight:500;line-height:18px;white-space:nowrap}.nodata-title{font-size:14px!important;font-weight:600}.carousel-control-prev-icon,.carousel-control-next-icon{color:#fff!important}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .md-drppicker.shown.drops-down-right{transform-origin:0 0}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.show-ranges.shown{top:65px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}:host::ng-deep .daterangepicker{position:fixed!important;top:30%!important;left:50%!important;transform:translate(-50%);z-index:1050!important}\n"], dependencies: [{ kind: "directive", type: i6.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.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: i1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i8$1.DaterangepickerDirective, selector: "input[ngxDaterangepickerMd]", inputs: ["minDate", "maxDate", "autoApply", "alwaysShowCalendars", "showCustomRangeLabel", "linkedCalendars", "dateLimit", "singleDatePicker", "showWeekNumbers", "showISOWeekNumbers", "showDropdowns", "isInvalidDate", "isCustomDate", "isTooltipDate", "showClearButton", "customRangeDirection", "ranges", "opens", "drops", "firstMonthDayClass", "lastMonthDayClass", "emptyWeekRowClass", "emptyWeekColumnClass", "firstDayOfNextMonthClass", "lastDayOfPreviousMonthClass", "keepCalendarOpeningWithRange", "showRangeLabelOnInput", "showCancel", "lockStartDate", "timePicker", "timePicker24Hour", "timePickerIncrement", "timePickerSeconds", "closeOnAutoApply", "endKeyHolder", "startKey", "locale", "endKey"], outputs: ["change", "rangeClicked", "datesUpdated", "startDateChanged", "endDateChanged", "clearClicked"] }, { kind: "component", type: ReactiveSelectComponent, selector: "lib-reactive-select", inputs: ["isDisabled", "idField", "nameField", "label", "data"], outputs: ["itemChange"] }, { kind: "component", type: DisabledSelectComponent, selector: "lib-disabled-select", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "dropDowndisabled", "label"], outputs: ["selected"] }] });
9203
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: AddMultitaskComponent, selector: "lib-add-multitask", inputs: { type: "type", sourceCheckList_id: "sourceCheckList_id", filtertype: "filtertype", showcomment: "showcomment", excelData: "excelData", payload: "payload", taskDetails: "taskDetails", checklistInfo: "checklistInfo" }, host: { listeners: { "document:click": "closeDropdown($event)" } }, viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], ngImport: i0, template: "<div class=\"card group-delete py-0\">\r\n <div *ngIf=\"type ==='task'\" class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"modal-header px-0 py-5 \">\r\n <div class=\"symbol symbol-75px symbol-circle d-flex\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M30 18H22C21.4696 18 20.9609 18.2107 20.5858 18.5858C20.2107 18.9609 20 19.4696 20 20V36C20 36.5304 20.2107 37.0391 20.5858 37.4142C20.9609 37.7893 21.4696 38 22 38H34C34.5304 38 35.0391 37.7893 35.4142 37.4142C35.7893 37.0391 36 36.5304 36 36V24M30 18L36 24M30 18V24H36M28 34V28M25 31H31\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <h3 class=\"text-capitalize mx-3 mt-5\"> {{type}}</h3>\r\n\r\n </div>\r\n </div>\r\n\r\n <div class=\"modal-body scroll-y w-100 p-1 scroll custom-scroll\">\r\n <form [formGroup]=\"taskForm\">\r\n <ng-container *ngFor=\"let section of getSections?.controls; let i = index\">\r\n <ng-container [formGroup]=\"section\">\r\n <ng-container *ngFor=\"let question of getQuestions(i)?.controls; let j = index\">\r\n <ng-container [formGroup]=\"question\">\r\n <div class=\"fv-row mb-3 fv-plugins-icon-container\">\r\n <div class=\"container\">\r\n <p class=\"text-gray-600 mb-2\">This Task is linked to</p>\r\n\r\n <div class=\"mb-2\">\r\n <span class=\"label\">Checklist Name <span class=\"ms-6\">:</span></span>\r\n <span class=\"value ms-9\">{{payload.checklistName}}</span>\r\n </div>\r\n\r\n <div class=\"mb-2 d-flex\">\r\n <span class=\"label me-1\">Question <span class=\"ms-20\">:</span></span>\r\n <div class=\"text-gray-500\">\r\n {{question.get('qno')?.value}}.\r\n {{question.get('qname')?.value}}\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"payload.coverage==='store'\">\r\n <span class=\"label\">Stores Selected <span class=\"ms-9\">:</span></span>\r\n <span class=\"value ms-8\">{{payload.selectedStores.length}} stores</span>\r\n </div>\r\n <div *ngIf=\"payload.coverage==='user'\">\r\n <span class=\"label\">users Selected<span class=\"ms-9\">:</span></span>\r\n <span class=\"value ms-8\">{{payload.selectedUsers.length}} users</span>\r\n </div>\r\n </div>\r\n <label class=\"label-name my-2\">\r\n Task Name<span class=\"text-danger\">*</span>\r\n </label>\r\n <input [formControl]=\"taskForm.controls.checklistName\" type=\"text\"\r\n placeholder=\"Enter Task Name\" class=\"form-control mb-5\">\r\n <div\r\n class=\"fv-plugins-message-container fv-plugins-message-container--enabled invalid-feedback\">\r\n </div>\r\n </div>\r\n\r\n\r\n\r\n <!-- <div class=\"row px-5\" *ngIf=\"payload.inputData.answerType==='video'\">\r\n \r\n <div class=\"carousel\">\r\n <div class=\"carousel-inner\">\r\n <div\r\n class=\"carousel-item\"\r\n *ngFor=\"let group of payload.refImage; let i = index\"\r\n [class.active]=\"i === currentIndex\"\r\n >\r\n <div class=\"row\">\r\n \r\n <img src=\"{{environment.TraxAnswerCDN}}{{group}}\"\r\n class=\"image-thumb mb-8 d-block w-100 cursor-pointer\"\r\n alt=\"Image {{ i + 1 }}\" />\r\n </div>\r\n </div>\r\n </div>\r\n <button class=\"carousel-control-prev\" *ngIf=\"currentIndex > 0\" (click)=\"prevSlide()\">\r\n <span class=\"carousel-control-prev-icon\"></span>\r\n </button>\r\n \r\n <button class=\"carousel-control-next\" *ngIf=\"currentIndex < payload.refImage.length - 1\" (click)=\"nextSlide()\">\r\n <span class=\"carousel-control-next-icon\"></span>\r\n </button>\r\n \r\n <div *ngIf=\"payload.refImage.length > 1\" class=\"row\">\r\n <ul class=\"carousel-indicators\">\r\n <li *ngFor=\"let group of payload.refImage; let i = index\"\r\n [class.active]=\"i === currentIndex\"\r\n (click)=\"goToSlide(i)\">\r\n </li>\r\n </ul>\r\n </div>\r\n \r\n </div>\r\n </div>\r\n <div class=\"row px-5\"\r\n *ngIf=\"payload.inputData.answerType==='image'||payload.inputData.answerType==='descriptiveImage'||payload.inputData.answerType==='multipleImage'\">\r\n \r\n <div class=\"carousel\">\r\n <div class=\"carousel-inner\">\r\n <div\r\n class=\"carousel-item\"\r\n *ngFor=\"let group of payload.refImage; let i = index\"\r\n [class.active]=\"i === currentIndex\"\r\n >\r\n <div class=\"row\">\r\n \r\n <img src=\"{{environment.TraxAnswerCDN}}{{group}}\"\r\n class=\"image-thumb mb-8 d-block w-100 cursor-pointer\"\r\n alt=\"Image {{ i + 1 }}\" />\r\n </div>\r\n </div>\r\n </div>\r\n <button class=\"carousel-control-prev\" *ngIf=\"currentIndex > 0\" (click)=\"prevSlide()\">\r\n <span class=\"carousel-control-prev-icon\"></span>\r\n </button>\r\n \r\n <button class=\"carousel-control-next\" *ngIf=\"currentIndex < payload.refImage.length - 1\" (click)=\"nextSlide()\">\r\n <span class=\"carousel-control-next-icon\"></span>\r\n </button>\r\n \r\n <div *ngIf=\"payload.refImage.length > 1\" class=\"row\">\r\n <ul class=\"carousel-indicators\">\r\n <li *ngFor=\"let group of payload.refImage; let i = index\"\r\n [class.active]=\"i === currentIndex\"\r\n (click)=\"goToSlide(i)\">\r\n </li>\r\n </ul>\r\n </div>\r\n \r\n </div>\r\n </div>\r\n <div class=\"row px-5\"\r\n *ngIf=\"payload.inputData.answerType==='multiplechoicesingle'||payload.inputData.answerType==='yes/no'||payload.inputData.answerType==='date'||payload.inputData.answerType==='time' ||payload.inputData.answerType==='multiplechoicemultiple'||payload.inputData.answerType==='linearscale'||payload.inputData.answerType==='descriptive' \">\r\n <div class=\"row\" *ngFor=\"let item of payload.inputData.userAnswer\">\r\n <span class=\"mt-1\">{{item.answer}}</span>\r\n </div>\r\n </div> -->\r\n <div class=\"fv-row mb-3 fv-plugins-icon-container\" *ngIf=\"showcomment\">\r\n <label class=\"label-name my-2\">\r\n Task Comment\r\n </label>\r\n <textarea [formControl]=\"taskForm.controls.checklistDescription\"\r\n class=\"form-control form-control\" placeholder=\"Enter a comment\"\r\n name=\"Main entrance signage is cracked, and lights are flickering. Please retake the image\"\r\n rows=\"4\"></textarea>\r\n </div>\r\n <h3 class=\"mt-3 mb-3\">Configurations</h3>\r\n <div class=\"fv-row mb-3 fv-plugins-icon-container\">\r\n <label class=\"label-name my-2\">\r\n Response Type\r\n </label>\r\n <select (change)=\"onQuestionChange($event, i, j)\" formControlName=\"answerType\"\r\n class=\"form-select mb-5\">\r\n <option *ngFor=\"let answer of answerTypes\" [value]=\"answer.value\">\r\n {{answer.label}}</option>\r\n </select>\r\n\r\n </div>\r\n <div class=\"fv-row mb-3 fv-plugins-icon-container\"\r\n *ngIf=\"question.get('answerType')?.value !=='time'&&question.get('answerType')?.value !=='date'\">\r\n <label class=\"label-name1 my-3\">\r\n Answer Options\r\n </label>\r\n <div [id]=\"'question-' + i + j\" class=\"question-container mb-10\">\r\n <ng-container *ngIf=\"question.get('answerType')?.value === 'descriptive'\">\r\n <div class=\"d-flex mb-5\">\r\n <div class=\"form-check\">\r\n <input formControlName=\"descriptivetype\"\r\n class=\"form-check-input cursor-pointer\" type=\"radio\"\r\n value=\"text\" [id]=\"'descriptivetype_text' + i + j\">\r\n <label class=\"cursor-pointer dscriptiveType\"\r\n [for]=\"'descriptivetype_text' + i + j\">Text</label>\r\n </div>\r\n <div class=\"form-check ms-5\">\r\n <input formControlName=\"descriptivetype\"\r\n class=\"form-check-input cursor-pointer\" type=\"radio\"\r\n value=\"number\" [id]=\"'descriptivetype_number' + i + j\">\r\n <label class=\"cursor-pointer dscriptiveType\"\r\n [for]=\"'descriptivetype_number' + i + j\">Number</label>\r\n </div>\r\n </div>\r\n\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"question.get('answerType')?.value === 'yes/no'\">\r\n <ng-container\r\n *ngFor=\"let answer of getAnswers(i, j).controls; let k = index\">\r\n <ng-container [formGroup]=\"answer\">\r\n <div class=\"row\">\r\n <div class=\"col-12 mb-5\">\r\n <div class=\"input-group \">\r\n <input formControlName=\"answer\" type=\"text\"\r\n class=\"form-control\"\r\n placeholder=\"Enter answer here\">\r\n\r\n </div>\r\n <ng-container\r\n *ngIf=\"answer.get('answer')?.invalid && answer.get('answer')?.touched\">\r\n <div *ngIf=\"answer.get('answer')?.hasError('required')|| answer.get('answer')?.hasError('whitespace')\"\r\n class=\"text-danger mt-2\">* Answer is required</div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container\r\n *ngIf=\"question.get('answerType')?.value === 'multiplechoicesingle' || question.get('answerType')?.value === 'multiplechoicemultiple'\">\r\n <ng-container\r\n *ngFor=\"let answer of getAnswers(i, j).controls; let k = index\">\r\n <ng-container [formGroup]=\"answer\">\r\n <div class=\"row\">\r\n <div class=\"col-12 mb-5\">\r\n <div class=\"input-group \">\r\n <input formControlName=\"answer\" type=\"text\"\r\n class=\"form-control\"\r\n placeholder=\"Enter answer here\">\r\n\r\n <button *ngIf=\"isInvalidAnswer(i,j)\"\r\n class=\"btn btn-outline\" type=\"button\">\r\n <svg class=\"cursor-pointer\"\r\n (click)=\"onAnswerDelete(i, j, k)\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n matTooltip=\"Delete answer\"\r\n matTooltipPosition=\"above\"\r\n matTooltipClass=\"custom-test\" width=\"20\"\r\n height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path _ngcontent-ng-c1491044170=\"\"\r\n d=\"M15 5L5 15M5 5L15 15\" stroke=\"#667085\"\r\n stroke-width=\"1.66667\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </svg>\r\n </button>\r\n </div>\r\n <ng-container\r\n *ngIf=\"answer.get('answer')?.invalid && answer.get('answer')?.touched\">\r\n <div *ngIf=\"answer.get('answer')?.hasError('required')||answer.get('answer')?.hasError('whitespace')\"\r\n class=\"text-danger mt-2\">* Answer is required</div>\r\n </ng-container>\r\n </div>\r\n\r\n\r\n\r\n\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n\r\n\r\n <div (click)=\"addNewAnswer(i, j, 'multiplechoicesingle')\"\r\n class=\"add-reference-btn mb-5 d-flex justify-content-center\">\r\n Add More Answer\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container\r\n *ngIf=\"question.get('answerType')?.value === 'descriptiveImage' || question.get('answerType')?.value === 'image'\">\r\n\r\n\r\n\r\n <ng-container\r\n *ngFor=\"let answer of getAnswers(i, j).controls; let k = index\">\r\n <ng-container [formGroup]=\"answer\">\r\n <div class=\"row\">\r\n <div class=\"col-12 mb-5\">\r\n\r\n\r\n\r\n\r\n <div class=\"row\">\r\n <div class=\"col-6\">\r\n <div\r\n class=\"d-flex align-items-center justify-content-between\">\r\n\r\n\r\n <div>\r\n <div class=\"form-check form-switch ps-0\">\r\n <input\r\n [formControl]=\"question.controls.allowUploadfromGallery\"\r\n class=\"form-check-input me-3\"\r\n type=\"checkbox\" role=\"switch\"\r\n [id]=\"'allow_upload_from_gallery' + i + j\">\r\n <label\r\n class=\"form-check-label check-label\"\r\n [for]=\"'allow_upload_from_gallery' + i + j\">Allow\r\n upload from gallery</label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n\r\n\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"question.get('answerType')?.value === 'video'\">\r\n <div class=\"row\">\r\n <div class=\"col-12 mb-5\">\r\n <div class=\"form-check form-switch ps-0\">\r\n <input formControlName=\"allowUploadfromGallery\"\r\n class=\"form-check-input me-3\" type=\"checkbox\" role=\"switch\"\r\n [id]=\"'allow_upload_from_gallery' + i + j\">\r\n <label class=\"form-check-label check-label\"\r\n [for]=\"'allow_upload_from_gallery' + i + j\">Allow\r\n upload from gallery</label>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"question.get('answerType')?.value === 'multipleImage'\">\r\n <ng-container\r\n *ngFor=\"let answer of getAnswers(i, j).controls; let k = index\">\r\n <ng-container [formGroup]=\"answer\">\r\n <div class=\"row\">\r\n <div class=\"col-12 mb-5\">\r\n <div class=\"row\">\r\n <div class=\"col-6\">\r\n <div\r\n class=\"d-flex align-items-center justify-content-between\">\r\n <div>\r\n <div class=\"form-check form-switch ps-0\">\r\n <input\r\n [formControl]=\"question.controls.allowUploadfromGallery\"\r\n class=\"form-check-input me-3\"\r\n type=\"checkbox\" role=\"switch\"\r\n [id]=\"'allow_upload_from_gallery' + i + j\">\r\n <label\r\n class=\"form-check-label check-label\"\r\n [for]=\"'allow_upload_from_gallery' + i + j\">Allow\r\n upload from gallery</label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-6\"\r\n *ngIf=\"question.controls.descriptivetype\">\r\n <div class=\"d-flex align-items-center h-100\">\r\n <div class=\"form-check\">\r\n <input\r\n [formControl]=\"question.controls.descriptivetype\"\r\n class=\"form-check-input cursor-pointer\"\r\n type=\"radio\" value=\"text\"\r\n [id]=\"'descriptive_answer_validation_text' + i + j + k\">\r\n <label class=\"cursor-pointer dscriptiveType\"\r\n [for]=\"'descriptive_answer_validation_text' + i + j + k\">Text</label>\r\n </div>\r\n <div class=\"form-check ms-5\">\r\n <input\r\n [formControl]=\"question.controls.descriptivetype\"\r\n class=\"form-check-input cursor-pointer\"\r\n type=\"radio\" value=\"number\"\r\n [id]=\"'descriptive_answer_validation_number' + i + j + k\">\r\n <label class=\"cursor-pointer dscriptiveType\"\r\n [for]=\"'descriptive_answer_validation_number' + i + j + k\">Number</label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n\r\n\r\n </ng-container>\r\n\r\n <ng-container\r\n *ngIf=\"question.get('answerType')?.value === 'date' || question.get('answerType')?.value === 'time'\">\r\n\r\n\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"question.get('answerType')?.value === 'linearscale'\">\r\n <ng-container\r\n *ngFor=\"let answer of getAnswers(i, j).controls; let k = index\">\r\n <ng-container [formGroup]=\"answer\">\r\n <div class=\"col-4\">\r\n <div class=\"d-flex justify-content-between align-items-center \">\r\n <div class=\"me-2\">\r\n <input type=\"number\" formControlName=\"rangeStart\"\r\n class=\"form-control\">\r\n </div>\r\n <div class=\"me-2 check-label\">\r\n to\r\n </div>\r\n <div>\r\n <input type=\"number\" formControlName=\"rangeEnd\"\r\n class=\"form-control\">\r\n </div>\r\n\r\n </div>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n\r\n\r\n </div>\r\n\r\n\r\n\r\n\r\n\r\n\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n <div class=\"row mb-3 fv-plugins-icon-container \">\r\n <div class=\"col-md-6\">\r\n <label class=\"label-name my-2\">\r\n Due date\r\n </label>\r\n\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"\r\n fill=\"none\">\r\n <path\r\n d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <input class=\"fx-date-range form-control ps-14\" type=\"text\" matInput ngxDaterangepickerMd\r\n [drops]=\"'down'\" [opens]=\"'right'\" [showCustomRangeLabel]=\"false\"\r\n [alwaysShowCalendars]=\"false\" [autoApply]=\"true\" [singleDatePicker]=\"true\"\r\n [ngModelOptions]=\"{standalone: true}\" [keepCalendarOpeningWithRange]=\"true\"\r\n [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDate\"\r\n (startDateChanged)=\"onStartDateChange($event)\" [isCustomDate]=\"isCustomDate\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n (datesUpdated)=\"datechange($event)\" name=\"daterange\" [readonly]=\"true\" />\r\n </div>\r\n </div>\r\n <div class=\"col-md-6\">\r\n <label class=\"label-name my-2\">Due time</label>\r\n <div class=\"position-relative w-100\">\r\n <button type=\"button\" (click)=\"openDropdown($event)\"\r\n class=\"btn btn-default w-100 btn-outline btn-outline-default rounded-3 mt-1 text-nowrap border-val d-flex justify-content-between h-45px\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"\r\n fill=\"none\">\r\n <path\r\n d=\"M13.3333 1.6665V4.99984M6.66667 1.6665V4.99984M2.5 8.33317H17.5M4.16667 3.33317H15.8333C16.7538 3.33317 17.5 4.07936 17.5 4.99984V16.6665C17.5 17.587 16.7538 18.3332 15.8333 18.3332H4.16667C3.24619 18.3332 2.5 17.587 2.5 16.6665V4.99984C2.5 4.07936 3.24619 3.33317 4.16667 3.33317Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span class=\"ps-12\">{{ selectedItem }}</span>\r\n </button>\r\n <div *ngIf=\"dropDown\"\r\n class=\"card py-1 w-100 position-absolute z-1 h-200px scroll-y top-50px end-0\">\r\n <ul class=\"list-unstyled\">\r\n <li *ngFor=\"let item of timeDetails\"\r\n [ngClass]=\"selectedItem === item.text ? 'active' : ''\"\r\n class=\"camera px-5 items fw-semibold cursor-pointer py-2\"\r\n [class.disabled]=\"isDisabled(item.text)\" (click)=\"selectItem(item.text)\">\r\n {{ item.text }}\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n <div class=\"fv-row row mb-3 fv-plugins-icon-container\">\r\n <div class=\"col-md-6\">\r\n <label class=\"label-name my-2\">\r\n Priority\r\n </label>\r\n\r\n <lib-reactive-select [formControl]=\"selectedlistselectControl\" [idField]=\"'value'\"\r\n [nameField]=\"'label'\" [data]=\"priorityTypeList\"\r\n (itemChange)=\"filterChange($event)\"></lib-reactive-select>\r\n </div>\r\n <div class=\"col-md-6\">\r\n\r\n <label class=\"label-name my-2\">\r\n Assign to\r\n </label>\r\n\r\n <div *ngIf=\"filtertype==='Teams'\">\r\n <lib-disabled-select [items]=\"payload.selectedUsers\" [multi]=\"true\"\r\n [searchField]=\"'userName'\" [idField]=\"'userName'\" [dropDowndisabled]=\"true\"\r\n [selectedValues]=\"payload.selectedUsers\"></lib-disabled-select>\r\n </div>\r\n <div *ngIf=\"filtertype==='Clusters'\">\r\n <lib-disabled-select [items]=\"payload.selectedStores\" [multi]=\"true\"\r\n [searchField]=\"'storeName'\" [idField]=\"'storeName'\" [dropDowndisabled]=\"true\"\r\n [selectedValues]=\"payload.selectedStores\"></lib-disabled-select>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"fv-row my-3 fv-plugins-icon-container\">\r\n <div class=\"border-attach col-md-3 cursor-pointer\" *ngIf=\"this.uploadedFiles.length<3\"\r\n (click)=\"fileInput.click()\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M17.8666 9.2081L10.2082 16.8664C9.27005 17.8046 7.99757 18.3317 6.67075 18.3317C5.34393 18.3317 4.07145 17.8046 3.13325 16.8664C2.19505 15.9282 1.66797 14.6558 1.66797 13.3289C1.66797 12.0021 2.19505 10.7296 3.13325 9.79144L10.7916 2.1331C11.4171 1.50763 12.2654 1.15625 13.1499 1.15625C14.0345 1.15625 14.8828 1.50763 15.5082 2.1331C16.1337 2.75857 16.4851 3.60689 16.4851 4.49144C16.4851 5.37598 16.1337 6.2243 15.5082 6.84977L7.84158 14.5081C7.52885 14.8208 7.10469 14.9965 6.66242 14.9965C6.22014 14.9965 5.79598 14.8208 5.48325 14.5081C5.17051 14.1954 4.99482 13.7712 4.99482 13.3289C4.99482 12.8867 5.17051 12.4625 5.48325 12.1498L12.5582 5.0831\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"ms-3\">Add Attachment</span>\r\n <input #fileInput type=\"file\" accept=\".png, .jpg, .jpeg, .svg, .gif\"\r\n (change)=\"uploadFile($event,0,0,0)\" hidden />\r\n </div>\r\n <div class=\"row\">\r\n <div class=\"col-md-4 image-preview mt-2\" *ngFor=\"let item of uploadedFiles; let i = index\">\r\n <button class=\"remove-icon\" (click)=\"removeImage(i)\">\u2716</button>\r\n <img [src]=\"item\" alt=\"Preview\" />\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"mt-3\">\r\n <div class=\"form-check mb-3 p-3 border rounded option-box\"\r\n [ngClass]=\"{ 'active-option': allowedStoreLocation}\">\r\n <div class=\"form-check form-switch ps-0 my-2\">\r\n <input class=\"form-check-input my-5 mx-3 cursor-pointer ps-0\" type=\"checkbox\"\r\n id=\"flexSwitchCheckDefault\" [checked]=\"allowedStoreLocation\"\r\n (change)=\"togglegeofencing($event)\">\r\n <span class=\"fw-bold\" for=\"sameComment\"> Geo fencing</span>\r\n <div class=\"text-muted medium mt-1 ms-10\">\r\n By enabling, the checklist can be filled by the user only when inside the store.\r\n </div>\r\n </div>\r\n\r\n\r\n </div>\r\n\r\n <div class=\"form-check p-3 border rounded option-box\"\r\n [ngClass]=\"{ 'active-option': restrictAttendance }\">\r\n <div class=\"form-check form-switch ps-0 my-2\">\r\n <input class=\"form-check-input my-5 mx-3 form-switch ps-0\" type=\"checkbox\"\r\n id=\"flexSwitchCheckDefault\" [checked]=\"restrictAttendance\"\r\n (change)=\"toggleAttendance($event)\">\r\n <span class=\"fw-bold\" for=\"sameComment\">Restrict attendance</span>\r\n <div class=\"text-muted medium mt-1 ms-10\">\r\n By enabling, user can't be able to clockout without completing the task.\r\n </div>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n\r\n </form>\r\n\r\n </div>\r\n <div class=\" w-100 modal-footer px-0 pt-3 pb-5\">\r\n <div role=\"group\" class=\"d-flex mt-3 w-100\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button id=\"alert-toast\" class=\"btn btn-primary w-100 ms-3\"\r\n [disabled]=\"!this.taskForm.valid||submitted||payload.selectedStores.length===0&&payload.selectedUsers.length===0\"\r\n (click)=\"onSubmit()\">Create\r\n Task</button>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n <div *ngIf=\"type ==='redo'\" class=\"card-body py-0 d-flex flex-start flex-column p-9 scroll \">\r\n <div class=\"my-5\">\r\n <div class=\"symbol symbol-75px symbol-circle d-flex \">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M39 19.9996V25.9996M39 25.9996H33M39 25.9996L34.36 21.6396C33.2853 20.5643 31.9556 19.7788 30.4952 19.3564C29.0348 18.9339 27.4911 18.8883 26.0083 19.2238C24.5255 19.5594 23.1518 20.265 22.0155 21.275C20.8791 22.285 20.0172 23.5664 19.51 24.9996M17 35.9996V29.9996M17 29.9996H23M17 29.9996L21.64 34.3596C22.7147 35.4349 24.0444 36.2204 25.5048 36.6428C26.9652 37.0652 28.5089 37.1108 29.9917 36.7753C31.4745 36.4398 32.8482 35.7342 33.9845 34.7242C35.1209 33.7142 35.9828 32.4328 36.49 30.9996\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <h3 class=\"text-capitalize mx-3 mt-3\"> {{type}}</h3>\r\n </div>\r\n </div>\r\n <ng-container *ngFor=\"let section of getSections?.controls; let i = index\">\r\n <ng-container [formGroup]=\"section\">\r\n <ng-container *ngFor=\"let question of getQuestions(i)?.controls; let j = index\">\r\n <ng-container [formGroup]=\"question\">\r\n\r\n <div class=\"modal-body scroll-y w-100 p-1\">\r\n <h5 class=\"label-name1 my-2\">\r\n Redo\r\n </h5>\r\n <div class=\"fv-row mb-3 fv-plugins-icon-container\">\r\n <div class=\"container\">\r\n <p class=\"text-gray-600 mb-2\">This Task is linked to</p>\r\n\r\n <div class=\"mb-2\">\r\n <span class=\"label\">Checklist Name <span class=\"ms-6\">:</span></span>\r\n <span class=\"value ms-9\">{{payload.checklistName}}</span>\r\n </div>\r\n\r\n <div class=\"mb-2 d-flex\">\r\n <span class=\"label me-1\">Question <span class=\"ms-20\">:</span></span>\r\n <div class=\"text-gray-500\">\r\n {{question.get('qno')?.value}}.\r\n {{question.get('qname')?.value}}\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"payload.coverage==='store'\">\r\n <span class=\"label\">Stores Selected <span class=\"ms-9\">:</span></span>\r\n <span class=\"value ms-8\">{{payload.selectedStores.length}} stores</span>\r\n </div>\r\n <div *ngIf=\"payload.coverage==='user'\">\r\n <span class=\"label\">users Selected<span class=\"ms-9\">:</span></span>\r\n <span class=\"value ms-8\">{{payload.selectedUsers.length}} users</span>\r\n </div>\r\n </div>\r\n\r\n\r\n </div>\r\n\r\n <form [formGroup]=\"taskForm\">\r\n\r\n <div class=\"fv-row mb-3 fv-plugins-icon-container\" *ngIf=\"showcomment\">\r\n <label class=\"label-name my-2\">\r\n Your Comment\r\n </label>\r\n <textarea [formControl]=\"taskForm.controls.checklistDescription\"\r\n class=\"form-control form-control\" placeholder=\"Enter a comment\"\r\n name=\"Main entrance signage is cracked, and lights are flickering. Please retake the image\"\r\n rows=\"4\"></textarea>\r\n </div>\r\n\r\n\r\n <div class=\"fv-row mb-3 fv-plugins-icon-container\">\r\n <label class=\"label-name my-2\">\r\n Assign to\r\n </label>\r\n <!-- <input type=\"text\" class=\"form-control\" [value]=\"this.checklistInfo?.submittedBy\"\r\n [disabled]=\"true\"> -->\r\n <div *ngIf=\"filtertype==='Teams'\">\r\n <lib-disabled-select [items]=\"payload.selectedUsers\" [multi]=\"true\"\r\n [searchField]=\"'userName'\" [idField]=\"'userName'\" [dropDowndisabled]=\"true\"\r\n [selectedValues]=\"payload.selectedUsers\"></lib-disabled-select>\r\n </div>\r\n <div *ngIf=\"filtertype==='Clusters'\">\r\n <lib-disabled-select [items]=\"payload.selectedStores\" [multi]=\"true\"\r\n [searchField]=\"'storeName'\" [idField]=\"'storeName'\"\r\n [dropDowndisabled]=\"true\"\r\n [selectedValues]=\"payload.selectedStores\"></lib-disabled-select>\r\n </div>\r\n\r\n </div>\r\n <div class=\"mt-5 w-100\">\r\n <div role=\"group\" class=\"d-flex mt-3 mb-15\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button id=\"alert-toast\" class=\"btn btn-primary w-100 ms-3\"\r\n [disabled]=\"submitted||payload.selectedStores.length===0&&payload.selectedUsers.length===0\"\r\n (click)=\"onSubmit()\">Submit</button>\r\n </div>\r\n </div>\r\n\r\n\r\n </form>\r\n\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n\r\n </div>\r\n</div>", styles: [".carousel{position:relative}.carousel-item{display:none;transition:opacity .5s}.carousel-item.active{display:block;opacity:1}.option-box{transition:border-color .3s,background-color .3s;cursor:pointer}.option-box:hover{border-color:#008edf}.active-option{border-color:#008edf!important;color:#008edf!important;background-color:#e7f1ff}.carousel-control-prev,.carousel-control-next{position:absolute;top:50%;transform:translateY(-50%);border:none;padding:10px;cursor:pointer}.carousel-control-prev{left:0}.carousel-control-next{right:0}.carousel-indicators{position:absolute;left:35%;transform:translate(-50%);gap:10px}.carousel-indicators li{list-style:none!important;width:10px;height:10px;background-color:#ddd;border-radius:50%;cursor:pointer;transition:background-color .3s}.carousel-indicators li.active{background-color:#007bff}.carousel-control-prev-icon,.carousel-control-next-icon{display:inline-block;width:25rem!important;height:25rem!important;background-repeat:no-repeat;background-position:50%;background-size:100% 100%}.image-thumb{height:auto;border-radius:8px}.dropselect{color:var(--Gray-500, #344054);font-family:Inter;font-size:14px;font-style:normal;font-weight:500;line-height:18px;white-space:nowrap}.nodata-title{font-size:14px!important;font-weight:600}.carousel-control-prev-icon,.carousel-control-next-icon{color:#fff!important}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .md-drppicker.shown.drops-down-right{transform-origin:0 0}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.show-ranges.shown{top:65px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}:host::ng-deep .daterangepicker{position:fixed!important;top:30%!important;left:50%!important;transform:translate(-50%);z-index:1050!important}:host::ng-deep .label{color:var(--Gray-700, #344054);font-size:14px;width:200px}:host::ng-deep .value{font-weight:600;font-size:16px}\n"], dependencies: [{ kind: "directive", type: i6.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.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: i1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i8$1.DaterangepickerDirective, selector: "input[ngxDaterangepickerMd]", inputs: ["minDate", "maxDate", "autoApply", "alwaysShowCalendars", "showCustomRangeLabel", "linkedCalendars", "dateLimit", "singleDatePicker", "showWeekNumbers", "showISOWeekNumbers", "showDropdowns", "isInvalidDate", "isCustomDate", "isTooltipDate", "showClearButton", "customRangeDirection", "ranges", "opens", "drops", "firstMonthDayClass", "lastMonthDayClass", "emptyWeekRowClass", "emptyWeekColumnClass", "firstDayOfNextMonthClass", "lastDayOfPreviousMonthClass", "keepCalendarOpeningWithRange", "showRangeLabelOnInput", "showCancel", "lockStartDate", "timePicker", "timePicker24Hour", "timePickerIncrement", "timePickerSeconds", "closeOnAutoApply", "endKeyHolder", "startKey", "locale", "endKey"], outputs: ["change", "rangeClicked", "datesUpdated", "startDateChanged", "endDateChanged", "clearClicked"] }, { kind: "component", type: ReactiveSelectComponent, selector: "lib-reactive-select", inputs: ["isDisabled", "idField", "nameField", "label", "data"], outputs: ["itemChange"] }, { kind: "component", type: DisabledSelectComponent, selector: "lib-disabled-select", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "dropDowndisabled", "label"], outputs: ["selected"] }] });
9201
9204
  }
9202
9205
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AddMultitaskComponent, decorators: [{
9203
9206
  type: Component,
9204
- args: [{ selector: 'lib-add-multitask', template: "<div class=\"card group-delete py-0\">\r\n <div *ngIf=\"type ==='task'\" class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"modal-header px-0 py-5 \">\r\n <div class=\"symbol symbol-75px symbol-circle d-flex\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M30 18H22C21.4696 18 20.9609 18.2107 20.5858 18.5858C20.2107 18.9609 20 19.4696 20 20V36C20 36.5304 20.2107 37.0391 20.5858 37.4142C20.9609 37.7893 21.4696 38 22 38H34C34.5304 38 35.0391 37.7893 35.4142 37.4142C35.7893 37.0391 36 36.5304 36 36V24M30 18L36 24M30 18V24H36M28 34V28M25 31H31\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <h3 class=\"text-capitalize mx-3 mt-5\"> {{type}}</h3>\r\n\r\n </div>\r\n </div>\r\n\r\n <div class=\"modal-body scroll-y w-100 p-1 scroll custom-scroll\">\r\n <form [formGroup]=\"taskForm\">\r\n <ng-container *ngFor=\"let section of getSections?.controls; let i = index\">\r\n <ng-container [formGroup]=\"section\">\r\n <ng-container *ngFor=\"let question of getQuestions(i)?.controls; let j = index\">\r\n <ng-container [formGroup]=\"question\">\r\n <div class=\"fv-row mb-3 fv-plugins-icon-container\">\r\n <div class=\"text-gray-600\">This Task is linked to </div>\r\n <div class=\"d-flex mt-3\">\r\n <div>Checklist Name :</div>\r\n <div>\r\n <h4> {{payload.checklistName}}</h4>\r\n </div>\r\n </div>\r\n <div class=\"d-flex mt-3\">\r\n <div>Question :</div>\r\n <div><span class=\"text-wrap\"> {{question.get('qno')?.value}}.\r\n {{question.get('qname')?.value}}</span></div>\r\n </div>\r\n <div class=\"d-flex mt-3 mb-3\" *ngIf=\"payload.coverage==='store'\">\r\n <div>Stores Selected :</div>\r\n <div>\r\n <h4>{{payload.selectedStores.length}} stores</h4>\r\n </div>\r\n </div>\r\n <div class=\"d-flex mt-3 mb-3\" *ngIf=\"payload.coverage==='user'\">\r\n <div>users Selected :</div>\r\n <div>\r\n <h4>{{payload.selectedUsers.length}} users</h4>\r\n </div>\r\n </div>\r\n <label class=\"label-name my-2\">\r\n Task Name<span class=\"text-danger\">*</span>\r\n </label>\r\n <input [formControl]=\"taskForm.controls.checklistName\" type=\"text\"\r\n placeholder=\"Enter Task Name\" class=\"form-control mb-5\">\r\n <div\r\n class=\"fv-plugins-message-container fv-plugins-message-container--enabled invalid-feedback\">\r\n </div>\r\n </div>\r\n\r\n\r\n\r\n <!-- <div class=\"row px-5\" *ngIf=\"payload.inputData.answerType==='video'\">\r\n \r\n <div class=\"carousel\">\r\n <div class=\"carousel-inner\">\r\n <div\r\n class=\"carousel-item\"\r\n *ngFor=\"let group of payload.refImage; let i = index\"\r\n [class.active]=\"i === currentIndex\"\r\n >\r\n <div class=\"row\">\r\n \r\n <img src=\"{{environment.TraxAnswerCDN}}{{group}}\"\r\n class=\"image-thumb mb-8 d-block w-100 cursor-pointer\"\r\n alt=\"Image {{ i + 1 }}\" />\r\n </div>\r\n </div>\r\n </div>\r\n <button class=\"carousel-control-prev\" *ngIf=\"currentIndex > 0\" (click)=\"prevSlide()\">\r\n <span class=\"carousel-control-prev-icon\"></span>\r\n </button>\r\n \r\n <button class=\"carousel-control-next\" *ngIf=\"currentIndex < payload.refImage.length - 1\" (click)=\"nextSlide()\">\r\n <span class=\"carousel-control-next-icon\"></span>\r\n </button>\r\n \r\n <div *ngIf=\"payload.refImage.length > 1\" class=\"row\">\r\n <ul class=\"carousel-indicators\">\r\n <li *ngFor=\"let group of payload.refImage; let i = index\"\r\n [class.active]=\"i === currentIndex\"\r\n (click)=\"goToSlide(i)\">\r\n </li>\r\n </ul>\r\n </div>\r\n \r\n </div>\r\n </div>\r\n <div class=\"row px-5\"\r\n *ngIf=\"payload.inputData.answerType==='image'||payload.inputData.answerType==='descriptiveImage'||payload.inputData.answerType==='multipleImage'\">\r\n \r\n <div class=\"carousel\">\r\n <div class=\"carousel-inner\">\r\n <div\r\n class=\"carousel-item\"\r\n *ngFor=\"let group of payload.refImage; let i = index\"\r\n [class.active]=\"i === currentIndex\"\r\n >\r\n <div class=\"row\">\r\n \r\n <img src=\"{{environment.TraxAnswerCDN}}{{group}}\"\r\n class=\"image-thumb mb-8 d-block w-100 cursor-pointer\"\r\n alt=\"Image {{ i + 1 }}\" />\r\n </div>\r\n </div>\r\n </div>\r\n <button class=\"carousel-control-prev\" *ngIf=\"currentIndex > 0\" (click)=\"prevSlide()\">\r\n <span class=\"carousel-control-prev-icon\"></span>\r\n </button>\r\n \r\n <button class=\"carousel-control-next\" *ngIf=\"currentIndex < payload.refImage.length - 1\" (click)=\"nextSlide()\">\r\n <span class=\"carousel-control-next-icon\"></span>\r\n </button>\r\n \r\n <div *ngIf=\"payload.refImage.length > 1\" class=\"row\">\r\n <ul class=\"carousel-indicators\">\r\n <li *ngFor=\"let group of payload.refImage; let i = index\"\r\n [class.active]=\"i === currentIndex\"\r\n (click)=\"goToSlide(i)\">\r\n </li>\r\n </ul>\r\n </div>\r\n \r\n </div>\r\n </div>\r\n <div class=\"row px-5\"\r\n *ngIf=\"payload.inputData.answerType==='multiplechoicesingle'||payload.inputData.answerType==='yes/no'||payload.inputData.answerType==='date'||payload.inputData.answerType==='time' ||payload.inputData.answerType==='multiplechoicemultiple'||payload.inputData.answerType==='linearscale'||payload.inputData.answerType==='descriptive' \">\r\n <div class=\"row\" *ngFor=\"let item of payload.inputData.userAnswer\">\r\n <span class=\"mt-1\">{{item.answer}}</span>\r\n </div>\r\n </div> -->\r\n <div class=\"fv-row mb-3 fv-plugins-icon-container\" *ngIf=\"showcomment\">\r\n <label class=\"label-name my-2\">\r\n Task Comment\r\n </label>\r\n <textarea [formControl]=\"taskForm.controls.checklistDescription\"\r\n class=\"form-control form-control\" placeholder=\"Enter a comment\"\r\n name=\"Main entrance signage is cracked, and lights are flickering. Please retake the image\"\r\n rows=\"4\"></textarea>\r\n </div>\r\n <h3 class=\"mt-3 mb-3\">Configurations</h3>\r\n <div class=\"fv-row mb-3 fv-plugins-icon-container\">\r\n <label class=\"label-name my-2\">\r\n Response Type\r\n </label>\r\n <select (change)=\"onQuestionChange($event, i, j)\" formControlName=\"answerType\"\r\n class=\"form-select mb-5\">\r\n <option *ngFor=\"let answer of answerTypes\" [value]=\"answer.value\">\r\n {{answer.label}}</option>\r\n </select>\r\n\r\n </div>\r\n <div class=\"fv-row mb-3 fv-plugins-icon-container\"\r\n *ngIf=\"question.get('answerType')?.value !=='time'&&question.get('answerType')?.value !=='date'\">\r\n <label class=\"label-name1 my-3\">\r\n Answer Options\r\n </label>\r\n <div [id]=\"'question-' + i + j\" class=\"question-container mb-10\">\r\n <ng-container *ngIf=\"question.get('answerType')?.value === 'descriptive'\">\r\n <div class=\"d-flex mb-5\">\r\n <div class=\"form-check\">\r\n <input formControlName=\"descriptivetype\"\r\n class=\"form-check-input cursor-pointer\" type=\"radio\"\r\n value=\"text\" [id]=\"'descriptivetype_text' + i + j\">\r\n <label class=\"cursor-pointer dscriptiveType\"\r\n [for]=\"'descriptivetype_text' + i + j\">Text</label>\r\n </div>\r\n <div class=\"form-check ms-5\">\r\n <input formControlName=\"descriptivetype\"\r\n class=\"form-check-input cursor-pointer\" type=\"radio\"\r\n value=\"number\" [id]=\"'descriptivetype_number' + i + j\">\r\n <label class=\"cursor-pointer dscriptiveType\"\r\n [for]=\"'descriptivetype_number' + i + j\">Number</label>\r\n </div>\r\n </div>\r\n\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"question.get('answerType')?.value === 'yes/no'\">\r\n <ng-container\r\n *ngFor=\"let answer of getAnswers(i, j).controls; let k = index\">\r\n <ng-container [formGroup]=\"answer\">\r\n <div class=\"row\">\r\n <div class=\"col-12 mb-5\">\r\n <div class=\"input-group \">\r\n <input formControlName=\"answer\" type=\"text\"\r\n class=\"form-control\"\r\n placeholder=\"Enter answer here\">\r\n\r\n </div>\r\n <ng-container\r\n *ngIf=\"answer.get('answer')?.invalid && answer.get('answer')?.touched\">\r\n <div *ngIf=\"answer.get('answer')?.hasError('required')|| answer.get('answer')?.hasError('whitespace')\"\r\n class=\"text-danger mt-2\">* Answer is required</div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container\r\n *ngIf=\"question.get('answerType')?.value === 'multiplechoicesingle' || question.get('answerType')?.value === 'multiplechoicemultiple'\">\r\n <ng-container\r\n *ngFor=\"let answer of getAnswers(i, j).controls; let k = index\">\r\n <ng-container [formGroup]=\"answer\">\r\n <div class=\"row\">\r\n <div class=\"col-12 mb-5\">\r\n <div class=\"input-group \">\r\n <input formControlName=\"answer\" type=\"text\"\r\n class=\"form-control\"\r\n placeholder=\"Enter answer here\">\r\n\r\n <button *ngIf=\"isInvalidAnswer(i,j)\"\r\n class=\"btn btn-outline\" type=\"button\">\r\n <svg class=\"cursor-pointer\"\r\n (click)=\"onAnswerDelete(i, j, k)\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n matTooltip=\"Delete answer\"\r\n matTooltipPosition=\"above\"\r\n matTooltipClass=\"custom-test\" width=\"20\"\r\n height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path _ngcontent-ng-c1491044170=\"\"\r\n d=\"M15 5L5 15M5 5L15 15\" stroke=\"#667085\"\r\n stroke-width=\"1.66667\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </svg>\r\n </button>\r\n </div>\r\n <ng-container\r\n *ngIf=\"answer.get('answer')?.invalid && answer.get('answer')?.touched\">\r\n <div *ngIf=\"answer.get('answer')?.hasError('required')||answer.get('answer')?.hasError('whitespace')\"\r\n class=\"text-danger mt-2\">* Answer is required</div>\r\n </ng-container>\r\n </div>\r\n\r\n\r\n\r\n\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n\r\n\r\n <div (click)=\"addNewAnswer(i, j, 'multiplechoicesingle')\"\r\n class=\"add-reference-btn mb-5 d-flex justify-content-center\">\r\n Add More Answer\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container\r\n *ngIf=\"question.get('answerType')?.value === 'descriptiveImage' || question.get('answerType')?.value === 'image'\">\r\n\r\n\r\n\r\n <ng-container\r\n *ngFor=\"let answer of getAnswers(i, j).controls; let k = index\">\r\n <ng-container [formGroup]=\"answer\">\r\n <div class=\"row\">\r\n <div class=\"col-12 mb-5\">\r\n\r\n\r\n\r\n\r\n <div class=\"row\">\r\n <div class=\"col-6\">\r\n <div\r\n class=\"d-flex align-items-center justify-content-between\">\r\n\r\n\r\n <div>\r\n <div class=\"form-check form-switch ps-0\">\r\n <input\r\n [formControl]=\"question.controls.allowUploadfromGallery\"\r\n class=\"form-check-input me-3\"\r\n type=\"checkbox\" role=\"switch\"\r\n [id]=\"'allow_upload_from_gallery' + i + j\">\r\n <label\r\n class=\"form-check-label check-label\"\r\n [for]=\"'allow_upload_from_gallery' + i + j\">Allow\r\n upload from gallery</label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n\r\n\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"question.get('answerType')?.value === 'video'\">\r\n <div class=\"row\">\r\n <div class=\"col-12 mb-5\">\r\n <div class=\"form-check form-switch ps-0\">\r\n <input formControlName=\"allowUploadfromGallery\"\r\n class=\"form-check-input me-3\" type=\"checkbox\" role=\"switch\"\r\n [id]=\"'allow_upload_from_gallery' + i + j\">\r\n <label class=\"form-check-label check-label\"\r\n [for]=\"'allow_upload_from_gallery' + i + j\">Allow\r\n upload from gallery</label>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"question.get('answerType')?.value === 'multipleImage'\">\r\n <ng-container\r\n *ngFor=\"let answer of getAnswers(i, j).controls; let k = index\">\r\n <ng-container [formGroup]=\"answer\">\r\n <div class=\"row\">\r\n <div class=\"col-12 mb-5\">\r\n <div class=\"row\">\r\n <div class=\"col-6\">\r\n <div\r\n class=\"d-flex align-items-center justify-content-between\">\r\n <div>\r\n <div class=\"form-check form-switch ps-0\">\r\n <input\r\n [formControl]=\"question.controls.allowUploadfromGallery\"\r\n class=\"form-check-input me-3\"\r\n type=\"checkbox\" role=\"switch\"\r\n [id]=\"'allow_upload_from_gallery' + i + j\">\r\n <label\r\n class=\"form-check-label check-label\"\r\n [for]=\"'allow_upload_from_gallery' + i + j\">Allow\r\n upload from gallery</label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-6\"\r\n *ngIf=\"question.controls.descriptivetype\">\r\n <div class=\"d-flex align-items-center h-100\">\r\n <div class=\"form-check\">\r\n <input\r\n [formControl]=\"question.controls.descriptivetype\"\r\n class=\"form-check-input cursor-pointer\"\r\n type=\"radio\" value=\"text\"\r\n [id]=\"'descriptive_answer_validation_text' + i + j + k\">\r\n <label class=\"cursor-pointer dscriptiveType\"\r\n [for]=\"'descriptive_answer_validation_text' + i + j + k\">Text</label>\r\n </div>\r\n <div class=\"form-check ms-5\">\r\n <input\r\n [formControl]=\"question.controls.descriptivetype\"\r\n class=\"form-check-input cursor-pointer\"\r\n type=\"radio\" value=\"number\"\r\n [id]=\"'descriptive_answer_validation_number' + i + j + k\">\r\n <label class=\"cursor-pointer dscriptiveType\"\r\n [for]=\"'descriptive_answer_validation_number' + i + j + k\">Number</label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n\r\n\r\n </ng-container>\r\n\r\n <ng-container\r\n *ngIf=\"question.get('answerType')?.value === 'date' || question.get('answerType')?.value === 'time'\">\r\n\r\n\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"question.get('answerType')?.value === 'linearscale'\">\r\n <ng-container\r\n *ngFor=\"let answer of getAnswers(i, j).controls; let k = index\">\r\n <ng-container [formGroup]=\"answer\">\r\n <div class=\"col-4\">\r\n <div class=\"d-flex justify-content-between align-items-center \">\r\n <div class=\"me-2\">\r\n <input type=\"number\" formControlName=\"rangeStart\"\r\n class=\"form-control\">\r\n </div>\r\n <div class=\"me-2 check-label\">\r\n to\r\n </div>\r\n <div>\r\n <input type=\"number\" formControlName=\"rangeEnd\"\r\n class=\"form-control\">\r\n </div>\r\n\r\n </div>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n\r\n\r\n </div>\r\n\r\n\r\n\r\n\r\n\r\n\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n <div class=\"row mb-3 fv-plugins-icon-container \">\r\n <div class=\"col-md-6\">\r\n <label class=\"label-name my-2\">\r\n Due date\r\n </label>\r\n\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"\r\n fill=\"none\">\r\n <path\r\n d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <input class=\"fx-date-range form-control ps-14\" type=\"text\" matInput ngxDaterangepickerMd\r\n [drops]=\"'down'\" [opens]=\"'right'\" [showCustomRangeLabel]=\"false\"\r\n [alwaysShowCalendars]=\"false\" [autoApply]=\"true\" [singleDatePicker]=\"true\"\r\n [ngModelOptions]=\"{standalone: true}\" [keepCalendarOpeningWithRange]=\"true\"\r\n [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDate\"\r\n (startDateChanged)=\"onStartDateChange($event)\" [isCustomDate]=\"isCustomDate\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n (datesUpdated)=\"datechange($event)\" name=\"daterange\" [readonly]=\"true\" />\r\n </div>\r\n </div>\r\n <div class=\"col-md-6\">\r\n <label class=\"label-name my-2\">Due time</label>\r\n <div class=\"position-relative w-100\">\r\n <button type=\"button\" (click)=\"openDropdown($event)\"\r\n class=\"btn btn-default w-100 btn-outline btn-outline-default rounded-3 mt-1 text-nowrap border-val d-flex justify-content-between h-45px\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"\r\n fill=\"none\">\r\n <path\r\n d=\"M13.3333 1.6665V4.99984M6.66667 1.6665V4.99984M2.5 8.33317H17.5M4.16667 3.33317H15.8333C16.7538 3.33317 17.5 4.07936 17.5 4.99984V16.6665C17.5 17.587 16.7538 18.3332 15.8333 18.3332H4.16667C3.24619 18.3332 2.5 17.587 2.5 16.6665V4.99984C2.5 4.07936 3.24619 3.33317 4.16667 3.33317Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span class=\"ps-12\">{{ selectedItem }}</span>\r\n </button>\r\n <div *ngIf=\"dropDown\"\r\n class=\"card py-1 w-100 position-absolute z-1 h-200px scroll-y top-50px end-0\">\r\n <ul class=\"list-unstyled\">\r\n <li *ngFor=\"let item of timeDetails\"\r\n [ngClass]=\"selectedItem === item.text ? 'active' : ''\"\r\n class=\"camera px-5 items fw-semibold cursor-pointer py-2\"\r\n [class.disabled]=\"isDisabled(item.text)\" (click)=\"selectItem(item.text)\">\r\n {{ item.text }}\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n <div class=\"fv-row row mb-3 fv-plugins-icon-container\">\r\n <div class=\"col-md-6\">\r\n <label class=\"label-name my-2\">\r\n Priority\r\n </label>\r\n \r\n <lib-reactive-select [formControl]=\"selectedlistselectControl\" [idField]=\"'value'\" [nameField]=\"'label'\"\r\n [data]=\"priorityTypeList\" (itemChange)=\"filterChange($event)\"></lib-reactive-select>\r\n </div>\r\n <div class=\"col-md-6\">\r\n\r\n <label class=\"label-name my-2\">\r\n Assign to\r\n </label>\r\n\r\n <div *ngIf=\"filtertype==='Teams'\">\r\n <lib-disabled-select [items]=\"payload.selectedUsers\" [multi]=\"true\"\r\n [searchField]=\"'userName'\" [idField]=\"'userName'\" [dropDowndisabled]=\"true\"\r\n [selectedValues]=\"payload.selectedUsers\"></lib-disabled-select>\r\n </div>\r\n <div *ngIf=\"filtertype==='Clusters'\">\r\n <lib-disabled-select [items]=\"payload.selectedStores\" [multi]=\"true\"\r\n [searchField]=\"'storeName'\" [idField]=\"'storeName'\" [dropDowndisabled]=\"true\"\r\n [selectedValues]=\"payload.selectedStores\"></lib-disabled-select>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"fv-row my-3 fv-plugins-icon-container\">\r\n <div class=\"border-attach col-md-3 cursor-pointer\" *ngIf=\"this.uploadedFiles.length<3\"\r\n (click)=\"fileInput.click()\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M17.8666 9.2081L10.2082 16.8664C9.27005 17.8046 7.99757 18.3317 6.67075 18.3317C5.34393 18.3317 4.07145 17.8046 3.13325 16.8664C2.19505 15.9282 1.66797 14.6558 1.66797 13.3289C1.66797 12.0021 2.19505 10.7296 3.13325 9.79144L10.7916 2.1331C11.4171 1.50763 12.2654 1.15625 13.1499 1.15625C14.0345 1.15625 14.8828 1.50763 15.5082 2.1331C16.1337 2.75857 16.4851 3.60689 16.4851 4.49144C16.4851 5.37598 16.1337 6.2243 15.5082 6.84977L7.84158 14.5081C7.52885 14.8208 7.10469 14.9965 6.66242 14.9965C6.22014 14.9965 5.79598 14.8208 5.48325 14.5081C5.17051 14.1954 4.99482 13.7712 4.99482 13.3289C4.99482 12.8867 5.17051 12.4625 5.48325 12.1498L12.5582 5.0831\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"ms-3\">Add Attachment</span>\r\n <input #fileInput type=\"file\" accept=\".png, .jpg, .jpeg, .svg, .gif\"\r\n (change)=\"uploadFile($event,0,0,0)\" hidden />\r\n </div>\r\n <div class=\"row\">\r\n <div class=\"col-md-4 image-preview mt-2\" *ngFor=\"let item of uploadedFiles; let i = index\">\r\n <button class=\"remove-icon\" (click)=\"removeImage(i)\">\u2716</button>\r\n <img [src]=\"item\" alt=\"Preview\" />\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"mt-3\">\r\n <div class=\"form-check mb-3 p-3 border rounded option-box\"\r\n [ngClass]=\"{ 'active-option': allowedStoreLocation}\">\r\n <div class=\"form-check form-switch ps-0 my-2\">\r\n <input class=\"form-check-input my-5 mx-3 cursor-pointer ps-0\" type=\"checkbox\"\r\n id=\"flexSwitchCheckDefault\" [checked]=\"allowedStoreLocation\"\r\n (change)=\"togglegeofencing($event)\">\r\n <span class=\"fw-bold\" for=\"sameComment\"> Geo fencing</span>\r\n <div class=\"text-muted medium mt-1 ms-10\">\r\n By enabling, the checklist can be filled by the user only when inside the store.\r\n </div>\r\n </div>\r\n\r\n\r\n </div>\r\n\r\n <div class=\"form-check p-3 border rounded option-box\"\r\n [ngClass]=\"{ 'active-option': restrictAttendance }\">\r\n <div class=\"form-check form-switch ps-0 my-2\">\r\n <input class=\"form-check-input my-5 mx-3 form-switch ps-0\" type=\"checkbox\"\r\n id=\"flexSwitchCheckDefault\" [checked]=\"restrictAttendance\"\r\n (change)=\"toggleAttendance($event)\">\r\n <span class=\"fw-bold\" for=\"sameComment\">Restrict attendance</span>\r\n <div class=\"text-muted medium mt-1 ms-10\">\r\n By enabling, user can't be able to clockout without completing the task.\r\n </div>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n\r\n </form>\r\n\r\n </div>\r\n <div class=\" w-100 modal-footer px-0 pt-3 pb-5\">\r\n <div role=\"group\" class=\"d-flex mt-3 w-100\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button id=\"alert-toast\" class=\"btn btn-primary w-100 ms-3\" [disabled]=\"!this.taskForm.valid||submitted||payload.selectedStores.length===0&&payload.selectedUsers.length===0\"\r\n (click)=\"onSubmit()\">Create\r\n Task</button>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n <div *ngIf=\"type ==='redo'\" class=\"card-body py-0 d-flex flex-start flex-column p-9 scroll \">\r\n <div class=\"my-5\">\r\n <div class=\"symbol symbol-75px symbol-circle d-flex \">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M39 19.9996V25.9996M39 25.9996H33M39 25.9996L34.36 21.6396C33.2853 20.5643 31.9556 19.7788 30.4952 19.3564C29.0348 18.9339 27.4911 18.8883 26.0083 19.2238C24.5255 19.5594 23.1518 20.265 22.0155 21.275C20.8791 22.285 20.0172 23.5664 19.51 24.9996M17 35.9996V29.9996M17 29.9996H23M17 29.9996L21.64 34.3596C22.7147 35.4349 24.0444 36.2204 25.5048 36.6428C26.9652 37.0652 28.5089 37.1108 29.9917 36.7753C31.4745 36.4398 32.8482 35.7342 33.9845 34.7242C35.1209 33.7142 35.9828 32.4328 36.49 30.9996\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <h3 class=\"text-capitalize mx-3 mt-3\"> {{type}}</h3>\r\n </div>\r\n </div>\r\n <ng-container *ngFor=\"let section of getSections?.controls; let i = index\">\r\n <ng-container [formGroup]=\"section\">\r\n <ng-container *ngFor=\"let question of getQuestions(i)?.controls; let j = index\">\r\n <ng-container [formGroup]=\"question\">\r\n\r\n <div class=\"modal-body scroll-y w-100 p-1\">\r\n <h5 class=\"label-name1 my-2\">\r\n Redo\r\n </h5>\r\n <div class=\"fv-row mb-3 fv-plugins-icon-container\">\r\n <div class=\"text-gray-600\">This Task is linked to </div>\r\n <div class=\"d-flex mt-3\">\r\n <div>Checklist Name :</div>\r\n <div>\r\n <h4> {{payload.checklistName}}</h4>\r\n </div>\r\n </div>\r\n <div class=\"d-flex mt-3\">\r\n <div>Question :</div>\r\n <div><span class=\"text-wrap\"> {{question.get('qno')?.value}}.\r\n {{question.get('qname')?.value}}</span></div>\r\n </div>\r\n <div class=\"d-flex mt-3 mb-3\" *ngIf=\"payload.coverage==='store'\">\r\n <div>Stores Selected :</div>\r\n <div>\r\n <h4>{{payload.selectedStores.length}} stores</h4>\r\n </div>\r\n </div>\r\n <div class=\"d-flex mt-3 mb-3\" *ngIf=\"payload.coverage==='user'\">\r\n <div>users Selected :</div>\r\n <div>\r\n <h4>{{payload.selectedUsers.length}} users</h4>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n <form [formGroup]=\"taskForm\">\r\n\r\n <div class=\"fv-row mb-3 fv-plugins-icon-container\" *ngIf=\"showcomment\">\r\n <label class=\"label-name my-2\">\r\n Your Comment\r\n </label>\r\n <textarea [formControl]=\"taskForm.controls.checklistDescription\"\r\n class=\"form-control form-control\" placeholder=\"Enter a comment\"\r\n name=\"Main entrance signage is cracked, and lights are flickering. Please retake the image\"\r\n rows=\"4\"></textarea>\r\n </div>\r\n\r\n\r\n <div class=\"fv-row mb-3 fv-plugins-icon-container\">\r\n <label class=\"label-name my-2\">\r\n Assign to\r\n </label>\r\n <!-- <input type=\"text\" class=\"form-control\" [value]=\"this.checklistInfo?.submittedBy\"\r\n [disabled]=\"true\"> -->\r\n <div *ngIf=\"filtertype==='Teams'\">\r\n <lib-disabled-select [items]=\"payload.selectedUsers\" [multi]=\"true\"\r\n [searchField]=\"'userName'\" [idField]=\"'userName'\" [dropDowndisabled]=\"true\"\r\n [selectedValues]=\"payload.selectedUsers\"></lib-disabled-select>\r\n </div>\r\n <div *ngIf=\"filtertype==='Clusters'\">\r\n <lib-disabled-select [items]=\"payload.selectedStores\" [multi]=\"true\"\r\n [searchField]=\"'storeName'\" [idField]=\"'storeName'\"\r\n [dropDowndisabled]=\"true\"\r\n [selectedValues]=\"payload.selectedStores\"></lib-disabled-select>\r\n </div>\r\n\r\n </div>\r\n <div class=\"mt-5 w-100\">\r\n <div role=\"group\" class=\"d-flex mt-3 mb-15\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button id=\"alert-toast\" class=\"btn btn-primary w-100 ms-3\"\r\n [disabled]=\"submitted||payload.selectedStores.length===0&&payload.selectedUsers.length===0\" (click)=\"onSubmit()\">Submit</button>\r\n </div>\r\n </div>\r\n\r\n\r\n </form>\r\n\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n\r\n </div>\r\n</div>", styles: [".carousel{position:relative}.carousel-item{display:none;transition:opacity .5s}.carousel-item.active{display:block;opacity:1}.option-box{transition:border-color .3s,background-color .3s;cursor:pointer}.option-box:hover{border-color:#008edf}.active-option{border-color:#008edf!important;color:#008edf!important;background-color:#e7f1ff}.carousel-control-prev,.carousel-control-next{position:absolute;top:50%;transform:translateY(-50%);border:none;padding:10px;cursor:pointer}.carousel-control-prev{left:0}.carousel-control-next{right:0}.carousel-indicators{position:absolute;left:35%;transform:translate(-50%);gap:10px}.carousel-indicators li{list-style:none!important;width:10px;height:10px;background-color:#ddd;border-radius:50%;cursor:pointer;transition:background-color .3s}.carousel-indicators li.active{background-color:#007bff}.carousel-control-prev-icon,.carousel-control-next-icon{display:inline-block;width:25rem!important;height:25rem!important;background-repeat:no-repeat;background-position:50%;background-size:100% 100%}.image-thumb{height:auto;border-radius:8px}.dropselect{color:var(--Gray-500, #344054);font-family:Inter;font-size:14px;font-style:normal;font-weight:500;line-height:18px;white-space:nowrap}.nodata-title{font-size:14px!important;font-weight:600}.carousel-control-prev-icon,.carousel-control-next-icon{color:#fff!important}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .md-drppicker.shown.drops-down-right{transform-origin:0 0}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.show-ranges.shown{top:65px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}:host::ng-deep .daterangepicker{position:fixed!important;top:30%!important;left:50%!important;transform:translate(-50%);z-index:1050!important}\n"] }]
9207
+ args: [{ selector: 'lib-add-multitask', template: "<div class=\"card group-delete py-0\">\r\n <div *ngIf=\"type ==='task'\" class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"modal-header px-0 py-5 \">\r\n <div class=\"symbol symbol-75px symbol-circle d-flex\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M30 18H22C21.4696 18 20.9609 18.2107 20.5858 18.5858C20.2107 18.9609 20 19.4696 20 20V36C20 36.5304 20.2107 37.0391 20.5858 37.4142C20.9609 37.7893 21.4696 38 22 38H34C34.5304 38 35.0391 37.7893 35.4142 37.4142C35.7893 37.0391 36 36.5304 36 36V24M30 18L36 24M30 18V24H36M28 34V28M25 31H31\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <h3 class=\"text-capitalize mx-3 mt-5\"> {{type}}</h3>\r\n\r\n </div>\r\n </div>\r\n\r\n <div class=\"modal-body scroll-y w-100 p-1 scroll custom-scroll\">\r\n <form [formGroup]=\"taskForm\">\r\n <ng-container *ngFor=\"let section of getSections?.controls; let i = index\">\r\n <ng-container [formGroup]=\"section\">\r\n <ng-container *ngFor=\"let question of getQuestions(i)?.controls; let j = index\">\r\n <ng-container [formGroup]=\"question\">\r\n <div class=\"fv-row mb-3 fv-plugins-icon-container\">\r\n <div class=\"container\">\r\n <p class=\"text-gray-600 mb-2\">This Task is linked to</p>\r\n\r\n <div class=\"mb-2\">\r\n <span class=\"label\">Checklist Name <span class=\"ms-6\">:</span></span>\r\n <span class=\"value ms-9\">{{payload.checklistName}}</span>\r\n </div>\r\n\r\n <div class=\"mb-2 d-flex\">\r\n <span class=\"label me-1\">Question <span class=\"ms-20\">:</span></span>\r\n <div class=\"text-gray-500\">\r\n {{question.get('qno')?.value}}.\r\n {{question.get('qname')?.value}}\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"payload.coverage==='store'\">\r\n <span class=\"label\">Stores Selected <span class=\"ms-9\">:</span></span>\r\n <span class=\"value ms-8\">{{payload.selectedStores.length}} stores</span>\r\n </div>\r\n <div *ngIf=\"payload.coverage==='user'\">\r\n <span class=\"label\">users Selected<span class=\"ms-9\">:</span></span>\r\n <span class=\"value ms-8\">{{payload.selectedUsers.length}} users</span>\r\n </div>\r\n </div>\r\n <label class=\"label-name my-2\">\r\n Task Name<span class=\"text-danger\">*</span>\r\n </label>\r\n <input [formControl]=\"taskForm.controls.checklistName\" type=\"text\"\r\n placeholder=\"Enter Task Name\" class=\"form-control mb-5\">\r\n <div\r\n class=\"fv-plugins-message-container fv-plugins-message-container--enabled invalid-feedback\">\r\n </div>\r\n </div>\r\n\r\n\r\n\r\n <!-- <div class=\"row px-5\" *ngIf=\"payload.inputData.answerType==='video'\">\r\n \r\n <div class=\"carousel\">\r\n <div class=\"carousel-inner\">\r\n <div\r\n class=\"carousel-item\"\r\n *ngFor=\"let group of payload.refImage; let i = index\"\r\n [class.active]=\"i === currentIndex\"\r\n >\r\n <div class=\"row\">\r\n \r\n <img src=\"{{environment.TraxAnswerCDN}}{{group}}\"\r\n class=\"image-thumb mb-8 d-block w-100 cursor-pointer\"\r\n alt=\"Image {{ i + 1 }}\" />\r\n </div>\r\n </div>\r\n </div>\r\n <button class=\"carousel-control-prev\" *ngIf=\"currentIndex > 0\" (click)=\"prevSlide()\">\r\n <span class=\"carousel-control-prev-icon\"></span>\r\n </button>\r\n \r\n <button class=\"carousel-control-next\" *ngIf=\"currentIndex < payload.refImage.length - 1\" (click)=\"nextSlide()\">\r\n <span class=\"carousel-control-next-icon\"></span>\r\n </button>\r\n \r\n <div *ngIf=\"payload.refImage.length > 1\" class=\"row\">\r\n <ul class=\"carousel-indicators\">\r\n <li *ngFor=\"let group of payload.refImage; let i = index\"\r\n [class.active]=\"i === currentIndex\"\r\n (click)=\"goToSlide(i)\">\r\n </li>\r\n </ul>\r\n </div>\r\n \r\n </div>\r\n </div>\r\n <div class=\"row px-5\"\r\n *ngIf=\"payload.inputData.answerType==='image'||payload.inputData.answerType==='descriptiveImage'||payload.inputData.answerType==='multipleImage'\">\r\n \r\n <div class=\"carousel\">\r\n <div class=\"carousel-inner\">\r\n <div\r\n class=\"carousel-item\"\r\n *ngFor=\"let group of payload.refImage; let i = index\"\r\n [class.active]=\"i === currentIndex\"\r\n >\r\n <div class=\"row\">\r\n \r\n <img src=\"{{environment.TraxAnswerCDN}}{{group}}\"\r\n class=\"image-thumb mb-8 d-block w-100 cursor-pointer\"\r\n alt=\"Image {{ i + 1 }}\" />\r\n </div>\r\n </div>\r\n </div>\r\n <button class=\"carousel-control-prev\" *ngIf=\"currentIndex > 0\" (click)=\"prevSlide()\">\r\n <span class=\"carousel-control-prev-icon\"></span>\r\n </button>\r\n \r\n <button class=\"carousel-control-next\" *ngIf=\"currentIndex < payload.refImage.length - 1\" (click)=\"nextSlide()\">\r\n <span class=\"carousel-control-next-icon\"></span>\r\n </button>\r\n \r\n <div *ngIf=\"payload.refImage.length > 1\" class=\"row\">\r\n <ul class=\"carousel-indicators\">\r\n <li *ngFor=\"let group of payload.refImage; let i = index\"\r\n [class.active]=\"i === currentIndex\"\r\n (click)=\"goToSlide(i)\">\r\n </li>\r\n </ul>\r\n </div>\r\n \r\n </div>\r\n </div>\r\n <div class=\"row px-5\"\r\n *ngIf=\"payload.inputData.answerType==='multiplechoicesingle'||payload.inputData.answerType==='yes/no'||payload.inputData.answerType==='date'||payload.inputData.answerType==='time' ||payload.inputData.answerType==='multiplechoicemultiple'||payload.inputData.answerType==='linearscale'||payload.inputData.answerType==='descriptive' \">\r\n <div class=\"row\" *ngFor=\"let item of payload.inputData.userAnswer\">\r\n <span class=\"mt-1\">{{item.answer}}</span>\r\n </div>\r\n </div> -->\r\n <div class=\"fv-row mb-3 fv-plugins-icon-container\" *ngIf=\"showcomment\">\r\n <label class=\"label-name my-2\">\r\n Task Comment\r\n </label>\r\n <textarea [formControl]=\"taskForm.controls.checklistDescription\"\r\n class=\"form-control form-control\" placeholder=\"Enter a comment\"\r\n name=\"Main entrance signage is cracked, and lights are flickering. Please retake the image\"\r\n rows=\"4\"></textarea>\r\n </div>\r\n <h3 class=\"mt-3 mb-3\">Configurations</h3>\r\n <div class=\"fv-row mb-3 fv-plugins-icon-container\">\r\n <label class=\"label-name my-2\">\r\n Response Type\r\n </label>\r\n <select (change)=\"onQuestionChange($event, i, j)\" formControlName=\"answerType\"\r\n class=\"form-select mb-5\">\r\n <option *ngFor=\"let answer of answerTypes\" [value]=\"answer.value\">\r\n {{answer.label}}</option>\r\n </select>\r\n\r\n </div>\r\n <div class=\"fv-row mb-3 fv-plugins-icon-container\"\r\n *ngIf=\"question.get('answerType')?.value !=='time'&&question.get('answerType')?.value !=='date'\">\r\n <label class=\"label-name1 my-3\">\r\n Answer Options\r\n </label>\r\n <div [id]=\"'question-' + i + j\" class=\"question-container mb-10\">\r\n <ng-container *ngIf=\"question.get('answerType')?.value === 'descriptive'\">\r\n <div class=\"d-flex mb-5\">\r\n <div class=\"form-check\">\r\n <input formControlName=\"descriptivetype\"\r\n class=\"form-check-input cursor-pointer\" type=\"radio\"\r\n value=\"text\" [id]=\"'descriptivetype_text' + i + j\">\r\n <label class=\"cursor-pointer dscriptiveType\"\r\n [for]=\"'descriptivetype_text' + i + j\">Text</label>\r\n </div>\r\n <div class=\"form-check ms-5\">\r\n <input formControlName=\"descriptivetype\"\r\n class=\"form-check-input cursor-pointer\" type=\"radio\"\r\n value=\"number\" [id]=\"'descriptivetype_number' + i + j\">\r\n <label class=\"cursor-pointer dscriptiveType\"\r\n [for]=\"'descriptivetype_number' + i + j\">Number</label>\r\n </div>\r\n </div>\r\n\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"question.get('answerType')?.value === 'yes/no'\">\r\n <ng-container\r\n *ngFor=\"let answer of getAnswers(i, j).controls; let k = index\">\r\n <ng-container [formGroup]=\"answer\">\r\n <div class=\"row\">\r\n <div class=\"col-12 mb-5\">\r\n <div class=\"input-group \">\r\n <input formControlName=\"answer\" type=\"text\"\r\n class=\"form-control\"\r\n placeholder=\"Enter answer here\">\r\n\r\n </div>\r\n <ng-container\r\n *ngIf=\"answer.get('answer')?.invalid && answer.get('answer')?.touched\">\r\n <div *ngIf=\"answer.get('answer')?.hasError('required')|| answer.get('answer')?.hasError('whitespace')\"\r\n class=\"text-danger mt-2\">* Answer is required</div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container\r\n *ngIf=\"question.get('answerType')?.value === 'multiplechoicesingle' || question.get('answerType')?.value === 'multiplechoicemultiple'\">\r\n <ng-container\r\n *ngFor=\"let answer of getAnswers(i, j).controls; let k = index\">\r\n <ng-container [formGroup]=\"answer\">\r\n <div class=\"row\">\r\n <div class=\"col-12 mb-5\">\r\n <div class=\"input-group \">\r\n <input formControlName=\"answer\" type=\"text\"\r\n class=\"form-control\"\r\n placeholder=\"Enter answer here\">\r\n\r\n <button *ngIf=\"isInvalidAnswer(i,j)\"\r\n class=\"btn btn-outline\" type=\"button\">\r\n <svg class=\"cursor-pointer\"\r\n (click)=\"onAnswerDelete(i, j, k)\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n matTooltip=\"Delete answer\"\r\n matTooltipPosition=\"above\"\r\n matTooltipClass=\"custom-test\" width=\"20\"\r\n height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path _ngcontent-ng-c1491044170=\"\"\r\n d=\"M15 5L5 15M5 5L15 15\" stroke=\"#667085\"\r\n stroke-width=\"1.66667\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"></path>\r\n </svg>\r\n </button>\r\n </div>\r\n <ng-container\r\n *ngIf=\"answer.get('answer')?.invalid && answer.get('answer')?.touched\">\r\n <div *ngIf=\"answer.get('answer')?.hasError('required')||answer.get('answer')?.hasError('whitespace')\"\r\n class=\"text-danger mt-2\">* Answer is required</div>\r\n </ng-container>\r\n </div>\r\n\r\n\r\n\r\n\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n\r\n\r\n <div (click)=\"addNewAnswer(i, j, 'multiplechoicesingle')\"\r\n class=\"add-reference-btn mb-5 d-flex justify-content-center\">\r\n Add More Answer\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container\r\n *ngIf=\"question.get('answerType')?.value === 'descriptiveImage' || question.get('answerType')?.value === 'image'\">\r\n\r\n\r\n\r\n <ng-container\r\n *ngFor=\"let answer of getAnswers(i, j).controls; let k = index\">\r\n <ng-container [formGroup]=\"answer\">\r\n <div class=\"row\">\r\n <div class=\"col-12 mb-5\">\r\n\r\n\r\n\r\n\r\n <div class=\"row\">\r\n <div class=\"col-6\">\r\n <div\r\n class=\"d-flex align-items-center justify-content-between\">\r\n\r\n\r\n <div>\r\n <div class=\"form-check form-switch ps-0\">\r\n <input\r\n [formControl]=\"question.controls.allowUploadfromGallery\"\r\n class=\"form-check-input me-3\"\r\n type=\"checkbox\" role=\"switch\"\r\n [id]=\"'allow_upload_from_gallery' + i + j\">\r\n <label\r\n class=\"form-check-label check-label\"\r\n [for]=\"'allow_upload_from_gallery' + i + j\">Allow\r\n upload from gallery</label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n\r\n\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"question.get('answerType')?.value === 'video'\">\r\n <div class=\"row\">\r\n <div class=\"col-12 mb-5\">\r\n <div class=\"form-check form-switch ps-0\">\r\n <input formControlName=\"allowUploadfromGallery\"\r\n class=\"form-check-input me-3\" type=\"checkbox\" role=\"switch\"\r\n [id]=\"'allow_upload_from_gallery' + i + j\">\r\n <label class=\"form-check-label check-label\"\r\n [for]=\"'allow_upload_from_gallery' + i + j\">Allow\r\n upload from gallery</label>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"question.get('answerType')?.value === 'multipleImage'\">\r\n <ng-container\r\n *ngFor=\"let answer of getAnswers(i, j).controls; let k = index\">\r\n <ng-container [formGroup]=\"answer\">\r\n <div class=\"row\">\r\n <div class=\"col-12 mb-5\">\r\n <div class=\"row\">\r\n <div class=\"col-6\">\r\n <div\r\n class=\"d-flex align-items-center justify-content-between\">\r\n <div>\r\n <div class=\"form-check form-switch ps-0\">\r\n <input\r\n [formControl]=\"question.controls.allowUploadfromGallery\"\r\n class=\"form-check-input me-3\"\r\n type=\"checkbox\" role=\"switch\"\r\n [id]=\"'allow_upload_from_gallery' + i + j\">\r\n <label\r\n class=\"form-check-label check-label\"\r\n [for]=\"'allow_upload_from_gallery' + i + j\">Allow\r\n upload from gallery</label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-6\"\r\n *ngIf=\"question.controls.descriptivetype\">\r\n <div class=\"d-flex align-items-center h-100\">\r\n <div class=\"form-check\">\r\n <input\r\n [formControl]=\"question.controls.descriptivetype\"\r\n class=\"form-check-input cursor-pointer\"\r\n type=\"radio\" value=\"text\"\r\n [id]=\"'descriptive_answer_validation_text' + i + j + k\">\r\n <label class=\"cursor-pointer dscriptiveType\"\r\n [for]=\"'descriptive_answer_validation_text' + i + j + k\">Text</label>\r\n </div>\r\n <div class=\"form-check ms-5\">\r\n <input\r\n [formControl]=\"question.controls.descriptivetype\"\r\n class=\"form-check-input cursor-pointer\"\r\n type=\"radio\" value=\"number\"\r\n [id]=\"'descriptive_answer_validation_number' + i + j + k\">\r\n <label class=\"cursor-pointer dscriptiveType\"\r\n [for]=\"'descriptive_answer_validation_number' + i + j + k\">Number</label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n\r\n\r\n </ng-container>\r\n\r\n <ng-container\r\n *ngIf=\"question.get('answerType')?.value === 'date' || question.get('answerType')?.value === 'time'\">\r\n\r\n\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"question.get('answerType')?.value === 'linearscale'\">\r\n <ng-container\r\n *ngFor=\"let answer of getAnswers(i, j).controls; let k = index\">\r\n <ng-container [formGroup]=\"answer\">\r\n <div class=\"col-4\">\r\n <div class=\"d-flex justify-content-between align-items-center \">\r\n <div class=\"me-2\">\r\n <input type=\"number\" formControlName=\"rangeStart\"\r\n class=\"form-control\">\r\n </div>\r\n <div class=\"me-2 check-label\">\r\n to\r\n </div>\r\n <div>\r\n <input type=\"number\" formControlName=\"rangeEnd\"\r\n class=\"form-control\">\r\n </div>\r\n\r\n </div>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n\r\n\r\n </div>\r\n\r\n\r\n\r\n\r\n\r\n\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n <div class=\"row mb-3 fv-plugins-icon-container \">\r\n <div class=\"col-md-6\">\r\n <label class=\"label-name my-2\">\r\n Due date\r\n </label>\r\n\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"\r\n fill=\"none\">\r\n <path\r\n d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <input class=\"fx-date-range form-control ps-14\" type=\"text\" matInput ngxDaterangepickerMd\r\n [drops]=\"'down'\" [opens]=\"'right'\" [showCustomRangeLabel]=\"false\"\r\n [alwaysShowCalendars]=\"false\" [autoApply]=\"true\" [singleDatePicker]=\"true\"\r\n [ngModelOptions]=\"{standalone: true}\" [keepCalendarOpeningWithRange]=\"true\"\r\n [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDate\"\r\n (startDateChanged)=\"onStartDateChange($event)\" [isCustomDate]=\"isCustomDate\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n (datesUpdated)=\"datechange($event)\" name=\"daterange\" [readonly]=\"true\" />\r\n </div>\r\n </div>\r\n <div class=\"col-md-6\">\r\n <label class=\"label-name my-2\">Due time</label>\r\n <div class=\"position-relative w-100\">\r\n <button type=\"button\" (click)=\"openDropdown($event)\"\r\n class=\"btn btn-default w-100 btn-outline btn-outline-default rounded-3 mt-1 text-nowrap border-val d-flex justify-content-between h-45px\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"\r\n fill=\"none\">\r\n <path\r\n d=\"M13.3333 1.6665V4.99984M6.66667 1.6665V4.99984M2.5 8.33317H17.5M4.16667 3.33317H15.8333C16.7538 3.33317 17.5 4.07936 17.5 4.99984V16.6665C17.5 17.587 16.7538 18.3332 15.8333 18.3332H4.16667C3.24619 18.3332 2.5 17.587 2.5 16.6665V4.99984C2.5 4.07936 3.24619 3.33317 4.16667 3.33317Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span class=\"ps-12\">{{ selectedItem }}</span>\r\n </button>\r\n <div *ngIf=\"dropDown\"\r\n class=\"card py-1 w-100 position-absolute z-1 h-200px scroll-y top-50px end-0\">\r\n <ul class=\"list-unstyled\">\r\n <li *ngFor=\"let item of timeDetails\"\r\n [ngClass]=\"selectedItem === item.text ? 'active' : ''\"\r\n class=\"camera px-5 items fw-semibold cursor-pointer py-2\"\r\n [class.disabled]=\"isDisabled(item.text)\" (click)=\"selectItem(item.text)\">\r\n {{ item.text }}\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n <div class=\"fv-row row mb-3 fv-plugins-icon-container\">\r\n <div class=\"col-md-6\">\r\n <label class=\"label-name my-2\">\r\n Priority\r\n </label>\r\n\r\n <lib-reactive-select [formControl]=\"selectedlistselectControl\" [idField]=\"'value'\"\r\n [nameField]=\"'label'\" [data]=\"priorityTypeList\"\r\n (itemChange)=\"filterChange($event)\"></lib-reactive-select>\r\n </div>\r\n <div class=\"col-md-6\">\r\n\r\n <label class=\"label-name my-2\">\r\n Assign to\r\n </label>\r\n\r\n <div *ngIf=\"filtertype==='Teams'\">\r\n <lib-disabled-select [items]=\"payload.selectedUsers\" [multi]=\"true\"\r\n [searchField]=\"'userName'\" [idField]=\"'userName'\" [dropDowndisabled]=\"true\"\r\n [selectedValues]=\"payload.selectedUsers\"></lib-disabled-select>\r\n </div>\r\n <div *ngIf=\"filtertype==='Clusters'\">\r\n <lib-disabled-select [items]=\"payload.selectedStores\" [multi]=\"true\"\r\n [searchField]=\"'storeName'\" [idField]=\"'storeName'\" [dropDowndisabled]=\"true\"\r\n [selectedValues]=\"payload.selectedStores\"></lib-disabled-select>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"fv-row my-3 fv-plugins-icon-container\">\r\n <div class=\"border-attach col-md-3 cursor-pointer\" *ngIf=\"this.uploadedFiles.length<3\"\r\n (click)=\"fileInput.click()\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M17.8666 9.2081L10.2082 16.8664C9.27005 17.8046 7.99757 18.3317 6.67075 18.3317C5.34393 18.3317 4.07145 17.8046 3.13325 16.8664C2.19505 15.9282 1.66797 14.6558 1.66797 13.3289C1.66797 12.0021 2.19505 10.7296 3.13325 9.79144L10.7916 2.1331C11.4171 1.50763 12.2654 1.15625 13.1499 1.15625C14.0345 1.15625 14.8828 1.50763 15.5082 2.1331C16.1337 2.75857 16.4851 3.60689 16.4851 4.49144C16.4851 5.37598 16.1337 6.2243 15.5082 6.84977L7.84158 14.5081C7.52885 14.8208 7.10469 14.9965 6.66242 14.9965C6.22014 14.9965 5.79598 14.8208 5.48325 14.5081C5.17051 14.1954 4.99482 13.7712 4.99482 13.3289C4.99482 12.8867 5.17051 12.4625 5.48325 12.1498L12.5582 5.0831\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"ms-3\">Add Attachment</span>\r\n <input #fileInput type=\"file\" accept=\".png, .jpg, .jpeg, .svg, .gif\"\r\n (change)=\"uploadFile($event,0,0,0)\" hidden />\r\n </div>\r\n <div class=\"row\">\r\n <div class=\"col-md-4 image-preview mt-2\" *ngFor=\"let item of uploadedFiles; let i = index\">\r\n <button class=\"remove-icon\" (click)=\"removeImage(i)\">\u2716</button>\r\n <img [src]=\"item\" alt=\"Preview\" />\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"mt-3\">\r\n <div class=\"form-check mb-3 p-3 border rounded option-box\"\r\n [ngClass]=\"{ 'active-option': allowedStoreLocation}\">\r\n <div class=\"form-check form-switch ps-0 my-2\">\r\n <input class=\"form-check-input my-5 mx-3 cursor-pointer ps-0\" type=\"checkbox\"\r\n id=\"flexSwitchCheckDefault\" [checked]=\"allowedStoreLocation\"\r\n (change)=\"togglegeofencing($event)\">\r\n <span class=\"fw-bold\" for=\"sameComment\"> Geo fencing</span>\r\n <div class=\"text-muted medium mt-1 ms-10\">\r\n By enabling, the checklist can be filled by the user only when inside the store.\r\n </div>\r\n </div>\r\n\r\n\r\n </div>\r\n\r\n <div class=\"form-check p-3 border rounded option-box\"\r\n [ngClass]=\"{ 'active-option': restrictAttendance }\">\r\n <div class=\"form-check form-switch ps-0 my-2\">\r\n <input class=\"form-check-input my-5 mx-3 form-switch ps-0\" type=\"checkbox\"\r\n id=\"flexSwitchCheckDefault\" [checked]=\"restrictAttendance\"\r\n (change)=\"toggleAttendance($event)\">\r\n <span class=\"fw-bold\" for=\"sameComment\">Restrict attendance</span>\r\n <div class=\"text-muted medium mt-1 ms-10\">\r\n By enabling, user can't be able to clockout without completing the task.\r\n </div>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n\r\n </form>\r\n\r\n </div>\r\n <div class=\" w-100 modal-footer px-0 pt-3 pb-5\">\r\n <div role=\"group\" class=\"d-flex mt-3 w-100\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button id=\"alert-toast\" class=\"btn btn-primary w-100 ms-3\"\r\n [disabled]=\"!this.taskForm.valid||submitted||payload.selectedStores.length===0&&payload.selectedUsers.length===0\"\r\n (click)=\"onSubmit()\">Create\r\n Task</button>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n <div *ngIf=\"type ==='redo'\" class=\"card-body py-0 d-flex flex-start flex-column p-9 scroll \">\r\n <div class=\"my-5\">\r\n <div class=\"symbol symbol-75px symbol-circle d-flex \">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M39 19.9996V25.9996M39 25.9996H33M39 25.9996L34.36 21.6396C33.2853 20.5643 31.9556 19.7788 30.4952 19.3564C29.0348 18.9339 27.4911 18.8883 26.0083 19.2238C24.5255 19.5594 23.1518 20.265 22.0155 21.275C20.8791 22.285 20.0172 23.5664 19.51 24.9996M17 35.9996V29.9996M17 29.9996H23M17 29.9996L21.64 34.3596C22.7147 35.4349 24.0444 36.2204 25.5048 36.6428C26.9652 37.0652 28.5089 37.1108 29.9917 36.7753C31.4745 36.4398 32.8482 35.7342 33.9845 34.7242C35.1209 33.7142 35.9828 32.4328 36.49 30.9996\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <h3 class=\"text-capitalize mx-3 mt-3\"> {{type}}</h3>\r\n </div>\r\n </div>\r\n <ng-container *ngFor=\"let section of getSections?.controls; let i = index\">\r\n <ng-container [formGroup]=\"section\">\r\n <ng-container *ngFor=\"let question of getQuestions(i)?.controls; let j = index\">\r\n <ng-container [formGroup]=\"question\">\r\n\r\n <div class=\"modal-body scroll-y w-100 p-1\">\r\n <h5 class=\"label-name1 my-2\">\r\n Redo\r\n </h5>\r\n <div class=\"fv-row mb-3 fv-plugins-icon-container\">\r\n <div class=\"container\">\r\n <p class=\"text-gray-600 mb-2\">This Task is linked to</p>\r\n\r\n <div class=\"mb-2\">\r\n <span class=\"label\">Checklist Name <span class=\"ms-6\">:</span></span>\r\n <span class=\"value ms-9\">{{payload.checklistName}}</span>\r\n </div>\r\n\r\n <div class=\"mb-2 d-flex\">\r\n <span class=\"label me-1\">Question <span class=\"ms-20\">:</span></span>\r\n <div class=\"text-gray-500\">\r\n {{question.get('qno')?.value}}.\r\n {{question.get('qname')?.value}}\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"payload.coverage==='store'\">\r\n <span class=\"label\">Stores Selected <span class=\"ms-9\">:</span></span>\r\n <span class=\"value ms-8\">{{payload.selectedStores.length}} stores</span>\r\n </div>\r\n <div *ngIf=\"payload.coverage==='user'\">\r\n <span class=\"label\">users Selected<span class=\"ms-9\">:</span></span>\r\n <span class=\"value ms-8\">{{payload.selectedUsers.length}} users</span>\r\n </div>\r\n </div>\r\n\r\n\r\n </div>\r\n\r\n <form [formGroup]=\"taskForm\">\r\n\r\n <div class=\"fv-row mb-3 fv-plugins-icon-container\" *ngIf=\"showcomment\">\r\n <label class=\"label-name my-2\">\r\n Your Comment\r\n </label>\r\n <textarea [formControl]=\"taskForm.controls.checklistDescription\"\r\n class=\"form-control form-control\" placeholder=\"Enter a comment\"\r\n name=\"Main entrance signage is cracked, and lights are flickering. Please retake the image\"\r\n rows=\"4\"></textarea>\r\n </div>\r\n\r\n\r\n <div class=\"fv-row mb-3 fv-plugins-icon-container\">\r\n <label class=\"label-name my-2\">\r\n Assign to\r\n </label>\r\n <!-- <input type=\"text\" class=\"form-control\" [value]=\"this.checklistInfo?.submittedBy\"\r\n [disabled]=\"true\"> -->\r\n <div *ngIf=\"filtertype==='Teams'\">\r\n <lib-disabled-select [items]=\"payload.selectedUsers\" [multi]=\"true\"\r\n [searchField]=\"'userName'\" [idField]=\"'userName'\" [dropDowndisabled]=\"true\"\r\n [selectedValues]=\"payload.selectedUsers\"></lib-disabled-select>\r\n </div>\r\n <div *ngIf=\"filtertype==='Clusters'\">\r\n <lib-disabled-select [items]=\"payload.selectedStores\" [multi]=\"true\"\r\n [searchField]=\"'storeName'\" [idField]=\"'storeName'\"\r\n [dropDowndisabled]=\"true\"\r\n [selectedValues]=\"payload.selectedStores\"></lib-disabled-select>\r\n </div>\r\n\r\n </div>\r\n <div class=\"mt-5 w-100\">\r\n <div role=\"group\" class=\"d-flex mt-3 mb-15\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button id=\"alert-toast\" class=\"btn btn-primary w-100 ms-3\"\r\n [disabled]=\"submitted||payload.selectedStores.length===0&&payload.selectedUsers.length===0\"\r\n (click)=\"onSubmit()\">Submit</button>\r\n </div>\r\n </div>\r\n\r\n\r\n </form>\r\n\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n\r\n </div>\r\n</div>", styles: [".carousel{position:relative}.carousel-item{display:none;transition:opacity .5s}.carousel-item.active{display:block;opacity:1}.option-box{transition:border-color .3s,background-color .3s;cursor:pointer}.option-box:hover{border-color:#008edf}.active-option{border-color:#008edf!important;color:#008edf!important;background-color:#e7f1ff}.carousel-control-prev,.carousel-control-next{position:absolute;top:50%;transform:translateY(-50%);border:none;padding:10px;cursor:pointer}.carousel-control-prev{left:0}.carousel-control-next{right:0}.carousel-indicators{position:absolute;left:35%;transform:translate(-50%);gap:10px}.carousel-indicators li{list-style:none!important;width:10px;height:10px;background-color:#ddd;border-radius:50%;cursor:pointer;transition:background-color .3s}.carousel-indicators li.active{background-color:#007bff}.carousel-control-prev-icon,.carousel-control-next-icon{display:inline-block;width:25rem!important;height:25rem!important;background-repeat:no-repeat;background-position:50%;background-size:100% 100%}.image-thumb{height:auto;border-radius:8px}.dropselect{color:var(--Gray-500, #344054);font-family:Inter;font-size:14px;font-style:normal;font-weight:500;line-height:18px;white-space:nowrap}.nodata-title{font-size:14px!important;font-weight:600}.carousel-control-prev-icon,.carousel-control-next-icon{color:#fff!important}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .md-drppicker.shown.drops-down-right{transform-origin:0 0}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.show-ranges.shown{top:65px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}:host::ng-deep .daterangepicker{position:fixed!important;top:30%!important;left:50%!important;transform:translate(-50%);z-index:1050!important}:host::ng-deep .label{color:var(--Gray-700, #344054);font-size:14px;width:200px}:host::ng-deep .value{font-weight:600;font-size:16px}\n"] }]
9205
9208
  }], ctorParameters: () => [{ type: i1.FormBuilder }, { type: i2.NgbActiveModal }, { type: i2$2.GlobalStateService }, { type: TraxService }, { type: i0.ChangeDetectorRef }, { type: i2.NgbModal }, { type: i1$2.Router }, { type: i3.ToastService }], propDecorators: { type: [{
9206
9209
  type: Input
9207
9210
  }], sourceCheckList_id: [{
@@ -9273,6 +9276,10 @@ class BulkcreationmodelComponent {
9273
9276
  });
9274
9277
  }
9275
9278
  }
9279
+ preventEnter(event) {
9280
+ event.preventDefault();
9281
+ event.stopPropagation();
9282
+ }
9276
9283
  taskcreationPopup(showcomment) {
9277
9284
  this.activeModal.close('submit');
9278
9285
  const modalRef = this.modalService.open(AddMultitaskComponent, {
@@ -9289,13 +9296,14 @@ class BulkcreationmodelComponent {
9289
9296
  modalRef.componentInstance.excelData = this.excelData;
9290
9297
  modalRef.result.then((result) => {
9291
9298
  console.log(result);
9292
- if (result == 'submit') {
9299
+ if (result === 'submit') {
9300
+ console.log("1111");
9293
9301
  this.activeModal.close('submit');
9294
9302
  }
9295
9303
  });
9296
9304
  }
9297
9305
  closeactivepopup() {
9298
- this.activeModal.close('submit');
9306
+ this.activeModal.close();
9299
9307
  this.modalService.dismissAll();
9300
9308
  }
9301
9309
  validateDetails() {
@@ -9380,45 +9388,18 @@ class BulkcreationmodelComponent {
9380
9388
  });
9381
9389
  });
9382
9390
  }
9383
- const worksheet = XLSX.utils.json_to_sheet(excelData);
9384
- const range = XLSX.utils.decode_range(worksheet['!ref']);
9385
- // Read-only style (for all columns except comments)
9386
- const readOnlyStyle = {
9387
- font: { bold: true, color: { rgb: 'FF0000' } },
9388
- fill: { fgColor: { rgb: 'F5F5F5' } },
9389
- border: {
9390
- top: { style: 'thin', color: { rgb: 'AAAAAA' } },
9391
- bottom: { style: 'thin', color: { rgb: 'AAAAAA' } },
9392
- left: { style: 'thin', color: { rgb: 'AAAAAA' } },
9393
- right: { style: 'thin', color: { rgb: 'AAAAAA' } },
9391
+ this.payload.excelData = excelData;
9392
+ this.traxService.downloadtemplate(this.payload)
9393
+ .pipe(takeUntil(this.destroy$))
9394
+ .subscribe({
9395
+ next: (res) => {
9396
+ this.traxService.saveAsExcelFile(res, `Bulk ${this.type}`);
9394
9397
  },
9395
- };
9396
- // Identify comment column index
9397
- const headers = Object.keys(excelData[0]);
9398
- const commentColIndex = headers.findIndex(h => h.toLowerCase() === 'comments');
9399
- // Apply style to all non-comment cells
9400
- for (let R = range.s.r + 1; R <= range.e.r; ++R) {
9401
- for (let C = range.s.c; C <= range.e.c; ++C) {
9402
- if (C !== commentColIndex) {
9403
- const cellRef = XLSX.utils.encode_cell({ r: R, c: C });
9404
- if (worksheet[cellRef]) {
9405
- worksheet[cellRef].s = readOnlyStyle;
9406
- }
9407
- }
9398
+ error: (e) => {
9399
+ // this.toast.getErrorToast('Something went Wrong..')
9408
9400
  }
9409
- }
9410
- const workbook = {
9411
- Sheets: { Sheet1: worksheet },
9412
- SheetNames: ['Sheet1'],
9413
- };
9414
- // You must enable styles in XLSX.write
9415
- const excelBuffer = XLSX.write(workbook, {
9416
- bookType: 'xlsx',
9417
- type: 'array',
9418
- cellStyles: true, // ⚠️ Enable styles
9419
9401
  });
9420
9402
  // Export the file
9421
- this.traxService.saveAsExcelFile(excelBuffer, `Bulk ${this.type}`);
9422
9403
  }
9423
9404
  afterUplload(data) {
9424
9405
  this.activeModal.close('submit');
@@ -9504,11 +9485,11 @@ class BulkcreationmodelComponent {
9504
9485
  }
9505
9486
  }
9506
9487
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: BulkcreationmodelComponent, deps: [{ token: i2.NgbModal }, { token: i2.NgbActiveModal }, { token: TraxService }, { token: i3.ToastService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
9507
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: BulkcreationmodelComponent, selector: "lib-bulkcreationmodel", inputs: { payload: "payload", taskDetails: "taskDetails", checklistInfo: "checklistInfo", type: "type", sourceCheckList_id: "sourceCheckList_id", filtertype: "filtertype" }, viewQueries: [{ propertyName: "bulkupload", first: true, predicate: ["bulkupload"], descendants: true }, { propertyName: "fileInput", first: true, predicate: ["file"], descendants: true }, { propertyName: "fileInput1", first: true, predicate: ["file1"], descendants: true }, { propertyName: "afterValidation", first: true, predicate: ["afterValidation"], descendants: true }], ngImport: i0, template: "<div class=\"card group-delete py-0\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"my-5 mb-5\">\r\n <div class=\"symbol symbol-75px symbol-circle d-flex \">\r\n <svg *ngIf=\"type==='task'\" xmlns=\"http://www.w3.org/2000/svg\" width=\"56\" height=\"56\" viewBox=\"0 0 56 56\"\r\n fill=\"none\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M30 18H22C21.4696 18 20.9609 18.2107 20.5858 18.5858C20.2107 18.9609 20 19.4696 20 20V36C20 36.5304 20.2107 37.0391 20.5858 37.4142C20.9609 37.7893 21.4696 38 22 38H34C34.5304 38 35.0391 37.7893 35.4142 37.4142C35.7893 37.0391 36 36.5304 36 36V24M30 18L36 24M30 18V24H36M28 34V28M25 31H31\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <svg *ngIf=\"type==='redo'\" xmlns=\"http://www.w3.org/2000/svg\" width=\"56\" height=\"56\" viewBox=\"0 0 56 56\"\r\n fill=\"none\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M39 19.9996V25.9996M39 25.9996H33M39 25.9996L34.36 21.6396C33.2853 20.5643 31.9556 19.7788 30.4952 19.3564C29.0348 18.9339 27.4911 18.8883 26.0083 19.2238C24.5255 19.5594 23.1518 20.265 22.0155 21.275C20.8791 22.285 20.0172 23.5664 19.51 24.9996M17 35.9996V29.9996M17 29.9996H23M17 29.9996L21.64 34.3596C22.7147 35.4349 24.0444 36.2204 25.5048 36.6428C26.9652 37.0652 28.5089 37.1108 29.9917 36.7753C31.4745 36.4398 32.8482 35.7342 33.9845 34.7242C35.1209 33.7142 35.9828 32.4328 36.49 30.9996\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <h3 class=\"text-capitalize mx-3 mt-3\"> {{type}}</h3>\r\n </div>\r\n </div>\r\n <div class=\"form-check mb-3 p-3 border rounded option-box\"\r\n [ngClass]=\"{ 'active-option': selectedOption === 'same' }\" (click)=\"setOption('same')\">\r\n <input class=\"form-check-input my-5 mx-3\" type=\"radio\" name=\"taskOption\" id=\"sameComment\"\r\n [checked]=\"selectedOption === 'same'\">\r\n <div class=\"mx-3\">\r\n <label class=\"fw-semibold\" for=\"sameComment\">\r\n Create {{type}} with same comment\r\n </label>\r\n <div [ngClass]=\"selectedOption === 'same' ? 'active-option' : 'text-normal'\" class=\"small mt-1 ms-10\">\r\n Apply a single comment to all selected stores. This option is useful when the {{type}} details are identical\r\n for\r\n every store.\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"form-check p-3 border rounded option-box\"\r\n [ngClass]=\"{ 'active-option': selectedOption === 'different' }\" (click)=\"setOption('different')\">\r\n <input class=\"form-check-input my-5 mx-3\" type=\"radio\" name=\"taskOption\" id=\"differentComments\"\r\n [checked]=\"selectedOption === 'different'\">\r\n <div class=\"mx-3\">\r\n <label class=\"fw-semibold\" for=\"differentComments\">\r\n Create {{type}} with different comments <span class=\"text-muted\">(via Excel upload)</span>\r\n </label>\r\n <div [ngClass]=\"selectedOption === 'different' ? 'active-option' : 'text-normal'\" class=\" small mt-1 ms-10\">\r\n Use an Excel template to assign different comments to each selected store. This allows you to customize the\r\n {{type}} for each location.\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"fw-semibold mt-3 mb-2\" *ngIf=\"type==='redo'&&this.payload?.selectedUsers?.length===0&&this.payload?.selectedStores?.length==0\">\r\n <div class=\"d-flex\">\r\n <div><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"36\" height=\"36\" viewBox=\"0 0 36 36\" fill=\"none\">\r\n <rect x=\"2\" y=\"2\" width=\"32\" height=\"32\" rx=\"16\" fill=\"#FEF0C7\" />\r\n <rect x=\"2\" y=\"2\" width=\"32\" height=\"32\" rx=\"16\" stroke=\"#FFFAEB\" stroke-width=\"4\" />\r\n <path\r\n d=\"M18.0005 15.3341V18.0008M18.0005 20.6675H18.0072M16.8605 11.9075L11.2138 21.3341C11.0974 21.5357 11.0358 21.7643 11.0352 21.9971C11.0345 22.2299 11.0948 22.4589 11.2101 22.6611C11.3254 22.8634 11.4917 23.032 11.6923 23.15C11.893 23.2681 12.121 23.3316 12.3538 23.3341H23.6472C23.88 23.3316 24.108 23.2681 24.3087 23.15C24.5094 23.032 24.6756 22.8634 24.7909 22.6611C24.9062 22.4589 24.9665 22.2299 24.9658 21.9971C24.9652 21.7643 24.9036 21.5357 24.7872 21.3341L19.1405 11.9075C19.0217 11.7115 18.8543 11.5495 18.6546 11.4371C18.4549 11.3247 18.2297 11.2656 18.0005 11.2656C17.7713 11.2656 17.5461 11.3247 17.3464 11.4371C17.1467 11.5495 16.9793 11.7115 16.8605 11.9075Z\"\r\n stroke=\"#DC6803\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></div>\r\n <div class=\"ms-2\">Redo will apply only to the checklist response submitted on today. Any responses submitted on\r\n previous dates will be unselected and excluded from redo.</div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"modal-footer col-md-12 text-end border-top-0\">\r\n <button type=\"button\" class=\"btn btn-outline\" (click)=\"closeactivepopup()\" data-bs-dismiss=\"modal\">Cancel</button>\r\n <button type=\"button\" [disabled]=\"this.payload?.selectedUsers?.length===0&&this.payload?.selectedStores?.length==0\" class=\"btn btn-primary\" (click)=\"proceed()\">Proceed</button>\r\n </div>\r\n\r\n </div>\r\n</div>\r\n\r\n\r\n\r\n<ng-template #bulkupload let-model>\r\n <div class=\"card border-0\">\r\n <div class=\"card-header border-0 mt-5\">\r\n <div class=\"card-title mt-3\">\r\n <div class=\"bg-light-primary rounded-5 w-40px h-40px d-flex justify-content-center align-items-center\">\r\n <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M30 18H22C21.4696 18 20.9609 18.2107 20.5858 18.5858C20.2107 18.9609 20 19.4696 20 20V36C20 36.5304 20.2107 37.0391 20.5858 37.4142C20.9609 37.7893 21.4696 38 22 38H34C34.5304 38 35.0391 37.7893 35.4142 37.4142C35.7893 37.0391 36 36.5304 36 36V24M30 18L36 24M30 18V24H36M28 34V28M25 31H31\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </div> <span class=\"config-heading fw-semibold ms-5 w-auto text-capitalize\">{{type}}</span>\r\n </div>\r\n </div>\r\n <div class=\"card-body pt-0\">\r\n <div class=\"flex-column\">\r\n <div class=\"storeAssign mt-3\" style=\"font-weight: 400\">1. Use the template to upload and create multiple\r\n {{type}}s at once.</div>\r\n <div class=\"storeAssign mt-3\" style=\"font-weight: 400\">2. Download the template here - <a\r\n class=\"text-decoration-underline cursor-pointer\" (click)=\"downloadTemplate()\">Download Prefilled\r\n Template</a>\r\n </div>\r\n <div class=\"storeAssign mt-3\" style=\"font-weight: 400\">3. Add your data to the Template File</div>\r\n <div class=\"storeAssign mt-3\" style=\"font-weight: 400\">4. Upload it below for processing</div>\r\n\r\n\r\n </div>\r\n </div>\r\n <div class=\"card-footer border-0 text-end pt-0\">\r\n <button class=\"btn btn-md btn-default btn-outline\" (click)=\"modalRef.close()\">Cancel</button>\r\n <button class=\"btn btn-md py-3 btn-default ms-3 btn-primary\" (click)=\"file1.click()\">Upload</button>\r\n <input style=\"visibility: hidden;\" #file1 type=\"file\" id=\"kt_account_team_size_select_2\"\r\n (change)=\"onFileUpload($event,'upload')\" />\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #afterValidation let-model>\r\n <div class=\"card border-0\">\r\n <div class=\"card-header border-0 mt-0\">\r\n <div class=\"my-5 mb-5\">\r\n <div class=\"symbol symbol-75px symbol-circle d-flex \">\r\n <svg *ngIf=\"type==='task'\" xmlns=\"http://www.w3.org/2000/svg\" width=\"56\" height=\"56\" viewBox=\"0 0 56 56\"\r\n fill=\"none\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M30 18H22C21.4696 18 20.9609 18.2107 20.5858 18.5858C20.2107 18.9609 20 19.4696 20 20V36C20 36.5304 20.2107 37.0391 20.5858 37.4142C20.9609 37.7893 21.4696 38 22 38H34C34.5304 38 35.0391 37.7893 35.4142 37.4142C35.7893 37.0391 36 36.5304 36 36V24M30 18L36 24M30 18V24H36M28 34V28M25 31H31\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <svg *ngIf=\"type==='redo'\" xmlns=\"http://www.w3.org/2000/svg\" width=\"56\" height=\"56\" viewBox=\"0 0 56 56\"\r\n fill=\"none\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M39 19.9996V25.9996M39 25.9996H33M39 25.9996L34.36 21.6396C33.2853 20.5643 31.9556 19.7788 30.4952 19.3564C29.0348 18.9339 27.4911 18.8883 26.0083 19.2238C24.5255 19.5594 23.1518 20.265 22.0155 21.275C20.8791 22.285 20.0172 23.5664 19.51 24.9996M17 35.9996V29.9996M17 29.9996H23M17 29.9996L21.64 34.3596C22.7147 35.4349 24.0444 36.2204 25.5048 36.6428C26.9652 37.0652 28.5089 37.1108 29.9917 36.7753C31.4745 36.4398 32.8482 35.7342 33.9845 34.7242C35.1209 33.7142 35.9828 32.4328 36.49 30.9996\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <h3 class=\"text-capitalize mx-3 mt-3\"> {{type}}</h3>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"card-body pt-0\">\r\n <div class=\"row\">\r\n <div class=\"col-sm-4\">\r\n <div class=\"popup-card rounded-3 p-3 flex-column h-80px\">\r\n <div class=\"fw-semibold config-heading w-100\">{{getStoreCounts(excelData)}}</div>\r\n <div class=\"fw-semibold subtitle mt-1\">Total <span *ngIf=\"this.payload.coverage==='store'\">Stores</span>\r\n <span *ngIf=\"this.payload.coverage==='users'\">Users</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <div class=\"popup-card rounded-3 p-3 flex-column h-80px\">\r\n <div class=\"fw-semibold config-heading w-100\">{{excelData?.length}}</div>\r\n <div class=\"fw-semibold subtitle mt-1\">Rows processed</div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <div class=\"popup-card rounded-3 p-3 flex-column h-80px\">\r\n <div [ngClass]=\"excelError ? 'error-heading':''\" class=\"fw-semibold config-heading w-100\">\r\n {{excelError?.error?.length || 0}}</div>\r\n <div [ngClass]=\"excelError ? 'excel-error':''\" class=\"fw-semibold subtitle mt-1\">Error</div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"excelError\" class=\"flex-column mt-5\">\r\n <div class=\"config-heading fw-bold\">Invalid Details !</div>\r\n <div class=\"subtitle mt-5\">Please provide correct and complete layout information.</div>\r\n <div class=\"p-5 w-100 rounded-3 border-error mt-5 flex-column\">\r\n <div *ngFor=\"let error of excelError?.error; let i = index; let last = last\" [ngClass]=\"!last ? 'mb-2' : ''\"\r\n class=\"text-error\">{{i + 1}}) {{error}}</div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n <div class=\"card-footer border-0 text-end pt-0\">\r\n <button class=\"btn btn-md btn-default btn-outline\" (click)=\"closeactivepopup()\">Cancel</button>\r\n <button *ngIf=\"!excelError\" class=\"btn btn-md py-4 btn-default ms-3 btn-primary\"\r\n (click)=\"validateDetails()\">Proceed</button>\r\n <button *ngIf=\"excelError\" class=\"btn py-3 btn-md btn-default ms-3 btn-danger\"\r\n (click)=\"Reupload();\">Reupload</button>\r\n <input style=\"visibility: hidden;\" #file1 type=\"file\" id=\"kt_account_team_size_select_2\"\r\n (change)=\"onFileUpload($event,'reupload')\" />\r\n </div>\r\n </div>\r\n</ng-template>", styles: [".option-box{transition:border-color .3s,background-color .3s;cursor:pointer}.option-box:hover{border-color:#0d6efd}.active-option{border-color:#008edf!important;color:#008edf!important;background-color:#e7f1ff}.text-normal{color:var(--Gray-500, #667085);font-size:12px;font-weight:400;line-height:18px}\n"], dependencies: [{ kind: "directive", type: i6.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
9488
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: BulkcreationmodelComponent, selector: "lib-bulkcreationmodel", inputs: { payload: "payload", taskDetails: "taskDetails", checklistInfo: "checklistInfo", type: "type", sourceCheckList_id: "sourceCheckList_id", filtertype: "filtertype" }, viewQueries: [{ propertyName: "bulkupload", first: true, predicate: ["bulkupload"], descendants: true }, { propertyName: "fileInput", first: true, predicate: ["file"], descendants: true }, { propertyName: "fileInput1", first: true, predicate: ["file1"], descendants: true }, { propertyName: "afterValidation", first: true, predicate: ["afterValidation"], descendants: true }], ngImport: i0, template: "<div class=\"card group-delete py-0\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"my-5 mb-5\">\r\n <div class=\"symbol symbol-75px symbol-circle d-flex \">\r\n <svg *ngIf=\"type==='task'\" xmlns=\"http://www.w3.org/2000/svg\" width=\"56\" height=\"56\" viewBox=\"0 0 56 56\"\r\n fill=\"none\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M30 18H22C21.4696 18 20.9609 18.2107 20.5858 18.5858C20.2107 18.9609 20 19.4696 20 20V36C20 36.5304 20.2107 37.0391 20.5858 37.4142C20.9609 37.7893 21.4696 38 22 38H34C34.5304 38 35.0391 37.7893 35.4142 37.4142C35.7893 37.0391 36 36.5304 36 36V24M30 18L36 24M30 18V24H36M28 34V28M25 31H31\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <svg *ngIf=\"type==='redo'\" xmlns=\"http://www.w3.org/2000/svg\" width=\"56\" height=\"56\" viewBox=\"0 0 56 56\"\r\n fill=\"none\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M39 19.9996V25.9996M39 25.9996H33M39 25.9996L34.36 21.6396C33.2853 20.5643 31.9556 19.7788 30.4952 19.3564C29.0348 18.9339 27.4911 18.8883 26.0083 19.2238C24.5255 19.5594 23.1518 20.265 22.0155 21.275C20.8791 22.285 20.0172 23.5664 19.51 24.9996M17 35.9996V29.9996M17 29.9996H23M17 29.9996L21.64 34.3596C22.7147 35.4349 24.0444 36.2204 25.5048 36.6428C26.9652 37.0652 28.5089 37.1108 29.9917 36.7753C31.4745 36.4398 32.8482 35.7342 33.9845 34.7242C35.1209 33.7142 35.9828 32.4328 36.49 30.9996\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <h3 class=\"text-capitalize mx-3 mt-3\"> {{type}}</h3>\r\n </div>\r\n </div>\r\n <div class=\"form-check mb-3 p-3 border rounded option-box\"\r\n [ngClass]=\"{ 'active-option': selectedOption === 'same' }\" (click)=\"setOption('same')\">\r\n <input class=\"form-check-input my-5 mx-3\" type=\"radio\" name=\"taskOption\" id=\"sameComment\"\r\n [checked]=\"selectedOption === 'same'\">\r\n <div class=\"mx-3\">\r\n <label class=\"fw-semibold\" for=\"sameComment\">\r\n Create {{type}} with same comment\r\n </label>\r\n <div [ngClass]=\"selectedOption === 'same' ? 'active-option' : 'text-normal'\" class=\"small mt-1 ms-10\">\r\n Apply a single comment to all selected stores. This option is useful when the {{type}} details are identical\r\n for\r\n every store.\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"form-check p-3 border rounded option-box\"\r\n [ngClass]=\"{ 'active-option': selectedOption === 'different' }\" (click)=\"setOption('different')\">\r\n <input class=\"form-check-input my-5 mx-3\" type=\"radio\" name=\"taskOption\" id=\"differentComments\"\r\n [checked]=\"selectedOption === 'different'\">\r\n <div class=\"mx-3\">\r\n <label class=\"fw-semibold\" for=\"differentComments\">\r\n Create {{type}} with different comments <span class=\"text-muted\">(via Excel upload)</span>\r\n </label>\r\n <div [ngClass]=\"selectedOption === 'different' ? 'active-option' : 'text-normal'\" class=\" small mt-1 ms-10\">\r\n Use an Excel template to assign different comments to each selected store. This allows you to customize the\r\n {{type}} for each location.\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"fw-semibold mt-3 mb-2\" *ngIf=\"type==='redo'&&this.payload?.selectedUsers?.length===0&&this.payload?.selectedStores?.length==0\">\r\n <div class=\"d-flex\">\r\n <div><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"36\" height=\"36\" viewBox=\"0 0 36 36\" fill=\"none\">\r\n <rect x=\"2\" y=\"2\" width=\"32\" height=\"32\" rx=\"16\" fill=\"#FEF0C7\" />\r\n <rect x=\"2\" y=\"2\" width=\"32\" height=\"32\" rx=\"16\" stroke=\"#FFFAEB\" stroke-width=\"4\" />\r\n <path\r\n d=\"M18.0005 15.3341V18.0008M18.0005 20.6675H18.0072M16.8605 11.9075L11.2138 21.3341C11.0974 21.5357 11.0358 21.7643 11.0352 21.9971C11.0345 22.2299 11.0948 22.4589 11.2101 22.6611C11.3254 22.8634 11.4917 23.032 11.6923 23.15C11.893 23.2681 12.121 23.3316 12.3538 23.3341H23.6472C23.88 23.3316 24.108 23.2681 24.3087 23.15C24.5094 23.032 24.6756 22.8634 24.7909 22.6611C24.9062 22.4589 24.9665 22.2299 24.9658 21.9971C24.9652 21.7643 24.9036 21.5357 24.7872 21.3341L19.1405 11.9075C19.0217 11.7115 18.8543 11.5495 18.6546 11.4371C18.4549 11.3247 18.2297 11.2656 18.0005 11.2656C17.7713 11.2656 17.5461 11.3247 17.3464 11.4371C17.1467 11.5495 16.9793 11.7115 16.8605 11.9075Z\"\r\n stroke=\"#DC6803\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></div>\r\n <div class=\"ms-2\">Redo will apply only to the checklist response submitted on today. Any responses submitted on\r\n previous dates will be unselected and excluded from redo.</div>\r\n </div>\r\n </div>\r\n <div class=\"fw-semibold mt-3 mb-2\" *ngIf=\"type==='task'&&this.payload?.selectedUsers?.length===0&&this.payload?.selectedStores?.length==0\">\r\n <div class=\"d-flex\">\r\n <div><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"36\" height=\"36\" viewBox=\"0 0 36 36\" fill=\"none\">\r\n <rect x=\"2\" y=\"2\" width=\"32\" height=\"32\" rx=\"16\" fill=\"#FEF0C7\" />\r\n <rect x=\"2\" y=\"2\" width=\"32\" height=\"32\" rx=\"16\" stroke=\"#FFFAEB\" stroke-width=\"4\" />\r\n <path\r\n d=\"M18.0005 15.3341V18.0008M18.0005 20.6675H18.0072M16.8605 11.9075L11.2138 21.3341C11.0974 21.5357 11.0358 21.7643 11.0352 21.9971C11.0345 22.2299 11.0948 22.4589 11.2101 22.6611C11.3254 22.8634 11.4917 23.032 11.6923 23.15C11.893 23.2681 12.121 23.3316 12.3538 23.3341H23.6472C23.88 23.3316 24.108 23.2681 24.3087 23.15C24.5094 23.032 24.6756 22.8634 24.7909 22.6611C24.9062 22.4589 24.9665 22.2299 24.9658 21.9971C24.9652 21.7643 24.9036 21.5357 24.7872 21.3341L19.1405 11.9075C19.0217 11.7115 18.8543 11.5495 18.6546 11.4371C18.4549 11.3247 18.2297 11.2656 18.0005 11.2656C17.7713 11.2656 17.5461 11.3247 17.3464 11.4371C17.1467 11.5495 16.9793 11.7115 16.8605 11.9075Z\"\r\n stroke=\"#DC6803\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></div>\r\n <div class=\"ms-2\">Stores that are already created task for their checklist responses are excluded for task creation now.</div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"modal-footer col-md-12 text-end border-top-0\">\r\n <button type=\"button\" class=\"btn btn-outline\" (click)=\"closeactivepopup()\" data-bs-dismiss=\"modal\">Cancel</button>\r\n <button type=\"button\" [disabled]=\"this.payload?.selectedUsers?.length===0&&this.payload?.selectedStores?.length==0\" class=\"btn btn-primary\" (click)=\"proceed()\">Proceed</button>\r\n </div>\r\n\r\n </div>\r\n</div>\r\n\r\n\r\n\r\n<ng-template #bulkupload let-model>\r\n <div class=\"card border-0\" (keydown.enter)=\"preventEnter($event)\">\r\n <div class=\"card-header border-0 mt-5\">\r\n <div class=\"card-title mt-3\">\r\n <div class=\"bg-light-primary rounded-5 w-40px h-40px d-flex justify-content-center align-items-center\">\r\n <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M30 18H22C21.4696 18 20.9609 18.2107 20.5858 18.5858C20.2107 18.9609 20 19.4696 20 20V36C20 36.5304 20.2107 37.0391 20.5858 37.4142C20.9609 37.7893 21.4696 38 22 38H34C34.5304 38 35.0391 37.7893 35.4142 37.4142C35.7893 37.0391 36 36.5304 36 36V24M30 18L36 24M30 18V24H36M28 34V28M25 31H31\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </div> <span class=\"config-heading fw-semibold ms-5 w-auto text-capitalize\">{{type}}</span>\r\n </div>\r\n </div>\r\n <div class=\"card-body pt-0\">\r\n <div class=\"flex-column\">\r\n <div class=\"storeAssign mt-3\" style=\"font-weight: 400\">1. Use the template to upload and create multiple\r\n {{type}}s at once.</div>\r\n <div class=\"storeAssign mt-3\" style=\"font-weight: 400\">2. Download the template here - <a\r\n class=\"text-decoration-underline cursor-pointer\" (click)=\"downloadTemplate()\">Download Prefilled\r\n Template</a>\r\n </div>\r\n <div class=\"storeAssign mt-3\" style=\"font-weight: 400\">3. Add your data to the Template File</div>\r\n <div class=\"storeAssign mt-3\" style=\"font-weight: 400\">4. Upload it below for processing</div>\r\n\r\n\r\n </div>\r\n </div>\r\n <div class=\"card-footer border-0 text-end pt-0\">\r\n <button class=\"btn btn-md btn-default btn-outline\" (click)=\"modalRef.close()\">Cancel</button>\r\n <button class=\"btn btn-md py-3 btn-default ms-3 btn-primary\" (click)=\"file1.click()\">Upload</button>\r\n <input style=\"visibility: hidden;\" #file1 type=\"file\" id=\"kt_account_team_size_select_2\"\r\n (change)=\"onFileUpload($event,'upload')\" />\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #afterValidation let-model>\r\n <div class=\"card border-0\" (keydown.enter)=\"preventEnter($event)\">\r\n <div class=\"card-header border-0 mt-0\">\r\n <div class=\"my-5 mb-5\">\r\n <div class=\"symbol symbol-75px symbol-circle d-flex \">\r\n <svg *ngIf=\"type==='task'\" xmlns=\"http://www.w3.org/2000/svg\" width=\"56\" height=\"56\" viewBox=\"0 0 56 56\"\r\n fill=\"none\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M30 18H22C21.4696 18 20.9609 18.2107 20.5858 18.5858C20.2107 18.9609 20 19.4696 20 20V36C20 36.5304 20.2107 37.0391 20.5858 37.4142C20.9609 37.7893 21.4696 38 22 38H34C34.5304 38 35.0391 37.7893 35.4142 37.4142C35.7893 37.0391 36 36.5304 36 36V24M30 18L36 24M30 18V24H36M28 34V28M25 31H31\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <svg *ngIf=\"type==='redo'\" xmlns=\"http://www.w3.org/2000/svg\" width=\"56\" height=\"56\" viewBox=\"0 0 56 56\"\r\n fill=\"none\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M39 19.9996V25.9996M39 25.9996H33M39 25.9996L34.36 21.6396C33.2853 20.5643 31.9556 19.7788 30.4952 19.3564C29.0348 18.9339 27.4911 18.8883 26.0083 19.2238C24.5255 19.5594 23.1518 20.265 22.0155 21.275C20.8791 22.285 20.0172 23.5664 19.51 24.9996M17 35.9996V29.9996M17 29.9996H23M17 29.9996L21.64 34.3596C22.7147 35.4349 24.0444 36.2204 25.5048 36.6428C26.9652 37.0652 28.5089 37.1108 29.9917 36.7753C31.4745 36.4398 32.8482 35.7342 33.9845 34.7242C35.1209 33.7142 35.9828 32.4328 36.49 30.9996\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <h3 class=\"text-capitalize mx-3 mt-3\"> {{type}}</h3>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"card-body pt-0\">\r\n <div class=\"row\">\r\n <div class=\"col-sm-4\">\r\n <div class=\"popup-card rounded-3 p-3 flex-column h-80px\">\r\n <div class=\"fw-semibold config-heading w-100\">{{getStoreCounts(excelData)}}</div>\r\n <div class=\"fw-semibold subtitle mt-1\">Total <span *ngIf=\"this.payload.coverage==='store'\">Stores</span>\r\n <span *ngIf=\"this.payload.coverage==='users'\">Users</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <div class=\"popup-card rounded-3 p-3 flex-column h-80px\">\r\n <div class=\"fw-semibold config-heading w-100\">{{excelData?.length}}</div>\r\n <div class=\"fw-semibold subtitle mt-1\">Rows processed</div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <div class=\"popup-card rounded-3 p-3 flex-column h-80px\">\r\n <div [ngClass]=\"excelError ? 'error-heading':''\" class=\"fw-semibold config-heading w-100\">\r\n {{excelError?.error?.length || 0}}</div>\r\n <div [ngClass]=\"excelError ? 'excel-error':''\" class=\"fw-semibold subtitle mt-1\">Error</div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"excelError\" class=\"flex-column mt-5\">\r\n <div class=\"config-heading fw-bold\">Invalid Details !</div>\r\n <div class=\"subtitle mt-5\">Please provide correct and complete layout information.</div>\r\n <div class=\"p-5 w-100 rounded-3 border-error mt-5 flex-column\">\r\n <div *ngFor=\"let error of excelError?.error; let i = index; let last = last\" [ngClass]=\"!last ? 'mb-2' : ''\"\r\n class=\"text-error\">{{i + 1}}) {{error}}</div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n <div class=\"card-footer border-0 text-end pt-0\">\r\n <button class=\"btn btn-md btn-default btn-outline\" (click)=\"closeactivepopup()\">Cancel</button>\r\n <button *ngIf=\"!excelError\" class=\"btn btn-md py-4 btn-default ms-3 btn-primary\"\r\n (click)=\"validateDetails()\">Proceed</button>\r\n <button *ngIf=\"excelError\" class=\"btn py-3 btn-md btn-default ms-3 btn-danger\"\r\n (click)=\"Reupload();\">Reupload</button>\r\n <input style=\"visibility: hidden;\" #file1 type=\"file\" id=\"kt_account_team_size_select_2\"\r\n (change)=\"onFileUpload($event,'reupload')\" />\r\n </div>\r\n </div>\r\n</ng-template>", styles: [".option-box{transition:border-color .3s,background-color .3s;cursor:pointer}.option-box:hover{border-color:#0d6efd}.active-option{border-color:#008edf!important;color:#008edf!important;background-color:#e7f1ff}.text-normal{color:var(--Gray-500, #667085);font-size:12px;font-weight:400;line-height:18px}\n"], dependencies: [{ kind: "directive", type: i6.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
9508
9489
  }
9509
9490
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: BulkcreationmodelComponent, decorators: [{
9510
9491
  type: Component,
9511
- args: [{ selector: 'lib-bulkcreationmodel', template: "<div class=\"card group-delete py-0\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"my-5 mb-5\">\r\n <div class=\"symbol symbol-75px symbol-circle d-flex \">\r\n <svg *ngIf=\"type==='task'\" xmlns=\"http://www.w3.org/2000/svg\" width=\"56\" height=\"56\" viewBox=\"0 0 56 56\"\r\n fill=\"none\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M30 18H22C21.4696 18 20.9609 18.2107 20.5858 18.5858C20.2107 18.9609 20 19.4696 20 20V36C20 36.5304 20.2107 37.0391 20.5858 37.4142C20.9609 37.7893 21.4696 38 22 38H34C34.5304 38 35.0391 37.7893 35.4142 37.4142C35.7893 37.0391 36 36.5304 36 36V24M30 18L36 24M30 18V24H36M28 34V28M25 31H31\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <svg *ngIf=\"type==='redo'\" xmlns=\"http://www.w3.org/2000/svg\" width=\"56\" height=\"56\" viewBox=\"0 0 56 56\"\r\n fill=\"none\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M39 19.9996V25.9996M39 25.9996H33M39 25.9996L34.36 21.6396C33.2853 20.5643 31.9556 19.7788 30.4952 19.3564C29.0348 18.9339 27.4911 18.8883 26.0083 19.2238C24.5255 19.5594 23.1518 20.265 22.0155 21.275C20.8791 22.285 20.0172 23.5664 19.51 24.9996M17 35.9996V29.9996M17 29.9996H23M17 29.9996L21.64 34.3596C22.7147 35.4349 24.0444 36.2204 25.5048 36.6428C26.9652 37.0652 28.5089 37.1108 29.9917 36.7753C31.4745 36.4398 32.8482 35.7342 33.9845 34.7242C35.1209 33.7142 35.9828 32.4328 36.49 30.9996\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <h3 class=\"text-capitalize mx-3 mt-3\"> {{type}}</h3>\r\n </div>\r\n </div>\r\n <div class=\"form-check mb-3 p-3 border rounded option-box\"\r\n [ngClass]=\"{ 'active-option': selectedOption === 'same' }\" (click)=\"setOption('same')\">\r\n <input class=\"form-check-input my-5 mx-3\" type=\"radio\" name=\"taskOption\" id=\"sameComment\"\r\n [checked]=\"selectedOption === 'same'\">\r\n <div class=\"mx-3\">\r\n <label class=\"fw-semibold\" for=\"sameComment\">\r\n Create {{type}} with same comment\r\n </label>\r\n <div [ngClass]=\"selectedOption === 'same' ? 'active-option' : 'text-normal'\" class=\"small mt-1 ms-10\">\r\n Apply a single comment to all selected stores. This option is useful when the {{type}} details are identical\r\n for\r\n every store.\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"form-check p-3 border rounded option-box\"\r\n [ngClass]=\"{ 'active-option': selectedOption === 'different' }\" (click)=\"setOption('different')\">\r\n <input class=\"form-check-input my-5 mx-3\" type=\"radio\" name=\"taskOption\" id=\"differentComments\"\r\n [checked]=\"selectedOption === 'different'\">\r\n <div class=\"mx-3\">\r\n <label class=\"fw-semibold\" for=\"differentComments\">\r\n Create {{type}} with different comments <span class=\"text-muted\">(via Excel upload)</span>\r\n </label>\r\n <div [ngClass]=\"selectedOption === 'different' ? 'active-option' : 'text-normal'\" class=\" small mt-1 ms-10\">\r\n Use an Excel template to assign different comments to each selected store. This allows you to customize the\r\n {{type}} for each location.\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"fw-semibold mt-3 mb-2\" *ngIf=\"type==='redo'&&this.payload?.selectedUsers?.length===0&&this.payload?.selectedStores?.length==0\">\r\n <div class=\"d-flex\">\r\n <div><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"36\" height=\"36\" viewBox=\"0 0 36 36\" fill=\"none\">\r\n <rect x=\"2\" y=\"2\" width=\"32\" height=\"32\" rx=\"16\" fill=\"#FEF0C7\" />\r\n <rect x=\"2\" y=\"2\" width=\"32\" height=\"32\" rx=\"16\" stroke=\"#FFFAEB\" stroke-width=\"4\" />\r\n <path\r\n d=\"M18.0005 15.3341V18.0008M18.0005 20.6675H18.0072M16.8605 11.9075L11.2138 21.3341C11.0974 21.5357 11.0358 21.7643 11.0352 21.9971C11.0345 22.2299 11.0948 22.4589 11.2101 22.6611C11.3254 22.8634 11.4917 23.032 11.6923 23.15C11.893 23.2681 12.121 23.3316 12.3538 23.3341H23.6472C23.88 23.3316 24.108 23.2681 24.3087 23.15C24.5094 23.032 24.6756 22.8634 24.7909 22.6611C24.9062 22.4589 24.9665 22.2299 24.9658 21.9971C24.9652 21.7643 24.9036 21.5357 24.7872 21.3341L19.1405 11.9075C19.0217 11.7115 18.8543 11.5495 18.6546 11.4371C18.4549 11.3247 18.2297 11.2656 18.0005 11.2656C17.7713 11.2656 17.5461 11.3247 17.3464 11.4371C17.1467 11.5495 16.9793 11.7115 16.8605 11.9075Z\"\r\n stroke=\"#DC6803\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></div>\r\n <div class=\"ms-2\">Redo will apply only to the checklist response submitted on today. Any responses submitted on\r\n previous dates will be unselected and excluded from redo.</div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"modal-footer col-md-12 text-end border-top-0\">\r\n <button type=\"button\" class=\"btn btn-outline\" (click)=\"closeactivepopup()\" data-bs-dismiss=\"modal\">Cancel</button>\r\n <button type=\"button\" [disabled]=\"this.payload?.selectedUsers?.length===0&&this.payload?.selectedStores?.length==0\" class=\"btn btn-primary\" (click)=\"proceed()\">Proceed</button>\r\n </div>\r\n\r\n </div>\r\n</div>\r\n\r\n\r\n\r\n<ng-template #bulkupload let-model>\r\n <div class=\"card border-0\">\r\n <div class=\"card-header border-0 mt-5\">\r\n <div class=\"card-title mt-3\">\r\n <div class=\"bg-light-primary rounded-5 w-40px h-40px d-flex justify-content-center align-items-center\">\r\n <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M30 18H22C21.4696 18 20.9609 18.2107 20.5858 18.5858C20.2107 18.9609 20 19.4696 20 20V36C20 36.5304 20.2107 37.0391 20.5858 37.4142C20.9609 37.7893 21.4696 38 22 38H34C34.5304 38 35.0391 37.7893 35.4142 37.4142C35.7893 37.0391 36 36.5304 36 36V24M30 18L36 24M30 18V24H36M28 34V28M25 31H31\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </div> <span class=\"config-heading fw-semibold ms-5 w-auto text-capitalize\">{{type}}</span>\r\n </div>\r\n </div>\r\n <div class=\"card-body pt-0\">\r\n <div class=\"flex-column\">\r\n <div class=\"storeAssign mt-3\" style=\"font-weight: 400\">1. Use the template to upload and create multiple\r\n {{type}}s at once.</div>\r\n <div class=\"storeAssign mt-3\" style=\"font-weight: 400\">2. Download the template here - <a\r\n class=\"text-decoration-underline cursor-pointer\" (click)=\"downloadTemplate()\">Download Prefilled\r\n Template</a>\r\n </div>\r\n <div class=\"storeAssign mt-3\" style=\"font-weight: 400\">3. Add your data to the Template File</div>\r\n <div class=\"storeAssign mt-3\" style=\"font-weight: 400\">4. Upload it below for processing</div>\r\n\r\n\r\n </div>\r\n </div>\r\n <div class=\"card-footer border-0 text-end pt-0\">\r\n <button class=\"btn btn-md btn-default btn-outline\" (click)=\"modalRef.close()\">Cancel</button>\r\n <button class=\"btn btn-md py-3 btn-default ms-3 btn-primary\" (click)=\"file1.click()\">Upload</button>\r\n <input style=\"visibility: hidden;\" #file1 type=\"file\" id=\"kt_account_team_size_select_2\"\r\n (change)=\"onFileUpload($event,'upload')\" />\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #afterValidation let-model>\r\n <div class=\"card border-0\">\r\n <div class=\"card-header border-0 mt-0\">\r\n <div class=\"my-5 mb-5\">\r\n <div class=\"symbol symbol-75px symbol-circle d-flex \">\r\n <svg *ngIf=\"type==='task'\" xmlns=\"http://www.w3.org/2000/svg\" width=\"56\" height=\"56\" viewBox=\"0 0 56 56\"\r\n fill=\"none\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M30 18H22C21.4696 18 20.9609 18.2107 20.5858 18.5858C20.2107 18.9609 20 19.4696 20 20V36C20 36.5304 20.2107 37.0391 20.5858 37.4142C20.9609 37.7893 21.4696 38 22 38H34C34.5304 38 35.0391 37.7893 35.4142 37.4142C35.7893 37.0391 36 36.5304 36 36V24M30 18L36 24M30 18V24H36M28 34V28M25 31H31\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <svg *ngIf=\"type==='redo'\" xmlns=\"http://www.w3.org/2000/svg\" width=\"56\" height=\"56\" viewBox=\"0 0 56 56\"\r\n fill=\"none\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M39 19.9996V25.9996M39 25.9996H33M39 25.9996L34.36 21.6396C33.2853 20.5643 31.9556 19.7788 30.4952 19.3564C29.0348 18.9339 27.4911 18.8883 26.0083 19.2238C24.5255 19.5594 23.1518 20.265 22.0155 21.275C20.8791 22.285 20.0172 23.5664 19.51 24.9996M17 35.9996V29.9996M17 29.9996H23M17 29.9996L21.64 34.3596C22.7147 35.4349 24.0444 36.2204 25.5048 36.6428C26.9652 37.0652 28.5089 37.1108 29.9917 36.7753C31.4745 36.4398 32.8482 35.7342 33.9845 34.7242C35.1209 33.7142 35.9828 32.4328 36.49 30.9996\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <h3 class=\"text-capitalize mx-3 mt-3\"> {{type}}</h3>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"card-body pt-0\">\r\n <div class=\"row\">\r\n <div class=\"col-sm-4\">\r\n <div class=\"popup-card rounded-3 p-3 flex-column h-80px\">\r\n <div class=\"fw-semibold config-heading w-100\">{{getStoreCounts(excelData)}}</div>\r\n <div class=\"fw-semibold subtitle mt-1\">Total <span *ngIf=\"this.payload.coverage==='store'\">Stores</span>\r\n <span *ngIf=\"this.payload.coverage==='users'\">Users</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <div class=\"popup-card rounded-3 p-3 flex-column h-80px\">\r\n <div class=\"fw-semibold config-heading w-100\">{{excelData?.length}}</div>\r\n <div class=\"fw-semibold subtitle mt-1\">Rows processed</div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <div class=\"popup-card rounded-3 p-3 flex-column h-80px\">\r\n <div [ngClass]=\"excelError ? 'error-heading':''\" class=\"fw-semibold config-heading w-100\">\r\n {{excelError?.error?.length || 0}}</div>\r\n <div [ngClass]=\"excelError ? 'excel-error':''\" class=\"fw-semibold subtitle mt-1\">Error</div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"excelError\" class=\"flex-column mt-5\">\r\n <div class=\"config-heading fw-bold\">Invalid Details !</div>\r\n <div class=\"subtitle mt-5\">Please provide correct and complete layout information.</div>\r\n <div class=\"p-5 w-100 rounded-3 border-error mt-5 flex-column\">\r\n <div *ngFor=\"let error of excelError?.error; let i = index; let last = last\" [ngClass]=\"!last ? 'mb-2' : ''\"\r\n class=\"text-error\">{{i + 1}}) {{error}}</div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n <div class=\"card-footer border-0 text-end pt-0\">\r\n <button class=\"btn btn-md btn-default btn-outline\" (click)=\"closeactivepopup()\">Cancel</button>\r\n <button *ngIf=\"!excelError\" class=\"btn btn-md py-4 btn-default ms-3 btn-primary\"\r\n (click)=\"validateDetails()\">Proceed</button>\r\n <button *ngIf=\"excelError\" class=\"btn py-3 btn-md btn-default ms-3 btn-danger\"\r\n (click)=\"Reupload();\">Reupload</button>\r\n <input style=\"visibility: hidden;\" #file1 type=\"file\" id=\"kt_account_team_size_select_2\"\r\n (change)=\"onFileUpload($event,'reupload')\" />\r\n </div>\r\n </div>\r\n</ng-template>", styles: [".option-box{transition:border-color .3s,background-color .3s;cursor:pointer}.option-box:hover{border-color:#0d6efd}.active-option{border-color:#008edf!important;color:#008edf!important;background-color:#e7f1ff}.text-normal{color:var(--Gray-500, #667085);font-size:12px;font-weight:400;line-height:18px}\n"] }]
9492
+ args: [{ selector: 'lib-bulkcreationmodel', template: "<div class=\"card group-delete py-0\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"my-5 mb-5\">\r\n <div class=\"symbol symbol-75px symbol-circle d-flex \">\r\n <svg *ngIf=\"type==='task'\" xmlns=\"http://www.w3.org/2000/svg\" width=\"56\" height=\"56\" viewBox=\"0 0 56 56\"\r\n fill=\"none\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M30 18H22C21.4696 18 20.9609 18.2107 20.5858 18.5858C20.2107 18.9609 20 19.4696 20 20V36C20 36.5304 20.2107 37.0391 20.5858 37.4142C20.9609 37.7893 21.4696 38 22 38H34C34.5304 38 35.0391 37.7893 35.4142 37.4142C35.7893 37.0391 36 36.5304 36 36V24M30 18L36 24M30 18V24H36M28 34V28M25 31H31\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <svg *ngIf=\"type==='redo'\" xmlns=\"http://www.w3.org/2000/svg\" width=\"56\" height=\"56\" viewBox=\"0 0 56 56\"\r\n fill=\"none\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M39 19.9996V25.9996M39 25.9996H33M39 25.9996L34.36 21.6396C33.2853 20.5643 31.9556 19.7788 30.4952 19.3564C29.0348 18.9339 27.4911 18.8883 26.0083 19.2238C24.5255 19.5594 23.1518 20.265 22.0155 21.275C20.8791 22.285 20.0172 23.5664 19.51 24.9996M17 35.9996V29.9996M17 29.9996H23M17 29.9996L21.64 34.3596C22.7147 35.4349 24.0444 36.2204 25.5048 36.6428C26.9652 37.0652 28.5089 37.1108 29.9917 36.7753C31.4745 36.4398 32.8482 35.7342 33.9845 34.7242C35.1209 33.7142 35.9828 32.4328 36.49 30.9996\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <h3 class=\"text-capitalize mx-3 mt-3\"> {{type}}</h3>\r\n </div>\r\n </div>\r\n <div class=\"form-check mb-3 p-3 border rounded option-box\"\r\n [ngClass]=\"{ 'active-option': selectedOption === 'same' }\" (click)=\"setOption('same')\">\r\n <input class=\"form-check-input my-5 mx-3\" type=\"radio\" name=\"taskOption\" id=\"sameComment\"\r\n [checked]=\"selectedOption === 'same'\">\r\n <div class=\"mx-3\">\r\n <label class=\"fw-semibold\" for=\"sameComment\">\r\n Create {{type}} with same comment\r\n </label>\r\n <div [ngClass]=\"selectedOption === 'same' ? 'active-option' : 'text-normal'\" class=\"small mt-1 ms-10\">\r\n Apply a single comment to all selected stores. This option is useful when the {{type}} details are identical\r\n for\r\n every store.\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"form-check p-3 border rounded option-box\"\r\n [ngClass]=\"{ 'active-option': selectedOption === 'different' }\" (click)=\"setOption('different')\">\r\n <input class=\"form-check-input my-5 mx-3\" type=\"radio\" name=\"taskOption\" id=\"differentComments\"\r\n [checked]=\"selectedOption === 'different'\">\r\n <div class=\"mx-3\">\r\n <label class=\"fw-semibold\" for=\"differentComments\">\r\n Create {{type}} with different comments <span class=\"text-muted\">(via Excel upload)</span>\r\n </label>\r\n <div [ngClass]=\"selectedOption === 'different' ? 'active-option' : 'text-normal'\" class=\" small mt-1 ms-10\">\r\n Use an Excel template to assign different comments to each selected store. This allows you to customize the\r\n {{type}} for each location.\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"fw-semibold mt-3 mb-2\" *ngIf=\"type==='redo'&&this.payload?.selectedUsers?.length===0&&this.payload?.selectedStores?.length==0\">\r\n <div class=\"d-flex\">\r\n <div><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"36\" height=\"36\" viewBox=\"0 0 36 36\" fill=\"none\">\r\n <rect x=\"2\" y=\"2\" width=\"32\" height=\"32\" rx=\"16\" fill=\"#FEF0C7\" />\r\n <rect x=\"2\" y=\"2\" width=\"32\" height=\"32\" rx=\"16\" stroke=\"#FFFAEB\" stroke-width=\"4\" />\r\n <path\r\n d=\"M18.0005 15.3341V18.0008M18.0005 20.6675H18.0072M16.8605 11.9075L11.2138 21.3341C11.0974 21.5357 11.0358 21.7643 11.0352 21.9971C11.0345 22.2299 11.0948 22.4589 11.2101 22.6611C11.3254 22.8634 11.4917 23.032 11.6923 23.15C11.893 23.2681 12.121 23.3316 12.3538 23.3341H23.6472C23.88 23.3316 24.108 23.2681 24.3087 23.15C24.5094 23.032 24.6756 22.8634 24.7909 22.6611C24.9062 22.4589 24.9665 22.2299 24.9658 21.9971C24.9652 21.7643 24.9036 21.5357 24.7872 21.3341L19.1405 11.9075C19.0217 11.7115 18.8543 11.5495 18.6546 11.4371C18.4549 11.3247 18.2297 11.2656 18.0005 11.2656C17.7713 11.2656 17.5461 11.3247 17.3464 11.4371C17.1467 11.5495 16.9793 11.7115 16.8605 11.9075Z\"\r\n stroke=\"#DC6803\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></div>\r\n <div class=\"ms-2\">Redo will apply only to the checklist response submitted on today. Any responses submitted on\r\n previous dates will be unselected and excluded from redo.</div>\r\n </div>\r\n </div>\r\n <div class=\"fw-semibold mt-3 mb-2\" *ngIf=\"type==='task'&&this.payload?.selectedUsers?.length===0&&this.payload?.selectedStores?.length==0\">\r\n <div class=\"d-flex\">\r\n <div><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"36\" height=\"36\" viewBox=\"0 0 36 36\" fill=\"none\">\r\n <rect x=\"2\" y=\"2\" width=\"32\" height=\"32\" rx=\"16\" fill=\"#FEF0C7\" />\r\n <rect x=\"2\" y=\"2\" width=\"32\" height=\"32\" rx=\"16\" stroke=\"#FFFAEB\" stroke-width=\"4\" />\r\n <path\r\n d=\"M18.0005 15.3341V18.0008M18.0005 20.6675H18.0072M16.8605 11.9075L11.2138 21.3341C11.0974 21.5357 11.0358 21.7643 11.0352 21.9971C11.0345 22.2299 11.0948 22.4589 11.2101 22.6611C11.3254 22.8634 11.4917 23.032 11.6923 23.15C11.893 23.2681 12.121 23.3316 12.3538 23.3341H23.6472C23.88 23.3316 24.108 23.2681 24.3087 23.15C24.5094 23.032 24.6756 22.8634 24.7909 22.6611C24.9062 22.4589 24.9665 22.2299 24.9658 21.9971C24.9652 21.7643 24.9036 21.5357 24.7872 21.3341L19.1405 11.9075C19.0217 11.7115 18.8543 11.5495 18.6546 11.4371C18.4549 11.3247 18.2297 11.2656 18.0005 11.2656C17.7713 11.2656 17.5461 11.3247 17.3464 11.4371C17.1467 11.5495 16.9793 11.7115 16.8605 11.9075Z\"\r\n stroke=\"#DC6803\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></div>\r\n <div class=\"ms-2\">Stores that are already created task for their checklist responses are excluded for task creation now.</div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"modal-footer col-md-12 text-end border-top-0\">\r\n <button type=\"button\" class=\"btn btn-outline\" (click)=\"closeactivepopup()\" data-bs-dismiss=\"modal\">Cancel</button>\r\n <button type=\"button\" [disabled]=\"this.payload?.selectedUsers?.length===0&&this.payload?.selectedStores?.length==0\" class=\"btn btn-primary\" (click)=\"proceed()\">Proceed</button>\r\n </div>\r\n\r\n </div>\r\n</div>\r\n\r\n\r\n\r\n<ng-template #bulkupload let-model>\r\n <div class=\"card border-0\" (keydown.enter)=\"preventEnter($event)\">\r\n <div class=\"card-header border-0 mt-5\">\r\n <div class=\"card-title mt-3\">\r\n <div class=\"bg-light-primary rounded-5 w-40px h-40px d-flex justify-content-center align-items-center\">\r\n <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M30 18H22C21.4696 18 20.9609 18.2107 20.5858 18.5858C20.2107 18.9609 20 19.4696 20 20V36C20 36.5304 20.2107 37.0391 20.5858 37.4142C20.9609 37.7893 21.4696 38 22 38H34C34.5304 38 35.0391 37.7893 35.4142 37.4142C35.7893 37.0391 36 36.5304 36 36V24M30 18L36 24M30 18V24H36M28 34V28M25 31H31\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </div> <span class=\"config-heading fw-semibold ms-5 w-auto text-capitalize\">{{type}}</span>\r\n </div>\r\n </div>\r\n <div class=\"card-body pt-0\">\r\n <div class=\"flex-column\">\r\n <div class=\"storeAssign mt-3\" style=\"font-weight: 400\">1. Use the template to upload and create multiple\r\n {{type}}s at once.</div>\r\n <div class=\"storeAssign mt-3\" style=\"font-weight: 400\">2. Download the template here - <a\r\n class=\"text-decoration-underline cursor-pointer\" (click)=\"downloadTemplate()\">Download Prefilled\r\n Template</a>\r\n </div>\r\n <div class=\"storeAssign mt-3\" style=\"font-weight: 400\">3. Add your data to the Template File</div>\r\n <div class=\"storeAssign mt-3\" style=\"font-weight: 400\">4. Upload it below for processing</div>\r\n\r\n\r\n </div>\r\n </div>\r\n <div class=\"card-footer border-0 text-end pt-0\">\r\n <button class=\"btn btn-md btn-default btn-outline\" (click)=\"modalRef.close()\">Cancel</button>\r\n <button class=\"btn btn-md py-3 btn-default ms-3 btn-primary\" (click)=\"file1.click()\">Upload</button>\r\n <input style=\"visibility: hidden;\" #file1 type=\"file\" id=\"kt_account_team_size_select_2\"\r\n (change)=\"onFileUpload($event,'upload')\" />\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #afterValidation let-model>\r\n <div class=\"card border-0\" (keydown.enter)=\"preventEnter($event)\">\r\n <div class=\"card-header border-0 mt-0\">\r\n <div class=\"my-5 mb-5\">\r\n <div class=\"symbol symbol-75px symbol-circle d-flex \">\r\n <svg *ngIf=\"type==='task'\" xmlns=\"http://www.w3.org/2000/svg\" width=\"56\" height=\"56\" viewBox=\"0 0 56 56\"\r\n fill=\"none\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M30 18H22C21.4696 18 20.9609 18.2107 20.5858 18.5858C20.2107 18.9609 20 19.4696 20 20V36C20 36.5304 20.2107 37.0391 20.5858 37.4142C20.9609 37.7893 21.4696 38 22 38H34C34.5304 38 35.0391 37.7893 35.4142 37.4142C35.7893 37.0391 36 36.5304 36 36V24M30 18L36 24M30 18V24H36M28 34V28M25 31H31\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <svg *ngIf=\"type==='redo'\" xmlns=\"http://www.w3.org/2000/svg\" width=\"56\" height=\"56\" viewBox=\"0 0 56 56\"\r\n fill=\"none\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M39 19.9996V25.9996M39 25.9996H33M39 25.9996L34.36 21.6396C33.2853 20.5643 31.9556 19.7788 30.4952 19.3564C29.0348 18.9339 27.4911 18.8883 26.0083 19.2238C24.5255 19.5594 23.1518 20.265 22.0155 21.275C20.8791 22.285 20.0172 23.5664 19.51 24.9996M17 35.9996V29.9996M17 29.9996H23M17 29.9996L21.64 34.3596C22.7147 35.4349 24.0444 36.2204 25.5048 36.6428C26.9652 37.0652 28.5089 37.1108 29.9917 36.7753C31.4745 36.4398 32.8482 35.7342 33.9845 34.7242C35.1209 33.7142 35.9828 32.4328 36.49 30.9996\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <h3 class=\"text-capitalize mx-3 mt-3\"> {{type}}</h3>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"card-body pt-0\">\r\n <div class=\"row\">\r\n <div class=\"col-sm-4\">\r\n <div class=\"popup-card rounded-3 p-3 flex-column h-80px\">\r\n <div class=\"fw-semibold config-heading w-100\">{{getStoreCounts(excelData)}}</div>\r\n <div class=\"fw-semibold subtitle mt-1\">Total <span *ngIf=\"this.payload.coverage==='store'\">Stores</span>\r\n <span *ngIf=\"this.payload.coverage==='users'\">Users</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <div class=\"popup-card rounded-3 p-3 flex-column h-80px\">\r\n <div class=\"fw-semibold config-heading w-100\">{{excelData?.length}}</div>\r\n <div class=\"fw-semibold subtitle mt-1\">Rows processed</div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <div class=\"popup-card rounded-3 p-3 flex-column h-80px\">\r\n <div [ngClass]=\"excelError ? 'error-heading':''\" class=\"fw-semibold config-heading w-100\">\r\n {{excelError?.error?.length || 0}}</div>\r\n <div [ngClass]=\"excelError ? 'excel-error':''\" class=\"fw-semibold subtitle mt-1\">Error</div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"excelError\" class=\"flex-column mt-5\">\r\n <div class=\"config-heading fw-bold\">Invalid Details !</div>\r\n <div class=\"subtitle mt-5\">Please provide correct and complete layout information.</div>\r\n <div class=\"p-5 w-100 rounded-3 border-error mt-5 flex-column\">\r\n <div *ngFor=\"let error of excelError?.error; let i = index; let last = last\" [ngClass]=\"!last ? 'mb-2' : ''\"\r\n class=\"text-error\">{{i + 1}}) {{error}}</div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n <div class=\"card-footer border-0 text-end pt-0\">\r\n <button class=\"btn btn-md btn-default btn-outline\" (click)=\"closeactivepopup()\">Cancel</button>\r\n <button *ngIf=\"!excelError\" class=\"btn btn-md py-4 btn-default ms-3 btn-primary\"\r\n (click)=\"validateDetails()\">Proceed</button>\r\n <button *ngIf=\"excelError\" class=\"btn py-3 btn-md btn-default ms-3 btn-danger\"\r\n (click)=\"Reupload();\">Reupload</button>\r\n <input style=\"visibility: hidden;\" #file1 type=\"file\" id=\"kt_account_team_size_select_2\"\r\n (change)=\"onFileUpload($event,'reupload')\" />\r\n </div>\r\n </div>\r\n</ng-template>", styles: [".option-box{transition:border-color .3s,background-color .3s;cursor:pointer}.option-box:hover{border-color:#0d6efd}.active-option{border-color:#008edf!important;color:#008edf!important;background-color:#e7f1ff}.text-normal{color:var(--Gray-500, #667085);font-size:12px;font-weight:400;line-height:18px}\n"] }]
9512
9493
  }], ctorParameters: () => [{ type: i2.NgbModal }, { type: i2.NgbActiveModal }, { type: TraxService }, { type: i3.ToastService }, { type: i0.ChangeDetectorRef }], propDecorators: { payload: [{
9513
9494
  type: Input
9514
9495
  }], taskDetails: [{
@@ -10213,6 +10194,11 @@ class GalleryComponent {
10213
10194
  }
10214
10195
  }
10215
10196
  onchecklistreset() {
10197
+ this.selectedStores = [];
10198
+ this.selectedUsers = [];
10199
+ this.totalrecordcount = 0;
10200
+ this.selectedRecordCount = 0;
10201
+ this.selectAllTask = false;
10216
10202
  this.galleryForm.get("filter")?.setValue('');
10217
10203
  this.answerFilter = [];
10218
10204
  this.showmulti = true;
@@ -11527,8 +11513,7 @@ class GalleryComponent {
11527
11513
  console.log(this.selectedStores, this.selectedUsers);
11528
11514
  const isCluster = this.galleryForm.value.filtertype === 'Clusters';
11529
11515
  const isRedo = type === 'redo';
11530
- const filterFn = (ele) => this.checktodayDate(ele.date_string) &&
11531
- (isRedo ? !ele.redo : ele.taskId === null);
11516
+ const filterFn = (ele) => (isRedo ? !ele.redo && this.checktodayDate(ele.date_string) : ele.taskId === null);
11532
11517
  if (isCluster) {
11533
11518
  this.selectedStores = this.selectedStores.filter(filterFn);
11534
11519
  }
@@ -11566,9 +11551,11 @@ class GalleryComponent {
11566
11551
  };
11567
11552
  console.log(this.selectedStores.length);
11568
11553
  modalRef.result.then((result) => {
11569
- this.selectedStores = [];
11570
- this.selectedUsers = [];
11571
- if (result == 'submit') {
11554
+ console.log("&&&&&&&", result);
11555
+ if (result === 'submit') {
11556
+ console.log("************");
11557
+ this.selectedStores = [];
11558
+ this.selectedUsers = [];
11572
11559
  this.selectAllTask = false;
11573
11560
  this.showsingle = false;
11574
11561
  this.showmulti = true;
@@ -11678,7 +11665,7 @@ class GalleryComponent {
11678
11665
  }
11679
11666
  }
11680
11667
  selectmultiTask(event, checklist, data, checklistInfo, sectionInfo) {
11681
- console.log(data);
11668
+ console.log(sectionInfo);
11682
11669
  let answer = [];
11683
11670
  answer = data.userAnswer.map((data) => data.answer);
11684
11671
  console.log(answer);
@@ -11698,8 +11685,8 @@ class GalleryComponent {
11698
11685
  checklistId: checklistInfo.checklistId,
11699
11686
  userEmail: checklist.checklistInfo.userEmail,
11700
11687
  uniqueNo: data.uniqueNo,
11701
- taskId: checklistInfo.taskId ? checklistInfo.taskId : null,
11702
- redo: checklistInfo.redo,
11688
+ taskId: data.taskId ? data.taskId : null,
11689
+ redo: data.redo,
11703
11690
  date_string: dayjs(checklist.checklistInfo.date, "DD MMM YYYY").format("YYYY-MM-DD")
11704
11691
  });
11705
11692
  }
@@ -11710,8 +11697,8 @@ class GalleryComponent {
11710
11697
  userName: checklist.checklistInfo.submittedBy,
11711
11698
  checklistId: checklistInfo.checklistId,
11712
11699
  uniqueNo: data.uniqueNo,
11713
- taskId: checklistInfo.taskId ? checklistInfo.taskId : null,
11714
- redo: checklistInfo.redo,
11700
+ taskId: data.taskId ? data.taskId : null,
11701
+ redo: data.redo,
11715
11702
  date_string: dayjs(checklist.checklistInfo.date, "DD MMM YYYY").format("YYYY-MM-DD")
11716
11703
  });
11717
11704
  }
@@ -11736,6 +11723,9 @@ class GalleryComponent {
11736
11723
  selectsinglequestion() {
11737
11724
  this.selectedStores = [];
11738
11725
  this.selectedUsers = [];
11726
+ this.totalrecordcount = 0;
11727
+ this.selectedRecordCount = 0;
11728
+ this.selectAllTask = false;
11739
11729
  this.selectedSection = this.tempselectedSection;
11740
11730
  if (this.questionscount(this.selectedSection) == 0 || this.questionscount(this.selectedSection) > 1) {
11741
11731
  this.showsingle = false;
@@ -20197,7 +20187,7 @@ const routes = [
20197
20187
  },
20198
20188
  {
20199
20189
  path: 'audit',
20200
- loadChildren: () => import('./tango-app-ui-analyse-trax-eye-test-audit.module-BpJbNOps.mjs').then((m) => m.EyeTestAuditModule)
20190
+ loadChildren: () => import('./tango-app-ui-analyse-trax-eye-test-audit.module-DjDVouY5.mjs').then((m) => m.EyeTestAuditModule)
20201
20191
  }
20202
20192
  // {
20203
20193
  // path:'task',
@@ -20842,4 +20832,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
20842
20832
  */
20843
20833
 
20844
20834
  export { TraxService as T, TangoAnalyseTraxModule as a, TangoAnalyseTraxComponent as b };
20845
- //# sourceMappingURL=tango-app-ui-analyse-trax-tango-app-ui-analyse-trax-CeNuiihn.mjs.map
20835
+ //# sourceMappingURL=tango-app-ui-analyse-trax-tango-app-ui-analyse-trax-fgU4Z8FP.mjs.map