mirror of
https://github.com/freqtrade/frequi.git
synced 2024-11-10 18:23:50 +00:00
Fix and improve Backtest layout
This commit is contained in:
Matthias
parent
651acfa8d9
commit
644d889521
|
|
@ -1,80 +1,79 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="container-fluid" style="max-height: calc(100vh - 60px)">
|
<div class="d-flex flex-column pt-1 me-1" style="max-height: calc(100vh - 60px)">
|
||||||
<div class="container-fluid pt-2">
|
<div>
|
||||||
<p v-if="!botStore.activeBot.canRunBacktest">
|
<div class="d-flex flex-row">
|
||||||
Bot must be in webserver mode to enable Backtesting.
|
<h2 class="ms-5">Backtesting</h2>
|
||||||
</p>
|
<p v-if="!botStore.activeBot.canRunBacktest">
|
||||||
<div class="row w-100">
|
Bot must be in webserver mode to enable Backtesting.
|
||||||
<h2 class="col-4 col-lg-3">Backtesting</h2>
|
</p>
|
||||||
<div
|
<div class="w-100">
|
||||||
class="col-12 col-lg-order-last col-lg-6 mx-md-5 d-flex flex-wrap justify-content-md-center justify-content-between mb-4"
|
<div
|
||||||
>
|
class="mx-md-5 d-flex flex-wrap justify-content-md-center justify-content-between mb-4 gap-2"
|
||||||
<b-form-radio
|
|
||||||
v-if="botStore.activeBot.botApiVersion >= 2.15"
|
|
||||||
v-model="btFormMode"
|
|
||||||
name="bt-form-radios"
|
|
||||||
button
|
|
||||||
class="mx-1 flex-samesize-items"
|
|
||||||
value="historicResults"
|
|
||||||
:disabled="!botStore.activeBot.canRunBacktest"
|
|
||||||
>Load Results</b-form-radio
|
|
||||||
>
|
>
|
||||||
<b-form-radio
|
<b-form-radio
|
||||||
v-model="btFormMode"
|
v-if="botStore.activeBot.botApiVersion >= 2.15"
|
||||||
name="bt-form-radios"
|
v-model="btFormMode"
|
||||||
button
|
name="bt-form-radios"
|
||||||
class="mx-1 flex-samesize-items"
|
button
|
||||||
value="run"
|
class="mx-1 flex-samesize-items"
|
||||||
:disabled="!botStore.activeBot.canRunBacktest"
|
value="historicResults"
|
||||||
>Run backtest</b-form-radio
|
:disabled="!botStore.activeBot.canRunBacktest"
|
||||||
>
|
>Load Results</b-form-radio
|
||||||
<b-form-radio
|
>
|
||||||
id="bt-analyze-btn"
|
<b-form-radio
|
||||||
v-model="btFormMode"
|
v-model="btFormMode"
|
||||||
name="bt-form-radios"
|
name="bt-form-radios"
|
||||||
button
|
button
|
||||||
class="mx-1 flex-samesize-items"
|
class="mx-1 flex-samesize-items"
|
||||||
value="results"
|
value="run"
|
||||||
:disabled="!hasBacktestResult"
|
:disabled="!botStore.activeBot.canRunBacktest"
|
||||||
>Analyze result</b-form-radio
|
>Run backtest</b-form-radio
|
||||||
>
|
>
|
||||||
<b-form-radio
|
<b-form-radio
|
||||||
v-model="btFormMode"
|
id="bt-analyze-btn"
|
||||||
name="bt-form-radios"
|
v-model="btFormMode"
|
||||||
button
|
name="bt-form-radios"
|
||||||
class="mx-1 flex-samesize-items"
|
button
|
||||||
value="visualize-summary"
|
class="mx-1 flex-samesize-items"
|
||||||
:disabled="!hasBacktestResult"
|
value="results"
|
||||||
>Visualize summary</b-form-radio
|
:disabled="!hasBacktestResult"
|
||||||
>
|
>Analyze result</b-form-radio
|
||||||
<b-form-radio
|
>
|
||||||
v-model="btFormMode"
|
<b-form-radio
|
||||||
name="bt-form-radios"
|
v-model="btFormMode"
|
||||||
button
|
name="bt-form-radios"
|
||||||
class="mx-1 flex-samesize-items"
|
button
|
||||||
value="visualize"
|
class="mx-1 flex-samesize-items"
|
||||||
:disabled="!hasBacktestResult"
|
value="visualize-summary"
|
||||||
>Visualize result</b-form-radio
|
:disabled="!hasBacktestResult"
|
||||||
|
>Visualize summary</b-form-radio
|
||||||
|
>
|
||||||
|
<b-form-radio
|
||||||
|
v-model="btFormMode"
|
||||||
|
name="bt-form-radios"
|
||||||
|
button
|
||||||
|
class="mx-1 flex-samesize-items"
|
||||||
|
value="visualize"
|
||||||
|
:disabled="!hasBacktestResult"
|
||||||
|
>Visualize result</b-form-radio
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<small v-show="botStore.activeBot.backtestRunning" class="text-end bt-running-label"
|
||||||
|
>Backtest running: {{ botStore.activeBot.backtestStep }}
|
||||||
|
{{ formatPercent(botStore.activeBot.backtestProgress, 2) }}</small
|
||||||
>
|
>
|
||||||
</div>
|
</div>
|
||||||
<small
|
|
||||||
v-show="botStore.activeBot.backtestRunning"
|
|
||||||
class="text-end bt-running-label col-8 col-lg-3"
|
|
||||||
>Backtest running: {{ botStore.activeBot.backtestStep }}
|
|
||||||
{{ formatPercent(botStore.activeBot.backtestProgress, 2) }}</small
|
|
||||||
>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="d-flex flex-md-row">
|
||||||
<div class="d-md-flex">
|
|
||||||
<!-- Left bar -->
|
<!-- Left bar -->
|
||||||
<div
|
<div
|
||||||
|
v-if="btFormMode !== 'visualize'"
|
||||||
:class="`${showLeftBar ? 'col-md-3' : ''}`"
|
:class="`${showLeftBar ? 'col-md-3' : ''}`"
|
||||||
class="sticky-top sticky-offset me-3 d-flex flex-column absolute"
|
class="sticky-top sticky-offset me-3 d-flex flex-column absolute"
|
||||||
style="max-height: calc(100vh - 60px)"
|
style="max-height: calc(100vh - 60px)"
|
||||||
>
|
>
|
||||||
<b-button
|
<b-button
|
||||||
v-if="btFormMode !== 'visualize'"
|
|
||||||
class="align-self-start"
|
class="align-self-start"
|
||||||
aria-label="Close"
|
aria-label="Close"
|
||||||
size="sm"
|
size="sm"
|
||||||
|
|
@ -94,39 +93,44 @@
|
||||||
</transition>
|
</transition>
|
||||||
</div>
|
</div>
|
||||||
<!-- End Left bar -->
|
<!-- End Left bar -->
|
||||||
<div
|
<div class="d-flex flex-column overflow-auto flex-fill">
|
||||||
v-if="btFormMode == 'historicResults'"
|
<div class="d-md-flex">
|
||||||
class="flex-fill row d-flex flex-column bt-config"
|
<div
|
||||||
>
|
v-if="btFormMode == 'historicResults'"
|
||||||
<BacktestHistoryLoad />
|
class="flex-fill d-flex flex-column bt-config"
|
||||||
</div>
|
>
|
||||||
<div v-if="btFormMode == 'run'" class="flex-fill row d-flex flex-column bt-config">
|
<BacktestHistoryLoad />
|
||||||
<BacktestRun />
|
</div>
|
||||||
</div>
|
<div v-if="btFormMode == 'run'" class="flex-fill d-flex flex-column bt-config">
|
||||||
<BacktestResultAnalysis
|
<BacktestRun />
|
||||||
v-if="hasBacktestResult && btFormMode == 'results'"
|
</div>
|
||||||
:backtest-result="botStore.activeBot.selectedBacktestResult"
|
<BacktestResultAnalysis
|
||||||
class="flex-fill"
|
v-if="hasBacktestResult && btFormMode == 'results'"
|
||||||
/>
|
:backtest-result="botStore.activeBot.selectedBacktestResult"
|
||||||
|
class="flex-fill"
|
||||||
|
/>
|
||||||
|
|
||||||
<BacktestGraphs
|
<BacktestGraphs
|
||||||
v-if="hasBacktestResult && btFormMode == 'visualize-summary'"
|
v-if="hasBacktestResult && btFormMode == 'visualize-summary'"
|
||||||
:trades="botStore.activeBot.selectedBacktestResult.trades"
|
:trades="botStore.activeBot.selectedBacktestResult.trades"
|
||||||
/>
|
class="flex-fill"
|
||||||
</div>
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div
|
<div
|
||||||
v-if="hasBacktestResult && btFormMode == 'visualize'"
|
v-if="hasBacktestResult && btFormMode == 'visualize'"
|
||||||
class="container-fluid text-center w-100 mt-2"
|
class="container-fluid text-center w-100 mt-2"
|
||||||
>
|
>
|
||||||
<BacktestResultChart
|
<BacktestResultChart
|
||||||
:timeframe="timeframe"
|
:timeframe="timeframe"
|
||||||
:strategy="btStore.strategy"
|
:strategy="btStore.strategy"
|
||||||
:timerange="btStore.timerange"
|
:timerange="btStore.timerange"
|
||||||
:pairlist="botStore.activeBot.selectedBacktestResult.pairlist"
|
:pairlist="botStore.activeBot.selectedBacktestResult.pairlist"
|
||||||
:trades="botStore.activeBot.selectedBacktestResult.trades"
|
:trades="botStore.activeBot.selectedBacktestResult.trades"
|
||||||
:freqai-model="btStore.freqAI.enabled ? btStore.freqAI.model : undefined"
|
:freqai-model="btStore.freqAI.enabled ? btStore.freqAI.model : undefined"
|
||||||
/>
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user