Skip to content
GitLab
Menu
Projects
Groups
Snippets
Help
Projects
Groups
Snippets
Loading...
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
Menu
Open sidebar
truenas-rk3588
webui
Commits
427b27b4
Commit
427b27b4
authored
3 years ago
by
Evgeny Stepanovych
Browse files
Options
Download
Plain Diff
NAS-114413: Porting changes
parents
191e0f03
de0ac49e
No related merge requests found
Changes
6
Hide whitespace changes
Inline
Side-by-side
Showing
6 changed files
src/app/interfaces/reporting.interface.ts
+3
-3
src/app/interfaces/reporting.interface.ts
src/app/pages/reports-dashboard/components/report/report.component.html
+3
-3
...reports-dashboard/components/report/report.component.html
src/app/pages/reports-dashboard/components/report/report.component.scss
+2
-2
...reports-dashboard/components/report/report.component.scss
src/app/pages/reports-dashboard/components/report/report.component.ts
+47
-9
...s/reports-dashboard/components/report/report.component.ts
src/app/pages/system/advanced/advanced-settings.component.html
+3
-8
...pp/pages/system/advanced/advanced-settings.component.html
src/app/pages/system/advanced/advanced-settings.component.ts
+0
-2
src/app/pages/system/advanced/advanced-settings.component.ts
with
58 additions
and
27 deletions
+58
-27
src/app/interfaces/reporting.interface.ts
View file @
427b27b4
...
...
@@ -117,6 +117,8 @@ export interface ReportingParams {
identifier
:
string
;
}
export
type
ReportingAggregationKeys
=
'
min
'
|
'
mean
'
|
'
max
'
;
export
interface
ReportingData
{
end
:
number
;
identifier
:
string
;
...
...
@@ -126,8 +128,6 @@ export interface ReportingData {
step
:
number
;
data
:
number
[][];
aggregations
:
{
min
:
number
[];
mean
:
number
[];
max
:
number
[];
[
key
in
ReportingAggregationKeys
]:
string
[];
};
}
This diff is collapsed.
Click to expand it.
src/app/pages/reports-dashboard/components/report/report.component.html
View file @
427b27b4
...
...
@@ -68,7 +68,7 @@
<mat-card-content
fxLayout=
"row wrap"
fxLayout.gt-xs=
"row wrap"
fxLayoutAlign=
"space-between start"
fxFlex=
"100"
*ngIf=
"!report?.errorConf"
>
<!-- Chart -->
<div
class=
"chart-wrapper-outer"
fxFlex=
"calc(100% - 4
0
0px)"
>
<div
class=
"chart-wrapper-outer"
fxFlex=
"calc(100% - 4
2
0px)"
>
<div
class=
"chart-wrapper"
>
<linechart
*ngIf=
"report && data && chartColors"
...
...
@@ -116,7 +116,7 @@
</div>
</div>
<section
class=
"legend"
#legendElement
fxFlex=
"4
0
0px"
fxLayout=
"column"
fxLayoutAlign=
"start"
>
<section
class=
"legend"
#legendElement
fxFlex=
"4
2
0px"
fxLayout=
"column"
fxLayoutAlign=
"start"
>
<div
*ngIf=
"report && data && data.legend"
class=
"legend-timestamp"
fxFlex=
"32px"
>
<div>
<span
*ngIf=
"data && legendData && legendData.xHTML"
>
...
...
@@ -165,7 +165,7 @@
<ng-container
*ngIf=
"data && data.aggregations"
>
<td
*ngFor=
"let key of aggregationKeys"
class=
"report-analytics"
>
<span>
{{ data.aggregations[
aggregationKey(
key
)
][i] ? data.aggregations[
aggregationKey(
key
)
][i] : 'null' }}
{{ data.aggregations[key][i] ? data.aggregations[key][i] : 'null' }}
</span>
</td>
</ng-container>
...
...
This diff is collapsed.
Click to expand it.
src/app/pages/reports-dashboard/components/report/report.component.scss
View file @
427b27b4
...
...
@@ -37,7 +37,7 @@
table
.legend-table
{
display
:
table
;
margin-right
:
36px
;
width
:
4
0
0px
;
width
:
4
2
0px
;
}
tr
.header
th
{
...
...
@@ -236,7 +236,7 @@ span.disk-detail-subtitle {
.disk-detail-temps-bar
{
border-bottom
:
solid
3px
;
border-image
:
linear-gradient
(
to
right
,
lightseagreen
,
yellow
45%
,
red
55%
)
15
;
border-image
:
linear-gradient
(
to
right
,
lightseagreen
,
yellow
45%
,
red
55%
);
padding-bottom
:
5px
;
}
...
...
This diff is collapsed.
Click to expand it.
src/app/pages/reports-dashboard/components/report/report.component.ts
View file @
427b27b4
...
...
@@ -14,12 +14,13 @@ import { Store } from '@ngrx/store';
import
{
TranslateService
}
from
'
@ngx-translate/core
'
;
import
{
UUID
}
from
'
angular2-uuid
'
;
import
{
add
,
sub
}
from
'
date-fns
'
;
import
_
from
'
lodash
'
;
import
{
filter
,
take
}
from
'
rxjs/operators
'
;
import
{
ProductType
}
from
'
app/enums/product-type.enum
'
;
import
{
CoreEvent
}
from
'
app/interfaces/events
'
;
import
{
ThemeChangedEvent
,
ThemeDataEvent
}
from
'
app/interfaces/events/theme-events.interface
'
;
import
{
ReportingGraph
}
from
'
app/interfaces/reporting-graph.interface
'
;
import
{
ReportingData
}
from
'
app/interfaces/reporting.interface
'
;
import
{
ReportingAggregationKeys
,
ReportingData
}
from
'
app/interfaces/reporting.interface
'
;
import
{
Theme
}
from
'
app/interfaces/theme.interface
'
;
import
{
EmptyConfig
,
EmptyType
}
from
'
app/modules/entity/entity-empty/entity-empty.component
'
;
import
{
WidgetComponent
}
from
'
app/pages/dashboard/components/widget/widget.component
'
;
...
...
@@ -82,8 +83,8 @@ export class ReportComponent extends WidgetComponent implements AfterViewInit, O
return
this
.
identifier
?
trimmed
.
replace
(
/{identifier}/
,
this
.
identifier
)
:
this
.
report
.
title
;
}
get
aggregationKeys
():
(
keyof
Reporting
Data
[
'
a
ggregation
s
'
])
[]
{
return
Object
.
keys
(
this
.
data
.
aggregations
)
as
(
keyof
Reporting
Data
[
'
a
ggregation
s
'
])
[];
get
aggregationKeys
():
Reporting
A
ggregation
Keys
[]
{
return
Object
.
keys
(
this
.
data
.
aggregations
)
as
Reporting
A
ggregation
Keys
[];
}
legendData
:
any
=
{};
...
...
@@ -135,6 +136,47 @@ export class ReportComponent extends WidgetComponent implements AfterViewInit, O
return
result
.
toLowerCase
()
!==
'
invalid date
'
?
result
:
null
;
}
formatInterfaceUnit
(
value
:
string
):
string
{
if
(
value
&&
value
.
split
(
'
'
,
2
)[
0
]
!==
'
0
'
)
{
if
(
value
.
split
(
'
'
,
2
)[
1
])
{
value
+=
'
/s
'
;
}
else
{
value
+=
'
b/s
'
;
}
}
return
value
;
}
formatLegendSeries
(
series
:
any
[],
data
:
ReportingData
):
any
[]
{
switch
(
data
.
name
)
{
case
'
interface
'
:
series
.
forEach
((
element
)
=>
{
element
.
yHTML
=
this
.
formatInterfaceUnit
(
element
.
yHTML
);
});
break
;
default
:
break
;
}
return
series
;
}
formatData
(
data
:
ReportingData
):
ReportingData
{
switch
(
data
.
name
)
{
case
'
interface
'
:
if
(
data
.
aggregations
)
{
for
(
const
key
in
data
.
aggregations
)
{
_
.
set
(
data
.
aggregations
,
key
,
data
.
aggregations
[
key
as
ReportingAggregationKeys
].
map
(
(
value
)
=>
this
.
formatInterfaceUnit
(
value
),
));
}
}
break
;
default
:
break
;
}
return
data
;
}
constructor
(
public
router
:
Router
,
public
translate
:
TranslateService
,
...
...
@@ -150,13 +192,14 @@ export class ReportComponent extends WidgetComponent implements AfterViewInit, O
this
.
core
.
register
({
observerClass
:
this
,
eventName
:
'
ReportData-
'
+
this
.
chartId
}).
pipe
(
untilDestroyed
(
this
),
).
subscribe
((
evt
:
CoreEvent
)
=>
{
this
.
data
=
evt
.
data
;
this
.
data
=
this
.
formatData
(
evt
.
data
)
;
this
.
handleError
(
evt
);
});
this
.
core
.
register
({
observerClass
:
this
,
eventName
:
'
LegendEvent-
'
+
this
.
chartId
}).
pipe
(
untilDestroyed
(
this
)).
subscribe
((
evt
:
CoreEvent
)
=>
{
const
clone
=
{
...
evt
.
data
};
clone
.
xHTML
=
this
.
formatTime
(
evt
.
data
.
xHTML
);
clone
.
series
=
this
.
formatLegendSeries
(
evt
.
data
.
series
,
this
.
data
);
this
.
legendData
=
clone
;
});
...
...
@@ -202,11 +245,6 @@ export class ReportComponent extends WidgetComponent implements AfterViewInit, O
}
}
// TODO: Helps with template type checking. To be removed when 'strict' checks are enabled.
aggregationKey
(
key
:
keyof
ReportingData
[
'
aggregations
'
]):
keyof
ReportingData
[
'
aggregations
'
]
{
return
key
;
}
private
async
setupData
(
changes
:
SimpleChanges
):
Promise
<
void
>
{
const
zoom
=
this
.
zoomLevels
[
this
.
timeZoomIndex
];
const
rrdOptions
=
await
this
.
convertTimespan
(
zoom
.
timespan
);
...
...
This diff is collapsed.
Click to expand it.
src/app/pages/system/advanced/advanced-settings.component.html
View file @
427b27b4
...
...
@@ -2,16 +2,12 @@
class=
"wrapper"
gdGap=
"8px"
gdRows=
"fit-content(30vh)"
gdColumns=
"100%
100%
"
gdColumns=
"100%"
gdColumns.gt-xs=
"50% 50%"
gdAreas=
"data-card1 | data-card2 | sysctl-card | data-card3 | cron-card | initshutdown-card | data-card7 | data-card9 | data-card8"
gdAreas.gt-xs=
"data-card1 data-card2 | sysctl-card cron-card | initshutdown-card data-card7 | data-card9 data-card8"
>
<ng-container
*ngFor=
"let card of dataCards; index as i"
>
<mat-card
*ngIf=
"[CardId.Cron, CardId.InitShutdown, CardId.Sysctl].includes(card.id) === false"
class=
"data-card{{ i + 1 }}"
gdArea=
"data-card{{ i + 1 }}"
*ngIf=
"card.items"
>
<mat-toolbar-row>
<h3>
{{ card.title | translate }}
</h3>
...
...
@@ -36,9 +32,8 @@
</mat-card>
<app-table
*ngIf=
"
[CardId.Cron, CardId.InitShutdown, CardId.Sysctl].includes(card.id)
"
*ngIf=
"
card.tableConf
"
[conf]=
"card.tableConf"
[gdArea]=
"card.id + '-card'"
></app-table>
</ng-container>
</div>
This diff is collapsed.
Click to expand it.
src/app/pages/system/advanced/advanced-settings.component.ts
View file @
427b27b4
...
...
@@ -213,8 +213,6 @@ export class AdvancedSettingsComponent implements OnInit {
},
};
readonly
CardId
=
AdvancedCardId
;
constructor
(
private
ws
:
WebSocketService
,
private
modalService
:
ModalService
,
...
...
This diff is collapsed.
Click to expand it.
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment
Menu
Projects
Groups
Snippets
Help