hamedandClaude Opus 5
4c912dc6c1
The site's own copy has been promising cancellation for a while —
lib/specialtyContent.js and components/appointment/information/Detail.js both
tell users they can cancel from "نوبتهای من" and get a refund up to five hours
before the visit. The UI never could. The cancel modal existed, but its confirm
button called handleClose: it closed the dialog and sent nothing. And the whole
button row it lived in (ButtonData.js) had been commented out since the PDF
download commit, so it was not even reachable.
Cancelling now goes through POST /appointment/{uuid}/cancel and shows the
penalty from /cancellation-preview before the confirm — the same calculation
the cancel itself runs, so the number the patient sees is the number they are
charged. If the preview fails, the dialog says so rather than blocking; the
cancellation is still allowed.
Rescheduling is new and service-aware. It asks for slots with
exclude_appointment_uuid, so the patient's own hour counts as free rather than
showing as taken, and it sends only the start time — the server computes the
duration. Sending a client-side duration would mean two parallel calculations,
and the day a service's minutes change the appointment would move with a stale
one. The services on the appointment are carried over unchanged.
Both actions only appear for an appointment that is still in the future and not
already cancelled, and both refresh the list afterwards so a just-cancelled
appointment stops showing as confirmed.
The day strip in the reschedule modal is its own small component rather than
the booking flow's DatePicker: that one reads the doctor uuid from route params
and would be undefined inside the dashboard.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
100 lines
2.8 KiB
JavaScript
100 lines
2.8 KiB
JavaScript
"use client";
|
|
|
|
import { useEffect, useState } from "react";
|
|
import Head from "./Head";
|
|
import List from "./List";
|
|
import { request } from "@/services/response";
|
|
import Cookies from "js-cookie";
|
|
import IsTurnsDetails from "./isTurnsDetails";
|
|
|
|
function Turns({ user, setIsTurnsDetails, loading }) {
|
|
const [status, setStatus] = useState("confirmed");
|
|
const [appointments, setAppointments] = useState([]);
|
|
const [isLoading, setIsLoading] = useState(true);
|
|
const [page, setPage] = useState(1);
|
|
const [totalPages, setTotalPages] = useState(1);
|
|
const [selectedAppointment, setSelectedAppointment] = useState(null);
|
|
// تغییر عمدیِ کاربر (لغو یا جابهجایی) باید فهرست را تازه کند؛ وگرنه نوبتی که همین
|
|
// حالا لغو شد هنوز «تأییدشده» نشان داده میشود.
|
|
const [reloadKey, setReloadKey] = useState(0);
|
|
|
|
useEffect(() => {
|
|
const fetchAppointments = async () => {
|
|
setIsLoading(true);
|
|
try {
|
|
const userInfo = Cookies.get("userInfo");
|
|
if (!userInfo) {
|
|
setIsLoading(false);
|
|
return;
|
|
}
|
|
|
|
const params = {
|
|
page,
|
|
limit: 10,
|
|
};
|
|
|
|
if (status) {
|
|
params.status = status;
|
|
}
|
|
|
|
const response = await request.getMyAppointments(params);
|
|
const items = response?.data?.data;
|
|
|
|
if (Array.isArray(items)) {
|
|
setAppointments(items);
|
|
} else {
|
|
setAppointments([]);
|
|
}
|
|
setTotalPages(response?.meta?.totalPages || 1);
|
|
} catch (error) {
|
|
console.error("Error fetching appointments:", error);
|
|
} finally {
|
|
setIsLoading(false);
|
|
}
|
|
};
|
|
|
|
fetchAppointments();
|
|
}, [page, status, reloadKey]);
|
|
|
|
const handlePageChange = (event, value) => {
|
|
setPage(value);
|
|
};
|
|
|
|
const handleStatusChange = (newStatus) => {
|
|
setStatus(newStatus);
|
|
setPage(1); // Reset to first page when status changes
|
|
};
|
|
|
|
return (
|
|
<div className="opacity-page">
|
|
{selectedAppointment ? (
|
|
<IsTurnsDetails
|
|
appointmentData={selectedAppointment}
|
|
setIsTurnsDetails={setSelectedAppointment}
|
|
onChanged={() => {
|
|
setSelectedAppointment(null);
|
|
setReloadKey((k) => k + 1);
|
|
}}
|
|
/>
|
|
) : (
|
|
<>
|
|
<p className="text-[#3B3B3B] hidden md:flex text-[16px] font-bold">
|
|
تاریخچه نوبت ها
|
|
</p>
|
|
<Head status={status} setStatus={handleStatusChange} />
|
|
<List
|
|
loading={isLoading}
|
|
setIsTurnsDetails={setSelectedAppointment}
|
|
user={appointments}
|
|
page={page}
|
|
totalPages={totalPages}
|
|
onPageChange={handlePageChange}
|
|
/>
|
|
</>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default Turns;
|