Browse Source

chartdatabar

yazid138 3 năm trước cách đây
mục cha
commit
19d3222e4a
1 tập tin đã thay đổi với 14 bổ sung6 xóa
  1. 14 6
      components/Riwayat/ChartDataBar.js

+ 14 - 6
components/Riwayat/ChartDataBar.js

@@ -14,7 +14,7 @@ class ChartDataBar extends React.Component {
 			series: [
 			series: [
 				{
 				{
 					data: [44, 55, 41, 64, 22, 43, 21, 44, 42, 67, 43, 86, 42, 99, 131, 313],
 					data: [44, 55, 41, 64, 22, 43, 21, 44, 42, 67, 43, 86, 42, 99, 131, 313],
-					name: 'jumlah laporan',
+					name: "jumlah laporan",
 				},
 				},
 			],
 			],
 			options: {
 			options: {
@@ -39,7 +39,7 @@ class ChartDataBar extends React.Component {
 					},
 					},
 				},
 				},
 
 
-				colors: ['#B2B0D2'],
+				colors: ["#B2B0D2"],
 				dataLabels: {
 				dataLabels: {
 					enabled: true,
 					enabled: true,
 					offsetX: -6,
 					offsetX: -6,
@@ -63,9 +63,8 @@ class ChartDataBar extends React.Component {
 					// name: ["LLDikti I", "LLDikti II", "LLDikti III", "LLDikti IV", "LLDikti V", "LLDikti VI", "LLDikti VII", "LLDikti VIII", "LLDikti IX", "LLDikti X", "LLDikti XI", "LLDikti XII", "LLDikti XIII", "LLDikti XIV", "LLDikti XV", "LLDikti XVI"]
 					// name: ["LLDikti I", "LLDikti II", "LLDikti III", "LLDikti IV", "LLDikti V", "LLDikti VI", "LLDikti VII", "LLDikti VIII", "LLDikti IX", "LLDikti X", "LLDikti XI", "LLDikti XII", "LLDikti XIII", "LLDikti XIV", "LLDikti XV", "LLDikti XVI"]
 				},
 				},
 				fill: {
 				fill: {
-					colors: ['#B2B0D2'],
-				}
-
+					colors: ["#B2B0D2"],
+				},
 			},
 			},
 		};
 		};
 	}
 	}
@@ -73,7 +72,16 @@ class ChartDataBar extends React.Component {
 	async componentDidMount() {
 	async componentDidMount() {
 		const { token } = this.props;
 		const { token } = this.props;
 		const data = await jumlahLaporan(token);
 		const data = await jumlahLaporan(token);
-		console.log(data.data);
+		this.setState((prevState) => ({
+			...prevState,
+			series: [{ data: data.data.map((e) => e.jumlah_laporan), name: "jumlah laporan" }],
+			options: {
+				...prevState.options,
+				xaxis: {
+					categories: data.data.map((e) => e._id),
+				},
+			},
+		}));
 	}
 	}
 
 
 	render() {
 	render() {