diff --git a/apps/frontend/src/pages/broker/BrokerOperationsTable.tsx b/apps/frontend/src/pages/broker/BrokerOperationsTable.tsx index b5f56df..d330029 100644 --- a/apps/frontend/src/pages/broker/BrokerOperationsTable.tsx +++ b/apps/frontend/src/pages/broker/BrokerOperationsTable.tsx @@ -3,9 +3,7 @@ import type { BrokerMoney, BrokerOperation, BrokerOperationsPage } from '../../a import { getBrokerInstrumentPath, getBrokerOperationImpact, - getBrokerOperationImpactLabel, getBrokerOperationTypeLabel, - type BrokerOperationImpact, } from './brokerDisplay'; const tableStyle = { @@ -27,33 +25,14 @@ const tdStyle = { verticalAlign: 'top', } satisfies React.CSSProperties; -const impactStyles: Record = { - adds: { - background: 'rgba(46, 125, 50, 0.1)', - color: 'var(--color-positive)', - }, - reduces: { - background: 'rgba(198, 40, 40, 0.1)', - color: 'var(--color-negative)', - }, - neutral: { - background: 'rgba(25, 118, 210, 0.1)', - color: 'var(--color-primary)', - }, - unknown: { - background: 'rgba(102, 102, 102, 0.12)', - color: 'var(--color-text-secondary)', - }, -}; - function formatMoney(value: BrokerMoney | null | undefined) { if (!value) return '-'; - - return new Intl.NumberFormat('ru-RU', { + const formatted = new Intl.NumberFormat('ru-RU', { style: 'currency', currency: value.currency || 'RUB', maximumFractionDigits: 2, }).format(value.value); + return value.value > 0 ? `+${formatted}` : formatted; } function formatDate(value: string | null) { @@ -84,28 +63,23 @@ function OperationInstrument({ operation }: { operation: BrokerOperation }) { return {label}; } -function OperationType({ operation }: { operation: BrokerOperation }) { - const impact = getBrokerOperationImpact(operation); +const pagButtonStyle: React.CSSProperties = { + padding: '6px 14px', + borderRadius: 6, + border: '1px solid #e0e0e0', + background: 'var(--color-surface)', + color: 'var(--color-text)', + fontSize: 14, + fontWeight: 600, + cursor: 'pointer', + lineHeight: 1.4, +}; - return ( -
- {getBrokerOperationTypeLabel(operation)} - - {getBrokerOperationImpactLabel(impact)} - -
- ); -} +const pagButtonDisabledStyle: React.CSSProperties = { + ...pagButtonStyle, + opacity: 0.35, + cursor: 'not-allowed', +}; export function BrokerOperationsTable({ isLoading, @@ -139,14 +113,32 @@ export function BrokerOperationsTable({ >

Операции

- - - Страница {pageNumber} + + {pageNumber} -
@@ -182,7 +174,7 @@ export function BrokerOperationsTable({ {formatDate(operation.date)} - + {getBrokerOperationTypeLabel(operation)}