Merge pull request #97 from AmpersandTarski/feature/inactive-projects…

…-view-dev

Feature/inactive projects view dev

src/app/project-administration/backend.mock.service.ts

@@ -1,19 +1,25 @@
 import { Injectable } from '@angular/core';
 import { Observable, of } from 'rxjs';
 import { IBackendService } from './backend.service.interface';
-import { ActiveProjectsInterface } from './active-projects/active-projects.interface';
 import { PersonInterface } from './person/person.interface';
 import { testdata as ACTIVE_PROJECTS_TEST_DATA } from './active-projects/testdata';
+import { testdata as INACTIVE_PROJECTS_TEST_DATA } from './inactive-projects/testdata';
 import { testdata as PROJECT_TEST_DATA } from './project/testdata';
 import { testdata as PERSON_TEST_DATA } from './person/testdata';
 import { ProjectInterface } from './project/project.interface';
+import { ActiveProjectsInterface } from './active-projects/active-projects.interface';
+import { InactiveProjectsInterface } from './inactive-projects/inactive-projects.interface';
 
 @Injectable()
 export class BackendMockService implements IBackendService {
   getActiveProjects(): Observable<ActiveProjectsInterface[]> {
     return of(ACTIVE_PROJECTS_TEST_DATA);
   }
 
+  getInactiveProjects(): Observable<InactiveProjectsInterface[]> {
+    return of(INACTIVE_PROJECTS_TEST_DATA);
+  }
+
   getProject(id: string): Observable<ProjectInterface | undefined> {
     return of(PROJECT_TEST_DATA.find((object) => object._id_ === id));
   }

src/app/project-administration/backend.service.interface.ts

@@ -1,12 +1,15 @@
 import { Observable } from 'rxjs';
 import { ActiveProjectsInterface } from './active-projects/active-projects.interface';
+import { InactiveProjectsInterface } from './inactive-projects/inactive-projects.interface';
 import { PersonInterface } from './person/person.interface';
 import { ProjectInterface } from './project/project.interface';
 
 export interface IBackendService {
   // Returns observable that resolves to list of objects according to ActiveProjects interface
   getActiveProjects(): Observable<ActiveProjectsInterface[]>;
 
+  getInactiveProjects(): Observable<InactiveProjectsInterface[]>;
+
   getProject(id: string): Observable<ProjectInterface | undefined>;
 
   getPerson(id: string): Observable<PersonInterface | undefined>;

src/app/project-administration/backend.service.ts

@@ -2,11 +2,12 @@ import { HttpClient } from '@angular/common/http';
 import { Injectable } from '@angular/core';
 import { Observable } from 'rxjs';
 import { ActiveProjectsInterface } from './active-projects/active-projects.interface';
+import { ProjectInterface } from './project/project.interface';
 import { IBackendService } from './backend.service.interface';
 import { ListAllInterfacesInterface } from './list-all-interfaces/list-all-interfaces.interface';
 import { PeopleInterface } from './people/people.interface';
 import { PersonInterface } from './person/person.interface';
-import { ProjectInterface } from './project/project.interface';
+import { InactiveProjectsInterface } from './inactive-projects/inactive-projects.interface';
 
 @Injectable()
 export class BackendService implements IBackendService {
@@ -16,6 +17,10 @@ export class BackendService implements IBackendService {
     return this.http.get<ActiveProjectsInterface[]>('resource/SESSION/1/Active_32_projects');
   }
 
+  public getInactiveProjects(): Observable<InactiveProjectsInterface[]> {
+    return this.http.get<InactiveProjectsInterface[]>('resource/SESSION/1/Inactive_32_projects');
+  }
+
   public getPeople(): Observable<PeopleInterface[]> {
     return this.http.get<PeopleInterface[]>('resource/SESSION/1/People');
   }

src/app/project-administration/inactive-projects/inactive-projects.component.html

@@ -0,0 +1,40 @@
+<h3>Inactive Projects</h3>
+<div *ngIf="data$ | async as data; else loading">
+    <app-box-table [data]="data" sortable sortBy="Name" order="desc">
+        <ng-template boxTableHeader>
+            <ng-container *ngTemplateOutlet="header"></ng-container>
+        </ng-template>
+        <ng-template [boxTableRow]="data" let-row>
+            <td>
+                <app-atomic-object [property]="row.Name" label="Name" isUni isTot crud="cRud"> </app-atomic-object>
+            </td>
+            <td>
+                <app-atomic-bigalphanumeric [property]="row.Description" label="Description" isUni crud="cRud">
+                </app-atomic-bigalphanumeric>
+            </td>
+            <td>
+                <app-atomic-object [property]="row.Projectleider" label="Projectleider" isUni crud="cRUD">
+                </app-atomic-object>
+            </td>
+            <td>
+                <app-atomic-alphanumeric [property]="row.Status" label="Status" isUni isTot crud="cRud">
+                </app-atomic-alphanumeric>
+            </td>
+            <td>
+                <app-atomic-boolean [property]="row.Active" isUni crud="cRUd"></app-atomic-boolean>
+            </td>
+        </ng-template>
+    </app-box-table>
+</div>
+
+<ng-template #header>
+    <th>Name</th>
+    <th>Description</th>
+    <th>Projectleider</th>
+    <th>Status</th>
+    <th>Active</th>
+</ng-template>
+
+<ng-template #loading>
+    <app-box-table-loading [nrOfRows]="10"> </app-box-table-loading>
+</ng-template>

src/app/project-administration/inactive-projects/inactive-projects.component.ts

@@ -0,0 +1,19 @@
+import { Component, OnInit } from '@angular/core';
+import { Observable } from 'rxjs';
+import { BackendService } from '../backend.service';
+import { InactiveProjectsInterface } from './inactive-projects.interface';
+
+@Component({
+  selector: 'app-inactive-projects',
+  templateUrl: './inactive-projects.component.html',
+  styleUrls: ['./inactive-projects.component.css'],
+})
+export class InactiveProjectsComponent implements OnInit {
+  data$!: Observable<InactiveProjectsInterface[]>;
+
+  constructor(private service: BackendService) {}
+
+  ngOnInit(): void {
+    this.data$ = this.service.getInactiveProjects();
+  }
+}

src/app/project-administration/inactive-projects/inactive-projects.interface.ts

@@ -0,0 +1,34 @@
+export interface InactiveProjectsInterface extends ObjectBase {
+  _view_: ProjectNameView;
+  Name: ObjectBase & {
+    _view_: ProjectNameView;
+  };
+  Description: string;
+  Projectleider: ObjectBase & {
+    _view_: PersonNameView;
+  };
+  Status: string;
+  Active: boolean;
+}
+
+interface ObjectBase {
+  _id_: string;
+  _label_: string;
+  _path_: string;
+  _ifcs_: Array<InterfaceRefObject>;
+}
+
+interface PersonNameView {
+  firstName: string;
+  txt1: string;
+  lastName: string;
+}
+
+interface ProjectNameView {
+  name: string;
+}
+
+interface InterfaceRefObject {
+  id: string;
+  label: string;
+}

src/app/project-administration/inactive-projects/testdata.ts

@@ -0,0 +1,112 @@
+export const testdata = [
+  {
+    _id_: '2014_04',
+    _label_: 'Odysseus',
+    _path_: 'resource/SESSION/1/Inactive_32_projects/2014_04',
+    _view_: {
+      name: 'Odysseus',
+    },
+    Name: {
+      _id_: '2014_04',
+      _label_: 'Odysseus',
+      _path_: 'resource/SESSION/1/Inactive_32_projects/2014_04/Name',
+      _view_: {
+        name: 'Odysseus',
+      },
+      _ifcs_: [
+        {
+          id: 'Project',
+          label: 'Project',
+        },
+        {
+          id: 'New_47_edit_32_project',
+          label: 'New/edit project',
+        },
+      ],
+    },
+    Description: 'Research how to destroy Troje.',
+    Projectleider: {
+      _id_: 'p10011',
+      _label_: 'O. Dysseus',
+      _path_: 'resource/SESSION/1/Inactive_32_projects/2014_04/Projectleider/p10011',
+      _view_: {
+        firstName: 'O.',
+        txt1: ' ',
+        lastName: 'Dysseus',
+      },
+      _ifcs_: [
+        {
+          id: 'Person',
+          label: 'Person',
+        },
+      ],
+    },
+    Status: 'Completed',
+    Active: false,
+    _ifcs_: [
+      {
+        id: 'Project',
+        label: 'Project',
+      },
+      {
+        id: 'New_47_edit_32_project',
+        label: 'New/edit project',
+      },
+    ],
+  },
+  {
+    _id_: '2014_03',
+    _label_: 'Release board',
+    _path_: 'resource/SESSION/1/Inactive_32_projects/2014_03',
+    _view_: {
+      name: 'Release board',
+    },
+    Name: {
+      _id_: '2014_03',
+      _label_: 'Release board',
+      _path_: 'resource/SESSION/1/Inactive_32_projects/2014_03/Name',
+      _view_: {
+        name: 'Release board',
+      },
+      _ifcs_: [
+        {
+          id: 'Project',
+          label: 'Project',
+        },
+        {
+          id: 'New_47_edit_32_project',
+          label: 'New/edit project',
+        },
+      ],
+    },
+    Description: 'Make board production-ready',
+    Projectleider: {
+      _id_: 'p10012',
+      _label_: 'P. Leider',
+      _path_: 'resource/SESSION/1/Inactive_32_projects/2014_03/Projectleider/p10012',
+      _view_: {
+        firstName: 'P.',
+        txt1: ' ',
+        lastName: 'Leider',
+      },
+      _ifcs_: [
+        {
+          id: 'Person',
+          label: 'Person',
+        },
+      ],
+    },
+    Status: 'Completed',
+    Active: false,
+    _ifcs_: [
+      {
+        id: 'Project',
+        label: 'Project',
+      },
+      {
+        id: 'New_47_edit_32_project',
+        label: 'New/edit project',
+      },
+    ],
+  },
+];

src/app/project-administration/project-administration.module.ts

@@ -1,6 +1,7 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { ActiveProjectsComponent } from './active-projects/active-projects.component';
+import { InactiveProjectsComponent } from './inactive-projects/inactive-projects.component';
 import { SharedModule } from '../shared/shared.module';
 import { ProjectComponent } from './project/project.component';
 import { PeopleComponent } from './people/people.component';
@@ -18,6 +19,7 @@ const routes: Routes = [
     component: AppLayoutComponent,
     children: [
       { path: 'active-projects', component: ActiveProjectsComponent },
+      { path: 'inactive-projects', component: InactiveProjectsComponent },
       { path: 'project', component: ProjectComponent },
       { path: 'project/:id', component: ProjectComponent },
       { path: 'people', component: PeopleComponent },
@@ -37,6 +39,11 @@ export const menuItems: MenuItem[] = [
         icon: 'pi pi-fw pi-bars',
         routerLink: ['/p/active-projects'],
       },
+      {
+        label: 'Inactive projects',
+        icon: 'pi pi-fw pi-bars',
+        routerLink: ['/p/inactive-projects'],
+      },
       {
         label: 'Project details',
         icon: 'pi pi-fw pi-id-card',
@@ -59,6 +66,7 @@ export const menuItems: MenuItem[] = [
 @NgModule({
   declarations: [
     ActiveProjectsComponent,
+    InactiveProjectsComponent,
     ProjectComponent,
     PersonComponent,
     PeopleComponent,