feat(borç): borç takibi ekranları (Panel kartı, /borc, /taksitler)

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-11-14 04:40:51 +03:00
parent 11402ba660
commit c063186e80
18 changed files with 1490 additions and 6 deletions
@@ -0,0 +1,106 @@
+import { useState } from 'react'
+import { Loader2, Plus, X } from 'lucide-react'
+import { toast } from 'sonner'
+import { FormError } from '@/components/form-field'
+import { MoneyInput } from '@/components/money-input'
+import { Button } from '@/components/ui/button'
+import { Input } from '@/components/ui/input'
+import { monthIndex, monthName, useSetTargets } from '@/lib/debt'
+import { formatNumber, parseMoney } from '@/lib/format'
+import { formatMonth } from '@/lib/reports'
+import { t } from '@/lib/strings'
+import type { DebtTarget } from '@/types/DebtTarget'
+
+const s = t.debt
+type Row = { key: number; month: string; amount: string }
+
+/** Yol haritası: ay → ay sonu toplam borç hedefi (liste olduğu gibi kaydedilir) */
+export function TargetsEditor({
+  targets,
+  thisMonth,
+}: {
+  targets: DebtTarget[]
+  thisMonth: string
+}) {
+  const save = useSetTargets()
+  const [rows, setRows] = useState<Row[]>(() =>
+    targets.map((tg, i) => ({
+      key: i,
+      month: tg.month,
+      amount: formatNumber(tg.closing_target / 100),
+    })),
+  )
+  const [error, setError] = useState<string>()
+
+  function add() {
+    const last = rows.length ? monthIndex(rows[rows.length - 1].month) : monthIndex(thisMonth)
+    setRows([
+      ...rows,
+      { key: Date.now(), month: monthName((last ?? 0) + (rows.length ? 1 : 0)), amount: '' },
+    ])
+  }
+
+  async function submit() {
+    setError(undefined)
+    const out: DebtTarget[] = []
+    for (const r of rows) {
+      const k = parseMoney(r.amount)
+      if (monthIndex(r.month) === null || k === null || k < 0)
+        return setError(`${r.month || '?'}: ay ya da tutar geçersiz`)
+      out.push({ month: r.month, closing_target: k })
+    }
+    try {
+      await save.mutateAsync(out.sort((a, b) => a.month.localeCompare(b.month)))
+      toast.success(s.targetsSaved)
+    } catch (e) {
+      setError(e instanceof Error ? e.message : String(e))
+    }
+  }
+
+  return (
+    <div className="space-y-3">
+      <p className="text-sm text-muted-foreground">{s.targetsHint}</p>
+      <ul className="space-y-2">
+        {rows.map((r, i) => (
+          <li key={r.key} className="flex items-center gap-2">
+            <Input
+              type="month"
+              aria-label={s.month}
+              value={r.month}
+              onChange={(e) =>
+                setRows(rows.map((x, j) => (j === i ? { ...x, month: e.target.value } : x)))
+              }
+              className="w-40 shrink-0"
+            />
+            <div className="min-w-0 flex-1">
+              <MoneyInput
+                aria-label={`${s.targetAmount} ${r.month ? formatMonth(r.month) : ''}`}
+                value={r.amount}
+                onChange={(v) => setRows(rows.map((x, j) => (j === i ? { ...x, amount: v } : x)))}
+              />
+            </div>
+            <Button
+              variant="ghost"
+              size="icon"
+              aria-label={s.removeTarget(r.month)}
+              onClick={() => setRows(rows.filter((_, j) => j !== i))}
+            >
+              <X aria-hidden />
+            </Button>
+          </li>
+        ))}
+      </ul>
+      <FormError message={error} />
+      <div className="flex flex-wrap gap-2">
+        <Button variant="outline" onClick={add}>
+          <Plus aria-hidden />
+          {s.addTarget}
+        </Button>
+        <Button onClick={() => void submit()} disabled={save.isPending}>
+          {save.isPending && <Loader2 className="animate-spin" aria-hidden />}
+          {s.saveTargets}
+        </Button>
+      </div>
+    </div>
+  )
+}