changed the way products show
This commit is contained in:
parent
30b770b655
commit
c1f716ea77
|
|
@ -12,7 +12,11 @@ class ProductController < ShopController
|
|||
def show
|
||||
@product = Product.where('slug = ?', params[:id]).first
|
||||
raise_404(@product)
|
||||
render layout: false
|
||||
respond_to do |format|
|
||||
format.html
|
||||
format.js
|
||||
end
|
||||
|
||||
end
|
||||
|
||||
private
|
||||
|
|
|
|||
|
|
@ -9,20 +9,20 @@
|
|||
<div class="header">
|
||||
<figure style="min-height:338px; background-color: white;">
|
||||
<% if !product.images.blank? %>
|
||||
<%= link_to(image_tag(product.cover_image.image.url(:large), style: 'margin: auto;vertical-align: middle;display: inline-block;'), {controller: :product, action: :show, id: product.slug}, 'data-toggle': 'modal', 'data-target': ".productQuickView",
|
||||
<%= link_to(image_tag(product.cover_image.image.url(:large), style: 'margin: auto;vertical-align: middle;display: inline-block;'), {controller: :product, action: :show, id: product.slug}, remote: true, 'data-toggle': 'modal', 'data-target': ".productQuickView",
|
||||
style: 'line-height: 338px;') %>
|
||||
<% else %>
|
||||
<%= link_to(image_tag('kaktus.png'), {controller: :product, action: :show, id: product.slug}, 'data-toggle': 'modal', 'data-target': ".productQuickView") %>
|
||||
<%= link_to(image_tag('kaktus.png'), {controller: :product, action: :show, id: product.slug}, remote: true, 'data-toggle': 'modal', 'data-target': ".productQuickView") %>
|
||||
<% end %>
|
||||
</figure>
|
||||
<div class="icons">
|
||||
<%= raw link_to(raw('<i class="fa fa-search"></i>'), {controller: :product, action: :show, id: product.slug}, class: 'icon', 'data-toggle': 'modal', 'data-target': ".productQuickView") %>
|
||||
<%= raw link_to(raw('<i class="fa fa-search"></i>'), {controller: :product, action: :show, id: product.slug}, remote: true, class: 'icon', 'data-toggle': 'modal', 'data-target': ".productQuickView") %>
|
||||
<a class="icon" href="" onclick="addToCart(event,'<%= product.slug %>');">
|
||||
<i class="fa fa-cart-plus mr-5"></i>Dodaj do koszyka</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="caption">
|
||||
<h6 class="regular"><%= link_to(product.name, {controller: :product, action: :show, id: product.slug}, 'data-toggle': 'modal', 'data-target': ".productQuickView") %></h6>
|
||||
<h6 class="regular"><%= link_to(product.name, {controller: :product, action: :show, id: product.slug}, remote: true, 'data-toggle': 'modal', 'data-target': ".productQuickView") %></h6>
|
||||
<div class="price">
|
||||
<span class="amount text-primary">PLN
|
||||
<%= '%.2f' % product.price %></span>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,97 @@
|
|||
<div class="modal-dialog modal-lg" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
<h5><%= @product.name %></h5>
|
||||
</div>
|
||||
<!-- end modal-header -->
|
||||
<div class="modal-body">
|
||||
<div class="row">
|
||||
<div class="col-sm-5">
|
||||
<div class="carousel slide product-slider" data-ride="carousel" data-interval="false">
|
||||
<div class="carousel-inner">
|
||||
<% if @product.images.blank? %>
|
||||
<div class="item active">
|
||||
<figure>
|
||||
<%= image_tag 'kaktus.png' %>
|
||||
</figure>
|
||||
</div>
|
||||
<% else %>
|
||||
<% test = 0 %>
|
||||
<% @product.images.order('position').each do |image| %>
|
||||
<div class="item<%= test == 0 ? ' active' : '' %>">
|
||||
<figure>
|
||||
<%= image_tag image.image.url(:thickbox) %>
|
||||
</figure>
|
||||
</div>
|
||||
<% test = 1 %><% end %>
|
||||
<% end %>
|
||||
|
||||
<!-- Arrows -->
|
||||
<a class="left carousel-control" href=".product-slider" data-slide="prev">
|
||||
<span class="fa fa-angle-left"></span>
|
||||
</a>
|
||||
<a class="right carousel-control" href=".product-slider" data-slide="next">
|
||||
<span class="fa fa-angle-right"></span>
|
||||
</a>
|
||||
</div>
|
||||
<!-- end carousel-inner -->
|
||||
|
||||
<!-- thumbs -->
|
||||
<ol class="carousel-indicators mCustomScrollbar meartlab">
|
||||
<% if @product.images.blank? %>
|
||||
<li data-target=".product-slider" data-slide-to="0" class="active"><%= image_tag 'kaktus.png' %></li>
|
||||
<% else %>
|
||||
<% test = 0 %>
|
||||
<% @product.images.order('position').each do |image| %>
|
||||
<li data-target=".product-slider" data-slide-to="<%= test %>" <%= raw test == 0 ? ' class="active"' : '' %>><%= image_tag image.image.url(:medium) %></li>
|
||||
<% test += 1 %><% end %>
|
||||
<% end %>
|
||||
</ol>
|
||||
<!-- end carousel-indicators -->
|
||||
</div>
|
||||
<!-- end carousel -->
|
||||
</div>
|
||||
<!-- end col -->
|
||||
<div class="col-sm-7">
|
||||
<p class="text-gray alt-font">
|
||||
<strong>Kategoria:</strong>
|
||||
<%= @product.default_category.name %></p>
|
||||
<h4 class="text-primary">PLN
|
||||
<%= '%.2f' % @product.price %></h4>
|
||||
<p><%= raw @product.description %></p>
|
||||
<hr class="spacer-10">
|
||||
<div class="row">
|
||||
<div class="col-md-2 col-sm-4">
|
||||
Ilość:
|
||||
</div>
|
||||
<div class="col-md-4 col-sm-8">
|
||||
<select class="form-control" name="select" id="product_qty">
|
||||
<% for i in 1..@product.max_qty %>
|
||||
<option value="<%= i %>"><%= i %></option>
|
||||
<% end %>
|
||||
</select>
|
||||
</div>
|
||||
<!-- end col -->
|
||||
|
||||
</div>
|
||||
<!-- end row -->
|
||||
<hr class="spacer-10">
|
||||
<ul class="list list-inline">
|
||||
<li>
|
||||
<button type="button" class="btn btn-default btn-md round" onclick="addToCart(event, '<%= @product.slug %>', '#product_qty');">
|
||||
<i class="fa fa-shopping-basket mr-5"></i>Dodaj do koszyka</button>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- end col -->
|
||||
</div>
|
||||
<!-- end row -->
|
||||
</div>
|
||||
<!-- end modal-body -->
|
||||
</div>
|
||||
<!-- end modal-content -->
|
||||
</div>
|
||||
<!-- end modal-dialog -->
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
$('.productQuickView').html("<%= j render '/product/partials/show' %>");
|
||||
$('.productQuickView').modal('show');
|
||||
Loading…
Reference in New Issue