TheWrightServer/ProxmoxVE
1
0
Fork 1
mirror of https://github.com/community-scripts/ProxmoxVE.git synced 2025-02-01 17:51:49 +00:00
Code Activity

Update page.tsx

Browse Source
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
1 changed files with 9 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
frontend/src/app/data/page.tsx
View File

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