Add panels to product details view, etc.
This commit is contained in:
parent
86db5181b8
commit
3b9efe0ffb
|
@ -62,3 +62,28 @@ body > #body-wrapper {
|
||||||
display: block;
|
display: block;
|
||||||
margin: 40px auto;
|
margin: 40px auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/******************************
|
||||||
|
* Panels
|
||||||
|
******************************/
|
||||||
|
|
||||||
|
.panel {
|
||||||
|
border-bottom: 1px solid Black;
|
||||||
|
border-left: 1px solid Black;
|
||||||
|
border-right: 1px solid Black;
|
||||||
|
margin-bottom: 15px;
|
||||||
|
padding: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.panel h2 {
|
||||||
|
border-top: 1px solid Black;
|
||||||
|
border-bottom: 1px solid Black;
|
||||||
|
margin: 0px;
|
||||||
|
padding: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.panel-body {
|
||||||
|
overflow: auto;
|
||||||
|
padding: 5px;
|
||||||
|
}
|
||||||
|
|
|
@ -1,13 +1,7 @@
|
||||||
## -*- coding: utf-8 -*-
|
## -*- coding: utf-8 -*-
|
||||||
|
<%namespace file="/forms/lib.mako" import="render_field_readonly" />
|
||||||
<div class="fieldset">
|
<div class="fieldset">
|
||||||
% for field in fieldset.render_fields.itervalues():
|
% for field in fieldset.render_fields.itervalues():
|
||||||
% if field.requires_label:
|
${render_field_readonly(field)}
|
||||||
<div class="field-wrapper ${field.name}">
|
|
||||||
${field.label_tag()|n}
|
|
||||||
<div class="field">
|
|
||||||
${field.render_readonly()}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
% endif
|
|
||||||
% endfor
|
% endfor
|
||||||
</div>
|
</div>
|
||||||
|
|
12
tailbone/templates/forms/lib.mako
Normal file
12
tailbone/templates/forms/lib.mako
Normal file
|
@ -0,0 +1,12 @@
|
||||||
|
## -*- coding: utf-8 -*-
|
||||||
|
|
||||||
|
<%def name="render_field_readonly(field)">
|
||||||
|
% if field.requires_label:
|
||||||
|
<div class="field-wrapper ${field.name}">
|
||||||
|
${field.label_tag()|n}
|
||||||
|
<div class="field">
|
||||||
|
${field.render_readonly()}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
% endif
|
||||||
|
</%def>
|
|
@ -1,81 +1,162 @@
|
||||||
## -*- coding: utf-8 -*-
|
## -*- coding: utf-8 -*-
|
||||||
<%inherit file="/products/crud.mako" />
|
<%inherit file="/products/crud.mako" />
|
||||||
|
<%namespace file="/forms/lib.mako" import="render_field_readonly" />
|
||||||
|
|
||||||
<%def name="head_tags()">
|
<%def name="head_tags()">
|
||||||
${parent.head_tags()}
|
${parent.head_tags()}
|
||||||
<style type="text/css">
|
<style type="text/css">
|
||||||
|
#product-main {
|
||||||
|
width: 80%;
|
||||||
|
}
|
||||||
#product-image {
|
#product-image {
|
||||||
float: left;
|
float: left;
|
||||||
margin-left: 250px;
|
margin-left: 300px;
|
||||||
margin-top: 40px;
|
}
|
||||||
|
.panel-wrapper {
|
||||||
|
float: left;
|
||||||
|
margin-right: 15px;
|
||||||
|
width: 45%;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
</%def>
|
</%def>
|
||||||
|
|
||||||
|
<% product = form.fieldset.model %>
|
||||||
|
|
||||||
|
<%def name="render_organization_fields(form)">
|
||||||
|
${render_field_readonly(form.fieldset.department)}
|
||||||
|
${render_field_readonly(form.fieldset.subdepartment)}
|
||||||
|
${render_field_readonly(form.fieldset.category)}
|
||||||
|
${render_field_readonly(form.fieldset.family)}
|
||||||
|
${render_field_readonly(form.fieldset.report_code)}
|
||||||
|
</%def>
|
||||||
|
|
||||||
|
<%def name="render_price_fields(form)">
|
||||||
|
${render_field_readonly(form.fieldset.regular_price)}
|
||||||
|
${render_field_readonly(form.fieldset.current_price)}
|
||||||
|
${render_field_readonly(form.fieldset.deposit_link)}
|
||||||
|
${render_field_readonly(form.fieldset.tax)}
|
||||||
|
</%def>
|
||||||
|
|
||||||
|
<%def name="render_flag_fields(form)">
|
||||||
|
${render_field_readonly(form.fieldset.weighed)}
|
||||||
|
${render_field_readonly(form.fieldset.discountable)}
|
||||||
|
${render_field_readonly(form.fieldset.special_order)}
|
||||||
|
${render_field_readonly(form.fieldset.organic)}
|
||||||
|
${render_field_readonly(form.fieldset.not_for_sale)}
|
||||||
|
${render_field_readonly(form.fieldset.deleted)}
|
||||||
|
</%def>
|
||||||
|
|
||||||
<div class="form-wrapper">
|
<div class="form-wrapper">
|
||||||
<ul class="context-menu">
|
<ul class="context-menu">
|
||||||
${self.context_menu_items()}
|
${self.context_menu_items()}
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
${form.render()|n}
|
<div class="panel" id="product-main">
|
||||||
|
<h2>Product</h2>
|
||||||
% if image:
|
<div class="panel-body">
|
||||||
${h.image(image_url, "Product Image", id='product-image', path=image_path, use_pil=True)}
|
<div style="clear: none; float: left;">
|
||||||
% endif
|
${render_field_readonly(form.fieldset.upc)}
|
||||||
</div>
|
${render_field_readonly(form.fieldset.brand)}
|
||||||
|
${render_field_readonly(form.fieldset.description)}
|
||||||
<% product = form.fieldset.model %>
|
${render_field_readonly(form.fieldset.unit_size)}
|
||||||
|
${render_field_readonly(form.fieldset.unit_of_measure)}
|
||||||
<div id="product-codes">
|
${render_field_readonly(form.fieldset.size)}
|
||||||
<h2>Product Codes:</h2>
|
${render_field_readonly(form.fieldset.case_pack)}
|
||||||
% if product.codes:
|
|
||||||
<div class="grid hoverable">
|
|
||||||
<table>
|
|
||||||
<thead>
|
|
||||||
<th>Code</th>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
% for i, code in enumerate(product.codes, 1):
|
|
||||||
<tr class="${'odd' if i % 2 else 'even'}">
|
|
||||||
<td>${code}</td>
|
|
||||||
</tr>
|
|
||||||
% endfor
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
</div>
|
||||||
% else:
|
% if image:
|
||||||
<p>None on file.</p>
|
${h.image(image_url, "Product Image", id='product-image', path=image_path, use_pil=True)}
|
||||||
% endif
|
% endif
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div id="product-costs">
|
<div class="panel-wrapper"> <!-- left column -->
|
||||||
<h2>Product Costs:</h2>
|
|
||||||
% if product.costs:
|
<div class="panel">
|
||||||
<div class="grid hoverable">
|
<h2>Organization</h2>
|
||||||
<table>
|
<div class="panel-body">
|
||||||
<thead>
|
${self.render_organization_fields(form)}
|
||||||
<th>Pref.</th>
|
|
||||||
<th>Vendor</th>
|
|
||||||
<th>Code</th>
|
|
||||||
<th>Case Size</th>
|
|
||||||
<th>Case Cost</th>
|
|
||||||
<th>Unit Cost</th>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
% for i, cost in enumerate(product.costs, 1):
|
|
||||||
<tr class="${'odd' if i % 2 else 'even'}">
|
|
||||||
<td class="center">${'X' if cost.preference == 1 else ''}</td>
|
|
||||||
<td>${cost.vendor}</td>
|
|
||||||
<td class="center">${cost.code}</td>
|
|
||||||
<td class="center">${cost.case_size}</td>
|
|
||||||
<td class="right">${'$ %0.2f' % cost.case_cost if cost.case_cost is not None else ''}</td>
|
|
||||||
<td class="right">${'$ %0.4f' % cost.unit_cost if cost.unit_cost is not None else ''}</td>
|
|
||||||
</tr>
|
|
||||||
% endfor
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
</div>
|
||||||
% else:
|
</div>
|
||||||
<p>None on file.</p>
|
|
||||||
|
<div class="panel">
|
||||||
|
<h2>Flags</h2>
|
||||||
|
<div class="panel-body">
|
||||||
|
${self.render_flag_fields(form)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div> <!-- left column -->
|
||||||
|
|
||||||
|
<div class="panel-wrapper"> <!-- right column -->
|
||||||
|
|
||||||
|
<div class="panel">
|
||||||
|
<h2>Pricing</h2>
|
||||||
|
<div class="panel-body">
|
||||||
|
${self.render_price_fields(form)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="panel" id="product-costs">
|
||||||
|
<h2>Vendor Sources</h2>
|
||||||
|
<div class="panel-body">
|
||||||
|
% if product.costs:
|
||||||
|
<div class="grid hoverable">
|
||||||
|
<table>
|
||||||
|
<thead>
|
||||||
|
<th>Pref.</th>
|
||||||
|
<th>Vendor</th>
|
||||||
|
<th>Code</th>
|
||||||
|
<th>Case Size</th>
|
||||||
|
<th>Case Cost</th>
|
||||||
|
<th>Unit Cost</th>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
% for i, cost in enumerate(product.costs, 1):
|
||||||
|
<tr class="${'odd' if i % 2 else 'even'}">
|
||||||
|
<td class="center">${'X' if cost.preference == 1 else ''}</td>
|
||||||
|
<td>${cost.vendor}</td>
|
||||||
|
<td class="center">${cost.code}</td>
|
||||||
|
<td class="center">${cost.case_size}</td>
|
||||||
|
<td class="right">${'$ %0.2f' % cost.case_cost if cost.case_cost is not None else ''}</td>
|
||||||
|
<td class="right">${'$ %0.4f' % cost.unit_cost if cost.unit_cost is not None else ''}</td>
|
||||||
|
</tr>
|
||||||
|
% endfor
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
% else:
|
||||||
|
<p>None on file.</p>
|
||||||
|
% endif
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="panel" id="product-codes">
|
||||||
|
<h2>Additional Lookup Codes</h2>
|
||||||
|
<div class="panel-body">
|
||||||
|
% if product.codes:
|
||||||
|
<div class="grid hoverable">
|
||||||
|
<table>
|
||||||
|
<thead>
|
||||||
|
<th>Code</th>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
% for i, code in enumerate(product.codes, 1):
|
||||||
|
<tr class="${'odd' if i % 2 else 'even'}">
|
||||||
|
<td>${code}</td>
|
||||||
|
</tr>
|
||||||
|
% endfor
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
% else:
|
||||||
|
<p>None on file.</p>
|
||||||
|
% endif
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div> <!-- right column -->
|
||||||
|
|
||||||
|
% if buttons:
|
||||||
|
${buttons|n}
|
||||||
% endif
|
% endif
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -279,8 +279,9 @@ class ProductCrud(CrudView):
|
||||||
fs.upc.label("UPC"),
|
fs.upc.label("UPC"),
|
||||||
fs.brand.with_renderer(BrandFieldRenderer),
|
fs.brand.with_renderer(BrandFieldRenderer),
|
||||||
fs.description,
|
fs.description,
|
||||||
fs.size,
|
fs.unit_size,
|
||||||
fs.unit_of_measure.label("Unit of Measure"),
|
fs.unit_of_measure.label("Unit of Measure"),
|
||||||
|
fs.size,
|
||||||
fs.weighed,
|
fs.weighed,
|
||||||
fs.case_pack,
|
fs.case_pack,
|
||||||
fs.department,
|
fs.department,
|
||||||
|
|
Loading…
Reference in a new issue