tango-app-ui-manage-stores 3.0.62-dev → 3.0.63-dev

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 (22) hide show
  1. package/esm2022/lib/components/add-stores/add-stores.component.mjs +3 -3
  2. package/esm2022/lib/components/add-stores-form/add-stores-form.component.mjs +3 -3
  3. package/esm2022/lib/components/add-stores-form/store-popup/store-popup.component.mjs +3 -3
  4. package/esm2022/lib/components/create-group/create-group.component.mjs +3 -3
  5. package/esm2022/lib/components/group-delete-popup/group-delete-popup.component.mjs +3 -3
  6. package/esm2022/lib/components/group-details/group-details.component.mjs +3 -3
  7. package/esm2022/lib/components/new-create-group/new-create-group.component.mjs +3 -3
  8. package/esm2022/lib/components/tango-manage-groups/tango-manage-groups.component.mjs +5 -5
  9. package/esm2022/lib/components/tango-manage-stores/store-alert-popup/store-alert-popup.component.mjs +3 -3
  10. package/esm2022/lib/components/tango-manage-stores/tango-manage-stores.component.mjs +3 -3
  11. package/esm2022/lib/route-wrappers/edge-wrapper.module.mjs +4 -4
  12. package/esm2022/lib/services/excel.service.mjs +3 -3
  13. package/esm2022/lib/services/group.service.mjs +3 -3
  14. package/esm2022/lib/services/stores.service.mjs +3 -3
  15. package/esm2022/lib/tango-manage-stores-routing.module.mjs +4 -4
  16. package/esm2022/lib/tango-manage-stores.module.mjs +4 -4
  17. package/esm2022/lib/utils/filters/filters.component.mjs +3 -3
  18. package/fesm2022/{tango-app-ui-manage-stores-edge-wrapper.module-fMqNK7aH.mjs → tango-app-ui-manage-stores-edge-wrapper.module-CFDk0tvS.mjs} +5 -5
  19. package/fesm2022/{tango-app-ui-manage-stores-edge-wrapper.module-fMqNK7aH.mjs.map → tango-app-ui-manage-stores-edge-wrapper.module-CFDk0tvS.mjs.map} +1 -1
  20. package/fesm2022/tango-app-ui-manage-stores.mjs +52 -52
  21. package/fesm2022/tango-app-ui-manage-stores.mjs.map +1 -1
  22. package/package.json +1 -1
package/esm2022/lib/components/create-group/create-group.component.mjs CHANGED
@@ -270,10 +270,10 @@ export class CreateGroupComponent {
270
270
  });
271
271
  this.selectedText = `${this.selectedValuesArray[0].length} Stores Selected`;
272
272
  }
