cancel all on toolbar / disable

src/components/chart/ChartPlaceOrder.vue

@@ -1,6 +1,6 @@
 <template>
     <toolbar-pane title="Order">
-      <template v-slot:toolbar>
+      <template #toolbar>
 <!--        <v-btn variant="flat" prepend-icon="mdi-plus" @click="co.newOrder" v-if="co.orders.length===0">New Order</v-btn>-->
         <v-btn variant="text" prepend-icon="mdi-send" @click="placeOrder"
                :color="orderColor" v-if="co.orders.length>0" :disabled="!valid">

src/components/chart/ChartStatus.vue

@@ -1,5 +1,10 @@
 <template>
   <toolbar-pane title="Status" icon="mdi-format-list-bulleted-square">
+    <template #toolbar>
+      <v-btn variant="text" v-if="s.vault" prepend-icon="mdi-delete-alert" color="red"
+             @click="cancelAll(s.vault)" :disabled="!anyOrdersOpen"
+             text="Cancel All"/>
+    </template>
     <needs-signer>
       <orders/>
     </needs-signer>
@@ -11,6 +16,21 @@
 import ToolbarPane from "@/components/chart/ToolbarPane.vue";
 import Orders from "@/components/Status.vue";
 import NeedsSigner from "@/components/NeedsSigner.vue";
+import {cancelAll} from "@/blockchain/wallet.js";
+import {useStore} from "@/store/store.js";
+import {computed} from "vue";
+import {isOpen} from "@/blockchain/orderlib.js";
+
+const s = useStore()
+
+const anyOrdersOpen = computed(()=>{
+  console.log('vo', s.vaultOrders)
+  for ( const order of Object.values(s.vaultOrders) )
+    if ( isOpen(order.state) )
+      return true
+  return false
+})
+
 </script>
 
 <style scoped lang="scss">

src/components/chart/RungBuilder.vue

@@ -72,12 +72,10 @@ const skew100 = computed( {
 
 // validity checks
 watchEffect(()=>{
-  const order = props.order
-  const builder = props.builder
-  props.builder.valid &&=
-      order && builder &&
-      builder.rungs >= 1 && valueA.value &&
-      (builder.rungs < 2 || valueB.value)
+  const rungs = props.builder.rungs
+  const prev = props.builder.valid
+  props.builder.valid = rungs >= 1 && valueA.value && (rungs < 2 || valueB.value)
+  console.log('valid?', prev, props.builder.valid, rungs, valueA.value, valueB.value)
 })