trackerTask #17
@ -10,19 +10,19 @@ import ModalLayout from "@components/Common/ModalLayout/ModalLayout";
|
|||||||
import anyMoment from "assets/icons/anyMoment.svg";
|
import anyMoment from "assets/icons/anyMoment.svg";
|
||||||
import doc from "assets/icons/doc.svg";
|
import doc from "assets/icons/doc.svg";
|
||||||
import telegramLogo from "assets/icons/tgLogo.svg";
|
import telegramLogo from "assets/icons/tgLogo.svg";
|
||||||
import accept from "assets/images/accept.png"
|
import accept from "assets/images/accept.png";
|
||||||
|
|
||||||
import "./modalRegistration.scss";
|
import "./modalRegistration.scss";
|
||||||
|
|
||||||
export const ModalRegistration = ({ active, setActive }) => {
|
export const ModalRegistration = ({ active, setActive }) => {
|
||||||
const [loader, setLoader] = useState(false);
|
const [loader, setLoader] = useState(false);
|
||||||
const [isPartner, setIsPartner] = useState(false)
|
const [isPartner, setIsPartner] = useState(false);
|
||||||
|
|
||||||
const fields = {
|
const fields = {
|
||||||
username: "",
|
username: "",
|
||||||
email: "",
|
email: "",
|
||||||
password: "",
|
password: "",
|
||||||
secondPassword: "",
|
secondPassword: ""
|
||||||
};
|
};
|
||||||
const closeModal = () => {
|
const closeModal = () => {
|
||||||
setActive(false);
|
setActive(false);
|
||||||
@ -125,10 +125,13 @@ export const ModalRegistration = ({ active, setActive }) => {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="input_checkbox" onClick={() => setIsPartner(!isPartner)}>
|
<div
|
||||||
|
className="input_checkbox"
|
||||||
|
onClick={() => setIsPartner(!isPartner)}
|
||||||
|
>
|
||||||
<p>Партнер:</p>
|
<p>Партнер:</p>
|
||||||
<span className={isPartner ? "checkbox--active" : ""}>
|
<span className={isPartner ? "checkbox--active" : ""}>
|
||||||
{isPartner ? <img src={accept} alt='accept' /> : ""}
|
{isPartner ? <img src={accept} alt="accept" /> : ""}
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -7,9 +7,9 @@ import { Link, Navigate } from "react-router-dom";
|
|||||||
import { getProfileInfo } from "@redux/outstaffingSlice";
|
import { getProfileInfo } from "@redux/outstaffingSlice";
|
||||||
import {
|
import {
|
||||||
getRequestDates,
|
getRequestDates,
|
||||||
|
setEditReport,
|
||||||
setReportDate,
|
setReportDate,
|
||||||
setRequestDate,
|
setRequestDate
|
||||||
setEditReport
|
|
||||||
} from "@redux/reportSlice";
|
} from "@redux/reportSlice";
|
||||||
|
|
||||||
import { urlForLocal } from "@utils/helper";
|
import { urlForLocal } from "@utils/helper";
|
||||||
@ -103,8 +103,8 @@ export const ProfileCalendar = () => {
|
|||||||
<button
|
<button
|
||||||
className="calendar__btn"
|
className="calendar__btn"
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
dispatch(setReportDate(""))
|
dispatch(setReportDate(""));
|
||||||
dispatch(setEditReport(""))
|
dispatch(setEditReport(""));
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
Заполнить отчет
|
Заполнить отчет
|
||||||
|
@ -5,10 +5,10 @@ import { useDispatch } from "react-redux";
|
|||||||
import { Link } from "react-router-dom";
|
import { Link } from "react-router-dom";
|
||||||
|
|
||||||
import {
|
import {
|
||||||
|
setEditReport,
|
||||||
setReportDate,
|
setReportDate,
|
||||||
setRequestDate,
|
setRequestDate,
|
||||||
setSendRequest,
|
setSendRequest
|
||||||
setEditReport
|
|
||||||
} from "@redux/reportSlice";
|
} from "@redux/reportSlice";
|
||||||
|
|
||||||
import { getCorrectYYMMDD } from "@utils/helper";
|
import { getCorrectYYMMDD } from "@utils/helper";
|
||||||
@ -236,7 +236,7 @@ export const ProfileCalendarComponent = React.memo(
|
|||||||
else {
|
else {
|
||||||
dispatch(setReportDate(day));
|
dispatch(setReportDate(day));
|
||||||
dispatch(setSendRequest(true));
|
dispatch(setSendRequest(true));
|
||||||
dispatch(setEditReport(""))
|
dispatch(setEditReport(""));
|
||||||
}
|
}
|
||||||
}}
|
}}
|
||||||
onMouseEnter={() => {
|
onMouseEnter={() => {
|
||||||
|
@ -3,11 +3,11 @@ import React, { useEffect, useState } from "react";
|
|||||||
import DatePicker, { registerLocale } from "react-datepicker";
|
import DatePicker, { registerLocale } from "react-datepicker";
|
||||||
import "react-datepicker/dist/react-datepicker.css";
|
import "react-datepicker/dist/react-datepicker.css";
|
||||||
import { useSelector } from "react-redux";
|
import { useSelector } from "react-redux";
|
||||||
|
import { useDispatch } from "react-redux";
|
||||||
import { Link, Navigate, useNavigate } from "react-router-dom";
|
import { Link, Navigate, useNavigate } from "react-router-dom";
|
||||||
|
|
||||||
import { getReportDate, getEditReport } from "@redux/reportSlice";
|
import { getEditReport, getReportDate } from "@redux/reportSlice";
|
||||||
import { setEditReport } from "@redux/reportSlice";
|
import { setEditReport } from "@redux/reportSlice";
|
||||||
import { useDispatch } from "react-redux";
|
|
||||||
|
|
||||||
import { apiRequest } from "@api/request";
|
import { apiRequest } from "@api/request";
|
||||||
|
|
||||||
@ -37,10 +37,9 @@ const ReportForm = () => {
|
|||||||
}
|
}
|
||||||
const navigate = useNavigate();
|
const navigate = useNavigate();
|
||||||
const reportDate = useSelector(getReportDate);
|
const reportDate = useSelector(getReportDate);
|
||||||
const editReport = useSelector(getEditReport)
|
const editReport = useSelector(getEditReport);
|
||||||
const dispatch = useDispatch();
|
const dispatch = useDispatch();
|
||||||
|
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
initListeners();
|
initListeners();
|
||||||
}, []);
|
}, []);
|
||||||
@ -48,15 +47,23 @@ const ReportForm = () => {
|
|||||||
const [isFetching, setIsFetching] = useState(false);
|
const [isFetching, setIsFetching] = useState(false);
|
||||||
const [reportSuccess, setReportSuccess] = useState("");
|
const [reportSuccess, setReportSuccess] = useState("");
|
||||||
const [startDate, setStartDate] = useState(
|
const [startDate, setStartDate] = useState(
|
||||||
reportDate || editReport ? new Date(reportDate ? reportDate._d : editReport.created_at) : new Date()
|
reportDate || editReport
|
||||||
|
? new Date(reportDate ? reportDate._d : editReport.created_at)
|
||||||
|
: new Date()
|
||||||
);
|
);
|
||||||
const [datePickerOpen, setDatePickerOpen] = useState(false);
|
const [datePickerOpen, setDatePickerOpen] = useState(false);
|
||||||
|
|
||||||
const [inputs, setInputs] = useState(editReport ? editReport.task : [
|
const [inputs, setInputs] = useState(
|
||||||
{ task: "", hours_spent: "", minutes_spent: 0 }
|
editReport
|
||||||
]);
|
? editReport.task
|
||||||
const [troublesInputValue, setTroublesInputValue] = useState(editReport ? editReport.difficulties :"");
|
: [{ task: "", hours_spent: "", minutes_spent: 0 }]
|
||||||
const [scheduledInputValue, setScheduledInputValue] = useState(editReport ? editReport.tomorrow : "");
|
);
|
||||||
|
const [troublesInputValue, setTroublesInputValue] = useState(
|
||||||
|
editReport ? editReport.difficulties : ""
|
||||||
|
);
|
||||||
|
const [scheduledInputValue, setScheduledInputValue] = useState(
|
||||||
|
editReport ? editReport.tomorrow : ""
|
||||||
|
);
|
||||||
|
|
||||||
const addInput = () => {
|
const addInput = () => {
|
||||||
setInputs((prev) => [
|
setInputs((prev) => [
|
||||||
@ -118,7 +125,7 @@ const ReportForm = () => {
|
|||||||
navigate("/profile/calendar");
|
navigate("/profile/calendar");
|
||||||
}, 1000);
|
}, 1000);
|
||||||
setIsFetching(false);
|
setIsFetching(false);
|
||||||
clearParams()
|
clearParams();
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -148,17 +155,17 @@ const ReportForm = () => {
|
|||||||
navigate("/profile/calendar");
|
navigate("/profile/calendar");
|
||||||
}, 1000);
|
}, 1000);
|
||||||
setIsFetching(false);
|
setIsFetching(false);
|
||||||
clearParams()
|
clearParams();
|
||||||
dispatch(setEditReport(""))
|
dispatch(setEditReport(""));
|
||||||
});
|
});
|
||||||
}
|
};
|
||||||
|
|
||||||
const clearParams = () => {
|
const clearParams = () => {
|
||||||
setInputs(() => []);
|
setInputs(() => []);
|
||||||
setTroublesInputValue("");
|
setTroublesInputValue("");
|
||||||
setScheduledInputValue("");
|
setScheduledInputValue("");
|
||||||
setInputs(() => [{ task: "", hours_spent: "", minutes_spent: 0 }]);
|
setInputs(() => [{ task: "", hours_spent: "", minutes_spent: 0 }]);
|
||||||
}
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<section className="report-form">
|
<section className="report-form">
|
||||||
@ -173,7 +180,8 @@ const ReportForm = () => {
|
|||||||
]}
|
]}
|
||||||
/>
|
/>
|
||||||
<h2 className="summary__title">
|
<h2 className="summary__title">
|
||||||
Ваши отчеты - <span>{editReport ? "редактировать отчет" : "добавить отчет"}</span>
|
Ваши отчеты -{" "}
|
||||||
|
<span>{editReport ? "редактировать отчет" : "добавить отчет"}</span>
|
||||||
</h2>
|
</h2>
|
||||||
<div>
|
<div>
|
||||||
<div className="report__head">
|
<div className="report__head">
|
||||||
@ -187,12 +195,14 @@ const ReportForm = () => {
|
|||||||
<div className="report-form__content">
|
<div className="report-form__content">
|
||||||
<div className="report-form__block">
|
<div className="report-form__block">
|
||||||
<div className="report-form__block-title">
|
<div className="report-form__block-title">
|
||||||
<h2>{editReport ? "Редактирование отчета за день" : "Добавление отчета за день"}</h2>
|
<h2>
|
||||||
|
{editReport
|
||||||
|
? "Редактирование отчета за день"
|
||||||
|
: "Добавление отчета за день"}
|
||||||
|
</h2>
|
||||||
<h3>Дата заполнения отчета:</h3>
|
<h3>Дата заполнения отчета:</h3>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div className="report-form__block-img">
|
||||||
className="report-form__block-img"
|
|
||||||
>
|
|
||||||
<img
|
<img
|
||||||
className="report-form__calendar-icon"
|
className="report-form__calendar-icon"
|
||||||
src={calendarIcon}
|
src={calendarIcon}
|
||||||
@ -339,10 +349,10 @@ const ReportForm = () => {
|
|||||||
<button
|
<button
|
||||||
className="report-form__footer-btn"
|
className="report-form__footer-btn"
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
if(editReport) {
|
if (editReport) {
|
||||||
handleEditReport()
|
handleEditReport();
|
||||||
} else {
|
} else {
|
||||||
handler()
|
handler();
|
||||||
}
|
}
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
|
@ -12,7 +12,6 @@ export const useFormValidation = (
|
|||||||
// Состояние формы, содержащее значения полей
|
// Состояние формы, содержащее значения полей
|
||||||
const [formData, setFormData] = useState(fields);
|
const [formData, setFormData] = useState(fields);
|
||||||
|
|
||||||
|
|
||||||
// Состояние ошибок валидации
|
// Состояние ошибок валидации
|
||||||
const [validationErrors, setValidationErrors] = useState({});
|
const [validationErrors, setValidationErrors] = useState({});
|
||||||
|
|
||||||
|
@ -161,7 +161,8 @@ export const PartnerCategories = () => {
|
|||||||
<Loader style={"green"} height={80} width={80} />
|
<Loader style={"green"} height={80} width={80} />
|
||||||
) : (
|
) : (
|
||||||
<div className="partnerCategories__items">
|
<div className="partnerCategories__items">
|
||||||
{Boolean(staff) ? staff.map((card) => {
|
{Boolean(staff) ? (
|
||||||
|
staff.map((card) => {
|
||||||
return (
|
return (
|
||||||
<PartnerPersonCard
|
<PartnerPersonCard
|
||||||
key={card.id}
|
key={card.id}
|
||||||
@ -170,7 +171,12 @@ export const PartnerCategories = () => {
|
|||||||
userId={card.user_id}
|
userId={card.user_id}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
}) : <span className="partnerCategories__empty">У вас нет нанятого персонала</span>}
|
})
|
||||||
|
) : (
|
||||||
|
<span className="partnerCategories__empty">
|
||||||
|
У вас нет нанятого персонала
|
||||||
|
</span>
|
||||||
|
)}
|
||||||
{/*{personalInfoItems.map((item, index) => {*/}
|
{/*{personalInfoItems.map((item, index) => {*/}
|
||||||
{/* return (*/}
|
{/* return (*/}
|
||||||
{/* <Link*/}
|
{/* <Link*/}
|
||||||
|
@ -43,6 +43,7 @@ import TrackerSelectColumn from "@components/TrackerSelectColumn/TrackerSelectCo
|
|||||||
|
|
||||||
import arrow from "assets/icons/arrows/arrowCalendar.png";
|
import arrow from "assets/icons/arrows/arrowCalendar.png";
|
||||||
import arrowDown from "assets/icons/arrows/selectArrow.png";
|
import arrowDown from "assets/icons/arrows/selectArrow.png";
|
||||||
|
import calendarIcon from "assets/icons/calendar.svg";
|
||||||
import close from "assets/icons/close.png";
|
import close from "assets/icons/close.png";
|
||||||
import commentsBoard from "assets/icons/commentsBoard.svg";
|
import commentsBoard from "assets/icons/commentsBoard.svg";
|
||||||
import del from "assets/icons/delete.svg";
|
import del from "assets/icons/delete.svg";
|
||||||
@ -54,7 +55,6 @@ import tasks from "assets/icons/trackerTasks.svg";
|
|||||||
import accept from "assets/images/accept.png";
|
import accept from "assets/images/accept.png";
|
||||||
import archive from "assets/images/archiveIcon.png";
|
import archive from "assets/images/archiveIcon.png";
|
||||||
import avatarMok from "assets/images/avatarMok.png";
|
import avatarMok from "assets/images/avatarMok.png";
|
||||||
import calendarIcon from "assets/icons/calendar.svg";
|
|
||||||
|
|
||||||
import { getCorrectDate } from "../../components/Calendar/calendarHelper";
|
import { getCorrectDate } from "../../components/Calendar/calendarHelper";
|
||||||
|
|
||||||
|
@ -1,9 +1,10 @@
|
|||||||
import React, { useEffect, useState } from "react";
|
import React, { useEffect, useState } from "react";
|
||||||
|
import { useDispatch } from "react-redux";
|
||||||
import { Link, useParams } from "react-router-dom";
|
import { Link, useParams } from "react-router-dom";
|
||||||
|
|
||||||
import { apiRequest } from "@api/request";
|
|
||||||
import { setEditReport } from "@redux/reportSlice";
|
import { setEditReport } from "@redux/reportSlice";
|
||||||
import { useDispatch } from "react-redux";
|
|
||||||
|
import { apiRequest } from "@api/request";
|
||||||
|
|
||||||
import {
|
import {
|
||||||
getCorrectDate,
|
getCorrectDate,
|
||||||
@ -35,7 +36,7 @@ export const ViewReport = () => {
|
|||||||
const [currentDay] = useState(new Date());
|
const [currentDay] = useState(new Date());
|
||||||
const [loader, setLoader] = useState(false);
|
const [loader, setLoader] = useState(false);
|
||||||
const [deleteLoader, setDeleteLoader] = useState(false);
|
const [deleteLoader, setDeleteLoader] = useState(false);
|
||||||
const [reportInfo, setReportInfo] = useState({})
|
const [reportInfo, setReportInfo] = useState({});
|
||||||
|
|
||||||
function getReportFromDate(day) {
|
function getReportFromDate(day) {
|
||||||
setLoader(true);
|
setLoader(true);
|
||||||
@ -45,7 +46,7 @@ export const ViewReport = () => {
|
|||||||
apiRequest(`reports/find-by-date?user_id=${params.id}&date=${day}`).then(
|
apiRequest(`reports/find-by-date?user_id=${params.id}&date=${day}`).then(
|
||||||
(res) => {
|
(res) => {
|
||||||
let spendTime = 0;
|
let spendTime = 0;
|
||||||
setReportInfo(res[0])
|
setReportInfo(res[0]);
|
||||||
setTaskId(res[0]?.id);
|
setTaskId(res[0]?.id);
|
||||||
for (const item of res) {
|
for (const item of res) {
|
||||||
if (item.difficulties) {
|
if (item.difficulties) {
|
||||||
@ -132,7 +133,17 @@ export const ViewReport = () => {
|
|||||||
</Link>
|
</Link>
|
||||||
{localStorage.getItem("role_status") !== "18" && (
|
{localStorage.getItem("role_status") !== "18" && (
|
||||||
<div className="viewReport__bar">
|
<div className="viewReport__bar">
|
||||||
<Link to="/profile/calendar/report" onClick={() => dispatch(setEditReport(reportInfo))} className={taskText.length ? "viewReport__bar__edit" : "viewReport__bar__edit disable"}>Редактировать</Link>
|
<Link
|
||||||
|
to="/profile/calendar/report"
|
||||||
|
onClick={() => dispatch(setEditReport(reportInfo))}
|
||||||
|
className={
|
||||||
|
taskText.length
|
||||||
|
? "viewReport__bar__edit"
|
||||||
|
: "viewReport__bar__edit disable"
|
||||||
|
}
|
||||||
|
>
|
||||||
|
Редактировать
|
||||||
|
</Link>
|
||||||
{deleteLoader ? (
|
{deleteLoader ? (
|
||||||
<Loader style={"green"} />
|
<Loader style={"green"} />
|
||||||
) : (
|
) : (
|
||||||
|
@ -25,13 +25,18 @@ export const reportSlice = createSlice({
|
|||||||
state.sendRequest = action.payload;
|
state.sendRequest = action.payload;
|
||||||
},
|
},
|
||||||
setEditReport: (state, action) => {
|
setEditReport: (state, action) => {
|
||||||
state.editReport = action.payload
|
state.editReport = action.payload;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
export const { dateSelected, setReportDate, setRequestDate, setSendRequest, setEditReport } =
|
export const {
|
||||||
reportSlice.actions;
|
dateSelected,
|
||||||
|
setReportDate,
|
||||||
|
setRequestDate,
|
||||||
|
setSendRequest,
|
||||||
|
setEditReport
|
||||||
|
} = reportSlice.actions;
|
||||||
|
|
||||||
export const selectDate = (state) => state.report.dateSelected;
|
export const selectDate = (state) => state.report.dateSelected;
|
||||||
|
|
||||||
@ -41,6 +46,6 @@ export const getRequestDates = (state) => state.report.requestDates;
|
|||||||
|
|
||||||
export const getSendRequest = (state) => state.report.sendRequest;
|
export const getSendRequest = (state) => state.report.sendRequest;
|
||||||
|
|
||||||
export const getEditReport = (state) => state.report.editReport
|
export const getEditReport = (state) => state.report.editReport;
|
||||||
|
|
||||||
export default reportSlice.reducer;
|
export default reportSlice.reducer;
|
||||||
|
Loading…
Reference in New Issue
Block a user