273
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: CreateGroupComponent, deps: [{ token: i1.NgbActiveModal }, { token: i0.ChangeDetectorRef }, { token: i2.FormBuilder }, { token: i3.GroupService }, { token: i4.ToastService }, { token: i5.GlobalStateService }], target: i0.ɵɵFactoryTarget.Component });
274
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: CreateGroupComponent, selector: "lib-create-group", inputs: { type: "type", editGroup: "editGroup" }, host: { listeners: { "document:click": "onClick($event)" } }, ngImport: i0, template: "<div class=\"card py-0\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"my-5\">\r\n <div class=\"symbol symbol-75px symbol-circle\">\r\n <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M20.5 23.6816C18.8425 23.6816 17.5 22.2133 17.5 20.4004C17.5 18.5875 18.8425 17.1191 20.5 17.1191C22.1575 17.1191 23.5 18.5875 23.5 20.4004C23.5 22.2133 22.1575 23.6816 20.5 23.6816ZM35.6483 23.6816C33.9908 23.6816 32.6483 22.2133 32.6483 20.4004C32.6483 18.5875 33.9908 17.1191 35.6483 17.1191C37.3058 17.1191 38.6483 18.5875 38.6483 20.4004C38.6483 22.2133 37.3058 23.6816 35.6483 23.6816ZM31.509 26.3066C31.509 28.4805 29.8965 30.2441 27.909 30.2441C25.9215 30.2441 24.309 28.4805 24.309 26.3066C24.309 24.1328 25.9215 22.3691 27.909 22.3691C29.8965 22.3691 31.509 24.1328 31.509 26.3066Z\"\r\n fill=\"#00A3FF\" />\r\n <path\r\n d=\"M20.0013 25.7559C17.7925 25.7559 16 27.7164 16 30.1322C16 30.6121 16.36 31.0059 16.7988 31.0059H24.8013H24.8275C23.8338 30.042 23.2038 28.6352 23.2038 27.0684C23.2038 26.7566 23.2263 26.449 23.275 26.1537C22.765 25.8994 22.1988 25.7559 21.6025 25.7559H20.0013Z\"\r\n fill=\"#00A3FF\" />\r\n <path\r\n d=\"M31.1725 31.0059H31.1987H39.2012C39.64 31.0059 40 30.6162 40 30.1322C40 27.7164 38.2075 25.7559 35.9987 25.7559H34.3975C33.8012 25.7559 33.235 25.8953 32.725 26.1537C32.77 26.4531 32.7963 26.7566 32.7963 27.0684C32.7963 28.6352 32.17 30.042 31.1725 31.0059Z\"\r\n fill=\"#00A3FF\" />\r\n <path\r\n d=\"M25.7988 32.3183C23.0388 32.3183 20.8 34.767 20.8 37.7857C20.8 38.3928 21.25 38.8809 21.8013 38.8809H34.1987C34.7537 38.8809 35.2 38.3887 35.2 37.7857C35.2 34.767 32.9613 32.3183 30.2013 32.3183H25.7988Z\"\r\n fill=\"#00A3FF\" />\r\n </svg>\r\n\r\n </div>\r\n </div>\r\n <div class=\"row w-100\">\r\n <div *ngIf=\"operationType==='add'\" class=\"col-md-12\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Add\r\n Group</a>\r\n <div class=\"sub-title\">Please add your group details</div>\r\n </div>\r\n <div *ngIf=\"operationType==='edit'\" class=\"col-md-12\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Edit Group</a>\r\n <div class=\"sub-title\">Edit your group details</div>\r\n </div>\r\n <div *ngIf=\"operationType==='view'\" class=\"col-md-9\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">View Group</a>\r\n <div class=\"sub-title\">View your group details</div>\r\n </div>\r\n @if ((gs.userAccess | async)?.manage_stores_isEdit) {\r\n <div *ngIf=\"operationType==='view'\" class=\"col-md-3 text-end px-0\" (click)=\"editgroup()\">\r\n <button class=\"btn btn-outline\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3833_85908)\">\r\n <path\r\n d=\"M9.16602 3.3332H3.33268C2.89065 3.3332 2.46673 3.50879 2.15417 3.82135C1.84161 4.13391 1.66602 4.55784 1.66602 4.99986V16.6665C1.66602 17.1086 1.84161 17.5325 2.15417 17.845C2.46673 18.1576 2.89065 18.3332 3.33268 18.3332H14.9993C15.4414 18.3332 15.8653 18.1576 16.1779 17.845C16.4904 17.5325 16.666 17.1086 16.666 16.6665V10.8332M15.416 2.0832C15.7475 1.75168 16.1972 1.56543 16.666 1.56543C17.1349 1.56543 17.5845 1.75168 17.916 2.0832C18.2475 2.41472 18.4338 2.86436 18.4338 3.3332C18.4338 3.80204 18.2475 4.25168 17.916 4.5832L9.99935 12.4999L6.66602 13.3332L7.49935 9.99986L15.416 2.0832Z\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3833_85908\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></button>\r\n </div>\r\n }\r\n </div>\r\n <form [formGroup]=\"groupForm\">\r\n <div class=\"row mt-8\">\r\n <div class=\"col-md-12 col-lg-12 mb-5\">\r\n <label for=\"groupName\" class=\"form-label\">Group Name</label>\r\n <input autocomplete=\"off\" type=\"text\" class=\"form-control\" id=\"groupName\"\r\n formControlName=\"groupName\" \r\n [ngClass]=\"{ 'is-invalid': groupForm.get('groupName')?.touched && groupForm.get('groupName')?.hasError('required') }\">\r\n @if (groupForm.get('groupName')?.touched && groupForm.get('groupName')?.hasError('required')) {\r\n <small>Group Name is required</small>\r\n }\r\n </div>\r\n <div class=\"my-5 dropdown1 cursor-pointer h-700\" *ngFor=\"let item of dataObject; let i = index\">\r\n <label for=\"storeList\" class=\"form-label\">Select Stores</label>\r\n <input type=\"text\" class=\"form-control disable\" id=\"storeName\" [ngModel]=\"selectedText\" [ngModelOptions]=\"{standalone: true}\"\r\n placeholder=\"Select Stores\" (click)=\"Dropdown('Stores',i,$event)\" readonly>\r\n <div *ngIf=\"item.isOpen\" class=\"dropdown-content position-absolute\">\r\n <div class=\"form-check d-flex align-items-center pt-3 px-5\">\r\n <input class=\"form-check-input\" type=\"checkbox\" value=\"Select All\" id=\"selectall{{i}}\"\r\n [checked]=\"selectedValuesArray[i]?.length === item.Stores.length\"\r\n (change)=\"toggleCheckbox($event,'Select All', i,0)\">\r\n <label class=\"form-check-label px-3\" for=\"selectall{{i}}\">\r\n Select All\r\n </label>\r\n </div>\r\n <div class=\"border border-gray mt-3\"></div>\r\n <div class=\"mt-3 d-flex align-items-center mx-3\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3 mt-2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\">\r\n <path d=\"M14 14.5L11.1 11.6M12.6667 7.83333C12.6667 10.7789 10.2789 13.1667 7.33333 13.1667C4.38781 13.1667 2 10.7789 2 7.83333C2 4.88781 4.38781 2.5 7.33333 2.5C10.2789 2.5 12.6667 4.88781 12.6667 7.83333Z\" stroke=\"#667085\" stroke-width=\"1.3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n </span>\r\n <input #searchInput type=\"text\" id=\"searchValue\" name=\"searchValue\" class=\"form-control searchinput ps-14 py-2 me-2 mt-2\"\r\n placeholder=\"Search\" autocomplete=\"off\" [(ngModel)]=\"searchValue\" [ngModelOptions]=\"{standalone: true}\"/>\r\n </div>\r\n <div *ngFor=\"let store of searchData(item.Stores,i);let j=index;\"\r\n class=\"form-check d-flex align-items-center py-3 px-5\">\r\n <input class=\"form-check-input cursor-pointer\" type=\"checkbox\" [value]=\"store?.storeName\"\r\n id=\"option{{store?.storeName}}\" [checked]=\"store?.checked\" [disabled]=\"operationType==='view'\"\r\n (change)=\"toggleCheckbox($event,store,i,j)\">\r\n <label class=\"form-check-label px-3 cursor-pointer\" for=\"option{{store?.storeName}}\">\r\n {{ store?.storeName }}\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-md-12 col-lg-12 mb-5\">\r\n <label for=\"description\" class=\"form-label\">Description</label>\r\n <textarea rows=\"5\" class=\"form-control\" id=\"description\" formControlName=\"description\"></textarea>\r\n </div>\r\n </div>\r\n <div *ngIf=\"operationType !== 'view'\" role=\"group\" class=\"d-flex mt-3 mb-15\">\r\n <button type=\"button\" class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button type=\"submit\" [disabled]=\"!groupForm.valid\" id=\"alert-toast\" class=\"btn btn-primary w-100 ms-3\"\r\n (click)=\"groupSubmit()\">Submit</button>\r\n </div>\r\n </form>\r\n </div>\r\n</div>", styles: [".title{color:var(--Gray-900, #101828)!important;font-size:18px!important;font-weight:600;line-height:28px}.sub-title{color:var(--Gray-500, #667085)!important;font-size:14px!important;font-weight:400!important;line-height:20px}::ng-deep .modal-content{border-radius:12px!important}.btn-outline{padding:12px!important;border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important}.dropdown1 .dropdown-title{color:var(--Gray-900, #101828);font-size:16px;font-weight:600;line-height:24px}.dropdown1 .dropdown{position:relative;display:inline-block}.dropdown1 .dropdown span{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}.dropdown1 .dropdown-content{z-index:1;padding:0;min-height:auto;max-height:285px;overflow:auto;border-radius:12px;background:var(--White, #FFF);box-shadow:0 8px 8px -4px #10182808,0 20px 24px -4px #10182814;width:89%}.dropdown1 .dropdown-content label{color:var(--Gray-700, #344054);font-size:14px;font-weight:500;line-height:20px}.dropdown1 .dropdown-content a{color:#000;padding:12px 16px;text-decoration:none;display:block}.dropdown1 .dropdown button{padding:10px;font-size:16px;cursor:pointer}.dropdown1 input[type=checkbox]{width:16px!important;height:16px!important;margin:-3px 5px;border-radius:4px!important;-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;appearance:none;outline:1px solid var(--gray-300, #D0D5DD);box-shadow:none;font-size:.8em;text-align:center;line-height:1em;background:#fff}.dropdown1 input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.dropdown1 input[type=checkbox]:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.2em;padding-left:0;padding-top:9px;padding-right:4px}.is-invalid{border-radius:8px!important;border:1px solid var(--Error-300, #FDA29B)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;padding-right:calc(1.5em + .75rem)!important;background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzIyMDFfMjA5NTApIj4KPHBhdGggZD0iTTcuOTk5NjcgNS4zMzM5OFY4LjAwMDY1TTcuOTk5NjcgMTAuNjY3M0g4LjAwNjM0TTE0LjY2NjMgOC4wMDA2NUMxNC42NjYzIDExLjY4MjYgMTEuNjgxNiAxNC42NjczIDcuOTk5NjcgMTQuNjY3M0M0LjMxNzc4IDE0LjY2NzMgMS4zMzMwMSAxMS42ODI2IDEuMzMzMDEgOC4wMDA2NUMxLjMzMzAxIDQuMzE4NzUgNC4zMTc3OCAxLjMzMzk4IDcuOTk5NjcgMS4zMzM5OEMxMS42ODE2IDEuMzMzOTggMTQuNjY2MyA0LjMxODc1IDE0LjY2NjMgOC4wMDA2NVoiIHN0cm9rZT0iI0YwNDQzOCIgc3Ryb2tlLXdpZHRoPSIxLjMzMzMzIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9nPgo8ZGVmcz4KPGNsaXBQYXRoIGlkPSJjbGlwMF8yMjAxXzIwOTUwIj4KPHJlY3Qgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2IiBmaWxsPSJ3aGl0ZSIvPgo8L2NsaXBQYXRoPgo8L2RlZnM+Cjwvc3ZnPgo=)!important;background-repeat:no-repeat!important;background-position:right calc(.375em + .1875rem) center!important;background-size:calc(.75em + .375rem) calc(.75em + .375rem)!important}small{color:var(--Error-500, #F04438)!important;font-size:13px!important;font-weight:400!important;line-height:20px}\n"], dependencies: [{ kind: "directive", type: i6.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }] });
273
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CreateGroupComponent, deps: [{ token: i1.NgbActiveModal }, { token: i0.ChangeDetectorRef }, { token: i2.FormBuilder }, { token: i3.GroupService }, { token: i4.ToastService }, { token: i5.GlobalStateService }], target: i0.ɵɵFactoryTarget.Component });
274
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: CreateGroupComponent, selector: "lib-create-group", inputs: { type: "type", editGroup: "editGroup" }, host: { listeners: { "document:click": "onClick($event)" } }, ngImport: i0, template: "<div class=\"card py-0\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"my-5\">\r\n <div class=\"symbol symbol-75px symbol-circle\">\r\n <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M20.5 23.6816C18.8425 23.6816 17.5 22.2133 17.5 20.4004C17.5 18.5875 18.8425 17.1191 20.5 17.1191C22.1575 17.1191 23.5 18.5875 23.5 20.4004C23.5 22.2133 22.1575 23.6816 20.5 23.6816ZM35.6483 23.6816C33.9908 23.6816 32.6483 22.2133 32.6483 20.4004C32.6483 18.5875 33.9908 17.1191 35.6483 17.1191C37.3058 17.1191 38.6483 18.5875 38.6483 20.4004C38.6483 22.2133 37.3058 23.6816 35.6483 23.6816ZM31.509 26.3066C31.509 28.4805 29.8965 30.2441 27.909 30.2441C25.9215 30.2441 24.309 28.4805 24.309 26.3066C24.309 24.1328 25.9215 22.3691 27.909 22.3691C29.8965 22.3691 31.509 24.1328 31.509 26.3066Z\"\r\n fill=\"#00A3FF\" />\r\n <path\r\n d=\"M20.0013 25.7559C17.7925 25.7559 16 27.7164 16 30.1322C16 30.6121 16.36 31.0059 16.7988 31.0059H24.8013H24.8275C23.8338 30.042 23.2038 28.6352 23.2038 27.0684C23.2038 26.7566 23.2263 26.449 23.275 26.1537C22.765 25.8994 22.1988 25.7559 21.6025 25.7559H20.0013Z\"\r\n fill=\"#00A3FF\" />\r\n <path\r\n d=\"M31.1725 31.0059H31.1987H39.2012C39.64 31.0059 40 30.6162 40 30.1322C40 27.7164 38.2075 25.7559 35.9987 25.7559H34.3975C33.8012 25.7559 33.235 25.8953 32.725 26.1537C32.77 26.4531 32.7963 26.7566 32.7963 27.0684C32.7963 28.6352 32.17 30.042 31.1725 31.0059Z\"\r\n fill=\"#00A3FF\" />\r\n <path\r\n d=\"M25.7988 32.3183C23.0388 32.3183 20.8 34.767 20.8 37.7857C20.8 38.3928 21.25 38.8809 21.8013 38.8809H34.1987C34.7537 38.8809 35.2 38.3887 35.2 37.7857C35.2 34.767 32.9613 32.3183 30.2013 32.3183H25.7988Z\"\r\n fill=\"#00A3FF\" />\r\n </svg>\r\n\r\n </div>\r\n </div>\r\n <div class=\"row w-100\">\r\n <div *ngIf=\"operationType==='add'\" class=\"col-md-12\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Add\r\n Group</a>\r\n <div class=\"sub-title\">Please add your group details</div>\r\n </div>\r\n <div *ngIf=\"operationType==='edit'\" class=\"col-md-12\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Edit Group</a>\r\n <div class=\"sub-title\">Edit your group details</div>\r\n </div>\r\n <div *ngIf=\"operationType==='view'\" class=\"col-md-9\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">View Group</a>\r\n <div class=\"sub-title\">View your group details</div>\r\n </div>\r\n @if ((gs.userAccess | async)?.manage_stores_isEdit) {\r\n <div *ngIf=\"operationType==='view'\" class=\"col-md-3 text-end px-0\" (click)=\"editgroup()\">\r\n <button class=\"btn btn-outline\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3833_85908)\">\r\n <path\r\n d=\"M9.16602 3.3332H3.33268C2.89065 3.3332 2.46673 3.50879 2.15417 3.82135C1.84161 4.13391 1.66602 4.55784 1.66602 4.99986V16.6665C1.66602 17.1086 1.84161 17.5325 2.15417 17.845C2.46673 18.1576 2.89065 18.3332 3.33268 18.3332H14.9993C15.4414 18.3332 15.8653 18.1576 16.1779 17.845C16.4904 17.5325 16.666 17.1086 16.666 16.6665V10.8332M15.416 2.0832C15.7475 1.75168 16.1972 1.56543 16.666 1.56543C17.1349 1.56543 17.5845 1.75168 17.916 2.0832C18.2475 2.41472 18.4338 2.86436 18.4338 3.3332C18.4338 3.80204 18.2475 4.25168 17.916 4.5832L9.99935 12.4999L6.66602 13.3332L7.49935 9.99986L15.416 2.0832Z\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3833_85908\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></button>\r\n </div>\r\n }\r\n </div>\r\n <form [formGroup]=\"groupForm\">\r\n <div class=\"row mt-8\">\r\n <div class=\"col-md-12 col-lg-12 mb-5\">\r\n <label for=\"groupName\" class=\"form-label\">Group Name</label>\r\n <input autocomplete=\"off\" type=\"text\" class=\"form-control\" id=\"groupName\"\r\n formControlName=\"groupName\" \r\n [ngClass]=\"{ 'is-invalid': groupForm.get('groupName')?.touched && groupForm.get('groupName')?.hasError('required') }\">\r\n @if (groupForm.get('groupName')?.touched && groupForm.get('groupName')?.hasError('required')) {\r\n <small>Group Name is required</small>\r\n }\r\n </div>\r\n <div class=\"my-5 dropdown1 cursor-pointer h-700\" *ngFor=\"let item of dataObject; let i = index\">\r\n <label for=\"storeList\" class=\"form-label\">Select Stores</label>\r\n <input type=\"text\" class=\"form-control disable\" id=\"storeName\" [ngModel]=\"selectedText\" [ngModelOptions]=\"{standalone: true}\"\r\n placeholder=\"Select Stores\" (click)=\"Dropdown('Stores',i,$event)\" readonly>\r\n <div *ngIf=\"item.isOpen\" class=\"dropdown-content position-absolute\">\r\n <div class=\"form-check d-flex align-items-center pt-3 px-5\">\r\n <input class=\"form-check-input\" type=\"checkbox\" value=\"Select All\" id=\"selectall{{i}}\"\r\n [checked]=\"selectedValuesArray[i]?.length === item.Stores.length\"\r\n (change)=\"toggleCheckbox($event,'Select All', i,0)\">\r\n <label class=\"form-check-label px-3\" for=\"selectall{{i}}\">\r\n Select All\r\n </label>\r\n </div>\r\n <div class=\"border border-gray mt-3\"></div>\r\n <div class=\"mt-3 d-flex align-items-center mx-3\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3 mt-2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\">\r\n <path d=\"M14 14.5L11.1 11.6M12.6667 7.83333C12.6667 10.7789 10.2789 13.1667 7.33333 13.1667C4.38781 13.1667 2 10.7789 2 7.83333C2 4.88781 4.38781 2.5 7.33333 2.5C10.2789 2.5 12.6667 4.88781 12.6667 7.83333Z\" stroke=\"#667085\" stroke-width=\"1.3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n </span>\r\n <input #searchInput type=\"text\" id=\"searchValue\" name=\"searchValue\" class=\"form-control searchinput ps-14 py-2 me-2 mt-2\"\r\n placeholder=\"Search\" autocomplete=\"off\" [(ngModel)]=\"searchValue\" [ngModelOptions]=\"{standalone: true}\"/>\r\n </div>\r\n <div *ngFor=\"let store of searchData(item.Stores,i);let j=index;\"\r\n class=\"form-check d-flex align-items-center py-3 px-5\">\r\n <input class=\"form-check-input cursor-pointer\" type=\"checkbox\" [value]=\"store?.storeName\"\r\n id=\"option{{store?.storeName}}\" [checked]=\"store?.checked\" [disabled]=\"operationType==='view'\"\r\n (change)=\"toggleCheckbox($event,store,i,j)\">\r\n <label class=\"form-check-label px-3 cursor-pointer\" for=\"option{{store?.storeName}}\">\r\n {{ store?.storeName }}\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-md-12 col-lg-12 mb-5\">\r\n <label for=\"description\" class=\"form-label\">Description</label>\r\n <textarea rows=\"5\" class=\"form-control\" id=\"description\" formControlName=\"description\"></textarea>\r\n </div>\r\n </div>\r\n <div *ngIf=\"operationType !== 'view'\" role=\"group\" class=\"d-flex mt-3 mb-15\">\r\n <button type=\"button\" class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button type=\"submit\" [disabled]=\"!groupForm.valid\" id=\"alert-toast\" class=\"btn btn-primary w-100 ms-3\"\r\n (click)=\"groupSubmit()\">Submit</button>\r\n </div>\r\n </form>\r\n </div>\r\n</div>", styles: [".title{color:var(--Gray-900, #101828)!important;font-size:18px!important;font-weight:600;line-height:28px}.sub-title{color:var(--Gray-500, #667085)!important;font-size:14px!important;font-weight:400!important;line-height:20px}::ng-deep .modal-content{border-radius:12px!important}.btn-outline{padding:12px!important;border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important}.dropdown1 .dropdown-title{color:var(--Gray-900, #101828);font-size:16px;font-weight:600;line-height:24px}.dropdown1 .dropdown{position:relative;display:inline-block}.dropdown1 .dropdown span{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}.dropdown1 .dropdown-content{z-index:1;padding:0;min-height:auto;max-height:285px;overflow:auto;border-radius:12px;background:var(--White, #FFF);box-shadow:0 8px 8px -4px #10182808,0 20px 24px -4px #10182814;width:89%}.dropdown1 .dropdown-content label{color:var(--Gray-700, #344054);font-size:14px;font-weight:500;line-height:20px}.dropdown1 .dropdown-content a{color:#000;padding:12px 16px;text-decoration:none;display:block}.dropdown1 .dropdown button{padding:10px;font-size:16px;cursor:pointer}.dropdown1 input[type=checkbox]{width:16px!important;height:16px!important;margin:-3px 5px;border-radius:4px!important;-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;appearance:none;outline:1px solid var(--gray-300, #D0D5DD);box-shadow:none;font-size:.8em;text-align:center;line-height:1em;background:#fff}.dropdown1 input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.dropdown1 input[type=checkbox]:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.2em;padding-left:0;padding-top:9px;padding-right:4px}.is-invalid{border-radius:8px!important;border:1px solid var(--Error-300, #FDA29B)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;padding-right:calc(1.5em + .75rem)!important;background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzIyMDFfMjA5NTApIj4KPHBhdGggZD0iTTcuOTk5NjcgNS4zMzM5OFY4LjAwMDY1TTcuOTk5NjcgMTAuNjY3M0g4LjAwNjM0TTE0LjY2NjMgOC4wMDA2NUMxNC42NjYzIDExLjY4MjYgMTEuNjgxNiAxNC42NjczIDcuOTk5NjcgMTQuNjY3M0M0LjMxNzc4IDE0LjY2NzMgMS4zMzMwMSAxMS42ODI2IDEuMzMzMDEgOC4wMDA2NUMxLjMzMzAxIDQuMzE4NzUgNC4zMTc3OCAxLjMzMzk4IDcuOTk5NjcgMS4zMzM5OEMxMS42ODE2IDEuMzMzOTggMTQuNjY2MyA0LjMxODc1IDE0LjY2NjMgOC4wMDA2NVoiIHN0cm9rZT0iI0YwNDQzOCIgc3Ryb2tlLXdpZHRoPSIxLjMzMzMzIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9nPgo8ZGVmcz4KPGNsaXBQYXRoIGlkPSJjbGlwMF8yMjAxXzIwOTUwIj4KPHJlY3Qgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2IiBmaWxsPSJ3aGl0ZSIvPgo8L2NsaXBQYXRoPgo8L2RlZnM+Cjwvc3ZnPgo=)!important;background-repeat:no-repeat!important;background-position:right calc(.375em + .1875rem) center!important;background-size:calc(.75em + .375rem) calc(.75em + .375rem)!important}small{color:var(--Error-500, #F04438)!important;font-size:13px!important;font-weight:400!important;line-height:20px}\n"], dependencies: [{ kind: "directive", type: i6.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }] });
275
275
  }
