diff --git a/apps/frontend/src/app/app.routes.ts b/apps/frontend/src/app/app.routes.ts index 2ebba065..8a099c8b 100644 --- a/apps/frontend/src/app/app.routes.ts +++ b/apps/frontend/src/app/app.routes.ts @@ -7,10 +7,7 @@ export const APP_ROUTES: Route[] = [ path: '', component: HeaderComponent, data: { - breadcrumbs: { - label: 'Home', - url: '/', - }, + breadcrumb: 'Home', title: 'Home Page', subtitle: '', }, @@ -27,10 +24,7 @@ export const APP_ROUTES: Route[] = [ { path: 'facilities', data: { - breadcrumbs: { - label: 'Facilities', - url: 'facilities', - }, + breadcrumb: 'Facilities', title: 'Facilities Dashboard', subtitle: 'List of all Facilities', }, @@ -40,10 +34,7 @@ export const APP_ROUTES: Route[] = [ { path: 'cases', data: { - breadcrumbs: { - label: 'Cases', - url: 'cases', - }, + breadcrumb: 'Cases', title: 'Cases', subtitle: '', }, diff --git a/apps/frontend/src/app/components/header/header.component.html b/apps/frontend/src/app/components/header/header.component.html index 138c30a1..62270c08 100644 --- a/apps/frontend/src/app/components/header/header.component.html +++ b/apps/frontend/src/app/components/header/header.component.html @@ -1,44 +1,38 @@ - - - - Powered by Siemens Xcelerator - - - + + + + Powered by Siemens Xcelerator + + + - - @for (breadcrumb of breadcrumbs(); track breadcrumb.url) { - - } - + + @for (breadcrumb of breadcrumbs(); track breadcrumb; let i=$index; let length=$count) { + + } + - - - + Home - Facilities - Cases + Facilities + Cases + toggle theme + + + + + - - - - - + diff --git a/apps/frontend/src/app/components/header/header.component.spec.ts b/apps/frontend/src/app/components/header/header.component.spec.ts index 8254058b..504fb0c3 100644 --- a/apps/frontend/src/app/components/header/header.component.spec.ts +++ b/apps/frontend/src/app/components/header/header.component.spec.ts @@ -2,19 +2,19 @@ import { ComponentFixture, TestBed } from '@angular/core/testing'; import { ActivatedRoute, NavigationEnd, Router, RouterEvent } from '@angular/router'; import { ReplaySubject } from 'rxjs'; -import { HeaderComponent, IBreadcrumbData } from './header.component'; +import { HeaderComponent } from './header.component'; const HEADER_ROUTES = { root: { snapshot: { data: { - breadcrumbs: { label: 'Layer 1', url: '/layer1' } as IBreadcrumbData, + breadcrumb: 'Layer 1', }, }, firstChild: { snapshot: { data: { - breadcrumbs: { label: 'Layer 2', url: '/layer2' } as IBreadcrumbData, + breadcrumb: 'Layer 2', }, }, }, @@ -30,6 +30,7 @@ describe('HeaderComponent', () => { beforeEach(async () => { routerMock = { events: eventsSubject.asObservable(), + url: '/Layer1/Layer2', } as unknown as Router; await TestBed.configureTestingModule({ @@ -71,8 +72,6 @@ describe('HeaderComponent', () => { eventsSubject.next(new NavigationEnd(1, '', '')); const breadcrumbs = component.breadcrumbs(); - expect(breadcrumbs.length).toBe(2); - expect(breadcrumbs[0]).toEqual({ label: 'Layer 1', url: '/layer1' }); - expect(breadcrumbs[1]).toEqual({ label: 'Layer 2', url: '/layer2' }); + expect(breadcrumbs).toEqual([ 'Layer 1', 'Layer 2' ]); }); }); diff --git a/apps/frontend/src/app/components/header/header.component.ts b/apps/frontend/src/app/components/header/header.component.ts index 043435fb..a6f6311b 100644 --- a/apps/frontend/src/app/components/header/header.component.ts +++ b/apps/frontend/src/app/components/header/header.component.ts @@ -1,108 +1,89 @@ import { CommonModule } from '@angular/common'; import { - ChangeDetectionStrategy, - Component, - computed, - inject, - ViewEncapsulation, + ChangeDetectionStrategy, + Component, + computed, + inject, + ViewEncapsulation, } from '@angular/core'; import { toSignal } from '@angular/core/rxjs-interop'; import { ActivatedRoute, NavigationEnd, Router, RouterLink, RouterOutlet } from '@angular/router'; +import { themeSwitcher } from '@siemens/ix'; import { IxModule } from '@siemens/ix-angular'; -import { find } from 'lodash'; import { filter } from 'rxjs'; import { LegalInformationComponent } from './legal-information/legal-information.component'; -/** - * Breadcrumb data interface - */ -export interface IBreadcrumbData { - label: string; - url: string; -} - /** * Header component */ @Component({ - selector: 'app-header', - standalone: true, - imports: [ CommonModule, IxModule, RouterLink, RouterOutlet, LegalInformationComponent ], - templateUrl: './header.component.html', - styleUrl: './header.component.scss', - encapsulation: ViewEncapsulation.None, - changeDetection: ChangeDetectionStrategy.OnPush, + selector: 'app-header', + standalone: true, + imports: [ CommonModule, IxModule, RouterLink, RouterOutlet, LegalInformationComponent ], + templateUrl: './header.component.html', + styleUrl: './header.component.scss', + encapsulation: ViewEncapsulation.None, + changeDetection: ChangeDetectionStrategy.OnPush, }) export class HeaderComponent { - private readonly _activatedRoute: ActivatedRoute = inject(ActivatedRoute); - private readonly _router: Router = inject(Router); - - readonly routerEvents = toSignal( - this._router.events.pipe(filter((e) => e instanceof NavigationEnd)), - { initialValue: null }, - ); - - readonly breadcrumbs = computed(() => { - this.routerEvents(); - return HeaderComponent.buildBreadcrumbRecursively(this._activatedRoute.root); - }); + private readonly _activatedRoute: ActivatedRoute = inject(ActivatedRoute); + private readonly _router: Router = inject(Router); + private _lightMode = false; - readonly title = computed(() => { - this.routerEvents(); - let currentRoute = this._activatedRoute.root; - while (currentRoute.firstChild) { - currentRoute = currentRoute.firstChild; - } - return currentRoute.snapshot.data['title']; - }); + readonly routerEvents = toSignal( + this._router.events.pipe(filter((e) => e instanceof NavigationEnd)), + { initialValue: null }, + ); - readonly subtitle = computed(() => { - this.routerEvents(); - let curentRoute = this._activatedRoute.root; - while (curentRoute.firstChild) { - curentRoute = curentRoute.firstChild; - } - return curentRoute.snapshot.data['subtitle']; - }); + readonly breadcrumbs = computed(() => { + this.routerEvents(); - readonly backButtonPresent = computed(() => { - const breadcrumbs = this.breadcrumbs(); - let tempHeader = ''; - if (breadcrumbs.length > 0) { - tempHeader = breadcrumbs[breadcrumbs.length - 1].label; - } + const breadcrumbs = []; + let currentRoute = this._activatedRoute.root; + while (currentRoute.firstChild) { + const breadcrumb = currentRoute.snapshot.data['breadcrumb']; + if(breadcrumb && breadcrumbs[breadcrumbs.length - 1] !== breadcrumb) + breadcrumbs.push(breadcrumb) - if (tempHeader === 'Home') { - return false; - } + currentRoute = currentRoute.firstChild; + } - return true; - }); + const breadcrumb = currentRoute.snapshot.data['breadcrumb']; + if(breadcrumb && breadcrumbs[breadcrumbs.length - 1] !== breadcrumb) + breadcrumbs.push(breadcrumb) - /** - * Build breadcrumbs recursively - * @param route - * @param breadcrumbs - */ - static buildBreadcrumbRecursively( - route: ActivatedRoute, - breadcrumbs: IBreadcrumbData[] = [], - ): IBreadcrumbData[] { - const breadcrumbData = route.snapshot.data['breadcrumbs'] as IBreadcrumbData; + return breadcrumbs; + }); - if (breadcrumbData && !find(breadcrumbs, breadcrumbData)) { - breadcrumbs.push(breadcrumbData); - } + /** + * from the right cut the current url until a '/' is reached n times + * So for /cases/10/abc, goBack(1) yields /cases/10 + * + * @param n + */ + cutUrl(n: number) { + const currentUrl = this._router.url; + const urlSegments = currentUrl.split('/'); + return urlSegments.slice(0, urlSegments.length - n).join('/'); + } - if (route.firstChild == null) { - return breadcrumbs; - } + toggleMode() { + themeSwitcher.toggleMode(); + this._lightMode = !this._lightMode; + } - return this.buildBreadcrumbRecursively(route.firstChild, breadcrumbs); - } + getCorrectImage() { + if (this._lightMode) { + return "https://cdn.c2comms.cloud/images/logo-collection/2.1/sie-logo-black-rgb.svg"; + } + return "https://cdn.c2comms.cloud/images/logo-collection/2.1/sie-logo-white-rgb.svg"; + } - goBack() { - this._router.navigate([ this._router.url.split('/').slice(0, -1).join('/') ]); - } + getCorrectIcon() { + if (this._lightMode) { + return "sun-filled"; + } + return "sun"; + } } diff --git a/apps/frontend/src/app/pages/home/home.component.html b/apps/frontend/src/app/pages/home/home.component.html index cf711d6a..8f658603 100644 --- a/apps/frontend/src/app/pages/home/home.component.html +++ b/apps/frontend/src/app/pages/home/home.component.html @@ -1,3 +1,8 @@ + +
diff --git a/libs/cases/frontend/domain/src/lib/application/facades/browse.facades.spec.ts b/libs/cases/frontend/domain/src/lib/application/facades/cases.facade.spec.ts similarity index 76% rename from libs/cases/frontend/domain/src/lib/application/facades/browse.facades.spec.ts rename to libs/cases/frontend/domain/src/lib/application/facades/cases.facade.spec.ts index 25f9d0aa..dee34471 100644 --- a/libs/cases/frontend/domain/src/lib/application/facades/browse.facades.spec.ts +++ b/libs/cases/frontend/domain/src/lib/application/facades/cases.facade.spec.ts @@ -3,10 +3,10 @@ import { ICaseParams } from '@frontend/cases/shared/models'; import { firstValueFrom, of } from 'rxjs'; import { XdCasesRequestService } from '../../infrastructure/cases-request.service'; -import { XdBrowseFacadesService } from './browse.facades'; +import { XdCasesFacade } from './cases.facade'; -describe('XdBrowseFacadesService', () => { - let service: XdBrowseFacadesService; +describe('XdCasesFacade', () => { + let facade: XdCasesFacade; let casesRequestService: XdCasesRequestService; beforeEach(() => { @@ -17,22 +17,22 @@ describe('XdBrowseFacadesService', () => { TestBed.configureTestingModule({ providers: [ - XdBrowseFacadesService, + XdCasesFacade, { provide: XdCasesRequestService, useValue: timeseriesRequestServiceMock }, ], }); - service = TestBed.inject(XdBrowseFacadesService); + facade = TestBed.inject(XdCasesFacade); casesRequestService = TestBed.inject(XdCasesRequestService); }); it('should be created', () => { - expect(service).toBeTruthy(); + expect(facade).toBeTruthy(); }); describe('getAllTimeseries', () => { it('should call getAllTimeseries of TimeseriesRequestService', async () => { - const response = await firstValueFrom(service.getAllCases()); + const response = await firstValueFrom(facade.getAllCases()); expect(casesRequestService.getAllCases).toHaveBeenCalledTimes(1); expect(response).toEqual([]); @@ -43,7 +43,7 @@ describe('XdBrowseFacadesService', () => { it('should call getTimeSeries of TimeseriesRequestService with correct parameters', async () => { const params: ICaseParams = { id: 1 } as ICaseParams; - const response = await firstValueFrom(service.getTimeSeries(params)); + const response = await firstValueFrom(facade.getTimeSeries(params)); expect(casesRequestService.getTimeSeries).toHaveBeenCalledWith(params); expect(response).toEqual({}); diff --git a/libs/cases/frontend/domain/src/lib/application/facades/browse.facades.ts b/libs/cases/frontend/domain/src/lib/application/facades/cases.facade.ts similarity index 96% rename from libs/cases/frontend/domain/src/lib/application/facades/browse.facades.ts rename to libs/cases/frontend/domain/src/lib/application/facades/cases.facade.ts index 4e11ade1..89d8a9c5 100644 --- a/libs/cases/frontend/domain/src/lib/application/facades/browse.facades.ts +++ b/libs/cases/frontend/domain/src/lib/application/facades/cases.facade.ts @@ -8,7 +8,7 @@ import { XdCasesRequestService } from '../../infrastructure/cases-request.servic * Browse facades service. */ @Injectable({ providedIn: 'root' }) -export class XdBrowseFacadesService { +export class XdCasesFacade { private readonly _scanService = inject(XdCasesRequestService); /** diff --git a/libs/cases/frontend/domain/src/lib/application/facades/index.ts b/libs/cases/frontend/domain/src/lib/application/facades/index.ts index 069f0a8a..5ce2c239 100644 --- a/libs/cases/frontend/domain/src/lib/application/facades/index.ts +++ b/libs/cases/frontend/domain/src/lib/application/facades/index.ts @@ -1 +1 @@ -export * from './browse.facades'; +export * from './cases.facade'; diff --git a/libs/cases/frontend/shell/src/lib/shell.routes.ts b/libs/cases/frontend/shell/src/lib/shell.routes.ts index be449522..aecaa33e 100644 --- a/libs/cases/frontend/shell/src/lib/shell.routes.ts +++ b/libs/cases/frontend/shell/src/lib/shell.routes.ts @@ -25,12 +25,7 @@ export const CASES_SHELL_ROUTES: Route[] = [ // Route to create a case path: 'create', data: { - breadcrumbs: { - label: 'Create', - url: 'cases/create', - }, - title: 'Create a Case', - subtitle: '', + breadcrumb: 'Create', }, loadComponent: () => import('cases-frontend-view').then((m) => m.CreateCaseComponent), @@ -39,12 +34,7 @@ export const CASES_SHELL_ROUTES: Route[] = [ // Route to detail case path: ':id', data: { - breadcrumbs: { - label: 'Details', - url: 'cases/:id', - }, - title: 'Detail of case', - subtitle: '', + breadcrumb: 'Details', }, loadComponent: () => import('cases-frontend-view').then((m) => m.DetailCaseComponent), diff --git a/libs/cases/frontend/view/src/lib/components/case-browse/case-browse.component.html b/libs/cases/frontend/view/src/lib/components/case-browse/case-browse.component.html index 10463b87..6f576582 100644 --- a/libs/cases/frontend/view/src/lib/components/case-browse/case-browse.component.html +++ b/libs/cases/frontend/view/src/lib/components/case-browse/case-browse.component.html @@ -1,30 +1,37 @@
- Create Case + Create Case
+ + -
-
- +
+ open - - in progress + in progress - - on hold - - + - done + done cancelled archived -
+
emergencies @@ -58,8 +62,7 @@ high medium @@ -82,42 +85,41 @@ incident annotation
-
+
- - - - - - - - - - - - - - @for (_case of _sortedCases(); track _case.id) { - - - +
#TitleStatusPriorityTypeDue toDescription
{{ _case.handle }}{{ _case.title }}
+ + + + + + + + + + + + + @for (_case of _sortedCases(); track _case.id) { + + + - + - - - - } - -
#TitleStatusPriorityTypeDue toDescription
{{ _case.handle }}{{ _case.title }} {{ _case.status }}{{ _case.priority }}{{ _case.priority }} {{ _case.type }}{{ _case.dueDate }}{{ _case.description }}
+ {{ _case.dueDate }} + {{ _case.description }} + + } + + diff --git a/libs/cases/frontend/view/src/lib/components/case-browse/case-browse.component.scss b/libs/cases/frontend/view/src/lib/components/case-browse/case-browse.component.scss index 13514df1..b2b2f685 100644 --- a/libs/cases/frontend/view/src/lib/components/case-browse/case-browse.component.scss +++ b/libs/cases/frontend/view/src/lib/components/case-browse/case-browse.component.scss @@ -1,7 +1,27 @@ -@import 'libs/cases/shared/models/src/lib/styles/case.scss'; +.table { + cursor: pointer; + & .emergency { + background-color: #ff26401a; + } -.table .clickable-row { - cursor: pointer; /* Changes the cursor to a hand */ + & .status-open { + } + + & .status-inprogress { + color: #ff9000; + } + + & .status-overdue { + color: #ff2640; + } + + & .status-onhold { + color: #00b5d1; + } + + & .status-done { + color: #01c151; + } } .toggle-pill { diff --git a/libs/cases/frontend/view/src/lib/components/case-browse/case-browse.component.ts b/libs/cases/frontend/view/src/lib/components/case-browse/case-browse.component.ts index 2e1f05b0..1d773a2d 100644 --- a/libs/cases/frontend/view/src/lib/components/case-browse/case-browse.component.ts +++ b/libs/cases/frontend/view/src/lib/components/case-browse/case-browse.component.ts @@ -8,8 +8,8 @@ import { ViewEncapsulation, } from '@angular/core'; import { toSignal } from '@angular/core/rxjs-interop'; -import { RouterLink } from '@angular/router'; -import { XdBrowseFacadesService } from '@frontend/cases/frontend/domain'; +import { ActivatedRoute, Router, RouterLink } from '@angular/router'; +import { XdCasesFacade } from '@frontend/cases/frontend/domain'; import { ICaseResponse } from '@frontend/cases/shared/models'; import { IxModule } from '@siemens/ix-angular'; @@ -40,8 +40,8 @@ export class CaseBrowseComponent { protected readonly showStatusCancelled = signal(false); protected readonly showStatusArchived = signal(false); - protected readonly _browseFacade = inject(XdBrowseFacadesService); - protected readonly _cases = toSignal(this._browseFacade.getAllCases()); + protected readonly _casesFacade = inject(XdCasesFacade); + protected readonly _cases = toSignal(this._casesFacade.getAllCases()); protected readonly _sortedCases = computed(() => { let cases = this._cases(); if (cases === undefined) { @@ -131,6 +131,11 @@ export class CaseBrowseComponent { return cases; }); + constructor( + protected router: Router, + protected route: ActivatedRoute + ) {} + getStatusClasses(_case: ICaseResponse) { return { emergency: _case.priority === 'EMERGENCY', diff --git a/libs/cases/frontend/view/src/lib/components/cases-browse/index.ts b/libs/cases/frontend/view/src/lib/components/cases-browse/index.ts deleted file mode 100644 index a9133b58..00000000 --- a/libs/cases/frontend/view/src/lib/components/cases-browse/index.ts +++ /dev/null @@ -1 +0,0 @@ -export * from './case-browse.component'; diff --git a/libs/cases/frontend/view/src/lib/components/create-case/create-case.component.html b/libs/cases/frontend/view/src/lib/components/create-case/create-case.component.html index a2e5899a..9eb9dd1a 100644 --- a/libs/cases/frontend/view/src/lib/components/create-case/create-case.component.html +++ b/libs/cases/frontend/view/src/lib/components/create-case/create-case.component.html @@ -1,3 +1,11 @@ + +
{ @@ -9,6 +10,9 @@ describe('CreateCaseComponent', () => { beforeEach(async () => { await TestBed.configureTestingModule({ imports: [ CreateCaseComponent, HttpClientTestingModule ], + providers: [ + { provide: ActivatedRoute, useValue: {}, }, + ] }).compileComponents(); fixture = TestBed.createComponent(CreateCaseComponent); diff --git a/libs/cases/frontend/view/src/lib/components/create-case/create-case.component.ts b/libs/cases/frontend/view/src/lib/components/create-case/create-case.component.ts index a4f1b13b..389e573d 100644 --- a/libs/cases/frontend/view/src/lib/components/create-case/create-case.component.ts +++ b/libs/cases/frontend/view/src/lib/components/create-case/create-case.component.ts @@ -8,9 +8,9 @@ import { } from '@angular/core'; import { toSignal } from '@angular/core/rxjs-interop'; import { FormsModule, NG_VALUE_ACCESSOR, NgForm } from '@angular/forms'; -import { RouterLink } from '@angular/router'; +import { ActivatedRoute, Router, RouterLink } from '@angular/router'; import { faker } from '@faker-js/faker'; -import { XdBrowseFacadesService } from '@frontend/cases/frontend/domain'; +import { XdCasesFacade } from '@frontend/cases/frontend/domain'; import { ECasePriority, ECaseStatus, ECaseType } from '@frontend/cases/shared/models'; import { XdBrowseFacade } from '@frontend/facilities/frontend/domain'; import { IxModule, IxSelectCustomEvent, ToastService } from '@siemens/ix-angular'; @@ -36,15 +36,18 @@ import { DateDropdownWrapperComponent } from './date-dropdown-accessor'; }) export class CreateCaseComponent implements OnInit { private readonly _browseFacade = inject(XdBrowseFacade); - protected readonly _browseFacade2 = inject(XdBrowseFacadesService); + protected readonly _casesFacade = inject(XdCasesFacade); protected readonly facilities = toSignal(this._browseFacade.getAllFacilities()); facilityPlaceholder = signal('Select Facility'); typePlaceholder = signal('Select Type'); priorityPlaceholder = signal('Select Priority'); - constructor(private readonly toastService: ToastService) { - } + constructor( + protected readonly router: Router, + protected readonly route: ActivatedRoute, + private readonly toastService: ToastService + ) {} casePriority = ECasePriority; caseType = ECaseType; @@ -75,7 +78,7 @@ export class CreateCaseComponent implements OnInit { if (form.valid) { const caseData = this.mapFormData(form.form.value); - this._browseFacade2.createCase(caseData).subscribe({ + this._casesFacade.createCase(caseData).subscribe({ // eslint-disable-next-line @typescript-eslint/no-unused-vars next: (_) => { this.showSuccessToast(); diff --git a/libs/cases/frontend/view/src/lib/components/detail-case/detail-case.component.html b/libs/cases/frontend/view/src/lib/components/detail-case/detail-case.component.html index 53b9fd37..d250c233 100644 --- a/libs/cases/frontend/view/src/lib/components/detail-case/detail-case.component.html +++ b/libs/cases/frontend/view/src/lib/components/detail-case/detail-case.component.html @@ -1,3 +1,5 @@ +@if(casedetail(); as _case){ + {{ isEditing ? 'Submit changes' : 'Update Case' }} @@ -7,8 +9,17 @@ Delete Case + + + - @if(casedetail(); as _case){ +

_Case {{ _case.handle }}

@@ -67,5 +78,5 @@

_Case {{ _case.handle }}

- } +} diff --git a/libs/cases/frontend/view/src/lib/components/detail-case/detail-case.component.ts b/libs/cases/frontend/view/src/lib/components/detail-case/detail-case.component.ts index 768107b4..65423b4d 100644 --- a/libs/cases/frontend/view/src/lib/components/detail-case/detail-case.component.ts +++ b/libs/cases/frontend/view/src/lib/components/detail-case/detail-case.component.ts @@ -2,8 +2,8 @@ import { CommonModule } from '@angular/common'; import { ChangeDetectionStrategy, Component, computed, inject, ViewEncapsulation } from '@angular/core'; import { toSignal } from '@angular/core/rxjs-interop'; import { FormsModule } from '@angular/forms'; -import { ActivatedRoute, RouterLink } from '@angular/router'; -import { XdBrowseFacadesService } from '@frontend/cases/frontend/domain'; +import { ActivatedRoute, Router, RouterLink } from '@angular/router'; +import { XdCasesFacade } from '@frontend/cases/frontend/domain'; import { ECasePriority, ECaseStatus, ECaseType, ICaseResponse } from '@frontend/cases/shared/models'; import { IxModule, ModalService, ToastService } from '@siemens/ix-angular'; @@ -13,15 +13,15 @@ import DeleteModalComponent from './delete-modal/deleteModal.component'; @Component({ selector: 'lib-detail-case', standalone: true, - imports: [ CommonModule, FormsModule, IxModule, RouterLink ], + imports: [CommonModule, FormsModule, IxModule, RouterLink], templateUrl: './detail-case.component.html', - styleUrls: [ './detail-case.component.scss' ], + styleUrls: ['./detail-case.component.scss'], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, }) export class DetailCaseComponent { - private readonly _browseFacade = inject(XdBrowseFacadesService); - protected readonly _cases = toSignal(this._browseFacade.getAllCases()); + private readonly _casesFacade = inject(XdCasesFacade); + protected readonly _cases = toSignal(this._casesFacade.getAllCases()); protected readonly casedetail = computed(() => { const _case = this._cases(); if (_case === undefined) { @@ -33,15 +33,18 @@ export class DetailCaseComponent { isEditing = false; datePattern = /^\d{4}-\d{2}-\d{2}T00:00:00\.000Z$/; - - constructor(private route: ActivatedRoute, private readonly _modalService: ModalService, private readonly toastService: ToastService) { - } + constructor( + protected router: Router, + protected route: ActivatedRoute, + private readonly _modalService: ModalService, + private readonly toastService: ToastService + ) {} deleteCase() { const caseId = this.mapCaseId(this.casedetail()); if (caseId !== undefined) { // The subscribe is necessary, otherwise the request is not sent - this._browseFacade.deleteCase(caseId).subscribe(); + this._casesFacade.deleteCase(caseId).subscribe(); } } @@ -81,7 +84,7 @@ export class DetailCaseComponent { onSubmit(): void { const casedetail = this.casedetail(); - if(casedetail !== undefined) { + if (casedetail !== undefined) { const validationString = this.validateForm(casedetail); if (validationString === 'valid') { const caseId = this.mapCaseId(this.casedetail()); @@ -89,7 +92,7 @@ export class DetailCaseComponent { if (caseId !== undefined && caseData !== undefined) { // The subscribe is necessary, otherwise the request is not sent - this._browseFacade.updateCase(caseId, caseData).subscribe({}); + this._casesFacade.updateCase(caseId, caseData).subscribe({}); } this.isEditing = false; } else { @@ -98,7 +101,7 @@ export class DetailCaseComponent { } } - validateForm(casedetail: ICaseResponse ) { + validateForm(casedetail: ICaseResponse) { if (casedetail !== undefined) { diff --git a/libs/cases/shared/models/src/lib/styles/case.scss b/libs/cases/shared/models/src/lib/styles/case.scss deleted file mode 100644 index 3669394a..00000000 --- a/libs/cases/shared/models/src/lib/styles/case.scss +++ /dev/null @@ -1,28 +0,0 @@ -.table { - color: #777784; - - & .emergency { - background-color: #ff26401a; - color: #ffffffbf; - } - - & .status-open { - color: #ffffffbf; - } - - & .status-inprogress { - color: #ff9000; - } - - & .status-overdue { - color: #ff2640; - } - - & .status-onhold { - color: #00b5d1; - } - - & .status-done { - color: #01c151; - } -} diff --git a/libs/facilities/frontend/shell/src/lib/shell.routes.ts b/libs/facilities/frontend/shell/src/lib/shell.routes.ts index 9e666571..8234a557 100644 --- a/libs/facilities/frontend/shell/src/lib/shell.routes.ts +++ b/libs/facilities/frontend/shell/src/lib/shell.routes.ts @@ -24,12 +24,7 @@ export const FACILITIES_SHELL_ROUTES: Route[] = [ // Route to detail page path: ':id', data: { - breadcrumbs: { - label: 'Details', - url: 'facilities/:id', - }, - title: 'Details of Facility', - subtitle: '', + breadcrumb: 'Details', }, loadComponent: () => import('facilities-frontend-view').then((m) => m.XdDetailPage), }, diff --git a/libs/facilities/frontend/view/src/lib/components/browse/browse.page.html b/libs/facilities/frontend/view/src/lib/components/browse/browse.page.html index 58bf2216..70f718dd 100644 --- a/libs/facilities/frontend/view/src/lib/components/browse/browse.page.html +++ b/libs/facilities/frontend/view/src/lib/components/browse/browse.page.html @@ -6,6 +6,15 @@ {{ filter() ? 'Remove Filter for Issues' : 'Filter Facilities with Issues' }}
+ + + @if (showCardList) { @if (facilities(); as facilities) { diff --git a/libs/facilities/frontend/view/src/lib/components/browse/browse.page.ts b/libs/facilities/frontend/view/src/lib/components/browse/browse.page.ts index 7d4a39a9..57b43180 100644 --- a/libs/facilities/frontend/view/src/lib/components/browse/browse.page.ts +++ b/libs/facilities/frontend/view/src/lib/components/browse/browse.page.ts @@ -8,7 +8,7 @@ import { ViewEncapsulation, } from '@angular/core'; import { toSignal } from '@angular/core/rxjs-interop'; -import { RouterLink } from '@angular/router'; +import { ActivatedRoute, Router, RouterLink } from '@angular/router'; import { XdBrowseFacade } from '@frontend/facilities/frontend/domain'; import { StatusToColorRecord } from '@frontend/facilities/frontend/models'; import { IxModule } from '@siemens/ix-angular'; @@ -42,7 +42,10 @@ export class XdBrowsePage { } }); - toggleView() { + constructor(protected readonly router: Router, protected readonly route: ActivatedRoute) { + } + + toggleView() { this.showCardList = !this.showCardList; } diff --git a/libs/facilities/frontend/view/src/lib/components/detail/detail.page.html b/libs/facilities/frontend/view/src/lib/components/detail/detail.page.html index 44267522..e81ab976 100644 --- a/libs/facilities/frontend/view/src/lib/components/detail/detail.page.html +++ b/libs/facilities/frontend/view/src/lib/components/detail/detail.page.html @@ -1,4 +1,13 @@ @if (facility(); as facility) { + + +
diff --git a/libs/facilities/frontend/view/src/lib/components/detail/detail.page.ts b/libs/facilities/frontend/view/src/lib/components/detail/detail.page.ts index 900b1b9b..a72668b0 100644 --- a/libs/facilities/frontend/view/src/lib/components/detail/detail.page.ts +++ b/libs/facilities/frontend/view/src/lib/components/detail/detail.page.ts @@ -10,7 +10,7 @@ import { ViewEncapsulation, } from '@angular/core'; import { toSignal } from '@angular/core/rxjs-interop'; -import { ActivatedRoute, RouterLink } from '@angular/router'; +import { ActivatedRoute, Router, RouterLink } from '@angular/router'; import { XdDetailsFacade } from '@frontend/facilities/frontend/domain'; import { StatusToColorRecord } from '@frontend/facilities/frontend/models'; import { themeSwitcher } from '@siemens/ix'; @@ -36,7 +36,7 @@ export class XdDetailPage implements OnInit { protected theme = convertThemeName(themeSwitcher.getCurrentTheme()); protected readonly locked = signal(true); protected readonly StatusToColorRecord = StatusToColorRecord; - private readonly _assetId = this._route.snapshot.params['id']; + private readonly _assetId = this.route.snapshot.params['id']; private readonly _currentTime = new Date(); private readonly _28MinutesAgo = new Date(this._currentTime.getTime() - 28 * 60 * 1000); private readonly _detailsFacade = inject(XdDetailsFacade); @@ -179,7 +179,8 @@ export class XdDetailPage implements OnInit { }); constructor( - private _route: ActivatedRoute, + protected router: Router, + protected route: ActivatedRoute, private readonly _modalService: ModalService, ) {}