+
${this.translations.user}
-
-
${this.translations.system}
+
+
${this.translations.sys}
`);
@@ -86,24 +110,29 @@ export default class Cpu extends BaseWidget {
const data = await this.ajaxCall('/api/diagnostics/cpu_usage/getcputype');
$('.cpu-type').text(data);
- let total_ts = new TimeSeries();
- let intr_ts = new TimeSeries();
- let user_ts = new TimeSeries();
- let sys_ts = new TimeSeries();
- this._createChart('cpu-usage', total_ts);
- this._createChart('cpu-usage-intr', intr_ts);
- this._createChart('cpu-usage-user', user_ts);
- this._createChart('cpu-usage-sys', sys_ts);
+ const config = await this.getWidgetConfig();
+
+ let ts = {};
+ this.graphs.forEach((graph) => {
+ let timeSeries = new TimeSeries();
+ this._createChart(`cpu-usage-${graph}`, timeSeries);
+ ts[graph] = timeSeries;
+
+ if (!config.graphs.includes(graph)) {
+ // hide canvas container
+ $(`#cpu-${graph}`).hide();
+ }
+ });
+
super.openEventSource('/api/diagnostics/cpu_usage/stream', (event) => {
if (!event) {
super.closeEventSource();
}
const data = JSON.parse(event.data);
let date = Date.now();
- total_ts.append(date, data.total);
- intr_ts.append(date, data.intr);
- user_ts.append(date, data.user);
- sys_ts.append(date, data.sys);
+ this.graphs.forEach((graph) => {
+ ts[graph].append(date, data[graph]);
+ });
});
}
diff --git a/src/opnsense/www/js/widgets/Metadata/Core.xml b/src/opnsense/www/js/widgets/Metadata/Core.xml
index 528019037..2a2c8b750 100644
--- a/src/opnsense/www/js/widgets/Metadata/Core.xml
+++ b/src/opnsense/www/js/widgets/Metadata/Core.xml
@@ -43,8 +43,9 @@
CPU
Total
User
-
System
-
Interrupt
+
System
+
Interrupt
+
Graphs
diff --git a/src/opnsense/www/js/widgets/Traffic.js b/src/opnsense/www/js/widgets/Traffic.js
index f9815ade9..e2c04e197 100644
--- a/src/opnsense/www/js/widgets/Traffic.js
+++ b/src/opnsense/www/js/widgets/Traffic.js
@@ -225,7 +225,7 @@ export default class Traffic extends BaseWidget {
options: Object.entries(interfaces.interfaces).map(([key,intf]) => {
return {
value: intf.name,
- selected: this.config.widget?.interfaces?.includes(intf.name) ?? false
+ label: intf.name,
};
}),
default: Object.entries(interfaces.interfaces)