276
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: CreateGroupComponent, decorators: [{
276
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CreateGroupComponent, decorators: [{
277
277
  type: Component,
278
278
  args: [{ selector: "lib-create-group", template: "<div class=\"card py-0\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"my-5\">\r\n <div class=\"symbol symbol-75px symbol-circle\">\r\n <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M20.5 23.6816C18.8425 23.6816 17.5 22.2133 17.5 20.4004C17.5 18.5875 18.8425 17.1191 20.5 17.1191C22.1575 17.1191 23.5 18.5875 23.5 20.4004C23.5 22.2133 22.1575 23.6816 20.5 23.6816ZM35.6483 23.6816C33.9908 23.6816 32.6483 22.2133 32.6483 20.4004C32.6483 18.5875 33.9908 17.1191 35.6483 17.1191C37.3058 17.1191 38.6483 18.5875 38.6483 20.4004C38.6483 22.2133 37.3058 23.6816 35.6483 23.6816ZM31.509 26.3066C31.509 28.4805 29.8965 30.2441 27.909 30.2441C25.9215 30.2441 24.309 28.4805 24.309 26.3066C24.309 24.1328 25.9215 22.3691 27.909 22.3691C29.8965 22.3691 31.509 24.1328 31.509 26.3066Z\"\r\n fill=\"#00A3FF\" />\r\n <path\r\n d=\"M20.0013 25.7559C17.7925 25.7559 16 27.7164 16 30.1322C16 30.6121 16.36 31.0059 16.7988 31.0059H24.8013H24.8275C23.8338 30.042 23.2038 28.6352 23.2038 27.0684C23.2038 26.7566 23.2263 26.449 23.275 26.1537C22.765 25.8994 22.1988 25.7559 21.6025 25.7559H20.0013Z\"\r\n fill=\"#00A3FF\" />\r\n <path\r\n d=\"M31.1725 31.0059H31.1987H39.2012C39.64 31.0059 40 30.6162 40 30.1322C40 27.7164 38.2075 25.7559 35.9987 25.7559H34.3975C33.8012 25.7559 33.235 25.8953 32.725 26.1537C32.77 26.4531 32.7963 26.7566 32.7963 27.0684C32.7963 28.6352 32.17 30.042 31.1725 31.0059Z\"\r\n fill=\"#00A3FF\" />\r\n <path\r\n d=\"M25.7988 32.3183C23.0388 32.3183 20.8 34.767 20.8 37.7857C20.8 38.3928 21.25 38.8809 21.8013 38.8809H34.1987C34.7537 38.8809 35.2 38.3887 35.2 37.7857C35.2 34.767 32.9613 32.3183 30.2013 32.3183H25.7988Z\"\r\n fill=\"#00A3FF\" />\r\n </svg>\r\n\r\n </div>\r\n </div>\r\n <div class=\"row w-100\">\r\n <div *ngIf=\"operationType==='add'\" class=\"col-md-12\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Add\r\n Group</a>\r\n <div class=\"sub-title\">Please add your group details</div>\r\n </div>\r\n <div *ngIf=\"operationType==='edit'\" class=\"col-md-12\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Edit Group</a>\r\n <div class=\"sub-title\">Edit your group details</div>\r\n </div>\r\n <div *ngIf=\"operationType==='view'\" class=\"col-md-9\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">View Group</a>\r\n <div class=\"sub-title\">View your group details</div>\r\n </div>\r\n @if ((gs.userAccess | async)?.manage_stores_isEdit) {\r\n <div *ngIf=\"operationType==='view'\" class=\"col-md-3 text-end px-0\" (click)=\"editgroup()\">\r\n <button class=\"btn btn-outline\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3833_85908)\">\r\n <path\r\n d=\"M9.16602 3.3332H3.33268C2.89065 3.3332 2.46673 3.50879 2.15417 3.82135C1.84161 4.13391 1.66602 4.55784 1.66602 4.99986V16.6665C1.66602 17.1086 1.84161 17.5325 2.15417 17.845C2.46673 18.1576 2.89065 18.3332 3.33268 18.3332H14.9993C15.4414 18.3332 15.8653 18.1576 16.1779 17.845C16.4904 17.5325 16.666 17.1086 16.666 16.6665V10.8332M15.416 2.0832C15.7475 1.75168 16.1972 1.56543 16.666 1.56543C17.1349 1.56543 17.5845 1.75168 17.916 2.0832C18.2475 2.41472 18.4338 2.86436 18.4338 3.3332C18.4338 3.80204 18.2475 4.25168 17.916 4.5832L9.99935 12.4999L6.66602 13.3332L7.49935 9.99986L15.416 2.0832Z\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3833_85908\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></button>\r\n </div>\r\n }\r\n </div>\r\n <form [formGroup]=\"groupForm\">\r\n <div class=\"row mt-8\">\r\n <div class=\"col-md-12 col-lg-12 mb-5\">\r\n <label for=\"groupName\" class=\"form-label\">Group Name</label>\r\n <input autocomplete=\"off\" type=\"text\" class=\"form-control\" id=\"groupName\"\r\n formControlName=\"groupName\" \r\n [ngClass]=\"{ 'is-invalid': groupForm.get('groupName')?.touched && groupForm.get('groupName')?.hasError('required') }\">\r\n @if (groupForm.get('groupName')?.touched && groupForm.get('groupName')?.hasError('required')) {\r\n <small>Group Name is required</small>\r\n }\r\n </div>\r\n <div class=\"my-5 dropdown1 cursor-pointer h-700\" *ngFor=\"let item of dataObject; let i = index\">\r\n <label for=\"storeList\" class=\"form-label\">Select Stores</label>\r\n <input type=\"text\" class=\"form-control disable\" id=\"storeName\" [ngModel]=\"selectedText\" [ngModelOptions]=\"{standalone: true}\"\r\n placeholder=\"Select Stores\" (click)=\"Dropdown('Stores',i,$event)\" readonly>\r\n <div *ngIf=\"item.isOpen\" class=\"dropdown-content position-absolute\">\r\n <div class=\"form-check d-flex align-items-center pt-3 px-5\">\r\n <input class=\"form-check-input\" type=\"checkbox\" value=\"Select All\" id=\"selectall{{i}}\"\r\n [checked]=\"selectedValuesArray[i]?.length === item.Stores.length\"\r\n (change)=\"toggleCheckbox($event,'Select All', i,0)\">\r\n <label class=\"form-check-label px-3\" for=\"selectall{{i}}\">\r\n Select All\r\n </label>\r\n </div>\r\n <div class=\"border border-gray mt-3\"></div>\r\n <div class=\"mt-3 d-flex align-items-center mx-3\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3 mt-2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\">\r\n <path d=\"M14 14.5L11.1 11.6M12.6667 7.83333C12.6667 10.7789 10.2789 13.1667 7.33333 13.1667C4.38781 13.1667 2 10.7789 2 7.83333C2 4.88781 4.38781 2.5 7.33333 2.5C10.2789 2.5 12.6667 4.88781 12.6667 7.83333Z\" stroke=\"#667085\" stroke-width=\"1.3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n </span>\r\n <input #searchInput type=\"text\" id=\"searchValue\" name=\"searchValue\" class=\"form-control searchinput ps-14 py-2 me-2 mt-2\"\r\n placeholder=\"Search\" autocomplete=\"off\" [(ngModel)]=\"searchValue\" [ngModelOptions]=\"{standalone: true}\"/>\r\n </div>\r\n <div *ngFor=\"let store of searchData(item.Stores,i);let j=index;\"\r\n class=\"form-check d-flex align-items-center py-3 px-5\">\r\n <input class=\"form-check-input cursor-pointer\" type=\"checkbox\" [value]=\"store?.storeName\"\r\n id=\"option{{store?.storeName}}\" [checked]=\"store?.checked\" [disabled]=\"operationType==='view'\"\r\n (change)=\"toggleCheckbox($event,store,i,j)\">\r\n <label class=\"form-check-label px-3 cursor-pointer\" for=\"option{{store?.storeName}}\">\r\n {{ store?.storeName }}\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-md-12 col-lg-12 mb-5\">\r\n <label for=\"description\" class=\"form-label\">Description</label>\r\n <textarea rows=\"5\" class=\"form-control\" id=\"description\" formControlName=\"description\"></textarea>\r\n </div>\r\n </div>\r\n <div *ngIf=\"operationType !== 'view'\" role=\"group\" class=\"d-flex mt-3 mb-15\">\r\n <button type=\"button\" class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button type=\"submit\" [disabled]=\"!groupForm.valid\" id=\"alert-toast\" class=\"btn btn-primary w-100 ms-3\"\r\n (click)=\"groupSubmit()\">Submit</button>\r\n </div>\r\n </form>\r\n </div>\r\n</div>", styles: [".title{color:var(--Gray-900, #101828)!important;font-size:18px!important;font-weight:600;line-height:28px}.sub-title{color:var(--Gray-500, #667085)!important;font-size:14px!important;font-weight:400!important;line-height:20px}::ng-deep .modal-content{border-radius:12px!important}.btn-outline{padding:12px!important;border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important}.dropdown1 .dropdown-title{color:var(--Gray-900, #101828);font-size:16px;font-weight:600;line-height:24px}.dropdown1 .dropdown{position:relative;display:inline-block}.dropdown1 .dropdown span{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}.dropdown1 .dropdown-content{z-index:1;padding:0;min-height:auto;max-height:285px;overflow:auto;border-radius:12px;background:var(--White, #FFF);box-shadow:0 8px 8px -4px #10182808,0 20px 24px -4px #10182814;width:89%}.dropdown1 .dropdown-content label{color:var(--Gray-700, #344054);font-size:14px;font-weight:500;line-height:20px}.dropdown1 .dropdown-content a{color:#000;padding:12px 16px;text-decoration:none;display:block}.dropdown1 .dropdown button{padding:10px;font-size:16px;cursor:pointer}.dropdown1 input[type=checkbox]{width:16px!important;height:16px!important;margin:-3px 5px;border-radius:4px!important;-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;appearance:none;outline:1px solid var(--gray-300, #D0D5DD);box-shadow:none;font-size:.8em;text-align:center;line-height:1em;background:#fff}.dropdown1 input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.dropdown1 input[type=checkbox]:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.2em;padding-left:0;padding-top:9px;padding-right:4px}.is-invalid{border-radius:8px!important;border:1px solid var(--Error-300, #FDA29B)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;padding-right:calc(1.5em + .75rem)!important;background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzIyMDFfMjA5NTApIj4KPHBhdGggZD0iTTcuOTk5NjcgNS4zMzM5OFY4LjAwMDY1TTcuOTk5NjcgMTAuNjY3M0g4LjAwNjM0TTE0LjY2NjMgOC4wMDA2NUMxNC42NjYzIDExLjY4MjYgMTEuNjgxNiAxNC42NjczIDcuOTk5NjcgMTQuNjY3M0M0LjMxNzc4IDE0LjY2NzMgMS4zMzMwMSAxMS42ODI2IDEuMzMzMDEgOC4wMDA2NUMxLjMzMzAxIDQuMzE4NzUgNC4zMTc3OCAxLjMzMzk4IDcuOTk5NjcgMS4zMzM5OEMxMS42ODE2IDEuMzMzOTggMTQuNjY2MyA0LjMxODc1IDE0LjY2NjMgOC4wMDA2NVoiIHN0cm9rZT0iI0YwNDQzOCIgc3Ryb2tlLXdpZHRoPSIxLjMzMzMzIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9nPgo8ZGVmcz4KPGNsaXBQYXRoIGlkPSJjbGlwMF8yMjAxXzIwOTUwIj4KPHJlY3Qgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2IiBmaWxsPSJ3aGl0ZSIvPgo8L2NsaXBQYXRoPgo8L2RlZnM+Cjwvc3ZnPgo=)!important;background-repeat:no-repeat!important;background-position:right calc(.375em + .1875rem) center!important;background-size:calc(.75em + .375rem) calc(.75em + .375rem)!important}small{color:var(--Error-500, #F04438)!important;font-size:13px!important;font-weight:400!important;line-height:20px}\n"] }]
279
279
  }], ctorParameters: () => [{ type: i1.NgbActiveModal }, { type: i0.ChangeDetectorRef }, { type: i2.FormBuilder }, { type: i3.GroupService }, { type: i4.ToastService }, { type: i5.GlobalStateService }], propDecorators: { type: [{
package/esm2022/lib/components/group-delete-popup/group-delete-popup.component.mjs CHANGED
@@ -41,10 +41,10 @@ export class GroupDeletePopupComponent {
41
41
  complete: () => { },
42
42
  });
43
43
  }
44
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: GroupDeletePopupComponent, deps: [{ token: i1.NgbActiveModal }, { token: i0.ChangeDetectorRef }, { token: i2.GroupService }, { token: i3.ToastService }], target: i0.ɵɵFactoryTarget.Component });
45
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: GroupDeletePopupComponent, selector: "lib-group-delete-popup", inputs: { deleteGroup: "deleteGroup" }, ngImport: i0, template: "<div class=\"card group-delete py-0\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"my-5\">\r\n <div class=\"symbol symbol-75px symbol-circle\">\r\n <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#FEE4E2\"/>\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#FEF3F2\" stroke-width=\"8\"/>\r\n <path d=\"M28 24V28M28 32H28.01M38 28C38 33.5228 33.5228 38 28 38C22.4772 38 18 33.5228 18 28C18 22.4772 22.4772 18 28 18C33.5228 18 38 22.4772 38 28Z\" stroke=\"#D92D20\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n \r\n </div>\r\n </div>\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Delete {{deleteGroup?.groupName}} Group?</a>\r\n <span class=\"sub-title fw-normal mt-2\"> Are you sure you want to delete this group? This action cannot be undone.</span>\r\n <div class=\"mt-5 w-100\">\r\n \r\n <div role=\"group\" class=\"d-flex mt-3 mb-15\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button id=\"alert-toast\" class=\"btn btn-danger w-100 ms-3\" (click)=\"onDeleteGroup()\">Delete</button>\r\n </div>\r\n \r\n </div>\r\n\r\n </div>\r\n</div>", styles: ["::ng-deep .modal-content{border-radius:12px!important}.group-delete{font-family:Inter}.group-delete .sub-title{color:var(--Gray-500, #667085)!important;font-size:14px!important;line-height:20px}\n"] });
44
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: GroupDeletePopupComponent, deps: [{ token: i1.NgbActiveModal }, { token: i0.ChangeDetectorRef }, { token: i2.GroupService }, { token: i3.ToastService }], target: i0.ɵɵFactoryTarget.Component });
45
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: GroupDeletePopupComponent, selector: "lib-group-delete-popup", inputs: { deleteGroup: "deleteGroup" }, ngImport: i0, template: "<div class=\"card group-delete py-0\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"my-5\">\r\n <div class=\"symbol symbol-75px symbol-circle\">\r\n <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#FEE4E2\"/>\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#FEF3F2\" stroke-width=\"8\"/>\r\n <path d=\"M28 24V28M28 32H28.01M38 28C38 33.5228 33.5228 38 28 38C22.4772 38 18 33.5228 18 28C18 22.4772 22.4772 18 28 18C33.5228 18 38 22.4772 38 28Z\" stroke=\"#D92D20\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n \r\n </div>\r\n </div>\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Delete {{deleteGroup?.groupName}} Group?</a>\r\n <span class=\"sub-title fw-normal mt-2\"> Are you sure you want to delete this group? This action cannot be undone.</span>\r\n <div class=\"mt-5 w-100\">\r\n \r\n <div role=\"group\" class=\"d-flex mt-3 mb-15\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button id=\"alert-toast\" class=\"btn btn-danger w-100 ms-3\" (click)=\"onDeleteGroup()\">Delete</button>\r\n </div>\r\n \r\n </div>\r\n\r\n </div>\r\n</div>", styles: ["::ng-deep .modal-content{border-radius:12px!important}.group-delete{font-family:Inter}.group-delete .sub-title{color:var(--Gray-500, #667085)!important;font-size:14px!important;line-height:20px}\n"] });
46
46
  }
