feat(driver-pwa): payments history screen

Co-Authored-By: claude-flow <ruv@ruv.net>
2026-06-18 19:39:58 +10:00
parent 0a164634f8
commit 66ef403bc0
2 changed files with 64 additions and 1 deletions
@@ -1 +1,39 @@
-export function HistoryPage() { return null; }
+import { useQuery } from "@tanstack/react-query";
+import { useNavigate } from "react-router-dom";
+import { getPayments } from "@/api/driver";
+import { formatMoney } from "@/lib/format";
+import { Spinner } from "@/components/Spinner";
+
+const STATUS_RU: Record<string, string> = {
+  PAID: "Оплачено", NEW: "Ожидает", FORM: "Ожидает", CONFIRMED: "Оплачено", REJECTED: "Отклонён",
+};
+
+export function HistoryPage() {
+  const nav = useNavigate();
+  const { data, isLoading } = useQuery({ queryKey: ["payments"], queryFn: getPayments });
+  const rows = data?.payments ?? [];
+
+  return (
+    <div className="pt-2">
+      <button className="text-muted text-xs mb-3" onClick={() => nav("/")}>‹ Назад</button>
+      <h1 className="text-lg font-extrabold mb-4">История пополнений</h1>
+      {isLoading ? (
+        <div className="flex justify-center py-10"><Spinner /></div>
+      ) : rows.length === 0 ? (
+        <p className="text-muted text-sm">Пока нет пополнений</p>
+      ) : (
+        rows.map((p) => (
+          <div key={p.order_id} className="flex justify-between items-center py-3 border-b border-line">
+            <div>
+              <p className="text-sm">{p.bucket}</p>
+              <p className="text-muted text-xs">
+                {p.created_at ? new Date(p.created_at).toLocaleDateString("ru-RU") : ""} · {STATUS_RU[p.status] ?? p.status}
+              </p>
+            </div>
+            <b>{formatMoney(p.amount)}</b>
+          </div>
+        ))
+      )}
+    </div>
+  );
+}