vacancy

2024-07-21 16:37:39 +03:00
parent 268ff58ccd
commit a561ed83c4
10 changed files with 733 additions and 2 deletions
--- a/src/pages/OpenRequests/OpenRequest.jsx
+++ b/src/pages/OpenRequests/OpenRequest.jsx
@ -1,13 +1,289 @@
-import React from "react";
+import React, { useState } from "react";

 import { Footer } from "@components/Common/Footer/Footer";
 import { Navigation } from "@components/Navigation/Navigation";
 import { ProfileBreadcrumbs } from "@components/ProfileBreadcrumbs/ProfileBreadcrumbs";
 import { ProfileHeader } from "@components/ProfileHeader/ProfileHeader";
+import { VacancyTab } from "@components/VacancyTab/VacancyTab";
+import { VacancyItem } from "@components/VacancyItem/VacancyItem";

 import "./OpenRequest.scss";

 export const OpenRequest = () => {
+  const vacancy = [
+    {
+      name: 'Frontend',
+      count: 15,
+      items: [
+        {
+          name: 'Laravel Middle+/Senior 1',
+          description: 'Проект представляет из себя монолит с большим техдолгом, нужен php разработчик с опытом распила монолита на модули/микросервисы',
+          level: 'Middle+/Senior',
+          location: 'РФ, РБ',
+          price: '1500 руб. час',
+          count: '1 сотрудник'
+        },
+        {
+          name: 'Laravel Middle+/Senior 2',
+          description: 'Проект представляет из себя монолит с большим техдолгом, нужен php разработчик с опытом распила монолита на модули/микросервисы',
+          level: 'Middle+/Senior',
+          location: 'РФ, РБ',
+          price: '1500 руб. час',
+          count: '1 сотрудник'
+        },
+        {
+          name: 'Laravel Middle+/Senior 3',
+          description: 'Проект представляет из себя монолит с большим техдолгом, нужен php разработчик с опытом распила монолита на модули/микросервисы',
+          level: 'Middle+/Senior',
+          location: 'РФ, РБ',
+          price: '1500 руб. час',
+          count: '1 сотрудник'
+        },
+        {
+          name: 'Laravel Middle+/Senior 4',
+          description: 'Проект представляет из себя монолит с большим техдолгом, нужен php разработчик с опытом распила монолита на модули/микросервисы',
+          level: 'Middle+/Senior',
+          location: 'РФ, РБ',
+          price: '1500 руб. час',
+          count: '1 сотрудник'
+        },
+        {
+          name: 'Laravel Middle+/Senior 5',
+          description: 'Проект представляет из себя монолит с большим техдолгом, нужен php разработчик с опытом распила монолита на модули/микросервисы',
+          level: 'Middle+/Senior',
+          location: 'РФ, РБ',
+          price: '1500 руб. час',
+          count: '1 сотрудник'
+        },
+        {
+          name: 'Laravel Middle+/Senior 6',
+          description: 'Проект представляет из себя монолит с большим техдолгом, нужен php разработчик с опытом распила монолита на модули/микросервисы',
+          level: 'Middle+/Senior',
+          location: 'РФ, РБ',
+          price: '1500 руб. час',
+          count: '1 сотрудник'
+        }
+      ]
+    },
+    {
+      name: 'Backend',
+      count: 8,
+      items: [
+        {
+          name: 'Laravel Middle+/Senior 7',
+          description: 'Проект представляет из себя монолит с большим техдолгом, нужен php разработчик с опытом распила монолита на модули/микросервисы',
+          level: 'Middle+/Senior',
+          location: 'РФ, РБ',
+          price: '1500 руб. час',
+          count: '1 сотрудник'
+        },
+        {
+          name: 'Laravel Middle+/Senior 8',
+          description: 'Проект представляет из себя монолит с большим техдолгом, нужен php разработчик с опытом распила монолита на модули/микросервисы',
+          level: 'Middle+/Senior',
+          location: 'РФ, РБ',
+          price: '1500 руб. час',
+          count: '1 сотрудник'
+        },
+        {
+          name: 'Laravel Middle+/Senior',
+          description: 'Проект представляет из себя монолит с большим техдолгом, нужен php разработчик с опытом распила монолита на модули/микросервисы',
+          level: 'Middle+/Senior',
+          location: 'РФ, РБ',
+          price: '1500 руб. час',
+          count: '1 сотрудник'
+        },
+        {
+          name: 'Laravel Middle+/Senior',
+          description: 'Проект представляет из себя монолит с большим техдолгом, нужен php разработчик с опытом распила монолита на модули/микросервисы',
+          level: 'Middle+/Senior',
+          location: 'РФ, РБ',
+          price: '1500 руб. час',
+          count: '1 сотрудник'
+        },
+        {
+          name: 'Laravel Middle+/Senior',
+          description: 'Проект представляет из себя монолит с большим техдолгом, нужен php разработчик с опытом распила монолита на модули/микросервисы',
+          level: 'Middle+/Senior',
+          location: 'РФ, РБ',
+          price: '1500 руб. час',
+          count: '1 сотрудник'
+        },
+        {
+          name: 'Laravel Middle+/Senior',
+          description: 'Проект представляет из себя монолит с большим техдолгом, нужен php разработчик с опытом распила монолита на модули/микросервисы',
+          level: 'Middle+/Senior',
+          location: 'РФ, РБ',
+          price: '1500 руб. час',
+          count: '1 сотрудник'
+        }
+      ]
+    },
+    {
+      name: 'Дизайн',
+      count: 0,
+      items: [
+        {
+          name: 'Laravel Middle+/Senior 9',
+          description: 'Проект представляет из себя монолит с большим техдолгом, нужен php разработчик с опытом распила монолита на модули/микросервисы',
+          level: 'Middle+/Senior',
+          location: 'РФ, РБ',
+          price: '1500 руб. час',
+          count: '1 сотрудник'
+        },
+        {
+          name: 'Laravel Middle+/Senior 10',
+          description: 'Проект представляет из себя монолит с большим техдолгом, нужен php разработчик с опытом распила монолита на модули/микросервисы',
+          level: 'Middle+/Senior',
+          location: 'РФ, РБ',
+          price: '1500 руб. час',
+          count: '1 сотрудник'
+        },
+        {
+          name: 'Laravel Middle+/Senior',
+          description: 'Проект представляет из себя монолит с большим техдолгом, нужен php разработчик с опытом распила монолита на модули/микросервисы',
+          level: 'Middle+/Senior',
+          location: 'РФ, РБ',
+          price: '1500 руб. час',
+          count: '1 сотрудник'
+        },
+        {
+          name: 'Laravel Middle+/Senior',
+          description: 'Проект представляет из себя монолит с большим техдолгом, нужен php разработчик с опытом распила монолита на модули/микросервисы',
+          level: 'Middle+/Senior',
+          location: 'РФ, РБ',
+          price: '1500 руб. час',
+          count: '1 сотрудник'
+        },
+        {
+          name: 'Laravel Middle+/Senior',
+          description: 'Проект представляет из себя монолит с большим техдолгом, нужен php разработчик с опытом распила монолита на модули/микросервисы',
+          level: 'Middle+/Senior',
+          location: 'РФ, РБ',
+          price: '1500 руб. час',
+          count: '1 сотрудник'
+        },
+        {
+          name: 'Laravel Middle+/Senior',
+          description: 'Проект представляет из себя монолит с большим техдолгом, нужен php разработчик с опытом распила монолита на модули/микросервисы',
+          level: 'Middle+/Senior',
+          location: 'РФ, РБ',
+          price: '1500 руб. час',
+          count: '1 сотрудник'
+        }
+      ]
+    },
+    {
+      name: 'Аналитика',
+      count: 0,
+      items: [
+        {
+          name: 'Laravel Middle+/Senior 11',
+          description: 'Проект представляет из себя монолит с большим техдолгом, нужен php разработчик с опытом распила монолита на модули/микросервисы',
+          level: 'Middle+/Senior',
+          location: 'РФ, РБ',
+          price: '1500 руб. час',
+          count: '1 сотрудник'
+        },
+        {
+          name: 'Laravel Middle+/Senior 12',
+          description: 'Проект представляет из себя монолит с большим техдолгом, нужен php разработчик с опытом распила монолита на модули/микросервисы',
+          level: 'Middle+/Senior',
+          location: 'РФ, РБ',
+          price: '1500 руб. час',
+          count: '1 сотрудник'
+        },
+        {
+          name: 'Laravel Middle+/Senior 13',
+          description: 'Проект представляет из себя монолит с большим техдолгом, нужен php разработчик с опытом распила монолита на модули/микросервисы',
+          level: 'Middle+/Senior',
+          location: 'РФ, РБ',
+          price: '1500 руб. час',
+          count: '1 сотрудник'
+        },
+        {
+          name: 'Laravel Middle+/Senior',
+          description: 'Проект представляет из себя монолит с большим техдолгом, нужен php разработчик с опытом распила монолита на модули/микросервисы',
+          level: 'Middle+/Senior',
+          location: 'РФ, РБ',
+          price: '1500 руб. час',
+          count: '1 сотрудник'
+        },
+        {
+          name: 'Laravel Middle+/Senior',
+          description: 'Проект представляет из себя монолит с большим техдолгом, нужен php разработчик с опытом распила монолита на модули/микросервисы',
+          level: 'Middle+/Senior',
+          location: 'РФ, РБ',
+          price: '1500 руб. час',
+          count: '1 сотрудник'
+        },
+        {
+          name: 'Laravel Middle+/Senior',
+          description: 'Проект представляет из себя монолит с большим техдолгом, нужен php разработчик с опытом распила монолита на модули/микросервисы',
+          level: 'Middle+/Senior',
+          location: 'РФ, РБ',
+          price: '1500 руб. час',
+          count: '1 сотрудник'
+        }
+      ]
+    },
+    {
+      name: 'Тестирование',
+      count: 0,
+      items: [
+        {
+          name: 'Laravel Middle+/Senior 14',
+          description: 'Проект представляет из себя монолит с большим техдолгом, нужен php разработчик с опытом распила монолита на модули/микросервисы',
+          level: 'Middle+/Senior',
+          location: 'РФ, РБ',
+          price: '1500 руб. час',
+          count: '1 сотрудник'
+        },
+        {
+          name: 'Laravel Middle+/Senior 15',
+          description: 'Проект представляет из себя монолит с большим техдолгом, нужен php разработчик с опытом распила монолита на модули/микросервисы',
+          level: 'Middle+/Senior',
+          location: 'РФ, РБ',
+          price: '1500 руб. час',
+          count: '1 сотрудник'
+        },
+        {
+          name: 'Laravel Middle+/Senior 16',
+          description: 'Проект представляет из себя монолит с большим техдолгом, нужен php разработчик с опытом распила монолита на модули/микросервисы',
+          level: 'Middle+/Senior',
+          location: 'РФ, РБ',
+          price: '1500 руб. час',
+          count: '1 сотрудник'
+        },
+        {
+          name: 'Laravel Middle+/Senior',
+          description: 'Проект представляет из себя монолит с большим техдолгом, нужен php разработчик с опытом распила монолита на модули/микросервисы',
+          level: 'Middle+/Senior',
+          location: 'РФ, РБ',
+          price: '1500 руб. час',
+          count: '1 сотрудник'
+        },
+        {
+          name: 'Laravel Middle+/Senior',
+          description: 'Проект представляет из себя монолит с большим техдолгом, нужен php разработчик с опытом распила монолита на модули/микросервисы',
+          level: 'Middle+/Senior',
+          location: 'РФ, РБ',
+          price: '1500 руб. час',
+          count: '1 сотрудник'
+        },
+        {
+          name: 'Laravel Middle+/Senior',
+          description: 'Проект представляет из себя монолит с большим техдолгом, нужен php разработчик с опытом распила монолита на модули/микросервисы',
+          level: 'Middle+/Senior',
+          location: 'РФ, РБ',
+          price: '1500 руб. час',
+          count: '1 сотрудник'
+        }
+      ]
+    }
+  ]
+
+  const [activeTab, setActiveTab] = useState('Frontend')
  return (
    <div className="open-request">
      <ProfileHeader />
@ -19,11 +295,28 @@ export const OpenRequest = () => {
              { name: "Главная", link: "/profile" },
              {
                name: "Работа в IT открытые запросы",
-                link: "/profile/open-request"
+                link: "/profile/open-requests"
              }
            ]}
          />
          <h2 className="summary__title">Работа в IT открытые запросы</h2>
+          <div className="vacancy__tabs">
+            {vacancy.map((item, index) => {
+              return <VacancyTab title={item.name} count={item.count} active={activeTab}
+                                 setActive={() => setActiveTab(item.name)} key={index} />
+            })
+            }
+          </div>
+          <div className="vacancy__items">
+            {vacancy.map((item) => {
+              if (item.name === activeTab) {
+                return item.items.map((vacancy, index) => {
+                  return <VacancyItem key={index} vacancy={vacancy}/>
+                });
+              }
+              return null
+            })}
+          </div>
        </div>
      </div>
      <Footer />
--- a/src/pages/OpenRequests/OpenRequest.scss
+++ b/src/pages/OpenRequests/OpenRequest.scss
@ -0,0 +1,23 @@
+.open-request {
+  background: #F0F0F0;
+
+  &-content {
+    padding-top: 23px;
+  }
+}
+
+.vacancy {
+  &__tabs {
+    display: flex;
+    gap: 8px;
+    margin-top: 29px;
+  }
+
+  &__items {
+    display: flex;
+    flex-wrap: wrap;
+    row-gap: 24px;
+    column-gap: 22.5px;
+    margin-top: 30px;
+  }
+}