Added page settings

src/App.js

@@ -1,6 +1,10 @@
-import React from 'react'
+import React from "react";
-import {BrowserRouter as Router, Route, Routes, Navigate} from 'react-router-dom';
+import {
-
+  BrowserRouter as Router,
+  Route,
+  Routes,
+  Navigate,
+} from "react-router-dom";
 
 import AuthForPartners from "./pages/AuthForPartners/AuthForPartners";
 import AuthForDevelopers from "./pages/AuthForDevelopers/AuthForDevelopers";
@@ -8,76 +12,71 @@ import Home from "./pages/Home/Home";
 import Candidate from "./components/Candidate/Candidate";
 import Calendar from "./components/Calendar/Calendar";
 import ReportForm from "./components/ReportForm/ReportForm";
-import {ProfileCalendar} from "./components/ProfileCalendar/ProfileCalendar";
+import { ProfileCalendar } from "./components/ProfileCalendar/ProfileCalendar";
-import FormPage from './pages/FormPage/FormPage.js'
+import FormPage from "./pages/FormPage/FormPage.js";
-import SingleReportPage from './pages/SingleReportPage/SingleReportPage'
+import SingleReportPage from "./pages/SingleReportPage/SingleReportPage";
-import {QuizPage} from './pages/quiz/QuizPage'
+import { QuizPage } from "./pages/quiz/QuizPage";
-import {InterjacentPage} from './pages/quiz/InterjacentPage'
+import { InterjacentPage } from "./pages/quiz/InterjacentPage";
-import {QuizTestPage} from './pages/quiz/QuizTestPage'
+import { QuizTestPage } from "./pages/quiz/QuizTestPage";
-import {InstructionPage} from './pages/quiz/InstructionPage'
+import { InstructionPage } from "./pages/quiz/InstructionPage";
-import {ResultPage} from './pages/quiz/ResultPage'
+import { ResultPage } from "./pages/quiz/ResultPage";
-import {Profile} from './pages/Profile/Profile.js'
+import { Profile } from "./pages/Profile/Profile.js";
-import {Summary} from './pages/Summary/Summary'
+import { Summary } from "./pages/Summary/Summary";
-import {ViewReport} from './pages/ViewReport/ViewReport'
+import { ViewReport } from "./pages/ViewReport/ViewReport";
-import {Tracker} from './pages/Tracker/Tracker'
+import { Tracker } from "./pages/Tracker/Tracker";
-import {Payouts} from './pages/Payouts/Payouts'
+import { Payouts } from "./pages/Payouts/Payouts";
-import {Settings} from './pages/Settings/Settings'
+import { PartnerSettings } from "./pages/PartnerSettings/PartnerSettings";
-import {PartnerRequests} from './pages/PartnerRequests/PartnerRequests'
+import { PartnerRequests } from "./pages/PartnerRequests/PartnerRequests";
-import {PartnerAddRequest} from './pages/PartnerAddRequest/PartnerAddRequest'
+import { PartnerAddRequest } from "./pages/PartnerAddRequest/PartnerAddRequest";
-import {PartnerBid} from './pages/PartnerBid/PartnerBid'
+import { PartnerBid } from "./pages/PartnerBid/PartnerBid";
-import {PartnerPersonalInfo} from "./pages/PartnerPersonalInfo/PartnerPersonalInfo";
+import { PartnerPersonalInfo } from "./pages/PartnerPersonalInfo/PartnerPersonalInfo";
-
-import './fonts/stylesheet.css'
-import 'bootstrap/dist/css/bootstrap.min.css'
-
-
 
+import "./fonts/stylesheet.css";
+import "bootstrap/dist/css/bootstrap.min.css";
 
 const App = () => {
   return (
     <>
       <Router>
-
         <Routes>
+          <Route exact path="/authdev" element={<AuthForDevelopers />} />
+          <Route exact path="/auth" element={<AuthForPartners />} />
 
-            <Route exact path='/authdev' element={<AuthForDevelopers/>}/>
+          <Route exact path="/candidate/:id" element={<Candidate />} />
-            <Route exact path='/auth' element={<AuthForPartners/>}/>
+          <Route exact path="/candidate/:id/form" element={<FormPage />} />
+          <Route path="/:userId/calendar" element={<Calendar />} />
 
-            <Route exact path='/candidate/:id' element={<Candidate/>}/>
+          <Route exact path="/report" element={<ReportForm />} />
-            <Route exact path='/candidate/:id/form' element={<FormPage/>}/>
+          <Route path="/report/:id" element={<SingleReportPage />} />
-            <Route path='/:userId/calendar' element={<Calendar/>}/>
 
-            <Route exact path='/report' element={<ReportForm/>}/>
+          <Route exact path="quiz">
-            <Route path='/report/:id' element={<SingleReportPage/>}/>
+            <Route index element={<QuizPage />} />
-
+            <Route exact path="interjacent" element={<InterjacentPage />} />
-            <Route exact path='quiz'>
+            <Route exact path="test" element={<QuizTestPage />} />
-              <Route index element={<QuizPage/>}/>
+            <Route exact path="instruction" element={<InstructionPage />} />
-              <Route exact path='interjacent' element={<InterjacentPage/>}/>
+            <Route exact path="result" element={<ResultPage />} />
-              <Route exact path='test' element={<QuizTestPage/>}/>
-              <Route exact path='instruction' element={<InstructionPage/>}/>
-              <Route exact path='result' element={<ResultPage/>}/>
           </Route>
 
-            <Route exact path='profile'>
+          <Route exact path="profile">
-              <Route index element={<Profile/>}/>
+            <Route index element={<Profile />} />
-              <Route exact path='personals' element={<Home/>}/>
+            <Route exact path="personals" element={<Home />} />
-              <Route exact path='calendar' element={<ProfileCalendar/>}/>
+            <Route exact path="calendar" element={<ProfileCalendar />} />
-              <Route exact path='summary' element={<Summary/>}/>
+            <Route exact path="summary" element={<Summary />} />
-              <Route exact path='view' element={<ViewReport/>}/>
+            <Route exact path="view" element={<ViewReport />} />
-              <Route exact path='tracker' element={<Tracker/>}/>
+            <Route exact path="tracker" element={<Tracker />} />
-              <Route exact path='payouts' element={<Payouts/>}/>
+            <Route exact path="payouts" element={<Payouts />} />
-              <Route exact path='settings' element={<Settings/>}/>
+            <Route exact path="settings" element={<PartnerSettings />} />
-              <Route exact path='requests' element={<PartnerRequests/>}/>
+            <Route exact path="requests" element={<PartnerRequests />} />
-              <Route exact path='add-request' element={<PartnerAddRequest/>}/>
+            <Route exact path="add-request" element={<PartnerAddRequest />} />
-              <Route exact path='bid' element={<PartnerBid/>}/>
+            <Route exact path="bid" element={<PartnerBid />} />
-              <Route exact path='employees' element={<PartnerPersonalInfo/>}/>
+            <Route exact path="employees" element={<PartnerPersonalInfo />} />
           </Route>
 
-            <Route path="*" element={<Navigate to="/profile" replace/>}/>
+          <Route path="*" element={<Navigate to="/profile" replace />} />
         </Routes>
       </Router>
     </>
-  )
+  );
 };
 
