Fix image upload field name: 'file' -> 'image'
All checks were successful
Build frontend / build (push) Successful in 40s
All checks were successful
Build frontend / build (push) Successful in 40s
Endpoint expects field named 'image', returns path like /Pictures/abc123.jpg
This commit is contained in:
@ -329,7 +329,7 @@ const handleMapClick = async (coords) => {
|
|||||||
toast.info('تم إلغاء تحديد الموقع');
|
toast.info('تم إلغاء تحديد الموقع');
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleImageUpload = (files) => {
|
const handleImageUpload = async (files) => {
|
||||||
const newImages = Array.from(files);
|
const newImages = Array.from(files);
|
||||||
|
|
||||||
if (formData.images.length + newImages.length > 10) {
|
if (formData.images.length + newImages.length > 10) {
|
||||||
@ -337,28 +337,39 @@ const handleMapClick = async (coords) => {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
newImages.forEach(file => {
|
for (const file of newImages) {
|
||||||
if (!file.type.startsWith('image/')) {
|
if (!file.type.startsWith('image/')) {
|
||||||
toast.error('الرجاء اختيار صور صالحة فقط');
|
toast.error('الرجاء اختيار صور صالحة فقط');
|
||||||
return;
|
continue;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (file.size > 5 * 1024 * 1024) {
|
if (file.size > 5 * 1024 * 1024) {
|
||||||
toast.error('حجم الصورة يجب أن يكون أقل من 5 ميجابايت');
|
toast.error('حجم الصورة يجب أن يكون أقل من 5 ميجابايت');
|
||||||
return;
|
continue;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Show preview
|
||||||
const reader = new FileReader();
|
const reader = new FileReader();
|
||||||
reader.onloadend = () => {
|
reader.onloadend = () => {
|
||||||
setImagePreviews(prev => [...prev, reader.result]);
|
setImagePreviews(prev => [...prev, reader.result]);
|
||||||
};
|
};
|
||||||
reader.readAsDataURL(file);
|
reader.readAsDataURL(file);
|
||||||
|
|
||||||
setFormData({
|
setFormData(prev => ({
|
||||||
...formData,
|
...prev,
|
||||||
images: [...formData.images, file]
|
images: [...prev.images, file]
|
||||||
});
|
}));
|
||||||
});
|
|
||||||
|
// Upload to server immediately
|
||||||
|
try {
|
||||||
|
const path = await uploadPicture(file);
|
||||||
|
setUploadedImagePaths(prev => [...prev, path]);
|
||||||
|
console.log('[AddProperty] Image uploaded:', path);
|
||||||
|
} catch (err) {
|
||||||
|
console.error('[AddProperty] Image upload failed:', err);
|
||||||
|
toast.error('فشل رفع الصورة: ' + file.name);
|
||||||
|
}
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
const removeImage = (index) => {
|
const removeImage = (index) => {
|
||||||
@ -368,11 +379,12 @@ const handleMapClick = async (coords) => {
|
|||||||
const newPreviews = [...imagePreviews];
|
const newPreviews = [...imagePreviews];
|
||||||
newPreviews.splice(index, 1);
|
newPreviews.splice(index, 1);
|
||||||
|
|
||||||
setFormData({
|
const newPaths = [...uploadedImagePaths];
|
||||||
...formData,
|
newPaths.splice(index, 1);
|
||||||
images: newImages
|
|
||||||
});
|
setFormData(prev => ({ ...prev, images: newImages }));
|
||||||
setImagePreviews(newPreviews);
|
setImagePreviews(newPreviews);
|
||||||
|
setUploadedImagePaths(newPaths);
|
||||||
};
|
};
|
||||||
|
|
||||||
const toggleService = (serviceId) => {
|
const toggleService = (serviceId) => {
|
||||||
|
|||||||
@ -201,7 +201,7 @@ export async function getCurrencies() {
|
|||||||
export async function uploadPicture(file) {
|
export async function uploadPicture(file) {
|
||||||
console.log('[API] Uploading picture:', file.name);
|
console.log('[API] Uploading picture:', file.name);
|
||||||
const formData = new FormData();
|
const formData = new FormData();
|
||||||
formData.append('file', file);
|
formData.append('image', file);
|
||||||
const token = AuthService.getToken();
|
const token = AuthService.getToken();
|
||||||
const res = await fetch(`${API_BASE}/Files/UploadPicture`, {
|
const res = await fetch(`${API_BASE}/Files/UploadPicture`, {
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
@ -213,7 +213,7 @@ export async function uploadPicture(file) {
|
|||||||
const text = await res.text();
|
const text = await res.text();
|
||||||
console.log('[API] Upload response:', res.status, text?.substring(0, 100));
|
console.log('[API] Upload response:', res.status, text?.substring(0, 100));
|
||||||
if (!res.ok) throw new Error(`Upload failed: ${res.status} ${text}`);
|
if (!res.ok) throw new Error(`Upload failed: ${res.status} ${text}`);
|
||||||
// Response is the relative path string (possibly in envelope)
|
// Response is the relative path string (e.g. /Pictures/abc123.jpg)
|
||||||
try {
|
try {
|
||||||
const json = JSON.parse(text);
|
const json = JSON.parse(text);
|
||||||
return json?.data || json;
|
return json?.data || json;
|
||||||
|
|||||||
Reference in New Issue
Block a user