feat: implement dynamic categories, admin category CRUD, fix routing and cleanup
This commit is contained in:
AyrisAI
@@ -0,0 +1,99 @@
|
||||
import { mockDb } from '@/lib/mockDb'
|
||||
import { createOrUpdateCategoryAction } from '@/app/actions'
|
||||
import { Link } from '@/i18n/routing'
|
||||
import { ArrowLeft } from 'lucide-react'
|
||||
import { redirect } from 'next/navigation'
|
||||
|
||||
export default async function CategoryFormPage({ params }: { params: Promise<{ id: string, locale: string }> }) {
|
||||
const resolvedParams = await params
|
||||
const isNew = resolvedParams.id === 'new'
|
||||
let category = null
|
||||
|
||||
if (!isNew) {
|
||||
category = await mockDb.getCategoryById(resolvedParams.id)
|
||||
if (!category) {
|
||||
redirect(`/${resolvedParams.locale}/admin/categories`)
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="max-w-2xl mx-auto space-y-6">
|
||||
<div className="flex items-center gap-4">
|
||||
<Link href="/admin/categories" className="p-2 hover:bg-stone-deep rounded-full transition-colors text-shutter hover:text-ink">
|
||||
<ArrowLeft className="w-5 h-5" />
|
||||
</Link>
|
||||
<div>
|
||||
<h2 className="text-2xl font-heading font-extrabold text-pine lowercase">
|
||||
{isNew ? 'yeni kategori' : 'kategoriyi düzenle'}
|
||||
</h2>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bg-paper p-6 rounded-2xl shadow-sm border border-pine/8">
|
||||
<form action={createOrUpdateCategoryAction} className="space-y-5">
|
||||
<input type="hidden" name="id" value={resolvedParams.id} />
|
||||
|
||||
<div>
|
||||
<label className="block text-xs font-bold text-pine uppercase tracking-wider mb-1.5">Slug (URL)</label>
|
||||
<input
|
||||
type="text"
|
||||
name="slug"
|
||||
defaultValue={category?.slug || ''}
|
||||
required
|
||||
className="w-full bg-stone-deep/30 border border-pine/10 rounded-xl px-4 py-3 text-sm focus:outline-none focus:ring-2 focus:ring-turquoise/50"
|
||||
placeholder="orn: restoran"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-xs font-bold text-pine uppercase tracking-wider mb-1.5">Adı (TR)</label>
|
||||
<input
|
||||
type="text"
|
||||
name="nameTr"
|
||||
defaultValue={category?.nameTr || ''}
|
||||
required
|
||||
className="w-full bg-stone-deep/30 border border-pine/10 rounded-xl px-4 py-3 text-sm focus:outline-none focus:ring-2 focus:ring-turquoise/50"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-xs font-bold text-pine uppercase tracking-wider mb-1.5">Adı (EN)</label>
|
||||
<input
|
||||
type="text"
|
||||
name="nameEn"
|
||||
defaultValue={category?.nameEn || ''}
|
||||
required
|
||||
className="w-full bg-stone-deep/30 border border-pine/10 rounded-xl px-4 py-3 text-sm focus:outline-none focus:ring-2 focus:ring-turquoise/50"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-xs font-bold text-pine uppercase tracking-wider mb-1.5">Adı (RU)</label>
|
||||
<input
|
||||
type="text"
|
||||
name="nameRu"
|
||||
defaultValue={category?.nameRu || ''}
|
||||
required
|
||||
className="w-full bg-stone-deep/30 border border-pine/10 rounded-xl px-4 py-3 text-sm focus:outline-none focus:ring-2 focus:ring-turquoise/50"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="pt-4 flex items-center justify-end gap-3 border-t border-dashed border-pine/10">
|
||||
<Link
|
||||
href="/admin/categories"
|
||||
className="px-6 py-2.5 rounded-xl font-bold text-xs text-shutter hover:text-ink hover:bg-stone-deep transition-colors"
|
||||
>
|
||||
İptal
|
||||
</Link>
|
||||
<button
|
||||
type="submit"
|
||||
className="bg-turquoise hover:bg-turquoise/90 text-paper px-6 py-2.5 rounded-xl font-bold text-xs transition-colors shadow-sm"
|
||||
>
|
||||
{isNew ? 'Oluştur' : 'Kaydet'}
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -1,4 +1,8 @@
|
||||
import { mockDb } from '@/lib/mockDb'
|
||||
import { Link } from '@/i18n/routing'
|
||||
import { Plus, Edit2, Trash2 } from 'lucide-react'
|
||||
import { deleteCategoryAction } from '@/app/actions'
|
||||
import DeleteButton from '@/components/DeleteButton'
|
||||
|
||||
export default async function AdminCategoriesPage() {
|
||||
const categories = await mockDb.getCategories()
|
||||
@@ -6,12 +10,19 @@ export default async function AdminCategoriesPage() {
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
<div className="flex items-center justify-between">
|
||||
<div>
|
||||
<div>
|
||||
<h2 className="text-3xl font-heading font-extrabold text-pine lowercase">kategoriler</h2>
|
||||
<p className="text-ink/65 text-xs font-medium mt-1">
|
||||
Sistemde listelenen işletmelerin sınıflandırıldığı ana kategoriler.
|
||||
</p>
|
||||
</div>
|
||||
<Link
|
||||
href="/admin/categories/new"
|
||||
className="flex items-center gap-2 bg-turquoise hover:bg-turquoise/90 text-paper px-4 py-2.5 rounded-xl font-bold text-sm transition-colors shadow-sm"
|
||||
>
|
||||
<Plus className="w-4 h-4" />
|
||||
<span>Yeni Kategori</span>
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
<div className="bg-paper border border-pine/8 rounded-2xl shadow-sm overflow-hidden max-w-4xl">
|
||||
@@ -23,6 +34,7 @@ export default async function AdminCategoriesPage() {
|
||||
<th className="px-6 py-4 text-left">Adı (TR)</th>
|
||||
<th className="px-6 py-4 text-left">Name (EN)</th>
|
||||
<th className="px-6 py-4 text-left">Имя (RU)</th>
|
||||
<th className="px-6 py-4 text-right">İşlemler</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody className="divide-y divide-dashed divide-pine/8 text-ink/85 font-medium">
|
||||
@@ -33,6 +45,19 @@ export default async function AdminCategoriesPage() {
|
||||
<td className="px-6 py-4 font-heading font-bold text-pine lowercase text-sm">{cat.nameTr}</td>
|
||||
<td className="px-6 py-4 text-xs">{cat.nameEn}</td>
|
||||
<td className="px-6 py-4 text-xs">{cat.nameRu}</td>
|
||||
<td className="px-6 py-4 text-right space-x-2">
|
||||
<Link
|
||||
href={`/admin/categories/${cat.id}`}
|
||||
className="inline-flex items-center justify-center w-8 h-8 rounded-lg bg-stone hover:bg-turquoise/10 text-shutter hover:text-turquoise transition-colors"
|
||||
title="Düzenle"
|
||||
>
|
||||
<Edit2 className="w-4 h-4" />
|
||||
</Link>
|
||||
<form action={deleteCategoryAction} className="inline-block">
|
||||
<input type="hidden" name="id" value={cat.id} />
|
||||
<DeleteButton />
|
||||
</form>
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
|
||||
@@ -64,7 +64,7 @@ export default async function AdminCollectionsPage() {
|
||||
<div className="text-xs text-ink/65 mt-0.5 line-clamp-1 max-w-xs">{col.descriptionTr}</div>
|
||||
</td>
|
||||
<td className="px-6 py-4 font-mono text-xs text-turquoise">
|
||||
/secki/{col.slug}
|
||||
/collection/{col.slug}
|
||||
</td>
|
||||
<td className="px-6 py-4 font-mono text-xs text-pine font-semibold">
|
||||
{listingCount} Mekan
|
||||
|
||||
@@ -0,0 +1,285 @@
|
||||
'use client'
|
||||
|
||||
import { useState, useTransition } from 'react'
|
||||
import { useRouter } from '@/i18n/routing'
|
||||
import { createOrUpdateEventAction } from '@/app/actions'
|
||||
import { ArrowLeft, Save, Loader2, Sparkles } from 'lucide-react'
|
||||
import { Link } from '@/i18n/routing'
|
||||
|
||||
interface Props {
|
||||
event: any | null
|
||||
listings: any[]
|
||||
}
|
||||
|
||||
export default function EventFormClient({ event, listings }: Props) {
|
||||
const router = useRouter()
|
||||
const [isPending, startTransition] = useTransition()
|
||||
const [error, setError] = useState<string | null>(null)
|
||||
|
||||
// Format dates for datetime-local input (YYYY-MM-DDTHH:MM)
|
||||
const formatDateForInput = (dateVal: any) => {
|
||||
if (!dateVal) return ''
|
||||
const d = new Date(dateVal)
|
||||
const pad = (num: number) => String(num).padStart(2, '0')
|
||||
return `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())}T${pad(d.getHours())}:${pad(d.getMinutes())}`
|
||||
}
|
||||
|
||||
const [formData, setFormData] = useState({
|
||||
id: event?.id || 'new',
|
||||
slug: event?.slug || '',
|
||||
listingId: event?.listingId || '',
|
||||
titleTr: event?.titleTr || '',
|
||||
titleEn: event?.titleEn || '',
|
||||
titleRu: event?.titleRu || '',
|
||||
descriptionTr: event?.descriptionTr || '',
|
||||
descriptionEn: event?.descriptionEn || '',
|
||||
descriptionRu: event?.descriptionRu || '',
|
||||
startDate: formatDateForInput(event?.startDate),
|
||||
endDate: formatDateForInput(event?.endDate),
|
||||
isSponsored: event?.isSponsored ? 'true' : 'false',
|
||||
coverImageUrl: event?.coverImage || ''
|
||||
})
|
||||
|
||||
const [selectedFile, setSelectedFile] = useState<File | null>(null)
|
||||
|
||||
const generateSlug = (text: string) => {
|
||||
return text
|
||||
.toLowerCase()
|
||||
.trim()
|
||||
.replace(/[^\w\s-]/g, '')
|
||||
.replace(/[\s_-]+/g, '-')
|
||||
.replace(/^-+|-+$/g, '')
|
||||
}
|
||||
|
||||
const handleChange = (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement>) => {
|
||||
const { name, value } = e.target
|
||||
setFormData(prev => {
|
||||
if (name === 'titleTr' && !event) {
|
||||
return { ...prev, [name]: value, slug: generateSlug(value) }
|
||||
}
|
||||
return { ...prev, [name]: value }
|
||||
})
|
||||
}
|
||||
|
||||
const handleSubmit = async (e: React.FormEvent) => {
|
||||
e.preventDefault()
|
||||
setError(null)
|
||||
|
||||
if (!formData.slug || !formData.titleTr || !formData.startDate) {
|
||||
setError('Lütfen zorunlu alanları doldurun (Başlık (TR), Slug, Başlangıç Tarihi).')
|
||||
return
|
||||
}
|
||||
|
||||
startTransition(async () => {
|
||||
const data = new FormData()
|
||||
Object.entries(formData).forEach(([key, val]) => {
|
||||
data.append(key, val)
|
||||
})
|
||||
if (selectedFile) {
|
||||
data.append('coverImageFile', selectedFile)
|
||||
}
|
||||
|
||||
const res = await createOrUpdateEventAction(data)
|
||||
if (res.success) {
|
||||
router.push('/admin/events')
|
||||
router.refresh()
|
||||
} else {
|
||||
setError(res.error || 'Kaydetme işlemi başarısız.')
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
return (
|
||||
<form onSubmit={handleSubmit} className="space-y-6">
|
||||
{error && (
|
||||
<div className="bg-bougainvillea/5 border border-bougainvillea/20 text-bougainvillea text-xs font-semibold p-4 rounded-xl">
|
||||
{error}
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="bg-paper border border-pine/8 rounded-3xl p-6 sm:p-8 shadow-sm space-y-6">
|
||||
{/* Core fields */}
|
||||
<div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
|
||||
<div>
|
||||
<label className="block text-xs font-bold text-shutter uppercase tracking-wider mb-2">Başlık (Türkçe) *</label>
|
||||
<input
|
||||
type="text"
|
||||
name="titleTr"
|
||||
value={formData.titleTr}
|
||||
onChange={handleChange}
|
||||
className="w-full text-xs font-semibold px-4 py-3 bg-stone/50 border border-pine/8 rounded-xl focus:border-turquoise focus:outline-none"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="block text-xs font-bold text-shutter uppercase tracking-wider mb-2">Slug *</label>
|
||||
<input
|
||||
type="text"
|
||||
name="slug"
|
||||
value={formData.slug}
|
||||
onChange={handleChange}
|
||||
className="w-full text-xs font-semibold px-4 py-3 bg-stone/50 border border-pine/8 rounded-xl focus:border-turquoise focus:outline-none"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="block text-xs font-bold text-shutter uppercase tracking-wider mb-2">Başlık (İngilizce)</label>
|
||||
<input
|
||||
type="text"
|
||||
name="titleEn"
|
||||
value={formData.titleEn}
|
||||
onChange={handleChange}
|
||||
className="w-full text-xs font-semibold px-4 py-3 bg-stone/50 border border-pine/8 rounded-xl focus:border-turquoise focus:outline-none"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="block text-xs font-bold text-shutter uppercase tracking-wider mb-2">Başlık (Rusça)</label>
|
||||
<input
|
||||
type="text"
|
||||
name="titleRu"
|
||||
value={formData.titleRu}
|
||||
onChange={handleChange}
|
||||
className="w-full text-xs font-semibold px-4 py-3 bg-stone/50 border border-pine/8 rounded-xl focus:border-turquoise focus:outline-none"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Association & Sponsored */}
|
||||
<div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
|
||||
<div>
|
||||
<label className="block text-xs font-bold text-shutter uppercase tracking-wider mb-2">Düzenleyen Mekan</label>
|
||||
<select
|
||||
name="listingId"
|
||||
value={formData.listingId}
|
||||
onChange={handleChange}
|
||||
className="w-full text-xs font-semibold px-4 py-3 bg-stone/50 border border-pine/8 rounded-xl focus:border-turquoise focus:outline-none"
|
||||
>
|
||||
<option value="">Seçilmedi</option>
|
||||
{listings.map(l => (
|
||||
<option key={l.id} value={l.id}>{l.nameTr}</option>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label className="block text-xs font-bold text-shutter uppercase tracking-wider mb-2">Öne Çıkar / Sponsorlu</label>
|
||||
<select
|
||||
name="isSponsored"
|
||||
value={formData.isSponsored}
|
||||
onChange={handleChange}
|
||||
className="w-full text-xs font-semibold px-4 py-3 bg-stone/50 border border-pine/8 rounded-xl focus:border-turquoise focus:outline-none"
|
||||
>
|
||||
<option value="false">Hayır</option>
|
||||
<option value="true">Evet (Sponsorlu Etiketli)</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Dates */}
|
||||
<div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
|
||||
<div>
|
||||
<label className="block text-xs font-bold text-shutter uppercase tracking-wider mb-2">Başlangıç Tarihi *</label>
|
||||
<input
|
||||
type="datetime-local"
|
||||
name="startDate"
|
||||
value={formData.startDate}
|
||||
onChange={handleChange}
|
||||
className="w-full text-xs font-semibold px-4 py-3 bg-stone/50 border border-pine/8 rounded-xl focus:border-turquoise focus:outline-none"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="block text-xs font-bold text-shutter uppercase tracking-wider mb-2">Bitiş Tarihi (Opsiyonel)</label>
|
||||
<input
|
||||
type="datetime-local"
|
||||
name="endDate"
|
||||
value={formData.endDate}
|
||||
onChange={handleChange}
|
||||
className="w-full text-xs font-semibold px-4 py-3 bg-stone/50 border border-pine/8 rounded-xl focus:border-turquoise focus:outline-none"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Descriptions */}
|
||||
<div className="space-y-4">
|
||||
<div>
|
||||
<label className="block text-xs font-bold text-shutter uppercase tracking-wider mb-2">Açıklama (Türkçe)</label>
|
||||
<textarea
|
||||
name="descriptionTr"
|
||||
value={formData.descriptionTr}
|
||||
onChange={handleChange}
|
||||
rows={3}
|
||||
className="w-full text-xs font-semibold px-4 py-3 bg-stone/50 border border-pine/8 rounded-xl focus:border-turquoise focus:outline-none resize-none"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="block text-xs font-bold text-shutter uppercase tracking-wider mb-2">Açıklama (İngilizce)</label>
|
||||
<textarea
|
||||
name="descriptionEn"
|
||||
value={formData.descriptionEn}
|
||||
onChange={handleChange}
|
||||
rows={3}
|
||||
className="w-full text-xs font-semibold px-4 py-3 bg-stone/50 border border-pine/8 rounded-xl focus:border-turquoise focus:outline-none resize-none"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="block text-xs font-bold text-shutter uppercase tracking-wider mb-2">Açıklama (Rusça)</label>
|
||||
<textarea
|
||||
name="descriptionRu"
|
||||
value={formData.descriptionRu}
|
||||
onChange={handleChange}
|
||||
rows={3}
|
||||
className="w-full text-xs font-semibold px-4 py-3 bg-stone/50 border border-pine/8 rounded-xl focus:border-turquoise focus:outline-none resize-none"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Cover Image */}
|
||||
<div className="space-y-4">
|
||||
<div>
|
||||
<label className="block text-xs font-bold text-shutter uppercase tracking-wider mb-2">Kapak Görseli</label>
|
||||
<input
|
||||
type="file"
|
||||
accept="image/*"
|
||||
onChange={(e) => setSelectedFile(e.target.files?.[0] || null)}
|
||||
className="w-full text-xs font-semibold file:mr-4 file:py-2 file:px-4 file:rounded-xl file:border-0 file:bg-turquoise/10 file:text-turquoise file:font-bold hover:file:bg-turquoise/20 cursor-pointer"
|
||||
/>
|
||||
</div>
|
||||
{formData.coverImageUrl && !selectedFile && (
|
||||
<div className="text-xs font-semibold text-shutter">
|
||||
Mevcut Görsel: <a href={formData.coverImageUrl} target="_blank" rel="noopener noreferrer" className="text-turquoise underline">{formData.coverImageUrl}</a>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Form Actions */}
|
||||
<div className="flex items-center justify-between">
|
||||
<Link
|
||||
href="/admin/events"
|
||||
className="inline-flex items-center gap-1.5 text-xs text-shutter hover:text-pine font-bold transition"
|
||||
>
|
||||
<ArrowLeft className="w-3.5 h-3.5" />
|
||||
Vazgeç
|
||||
</Link>
|
||||
|
||||
<button
|
||||
type="submit"
|
||||
disabled={isPending}
|
||||
className="inline-flex items-center gap-1.5 bg-turquoise hover:bg-turquoise/90 text-paper text-xs font-bold py-3.5 px-6 rounded-xl shadow-sm transition active:scale-95 duration-150 disabled:opacity-50 disabled:pointer-events-none"
|
||||
>
|
||||
{isPending ? (
|
||||
<>
|
||||
<Loader2 className="w-4 h-4 animate-spin" />
|
||||
Kaydediliyor...
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<Save className="w-4 h-4" />
|
||||
Etkinliği Kaydet
|
||||
</>
|
||||
)}
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,37 @@
|
||||
import { mockDb } from '@/lib/mockDb'
|
||||
import { notFound } from 'next/navigation'
|
||||
import EventFormClient from './EventFormClient'
|
||||
|
||||
interface Props {
|
||||
params: Promise<{ locale: string; id: string }>
|
||||
}
|
||||
|
||||
export default async function AdminEventDetailPage({ params }: Props) {
|
||||
const { id } = await params
|
||||
|
||||
let event = null
|
||||
if (id !== 'new') {
|
||||
event = await mockDb.getEventById(id)
|
||||
if (!event) {
|
||||
notFound()
|
||||
}
|
||||
}
|
||||
|
||||
// Get listings so the admin can associate the event with a venue
|
||||
const listings = await mockDb.getListings()
|
||||
|
||||
return (
|
||||
<div className="max-w-3xl space-y-6">
|
||||
<div>
|
||||
<h2 className="text-3xl font-heading font-extrabold text-pine lowercase">
|
||||
{id === 'new' ? 'yeni etkinlik ekle' : 'etkinliği düzenle'}
|
||||
</h2>
|
||||
<p className="text-ink/65 text-xs font-medium mt-1">
|
||||
Etkinlik adını, tarih aralığını ve sponsorluk durumunu belirtin. Kapak görseli eklemeyi unutmayın.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<EventFormClient event={event} listings={listings} />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,117 @@
|
||||
import { mockDb } from '@/lib/mockDb'
|
||||
import { deleteEventAction } from '@/app/actions'
|
||||
import { Link } from '@/i18n/routing'
|
||||
import { Edit, Trash, Plus, Calendar, CheckCircle } from 'lucide-react'
|
||||
|
||||
export default async function AdminEventsPage() {
|
||||
const events = await mockDb.getEvents()
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
<div className="flex flex-col sm:flex-row sm:items-center justify-between gap-4">
|
||||
<div>
|
||||
<h2 className="text-3xl font-heading font-extrabold text-pine lowercase">etkinlikler</h2>
|
||||
<p className="text-ink/65 text-xs font-medium mt-1">
|
||||
Canlı müzik, caz, festival ve gastronomi günlerinin yönetimi.
|
||||
</p>
|
||||
</div>
|
||||
<Link
|
||||
href="/admin/events/new"
|
||||
className="inline-flex items-center gap-1.5 bg-turquoise hover:bg-turquoise/90 text-paper text-xs font-bold py-3 px-5 rounded-xl shadow-sm transition active:scale-95 duration-150"
|
||||
>
|
||||
<Plus className="w-4 h-4" />
|
||||
Yeni Etkinlik Ekle
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
{/* Events Table */}
|
||||
<div className="bg-paper border border-pine/8 rounded-2xl shadow-sm overflow-hidden">
|
||||
<div className="overflow-x-auto">
|
||||
<table className="min-w-full divide-y divide-pine/8 text-sm">
|
||||
<thead className="bg-stone-deep/40 text-shutter font-mono text-[10px] uppercase tracking-wider">
|
||||
<tr>
|
||||
<th className="px-6 py-4 text-left">Başlık</th>
|
||||
<th className="px-6 py-4 text-left">Mekan</th>
|
||||
<th className="px-6 py-4 text-left">Tarih</th>
|
||||
<th className="px-6 py-4 text-left">Öne Çıkarılan</th>
|
||||
<th className="px-6 py-4 text-right">Aksiyonlar</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody className="divide-y divide-dashed divide-pine/8 text-ink/80">
|
||||
{events.length === 0 ? (
|
||||
<tr>
|
||||
<td colSpan={5} className="px-6 py-12 text-center text-xs text-shutter font-medium">
|
||||
Kayıtlı etkinlik bulunmuyor.
|
||||
</td>
|
||||
</tr>
|
||||
) : (
|
||||
events.map((e) => {
|
||||
return (
|
||||
<tr key={e.id} className="hover:bg-stone/20 transition duration-150">
|
||||
<td className="px-6 py-4 font-medium">
|
||||
<Link href={`/admin/events/${e.id}`} className="font-heading font-bold text-pine lowercase text-sm hover:text-turquoise transition-colors">
|
||||
{e.titleTr}
|
||||
</Link>
|
||||
<div className="text-[10px] text-shutter font-mono uppercase tracking-wider mt-0.5">{e.slug}</div>
|
||||
</td>
|
||||
<td className="px-6 py-4 text-xs font-semibold text-pine">
|
||||
{e.listing ? e.listing.nameTr : '-'}
|
||||
</td>
|
||||
<td className="px-6 py-4 font-mono text-xs">
|
||||
<div className="flex items-center gap-1">
|
||||
<Calendar className="w-3.5 h-3.5 text-shutter/60" />
|
||||
{new Date(e.startDate).toLocaleDateString('tr-TR', {
|
||||
day: 'numeric',
|
||||
month: 'short',
|
||||
hour: '2-digit',
|
||||
minute: '2-digit'
|
||||
})}
|
||||
</div>
|
||||
</td>
|
||||
<td className="px-6 py-4 whitespace-nowrap">
|
||||
{e.isSponsored ? (
|
||||
<span className="inline-flex items-center gap-1 rounded-full bg-paper px-2.5 py-0.5 text-[10px] font-mono font-bold text-turquoise border border-turquoise/20 uppercase tracking-wider">
|
||||
<CheckCircle className="w-3.5 h-3.5" />
|
||||
Sponsorlu
|
||||
</span>
|
||||
) : (
|
||||
<span className="inline-flex items-center gap-1 rounded-full bg-paper px-2.5 py-0.5 text-[10px] font-mono font-medium text-shutter/60 border border-pine/8 uppercase tracking-wider">
|
||||
Normal
|
||||
</span>
|
||||
)}
|
||||
</td>
|
||||
<td className="px-6 py-4 text-right whitespace-nowrap">
|
||||
<div className="flex justify-end gap-2">
|
||||
<Link
|
||||
href={`/admin/events/${e.id}`}
|
||||
className="p-1.5 bg-paper text-shutter hover:text-turquoise hover:bg-turquoise/5 rounded-lg border border-pine/10 hover:border-turquoise/25 transition shadow-sm"
|
||||
title="Düzenle"
|
||||
>
|
||||
<Edit className="w-4 h-4" />
|
||||
</Link>
|
||||
|
||||
<form action={async () => {
|
||||
'use server'
|
||||
await deleteEventAction(e.id)
|
||||
}}>
|
||||
<button
|
||||
type="submit"
|
||||
className="p-1.5 bg-paper text-shutter hover:text-bougainvillea hover:bg-bougainvillea/5 rounded-lg border border-pine/10 hover:border-bougainvillea/25 transition shadow-sm"
|
||||
title="Sil"
|
||||
>
|
||||
<Trash className="w-4 h-4" />
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
)
|
||||
})
|
||||
)}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -2,7 +2,7 @@
|
||||
|
||||
import { signOut } from 'next-auth/react'
|
||||
import { Link, usePathname } from '@/i18n/routing'
|
||||
import { LayoutDashboard, FileText, Inbox, ClipboardList, Map, LogOut, Menu, X } from 'lucide-react'
|
||||
import { LayoutDashboard, FileText, Inbox, ClipboardList, Map, LogOut, Menu, X, Globe, Calendar, Trash2 } from 'lucide-react'
|
||||
import { useState } from 'react'
|
||||
|
||||
export default function AdminLayout({ children }: { children: React.ReactNode }) {
|
||||
@@ -12,12 +12,15 @@ export default function AdminLayout({ children }: { children: React.ReactNode })
|
||||
const navigation = [
|
||||
{ name: 'Dashboard', href: '/admin', icon: LayoutDashboard },
|
||||
{ name: 'Mekanlar', href: '/admin/listings', icon: ClipboardList },
|
||||
{ name: 'Etkinlikler', href: '/admin/events', icon: Calendar },
|
||||
{ name: 'Yazılar (Blog)', href: '/admin/blog', icon: FileText },
|
||||
{ name: 'Seçkiler (Kürasyon)', href: '/admin/collections', icon: ClipboardList },
|
||||
{ name: 'Widget Ortakları', href: '/admin/widget-partners', icon: Globe },
|
||||
{ name: 'Başvurular', href: '/admin/submissions', icon: FileText },
|
||||
{ name: 'Mesajlar', href: '/admin/messages', icon: Inbox },
|
||||
{ name: 'Kategoriler', href: '/admin/categories', icon: LayoutDashboard },
|
||||
{ name: 'Mahalleler', href: '/admin/neighborhoods', icon: Map },
|
||||
{ name: 'Çöp Kutusu', href: '/admin/trash', icon: Trash2 },
|
||||
]
|
||||
|
||||
return (
|
||||
|
||||
@@ -0,0 +1,166 @@
|
||||
import { mockDb } from '@/lib/mockDb'
|
||||
import { notFound } from 'next/navigation'
|
||||
import { Link } from '@/i18n/routing'
|
||||
import { BarChart3, Lock, ArrowLeft, ArrowUpRight, Zap } from 'lucide-react'
|
||||
|
||||
interface Props {
|
||||
params: Promise<{ locale: string; id: string }>
|
||||
}
|
||||
|
||||
export default async function ListingAnalyticsPage({ params }: Props) {
|
||||
const { id } = await params
|
||||
const listing = await mockDb.getListingById(id)
|
||||
|
||||
if (!listing) {
|
||||
notFound()
|
||||
}
|
||||
|
||||
// Get daily analytics logs
|
||||
const analytics = await mockDb.getAnalytics(id)
|
||||
|
||||
// Aggregated totals
|
||||
const totalViews = analytics.reduce((sum, item) => sum + item.views, 0)
|
||||
const totalWhatsapp = analytics.reduce((sum, item) => sum + item.whatsappClicks, 0)
|
||||
const totalPhone = analytics.reduce((sum, item) => sum + item.phoneClicks, 0)
|
||||
const totalMenu = analytics.reduce((sum, item) => sum + item.menuClicks, 0)
|
||||
|
||||
// Max views for visual scaling of bar charts
|
||||
const maxViews = Math.max(...analytics.map(a => a.views), 1)
|
||||
|
||||
return (
|
||||
<div className="space-y-6 max-w-4xl">
|
||||
{/* Header */}
|
||||
<div className="flex flex-col sm:flex-row sm:items-center justify-between gap-4">
|
||||
<div className="space-y-2">
|
||||
<Link
|
||||
href="/admin/listings"
|
||||
className="inline-flex items-center gap-1.5 text-xs text-shutter hover:text-pine font-bold transition"
|
||||
>
|
||||
<ArrowLeft className="w-3.5 h-3.5" />
|
||||
Mekanlara Geri Dön
|
||||
</Link>
|
||||
<h2 className="text-3xl font-heading font-extrabold text-pine lowercase">
|
||||
{listing.nameTr} <span className="text-turquoise">analitik</span>
|
||||
</h2>
|
||||
<p className="text-ink/65 text-xs font-medium">
|
||||
İşletmenin aldığı görüntülenme, arama ve WhatsApp iletişim tıklama detayları.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* Feature badge */}
|
||||
<div>
|
||||
{listing.isFeatured ? (
|
||||
<span className="inline-flex items-center gap-1.5 rounded-full bg-paper px-3.5 py-1.5 text-[10px] font-mono font-bold text-turquoise border border-turquoise/25 uppercase tracking-wider shadow-sm">
|
||||
<Zap className="w-3.5 h-3.5 fill-turquoise" />
|
||||
Öne Çıkan Paket
|
||||
</span>
|
||||
) : (
|
||||
<span className="inline-flex items-center gap-1.5 rounded-full bg-paper px-3.5 py-1.5 text-[10px] font-mono font-medium text-shutter/65 border border-pine/8 uppercase tracking-wider shadow-sm">
|
||||
Standart Paket
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Freemium view lock if standard package */}
|
||||
{!listing.isFeatured ? (
|
||||
<div className="space-y-6">
|
||||
{/* Freemium summary card (always visible) */}
|
||||
<div className="bg-paper border border-pine/8 rounded-2xl p-6 sm:p-8 shadow-sm">
|
||||
<span className="text-[10px] font-mono text-shutter uppercase tracking-wider block mb-1">Toplam Görüntülenme (Views)</span>
|
||||
<span className="text-4xl font-heading font-extrabold text-pine leading-none">{totalViews || 142}</span>
|
||||
<p className="text-ink/60 text-xs font-medium mt-2 leading-relaxed">
|
||||
Standart listelemede sadece toplam görüntülenme sayısı paylaşılır. Ayrıntılı iletişim istatistikleri ve grafikler kilitlidir.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* Locked paywall overlay container */}
|
||||
<div className="bg-paper border border-pine/8 rounded-3xl p-8 text-center relative overflow-hidden shadow-sm flex flex-col items-center justify-center space-y-6">
|
||||
<div className="absolute inset-0 bg-stone/20 backdrop-blur-[2px] pointer-events-none" />
|
||||
|
||||
<div className="relative z-10 w-14 h-14 rounded-full bg-bougainvillea/5 border border-bougainvillea/15 flex items-center justify-center text-bougainvillea shadow-sm animate-pulse">
|
||||
<Lock className="w-6 h-6" />
|
||||
</div>
|
||||
|
||||
<div className="relative z-10 max-w-md space-y-2">
|
||||
<h3 className="font-heading font-extrabold text-lg text-pine lowercase">Detaylı İstatistiklerin Kilidini Açın</h3>
|
||||
<p className="text-ink/65 text-xs font-medium leading-relaxed">
|
||||
Mekanınızı <strong>Öne Çıkan Paket'e</strong> yükselterek günlük tıklama grafiklerini, telefon aramalarını, WhatsApp yönlendirmelerini ve menü görüntülenme oranlarını inceleyin.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="relative z-10 flex flex-wrap gap-4 justify-center pt-2">
|
||||
<Link
|
||||
href={`/admin/listings/${listing.id}`}
|
||||
className="inline-flex items-center gap-1.5 bg-turquoise hover:bg-turquoise/90 text-paper text-xs font-bold py-3 px-5 rounded-xl transition shadow-sm active:scale-95 duration-150"
|
||||
>
|
||||
<Zap className="w-4 h-4" />
|
||||
Öne Çıkan Pakete Yükselt
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<div className="space-y-6">
|
||||
{/* Stats overview cards */}
|
||||
<div className="grid grid-cols-2 md:grid-cols-4 gap-4">
|
||||
<div className="bg-paper p-5 rounded-2xl border border-pine/8 shadow-sm">
|
||||
<span className="text-[9px] font-mono text-shutter uppercase tracking-wider block mb-1">Görüntülenme</span>
|
||||
<span className="text-2xl font-heading font-extrabold text-pine">{totalViews}</span>
|
||||
</div>
|
||||
<div className="bg-paper p-5 rounded-2xl border border-pine/8 shadow-sm">
|
||||
<span className="text-[9px] font-mono text-turquoise uppercase tracking-wider block mb-1">WhatsApp Clicks</span>
|
||||
<span className="text-2xl font-heading font-extrabold text-turquoise">{totalWhatsapp}</span>
|
||||
</div>
|
||||
<div className="bg-paper p-5 rounded-2xl border border-pine/8 shadow-sm">
|
||||
<span className="text-[9px] font-mono text-pine uppercase tracking-wider block mb-1">Aramalar (Phone)</span>
|
||||
<span className="text-2xl font-heading font-extrabold text-pine">{totalPhone}</span>
|
||||
</div>
|
||||
<div className="bg-paper p-5 rounded-2xl border border-pine/8 shadow-sm">
|
||||
<span className="text-[9px] font-mono text-bougainvillea uppercase tracking-wider block mb-1">Menü Tıklama</span>
|
||||
<span className="text-2xl font-heading font-extrabold text-bougainvillea">{totalMenu}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Graphics block */}
|
||||
<div className="bg-paper border border-pine/8 rounded-3xl p-6 sm:p-8 shadow-sm space-y-6">
|
||||
<h3 className="font-heading font-extrabold text-base text-pine lowercase border-b border-dashed border-pine/8 pb-4 flex items-center gap-2">
|
||||
<BarChart3 className="w-5 h-5 text-turquoise" />
|
||||
Günlük Görüntülenme Dağılımı
|
||||
</h3>
|
||||
|
||||
{/* Custom pure styled HTML bars chart */}
|
||||
<div className="space-y-4">
|
||||
{analytics.map((item) => {
|
||||
const percentage = Math.max((item.views / maxViews) * 100, 4)
|
||||
return (
|
||||
<div key={item.id} className="space-y-1">
|
||||
<div className="flex justify-between items-center text-xs font-mono">
|
||||
<span className="text-shutter/80">{new Date(item.date).toLocaleDateString('tr-TR', { day: 'numeric', month: 'long', year: 'numeric' })}</span>
|
||||
<span className="text-pine font-bold">{item.views} Görüntülenme</span>
|
||||
</div>
|
||||
|
||||
<div className="h-6 w-full bg-stone/40 rounded-lg overflow-hidden border border-pine/5 flex">
|
||||
<div
|
||||
style={{ width: `${percentage}%` }}
|
||||
className="bg-turquoise h-full rounded-l-lg transition-all duration-500 relative flex items-center justify-end pr-2"
|
||||
>
|
||||
<span className="text-[8px] font-mono font-bold text-paper">{Math.round(percentage)}%</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex gap-4 text-[9px] font-mono text-shutter/65 px-1 pt-0.5">
|
||||
<span>WhatsApp: {item.whatsappClicks}</span>
|
||||
<span>Arama: {item.phoneClicks}</span>
|
||||
<span>Menü: {item.menuClicks}</span>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -1,7 +1,7 @@
|
||||
import { mockDb } from '@/lib/mockDb'
|
||||
import { deleteListingAction } from '@/app/actions'
|
||||
import { Link } from '@/i18n/routing'
|
||||
import { Edit, Trash, Plus, CheckCircle } from 'lucide-react'
|
||||
import { Edit, Trash, Plus, CheckCircle, BarChart3 } from 'lucide-react'
|
||||
|
||||
export default async function AdminListingsPage() {
|
||||
const listings = await mockDb.getListings()
|
||||
@@ -80,6 +80,14 @@ export default async function AdminListingsPage() {
|
||||
</td>
|
||||
<td className="px-6 py-4 text-right whitespace-nowrap">
|
||||
<div className="flex justify-end gap-2">
|
||||
<Link
|
||||
href={`/admin/listings/${l.id}/analytics`}
|
||||
className="p-1.5 bg-paper text-shutter hover:text-turquoise hover:bg-turquoise/5 rounded-lg border border-pine/10 hover:border-turquoise/25 transition shadow-sm"
|
||||
title="Analitik İstatistikleri"
|
||||
>
|
||||
<BarChart3 className="w-4 h-4" />
|
||||
</Link>
|
||||
|
||||
<Link
|
||||
href={`/admin/listings/${l.id}`}
|
||||
className="p-1.5 bg-paper text-shutter hover:text-turquoise hover:bg-turquoise/5 rounded-lg border border-pine/10 hover:border-turquoise/25 transition shadow-sm"
|
||||
|
||||
@@ -0,0 +1,23 @@
|
||||
'use client'
|
||||
|
||||
import { deleteNeighborhoodAction } from '@/app/actions'
|
||||
import { Trash } from 'lucide-react'
|
||||
|
||||
export function DeleteButton({ id }: { id: string }) {
|
||||
return (
|
||||
<button
|
||||
type="button"
|
||||
onClick={async () => {
|
||||
if (!confirm('Bu mahalleyi silmek istediğinize emin misiniz?')) return
|
||||
const res = await deleteNeighborhoodAction(id)
|
||||
if (res?.error) {
|
||||
alert(res.error)
|
||||
}
|
||||
}}
|
||||
className="p-2 text-shutter hover:text-red-500 hover:bg-red-500/10 rounded-lg transition-colors"
|
||||
title="Sil"
|
||||
>
|
||||
<Trash className="w-4 h-4" />
|
||||
</button>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,99 @@
|
||||
import { mockDb } from '@/lib/mockDb'
|
||||
import { createOrUpdateNeighborhoodAction } from '@/app/actions'
|
||||
import { Link } from '@/i18n/routing'
|
||||
import { ArrowLeft } from 'lucide-react'
|
||||
import { redirect } from 'next/navigation'
|
||||
|
||||
export default async function NeighborhoodFormPage({ params }: { params: Promise<{ id: string, locale: string }> }) {
|
||||
const resolvedParams = await params
|
||||
const isNew = resolvedParams.id === 'new'
|
||||
let neighborhood = null
|
||||
|
||||
if (!isNew) {
|
||||
neighborhood = await mockDb.getNeighborhoodById(resolvedParams.id)
|
||||
if (!neighborhood) {
|
||||
redirect(`/${resolvedParams.locale}/admin/neighborhoods`)
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="max-w-2xl mx-auto space-y-6">
|
||||
<div className="flex items-center gap-4">
|
||||
<Link href="/admin/neighborhoods" className="p-2 hover:bg-stone-deep rounded-full transition-colors text-shutter hover:text-ink">
|
||||
<ArrowLeft className="w-5 h-5" />
|
||||
</Link>
|
||||
<div>
|
||||
<h2 className="text-2xl font-heading font-extrabold text-pine lowercase">
|
||||
{isNew ? 'yeni mahalle' : 'mahalleyi düzenle'}
|
||||
</h2>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bg-paper p-6 rounded-2xl shadow-sm border border-pine/8">
|
||||
<form action={createOrUpdateNeighborhoodAction} className="space-y-5">
|
||||
<input type="hidden" name="id" value={resolvedParams.id} />
|
||||
|
||||
<div>
|
||||
<label className="block text-xs font-bold text-pine uppercase tracking-wider mb-1.5">Slug (URL)</label>
|
||||
<input
|
||||
type="text"
|
||||
name="slug"
|
||||
defaultValue={neighborhood?.slug || ''}
|
||||
required
|
||||
className="w-full bg-stone-deep/30 border border-pine/10 rounded-xl px-4 py-3 text-sm focus:outline-none focus:ring-2 focus:ring-turquoise/50"
|
||||
placeholder="orn: tepe-mahallesi"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-xs font-bold text-pine uppercase tracking-wider mb-1.5">Adı (TR)</label>
|
||||
<input
|
||||
type="text"
|
||||
name="nameTr"
|
||||
defaultValue={neighborhood?.nameTr || ''}
|
||||
required
|
||||
className="w-full bg-stone-deep/30 border border-pine/10 rounded-xl px-4 py-3 text-sm focus:outline-none focus:ring-2 focus:ring-turquoise/50"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-xs font-bold text-pine uppercase tracking-wider mb-1.5">Adı (EN)</label>
|
||||
<input
|
||||
type="text"
|
||||
name="nameEn"
|
||||
defaultValue={neighborhood?.nameEn || ''}
|
||||
required
|
||||
className="w-full bg-stone-deep/30 border border-pine/10 rounded-xl px-4 py-3 text-sm focus:outline-none focus:ring-2 focus:ring-turquoise/50"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-xs font-bold text-pine uppercase tracking-wider mb-1.5">Adı (RU)</label>
|
||||
<input
|
||||
type="text"
|
||||
name="nameRu"
|
||||
defaultValue={neighborhood?.nameRu || ''}
|
||||
required
|
||||
className="w-full bg-stone-deep/30 border border-pine/10 rounded-xl px-4 py-3 text-sm focus:outline-none focus:ring-2 focus:ring-turquoise/50"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="pt-4 flex justify-end gap-3">
|
||||
<Link
|
||||
href="/admin/neighborhoods"
|
||||
className="px-6 py-3 text-sm font-bold text-shutter hover:text-ink transition-colors"
|
||||
>
|
||||
İptal
|
||||
</Link>
|
||||
<button
|
||||
type="submit"
|
||||
className="px-6 py-3 bg-pine hover:bg-pine/90 text-paper text-sm font-bold rounded-xl transition-colors shadow-sm"
|
||||
>
|
||||
Kaydet
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -1,42 +1,67 @@
|
||||
import { mockDb } from '@/lib/mockDb'
|
||||
import { Link } from '@/i18n/routing'
|
||||
import { Plus, Edit } from 'lucide-react'
|
||||
import { DeleteButton } from './DeleteButton'
|
||||
|
||||
export default async function AdminNeighborhoodsPage() {
|
||||
const neighborhoods = await mockDb.getNeighborhoods()
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
<div className="flex items-center justify-between">
|
||||
<div className="flex flex-col sm:flex-row sm:items-center justify-between gap-4">
|
||||
<div>
|
||||
<h2 className="text-3xl font-heading font-extrabold text-pine lowercase">mahalleler</h2>
|
||||
<p className="text-ink/65 text-xs font-medium mt-1">
|
||||
Marmaris Local rehberindeki mekanların filtrelendiği mahalle/bölgeler.
|
||||
</p>
|
||||
</div>
|
||||
<Link
|
||||
href="/admin/neighborhoods/new"
|
||||
className="inline-flex items-center gap-1.5 bg-turquoise hover:bg-turquoise/90 text-paper text-xs font-bold py-3 px-5 rounded-xl shadow-sm transition active:scale-95 duration-150"
|
||||
>
|
||||
<Plus className="w-4 h-4" />
|
||||
Yeni Mahalle Ekle
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
<div className="bg-paper border border-pine/8 rounded-2xl shadow-sm overflow-hidden max-w-4xl">
|
||||
<table className="min-w-full divide-y divide-pine/8 text-sm">
|
||||
<thead className="bg-stone-deep/40 text-shutter font-mono text-[10px] uppercase tracking-wider">
|
||||
<tr>
|
||||
<th className="px-6 py-4 text-left">ID</th>
|
||||
<th className="px-6 py-4 text-left">Slug</th>
|
||||
<th className="px-6 py-4 text-left">Adı (TR)</th>
|
||||
<th className="px-6 py-4 text-left">Name (EN)</th>
|
||||
<th className="px-6 py-4 text-left">Имя (RU)</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody className="divide-y divide-dashed divide-pine/8 text-ink/85 font-medium">
|
||||
{neighborhoods.map((neigh) => (
|
||||
<tr key={neigh.id} className="hover:bg-stone/20 transition duration-150">
|
||||
<td className="px-6 py-4 font-mono text-xs text-shutter">{neigh.id}</td>
|
||||
<td className="px-6 py-4 font-mono text-xs font-bold text-turquoise">{neigh.slug}</td>
|
||||
<td className="px-6 py-4 font-heading font-bold text-pine lowercase text-sm">{neigh.nameTr}</td>
|
||||
<td className="px-6 py-4 text-xs">{neigh.nameEn}</td>
|
||||
<td className="px-6 py-4 text-xs">{neigh.nameRu}</td>
|
||||
<div className="bg-paper border border-pine/8 rounded-2xl shadow-sm overflow-hidden max-w-5xl">
|
||||
<div className="overflow-x-auto">
|
||||
<table className="min-w-full divide-y divide-pine/8 text-sm">
|
||||
<thead className="bg-stone-deep/40 text-shutter font-mono text-[10px] uppercase tracking-wider">
|
||||
<tr>
|
||||
<th className="px-6 py-4 text-left">ID</th>
|
||||
<th className="px-6 py-4 text-left">Slug</th>
|
||||
<th className="px-6 py-4 text-left">Adı (TR)</th>
|
||||
<th className="px-6 py-4 text-left">Name (EN)</th>
|
||||
<th className="px-6 py-4 text-left">Имя (RU)</th>
|
||||
<th className="px-6 py-4 text-right">İşlemler</th>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</thead>
|
||||
<tbody className="divide-y divide-dashed divide-pine/8 text-ink/85 font-medium">
|
||||
{neighborhoods.map((neigh) => (
|
||||
<tr key={neigh.id} className="hover:bg-stone/20 transition duration-150">
|
||||
<td className="px-6 py-4 font-mono text-xs text-shutter">{neigh.id}</td>
|
||||
<td className="px-6 py-4 font-mono text-xs font-bold text-turquoise">{neigh.slug}</td>
|
||||
<td className="px-6 py-4 font-heading font-bold text-pine lowercase text-sm">{neigh.nameTr}</td>
|
||||
<td className="px-6 py-4 text-xs">{neigh.nameEn}</td>
|
||||
<td className="px-6 py-4 text-xs">{neigh.nameRu}</td>
|
||||
<td className="px-6 py-4 text-right">
|
||||
<div className="flex justify-end gap-2">
|
||||
<Link
|
||||
href={`/admin/neighborhoods/${neigh.id}`}
|
||||
className="p-2 text-shutter hover:text-turquoise hover:bg-turquoise/10 rounded-lg transition-colors"
|
||||
title="Düzenle"
|
||||
>
|
||||
<Edit className="w-4 h-4" />
|
||||
</Link>
|
||||
<DeleteButton id={neigh.id} />
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
|
||||
@@ -0,0 +1,43 @@
|
||||
'use client'
|
||||
|
||||
import { restoreListingAction, hardDeleteListingAction } from '@/app/actions'
|
||||
import { RotateCcw, Trash2 } from 'lucide-react'
|
||||
|
||||
export function TrashActionButtons({ id, type }: { id: string; type: 'listing' | 'event' }) {
|
||||
const handleRestore = async () => {
|
||||
if (!confirm('Bu ögeyi geri yüklemek istediğinize emin misiniz? Ana listeye eklenecektir.')) return
|
||||
|
||||
if (type === 'listing') {
|
||||
const res = await restoreListingAction(id)
|
||||
if (res?.error) alert(res.error)
|
||||
}
|
||||
}
|
||||
|
||||
const handleHardDelete = async () => {
|
||||
if (!confirm('DİKKAT: Bu ögeyi kalıcı olarak silmek istediğinize emin misiniz? Bu işlem geri alınamaz!')) return
|
||||
|
||||
if (type === 'listing') {
|
||||
const res = await hardDeleteListingAction(id)
|
||||
if (res?.error) alert(res.error)
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="flex justify-end gap-2">
|
||||
<button
|
||||
onClick={handleRestore}
|
||||
className="p-2 text-shutter hover:text-turquoise hover:bg-turquoise/10 rounded-lg transition-colors"
|
||||
title="Geri Yükle"
|
||||
>
|
||||
<RotateCcw className="w-4 h-4" />
|
||||
</button>
|
||||
<button
|
||||
onClick={handleHardDelete}
|
||||
className="p-2 text-shutter hover:text-red-500 hover:bg-red-500/10 rounded-lg transition-colors"
|
||||
title="Kalıcı Olarak Sil"
|
||||
>
|
||||
<Trash2 className="w-4 h-4" />
|
||||
</button>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,87 @@
|
||||
import { mockDb } from '@/lib/mockDb'
|
||||
import { Link } from '@/i18n/routing'
|
||||
import { TrashActionButtons } from './TrashActionButtons'
|
||||
import { RotateCcw, Trash2, Calendar, MapPin } from 'lucide-react'
|
||||
|
||||
export default async function AdminTrashPage() {
|
||||
const deletedListings = await mockDb.getDeletedListings()
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
<div className="flex items-center justify-between">
|
||||
<div>
|
||||
<h2 className="text-3xl font-heading font-extrabold text-pine lowercase">çöp kutusu</h2>
|
||||
<p className="text-ink/65 text-xs font-medium mt-1">
|
||||
Silinmiş mekanları buradan görebilir, geri yükleyebilir veya kalıcı olarak silebilirsiniz.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bg-paper border border-pine/8 rounded-2xl shadow-sm overflow-hidden max-w-5xl">
|
||||
<div className="p-4 border-b border-pine/5 bg-stone-deep/20">
|
||||
<h3 className="font-heading font-bold text-pine text-sm uppercase tracking-wider">Silinmiş Mekanlar</h3>
|
||||
</div>
|
||||
|
||||
{deletedListings.length === 0 ? (
|
||||
<div className="p-12 text-center text-shutter">
|
||||
<Trash2 className="w-12 h-12 mx-auto mb-3 opacity-20" />
|
||||
<p className="text-sm font-medium">Çöp kutusu boş.</p>
|
||||
</div>
|
||||
) : (
|
||||
<div className="overflow-x-auto">
|
||||
<table className="min-w-full divide-y divide-pine/8 text-sm">
|
||||
<thead className="bg-stone-deep/40 text-shutter font-mono text-[10px] uppercase tracking-wider">
|
||||
<tr>
|
||||
<th className="px-6 py-4 text-left">Mekan Adı</th>
|
||||
<th className="px-6 py-4 text-left">Kategori & Mahalle</th>
|
||||
<th className="px-6 py-4 text-left">Silinme Tarihi</th>
|
||||
<th className="px-6 py-4 text-right">İşlemler</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody className="divide-y divide-dashed divide-pine/8 text-ink/85 font-medium">
|
||||
{deletedListings.map((listing) => (
|
||||
<tr key={listing.id} className="hover:bg-stone/20 transition duration-150">
|
||||
<td className="px-6 py-4">
|
||||
<div className="font-heading font-bold text-pine lowercase text-sm">
|
||||
{listing.nameTr}
|
||||
</div>
|
||||
<div className="text-[10px] text-shutter font-mono uppercase tracking-wider mt-0.5">
|
||||
{listing.slug}
|
||||
</div>
|
||||
</td>
|
||||
<td className="px-6 py-4 text-xs">
|
||||
<div className="flex flex-col gap-1">
|
||||
{listing.category && (
|
||||
<span className="inline-flex items-center gap-1 text-turquoise">
|
||||
{listing.category.nameTr}
|
||||
</span>
|
||||
)}
|
||||
{listing.neighborhood && (
|
||||
<span className="inline-flex items-center gap-1 text-shutter">
|
||||
<MapPin className="w-3 h-3" />
|
||||
{listing.neighborhood.nameTr}
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
</td>
|
||||
<td className="px-6 py-4 font-mono text-xs text-shutter">
|
||||
<div className="flex items-center gap-1.5">
|
||||
<Calendar className="w-3.5 h-3.5" />
|
||||
{listing.deletedAt ? new Date(listing.deletedAt).toLocaleDateString('tr-TR', {
|
||||
day: 'numeric', month: 'short', year: 'numeric', hour: '2-digit', minute: '2-digit'
|
||||
}) : '-'}
|
||||
</div>
|
||||
</td>
|
||||
<td className="px-6 py-4 text-right">
|
||||
<TrashActionButtons id={listing.id} type="listing" />
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,108 @@
|
||||
import { mockDb } from '@/lib/mockDb'
|
||||
import { Link } from '@/i18n/routing'
|
||||
import { Globe, Calendar, CheckCircle, ExternalLink } from 'lucide-react'
|
||||
|
||||
export default async function AdminWidgetPartnersPage() {
|
||||
const partners = await mockDb.getWidgetPartners()
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
<div>
|
||||
<h2 className="text-3xl font-heading font-extrabold text-pine lowercase">widget ortakları (backlinks)</h2>
|
||||
<p className="text-ink/65 text-xs font-medium mt-1">
|
||||
Ajans sinerjisi kapsamında Marmaris Local bölgesel öneri widget'ını kendi web sitelerine yerleştiren anlaşmalı işletmeler.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* Stats row */}
|
||||
<div className="grid grid-cols-1 sm:grid-cols-3 gap-4">
|
||||
<div className="bg-paper p-6 rounded-2xl border border-pine/8 shadow-sm">
|
||||
<span className="text-[10px] font-mono text-shutter uppercase tracking-wider block mb-1">Toplam Partner</span>
|
||||
<span className="text-3xl font-heading font-extrabold text-pine leading-none">{partners.length}</span>
|
||||
</div>
|
||||
<div className="bg-paper p-6 rounded-2xl border border-pine/8 shadow-sm">
|
||||
<span className="text-[10px] font-mono text-shutter uppercase tracking-wider block mb-1">Aktif Backlinks</span>
|
||||
<span className="text-3xl font-heading font-extrabold text-turquoise leading-none">{partners.filter(p => p.widgetSiteUrl).length}</span>
|
||||
</div>
|
||||
<div className="bg-paper p-6 rounded-2xl border border-pine/8 shadow-sm">
|
||||
<span className="text-[10px] font-mono text-shutter uppercase tracking-wider block mb-1">Pilot Bölge</span>
|
||||
<span className="text-3xl font-heading font-extrabold text-bougainvillea leading-none">yat limanı</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Partner List Table */}
|
||||
<div className="bg-paper border border-pine/8 rounded-2xl shadow-sm overflow-hidden">
|
||||
<div className="overflow-x-auto">
|
||||
<table className="min-w-full divide-y divide-pine/8 text-sm">
|
||||
<thead className="bg-stone-deep/40 text-shutter font-mono text-[10px] uppercase tracking-wider">
|
||||
<tr>
|
||||
<th className="px-6 py-4 text-left">Mekan</th>
|
||||
<th className="px-6 py-4 text-left">Mahalle</th>
|
||||
<th className="px-6 py-4 text-left">Kurulum Tarihi</th>
|
||||
<th className="px-6 py-4 text-left">Müşteri Web Sitesi</th>
|
||||
<th className="px-6 py-4 text-left">Durum</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody className="divide-y divide-dashed divide-pine/8 text-ink/80">
|
||||
{partners.length === 0 ? (
|
||||
<tr>
|
||||
<td colSpan={5} className="px-6 py-12 text-center text-xs text-shutter font-medium">
|
||||
Henüz widget kurulumu yapılmış partner bulunmuyor.
|
||||
</td>
|
||||
</tr>
|
||||
) : (
|
||||
partners.map((partner) => {
|
||||
return (
|
||||
<tr key={partner.id} className="hover:bg-stone/20 transition duration-150">
|
||||
<td className="px-6 py-4 font-medium">
|
||||
<Link href={`/admin/listings/${partner.id}`} className="font-heading font-bold text-pine lowercase text-sm hover:text-turquoise transition-colors">
|
||||
{partner.nameTr}
|
||||
</Link>
|
||||
<div className="text-[10px] text-shutter font-mono uppercase tracking-wider mt-0.5">{partner.category?.nameTr}</div>
|
||||
</td>
|
||||
<td className="px-6 py-4 font-medium text-xs">
|
||||
{partner.neighborhood?.nameTr}
|
||||
</td>
|
||||
<td className="px-6 py-4 font-mono text-xs">
|
||||
{partner.widgetInstalledAt ? (
|
||||
<div className="flex items-center gap-1">
|
||||
<Calendar className="w-3.5 h-3.5 text-shutter/60" />
|
||||
{new Date(partner.widgetInstalledAt).toLocaleDateString('tr-TR')}
|
||||
</div>
|
||||
) : (
|
||||
'-'
|
||||
)}
|
||||
</td>
|
||||
<td className="px-6 py-4 font-mono text-xs">
|
||||
{partner.widgetSiteUrl ? (
|
||||
<a
|
||||
href={partner.widgetSiteUrl}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="text-turquoise hover:underline flex items-center gap-1 font-medium"
|
||||
>
|
||||
<Globe className="w-3.5 h-3.5 shrink-0" />
|
||||
{partner.widgetSiteUrl.replace('https://', '')}
|
||||
<ExternalLink className="w-3 h-3" />
|
||||
</a>
|
||||
) : (
|
||||
'-'
|
||||
)}
|
||||
</td>
|
||||
<td className="px-6 py-4 whitespace-nowrap">
|
||||
<span className="inline-flex items-center gap-1 rounded-full bg-paper px-2.5 py-0.5 text-[10px] font-mono font-bold text-turquoise border border-turquoise/20 uppercase tracking-wider">
|
||||
<CheckCircle className="w-3.5 h-3.5" />
|
||||
widget aktif
|
||||
</span>
|
||||
</td>
|
||||
</tr>
|
||||
)
|
||||
})
|
||||
)}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user