52 lines
1.9 KiB
Vue
52 lines
1.9 KiB
Vue
<template>
|
|
<div class="d-inline-flex">
|
|
<btn icon="mdi-plus" color="green" @click="show=true">New Order</btn>
|
|
<v-dialog v-model="show" width="auto">
|
|
<v-card>
|
|
<v-card-item class="d-flex">
|
|
|
|
<v-card variant="elevated"
|
|
prepend-icon="mdi-clock-outline" title="DCA"
|
|
subtitle="Spread order across time"
|
|
text="The DCA order gives you a Dollar Cost Average (DCA) or a Time Weighted Average
|
|
Price (TWAP) by splitting the order amount into multiple parts executed at regular time intervals.">
|
|
<v-card-actions><btn icon="mdi-clock-outline" text="DCA" @click="$router.push('/twap')"/></v-card-actions>
|
|
</v-card>
|
|
|
|
<v-card variant="elevated"
|
|
prepend-icon="mdi-menu" title="Ladder"
|
|
subtitle="Multiple price levels"
|
|
text="The Ladder order helps catch wicks and other reversals by splitting the order amount across
|
|
multiple price levels. The amounts may be weighted towards one end of the ladder, to either have
|
|
a larger filled amount on a shallow reversal, or a larger amount at a better price that might not
|
|
be reached.">
|
|
<v-card-actions><btn icon="mdi-menu" text="Ladder" @click="$router.push('/ladder')"/></v-card-actions>
|
|
</v-card>
|
|
|
|
</v-card-item>
|
|
<v-card-item class="mb-3"><v-btn variant="outlined" prepend-icon="mdi-cancel" color="red" @click="show=false">Cancel</v-btn></v-card-item>
|
|
</v-card>
|
|
</v-dialog>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import {useStore} from "@/store/store";
|
|
import {ref} from "vue";
|
|
import Btn from "@/components/Btn.vue";
|
|
|
|
const s = useStore()
|
|
const show = ref(false)
|
|
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
@use "src/styles/vars" as *;
|
|
|
|
.v-card .v-card {
|
|
width: 20em;
|
|
margin: 2em;
|
|
}
|
|
|
|
</style>
|