From 6b0b5e991cdc84edd07774c669a611c0c106f954 Mon Sep 17 00:00:00 2001 From: Z1chi Date: Tue, 17 Jan 2023 22:14:05 +0300 Subject: [PATCH] =?UTF-8?q?=D0=9F=D0=B5=D1=80=D0=B5=D0=BF=D0=B8=D1=81?= =?UTF-8?q?=D1=8B=D0=B2=D0=B0=D1=8E=20=D1=81=D0=BF=D0=BE=D1=80=D0=BD=D1=8B?= =?UTF-8?q?=D0=B5=20=D1=80=D0=B5=D1=88=D0=B5=D0=BD=D0=B8=D1=8F=20=D0=A4?= =?UTF-8?q?=D0=B8=D0=BA=D1=81=20=D0=BE=D1=82=D0=BF=D1=80=D0=B0=D0=B2=D0=BA?= =?UTF-8?q?=D0=B8=20=D0=BE=D1=82=D1=87=D0=B5=D1=82=D0=B0,=20=D0=BF=D1=80?= =?UTF-8?q?=D0=BE=D0=B2=D0=B5=D1=80=D0=BA=D0=B0=20=D0=BD=D0=B0=20=D0=BC?= =?UTF-8?q?=D0=B0=D1=81=D1=81=D0=B8=D0=B2=20=D0=B2=20map=20=D0=B2=20Descri?= =?UTF-8?q?ption.js?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 2 +- src/App.js | 23 ++-- src/components/Calendar/Calendar.js | 70 +++++----- src/components/Calendar/calendar.scss | 13 +- src/components/Description/Description.js | 15 +-- src/components/Home/Home.js | 6 +- src/components/LogoutButton/LogoutButton.js | 25 ++-- src/components/LogoutButton/logoutButton.scss | 55 +++----- src/components/Outstaffing/Outstaffing.js | 127 +++++++++--------- src/components/Outstaffing/outstaffing.scss | 6 +- src/components/ReportForm/ReportForm.js | 2 +- src/pages/{ => ActPage}/ActPage.js | 4 +- src/pages/CalendarPage.js | 4 +- src/pages/CodeSnippetPage.js | 16 +-- src/pages/{ => FormPage}/FormPage.js | 27 ++-- src/pages/{ => FormPage}/formPage.scss | 0 src/pages/HomePage.js | 7 - src/pages/ProfileCalendarPage.js | 8 -- src/pages/ReportFormPage.js | 7 - .../SingleReportPage.js | 22 +-- .../singleReportPage.scss | 12 +- 21 files changed, 220 insertions(+), 231 deletions(-) rename src/pages/{ => ActPage}/ActPage.js (57%) rename src/pages/{ => FormPage}/FormPage.js (83%) rename src/pages/{ => FormPage}/formPage.scss (100%) delete mode 100644 src/pages/HomePage.js delete mode 100644 src/pages/ProfileCalendarPage.js delete mode 100644 src/pages/ReportFormPage.js rename src/pages/{ => SingleReportPage}/SingleReportPage.js (88%) rename src/pages/{ => SingleReportPage}/singleReportPage.scss (90%) diff --git a/README.md b/README.md index 0c83cde2..a856ae62 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,4 @@ -# Getting Started with Create React App +nvm# Getting Started with Create React App This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app). diff --git a/src/App.js b/src/App.js index 42599d00..318c49ef 100644 --- a/src/App.js +++ b/src/App.js @@ -4,13 +4,13 @@ import {BrowserRouter as Router, Route, Routes, Navigate} from 'react-router-dom import AuthForPartners from "./pages/AuthForPartners/AuthForPartners"; import AuthForDevelopers from "./pages/AuthForDevelopers/AuthForDevelopers"; -import HomePage from './pages/HomePage' +import Home from "./components/Home/Home"; import CandidatePage from './pages/CandidatePage' -import CalendarPage from './pages/CalendarPage' -import ReportPage from './pages/ReportFormPage.js' -import ProfileCalendarPage from './pages/ProfileCalendarPage.js' -import FormPage from './pages/FormPage.js' -import SingleReportPage from './pages/SingleReportPage' +import Calendar from "./components/Calendar/Calendar"; +import ReportForm from "./components/ReportForm/ReportForm"; +import {ProfileCalendar} from "./components/ProfileCalendar/ProfileCalendar"; +import FormPage from './pages/FormPage/FormPage.js' +import SingleReportPage from './pages/SingleReportPage/SingleReportPage' import {QuizPage} from './pages/quiz/QuizPage' import {InterjacentPage} from './pages/quiz/InterjacentPage' import {QuizTestPage} from './pages/quiz/QuizTestPage' @@ -23,23 +23,24 @@ import './fonts/stylesheet.css' import 'bootstrap/dist/css/bootstrap.min.css' + const App = () => { return ( <> -

