tango-app-ui-store-ticket-infra 3.0.28-dev → 3.0.29-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 (13) hide show
  1. package/esm2022/lib/components/analyze-report/analyze-report.component.mjs +3 -3
  2. package/esm2022/lib/components/create-ticket/create-ticket.component.mjs +3 -3
  3. package/esm2022/lib/components/raise-ticket/raise-ticket.component.mjs +3 -3
  4. package/esm2022/lib/components/summary-infra/summary-infra.component.mjs +4 -4
  5. package/esm2022/lib/components/tango-store-infra/tango-store-infra.component.mjs +3 -3
  6. package/esm2022/lib/components/ticket-infra/ticket-infra.component.mjs +3 -3
  7. package/esm2022/lib/services/excel.service.mjs +3 -3
  8. package/esm2022/lib/services/tickets.service.mjs +3 -3
  9. package/esm2022/lib/tango-store-infra-routing.module.mjs +4 -4
  10. package/esm2022/lib/tango-store-infra.module.mjs +4 -4
  11. package/fesm2022/tango-app-ui-store-ticket-infra.mjs +33 -33
  12. package/fesm2022/tango-app-ui-store-ticket-infra.mjs.map +1 -1
  13. package/package.json +1 -1
package/esm2022/lib/components/analyze-report/analyze-report.component.mjs CHANGED
@@ -155,10 +155,10 @@ export class AnalyzeReportComponent {
155
155
  getDateFormat(date) {
156
156
  return this.dayjs(date).format('DD-MM-YYYY');
157
157
  }
158
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: AnalyzeReportComponent, deps: [{ token: i1.NgbModal }, { token: i1.NgbActiveModal }, { token: i2.TicketsService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
159
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.10", type: AnalyzeReportComponent, selector: "lib-analyze-report", inputs: { analyzereport: "analyzereport" }, viewQueries: [{ propertyName: "confirmationModal", first: true, predicate: ["confirmationModal"], descendants: true }, { propertyName: "ReconfirmationModal", first: true, predicate: ["ReconfirmationModal"], descendants: true }], 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=\"my-5\">\r\n <div class=\"symbol symbol-75px symbol-circle\">\r\n <img alt=\"Pic\" src=\"./assets/tango/Images/edgeapp icon.svg\">\r\n </div>\r\n </div>\r\n <div class=\"row w-100\">\r\n <div class=\"col-md-12\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Analyze Report</a>\r\n <div class=\"sub-title q-query-text\">Your Queries reported below stores are got {{analyzereport?.countType}} {{analyzereport?.filteredFeature}} on {{getDateFormat(selectedDate[0]?.date)}} to\r\n {{getDateFormat(selectedDate[selectedDate.length - 1]?.date)}}</div>\r\n </div>\r\n </div>\r\n <ul class=\"nav my-3 w-100 mt-5\">\r\n <li *ngFor=\"let date of selectedDate;let i=index\" class=\"nav-item\"><a data-bs-toggle=\"tab\" [ngClass]=\"activeDate === date?.date ? 'active':''\" (click)=\"handleClick(i)\" \r\n class=\"nav-link btn btn-sm btn-color-muted btn-active fw-bolder px-5 me-1 show\">\r\n {{getDateFormat(date?.date)}} <span *ngIf=\"activeDate === date?.date && !date?.isSelected\" class=\"mx-2\"><svg width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g style=\"mix-blend-mode:multiply\">\r\n <rect x=\"0.25\" width=\"20\" height=\"20\" rx=\"10\" fill=\"#EAF8FF\" />\r\n <g clip-path=\"url(#clip0_8713_10379)\">\r\n <path\r\n d=\"M10.25 8V10M10.25 12H10.255M15.25 10C15.25 12.7614 13.0114 15 10.25 15C7.48858 15 5.25 12.7614 5.25 10C5.25 7.23858 7.48858 5 10.25 5C13.0114 5 15.25 7.23858 15.25 10Z\"\r\n stroke=\"#33B5FF\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_8713_10379\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\" transform=\"translate(4.25 4)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n <span *ngIf=\"activeDate !== date?.date && !date?.isSelected\" class=\"mx-2\">\r\n <svg width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g style=\"mix-blend-mode:multiply\">\r\n <rect x=\"0.25\" width=\"20\" height=\"20\" rx=\"10\" fill=\"#F2F4F7\" />\r\n <g clip-path=\"url(#clip0_8713_10379)\">\r\n <path\r\n d=\"M10.25 8V10M10.25 12H10.255M15.25 10C15.25 12.7614 13.0114 15 10.25 15C7.48858 15 5.25 12.7614 5.25 10C5.25 7.23858 7.48858 5 10.25 5C13.0114 5 15.25 7.23858 15.25 10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_8713_10379\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\" transform=\"translate(4.25 4)\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n </a></li>\r\n </ul>\r\n <div *ngIf=\"!selectedDate[currentIdx].isSelected\" class=\"my-3 mt-5\">\r\n <img src=\"./assets/tango/custompopup-Icons/danger-icon.svg\">\r\n </div>\r\n <div *ngIf=\"selectedDate[currentIdx].isSelected\" class=\"my-3 mt-5\">\r\n <img style=\"width:50px; height:50px\" src=\"./assets/tango/Images/Successtoast.png\">\r\n </div>\r\n <div *ngIf=\"activeArray\" class=\"ul-list\">\r\n <ul>\r\n <li *ngIf=\"activeArray?.primaryIssue\" class=\"list-size my-3\">The primary issue was <span class=\"fw-bold-700\">{{activeArray?.primaryIssue}}</span> where\r\n the <span *ngFor=\"let data of activeArray?.secondaryReason let last = last\" class=\"fw-bold-700\">data <span *ngIf=\"!last\">,</span></span> was the secondary concern. </li>\r\n <li *ngIf=\"activeArray?.downTime > 0\" class=\"list-size my-3\">Store Experienced a downtime of <span class=\"fw-bold-700\">{{activeArray?.downTime}} mins</span>\r\n dated <span class=\"fw-bold-700\">{{activeArray?.issueDate}}</span> where \"N Files Lost\" and was unable to send to our\r\n cloud due to speed being <span class=\"fw-bold-700\">{{activeArray?.speedTest}} Mbps.</span> </li>\r\n <!-- <li class=\"list-size my-3\">We were able to capture only <span class=\"fw-bold-700\">100 Footfalls</span>\r\n despite the <span class=\"fw-bold-700\">Internet slow</span> issue </li> -->\r\n\r\n </ul>\r\n </div> \r\n </div>\r\n <div class=\"card-header border-0 d-flex justify-content-between\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span class=\"c-label fw-bolder fs-3 mb-1\">Tango Pre-Requisite <span *ngIf=\"activeArray?.primaryIssue\" class=\"badge badge-light-warning ms-2\">Warning</span></span>\r\n </h3>\r\n <div class=\"card-toolbar text-end\">\r\n <span class=\"list-size\">{{activeStream?.cameraNumber}}</span>\r\n </div>\r\n </div>\r\n <div class=\"row mx-5 px-2\"> \r\n <!-- <div class=\"rounded-2 overflow-hidden\">\r\n \r\n <span class=\"list-size\"> Camera Angle</span>\r\n <div class=\"mt-3\">\r\n <img *ngIf=\"angleChange && angleChange?.angleChangeImage\" class=\"w-100 mh-150px\" [src]=\"angleChange?.angleChangeImage ? angleChange?.angleChangeImage :activeStream?.thumbnailImage\" (error)=\"angleChange.angleChangeImage = null\">\r\n <img *ngIf=\"!angleChange?.angleChangeImage && activeStream?.thumbnailImage\" class=\"w-100 mh-150px\" [src]=\"angleChange?.angleChangeImage ? angleChange?.angleChangeImage :activeStream?.thumbnailImage\" (error)=\"activeStream.thumbnailImage = null\">\r\n </div>\r\n <div *ngIf=\"!activeStream?.thumbnailImage && !angleChange?.angleChangeImage\" class=\"w-100 h-200px rounded-3 overflow-hidden Nopreview align-content-center mt-3\">\r\n <div class=\"previewTitle text-center mb-5\">\r\n Preview not available\r\n </div>\r\n <div class=\"previewsubTitle fw-semibold\">\r\n The selected camera is not available at the moment.\r\n </div>\r\n </div>\r\n <div class=\"row p-0\" *ngIf=\"angleChange?.angleChangeImage\">\r\n <div class=\"col-md-6 m-0 pe-0\">\r\n <div class=\"d-flex justify-content-center align-items-center bg-light-primary py-3\">\r\n <span class=\"actualspan\">Expected</span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-6 m-0 ps-0\">\r\n <div class=\"d-flex justify-content-center align-items-center bg-light-primary py-3\">\r\n <span class=\"actualspan\">Actual</span>\r\n </div>\r\n </div>\r\n </div>\r\n </div> -->\r\n <div class=\"table-reponsive mt-5\">\r\n <table class=\"bottom-border w-100\">\r\n <thead>\r\n <tr>\r\n <th>Instances</th>\r\n <th class=\"text-center\">Excepted</th>\r\n <th class=\"text-center\">Actual</th>\r\n <th class=\"text-center\">Result</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr>\r\n <td>Camera Angle</td>\r\n <td *ngIf=\"angleChange\"><div class=\"align-content-center text-center align-items-center\">\r\n <img class=\"h-70px w-75 rounded-3\" [src]=\"angleChange?.expected\">\r\n </div></td>\r\n <td *ngIf=\"angleChange\"><div class=\"align-content-center text-center align-items-center\">\r\n <img class=\"h-70px w-75 rounded-3\" [src]=\"angleChange?.actual\">\r\n </div></td>\r\n <td *ngIf=\"!angleChange || !angleChange?.expected\">\r\n <div class=\"d-flex align-items-center text-align-center justify-content-center\">\r\n <div class=\"w-75 h-70px rounded-3 align-content-center Nopreview mt-3\">\r\n <div class=\"previewTitle text-center\">\r\n Preview not available\r\n </div>\r\n </div>\r\n </div>\r\n </td>\r\n <td *ngIf=\"!angleChange || !angleChange?.actual\">\r\n <div class=\"d-flex align-items-center text-align-center justify-content-center\">\r\n <div class=\"w-75 h-70px rounded-3 align-content-center Nopreview mt-3\">\r\n <div class=\"previewTitle text-center\">\r\n Preview not available\r\n </div>\r\n </div>\r\n </div>\r\n </td>\r\n <td *ngIf=\"!angleChange\" class=\"text-center\"><span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"25\" height=\"24\" viewBox=\"0 0 25 24\" fill=\"none\">\r\n <path d=\"M22.25 11.0799V11.9999C22.2488 14.1563 21.5505 16.2545 20.2593 17.9817C18.9682 19.7088 17.1533 20.9723 15.0854 21.5838C13.0174 22.1952 10.8073 22.1218 8.78447 21.3744C6.76168 20.6271 5.03465 19.246 3.86096 17.4369C2.68727 15.6279 2.12979 13.4879 2.27168 11.3362C2.41356 9.18443 3.24721 7.13619 4.64828 5.49694C6.04935 3.85768 7.94279 2.71525 10.0462 2.24001C12.1496 1.76477 14.3503 1.9822 16.32 2.85986M22.25 3.99986L12.25 14.0099L9.25001 11.0099\" stroke=\"#039855\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span></td>\r\n <td *ngIf=\"angleChange\" class=\"text-center\"><span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"33\" height=\"32\" viewBox=\"0 0 33 32\" fill=\"none\">\r\n <path d=\"M16.25 28.1905C22.9827 28.1905 28.4405 22.7327 28.4405 16C28.4405 9.26743 22.9827 3.80957 16.25 3.80957C9.51743 3.80957 4.05957 9.26743 4.05957 16C4.05957 22.7327 9.51743 28.1905 16.25 28.1905Z\" stroke=\"#D92D20\" stroke-width=\"1.52381\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n <path d=\"M11.6787 11.4287L20.8216 20.5716M20.8216 11.4287L11.6787 20.5716\" stroke=\"#D92D20\" stroke-width=\"1.52381\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span></td>\r\n </tr>\r\n <tr>\r\n <td>Resolution</td>\r\n <td class=\"text-center\">{{angleChange?.resolution ? angleChange?.resolution : '--'}}</td>\r\n <td class=\"text-center\">{{angleChange?.resolution ? angleChange?.resolution : '--'}}</td>\r\n <!-- <td *ngIf=\"angleChange?.anglechange\"><img src=\"./assets/tango/Image/verificationfailed.svg\"></td> -->\r\n <td class=\"text-center\"><span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"25\" height=\"24\" viewBox=\"0 0 25 24\" fill=\"none\">\r\n <path d=\"M22.25 11.0799V11.9999C22.2488 14.1563 21.5505 16.2545 20.2593 17.9817C18.9682 19.7088 17.1533 20.9723 15.0854 21.5838C13.0174 22.1952 10.8073 22.1218 8.78447 21.3744C6.76168 20.6271 5.03465 19.246 3.86096 17.4369C2.68727 15.6279 2.12979 13.4879 2.27168 11.3362C2.41356 9.18443 3.24721 7.13619 4.64828 5.49694C6.04935 3.85768 7.94279 2.71525 10.0462 2.24001C12.1496 1.76477 14.3503 1.9822 16.32 2.85986M22.25 3.99986L12.25 14.0099L9.25001 11.0099\" stroke=\"#039855\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span></td>\r\n </tr>\r\n <!-- <tr>\r\n <td>Downtime</td>\r\n <td>4.00 AM</td>\r\n <td>9.00 AM</td>\r\n <td><img src=\"./assets/tango/Image/verificationdanger.svg\"></td>\r\n </tr> -->\r\n </tbody>\r\n </table>\r\n <div *ngIf=\"streamDetails?.length\" class=\"d-flex justify-content-center align-items-center mt-10\">\r\n <div *ngFor=\"let stream of streamDetails\" [ngClass]=\"stream?.streamName === activeStream?.streamName? 'bg-dark' : 'bg-opacity-25'\" class=\"w-10px h-10px rounded-5 bg-dark cursor-pointer mx-3\" (click)=\"getstreambasedAngle(stream)\"></div>\r\n </div>\r\n <div class=\"card-header p-0 border-0 pt-5 d-flex justify-content-between\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span class=\"c-label-title mb-1\">Queries History</span>\r\n </h3>\r\n <div (click)=\"viewMore()\" class=\"card-toolbar text-end\">\r\n <span class=\"primary-list cursor-pointer text-decoration-underline\">View more Details</span>\r\n </div>\r\n </div>\r\n <div class=\"q-query-text\">From the date of installation till today the below queries success rate has been maintained</div>\r\n <div class=\"d-flex flex-wrap py-3\">\r\n <div class=\" min-w-125px py-3 me-6 mb-3\">\r\n <div class=\"h-history-count\">Total : <span class=\"h-history-title\">{{successRate?.total}} {{successRate?.total > 1 ? 'Tickets' : 'Ticket'}}</span></div>\r\n </div>\r\n <div *ngIf=\"successRate?.successRate !== 'null' && successRate?.successRate > 0 && successRate?.successRate !== ''\" class=\" min-w-125px py-3 px-4 me-6 mb-3\">\r\n <div class=\"h-history-count\">Success Rate : <span class=\"h-history-title\">{{successRate?.successRate}}%</span></div>\r\n </div>\r\n <!-- <div class=\" min-w-125px py-3 px-4 me-6 mb-3\">\r\n <div class=\"fw-bold fs-6 text-gray-500\">Earnings</div>\r\n <div class=\"d-flex align-items-center\">\r\n <div class=\"fs-2 fw-bolder\">4500$</div>\r\n </div>\r\n </div> -->\r\n </div>\r\n <div class=\"row mb-3\">\r\n <div class=\"col-12 text-end\">\r\n <button type=\"button\"\r\n class=\"btn btn-default mx-3 btn-outline btn-outline-default rounded-3 cursor-pointer \"\r\n (click)=\"raiseTicket()\">Raise a Ticket</button>\r\n <button *ngIf=\"(currentIdx + 1) !== selectedDate.length\" type=\"button\" class=\"btn btn-primary rounded-3\" (click)=\"closeTicket()\">Accept & Close</button>\r\n <button *ngIf=\"(currentIdx + 1) === selectedDate.length\" type=\"button\" class=\"btn btn-primary rounded-3\" (click)=\"openPopup()\">Close</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<ng-template #confirmationModal let-modal>\r\n <div class=\"p-8\">\r\n <div class=\"\">\r\n <img src=\"./assets/tango/custompopup-Icons/danger-icon.svg\">\r\n </div>\r\n <div class=\" mt-5\">\r\n <span class=\"cameraDetail fw-bold\">Unsaved Changes</span>\r\n <div class=\"mt-3 sub-header fw-bold-400\">Do you want to close the tickets?</div>\r\n </div>\r\n <div class=\"d-flex justify-content-between mt-10\">\r\n <button type=\"button\" class=\"btn btn-default btn-outline w-50 me-2\" (click)=\"modal.dismiss()\">Cancel</button>\r\n <button type=\"button\" class=\"btn btn-primary w-50 ms-2\" (click)=\"confirmSave();modal.close()\">Confirm</button>\r\n </div>\r\n </div>\r\n </ng-template>\r\n\r\n <ng-template #ReconfirmationModal let-modal>\r\n <div class=\"p-8\">\r\n <div class=\"\">\r\n <img src=\"./assets/tango/custompopup-Icons/danger-icon.svg\">\r\n </div>\r\n <div class=\" mt-5\">\r\n <span class=\"cameraDetail fw-bold\">Are you sure, want to view more details?</span>\r\n <div class=\"mt-3 sub-header fw-bold-400\">If so you will redirect to Queries summary & can\u2019t able to come back to the screen.</div>\r\n </div>\r\n <div class=\"d-flex justify-content-between mt-10\">\r\n <button type=\"button\" class=\"btn btn-default btn-outline w-50 me-2\" (click)=\"modal.dismiss()\">Cancel</button>\r\n <button type=\"button\" class=\"btn btn-primary w-50 ms-2\" (click)=\"confirmMore();modal.dismiss()\">Confirm</button>\r\n </div>\r\n </div>\r\n </ng-template>\r\n ", styles: [".nav-line-tabs1.nav-line-tabs-2x .nav-item .nav-link.active{border-radius:6px!important;background:var(--Primary-50, #EAF8FF)!important;padding:10px 14px!important;color:var(--Primary-700, #009BF3)!important}.nav-line-tabs1 .nav-link{color:var(--Gray-500, #667085)!important;font-size:16px;font-weight:500!important;line-height:24px}.daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .md-drppicker.drops-down-down.ltr.double.show-ranges.shown{left:0!important;height:350px}:host::ng-deep .md-drppicker td{border-radius:44px}:host::ng-deep .md-drppicker .btn{border-radius:7px!important;background-color:#019df5!important}:host::ng-deep .md-drppicker .btn{right:99px;top:300px}:host::ng-deep .md-drppicker .ranges ul li button.active{background-color:#029cf3!important}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important}.title{color:var(--Gray-900, #101828);font-size:20px;line-height:30px}.sub-title{color:var(--Gray-500, #667085);font-size:14px;line-height:20px}.border-val{padding:16px;border-radius:12px;border:1px solid var(--Gray-200, #EAECF0);background:#fff;box-shadow:0 0 20px #4c577d05}.role-title{color:var(--Primary-600, #00A3FF);font-size:16px;font-weight:600;line-height:24px;text-decoration-line:underline}.col-md-4{width:31%!important}.user-list{color:var(--Gray-700, #344054);font-size:16px;line-height:24px}.active{border-radius:6px!important;padding:8px 25px!important;background:var(--Primary-50, #EAF8FF)!important;color:var(--Primary-700, #009BF3)!important;font-size:14px!important;font-weight:500!important;line-height:20px}.list-size{color:var(--Gray-700, #344054)!important;font-size:16px!important;font-weight:500!important;line-height:24px!important}.fw-bold-700{font-weight:700!important}.c-label{color:var(--Gray-800, #1D2939)!important;font-size:16px!important;font-weight:500!important;line-height:24px}.c-label-title{color:#000!important;font-size:16px!important;font-weight:500;line-height:24px!important}.primary-list{color:var(--Primary-700, #009BF3)!important;font-size:12px!important;font-weight:600;line-height:18px;text-transform:capitalize}.h-history-title{color:var(--Gray-700, #344054)!important;font-size:16px!important;font-weight:500!important;line-height:24px!important}.h-history-count{color:var(--Gray-500, #667085)!important;font-size:16px!important;font-weight:500!important;line-height:24px!important}.q-query-text{color:var(--Gray-500, #667085)!important;font-size:14px!important;font-weight:400!important;line-height:20px}.cameraDetail{color:var(--Gray-900, #101828)!important;font-size:18px!important;line-height:28px!important}.sub-header{color:var(--Gray-500, #667085)!important;font-size:14px!important;line-height:20px}.actualspan{color:var(--Black, #101828);font-size:12px;font-weight:400;line-height:18px}.Nopreview{border:1px solid var(--Gray-500, #667085);background:var(--Gray-100, #F2F4F7);color:var(--Gray-500, #667085)}.Nopreview .previewTitle{font-size:10px;font-weight:700;line-height:20px}.Nopreview .previewsubTitle{text-align:center;font-size:12px;line-height:18px}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
158
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: AnalyzeReportComponent, deps: [{ token: i1.NgbModal }, { token: i1.NgbActiveModal }, { token: i2.TicketsService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
159
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: AnalyzeReportComponent, selector: "lib-analyze-report", inputs: { analyzereport: "analyzereport" }, viewQueries: [{ propertyName: "confirmationModal", first: true, predicate: ["confirmationModal"], descendants: true }, { propertyName: "ReconfirmationModal", first: true, predicate: ["ReconfirmationModal"], descendants: true }], 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=\"my-5\">\r\n <div class=\"symbol symbol-75px symbol-circle\">\r\n <img alt=\"Pic\" src=\"./assets/tango/Images/edgeapp icon.svg\">\r\n </div>\r\n </div>\r\n <div class=\"row w-100\">\r\n <div class=\"col-md-12\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Analyze Report</a>\r\n <div class=\"sub-title q-query-text\">Your Queries reported below stores are got {{analyzereport?.countType}} {{analyzereport?.filteredFeature}} on {{getDateFormat(selectedDate[0]?.date)}} to\r\n {{getDateFormat(selectedDate[selectedDate.length - 1]?.date)}}</div>\r\n </div>\r\n </div>\r\n <ul class=\"nav my-3 w-100 mt-5\">\r\n <li *ngFor=\"let date of selectedDate;let i=index\" class=\"nav-item\"><a data-bs-toggle=\"tab\" [ngClass]=\"activeDate === date?.date ? 'active':''\" (click)=\"handleClick(i)\" \r\n class=\"nav-link btn btn-sm btn-color-muted btn-active fw-bolder px-5 me-1 show\">\r\n {{getDateFormat(date?.date)}} <span *ngIf=\"activeDate === date?.date && !date?.isSelected\" class=\"mx-2\"><svg width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g style=\"mix-blend-mode:multiply\">\r\n <rect x=\"0.25\" width=\"20\" height=\"20\" rx=\"10\" fill=\"#EAF8FF\" />\r\n <g clip-path=\"url(#clip0_8713_10379)\">\r\n <path\r\n d=\"M10.25 8V10M10.25 12H10.255M15.25 10C15.25 12.7614 13.0114 15 10.25 15C7.48858 15 5.25 12.7614 5.25 10C5.25 7.23858 7.48858 5 10.25 5C13.0114 5 15.25 7.23858 15.25 10Z\"\r\n stroke=\"#33B5FF\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_8713_10379\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\" transform=\"translate(4.25 4)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n <span *ngIf=\"activeDate !== date?.date && !date?.isSelected\" class=\"mx-2\">\r\n <svg width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g style=\"mix-blend-mode:multiply\">\r\n <rect x=\"0.25\" width=\"20\" height=\"20\" rx=\"10\" fill=\"#F2F4F7\" />\r\n <g clip-path=\"url(#clip0_8713_10379)\">\r\n <path\r\n d=\"M10.25 8V10M10.25 12H10.255M15.25 10C15.25 12.7614 13.0114 15 10.25 15C7.48858 15 5.25 12.7614 5.25 10C5.25 7.23858 7.48858 5 10.25 5C13.0114 5 15.25 7.23858 15.25 10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_8713_10379\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\" transform=\"translate(4.25 4)\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n </a></li>\r\n </ul>\r\n <div *ngIf=\"!selectedDate[currentIdx].isSelected\" class=\"my-3 mt-5\">\r\n <img src=\"./assets/tango/custompopup-Icons/danger-icon.svg\">\r\n </div>\r\n <div *ngIf=\"selectedDate[currentIdx].isSelected\" class=\"my-3 mt-5\">\r\n <img style=\"width:50px; height:50px\" src=\"./assets/tango/Images/Successtoast.png\">\r\n </div>\r\n <div *ngIf=\"activeArray\" class=\"ul-list\">\r\n <ul>\r\n <li *ngIf=\"activeArray?.primaryIssue\" class=\"list-size my-3\">The primary issue was <span class=\"fw-bold-700\">{{activeArray?.primaryIssue}}</span> where\r\n the <span *ngFor=\"let data of activeArray?.secondaryReason let last = last\" class=\"fw-bold-700\">data <span *ngIf=\"!last\">,</span></span> was the secondary concern. </li>\r\n <li *ngIf=\"activeArray?.downTime > 0\" class=\"list-size my-3\">Store Experienced a downtime of <span class=\"fw-bold-700\">{{activeArray?.downTime}} mins</span>\r\n dated <span class=\"fw-bold-700\">{{activeArray?.issueDate}}</span> where \"N Files Lost\" and was unable to send to our\r\n cloud due to speed being <span class=\"fw-bold-700\">{{activeArray?.speedTest}} Mbps.</span> </li>\r\n <!-- <li class=\"list-size my-3\">We were able to capture only <span class=\"fw-bold-700\">100 Footfalls</span>\r\n despite the <span class=\"fw-bold-700\">Internet slow</span> issue </li> -->\r\n\r\n </ul>\r\n </div> \r\n </div>\r\n <div class=\"card-header border-0 d-flex justify-content-between\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span class=\"c-label fw-bolder fs-3 mb-1\">Tango Pre-Requisite <span *ngIf=\"activeArray?.primaryIssue\" class=\"badge badge-light-warning ms-2\">Warning</span></span>\r\n </h3>\r\n <div class=\"card-toolbar text-end\">\r\n <span class=\"list-size\">{{activeStream?.cameraNumber}}</span>\r\n </div>\r\n </div>\r\n <div class=\"row mx-5 px-2\"> \r\n <!-- <div class=\"rounded-2 overflow-hidden\">\r\n \r\n <span class=\"list-size\"> Camera Angle</span>\r\n <div class=\"mt-3\">\r\n <img *ngIf=\"angleChange && angleChange?.angleChangeImage\" class=\"w-100 mh-150px\" [src]=\"angleChange?.angleChangeImage ? angleChange?.angleChangeImage :activeStream?.thumbnailImage\" (error)=\"angleChange.angleChangeImage = null\">\r\n <img *ngIf=\"!angleChange?.angleChangeImage && activeStream?.thumbnailImage\" class=\"w-100 mh-150px\" [src]=\"angleChange?.angleChangeImage ? angleChange?.angleChangeImage :activeStream?.thumbnailImage\" (error)=\"activeStream.thumbnailImage = null\">\r\n </div>\r\n <div *ngIf=\"!activeStream?.thumbnailImage && !angleChange?.angleChangeImage\" class=\"w-100 h-200px rounded-3 overflow-hidden Nopreview align-content-center mt-3\">\r\n <div class=\"previewTitle text-center mb-5\">\r\n Preview not available\r\n </div>\r\n <div class=\"previewsubTitle fw-semibold\">\r\n The selected camera is not available at the moment.\r\n </div>\r\n </div>\r\n <div class=\"row p-0\" *ngIf=\"angleChange?.angleChangeImage\">\r\n <div class=\"col-md-6 m-0 pe-0\">\r\n <div class=\"d-flex justify-content-center align-items-center bg-light-primary py-3\">\r\n <span class=\"actualspan\">Expected</span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-6 m-0 ps-0\">\r\n <div class=\"d-flex justify-content-center align-items-center bg-light-primary py-3\">\r\n <span class=\"actualspan\">Actual</span>\r\n </div>\r\n </div>\r\n </div>\r\n </div> -->\r\n <div class=\"table-reponsive mt-5\">\r\n <table class=\"bottom-border w-100\">\r\n <thead>\r\n <tr>\r\n <th>Instances</th>\r\n <th class=\"text-center\">Excepted</th>\r\n <th class=\"text-center\">Actual</th>\r\n <th class=\"text-center\">Result</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr>\r\n <td>Camera Angle</td>\r\n <td *ngIf=\"angleChange\"><div class=\"align-content-center text-center align-items-center\">\r\n <img class=\"h-70px w-75 rounded-3\" [src]=\"angleChange?.expected\">\r\n </div></td>\r\n <td *ngIf=\"angleChange\"><div class=\"align-content-center text-center align-items-center\">\r\n <img class=\"h-70px w-75 rounded-3\" [src]=\"angleChange?.actual\">\r\n </div></td>\r\n <td *ngIf=\"!angleChange || !angleChange?.expected\">\r\n <div class=\"d-flex align-items-center text-align-center justify-content-center\">\r\n <div class=\"w-75 h-70px rounded-3 align-content-center Nopreview mt-3\">\r\n <div class=\"previewTitle text-center\">\r\n Preview not available\r\n </div>\r\n </div>\r\n </div>\r\n </td>\r\n <td *ngIf=\"!angleChange || !angleChange?.actual\">\r\n <div class=\"d-flex align-items-center text-align-center justify-content-center\">\r\n <div class=\"w-75 h-70px rounded-3 align-content-center Nopreview mt-3\">\r\n <div class=\"previewTitle text-center\">\r\n Preview not available\r\n </div>\r\n </div>\r\n </div>\r\n </td>\r\n <td *ngIf=\"!angleChange\" class=\"text-center\"><span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"25\" height=\"24\" viewBox=\"0 0 25 24\" fill=\"none\">\r\n <path d=\"M22.25 11.0799V11.9999C22.2488 14.1563 21.5505 16.2545 20.2593 17.9817C18.9682 19.7088 17.1533 20.9723 15.0854 21.5838C13.0174 22.1952 10.8073 22.1218 8.78447 21.3744C6.76168 20.6271 5.03465 19.246 3.86096 17.4369C2.68727 15.6279 2.12979 13.4879 2.27168 11.3362C2.41356 9.18443 3.24721 7.13619 4.64828 5.49694C6.04935 3.85768 7.94279 2.71525 10.0462 2.24001C12.1496 1.76477 14.3503 1.9822 16.32 2.85986M22.25 3.99986L12.25 14.0099L9.25001 11.0099\" stroke=\"#039855\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span></td>\r\n <td *ngIf=\"angleChange\" class=\"text-center\"><span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"33\" height=\"32\" viewBox=\"0 0 33 32\" fill=\"none\">\r\n <path d=\"M16.25 28.1905C22.9827 28.1905 28.4405 22.7327 28.4405 16C28.4405 9.26743 22.9827 3.80957 16.25 3.80957C9.51743 3.80957 4.05957 9.26743 4.05957 16C4.05957 22.7327 9.51743 28.1905 16.25 28.1905Z\" stroke=\"#D92D20\" stroke-width=\"1.52381\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n <path d=\"M11.6787 11.4287L20.8216 20.5716M20.8216 11.4287L11.6787 20.5716\" stroke=\"#D92D20\" stroke-width=\"1.52381\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span></td>\r\n </tr>\r\n <tr>\r\n <td>Resolution</td>\r\n <td class=\"text-center\">{{angleChange?.resolution ? angleChange?.resolution : '--'}}</td>\r\n <td class=\"text-center\">{{angleChange?.resolution ? angleChange?.resolution : '--'}}</td>\r\n <!-- <td *ngIf=\"angleChange?.anglechange\"><img src=\"./assets/tango/Image/verificationfailed.svg\"></td> -->\r\n <td class=\"text-center\"><span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"25\" height=\"24\" viewBox=\"0 0 25 24\" fill=\"none\">\r\n <path d=\"M22.25 11.0799V11.9999C22.2488 14.1563 21.5505 16.2545 20.2593 17.9817C18.9682 19.7088 17.1533 20.9723 15.0854 21.5838C13.0174 22.1952 10.8073 22.1218 8.78447 21.3744C6.76168 20.6271 5.03465 19.246 3.86096 17.4369C2.68727 15.6279 2.12979 13.4879 2.27168 11.3362C2.41356 9.18443 3.24721 7.13619 4.64828 5.49694C6.04935 3.85768 7.94279 2.71525 10.0462 2.24001C12.1496 1.76477 14.3503 1.9822 16.32 2.85986M22.25 3.99986L12.25 14.0099L9.25001 11.0099\" stroke=\"#039855\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span></td>\r\n </tr>\r\n <!-- <tr>\r\n <td>Downtime</td>\r\n <td>4.00 AM</td>\r\n <td>9.00 AM</td>\r\n <td><img src=\"./assets/tango/Image/verificationdanger.svg\"></td>\r\n </tr> -->\r\n </tbody>\r\n </table>\r\n <div *ngIf=\"streamDetails?.length\" class=\"d-flex justify-content-center align-items-center mt-10\">\r\n <div *ngFor=\"let stream of streamDetails\" [ngClass]=\"stream?.streamName === activeStream?.streamName? 'bg-dark' : 'bg-opacity-25'\" class=\"w-10px h-10px rounded-5 bg-dark cursor-pointer mx-3\" (click)=\"getstreambasedAngle(stream)\"></div>\r\n </div>\r\n <div class=\"card-header p-0 border-0 pt-5 d-flex justify-content-between\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span class=\"c-label-title mb-1\">Queries History</span>\r\n </h3>\r\n <div (click)=\"viewMore()\" class=\"card-toolbar text-end\">\r\n <span class=\"primary-list cursor-pointer text-decoration-underline\">View more Details</span>\r\n </div>\r\n </div>\r\n <div class=\"q-query-text\">From the date of installation till today the below queries success rate has been maintained</div>\r\n <div class=\"d-flex flex-wrap py-3\">\r\n <div class=\" min-w-125px py-3 me-6 mb-3\">\r\n <div class=\"h-history-count\">Total : <span class=\"h-history-title\">{{successRate?.total}} {{successRate?.total > 1 ? 'Tickets' : 'Ticket'}}</span></div>\r\n </div>\r\n <div *ngIf=\"successRate?.successRate !== 'null' && successRate?.successRate > 0 && successRate?.successRate !== ''\" class=\" min-w-125px py-3 px-4 me-6 mb-3\">\r\n <div class=\"h-history-count\">Success Rate : <span class=\"h-history-title\">{{successRate?.successRate}}%</span></div>\r\n </div>\r\n <!-- <div class=\" min-w-125px py-3 px-4 me-6 mb-3\">\r\n <div class=\"fw-bold fs-6 text-gray-500\">Earnings</div>\r\n <div class=\"d-flex align-items-center\">\r\n <div class=\"fs-2 fw-bolder\">4500$</div>\r\n </div>\r\n </div> -->\r\n </div>\r\n <div class=\"row mb-3\">\r\n <div class=\"col-12 text-end\">\r\n <button type=\"button\"\r\n class=\"btn btn-default mx-3 btn-outline btn-outline-default rounded-3 cursor-pointer \"\r\n (click)=\"raiseTicket()\">Raise a Ticket</button>\r\n <button *ngIf=\"(currentIdx + 1) !== selectedDate.length\" type=\"button\" class=\"btn btn-primary rounded-3\" (click)=\"closeTicket()\">Accept & Close</button>\r\n <button *ngIf=\"(currentIdx + 1) === selectedDate.length\" type=\"button\" class=\"btn btn-primary rounded-3\" (click)=\"openPopup()\">Close</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<ng-template #confirmationModal let-modal>\r\n <div class=\"p-8\">\r\n <div class=\"\">\r\n <img src=\"./assets/tango/custompopup-Icons/danger-icon.svg\">\r\n </div>\r\n <div class=\" mt-5\">\r\n <span class=\"cameraDetail fw-bold\">Unsaved Changes</span>\r\n <div class=\"mt-3 sub-header fw-bold-400\">Do you want to close the tickets?</div>\r\n </div>\r\n <div class=\"d-flex justify-content-between mt-10\">\r\n <button type=\"button\" class=\"btn btn-default btn-outline w-50 me-2\" (click)=\"modal.dismiss()\">Cancel</button>\r\n <button type=\"button\" class=\"btn btn-primary w-50 ms-2\" (click)=\"confirmSave();modal.close()\">Confirm</button>\r\n </div>\r\n </div>\r\n </ng-template>\r\n\r\n <ng-template #ReconfirmationModal let-modal>\r\n <div class=\"p-8\">\r\n <div class=\"\">\r\n <img src=\"./assets/tango/custompopup-Icons/danger-icon.svg\">\r\n </div>\r\n <div class=\" mt-5\">\r\n <span class=\"cameraDetail fw-bold\">Are you sure, want to view more details?</span>\r\n <div class=\"mt-3 sub-header fw-bold-400\">If so you will redirect to Queries summary & can\u2019t able to come back to the screen.</div>\r\n </div>\r\n <div class=\"d-flex justify-content-between mt-10\">\r\n <button type=\"button\" class=\"btn btn-default btn-outline w-50 me-2\" (click)=\"modal.dismiss()\">Cancel</button>\r\n <button type=\"button\" class=\"btn btn-primary w-50 ms-2\" (click)=\"confirmMore();modal.dismiss()\">Confirm</button>\r\n </div>\r\n </div>\r\n </ng-template>\r\n ", styles: [".nav-line-tabs1.nav-line-tabs-2x .nav-item .nav-link.active{border-radius:6px!important;background:var(--Primary-50, #EAF8FF)!important;padding:10px 14px!important;color:var(--Primary-700, #009BF3)!important}.nav-line-tabs1 .nav-link{color:var(--Gray-500, #667085)!important;font-size:16px;font-weight:500!important;line-height:24px}.daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .md-drppicker.drops-down-down.ltr.double.show-ranges.shown{left:0!important;height:350px}:host::ng-deep .md-drppicker td{border-radius:44px}:host::ng-deep .md-drppicker .btn{border-radius:7px!important;background-color:#019df5!important}:host::ng-deep .md-drppicker .btn{right:99px;top:300px}:host::ng-deep .md-drppicker .ranges ul li button.active{background-color:#029cf3!important}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important}.title{color:var(--Gray-900, #101828);font-size:20px;line-height:30px}.sub-title{color:var(--Gray-500, #667085);font-size:14px;line-height:20px}.border-val{padding:16px;border-radius:12px;border:1px solid var(--Gray-200, #EAECF0);background:#fff;box-shadow:0 0 20px #4c577d05}.role-title{color:var(--Primary-600, #00A3FF);font-size:16px;font-weight:600;line-height:24px;text-decoration-line:underline}.col-md-4{width:31%!important}.user-list{color:var(--Gray-700, #344054);font-size:16px;line-height:24px}.active{border-radius:6px!important;padding:8px 25px!important;background:var(--Primary-50, #EAF8FF)!important;color:var(--Primary-700, #009BF3)!important;font-size:14px!important;font-weight:500!important;line-height:20px}.list-size{color:var(--Gray-700, #344054)!important;font-size:16px!important;font-weight:500!important;line-height:24px!important}.fw-bold-700{font-weight:700!important}.c-label{color:var(--Gray-800, #1D2939)!important;font-size:16px!important;font-weight:500!important;line-height:24px}.c-label-title{color:#000!important;font-size:16px!important;font-weight:500;line-height:24px!important}.primary-list{color:var(--Primary-700, #009BF3)!important;font-size:12px!important;font-weight:600;line-height:18px;text-transform:capitalize}.h-history-title{color:var(--Gray-700, #344054)!important;font-size:16px!important;font-weight:500!important;line-height:24px!important}.h-history-count{color:var(--Gray-500, #667085)!important;font-size:16px!important;font-weight:500!important;line-height:24px!important}.q-query-text{color:var(--Gray-500, #667085)!important;font-size:14px!important;font-weight:400!important;line-height:20px}.cameraDetail{color:var(--Gray-900, #101828)!important;font-size:18px!important;line-height:28px!important}.sub-header{color:var(--Gray-500, #667085)!important;font-size:14px!important;line-height:20px}.actualspan{color:var(--Black, #101828);font-size:12px;font-weight:400;line-height:18px}.Nopreview{border:1px solid var(--Gray-500, #667085);background:var(--Gray-100, #F2F4F7);color:var(--Gray-500, #667085)}.Nopreview .previewTitle{font-size:10px;font-weight:700;line-height:20px}.Nopreview .previewsubTitle{text-align:center;font-size:12px;line-height:18px}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
160
160
  }
161
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: AnalyzeReportComponent, decorators: [{
161
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: AnalyzeReportComponent, decorators: [{
162
162
  type: Component,
163
163
  args: [{ selector: 'lib-analyze-report', 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=\"my-5\">\r\n <div class=\"symbol symbol-75px symbol-circle\">\r\n <img alt=\"Pic\" src=\"./assets/tango/Images/edgeapp icon.svg\">\r\n </div>\r\n </div>\r\n <div class=\"row w-100\">\r\n <div class=\"col-md-12\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Analyze Report</a>\r\n <div class=\"sub-title q-query-text\">Your Queries reported below stores are got {{analyzereport?.countType}} {{analyzereport?.filteredFeature}} on {{getDateFormat(selectedDate[0]?.date)}} to\r\n {{getDateFormat(selectedDate[selectedDate.length - 1]?.date)}}</div>\r\n </div>\r\n </div>\r\n <ul class=\"nav my-3 w-100 mt-5\">\r\n <li *ngFor=\"let date of selectedDate;let i=index\" class=\"nav-item\"><a data-bs-toggle=\"tab\" [ngClass]=\"activeDate === date?.date ? 'active':''\" (click)=\"handleClick(i)\" \r\n class=\"nav-link btn btn-sm btn-color-muted btn-active fw-bolder px-5 me-1 show\">\r\n {{getDateFormat(date?.date)}} <span *ngIf=\"activeDate === date?.date && !date?.isSelected\" class=\"mx-2\"><svg width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g style=\"mix-blend-mode:multiply\">\r\n <rect x=\"0.25\" width=\"20\" height=\"20\" rx=\"10\" fill=\"#EAF8FF\" />\r\n <g clip-path=\"url(#clip0_8713_10379)\">\r\n <path\r\n d=\"M10.25 8V10M10.25 12H10.255M15.25 10C15.25 12.7614 13.0114 15 10.25 15C7.48858 15 5.25 12.7614 5.25 10C5.25 7.23858 7.48858 5 10.25 5C13.0114 5 15.25 7.23858 15.25 10Z\"\r\n stroke=\"#33B5FF\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_8713_10379\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\" transform=\"translate(4.25 4)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n <span *ngIf=\"activeDate !== date?.date && !date?.isSelected\" class=\"mx-2\">\r\n <svg width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g style=\"mix-blend-mode:multiply\">\r\n <rect x=\"0.25\" width=\"20\" height=\"20\" rx=\"10\" fill=\"#F2F4F7\" />\r\n <g clip-path=\"url(#clip0_8713_10379)\">\r\n <path\r\n d=\"M10.25 8V10M10.25 12H10.255M15.25 10C15.25 12.7614 13.0114 15 10.25 15C7.48858 15 5.25 12.7614 5.25 10C5.25 7.23858 7.48858 5 10.25 5C13.0114 5 15.25 7.23858 15.25 10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.5\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_8713_10379\">\r\n <rect width=\"12\" height=\"12\" fill=\"white\" transform=\"translate(4.25 4)\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n </a></li>\r\n </ul>\r\n <div *ngIf=\"!selectedDate[currentIdx].isSelected\" class=\"my-3 mt-5\">\r\n <img src=\"./assets/tango/custompopup-Icons/danger-icon.svg\">\r\n </div>\r\n <div *ngIf=\"selectedDate[currentIdx].isSelected\" class=\"my-3 mt-5\">\r\n <img style=\"width:50px; height:50px\" src=\"./assets/tango/Images/Successtoast.png\">\r\n </div>\r\n <div *ngIf=\"activeArray\" class=\"ul-list\">\r\n <ul>\r\n <li *ngIf=\"activeArray?.primaryIssue\" class=\"list-size my-3\">The primary issue was <span class=\"fw-bold-700\">{{activeArray?.primaryIssue}}</span> where\r\n the <span *ngFor=\"let data of activeArray?.secondaryReason let last = last\" class=\"fw-bold-700\">data <span *ngIf=\"!last\">,</span></span> was the secondary concern. </li>\r\n <li *ngIf=\"activeArray?.downTime > 0\" class=\"list-size my-3\">Store Experienced a downtime of <span class=\"fw-bold-700\">{{activeArray?.downTime}} mins</span>\r\n dated <span class=\"fw-bold-700\">{{activeArray?.issueDate}}</span> where \"N Files Lost\" and was unable to send to our\r\n cloud due to speed being <span class=\"fw-bold-700\">{{activeArray?.speedTest}} Mbps.</span> </li>\r\n <!-- <li class=\"list-size my-3\">We were able to capture only <span class=\"fw-bold-700\">100 Footfalls</span>\r\n despite the <span class=\"fw-bold-700\">Internet slow</span> issue </li> -->\r\n\r\n </ul>\r\n </div> \r\n </div>\r\n <div class=\"card-header border-0 d-flex justify-content-between\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span class=\"c-label fw-bolder fs-3 mb-1\">Tango Pre-Requisite <span *ngIf=\"activeArray?.primaryIssue\" class=\"badge badge-light-warning ms-2\">Warning</span></span>\r\n </h3>\r\n <div class=\"card-toolbar text-end\">\r\n <span class=\"list-size\">{{activeStream?.cameraNumber}}</span>\r\n </div>\r\n </div>\r\n <div class=\"row mx-5 px-2\"> \r\n <!-- <div class=\"rounded-2 overflow-hidden\">\r\n \r\n <span class=\"list-size\"> Camera Angle</span>\r\n <div class=\"mt-3\">\r\n <img *ngIf=\"angleChange && angleChange?.angleChangeImage\" class=\"w-100 mh-150px\" [src]=\"angleChange?.angleChangeImage ? angleChange?.angleChangeImage :activeStream?.thumbnailImage\" (error)=\"angleChange.angleChangeImage = null\">\r\n <img *ngIf=\"!angleChange?.angleChangeImage && activeStream?.thumbnailImage\" class=\"w-100 mh-150px\" [src]=\"angleChange?.angleChangeImage ? angleChange?.angleChangeImage :activeStream?.thumbnailImage\" (error)=\"activeStream.thumbnailImage = null\">\r\n </div>\r\n <div *ngIf=\"!activeStream?.thumbnailImage && !angleChange?.angleChangeImage\" class=\"w-100 h-200px rounded-3 overflow-hidden Nopreview align-content-center mt-3\">\r\n <div class=\"previewTitle text-center mb-5\">\r\n Preview not available\r\n </div>\r\n <div class=\"previewsubTitle fw-semibold\">\r\n The selected camera is not available at the moment.\r\n </div>\r\n </div>\r\n <div class=\"row p-0\" *ngIf=\"angleChange?.angleChangeImage\">\r\n <div class=\"col-md-6 m-0 pe-0\">\r\n <div class=\"d-flex justify-content-center align-items-center bg-light-primary py-3\">\r\n <span class=\"actualspan\">Expected</span>\r\n </div>\r\n </div>\r\n <div class=\"col-md-6 m-0 ps-0\">\r\n <div class=\"d-flex justify-content-center align-items-center bg-light-primary py-3\">\r\n <span class=\"actualspan\">Actual</span>\r\n </div>\r\n </div>\r\n </div>\r\n </div> -->\r\n <div class=\"table-reponsive mt-5\">\r\n <table class=\"bottom-border w-100\">\r\n <thead>\r\n <tr>\r\n <th>Instances</th>\r\n <th class=\"text-center\">Excepted</th>\r\n <th class=\"text-center\">Actual</th>\r\n <th class=\"text-center\">Result</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr>\r\n <td>Camera Angle</td>\r\n <td *ngIf=\"angleChange\"><div class=\"align-content-center text-center align-items-center\">\r\n <img class=\"h-70px w-75 rounded-3\" [src]=\"angleChange?.expected\">\r\n </div></td>\r\n <td *ngIf=\"angleChange\"><div class=\"align-content-center text-center align-items-center\">\r\n <img class=\"h-70px w-75 rounded-3\" [src]=\"angleChange?.actual\">\r\n </div></td>\r\n <td *ngIf=\"!angleChange || !angleChange?.expected\">\r\n <div class=\"d-flex align-items-center text-align-center justify-content-center\">\r\n <div class=\"w-75 h-70px rounded-3 align-content-center Nopreview mt-3\">\r\n <div class=\"previewTitle text-center\">\r\n Preview not available\r\n </div>\r\n </div>\r\n </div>\r\n </td>\r\n <td *ngIf=\"!angleChange || !angleChange?.actual\">\r\n <div class=\"d-flex align-items-center text-align-center justify-content-center\">\r\n <div class=\"w-75 h-70px rounded-3 align-content-center Nopreview mt-3\">\r\n <div class=\"previewTitle text-center\">\r\n Preview not available\r\n </div>\r\n </div>\r\n </div>\r\n </td>\r\n <td *ngIf=\"!angleChange\" class=\"text-center\"><span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"25\" height=\"24\" viewBox=\"0 0 25 24\" fill=\"none\">\r\n <path d=\"M22.25 11.0799V11.9999C22.2488 14.1563 21.5505 16.2545 20.2593 17.9817C18.9682 19.7088 17.1533 20.9723 15.0854 21.5838C13.0174 22.1952 10.8073 22.1218 8.78447 21.3744C6.76168 20.6271 5.03465 19.246 3.86096 17.4369C2.68727 15.6279 2.12979 13.4879 2.27168 11.3362C2.41356 9.18443 3.24721 7.13619 4.64828 5.49694C6.04935 3.85768 7.94279 2.71525 10.0462 2.24001C12.1496 1.76477 14.3503 1.9822 16.32 2.85986M22.25 3.99986L12.25 14.0099L9.25001 11.0099\" stroke=\"#039855\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span></td>\r\n <td *ngIf=\"angleChange\" class=\"text-center\"><span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"33\" height=\"32\" viewBox=\"0 0 33 32\" fill=\"none\">\r\n <path d=\"M16.25 28.1905C22.9827 28.1905 28.4405 22.7327 28.4405 16C28.4405 9.26743 22.9827 3.80957 16.25 3.80957C9.51743 3.80957 4.05957 9.26743 4.05957 16C4.05957 22.7327 9.51743 28.1905 16.25 28.1905Z\" stroke=\"#D92D20\" stroke-width=\"1.52381\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n <path d=\"M11.6787 11.4287L20.8216 20.5716M20.8216 11.4287L11.6787 20.5716\" stroke=\"#D92D20\" stroke-width=\"1.52381\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span></td>\r\n </tr>\r\n <tr>\r\n <td>Resolution</td>\r\n <td class=\"text-center\">{{angleChange?.resolution ? angleChange?.resolution : '--'}}</td>\r\n <td class=\"text-center\">{{angleChange?.resolution ? angleChange?.resolution : '--'}}</td>\r\n <!-- <td *ngIf=\"angleChange?.anglechange\"><img src=\"./assets/tango/Image/verificationfailed.svg\"></td> -->\r\n <td class=\"text-center\"><span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"25\" height=\"24\" viewBox=\"0 0 25 24\" fill=\"none\">\r\n <path d=\"M22.25 11.0799V11.9999C22.2488 14.1563 21.5505 16.2545 20.2593 17.9817C18.9682 19.7088 17.1533 20.9723 15.0854 21.5838C13.0174 22.1952 10.8073 22.1218 8.78447 21.3744C6.76168 20.6271 5.03465 19.246 3.86096 17.4369C2.68727 15.6279 2.12979 13.4879 2.27168 11.3362C2.41356 9.18443 3.24721 7.13619 4.64828 5.49694C6.04935 3.85768 7.94279 2.71525 10.0462 2.24001C12.1496 1.76477 14.3503 1.9822 16.32 2.85986M22.25 3.99986L12.25 14.0099L9.25001 11.0099\" stroke=\"#039855\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg></span></td>\r\n </tr>\r\n <!-- <tr>\r\n <td>Downtime</td>\r\n <td>4.00 AM</td>\r\n <td>9.00 AM</td>\r\n <td><img src=\"./assets/tango/Image/verificationdanger.svg\"></td>\r\n </tr> -->\r\n </tbody>\r\n </table>\r\n <div *ngIf=\"streamDetails?.length\" class=\"d-flex justify-content-center align-items-center mt-10\">\r\n <div *ngFor=\"let stream of streamDetails\" [ngClass]=\"stream?.streamName === activeStream?.streamName? 'bg-dark' : 'bg-opacity-25'\" class=\"w-10px h-10px rounded-5 bg-dark cursor-pointer mx-3\" (click)=\"getstreambasedAngle(stream)\"></div>\r\n </div>\r\n <div class=\"card-header p-0 border-0 pt-5 d-flex justify-content-between\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span class=\"c-label-title mb-1\">Queries History</span>\r\n </h3>\r\n <div (click)=\"viewMore()\" class=\"card-toolbar text-end\">\r\n <span class=\"primary-list cursor-pointer text-decoration-underline\">View more Details</span>\r\n </div>\r\n </div>\r\n <div class=\"q-query-text\">From the date of installation till today the below queries success rate has been maintained</div>\r\n <div class=\"d-flex flex-wrap py-3\">\r\n <div class=\" min-w-125px py-3 me-6 mb-3\">\r\n <div class=\"h-history-count\">Total : <span class=\"h-history-title\">{{successRate?.total}} {{successRate?.total > 1 ? 'Tickets' : 'Ticket'}}</span></div>\r\n </div>\r\n <div *ngIf=\"successRate?.successRate !== 'null' && successRate?.successRate > 0 && successRate?.successRate !== ''\" class=\" min-w-125px py-3 px-4 me-6 mb-3\">\r\n <div class=\"h-history-count\">Success Rate : <span class=\"h-history-title\">{{successRate?.successRate}}%</span></div>\r\n </div>\r\n <!-- <div class=\" min-w-125px py-3 px-4 me-6 mb-3\">\r\n <div class=\"fw-bold fs-6 text-gray-500\">Earnings</div>\r\n <div class=\"d-flex align-items-center\">\r\n <div class=\"fs-2 fw-bolder\">4500$</div>\r\n </div>\r\n </div> -->\r\n </div>\r\n <div class=\"row mb-3\">\r\n <div class=\"col-12 text-end\">\r\n <button type=\"button\"\r\n class=\"btn btn-default mx-3 btn-outline btn-outline-default rounded-3 cursor-pointer \"\r\n (click)=\"raiseTicket()\">Raise a Ticket</button>\r\n <button *ngIf=\"(currentIdx + 1) !== selectedDate.length\" type=\"button\" class=\"btn btn-primary rounded-3\" (click)=\"closeTicket()\">Accept & Close</button>\r\n <button *ngIf=\"(currentIdx + 1) === selectedDate.length\" type=\"button\" class=\"btn btn-primary rounded-3\" (click)=\"openPopup()\">Close</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<ng-template #confirmationModal let-modal>\r\n <div class=\"p-8\">\r\n <div class=\"\">\r\n <img src=\"./assets/tango/custompopup-Icons/danger-icon.svg\">\r\n </div>\r\n <div class=\" mt-5\">\r\n <span class=\"cameraDetail fw-bold\">Unsaved Changes</span>\r\n <div class=\"mt-3 sub-header fw-bold-400\">Do you want to close the tickets?</div>\r\n </div>\r\n <div class=\"d-flex justify-content-between mt-10\">\r\n <button type=\"button\" class=\"btn btn-default btn-outline w-50 me-2\" (click)=\"modal.dismiss()\">Cancel</button>\r\n <button type=\"button\" class=\"btn btn-primary w-50 ms-2\" (click)=\"confirmSave();modal.close()\">Confirm</button>\r\n </div>\r\n </div>\r\n </ng-template>\r\n\r\n <ng-template #ReconfirmationModal let-modal>\r\n <div class=\"p-8\">\r\n <div class=\"\">\r\n <img src=\"./assets/tango/custompopup-Icons/danger-icon.svg\">\r\n </div>\r\n <div class=\" mt-5\">\r\n <span class=\"cameraDetail fw-bold\">Are you sure, want to view more details?</span>\r\n <div class=\"mt-3 sub-header fw-bold-400\">If so you will redirect to Queries summary & can\u2019t able to come back to the screen.</div>\r\n </div>\r\n <div class=\"d-flex justify-content-between mt-10\">\r\n <button type=\"button\" class=\"btn btn-default btn-outline w-50 me-2\" (click)=\"modal.dismiss()\">Cancel</button>\r\n <button type=\"button\" class=\"btn btn-primary w-50 ms-2\" (click)=\"confirmMore();modal.dismiss()\">Confirm</button>\r\n </div>\r\n </div>\r\n </ng-template>\r\n ", styles: [".nav-line-tabs1.nav-line-tabs-2x .nav-item .nav-link.active{border-radius:6px!important;background:var(--Primary-50, #EAF8FF)!important;padding:10px 14px!important;color:var(--Primary-700, #009BF3)!important}.nav-line-tabs1 .nav-link{color:var(--Gray-500, #667085)!important;font-size:16px;font-weight:500!important;line-height:24px}.daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .md-drppicker.drops-down-down.ltr.double.show-ranges.shown{left:0!important;height:350px}:host::ng-deep .md-drppicker td{border-radius:44px}:host::ng-deep .md-drppicker .btn{border-radius:7px!important;background-color:#019df5!important}:host::ng-deep .md-drppicker .btn{right:99px;top:300px}:host::ng-deep .md-drppicker .ranges ul li button.active{background-color:#029cf3!important}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important}.title{color:var(--Gray-900, #101828);font-size:20px;line-height:30px}.sub-title{color:var(--Gray-500, #667085);font-size:14px;line-height:20px}.border-val{padding:16px;border-radius:12px;border:1px solid var(--Gray-200, #EAECF0);background:#fff;box-shadow:0 0 20px #4c577d05}.role-title{color:var(--Primary-600, #00A3FF);font-size:16px;font-weight:600;line-height:24px;text-decoration-line:underline}.col-md-4{width:31%!important}.user-list{color:var(--Gray-700, #344054);font-size:16px;line-height:24px}.active{border-radius:6px!important;padding:8px 25px!important;background:var(--Primary-50, #EAF8FF)!important;color:var(--Primary-700, #009BF3)!important;font-size:14px!important;font-weight:500!important;line-height:20px}.list-size{color:var(--Gray-700, #344054)!important;font-size:16px!important;font-weight:500!important;line-height:24px!important}.fw-bold-700{font-weight:700!important}.c-label{color:var(--Gray-800, #1D2939)!important;font-size:16px!important;font-weight:500!important;line-height:24px}.c-label-title{color:#000!important;font-size:16px!important;font-weight:500;line-height:24px!important}.primary-list{color:var(--Primary-700, #009BF3)!important;font-size:12px!important;font-weight:600;line-height:18px;text-transform:capitalize}.h-history-title{color:var(--Gray-700, #344054)!important;font-size:16px!important;font-weight:500!important;line-height:24px!important}.h-history-count{color:var(--Gray-500, #667085)!important;font-size:16px!important;font-weight:500!important;line-height:24px!important}.q-query-text{color:var(--Gray-500, #667085)!important;font-size:14px!important;font-weight:400!important;line-height:20px}.cameraDetail{color:var(--Gray-900, #101828)!important;font-size:18px!important;line-height:28px!important}.sub-header{color:var(--Gray-500, #667085)!important;font-size:14px!important;line-height:20px}.actualspan{color:var(--Black, #101828);font-size:12px;font-weight:400;line-height:18px}.Nopreview{border:1px solid var(--Gray-500, #667085);background:var(--Gray-100, #F2F4F7);color:var(--Gray-500, #667085)}.Nopreview .previewTitle{font-size:10px;font-weight:700;line-height:20px}.Nopreview .previewsubTitle{text-align:center;font-size:12px;line-height:18px}\n"] }]
164
164
  }], ctorParameters: () => [{ type: i1.NgbModal }, { type: i1.NgbActiveModal }, { type: i2.TicketsService }, { type: i0.ChangeDetectorRef }], propDecorators: { analyzereport: [{
package/esm2022/lib/components/create-ticket/create-ticket.component.mjs CHANGED
@@ -189,10 +189,10 @@ export class CreateTicketComponent {
189
189
  this.emailError = 'Invalid email address';
190
190
  }
191
191
  }
192
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: CreateTicketComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.NgbModal }, { token: i1.NgbActiveModal }, { token: i2.TicketsService }], target: i0.ɵɵFactoryTarget.Component });
193
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.10", type: CreateTicketComponent, selector: "lib-create-ticket", inputs: { clientDetails: "clientDetails" }, host: { listeners: { "document:click": "onClick($event)" } }, ngImport: i0, template: "<div class=\"card py-0 scroll\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"row w-100 my-5\">\r\n <div class=\"col-md-12\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Support</a>\r\n <div class=\"sub-title mt-3\">Please fill the details for store analysis </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"row my-3 mt-2\">\r\n <div class=\"col-md-12 my-2\">\r\n <label class=\"form-label mb-1\">Select Date Range</label>\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <input class=\"fx-date-range form-control ps-14\" style=\"min-width: 260px !important;\" type=\"text\" matInput ngxDaterangepickerMd [drops]=\"'down'\"\r\n [opens]=\"'right'\" [showCustomRangeLabel]=\"false\" [alwaysShowCalendars]=\"false\"\r\n [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\" (startDateChanged)=\"onStartDateChange($event)\" [isCustomDate]=\"isCustomDate\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n (datesUpdated)=\"datechange($event)\" name=\"daterange\" [readonly]=\"true\" />\r\n </div>\r\n <p class=\"notes mt-3\">Note : Analysis restricted to last 4 days only. </p>\r\n </div>\r\n <div class=\"col-lg-6\">\r\n <div [ngClass]=\"countType === 'highcount' ? 'custom-container':'normal-container'\">\r\n <div class=\"icon-container\">\r\n <input type=\"radio\" id=\"highCount\" name=\"countType\" [(ngModel)]=\"countType\" value=\"highcount\" class=\"radio-input\" [ngClass]=\"{'high-dot': countType === 'highcount'}\">\r\n <label for=\"highCount\" class=\"radio-label\">\r\n <span [ngClass]=\"countType === 'highcount' ? 'text':'orval fw-semibold'\" class=\"text-nowrap fw-semibold\">High Count</span>\r\n </label>\r\n \r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-lg-6\">\r\n <div [ngClass]=\"countType === 'lowcount' ? 'custom-container':'normal-container'\">\r\n <div class=\"icon-container\">\r\n <input type=\"radio\" id=\"lowCount\" name=\"countType\" value=\"lowcount\" [(ngModel)]=\"countType\" class=\"radio-input\" [ngClass]=\"{'low-dot': countType === 'lowcount'}\">\r\n <label for=\"lowCount\" class=\"radio-label\">\r\n <span [ngClass]=\"countType === 'lowcount' ? 'text':'orval fw-semibold'\" class=\"text-nowrap\">Low Count</span>\r\n </label>\r\n \r\n </div>\r\n </div>\r\n </div> \r\n <div class=\"col-md-12 my-2 mt-5\">\r\n <label class=\"form-label mb-2\">Select Store</label>\r\n <div class=\"position-relative\">\r\n <button type=\"button\" (click)=\"openDropdown($event,'store')\"\r\n class=\"btn btn-default w-100 btn-outline btn-outline-default rounded-3 text-nowrap border-val d-flex justify-content-between selected fw-semibold bg-white\">\r\n {{filteredStore ? filteredStore : 'Select Store'}}\r\n <span class=\"ms-3\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"\r\n fill=\"none\">\r\n <path d=\"M5 7.5L10 12.5L15 7.5\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </button>\r\n <div *ngIf=\"dropDownStore\" class=\"card py-1 w-100 position-absolute top-50px end-0 z-1 dropdown-height\">\r\n <input type=\"text\" [(ngModel)]=\"searchData\" placeholder=\"Search...\" (input)=\"searchStore()\" class=\"form-control\">\r\n <ul *ngFor=\"let store of filteredItems\" class=\"list-unstyled mb-0\">\r\n <li [ngClass]=\"filteredStoreId === store?.storeId ? 'active' : ''\"\r\n class=\"camera px-5 items fw-semibold cursor-pointer py-2\" (click)=\"selectItem(store?.storeName,store?.storeId,'store')\">\r\n {{store?.storeName}}</li>\r\n </ul>\r\n </div>\r\n </div>\r\n <div class=\"col-md-12 my-2 mt-5\">\r\n <label class=\"form-label mb-2\">Select Feature</label>\r\n <div class=\"position-relative\">\r\n <button type=\"button\" (click)=\"openDropdown($event,'feature')\"\r\n class=\"btn btn-default w-100 btn-outline btn-outline-default rounded-3 text-nowrap border-val d-flex justify-content-between selected fw-semibold bg-white\">\r\n {{(filteredFeature ? filteredFeature : 'Select Feature') | titlecase}}\r\n <span class=\"ms-3\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"\r\n fill=\"none\">\r\n <path d=\"M5 7.5L10 12.5L15 7.5\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </button>\r\n <div *ngIf=\"dropDownFeature\" class=\"card py-1 w-100 position-absolute top-50px end-0 z-1 dropdown-height\">\r\n <ul *ngFor=\"let feature of Features\" class=\"list-unstyled mb-0\">\r\n <li [ngClass]=\"this.filteredFeature === feature ? 'active' : ''\"\r\n class=\"camera px-5 items fw-semibold cursor-pointer py-2\" (click)=\"selectItem(feature,'id','feature')\">\r\n {{feature}}</li>\r\n </ul>\r\n </div>\r\n </div>\r\n <div class=\"col-md-12 my-2 mt-5\">\r\n <label class=\"form-label mb-2\">Email</label>\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M18.3337 4.99992C18.3337 4.08325 17.5837 3.33325 16.667 3.33325H3.33366C2.41699 3.33325 1.66699 4.08325 1.66699 4.99992M18.3337 4.99992V14.9999C18.3337 15.9166 17.5837 16.6666 16.667 16.6666H3.33366C2.41699 16.6666 1.66699 15.9166 1.66699 14.9999V4.99992M18.3337 4.99992L10.0003 10.8333L1.66699 4.99992\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n </span>\r\n <input type=\"text\" style=\"text-transform:lowercase;\" class=\"form-control custom-form-control ps-14 me-2\" [(ngModel)]=\"email\" placeholder=\"Email\" aria-label=\"Email\" aria-describedby=\"basic-addon1\" (input)=\"emailValidation()\">\r\n </div>\r\n <div *ngIf=\"emailError\" class=\"text-danger mt-3\">\r\n {{ emailError }}\r\n </div>\r\n </div>\r\n <div class=\"d-flex my-5\" role=\"group\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button class=\"btn btn-primary w-100 ms-3\" id=\"alert-toast\" [disabled]=\"disablebtn || !filteredStore?.length || !filteredFeature.length \"\r\n (click)=\"onSubmit()\">Analyze</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", 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}.selected{color:var(--Gray-900, #101828);font-size:16px;line-height:24px}li{color:var(--Gray-700, #344054)!important;font-family:Inter;font-size:14px!important;font-weight:500!important;line-height:30px}.scroll{overflow-y:auto;overflow-x:hidden}.template{color:var(--Primary-700, #009BF3)!important;font-family:Inter;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}.orval{color:var(--Gray-700, #344054);font-size:14px;font-weight:500!important;line-height:20px}.single-user{color:var(--Gray-700, #344054);font-size:16px!important;line-height:24px;text-transform:capitalize}.form-label{color:var(--Gray-700, #344054);text-shadow:0px 0px 0px #D5EFFE,0px 1px 2px rgba(16,24,40,.05);font-size:14px;font-weight:500;line-height:20px}.form-control:focus{border-radius:8px;border:1px solid var(--Primary-300, #6BCAFF)!important;background:var(--White, #FFF)!important;box-shadow:0 0 0 4px #d5effe,0 1px 2px #1018280d!important}.font-sub{font-size:12px!important;line-height:18px!important}.accordion-item{color:var(--bs-accordion-color);background-color:var(--bs-accordion-bg);border:none!important}.divider{border-bottom:1px solid #D0D5DD;width:75%;margin-left:2%;background:var(--Gray-300, #D0D5DD)}input[type=checkbox]{width:20px!important;height:20px!important;margin: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}input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}input[type=checkbox]:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.5em;padding-left:0;padding-top:12px;padding-right:6px}.collapsed{display:none}.divider{border-right:1px solid #ccc;margin-left:10px;margin-right:10px}.notes{color:var(--Gray-500, #667085)!important;font-size:14px!important;font-weight:400;line-height:20px}.custom-container{padding:16px;background:#eaf8ff;border-radius:8px;border:1px #6BCAFF solid;display:flex;justify-content:flex-start;align-items:flex-start}.normal-container{padding:16px;background:#fff;border-radius:8px;border:1px solid var(--Gray-200, #EAECF0);display:flex;justify-content:flex-start;align-items:flex-start}.icon-container{flex:1 1 0;height:20px;display:flex;align-items:center;gap:8px}.icon{width:16px;height:16px;background:#eaf8ff;border-radius:8px;overflow:hidden;border:1px #00A3FF solid;display:flex;justify-content:center;align-items:center}.dot{width:6px;height:6px;position:absolute;background:#00a3ff;border-radius:9999px;left:5px;top:5px}.text-container{flex:1 1 0;flex-direction:column;display:flex;justify-content:flex-start;align-items:flex-start}.text{align-self:stretch;color:#008edf;font-size:14px;font-family:Inter;font-weight:500;line-height:20px;word-wrap:break-word}.radio-input{width:20px;height:20px}.items:hover,.tems.focus,.items.active,.camera.focus-visible{background:var(--Gray-50, #F9FAFB)}.daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}::ng-deep .applyBtn{display:none!important}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:0!important;height:400px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}.dropdown-height{min-height:auto!important;max-height:300px!important;overflow:auto!important}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.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: i4.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i5.DaterangepickerDirective, selector: "input[ngxDaterangepickerMd]", inputs: ["minDate", "maxDate", "autoApply", "alwaysShowCalendars", "showCustomRangeLabel", "linkedCalendars", "dateLimit", "singleDatePicker", "showWeekNumbers", "showISOWeekNumbers", "showDropdowns", "isInvalidDate", "isCustomDate", "isTooltipDate", "showClearButton", "customRangeDirection", "ranges", "opens", "drops", "firstMonthDayClass", "lastMonthDayClass", "emptyWeekRowClass", "emptyWeekColumnClass", "firstDayOfNextMonthClass", "lastDayOfPreviousMonthClass", "keepCalendarOpeningWithRange", "showRangeLabelOnInput", "showCancel", "lockStartDate", "timePicker", "timePicker24Hour", "timePickerIncrement", "timePickerSeconds", "closeOnAutoApply", "endKeyHolder", "startKey", "locale", "endKey"], outputs: ["change", "rangeClicked", "datesUpdated", "startDateChanged", "endDateChanged", "clearClicked"] }, { kind: "pipe", type: i3.TitleCasePipe, name: "titlecase" }] });
192
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: CreateTicketComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.NgbModal }, { token: i1.NgbActiveModal }, { token: i2.TicketsService }], target: i0.ɵɵFactoryTarget.Component });
193
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: CreateTicketComponent, selector: "lib-create-ticket", inputs: { clientDetails: "clientDetails" }, host: { listeners: { "document:click": "onClick($event)" } }, ngImport: i0, template: "<div class=\"card py-0 scroll\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"row w-100 my-5\">\r\n <div class=\"col-md-12\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Support</a>\r\n <div class=\"sub-title mt-3\">Please fill the details for store analysis </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"row my-3 mt-2\">\r\n <div class=\"col-md-12 my-2\">\r\n <label class=\"form-label mb-1\">Select Date Range</label>\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <input class=\"fx-date-range form-control ps-14\" style=\"min-width: 260px !important;\" type=\"text\" matInput ngxDaterangepickerMd [drops]=\"'down'\"\r\n [opens]=\"'right'\" [showCustomRangeLabel]=\"false\" [alwaysShowCalendars]=\"false\"\r\n [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\" (startDateChanged)=\"onStartDateChange($event)\" [isCustomDate]=\"isCustomDate\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n (datesUpdated)=\"datechange($event)\" name=\"daterange\" [readonly]=\"true\" />\r\n </div>\r\n <p class=\"notes mt-3\">Note : Analysis restricted to last 4 days only. </p>\r\n </div>\r\n <div class=\"col-lg-6\">\r\n <div [ngClass]=\"countType === 'highcount' ? 'custom-container':'normal-container'\">\r\n <div class=\"icon-container\">\r\n <input type=\"radio\" id=\"highCount\" name=\"countType\" [(ngModel)]=\"countType\" value=\"highcount\" class=\"radio-input\" [ngClass]=\"{'high-dot': countType === 'highcount'}\">\r\n <label for=\"highCount\" class=\"radio-label\">\r\n <span [ngClass]=\"countType === 'highcount' ? 'text':'orval fw-semibold'\" class=\"text-nowrap fw-semibold\">High Count</span>\r\n </label>\r\n \r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-lg-6\">\r\n <div [ngClass]=\"countType === 'lowcount' ? 'custom-container':'normal-container'\">\r\n <div class=\"icon-container\">\r\n <input type=\"radio\" id=\"lowCount\" name=\"countType\" value=\"lowcount\" [(ngModel)]=\"countType\" class=\"radio-input\" [ngClass]=\"{'low-dot': countType === 'lowcount'}\">\r\n <label for=\"lowCount\" class=\"radio-label\">\r\n <span [ngClass]=\"countType === 'lowcount' ? 'text':'orval fw-semibold'\" class=\"text-nowrap\">Low Count</span>\r\n </label>\r\n \r\n </div>\r\n </div>\r\n </div> \r\n <div class=\"col-md-12 my-2 mt-5\">\r\n <label class=\"form-label mb-2\">Select Store</label>\r\n <div class=\"position-relative\">\r\n <button type=\"button\" (click)=\"openDropdown($event,'store')\"\r\n class=\"btn btn-default w-100 btn-outline btn-outline-default rounded-3 text-nowrap border-val d-flex justify-content-between selected fw-semibold bg-white\">\r\n {{filteredStore ? filteredStore : 'Select Store'}}\r\n <span class=\"ms-3\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"\r\n fill=\"none\">\r\n <path d=\"M5 7.5L10 12.5L15 7.5\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </button>\r\n <div *ngIf=\"dropDownStore\" class=\"card py-1 w-100 position-absolute top-50px end-0 z-1 dropdown-height\">\r\n <input type=\"text\" [(ngModel)]=\"searchData\" placeholder=\"Search...\" (input)=\"searchStore()\" class=\"form-control\">\r\n <ul *ngFor=\"let store of filteredItems\" class=\"list-unstyled mb-0\">\r\n <li [ngClass]=\"filteredStoreId === store?.storeId ? 'active' : ''\"\r\n class=\"camera px-5 items fw-semibold cursor-pointer py-2\" (click)=\"selectItem(store?.storeName,store?.storeId,'store')\">\r\n {{store?.storeName}}</li>\r\n </ul>\r\n </div>\r\n </div>\r\n <div class=\"col-md-12 my-2 mt-5\">\r\n <label class=\"form-label mb-2\">Select Feature</label>\r\n <div class=\"position-relative\">\r\n <button type=\"button\" (click)=\"openDropdown($event,'feature')\"\r\n class=\"btn btn-default w-100 btn-outline btn-outline-default rounded-3 text-nowrap border-val d-flex justify-content-between selected fw-semibold bg-white\">\r\n {{(filteredFeature ? filteredFeature : 'Select Feature') | titlecase}}\r\n <span class=\"ms-3\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"\r\n fill=\"none\">\r\n <path d=\"M5 7.5L10 12.5L15 7.5\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </button>\r\n <div *ngIf=\"dropDownFeature\" class=\"card py-1 w-100 position-absolute top-50px end-0 z-1 dropdown-height\">\r\n <ul *ngFor=\"let feature of Features\" class=\"list-unstyled mb-0\">\r\n <li [ngClass]=\"this.filteredFeature === feature ? 'active' : ''\"\r\n class=\"camera px-5 items fw-semibold cursor-pointer py-2\" (click)=\"selectItem(feature,'id','feature')\">\r\n {{feature}}</li>\r\n </ul>\r\n </div>\r\n </div>\r\n <div class=\"col-md-12 my-2 mt-5\">\r\n <label class=\"form-label mb-2\">Email</label>\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M18.3337 4.99992C18.3337 4.08325 17.5837 3.33325 16.667 3.33325H3.33366C2.41699 3.33325 1.66699 4.08325 1.66699 4.99992M18.3337 4.99992V14.9999C18.3337 15.9166 17.5837 16.6666 16.667 16.6666H3.33366C2.41699 16.6666 1.66699 15.9166 1.66699 14.9999V4.99992M18.3337 4.99992L10.0003 10.8333L1.66699 4.99992\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n </span>\r\n <input type=\"text\" style=\"text-transform:lowercase;\" class=\"form-control custom-form-control ps-14 me-2\" [(ngModel)]=\"email\" placeholder=\"Email\" aria-label=\"Email\" aria-describedby=\"basic-addon1\" (input)=\"emailValidation()\">\r\n </div>\r\n <div *ngIf=\"emailError\" class=\"text-danger mt-3\">\r\n {{ emailError }}\r\n </div>\r\n </div>\r\n <div class=\"d-flex my-5\" role=\"group\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button class=\"btn btn-primary w-100 ms-3\" id=\"alert-toast\" [disabled]=\"disablebtn || !filteredStore?.length || !filteredFeature.length \"\r\n (click)=\"onSubmit()\">Analyze</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", 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}.selected{color:var(--Gray-900, #101828);font-size:16px;line-height:24px}li{color:var(--Gray-700, #344054)!important;font-family:Inter;font-size:14px!important;font-weight:500!important;line-height:30px}.scroll{overflow-y:auto;overflow-x:hidden}.template{color:var(--Primary-700, #009BF3)!important;font-family:Inter;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}.orval{color:var(--Gray-700, #344054);font-size:14px;font-weight:500!important;line-height:20px}.single-user{color:var(--Gray-700, #344054);font-size:16px!important;line-height:24px;text-transform:capitalize}.form-label{color:var(--Gray-700, #344054);text-shadow:0px 0px 0px #D5EFFE,0px 1px 2px rgba(16,24,40,.05);font-size:14px;font-weight:500;line-height:20px}.form-control:focus{border-radius:8px;border:1px solid var(--Primary-300, #6BCAFF)!important;background:var(--White, #FFF)!important;box-shadow:0 0 0 4px #d5effe,0 1px 2px #1018280d!important}.font-sub{font-size:12px!important;line-height:18px!important}.accordion-item{color:var(--bs-accordion-color);background-color:var(--bs-accordion-bg);border:none!important}.divider{border-bottom:1px solid #D0D5DD;width:75%;margin-left:2%;background:var(--Gray-300, #D0D5DD)}input[type=checkbox]{width:20px!important;height:20px!important;margin: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}input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}input[type=checkbox]:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.5em;padding-left:0;padding-top:12px;padding-right:6px}.collapsed{display:none}.divider{border-right:1px solid #ccc;margin-left:10px;margin-right:10px}.notes{color:var(--Gray-500, #667085)!important;font-size:14px!important;font-weight:400;line-height:20px}.custom-container{padding:16px;background:#eaf8ff;border-radius:8px;border:1px #6BCAFF solid;display:flex;justify-content:flex-start;align-items:flex-start}.normal-container{padding:16px;background:#fff;border-radius:8px;border:1px solid var(--Gray-200, #EAECF0);display:flex;justify-content:flex-start;align-items:flex-start}.icon-container{flex:1 1 0;height:20px;display:flex;align-items:center;gap:8px}.icon{width:16px;height:16px;background:#eaf8ff;border-radius:8px;overflow:hidden;border:1px #00A3FF solid;display:flex;justify-content:center;align-items:center}.dot{width:6px;height:6px;position:absolute;background:#00a3ff;border-radius:9999px;left:5px;top:5px}.text-container{flex:1 1 0;flex-direction:column;display:flex;justify-content:flex-start;align-items:flex-start}.text{align-self:stretch;color:#008edf;font-size:14px;font-family:Inter;font-weight:500;line-height:20px;word-wrap:break-word}.radio-input{width:20px;height:20px}.items:hover,.tems.focus,.items.active,.camera.focus-visible{background:var(--Gray-50, #F9FAFB)}.daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}::ng-deep .applyBtn{display:none!important}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:0!important;height:400px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}.dropdown-height{min-height:auto!important;max-height:300px!important;overflow:auto!important}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.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: i4.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i5.DaterangepickerDirective, selector: "input[ngxDaterangepickerMd]", inputs: ["minDate", "maxDate", "autoApply", "alwaysShowCalendars", "showCustomRangeLabel", "linkedCalendars", "dateLimit", "singleDatePicker", "showWeekNumbers", "showISOWeekNumbers", "showDropdowns", "isInvalidDate", "isCustomDate", "isTooltipDate", "showClearButton", "customRangeDirection", "ranges", "opens", "drops", "firstMonthDayClass", "lastMonthDayClass", "emptyWeekRowClass", "emptyWeekColumnClass", "firstDayOfNextMonthClass", "lastDayOfPreviousMonthClass", "keepCalendarOpeningWithRange", "showRangeLabelOnInput", "showCancel", "lockStartDate", "timePicker", "timePicker24Hour", "timePickerIncrement", "timePickerSeconds", "closeOnAutoApply", "endKeyHolder", "startKey", "locale", "endKey"], outputs: ["change", "rangeClicked", "datesUpdated", "startDateChanged", "endDateChanged", "clearClicked"] }, { kind: "pipe", type: i3.TitleCasePipe, name: "titlecase" }] });
194
194
  }
195
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: CreateTicketComponent, decorators: [{
195
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: CreateTicketComponent, decorators: [{
196
196
  type: Component,
197
197
  args: [{ selector: 'lib-create-ticket', template: "<div class=\"card py-0 scroll\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"row w-100 my-5\">\r\n <div class=\"col-md-12\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Support</a>\r\n <div class=\"sub-title mt-3\">Please fill the details for store analysis </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"row my-3 mt-2\">\r\n <div class=\"col-md-12 my-2\">\r\n <label class=\"form-label mb-1\">Select Date Range</label>\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <input class=\"fx-date-range form-control ps-14\" style=\"min-width: 260px !important;\" type=\"text\" matInput ngxDaterangepickerMd [drops]=\"'down'\"\r\n [opens]=\"'right'\" [showCustomRangeLabel]=\"false\" [alwaysShowCalendars]=\"false\"\r\n [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\" (startDateChanged)=\"onStartDateChange($event)\" [isCustomDate]=\"isCustomDate\"\r\n [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n (datesUpdated)=\"datechange($event)\" name=\"daterange\" [readonly]=\"true\" />\r\n </div>\r\n <p class=\"notes mt-3\">Note : Analysis restricted to last 4 days only. </p>\r\n </div>\r\n <div class=\"col-lg-6\">\r\n <div [ngClass]=\"countType === 'highcount' ? 'custom-container':'normal-container'\">\r\n <div class=\"icon-container\">\r\n <input type=\"radio\" id=\"highCount\" name=\"countType\" [(ngModel)]=\"countType\" value=\"highcount\" class=\"radio-input\" [ngClass]=\"{'high-dot': countType === 'highcount'}\">\r\n <label for=\"highCount\" class=\"radio-label\">\r\n <span [ngClass]=\"countType === 'highcount' ? 'text':'orval fw-semibold'\" class=\"text-nowrap fw-semibold\">High Count</span>\r\n </label>\r\n \r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-lg-6\">\r\n <div [ngClass]=\"countType === 'lowcount' ? 'custom-container':'normal-container'\">\r\n <div class=\"icon-container\">\r\n <input type=\"radio\" id=\"lowCount\" name=\"countType\" value=\"lowcount\" [(ngModel)]=\"countType\" class=\"radio-input\" [ngClass]=\"{'low-dot': countType === 'lowcount'}\">\r\n <label for=\"lowCount\" class=\"radio-label\">\r\n <span [ngClass]=\"countType === 'lowcount' ? 'text':'orval fw-semibold'\" class=\"text-nowrap\">Low Count</span>\r\n </label>\r\n \r\n </div>\r\n </div>\r\n </div> \r\n <div class=\"col-md-12 my-2 mt-5\">\r\n <label class=\"form-label mb-2\">Select Store</label>\r\n <div class=\"position-relative\">\r\n <button type=\"button\" (click)=\"openDropdown($event,'store')\"\r\n class=\"btn btn-default w-100 btn-outline btn-outline-default rounded-3 text-nowrap border-val d-flex justify-content-between selected fw-semibold bg-white\">\r\n {{filteredStore ? filteredStore : 'Select Store'}}\r\n <span class=\"ms-3\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"\r\n fill=\"none\">\r\n <path d=\"M5 7.5L10 12.5L15 7.5\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </button>\r\n <div *ngIf=\"dropDownStore\" class=\"card py-1 w-100 position-absolute top-50px end-0 z-1 dropdown-height\">\r\n <input type=\"text\" [(ngModel)]=\"searchData\" placeholder=\"Search...\" (input)=\"searchStore()\" class=\"form-control\">\r\n <ul *ngFor=\"let store of filteredItems\" class=\"list-unstyled mb-0\">\r\n <li [ngClass]=\"filteredStoreId === store?.storeId ? 'active' : ''\"\r\n class=\"camera px-5 items fw-semibold cursor-pointer py-2\" (click)=\"selectItem(store?.storeName,store?.storeId,'store')\">\r\n {{store?.storeName}}</li>\r\n </ul>\r\n </div>\r\n </div>\r\n <div class=\"col-md-12 my-2 mt-5\">\r\n <label class=\"form-label mb-2\">Select Feature</label>\r\n <div class=\"position-relative\">\r\n <button type=\"button\" (click)=\"openDropdown($event,'feature')\"\r\n class=\"btn btn-default w-100 btn-outline btn-outline-default rounded-3 text-nowrap border-val d-flex justify-content-between selected fw-semibold bg-white\">\r\n {{(filteredFeature ? filteredFeature : 'Select Feature') | titlecase}}\r\n <span class=\"ms-3\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"\r\n fill=\"none\">\r\n <path d=\"M5 7.5L10 12.5L15 7.5\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></span>\r\n </button>\r\n <div *ngIf=\"dropDownFeature\" class=\"card py-1 w-100 position-absolute top-50px end-0 z-1 dropdown-height\">\r\n <ul *ngFor=\"let feature of Features\" class=\"list-unstyled mb-0\">\r\n <li [ngClass]=\"this.filteredFeature === feature ? 'active' : ''\"\r\n class=\"camera px-5 items fw-semibold cursor-pointer py-2\" (click)=\"selectItem(feature,'id','feature')\">\r\n {{feature}}</li>\r\n </ul>\r\n </div>\r\n </div>\r\n <div class=\"col-md-12 my-2 mt-5\">\r\n <label class=\"form-label mb-2\">Email</label>\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M18.3337 4.99992C18.3337 4.08325 17.5837 3.33325 16.667 3.33325H3.33366C2.41699 3.33325 1.66699 4.08325 1.66699 4.99992M18.3337 4.99992V14.9999C18.3337 15.9166 17.5837 16.6666 16.667 16.6666H3.33366C2.41699 16.6666 1.66699 15.9166 1.66699 14.9999V4.99992M18.3337 4.99992L10.0003 10.8333L1.66699 4.99992\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n </span>\r\n <input type=\"text\" style=\"text-transform:lowercase;\" class=\"form-control custom-form-control ps-14 me-2\" [(ngModel)]=\"email\" placeholder=\"Email\" aria-label=\"Email\" aria-describedby=\"basic-addon1\" (input)=\"emailValidation()\">\r\n </div>\r\n <div *ngIf=\"emailError\" class=\"text-danger mt-3\">\r\n {{ emailError }}\r\n </div>\r\n </div>\r\n <div class=\"d-flex my-5\" role=\"group\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button class=\"btn btn-primary w-100 ms-3\" id=\"alert-toast\" [disabled]=\"disablebtn || !filteredStore?.length || !filteredFeature.length \"\r\n (click)=\"onSubmit()\">Analyze</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", 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}.selected{color:var(--Gray-900, #101828);font-size:16px;line-height:24px}li{color:var(--Gray-700, #344054)!important;font-family:Inter;font-size:14px!important;font-weight:500!important;line-height:30px}.scroll{overflow-y:auto;overflow-x:hidden}.template{color:var(--Primary-700, #009BF3)!important;font-family:Inter;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}.orval{color:var(--Gray-700, #344054);font-size:14px;font-weight:500!important;line-height:20px}.single-user{color:var(--Gray-700, #344054);font-size:16px!important;line-height:24px;text-transform:capitalize}.form-label{color:var(--Gray-700, #344054);text-shadow:0px 0px 0px #D5EFFE,0px 1px 2px rgba(16,24,40,.05);font-size:14px;font-weight:500;line-height:20px}.form-control:focus{border-radius:8px;border:1px solid var(--Primary-300, #6BCAFF)!important;background:var(--White, #FFF)!important;box-shadow:0 0 0 4px #d5effe,0 1px 2px #1018280d!important}.font-sub{font-size:12px!important;line-height:18px!important}.accordion-item{color:var(--bs-accordion-color);background-color:var(--bs-accordion-bg);border:none!important}.divider{border-bottom:1px solid #D0D5DD;width:75%;margin-left:2%;background:var(--Gray-300, #D0D5DD)}input[type=checkbox]{width:20px!important;height:20px!important;margin: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}input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}input[type=checkbox]:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.5em;padding-left:0;padding-top:12px;padding-right:6px}.collapsed{display:none}.divider{border-right:1px solid #ccc;margin-left:10px;margin-right:10px}.notes{color:var(--Gray-500, #667085)!important;font-size:14px!important;font-weight:400;line-height:20px}.custom-container{padding:16px;background:#eaf8ff;border-radius:8px;border:1px #6BCAFF solid;display:flex;justify-content:flex-start;align-items:flex-start}.normal-container{padding:16px;background:#fff;border-radius:8px;border:1px solid var(--Gray-200, #EAECF0);display:flex;justify-content:flex-start;align-items:flex-start}.icon-container{flex:1 1 0;height:20px;display:flex;align-items:center;gap:8px}.icon{width:16px;height:16px;background:#eaf8ff;border-radius:8px;overflow:hidden;border:1px #00A3FF solid;display:flex;justify-content:center;align-items:center}.dot{width:6px;height:6px;position:absolute;background:#00a3ff;border-radius:9999px;left:5px;top:5px}.text-container{flex:1 1 0;flex-direction:column;display:flex;justify-content:flex-start;align-items:flex-start}.text{align-self:stretch;color:#008edf;font-size:14px;font-family:Inter;font-weight:500;line-height:20px;word-wrap:break-word}.radio-input{width:20px;height:20px}.items:hover,.tems.focus,.items.active,.camera.focus-visible{background:var(--Gray-50, #F9FAFB)}.daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}::ng-deep .applyBtn{display:none!important}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:0!important;height:400px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}.dropdown-height{min-height:auto!important;max-height:300px!important;overflow:auto!important}\n"] }]
198
198
  }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1.NgbModal }, { type: i1.NgbActiveModal }, { type: i2.TicketsService }], propDecorators: { clientDetails: [{
package/esm2022/lib/components/raise-ticket/raise-ticket.component.mjs CHANGED
@@ -97,10 +97,10 @@ export class RaiseTicketComponent {
97
97
  dateFormat(date) {
98
98
  return this.dayjs(date).format('DD-MM-YYYY');
99
99
  }
100
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: RaiseTicketComponent, deps: [{ token: i1.NgbModal }, { token: i1.NgbActiveModal }, { token: i2.FormBuilder }, { token: i3.TicketsService }, { token: i4.ToastService }, { token: i5.Router }], target: i0.ɵɵFactoryTarget.Component });
101
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.10", type: RaiseTicketComponent, selector: "lib-raise-ticket", inputs: { data: "data" }, viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }, { propertyName: "createTicket", first: true, predicate: ["createTicket"], descendants: true }], ngImport: i0, template: "<div class=\"card py-0 scroll\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"row w-100 my-5\">\r\n <div class=\"col-md-12\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Raise Ticket</a>\r\n <div class=\"my-2\"><span class=\"sub-title\">For Store {{data?.storeName}} on</span> <span class=\"sub-title1 ms-2\">{{dateFormat(this.data?.date)}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <form [formGroup]=\"raiseTicket\" class=\"row my-3\">\r\n <div class=\"col-md-6 my-3\">\r\n <label class=\"form-label\">Actual Billing Count</label>\r\n <input type=\"text\" formControlName=\"actualBilling\" (keypress)=\"omit_special_char($event)\" class=\"form-control\">\r\n </div>\r\n <div class=\"col-md-6 my-3\">\r\n <label class=\"form-label\">Your Expected Footfall</label>\r\n <input type=\"text\" formControlName=\"expectedFootfall\" (keypress)=\"omit_special_char($event)\" class=\"form-control\">\r\n </div>\r\n <div class=\"col-md-12 my-3\">\r\n <textarea class=\"type\" formControlName=\"description\" row=\"3\" class=\"form-control\" placeholder=\"Enter a description...\"></textarea>\r\n </div>\r\n <div class=\"col-md-12 my-3\">\r\n <span > <input type=\"file\" formControlName=\"filePath\" #fileInput style=\"display: none;\" accept=\"image/*\" (change)=\"onFileSelected($event)\">\r\n <button (click)=\"openFileInput()\" class=\"cursor-pointer btn btn-default p-0\"><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.8666 9.20835L10.2082 16.8667C9.27005 17.8049 7.99757 18.332 6.67075 18.332C5.34393 18.332 4.07145 17.8049 3.13325 16.8667C2.19505 15.9285 1.66797 14.656 1.66797 13.3292C1.66797 12.0024 2.19505 10.7299 3.13325 9.79168L10.7916 2.13335C11.4171 1.50788 12.2654 1.15649 13.1499 1.15649C14.0345 1.15649 14.8828 1.50788 15.5082 2.13335C16.1337 2.75882 16.4851 3.60713 16.4851 4.49168C16.4851 5.37623 16.1337 6.22455 15.5082 6.85002L7.84158 14.5083C7.52885 14.8211 7.10469 14.9968 6.66242 14.9968C6.22014 14.9968 5.79598 14.8211 5.48325 14.5083C5.17051 14.1956 4.99482 13.7715 4.99482 13.3292C4.99482 12.8869 5.17051 12.4627 5.48325 12.15L12.5582 5.08335\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"mx-2 sub-title text-capitalize\">{{fileName ? fileName : 'Attachments'}}</span></button></span>\r\n </div>\r\n <div class=\"text-danger\" *ngIf=\"errorMessage\">{{ errorMessage }}</div>\r\n <div class=\"d-flex my-5\" role=\"group\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"activeModal.close()\" >Cancel</button>\r\n <button class=\"btn btn-primary w-100 ms-3\" [disabled]=\"!raiseTicket.valid\" id=\"alert-toast\" (click)=\"submitTicket();activeModal.close(true)\"\r\n >Submit</button>\r\n </div>\r\n </form>\r\n \r\n </div>\r\n</div>\r\n\r\n<ng-template #createTicket let-modal>\r\n <div class=\"p-8\">\r\n <div class=\"\">\r\n <img src=\"./assets/tango/Images/Successtoast.png\">\r\n </div> \r\n <div class=\"mt-5 ticketData\">\r\n <span class=\"camera fw-bold\">Ticket Created Successfully</span>\r\n <div class=\"mt-3 sub-header fw-bold-400\">your ticket for {{dateFormat(this.data?.date)}} have been created successful !</div>\r\n </div>\r\n <div class=\"d-flex justify-content-between mt-10\">\r\n <button type=\"button\" class=\"btn btn-default btn-primary w-100 me-2\" (click)=\"redirectToTickets();modal.dismiss()\">Okay</button>\r\n </div>\r\n </div>\r\n </ng-template>\r\n", styles: [".camera{color:var(--Gray-900, #101828)!important;font-size:18px!important;line-height:28px!important}.sub-header{color:var(--Gray-500, #667085)!important;font-size:14px!important;line-height:20px}.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;line-height:20px}.sub-title1{color:var(--Gray-500, #667085)!important;font-size:14px!important;font-weight:700;line-height:20px}\n"], dependencies: [{ 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.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] });
100
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: RaiseTicketComponent, deps: [{ token: i1.NgbModal }, { token: i1.NgbActiveModal }, { token: i2.FormBuilder }, { token: i3.TicketsService }, { token: i4.ToastService }, { token: i5.Router }], target: i0.ɵɵFactoryTarget.Component });
101
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: RaiseTicketComponent, selector: "lib-raise-ticket", inputs: { data: "data" }, viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }, { propertyName: "createTicket", first: true, predicate: ["createTicket"], descendants: true }], ngImport: i0, template: "<div class=\"card py-0 scroll\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"row w-100 my-5\">\r\n <div class=\"col-md-12\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Raise Ticket</a>\r\n <div class=\"my-2\"><span class=\"sub-title\">For Store {{data?.storeName}} on</span> <span class=\"sub-title1 ms-2\">{{dateFormat(this.data?.date)}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <form [formGroup]=\"raiseTicket\" class=\"row my-3\">\r\n <div class=\"col-md-6 my-3\">\r\n <label class=\"form-label\">Actual Billing Count</label>\r\n <input type=\"text\" formControlName=\"actualBilling\" (keypress)=\"omit_special_char($event)\" class=\"form-control\">\r\n </div>\r\n <div class=\"col-md-6 my-3\">\r\n <label class=\"form-label\">Your Expected Footfall</label>\r\n <input type=\"text\" formControlName=\"expectedFootfall\" (keypress)=\"omit_special_char($event)\" class=\"form-control\">\r\n </div>\r\n <div class=\"col-md-12 my-3\">\r\n <textarea class=\"type\" formControlName=\"description\" row=\"3\" class=\"form-control\" placeholder=\"Enter a description...\"></textarea>\r\n </div>\r\n <div class=\"col-md-12 my-3\">\r\n <span > <input type=\"file\" formControlName=\"filePath\" #fileInput style=\"display: none;\" accept=\"image/*\" (change)=\"onFileSelected($event)\">\r\n <button (click)=\"openFileInput()\" class=\"cursor-pointer btn btn-default p-0\"><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.8666 9.20835L10.2082 16.8667C9.27005 17.8049 7.99757 18.332 6.67075 18.332C5.34393 18.332 4.07145 17.8049 3.13325 16.8667C2.19505 15.9285 1.66797 14.656 1.66797 13.3292C1.66797 12.0024 2.19505 10.7299 3.13325 9.79168L10.7916 2.13335C11.4171 1.50788 12.2654 1.15649 13.1499 1.15649C14.0345 1.15649 14.8828 1.50788 15.5082 2.13335C16.1337 2.75882 16.4851 3.60713 16.4851 4.49168C16.4851 5.37623 16.1337 6.22455 15.5082 6.85002L7.84158 14.5083C7.52885 14.8211 7.10469 14.9968 6.66242 14.9968C6.22014 14.9968 5.79598 14.8211 5.48325 14.5083C5.17051 14.1956 4.99482 13.7715 4.99482 13.3292C4.99482 12.8869 5.17051 12.4627 5.48325 12.15L12.5582 5.08335\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"mx-2 sub-title text-capitalize\">{{fileName ? fileName : 'Attachments'}}</span></button></span>\r\n </div>\r\n <div class=\"text-danger\" *ngIf=\"errorMessage\">{{ errorMessage }}</div>\r\n <div class=\"d-flex my-5\" role=\"group\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"activeModal.close()\" >Cancel</button>\r\n <button class=\"btn btn-primary w-100 ms-3\" [disabled]=\"!raiseTicket.valid\" id=\"alert-toast\" (click)=\"submitTicket();activeModal.close(true)\"\r\n >Submit</button>\r\n </div>\r\n </form>\r\n \r\n </div>\r\n</div>\r\n\r\n<ng-template #createTicket let-modal>\r\n <div class=\"p-8\">\r\n <div class=\"\">\r\n <img src=\"./assets/tango/Images/Successtoast.png\">\r\n </div> \r\n <div class=\"mt-5 ticketData\">\r\n <span class=\"camera fw-bold\">Ticket Created Successfully</span>\r\n <div class=\"mt-3 sub-header fw-bold-400\">your ticket for {{dateFormat(this.data?.date)}} have been created successful !</div>\r\n </div>\r\n <div class=\"d-flex justify-content-between mt-10\">\r\n <button type=\"button\" class=\"btn btn-default btn-primary w-100 me-2\" (click)=\"redirectToTickets();modal.dismiss()\">Okay</button>\r\n </div>\r\n </div>\r\n </ng-template>\r\n", styles: [".camera{color:var(--Gray-900, #101828)!important;font-size:18px!important;line-height:28px!important}.sub-header{color:var(--Gray-500, #667085)!important;font-size:14px!important;line-height:20px}.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;line-height:20px}.sub-title1{color:var(--Gray-500, #667085)!important;font-size:14px!important;font-weight:700;line-height:20px}\n"], dependencies: [{ 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.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] });
102
102
  }
103
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: RaiseTicketComponent, decorators: [{
103
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: RaiseTicketComponent, decorators: [{
104
104
  type: Component,
105
105
  args: [{ selector: 'lib-raise-ticket', template: "<div class=\"card py-0 scroll\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"row w-100 my-5\">\r\n <div class=\"col-md-12\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Raise Ticket</a>\r\n <div class=\"my-2\"><span class=\"sub-title\">For Store {{data?.storeName}} on</span> <span class=\"sub-title1 ms-2\">{{dateFormat(this.data?.date)}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <form [formGroup]=\"raiseTicket\" class=\"row my-3\">\r\n <div class=\"col-md-6 my-3\">\r\n <label class=\"form-label\">Actual Billing Count</label>\r\n <input type=\"text\" formControlName=\"actualBilling\" (keypress)=\"omit_special_char($event)\" class=\"form-control\">\r\n </div>\r\n <div class=\"col-md-6 my-3\">\r\n <label class=\"form-label\">Your Expected Footfall</label>\r\n <input type=\"text\" formControlName=\"expectedFootfall\" (keypress)=\"omit_special_char($event)\" class=\"form-control\">\r\n </div>\r\n <div class=\"col-md-12 my-3\">\r\n <textarea class=\"type\" formControlName=\"description\" row=\"3\" class=\"form-control\" placeholder=\"Enter a description...\"></textarea>\r\n </div>\r\n <div class=\"col-md-12 my-3\">\r\n <span > <input type=\"file\" formControlName=\"filePath\" #fileInput style=\"display: none;\" accept=\"image/*\" (change)=\"onFileSelected($event)\">\r\n <button (click)=\"openFileInput()\" class=\"cursor-pointer btn btn-default p-0\"><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.8666 9.20835L10.2082 16.8667C9.27005 17.8049 7.99757 18.332 6.67075 18.332C5.34393 18.332 4.07145 17.8049 3.13325 16.8667C2.19505 15.9285 1.66797 14.656 1.66797 13.3292C1.66797 12.0024 2.19505 10.7299 3.13325 9.79168L10.7916 2.13335C11.4171 1.50788 12.2654 1.15649 13.1499 1.15649C14.0345 1.15649 14.8828 1.50788 15.5082 2.13335C16.1337 2.75882 16.4851 3.60713 16.4851 4.49168C16.4851 5.37623 16.1337 6.22455 15.5082 6.85002L7.84158 14.5083C7.52885 14.8211 7.10469 14.9968 6.66242 14.9968C6.22014 14.9968 5.79598 14.8211 5.48325 14.5083C5.17051 14.1956 4.99482 13.7715 4.99482 13.3292C4.99482 12.8869 5.17051 12.4627 5.48325 12.15L12.5582 5.08335\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"mx-2 sub-title text-capitalize\">{{fileName ? fileName : 'Attachments'}}</span></button></span>\r\n </div>\r\n <div class=\"text-danger\" *ngIf=\"errorMessage\">{{ errorMessage }}</div>\r\n <div class=\"d-flex my-5\" role=\"group\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"activeModal.close()\" >Cancel</button>\r\n <button class=\"btn btn-primary w-100 ms-3\" [disabled]=\"!raiseTicket.valid\" id=\"alert-toast\" (click)=\"submitTicket();activeModal.close(true)\"\r\n >Submit</button>\r\n </div>\r\n </form>\r\n \r\n </div>\r\n</div>\r\n\r\n<ng-template #createTicket let-modal>\r\n <div class=\"p-8\">\r\n <div class=\"\">\r\n <img src=\"./assets/tango/Images/Successtoast.png\">\r\n </div> \r\n <div class=\"mt-5 ticketData\">\r\n <span class=\"camera fw-bold\">Ticket Created Successfully</span>\r\n <div class=\"mt-3 sub-header fw-bold-400\">your ticket for {{dateFormat(this.data?.date)}} have been created successful !</div>\r\n </div>\r\n <div class=\"d-flex justify-content-between mt-10\">\r\n <button type=\"button\" class=\"btn btn-default btn-primary w-100 me-2\" (click)=\"redirectToTickets();modal.dismiss()\">Okay</button>\r\n </div>\r\n </div>\r\n </ng-template>\r\n", styles: [".camera{color:var(--Gray-900, #101828)!important;font-size:18px!important;line-height:28px!important}.sub-header{color:var(--Gray-500, #667085)!important;font-size:14px!important;line-height:20px}.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;line-height:20px}.sub-title1{color:var(--Gray-500, #667085)!important;font-size:14px!important;font-weight:700;line-height:20px}\n"] }]
106
106
  }], ctorParameters: () => [{ type: i1.NgbModal }, { type: i1.NgbActiveModal }, { type: i2.FormBuilder }, { type: i3.TicketsService }, { type: i4.ToastService }, { type: i5.Router }], propDecorators: { fileInput: [{
package/esm2022/lib/components/summary-infra/summary-infra.component.mjs CHANGED
@@ -94,12 +94,12 @@ export class SummaryInfraComponent {
94
94
  this.sortBy *= -1;
95
95
  this.getLoadData();
96
96
  }
97
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: SummaryInfraComponent, deps: [{ token: i1.TicketsService }, { token: i2.GlobalStateService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
98
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.10", type: SummaryInfraComponent, selector: "lib-summary-infra", inputs: { selectedTab: "selectedTab" }, ngImport: i0, template: "<div class=\"card p-0 border-0\">\r\n <div class=\"card-body p-0\">\r\n <div *ngIf=\"!loading && !noData\">\r\n <div class=\"table-responsive pt-5 px-2\">\r\n <table class=\"table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th><div class=\"cursor-pointer\" (click)=\"sortData('storeName')\">\r\n Date\r\n <span *ngIf=\"sortColumnName === 'storeName' && sortBy !== 1 || sortColumnName !== 'storeName' \">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumnName === 'storeName' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n <th *ngFor=\"let down of getObjectKeys(storesDown[0]) | slice:2\">{{down}}</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let item of storesDown\">\r\n <td class=\"cursor-pointer\" >{{ item.Date }}</td>\r\n <td *ngFor=\"let key of getObjectKeys(storesDown[0]) | slice:2\" ><div *ngIf=\"item[key] && item[key] !== 0 && item[key] !== ''\" class=\"hourlyData\">\r\n <img class=\"mb-2\" src=\"./assets/tango/Images/Downtime.svg\">\r\n <span>{{ item[key] }} <span *ngIf=\"key!=='PrimaryIssue'\">mins</span></span>\r\n </div>\r\n <div *ngIf=\"item[key] === 0 && item[key] !== ''\" class=\"hourlyData\">\r\n <img class=\"mb-2\" src=\"./assets/tango/Images/Downtime.svg\">\r\n <span>0 mins</span>\r\n </div>\r\n <span *ngIf=\"item[key] ===''\">N/A</span></td>\r\n </tr>\r\n </tbody>\r\n \r\n </table> \r\n </div>\r\n <lib-pagination [itemsPerPage]=\"limit\" [currentPage]=\"offset\"\r\n [totalItems]=\"totalCount\" [paginationSizes]=\"[5,10,20]\" [pageSize]=\"limit\"\r\n (pageChange)=\"onPageChange($event)\" (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n\r\n <ng-container *ngIf=\"loading\" >\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 \r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"noData\">\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\r\n </div>\r\n</div>\r\n", styles: [".hourlyData{display:flex;height:50px;padding:6px 8px 6px 16px;flex-direction:column;justify-content:center;align-items:flex-start;color:var(--Gray-500, #667085);font-size:12px;font-weight:400;line-height:18px;border-radius:4px;border-left:2px solid var(--Error-500, #F04438);background:var(--Error-25, #FFFBFA);box-shadow:0 1px 2px #1018280f,0 1px 3px #1018281a}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.PaginationComponent, selector: "lib-pagination", inputs: ["collection", "itemsPerPage", "currentPage", "totalItems", "directionLinks", "pageSize", "paginationSizes"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "pipe", type: i3.SlicePipe, name: "slice" }] });
97
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SummaryInfraComponent, deps: [{ token: i1.TicketsService }, { token: i2.GlobalStateService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
98
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SummaryInfraComponent, selector: "lib-summary-infra", inputs: { selectedTab: "selectedTab" }, ngImport: i0, template: "<div class=\"card p-0 border-0\">\r\n <div class=\"card-body p-0\">\r\n <div *ngIf=\"!loading && !noData\">\r\n <div class=\"table-responsive pt-5 px-2\">\r\n <table class=\"table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th><div class=\"cursor-pointer\" (click)=\"sortData('storeName')\">\r\n Date\r\n <span *ngIf=\"sortColumnName === 'storeName' && sortBy !== 1 || sortColumnName !== 'storeName' \">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumnName === 'storeName' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n <th *ngFor=\"let down of getObjectKeys(storesDown[0]) | slice:2\">{{down}}</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let item of storesDown\">\r\n <td class=\"cursor-pointer\" >{{ item.Date }}</td>\r\n <td *ngFor=\"let key of getObjectKeys(storesDown[0]) | slice:2\" ><div *ngIf=\"item[key] && item[key] !== 0 && item[key] !== ''\" class=\"hourlyData\">\r\n <img class=\"mb-2\" src=\"./assets/tango/Images/Downtime.svg\">\r\n <span>{{ item[key] }} <span *ngIf=\"key!=='PrimaryIssue'\">mins</span></span>\r\n </div>\r\n <div *ngIf=\"item[key] === 0 && item[key] !== ''\" class=\"hourlyData\">\r\n <img class=\"mb-2\" src=\"./assets/tango/Images/Downtime.svg\">\r\n <span>0 mins</span>\r\n </div>\r\n <span *ngIf=\"item[key] ===''\">N/A</span></td>\r\n </tr>\r\n </tbody>\r\n \r\n </table> \r\n </div>\r\n <lib-pagination [itemsPerPage]=\"limit\" [currentPage]=\"offset\"\r\n [totalItems]=\"totalCount\" [paginationSizes]=\"[5,10,20]\" [pageSize]=\"limit\"\r\n (pageChange)=\"onPageChange($event)\" (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n\r\n <ng-container *ngIf=\"loading\" >\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 \r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"noData\">\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\r\n </div>\r\n</div>\r\n", styles: [".hourlyData{display:flex;height:50px;padding:6px 8px 6px 16px;flex-direction:column;justify-content:center;align-items:flex-start;color:var(--Gray-500, #667085);font-size:12px;font-weight:400;line-height:18px;border-radius:4px;border-left:2px solid var(--Error-500, #F04438);background:var(--Error-25, #FFFBFA);box-shadow:0 1px 2px #1018280f,0 1px 3px #1018281a}.img-src{width:20%;height:20%}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.PaginationComponent, selector: "lib-pagination", inputs: ["collection", "itemsPerPage", "currentPage", "totalItems", "directionLinks", "pageSize", "paginationSizes"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "pipe", type: i3.SlicePipe, name: "slice" }] });
99
99
  }
100
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: SummaryInfraComponent, decorators: [{
100
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SummaryInfraComponent, decorators: [{
101
101
  type: Component,
102
- args: [{ selector: 'lib-summary-infra', template: "<div class=\"card p-0 border-0\">\r\n <div class=\"card-body p-0\">\r\n <div *ngIf=\"!loading && !noData\">\r\n <div class=\"table-responsive pt-5 px-2\">\r\n <table class=\"table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th><div class=\"cursor-pointer\" (click)=\"sortData('storeName')\">\r\n Date\r\n <span *ngIf=\"sortColumnName === 'storeName' && sortBy !== 1 || sortColumnName !== 'storeName' \">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumnName === 'storeName' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n <th *ngFor=\"let down of getObjectKeys(storesDown[0]) | slice:2\">{{down}}</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let item of storesDown\">\r\n <td class=\"cursor-pointer\" >{{ item.Date }}</td>\r\n <td *ngFor=\"let key of getObjectKeys(storesDown[0]) | slice:2\" ><div *ngIf=\"item[key] && item[key] !== 0 && item[key] !== ''\" class=\"hourlyData\">\r\n <img class=\"mb-2\" src=\"./assets/tango/Images/Downtime.svg\">\r\n <span>{{ item[key] }} <span *ngIf=\"key!=='PrimaryIssue'\">mins</span></span>\r\n </div>\r\n <div *ngIf=\"item[key] === 0 && item[key] !== ''\" class=\"hourlyData\">\r\n <img class=\"mb-2\" src=\"./assets/tango/Images/Downtime.svg\">\r\n <span>0 mins</span>\r\n </div>\r\n <span *ngIf=\"item[key] ===''\">N/A</span></td>\r\n </tr>\r\n </tbody>\r\n \r\n </table> \r\n </div>\r\n <lib-pagination [itemsPerPage]=\"limit\" [currentPage]=\"offset\"\r\n [totalItems]=\"totalCount\" [paginationSizes]=\"[5,10,20]\" [pageSize]=\"limit\"\r\n (pageChange)=\"onPageChange($event)\" (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n\r\n <ng-container *ngIf=\"loading\" >\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 \r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"noData\">\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\r\n </div>\r\n</div>\r\n", styles: [".hourlyData{display:flex;height:50px;padding:6px 8px 6px 16px;flex-direction:column;justify-content:center;align-items:flex-start;color:var(--Gray-500, #667085);font-size:12px;font-weight:400;line-height:18px;border-radius:4px;border-left:2px solid var(--Error-500, #F04438);background:var(--Error-25, #FFFBFA);box-shadow:0 1px 2px #1018280f,0 1px 3px #1018281a}\n"] }]
102
+ args: [{ selector: 'lib-summary-infra', template: "<div class=\"card p-0 border-0\">\r\n <div class=\"card-body p-0\">\r\n <div *ngIf=\"!loading && !noData\">\r\n <div class=\"table-responsive pt-5 px-2\">\r\n <table class=\"table bottom-border text-nowrap\">\r\n <thead>\r\n <tr>\r\n <th><div class=\"cursor-pointer\" (click)=\"sortData('storeName')\">\r\n Date\r\n <span *ngIf=\"sortColumnName === 'storeName' && sortBy !== 1 || sortColumnName !== 'storeName' \">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 1.33337V10.6667M6.00016 10.6667L10.6668 6.00004M6.00016 10.6667L1.3335 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"sortColumnName === 'storeName' && sortBy !== -1\">\r\n <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M6.00016 10.6667L6.00016 1.33337M6.00016 1.33337L1.3335 6.00004M6.00016 1.33337L10.6668 6.00004\"\r\n stroke=\"#667085\" stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </div>\r\n </th>\r\n <th *ngFor=\"let down of getObjectKeys(storesDown[0]) | slice:2\">{{down}}</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let item of storesDown\">\r\n <td class=\"cursor-pointer\" >{{ item.Date }}</td>\r\n <td *ngFor=\"let key of getObjectKeys(storesDown[0]) | slice:2\" ><div *ngIf=\"item[key] && item[key] !== 0 && item[key] !== ''\" class=\"hourlyData\">\r\n <img class=\"mb-2\" src=\"./assets/tango/Images/Downtime.svg\">\r\n <span>{{ item[key] }} <span *ngIf=\"key!=='PrimaryIssue'\">mins</span></span>\r\n </div>\r\n <div *ngIf=\"item[key] === 0 && item[key] !== ''\" class=\"hourlyData\">\r\n <img class=\"mb-2\" src=\"./assets/tango/Images/Downtime.svg\">\r\n <span>0 mins</span>\r\n </div>\r\n <span *ngIf=\"item[key] ===''\">N/A</span></td>\r\n </tr>\r\n </tbody>\r\n \r\n </table> \r\n </div>\r\n <lib-pagination [itemsPerPage]=\"limit\" [currentPage]=\"offset\"\r\n [totalItems]=\"totalCount\" [paginationSizes]=\"[5,10,20]\" [pageSize]=\"limit\"\r\n (pageChange)=\"onPageChange($event)\" (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n\r\n <ng-container *ngIf=\"loading\" >\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 \r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"noData\">\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\r\n </div>\r\n</div>\r\n", styles: [".hourlyData{display:flex;height:50px;padding:6px 8px 6px 16px;flex-direction:column;justify-content:center;align-items:flex-start;color:var(--Gray-500, #667085);font-size:12px;font-weight:400;line-height:18px;border-radius:4px;border-left:2px solid var(--Error-500, #F04438);background:var(--Error-25, #FFFBFA);box-shadow:0 1px 2px #1018280f,0 1px 3px #1018281a}.img-src{width:20%;height:20%}\n"] }]
103
103
  }], ctorParameters: () => [{ type: i1.TicketsService }, { type: i2.GlobalStateService }, { type: i0.ChangeDetectorRef }], propDecorators: { selectedTab: [{
104
104
  type: Input
105
105
  }] } });
package/esm2022/lib/components/tango-store-infra/tango-store-infra.component.mjs CHANGED
@@ -92,10 +92,10 @@ export class TangoStoreInfraComponent {
92
92
  selectedTabs1(type) {
93
93
  this.selectedTab1 = type;
94
94
  }
95
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: TangoStoreInfraComponent, deps: [{ token: i1.PageInfoService }, { token: i2.Router }, { token: i1.GlobalStateService }, { token: i2.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
96
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.10", type: TangoStoreInfraComponent, selector: "lib-tango-store-infra", ngImport: i0, template: "<div class=\"card mb-5 py-3 px-5\">\r\n <ul class=\"nav nav-stretch nav-line-tabs1 nav-line-tabs border-transparent flex-nowrap\">\r\n <li class=\"nav-item\" (click)=\"selectedTabs('infra')\"><a [ngClass]=\"selectedTab ==='infra' ? 'active' :''\"\r\n class=\"nav-link cursor-pointer no-border me-6 \">Infra</a>\r\n </li>\r\n <li class=\"nav-item\" (click)=\"selectedTabs('dataMismatch')\">\r\n <a [ngClass]=\"selectedTab ==='dataMismatch' ? 'active' :''\" class=\"nav-link cursor-pointer me-6\">Data Mismatch</a>\r\n </li>\r\n </ul>\r\n</div>\r\n<div *ngIf=\"selectedTab !=='dataMismatch'\" class=\"mb-5 py-3 px-5\">\r\n <ul class=\"nav nav-stretch nav-line-tabs1 nav-line-tabs border-transparent flex-nowrap\">\r\n <li class=\"nav-item nav-item1\" (click)=\"selectedTabs1('summary')\"><a [ngClass]=\"selectedTab1 ==='summary' ? 'active' :''\"\r\n class=\"nav-link nav-link1 cursor-pointer no-border me-6 \">Summary</a>\r\n </li>\r\n <li class=\"nav-item nav-item1\" (click)=\"selectedTabs1('tickets')\">\r\n <a [ngClass]=\"selectedTab1 ==='tickets' ? 'active' :''\" class=\"nav-link nav-link1 cursor-pointer me-6\">Tickets</a>\r\n </li>\r\n </ul>\r\n</div>\r\n<div *ngIf=\"selectedTab ==='infra' && selectedTab1 ==='summary'\">\r\n <lib-summary-infra [selectedTab]=\"selectedTab\"></lib-summary-infra>\r\n</div>\r\n<div *ngIf=\"selectedTab ==='infra' && selectedTab1 ==='tickets'\">\r\n <lib-ticket-infra [selectedTab]=\"selectedTab\"></lib-ticket-infra>\r\n</div>\r\n<div *ngIf=\"selectedTab ==='dataMismatch'\">\r\n <lib-ticket-infra [selectedTab]=\"selectedTab\"></lib-ticket-infra>\r\n</div>\r\n<router-outlet></router-outlet>", styles: [".nav-item .nav-link.active{border:none;border-radius:6px;background:var(--Primary-50, #EAF8FF);padding:8px 12px}.nav-item .nav-link:hover{border:none}.nav-item1 .nav-link1.active{border:none;border-radius:0;background:var(--Primary-50, #EAF8FF);border-bottom:2px solid #009BF3!important;padding:8px 12px}.nav-item1 .nav-link1:hover{border:none}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "component", type: i4.TicketInfraComponent, selector: "lib-ticket-infra", inputs: ["selectedTab"] }, { kind: "component", type: i5.SummaryInfraComponent, selector: "lib-summary-infra", inputs: ["selectedTab"] }] });
95
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: TangoStoreInfraComponent, deps: [{ token: i1.PageInfoService }, { token: i2.Router }, { token: i1.GlobalStateService }, { token: i2.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
96
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: TangoStoreInfraComponent, selector: "lib-tango-store-infra", ngImport: i0, template: "<div class=\"card mb-5 py-3 px-5\">\r\n <ul class=\"nav nav-stretch nav-line-tabs1 nav-line-tabs border-transparent flex-nowrap\">\r\n <li class=\"nav-item\" (click)=\"selectedTabs('infra')\"><a [ngClass]=\"selectedTab ==='infra' ? 'active' :''\"\r\n class=\"nav-link cursor-pointer no-border me-6 \">Infra</a>\r\n </li>\r\n <li class=\"nav-item\" (click)=\"selectedTabs('dataMismatch')\">\r\n <a [ngClass]=\"selectedTab ==='dataMismatch' ? 'active' :''\" class=\"nav-link cursor-pointer me-6\">Data Mismatch</a>\r\n </li>\r\n </ul>\r\n</div>\r\n<div *ngIf=\"selectedTab !=='dataMismatch'\" class=\"mb-5 py-3 px-5\">\r\n <ul class=\"nav nav-stretch nav-line-tabs1 nav-line-tabs border-transparent flex-nowrap\">\r\n <li class=\"nav-item nav-item1\" (click)=\"selectedTabs1('summary')\"><a [ngClass]=\"selectedTab1 ==='summary' ? 'active' :''\"\r\n class=\"nav-link nav-link1 cursor-pointer no-border me-6 \">Summary</a>\r\n </li>\r\n <li class=\"nav-item nav-item1\" (click)=\"selectedTabs1('tickets')\">\r\n <a [ngClass]=\"selectedTab1 ==='tickets' ? 'active' :''\" class=\"nav-link nav-link1 cursor-pointer me-6\">Tickets</a>\r\n </li>\r\n </ul>\r\n</div>\r\n<div *ngIf=\"selectedTab ==='infra' && selectedTab1 ==='summary'\">\r\n <lib-summary-infra [selectedTab]=\"selectedTab\"></lib-summary-infra>\r\n</div>\r\n<div *ngIf=\"selectedTab ==='infra' && selectedTab1 ==='tickets'\">\r\n <lib-ticket-infra [selectedTab]=\"selectedTab\"></lib-ticket-infra>\r\n</div>\r\n<div *ngIf=\"selectedTab ==='dataMismatch'\">\r\n <lib-ticket-infra [selectedTab]=\"selectedTab\"></lib-ticket-infra>\r\n</div>\r\n<router-outlet></router-outlet>", styles: [".nav-item .nav-link.active{border:none;border-radius:6px;background:var(--Primary-50, #EAF8FF);padding:8px 12px}.nav-item .nav-link:hover{border:none}.nav-item1 .nav-link1.active{border:none;border-radius:0;background:var(--Primary-50, #EAF8FF);border-bottom:2px solid #009BF3!important;padding:8px 12px}.nav-item1 .nav-link1:hover{border:none}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "component", type: i4.TicketInfraComponent, selector: "lib-ticket-infra", inputs: ["selectedTab"] }, { kind: "component", type: i5.SummaryInfraComponent, selector: "lib-summary-infra", inputs: ["selectedTab"] }] });
97
97
  }
98
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: TangoStoreInfraComponent, decorators: [{
98
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: TangoStoreInfraComponent, decorators: [{
99
99
  type: Component,
100
100
  args: [{ selector: 'lib-tango-store-infra', template: "<div class=\"card mb-5 py-3 px-5\">\r\n <ul class=\"nav nav-stretch nav-line-tabs1 nav-line-tabs border-transparent flex-nowrap\">\r\n <li class=\"nav-item\" (click)=\"selectedTabs('infra')\"><a [ngClass]=\"selectedTab ==='infra' ? 'active' :''\"\r\n class=\"nav-link cursor-pointer no-border me-6 \">Infra</a>\r\n </li>\r\n <li class=\"nav-item\" (click)=\"selectedTabs('dataMismatch')\">\r\n <a [ngClass]=\"selectedTab ==='dataMismatch' ? 'active' :''\" class=\"nav-link cursor-pointer me-6\">Data Mismatch</a>\r\n </li>\r\n </ul>\r\n</div>\r\n<div *ngIf=\"selectedTab !=='dataMismatch'\" class=\"mb-5 py-3 px-5\">\r\n <ul class=\"nav nav-stretch nav-line-tabs1 nav-line-tabs border-transparent flex-nowrap\">\r\n <li class=\"nav-item nav-item1\" (click)=\"selectedTabs1('summary')\"><a [ngClass]=\"selectedTab1 ==='summary' ? 'active' :''\"\r\n class=\"nav-link nav-link1 cursor-pointer no-border me-6 \">Summary</a>\r\n </li>\r\n <li class=\"nav-item nav-item1\" (click)=\"selectedTabs1('tickets')\">\r\n <a [ngClass]=\"selectedTab1 ==='tickets' ? 'active' :''\" class=\"nav-link nav-link1 cursor-pointer me-6\">Tickets</a>\r\n </li>\r\n </ul>\r\n</div>\r\n<div *ngIf=\"selectedTab ==='infra' && selectedTab1 ==='summary'\">\r\n <lib-summary-infra [selectedTab]=\"selectedTab\"></lib-summary-infra>\r\n</div>\r\n<div *ngIf=\"selectedTab ==='infra' && selectedTab1 ==='tickets'\">\r\n <lib-ticket-infra [selectedTab]=\"selectedTab\"></lib-ticket-infra>\r\n</div>\r\n<div *ngIf=\"selectedTab ==='dataMismatch'\">\r\n <lib-ticket-infra [selectedTab]=\"selectedTab\"></lib-ticket-infra>\r\n</div>\r\n<router-outlet></router-outlet>", styles: [".nav-item .nav-link.active{border:none;border-radius:6px;background:var(--Primary-50, #EAF8FF);padding:8px 12px}.nav-item .nav-link:hover{border:none}.nav-item1 .nav-link1.active{border:none;border-radius:0;background:var(--Primary-50, #EAF8FF);border-bottom:2px solid #009BF3!important;padding:8px 12px}.nav-item1 .nav-link1:hover{border:none}\n"] }]
101
101
  }], ctorParameters: () => [{ type: i1.PageInfoService }, { type: i2.Router }, { type: i1.GlobalStateService }, { type: i2.ActivatedRoute }] });