diff options
| author | Luke Shumaker <lukeshu@lukeshu.com> | 2018-03-19 20:42:17 -0400 |
|---|---|---|
| committer | Luke Shumaker <lukeshu@lukeshu.com> | 2018-03-19 22:31:02 -0400 |
| commit | 0c3396bd4761d833e5cec05070544e03f91d1f2e (patch) | |
| tree | 75fdf781626f88c2db973c31c31e1c8d2d017f33 /public-src/jarmon.vue | |
| parent | 66615bb2095df3dda23ff393f6bb8bd9dd50a766 (diff) | |
wip vuevue
Diffstat (limited to 'public-src/jarmon.vue')
| -rw-r--r-- | public-src/jarmon.vue | 47 |
1 files changed, 47 insertions, 0 deletions
diff --git a/public-src/jarmon.vue b/public-src/jarmon.vue new file mode 100644 index 0000000..11ac223 --- /dev/null +++ b/public-src/jarmon.vue @@ -0,0 +1,47 @@ +<template> + <div v-bind:class="['jarmon', name]"> + <div class="chart-container" ref="chartContainer"> + <h2 class="title"></h2> + <form> + <input name="chart_edit" value="Edit" type="button" /> + <input name="chart_delete" value="Delete" type="button" /> + </form> + <div class="error"></div> + <div class="chart"></div> + <div class="graph-legend"></div> + </div> + <div class="chartRangeControl" ref="chartRangeControl"> + <form> + <div class="range-inputs"> + <input name="from" type="datetime-local" step="1" /> + <input name="to" type="datetime-local" step="1" /> + <select name="shortcuts" title="Time range shortcuts - click to select an alternative time range" ></select> + <select name="tzoffset" title="Timezone offset - click to choose a custom timezone offset" ></select> + <input name="action" value="Update" type="button" + title="Graph update - click to update all graphs" /> + </div> + <div class="range-preview" + title="Time range preview - click and drag to select a custom timerange" ></div> + </form> + </div> + <div class="tabbed-chart-interface" ref="tabbedChartInterface"></div> + </div> +</template> +<script> +import $ from 'jquery'; +import jarmon from 'jarmon'; + +export default { + mounted: function() { + jarmon.buildTabbedChartUi( + $(this.refs.chartcontainer).remove(), + chartRecipes, + $(this.refs.tabbedChartInterface), + tabRecipes, + $(this.refs.chartRangeControl)); + } + props: [ + 'name', + ], +}; +</script> |