IT Аутстаффинг в России

- }/> + + }/> }/> }/> }/> }/> - }/> + }/> - }/> + }/> }/> @@ -52,7 +53,7 @@ const App = () => { }/> - }/> + }/> }/> diff --git a/src/components/Calendar/Calendar.js b/src/components/Calendar/Calendar.js index 3c414f38..36705682 100644 --- a/src/components/Calendar/Calendar.js +++ b/src/components/Calendar/Calendar.js @@ -1,22 +1,27 @@ import React, {useEffect, useState} from 'react' import {useSelector} from 'react-redux' -import {selectCurrentCandidate} from '../../redux/outstaffingSlice' -import {Link} from 'react-router-dom' +import {Link, useNavigate} from 'react-router-dom' import CalendarComponent from './CalendarComponent' import {currentMonth} from './calendarHelper' import {Footer} from '../Footer/Footer' +import {LogoutButton} from "../LogoutButton/LogoutButton"; + +import {selectCurrentCandidate} from '../../redux/outstaffingSlice' import rectangle from '../../images/rectangle_secondPage.png' import './calendar.scss' -const Calendar = ({onSelect}) => { + +const Calendar = () => { const candidateForCalendar = useSelector(selectCurrentCandidate); const [month, setMonth] = useState(''); + const navigate = useNavigate(); + useEffect(() => { setMonth(currentMonth) }, [month]); @@ -26,38 +31,43 @@ const Calendar = ({onSelect}) => { const abbreviatedName = name && name.substring(0, name.lastIndexOf(' ')); return ( -
-
-

- Добрый день, Александр ! -

-
-
- img -

{abbreviatedName}

+
+
+
+
+

+ Добрый день, Александр ! +

+
-
-

{skillsName} разработчик

- img -
-
- - - +
+
+ img +

{abbreviatedName}

+
+
+

{skillsName} разработчик

+ img +
+
+ + + +
-
-
-
- -

- {month} : 60 часов -

+
+
+ { navigate('/report/0') }}/> +

+ {month} : 60 часов +

+
-
-
-
+
+
+ ) }; diff --git a/src/components/Calendar/calendar.scss b/src/components/Calendar/calendar.scss index 0b32bbfd..1b52c24d 100644 --- a/src/components/Calendar/calendar.scss +++ b/src/components/Calendar/calendar.scss @@ -2,6 +2,17 @@ margin-bottom: 40px; font-family: 'LabGrotesque', sans-serif; + &__header { + display: flex; + justify-content: center; + align-items: center; + width: 100%; + padding: 0 20px; + h2 { + flex: 1; + } + } + &__profile { color: #282828; font-size: 3.4em; @@ -45,8 +56,6 @@ position: absolute; width: 132px; height: 132px; - left: -40px; - top: -10px; } } diff --git a/src/components/Description/Description.js b/src/components/Description/Description.js index 78ae6e65..05a543ed 100644 --- a/src/components/Description/Description.js +++ b/src/components/Description/Description.js @@ -22,7 +22,7 @@ const Description = ({ onLoadMore, isLoadingMore }) => {
- {candidatesListArr && candidatesListArr.length > 0 ? ( + {candidatesListArr && Array.isArray(candidatesListArr) && candidatesListArr.length > 0 ? ( candidatesListArr.map((el) => (
@@ -56,7 +56,7 @@ const Description = ({ onLoadMore, isLoadingMore }) => {
    - {el.skillValues.map((e) => ( + {Array.isArray(el?.skillValues) && el.skillValues.map((e) => (
  • {e.skill.name}
    • @@ -104,7 +104,7 @@ const Description = ({ onLoadMore, isLoadingMore }) => {
    - {filteredListArr && filteredListArr.length > 0 + {filteredListArr && Array.isArray(filteredListArr) && filteredListArr.length > 0 ? filteredListArr.map((el) => (
    @@ -139,7 +139,7 @@ const Description = ({ onLoadMore, isLoadingMore }) => {
      - {el.skillValues.map((e) => ( + {Array.isArray(el?.skillValues) && el.skillValues?.map((e) => (
    • {e.skill.name}
      • @@ -155,7 +155,7 @@ const Description = ({ onLoadMore, isLoadingMore }) => {
    )) : /* :
    В данный момент в категории нет свободных специалистов
    } */ - candidatesListArr && + candidatesListArr && Array.isArray(candidatesListArr) && candidatesListArr.map((el) => (
    @@ -186,7 +186,7 @@ const Description = ({ onLoadMore, isLoadingMore }) => {
      - {el.skillValues.map((e) => ( + {Array.isArray(el?.skillValues) && el.skillValues?.map((e) => (
    • {e.skill.name}
      • @@ -207,8 +207,7 @@ const Description = ({ onLoadMore, isLoadingMore }) => {
      - { - candidatesListArr && + {candidatesListArr && filteredListArr.length === 0 ? ( ) : null} diff --git a/src/components/Home/Home.js b/src/components/Home/Home.js index af5042ea..748f74a9 100644 --- a/src/components/Home/Home.js +++ b/src/components/Home/Home.js @@ -8,6 +8,7 @@ import {Footer} from '../Footer/Footer' import {profiles, tags} from '../../redux/outstaffingSlice' import {useRequest} from "../../hooks/useRequest"; +import {LogoutButton} from "../LogoutButton/LogoutButton"; const Home = () => { @@ -53,11 +54,12 @@ const Home = () => { }; return ( - <> +
      +
      - +
      ) }; diff --git a/src/components/LogoutButton/LogoutButton.js b/src/components/LogoutButton/LogoutButton.js index 2025614d..12cc5389 100644 --- a/src/components/LogoutButton/LogoutButton.js +++ b/src/components/LogoutButton/LogoutButton.js @@ -14,18 +14,17 @@ export const LogoutButton = () => { const navigate = useNavigate(); return ( -
      - -
      + ) }; diff --git a/src/components/LogoutButton/logoutButton.scss b/src/components/LogoutButton/logoutButton.scss index b3224b20..3a615a66 100644 --- a/src/components/LogoutButton/logoutButton.scss +++ b/src/components/LogoutButton/logoutButton.scss @@ -1,40 +1,27 @@ .logout-button { - position: absolute; - top: 70px; - right: 2.5rem; - z-index: 100; - button { - display: flex; - justify-content: center; - align-items: center; - margin: 0; - width: 131px; - height: 40px; - border-radius: 10px; - font-family: 'Muller'; - font-size: 1.6em; - letter-spacing: 0.8px; - background-color: #6aaf5c; - color: #ffffff; - border: 3px solid #6aaf5c; - font-family: 'Muller'; - text-align: center; - } + position: relative; + z-index: 100; + display: flex; + justify-content: center; + align-items: center; + margin: 0; + width: 131px; + height: 40px; + border-radius: 10px; + font-size: 1.6em; + letter-spacing: 0.8px; + background-color: #6aaf5c; + color: #ffffff; + border: 3px solid #6aaf5c; + font-family: 'Muller', sans-serif; + text-align: center; &:hover { - button { - background-color: #ffffff; - color: #6aaf5c; - border: 3px solid #6aaf5c; - box-shadow: 3px 2px 5px rgba(82, 151, 34, 0.21); - transition: 0.3s; - } - } -} - -@media (max-width: 1199px) { - .logout-button { - top: 16px !important; + background-color: #ffffff; + color: #6aaf5c; + border: 3px solid #6aaf5c; + box-shadow: 3px 2px 5px rgba(82, 151, 34, 0.21); + transition: 0.3s; } } diff --git a/src/components/Outstaffing/Outstaffing.js b/src/components/Outstaffing/Outstaffing.js index c50a581c..075ef57f 100644 --- a/src/components/Outstaffing/Outstaffing.js +++ b/src/components/Outstaffing/Outstaffing.js @@ -1,26 +1,27 @@ -import React from 'react' -import { useSelector, useDispatch } from 'react-redux' +import React from 'react' +import {useSelector, useDispatch} from 'react-redux' import OutstaffingBlock from '../OutstaffingBlock/OutstaffingBlock' import TagSelect from '../Select/TagSelect' -import { selectTags, getPositionId, setPositionId} from '../../redux/outstaffingSlice' +import {selectTags, getPositionId, setPositionId} from '../../redux/outstaffingSlice' import front from '../../images/front_end.png' import back from '../../images/back_end.png' import design from '../../images/design.png' import './outstaffing.scss' +import {LogoutButton} from "../LogoutButton/LogoutButton"; const createSelectPositionHandler = - ({ positionId, setPositionId, dispatch }) => - (id) => { - if (id === positionId) { - dispatch(setPositionId(null)) - } else { - dispatch(setPositionId(id)) - } - }; + ({positionId, setPositionId, dispatch}) => + (id) => { + if (id === positionId) { + dispatch(setPositionId(null)) + } else { + dispatch(setPositionId(id)) + } + }; const Outstaffing = () => { const dispatch = useDispatch(); @@ -33,62 +34,58 @@ const Outstaffing = () => { dispatch }); return ( - <> -
      -
      -
      -
      -

      - Аутстаффинг it-персонала -

      + <> +
      +
      +

      + Аутстаффинг it-персонала +

      + +
      +
      +
      + tag.name === 'skills_front') + } + img={front} + header='Frontend' + positionId='2' + isSelected={positionId === '2'} + onSelect={(id) => onSelectPosition(id)} + /> +
      +
      + tag.name === 'skills_back') + } + img={back} + header='Backend' + positionId='1' + isSelected={positionId === '1'} + onSelect={(id) => onSelectPosition(id)} + /> +
      +
      + tag.name === 'skills_design') + } + img={design} + header='Дизайн' + positionId='5' + isSelected={positionId === '5'} + onSelect={(id) => onSelectPosition(id)} + />
      -
      - -
      -
      - tag.name === 'skills_front') - } - img={front} - header='Frontend' - positionId='2' - isSelected={positionId === '2'} - onSelect={(id) => onSelectPosition(id)} - /> -
      -
      - tag.name === 'skills_back') - } - img={back} - header='Backend' - positionId='1' - isSelected={positionId === '1'} - onSelect={(id) => onSelectPosition(id)} - /> -
      -
      - tag.name === 'skills_design') - } - img={design} - header='Дизайн' - positionId='5' - isSelected={positionId === '5'} - onSelect={(id) => onSelectPosition(id)} - /> -
      -
      -
      - - +
    + + ) }; diff --git a/src/components/Outstaffing/outstaffing.scss b/src/components/Outstaffing/outstaffing.scss index 4311a213..24587d42 100644 --- a/src/components/Outstaffing/outstaffing.scss +++ b/src/components/Outstaffing/outstaffing.scss @@ -1,11 +1,15 @@ .outstaffing { &__title { margin-top: 60px; + display: flex; + justify-content: center; + align-items: center; h2 { + flex: 1; text-align: center; color: #52b709; - font-family: 'GT Eesti Pro Display'; + font-family: 'GT Eesti Pro Display', sans-serif; font-size: 5em; font-weight: 700; font-style: normal; diff --git a/src/components/ReportForm/ReportForm.js b/src/components/ReportForm/ReportForm.js index dda718bb..302b4cf0 100644 --- a/src/components/ReportForm/ReportForm.js +++ b/src/components/ReportForm/ReportForm.js @@ -58,7 +58,7 @@ const ReportForm = () => { const handler = () => { apiRequest('/reports/create', { method: 'POST', - body: { + data: { tasks: inputs, difficulties: troublesInputValue, tomorrow: scheduledInputValue, diff --git a/src/pages/ActPage.js b/src/pages/ActPage/ActPage.js similarity index 57% rename from src/pages/ActPage.js rename to src/pages/ActPage/ActPage.js index ea89a220..1188671b 100644 --- a/src/pages/ActPage.js +++ b/src/pages/ActPage/ActPage.js @@ -1,6 +1,6 @@ import React from 'react'; -import { ActContent } from "../components/features/bookkeeping/ActContent/ActContent" -import { BookkeepingTemplete } from "../components/features/bookkeeping/BookkeepingTemplete/BookkeepingTemplete" +import { ActContent } from "../../components/features/bookkeeping/ActContent/ActContent" +import { BookkeepingTemplete } from "../../components/features/bookkeeping/BookkeepingTemplete/BookkeepingTemplete" export const ActPage = () => { return ( diff --git a/src/pages/CalendarPage.js b/src/pages/CalendarPage.js index 51dde842..98c183ea 100644 --- a/src/pages/CalendarPage.js +++ b/src/pages/CalendarPage.js @@ -4,8 +4,8 @@ import { WithLogout } from '../hoc/withLogout'; import Calendar from '../components/Calendar/Calendar'; const CalendarPage = () => { - const navigate = useNavigate(); - return { navigate('/report/0') }} />; + + return ; }; export default CalendarPage; diff --git a/src/pages/CodeSnippetPage.js b/src/pages/CodeSnippetPage.js index 9ed134c8..50717833 100644 --- a/src/pages/CodeSnippetPage.js +++ b/src/pages/CodeSnippetPage.js @@ -4,14 +4,14 @@ import { a11yDark } from 'react-syntax-highlighter/dist/esm/styles/prism'; export const CodeSnippetlighter = () => { const [codeString, setCodeString] = useState(``) - - useEffect(()=>{ - fetch('/code.txt') - .then((r) => r.text()) - .then(text => { - setCodeString(text) - }) - }, []) + // + // useEffect(()=>{ + // fetch('/code.txt') + // .then((r) => r.text()) + // .then(text => { + // setCodeString(text) + // }) + // }, []) return ( diff --git a/src/pages/FormPage.js b/src/pages/FormPage/FormPage.js similarity index 83% rename from src/pages/FormPage.js rename to src/pages/FormPage/FormPage.js index ea4a5dfd..365d98c8 100644 --- a/src/pages/FormPage.js +++ b/src/pages/FormPage/FormPage.js @@ -1,22 +1,25 @@ import React from 'react' import {useDispatch, useSelector} from 'react-redux' import {useParams, useNavigate} from 'react-router-dom' -import { - currentCandidate, - selectCurrentCandidate, -} from '../redux/outstaffingSlice' import SVG from 'react-inlinesvg' -import {WithLogout} from '../hoc/withLogout' -import Form from '../components/Form/Form' -import {LEVELS, SKILLS} from '../constants/constants' -import {Footer} from '../components/Footer/Footer' -import arrow from '../images/right-arrow.png' -import rectangle from '../images/rectangle_secondPage.png' -import telegramIcon from '../images/telegram-icon.svg' +import {useRequest} from "../../hooks/useRequest"; +import {WithLogout} from '../../hoc/withLogout' + +import Form from '../../components/Form/Form' +import {Footer} from '../../components/Footer/Footer' + +import arrow from '../../images/right-arrow.png' +import rectangle from '../../images/rectangle_secondPage.png' +import telegramIcon from '../../images/telegram-icon.svg' + +import {LEVELS, SKILLS} from '../../constants/constants' + +import {currentCandidate, selectCurrentCandidate} from '../../redux/outstaffingSlice' import './formPage.scss' -import {useRequest} from "../hooks/useRequest"; + + const FormPage = () => { diff --git a/src/pages/formPage.scss b/src/pages/FormPage/formPage.scss similarity index 100% rename from src/pages/formPage.scss rename to src/pages/FormPage/formPage.scss diff --git a/src/pages/HomePage.js b/src/pages/HomePage.js deleted file mode 100644 index a11f569c..00000000 --- a/src/pages/HomePage.js +++ /dev/null @@ -1,7 +0,0 @@ -import React from 'react'; -import { WithLogout } from '../hoc/withLogout'; -import Home from '../components/Home/Home'; - -const HomePage = () => ; - -export default HomePage; diff --git a/src/pages/ProfileCalendarPage.js b/src/pages/ProfileCalendarPage.js deleted file mode 100644 index ea095ea2..00000000 --- a/src/pages/ProfileCalendarPage.js +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react'; -import { ProfileCalendar } from '../../src/components/ProfileCalendar/ProfileCalendar'; - -const ProfileCalendarPage = () => { - return ; -}; - -export default ProfileCalendarPage; diff --git a/src/pages/ReportFormPage.js b/src/pages/ReportFormPage.js deleted file mode 100644 index d8893f76..00000000 --- a/src/pages/ReportFormPage.js +++ /dev/null @@ -1,7 +0,0 @@ -import React from 'react'; -import { WithLogout } from '../hoc/withLogout'; -import ReportForm from '../components/ReportForm/ReportForm'; - -const ReportFormPage = () => ; - -export default ReportFormPage; diff --git a/src/pages/SingleReportPage.js b/src/pages/SingleReportPage/SingleReportPage.js similarity index 88% rename from src/pages/SingleReportPage.js rename to src/pages/SingleReportPage/SingleReportPage.js index f721a0fa..930f4d56 100644 --- a/src/pages/SingleReportPage.js +++ b/src/pages/SingleReportPage/SingleReportPage.js @@ -1,15 +1,17 @@ import React from 'react' -import { WithLogout } from '../hoc/withLogout' -import arrowLeft from '../images/right-arrow.png' +import { WithLogout } from '../../hoc/withLogout' +import arrowLeft from '../../images/right-arrow.png' import SVG from 'react-inlinesvg' -import dateArrowIcon from '../images/dateArrow.svg' -import calendarIcon from '../images/calendar.svg' +import dateArrowIcon from '../../images/dateArrow.svg' +import calendarIcon from '../../images/calendar.svg' -import { TaskItem } from '../components/TaskItem/TaskItem' +import { TaskItem } from '../../components/TaskItem/TaskItem' import './singleReportPage.scss' +import {useNavigate} from "react-router"; +import {LogoutButton} from "../../components/LogoutButton/LogoutButton"; const tasks = [ { @@ -25,10 +27,13 @@ const tasks = [ ]; const SingleReportPage = () => { + + const navigate= useNavigate(); + return ( - +
    -
    +
    {navigate(-1)}} className='single-report-page__back'>
    arrowLeft
    @@ -100,8 +105,9 @@ const SingleReportPage = () => {
    +
    -     + ) }; diff --git a/src/pages/singleReportPage.scss b/src/pages/SingleReportPage/singleReportPage.scss similarity index 90% rename from src/pages/singleReportPage.scss rename to src/pages/SingleReportPage/singleReportPage.scss index c8ad76d2..95569280 100644 --- a/src/pages/singleReportPage.scss +++ b/src/pages/SingleReportPage/singleReportPage.scss @@ -1,15 +1,14 @@ .single-report-page { - padding-top: 4.6rem; - + padding: 4.6rem 20px 0; + font-family: 'GT Eesti Pro Display', sans-serif; &__back { display: flex; justify-content: flex-start; align-items: center; - + cursor: pointer; &-text { margin-left: 3.1rem; color: #000000; - font-family: 'GT Eesti Pro Display'; font-size: 18px; font-weight: 300; letter-spacing: normal; @@ -26,7 +25,6 @@ &-text { color: #282828; - font-family: 'GT Eesti Pro Display'; font-size: 33px; font-weight: 700; line-height: 48.74px; @@ -52,7 +50,6 @@ border-radius: 5px; border: 1px solid #c4c4c4; background-color: #f0f7e0; - display: flex; justify-content: center; align-items: center; @@ -63,7 +60,6 @@ margin-left: 10px; margin-bottom: 0; color: #000000; - font-family: "GT Eesti Pro Display"; font-size: 13px; font-weight: 300; font-style: normal; @@ -104,7 +100,6 @@ align-items: center; h3 { color: #18586e; - font-family: 'GT Eesti Pro Display'; font-size: 20px; font-weight: 500; letter-spacing: normal; @@ -117,7 +112,6 @@ margin-top: 2.4rem; width: 580px; color: #000000; - font-family: 'GT Eesti Pro Display'; font-size: 15px; font-weight: 400; letter-spacing: normal;