Refactor Buefy forms a bit more, to copy grid pattern

i.e. each page can modify the component dynamically before it's registered

tailbone/static/js/tailbone.buefy.form.js

@@ -0,0 +1,7 @@
+
+let TailboneForm = {
+    template: '#tailbone-form-template',
+    methods: {}
+}
+
+let TailboneFormData = {}

tailbone/templates/form.mako

@@ -31,17 +31,20 @@
   </div>
 </%def>
 
-<%def name="make_buefy_form_app()">
+<%def name="modify_tailbone_form()">
+  ## NOTE: if you override this, must use <script> tags
+</%def>
+
+<%def name="make_tailbone_form_app()">
+  ${self.modify_tailbone_form()}
   <script type="text/javascript">
 
-    const BuefyForm = {
-        template: '#buefy-form-template'
-    }
+    TailboneForm.data = function() { return TailboneFormData }
 
-    Vue.component('buefy-form', BuefyForm)
+    Vue.component('tailbone-form', TailboneForm)
 
     new Vue({
-        el: '#buefy-form-app'
+        el: '#tailbone-form-app'
     })
 
   </script>
@@ -51,5 +54,5 @@
 ${self.render_form_complete()}
 
 % if form.use_buefy:
-    ${self.make_buefy_form_app()}
+    ${self.make_tailbone_form_app()}
 % endif

tailbone/templates/forms/deform_buefy.mako

@@ -1,6 +1,6 @@
 ## -*- coding: utf-8; -*-
 
-<script type="text/x-template" id="buefy-form-template">
+<script type="text/x-template" id="tailbone-form-template">
   <div>
   % if not form.readonly:
   ${h.form(form.action_url, id=dform.formid, method='post', enctype='multipart/form-data', **form_kwargs)}
@@ -12,7 +12,7 @@
         % if form.readonly or (field not in dform and field in form.readonly_fields):
             <b-field horizontal
                      label="${form.get_label(field)}">
-              ${form.render_field_value(field)}
+              ${form.render_field_value(field) or h.HTML.tag('span')}
             </b-field>
 
         % elif field in dform:
@@ -59,6 +59,6 @@
 </script>
 
 
-<div id="buefy-form-app">
-  <buefy-form></buefy-form>
+<div id="tailbone-form-app">
+  <tailbone-form></tailbone-form>
 </div>

tailbone/templates/master/view.mako

@@ -84,5 +84,5 @@ ${self.render_form_complete()}
 % endif
 
 % if form.use_buefy:
-    ${self.make_buefy_form_app()}
+    ${self.make_tailbone_form_app()}
 % endif

tailbone/templates/themes/falafel/base.mako

@@ -291,6 +291,7 @@
   ${h.javascript_link(request.static_url('tailbone:static/js/tailbone.buefy.datepicker.js') + '?ver={}'.format(tailbone.__version__))}
   ${h.javascript_link(request.static_url('tailbone:static/js/tailbone.buefy.oncebutton.js') + '?ver={}'.format(tailbone.__version__))}
   ${h.javascript_link(request.static_url('tailbone:static/js/tailbone.buefy.timepicker.js') + '?ver={}'.format(tailbone.__version__))}
+  ${h.javascript_link(request.static_url('tailbone:static/js/tailbone.buefy.form.js') + '?ver={}'.format(tailbone.__version__))}
 
   <script type="text/javascript">
     var session_timeout = ${request.get_session_timeout() or 'null'};