user report gtound work

2026-03-19 03:37:15 +01:00
1 parent 1be2de05fa
commit 74f0d0dbed
@@ -0,0 +1,132 @@
+"use client";
+
+import React from "react";
+import { AgCharts } from "ag-charts-react";
+import {
+  AgBarSeriesOptions,
+  AgChartOptions,
+  AgLineSeriesOptions,
+  AgPieSeriesOptions,
+} from "ag-charts-community";
+
+export function BarChart({
+  data,
+  xKey,
+  yKey,
+  color = "#3c82e6",
+  height = 300,
+}: {
+  data: any[];
+  xKey: string;
+  yKey: string;
+  color?: string;
+  height?: number;
+}) {
+  const options: AgChartOptions = {
+    data,
+    series: [
+      {
+        type: "bar",
+        xKey,
+        yKey,
+        fill: color,
+      } as AgBarSeriesOptions,
+    ],
+    height,
+  };
+
+  return <AgCharts options={options} />;
+}
+
+export function LineChart({
+  data,
+  xKey,
+  yKey,
+  color = "#3b82f6",
+  height = 300,
+}: {
+  data: any[];
+  xKey: string;
+  yKey: string;
+  color?: string;
+  height?: number;
+}) {
+  const options: AgChartOptions = {
+    data,
+    series: [
+      {
+        type: "line",
+        xKey,
+        yKey,
+        stroke: color,
+        strokeWidth: 3,
+        marker: {
+          size: 6,
+          fill: color,
+          stroke: "#ffffff",
+          strokeWidth: 2,
+        },
+      } as AgLineSeriesOptions,
+    ],
+    height,
+  };
+
+  return <AgCharts options={options} />;
+}
+
+export function PieChart({
+  data,
+  labelKey,
+  valueKey,
+  height = 300,
+}: {
+  data: any[];
+  labelKey: string;
+  valueKey: string;
+  height?: number;
+}) {
+  const options: AgChartOptions = {
+    data,
+    series: [
+      {
+        type: "pie",
+        labelKey,
+        angleKey: valueKey,
+      } as AgPieSeriesOptions,
+    ],
+    height,
+  };
+
+  return <AgCharts options={options} />;
+}
+
+export function AreaChart({
+  data,
+  xKey,
+  yKey,
+  color = "#3b82f6",
+  height = 300,
+}: {
+  data: any[];
+  xKey: string;
+  yKey: string;
+  color?: string;
+  height?: number;
+}) {
+  const options: AgChartOptions = {
+    data,
+    series: [
+      {
+        type: "area",
+        xKey,
+        yKey,
+        fill: color,
+        stroke: color,
+        strokeWidth: 2,
+      },
+    ],
+    height,
+  };
+
+  return <AgCharts options={options} />;
+}