'use client'

import { useState } from 'react'
import { useRouter } from 'next/navigation'

interface Props {
  dealer?: {
    id: number; dealerCode: string; companyName: string; contactName: string
    email: string; phone?: string | null; address?: string | null; city?: string | null
    discountRate: number
  }
}

export default function AdminDealerForm({ dealer }: Props) {
  const router = useRouter()
  const isEdit = !!dealer?.id

  const [form, setForm] = useState({
    dealerCode: dealer?.dealerCode ?? '',
    companyName: dealer?.companyName ?? '',
    contactName: dealer?.contactName ?? '',
    email: dealer?.email ?? '',
    phone: dealer?.phone ?? '',
    address: dealer?.address ?? '',
    city: dealer?.city ?? '',
    discountRate: dealer?.discountRate ?? 0,
    password: '',
  })
  const [saving, setSaving] = useState(false)
  const [error, setError] = useState<string | null>(null)

  const set = (k: keyof typeof form, v: string | number) => setForm(f => ({ ...f, [k]: v }))

  async function handleSubmit(e: React.FormEvent) {
    e.preventDefault()
    if (!isEdit && !form.password) { setError('Şifre zorunludur.'); return }
    setSaving(true); setError(null)

    const url = isEdit ? `/api/admin/dealers/${dealer!.id}` : '/api/admin/dealers'
    const body = { ...form, dealerCode: form.dealerCode.toUpperCase() }
    if (isEdit && !body.password) delete (body as any).password

    try {
      const res = await fetch(url, { method: isEdit ? 'PATCH' : 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(body) })
      const data = await res.json()
      if (!res.ok) { setError(data.error ?? 'Kayıt başarısız'); return }
      router.push('/admin/dealers'); router.refresh()
    } catch { setError('Bir hata oluştu.') } finally { setSaving(false) }
  }

  const ic = 'w-full px-3 py-2.5 rounded-lg border border-sand bg-cream font-body text-sm focus:outline-none focus:border-earth transition-colors'
  const lc = 'block font-body text-sm text-brown mb-1.5'

  return (
    <form onSubmit={handleSubmit} className="bg-white p-6 shadow-sm rounded-xl space-y-5">
      <div className="grid grid-cols-1 sm:grid-cols-2 gap-5">
        <div>
          <label className={lc}>Bayi Kodu * <span className="text-brown/40 text-xs">(PA-0001 vb.)</span></label>
          <input type="text" required value={form.dealerCode} onChange={e => set('dealerCode', e.target.value)} className={ic} placeholder="PA-0001" disabled={isEdit} />
        </div>
        <div>
          <label className={lc}>{isEdit ? 'Yeni Şifre (boş bırakılırsa değişmez)' : 'Şifre *'}</label>
          <input type="password" required={!isEdit} minLength={8} value={form.password} onChange={e => set('password', e.target.value)} className={ic} />
        </div>
        <div className="sm:col-span-2">
          <label className={lc}>Firma Adı *</label>
          <input type="text" required value={form.companyName} onChange={e => set('companyName', e.target.value)} className={ic} />
        </div>
        <div>
          <label className={lc}>Yetkili Adı Soyadı *</label>
          <input type="text" required value={form.contactName} onChange={e => set('contactName', e.target.value)} className={ic} />
        </div>
        <div>
          <label className={lc}>E-posta *</label>
          <input type="email" required value={form.email} onChange={e => set('email', e.target.value)} className={ic} />
        </div>
        <div>
          <label className={lc}>Telefon</label>
          <input type="tel" value={form.phone} onChange={e => set('phone', e.target.value)} className={ic} />
        </div>
        <div>
          <label className={lc}>Şehir</label>
          <input type="text" value={form.city} onChange={e => set('city', e.target.value)} className={ic} />
        </div>
        <div className="sm:col-span-2">
          <label className={lc}>Adres</label>
          <textarea rows={2} value={form.address} onChange={e => set('address', e.target.value)} className={`${ic} resize-none`} />
        </div>
        <div>
          <label className={lc}>İndirim Oranı (%) <span className="text-brown/40 text-xs">0–100</span></label>
          <input type="number" min="0" max="100" step="0.5" value={form.discountRate} onChange={e => set('discountRate', parseFloat(e.target.value) || 0)} className={ic} />
        </div>
      </div>

      {error && <p className="bg-red-50 text-red-600 font-body text-sm rounded-lg px-3 py-2">{error}</p>}

      <div className="flex gap-3 pt-2">
        <button type="submit" disabled={saving}
          className="px-8 py-2.5 rounded-lg bg-brown text-cream font-body text-sm tracking-widest uppercase hover:bg-earth transition-colors disabled:opacity-60">
          {saving ? 'Kaydediliyor...' : isEdit ? 'Güncelle' : 'Bayi Oluştur'}
        </button>
        <button type="button" onClick={() => router.push('/admin/dealers')}
          className="px-6 py-2.5 rounded-lg border border-sand text-brown font-body text-sm hover:border-earth transition-colors">
          İptal
        </button>
      </div>
    </form>
  )
}