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

Refactor tempmon probe view template, per Buefy

Browse source
This commit is contained in:
Lance Edgar 2019-06-15 15:51:25 -05:00
parent a8b83d9fe1
commit 4b2abf791c
1 changed files with 100 additions and 32 deletions
Download patch file Download diff file Expand all files Collapse all files

132
tailbone/templates/tempmon/probes/view.mako
View file

@ -1,46 +1,89 @@
## -*- coding: utf-8; -*- ## -*- coding: utf-8; -*-
<%inherit file="/master/view.mako" /> <%inherit file="/master/view.mako" />
############################## <%def name="render_form_complete()">
## page body % if use_buefy:
##############################
<div style="display: flex; justify-content: space-between;"> ## ${self.render_form()}
<div class="form-wrapper"> <script type="text/x-template" id="form-page-template">
<div style="display: flex; flex-direction: column;"> <div style="display: flex; justify-content: space-between;">
<div class="form-wrapper">
<div style="display: flex; flex-direction: column;">
<nav class="panel" id="probe-main">
<p class="panel-heading">General</p>
<div class="panel-block">
<div>
${self.render_main_fields(form)}
</div>
</div>
</nav>
<div style="display: flex;">
<div class="panel-wrapper">
${self.left_column()}
</div>
<div class="panel-wrapper" style="margin-left: 1em;"> <!-- right column -->
${self.right_column()}
</div>
</div>
</div>
</div>
<ul id="context-menu">
${self.context_menu_items()}
</ul>
</div>
</script>
<div id="form-page-app">
<form-page></form-page>
</div>
% else:
## legacy / not buefy
<div style="display: flex; justify-content: space-between;">
<div class="form-wrapper">
<div style="display: flex; flex-direction: column;">
<div class="panel" id="probe-main">
<h2>General</h2>
<div class="panel-body">
<div>
${self.render_main_fields(form)}
</div>
</div>
</div>
<div style="display: flex;">
<div class="panel-wrapper">
${self.left_column()}
</div>
<div class="panel-wrapper" style="margin-left: 1em;"> <!-- right column -->
${self.right_column()}
</div>
</div>
<div class="panel" id="probe-main">
<h2>General</h2>
<div class="panel-body">
<div>
${self.render_main_fields(form)}
</div> </div>
</div> </div>
<ul id="context-menu">
${self.context_menu_items()}
</ul>
</div> </div>
% endif
</%def>
<div style="display: flex;">
<div class="panel-wrapper">
${self.left_column()}
</div>
<div class="panel-wrapper" style="margin-left: 1em;"> <!-- right column -->
${self.right_column()}
</div>
</div>
</div>
</div>
<ul id="context-menu">
${self.context_menu_items()}
</ul>
</div>
% if master.has_rows:
${rows_grid|n}
% endif
############################## ##############################
## rendering methods ## rendering methods
@ -67,21 +110,43 @@
</%def> </%def>
<%def name="left_column()"> <%def name="left_column()">
% if use_buefy:
<nav class="panel">
<p class="panel-heading">Temperatures</p>
<div class="panel-block">
<div>
${self.render_temperature_fields(form)}
</div>
</div>
</nav>
% else:
<div class="panel"> <div class="panel">
<h2>Temperatures</h2> <h2>Temperatures</h2>
<div class="panel-body"> <div class="panel-body">
${self.render_temperature_fields(form)} ${self.render_temperature_fields(form)}
</div> </div>
</div> </div>
% endif
</%def> </%def>
<%def name="right_column()"> <%def name="right_column()">
% if use_buefy:
<nav class="panel">
<p class="panel-heading">Timeouts</p>
<div class="panel-block">
<div>
${self.render_timeout_fields(form)}
</div>
</div>
</nav>
% else:
<div class="panel"> <div class="panel">
<h2>Timeouts</h2> <h2>Timeouts</h2>
<div class="panel-body"> <div class="panel-body">
${self.render_timeout_fields(form)} ${self.render_timeout_fields(form)}
</div> </div>
</div> </div>
% endif
</%def> </%def>
<%def name="render_temperature_fields(form)"> <%def name="render_temperature_fields(form)">
@ -98,3 +163,6 @@
${form.render_field_readonly('critical_min_timeout')} ${form.render_field_readonly('critical_min_timeout')}
${form.render_field_readonly('error_timeout')} ${form.render_field_readonly('error_timeout')}
</%def> </%def>
${parent.body()}