Solution to issue #498 by Group 04

ui/src/app/core/components/modules-selector/modules-selector.component.html

@@ -12,6 +12,7 @@
       >
         <div>
           <img src="{{ module?.app?.image }}" style="height: 20px" />
+          <span *ngIf="module?.app?.name == 'Radiology' && showRadiologyBadge" class="badge-counter" >1</span>
           <p class="mt-2 menu-label">{{ module?.app?.name }}</p>
         </div>
       </div>

ui/src/app/core/components/modules-selector/modules-selector.component.scss

@@ -9,6 +9,18 @@
   overflow-y: hidden;
 }
 
+.badge-counter {
+  background-color: red;
+  color: red;
+  border-radius: 100%;
+  padding:2px 4px;
+  font-size: 6px;
+  margin-left: 5px;
+  position: relative;
+  top: -10px;
+  right: 0;
+}
+
 .sub-menu-items {
   display: flex;
   justify-content: flex-start;
@@ -52,7 +64,7 @@
   color: #fff !important;
 }
 
-/* TODO(mdc-migration): The following rule targets internal classes of chips that may no longer apply for the MDC version.*/
+/* TODO(mdc-migration): The following rule targets internal classes of chips that may no longer apply for the MDC version.*/
 .mat-chip-resemblance {
   transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
   display: inline-flex;
@@ -75,12 +87,12 @@
 }
 
 // My css
-/* TODO(mdc-migration): The following rule targets internal classes of chips that may no longer apply for the MDC version.*/
-/* TODO(mdc-migration): The following rule targets internal classes of chips that may no longer apply for the MDC version.*/
+/* TODO(mdc-migration): The following rule targets internal classes of chips that may no longer apply for the MDC version.*/
+/* TODO(mdc-migration): The following rule targets internal classes of chips that may no longer apply for the MDC version.*/
 ::ng-deep .mat-chip-list-wrapper {
   flex-wrap: nowrap !important;
-  overflow-x: auto;
-  /* TODO(mdc-migration): The following rule targets internal classes of chips that may no longer apply for the MDC version.*/
+  overflow-x: auto;
+  /* TODO(mdc-migration): The following rule targets internal classes of chips that may no longer apply for the MDC version.*/
   mat-chip {
     flex: 0 0 auto;
   }

ui/src/app/core/components/modules-selector/modules-selector.component.ts

@@ -10,13 +10,15 @@ import {
 } from "src/app/store/actions";
 import { ICARE_APPS } from "src/app/core/containers/modules/modules.constants";
 import { GoogleAnalyticsService } from "src/app/google-analytics.service";
+import { RadiologyBadgeService } from "src/app/shared/services/radio-badge.service";
 
 @Component({
   selector: "app-modules-selector",
   templateUrl: "./modules-selector.component.html",
   styleUrls: ["./modules-selector.component.scss"],
 })
 export class ModulesSelectorComponent implements OnInit {
+  showRadiologyBadge: boolean = false;
   @Input() locations: Location[];
   @Input() lisConfigurations: any;
   modulesReferences: string[];
@@ -25,10 +27,17 @@ export class ModulesSelectorComponent implements OnInit {
   userLocationsForTheCurrentModule: Location[];
   constructor(
     private store: Store<AppState>,
-    private googleAnalyticsService: GoogleAnalyticsService
+    private googleAnalyticsService: GoogleAnalyticsService,
+    private radiologyBadgeService: RadiologyBadgeService
   ) {}
 
+
   ngOnInit(): void {
+
+    this.radiologyBadgeService.showRadiologyBadge$.subscribe(value => {
+      this.showRadiologyBadge = value;
+    });
+
     const storedNavigationDetails =
       localStorage.getItem("navigationDetails") != "undefined"
         ? JSON.parse(localStorage.getItem("navigationDetails"))
@@ -225,9 +234,11 @@ export class ModulesSelectorComponent implements OnInit {
   }
 
   onSelectModuleLocation(event: Event, module: any): void {
-    // module?.app?.name
     event.stopPropagation();
     this.currentModule = module;
+    if (module?.app?.name === 'Radiology') {
+      this.radiologyBadgeService.setShowRadiologyBadge(false);
+    }
     this.userLocationsForTheCurrentModule =
       this.locations.filter(
         (location: any) =>
@@ -238,7 +249,6 @@ export class ModulesSelectorComponent implements OnInit {
           ).length > 0 && !location?.retired
       ) || [];
     this.currentLocation = this.userLocationsForTheCurrentModule[0];
-    // localStorage.setItem("currentLocation", this.currentLocation);
     this.currentLocation = {
       ...module?.location,
       id: module?.location?.uuid,

ui/src/app/shared/components/patient-radiology-summary/patient-radiology-summary.component.ts

@@ -8,6 +8,7 @@ import { flatten, orderBy, uniqBy } from "lodash";
 import { SharedConfirmationComponent } from "../shared-confirmation/shared-confirmation.component";
 import { MatDialog } from "@angular/material/dialog";
 import { SharedPdfPreviewComponent } from "../../dialogs/shared-pdf-preview/shared-pdf-preview.component";
+import { RadiologyBadgeService } from "../../services/radio-badge.service";
 
 @Component({
   selector: "app-patient-radiology-summary",
@@ -35,6 +36,7 @@ export class PatientRadiologySummaryComponent implements OnInit {
   formDetails: FormValue;
   @Output() updateConsultationOrder = new EventEmitter();
   constructor(
+    private radiologyBadgeService: RadiologyBadgeService,
     private ordersService: OrdersService,
     private visitService: VisitsService,
     private dialog: MatDialog
@@ -115,6 +117,7 @@ export class PatientRadiologySummaryComponent implements OnInit {
 
   onSave(event: Event): void {
     event.stopPropagation();
+    this.radiologyBadgeService.setShowRadiologyBadge(true);
     let orders = [];
     this.formDetails.clear();
     this.addingOrder = true;

ui/src/app/shared/services/radio-badge.service.ts

@@ -0,0 +1,14 @@
+import { Injectable } from '@angular/core';
+import { BehaviorSubject } from 'rxjs';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class RadiologyBadgeService {
+  private showRadiologyBadgeSubject = new BehaviorSubject<boolean>(false);
+  showRadiologyBadge$ = this.showRadiologyBadgeSubject.asObservable();
+
+  setShowRadiologyBadge(value: boolean): void {
+    this.showRadiologyBadgeSubject.next(value);
+  }
+}