web/admin: refactor chart component to allow setting of general chart data

Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
This commit is contained in:
Jens Langhammer
2021-05-05 22:15:11 +02:00
parent 225099b1a1
commit ded6b6f937
4 changed files with 87 additions and 83 deletions

View File

@ -2,7 +2,7 @@ import { customElement, property } from "lit-element";
import { CoreApi, UserMetrics } from "authentik-api";
import { AKChart } from "./Chart";
import { DEFAULT_CONFIG } from "../../api/Config";
import { ChartDataset } from "chart.js";
import { ChartData } from "chart.js";
@customElement("ak-charts-user")
export class UserChart extends AKChart<UserMetrics> {
@ -16,42 +16,44 @@ export class UserChart extends AKChart<UserMetrics> {
});
}
getDatasets(data: UserMetrics): ChartDataset[] {
return [
{
label: "Failed Logins",
backgroundColor: "rgba(201, 25, 11, .5)",
spanGaps: true,
data: data.loginsFailedPer1h?.map((cord) => {
return {
x: cord.xCord || 0,
y: cord.yCord || 0,
};
}) || [],
},
{
label: "Successful Logins",
backgroundColor: "rgba(189, 229, 184, .5)",
spanGaps: true,
data: data.loginsPer1h?.map((cord) => {
return {
x: cord.xCord || 0,
y: cord.yCord || 0,
};
}) || [],
},
{
label: "Application authorizations",
backgroundColor: "rgba(43, 154, 243, .5)",
spanGaps: true,
data: data.authorizationsPer1h?.map((cord) => {
return {
x: cord.xCord || 0,
y: cord.yCord || 0,
};
}) || [],
},
];
getChartData(data: UserMetrics): ChartData {
return {
datasets: [
{
label: "Failed Logins",
backgroundColor: "rgba(201, 25, 11, .5)",
spanGaps: true,
data: data.loginsFailedPer1h?.map((cord) => {
return {
x: cord.xCord || 0,
y: cord.yCord || 0,
};
}) || [],
},
{
label: "Successful Logins",
backgroundColor: "rgba(189, 229, 184, .5)",
spanGaps: true,
data: data.loginsPer1h?.map((cord) => {
return {
x: cord.xCord || 0,
y: cord.yCord || 0,
};
}) || [],
},
{
label: "Application authorizations",
backgroundColor: "rgba(43, 154, 243, .5)",
spanGaps: true,
data: data.authorizationsPer1h?.map((cord) => {
return {
x: cord.xCord || 0,
y: cord.yCord || 0,
};
}) || [],
},
]
};
}
}