-
Notifications
You must be signed in to change notification settings - Fork 45
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
18 changed files
with
1,025 additions
and
779 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
241 changes: 241 additions & 0 deletions
241
front/src/applications/stdcm/components/SimulationReportSheet.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,241 @@ | ||
import React from 'react'; | ||
|
||
import { Table, TR, TH, TD } from '@ag-media/react-pdf-table'; | ||
import { Page, Text, Image, Document, View, Font } from '@react-pdf/renderer'; | ||
import { useTranslation } from 'react-i18next'; | ||
|
||
import iconAlert from 'assets/simulationSheet/icon_alert_fill.png'; | ||
import logoSNCF from 'assets/simulationSheet/logo_sncf_reseau.png'; | ||
import type { PostStdcmApiResponse, RollingStockWithLiveries } from 'common/api/osrdEditoastApi'; | ||
|
||
import styles from './SimulationReportStyleSheet'; | ||
import IBMPlexMonoBold from '../styles/fonts/IBM-Plex-Mono/IBMPlexMono-Bold.ttf'; | ||
import IBMPlexMonoRegular from '../styles/fonts/IBM-Plex-Mono/IBMPlexMono-Regular.ttf'; | ||
import IBMPlexSansBold from '../styles/fonts/IBM-Plex-Sans/IBMPlexSans-Bold.ttf'; | ||
import IBMPlexSansItalic from '../styles/fonts/IBM-Plex-Sans/IBMPlexSans-Italic.ttf'; | ||
import IBMPlexSansMedium from '../styles/fonts/IBM-Plex-Sans/IBMPlexSans-Medium.ttf'; | ||
import IBMPlexSansRegular from '../styles/fonts/IBM-Plex-Sans/IBMPlexSans-Regular.ttf'; | ||
import IBMPlexSansSemiBold from '../styles/fonts/IBM-Plex-Sans/IBMPlexSans-SemiBold.ttf'; | ||
import { formatDate, getStopTime } from '../utils'; | ||
|
||
interface Props { | ||
stdcmData: PostStdcmApiResponse | null; | ||
rollingStockData: RollingStockWithLiveries | undefined; | ||
numero: string; | ||
} | ||
|
||
const SimulationReportSheet: React.FC<Props> = ({ stdcmData, rollingStockData, numero }) => { | ||
const { t } = useTranslation('stdcm-simulation-sheet'); | ||
|
||
Font.register({ | ||
family: 'IBM Plex Sans', | ||
fonts: [ | ||
{ src: IBMPlexSansRegular, fontWeight: 'normal' }, | ||
{ src: IBMPlexSansMedium, fontWeight: 'medium' }, | ||
{ src: IBMPlexSansSemiBold, fontWeight: 'semibold' }, | ||
{ src: IBMPlexSansBold, fontWeight: 'bold' }, | ||
{ src: IBMPlexSansItalic, fontStyle: 'italic' }, | ||
], | ||
}); | ||
|
||
Font.register({ | ||
family: 'IBM Plex Mono', | ||
fonts: [ | ||
{ src: IBMPlexMonoRegular, fontWeight: 'normal' }, | ||
{ src: IBMPlexMonoBold, fontWeight: 'bold' }, | ||
], | ||
}); | ||
|
||
return ( | ||
<Document> | ||
<Page wrap={false} style={styles.page} size={[1344]}> | ||
<View style={styles.alertBanner}> | ||
<Image src={iconAlert} style={styles.alertIcon} /> | ||
<Text style={styles.simulationTitle}>{t('simulation')}</Text> | ||
<Text style={styles.message}>{t('warningMessage')}</Text> | ||
</View> | ||
<View> | ||
<View style={styles.numberDateBanner}> | ||
<View style={styles.stdcm}> | ||
<Text style={styles.title}>{t('stdcm')}</Text> | ||
<Text style={styles.creation}>{t('stdcmCreation')}</Text> | ||
</View> | ||
<View style={styles.numericInfo}> | ||
<Text style={styles.number}> | ||
{t('numero')} | ||
{numero} | ||
</Text> | ||
<Text style={styles.creationDate}>{formatDate(stdcmData?.path.created)}</Text> | ||
</View> | ||
<Image src={logoSNCF} style={styles.sncfLogo} /> | ||
</View> | ||
</View> | ||
<View style={styles.rcInfo}> | ||
<View> | ||
<Text style={styles.rcName}>Super Fret</Text> | ||
<Text style={styles.rcPerson}>Stéphanie Martin-Duclotte</Text> | ||
</View> | ||
<View> | ||
<Text style={styles.phoneNumber}>04 12 34 56 78</Text> | ||
<Text style={styles.mail}>stephanie.martin-duclotte@superfret.fr</Text> | ||
</View> | ||
<View style={styles.stdcmApplication}> | ||
<Text style={styles.applicationDate}>{t('applicationDate')}</Text> | ||
<Text style={styles.date}>vendredi 15 mars 2024</Text> | ||
<Text style={styles.referencePath}>{t('referencePath')}</Text> | ||
<Text style={styles.pathNumber}>n°123456</Text> | ||
</View> | ||
</View> | ||
<View style={styles.convoyAndRoute}> | ||
<View style={styles.convoy}> | ||
<Text style={styles.convoyTitle}> {t('convoy')}</Text> | ||
<Text style={styles.convoyInfo}>{t('speedLimitByTag')}</Text> | ||
<Text> | ||
{stdcmData?.simulation.speed_limit_tags === null | ||
? '-' | ||
: stdcmData?.simulation.speed_limit_tags} | ||
</Text> | ||
<Text style={styles.convoyInfo}>{t('towedMaterial')}</Text> | ||
<Text>-</Text> | ||
<Text style={styles.convoyInfo}>{t('maxSpeed')}</Text> | ||
<Text> | ||
{rollingStockData?.max_speed && rollingStockData?.max_speed * 3.6} {t('kmH')} | ||
</Text> | ||
<Text style={styles.convoyInfo}>{t('maxWeight')}</Text> | ||
<Text> | ||
{rollingStockData?.mass && Math.floor(rollingStockData?.mass / 1000)} {t('ton')} | ||
</Text> | ||
<Text style={styles.convoyInfo}>{t('referenceEngine')}</Text> | ||
<Text>{rollingStockData?.metadata?.reference}</Text> | ||
<Text style={styles.convoyInfo}>{t('maxLength')}</Text> | ||
<Text> | ||
{rollingStockData?.length} {t('meters')} | ||
</Text> | ||
</View> | ||
<View style={styles.route}> | ||
<Text style={styles.routeTitle}> {t('requestedRoute')}</Text> | ||
<View style={styles.fromBanner}> | ||
<Text style={styles.from}>{t('from')}</Text> | ||
<Text>n°123456</Text> | ||
</View> | ||
<View style={styles.stopTableContainer}> | ||
<Table style={styles.stopTable}> | ||
<TH style={styles.stopTableTH}> | ||
<TD aria-label="line-count" /> | ||
<TD>{t('operationalPoint')}</TD> | ||
<TD>{t('code')}</TD> | ||
<TD>{t('endStop')}</TD> | ||
<TD>{t('startStop')}</TD> | ||
<TD>{t('motif')}</TD> | ||
</TH> | ||
{stdcmData?.simulation.base.stops.map( | ||
(stop, index) => | ||
(index === 0 || stop.duration > 0) && ( | ||
<TR key={index} style={styles.stopTableTbody}> | ||
<TD style={styles.stopTableIndexColumn}>{index + 1}</TD> | ||
<TD style={styles.stopTablePRColumn}>{stop.name || 'Unknown'}</TD> | ||
<TD style={styles.stopTableCHColumn}>{stop.ch}</TD> | ||
<TD style={styles.stopTableItalicColumn}> | ||
{index === stdcmData.simulation.base.stops.length - 1 | ||
? getStopTime(stop.time) | ||
: ''} | ||
</TD> | ||
<TD style={styles.stopTableStartColumn}> | ||
{index === 0 ? getStopTime(stop.time) : ''} | ||
</TD> | ||
<TD style={styles.stopTableItalicColumn} aria-label="motif" /> | ||
</TR> | ||
) | ||
)} | ||
</Table> | ||
</View> | ||
<View style={styles.forBanner}> | ||
<Text>n°987654</Text> | ||
<Text style={styles.for}>{t('for')}</Text> | ||
</View> | ||
</View> | ||
</View> | ||
<View style={styles.simulation}> | ||
<Text style={styles.simulationUppercase}>{t('simulation')}</Text> | ||
<Text style={styles.simulationLength}> | ||
{Math.round((stdcmData?.path.length ?? 0) / 1000)} | ||
{t('km')} | ||
</Text> | ||
<View style={styles.tableContainer}> | ||
<Table style={styles.table}> | ||
<TH style={styles.th}> | ||
<TD aria-label="line-count" /> | ||
<TD>{t('operationalPoint')}</TD> | ||
<TD>{t('code')}</TD> | ||
<TD>{t('track')}</TD> | ||
<TD>{t('endStop')}</TD> | ||
<TD>{t('passageStop')}</TD> | ||
<TD>{t('startStop')}</TD> | ||
<TD>{t('weight')}</TD> | ||
<TD>{t('referenceEngine')}</TD> | ||
<TD>{t('conventionalSign')}</TD> | ||
<TD>{t('crossedATE')}</TD> | ||
</TH> | ||
{stdcmData?.simulation.base.stops.map((stop, index) => ( | ||
<TR | ||
key={index} | ||
style={ | ||
stop.duration !== 0 && index !== stdcmData.simulation.base.stops.length - 1 | ||
? styles.blueRow | ||
: styles.tbody | ||
} | ||
> | ||
<TD style={styles.indexColumn}>{index + 1}</TD> | ||
<TD style={styles.td}> | ||
{index === 0 || | ||
stop.name !== stdcmData.simulation.base.stops[index - 1].name || | ||
index === stdcmData.simulation.base.stops.length - 1 | ||
? stop.name || 'Unknown' | ||
: '='} | ||
</TD> | ||
<TD style={styles.chColumn}>{stop.ch}</TD> | ||
<TD style={styles.td}>{stop.track_name}</TD> | ||
<TD style={styles.stopColumn}> | ||
{index === stdcmData.simulation.base.stops.length - 1 || stop.duration !== 0 | ||
? getStopTime(stop.time) | ||
: ''} | ||
</TD> | ||
<TD | ||
style={ | ||
stop.duration !== 0 && index !== stdcmData.simulation.base.stops.length - 1 | ||
? styles.blueStop | ||
: styles.stopColumn | ||
} | ||
> | ||
{index !== 0 && index !== stdcmData.simulation.base.stops.length - 1 | ||
? stop.duration !== 0 | ||
? getStopTime(stop.duration) | ||
: getStopTime(stop.time) | ||
: ''} | ||
</TD> | ||
<TD style={styles.stopColumn}> | ||
{index === 0 || | ||
(stop.duration !== 0 && index !== stdcmData.simulation.base.stops.length - 1) | ||
? getStopTime(stop.time + stop.duration) | ||
: ''} | ||
</TD> | ||
<TD style={styles.td} aria-label="weight" /> | ||
<TD style={styles.td} aria-label="referenceEngine" /> | ||
<TD style={styles.td} aria-label="conventionalSign" /> | ||
<TD style={styles.td} aria-label="crossedATE" /> | ||
</TR> | ||
))} | ||
</Table> | ||
<View style={styles.horizontalBar} /> | ||
</View> | ||
</View> | ||
<View style={styles.map} /> | ||
<View style={styles.warrantyBox}> | ||
<Text style={styles.warrantyMessage}>{t('withoutWarranty')}</Text> | ||
</View> | ||
</Page> | ||
</Document> | ||
); | ||
}; | ||
|
||
export default SimulationReportSheet; |
Oops, something went wrong.