47
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: GroupDeletePopupComponent, decorators: [{
47
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: GroupDeletePopupComponent, decorators: [{
48
48
  type: Component,
49
49
  args: [{ selector: "lib-group-delete-popup", template: "<div class=\"card group-delete py-0\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"my-5\">\r\n <div class=\"symbol symbol-75px symbol-circle\">\r\n <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#FEE4E2\"/>\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#FEF3F2\" stroke-width=\"8\"/>\r\n <path d=\"M28 24V28M28 32H28.01M38 28C38 33.5228 33.5228 38 28 38C22.4772 38 18 33.5228 18 28C18 22.4772 22.4772 18 28 18C33.5228 18 38 22.4772 38 28Z\" stroke=\"#D92D20\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n \r\n </div>\r\n </div>\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Delete {{deleteGroup?.groupName}} Group?</a>\r\n <span class=\"sub-title fw-normal mt-2\"> Are you sure you want to delete this group? This action cannot be undone.</span>\r\n <div class=\"mt-5 w-100\">\r\n \r\n <div role=\"group\" class=\"d-flex mt-3 mb-15\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button id=\"alert-toast\" class=\"btn btn-danger w-100 ms-3\" (click)=\"onDeleteGroup()\">Delete</button>\r\n </div>\r\n \r\n </div>\r\n\r\n </div>\r\n</div>", styles: ["::ng-deep .modal-content{border-radius:12px!important}.group-delete{font-family:Inter}.group-delete .sub-title{color:var(--Gray-500, #667085)!important;font-size:14px!important;line-height:20px}\n"] }]
50
50
  }], ctorParameters: () => [{ type: i1.NgbActiveModal }, { type: i0.ChangeDetectorRef }, { type: i2.GroupService }, { type: i3.ToastService }], propDecorators: { deleteGroup: [{
package/esm2022/lib/components/group-details/group-details.component.mjs CHANGED
@@ -455,10 +455,10 @@ export class GroupDetailsComponent {
455
455
  });
456
456
  }
457
457
  deactivateStore(store) { }
458
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: GroupDetailsComponent, deps: [{ token: i1.PageInfoService }, { token: i2.StoresService }, { token: i0.ChangeDetectorRef }, { token: i3.GroupService }, { token: i4.ExcelService }, { token: i1.GlobalStateService }, { token: i5.NgbModal }, { token: i6.Router }, { token: i7.ToastService }], target: i0.ɵɵFactoryTarget.Component });
459
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: GroupDetailsComponent, selector: "lib-group-details", outputs: { dataEvent: "dataEvent" }, ngImport: i0, template: "<div class=\"card\">\r\n <div class=\"card-header border-0 pt-3\">\r\n <div class=\"d-flex justify-content-left align-items-center\">\r\n <div class=\"backArrow d-flex justify-content-center align-items-center me-5 ml-0\">\r\n <button (click)=\"backToGroup()\"\r\n class=\"btn btn-default mx-2 btn-outline-default rounded-3 text-nowrap\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path d=\"M16.3333 9.99996H4.66663M4.66663 9.99996L10.5 15.8333M4.66663 9.99996L10.5 4.16663\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></button>\r\n </div>\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span class=\"card-label\">{{group?.groupName}}</span>\r\n <span class=\"text-sub mb-2\">{{ pagination.totalCount ? pagination.totalCount : '0'}} stores in this group</span>\r\n </h3>\r\n </div>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></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 type=\"text\" [formControl]=\"searchInput\" class=\"form-control ps-14 me-2\" placeholder=\"Search\"\r\n autocomplete=\"off\" />\r\n <!-- filter Start -->\r\n <lib-filters-custom [dataObject]=\"filterOptions\"\r\n (AppliedFilters)=\"applyFilter($event)\"></lib-filters-custom>\r\n <!-- filter End -->\r\n @if ((gs.userAccess | async)?.manage_stores_isDownload) { \r\n <button type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M17.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\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2\">Export</span> </button>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"card-body p-0\">\r\n <ng-container *ngIf=\"!loading && !noData\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border text-nowrap\">\r\n <thead class=\"cursor-pointer\">\r\n <tr>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('storeName')\">Store Name\r\n <svg [ngClass]=\"sortColumName === 'storeName' && sortDirection === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'storeName' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('storeId')\">Store ID\r\n <svg [ngClass]=\"sortColumName === 'storeId' && sortDirection === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'storeId' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('appId')\">App ID\r\n <svg [ngClass]=\"sortColumName === 'appId' && sortDirection === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'appId' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n \r\n <th (click)=\"onSort('city')\">Location\r\n <svg [ngClass]=\"sortColumName === 'city' && sortDirection === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'city' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th (click)=\"onSort('progress')\"> Progress Status <span>\r\n <svg [ngClass]=\"sortColumName === 'progress' && sortDirection === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'progress' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span></th>\r\n <th (click)=\"onSort('spocEmail')\">SPOC Email <span>\r\n <svg [ngClass]=\"sortColumName === 'spocEmail' && sortDirection === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'spocEmail' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span> </th>\r\n <th (click)=\"onSort('spocContact')\">SPOC Contact <span>\r\n <svg [ngClass]=\"sortColumName === 'spocContact' && sortDirection === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'spocContact' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span> </th>\r\n <th (click)=\"onSort('status')\">Status <span>\r\n <svg [ngClass]=\"sortColumName === 'status' && sortDirection === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'status' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span></th>\r\n <th>Actions</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <ng-container *ngFor=\"let store of storeList;let i=index;\">\r\n <tr>\r\n <td class=\"cursor-pointer\" (click)=\"navigateToCamera(store?.storeId);\">\r\n <div class=\"table-title\">\r\n <span class=\"txt-light-primary\">\r\n {{store?.storeName}}\r\n </span>\r\n </div>\r\n \r\n </td>\r\n <td> {{store?.storeId}}\r\n </td>\r\n <td> {{store?.appId}}\r\n </td>\r\n <td class=\"w-200px\">\r\n @if (store?.city) {\r\n <div class=\"table-sub\">{{store?.city}}</div>\r\n } @else {\r\n <div class=\"table-sub\">NA</div>\r\n }\r\n </td>\r\n <td><div class=\"text-end\"> <span class=\"my-1 mx-1 text-end\">\r\n <!-- <svg *ngIf=\"store?.status ==='Deactivated'\" width=\"8\" height=\"8\" viewBox=\"0 0 8 8\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <circle cx=\"4\" cy=\"4\" r=\"3\" fill=\"#dc3545\" />\r\n </svg>\r\n <svg *ngIf=\"store?.status !=='Deactivated'\" width=\"8\" height=\"8\" viewBox=\"0 0 8 8\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <circle cx=\"4\" cy=\"4\" r=\"3\" fill=\"#12B76A\" />\r\n </svg> -->\r\n {{store?.progress ? store?.progress : 0}}%</span>\r\n </div>\r\n <div class=\"h-5px w-100 bg-light mt-2\"> \r\n <div *ngIf=\"store?.status ==='Deactivated'\" class=\"bg-danger rounded h-5px\" role=\"progressbar\"\r\n [ngStyle]=\"{ width: (store?.progress ? store?.progress : 0) + '%' }\"\r\n aria-valuemin=\"20\" aria-valuemax=\"100\"></div>\r\n <div *ngIf=\"store?.status !=='Deactivated'\" class=\"bg-success rounded h-5px\" role=\"progressbar\"\r\n [ngStyle]=\"{ width: (store?.progress ? store?.progress : 0) + '%' }\"\r\n aria-valuemin=\"20\" aria-valuemax=\"100\"></div>\r\n </div>\r\n </td>\r\n <td class=\"w-200px\">\r\n <div class=\"d-flex align-items-center\">\r\n <div class=\"symbol symbol-35px symbol-circle\">\r\n <span class=\"symbol-label badge-light-primary text-symbol\">\r\n <span class=\"text-primary fs-4 badge badge-light-primary fw-normal\">\r\n {{store?.spocEmail.slice(0,2) | uppercase }}\r\n </span>\r\n </span>\r\n </div>\r\n <div class=\"ms-2\">\r\n <div class=\"table-title\">{{store?.spocEmail || 'NA'}}</div>\r\n </div>\r\n </div>\r\n </td>\r\n <td >\r\n {{store?.spocContact || 'NA'}}\r\n </td>\r\n <td>\r\n @if(store?.status === 'onboareded') {\r\n <span class=\"blue-badge\">Onboarded</span>\r\n } @else if (store.status==='installationfailed') {\r\n <span class=\"yellow-badge\">Installation Failed</span>\r\n } @else if(store.status==='paired') {\r\n <span class=\"blue-badge\">Paired</span>\r\n } @else if(store.status==='live') {\r\n <span class=\"green-badge\">Live</span>\r\n }@else{\r\n <span class=\"blue-badge\">{{store?.status | titlecase}}</span>\r\n }\r\n </td>\r\n \r\n <td> \r\n <button *ngIf=\"store.status==='Live' || store.status==='deployed' || store.status==='Deactivated'\" type=\"button\" (click)=\"goToStore(store)\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\">\r\n <span>View</span>\r\n </button> \r\n \r\n @if ((gs.userAccess | async)?.manage_stores_isEdit) {\r\n <button *ngIf=\"store.status==='onboarded' && user?.userType !== 'tango'\" type=\"button\" (click)=\"goToEdgeApp(store)\" \r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\">\r\n <span>Pair</span>\r\n </button>\r\n <button *ngIf=\"store.status==='onboarded' && user?.userType === 'tango'\" type=\"button\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val cursor-notallowed\">\r\n <span>Pair</span>\r\n </button>\r\n <button *ngIf=\"store.status==='paired'|| store.status==='installationfailed'\" type=\"button\"\r\n (click)=\"goToEdgeAppconfig(store)\" [disabled]=\"user?.userType === 'tango'\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\">\r\n <span>Config</span>\r\n </button>\r\n <button *ngIf=\"store.status==='Infra Issue'\" type=\"button\" (click)=\"goToStoreInfra(store)\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\">\r\n <span>infra</span>\r\n </button>\r\n \r\n <span class=\"dropdown1\">\r\n <button class=\"options-class\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <svg width=\"36\" height=\"36\" viewBox=\"0 0 36 36\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M18.0001 18.8334C18.4603 18.8334 18.8334 18.4603 18.8334 18C18.8334 17.5398 18.4603 17.1667 18.0001 17.1667C17.5398 17.1667 17.1667 17.5398 17.1667 18C17.1667 18.4603 17.5398 18.8334 18.0001 18.8334Z\"\r\n [attr.stroke]=\"sortColumName === 'status' ? '#00A3FF' : '#667085'\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M18.0001 13C18.4603 13 18.8334 12.6269 18.8334 12.1667C18.8334 11.7065 18.4603 11.3334 18.0001 11.3334C17.5398 11.3334 17.1667 11.7065 17.1667 12.1667C17.1667 12.6269 17.5398 13 18.0001 13Z\"\r\n [attr.stroke]=\"sortColumName === 'status' ? '#00A3FF' : '#667085'\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M18.0001 24.6667C18.4603 24.6667 18.8334 24.2936 18.8334 23.8334C18.8334 23.3731 18.4603 23 18.0001 23C17.5398 23 17.1667 23.3731 17.1667 23.8334C17.1667 24.2936 17.5398 24.6667 18.0001 24.6667Z\"\r\n [attr.stroke]=\"sortColumName === 'status' ? '#00A3FF' : '#667085'\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </button>\r\n <ul class=\"dropdown-menu\" aria-labelledby=\"dropdownMenuButton\">\r\n <li (click)=\"navigateToStore(store?.storeId);\"><button class=\"dropdown-item\" type=\"button\">Edit\r\n Store</button></li>\r\n <!-- @if(store?.storeStatus !== 'active') { -->\r\n <li *ngIf =\"store?.storeStatus === 'active'\"><button class=\"dropdown-item\" (click)=\"updateStoreStatus(store,'deactive')\" type=\"button\">Deactivate</button></li>\r\n <!-- } @else { -->\r\n <li *ngIf =\"store?.storeStatus === 'deactive'\"><button class=\"dropdown-item\" (click)=\"updateStoreStatus(store,'active')\" type=\"button\">Activate</button></li>\r\n <!-- } -->\r\n </ul>\r\n </span>\r\n }\r\n </td>\r\n </tr>\r\n </ng-container>\r\n </tbody>\r\n </table>\r\n </div>\r\n \r\n </ng-container>\r\n <ng-container *ngIf=\"loading && !noData\">\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 *ngIf=\"noData && !loading\">\r\n <div class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n</div>", styles: [".activebtn{color:var(--Primary-700, #009BF3)!important;border-radius:6px!important;background:var(--Primary-50, #EAF8FF)!important;font-size:16px!important;font-weight:500!important}.options-class{border:none;background-color:transparent}.text-sub{color:var(--Gray-500, #667085)!important;font-family:Inter;font-size:14px!important;font-weight:400!important;line-height:20px}.border-val{color:var(--Gray-700, #344054)!important;font-family:Inter;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}.table-title-primary{color:var(--Primary-700, #009BF3)!important;font-weight:500!important}.table-sub{line-height:30px!important;color:var(--Gray-500, #667085)!important}.form-control{color:var(--Gray-500, #667085)!important;font-size:14.56px!important;font-weight:400!important;line-height:21.84px!important;border-radius:7.28px!important;border:.91px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 .91px 1.82px #1018280d!important}.illustcontent{color:var(--Gray-900, #101828);font-size:16px;font-weight:600}.nav-item .nav-link{color:var(--Gray-500, #667085);font-size:16px;font-weight:500}.profile{color:var(--Primary-600, #00A3FF);padding:6px;font-size:14px;font-weight:500;line-height:20px;border-radius:200px;background:var(--Primary-50, #EAF8FF);width:32px;height:32px}.backArrow{width:44px;height:44px;border-radius:8px;border:1px solid var(--Gray-300, #D0D5DD);background:var(--White, #FFF);box-shadow:0 1px 2px #1018280d}.img-src{width:25%;height:20%}.txt-light-primary{color:#009bf3!important}.progressbar-value{color:var(--gray-500, #667085);font-size:12px!important;font-weight:400!important}.green-badge{color:#027a48;font-size:12px;font-weight:500;line-height:18px;border-radius:16px;background:#ecfdf3;padding:2px 8px}.yellow-badge{color:#b54708;font-size:12px;font-weight:500;line-height:18px;border-radius:16px;background:#fffaeb;padding:2px 8px}.blue-badge{color:#009bf3;font-size:12px;font-weight:500;line-height:18px;border-radius:16px;background:#eaf8ff;padding:2px 8px}.red-badge{color:#b42318;font-size:12px;font-weight:500;line-height:18px;border-radius:16px;background:#fef3f2;padding:2px 8px}table td{line-height:37px!important}.rotate{rotate:180deg;transition:1s}.bg-light{background-color:#c4c3c3!important}\n"], dependencies: [{ kind: "directive", type: i8.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i8.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i8.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i8.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i9.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: i9.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i9.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i10.FiltersComponent, selector: "lib-filters-custom", inputs: ["dataObject"], outputs: ["AppliedFilters"] }, { kind: "pipe", type: i8.AsyncPipe, name: "async" }, { kind: "pipe", type: i8.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i8.TitleCasePipe, name: "titlecase" }] });
458
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: GroupDetailsComponent, deps: [{ token: i1.PageInfoService }, { token: i2.StoresService }, { token: i0.ChangeDetectorRef }, { token: i3.GroupService }, { token: i4.ExcelService }, { token: i1.GlobalStateService }, { token: i5.NgbModal }, { token: i6.Router }, { token: i7.ToastService }], target: i0.ɵɵFactoryTarget.Component });
459
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: GroupDetailsComponent, selector: "lib-group-details", outputs: { dataEvent: "dataEvent" }, ngImport: i0, template: "<div class=\"card\">\r\n <div class=\"card-header border-0 pt-3\">\r\n <div class=\"d-flex justify-content-left align-items-center\">\r\n <div class=\"backArrow d-flex justify-content-center align-items-center me-5 ml-0\">\r\n <button (click)=\"backToGroup()\"\r\n class=\"btn btn-default mx-2 btn-outline-default rounded-3 text-nowrap\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path d=\"M16.3333 9.99996H4.66663M4.66663 9.99996L10.5 15.8333M4.66663 9.99996L10.5 4.16663\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></button>\r\n </div>\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span class=\"card-label\">{{group?.groupName}}</span>\r\n <span class=\"text-sub mb-2\">{{ pagination.totalCount ? pagination.totalCount : '0'}} stores in this group</span>\r\n </h3>\r\n </div>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></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 type=\"text\" [formControl]=\"searchInput\" class=\"form-control ps-14 me-2\" placeholder=\"Search\"\r\n autocomplete=\"off\" />\r\n <!-- filter Start -->\r\n <lib-filters-custom [dataObject]=\"filterOptions\"\r\n (AppliedFilters)=\"applyFilter($event)\"></lib-filters-custom>\r\n <!-- filter End -->\r\n @if ((gs.userAccess | async)?.manage_stores_isDownload) { \r\n <button type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M17.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\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2\">Export</span> </button>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"card-body p-0\">\r\n <ng-container *ngIf=\"!loading && !noData\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border text-nowrap\">\r\n <thead class=\"cursor-pointer\">\r\n <tr>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('storeName')\">Store Name\r\n <svg [ngClass]=\"sortColumName === 'storeName' && sortDirection === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'storeName' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('storeId')\">Store ID\r\n <svg [ngClass]=\"sortColumName === 'storeId' && sortDirection === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'storeId' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('appId')\">App ID\r\n <svg [ngClass]=\"sortColumName === 'appId' && sortDirection === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'appId' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n \r\n <th (click)=\"onSort('city')\">Location\r\n <svg [ngClass]=\"sortColumName === 'city' && sortDirection === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'city' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th (click)=\"onSort('progress')\"> Progress Status <span>\r\n <svg [ngClass]=\"sortColumName === 'progress' && sortDirection === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'progress' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span></th>\r\n <th (click)=\"onSort('spocEmail')\">SPOC Email <span>\r\n <svg [ngClass]=\"sortColumName === 'spocEmail' && sortDirection === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'spocEmail' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span> </th>\r\n <th (click)=\"onSort('spocContact')\">SPOC Contact <span>\r\n <svg [ngClass]=\"sortColumName === 'spocContact' && sortDirection === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'spocContact' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span> </th>\r\n <th (click)=\"onSort('status')\">Status <span>\r\n <svg [ngClass]=\"sortColumName === 'status' && sortDirection === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'status' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span></th>\r\n <th>Actions</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <ng-container *ngFor=\"let store of storeList;let i=index;\">\r\n <tr>\r\n <td class=\"cursor-pointer\" (click)=\"navigateToCamera(store?.storeId);\">\r\n <div class=\"table-title\">\r\n <span class=\"txt-light-primary\">\r\n {{store?.storeName}}\r\n </span>\r\n </div>\r\n \r\n </td>\r\n <td> {{store?.storeId}}\r\n </td>\r\n <td> {{store?.appId}}\r\n </td>\r\n <td class=\"w-200px\">\r\n @if (store?.city) {\r\n <div class=\"table-sub\">{{store?.city}}</div>\r\n } @else {\r\n <div class=\"table-sub\">NA</div>\r\n }\r\n </td>\r\n <td><div class=\"text-end\"> <span class=\"my-1 mx-1 text-end\">\r\n <!-- <svg *ngIf=\"store?.status ==='Deactivated'\" width=\"8\" height=\"8\" viewBox=\"0 0 8 8\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <circle cx=\"4\" cy=\"4\" r=\"3\" fill=\"#dc3545\" />\r\n </svg>\r\n <svg *ngIf=\"store?.status !=='Deactivated'\" width=\"8\" height=\"8\" viewBox=\"0 0 8 8\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <circle cx=\"4\" cy=\"4\" r=\"3\" fill=\"#12B76A\" />\r\n </svg> -->\r\n {{store?.progress ? store?.progress : 0}}%</span>\r\n </div>\r\n <div class=\"h-5px w-100 bg-light mt-2\"> \r\n <div *ngIf=\"store?.status ==='Deactivated'\" class=\"bg-danger rounded h-5px\" role=\"progressbar\"\r\n [ngStyle]=\"{ width: (store?.progress ? store?.progress : 0) + '%' }\"\r\n aria-valuemin=\"20\" aria-valuemax=\"100\"></div>\r\n <div *ngIf=\"store?.status !=='Deactivated'\" class=\"bg-success rounded h-5px\" role=\"progressbar\"\r\n [ngStyle]=\"{ width: (store?.progress ? store?.progress : 0) + '%' }\"\r\n aria-valuemin=\"20\" aria-valuemax=\"100\"></div>\r\n </div>\r\n </td>\r\n <td class=\"w-200px\">\r\n <div class=\"d-flex align-items-center\">\r\n <div class=\"symbol symbol-35px symbol-circle\">\r\n <span class=\"symbol-label badge-light-primary text-symbol\">\r\n <span class=\"text-primary fs-4 badge badge-light-primary fw-normal\">\r\n {{store?.spocEmail.slice(0,2) | uppercase }}\r\n </span>\r\n </span>\r\n </div>\r\n <div class=\"ms-2\">\r\n <div class=\"table-title\">{{store?.spocEmail || 'NA'}}</div>\r\n </div>\r\n </div>\r\n </td>\r\n <td >\r\n {{store?.spocContact || 'NA'}}\r\n </td>\r\n <td>\r\n @if(store?.status === 'onboareded') {\r\n <span class=\"blue-badge\">Onboarded</span>\r\n } @else if (store.status==='installationfailed') {\r\n <span class=\"yellow-badge\">Installation Failed</span>\r\n } @else if(store.status==='paired') {\r\n <span class=\"blue-badge\">Paired</span>\r\n } @else if(store.status==='live') {\r\n <span class=\"green-badge\">Live</span>\r\n }@else{\r\n <span class=\"blue-badge\">{{store?.status | titlecase}}</span>\r\n }\r\n </td>\r\n \r\n <td> \r\n <button *ngIf=\"store.status==='Live' || store.status==='deployed' || store.status==='Deactivated'\" type=\"button\" (click)=\"goToStore(store)\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\">\r\n <span>View</span>\r\n </button> \r\n \r\n @if ((gs.userAccess | async)?.manage_stores_isEdit) {\r\n <button *ngIf=\"store.status==='onboarded' && user?.userType !== 'tango'\" type=\"button\" (click)=\"goToEdgeApp(store)\" \r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\">\r\n <span>Pair</span>\r\n </button>\r\n <button *ngIf=\"store.status==='onboarded' && user?.userType === 'tango'\" type=\"button\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val cursor-notallowed\">\r\n <span>Pair</span>\r\n </button>\r\n <button *ngIf=\"store.status==='paired'|| store.status==='installationfailed'\" type=\"button\"\r\n (click)=\"goToEdgeAppconfig(store)\" [disabled]=\"user?.userType === 'tango'\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\">\r\n <span>Config</span>\r\n </button>\r\n <button *ngIf=\"store.status==='Infra Issue'\" type=\"button\" (click)=\"goToStoreInfra(store)\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\">\r\n <span>infra</span>\r\n </button>\r\n \r\n <span class=\"dropdown1\">\r\n <button class=\"options-class\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <svg width=\"36\" height=\"36\" viewBox=\"0 0 36 36\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M18.0001 18.8334C18.4603 18.8334 18.8334 18.4603 18.8334 18C18.8334 17.5398 18.4603 17.1667 18.0001 17.1667C17.5398 17.1667 17.1667 17.5398 17.1667 18C17.1667 18.4603 17.5398 18.8334 18.0001 18.8334Z\"\r\n [attr.stroke]=\"sortColumName === 'status' ? '#00A3FF' : '#667085'\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M18.0001 13C18.4603 13 18.8334 12.6269 18.8334 12.1667C18.8334 11.7065 18.4603 11.3334 18.0001 11.3334C17.5398 11.3334 17.1667 11.7065 17.1667 12.1667C17.1667 12.6269 17.5398 13 18.0001 13Z\"\r\n [attr.stroke]=\"sortColumName === 'status' ? '#00A3FF' : '#667085'\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M18.0001 24.6667C18.4603 24.6667 18.8334 24.2936 18.8334 23.8334C18.8334 23.3731 18.4603 23 18.0001 23C17.5398 23 17.1667 23.3731 17.1667 23.8334C17.1667 24.2936 17.5398 24.6667 18.0001 24.6667Z\"\r\n [attr.stroke]=\"sortColumName === 'status' ? '#00A3FF' : '#667085'\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </button>\r\n <ul class=\"dropdown-menu\" aria-labelledby=\"dropdownMenuButton\">\r\n <li (click)=\"navigateToStore(store?.storeId);\"><button class=\"dropdown-item\" type=\"button\">Edit\r\n Store</button></li>\r\n <!-- @if(store?.storeStatus !== 'active') { -->\r\n <li *ngIf =\"store?.storeStatus === 'active'\"><button class=\"dropdown-item\" (click)=\"updateStoreStatus(store,'deactive')\" type=\"button\">Deactivate</button></li>\r\n <!-- } @else { -->\r\n <li *ngIf =\"store?.storeStatus === 'deactive'\"><button class=\"dropdown-item\" (click)=\"updateStoreStatus(store,'active')\" type=\"button\">Activate</button></li>\r\n <!-- } -->\r\n </ul>\r\n </span>\r\n }\r\n </td>\r\n </tr>\r\n </ng-container>\r\n </tbody>\r\n </table>\r\n </div>\r\n \r\n </ng-container>\r\n <ng-container *ngIf=\"loading && !noData\">\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 *ngIf=\"noData && !loading\">\r\n <div class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n</div>", styles: [".activebtn{color:var(--Primary-700, #009BF3)!important;border-radius:6px!important;background:var(--Primary-50, #EAF8FF)!important;font-size:16px!important;font-weight:500!important}.options-class{border:none;background-color:transparent}.text-sub{color:var(--Gray-500, #667085)!important;font-family:Inter;font-size:14px!important;font-weight:400!important;line-height:20px}.border-val{color:var(--Gray-700, #344054)!important;font-family:Inter;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}.table-title-primary{color:var(--Primary-700, #009BF3)!important;font-weight:500!important}.table-sub{line-height:30px!important;color:var(--Gray-500, #667085)!important}.form-control{color:var(--Gray-500, #667085)!important;font-size:14.56px!important;font-weight:400!important;line-height:21.84px!important;border-radius:7.28px!important;border:.91px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 .91px 1.82px #1018280d!important}.illustcontent{color:var(--Gray-900, #101828);font-size:16px;font-weight:600}.nav-item .nav-link{color:var(--Gray-500, #667085);font-size:16px;font-weight:500}.profile{color:var(--Primary-600, #00A3FF);padding:6px;font-size:14px;font-weight:500;line-height:20px;border-radius:200px;background:var(--Primary-50, #EAF8FF);width:32px;height:32px}.backArrow{width:44px;height:44px;border-radius:8px;border:1px solid var(--Gray-300, #D0D5DD);background:var(--White, #FFF);box-shadow:0 1px 2px #1018280d}.img-src{width:25%;height:20%}.txt-light-primary{color:#009bf3!important}.progressbar-value{color:var(--gray-500, #667085);font-size:12px!important;font-weight:400!important}.green-badge{color:#027a48;font-size:12px;font-weight:500;line-height:18px;border-radius:16px;background:#ecfdf3;padding:2px 8px}.yellow-badge{color:#b54708;font-size:12px;font-weight:500;line-height:18px;border-radius:16px;background:#fffaeb;padding:2px 8px}.blue-badge{color:#009bf3;font-size:12px;font-weight:500;line-height:18px;border-radius:16px;background:#eaf8ff;padding:2px 8px}.red-badge{color:#b42318;font-size:12px;font-weight:500;line-height:18px;border-radius:16px;background:#fef3f2;padding:2px 8px}table td{line-height:37px!important}.rotate{rotate:180deg;transition:1s}.bg-light{background-color:#c4c3c3!important}\n"], dependencies: [{ kind: "directive", type: i8.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i8.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i8.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i8.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i9.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: i9.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i9.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i10.FiltersComponent, selector: "lib-filters-custom", inputs: ["dataObject"], outputs: ["AppliedFilters"] }, { kind: "pipe", type: i8.AsyncPipe, name: "async" }, { kind: "pipe", type: i8.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i8.TitleCasePipe, name: "titlecase" }] });
460
460
  }
