upd
This commit is contained in:
@@ -15,7 +15,7 @@ import {
|
||||
parse,
|
||||
addDays,
|
||||
subDays,
|
||||
isWithinInterval,
|
||||
isAfter,
|
||||
} from "date-fns";
|
||||
import Button from "../components/Button";
|
||||
import { ru } from "date-fns/locale";
|
||||
@@ -28,6 +28,9 @@ import MoreIcon from "../components/icons/MoreIcon";
|
||||
import ISchedule from "../types/ISchedule";
|
||||
import Calendar from "../components/Calendar";
|
||||
import ChevronUpIcon from "../components/icons/ChevronUpIcon";
|
||||
import { isEqual } from "lodash";
|
||||
import _ from "lodash";
|
||||
import Menu from "../components/Menu";
|
||||
|
||||
function DashboardPage() {
|
||||
const [user, setAccessToken] = useAuthStore((state) => [
|
||||
@@ -39,9 +42,10 @@ function DashboardPage() {
|
||||
const [builds, setBuilds] = useState<any[]>();
|
||||
const [selectedBuild, setSelectedBuild] = useState<{ [key: string]: any }>();
|
||||
const [schedules, setSchedules] = useState<ISchedule[]>();
|
||||
const [duration, setDuration] = useState<number>();
|
||||
const [scheduledSessions, setScheduledSessions] = useState<any[]>();
|
||||
const [generatedScheduledSessions, setGeneratedScheduledSessions] =
|
||||
useState<any[][]>();
|
||||
useState<any[]>();
|
||||
const [selectedDate, setSelectedDate] = useState(new Date());
|
||||
const [dateTimes, setDateTimes] = useState<Date[]>();
|
||||
const [currentTime, setCurrentTime] = useState<string>(
|
||||
@@ -107,6 +111,71 @@ function DashboardPage() {
|
||||
// }
|
||||
// }, [selectedDate, selectedBuild, schedules]);
|
||||
|
||||
function findSessionsByTime(time: Date) {
|
||||
if (!scheduledSessions) return [];
|
||||
|
||||
const foundScheduledSessions = scheduledSessions?.filter(
|
||||
(scheduledSession) => isEqual(new Date(scheduledSession.startAt), time)
|
||||
);
|
||||
|
||||
return foundScheduledSessions;
|
||||
}
|
||||
|
||||
function generateScheduledSessions() {
|
||||
const newGeneratedScheduledSession: any[] = [];
|
||||
|
||||
dateTimes?.forEach((time) => {
|
||||
const foundSessionsByTime = findSessionsByTime(time);
|
||||
const sessions: any[] = [];
|
||||
|
||||
if (foundSessionsByTime) {
|
||||
sessions.push(...foundSessionsByTime);
|
||||
}
|
||||
|
||||
for (
|
||||
let index = 0;
|
||||
index < selectedBuild?.sessionLimit - foundSessionsByTime.length;
|
||||
index++
|
||||
) {
|
||||
sessions.push({});
|
||||
}
|
||||
|
||||
newGeneratedScheduledSession.push({
|
||||
time,
|
||||
sessions,
|
||||
});
|
||||
});
|
||||
|
||||
setGeneratedScheduledSessions(newGeneratedScheduledSession);
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
if (!scheduledSessions) return;
|
||||
generateScheduledSessions();
|
||||
}, [scheduledSessions]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!schedules || !selectedDate || !selectedBuild) return;
|
||||
|
||||
const foundSchedule = schedules.find((schedule) =>
|
||||
isAfter(new Date(), new Date(schedule.startDate))
|
||||
);
|
||||
|
||||
if (!foundSchedule) return;
|
||||
|
||||
const step = foundSchedule.sessionDuration + foundSchedule.sessionBreak; // 35
|
||||
const newTimes = eachMinuteOfInterval(
|
||||
{
|
||||
start: parse(foundSchedule.startTime, "HH:mm", new Date(selectedDate)), // 11:00
|
||||
end: parse(foundSchedule.endTime, "HH:mm", new Date(selectedDate)), // 20:00
|
||||
},
|
||||
{ step }
|
||||
);
|
||||
|
||||
setDateTimes(newTimes);
|
||||
setDuration(foundSchedule.sessionDuration);
|
||||
}, [schedules, selectedDate, selectedBuild]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!schedules) return;
|
||||
// const schedule = schedules.find(schedule => schedule.startDate);
|
||||
@@ -195,37 +264,35 @@ function DashboardPage() {
|
||||
if (useLoader) setIsLoadingScheduledSessions(false);
|
||||
}
|
||||
|
||||
function logout() {
|
||||
setAccessToken(null);
|
||||
}
|
||||
// function generateScheduledSessions() {
|
||||
// if (!dateTimes || !scheduledSessions || !selectedBuild) return;
|
||||
|
||||
function generateScheduledSessions() {
|
||||
if (!dateTimes || !scheduledSessions || !selectedBuild) return;
|
||||
// const arr: any[][] = [];
|
||||
|
||||
const arr: any[][] = [];
|
||||
// dateTimes.forEach((dateTime) => {
|
||||
// const arr2 = [];
|
||||
|
||||
dateTimes.forEach((dateTime) => {
|
||||
const arr2 = [];
|
||||
// const foundSessionsCount = scheduledSessions.filter((session) =>
|
||||
// isEqual(session.startAt, dateTime)
|
||||
// );
|
||||
|
||||
const foundSessionsCount = scheduledSessions.filter(
|
||||
(session) => session.startAt === dateTime.toISOString()
|
||||
);
|
||||
// arr2.push(dateTime);
|
||||
|
||||
arr2.push(dateTime);
|
||||
// for (let i = 0; i < selectedBuild.sessionLimit; i++) {
|
||||
// if (foundSessionsCount[i]) {
|
||||
// arr2.push(foundSessionsCount[i]);
|
||||
// } else {
|
||||
// arr2.push({});
|
||||
// }
|
||||
// }
|
||||
|
||||
for (let i = 0; i < selectedBuild.sessionLimit; i++) {
|
||||
if (foundSessionsCount[i]) {
|
||||
arr2.push(foundSessionsCount[i]);
|
||||
} else {
|
||||
arr2.push({});
|
||||
}
|
||||
}
|
||||
// arr.push(arr2);
|
||||
|
||||
arr.push(arr2);
|
||||
});
|
||||
// console.log("arr2", arr2);
|
||||
// });
|
||||
|
||||
setGeneratedScheduledSessions(arr);
|
||||
}
|
||||
// setGeneratedScheduledSessions(arr);
|
||||
// }
|
||||
|
||||
async function updateScheduledSessionManager(
|
||||
scheduledSessionId: string,
|
||||
@@ -306,10 +373,10 @@ function DashboardPage() {
|
||||
getSchedules();
|
||||
}, [selectedBuild]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!scheduledSessions) return;
|
||||
generateScheduledSessions();
|
||||
}, [scheduledSessions]);
|
||||
// useEffect(() => {
|
||||
// if (!scheduledSessions) return;
|
||||
// generateScheduledSessions();
|
||||
// }, [scheduledSessions]);
|
||||
|
||||
useEffect(() => {
|
||||
// setIsLoadingScheduledSessions(true);
|
||||
@@ -319,13 +386,8 @@ function DashboardPage() {
|
||||
return (
|
||||
<div className="main h-screen flex">
|
||||
<div className="left flex flex-col w-full">
|
||||
<div className="flex bg-[#F0F1F2] ">
|
||||
<button
|
||||
onClick={() => alert("В разработке")}
|
||||
className="p-3 transition-colors hover:bg-neutral-200"
|
||||
>
|
||||
<BurgerIcon />
|
||||
</button>
|
||||
<div className="flex bg-[#F0F1F2]">
|
||||
<Menu />
|
||||
{builds?.map((build) => (
|
||||
<TabButton
|
||||
key={build.id}
|
||||
@@ -396,7 +458,56 @@ function DashboardPage() {
|
||||
)}
|
||||
</Transition>
|
||||
|
||||
{company &&
|
||||
{generatedScheduledSessions?.map(
|
||||
(generatedScheduledSession, index) => (
|
||||
<div key={index} className="flex">
|
||||
<div className="w-[84px] h-[164px] flex justify-center items-center text-sm font-semibold bg-white border-r border-b border-[#DAE0E5]">
|
||||
<p>{format(generatedScheduledSession.time, "HH:mm")}</p>
|
||||
</div>
|
||||
<div className="flex">
|
||||
{generatedScheduledSession.sessions.map(
|
||||
(session: any, index2: number) => {
|
||||
const selectedManager = selectedBuildManagers?.find(
|
||||
(manager) => manager.id == session.userId
|
||||
);
|
||||
|
||||
if (!_.isEmpty(session)) {
|
||||
return (
|
||||
<Card
|
||||
key={index2}
|
||||
companyId={company?.id}
|
||||
buildId={selectedBuild?.id}
|
||||
scheduledSessionId={session.id}
|
||||
scheduleSessionStartAt={session.startAt}
|
||||
client={session.client}
|
||||
manager={selectedManager}
|
||||
managers={selectedBuildManagers || []}
|
||||
handleSelect={(scheduledSessionId, managerId) =>
|
||||
updateScheduledSessionManager(
|
||||
scheduledSessionId,
|
||||
managerId
|
||||
)
|
||||
}
|
||||
/>
|
||||
);
|
||||
} else {
|
||||
return (
|
||||
<EmptyCard
|
||||
key={index2}
|
||||
buildId={selectedBuild?.id}
|
||||
startAt={generatedScheduledSession.time}
|
||||
duration={duration!}
|
||||
/>
|
||||
);
|
||||
}
|
||||
}
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
)}
|
||||
|
||||
{/* {company &&
|
||||
selectedBuild &&
|
||||
user &&
|
||||
generatedScheduledSessions?.map(
|
||||
@@ -449,20 +560,12 @@ function DashboardPage() {
|
||||
</div>
|
||||
);
|
||||
}
|
||||
)}
|
||||
)} */}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="right w-[384px] flex flex-col">
|
||||
<div className="min-h-[48px] bg-[#F0F1F2] flex justify-between items-center">
|
||||
<p className="text-xs font-semibold px-3 text-green-600">
|
||||
{company?.name}
|
||||
</p>
|
||||
<p className="text-xs font-semibold px-3">{user?.username}</p>
|
||||
<TabButton handleClick={logout} className="text-red-600">
|
||||
Выйти
|
||||
</TabButton>
|
||||
</div>
|
||||
<div className="min-h-[48px] bg-[#F0F1F2] flex justify-between items-center"></div>
|
||||
<div className="flex gap-2 h-[48px] border-b border-[#DAE0E5]">
|
||||
<button className="p-4 text-sm font-semibold">Параметры</button>
|
||||
<button
|
||||
|
||||
Reference in New Issue
Block a user