more responsive week popup ui

This commit is contained in:
Dobromir Popov
2024-09-26 11:54:38 +03:00
parent 791affcca6
commit 53729a5926

View File

@ -70,6 +70,61 @@ const PublisherShiftsModal = ({ publisher, _shifts, onClose, date, onAssignmentC
};
}, [onClose]); // Include onClose in the dependency array
function getColorForShift(shift) {
const assignedCount = shift.assignedCount || 0; // Assuming each shift has an assignedCount property
switch (assignedCount) {
case 0: return 'bg-blue-300';
case 1: return 'bg-green-300';
case 2: return 'bg-yellow-300';
case 3: return 'bg-orange-300';
case 4: return 'bg-red-200';
default: return 'bg-gray-300';
}
}
//ToDo: DRY - move to common
const addAssignment = async (publisher, shiftId) => {
try {
console.log(`calendar.idx: new assignment for publisher ${publisher.id} - ${publisher.firstName} ${publisher.lastName}`);
const newAssignment = {
publisher: { connect: { id: publisher.id } },
shift: { connect: { id: shiftId } },
isConfirmed: true
};
const { data } = await axiosInstance.post("/api/data/assignments", newAssignment);
// Update the 'publisher' property of the returned data with the full publisher object
data.publisher = publisher;
data.shift = shifts.find(shift => shift.id === shiftId);
publisher.assignments = [...publisher.assignments, data];
// handleAssignmentChange(publisher.id, 'add');
setAssignments(prevAssignments => [...prevAssignments, data]);
if (onAssignmentChange) { onAssignmentChange(publisher.id, 'add'); }
} catch (error) {
console.error("Error adding assignment:", error);
}
};
const removeAssignment = async (publisher, shiftId) => {
try {
const assignment = publisher.assignments.find(ass => ass.shift.id === shiftId);
console.log(`calendar.idx: remove assignment for shift ${shiftId}`);
const { data } = await axiosInstance.delete(`/api/data/assignments/${assignment.id}`);
//remove from local assignments:
publisher.assignments = publisher.assignments.filter(a => a.id !== assignment.id)
// Update local state
setAssignments(prevAssignments => prevAssignments.filter(a => a.id !== assignment.id));
//
// handleAssignmentChange(publisher.id, 'remove')
if (onAssignmentChange) {
onAssignmentChange(publisher.id, 'remove')
}
} catch (error) {
console.error("Error removing assignment:", error);
}
}
return (
<div className="fixed top-0 left-0 w-full h-full flex items-center justify-center bg-black bg-opacity-50 z-50">
<div className="relative bg-white p-8 rounded-lg shadow-xl max-w-xl w-full h-auto overflow-y-auto">
@ -98,24 +153,23 @@ const PublisherShiftsModal = ({ publisher, _shifts, onClose, date, onAssignmentC
>
{common.getTimeRange(shift.startTime, shift.endTime)} {shift.id}
{!assignmentExists && shift.isAvailable && (
<button onClick={() => { addAssignment(publisher, shift.id); }}
className="mt-2 bg-green-500 text-white p-1 rounded hover:bg-green-600 active:bg-green-700 focus:outline-none"
{shift.isAvailable && (
<button
onClick={() => {
if (assignmentExists) {
removeAssignment(publisher, shift.id);
} else {
addAssignment(publisher, shift.id);
}
}}
className={`mt-2 ${assignmentExists ? 'bg-red-500 hover:bg-red-600 active:bg-red-700' : 'bg-green-500 hover:bg-green-600 active:bg-green-700'} text-white p-1 rounded focus:outline-none`}
>
добави
</button>
)}
{assignmentExists && (
<button onClick={() => { removeAssignment(publisher, shift.id) }} // Implement the removeAssignment function
className="mt-2 bg-red-500 text-white p-1 rounded hover:bg-red-600 active:bg-red-700 focus:outline-none"
>
махни
{assignmentExists ? 'махни' : 'добави'}
</button>
)}
</div>
);
}
)}
})}
</div>
))}
</div>
@ -140,62 +194,10 @@ const PublisherShiftsModal = ({ publisher, _shifts, onClose, date, onAssignmentC
</div>
</div >
);
}
function getColorForShift(shift) {
const assignedCount = shift.assignedCount || 0; // Assuming each shift has an assignedCount property
switch (assignedCount) {
case 0: return 'bg-blue-300';
case 1: return 'bg-green-300';
case 2: return 'bg-yellow-300';
case 3: return 'bg-orange-300';
case 4: return 'bg-red-200';
default: return 'bg-gray-300';
}
}
//ToDo: DRY - move to common
const addAssignment = async (publisher, shiftId) => {
try {
console.log(`calendar.idx: new assignment for publisher ${publisher.id} - ${publisher.firstName} ${publisher.lastName}`);
const newAssignment = {
publisher: { connect: { id: publisher.id } },
shift: { connect: { id: shiftId } },
isConfirmed: true
};
const { data } = await axiosInstance.post("/api/data/assignments", newAssignment);
// Update the 'publisher' property of the returned data with the full publisher object
data.publisher = publisher;
data.shift = shifts.find(shift => shift.id === shiftId);
publisher.assignments = [...publisher.assignments, data];
// handleAssignmentChange(publisher.id, 'add');
setAssignments(prevAssignments => [...prevAssignments, data]);
if (onAssignmentChange) { onAssignmentChange(publisher.id, 'add'); }
} catch (error) {
console.error("Error adding assignment:", error);
}
};
const removeAssignment = async (publisher, shiftId) => {
try {
const assignment = publisher.assignments.find(ass => ass.shift.id === shiftId);
console.log(`calendar.idx: remove assignment for shift ${shiftId}`);
const { data } = await axiosInstance.delete(`/api/data/assignments/${assignment.id}`);
//remove from local assignments:
publisher.assignments = publisher.assignments.filter(a => a.id !== assignment.id)
// Update local state
setAssignments(prevAssignments => prevAssignments.filter(a => a.id !== assignment.id));
//
// handleAssignmentChange(publisher.id, 'remove')
if (onAssignmentChange) {
onAssignmentChange(publisher.id, 'remove')
}
} catch (error) {
console.error("Error removing assignment:", error);
}
}
export default PublisherShiftsModal;