Browse Source

fix: restore edit modal using PlaceForm, fix COALESCE in GetByIDWithDetails

neyrogovnarik 1 month ago
parent
commit
416631ceb2
1 changed files with 47 additions and 3 deletions
  1. 47 3
      frontend/src/app/places/my/page.tsx

+ 47 - 3
frontend/src/app/places/my/page.tsx

@@ -1,9 +1,9 @@
 'use client'
 
 import { useEffect, useState, useCallback } from 'react'
-import { useRouter } from 'next/navigation'
 import { api } from '@/lib/api'
 import type { Place } from '@/types'
+import PlaceForm from '@/components/PlaceForm'
 
 const STATUS_LABELS: Record<string, { label: string; color: string }> = {
   published: { label: 'Опубликовано', color: 'text-green-400' },
@@ -13,6 +13,38 @@ const STATUS_LABELS: Record<string, { label: string; color: string }> = {
   draft: { label: 'Черновик', color: 'text-white/40' },
 }
 
+function EditModal({ placeId, onClose, onSaved }: { placeId: string; onClose: () => void; onSaved: () => void }) {
+  const [place, setPlace] = useState<Place | null>(null)
+  const [loading, setLoading] = useState(true)
+
+  useEffect(() => {
+    api.get<Place>(`/places/${placeId}`)
+      .then(setPlace)
+      .catch(() => onClose())
+      .finally(() => setLoading(false))
+  }, [placeId, onClose])
+
+  return (
+    <div className="fixed inset-0 z-50 flex items-start justify-center overflow-y-auto bg-black/60 pt-10 pb-10" onClick={onClose}>
+      <div className="w-full max-w-2xl rounded-xl bg-[#1e293b] shadow-xl" onClick={(e) => e.stopPropagation()}>
+        {loading ? (
+          <div className="flex items-center justify-center p-8">
+            <p className="text-white/40">Загрузка...</p>
+          </div>
+        ) : place ? (
+          <div className="p-6">
+            <div className="mb-4 flex items-center justify-between">
+              <h2 className="text-2xl font-bold text-white">Редактировать</h2>
+              <button onClick={onClose} className="text-3xl leading-none text-white/60 hover:text-white transition">&times;</button>
+            </div>
+            <PlaceForm type={place.type} place={place} onSuccess={() => { onClose(); onSaved() }} />
+          </div>
+        ) : null}
+      </div>
+    </div>
+  )
+}
+
 const FILTERS: { key: string; label: string }[] = [
   { key: 'all', label: 'Все' },
   { key: 'draft', label: 'Черновики' },
@@ -86,9 +118,9 @@ function PlaceCard({ place, onEdit, onDeleted }: { place: Place; onEdit: () => v
 }
 
 export default function MyPlacesPage() {
-  const router = useRouter()
   const [places, setPlaces] = useState<Place[]>([])
   const [loading, setLoading] = useState(true)
+  const [editId, setEditId] = useState<string | null>(null)
   const [filter, setFilter] = useState('all')
   const [toast, setToast] = useState('')
 
@@ -146,7 +178,7 @@ export default function MyPlacesPage() {
                 <PlaceCard
                   key={place.id}
                   place={place}
-                  onEdit={() => router.push('/places/edit/' + place.id)}
+                  onEdit={() => setEditId(place.id)}
                   onDeleted={() => {
                     setPlaces((prev) => prev.filter((p) => p.id !== place.id))
                     setToast('Место удалено')
@@ -158,6 +190,18 @@ export default function MyPlacesPage() {
           )
         })()}
       </div>
+
+      {editId && (
+        <EditModal
+          placeId={editId}
+          onClose={() => setEditId(null)}
+          onSaved={() => {
+            setToast('Сохранено')
+            setTimeout(() => setToast(''), 3000)
+            fetchPlaces()
+          }}
+        />
+      )}
     </div>
   )
 }