Files
nobat724_front/components/appointment/location/LocationSelect.js
T
hamedandClaude Opus 4.8 b37096048c feat(booking): show only locations that can actually be booked that day
The site offered a "personal practice" for a doctor who has no personal address
at all — the schedule existed but its shifts pointed at the clinic's address, so
there was nowhere to go. The backend now filters those out; this consumes the
filtered contract and adds the per-day dimension.

- getBookingLocations takes an optional date and the appointment page refetches
  on it, merging available_on_date into the existing list rather than replacing
  it, so browsing the calendar never resets the user's choice.
- The browsed day had to be lifted out of the Date step: selectedDate is only
  set once a slot is confirmed, far too late to drive availability.
- A location closed on the chosen day renders disabled with «در این روز نوبت
  ندارد», and when every location is closed the step says so instead of showing
  an empty slot list. If the already-selected location closes, a notice appears
  with a link back to the picker — silently showing nothing was the failure mode
  worth avoiding.
- Doctor profile: workLocation in the Physician JSON-LD is limited to addresses
  that appear in booking_locations, since schema.org presents them as places a
  patient can attend. The address card still lists the others — they are real
  practice details — tagged «بدون نوبت‌دهی آنلاین».

Verified end-to-end with a temporary unused address on the test doctor: the
visible card listed both and tagged the unused one, while workLocation carried
only the bookable one. The row was removed afterwards.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
2026-07-18 14:44:49 +03:30

87 lines
3.3 KiB
JavaScript
Raw Blame History

This file contains invisible Unicode characters
This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
"use client";
import moment from "moment-jalaali";
function nextAvailableLabel(timestamp) {
if (!timestamp) return null;
return `اولین نوبت آزاد: ${moment.unix(timestamp).format("jD jMMMM")}`;
}
/**
* انتخاب محل نوبت‌دهی — پیش از انتخاب سرویس و روز.
*
* فهرست از سمت سرور بر اساس زودترین نوبت آزاد مرتب شده، پس اولین آیتم پیش‌فرض
* درست است و اینجا دوباره مرتب نمی‌شود.
*/
function LocationSelect({ locations = [], selected, onSelect }) {
const anyOpen = locations.some((l) => l.available_on_date !== false);
return (
<div className="w-full max-w-[520px] mx-auto">
<h2 className="text-[16px] font-bold text-[#3B3B3B] mb-4">۱. انتخاب محل نوبتدهی</h2>
{!anyOpen && locations.length > 0 && (
<p className="mb-3 text-[13px] text-[#B4541F]">
در روز انتخابشده هیچکدام از محلها نوبتدهی ندارند. روز دیگری را انتخاب کنید.
</p>
)}
<div className="flex flex-col gap-2">
{locations.map((location) => {
const key = location.clinic_uuid ?? location.location_uuid ?? "personal";
const active =
(selected?.clinic_uuid ?? null) === (location.clinic_uuid ?? null);
const nextLabel = nextAvailableLabel(location.next_available_at);
// null یعنی روزی انتخاب نشده؛ فقط false به معنی «این روز بسته است».
const closed = location.available_on_date === false;
return (
<button
key={key}
type="button"
disabled={closed}
onClick={() => !closed && onSelect(location)}
className={`w-full text-right p-[16px] rounded-[8px] border border-solid transition-colors ${
closed
? "border-[#EFEFEF] bg-[#FAFAFA] opacity-60 cursor-not-allowed"
: active
? "border-[#5559CE] bg-[rgba(85,89,206,0.06)]"
: "border-[#EFEFEF] bg-[#FFF] hover:border-[#C7C9EC]"
}`}
>
<div className="flex items-center justify-between gap-[8px]">
<p className="text-[14px] md:text-[16px] font-bold text-[#3B3B3B]">
{location.title}
</p>
{location.type === "clinic" && (
<span className="text-[11px] text-[#5559CE] bg-[rgba(85,89,206,0.10)] rounded-[4px] px-[6px] py-[2px]">
کلینیک
</span>
)}
</div>
{location.address && (
<p className="mt-[6px] text-[13px] text-[#616161] font-normal">
{location.address}
</p>
)}
<p
className={`mt-[8px] text-[12px] ${
closed ? "text-[#B4541F]" : nextLabel ? "text-[#009D79]" : "text-[#A1A1A1]"
}`}
>
{closed
? "در این روز نوبت ندارد"
: nextLabel ?? "فعلاً نوبت خالی ندارد"}
</p>
</button>
);
})}
</div>
</div>
);
}
export default LocationSelect;