настроена маршрутизация, нужно доделать группы юзеров

This commit is contained in:
gotika 2024-09-04 08:08:13 +03:00
parent 7124f54281
commit 8579c779a0
8 changed files with 103 additions and 21 deletions

View File

@ -1,24 +1,28 @@
import logo from './logo.svg'; import React from 'react';
import './App.css'; import { BrowserRouter as Router, Route, Routes } from 'react-router-dom';
import Users from './pages/users';
import Groups from './pages/groups';
import Migration from './pages/migration';
import GlobalMailing from './pages/GlobalMailing';
import GlobalVariables from './pages/GlobalVariables';
import PerformanceMetrics from './pages/performance';
import Navbar from './components/navbar';
function App() { function App() {
return ( return (
<div className="App"> <Router>
<header className="App-header"> <div>
<img src={logo} className="App-logo" alt="logo" /> <Navbar />
<p> <Routes>
Edit <code>src/App.js</code> and save to reload. <Route path="/" element={<Users />} />
</p> <Route path="/groups" element={<Groups />} />
<a <Route path="/migration" element={<Migration />} />
className="App-link" <Route path="/globalMailing" element={<GlobalMailing />} />
href="https://reactjs.org" <Route path="/globalVariables" element={<GlobalVariables />} />
target="_blank" <Route path="/performance" element={<PerformanceMetrics />} />
rel="noopener noreferrer" </Routes>
>
Learn React
</a>
</header>
</div> </div>
</Router>
); );
} }

View File

@ -0,0 +1,19 @@
import React from 'react';
import { Link } from 'react-router-dom';
function Navbar() {
return (
<nav>
<ul>
<li><Link to="/">Users</Link></li>
<li><Link to="/groups">User Groups</Link></li>
<li><Link to="/migration">Data Migration</Link></li>
<li><Link to="/GlobalMailing">Global Mailing</Link></li>
<li><Link to="/GlobalVariables">Global Variables</Link></li>
<li><Link to="/performance">Performance Metrics</Link></li>
</ul>
</nav>
);
}
export default Navbar;

View File

@ -1,7 +1,7 @@
import React from 'react'; import React from 'react';
const Groups = () => { const Groups = () => {
const groups = ['Admins', 'Editors', 'Viewers']; //заглушка const groups = ['Admins', 'Editors', 'Viewers']; //заглушка(потом нужно убрать и доделать)
return ( return (
<div> <div>

View File

@ -0,0 +1,59 @@
import React from "react";
import {
Chart as ChartJS,
CategoryScale,
LinearScale,
PointElement,
LineElement,
Title,
Tooltip,
Legend
} from 'chart.js';
import { Line } from 'react-chartjs-2';
ChartJS.register(
CategoryScale,
LinearScale,
PointElement,
LineElement,
Title,
Tooltip,
Legend
);
const PerformanceMetrics = () => {
const data = {
labels: ['Январь', 'Февраль', 'Март', 'Апрель', 'Май'],
datasets: [
{
label: 'Производительность',
data: [65, 59, 80, 81, 56],
fill: false,
backgroundColor: 'rgb(75, 192, 192)',
borderColor: 'rgba(75, 192, 192, 0.2)',
},
],
};
const options = {
responsive: true,
plugins: {
legend: {
position: 'top',
},
title: {
display: true,
text: 'График производительности',
},
},
};
return (
<div>
<h2>Производительность</h2>
<Line data={data} options={options} />
</div>
);
};
export default PerformanceMetrics;

View File

@ -2,7 +2,7 @@ import React from 'react';
import UserActions from '../components/userActions'; import UserActions from '../components/userActions';
const Users = () => { const Users = () => {
const users = ['User1', 'User2', 'User3']; //заглушка(потом можно убрать) const users = ['User1', 'User2', 'User3']; //заглушка(потом нужно убрать и доделать)
return ( return (
<div> <div>