feat(clinic): enforce maximum gallery image limit of 5 and update validation logic

This commit is contained in:
hamed
2026-06-19 01:15:27 +03:30
parent dd1ca98cb4
commit e7be54b84e
3 changed files with 45 additions and 7 deletions
+18 -4
View File
@@ -34,6 +34,7 @@ L.Icon.Default.mergeOptions({
const HUES_LIST = [256, 205, 162, 295, 272];
const IRAN_CENTER: [number, number] = [32.4279, 53.6880];
const MAX_GALLERY_IMAGES = 5;
// ── Types ──────────────────────────────────────────────────────────────────
@@ -623,10 +624,21 @@ export default function ClinicDetailPage() {
};
const handleGalleryUpload = async (files: FileList) => {
const existing = (clinic?.images_clinic ?? []).filter(img => img?.url);
const remaining = MAX_GALLERY_IMAGES - existing.length;
if (remaining <= 0) {
toast.error(`گالری حداکثر ${MAX_GALLERY_IMAGES} عکس می‌تواند داشته باشد`);
return;
}
const selected = Array.from(files);
if (selected.length > remaining) {
toast.error(`فقط ${remaining} عکس دیگر می‌توانید اضافه کنید (حداکثر ${MAX_GALLERY_IMAGES})`);
}
const toUpload = selected.slice(0, remaining);
setGalleryUploading(true);
try {
const uploaded: { url: string }[] = [];
for (const file of Array.from(files)) {
for (const file of toUpload) {
const res = await fetch('/file/upload/clinic_pro/clinic/field_image_clinic', {
method: 'POST',
headers: {
@@ -640,7 +652,6 @@ export default function ClinicDetailPage() {
if (json?.data?.url) uploaded.push({ url: json.data.url });
}
if (uploaded.length > 0 && clinic) {
const existing = (clinic.images_clinic ?? []).filter(img => img?.url);
await api.patch(`/api/v1/clinic/${uuid}`, { image_clinic: [...existing, ...uploaded] });
toast.success(`${uploaded.length} تصویر اضافه شد`);
qc.invalidateQueries({ queryKey: ['clinic-detail', uuid] });
@@ -930,8 +941,11 @@ export default function ClinicDetailPage() {
{/* Gallery */}
<div className="card card-pad">
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: 14 }}>
<b style={{ fontSize: 14 }}>گالری تصاویر</b>
<button className="btn ghost sm" onClick={() => galleryInputRef.current?.click()} disabled={galleryUploading}>
<b style={{ fontSize: 14 }}>
گالری تصاویر ({formatNumber((clinic.images_clinic ?? []).filter(i => i?.url).length)}/{formatNumber(MAX_GALLERY_IMAGES)})
</b>
<button className="btn ghost sm" onClick={() => galleryInputRef.current?.click()}
disabled={galleryUploading || (clinic.images_clinic ?? []).filter(i => i?.url).length >= MAX_GALLERY_IMAGES}>
<PlusIcon style={{ width: 14, height: 14 }} />
{galleryUploading ? 'در حال آپلود...' : 'افزودن تصویر'}
</button>