trackerTask #18
@ -9,14 +9,14 @@ const AllTaskTableItem = ({ task, projects }) => {
|
||||
e.target?.classList.toggle("open-desc-item");
|
||||
e.target
|
||||
.closest("td")
|
||||
?.querySelector(".taskList__table__name-project")
|
||||
?.querySelector(".task-list__table__name-project")
|
||||
.classList.toggle("hide-desc");
|
||||
}
|
||||
|
||||
return (
|
||||
<tr key={task.id}>
|
||||
<td>
|
||||
<div className="taskList__table__title-task">
|
||||
<div className="task-list__table__title-task">
|
||||
<p>{task.title}</p>
|
||||
|
||||
<img
|
||||
@ -27,7 +27,7 @@ const AllTaskTableItem = ({ task, projects }) => {
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div className="taskList__table__name-project hide-desc">
|
||||
<div className="task-list__table__name-project hide-desc">
|
||||
<h4>Проект:</h4>
|
||||
<p>
|
||||
{projects?.map((project) => {
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
transform: rotate(45deg) !important;
|
||||
}
|
||||
|
||||
.taskList {
|
||||
.task-list {
|
||||
&__table {
|
||||
margin-top: 20px;
|
||||
font-size: 14px;
|
||||
|
||||
@ -34,7 +34,7 @@ const AllTaskTableTracker = ({ filteredAllTasks, projects, loader }) => {
|
||||
|
||||
return (
|
||||
<>
|
||||
<table className="taskList__table">
|
||||
<table className="task-list__table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Задача</th>
|
||||
|
||||
@ -26,7 +26,7 @@ const ArchiveTableTracker = ({ filterCompleteTasks, loader }) => {
|
||||
) : (
|
||||
<tr>
|
||||
<td>
|
||||
<div className="archive__noItem">
|
||||
<div className="archive__no-item">
|
||||
<p>В данном месяце у вас не было задач</p>
|
||||
</div>
|
||||
</td>
|
||||
|
||||
@ -7,8 +7,8 @@ import "./archiveTasksItem.scss";
|
||||
const ArchiveTasksItem = ({ task, index }) => {
|
||||
return (
|
||||
<tr key={index}>
|
||||
<td className="archive__completeTask__description">
|
||||
<p className="completeTask__title">{task.title}</p>
|
||||
<td className="archive__complete-task__description">
|
||||
<p className="complete-task__title">{task.title}</p>
|
||||
{/*<p*/}
|
||||
{/* className="date"*/}
|
||||
{/* dangerouslySetInnerHTML={{*/}
|
||||
@ -16,7 +16,7 @@ const ArchiveTasksItem = ({ task, index }) => {
|
||||
{/* }}*/}
|
||||
{/*/>*/}
|
||||
</td>
|
||||
<td className="archive__completeTask__time">
|
||||
<td className="archive__complete-task__time">
|
||||
<p>
|
||||
{new Date(
|
||||
task.timers.reduce((acc, cur) => acc + cur.deltaSeconds, 0) * 1000
|
||||
@ -25,7 +25,7 @@ const ArchiveTasksItem = ({ task, index }) => {
|
||||
.slice(11, 19)}
|
||||
</p>
|
||||
</td>
|
||||
<td className="archive__completeTask__info">
|
||||
<td className="archive__complete-task__info">
|
||||
<div>
|
||||
<p>{getCorrectDate(task.updated_at)}</p>
|
||||
</div>
|
||||
|
||||
@ -1,10 +1,10 @@
|
||||
.completeTask__title {
|
||||
.complete-task__title {
|
||||
white-space: nowrap;
|
||||
max-width: 250px;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.archive__completeTask__time {
|
||||
.archive__complete-task__time {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@ -90,7 +90,7 @@ export const AuthBox = ({ title }) => {
|
||||
<input id="loginEmail" type="text" name="email" placeholder="E-mail" />
|
||||
|
||||
<label htmlFor="password">Ваш пароль</label>
|
||||
<div className="inputWrapper">
|
||||
<div className="input-wrapper">
|
||||
<input
|
||||
id="loginPassword"
|
||||
type={showPassword ? "text" : "password"}
|
||||
|
||||
@ -93,7 +93,7 @@
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.inputWrapper {
|
||||
.input-wrapper {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
|
||||
|
||||
@ -226,7 +226,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.selectDays {
|
||||
.select-days {
|
||||
border-style: dashed !important;
|
||||
|
||||
&:hover {
|
||||
@ -234,7 +234,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.selectedDay {
|
||||
.selected-day {
|
||||
background-color: #edf1ff !important;
|
||||
|
||||
&:hover {
|
||||
@ -267,7 +267,7 @@
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.selectDateRange {
|
||||
.select-date-range {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
column-gap: 16px;
|
||||
@ -293,7 +293,7 @@
|
||||
}
|
||||
|
||||
@media (max-width: 575.98px) {
|
||||
.selectDateRange {
|
||||
.select-date-range {
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
column-gap: 8px;
|
||||
|
||||
@ -9,7 +9,7 @@
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.profileBreadcrumbs {
|
||||
.profile-breadcrumbs {
|
||||
position: relative;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
@ -14,7 +14,7 @@ export const CardControl = ({ title, path, description, img }) => {
|
||||
</div>
|
||||
<div className="control-card__info">
|
||||
<p dangerouslySetInnerHTML={{ __html: description }}></p>
|
||||
<div className="control-card__infoLink">
|
||||
<div className="control-card__info-link">
|
||||
<img src={rightArrow} alt="arrow" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -60,7 +60,7 @@
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
&Link {
|
||||
&-link {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
background: #ddeec6;
|
||||
|
||||
@ -12,30 +12,30 @@ export const CatalogPersonCard = ({
|
||||
description
|
||||
}) => {
|
||||
return (
|
||||
<div className="catalogPersonCard">
|
||||
<div className="catalogPersonCard__head">
|
||||
<div className="catalogPersonCard__avatar">
|
||||
<div className="catalog-person-card">
|
||||
<div className="catalog-person-card__head">
|
||||
<div className="catalog-person-card__avatar">
|
||||
<img src={img} alt="avatar" />
|
||||
<span className="catalogPersonCard__skill">{level}</span>
|
||||
<span className="catalog-person-card__skill">{level}</span>
|
||||
</div>
|
||||
<div className="catalogPersonCard__info">
|
||||
<span className="catalogPersonCard__name">{name}</span>
|
||||
<span className="catalogPersonCard__salary">{salary} / час</span>
|
||||
<p className="catalogPersonCard__category">
|
||||
<div className="catalog-person-card__info">
|
||||
<span className="catalog-person-card__name">{name}</span>
|
||||
<span className="catalog-person-card__salary">{salary} / час</span>
|
||||
<p className="catalog-person-card__category">
|
||||
<span>Разработка:</span> {category}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="catalogPersonCard__items">
|
||||
<div className="catalog-person-card__items">
|
||||
{skills.map((item, index) => {
|
||||
return (
|
||||
<div className="catalogPersonCard__skillItem" key={index}>
|
||||
<div className="catalog-person-card__skill-item" key={index}>
|
||||
{item}
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
<p className="catalogPersonCard__description">{description}</p>
|
||||
<p className="catalog-person-card__description">{description}</p>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
.catalogPersonCard {
|
||||
background: #FFFFFF;
|
||||
.catalog-person-card {
|
||||
background: #ffffff;
|
||||
padding: 29px 32px;
|
||||
border-radius: 8px;
|
||||
display: flex;
|
||||
@ -25,7 +25,7 @@
|
||||
bottom: -10px;
|
||||
padding: 3.5px 19px;
|
||||
border-radius: 44px;
|
||||
background: #1458DD;
|
||||
background: #1458dd;
|
||||
color: white;
|
||||
font-size: 14px;
|
||||
}
|
||||
@ -45,7 +45,7 @@
|
||||
}
|
||||
|
||||
&__salary {
|
||||
color: #1458DD;
|
||||
color: #1458dd;
|
||||
font-weight: 700;
|
||||
font-size: 18px;
|
||||
line-height: 22px;
|
||||
@ -53,7 +53,7 @@
|
||||
|
||||
&__category {
|
||||
span {
|
||||
color: #6F6F6F;
|
||||
color: #6f6f6f;
|
||||
font-size: 12px;
|
||||
line-height: 18px;
|
||||
font-weight: 400;
|
||||
@ -72,25 +72,25 @@
|
||||
row-gap: 16px;
|
||||
margin-top: 22px;
|
||||
padding-bottom: 17px;
|
||||
border-bottom: 0.5px solid #B3DF93;
|
||||
border-bottom: 0.5px solid #b3df93;
|
||||
}
|
||||
|
||||
&__skillItem {
|
||||
&__skill-item {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 12px;
|
||||
color: #6F6F6F;
|
||||
color: #6f6f6f;
|
||||
width: 62px;
|
||||
height: 26px;
|
||||
border: 0.5px solid #8DC63F;
|
||||
border: 0.5px solid #8dc63f;
|
||||
border-radius: 44px;
|
||||
}
|
||||
|
||||
&__description {
|
||||
margin-top: 17px;
|
||||
max-width: 245px;
|
||||
color: #6F6F6F;
|
||||
color: #6f6f6f;
|
||||
font-size: 12px;
|
||||
line-height: 18px;
|
||||
}
|
||||
|
||||
@ -10,14 +10,16 @@ export const CategoriesItem = ({ img, title, skills, available, link }) => {
|
||||
<Link
|
||||
to={link}
|
||||
className={
|
||||
available ? "categoriesItem" : "categoriesItem categoriesItem__disable"
|
||||
available
|
||||
? "categories-item"
|
||||
: "categories-item categories-item__disable"
|
||||
}
|
||||
>
|
||||
<div className="categoriesItem__title">
|
||||
<div className="categories-item__title">
|
||||
<img src={img} alt="img" />
|
||||
<h5>{title}</h5>
|
||||
</div>
|
||||
<div className="categoriesItem__description">
|
||||
<div className="categories-item__description">
|
||||
<p>{skills}</p>
|
||||
<div className="more">
|
||||
<img src={rightArrow} alt="arrow" />
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
.categoriesItem {
|
||||
.categories-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 33px 32px 25px 28px;
|
||||
|
||||
@ -29,7 +29,7 @@
|
||||
&__info {
|
||||
font-size: 15px;
|
||||
font-weight: 300;
|
||||
margin: 12px 0 20px;
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
@media (max-width: 805px) {
|
||||
@ -52,13 +52,14 @@
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
row-gap: 5px;
|
||||
}
|
||||
|
||||
.invite-person-block {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
row-gap: 10px;
|
||||
row-gap: 5px;
|
||||
&__input {
|
||||
margin: 0;
|
||||
min-width: 240px;
|
||||
@ -86,11 +87,10 @@
|
||||
|
||||
span {
|
||||
text-align: center;
|
||||
margin: 5px 0;
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.invite-person-block {
|
||||
row-gap: 5px;
|
||||
&__btn {
|
||||
margin: 5px auto;
|
||||
}
|
||||
|
||||
@ -24,14 +24,14 @@ const FileTracker = ({ file, setDeletedTask, taskId }) => {
|
||||
|
||||
return (
|
||||
<div
|
||||
className={openImg ? "taskFile ImgOpened" : "taskFile"}
|
||||
className={openImg ? "task-file img-opened" : "task-file"}
|
||||
key={file.id}
|
||||
onClick={() => {
|
||||
if (openImg) setOpenImg(!openImg);
|
||||
}}
|
||||
>
|
||||
<img
|
||||
className="imgFile"
|
||||
className="img-file"
|
||||
src={backendImg(file.file?.url)}
|
||||
alt="img"
|
||||
onClick={() => {
|
||||
@ -39,7 +39,7 @@ const FileTracker = ({ file, setDeletedTask, taskId }) => {
|
||||
}}
|
||||
/>
|
||||
{!openImg && (
|
||||
<div className="deleteFile" onClick={() => deleteFile(file)}>
|
||||
<div className="delete-file" onClick={() => deleteFile(file)}>
|
||||
<img src={close} alt="delete" />
|
||||
</div>
|
||||
)}
|
||||
|
||||
@ -6,10 +6,10 @@ import "./acceptModal.scss";
|
||||
|
||||
export const AcceptModal = ({ title, closeModal, agreeHandler }) => {
|
||||
return (
|
||||
<div className="backDrop">
|
||||
<div className="acceptModal">
|
||||
<h3 className="acceptModal__title">{title}</h3>
|
||||
<div className="acceptModal__buttons">
|
||||
<div className="back-drop">
|
||||
<div className="accept-modal">
|
||||
<h3 className="accept-modal__title">{title}</h3>
|
||||
<div className="accept-modal__buttons">
|
||||
<button
|
||||
className="agree"
|
||||
onClick={() => {
|
||||
@ -24,7 +24,7 @@ export const AcceptModal = ({ title, closeModal, agreeHandler }) => {
|
||||
</button>
|
||||
</div>
|
||||
<img
|
||||
className="acceptModal__close"
|
||||
className="accept-modal__close"
|
||||
src={close}
|
||||
alt="close"
|
||||
onClick={closeModal}
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
.backDrop {
|
||||
.back-drop {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
background-color: rgba(0, 0, 0, 0.8);
|
||||
@ -10,7 +10,7 @@
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
.acceptModal {
|
||||
.accept-modal {
|
||||
border-radius: 20px;
|
||||
background: linear-gradient(180deg, #fff 0%, #ebebeb 100%);
|
||||
padding: 50px 34px 25px;
|
||||
|
||||
@ -73,7 +73,7 @@ export const ModalRegistration = ({ active, setActive }) => {
|
||||
|
||||
<div className="input-body">
|
||||
<div className="input-body__box">
|
||||
<div className="inputContainer">
|
||||
<div className="input-container">
|
||||
<h5>Ваше имя</h5>
|
||||
<input
|
||||
className={validationErrors.username ? "error" : ""}
|
||||
@ -84,7 +84,7 @@ export const ModalRegistration = ({ active, setActive }) => {
|
||||
/>
|
||||
<span>{validationErrors.username}</span>
|
||||
</div>
|
||||
<div className="inputContainer">
|
||||
<div className="input-container">
|
||||
<h5>E-mail</h5>
|
||||
<input
|
||||
type="email"
|
||||
@ -99,7 +99,7 @@ export const ModalRegistration = ({ active, setActive }) => {
|
||||
</div>
|
||||
|
||||
<div className="input-body__box">
|
||||
<div className="inputContainer">
|
||||
<div className="input-container">
|
||||
<h5>Пароль</h5>
|
||||
<input
|
||||
className={validationErrors.password ? "error" : ""}
|
||||
@ -111,7 +111,7 @@ export const ModalRegistration = ({ active, setActive }) => {
|
||||
/>
|
||||
<span>{validationErrors.password}</span>
|
||||
</div>
|
||||
<div className="inputContainer">
|
||||
<div className="input-container">
|
||||
<h5>Повторите пароль</h5>
|
||||
<input
|
||||
className={validationErrors.secondPassword ? "error" : ""}
|
||||
|
||||
@ -112,7 +112,7 @@
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
.inputContainer {
|
||||
.input-container {
|
||||
margin: 0 0 20px 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@ -6,17 +6,17 @@ import "./modalReset.scss";
|
||||
|
||||
export const ModalReset = ({ setModalReset }) => {
|
||||
return (
|
||||
<div className="modalReset">
|
||||
<h3 className="modalReset__title">Восстановление доступа</h3>
|
||||
<div className="modalReset__input">
|
||||
<div className="modal-reset">
|
||||
<h3 className="modal-reset__title">Восстановление доступа</h3>
|
||||
<div className="modal-reset__input">
|
||||
<span>Укажите e-mail, для которого хотите восстановить пароль.</span>
|
||||
<input placeholder="e-mail" />
|
||||
</div>
|
||||
<button className="modalReset__submit">Восстановить</button>
|
||||
<button className="modal-reset__submit">Восстановить</button>
|
||||
<img
|
||||
onClick={() => setModalReset(false)}
|
||||
src={close}
|
||||
className="modalReset__close"
|
||||
className="modal-reset__close"
|
||||
alt="close"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
.modalReset {
|
||||
.modal-reset {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border-radius: 20px;
|
||||
background: linear-gradient(180deg, #FFF 0%, #EBEBEB 100%);
|
||||
background: linear-gradient(180deg, #fff 0%, #ebebeb 100%);
|
||||
padding: 23px 110px 8px 36px;
|
||||
row-gap: 29px;
|
||||
position: relative;
|
||||
@ -28,7 +28,7 @@
|
||||
padding: 8px 12px;
|
||||
font-size: 15px;
|
||||
border-radius: 8px;
|
||||
background-color: #EFF2F7;
|
||||
background-color: #eff2f7;
|
||||
outline: none;
|
||||
border: none;
|
||||
max-width: 300px;
|
||||
@ -37,9 +37,9 @@
|
||||
|
||||
&__submit {
|
||||
border-radius: 44px;
|
||||
background: #52B709;
|
||||
background: #52b709;
|
||||
padding: 9px 46px;
|
||||
color: #FFF;
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
line-height: 32px;
|
||||
|
||||
@ -117,16 +117,16 @@ export const ModalResetPassword = ({ active, setActive }) => {
|
||||
};
|
||||
return (
|
||||
<ModalLayout active={active} setActive={setActive}>
|
||||
<div className="resetPassword">
|
||||
<div className="reset-password">
|
||||
<img
|
||||
className="resetPassword__close"
|
||||
className="reset-password__close"
|
||||
src={close}
|
||||
alt="close"
|
||||
onClick={() => setActive(false)}
|
||||
/>
|
||||
<h3 className="resetPassword__title">Восстановление пароля</h3>
|
||||
<h3 className="reset-password__title">Восстановление пароля</h3>
|
||||
{!step ? (
|
||||
<div className="resetPassword__email">
|
||||
<div className="reset-password__email">
|
||||
<h5>Введите ваш e-mail:</h5>
|
||||
<input
|
||||
type="email"
|
||||
@ -149,7 +149,7 @@ export const ModalResetPassword = ({ active, setActive }) => {
|
||||
<Loader style={"green"} />
|
||||
) : (
|
||||
<button
|
||||
className="resetPassword__btn"
|
||||
className="reset-password__btn"
|
||||
onClick={(e) => {
|
||||
e.preventDefault();
|
||||
submitHandler();
|
||||
@ -160,11 +160,11 @@ export const ModalResetPassword = ({ active, setActive }) => {
|
||||
)}
|
||||
</div>
|
||||
) : (
|
||||
<div className="resetPassword__email">
|
||||
<div className="reset-password__email">
|
||||
<img
|
||||
src={arrow}
|
||||
onClick={() => setStep(false)}
|
||||
className="resetPassword__email__arrow"
|
||||
className="reset-password__email__arrow"
|
||||
/>
|
||||
<h5>Введите код подтверждения:</h5>
|
||||
<input
|
||||
@ -185,7 +185,7 @@ export const ModalResetPassword = ({ active, setActive }) => {
|
||||
placeholder="token"
|
||||
/>
|
||||
{inputsError.token && (
|
||||
<span className="warningText">Введите данные</span>
|
||||
<span className="warning-text">Введите данные</span>
|
||||
)}
|
||||
<h5>Введите новый пароль:</h5>
|
||||
<input
|
||||
@ -206,13 +206,13 @@ export const ModalResetPassword = ({ active, setActive }) => {
|
||||
className={inputsError.password ? "error" : ""}
|
||||
/>
|
||||
{inputsError.password && (
|
||||
<span className="warningText">Минимум 6 символов</span>
|
||||
<span className="warning-text">Минимум 6 символов</span>
|
||||
)}
|
||||
{loader ? (
|
||||
<Loader style={"green"} />
|
||||
) : (
|
||||
<button
|
||||
className="resetPassword__btn"
|
||||
className="reset-password__btn"
|
||||
onClick={(e) => {
|
||||
e.preventDefault();
|
||||
resetPassword();
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
.resetPassword {
|
||||
.reset-password {
|
||||
width: 280px;
|
||||
position: relative;
|
||||
|
||||
@ -62,7 +62,14 @@
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background-color: #ffffff;
|
||||
background-image: linear-gradient(to top, #6aaf5c 0%, #52b709 100%), linear-gradient(36deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.16) 47%, rgba(255, 255, 255, 0.17) 50%, rgba(255, 255, 255, 0) 100%);
|
||||
background-image: linear-gradient(to top, #6aaf5c 0%, #52b709 100%),
|
||||
linear-gradient(
|
||||
36deg,
|
||||
rgba(255, 255, 255, 0) 0%,
|
||||
rgba(255, 255, 255, 0.16) 47%,
|
||||
rgba(255, 255, 255, 0.17) 50%,
|
||||
rgba(255, 255, 255, 0) 100%
|
||||
);
|
||||
color: #ffffff;
|
||||
font-weight: 500;
|
||||
font-size: 15px;
|
||||
@ -75,7 +82,7 @@
|
||||
border: 1px solid red;
|
||||
}
|
||||
|
||||
.warningText {
|
||||
.warning-text {
|
||||
color: red;
|
||||
font-size: 12px;
|
||||
margin-bottom: 10px;
|
||||
|
||||
@ -7,11 +7,11 @@ import "./modalTrackerRegistration.scss";
|
||||
|
||||
export const ModalTrackerRegistration = ({ setModalReset, email }) => {
|
||||
return (
|
||||
<div className="modalConfirmTracker">
|
||||
<h3 className="modalConfirmTracker__title">
|
||||
<div className="modal-confirm-tracker">
|
||||
<h3 className="modal-confirm-tracker__title">
|
||||
Спасибо за регистрацию. Теперь можете войти в кабинет
|
||||
</h3>
|
||||
<p className="modalConfirmTracker__info">
|
||||
<p className="modal-confirm-tracker__info">
|
||||
Мы отправили ссылку
|
||||
<br />
|
||||
для активации вашего аккаунта на почту
|
||||
@ -20,14 +20,14 @@ export const ModalTrackerRegistration = ({ setModalReset, email }) => {
|
||||
<Link
|
||||
to={"/registration-setting"}
|
||||
onClick={() => setModalReset(false)}
|
||||
className="modalConfirmTracker__btn"
|
||||
className="modal-confirm-tracker__btn"
|
||||
>
|
||||
Понятно
|
||||
</Link>
|
||||
<img
|
||||
onClick={() => setModalReset(false)}
|
||||
src={close}
|
||||
className="modalReset__close"
|
||||
className="modal-reset__close"
|
||||
alt="close"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
.modalConfirmTracker {
|
||||
.modal-confirm-tracker {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
@ -27,13 +27,13 @@
|
||||
|
||||
&__btn {
|
||||
border-radius: 44px;
|
||||
background: #52B709;
|
||||
background: #52b709;
|
||||
outline: none;
|
||||
border: none;
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
line-height: 32px;
|
||||
color: #FFF;
|
||||
color: #fff;
|
||||
padding: 9px 37px;
|
||||
}
|
||||
}
|
||||
|
||||
@ -13,7 +13,7 @@
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.projectPersons {
|
||||
.project-persons {
|
||||
display: flex;
|
||||
position: relative;
|
||||
left: 5px;
|
||||
@ -37,7 +37,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.onePerson {
|
||||
.one-person {
|
||||
display: flex;
|
||||
position: relative;
|
||||
left: -15px;
|
||||
@ -63,7 +63,7 @@
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.countPersons {
|
||||
.count-persons {
|
||||
color: #252c32;
|
||||
border: 1px solid #dde2e4;
|
||||
background: white;
|
||||
@ -73,7 +73,7 @@
|
||||
.add-person {
|
||||
background: #00c5a8;
|
||||
color: white;
|
||||
font-size: 14px;
|
||||
font-size: 18px;
|
||||
transition: all 0.15s ease;
|
||||
left: -28px;
|
||||
z-index: 2;
|
||||
|
||||
@ -558,7 +558,7 @@ export const ModalTiсket = ({
|
||||
(div) =>
|
||||
div.classList &&
|
||||
(div.classList.contains("button-add-worker") ||
|
||||
div.classList.contains("dropdownList"))
|
||||
div.classList.contains("dropdown-list"))
|
||||
)
|
||||
) {
|
||||
setDropListOpen(false);
|
||||
@ -570,7 +570,7 @@ export const ModalTiсket = ({
|
||||
!path.find(
|
||||
(div) =>
|
||||
div.classList &&
|
||||
(div.classList.contains("deadLine") ||
|
||||
(div.classList.contains("dead-line") ||
|
||||
div.classList.contains("react-datepicker-popper"))
|
||||
)
|
||||
) {
|
||||
@ -622,7 +622,7 @@ export const ModalTiсket = ({
|
||||
}}
|
||||
/>
|
||||
) : (
|
||||
<h5 className="taskName">{inputsValue.title}</h5>
|
||||
<h5 className="task-name">{inputsValue.title}</h5>
|
||||
)}
|
||||
<div className="content__description">
|
||||
{editOpen ? (
|
||||
@ -674,13 +674,13 @@ export const ModalTiсket = ({
|
||||
</div>
|
||||
)}
|
||||
{/*{uploadedFile && (*/}
|
||||
{/* <div className="fileLoaded">*/}
|
||||
{/* <div className="file-loaded">*/}
|
||||
{/* {uploadedFile.map((file) => {*/}
|
||||
{/* return (*/}
|
||||
{/* <div className="loadedFile" key={file.id}>*/}
|
||||
{/* <div className="loaded-file" key={file.id}>*/}
|
||||
{/* <img src={backendImg(file.url)} alt="img" key={file.id} />*/}
|
||||
{/* <div*/}
|
||||
{/* className="deleteFile"*/}
|
||||
{/* className="delete-file"*/}
|
||||
{/* onClick={() => deleteLoadedFile(file)}*/}
|
||||
{/* >*/}
|
||||
{/* <img src={close} alt="delete" />*/}
|
||||
@ -758,7 +758,8 @@ export const ModalTiсket = ({
|
||||
<div className="workers">
|
||||
<div className="workers_box task__info">
|
||||
<span className="exit" onClick={() => setActive(false)}></span>
|
||||
Создатель: <p className="workers__creator">{task.user?.fio}</p>
|
||||
<h5>Создатель: </h5>
|
||||
<p className="workers__creator">{task.user?.fio}</p>
|
||||
{executor ? (
|
||||
<>
|
||||
<h5>Исполнитель: </h5>
|
||||
@ -780,7 +781,7 @@ export const ModalTiсket = ({
|
||||
</div>
|
||||
</>
|
||||
) : (
|
||||
<div className="add-worker moreItems ">
|
||||
<div className="add-worker more-items">
|
||||
<button
|
||||
className="button-add-worker"
|
||||
onClick={() => setDropListOpen(true)}
|
||||
@ -789,16 +790,16 @@ export const ModalTiсket = ({
|
||||
</button>
|
||||
<span>Добавить исполнителя</span>
|
||||
{dropListOpen && (
|
||||
<div className="dropdownList">
|
||||
<div className="dropdown-list">
|
||||
<img
|
||||
src={close}
|
||||
className="dropdownList__close"
|
||||
className="dropdown-list__close"
|
||||
onClick={() => setDropListOpen(false)}
|
||||
/>
|
||||
{correctProjectUsers.map((person) => {
|
||||
return (
|
||||
<div
|
||||
className="dropdownList__person"
|
||||
className="dropdown-list__person"
|
||||
key={person.user_id}
|
||||
onClick={() => taskExecutor(person)}
|
||||
>
|
||||
@ -845,7 +846,7 @@ export const ModalTiсket = ({
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
<div className="add-worker moreItems">
|
||||
<div className="add-worker more-items">
|
||||
<button
|
||||
className="button-add-worker"
|
||||
onClick={() => setDropListMembersOpen(true)}
|
||||
@ -854,17 +855,17 @@ export const ModalTiсket = ({
|
||||
</button>
|
||||
<span>Добавить участника</span>
|
||||
{dropListMembersOpen && (
|
||||
<div className="dropdownList">
|
||||
<div className="dropdown-list">
|
||||
<img
|
||||
src={close}
|
||||
className="dropdownList__close"
|
||||
className="dropdown-list__close"
|
||||
onClick={() => setDropListMembersOpen(false)}
|
||||
/>
|
||||
{users.length ? (
|
||||
users.map((person) => {
|
||||
return (
|
||||
<div
|
||||
className="dropdownList__person"
|
||||
className="dropdown-list__person"
|
||||
key={person.user_id}
|
||||
onClick={() => addMember(person)}
|
||||
>
|
||||
@ -881,7 +882,7 @@ export const ModalTiсket = ({
|
||||
);
|
||||
})
|
||||
) : (
|
||||
<p className="noUsers">Нет пользователей</p>
|
||||
<p className="no-users">Нет пользователей</p>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
@ -889,14 +890,14 @@ export const ModalTiсket = ({
|
||||
</div>
|
||||
|
||||
<div className="workers_box-middle">
|
||||
<div className="deadLine">
|
||||
<div className="dead-line">
|
||||
<div
|
||||
className="deadLine__container"
|
||||
className="dead-line__container"
|
||||
onClick={() => setDatePickerOpen(!datePickerOpen)}
|
||||
>
|
||||
<img src={calendarIcon} alt="calendar" />
|
||||
<span>
|
||||
{deadLine ? getCorrectDate(deadLine) : "Срок исполнения:"}
|
||||
{deadLine ? getCorrectDate(deadLine) : "Срок исполнения"}
|
||||
</span>
|
||||
</div>
|
||||
<DatePicker
|
||||
@ -913,7 +914,7 @@ export const ModalTiсket = ({
|
||||
/>
|
||||
</div>
|
||||
<div className="time">
|
||||
<img src={watch}></img>
|
||||
<p>⏱</p>
|
||||
<p>
|
||||
{correctTimerTime(currentTimerCount.hours)}:
|
||||
{correctTimerTime(currentTimerCount.minute)}:
|
||||
@ -990,7 +991,7 @@ export const ModalTiсket = ({
|
||||
{correctProjectTags.map((tag) => {
|
||||
return (
|
||||
<div
|
||||
className="tagItem"
|
||||
className="tag-item"
|
||||
key={tag.id}
|
||||
onClick={() => addTagToTask(tag.id)}
|
||||
>
|
||||
@ -1000,7 +1001,7 @@ export const ModalTiсket = ({
|
||||
);
|
||||
})}
|
||||
{!Boolean(correctProjectTags.length) && (
|
||||
<p className="tags__dropDown__noItem">Нет тегов</p>
|
||||
<p className="tags__dropDown__no-item">Нет тегов</p>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
|
||||
@ -66,6 +66,7 @@
|
||||
margin-left: 15px;
|
||||
|
||||
&__category {
|
||||
height: 22px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
@ -144,17 +145,17 @@
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.taskName {
|
||||
.task-name {
|
||||
max-width: 550px;
|
||||
text-overflow: ellipsis;
|
||||
-webkit-line-clamp: 2;
|
||||
}
|
||||
|
||||
.fullName {
|
||||
.full-name {
|
||||
max-width: 800px;
|
||||
}
|
||||
|
||||
.fullDescription {
|
||||
.full-description {
|
||||
max-width: 800px;
|
||||
}
|
||||
|
||||
@ -193,7 +194,7 @@
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
&__subComment {
|
||||
&__sub-comment {
|
||||
&:before {
|
||||
content: "";
|
||||
background: #e4e4e6;
|
||||
@ -366,22 +367,22 @@
|
||||
margin-top: 33px;
|
||||
overflow-y: auto;
|
||||
|
||||
.taskFile {
|
||||
.task-file {
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
.imgFile {
|
||||
.img-file {
|
||||
max-width: 170px;
|
||||
max-height: 104px;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.deleteFile {
|
||||
.delete-file {
|
||||
background: rgb(226, 226, 226, 0.6);
|
||||
}
|
||||
}
|
||||
|
||||
.deleteFile {
|
||||
.delete-file {
|
||||
position: absolute;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
@ -402,7 +403,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.ImgOpened {
|
||||
.img-opened {
|
||||
position: fixed;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
@ -414,7 +415,7 @@
|
||||
z-index: 100;
|
||||
background-color: rgba(0, 0, 0, 0.2);
|
||||
|
||||
.imgFile {
|
||||
.img-file {
|
||||
width: 90vw;
|
||||
height: 90vh;
|
||||
max-width: none;
|
||||
@ -423,18 +424,18 @@
|
||||
}
|
||||
}
|
||||
|
||||
.fileLoaded {
|
||||
.file-loaded {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 10px 0 0;
|
||||
|
||||
.loadedFile {
|
||||
.loaded-file {
|
||||
position: relative;
|
||||
img {
|
||||
max-width: 100px;
|
||||
object-fit: contain;
|
||||
}
|
||||
.deleteFile {
|
||||
.delete-file {
|
||||
position: absolute;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
@ -454,7 +455,7 @@
|
||||
}
|
||||
}
|
||||
&:hover {
|
||||
.deleteFile {
|
||||
.delete-file {
|
||||
background: rgb(226, 226, 226, 0.6);
|
||||
}
|
||||
}
|
||||
@ -725,7 +726,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.deadLine {
|
||||
.dead-line {
|
||||
position: relative;
|
||||
&__container {
|
||||
padding: 5px 10px 5px;
|
||||
@ -846,7 +847,8 @@
|
||||
.time {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
justify-content: center;
|
||||
column-gap: 5px;
|
||||
font-size: 13px;
|
||||
margin-top: 5px;
|
||||
width: 160px;
|
||||
@ -924,7 +926,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.dropdownList {
|
||||
.dropdown-list {
|
||||
position: absolute;
|
||||
background: white;
|
||||
padding: 10px;
|
||||
@ -937,7 +939,7 @@
|
||||
flex-direction: column;
|
||||
row-gap: 8px;
|
||||
|
||||
.noUsers {
|
||||
.no-users {
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
}
|
||||
@ -1064,7 +1066,7 @@
|
||||
top: 5px;
|
||||
}
|
||||
|
||||
.tagItem {
|
||||
.tag-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
@ -1091,7 +1093,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
&__noItem {
|
||||
&__no-item {
|
||||
line-height: 20px;
|
||||
font-size: 15px;
|
||||
margin: 0;
|
||||
|
||||
@ -565,7 +565,7 @@ export const TicketFullScreen = () => {
|
||||
(div) =>
|
||||
div.classList &&
|
||||
(div.classList.contains("button-add-worker") ||
|
||||
div.classList.contains("dropdownList"))
|
||||
div.classList.contains("dropdown-list"))
|
||||
)
|
||||
) {
|
||||
setDropListOpen(false);
|
||||
@ -577,7 +577,7 @@ export const TicketFullScreen = () => {
|
||||
!path.find(
|
||||
(div) =>
|
||||
div.classList &&
|
||||
(div.classList.contains("deadLine") ||
|
||||
(div.classList.contains("dead-line") ||
|
||||
div.classList.contains("react-datepicker-popper"))
|
||||
)
|
||||
) {
|
||||
@ -674,7 +674,7 @@ export const TicketFullScreen = () => {
|
||||
}}
|
||||
/>
|
||||
) : (
|
||||
<h5 className="fullName nameFullScreen">
|
||||
<h5 className="full-name name-fullscreen">
|
||||
{inputsValue.title}
|
||||
</h5>
|
||||
)}
|
||||
@ -708,7 +708,7 @@ export const TicketFullScreen = () => {
|
||||
) : (
|
||||
<div className="ticket__description">
|
||||
<div
|
||||
className="fullDescription fullScreenDescription"
|
||||
className="full-description fullscreen-description"
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: inputsValue.description
|
||||
}}
|
||||
@ -717,7 +717,7 @@ export const TicketFullScreen = () => {
|
||||
)}
|
||||
</div>
|
||||
{Boolean(taskFiles.length) && (
|
||||
<div className="task__files filesFullScreen">
|
||||
<div className="task__files files-fullscreen">
|
||||
{taskFiles.map((file) => {
|
||||
return (
|
||||
<FileTracker
|
||||
@ -731,17 +731,17 @@ export const TicketFullScreen = () => {
|
||||
</div>
|
||||
)}
|
||||
{uploadedFile && (
|
||||
<div className="fileLoaded">
|
||||
<div className="file-loaded">
|
||||
{uploadedFile.map((file) => {
|
||||
return (
|
||||
<div className="loadedFile" key={file.id}>
|
||||
<div className="loaded-file" key={file.id}>
|
||||
<img
|
||||
src={backendImg(file.url)}
|
||||
alt="img"
|
||||
key={file.id}
|
||||
/>
|
||||
<div
|
||||
className="deleteFile"
|
||||
className="delete-file"
|
||||
onClick={() => deleteLoadedFile(file)}
|
||||
>
|
||||
<img src={fileDelete} alt="delete" />
|
||||
@ -775,7 +775,7 @@ export const TicketFullScreen = () => {
|
||||
{caseOfNum(taskFiles.length, "files")}
|
||||
</div>
|
||||
</div>
|
||||
<div className="content__input commentFullScreen">
|
||||
<div className="content__input comment-fullscreen">
|
||||
<input
|
||||
placeholder="Оставить комментарий"
|
||||
value={inputsValue.comment}
|
||||
@ -809,7 +809,7 @@ export const TicketFullScreen = () => {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="workers fullScreenWorkers">
|
||||
<div className="workers fullscreen-workers">
|
||||
<div className="workers_box task__info">
|
||||
<div className="workers__creator">
|
||||
Создатель: <p>{taskInfo.user?.fio}</p>
|
||||
@ -836,7 +836,7 @@ export const TicketFullScreen = () => {
|
||||
</div>
|
||||
</>
|
||||
) : (
|
||||
<div className="add-worker moreItems ">
|
||||
<div className="add-worker more-items ">
|
||||
<button
|
||||
className="button-add-worker"
|
||||
onClick={() => setDropListOpen(true)}
|
||||
@ -845,16 +845,16 @@ export const TicketFullScreen = () => {
|
||||
</button>
|
||||
<span>Добавить исполнителя</span>
|
||||
{dropListOpen && (
|
||||
<div className="dropdownList">
|
||||
<div className="dropdown-list">
|
||||
<img
|
||||
src={close}
|
||||
className="dropdownList__close"
|
||||
className="dropdown-list__close"
|
||||
onClick={() => setDropListOpen(false)}
|
||||
/>
|
||||
{correctProjectUsers.map((person) => {
|
||||
return (
|
||||
<div
|
||||
className="dropdownList__person"
|
||||
className="dropdown-list__person"
|
||||
key={person.user_id}
|
||||
onClick={() => taskExecutor(person)}
|
||||
>
|
||||
@ -901,7 +901,7 @@ export const TicketFullScreen = () => {
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
<div className="add-worker moreItems">
|
||||
<div className="add-worker more-items">
|
||||
<button
|
||||
className="button-add-worker"
|
||||
onClick={() => setDropListMembersOpen(true)}
|
||||
@ -910,17 +910,17 @@ export const TicketFullScreen = () => {
|
||||
</button>
|
||||
<span>Добавить участника</span>
|
||||
{dropListMembersOpen && (
|
||||
<div className="dropdownList">
|
||||
<div className="dropdown-list">
|
||||
<img
|
||||
src={close}
|
||||
className="dropdownList__close"
|
||||
className="dropdown-list__close"
|
||||
onClick={() => setDropListMembersOpen(false)}
|
||||
/>
|
||||
{users.length ? (
|
||||
users.map((person) => {
|
||||
return (
|
||||
<div
|
||||
className="dropdownList__person"
|
||||
className="dropdown-list__person"
|
||||
key={person.user_id}
|
||||
onClick={() => addMember(person)}
|
||||
>
|
||||
@ -937,7 +937,7 @@ export const TicketFullScreen = () => {
|
||||
);
|
||||
})
|
||||
) : (
|
||||
<p className="noUsers">Нет пользователей</p>
|
||||
<p className="no-users">Нет пользователей</p>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
@ -945,9 +945,9 @@ export const TicketFullScreen = () => {
|
||||
</div>
|
||||
|
||||
<div className="workers_box-middle">
|
||||
<div className="deadLine">
|
||||
<div className="dead-line">
|
||||
<div
|
||||
className="deadLine__container"
|
||||
className="dead-line__container"
|
||||
onClick={() => setDatePickerOpen(!datePickerOpen)}
|
||||
>
|
||||
<img src={calendarIcon} alt="calendar" />
|
||||
@ -1049,7 +1049,7 @@ export const TicketFullScreen = () => {
|
||||
{correctProjectTags.map((tag) => {
|
||||
return (
|
||||
<div
|
||||
className="tagItem"
|
||||
className="tag-item"
|
||||
key={tag.id}
|
||||
onClick={() => addTagToTask(tag.id)}
|
||||
>
|
||||
@ -1059,7 +1059,7 @@ export const TicketFullScreen = () => {
|
||||
);
|
||||
})}
|
||||
{!Boolean(correctProjectTags.length) && (
|
||||
<p className="tags__dropDown__noItem">Нет тегов</p>
|
||||
<p className="tags__dropDown__no-item">Нет тегов</p>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
|
||||
@ -2,11 +2,11 @@
|
||||
background: #f5f5f5;
|
||||
}
|
||||
|
||||
.fullName {
|
||||
.full-name {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
span {
|
||||
color: #6F6F6F;
|
||||
color: #6f6f6f;
|
||||
font-weight: 500;
|
||||
font-size: 12px;
|
||||
line-height: 17px;
|
||||
@ -39,7 +39,7 @@
|
||||
span {
|
||||
display: flex;
|
||||
width: 120px;
|
||||
color: #6F6F6F;
|
||||
color: #6f6f6f;
|
||||
font-weight: 500;
|
||||
font-size: 12px;
|
||||
line-height: 17px;
|
||||
@ -47,9 +47,9 @@
|
||||
}
|
||||
}
|
||||
|
||||
.fullScreenWorkers {
|
||||
.fullscreen-workers {
|
||||
@media (max-width: 880px) {
|
||||
background: #DFF1FF;
|
||||
background: #dff1ff;
|
||||
|
||||
.workers_box {
|
||||
@media (max-width: 880px) {
|
||||
@ -84,7 +84,7 @@
|
||||
gap: 20px;
|
||||
border-bottom: none !important;
|
||||
|
||||
.deadLine {
|
||||
.dead-line {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@ -122,13 +122,13 @@
|
||||
}
|
||||
}
|
||||
|
||||
.commentFullScreen {
|
||||
.comment-fullscreen {
|
||||
@media (max-width: 520px) {
|
||||
width: auto !important;
|
||||
}
|
||||
}
|
||||
|
||||
.filesFullScreen {
|
||||
.files-fullscreen {
|
||||
@media (max-width: 520px) {
|
||||
justify-content: space-evenly;
|
||||
max-height: 400px !important;
|
||||
@ -141,13 +141,13 @@
|
||||
}
|
||||
}
|
||||
|
||||
.nameFullScreen {
|
||||
.name-fullscreen {
|
||||
@media (max-width: 520px) {
|
||||
white-space: inherit !important;
|
||||
}
|
||||
}
|
||||
|
||||
.fullScreenDescription {
|
||||
.fullscreen-description {
|
||||
@media (max-width: 1190px) {
|
||||
white-space: inherit !important;
|
||||
}
|
||||
|
||||
@ -413,11 +413,11 @@ export const TrackerModal = ({
|
||||
<div className="select__person">
|
||||
<div className="title-project select-person">
|
||||
<h4>Добавьте участника</h4>
|
||||
<p className="select-person__info">
|
||||
Выберите пользователя в списке или добавьте по e-mail
|
||||
</p>
|
||||
<div className="invite__blocks">
|
||||
<div className="add-person-block">
|
||||
<p className="select-person__info">
|
||||
Выберите пользователя в списке
|
||||
</p>
|
||||
<div
|
||||
className={
|
||||
selectWorkersOpen
|
||||
@ -468,8 +468,8 @@ export const TrackerModal = ({
|
||||
Добавить
|
||||
</BaseButton>
|
||||
</div>
|
||||
<span>или</span>
|
||||
<div className="invite-person-block">
|
||||
<span>или добавьте по e-mail</span>
|
||||
<div className="input-container invite-person-block__input">
|
||||
<input
|
||||
className="name-project"
|
||||
@ -494,13 +494,14 @@ export const TrackerModal = ({
|
||||
{modalType === "create-ticket-project" && (
|
||||
<>
|
||||
<div className="title-project">
|
||||
<div className="createTaskHead">
|
||||
<div className="createTaskBody__right__owner">
|
||||
<div className="create-task-head">
|
||||
<div className="create-task-body__right__owner">
|
||||
<p>Создание задачи</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="createTaskBody">
|
||||
<div className="createTaskBody__left">
|
||||
<div className="create-task-body">
|
||||
<div className="create-task-body__left">
|
||||
<h4>Введите название и описание задачи</h4>
|
||||
<div className="input-container">
|
||||
<input
|
||||
maxLength="100"
|
||||
@ -532,14 +533,14 @@ export const TrackerModal = ({
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div className="createTaskBody__right">
|
||||
<div className="createTaskBody__right__tags">
|
||||
<div className="create-task-body__right">
|
||||
<div className="create-task-body__right__tags">
|
||||
<div className="tags__selected">
|
||||
<div className="tags__selected__items">
|
||||
{taskTags.map((tag) => {
|
||||
return (
|
||||
<div
|
||||
className="selectedTag"
|
||||
className="selected-tag"
|
||||
key={tag.id}
|
||||
style={{ background: tag.color }}
|
||||
>
|
||||
@ -596,7 +597,7 @@ export const TrackerModal = ({
|
||||
);
|
||||
})}
|
||||
{Boolean(!correctProjectTags.length) && (
|
||||
<p className="noTags">Нет тегов</p>
|
||||
<p className="no-tags">Нет тегов</p>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
@ -688,7 +689,7 @@ export const TrackerModal = ({
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
<div className="createTaskBody__right__deadLine">
|
||||
<div className="create-task-body__right__dead-line">
|
||||
<img src={calendarImg} alt="calendar" />
|
||||
<p onClick={() => setDatePickerOpen(!datePickerOpen)}>
|
||||
{deadLineDate
|
||||
|
||||
@ -305,7 +305,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.createTaskHead {
|
||||
.create-task-head {
|
||||
width: 100%;
|
||||
padding: 5px 10px;
|
||||
display: flex;
|
||||
@ -319,7 +319,7 @@
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
&__selectColumn {
|
||||
&__select-column {
|
||||
display: flex;
|
||||
column-gap: 8px;
|
||||
cursor: pointer;
|
||||
@ -335,7 +335,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.createTaskBody {
|
||||
.create-task-body {
|
||||
padding: 15px 20px;
|
||||
display: flex;
|
||||
column-gap: 20px;
|
||||
@ -448,7 +448,7 @@
|
||||
gap: 8px;
|
||||
max-width: 393px;
|
||||
|
||||
.selectedTag {
|
||||
.selected-tag {
|
||||
display: flex;
|
||||
padding: 7px 7px 7px 8px;
|
||||
border-radius: 35px;
|
||||
@ -525,7 +525,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.noTags {
|
||||
.no-tags {
|
||||
text-align: center;
|
||||
font-size: 18px;
|
||||
}
|
||||
@ -603,7 +603,7 @@
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
&__deadLine {
|
||||
&__dead-line {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
column-gap: 5px;
|
||||
|
||||
@ -61,7 +61,7 @@ export const Navigation = () => {
|
||||
},
|
||||
{
|
||||
path: "/treaties",
|
||||
name: "Договора"
|
||||
name: "Договоры"
|
||||
},
|
||||
{
|
||||
path: "/settings",
|
||||
@ -88,8 +88,8 @@ export const Navigation = () => {
|
||||
})}
|
||||
</nav>
|
||||
|
||||
<div className="profile-header__personalInfo">
|
||||
<h3 className="profile-header__personalInfoName">
|
||||
<div className="profile-header__personal-info">
|
||||
<h3 className="profile-header__personal-info-name">
|
||||
{profileInfo?.fio ? profileInfo?.fio : profileInfo?.username}
|
||||
</h3>
|
||||
<NavLink end to={"/profile"}>
|
||||
@ -97,7 +97,7 @@ export const Navigation = () => {
|
||||
src={
|
||||
profileInfo?.photo ? urlForLocal(profileInfo.photo) : avatarMok
|
||||
}
|
||||
className="profile-header__personalInfoAvatar"
|
||||
className="profile-header__personal-info-avatar"
|
||||
alt="avatar"
|
||||
/>
|
||||
</NavLink>
|
||||
|
||||
@ -9,18 +9,18 @@ import "./partnerPersonCard.scss";
|
||||
|
||||
export const PartnerPersonCard = ({ name, img, userId }) => {
|
||||
return (
|
||||
<div className="partnerPersonCard">
|
||||
<div className="partnerPersonCard__img">
|
||||
<div className="partner-person-card">
|
||||
<div className="partner-person-card__img">
|
||||
<img src={urlForLocal(img)} alt="avatar" />
|
||||
</div>
|
||||
<div className="partnerPersonCard__info">
|
||||
<h2 className="partnerPersonCard__name">{name}</h2>
|
||||
<div className="partner-person-card__info">
|
||||
<h2 className="partner-person-card__name">{name}</h2>
|
||||
<Link
|
||||
className="partnerPersonCard__report"
|
||||
className="partner-person-card__report"
|
||||
to={`/profile/employees/report/${userId}`}
|
||||
>
|
||||
Подробный отчет
|
||||
<div className="partnerPersonCard__more">
|
||||
<div className="partner-person-card__more">
|
||||
<img src={rightArrow} alt="arrow" />
|
||||
</div>
|
||||
</Link>
|
||||
|
||||
@ -1,25 +1,28 @@
|
||||
.partnerPersonCard {
|
||||
.partner-person-card {
|
||||
display: flex;
|
||||
position: relative;
|
||||
width: 300px;
|
||||
|
||||
&__img {
|
||||
background: white;
|
||||
border-radius: 12px;
|
||||
padding: 25px;
|
||||
border-radius: 12px 0 0 12px;
|
||||
padding: 5px;
|
||||
z-index: 2;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
img {
|
||||
width: 77px;
|
||||
height: 77px;
|
||||
width: 70px;
|
||||
height: 70px;
|
||||
}
|
||||
}
|
||||
|
||||
&__info {
|
||||
position: relative;
|
||||
background: #E1FCCF;
|
||||
background: #e1fccf;
|
||||
z-index: 1;
|
||||
padding: 15px 15px 15px 30px;
|
||||
left: -15px;
|
||||
border-radius: 12px;
|
||||
padding: 10px;
|
||||
border-radius: 0 12px 12px 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
@ -34,8 +37,8 @@
|
||||
}
|
||||
|
||||
&__more {
|
||||
width: 41px;
|
||||
height: 41px;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
background: white;
|
||||
border-radius: 50px;
|
||||
display: flex;
|
||||
|
||||
@ -5,7 +5,7 @@ import "./profileBreadcrumbs.scss";
|
||||
|
||||
export const ProfileBreadcrumbs = ({ links }) => {
|
||||
return (
|
||||
<div className="profileBreadcrumbs">
|
||||
<div className="profile-breadcrumbs">
|
||||
{links.map((link, index) => {
|
||||
return (
|
||||
<Link key={index} to={link.link}>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
.profileBreadcrumbs {
|
||||
.profile-breadcrumbs {
|
||||
display: flex;
|
||||
margin-bottom: 12px;
|
||||
|
||||
|
||||
@ -246,13 +246,13 @@ export const ProfileCalendarComponent = React.memo(
|
||||
key={day}
|
||||
className={
|
||||
startRangeDays
|
||||
? `selectDays ${
|
||||
? `select-days ${
|
||||
String(startDate?._d) === String(day._d) ||
|
||||
endDate === day
|
||||
? "selectedDay"
|
||||
? "selected-day"
|
||||
: ""
|
||||
} ${endDate ? "disable" : ""} ${
|
||||
selectedRangeDays[day] ? "selectedDay" : ""
|
||||
selectedRangeDays[day] ? "selected-day" : ""
|
||||
}`
|
||||
: dayStyles(day)
|
||||
}
|
||||
@ -272,7 +272,7 @@ export const ProfileCalendarComponent = React.memo(
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
<div className="selectDateRange">
|
||||
<div className="select-date-range">
|
||||
<span
|
||||
className="select"
|
||||
onClick={() => {
|
||||
@ -286,15 +286,15 @@ export const ProfileCalendarComponent = React.memo(
|
||||
? `${getCorrectDate(startDate)} - ${getCorrectDate(endDate)}`
|
||||
: `${getCorrectDate(endDate)} - ${getCorrectDate(startDate)}`
|
||||
: activePeriod
|
||||
? "Выберите диапазон на календаре"
|
||||
: "Выбрать диапазон"}
|
||||
? "Выберите диапазон на календаре"
|
||||
: "Выбрать диапазон"}
|
||||
</span>
|
||||
<span>
|
||||
{totalRangeHours
|
||||
? `${totalRangeHours} ${hourOfNum(totalRangeHours)}`
|
||||
: endDate
|
||||
? "0 часов"
|
||||
: ""}
|
||||
? "0 часов"
|
||||
: ""}
|
||||
</span>
|
||||
{endDate && (
|
||||
<BaseButton
|
||||
|
||||
@ -84,12 +84,12 @@
|
||||
}
|
||||
}
|
||||
|
||||
&__personalInfo {
|
||||
&__personal-info {
|
||||
display: flex;
|
||||
column-gap: 20px;
|
||||
align-items: center;
|
||||
|
||||
&Name {
|
||||
&-name {
|
||||
margin-bottom: 0;
|
||||
font-size: 12px;
|
||||
line-height: 32px;
|
||||
@ -103,7 +103,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
&Avatar {
|
||||
&-avatar {
|
||||
width: 37px;
|
||||
height: 37px;
|
||||
border-radius: 100px;
|
||||
|
||||
@ -1,10 +1,10 @@
|
||||
import React, { useEffect, useState } from "react";
|
||||
import { useDispatch } from "react-redux";
|
||||
import { Link } from "react-router-dom";
|
||||
import { Link, useNavigate } from "react-router-dom";
|
||||
|
||||
import { deleteProject, modalToggle } from "@redux/projectsTrackerSlice";
|
||||
|
||||
import { copyProjectLink } from "@utils/helper";
|
||||
import { copyProjectLink, urlForLocal } from "@utils/helper";
|
||||
|
||||
import { apiRequest } from "@api/request";
|
||||
|
||||
@ -18,7 +18,6 @@ import archiveSet from "assets/icons/archive.svg";
|
||||
import del from "assets/icons/delete.svg";
|
||||
import edit from "assets/icons/edit.svg";
|
||||
import link from "assets/icons/link.svg";
|
||||
import avatarProject from "assets/images/avatarMok.png";
|
||||
|
||||
import "./projectTicket.scss";
|
||||
|
||||
@ -27,8 +26,8 @@ export const ProjectTicket = ({ project, index }) => {
|
||||
const [modalAdd, setModalAdd] = useState(false);
|
||||
const [modalDelete, setModalDelete] = useState(false);
|
||||
const [acceptModalOpen, setAcceptModalOpen] = useState(false);
|
||||
const [path, setPath] = useState("");
|
||||
const dispatch = useDispatch();
|
||||
const navigate = useNavigate();
|
||||
const { showNotification } = useNotification();
|
||||
|
||||
useEffect(() => {
|
||||
@ -84,18 +83,30 @@ export const ProjectTicket = ({ project, index }) => {
|
||||
<div className="project__link">{project.name}</div>
|
||||
|
||||
<div className="project__info">
|
||||
<p>Открытые задачи</p>
|
||||
{/* <p>Открытые задачи</p>
|
||||
<span className="count">
|
||||
{project.columns.reduce(
|
||||
(accumulator, currentValue) =>
|
||||
accumulator + currentValue.tasks.length,
|
||||
0
|
||||
)}
|
||||
</span>
|
||||
<img src={avatarProject} alt="#" className="project__avatar" />
|
||||
</span> */}
|
||||
<img
|
||||
src={urlForLocal(project.owner_info.avatar)}
|
||||
alt="avatar"
|
||||
className="project__avatar"
|
||||
/>
|
||||
<span>{project.owner_info.fio}</span>
|
||||
</div>
|
||||
</Link>
|
||||
|
||||
{/* <Link
|
||||
to={`/profile/statistics/${project.id}`}
|
||||
className="project__statistics"
|
||||
>
|
||||
Посмотреть статистику
|
||||
</Link> */}
|
||||
|
||||
<span
|
||||
className="menu-settings"
|
||||
onClick={() => {
|
||||
@ -105,13 +116,6 @@ export const ProjectTicket = ({ project, index }) => {
|
||||
...
|
||||
</span>
|
||||
|
||||
<Link
|
||||
to={`/profile/statistics/${project.id}`}
|
||||
className="project__statistics"
|
||||
>
|
||||
Посмотреть статистику
|
||||
</Link>
|
||||
|
||||
<TrackerModal
|
||||
active={modalAdd}
|
||||
setActive={setModalAdd}
|
||||
@ -131,9 +135,9 @@ export const ProjectTicket = ({ project, index }) => {
|
||||
<img src={edit}></img>
|
||||
<p>редактировать</p>
|
||||
</div>
|
||||
<div>
|
||||
<div onClick={copyProjectLink(project.id)}>
|
||||
<img src={link}></img>
|
||||
<p onClick={copyProjectLink(project.id)}>скопировать ссылку</p>
|
||||
<p>скопировать ссылку</p>
|
||||
</div>
|
||||
<div
|
||||
onClick={() => {
|
||||
@ -144,7 +148,14 @@ export const ProjectTicket = ({ project, index }) => {
|
||||
<img src={archiveSet}></img>
|
||||
<p>в архив</p>
|
||||
</div>
|
||||
|
||||
<div
|
||||
onClick={() => {
|
||||
navigate(`/profile/statistics/${project.id}`);
|
||||
}}
|
||||
>
|
||||
<img src={archiveSet}></img>
|
||||
<p>статистика</p>
|
||||
</div>
|
||||
<div
|
||||
onClick={() => {
|
||||
setModalDelete(true);
|
||||
|
||||
@ -40,7 +40,6 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
margin-bottom: 30px;
|
||||
|
||||
p {
|
||||
color: #6f6f6f;
|
||||
@ -50,6 +49,11 @@
|
||||
line-height: 17px;
|
||||
}
|
||||
|
||||
span {
|
||||
color: blue;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.count {
|
||||
margin-left: 8px;
|
||||
width: 26px;
|
||||
@ -78,16 +82,16 @@
|
||||
|
||||
.menu-settings {
|
||||
position: absolute;
|
||||
font-size: 21px;
|
||||
font-size: 30px;
|
||||
color: #6f6f6f;
|
||||
right: 15px;
|
||||
top: 0px;
|
||||
top: -10px;
|
||||
}
|
||||
|
||||
&__avatar {
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
margin-left: 56px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
&__open-tracker {
|
||||
|
||||
@ -249,7 +249,7 @@ const ReportForm = () => {
|
||||
value={inputs[index].task}
|
||||
className={
|
||||
!input.task && reportSuccess === "Заполните задачи"
|
||||
? "checkTask"
|
||||
? "check-task"
|
||||
: ""
|
||||
}
|
||||
name="text"
|
||||
@ -273,7 +273,7 @@ const ReportForm = () => {
|
||||
className={
|
||||
!input.hours_spent &&
|
||||
reportSuccess === "Заполните задачи"
|
||||
? "checkTask"
|
||||
? "check-task"
|
||||
: ""
|
||||
}
|
||||
name="number"
|
||||
@ -308,7 +308,7 @@ const ReportForm = () => {
|
||||
})}
|
||||
|
||||
<div className="report-form__form-add">
|
||||
<p className="addMore" onClick={addInput}>
|
||||
<p className="add-more" onClick={addInput}>
|
||||
+
|
||||
</p>
|
||||
<span>Добавить задачу</span>
|
||||
@ -368,7 +368,7 @@ const ReportForm = () => {
|
||||
{reportSuccess && (
|
||||
<p
|
||||
className={`report-form__footer-done ${
|
||||
reportSuccess === "Заполните задачи" ? "errorText" : ""
|
||||
reportSuccess === "Заполните задачи" ? "error-text" : ""
|
||||
}`}
|
||||
>
|
||||
{reportSuccess}
|
||||
|
||||
@ -194,7 +194,7 @@
|
||||
flex-direction: column;
|
||||
|
||||
&--description {
|
||||
.checkTask {
|
||||
.check-task {
|
||||
border-color: #fc0000;
|
||||
}
|
||||
|
||||
@ -229,7 +229,7 @@
|
||||
margin-left: 0px;
|
||||
}
|
||||
|
||||
.checkTask {
|
||||
.check-task {
|
||||
border-color: #fc0000;
|
||||
}
|
||||
|
||||
@ -267,7 +267,7 @@
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
.addMore {
|
||||
.add-more {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
@ -383,7 +383,7 @@
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
.errorText {
|
||||
.error-text {
|
||||
color: #bf3c3c;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
@ -75,9 +75,9 @@ export const ShortReport = () => {
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div className="viewReport__info short-report">
|
||||
<div className="viewReport__title-box">
|
||||
<h2 className="viewReport__title">
|
||||
<div className="view-report__info short-report">
|
||||
<div className="view-report__title-box">
|
||||
<h2 className="view-report__title">
|
||||
Ваши отчеты - <span>просмотр отчета за день</span>
|
||||
</h2>
|
||||
<Link to={`/profile/calendar/view/${dateCreate}`}>
|
||||
@ -85,11 +85,11 @@ export const ShortReport = () => {
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
<div className="viewReport__bar">
|
||||
<h3 className="viewReport__bar__date">
|
||||
<div className="view-report__bar">
|
||||
<h3 className="view-report__bar__date">
|
||||
{getCorrectDate(reportDate)}
|
||||
</h3>
|
||||
<p className="viewReport__bar__hours">
|
||||
<p className="view-report__bar__hours">
|
||||
Вами потрачено на работу:{" "}
|
||||
<span>
|
||||
{totalHours} {hourOfNum(totalHours)}
|
||||
@ -99,9 +99,9 @@ export const ShortReport = () => {
|
||||
</div>
|
||||
{loader && <Loader style="green" />}
|
||||
{Boolean(taskText.length) && (
|
||||
<div className="viewReport__content">
|
||||
<div className="view-report__content">
|
||||
<div className="table__container">
|
||||
<table className="viewReport__done">
|
||||
<table className="view-report__done">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>
|
||||
@ -123,7 +123,7 @@ export const ShortReport = () => {
|
||||
</p>
|
||||
</td>
|
||||
<td>
|
||||
<div className="viewReport__done__hours__item">
|
||||
<div className="view-report__done__hours__item">
|
||||
<span>{task.hours}</span>
|
||||
<p className="hours">
|
||||
{hourOfNum(task.hours)} на задачу
|
||||
@ -145,7 +145,7 @@ export const ShortReport = () => {
|
||||
</table>
|
||||
</div>
|
||||
{Boolean(difficulties.length) && (
|
||||
<div className="viewReport__item">
|
||||
<div className="view-report__item">
|
||||
<h3>Какие сложности возникли?</h3>
|
||||
{difficulties.map((item, index) => {
|
||||
return <p key={index}>{item}</p>;
|
||||
@ -153,7 +153,7 @@ export const ShortReport = () => {
|
||||
</div>
|
||||
)}
|
||||
{Boolean(tomorrowTask.length) && (
|
||||
<div className="viewReport__item">
|
||||
<div className="view-report__item">
|
||||
<h3>Что планируется сделать завтра?</h3>
|
||||
{tomorrowTask.map((item, index) => {
|
||||
return <p key={index}>{item}</p>;
|
||||
@ -163,7 +163,7 @@ export const ShortReport = () => {
|
||||
</div>
|
||||
)}
|
||||
{!Boolean(taskText.length) && !loader && (
|
||||
<div className="viewReport__noTask">
|
||||
<div className="view-report__no-task">
|
||||
<p>
|
||||
В этот день вы <span>не заполняли</span> отчет
|
||||
</p>
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.viewReport {
|
||||
.view-report {
|
||||
&__title-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
@ -3,6 +3,7 @@
|
||||
align-items: center;
|
||||
font-size: var(--size);
|
||||
line-height: 0.75;
|
||||
|
||||
&__body {
|
||||
position: relative;
|
||||
&::before {
|
||||
@ -11,6 +12,7 @@
|
||||
color: var(--color);
|
||||
}
|
||||
}
|
||||
|
||||
&__active {
|
||||
position: absolute;
|
||||
height: 100%;
|
||||
@ -28,6 +30,7 @@
|
||||
color: var(--color);
|
||||
}
|
||||
}
|
||||
|
||||
&__items {
|
||||
display: flex;
|
||||
position: absolute;
|
||||
@ -36,6 +39,7 @@
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
&__item {
|
||||
flex: 0 0 20%;
|
||||
height: 100%;
|
||||
|
||||
@ -30,6 +30,7 @@
|
||||
&__hours {
|
||||
margin-left: 3.3rem;
|
||||
display: flex;
|
||||
|
||||
&-value {
|
||||
width: 34px;
|
||||
height: 34px;
|
||||
|
||||
@ -12,13 +12,13 @@ export const TrackerSelectColumn = ({ columns, task, currentColumn }) => {
|
||||
const [openSelect, setOpenSelect] = useState(false);
|
||||
return (
|
||||
<div
|
||||
className="trackerSelectColumn"
|
||||
className="tracker-select-column"
|
||||
onClick={() => setOpenSelect(!openSelect)}
|
||||
>
|
||||
<p>{currentColumn.title}</p>
|
||||
<img className={openSelect ? "open" : ""} src={arrowDown} alt="arrow" />
|
||||
{openSelect && (
|
||||
<div className="trackerSelectColumn__dropDown">
|
||||
<div className="tracker-select-column__dropDown">
|
||||
{columns.map((column) => {
|
||||
return (
|
||||
<p
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
.trackerSelectColumn {
|
||||
.tracker-select-column {
|
||||
display: none;
|
||||
|
||||
@media (max-width: 900px) {
|
||||
@ -9,7 +9,7 @@
|
||||
align-items: center;
|
||||
padding: 2px 6px;
|
||||
cursor: pointer;
|
||||
border: 1px solid #e3e2e2;;
|
||||
border: 1px solid #e3e2e2;
|
||||
border-radius: 8px;
|
||||
position: relative;
|
||||
|
||||
|
||||
@ -80,7 +80,7 @@ export const TrackerTaskComment = ({
|
||||
: "",
|
||||
"comments__list__item",
|
||||
commentsEditOpen ? "comment__edit--open" : "",
|
||||
comment.parent_id ? "comments__list__item__subComment" : ""
|
||||
comment.parent_id ? "comments__list__item__sub-comment" : ""
|
||||
].join(" ")}
|
||||
>
|
||||
<div className="comments__list__item__info">
|
||||
|
||||
@ -29,7 +29,7 @@ export const CardAvailableTest = ({ title, description, path, status }) => {
|
||||
</div>
|
||||
<div className="card-available-test__info">
|
||||
<p dangerouslySetInnerHTML={{ __html: description }}></p>
|
||||
<div className="card-available-test__infoLink">
|
||||
<div className="card-available-test__info-link">
|
||||
<img src={rightArrow} alt="arrow" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -469,7 +469,7 @@ $maxWidthContainer: 1123;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
&Link {
|
||||
&-link {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
background: #ddeec6;
|
||||
|
||||
@ -326,14 +326,14 @@
|
||||
}
|
||||
}
|
||||
|
||||
&__partnersForPart {
|
||||
&__partners-for-part {
|
||||
background: #406128;
|
||||
color: white;
|
||||
margin-left: -35px;
|
||||
}
|
||||
|
||||
&__partnersForPart,
|
||||
&__developersForPart {
|
||||
&__partners-for-part,
|
||||
&__developers-for-part {
|
||||
width: 220px;
|
||||
height: 50px;
|
||||
border-radius: 44px;
|
||||
@ -341,7 +341,7 @@
|
||||
border: none;
|
||||
}
|
||||
|
||||
&__developersForPart {
|
||||
&__developers-for-part {
|
||||
background-color: #52b7098c;
|
||||
color: #2d6505;
|
||||
}
|
||||
@ -353,7 +353,7 @@
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
&__partnersForPart {
|
||||
&__partners-for-part {
|
||||
margin: 15px 0 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
@ -128,7 +128,7 @@ export const AuthForCandidate = () => {
|
||||
<p className="auth-candidate__start__description">
|
||||
Для нас не имеет значение Ваша локация.
|
||||
</p>
|
||||
<div className="auth-candidate__start__categoriesWrapper">
|
||||
<div className="auth-candidate__start__categories-wrapper">
|
||||
<StepsForCandidate step="шаг 1 - выберите специализацию" />
|
||||
{personalInfoItems.map((item, index) => {
|
||||
return (
|
||||
|
||||
@ -32,7 +32,7 @@
|
||||
line-height: 32px;
|
||||
}
|
||||
|
||||
&__categoriesWrapper {
|
||||
&__categories-wrapper {
|
||||
position: relative;
|
||||
margin-top: 200px;
|
||||
width: 100%;
|
||||
@ -47,7 +47,7 @@
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.categoriesItem {
|
||||
.categories-item {
|
||||
@media (max-width: 1094px) {
|
||||
flex: 0 0 48.6%;
|
||||
}
|
||||
|
||||
@ -145,25 +145,25 @@ const CatalogSpecialists = () => {
|
||||
}
|
||||
];
|
||||
return (
|
||||
<section className="catalogSpecialists">
|
||||
<section className="catalog-specialists">
|
||||
<AuthHeader />
|
||||
<div className="container catalogSpecialists__wrapper">
|
||||
<div className="container catalog-specialists__wrapper">
|
||||
<ProfileBreadcrumbs
|
||||
links={[
|
||||
{ name: "Главная", link: "/auth" },
|
||||
{ name: "Свободные разработчики", link: "/" }
|
||||
]}
|
||||
/>
|
||||
<div className="catalogSpecialists__head">
|
||||
<div className="catalog-specialists__head">
|
||||
<h2>Каталог специалистов</h2>
|
||||
<div className="catalogSpecialists__count countInfo">
|
||||
<div className="countInfo__imgWrapper">
|
||||
<div className="catalog-specialists__count count-info">
|
||||
<div className="count-info__imgWrapper">
|
||||
<img src={mockWorker} alt="worker" />
|
||||
</div>
|
||||
<p>🖐 50+ специалистов доступны</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="catalogSpecialists__items">
|
||||
<div className="catalog-specialists__items">
|
||||
{personalInfoItems.map((item, index) => {
|
||||
return (
|
||||
<CategoriesItem
|
||||
@ -177,14 +177,14 @@ const CatalogSpecialists = () => {
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
<h3 className="catalogSpecialists__searchTitle">
|
||||
<h3 className="catalog-specialists__search-title">
|
||||
Найти специалиста по навыкам
|
||||
</h3>
|
||||
<div className="catalogSpecialists__searchBlock">
|
||||
<div className="catalog-specialists__search-block">
|
||||
<input type="text" />
|
||||
<button>Поиск</button>
|
||||
</div>
|
||||
<div className="catalogSpecialists__employees">
|
||||
<div className="catalog-specialists__employees">
|
||||
{mockPersons.map((person, index) => {
|
||||
return (
|
||||
<CatalogPersonCard
|
||||
|
||||
@ -1,12 +1,12 @@
|
||||
.catalogSpecialists {
|
||||
.catalog-specialists {
|
||||
background: #f1f1f1;
|
||||
height: 100%;
|
||||
min-height: 100vh;
|
||||
font-family: "LabGrotesque", sans-serif;
|
||||
|
||||
&__wrapper {
|
||||
padding-top: 24px;
|
||||
}
|
||||
&__wrapper {
|
||||
padding-top: 24px;
|
||||
}
|
||||
|
||||
&__head {
|
||||
display: flex;
|
||||
@ -24,7 +24,7 @@
|
||||
|
||||
&__count {
|
||||
border-radius: 38px;
|
||||
border: 1px solid #E3E3E9;
|
||||
border: 1px solid #e3e3e9;
|
||||
padding: 6px 32px 6px 6px;
|
||||
width: 100%;
|
||||
max-width: 450px;
|
||||
@ -40,7 +40,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.countInfo {
|
||||
.count-info {
|
||||
&__imgWrapper {
|
||||
width: 46px;
|
||||
height: 46px;
|
||||
@ -64,22 +64,22 @@
|
||||
margin-bottom: 45px;
|
||||
}
|
||||
|
||||
&__searchTitle {
|
||||
&__search-title {
|
||||
font-size: 25px;
|
||||
line-height: 32px;
|
||||
color: #000000;
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
|
||||
&__searchBlock {
|
||||
&__search-block {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 39px;
|
||||
|
||||
input {
|
||||
border-radius: 5px;
|
||||
border: 0.5px solid #B0BABF;
|
||||
background: #F4F4F4;
|
||||
border: 0.5px solid #b0babf;
|
||||
background: #f4f4f4;
|
||||
outline: none;
|
||||
height: 50px;
|
||||
padding: 0 10px;
|
||||
@ -91,7 +91,7 @@
|
||||
padding: 9px 36px;
|
||||
border-radius: 44px;
|
||||
border: none;
|
||||
background-color: #52B709;
|
||||
background-color: #52b709;
|
||||
color: white;
|
||||
font-size: 16px;
|
||||
margin-left: 20px;
|
||||
|
||||
@ -13,54 +13,54 @@ import "./companyInfo.scss";
|
||||
|
||||
export const CompanyInfo = () => {
|
||||
return (
|
||||
<div className="companyInfo">
|
||||
<div className="company-info">
|
||||
<AuthHeader />
|
||||
<SideBar />
|
||||
<div className="companyInfo__content">
|
||||
<div className="company-info__content">
|
||||
<div className="container">
|
||||
<h1 className="companyInfo__title">
|
||||
<h1 className="company-info__title">
|
||||
<span>Арендуйте IT специалистов:</span>
|
||||
<br />
|
||||
быстро, выгодно, на любой срок.
|
||||
</h1>
|
||||
<div className="arrowElement arrowDown">
|
||||
<div className="arrow-element arrow-down">
|
||||
<img src={arrow} alt="arrow" />
|
||||
</div>
|
||||
<p className="companyInfo__subTitle">
|
||||
<p className="company-info__subTitle">
|
||||
Мы предоставляем вам «в аренду» IT-специалистов. При этом они
|
||||
находятся в нашем штате. Оплата происходит за отработанные часы
|
||||
</p>
|
||||
<div className="companyInfo__info">
|
||||
<div className="companyInfo__countingBlock">
|
||||
<div className="companyInfo__countingBlock__head">
|
||||
<div className="company-info__info">
|
||||
<div className="company-info__counting-block">
|
||||
<div className="company-info__counting-block__head">
|
||||
<img src={countingImg} alt="countingImg" />
|
||||
<div className="countingBlock__info">
|
||||
<h3 className="countingBlock__title">
|
||||
<div className="counting-block__info">
|
||||
<h3 className="counting-block__title">
|
||||
Экономия бюджета компании - главное преимущество
|
||||
аутстаффинга
|
||||
</h3>
|
||||
<p className="countingBlock__subTitle">
|
||||
<p className="counting-block__subTitle">
|
||||
Приблизительный просчет дал результаты в экономии до 50%
|
||||
бюджета
|
||||
</p>
|
||||
</div>
|
||||
<div className="arrowElement">
|
||||
<div className="arrow-element">
|
||||
<img src={arrow} alt="arrow" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="companyInfo__countingBlock__bottom">
|
||||
<span className="titleBottom">Давайте просчитаем:</span>
|
||||
<p className="subTitleBottom">
|
||||
<div className="company-info__counting-block__bottom">
|
||||
<span className="title-bottom">Давайте просчитаем:</span>
|
||||
<p className="subtitle-bottom">
|
||||
Оплата работы <span>разработчика</span> в штат 1500 руб/ч (250
|
||||
000 руб/мес).
|
||||
</p>
|
||||
</div>
|
||||
<img className="countingBlockImg" src={calcImg} alt="calc" />
|
||||
<img className="counting-block-img" src={calcImg} alt="calc" />
|
||||
</div>
|
||||
<div className="companyInfo__info__img">
|
||||
<div className="company-info__info__img">
|
||||
<img src={braceImg} alt="brace" />
|
||||
</div>
|
||||
<div className="companyInfo__info__items">
|
||||
<div className="company-info__info__items">
|
||||
<div className="info__item">
|
||||
<ul>
|
||||
<li>НДФЛ (13% от зарплаты)</li>
|
||||
@ -80,11 +80,11 @@ export const CompanyInfo = () => {
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div className="companyInfo__info__total">
|
||||
<span className="companyInfo__info__total__title">
|
||||
<div className="company-info__info__total">
|
||||
<span className="company-info__info__total__title">
|
||||
В итоге у нас получается:
|
||||
</span>
|
||||
<div className="companyInfo__info__total__text">
|
||||
<div className="company-info__info__total__text">
|
||||
<p>
|
||||
Специалист с изначальной расценкой в 1 500 руб/ч с учетом всех
|
||||
остальных расходов
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
.companyInfo {
|
||||
.company-info {
|
||||
&__content {
|
||||
font-family: "LabGrotesque", sans-serif;
|
||||
background-color: #F1F1F1;
|
||||
background-color: #f1f1f1;
|
||||
padding-top: 60px;
|
||||
|
||||
@media (max-width: 1375px) {
|
||||
@ -18,7 +18,7 @@
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
span {
|
||||
color: #52B709;
|
||||
color: #52b709;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
@ -39,10 +39,10 @@
|
||||
}
|
||||
}
|
||||
|
||||
.arrowElement {
|
||||
.arrow-element {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
background-color: #D3E4BC;
|
||||
background-color: #d3e4bc;
|
||||
border-radius: 50px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
@ -53,7 +53,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.arrowDown {
|
||||
.arrow-down {
|
||||
margin: 35px auto 45px;
|
||||
img {
|
||||
transform: rotate(90deg);
|
||||
@ -118,7 +118,7 @@
|
||||
}
|
||||
|
||||
span {
|
||||
color: #52B709;
|
||||
color: #52b709;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
@ -145,7 +145,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
&__countingBlock {
|
||||
&__counting-block {
|
||||
padding: 27px 185px 26px 45px;
|
||||
border-radius: 12px;
|
||||
background: white;
|
||||
@ -190,13 +190,13 @@
|
||||
flex-direction: column;
|
||||
row-gap: 12px;
|
||||
|
||||
.titleBottom {
|
||||
.title-bottom {
|
||||
font-size: 21px;
|
||||
font-weight: 700;
|
||||
line-height: 48px;
|
||||
}
|
||||
|
||||
.subTitleBottom {
|
||||
.subtitle-bottom {
|
||||
color: #000000;
|
||||
font-weight: 500;
|
||||
font-size: 18px;
|
||||
@ -204,7 +204,7 @@
|
||||
}
|
||||
|
||||
span {
|
||||
color: #52B709;
|
||||
color: #52b709;
|
||||
}
|
||||
|
||||
@media (max-width: 780px) {
|
||||
@ -213,7 +213,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.countingBlock__info {
|
||||
.counting-block__info {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
row-gap: 12px;
|
||||
@ -223,7 +223,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.countingBlock {
|
||||
.counting-block {
|
||||
&__title {
|
||||
font-size: 18px;
|
||||
font-weight: 500;
|
||||
@ -232,13 +232,13 @@
|
||||
}
|
||||
|
||||
&__subTitle {
|
||||
color: #6F6F6F;
|
||||
color: #6f6f6f;
|
||||
font-size: 12px;
|
||||
line-height: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.countingBlockImg {
|
||||
.counting-block-img {
|
||||
position: absolute;
|
||||
right: -140px;
|
||||
top: -55px;
|
||||
|
||||
@ -1,60 +1,65 @@
|
||||
@import './../../assets/functions.scss';
|
||||
@import "./../../assets/functions.scss";
|
||||
|
||||
.frequently-asked-question {
|
||||
background: #f5f5f5;
|
||||
height: 100%;
|
||||
min-height: 100vh;
|
||||
font-family: "LabGrotesque", sans-serif;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@media (max-width: 1375px) {
|
||||
margin-top: 80px;
|
||||
}
|
||||
&__container {
|
||||
flex: 1 1 auto;
|
||||
margin-top: 30px;
|
||||
}
|
||||
&__title {
|
||||
font-weight: 500;
|
||||
@include adaptiv-value("font-size", 38, 24, 1);
|
||||
line-height: 84%;
|
||||
margin: 42px 0 30px 0;
|
||||
color: #000000;
|
||||
}
|
||||
&__back {
|
||||
margin: 0 0 30px 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
gap: 19px;
|
||||
p {
|
||||
font-size: 12px;
|
||||
line-height: 167%;
|
||||
color: #6f6f6f;
|
||||
}
|
||||
}
|
||||
&__arrow {
|
||||
background: rgba(141, 198, 63, 0.5098039216);
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
border-radius: 44px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
&__answer {
|
||||
font-weight: 400;
|
||||
font-size: 20px;
|
||||
line-height: 120%;
|
||||
background: #ffffff;
|
||||
border-radius: 12px;
|
||||
word-break: break-word;
|
||||
color: #000000;
|
||||
@include adaptiv-value("padding-top", 33, 15, 1);
|
||||
@include adaptiv-value("padding-bottom", 33, 15, 1);
|
||||
@include adaptiv-value("padding-left", 41, 22, 1);
|
||||
@include adaptiv-value("padding-right", 41, 22, 1);
|
||||
}
|
||||
}
|
||||
background: #f5f5f5;
|
||||
height: 100%;
|
||||
min-height: 100vh;
|
||||
font-family: "LabGrotesque", sans-serif;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
@media (max-width: 1375px) {
|
||||
margin-top: 80px;
|
||||
}
|
||||
|
||||
&__container {
|
||||
flex: 1 1 auto;
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
&__title {
|
||||
font-weight: 500;
|
||||
@include adaptiv-value("font-size", 38, 24, 1);
|
||||
line-height: 84%;
|
||||
margin: 42px 0 30px 0;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
&__back {
|
||||
margin: 0 0 30px 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
gap: 19px;
|
||||
p {
|
||||
font-size: 12px;
|
||||
line-height: 167%;
|
||||
color: #6f6f6f;
|
||||
}
|
||||
}
|
||||
|
||||
&__arrow {
|
||||
background: rgba(141, 198, 63, 0.5098039216);
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
border-radius: 44px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
&__answer {
|
||||
font-weight: 400;
|
||||
font-size: 20px;
|
||||
line-height: 120%;
|
||||
background: #ffffff;
|
||||
border-radius: 12px;
|
||||
word-break: break-word;
|
||||
color: #000000;
|
||||
@include adaptiv-value("padding-top", 33, 15, 1);
|
||||
@include adaptiv-value("padding-bottom", 33, 15, 1);
|
||||
@include adaptiv-value("padding-left", 41, 22, 1);
|
||||
@include adaptiv-value("padding-right", 41, 22, 1);
|
||||
}
|
||||
}
|
||||
|
||||
@ -5,32 +5,39 @@
|
||||
font-family: "LabGrotesque", sans-serif;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
@media (max-width: 1375px) {
|
||||
margin-top: 80px;
|
||||
}
|
||||
|
||||
&__container {
|
||||
flex: 1 1 auto;
|
||||
margin: 30px 0;
|
||||
}
|
||||
|
||||
&__about {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 30px 0;
|
||||
|
||||
@media (max-width: 600px) {
|
||||
flex-wrap: wrap;
|
||||
row-gap: 25px;
|
||||
}
|
||||
}
|
||||
|
||||
&__title {
|
||||
font-weight: 500;
|
||||
font-size: 48px;
|
||||
line-height: 67%;
|
||||
color: #000000;
|
||||
margin: 0 13px 0 0;
|
||||
|
||||
@media (max-width: 600px) {
|
||||
order: 1;
|
||||
}
|
||||
}
|
||||
|
||||
&__arrow {
|
||||
background: rgba(128, 119, 119, 0.3);
|
||||
flex: 0 0 27px;
|
||||
@ -40,10 +47,12 @@
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 0 24px 0 0;
|
||||
|
||||
@media (max-width: 600px) {
|
||||
order: 2;
|
||||
}
|
||||
}
|
||||
|
||||
&__description {
|
||||
font-weight: 400;
|
||||
font-size: 18px;
|
||||
@ -52,15 +61,16 @@
|
||||
color: #000000;
|
||||
white-space: pre-line;
|
||||
}
|
||||
|
||||
&__items {
|
||||
display: grid;
|
||||
grid-row-gap: 49px;
|
||||
grid-column-gap: 29px;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
|
||||
@media (max-width: 750px) {
|
||||
grid-template-columns: 1fr;
|
||||
grid-gap: 60px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -168,7 +168,7 @@ export const PartnerAddRequest = () => {
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="partnerAddRequest">
|
||||
<div className="partner-add-request">
|
||||
<ProfileHeader />
|
||||
<Navigation />
|
||||
<div className="container">
|
||||
@ -184,14 +184,14 @@ export const PartnerAddRequest = () => {
|
||||
}
|
||||
]}
|
||||
/>
|
||||
<h2 className="partnerAddRequest__title">
|
||||
<h2 className="partner-add-request__title">
|
||||
{editRequest
|
||||
? "Страница редактирования заявки"
|
||||
: "Страница добавления заявки"}
|
||||
</h2>
|
||||
<div className="partnerAddRequest__section">
|
||||
<div className="partnerAddRequest__form">
|
||||
<div className="partnerAddRequest__form__block form__block">
|
||||
<div className="partner-add-request__section">
|
||||
<div className="partner-add-request__form">
|
||||
<div className="partner-add-request__form__block form__block">
|
||||
<h3 className="form__block__title">Данные открытой позиции</h3>
|
||||
<div className="form__block__section">
|
||||
<h3>Название вакансии</h3>
|
||||
@ -326,7 +326,7 @@ export const PartnerAddRequest = () => {
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
<div className="partnerAddRequest__form__block form__block">
|
||||
<div className="partner-add-request__form__block form__block">
|
||||
<h3 className="form__block__title">Квалификация</h3>
|
||||
<div className="form__block__section">
|
||||
<h3>Выберите уровень знаний </h3>
|
||||
@ -421,9 +421,9 @@ export const PartnerAddRequest = () => {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="partnerAddRequest__info">
|
||||
<div className="partnerAddRequest__info__block">
|
||||
<div className="partnerAddRequest__info__block__title">
|
||||
<div className="partner-add-request__info">
|
||||
<div className="partner-add-request__info__block">
|
||||
<div className="partner-add-request__info__block__title">
|
||||
<img src={processImg} alt="process" />
|
||||
<h4>Процесс:</h4>
|
||||
</div>
|
||||
@ -436,8 +436,8 @@ export const PartnerAddRequest = () => {
|
||||
проекты и Git.
|
||||
</p>
|
||||
</div>
|
||||
<div className="partnerAddRequest__info__block">
|
||||
<div className="partnerAddRequest__info__block__title">
|
||||
<div className="partner-add-request__info__block">
|
||||
<div className="partner-add-request__info__block__title">
|
||||
<img src={reportImg} alt="reportImg" />
|
||||
<h4>Отчетность:</h4>
|
||||
</div>
|
||||
@ -452,8 +452,8 @@ export const PartnerAddRequest = () => {
|
||||
Можем выделить руководителя проекта и тестировщиков.
|
||||
</p>
|
||||
</div>
|
||||
<div className="partnerAddRequest__info__block">
|
||||
<div className="partnerAddRequest__info__block__title">
|
||||
<div className="partner-add-request__info__block">
|
||||
<div className="partner-add-request__info__block__title">
|
||||
<img src={documentsImg} alt="documentsImg" />
|
||||
<h4>
|
||||
Обмен <br />
|
||||
@ -462,7 +462,7 @@ export const PartnerAddRequest = () => {
|
||||
</div>
|
||||
<p>
|
||||
В Личном кабинете платформы получайте отчеты выполненных работ и
|
||||
счета на согласование и оплату
|
||||
счеты на согласование и оплату
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
.partnerAddRequest {
|
||||
background: #F1F1F1;
|
||||
.partner-add-request {
|
||||
background: #f1f1f1;
|
||||
height: 100%;
|
||||
min-height: 100vh;
|
||||
font-family: 'LabGrotesque', sans-serif;
|
||||
font-family: "LabGrotesque", sans-serif;
|
||||
|
||||
.container {
|
||||
max-width: 1160px;
|
||||
@ -17,7 +17,7 @@
|
||||
color: #000000;
|
||||
font-weight: 700;
|
||||
font-size: 22px;
|
||||
line-height: 32px
|
||||
line-height: 32px;
|
||||
}
|
||||
|
||||
&__section {
|
||||
@ -42,7 +42,7 @@
|
||||
}
|
||||
|
||||
.form__block {
|
||||
background: #FFFFFF;
|
||||
background: #ffffff;
|
||||
border-radius: 12px;
|
||||
padding: 25px 95px 30px 55px;
|
||||
min-width: 600px;
|
||||
@ -58,7 +58,7 @@
|
||||
font-weight: 700;
|
||||
font-size: 20px;
|
||||
line-height: 24px;
|
||||
color: #5B6871;
|
||||
color: #5b6871;
|
||||
margin-bottom: 35px;
|
||||
}
|
||||
|
||||
@ -79,7 +79,7 @@
|
||||
}
|
||||
|
||||
&__input {
|
||||
background: #EFF2F7;
|
||||
background: #eff2f7;
|
||||
border-radius: 8px;
|
||||
padding: 8px 12px;
|
||||
margin-bottom: 35px;
|
||||
@ -115,7 +115,7 @@
|
||||
|
||||
&__select {
|
||||
padding: 8px 15px 9px 12px;
|
||||
background: #EFF2F7;
|
||||
background: #eff2f7;
|
||||
border-radius: 12px;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
@ -140,7 +140,7 @@
|
||||
}
|
||||
|
||||
textarea {
|
||||
background: #EFF2F7;
|
||||
background: #eff2f7;
|
||||
border-radius: 8px;
|
||||
width: 100%;
|
||||
border: none;
|
||||
@ -177,9 +177,9 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border: 0.5px solid #8DC63F;
|
||||
border: 0.5px solid #8dc63f;
|
||||
border-radius: 44px;
|
||||
color: #6F6F6F;
|
||||
color: #6f6f6f;
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
line-height: 32px;
|
||||
@ -192,9 +192,9 @@
|
||||
}
|
||||
|
||||
&__save {
|
||||
background: #52B709;
|
||||
background: #52b709;
|
||||
border-radius: 44px;
|
||||
color: #FFFFFF;
|
||||
color: #ffffff;
|
||||
font-weight: 700;
|
||||
font-size: 14px;
|
||||
line-height: 32px;
|
||||
@ -210,14 +210,14 @@
|
||||
display: flex;
|
||||
gap: 5px;
|
||||
flex-wrap: wrap;
|
||||
background: #EFF2F7;
|
||||
background: #eff2f7;
|
||||
border-radius: 8px;
|
||||
padding: 8px 12px 9px;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
|
||||
.skill {
|
||||
background: #8DC63F;
|
||||
background: #8dc63f;
|
||||
border-radius: 12px;
|
||||
font-weight: 400;
|
||||
font-size: 12px;
|
||||
@ -304,7 +304,7 @@
|
||||
font-size: 12px;
|
||||
line-height: 14px;
|
||||
color: #263238;
|
||||
background: #8DC63F;
|
||||
background: #8dc63f;
|
||||
border-radius: 12px;
|
||||
padding: 5px;
|
||||
max-width: 100px;
|
||||
@ -319,7 +319,7 @@
|
||||
}
|
||||
|
||||
&__info {
|
||||
background: #FFFFFF;
|
||||
background: #ffffff;
|
||||
border-radius: 12px;
|
||||
width: 100%;
|
||||
padding: 74px 48px 136px 62px;
|
||||
@ -350,7 +350,7 @@
|
||||
}
|
||||
|
||||
h4 {
|
||||
color: #5B6871;
|
||||
color: #5b6871;
|
||||
font-weight: 700;
|
||||
font-size: 20px;
|
||||
line-height: 24px;
|
||||
@ -367,7 +367,7 @@
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
.partnerAddRequest__info__block__title {
|
||||
.partner-add-request__info__block__title {
|
||||
margin-bottom: 35px;
|
||||
}
|
||||
}
|
||||
|
||||
@ -74,7 +74,7 @@ export const PartnerBid = () => {
|
||||
4: "Senior"
|
||||
});
|
||||
return (
|
||||
<div className="partnerBid">
|
||||
<div className="partner-bid">
|
||||
<ProfileHeader />
|
||||
<Navigation />
|
||||
<ModalLayout active={modalDelete} setActive={setModalDelete}>
|
||||
@ -110,13 +110,13 @@ export const PartnerBid = () => {
|
||||
{ name: "Просмотр заявки - PHP разработчик", link: "/profile/bid" }
|
||||
]}
|
||||
/>
|
||||
<h2 className="partnerBid__title">Страница заявки </h2>
|
||||
<h2 className="partner-bid__title">Страница заявки </h2>
|
||||
{loader && <Loader />}
|
||||
{!loader && (
|
||||
<>
|
||||
<div className="partnerBid__qualification">
|
||||
<div className="partner-bid__qualification">
|
||||
<h3>{requestInfo.title}</h3>
|
||||
<div className="partnerBid__qualification__buttons">
|
||||
<div className="partner-bid__qualification__buttons">
|
||||
<Link to="/profile/edit-request">Редактировать</Link>
|
||||
<img
|
||||
src={deleteBtn}
|
||||
@ -125,14 +125,14 @@ export const PartnerBid = () => {
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="partnerBid__switcher">
|
||||
<div className="partner-bid__switcher">
|
||||
<div
|
||||
className={
|
||||
partnerRequests[
|
||||
partnerRequests.findIndex((el) => el.id === requestId) - 1
|
||||
]?.id
|
||||
? "partnerBid__switcher__prev switchDate"
|
||||
: "partnerBid__switcher__prev switchDate disable"
|
||||
? "partner-bid__switcher__prev switch-date"
|
||||
: "partner-bid__switcher__prev switch-date disable"
|
||||
}
|
||||
onClick={() => {
|
||||
dispatch(
|
||||
@ -153,8 +153,8 @@ export const PartnerBid = () => {
|
||||
partnerRequests[
|
||||
partnerRequests.findIndex((el) => el.id === requestId) + 1
|
||||
]?.id
|
||||
? "partnerBid__switcher__next switchDate"
|
||||
: "partnerBid__switcher__next switchDate disable"
|
||||
? "partner-bid__switcher__next switch-date"
|
||||
: "partner-bid__switcher__next switch-date disable"
|
||||
}
|
||||
onClick={() => {
|
||||
dispatch(
|
||||
@ -229,22 +229,25 @@ export const PartnerBid = () => {
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div className="partnerBid__suitable">
|
||||
<div className="partnerBid__suitable__title">
|
||||
<div className="partner-bid__suitable">
|
||||
<div className="partner-bid__suitable__title">
|
||||
<p>Подходящие сотрудники по запросу</p>
|
||||
</div>
|
||||
<div className="partnerBid__suitable__persons">
|
||||
<div className="partner-bid__suitable__persons">
|
||||
{requestInfo.result_profiles.length &&
|
||||
requestInfo.result_profiles.map((person, index) => {
|
||||
return (
|
||||
<div key={index} className="partnerBid__suitable__person">
|
||||
<div
|
||||
key={index}
|
||||
className="partner-bid__suitable__person"
|
||||
>
|
||||
<img src={urlForLocal(person.photo)} alt="avatar" />
|
||||
<p>
|
||||
{person.fio} - {person.position_title},{" "}
|
||||
{levels[person.level]}
|
||||
</p>
|
||||
<Link
|
||||
className="partnerBid__suitable__person__more"
|
||||
className="partner-bid__suitable__person__more"
|
||||
to={`/candidate/${person.id}`}
|
||||
>
|
||||
Подробнее
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
.partnerBid {
|
||||
.partner-bid {
|
||||
background: #f1f1f1;
|
||||
height: 100%;
|
||||
min-height: 100vh;
|
||||
@ -78,7 +78,7 @@
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.switchDate {
|
||||
.switch-date {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
background: #8dc63f;
|
||||
|
||||
@ -73,7 +73,7 @@ export const PartnerEmployeeReport = () => {
|
||||
}, [requestDates]);
|
||||
|
||||
return (
|
||||
<div className="employeeReport">
|
||||
<div className="employee-report">
|
||||
<ProfileHeader />
|
||||
<Navigation />
|
||||
<div className="container">
|
||||
@ -84,30 +84,30 @@ export const PartnerEmployeeReport = () => {
|
||||
]}
|
||||
/>
|
||||
{!Object.keys(userInfo).length ? (
|
||||
<div className="employeeReport__loader">
|
||||
<div className="employee-report__loader">
|
||||
<Loader style={"green"} height={80} width={80} />
|
||||
</div>
|
||||
) : (
|
||||
<>
|
||||
<div className="employeeReport__info">
|
||||
<div className="employeeReport__name">
|
||||
<div className="employee-report__info">
|
||||
<div className="employee-report__name">
|
||||
<h2>{userInfo.fio}</h2>
|
||||
<p>{userInfo.position}</p>
|
||||
</div>
|
||||
<div className="employeeReport__skills">
|
||||
<div className="employee-report__skills">
|
||||
{userInfo?.stack &&
|
||||
userInfo.stack.map((skill, index) => {
|
||||
return <span key={index}>{skill}</span>;
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
<div className="employeeReport__wrapper">
|
||||
<div className="employee-report__wrapper">
|
||||
{loader ? (
|
||||
<div className="employeeReport__loader">
|
||||
<div className="employee-report__loader">
|
||||
<Loader style={"green"} height={80} width={80} />
|
||||
</div>
|
||||
) : (
|
||||
<div className="employeeReport__calendar ">
|
||||
<div className="employee-report__calendar ">
|
||||
<ProfileCalendarComponent
|
||||
userId={params.uuid}
|
||||
setValueHandler={(value) => setValue(value)}
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
.employeeReport {
|
||||
background: #F1F1F1;
|
||||
.employee-report {
|
||||
background: #f1f1f1;
|
||||
height: 100%;
|
||||
min-height: 100vh;
|
||||
font-family: "LabGrotesque", sans-serif;
|
||||
@ -42,7 +42,7 @@
|
||||
font-size: 12px;
|
||||
line-height: 14px;
|
||||
color: #263238;
|
||||
background: #8DC63F;
|
||||
background: #8dc63f;
|
||||
border-radius: 12px;
|
||||
padding: 5px;
|
||||
max-width: 130px;
|
||||
|
||||
@ -23,7 +23,7 @@ export const PartnerEmployees = () => {
|
||||
return <Navigate to="/profile/categories" replace />;
|
||||
}
|
||||
return (
|
||||
<div className="partnerEmployees">
|
||||
<div className="partner-employees">
|
||||
<ProfileHeader />
|
||||
<Navigation />
|
||||
<div className="container">
|
||||
@ -37,17 +37,17 @@ export const PartnerEmployees = () => {
|
||||
}
|
||||
]}
|
||||
/>
|
||||
<h2 className="partnerEmployees__title">Backend разработчики</h2>
|
||||
<div className="partnerEmployees__items">
|
||||
<h2 className="partner-employees__title">Backend разработчики</h2>
|
||||
<div className="partner-employees__items">
|
||||
{partnerEmployees.map((person) => {
|
||||
return (
|
||||
<div className="partnerEmployees__item" key={person.id}>
|
||||
<div className="partnerEmployees__item__name">
|
||||
<div className="partner-employees__item" key={person.id}>
|
||||
<div className="partner-employees__item__name">
|
||||
<img src={person.personAvatar} alt="avatar" />
|
||||
<h4>{person.name}</h4>
|
||||
</div>
|
||||
<div className="partnerEmployees__item__info">
|
||||
<div className="partnerEmployees__item__info__qualification">
|
||||
<div className="partner-employees__item__info">
|
||||
<div className="partner-employees__item__info__qualification">
|
||||
<h5>{person.qualification}</h5>
|
||||
<span>{person.level}</span>
|
||||
<div className="info_summary">
|
||||
@ -58,10 +58,10 @@ export const PartnerEmployees = () => {
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
<div className="partnerEmployees__item__info__project">
|
||||
<div className="partner-employees__item__info__project">
|
||||
<span className="name">Проект:</span>
|
||||
<h5>{person.project}</h5>
|
||||
<div className="partnerEmployees__item__info__project__details">
|
||||
<div className="partner-employees__item__info__project__details">
|
||||
<div className="details__item">
|
||||
<p>Открытые задачи</p>
|
||||
<span className="count">
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
.partnerEmployees {
|
||||
background: #F1F1F1;
|
||||
.partner-employees {
|
||||
background: #f1f1f1;
|
||||
height: 100%;
|
||||
min-height: 100vh;
|
||||
font-family: 'LabGrotesque', sans-serif;
|
||||
font-family: "LabGrotesque", sans-serif;
|
||||
|
||||
&__title {
|
||||
color: #000000;
|
||||
@ -19,13 +19,13 @@
|
||||
}
|
||||
|
||||
&__item {
|
||||
background: #E1FCCF;
|
||||
background: #e1fccf;
|
||||
border-radius: 12px;
|
||||
display: flex;
|
||||
position: relative;
|
||||
|
||||
&__name {
|
||||
background: #FFFFFF;
|
||||
background: #ffffff;
|
||||
border-radius: 12px;
|
||||
padding: 25px 22px 25px;
|
||||
display: flex;
|
||||
@ -57,9 +57,9 @@
|
||||
justify-content: space-between;
|
||||
|
||||
&:after {
|
||||
content: '';
|
||||
content: "";
|
||||
position: absolute;
|
||||
background: #52B709;
|
||||
background: #52b709;
|
||||
border-radius: 12px;
|
||||
height: 4px;
|
||||
width: 51%;
|
||||
@ -80,7 +80,7 @@
|
||||
}
|
||||
|
||||
span {
|
||||
color: #6F6F6F;
|
||||
color: #6f6f6f;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
}
|
||||
@ -102,7 +102,7 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: #FFFFFF;
|
||||
background: #ffffff;
|
||||
border-radius: 50px;
|
||||
width: 41px;
|
||||
height: 41px;
|
||||
@ -135,7 +135,7 @@
|
||||
|
||||
p {
|
||||
margin-bottom: 0;
|
||||
color: #6F6F6F;
|
||||
color: #6f6f6f;
|
||||
font-weight: 500;
|
||||
font-size: 13px;
|
||||
line-height: 24px;
|
||||
@ -153,12 +153,12 @@
|
||||
justify-content: center;
|
||||
margin-left: 8px;
|
||||
padding: 0 6px;
|
||||
background: #DDDDDD;
|
||||
background: #dddddd;
|
||||
border-radius: 4px;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
line-height: 24px;
|
||||
color: #6F6F6F;
|
||||
color: #6f6f6f;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -166,7 +166,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.container {
|
||||
max-width: 1160px;
|
||||
margin-top: 23px;
|
||||
|
||||
@ -41,7 +41,7 @@ export const PartnerRequests = () => {
|
||||
});
|
||||
}, []);
|
||||
return (
|
||||
<div className="partnerRequests">
|
||||
<div className="partner-requests">
|
||||
<ProfileHeader />
|
||||
<Navigation />
|
||||
<div className="container">
|
||||
@ -51,26 +51,26 @@ export const PartnerRequests = () => {
|
||||
{ name: "Запросы и открытые позиции", link: "/profile/requests" }
|
||||
]}
|
||||
/>
|
||||
<h2 className="partnerRequests__title">Запросы</h2>
|
||||
<h2 className="partner-requests__title">Запросы</h2>
|
||||
{loader && <Loader />}
|
||||
{Boolean(requests.length) && !loader && (
|
||||
<div className="partnerRequests__section">
|
||||
<div className="partnerRequests__section__items">
|
||||
<div className="partner-requests__section">
|
||||
<div className="partner-requests__section__items">
|
||||
{requests.map((item, index) => {
|
||||
return (
|
||||
<Link
|
||||
key={index}
|
||||
to={"/profile/bid"}
|
||||
className="partnerRequests__section__item"
|
||||
className="partner-requests__section__item"
|
||||
onClick={() => {
|
||||
dispatch(setPartnerRequestId(item.id));
|
||||
dispatch(setPartnerRequests(requests));
|
||||
}}
|
||||
>
|
||||
<p className="partnerRequests__section__item__name">
|
||||
<p className="partner-requests__section__item__name">
|
||||
{item.position.name}
|
||||
</p>
|
||||
<p className="partnerRequests__section__item__count">
|
||||
<p className="partner-requests__section__item__count">
|
||||
Подходящие кандидаты
|
||||
<span>{item.result_count}</span>
|
||||
</p>
|
||||
@ -78,11 +78,11 @@ export const PartnerRequests = () => {
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
<div className="partnerRequests__section__info">
|
||||
<h3>Инструкция: подачи заявки</h3>
|
||||
<div className="partner-requests__section__info">
|
||||
<h3>Инструкция по подаче заявки</h3>
|
||||
<p>
|
||||
Оператор компании заводит заявку и указывает необходимые
|
||||
параметры — количество сотрудников, стек, уровень специалиста
|
||||
Оператор компании создает заявку и указывает необходимые
|
||||
параметры: количество сотрудников, стек, уровень специалиста
|
||||
</p>
|
||||
<BaseButton>
|
||||
<Link to={"/profile/add-request"}>
|
||||
@ -94,9 +94,9 @@ export const PartnerRequests = () => {
|
||||
</div>
|
||||
)}
|
||||
{!Boolean(requests.length) && !loader && (
|
||||
<div className="partnerRequests__noItems">
|
||||
<div className="partnerRequests__noItems__create">
|
||||
<div className="partnerRequests__noItems__create__link">
|
||||
<div className="partner-requests__no-items">
|
||||
<div className="partner-requests__no-items__create">
|
||||
<div className="partner-requests__no-items__create__link">
|
||||
<img src={cursorImg} alt="cursor" />
|
||||
<p>У вас ещё нет запросов на сотрудников</p>
|
||||
<BaseButton>
|
||||
@ -106,20 +106,20 @@ export const PartnerRequests = () => {
|
||||
</Link>
|
||||
</BaseButton>
|
||||
</div>
|
||||
<div className="partnerRequests__noItems__create__instruction">
|
||||
<h3>Инструкция: подачи заявки</h3>
|
||||
<div className="partner-requests__no-items__create__instruction">
|
||||
<h3>Инструкция по подаче заявки</h3>
|
||||
<p>
|
||||
Оператор компании заводит заявку и указывает необходимые
|
||||
параметры — количество сотрудников, стек, уровень специалиста
|
||||
Оператор компании создает заявку и указывает необходимые
|
||||
параметры: количество сотрудников, стек, уровень специалиста
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="partnerRequests__noItems__freeEmployees">
|
||||
<div className="partner-requests__no-items__free-employees">
|
||||
<SliderWorkers
|
||||
title={"Свободные разработчики"}
|
||||
titleInfo={"в нашей базе"}
|
||||
/>
|
||||
<p className="catalogLink">
|
||||
<p className="catalog-link">
|
||||
Перейти в полный <Link to={"/profile/catalog"}>КАТАЛОГ</Link>{" "}
|
||||
сотрудников
|
||||
</p>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
.partnerRequests {
|
||||
.partner-requests {
|
||||
background: #f1f1f1;
|
||||
height: 100%;
|
||||
min-height: 100vh;
|
||||
@ -189,7 +189,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
&__noItems {
|
||||
&__no-items {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
@ -330,14 +330,14 @@
|
||||
}
|
||||
}
|
||||
|
||||
&__freeEmployees {
|
||||
&__free-employees {
|
||||
h2 {
|
||||
font-weight: 500;
|
||||
font-size: 30px;
|
||||
line-height: 32px;
|
||||
}
|
||||
|
||||
.catalogLink {
|
||||
.catalog-link {
|
||||
margin-top: 70px;
|
||||
width: 100%;
|
||||
font-weight: 700;
|
||||
|
||||
@ -120,7 +120,7 @@ export const PartnerSettings = () => {
|
||||
</div>
|
||||
|
||||
<p className="settings__label">Изменение пароля</p>
|
||||
<div className="settings__input oldPassword">
|
||||
<div className="settings__input old-password">
|
||||
<input
|
||||
className={inputsError.password ? "warning" : ""}
|
||||
placeholder="Старый пароль"
|
||||
|
||||
@ -54,7 +54,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.oldPassword {
|
||||
.old-password {
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
|
||||
|
||||
@ -31,10 +31,10 @@ export const PartnerTreaties = () => {
|
||||
<ProfileBreadcrumbs
|
||||
links={[
|
||||
{ name: "Главная", link: "/profile" },
|
||||
{ name: "Договора и отчетность", link: "/profile/treaties" }
|
||||
{ name: "Договоры и отчетность", link: "/profile/treaties" }
|
||||
]}
|
||||
/>
|
||||
<h2 className="treaties__title">Договора и отчетность</h2>
|
||||
<h2 className="treaties__title">Договоры и отчетность</h2>
|
||||
<div className="treaties__tabs">
|
||||
<div className="treaties__tabs__head">
|
||||
<div
|
||||
@ -56,7 +56,7 @@ export const PartnerTreaties = () => {
|
||||
onClick={() => toggleTabs(3)}
|
||||
>
|
||||
<img src={checkImg} alt="img" />
|
||||
<p>Счета</p>
|
||||
<p>Счеты</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="treaties__tabs__content">
|
||||
@ -73,7 +73,7 @@ export const PartnerTreaties = () => {
|
||||
<img src={arrowDown} alt="arrow" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="treaties__tabs__content__main__item item notPaid">
|
||||
<div className="treaties__tabs__content__main__item item not-paid">
|
||||
<div className="item__info">
|
||||
<p className="number">
|
||||
Договор № К-1-2022
|
||||
@ -166,7 +166,7 @@ export const PartnerTreaties = () => {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="treaties__tabs__content__main__item item notPaid">
|
||||
<div className="treaties__tabs__content__main__item item not-paid">
|
||||
<div className="item__info">
|
||||
<p className="number">Акт №4 от 10.03.23</p>
|
||||
<div className="item__person__act">
|
||||
@ -179,11 +179,11 @@ export const PartnerTreaties = () => {
|
||||
</div>
|
||||
</div>
|
||||
<img
|
||||
className="personArrow"
|
||||
className="person-arrow"
|
||||
src={arrowItem}
|
||||
alt="arrow"
|
||||
/>
|
||||
<p className="moreInfo">к Доп. соглашению № 1</p>
|
||||
<p className="more-info">к Доп. соглашению № 1</p>
|
||||
</div>
|
||||
<div className="arrow">
|
||||
<img src={arrowDown} alt="arrow" />
|
||||
@ -225,11 +225,11 @@ export const PartnerTreaties = () => {
|
||||
</div>
|
||||
</div>
|
||||
<img
|
||||
className="personArrow"
|
||||
className="person-arrow"
|
||||
src={arrowItem}
|
||||
alt="arrow"
|
||||
/>
|
||||
<p className="moreInfo">к Доп. соглашению № 1</p>
|
||||
<p className="more-info">к Доп. соглашению № 1</p>
|
||||
</div>
|
||||
<div className="arrow">
|
||||
<img src={arrowDown} alt="arrow" />
|
||||
@ -278,7 +278,7 @@ export const PartnerTreaties = () => {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="treaties__tabs__content__main__item item notPaid">
|
||||
<div className="treaties__tabs__content__main__item item not-paid">
|
||||
<div className="item__info">
|
||||
<p className="number">Акт №4 от 10.03.23</p>
|
||||
<div className="item__person__act">
|
||||
@ -291,11 +291,11 @@ export const PartnerTreaties = () => {
|
||||
</div>
|
||||
</div>
|
||||
<img
|
||||
className="personArrow"
|
||||
className="person-arrow"
|
||||
src={arrowItem}
|
||||
alt="arrow"
|
||||
/>
|
||||
<p className="moreInfo">к Доп. соглашению № 1</p>
|
||||
<p className="more-info">к Доп. соглашению № 1</p>
|
||||
</div>
|
||||
<div className="arrow">
|
||||
<img src={arrowDown} alt="arrow" />
|
||||
@ -337,11 +337,11 @@ export const PartnerTreaties = () => {
|
||||
</div>
|
||||
</div>
|
||||
<img
|
||||
className="personArrow"
|
||||
className="person-arrow"
|
||||
src={arrowItem}
|
||||
alt="arrow"
|
||||
/>
|
||||
<p className="moreInfo">к Доп. соглашению № 1</p>
|
||||
<p className="more-info">к Доп. соглашению № 1</p>
|
||||
</div>
|
||||
<div className="arrow">
|
||||
<img src={arrowDown} alt="arrow" />
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
.treaties {
|
||||
background: #F1F1F1;
|
||||
background: #f1f1f1;
|
||||
height: 100%;
|
||||
min-height: 100vh;
|
||||
font-family: 'LabGrotesque', sans-serif;
|
||||
font-family: "LabGrotesque", sans-serif;
|
||||
|
||||
&__title {
|
||||
font-weight: 700;
|
||||
@ -43,7 +43,7 @@
|
||||
width: calc(100% - 150px);
|
||||
|
||||
&__main {
|
||||
background: #FFFFFF;
|
||||
background: #ffffff;
|
||||
border-radius: 0 12px 12px 12px;
|
||||
flex-wrap: wrap;
|
||||
column-gap: 34px;
|
||||
@ -69,7 +69,7 @@
|
||||
.img {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
background: #E2E5CF;
|
||||
background: #e2e5cf;
|
||||
border-radius: 50px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -101,8 +101,8 @@
|
||||
}
|
||||
}
|
||||
|
||||
.notPaid {
|
||||
background: #EBEBEB;
|
||||
.not-paid {
|
||||
background: #ebebeb;
|
||||
}
|
||||
|
||||
.persons {
|
||||
@ -137,7 +137,7 @@
|
||||
.img {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
background: #CFE0B8;
|
||||
background: #cfe0b8;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
@ -215,7 +215,7 @@
|
||||
align-items: center;
|
||||
|
||||
.arrow {
|
||||
background: #CFE0B8;
|
||||
background: #cfe0b8;
|
||||
border-radius: 50px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -229,12 +229,12 @@
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.personArrow {
|
||||
.person-arrow {
|
||||
margin-top: 20px;
|
||||
max-width: 125px;
|
||||
}
|
||||
|
||||
.moreInfo {
|
||||
.more-info {
|
||||
font-weight: 300;
|
||||
font-size: 10px;
|
||||
line-height: 17px;
|
||||
@ -321,7 +321,7 @@
|
||||
display: flex;
|
||||
|
||||
p {
|
||||
color: #A29EB6;
|
||||
color: #a29eb6;
|
||||
}
|
||||
}
|
||||
|
||||
@ -347,7 +347,7 @@
|
||||
}
|
||||
|
||||
.total {
|
||||
color: #1458DD;
|
||||
color: #1458dd;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -377,7 +377,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.container {
|
||||
max-width: 1160px;
|
||||
margin-top: 23px;
|
||||
|
||||
@ -146,7 +146,7 @@ export const PartnerCategories = () => {
|
||||
// }
|
||||
// ]);
|
||||
return (
|
||||
<div className="partnerCategories">
|
||||
<div className="partner-categories">
|
||||
<ProfileHeader />
|
||||
<Navigation />
|
||||
<div className="container">
|
||||
@ -156,11 +156,11 @@ export const PartnerCategories = () => {
|
||||
{ name: "Данные моего персонала", link: "/profile/employees" }
|
||||
]}
|
||||
/>
|
||||
<h2 className="partnerCategories__title">Данные персонала</h2>
|
||||
<h2 className="partner-categories__title">Данные персонала</h2>
|
||||
{loader ? (
|
||||
<Loader style={"green"} height={80} width={80} />
|
||||
) : (
|
||||
<div className="partnerCategories__items">
|
||||
<div className="partner-categories__items">
|
||||
{Boolean(staff) ? (
|
||||
staff.map((card) => {
|
||||
return (
|
||||
@ -173,7 +173,7 @@ export const PartnerCategories = () => {
|
||||
);
|
||||
})
|
||||
) : (
|
||||
<span className="partnerCategories__empty">
|
||||
<span className="partner-categories__empty">
|
||||
У вас нет нанятого персонала
|
||||
</span>
|
||||
)}
|
||||
@ -184,8 +184,8 @@ export const PartnerCategories = () => {
|
||||
{/* key={index}*/}
|
||||
{/* className={*/}
|
||||
{/* item.available*/}
|
||||
{/* ? "partnerCategories__item item"*/}
|
||||
{/* : "partnerCategories__item item item__disable"*/}
|
||||
{/* ? "partner-categories__item item"*/}
|
||||
{/* : "partner-categories__item item item__disable"*/}
|
||||
{/* }*/}
|
||||
{/* onClick={() => {*/}
|
||||
{/* dispatch(setPartnerEmployees(mokPersons));*/}
|
||||
@ -202,7 +202,7 @@ export const PartnerCategories = () => {
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/* {!item.available && (*/}
|
||||
{/* <div className="item__disableHover">*/}
|
||||
{/* <div className="item__disable-hover">*/}
|
||||
{/* <p>У вас нет персонала из категории</p>*/}
|
||||
{/* <button>Подобрать</button>*/}
|
||||
{/* </div>*/}
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
.partnerCategories {
|
||||
background: #F1F1F1;
|
||||
.partner-categories {
|
||||
background: #f1f1f1;
|
||||
height: 100%;
|
||||
min-height: 100vh;
|
||||
font-family: 'LabGrotesque', sans-serif;
|
||||
font-family: "LabGrotesque", sans-serif;
|
||||
|
||||
&__title {
|
||||
color: #000000;
|
||||
@ -15,25 +15,20 @@
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
flex-wrap: wrap;
|
||||
//flex-wrap: wrap;
|
||||
//margin-top: 25px;
|
||||
//row-gap: 24px;
|
||||
//column-gap: 21px;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
&__empty {
|
||||
font-size: 18px;
|
||||
font-weight: 500;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
|
||||
.item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 33px 32px 25px 28px;
|
||||
width: 32%;
|
||||
background: #FFFFFF;
|
||||
background: #ffffff;
|
||||
border-radius: 12px;
|
||||
transition: all 0.3s ease;
|
||||
position: relative;
|
||||
@ -65,12 +60,12 @@
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.item__disableHover {
|
||||
.item__disable-hover {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
&Hover {
|
||||
&-hover {
|
||||
position: absolute;
|
||||
display: flex;
|
||||
left: 0;
|
||||
@ -78,7 +73,7 @@
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 16px 13px 16px 21px;
|
||||
border: 3px solid #52B709;
|
||||
border: 3px solid #52b709;
|
||||
bottom: 0;
|
||||
border-radius: 12px;
|
||||
opacity: 0;
|
||||
@ -97,12 +92,12 @@
|
||||
width: 140px;
|
||||
height: 50px;
|
||||
border: none;
|
||||
background: #52B709;
|
||||
background: #52b709;
|
||||
border-radius: 44px;
|
||||
font-weight: 500;
|
||||
font-size: 15px;
|
||||
line-height: 32px;
|
||||
color: #FFFFFF;
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -130,7 +125,7 @@
|
||||
p {
|
||||
max-width: 181px;
|
||||
margin-bottom: 0;
|
||||
color: #6F6F6F;
|
||||
color: #6f6f6f;
|
||||
font-weight: 400;
|
||||
font-size: 12px;
|
||||
line-height: 20px;
|
||||
@ -142,13 +137,12 @@
|
||||
justify-content: center;
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
background: #DDEEC6;
|
||||
background: #ddeec6;
|
||||
border-radius: 50px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.container {
|
||||
max-width: 1160px;
|
||||
margin-top: 23px;
|
||||
|
||||
@ -81,7 +81,7 @@ export const Profile = () => {
|
||||
{
|
||||
path: "profile/treaties",
|
||||
img: paymentIcon,
|
||||
title: "Договора и отчетность",
|
||||
title: "Договоры и отчетность",
|
||||
description: "Ключевые условия<br/> договора"
|
||||
},
|
||||
{
|
||||
|
||||
@ -1,3 +1,4 @@
|
||||
import moment from "moment";
|
||||
import React, { useEffect, useRef, useState } from "react";
|
||||
import { HexColorPicker } from "react-colorful";
|
||||
import { useDispatch, useSelector } from "react-redux";
|
||||
@ -44,6 +45,7 @@ import TrackerSelectColumn from "@components/TrackerSelectColumn/TrackerSelectCo
|
||||
import arrow from "assets/icons/arrows/arrowCalendar.png";
|
||||
import arrowDown from "assets/icons/arrows/selectArrow.png";
|
||||
import calendarIcon from "assets/icons/calendar.svg";
|
||||
import category from "assets/icons/category.svg";
|
||||
import close from "assets/icons/close.png";
|
||||
import commentsBoard from "assets/icons/commentsBoard.svg";
|
||||
import del from "assets/icons/delete.svg";
|
||||
@ -62,6 +64,7 @@ export const ProjectTracker = () => {
|
||||
const dispatch = useDispatch();
|
||||
const projectId = useParams();
|
||||
|
||||
const currentDate = new Date().getFullYear();
|
||||
const [openColumnSelect, setOpenColumnSelect] = useState({});
|
||||
const [selectedTab, setSelectedTab] = useState(0);
|
||||
const [priorityTask, setPriorityTask] = useState(0);
|
||||
@ -383,7 +386,7 @@ export const ProjectTracker = () => {
|
||||
(div) =>
|
||||
div.classList &&
|
||||
(div.classList.contains("tasks__head__executor") ||
|
||||
div.classList.contains("tasks__head__executorDropdown"))
|
||||
div.classList.contains("tasks__head__executor-dropdown"))
|
||||
)
|
||||
) {
|
||||
setSelectedExecutorOpen(false);
|
||||
@ -483,8 +486,10 @@ export const ProjectTracker = () => {
|
||||
<div className="tracker__tabs__content__tasks tasks active__content">
|
||||
<div className="tasks__head">
|
||||
<div className="tasks__head__wrapper">
|
||||
<h5>{projectBoard.name}</h5>
|
||||
|
||||
<div className="tasks__head__title">
|
||||
<img src={category}></img>
|
||||
<h5>{projectBoard.name}</h5>
|
||||
</div>
|
||||
<div className="tasks__head__add">
|
||||
<BaseButton
|
||||
onClick={() => {
|
||||
@ -509,8 +514,8 @@ export const ProjectTracker = () => {
|
||||
<div
|
||||
className={
|
||||
projectBoard.projectUsers?.length == 1
|
||||
? "onePerson"
|
||||
: "projectPersons"
|
||||
? "one-person"
|
||||
: "project-persons"
|
||||
}
|
||||
>
|
||||
{projectBoard.projectUsers.slice(0, 3).map((person) => {
|
||||
@ -529,7 +534,7 @@ export const ProjectTracker = () => {
|
||||
</div>
|
||||
)}
|
||||
{projectBoard.projectUsers?.length > 3 && (
|
||||
<span className="countPersons">
|
||||
<span className="count-persons">
|
||||
+{projectBoard.projectUsers?.length - 3}
|
||||
</span>
|
||||
)}
|
||||
@ -541,7 +546,6 @@ export const ProjectTracker = () => {
|
||||
>
|
||||
+
|
||||
</span>
|
||||
<p>добавить участника</p>
|
||||
|
||||
<ListEmployees
|
||||
active={personListOpen}
|
||||
@ -568,7 +572,7 @@ export const ProjectTracker = () => {
|
||||
</div>
|
||||
</div>
|
||||
{selectedExecutor ? (
|
||||
<div className="tasks__head__executorSelected">
|
||||
<div className="tasks__head__executor-selected">
|
||||
<p>{selectedExecutor.user.fio}</p>
|
||||
<img
|
||||
className="avatar"
|
||||
@ -600,11 +604,11 @@ export const ProjectTracker = () => {
|
||||
alt="arrow"
|
||||
/>
|
||||
{selectExecutorOpen && (
|
||||
<div className="tasks__head__executorDropdown">
|
||||
<div className="tasks__head__executor-dropdown">
|
||||
{projectBoard.projectUsers.map((user) => {
|
||||
return (
|
||||
<div
|
||||
className="executorDropdown__person"
|
||||
className="executor-dropdown__person"
|
||||
key={user.user_id}
|
||||
onClick={() => executorFilter(user)}
|
||||
>
|
||||
@ -635,91 +639,80 @@ export const ProjectTracker = () => {
|
||||
}}
|
||||
>
|
||||
<p>Список тегов</p>
|
||||
<span>+</span>
|
||||
<img
|
||||
className={tags.open ? "open" : ""}
|
||||
src={arrowDown}
|
||||
alt="arrow"
|
||||
/>
|
||||
</div>
|
||||
{tags.open && (
|
||||
<div className="tags__list">
|
||||
<div
|
||||
className="addNewTag"
|
||||
onClick={() =>
|
||||
setTags((prevState) => ({
|
||||
...prevState,
|
||||
add: true
|
||||
}))
|
||||
}
|
||||
>
|
||||
<p>Добавить новый тег</p>
|
||||
<span>+</span>
|
||||
</div>
|
||||
|
||||
{!tags.add && !tags.edit && (
|
||||
<div
|
||||
className="add-new-tag"
|
||||
onClick={() =>
|
||||
setTags((prevState) => ({
|
||||
...prevState,
|
||||
add: true
|
||||
}))
|
||||
}
|
||||
>
|
||||
<p>Добавить новый тег</p>
|
||||
<span>+</span>
|
||||
</div>
|
||||
)}
|
||||
{!tags.add && !tags.edit && (
|
||||
<div className="tags__list__created">
|
||||
{projectBoard.mark.map((tag) => {
|
||||
return (
|
||||
<div className="tagItem" key={tag.id}>
|
||||
<p className="tagItem__description">
|
||||
{tag.title}
|
||||
</p>
|
||||
<div className="tagItem__info">
|
||||
<span className="tagItem__info__name">
|
||||
{tag.slug}
|
||||
</span>
|
||||
<div className="tag-item" key={tag.id}>
|
||||
<div className="tag-item__info">
|
||||
<span
|
||||
className="tagItem__info__color"
|
||||
className="tag-item__color"
|
||||
style={{ background: tag.color }}
|
||||
/>
|
||||
|
||||
<div className="tagItem__info__images">
|
||||
<img
|
||||
src={edit}
|
||||
alt="edit"
|
||||
onClick={() => {
|
||||
setTags((prevState) => ({
|
||||
...prevState,
|
||||
edit: true
|
||||
}));
|
||||
setTagInfo({
|
||||
description: tag.title,
|
||||
name: tag.slug,
|
||||
editMarkId: tag.id
|
||||
});
|
||||
setColor(tag.color);
|
||||
}}
|
||||
/>
|
||||
<img
|
||||
onClick={() => deleteTag(tag.id)}
|
||||
className="delete"
|
||||
src={close}
|
||||
alt="delete"
|
||||
/>
|
||||
<div>
|
||||
<span className="tag-item__info__name">
|
||||
{tag.slug}
|
||||
</span>
|
||||
<p className="tag-item__description">
|
||||
{tag.title}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="tag-item__images">
|
||||
<img
|
||||
src={edit}
|
||||
alt="edit"
|
||||
onClick={() => {
|
||||
setTags((prevState) => ({
|
||||
...prevState,
|
||||
edit: true
|
||||
}));
|
||||
setTagInfo({
|
||||
description: tag.title,
|
||||
name: tag.slug,
|
||||
editMarkId: tag.id
|
||||
});
|
||||
setColor(tag.color);
|
||||
}}
|
||||
/>
|
||||
<img
|
||||
onClick={() => deleteTag(tag.id)}
|
||||
className="delete"
|
||||
src={close}
|
||||
alt="delete"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
)}
|
||||
{(tags.add || tags.edit) && (
|
||||
<div className="formTag">
|
||||
<img
|
||||
src={arrow}
|
||||
className="arrow"
|
||||
alt="arrow"
|
||||
onClick={() => {
|
||||
setTags((prevState) => ({
|
||||
...prevState,
|
||||
add: false,
|
||||
edit: false
|
||||
}));
|
||||
setTagInfo({
|
||||
description: "",
|
||||
name: ""
|
||||
});
|
||||
setColor("#aabbcc");
|
||||
}}
|
||||
/>
|
||||
<div className="form-tag">
|
||||
<input
|
||||
className="formTag__input"
|
||||
className="form-tag__input"
|
||||
placeholder="Описание метки"
|
||||
maxLength="25"
|
||||
value={tagInfo.description}
|
||||
@ -731,7 +724,7 @@ export const ProjectTracker = () => {
|
||||
}
|
||||
/>
|
||||
<input
|
||||
className="formTag__input"
|
||||
className="form-tag__input"
|
||||
placeholder="Тег"
|
||||
value={tagInfo.name}
|
||||
maxLength="10"
|
||||
@ -749,12 +742,31 @@ export const ProjectTracker = () => {
|
||||
}}
|
||||
className={
|
||||
tagInfo.name && tagInfo.description
|
||||
? "formTag__btn"
|
||||
: "formTag__btn disable"
|
||||
? "form-tag__btn"
|
||||
: "form-tag__btn disable"
|
||||
}
|
||||
>
|
||||
{tags.add ? "Добавить" : "Изменить"}
|
||||
</button>
|
||||
{(tags.add || tags.edit) && (
|
||||
<button
|
||||
className={"form-tag__btn"}
|
||||
onClick={() => {
|
||||
setTags((prevState) => ({
|
||||
...prevState,
|
||||
add: false,
|
||||
edit: false
|
||||
}));
|
||||
setTagInfo({
|
||||
description: "",
|
||||
name: ""
|
||||
});
|
||||
setColor("#aabbcc");
|
||||
}}
|
||||
>
|
||||
Отмена
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
@ -859,8 +871,17 @@ export const ProjectTracker = () => {
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
<div className="tasksContainer">
|
||||
<div className="tasks-container">
|
||||
{column.tasks.map((task) => {
|
||||
const dateDeadline = new Date(task.dead_line);
|
||||
const currentDate = moment().format(
|
||||
"YYYY-MM-DD HH:mm:ss"
|
||||
);
|
||||
const titleColor =
|
||||
task.dead_line &&
|
||||
dateDeadline < new Date(currentDate)
|
||||
? "red"
|
||||
: "#1a1919";
|
||||
return (
|
||||
<div
|
||||
key={task.id}
|
||||
@ -889,7 +910,10 @@ export const ProjectTracker = () => {
|
||||
}
|
||||
}}
|
||||
>
|
||||
<p className="task__board__item__title">
|
||||
<p
|
||||
className="task__board__item__title"
|
||||
style={{ color: titleColor }}
|
||||
>
|
||||
{task.title}
|
||||
</p>
|
||||
</div>
|
||||
@ -899,26 +923,12 @@ export const ProjectTracker = () => {
|
||||
}}
|
||||
className="tasks__board__item__description"
|
||||
></p>
|
||||
<div className="tasks__board__item__executor">
|
||||
<img
|
||||
src={
|
||||
task.executor?.avatar
|
||||
? urlForLocal(task.executor?.avatar)
|
||||
: avatarMok
|
||||
}
|
||||
alt="avatar"
|
||||
/>
|
||||
<span>
|
||||
{task.executor?.fio ||
|
||||
"Исполнитель не назначен"}
|
||||
</span>
|
||||
</div>
|
||||
{Boolean(task.mark.length) && (
|
||||
<div className="tasks__board__item__tags">
|
||||
{task.mark.map((tag) => {
|
||||
return (
|
||||
<div
|
||||
className="tagItem"
|
||||
className="tag-item"
|
||||
key={tag.id}
|
||||
style={{ background: tag.color }}
|
||||
>
|
||||
@ -928,38 +938,57 @@ export const ProjectTracker = () => {
|
||||
})}
|
||||
</div>
|
||||
)}
|
||||
{typeof task.execution_priority ===
|
||||
"number" && (
|
||||
<div className="tasks__board__item__priority">
|
||||
<p>Приоритет:</p>
|
||||
<span
|
||||
className={
|
||||
priorityClass[task.execution_priority]
|
||||
}
|
||||
>
|
||||
{priority[task.execution_priority]}
|
||||
</span>
|
||||
</div>
|
||||
)}
|
||||
{task.dead_line && (
|
||||
<div className="tasks__board__item__deadLine">
|
||||
<img src={calendarIcon} alt="calendar" />
|
||||
<span>
|
||||
{getCorrectDate(task.dead_line)}
|
||||
</span>
|
||||
</div>
|
||||
)}
|
||||
<div className="tasks__board__item__container">
|
||||
{typeof task.execution_priority ===
|
||||
"number" && (
|
||||
<div className="tasks__board__item__priority">
|
||||
<p>⚡</p>
|
||||
<span
|
||||
className={
|
||||
priorityClass[task.execution_priority]
|
||||
}
|
||||
>
|
||||
{priority[task.execution_priority]}
|
||||
</span>
|
||||
</div>
|
||||
)}
|
||||
{task.dead_line && (
|
||||
<div className="tasks__board__item__dead-line">
|
||||
<p>⌛</p>
|
||||
<span>
|
||||
{getCorrectDate(task.dead_line)}
|
||||
</span>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="tasks__board__item__info">
|
||||
<div className="tasks__board__item__info__more">
|
||||
<div className="tasks__board__item__executor">
|
||||
<img
|
||||
src={commentsBoard}
|
||||
alt="commentsImg"
|
||||
src={
|
||||
task.executor?.avatar
|
||||
? urlForLocal(task.executor?.avatar)
|
||||
: avatarMok
|
||||
}
|
||||
alt="avatar"
|
||||
/>
|
||||
<span>{task.comment_count}</span>
|
||||
<span>
|
||||
{task.executor?.fio ||
|
||||
"Исполнитель не назначен"}
|
||||
</span>
|
||||
</div>
|
||||
<div className="tasks__board__item__info__more">
|
||||
<img src={filesBoard} alt="filesImg" />
|
||||
<span>{task.file_count}</span>
|
||||
<div className="tasks__board__item__info__tags">
|
||||
<div className="tasks__board__item__info__more">
|
||||
<img
|
||||
src={commentsBoard}
|
||||
alt="commentsImg"
|
||||
/>
|
||||
<span>{task.comment_count}</span>
|
||||
</div>
|
||||
<div className="tasks__board__item__info__more">
|
||||
<img src={filesBoard} alt="filesImg" />
|
||||
<span>{task.file_count}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<TrackerSelectColumn
|
||||
@ -978,17 +1007,17 @@ export const ProjectTracker = () => {
|
||||
})}
|
||||
{Boolean(projectBoard?.columns) &&
|
||||
!Boolean(projectBoard.columns.length) && (
|
||||
<div className="tasks__board__noItems">
|
||||
<div className="tasks__board__no-items">
|
||||
В проекте нет задач.
|
||||
</div>
|
||||
)}
|
||||
{filteredNoTasks && (
|
||||
<div className="tasks__board__noTasks">
|
||||
<div className="tasks__board__noTasksInfo">
|
||||
<img src={trackerNoTasks} alt="noTasks" />
|
||||
<div className="tasks__board__no-tasks">
|
||||
<div className="tasks__board__no-tasks-info">
|
||||
<img src={trackerNoTasks} alt="no-tasks" />
|
||||
<p>Пока нет подходящих задач</p>
|
||||
</div>
|
||||
<p className="tasks__board__noTasksMore">
|
||||
<p className="tasks__board__no-tasks-more">
|
||||
Ставьте задачи, следите за прогрессом, ведите учёт
|
||||
рабочего времени
|
||||
</p>
|
||||
|
||||
@ -137,7 +137,8 @@ export const QuizPage = () => {
|
||||
{/*</div>*/}
|
||||
<div className="quiz-page__block">Доступные тесты</div>
|
||||
<div className="quiz-page__cards-test">
|
||||
{questionnaires.length ? (
|
||||
{questionnaires &&
|
||||
questionnaires.length > 0 &&
|
||||
questionnaires.map((item, index) => (
|
||||
<CardAvailableTest
|
||||
description={item.description}
|
||||
@ -147,9 +148,9 @@ export const QuizPage = () => {
|
||||
passedTest={item.passedTest}
|
||||
key={index}
|
||||
/>
|
||||
))
|
||||
) : (
|
||||
<h1>Анкет нет</h1>
|
||||
))}
|
||||
{questionnaires && questionnaires.length === 0 && (
|
||||
<h1>Нет доступных тестов</h1>
|
||||
)}
|
||||
</div>
|
||||
{/*<div className="block-text">*/}
|
||||
|
||||
@ -5,6 +5,7 @@
|
||||
font-family: "LabGrotesque", sans-serif;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
&__container {
|
||||
max-width: 1160px;
|
||||
margin: 23px auto 42px auto;
|
||||
@ -12,9 +13,11 @@
|
||||
width: 100%;
|
||||
padding: 0 15px;
|
||||
}
|
||||
|
||||
&__title {
|
||||
margin: 0 0 39px 0;
|
||||
}
|
||||
|
||||
&__block {
|
||||
background: #e1fccf;
|
||||
border-radius: 12px;
|
||||
@ -25,21 +28,26 @@
|
||||
padding: 20px;
|
||||
margin: 0 0 16px 0;
|
||||
}
|
||||
|
||||
&__cards-test {
|
||||
display: grid;
|
||||
grid-gap: 29px;
|
||||
grid-template-columns: 1fr 1fr 1fr;
|
||||
margin-bottom: 29px;
|
||||
|
||||
@media (max-width: 955px) {
|
||||
grid-template-columns: 1fr 1fr;
|
||||
}
|
||||
|
||||
@media (max-width: 668px) {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
&__specialization {
|
||||
margin: 0 0 26px 0;
|
||||
}
|
||||
|
||||
&__categories-items {
|
||||
display: grid;
|
||||
grid-gap: 24px;
|
||||
@ -53,6 +61,7 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.interjacent-page-quiz {
|
||||
background: #f1f1f1;
|
||||
height: 100%;
|
||||
@ -60,12 +69,15 @@
|
||||
font-family: "LabGrotesque", sans-serif;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
&__title {
|
||||
margin: 0 0 39px 0;
|
||||
}
|
||||
|
||||
&__passing-information {
|
||||
margin: 0 0 32px 0;
|
||||
}
|
||||
|
||||
&__container {
|
||||
max-width: 1160px;
|
||||
margin: 23px auto 42px auto;
|
||||
@ -73,6 +85,7 @@
|
||||
width: 100%;
|
||||
padding: 0 15px;
|
||||
}
|
||||
|
||||
&__introduction-items {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
@ -88,6 +101,7 @@
|
||||
font-family: "LabGrotesque", sans-serif;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
&__container {
|
||||
max-width: 1160px;
|
||||
margin: 23px auto 42px auto;
|
||||
@ -95,12 +109,15 @@
|
||||
width: 100%;
|
||||
padding: 0 15px;
|
||||
}
|
||||
|
||||
&__title {
|
||||
margin: 0 0 39px 0;
|
||||
}
|
||||
|
||||
&__passing-information {
|
||||
margin: 0 0 29px 0;
|
||||
}
|
||||
|
||||
&__block-green {
|
||||
font-weight: 400;
|
||||
font-size: 18px;
|
||||
@ -110,6 +127,7 @@
|
||||
border-radius: 12px 12px 0px 0px;
|
||||
padding: 20px 51px;
|
||||
}
|
||||
|
||||
&__introduction {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
@ -123,6 +141,7 @@
|
||||
font-family: "LabGrotesque", sans-serif;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
&__container {
|
||||
max-width: 1160px;
|
||||
margin: 23px auto 42px auto;
|
||||
@ -130,9 +149,11 @@
|
||||
width: 100%;
|
||||
padding: 0 15px;
|
||||
}
|
||||
|
||||
&__title {
|
||||
margin: 0 0 39px 0;
|
||||
}
|
||||
|
||||
&__report-quiz {
|
||||
margin: 0 0 28px 0;
|
||||
}
|
||||
|
||||
@ -51,10 +51,10 @@ export const RegistrationForCandidate = () => {
|
||||
);
|
||||
|
||||
return (
|
||||
<div className="registrationCandidate">
|
||||
<div className="registration-candidate">
|
||||
<AuthHeader />
|
||||
<div className="container">
|
||||
<div className="registrationCandidate__start">
|
||||
<div className="registration-candidate__start">
|
||||
<h2 className="auth-candidate__start__title">
|
||||
Хочу в команду <span>IT-специалистов</span>
|
||||
</h2>
|
||||
@ -65,28 +65,28 @@ export const RegistrationForCandidate = () => {
|
||||
Для нас не имеет значения Ваша локация.
|
||||
</p>
|
||||
<StepsForCandidate step="шаг 2 - заполните данные" />
|
||||
<div className="registrationCandidate__formWrapper">
|
||||
<div className="registrationCandidate__info">
|
||||
<div className="registrationCandidate__info__category">
|
||||
<div className="registration-candidate__form-wrapper">
|
||||
<div className="registration-candidate__info">
|
||||
<div className="registration-candidate__info__category">
|
||||
<img src={BackEndImg} alt="img" />
|
||||
<p>Backend разработчики</p>
|
||||
</div>
|
||||
<p className="registrationCandidate__info__skills">
|
||||
<p className="registration-candidate__info__skills">
|
||||
Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript
|
||||
</p>
|
||||
<Link
|
||||
to="/auth-candidate"
|
||||
className="registrationCandidate__info__arrow"
|
||||
className="registration-candidate__info__arrow"
|
||||
>
|
||||
<img src={arrowBtn} alt="img" />
|
||||
</Link>
|
||||
</div>
|
||||
{/* форма регистрации */}
|
||||
<form
|
||||
className="registrationCandidate__form"
|
||||
className="registration-candidate__form"
|
||||
onSubmit={handleSubmit}
|
||||
>
|
||||
<div className="registrationCandidate__form__input">
|
||||
<div className="registration-candidate__form__input">
|
||||
<label htmlFor="name">Ваше имя</label>
|
||||
<input
|
||||
className={validationErrors.username ? "error" : ""}
|
||||
@ -98,7 +98,7 @@ export const RegistrationForCandidate = () => {
|
||||
/>
|
||||
<span>{validationErrors.username}</span>
|
||||
</div>
|
||||
<div className="registrationCandidate__form__input">
|
||||
<div className="registration-candidate__form__input">
|
||||
<label htmlFor="summary">Если есть ссылка на резюме</label>
|
||||
<input
|
||||
className={validationErrors.summary ? "error" : ""}
|
||||
@ -110,7 +110,7 @@ export const RegistrationForCandidate = () => {
|
||||
/>
|
||||
<span>{validationErrors.summary}</span>
|
||||
</div>
|
||||
<div className="registrationCandidate__form__input">
|
||||
<div className="registration-candidate__form__input">
|
||||
<label htmlFor="email">Ваш e-mail</label>
|
||||
<input
|
||||
className={validationErrors.email ? "error" : ""}
|
||||
@ -122,7 +122,7 @@ export const RegistrationForCandidate = () => {
|
||||
/>
|
||||
<span>{validationErrors.email}</span>
|
||||
</div>
|
||||
<div className="registrationCandidate__form__input">
|
||||
<div className="registration-candidate__form__input">
|
||||
<label htmlFor="tg">Ваш telegram</label>
|
||||
<input
|
||||
className={validationErrors.tg ? "error" : ""}
|
||||
@ -134,7 +134,7 @@ export const RegistrationForCandidate = () => {
|
||||
/>
|
||||
<span>{validationErrors.tg}</span>
|
||||
</div>
|
||||
<div className="registrationCandidate__form__input">
|
||||
<div className="registration-candidate__form__input">
|
||||
<label htmlFor="password">Придумайте пароль</label>
|
||||
<input
|
||||
className={validationErrors.password ? "error" : ""}
|
||||
@ -146,7 +146,7 @@ export const RegistrationForCandidate = () => {
|
||||
/>
|
||||
<span>{validationErrors.password}</span>
|
||||
</div>
|
||||
<div className="registrationCandidate__form__input">
|
||||
<div className="registration-candidate__form__input">
|
||||
<label htmlFor="secondPassword">Повторите пароль</label>
|
||||
<input
|
||||
className={validationErrors.secondPassword ? "error" : ""}
|
||||
@ -158,7 +158,7 @@ export const RegistrationForCandidate = () => {
|
||||
/>
|
||||
<span>{validationErrors.secondPassword}</span>
|
||||
</div>
|
||||
<div className="registrationCandidate__form__submit">
|
||||
<div className="registration-candidate__form__submit">
|
||||
<button type="submit">Отправить</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
.registrationCandidate {
|
||||
.registration-candidate {
|
||||
font-family: "LabGrotesque", sans-serif;
|
||||
position: relative;
|
||||
background-color: #f1f1f1;
|
||||
@ -39,7 +39,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
&__formWrapper {
|
||||
&__form-wrapper {
|
||||
position: relative;
|
||||
margin-top: 200px;
|
||||
display: flex;
|
||||
|
||||
@ -71,33 +71,33 @@ export const RegistrationSetting = () => {
|
||||
const [step, setStep] = useState(1);
|
||||
|
||||
return (
|
||||
<div className="registrationSetting">
|
||||
<div className="registration-setting">
|
||||
<AuthHeader />
|
||||
<SideBar />
|
||||
<div className="registrationSetting__content">
|
||||
<div className="registration-setting__content">
|
||||
<div className="container">
|
||||
<h1 className="registrationSetting__title">
|
||||
<h1 className="registration-setting__title">
|
||||
Добро пожаловать{" "}
|
||||
<span>
|
||||
в ITGuild
|
||||
<img src={arrowInfo} alt="arrow" />
|
||||
</span>
|
||||
</h1>
|
||||
<div className="registrationSetting__question questionBlock">
|
||||
<div className="questionBlock__head">
|
||||
<span className="questionBlock__suptitle">
|
||||
<div className="registration-setting__question question-block">
|
||||
<div className="question-block__head">
|
||||
<span className="question-block__suptitle">
|
||||
Эти ответы помогут сформировать кабинет
|
||||
</span>
|
||||
<div className="questionBlock__steps">
|
||||
<div className="question-block__steps">
|
||||
<span className="active" />
|
||||
<span className={step >= 2 ? "active" : ""} />
|
||||
<span className={step >= 3 ? "active" : ""} />
|
||||
</div>
|
||||
</div>
|
||||
<h3 className="questionBlock__question">
|
||||
<h3 className="question-block__question">
|
||||
Со сколькими людьми ты будешь работать?
|
||||
</h3>
|
||||
<div className="questionBlock__answers">
|
||||
<div className="question-block__answers">
|
||||
{questions.countPeople.map((item, index) => {
|
||||
return (
|
||||
<button
|
||||
@ -118,15 +118,15 @@ export const RegistrationSetting = () => {
|
||||
})}
|
||||
</div>
|
||||
<img
|
||||
className="registrationSetting__question__img"
|
||||
className="registration-setting__question__img"
|
||||
src={registrationImg}
|
||||
alt="img"
|
||||
/>
|
||||
</div>
|
||||
{step >= 2 && (
|
||||
<div className="registrationSetting__question questionBlock">
|
||||
<h3 className="questionBlock__question">Какая у тебя роль?</h3>
|
||||
<div className="questionBlock__answers">
|
||||
<div className="registration-setting__question question-block">
|
||||
<h3 className="question-block__question">Какая у тебя роль?</h3>
|
||||
<div className="question-block__answers">
|
||||
{questions.role.map((item, index) => {
|
||||
return (
|
||||
<button
|
||||
@ -147,7 +147,7 @@ export const RegistrationSetting = () => {
|
||||
</div>
|
||||
)}
|
||||
{step >= 3 && (
|
||||
<div className="registrationSetting__environment environment">
|
||||
<div className="registration-setting__environment environment">
|
||||
<span className="environment__suptitle">
|
||||
Организуй комфортную среду для продуктивности
|
||||
</span>
|
||||
@ -191,7 +191,7 @@ export const RegistrationSetting = () => {
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
<button className="registrationSetting__continue registrationSetting__done">
|
||||
<button className="registration-setting__continue registration-setting__done">
|
||||
Готово
|
||||
</button>
|
||||
</div>
|
||||
@ -206,7 +206,7 @@ export const RegistrationSetting = () => {
|
||||
setStep((prevState) => prevState + 1);
|
||||
}
|
||||
}}
|
||||
className="registrationSetting__continue"
|
||||
className="registration-setting__continue"
|
||||
>
|
||||
Продолжить
|
||||
</button>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
.registrationSetting {
|
||||
.registration-setting {
|
||||
&__content {
|
||||
font-family: "LabGrotesque", sans-serif;
|
||||
background-color: #f1f1f1;
|
||||
@ -21,7 +21,7 @@
|
||||
margin-bottom: 46px;
|
||||
color: #000000;
|
||||
span {
|
||||
color: #52B709;
|
||||
color: #52b709;
|
||||
position: relative;
|
||||
img {
|
||||
position: absolute;
|
||||
@ -48,7 +48,7 @@
|
||||
}
|
||||
|
||||
&__question {
|
||||
background: #FFFFFF;
|
||||
background: #ffffff;
|
||||
border-radius: 12px;
|
||||
padding: 46.5px 75.5px 38px;
|
||||
position: relative;
|
||||
@ -60,17 +60,18 @@
|
||||
}
|
||||
}
|
||||
|
||||
.questionBlock {
|
||||
.question-block {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-bottom: 18px;
|
||||
|
||||
&__head {
|
||||
display: flex;
|
||||
margin-bottom: 33px;
|
||||
}
|
||||
|
||||
&__suptitle {
|
||||
color: #6F6F6F;
|
||||
color: #6f6f6f;
|
||||
font-size: 14px;
|
||||
margin-right: 70px;
|
||||
}
|
||||
@ -83,12 +84,12 @@
|
||||
span {
|
||||
width: 75px;
|
||||
height: 6.5px;
|
||||
background: #B0BABF;
|
||||
background: #b0babf;
|
||||
border-radius: 77px;
|
||||
}
|
||||
|
||||
.active {
|
||||
background: #6F6F6F;
|
||||
background: #6f6f6f;
|
||||
}
|
||||
}
|
||||
|
||||
@ -105,14 +106,14 @@
|
||||
|
||||
button {
|
||||
border-radius: 12px;
|
||||
border: 1px solid #8DC63F;
|
||||
border: 1px solid #8dc63f;
|
||||
padding: 4px 30px;
|
||||
line-height: 32px;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.active {
|
||||
background: #1458DD;
|
||||
background: #1458dd;
|
||||
color: whitesmoke;
|
||||
font-weight: 500;
|
||||
border: none;
|
||||
@ -123,13 +124,13 @@
|
||||
&__environment {
|
||||
margin-top: 13px;
|
||||
padding: 32px 20px 42px 44px;
|
||||
background: #E2EBEF;
|
||||
background: #e2ebef;
|
||||
border-radius: 12px;
|
||||
|
||||
.environment {
|
||||
&__suptitle {
|
||||
font-size: 14px;
|
||||
color: #6F6F6F;
|
||||
color: #6f6f6f;
|
||||
margin-left: 31px;
|
||||
}
|
||||
|
||||
@ -181,7 +182,7 @@
|
||||
column-gap: 22.4px;
|
||||
|
||||
p {
|
||||
color: #6F6F6F;
|
||||
color: #6f6f6f;
|
||||
font-size: 12px;
|
||||
max-width: 189px;
|
||||
}
|
||||
@ -190,7 +191,7 @@
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
border-radius: 50px;
|
||||
background: #DDEEC6;
|
||||
background: #ddeec6;
|
||||
margin-left: auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -204,12 +205,12 @@
|
||||
|
||||
.item--active {
|
||||
opacity: 1;
|
||||
border: 2px solid #1458DD;
|
||||
border: 2px solid #1458dd;
|
||||
}
|
||||
|
||||
&__continue {
|
||||
margin: 6px 0 0 75.5px;
|
||||
background-color: #52B709;
|
||||
background-color: #52b709;
|
||||
width: 174px;
|
||||
height: 46px;
|
||||
color: white;
|
||||
|
||||
@ -95,7 +95,7 @@ export const Summary = () => {
|
||||
<p>Вернуться</p>
|
||||
</div>
|
||||
)}
|
||||
<div className={openGit ? "summary__info openGit" : "summary__info"}>
|
||||
<div className={openGit ? "summary__info open-git" : "summary__info"}>
|
||||
<div className="summary__person">
|
||||
<img
|
||||
src={
|
||||
@ -136,7 +136,7 @@ export const Summary = () => {
|
||||
</div>
|
||||
<div className="skills__section__items">
|
||||
{editSkills ? (
|
||||
<div className="editSkills">
|
||||
<div className="edit-skills">
|
||||
{selectedSkills &&
|
||||
selectedSkills.map((skill) => {
|
||||
return (
|
||||
@ -156,9 +156,9 @@ export const Summary = () => {
|
||||
</span>
|
||||
);
|
||||
})}
|
||||
<div className="selectSkills">
|
||||
<div className="select-skills">
|
||||
<div
|
||||
className="selectSkills__name"
|
||||
className="select-skills__name"
|
||||
onClick={() => setSelectSkillsOpen(!selectSkillsOpen)}
|
||||
>
|
||||
Выберите скилл
|
||||
@ -168,7 +168,7 @@ export const Summary = () => {
|
||||
/>
|
||||
</div>
|
||||
{selectSkillsOpen && (
|
||||
<div className="selectSkills__dropDown">
|
||||
<div className="select-skills__dropDown">
|
||||
{skillsList.map((skill) => {
|
||||
return (
|
||||
<p
|
||||
@ -179,7 +179,7 @@ export const Summary = () => {
|
||||
])
|
||||
}
|
||||
key={skill.id}
|
||||
className="selectSkills__item"
|
||||
className="select-skills__item"
|
||||
>
|
||||
{skill.name}
|
||||
</p>
|
||||
@ -253,12 +253,12 @@ export const Summary = () => {
|
||||
</div>
|
||||
)}
|
||||
{openGit && (
|
||||
<div className="summary__sectionGit">
|
||||
<div className="summary__section-git">
|
||||
<div className="summary__sections__head">
|
||||
<h3>Ваши репозитории</h3>
|
||||
<button>Редактировать</button>
|
||||
</div>
|
||||
<div className="summary__sectionGitItems">
|
||||
<div className="summary__section-git-items">
|
||||
{Boolean(gitInfo.length) &&
|
||||
gitInfo.map((itemGit) => {
|
||||
return (
|
||||
@ -267,23 +267,23 @@ export const Summary = () => {
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
key={itemGit.id}
|
||||
className="summary__sectionGitItem gitItem"
|
||||
className="summary__section-git-item git-item"
|
||||
>
|
||||
<div className="gitItem__info">
|
||||
<div className="gitItem__info__about">
|
||||
<div className="git-item__info">
|
||||
<div className="git-item__info__about">
|
||||
<img src={gitImgItem} alt="gitImg" />
|
||||
<div className="gitItem__info__name">
|
||||
<div className="git-item__info__name">
|
||||
<h4>{itemGit.title}</h4>
|
||||
<p>{itemGit.description}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="gitItem__info__specification">
|
||||
<span className="gitItem__lineSkill" />
|
||||
<div className="git-item__info__specification">
|
||||
<span className="git-item__lineSkill" />
|
||||
<p>{itemGit.main_stack}</p>
|
||||
</div>
|
||||
</div>
|
||||
<a
|
||||
className="gitItem__link"
|
||||
className="git-item__link"
|
||||
href={itemGit.link}
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
@ -294,7 +294,7 @@ export const Summary = () => {
|
||||
);
|
||||
})}
|
||||
{!Boolean(gitInfo.length) && (
|
||||
<p className="noGitItems">Нет актуальных проектов</p>
|
||||
<p className="no-git-items">Нет актуальных проектов</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -86,7 +86,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.openGit {
|
||||
.open-git {
|
||||
.summary__name {
|
||||
max-width: none;
|
||||
|
||||
@ -250,7 +250,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.editSkills {
|
||||
.edit-skills {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 14px;
|
||||
@ -273,7 +273,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.selectSkills {
|
||||
.select-skills {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@ -384,10 +384,10 @@
|
||||
padding: 15px 35px 15px 50px !important;
|
||||
}
|
||||
|
||||
&__sectionGit {
|
||||
&__section-git {
|
||||
margin-top: 25px;
|
||||
|
||||
&Items {
|
||||
&-items {
|
||||
margin-top: 25px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
@ -395,7 +395,7 @@
|
||||
column-gap: 25px;
|
||||
justify-content: space-between;
|
||||
|
||||
.noGitItems {
|
||||
.no-git-items {
|
||||
width: 100%;
|
||||
font-size: 20px;
|
||||
background: #ffffff;
|
||||
@ -405,7 +405,7 @@
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.gitItem {
|
||||
.git-item {
|
||||
width: 48%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
@ -74,14 +74,20 @@ export const Tracker = () => {
|
||||
});
|
||||
apiRequest(
|
||||
`/task/get-user-tasks?user_id=${localStorage.getItem("id")}&expand=timers`
|
||||
).then((el) => {
|
||||
const allTasks = el ? el.filter((item) => item.status !== 0) : [];
|
||||
const completedTasks = el ? el.filter((item) => item.status === 0) : [];
|
||||
setAllTasks(allTasks);
|
||||
setFilteredAllTasks(allTasks);
|
||||
setAllCompletedTasks(completedTasks);
|
||||
setFilterCompleteTasks(completedTasks);
|
||||
});
|
||||
)
|
||||
.then((el) => {
|
||||
const allTasks = el?.length
|
||||
? el.filter((item) => item.status !== 0)
|
||||
: [];
|
||||
const completedTasks = el?.length
|
||||
? el.filter((item) => item.status === 0)
|
||||
: [];
|
||||
setAllTasks(allTasks);
|
||||
setFilteredAllTasks(allTasks);
|
||||
setAllCompletedTasks(completedTasks);
|
||||
setFilterCompleteTasks(completedTasks);
|
||||
})
|
||||
.catch((err) => console.error(err));
|
||||
}, []);
|
||||
|
||||
const toggleTabs = (index) => {
|
||||
@ -211,8 +217,7 @@ export const Tracker = () => {
|
||||
>
|
||||
<img src={addProjectImg} alt="#"></img>
|
||||
<p className="create-project-btn__text">
|
||||
Ставьте задачи, следите за прогрессом, ведите учёт
|
||||
рабочего времени
|
||||
Добавить проект
|
||||
</p>
|
||||
</BaseButton>
|
||||
</div>
|
||||
@ -236,12 +241,12 @@ export const Tracker = () => {
|
||||
<div
|
||||
className={
|
||||
tab === 2
|
||||
? "tracker__tabs__content__allTasks taskList tasks active__content"
|
||||
? "tracker__tabs__content__all-tasks task-list tasks active__content"
|
||||
: "tracker__tabs__content__projects"
|
||||
}
|
||||
>
|
||||
<div className="taskList__head">
|
||||
<div className="taskList__tasks-period">
|
||||
<div className="task-list__head">
|
||||
<div className="task-list__tasks-period">
|
||||
<div className="month-period">
|
||||
<p>
|
||||
{25} - {35}
|
||||
@ -260,7 +265,7 @@ export const Tracker = () => {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="taskList__head__search">
|
||||
<div className="task-list__head__search">
|
||||
<img src={search} alt="search" />
|
||||
<input
|
||||
type="text"
|
||||
@ -269,12 +274,12 @@ export const Tracker = () => {
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="taskList__filters">
|
||||
<BaseButton styles={"taskList__filters-filter"}>
|
||||
<div className="task-list__filters">
|
||||
<BaseButton styles={"task-list__filters-filter"}>
|
||||
<img src={filterIcon} alt="#" />
|
||||
<p>Фильтр</p>
|
||||
</BaseButton>
|
||||
<BaseButton styles={"taskList__filters-clear"}>
|
||||
<BaseButton styles={"task-list__filters-clear"}>
|
||||
<p> Очистить фильтр</p>
|
||||
</BaseButton>
|
||||
</div>
|
||||
@ -288,18 +293,18 @@ export const Tracker = () => {
|
||||
projects={projects}
|
||||
/>
|
||||
|
||||
<div className="taskList__time">
|
||||
<div className="taskList__time-compited">
|
||||
<div className="task-list__time">
|
||||
<div className="task-list__time-compited">
|
||||
<h4>Учет моего рабочего времени за день</h4>
|
||||
<h3>
|
||||
Задач выполнено: <p>{2}</p>
|
||||
</h3>
|
||||
</div>
|
||||
<div className="taskList__time-all">
|
||||
<div className="task-list__time-all">
|
||||
<h3>Общее время:</h3>
|
||||
<p>{"4 ч 34 мин"}</p>
|
||||
</div>
|
||||
<div className="taskList__time-status">
|
||||
<div className="task-list__time-status">
|
||||
<div>
|
||||
<img src={statusTimeTask} alt="#" />
|
||||
<p>Сверка пройдена</p>
|
||||
@ -311,7 +316,7 @@ export const Tracker = () => {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="taskList__end">
|
||||
<div className="task-list__end">
|
||||
<BaseButton styles={"close-day"}>
|
||||
Закрыть сегодняшний день
|
||||
</BaseButton>
|
||||
@ -381,23 +386,23 @@ export const Tracker = () => {
|
||||
)}`}
|
||||
</p>
|
||||
</div>
|
||||
<div className="archive__tasksWrapper">
|
||||
<div className="archive__tasks-wrapper">
|
||||
{Boolean(
|
||||
projects?.filter((project) => project.status === 10).length
|
||||
) ? (
|
||||
projects?.map((project, index) => {
|
||||
return project.status === 10 ? (
|
||||
<div
|
||||
className="archive__completeTask-project"
|
||||
className="archive__complete-task-project"
|
||||
key={index}
|
||||
>
|
||||
<div className="archive__completeTask__description">
|
||||
<div className="archive__complete-task__description">
|
||||
<p className="project-title-archive">
|
||||
{project.name}
|
||||
</p>
|
||||
<p className="date">{project.date}</p>
|
||||
</div>
|
||||
<div className="archive__completeTask__creator">
|
||||
<div className="archive__complete-task__creator">
|
||||
<img src={mockAvatar} alt="#" />
|
||||
<div className="creator-title">
|
||||
<h4>Создатель проекта:</h4>
|
||||
@ -410,7 +415,7 @@ export const Tracker = () => {
|
||||
);
|
||||
})
|
||||
) : (
|
||||
<div className="archive__noItem-project">
|
||||
<div className="archive__no-item-project">
|
||||
<img src={archiveTrackerProjects} alt="#" />
|
||||
<p>В архиве проектов нет</p>
|
||||
</div>
|
||||
|
||||
@ -171,7 +171,7 @@
|
||||
|
||||
.create-project-btn {
|
||||
width: 300px;
|
||||
height: 113px;
|
||||
height: 83px;
|
||||
border-radius: 12px;
|
||||
background: #ecf8e5;
|
||||
color: #000000;
|
||||
@ -219,6 +219,15 @@
|
||||
border-bottom: 1px solid #dde2e4;
|
||||
padding: 0 35px 15px;
|
||||
|
||||
&__title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
column-gap: 5px;
|
||||
img {
|
||||
height: 22px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1000px) {
|
||||
padding: 0 15px 15px;
|
||||
}
|
||||
@ -250,7 +259,7 @@
|
||||
font-size: 22px;
|
||||
line-height: 32px;
|
||||
margin-bottom: 0;
|
||||
max-width: 21%;
|
||||
max-width: 160px;
|
||||
word-break: break-all;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
@ -366,7 +375,7 @@
|
||||
border-color: gray;
|
||||
}
|
||||
|
||||
&Selected {
|
||||
&-selected {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-radius: 8px;
|
||||
@ -427,7 +436,7 @@
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
&Dropdown {
|
||||
&-dropdown {
|
||||
position: absolute;
|
||||
top: 33px;
|
||||
left: 0;
|
||||
@ -440,7 +449,7 @@
|
||||
row-gap: 7px;
|
||||
width: 100%;
|
||||
|
||||
.executorDropdown__person {
|
||||
.executor-dropdown__person {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
@ -456,8 +465,8 @@
|
||||
}
|
||||
|
||||
img {
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
@ -502,6 +511,13 @@
|
||||
|
||||
&__tags {
|
||||
position: relative;
|
||||
img {
|
||||
transition: all 0.15s ease;
|
||||
margin-left: 5px;
|
||||
}
|
||||
.open {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
.tags {
|
||||
&__add {
|
||||
display: flex;
|
||||
@ -538,16 +554,19 @@
|
||||
}
|
||||
&__list {
|
||||
position: absolute;
|
||||
border-radius: 2px;
|
||||
border-radius: 8px;
|
||||
background: #d9d9d9;
|
||||
z-index: 8;
|
||||
|
||||
// padding: 0 8px 10px;
|
||||
top: 30px;
|
||||
width: 265px;
|
||||
left: -35px;
|
||||
width: 216px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
@media (max-width: 900px) {
|
||||
left: 0px;
|
||||
}
|
||||
|
||||
.close {
|
||||
cursor: pointer;
|
||||
width: 20px;
|
||||
@ -564,15 +583,16 @@
|
||||
margin-top: 8px;
|
||||
padding: 0 8px 8px;
|
||||
|
||||
.tagItem {
|
||||
.tag-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
column-gap: 5px;
|
||||
padding: 0px 8px;
|
||||
border-radius: 8px;
|
||||
height: 50px;
|
||||
max-height: 50px;
|
||||
height: 40px;
|
||||
max-height: 40px;
|
||||
background: #fff;
|
||||
|
||||
&__description {
|
||||
@ -585,6 +605,29 @@
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
&__color {
|
||||
width: 22.25px;
|
||||
height: 23.217px;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
&__images {
|
||||
display: flex;
|
||||
flex-direction: column-reverse;
|
||||
row-gap: 3px;
|
||||
|
||||
img {
|
||||
height: 14px;
|
||||
width: 14px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.delete {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
&__info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -594,41 +637,21 @@
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
&__color {
|
||||
width: 22.25px;
|
||||
height: 23.217px;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
&__images {
|
||||
display: flex;
|
||||
flex-direction: column-reverse;
|
||||
row-gap: 6px;
|
||||
|
||||
img {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.delete {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.addNewTag {
|
||||
.add-new-tag {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
column-gap: 15px;
|
||||
border-radius: 8px;
|
||||
background: #252c32;
|
||||
color: white;
|
||||
height: 42px;
|
||||
background: white;
|
||||
color: #252c32;
|
||||
height: 40px;
|
||||
cursor: pointer;
|
||||
justify-content: center;
|
||||
margin: 8px 8px 0px;
|
||||
|
||||
p {
|
||||
font-size: 15px;
|
||||
@ -648,7 +671,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.formTag {
|
||||
.form-tag {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 8px;
|
||||
@ -676,7 +699,7 @@
|
||||
border: none;
|
||||
background: #252c32;
|
||||
color: whitesmoke;
|
||||
margin: 10px auto 0;
|
||||
margin: 0 auto 0;
|
||||
border-radius: 10px;
|
||||
font-size: 15px;
|
||||
padding: 5px 12px;
|
||||
@ -749,7 +772,7 @@
|
||||
transform: scaleX(1);
|
||||
}
|
||||
|
||||
.tasksContainer {
|
||||
.tasks-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
row-gap: 8px;
|
||||
@ -785,7 +808,7 @@
|
||||
|
||||
&__item {
|
||||
width: 328px;
|
||||
padding: 6px 10px;
|
||||
padding: 6px 10px 8px 10px;
|
||||
position: relative;
|
||||
box-shadow: 0px 3px 2px -2px rgba(0, 0, 0, 0.06),
|
||||
0px 5px 3px -2px rgba(0, 0, 0, 0.02);
|
||||
@ -824,7 +847,7 @@
|
||||
color: #1a1919;
|
||||
font-weight: 500;
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
line-height: 20px;
|
||||
margin-bottom: 0;
|
||||
max-height: 100px;
|
||||
overflow: hidden;
|
||||
@ -860,13 +883,24 @@
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
|
||||
&__container {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
&__info {
|
||||
display: flex;
|
||||
column-gap: 10px;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
pointer-events: none;
|
||||
margin-top: 5px;
|
||||
|
||||
&__tags {
|
||||
display: flex;
|
||||
column-gap: 5px;
|
||||
}
|
||||
|
||||
&__more {
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
@ -921,7 +955,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
&__deadLine {
|
||||
&__dead-line {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
column-gap: 5px;
|
||||
@ -970,7 +1004,7 @@
|
||||
row-gap: 3px;
|
||||
margin: 3px 0;
|
||||
|
||||
.tagItem {
|
||||
.tag-item {
|
||||
padding: 3px 10px;
|
||||
border-radius: 10px;
|
||||
color: white;
|
||||
@ -979,7 +1013,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.openItems {
|
||||
.open-items {
|
||||
cursor: pointer;
|
||||
border-radius: 44px;
|
||||
width: 33px;
|
||||
@ -994,11 +1028,11 @@
|
||||
color: white;
|
||||
}
|
||||
|
||||
.moreItems {
|
||||
.more-items {
|
||||
background: #8bcc60;
|
||||
}
|
||||
|
||||
.lessItems {
|
||||
.less-items {
|
||||
background: #f92828;
|
||||
}
|
||||
|
||||
@ -1037,7 +1071,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
&__noItems {
|
||||
&__no-items {
|
||||
font-weight: 500;
|
||||
font-size: 25px;
|
||||
transform: scaleY(-1);
|
||||
@ -1047,12 +1081,12 @@
|
||||
}
|
||||
}
|
||||
|
||||
&__noTasks {
|
||||
&__no-tasks {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
transform: scaleY(-1);
|
||||
|
||||
&Info {
|
||||
&-info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 15px;
|
||||
@ -1069,7 +1103,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
&More {
|
||||
&-more {
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
}
|
||||
@ -1139,14 +1173,14 @@
|
||||
display: flex;
|
||||
}
|
||||
|
||||
&__allTasks {
|
||||
&__all-tasks {
|
||||
max-width: 1160px;
|
||||
padding: 0 20px;
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.taskList {
|
||||
.task-list {
|
||||
&__head {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
@ -1549,7 +1583,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
&__tasksWrapper {
|
||||
&__tasks-wrapper {
|
||||
margin-top: 20px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@ -1581,7 +1615,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
&__completeTask {
|
||||
&__complete-task {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
@ -1599,7 +1633,7 @@
|
||||
color: #111112;
|
||||
}
|
||||
|
||||
.completeTask__title {
|
||||
.complete-task__title {
|
||||
font-weight: 700;
|
||||
font-size: 18px;
|
||||
line-height: 32px;
|
||||
@ -1858,7 +1892,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
&__noItem {
|
||||
&__no-item {
|
||||
padding: 23px 0 19px;
|
||||
color: #6f6f6f;
|
||||
|
||||
|
||||
@ -15,64 +15,64 @@ import "./trackerIntro.scss";
|
||||
|
||||
export const TrackerIntro = () => {
|
||||
return (
|
||||
<div className="trackerIntro">
|
||||
<div className="tracker-intro">
|
||||
<AuthHeader />
|
||||
<SideBar />
|
||||
<div className="trackerIntro__content">
|
||||
<div className="tracker-intro__content">
|
||||
<div className="container">
|
||||
<div className="trackerIntro__intro">
|
||||
<div className="trackerIntro__intro__info">
|
||||
<div className="trackerIntro__intro__suptitle">
|
||||
<div className="tracker-intro__intro">
|
||||
<div className="tracker-intro__intro__info">
|
||||
<div className="tracker-intro__intro__suptitle">
|
||||
<img src={introInfo} alt="img" />
|
||||
<span>Подключись и пользуйся бесплатно!</span>
|
||||
</div>
|
||||
<h1 className="trackerIntro__intro__title">
|
||||
<h1 className="tracker-intro__intro__title">
|
||||
Сервис для планирования и работы
|
||||
<span> для Вашей команды</span>
|
||||
<img src={arrowInfo} alt="img" />
|
||||
</h1>
|
||||
<p className="trackerIntro__intro__subtitle">
|
||||
<p className="tracker-intro__intro__subtitle">
|
||||
Российский сервис для совместной работы команд. Все процессы
|
||||
компании в одном месте: проекты, задачи, цели, сотрудники,
|
||||
документы, переписки, отчеты
|
||||
</p>
|
||||
<NavLink to="/tracker-auth" className="trackerIntro__btn">
|
||||
<NavLink to="/tracker-auth" className="tracker-intro__btn">
|
||||
Начать работу
|
||||
</NavLink>
|
||||
</div>
|
||||
<img
|
||||
className="trackerIntro__intro__img"
|
||||
className="tracker-intro__intro__img"
|
||||
src={introImg}
|
||||
alt="img"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="trackerIntro__board">
|
||||
<div className="trackerIntro__boardImg">
|
||||
<div className="tracker-intro__board">
|
||||
<div className="tracker-intro__board-img">
|
||||
<img className="board" src={trackerBoard} alt="board" />
|
||||
<img className="heard" src={trackerHeard} alt="heard" />
|
||||
</div>
|
||||
<div className="trackerIntro__board__info">
|
||||
<div className="tracker-intro__board__info">
|
||||
<p>
|
||||
Управление большим количеством проектов и гибкая настройка
|
||||
структуры под любые процессы
|
||||
</p>
|
||||
<NavLink to="/tracker-registration" className="trackerIntro__btn">
|
||||
<NavLink to="/tracker-registration" className="tracker-intro__btn">
|
||||
Начать работу
|
||||
</NavLink>
|
||||
</div>
|
||||
</div>
|
||||
<div className="container">
|
||||
<div className="trackerIntro__info">
|
||||
<h2 className="trackerIntro__info__title">
|
||||
<div className="tracker-intro__info">
|
||||
<h2 className="tracker-intro__info__title">
|
||||
Используйте сервис, который позаботится о персональных данных
|
||||
вашей компании и<br />
|
||||
<span> не уйдет с рынка.</span>
|
||||
<img src={arrowInfo} alt="img" />
|
||||
</h2>
|
||||
<div className="trackerIntro__info__items">
|
||||
<div className="trackerIntro__info__item">
|
||||
<div className="trackerIntro__info__itemHead">
|
||||
<div className="tracker-intro__info__items">
|
||||
<div className="tracker-intro__info__item">
|
||||
<div className="tracker-intro__info__item-head">
|
||||
<span>+</span>
|
||||
<h3>
|
||||
Настраиваемые
|
||||
@ -85,8 +85,8 @@ export const TrackerIntro = () => {
|
||||
работу вашей команды.
|
||||
</p>
|
||||
</div>
|
||||
<div className="trackerIntro__info__item">
|
||||
<div className="trackerIntro__info__itemHead">
|
||||
<div className="tracker-intro__info__item">
|
||||
<div className="tracker-intro__info__item-head">
|
||||
<span>+</span>
|
||||
<h3>
|
||||
Учет
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
.trackerIntro {
|
||||
.tracker-intro {
|
||||
&__content {
|
||||
font-family: "LabGrotesque", sans-serif;
|
||||
background-color: #f1f1f1;
|
||||
@ -14,7 +14,7 @@
|
||||
}
|
||||
|
||||
&__intro {
|
||||
display: flex;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: end;
|
||||
padding: 50px 0 75px;
|
||||
@ -73,7 +73,7 @@
|
||||
margin-bottom: 75px;
|
||||
|
||||
span {
|
||||
color: #52B709;
|
||||
color: #52b709;
|
||||
}
|
||||
|
||||
img {
|
||||
@ -137,7 +137,7 @@
|
||||
}
|
||||
|
||||
&__btn {
|
||||
background: #52B709;
|
||||
background: #52b709;
|
||||
border-radius: 44px;
|
||||
padding: 9px 48px;
|
||||
color: white;
|
||||
@ -160,7 +160,7 @@
|
||||
align-items: end;
|
||||
margin: 0 auto 115px;
|
||||
|
||||
&Img {
|
||||
&-img {
|
||||
position: relative;
|
||||
margin-bottom: 34px;
|
||||
}
|
||||
@ -242,7 +242,7 @@
|
||||
margin-bottom: 100px;
|
||||
|
||||
span {
|
||||
color: #52B709;
|
||||
color: #52b709;
|
||||
}
|
||||
|
||||
img {
|
||||
@ -281,20 +281,20 @@
|
||||
max-width: none;
|
||||
}
|
||||
|
||||
&Head {
|
||||
&-head {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 45px;
|
||||
|
||||
span {
|
||||
background: #52B709;
|
||||
background: #52b709;
|
||||
border-radius: 44px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 71px;
|
||||
height: 71px;
|
||||
color: #FFFFFF;
|
||||
color: #ffffff;
|
||||
font-size: 30px;
|
||||
|
||||
@media (max-width: 650px) {
|
||||
|
||||
@ -66,7 +66,7 @@ export const TrackerRegistration = () => {
|
||||
</h1>
|
||||
<div className="tracker-registration__form">
|
||||
<div className="tracker-registration__form__inputs">
|
||||
<div className="tracker-registration__inputContainer">
|
||||
<div className="tracker-registration__input-container">
|
||||
<h5>Ваше имя</h5>
|
||||
<input
|
||||
placeholder="Имя"
|
||||
@ -77,7 +77,7 @@ export const TrackerRegistration = () => {
|
||||
/>
|
||||
<span>{validationErrors.username}</span>
|
||||
</div>
|
||||
<div className="tracker-registration__inputContainer">
|
||||
<div className="tracker-registration__input-container">
|
||||
<h5>Ваш e-mail</h5>
|
||||
<input
|
||||
onChange={handleChange}
|
||||
@ -89,7 +89,7 @@ export const TrackerRegistration = () => {
|
||||
/>
|
||||
<span>{validationErrors.email}</span>
|
||||
</div>
|
||||
<div className="tracker-registration__inputContainer">
|
||||
<div className="tracker-registration__input-container">
|
||||
<h5>Придумайте пароль</h5>
|
||||
<input
|
||||
placeholder="Пароль"
|
||||
@ -101,7 +101,7 @@ export const TrackerRegistration = () => {
|
||||
/>
|
||||
<span>{validationErrors.password}</span>
|
||||
</div>
|
||||
<div className="tracker-registration__inputContainer">
|
||||
<div className="tracker-registration__input-container">
|
||||
<h5>Повторите пароль</h5>
|
||||
<input
|
||||
placeholder="Повторите пароль"
|
||||
|
||||
@ -18,7 +18,7 @@
|
||||
&__form {
|
||||
position: relative;
|
||||
border-radius: 12px;
|
||||
background: #FFF;
|
||||
background: #fff;
|
||||
padding: 20px;
|
||||
|
||||
@media (max-width: 1000px) {
|
||||
@ -46,10 +46,10 @@
|
||||
button {
|
||||
border-radius: 44px;
|
||||
padding: 9px 39px;
|
||||
background: #52B709;
|
||||
background: #52b709;
|
||||
font-weight: 500;
|
||||
font-size: 18px;
|
||||
color: #FFF;
|
||||
color: #fff;
|
||||
border: none;
|
||||
margin-right: 165px;
|
||||
}
|
||||
@ -99,7 +99,7 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
&__inputContainer {
|
||||
&__input-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
max-width: 300px;
|
||||
@ -119,7 +119,7 @@
|
||||
input {
|
||||
outline: none;
|
||||
padding: 8px 12px 9px;
|
||||
background-color: #EFF2F7;
|
||||
background-color: #eff2f7;
|
||||
border-radius: 8px;
|
||||
margin: 10px 0;
|
||||
border: none;
|
||||
|
||||
@ -101,11 +101,11 @@ export const ViewReport = () => {
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div className="viewReport">
|
||||
<div className="view-report">
|
||||
<ProfileHeader />
|
||||
<Navigation />
|
||||
<div className="container">
|
||||
<div className="viewReport__info">
|
||||
<div className="view-report__info">
|
||||
{localStorage.getItem("role_status") !== "18" && (
|
||||
<>
|
||||
<ProfileBreadcrumbs
|
||||
@ -115,13 +115,13 @@ export const ViewReport = () => {
|
||||
{ name: "Просмотр отчета за день", link: "/profile/view" }
|
||||
]}
|
||||
/>
|
||||
<h2 className="viewReport__title">
|
||||
<h2 className="view-report__title">
|
||||
Ваши отчеты - <span>просмотр отчета за день</span>
|
||||
</h2>
|
||||
</>
|
||||
)}
|
||||
<Link
|
||||
className="viewReport__back"
|
||||
className="view-report__back"
|
||||
to={
|
||||
localStorage.getItem("role_status") === "18"
|
||||
? `/profile/employees/report/${params.id}`
|
||||
@ -132,14 +132,14 @@ export const ViewReport = () => {
|
||||
<p>Вернуться</p>
|
||||
</Link>
|
||||
{localStorage.getItem("role_status") !== "18" && (
|
||||
<div className="viewReport__bar">
|
||||
<div className="view-report__bar">
|
||||
<Link
|
||||
to="/profile/calendar/report"
|
||||
onClick={() => dispatch(setEditReport(reportInfo))}
|
||||
className={
|
||||
taskText.length
|
||||
? "viewReport__bar__edit"
|
||||
: "viewReport__bar__edit disable"
|
||||
? "view-report__bar__edit"
|
||||
: "view-report__bar__edit disable"
|
||||
}
|
||||
>
|
||||
Редактировать
|
||||
@ -151,24 +151,24 @@ export const ViewReport = () => {
|
||||
onClick={deleteReport}
|
||||
className={
|
||||
taskText.length
|
||||
? "viewReport__bar__delete"
|
||||
: "viewReport__bar__delete disable"
|
||||
? "view-report__bar__delete"
|
||||
: "view-report__bar__delete disable"
|
||||
}
|
||||
>
|
||||
Удалить отчет
|
||||
Удалить
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
<div className="viewReport__switch-date">
|
||||
<div className="view-report__switch-date">
|
||||
<div onClick={() => previousDay()}>
|
||||
<Link
|
||||
to={`/profile/calendar/view/${getCreatedDate(
|
||||
previousReportDay
|
||||
)}/${params.id}`}
|
||||
>
|
||||
<div className="viewReport__switch-date__prev switch-date">
|
||||
<div className="view-report__switch-date__prev switch-date">
|
||||
<img src={arrowSwitchDate} alt="arrow" />
|
||||
</div>
|
||||
</Link>
|
||||
@ -187,7 +187,7 @@ export const ViewReport = () => {
|
||||
params.id
|
||||
}`}
|
||||
>
|
||||
<div className={`viewReport__switch-date__next switch-date`}>
|
||||
<div className={`view-report__switch-date__next switch-date`}>
|
||||
<img src={arrowSwitchDate} alt="arrow" />
|
||||
</div>
|
||||
</Link>
|
||||
@ -195,13 +195,13 @@ export const ViewReport = () => {
|
||||
</div>
|
||||
{loader && <Loader width={75} height={75} />}
|
||||
{Boolean(taskText.length) && (
|
||||
<div className="viewReport__content">
|
||||
<div className="view-report__content">
|
||||
<div className="table__container">
|
||||
<table className="viewReport__done">
|
||||
<table className="view-report__done">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>
|
||||
<p>Какие задачи выполнены?</p>
|
||||
<p>Выполненные задачи</p>
|
||||
</th>
|
||||
<th>
|
||||
<p>Время</p>
|
||||
@ -219,7 +219,7 @@ export const ViewReport = () => {
|
||||
</p>
|
||||
</td>
|
||||
<td>
|
||||
<div className="viewReport__done__hours__item">
|
||||
<div className="view-report__done__hours__item">
|
||||
<span>{Math.floor(task.hours)}</span>
|
||||
<p className="hours">
|
||||
{hourOfNum(Math.floor(task.hours))}
|
||||
@ -241,15 +241,15 @@ export const ViewReport = () => {
|
||||
</table>
|
||||
</div>
|
||||
{Boolean(difficulties.length) && (
|
||||
<div className="viewReport__item">
|
||||
<h3>Какие сложности возникли?</h3>
|
||||
<div className="view-report__item">
|
||||
<h3>Возникшие сложности</h3>
|
||||
{difficulties.map((item, index) => {
|
||||
return <p key={index}>{item}</p>;
|
||||
})}
|
||||
</div>
|
||||
)}
|
||||
{Boolean(tomorrowTask.length) && (
|
||||
<div className="viewReport__item">
|
||||
<div className="view-report__item">
|
||||
<h3>Что планируется сделать завтра?</h3>
|
||||
{tomorrowTask.map((item, index) => {
|
||||
return <p key={index}>{item}</p>;
|
||||
@ -259,7 +259,7 @@ export const ViewReport = () => {
|
||||
</div>
|
||||
)}
|
||||
{!Boolean(taskText.length) && !loader && (
|
||||
<div className="viewReport__noTask">
|
||||
<div className="view-report__no-task">
|
||||
{localStorage.getItem("role_status") === "4" ? (
|
||||
<p>
|
||||
В этот день вы <span>не заполняли</span> отчет
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
.viewReport {
|
||||
background: #F1F1F1;
|
||||
.view-report {
|
||||
background: #f1f1f1;
|
||||
height: 100%;
|
||||
min-height: 100vh;
|
||||
font-family: 'LabGrotesque', sans-serif;
|
||||
font-family: "LabGrotesque", sans-serif;
|
||||
|
||||
.container {
|
||||
max-width: 1160px;
|
||||
@ -25,7 +25,7 @@
|
||||
line-height: 32px;
|
||||
color: #000000;
|
||||
span {
|
||||
color: #52B709;
|
||||
color: #52b709;
|
||||
}
|
||||
|
||||
@media (max-width: 500px) {
|
||||
@ -56,11 +56,11 @@
|
||||
&__bar {
|
||||
display: flex;
|
||||
margin-top: 20px;
|
||||
background: #FFFFFF;
|
||||
background: #ffffff;
|
||||
border-radius: 12px;
|
||||
padding: 20px 33px;
|
||||
align-items: center;
|
||||
column-gap: 60px;
|
||||
column-gap: 20px;
|
||||
height: 72px;
|
||||
justify-content: space-between;
|
||||
|
||||
@ -78,7 +78,7 @@
|
||||
font-weight: 500;
|
||||
line-height: 32px;
|
||||
padding: 8px 24px;
|
||||
background: #E1FCCF;
|
||||
background: #e1fccf;
|
||||
border-radius: 44px;
|
||||
border: none;
|
||||
|
||||
@ -88,9 +88,14 @@
|
||||
}
|
||||
|
||||
&__delete {
|
||||
background: white;
|
||||
border-radius: 12px;
|
||||
border: 1px dashed #8BCC60;
|
||||
color: #000000;
|
||||
font-size: 15px;
|
||||
font-weight: 500;
|
||||
line-height: 32px;
|
||||
padding: 8px 24px;
|
||||
background: whitesmoke;
|
||||
border-radius: 44px;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.disable {
|
||||
@ -133,7 +138,7 @@
|
||||
.switch-date {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
background: #8DC63F;
|
||||
background: #8dc63f;
|
||||
border-radius: 50px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
@ -178,7 +183,6 @@
|
||||
border-collapse: separate;
|
||||
border-spacing: 28px 0;
|
||||
|
||||
|
||||
@media (max-width: 1205px) {
|
||||
display: grid;
|
||||
border-collapse: collapse;
|
||||
@ -287,7 +291,7 @@
|
||||
|
||||
&__hours {
|
||||
width: 25%;
|
||||
background: #FFFFFF;
|
||||
background: #ffffff;
|
||||
border-radius: 12px;
|
||||
padding: 32px 40px 18px;
|
||||
display: flex;
|
||||
@ -332,7 +336,7 @@
|
||||
span {
|
||||
max-width: 48px;
|
||||
height: 48px;
|
||||
background: #8DC63F;
|
||||
background: #8dc63f;
|
||||
border-radius: 50px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -344,9 +348,8 @@
|
||||
width: 100%;
|
||||
|
||||
@media (max-width: 900px) {
|
||||
max-width: 28px;
|
||||
height: 28px;
|
||||
font-size: 15px;
|
||||
max-width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
@ -369,7 +372,7 @@
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
row-gap: 10px;
|
||||
background: #FFFFFF;
|
||||
background: #ffffff;
|
||||
border-radius: 12px;
|
||||
margin: 20px 0;
|
||||
padding: 15px;
|
||||
@ -399,9 +402,9 @@
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
&__noTask {
|
||||
&__no-task {
|
||||
padding: 25px 10px;
|
||||
background: #FFFFFF;
|
||||
background: #ffffff;
|
||||
border-radius: 12px;
|
||||
text-align: center;
|
||||
|
||||
@ -416,7 +419,7 @@
|
||||
}
|
||||
|
||||
span {
|
||||
color: #8BCC60;
|
||||
color: #8bcc60;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user