moex/moex-vibe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

codex/broker-accounts-page #34

Merged
ksv741 merged 19 commits from codex/broker-accounts-page into main 2026-06-21 20:57:47 +03:00
Conversation 0 Commits 19 Files Changed 36 +24 -16
2 changed files with 24 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 8ad5f3c70c - Show all commits

26
apps/frontend/src/pages/broker-operations/ui/BrokerOperationsPage.tsx
View File

@ -1,5 +1,7 @@
import { useEffect } from 'react'; import { useEffect } from 'react';
import { useSearchParams } from 'react-router-dom'; import { useSearchParams } from 'react-router-dom';
import { Box } from '@mui/material';
import { Heading, Text } from '@moex-vibe/design-system';
import { import {
BROKER_OPERATION_TYPE_OPTIONS, BROKER_OPERATION_TYPE_OPTIONS,
isBrokerOperationType, isBrokerOperationType,
@ -32,7 +34,9 @@ export function BrokerOperationsPage() {
} }
const history = operations.error ? ( const history = operations.error ? (
<p role="alert">Не удалось загрузить историю операций</p> <Text component="p" tone="negative" role="alert">
Не удалось загрузить историю операций
</Text>
) : ( ) : (
<BrokerOperationsTable <BrokerOperationsTable
title="История операций" title="История операций"
@ -53,13 +57,15 @@ export function BrokerOperationsPage() {
); );
return ( return (
<section aria-labelledby="broker-operations-heading"> <Box component="section" aria-labelledby="broker-operations-heading">
<div className="broker-operations__toolbar"> <Box
<h2 id="broker-operations-heading" style={{ fontSize: 20, margin: 0 }}> sx={{ display: 'flex', alignItems: 'end', justifyContent: 'space-between', gap: 2, mb: 2 }}
>
<Heading level={2} id="broker-operations-heading">
Операции Операции
</h2> </Heading>
<label> <Box component="label" sx={{ display: 'grid', gap: 0.5, color: 'text.secondary' }}>
<span>Тип операции</span> <Text variant="label">Тип операции</Text>
<select value={selectedType} onChange={handleTypeChange}> <select value={selectedType} onChange={handleTypeChange}>
<option value="">Все операции</option> <option value="">Все операции</option>
{BROKER_OPERATION_TYPE_OPTIONS.map((option) => ( {BROKER_OPERATION_TYPE_OPTIONS.map((option) => (
@ -68,9 +74,9 @@ export function BrokerOperationsPage() {
</option> </option>
))} ))}
</select> </select>
</label> </Box>
</div> </Box>
{history} {history}
</section> </Box>
); );
} }

14
apps/frontend/src/pages/broker-positions/ui/BrokerPositionsPage.tsx
View File

@ -1,3 +1,5 @@
import { Box } from '@mui/material';
import { Heading, Text } from '@moex-vibe/design-system';
import { useBrokerPositions } from '@/entities/broker-position'; import { useBrokerPositions } from '@/entities/broker-position';
import { useBrokerAccountContext } from '@/widgets/broker-account-layout'; import { useBrokerAccountContext } from '@/widgets/broker-account-layout';
import { BrokerPositionTable } from '@/widgets/broker-positions-table'; import { BrokerPositionTable } from '@/widgets/broker-positions-table';
@ -15,14 +17,14 @@ export function BrokerPositionsPage({ type, title }: BrokerPositionsPageProps) {
if (positions.error) { if (positions.error) {
return ( return (
<section aria-labelledby={`broker-${type}-heading`}> <Box component="section" aria-labelledby={`broker-${type}-heading`}>
<h2 id={`broker-${type}-heading`} style={{ fontSize: 20, margin: 0 }}> <Heading level={2} id={`broker-${type}-heading`}>
{title} {title}
</h2> </Heading>
<p role="alert"> <Text component="p" tone="negative" role="alert">
{type === 'share' ? 'Не удалось загрузить акции' : 'Не удалось загрузить облигации'} {type === 'share' ? 'Не удалось загрузить акции' : 'Не удалось загрузить облигации'}
</p> </Text>
</section> </Box>
); );
} }