banana/definma-ui
2
Fork 0
Code Releases Activity

Merge pull request #16 in ~VLE2FE/definma-ui from development to master

Browse Source 
* commit '60be224c79bfb944d3d91e88347020beb3d6b6b9':
  finished changelog
This commit is contained in:
Veit Lukas (PEA4-Fe) 2020-08-10 17:16:31 +02:00
commit 3b79428f97
3 changed files with 41 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/app/changelog/changelog.component.html
View File

@ -27,9 +27,22 @@
<th>Action</th> <th>Action</th>
<th>Data</th> <th>Data</th>
</tr> </tr>
<tr *ngFor="let entry of changelog"> <tr *ngFor="let entry of changelog; index as i" class="clickable" (click)="showDetails(i, sampleModal)">
<td>{{entry.date}}</td> <td>{{entry.date}}</td>
<td>{{entry.action}}</td> <td>{{entry.action}}</td>
<td>{{entry.data | json}}</td> <td>{{entry.data | json}}</td>
</tr> </tr>
</rb-table> </rb-table>
<ng-template #sampleModal>
<h4>Date</h4>
<p class="space-below">{{changelog[modalDetail].date}}</p>
<h4>Action</h4>
<p class="space-below">{{changelog[modalDetail].action}}</p>
<h4>Collection</h4>
<p class="space-below">{{changelog[modalDetail].collection}}</p>
<h4>Conditions</h4>
<p class="space-below">{{changelog[modalDetail].conditions | json}}</p>
<h4>Data</h4>
<p class="space-below">{{changelog[modalDetail].data | json}}</p>
</ng-template>

11
src/app/changelog/changelog.component.scss
View File

@ -1,3 +1,5 @@
@import "~@inst-iot/bosch-angular-ui-components/styles/variables/colors";
.header { .header {
& > * { & > * {
@ -8,3 +10,12 @@
float: right; float: right;
} }
} }
tr.clickable {
background: none;
transition: background-color 0.5s;
&:hover {
background: $color-gray-mercury;
}
}

19
src/app/changelog/changelog.component.ts
View File

@ -1,6 +1,7 @@
import { Component, OnInit } from '@angular/core'; import {Component, OnInit, TemplateRef} from '@angular/core';
import {ChangelogModel} from '../models/changelog.model'; import {ChangelogModel} from '../models/changelog.model';
import {ApiService} from '../services/api.service'; import {ApiService} from '../services/api.service';
import {ModalService} from '@inst-iot/bosch-angular-ui-components';
@Component({ @Component({
selector: 'app-changelog', selector: 'app-changelog',
@ -12,9 +13,11 @@ export class ChangelogComponent implements OnInit {
timestamp = new Date(); timestamp = new Date();
pageSize = 25; pageSize = 25;
changelog: ChangelogModel[] = []; changelog: ChangelogModel[] = [];
modalDetail = 0;
constructor( constructor(
private api: ApiService private api: ApiService,
private modal: ModalService
) { } ) { }
ngOnInit(): void { ngOnInit(): void {
@ -22,11 +25,19 @@ export class ChangelogComponent implements OnInit {
} }
loadChangelog(page = 0) { loadChangelog(page = 0) {
this.api.get<ChangelogModel[]>(`/changelog/${this.timestamp.toISOString()}/${page}/${this.pageSize}`, data => { this.api.get<ChangelogModel[]>(`/changelog/${
new Date(new Date(this.timestamp).getTime() - new Date(this.timestamp).getTimezoneOffset() * 60000).toISOString()
}/${page}/${this.pageSize}`, data => {
this.changelog = data.map(e => new ChangelogModel().deserialize(e)); this.changelog = data.map(e => new ChangelogModel().deserialize(e));
if (page) {
this.timestamp = new Date(this.changelog[0].date); this.timestamp = new Date(this.changelog[0].date);
console.log(this.changelog); }
}); });
} }
showDetails(i: number, modal: TemplateRef<any>) {
this.modalDetail = i;
this.modal.open(modal).then(() => {});
}
} }