Make footer at the bottom

angular.json

@@ -32,7 +32,6 @@
               "src/yareta-app-theme.scss",
               "src/styles.scss",
               "node_modules/primeicons/primeicons.css",
-              "node_modules/primeng/resources/themes/nova-light/theme.css",
               "node_modules/primeng/resources/primeng.min.css"
             ],
             "scripts": [],
@@ -95,7 +94,6 @@
               "src/yareta-app-theme.scss",
               "src/styles.scss",
               "node_modules/primeicons/primeicons.css",
-              "node_modules/primeng/resources/themes/nova-light/theme.css",
               "node_modules/primeng/resources/primeng.min.css"
             ],
             "scripts": [],

src/app/app.component.html

@@ -24,6 +24,4 @@
 
 <router-outlet></router-outlet>
 
-<div class="footer">
-  <div class="copyrights">All rights reserved by DLCN and the Univerity of Geneva</div>
-</div>
+<dlcm-footer></dlcm-footer>

src/app/app.module.ts

@@ -18,17 +18,23 @@ import {environment} from '../environments/environment';
 import {AppComponent} from './app.component';
 import {AppService} from './app.service';
 import {authConfig, authModuleConfig} from './auth.config';
+import {FooterComponent} from './components/footer/footer.component';
 import {HomeComponent} from './components/home/home.component';
 import {LoginComponent} from './components/login/login.component';
 import {PageNotFoundComponent} from './components/page-not-found/page-not-found.component';
 import {AppRoutingModule} from './module/app-routing.module';
 
+const components = [
+  AppComponent,
+  HomeComponent,
+  PageNotFoundComponent,
+  LoginComponent,
+  FooterComponent,
+];
+
 @NgModule({
   declarations: [
-    AppComponent,
-    HomeComponent,
-    PageNotFoundComponent,
-    LoginComponent,
+    ...components,
   ],
   imports: [
     BrowserModule,

src/app/components/footer/footer.component.html

+<div class="footer">
+  <div class="copyrights">All rights reserved by DLCM and the Univerity of Geneva</div>
+</div>

src/app/components/footer/footer.component.scss

+.footer {
+  position: fixed;
+  left: 0;
+  bottom: 0;
+  width: 100%;
+  background-color: black;
+  color: white;
+  height: 40px;
+  text-align: center;
+}

src/app/components/footer/footer.component.spec.ts

+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { FooterComponent } from './footer.component';
+
+describe('FooterComponent', () => {
+  let component: FooterComponent;
+  let fixture: ComponentFixture<FooterComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ FooterComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(FooterComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/components/footer/footer.component.ts

+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'dlcm-footer',
+  templateUrl: './footer.component.html',
+  styleUrls: ['./footer.component.scss']
+})
+export class FooterComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+}

src/app/deposit/components/table-deposits/table-deposits.component.html

@@ -6,10 +6,10 @@
       </th>
     </tr>
   </ng-template>
-  <ng-template pTemplate="body" let-value let-columns="columns">
-    <tr>
+  <ng-template pTemplate="body" let-rowData let-value let-columns="columns">
+    <tr pSelectableRow="row">
       <td *ngFor="let col of columns">
-        {{value[col.field]}}
+        {{getCellData(rowData, col)}}
       </td>
     </tr>
   </ng-template>

src/app/deposit/components/table-deposits/table-deposits.component.ts

@@ -22,10 +22,21 @@ export class TableDepositsComponent implements OnInit {
     this.cols = [
       {field: 'title', header: 'Titre'},
       {field: 'publicationDate', header: 'Date de publication'},
-      {field: 'creation', header: 'Créé le'},
+      {field: 'creation.when', header: 'Créé le'},
       {field: 'lastUpdate', header: 'Modifié le'},
       {field: 'status', header: 'Statut'},
     ];
   }
 
+
+  getCellData(row: any, col: any): any {
+    const nestedProperties: string[] = col.field.split('.');
+    let value: any = row;
+    for (const prop of nestedProperties) {
+      value = value[prop];
+    }
+
+    return value;
+  }
+
 }