+ Рублевый перевод на счета других клиентов или в другие банки, включая
+ налоговые платежи
+
Плательщик:
+
{`${payerName} ${clientId}`}
+
Номер счета:
+
+
-
-
-
-
БИК:
-
+
ИНН:
+
{payerINN}
+
Сумма:
+
+
setBNFBankBic(e.target.value)}
+ value={amount}
+ onChange={(e) => setAmount(e.target.value)}
onBlur={handleBlur}
- style={{ maxWidth: '32ch' }}
/>
-
-
№ Корр. счета:
-
-
-
-
Номер счета:
-
- setBNFAccount(e.target.value)}
- onBlur={handleBlur}
- style={{ maxWidth: '32ch' }}
- />
-
-
ИНН:
-
- setBNFINN(e.target.value)}
- onBlur={handleBlur}
- style={{ maxWidth: '32ch' }}
- />
-
-
КПП (103):
-
- setBNFKPP(e.target.value)}
- onBlur={handleBlur}
- style={{ maxWidth: '32ch' }}
- />
-
+ RUB
+
-
-
Наименование:
-
- setBNFName(e.target.value)}
- onBlur={handleBlur}
- style={{ width: '100ch' }}
- />
-
-
Банк получателя:
-
{bnfBankName}
-
Назначение платежа:
-
-
-
Код вида дохода:
-
-
-
-
Код (УИП) (22):
-
- setTaxUINCode(e.target.value)}
- onBlur={handleBlur}
- style={{ maxWidth: '32ch' }}
- />
-
+
Телефон или электронный адрес:
+
{payerPhoneEmail}
+
+
+
Адрес места жительства:
+
{payerAddress}
+
Комиссии и расходы:
+
+
+
+
+
+
+
+
+
БИК:
+
+ setBNFBankBic(e.target.value)}
+ onBlur={handleBlur}
+ style={{ maxWidth: '32ch' }}
+ />
+
+
№ Корр. счета:
+
+
+
+
Номер счета:
+
+ setBNFAccount(e.target.value)}
+ onBlur={handleBlur}
+ style={{ maxWidth: '32ch' }}
+ />
+
+
ИНН:
+
+ setBNFINN(e.target.value)}
+ onBlur={handleBlur}
+ style={{ maxWidth: '32ch' }}
+ />
+
+
КПП (103):
+
+ setBNFKPP(e.target.value)}
+ onBlur={handleBlur}
+ style={{ maxWidth: '32ch' }}
+ />
+
+
+
+
Наименование:
+
+ setBNFName(e.target.value)}
+ onBlur={handleBlur}
+ style={{ width: '100ch' }}
+ />
+
+
Банк получателя:
+
{bnfBankName}
+
Назначение платежа:
+
+
+
Код вида дохода:
+
+
+
+
Код (УИП) (22):
+
+ setTaxUINCode(e.target.value)}
+ onBlur={handleBlur}
+ style={{ maxWidth: '32ch' }}
+ />
- >
+
);
}
-export default App;
+export default Form;
diff --git a/src/Messages.jsx b/src/Messages.jsx
new file mode 100644
index 0000000..6fee58f
--- /dev/null
+++ b/src/Messages.jsx
@@ -0,0 +1,9 @@
+function Messages(props) {
+ return props.messages
+ .filter((item) => item.status != 'OK')
+ .map((item, ind) => (
+
{JSON.stringify(item)}
+ ));
+}
+
+export default Messages;
diff --git a/src/Payment.css b/src/Payment.css
new file mode 100644
index 0000000..396fca2
--- /dev/null
+++ b/src/Payment.css
@@ -0,0 +1,12 @@
+.payment_container {
+ padding: 0px;
+}
+
+.payment_form {
+ float: left;
+}
+
+.payment_messages {
+ float: left;
+ max-width: 25%;
+}
diff --git a/src/Payment.jsx b/src/Payment.jsx
new file mode 100644
index 0000000..c7815ca
--- /dev/null
+++ b/src/Payment.jsx
@@ -0,0 +1,41 @@
+import { useMemo, useState } from 'react';
+import Form from './Form.jsx';
+import Messages from './Messages.jsx';
+import './Payment.css';
+
+function Payment() {
+ const [messages, setMessages] = useState([]);
+
+ const fillMessages = (data) => {
+ setMessages(data);
+ };
+
+ const cachedForm = useMemo(() =>
, []);
+
+ return (
+ <>
+
+
item.status != 'OK')?.length > 0
+ ? '75%'
+ : '100%',
+ }}
+ >
+ {cachedForm}
+
+ {messages.fields?.length > 0 ? (
+
+ item.status != 'OK')}
+ />
+
+ ) : null}
+
+ >
+ );
+}
+
+export default Payment;
diff --git a/src/main.jsx b/src/main.jsx
index fe2c7b8..282f281 100644
--- a/src/main.jsx
+++ b/src/main.jsx
@@ -1,4 +1,4 @@
import { createRoot } from 'react-dom/client';
-import Form from './Form.jsx';
+import Payment from './Payment.jsx';
-createRoot(document.getElementById('root')).render(
);
+createRoot(document.getElementById('root')).render(
);