feat:前端
This commit is contained in:
@@ -0,0 +1,12 @@
|
||||
"use client";
|
||||
|
||||
import Link from "next/link";
|
||||
import { ArrowLeft } from "lucide-react";
|
||||
import { FormEvent, useState } from "react";
|
||||
import { apiFetch } from "@/lib/api";
|
||||
|
||||
export default function AccountAdjustPage() {
|
||||
const [direction, setDirection] = useState<"add" | "sub">("add"); const [amount, setAmount] = useState(""); const [message, setMessage] = useState("");
|
||||
async function submit(event: FormEvent) { event.preventDefault(); try { await apiFetch("/account/adjust", { method: "POST", body: JSON.stringify({ direction, amount }) }); setMessage("余额调整已提交"); setAmount(""); } catch (error) { setMessage(error instanceof Error ? error.message : "余额调整失败"); } }
|
||||
return <main className="min-h-screen bg-slate-50 px-8 py-12"><div className="mx-auto max-w-xl"><Link href="/account" className="inline-flex items-center gap-2 text-sm text-slate-500"><ArrowLeft className="h-4 w-4" />返回用户中心</Link><div className="mt-8 rounded-xl border border-slate-200 bg-white p-8"><h1 className="text-2xl font-semibold text-[var(--brand-navy)]">账户余额调整</h1><p className="mt-2 text-sm text-slate-500">充值或提现将由后端进行权限与金额校验。</p><form onSubmit={submit} className="mt-7 space-y-5"><label className="block text-sm font-medium">操作类型<select value={direction} onChange={(event) => setDirection(event.target.value as "add" | "sub")} className="mt-2 w-full rounded-lg border border-slate-200 px-3 py-3"><option value="add">充值</option><option value="sub">提现</option></select></label><label className="block text-sm font-medium">金额<input required min="0.01" step="0.01" type="number" value={amount} onChange={(event) => setAmount(event.target.value)} className="mt-2 w-full rounded-lg border border-slate-200 px-3 py-3" /></label><button className="w-full rounded-lg bg-[var(--brand-primary)] px-4 py-3 text-sm font-semibold text-white">提交</button></form>{message && <p className="mt-4 rounded-lg bg-slate-50 p-3 text-sm text-slate-600">{message}</p>}</div></div></main>;
|
||||
}
|
||||
Reference in New Issue
Block a user