461
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: GroupDetailsComponent, decorators: [{
461
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: GroupDetailsComponent, decorators: [{
462
462
  type: Component,
463
463
  args: [{ selector: "lib-group-details", template: "<div class=\"card\">\r\n <div class=\"card-header border-0 pt-3\">\r\n <div class=\"d-flex justify-content-left align-items-center\">\r\n <div class=\"backArrow d-flex justify-content-center align-items-center me-5 ml-0\">\r\n <button (click)=\"backToGroup()\"\r\n class=\"btn btn-default mx-2 btn-outline-default rounded-3 text-nowrap\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path d=\"M16.3333 9.99996H4.66663M4.66663 9.99996L10.5 15.8333M4.66663 9.99996L10.5 4.16663\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></button>\r\n </div>\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span class=\"card-label\">{{group?.groupName}}</span>\r\n <span class=\"text-sub mb-2\">{{ pagination.totalCount ? pagination.totalCount : '0'}} stores in this group</span>\r\n </h3>\r\n </div>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></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 type=\"text\" [formControl]=\"searchInput\" class=\"form-control ps-14 me-2\" placeholder=\"Search\"\r\n autocomplete=\"off\" />\r\n <!-- filter Start -->\r\n <lib-filters-custom [dataObject]=\"filterOptions\"\r\n (AppliedFilters)=\"applyFilter($event)\"></lib-filters-custom>\r\n <!-- filter End -->\r\n @if ((gs.userAccess | async)?.manage_stores_isDownload) { \r\n <button type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M17.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\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2\">Export</span> </button>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"card-body p-0\">\r\n <ng-container *ngIf=\"!loading && !noData\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border text-nowrap\">\r\n <thead class=\"cursor-pointer\">\r\n <tr>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('storeName')\">Store Name\r\n <svg [ngClass]=\"sortColumName === 'storeName' && sortDirection === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'storeName' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('storeId')\">Store ID\r\n <svg [ngClass]=\"sortColumName === 'storeId' && sortDirection === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'storeId' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('appId')\">App ID\r\n <svg [ngClass]=\"sortColumName === 'appId' && sortDirection === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'appId' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n \r\n <th (click)=\"onSort('city')\">Location\r\n <svg [ngClass]=\"sortColumName === 'city' && sortDirection === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'city' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th (click)=\"onSort('progress')\"> Progress Status <span>\r\n <svg [ngClass]=\"sortColumName === 'progress' && sortDirection === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'progress' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span></th>\r\n <th (click)=\"onSort('spocEmail')\">SPOC Email <span>\r\n <svg [ngClass]=\"sortColumName === 'spocEmail' && sortDirection === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'spocEmail' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span> </th>\r\n <th (click)=\"onSort('spocContact')\">SPOC Contact <span>\r\n <svg [ngClass]=\"sortColumName === 'spocContact' && sortDirection === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'spocContact' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span> </th>\r\n <th (click)=\"onSort('status')\">Status <span>\r\n <svg [ngClass]=\"sortColumName === 'status' && sortDirection === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'status' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span></th>\r\n <th>Actions</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <ng-container *ngFor=\"let store of storeList;let i=index;\">\r\n <tr>\r\n <td class=\"cursor-pointer\" (click)=\"navigateToCamera(store?.storeId);\">\r\n <div class=\"table-title\">\r\n <span class=\"txt-light-primary\">\r\n {{store?.storeName}}\r\n </span>\r\n </div>\r\n \r\n </td>\r\n <td> {{store?.storeId}}\r\n </td>\r\n <td> {{store?.appId}}\r\n </td>\r\n <td class=\"w-200px\">\r\n @if (store?.city) {\r\n <div class=\"table-sub\">{{store?.city}}</div>\r\n } @else {\r\n <div class=\"table-sub\">NA</div>\r\n }\r\n </td>\r\n <td><div class=\"text-end\"> <span class=\"my-1 mx-1 text-end\">\r\n <!-- <svg *ngIf=\"store?.status ==='Deactivated'\" width=\"8\" height=\"8\" viewBox=\"0 0 8 8\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <circle cx=\"4\" cy=\"4\" r=\"3\" fill=\"#dc3545\" />\r\n </svg>\r\n <svg *ngIf=\"store?.status !=='Deactivated'\" width=\"8\" height=\"8\" viewBox=\"0 0 8 8\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <circle cx=\"4\" cy=\"4\" r=\"3\" fill=\"#12B76A\" />\r\n </svg> -->\r\n {{store?.progress ? store?.progress : 0}}%</span>\r\n </div>\r\n <div class=\"h-5px w-100 bg-light mt-2\"> \r\n <div *ngIf=\"store?.status ==='Deactivated'\" class=\"bg-danger rounded h-5px\" role=\"progressbar\"\r\n [ngStyle]=\"{ width: (store?.progress ? store?.progress : 0) + '%' }\"\r\n aria-valuemin=\"20\" aria-valuemax=\"100\"></div>\r\n <div *ngIf=\"store?.status !=='Deactivated'\" class=\"bg-success rounded h-5px\" role=\"progressbar\"\r\n [ngStyle]=\"{ width: (store?.progress ? store?.progress : 0) + '%' }\"\r\n aria-valuemin=\"20\" aria-valuemax=\"100\"></div>\r\n </div>\r\n </td>\r\n <td class=\"w-200px\">\r\n <div class=\"d-flex align-items-center\">\r\n <div class=\"symbol symbol-35px symbol-circle\">\r\n <span class=\"symbol-label badge-light-primary text-symbol\">\r\n <span class=\"text-primary fs-4 badge badge-light-primary fw-normal\">\r\n {{store?.spocEmail.slice(0,2) | uppercase }}\r\n </span>\r\n </span>\r\n </div>\r\n <div class=\"ms-2\">\r\n <div class=\"table-title\">{{store?.spocEmail || 'NA'}}</div>\r\n </div>\r\n </div>\r\n </td>\r\n <td >\r\n {{store?.spocContact || 'NA'}}\r\n </td>\r\n <td>\r\n @if(store?.status === 'onboareded') {\r\n <span class=\"blue-badge\">Onboarded</span>\r\n } @else if (store.status==='installationfailed') {\r\n <span class=\"yellow-badge\">Installation Failed</span>\r\n } @else if(store.status==='paired') {\r\n <span class=\"blue-badge\">Paired</span>\r\n } @else if(store.status==='live') {\r\n <span class=\"green-badge\">Live</span>\r\n }@else{\r\n <span class=\"blue-badge\">{{store?.status | titlecase}}</span>\r\n }\r\n </td>\r\n \r\n <td> \r\n <button *ngIf=\"store.status==='Live' || store.status==='deployed' || store.status==='Deactivated'\" type=\"button\" (click)=\"goToStore(store)\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\">\r\n <span>View</span>\r\n </button> \r\n \r\n @if ((gs.userAccess | async)?.manage_stores_isEdit) {\r\n <button *ngIf=\"store.status==='onboarded' && user?.userType !== 'tango'\" type=\"button\" (click)=\"goToEdgeApp(store)\" \r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\">\r\n <span>Pair</span>\r\n </button>\r\n <button *ngIf=\"store.status==='onboarded' && user?.userType === 'tango'\" type=\"button\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val cursor-notallowed\">\r\n <span>Pair</span>\r\n </button>\r\n <button *ngIf=\"store.status==='paired'|| store.status==='installationfailed'\" type=\"button\"\r\n (click)=\"goToEdgeAppconfig(store)\" [disabled]=\"user?.userType === 'tango'\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\">\r\n <span>Config</span>\r\n </button>\r\n <button *ngIf=\"store.status==='Infra Issue'\" type=\"button\" (click)=\"goToStoreInfra(store)\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\">\r\n <span>infra</span>\r\n </button>\r\n \r\n <span class=\"dropdown1\">\r\n <button class=\"options-class\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\r\n <svg width=\"36\" height=\"36\" viewBox=\"0 0 36 36\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M18.0001 18.8334C18.4603 18.8334 18.8334 18.4603 18.8334 18C18.8334 17.5398 18.4603 17.1667 18.0001 17.1667C17.5398 17.1667 17.1667 17.5398 17.1667 18C17.1667 18.4603 17.5398 18.8334 18.0001 18.8334Z\"\r\n [attr.stroke]=\"sortColumName === 'status' ? '#00A3FF' : '#667085'\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M18.0001 13C18.4603 13 18.8334 12.6269 18.8334 12.1667C18.8334 11.7065 18.4603 11.3334 18.0001 11.3334C17.5398 11.3334 17.1667 11.7065 17.1667 12.1667C17.1667 12.6269 17.5398 13 18.0001 13Z\"\r\n [attr.stroke]=\"sortColumName === 'status' ? '#00A3FF' : '#667085'\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M18.0001 24.6667C18.4603 24.6667 18.8334 24.2936 18.8334 23.8334C18.8334 23.3731 18.4603 23 18.0001 23C17.5398 23 17.1667 23.3731 17.1667 23.8334C17.1667 24.2936 17.5398 24.6667 18.0001 24.6667Z\"\r\n [attr.stroke]=\"sortColumName === 'status' ? '#00A3FF' : '#667085'\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </button>\r\n <ul class=\"dropdown-menu\" aria-labelledby=\"dropdownMenuButton\">\r\n <li (click)=\"navigateToStore(store?.storeId);\"><button class=\"dropdown-item\" type=\"button\">Edit\r\n Store</button></li>\r\n <!-- @if(store?.storeStatus !== 'active') { -->\r\n <li *ngIf =\"store?.storeStatus === 'active'\"><button class=\"dropdown-item\" (click)=\"updateStoreStatus(store,'deactive')\" type=\"button\">Deactivate</button></li>\r\n <!-- } @else { -->\r\n <li *ngIf =\"store?.storeStatus === 'deactive'\"><button class=\"dropdown-item\" (click)=\"updateStoreStatus(store,'active')\" type=\"button\">Activate</button></li>\r\n <!-- } -->\r\n </ul>\r\n </span>\r\n }\r\n </td>\r\n </tr>\r\n </ng-container>\r\n </tbody>\r\n </table>\r\n </div>\r\n \r\n </ng-container>\r\n <ng-container *ngIf=\"loading && !noData\">\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 *ngIf=\"noData && !loading\">\r\n <div class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n</div>", styles: [".activebtn{color:var(--Primary-700, #009BF3)!important;border-radius:6px!important;background:var(--Primary-50, #EAF8FF)!important;font-size:16px!important;font-weight:500!important}.options-class{border:none;background-color:transparent}.text-sub{color:var(--Gray-500, #667085)!important;font-family:Inter;font-size:14px!important;font-weight:400!important;line-height:20px}.border-val{color:var(--Gray-700, #344054)!important;font-family:Inter;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}.table-title-primary{color:var(--Primary-700, #009BF3)!important;font-weight:500!important}.table-sub{line-height:30px!important;color:var(--Gray-500, #667085)!important}.form-control{color:var(--Gray-500, #667085)!important;font-size:14.56px!important;font-weight:400!important;line-height:21.84px!important;border-radius:7.28px!important;border:.91px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 .91px 1.82px #1018280d!important}.illustcontent{color:var(--Gray-900, #101828);font-size:16px;font-weight:600}.nav-item .nav-link{color:var(--Gray-500, #667085);font-size:16px;font-weight:500}.profile{color:var(--Primary-600, #00A3FF);padding:6px;font-size:14px;font-weight:500;line-height:20px;border-radius:200px;background:var(--Primary-50, #EAF8FF);width:32px;height:32px}.backArrow{width:44px;height:44px;border-radius:8px;border:1px solid var(--Gray-300, #D0D5DD);background:var(--White, #FFF);box-shadow:0 1px 2px #1018280d}.img-src{width:25%;height:20%}.txt-light-primary{color:#009bf3!important}.progressbar-value{color:var(--gray-500, #667085);font-size:12px!important;font-weight:400!important}.green-badge{color:#027a48;font-size:12px;font-weight:500;line-height:18px;border-radius:16px;background:#ecfdf3;padding:2px 8px}.yellow-badge{color:#b54708;font-size:12px;font-weight:500;line-height:18px;border-radius:16px;background:#fffaeb;padding:2px 8px}.blue-badge{color:#009bf3;font-size:12px;font-weight:500;line-height:18px;border-radius:16px;background:#eaf8ff;padding:2px 8px}.red-badge{color:#b42318;font-size:12px;font-weight:500;line-height:18px;border-radius:16px;background:#fef3f2;padding:2px 8px}table td{line-height:37px!important}.rotate{rotate:180deg;transition:1s}.bg-light{background-color:#c4c3c3!important}\n"] }]
464
464
  }], ctorParameters: () => [{ type: i1.PageInfoService }, { type: i2.StoresService }, { type: i0.ChangeDetectorRef }, { type: i3.GroupService }, { type: i4.ExcelService }, { type: i1.GlobalStateService }, { type: i5.NgbModal }, { type: i6.Router }, { type: i7.ToastService }], propDecorators: { dataEvent: [{
package/esm2022/lib/components/new-create-group/new-create-group.component.mjs CHANGED
@@ -179,10 +179,10 @@ export class NewCreateGroupComponent {
179
179
  form.controls.description.markAsTouched();
180
180
  }
181
181
  }
182
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: NewCreateGroupComponent, deps: [{ token: i1.NgbActiveModal }, { token: i0.ChangeDetectorRef }, { token: i2.GroupService }, { token: i3.ToastService }, { token: i4.GlobalStateService }], target: i0.ɵɵFactoryTarget.Component });
183
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: NewCreateGroupComponent, selector: "lib-new-create-group", inputs: { type: "type", editGroup: "editGroup" }, ngImport: i0, template: "<div class=\"card py-0 scroll-y\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"row w-100 mt-10\">\r\n <div *ngIf=\"operationType==='add'\" class=\"col-md-12\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Add\r\n Group</a>\r\n <div class=\"sub-title\">Please add your group details</div>\r\n </div>\r\n <div *ngIf=\"operationType==='edit'\" class=\"col-md-12\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Edit Group</a>\r\n <div class=\"sub-title\">Edit your group details</div>\r\n </div>\r\n <div *ngIf=\"operationType==='view'\" class=\"col-md-9\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">View Group</a>\r\n <div class=\"sub-title\">View your group details</div>\r\n </div>\r\n @if ((gs.userAccess | async)?.manage_stores_isEdit) {\r\n <div *ngIf=\"operationType==='view'\" class=\"col-md-3 text-end px-0\" (click)=\"editgroup()\">\r\n <button class=\"btn btn-outline\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3833_85908)\">\r\n <path\r\n d=\"M9.16602 3.3332H3.33268C2.89065 3.3332 2.46673 3.50879 2.15417 3.82135C1.84161 4.13391 1.66602 4.55784 1.66602 4.99986V16.6665C1.66602 17.1086 1.84161 17.5325 2.15417 17.845C2.46673 18.1576 2.89065 18.3332 3.33268 18.3332H14.9993C15.4414 18.3332 15.8653 18.1576 16.1779 17.845C16.4904 17.5325 16.666 17.1086 16.666 16.6665V10.8332M15.416 2.0832C15.7475 1.75168 16.1972 1.56543 16.666 1.56543C17.1349 1.56543 17.5845 1.75168 17.916 2.0832C18.2475 2.41472 18.4338 2.86436 18.4338 3.3332C18.4338 3.80204 18.2475 4.25168 17.916 4.5832L9.99935 12.4999L6.66602 13.3332L7.49935 9.99986L15.416 2.0832Z\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3833_85908\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></button>\r\n </div>\r\n }\r\n </div>\r\n\r\n <form #form=\"ngForm\" novalidate>\r\n <div class=\"row mt-5 mb-1\">\r\n <div class=\"col-md-12 col-lg-12 mb-5\">\r\n <label for=\"groupName\" class=\"form-label\">Group Name <span class=\"alert-required\">*</span></label>\r\n <input autocomplete=\"off\" type=\"text\" class=\"form-control\" id=\"groupName\" name=\"groupName\" [(ngModel)]=\"groupName\" required minlength=\"3\">\r\n <div *ngIf=\"form.submitted || form.controls.groupName?.touched\">\r\n <div *ngIf=\"form.controls.groupName?.errors?.required\" class=\"text-danger\">\r\n Group Name is required.\r\n </div>\r\n <div *ngIf=\"form.controls.groupName?.errors?.minlength\" class=\"text-danger\">\r\n Group Name must be at least 3 characters long.\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"col-md-12 mb-5\" >\r\n <label for=\"dataObject\" class=\"form-label\">Select Stores</label>\r\n <lib-select [items]=\"dataObject\" [multi]=\"true\" [searchField]=\"'storeName'\" [idField]=\"'storeId'\"\r\n (selected)=\"onCsmSelect($event)\" [selectedValues]=\"selectedValues\" ></lib-select>\r\n </div>\r\n <div class=\"col-md-12 col-lg-12 mb-5\">\r\n <label for=\"description\" class=\"form-label\">Description <span class=\"alert-required\">*</span></label>\r\n <textarea rows=\"5\" class=\"form-control\" id=\"description\" name=\"description\" [(ngModel)]=\"description\" required></textarea>\r\n <div *ngIf=\"form.submitted || form.controls.description?.touched\">\r\n <div *ngIf=\"form.controls.description?.errors?.required\" class=\"text-danger\">\r\n Description is required.\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"operationType !== 'view'\" role=\"group\" class=\"d-flex mt-3 mb-10\">\r\n <button type=\"button\" class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button type=\"submit\" id=\"alert-toast\" class=\"btn btn-primary w-100 ms-3\" [disabled]=\"form.invalid\"\r\n (click)=\"groupSubmit(form)\">Submit</button>\r\n </div>\r\n </div>\r\n </form>\r\n </div>\r\n</div>", styles: ["input.ng-invalid.ng-touched,textarea.ng-invalid.ng-touched{border-color:red}.title{color:var(--Gray-900, #101828)!important;font-size:18px!important;font-weight:600;line-height:28px}.sub-title{color:var(--Gray-500, #667085)!important;font-size:14px!important;font-weight:400!important;line-height:20px}::ng-deep .modal-content{border-radius:12px!important}.btn-outline{padding:12px!important;border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important}.dropdown1 .dropdown-title{color:var(--Gray-900, #101828);font-size:16px;font-weight:600;line-height:24px}.dropdown1 .dropdown{position:relative;display:inline-block}.dropdown1 .dropdown span{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}.dropdown1 .dropdown-content{z-index:1;padding:0;min-height:auto;max-height:285px;overflow:auto;border-radius:12px;background:var(--White, #FFF);box-shadow:0 8px 8px -4px #10182808,0 20px 24px -4px #10182814;width:89%}.dropdown1 .dropdown-content label{color:var(--Gray-700, #344054);font-size:14px;font-weight:500;line-height:20px}.dropdown1 .dropdown-content a{color:#000;padding:12px 16px;text-decoration:none;display:block}.dropdown1 .dropdown button{padding:10px;font-size:16px;cursor:pointer}.dropdown1 input[type=checkbox]{width:16px!important;height:16px!important;margin:-3px 5px;border-radius:4px!important;-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;appearance:none;outline:1px solid var(--gray-300, #D0D5DD);box-shadow:none;font-size:.8em;text-align:center;line-height:1em;background:#fff}.dropdown1 input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.dropdown1 input[type=checkbox]:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.2em;padding-left:0;padding-top:9px;padding-right:4px}.is-invalid{border-radius:8px!important;border:1px solid var(--Error-300, #FDA29B)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;padding-right:calc(1.5em + .75rem)!important;background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzIyMDFfMjA5NTApIj4KPHBhdGggZD0iTTcuOTk5NjcgNS4zMzM5OFY4LjAwMDY1TTcuOTk5NjcgMTAuNjY3M0g4LjAwNjM0TTE0LjY2NjMgOC4wMDA2NUMxNC42NjYzIDExLjY4MjYgMTEuNjgxNiAxNC42NjczIDcuOTk5NjcgMTQuNjY3M0M0LjMxNzc4IDE0LjY2NzMgMS4zMzMwMSAxMS42ODI2IDEuMzMzMDEgOC4wMDA2NUMxLjMzMzAxIDQuMzE4NzUgNC4zMTc3OCAxLjMzMzk4IDcuOTk5NjcgMS4zMzM5OEMxMS42ODE2IDEuMzMzOTggMTQuNjY2MyA0LjMxODc1IDE0LjY2NjMgOC4wMDA2NVoiIHN0cm9rZT0iI0YwNDQzOCIgc3Ryb2tlLXdpZHRoPSIxLjMzMzMzIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9nPgo8ZGVmcz4KPGNsaXBQYXRoIGlkPSJjbGlwMF8yMjAxXzIwOTUwIj4KPHJlY3Qgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2IiBmaWxsPSJ3aGl0ZSIvPgo8L2NsaXBQYXRoPgo8L2RlZnM+Cjwvc3ZnPgo=)!important;background-repeat:no-repeat!important;background-position:right calc(.375em + .1875rem) center!important;background-size:calc(.75em + .375rem) calc(.75em + .375rem)!important}small{color:var(--Error-500, #F04438)!important;font-size:13px!important;font-weight:400!important;line-height:20px}.alert-required{color:var(--Error-500, #F04438)!important;font-size:14px!important;font-weight:500!important;line-height:20px}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i6.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i6.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i6.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i6.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i6.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i3.CustomSelectComponent, selector: "lib-select", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label"], outputs: ["selected"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }] });
182
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: NewCreateGroupComponent, deps: [{ token: i1.NgbActiveModal }, { token: i0.ChangeDetectorRef }, { token: i2.GroupService }, { token: i3.ToastService }, { token: i4.GlobalStateService }], target: i0.ɵɵFactoryTarget.Component });
183
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: NewCreateGroupComponent, selector: "lib-new-create-group", inputs: { type: "type", editGroup: "editGroup" }, ngImport: i0, template: "<div class=\"card py-0 scroll-y\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"row w-100 mt-10\">\r\n <div *ngIf=\"operationType==='add'\" class=\"col-md-12\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Add\r\n Group</a>\r\n <div class=\"sub-title\">Please add your group details</div>\r\n </div>\r\n <div *ngIf=\"operationType==='edit'\" class=\"col-md-12\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Edit Group</a>\r\n <div class=\"sub-title\">Edit your group details</div>\r\n </div>\r\n <div *ngIf=\"operationType==='view'\" class=\"col-md-9\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">View Group</a>\r\n <div class=\"sub-title\">View your group details</div>\r\n </div>\r\n @if ((gs.userAccess | async)?.manage_stores_isEdit) {\r\n <div *ngIf=\"operationType==='view'\" class=\"col-md-3 text-end px-0\" (click)=\"editgroup()\">\r\n <button class=\"btn btn-outline\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3833_85908)\">\r\n <path\r\n d=\"M9.16602 3.3332H3.33268C2.89065 3.3332 2.46673 3.50879 2.15417 3.82135C1.84161 4.13391 1.66602 4.55784 1.66602 4.99986V16.6665C1.66602 17.1086 1.84161 17.5325 2.15417 17.845C2.46673 18.1576 2.89065 18.3332 3.33268 18.3332H14.9993C15.4414 18.3332 15.8653 18.1576 16.1779 17.845C16.4904 17.5325 16.666 17.1086 16.666 16.6665V10.8332M15.416 2.0832C15.7475 1.75168 16.1972 1.56543 16.666 1.56543C17.1349 1.56543 17.5845 1.75168 17.916 2.0832C18.2475 2.41472 18.4338 2.86436 18.4338 3.3332C18.4338 3.80204 18.2475 4.25168 17.916 4.5832L9.99935 12.4999L6.66602 13.3332L7.49935 9.99986L15.416 2.0832Z\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3833_85908\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></button>\r\n </div>\r\n }\r\n </div>\r\n\r\n <form #form=\"ngForm\" novalidate>\r\n <div class=\"row mt-5 mb-1\">\r\n <div class=\"col-md-12 col-lg-12 mb-5\">\r\n <label for=\"groupName\" class=\"form-label\">Group Name <span class=\"alert-required\">*</span></label>\r\n <input autocomplete=\"off\" type=\"text\" class=\"form-control\" id=\"groupName\" name=\"groupName\" [(ngModel)]=\"groupName\" required minlength=\"3\">\r\n <div *ngIf=\"form.submitted || form.controls.groupName?.touched\">\r\n <div *ngIf=\"form.controls.groupName?.errors?.required\" class=\"text-danger\">\r\n Group Name is required.\r\n </div>\r\n <div *ngIf=\"form.controls.groupName?.errors?.minlength\" class=\"text-danger\">\r\n Group Name must be at least 3 characters long.\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"col-md-12 mb-5\" >\r\n <label for=\"dataObject\" class=\"form-label\">Select Stores</label>\r\n <lib-select [items]=\"dataObject\" [multi]=\"true\" [searchField]=\"'storeName'\" [idField]=\"'storeId'\"\r\n (selected)=\"onCsmSelect($event)\" [selectedValues]=\"selectedValues\" ></lib-select>\r\n </div>\r\n <div class=\"col-md-12 col-lg-12 mb-5\">\r\n <label for=\"description\" class=\"form-label\">Description <span class=\"alert-required\">*</span></label>\r\n <textarea rows=\"5\" class=\"form-control\" id=\"description\" name=\"description\" [(ngModel)]=\"description\" required></textarea>\r\n <div *ngIf=\"form.submitted || form.controls.description?.touched\">\r\n <div *ngIf=\"form.controls.description?.errors?.required\" class=\"text-danger\">\r\n Description is required.\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"operationType !== 'view'\" role=\"group\" class=\"d-flex mt-3 mb-10\">\r\n <button type=\"button\" class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button type=\"submit\" id=\"alert-toast\" class=\"btn btn-primary w-100 ms-3\" [disabled]=\"form.invalid\"\r\n (click)=\"groupSubmit(form)\">Submit</button>\r\n </div>\r\n </div>\r\n </form>\r\n </div>\r\n</div>", styles: ["input.ng-invalid.ng-touched,textarea.ng-invalid.ng-touched{border-color:red}.title{color:var(--Gray-900, #101828)!important;font-size:18px!important;font-weight:600;line-height:28px}.sub-title{color:var(--Gray-500, #667085)!important;font-size:14px!important;font-weight:400!important;line-height:20px}::ng-deep .modal-content{border-radius:12px!important}.btn-outline{padding:12px!important;border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important}.dropdown1 .dropdown-title{color:var(--Gray-900, #101828);font-size:16px;font-weight:600;line-height:24px}.dropdown1 .dropdown{position:relative;display:inline-block}.dropdown1 .dropdown span{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}.dropdown1 .dropdown-content{z-index:1;padding:0;min-height:auto;max-height:285px;overflow:auto;border-radius:12px;background:var(--White, #FFF);box-shadow:0 8px 8px -4px #10182808,0 20px 24px -4px #10182814;width:89%}.dropdown1 .dropdown-content label{color:var(--Gray-700, #344054);font-size:14px;font-weight:500;line-height:20px}.dropdown1 .dropdown-content a{color:#000;padding:12px 16px;text-decoration:none;display:block}.dropdown1 .dropdown button{padding:10px;font-size:16px;cursor:pointer}.dropdown1 input[type=checkbox]{width:16px!important;height:16px!important;margin:-3px 5px;border-radius:4px!important;-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;appearance:none;outline:1px solid var(--gray-300, #D0D5DD);box-shadow:none;font-size:.8em;text-align:center;line-height:1em;background:#fff}.dropdown1 input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.dropdown1 input[type=checkbox]:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.2em;padding-left:0;padding-top:9px;padding-right:4px}.is-invalid{border-radius:8px!important;border:1px solid var(--Error-300, #FDA29B)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;padding-right:calc(1.5em + .75rem)!important;background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzIyMDFfMjA5NTApIj4KPHBhdGggZD0iTTcuOTk5NjcgNS4zMzM5OFY4LjAwMDY1TTcuOTk5NjcgMTAuNjY3M0g4LjAwNjM0TTE0LjY2NjMgOC4wMDA2NUMxNC42NjYzIDExLjY4MjYgMTEuNjgxNiAxNC42NjczIDcuOTk5NjcgMTQuNjY3M0M0LjMxNzc4IDE0LjY2NzMgMS4zMzMwMSAxMS42ODI2IDEuMzMzMDEgOC4wMDA2NUMxLjMzMzAxIDQuMzE4NzUgNC4zMTc3OCAxLjMzMzk4IDcuOTk5NjcgMS4zMzM5OEMxMS42ODE2IDEuMzMzOTggMTQuNjY2MyA0LjMxODc1IDE0LjY2NjMgOC4wMDA2NVoiIHN0cm9rZT0iI0YwNDQzOCIgc3Ryb2tlLXdpZHRoPSIxLjMzMzMzIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9nPgo8ZGVmcz4KPGNsaXBQYXRoIGlkPSJjbGlwMF8yMjAxXzIwOTUwIj4KPHJlY3Qgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2IiBmaWxsPSJ3aGl0ZSIvPgo8L2NsaXBQYXRoPgo8L2RlZnM+Cjwvc3ZnPgo=)!important;background-repeat:no-repeat!important;background-position:right calc(.375em + .1875rem) center!important;background-size:calc(.75em + .375rem) calc(.75em + .375rem)!important}small{color:var(--Error-500, #F04438)!important;font-size:13px!important;font-weight:400!important;line-height:20px}.alert-required{color:var(--Error-500, #F04438)!important;font-size:14px!important;font-weight:500!important;line-height:20px}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i6.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i6.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i6.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i6.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i6.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i3.CustomSelectComponent, selector: "lib-select", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label"], outputs: ["selected"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }] });
184
184
  }
