Merge pull request #46 from ZeusWPI/products_list

Products list

app/assets/stylesheets/products.css.scss

@@ -22,3 +22,13 @@
   margin-bottom: 20px;
 }
 
+#products-table .form-group {
+  margin-bottom: 0;
+}
+
+#products-table tr {
+  height: 57px;
+  td {
+    vertical-align: middle;
+  }
+}

app/controllers/products_controller.rb

@@ -1,6 +1,8 @@
 class ProductsController < ApplicationController
   load_and_authorize_resource
 
+  respond_to :html, :js
+
   def new
     @product = Product.new
   end
@@ -17,20 +19,20 @@ class ProductsController < ApplicationController
   def index
     @products = Product.all
     @categories = Product.categories
+    if current_user.admin?
+      render 'products_list/listview'
+    end
   end
 
   def edit
     @product = Product.find(params[:id])
+    respond_with @product
   end
 
   def update
     @product = Product.find(params[:id])
-    if @product.update_attributes(product_params)
+    @product.update_attributes product_params
-      flash[:success] = "Succesfully updated product"
+    respond_with @product
-      redirect_to products_path
-    else
-      render 'edit'
-    end
   end
 
   def destroy

app/models/product.rb

@@ -17,7 +17,7 @@
 
 class Product < ActiveRecord::Base
   has_many :order_items
-  has_attached_file :avatar, styles: { dagschotel: "80x80>", medium: "100x100>" }, default_style: :medium
+  has_attached_file :avatar, styles: { dagschotel: "80x80>", medium: "100x100>", small: "40x40>" }, default_style: :medium
 
   enum category: %w(food beverages other)
 

app/views/application/_errors.html.erb

@@ -0,0 +1,14 @@
+<% if object.errors.any? %>
+    <div class="panel panel-danger form-errors">
+    <div class="panel-heading">
+      <%= pluralize(object.errors.count, "error") %> prohibited this <%= object.class.name.downcase %> from being saved:
+    </div>
+    <div class="panel-body">
+      <ul>
+        <% object.errors.full_messages.each do |msg| %>
+            <li><%= msg %></li>
+        <% end %>
+      </ul>
+    </div>
+  </div>
+<% end %>

app/views/products/edit.js.erb

@@ -0,0 +1 @@
+$("#products_row_<%= dom_id(@product) %>").replaceWith("<%= j render "products_list/product_edit_row", product: @product %>")

app/views/products/update.js.erb

@@ -0,0 +1,6 @@
+<% if @product.errors.any? %>
+    $('#products-errors').html("<%= j render 'errors', object: @product %>")
+<% else %>
+  $('#products-errors').html('')
+  $("#products_row_<%= dom_id(@product) %>").replaceWith("<%= j render 'products_list/product_row', product: @product %>");
+<% end %>

app/views/products_list/_product_edit_row.html.erb

@@ -0,0 +1,20 @@
+<tr id="products_row_<%= dom_id(product) %>">
+  <%= f_form_for product, remote: true do |f| %>
+    <td><%= image_tag product.avatar(:small) %></td>
+    <td><%= f.text_field :name, skip_label: true %></td>
+    <td><%= f.price_field :price, skip_label: true %></td>
+    <td><%= f.number_field :stock, skip_label: true %></td>
+    <td><%= f.button "Update", class: "btn btn-primary" %></td>
+    <%= javascript_tag do %>
+      var id = "#edit_<%= dom_id(product) %>";
+      var inputs = $(id).parent().find('input');
+
+      $(id).parent().find('button').on('click', function(e) {
+      e.preventDefault();
+      $(id).append(inputs.clone());
+      $(id).append('<input type="hidden" name="_method" value="patch">');
+      $(id).submit();
+      });
+    <% end %>
+  <% end %>
+</tr>

app/views/products_list/_product_row.html.erb

@@ -0,0 +1,7 @@
+<tr id="products_row_<%= dom_id(product) %>">
+  <td><%= image_tag product.avatar(:small) %></td>
+  <td><%= product.name %></td>
+  <td><%= euro(product.price) %></td>
+  <td><%= product.stock %></td>
+  <td><%= button_to "Edit", edit_product_path(product), method: :get, class: "btn btn-default", remote: true %></td>
+</tr>

app/views/products_list/listview.html.erb

@@ -0,0 +1,18 @@
+<div id="products-errors"></div>
+<div class="row products">
+  <div class="col-md-8 col-md-offset-2">
+    <h1>Products</h1>
+    <%= render partial: 'flash' %>
+
+    <table id="products-table" class="table table-striped">
+      <tr>
+        <th></th>
+        <th>Name</th>
+        <th>Price</th>
+        <th>Stock</th>
+        <th></th>
+      </tr>
+      <%= render partial: 'products_list/product_row', collection: @products, as: :product %>
+    </table>
+  </div>
+</div>