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

feat: refactor templates to simplify base/page/form structure

Browse source 
to mimic what has been done in wuttaweb
This commit is contained in:
Lance Edgar 2024-08-19 21:30:58 -05:00
parent d29b840343
commit 1ec1eba496
87 changed files with 818 additions and 1045 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
tailbone/templates/appinfo/configure.mako
View file

@ -213,9 +213,9 @@
</div> </div>
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
ThisPageData.weblibs = ${json.dumps(weblibs)|n} ThisPageData.weblibs = ${json.dumps(weblibs)|n}
@ -245,6 +245,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

11
tailbone/templates/appinfo/index.mako
View file

@ -114,14 +114,9 @@
</${b}-collapse> </${b}-collapse>
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
ThisPageData.configFiles = ${json.dumps([dict(path=p, priority=i) for i, p in enumerate(request.rattail_config.prioritized_files, 1)])|n} ThisPageData.configFiles = ${json.dumps([dict(path=p, priority=i) for i, p in enumerate(request.rattail_config.prioritized_files, 1)])|n}
</script> </script>
</%def> </%def>
${parent.body()}

20
tailbone/templates/appsettings.mako
View file

@ -15,8 +15,8 @@
<app-settings :groups="groups" :showing-group="showingGroup"></app-settings> <app-settings :groups="groups" :showing-group="showingGroup"></app-settings>
</%def> </%def>
<%def name="render_this_page_template()"> <%def name="render_vue_templates()">
${parent.render_this_page_template()} ${parent.render_vue_templates()}
<script type="text/x-template" id="app-settings-template"> <script type="text/x-template" id="app-settings-template">
<div class="form"> <div class="form">
@ -150,19 +150,18 @@
</script> </script>
</%def> </%def>
<%def name="modify_this_page_vars()">
${parent.modify_this_page_vars()}
<script type="text/javascript">
<%def name="modify_vue_vars()">
${parent.modify_vue_vars()}
<script>
ThisPageData.groups = ${json.dumps(settings_data)|n} ThisPageData.groups = ${json.dumps(settings_data)|n}
ThisPageData.showingGroup = ${json.dumps(current_group or '')|n} ThisPageData.showingGroup = ${json.dumps(current_group or '')|n}
</script> </script>
</%def> </%def>
<%def name="make_this_page_component()"> <%def name="make_vue_components()">
${parent.make_this_page_component()} ${parent.make_vue_components()}
<script type="text/javascript"> <script>
Vue.component('app-settings', { Vue.component('app-settings', {
template: '#app-settings-template', template: '#app-settings-template',
@ -193,6 +192,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

164
tailbone/templates/base.mako
View file

@ -34,17 +34,21 @@
</head> </head>
<body> <body>
${declare_formposter_mixin()} <div id="app" style="height: 100%;">
${self.body()}
<div id="whole-page-app">
<whole-page></whole-page> <whole-page></whole-page>
</div> </div>
${self.render_whole_page_template()} ## TODO: this must come before the self.body() call..but why?
${self.make_whole_page_component()} ${declare_formposter_mixin()}
${self.make_whole_page_app()}
## content body from derived/child template
${self.body()}
## Vue app
${self.render_vue_templates()}
${self.modify_vue_vars()}
${self.make_vue_components()}
${self.make_vue_app()}
</body> </body>
</html> </html>
@ -181,7 +185,7 @@
<%def name="head_tags()"></%def> <%def name="head_tags()"></%def>
<%def name="render_whole_page_template()"> <%def name="render_vue_template_whole_page()">
<script type="text/x-template" id="whole-page-template"> <script type="text/x-template" id="whole-page-template">
<div> <div>
<header> <header>
@ -749,11 +753,8 @@
% endif % endif
</%def> </%def>
<%def name="declare_whole_page_vars()"> <%def name="render_vue_script_whole_page()">
${page_help.declare_vars()} <script>
${multi_file_upload.declare_vars()}
${h.javascript_link(request.static_url('tailbone:static/js/tailbone.feedback.js') + '?ver={}'.format(tailbone.__version__))}
<script type="text/javascript">
let WholePage = { let WholePage = {
template: '#whole-page-template', template: '#whole-page-template',
@ -889,57 +890,6 @@
</script> </script>
</%def> </%def>
<%def name="modify_whole_page_vars()">
<script type="text/javascript">
% if request.user:
FeedbackFormData.userUUID = ${json.dumps(request.user.uuid)|n}
FeedbackFormData.userName = ${json.dumps(str(request.user))|n}
% endif
</script>
</%def>
<%def name="finalize_whole_page_vars()">
## NOTE: if you override this, must use <script> tags
</%def>
<%def name="make_whole_page_component()">
${make_grid_filter_components()}
${self.declare_whole_page_vars()}
${self.modify_whole_page_vars()}
${self.finalize_whole_page_vars()}
${h.javascript_link(request.static_url('tailbone:static/js/tailbone.buefy.autocomplete.js') + '?ver={}'.format(tailbone.__version__))}
${page_help.make_component()}
${multi_file_upload.make_component()}
<script type="text/javascript">
FeedbackForm.data = function() { return FeedbackFormData }
Vue.component('feedback-form', FeedbackForm)
WholePage.data = function() { return WholePageData }
Vue.component('whole-page', WholePage)
</script>
</%def>
<%def name="make_whole_page_app()">
<script type="text/javascript">
new Vue({
el: '#whole-page-app'
})
</script>
</%def>
<%def name="wtfield(form, name, **kwargs)"> <%def name="wtfield(form, name, **kwargs)">
<div class="field-wrapper${' error' if form[name].errors else ''}"> <div class="field-wrapper${' error' if form[name].errors else ''}">
<label for="${name}">${form[name].label}</label> <label for="${name}">${form[name].label}</label>
@ -961,3 +911,87 @@
</div> </div>
</div> </div>
</%def> </%def>
##############################
## vue components + app
##############################
<%def name="render_vue_templates()">
${page_help.declare_vars()}
${multi_file_upload.declare_vars()}
${h.javascript_link(request.static_url('tailbone:static/js/tailbone.feedback.js') + '?ver={}'.format(tailbone.__version__))}
${h.javascript_link(request.static_url('tailbone:static/js/tailbone.buefy.autocomplete.js') + '?ver={}'.format(tailbone.__version__))}
## DEPRECATED; called for back-compat
${self.render_whole_page_template()}
</%def>
## DEPRECATED; remains for back-compat
<%def name="render_whole_page_template()">
${self.render_vue_template_whole_page()}
${self.declare_whole_page_vars()}
</%def>
## DEPRECATED; remains for back-compat
<%def name="declare_whole_page_vars()">
${self.render_vue_script_whole_page()}
</%def>
<%def name="modify_vue_vars()">
## DEPRECATED; called for back-compat
${self.modify_whole_page_vars()}
</%def>
## DEPRECATED; remains for back-compat
<%def name="modify_whole_page_vars()">
<script>
% if request.user:
FeedbackFormData.userUUID = ${json.dumps(request.user.uuid)|n}
FeedbackFormData.userName = ${json.dumps(str(request.user))|n}
% endif
</script>
</%def>
<%def name="make_vue_components()">
${make_grid_filter_components()}
${page_help.make_component()}
${multi_file_upload.make_component()}
<script>
FeedbackForm.data = function() { return FeedbackFormData }
Vue.component('feedback-form', FeedbackForm)
</script>
## DEPRECATED; called for back-compat
${self.finalize_whole_page_vars()}
${self.make_whole_page_component()}
</%def>
## DEPRECATED; remains for back-compat
<%def name="make_whole_page_component()">
<script>
WholePage.data = function() { return WholePageData }
Vue.component('whole-page', WholePage)
</script>
</%def>
<%def name="make_vue_app()">
## DEPRECATED; called for back-compat
${self.make_whole_page_app()}
</%def>
## DEPRECATED; remains for back-compat
<%def name="make_whole_page_app()">
<script>
new Vue({
el: '#app'
})
</script>
</%def>
##############################
## DEPRECATED
##############################
<%def name="finalize_whole_page_vars()"></%def>

36
tailbone/templates/batch/index.mako
View file

@ -64,10 +64,17 @@
% endif % endif
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="render_vue_templates()">
${parent.modify_this_page_vars()} ${parent.render_vue_templates()}
% if master.results_executable and master.has_perm('execute_multiple'):
${execute_form.render_deform(form_kwargs={'ref': 'actualExecuteForm'}, buttons=False)|n}
% endif
</%def>
<%def name="modify_vue_vars()">
${parent.modify_vue_vars()}
% if master.results_refreshable and master.has_perm('refresh'): % if master.results_refreshable and master.has_perm('refresh'):
<script type="text/javascript"> <script>
TailboneGridData.refreshResultsButtonText = "Refresh Results" TailboneGridData.refreshResultsButtonText = "Refresh Results"
TailboneGridData.refreshResultsButtonDisabled = false TailboneGridData.refreshResultsButtonDisabled = false
@ -81,7 +88,7 @@
</script> </script>
% endif % endif
% if master.results_executable and master.has_perm('execute_multiple'): % if master.results_executable and master.has_perm('execute_multiple'):
<script type="text/javascript"> <script>
${execute_form.vue_component}.methods.submit = function() { ${execute_form.vue_component}.methods.submit = function() {
this.$refs.actualExecuteForm.submit() this.$refs.actualExecuteForm.submit()
@ -118,25 +125,12 @@
% endif % endif
</%def> </%def>
<%def name="make_this_page_component()"> <%def name="make_vue_components()">
${parent.make_this_page_component()} ${parent.make_vue_components()}
% if master.results_executable and master.has_perm('execute_multiple'): % if master.results_executable and master.has_perm('execute_multiple'):
<script type="text/javascript"> <script>
${execute_form.vue_component}.data = function() { return ${execute_form.vue_component}Data } ${execute_form.vue_component}.data = function() { return ${execute_form.vue_component}Data }
Vue.component('${execute_form.vue_tagname}', ${execute_form.vue_component})
Vue.component('${execute_form.component}', ${execute_form.vue_component})
</script> </script>
% endif % endif
</%def> </%def>
<%def name="render_this_page_template()">
${parent.render_this_page_template()}
% if master.results_executable and master.has_perm('execute_multiple'):
${execute_form.render_deform(form_kwargs={'ref': 'actualExecuteForm'}, buttons=False)|n}
% endif
</%def>
${parent.body()}

11
tailbone/templates/batch/inventory/desktop_form.mako
View file

@ -297,14 +297,9 @@
</script> </script>
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
ThisPageData.toggleCompleteSubmitting = false ThisPageData.toggleCompleteSubmitting = false
</script> </script>
</%def> </%def>
${parent.body()}

10
tailbone/templates/batch/pos/view.mako
View file

@ -1,13 +1,9 @@
## -*- coding: utf-8; -*- ## -*- coding: utf-8; -*-
<%inherit file="/batch/view.mako" /> <%inherit file="/batch/view.mako" />
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
${form.vue_component}Data.taxesData = ${json.dumps(taxes_data)|n} ${form.vue_component}Data.taxesData = ${json.dumps(taxes_data)|n}
</script> </script>
</%def> </%def>
${parent.body()}

11
tailbone/templates/batch/vendorcatalog/configure.mako
View file

@ -39,14 +39,9 @@
</div> </div>
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
ThisPageData.catalogParsers = ${json.dumps(catalog_parsers_data)|n} ThisPageData.catalogParsers = ${json.dumps(catalog_parsers_data)|n}
</script> </script>
</%def> </%def>
${parent.body()}

9
tailbone/templates/batch/vendorcatalog/create.mako
View file

@ -1,9 +1,9 @@
## -*- coding: utf-8; -*- ## -*- coding: utf-8; -*-
<%inherit file="/batch/create.mako" /> <%inherit file="/batch/create.mako" />
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
${form.vue_component}Data.parsers = ${json.dumps(parsers_data)|n} ${form.vue_component}Data.parsers = ${json.dumps(parsers_data)|n}
@ -37,6 +37,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

58
tailbone/templates/batch/view.mako
View file

@ -149,12 +149,6 @@
</nav> </nav>
</%def> </%def>
<%def name="render_form_template()">
## TODO: should use self.render_form_buttons()
## ${form.render_deform(form_id='batch-form', buttons=capture(self.render_form_buttons))|n}
${form.render_deform(form_id='batch-form', buttons=capture(buttons))|n}
</%def>
<%def name="render_this_page()"> <%def name="render_this_page()">
${parent.render_this_page()} ${parent.render_this_page()}
@ -197,16 +191,6 @@
</%def> </%def>
<%def name="render_this_page_template()">
${parent.render_this_page_template()}
% if master.has_worksheet_file and master.allow_worksheet(batch) and master.has_perm('worksheet'):
${upload_worksheet_form.render_deform(buttons=False, form_kwargs={'ref': 'actualUploadForm'})|n}
% endif
% if master.handler.executable(batch) and master.has_perm('execute'):
${execute_form.render_deform(form_kwargs={'ref': 'actualExecuteForm'}, buttons=False)|n}
% endif
</%def>
<%def name="render_form()"> <%def name="render_form()">
<div class="form"> <div class="form">
<${form.component} @show-upload="showUploadDialog = true"> <${form.component} @show-upload="showUploadDialog = true">
@ -267,9 +251,27 @@
% endif % endif
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="render_vue_templates()">
${parent.modify_this_page_vars()} ${parent.render_vue_templates()}
<script type="text/javascript"> % if master.has_worksheet_file and master.allow_worksheet(batch) and master.has_perm('worksheet'):
${upload_worksheet_form.render_deform(buttons=False, form_kwargs={'ref': 'actualUploadForm'})|n}
% endif
% if master.handler.executable(batch) and master.has_perm('execute'):
${execute_form.render_deform(form_kwargs={'ref': 'actualExecuteForm'}, buttons=False)|n}
% endif
</%def>
## DEPRECATED; remains for back-compat
## nb. this is called by parent template, /form.mako
<%def name="render_form_template()">
## TODO: should use self.render_form_buttons()
## ${form.render_deform(form_id='batch-form', buttons=capture(self.render_form_buttons))|n}
${form.render_deform(form_id='batch-form', buttons=capture(buttons))|n}
</%def>
<%def name="modify_vue_vars()">
${parent.modify_vue_vars()}
<script>
ThisPageData.statusBreakdownData = ${json.dumps(status_breakdown_data)|n} ThisPageData.statusBreakdownData = ${json.dumps(status_breakdown_data)|n}
@ -340,28 +342,18 @@
</script> </script>
</%def> </%def>
<%def name="make_this_page_component()"> <%def name="make_vue_components()">
${parent.make_this_page_component()} ${parent.make_vue_components()}
% if master.has_worksheet_file and master.allow_worksheet(batch) and master.has_perm('worksheet'): % if master.has_worksheet_file and master.allow_worksheet(batch) and master.has_perm('worksheet'):
<script type="text/javascript"> <script>
## UploadForm
${upload_worksheet_form.vue_component}.data = function() { return ${upload_worksheet_form.vue_component}Data } ${upload_worksheet_form.vue_component}.data = function() { return ${upload_worksheet_form.vue_component}Data }
Vue.component('${upload_worksheet_form.component}', ${upload_worksheet_form.vue_component}) Vue.component('${upload_worksheet_form.component}', ${upload_worksheet_form.vue_component})
</script> </script>
% endif % endif
% if execute_enabled and master.has_perm('execute'): % if execute_enabled and master.has_perm('execute'):
<script type="text/javascript"> <script>
## ExecuteForm
${execute_form.vue_component}.data = function() { return ${execute_form.vue_component}Data } ${execute_form.vue_component}.data = function() { return ${execute_form.vue_component}Data }
Vue.component('${execute_form.component}', ${execute_form.vue_component}) Vue.component('${execute_form.component}', ${execute_form.vue_component})
</script> </script>
% endif % endif
</%def> </%def>
${parent.body()}

9
tailbone/templates/configure-menus.mako
View file

@ -208,9 +208,9 @@
% endif % endif
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
ThisPageData.menuSequence = ${json.dumps([m['key'] for m in menus])|n} ThisPageData.menuSequence = ${json.dumps([m['key'] for m in menus])|n}
@ -443,6 +443,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

9
tailbone/templates/configure.mako
View file

@ -205,9 +205,9 @@
${h.end_form()} ${h.end_form()}
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
% if simple_settings is not Undefined: % if simple_settings is not Undefined:
ThisPageData.simpleSettings = ${json.dumps(simple_settings)|n} ThisPageData.simpleSettings = ${json.dumps(simple_settings)|n}
@ -293,6 +293,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

9
tailbone/templates/customers/configure.mako
View file

@ -88,9 +88,9 @@
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
ThisPage.methods.getLabelForKey = function(key) { ThisPage.methods.getLabelForKey = function(key) {
switch (key) { switch (key) {
@ -111,6 +111,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

8
tailbone/templates/customers/pending/view.mako
View file

@ -106,9 +106,9 @@
% endif % endif
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
ThisPageData.resolvePersonShowDialog = false ThisPageData.resolvePersonShowDialog = false
ThisPageData.resolvePersonUUID = null ThisPageData.resolvePersonUUID = null
@ -139,5 +139,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

8
tailbone/templates/customers/view.mako
View file

@ -16,9 +16,9 @@
</div> </div>
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
% if expose_shoppers: % if expose_shoppers:
${form.vue_component}Data.shoppers = ${json.dumps(shoppers_data)|n} ${form.vue_component}Data.shoppers = ${json.dumps(shoppers_data)|n}
@ -36,5 +36,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

18
tailbone/templates/custorders/create.mako
View file

@ -47,10 +47,9 @@
</div> </div>
</%def> </%def>
<%def name="render_this_page_template()"> <%def name="render_vue_templates()">
${parent.render_this_page_template()} ${parent.render_vue_templates()}
${product_lookup.tailbone_product_lookup_template()} ${product_lookup.tailbone_product_lookup_template()}
<script type="text/x-template" id="customer-order-creator-template"> <script type="text/x-template" id="customer-order-creator-template">
<div> <div>
@ -1265,12 +1264,7 @@
</div> </div>
</script> </script>
</%def> <script>
<%def name="make_this_page_component()">
${parent.make_this_page_component()}
${product_lookup.tailbone_product_lookup_component()}
<script type="text/javascript">
const CustomerOrderCreator = { const CustomerOrderCreator = {
template: '#customer-order-creator-template', template: '#customer-order-creator-template',
@ -2406,5 +2400,7 @@
</script> </script>
</%def> </%def>
<%def name="make_vue_components()">
${parent.body()} ${parent.make_vue_components()}
${product_lookup.tailbone_product_lookup_component()}
</%def>

8
tailbone/templates/custorders/items/view.mako
View file

@ -291,9 +291,9 @@
% endif % endif
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
${form.vue_component}Data.eventsData = ${json.dumps(events_data)|n} ${form.vue_component}Data.eventsData = ${json.dumps(events_data)|n}
@ -448,5 +448,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

9
tailbone/templates/datasync/changes/index.mako
View file

@ -26,9 +26,9 @@
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
% if request.has_perm('datasync.restart'): % if request.has_perm('datasync.restart'):
TailboneGridData.restartDatasyncFormSubmitting = false TailboneGridData.restartDatasyncFormSubmitting = false
@ -50,6 +50,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

9
tailbone/templates/datasync/configure.mako
View file

@ -599,9 +599,9 @@
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
ThisPageData.showConfigFilesNote = false ThisPageData.showConfigFilesNote = false
ThisPageData.profilesData = ${json.dumps(profiles_data)|n} ThisPageData.profilesData = ${json.dumps(profiles_data)|n}
@ -982,6 +982,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

8
tailbone/templates/datasync/status.mako
View file

@ -115,8 +115,9 @@
</${b}-table> </${b}-table>
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
<script type="text/javascript"> ${parent.modify_vue_vars()}
<script>
ThisPageData.processInfo = ${json.dumps(process_info)|n} ThisPageData.processInfo = ${json.dumps(process_info)|n}
@ -171,6 +172,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

10
tailbone/templates/departments/view.mako
View file

@ -1,13 +1,9 @@
## -*- coding: utf-8; -*- ## -*- coding: utf-8; -*-
<%inherit file="/master/view.mako" /> <%inherit file="/master/view.mako" />
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
${form.vue_component}Data.employeesData = ${json.dumps(employees_data)|n} ${form.vue_component}Data.employeesData = ${json.dumps(employees_data)|n}
</script> </script>
</%def> </%def>
${parent.body()}

20
tailbone/templates/form.mako
View file

@ -90,15 +90,15 @@
<%def name="before_object_helpers()"></%def> <%def name="before_object_helpers()"></%def>
<%def name="render_this_page_template()"> <%def name="render_vue_templates()">
${parent.render_vue_templates()}
% if form is not Undefined: % if form is not Undefined:
${self.render_form_template()} ${self.render_form_template()}
% endif % endif
${parent.render_this_page_template()}
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
% if main_form_collapsible: % if main_form_collapsible:
<script> <script>
ThisPageData.mainFormPanelOpen = ${'false' if main_form_autocollapse else 'true'} ThisPageData.mainFormPanelOpen = ${'false' if main_form_autocollapse else 'true'}
@ -106,18 +106,12 @@
% endif % endif
</%def> </%def>
<%def name="finalize_this_page_vars()"> <%def name="make_vue_components()">
${parent.finalize_this_page_vars()} ${parent.make_vue_components()}
% if form is not Undefined: % if form is not Undefined:
<script type="text/javascript"> <script>
${form.vue_component}.data = function() { return ${form.vue_component}Data } ${form.vue_component}.data = function() { return ${form.vue_component}Data }
Vue.component('${form.vue_tagname}', ${form.vue_component}) Vue.component('${form.vue_tagname}', ${form.vue_component})
</script> </script>
% endif % endif
</%def> </%def>
${parent.body()}

9
tailbone/templates/generate_feature.mako
View file

@ -276,9 +276,9 @@
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
ThisPageData.featureType = ${json.dumps(feature_type)|n} ThisPageData.featureType = ${json.dumps(feature_type)|n}
ThisPageData.resultGenerated = ${json.dumps(bool(result))|n} ThisPageData.resultGenerated = ${json.dumps(bool(result))|n}
@ -385,6 +385,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

9
tailbone/templates/importing/configure.mako
View file

@ -144,9 +144,9 @@
</b-modal> </b-modal>
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
ThisPageData.handlersData = ${json.dumps(handlers_data)|n} ThisPageData.handlersData = ${json.dumps(handlers_data)|n}
@ -203,6 +203,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

8
tailbone/templates/importing/runjob.mako
View file

@ -63,9 +63,9 @@
</div> </div>
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
${form.vue_component}Data.submittingRun = false ${form.vue_component}Data.submittingRun = false
${form.vue_component}Data.submittingExplain = false ${form.vue_component}Data.submittingExplain = false
@ -86,5 +86,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

8
tailbone/templates/login.mako
View file

@ -57,8 +57,9 @@
</div> </div>
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
<script type="text/javascript"> ${parent.modify_vue_vars()}
<script>
${form.vue_component}Data.usernameInput = null ${form.vue_component}Data.usernameInput = null
@ -81,6 +82,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

9
tailbone/templates/luigi/configure.mako
View file

@ -297,9 +297,9 @@
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
ThisPageData.overnightTasks = ${json.dumps(overnight_tasks)|n} ThisPageData.overnightTasks = ${json.dumps(overnight_tasks)|n}
ThisPageData.overnightTaskShowDialog = false ThisPageData.overnightTaskShowDialog = false
@ -425,6 +425,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

9
tailbone/templates/luigi/index.mako
View file

@ -255,9 +255,9 @@
</div> </div>
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
% if master.has_perm('restart_scheduler'): % if master.has_perm('restart_scheduler'):
@ -374,6 +374,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

9
tailbone/templates/master/clone.mako
View file

@ -34,9 +34,9 @@
${h.end_form()} ${h.end_form()}
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
TailboneFormData.formSubmitting = false TailboneFormData.formSubmitting = false
TailboneFormData.submitButtonText = "Yes, please clone away" TailboneFormData.submitButtonText = "Yes, please clone away"
@ -48,6 +48,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

7
tailbone/templates/master/delete.mako
View file

@ -33,8 +33,8 @@
${h.end_form()} ${h.end_form()}
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script> <script>
${form.vue_component}Data.formSubmitting = false ${form.vue_component}Data.formSubmitting = false
@ -45,6 +45,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

9
tailbone/templates/master/form.mako
View file

@ -1,9 +1,9 @@
## -*- coding: utf-8; -*- ## -*- coding: utf-8; -*-
<%inherit file="/form.mako" /> <%inherit file="/form.mako" />
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
## declare extra data needed by form ## declare extra data needed by form
% if form is not Undefined and getattr(form, 'json_data', None): % if form is not Undefined and getattr(form, 'json_data', None):
@ -28,6 +28,3 @@
% endif % endif
</%def> </%def>
${parent.body()}

44
tailbone/templates/master/index.mako
View file

@ -265,6 +265,11 @@
</%def> </%def>
## DEPRECATED; remains for back-compat
<%def name="render_this_page()">
${self.page_content()}
</%def>
<%def name="page_content()"> <%def name="page_content()">
% if download_results_path: % if download_results_path:
@ -290,34 +295,28 @@
% endif % endif
</%def> </%def>
<%def name="make_grid_component()">
${grid.render_vue_template(tools=capture(self.grid_tools).strip(), context_menu=capture(self.context_menu_items).strip())}
</%def>
<%def name="render_grid_component()"> <%def name="render_grid_component()">
${grid.render_vue_tag()} ${grid.render_vue_tag()}
</%def> </%def>
<%def name="make_this_page_component()"> ##############################
## vue components
##############################
## define grid <%def name="render_vue_templates()">
${parent.render_vue_templates()}
## DEPRECATED; called for back-compat
${self.make_grid_component()} ${self.make_grid_component()}
${parent.make_this_page_component()}
## finalize grid
<script>
${grid.vue_component}.data = function() { return ${grid.vue_component}Data }
Vue.component('${grid.vue_tagname}', ${grid.vue_component})
</script>
</%def> </%def>
<%def name="render_this_page()"> ## DEPRECATED; remains for back-compat
${self.page_content()} <%def name="make_grid_component()">
${grid.render_vue_template(tools=capture(self.grid_tools).strip(), context_menu=capture(self.context_menu_items).strip())}
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script type="text/javascript">
% if getattr(master, 'supports_grid_totals', False): % if getattr(master, 'supports_grid_totals', False):
@ -624,5 +623,10 @@
</script> </script>
</%def> </%def>
<%def name="make_vue_components()">
${parent.body()} ${parent.make_vue_components()}
<script>
${grid.vue_component}.data = function() { return ${grid.vue_component}Data }
Vue.component('${grid.vue_tagname}', ${grid.vue_component})
</script>
</%def>

23
tailbone/templates/master/merge.mako
View file

@ -109,8 +109,8 @@
<merge-buttons></merge-buttons> <merge-buttons></merge-buttons>
</%def> </%def>
<%def name="render_this_page_template()"> <%def name="render_vue_templates()">
${parent.render_this_page_template()} ${parent.render_vue_templates()}
<script type="text/x-template" id="merge-buttons-template"> <script type="text/x-template" id="merge-buttons-template">
<div class="level" style="margin-top: 2em;"> <div class="level" style="margin-top: 2em;">
@ -147,11 +147,7 @@
</div> </div>
</div> </div>
</script> </script>
</%def> <script>
<%def name="make_this_page_component()">
${parent.make_this_page_component()}
<script type="text/javascript">
const MergeButtons = { const MergeButtons = {
template: '#merge-buttons-template', template: '#merge-buttons-template',
@ -175,12 +171,13 @@
} }
} }
Vue.component('merge-buttons', MergeButtons)
<% request.register_component('merge-buttons', 'MergeButtons') %>
</script> </script>
</%def> </%def>
<%def name="make_vue_components()">
${parent.body()} ${parent.make_vue_components()}
<script>
Vue.component('merge-buttons', MergeButtons)
<% request.register_component('merge-buttons', 'MergeButtons') %>
</script>
</%def>

31
tailbone/templates/master/versions.mako
View file

@ -16,27 +16,16 @@
${self.page_content()} ${self.page_content()}
</%def> </%def>
<%def name="make_this_page_component()">
${parent.make_this_page_component()}
<script type="text/javascript">
TailboneGrid.data = function() { return TailboneGridData }
Vue.component('tailbone-grid', TailboneGrid)
</script>
</%def>
<%def name="render_this_page_template()">
${parent.render_this_page_template()}
## TODO: stop using |n filter
${grid.render_complete()|n}
</%def>
<%def name="page_content()"> <%def name="page_content()">
<tailbone-grid :csrftoken="csrftoken"> ${grid.render_vue_tag(**{':csrftoken': 'csrftoken'})}
</tailbone-grid>
</%def> </%def>
${parent.body()} <%def name="render_vue_templates()">
${parent.render_vue_templates()}
${grid.render_vue_template()}
</%def>
<%def name="make_vue_components()">
${parent.make_vue_components()}
${grid.render_vue_finalize()}
</%def>

54
tailbone/templates/master/view.mako
View file

@ -238,21 +238,34 @@
${rows_grid.render_vue_tag(id='rowGrid', ref='rowGrid')} ${rows_grid.render_vue_tag(id='rowGrid', ref='rowGrid')}
</%def> </%def>
<%def name="render_this_page_template()"> <%def name="render_vue_templates()">
${parent.render_vue_templates()}
% if getattr(master, 'has_rows', False): % if getattr(master, 'has_rows', False):
${rows_grid.render_vue_template(allow_save_defaults=False, tools=capture(self.render_row_grid_tools))} ${rows_grid.render_vue_template(allow_save_defaults=False, tools=capture(self.render_row_grid_tools))}
% endif % endif
${parent.render_this_page_template()}
% if expose_versions: % if expose_versions:
${versions_grid.render_vue_template()} ${versions_grid.render_vue_template()}
% endif % endif
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
% if expose_versions: <script>
<script type="text/javascript">
% if getattr(master, 'touchable', False) and master.has_perm('touch'):
WholePageData.touchSubmitting = false
WholePage.methods.touchRecord = function() {
this.touchSubmitting = true
location.href = '${master.get_action_url('touch', instance)}'
}
% endif
% if expose_versions:
WholePageData.viewingHistory = false
ThisPage.props.viewingHistory = Boolean ThisPage.props.viewingHistory = Boolean
ThisPageData.gettingRevisions = false ThisPageData.gettingRevisions = false
@ -307,34 +320,12 @@
this.viewVersionShowAllFields = !this.viewVersionShowAllFields this.viewVersionShowAllFields = !this.viewVersionShowAllFields
} }
</script>
% endif % endif
</%def>
<%def name="modify_whole_page_vars()">
${parent.modify_whole_page_vars()}
<script type="text/javascript">
% if getattr(master, 'touchable', False) and master.has_perm('touch'):
WholePageData.touchSubmitting = false
WholePage.methods.touchRecord = function() {
this.touchSubmitting = true
location.href = '${master.get_action_url('touch', instance)}'
}
% endif
% if expose_versions:
WholePageData.viewingHistory = false
% endif
</script> </script>
</%def> </%def>
<%def name="finalize_this_page_vars()"> <%def name="make_vue_components()">
${parent.finalize_this_page_vars()} ${parent.make_vue_components()}
% if getattr(master, 'has_rows', False): % if getattr(master, 'has_rows', False):
${rows_grid.render_vue_finalize()} ${rows_grid.render_vue_finalize()}
% endif % endif
@ -342,6 +333,3 @@
${versions_grid.render_vue_finalize()} ${versions_grid.render_vue_finalize()}
% endif % endif
</%def> </%def>
${parent.body()}

9
tailbone/templates/members/configure.mako
View file

@ -52,9 +52,9 @@
</div> </div>
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
ThisPage.methods.getLabelForKey = function(key) { ThisPage.methods.getLabelForKey = function(key) {
switch (key) { switch (key) {
@ -75,6 +75,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

13
tailbone/templates/messages/create.mako
View file

@ -32,14 +32,14 @@
% endif % endif
</%def> </%def>
<%def name="render_this_page_template()"> <%def name="render_vue_templates()">
${parent.render_this_page_template()} ${parent.render_vue_templates()}
${message_recipients_template()} ${message_recipients_template()}
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
TailboneFormData.possibleRecipients = new Map(${json.dumps(available_recipients)|n}) TailboneFormData.possibleRecipients = new Map(${json.dumps(available_recipients)|n})
TailboneFormData.recipientDisplayMap = ${json.dumps(recipient_display_map)|n} TailboneFormData.recipientDisplayMap = ${json.dumps(recipient_display_map)|n}
@ -59,6 +59,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

17
tailbone/templates/messages/index.mako
View file

@ -22,15 +22,15 @@
% endif % endif
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
% if request.matched_route.name in ('messages.inbox', 'messages.archive'): % if request.matched_route.name in ('messages.inbox', 'messages.archive'):
<script type="text/javascript"> <script>
TailboneGridData.moveMessagesSubmitting = false ${grid.vue_component}Data.moveMessagesSubmitting = false
TailboneGridData.moveMessagesText = null ${grid.vue_component}Data.moveMessagesText = null
TailboneGrid.computed.moveMessagesTextCurrent = function() { ${grid.vue_component}.computed.moveMessagesTextCurrent = function() {
if (this.moveMessagesText) { if (this.moveMessagesText) {
return this.moveMessagesText return this.moveMessagesText
} }
@ -38,7 +38,7 @@
return "Move " + count.toString() + " selected to ${'Archive' if request.matched_route.name == 'messages.inbox' else 'Inbox'}" return "Move " + count.toString() + " selected to ${'Archive' if request.matched_route.name == 'messages.inbox' else 'Inbox'}"
} }
TailboneGrid.methods.moveMessagesSubmit = function() { ${grid.vue_component}.methods.moveMessagesSubmit = function() {
this.moveMessagesSubmitting = true this.moveMessagesSubmitting = true
this.moveMessagesText = "Working, please wait..." this.moveMessagesText = "Working, please wait..."
} }
@ -46,6 +46,3 @@
</script> </script>
% endif % endif
</%def> </%def>
${parent.body()}

15
tailbone/templates/messages/view.mako
View file

@ -82,22 +82,19 @@
</div> </div>
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
TailboneFormData.showingAllRecipients = false ${form.vue_component}Data.showingAllRecipients = false
TailboneForm.methods.showMoreRecipients = function() { ${form.vue_component}.methods.showMoreRecipients = function() {
this.showingAllRecipients = true this.showingAllRecipients = true
} }
TailboneForm.methods.hideMoreRecipients = function() { ${form.vue_component}.methods.hideMoreRecipients = function() {
this.showingAllRecipients = false this.showingAllRecipients = false
} }
</script> </script>
</%def> </%def>
${parent.body()}

21
tailbone/templates/ordering/view.mako
View file

@ -21,8 +21,8 @@
% endif % endif
</%def> </%def>
<%def name="render_this_page_template()"> <%def name="render_vue_templates()">
${parent.render_this_page_template()} ${parent.render_vue_templates()}
% if not batch.executed and not batch.complete and master.has_perm('edit_row'): % if not batch.executed and not batch.complete and master.has_perm('edit_row'):
<script type="text/x-template" id="ordering-scanner-template"> <script type="text/x-template" id="ordering-scanner-template">
<div> <div>
@ -185,10 +185,10 @@
% endif % endif
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
% if not batch.executed and not batch.complete and master.has_perm('edit_row'): % if not batch.executed and not batch.complete and master.has_perm('edit_row'):
<script type="text/javascript"> <script>
let OrderingScanner = { let OrderingScanner = {
template: '#ordering-scanner-template', template: '#ordering-scanner-template',
@ -408,16 +408,11 @@
% endif % endif
</%def> </%def>
<%def name="make_this_page_component()"> <%def name="make_vue_components()">
${parent.make_this_page_component()} ${parent.make_vue_components()}
% if not batch.executed and not batch.complete and master.has_perm('edit_row'): % if not batch.executed and not batch.complete and master.has_perm('edit_row'):
<script type="text/javascript"> <script>
Vue.component('ordering-scanner', OrderingScanner) Vue.component('ordering-scanner', OrderingScanner)
</script> </script>
% endif % endif
</%def> </%def>
${parent.body()}

25
tailbone/templates/ordering/worksheet.mako
View file

@ -199,9 +199,8 @@
<ordering-worksheet></ordering-worksheet> <ordering-worksheet></ordering-worksheet>
</%def> </%def>
<%def name="render_this_page_template()"> <%def name="render_vue_templates()">
${parent.render_this_page_template()} ${parent.render_vue_templates()}
<script type="text/x-template" id="ordering-worksheet-template"> <script type="text/x-template" id="ordering-worksheet-template">
<div> <div>
<div class="form-wrapper"> <div class="form-wrapper">
@ -239,11 +238,7 @@
${self.order_form_grid()} ${self.order_form_grid()}
</div> </div>
</script> </script>
</%def> <script>
<%def name="make_this_page_component()">
${parent.make_this_page_component()}
<script type="text/javascript">
const OrderingWorksheet = { const OrderingWorksheet = {
template: '#ordering-worksheet-template', template: '#ordering-worksheet-template',
@ -298,14 +293,12 @@
}, },
} }
Vue.component('ordering-worksheet', OrderingWorksheet)
</script> </script>
</%def> </%def>
<%def name="make_vue_components()">
############################## ${parent.make_vue_components()}
## page body <script>
############################## Vue.component('ordering-worksheet', OrderingWorksheet)
</script>
${parent.body()} </%def>

96
tailbone/templates/page.mako
View file

@ -1,42 +1,26 @@
## -*- coding: utf-8; -*- ## -*- coding: utf-8; -*-
<%inherit file="/base.mako" /> <%inherit file="/base.mako" />
<%def name="context_menu_items()"> <%def name="render_vue_templates()">
% if context_menu_list_items is not Undefined: ${parent.render_vue_templates()}
% for item in context_menu_list_items: ${self.render_vue_template_this_page()}
<li>${item}</li>
% endfor
% endif
</%def> </%def>
<%def name="page_content()"></%def> <%def name="render_vue_template_this_page()">
## DEPRECATED; called for back-compat
<%def name="render_this_page()"> ${self.render_this_page_template()}
<div style="display: flex;">
<div class="this-page-content" style="flex-grow: 1;">
${self.page_content()}
</div>
<ul id="context-menu">
${self.context_menu_items()}
</ul>
</div>
</%def> </%def>
<%def name="render_this_page_template()"> <%def name="render_this_page_template()">
<script type="text/x-template" id="this-page-template"> <script type="text/x-template" id="this-page-template">
<div> <div>
## DEPRECATED; called for back-compat
${self.render_this_page()} ${self.render_this_page()}
</div> </div>
</script> </script>
</%def> <script>
<%def name="declare_this_page_vars()"> const ThisPage = {
<script type="text/javascript">
let ThisPage = {
template: '#this-page-template', template: '#this-page-template',
mixins: [SimpleRequestMixin], mixins: [SimpleRequestMixin],
props: { props: {
@ -52,7 +36,7 @@
}, },
} }
let ThisPageData = { const ThisPageData = {
## TODO: should find a better way to handle CSRF token ## TODO: should find a better way to handle CSRF token
csrftoken: ${json.dumps(request.session.get_csrf_token() or request.session.new_csrf_token())|n}, csrftoken: ${json.dumps(request.session.get_csrf_token() or request.session.new_csrf_token())|n},
} }
@ -60,29 +44,63 @@
</script> </script>
</%def> </%def>
<%def name="modify_this_page_vars()"> ## DEPRECATED; remains for back-compat
## NOTE: if you override this, must use <script> tags <%def name="render_this_page()">
<div style="display: flex;">
<div class="this-page-content" style="flex-grow: 1;">
${self.page_content()}
</div>
## DEPRECATED; remains for back-compat
<ul id="context-menu">
${self.context_menu_items()}
</ul>
</div>
</%def> </%def>
<%def name="finalize_this_page_vars()"> ## nb. this is the canonical block for page content!
## NOTE: if you override this, must use <script> tags <%def name="page_content()"></%def>
## DEPRECATED; remains for back-compat
<%def name="context_menu_items()">
% if context_menu_list_items is not Undefined:
% for item in context_menu_list_items:
<li>${item}</li>
% endfor
% endif
</%def>
<%def name="modify_vue_vars()">
${parent.modify_vue_vars()}
## DEPRECATED; called for back-compat
${self.declare_this_page_vars()}
${self.modify_this_page_vars()}
</%def>
<%def name="make_vue_components()">
${parent.make_vue_components()}
## DEPRECATED; called for back-compat
${self.make_this_page_component()}
</%def> </%def>
<%def name="make_this_page_component()"> <%def name="make_this_page_component()">
${self.declare_this_page_vars()}
${self.modify_this_page_vars()}
${self.finalize_this_page_vars()} ${self.finalize_this_page_vars()}
<script>
<script type="text/javascript">
ThisPage.data = function() { return ThisPageData } ThisPage.data = function() { return ThisPageData }
Vue.component('this-page', ThisPage) Vue.component('this-page', ThisPage)
<% request.register_component('this-page', 'ThisPage') %> <% request.register_component('this-page', 'ThisPage') %>
</script> </script>
</%def> </%def>
##############################
## DEPRECATED
##############################
${self.render_this_page_template()} <%def name="declare_this_page_vars()"></%def>
${self.make_this_page_component()}
<%def name="modify_this_page_vars()"></%def>
<%def name="finalize_this_page_vars()"></%def>

8
tailbone/templates/people/index.mako
View file

@ -61,9 +61,9 @@
${parent.grid_tools()} ${parent.grid_tools()}
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
% if getattr(master, 'mergeable', False) and master.has_perm('request_merge'): % if getattr(master, 'mergeable', False) and master.has_perm('request_merge'):
@ -100,5 +100,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

8
tailbone/templates/people/merge-requests/view.mako
View file

@ -18,10 +18,10 @@
% endif % endif
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
% if not instance.merged and request.has_perm('people.merge'): % if not instance.merged and request.has_perm('people.merge'):
<script type="text/javascript"> <script>
ThisPageData.mergeFormButtonText = "Perform Merge" ThisPageData.mergeFormButtonText = "Perform Merge"
ThisPageData.mergeFormSubmitting = false ThisPageData.mergeFormSubmitting = false
@ -34,5 +34,3 @@
</script> </script>
% endif % endif
</%def> </%def>
${parent.body()}

30
tailbone/templates/people/view.mako
View file

@ -2,6 +2,16 @@
<%inherit file="/master/view.mako" /> <%inherit file="/master/view.mako" />
<%namespace file="/util.mako" import="view_profiles_helper" /> <%namespace file="/util.mako" import="view_profiles_helper" />
<%def name="page_content()">
${parent.page_content()}
% if not instance.users and request.has_perm('users.create'):
${h.form(url('people.make_user'), ref='makeUserForm')}
${h.csrf_token(request)}
${h.hidden('person_uuid', value=instance.uuid)}
${h.end_form()}
% endif
</%def>
<%def name="object_helpers()"> <%def name="object_helpers()">
${parent.object_helpers()} ${parent.object_helpers()}
${view_profiles_helper([instance])} ${view_profiles_helper([instance])}
@ -13,9 +23,9 @@
</div> </div>
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
${form.vue_component}.methods.clickMakeUser = function(event) { ${form.vue_component}.methods.clickMakeUser = function(event) {
this.$emit('make-user') this.$emit('make-user')
@ -29,17 +39,3 @@
</script> </script>
</%def> </%def>
<%def name="page_content()">
${parent.page_content()}
% if not instance.users and request.has_perm('users.create'):
${h.form(url('people.make_user'), ref='makeUserForm')}
${h.csrf_token(request)}
${h.hidden('person_uuid', value=instance.uuid)}
${h.end_form()}
% endif
</%def>
${parent.body()}

307
tailbone/templates/people/view_profile.mako
View file

@ -1966,30 +1966,97 @@
</div> </div>
</script> </script>
</%def> <script>
<%def name="render_this_page_template()"> let ProfileInfoData = {
${parent.render_this_page_template()} activeTab: location.hash ? location.hash.substring(1) : 'personal',
${self.render_personal_tab_template()} tabchecks: ${json.dumps(tabchecks or {})|n},
today: '${rattail_app.today()}',
profileLastChanged: Date.now(),
person: ${json.dumps(person_data or {})|n},
phoneTypeOptions: ${json.dumps(phone_type_options or [])|n},
emailTypeOptions: ${json.dumps(email_type_options or [])|n},
maxLengths: ${json.dumps(max_lengths or {})|n},
% if expose_members: % if request.has_perm('people_profile.view_versions'):
${self.render_member_tab_template()} loadingRevisions: false,
showingRevisionDialog: false,
revision: {},
revisionShowAllFields: false,
% endif % endif
}
${self.render_customer_tab_template()} let ProfileInfo = {
% if expose_customer_shoppers: template: '#profile-info-template',
${self.render_shopper_tab_template()} props: {
% if request.has_perm('people_profile.view_versions'):
viewingHistory: Boolean,
gettingRevisions: Boolean,
revisions: Array,
revisionVersionMap: null,
% endif % endif
${self.render_employee_tab_template()} },
${self.render_notes_tab_template()} computed: {},
mounted() {
// auto-refresh whichever tab is shown first
## TODO: how to not assume 'personal' is the default tab?
let tab = this.$refs['tab_' + (this.activeTab || 'personal')]
if (tab && tab.refreshTab) {
tab.refreshTab()
}
},
methods: {
profileChanged(data) {
this.$emit('change-content-title', data.person.dynamic_content_title)
this.person = data.person
this.tabchecks = data.tabchecks
this.profileLastChanged = Date.now()
},
activeTabChanged(value) {
location.hash = value
this.refreshTabIfNeeded(value)
this.activeTabChangedExtra(value)
},
refreshTabIfNeeded(key) {
// TODO: this is *always* refreshing, should be more selective (?)
let tab = this.$refs['tab_' + key]
if (tab && tab.refreshIfNeeded) {
tab.refreshIfNeeded(this.profileLastChanged)
}
},
activeTabChangedExtra(value) {},
% if request.has_perm('people_profile.view_versions'):
viewRevision(row) {
this.revision = this.revisionVersionMap[row.txnid]
this.showingRevisionDialog = true
},
viewPrevRevision() {
let txnid = this.revision.prev_txnid
this.revision = this.revisionVersionMap[txnid]
},
viewNextRevision() {
let txnid = this.revision.next_txnid
this.revision = this.revisionVersionMap[txnid]
},
toggleVersionFields() {
this.revisionShowAllFields = !this.revisionShowAllFields
},
% if expose_transactions:
${transactions_grid.render_complete(allow_save_defaults=False)|n}
${self.render_transactions_tab_template()}
% endif % endif
},
}
${self.render_user_tab_template()} </script>
${self.render_profile_info_template()}
</%def> </%def>
<%def name="declare_personal_tab_vars()"> <%def name="declare_personal_tab_vars()">
@ -3022,114 +3089,46 @@
</script> </script>
</%def> </%def>
<%def name="declare_profile_info_vars()">
<script type="text/javascript">
let ProfileInfoData = {
activeTab: location.hash ? location.hash.substring(1) : 'personal',
tabchecks: ${json.dumps(tabchecks or {})|n},
today: '${rattail_app.today()}',
profileLastChanged: Date.now(),
person: ${json.dumps(person_data or {})|n},
phoneTypeOptions: ${json.dumps(phone_type_options or [])|n},
emailTypeOptions: ${json.dumps(email_type_options or [])|n},
maxLengths: ${json.dumps(max_lengths or {})|n},
% if request.has_perm('people_profile.view_versions'):
loadingRevisions: false,
showingRevisionDialog: false,
revision: {},
revisionShowAllFields: false,
% endif
}
let ProfileInfo = {
template: '#profile-info-template',
props: {
% if request.has_perm('people_profile.view_versions'):
viewingHistory: Boolean,
gettingRevisions: Boolean,
revisions: Array,
revisionVersionMap: null,
% endif
},
computed: {},
mounted() {
// auto-refresh whichever tab is shown first
## TODO: how to not assume 'personal' is the default tab?
let tab = this.$refs['tab_' + (this.activeTab || 'personal')]
if (tab && tab.refreshTab) {
tab.refreshTab()
}
},
methods: {
profileChanged(data) {
this.$emit('change-content-title', data.person.dynamic_content_title)
this.person = data.person
this.tabchecks = data.tabchecks
this.profileLastChanged = Date.now()
},
activeTabChanged(value) {
location.hash = value
this.refreshTabIfNeeded(value)
this.activeTabChangedExtra(value)
},
refreshTabIfNeeded(key) {
// TODO: this is *always* refreshing, should be more selective (?)
let tab = this.$refs['tab_' + key]
if (tab && tab.refreshIfNeeded) {
tab.refreshIfNeeded(this.profileLastChanged)
}
},
activeTabChangedExtra(value) {},
% if request.has_perm('people_profile.view_versions'):
viewRevision(row) {
this.revision = this.revisionVersionMap[row.txnid]
this.showingRevisionDialog = true
},
viewPrevRevision() {
let txnid = this.revision.prev_txnid
this.revision = this.revisionVersionMap[txnid]
},
viewNextRevision() {
let txnid = this.revision.next_txnid
this.revision = this.revisionVersionMap[txnid]
},
toggleVersionFields() {
this.revisionShowAllFields = !this.revisionShowAllFields
},
% endif
},
}
</script>
</%def>
<%def name="make_profile_info_component()"> <%def name="make_profile_info_component()">
${self.declare_profile_info_vars()}
<script type="text/javascript">
## DEPRECATED; called for back-compat
${self.declare_profile_info_vars()}
<script>
ProfileInfo.data = function() { return ProfileInfoData } ProfileInfo.data = function() { return ProfileInfoData }
Vue.component('profile-info', ProfileInfo) Vue.component('profile-info', ProfileInfo)
<% request.register_component('profile-info', 'ProfileInfo') %> <% request.register_component('profile-info', 'ProfileInfo') %>
</script> </script>
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="render_vue_templates()">
${parent.modify_this_page_vars()} ${parent.render_vue_templates()}
<script type="text/javascript">
${self.render_personal_tab_template()}
% if expose_members:
${self.render_member_tab_template()}
% endif
${self.render_customer_tab_template()}
% if expose_customer_shoppers:
${self.render_shopper_tab_template()}
% endif
${self.render_employee_tab_template()}
${self.render_notes_tab_template()}
% if expose_transactions:
${transactions_grid.render_complete(allow_save_defaults=False)|n}
${self.render_transactions_tab_template()}
% endif
${self.render_user_tab_template()}
${self.render_profile_info_template()}
</%def>
<%def name="modify_vue_vars()">
${parent.modify_vue_vars()}
<script>
% if request.has_perm('people_profile.view_versions'): % if request.has_perm('people_profile.view_versions'):
ThisPage.props.viewingHistory = Boolean ThisPage.props.viewingHistory = Boolean
@ -3177,45 +3176,8 @@
}, },
} }
</script>
</%def>
<%def name="make_this_page_component()">
${parent.make_this_page_component()}
${self.make_personal_tab_component()}
% if expose_members:
${self.make_member_tab_component()}
% endif
${self.make_customer_tab_component()}
% if expose_customer_shoppers:
${self.make_shopper_tab_component()}
% endif
${self.make_employee_tab_component()}
${self.make_notes_tab_component()}
% if expose_transactions:
<script type="text/javascript">
TransactionsGrid.data = function() { return TransactionsGridData }
Vue.component('transactions-grid', TransactionsGrid)
## TODO: why is this line not needed?
## <% request.register_component('transactions-grid', 'TransactionsGrid') %>
</script>
${self.make_transactions_tab_component()}
% endif
${self.make_user_tab_component()}
${self.make_profile_info_component()}
</%def>
<%def name="modify_whole_page_vars()">
${parent.modify_whole_page_vars()}
% if request.has_perm('people_profile.view_versions'): % if request.has_perm('people_profile.view_versions'):
<script type="text/javascript">
WholePageData.viewingHistory = false WholePageData.viewingHistory = false
WholePageData.gettingRevisions = false WholePageData.gettingRevisions = false
@ -3251,9 +3213,44 @@
}) })
} }
</script>
% endif % endif
</script>
</%def> </%def>
<%def name="make_vue_components()">
${parent.make_vue_components()}
${parent.body()} ${self.make_personal_tab_component()}
% if expose_members:
${self.make_member_tab_component()}
% endif
${self.make_customer_tab_component()}
% if expose_customer_shoppers:
${self.make_shopper_tab_component()}
% endif
${self.make_employee_tab_component()}
${self.make_notes_tab_component()}
% if expose_transactions:
<script type="text/javascript">
TransactionsGrid.data = function() { return TransactionsGridData }
Vue.component('transactions-grid', TransactionsGrid)
## TODO: why is this line not needed?
## <% request.register_component('transactions-grid', 'TransactionsGrid') %>
</script>
${self.make_transactions_tab_component()}
% endif
${self.make_user_tab_component()}
${self.make_profile_info_component()}
</%def>
##############################
## DEPRECATED
##############################
<%def name="declare_profile_info_vars()"></%def>

12
tailbone/templates/poser/reports/view.mako
View file

@ -62,19 +62,13 @@
<br /> <br />
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
% if master.has_perm('replace'): % if master.has_perm('replace'):
<script type="text/javascript"> <script>
${form.vue_component}Data.showUploadForm = false ${form.vue_component}Data.showUploadForm = false
${form.vue_component}Data.uploadFile = null ${form.vue_component}Data.uploadFile = null
${form.vue_component}Data.uploadSubmitting = false ${form.vue_component}Data.uploadSubmitting = false
</script> </script>
% endif % endif
</%def> </%def>
${parent.body()}

11
tailbone/templates/poser/setup.mako
View file

@ -118,14 +118,9 @@
% endif % endif
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
ThisPageData.setupSubmitting = false ThisPageData.setupSubmitting = false
</script> </script>
</%def> </%def>
${parent.body()}

53
tailbone/templates/principal/find_by_perm.mako
View file

@ -10,8 +10,16 @@
</find-principals> </find-principals>
</%def> </%def>
<%def name="render_this_page_template()"> <%def name="principal_table()">
${parent.render_this_page_template()} <div
style="width: 50%;"
>
${grid.render_table_element(data_prop='principalsData')|n}
</div>
</%def>
<%def name="render_vue_templates()">
${parent.render_vue_templates()}
<script type="text/x-template" id="find-principals-template"> <script type="text/x-template" id="find-principals-template">
<div> <div>
@ -90,28 +98,6 @@
</div> </div>
</script> </script>
</%def>
<%def name="principal_table()">
<div
style="width: 50%;"
>
${grid.render_table_element(data_prop='principalsData')|n}
</div>
</%def>
<%def name="modify_this_page_vars()">
${parent.modify_this_page_vars()}
<script type="text/javascript">
ThisPageData.permissionGroups = ${json.dumps(perms_data)|n}
ThisPageData.sortedGroups = ${json.dumps(sorted_groups_data)|n}
</script>
</%def>
<%def name="make_this_page_component()">
${parent.make_this_page_component()}
<script type="text/javascript"> <script type="text/javascript">
const FindPrincipals = { const FindPrincipals = {
@ -240,12 +226,21 @@
} }
} }
Vue.component('find-principals', FindPrincipals)
<% request.register_component('find-principals', 'FindPrincipals') %>
</script> </script>
</%def> </%def>
<%def name="modify_vue_vars()">
${parent.modify_vue_vars()}
<script>
ThisPageData.permissionGroups = ${json.dumps(perms_data)|n}
ThisPageData.sortedGroups = ${json.dumps(sorted_groups_data)|n}
</script>
</%def>
${parent.body()} <%def name="make_vue_components()">
${parent.make_vue_components()}
<script>
Vue.component('find-principals', FindPrincipals)
<% request.register_component('find-principals', 'FindPrincipals') %>
</script>
</%def>

9
tailbone/templates/products/batch.mako
View file

@ -60,9 +60,9 @@
</script> </script>
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
## TODO: ugh, an awful lot of duplicated code here (from /forms/deform.mako) ## TODO: ugh, an awful lot of duplicated code here (from /forms/deform.mako)
@ -114,6 +114,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

9
tailbone/templates/products/configure.mako
View file

@ -95,9 +95,9 @@
</div> </div>
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
ThisPage.methods.getTitleForKey = function(key) { ThisPage.methods.getTitleForKey = function(key) {
switch (key) { switch (key) {
@ -118,6 +118,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

9
tailbone/templates/products/index.mako
View file

@ -36,10 +36,10 @@
</${grid.component}> </${grid.component}>
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
% if label_profiles and master.has_perm('print_labels'): % if label_profiles and master.has_perm('print_labels'):
<script type="text/javascript"> <script>
${grid.vue_component}Data.quickLabelProfile = ${json.dumps(label_profiles[0].uuid)|n} ${grid.vue_component}Data.quickLabelProfile = ${json.dumps(label_profiles[0].uuid)|n}
${grid.vue_component}Data.quickLabelQuantity = 1 ${grid.vue_component}Data.quickLabelQuantity = 1
@ -83,6 +83,3 @@
</script> </script>
% endif % endif
</%def> </%def>
${parent.body()}

23
tailbone/templates/products/pending/view.mako
View file

@ -2,11 +2,6 @@
<%inherit file="/master/view.mako" /> <%inherit file="/master/view.mako" />
<%namespace name="product_lookup" file="/products/lookup.mako" /> <%namespace name="product_lookup" file="/products/lookup.mako" />
<%def name="render_this_page_template()">
${parent.render_this_page_template()}
${product_lookup.tailbone_product_lookup_template()}
</%def>
<%def name="page_content()"> <%def name="page_content()">
${parent.page_content()} ${parent.page_content()}
@ -67,9 +62,14 @@
% endif % endif
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="render_vue_templates()">
${parent.modify_this_page_vars()} ${parent.render_vue_templates()}
<script type="text/javascript"> ${product_lookup.tailbone_product_lookup_template()}
</%def>
<%def name="modify_vue_vars()">
${parent.modify_vue_vars()}
<script>
% if master.has_perm('ignore_product') and instance.status_code in (enum.PENDING_PRODUCT_STATUS_PENDING, enum.PENDING_PRODUCT_STATUS_READY): % if master.has_perm('ignore_product') and instance.status_code in (enum.PENDING_PRODUCT_STATUS_PENDING, enum.PENDING_PRODUCT_STATUS_READY):
@ -124,10 +124,7 @@
</script> </script>
</%def> </%def>
<%def name="make_this_page_component()"> <%def name="make_vue_components()">
${parent.make_this_page_component()} ${parent.make_vue_components()}
${product_lookup.tailbone_product_lookup_component()} ${product_lookup.tailbone_product_lookup_component()}
</%def> </%def>
${parent.body()}

9
tailbone/templates/products/view.mako
View file

@ -282,9 +282,9 @@
% endif % endif
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
ThisPageData.vendorSourcesData = ${json.dumps(vendor_sources['data'])|n} ThisPageData.vendorSourcesData = ${json.dumps(vendor_sources['data'])|n}
ThisPageData.lookupCodesData = ${json.dumps(lookup_codes['data'])|n} ThisPageData.lookupCodesData = ${json.dumps(lookup_codes['data'])|n}
@ -411,6 +411,3 @@
% endif % endif
</script> </script>
</%def> </%def>
${parent.body()}

9
tailbone/templates/purchases/credits/index.mako
View file

@ -59,9 +59,9 @@
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
${grid.vue_component}Data.changeStatusShowDialog = false ${grid.vue_component}Data.changeStatusShowDialog = false
${grid.vue_component}Data.changeStatusOptions = ${json.dumps(status_options)|n} ${grid.vue_component}Data.changeStatusOptions = ${json.dumps(status_options)|n}
@ -80,6 +80,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

26
tailbone/templates/receiving/view.mako
View file

@ -139,9 +139,15 @@
% endif % endif
</%def> </%def>
<%def name="render_this_page_template()"> <%def name="object_helpers()">
${parent.render_this_page_template()} ${self.render_status_breakdown()}
${self.render_po_vs_invoice_helper()}
${self.render_execute_helper()}
${self.render_tools_helper()}
</%def>
<%def name="render_vue_templates()">
${parent.render_vue_templates()}
% if allow_edit_catalog_unit_cost or allow_edit_invoice_unit_cost: % if allow_edit_catalog_unit_cost or allow_edit_invoice_unit_cost:
<script type="text/x-template" id="receiving-cost-editor-template"> <script type="text/x-template" id="receiving-cost-editor-template">
<div> <div>
@ -162,16 +168,9 @@
% endif % endif
</%def> </%def>
<%def name="object_helpers()"> <%def name="modify_vue_vars()">
${self.render_status_breakdown()} ${parent.modify_vue_vars()}
${self.render_po_vs_invoice_helper()} <script>
${self.render_execute_helper()}
${self.render_tools_helper()}
</%def>
<%def name="modify_this_page_vars()">
${parent.modify_this_page_vars()}
<script type="text/javascript">
% if allow_confirm_all_costs: % if allow_confirm_all_costs:
@ -389,6 +388,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

9
tailbone/templates/receiving/view_row.mako
View file

@ -484,9 +484,9 @@
</div> </div>
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
## ThisPage.methods.editUnitCost = function() { ## ThisPage.methods.editUnitCost = function() {
## alert("TODO: not yet implemented") ## alert("TODO: not yet implemented")
@ -720,6 +720,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

13
tailbone/templates/reports/generated/choose.mako
View file

@ -53,13 +53,13 @@
% endif % endif
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
TailboneFormData.reportDescriptions = ${json.dumps(report_descriptions)|n} ${form.vue_component}Data.reportDescriptions = ${json.dumps(report_descriptions)|n}
TailboneForm.methods.reportTypeChanged = function(reportType) { ${form.vue_component}.methods.reportTypeChanged = function(reportType) {
this.$emit('report-change', this.reportDescriptions[reportType]) this.$emit('report-change', this.reportDescriptions[reportType])
} }
@ -71,6 +71,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

11
tailbone/templates/reports/generated/delete.mako
View file

@ -1,16 +1,11 @@
## -*- coding: utf-8; -*- ## -*- coding: utf-8; -*-
<%inherit file="/master/delete.mako" /> <%inherit file="/master/delete.mako" />
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
% if params_data is not Undefined: % if params_data is not Undefined:
${form.vue_component}Data.paramsData = ${json.dumps(params_data)|n} ${form.vue_component}Data.paramsData = ${json.dumps(params_data)|n}
% endif % endif
</script> </script>
</%def> </%def>
${parent.body()}

11
tailbone/templates/reports/generated/view.mako
View file

@ -23,16 +23,11 @@
% endif % endif
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
% if params_data is not Undefined: % if params_data is not Undefined:
${form.vue_component}Data.paramsData = ${json.dumps(params_data)|n} ${form.vue_component}Data.paramsData = ${json.dumps(params_data)|n}
% endif % endif
</script> </script>
</%def> </%def>
${parent.body()}

11
tailbone/templates/reports/inventory.mako
View file

@ -48,15 +48,10 @@
${h.end_form()} ${h.end_form()}
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
ThisPageData.departments = ${json.dumps([{'uuid': d.uuid, 'name': d.name} for d in departments])|n} ThisPageData.departments = ${json.dumps([{'uuid': d.uuid, 'name': d.name} for d in departments])|n}
ThisPageData.excludeNotForSale = true ThisPageData.excludeNotForSale = true
</script> </script>
</%def> </%def>
${parent.body()}

9
tailbone/templates/reports/ordering.mako
View file

@ -81,9 +81,9 @@
<%def name="extra_fields()"></%def> <%def name="extra_fields()"></%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
ThisPageData.vendorUUID = null ThisPageData.vendorUUID = null
ThisPageData.departments = [] ThisPageData.departments = []
@ -127,6 +127,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

9
tailbone/templates/reports/problems/view.mako
View file

@ -62,9 +62,9 @@
% endif % endif
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
% if weekdays_data is not Undefined: % if weekdays_data is not Undefined:
${form.vue_component}Data.weekdaysData = ${json.dumps(weekdays_data)|n} ${form.vue_component}Data.weekdaysData = ${json.dumps(weekdays_data)|n}
@ -75,6 +75,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

12
tailbone/templates/roles/create.mako
View file

@ -6,15 +6,11 @@
${h.stylesheet_link(request.static_url('tailbone:static/css/perms.css'))} ${h.stylesheet_link(request.static_url('tailbone:static/css/perms.css'))}
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
// TODO: this variable name should be more dynamic (?) since this is // TODO: this variable name should be more dynamic (?) since this is
// connected to (and only here b/c of) the permissions field // connected to (and only here b/c of) the permissions field
TailboneFormData.showingPermissionGroup = '' ${form.vue_component}Data.showingPermissionGroup = ''
</script> </script>
</%def> </%def>
${parent.body()}

12
tailbone/templates/roles/edit.mako
View file

@ -6,15 +6,11 @@
${h.stylesheet_link(request.static_url('tailbone:static/css/perms.css'))} ${h.stylesheet_link(request.static_url('tailbone:static/css/perms.css'))}
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
// TODO: this variable name should be more dynamic (?) since this is // TODO: this variable name should be more dynamic (?) since this is
// connected to (and only here b/c of) the permissions field // connected to (and only here b/c of) the permissions field
TailboneFormData.showingPermissionGroup = '' ${form.vue_component}Data.showingPermissionGroup = ''
</script> </script>
</%def> </%def>
${parent.body()}

8
tailbone/templates/roles/view.mako
View file

@ -6,9 +6,9 @@
${h.stylesheet_link(request.static_url('tailbone:static/css/perms.css'))} ${h.stylesheet_link(request.static_url('tailbone:static/css/perms.css'))}
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
% if users_data is not Undefined: % if users_data is not Undefined:
${form.vue_component}Data.usersData = ${json.dumps(users_data)|n} ${form.vue_component}Data.usersData = ${json.dumps(users_data)|n}
@ -23,5 +23,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

9
tailbone/templates/settings/email/configure.mako
View file

@ -86,9 +86,9 @@
</div> </div>
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
ThisPageData.testRecipient = ${json.dumps(user_email_address)|n} ThisPageData.testRecipient = ${json.dumps(user_email_address)|n}
ThisPageData.sendingTest = false ThisPageData.sendingTest = false
@ -137,6 +137,3 @@
% endif % endif
</script> </script>
</%def> </%def>
${parent.body()}

8
tailbone/templates/settings/email/index.mako
View file

@ -15,10 +15,10 @@
${parent.render_grid_component()} ${parent.render_grid_component()}
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
% if master.has_perm('configure'): % if master.has_perm('configure'):
<script type="text/javascript"> <script>
ThisPageData.showEmails = 'available' ThisPageData.showEmails = 'available'
@ -65,5 +65,3 @@
</script> </script>
% endif % endif
</%def> </%def>
${parent.body()}

21
tailbone/templates/settings/email/view.mako
View file

@ -6,8 +6,8 @@
<email-preview-tools></email-preview-tools> <email-preview-tools></email-preview-tools>
</%def> </%def>
<%def name="render_this_page_template()"> <%def name="render_vue_templates()">
${parent.render_this_page_template()} ${parent.render_vue_templates()}
<script type="text/x-template" id="email-preview-tools-template"> <script type="text/x-template" id="email-preview-tools-template">
${h.form(url('email.preview'), **{'@submit': 'submitPreviewForm'})} ${h.form(url('email.preview'), **{'@submit': 'submitPreviewForm'})}
@ -72,10 +72,6 @@
${h.end_form()} ${h.end_form()}
</script> </script>
</%def>
<%def name="make_this_page_component()">
${parent.make_this_page_component()}
<script type="text/javascript"> <script type="text/javascript">
const EmailPreviewTools = { const EmailPreviewTools = {
@ -100,12 +96,13 @@
} }
} }
Vue.component('email-preview-tools', EmailPreviewTools)
<% request.register_component('email-preview-tools', 'EmailPreviewTools') %>
</script> </script>
</%def> </%def>
<%def name="make_vue_components()">
${parent.body()} ${parent.make_vue_components()}
<script>
Vue.component('email-preview-tools', EmailPreviewTools)
<% request.register_component('email-preview-tools', 'EmailPreviewTools') %>
</script>
</%def>

9
tailbone/templates/tables/create.mako
View file

@ -695,9 +695,9 @@
</b-steps> </b-steps>
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
// nb. for warning user they may lose changes if leaving page // nb. for warning user they may lose changes if leaving page
ThisPageData.dirty = false ThisPageData.dirty = false
@ -983,6 +983,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

11
tailbone/templates/tempmon/appliances/view.mako
View file

@ -8,14 +8,9 @@
% endif % endif
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
${form.vue_component}Data.probesData = ${json.dumps(probes_data)|n} ${form.vue_component}Data.probesData = ${json.dumps(probes_data)|n}
</script> </script>
</%def> </%def>
${parent.body()}

11
tailbone/templates/tempmon/clients/view.mako
View file

@ -22,14 +22,9 @@
% endif % endif
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
${form.vue_component}Data.probesData = ${json.dumps(probes_data)|n} ${form.vue_component}Data.probesData = ${json.dumps(probes_data)|n}
</script> </script>
</%def> </%def>
${parent.body()}

9
tailbone/templates/tempmon/dashboard.mako
View file

@ -59,9 +59,9 @@
% endif % endif
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
ThisPageData.appliances = ${json.dumps(appliances_data)|n} ThisPageData.appliances = ${json.dumps(appliances_data)|n}
ThisPageData.applianceUUID = ${json.dumps(appliance.uuid if appliance else None)|n} ThisPageData.applianceUUID = ${json.dumps(appliance.uuid if appliance else None)|n}
@ -118,6 +118,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

9
tailbone/templates/tempmon/probes/graph.mako
View file

@ -66,9 +66,9 @@
<canvas ref="tempchart" width="400" height="150"></canvas> <canvas ref="tempchart" width="400" height="150"></canvas>
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
ThisPageData.currentTimeRange = ${json.dumps(current_time_range)|n} ThisPageData.currentTimeRange = ${json.dumps(current_time_range)|n}
ThisPageData.chart = null ThisPageData.chart = null
@ -128,6 +128,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

100
tailbone/templates/themes/butterball/base.mako
View file

@ -20,38 +20,21 @@
</head> </head>
<body> <body>
<div id="app" style="height: 100%; display: flex; flex-direction: column; justify-content: space-between;"> <div id="app" style="height: 100%;">
<whole-page></whole-page> <whole-page></whole-page>
</div> </div>
## TODO: this must come before the self.body() call..but why? ## TODO: this must come before the self.body() call..but why?
${declare_formposter_mixin()} ${declare_formposter_mixin()}
## global components used by various (but not all) pages
${make_field_components()}
${make_grid_filter_components()}
## global components for buefy-based template compatibility
${make_http_plugin()}
${make_buefy_plugin()}
${make_buefy_components()}
## special global components, used by WholePage
${self.make_menu_search_component()}
${page_help.render_template()}
${page_help.declare_vars()}
% if request.has_perm('common.feedback'):
${self.make_feedback_component()}
% endif
## WholePage component
${self.make_whole_page_component()}
## content body from derived/child template ## content body from derived/child template
${self.body()} ${self.body()}
## Vue app ## Vue app
${self.make_whole_page_app()} ${self.render_vue_templates()}
${self.modify_vue_vars()}
${self.make_vue_components()}
${self.make_vue_app()}
</body> </body>
</html> </html>
@ -596,7 +579,7 @@
</script> </script>
</%def> </%def>
<%def name="render_whole_page_template()"> <%def name="render_vue_template_whole_page()">
<script type="text/x-template" id="whole-page-template"> <script type="text/x-template" id="whole-page-template">
<div id="whole-page" style="height: 100%; display: flex; flex-direction: column; justify-content: space-between;"> <div id="whole-page" style="height: 100%; display: flex; flex-direction: column; justify-content: space-between;">
@ -896,8 +879,6 @@
</footer> </footer>
</div> </div>
</script> </script>
## ${multi_file_upload.render_template()}
</%def> </%def>
<%def name="render_this_page_component()"> <%def name="render_this_page_component()">
@ -1068,9 +1049,7 @@
% endif % endif
</%def> </%def>
<%def name="declare_whole_page_vars()"> <%def name="render_vue_script_whole_page()">
## ${multi_file_upload.declare_vars()}
<script> <script>
const WholePage = { const WholePage = {
@ -1172,26 +1151,71 @@
</script> </script>
</%def> </%def>
<%def name="modify_whole_page_vars()"></%def> ##############################
## vue components + app
##############################
## TODO: do we really need this? <%def name="render_vue_templates()">
## <%def name="finalize_whole_page_vars()"></%def> ## ${multi_file_upload.render_template()}
## ${multi_file_upload.declare_vars()}
<%def name="make_whole_page_component()"> ## global components used by various (but not all) pages
${make_field_components()}
${make_grid_filter_components()}
## global components for buefy-based template compatibility
${make_http_plugin()}
${make_buefy_plugin()}
${make_buefy_components()}
## special global components, used by WholePage
${self.make_menu_search_component()}
${page_help.render_template()}
${page_help.declare_vars()}
% if request.has_perm('common.feedback'):
${self.make_feedback_component()}
% endif
## DEPRECATED; called for back-compat
${self.render_whole_page_template()} ${self.render_whole_page_template()}
## DEPRECATED; called for back-compat
${self.declare_whole_page_vars()} ${self.declare_whole_page_vars()}
</%def>
## DEPRECATED; remains for back-compat
<%def name="render_whole_page_template()">
${self.render_vue_template_whole_page()}
${self.render_vue_script_whole_page()}
</%def>
<%def name="modify_vue_vars()">
## DEPRECATED; called for back-compat
${self.modify_whole_page_vars()} ${self.modify_whole_page_vars()}
## ${self.finalize_whole_page_vars()} </%def>
<%def name="make_vue_components()">
${page_help.make_component()} ${page_help.make_component()}
## ${multi_file_upload.make_component()} ## ${multi_file_upload.make_component()}
## DEPRECATED; called for back-compat (?)
${self.make_whole_page_component()}
</%def>
## DEPRECATED; remains for back-compat
<%def name="make_whole_page_component()">
<script> <script>
WholePage.data = () => { return WholePageData } WholePage.data = () => { return WholePageData }
</script> </script>
<% request.register_component('whole-page', 'WholePage') %> <% request.register_component('whole-page', 'WholePage') %>
</%def> </%def>
<%def name="make_vue_app()">
## DEPRECATED; called for back-compat
${self.make_whole_page_app()}
</%def>
## DEPRECATED; remains for back-compat
<%def name="make_whole_page_app()"> <%def name="make_whole_page_app()">
<script type="module"> <script type="module">
import {createApp} from 'vue' import {createApp} from 'vue'
@ -1223,3 +1247,11 @@
app.mount('#app') app.mount('#app')
</script> </script>
</%def> </%def>
##############################
## DEPRECATED
##############################
<%def name="declare_whole_page_vars()"></%def>
<%def name="modify_whole_page_vars()"></%def>

11
tailbone/templates/trainwreck/transactions/configure.mako
View file

@ -62,14 +62,9 @@
</div> </div>
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
ThisPageData.hiddenDatabases = ${json.dumps(hidden_databases)|n} ThisPageData.hiddenDatabases = ${json.dumps(hidden_databases)|n}
</script> </script>
</%def> </%def>
${parent.body()}

11
tailbone/templates/trainwreck/transactions/rollover.mako
View file

@ -48,14 +48,9 @@
</b-table> </b-table>
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
ThisPageData.engines = ${json.dumps(engines_data)|n} ThisPageData.engines = ${json.dumps(engines_data)|n}
</script> </script>
</%def> </%def>
${parent.body()}

10
tailbone/templates/trainwreck/transactions/view.mako
View file

@ -1,15 +1,11 @@
## -*- coding: utf-8; -*- ## -*- coding: utf-8; -*-
<%inherit file="/master/view.mako" /> <%inherit file="/master/view.mako" />
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
% if custorder_xref_markers_data is not Undefined: % if custorder_xref_markers_data is not Undefined:
${form.vue_component}Data.custorderXrefMarkersData = ${json.dumps(custorder_xref_markers_data)|n} ${form.vue_component}Data.custorderXrefMarkersData = ${json.dumps(custorder_xref_markers_data)|n}
% endif % endif
</script> </script>
</%def> </%def>
${parent.body()}

11
tailbone/templates/trainwreck/transactions/view_row.mako
View file

@ -1,16 +1,11 @@
## -*- coding: utf-8; -*- ## -*- coding: utf-8; -*-
<%inherit file="/master/view_row.mako" /> <%inherit file="/master/view_row.mako" />
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
% if discounts_data is not Undefined: % if discounts_data is not Undefined:
${form.vue_component}Data.discountsData = ${json.dumps(discounts_data)|n} ${form.vue_component}Data.discountsData = ${json.dumps(discounts_data)|n}
% endif % endif
</script> </script>
</%def> </%def>
${parent.body()}

13
tailbone/templates/units-of-measure/index.mako
View file

@ -51,20 +51,17 @@
% endif % endif
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
% if master.has_perm('collect_wild_uoms'): % if master.has_perm('collect_wild_uoms'):
<script type="text/javascript"> <script>
TailboneGridData.showingCollectWildDialog = false ${grid.vue_component}Data.showingCollectWildDialog = false
TailboneGrid.methods.collectFromWild = function() { ${grid.vue_component}.methods.collectFromWild = function() {
this.$refs['collect-wild-uoms-form'].submit() this.$refs['collect-wild-uoms-form'].submit()
} }
</script> </script>
% endif % endif
</%def> </%def>
${parent.body()}

9
tailbone/templates/upgrades/configure.mako
View file

@ -111,9 +111,9 @@
</div> </div>
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
ThisPageData.upgradeSystems = ${json.dumps(upgrade_systems)|n} ThisPageData.upgradeSystems = ${json.dumps(upgrade_systems)|n}
ThisPageData.upgradeSystemShowDialog = false ThisPageData.upgradeSystemShowDialog = false
@ -161,6 +161,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

21
tailbone/templates/upgrades/view.mako
View file

@ -137,11 +137,11 @@
% endif % endif
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
TailboneFormData.showingPackages = 'diffs' ${form.vue_component}Data.showingPackages = 'diffs'
% if master.has_perm('execute'): % if master.has_perm('execute'):
@ -153,7 +153,7 @@
// execute upgrade // execute upgrade
////////////////////////////// //////////////////////////////
TailboneForm.props.upgradeExecuting = { ${form.vue_component}.props.upgradeExecuting = {
type: Boolean, type: Boolean,
default: false, default: false,
} }
@ -253,9 +253,9 @@
// execute upgrade // execute upgrade
////////////////////////////// //////////////////////////////
TailboneFormData.formSubmitting = false ${form.vue_component}Data.formSubmitting = false
TailboneForm.methods.submitForm = function() { ${form.vue_component}.methods.submitForm = function() {
this.formSubmitting = true this.formSubmitting = true
} }
@ -265,12 +265,12 @@
// declare failure // declare failure
////////////////////////////// //////////////////////////////
TailboneForm.props.declareFailureSubmitting = { ${form.vue_component}.props.declareFailureSubmitting = {
type: Boolean, type: Boolean,
default: false, default: false,
} }
TailboneForm.methods.declareFailureClick = function() { ${form.vue_component}.methods.declareFailureClick = function() {
this.$emit('declare-failure-click') this.$emit('declare-failure-click')
} }
@ -287,6 +287,3 @@
</script> </script>
</%def> </%def>
${parent.body()}

11
tailbone/templates/users/preferences.mako
View file

@ -42,14 +42,9 @@
</div> </div>
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
ThisPageData.themeStyleOptions = ${json.dumps(theme_style_options)|n} ThisPageData.themeStyleOptions = ${json.dumps(theme_style_options)|n}
</script> </script>
</%def> </%def>
${parent.body()}

9
tailbone/templates/users/view.mako
View file

@ -76,10 +76,10 @@
% endif % endif
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
% if master.has_perm('manage_api_tokens'): % if master.has_perm('manage_api_tokens'):
<script type="text/javascript"> <script>
${form.vue_component}.props.apiTokens = null ${form.vue_component}.props.apiTokens = null
@ -134,6 +134,3 @@
</script> </script>
% endif % endif
</%def> </%def>
${parent.body()}

11
tailbone/templates/vendors/configure.mako vendored
View file

@ -44,14 +44,9 @@
</div> </div>
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
ThisPageData.supportedVendorSettings = ${json.dumps(supported_vendor_settings)|n} ThisPageData.supportedVendorSettings = ${json.dumps(supported_vendor_settings)|n}
</script> </script>
</%def> </%def>
${parent.body()}

9
tailbone/templates/views/model/create.mako
View file

@ -259,9 +259,9 @@ def includeme(config):
</b-steps> </b-steps>
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
ThisPageData.activeStep = 'enter-details' ThisPageData.activeStep = 'enter-details'
@ -334,6 +334,3 @@ def includeme(config):
</script> </script>
</%def> </%def>
${parent.body()}

9
tailbone/templates/workorders/view.mako
View file

@ -145,9 +145,9 @@
</nav> </nav>
</%def> </%def>
<%def name="modify_this_page_vars()"> <%def name="modify_vue_vars()">
${parent.modify_this_page_vars()} ${parent.modify_vue_vars()}
<script type="text/javascript"> <script>
ThisPageData.receiveButtonDisabled = false ThisPageData.receiveButtonDisabled = false
ThisPageData.receiveButtonText = "I've received the order from customer" ThisPageData.receiveButtonText = "I've received the order from customer"
@ -216,6 +216,3 @@
</script> </script>
</%def> </%def>
${parent.body()}