Add push buttons and support inactive products

2015-03-24 14:53:02 +01:00
parent b0bab98be8
commit e720d6b31c
22 changed files with 74 additions and 21 deletions
@@ -2,7 +2,7 @@ App.MenuProductComponent = Ember.Component.extend
  editMode: false
  code_filter: ''
  classNames: 'menu-product-container'
-  classNameBindings: ['menu_product_class', 'editMode:editing']
+  classNameBindings: ['menu_product_class', 'editMode:editing', 'product.active:active:inactive']
  showProduct: (->
    return true unless filter = @get('code_filter')
    (@get('product.code') || "").toLowerCase().indexOf(filter.toLowerCase()) >= 0
@@ -16,7 +16,7 @@ App.MenuProductComponent = Ember.Component.extend
      pre_code = code.substring(0,index)
      highlight = code.substring(index,index + filter.length)
      post_code = code.substring(index + filter.length)
-      new Ember.Handlebars.SafeString("#{pre_code}<span class='highlight'>#{highlight}</span>#{post_code}")
+      "#{pre_code}<span class='highlight'>#{highlight}</span>#{post_code}".htmlSafe()
    else
      code
  ).property('code_filter')
@@ -1,10 +1,11 @@
 attr = DS.attr
 App.Product = DS.Model.extend Ember.Validations.Mixin,
  name: attr 'string'
-  price: attr 'number'
+  price: attr 'number', defaultValue: 0
  code: attr 'string'
  description: attr 'string'
  visible: attr('boolean', defaultValue: true)
+  active: attr('boolean', defaultValue: true)
  position: attr('number', defaultValue: 0)
  image: attr()
  product_category: DS.belongsTo('product_category')
@@ -23,5 +24,8 @@ App.Product = DS.Model.extend Ember.Validations.Mixin,
    #true
  #).property('price')
  validations:
-    name: {presence: true}
-    price: {format: /^[+-]?\d+(\.?\d?\d)?$/}
+    name:
+      presence: true
+    price:
+      format:
+        width: /^[+-]?\d*(\.?\d?\d)?$/
@@ -4,13 +4,16 @@ if editMode
      = input value=product.name placeholder=namePlaceholder action="save"
      = errors product.errors.name
    .small-3.columns.price
-      = edit-currency value=product.price validatePresence=true action="save"
+      = edit-currency value=product.price action="save"
      = errors product.errors.price
    .small-3.columns.code= input value=product.code placeholder=codePlaceholder
    .small-3.columns.actions
      a.rollback-product-action{action "rollbackProduct"}: span
      a.destroy-product-action{action "destroyProduct" product}: span
      a.save-product-action{action "save"}: span
+  .row
+    .small-4.large-2.columns= t 'attributes.product.active'
+    .small-8.large-10.columns: view boolean-switch value=product.active
  .row.menu-product-container
    .medium-4.small-6.columns
      = view "upload-file" name="image" accept="image/*" file=product.image
@@ -27,5 +30,5 @@ else
        = errors product.errors.price includeAttribute="product"
      .small-3.columns: span= code_filter_display
      .small-3.columns
-        span.fa.fa-edit{action "makeEditable"}
+        a.edit-product-action{action "makeEditable"}: span
        /img src=product.image_src
@@ -11,7 +11,7 @@ each product_category in sorted_product_categories
      span.title= product_category.name
      span.availability= product_category.availability_text
      can manage menu
-        a.edit-product-category-button{action "editProductCategory" product_category} href="#"
+        a.edit-product-category-button{action "editProductCategory" product_category} href="#": span
        a.add-product-product_category-button{action "addProduct" product_category} href="#": span
    each product in product_category.sorted_products
      = menu-product product=product code_filter=product_code_filter
@@ -1,6 +1,6 @@
 App.MenuProductComponent = Ember.Component.extend
  tagName: 'li'
-  classNameBindings: ['specific_id']
+  classNameBindings: ['specific_id', 'product.active:active:inactive']
  specific_id: (-> "order-product-#{@get('product.id')}").property('product.id')
  orderProducts: false
  target: -> @get('parentView.targetObject')
@@ -4,6 +4,7 @@ App.Product = DS.Model.extend
  price: attr 'number'
  description: attr 'string'
  position: attr('number', defaultValue: 0)
+  active: attr 'boolean', defaultValue: true
  image: attr()
  product_category: DS.belongsTo('product_category')
  product_orders: DS.hasMany('product_order')
@@ -4,9 +4,12 @@ if product.description
 else
  span.no-product-description
 if orderProducts
+  if product.active
    a{action "addProduct" product}= product.name
    button.add-product-to-list{action "addProduct" product}
      span
+  else
+    a{action "showProductDescription" product}= product.name
 else
  span= product.name
 span.product-price.currency=currency product.price
@@ -5,3 +5,13 @@
@mixin table-fit
  width: 1px
  white-space: nowrap
