order validity checks

src/components/chart/LimitBuilder.vue

@@ -33,7 +33,7 @@
       <div v-if="rungs>1" class="mx-2 d-flex align-center">
         <v-slider v-if="rungs>1" direction="vertical" min="-100" max="100" v-model="skew100" class="no-slider-bg ml-2 mr-4" hide-details/>
         <v-text-field type="number" v-model="skew100" min="-100" max="100"
-                      density="compact" hide-details variant="outlined" label="Skew" step="10"
+                      density="compact" hide-details variant="outlined" label="Skew" step="5"
                       :color="color" :base-color="color">
           <template v-slot:prepend>
             <v-btn icon="mdi-scale-balance" variant="plain" @click="builder.skew=0; adjustShapes()" :color="color"/>
@@ -61,7 +61,7 @@
 </template>
 
 <script setup>
-import {computed, onBeforeUnmount, onMounted, onUnmounted, onUpdated, watch} from "vue";
+import {computed, onBeforeUnmount, onMounted, onUnmounted, onUpdated, watch, watchEffect} from "vue";
 import {chart} from "@/charts/chart.js";
 import {applyLine2, builderFuncs, useChartOrderStore} from "@/orderbuild.js";
 import Color from "color";
@@ -88,6 +88,7 @@ const defaultColor = computeDefaultColor()
 
 // Fields must be defined in order to be reactive
 builderDefaults(props, emit, {
+  valid: false,
   allocation: 1.0,
   start: null, // todo
   end: null, // todo
@@ -99,11 +100,22 @@ builderDefaults(props, emit, {
 })
 
 
-function buildTranches() {
-  const builder = props.builder
+// validity checks
+watchEffect(()=>{
   const order = props.order
+  const builder = props.builder
+  props.builder.valid =
+      order && builder &&
+      builder.rungs >= 1 && builder.priceA &&
+      (builder.rungs < 2 || builder.priceB)
+})
+
+
+function buildTranches() {
+  const order = props.order
+  const builder = props.builder
   const tranches = []
-  if (!builder || !order) return
+
   console.log('buildTranches', builder, order, tranches)
   const ps = prices.value
   const ws = weights.value
@@ -122,7 +134,7 @@ function buildTranches() {
 }
 
 
-// todo move this into a supercomponent
+// todo move this code and the validity check into a supercomponent
 let lastId = props.builder.id
 builderFuncs[props.builder.id] = buildTranches
 onUpdated(()=>{
@@ -228,7 +240,7 @@ function computeRange() {
   let range = 0
   const series = chart.getSeries()
   const bars = series.data().bars();
-  const final = Math.max(bars.size() - 10, 0)
+  const final = Math.max(bars.size() - 50, 0)
   let count = 0
   for (let barIndex = bars.size() - 1; barIndex >= final; barIndex--) {
     count++
@@ -247,11 +259,15 @@ const rungs = computed({
     return props.builder.rungs
   },
   set(r) {
+    if (!r) {
+      props.builder.rungs = 1
+      return
+    }
     r = Number(r)
     props.builder.rungs = r
     if ( r > 0 && props.builder.priceB === null ) {
       // convert single line to a range
-      const range = computeRange()
+      const range = 2 * computeRange()
       const mid = props.builder.priceA
       props.builder.priceA = mid - range/2
       props.builder.priceB = mid + range/2