import Link from 'next/link';
import { ringArea } from '@/lib/sale';
import { notFound } from 'next/navigation';
import { prisma } from '@/lib/db';
import { templateById } from '@/lib/templates';
import { voiceById, langName } from '@/lib/voices';
import { saleSummary } from '@/lib/sale';
import { planById } from '@/lib/plans';
import { StatusBadge } from '@/components/StatusBadge';
import { AHead, KV, Panel } from '@/components/admin/ui';
import { ActionForm } from '@/components/admin/ActionForm';
import { ACTION_TR, PAY_TR, dt, dur, tryFmt } from '@/lib/admin';
import { cancelOrder, releaseClaim, rerenderOrder, shareOff } from '../../actions';
import { apLong } from '@/lib/ap';
import { OrderPhotos } from '@/components/OrderPhotos';

const JOB_TR: Record<string, string> = { queued: 'Kuyrukta', running: 'Çalışıyor', done: 'Bitti', dead: 'Ölü kuyruk', failed: 'Hata', external: 'Harici ajan', cancelled: 'İptal' };

export default async function OrderDetail({ params }: { params: Promise<{ id: string }> }) {
  const { id } = await params;
  const o = await prisma.order.findUnique({ where: { id }, include: { user: true, jobs: { orderBy: { createdAt: 'desc' } }, payments: { orderBy: { createdAt: 'desc' } } } });
  if (!o) notFound();
  const logs = await prisma.adminLog.findMany({ where: { targetType: 'order', targetId: id }, orderBy: { createdAt: 'desc' }, take: 20 });
  const area = o.areaM2 ? `${Math.round(o.areaM2).toLocaleString('tr-TR')} m²` : null;
  const src = o.videoKey ? `/api/orders/${o.id}/download` : o.videoUrl || '';
  const maps = o.centroidLat && o.centroidLon ? `https://www.google.com/maps?q=${o.centroidLat},${o.centroidLon}&t=k` : null;
  const app = process.env.APP_URL || '';
  return (
    <div className="space-y-4">
      <AHead kicker={<Link href="/krtf1krtf/siparisler" className="hover:underline">‹ Siparişler</Link> } title={<span className="flex flex-wrap items-center gap-3">{apLong(o.ada, o.parsel)} <StatusBadge s={o.status} /></span>}>
        <span className="font-mono text-[13px]">{o.code}</span>
      </AHead>

      <div className="grid gap-4 xl:grid-cols-[1fr_340px]">
        <div className="space-y-4">
          <div className="grid gap-4 md:grid-cols-[220px_1fr]">
            <div className="bg-ink">
              {src ? <video src={src} poster={o.posterKey ? `/api/orders/${o.id}/download?f=poster` : undefined} controls playsInline preload="none" className="aspect-[9/16] w-full object-cover" />
                : <div className="grid aspect-[9/16] place-items-center p-4 text-center text-[12.5px] text-white/60">{o.status === 'RENDERING' ? `Üretiliyor · %${o.progress}` : 'Video yok'}</div>}
            </div>
            <Panel title="Sipariş">
              <KV rows={[
                ['Konum', `${o.mahalle}, ${o.ilce} / ${o.il}`], ['Satılan', saleSummary(o) || 'Boş arsa / tarla'], ['Mahalle no', String(o.mahalleId)], ['Yüzölçümü', area], ['Nitelik', o.nitelik],
                ['Şablon', templateById(o.template).name], ['Ses', `${voiceById(o.voice).name} · ${langName(o.lang)}`], ['İlan fiyatı', o.price ? '₺' + o.price.toLocaleString('tr-TR') : '—'], ['Karekod', o.qrUrl || '—'], ['Paket', `${planById(o.plan)?.name || o.plan} · ${o.quality}`],
                ['İmar', [o.imarDurum, o.emsal && `E ${o.emsal}`, o.taks && `TAKS ${o.taks}`, o.gabari && `H ${o.gabari}`].filter(Boolean).join(' · ')],
                ['Başlık', o.headline], ['Öne çıkanlar', o.highlights.join(' · ')], ['Kapanış', [o.contactName, o.contactPhone].filter(Boolean).join(' · ')],
                ['Logo', o.logoKey ? 'var' : 'yok'], ['İlerleme', o.status === 'RENDERING' || o.status === 'QUEUED' ? `%${o.progress} · ${o.progressMsg || ''}` : null],
                ['Hata', o.error ? <span className="text-survey-dark">{o.error}</span> : null], ['Harici ajan', o.claimedBy], ['Toplu grup', o.batchId],
                ['Paylaşım', o.shareToken ? <a href={`${app}/izle/${o.shareToken}`} target="_blank" rel="noopener" className="underline">{`/izle/${o.shareToken}`}</a> : null],
                ['Oluşturma', dt(o.createdAt)], ['Teslim', o.deliveredAt ? `${dt(o.deliveredAt)} · ${dur(o.deliveredAt.getTime() - o.createdAt.getTime())}` : null],
                ['Süre', o.durationSec ? `${o.durationSec.toFixed(1)} sn` : null],
                ['Satılan bölüm', Array.isArray(o.targetRing) && o.targetRing.length >= 3 ? `haritada çizildi · ≈${Math.round(ringArea(o.targetRing as number[][])).toLocaleString('tr-TR')} m²` : null],
                ['Seçilen yapı', o.targetLat && o.targetLon ? <a href={`https://www.google.com/maps?q=${o.targetLat},${o.targetLon}&t=k`} target="_blank" rel="noopener" className="underline">uydu haritasında aç</a> : null],
                ['Konum bağlantısı', maps ? <a href={maps} target="_blank" rel="noopener" className="underline">Uydu haritasında aç</a> : null],
              ]} />
            </Panel>
          </div>

          {o.photoKeys.length > 0 && <Panel title={`İlan fotoğrafları (${o.photoKeys.length})`}><OrderPhotos id={o.id} count={o.photoKeys.length} /></Panel>}
          <Panel title={`Üretim işleri (${o.jobs.length})`} pad={false}>
            {o.jobs.length ? (
              <div className="divide-y divide-ink/5">{o.jobs.map((j) => (
                <div key={j.id} className="px-4 py-2.5 text-[13px]">
                  <div className="flex flex-wrap items-center gap-x-4 gap-y-1">
                    <b className={j.status === 'dead' ? 'text-survey' : ''}>{JOB_TR[j.status] || j.status}</b>
                    <span>deneme {j.attempts}</span><span className="text-ink-soft">oluşturma {dt(j.createdAt)}</span>
                    {j.lockedBy && <span className="text-ink-soft">işçi {j.lockedBy} · {dt(j.lockedAt)}</span>}
                    {j.status === 'queued' && <span className="text-ink-soft">çalışma zamanı {dt(j.runAfter)}</span>}
                  </div>
                  {j.lastError && <details className="mt-1"><summary className="cursor-pointer text-[12px] text-survey-dark">Son hata</summary><pre className="mt-1 max-h-72 overflow-auto whitespace-pre-wrap bg-paper-2 p-2 text-[11.5px]">{j.lastError}</pre></details>}
                </div>
              ))}</div>
            ) : <p className="px-4 py-3 text-[13px] text-ink-soft">Bu sipariş için iş oluşturulmamış.</p>}
          </Panel>

          <Panel title={`Ödemeler (${o.payments.length})`} pad={false}>
            {o.payments.length ? (
              <table className="w-full text-left text-[13px]"><tbody>{o.payments.map((p) => (
                <tr key={p.id} className="border-b border-ink/5 [&>td]:px-4 [&>td]:py-2"><td className="num">{dt(p.createdAt)}</td><td>{planById(p.plan)?.name || p.plan} · {p.credits} kredi</td><td className="num">{tryFmt(p.amount, p.currency)}</td><td>{PAY_TR[p.status] || p.status}</td><td className="font-mono text-[11.5px] text-ink-soft">{p.dodoPaymentId || p.dodoSessionId || ''}</td></tr>
              ))}</tbody></table>
            ) : <p className="px-4 py-3 text-[13px] text-ink-soft">Bu siparişe bağlı ödeme yok (kredi ile ödenmiş olabilir).</p>}
          </Panel>

          {logs.length > 0 && (
            <Panel title="Yönetici işlemleri" pad={false}>
              <ul className="divide-y divide-ink/5">{logs.map((l) => <li key={l.id} className="px-4 py-2 text-[13px]"><b>{ACTION_TR[l.action] || l.action}</b> · {l.adminEmail} <span className="text-ink-soft">· {dt(l.createdAt)}</span>{l.detail ? <span className="block font-mono text-[11.5px] text-ink-soft">{JSON.stringify(l.detail)}</span> : null}</li>)}</ul>
            </Panel>
          )}
        </div>

        <div className="space-y-4">
          <Panel title="Müşteri">
            <Link href={`/krtf1krtf/kullanicilar/${o.userId}`} className="block text-[15px] font-bold hover:underline">{o.user.company || o.user.name}</Link>
            <div className="text-[13px] text-ink-soft">{o.user.email}{o.user.phone ? ` · ${o.user.phone}` : ''}</div>
            <div className="mt-2 text-[13px]">Kalan kredi: <b className="num">{o.user.credits}</b></div>
          </Panel>
          <Panel title="İşlemler">
            <div className="space-y-3">
              {src && <a href={o.videoKey ? `/api/orders/${o.id}/download?dl=1` : src} className="btn-ink btn-sm w-full">MP4 indir</a>}
              {!['QUEUED', 'RENDERING', 'PENDING_PAYMENT'].includes(o.status) && (
                <ActionForm action={rerenderOrder} hidden={{ id: o.id }} label={o.status === 'DELIVERED' ? 'Yeniden üret (ücretsiz)' : 'Yeniden kuyruğa al'} tone="signal"
                  confirm={o.status === 'DELIVERED' ? 'Teslim edilmiş video yeniden üretilecek ve mevcut dosyanın üzerine yazılacak. Devam edilsin mi?' : undefined} />
              )}
              {o.claimedBy && ['RENDERING', 'QUEUED', 'PAID'].includes(o.status) && <ActionForm action={releaseClaim} hidden={{ id: o.id }} label="Harici sahipliği bırak" confirm="Ajan bu siparişi işlemeyi bırakmış olmalı. İç işçiye devredilsin mi?" />}
              {o.shareToken && <ActionForm action={shareOff} hidden={{ id: o.id }} label="Paylaşım bağlantısını kapat" />}
              {['PENDING_PAYMENT', 'PAID', 'QUEUED', 'FAILED'].includes(o.status) && (
                <ActionForm action={cancelOrder} hidden={{ id: o.id }} label="Siparişi iptal et" tone="danger" confirm="Sipariş iptal edilecek. Emin misiniz?"
                  fields={['PAID', 'QUEUED'].includes(o.status) ? <label className="mb-2 flex items-center gap-2 text-[13px]"><input type="checkbox" name="refund" defaultChecked /> Kullanıcıya 1 kredi iade et</label> : <p className="mb-2 text-[12px] text-ink-soft">{o.status === 'FAILED' ? 'Kredisi işçi tarafından zaten iade edildi.' : 'Ödenmemiş; kredi hareketi olmaz.'}</p>} />
              )}
              {o.status === 'RENDERING' && <p className="text-[12.5px] text-ink-soft">Üretim sürerken iptal ve yeniden üretim kapalıdır. 45 dakikadan uzun takılırsa işçi işi otomatik geri alır.</p>}
            </div>
          </Panel>
        </div>
      </div>
    </div>
  );
}