From 6e039b07bfda67bf16e9700b80f272db5af36a90 Mon Sep 17 00:00:00 2001 From: Simiys Date: Fri, 26 Jul 2024 20:58:35 +0300 Subject: [PATCH 1/5] Created ReportPage --- front-doc/src/App.tsx | 28 ++++---- front-doc/src/pages/ReportPage.tsx | 3 - .../pages/documentForms/report/ReportPage.tsx | 67 +++++++++++++++++++ 3 files changed, 81 insertions(+), 17 deletions(-) delete mode 100644 front-doc/src/pages/ReportPage.tsx create mode 100644 front-doc/src/pages/documentForms/report/ReportPage.tsx diff --git a/front-doc/src/App.tsx b/front-doc/src/App.tsx index a346e5d..f91ee0a 100644 --- a/front-doc/src/App.tsx +++ b/front-doc/src/App.tsx @@ -1,17 +1,17 @@ -import { useState, useEffect } from "react"; -import "./App.css"; -import { Route, Routes, useLocation } from "react-router-dom"; -import { HomePage } from "./pages/home/HomePage"; -import { ReportPage } from "./pages/ReportPage"; -import { ReleasePage } from "./pages/documentForms/release/ReleasePage"; -import { OrderPage } from "./pages/OrderPage"; -import { ListPage } from "./pages/ListPage"; -import { ThemeProvider } from "./providers/ThemeProvider"; -import { HeaderComponent } from "./components/header/HeaderComponent"; -import { FooterComponent } from "./components/footer/FooterComponent"; -import Loader from "./components/loader/Loader"; -import { LoginPage } from "./pages/login/LoginPage"; -import { AboutCreatorsPage } from "./pages/creators/AboutCreatorsPage"; +import { useState, useEffect } from 'react'; +import './App.css'; +import { Route, Routes, useLocation } from 'react-router-dom'; +import { HomePage } from './pages/home/HomePage'; +import { ReportPage } from './pages/documentForms/report/ReportPage'; +import { ReleasePage } from './pages/documentForms/release/ReleasePage'; +import { OrderPage } from './pages/OrderPage'; +import { ListPage } from './pages/ListPage'; +import { ThemeProvider } from './providers/ThemeProvider'; +import { HeaderComponent } from './components/header/HeaderComponent'; +import { FooterComponent } from './components/footer/FooterComponent'; +import Loader from './components/loader/Loader'; +import { LoginPage } from './pages/login/LoginPage'; +import { AboutCreatorsPage } from './pages/creators/AboutCreatorsPage'; function App() { const [loading, setLoading] = useState(true); diff --git a/front-doc/src/pages/ReportPage.tsx b/front-doc/src/pages/ReportPage.tsx deleted file mode 100644 index 3d54fcd..0000000 --- a/front-doc/src/pages/ReportPage.tsx +++ /dev/null @@ -1,3 +0,0 @@ -export const ReportPage = () => { - return
fpjgjfsg
; -}; diff --git a/front-doc/src/pages/documentForms/report/ReportPage.tsx b/front-doc/src/pages/documentForms/report/ReportPage.tsx new file mode 100644 index 0000000..2635f0b --- /dev/null +++ b/front-doc/src/pages/documentForms/report/ReportPage.tsx @@ -0,0 +1,67 @@ +import { Box, Button, MenuItem, Select, SelectChangeEvent, TextField } from '@mui/material'; +import { DatePicker, LocalizationProvider } from '@mui/x-date-pickers'; +import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'; +import dayjs, { Dayjs } from 'dayjs'; +import { useState } from 'react'; + +export const ReportPage = () => { + interface Report { + dateFrom: Dayjs | null; + text: string; + approver: string; + } + + const [dateFrom, setDateFrom] = useState(dayjs()); + const [text, setText] = useState(''); + const [approver, setApprover] = useState('Замдекана'); + + const approverList = ['Замдекана', 'Декан', 'ГСБ']; + + const handleDateFromChange = (newDate: Dayjs | null) => { + setDateFrom(newDate); + }; + + const handleApproverChange = (event: SelectChangeEvent) => { + setApprover(event.target.value as string); + }; + + const handleTextChange = (e: any) => { + setText(e.target.value); + }; + + const handleSendData = () => { + const report: Report = { + dateFrom, + text, + approver + }; + console.log(report); + }; + + return ( + + + handleDateFromChange(newValue)} /> + + + + + + ); +}; From 7553521897bd6d7c49b4ded536dcbe8fb594a893 Mon Sep 17 00:00:00 2001 From: Simiys Date: Wed, 14 Aug 2024 15:15:00 +0300 Subject: [PATCH 2/5] redesigned interface for report generation --- .../documentForms/release/ReleasePage.tsx | 5 +- .../pages/documentForms/report/ReportPage.tsx | 298 ++++++++++++++++-- 2 files changed, 266 insertions(+), 37 deletions(-) diff --git a/front-doc/src/pages/documentForms/release/ReleasePage.tsx b/front-doc/src/pages/documentForms/release/ReleasePage.tsx index 9eb6d2f..d49ad37 100644 --- a/front-doc/src/pages/documentForms/release/ReleasePage.tsx +++ b/front-doc/src/pages/documentForms/release/ReleasePage.tsx @@ -70,6 +70,8 @@ export const ReleasePage = () => { 'Virginia Andrews', 'Kelly Snyder' ]); + const [showInput, setShowInput] = useState(false); + const [inputValue, setInputValue] = useState(''); const handleDateChange = (index: number, newDate: Dayjs | null) => { const newData = [...releaseData]; @@ -129,9 +131,6 @@ export const ReleasePage = () => { setResponsible(event.target.value); }; - const [showInput, setShowInput] = useState(false); - const [inputValue, setInputValue] = useState(''); - const handleButtonClick = () => { setShowInput(true); }; diff --git a/front-doc/src/pages/documentForms/report/ReportPage.tsx b/front-doc/src/pages/documentForms/report/ReportPage.tsx index 2635f0b..33958d2 100644 --- a/front-doc/src/pages/documentForms/report/ReportPage.tsx +++ b/front-doc/src/pages/documentForms/report/ReportPage.tsx @@ -1,64 +1,294 @@ -import { Box, Button, MenuItem, Select, SelectChangeEvent, TextField } from '@mui/material'; -import { DatePicker, LocalizationProvider } from '@mui/x-date-pickers'; +import { + Box, + Button, + Checkbox, + Chip, + Collapse, + FormControl, + FormControlLabel, + InputLabel, + MenuItem, + Select, + SelectChangeEvent, + TextField +} from '@mui/material'; +import { DatePicker, LocalizationProvider, TimePicker } from '@mui/x-date-pickers'; import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'; import dayjs, { Dayjs } from 'dayjs'; import { useState } from 'react'; +import AddIcon from '@mui/icons-material/Add'; +import RemoveIcon from '@mui/icons-material/Remove'; export const ReportPage = () => { interface Report { - dateFrom: Dayjs | null; - text: string; approver: string; + sender: string; + firstPrefix: string; + event: string; + eventOrg: string; + secondPrefix: string; + action: string; + auds: AudotoryInfo[]; } - - const [dateFrom, setDateFrom] = useState(dayjs()); - const [text, setText] = useState(''); + interface AudotoryInfo { + number: number; + days: string[]; + timeFrom: Dayjs | null; + timeTo: Dayjs | null; + allWeek: boolean; + } + const [auditories, setAuditories] = useState([]); const [approver, setApprover] = useState('Замдекана'); + const [sender, setSender] = useState(''); + const [firstPrefix, setFirstPrefix] = useState('В связи с '); + const [event, setEvent] = useState(''); + const [eventOrg, setEventOrg] = useState(''); + const [secondPrefix, setSecondPrefix] = useState('просит Вас '); + const [action, setAction] = useState(''); + + const daysOfWeek = ['Понедельник', 'Вторник', 'Среда', 'Четверг', 'Пятница', 'Cуббота']; const approverList = ['Замдекана', 'Декан', 'ГСБ']; - const handleDateFromChange = (newDate: Dayjs | null) => { - setDateFrom(newDate); + const handleSecondPrefixChange = (e: any) => { + setSecondPrefix(e.target.value); }; - const handleApproverChange = (event: SelectChangeEvent) => { + const handleApproverChange = (event: any) => { setApprover(event.target.value as string); }; - const handleTextChange = (e: any) => { - setText(e.target.value); + const handleAddAud = () => { + const newAuds = [...auditories]; + const aud = { + number: 1, + days: [], + timeFrom: null, + timeTo: null, + allWeek: true + }; + newAuds.push(aud); + setAuditories(newAuds); + }; + const handleDeleteAud = () => { + const newAuds = [...auditories]; + newAuds.pop(); + setAuditories(newAuds); + }; + + const handleEventChange = (e: any) => { + setEvent(e.target.value); + }; + + const handleEventOrgChange = (e: any) => { + setEventOrg(e.target.value); + }; + + const handleFirstPrefixChange = (e: any) => { + setFirstPrefix(e.target.value); + }; + + const handleSenderChange = (event: any) => { + setSender(event.target.value); + }; + + const handleActionDescChange = (event: any) => { + setAction(event.target.value); + }; + + const handleAudNumberChange = (e: any, i: number) => { + const auds = [...auditories]; + auds[i].number = e.target.value; + setAuditories(auds); + }; + + const handleAudTimeFromChange = (val: any, i: number) => { + const auds = [...auditories]; + auds[i].timeFrom = val; + setAuditories(auds); + }; + + const handleAudTimeToChange = (val: any, i: number) => { + const auds = [...auditories]; + auds[i].timeTo = val; + setAuditories(auds); + }; + + const handleAudDaysChange = (e: SelectChangeEvent, i: number) => { + const auds = [...auditories]; + auds[i].days = e.target.value as string[]; + setAuditories(auds); + }; + + const handleFullWeekChange = (e: any, i: number) => { + const auds = [...auditories]; + auds[i].allWeek = e.target.checked; + setAuditories(auds); }; const handleSendData = () => { const report: Report = { - dateFrom, - text, - approver + approver, + sender, + firstPrefix, + event, + eventOrg, + secondPrefix, + action, + auds: auditories }; console.log(report); }; return ( - - handleDateFromChange(newValue)} /> - - - + + + {auditories.map((aud, i) => ( + + handleAudNumberChange(event, i)} + label="Номер аудитории" + value={aud.number} + inputProps={{ inputMode: 'numeric', pattern: '[0-9]*' }} + > + handleAudTimeFromChange(newValue, i)} + sx={{ + maxWidth: 120 + }} + label="Начало" + ampm={false} + value={aud.timeFrom} + /> + handleAudTimeToChange(newValue, i)} + sx={{ + maxWidth: 120 + }} + label="Конец" + ampm={false} + value={aud.timeTo} + /> + + + + handleFullWeekChange(event, i)} + inputProps={{ 'aria-label': 'controlled' }} + /> + } + label="Вся неделя" + /> + + ))} + From c84cc361ed0d7c4b31aef2fb3f5cbfd7fbd8a2f1 Mon Sep 17 00:00:00 2001 From: Simiys Date: Thu, 15 Aug 2024 17:13:07 +0300 Subject: [PATCH 3/5] fixed styles --- front-doc/src/constants/reportConstants.ts | 3 ++ .../pages/documentForms/report/ReportPage.tsx | 53 +++++++------------ 2 files changed, 21 insertions(+), 35 deletions(-) create mode 100644 front-doc/src/constants/reportConstants.ts diff --git a/front-doc/src/constants/reportConstants.ts b/front-doc/src/constants/reportConstants.ts new file mode 100644 index 0000000..39b41f6 --- /dev/null +++ b/front-doc/src/constants/reportConstants.ts @@ -0,0 +1,3 @@ +export const daysOfWeek = ['Понедельник', 'Вторник', 'Среда', 'Четверг', 'Пятница', 'Cуббота']; + +export const approverList = ['Замдекана', 'Декан', 'ГСБ']; diff --git a/front-doc/src/pages/documentForms/report/ReportPage.tsx b/front-doc/src/pages/documentForms/report/ReportPage.tsx index 33958d2..4eb901d 100644 --- a/front-doc/src/pages/documentForms/report/ReportPage.tsx +++ b/front-doc/src/pages/documentForms/report/ReportPage.tsx @@ -18,6 +18,7 @@ import dayjs, { Dayjs } from 'dayjs'; import { useState } from 'react'; import AddIcon from '@mui/icons-material/Add'; import RemoveIcon from '@mui/icons-material/Remove'; +import { daysOfWeek, approverList } from '../../../constants/reportConstants'; export const ReportPage = () => { interface Report { @@ -46,10 +47,6 @@ export const ReportPage = () => { const [secondPrefix, setSecondPrefix] = useState('просит Вас '); const [action, setAction] = useState(''); - const daysOfWeek = ['Понедельник', 'Вторник', 'Среда', 'Четверг', 'Пятница', 'Cуббота']; - - const approverList = ['Замдекана', 'Декан', 'ГСБ']; - const handleSecondPrefixChange = (e: any) => { setSecondPrefix(e.target.value); }; @@ -145,18 +142,14 @@ export const ReportPage = () => { - - + + Кому - - + + + { multiline={true} rows={4} fullWidth - placeholder="началом проведения дополнительных занятий по дисциплинам, преподаваемым на факультете, основной целью которых является закрепление полученных знаний и изучение прикладного применения дисциплин" + placeholder='началом работы клуба английского языка "English Speaking Club", основной целью которого является желание улучшить навыки коммуникации на английском языке' /> { placeholder="Студенческий Совет по качеству образования и науки ФПМИ" /> { fullWidth multiline={true} rows={4} - placeholder=" выделить для проведения занятий" + placeholder="выделить для проведения занятий аудитории в понедельник с 19.10 до 20.30 и пятницу с 17.40 до 19.00" /> - + + @@ -229,6 +214,7 @@ export const ReportPage = () => { + {auditories.map((aud, i) => ( { label="Номер аудитории" value={aud.number} inputProps={{ inputMode: 'numeric', pattern: '[0-9]*' }} - > + /> handleAudTimeFromChange(newValue, i)} - sx={{ - maxWidth: 120 - }} + sx={{ maxWidth: 120 }} label="Начало" ampm={false} value={aud.timeFrom} /> handleAudTimeToChange(newValue, i)} - sx={{ - maxWidth: 120 - }} + sx={{ maxWidth: 120 }} label="Конец" ampm={false} value={aud.timeTo} @@ -288,6 +270,7 @@ export const ReportPage = () => { /> ))} + From ee3abf599f4ee082fe08910367d93e5b768d45d6 Mon Sep 17 00:00:00 2001 From: Simiys Date: Sun, 1 Sep 2024 20:37:18 +0300 Subject: [PATCH 4/5] fix document form --- .../src/components/report/ReportDefault.tsx | 64 ++++++++----------- 1 file changed, 26 insertions(+), 38 deletions(-) diff --git a/front-doc/src/components/report/ReportDefault.tsx b/front-doc/src/components/report/ReportDefault.tsx index a25983f..f8d4401 100644 --- a/front-doc/src/components/report/ReportDefault.tsx +++ b/front-doc/src/components/report/ReportDefault.tsx @@ -5,48 +5,36 @@ import '../../fonts/Times New Roman Cyr Regular-normal'; export const generateReportPDF = (report: Report) => { const doc = new jsPDF(); - // Установить шрифт и размер шрифта - doc.addFont('Times New Roman Cyr Regular-normal.ttf', 'Times New Roman Cyr Regular', 'normal'); - // Установка шрифта doc.setFont('Times New Roman Cyr Regular', 'normal'); - // Центрировать текст вручную, вычисляя ширину страницы и текста let pageWidth = doc.internal.pageSize.getWidth(); + doc.setFontSize(12); - // Заголовок и шапка документа - let title = 'СТУДЕНЧЕСКИЙ СОЮЗ БГУ'; - let titleWidth = doc.getTextWidth(title); - doc.text(title, (pageWidth - titleWidth) / 2, 20); - - //doc.setFont('times', 'normal'); - doc.setFontSize(10); - - let lines = [ - 'Республика Беларусь 220030', - 'г. Минск пр. Независимости 4', - 'Тел.: +375 17 209 54 38', - 'Факс: +375 17 209 50 59', - 'E-mail: stud.union.bsu@gmail.com' - ]; - - lines.forEach((line, index) => { - let textWidth = doc.getTextWidth(line); - doc.text(line, (pageWidth - textWidth) / 2, 25 + index * 5); - }); + // шапка документа + let facultyTitle = 'Факультет прикладной математики и информатики'; + let reportTitle = 'ДОКЛАДНАЯ ЗАПИСКА'; + let reportDate = '24.03.2023 г. № _________'; + let location = 'г. Минск'; + let recipientTitle = 'Начальнику службы охраны и безопасности'; + let recipientName = 'Довыдёнку А.О.'; - // Декан - doc.setFontSize(12); - doc.text('Декану ФПМИ', 150, 60); - doc.text('Орловичу Ю.Л.', 150, 65); + // Заголовок факультета + doc.text(facultyTitle, 20, 20, { maxWidth: pageWidth / 2 - 40 }); + + doc.text(reportTitle, 20, 35); + doc.text(reportDate, 20, 45); + doc.text(location, 20, 55); + + let recipientTitleWidth = doc.getTextWidth(recipientTitle); + doc.text(recipientTitle, pageWidth - recipientTitleWidth - 20, 20); + let recipientNameWidth = doc.getTextWidth(recipientName); + doc.text(recipientName, pageWidth - recipientNameWidth - 20, 25); const margin = 10; const maxWidth = pageWidth - margin * 2; - let width = doc.getTextWidth(`Уважаемый Юрий Леонидович!\n`); - doc.text(`Уважаемый Юрий Леонидович!\n`, (pageWidth - width) / 2, 70); - doc.setFontSize(12); const text = report.firstPrefix + @@ -61,7 +49,7 @@ export const generateReportPDF = (report: Report) => { report.action + '\n'; - doc.text(text, 20, 80, { maxWidth: maxWidth }); + doc.text(text, 20, 70, { maxWidth: maxWidth }); report.auds.forEach((aud, index) => { let daysText = ''; @@ -72,15 +60,15 @@ export const generateReportPDF = (report: Report) => { } let timeText = 'c ' + aud.timeFrom?.format('HH:mm') + ' по ' + aud.timeTo?.format('HH:mm'); - doc.text(`-. Аудиторию ${aud.number} ${daysText} ${timeText} `, 30, 100 + index * 10); + doc.text(`-. Аудиторию ${aud.number} ${daysText} ${timeText} `, 30, 85 + index * 10); }); - doc.text(`${report.sender}`, 20, 130); - doc.text('Е.О.Шевцов', 20, 135); + doc.text(`${report.sender}`, 20, 100); + doc.text('Е.О.Шевцов', 20, 105); - doc.text('Согласовано:', 20, 150); - doc.text('Декан ФПМИ БГУ', 20, 155); - doc.text('Ю.Л.Орлович', 20, 160); + doc.text('Согласовано:', pageWidth - 50, 100); + doc.text('Декан ФПМИ БГУ', pageWidth - 50, 105); + doc.text('Ю.Л.Орлович', pageWidth - 50, 110); doc.save('докладная.pdf'); const pdfDataUri = doc.output('datauristring'); From 768b4f59bc4ad4ad53410a41f6358b5d619f6cbd Mon Sep 17 00:00:00 2001 From: Simiys Date: Sun, 1 Sep 2024 21:59:06 +0300 Subject: [PATCH 5/5] added burger-menu to header, adaptive css to homepage, header and footer to loader page, changed theme button --- front-doc/src/App.tsx | 13 ++- .../src/components/cards/DocumentPageCard.tsx | 68 +++++++--------- front-doc/src/components/footer/Footer.css | 30 ++++--- front-doc/src/components/header/Header.css | 12 ++- .../src/components/header/HeaderComponent.tsx | 81 +++++++++++++++---- front-doc/src/pages/home/HomePage.tsx | 52 ++++++------ 6 files changed, 155 insertions(+), 101 deletions(-) diff --git a/front-doc/src/App.tsx b/front-doc/src/App.tsx index 47d5909..f7f8aab 100644 --- a/front-doc/src/App.tsx +++ b/front-doc/src/App.tsx @@ -25,6 +25,7 @@ function App() { const verifyToken = async () => { const authenticated = await checkToken(); setIsAuthenticated(authenticated); + setLoading(false); }; @@ -32,7 +33,7 @@ function App() { const timeout = setTimeout(() => { setLoading(false); - }, 500); + }, 1500); return () => { setLoading(true); clearTimeout(timeout); @@ -40,7 +41,15 @@ function App() { }, [pathname]); //if location pathname changing -> useEffect start work if (loading) { - return ; + return ( + + +
+ +
+ + + ); } return ( diff --git a/front-doc/src/components/cards/DocumentPageCard.tsx b/front-doc/src/components/cards/DocumentPageCard.tsx index 41c6936..73dd52e 100644 --- a/front-doc/src/components/cards/DocumentPageCard.tsx +++ b/front-doc/src/components/cards/DocumentPageCard.tsx @@ -1,40 +1,28 @@ -import { useNavigate } from "react-router-dom"; -import "../../App.css"; -import { Card, CardContent, Typography, CardActionArea } from "@mui/material"; -import "@fontsource/jost"; -import { DocumentsPageCard } from "../../interfaces/cardsInterfaces"; - -export const DocumentPageCard: React.FC = ({ - path, - header, - description, -}: DocumentsPageCard) => { - const navigate = useNavigate(); - - const handleClick = () => { - navigate(path); - }; - - return ( - - - - - {header} - - - {description} - - - - - ); -}; +import { useNavigate } from 'react-router-dom'; +import '../../App.css'; +import { Card, CardContent, Typography, CardActionArea } from '@mui/material'; +import '@fontsource/jost'; +import { DocumentsPageCard } from '../../interfaces/cardsInterfaces'; + +export const DocumentPageCard: React.FC = ({ path, header, description }: DocumentsPageCard) => { + const navigate = useNavigate(); + + const handleClick = () => { + navigate(path); + }; + + return ( + + + + + {header} + + + {description} + + + + + ); +}; diff --git a/front-doc/src/components/footer/Footer.css b/front-doc/src/components/footer/Footer.css index 3df4b8b..1da54ff 100644 --- a/front-doc/src/components/footer/Footer.css +++ b/front-doc/src/components/footer/Footer.css @@ -1,12 +1,18 @@ -.footer-component { - background-color: var(--footer-backgroud-color); - color: var(--footer-text-color); - width: 100%; - height: 60px; -} - -#creators { - border-color: var(--footer-text-color); - color: var(--footer-text-color); - margin-right: 40px; -} +.footer-component { + background-color: var(--footer-backgroud-color); + color: var(--footer-text-color); + width: 100%; + height: 60px; +} + +#creators { + border-color: var(--footer-text-color); + color: var(--footer-text-color); + margin-right: 40px; +} + +@media (max-width: 600px) { + #creators { + display: none; + } +} diff --git a/front-doc/src/components/header/Header.css b/front-doc/src/components/header/Header.css index e601958..6f46602 100644 --- a/front-doc/src/components/header/Header.css +++ b/front-doc/src/components/header/Header.css @@ -6,7 +6,7 @@ width: 100%; height: 60px; position: fixed; - z-index: 1; + z-index: 5; } .logo { @@ -16,8 +16,8 @@ } .header-text { - margin: 0 0 0 150px; - font-size: 30px; + margin: 0 0 0 5px; + font-size: 25px; color: var(--header-text-color); } @@ -42,3 +42,9 @@ display: flex; justify-content: space-between; } + +@media (max-width: 600px) { + .button-section { + display: none; + } +} diff --git a/front-doc/src/components/header/HeaderComponent.tsx b/front-doc/src/components/header/HeaderComponent.tsx index 3a19418..b561837 100644 --- a/front-doc/src/components/header/HeaderComponent.tsx +++ b/front-doc/src/components/header/HeaderComponent.tsx @@ -1,21 +1,59 @@ -import { useContext } from "react"; -import Stack from "@mui/material/Stack"; -import logo from "../../Images/Raccoon.png"; -import { Button } from "@mui/material"; -import "../../components/header/Header.css"; -import { ThemeContext } from "../../providers/ThemeProvider"; -import Brightness4Icon from "@mui/icons-material/Brightness4"; -import Brightness7Icon from "@mui/icons-material/Brightness7"; -import { useAuth } from "../../hooks/useLogin"; +import { useContext, useState } from 'react'; +import Stack from '@mui/material/Stack'; +import logo from '../../Images/Raccoon.png'; +import { Button, Drawer, IconButton, List, ListItem, ListItemText } from '@mui/material'; +import '../../components/header/Header.css'; +import { ThemeContext } from '../../providers/ThemeProvider'; +import Brightness4Icon from '@mui/icons-material/Brightness4'; +import Brightness7Icon from '@mui/icons-material/Brightness7'; +import { useAuth } from '../../hooks/useLogin'; +import MenuIcon from '@mui/icons-material/Menu'; +import { useNavigate } from 'react-router-dom'; export const HeaderComponent = () => { const { theme, setTheme } = useContext(ThemeContext); + const [drawerOpen, setDrawerOpen] = useState(false); const { isAuthenticated, logout } = useAuth(); + const navigate = useNavigate(); + + const handleButtonClick = () => { + navigate('/creators'); + }; + const changeTheme = () => { - setTheme(theme === "light" ? "dark" : "light"); + setTheme(theme === 'light' ? 'dark' : 'light'); + }; + + const toggleDrawer = (open: boolean) => (event: any) => { + if (event.type === 'keydown' && (event.key === 'Tab' || event.key === 'Shift')) { + return; + } + setDrawerOpen(open); }; + const menuItems = ( + + + + {theme === 'dark' ? : } + + + + + {isAuthenticated && ( + <> + + + + + + + + )} + + ); + return (
{ spacing={1} alignItems="center" justifyContent="space-between" - paddingX={"10px"} + paddingX={'10px'} > Raccoon logo -

Документооборот Проектного направления

+

DOC-FAMCS

- {isAuthenticated && ( <> -
+ + + + + + {menuItems} +
); }; diff --git a/front-doc/src/pages/home/HomePage.tsx b/front-doc/src/pages/home/HomePage.tsx index ca76e07..3548dec 100644 --- a/front-doc/src/pages/home/HomePage.tsx +++ b/front-doc/src/pages/home/HomePage.tsx @@ -1,29 +1,23 @@ -import { Stack } from "@mui/material"; -import { DocumentPageCard } from "../../components/cards/DocumentPageCard"; -import { documentTypes } from "../../constants/documentTypes"; - -export const HomePage = () => { - return ( - - {documentTypes.map((card) => { - return ( - - ); - })} - - ); -}; +import { Stack } from '@mui/material'; +import { DocumentPageCard } from '../../components/cards/DocumentPageCard'; +import { documentTypes } from '../../constants/documentTypes'; + +export const HomePage = () => { + return ( + + {documentTypes.map((card) => { + return ; + })} + + ); +};