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

pinia: more components to pinia

Browse Source
This commit is contained in:
Matthias 2022-04-19 06:53:35 +02:00
parent 46402fb7aa
commit 381455ddc4
7 changed files with 90 additions and 158 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
src/components/Login.vue
View File

@ -75,12 +75,10 @@
import { useUserService } from '@/shared/userService'; import { useUserService } from '@/shared/userService';
import { AuthPayload } from '@/types'; import { AuthPayload } from '@/types';
import { MultiBotStoreGetters } from '@/store/modules/botStoreWrapper';
import StoreModules from '@/store/storeSubModules';
import { defineComponent, ref } from '@vue/composition-api'; import { defineComponent, ref } from '@vue/composition-api';
import { useActions, useNamespacedActions, useNamespacedGetters } from 'vuex-composition-helpers';
import { useRouter, useRoute } from 'vue2-helpers/vue-router'; import { useRouter, useRoute } from 'vue2-helpers/vue-router';
import { useBotStore } from '@/stores/ftbotwrapper';
const defaultURL = window.location.origin || 'http://localhost:3000'; const defaultURL = window.location.origin || 'http://localhost:3000';
@ -93,15 +91,7 @@ export default defineComponent({
setup(props, { emit }) { setup(props, { emit }) {
const router = useRouter(); const router = useRouter();
const route = useRoute(); const route = useRoute();
const { nextBotId, selectedBot } = useNamespacedGetters(StoreModules.ftbot, [ const botStore = useBotStore();
MultiBotStoreGetters.nextBotId,
MultiBotStoreGetters.selectedBot,
]);
const { addBot, selectBot, allRefreshFull } = useNamespacedActions(StoreModules.ftbot, [
'addBot',
'selectBot',
'allRefreshFull',
]);
const nameState = ref<boolean | null>(); const nameState = ref<boolean | null>();
const pwdState = ref<boolean | null>(); const pwdState = ref<boolean | null>();
@ -147,24 +137,24 @@ export default defineComponent({
return; return;
} }
errorMessage.value = ''; errorMessage.value = '';
const userService = useUserService(nextBotId.value); const userService = useUserService(botStore.nextBotId);
// Push the name to submitted names // Push the name to submitted names
userService userService
.login(auth.value) .login(auth.value)
.then(() => { .then(() => {
const botId = nextBotId.value; const botId = botStore.nextBotId;
addBot({ botStore.addBot({
botName: auth.value.botName, botName: auth.value.botName,
botId, botId,
botUrl: auth.value.url, botUrl: auth.value.url,
}); });
if (selectedBot.value === '') { if (botStore.selectedBot === '') {
console.log(`selecting bot ${botId}`); console.log(`selecting bot ${botId}`);
selectBot(botId); botStore.selectBot(botId);
} }
emitLoginResult(true); emitLoginResult(true);
allRefreshFull(); botStore.allRefreshFull();
if (props.inModal === false) { if (props.inModal === false) {
if (typeof route?.query.redirect === 'string') { if (typeof route?.query.redirect === 'string') {
const resolved = router.resolve({ path: route.query.redirect }); const resolved = router.resolve({ path: route.query.redirect });
@ -181,7 +171,7 @@ export default defineComponent({
.catch((error) => { .catch((error) => {
errorMessageCORS.value = false; errorMessageCORS.value = false;
// this.nameState = false; // this.nameState = false;
console.error(error.response); console.error(error);
if (error.response && error.response.status === 401) { if (error.response && error.response.status === 401) {
nameState.value = false; nameState.value = false;
pwdState.value = false; pwdState.value = false;

40
src/components/charts/PlotConfigurator.vue
View File

@ -123,11 +123,10 @@
import { PlotConfig, EMPTY_PLOTCONFIG, IndicatorConfig } from '@/types'; import { PlotConfig, EMPTY_PLOTCONFIG, IndicatorConfig } from '@/types';
import { getCustomPlotConfig } from '@/shared/storage'; import { getCustomPlotConfig } from '@/shared/storage';
import PlotIndicator from '@/components/charts/PlotIndicator.vue'; import PlotIndicator from '@/components/charts/PlotIndicator.vue';
import StoreModules from '@/store/storeSubModules';
import { showAlert } from '@/stores/alerts'; import { showAlert } from '@/stores/alerts';
import { defineComponent, computed, ref, watch, onMounted } from '@vue/composition-api'; import { defineComponent, computed, ref, watch, onMounted } from '@vue/composition-api';
import { useNamespacedActions, useNamespacedGetters } from 'vuex-composition-helpers'; import { useBotStore } from '@/stores/ftbotwrapper';
export default defineComponent({ export default defineComponent({
name: 'PlotConfigurator', name: 'PlotConfigurator',
@ -139,25 +138,12 @@ export default defineComponent({
}, },
emits: ['input'], emits: ['input'],
setup(props, { emit }) { setup(props, { emit }) {
const { getStrategyPlotConfig, saveCustomPlotConfig, updatePlotConfigName } = const botStore = useBotStore();
useNamespacedActions(StoreModules.ftbot, [
'getStrategyPlotConfig',
'saveCustomPlotConfig',
'updatePlotConfigName',
]);
const { strategyPlotConfig, plotConfigName } = useNamespacedGetters(StoreModules.ftbot, [
'strategyPlotConfig',
'plotConfigName',
]);
const plotConfig = ref<PlotConfig>(EMPTY_PLOTCONFIG); const plotConfig = ref<PlotConfig>(EMPTY_PLOTCONFIG);
const plotOptions = [
{ text: 'Main Plot', value: 'main_plot' },
{ text: 'Subplots', value: 'subplots' },
];
const plotConfigNameLoc = ref('default'); const plotConfigNameLoc = ref('default');
const newSubplotName = ref(''); const newSubplotName = ref('');
const selAvailableIndicator = ref('');
const selIndicatorName = ref(''); const selIndicatorName = ref('');
const addNewIndicator = ref(false); const addNewIndicator = ref(false);
const showConfig = ref(false); const showConfig = ref(false);
@ -302,9 +288,11 @@ export default defineComponent({
}; };
const loadPlotConfigFromStrategy = async () => { const loadPlotConfigFromStrategy = async () => {
try { try {
await getStrategyPlotConfig(); await botStore.activeBot.getStrategyPlotConfig();
plotConfig.value = strategyPlotConfig.value; if (botStore.activeBot.strategyPlotConfig) {
emit('input', plotConfig.value); plotConfig.value = botStore.activeBot.strategyPlotConfig;
emit('input', plotConfig.value);
}
} catch (data) { } catch (data) {
// //
showAlert('Failed to load Plot configuration from Strategy.'); showAlert('Failed to load Plot configuration from Strategy.');
@ -312,27 +300,23 @@ export default defineComponent({
}; };
const savePlotConfig = () => { const savePlotConfig = () => {
saveCustomPlotConfig({ [plotConfigNameLoc.value]: plotConfig.value }); botStore.activeBot.saveCustomPlotConfig({ [plotConfigNameLoc.value]: plotConfig.value });
}; };
watch(props.value, () => { watch(props.value, () => {
console.log('config value'); console.log('config value');
plotConfig.value = props.value; plotConfig.value = props.value;
plotConfigNameLoc.value = plotConfigName.value; plotConfigNameLoc.value = botStore.activeBot.plotConfigName;
}); });
onMounted(() => { onMounted(() => {
console.log('Config Mounted', props.value); console.log('Config Mounted', props.value);
plotConfig.value = props.value; plotConfig.value = props.value;
plotConfigNameLoc.value = plotConfigName.value; plotConfigNameLoc.value = botStore.activeBot.plotConfigName;
}); });
return { return {
saveCustomPlotConfig, botStore,
getStrategyPlotConfig,
updatePlotConfigName,
strategyPlotConfig,
plotConfigName,
addIndicator, addIndicator,
removeIndicator, removeIndicator,
addSubplot, addSubplot,

54
src/components/ftbot/BotControls.vue
View File

@ -2,7 +2,7 @@
<div> <div>
<button <button
class="btn btn-secondary btn-sm ml-1" class="btn btn-secondary btn-sm ml-1"
:disabled="!isTrading || isRunning" :disabled="!botStore.activeBot.isTrading || isRunning"
title="Start Trading" title="Start Trading"
@click="startBot()" @click="startBot()"
> >
@ -10,7 +10,7 @@
</button> </button>
<button <button
class="btn btn-secondary btn-sm ml-1" class="btn btn-secondary btn-sm ml-1"
:disabled="!isTrading || !isRunning" :disabled="!botStore.activeBot.isTrading || !isRunning"
title="Stop Trading - Also stops handling open trades." title="Stop Trading - Also stops handling open trades."
@click="handleStopBot()" @click="handleStopBot()"
> >
@ -18,7 +18,7 @@
</button> </button>
<button <button
class="btn btn-secondary btn-sm ml-1" class="btn btn-secondary btn-sm ml-1"
:disabled="!isTrading || !isRunning" :disabled="!botStore.activeBot.isTrading || !isRunning"
title="StopBuy - Stops buying, but still handles open trades" title="StopBuy - Stops buying, but still handles open trades"
@click="handleStopBuy()" @click="handleStopBuy()"
> >
@ -26,7 +26,7 @@
</button> </button>
<button <button
class="btn btn-secondary btn-sm ml-1" class="btn btn-secondary btn-sm ml-1"
:disabled="!isTrading" :disabled="!botStore.activeBot.isTrading"
title="Reload Config - reloads configuration including strategy, resetting all settings changed on the fly." title="Reload Config - reloads configuration including strategy, resetting all settings changed on the fly."
@click="handleReloadConfig()" @click="handleReloadConfig()"
> >
@ -34,23 +34,27 @@
</button> </button>
<button <button
class="btn btn-secondary btn-sm ml-1" class="btn btn-secondary btn-sm ml-1"
:disabled="!isTrading" :disabled="!botStore.activeBot.isTrading"
title="Forcesell all" title="Forcesell all"
@click="handleForceSell()" @click="handleForceSell()"
> >
<ForceSellIcon /> <ForceSellIcon />
</button> </button>
<button <button
v-if="botState && (botState.force_entry_enable || botState.forcebuy_enabled)" v-if="
botStore.activeBot.botState &&
(botStore.activeBot.botState.force_entry_enable ||
botStore.activeBot.botState.forcebuy_enabled)
"
class="btn btn-secondary btn-sm ml-1" class="btn btn-secondary btn-sm ml-1"
:disabled="!isTrading || !isRunning" :disabled="!botStore.activeBot.isTrading || !isRunning"
title="Force enter - Immediately buy an asset at an optional price. Sells are then handled according to strategy rules." title="Force enter - Immediately buy an asset at an optional price. Sells are then handled according to strategy rules."
@click="initiateForceenter" @click="initiateForceenter"
> >
<ForceBuyIcon /> <ForceBuyIcon />
</button> </button>
<button <button
v-if="isWebserverMode && false" v-if="botStore.activeBot.isWebserverMode && false"
:disabled="isTrading" :disabled="isTrading"
class="btn btn-secondary btn-sm ml-1" class="btn btn-secondary btn-sm ml-1"
title="Start Trading mode" title="Start Trading mode"
@ -64,17 +68,15 @@
<script lang="ts"> <script lang="ts">
import { ForceSellPayload } from '@/types'; import { ForceSellPayload } from '@/types';
import { BotStoreActions, BotStoreGetters } from '@/store/modules/ftbot';
import PlayIcon from 'vue-material-design-icons/Play.vue'; import PlayIcon from 'vue-material-design-icons/Play.vue';
import StopIcon from 'vue-material-design-icons/Stop.vue'; import StopIcon from 'vue-material-design-icons/Stop.vue';
import PauseIcon from 'vue-material-design-icons/Pause.vue'; import PauseIcon from 'vue-material-design-icons/Pause.vue';
import ReloadIcon from 'vue-material-design-icons/Reload.vue'; import ReloadIcon from 'vue-material-design-icons/Reload.vue';
import ForceSellIcon from 'vue-material-design-icons/CloseBoxMultiple.vue'; import ForceSellIcon from 'vue-material-design-icons/CloseBoxMultiple.vue';
import ForceBuyIcon from 'vue-material-design-icons/PlusBoxMultipleOutline.vue'; import ForceBuyIcon from 'vue-material-design-icons/PlusBoxMultipleOutline.vue';
import StoreModules from '@/store/storeSubModules';
import ForceBuyForm from './ForceBuyForm.vue'; import ForceBuyForm from './ForceBuyForm.vue';
import { defineComponent, computed, ref } from '@vue/composition-api'; import { defineComponent, computed, ref } from '@vue/composition-api';
import { useNamespacedActions, useNamespacedGetters } from 'vuex-composition-helpers'; import { useBotStore } from '@/stores/ftbotwrapper';
export default defineComponent({ export default defineComponent({
name: 'BotControls', name: 'BotControls',
@ -88,24 +90,11 @@ export default defineComponent({
ForceBuyIcon, ForceBuyIcon,
}, },
setup(_, { root }) { setup(_, { root }) {
const botStore = useBotStore();
const forcebuyShow = ref(false); const forcebuyShow = ref(false);
const { botState, isTrading, isWebserverMode } = useNamespacedGetters(StoreModules.ftbot, [
BotStoreGetters.botState,
BotStoreGetters.isTrading,
BotStoreGetters.isWebserverMode,
]);
const { startBot, stopBot, stopBuy, reloadConfig, startTrade, forcesell } =
useNamespacedActions(StoreModules.ftbot, [
BotStoreActions.startBot,
BotStoreActions.stopBot,
BotStoreActions.stopBuy,
BotStoreActions.reloadConfig,
BotStoreActions.startTrade,
BotStoreActions.forcesell,
]);
const isRunning = computed((): boolean => { const isRunning = computed((): boolean => {
return botState.value?.state === 'running'; return botStore.activeBot.botState?.state === 'running';
}); });
const initiateForceenter = () => { const initiateForceenter = () => {
@ -115,7 +104,7 @@ export default defineComponent({
const handleStopBot = () => { const handleStopBot = () => {
root.$bvModal.msgBoxConfirm('Stop Bot?').then((value: boolean) => { root.$bvModal.msgBoxConfirm('Stop Bot?').then((value: boolean) => {
if (value) { if (value) {
stopBot(); botStore.activeBot.stopBot();
} }
}); });
}; };
@ -125,7 +114,7 @@ export default defineComponent({
.msgBoxConfirm('Stop buying? Freqtrade will continue to handle open trades.') .msgBoxConfirm('Stop buying? Freqtrade will continue to handle open trades.')
.then((value: boolean) => { .then((value: boolean) => {
if (value) { if (value) {
stopBuy(); botStore.activeBot.stopBuy();
} }
}); });
}; };
@ -133,7 +122,7 @@ export default defineComponent({
const handleReloadConfig = () => { const handleReloadConfig = () => {
root.$bvModal.msgBoxConfirm('Reload configuration?').then((value: boolean) => { root.$bvModal.msgBoxConfirm('Reload configuration?').then((value: boolean) => {
if (value) { if (value) {
reloadConfig(); botStore.activeBot.reloadConfig();
} }
}); });
}; };
@ -145,7 +134,7 @@ export default defineComponent({
tradeid: 'all', tradeid: 'all',
// TODO: support ordertype (?) // TODO: support ordertype (?)
}; };
forcesell(payload); botStore.activeBot.forcesell(payload);
} }
}); });
}; };
@ -156,11 +145,8 @@ export default defineComponent({
handleReloadConfig, handleReloadConfig,
handleForceSell, handleForceSell,
forcebuyShow, forcebuyShow,
isTrading, botStore,
isRunning, isRunning,
botState,
isWebserverMode,
startBot,
}; };
}, },
}); });

19
src/components/ftbot/CustomTradeList.vue
View File

@ -36,10 +36,9 @@
<script lang="ts"> <script lang="ts">
import { formatPrice } from '@/shared/formatters'; import { formatPrice } from '@/shared/formatters';
import { MultiDeletePayload, MultiForcesellPayload, Trade } from '@/types'; import { MultiDeletePayload, MultiForcesellPayload, Trade } from '@/types';
import StoreModules from '@/store/storeSubModules';
import CustomTradeListEntry from '@/components/ftbot/CustomTradeListEntry.vue'; import CustomTradeListEntry from '@/components/ftbot/CustomTradeListEntry.vue';
import { defineComponent, computed, ref } from '@vue/composition-api'; import { defineComponent, computed, ref } from '@vue/composition-api';
import { useNamespacedActions } from 'vuex-composition-helpers'; import { useBotStore } from '@/stores/ftbotwrapper';
export default defineComponent({ export default defineComponent({
name: 'CustomTradeList', name: 'CustomTradeList',
@ -57,10 +56,7 @@ export default defineComponent({
stakeCurrencyDecimals: { default: 3, type: Number }, stakeCurrencyDecimals: { default: 3, type: Number },
}, },
setup(props, { root }) { setup(props, { root }) {
const { setDetailTrade, forceSellMulti, deleteTradeMulti } = useNamespacedActions( const botStore = useBotStore();
StoreModules.ftbot,
['setDetailTrade', 'forceSellMulti', 'deleteTradeMulti'],
);
const currentPage = ref(1); const currentPage = ref(1);
const filterText = ref(''); const filterText = ref('');
const perPage = props.activeTrades ? 200 : 25; const perPage = props.activeTrades ? 200 : 25;
@ -85,7 +81,8 @@ export default defineComponent({
if (ordertype) { if (ordertype) {
payload.ordertype = ordertype; payload.ordertype = ordertype;
} }
forceSellMulti(payload) botStore
.forceSellMulti(payload)
.then((xxx) => console.log(xxx)) .then((xxx) => console.log(xxx))
.catch((error) => console.log(error.response)); .catch((error) => console.log(error.response));
} }
@ -112,12 +109,12 @@ export default defineComponent({
tradeid: String(item.trade_id), tradeid: String(item.trade_id),
botId: item.botId, botId: item.botId,
}; };
deleteTradeMulti(payload).catch((error) => console.log(error.response)); botStore.deleteTradeMulti(payload).catch((error) => console.log(error.response));
} }
}); });
}; };
const tradeClick = (trade) => { const tradeClick = (trade) => {
setDetailTrade(trade); botStore.activeBot.setDetailTrade(trade);
}; };
return { return {
@ -130,9 +127,7 @@ export default defineComponent({
handleContextMenuEvent, handleContextMenuEvent,
removeTradeHandler, removeTradeHandler,
tradeClick, tradeClick,
setDetailTrade, botStore,
forceSellMulti,
deleteTradeMulti,
rows, rows,
}; };
}, },

44
src/components/ftbot/ForceBuyForm.vue
View File

@ -10,7 +10,7 @@
> >
<form ref="form" @submit.stop.prevent="handleSubmit"> <form ref="form" @submit.stop.prevent="handleSubmit">
<b-form-group <b-form-group
v-if="botApiVersion >= 2.13 && shortAllowed" v-if="botStore.activeBot.botApiVersion >= 2.13 && botStore.activeBot.shortAllowed"
label="Order direction (Long or Short)" label="Order direction (Long or Short)"
label-for="order-direction" label-for="order-direction"
invalid-feedback="Stake-amount must be empty or a positive number" invalid-feedback="Stake-amount must be empty or a positive number"
@ -45,8 +45,8 @@
></b-form-input> ></b-form-input>
</b-form-group> </b-form-group>
<b-form-group <b-form-group
v-if="botApiVersion > 1.12" v-if="botStore.activeBot.botApiVersion > 1.12"
:label="`*Stake-amount in ${stakeCurrency} [optional]`" :label="`*Stake-amount in ${botStore.activeBot.stakeCurrency} [optional]`"
label-for="stake-input" label-for="stake-input"
invalid-feedback="Stake-amount must be empty or a positive number" invalid-feedback="Stake-amount must be empty or a positive number"
> >
@ -59,7 +59,7 @@
></b-form-input> ></b-form-input>
</b-form-group> </b-form-group>
<b-form-group <b-form-group
v-if="botApiVersion > 1.1" v-if="botStore.activeBot.botApiVersion > 1.1"
label="*OrderType" label="*OrderType"
label-for="ordertype-input" label-for="ordertype-input"
invalid-feedback="OrderType" invalid-feedback="OrderType"
@ -79,26 +79,16 @@
</template> </template>
<script lang="ts"> <script lang="ts">
import { BotStoreGetters } from '@/store/modules/ftbot'; import { useBotStore } from '@/stores/ftbotwrapper';
import StoreModules from '@/store/storeSubModules';
import { ForceEnterPayload, OrderSides } from '@/types'; import { ForceEnterPayload, OrderSides } from '@/types';
import { defineComponent, ref, nextTick } from '@vue/composition-api'; import { defineComponent, ref, nextTick } from '@vue/composition-api';
import { useNamespacedActions, useNamespacedGetters } from 'vuex-composition-helpers';
export default defineComponent({ export default defineComponent({
name: 'ForceBuyForm', name: 'ForceBuyForm',
setup(_, { root }) { setup(_, { root }) {
const { botState, shortAllowed, botApiVersion, stakeCurrency } = useNamespacedGetters( const botStore = useBotStore();
StoreModules.ftbot,
[
BotStoreGetters.botState,
BotStoreGetters.shortAllowed,
BotStoreGetters.botApiVersion,
BotStoreGetters.stakeCurrency,
],
);
const { forcebuy } = useNamespacedActions(StoreModules.ftbot, ['forcebuy']);
const form = ref<HTMLFormElement>(); const form = ref<HTMLFormElement>();
const pair = ref(''); const pair = ref('');
const price = ref<number | null>(null); const price = ref<number | null>(null);
@ -128,10 +118,10 @@ export default defineComponent({
if (stakeAmount.value) { if (stakeAmount.value) {
payload.stakeamount = stakeAmount.value; payload.stakeamount = stakeAmount.value;
} }
if (botApiVersion.value >= 2.13) { if (botStore.activeBot.botApiVersion >= 2.13) {
payload.side = orderSide.value; payload.side = orderSide.value;
} }
forcebuy(payload); botStore.activeBot.forcebuy(payload);
nextTick(() => { nextTick(() => {
root.$bvModal.hide('forcebuy-modal'); root.$bvModal.hide('forcebuy-modal');
}); });
@ -141,12 +131,13 @@ export default defineComponent({
pair.value = ''; pair.value = '';
price.value = null; price.value = null;
stakeAmount.value = null; stakeAmount.value = null;
if (botApiVersion.value > 1.1) { if (botStore.activeBot.botApiVersion > 1.1) {
ordertype.value = ordertype.value =
botState.value?.order_types?.forcebuy || botStore.activeBot.botState?.order_types?.forcebuy ||
botState.value?.order_types?.force_entry || botStore.activeBot.botState?.order_types?.force_entry ||
botState.value?.order_types?.buy || botStore.activeBot.botState?.order_types?.buy ||
botState.value?.order_types?.entry; botStore.activeBot.botState?.order_types?.entry ||
'limit';
} }
}; };
@ -158,10 +149,7 @@ export default defineComponent({
}; };
return { return {
handleSubmit, handleSubmit,
botState, botStore,
shortAllowed,
botApiVersion,
stakeCurrency,
form, form,
handleBuy, handleBuy,
resetForm, resetForm,

8
src/stores/ftbotwrapper.ts
View File

@ -35,6 +35,14 @@ export const useBotStore = defineStore('wrapper', {
activeBot: (state) => activeBot: (state) =>
state.botStores[state.selectedBot] as ReturnType<typeof createBotSubStore>, state.botStores[state.selectedBot] as ReturnType<typeof createBotSubStore>,
selectedBotObj: (state) => state.availableBots[state.selectedBot], selectedBotObj: (state) => state.availableBots[state.selectedBot],
nextBotId: (state) => {
let botCount = Object.keys(state.availableBots).length;
while (`ftbot.${botCount}` in state.availableBots) {
botCount += 1;
}
return `ftbot.${botCount}`;
},
}, },
actions: { actions: {
selectBot(botId: string) { selectBot(botId: string) {

55
src/views/TradesList.vue
View File

@ -8,37 +8,41 @@
empty-text="Currently no open trades." empty-text="Currently no open trades."
/> --> /> -->
<CustomTradeList <CustomTradeList
v-if="!history && !detailTradeId" v-if="!history && !botStore.activeBot.detailTradeId"
:trades="openTrades" :trades="botStore.activeBot.openTrades"
title="Open trades" title="Open trades"
:active-trades="true" :active-trades="true"
:stake-currency-decimals="stakeCurrencyDecimals" :stake-currency-decimals="botStore.activeBot.stakeCurrencyDecimals"
empty-text="No open Trades." empty-text="No open Trades."
/> />
<CustomTradeList <CustomTradeList
v-if="history && !detailTradeId" v-if="history && !botStore.activeBot.detailTradeId"
:trades="closedTrades" :trades="botStore.activeBot.closedTrades"
title="Trade history" title="Trade history"
:stake-currency-decimals="stakeCurrencyDecimals" :stake-currency-decimals="botStore.activeBot.stakeCurrencyDecimals"
empty-text="No closed trades so far." empty-text="No closed trades so far."
/> />
<div v-if="detailTradeId" class="d-flex flex-column"> <div v-if="botStore.activeBot.detailTradeId" class="d-flex flex-column">
<b-button size="sm" class="align-self-start mt-1 ml-1" @click="setDetailTrade(null)" <b-button
size="sm"
class="align-self-start mt-1 ml-1"
@click="botStore.activeBot.setDetailTrade(null)"
><BackIcon /> Back</b-button ><BackIcon /> Back</b-button
> >
<TradeDetail :trade="tradeDetail" :stake-currency="stakeCurrency" /> <TradeDetail
:trade="botStore.activeBot.tradeDetail"
:stake-currency="botStore.activeBot.stakeCurrency"
/>
</div> </div>
</div> </div>
</template> </template>
<script lang="ts"> <script lang="ts">
import { BotStoreActions, BotStoreGetters } from '@/store/modules/ftbot';
import StoreModules from '@/store/storeSubModules';
import CustomTradeList from '@/components/ftbot/CustomTradeList.vue'; import CustomTradeList from '@/components/ftbot/CustomTradeList.vue';
import TradeDetail from '@/components/ftbot/TradeDetail.vue'; import TradeDetail from '@/components/ftbot/TradeDetail.vue';
import BackIcon from 'vue-material-design-icons/ArrowLeft.vue'; import BackIcon from 'vue-material-design-icons/ArrowLeft.vue';
import { defineComponent } from '@vue/composition-api'; import { defineComponent } from '@vue/composition-api';
import { useNamespacedActions, useNamespacedGetters } from 'vuex-composition-helpers'; import { useBotStore } from '@/stores/ftbotwrapper';
export default defineComponent({ export default defineComponent({
name: 'TradesList', name: 'TradesList',
@ -51,33 +55,10 @@ export default defineComponent({
history: { default: false, type: Boolean }, history: { default: false, type: Boolean },
}, },
setup() { setup() {
const { const botStore = useBotStore();
openTrades,
closedTrades,
stakeCurrencyDecimals,
stakeCurrency,
detailTradeId,
tradeDetail,
} = useNamespacedGetters(StoreModules.ftbot, [
BotStoreGetters.openTrades,
BotStoreGetters.closedTrades,
BotStoreGetters.stakeCurrencyDecimals,
BotStoreGetters.stakeCurrency,
BotStoreGetters.detailTradeId,
BotStoreGetters.tradeDetail,
]);
const { setDetailTrade } = useNamespacedActions(StoreModules.ftbot, [
BotStoreActions.setDetailTrade,
]);
return { return {
openTrades, botStore,
closedTrades,
stakeCurrencyDecimals,
stakeCurrency,
detailTradeId,
tradeDetail,
setDetailTrade,
}; };
}, },
}); });