40 lines
1.5 KiB
TypeScript
40 lines
1.5 KiB
TypeScript
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>
|
||
);
|
||
}
|