Improve backtesting layout

This commit is contained in:
Matthias 2021-01-06 13:13:02 +01:00
parent 057293c5c0
commit edcd3ff62b

View File

@ -1,12 +1,13 @@
<template> <template>
<div class="container-fluid"> <div class="container-fluid">
<h2>Backtesting</h2> <h2 class="mt-3">Backtesting</h2>
<div class="container"> <div class="container">
<div class="row mx-5 d-flex flex-wrap justify-space-between mb-4"> <div class="row mx-5 d-flex flex-wrap justify-content-center mb-4">
<b-form-radio <b-form-radio
v-model="btFormMode" v-model="btFormMode"
name="bt-form-radios" name="bt-form-radios"
button button
class="mx-1"
value="run" value="run"
:disabled="!canRunBacktest" :disabled="!canRunBacktest"
>Run backtest</b-form-radio >Run backtest</b-form-radio
@ -15,6 +16,7 @@
v-model="btFormMode" v-model="btFormMode"
name="bt-form-radios" name="bt-form-radios"
button button
class="mx-1"
value="results" value="results"
:disabled="!hasBacktestResult" :disabled="!hasBacktestResult"
>Analyze result</b-form-radio >Analyze result</b-form-radio
@ -23,6 +25,7 @@
v-model="btFormMode" v-model="btFormMode"
name="bt-form-radios" name="bt-form-radios"
button button
class="mx-1"
value="visualize-summary" value="visualize-summary"
:disabled="!hasBacktestResult" :disabled="!hasBacktestResult"
>Visualize summary</b-form-radio >Visualize summary</b-form-radio
@ -31,14 +34,14 @@
v-model="btFormMode" v-model="btFormMode"
name="bt-form-radios" name="bt-form-radios"
button button
class="mx-1"
value="visualize" value="visualize"
:disabled="!hasBacktestResult" :disabled="!hasBacktestResult"
>Visualize result</b-form-radio >Visualize result</b-form-radio
> >
</div> </div>
<div v-if="btFormMode == 'strategy'" class="row"></div> <div v-if="btFormMode == 'run'" class="row d-flex flex-column">
<div v-if="btFormMode == 'run'" class="row">
<StrategyList v-model="strategy"></StrategyList> <StrategyList v-model="strategy"></StrategyList>
<b-card bg-variant="light" class="w-60" :disabled="backtestRunning"> <b-card bg-variant="light" class="w-60" :disabled="backtestRunning">
@ -103,23 +106,27 @@
</b-form-group> --> </b-form-group> -->
</b-form-group> </b-form-group>
</b-card> </b-card>
</div>
<div v-if="btFormMode == 'run'" class="container"> <TimeRangeSelect v-model="timerange" class="mt-2"></TimeRangeSelect>
<div class="row"> <h3 class="mt-3">Backtesting summary</h3>
<TimeRangeSelect v-model="timerange"></TimeRangeSelect> <div class="d-flex justify-content-center">
</div> <b-button
<div class="row"> variant="primary"
<h3>Backtesting summary</h3> :disabled="backtestRunning"
</div> class="mx-1"
<div class="row"> @click="clickBacktest"
<b-button variant="primary" :disabled="backtestRunning" @click="clickBacktest"> >
Start backtest Start backtest
</b-button> </b-button>
<b-button variant="primary" :disabled="backtestRunning" @click="pollBacktest"> <b-button
variant="primary"
:disabled="backtestRunning"
class="mx-1"
@click="pollBacktest"
>
Load backtest result Load backtest result
</b-button> </b-button>
<b-button variant="primary" @click="removeBacktest">Reset Backtest</b-button> <b-button variant="primary" class="mx-1" @click="removeBacktest">Reset Backtest</b-button>
</div> </div>
</div> </div>
</div> </div>