1
0
mirror of https://github.com/community-scripts/ProxmoxVE.git synced 2025-02-01 14:31:50 +00:00

Update page.tsx

This commit is contained in:
CanbiZ 2025-01-30 13:21:49 +01:00 committed by GitHub
parent 7299b77359
commit d9b4778360
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -4,7 +4,7 @@ import React, { useEffect, useState } from "react";
import DatePicker from 'react-datepicker';
import 'react-datepicker/dist/react-datepicker.css';
import { string } from "zod";
import ApplicationChart from "../../components/ApplicationChart";
interface DataModel {
id: number;
@ -36,6 +36,7 @@ const DataFetcher: React.FC = () => {
const [sortConfig, setSortConfig] = useState<{ key: keyof DataModel | null, direction: 'ascending' | 'descending' }>({ key: 'id', direction: 'descending' });
const [itemsPerPage, setItemsPerPage] = useState(5);
const [currentPage, setCurrentPage] = useState(1);
const [showChart, setShowChart] = useState<boolean>(false);
useEffect(() => {
const fetchData = async () => {
@ -158,7 +159,14 @@ const DataFetcher: React.FC = () => {
/>
<label className="text-sm text-gray-600 mt-1 block">Set a end date</label>
</div>
<button
onClick={() => setShowChart((prev) => !prev)}
className="p-2 bg-blue-500 text-white rounded"
>
{showChart ? "Hide Chart" : "Show Chart"}
</button>
</div>
{showChart && <ApplicationChart data={filteredData} />}
<div className="mb-4 flex justify-between items-center">
<p className="text-lg font-bold">{filteredData.length} results found</p>
<select value={itemsPerPage} onChange={handleItemsPerPageChange} className="p-2 border">