1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
|
import { Component, OnDestroy, OnInit, TemplateRef, ViewChild } from '@angular/core';
import { Subscription } from 'rxjs';
import { RbdMirroringService } from '~/app/shared/api/rbd-mirroring.service';
import { TableStatusViewCache } from '~/app/shared/classes/table-status-view-cache';
@Component({
selector: 'cd-mirroring-images',
templateUrl: './image-list.component.html',
styleUrls: ['./image-list.component.scss']
})
export class ImageListComponent implements OnInit, OnDestroy {
@ViewChild('stateTmpl', { static: true })
stateTmpl: TemplateRef<any>;
@ViewChild('syncTmpl', { static: true })
syncTmpl: TemplateRef<any>;
@ViewChild('progressTmpl', { static: true })
progressTmpl: TemplateRef<any>;
subs: Subscription;
image_error: Record<string, any> = {
data: [],
columns: {}
};
image_syncing: Record<string, any> = {
data: [],
columns: {}
};
image_ready: Record<string, any> = {
data: [],
columns: {}
};
tableStatus = new TableStatusViewCache();
constructor(private rbdMirroringService: RbdMirroringService) {}
ngOnInit() {
this.image_error.columns = [
{ prop: 'pool_name', name: $localize`Pool`, flexGrow: 2 },
{ prop: 'name', name: $localize`Image`, flexGrow: 2 },
{
prop: 'state',
name: $localize`State`,
cellTemplate: this.stateTmpl,
flexGrow: 1
},
{ prop: 'description', name: $localize`Issue`, flexGrow: 4 }
];
this.image_syncing.columns = [
{ prop: 'pool_name', name: $localize`Pool`, flexGrow: 2 },
{ prop: 'name', name: $localize`Image`, flexGrow: 2 },
{
prop: 'state',
name: $localize`State`,
cellTemplate: this.stateTmpl,
flexGrow: 1
},
{
prop: 'progress',
name: $localize`Progress`,
cellTemplate: this.progressTmpl,
flexGrow: 2
},
{ prop: 'bytes_per_second', name: $localize`Bytes per second`, flexGrow: 2 },
{ prop: 'entries_behind_primary', name: $localize`Entries behind primary`, flexGrow: 2 }
];
this.image_ready.columns = [
{ prop: 'pool_name', name: $localize`Pool`, flexGrow: 2 },
{ prop: 'name', name: $localize`Image`, flexGrow: 2 },
{
prop: 'state',
name: $localize`State`,
cellTemplate: this.stateTmpl,
flexGrow: 1
},
{ prop: 'description', name: $localize`Description`, flexGrow: 4 }
];
this.subs = this.rbdMirroringService.subscribeSummary((data) => {
this.image_error.data = data.content_data.image_error;
this.image_syncing.data = data.content_data.image_syncing;
this.image_ready.data = data.content_data.image_ready;
this.tableStatus = new TableStatusViewCache(data.status);
});
}
ngOnDestroy(): void {
this.subs.unsubscribe();
}
refresh() {
this.rbdMirroringService.refresh();
}
}
|