partner reg, fix employers bug, edit report

src/components/ReportForm/ReportForm.jsx

@@ -5,7 +5,9 @@ import "react-datepicker/dist/react-datepicker.css";
 import { useSelector } from "react-redux";
 import { Link, Navigate, useNavigate } from "react-router-dom";
 
-import { getReportDate } from "@redux/reportSlice";
+import { getReportDate, getEditReport } from "@redux/reportSlice";
+import { setEditReport } from "@redux/reportSlice";
+import { useDispatch } from "react-redux";
 
 import { apiRequest } from "@api/request";
 
@@ -35,6 +37,9 @@ const ReportForm = () => {
   }
   const navigate = useNavigate();
   const reportDate = useSelector(getReportDate);
+  const editReport = useSelector(getEditReport)
+  const dispatch = useDispatch();
+
 
   useEffect(() => {
     initListeners();
@@ -43,15 +48,15 @@ const ReportForm = () => {
   const [isFetching, setIsFetching] = useState(false);
   const [reportSuccess, setReportSuccess] = useState("");
   const [startDate, setStartDate] = useState(
-    reportDate ? new Date(reportDate._d) : new Date()
+    reportDate || editReport ? new Date(reportDate ? reportDate._d : editReport.created_at) : new Date()
   );
   const [datePickerOpen, setDatePickerOpen] = useState(false);
 
-  const [inputs, setInputs] = useState([
+  const [inputs, setInputs] = useState(editReport ? editReport.task : [
     { task: "", hours_spent: "", minutes_spent: 0 }
   ]);
-  const [troublesInputValue, setTroublesInputValue] = useState("");
-  const [scheduledInputValue, setScheduledInputValue] = useState("");
+  const [troublesInputValue, setTroublesInputValue] = useState(editReport ? editReport.difficulties :"");
+  const [scheduledInputValue, setScheduledInputValue] = useState(editReport ? editReport.tomorrow : "");
 
   const addInput = () => {
     setInputs((prev) => [
@@ -112,14 +117,49 @@ const ReportForm = () => {
         setReportSuccess("");
         navigate("/profile/calendar");
       }, 1000);
-      setInputs(() => []);
-      setTroublesInputValue("");
-      setScheduledInputValue("");
       setIsFetching(false);
-      setInputs(() => [{ task: "", hours_spent: "", minutes_spent: 0 }]);
+      clearParams()
     });
   };
 
+  const handleEditReport = () => {
+    setIsFetching(true);
+    for (let input of inputs) {
+      if (!input.task || !input.hours_spent) {
+        setReportSuccess("Заполните задачи");
+        setTimeout(() => setReportSuccess(""), 2000);
+        setIsFetching(false);
+        return;
+      }
+    }
+    apiRequest(`/reports/update?id=${editReport.id}`, {
+      method: "PUT",
+      data: {
+        tasks: inputs,
+        difficulties: troublesInputValue,
+        tomorrow: scheduledInputValue,
+        created_at: getCreatedDate(startDate),
+        status: 1
+      }
+    }).then(() => {
+      setReportSuccess("Отчет изменён");
+      setTimeout(() => {
+        setReportSuccess("");
+        navigate("/profile/calendar");
+      }, 1000);
+      setIsFetching(false);
+      clearParams()
+      dispatch(setEditReport(""))
+    });
+  }
+
+  const clearParams = () => {
+    setInputs(() => []);
+    setTroublesInputValue("");
+    setScheduledInputValue("");
+    setInputs(() => [{ task: "", hours_spent: "", minutes_spent: 0 }]);
+  }
+
   return (
     <section className="report-form">
       <ProfileHeader />
@@ -133,7 +173,7 @@ const ReportForm = () => {
           ]}
         />
         <h2 className="summary__title">
-          Ваши отчеты - <span>добавить отчет</span>
+          Ваши отчеты - <span>{editReport ? "редактировать отчет" : "добавить отчет"}</span>
         </h2>
         <div>
           <div className="report__head">
@@ -147,12 +187,11 @@ const ReportForm = () => {
         <div className="report-form__content">
           <div className="report-form__block">
             <div className="report-form__block-title">
-              <h2>Добавление отчета за день</h2>
+              <h2>{editReport ? "Редактирование отчета за день" : "Добавление отчета за день"}</h2>
               <h3>Дата заполнения отчета:</h3>
             </div>
             <div
               className="report-form__block-img"
-              onClick={() => setDatePickerOpen(true)}
             >
               <img
                 className="report-form__calendar-icon"
@@ -299,9 +338,15 @@ const ReportForm = () => {
                 ) : (
                   <button
                     className="report-form__footer-btn"
-                    onClick={() => handler()}
+                    onClick={() => {
+                      if(editReport) {
+                        handleEditReport()
+                      } else {
+                        handler()
+                      }
+                    }}
                   >
-                    Отправить
+                    {editReport ? "Редактировать" : "Отправить"}
                   </button>
                 )}
                 <p className="report-form__footer-text">