Compare commits
3 Commits
78b5bdfac8
...
5e7c9dec79
Author | SHA1 | Date | |
---|---|---|---|
|
5e7c9dec79 | ||
|
fc5d67dc2d | ||
|
72766efa39 |
@ -34,7 +34,7 @@ export const Footer = () => {
|
|||||||
<img src={tg} alt="tg" width={24} />
|
<img src={tg} alt="tg" width={24} />
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<p>Войти в команду</p>
|
<p>Присоединиться к команде</p>
|
||||||
</div>
|
</div>
|
||||||
<div className="footer__info">
|
<div className="footer__info">
|
||||||
<div className="footer__mail">
|
<div className="footer__mail">
|
||||||
|
@ -24,7 +24,6 @@ import {
|
|||||||
hourOfNum
|
hourOfNum
|
||||||
} from "@components/Calendar/calendarHelper";
|
} from "@components/Calendar/calendarHelper";
|
||||||
import BaseButton from "@components/Common/BaseButton/BaseButton";
|
import BaseButton from "@components/Common/BaseButton/BaseButton";
|
||||||
import ShortReport from "@components/ShortReport/ShortReport";
|
|
||||||
|
|
||||||
import arrow from "assets/icons/arrows/arrowCalendar.png";
|
import arrow from "assets/icons/arrows/arrowCalendar.png";
|
||||||
import calendarIcon from "assets/icons/calendar.svg";
|
import calendarIcon from "assets/icons/calendar.svg";
|
||||||
@ -46,7 +45,6 @@ export const ProfileCalendarComponent = React.memo(
|
|||||||
|
|
||||||
const [calendar, setCalendar] = useState([]);
|
const [calendar, setCalendar] = useState([]);
|
||||||
const [month, setMonth] = useState("");
|
const [month, setMonth] = useState("");
|
||||||
const [shortReport, setShortReport] = useState(false);
|
|
||||||
const [endDate, setEndDate] = useState(null);
|
const [endDate, setEndDate] = useState(null);
|
||||||
const [totalRangeHours, setTotalRangeHours] = useState(0);
|
const [totalRangeHours, setTotalRangeHours] = useState(0);
|
||||||
const [selectedRangeDays, setSelectedRangeDays] = useState({});
|
const [selectedRangeDays, setSelectedRangeDays] = useState({});
|
||||||
@ -96,7 +94,7 @@ export const ProfileCalendarComponent = React.memo(
|
|||||||
new Date(day).getMonth() + 1
|
new Date(day).getMonth() + 1
|
||||||
)}-${correctDay(new Date(day).getDate())}` === date.created_at
|
)}-${correctDay(new Date(day).getDate())}` === date.created_at
|
||||||
) {
|
) {
|
||||||
return "#";
|
return `../view/${date.created_at}`;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
return "../../report";
|
return "../../report";
|
||||||
@ -142,29 +140,12 @@ export const ProfileCalendarComponent = React.memo(
|
|||||||
|
|
||||||
function onMouseRangeDays(day) {
|
function onMouseRangeDays(day) {
|
||||||
let selectRange = {};
|
let selectRange = {};
|
||||||
for (let curDay in selectedRangeDays) {
|
for (let curDay in selectedRangeDays)
|
||||||
if (day > startDate) {
|
selectRange[curDay] =
|
||||||
if (
|
day > startDate
|
||||||
day > startDate &&
|
? new Date(curDay) > startDate && new Date(curDay) < day
|
||||||
new Date(curDay) > startDate &&
|
: new Date(curDay) < startDate && new Date(curDay) > day;
|
||||||
new Date(curDay) < day
|
|
||||||
) {
|
|
||||||
selectRange[curDay] = true;
|
|
||||||
} else {
|
|
||||||
selectRange[curDay] = false;
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
if (
|
|
||||||
day < startDate &&
|
|
||||||
new Date(curDay) < startDate &&
|
|
||||||
new Date(curDay) > day
|
|
||||||
) {
|
|
||||||
selectRange[curDay] = true;
|
|
||||||
} else {
|
|
||||||
selectRange[curDay] = false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
setSelectedRangeDays(selectRange);
|
setSelectedRangeDays(selectRange);
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -239,18 +220,15 @@ export const ProfileCalendarComponent = React.memo(
|
|||||||
week.map((day) => (
|
week.map((day) => (
|
||||||
<button
|
<button
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
if (startRangeDays) {
|
if (startRangeDays) rangeDays(day);
|
||||||
rangeDays(day);
|
else {
|
||||||
} else {
|
|
||||||
dispatch(setReportDate(day));
|
dispatch(setReportDate(day));
|
||||||
setShortReport(true);
|
|
||||||
dispatch(setSendRequest(true));
|
dispatch(setSendRequest(true));
|
||||||
}
|
}
|
||||||
}}
|
}}
|
||||||
onMouseEnter={() => {
|
onMouseEnter={() => {
|
||||||
if (startRangeDays && startDate && !endDate) {
|
if (startRangeDays && startDate && !endDate)
|
||||||
onMouseRangeDays(day);
|
onMouseRangeDays(day);
|
||||||
}
|
|
||||||
}}
|
}}
|
||||||
key={day}
|
key={day}
|
||||||
className={
|
className={
|
||||||
@ -295,15 +273,15 @@ export const ProfileCalendarComponent = React.memo(
|
|||||||
? `${getCorrectDate(startDate)} - ${getCorrectDate(endDate)}`
|
? `${getCorrectDate(startDate)} - ${getCorrectDate(endDate)}`
|
||||||
: `${getCorrectDate(endDate)} - ${getCorrectDate(startDate)}`
|
: `${getCorrectDate(endDate)} - ${getCorrectDate(startDate)}`
|
||||||
: activePeriod
|
: activePeriod
|
||||||
? "Выберите диапазон на календаре"
|
? "Выберите диапазон на календаре"
|
||||||
: "Выбрать диапазон"}
|
: "Выбрать диапазон"}
|
||||||
</span>
|
</span>
|
||||||
<span>
|
<span>
|
||||||
{totalRangeHours
|
{totalRangeHours
|
||||||
? `${totalRangeHours} ${hourOfNum(totalRangeHours)}`
|
? `${totalRangeHours} ${hourOfNum(totalRangeHours)}`
|
||||||
: endDate
|
: endDate
|
||||||
? "0 часов"
|
? "0 часов"
|
||||||
: ""}
|
: ""}
|
||||||
</span>
|
</span>
|
||||||
{endDate && (
|
{endDate && (
|
||||||
<BaseButton
|
<BaseButton
|
||||||
@ -318,7 +296,6 @@ export const ProfileCalendarComponent = React.memo(
|
|||||||
</BaseButton>
|
</BaseButton>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
{shortReport && <ShortReport />}
|
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -170,7 +170,7 @@ const ReportForm = () => {
|
|||||||
/>
|
/>
|
||||||
<div className="report-form__task-list">
|
<div className="report-form__task-list">
|
||||||
<img src={ellipse} alt="" />
|
<img src={ellipse} alt="" />
|
||||||
<span>Какие задачи были выполнены?</span>
|
<span>Какие задачи выполнены?</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -166,7 +166,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 610px) {
|
@media (max-width: 610px) {
|
||||||
margin-left: 85px;
|
margin-left: 80px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -472,12 +472,6 @@
|
|||||||
max-width: 141px;
|
max-width: 141px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&-list {
|
|
||||||
img {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -59,13 +59,12 @@ export const ViewReport = () => {
|
|||||||
task: task.task,
|
task: task.task,
|
||||||
id: task.id
|
id: task.id
|
||||||
};
|
};
|
||||||
if (task.hours_spent) {
|
spendTime += Math.floor(task.hours_spent);
|
||||||
spendTime += Number(task.hours_spent);
|
|
||||||
}
|
|
||||||
setTaskText((prevArray) => [...prevArray, taskInfo]);
|
setTaskText((prevArray) => [...prevArray, taskInfo]);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
setTotalHours(spendTime);
|
setTotalHours(Math.floor(spendTime));
|
||||||
setLoader(false);
|
setLoader(false);
|
||||||
});
|
});
|
||||||
previousReportDay.setDate(previousReportDay.getDate() - 1);
|
previousReportDay.setDate(previousReportDay.getDate() - 1);
|
||||||
@ -106,7 +105,7 @@ export const ViewReport = () => {
|
|||||||
<img src={arrow} alt="#" />
|
<img src={arrow} alt="#" />
|
||||||
<p>Вернуться</p>
|
<p>Вернуться</p>
|
||||||
</Link>
|
</Link>
|
||||||
<div className="viewReport__bar">
|
{/* <div className="viewReport__bar">
|
||||||
<h3 className="viewReport__bar__date">
|
<h3 className="viewReport__bar__date">
|
||||||
{getCorrectDate(dateReport.id)}
|
{getCorrectDate(dateReport.id)}
|
||||||
</h3>
|
</h3>
|
||||||
@ -116,16 +115,12 @@ export const ViewReport = () => {
|
|||||||
{totalHours} {hourOfNum(totalHours)}
|
{totalHours} {hourOfNum(totalHours)}
|
||||||
</span>
|
</span>
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div> */}
|
||||||
</div>
|
</div>
|
||||||
<div className="viewReport__switchDate">
|
<div className="viewReport__switch-date">
|
||||||
<div
|
<div onClick={() => previousDay()}>
|
||||||
onClick={() => {
|
|
||||||
previousDay();
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<Link to={`../view/${getCreatedDate(previousReportDay)}`}>
|
<Link to={`../view/${getCreatedDate(previousReportDay)}`}>
|
||||||
<div className="viewReport__switchDate__prev switchDate">
|
<div className="viewReport__switch-date__prev switch-date">
|
||||||
<img src={arrowSwitchDate} alt="arrow" />
|
<img src={arrowSwitchDate} alt="arrow" />
|
||||||
</div>
|
</div>
|
||||||
</Link>
|
</Link>
|
||||||
@ -140,7 +135,7 @@ export const ViewReport = () => {
|
|||||||
}`}
|
}`}
|
||||||
>
|
>
|
||||||
<Link to={`../view/${getCreatedDate(nextReportDay)}`}>
|
<Link to={`../view/${getCreatedDate(nextReportDay)}`}>
|
||||||
<div className={`viewReport__switchDate__next switchDate`}>
|
<div className={`viewReport__switch-date__next switch-date`}>
|
||||||
<img src={arrowSwitchDate} alt="arrow" />
|
<img src={arrowSwitchDate} alt="arrow" />
|
||||||
</div>
|
</div>
|
||||||
</Link>
|
</Link>
|
||||||
@ -154,7 +149,7 @@ export const ViewReport = () => {
|
|||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th>
|
<th>
|
||||||
<p>Какие задачи были выполнены?</p>
|
<p>Какие задачи выполнены?</p>
|
||||||
</th>
|
</th>
|
||||||
<th>
|
<th>
|
||||||
<p>Время</p>
|
<p>Время</p>
|
||||||
@ -173,9 +168,9 @@ export const ViewReport = () => {
|
|||||||
</td>
|
</td>
|
||||||
<td>
|
<td>
|
||||||
<div className="viewReport__done__hours__item">
|
<div className="viewReport__done__hours__item">
|
||||||
<span>{task.hours}</span>
|
<span>{Math.floor(task.hours)}</span>
|
||||||
<p className="hours">
|
<p className="hours">
|
||||||
{hourOfNum(task.hours)} на задачу
|
{hourOfNum(Math.floor(task.hours))}
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</td>
|
</td>
|
||||||
|
@ -139,11 +139,11 @@
|
|||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
&__switchDate {
|
&__switch-date {
|
||||||
display: flex;
|
display: flex;
|
||||||
margin: 30px 0;
|
margin: 20px 0;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
column-gap: 140px;
|
column-gap: 30px;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|
||||||
@media (max-width: 500px) {
|
@media (max-width: 500px) {
|
||||||
@ -158,7 +158,7 @@
|
|||||||
color: #000000;
|
color: #000000;
|
||||||
}
|
}
|
||||||
|
|
||||||
.switchDate {
|
.switch-date {
|
||||||
width: 48px;
|
width: 48px;
|
||||||
height: 48px;
|
height: 48px;
|
||||||
background: #8DC63F;
|
background: #8DC63F;
|
||||||
@ -396,15 +396,11 @@
|
|||||||
&__item {
|
&__item {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
row-gap: 22px;
|
row-gap: 10px;
|
||||||
background: #FFFFFF;
|
background: #FFFFFF;
|
||||||
border-radius: 12px;
|
border-radius: 12px;
|
||||||
margin: 25px 0;
|
margin: 20px 0;
|
||||||
padding: 25px 35px;
|
padding: 15px;
|
||||||
|
|
||||||
@media (max-width: 650px) {
|
|
||||||
padding: 15px 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
h3 {
|
h3 {
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
@ -420,11 +416,9 @@
|
|||||||
p {
|
p {
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
font-size: 15px;
|
font-size: 15px;
|
||||||
line-height: 20px;
|
|
||||||
|
|
||||||
@media (max-width: 650px) {
|
@media (max-width: 650px) {
|
||||||
font-size: 10px;
|
font-size: 13px;
|
||||||
line-height: 18px;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user