recent action API added
This commit is contained in:
victorAnumudu
+1
-1
@@ -1,7 +1,7 @@
|
||||
SKIP_PREFLIGHT_CHECK=true
|
||||
REACT_APP_NODE_ENV="development"
|
||||
REACT_APP_SOCKET_URL="https://dev-socket.mermsemr.com"
|
||||
REACT_APP_MAIN_API="https://devapi.mermsemr.com/"
|
||||
REACT_APP_MAIN_API="https://devapi.mermsemr.com"
|
||||
REACT_APP_MEDIA_SERVER="https://dev-media.mermsemr.com"
|
||||
|
||||
# Inactivity timeout/logout AT 10MINS
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import React from "react";
|
||||
import BreadcrumbComBS from "../breadcrumb/BreadcrumbComBS";
|
||||
import RecentActions from "./RecentActions";
|
||||
// import { useQuery } from "@tanstack/react-query";
|
||||
// import { accountDashboard } from "../../services/services";
|
||||
// import queryKeys from "../../services/queryKeys";
|
||||
@@ -258,105 +259,7 @@ export default function HomeSections(){
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-xxl-6 m-b-30">
|
||||
<div className="card card-statistics h-100 mb-0">
|
||||
<div className="card-header d-sm-flex justify-content-between align-items-center py-3">
|
||||
<div className="card-heading mb-3 mb-sm-0">
|
||||
<h4 className="card-title">Recent Actions</h4>
|
||||
</div>
|
||||
<div className="dropdown">
|
||||
{/*<input type="text" className="form-control form-control-sm" placeholder="Search Invoice"/>*/}
|
||||
</div>
|
||||
</div>
|
||||
<div className="card-body scrollbar scroll_dark" style={{maxHeight: '420px'}}>
|
||||
<div className="d-xxs-flex align-items-center">
|
||||
<div className="total-sales">
|
||||
<p>Last Update</p>
|
||||
<h1>10-10-2021 10 AM</h1>
|
||||
</div>
|
||||
<div className="mb-3 mb-sm-0 ml-auto">
|
||||
{/*<button className="btn btn-primary btn-xs">View All Invoices</button>*/}
|
||||
</div>
|
||||
</div>
|
||||
<div className="d-none d-sm-flex progress m-t-20 m-b-0" style={{height: '5px'}}>
|
||||
<div className="progress-bar bg-primary" role="progressbar" style={{width: '25%'}}
|
||||
aria-valuenow="15" aria-valuemin="0" aria-valuemax="100"></div>
|
||||
<div className="progress-bar bg-warning" role="progressbar" style={{width: '25%'}}
|
||||
aria-valuenow="30" aria-valuemin="0" aria-valuemax="100"></div>
|
||||
<div className="progress-bar bg-info" role="progressbar" style={{width: '25%'}} aria-valuenow="20"
|
||||
aria-valuemin="0" aria-valuemax="100"></div>
|
||||
<div className="progress-bar bg-success" role="progressbar" style={{width: '25%'}}
|
||||
aria-valuenow="20" aria-valuemin="0" aria-valuemax="100"></div>
|
||||
</div>
|
||||
<div className="row no-gutters">
|
||||
<div className="col-6 col-xxs-3 ">
|
||||
<p>Initial</p>
|
||||
<h4>0</h4>
|
||||
</div>
|
||||
<div className="col-6 col-xxs-3 ">
|
||||
<p>Processing</p>
|
||||
<h4>0</h4>
|
||||
</div>
|
||||
<div className="col-6 col-xxs-3 ">
|
||||
<p>Verifying</p>
|
||||
<h4>0</h4>
|
||||
</div>
|
||||
<div className="col-6 col-xxs-3 ">
|
||||
<p>Completed</p>
|
||||
<h4>0</h4>
|
||||
</div>
|
||||
</div>
|
||||
<div className="table-responsive m-t-20">
|
||||
<table id="datatable-buttons" className="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th style={{width: '30px'}}>#.</th>
|
||||
<th>Description</th>
|
||||
<th style={{width: '100px'}}>Date</th>
|
||||
<th style={{width: '100px'}}>Status</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody className="text-muted">
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>Smith Drake</td>
|
||||
<td>27/3/2014</td>
|
||||
<td>
|
||||
<label className="badge mb-0 badge-primary-inverse"> Overdue</label>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>2</td>
|
||||
<td>Martha Doe</td>
|
||||
<td>28/3/2015</td>
|
||||
<td>
|
||||
<label className="badge mb-0 badge-warning-inverse
|
||||
"> Outstanding</label>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>3</td>
|
||||
<td>Fenish Paul</td>
|
||||
<td>24/3/2015</td>
|
||||
<td>
|
||||
<label className="badge mb-0 badge-info-inverse
|
||||
"> Open</label>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>4</td>
|
||||
<td>Albom Mitch</td>
|
||||
<td>29/3/2016</td>
|
||||
<td>
|
||||
<label className="badge mb-0 badge-success-inverse
|
||||
"> Paid</label>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<RecentActions />
|
||||
</div>
|
||||
</div>
|
||||
<div className="row">
|
||||
|
||||
@@ -0,0 +1,131 @@
|
||||
import React from 'react'
|
||||
import { useQuery } from "@tanstack/react-query";
|
||||
import { recentActions } from "../../services/services";
|
||||
import queryKeys from "../../services/queryKeys";
|
||||
|
||||
export default function RecentActions() {
|
||||
|
||||
const {data, isFetching, isError} = useQuery({
|
||||
queryKey: queryKeys.recentAction,
|
||||
queryFn: async () => await recentActions()
|
||||
})
|
||||
console.log('data', data)
|
||||
return (
|
||||
<>
|
||||
<div className="card card-statistics h-100 mb-0">
|
||||
<div className="card-header">
|
||||
<div className="card-heading">
|
||||
<h4 className="card-title">Recent Actions</h4>
|
||||
</div>
|
||||
{/* <div className="dropdown">
|
||||
<input type="text" className="form-control form-control-sm" placeholder="Search Invoice"/>
|
||||
</div> */}
|
||||
</div>
|
||||
<div className="card-body scrollbar scroll_dark" style={{maxHeight: '450px'}}>
|
||||
{isFetching ?
|
||||
<>
|
||||
<div className="row">
|
||||
<div className="col-12">
|
||||
<p className='text-mute'>Loading...</p>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
: isError ?
|
||||
<div className="row">
|
||||
<div className="col-12">
|
||||
<p className='text-danger'>Error occured! Please refresh to continue</p>
|
||||
</div>
|
||||
</div>
|
||||
:
|
||||
<>
|
||||
<div className="d-xxs-flex align-items-center">
|
||||
<div className="total-sales">
|
||||
<p>Last Update</p>
|
||||
<h1>10-10-2021 10 AM</h1>
|
||||
</div>
|
||||
<div className="mb-3 mb-sm-0 ml-auto">
|
||||
{/*<button className="btn btn-primary btn-xs">View All Invoices</button>*/}
|
||||
</div>
|
||||
</div>
|
||||
<div className="d-none d-sm-flex progress m-t-20 m-b-0" style={{height: '5px'}}>
|
||||
<div className="progress-bar bg-primary" role="progressbar" style={{width: '25%'}}
|
||||
aria-valuenow="15" aria-valuemin="0" aria-valuemax="100"></div>
|
||||
<div className="progress-bar bg-warning" role="progressbar" style={{width: '25%'}}
|
||||
aria-valuenow="30" aria-valuemin="0" aria-valuemax="100"></div>
|
||||
<div className="progress-bar bg-info" role="progressbar" style={{width: '25%'}} aria-valuenow="20"
|
||||
aria-valuemin="0" aria-valuemax="100"></div>
|
||||
<div className="progress-bar bg-success" role="progressbar" style={{width: '25%'}}
|
||||
aria-valuenow="20" aria-valuemin="0" aria-valuemax="100"></div>
|
||||
</div>
|
||||
<div className="row no-gutters">
|
||||
<div className="col-6 col-xxs-3 ">
|
||||
<p>Initial</p>
|
||||
<h4>0</h4>
|
||||
</div>
|
||||
<div className="col-6 col-xxs-3 ">
|
||||
<p>Processing</p>
|
||||
<h4>0</h4>
|
||||
</div>
|
||||
<div className="col-6 col-xxs-3 ">
|
||||
<p>Verifying</p>
|
||||
<h4>0</h4>
|
||||
</div>
|
||||
<div className="col-6 col-xxs-3 ">
|
||||
<p>Completed</p>
|
||||
<h4>0</h4>
|
||||
</div>
|
||||
</div>
|
||||
<div className="table-responsive m-t-20">
|
||||
<table id="datatable-buttons" className="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th style={{width: '30px'}}>#.</th>
|
||||
<th>Description</th>
|
||||
<th style={{width: '100px'}}>Date</th>
|
||||
<th style={{width: '100px'}}>Status</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody className="text-muted">
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>Smith Drake</td>
|
||||
<td>27/3/2014</td>
|
||||
<td>
|
||||
<label className="badge mb-0 badge-primary-inverse"> Overdue</label>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>2</td>
|
||||
<td>Martha Doe</td>
|
||||
<td>28/3/2015</td>
|
||||
<td>
|
||||
<label className="badge mb-0 badge-warning-inverse"> Outstanding</label>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>3</td>
|
||||
<td>Fenish Paul</td>
|
||||
<td>24/3/2015</td>
|
||||
<td>
|
||||
<label className="badge mb-0 badge-info-inverse"> Open</label>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>4</td>
|
||||
<td>Albom Mitch</td>
|
||||
<td>29/3/2016</td>
|
||||
<td>
|
||||
<label className="badge mb-0 badge-success-inverse"> Paid</label>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
}
|
||||
@@ -1,5 +1,6 @@
|
||||
const queryKeys = {
|
||||
dashboard: ['dashboard']
|
||||
dashboard: ['dashboard'],
|
||||
recentAction: ['recent-action']
|
||||
}
|
||||
|
||||
export default queryKeys
|
||||
@@ -36,8 +36,8 @@ const getAuxEnd = (path) => {
|
||||
// localStorage.clear();
|
||||
// window.location.href = `/login?sessionExpired=true`;
|
||||
}).catch(err => {
|
||||
// throw new Error(err.response.data.message);
|
||||
return err
|
||||
throw new Error(err.response.data.message);
|
||||
// return err
|
||||
})
|
||||
}
|
||||
|
||||
@@ -54,3 +54,8 @@ export const loginUser = (reqData) => {
|
||||
export const accountDashboard = () => {
|
||||
return getAuxEnd(`/panel/account/dash`)
|
||||
}
|
||||
|
||||
// FUNCTION TO GET DASHBOARD RECENT ACTIONS SECTION
|
||||
export const recentActions = () => {
|
||||
return getAuxEnd(`/panel/account/actions`)
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user