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

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 { AuthPayload } from '@/types';
import { MultiBotStoreGetters } from '@/store/modules/botStoreWrapper';
import StoreModules from '@/store/storeSubModules';
import { defineComponent, ref } from '@vue/composition-api';
import { useActions, useNamespacedActions, useNamespacedGetters } from 'vuex-composition-helpers';
import { useRouter, useRoute } from 'vue2-helpers/vue-router';
import { useBotStore } from '@/stores/ftbotwrapper';
const defaultURL = window.location.origin || 'http://localhost:3000';
@ -93,15 +91,7 @@ export default defineComponent({
setup(props, { emit }) {
const router = useRouter();
const route = useRoute();
const { nextBotId, selectedBot } = useNamespacedGetters(StoreModules.ftbot, [
MultiBotStoreGetters.nextBotId,
MultiBotStoreGetters.selectedBot,
]);
const { addBot, selectBot, allRefreshFull } = useNamespacedActions(StoreModules.ftbot, [
'addBot',
'selectBot',
'allRefreshFull',
]);
const botStore = useBotStore();
const nameState = ref<boolean | null>();
const pwdState = ref<boolean | null>();
@ -147,24 +137,24 @@ export default defineComponent({
return;
}
errorMessage.value = '';
const userService = useUserService(nextBotId.value);
const userService = useUserService(botStore.nextBotId);
// Push the name to submitted names
userService
.login(auth.value)
.then(() => {
const botId = nextBotId.value;
addBot({
const botId = botStore.nextBotId;
botStore.addBot({
botName: auth.value.botName,
botId,
botUrl: auth.value.url,
});
if (selectedBot.value === '') {
if (botStore.selectedBot === '') {
console.log(`selecting bot ${botId}`);
selectBot(botId);
botStore.selectBot(botId);
}
emitLoginResult(true);
allRefreshFull();
botStore.allRefreshFull();
if (props.inModal === false) {
if (typeof route?.query.redirect === 'string') {
const resolved = router.resolve({ path: route.query.redirect });
@ -181,7 +171,7 @@ export default defineComponent({
.catch((error) => {
errorMessageCORS.value = false;
// this.nameState = false;
console.error(error.response);
console.error(error);
if (error.response && error.response.status === 401) {
nameState.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 { getCustomPlotConfig } from '@/shared/storage';
import PlotIndicator from '@/components/charts/PlotIndicator.vue';
import StoreModules from '@/store/storeSubModules';
import { showAlert } from '@/stores/alerts';
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({
name: 'PlotConfigurator',
@ -139,25 +138,12 @@ export default defineComponent({
},
emits: ['input'],
setup(props, { emit }) {
const { getStrategyPlotConfig, saveCustomPlotConfig, updatePlotConfigName } =
useNamespacedActions(StoreModules.ftbot, [
'getStrategyPlotConfig',
'saveCustomPlotConfig',
'updatePlotConfigName',
]);
const { strategyPlotConfig, plotConfigName } = useNamespacedGetters(StoreModules.ftbot, [
'strategyPlotConfig',
'plotConfigName',
]);
const botStore = useBotStore();
const plotConfig = ref<PlotConfig>(EMPTY_PLOTCONFIG);
const plotOptions = [
{ text: 'Main Plot', value: 'main_plot' },
{ text: 'Subplots', value: 'subplots' },
];
const plotConfigNameLoc = ref('default');
const newSubplotName = ref('');
const selAvailableIndicator = ref('');
const selIndicatorName = ref('');
const addNewIndicator = ref(false);
const showConfig = ref(false);
@ -302,9 +288,11 @@ export default defineComponent({
};
const loadPlotConfigFromStrategy = async () => {
try {
await getStrategyPlotConfig();
plotConfig.value = strategyPlotConfig.value;
emit('input', plotConfig.value);
await botStore.activeBot.getStrategyPlotConfig();
if (botStore.activeBot.strategyPlotConfig) {
plotConfig.value = botStore.activeBot.strategyPlotConfig;
emit('input', plotConfig.value);
}
} catch (data) {
//
showAlert('Failed to load Plot configuration from Strategy.');
@ -312,27 +300,23 @@ export default defineComponent({
};
const savePlotConfig = () => {
saveCustomPlotConfig({ [plotConfigNameLoc.value]: plotConfig.value });
botStore.activeBot.saveCustomPlotConfig({ [plotConfigNameLoc.value]: plotConfig.value });
};
watch(props.value, () => {
console.log('config value');
plotConfig.value = props.value;
plotConfigNameLoc.value = plotConfigName.value;
plotConfigNameLoc.value = botStore.activeBot.plotConfigName;
});
onMounted(() => {
console.log('Config Mounted', props.value);
plotConfig.value = props.value;
plotConfigNameLoc.value = plotConfigName.value;
plotConfigNameLoc.value = botStore.activeBot.plotConfigName;
});
return {
saveCustomPlotConfig,
getStrategyPlotConfig,
updatePlotConfigName,
strategyPlotConfig,
plotConfigName,
botStore,
addIndicator,
removeIndicator,
addSubplot,

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

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

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

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

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

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

8
src/stores/ftbotwrapper.ts
View File

@ -35,6 +35,14 @@ export const useBotStore = defineStore('wrapper', {
activeBot: (state) =>
state.botStores[state.selectedBot] as ReturnType<typeof createBotSubStore>,
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: {
selectBot(botId: string) {

55
src/views/TradesList.vue
View File

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