From 09bbf07d8cdcf2a0917c7c92f6d4a42a4b3c6afc Mon Sep 17 00:00:00 2001 From: mouazkh Date: Tue, 26 May 2026 04:35:03 +0300 Subject: [PATCH] edited the edit properrty --- app/owner/properties/page.js | 1013 ++++++++++++++++++++-------------- app/utils/api.js | 8 + 2 files changed, 609 insertions(+), 412 deletions(-) diff --git a/app/owner/properties/page.js b/app/owner/properties/page.js index 6cf54d9..6ab98f8 100644 --- a/app/owner/properties/page.js +++ b/app/owner/properties/page.js @@ -58,6 +58,7 @@ import { getMyRentListings, getMySaleListings, editRentProperty, + editSaleProperty, } from "../../utils/api"; const DeleteConfirmationModal = ({ @@ -521,114 +522,140 @@ const PropertyViewModal = ({ isOpen, onClose, property }) => { }; const PropertyEditModal = ({ isOpen, onClose, property, onSave }) => { - const [formData, setFormData] = useState({ ...property }); + const [formData, setFormData] = useState({}); + const [newCustomTerm, setNewCustomTerm] = useState(''); const [isSaving, setIsSaving] = useState(false); - const [editingField, setEditingField] = useState(null); - const [tempValues, setTempValues] = useState({}); - const sections = [ - { - title: "معلومات أساسية", - fields: [ - { id: "title", label: "عنوان العقار", type: "text" }, - { id: "description", label: "الوصف", type: "textarea" }, - { - id: "propertyType", - label: "نوع العقار", - type: "select", - options: [ - { value: "apartment", label: "شقة" }, - { value: "villa", label: "فيلا" }, - { value: "suite", label: "سويت" }, - { value: "room", label: "غرفة ضمن شقة" }, - ], - }, - { - id: "furnished", - label: "حالة العقار", - type: "radio", - options: [ - { value: true, label: "مفروش" }, - { value: false, label: "غير مفروش" }, - ], - }, - ], - }, - { - title: "التفاصيل", - fields: [ - { id: "bedrooms", label: "عدد الغرف", type: "number" }, - { id: "bathrooms", label: "عدد الحمامات", type: "number" }, - { id: "livingRooms", label: "عدد الصالونات", type: "number" }, - { id: "area", label: "المساحة (م²)", type: "number" }, - ], - }, - { - title: "الموقع", - fields: [ - { id: "address", label: "العنوان الكامل", type: "text" }, - { id: "city", label: "المدينة", type: "text" }, - { id: "district", label: "الحي", type: "text" }, - ], - }, - { - title: "السعر", - fields: - formData?.purpose === "rent" - ? [ - { id: "dailyPrice", label: "السعر اليومي", type: "number" }, - { id: "monthlyPrice", label: "السعر الشهري", type: "number" }, - { - id: "rentType", - label: "نوع الإيجار", - type: "select", - options: [ - { value: "daily", label: "يومي" }, - { value: "monthly", label: "شهري" }, - { value: "both", label: "يومي وشهري" }, - ], - }, - ] - : [{ id: "salePrice", label: "سعر البيع", type: "number" }], - }, - ]; + useEffect(() => { + if (!property || !isOpen) return; + const raw = property._raw || {}; + const info = raw.propertyInformation || {}; + let details = {}; + try { + details = + typeof info.detailsJSON === 'object' && info.detailsJSON + ? info.detailsJSON + : JSON.parse(info.detailsJSON || '{}'); + } catch { + details = {}; + } - const startEditing = (fieldId) => { - setEditingField(fieldId); - setTempValues({ ...tempValues, [fieldId]: formData[fieldId] }); - }; - - const cancelEditing = () => { - setEditingField(null); - setTempValues({}); - }; - - const saveField = (fieldId) => { - setFormData({ - ...formData, - [fieldId]: tempValues[fieldId], + const propServices = property.services || {}; + const services = {}; + const serviceDetails = {}; + Object.keys(serviceLabels).forEach((key) => { + const val = propServices[key]; + if (val && typeof val === 'string') { + services[key] = true; + serviceDetails[key] = val; + } else if (val && typeof val === 'object' && val.detail) { + services[key] = true; + serviceDetails[key] = val.detail; + } else { + services[key] = !!val; + serviceDetails[key] = details.serviceDetails?.[key] || ''; + } }); - setEditingField(null); - setTempValues({}); - const fieldLabel = sections - .flatMap((s) => s.fields) - .find((f) => f.id === fieldId)?.label; - toast.success(`تم تحديث ${fieldLabel}`); + + const propTerms = property.terms || {}; + const terms = {}; + Object.keys(termLabels).forEach((key) => { + terms[key] = !!propTerms[key]; + }); + + const prox = property.proximity || details.nearbyDistances || {}; + + setFormData({ + propertyType: property.propertyType || 'apartment', + furnished: property.furnished ?? false, + description: property.description || '', + bedrooms: property.bedrooms || 0, + bathrooms: property.bathrooms || 0, + floor: property.floor ?? details.floorNumber ?? details.floor ?? 0, + salons: property.salons ?? details.numberOfSalons ?? details.salons ?? 0, + balconies: + property.balconies ?? + details.numberOfBalconies ?? + details.balconies ?? + 0, + area: property.area || 0, + services, + serviceDetails, + terms, + customTerms: details.customTerms || [], + nearbySchool: prox.School ?? prox.school ?? '', + nearbyHospital: prox.Hospital ?? prox.hospital ?? '', + nearbyRestaurant: prox.Restaurant ?? prox.restaurant ?? '', + nearbyUniversity: prox.University ?? prox.university ?? '', + nearbyPark: prox.Park ?? prox.park ?? '', + nearbyMall: prox.Mall ?? prox.mall ?? '', + purpose: property.purpose || 'rent', + currencyId: property.currencyId || 1, + ...(property.purpose === 'rent' + ? { + dailyPrice: property.dailyPrice || 0, + monthlyPrice: property.monthlyPrice || 0, + deposit: property.deposit || 0, + rentType: property.rentType || 'monthly', + allowedPaymentPeriod: + property.allowedPaymentPeriod || + details.allowedPaymentPeriod || + '', + } + : { salePrice: property.salePrice || 0 }), + }); + setNewCustomTerm(''); + }, [property, isOpen]); + + const handleChange = (field, value) => { + setFormData((prev) => ({ ...prev, [field]: value })); }; - const handleTempChange = (fieldId, value) => { - setTempValues({ ...tempValues, [fieldId]: value }); + const handleServiceToggle = (key, checked) => { + setFormData((prev) => ({ + ...prev, + services: { ...prev.services, [key]: checked }, + })); }; - const handleSave = () => { + const handleServiceDetail = (key, value) => { + setFormData((prev) => ({ + ...prev, + serviceDetails: { ...prev.serviceDetails, [key]: value }, + })); + }; + + const handleTermToggle = (key, checked) => { + setFormData((prev) => ({ + ...prev, + terms: { ...prev.terms, [key]: checked }, + })); + }; + + const addCustomTerm = () => { + const term = newCustomTerm.trim(); + if (!term) return; + setFormData((prev) => ({ + ...prev, + customTerms: [...(prev.customTerms || []), term], + })); + setNewCustomTerm(''); + }; + + const removeCustomTerm = (index) => { + setFormData((prev) => ({ + ...prev, + customTerms: prev.customTerms.filter((_, i) => i !== index), + })); + }; + + const handleSave = async () => { setIsSaving(true); - - setTimeout(() => { - onSave(formData); + try { + await onSave(formData); + } catch { setIsSaving(false); - onClose(); - toast.success("تم تحديث العقار بنجاح"); - }, 1000); + } }; if (!isOpen || !property) return null; @@ -645,7 +672,7 @@ const PropertyEditModal = ({ isOpen, onClose, property, onSave }) => { initial={{ scale: 0.9, y: 20 }} animate={{ scale: 1, y: 0 }} exit={{ scale: 0.9, y: 20 }} - className="bg-white rounded-2xl w-full max-w-4xl max-h-[90vh] overflow-y-auto shadow-2xl" + className="bg-white rounded-2xl w-full max-w-4xl max-h-[90vh] flex flex-col shadow-2xl" onClick={(e) => e.stopPropagation()} >
@@ -663,261 +690,371 @@ const PropertyEditModal = ({ isOpen, onClose, property, onSave }) => {
-
- {formData.images && formData.images.length > 0 && ( -
-
-

صور العقار

- +
+ {/* Basic Info */} +
+

+ معلومات أساسية +

+
+
+ +
-
- {formData.images.map((image, index) => ( -
- {`Property - +
+ +
+ {[ + { value: true, label: 'مفروش' }, + { value: false, label: 'غير مفروش' }, + ].map((opt) => ( + + ))} +
+
+
+ +