Implement payment method placeholder
- Added placeholder card payment methods. - Added a message indicating that the payment feature is not yet supported. - Grayed out the "Add New Payment Method" button.
This commit is contained in:
@@ -4,6 +4,7 @@ import NavBar from '@/components/NavBar';
|
||||
import { ArrowLeft, CreditCard, PlusCircle } from 'lucide-react';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { useToast } from '@/hooks/use-toast';
|
||||
|
||||
const PaymentMethodCard = ({
|
||||
type,
|
||||
@@ -46,6 +47,14 @@ const PaymentMethodCard = ({
|
||||
|
||||
const PaymentMethods = () => {
|
||||
const navigate = useNavigate();
|
||||
const { toast } = useToast();
|
||||
|
||||
const handleAddPayment = () => {
|
||||
toast({
|
||||
title: "알림",
|
||||
description: "이 결제 기능은 아직 지원하지 않습니다.",
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-neuro-background pb-24">
|
||||
@@ -85,20 +94,18 @@ const PaymentMethods = () => {
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="mb-8">
|
||||
<h2 className="text-sm font-medium text-gray-500 mb-4 px-2">은행 계좌</h2>
|
||||
|
||||
<PaymentMethodCard
|
||||
type="bank"
|
||||
label="국민은행"
|
||||
lastDigits="9876-54-321098"
|
||||
/>
|
||||
{/* Notice */}
|
||||
<div className="mb-8 p-4 bg-amber-50 rounded-md border border-amber-200">
|
||||
<p className="text-amber-700 text-sm text-center">
|
||||
이 결제 기능은 아직 지원하지 않습니다.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* Add Payment Method Button */}
|
||||
<div className="mt-8">
|
||||
<Button
|
||||
className="w-full bg-neuro-income hover:bg-neuro-income/90 text-white"
|
||||
className="w-full bg-gray-400 hover:bg-gray-400/90 text-white cursor-not-allowed"
|
||||
onClick={handleAddPayment}
|
||||
>
|
||||
<PlusCircle size={16} className="mr-2" />
|
||||
새 결제 수단 추가
|
||||
|
||||
Reference in New Issue
Block a user