57 lines
1.9 KiB
Vue
57 lines
1.9 KiB
Vue
<template>
|
|
<!-- todo slippage
|
|
<row-bar :color="builder.color">
|
|
<div class="bg-grey-lighten-1" style="width:1em"> </div>
|
|
<div style="min-width: 3em; font-size: larger" class="align-self-start ma-3">Market Order</div>
|
|
<div>
|
|
<v-text-field type="number" v-model="builder.slippage"
|
|
density="compact" hide-details class="mx-1 my-2" variant="outlined"
|
|
label="Max Slippage" min="0" max="100" step="0.01"
|
|
style="width: 9em;"
|
|
clearable
|
|
>
|
|
<template v-slot:append-inner>%</template>
|
|
</v-text-field>
|
|
</div>
|
|
</row-bar>
|
|
-->
|
|
</template>
|
|
|
|
<script setup>
|
|
import {builderFuncs, useChartOrderStore} from "@/orderbuild.js";
|
|
import {builderDefaults} from "@/misc.js";
|
|
import {useOrderStore} from "@/store/store.js";
|
|
import {computed, onMounted, onUnmounted} from "vue";
|
|
import RowBar from "@/components/chart/RowBar.vue";
|
|
import {newTranche} from "@/blockchain/orderlib.js";
|
|
|
|
const co = useChartOrderStore()
|
|
const props = defineProps(['order', 'builder'])
|
|
const emit = defineEmits(['update:builder'])
|
|
|
|
// Fields must be defined in order to be reactive
|
|
builderDefaults(props, emit, {valid: true, slippage: 0.10,})
|
|
const slippage = computed({
|
|
get() {console.log('slip',props.builder,props.builder.slippage); return props.builder.slippage},
|
|
set(v) {props.builder.slippage=v; emit('update:builder', props.builder)}
|
|
})
|
|
|
|
function buildTranches() {
|
|
return [newTranche({slippage: slippage.value})]
|
|
}
|
|
|
|
onMounted(() => builderFuncs[props.builder.id] = buildTranches)
|
|
onUnmounted(() => delete builderFuncs[props.builder.id])
|
|
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
:deep(.v-slider.v-input--vertical > .v-input__control) {
|
|
min-height: 5em !important;
|
|
}
|
|
//:deep(.v-slider.no-slider-bg .v-slider-track__fill) {
|
|
// background-color: inherit !important;
|
|
//}
|
|
</style>
|
|
|