lychiyu/frequi_origin
1
0
Fork 0
mirror of https://github.com/freqtrade/frequi.git synced 2024-11-13 03:33:50 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Fix and improve Backtest layout

Browse Source
This commit is contained in:
Matthias 2023-08-05 08:51:28 +02:00
parent 651acfa8d9
commit 644d889521
1 changed files with 99 additions and 95 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
src/views/BacktestingView.vue
View File

@ -1,13 +1,14 @@
<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>
<div class="d-flex flex-row">
<h2 class="ms-5">Backtesting</h2>
<p v-if="!botStore.activeBot.canRunBacktest"> <p v-if="!botStore.activeBot.canRunBacktest">
Bot must be in webserver mode to enable Backtesting. Bot must be in webserver mode to enable Backtesting.
</p> </p>
<div class="row w-100"> <div class="w-100">
<h2 class="col-4 col-lg-3">Backtesting</h2>
<div <div
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" class="mx-md-5 d-flex flex-wrap justify-content-md-center justify-content-between mb-4 gap-2"
> >
<b-form-radio <b-form-radio
v-if="botStore.activeBot.botApiVersion >= 2.15" v-if="botStore.activeBot.botApiVersion >= 2.15"
@ -57,24 +58,22 @@
>Visualize result</b-form-radio >Visualize result</b-form-radio
> >
</div> </div>
<small <small v-show="botStore.activeBot.backtestRunning" class="text-end bt-running-label"
v-show="botStore.activeBot.backtestRunning"
class="text-end bt-running-label col-8 col-lg-3"
>Backtest running: {{ botStore.activeBot.backtestStep }} >Backtest running: {{ botStore.activeBot.backtestStep }}
{{ formatPercent(botStore.activeBot.backtestProgress, 2) }}</small {{ formatPercent(botStore.activeBot.backtestProgress, 2) }}</small
> >
</div> </div>
</div> </div>
</div>
<div class="d-md-flex"> <div class="d-flex flex-md-row">
<!-- 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,13 +93,15 @@
</transition> </transition>
</div> </div>
<!-- End Left bar --> <!-- End Left bar -->
<div class="d-flex flex-column overflow-auto flex-fill">
<div class="d-md-flex">
<div <div
v-if="btFormMode == 'historicResults'" v-if="btFormMode == 'historicResults'"
class="flex-fill row d-flex flex-column bt-config" class="flex-fill d-flex flex-column bt-config"
> >
<BacktestHistoryLoad /> <BacktestHistoryLoad />
</div> </div>
<div v-if="btFormMode == 'run'" class="flex-fill row d-flex flex-column bt-config"> <div v-if="btFormMode == 'run'" class="flex-fill d-flex flex-column bt-config">
<BacktestRun /> <BacktestRun />
</div> </div>
<BacktestResultAnalysis <BacktestResultAnalysis
@ -112,6 +113,7 @@
<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>
@ -129,6 +131,8 @@
/> />
</div> </div>
</div> </div>
</div>
</div>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">