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

Improve backtesting layout

Browse Source
This commit is contained in:
Matthias 2021-03-10 16:34:09 +01:00
parent 2f11851600
commit 8b9e5d93a1
2 changed files with 36 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

53
src/components/ftbot/BacktestResultView.vue
View File

@ -1,26 +1,32 @@
<template>
<div class="container">
<div class="container-fluid">
<div>
<h3>Backtest-result for {{ backtestResult.strategy_name }}</h3>
</div>
<div class="container">
<div class="row">
<div class="col-md-6">
<b-card header="Strategy settings">
<b-table
class="table-sm"
:items="backtestResultSettings"
:fields="backtestsettingFields"
>
</b-table>
</b-card>
</div>
<div class="col-md-6">
<b-card header="Metrics">
<b-table class="table-sm" :items="backtestResultStats" :fields="backtestResultFields">
</b-table>
</b-card>
</div>
<div class="container-fluid row text-left">
<div class="col-md-6">
<b-card header="Strategy settings">
<ValuePair description="Backtesting from">{{
timestampmsUTC(backtestResult.backtest_start_ts)
}}</ValuePair>
<ValuePair description="Backtesting to">{{
timestampmsUTC(backtestResult.backtest_end_ts)
}}</ValuePair>
<b-table
class="table-sm"
borderless
:items="backtestResultSettings"
:fields="backtestsettingFields"
>
</b-table>
</b-card>
</div>
<div class="col-md-6">
<b-card header="Metrics">
<b-table class="table-sm" :items="backtestResultStats" :fields="backtestResultFields">
</b-table>
</b-card>
</div>
<b-card header="Results per Sell-reason" class="mt-2">
@ -50,6 +56,8 @@ import TradeList from '@/components/ftbot/TradeList.vue';
import { Component, Vue, Prop } from 'vue-property-decorator';
import { StrategyBacktestResult, Trade } from '@/types';
import ValuePair from '@/components/general/ValuePair.vue';
import {
timestampms,
formatPercent,
@ -58,7 +66,10 @@ import {
} from '@/shared/formatters';
@Component({
components: { TradeList },
components: {
TradeList,
ValuePair,
},
})
export default class BacktestResultView extends Vue {
@Prop({ required: true }) readonly backtestResult!: StrategyBacktestResult;
@ -174,6 +185,8 @@ export default class BacktestResultView extends Vue {
];
}
timestampmsUTC = timestampmsUTC;
get backtestResultSettings() {
// Transpose Result into readable format
return [

6
src/views/Backtesting.vue
View File

@ -167,14 +167,14 @@
</div>
</div>
</div>
<div v-if="hasBacktestResult && btFormMode == 'results'" class="text-center w-100 mt-2 row">
<div v-if="hasBacktestResult && btFormMode == 'results'" class="w-100 mt-2 row">
<BacktestResultSelect
:backtest-history="backtestHistory"
:selected-backtest-result-key="selectedBacktestResultKey"
class="col-3 align-self-start sticky-top"
@selectionChange="setBacktestResult"
/>
<BacktestResultView :backtest-result="selectedBacktestResult" class="col-8" />
<BacktestResultView :backtest-result="selectedBacktestResult" class="col-9" />
</div>
<div
v-if="hasBacktestResult && btFormMode == 'visualize-summary'"
@ -226,7 +226,7 @@ import BacktestResultView from '@/components/ftbot/BacktestResultView.vue';
import BacktestResultSelect from '@/components/ftbot/BacktestResultSelect.vue';
import CandleChartContainer from '@/components/charts/CandleChartContainer.vue';
import StrategyList from '@/components/ftbot/StrategyList.vue';
import ValuePair from '@/components/ftbot/ValuePair.vue';
import ValuePair from '@/components/general/ValuePair.vue';
import CumProfitChart from '@/components/charts/CumProfitChart.vue';
import TradesLogChart from '@/components/charts/TradesLog.vue';
import PairSummary from '@/components/ftbot/PairSummary.vue';