-export default App
+export default App;

src/pages/PartnerSettings/PartnerSettings.js

@@ -0,0 +1,68 @@
+import React from "react";
+import { Footer } from "../../components/Footer/Footer";
+
+import { ProfileBreadcrumbs } from "../../components/ProfileBreadcrumbs/ProfileBreadcrumbs";
+import { ProfileHeader } from "../../components/ProfileHeader/ProfileHeader";
+
+import "./partnerSettings.scss";
+
+export const PartnerSettings = () => {
+  return (
+    <div className="settings">
+      <ProfileHeader />
+      <div className="container settings__page">
+        <ProfileBreadcrumbs
+          links={[
+            { name: "Главная", link: "/profile" },
+            { name: "Данные моего персонала", link: "/profile/employees" },
+          ]}
+        />
+        <div className="partner-settings">
+          <h2 className="infoPersonal__title">Настройки акаунта</h2>
+          <div className="partner-settings__body">
+            <div className="partner-settings__login">
+              <h3 className="settings__title">Вход в систему</h3>
+              <p className="settings__lable-first">Изменение логина</p>
+              <div className="settings__input">
+                <input></input>
+              </div>
+
+              <p className="settings__lable-second">Изменение пароля</p>
+              <div className="settings__input">
+                <input></input>
+              </div>
+
+              <div>
+                <button>Отмена</button>
+                <button>Сохранить</button>
+              </div>
+              <span>
+                Нажимая "Сохранить", вы соглашаетесь с Правилами обработки и
+                использования персональных данных
+              </span>
+            </div>
+            <div className="partner-settings__report">
+              <h3 className="settings__title">Документы и отчеты</h3>
+              <p className="settings__lable-first">Изменить провадера ЭДО</p>
+              <div className="settings__input">
+                <input></input>
+              </div>
+
+              <div>
+                <button>Отмена</button>
+                <button>Сохранить</button>
+              </div>
+              <span>
+                Нажимая "Сохранить", вы соглашаетесь с Правилами обработки и
+                использования персональных данных
+              </span>
+            </div>
+          </div>
+        </div>
+      </div>
+      <Footer />
+    </div>
+  );
+};
+
+export default PartnerSettings;

src/pages/PartnerSettings/partnerSettings.scss

@@ -0,0 +1,74 @@
+.settings {
+  background: #f1f1f1;
+
+  &__page {
+    max-width: 1160px !important;
+    margin-top: 23px;
+  }
+
+  &__title {
+    color: #5b6871;
+    font-size: 20px;
+    line-height: 24px;
+  }
+
+  &__lable {
+    &-first,
+    &-second {
+      font-size: 15px;
+      line-height: 18px;
+      color: #000000;
+    }
+
+    &-first {
+      margin: 39px 0 10px 0;
+    }
+    &-second {
+      margin: 31px 0 10px 0;
+    }
+  }
+
+  &__input {
+    background: #eff2f7;
+    border-radius: 8px;
+    width: 373px;
+    height: 35px;
+    border: none;
+
+    input {
+      font-size: 15px;
+      background: #eff2f7;
+      height: 100%;
+      margin-left: 15px;
+      width: 85%;
+      border: none;
+      outline: none;
+    }
+  }
+}
+
+.partner-settings {
+  margin-bottom: 110px;
+
+  &__body {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    margin-top: 27px;
+  }
+
+  &__login {
+  }
+
+  &__report {
+  }
+
+  &__report,
+  &__login {
+    width: 500px;
+    height: 435px;
+    background: #ffffff;
+    border-radius: 12px;
+    padding: 30px 60px;
+  }
+}

src/pages/Settings/Settings.js

@@ -1,11 +0,0 @@
-import React from 'react';
-
-import {ProfileHeader} from "../../components/ProfileHeader/ProfileHeader";
-
-export const Settings = () => {
-    return (
-        <div className='settings'>
-            <ProfileHeader />
-        </div>
-    )
-};