🐙

【ECサイト】会員機能実装(管理者側)

2023/07/17に公開

実装内容

管理者側:

  1. 会員一覧画面
  2. 会員詳細画面
  3. 会員編集画面

Modelの実装

app/models/customer.rb
class Customer < ApplicationRecord
  # Include default devise modules. Others available are:
  # :confirmable, :lockable, :timeoutable, :trackable and :omniauthable
  devise :database_authenticatable, :registerable,
         :recoverable, :rememberable, :validatable
         
  has_many :addresses, dependent: :destroy
  has_many :cart_items, dependent: :destroy
  has_many :orders, dependent: :destroy
  
  def full_name
    last_name + '' + first_name
  end
  
  def full_name_kana
    last_name_kana + '' + first_name_kana
  end
  
  def customer_status
    if is_deleted == true
      "退会"
    else
      "有効"
    end
  end
  
  def active_for_authentication?
    super && (is_deleted == false)
  end
end

解説:

  • full_neme
    last_name(姓)とfirst_name(名)を結合してフルネームを返すようにする。

  • customer_stats
    is_deletedフラグに基づいて、顧客のステータス(有効 or 退会)を返すようにする。

-active_for_authentication?
退会したユーザーがログインできないようにするためのメソッド。
super:親クラス(ここではdevise)に定義された同じ名前(active_for_authentication?)のメソッドを呼び出す。 (is_deleted == false)is_deletedfalseであれば真を返す。 つまり、deviseの認証が有効で、かつユーザーが退会していない状態(is_deletedfalse`)であるユーザーだけが認証できるようになる。

Routing設定

ルーティングを記載する。

config/routes_rb
Rails.application.routes.draw do
 :
 :
 namespace :admin do
   resources :customers, only: [:index, :show, :edit, :update]
 end
end

Controller作成

adminフォルダ内にcustomersコントローラを作成。

ターミナル
rails g controller admin/customers

以下を追記。

app/controllers/admin/customers_controller.rb
class Admin::CustomersController < ApplicationController

  def index
    @customers = Customer.all
  end

  def show
    @customer = Customer.find(params[:id])
  end

  def edit
    @customer = Customer.find(params[:id])
  end

  def update
    customer = Customer.find(params[:id])
    customer.update(customer_params)
    redirect_to admin_customers_path(customer)
  end

  private

  def customer_params
    params.require(:customer).permit(:last_name, :first_name, :last_name_kana, :first_name_kana, :email, :address, :postcode, :phone_number, :is_deleted)
  end
end

Viewページ作成

  • 会員一覧ページ
app/views/admin/customers/index.html.erb
<div class="container">
  <div class="row">
    <div class="col">
      <h4 class="my-5">会員一覧</h4>
        <table class="table">
          <thead>
            <tr>
              <th>会員ID</th>
              <th>氏名</th>
              <th>メールアドレス</th>
              <th>ステータス</th>
            </tr>
          </thead>
          <% @customers.each do |customer| %>
            <tr>
              <td><%= customer.id %></td>
              <td><%= link_to customer.full_name, admin_customer_path(customer) %></td>
              <td><%= customer.email %></td>
              <td><%= customer.customer_status %></td>
            </tr>
          <% end %>
        </table>
    </div>
  </div>
</div>
  • イメージ

  • 会員詳細ページ

app/views/admin/customers/show.html.erb
<div class="container">
  <div class="row">
    <div class="col">
      <h4 class="my-5"><%= @customer.full_name %>さんの会員詳細</h4>
      <div class="d-flex align-items-center">
        <table class="table table-borderless">
          <tr>
            <th>会員ID</td>
            <td><%= @customer.id %></td>
          </tr>
          <tr>
            <th>氏名</td>
            <td><%= @customer.last_name %> <%= @customer.first_name %></td>
          </tr>
  
          <tr>
            <th>フリガナ</th>
            <td><%= @customer.last_name_kana %> <%= @customer.first_name_kana %></td>
          </tr>
  
          <tr>
            <th>郵便番号</th>
            <td><%= @customer.postcode %></td>
          </tr>
  
          <tr>
            <th>住所</th>
            <td><%= @customer.address %></td>
          </tr>
  
          <tr>
            <th>電話番号</th>
            <td><%= @customer.phone_number %></td>
          </tr>
  
          <tr>
            <th>メールアドレス</th>
            <td><%= @customer.email %></td>
          </tr>

          <tr>
            <th>会員ステータス</th>
            <th><%= @customer.customer_status %></th>
          </tr>

          <tr>
            <td></td>
            <td><%= link_to "編集する", edit_admin_customer_path, class:"btn btn-success" %>
            <%= link_to "注文履歴一覧を見る", "#", class:"btn btn-primary" %></td>
          </tr>
        </table>
      </div>
    </div>
  </div>
</div>
  • イメージ

  • 会員編集ページ

app/views/admin/customers/edit.html.erb
<div class="container">
  <div class="row">
    <div class="col">
      <h4 class="my-5"><%= @customer.full_name %>さんの会員情報編集</h4>
      <table class="table table-borderless">
        <%= form_with model: [:admin, @customer] do |f| %>
        <tr>
          <td>会員ID</td>
          <td><%= @customer.id %></td>
        </tr>
        
        <tr>
          <td>氏名</td>
          <td><%= f.text_field :last_name %> <%= f.text_field :first_name %></td>
        </tr>

        <tr>
          <td>フリガナ</td>
          <td><%= f.text_field :last_name_kana %> <%= f.text_field :first_name_kana %></td>
        </tr>

        <tr>
          <td>郵便番号</td>
          <td><%= f.text_field :postcode %></td>
          <td></td>
        </tr>

        <tr>
          <td>住所</td>
          <td><%= f.text_field :address %></td>
          <td></td>
        </tr>

        <tr>
          <td>電話番号</td>
          <td><%= f.text_field :phone_number %></td>
          <td></td>
        </tr>

        <tr>
          <td>メールアドレス</td>
          <td><%= f.text_field :email %></td>
          <td></td>
        </tr>
        
        <tr>
          <td>会員ステータス</td>
          <td>
            <%= f.radio_button :is_deleted, :false %>
            <%= f.label :is_deleted, "有効", { value: :false }  %>
            
            <%= f.radio_button :is_deleted, :true %>
            <%= f.label :is_deleted, "退会", { value: :true } %>
          </td>
        </tr>
        
        <tr>
          <td></td>
          <td><%= f.submit "変更を保存", class:"btn btn-success" %></td>
        </tr>
        <% end %>
      </table>
    </div>
  </div>
</div>
  • イメージ

Discussion