hamedandClaude Opus 4.8
b459d082a4
Add per-clinic payment methods (bank accounts + POS/card-reader devices)
under the "مدیریت پرداخت" settings tab at /admin/my-financial, ported from
clinic-pro-tauri's mock-only PaymentManagement tab into a real persisted
feature. These records are referenceable (by uuid) from patient invoices to
record which method a service payment was made with.
Backend (new src/PaymentMethod domain):
- BankAccount + Pos entities, repositories, PaymentMethodService (validation,
ownership scoping, create/update/toggle logic).
- Thin PaymentMethodController exposing /api/v1/my/payment-methods/{bank-accounts,pos}
(GET/POST/PUT + PATCH .../status), guarded to clinic/doctor/secretary/admin.
- Migration for bank_accounts + pos_devices tables.
- Functional tests (success + validation/404/403 + empty boundaries).
- docs/api/payment-method.md.
Frontend:
- Replace MyFinancialPage content with the payment-management UI (two tabs,
tables, add/edit modals, status toggle) using the admin design system.
- usePaymentMethods hook (TanStack Query) + presentational components.
- Update page test to cover tabs, data, empty state and the add modal.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
98 lines
3.3 KiB
TypeScript
98 lines
3.3 KiB
TypeScript
import React, { useEffect, useState } from 'react';
|
|
import { toast } from 'sonner';
|
|
import Modal from '../ui/Modal';
|
|
import SearchableSelect from '../ui/SearchableSelect';
|
|
import { BANK_OPTIONS } from './banks';
|
|
import {
|
|
useCreatePos,
|
|
useUpdatePos,
|
|
type Pos,
|
|
} from '../../hooks/usePaymentMethods';
|
|
|
|
/**
|
|
* فرم افزودن/ویرایش کارتخوان — پورت مبدأ ModalAddPose.jsx.
|
|
* اگر `pos` داده شود حالت ویرایش، وگرنه افزودن.
|
|
*/
|
|
export default function PosFormModal({
|
|
open,
|
|
pos,
|
|
onClose,
|
|
}: {
|
|
open: boolean;
|
|
pos: Pos | null;
|
|
onClose: () => void;
|
|
}) {
|
|
const isEdit = !!pos;
|
|
const [bankName, setBankName] = useState('');
|
|
const [terminalNumber, setTerminalNumber] = useState('');
|
|
const [accountNumber, setAccountNumber] = useState('');
|
|
|
|
const createMut = useCreatePos();
|
|
const updateMut = useUpdatePos();
|
|
const pending = createMut.isPending || updateMut.isPending;
|
|
|
|
useEffect(() => {
|
|
if (!open) return;
|
|
setBankName(pos?.bank_name ?? '');
|
|
setTerminalNumber(pos?.terminal_number ?? '');
|
|
setAccountNumber(pos?.account_number ?? '');
|
|
}, [open, pos]);
|
|
|
|
const submit = () => {
|
|
if (!bankName.trim()) { toast.error('نام بانک الزامی است'); return; }
|
|
if (!terminalNumber.trim()) { toast.error('شماره ترمینال الزامی است'); return; }
|
|
|
|
const body = {
|
|
bank_name: bankName.trim(),
|
|
terminal_number: terminalNumber.trim(),
|
|
account_number: accountNumber.trim(),
|
|
};
|
|
|
|
const onSuccess = () => {
|
|
toast.success(isEdit ? 'کارت خوان ویرایش شد' : 'کارت خوان اضافه شد');
|
|
onClose();
|
|
};
|
|
const onError = (e: unknown) => toast.error(e instanceof Error ? e.message : 'خطا در ذخیره');
|
|
|
|
if (isEdit && pos) {
|
|
updateMut.mutate({ uuid: pos.uuid, body }, { onSuccess, onError });
|
|
} else {
|
|
createMut.mutate(body, { onSuccess, onError });
|
|
}
|
|
};
|
|
|
|
return (
|
|
<Modal
|
|
open={open}
|
|
onClose={onClose}
|
|
title={isEdit ? 'ویرایش کارت خوان' : 'افزودن کارت خوان'}
|
|
size="sm"
|
|
footer={
|
|
<button className="btn primary" style={{ width: '100%' }} disabled={pending} onClick={submit}>
|
|
{pending ? '...' : isEdit ? 'ذخیره تغییرات' : 'اضافه کردن کارت خوان'}
|
|
</button>
|
|
}
|
|
>
|
|
<div style={{ display: 'flex', flexDirection: 'column', gap: 16 }}>
|
|
<div>
|
|
<label className="field-label">نام بانک</label>
|
|
<SearchableSelect
|
|
options={BANK_OPTIONS}
|
|
value={bankName || null}
|
|
onChange={(v) => setBankName(v != null ? String(v) : '')}
|
|
placeholder="انتخاب بانک"
|
|
/>
|
|
</div>
|
|
<div>
|
|
<label className="field-label">شماره ترمینال</label>
|
|
<input className="input" value={terminalNumber} onChange={(e) => setTerminalNumber(e.target.value)} placeholder="شماره ترمینال" />
|
|
</div>
|
|
<div>
|
|
<label className="field-label">شماره حساب</label>
|
|
<input className="input" value={accountNumber} onChange={(e) => setAccountNumber(e.target.value)} placeholder="شماره حساب" />
|
|
</div>
|
|
</div>
|
|
</Modal>
|
|
);
|
|
}
|