rattail/tailbone
2
0
Fork 0
Code Issues 2 Pull requests Projects Releases Packages Wiki Activity Actions

Refactor form/page component structure for Buefy/Vue.js

Browse source 
this also moves Execute Batch from the form buttons area, to object helper
This commit is contained in:
Lance Edgar 2019-06-17 15:07:19 -05:00
parent 4cadeb8e5d
commit cc79fe76fd
12 changed files with 270 additions and 275 deletions
Download patch file Download diff file Expand all files Collapse all files

65
tailbone/templates/page.mako
View file

@ -6,49 +6,36 @@
<%def name="page_content()"></%def>
<%def name="render_this_page()">
% if use_buefy:
<div style="display: flex; justify-content: space-between;">
<script type="text/x-template" id="this-page-template">
<div style="display: flex; justify-content: space-between;">
<div class="this-page-content">
${self.page_content()}
</div>
<div class="this-page-content">
${self.page_content()}
</div>
<ul id="context-menu">
${self.context_menu_items()}
</ul>
<ul id="context-menu">
${self.context_menu_items()}
</ul>
</div>
</%def>
</div>
</script>
<%def name="render_this_page_buefy()">
<script type="text/x-template" id="this-page-template">
<div>
${self.render_this_page()}
</div>
</script>
<div id="this-page-app">
<this-page></this-page>
</div>
% else:
## legacy / not buefy
<div style="display: flex; justify-content: space-between;">
<div class="this-page-content">
${self.page_content()}
</div>
<ul id="context-menu">
${self.context_menu_items()}
</ul>
</div>
% endif
<div id="this-page-app">
<this-page></this-page>
</div>
</%def>
<%def name="modify_this_page()">
## NOTE: if you override this, must use <script> tags
</%def>
<%def name="make_this_page_app()">
<%def name="declare_page_vars()">
<script type="text/javascript">
let ThisPage = {
@ -57,9 +44,16 @@
}
</script>
</%def>
<%def name="finalize_page_components()">
## NOTE: if you override this, must use <script> tags
</%def>
<%def name="make_this_page_app()">
${self.declare_page_vars()}
${self.modify_this_page()}
${self.finalize_page_components()}
<script type="text/javascript">
Vue.component('this-page', ThisPage)
@ -72,8 +66,9 @@
</%def>
${self.render_this_page()}
% if use_buefy:
${self.render_this_page_buefy()}
${self.make_this_page_app()}
% else:
${self.render_this_page()}
% endif