62 lines
1.9 KiB
JavaScript
62 lines
1.9 KiB
JavaScript
import React, { useEffect, useState } from 'react';
|
|
import { useNavigate } from 'react-router-dom';
|
|
import Sidebar from '../components/sidebar/Sidebar';
|
|
import '../styles/AdminDashboard.css';
|
|
|
|
const AdminDashboard = () => {
|
|
const navigate = useNavigate();
|
|
const [userName, setUserName] = useState('');
|
|
|
|
useEffect(() => {
|
|
const user = JSON.parse(localStorage.getItem('user'));
|
|
if (user && user.name) {
|
|
setUserName(user.name);
|
|
}
|
|
}, []);
|
|
|
|
const handleClick = (link) => {
|
|
navigate(link);
|
|
};
|
|
|
|
return (
|
|
<div className="dashboard-container">
|
|
<Sidebar />
|
|
<div className="dashboard-content">
|
|
<header className="dashboard-header">
|
|
<h1 className="header-title">admin dashboard</h1>
|
|
<p className="welcome-text">welcome back, {userName}</p>
|
|
</header>
|
|
<main className="dashboard-main">
|
|
<div className="dashboard-main-content">
|
|
<img
|
|
src="https://img.freepik.com/free-photo/well-dressed-businessman-holding-currency-with-confidence-generated-by-ai_188544-16970.jpg?t=st=1722511417~exp=1722515017~hmac=dbe5ab19f8e2c416be4928faac1fc197473166fc4f230d8f46307b84e522ff5a&w=1060"
|
|
alt="Dashboard Graphic"
|
|
className="dashboard-image"
|
|
/>
|
|
<button
|
|
className="btn-primary"
|
|
onClick={() => handleClick('')}
|
|
>
|
|
view orders
|
|
</button>
|
|
<button
|
|
className="btn-primary"
|
|
onClick={() => handleClick('/employees')}
|
|
>
|
|
view employees
|
|
</button>
|
|
<button
|
|
className="btn-primary"
|
|
onClick={() => handleClick('')}
|
|
>
|
|
view customers
|
|
</button>
|
|
</div>
|
|
</main>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default AdminDashboard;
|