54 lines
2.7 KiB
TypeScript
54 lines
2.7 KiB
TypeScript
"use client";
|
|
|
|
import { useState, useTransition } from "react";
|
|
import { useRouter } from "next/navigation";
|
|
import { toast } from "sonner";
|
|
import { setCommissionAvailability } from "@/app/admin/commission/actions";
|
|
import { Alert, AlertDescription } from "@/components/ui/alert";
|
|
import { Badge } from "@/components/ui/badge";
|
|
import { Button } from "@/components/ui/button";
|
|
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
|
|
import { Textarea } from "@/components/ui/textarea";
|
|
|
|
export function AdminCommissionAvailabilityControl({ isOpen, closureMessage }: {
|
|
isOpen: boolean; closureMessage: string;
|
|
}) {
|
|
const router = useRouter();
|
|
const [message, setMessage] = useState(closureMessage);
|
|
const [pending, startTransition] = useTransition();
|
|
const [error, setError] = useState("");
|
|
|
|
function save(nextOpen: boolean) {
|
|
setError("");
|
|
startTransition(async () => {
|
|
const result = await setCommissionAvailability(nextOpen, message);
|
|
if (result.status === "error") {
|
|
setError(result.message);
|
|
return;
|
|
}
|
|
toast.success(nextOpen ? "เปิดรับ Commission แล้ว" : "ปิดรับ Commission แล้ว");
|
|
router.refresh();
|
|
});
|
|
}
|
|
|
|
return <Card><CardHeader><div className="flex items-center gap-3">
|
|
<CardTitle>การรับ Commission</CardTitle><Badge variant={isOpen ? "default" : "secondary"}>
|
|
{isOpen ? "เปิดรับ" : "ปิดรับ"}</Badge></div>
|
|
<CardDescription>การปิดรับจะหยุดคำขอใหม่ ลูกค้าที่มีคำขออยู่แล้วชำระเงินต่อได้</CardDescription>
|
|
</CardHeader><CardContent className="flex flex-col gap-3">
|
|
<label htmlFor="commission-closure-message" className="text-sm font-medium">ข้อความเมื่อปิดรับ</label>
|
|
<Textarea id="commission-closure-message" value={message} maxLength={1000}
|
|
onChange={(event) => setMessage(event.target.value)} disabled={pending}
|
|
placeholder="แจ้งเหตุผลที่ปิดรับและข้อมูลที่ลูกค้าควรทราบ" />
|
|
<div className="flex flex-wrap gap-2">
|
|
<Button type="button" disabled={pending || !message.trim()} onClick={() => save(false)}>
|
|
{isOpen ? "ปิดรับ Commission" : "บันทึกข้อความ"}
|
|
</Button>
|
|
{!isOpen && <Button type="button" variant="outline" disabled={pending} onClick={() => save(true)}>
|
|
เปิดรับ Commission
|
|
</Button>}
|
|
</div>
|
|
{error && <Alert variant="destructive"><AlertDescription>{error}</AlertDescription></Alert>}
|
|
</CardContent></Card>;
|
|
}
|