Update DailyStats in dashboard

This commit is contained in:
Matthias 2021-09-18 19:45:26 +02:00
parent dd44c54c6a
commit 7685703b8c
3 changed files with 55 additions and 13 deletions

View File

@ -15,9 +15,10 @@
<script lang="ts"> <script lang="ts">
import Vue from 'vue'; import Vue from 'vue';
import { mapActions, mapState } from 'vuex'; import { mapActions, mapGetters } from 'vuex';
import DailyChart from '@/components/charts/DailyChart.vue'; import DailyChart from '@/components/charts/DailyChart.vue';
import { formatPrice } from '@/shared/formatters'; import { formatPrice } from '@/shared/formatters';
import { BotStoreGetters } from '@/store/modules/ftbot';
export default Vue.extend({ export default Vue.extend({
name: 'DailyStats', name: 'DailyStats',
@ -25,7 +26,7 @@ export default Vue.extend({
DailyChart, DailyChart,
}, },
computed: { computed: {
...mapState('ftbot', ['dailyStats']), ...mapGetters('ftbot', [BotStoreGetters.dailyStats]),
dailyFields() { dailyFields() {
return [ return [
{ key: 'date', label: 'Day' }, { key: 'date', label: 'Day' },

View File

@ -1,4 +1,11 @@
import { BotDescriptor, BotDescriptors, Trade } from '@/types'; import {
BotDescriptor,
BotDescriptors,
DailyPayload,
DailyRecord,
DailyReturnValue,
Trade,
} from '@/types';
import { AxiosInstance } from 'axios'; import { AxiosInstance } from 'axios';
import { BotStoreActions, BotStoreGetters, createBotSubStore } from './ftbot'; import { BotStoreActions, BotStoreGetters, createBotSubStore } from './ftbot';
@ -22,6 +29,7 @@ export enum MultiBotStoreGetters {
allAvailableBotsList = 'allAvailableBotsList', allAvailableBotsList = 'allAvailableBotsList',
allTradesAllBots = 'allTradesAllBots', allTradesAllBots = 'allTradesAllBots',
allOpenTradesAllBots = 'allOpenTradesAllBots', allOpenTradesAllBots = 'allOpenTradesAllBots',
allDailyStatsAllBots = 'allDailyStatsAllBots',
// Automatically created entries // Automatically created entries
allIsBotOnline = 'allIsBotOnline', allIsBotOnline = 'allIsBotOnline',
allAutoRefresh = 'allAutoRefresh', allAutoRefresh = 'allAutoRefresh',
@ -102,6 +110,32 @@ export default function createBotStore(store) {
}); });
return resp; return resp;
}, },
[MultiBotStoreGetters.allDailyStatsAllBots](state: FTMultiBotState, getters): DailyReturnValue {
const resp: Record<string, DailyRecord> = {};
getters.allAvailableBotsList.forEach((botId) => {
const x = getters[`${botId}/${BotStoreGetters.dailyStats}`]?.data?.forEach((d) => {
if (!resp[d.date]) {
resp[d.date] = { ...d };
} else {
// eslint-disable-next-line @typescript-eslint/camelcase
resp[d.date].abs_profit += d.abs_profit;
// eslint-disable-next-line @typescript-eslint/camelcase
resp[d.date].fiat_value += d.fiat_value;
// eslint-disable-next-line @typescript-eslint/camelcase
resp[d.date].trade_count += d.trade_count;
}
});
});
const dailyReturn: DailyReturnValue = {
// eslint-disable-next-line @typescript-eslint/camelcase
stake_currency: 'USDT',
// eslint-disable-next-line @typescript-eslint/camelcase
fiat_display_currency: 'USD',
data: Object.values(resp),
};
return dailyReturn;
},
}; };
// Autocreate getters from botStores // Autocreate getters from botStores
Object.keys(BotStoreGetters).forEach((e) => { Object.keys(BotStoreGetters).forEach((e) => {
@ -113,7 +147,7 @@ export default function createBotStore(store) {
// Create selected getters // Create selected getters
createAllGetters.forEach((e: string) => { createAllGetters.forEach((e: string) => {
const getterName = `all${e.charAt(0).toUpperCase() + e.slice(1)}`; const getterName = `all${e.charAt(0).toUpperCase() + e.slice(1)}`;
console.log('creatin ', e, getterName); console.log('creating getter', e, getterName);
getters[getterName] = (state, getters) => { getters[getterName] = (state, getters) => {
const result = {}; const result = {};
@ -267,6 +301,11 @@ export default function createBotStore(store) {
dispatch(`${e}/getState`); dispatch(`${e}/getState`);
}); });
}, },
allGetDaily({ getters, dispatch }, payload: DailyPayload) {
getters.allAvailableBotsList.forEach((e) => {
dispatch(`${e}/getDaily`, payload);
});
},
}; };
// Autocreate Actions from botstores // Autocreate Actions from botstores
Object.keys(BotStoreActions).forEach((e) => { Object.keys(BotStoreActions).forEach((e) => {

View File

@ -23,8 +23,12 @@
:min-h="4" :min-h="4"
drag-allow-from=".drag-header" drag-allow-from=".drag-header"
> >
<DraggableContainer header="Daily Profit"> <DraggableContainer :header="`Daily Profit ${botCount > 1 ? 'combined' : ''}`">
<DailyChart v-if="dailyStats.data" :daily-stats="dailyStats" :show-title="false" /> <DailyChart
v-if="allDailyStatsAllBots"
:daily-stats="allDailyStatsAllBots"
:show-title="false"
/>
</DraggableContainer> </DraggableContainer>
</GridItem> </GridItem>
<GridItem <GridItem
@ -109,7 +113,6 @@ import {
import { import {
Trade, Trade,
DailyReturnValue, DailyReturnValue,
BalanceInterface,
ProfitInterface, ProfitInterface,
DailyPayload, DailyPayload,
BotState, BotState,
@ -136,16 +139,16 @@ const layoutNs = namespace('layout');
export default class Dashboard extends Vue { export default class Dashboard extends Vue {
@ftbot.Getter closedTrades!: Trade[]; @ftbot.Getter closedTrades!: Trade[];
@ftbot.Getter [MultiBotStoreGetters.botCount]!: number;
@ftbot.Getter [MultiBotStoreGetters.allOpenTradesAllBots]!: Trade[]; @ftbot.Getter [MultiBotStoreGetters.allOpenTradesAllBots]!: Trade[];
@ftbot.Getter [MultiBotStoreGetters.allTradesAllBots]!: ClosedTrade[]; @ftbot.Getter [MultiBotStoreGetters.allTradesAllBots]!: ClosedTrade[];
@ftbot.Getter [BotStoreGetters.dailyStats]!: DailyReturnValue; @ftbot.Getter [MultiBotStoreGetters.allDailyStatsAllBots]!: Record<string, DailyReturnValue>;
@ftbot.Getter [BotStoreGetters.openTrades]!: Array<Trade>; @ftbot.Getter [BotStoreGetters.openTrades]!: Array<Trade>;
@ftbot.Getter [BotStoreGetters.balance]!: BalanceInterface;
@ftbot.Getter [BotStoreGetters.botState]?: BotState; @ftbot.Getter [BotStoreGetters.botState]?: BotState;
@ftbot.Getter [BotStoreGetters.profit]!: ProfitInterface; @ftbot.Getter [BotStoreGetters.profit]!: ProfitInterface;
@ -155,7 +158,7 @@ export default class Dashboard extends Vue {
@ftbot.Action getPerformance; @ftbot.Action getPerformance;
// eslint-disable-next-line @typescript-eslint/no-unused-vars // eslint-disable-next-line @typescript-eslint/no-unused-vars
@ftbot.Action getDaily!: (payload?: DailyPayload) => void; @ftbot.Action allGetDaily!: (payload?: DailyPayload) => void;
@ftbot.Action getTrades; @ftbot.Action getTrades;
@ -232,10 +235,9 @@ export default class Dashboard extends Vue {
} }
mounted() { mounted() {
this.getDaily({ timescale: 30 }); this.allGetDaily({ timescale: 30 });
this.getTrades(); this.getTrades();
this.getOpenTrades(); this.getOpenTrades();
this.getBalance();
this.getPerformance(); this.getPerformance();
this.getProfit(); this.getProfit();
this.localGridLayout = [...this.getDashboardLayoutSm]; this.localGridLayout = [...this.getDashboardLayoutSm];