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

pinia: Update some components to use botStore

Browse Source
This commit is contained in:
Matthias 2022-04-18 19:54:17 +02:00
parent f8d6bad055
commit 7bb2b0fe72
3 changed files with 79 additions and 59 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
src/components/ftbot/Balance.vue
View File

@ -2,7 +2,9 @@
<div>
<div class="mb-2">
<label class="mr-auto h3">Balance</label>
<b-button class="float-right" size="sm" @click="getBalance">&#x21bb;</b-button>
<b-button class="float-right" size="sm" @click="botStore.activeBot.getBalance"
>&#x21bb;</b-button
>
<b-form-checkbox
v-model="hideSmallBalances"
class="float-right"
@ -16,20 +18,20 @@
</div>
<BalanceChart v-if="balanceCurrencies" :currencies="balanceCurrencies" />
<div>
<p v-if="balance.note">
<strong>{{ balance.note }}</strong>
<p v-if="botStore.activeBot.balance.note">
<strong>{{ botStore.activeBot.balance.note }}</strong>
</p>
<b-table class="table-sm" :items="balanceCurrencies" :fields="tableFields">
<template slot="bottom-row">
<td><strong>Total</strong></td>
<td>
<span class="font-italic" title="Increase over initial capital">{{
formatPercent(balance.starting_capital_ratio)
formatPercent(botStore.activeBot.balance.starting_capital_ratio)
}}</span>
</td>
<!-- this is a computed prop that adds up all the expenses in the visible rows -->
<td>
<strong>{{ formatCurrency(balance.total) }}</strong>
<strong>{{ formatCurrency(botStore.activeBot.balance.total) }}</strong>
</td>
</template>
</b-table>
@ -41,40 +43,40 @@
import HideIcon from 'vue-material-design-icons/EyeOff.vue';
import ShowIcon from 'vue-material-design-icons/Eye.vue';
import BalanceChart from '@/components/charts/BalanceChart.vue';
import { BotStoreGetters } from '@/store/modules/ftbot';
import StoreModules from '@/store/storeSubModules';
import { formatPercent } from '@/shared/formatters';
import { defineComponent, computed, ref } from '@vue/composition-api';
import { useNamespacedActions, useNamespacedGetters } from 'vuex-composition-helpers';
import { useBotStore } from '@/stores/ftbotwrapper';
export default defineComponent({
name: 'Balance',
components: { HideIcon, ShowIcon, BalanceChart },
setup() {
const { balance, stakeCurrencyDecimals } = useNamespacedGetters(StoreModules.ftbot, [
BotStoreGetters.balance,
BotStoreGetters.stakeCurrencyDecimals,
]);
const { getBalance } = useNamespacedActions(StoreModules.ftbot, ['getBalance']);
const botStore = useBotStore();
const hideSmallBalances = ref(true);
const smallBalance = computed((): number => {
return Number((0.1 ** stakeCurrencyDecimals.value).toFixed(8));
return Number((0.1 ** botStore.activeBot.stakeCurrencyDecimals).toFixed(8));
});
const balanceCurrencies = computed(() => {
if (!hideSmallBalances.value) {
return balance.value.currencies;
return botStore.activeBot.balance.currencies;
}
return balance.value?.currencies?.filter((v) => v.est_stake >= smallBalance.value);
return botStore.activeBot.balance.currencies?.filter(
(v) => v.est_stake >= smallBalance.value,
);
});
const tableFields = computed(() => {
return [
{ key: 'currency', label: 'Currency' },
{ key: 'free', label: 'Available', formatter: 'formatCurrency' },
{ key: 'est_stake', label: `in ${balance.value.stake}`, formatter: 'formatCurrency' },
{
key: 'est_stake',
label: `in ${botStore.activeBot.balance.stake}`,
formatter: 'formatCurrency',
},
];
});
@ -83,10 +85,8 @@ export default defineComponent({
};
return {
balance,
stakeCurrencyDecimals,
botStore,
hideSmallBalances,
getBalance,
formatPercent,
smallBalance,
balanceCurrencies,

58
src/components/ftbot/BotStatus.vue
View File

@ -1,67 +1,71 @@
<template>
<div v-if="botState">
<div v-if="botStore.activeBot.botState">
<p>
Running Freqtrade <strong>{{ version }}</strong>
Running Freqtrade <strong>{{ botStore.activeBot.version }}</strong>
</p>
<p>
Running with
<strong>
{{ botState.max_open_trades }}x{{ botState.stake_amount }} {{ botState.stake_currency }}
{{ botStore.activeBot.botState.max_open_trades }}x{{
botStore.activeBot.botState.stake_amount
}}
{{ botStore.activeBot.botState.stake_currency }}
</strong>
on
<strong>{{ botState.exchange }}</strong> in
<strong>{{ botState.trading_mode || 'spot' }}</strong> markets, with Strategy
<strong>{{ botState.strategy }}</strong>
<strong>{{ botStore.activeBot.botState.exchange }}</strong> in
<strong>{{ botStore.activeBot.botState.trading_mode || 'spot' }}</strong> markets, with
Strategy
<strong>{{ botStore.activeBot.botState.strategy }}</strong>
</p>
<p>
Currently <strong>{{ botState.state }}</strong
Currently <strong>{{ botStore.activeBot.botState.state }}</strong
>,
<strong>force entry: {{ botState.force_entry_enable || botState.forcebuy_enabled }}</strong>
<strong
>force entry:
{{ botStore.activeBot.botState.force_entry_enable || botState.forcebuy_enabled }}</strong
>
</p>
<p>
<strong>{{ botState.dry_run ? 'Dry-Run' : 'Live' }}</strong>
<strong>{{ botStore.activeBot.botState.dry_run ? 'Dry-Run' : 'Live' }}</strong>
</p>
<hr />
<p>
Avg Profit {{ formatPercent(profit.profit_all_ratio_mean) }} (&sum;
{{ formatPercent(profit.profit_all_ratio_sum) }}) in {{ profit.trade_count }} Trades, with an
average duration of {{ profit.avg_duration }}. Best pair: {{ profit.best_pair }}.
Avg Profit {{ formatPercent(botStore.activeBot.profit.profit_all_ratio_mean) }} (&sum;
{{ formatPercent(botStore.activeBot.profit.profit_all_ratio_sum) }}) in
{{ botStore.activeBot.profit.trade_count }} Trades, with an average duration of
{{ botStore.activeBot.profit.avg_duration }}. Best pair:
{{ botStore.activeBot.profit.best_pair }}.
</p>
<p v-if="profit.first_trade_timestamp">
<p v-if="botStore.activeBot.profit.first_trade_timestamp">
First trade opened:
<strong><DateTimeTZ :date="profit.first_trade_timestamp" show-timezone /></strong>
<strong
><DateTimeTZ :date="botStore.activeBot.profit.first_trade_timestamp" show-timezone
/></strong>
<br />
Last trade opened:
<strong><DateTimeTZ :date="profit.latest_trade_timestamp" show-timezone /></strong>
<strong
><DateTimeTZ :date="botStore.activeBot.profit.latest_trade_timestamp" show-timezone
/></strong>
</p>
</div>
</template>
<script lang="ts">
import { BotStoreGetters } from '@/store/modules/ftbot';
import { formatPercent } from '@/shared/formatters';
import DateTimeTZ from '@/components/general/DateTimeTZ.vue';
import StoreModules from '@/store/storeSubModules';
import { defineComponent } from '@vue/composition-api';
import { useNamespacedGetters } from 'vuex-composition-helpers';
import { useBotStore } from '@/stores/ftbotwrapper';
export default defineComponent({
name: 'BotStatus',
components: { DateTimeTZ },
setup() {
const { version, profit, botState } = useNamespacedGetters(StoreModules.ftbot, [
BotStoreGetters.version,
BotStoreGetters.profit,
BotStoreGetters.botState,
]);
const botStore = useBotStore();
return {
version,
profit,
botState,
formatPercent,
botStore,
};
},
});

40
src/components/layout/NavFooter.vue
View File

@ -3,23 +3,43 @@
<!-- Only visible on xs (phone) viewport! -->
<hr class="my-0" />
<div class="d-flex flex-align-center justify-content-center">
<router-link v-if="!canRunBacktest" class="nav-link navbar-nav" to="/open_trades">
<router-link
v-if="!botStore.activeBot.canRunBacktest"
class="nav-link navbar-nav"
to="/open_trades"
>
<OpenTradesIcon />
Trades
</router-link>
<router-link v-if="!canRunBacktest" class="nav-link navbar-nav" to="/trade_history">
<router-link
v-if="!botStore.activeBot.canRunBacktest"
class="nav-link navbar-nav"
to="/trade_history"
>
<ClosedTradesIcon />
History
</router-link>
<router-link v-if="!canRunBacktest" class="nav-link navbar-nav" to="/pairlist">
<router-link
v-if="!botStore.activeBot.canRunBacktest"
class="nav-link navbar-nav"
to="/pairlist"
>
<PairListIcon />
Pairlist
</router-link>
<router-link v-if="!canRunBacktest" class="nav-link navbar-nav" to="/balance">
<router-link
v-if="!botStore.activeBot.canRunBacktest"
class="nav-link navbar-nav"
to="/balance"
>
<BalanceIcon />
Balance
</router-link>
<router-link v-if="!canRunBacktest" class="nav-link navbar-nav" to="/dashboard">
<router-link
v-if="!botStore.activeBot.canRunBacktest"
class="nav-link navbar-nav"
to="/dashboard"
>
<DashboardIcon />
Dashboard
</router-link>
@ -28,25 +48,21 @@
</template>
<script lang="ts">
import { BotStoreGetters } from '@/store/modules/ftbot';
import OpenTradesIcon from 'vue-material-design-icons/FolderOpen.vue';
import ClosedTradesIcon from 'vue-material-design-icons/FolderLock.vue';
import BalanceIcon from 'vue-material-design-icons/Bank.vue';
import PairListIcon from 'vue-material-design-icons/ViewList.vue';
import DashboardIcon from 'vue-material-design-icons/ViewDashboardOutline.vue';
import StoreModules from '@/store/storeSubModules';
import { defineComponent } from '@vue/composition-api';
import { useNamespacedGetters } from 'vuex-composition-helpers';
import { useBotStore } from '@/stores/ftbotwrapper';
export default defineComponent({
name: 'NavFooter',
components: { OpenTradesIcon, ClosedTradesIcon, BalanceIcon, PairListIcon, DashboardIcon },
setup() {
const { canRunBacktest } = useNamespacedGetters(StoreModules.ftbot, [
BotStoreGetters.canRunBacktest,
]);
const botStore = useBotStore();
return {
canRunBacktest,
botStore,
};
},
});