SwapOrder.inverted

src/components/Status.vue

@@ -95,12 +95,12 @@
               <div>
                 <div class="mx-3" v-if="t.marketOrder">market order</div>
                 <line-price class="mx-3" v-if="!t.marketOrder"
-                            :base="item.order.tokenIn" :quote="item.order.tokenOut"
-                            :b="t.minLine.intercept" :m="t.minLine.slope" :is-min="true"
+                            :base="item.base" :quote="item.quote"
+                            :b="t.minLine.intercept" :m="t.minLine.slope" :is-breakout="!item.minIsLimit"
                             :show-btn="true"/>
                 <line-price class="mx-3" v-if="!t.marketOrder"
-                            :base="item.order.tokenIn" :quote="item.order.tokenOut"
-                            :b="t.maxLine.intercept" :m="t.maxLine.slope" :is-min="false"
+                            :base="item.base" :quote="item.quote"
+                            :b="t.maxLine.intercept" :m="t.maxLine.slope" :is-breakout="item.minIsLimit"
                             :show-btn="true"/>
               </div>
 
@@ -181,6 +181,7 @@ const props = defineProps(['vault'])
 const vaultAddr = computed(()=>props.vault?props.vault:s.vault)
 const selected = ref([])
 
+// Draw Shapes
 watch(selected, async ()=>{
   const statusIndex = {}
   for (const order of orders.value)
@@ -335,6 +336,24 @@ const orders = computed(()=>{
       }
     }
   }
+  // elaborate
+  for (const st of result) {
+    let low, high;
+    console.log('elab', st.order)
+    const buy = st.order.tokenIn > st.order.tokenOut;
+    if (buy) {
+      low = st.order.tokenOut
+      high = st.order.tokenIn
+    }
+    else {
+      low = st.order.tokenIn
+      high = st.order.tokenOut
+    }
+    st.base = st.order.inverted ? high : low;
+    st.quote = st.order.inverted ? low : high;
+    st.minIsLimit = buy !== st.order.inverted // whether limit/breakout is flipped
+    console.log('elaborated', st.order)
+  }
   result.sort((a,b)=>b.startTime-a.startTime)
   // console.log('orders', result)
   return result