mirror of
https://github.com/octoleo/syncthing.git
synced 2024-10-03 03:59:01 +00:00
Create states map and set chart-items based on map
This commit is contained in:
parent
02d14c7e9b
commit
7a657bf3c7
@ -1,4 +1,5 @@
|
|||||||
<div fxLayout="row" fxLayoutAlign="space-between start">
|
<div fxLayout="row" fxLayoutAlign="space-between start">
|
||||||
<div></div>
|
<div></div>
|
||||||
<div>{{state}}</div>
|
<div>{{state}}: </div>
|
||||||
|
<div>{{count}}</div>
|
||||||
</div>
|
</div>
|
@ -1,4 +1,4 @@
|
|||||||
import { Component, OnInit } from '@angular/core';
|
import { Component, OnInit, Input } from '@angular/core';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-chart-item',
|
selector: 'app-chart-item',
|
||||||
@ -6,7 +6,8 @@ import { Component, OnInit } from '@angular/core';
|
|||||||
styleUrls: ['./chart-item.component.scss']
|
styleUrls: ['./chart-item.component.scss']
|
||||||
})
|
})
|
||||||
export class ChartItemComponent implements OnInit {
|
export class ChartItemComponent implements OnInit {
|
||||||
state: string = "test"
|
@Input() state: string;
|
||||||
|
@Input() count: number;
|
||||||
constructor() { }
|
constructor() { }
|
||||||
|
|
||||||
ngOnInit(): void {
|
ngOnInit(): void {
|
||||||
|
@ -3,10 +3,9 @@
|
|||||||
<mat-card-content>
|
<mat-card-content>
|
||||||
<div fxLayout="row" fxLayoutAlign="space-between start">
|
<div fxLayout="row" fxLayoutAlign="space-between start">
|
||||||
<app-donut-chart [elementID]="chartID"></app-donut-chart>
|
<app-donut-chart [elementID]="chartID"></app-donut-chart>
|
||||||
<div fxLayout="column" fxLayoutAlign="space-evenly end">
|
<div class="items" fxLayout="column" fxLayoutAlign="space-evenly end">
|
||||||
<app-chart-item></app-chart-item>
|
<app-chart-item *ngFor="let state of states | keyvalue" [state]="state.key" [count]="state.value">
|
||||||
<app-chart-item></app-chart-item>
|
</app-chart-item>
|
||||||
<app-chart-item></app-chart-item>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</mat-card-content>
|
</mat-card-content>
|
||||||
|
@ -12,9 +12,12 @@ import { DonutChartComponent } from '../donut-chart/donut-chart.component';
|
|||||||
export class FolderChartComponent implements OnInit {
|
export class FolderChartComponent implements OnInit {
|
||||||
@ViewChild(DonutChartComponent) donutChart: DonutChartComponent;
|
@ViewChild(DonutChartComponent) donutChart: DonutChartComponent;
|
||||||
chartID: string = 'foldersChart';
|
chartID: string = 'foldersChart';
|
||||||
|
states: Map<string, number>;
|
||||||
elevation: string = cardElevation;
|
elevation: string = cardElevation;
|
||||||
|
|
||||||
constructor(private folderService: FolderService) { }
|
constructor(private folderService: FolderService) {
|
||||||
|
this.states = new Map();
|
||||||
|
}
|
||||||
|
|
||||||
ngOnInit(): void {
|
ngOnInit(): void {
|
||||||
for (let state in Folder.StateType) {
|
for (let state in Folder.StateType) {
|
||||||
@ -32,7 +35,13 @@ export class FolderChartComponent implements OnInit {
|
|||||||
// Get StateType and convert to string
|
// Get StateType and convert to string
|
||||||
const stateType: Folder.StateType = Folder.getStateType(folder);
|
const stateType: Folder.StateType = Folder.getStateType(folder);
|
||||||
const state: string = Folder.stateTypeToString(stateType);
|
const state: string = Folder.stateTypeToString(stateType);
|
||||||
console.log("folder state?", state, folder);
|
|
||||||
|
// Instantiate empty count states
|
||||||
|
if (!this.states.has(state)) {
|
||||||
|
this.states.set(state, 0);
|
||||||
|
}
|
||||||
|
const count: number = this.states.get(state) + 1;
|
||||||
|
this.states.set(state, count);
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user