Merge branch 'main' into webpack-5

# Conflicts:
#	src/components/ProfileCalendar/ProfileCalendar.js
#	src/hooks/useRequest.js
This commit is contained in:
2023-01-25 16:52:34 +03:00
12 changed files with 545 additions and 26 deletions

View File

@ -1,13 +1,14 @@
import React, { useEffect, useState } from 'react'
import {useDispatch, useSelector} from 'react-redux'
import {currentMonth, getReports} from '../Calendar/calendarHelper'
import { Link } from 'react-router-dom'
import moment from "moment";
import {currentMonth, getReports} from '../Calendar/calendarHelper'
import {ProfileCalendarComponent} from "./ProfileCalendarComponent";
import { Footer } from '../Footer/Footer'
import {Loader} from "../Loader/Loader";
import {ProfileHeader} from "../ProfileHeader/ProfileHeader";
import { Footer } from '../Footer/Footer'
import {urlForLocal} from "../../helper";
@ -25,6 +26,7 @@ export const ProfileCalendar = () => {
const [reports, setReports] = useState([]);
const [totalHours, setTotalHours] = useState(0);
const [requestDates, setRequestDates] = useState('');
const [loader, setLoader] = useState(false)
useEffect(() => {
@ -32,19 +34,23 @@ export const ProfileCalendar = () => {
},[]);
useEffect( () => {
setLoader(true)
if (!requestDates) {
return
}
apiRequest(`/reports/reports-by-date?${requestDates}&user_id=${localStorage.getItem('id')}`)
apiRequest(`/reports/reports-by-date?${requestDates}&user_card_id=${localStorage.getItem('cardId')}`)
.then((reports) => {
let spendTime = 0;
reports.map((report) => {
if (report.spendTime) {
spendTime += Number(report.spendTime)
}
});
for (const report of reports) {
report.task.map((task) => {
if(task.hours_spent) {
spendTime += Number(task.hours_spent)
}
})
}
setTotalHours(spendTime);
setReports(reports)
setLoader(false)
})
}, [requestDates]);
@ -68,14 +74,18 @@ export const ProfileCalendar = () => {
}}>Заполнить отчет за день</button>
</Link>
</div>
<div className='row'>
<div className='col-12 col-xl-12'>
<ProfileCalendarComponent reportsDates={reports} />
<p className='calendar__hours'>
{month} : <span> {totalHours} часов </span>
</p>
{loader ?
<Loader height={80} width={80} />
:
<div className='row'>
<div className='col-12 col-xl-12'>
<ProfileCalendarComponent reportsDates={reports} />
<p className='calendar__hours'>
{month} : <span> {totalHours} часов </span>
</p>
</div>
</div>
</div>
}
</div>
<Footer />
</div>

View File

@ -37,7 +37,7 @@ export const ProfileCalendarComponent = ({reportsDates}) => {
function dayStyles(day) {
if (value < day) return `block`
for (const date of reportsDates) {
if (`${new Date(day).getFullYear()}-${correctDay(new Date(day).getMonth() + 1)}-${correctDay(new Date(day).getDate())}` === date.date) {
if (`${new Date(day).getFullYear()}-${correctDay(new Date(day).getMonth() + 1)}-${correctDay(new Date(day).getDate())}` === date.created_at) {
return `before`
}
}
@ -48,8 +48,8 @@ export const ProfileCalendarComponent = ({reportsDates}) => {
function correctRoute(day) {
for (const date of reportsDates) {
if (`${new Date(day).getFullYear()}-${correctDay(new Date(day).getMonth() + 1)}-${correctDay(new Date(day).getDate())}` === date.date) {
return `../../view/report`
if (`${new Date(day).getFullYear()}-${correctDay(new Date(day).getMonth() + 1)}-${correctDay(new Date(day).getDate())}` === date.created_at) {
return `../view`
}
}
return '../../report'

View File

@ -16,6 +16,15 @@
.summary__info {
padding-right: 25px;
}
.loader {
margin: 20px 0 50px;
&:hover {
path {
fill: #ffffff;
}
}
}
.profile__calendar {
margin-top: 20px;
}

View File

@ -1,6 +1,6 @@
import React, {useState} from 'react'
import {useSelector} from 'react-redux'
import {Link} from 'react-router-dom'
import {Link, useNavigate} from 'react-router-dom'
import {Loader} from '../Loader/Loader'
import {currentMonthAndDay} from '../Calendar/calendarHelper'
@ -33,10 +33,11 @@ const getCreatedDate = (day) => {
};
const ReportForm = () => {
const navigate= useNavigate();
const reportDate = useSelector(getReportDate);
const [isFetching, setIsFetching] = useState(false);
const [reportSuccess, setReportSuccess] = useState(false);
const [reportSuccess, setReportSuccess] = useState('');
const [inputs, setInputs] = useState([{task: '', hours_spent: '', minutes_spent: 0}]);
const [troublesInputValue, setTroublesInputValue] = useState('');
@ -55,6 +56,11 @@ const ReportForm = () => {
};
const handler = () => {
if(!inputs[0].task) {
setReportSuccess('Заполните задачи');
setTimeout(() => setReportSuccess(''), 1000)
return
}
apiRequest('/reports/create', {
method: 'POST',
data: {
@ -65,10 +71,11 @@ const ReportForm = () => {
status: 1,
},
}).then((res) => {
if (res.status === 200) {
setReportSuccess(true);
setTimeout(() => setReportSuccess(false), 2000)
}
setReportSuccess('Отчет отправлен');
setTimeout(() => {
setReportSuccess('')
navigate('/profile/calendar');
}, 1000)
setInputs(() => []);
setTroublesInputValue('');
setScheduledInputValue('');
@ -188,7 +195,7 @@ const ReportForm = () => {
Всего за день : <span>{totalHours} часов</span>
</p>
{reportSuccess &&
<p className='report-form__footer-done'>Отчет отправлен</p>
<p className={`report-form__footer-done ${reportSuccess === 'Заполните задачи' ? 'errorText' : ''}`}>{reportSuccess}</p>
}
</div>
</div>

View File

@ -314,6 +314,11 @@
font-weight: 500;
margin-left: 20px;
}
.errorText {
color: #bf3c3c;
font-weight: 600;
}
}
&__form {