fix myschedule - code copied instead of using existing component due to different data structure

This commit is contained in:
Dobromir Popov
2024-03-04 14:00:02 +02:00
parent 9d7c60e39e
commit 95ae307dcc
3 changed files with 33 additions and 26 deletions

View File

@ -1,4 +1,4 @@
import React, { useState } from "react";
import React, { useState, useEffect } from "react";
import toast from "react-hot-toast";
import { useRouter } from "next/router";
import Link from "next/link";

View File

@ -15,11 +15,11 @@ const sidemenu = [
text: "График",
url: "/cart/calendar/schedule",
},
// {
// id: "myshedule",
// text: "Моя График",
// url: "/cart/publishers/myschedule",
// },
{
id: "myshedule",
text: "Моя График",
url: "/cart/publishers/myschedule",
},
{
id: "locations",
text: "Местоположения",

View File

@ -6,6 +6,7 @@ import axiosServer from '../../../src/axiosServer';
import common from '../../../src/helpers/common';
import ShiftsList from '../../../components/publisher/ShiftsList';
import { monthNamesBG, GetTimeFormat, GetDateFormat } from "../../../src/helpers/const"
import { useSession, getSession } from 'next-auth/react';
export default function MySchedulePage({ assignments }) {
@ -18,16 +19,37 @@ export default function MySchedulePage({ assignments }) {
return (
<Layout>
<ProtectedRoute allowedRoles={[UserRole.ADMIN, UserRole.POWERUSER, UserRole.USER]}>
<h1 className="text-3xl font-bold">Моите смени</h1>
<div className="container mx-auto p-4">
<h1 className="text-xl font-semibold mb-4">Моите смени</h1>
<ShiftsList assignments={assignments} selectedtab={common.getCurrentYearMonth()} />
{assignments && assignments.map((assignment) => (
<div className="flex items-center space-x-2 py-1" key={assignment.dateStr}>
<div className="font-bold flex-shrink-0 w-6 text-right">{assignment.dateStr + ":"}</div> {/*This is the column for the date. I've given it a fixed width (w-8) which you can adjust*/}
<div className="flex-grow flex">
<div className="flow space-x-2 bg-gray-200 rounded-lg shadow-md py-2 px-3" key={assignment.id}>
<span>{GetTimeFormat(assignment.shift.startTime)} - {GetTimeFormat(assignment.shift.endTime)}</span>
<button
className={`text-sm text-white font-semibold px-2 rounded-lg shadow ${assignment.isConfirmed ? "bg-yellow-400 hover:bg-yellow-500" : "bg-red-400 hover:bg-red-500"}`}
onClick={() => searchReplacement(assignment.id)}
>
Търси заместник
</button>
<button
className="text-sm bg-green-400 hover:bg-green-500 text-white font-semibold px-2 rounded-lg shadow"
onClick={() => AddToGoogleCalendar(assignment.id)}
>
Добави в календар
</button>
</div>
</div>
</div>
))}
</div>
</ProtectedRoute>
</Layout>
);
}
//get future assignmenrs for the current user (session.user.id)
//get future assignments for the current user (session.user.id)
export const getServerSideProps = async (context) => {
const session = await getSession(context);
@ -72,6 +94,7 @@ export const getServerSideProps = async (context) => {
if (assignment.shift && assignment.shift.startTime) {
return {
...assignment,
dateStr: assignment.shift.startTime.toLocaleDateString("bg-BG", { day: "numeric", month: "long" }),
shift: {
...assignment.shift,
startTime: assignment.shift.startTime.toISOString(),
@ -82,26 +105,10 @@ export const getServerSideProps = async (context) => {
return assignment;
});
const singleKey = "all";
const assignmentsStructure = {
assignments: {
items: {
[singleKey]: [],
},
keys: [singleKey],
months: {
[singleKey]: "Всички смени",
},
},
selectedtab: singleKey,
};
transformedAssignments.forEach(assignment => {
assignmentsStructure.assignments.items[singleKey].push(assignment);
});
return {
props: assignmentsStructure
props: { assignments: transformedAssignments }
}
}