Skip to content

Commit de8ada8

Browse files
claraniflomonster
clarani
authored and
flomonster
committed
front: fix scenario timetable height
1 parent 5a3df3c commit de8ada8

File tree

2 files changed

+105
-103
lines changed

2 files changed

+105
-103
lines changed

‎front/src/applications/operationalStudies/views/v2/ScenarioV2.tsx

+104-100
Original file line numberDiff line numberDiff line change
@@ -159,112 +159,116 @@ const ScenarioV2 = () => {
159159
<main className="mastcontainer mastcontainer-no-mastnav">
160160
<div className="scenario">
161161
<div className="row scenario-container">
162-
<div
163-
className={`scenario-sidemenu ${collapsedTimetable ? 'd-none' : 'col-hdp-3 col-xl-4 col-lg-5 col-md-6'}`}
164-
>
165-
{scenario && (
166-
<div className="scenario-details">
167-
<div className="scenario-details-name">
168-
<span className="flex-grow-1 scenario-name text-truncate" title={scenario.name}>
169-
{scenario.name}
170-
</span>
171-
<button
172-
data-testid="editScenario"
173-
className="scenario-details-modify-button"
174-
type="button"
175-
aria-label={t('editScenario')}
176-
onClick={() =>
177-
openModal(
178-
<AddAndEditScenarioModal editionMode scenario={scenario} />,
179-
'xl',
180-
'no-close-modal'
181-
)
182-
}
183-
title={t('editScenario')}
184-
>
185-
<Pencil />
186-
</button>
187-
<button
188-
type="button"
189-
className="scenario-details-modify-button"
190-
onClick={() => setTrainsWithDetails(!trainsWithDetails)}
191-
title={t('displayTrainsWithDetails')}
192-
>
193-
{trainsWithDetails ? <EyeClosed /> : <Eye />}
194-
</button>
195-
<button
196-
type="button"
197-
className="scenario-details-modify-button"
198-
aria-label={t('toggleTimetable')}
199-
onClick={() => setCollapsedTimetable(true)}
200-
>
201-
<ChevronLeft />
202-
</button>
203-
</div>
204-
<div className="row">
205-
<div className="col-md-6">
206-
<div className="scenario-details-infra-name">
207-
<img src={infraLogo} alt="Infra logo" className="infra-logo mr-2" />
208-
{infra && <InfraLoadingState infra={infra} />}
209-
<span className="scenario-infra-name">{scenario.infra_name}</span>
210-
<small className="ml-auto text-muted">ID {scenario.infra_id}</small>
211-
</div>
162+
<div className={collapsedTimetable ? 'd-none' : 'col-hdp-3 col-xl-4 col-lg-5 col-md-6'}>
163+
<div className="scenario-sidemenu">
164+
{scenario && (
165+
<div className="scenario-details">
166+
<div className="scenario-details-name">
167+
<span
168+
className="flex-grow-1 scenario-name text-truncate"
169+
title={scenario.name}
170+
>
171+
{scenario.name}
172+
</span>
173+
<button
174+
data-testid="editScenario"
175+
className="scenario-details-modify-button"
176+
type="button"
177+
aria-label={t('editScenario')}
178+
onClick={() =>
179+
openModal(
180+
<AddAndEditScenarioModal editionMode scenario={scenario} />,
181+
'xl',
182+
'no-close-modal'
183+
)
184+
}
185+
title={t('editScenario')}
186+
>
187+
<Pencil />
188+
</button>
189+
<button
190+
type="button"
191+
className="scenario-details-modify-button"
192+
onClick={() => setTrainsWithDetails(!trainsWithDetails)}
193+
title={t('displayTrainsWithDetails')}
194+
>
195+
{trainsWithDetails ? <EyeClosed /> : <Eye />}
196+
</button>
197+
<button
198+
type="button"
199+
className="scenario-details-modify-button"
200+
aria-label={t('toggleTimetable')}
201+
onClick={() => setCollapsedTimetable(true)}
202+
>
203+
<ChevronLeft />
204+
</button>
212205
</div>
213-
<div className="col-md-6">
214-
<div className="scenario-details-electrical-profile-set">
215-
<span className="mr-2">
216-
<GiElectric />
217-
</span>
218-
{timetable.electrical_profile_set_id
219-
? timetable.electrical_profile_set_id
220-
: t('noElectricalProfileSet')}
206+
<div className="row">
207+
<div className="col-md-6">
208+
<div className="scenario-details-infra-name">
209+
<img src={infraLogo} alt="Infra logo" className="infra-logo mr-2" />
210+
{infra && <InfraLoadingState infra={infra} />}
211+
<span className="scenario-infra-name">{scenario.infra_name}</span>
212+
<small className="ml-auto text-muted">ID {scenario.infra_id}</small>
213+
</div>
221214
</div>
222-
</div>
223-
</div>
224-
{infra &&
225-
infra.state === 'TRANSIENT_ERROR' &&
226-
(reloadCount <= 5 ? (
227-
<div className="scenario-details-infra-error mt-1">
228-
{t('errorMessages.unableToLoadInfra', { reloadCount })}
215+
<div className="col-md-6">
216+
<div className="scenario-details-electrical-profile-set">
217+
<span className="mr-2">
218+
<GiElectric />
219+
</span>
220+
{timetable.electrical_profile_set_id
221+
? timetable.electrical_profile_set_id
222+
: t('noElectricalProfileSet')}
223+
</div>
229224
</div>
230-
) : (
225+
</div>
226+
{infra &&
227+
infra.state === 'TRANSIENT_ERROR' &&
228+
(reloadCount <= 5 ? (
229+
<div className="scenario-details-infra-error mt-1">
230+
{t('errorMessages.unableToLoadInfra', { reloadCount })}
231+
</div>
232+
) : (
233+
<div className="scenario-details-infra-error mt-1">
234+
{t('errorMessages.softErrorInfra')}
235+
</div>
236+
))}
237+
{infra && infra.state === 'ERROR' && (
231238
<div className="scenario-details-infra-error mt-1">
232-
{t('errorMessages.softErrorInfra')}
239+
{t('errorMessages.hardErrorInfra')}
233240
</div>
234-
))}
235-
{infra && infra.state === 'ERROR' && (
236-
<div className="scenario-details-infra-error mt-1">
237-
{t('errorMessages.hardErrorInfra')}
238-
</div>
239-
)}
240-
<div className="scenario-details-description">{scenario.description}</div>
241-
</div>
242-
)}
243-
{displayTrainScheduleManagement !== MANAGE_TRAIN_SCHEDULE_TYPES.none && infra && (
244-
<TimetableManageTrainScheduleV2
245-
displayTrainScheduleManagement={displayTrainScheduleManagement}
246-
setDisplayTrainScheduleManagement={setDisplayTrainScheduleManagement}
247-
setTrainResultsToFetch={setTrainResultsToFetch}
248-
trainIdToEdit={trainIdToEdit}
249-
setTrainIdToEdit={setTrainIdToEdit}
250-
infraState={infra.state}
251-
/>
252-
)}
253-
{infra && (
254-
<TimetableV2
255-
setDisplayTrainScheduleManagement={setDisplayTrainScheduleManagement}
256-
trainsWithDetails={trainsWithDetails}
257-
infraState={infra.state}
258-
trainIds={timetable.train_ids}
259-
selectedTrainId={selectedTrainId}
260-
conflicts={conflicts}
261-
setTrainResultsToFetch={setTrainResultsToFetch}
262-
setSpaceTimeData={setTrainSpaceTimeData}
263-
setTrainIdToEdit={setTrainIdToEdit}
264-
trainIdToEdit={trainIdToEdit}
265-
/>
266-
)}
241+
)}
242+
<div className="scenario-details-description">{scenario.description}</div>
243+
</div>
244+
)}
245+
{displayTrainScheduleManagement !== MANAGE_TRAIN_SCHEDULE_TYPES.none && infra && (
246+
<TimetableManageTrainScheduleV2
247+
displayTrainScheduleManagement={displayTrainScheduleManagement}
248+
setDisplayTrainScheduleManagement={setDisplayTrainScheduleManagement}
249+
setTrainResultsToFetch={setTrainResultsToFetch}
250+
trainIdToEdit={trainIdToEdit}
251+
setTrainIdToEdit={setTrainIdToEdit}
252+
infraState={infra.state}
253+
/>
254+
)}
255+
{infra && (
256+
<TimetableV2
257+
setDisplayTrainScheduleManagement={setDisplayTrainScheduleManagement}
258+
trainsWithDetails={trainsWithDetails}
259+
infraState={infra.state}
260+
trainIds={timetable.train_ids}
261+
selectedTrainId={selectedTrainId}
262+
conflicts={conflicts}
263+
setTrainResultsToFetch={setTrainResultsToFetch}
264+
setSpaceTimeData={setTrainSpaceTimeData}
265+
setTrainIdToEdit={setTrainIdToEdit}
266+
trainIdToEdit={trainIdToEdit}
267+
/>
268+
)}
269+
</div>
267270
</div>
271+
268272
<div className={collapsedTimetable ? 'col-12' : 'col-hdp-9 col-xl-8 col-lg-7 col-md-6'}>
269273
{(!isInfraLoaded || isUpdating) &&
270274
displayTrainScheduleManagement !== MANAGE_TRAIN_SCHEDULE_TYPES.add &&

‎front/src/styles/scss/applications/operationalStudies/_scenario.scss

+1-3
Original file line numberDiff line numberDiff line change
@@ -62,8 +62,6 @@
6262
.scenario-sidemenu {
6363
padding-top: 0.5rem;
6464
padding-bottom: 0.5rem;
65-
display: flex;
66-
flex-direction: column;
6765
.scenario-details {
6866
display: flex;
6967
flex-direction: column;
@@ -119,7 +117,7 @@
119117
.scenario-timetable {
120118
display: flex;
121119
flex-direction: column;
122-
flex-grow: 1;
120+
height: calc(var(--content-height) - 8rem);
123121
.scenario-timetable-addtrains-buttons {
124122
display: flex;
125123
align-items: center;

0 commit comments

Comments
 (0)