Improve Plotconfig layout

This commit is contained in:
Matthias 2021-06-22 21:08:03 +02:00
parent 30955c39f5
commit 65e55986a0
2 changed files with 27 additions and 9 deletions

View File

@ -91,8 +91,8 @@
<b-form-input id="idPlotConfigName" v-model="plotConfigName" :options="availableGraphTypes">
</b-form-input>
</b-form-group>
<div class="row">
<b-button class="ml-3" variant="primary" size="sm" @click="loadPlotConfig">Load</b-button>
<div class="row px-2">
<b-button class="ml-1" variant="primary" size="sm" @click="loadPlotConfig">Load</b-button>
<b-button class="ml-1" variant="primary" size="sm" @click="loadPlotConfigFromStrategy">
Load from strategy
</b-button>
@ -115,6 +115,15 @@
@click="showConfig = !showConfig"
>Show</b-button
>
<b-button
v-if="showConfig"
class="ml-1"
variant="primary"
size="sm"
title="Load configuration from text box below"
@click="resetConfig"
>Reset</b-button
>
<b-button
v-if="showConfig"
class="ml-1"
@ -125,7 +134,7 @@
>Load from String</b-button
>
</div>
<div v-if="showConfig" class="col-mb-5 ml-2 mt-2">
<div v-if="showConfig" class="col-mb-5 ml-1 mt-2">
<b-textarea
id="TextArea"
v-model="plotConfigJson"
@ -319,6 +328,10 @@ export default class PlotConfigurator extends Vue {
}
}
resetConfig() {
this.plotConfig = { ...EMPTY_PLOTCONFIG };
}
async loadPlotConfigFromStrategy() {
await this.getStrategyPlotConfig();
this.plotConfig = this.strategyPlotConfig;

View File

@ -1,6 +1,6 @@
<template>
<div class="d-flex flex-column h-100">
<div v-if="false" class="mr-auto ml-3">
<div v-if="isWebserverMode" class="mr-auto ml-3">
<!-- Currently only available in Webserver mode -->
<b-checkbox v-model="historicView">HistoricData</b-checkbox>
</div>
@ -18,7 +18,7 @@
</div>
</div>
<div class="flex-fill mx-2 mt-2">
<div class="mx-2 mt-2 pb-1 h-100">
<CandleChartContainer
:available-pairs="historicView ? pairlist : whitelist"
:historic-view="historicView"
@ -26,6 +26,7 @@
:trades="trades"
:timerange="historicView ? timerange : ''"
:strategy="historicView ? strategy : ''"
:plot-config-modal="false"
>
</CandleChartContainer>
</div>
@ -48,7 +49,7 @@ const ftbot = namespace('ftbot');
components: { CandleChartContainer, StrategySelect, TimeRangeSelect, TimeframeSelect },
})
export default class Graphs extends Vue {
historicView = true;
historicView = false;
strategy = '';
@ -58,12 +59,14 @@ export default class Graphs extends Vue {
@ftbot.State pairlist;
@ftbot.State whitelist;
@ftbot.State whitelist!: string[];
@ftbot.State trades;
@ftbot.Getter [BotStoreGetters.timeframe]!: string;
@ftbot.Getter [BotStoreGetters.isWebserverMode]!: boolean;
@ftbot.Action public getWhitelist!: () => Promise<WhitelistResponse>;
@ftbot.Action public getAvailablePairs!: (
@ -72,10 +75,12 @@ export default class Graphs extends Vue {
) => Promise<AvailablePairResult>;
mounted() {
this.getWhitelist();
if (!this.whitelist || this.whitelist.length === 0) {
this.getWhitelist();
}
// this.refresh();
this.getAvailablePairs({ timeframe: this.timeframe }).then((val) => {
console.log(val);
// console.log(val);
});
}
}