+= button-shadow
+  transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1)
+  transition-delay: 0.2s
+  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26)
+= push-button($bg: $secondary-color, $padding: 10px)
+  +button($bg: $bg)
+  +button-shadow
+  padding: $padding
+  margin: 0
+  border-radius: $global-rounded
@@ -26,12 +26,20 @@
    .time-range
      color: rgb(39, 6, 121)
  .edit-product-category-button
+    +push-button($bg: $secondary-color, $padding: 5px)
+    color: $warning-color
+    font-size: 0.7em
+    vertical-align: top
+    span
      @extend .fa
      @extend .fa-lg
      @extend .fa-edit
  .add-product-product_category-button
-    float: right
-    margin-top: 1.2em
+    +push-button($bg: $secondary-color)
+    font-size: 0.7em
+    position: absolute
+    right: 10px
+    top: 0.6em
    span
      @extend .fa
      @extend .fa-lg
@@ -45,19 +53,29 @@
      color: rgb(39, 6, 121)

 .menu-product-container
+  &.inactive
+    color: #777
  &.editing
    box-shadow: 5px 5px 5px #555
    //border-left: 1px solid rgba(100,100,100,0.3)
    //border-top: 1px solid rgba(100,100,100,0.3)
    margin-left: -5px
    margin-top: -5px
+    margin-bottom: 16px
    background-color: #ccc
    padding: 5px
    z-index: 722
  .highlight
    text-decoration: underline
    font-weight: bold
+  .edit-product-action
+    +push-button($bg: $secondary-color)
+    padding: 4px
+    font-size: 0.7em
+    span
+      @extend .fa, .fa-edit
  .rollback-product-action
+    +push-button($bg: $secondary-color)
    color: $warning-color
    margin-right: 12px
    span
@@ -65,6 +83,7 @@
      @extend .fa-lg
      @extend .fa-undo
  .destroy-product-action
+    +push-button($bg: $secondary-color)
    color: $alert-color
    margin-right: 12px
    span
@@ -76,6 +95,7 @@
  input
    margin-bottom: 0
  .save-product-action
+    +push-button($bg: $secondary-color)
    color: $success-color
    span
      @extend .fa
@@ -16,6 +16,10 @@ ul.product_category-products
  list-style: none
  margin: 0 0 5px rem-calc(1.0)
 .product_category-products
+  .inactive
+    color: #777
+    a
+      color: #777
  .product-price
    float: right
  .show-product-description
@@ -27,7 +27,7 @@ class DashboardController < ApplicationController
    if Rails.env.test?
      @tables = Table.all
    else
-      @tables = List.active.map(&:table) | Supplier.find_by_name('Mozo').tables.select{|t| t.number.between? 20, 50}.sample(3)
+      @tables = List.active.map(&:table) | Supplier.find_by_name('Mozo').tables.select{|t| t.number.between? 20, 500}.sample(3)
    end
    respond_to do |format|
      format.html { render layout: 'phone' }
@@ -98,7 +98,7 @@ module Suppliers
    private

    def product_params
-      params.require(:product).permit(:name, :code, :price, :description, :image, :visible, :position, :product_category_id)
+      params.require(:product).permit(:name, :code, :price, :description, :image, :visible, :position, :active, :product_category_id)
    end
  end
 end
@@ -8,6 +8,7 @@ class Product
  property :price, type: Float
  property :description
  property :visible, type: :boolean, default: true
+  property :active, type: :boolean, default: true
  property :position, type: Fixnum

  belongs_to :product_category
@@ -19,7 +20,7 @@ class Product

  validates :name, presence: true
  validates :supplier_id, presence: true
-  validates :price, numericality: {greater_than: 0}
+  validates :price, numericality: true
  view :by_supplier_id_and_id, key: [:supplier_id, :_id]

  #after_save :persist_product_category_ids
@@ -1,5 +1,5 @@
 class ProductSerializer < Qwaiter::Serializer
-  attributes :name, :price, :description, :image, :code, :position, :visible, :product_category_id
+  attributes :name, :price, :description, :image, :code, :position, :visible, :active, :product_category_id

  def image
    if object.image.present?
@@ -48,6 +48,7 @@ en:
        code: Code
        price: Price
        description: Description
+        active: "Active?"
        visible: Visible?
        created_at: Created
        image: Image
@@ -47,6 +47,7 @@ nl:
        price: Prijs
        description: Omschrijving
        visible: Zichtbaar?
+        active: "Actief?"
        created_at: Aangemaakt
        image: Afbeelding
      list:
@@ -23,10 +23,15 @@ User

 - test met veel producten
 - product variants
+- option to make products inactive, no order plus and click on name
+  opens information
 - remove active orders on list close
 - fix ajaxError duplicity
 - rename "I am signed in as a user" to "there is a signed in user" in
  the specs
+- Kom in aanmerking voor vaste klanten acties!
+
+

 Bugs
 ----