tango-app-ui-shared 3.0.17-dev → 3.0.18-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 (7) hide show
  1. package/esm2022/lib/modules/layout/toolbar/date-single-select/date-single-select.component.mjs +8 -8
  2. package/esm2022/lib/modules/layout/toolbar/single-store/single-store.component.mjs +15 -11
  3. package/esm2022/lib/modules/layout/toolbar/toolbar.component.mjs +59 -44
  4. package/fesm2022/tango-app-ui-shared.mjs +79 -60
  5. package/fesm2022/tango-app-ui-shared.mjs.map +1 -1
  6. package/lib/modules/layout/toolbar/toolbar.component.d.ts +5 -2
  7. package/package.json +1 -1
package/fesm2022/tango-app-ui-shared.mjs CHANGED
@@ -2239,15 +2239,15 @@ class DateSingleSelectComponent {
2239
2239
  this.clientList.find((obj) => {
2240
2240
  if (obj.clientId === headerFilters.client) {
2241
2241
  this.selectedClient = obj;
2242
- this.cd.detectChanges();
2243
2242
  }
2244
- this.selectedFilters.client = headerFilters.client;
2245
- this.selectedFilters.clients = [headerFilters.clients];
2246
- this.selectedFilters.date = headerFilters.date;
2247
- this.selectedDateRange.startDate = headerFilters.date.startDate;
2248
- this.selectedDateRange.endDate = headerFilters.date.endDate;
2249
- this.gs.dataRangeValue.next(this.selectedFilters);
2250
2243
  });
2244
+ this.selectedFilters.client = headerFilters.client;
2245
+ this.selectedFilters.clients = [headerFilters.clients];
2246
+ this.selectedFilters.date = headerFilters.date;
2247
+ this.selectedDateRange.startDate = headerFilters.date.startDate;
2248
+ this.selectedDateRange.endDate = headerFilters.date.endDate;
2249
+ this.gs.dataRangeValue.next(this.selectedFilters);
2250
+ this.cd.detectChanges();
2251
2251
  }
