Commit b7415a9d authored by Gihan76's avatar Gihan76

Dashboard Analytics Done

parent cc6ec4b4
......@@ -3975,6 +3975,11 @@
"resolved": "https://registry.npmjs.org/char-regex/-/char-regex-1.0.2.tgz",
"integrity": "sha512-kWWXztvZ5SBQV+eRgKFeh8q5sLuZY2+8WUIzlxWVTg+oGwY14qylx1KbKzHd8P6ZYkAg0xyIDU9JMHhyJMZ1jw=="
},
"chart.js": {
"version": "3.5.1",
"resolved": "https://registry.npmjs.org/chart.js/-/chart.js-3.5.1.tgz",
"integrity": "sha512-m5kzt72I1WQ9LILwQC4syla/LD/N413RYv2Dx2nnTkRS9iv/ey1xLTt0DnPc/eWV4zI+BgEgDYBIzbQhZHc/PQ=="
},
"check-types": {
"version": "11.1.2",
"resolved": "https://registry.npmjs.org/check-types/-/check-types-11.1.2.tgz",
......@@ -12344,6 +12349,14 @@
"whatwg-fetch": "^3.4.1"
}
},
"react-chartjs-2": {
"version": "3.0.5",
"resolved": "https://registry.npmjs.org/react-chartjs-2/-/react-chartjs-2-3.0.5.tgz",
"integrity": "sha512-fYr4E82agaZi9IFMe5GtOZ6WE/HWdxy/KywLNOzXsqgPkD2oo1IlrQLKMLUki/2UXko3p95TR2L8Q2rEss/opQ==",
"requires": {
"lodash": "^4.17.19"
}
},
"react-dev-utils": {
"version": "11.0.4",
"resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-11.0.4.tgz",
......
......@@ -7,7 +7,9 @@
"@testing-library/react": "^11.2.6",
"@testing-library/user-event": "^12.8.3",
"bootstrap": "^4.6.0",
"chart.js": "^3.5.1",
"react": "^17.0.2",
"react-chartjs-2": "^3.0.5",
"react-dom": "^17.0.2",
"react-dropdown": "^1.9.2",
"react-router-dom": "^5.2.0",
......
......@@ -6,6 +6,7 @@ import AddFinance from './add_financial_details';
import ViewFinance from './view_financial_details';
import EditFinance from './edit_financial_details';
import AddClass from './add_class_details';
import Analytics from "./analytics";
export default class Dashboard extends Component {
render() {
......@@ -447,6 +448,7 @@ export default class Dashboard extends Component {
<div className="app-main__inner">
{/* ------------------------------Content---------------------------------------- */}
<Route path="/admin/" exact component={Analytics}/>
<Route path="/admin/finance/" exact component={ViewFinance}/>
<Route path="/admin/finance/add" exact component={AddFinance} />
<Route path={"/admin/finance/edit/:id"} exact component={EditFinance}/>
......
import React, {Component} from "react";
import {Pie, Doughnut} from 'react-chartjs-2';
const state = {
labels: ['January', 'February', 'March',
'April', 'May'],
datasets: [
{
label: 'Rainfall',
backgroundColor: [
'#B21F00',
'#C9DE00',
'#2FDE00',
'#00A6B4',
'#6800B4'
],
hoverBackgroundColor: [
'#501800',
'#4B5000',
'#175000',
'#003350',
'#35014F'
],
data: [65, 59, 80, 81, 56]
}
]
}
export default class Analytics extends Component{
render() {
return (
<div>
<div className="app-page-title">
<div className="page-title-wrapper">
<div className="page-title-heading">
<div className="page-title-icon">
<i className="pe-7s-display1 fa fa-tachometer"></i>
</div>
<div>
Dashboard
</div>
</div>
</div>
</div>
<div className="row">
<div className="col-md-6 col-xl-4">
<div className="card mb-3 widget-content bg-midnight-bloom">
<div className="widget-content-wrapper text-white">
<div className="widget-content-left">
<div className="widget-heading" style={{paddingRight: "40px"}}>Total Students</div>
{/*<div className="widget-subheading">Last year expenses</div>*/}
</div>
<div className="widget-content-right">
<div className="widget-numbers text-white"><span>1000</span></div>
</div>
</div>
</div>
</div>
<div className="col-md-6 col-xl-4">
<div className="card mb-3 widget-content bg-arielle-smile">
<div className="widget-content-wrapper text-white">
<div className="widget-content-left">
<div className="widget-heading" style={{paddingRight: "40px"}}>Institutes</div>
{/*<div className="widget-subheading">Total Clients Profit</div>*/}
</div>
<div className="widget-content-right">
<div className="widget-numbers text-white"><span>2</span></div>
</div>
</div>
</div>
</div>
<div className="col-md-6 col-xl-4">
<div className="card mb-3 widget-content bg-grow-early">
<div className="widget-content-wrapper text-white">
<div className="widget-content-left">
<div className="widget-heading" style={{paddingRight: "40px"}}>Subjects</div>
{/*<div className="widget-subheading">People Interested</div>*/}
</div>
<div className="widget-content-right">
<div className="widget-numbers text-white"><span>1</span></div>
</div>
</div>
</div>
</div>
</div>
<div className="col-md-12 col-lg-6">
<div className="mb-3 card">
<div className="card-header-tab card-header-tab-animation card-header">
<div className="card-header-title">
<i className="header-icon lnr-apartment icon-gradient bg-love-kiss"> </i>
Sales Report
</div>
<ul className="nav">
<li className="nav-item"><a href="javascript:void(0);"
className="active nav-link">Last</a></li>
<li className="nav-item"><a href="javascript:void(0);"
className="nav-link second-tab-toggle">Current</a></li>
</ul>
</div>
<div className="card-body">
<div className="tab-content">
<div className="tab-pane fade show active" id="tabs-eg-77">
<div className="card mb-3 widget-chart widget-chart2 text-left w-100">
<div className="widget-chat-wrapper-outer">
<div
className="widget-chart-wrapper widget-chart-wrapper-lg opacity-10 m-0">
{/*<canvas id="canvas" />*/}
{/*<Bar data={data} options={options}/>*/}
<Pie
data={state}
options={{
title:{
display:true,
text:'Average Rainfall per month',
fontSize:20
},
legend:{
display:true,
position:'right'
}
}}
/>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
);
}
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment