#29 Реализовал свитч, который меняет часы

planner-api/src/models/Task.ts

@@ -36,9 +36,9 @@ import {
     description!: string
     @CreateDateColumn({ name: 'created_at', type: Date, default: new Date() })
     createdAt!: Date;
-    @Column({ name: 'dateTimeStart', type: 'varchar',nullable: true })
+    @Column({ name: 'dateTimeStart', type: Date,nullable: true })
     dateTimeStart!: Date | null;
-    @Column({ name: 'dateTimeDue', type: 'varchar',nullable: true })
+    @Column({ name: 'dateTimeDue', type: Date,nullable: true })
     dateTimeDue!: Date | null;
     @Column({
         type: "enum",

planner-front/src/components/MonthCalendarBody/MonthCalendarBody.js

+import { FormControlLabel, Switch } from "@mui/material";
 import { useEffect, useState } from "react";
 import CalendarRow from "./CalendarRow/CalendarRow";
 import CalendarSmallCell from "./CalendarSmallCell/CalendarSmallCell";
 import CalendarStandartCell from "./CalendarStandartCell.js/CalendarStandartCell";
 import CalendarTask from "./CalendarTask/CalendarTask";
 
-function MonthCalendarBody({month, year, tasks, createTaskInCellHandler, onChangeCellTaskTitle, setCurrentTask}) {
+function MonthCalendarBody({month, year, tasks, createTaskInCellHandler, onChangeCellTaskTitle, setCurrentTask, hourFormat, setHourFormat}) {
   
   const [hoursInDay, setHoursInDay] = useState(['8:00', '10:00', '12:00', '14:00', '16:00', '18:00', '20:00', '22:00', '6:00'])
   const [daysInMonth, setDaysInMonth] = useState([])
   const [cellSizes, setCellSizes] = useState({})
-
   useEffect(()=>{
     const cells = hoursInDay.length
-    const xs = 11/cells
+    const xs = 10.8/cells
     setCellSizes(()=>{
-      return {smallCell: 0.5, standarCell: xs}
+      return {smallCell: 0.6, standarCell: xs}
     })
   }, [])
 
+  useEffect(()=>{
+    if (hourFormat) {
+      const arr = ['8:00', '9:00', '10:00', '11:00', '12:00', '13:00', '14:00', '15:00', '17:00', '18:00', '19:00','20:00','21:00','22:00', '23:00', '7:00']
+      const cells = arr.length
+      const xs = 10.8/cells
+      setCellSizes(()=>{
+        return {smallCell: 0.6, standarCell: xs}
+      })
+      setHoursInDay(()=>arr)
+    } else {
+      const arr = ['8:00', '10:00', '12:00', '14:00', '16:00', '18:00', '20:00', '22:00', '24:00', '7:00']
+      const cells = arr.length
+      const xs = 10.8/cells
+      setCellSizes(()=>{
+        return {smallCell: 0.6, standarCell: xs}
+      })
+      setHoursInDay(()=>arr)
+    }
+  }, [hourFormat])
+
   useEffect(()=>{
     setNewMonthDays()
   }, [month])
@@ -47,8 +67,13 @@ function MonthCalendarBody({month, year, tasks, createTaskInCellHandler, onChang
     <>
     <CalendarRow
             >
-        <CalendarSmallCell xs={cellSizes.smallCell} />
-        <CalendarSmallCell xs={cellSizes.smallCell}/>
+        <CalendarSmallCell xs={1.2}> 
+         <FormControlLabel
+            control={<Switch color="primary" checked={hourFormat} onChange={()=>{setHourFormat(()=>!hourFormat)}}/>}
+            label="1 час"
+            labelPlacement="end"
+          />
+        </CalendarSmallCell>
         {hoursInDay.map((hours, i)=>{
           return (
             <CalendarStandartCell key={i} xs={cellSizes.standarCell}>

planner-front/src/containers/MonthCalendar/MonthCalendar.js

@@ -9,6 +9,7 @@ function MonthCalendar() {
   const dispatch = useDispatch();
   const { tasks } = useSelector(state => state.tasks);
 
+  const [hourFormat, setHourFormat] = useState(false);
   const [month, setMonth] = useState('')
   const [year, setYear] = useState('')
   const [worker, setWorker] = useState('');
@@ -53,18 +54,29 @@ function MonthCalendar() {
     })
   }
 
-  function dateToISOButLocal(date) {
-    return date.toLocaleString('sv').replace(' ', 'T');
-}
+  function dateToISOLikeButLocal(date) {
+    const offsetMs = date.getTimezoneOffset() * 60 * 1000;
+    const msLocal =  date.getTime() - offsetMs;
+    const dateLocal = new Date(msLocal);
+    const iso = dateLocal.toISOString();
+    return iso;
+  }
 
   const createTaskInCellHandler = (dayNumber, dayHour) => {
     const hour = parseInt(dayHour.split(':')[0])
+    let hourDue
+    if (hourFormat) {
+      hourDue = hour + 1
+    } else {
+      hourDue = hour + 2
+    }
     const newTask = {
       title:"Задача",
       description:"описание",
-      dateTimeStart: dateToISOButLocal(new Date(year, month, dayNumber, hour)),
-      dateTimeDue: dateToISOButLocal(new Date(year, month, dayNumber, hour + 2)),
+      dateTimeStart: dateToISOLikeButLocal(new Date(year, month, dayNumber, hour)),
+      dateTimeDue: dateToISOLikeButLocal(new Date(year, month, dayNumber, hourDue)),
     }
+    console.log(newTask)
     dispatch(addTask(newTask))
     setCurrentTask((newTask))
   }
@@ -97,6 +109,8 @@ function MonthCalendar() {
         createTaskInCellHandler={createTaskInCellHandler}
         onChangeCellTaskTitle={onChangeCellTaskTitle}
         setCurrentTask={setCurrentTask}
+        hourFormat={hourFormat} 
+        setHourFormat={setHourFormat}
       />
     </Container>
     </>