359 lines
22 KiB
JavaScript
359 lines
22 KiB
JavaScript
import React, {useState} from 'react';
|
||
|
||
import {ProfileHeader} from "../../components/ProfileHeader/ProfileHeader";
|
||
import {ProfileBreadcrumbs} from "../../components/ProfileBreadcrumbs/ProfileBreadcrumbs"
|
||
import {Footer} from "../../components/Footer/Footer";
|
||
|
||
import mainTabImg from "./Images/mainTreaties.png"
|
||
import actImg from "./Images/actTreaties.png"
|
||
import checkImg from "./Images/checkTreaties.png"
|
||
import arrowDown from "./Images/arrowDown.png"
|
||
import logoAstral from "./Images/logoAstral.png"
|
||
import arrowItem from "./Images/arrowCheck.png"
|
||
import lock from "./Images/lock.svg"
|
||
import lockDone from "./Images/lockDone.svg"
|
||
import avatarMok from "./Images/avatarMok.png"
|
||
|
||
import './partnerTreaties.scss'
|
||
import { Navigation } from '../../components/Navigation/Navigation';
|
||
|
||
export const PartnerTreaties = () => {
|
||
const [toggleTab, setToggleTab] = useState(1);
|
||
|
||
const toggleTabs = (index) => {
|
||
setToggleTab(index);
|
||
};
|
||
return(
|
||
<div className="treaties">
|
||
<ProfileHeader/>
|
||
<Navigation />
|
||
<div className="container">
|
||
<ProfileBreadcrumbs
|
||
links={[
|
||
{name: 'Главная', link: '/profile'},
|
||
{name: 'Договора и отчетность', link: '/profile/treaties'},
|
||
]}
|
||
/>
|
||
<h2 className="treaties__title">Договора и отчетность</h2>
|
||
<div className="treaties__tabs">
|
||
<div className="treaties__tabs__head">
|
||
<div
|
||
className={toggleTab === 1 ? "tab active-tab" : "tab"}
|
||
onClick={() => toggleTabs(1)}
|
||
>
|
||
<img src={mainTabImg} alt="img" />
|
||
<p>Основные </p>
|
||
</div>
|
||
<div
|
||
className={toggleTab === 2 ? "tab active-tab" : "tab"}
|
||
onClick={() => toggleTabs(2)}
|
||
>
|
||
<img src={actImg} alt="img" />
|
||
<p>Акты</p>
|
||
</div>
|
||
<div
|
||
className={toggleTab === 3 ? "tab active-tab" : "tab"}
|
||
onClick={() => toggleTabs(3)}
|
||
>
|
||
<img src={checkImg} alt="img" />
|
||
<p>Счета</p>
|
||
</div>
|
||
</div>
|
||
<div className="treaties__tabs__content">
|
||
<div className={toggleTab === 1
|
||
? "treaties__tabs__content__main active__content"
|
||
: "treaties__tabs__content__main"}>
|
||
<div className="main__head">
|
||
<p>Реквизиты компании</p>
|
||
<div className="img">
|
||
<img src={arrowDown} alt="arrow" />
|
||
</div>
|
||
</div>
|
||
<div className="treaties__tabs__content__main__item item notPaid">
|
||
<div className="item__info">
|
||
<p className="number">Договор № К-1-2022<br/>от 01.11.22</p>
|
||
<div className="astral">
|
||
<p>Провайдер документооборота: Астрал</p>
|
||
<div className="img">
|
||
<img src={arrowDown} alt="arrow" />
|
||
</div>
|
||
</div>
|
||
<img className="logo" src={logoAstral} alt="logo" />
|
||
</div>
|
||
<div className="item__more">
|
||
<div className="item__more__names">
|
||
<p>Бойко Кирилл Сергеевич, подписал и отправил документ</p>
|
||
<p>ООО "Зоря", документ получен</p>
|
||
</div>
|
||
<div className="item__more__date">
|
||
<div className="item__more__date__from">
|
||
<img src={lock} alt="lock" />
|
||
<p>01/01/2021</p>
|
||
</div>
|
||
<img src={arrowItem} alt="to" />
|
||
<div className="item__more__date__to">
|
||
<img src={lockDone} alt="lockDone" />
|
||
<p>01/02/2021</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div className="treaties__tabs__content__main__item item persons">
|
||
<div className="item__info">
|
||
<p className="number">Доп. соглашение<br/> №12 от 10.05.22</p>
|
||
<div className="item__person">
|
||
<div className="item__person__date">
|
||
<img className="arrow" src={arrowItem} alt="arrow" />
|
||
<p>На выполнение работ данного сотрудника</p>
|
||
</div>
|
||
<div className="item__person__info">
|
||
<img src={avatarMok} alt="avatar" />
|
||
<div className="item__person__info__name">
|
||
<p>Макаренко Дмитрий</p>
|
||
<span>Дизайнер</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div className="item__info">
|
||
<p className="number">Доп. соглашение<br/> №12 от 10.05.22</p>
|
||
<div className="item__person">
|
||
<div className="item__person__date">
|
||
<img className="arrow" src={arrowItem} alt="arrow" />
|
||
<p>На выполнение работ данного сотрудника</p>
|
||
</div>
|
||
<div className="item__person__info">
|
||
<img src={avatarMok} alt="avatar" />
|
||
<div className="item__person__info__name">
|
||
<p>Макаренко Дмитрий</p>
|
||
<span>Дизайнер</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div className={toggleTab === 2
|
||
? "treaties__tabs__content__main second active__content"
|
||
: "treaties__tabs__content__main"}>
|
||
<div className="main__head acts">
|
||
<div className="provider">
|
||
<p>Провайдер документооборота: Астрал</p>
|
||
<img src={logoAstral} alt="astral" />
|
||
</div>
|
||
<div className="info">
|
||
<p>Реквизиты компании</p>
|
||
<div className="img">
|
||
<img src={arrowDown} alt="arrow" />
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div className="treaties__tabs__content__main__item item notPaid">
|
||
<div className="item__info">
|
||
<p className="number">Акт №4 от 10.03.23</p>
|
||
<div className="item__person__act">
|
||
<div className="item__person__act__info">
|
||
<div className="item__person__act__avatar">
|
||
<img src={avatarMok} alt="avatar" />
|
||
<div className="item__person__act__name">
|
||
<p>
|
||
Макаренко Дмитрий
|
||
</p>
|
||
<span>
|
||
Дизайнер
|
||
</span>
|
||
</div>
|
||
</div>
|
||
<img className="personArrow" src={arrowItem} alt="arrow" />
|
||
<p className="moreInfo">к Доп. соглашению № 1</p>
|
||
</div>
|
||
<div className="arrow">
|
||
<img src={arrowDown} alt="arrow" />
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div className="item__more price">
|
||
<div className="item__more__price">
|
||
<p className="total">214 500,00 руб</p>
|
||
<p>147 раб.часов ( 1200руб / час ) </p>
|
||
</div>
|
||
<div className="item__more__names">
|
||
<p>Бойко Кирилл Сергеевич, подписал и отправил документ</p>
|
||
<p>ООО "Зоря", документ получен</p>
|
||
</div>
|
||
<div className="item__more__date">
|
||
<div className="item__more__date__from">
|
||
<img src={lock} alt="lock" />
|
||
<p>01/01/2021</p>
|
||
</div>
|
||
<img src={arrowItem} alt="to" />
|
||
<div className="item__more__date__to">
|
||
<img src={lockDone} alt="lockDone" />
|
||
<p>01/02/2021</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div className="treaties__tabs__content__main__item item">
|
||
<div className="item__info">
|
||
<p className="number">Акт №4 от 10.03.23</p>
|
||
<div className="item__person__act">
|
||
<div className="item__person__act__info">
|
||
<div className="item__person__act__avatar">
|
||
<img src={avatarMok} alt="avatar" />
|
||
<div className="item__person__act__name">
|
||
<p>
|
||
Макаренко Дмитрий
|
||
</p>
|
||
<span>
|
||
Дизайнер
|
||
</span>
|
||
</div>
|
||
</div>
|
||
<img className="personArrow" src={arrowItem} alt="arrow" />
|
||
<p className="moreInfo">к Доп. соглашению № 1</p>
|
||
</div>
|
||
<div className="arrow">
|
||
<img src={arrowDown} alt="arrow" />
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div className="item__more price">
|
||
<div className="item__more__price">
|
||
<p className="total">214 500,00 руб</p>
|
||
<p>147 раб.часов ( 1200руб / час ) </p>
|
||
</div>
|
||
<div className="item__more__names">
|
||
<p>Бойко Кирилл Сергеевич, подписал и отправил документ</p>
|
||
<p>ООО "Зоря", документ получен</p>
|
||
</div>
|
||
<div className="item__more__date">
|
||
<div className="item__more__date__from">
|
||
<img src={lock} alt="lock" />
|
||
<p>01/01/2021</p>
|
||
</div>
|
||
<img src={arrowItem} alt="to" />
|
||
<div className="item__more__date__to">
|
||
<img src={lockDone} alt="lockDone" />
|
||
<p>01/02/2021</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div className={toggleTab === 3
|
||
? "treaties__tabs__content__main second active__content"
|
||
: "treaties__tabs__content__main"}>
|
||
<div className="main__head acts">
|
||
<div className="provider">
|
||
<p>Провайдер документооборота: Астрал</p>
|
||
<img src={logoAstral} alt="astral" />
|
||
</div>
|
||
<div className="info">
|
||
<p>Реквизиты компании</p>
|
||
<div className="img">
|
||
<img src={arrowDown} alt="arrow" />
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div className="treaties__tabs__content__main__item item notPaid">
|
||
<div className="item__info">
|
||
<p className="number">Акт №4 от 10.03.23</p>
|
||
<div className="item__person__act">
|
||
<div className="item__person__act__info">
|
||
<div className="item__person__act__avatar">
|
||
<img src={avatarMok} alt="avatar" />
|
||
<div className="item__person__act__name">
|
||
<p>
|
||
Макаренко Дмитрий
|
||
</p>
|
||
<span>
|
||
Дизайнер
|
||
</span>
|
||
</div>
|
||
</div>
|
||
<img className="personArrow" src={arrowItem} alt="arrow" />
|
||
<p className="moreInfo">к Доп. соглашению № 1</p>
|
||
</div>
|
||
<div className="arrow">
|
||
<img src={arrowDown} alt="arrow" />
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div className="item__more price">
|
||
<div className="item__more__price">
|
||
<p className="total">214 500,00 руб</p>
|
||
<p>147 раб.часов ( 1200руб / час ) </p>
|
||
</div>
|
||
<div className="item__more__names">
|
||
<p>Бойко Кирилл Сергеевич, подписал и отправил документ</p>
|
||
<p>ООО "Зоря", документ получен</p>
|
||
</div>
|
||
<div className="item__more__date">
|
||
<div className="item__more__date__from">
|
||
<img src={lock} alt="lock" />
|
||
<p>01/01/2021</p>
|
||
</div>
|
||
<img src={arrowItem} alt="to" />
|
||
<div className="item__more__date__to">
|
||
<img src={lockDone} alt="lockDone" />
|
||
<p>01/02/2021</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div className="treaties__tabs__content__main__item item">
|
||
<div className="item__info">
|
||
<p className="number">Акт №4 от 10.03.23</p>
|
||
<div className="item__person__act">
|
||
<div className="item__person__act__info">
|
||
<div className="item__person__act__avatar">
|
||
<img src={avatarMok} alt="avatar" />
|
||
<div className="item__person__act__name">
|
||
<p>
|
||
Макаренко Дмитрий
|
||
</p>
|
||
<span>
|
||
Дизайнер
|
||
</span>
|
||
</div>
|
||
</div>
|
||
<img className="personArrow" src={arrowItem} alt="arrow" />
|
||
<p className="moreInfo">к Доп. соглашению № 1</p>
|
||
</div>
|
||
<div className="arrow">
|
||
<img src={arrowDown} alt="arrow" />
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div className="item__more price">
|
||
<div className="item__more__price">
|
||
<p className="total">214 500,00 руб</p>
|
||
<p>147 раб.часов ( 1200руб / час ) </p>
|
||
</div>
|
||
<div className="item__more__names">
|
||
<p>Бойко Кирилл Сергеевич, подписал и отправил документ</p>
|
||
<p>ООО "Зоря", документ получен</p>
|
||
</div>
|
||
<div className="item__more__date">
|
||
<div className="item__more__date__from">
|
||
<img src={lock} alt="lock" />
|
||
<p>01/01/2021</p>
|
||
</div>
|
||
<img src={arrowItem} alt="to" />
|
||
<div className="item__more__date__to">
|
||
<img src={lockDone} alt="lockDone" />
|
||
<p>01/02/2021</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<Footer/>
|
||
</div>
|
||
)
|
||
}
|