[RUBY] Create an EC site with Rails5 ⑦ ~ Address, Genre model ~

Introduction

This is a continuation of the series that creates an EC site where you can shop at a fictitious bakery, Create an EC site with Rails 5 ⑥. This time, we will return to the implementation of the main body of the application and create the area around the Address model that manages the shipping address of purchased bread and the Genre model that organizes products.

Source code

https://github.com/Sn16799/bakeryFUMIZUKI

Model association

Address controller

app/controllers/addresses_controller.rb

class AddressesController < ApplicationController

  before_action :authenticate_customer!
  before_action :set_customer

  def edit
    @address = Address.find(params[:id])
    if @address.customer_id != current_customer.id
      redirect_back(fallback_location: root_path)
      flash[:danger] = 'I can't access the page I'm looking for.'
    end
  end

  def index
    @address = Address.new
    @addresses = @customer.addresses
  end

  def create
    @address = @customer.addresses.build(address_params)
    if @address.save
      flash[:success] = 'I have registered a new address!'
      redirect_to addresses_path
    else
      @addresses = @customer.addresses
      flash[:danger] = 'Please check the input contents. Is each input field filled in with two or more characters?'
      render :index
    end
  end

  def update
    @address = Address.find(params[:id])
    if @address.update(address_params)
      flash[:success] = 'Address information has been updated!'
      redirect_to addresses_path
    else
      flash[:danger] = 'Please check the input contents. Is each input field filled in with two or more characters?'
      render :edit
    end
  end

  def destroy
    @address = Address.find(params[:id])
    @address.destroy
    flash[:info] = 'The registered address has been deleted.'
    redirect_to addresses_path
  end

  private

  def set_customer
    @customer = current_customer
  end

  def address_params
    params.require(:address).permit(:post_code, :address, :addressee)
  end
end

index screen

html:app/views/addresses/index.html.erb

<div class="col-lg-10 offset-lg-1 offset-1 space">
  <div class="container-fluid">
    <h2>
      <span style="display: inline-block;">Shipping address</span>
      <span style="display: inline-block;">Registration/List</span>
    </h2>
  </div>
  <!--New address form-->
  <div class="container space">
    <h3>Register a new address</h3>
    <%= form_with(model: @address, local: true, class: 'container-fluid') do |f| %>
    <div class="form-group">
      <%= f.label :Zip code (without hyphens)%>
      <%= f.text_field :post_code, class: 'form-control' %>
    </div>
    <div class="form-group">
      <%= f.label :Street address%>
      <%= f.text_field :address, class: 'form-control' %>
    </div>
    <div class="form-group">
      <%= f.label :address%>
      <%= f.text_field :addressee, class: 'form-control' %>
    </div>
    <div class="action w-25 offset-lg-11">
      <%= f.submit 'sign up', class: 'btn btn-danger' %>
    </div>
    <% end %>
  </div>

  <!--Address list-->
  <div class="container space">
    <h3>Address list</h3>
    <div class="row">
      <div class="col-lg-3">
        <strong>Postal code</strong>
      </div>
      <div class="col-lg-3">
        <strong>Street address</strong>
      </div>
      <div class="col-lg-3">
        <strong>address</strong>
      </div>
    </div>
    <% @addresses.each do |address| %>
    <div class="row">
      <div class="col-lg-3">
        <%= address.post_code %>
      </div>
      <div class="col-lg-3">
        <%= address.address %>
      </div>
      <div class="col-lg-3">
        <%= address.addressee %>
      </div>
      <div class="col-lg-3">
        <%= link_to "To edit", edit_address_path(address), class:"btn btn-danger" %>
        <%= link_to "delete", address_path(address), method: :delete, class:"btn btn-danger" %>
      </div>
    </div>
    <% end %>
  </div>
</div>

edit screen

html:app/views/addresses/edit.html.erb

<div class="col-lg-10 offset-lg-1 space">
  <div class="container">
    <h2>Edit shipping address</h2>
    <%= form_with(model: @address, local: true) do |f| %>
    <div class="form-group">
      <%= f.label :Zip code (without hyphens)%>
      <%= f.text_field :post_code, autofocus: true, class: 'form-control' %>
    </div>
    <div class="form-group">
      <%= f.label :Street address%>
      <%= f.text_field :address, class: 'form-control' %>
    </div>
    <div class="form-group">
      <%= f.label :address%>
      <%= f.text_field :addressee, class: 'form-control' %>
    </div>
    <div class="action w-25 offset-lg-11">
      <%= f.submit 'Update', class: 'btn btn-danger' %>
    </div>
    <% end %>
  </div>
</div>

Genre controller

app/controllers/genres_controoler.rb

class GenresController < ApplicationController

  def show
    @genre = Genre.find(params[:id])
    @genres = Genre.where(validity: true)
    @products = @genre.products.page(params[:page]).per(9)
  end

  private

  def genre_params
    params.require(:genre).permit(:name,:id)
  end
end

index Although the file name is index, there is no product genre list screen, and this file is called as a partial template on some pages so that it can be narrowed down and displayed by genre. It's essentially a sidebar.

html:app/views/genres/_index.html.erb

<div id="sidebar" class="col-lg-2">
  <table class='table'>
  <thead>
    <tr>
      <th>Genre search</th>
    </tr>
  </thead>
  <tbody>
    <% genres.each do |genre| %>
    <tr>
      <td><%= link_to  genre.name, genre_path(genre) %></td>
    </tr>
    <% end %>
    <tr>
      <td><%= link_to "⇒ See all products", products_path, class: 'dark-blue-letter' %></td>
    </tr>
  </tbody>
</table>
</div>

show screen

The detailed screen of the product genre is a screen that narrows down and displays the products that belong to the genre such as "bread" and "delicatessen bread".

html:app/views/genres/show.html.erb

<div class="col-lg-10 space">
  <div class="container">
  <h2><%= @genre.name %>List (all<%= @genre.products.count %>seed)</h2>
</div>
  <div class="container">
    <% @genre.products.each do |gp| %>
      <%= render 'products/box', product: gp %>
    <% end %>
  </div>
</div>
<%= render 'genres/index', genres: @genres %>

* Partial template

html:app/views/products/_box.html.erb

<div class="col-lg-4 product-box space">
  <%= link_to product_path(product) do %>
    <div class="row">
      <h4><%= product.name %></h4>
    </div>
    <div class="row">
      <%= attachment_image_tag(product, :image, :fill, 220, 180, fallback:  'no_img.jpg') %>
    </div>
  <% end %>
  <div class="row">
    <h4><%= price_include_tax(product.price) %></h4>
  </div>
</div>

Only ** tax-excluded ** price is saved in the database, but I want to set it to ** tax-included ** price on the screen display. In such a case, use the helper method.

helper

app/helpers/application_helper.rb

  def price_include_tax(price)
    price = price * 1.08
    "#{price.round}Circle"
  end

Postscript

Both Address and Genre have only standard CRUD functions, so I think I was able to do it with almost no hesitation. It will be difficult from now on ... The Order model with the order function was a lot of work when I made it before, but can I make it a responsive screen and reproduce it with more concise code? Continue to next time!