TEAMCACQ-25379: добавлена вкладка История операций для СБП
This commit is contained in:
@@ -0,0 +1,102 @@
|
||||
import { Text } from '@fractal-ui/styling';
|
||||
import { Cell, CELL_TYPE } from '@fractal-ui/table';
|
||||
import { documentStatusTypeToBadgeType } from '../lib';
|
||||
import type { TransactionsHistory } from '../model';
|
||||
import { SBP_OPERATIONS_HISTORY_FIELDS, TRANSACTIONS_HISTORY_STATUS, TRANSACTIONS_HISTORY_TYPE } from '../model';
|
||||
import { LOCALIZATION } from './localization';
|
||||
|
||||
const TRANSACTION_REQUEST_TYPE_OPTIONS = {
|
||||
[TRANSACTIONS_HISTORY_TYPE.PAYMENT_BACK]: LOCALIZATION.RETURN_TEXT,
|
||||
[TRANSACTIONS_HISTORY_TYPE.PAYOUT_FROM_MERCHANT]: LOCALIZATION.TRANSFER_TEXT,
|
||||
[TRANSACTIONS_HISTORY_TYPE.INCOMING_PAYMENT]: LOCALIZATION.INCOMING_PAYMENT,
|
||||
};
|
||||
|
||||
const TRANSACTION_REQUEST_CLIENT_STATUS_LABEL = {
|
||||
[TRANSACTIONS_HISTORY_STATUS.IN_PROGRESS]: LOCALIZATION[TRANSACTIONS_HISTORY_STATUS.IN_PROGRESS],
|
||||
[TRANSACTIONS_HISTORY_STATUS.CANCELLED]: LOCALIZATION[TRANSACTIONS_HISTORY_STATUS.CANCELLED],
|
||||
[TRANSACTIONS_HISTORY_STATUS.PERFORMED]: LOCALIZATION[TRANSACTIONS_HISTORY_STATUS.PERFORMED],
|
||||
[TRANSACTIONS_HISTORY_STATUS.DRAFT]: LOCALIZATION[TRANSACTIONS_HISTORY_STATUS.DRAFT],
|
||||
};
|
||||
|
||||
const OPERATIONS_HISTORY_COLUMNS = [
|
||||
{
|
||||
id: SBP_OPERATIONS_HISTORY_FIELDS.AMOUNT,
|
||||
label: LOCALIZATION[SBP_OPERATIONS_HISTORY_FIELDS.AMOUNT],
|
||||
name: SBP_OPERATIONS_HISTORY_FIELDS.AMOUNT,
|
||||
headerType: 'string',
|
||||
Cell({ amount }: TransactionsHistory) {
|
||||
return <Cell cellName={SBP_OPERATIONS_HISTORY_FIELDS.AMOUNT} cellType={CELL_TYPE.STRING} text={amount?.value} />;
|
||||
},
|
||||
hasSort: true,
|
||||
},
|
||||
{
|
||||
id: SBP_OPERATIONS_HISTORY_FIELDS.DOC_DATE,
|
||||
label: LOCALIZATION[SBP_OPERATIONS_HISTORY_FIELDS.DOC_DATE],
|
||||
name: SBP_OPERATIONS_HISTORY_FIELDS.DOC_DATE,
|
||||
headerType: 'string',
|
||||
Cell({ transactionTime }: TransactionsHistory) {
|
||||
return (
|
||||
<Cell
|
||||
cellName={SBP_OPERATIONS_HISTORY_FIELDS.DOC_DATE}
|
||||
cellType={CELL_TYPE.STRING}
|
||||
subText={transactionTime.toDateString()}
|
||||
text={transactionTime.toDateString()}
|
||||
/>
|
||||
);
|
||||
},
|
||||
hasSort: true,
|
||||
defaultCanSort: true,
|
||||
sortDescFirst: true,
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
id: SBP_OPERATIONS_HISTORY_FIELDS.MERCHANT_NAME,
|
||||
label: LOCALIZATION[SBP_OPERATIONS_HISTORY_FIELDS.MERCHANT_NAME],
|
||||
name: SBP_OPERATIONS_HISTORY_FIELDS.MERCHANT_NAME,
|
||||
headerType: 'string',
|
||||
Cell({ merchant, isB2b }: TransactionsHistory) {
|
||||
return (
|
||||
<Cell
|
||||
cellName={SBP_OPERATIONS_HISTORY_FIELDS.MERCHANT_ID}
|
||||
cellType={CELL_TYPE.STRING}
|
||||
subText={isB2b ? merchant.id : ''}
|
||||
text={merchant?.name}
|
||||
/>
|
||||
);
|
||||
},
|
||||
hasSort: false,
|
||||
},
|
||||
{
|
||||
id: SBP_OPERATIONS_HISTORY_FIELDS.DOC_TYPE,
|
||||
label: LOCALIZATION[SBP_OPERATIONS_HISTORY_FIELDS.DOC_TYPE],
|
||||
name: SBP_OPERATIONS_HISTORY_FIELDS.DOC_TYPE,
|
||||
headerType: 'string',
|
||||
Cell({ transactionType }: TransactionsHistory) {
|
||||
return (
|
||||
<Cell
|
||||
cellName={SBP_OPERATIONS_HISTORY_FIELDS.DOC_TYPE}
|
||||
cellType={CELL_TYPE.STRING}
|
||||
text={TRANSACTION_REQUEST_TYPE_OPTIONS[transactionType]}
|
||||
/>
|
||||
);
|
||||
},
|
||||
hasSort: true,
|
||||
width: 130,
|
||||
},
|
||||
{
|
||||
id: SBP_OPERATIONS_HISTORY_FIELDS.STATUS,
|
||||
label: LOCALIZATION[SBP_OPERATIONS_HISTORY_FIELDS.STATUS],
|
||||
name: SBP_OPERATIONS_HISTORY_FIELDS.STATUS,
|
||||
headerType: 'string',
|
||||
Cell({ status }: { status: TRANSACTIONS_HISTORY_STATUS }) {
|
||||
return (
|
||||
<Cell badgeType={documentStatusTypeToBadgeType(status)} cellName={SBP_OPERATIONS_HISTORY_FIELDS.STATUS} cellType={CELL_TYPE.STATUS}>
|
||||
<Text.P3Short>{TRANSACTION_REQUEST_CLIENT_STATUS_LABEL[status]}</Text.P3Short>
|
||||
</Cell>
|
||||
);
|
||||
},
|
||||
hasSort: true,
|
||||
},
|
||||
];
|
||||
|
||||
export { OPERATIONS_HISTORY_COLUMNS, TRANSACTION_REQUEST_TYPE_OPTIONS };
|
||||
@@ -0,0 +1,3 @@
|
||||
export * from './constants';
|
||||
export * from './mocks';
|
||||
export * from './localization';
|
||||
@@ -0,0 +1,38 @@
|
||||
import { SBP_OPERATIONS_HISTORY_FIELDS } from '../model';
|
||||
import { TRANSACTION_REQUEST_CLIENT_STATUS } from '@/shared/models';
|
||||
|
||||
const LOCALIZATION = {
|
||||
[TRANSACTION_REQUEST_CLIENT_STATUS.DRAFT]: 'Черновик',
|
||||
[SBP_OPERATIONS_HISTORY_FIELDS.DOC_TYPE]: 'Операция',
|
||||
[SBP_OPERATIONS_HISTORY_FIELDS.DOC_DATE]: 'Дата',
|
||||
[SBP_OPERATIONS_HISTORY_FIELDS.CONTRACTOR]: 'Контрагент',
|
||||
[SBP_OPERATIONS_HISTORY_FIELDS.CONTRACTOR_BANK]: 'Банк контрагента',
|
||||
[SBP_OPERATIONS_HISTORY_FIELDS.AMOUNT]: 'Сумма',
|
||||
[SBP_OPERATIONS_HISTORY_FIELDS.MERCHANT_ID]: 'Мерчант',
|
||||
[SBP_OPERATIONS_HISTORY_FIELDS.STATUS]: 'Статус',
|
||||
[SBP_OPERATIONS_HISTORY_FIELDS.MERCHANT_NAME]: 'Наименование мерчанта',
|
||||
PERFORMED: 'Исполнен',
|
||||
CANCELLED: 'Отменён',
|
||||
IN_PROGRESS: 'В обработке',
|
||||
EXPANDED_ROW_RECIPIENT_ACCOUNT: 'Счёт получателя',
|
||||
EXPANDED_ROW_SENDER_ACCOUNT: 'Счёт отправителя',
|
||||
EXPANDED_ROW_CONTRACTOR_NAME: 'Иия контрагента',
|
||||
EXPANDED_ROW_CONTRACTOR_ADDRESS: 'Адрес контрагента',
|
||||
EXPANDED_ROW_CONTRACTOR_BANK: 'Банк контрагента',
|
||||
EXPANDED_ROW_PAYMENT_PURPOSE: 'Назначение платежа',
|
||||
EXPANDED_ROW_TRANSACTION_DATE: 'Дата входящей операции',
|
||||
EXPANDED_ROW_TRANSACTION_AMOUNT: 'Сумма входящей операции',
|
||||
EXPANDED_ROW_TRANSACTION_COMMISSION: 'Комиссия',
|
||||
EXPANDED_ROW_TRANSACTION_TRANSACTION_ID: 'ID транзакции',
|
||||
EXPANDED_ROW_TRANSACTION_QR_ID: 'ID QR-кода',
|
||||
EXPANDED_ROW_TRANSACTION_INCOME_CODE: 'Код вида дохода',
|
||||
EXPANDED_ROW_TRANSACTION_BIC: 'БИК банка',
|
||||
EXPANDED_ROW_TRANSACTION_AGENT: 'Транзакция при участии Агента ТСП',
|
||||
RETURN_TEXT: 'Возврат',
|
||||
TRANSFER_TEXT: 'Перевод',
|
||||
INCOMING_PAYMENT: 'Входящий платёж',
|
||||
INN_TEXT: 'ИНН',
|
||||
BIC_TEXT: 'БИК',
|
||||
};
|
||||
|
||||
export { LOCALIZATION };
|
||||
@@ -0,0 +1,77 @@
|
||||
import type { TransactionsHistory } from '../model';
|
||||
import {
|
||||
SBP_OPERATIONS_HISTORY_FIELDS,
|
||||
TRANSACTIONS_HISTORY_CONTRACTOR_TYPE,
|
||||
TRANSACTIONS_HISTORY_STATUS,
|
||||
TRANSACTIONS_HISTORY_TYPE,
|
||||
} from '../model';
|
||||
|
||||
const OUTGOING_PAYMENTS_DATA: TransactionsHistory[] = [
|
||||
{
|
||||
[SBP_OPERATIONS_HISTORY_FIELDS.AMOUNT]: {
|
||||
value: '10 000 000,00 ₽',
|
||||
vat: true,
|
||||
commissionValue: '500',
|
||||
vatValue: '22',
|
||||
},
|
||||
[SBP_OPERATIONS_HISTORY_FIELDS.CONTRACTOR]: {
|
||||
contractorBank: {
|
||||
id: '1',
|
||||
name: 'ПАО «Сбер Банк»',
|
||||
},
|
||||
contractorType: TRANSACTIONS_HISTORY_CONTRACTOR_TYPE.RECIPIENT,
|
||||
},
|
||||
[SBP_OPERATIONS_HISTORY_FIELDS.STATUS]: TRANSACTIONS_HISTORY_STATUS.PERFORMED,
|
||||
[SBP_OPERATIONS_HISTORY_FIELDS.MERCHANT]: {
|
||||
id: '1',
|
||||
name: 'Пётр Сергеевич И.',
|
||||
inn: '121212121212',
|
||||
},
|
||||
isB2b: true,
|
||||
[SBP_OPERATIONS_HISTORY_FIELDS.ACCOUNT]: '111222333',
|
||||
[SBP_OPERATIONS_HISTORY_FIELDS.PAYMENT_PURPOSE]: 'PURCHASE',
|
||||
[SBP_OPERATIONS_HISTORY_FIELDS.TRANSACTION_ID]: '12121212121323fdfdfd',
|
||||
[SBP_OPERATIONS_HISTORY_FIELDS.QR_ID]: '1212wsdf4545454',
|
||||
id: '1',
|
||||
b2cRequestId: '123321',
|
||||
clientId: '3332222111',
|
||||
transactionTime: new Date(),
|
||||
transactionType: TRANSACTIONS_HISTORY_TYPE.INCOMING_PAYMENT,
|
||||
fpMessageId: '000999000',
|
||||
},
|
||||
{
|
||||
[SBP_OPERATIONS_HISTORY_FIELDS.AMOUNT]: {
|
||||
value: '15 000 000,00 ₽',
|
||||
vat: true,
|
||||
commissionValue: '500',
|
||||
vatValue: '22',
|
||||
},
|
||||
[SBP_OPERATIONS_HISTORY_FIELDS.CONTRACTOR]: {
|
||||
contractorBank: {
|
||||
id: '2',
|
||||
name: 'АО «Длинное название банка Российской Федерации»',
|
||||
},
|
||||
contractorType: TRANSACTIONS_HISTORY_CONTRACTOR_TYPE.SENDER,
|
||||
},
|
||||
[SBP_OPERATIONS_HISTORY_FIELDS.STATUS]: TRANSACTIONS_HISTORY_STATUS.IN_PROGRESS,
|
||||
[SBP_OPERATIONS_HISTORY_FIELDS.MERCHANT]: {
|
||||
id: '2',
|
||||
name: 'Пётр Сергеевич А.',
|
||||
inn: '777777777',
|
||||
},
|
||||
isB2b: false,
|
||||
[SBP_OPERATIONS_HISTORY_FIELDS.ACCOUNT]: '5656564545',
|
||||
[SBP_OPERATIONS_HISTORY_FIELDS.PAYMENT_PURPOSE]: 'PURCHASE',
|
||||
[SBP_OPERATIONS_HISTORY_FIELDS.TRANSACTION_ID]: '3423213357698990',
|
||||
[SBP_OPERATIONS_HISTORY_FIELDS.QR_ID]: '345787987',
|
||||
id: '2',
|
||||
b2cRequestId: '4567898765',
|
||||
clientId: '22223333300004999',
|
||||
transactionTime: new Date(),
|
||||
transactionType: TRANSACTIONS_HISTORY_TYPE.PAYMENT_BACK,
|
||||
fpMessageId: '34342323434',
|
||||
agentId: '11111009922',
|
||||
},
|
||||
];
|
||||
|
||||
export { OUTGOING_PAYMENTS_DATA };
|
||||
@@ -0,0 +1 @@
|
||||
export { SbpOperationsHistory } from './ui';
|
||||
@@ -0,0 +1 @@
|
||||
export * from './utils';
|
||||
@@ -0,0 +1,20 @@
|
||||
import type { BadgeType } from '@fractal-ui/extended';
|
||||
import { TRANSACTIONS_HISTORY_STATUS } from '../model';
|
||||
import { TRANSACTION_BADGE_STATUS } from '@/shared/models';
|
||||
|
||||
const documentStatusTypeToBadgeType = (status: TRANSACTIONS_HISTORY_STATUS): BadgeType => {
|
||||
switch (status) {
|
||||
case TRANSACTIONS_HISTORY_STATUS.DRAFT:
|
||||
return TRANSACTION_BADGE_STATUS.INFO;
|
||||
case TRANSACTIONS_HISTORY_STATUS.PERFORMED:
|
||||
return TRANSACTION_BADGE_STATUS.SUCCESS;
|
||||
case TRANSACTIONS_HISTORY_STATUS.CANCELLED:
|
||||
return TRANSACTION_BADGE_STATUS.ERROR;
|
||||
case TRANSACTIONS_HISTORY_STATUS.IN_PROGRESS:
|
||||
return TRANSACTION_BADGE_STATUS.WARNING;
|
||||
default:
|
||||
return TRANSACTION_BADGE_STATUS.SYSTEM;
|
||||
}
|
||||
};
|
||||
|
||||
export { documentStatusTypeToBadgeType };
|
||||
@@ -0,0 +1 @@
|
||||
export * from './types';
|
||||
@@ -0,0 +1,105 @@
|
||||
import type { Bank, Merchant } from '@/shared/models';
|
||||
|
||||
enum SBP_OPERATIONS_HISTORY_FIELDS {
|
||||
DOC_TYPE = 'type',
|
||||
DOC_DATE = 'docDate',
|
||||
CONTRACTOR = 'contractor',
|
||||
AMOUNT = 'amount',
|
||||
MERCHANT_ID = 'merchantId',
|
||||
MERCHANT_NAME = 'merchantName',
|
||||
STATUS = 'status',
|
||||
IS_B2B = 'isB2b',
|
||||
MERCHANT = 'merchant',
|
||||
CONTRACTOR_BANK = 'contractorBank',
|
||||
ACCOUNT = 'account',
|
||||
PAYMENT_PURPOSE = 'paymentPurpose',
|
||||
TRANSACTION_ID = 'transactionId',
|
||||
QR_ID = 'qrId',
|
||||
B2C_REQUEST_ID = 'b2cRequestId',
|
||||
REQUEST_ID = 'requestId',
|
||||
CLIENT_ID = 'clientId',
|
||||
TRANSACTION_TIME = 'transactionTime',
|
||||
TRANSACTION_TYPE = 'transactionType',
|
||||
QRC_ENTITY_EXIST = 'qrcEntityExists',
|
||||
FP_MESSAGE_ID = 'fpMessageId',
|
||||
ORIG_TRANSACTION_ID = 'origTransactionId',
|
||||
AGENT_ID = 'agentId',
|
||||
}
|
||||
|
||||
enum TRANSACTION_DOCUMENT_TYPE {
|
||||
TRANSFER = 'TRANSFER',
|
||||
RETURN = 'RETURN',
|
||||
INCOMING_PAYMENT = 'INCOMING_PAYMENT',
|
||||
}
|
||||
|
||||
interface AmountData {
|
||||
value?: string;
|
||||
vatValue?: string;
|
||||
noAmountQrc?: boolean;
|
||||
vat?: boolean;
|
||||
commissionValue?: string;
|
||||
}
|
||||
|
||||
enum TRANSACTIONS_HISTORY_TYPE {
|
||||
INCOMING_PAYMENT = 'Входящий платеж',
|
||||
PAYOUT_FROM_MERCHANT = 'Выплата от ТСП',
|
||||
PAYMENT_BACK = 'Возврат платежа',
|
||||
}
|
||||
|
||||
enum TRANSACTIONS_HISTORY_STATUS {
|
||||
DRAFT = 'DRAFT',
|
||||
IN_PROGRESS = 'IN_PROGRESS',
|
||||
PERFORMED = 'PERFORMED',
|
||||
CANCELLED = 'CANCELLED',
|
||||
}
|
||||
|
||||
enum TRANSACTIONS_HISTORY_CONTRACTOR_TYPE {
|
||||
SENDER = 'SENDER',
|
||||
RECIPIENT = 'RECIPIENT',
|
||||
}
|
||||
|
||||
interface ITransactionsHistoryContractorDocument {
|
||||
contractorPhone?: string;
|
||||
contractorPam?: string;
|
||||
contractorType: TRANSACTIONS_HISTORY_CONTRACTOR_TYPE;
|
||||
contractorBank: Partial<Omit<Bank, 'bic'>>;
|
||||
contractorAccount?: string;
|
||||
contractorName?: string;
|
||||
contractorInn?: string;
|
||||
contractorBic?: string;
|
||||
}
|
||||
|
||||
interface TransactionsHistory {
|
||||
id: string;
|
||||
amount?: AmountData;
|
||||
b2cRequestId: string;
|
||||
requestId?: string;
|
||||
clientId: string;
|
||||
transactionId: string;
|
||||
transactionTime: Date;
|
||||
transactionType: TRANSACTIONS_HISTORY_TYPE;
|
||||
status: TRANSACTIONS_HISTORY_STATUS;
|
||||
merchant: Omit<Merchant, 'address'>;
|
||||
account?: string;
|
||||
contractor?: ITransactionsHistoryContractorDocument;
|
||||
qrId?: string;
|
||||
qrcEntityExists?: boolean;
|
||||
fpMessageId: string;
|
||||
origTransactionId?: string;
|
||||
paymentPurpose?: string;
|
||||
isB2b: boolean;
|
||||
agentId?: string;
|
||||
}
|
||||
|
||||
interface OperationsHistoryExpandedRowProps {
|
||||
row: TransactionsHistory;
|
||||
}
|
||||
|
||||
export {
|
||||
SBP_OPERATIONS_HISTORY_FIELDS,
|
||||
TRANSACTION_DOCUMENT_TYPE,
|
||||
TRANSACTIONS_HISTORY_TYPE,
|
||||
TRANSACTIONS_HISTORY_STATUS,
|
||||
TRANSACTIONS_HISTORY_CONTRACTOR_TYPE,
|
||||
};
|
||||
export type { TransactionsHistory, OperationsHistoryExpandedRowProps };
|
||||
+19
@@ -0,0 +1,19 @@
|
||||
import styled from '@emotion/styled';
|
||||
import { TAB_CONTAINER_FIXED_HEIGHT } from '@/shared/constants';
|
||||
|
||||
const SbpOperationsHistoryLayout = styled.div(({ theme }) => ({
|
||||
backgroundColor: theme.colors.bg.primary,
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
borderRadius: '16px',
|
||||
height: TAB_CONTAINER_FIXED_HEIGHT,
|
||||
}));
|
||||
|
||||
const SbpOperationsHistoryExpandedRowLayout = styled.div`
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
`;
|
||||
|
||||
export { SbpOperationsHistoryLayout, SbpOperationsHistoryExpandedRowLayout };
|
||||
@@ -0,0 +1,21 @@
|
||||
import React from 'react';
|
||||
import { OPERATIONS_HISTORY_COLUMNS, OUTGOING_PAYMENTS_DATA } from '../constants';
|
||||
import * as S from './SbpOperationsHistory.styles';
|
||||
import { OutgoingPaymentExpandedRow } from './SbpOperationsHistoryExpandedRow';
|
||||
import { FractalTable, TableWrapper } from '@/shared/ui';
|
||||
|
||||
const SbpOperationsHistory = () => (
|
||||
<S.SbpOperationsHistoryLayout>
|
||||
<TableWrapper data-testid="operations-history-table" isEmpty={false} isLoading={false}>
|
||||
<FractalTable
|
||||
withSettings
|
||||
columns={OPERATIONS_HISTORY_COLUMNS}
|
||||
data={OUTGOING_PAYMENTS_DATA}
|
||||
expandedRowComponent={OutgoingPaymentExpandedRow}
|
||||
isLoading={false}
|
||||
/>
|
||||
</TableWrapper>
|
||||
</S.SbpOperationsHistoryLayout>
|
||||
);
|
||||
|
||||
export { SbpOperationsHistory };
|
||||
+28
@@ -0,0 +1,28 @@
|
||||
import React from 'react';
|
||||
import { LOCALIZATION } from '../constants';
|
||||
import { TRANSACTIONS_HISTORY_TYPE, type OperationsHistoryExpandedRowProps } from '../model';
|
||||
import * as S from './SbpOperationsHistory.styles';
|
||||
import { TableExpandedRowInfoCell } from '@/shared/ui/TableExpandedRowInfoCell';
|
||||
|
||||
const OutgoingPaymentExpandedRow = ({
|
||||
row: { transactionType, account, paymentPurpose, transactionId, qrId, contractor, agentId },
|
||||
}: OperationsHistoryExpandedRowProps) => (
|
||||
<S.SbpOperationsHistoryExpandedRowLayout>
|
||||
<TableExpandedRowInfoCell
|
||||
label={
|
||||
transactionType === TRANSACTIONS_HISTORY_TYPE.INCOMING_PAYMENT
|
||||
? LOCALIZATION.EXPANDED_ROW_RECIPIENT_ACCOUNT
|
||||
: LOCALIZATION.EXPANDED_ROW_SENDER_ACCOUNT
|
||||
}
|
||||
value={account}
|
||||
/>
|
||||
<TableExpandedRowInfoCell label={LOCALIZATION.EXPANDED_ROW_PAYMENT_PURPOSE} value={paymentPurpose} />
|
||||
<TableExpandedRowInfoCell label={LOCALIZATION.EXPANDED_ROW_TRANSACTION_TRANSACTION_ID} value={transactionId} />
|
||||
<TableExpandedRowInfoCell label={LOCALIZATION.EXPANDED_ROW_TRANSACTION_QR_ID} value={qrId} />
|
||||
<TableExpandedRowInfoCell label={LOCALIZATION.EXPANDED_ROW_CONTRACTOR_BANK} value={contractor?.contractorBank?.name} />
|
||||
<TableExpandedRowInfoCell label={LOCALIZATION.EXPANDED_ROW_TRANSACTION_BIC} value={contractor?.contractorBic} />
|
||||
{agentId && <TableExpandedRowInfoCell label={LOCALIZATION.EXPANDED_ROW_TRANSACTION_AGENT} value={''} />}
|
||||
</S.SbpOperationsHistoryExpandedRowLayout>
|
||||
);
|
||||
|
||||
export { OutgoingPaymentExpandedRow };
|
||||
@@ -0,0 +1 @@
|
||||
export { SbpOperationsHistory } from './SbpOperationsHistory';
|
||||
@@ -1,5 +1,6 @@
|
||||
import type { BadgeType } from '@fractal-ui/extended';
|
||||
import { SBP_OUTGOING_PAYMENT_STATUS, TRANSACTION_REQUEST_CLIENT_STATUS } from '../model';
|
||||
import { TRANSACTION_REQUEST_CLIENT_STATUS } from '../model';
|
||||
import { TRANSACTION_BADGE_STATUS } from '@/shared/models';
|
||||
|
||||
const getTransactionRequestClientDocumentStatusType = (status: TRANSACTION_REQUEST_CLIENT_STATUS): BadgeType => {
|
||||
switch (status) {
|
||||
@@ -13,17 +14,17 @@ const getTransactionRequestClientDocumentStatusType = (status: TRANSACTION_REQUE
|
||||
case TRANSACTION_REQUEST_CLIENT_STATUS.ACCEPTED_FOR_PROCESSING:
|
||||
case TRANSACTION_REQUEST_CLIENT_STATUS.ACCEPTED_FOR_EXECUTION:
|
||||
case TRANSACTION_REQUEST_CLIENT_STATUS.PROCESSING:
|
||||
return SBP_OUTGOING_PAYMENT_STATUS.WARNING;
|
||||
return TRANSACTION_BADGE_STATUS.WARNING;
|
||||
|
||||
case TRANSACTION_REQUEST_CLIENT_STATUS.DELETED:
|
||||
case TRANSACTION_REQUEST_CLIENT_STATUS.REJECTED:
|
||||
return SBP_OUTGOING_PAYMENT_STATUS.ERROR;
|
||||
return TRANSACTION_BADGE_STATUS.ERROR;
|
||||
|
||||
case TRANSACTION_REQUEST_CLIENT_STATUS.COMPLETED:
|
||||
return SBP_OUTGOING_PAYMENT_STATUS.SUCCESS;
|
||||
return TRANSACTION_BADGE_STATUS.SUCCESS;
|
||||
|
||||
default:
|
||||
return SBP_OUTGOING_PAYMENT_STATUS.SYSTEM;
|
||||
return TRANSACTION_BADGE_STATUS.SYSTEM;
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import type { ReactNode } from 'react';
|
||||
import type { Bank, Merchant } from '@/shared/models';
|
||||
|
||||
enum TRANSACTION_REQUEST_CLIENT_STATUS {
|
||||
NONE = 'NONE',
|
||||
@@ -48,20 +48,6 @@ enum TRANSACTION_DOCUMENT_TYPE {
|
||||
RETURN = 'RETURN',
|
||||
}
|
||||
|
||||
enum SBP_OUTGOING_PAYMENT_STATUS {
|
||||
SUCCESS = 'success',
|
||||
WARNING = 'warning',
|
||||
ERROR = 'error',
|
||||
SYSTEM = 'system',
|
||||
}
|
||||
|
||||
interface Merchant {
|
||||
id: string;
|
||||
name?: string;
|
||||
address?: string;
|
||||
inn?: string;
|
||||
}
|
||||
|
||||
interface Contractor {
|
||||
id: string;
|
||||
inn?: string;
|
||||
@@ -70,12 +56,6 @@ interface Contractor {
|
||||
phone?: string;
|
||||
}
|
||||
|
||||
export interface Bank {
|
||||
id: string;
|
||||
name?: string;
|
||||
bic?: string;
|
||||
}
|
||||
|
||||
interface Commission {
|
||||
id?: string;
|
||||
amount?: string;
|
||||
@@ -119,10 +99,5 @@ interface OutgoingPaymentExpandedRowProps {
|
||||
row: SbpOutgoingPayment;
|
||||
}
|
||||
|
||||
interface SbpOutgoingPaymentInfoCellProps {
|
||||
label: string;
|
||||
value: ReactNode;
|
||||
}
|
||||
|
||||
export { TRANSACTION_REQUEST_CLIENT_STATUS, SBP_OUTGOING_PAYMENT_FIELDS, TRANSACTION_DOCUMENT_TYPE, SBP_OUTGOING_PAYMENT_STATUS };
|
||||
export type { SbpOutgoingPayment, OutgoingPaymentExpandedRowProps, SbpOutgoingPaymentInfoCellProps };
|
||||
export { TRANSACTION_REQUEST_CLIENT_STATUS, SBP_OUTGOING_PAYMENT_FIELDS, TRANSACTION_DOCUMENT_TYPE };
|
||||
export type { SbpOutgoingPayment, OutgoingPaymentExpandedRowProps };
|
||||
|
||||
+13
-13
@@ -1,42 +1,42 @@
|
||||
import React from 'react';
|
||||
import { LOCALIZATION } from '../constants';
|
||||
import { TRANSACTION_DOCUMENT_TYPE, type OutgoingPaymentExpandedRowProps } from '../model';
|
||||
import { SbpOutgoingPaymentInfoCell } from './SbpOutgoingPaymentInfoCell';
|
||||
import * as S from './SbpOutgoingPayments.styles';
|
||||
import { TableExpandedRowInfoCell } from '@/shared/ui/TableExpandedRowInfoCell';
|
||||
|
||||
const OutgoingPaymentExpandedRow = ({
|
||||
row: { account, commission, incomeCode, operation, paymentPurpose, type, isB2b, transactionId, qrId, contractorBank, recipientMerchant },
|
||||
}: OutgoingPaymentExpandedRowProps) => (
|
||||
<S.OutgoingPaymentExpandedRowLayout>
|
||||
<SbpOutgoingPaymentInfoCell label={LOCALIZATION.EXPANDED_ROW_ACCOUNT} value={account} />
|
||||
<TableExpandedRowInfoCell label={LOCALIZATION.EXPANDED_ROW_ACCOUNT} value={account} />
|
||||
{isB2b && (
|
||||
<>
|
||||
<SbpOutgoingPaymentInfoCell label={LOCALIZATION.EXPANDED_ROW_CONTRACTOR_NAME} value={recipientMerchant?.name} />
|
||||
<SbpOutgoingPaymentInfoCell label={LOCALIZATION.EXPANDED_ROW_CONTRACTOR_ADDRESS} value={recipientMerchant?.address} />
|
||||
<TableExpandedRowInfoCell label={LOCALIZATION.EXPANDED_ROW_CONTRACTOR_NAME} value={recipientMerchant?.name} />
|
||||
<TableExpandedRowInfoCell label={LOCALIZATION.EXPANDED_ROW_CONTRACTOR_ADDRESS} value={recipientMerchant?.address} />
|
||||
</>
|
||||
)}
|
||||
<SbpOutgoingPaymentInfoCell
|
||||
<TableExpandedRowInfoCell
|
||||
label={LOCALIZATION.EXPANDED_ROW_CONTRACTOR_BANK}
|
||||
value={`${contractorBank.name ?? ''} ${LOCALIZATION.BIC_TEXT} ${contractorBank.bic ?? ''}`}
|
||||
/>
|
||||
<SbpOutgoingPaymentInfoCell label={LOCALIZATION.EXPANDED_ROW_PAYMENT_PURPOSE} value={paymentPurpose} />
|
||||
<TableExpandedRowInfoCell label={LOCALIZATION.EXPANDED_ROW_PAYMENT_PURPOSE} value={paymentPurpose} />
|
||||
{type === TRANSACTION_DOCUMENT_TYPE.RETURN ? (
|
||||
<>
|
||||
<SbpOutgoingPaymentInfoCell label={LOCALIZATION.EXPANDED_ROW_TRANSACTION_DATE} value={operation?.transactionTime.toISOString()} />
|
||||
<SbpOutgoingPaymentInfoCell label={LOCALIZATION.EXPANDED_ROW_TRANSACTION_AMOUNT} value={operation?.amount} />
|
||||
<TableExpandedRowInfoCell label={LOCALIZATION.EXPANDED_ROW_TRANSACTION_DATE} value={operation?.transactionTime.toISOString()} />
|
||||
<TableExpandedRowInfoCell label={LOCALIZATION.EXPANDED_ROW_TRANSACTION_AMOUNT} value={operation?.amount} />
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<SbpOutgoingPaymentInfoCell label={LOCALIZATION.EXPANDED_ROW_TRANSACTION_COMMISSION} value={commission?.amount} />
|
||||
<TableExpandedRowInfoCell label={LOCALIZATION.EXPANDED_ROW_TRANSACTION_COMMISSION} value={commission?.amount} />
|
||||
{isB2b ? (
|
||||
<>
|
||||
<SbpOutgoingPaymentInfoCell label={LOCALIZATION.EXPANDED_ROW_TRANSACTION_TRANSACTION_ID} value={transactionId} />
|
||||
<SbpOutgoingPaymentInfoCell label={LOCALIZATION.EXPANDED_ROW_TRANSACTION_QR_ID} value={qrId} />
|
||||
<TableExpandedRowInfoCell label={LOCALIZATION.EXPANDED_ROW_TRANSACTION_TRANSACTION_ID} value={transactionId} />
|
||||
<TableExpandedRowInfoCell label={LOCALIZATION.EXPANDED_ROW_TRANSACTION_QR_ID} value={qrId} />
|
||||
</>
|
||||
) : (
|
||||
<SbpOutgoingPaymentInfoCell label={LOCALIZATION.EXPANDED_ROW_TRANSACTION_INCOME_CODE} value={incomeCode} />
|
||||
<TableExpandedRowInfoCell label={LOCALIZATION.EXPANDED_ROW_TRANSACTION_INCOME_CODE} value={incomeCode} />
|
||||
)}
|
||||
<SbpOutgoingPaymentInfoCell label={LOCALIZATION.EXPANDED_ROW_TRANSACTION_AMOUNT} value={operation?.amount} />
|
||||
<TableExpandedRowInfoCell label={LOCALIZATION.EXPANDED_ROW_TRANSACTION_AMOUNT} value={operation?.amount} />
|
||||
</>
|
||||
)}
|
||||
</S.OutgoingPaymentExpandedRowLayout>
|
||||
|
||||
-15
@@ -1,15 +0,0 @@
|
||||
import React from 'react';
|
||||
import { Text } from '@fractal-ui/styling';
|
||||
import type { SbpOutgoingPaymentInfoCellProps } from '../model';
|
||||
import * as S from './SbpOutgoingPayments.styles';
|
||||
|
||||
const SbpOutgoingPaymentInfoCell = ({ label, value }: SbpOutgoingPaymentInfoCellProps) => (
|
||||
<S.OutgoingPaymentExpandedRowCellLayout>
|
||||
<S.StyledTextLabelWrapper>
|
||||
<Text.P3 color="text.secondary">{label}</Text.P3>
|
||||
</S.StyledTextLabelWrapper>
|
||||
<Text.P3>{value || <span>&ndash</span>}</Text.P3>
|
||||
</S.OutgoingPaymentExpandedRowCellLayout>
|
||||
);
|
||||
|
||||
export { SbpOutgoingPaymentInfoCell };
|
||||
@@ -64,5 +64,45 @@ interface Contract {
|
||||
salePoints: SalePoint[];
|
||||
}
|
||||
|
||||
export { ACQUIRING_TYPES };
|
||||
export type { Contract, SalePoint, Outlet, Tariff, Manager, Terminal };
|
||||
interface Merchant {
|
||||
id: string;
|
||||
name?: string;
|
||||
address?: string;
|
||||
inn?: string;
|
||||
}
|
||||
|
||||
interface Bank {
|
||||
id: string;
|
||||
name?: string;
|
||||
bic?: string;
|
||||
}
|
||||
|
||||
enum TRANSACTION_REQUEST_CLIENT_STATUS {
|
||||
NONE = 'NONE',
|
||||
DRAFT = 'DRAFT',
|
||||
CREATED = 'CREATED',
|
||||
WAIT_FOR_SIGN = 'WAIT_FOR_SIGN',
|
||||
SIGNED_1 = 'SIGNED_1',
|
||||
SIGNED_2 = 'SIGNED_2',
|
||||
SIGNED = 'SIGNED',
|
||||
DELETED = 'DELETED',
|
||||
SEND = 'SEND',
|
||||
DELIVERED = 'DELIVERED',
|
||||
ACCEPTED_FOR_PROCESSING = 'ACCEPTED_FOR_PROCESSING',
|
||||
ACCEPTED_FOR_EXECUTION = 'ACCEPTED_FOR_EXECUTION',
|
||||
PROCESSING = 'PROCESSING',
|
||||
COMPLETED = 'COMPLETED',
|
||||
REJECTED = 'REJECTED',
|
||||
CANCELLED = 'CANCELLED',
|
||||
}
|
||||
|
||||
enum TRANSACTION_BADGE_STATUS {
|
||||
SUCCESS = 'success',
|
||||
WARNING = 'warning',
|
||||
ERROR = 'error',
|
||||
SYSTEM = 'system',
|
||||
INFO = 'info',
|
||||
}
|
||||
|
||||
export { ACQUIRING_TYPES, TRANSACTION_REQUEST_CLIENT_STATUS, TRANSACTION_BADGE_STATUS };
|
||||
export type { Contract, SalePoint, Outlet, Tariff, Manager, Terminal, Merchant, Bank };
|
||||
|
||||
+14
@@ -0,0 +1,14 @@
|
||||
import styled from '@emotion/styled';
|
||||
|
||||
const SbpOperationsHistoryExpandedRowCellLayout = styled.div`
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: start;
|
||||
gap: 24px;
|
||||
`;
|
||||
|
||||
const StyledTextLabelWrapper = styled.div`
|
||||
width: 150px;
|
||||
`;
|
||||
|
||||
export { SbpOperationsHistoryExpandedRowCellLayout, StyledTextLabelWrapper };
|
||||
+15
@@ -0,0 +1,15 @@
|
||||
import React from 'react';
|
||||
import { Text } from '@fractal-ui/styling';
|
||||
import * as S from './TableExpandedRowInfoCell.styles';
|
||||
import type { TableExpandedRowInfoCellProps } from './types';
|
||||
|
||||
const TableExpandedRowInfoCell = ({ label, value }: TableExpandedRowInfoCellProps) => (
|
||||
<S.SbpOperationsHistoryExpandedRowCellLayout>
|
||||
<S.StyledTextLabelWrapper>
|
||||
<Text.P3 color="text.secondary">{label}</Text.P3>
|
||||
</S.StyledTextLabelWrapper>
|
||||
<Text.P3>{value || <span>-</span>}</Text.P3>
|
||||
</S.SbpOperationsHistoryExpandedRowCellLayout>
|
||||
);
|
||||
|
||||
export { TableExpandedRowInfoCell };
|
||||
@@ -0,0 +1 @@
|
||||
export { TableExpandedRowInfoCell } from './TableExpandedRowInfoCell';
|
||||
@@ -0,0 +1,8 @@
|
||||
import type { ReactNode } from 'react';
|
||||
|
||||
interface TableExpandedRowInfoCellProps {
|
||||
label: string;
|
||||
value: ReactNode;
|
||||
}
|
||||
|
||||
export type { TableExpandedRowInfoCellProps };
|
||||
@@ -22,6 +22,10 @@ const SBP_TABS = [
|
||||
value: SBP_TAB_TYPES.PAYMENTS,
|
||||
label: LOCALIZATION.PAYMENTS,
|
||||
},
|
||||
{
|
||||
value: SBP_TAB_TYPES.OPERATIONS_HISTORY,
|
||||
label: LOCALIZATION.OPERATIONS_HISTORY,
|
||||
},
|
||||
{
|
||||
value: SBP_TAB_TYPES.OUTGOING_PAYMENTS,
|
||||
label: LOCALIZATION.OUTGOING_PAYMENTS,
|
||||
|
||||
@@ -6,6 +6,7 @@ const LOCALIZATION = {
|
||||
PAYMENTS: 'Платежи',
|
||||
OUTGOING_PAYMENTS: 'Исходящие платежи',
|
||||
APPLICATIONS: 'Заявки',
|
||||
OPERATIONS_HISTORY: 'История операций',
|
||||
};
|
||||
|
||||
export { LOCALIZATION };
|
||||
|
||||
@@ -6,6 +6,7 @@ enum SBP_TAB_TYPES {
|
||||
PAYMENTS = 'PAYMENTS',
|
||||
OUTGOING_PAYMENTS = 'OUTGOING_PAYMENTS',
|
||||
APPLICATIONS = 'APPLICATIONS',
|
||||
OPERATIONS_HISTORY = 'OPERATIONS_HISTORY',
|
||||
}
|
||||
|
||||
export { SBP_TAB_TYPES };
|
||||
|
||||
@@ -4,6 +4,7 @@ import { SBP_TABS } from '../constants';
|
||||
import { SBP_TAB_TYPES } from '../model';
|
||||
import * as S from './SbpForm.styles';
|
||||
import { SbpContracts } from '@/features/SbpContracts';
|
||||
import { SbpOperationsHistory } from '@/features/SbpOperationsHistory';
|
||||
import { SbpOutgoingPayments } from '@/features/SbpOutgoingPayments';
|
||||
import { SbpSalePoints } from '@/features/SbpSalePoints';
|
||||
|
||||
@@ -18,6 +19,7 @@ const SbpForm = () => {
|
||||
{selectedTab === SBP_TAB_TYPES.CONTRACTS && <SbpContracts />}
|
||||
{selectedTab === SBP_TAB_TYPES.SALE_POINTS && <SbpSalePoints />}
|
||||
{selectedTab === SBP_TAB_TYPES.OUTGOING_PAYMENTS && <SbpOutgoingPayments />}
|
||||
{selectedTab === SBP_TAB_TYPES.OPERATIONS_HISTORY && <SbpOperationsHistory />}
|
||||
</S.SbpFormLayout>
|
||||
);
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user