103 lines
3.0 KiB
Vue
103 lines
3.0 KiB
Vue
<template>
|
|
<order title="Ladder" subtitle="Multiple price levels" :tranches="buildTranches" :valid="validOrder">
|
|
<limit-price v-model="os.limitPrice" :required="true" label="start price" :show-price="false"/>
|
|
<limit-price v-model="os.limitPrice2" :required="true" label="end price"/>
|
|
<v-text-field label="Tranches" type="number" variant="outlined" aria-valuemin="1" min="1" max="255"
|
|
v-model="os.tranches" :rules="[validateRequired,validateTranches]">
|
|
<template v-slot:append-inner>tranches</template>
|
|
</v-text-field>
|
|
<v-text-field label='Skew' type="number" step="10" aria-valuemin="0" min="-100" max="100" variant="outlined"
|
|
v-model="skew" clearable @click:clear="skew=0" suffix="%"/>
|
|
<!-- todo deadline -->
|
|
<v-table>
|
|
<thead>
|
|
<tr><td>Fraction</td><td>Amount</td><td>Price</td></tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr v-for="(r,i) in rungsFmt">
|
|
<td>{{(100*fractions[i]).toFixed(1)}}%</td>
|
|
<td>{{(amounts[i]).toPrecision(5)}} {{os.amountToken.symbol}}</td>
|
|
<td>{{r}}</td>
|
|
</tr>
|
|
</tbody>
|
|
</v-table>
|
|
</order>
|
|
</template>
|
|
|
|
<script setup>
|
|
import {useOrderStore} from "@/store/store";
|
|
import LimitPrice from "@/components/LimitPrice.vue";
|
|
import Order from "@/components/Order.vue";
|
|
import {computed, ref} from "vue";
|
|
import {applyLimit} from "@/orderbuild.js";
|
|
import {validateRequired, validateTranches} from "@/validate.js";
|
|
import {MAX_FRACTION, newTranche} from "@/blockchain/orderlib.js";
|
|
|
|
const os = useOrderStore()
|
|
|
|
const skew = ref(0)
|
|
const rungs = computed(()=>{
|
|
if( !os.limitPrice || !os.limitPrice2 )
|
|
return []
|
|
const n = os.tranches;
|
|
const a = parseFloat(os.limitPrice);
|
|
const b = parseFloat(os.limitPrice2);
|
|
if( n < 1 || !a || !b ) return []
|
|
if( n === 1 ) return [(a+b)/2]
|
|
// num >= 2
|
|
const result = []
|
|
const delta = (b-a)/(n-1)
|
|
for( let i=0; i<n; i++ )
|
|
result.push(a+i*delta)
|
|
return result
|
|
})
|
|
const rungsFmt = computed(()=>{
|
|
return rungs.value.map((r)=>r.toPrecision(5)) // todo precisions
|
|
})
|
|
const fractions = computed(()=>{
|
|
const n = os.tranches
|
|
const s = skew.value / 100
|
|
const result = []
|
|
if( s === 1 ) {
|
|
result.push(1)
|
|
for( let i=1; i<n; i++ )
|
|
result.push(0)
|
|
}
|
|
else if( s === -1 ) {
|
|
for( let i=1; i<n; i++ )
|
|
result.push(0)
|
|
result.push(1)
|
|
}
|
|
else {
|
|
const mean = 1/n
|
|
for( let i=0; i<n; i++ )
|
|
result.push( mean * ( 1 - s * (2*i/(n-1)-1) ) )
|
|
}
|
|
return result
|
|
})
|
|
const amounts = computed( ()=>fractions.value.map((f)=>f*os.totalAmount) )
|
|
|
|
function buildTranches() {
|
|
const ts = []
|
|
const n = os.tranches
|
|
for( let i=0; i<n; i++ ) {
|
|
// todo optional deadline
|
|
const fraction = Math.min(MAX_FRACTION, Math.ceil(MAX_FRACTION * fractions.value[i]) )
|
|
const tranche = newTranche({fraction})
|
|
applyLimit(tranche, rungs.value[i])
|
|
ts.push(tranche)
|
|
}
|
|
return ts
|
|
}
|
|
|
|
function validOrder() {
|
|
return os.validOrder
|
|
}
|
|
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
@use "src/styles/vars" as *;
|
|
|
|
</style>
|