185
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: NewCreateGroupComponent, decorators: [{
185
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: NewCreateGroupComponent, decorators: [{
186
186
  type: Component,
187
187
  args: [{ selector: 'lib-new-create-group', template: "<div class=\"card py-0 scroll-y\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"row w-100 mt-10\">\r\n <div *ngIf=\"operationType==='add'\" class=\"col-md-12\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Add\r\n Group</a>\r\n <div class=\"sub-title\">Please add your group details</div>\r\n </div>\r\n <div *ngIf=\"operationType==='edit'\" class=\"col-md-12\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Edit Group</a>\r\n <div class=\"sub-title\">Edit your group details</div>\r\n </div>\r\n <div *ngIf=\"operationType==='view'\" class=\"col-md-9\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">View Group</a>\r\n <div class=\"sub-title\">View your group details</div>\r\n </div>\r\n @if ((gs.userAccess | async)?.manage_stores_isEdit) {\r\n <div *ngIf=\"operationType==='view'\" class=\"col-md-3 text-end px-0\" (click)=\"editgroup()\">\r\n <button class=\"btn btn-outline\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3833_85908)\">\r\n <path\r\n d=\"M9.16602 3.3332H3.33268C2.89065 3.3332 2.46673 3.50879 2.15417 3.82135C1.84161 4.13391 1.66602 4.55784 1.66602 4.99986V16.6665C1.66602 17.1086 1.84161 17.5325 2.15417 17.845C2.46673 18.1576 2.89065 18.3332 3.33268 18.3332H14.9993C15.4414 18.3332 15.8653 18.1576 16.1779 17.845C16.4904 17.5325 16.666 17.1086 16.666 16.6665V10.8332M15.416 2.0832C15.7475 1.75168 16.1972 1.56543 16.666 1.56543C17.1349 1.56543 17.5845 1.75168 17.916 2.0832C18.2475 2.41472 18.4338 2.86436 18.4338 3.3332C18.4338 3.80204 18.2475 4.25168 17.916 4.5832L9.99935 12.4999L6.66602 13.3332L7.49935 9.99986L15.416 2.0832Z\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3833_85908\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></button>\r\n </div>\r\n }\r\n </div>\r\n\r\n <form #form=\"ngForm\" novalidate>\r\n <div class=\"row mt-5 mb-1\">\r\n <div class=\"col-md-12 col-lg-12 mb-5\">\r\n <label for=\"groupName\" class=\"form-label\">Group Name <span class=\"alert-required\">*</span></label>\r\n <input autocomplete=\"off\" type=\"text\" class=\"form-control\" id=\"groupName\" name=\"groupName\" [(ngModel)]=\"groupName\" required minlength=\"3\">\r\n <div *ngIf=\"form.submitted || form.controls.groupName?.touched\">\r\n <div *ngIf=\"form.controls.groupName?.errors?.required\" class=\"text-danger\">\r\n Group Name is required.\r\n </div>\r\n <div *ngIf=\"form.controls.groupName?.errors?.minlength\" class=\"text-danger\">\r\n Group Name must be at least 3 characters long.\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"col-md-12 mb-5\" >\r\n <label for=\"dataObject\" class=\"form-label\">Select Stores</label>\r\n <lib-select [items]=\"dataObject\" [multi]=\"true\" [searchField]=\"'storeName'\" [idField]=\"'storeId'\"\r\n (selected)=\"onCsmSelect($event)\" [selectedValues]=\"selectedValues\" ></lib-select>\r\n </div>\r\n <div class=\"col-md-12 col-lg-12 mb-5\">\r\n <label for=\"description\" class=\"form-label\">Description <span class=\"alert-required\">*</span></label>\r\n <textarea rows=\"5\" class=\"form-control\" id=\"description\" name=\"description\" [(ngModel)]=\"description\" required></textarea>\r\n <div *ngIf=\"form.submitted || form.controls.description?.touched\">\r\n <div *ngIf=\"form.controls.description?.errors?.required\" class=\"text-danger\">\r\n Description is required.\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"operationType !== 'view'\" role=\"group\" class=\"d-flex mt-3 mb-10\">\r\n <button type=\"button\" class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button type=\"submit\" id=\"alert-toast\" class=\"btn btn-primary w-100 ms-3\" [disabled]=\"form.invalid\"\r\n (click)=\"groupSubmit(form)\">Submit</button>\r\n </div>\r\n </div>\r\n </form>\r\n </div>\r\n</div>", styles: ["input.ng-invalid.ng-touched,textarea.ng-invalid.ng-touched{border-color:red}.title{color:var(--Gray-900, #101828)!important;font-size:18px!important;font-weight:600;line-height:28px}.sub-title{color:var(--Gray-500, #667085)!important;font-size:14px!important;font-weight:400!important;line-height:20px}::ng-deep .modal-content{border-radius:12px!important}.btn-outline{padding:12px!important;border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important}.dropdown1 .dropdown-title{color:var(--Gray-900, #101828);font-size:16px;font-weight:600;line-height:24px}.dropdown1 .dropdown{position:relative;display:inline-block}.dropdown1 .dropdown span{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}.dropdown1 .dropdown-content{z-index:1;padding:0;min-height:auto;max-height:285px;overflow:auto;border-radius:12px;background:var(--White, #FFF);box-shadow:0 8px 8px -4px #10182808,0 20px 24px -4px #10182814;width:89%}.dropdown1 .dropdown-content label{color:var(--Gray-700, #344054);font-size:14px;font-weight:500;line-height:20px}.dropdown1 .dropdown-content a{color:#000;padding:12px 16px;text-decoration:none;display:block}.dropdown1 .dropdown button{padding:10px;font-size:16px;cursor:pointer}.dropdown1 input[type=checkbox]{width:16px!important;height:16px!important;margin:-3px 5px;border-radius:4px!important;-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;appearance:none;outline:1px solid var(--gray-300, #D0D5DD);box-shadow:none;font-size:.8em;text-align:center;line-height:1em;background:#fff}.dropdown1 input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.dropdown1 input[type=checkbox]:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.2em;padding-left:0;padding-top:9px;padding-right:4px}.is-invalid{border-radius:8px!important;border:1px solid var(--Error-300, #FDA29B)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;padding-right:calc(1.5em + .75rem)!important;background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzIyMDFfMjA5NTApIj4KPHBhdGggZD0iTTcuOTk5NjcgNS4zMzM5OFY4LjAwMDY1TTcuOTk5NjcgMTAuNjY3M0g4LjAwNjM0TTE0LjY2NjMgOC4wMDA2NUMxNC42NjYzIDExLjY4MjYgMTEuNjgxNiAxNC42NjczIDcuOTk5NjcgMTQuNjY3M0M0LjMxNzc4IDE0LjY2NzMgMS4zMzMwMSAxMS42ODI2IDEuMzMzMDEgOC4wMDA2NUMxLjMzMzAxIDQuMzE4NzUgNC4zMTc3OCAxLjMzMzk4IDcuOTk5NjcgMS4zMzM5OEMxMS42ODE2IDEuMzMzOTggMTQuNjY2MyA0LjMxODc1IDE0LjY2NjMgOC4wMDA2NVoiIHN0cm9rZT0iI0YwNDQzOCIgc3Ryb2tlLXdpZHRoPSIxLjMzMzMzIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9nPgo8ZGVmcz4KPGNsaXBQYXRoIGlkPSJjbGlwMF8yMjAxXzIwOTUwIj4KPHJlY3Qgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2IiBmaWxsPSJ3aGl0ZSIvPgo8L2NsaXBQYXRoPgo8L2RlZnM+Cjwvc3ZnPgo=)!important;background-repeat:no-repeat!important;background-position:right calc(.375em + .1875rem) center!important;background-size:calc(.75em + .375rem) calc(.75em + .375rem)!important}small{color:var(--Error-500, #F04438)!important;font-size:13px!important;font-weight:400!important;line-height:20px}.alert-required{color:var(--Error-500, #F04438)!important;font-size:14px!important;font-weight:500!important;line-height:20px}\n"] }]
188
188
  }], ctorParameters: () => [{ type: i1.NgbActiveModal }, { type: i0.ChangeDetectorRef }, { type: i2.GroupService }, { type: i3.ToastService }, { type: i4.GlobalStateService }], propDecorators: { type: [{