tango-app-ui-analyse-trax 3.7.76 → 3.7.78

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 (9) hide show
  1. package/esm2022/lib/components/checklist-configure/checklist-configure.component.mjs +198 -39
  2. package/esm2022/lib/components/chip-dropdown/chip-dropdown.component.mjs +27 -12
  3. package/esm2022/lib/components/gallery/gallery.component.mjs +7 -5
  4. package/esm2022/lib/components/task-configure/task-configure.component.mjs +1 -1
  5. package/fesm2022/tango-app-ui-analyse-trax.mjs +230 -54
  6. package/fesm2022/tango-app-ui-analyse-trax.mjs.map +1 -1
  7. package/lib/components/checklist-configure/checklist-configure.component.d.ts +7 -0
  8. package/lib/components/chip-dropdown/chip-dropdown.component.d.ts +3 -1
  9. package/package.json +1 -1
package/esm2022/lib/components/task-configure/task-configure.component.mjs CHANGED
@@ -1508,7 +1508,7 @@ export class TaskConfigureComponent {
1508
1508
  }
1509
1509
  }
1510
1510
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TaskConfigureComponent, deps: [{ token: i1.ActivatedRoute }, { token: i2.PageInfoService }, { token: i3.TraxService }, { token: i4.NgbModal }, { token: i5.ToastService }, { token: i1.Router }, { token: i0.ChangeDetectorRef }, { token: i6.FormBuilder }], target: i0.ɵɵFactoryTarget.Component });
1511
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: TaskConfigureComponent, selector: "lib-task-configure", viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["file"], descendants: true }, { propertyName: "fileInput1", first: true, predicate: ["file1"], descendants: true }, { propertyName: "bulkupload", first: true, predicate: ["bulkupload"], descendants: true }, { propertyName: "afterValidation", first: true, predicate: ["afterValidation"], descendants: true }, { propertyName: "confirmUser", first: true, predicate: ["confirmUser"], descendants: true }], ngImport: i0, template: "<div class=\"row\">\r\n <div class=\"col-12 mb-5\">\r\n <div class=\"c-card d-flex justify-content-between\">\r\n <div class=\"d-flex justify-content-start align-items-center\">\r\n <div [routerLink]=\"'/manage/trax/checklist/managetask'\" class=\"btn btn-sm btn-outline me-5 px-3 py-3\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M15.8332 10.0003H4.1665M4.1665 10.0003L9.99984 15.8337M4.1665 10.0003L9.99984 4.16699\" stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></div>\r\n <div *ngIf=\"taskDetails\">\r\n <div class=\"checklist-name mb-5\">{{taskDetails.checkListName}}</div>\r\n <div class=\"checklist-desc\">{{taskDetails.checkListDescription}}</div>\r\n </div>\r\n </div>\r\n <div class=\"d-flex align-items-center\">\r\n <button class=\"btn btn-primary py-3 me-5\" (click)=\"detassignUpdate('publish')\">Publish</button>\r\n <button class=\"btn btn-outline\" (click)=\"detassignUpdate('save')\">Save as Draft</button>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-3\">\r\n <div style=\"height: 80vh; overflow-y: auto;\" class=\"c-card\">\r\n <h2 class=\"mb-5\">Schedule</h2>\r\n <div class=\"d-flex mb-5\">\r\n <svg class=\"me-4\" xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"\r\n fill=\"none\">\r\n <path\r\n d=\"M16 2V6M8 2V6M3 10H21M5 4H19C20.1046 4 21 4.89543 21 6V20C21 21.1046 20.1046 22 19 22H5C3.89543 22 3 21.1046 3 20V6C3 4.89543 3.89543 4 5 4Z\"\r\n stroke=\"#667085\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"schedule-text\">\r\n {{dueDateFormatted}}\r\n </span>\r\n </div>\r\n <div class=\"d-flex mb-5\">\r\n <svg class=\"me-4\" xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"\r\n fill=\"none\">\r\n <path\r\n d=\"M12 6V12L16 14M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z\"\r\n stroke=\"#667085\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"schedule-text\">{{dueTimeFormatted}}</span>\r\n </div>\r\n <h2 class=\"mb-5\">Assign</h2>\r\n <div class=\"d-flex mb-5\">\r\n <svg class=\"me-4\" xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"\r\n fill=\"none\">\r\n <path\r\n d=\"M16 4H18C18.5304 4 19.0391 4.21071 19.4142 4.58579C19.7893 4.96086 20 5.46957 20 6V20C20 20.5304 19.7893 21.0391 19.4142 21.4142C19.0391 21.7893 18.5304 22 18 22H6C5.46957 22 4.96086 21.7893 4.58579 21.4142C4.21071 21.0391 4 20.5304 4 20V6C4 5.46957 4.21071 4.96086 4.58579 4.58579C4.96086 4.21071 5.46957 4 6 4H8M9 2H15C15.5523 2 16 2.44772 16 3V5C16 5.55228 15.5523 6 15 6H9C8.44772 6 8 5.55228 8 5V3C8 2.44772 8.44772 2 9 2Z\"\r\n stroke=\"#667085\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"schedule-text\">\r\n {{coverage}}s\r\n </span>\r\n </div>\r\n <div class=\"d-flex mb-5\">\r\n <svg class=\"me-4\" xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"\r\n fill=\"none\">\r\n <path\r\n d=\"M3.08995 6.88381L3.02401 6.98681C2.30358 8.25569 3.06101 9.87957 4.46464 10.0664C4.58627 10.0813 4.70112 10.0894 4.8145 10.0894C5.55255 10.0894 6.20523 9.77241 6.65953 9.27929L7.21286 8.67867L7.76432 9.28101C8.21367 9.77184 8.8652 10.0894 9.60776 10.0894C10.3471 10.0894 11.0022 9.77149 11.4512 9.28101L12.0044 8.67677L12.5576 9.28101C13.0066 9.77149 13.6617 10.0894 14.401 10.0894C15.1404 10.0894 15.7954 9.77149 16.2445 9.28101L16.7977 8.67678L17.3508 9.28101C17.7999 9.77149 18.4549 10.0894 19.1943 10.0894C19.3041 10.0894 19.4223 10.0812 19.5433 10.0665C20.9772 9.8718 21.7355 8.164 20.9155 6.88431C20.9154 6.88425 20.9154 6.8842 20.9154 6.88414L18.8056 3.59441L18.8056 3.59441L18.8046 3.59294C18.7582 3.52014 18.6649 3.46436 18.5584 3.46436H5.44307C5.3365 3.46436 5.24326 3.52014 5.19681 3.59295L5.19619 3.59391L3.08995 6.88381ZM4.81818 12.7501C4.71644 12.7501 4.616 12.747 4.5169 12.7411V16.6429V18.9644C4.5169 19.8212 5.22663 20.5358 6.11942 20.5358H17.882C18.7748 20.5358 19.4845 19.8212 19.4845 18.9644V16.6429V12.7416C19.3874 12.7471 19.2893 12.7501 19.1906 12.7501C19.0022 12.7501 18.8157 12.74 18.632 12.7203V16.6429V17.3929H17.882H6.11942H5.36942V16.6429V12.7211C5.18866 12.7402 5.00472 12.7501 4.81818 12.7501Z\"\r\n stroke=\"#101828\" stroke-width=\"1.5\" />\r\n </svg>\r\n <span class=\"schedule-text\">{{assignSingle?.length + groupAssign?.length}} {{coverage}}{{(assignSingle?.length + groupAssign?.length) > 1 ? 's':''}}</span>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n <div class=\"col-9\">\r\n <div style=\"height: 80vh; overflow-y: auto;\" class=\"c-card\">\r\n <div class=\"row\">\r\n <div class=\"col-6 mb-5\">\r\n <div class=\"date-picker\">\r\n <label for=\"datepick\" class=\"form-label\">Due date</label>\r\n <div style=\"position: relative;\">\r\n <svg style=\"position: absolute; top: 12px; left:12px;\" xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" 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\" stroke-linejoin=\"round\">\r\n </path>\r\n </svg>\r\n <input id=\"datepick\" class=\"fx-date-range form-control ps-14\" type=\"text\"\r\n ngxDaterangepickerMd [singleDatePicker]=\"true\" [minDate]=\"minDate\" [drops]=\"'down'\"\r\n [opens]=\"'right'\" [alwaysShowCalendars]=\"false\" [keepCalendarOpeningWithRange]=\"true\"\r\n [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"scheduleDate\" [autoApply]=\"false\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n name=\"daterange\" [readonly]=\"true\" />\r\n </div>\r\n\r\n </div>\r\n\r\n </div>\r\n <div class=\"col-6 mb-5\">\r\n <label for=\"timePick\" class=\"form-label\">Due time</label>\r\n <input [formControl]=\"scheduleEndTime\" type=\"time\" class=\"form-control\" id=\"timePick\"\r\n >\r\n </div>\r\n <div class=\"col-6 mb-5\">\r\n <label class=\"form-label\">Approver</label>\r\n <lib-chip-dropdown [data]=\"approversList\" [selectedData]=\"approver.value\"\r\n (selectedList)=\"onApproveAdded($event)\"></lib-chip-dropdown>\r\n\r\n </div>\r\n <div class=\"col-6 mb-5\">\r\n <label for=\"priority\" class=\"form-label\">Priority</label>\r\n <select [formControl]=\"priorityType\" id=\"priority\" class=\"form-select mb-5\">\r\n <option value=\"high\">High</option>\r\n <option value=\"medium\">Medium</option>\r\n <option value=\"low\">Low</option>\r\n </select>\r\n </div>\r\n\r\n <div class=\"col-12 mb-5\">\r\n <div class=\"toggle-card\" [ngClass]=\"allowedStoreLocation.value ? 'selected' : ''\">\r\n <div class=\"form-check form-switch me-4\">\r\n <input [formControl]=\"allowedStoreLocation\" class=\"form-check-input\" type=\"checkbox\"\r\n role=\"switch\">\r\n </div>\r\n <div>\r\n <div class=\"header\">Geo fencing</div>\r\n <div class=\"desc\">By enabling, the checklist can be filled by the user only when inside the\r\n store.</div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n <div class=\"col-12 mb-5\">\r\n <div class=\"toggle-card \" [ngClass]=\"restrictAttendance.value ? 'selected' : ''\">\r\n <div class=\"form-check form-switch me-4\">\r\n <input [formControl]=\"restrictAttendance\" class=\"form-check-input\" type=\"checkbox\"\r\n role=\"switch\">\r\n </div>\r\n <div>\r\n <div class=\"header\">Restrict attendance</div>\r\n <div class=\"desc\">By enabling, user can't be able to clockout without completing the task.\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n\r\n <div class=\"col-12 mb-5\">\r\n <div class=\"d-flex align-items-center mb-2\">\r\n <label class=\"reminder-header me-4\" for=\"reminderToggle\">Reminder</label>\r\n <div class=\"form-check form-switch\">\r\n <input [checked]=\"reminderRepeatSchedules.controls.length\" (change)=\"enableReminder($event)\" class=\"form-check-input\" type=\"checkbox\" role=\"switch\" id=\"reminderToggle\">\r\n </div>\r\n </div>\r\n <div class=\"reminder-description mb-5\" >\r\n By enabling, the users will be reminded in the selected interval \r\n </div>\r\n\r\n <div class=\"d-flex align-items-center mb-5\" >\r\n <ng-container *ngIf=\"reminderRepeatSchedules.controls.length\" >\r\n <div class=\"reminder-sub me-4\" >Notify user before</div>\r\n <ng-container *ngFor=\"let control of reminderRepeatSchedules.controls; let i = index\" >\r\n <div class=\"d-flex align-items-center position-relative w-200px me-4\" >\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\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_1487_47636)\">\r\n <path\r\n d=\"M10.0013 5.00033V10.0003L13.3346 11.667M18.3346 10.0003C18.3346 14.6027 14.6037 18.3337 10.0013 18.3337C5.39893 18.3337 1.66797 14.6027 1.66797 10.0003C1.66797 5.39795 5.39893 1.66699 10.0013 1.66699C14.6037 1.66699 18.3346 5.39795 18.3346 10.0003Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_1487_47636\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <select [formControl]=\"getFormControlFromArray(i)\" class=\"form-select ps-14 me-5\" >\r\n <ng-container *ngFor=\"let item of reminderRepeatScheduleOptions\" >\r\n <option [ngClass]=\"disableScheduleOption(item) ? 'd-none' : ''\" [ngValue]=\"item\" >{{item}} mins</option>\r\n </ng-container>\r\n </select>\r\n </div> \r\n </ng-container>\r\n </ng-container>\r\n\r\n \r\n <div *ngIf=\"reminderRepeatSchedules.controls.length > 0 && reminderRepeatSchedules.controls.length < 3 \" class=\"me-4\">\r\n <button (click)=\"addMoreSchedules()\" class=\"btn btn-sm btn-outline h-100\" ><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\" >\r\n <path d=\"M10.0013 4.16699V15.8337M4.16797 10.0003H15.8346\" stroke=\"#344054\" stroke-width=\"1.67\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </button>\r\n </div> \r\n </div>\r\n\r\n <div class=\"reminder-sub me-4\" ><span *ngIf=\"reminderRepeatSchedules.controls?.[0]\" >Send Alerts {{reminderRepeatSchedules.at(0).value}} Mins</span><span *ngIf=\"reminderRepeatSchedules.controls?.[1]\">, {{reminderRepeatSchedules.at(1).value}} Mins </span><span *ngIf=\"reminderRepeatSchedules.controls?.[2]\">and {{reminderRepeatSchedules.at(2).value}} Mins</span> before the checklist end time</div>\r\n \r\n </div>\r\n\r\n\r\n <div class=\"col-12\">\r\n <div class=\"d-flex align-items-center justify-content-between mb-5\">\r\n <h2>Assign</h2>\r\n </div>\r\n\r\n <div class=\"mb-5 ms-5 d-flex\">\r\n <div class=\"form-check d-flex align-items-center\">\r\n <input\r\n class=\"form-check-input selected-radio cursor-pointer me-3\" type=\"radio\" name=\"stores\" [checked]=\"storeCoverage\" (click)=\"selectRadio('store')\">\r\n <label class=\"uploadtext cursor-pointer fw-semibold\">Assign Stores and Clusters</label>\r\n </div>\r\n <div class=\"form-check ms-5 d-flex align-items-center\">\r\n <input\r\n class=\"form-check-input selected-radio cursor-pointer me-3\" type=\"radio\" name=\"users\" [checked]=\"userCoverage\" (click)=\"selectRadio('user')\">\r\n <label class=\"uploadtext cursor-pointer fw-semibold\">Assign Users and Teams</label>\r\n </div>\r\n </div>\r\n\r\n <div class=\"d-flex ms-5 align-items-center justify-content-between\">\r\n <div class=\"d-flex overflow-auto h-45px w-75 mt-5\">\r\n <ul *ngIf=\"storeCoverage\"\r\n class=\"nav nav-stretch nav-line-tabs nav-line-tabs-2x border-transparent fs-5 fw-bolder flex-nowrap\">\r\n <li (click)=\"selectedTab('store')\" class=\"nav-item cursor-pointer h-100\"><span\r\n [ngClass]=\"assignType ==='store' ? 'active bg-light-primary text-primary' :''\"\r\n class=\"nav-link text-active-primary m-0 px-5\">Stores</span>\r\n </li>\r\n <li (click)=\"selectedTab('cluster')\" class=\"nav-item cursor-pointer h-100\"><a\r\n [ngClass]=\"assignType ==='cluster' ? 'active bg-light-primary text-primary' :''\"\r\n class=\"nav-link text-active-primary m-0 px-5\">Clusters</a></li>\r\n </ul>\r\n <ul *ngIf=\"userCoverage\"\r\n class=\"nav nav-stretch nav-line-tabs nav-line-tabs-2x border-transparent fs-5 fw-bolder flex-nowrap\">\r\n <li (click)=\"selectedTab('user')\" class=\"nav-item cursor-pointer h-100\"><a\r\n [ngClass]=\"assignType ==='user' ? 'active bg-light-primary text-primary' :''\"\r\n class=\"nav-link text-active-primary m-0 px-5\">Users</a>\r\n </li>\r\n <li (click)=\"selectedTab('team')\" class=\"nav-item cursor-pointer h-100\"><a\r\n [ngClass]=\"assignType ==='team' ? 'active bg-light-primary text-primary' :''\"\r\n class=\"nav-link text-active-primary m-0 px-5\">Teams</a></li>\r\n </ul>\r\n </div>\r\n <div *ngIf=\"!['cluster','team'].includes(assignType)\" class=\"d-flex align-items-center\">\r\n <div *ngIf=\"storeCoverage\" (click)=\"addStoreComponent()\" class=\"btn btn-outline px-4 ng-star-inserted mt-8\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M10.0001 4.16602V15.8327M4.16675 9.99935H15.8334\" stroke=\"#344054\"\r\n stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n </path>\r\n </svg>\r\n <span>Assign Store</span>\r\n </div>\r\n <div *ngIf=\"userCoverage\" (click)=\"addStoreComponent()\" class=\"btn btn-outline px-4 ng-star-inserted mt-8\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M10.0001 4.16602V15.8327M4.16675 9.99935H15.8334\" stroke=\"#344054\"\r\n stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n </path>\r\n </svg>\r\n <span>Assign User</span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"w-100 ms-5\">\r\n <div class=\"table-header mt-5 d-flex align-items-center justify-content-between\">\r\n <div class=\"table-title\">Selected <span *ngIf=\"storeCoverage\">{{assignType | titlecase}}s</span></div>\r\n </div>\r\n <div class=\"w-100 mt-3 pe-5\">\r\n <lib-multi-chip-dropdown *ngIf=\"storeList && taskDetails\" [items]=\"storeList\" [multi]=\"true\" [searchField]=\"['storeName','clusterName','storeId','userName','teamName']\" [searchKey]=\"searchKey\" [idField]=\"'_id'\"\r\n (selected)=\"updateAssign($event)\" (removed)=\"removedChip($event)\" [selectedValues]=\"taskDetails.assign\"></lib-multi-chip-dropdown>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"(assignTableApiState | async) === 'loaded' && tableArray?.length\" class=\"card-body px-0 mt-0 pt-0 pb-0 mx-4 mb-5\">\r\n <div class=\" w-100\">\r\n <div class=\"table-header mt-5 d-flex align-items-center justify-content-between\">\r\n <div class=\"table-title\">Selected <span>{{assignType | titlecase}}s</span> List</div>\r\n <div class=\"d-flex align-items-center justify-content-start\">\r\n <div class=\"me-3\">\r\n <!-- <span class=\"svg-icon svg-icon-1 align-items-center position-absolute mt-3 ms-6\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\"\r\n viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\"\r\n rx=\"1\" transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\">\r\n </rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span> -->\r\n <input [formControl]=\"searchInput\" type=\"text\" data-kt-subscription-table-filter=\"search\" (change)=\"searchTableData()\"\r\n class=\"form-control form-control-solid w-200px ps-5 mx-1 me-4\" autocomplete=\"off\" \r\n autocapitalize=\"none\" \r\n spellcheck=\"false\" style=\"text-transform: none\" placeholder=\"Search...\"> \r\n </div>\r\n\r\n <div *ngIf=\"!['cluster','team'].includes(assignType)\" class=\"position-relative w-100 mt-5 mb-5\">\r\n <button type=\"button\"\r\n class=\"btn py-3 btn-default w-100 btn-outline btn-outline-default rounded-3 text-nowrap border-val d-flex justify-content-between\">\r\n <span class=\"me-3 cursor-pointer\" (click)=\"file.click()\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\" stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg> <span #upload class=\"template-dropdown ms-3 bg-white\">BulkUpload </span></span>\r\n <span class=\"subtitle mx-3 me-2\"> | </span>\r\n <span class=\"cursor-pointer\" (click)=\"openDropdown($event)\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <path d=\"M6 9L12 15L18 9\" stroke=\"#344054\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n <span><input style=\"display: none;\" type=\"file\" #file\r\n id=\"kt_account_team_size_select_1\" (change)=\"onFileUpload($event)\" /></span>\r\n </button>\r\n\r\n <div *ngIf=\"dropDown\" class=\"card template-dropdown h-40px w-100 position-absolute rounded-3 z-1 top-50px end-0\">\r\n <ul class=\"list-unstyled mb-0 w-auto cursor-pointer\" (click)=\"bulkuploadModel()\">\r\n <li class=\"px-5 fw-semibold cursor-pointer py-2\">Download Template</li>\r\n </ul>\r\n </div>\r\n </div>\r\n <div *ngIf=\"['cluster','team'].includes(assignType)\">\r\n <button type=\"button\"\r\n class=\"btn py-3 btn-default w-100 btn-outline btn-outline-default rounded-3 text-nowrap border-val d-flex justify-content-between\" (click)=\"downloadTemplateV2()\">\r\n <span class=\"me-3 cursor-pointer\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M8.125 13.125H16.3562L14.7438 14.7438L15.625 15.625L18.75 12.5L15.625 9.375L14.7438 10.2562L16.3562 11.875H8.125V13.125Z\" fill=\"black\"/>\r\n <path d=\"M13.75 8.75001V6.25001C13.7505 6.16776 13.7347 6.08622 13.7036 6.01007C13.6725 5.93392 13.6267 5.86466 13.5688 5.80626L9.19375 1.43126C9.13535 1.37333 9.06609 1.32751 8.98994 1.2964C8.91379 1.2653 8.83225 1.24953 8.75 1.25001H2.5C2.16848 1.25001 1.85054 1.38171 1.61612 1.61613C1.3817 1.85055 1.25 2.16849 1.25 2.50001V17.5C1.25 17.8315 1.3817 18.1495 1.61612 18.3839C1.85054 18.6183 2.16848 18.75 2.5 18.75H12.5C12.8315 18.75 13.1495 18.6183 13.3839 18.3839C13.6183 18.1495 13.75 17.8315 13.75 17.5V16.25H12.5V17.5H2.5V2.50001H7.5V6.25001C7.5 6.58153 7.6317 6.89947 7.86612 7.13389C8.10054 7.36831 8.41848 7.50001 8.75 7.50001H12.5V8.75001H13.75ZM8.75 6.25001V2.75626L12.2438 6.25001H8.75Z\" fill=\"black\"/>\r\n </svg> <span class=\"template-dropdown bg-white ms-3\">Export </span>\r\n </span>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <ng-container *ngIf=\"(assignTableApiState | async) === 'loaded' && tableArray?.length\">\r\n <div class=\"col-lg-12\" *ngIf=\"searchInput.value && !assignTableData?.length\">\r\n <div class=\"card-body my-8 d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata1.svg\" alt=\"\">\r\n <div class=\"nodata-title\">No data found</div>\r\n <div class=\"nodata-sub\">There is no result for the {{assignType}}</div>\r\n </div>\r\n </div>\r\n <div class=\"col-lg-12\" *ngIf=\"!searchInput.value && !assignTableData?.length\">\r\n <div class=\"card-body my-8 d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata1.svg\" alt=\"\">\r\n <div class=\"nodata-title\">No data found</div>\r\n <div class=\"nodata-sub\">There is no result for the {{assignType}}</div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"assignTableData?.length\">\r\n <div class=\"table-responsive mt-5 mx-4\">\r\n <table *ngIf=\"storeCoverage\" class=\"w-100 table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th class=\"text-align-left\">\r\n <div class=\"cursor-pointer\" (click)=\"sortData('storeName')\">\r\n Store Name\r\n <span\r\n *ngIf=\"sortColumn === 'storeName' && sortBy !== 1 || sortColumn !== 'storeName' \">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumn === 'storeName' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#00A3FF\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n <th class=\"text-align-left\">\r\n <div class=\"cursor-pointer\" (click)=\"sortData('userName')\">\r\n SPOC Name\r\n <span\r\n *ngIf=\"sortColumn === 'userName' && sortBy !== 1 || sortColumn !== 'userName' \">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumn === 'userName' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#00A3FF\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n <th class=\"text-align-left\">\r\n <div class=\"cursor-pointer\" (click)=\"sortData('userEmail')\">\r\n SPOC Email\r\n <span\r\n *ngIf=\"sortColumn === 'userEmail' && sortBy !== 1 || sortColumn !== 'userEmail' \">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumn === 'userEmail' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#00A3FF\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n <th *ngIf=\"assignType ==='cluster'\" class=\"text-align-left\">\r\n <div class=\"cursor-pointer\" (click)=\"sortData('clusterName')\">\r\n Cluster Name\r\n <span\r\n *ngIf=\"sortColumn === 'clusterName' && sortBy !== 1 || sortColumn !== 'clusterName' \">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumn === 'clusterName' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#00A3FF\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let data of assignTableData;let i=index\">\r\n <td>{{data.storeName}}\r\n </td>\r\n <td>{{data.userName ? data.userName : '--'}}</td>\r\n <td>{{data.userEmail ? data.userEmail : '--'}}</td>\r\n <td *ngIf=\"assignType ==='cluster'\">{{data.clusterName ? data.clusterName : '--'}}</td>\r\n </tbody>\r\n </table>\r\n <table *ngIf=\"userCoverage\" class=\"w-100 table bottom-border text-nowrap\"> \r\n <thead>\r\n <tr>\r\n <th class=\"text-align-left\">\r\n <div class=\"cursor-pointer\" (click)=\"sortData('userName')\">\r\n User Name\r\n <span\r\n *ngIf=\"sortColumn === 'userName' && sortBy !== 1 || sortColumn !== 'userName' \">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumn === 'userName' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#00A3FF\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n <th class=\"text-align-left\">\r\n <div class=\"cursor-pointer\" (click)=\"sortData('userEmail')\">\r\n User Email\r\n <span\r\n *ngIf=\"sortColumn === 'userEmail' && sortBy !== 1 || sortColumn !== 'userEmail' \">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumn === 'userEmail' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#00A3FF\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n <th *ngIf=\"assignType ==='team'\" class=\"text-align-left\">\r\n <div class=\"cursor-pointer\" (click)=\"sortData('teamName')\">\r\n Teams Name\r\n <span\r\n *ngIf=\"sortColumn === 'teamName' && sortBy !== 1 || sortColumn !== 'teamName' \">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumn === 'teamName' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#00A3FF\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let data of assignTableData;let i=index\">\r\n <td>{{data.userName}}</td>\r\n <td>{{data.userEmail ? data.userEmail : '--'}}</td>\r\n <td *ngIf=\"assignType ==='team'\">{{data.teamName ? data.teamName : '--'}}</td>\r\n </tbody>\r\n </table>\r\n </div>\r\n <lib-pagination [itemsPerPage]=\"itemsPerPage\" [currentPage]=\"currentPage\"\r\n [totalItems]=\"totalItems\" [paginationSizes]=\"paginationSizes\" [pageSize]=\"pageSize\"\r\n (pageChange)=\"onPageChange($event)\"\r\n (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container\r\n *ngIf=\"(assignTableApiState | async) === 'loading' || (assignTableApiState | async) === 'initial'\">\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-container>\r\n <div>\r\n <ng-container\r\n *ngIf=\"(assignTableApiState | async) === 'loaded' && !tableArray?.length && this.taskDetails?.assign && !['cluster','team'].includes(assignType)\">\r\n <div class=\"row mb-6\">\r\n <div class=\"col-lg-12 assignpadding mb-10 mt-10\">\r\n <div class=\"row\">\r\n <div class=\"hr w-100 border border-1 position-relative\">\r\n <div class=\"position-absolute template-dropdown orposition bg-white w-100px\">or</div>\r\n </div>\r\n <div class=\"uploadpadding mt-10\">\r\n <ul class=\"subtext list-unstyled d-flex flex-column align-items-center mx-4\">\r\n <li>Use the template to upload multiple <span *ngIf=\"storeCoverage\">stores</span> <span *ngIf=\"userCoverage\">users</span> at once.</li> \r\n <li> Download the template here - <span (click)=\"downloadTemplateV2()\" class=\"cursor-pointer\"><span class=\"me-3\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M5.83333 8.33333L10 12.5M10 12.5L14.1667 8.33333M10 12.5V2.5\" stroke=\"#009BF3\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span><span class=\"text-primary\">Download Template</span></span></li>\r\n <li> Add your data to the Template File</li>\r\n </ul>\r\n </div>\r\n <div class=\"w-100 border border-2 text-center border-dashed rounded-3 border-primary p-5\" (dragover)=\"onDragOver($event)\" \r\n (dragleave)=\"onDragLeave($event)\"\r\n (drop)=\"onDrop($event)\"\r\n (click)=\"file.click()\">\r\n <div class=\"\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"46\" height=\"46\" viewBox=\"0 0 46 46\" fill=\"none\">\r\n <rect x=\"3\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" fill=\"#F2F4F7\"/>\r\n <rect x=\"3\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" stroke=\"#F9FAFB\" stroke-width=\"6\"/>\r\n <g clip-path=\"url(#clip0_7979_5202)\">\r\n <path d=\"M26.3335 26.3332L23.0002 22.9999M23.0002 22.9999L19.6669 26.3332M23.0002 22.9999V30.4999M29.9919 28.3249C30.8047 27.8818 31.4467 27.1806 31.8168 26.3321C32.1868 25.4835 32.2637 24.5359 32.0354 23.6388C31.807 22.7417 31.2865 21.9462 30.5558 21.3778C29.8251 20.8094 28.9259 20.5005 28.0002 20.4999H26.9502C26.698 19.5243 26.2278 18.6185 25.5752 17.8507C24.9225 17.0829 24.1042 16.4731 23.182 16.0671C22.2597 15.661 21.2573 15.4694 20.2503 15.5065C19.2433 15.5436 18.2578 15.8085 17.3679 16.2813C16.4779 16.7541 15.7068 17.4225 15.1124 18.2362C14.518 19.05 14.1158 19.9879 13.936 20.9794C13.7563 21.9709 13.8036 22.9903 14.0746 23.961C14.3455 24.9316 14.8329 25.8281 15.5002 26.5832\" stroke=\"#475467\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_7979_5202\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" transform=\"translate(13 13)\"/>\r\n </clipPath>\r\n </defs>\r\n </svg></div>\r\n <div class=\"storetext cursor-pointer fw-bold\"><span class=\"text-primary text-decoration-underline\">Click To Upload</span> \r\n or drag and drop\r\n </div>\r\n <div class=\"headeralign fw-400\">the data added template file for processing.</div>\r\n <input style=\"visibility: hidden;\" type=\"file\" #file\r\n id=\"kt_account_team_size_select_1\" (change)=\"onFileUpload($event)\" />\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-container>\r\n <div class=\"col-lg-12\" *ngIf=\"(assignTableApiState | async) === 'loaded' && !tableArray?.length && this.taskDetails?.assign && ['cluster','team'].includes(assignType)\">\r\n <div class=\"card-body my-8 d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata1.svg\" alt=\"\">\r\n <div class=\"nodata-title\">No data found</div>\r\n <div class=\"nodata-sub\">There is no result for the {{assignType}}</div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n\r\n\r\n\r\n </div>\r\n\r\n\r\n </div>\r\n </div>\r\n </div>\r\n</div>\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 xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\" stroke=\"#00A3FF\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n </div> <span class=\"config-heading fw-semibold ms-5 w-auto\">Bulk Upload</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\">Step 1 - <a class=\"text-decoration-underline cursor-pointer\" (click)=\"downloadTemplateV2()\">Download the template here</a></div>\r\n <div class=\"storeAssign mt-3\" style=\"font-weight: 400\">Step2 - Add your data to the Template File with existing <span *ngIf=\"storeCoverage\">store</span> <span *ngIf=\"userCoverage\">user</span> data</div>\r\n <div class=\"storeAssign mt-3\" style=\"font-weight: 400\">Step3 - Upload it below for processing</div>\r\n\r\n <div class=\"fw-bold storeAssign mt-10\">**Note : On upload, all the existing data will be replaced</div>\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)=\"model.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)\" />\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=\"card-title mt-3\"><span class=\"config-heading fw-semibold w-auto\">Assign <span *nfIf=\"storeCoverage\">Stores</span> <span *ngIf=\"userCoverage\">Users</span></span></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 *nfIf=\"storeCoverage\">Stores</span> <span *ngIf=\"userCoverage\">Users</span></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\">{{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 <div *ngIf=\"!excelError\" class=\"table-header mt-5\" style=\"font-weight: 400;\">\r\n <div *ngIf=\"!showStore&&!showTeam&&!showCluster&&!showUser&&!showInactive\">You're about to assign {{getStoreCounts(excelData)}} <span *ngIf=\"storeCoverage\">stores</span><span *ngIf=\"userCoverage\">users</span> to the checklist. Are you sure want to proceed?</div>\r\n <div *ngIf=\"storeCoverage && showStore\" class=\"mt-3\">Store <span *ngFor=\"let store of validatedStore;let last = last\" class=\"fw-semibold config-heading\">{{store}}<span *ngIf=\"!last\">,</span></span> that I\u2019m looking for isn\u2019t available, <a routerLink=\"/manage/stores\" [queryParams]=\"{tyoe: 'stores'}\" class=\"text-decoration-underline cursor-pointer\" (click)=\"closeactivepopup()\">Onboard Stores</a></div>\r\n <div *ngIf=\"userCoverage && showUser\" class=\"mt-3\">User <span *ngFor=\"let store of validatedUser;let last = last\" class=\"fw-semibold config-heading\">{{store}}<span *ngIf=\"!last\">,</span></span> that I\u2019m looking for isn\u2019t available, <a class=\"text-decoration-underline cursor-pointer\" (click)=\"closeactivepopup();confirmUserpopup()\">Onboard Users</a></div>\r\n <div *ngIf=\"userCoverage && showTeam\" class=\"mt-3\">Team <span *ngFor=\"let store of validatedTeam;let last = last\" class=\"fw-semibold config-heading\">{{store}}<span *ngIf=\"!last\">,</span></span> that I\u2019m looking for isn\u2019t available, <a routerLink=\"/manage/users/client\" class=\"text-decoration-underline cursor-pointer\" (click)=\"closeactivepopup()\">Create Team</a></div>\r\n <div *ngIf=\"storeCoverage && showCluster\" class=\"mt-3\">user <span *ngFor=\"let store of validatedCluster;let last = last\" class=\"fw-semibold config-heading\">{{store}}<span *ngIf=\"!last\">,</span></span> that I\u2019m looking for isn\u2019t available, <a routerLink=\"/manage/stores\" class=\"text-decoration-underline cursor-pointer\" [queryParams]=\"{tyoe: 'cluster'}\" (click)=\"closeactivepopup()\">Create Cluster</a></div>\r\n <div *ngIf=\"storeCoverage && showUser\" class=\"mt-3\">User <span *ngFor=\"let store of validatedUser;let last = last\" class=\"fw-semibold config-heading\">{{store}}<span *ngIf=\"!last\">,</span></span> that I\u2019m looking for isn\u2019t available, <a class=\"text-decoration-underline cursor-pointer\" (click)=\"closeactivepopup();confirmUserpopup()\">Onboard Users</a></div>\r\n <div *ngIf=\"storeCoverage && showInactive\" class=\"mt-3\">Store <span *ngFor=\"let store of inactiveStores;let last = last\" class=\"fw-semibold config-heading\">{{store}}<span *ngIf=\"!last\">,</span></span> that I\u2019m looking for is inactive, <a routerLink=\"/manage/stores\" [queryParams]=\"{tyoe: 'stores'}\" class=\"text-decoration-underline cursor-pointer\" (click)=\"closeactivepopup()\">Onboard Stores</a></div>\r\n </div>\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' : ''\" 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&&!showStore&&!showCluster&&!showUser&&!showTeam&&!showInactive\" class=\"btn btn-md py-4 btn-default ms-3 btn-primary\" (click)=\"validateDetails()\">Proceed</button>\r\n <button *ngIf=\"excelError||showStore||showCluster||showUser||showTeam || showInactive\" class=\"btn py-3 btn-md btn-default ms-3 btn-danger\" (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>\r\n\r\n<ng-template #confirmUser 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 d-flex flex-column 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 xmlns=\"http://www.w3.org/2000/svg\" width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\"><rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#FEF0C7\"/><path d=\"M27.9998 24.0012V28.0012M27.9998 32.0012H28.0098M26.2898 18.8612L17.8198 33.0012C17.6451 33.3036 17.5527 33.6465 17.5518 33.9957C17.5508 34.3449 17.6413 34.6883 17.8142 34.9917C17.9871 35.2951 18.2365 35.5479 18.5375 35.725C18.8385 35.9021 19.1806 35.9973 19.5298 36.0012H36.4698C36.819 35.9973 37.1611 35.9021 37.4621 35.725C37.7631 35.5479 38.0124 35.2951 38.1854 34.9917C38.3583 34.6883 38.4488 34.3449 38.4478 33.9957C38.4468 33.6465 38.3544 33.3036 38.1798 33.0012L29.7098 18.8612C29.5315 18.5673 29.2805 18.3243 28.981 18.1557C28.6814 17.987 28.3435 17.8984 27.9998 17.8984C27.656 17.8984 27.3181 17.987 27.0186 18.1557C26.7191 18.3243 26.468 18.5673 26.2898 18.8612Z\" stroke=\"#DC6803\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#FFFAEB\" stroke-width=\"8\"/></svg>\r\n </div><br>\r\n <div class=\"config-heading fw-semibold w-auto\">New User found in uploaded file</div>\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\">This CSV contains a new User. Add new User in the User Management under Manage menu.</div>\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\" routerLink=\"/manage/users/client\" (click)=\"closeactivepopup()\">Skip New Entries</button> -->\r\n <button class=\"btn btn-md py-4 btn-default ms-3 btn-primary\" (click)=\"model.close('confirm')\">Invite Selected</button>\r\n </div>\r\n </div>\r\n</ng-template>", styles: [".c-card{padding:24px;background:#fff;border-radius:16px}.plain-input{border:none;outline:none;background:transparent;padding:0;margin:0;width:100%;overflow:hidden;color:var(--black, #101828);text-overflow:ellipsis;font-family:Inter;font-size:18px;font-style:normal;font-weight:500;line-height:28px}.plain-input:focus{border-radius:0!important;border:white!important;outline:none!important;box-shadow:none!important}.checklist-name{font-size:20px;font-weight:600;line-height:28px;text-align:left;color:#667085!important}.checklist-desc{font-size:14px;font-weight:400;line-height:18px;text-align:left}:host::ng-deep .date-picker .md-drppicker .btn{line-height:10px!important}:host::ng-deep .date-picker .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .date-picker .md-drppicker.drops-down-right.ltr.show-ranges.shown{top:65px!important}:host::ng-deep .date-picker .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;right:-475px!important;left:unset!important;height:400px!important}:host::ng-deep .date-picker .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 .date-picker .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 .date-picker .md-drppicker td.active,:host::ng-deep .date-picker .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 .date-picker .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .date-picker .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .date-picker .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 .date-picker table th,:host::ng-deep .date-picker table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .date-picker .md-drppicker td.available.prev,:host::ng-deep .date-picker .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 .date-picker .md-drppicker td.available.next,:host::ng-deep .date-picker .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 .date-picker 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 .date-picker .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 .date-picker .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .date-picker .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}.assignpadding{padding:0 40px}.uploadpadding{padding:0 20% 9px}.orposition{top:0;left:50%;transform:translate(-50%,-50%);text-align:center}.storetext{color:var(--Gray-500, #667085);font-size:14px;font-weight:500;line-height:20px}.storeAssign{color:var(--Gray-700, #344054);font-family:Inter;font-size:14px;font-style:normal;font-weight:500;line-height:20px}.storeAssign a:hover{text-decoration:underline!important}.border-primary{border:1px dashed var(--Primary-500, #33B5FF)!important;background:var(--Primary-25, #F6FCFF)!important}.template-dropdown{background:var(--Gray-100, #F2F4F7);color:var(--Gray-700, #344054);font-size:14px;font-weight:500;line-height:20px}.uploadtext{color:var(--gray-700, #344054);font-family:Inter;font-size:16px;font-style:normal;font-weight:600;line-height:24px;text-transform:capitalize}.subtext{color:var(--gray-500, #667085);font-family:Inter;font-size:14px;font-weight:400;line-height:20px;align-items:center;gap:8px;align-self:stretch}.selectstore{color:var(--primary-700, #009BF3);font-family:Inter;font-size:14px;font-style:normal;font-weight:600;line-height:20px;text-decoration-line:underline;text-transform:capitalize}.sub{color:var(--gray-700, #101828);font-family:Inter;font-size:16px;font-style:normal;font-weight:500;line-height:24px}.subopen{color:var(--black, #101828);font-family:Inter;font-size:16px;font-style:normal;font-weight:500;line-height:24px}.headeralign{color:var(--gray-500, #667085);font-family:Inter;font-size:12px;font-style:normal;font-weight:500;line-height:18px}.selected-radio{width:1.5rem!important;height:1.5rem!important}.subtitle{font-family:Inter;font-size:14px;font-weight:400;line-height:20px;letter-spacing:0em;text-align:left;color:#667085}.form-control.form-control-solid{display:flex;padding:11px 14px;align-items:center;gap:8px;align-self:stretch;border-radius:8px;border:1px solid var(--gray-500, #D0D5DD);background:var(--white, #FFF);box-shadow:0 1px 2px #1018280d}.outer-container{position:relative}.outer-container .form-control{padding-top:0;padding-bottom:0}.outer-container .input-container{border:1px solid black;height:100%;width:100%;display:flex;flex-wrap:wrap;border:1px solid #D0D5DD}.outer-container .input-container input{all:unset;flex:1;min-width:50px}.outer-container .input-container .chip{margin:10px 0 10px 10px;padding:3px 10px;border-radius:16px;background:var(--Gray-100, #F2F4F7);color:var(--Gray-700, #344054);font-family:Inter;font-size:14px;font-weight:500;line-height:20px}.outer-container .input-container .chip .initials{color:var(--Primary-600, #00A3FF);font-size:12px;font-weight:500;line-height:18px}.outer-container .input-container .chip:nth-child(1){margin-left:0}.toggle-card{padding:16px;display:flex;align-items:center;border-radius:8px;border:1px solid #EAECF0;background:#fff}.toggle-card .header{color:#344054;font-size:16px;font-weight:500;line-height:24px}.toggle-card .desc{color:var(--Gray-500, #667085);font-size:14px;font-weight:400;line-height:20px}.toggle-card.selected{border:1px solid #6BCAFF}.toggle-card.selected .header{color:#008edf}.toggle-card.selected .desc{color:#00a3ff}.sub-txt{color:#667085;font-size:14px;font-weight:400;line-height:20px;gap:8px}.cstm-blu-btn{padding:8px 14px;border-radius:8px;border:1px solid #EAF8FF;background:#eaf8ff;box-shadow:0 1px 2px #1018280d;color:#009bf3;font-size:14px;font-weight:600;line-height:20px;cursor:pointer;display:flex;align-items:center}.schedule-text{color:#344054;font-size:16px;font-weight:500;line-height:24px}input[type=checkbox].c-checkbox{width:16px!important;height:16px!important;margin:5px;border-radius:4px!important;-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;appearance:none;outline:1px solid var(--gray-600, #D0D5DD)!important;box-shadow:none;font-size:.5em;text-align:center;line-height:1em;background:#fff}input[type=checkbox].c-checkbox:checked{outline:1px solid var(--primary-600, #00A3FF)!important;background-color:var(--primary-50, #EAF8FF)}input[type=checkbox].c-checkbox:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.5em;padding-left:3px;padding-top:10px;padding-right:0}.reminder-header{color:#101828;font-size:20px;font-weight:600;line-height:30px}.reminder-description{color:#344054;font-size:14px;font-weight:500;line-height:20px}.reminder-sub{color:#101828;font-size:16px;font-weight:500;line-height:24px}.table-header{color:var(--Gray-800, #1D2939);font-size:16px;font-weight:600;line-height:24px}.text-error{color:var(--Error-700, #B42318)!important;font-size:14px;font-weight:500;line-height:20px}.excel-error{color:var(--Error-600, #D92D20);font-size:14px;font-weight:500;line-height:20px}.error-heading{color:var(--Error-600, #D92D20);font-size:20px;font-weight:500;line-height:30px}.border-error{border:1px solid var(--Error-300, #FDA29B)!important;background:var(--Error-25, #FFFBFA)!important}.popup-card{border-radius:6px;border:1px solid var(--Gray-300, #D0D5DD);background:#fff;box-shadow:0 1px 3px #1018281a,0 1px 2px #1018280f}.nav{display:flex;align-items:center;gap:16px;flex:1 0 0;align-self:stretch;--bs-nav-link-color: none}.nav-item .nav-link{color:var(--Gray-500, #667085);font-size:16px;font-weight:500}.nav-item .nav-link:hover{border-bottom:none!important}.nav-item .nav-link.active{border-radius:10px!important;border-bottom:none!important}.nav-item .bg-light-primary{background:var(--Primary-50, #EAF8FF)!important}\n"], dependencies: [{ kind: "directive", type: i7.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i5.PaginationComponent, selector: "lib-pagination", inputs: ["collection", "itemsPerPage", "currentPage", "totalItems", "directionLinks", "pageSize", "paginationSizes"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "directive", type: i6.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i6.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i6.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i6.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i6.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i6.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i8.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: i9.ChipDropdownComponent, selector: "lib-chip-dropdown", inputs: ["data", "selectedData"], outputs: ["selectedList"] }, { kind: "component", type: i10.MultiChipDropdownComponent, selector: "lib-multi-chip-dropdown", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label", "badgeValue", "searchKey", "assignType"], outputs: ["selected", "removed"] }, { kind: "pipe", type: i7.AsyncPipe, name: "async" }, { kind: "pipe", type: i7.TitleCasePipe, name: "titlecase" }] });
1511
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: TaskConfigureComponent, selector: "lib-task-configure", viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["file"], descendants: true }, { propertyName: "fileInput1", first: true, predicate: ["file1"], descendants: true }, { propertyName: "bulkupload", first: true, predicate: ["bulkupload"], descendants: true }, { propertyName: "afterValidation", first: true, predicate: ["afterValidation"], descendants: true }, { propertyName: "confirmUser", first: true, predicate: ["confirmUser"], descendants: true }], ngImport: i0, template: "<div class=\"row\">\r\n <div class=\"col-12 mb-5\">\r\n <div class=\"c-card d-flex justify-content-between\">\r\n <div class=\"d-flex justify-content-start align-items-center\">\r\n <div [routerLink]=\"'/manage/trax/checklist/managetask'\" class=\"btn btn-sm btn-outline me-5 px-3 py-3\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M15.8332 10.0003H4.1665M4.1665 10.0003L9.99984 15.8337M4.1665 10.0003L9.99984 4.16699\" stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></div>\r\n <div *ngIf=\"taskDetails\">\r\n <div class=\"checklist-name mb-5\">{{taskDetails.checkListName}}</div>\r\n <div class=\"checklist-desc\">{{taskDetails.checkListDescription}}</div>\r\n </div>\r\n </div>\r\n <div class=\"d-flex align-items-center\">\r\n <button class=\"btn btn-primary py-3 me-5\" (click)=\"detassignUpdate('publish')\">Publish</button>\r\n <button class=\"btn btn-outline\" (click)=\"detassignUpdate('save')\">Save as Draft</button>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-3\">\r\n <div style=\"height: 80vh; overflow-y: auto;\" class=\"c-card\">\r\n <h2 class=\"mb-5\">Schedule</h2>\r\n <div class=\"d-flex mb-5\">\r\n <svg class=\"me-4\" xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"\r\n fill=\"none\">\r\n <path\r\n d=\"M16 2V6M8 2V6M3 10H21M5 4H19C20.1046 4 21 4.89543 21 6V20C21 21.1046 20.1046 22 19 22H5C3.89543 22 3 21.1046 3 20V6C3 4.89543 3.89543 4 5 4Z\"\r\n stroke=\"#667085\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"schedule-text\">\r\n {{dueDateFormatted}}\r\n </span>\r\n </div>\r\n <div class=\"d-flex mb-5\">\r\n <svg class=\"me-4\" xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"\r\n fill=\"none\">\r\n <path\r\n d=\"M12 6V12L16 14M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z\"\r\n stroke=\"#667085\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"schedule-text\">{{dueTimeFormatted}}</span>\r\n </div>\r\n <h2 class=\"mb-5\">Assign</h2>\r\n <div class=\"d-flex mb-5\">\r\n <svg class=\"me-4\" xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"\r\n fill=\"none\">\r\n <path\r\n d=\"M16 4H18C18.5304 4 19.0391 4.21071 19.4142 4.58579C19.7893 4.96086 20 5.46957 20 6V20C20 20.5304 19.7893 21.0391 19.4142 21.4142C19.0391 21.7893 18.5304 22 18 22H6C5.46957 22 4.96086 21.7893 4.58579 21.4142C4.21071 21.0391 4 20.5304 4 20V6C4 5.46957 4.21071 4.96086 4.58579 4.58579C4.96086 4.21071 5.46957 4 6 4H8M9 2H15C15.5523 2 16 2.44772 16 3V5C16 5.55228 15.5523 6 15 6H9C8.44772 6 8 5.55228 8 5V3C8 2.44772 8.44772 2 9 2Z\"\r\n stroke=\"#667085\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"schedule-text\">\r\n {{coverage}}s\r\n </span>\r\n </div>\r\n <div class=\"d-flex mb-5\">\r\n <svg class=\"me-4\" xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"\r\n fill=\"none\">\r\n <path\r\n d=\"M3.08995 6.88381L3.02401 6.98681C2.30358 8.25569 3.06101 9.87957 4.46464 10.0664C4.58627 10.0813 4.70112 10.0894 4.8145 10.0894C5.55255 10.0894 6.20523 9.77241 6.65953 9.27929L7.21286 8.67867L7.76432 9.28101C8.21367 9.77184 8.8652 10.0894 9.60776 10.0894C10.3471 10.0894 11.0022 9.77149 11.4512 9.28101L12.0044 8.67677L12.5576 9.28101C13.0066 9.77149 13.6617 10.0894 14.401 10.0894C15.1404 10.0894 15.7954 9.77149 16.2445 9.28101L16.7977 8.67678L17.3508 9.28101C17.7999 9.77149 18.4549 10.0894 19.1943 10.0894C19.3041 10.0894 19.4223 10.0812 19.5433 10.0665C20.9772 9.8718 21.7355 8.164 20.9155 6.88431C20.9154 6.88425 20.9154 6.8842 20.9154 6.88414L18.8056 3.59441L18.8056 3.59441L18.8046 3.59294C18.7582 3.52014 18.6649 3.46436 18.5584 3.46436H5.44307C5.3365 3.46436 5.24326 3.52014 5.19681 3.59295L5.19619 3.59391L3.08995 6.88381ZM4.81818 12.7501C4.71644 12.7501 4.616 12.747 4.5169 12.7411V16.6429V18.9644C4.5169 19.8212 5.22663 20.5358 6.11942 20.5358H17.882C18.7748 20.5358 19.4845 19.8212 19.4845 18.9644V16.6429V12.7416C19.3874 12.7471 19.2893 12.7501 19.1906 12.7501C19.0022 12.7501 18.8157 12.74 18.632 12.7203V16.6429V17.3929H17.882H6.11942H5.36942V16.6429V12.7211C5.18866 12.7402 5.00472 12.7501 4.81818 12.7501Z\"\r\n stroke=\"#101828\" stroke-width=\"1.5\" />\r\n </svg>\r\n <span class=\"schedule-text\">{{assignSingle?.length + groupAssign?.length}} {{coverage}}{{(assignSingle?.length + groupAssign?.length) > 1 ? 's':''}}</span>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n <div class=\"col-9\">\r\n <div style=\"height: 80vh; overflow-y: auto;\" class=\"c-card\">\r\n <div class=\"row\">\r\n <div class=\"col-6 mb-5\">\r\n <div class=\"date-picker\">\r\n <label for=\"datepick\" class=\"form-label\">Due date</label>\r\n <div style=\"position: relative;\">\r\n <svg style=\"position: absolute; top: 12px; left:12px;\" xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" 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\" stroke-linejoin=\"round\">\r\n </path>\r\n </svg>\r\n <input id=\"datepick\" class=\"fx-date-range form-control ps-14\" type=\"text\"\r\n ngxDaterangepickerMd [singleDatePicker]=\"true\" [minDate]=\"minDate\" [drops]=\"'down'\"\r\n [opens]=\"'right'\" [alwaysShowCalendars]=\"false\" [keepCalendarOpeningWithRange]=\"true\"\r\n [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"scheduleDate\" [autoApply]=\"false\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n name=\"daterange\" [readonly]=\"true\" />\r\n </div>\r\n\r\n </div>\r\n\r\n </div>\r\n <div class=\"col-6 mb-5\">\r\n <label for=\"timePick\" class=\"form-label\">Due time</label>\r\n <input [formControl]=\"scheduleEndTime\" type=\"time\" class=\"form-control\" id=\"timePick\"\r\n >\r\n </div>\r\n <div class=\"col-6 mb-5\">\r\n <label class=\"form-label\">Approver</label>\r\n <lib-chip-dropdown [data]=\"approversList\" [selectedData]=\"approver.value\"\r\n (selectedList)=\"onApproveAdded($event)\"></lib-chip-dropdown>\r\n\r\n </div>\r\n <div class=\"col-6 mb-5\">\r\n <label for=\"priority\" class=\"form-label\">Priority</label>\r\n <select [formControl]=\"priorityType\" id=\"priority\" class=\"form-select mb-5\">\r\n <option value=\"high\">High</option>\r\n <option value=\"medium\">Medium</option>\r\n <option value=\"low\">Low</option>\r\n </select>\r\n </div>\r\n\r\n <div class=\"col-12 mb-5\">\r\n <div class=\"toggle-card\" [ngClass]=\"allowedStoreLocation.value ? 'selected' : ''\">\r\n <div class=\"form-check form-switch me-4\">\r\n <input [formControl]=\"allowedStoreLocation\" class=\"form-check-input\" type=\"checkbox\"\r\n role=\"switch\">\r\n </div>\r\n <div>\r\n <div class=\"header\">Geo fencing</div>\r\n <div class=\"desc\">By enabling, the checklist can be filled by the user only when inside the\r\n store.</div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n <div class=\"col-12 mb-5\">\r\n <div class=\"toggle-card \" [ngClass]=\"restrictAttendance.value ? 'selected' : ''\">\r\n <div class=\"form-check form-switch me-4\">\r\n <input [formControl]=\"restrictAttendance\" class=\"form-check-input\" type=\"checkbox\"\r\n role=\"switch\">\r\n </div>\r\n <div>\r\n <div class=\"header\">Restrict attendance</div>\r\n <div class=\"desc\">By enabling, user can't be able to clockout without completing the task.\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n\r\n <div class=\"col-12 mb-5\">\r\n <div class=\"d-flex align-items-center mb-2\">\r\n <label class=\"reminder-header me-4\" for=\"reminderToggle\">Reminder</label>\r\n <div class=\"form-check form-switch\">\r\n <input [checked]=\"reminderRepeatSchedules.controls.length\" (change)=\"enableReminder($event)\" class=\"form-check-input\" type=\"checkbox\" role=\"switch\" id=\"reminderToggle\">\r\n </div>\r\n </div>\r\n <div class=\"reminder-description mb-5\" >\r\n By enabling, the users will be reminded in the selected interval \r\n </div>\r\n\r\n <div class=\"d-flex align-items-center mb-5\" >\r\n <ng-container *ngIf=\"reminderRepeatSchedules.controls.length\" >\r\n <div class=\"reminder-sub me-4\" >Notify user before</div>\r\n <ng-container *ngFor=\"let control of reminderRepeatSchedules.controls; let i = index\" >\r\n <div class=\"d-flex align-items-center position-relative w-200px me-4\" >\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\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_1487_47636)\">\r\n <path\r\n d=\"M10.0013 5.00033V10.0003L13.3346 11.667M18.3346 10.0003C18.3346 14.6027 14.6037 18.3337 10.0013 18.3337C5.39893 18.3337 1.66797 14.6027 1.66797 10.0003C1.66797 5.39795 5.39893 1.66699 10.0013 1.66699C14.6037 1.66699 18.3346 5.39795 18.3346 10.0003Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_1487_47636\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <select [formControl]=\"getFormControlFromArray(i)\" class=\"form-select ps-14 me-5\" >\r\n <ng-container *ngFor=\"let item of reminderRepeatScheduleOptions\" >\r\n <option [ngClass]=\"disableScheduleOption(item) ? 'd-none' : ''\" [ngValue]=\"item\" >{{item}} mins</option>\r\n </ng-container>\r\n </select>\r\n </div> \r\n </ng-container>\r\n </ng-container>\r\n\r\n \r\n <div *ngIf=\"reminderRepeatSchedules.controls.length > 0 && reminderRepeatSchedules.controls.length < 3 \" class=\"me-4\">\r\n <button (click)=\"addMoreSchedules()\" class=\"btn btn-sm btn-outline h-100\" ><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\" >\r\n <path d=\"M10.0013 4.16699V15.8337M4.16797 10.0003H15.8346\" stroke=\"#344054\" stroke-width=\"1.67\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </button>\r\n </div> \r\n </div>\r\n\r\n <div class=\"reminder-sub me-4\" ><span *ngIf=\"reminderRepeatSchedules.controls?.[0]\" >Send Alerts {{reminderRepeatSchedules.at(0).value}} Mins</span><span *ngIf=\"reminderRepeatSchedules.controls?.[1]\">, {{reminderRepeatSchedules.at(1).value}} Mins </span><span *ngIf=\"reminderRepeatSchedules.controls?.[2]\">and {{reminderRepeatSchedules.at(2).value}} Mins</span> before the checklist end time</div>\r\n \r\n </div>\r\n\r\n\r\n <div class=\"col-12\">\r\n <div class=\"d-flex align-items-center justify-content-between mb-5\">\r\n <h2>Assign</h2>\r\n </div>\r\n\r\n <div class=\"mb-5 ms-5 d-flex\">\r\n <div class=\"form-check d-flex align-items-center\">\r\n <input\r\n class=\"form-check-input selected-radio cursor-pointer me-3\" type=\"radio\" name=\"stores\" [checked]=\"storeCoverage\" (click)=\"selectRadio('store')\">\r\n <label class=\"uploadtext cursor-pointer fw-semibold\">Assign Stores and Clusters</label>\r\n </div>\r\n <div class=\"form-check ms-5 d-flex align-items-center\">\r\n <input\r\n class=\"form-check-input selected-radio cursor-pointer me-3\" type=\"radio\" name=\"users\" [checked]=\"userCoverage\" (click)=\"selectRadio('user')\">\r\n <label class=\"uploadtext cursor-pointer fw-semibold\">Assign Users and Teams</label>\r\n </div>\r\n </div>\r\n\r\n <div class=\"d-flex ms-5 align-items-center justify-content-between\">\r\n <div class=\"d-flex overflow-auto h-45px w-75 mt-5\">\r\n <ul *ngIf=\"storeCoverage\"\r\n class=\"nav nav-stretch nav-line-tabs nav-line-tabs-2x border-transparent fs-5 fw-bolder flex-nowrap\">\r\n <li (click)=\"selectedTab('store')\" class=\"nav-item cursor-pointer h-100\"><span\r\n [ngClass]=\"assignType ==='store' ? 'active bg-light-primary text-primary' :''\"\r\n class=\"nav-link text-active-primary m-0 px-5\">Stores</span>\r\n </li>\r\n <li (click)=\"selectedTab('cluster')\" class=\"nav-item cursor-pointer h-100\"><a\r\n [ngClass]=\"assignType ==='cluster' ? 'active bg-light-primary text-primary' :''\"\r\n class=\"nav-link text-active-primary m-0 px-5\">Clusters</a></li>\r\n </ul>\r\n <ul *ngIf=\"userCoverage\"\r\n class=\"nav nav-stretch nav-line-tabs nav-line-tabs-2x border-transparent fs-5 fw-bolder flex-nowrap\">\r\n <li (click)=\"selectedTab('user')\" class=\"nav-item cursor-pointer h-100\"><a\r\n [ngClass]=\"assignType ==='user' ? 'active bg-light-primary text-primary' :''\"\r\n class=\"nav-link text-active-primary m-0 px-5\">Users</a>\r\n </li>\r\n <li (click)=\"selectedTab('team')\" class=\"nav-item cursor-pointer h-100\"><a\r\n [ngClass]=\"assignType ==='team' ? 'active bg-light-primary text-primary' :''\"\r\n class=\"nav-link text-active-primary m-0 px-5\">Teams</a></li>\r\n </ul>\r\n </div>\r\n <div *ngIf=\"!['cluster','team'].includes(assignType)\" class=\"d-flex align-items-center\">\r\n <div *ngIf=\"storeCoverage\" (click)=\"addStoreComponent()\" class=\"btn btn-outline px-4 ng-star-inserted mt-8\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M10.0001 4.16602V15.8327M4.16675 9.99935H15.8334\" stroke=\"#344054\"\r\n stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n </path>\r\n </svg>\r\n <span>Assign Store</span>\r\n </div>\r\n <div *ngIf=\"userCoverage\" (click)=\"addStoreComponent()\" class=\"btn btn-outline px-4 ng-star-inserted mt-8\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M10.0001 4.16602V15.8327M4.16675 9.99935H15.8334\" stroke=\"#344054\"\r\n stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n </path>\r\n </svg>\r\n <span>Assign User</span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"w-100 ms-5\">\r\n <div class=\"table-header mt-5 d-flex align-items-center justify-content-between\">\r\n <div class=\"table-title\">Selected <span *ngIf=\"storeCoverage\">{{assignType | titlecase}}s</span></div>\r\n </div>\r\n <div class=\"w-100 mt-3 pe-5\">\r\n <lib-multi-chip-dropdown *ngIf=\"storeList && taskDetails\" [items]=\"storeList\" [multi]=\"true\" [searchField]=\"['storeName','clusterName','storeId','userName','teamName']\" [searchKey]=\"searchKey\" [idField]=\"'_id'\"\r\n (selected)=\"updateAssign($event)\" (removed)=\"removedChip($event)\" [selectedValues]=\"taskDetails.assign\"></lib-multi-chip-dropdown>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"(assignTableApiState | async) === 'loaded' && tableArray?.length\" class=\"card-body px-0 mt-0 pt-0 pb-0 mx-4 mb-5\">\r\n <div class=\" w-100\">\r\n <div class=\"table-header mt-5 d-flex align-items-center justify-content-between\">\r\n <div class=\"table-title\">Selected <span>{{assignType | titlecase}}s</span> List</div>\r\n <div class=\"d-flex align-items-center justify-content-start\">\r\n <div class=\"me-3\">\r\n <!-- <span class=\"svg-icon svg-icon-1 align-items-center position-absolute mt-3 ms-6\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\"\r\n viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\"\r\n rx=\"1\" transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\">\r\n </rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span> -->\r\n <input [formControl]=\"searchInput\" type=\"text\" data-kt-subscription-table-filter=\"search\" (change)=\"searchTableData()\"\r\n class=\"form-control form-control-solid w-200px ps-5 mx-1 me-4\" autocomplete=\"off\" \r\n autocapitalize=\"none\" \r\n spellcheck=\"false\" style=\"text-transform: none\" placeholder=\"Search...\"> \r\n </div>\r\n\r\n <div *ngIf=\"!['cluster','team'].includes(assignType)\" class=\"position-relative w-100 mt-5 mb-5\">\r\n <button type=\"button\"\r\n class=\"btn py-3 btn-default w-100 btn-outline btn-outline-default rounded-3 text-nowrap border-val d-flex justify-content-between\">\r\n <span class=\"me-3 cursor-pointer\" (click)=\"file.click()\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\" stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg> <span #upload class=\"template-dropdown ms-3 bg-white\">BulkUpload </span></span>\r\n <span class=\"subtitle mx-3 me-2\"> | </span>\r\n <span class=\"cursor-pointer\" (click)=\"openDropdown($event)\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <path d=\"M6 9L12 15L18 9\" stroke=\"#344054\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span>\r\n <span><input style=\"display: none;\" type=\"file\" #file\r\n id=\"kt_account_team_size_select_1\" (change)=\"onFileUpload($event)\" /></span>\r\n </button>\r\n\r\n <div *ngIf=\"dropDown\" class=\"card template-dropdown h-40px w-100 position-absolute rounded-3 z-1 top-50px end-0\">\r\n <ul class=\"list-unstyled mb-0 w-auto cursor-pointer\" (click)=\"bulkuploadModel()\">\r\n <li class=\"px-5 fw-semibold cursor-pointer py-2\">Download Template</li>\r\n </ul>\r\n </div>\r\n </div>\r\n <div *ngIf=\"['cluster','team'].includes(assignType)\">\r\n <button type=\"button\"\r\n class=\"btn py-3 btn-default w-100 btn-outline btn-outline-default rounded-3 text-nowrap border-val d-flex justify-content-between\" (click)=\"downloadTemplateV2()\">\r\n <span class=\"me-3 cursor-pointer\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M8.125 13.125H16.3562L14.7438 14.7438L15.625 15.625L18.75 12.5L15.625 9.375L14.7438 10.2562L16.3562 11.875H8.125V13.125Z\" fill=\"black\"/>\r\n <path d=\"M13.75 8.75001V6.25001C13.7505 6.16776 13.7347 6.08622 13.7036 6.01007C13.6725 5.93392 13.6267 5.86466 13.5688 5.80626L9.19375 1.43126C9.13535 1.37333 9.06609 1.32751 8.98994 1.2964C8.91379 1.2653 8.83225 1.24953 8.75 1.25001H2.5C2.16848 1.25001 1.85054 1.38171 1.61612 1.61613C1.3817 1.85055 1.25 2.16849 1.25 2.50001V17.5C1.25 17.8315 1.3817 18.1495 1.61612 18.3839C1.85054 18.6183 2.16848 18.75 2.5 18.75H12.5C12.8315 18.75 13.1495 18.6183 13.3839 18.3839C13.6183 18.1495 13.75 17.8315 13.75 17.5V16.25H12.5V17.5H2.5V2.50001H7.5V6.25001C7.5 6.58153 7.6317 6.89947 7.86612 7.13389C8.10054 7.36831 8.41848 7.50001 8.75 7.50001H12.5V8.75001H13.75ZM8.75 6.25001V2.75626L12.2438 6.25001H8.75Z\" fill=\"black\"/>\r\n </svg> <span class=\"template-dropdown bg-white ms-3\">Export </span>\r\n </span>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <ng-container *ngIf=\"(assignTableApiState | async) === 'loaded' && tableArray?.length\">\r\n <div class=\"col-lg-12\" *ngIf=\"searchInput.value && !assignTableData?.length\">\r\n <div class=\"card-body my-8 d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata1.svg\" alt=\"\">\r\n <div class=\"nodata-title\">No data found</div>\r\n <div class=\"nodata-sub\">There is no result for the {{assignType}}</div>\r\n </div>\r\n </div>\r\n <div class=\"col-lg-12\" *ngIf=\"!searchInput.value && !assignTableData?.length\">\r\n <div class=\"card-body my-8 d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata1.svg\" alt=\"\">\r\n <div class=\"nodata-title\">No data found</div>\r\n <div class=\"nodata-sub\">There is no result for the {{assignType}}</div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"assignTableData?.length\">\r\n <div class=\"table-responsive mt-5 mx-4\">\r\n <table *ngIf=\"storeCoverage\" class=\"w-100 table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th class=\"text-align-left\">\r\n <div class=\"cursor-pointer\" (click)=\"sortData('storeName')\">\r\n Store Name\r\n <span\r\n *ngIf=\"sortColumn === 'storeName' && sortBy !== 1 || sortColumn !== 'storeName' \">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumn === 'storeName' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#00A3FF\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n <th class=\"text-align-left\">\r\n <div class=\"cursor-pointer\" (click)=\"sortData('userName')\">\r\n SPOC Name\r\n <span\r\n *ngIf=\"sortColumn === 'userName' && sortBy !== 1 || sortColumn !== 'userName' \">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumn === 'userName' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#00A3FF\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n <th class=\"text-align-left\">\r\n <div class=\"cursor-pointer\" (click)=\"sortData('userEmail')\">\r\n SPOC Email\r\n <span\r\n *ngIf=\"sortColumn === 'userEmail' && sortBy !== 1 || sortColumn !== 'userEmail' \">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumn === 'userEmail' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#00A3FF\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n <th *ngIf=\"assignType ==='cluster'\" class=\"text-align-left\">\r\n <div class=\"cursor-pointer\" (click)=\"sortData('clusterName')\">\r\n Cluster Name\r\n <span\r\n *ngIf=\"sortColumn === 'clusterName' && sortBy !== 1 || sortColumn !== 'clusterName' \">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumn === 'clusterName' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#00A3FF\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let data of assignTableData;let i=index\">\r\n <td>{{data.storeName}}\r\n </td>\r\n <td>{{data.userName ? data.userName : '--'}}</td>\r\n <td>{{data.userEmail ? data.userEmail : '--'}}</td>\r\n <td *ngIf=\"assignType ==='cluster'\">{{data.clusterName ? data.clusterName : '--'}}</td>\r\n </tbody>\r\n </table>\r\n <table *ngIf=\"userCoverage\" class=\"w-100 table bottom-border text-nowrap\"> \r\n <thead>\r\n <tr>\r\n <th class=\"text-align-left\">\r\n <div class=\"cursor-pointer\" (click)=\"sortData('userName')\">\r\n User Name\r\n <span\r\n *ngIf=\"sortColumn === 'userName' && sortBy !== 1 || sortColumn !== 'userName' \">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumn === 'userName' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#00A3FF\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n <th class=\"text-align-left\">\r\n <div class=\"cursor-pointer\" (click)=\"sortData('userEmail')\">\r\n User Email\r\n <span\r\n *ngIf=\"sortColumn === 'userEmail' && sortBy !== 1 || sortColumn !== 'userEmail' \">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumn === 'userEmail' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#00A3FF\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n <th *ngIf=\"assignType ==='team'\" class=\"text-align-left\">\r\n <div class=\"cursor-pointer\" (click)=\"sortData('teamName')\">\r\n Teams Name\r\n <span\r\n *ngIf=\"sortColumn === 'teamName' && sortBy !== 1 || sortColumn !== 'teamName' \">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumn === 'teamName' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#00A3FF\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let data of assignTableData;let i=index\">\r\n <td>{{data.userName}}</td>\r\n <td>{{data.userEmail ? data.userEmail : '--'}}</td>\r\n <td *ngIf=\"assignType ==='team'\">{{data.teamName ? data.teamName : '--'}}</td>\r\n </tbody>\r\n </table>\r\n </div>\r\n <lib-pagination [itemsPerPage]=\"itemsPerPage\" [currentPage]=\"currentPage\"\r\n [totalItems]=\"totalItems\" [paginationSizes]=\"paginationSizes\" [pageSize]=\"pageSize\"\r\n (pageChange)=\"onPageChange($event)\"\r\n (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container\r\n *ngIf=\"(assignTableApiState | async) === 'loading' || (assignTableApiState | async) === 'initial'\">\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-container>\r\n <div>\r\n <ng-container\r\n *ngIf=\"(assignTableApiState | async) === 'loaded' && !tableArray?.length && this.taskDetails?.assign && !['cluster','team'].includes(assignType)\">\r\n <div class=\"row mb-6\">\r\n <div class=\"col-lg-12 assignpadding mb-10 mt-10\">\r\n <div class=\"row\">\r\n <div class=\"hr w-100 border border-1 position-relative\">\r\n <div class=\"position-absolute template-dropdown orposition bg-white w-100px\">or</div>\r\n </div>\r\n <div class=\"uploadpadding mt-10\">\r\n <ul class=\"subtext list-unstyled d-flex flex-column align-items-center mx-4\">\r\n <li>Use the template to upload multiple <span *ngIf=\"storeCoverage\">stores</span> <span *ngIf=\"userCoverage\">users</span> at once.</li> \r\n <li> Download the template here - <span (click)=\"downloadTemplateV2()\" class=\"cursor-pointer\"><span class=\"me-3\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M5.83333 8.33333L10 12.5M10 12.5L14.1667 8.33333M10 12.5V2.5\" stroke=\"#009BF3\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span><span class=\"text-primary\">Download Template</span></span></li>\r\n <li> Add your data to the Template File</li>\r\n </ul>\r\n </div>\r\n <div class=\"w-100 border border-2 text-center border-dashed rounded-3 border-primary p-5\" (dragover)=\"onDragOver($event)\" \r\n (dragleave)=\"onDragLeave($event)\"\r\n (drop)=\"onDrop($event)\"\r\n (click)=\"file.click()\">\r\n <div class=\"\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"46\" height=\"46\" viewBox=\"0 0 46 46\" fill=\"none\">\r\n <rect x=\"3\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" fill=\"#F2F4F7\"/>\r\n <rect x=\"3\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" stroke=\"#F9FAFB\" stroke-width=\"6\"/>\r\n <g clip-path=\"url(#clip0_7979_5202)\">\r\n <path d=\"M26.3335 26.3332L23.0002 22.9999M23.0002 22.9999L19.6669 26.3332M23.0002 22.9999V30.4999M29.9919 28.3249C30.8047 27.8818 31.4467 27.1806 31.8168 26.3321C32.1868 25.4835 32.2637 24.5359 32.0354 23.6388C31.807 22.7417 31.2865 21.9462 30.5558 21.3778C29.8251 20.8094 28.9259 20.5005 28.0002 20.4999H26.9502C26.698 19.5243 26.2278 18.6185 25.5752 17.8507C24.9225 17.0829 24.1042 16.4731 23.182 16.0671C22.2597 15.661 21.2573 15.4694 20.2503 15.5065C19.2433 15.5436 18.2578 15.8085 17.3679 16.2813C16.4779 16.7541 15.7068 17.4225 15.1124 18.2362C14.518 19.05 14.1158 19.9879 13.936 20.9794C13.7563 21.9709 13.8036 22.9903 14.0746 23.961C14.3455 24.9316 14.8329 25.8281 15.5002 26.5832\" stroke=\"#475467\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_7979_5202\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" transform=\"translate(13 13)\"/>\r\n </clipPath>\r\n </defs>\r\n </svg></div>\r\n <div class=\"storetext cursor-pointer fw-bold\"><span class=\"text-primary text-decoration-underline\">Click To Upload</span> \r\n or drag and drop\r\n </div>\r\n <div class=\"headeralign fw-400\">the data added template file for processing.</div>\r\n <input style=\"visibility: hidden;\" type=\"file\" #file\r\n id=\"kt_account_team_size_select_1\" (change)=\"onFileUpload($event)\" />\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-container>\r\n <div class=\"col-lg-12\" *ngIf=\"(assignTableApiState | async) === 'loaded' && !tableArray?.length && this.taskDetails?.assign && ['cluster','team'].includes(assignType)\">\r\n <div class=\"card-body my-8 d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata1.svg\" alt=\"\">\r\n <div class=\"nodata-title\">No data found</div>\r\n <div class=\"nodata-sub\">There is no result for the {{assignType}}</div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n\r\n\r\n\r\n </div>\r\n\r\n\r\n </div>\r\n </div>\r\n </div>\r\n</div>\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 xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\" stroke=\"#00A3FF\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n </div> <span class=\"config-heading fw-semibold ms-5 w-auto\">Bulk Upload</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\">Step 1 - <a class=\"text-decoration-underline cursor-pointer\" (click)=\"downloadTemplateV2()\">Download the template here</a></div>\r\n <div class=\"storeAssign mt-3\" style=\"font-weight: 400\">Step2 - Add your data to the Template File with existing <span *ngIf=\"storeCoverage\">store</span> <span *ngIf=\"userCoverage\">user</span> data</div>\r\n <div class=\"storeAssign mt-3\" style=\"font-weight: 400\">Step3 - Upload it below for processing</div>\r\n\r\n <div class=\"fw-bold storeAssign mt-10\">**Note : On upload, all the existing data will be replaced</div>\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)=\"model.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)\" />\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=\"card-title mt-3\"><span class=\"config-heading fw-semibold w-auto\">Assign <span *nfIf=\"storeCoverage\">Stores</span> <span *ngIf=\"userCoverage\">Users</span></span></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 *nfIf=\"storeCoverage\">Stores</span> <span *ngIf=\"userCoverage\">Users</span></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\">{{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 <div *ngIf=\"!excelError\" class=\"table-header mt-5\" style=\"font-weight: 400;\">\r\n <div *ngIf=\"!showStore&&!showTeam&&!showCluster&&!showUser&&!showInactive\">You're about to assign {{getStoreCounts(excelData)}} <span *ngIf=\"storeCoverage\">stores</span><span *ngIf=\"userCoverage\">users</span> to the checklist. Are you sure want to proceed?</div>\r\n <div *ngIf=\"storeCoverage && showStore\" class=\"mt-3\">Store <span *ngFor=\"let store of validatedStore;let last = last\" class=\"fw-semibold config-heading\">{{store}}<span *ngIf=\"!last\">,</span></span> that I\u2019m looking for isn\u2019t available, <a routerLink=\"/manage/stores\" [queryParams]=\"{tyoe: 'stores'}\" class=\"text-decoration-underline cursor-pointer\" (click)=\"closeactivepopup()\">Onboard Stores</a></div>\r\n <div *ngIf=\"userCoverage && showUser\" class=\"mt-3\">User <span *ngFor=\"let store of validatedUser;let last = last\" class=\"fw-semibold config-heading\">{{store}}<span *ngIf=\"!last\">,</span></span> that I\u2019m looking for isn\u2019t available, <a class=\"text-decoration-underline cursor-pointer\" (click)=\"closeactivepopup();confirmUserpopup()\">Onboard Users</a></div>\r\n <div *ngIf=\"userCoverage && showTeam\" class=\"mt-3\">Team <span *ngFor=\"let store of validatedTeam;let last = last\" class=\"fw-semibold config-heading\">{{store}}<span *ngIf=\"!last\">,</span></span> that I\u2019m looking for isn\u2019t available, <a routerLink=\"/manage/users/client\" class=\"text-decoration-underline cursor-pointer\" (click)=\"closeactivepopup()\">Create Team</a></div>\r\n <div *ngIf=\"storeCoverage && showCluster\" class=\"mt-3\">user <span *ngFor=\"let store of validatedCluster;let last = last\" class=\"fw-semibold config-heading\">{{store}}<span *ngIf=\"!last\">,</span></span> that I\u2019m looking for isn\u2019t available, <a routerLink=\"/manage/stores\" class=\"text-decoration-underline cursor-pointer\" [queryParams]=\"{tyoe: 'cluster'}\" (click)=\"closeactivepopup()\">Create Cluster</a></div>\r\n <div *ngIf=\"storeCoverage && showUser\" class=\"mt-3\">User <span *ngFor=\"let store of validatedUser;let last = last\" class=\"fw-semibold config-heading\">{{store}}<span *ngIf=\"!last\">,</span></span> that I\u2019m looking for isn\u2019t available, <a class=\"text-decoration-underline cursor-pointer\" (click)=\"closeactivepopup();confirmUserpopup()\">Onboard Users</a></div>\r\n <div *ngIf=\"storeCoverage && showInactive\" class=\"mt-3\">Store <span *ngFor=\"let store of inactiveStores;let last = last\" class=\"fw-semibold config-heading\">{{store}}<span *ngIf=\"!last\">,</span></span> that I\u2019m looking for is inactive, <a routerLink=\"/manage/stores\" [queryParams]=\"{tyoe: 'stores'}\" class=\"text-decoration-underline cursor-pointer\" (click)=\"closeactivepopup()\">Onboard Stores</a></div>\r\n </div>\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' : ''\" 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&&!showStore&&!showCluster&&!showUser&&!showTeam&&!showInactive\" class=\"btn btn-md py-4 btn-default ms-3 btn-primary\" (click)=\"validateDetails()\">Proceed</button>\r\n <button *ngIf=\"excelError||showStore||showCluster||showUser||showTeam || showInactive\" class=\"btn py-3 btn-md btn-default ms-3 btn-danger\" (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>\r\n\r\n<ng-template #confirmUser 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 d-flex flex-column 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 xmlns=\"http://www.w3.org/2000/svg\" width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\"><rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#FEF0C7\"/><path d=\"M27.9998 24.0012V28.0012M27.9998 32.0012H28.0098M26.2898 18.8612L17.8198 33.0012C17.6451 33.3036 17.5527 33.6465 17.5518 33.9957C17.5508 34.3449 17.6413 34.6883 17.8142 34.9917C17.9871 35.2951 18.2365 35.5479 18.5375 35.725C18.8385 35.9021 19.1806 35.9973 19.5298 36.0012H36.4698C36.819 35.9973 37.1611 35.9021 37.4621 35.725C37.7631 35.5479 38.0124 35.2951 38.1854 34.9917C38.3583 34.6883 38.4488 34.3449 38.4478 33.9957C38.4468 33.6465 38.3544 33.3036 38.1798 33.0012L29.7098 18.8612C29.5315 18.5673 29.2805 18.3243 28.981 18.1557C28.6814 17.987 28.3435 17.8984 27.9998 17.8984C27.656 17.8984 27.3181 17.987 27.0186 18.1557C26.7191 18.3243 26.468 18.5673 26.2898 18.8612Z\" stroke=\"#DC6803\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#FFFAEB\" stroke-width=\"8\"/></svg>\r\n </div><br>\r\n <div class=\"config-heading fw-semibold w-auto\">New User found in uploaded file</div>\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\">This CSV contains a new User. Add new User in the User Management under Manage menu.</div>\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\" routerLink=\"/manage/users/client\" (click)=\"closeactivepopup()\">Skip New Entries</button> -->\r\n <button class=\"btn btn-md py-4 btn-default ms-3 btn-primary\" (click)=\"model.close('confirm')\">Invite Selected</button>\r\n </div>\r\n </div>\r\n</ng-template>", styles: [".c-card{padding:24px;background:#fff;border-radius:16px}.plain-input{border:none;outline:none;background:transparent;padding:0;margin:0;width:100%;overflow:hidden;color:var(--black, #101828);text-overflow:ellipsis;font-family:Inter;font-size:18px;font-style:normal;font-weight:500;line-height:28px}.plain-input:focus{border-radius:0!important;border:white!important;outline:none!important;box-shadow:none!important}.checklist-name{font-size:20px;font-weight:600;line-height:28px;text-align:left;color:#667085!important}.checklist-desc{font-size:14px;font-weight:400;line-height:18px;text-align:left}:host::ng-deep .date-picker .md-drppicker .btn{line-height:10px!important}:host::ng-deep .date-picker .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .date-picker .md-drppicker.drops-down-right.ltr.show-ranges.shown{top:65px!important}:host::ng-deep .date-picker .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;right:-475px!important;left:unset!important;height:400px!important}:host::ng-deep .date-picker .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 .date-picker .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 .date-picker .md-drppicker td.active,:host::ng-deep .date-picker .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 .date-picker .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .date-picker .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .date-picker .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 .date-picker table th,:host::ng-deep .date-picker table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .date-picker .md-drppicker td.available.prev,:host::ng-deep .date-picker .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 .date-picker .md-drppicker td.available.next,:host::ng-deep .date-picker .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 .date-picker 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 .date-picker .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 .date-picker .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .date-picker .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}.assignpadding{padding:0 40px}.uploadpadding{padding:0 20% 9px}.orposition{top:0;left:50%;transform:translate(-50%,-50%);text-align:center}.storetext{color:var(--Gray-500, #667085);font-size:14px;font-weight:500;line-height:20px}.storeAssign{color:var(--Gray-700, #344054);font-family:Inter;font-size:14px;font-style:normal;font-weight:500;line-height:20px}.storeAssign a:hover{text-decoration:underline!important}.border-primary{border:1px dashed var(--Primary-500, #33B5FF)!important;background:var(--Primary-25, #F6FCFF)!important}.template-dropdown{background:var(--Gray-100, #F2F4F7);color:var(--Gray-700, #344054);font-size:14px;font-weight:500;line-height:20px}.uploadtext{color:var(--gray-700, #344054);font-family:Inter;font-size:16px;font-style:normal;font-weight:600;line-height:24px;text-transform:capitalize}.subtext{color:var(--gray-500, #667085);font-family:Inter;font-size:14px;font-weight:400;line-height:20px;align-items:center;gap:8px;align-self:stretch}.selectstore{color:var(--primary-700, #009BF3);font-family:Inter;font-size:14px;font-style:normal;font-weight:600;line-height:20px;text-decoration-line:underline;text-transform:capitalize}.sub{color:var(--gray-700, #101828);font-family:Inter;font-size:16px;font-style:normal;font-weight:500;line-height:24px}.subopen{color:var(--black, #101828);font-family:Inter;font-size:16px;font-style:normal;font-weight:500;line-height:24px}.headeralign{color:var(--gray-500, #667085);font-family:Inter;font-size:12px;font-style:normal;font-weight:500;line-height:18px}.selected-radio{width:1.5rem!important;height:1.5rem!important}.subtitle{font-family:Inter;font-size:14px;font-weight:400;line-height:20px;letter-spacing:0em;text-align:left;color:#667085}.form-control.form-control-solid{display:flex;padding:11px 14px;align-items:center;gap:8px;align-self:stretch;border-radius:8px;border:1px solid var(--gray-500, #D0D5DD);background:var(--white, #FFF);box-shadow:0 1px 2px #1018280d}.outer-container{position:relative}.outer-container .form-control{padding-top:0;padding-bottom:0}.outer-container .input-container{border:1px solid black;height:100%;width:100%;display:flex;flex-wrap:wrap;border:1px solid #D0D5DD}.outer-container .input-container input{all:unset;flex:1;min-width:50px}.outer-container .input-container .chip{margin:10px 0 10px 10px;padding:3px 10px;border-radius:16px;background:var(--Gray-100, #F2F4F7);color:var(--Gray-700, #344054);font-family:Inter;font-size:14px;font-weight:500;line-height:20px}.outer-container .input-container .chip .initials{color:var(--Primary-600, #00A3FF);font-size:12px;font-weight:500;line-height:18px}.outer-container .input-container .chip:nth-child(1){margin-left:0}.toggle-card{padding:16px;display:flex;align-items:center;border-radius:8px;border:1px solid #EAECF0;background:#fff}.toggle-card .header{color:#344054;font-size:16px;font-weight:500;line-height:24px}.toggle-card .desc{color:var(--Gray-500, #667085);font-size:14px;font-weight:400;line-height:20px}.toggle-card.selected{border:1px solid #6BCAFF}.toggle-card.selected .header{color:#008edf}.toggle-card.selected .desc{color:#00a3ff}.sub-txt{color:#667085;font-size:14px;font-weight:400;line-height:20px;gap:8px}.cstm-blu-btn{padding:8px 14px;border-radius:8px;border:1px solid #EAF8FF;background:#eaf8ff;box-shadow:0 1px 2px #1018280d;color:#009bf3;font-size:14px;font-weight:600;line-height:20px;cursor:pointer;display:flex;align-items:center}.schedule-text{color:#344054;font-size:16px;font-weight:500;line-height:24px}input[type=checkbox].c-checkbox{width:16px!important;height:16px!important;margin:5px;border-radius:4px!important;-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;appearance:none;outline:1px solid var(--gray-600, #D0D5DD)!important;box-shadow:none;font-size:.5em;text-align:center;line-height:1em;background:#fff}input[type=checkbox].c-checkbox:checked{outline:1px solid var(--primary-600, #00A3FF)!important;background-color:var(--primary-50, #EAF8FF)}input[type=checkbox].c-checkbox:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.5em;padding-left:3px;padding-top:10px;padding-right:0}.reminder-header{color:#101828;font-size:20px;font-weight:600;line-height:30px}.reminder-description{color:#344054;font-size:14px;font-weight:500;line-height:20px}.reminder-sub{color:#101828;font-size:16px;font-weight:500;line-height:24px}.table-header{color:var(--Gray-800, #1D2939);font-size:16px;font-weight:600;line-height:24px}.text-error{color:var(--Error-700, #B42318)!important;font-size:14px;font-weight:500;line-height:20px}.excel-error{color:var(--Error-600, #D92D20);font-size:14px;font-weight:500;line-height:20px}.error-heading{color:var(--Error-600, #D92D20);font-size:20px;font-weight:500;line-height:30px}.border-error{border:1px solid var(--Error-300, #FDA29B)!important;background:var(--Error-25, #FFFBFA)!important}.popup-card{border-radius:6px;border:1px solid var(--Gray-300, #D0D5DD);background:#fff;box-shadow:0 1px 3px #1018281a,0 1px 2px #1018280f}.nav{display:flex;align-items:center;gap:16px;flex:1 0 0;align-self:stretch;--bs-nav-link-color: none}.nav-item .nav-link{color:var(--Gray-500, #667085);font-size:16px;font-weight:500}.nav-item .nav-link:hover{border-bottom:none!important}.nav-item .nav-link.active{border-radius:10px!important;border-bottom:none!important}.nav-item .bg-light-primary{background:var(--Primary-50, #EAF8FF)!important}\n"], dependencies: [{ kind: "directive", type: i7.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i5.PaginationComponent, selector: "lib-pagination", inputs: ["collection", "itemsPerPage", "currentPage", "totalItems", "directionLinks", "pageSize", "paginationSizes"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "directive", type: i6.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i6.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i6.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i6.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i6.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i6.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i8.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: i9.ChipDropdownComponent, selector: "lib-chip-dropdown", inputs: ["data", "selectedData", "placeholder"], outputs: ["selectedList"] }, { kind: "component", type: i10.MultiChipDropdownComponent, selector: "lib-multi-chip-dropdown", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label", "badgeValue", "searchKey", "assignType"], outputs: ["selected", "removed"] }, { kind: "pipe", type: i7.AsyncPipe, name: "async" }, { kind: "pipe", type: i7.TitleCasePipe, name: "titlecase" }] });
1512
1512
  }
1513
1513
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TaskConfigureComponent, decorators: [{
1514
1514
  type: Component,