popov/mwitnessing
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix confirmation modal on top of other confirmation modal

Browse Source
This commit is contained in:
Dobromir Popov
2024-05-11 22:26:29 +03:00
parent e29807540f
commit e987b0028c
4 changed files with 51 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
components/ConfirmationModal.tsx
View File

@ -5,8 +5,8 @@ export default function ConfirmationModal({ isOpen, onClose, onConfirm, message
if (!isOpen) return null;
return (
<div className="opacity-100 fixed inset-0 flex items-center justify-center z-1002" >
<div className="bg-white p-4 rounded-md shadow-lg modal-content" style={{ zIndex: 1002 }}>
<div className="modal-container opacity-100 inset-0 flex items-center justify-center z-1152" >
<div className="bg-white p-4 rounded-md shadow-lg modal-content">
<p className="mb-4">{message}</p>
<button
className="bg-red-500 text-white px-4 py-2 rounded mr-2"

10
pages/api/index.ts
View File

@ -835,8 +835,8 @@ async function replaceInAssignment(oldPublisherId, newPublisherId, shiftId) {
where: {
id: shiftId
},
select: {
startTime: true,
include: {
cartEvent: {
select: {
location: {
@ -845,9 +845,7 @@ async function replaceInAssignment(oldPublisherId, newPublisherId, shiftId) {
}
}
}
}
},
include: {
},
assignments: {
include: {
publisher: {
@ -880,7 +878,7 @@ async function replaceInAssignment(oldPublisherId, newPublisherId, shiftId) {
publisher: { connect: { id: oldPublisherId } },
shift: { connect: { id: shiftId } },
type: EventLogType.AssignmentReplacementManual,
content: "Въведено заместване от " + originalPublisher.firstName + " " + originalPublisher.lastName + ". Ще го замества " + newPublisher.firstName + " " + newPublisher.lastName + "."
content: "Заместване въведено от " + originalPublisher.firstName + " " + originalPublisher.lastName + ". Ще го замества " + newPublisher.firstName + " " + newPublisher.lastName + "."
}
});

32
pages/cart/reports/coverMe.tsx
View File

@ -25,7 +25,17 @@ export default function EventLogList() {
useEffect(() => {
const fetchLocations = async () => {
try {
const { data: eventLogsData } = await axiosInstance.get(`/api/data/prisma/eventLog?where={"type":"${EventLogType.AssignmentReplacementAccepted}"}&include={"publisher":{"select":{"firstName":true,"lastName":true}},"shift":{"include":{"assignments":{"include":{"publisher":{"select":{"firstName":true,"lastName":true}}}}}}}`);
const { data: eventLogsDataold } = await axiosInstance.get(`/api/data/prisma/eventLog?where={"type":"${EventLogType.AssignmentReplacementAccepted}"}&include={"publisher":{"select":{"firstName":true,"lastName":true}},"shift":{"include":{"assignments":{"include":{"publisher":{"select":{"firstName":true,"lastName":true}}}}}}}`);
// const where = encodeURIComponent(`{OR: [{type: "${EventLogType.AssignmentReplacementAccepted}"}, {type: "${EventLogType.AssignmentReplacementManual}"}]}`);
const where = encodeURIComponent(JSON.stringify({
OR: [
{ type: EventLogType.AssignmentReplacementAccepted },
{ type: EventLogType.AssignmentReplacementManual }
]
}));
const { data: eventLogsData } = await axiosInstance.get(`/api/data/prisma/eventLog?where=${where}&include={"publisher":{"select":{"firstName":true,"lastName":true}},"shift":{"include":{"assignments":{"include":{"publisher":{"select":{"firstName":true,"lastName":true}}}}}}}`);
setEventLog(eventLogsData);
@ -40,6 +50,9 @@ export default function EventLogList() {
fetchLocations();
}
}, []);
return (
<Layout>
<ProtectedRoute allowedRoles={[UserRole.POWERUSER, UserRole.ADMIN]}>
@ -67,15 +80,18 @@ export default function EventLogList() {
<table className="w-full table-auto">
<thead>
<tr>
<th className="px-4 py-2 text-left">На</th>
<th className="px-4 py-2 text-left">От</th>
<th className="px-4 py-2 text-left">Дата</th>
<th className="px-4 py-2 text-left">Смяна</th>
<th className="px-4 py-2 text-left">Действия</th>
<th className="px-4 py-2 text-left">Събитие</th>
{/* <th className="px-4 py-2 text-left">Действия</th> */}
</tr>
</thead>
<tbody>
{!showOpenRequests && (eventLogs.map((event) => (
<tr key={event.id}>
<td className="border px-2 py-2">{new Date(event.date).toLocaleString('bg')}</td>
<td className="border px-2 py-2">{event.publisher.firstName + " " + event.publisher.lastName}</td>
<td className="border px-2 py-2">{new Date(event.shift?.startTime).toLocaleString('bg')}</td>
<td className="border px-2 py-2">
@ -86,17 +102,18 @@ export default function EventLogList() {
<td className="border px-2 py-2">
{event.content}
</td>
<td className="border px-4 py-2">
{/* <td className="border px-4 py-2">
<button
className="bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded">
Изтрий
</button>
</td>
</td> */}
</tr>
))
)}
{showOpenRequests && (requestedAssignments.map((assignment) => (
<tr key={assignment.id}>
<td className="border px-2 py-2">{new Date(assignment.date).toLocaleString('bg')}</td>
<td className="border px-2 py-2">{assignment.publisher.firstName + " " + assignment.publisher.lastName}</td>
<td className="border px-2 py-2">{new Date(assignment.shift.startTime).toLocaleString('bg')}</td>
<td className="border px-2 py-2">
@ -104,12 +121,13 @@ export default function EventLogList() {
<div key={ass.id}>{ass.publisher.firstName + " " + ass.publisher.lastName}</div>
))}
</td>
<td className="border px-4 py-2">
{/* <td className="border px-4 py-2">
<button
className="bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded">
className="bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
>
Изтрий
</button>
</td>
</td> */}
</tr>
))
)}

22
styles/styles.css
View File

@ -37,12 +37,30 @@ iframe {
filter: invert(1);
}
.modal-container {
display: flex;
flex-direction: column-reverse; /* Newest first if new elements are prepended */
}
.modal-content {
z-index: 1002; /* or a higher value if necessary */
/* z-index: 1002; or a higher value if necessary */
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%); /* Center the modal */
z-index: 1051; /* Higher z-index than overlay */
background-color: #fff;
padding: 20px;
border-radius: 8px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
z-index: 1051; /* High z-index */
}
.modal-overlay {
z-index: 1001;
position: fixed;
inset: 0;
background-color: rgba(0, 0, 0, 0.5); /* Semi-transparent background */
z-index: 1050; /* High z-index */
}
.publisher {
position: relative;