interactive horizontal limit lines

src/components/chart/Toolbar.vue

@@ -0,0 +1,49 @@
+<template>
+  <div class="d-flex">
+    <span class="arrow align-self-start"><v-icon icon="mdi-arrow-up-bold" color="green"/></span>
+    <span class="logo">dexorder</span>
+    <v-chip text="ALPHA" size='x-small' color="red" class="align-self-start" variant="text"/>
+    <v-btn variant="flat" prepend-icon="mdi-clock-outline" @click="build('DCABuilder')">DCA</v-btn>
+    <v-btn variant="flat" prepend-icon="mdi-ray-vertex" @click="build('LimitBuilder')">Limit</v-btn>
+    <v-btn variant="flat" prepend-icon="mdi-vector-line">Line</v-btn>
+    <v-btn variant="flat" prepend-icon="mdi-question" @click="test">Test</v-btn>
+    <!--
+    mdi-ray-start-end
+    mdi-vector-polyline
+    -->
+  </div>
+
+</template>
+
+<script setup>
+import {useStore} from "@/store/store.js";
+import {useChartOrderStore} from "@/orderbuild.js";
+import {chart, drawShape, ShapeType} from "@/chart.js";
+import {timestamp} from "@/misc.js";
+
+const s = useStore()
+const co = useChartOrderStore()
+
+
+let shape = null
+
+
+function test() {
+  if( shape === null )
+    drawShape(ShapeType.VLine, {onCreate:function (shapeId){shape=shapeId}})
+  else
+    chart.getShapeById(shape).setPoints([{time:timestamp()}])
+}
+
+
+function build(component, options={}) {
+  co.addBuilder(component, options)
+}
+
+</script>
+
+<style scoped lang="scss">
+.arrow {
+  font-size: 22px;
+}
+</style>