frequi_origin/src/components/ftbot/TradeList.vue

155 lines
4.1 KiB
Vue
Raw Normal View History

2020-05-04 18:34:59 +00:00
<template>
2020-06-02 11:05:16 +00:00
<b-card :header="title" no-body>
2020-07-11 18:00:13 +00:00
<b-card-body class="overflow-auto">
2020-05-11 18:22:23 +00:00
<b-table
class="table-sm"
:items="trades"
2020-06-04 18:06:58 +00:00
:fields="tableFields"
2020-05-27 18:24:57 +00:00
show-empty
2020-08-31 15:43:44 +00:00
:empty-text="emptyText"
:per-page="perPage"
:current-page="currentPage"
2020-08-29 08:52:33 +00:00
selectable
select-mode="single"
2020-08-31 15:43:44 +00:00
@row-contextmenu="handleContextMenuEvent"
2020-08-29 08:52:33 +00:00
@row-selected="onRowSelected"
2020-05-11 18:22:23 +00:00
>
<template v-slot:cell(actions)="row">
2020-08-31 15:43:44 +00:00
<b-button size="sm" title="Forcesell" @click="forcesellHandler(row.item)"> FS </b-button>
<b-button size="sm" title="Delete trade" @click="removeTradeHandler(row.item)">
2020-08-29 15:31:45 +00:00
RM
</b-button>
2020-05-11 18:22:23 +00:00
</template>
<template v-slot:cell(pair)="row">
<span class="mr-1" v-html="profitSymbol(row.item)"></span>
<span>
{{ row.item.pair }}
</span>
</template>
2020-05-11 18:22:23 +00:00
</b-table>
<b-pagination
v-if="!activeTrades"
v-model="currentPage"
:total-rows="rows"
:per-page="perPage"
aria-controls="my-table"
></b-pagination>
2020-06-02 11:05:16 +00:00
</b-card-body>
</b-card>
2020-05-04 18:34:59 +00:00
</template>
2020-06-29 19:14:16 +00:00
<script lang="ts">
import { Component, Vue, Prop } from 'vue-property-decorator';
import { namespace } from 'vuex-class';
2020-06-29 19:29:09 +00:00
// eslint-disable-next-line @typescript-eslint/no-unused-vars
2020-07-19 13:45:44 +00:00
import { formatPercent } from '@/shared/formatters';
2020-08-29 09:23:39 +00:00
import { Trade } from '@/types';
2020-06-29 19:14:16 +00:00
const ftbot = namespace('ftbot');
@Component({})
export default class TradeList extends Vue {
@Prop({ required: true })
trades!: Array<Trade>;
2020-06-29 19:14:16 +00:00
@Prop({ default: 'Trades' })
title!: string;
@Prop({ default: false })
activeTrades!: boolean;
@Prop({ default: 'No Trades to show.' })
emptyText!: string;
2020-06-29 19:14:16 +00:00
@ftbot.State detailTradeId?: string;
@ftbot.Mutation setDetailTrade;
2020-08-04 05:19:43 +00:00
@ftbot.Action forcesell!: (tradeid: string) => Promise<string>;
@ftbot.Action deleteTrade!: (tradeid: string) => Promise<string>;
2020-06-29 19:14:16 +00:00
currentPage = 1;
get rows(): number {
return this.trades.length;
}
perPage = this.activeTrades ? 200 : 15;
2020-06-29 19:14:16 +00:00
tableFields: Record<string, string | Function>[] = [
2020-06-29 19:14:16 +00:00
{ key: 'trade_id', label: 'ID' },
{ key: 'pair', label: 'Pair' },
{ key: 'amount', label: 'Amount' },
{ key: 'stake_amount', label: 'Stake amount' },
{ key: 'open_rate', label: 'Open rate' },
{
key: this.activeTrades ? 'current_rate' : 'close_rate',
label: this.activeTrades ? 'Current rate' : 'Close rate',
2020-05-11 18:22:23 +00:00
},
2020-06-29 19:14:16 +00:00
{
key: this.activeTrades ? 'current_profit' : 'close_profit',
2020-08-17 17:55:43 +00:00
label: this.activeTrades ? 'Current profit %' : 'Profit %',
2020-08-25 17:36:14 +00:00
formatter: (value) => formatPercent(value, 3),
2020-06-02 11:05:16 +00:00
},
2020-06-29 19:14:16 +00:00
{ key: 'open_date', label: 'Open date' },
{ key: 'close_date', label: 'Close date' },
...(this.activeTrades ? [{ key: 'actions' }] : []),
];
profitSymbol(item) {
// Red arrow / green circle
return item.close_profit < 0 || item.current_profit < 0 ? `&#x1F534;` : `&#x1F7E2;`;
}
forcesellHandler(item) {
2020-08-29 15:18:56 +00:00
this.$bvModal
.msgBoxConfirm(`Really forcesell trade ${item.trade_id} (Pair ${item.pair})?`)
.then((value: boolean) => {
if (value) {
this.forcesell(item.trade_id)
.then((xxx) => console.log(xxx))
.catch((error) => console.log(error.response));
}
});
2020-06-29 19:14:16 +00:00
}
handleContextMenuEvent(item, index, event) {
// stop browser context menu from appearing
if (!this.activeTrades) {
return;
}
event.preventDefault();
// log the selected item to the console
console.log(item);
}
2020-08-04 06:00:11 +00:00
removeTradeHandler(item) {
2020-08-29 15:18:56 +00:00
console.log(item);
this.$bvModal
.msgBoxConfirm(`Really delete trade ${item.trade_id} (Pair ${item.pair})?`)
.then((value: boolean) => {
if (value) {
this.deleteTrade(item.trade_id).catch((error) => console.log(error.response));
}
});
2020-08-04 05:19:43 +00:00
}
2020-08-29 08:52:33 +00:00
onRowSelected(items) {
// Only allow single selection mode!
if (items.length > 0) {
this.setDetailTrade(items[0]);
2020-06-29 19:14:16 +00:00
} else {
2020-08-29 08:52:33 +00:00
this.setDetailTrade(null);
2020-06-29 19:14:16 +00:00
}
}
}
2020-05-04 18:34:59 +00:00
</script>
<style scoped>
.card-body {
padding: 0 0.2em;
2020-07-11 18:00:13 +00:00
}
</style>