Files
web/src/components/LimitPrice.vue
2023-12-16 16:54:05 -04:00

46 lines
1.5 KiB
Vue

<template>
<v-text-field v-model="mv" :label="getLabel" type="number"
variant="outlined" aria-valuemin="0" min="0"
:clearable="!required && clearable" :rules="rules" v-auto-select>
<template v-slot:append-inner>
<v-btn variant="outlined" @click="os.inverted=!os.inverted">
{{ os.pairSymbol }}
</v-btn>
</template>
<template v-if="showPrice" #details style="flex-direction: column-reverse">
<div>
Current price&nbsp;<route-price :inverted="routeInverted(os.route)" :route="os.route" class="text-green"/>
</div>
</template>
</v-text-field>
</template>
<script setup>
import {useOrderStore, useStore} from "@/store/store";
import {routeInverted} from "@/misc.js";
import RoutePrice from "@/components/RoutePrice.vue";
import {validateAmount, validateRequired} from "@/validate.js";
import {computed} from "vue";
// noinspection ES6UnusedImports
import {vAutoSelect} from "@/misc.js";
const os = useOrderStore()
const props = defineProps({
modelValue: {required: true},
required: {default: false},
label: {default: null},
showPrice: {default: true},
clearable: {default: true},
})
const emit = defineEmits(['update:modelValue'])
const mv = computed({
get() {return props.modelValue},
set(v) {emit('update:modelValue', v)}
})
const rules = computed(()=>props.required ? [validateAmount, validateRequired] : [validateAmount])
const getLabel = computed(()=>props.label !== null ? props.label : (os.limitIsMinimum?'Minimum':'Maximum') +' Price')
</script>