2252
2252
  else {
2253
2253
  this.selectedClient = this.clientList[0];
@@ -2366,17 +2366,19 @@ class SingleStoreComponent {
2366
2366
  this.storeList.find((obj) => {
2367
2367
  if (obj.storeId === headerFilters.store) {
2368
2368
  this.selectedClient = obj;
2369
- this.gs.dataRangeValue.next(this.selectedFilters);
2369
+ console.log("1111111111111");
2370
+ // this.gs.dataRangeValue.next(this.selectedFilters);
2370
2371
  }
2371
- this.gs.dataRangeValue.next(this.selectedFilters);
2372
- this.selectedFilters.store = headerFilters.store;
2373
- this.selectedFilters.client = headerFilters.client;
2374
- this.selectedFilters.clients = [headerFilters.clients];
2375
- this.selectedFilters.date = headerFilters.date;
2376
- this.selectedDateRange.startDate = headerFilters.date.startDate;
2377
- this.selectedDateRange.endDate = headerFilters.date.endDate;
2378
- this.cd.detectChanges();
2379
2372
  });
2373
+ // console.log("222222222222222");
2374
+ this.selectedFilters.store = headerFilters.store;
2375
+ this.selectedFilters.client = headerFilters.client;
2376
+ this.selectedFilters.clients = [headerFilters.clients];
2377
+ this.selectedFilters.date = headerFilters.date;
2378
+ this.selectedDateRange.startDate = headerFilters.date.startDate;
2379
+ this.selectedDateRange.endDate = headerFilters.date.endDate;
2380
+ this.gs.dataRangeValue.next(this.selectedFilters);
2381
+ this.cd.detectChanges();
2380
2382
  }
2381
2383
  else {
2382
2384
  this.selectedClient = this.storeList[0];
@@ -2384,6 +2386,7 @@ class SingleStoreComponent {
2384
2386
  this.selectedDateRange.startDate = this.dayjs().format('YYYY-MM-DD');
2385
2387
  this.selectedDateRange.endDate = this.dayjs().format('YYYY-MM-DD');
2386
2388
  this.selectedFilters.date = this.selectedDateRange;
2389
+ console.log("33333333333333");
2387
2390
  this.gs.dataRangeValue.next(this.selectedFilters);
2388
2391
  this.cd.detectChanges();
2389
2392
  }
@@ -2394,7 +2397,7 @@ class SingleStoreComponent {
2394
2397
  }
2395
2398
  onClientSelect(event) {
2396
2399
  this.selectedClient = event;
2397
- this.gs.selectedClient.next(this.selectedClient);
2400
+ // this.gs.selectedClient.next(this.selectedClient)
2398
2401
  }
2399
2402
  ranges = {
2400
2403
  'Today': [this.dayjs(), this.dayjs()],
@@ -2435,6 +2438,7 @@ class SingleStoreComponent {
2435
2438
  this.selectedFilters = headerFilters;
2436
2439
  this.selectedFilters.store = this.selectedClient.storeId;
2437
2440
  this.selectedFilters.date = this.selectedDateRange;
2441
+ console.log("4444444444444444");
2438
2442
  this.gs.dataRangeValue.next(this.selectedFilters);
2439
2443
  localStorage.setItem('header-filters', JSON.stringify(this.selectedFilters));
2440
2444
  }
@@ -2451,6 +2455,7 @@ class ToolbarComponent {
2451
2455
  router;
2452
2456
  route;
2453
2457
  gs;
2458
+ pageInfo;
2454
2459
  unsubscribe = [];
2455
2460
  // Public props
2456
2461
  currentLayoutType;
@@ -2475,11 +2480,12 @@ class ToolbarComponent {
2475
2480
  singleStore;
2476
2481
  headervalue;
2477
2482
  storeId;
2478
- constructor(layout, router, route, gs) {
2483
+ constructor(layout, router, route, gs, pageInfo) {
2479
2484
  this.layout = layout;
2480
2485
  this.router = router;
2481
2486
  this.route = route;
2482
2487
  this.gs = gs;
2488
+ this.pageInfo = pageInfo;
2483
2489
  }
2484
2490
  ngOnInit() {
2485
2491
  // let data:any = JSON.parse(localStorage.getItem('header-filters') || '');
@@ -2528,73 +2534,86 @@ class ToolbarComponent {
2528
2534
  ngOnDestroy() {
2529
2535
  this.unsubscribe.forEach((sb) => sb.unsubscribe());
2530
2536
  }
2537
+ setPageData(storeId) {
2538
+ this.pageInfo.setTitle("Tickets");
2539
+ this.pageInfo.setDescription("View, share, download and benchmark the stores performance in one screen");
2540
+ this.pageInfo.setBreadcrumbs([
2541
+ { title: "Manage", path: "/manage", isActive: false, isSeparator: false },
2542
+ { title: "Manage", path: "/manage", isActive: false, isSeparator: true },
2543
+ {
2544
+ title: "Stores",
2545
+ path: "/manage/stores",
2546
+ isActive: false,
2547
+ isSeparator: false,
2548
+ },
2549
+ {
2550
+ title: "Stores",
2551
+ path: "/manage/stores",
2552
+ isActive: false,
2553
+ isSeparator: true,
2554
+ },
2555
+ {
2556
+ title: storeId,
2557
+ path: "/manage/stores/" + storeId,
2558
+ isActive: false,
2559
+ isSeparator: false,
2560
+ },
2561
+ {
2562
+ title: storeId,
2563
+ path: "/manage/stores" + storeId,
2564
+ isActive: false,
2565
+ isSeparator: true,
2566
+ },
2567
+ ]);
2568
+ }
2531
2569
  showPageTitle() {
2532
2570
  if ("header-filters" in localStorage) {
2533
2571
  const data = JSON.parse(localStorage.getItem("header-filters") || "{}");
2534
2572
  this.storeId = data.store;
2573
+ this.setPageData(this.storeId);
2574
+ // Construct the new URL with the updated storeId
2575
+ const currentUrl = this.router.url;
2576
+ const updatedUrl = currentUrl.replace(/\/manage\/stores\/\d+-\d+\//, `/manage/stores/${this.storeId}/`);
2577
+ // Navigate to the updated URL
2578
+ this.router.navigateByUrl(updatedUrl);
2535
2579
  }
2536
- let url = this.router.url.split("/");
2580
+ const url = this.router.url.split("/");
2537
2581
  if (url[2] == 'settings') {
2538
- console.log(this.router.url);
2539
- this.singleSelect = true;
2540
- this.multiSelect = false;
2541
- this.datepicker = false;
2542
- this.singleStore = false;
2543
- this.singleSelectdatepicker = false;
2582
+ this.setUIProperties(true, false, false, false, false);
2544
2583
  }
2545
2584
  else if (this.router.url == "/manage/brands") {
2546
- this.singleSelect = false;
2547
- this.multiSelect = false;
2548
- this.datepicker = false;
2549
- this.singleStore = false;
2550
- this.singleSelectdatepicker = false;
2585
+ this.setUIProperties(false, false, false, false, false);
2551
2586
  }
2552
- else if (this.router.url == "/manage/users" || this.router.url == "/manage/stores" || this.router.url == "/manage/stores/addition-method" || this.router.url == "/manage/stores/add-single-store" || this.router.url == "manage/stores/edge-app/edge-email-journey") {
2553
- this.singleSelect = false;
2554
- this.multiSelect = false;
2555
- this.datepicker = false;
2556
- this.singleStore = false;
2557
- this.singleSelectdatepicker = true;
2587
+ else if (this.router.url == "/manage/users" || this.router.url == "/manage/stores" || this.router.url == "/manage/stores/addition-method") {
2588
+ this.setUIProperties(false, false, false, false, true);
2558
2589
  }
2559
2590
  else if (this.router.url == `/manage/stores/${this.storeId}/infra-ticket` || this.router.url == `/manage/stores/${this.storeId}/settings`) {
2560
- this.singleSelect = false;
2561
- this.multiSelect = false;
2562
- this.datepicker = false;
2563
- this.singleSelectdatepicker = false;
2564
- this.singleStore = true;
2591
+ this.setUIProperties(false, false, false, true, false);
2565
2592
  }
2566
2593
  else if (this.router.url == "/profile") {
2567
- this.singleSelect = false;
2568
- this.multiSelect = false;
2569
- this.datepicker = false;
2570
- this.singleStore = false;
2571
- this.singleSelectdatepicker = false;
2594
+ this.setUIProperties(false, false, false, false, false);
2572
2595
  }
2573
2596
  else {
2574
- this.singleSelect = false;
2575
- this.multiSelect = true;
2576
- this.datepicker = false;
2577
- this.singleSelectdatepicker = false;
2578
- this.singleStore = false;
2597
+ this.setUIProperties(false, true, false, false, false);
2579
2598
  }
2580
- // else if (this.router.url == "/manage/users") {
2581
- // this.singleSelect = false;
2582
- // this.multiSelect = false;
2583
- // this.datepicker = true;
2584
- // this.singleStore =false
2585
- // this.singleSelectdatepicker = false;
2586
- // }
2587
2599
  const viewsWithPageTitles = ["classic", "reports", "saas"];
2588
2600
  return (this.appPageTitleDisplay &&
2589
2601
  viewsWithPageTitles.some((t) => t === this.appToolbarLayout));
2590
2602
  }
2591
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ToolbarComponent, deps: [{ token: i1.LayoutService }, { token: i1$1.Router }, { token: i1$1.ActivatedRoute }, { token: GlobalStateService }], target: i0.ɵɵFactoryTarget.Component });
2603
+ setUIProperties(singleSelect, multiSelect, datepicker, singleStore, singleSelectdatepicker) {
2604
+ this.singleSelect = singleSelect;
2605
+ this.multiSelect = multiSelect;
2606
+ this.datepicker = datepicker;
2607
+ this.singleStore = singleStore;
2608
+ this.singleSelectdatepicker = singleSelectdatepicker;
2609
+ }
2610
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ToolbarComponent, deps: [{ token: i1.LayoutService }, { token: i1$1.Router }, { token: i1$1.ActivatedRoute }, { token: GlobalStateService }, { token: i1.PageInfoService }], target: i0.ɵɵFactoryTarget.Component });
2592
2611
  static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: ToolbarComponent, selector: "lib-toolbar", inputs: { currentLayoutType: "currentLayoutType", appToolbarLayout: "appToolbarLayout" }, ngImport: i0, template: "<!--begin::Toolbar container-->\r\n<div id=\"kt_app_toolbar_container\" class=\"app-container\" [ngClass]=\"appToolbarContainerCSSClass\">\r\n <ng-container *ngIf=\"showPageTitle()\">\r\n <lib-page-title [appPageTitleDirection]=\"appPageTitleDirection\" [appPageTitleBreadcrumb]=\"appPageTitleBreadcrumb\"\r\n [appPageTitleDescription]=\"appPageTitleDescription\" class=\"page-title d-flex flex-wrap me-3\"\r\n [ngClass]=\"{'flex-column justify-content-center': appPageTitleDirection === 'column', 'align-items-center': appPageTitleDirection !== 'column', appPageTitleCSSClass}\">\r\n </lib-page-title>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"multiSelect\">\r\n <lib-classic class=\"d-flex align-items-center gap-2 gap-lg-3\"></lib-classic>\r\n </ng-container>\r\n <ng-container *ngIf=\"singleSelect\">\r\n <lib-client-settings class=\"d-flex align-items-center me-5\"></lib-client-settings>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"datepicker\">\r\n <lib-datepicker class=\"d-flex align-items-center me-5\"></lib-datepicker>\r\n </ng-container>\r\n <ng-container *ngIf=\"singleSelectdatepicker\">\r\n <lib-date-single-select class=\"d-flex align-items-center me-5\"></lib-date-single-select>\r\n </ng-container>\r\n <ng-container *ngIf=\"singleStore\">\r\n <lib-single-store class=\"d-flex align-items-center me-5\"></lib-single-store>\r\n </ng-container>\r\n <!-- <ng-container *ngIf=\"appToolbarLayout === 'extended'\">\r\n <lib-extended class=\"d-flex align-items-center flex-shrink-0 me-5\"></lib-extended>\r\n </ng-container>\r\n <ng-container *ngIf=\"appToolbarLayout === 'reports'\">\r\n <lib-reports class=\"d-flex align-items-center overflow-auto\" [appPageTitleDisplay]=\"appPageTitleDisplay\">\r\n </lib-reports>\r\n </ng-container>\r\n <ng-container *ngIf=\"appToolbarLayout === 'saas'\">\r\n <lib-saas class=\"d-flex align-items-center gap-2\" [appPageTitleDisplay]=\"appPageTitleDisplay\"></lib-saas>\r\n </ng-container> -->\r\n</div>\r\n<!--end::Toolbar container-->\r\n", styles: [""], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: PageTitleComponent, selector: "lib-page-title", inputs: ["appPageTitleDirection", "appPageTitleBreadcrumb", "appPageTitleDescription"] }, { kind: "component", type: ClassicComponent, selector: "lib-classic" }, { kind: "component", type: ClientSettingsComponent, selector: "lib-client-settings" }, { kind: "component", type: DatepickerComponent, selector: "lib-datepicker" }, { kind: "component", type: DateSingleSelectComponent, selector: "lib-date-single-select" }, { kind: "component", type: SingleStoreComponent, selector: "lib-single-store" }] });
2593
2612
  }
2594
2613
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ToolbarComponent, decorators: [{
2595
2614
  type: Component,
2596
2615
  args: [{ selector: "lib-toolbar", template: "<!--begin::Toolbar container-->\r\n<div id=\"kt_app_toolbar_container\" class=\"app-container\" [ngClass]=\"appToolbarContainerCSSClass\">\r\n <ng-container *ngIf=\"showPageTitle()\">\r\n <lib-page-title [appPageTitleDirection]=\"appPageTitleDirection\" [appPageTitleBreadcrumb]=\"appPageTitleBreadcrumb\"\r\n [appPageTitleDescription]=\"appPageTitleDescription\" class=\"page-title d-flex flex-wrap me-3\"\r\n [ngClass]=\"{'flex-column justify-content-center': appPageTitleDirection === 'column', 'align-items-center': appPageTitleDirection !== 'column', appPageTitleCSSClass}\">\r\n </lib-page-title>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"multiSelect\">\r\n <lib-classic class=\"d-flex align-items-center gap-2 gap-lg-3\"></lib-classic>\r\n </ng-container>\r\n <ng-container *ngIf=\"singleSelect\">\r\n <lib-client-settings class=\"d-flex align-items-center me-5\"></lib-client-settings>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"datepicker\">\r\n <lib-datepicker class=\"d-flex align-items-center me-5\"></lib-datepicker>\r\n </ng-container>\r\n <ng-container *ngIf=\"singleSelectdatepicker\">\r\n <lib-date-single-select class=\"d-flex align-items-center me-5\"></lib-date-single-select>\r\n </ng-container>\r\n <ng-container *ngIf=\"singleStore\">\r\n <lib-single-store class=\"d-flex align-items-center me-5\"></lib-single-store>\r\n </ng-container>\r\n <!-- <ng-container *ngIf=\"appToolbarLayout === 'extended'\">\r\n <lib-extended class=\"d-flex align-items-center flex-shrink-0 me-5\"></lib-extended>\r\n </ng-container>\r\n <ng-container *ngIf=\"appToolbarLayout === 'reports'\">\r\n <lib-reports class=\"d-flex align-items-center overflow-auto\" [appPageTitleDisplay]=\"appPageTitleDisplay\">\r\n </lib-reports>\r\n </ng-container>\r\n <ng-container *ngIf=\"appToolbarLayout === 'saas'\">\r\n <lib-saas class=\"d-flex align-items-center gap-2\" [appPageTitleDisplay]=\"appPageTitleDisplay\"></lib-saas>\r\n </ng-container> -->\r\n</div>\r\n<!--end::Toolbar container-->\r\n" }]
2597
- }], ctorParameters: () => [{ type: i1.LayoutService }, { type: i1$1.Router }, { type: i1$1.ActivatedRoute }, { type: GlobalStateService }], propDecorators: { currentLayoutType: [{
2616
+ }], ctorParameters: () => [{ type: i1.LayoutService }, { type: i1$1.Router }, { type: i1$1.ActivatedRoute }, { type: GlobalStateService }, { type: i1.PageInfoService }], propDecorators: { currentLayoutType: [{
2598
2617
  type: Input
2599
2618
  }], appToolbarLayout: [{
2600
2619
  type: Input