BPUR: Visually differentiate products and variants in table

This commit is contained in:
Rob H
2013-06-21 09:37:05 +05:30
committed by Rohan Mitchell
parent 5d30df5717
commit f750251cb8
3 changed files with 20 additions and 3 deletions

View File

@@ -68,6 +68,8 @@ productsApp.directive('ngTrackVariant', function(){
productsApp.directive('ngToggleVariants',function(){
return {
link: function(scope,element,attrs){
if (scope.displayProperties[scope.product.id].showVariants) { element.removeClass('icon-chevron-right'); element.addClass('icon-chevron-down'); }
else { element.removeClass('icon-chevron-down'); element.addClass('icon-chevron-right'); }
element.bind('click', function(){
scope.$apply(function(){
if (scope.displayProperties[scope.product.id].showVariants){

View File

@@ -5,3 +5,18 @@
th.firstcol, td.firstcol {
border-left: 1px solid #cee1f4;
}
tbody.odd {
tr.product { td { background-color: white; } }
tr.variant.odd { td { background-color: lighten(#eff5fc, 3); } }
tr.variant.even { td { background-color: white; } }
}
tbody.even {
tr.product { td { background-color: darken(#eff5fc, 1); } }
tr.variant.odd { td { background-color: lighten(#eff5fc, 2); } }
tr.variant.even { td { background-color: darken(#eff5fc, 1); } }
}
tbody tr.product td.actions { background-color: transparent; }
tbody tr.variant td.actions { background-color: transparent; }
tbody tr.variant td { padding: 5px 10px; }

View File

@@ -27,8 +27,8 @@
%th On Hand
%th Av. On
%th.actions
%tbody{ 'ng-repeat' => 'product in products | filter:query' }
%tr
%tbody{ 'ng-repeat' => 'product in products | filter:query', 'ng-class-even' => "'even'", 'ng-class-odd' => "'odd'" }
%tr.product
%td.actions
%a{ 'ng-toggle-variants' => 'true', :class => "view-variants icon-chevron-right", 'ng-show' => 'hasVariants(product)' }
%td.firstcol
@@ -46,7 +46,7 @@
%a{ 'ng-click' => 'editWarn(product)', :class => "edit-product icon-edit no-text" }
%a{ 'ng-click' => 'cloneProduct(product)', :class => "clone-product icon-copy no-text" }
%a{ 'ng-click' => 'deleteProduct(product)', :class => "delete-product icon-trash no-text" }
%tr{ 'ng-repeat' => 'variant in product.variants', 'ng-show' => 'displayProperties[product.id].showVariants' }
%tr.variant{ 'ng-repeat' => 'variant in product.variants', 'ng-show' => 'displayProperties[product.id].showVariants', 'ng-class-even' => "'even'", 'ng-class-odd' => "'odd'" }
%td.actions
%a{ :class => "variant-item icon-caret-right" }
%td.firstcol