victorAnumudu
90 lines
3.9 KiB
React
90 lines
3.9 KiB
React
import React, {useState} from "react";
|
|
import {useQuery} from "@tanstack/react-query";
|
|
import {getSystemReports} from "../../services/services";
|
|
import queryKeys from "../../services/queryKeys";
|
|
|
|
export default function SystemReportTable() {
|
|
|
|
const [page, setPage] = useState(0)
|
|
|
|
const {data, isFetching, isError, error} = useQuery({
|
|
queryKey: [...queryKeys.system_report, page],
|
|
queryFn: () => {
|
|
let reqData = {
|
|
token: localStorage.getItem('token'), // USER TOKEN
|
|
uid: localStorage.getItem('uid'), // USER UID
|
|
page
|
|
}
|
|
return getSystemReports(reqData)
|
|
},
|
|
staleTime: 0
|
|
})
|
|
|
|
// console.log('DATA', data?.data)
|
|
const systemReportData = data?.data?.system || []
|
|
|
|
return (
|
|
<>
|
|
|
|
<div className="row">
|
|
<div className="col-md-12 m-b-30">
|
|
<div className="d-block d-sm-flex flex-nowrap align-items-center">
|
|
<div className="page-title mb-2 mb-sm-0">
|
|
<h4>Systems Report</h4>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="row">
|
|
{isFetching ?
|
|
<>
|
|
<div className="col-12">
|
|
<p className='text-mute'>Loading...</p>
|
|
</div>
|
|
</>
|
|
: isError ?
|
|
<div className="col-12">
|
|
<p className='text-danger'>{error?.message}</p>
|
|
</div>
|
|
:
|
|
<div className="col-lg-12">
|
|
<div className="card card-statistics">
|
|
<div className="card-body">
|
|
<div className="export-table-wrapper table-responsive">
|
|
<table id="export-table" className="table table-bordered">
|
|
<thead className="thead-light">
|
|
<tr>
|
|
<th>Added</th>
|
|
<th>Action Name</th>
|
|
<th>Description</th>
|
|
<th>Updated</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{systemReportData.length > 0 ? systemReportData.map((item, index) => {
|
|
return (
|
|
<tr key={index}>
|
|
<td>{item?.added}</td>
|
|
<td>{item?.action_name}</td>
|
|
<td>{item?.status_description}</td>
|
|
<td>{item?.updated}</td>
|
|
</tr>
|
|
)
|
|
})
|
|
:
|
|
<tr>
|
|
<td colSpan={4} className='text-center'>No data found</td>
|
|
</tr>
|
|
}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
}
|
|
</div>
|
|
</>
|
|
)
|
|
} |