Add panels to product details view, etc.
This commit is contained in:
		
							parent
							
								
									86db5181b8
								
							
						
					
					
						commit
						3b9efe0ffb
					
				
					 5 changed files with 181 additions and 68 deletions
				
			
		|  | @ -62,3 +62,28 @@ body > #body-wrapper { | |||
|     display: block; | ||||
|     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 -*- | ||||
| <%namespace file="/forms/lib.mako" import="render_field_readonly" /> | ||||
| <div class="fieldset"> | ||||
|   % for field in fieldset.render_fields.itervalues(): | ||||
|       % if field.requires_label: | ||||
|           <div class="field-wrapper ${field.name}"> | ||||
|             ${field.label_tag()|n} | ||||
|             <div class="field"> | ||||
|               ${field.render_readonly()} | ||||
|             </div> | ||||
|           </div> | ||||
|       % endif | ||||
|       ${render_field_readonly(field)} | ||||
|   % endfor | ||||
| </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,55 +1,104 @@ | |||
| ## -*- coding: utf-8 -*- | ||||
| <%inherit file="/products/crud.mako" /> | ||||
| <%namespace file="/forms/lib.mako" import="render_field_readonly" /> | ||||
| 
 | ||||
| <%def name="head_tags()"> | ||||
|   ${parent.head_tags()} | ||||
|   <style type="text/css"> | ||||
|     #product-main { | ||||
|         width: 80%; | ||||
|     } | ||||
|     #product-image { | ||||
|         float: left; | ||||
|         margin-left: 250px; | ||||
|         margin-top: 40px; | ||||
|         margin-left: 300px; | ||||
|     } | ||||
|     .panel-wrapper { | ||||
|         float: left; | ||||
|         margin-right: 15px; | ||||
|         width: 45%; | ||||
|     } | ||||
|   </style> | ||||
| </%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"> | ||||
|   <ul class="context-menu"> | ||||
|     ${self.context_menu_items()} | ||||
|   </ul> | ||||
| 
 | ||||
|   ${form.render()|n} | ||||
| 
 | ||||
|   <div class="panel" id="product-main"> | ||||
|     <h2>Product</h2> | ||||
|     <div class="panel-body"> | ||||
|       <div style="clear: none; float: left;"> | ||||
|         ${render_field_readonly(form.fieldset.upc)} | ||||
|         ${render_field_readonly(form.fieldset.brand)} | ||||
|         ${render_field_readonly(form.fieldset.description)} | ||||
|         ${render_field_readonly(form.fieldset.unit_size)} | ||||
|         ${render_field_readonly(form.fieldset.unit_of_measure)} | ||||
|         ${render_field_readonly(form.fieldset.size)} | ||||
|         ${render_field_readonly(form.fieldset.case_pack)} | ||||
|       </div> | ||||
|       % if image: | ||||
|           ${h.image(image_url, "Product Image", id='product-image', path=image_path, use_pil=True)} | ||||
|       % endif | ||||
|     </div> | ||||
| 
 | ||||
| <% product = form.fieldset.model %> | ||||
| 
 | ||||
| <div id="product-codes"> | ||||
|   <h2>Product Codes:</h2> | ||||
|   % 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 id="product-costs"> | ||||
|   <h2>Product Costs:</h2> | ||||
|   <div class="panel-wrapper"> <!-- left column --> | ||||
| 
 | ||||
|     <div class="panel"> | ||||
|       <h2>Organization</h2> | ||||
|       <div class="panel-body"> | ||||
|         ${self.render_organization_fields(form)} | ||||
|       </div> | ||||
|     </div> | ||||
| 
 | ||||
|     <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> | ||||
|  | @ -79,3 +128,35 @@ | |||
|             <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 | ||||
| </div> | ||||
|  |  | |||
|  | @ -279,8 +279,9 @@ class ProductCrud(CrudView): | |||
|                 fs.upc.label("UPC"), | ||||
|                 fs.brand.with_renderer(BrandFieldRenderer), | ||||
|                 fs.description, | ||||
|                 fs.size, | ||||
|                 fs.unit_size, | ||||
|                 fs.unit_of_measure.label("Unit of Measure"), | ||||
|                 fs.size, | ||||
|                 fs.weighed, | ||||
|                 fs.case_pack, | ||||
|                 fs.department, | ||||
|  |  | |||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue
	
	 Lance Edgar
						Lance Edgar